@threadlabs/looma 0.1.15 → 0.1.17

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.
Files changed (123) hide show
  1. package/dist/{chunk-SVINNT3E.js → chunk-OY4D3W4U.js} +29 -29
  2. package/dist/{chunk-G53JEAQK.js → chunk-SZJQ3NPX.js} +6 -3
  3. package/dist/chunk-YHXJC5M5.js +341 -0
  4. package/dist/cjs/loader.cjs.js +1 -1
  5. package/dist/cjs/looma.cjs.js +1 -1
  6. package/dist/cjs/{manager-BOpVXb92.js → manager-C9j3HZay.js} +5 -2
  7. package/dist/cjs/positioning-i0WrCAdF.js +384 -0
  8. package/dist/cjs/ui-affordance-scope.cjs.entry.js +3 -113
  9. package/dist/cjs/ui-context-menu.cjs.entry.js +40 -5
  10. package/dist/cjs/ui-dialog.cjs.entry.js +1 -1
  11. package/dist/cjs/ui-menu.cjs.entry.js +83 -2
  12. package/dist/cjs/ui-popover.cjs.entry.js +43 -3
  13. package/dist/cjs/ui-toast-region.cjs.entry.js +17 -2
  14. package/dist/cjs/ui-tooltip.cjs.entry.js +95 -27
  15. package/dist/cjs/ui-tree-item.cjs.entry.js +1 -1
  16. package/dist/collection/components/ui-context-menu/ui-context-menu.css +17 -4
  17. package/dist/collection/components/ui-context-menu/ui-context-menu.js +38 -3
  18. package/dist/collection/components/ui-menu/ui-menu.css +39 -0
  19. package/dist/collection/components/ui-menu/ui-menu.js +128 -1
  20. package/dist/collection/components/ui-popover/ui-popover.css +31 -0
  21. package/dist/collection/components/ui-popover/ui-popover.js +87 -1
  22. package/dist/collection/components/ui-toast-region/ui-toast-region.css +6 -0
  23. package/dist/collection/components/ui-toast-region/ui-toast-region.js +16 -1
  24. package/dist/collection/components/ui-tooltip/ui-tooltip.css +20 -0
  25. package/dist/collection/components/ui-tooltip/ui-tooltip.js +160 -25
  26. package/dist/collection/components/ui-tree-item/ui-tree-item.css +10 -6
  27. package/dist/collection/input-modality.js +24 -0
  28. package/dist/collection/overlay/manager.js +5 -2
  29. package/dist/collection/overlay/positioning.js +246 -0
  30. package/dist/components/p-CEYIKqYc.js +1 -0
  31. package/dist/components/p-DOulVJT7.js +1 -0
  32. package/dist/components/p-PM9a74r7.js +1 -0
  33. package/dist/components/ui-affordance-scope.js +1 -1
  34. package/dist/components/ui-context-menu.js +1 -1
  35. package/dist/components/ui-dialog.js +1 -1
  36. package/dist/components/ui-menu.js +1 -1
  37. package/dist/components/ui-popover.js +1 -1
  38. package/dist/components/ui-toast-region.js +1 -1
  39. package/dist/components/ui-tooltip.js +1 -1
  40. package/dist/components/ui-tree-item.js +1 -1
  41. package/dist/esm/loader.js +1 -1
  42. package/dist/esm/looma.js +1 -1
  43. package/dist/esm/{manager-CR7f2MQC.js → manager-PM9a74r7.js} +5 -2
  44. package/dist/esm/positioning-Bu0dmLBE.js +379 -0
  45. package/dist/esm/ui-affordance-scope.entry.js +1 -111
  46. package/dist/esm/ui-context-menu.entry.js +40 -5
  47. package/dist/esm/ui-dialog.entry.js +1 -1
  48. package/dist/esm/ui-menu.entry.js +83 -2
  49. package/dist/esm/ui-popover.entry.js +43 -3
  50. package/dist/esm/ui-toast-region.entry.js +17 -2
  51. package/dist/esm/ui-tooltip.entry.js +95 -27
  52. package/dist/esm/ui-tree-item.entry.js +1 -1
  53. package/dist/index.cjs +776 -59
  54. package/dist/index.d.cts +44 -1
  55. package/dist/index.d.ts +44 -1
  56. package/dist/index.js +235 -4
  57. package/dist/looma/looma.esm.js +1 -1
  58. package/dist/looma/{p-c6721aba.entry.js → p-11083743.entry.js} +1 -1
  59. package/dist/looma/p-1674cda4.entry.js +1 -0
  60. package/dist/looma/p-2e6f791e.entry.js +1 -0
  61. package/dist/looma/p-54c41576.entry.js +1 -0
  62. package/dist/looma/p-9194a99d.entry.js +1 -0
  63. package/dist/looma/p-Bu0dmLBE.js +1 -0
  64. package/dist/looma/p-PM9a74r7.js +1 -0
  65. package/dist/looma/p-ba01f45d.entry.js +1 -0
  66. package/dist/looma/p-caa8fc7b.entry.js +1 -0
  67. package/dist/looma/{p-ef9ca2ed.entry.js → p-d01960c2.entry.js} +2 -2
  68. package/dist/types/components/ui-context-menu/ui-context-menu.d.ts +3 -0
  69. package/dist/types/components/ui-menu/ui-menu.d.ts +13 -0
  70. package/dist/types/components/ui-popover/ui-popover.d.ts +9 -0
  71. package/dist/types/components/ui-toast-region/ui-toast-region.d.ts +2 -0
  72. package/dist/types/components/ui-tooltip/ui-tooltip.d.ts +16 -1
  73. package/dist/types/components.d.ts +71 -0
  74. package/dist/types/input-modality.d.ts +6 -0
  75. package/dist/types/overlay/manager.d.ts +3 -0
  76. package/dist/types/overlay/positioning.d.ts +33 -0
  77. package/dist/ui-affordance-scope.entry-X7DTKJGL.js +54 -0
  78. package/dist/{ui-avatar-group.entry-DQDP325O.js → ui-avatar-group.entry-MC34FKAN.js} +1 -1
  79. package/dist/{ui-avatar.entry-WYIDMOFE.js → ui-avatar.entry-OKRQWTQV.js} +1 -1
  80. package/dist/{ui-badge.entry-VGHXPEDT.js → ui-badge.entry-RI7JB7KV.js} +1 -1
  81. package/dist/{ui-button.entry-LKPLOJ22.js → ui-button.entry-PFO5TTPN.js} +1 -1
  82. package/dist/{ui-checkbox.entry-J74HEA22.js → ui-checkbox.entry-UHFWVISP.js} +1 -1
  83. package/dist/{ui-context-menu.entry-MQM2FCLI.js → ui-context-menu.entry-AIXB6U5D.js} +40 -6
  84. package/dist/{ui-dialog.entry-DQMMDO4Z.js → ui-dialog.entry-LPREQH2T.js} +2 -2
  85. package/dist/{ui-disclosure.entry-ONF7UZDC.js → ui-disclosure.entry-7XCUIYVZ.js} +1 -1
  86. package/dist/{ui-floating-action-button.entry-FKTGVC5T.js → ui-floating-action-button.entry-5PNIMUAW.js} +1 -1
  87. package/dist/{ui-form-field.entry-M3ISWQNU.js → ui-form-field.entry-77YW46SM.js} +1 -1
  88. package/dist/{ui-icon-button.entry-AWFIQUHM.js → ui-icon-button.entry-4AD6ALPQ.js} +1 -1
  89. package/dist/{ui-input.entry-JZ6RETMT.js → ui-input.entry-E7E6QDTV.js} +1 -1
  90. package/dist/{ui-menu-item.entry-5MFR5LFL.js → ui-menu-item.entry-H3HFLUB6.js} +1 -1
  91. package/dist/ui-menu.entry-UAKZU4HG.js +184 -0
  92. package/dist/{ui-popover.entry-ELCMKO6Y.js → ui-popover.entry-GVQKX26B.js} +46 -4
  93. package/dist/{ui-radio-group.entry-RJHUPPEM.js → ui-radio-group.entry-MNSR6UEE.js} +1 -1
  94. package/dist/{ui-radio.entry-3VRDPOY4.js → ui-radio.entry-6D4WTI5E.js} +1 -1
  95. package/dist/{ui-search-result-row.entry-J34YPAV7.js → ui-search-result-row.entry-J2TILUH2.js} +1 -1
  96. package/dist/{ui-search-shell.entry-IJ4UUP27.js → ui-search-shell.entry-FSWHEZQF.js} +1 -1
  97. package/dist/{ui-select.entry-C6YD3HQ5.js → ui-select.entry-JRCYYNNW.js} +1 -1
  98. package/dist/{ui-switch.entry-UZDF5QTI.js → ui-switch.entry-YZWMNRP2.js} +1 -1
  99. package/dist/{ui-tabs.entry-YRAKWOMR.js → ui-tabs.entry-F2Y344JY.js} +1 -1
  100. package/dist/{ui-textarea.entry-JLDKFT3K.js → ui-textarea.entry-3EZCUUAK.js} +1 -1
  101. package/dist/{ui-toast-region.entry-GC7C7KXF.js → ui-toast-region.entry-BTV4AW3I.js} +20 -3
  102. package/dist/ui-tooltip.entry-U644CF5U.js +214 -0
  103. package/dist/{ui-top-bar.entry-5W5UA5KV.js → ui-top-bar.entry-FGGOREQR.js} +1 -1
  104. package/dist/{ui-tree-item.entry-3LM7IXIK.js → ui-tree-item.entry-XVMHEONY.js} +2 -2
  105. package/dist/{ui-tree.entry-X4FU42A6.js → ui-tree.entry-4R7DYGAM.js} +1 -1
  106. package/editor.css +3 -4
  107. package/package.json +1 -1
  108. package/tokens.css +14 -2
  109. package/vue/{chunk-IITL6UBR.js → chunk-5KWCMTXB.js} +3 -0
  110. package/vue/editor/index.js +63 -52
  111. package/vue/index.js +1 -1
  112. package/dist/components/p-CR7f2MQC.js +0 -1
  113. package/dist/components/p-QiwSQmKJ.js +0 -1
  114. package/dist/looma/p-2ae73d5b.entry.js +0 -1
  115. package/dist/looma/p-3ac2e0d4.entry.js +0 -1
  116. package/dist/looma/p-65c25c94.entry.js +0 -1
  117. package/dist/looma/p-8c09c724.entry.js +0 -1
  118. package/dist/looma/p-95cd639d.entry.js +0 -1
  119. package/dist/looma/p-96f73d07.entry.js +0 -1
  120. package/dist/looma/p-CR7f2MQC.js +0 -1
  121. package/dist/ui-affordance-scope.entry-PFP2TDKO.js +0 -145
  122. package/dist/ui-menu.entry-IOEIDATQ.js +0 -98
  123. package/dist/ui-tooltip.entry-F26XDTYX.js +0 -145
