diff --git a/packages/panel/src/components/Panel.svelte b/packages/panel/src/components/Panel.svelte index 2c2ed5369d..6f247663bc 100644 --- a/packages/panel/src/components/Panel.svelte +++ b/packages/panel/src/components/Panel.svelte @@ -14,7 +14,7 @@ // limitations under the License. --> <script lang="ts"> - import { afterUpdate } from 'svelte' + import { afterUpdate, createEventDispatcher, onMount } from 'svelte' import { Writable, writable } from 'svelte/store' import activity from '@hcengineering/activity' @@ -56,6 +56,8 @@ let lastScrollHeight: number = -1 let count: number = 0 + const dispatch = createEventDispatcher() + const waitCount = 10 const PanelScrollTop: Writable<Record<string, number>> = writable<Record<string, number>>({}) @@ -86,6 +88,10 @@ startScrollHeightCheck() } }) + + onMount(() => { + dispatch('open') + }) </script> <Panel diff --git a/packages/ui/src/components/PanelInstance.svelte b/packages/ui/src/components/PanelInstance.svelte index e0ceefe2cc..bd0f9ab351 100644 --- a/packages/ui/src/components/PanelInstance.svelte +++ b/packages/ui/src/components/PanelInstance.svelte @@ -89,8 +89,20 @@ } } + function _open (): void { + if (modalHTML && props) { + if (props.element === 'content') { + modalHTML.classList.add('bg') + } else { + modalHTML.classList.remove('bg') + } + } + } + const _update = (): void => { - if (props) fitPopup(props, contentPanel) + if (props) { + fitPopup(props, contentPanel) + } } afterUpdate(() => { @@ -120,7 +132,7 @@ <slot name="panel-header" /> <div class="panel-instance" - class:bg={props.element === 'content'} + class:bg={false} bind:this={modalHTML} style:top={options?.props?.top} style:bottom={options?.props?.bottom} @@ -142,6 +154,7 @@ rightSection={props.rightSection} position={props.element} bind:popupOptions={options} + on:open={_open} on:close={_close} on:update={_update} /> diff --git a/plugins/document-resources/src/components/EditDoc.svelte b/plugins/document-resources/src/components/EditDoc.svelte index 13293386d3..f4ae649685 100644 --- a/plugins/document-resources/src/components/EditDoc.svelte +++ b/plugins/document-resources/src/components/EditDoc.svelte @@ -380,6 +380,7 @@ bind:innerWidth floatAside={false} useMaxWidth={true} + on:open on:close={() => dispatch('close')} > <svelte:fragment slot="navigator"> diff --git a/plugins/tracker-resources/src/components/issues/edit/EditIssue.svelte b/plugins/tracker-resources/src/components/issues/edit/EditIssue.svelte index 61846bd39e..f9748611ac 100644 --- a/plugins/tracker-resources/src/components/issues/edit/EditIssue.svelte +++ b/plugins/tracker-resources/src/components/issues/edit/EditIssue.svelte @@ -35,7 +35,7 @@ showPopup } from '@hcengineering/ui' import { ActionContext, ContextMenu, DocNavLink, UpDownNavigator, contextStore } from '@hcengineering/view-resources' - import { createEventDispatcher, onDestroy, onMount } from 'svelte' + import { createEventDispatcher, onDestroy } from 'svelte' import { generateIssueShortLink, getIssueId } from '../../../issues' import tracker from '../../../plugin' import IssueStatusActivity from '../IssueStatusActivity.svelte' @@ -140,10 +140,6 @@ } } - onMount(() => { - dispatch('open', { ignoreKeys: ['comments', 'name', 'description', 'number'] }) - }) - const manager = createFocusManager() export function canClose (): boolean { if (descriptionBox.isFocused()) { @@ -176,6 +172,7 @@ {embedded} withoutTitle bind:innerWidth + on:open on:close={() => dispatch('close')} > <svelte:fragment slot="navigator"> diff --git a/plugins/view-resources/src/components/EditDoc.svelte b/plugins/view-resources/src/components/EditDoc.svelte index 0eb175ecf9..b3d08cfeaa 100644 --- a/plugins/view-resources/src/components/EditDoc.svelte +++ b/plugins/view-resources/src/components/EditDoc.svelte @@ -283,6 +283,7 @@ isAside={true} bind:panelWidth bind:innerWidth + on:open on:update={(ev) => _update(ev.detail)} on:close={() => { dispatch('close')