diff --git a/packages/text-editor/src/components/ReferenceInput.svelte b/packages/text-editor/src/components/ReferenceInput.svelte
index 19415734b9..842d0f8fcb 100644
--- a/packages/text-editor/src/components/ReferenceInput.svelte
+++ b/packages/text-editor/src/components/ReferenceInput.svelte
@@ -344,12 +344,14 @@
textEditor.clear()
}
}}
- on:on:blur={() => {
+ on:blur={() => {
focused = false
+ dispatch('blur', focused)
}}
on:focus={() => {
focused = true
updateFocus()
+ dispatch('focus', focused)
}}
extensions={[completionPlugin]}
on:selection-update={updateFormattingState}
diff --git a/packages/ui/src/components/TooltipInstance.svelte b/packages/ui/src/components/TooltipInstance.svelte
index be12b16396..6c2f219517 100644
--- a/packages/ui/src/components/TooltipInstance.svelte
+++ b/packages/ui/src/components/TooltipInstance.svelte
@@ -161,7 +161,9 @@
const inPopup: boolean =
ev.x >= rectP.left && ev.x <= rectP.right && ev.y >= rectP.top - dT && ev.y <= rectP.bottom + dB
- if ((tooltipSW && !inTrigger) || !(inTrigger || inPopup)) hideTooltip()
+ if ($tooltip.kind !== 'popup') {
+ if ((tooltipSW && !inTrigger) || !(inTrigger || inPopup)) hideTooltip()
+ }
}
}
@@ -170,15 +172,27 @@
onDestroy(() => hideTooltip())
+{#if $tooltip.kind === 'popup'}
+
closeTooltip()}
+ on:keydown|stopPropagation|preventDefault={() => {}}
+ />
+{/if}
+
{
+ if ($tooltip.kind !== 'popup') {
+ hideTooltip()
+ }
+ }}
on:mousemove={(ev) => {
whileShow(ev)
}}
on:keydown={(evt) => {
- if (($tooltip.component || $tooltip.label) && evt.key === 'Escape') {
+ if (($tooltip.component || $tooltip.label) && evt.key === 'Escape' && $tooltip.kind !== 'popup') {
evt.preventDefault()
evt.stopImmediatePropagation()
hideTooltip()
@@ -211,6 +225,9 @@
{
+ $tooltip = { ...$tooltip, ...evt.detail }
+ }}
on:update={onUpdate !== undefined ? onUpdate : async () => {}}
/>
{/if}
@@ -430,4 +447,15 @@
content: none;
}
}
+ .modal-overlay {
+ z-index: 10000;
+
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100vh;
+ pointer-events: all;
+ touch-action: none;
+ }
diff --git a/packages/ui/src/tooltips.ts b/packages/ui/src/tooltips.ts
index 9ccee4af47..5fe271c082 100644
--- a/packages/ui/src/tooltips.ts
+++ b/packages/ui/src/tooltips.ts
@@ -64,7 +64,7 @@ export function showTooltip (
props?: any,
anchor?: HTMLElement,
onUpdate?: (result: any) => void,
- kind?: 'tooltip' | 'submenu'
+ kind?: 'tooltip' | 'submenu' | 'popup'
): void {
storedValue = {
label,
@@ -74,9 +74,19 @@ export function showTooltip (
props,
anchor,
onUpdate,
- kind: kind ?? 'tooltip'
+ kind: undefined
}
- tooltipstore.set(storedValue)
+ tooltipstore.update((old) => {
+ if (old.component === storedValue.component) {
+ if (old.kind !== undefined && storedValue.kind === undefined) {
+ storedValue.kind = old.kind
+ }
+ if (storedValue.kind === undefined) {
+ storedValue.kind = 'tooltip'
+ }
+ }
+ return storedValue
+ })
}
export function closeTooltip (): void {
diff --git a/packages/ui/src/types.ts b/packages/ui/src/types.ts
index d59cb18729..5b07e5eba4 100644
--- a/packages/ui/src/types.ts
+++ b/packages/ui/src/types.ts
@@ -237,7 +237,7 @@ export interface LabelAndProps {
props?: any
anchor?: HTMLElement
onUpdate?: (result: any) => void
- kind?: 'tooltip' | 'submenu'
+ kind?: 'tooltip' | 'submenu' | 'popup'
}
export interface ListItem {
diff --git a/plugins/attachment-resources/src/components/AttachmentRefInput.svelte b/plugins/attachment-resources/src/components/AttachmentRefInput.svelte
index ee11f491af..f725cb7c51 100644
--- a/plugins/attachment-resources/src/components/AttachmentRefInput.svelte
+++ b/plugins/attachment-resources/src/components/AttachmentRefInput.svelte
@@ -286,6 +286,8 @@
{labelSend}
{showSend}
{loading}
+ on:focus
+ on:blur
on:message={onMessage}
haveAttachment={attachments.size > 0}
withoutTopBorder={attachments.size > 0}
diff --git a/plugins/chunter-resources/src/components/CommentInput.svelte b/plugins/chunter-resources/src/components/CommentInput.svelte
index f83377c26f..5af1071e4b 100644
--- a/plugins/chunter-resources/src/components/CommentInput.svelte
+++ b/plugins/chunter-resources/src/components/CommentInput.svelte
@@ -118,5 +118,7 @@
{shouldSaveDraft}
on:message={onMessage}
on:update={onUpdate}
+ on:focus
+ on:blur
bind:loading
/>
diff --git a/plugins/chunter-resources/src/components/CommentPopup.svelte b/plugins/chunter-resources/src/components/CommentPopup.svelte
index 739ef71241..8efbb81831 100644
--- a/plugins/chunter-resources/src/components/CommentPopup.svelte
+++ b/plugins/chunter-resources/src/components/CommentPopup.svelte
@@ -18,7 +18,7 @@
import chunter, { Comment } from '@hcengineering/chunter'
import { createQuery } from '@hcengineering/presentation'
- import { Label, resizeObserver, Spinner } from '@hcengineering/ui'
+ import { Label, resizeObserver, Spinner, closeTooltip } from '@hcengineering/ui'
import { DocNavLink, ObjectPresenter } from '@hcengineering/view-resources'
import { createEventDispatcher } from 'svelte'
import CommentInput from './CommentInput.svelte'
@@ -42,6 +42,11 @@
{ sort: { modifiedOn: SortingOrder.Ascending } }
)
const dispatch = createEventDispatcher()
+ let commentMode = false
+
+ $: if (commentMode) {
+ dispatch('tooltip', { kind: 'popup' })
+ }
@@ -50,6 +55,14 @@
use:resizeObserver={() => {
dispatch('changeContent')
}}
+ on:keydown={(evt) => {
+ console.log(evt)
+ if (commentMode) {
+ evt.preventDefault()
+ evt.stopImmediatePropagation()
+ closeTooltip()
+ }
+ }}
>
@@ -73,7 +86,12 @@
{#if withInput}
-
+ {
+ commentMode = true
+ }}
+ />
{/if}