@threadlabs/looma 0.1.17 → 0.1.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -1
- package/dist/{chunk-OY4D3W4U.js → chunk-NMV2BBWK.js} +29 -29
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/looma.cjs.js +1 -1
- package/dist/cjs/ui-context-menu.cjs.entry.js +5 -2
- package/dist/cjs/ui-tree-item.cjs.entry.js +2 -2
- package/dist/collection/components/ui-context-menu/ui-context-menu.css +4 -0
- package/dist/collection/components/ui-context-menu/ui-context-menu.js +6 -2
- package/dist/collection/components/ui-tree-item/ui-tree-item.css +2 -2
- package/dist/collection/components/ui-tree-item/ui-tree-item.js +1 -1
- package/dist/components/ui-context-menu.js +1 -1
- package/dist/components/ui-tree-item.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/looma.js +1 -1
- package/dist/esm/ui-context-menu.entry.js +5 -2
- package/dist/esm/ui-tree-item.entry.js +2 -2
- package/dist/index.cjs +8 -5
- package/dist/index.js +2 -2
- package/dist/looma/looma.esm.js +1 -1
- package/dist/looma/p-063f5a89.entry.js +1 -0
- package/dist/looma/{p-d01960c2.entry.js → p-54722713.entry.js} +1 -1
- package/dist/types/components/ui-context-menu/ui-context-menu.d.ts +3 -0
- package/dist/{ui-affordance-scope.entry-X7DTKJGL.js → ui-affordance-scope.entry-2CJOZHBF.js} +1 -1
- package/dist/{ui-avatar-group.entry-MC34FKAN.js → ui-avatar-group.entry-WMDVHRVT.js} +1 -1
- package/dist/{ui-avatar.entry-OKRQWTQV.js → ui-avatar.entry-SHX6AOME.js} +1 -1
- package/dist/{ui-badge.entry-RI7JB7KV.js → ui-badge.entry-S5VSVEBD.js} +1 -1
- package/dist/{ui-button.entry-PFO5TTPN.js → ui-button.entry-HVSZQOA3.js} +1 -1
- package/dist/{ui-checkbox.entry-UHFWVISP.js → ui-checkbox.entry-2DWUSIEP.js} +1 -1
- package/dist/{ui-context-menu.entry-AIXB6U5D.js → ui-context-menu.entry-ZCGK2ZM3.js} +6 -3
- package/dist/{ui-dialog.entry-LPREQH2T.js → ui-dialog.entry-XVTGSOKV.js} +1 -1
- package/dist/{ui-disclosure.entry-7XCUIYVZ.js → ui-disclosure.entry-Z4UNBYPO.js} +1 -1
- package/dist/{ui-floating-action-button.entry-5PNIMUAW.js → ui-floating-action-button.entry-7QXOFMZ2.js} +1 -1
- package/dist/{ui-form-field.entry-77YW46SM.js → ui-form-field.entry-ENMTDKN2.js} +1 -1
- package/dist/{ui-icon-button.entry-4AD6ALPQ.js → ui-icon-button.entry-4DMRMHP2.js} +1 -1
- package/dist/{ui-input.entry-E7E6QDTV.js → ui-input.entry-JQROBMAB.js} +1 -1
- package/dist/{ui-menu-item.entry-H3HFLUB6.js → ui-menu-item.entry-4KZUH65O.js} +1 -1
- package/dist/{ui-menu.entry-UAKZU4HG.js → ui-menu.entry-HEKD6EUJ.js} +1 -1
- package/dist/{ui-popover.entry-GVQKX26B.js → ui-popover.entry-MP5QS5WD.js} +1 -1
- package/dist/{ui-radio-group.entry-MNSR6UEE.js → ui-radio-group.entry-YWXQLMSD.js} +1 -1
- package/dist/{ui-radio.entry-6D4WTI5E.js → ui-radio.entry-TYQ36J2G.js} +1 -1
- package/dist/{ui-search-result-row.entry-J2TILUH2.js → ui-search-result-row.entry-EV73E2AD.js} +1 -1
- package/dist/{ui-search-shell.entry-FSWHEZQF.js → ui-search-shell.entry-RRS62AZU.js} +1 -1
- package/dist/{ui-select.entry-JRCYYNNW.js → ui-select.entry-NJRM2C2R.js} +1 -1
- package/dist/{ui-switch.entry-YZWMNRP2.js → ui-switch.entry-JNWSBOIW.js} +1 -1
- package/dist/{ui-tabs.entry-F2Y344JY.js → ui-tabs.entry-JNBWW2G3.js} +1 -1
- package/dist/{ui-textarea.entry-3EZCUUAK.js → ui-textarea.entry-CDCRB2S3.js} +1 -1
- package/dist/{ui-toast-region.entry-BTV4AW3I.js → ui-toast-region.entry-QLPSSQ5I.js} +1 -1
- package/dist/{ui-tooltip.entry-U644CF5U.js → ui-tooltip.entry-FAZT5VYK.js} +1 -1
- package/dist/{ui-top-bar.entry-FGGOREQR.js → ui-top-bar.entry-LNUHSZSM.js} +1 -1
- package/dist/{ui-tree-item.entry-XVMHEONY.js → ui-tree-item.entry-TLYU63UE.js} +3 -3
- package/dist/{ui-tree.entry-4R7DYGAM.js → ui-tree.entry-3OF7ZPOH.js} +1 -1
- package/editor/{chunk-RTHHTPWK.js → chunk-3QMBK3XZ.js} +245 -41
- package/editor/{chunk-OHD4OS32.js → chunk-OXFYYLUC.js} +632 -236
- package/editor/{chunk-CX4QDKSV.js → chunk-ZOUKEZ77.js} +21 -1
- package/editor/extensions/index.d.ts +49 -1
- package/editor/extensions/index.js +15 -3
- package/editor/index.d.ts +3 -2
- package/editor/index.js +16 -4
- package/editor/ui.d.ts +9 -1
- package/editor/ui.js +2 -2
- package/editor.css +170 -0
- package/package.json +1 -1
- package/styles.css +1 -7
- package/vue/editor/index.d.ts +103 -4
- package/vue/editor/index.js +137 -63
- package/dist/looma/p-ba01f45d.entry.js +0 -1
|
@@ -7,7 +7,7 @@ import {
|
|
|
7
7
|
getElement,
|
|
8
8
|
h,
|
|
9
9
|
registerInstance
|
|
10
|
-
} from "./chunk-
|
|
10
|
+
} from "./chunk-NMV2BBWK.js";
|
|
11
11
|
|
|
12
12
|
// dist/esm/ui-input.entry.js
|
|
13
13
|
var uiInputCss = () => `:host{display:inline-flex;color:var(--ui-text-primary)}::slotted(input){width:100%;appearance:none;border:1px solid var(--ui-border-default);border-radius:var(--ui-radius-2);background:var(--ui-surface-default);color:inherit;font:inherit;line-height:var(--ui-line-height-md);padding:var(--ui-space-2) var(--ui-space-3);margin:0;transition:border-color var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease), background-color var(--ui-motion-fast) var(--ui-motion-ease)}::slotted(input:hover:not(:focus):not(:disabled)){border-color:var(--ui-border-strong)}::slotted(input:focus){border-color:var(--ui-focus-ring);box-shadow:0 0 0 3px var(--ui-accent-soft)}:host([data-invalid='true'])::slotted(input),::slotted(input[aria-invalid='true']){border-color:var(--ui-accent-active)}::slotted(input:disabled){background:var(--ui-surface-muted);color:var(--ui-text-muted);cursor:not-allowed}::slotted(input:focus-visible){outline:2px solid var(--ui-focus-ring);outline-offset:2px}`;
|
|
@@ -2,7 +2,7 @@ import {
|
|
|
2
2
|
Host,
|
|
3
3
|
h,
|
|
4
4
|
registerInstance
|
|
5
|
-
} from "./chunk-
|
|
5
|
+
} from "./chunk-NMV2BBWK.js";
|
|
6
6
|
|
|
7
7
|
// dist/esm/ui-menu-item.entry.js
|
|
8
8
|
var uiMenuItemCss = () => `:host{display:block;width:100%;padding:var(--ui-space-2) var(--ui-space-3);text-align:left;background:none;border:none;border-radius:var(--ui-radius-2);color:var(--ui-text-primary);font-size:var(--ui-font-size-md);font-weight:var(--ui-font-medium, 500);cursor:pointer;transition:background-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease)}:host(:hover:not([aria-disabled='true']):not([disabled])){background:var(--ui-surface-subtle)}:host([aria-disabled='true']),:host([disabled]){opacity:0.6;cursor:not-allowed}`;
|
|
@@ -15,7 +15,7 @@ import {
|
|
|
15
15
|
getElement,
|
|
16
16
|
h,
|
|
17
17
|
registerInstance
|
|
18
|
-
} from "./chunk-
|
|
18
|
+
} from "./chunk-NMV2BBWK.js";
|
|
19
19
|
|
|
20
20
|
// dist/esm/ui-menu.entry.js
|
|
21
21
|
var uiMenuCss = () => `:host{--ui-menu-viewport-gap:var(--ui-space-2, 0.5rem);display:flex;flex-direction:column;inline-size:max-content;min-inline-size:min(12rem, calc(100vw - (var(--ui-menu-viewport-gap) * 2)));max-inline-size:calc(100vw - (var(--ui-menu-viewport-gap) * 2));padding:var(--ui-space-1);background:var(--ui-surface-elevated);border:1px solid var(--ui-border-default);border-radius:var(--ui-radius-3);box-shadow:var(--ui-shadow-lg)}:host(:not([data-open])){display:none}:host([popover]){position:fixed;inset:auto;margin:0;overflow:auto;max-block-size:calc(100dvh - (var(--ui-menu-viewport-gap) * 2));opacity:0;transform:translateY(-4px) scale(0.99);transition:opacity var(--ui-motion-fast) var(--ui-motion-ease), transform var(--ui-motion-fast) var(--ui-motion-ease), display var(--ui-motion-fast) allow-discrete, overlay var(--ui-motion-fast) allow-discrete}:host([popover]:popover-open){opacity:1;transform:translateY(0) scale(1)}@starting-style{:host([popover]:popover-open){opacity:0;transform:translateY(-4px) scale(0.99)}}:host([hidden]){display:none !important}@media (prefers-reduced-motion: reduce){:host([popover]){transition:none}}::slotted(ui-menu-item){display:block;width:100%;padding:var(--ui-space-2) var(--ui-space-3);text-align:left;background:none;border:none;border-radius:var(--ui-radius-2);color:var(--ui-text-primary);font-size:var(--ui-font-size-md);font-weight:var(--ui-font-medium, 500);cursor:pointer;transition:background-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease)}::slotted(ui-menu-item:hover:not([aria-disabled='true']):not([disabled])){background:var(--ui-surface-subtle)}::slotted(ui-menu-item[aria-disabled='true']),::slotted(ui-menu-item[disabled]){opacity:0.6;cursor:not-allowed}`;
|
|
@@ -14,7 +14,7 @@ import {
|
|
|
14
14
|
getElement,
|
|
15
15
|
h,
|
|
16
16
|
registerInstance
|
|
17
|
-
} from "./chunk-
|
|
17
|
+
} from "./chunk-NMV2BBWK.js";
|
|
18
18
|
|
|
19
19
|
// dist/esm/ui-popover.entry.js
|
|
20
20
|
var uiPopoverCss = () => `:host{--ui-popover-viewport-gap:var(--ui-space-2, 0.5rem);padding:var(--ui-space-3);background:var(--ui-surface-elevated);border:1px solid var(--ui-border-default);border-radius:var(--ui-radius-3);box-shadow:var(--ui-shadow-lg);max-inline-size:min( 20rem, calc(100vw - (var(--ui-popover-viewport-gap) * 2)) );max-block-size:calc(100dvh - (var(--ui-popover-viewport-gap) * 2));overflow:auto}:host(:not([data-open])){display:none}:host([popover]){position:fixed;inset:auto;margin:0;opacity:0;transform:translateY(-4px) scale(0.99);transition:opacity var(--ui-motion-fast) var(--ui-motion-ease), transform var(--ui-motion-fast) var(--ui-motion-ease), display var(--ui-motion-fast) allow-discrete, overlay var(--ui-motion-fast) allow-discrete}:host([popover]:popover-open){opacity:1;transform:translateY(0) scale(1)}@starting-style{:host([popover]:popover-open){opacity:0;transform:translateY(-4px) scale(0.99)}}:host([hidden]){display:none !important}@media (prefers-reduced-motion: reduce){:host([popover]){transition:none}}`;
|
|
@@ -7,7 +7,7 @@ import {
|
|
|
7
7
|
getElement,
|
|
8
8
|
h,
|
|
9
9
|
registerInstance
|
|
10
|
-
} from "./chunk-
|
|
10
|
+
} from "./chunk-NMV2BBWK.js";
|
|
11
11
|
|
|
12
12
|
// dist/esm/ui-radio-group.entry.js
|
|
13
13
|
var uiRadioGroupCss = () => `:host{display:inline-flex;align-items:center;gap:var(--ui-space-2)}:host([data-orientation='vertical']){display:inline-grid;justify-items:start}`;
|
|
@@ -7,7 +7,7 @@ import {
|
|
|
7
7
|
getElement,
|
|
8
8
|
h,
|
|
9
9
|
registerInstance
|
|
10
|
-
} from "./chunk-
|
|
10
|
+
} from "./chunk-NMV2BBWK.js";
|
|
11
11
|
|
|
12
12
|
// dist/esm/ui-radio.entry.js
|
|
13
13
|
var uiRadioCss = () => `:host{display:inline-flex;align-items:center;gap:var(--ui-space-2);color:var(--ui-text-primary)}:host([data-disabled='true']),:host([aria-disabled='true']){opacity:0.6;cursor:not-allowed}::slotted(input[type='radio']){accent-color:var(--ui-accent-solid);cursor:pointer}::slotted(input[type='radio']:focus-visible){outline:2px solid var(--ui-accent-solid);outline-offset:2px}`;
|
package/dist/{ui-search-result-row.entry-J2TILUH2.js → ui-search-result-row.entry-EV73E2AD.js}
RENAMED
|
@@ -2,7 +2,7 @@ import {
|
|
|
2
2
|
Host,
|
|
3
3
|
h,
|
|
4
4
|
registerInstance
|
|
5
|
-
} from "./chunk-
|
|
5
|
+
} from "./chunk-NMV2BBWK.js";
|
|
6
6
|
|
|
7
7
|
// dist/esm/ui-search-result-row.entry.js
|
|
8
8
|
var uiSearchResultRowCss = () => `:host{display:block}.search-result-row{appearance:none;inline-size:100%;min-block-size:var(--ui-search-result-row-min-height, 56px);margin:0;padding-block:var(--ui-search-result-row-padding-block, var(--ui-space-3, 0.75rem));padding-inline:var(--ui-search-result-row-padding-inline, var(--ui-space-4, 1rem));display:flex;align-items:flex-start;gap:var(--ui-search-result-row-gap, var(--ui-space-3, 0.75rem));background:var(--ui-search-result-row-bg, transparent);border:none;border-block-end:1px solid var(--ui-search-result-row-border, var(--ui-border, #e5e7eb));color:inherit;cursor:pointer;text-align:left;transition:background-color var(--ui-motion-fast, 160ms) var(--ui-motion-ease, ease)}:host(:last-child) .search-result-row{border-block-end:none}.search-result-row:hover:enabled{background:var(--ui-search-result-row-hover-bg, color-mix(in srgb, var(--ui-surface, #ffffff) 85%, black 3%))}:host([selected]) .search-result-row{background:var( --ui-search-result-row-selected-bg, var(--ui-search-result-row-hover-bg, color-mix(in srgb, var(--ui-surface, #ffffff) 85%, black 3%)) )}.search-result-row:focus-visible{outline:2px solid var(--ui-focus-ring, #2563eb);outline-offset:-2px}.search-result-row:disabled,:host([disabled]) .search-result-row{opacity:0.6;cursor:not-allowed}.search-result-row__leading,.search-result-row__trailing{display:inline-flex;align-items:flex-start;flex-shrink:0}.search-result-row__content{min-inline-size:0;flex:1;display:flex;flex-direction:column}.search-result-row__title,.search-result-row__meta,.search-result-row__excerpt{display:block;min-inline-size:0}[hidden]{display:none}::slotted([slot='title']),::slotted([slot='meta']),::slotted([slot='excerpt']){display:block;margin:0}`;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import {
|
|
2
2
|
h,
|
|
3
3
|
registerInstance
|
|
4
|
-
} from "./chunk-
|
|
4
|
+
} from "./chunk-NMV2BBWK.js";
|
|
5
5
|
|
|
6
6
|
// dist/esm/ui-search-shell.entry.js
|
|
7
7
|
var uiSearchShellCss = () => `:host{position:fixed;inset:0;z-index:var(--ui-search-shell-z-index, 400);display:block}.search-shell{position:absolute;inset:0;display:flex;align-items:flex-start;justify-content:center;padding-block-start:var(--ui-search-shell-padding-top, 10vh)}.search-shell__panel{position:relative;inline-size:min( calc(100% - (var(--ui-search-shell-margin-inline, var(--ui-space-4, 1rem)) * 2)), var(--ui-search-shell-max-width, 640px) );max-block-size:var(--ui-search-shell-max-height, 80vh);display:flex;flex-direction:column;overflow:hidden;background:var(--ui-search-shell-bg, var(--ui-surface, #ffffff));border:1px solid var(--ui-search-shell-border, var(--ui-border, #e5e7eb));border-radius:var(--ui-search-shell-radius, var(--ui-radius-xl, 1rem));box-shadow:var(--ui-search-shell-shadow, var(--ui-shadow-lg, 0 8px 24px rgba(0, 0, 0, 0.12)))}.search-shell__search,.search-shell__status,.search-shell__footer{flex-shrink:0}.search-shell__body{flex:1;min-block-size:0}[hidden]{display:none}@media (max-width: 767px){.search-shell{padding-block-start:0;align-items:stretch}.search-shell__panel{inline-size:100%;block-size:100vh;block-size:100dvh;max-block-size:none;border-radius:0;border-inline:none;border-block-start:none}}`;
|
|
@@ -7,7 +7,7 @@ import {
|
|
|
7
7
|
getElement,
|
|
8
8
|
h,
|
|
9
9
|
registerInstance
|
|
10
|
-
} from "./chunk-
|
|
10
|
+
} from "./chunk-NMV2BBWK.js";
|
|
11
11
|
|
|
12
12
|
// dist/esm/ui-select.entry.js
|
|
13
13
|
var uiSelectCss = () => `:host{display:inline-flex;color:var(--ui-text-primary)}::slotted(select){width:100%;appearance:none;border:1px solid var(--ui-border-default);border-radius:var(--ui-radius-2);background-color:var(--ui-surface-default);color:inherit;font:inherit;line-height:var(--ui-line-height-md);padding-block:var(--ui-select-padding-block, var(--ui-space-2));padding-inline-start:var(--ui-select-padding-inline-start, var(--ui-space-3));padding-inline-end:var(--ui-select-padding-inline-end, calc(var(--ui-space-6) + var(--ui-space-3)));margin:0;background-image:linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);background-position:calc(100% - 1rem) calc(50% - 2px), calc(100% - 0.7rem) calc(50% - 2px);background-size:0.35rem 0.35rem, 0.35rem 0.35rem;background-repeat:no-repeat;transition:border-color var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease), background-color var(--ui-motion-fast) var(--ui-motion-ease)}::slotted(select:hover:not(:focus):not(:disabled)){border-color:var(--ui-border-strong)}::slotted(select:focus){border-color:var(--ui-focus-ring);box-shadow:0 0 0 3px var(--ui-accent-soft)}:host([data-invalid='true'])::slotted(select),::slotted(select[aria-invalid='true']){border-color:var(--ui-accent-active)}::slotted(select:disabled){background-color:var(--ui-surface-muted);color:var(--ui-text-muted);cursor:not-allowed}::slotted(select:focus-visible){outline:2px solid var(--ui-focus-ring);outline-offset:2px}::slotted(select[multiple]),::slotted(select[size]:not([size='1'])){background-image:none;padding-inline-end:var(--ui-select-padding-inline-start, var(--ui-space-3))}`;
|
|
@@ -6,7 +6,7 @@ import {
|
|
|
6
6
|
getElement,
|
|
7
7
|
h,
|
|
8
8
|
registerInstance
|
|
9
|
-
} from "./chunk-
|
|
9
|
+
} from "./chunk-NMV2BBWK.js";
|
|
10
10
|
|
|
11
11
|
// dist/esm/ui-switch.entry.js
|
|
12
12
|
var uiSwitchCss = () => `:host{display:inline-flex;align-items:center;gap:var(--ui-space-2);color:var(--ui-text-primary)}:host([aria-disabled='true']),:host([data-disabled='true']){opacity:0.6;cursor:not-allowed}:host([role='switch']){cursor:pointer}:host input[type='checkbox']{appearance:none;-webkit-appearance:none;display:block;position:relative;width:2.25rem;height:1.25rem;padding:0;border:1px solid var(--ui-border-default);border-radius:999px;background:var(--ui-surface-muted);cursor:pointer;transition:background-color var(--ui-motion-fast) var(--ui-motion-ease), border-color var(--ui-motion-fast) var(--ui-motion-ease);margin:0}:host input[type='checkbox']::after{content:'';position:absolute;top:2px;left:2px;width:0.875rem;height:0.875rem;border-radius:999px;background:var(--ui-surface-default);border:1px solid var(--ui-border-default);transition:transform var(--ui-motion-fast) var(--ui-motion-ease)}:host input[type='checkbox']:checked{background:var(--ui-accent-solid);border-color:var(--ui-accent-solid)}:host input[type='checkbox']:checked::after{transform:translateX(calc(2.25rem - 0.875rem - 4px));background:var(--ui-text-on-accent);border-color:var(--ui-text-on-accent)}:host input[type='checkbox']:focus-visible{outline:2px solid var(--ui-accent-solid);outline-offset:2px}`;
|
|
@@ -7,7 +7,7 @@ import {
|
|
|
7
7
|
getElement,
|
|
8
8
|
h,
|
|
9
9
|
registerInstance
|
|
10
|
-
} from "./chunk-
|
|
10
|
+
} from "./chunk-NMV2BBWK.js";
|
|
11
11
|
|
|
12
12
|
// dist/esm/ui-tabs.entry.js
|
|
13
13
|
var uiTabsCss = () => `:host{display:flex;flex-direction:column;gap:0}:host([data-orientation='vertical']){flex-direction:row}::slotted([role='tablist']){display:flex;gap:0;max-inline-size:100%;overflow-x:auto;overscroll-behavior-inline:contain;border-bottom:1px solid var(--ui-border-default)}:host([data-orientation='vertical']) ::slotted([role='tablist']){flex-direction:column;border-bottom:none;border-inline-end:1px solid var(--ui-border-default)}::slotted(button[role='tab']),::slotted([role='tab']),::slotted(ui-button) button[role='tab']{padding:var(--ui-space-2) var(--ui-space-3);font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-medium, 500);color:var(--ui-text-secondary);background:none;border:none;border-bottom:2px solid transparent;margin-bottom:-1px;cursor:pointer;transition:color var(--ui-motion-fast) var(--ui-motion-ease);box-shadow:none}::slotted(button[role='tab']:hover),::slotted([role='tab']:hover){color:var(--ui-text-primary)}::slotted(button[role='tab'][aria-selected='true']),::slotted([role='tab'][aria-selected='true']){color:var(--ui-accent-solid);border-bottom-color:var(--ui-accent-solid)}:host([data-orientation='vertical']) ::slotted(button[role='tab']),:host([data-orientation='vertical']) ::slotted([role='tab']){border-bottom:none;border-inline-end:2px solid transparent;margin-bottom:0;margin-inline-end:-1px}:host([data-orientation='vertical']) ::slotted(button[role='tab'][aria-selected='true']),:host([data-orientation='vertical']) ::slotted([role='tab'][aria-selected='true']){border-inline-end-color:var(--ui-accent-solid)}::slotted([role='tabpanel']){padding:var(--ui-space-4)}`;
|
|
@@ -7,7 +7,7 @@ import {
|
|
|
7
7
|
getElement,
|
|
8
8
|
h,
|
|
9
9
|
registerInstance
|
|
10
|
-
} from "./chunk-
|
|
10
|
+
} from "./chunk-NMV2BBWK.js";
|
|
11
11
|
|
|
12
12
|
// dist/esm/ui-textarea.entry.js
|
|
13
13
|
var uiTextareaCss = () => `:host{display:inline-flex;color:var(--ui-text-primary)}::slotted(textarea){width:100%;appearance:none;border:1px solid var(--ui-border-default);border-radius:var(--ui-radius-2);background:var(--ui-surface-default);color:inherit;font:inherit;line-height:var(--ui-line-height-md);min-block-size:calc(var(--ui-space-12, 3rem) * 2);padding:var(--ui-space-2) var(--ui-space-3);margin:0;resize:vertical;transition:border-color var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease), background-color var(--ui-motion-fast) var(--ui-motion-ease)}::slotted(textarea:hover:not(:focus):not(:disabled)){border-color:var(--ui-border-strong)}::slotted(textarea:focus){border-color:var(--ui-focus-ring);box-shadow:0 0 0 3px var(--ui-accent-soft)}:host([data-invalid='true'])::slotted(textarea),::slotted(textarea[aria-invalid='true']){border-color:var(--ui-accent-active)}::slotted(textarea:disabled){background:var(--ui-surface-muted);color:var(--ui-text-muted);cursor:not-allowed}::slotted(textarea:focus-visible){outline:2px solid var(--ui-focus-ring);outline-offset:2px}`;
|
|
@@ -10,7 +10,7 @@ import {
|
|
|
10
10
|
getElement,
|
|
11
11
|
h,
|
|
12
12
|
registerInstance
|
|
13
|
-
} from "./chunk-
|
|
13
|
+
} from "./chunk-NMV2BBWK.js";
|
|
14
14
|
|
|
15
15
|
// dist/esm/ui-toast-region.entry.js
|
|
16
16
|
var uiToastRegionCss = () => `:host{position:fixed;top:calc(var(--ui-space-4) + env(safe-area-inset-top));left:50%;transform:translateX(-50%);z-index:9999;display:grid;gap:var(--ui-space-2);inline-size:min(24rem, calc(100vw - (var(--ui-space-4) * 2)));max-inline-size:100%;pointer-events:none}:host([popover]){right:auto;bottom:auto;margin:0}:host>*{pointer-events:auto}::slotted([data-ui-toast]){display:grid;grid-template-columns:1fr auto;gap:var(--ui-space-2);align-items:start;border:1px solid var(--ui-border-default);border-radius:var(--ui-radius-3);padding:var(--ui-space-3) var(--ui-space-4);background:var(--ui-surface-elevated);color:var(--ui-text-primary);box-shadow:var(--ui-shadow-lg);animation:ui-toast-enter 0.25s var(--ui-motion-ease) forwards}@keyframes ui-toast-enter{from{opacity:0;transform:translateY(-0.5rem)}to{opacity:1;transform:translateY(0)}}::slotted([data-ui-toast][aria-hidden='true']){display:none}::slotted([data-ui-toast-dismiss]){border:0;background:transparent;color:var(--ui-text-secondary);cursor:pointer;font:inherit}`;
|
|
@@ -14,7 +14,7 @@ import {
|
|
|
14
14
|
getElement,
|
|
15
15
|
h,
|
|
16
16
|
registerInstance
|
|
17
|
-
} from "./chunk-
|
|
17
|
+
} from "./chunk-NMV2BBWK.js";
|
|
18
18
|
|
|
19
19
|
// dist/esm/ui-tooltip.entry.js
|
|
20
20
|
var uiTooltipCss = () => `:host{position:fixed;inset:auto;margin:0;display:inline-block;border:1px solid var(--ui-border-default);border-radius:var(--ui-radius-2);background:var(--ui-surface-elevated);color:var(--ui-text-primary);padding:var(--ui-space-2) var(--ui-space-3);font-size:var(--ui-font-size-sm);box-shadow:var(--ui-shadow-md);opacity:0;transform:translateY(4px);transition:opacity var(--ui-motion-fast) var(--ui-motion-ease), transform var(--ui-motion-fast) var(--ui-motion-ease), display var(--ui-motion-fast) allow-discrete, overlay var(--ui-motion-fast) allow-discrete}:host(:popover-open){opacity:1;transform:translateY(0)}@starting-style{:host(:popover-open){opacity:0;transform:translateY(4px)}}:host([hidden]){display:none !important}@media (prefers-reduced-motion: reduce){:host{transition:none}}`;
|
|
@@ -3,7 +3,7 @@ import {
|
|
|
3
3
|
getElement,
|
|
4
4
|
h,
|
|
5
5
|
registerInstance
|
|
6
|
-
} from "./chunk-
|
|
6
|
+
} from "./chunk-NMV2BBWK.js";
|
|
7
7
|
|
|
8
8
|
// dist/esm/ui-top-bar.entry.js
|
|
9
9
|
var uiTopBarCss = () => `:host{position:sticky;inset-block-start:0;z-index:var(--ui-top-bar-z-index, 100);display:block}.top-bar{min-block-size:calc(var(--ui-top-bar-height, 56px) + env(safe-area-inset-top));display:flex;align-items:center;gap:var(--ui-top-bar-gap, var(--ui-space-3, 0.75rem));padding-block-start:env(safe-area-inset-top);padding-inline-start:max( var(--ui-top-bar-padding-inline, var(--ui-space-4, 1rem)), env(safe-area-inset-left) );padding-inline-end:max( var(--ui-top-bar-padding-inline, var(--ui-space-4, 1rem)), env(safe-area-inset-right) );background:var(--ui-top-bar-bg, var(--ui-surface, #ffffff));border-block-end:1px solid var(--ui-top-bar-border, var(--ui-border, #e5e7eb))}.top-bar__leading,.top-bar__search,.top-bar__actions{display:flex;align-items:center;flex-shrink:0}.top-bar__actions{gap:var(--ui-top-bar-actions-gap, var(--ui-space-1, 0.25rem))}.top-bar__title{min-inline-size:0;flex:1}[hidden]{display:none}@media (min-width: 768px){:host{display:none}}`;
|
|
@@ -7,7 +7,7 @@ import {
|
|
|
7
7
|
getElement,
|
|
8
8
|
h,
|
|
9
9
|
registerInstance
|
|
10
|
-
} from "./chunk-
|
|
10
|
+
} from "./chunk-NMV2BBWK.js";
|
|
11
11
|
|
|
12
12
|
// dist/esm/ui-tree-item.entry.js
|
|
13
13
|
var Bold = [
|
|
@@ -285,7 +285,7 @@ function loomaIconMarkup(name, className = "looma-icon") {
|
|
|
285
285
|
"</svg>"
|
|
286
286
|
].join("");
|
|
287
287
|
}
|
|
288
|
-
var uiTreeItemCss = () => `:host{--ui-tree-indent:16px;--ui-tree-row-min-height:32px;--ui-tree-drop-color:var(--ui-accent-solid);position:relative;display:block;min-inline-size:0;margin-inline-start:calc(var(--ui-tree-item-depth, 0) * var(--ui-tree-indent))}.row{position:relative;display:grid;grid-template-columns:20px auto minmax(0, 1fr) auto;align-items:center;min-block-size:var(--ui-tree-row-min-height);min-inline-size:0;font-size:var(--ui-tree-font-size, var(--ui-font-size-ui, 0.9375rem));border-radius:var(--ui-radius-md);color:var(--ui-text-secondary);transition:background-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease), opacity var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease), min-block-size var(--ui-motion-base) var(--ui-motion-ease)}.row:hover,:host([data-selected]) .row,.row:focus-within{color:var(--ui-text-primary);background:var(--ui-surface-muted)}:host([data-disabled]) .row{opacity:0.55}:host([data-dragging]) .row{opacity:0.42}:host(:focus){outline:none}:host(:focus-visible) .row{box-shadow:0 0 0 2px var(--ui-focus-ring)}:host([data-drop-position='inside']) .row{background:var(--ui-accent-subtle);box-shadow:inset 0 0 0 1px var(--ui-tree-drop-color)}.disclosure,.disclosure-spacer{grid-column:1;grid-row:1;inline-size:20px;block-size:28px}.disclosure{display:grid;place-items:center;padding:0;color:var(--ui-text-muted);background:transparent;border:0;border-radius:var(--ui-radius-sm);cursor:pointer}.disclosure:hover{color:var(--ui-text-primary);background:var(--ui-surface-elevated)}.disclosure-icon{display:block;inline-size:14px;block-size:14px;transform:rotate(-90deg);transition:transform var(--ui-motion-fast) var(--ui-motion-ease)}.disclosure-icon--expanded{transform:rotate(0deg)}.disclosure-icon :is(svg),.drag-handle :is(svg){display:block;inline-size:100%;block-size:100%}.leading{display:none}.leading:has(*){display:inline-grid;place-items:center;grid-column:2;grid-row:1;inline-size:16px;block-size:16px;margin-inline-start:var(--ui-space-1)}.label{grid-column:3;grid-row:1;min-inline-size:0;padding:var(--ui-space-1) var(--ui-space-2)}.actions{grid-column:4;grid-row:1;display:inline-flex;align-items:center;min-inline-size:0}.drag-handle{position:absolute;z-index:2;inset-block-start:50%;inset-inline-start:-22px;inline-size:20px;block-size:32px;display:grid;place-items:center;padding:7px 3px;color:var(--ui-text-muted);background:var(--ui-surface-elevated);border:1px solid transparent;border-radius:var(--ui-radius-sm);cursor:grab;opacity:0;pointer-events:none;transform:translateY(-50%);transition:opacity var(--ui-motion-fast) var(--ui-motion-ease)}.row:hover .drag-handle,.drag-handle:focus-visible,:host([data-dragging]) .drag-handle{opacity:1;pointer-events:auto}.drag-handle:active{cursor:grabbing}.drop-indicator{position:absolute;z-index:3;inset-inline:1px;display:none;block-size:2px;border-radius:999px;background:var(--ui-tree-drop-color);pointer-events:none}.drop-indicator::before,.drop-indicator::after{content:'';position:absolute;inset-block-start:50%;inline-size:7px;block-size:7px;border:2px solid var(--ui-tree-drop-color);border-radius:999px;background:var(--ui-surface-elevated);transform:translateY(-50%)}.drop-indicator::before{inset-inline-start:-1px}.drop-indicator::after{inset-inline-end:-1px}:host([data-drop-position='before']) .drop-indicator{display:block;inset-block-start:-1px}:host([data-drop-position='after']) .drop-indicator{display:block;inset-block-end:-1px}.children[hidden]{display:none}:host-context(html[data-ui-input-modality='touch']){--ui-tree-row-min-height:44px}:host-context(html[data-ui-input-modality='touch']) .drag-handle{display:none}@media (prefers-reduced-motion: reduce){.row,.disclosure-icon,.drag-handle{transition:none}}`;
|
|
288
|
+
var uiTreeItemCss = () => `:host{--ui-tree-indent:16px;--ui-tree-row-min-height:32px;--ui-tree-drop-color:var(--ui-accent-solid);position:relative;display:block;min-inline-size:0;margin-inline-start:calc(var(--ui-tree-item-depth, 0) * var(--ui-tree-indent))}.row{position:relative;display:grid;grid-template-columns:20px auto minmax(0, 1fr) auto;align-items:center;min-block-size:var(--ui-tree-row-min-height);min-inline-size:0;font-size:var(--ui-tree-font-size, var(--ui-font-size-ui, 0.9375rem));border-radius:var(--ui-radius-md);color:var(--ui-text-secondary);transition:background-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease), opacity var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease), min-block-size var(--ui-motion-base) var(--ui-motion-ease)}.row:hover,:host([data-selected]) .row,.row:focus-within{color:var(--ui-text-primary);background:var(--ui-surface-muted)}:host([data-disabled]) .row{opacity:0.55}:host([data-dragging]) .row{opacity:0.42}:host(:focus){outline:none}:host(:focus-visible) .row{box-shadow:0 0 0 2px var(--ui-focus-ring)}:host([data-drop-position='inside']) .row{background:var(--ui-accent-subtle);box-shadow:inset 0 0 0 1px var(--ui-tree-drop-color)}.disclosure,.disclosure-spacer{grid-column:1;grid-row:1;inline-size:20px;block-size:28px}.disclosure{display:grid;place-items:center;padding:0;color:var(--ui-text-muted);background:transparent;border:0;border-radius:var(--ui-radius-sm);cursor:pointer}.disclosure:hover{color:var(--ui-text-primary);background:var(--ui-surface-elevated)}.disclosure-icon{display:block;inline-size:14px;block-size:14px;transform:rotate(-90deg);transition:transform var(--ui-motion-fast) var(--ui-motion-ease)}.disclosure-icon--expanded{transform:rotate(0deg)}.disclosure-icon :is(svg),.drag-handle :is(svg){display:block;inline-size:100%;block-size:100%}.leading{display:none}.leading:has(*){display:inline-grid;place-items:center;grid-column:2;grid-row:1;inline-size:16px;block-size:16px;margin-inline-start:var(--ui-space-1)}.label{grid-column:3;grid-row:1;min-inline-size:0;padding:var(--ui-space-1) var(--ui-space-2)}.actions{grid-column:4;grid-row:1;display:inline-flex;align-items:center;min-inline-size:0}.drag-handle{position:absolute;z-index:2;inset-block-start:50%;inset-inline-start:-22px;inline-size:20px;block-size:32px;display:grid;place-items:center;padding:7px 3px;color:var(--ui-text-muted);background:var(--ui-surface-elevated);border:1px solid transparent;border-radius:var(--ui-radius-sm);cursor:grab;opacity:0;pointer-events:none;transform:translateY(-50%);transition:opacity var(--ui-motion-fast) var(--ui-motion-ease)}.row:hover .drag-handle,.drag-handle:focus-visible,:host([data-dragging]) .drag-handle{opacity:1;pointer-events:auto}.drag-handle:active{cursor:grabbing}.drop-indicator{position:absolute;z-index:3;inset-inline:1px;display:none;block-size:2px;border-radius:999px;background:var(--ui-tree-drop-color);pointer-events:none}.drop-indicator::before,.drop-indicator::after{content:'';position:absolute;inset-block-start:50%;inline-size:7px;block-size:7px;border:2px solid var(--ui-tree-drop-color);border-radius:999px;background:var(--ui-surface-elevated);transform:translateY(-50%)}.drop-indicator::before{inset-inline-start:-1px}.drop-indicator::after{inset-inline-end:-1px}:host([data-drop-position='before']) .row-drop-indicator{display:block;inset-block-start:-1px}:host([data-drop-position='after']) .subtree-drop-indicator{display:block;inset-block-end:-1px}.children[hidden]{display:none}:host-context(html[data-ui-input-modality='touch']){--ui-tree-row-min-height:44px}:host-context(html[data-ui-input-modality='touch']) .drag-handle{display:none}@media (prefers-reduced-motion: reduce){.row,.disclosure-icon,.drag-handle{transition:none}}`;
|
|
289
289
|
var UITreeItem = class {
|
|
290
290
|
constructor(hostRef) {
|
|
291
291
|
registerInstance(this, hostRef);
|
|
@@ -363,7 +363,7 @@ var UITreeItem = class {
|
|
|
363
363
|
return h(Host, { key: "ea8ed538aa3883c87257a25614a066965364693f", role: "treeitem", "aria-level": String(level), "aria-expanded": this.container ? String(this.internalExpanded) : void 0, "aria-selected": String(this.selected), "aria-disabled": this.disabled ? "true" : void 0, "data-container": this.container ? "" : void 0, "data-selected": this.selected ? "" : void 0, "data-disabled": this.disabled ? "" : void 0, "data-drag-type": this.dragType || "item", "data-drop-scope": this.dropScope || void 0, "data-accepts": this.accepts || void 0, tabIndex: this.disabled ? -1 : 0, style: {
|
|
364
364
|
"--ui-tree-item-depth": String(level - 1),
|
|
365
365
|
"margin-inline-start": level > 1 ? "var(--ui-tree-indent, 16px)" : "0px"
|
|
366
|
-
} }, h("div", { key: "740b93aa47e65d8a1cb899d4b9c966d9ad1d456f", class: "row", part: "row", onClick: this.onRowClick }, this.sortable && !this.disabled ? h("button", { class: "drag-handle", part: "drag-handle", type: "button", draggable: true, "aria-label": dragLabel, title: dragLabel }, h("span", { innerHTML: loomaIconMarkup("grip-vertical") })) : null, this.container ? h("button", { class: "disclosure", part: "disclosure", type: "button", "aria-label": disclosureLabel, "aria-expanded": String(this.internalExpanded), disabled: this.disabled, onClick: this.onDisclosureClick, onKeyDown: this.onDisclosureKeydown }, h("span", { class: { "disclosure-icon": true, "disclosure-icon--expanded": this.internalExpanded }, innerHTML: loomaIconMarkup("chevron-down") })) : h("span", { class: "disclosure-spacer", "aria-hidden": "true" }), h("span", { key: "37e1b7f1cdddf623734becef465ffde83d8b86f2", class: "leading", part: "leading" }, h("slot", { key: "0ab3a60c98628f009918d0d720772154912d2709", name: "leading" })), h("span", { key: "defdd343f25a0f4354110e981f3889e1d09c27ee", class: "label", part: "label" }, h("slot", { key: "bde46ccacc1a620348062fc300503c4f1736316b" })), h("span", { key: "caff9ada38c41be90aeb6e331f4c54a51f31d26c", class: "actions", part: "actions" }, h("slot", { key: "e11704d6871445c91eaa29c99302d8b751be69d3", name: "actions" })), h("span", { key: "
|
|
366
|
+
} }, h("div", { key: "740b93aa47e65d8a1cb899d4b9c966d9ad1d456f", class: "row", part: "row", onClick: this.onRowClick }, this.sortable && !this.disabled ? h("button", { class: "drag-handle", part: "drag-handle", type: "button", draggable: true, "aria-label": dragLabel, title: dragLabel }, h("span", { innerHTML: loomaIconMarkup("grip-vertical") })) : null, this.container ? h("button", { class: "disclosure", part: "disclosure", type: "button", "aria-label": disclosureLabel, "aria-expanded": String(this.internalExpanded), disabled: this.disabled, onClick: this.onDisclosureClick, onKeyDown: this.onDisclosureKeydown }, h("span", { class: { "disclosure-icon": true, "disclosure-icon--expanded": this.internalExpanded }, innerHTML: loomaIconMarkup("chevron-down") })) : h("span", { class: "disclosure-spacer", "aria-hidden": "true" }), h("span", { key: "37e1b7f1cdddf623734becef465ffde83d8b86f2", class: "leading", part: "leading" }, h("slot", { key: "0ab3a60c98628f009918d0d720772154912d2709", name: "leading" })), h("span", { key: "defdd343f25a0f4354110e981f3889e1d09c27ee", class: "label", part: "label" }, h("slot", { key: "bde46ccacc1a620348062fc300503c4f1736316b" })), h("span", { key: "caff9ada38c41be90aeb6e331f4c54a51f31d26c", class: "actions", part: "actions" }, h("slot", { key: "e11704d6871445c91eaa29c99302d8b751be69d3", name: "actions" })), h("span", { key: "9efc0e95588f1dd4527dade2b7ff9f2774462c2e", class: "drop-indicator row-drop-indicator", part: "drop-indicator", "aria-hidden": "true" })), this.container ? h("div", { class: "children", part: "children", role: "group", hidden: !this.internalExpanded }, h("slot", { name: "children" })) : null, h("span", { key: "8893ec2c4082bb8af942ef563055a2910d0d4201", class: "drop-indicator subtree-drop-indicator", part: "drop-indicator", "aria-hidden": "true" }));
|
|
367
367
|
}
|
|
368
368
|
static get watchers() {
|
|
369
369
|
return {
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import {
|
|
2
|
+
MAX_MENTION_RESULT_LIMIT,
|
|
2
3
|
TABLE_CELL_BACKGROUND_OPTIONS
|
|
3
|
-
} from "./chunk-
|
|
4
|
+
} from "./chunk-ZOUKEZ77.js";
|
|
4
5
|
|
|
5
6
|
// src/table-context-menu.ts
|
|
6
7
|
import {
|
|
@@ -479,12 +480,215 @@ if (typeof HTMLElement !== "undefined") {
|
|
|
479
480
|
}
|
|
480
481
|
}
|
|
481
482
|
|
|
483
|
+
// src/mention-menu.ts
|
|
484
|
+
import { getVisualViewportRect as getVisualViewportRect2 } from "@threadlabs/looma/core";
|
|
485
|
+
var TAG4 = "ui-editor-mention-menu";
|
|
486
|
+
var MOBILE_BREAKPOINT = 768;
|
|
487
|
+
var MENU_HEIGHT_ESTIMATE = 320;
|
|
488
|
+
var MENU_WIDTH = 320;
|
|
489
|
+
var OFFSET = 8;
|
|
490
|
+
function finiteCoordinate(value) {
|
|
491
|
+
return typeof value === "number" && Number.isFinite(value) ? value : null;
|
|
492
|
+
}
|
|
493
|
+
function normalizeAnchorRect(value) {
|
|
494
|
+
if (!value || typeof value !== "object") return null;
|
|
495
|
+
const rect = value;
|
|
496
|
+
const x = finiteCoordinate(rect.x);
|
|
497
|
+
const y = finiteCoordinate(rect.y);
|
|
498
|
+
const width = finiteCoordinate(rect.width);
|
|
499
|
+
const height = finiteCoordinate(rect.height);
|
|
500
|
+
const left = finiteCoordinate(rect.left) ?? x;
|
|
501
|
+
const top = finiteCoordinate(rect.top) ?? y;
|
|
502
|
+
const right = finiteCoordinate(rect.right) ?? (left !== null && width !== null ? left + width : null);
|
|
503
|
+
const bottom = finiteCoordinate(rect.bottom) ?? (top !== null && height !== null ? top + height : null);
|
|
504
|
+
return left === null || top === null || right === null || bottom === null ? null : { left, top, right, bottom };
|
|
505
|
+
}
|
|
506
|
+
function escapeHtml(value) {
|
|
507
|
+
return value.replaceAll("&", "&").replaceAll("<", "<").replaceAll(">", ">").replaceAll('"', """).replaceAll("'", "'");
|
|
508
|
+
}
|
|
509
|
+
function dispatchMenuEvent(element, name, detail) {
|
|
510
|
+
element.dispatchEvent(new CustomEvent(name, { detail, bubbles: true, composed: true }));
|
|
511
|
+
}
|
|
512
|
+
if (typeof HTMLElement !== "undefined") {
|
|
513
|
+
class UIEditorMentionMenuElement extends HTMLElement {
|
|
514
|
+
#open = false;
|
|
515
|
+
#query = "";
|
|
516
|
+
#items = [];
|
|
517
|
+
#selectedIndex = 0;
|
|
518
|
+
#loading = false;
|
|
519
|
+
#anchorRect = null;
|
|
520
|
+
#normalizedAnchorRect = null;
|
|
521
|
+
get open() {
|
|
522
|
+
return this.#open;
|
|
523
|
+
}
|
|
524
|
+
set open(value) {
|
|
525
|
+
this.#open = Boolean(value);
|
|
526
|
+
this.render();
|
|
527
|
+
}
|
|
528
|
+
get query() {
|
|
529
|
+
return this.#query;
|
|
530
|
+
}
|
|
531
|
+
set query(value) {
|
|
532
|
+
this.#query = typeof value === "string" ? value : "";
|
|
533
|
+
this.render();
|
|
534
|
+
}
|
|
535
|
+
get items() {
|
|
536
|
+
return this.#items;
|
|
537
|
+
}
|
|
538
|
+
set items(value) {
|
|
539
|
+
this.#items = Array.isArray(value) ? value.slice(0, MAX_MENTION_RESULT_LIMIT) : [];
|
|
540
|
+
if (this.#selectedIndex >= this.#items.length) this.#selectedIndex = 0;
|
|
541
|
+
this.render();
|
|
542
|
+
}
|
|
543
|
+
get selectedIndex() {
|
|
544
|
+
return this.#selectedIndex;
|
|
545
|
+
}
|
|
546
|
+
set selectedIndex(value) {
|
|
547
|
+
this.#selectedIndex = Number.isFinite(value) ? Math.max(0, value) : 0;
|
|
548
|
+
this.render();
|
|
549
|
+
}
|
|
550
|
+
get loading() {
|
|
551
|
+
return this.#loading;
|
|
552
|
+
}
|
|
553
|
+
set loading(value) {
|
|
554
|
+
this.#loading = Boolean(value);
|
|
555
|
+
this.render();
|
|
556
|
+
}
|
|
557
|
+
get anchorRect() {
|
|
558
|
+
return this.#anchorRect;
|
|
559
|
+
}
|
|
560
|
+
set anchorRect(value) {
|
|
561
|
+
const normalized = normalizeAnchorRect(value);
|
|
562
|
+
this.#anchorRect = normalized ? value : null;
|
|
563
|
+
this.#normalizedAnchorRect = normalized;
|
|
564
|
+
this.render();
|
|
565
|
+
}
|
|
566
|
+
connectedCallback() {
|
|
567
|
+
this.setAttribute("role", "listbox");
|
|
568
|
+
this.setAttribute("aria-label", "Mention a person");
|
|
569
|
+
this.addEventListener("mousedown", this.onMouseDown);
|
|
570
|
+
this.addEventListener("click", this.onClick);
|
|
571
|
+
this.addEventListener("mouseover", this.onMouseOver);
|
|
572
|
+
window.addEventListener("resize", this.onViewportChange);
|
|
573
|
+
window.addEventListener("scroll", this.onViewportChange, true);
|
|
574
|
+
window.visualViewport?.addEventListener("resize", this.onViewportChange);
|
|
575
|
+
window.visualViewport?.addEventListener("scroll", this.onViewportChange);
|
|
576
|
+
this.render();
|
|
577
|
+
}
|
|
578
|
+
disconnectedCallback() {
|
|
579
|
+
this.removeEventListener("mousedown", this.onMouseDown);
|
|
580
|
+
this.removeEventListener("click", this.onClick);
|
|
581
|
+
this.removeEventListener("mouseover", this.onMouseOver);
|
|
582
|
+
window.removeEventListener("resize", this.onViewportChange);
|
|
583
|
+
window.removeEventListener("scroll", this.onViewportChange, true);
|
|
584
|
+
window.visualViewport?.removeEventListener("resize", this.onViewportChange);
|
|
585
|
+
window.visualViewport?.removeEventListener("scroll", this.onViewportChange);
|
|
586
|
+
}
|
|
587
|
+
onMouseDown = (event) => event.preventDefault();
|
|
588
|
+
onClick = (event) => {
|
|
589
|
+
const target = event.target.closest("[data-index]");
|
|
590
|
+
const index = Number.parseInt(target?.dataset.index ?? "", 10);
|
|
591
|
+
if (Number.isFinite(index)) {
|
|
592
|
+
dispatchMenuEvent(
|
|
593
|
+
this,
|
|
594
|
+
"looma-editor-mention-menu-select",
|
|
595
|
+
{ index }
|
|
596
|
+
);
|
|
597
|
+
}
|
|
598
|
+
};
|
|
599
|
+
onMouseOver = (event) => {
|
|
600
|
+
const target = event.target.closest("[data-index]");
|
|
601
|
+
const index = Number.parseInt(target?.dataset.index ?? "", 10);
|
|
602
|
+
if (!Number.isFinite(index) || index === this.#selectedIndex) return;
|
|
603
|
+
this.#selectedIndex = index;
|
|
604
|
+
dispatchMenuEvent(
|
|
605
|
+
this,
|
|
606
|
+
"looma-editor-mention-menu-highlight",
|
|
607
|
+
{ index }
|
|
608
|
+
);
|
|
609
|
+
this.render();
|
|
610
|
+
};
|
|
611
|
+
onViewportChange = () => {
|
|
612
|
+
if (this.#open) this.applyHostPosition();
|
|
613
|
+
};
|
|
614
|
+
applyHostPosition() {
|
|
615
|
+
const rect = this.#normalizedAnchorRect;
|
|
616
|
+
if (!rect) {
|
|
617
|
+
this.style.display = "none";
|
|
618
|
+
return;
|
|
619
|
+
}
|
|
620
|
+
const viewport = getVisualViewportRect2(window);
|
|
621
|
+
this.style.display = "block";
|
|
622
|
+
this.style.position = "fixed";
|
|
623
|
+
this.style.zIndex = "500";
|
|
624
|
+
if (window.innerWidth < MOBILE_BREAKPOINT) {
|
|
625
|
+
const toolbarReserve = 56;
|
|
626
|
+
const height = Math.min(MENU_HEIGHT_ESTIMATE, Math.max(0, viewport.height - toolbarReserve));
|
|
627
|
+
this.style.left = `${viewport.left}px`;
|
|
628
|
+
this.style.top = `${viewport.top + viewport.height - height - toolbarReserve}px`;
|
|
629
|
+
this.style.right = "";
|
|
630
|
+
this.style.bottom = "";
|
|
631
|
+
this.style.width = `${viewport.width}px`;
|
|
632
|
+
this.style.maxHeight = `${height}px`;
|
|
633
|
+
return;
|
|
634
|
+
}
|
|
635
|
+
const spaceBelow = viewport.bottom - rect.bottom - OFFSET;
|
|
636
|
+
const spaceAbove = rect.top - viewport.top - OFFSET;
|
|
637
|
+
const top = spaceBelow >= MENU_HEIGHT_ESTIMATE || spaceBelow >= spaceAbove ? rect.bottom + OFFSET : rect.top - OFFSET - MENU_HEIGHT_ESTIMATE;
|
|
638
|
+
const left = Math.max(
|
|
639
|
+
viewport.left + 8,
|
|
640
|
+
Math.min(rect.left, viewport.right - MENU_WIDTH - 8)
|
|
641
|
+
);
|
|
642
|
+
this.style.top = `${Math.max(viewport.top + 8, top)}px`;
|
|
643
|
+
this.style.left = `${left}px`;
|
|
644
|
+
this.style.right = "";
|
|
645
|
+
this.style.bottom = "";
|
|
646
|
+
this.style.width = `${MENU_WIDTH}px`;
|
|
647
|
+
this.style.maxHeight = "";
|
|
648
|
+
}
|
|
649
|
+
render() {
|
|
650
|
+
const visible = this.#open && (this.#loading || this.#items.length > 0) && this.#normalizedAnchorRect;
|
|
651
|
+
this.hidden = !visible;
|
|
652
|
+
if (!visible) return;
|
|
653
|
+
this.applyHostPosition();
|
|
654
|
+
const optionIdPrefix = this.id || TAG4;
|
|
655
|
+
const selectedId = `${optionIdPrefix}-option-${this.#selectedIndex}`;
|
|
656
|
+
this.setAttribute("aria-busy", this.#loading ? "true" : "false");
|
|
657
|
+
if (this.#items.length > 0) this.setAttribute("aria-activedescendant", selectedId);
|
|
658
|
+
else this.removeAttribute("aria-activedescendant");
|
|
659
|
+
const items = this.#items.map((item, index) => {
|
|
660
|
+
const selected = index === this.#selectedIndex;
|
|
661
|
+
return [
|
|
662
|
+
`<li id="${optionIdPrefix}-option-${index}" class="ui-editor-mention-menu__item${selected ? " ui-editor-mention-menu__item--active" : ""}"`,
|
|
663
|
+
` role="option" aria-selected="${selected}" data-index="${index}">`,
|
|
664
|
+
`<span class="ui-editor-mention-menu__avatar" aria-hidden="true">${escapeHtml(item.initials ?? item.label.slice(0, 2).toUpperCase())}</span>`,
|
|
665
|
+
`<span class="ui-editor-mention-menu__body">`,
|
|
666
|
+
`<span class="ui-editor-mention-menu__label">${escapeHtml(item.label)}</span>`,
|
|
667
|
+
item.detail ? `<span class="ui-editor-mention-menu__detail">${escapeHtml(item.detail)}</span>` : "",
|
|
668
|
+
`</span></li>`
|
|
669
|
+
].join("");
|
|
670
|
+
}).join("");
|
|
671
|
+
this.innerHTML = [
|
|
672
|
+
`<div class="ui-editor-mention-menu">`,
|
|
673
|
+
`<div class="ui-editor-mention-menu__header">`,
|
|
674
|
+
`<span>People</span><span class="ui-editor-mention-menu__hint">Type after @ to search</span>`,
|
|
675
|
+
`</div>`,
|
|
676
|
+
this.#loading && this.#items.length === 0 ? `<div class="ui-editor-mention-menu__loading" role="status">Searching\u2026</div>` : `<ul class="ui-editor-mention-menu__list" role="presentation">${items}</ul>`,
|
|
677
|
+
`</div>`
|
|
678
|
+
].join("");
|
|
679
|
+
}
|
|
680
|
+
}
|
|
681
|
+
if (typeof window !== "undefined" && !customElements.get(TAG4)) {
|
|
682
|
+
customElements.define(TAG4, UIEditorMentionMenuElement);
|
|
683
|
+
}
|
|
684
|
+
}
|
|
685
|
+
|
|
482
686
|
// src/table-overlay.ts
|
|
483
687
|
import {
|
|
484
688
|
createProximityCoordinator,
|
|
485
689
|
loomaIconMarkup as loomaIconMarkup3
|
|
486
690
|
} from "@threadlabs/looma/core";
|
|
487
|
-
var
|
|
691
|
+
var TAG5 = "ui-editor-table-overlay";
|
|
488
692
|
var DEFAULT_ROWS = 3;
|
|
489
693
|
var DEFAULT_COLS = 3;
|
|
490
694
|
function sameNumbers(left, right) {
|
|
@@ -789,37 +993,37 @@ if (typeof HTMLElement !== "undefined") {
|
|
|
789
993
|
this.#proximity?.refresh();
|
|
790
994
|
}
|
|
791
995
|
}
|
|
792
|
-
if (typeof window !== "undefined" && !customElements.get(
|
|
793
|
-
customElements.define(
|
|
996
|
+
if (typeof window !== "undefined" && !customElements.get(TAG5)) {
|
|
997
|
+
customElements.define(TAG5, UIEditorTableOverlayElement);
|
|
794
998
|
}
|
|
795
999
|
}
|
|
796
1000
|
|
|
797
1001
|
// src/slash-menu.ts
|
|
798
1002
|
import {
|
|
799
|
-
getVisualViewportRect as
|
|
1003
|
+
getVisualViewportRect as getVisualViewportRect3,
|
|
800
1004
|
loomaIconMarkup as loomaIconMarkup4
|
|
801
1005
|
} from "@threadlabs/looma/core";
|
|
802
|
-
var
|
|
803
|
-
var
|
|
804
|
-
var
|
|
805
|
-
var
|
|
806
|
-
var
|
|
807
|
-
function
|
|
1006
|
+
var TAG6 = "ui-editor-slash-menu";
|
|
1007
|
+
var MOBILE_BREAKPOINT2 = 768;
|
|
1008
|
+
var MENU_HEIGHT_ESTIMATE2 = 320;
|
|
1009
|
+
var MENU_WIDTH2 = 280;
|
|
1010
|
+
var OFFSET2 = 8;
|
|
1011
|
+
function finiteCoordinate2(value) {
|
|
808
1012
|
return typeof value === "number" && Number.isFinite(value) ? value : null;
|
|
809
1013
|
}
|
|
810
|
-
function
|
|
1014
|
+
function normalizeAnchorRect2(value) {
|
|
811
1015
|
if (!value || typeof value !== "object") {
|
|
812
1016
|
return null;
|
|
813
1017
|
}
|
|
814
1018
|
const rect = value;
|
|
815
|
-
const x =
|
|
816
|
-
const y =
|
|
817
|
-
const width =
|
|
818
|
-
const height =
|
|
819
|
-
const left =
|
|
820
|
-
const top =
|
|
821
|
-
const right =
|
|
822
|
-
const bottom =
|
|
1019
|
+
const x = finiteCoordinate2(rect.x);
|
|
1020
|
+
const y = finiteCoordinate2(rect.y);
|
|
1021
|
+
const width = finiteCoordinate2(rect.width);
|
|
1022
|
+
const height = finiteCoordinate2(rect.height);
|
|
1023
|
+
const left = finiteCoordinate2(rect.left) ?? x;
|
|
1024
|
+
const top = finiteCoordinate2(rect.top) ?? y;
|
|
1025
|
+
const right = finiteCoordinate2(rect.right) ?? (left !== null && width !== null ? left + width : null);
|
|
1026
|
+
const bottom = finiteCoordinate2(rect.bottom) ?? (top !== null && height !== null ? top + height : null);
|
|
823
1027
|
if (left === null || top === null || right === null || bottom === null) {
|
|
824
1028
|
return null;
|
|
825
1029
|
}
|
|
@@ -834,7 +1038,7 @@ function dispatchSlashMenuEvent(element, name, detail) {
|
|
|
834
1038
|
})
|
|
835
1039
|
);
|
|
836
1040
|
}
|
|
837
|
-
function
|
|
1041
|
+
function escapeHtml2(value) {
|
|
838
1042
|
return value.replaceAll("&", "&").replaceAll("<", "<").replaceAll(">", ">").replaceAll('"', """).replaceAll("'", "'");
|
|
839
1043
|
}
|
|
840
1044
|
if (typeof HTMLElement !== "undefined") {
|
|
@@ -877,7 +1081,7 @@ if (typeof HTMLElement !== "undefined") {
|
|
|
877
1081
|
return this.#anchorRect;
|
|
878
1082
|
}
|
|
879
1083
|
set anchorRect(value) {
|
|
880
|
-
const normalized =
|
|
1084
|
+
const normalized = normalizeAnchorRect2(value);
|
|
881
1085
|
this.#anchorRect = normalized ? value : null;
|
|
882
1086
|
this.#normalizedAnchorRect = normalized;
|
|
883
1087
|
this.render();
|
|
@@ -947,16 +1151,16 @@ if (typeof HTMLElement !== "undefined") {
|
|
|
947
1151
|
this.style.display = "none";
|
|
948
1152
|
return;
|
|
949
1153
|
}
|
|
950
|
-
const viewport =
|
|
1154
|
+
const viewport = getVisualViewportRect3(window);
|
|
951
1155
|
const viewportWidth = viewport.width;
|
|
952
1156
|
const viewportHeight = viewport.height;
|
|
953
1157
|
this.style.display = "block";
|
|
954
1158
|
this.style.position = "fixed";
|
|
955
1159
|
this.style.zIndex = "500";
|
|
956
|
-
if (window.innerWidth <
|
|
1160
|
+
if (window.innerWidth < MOBILE_BREAKPOINT2) {
|
|
957
1161
|
const toolbarReserve = 56;
|
|
958
1162
|
const menuHeight = Math.min(
|
|
959
|
-
|
|
1163
|
+
MENU_HEIGHT_ESTIMATE2,
|
|
960
1164
|
Math.max(0, viewportHeight - toolbarReserve)
|
|
961
1165
|
);
|
|
962
1166
|
this.style.left = `${viewport.left}px`;
|
|
@@ -968,16 +1172,16 @@ if (typeof HTMLElement !== "undefined") {
|
|
|
968
1172
|
return;
|
|
969
1173
|
}
|
|
970
1174
|
let top;
|
|
971
|
-
const spaceBelow = viewport.bottom - rect.bottom -
|
|
972
|
-
const spaceAbove = rect.top - viewport.top -
|
|
973
|
-
if (spaceBelow >=
|
|
974
|
-
top = rect.bottom +
|
|
1175
|
+
const spaceBelow = viewport.bottom - rect.bottom - OFFSET2;
|
|
1176
|
+
const spaceAbove = rect.top - viewport.top - OFFSET2;
|
|
1177
|
+
if (spaceBelow >= MENU_HEIGHT_ESTIMATE2 || spaceBelow >= spaceAbove) {
|
|
1178
|
+
top = rect.bottom + OFFSET2;
|
|
975
1179
|
} else {
|
|
976
|
-
top = rect.top -
|
|
1180
|
+
top = rect.top - OFFSET2 - MENU_HEIGHT_ESTIMATE2;
|
|
977
1181
|
}
|
|
978
1182
|
let left = rect.left;
|
|
979
|
-
if (left +
|
|
980
|
-
left = viewport.right -
|
|
1183
|
+
if (left + MENU_WIDTH2 > viewport.right - 8) {
|
|
1184
|
+
left = viewport.right - MENU_WIDTH2 - 8;
|
|
981
1185
|
}
|
|
982
1186
|
if (left < viewport.left + 8) {
|
|
983
1187
|
left = viewport.left + 8;
|
|
@@ -986,7 +1190,7 @@ if (typeof HTMLElement !== "undefined") {
|
|
|
986
1190
|
this.style.left = `${left}px`;
|
|
987
1191
|
this.style.right = "";
|
|
988
1192
|
this.style.bottom = "";
|
|
989
|
-
this.style.width = `${
|
|
1193
|
+
this.style.width = `${MENU_WIDTH2}px`;
|
|
990
1194
|
this.style.maxHeight = "";
|
|
991
1195
|
}
|
|
992
1196
|
render() {
|
|
@@ -1008,8 +1212,8 @@ if (typeof HTMLElement !== "undefined") {
|
|
|
1008
1212
|
`>`,
|
|
1009
1213
|
`<span class="ui-editor-slash-menu__icon" aria-hidden="true">${loomaIconMarkup4(item.icon)}</span>`,
|
|
1010
1214
|
`<span class="ui-editor-slash-menu__body">`,
|
|
1011
|
-
`<span class="ui-editor-slash-menu__title">${
|
|
1012
|
-
`<span class="ui-editor-slash-menu__description">${
|
|
1215
|
+
`<span class="ui-editor-slash-menu__title">${escapeHtml2(item.title)}</span>`,
|
|
1216
|
+
`<span class="ui-editor-slash-menu__description">${escapeHtml2(item.description)}</span>`,
|
|
1013
1217
|
`</span>`,
|
|
1014
1218
|
`</li>`
|
|
1015
1219
|
].join("");
|
|
@@ -1018,7 +1222,7 @@ if (typeof HTMLElement !== "undefined") {
|
|
|
1018
1222
|
`<div class="ui-editor-slash-menu">`,
|
|
1019
1223
|
`<div class="ui-editor-slash-menu__header" aria-hidden="true">`,
|
|
1020
1224
|
`<span class="ui-editor-slash-menu__header-label">Insert</span>`,
|
|
1021
|
-
query ? `<span class="ui-editor-slash-menu__header-query">${
|
|
1225
|
+
query ? `<span class="ui-editor-slash-menu__header-query">${escapeHtml2(query)}</span>` : "",
|
|
1022
1226
|
`</div>`,
|
|
1023
1227
|
`<ul class="ui-editor-slash-menu__list" role="presentation">${items}</ul>`,
|
|
1024
1228
|
`<div class="ui-editor-slash-menu__footer" aria-hidden="true">`,
|
|
@@ -1028,13 +1232,13 @@ if (typeof HTMLElement !== "undefined") {
|
|
|
1028
1232
|
].join("");
|
|
1029
1233
|
}
|
|
1030
1234
|
}
|
|
1031
|
-
if (typeof window !== "undefined" && !customElements.get(
|
|
1032
|
-
customElements.define(
|
|
1235
|
+
if (typeof window !== "undefined" && !customElements.get(TAG6)) {
|
|
1236
|
+
customElements.define(TAG6, UIEditorSlashMenuElement);
|
|
1033
1237
|
}
|
|
1034
1238
|
}
|
|
1035
1239
|
|
|
1036
1240
|
// src/toolbar.ts
|
|
1037
|
-
var
|
|
1241
|
+
var TAG7 = "ui-editor-toolbar";
|
|
1038
1242
|
if (typeof HTMLElement !== "undefined") {
|
|
1039
1243
|
class UIEditorToolbarElement extends HTMLElement {
|
|
1040
1244
|
connectedCallback() {
|
|
@@ -1046,8 +1250,8 @@ if (typeof HTMLElement !== "undefined") {
|
|
|
1046
1250
|
}
|
|
1047
1251
|
}
|
|
1048
1252
|
}
|
|
1049
|
-
if (typeof window !== "undefined" && !customElements.get(
|
|
1050
|
-
customElements.define(
|
|
1253
|
+
if (typeof window !== "undefined" && !customElements.get(TAG7)) {
|
|
1254
|
+
customElements.define(TAG7, UIEditorToolbarElement);
|
|
1051
1255
|
}
|
|
1052
1256
|
}
|
|
1053
1257
|
|