@@ -2,7 +2,7 @@ import {
2
2
  Host,
3
3
  h,
4
4
  registerInstance
5
- } from "./chunk-SVINNT3E.js";
5
+ } from "./chunk-OY4D3W4U.js";
6
6
 
7
7
  // dist/esm/ui-floating-action-button.entry.js
8
8
  var uiFloatingActionButtonCss = () => `:host{position:fixed;inset-block-end:calc( var(--ui-floating-action-button-bottom, var(--ui-space-6, 1.5rem)) + env(safe-area-inset-bottom) );inset-inline-end:max( var(--ui-floating-action-button-inline-end, var(--ui-space-5, 1.25rem)), env(safe-area-inset-right) );inline-size:var(--ui-floating-action-button-size, 56px);block-size:var(--ui-floating-action-button-size, 56px);display:inline-flex;z-index:var(--ui-floating-action-button-z-index, 100)}button{appearance:none;inline-size:100%;block-size:100%;border:none;border-radius:999px;margin:0;padding:0;display:inline-flex;align-items:center;justify-content:center;background:var(--ui-floating-action-button-bg, var(--ui-accent-solid));color:var(--ui-floating-action-button-color, var(--ui-text-on-accent));box-shadow:var( --ui-floating-action-button-shadow, 0 4px 12px color-mix(in srgb, var(--ui-accent-solid) 40%, transparent) );cursor:pointer;transition:background-color var(--ui-motion-fast, 160ms) var(--ui-motion-ease, ease), transform var(--ui-motion-fast, 160ms) var(--ui-motion-ease, ease), box-shadow var(--ui-motion-fast, 160ms) var(--ui-motion-ease, ease)}button:hover:enabled{background:var(--ui-floating-action-button-hover-bg, var(--ui-accent-hover));box-shadow:var( --ui-floating-action-button-hover-shadow, 0 6px 16px color-mix(in srgb, var(--ui-accent-solid) 50%, transparent) )}button:active:enabled{transform:scale(var(--ui-floating-action-button-active-scale, 0.94))}button:focus-visible{outline:2px solid var(--ui-focus-ring);outline-offset:2px}button:disabled,:host([disabled]){opacity:0.6;cursor:not-allowed}::slotted(svg){inline-size:var(--ui-floating-action-button-icon-size, 24px);block-size:var(--ui-floating-action-button-icon-size, 24px);flex-shrink:0}@media (min-width: 768px){:host([mobile-only]){display:none}}`;
@@ -6,7 +6,7 @@ import {
6
6
  getElement,
7
7
  h,
8
8
  registerInstance
9
- } from "./chunk-SVINNT3E.js";
9
+ } from "./chunk-OY4D3W4U.js";
10
10
 
11
11
  // dist/esm/ui-form-field.entry.js
12
12
  var uiFormFieldCss = () => `:host{display:grid;gap:var(--ui-space-2);color:var(--ui-text-primary)}::slotted(label){color:var(--ui-text-secondary);font-size:0.95rem}::slotted([data-slot='help']){color:var(--ui-text-muted);font-size:0.875rem}::slotted([data-slot='error']),::slotted([role='alert']){color:var(--ui-accent-active);font-size:0.875rem}`;
@@ -2,7 +2,7 @@ import {
2
2
  Host,
3
3
  h,
4
4
  registerInstance
5
- } from "./chunk-SVINNT3E.js";
5
+ } from "./chunk-OY4D3W4U.js";
6
6
 
7
7
  // dist/esm/ui-icon-button.entry.js
8
8
  var uiIconButtonCss = () => `:host{display:inline-flex;color:var(--ui-text-secondary)}:host([anticipatory]){position:relative}:host([anticipatory])::before{content:'';position:absolute;inset:50% auto auto 50%;z-index:1;inline-size:var(--ui-affordance-guide-size, 0.25rem);block-size:var(--ui-affordance-guide-size, 0.25rem);border-radius:var(--ui-radius-round, 999px);background:var(--ui-affordance-guide-color, var(--ui-border-strong));opacity:var(--ui-affordance-guide-opacity, 0.42);transform:translate(-50%, -50%);transition:opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);pointer-events:none}:host([anticipatory]) button{opacity:0;transform:scale(0.72);pointer-events:none}:host([anticipatory][data-ui-proximity='near'])::before,:host([anticipatory]:focus-within)::before,:host([anticipatory]:hover)::before,:host([anticipatory][variant='solid'])::before{opacity:0}:host([anticipatory][data-ui-proximity='near']) button,:host([anticipatory]:focus-within) button,:host([anticipatory]:hover) button,:host([anticipatory][variant='solid']) button{opacity:1;transform:scale(1);pointer-events:auto}button{appearance:none;inline-size:var(--ui-icon-button-size, 2.5rem);block-size:var(--ui-icon-button-size, 2.5rem);min-inline-size:var(--ui-icon-button-size, 2.5rem);min-block-size:var(--ui-icon-button-size, 2.5rem);padding:0;margin:0;border:1px solid transparent;border-radius:var(--ui-icon-button-radius, var(--ui-radius-2));background:var(--ui-icon-button-bg, transparent);color:inherit;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color var(--ui-motion-fast) var(--ui-motion-ease), border-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease), transform var(--ui-motion-fast) var(--ui-motion-ease)}@media (hover: none), (pointer: coarse){:host([anticipatory])::before{opacity:0}:host([anticipatory]) button{opacity:1;transform:none;pointer-events:auto}}:host([size='sm']) button{inline-size:var(--ui-icon-button-size-sm, 2rem);block-size:var(--ui-icon-button-size-sm, 2rem);min-inline-size:var(--ui-icon-button-size-sm, 2rem);min-block-size:var(--ui-icon-button-size-sm, 2rem)}:host([size='lg']) button{inline-size:var(--ui-icon-button-size-lg, 2.75rem);block-size:var(--ui-icon-button-size-lg, 2.75rem);min-inline-size:var(--ui-icon-button-size-lg, 2.75rem);min-block-size:var(--ui-icon-button-size-lg, 2.75rem)}:host([variant='outline']) button{border-color:var(--ui-icon-button-border, var(--ui-border-default));background:var(--ui-icon-button-outline-bg, var(--ui-surface-default));color:var(--ui-icon-button-outline-color, var(--ui-text-primary))}:host([variant='solid']) button{background:var(--ui-icon-button-solid-bg, var(--ui-accent-solid));color:var(--ui-icon-button-solid-color, var(--ui-text-on-accent));box-shadow:var( --ui-icon-button-solid-shadow, 0 1px 2px color-mix(in srgb, var(--ui-accent-solid) 18%, transparent) )}button:hover:enabled{background:var(--ui-icon-button-hover-bg, var(--ui-surface-muted));color:var(--ui-icon-button-hover-color, var(--ui-text-primary))}:host([variant='outline']) button:hover:enabled{border-color:var(--ui-icon-button-hover-border, var(--ui-border-strong))}:host([variant='solid']) button:hover:enabled{background:var(--ui-icon-button-solid-hover-bg, var(--ui-accent-hover))}button:active:enabled{transform:scale(var(--ui-icon-button-active-scale, 0.96))}button:focus-visible{outline:2px solid var(--ui-focus-ring);outline-offset:2px}button:disabled,:host([disabled]){opacity:0.6;cursor:not-allowed}::slotted(svg){inline-size:var(--ui-icon-button-icon-size, 1.125rem);block-size:var(--ui-icon-button-icon-size, 1.125rem);flex-shrink:0;stroke-width:var(--ui-icon-button-icon-stroke-width, 1.75)}`;
@@ -7,7 +7,7 @@ import {
7
7
  getElement,
8
8
  h,
9
9
  registerInstance
10
- } from "./chunk-SVINNT3E.js";
10
+ } from "./chunk-OY4D3W4U.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-SVINNT3E.js";
5
+ } from "./chunk-OY4D3W4U.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}`;
@@ -0,0 +1,184 @@
1
+ import {
2
+ closeOverlay,
3
+ openOverlay,
4
+ requestTopOverlayClose
5
+ } from "./chunk-SZJQ3NPX.js";
6
+ import {
7
+ createAnchoredSurface
8
+ } from "./chunk-YHXJC5M5.js";
9
+ import {
10
+ dispatchDetail,
11
+ eventToTrigger
12
+ } from "./chunk-UL7UIUJZ.js";
13
+ import {
14
+ Host,
15
+ getElement,
16
+ h,
17
+ registerInstance
18
+ } from "./chunk-OY4D3W4U.js";
19
+
20
+ // dist/esm/ui-menu.entry.js
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}`;
22
+ var UIMenu = class {
23
+ constructor(hostRef) {
24
+ registerInstance(this, hostRef);
25
+ }
26
+ get host() {
27
+ return getElement(this);
28
+ }
29
+ open = false;
30
+ defaultOpen = false;
31
+ /** Id of the control that anchors this menu in the top layer. */
32
+ for;
33
+ /** Preferred placement; Looma flips and shifts when space is constrained. */
34
+ placement = "bottom-start";
35
+ internalOpen = false;
36
+ overlayId = `ui-menu-${Math.random().toString(36).slice(2, 11)}`;
37
+ anchor = null;
38
+ surface = null;
39
+ syncFromProp() {
40
+ this.internalOpen = this.open;
41
+ }
42
+ resetSurface() {
43
+ this.setupSurface();
44
+ this.syncSurface();
45
+ }
46
+ syncSurface() {
47
+ this.syncAnchorState();
48
+ if (!this.surface)
49
+ return;
50
+ if (this.internalOpen) {
51
+ this.surface.show();
52
+ openOverlay({
53
+ id: this.overlayId,
54
+ modal: false,
55
+ element: this.host,
56
+ relatedElements: this.anchor ? [this.anchor] : void 0,
57
+ dismissible: true,
58
+ requestClose: (reason, trigger) => this.closeMenu(reason, trigger)
59
+ });
60
+ } else {
61
+ this.surface.hide();
62
+ closeOverlay(this.overlayId);
63
+ }
64
+ }
65
+ componentDidLoad() {
66
+ this.syncFromProp();
67
+ this.internalOpen = this.internalOpen || this.defaultOpen;
68
+ this.host.addEventListener("click", this.onItemClick);
69
+ this.host.addEventListener("keydown", this.onKeydown);
70
+ this.setupSurface();
71
+ this.syncSurface();
72
+ }
73
+ disconnectedCallback() {
74
+ this.host.removeEventListener("click", this.onItemClick);
75
+ this.host.removeEventListener("keydown", this.onKeydown);
76
+ this.surface?.destroy();
77
+ this.surface = null;
78
+ closeOverlay(this.overlayId);
79
+ }
80
+ setupSurface() {
81
+ this.surface?.destroy();
82
+ this.surface = null;
83
+ this.anchor = this.for ? this.host.ownerDocument.getElementById(this.for) : null;
84
+ if (!this.anchor)
85
+ return;
86
+ this.surface = createAnchoredSurface(this.host, {
87
+ anchor: this.anchor,
88
+ placement: this.placement
89
+ });
90
+ }
91
+ syncAnchorState() {
92
+ if (!this.anchor)
93
+ return;
94
+ this.anchor.setAttribute("aria-haspopup", "menu");
95
+ this.anchor.setAttribute("aria-expanded", this.internalOpen ? "true" : "false");
96
+ }
97
+ closeMenu(reason, trigger) {
98
+ if (!this.internalOpen)
99
+ return;
100
+ this.internalOpen = false;
101
+ dispatchDetail(this.host, "close", {
102
+ open: false,
103
+ reason,
104
+ trigger
105
+ });
106
+ if (reason === "escape")
107
+ this.anchor?.focus();
108
+ }
109
+ getItems() {
110
+ return Array.from(this.host.querySelectorAll("ui-menu-item"));
111
+ }
112
+ isItemDisabled(item) {
113
+ return item.getAttribute("aria-disabled") === "true" || item.hasAttribute("disabled") || item.getAttribute("disabled") === "true" || item.disabled === true;
114
+ }
115
+ onItemClick = (e) => {
116
+ const item = e.target.closest?.("ui-menu-item");
117
+ if (!item || item.getRootNode() !== this.host.getRootNode())
118
+ return;
119
+ if (this.isItemDisabled(item))
120
+ return;
121
+ const value = item.getAttribute("value") ?? item.getAttribute("data-value") ?? "";
122
+ dispatchDetail(this.host, "select", { value, trigger: eventToTrigger(e) });
123
+ dispatchDetail(this.host, "close", {
124
+ open: false,
125
+ reason: "action",
126
+ trigger: eventToTrigger(e)
127
+ });
128
+ this.internalOpen = false;
129
+ };
130
+ onKeydown = (e) => {
131
+ if (e.key === "Escape") {
132
+ e.preventDefault();
133
+ requestTopOverlayClose("escape", "keyboard");
134
+ return;
135
+ }
136
+ const items = this.getItems().filter((i) => !this.isItemDisabled(i));
137
+ if (items.length === 0)
138
+ return;
139
+ const target = e.target.closest?.("ui-menu-item");
140
+ const currentIndex = target && target instanceof HTMLElement ? items.indexOf(target) : -1;
141
+ if (e.key === "Enter" || e.key === " ") {
142
+ e.preventDefault();
143
+ if (target && currentIndex >= 0) {
144
+ const value = target.getAttribute("value") ?? target.getAttribute("data-value") ?? "";
145
+ dispatchDetail(this.host, "select", { value, trigger: "keyboard" });
146
+ dispatchDetail(this.host, "close", {
147
+ open: false,
148
+ reason: "action",
149
+ trigger: "keyboard"
150
+ });
151
+ this.internalOpen = false;
152
+ }
153
+ return;
154
+ }
155
+ if (e.key === "ArrowDown" || e.key === "ArrowUp") {
156
+ e.preventDefault();
157
+ const nextIndex = e.key === "ArrowDown" ? currentIndex < 0 ? 0 : Math.min(currentIndex + 1, items.length - 1) : currentIndex <= 0 ? items.length - 1 : currentIndex - 1;
158
+ items[nextIndex].focus();
159
+ }
160
+ };
161
+ render() {
162
+ return h(Host, { key: "06ad0750df843cb874bd4f257d8567157c855493", role: "menu", "aria-orientation": "vertical", "data-open": this.internalOpen ? "" : void 0 }, h("slot", { key: "50118ac749a2747ca06f4d483499c4cd20125a89" }));
163
+ }
164
+ static get watchers() {
165
+ return {
166
+ "open": [{
167
+ "syncFromProp": 0
168
+ }],
169
+ "for": [{
170
+ "resetSurface": 0
171
+ }],
172
+ "placement": [{
173
+ "resetSurface": 0
174
+ }],
175
+ "internalOpen": [{
176
+ "syncSurface": 0
177
+ }]
178
+ };
179
+ }
180
+ };
181
+ UIMenu.style = uiMenuCss();
182
+ export {
183
+ UIMenu as ui_menu
184
+ };
@@ -2,7 +2,10 @@ import {
2
2
  closeOverlay,
3
3
  openOverlay,
4
4
  requestTopOverlayClose
5
- } from "./chunk-G53JEAQK.js";
5
+ } from "./chunk-SZJQ3NPX.js";
6
+ import {
7
+ createAnchoredSurface
8
+ } from "./chunk-YHXJC5M5.js";
6
9
  import {
7
10
  dispatchDetail
8
11
  } from "./chunk-UL7UIUJZ.js";
@@ -11,10 +14,10 @@ import {
11
14
  getElement,
12
15
  h,
13
16
  registerInstance
14
- } from "./chunk-SVINNT3E.js";
17
+ } from "./chunk-OY4D3W4U.js";
15
18
 
16
19
  // dist/esm/ui-popover.entry.js
17
- 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}`;
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}}`;
18
21
  var UIPopover = class {
19
22
  constructor(hostRef) {
20
23
  registerInstance(this, hostRef);
@@ -24,8 +27,13 @@ var UIPopover = class {
24
27
  }
25
28
  open = false;
26
29
  defaultOpen = false;
30
+ /** Optional id of the element this popover follows in the top layer. */
31
+ for;
32
+ placement = "bottom-start";
27
33
  internalOpen = false;
28
34
  overlayId = `ui-popover-${Math.random().toString(36).slice(2, 11)}`;
35
+ anchor = null;
36
+ surface = null;
29
37
  syncFromProp() {
30
38
  this.internalOpen = this.open;
31
39
  }
@@ -45,12 +53,37 @@ var UIPopover = class {
45
53
  });
46
54
  }
47
55
  }
56
+ resetSurface() {
57
+ this.setupSurface();
58
+ this.syncSurface();
59
+ }
60
+ setupSurface() {
61
+ this.surface?.destroy();
62
+ this.surface = null;
63
+ this.anchor = this.for ? this.host.ownerDocument.getElementById(this.for) : null;
64
+ if (!this.anchor)
65
+ return;
66
+ this.surface = createAnchoredSurface(this.host, {
67
+ anchor: this.anchor,
68
+ placement: this.placement
69
+ });
70
+ }
71
+ syncSurface() {
72
+ if (!this.surface)
73
+ return;
74
+ if (this.internalOpen)
75
+ this.surface.show();
76
+ else
77
+ this.surface.hide();
78
+ }
48
79
  syncOverlay() {
80
+ this.syncSurface();
49
81
  if (this.internalOpen) {
50
82
  openOverlay({
51
83
  id: this.overlayId,
52
84
  modal: false,
53
85
  element: this.host,
86
+ relatedElements: this.anchor ? [this.anchor] : void 0,
54
87
  dismissible: true,
55
88
  requestClose: (reason, trigger) => this.handleRequestClose(reason, trigger)
56
89
  });
@@ -62,10 +95,13 @@ var UIPopover = class {
62
95
  this.syncFromProp();
63
96
  this.internalOpen = this.internalOpen || this.defaultOpen;
64
97
  this.host.addEventListener("keydown", this.onKeydown);
98
+ this.setupSurface();
65
99
  this.syncOverlay();
66
100
  }
67
101
  disconnectedCallback() {
68
102
  this.host.removeEventListener("keydown", this.onKeydown);
103
+ this.surface?.destroy();
104
+ this.surface = null;
69
105
  closeOverlay(this.overlayId);
70
106
  }
71
107
  componentDidUpdate() {
@@ -85,7 +121,7 @@ var UIPopover = class {
85
121
  }
86
122
  };
87
123
  render() {
88
- return h(Host, { key: "67e7f52220db9d997fb11b686d6abcbdf9557a8d", "data-open": this.internalOpen ? "" : void 0, onKeyDown: this.onKeydown }, h("slot", { key: "d7c1fa2ab75994fe0a7dd63f8289754c7754c30f" }));
124
+ return h(Host, { key: "8e45be54147ff8f76a0d5e7fd875c3f4cf5ac40a", "data-open": this.internalOpen ? "" : void 0, onKeyDown: this.onKeydown }, h("slot", { key: "3141729cd32c8dcdaec1fbd763eb034242563c8f" }));
89
125
  }
90
126
  static get watchers() {
91
127
  return {
@@ -94,6 +130,12 @@ var UIPopover = class {
94
130
  }],
95
131
  "internalOpen": [{
96
132
  "onOpenChange": 0
133
+ }],
134
+ "for": [{
135
+ "resetSurface": 0
136
+ }],
137
+ "placement": [{
138
+ "resetSurface": 0
97
139
  }]
98
140
  };
99
141
  }
@@ -7,7 +7,7 @@ import {
7
7
  getElement,
8
8
  h,
9
9
  registerInstance
10
- } from "./chunk-SVINNT3E.js";
10
+ } from "./chunk-OY4D3W4U.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-SVINNT3E.js";
10
+ } from "./chunk-OY4D3W4U.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}`;
@@ -2,7 +2,7 @@ import {
2
2
  Host,
3
3
  h,
4
4
  registerInstance
5
- } from "./chunk-SVINNT3E.js";
5
+ } from "./chunk-OY4D3W4U.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-SVINNT3E.js";
4
+ } from "./chunk-OY4D3W4U.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-SVINNT3E.js";
10
+ } from "./chunk-OY4D3W4U.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-SVINNT3E.js";
9
+ } from "./chunk-OY4D3W4U.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-SVINNT3E.js";
10
+ } from "./chunk-OY4D3W4U.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-SVINNT3E.js";
10
+ } from "./chunk-OY4D3W4U.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}`;
@@ -1,3 +1,6 @@
1
+ import {
2
+ createViewportSurface
3
+ } from "./chunk-YHXJC5M5.js";
1
4
  import {
2
5
  dispatchDetail,
3
6
  eventToTrigger
@@ -7,10 +10,10 @@ import {
7
10
  getElement,
8
11
  h,
9
12
  registerInstance
10
- } from "./chunk-SVINNT3E.js";
13
+ } from "./chunk-OY4D3W4U.js";
11
14
 
12
15
  // dist/esm/ui-toast-region.entry.js
13
- 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>*{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}`;
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
17
  var UIToastRegion = class {
15
18
  constructor(hostRef) {
16
19
  registerInstance(this, hostRef);
@@ -20,15 +23,26 @@ var UIToastRegion = class {
20
23
  }
21
24
  open = true;
22
25
  internalOpen = true;
26
+ surface = null;
23
27
  syncFromProp() {
24
28
  this.internalOpen = this.open;
25
29
  }
30
+ syncSurface() {
31
+ if (this.internalOpen)
32
+ this.surface?.show();
33
+ else
34
+ this.surface?.hide();
35
+ }
26
36
  componentDidLoad() {
37
+ this.surface = createViewportSurface(this.host);
27
38
  this.syncFromProp();
39
+ this.syncSurface();
28
40
  this.host.addEventListener("click", this.onClick);
29
41
  }
30
42
  disconnectedCallback() {
31
43
  this.host.removeEventListener("click", this.onClick);
44
+ this.surface?.destroy();
45
+ this.surface = null;
32
46
  }
33
47
  getToasts() {
34
48
  return Array.from(this.host.querySelectorAll("[data-ui-toast]"));
@@ -62,12 +76,15 @@ var UIToastRegion = class {
62
76
  }
63
77
  };
64
78
  render() {
65
- return h(Host, { key: "0edcce54864ba991b092d004d3b45cf697b9c3ac", role: "region", "aria-label": "Notifications", "data-open": this.internalOpen ? "" : void 0 }, h("slot", { key: "2e30794a05b018fb55c4313c8e17f7262ecee7da" }));
79
+ return h(Host, { key: "693e24016ec0881a4d619a489f1b655feee41784", role: "region", "aria-label": "Notifications", "data-open": this.internalOpen ? "" : void 0 }, h("slot", { key: "e666b2a73a5d7eb8dd607df3d1c5135b78cf3775" }));
66
80
  }
67
81
  static get watchers() {
68
82
  return {
69
83
  "open": [{
70
84
  "syncFromProp": 0
85
+ }],
86
+ "internalOpen": [{
87
+ "syncSurface": 0
71
88
  }]
72
89
  };
73
90
  }