@deepfuture/dui-components 0.0.12 → 0.0.14

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 (89) hide show
  1. package/_deprecated/center/center.js +2 -2
  2. package/_deprecated/hstack/hstack.js +79 -33
  3. package/_deprecated/page-inset/page-inset.js +104 -56
  4. package/_deprecated/vstack/vstack.js +61 -19
  5. package/accordion/accordion-item.js +217 -147
  6. package/accordion/accordion.js +214 -149
  7. package/alert-dialog/alert-dialog-close.js +2 -2
  8. package/alert-dialog/alert-dialog-popup.js +230 -166
  9. package/alert-dialog/alert-dialog-trigger.js +2 -2
  10. package/alert-dialog/alert-dialog.js +128 -73
  11. package/avatar/avatar.js +175 -115
  12. package/badge/badge.js +2 -2
  13. package/breadcrumb/breadcrumb-ellipsis.js +2 -2
  14. package/breadcrumb/breadcrumb-item.js +2 -2
  15. package/breadcrumb/breadcrumb-link.js +2 -2
  16. package/breadcrumb/breadcrumb-page.js +2 -2
  17. package/breadcrumb/breadcrumb-separator.js +2 -2
  18. package/breadcrumb/breadcrumb.js +2 -2
  19. package/button/button.js +109 -65
  20. package/calendar/calendar.js +368 -290
  21. package/checkbox/checkbox-group.js +146 -87
  22. package/checkbox/checkbox.js +232 -167
  23. package/collapsible/collapsible.js +210 -132
  24. package/combobox/combobox.js +318 -252
  25. package/command/command-empty.js +67 -25
  26. package/command/command-group.js +87 -47
  27. package/command/command-input.js +84 -44
  28. package/command/command-item.js +168 -124
  29. package/command/command-list.js +60 -18
  30. package/command/command-separator.js +2 -2
  31. package/command/command-shortcut.js +2 -2
  32. package/command/command.js +297 -232
  33. package/data-table/data-table.js +225 -153
  34. package/dialog/dialog-close.js +2 -2
  35. package/dialog/dialog-popup.js +247 -181
  36. package/dialog/dialog-trigger.js +2 -2
  37. package/dialog/dialog.js +128 -73
  38. package/dropzone/dropzone.js +310 -249
  39. package/icon/icon.js +2 -2
  40. package/input/input.js +204 -143
  41. package/link/link.js +62 -24
  42. package/menu/menu-item.js +66 -24
  43. package/menu/menu.js +189 -136
  44. package/menubar/menubar.js +142 -91
  45. package/number-field/number-field.js +277 -204
  46. package/package.json +2 -3
  47. package/popover/popover-close.js +2 -2
  48. package/popover/popover-popup.js +126 -76
  49. package/popover/popover-trigger.js +2 -2
  50. package/popover/popover.js +181 -120
  51. package/portal/portal.js +128 -86
  52. package/preview-card/preview-card-popup.js +114 -66
  53. package/preview-card/preview-card-trigger.js +2 -2
  54. package/preview-card/preview-card.js +211 -142
  55. package/progress/progress.js +91 -45
  56. package/radio/radio-group.js +153 -90
  57. package/radio/radio.js +137 -94
  58. package/scroll-area/scroll-area.js +382 -283
  59. package/select/select.js +260 -203
  60. package/separator/separator.js +60 -18
  61. package/sidebar/sidebar-content.js +2 -2
  62. package/sidebar/sidebar-footer.js +2 -2
  63. package/sidebar/sidebar-group-label.js +2 -2
  64. package/sidebar/sidebar-group.js +2 -2
  65. package/sidebar/sidebar-header.js +2 -2
  66. package/sidebar/sidebar-inset.js +2 -2
  67. package/sidebar/sidebar-menu-button.js +118 -74
  68. package/sidebar/sidebar-menu-item.js +2 -2
  69. package/sidebar/sidebar-menu.js +2 -2
  70. package/sidebar/sidebar-provider.js +202 -129
  71. package/sidebar/sidebar-separator.js +2 -2
  72. package/sidebar/sidebar-trigger.js +2 -2
  73. package/sidebar/sidebar.js +150 -85
  74. package/slider/slider.js +217 -159
  75. package/spinner/spinner.js +70 -28
  76. package/switch/switch.js +174 -111
  77. package/tabs/tab.js +89 -47
  78. package/tabs/tabs-indicator.js +2 -2
  79. package/tabs/tabs-list.js +92 -54
  80. package/tabs/tabs-panel.js +90 -44
  81. package/tabs/tabs.js +130 -71
  82. package/textarea/textarea.js +153 -95
  83. package/toggle/toggle-group.js +184 -125
  84. package/toggle/toggle.js +131 -76
  85. package/toolbar/toolbar.js +79 -33
  86. package/tooltip/tooltip-popup.js +108 -60
  87. package/tooltip/tooltip-trigger.js +93 -55
  88. package/tooltip/tooltip.js +225 -154
  89. package/trunc/trunc.js +78 -34
@@ -1,12 +1,44 @@
1
1
  /** Ported from original DUI: deep-future-app/app/client/components/dui/popover */
2
- var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
3
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
4
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
5
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
6
- return c > 3 && r && Object.defineProperty(target, key, r), r;
2
+ var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
3
+ function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
4
+ var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
5
+ var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
6
+ var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
7
+ var _, done = false;
8
+ for (var i = decorators.length - 1; i >= 0; i--) {
9
+ var context = {};
10
+ for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
11
+ for (var p in contextIn.access) context.access[p] = contextIn.access[p];
12
+ context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
13
+ var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
14
+ if (kind === "accessor") {
15
+ if (result === void 0) continue;
16
+ if (result === null || typeof result !== "object") throw new TypeError("Object expected");
17
+ if (_ = accept(result.get)) descriptor.get = _;
18
+ if (_ = accept(result.set)) descriptor.set = _;
19
+ if (_ = accept(result.init)) initializers.unshift(_);
20
+ }
21
+ else if (_ = accept(result)) {
22
+ if (kind === "field") initializers.unshift(_);
23
+ else descriptor[key] = _;
24
+ }
25
+ }
26
+ if (target) Object.defineProperty(target, contextIn.name, descriptor);
27
+ done = true;
28
+ };
29
+ var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
30
+ var useValue = arguments.length > 2;
31
+ for (var i = 0; i < initializers.length; i++) {
32
+ value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
33
+ }
34
+ return useValue ? value : void 0;
35
+ };
36
+ var __setFunctionName = (this && this.__setFunctionName) || function (f, name, prefix) {
37
+ if (typeof name === "symbol") name = name.description ? "[".concat(name.description, "]") : "";
38
+ return Object.defineProperty(f, "name", { configurable: true, value: prefix ? "".concat(prefix, " ", name) : name });
7
39
  };
8
40
  import { css, html, LitElement } from "lit";
9
- import { property } from "lit/decorators.js";
41
+ import { property, state } from "lit/decorators.js";
10
42
  import { ContextConsumer } from "@lit/context";
11
43
  import { base } from "@deepfuture/dui-core/base";
12
44
  import { popoverContext } from "./popover-context.js";
@@ -67,41 +99,63 @@ const portalPopupStyles = [
67
99
  *
68
100
  * @slot - Popover content.
69
101
  */
70
- export class DuiPopoverPopup extends LitElement {
71
- static { this.tagName = "dui-popover-popup"; }
72
- static { this.styles = [base, hostStyles]; }
73
- #showArrow_accessor_storage = true;
74
- /** Whether to show an arrow pointing to the trigger. */
75
- get showArrow() { return this.#showArrow_accessor_storage; }
76
- set showArrow(value) { this.#showArrow_accessor_storage = value; }
77
- #closeOnClick_accessor_storage = false;
78
- /** Close the popover when content inside the popup is clicked. */
79
- get closeOnClick() { return this.#closeOnClick_accessor_storage; }
80
- set closeOnClick(value) { this.#closeOnClick_accessor_storage = value; }
81
- #side_accessor_storage = "bottom";
82
- get #side() { return this.#side_accessor_storage; }
83
- set #side(value) { this.#side_accessor_storage = value; }
84
- #ctx = new ContextConsumer(this, {
85
- context: popoverContext,
86
- subscribe: true,
87
- });
88
- #wasOpen = false;
89
- #portal = new FloatingPortalController(this, {
90
- getAnchor: () => this.#ctx.value?.triggerEl,
91
- matchWidth: false,
92
- placement: "bottom",
93
- offset: 8,
94
- styles: portalPopupStyles,
95
- contentContainer: ".Content",
96
- onPosition: ({ placement }) => {
97
- const actualSide = placement.split("-")[0];
98
- if (actualSide !== this.#side) {
99
- this.#side = actualSide;
100
- }
101
- },
102
- renderPopup: (portal) => {
103
- const popupId = this.#ctx.value?.popupId ?? "";
104
- return html `
102
+ let DuiPopoverPopup = (() => {
103
+ let _classSuper = LitElement;
104
+ let _showArrow_decorators;
105
+ let _showArrow_initializers = [];
106
+ let _showArrow_extraInitializers = [];
107
+ let _closeOnClick_decorators;
108
+ let _closeOnClick_initializers = [];
109
+ let _closeOnClick_extraInitializers = [];
110
+ let _private_side_decorators;
111
+ let _private_side_initializers = [];
112
+ let _private_side_extraInitializers = [];
113
+ let _private_side_descriptor;
114
+ return class DuiPopoverPopup extends _classSuper {
115
+ static {
116
+ const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
117
+ _showArrow_decorators = [property({ type: Boolean, attribute: "show-arrow" })];
118
+ _closeOnClick_decorators = [property({ type: Boolean, attribute: "close-on-click" })];
119
+ _private_side_decorators = [state()];
120
+ __esDecorate(this, null, _showArrow_decorators, { kind: "accessor", name: "showArrow", static: false, private: false, access: { has: obj => "showArrow" in obj, get: obj => obj.showArrow, set: (obj, value) => { obj.showArrow = value; } }, metadata: _metadata }, _showArrow_initializers, _showArrow_extraInitializers);
121
+ __esDecorate(this, null, _closeOnClick_decorators, { kind: "accessor", name: "closeOnClick", static: false, private: false, access: { has: obj => "closeOnClick" in obj, get: obj => obj.closeOnClick, set: (obj, value) => { obj.closeOnClick = value; } }, metadata: _metadata }, _closeOnClick_initializers, _closeOnClick_extraInitializers);
122
+ __esDecorate(this, _private_side_descriptor = { get: __setFunctionName(function () { return this.#side_accessor_storage; }, "#side", "get"), set: __setFunctionName(function (value) { this.#side_accessor_storage = value; }, "#side", "set") }, _private_side_decorators, { kind: "accessor", name: "#side", static: false, private: true, access: { has: obj => #side in obj, get: obj => obj.#side, set: (obj, value) => { obj.#side = value; } }, metadata: _metadata }, _private_side_initializers, _private_side_extraInitializers);
123
+ if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
124
+ }
125
+ static tagName = "dui-popover-popup";
126
+ static styles = [base, hostStyles];
127
+ #showArrow_accessor_storage = __runInitializers(this, _showArrow_initializers, true);
128
+ /** Whether to show an arrow pointing to the trigger. */
129
+ get showArrow() { return this.#showArrow_accessor_storage; }
130
+ set showArrow(value) { this.#showArrow_accessor_storage = value; }
131
+ #closeOnClick_accessor_storage = (__runInitializers(this, _showArrow_extraInitializers), __runInitializers(this, _closeOnClick_initializers, false));
132
+ /** Close the popover when content inside the popup is clicked. */
133
+ get closeOnClick() { return this.#closeOnClick_accessor_storage; }
134
+ set closeOnClick(value) { this.#closeOnClick_accessor_storage = value; }
135
+ #side_accessor_storage = (__runInitializers(this, _closeOnClick_extraInitializers), __runInitializers(this, _private_side_initializers, "bottom"));
136
+ get #side() { return _private_side_descriptor.get.call(this); }
137
+ set #side(value) { return _private_side_descriptor.set.call(this, value); }
138
+ #ctx = (__runInitializers(this, _private_side_extraInitializers), new ContextConsumer(this, {
139
+ context: popoverContext,
140
+ subscribe: true,
141
+ }));
142
+ #wasOpen = false;
143
+ #portal = new FloatingPortalController(this, {
144
+ getAnchor: () => this.#ctx.value?.triggerEl,
145
+ matchWidth: false,
146
+ placement: "bottom",
147
+ offset: 8,
148
+ styles: portalPopupStyles,
149
+ contentContainer: ".Content",
150
+ onPosition: ({ placement }) => {
151
+ const actualSide = placement.split("-")[0];
152
+ if (actualSide !== this.#side) {
153
+ this.#side = actualSide;
154
+ }
155
+ },
156
+ renderPopup: (portal) => {
157
+ const popupId = this.#ctx.value?.popupId ?? "";
158
+ return html `
105
159
  <div
106
160
  class="Popup"
107
161
  id="${popupId}"
@@ -115,41 +169,37 @@ export class DuiPopoverPopup extends LitElement {
115
169
  ${this.showArrow ? renderArrow(this.#side) : ""}
116
170
  </div>
117
171
  `;
118
- },
119
- });
120
- /** Check if an event path includes this popup's portal positioner. */
121
- containsEventTarget(path) {
122
- const positioner = this.#portal.positionerElement;
123
- return positioner !== null && path.includes(positioner);
124
- }
125
- #handleContentClick = () => {
126
- if (this.closeOnClick) {
127
- this.#ctx.value?.closePopover();
172
+ },
173
+ });
174
+ /** Check if an event path includes this popup's portal positioner. */
175
+ containsEventTarget(path) {
176
+ const positioner = this.#portal.positionerElement;
177
+ return positioner !== null && path.includes(positioner);
128
178
  }
129
- };
130
- updated() {
131
- const isOpen = this.#ctx.value?.open ?? false;
132
- if (isOpen && !this.#wasOpen) {
133
- this.#updatePlacement();
134
- this.#portal.open();
179
+ #handleContentClick = () => {
180
+ if (this.closeOnClick) {
181
+ this.#ctx.value?.closePopover();
182
+ }
183
+ };
184
+ updated() {
185
+ const isOpen = this.#ctx.value?.open ?? false;
186
+ if (isOpen && !this.#wasOpen) {
187
+ this.#updatePlacement();
188
+ this.#portal.open();
189
+ }
190
+ else if (!isOpen && this.#wasOpen) {
191
+ this.#portal.close();
192
+ }
193
+ this.#wasOpen = isOpen;
135
194
  }
136
- else if (!isOpen && this.#wasOpen) {
137
- this.#portal.close();
195
+ #updatePlacement() {
196
+ const side = this.#ctx.value?.side ?? "bottom";
197
+ this.#portal.placement = side;
198
+ this.#portal.offset = this.#ctx.value?.sideOffset ?? 8;
138
199
  }
139
- this.#wasOpen = isOpen;
140
- }
141
- #updatePlacement() {
142
- const side = this.#ctx.value?.side ?? "bottom";
143
- this.#portal.placement = side;
144
- this.#portal.offset = this.#ctx.value?.sideOffset ?? 8;
145
- }
146
- render() {
147
- return html `<slot></slot>`;
148
- }
149
- }
150
- __decorate([
151
- property({ type: Boolean, attribute: "show-arrow" })
152
- ], DuiPopoverPopup.prototype, "showArrow", null);
153
- __decorate([
154
- property({ type: Boolean, attribute: "close-on-click" })
155
- ], DuiPopoverPopup.prototype, "closeOnClick", null);
200
+ render() {
201
+ return html `<slot></slot>`;
202
+ }
203
+ };
204
+ })();
205
+ export { DuiPopoverPopup };
@@ -19,8 +19,8 @@ const componentStyles = css `
19
19
  * @slot - Content that triggers the popover (usually a button).
20
20
  */
21
21
  export class DuiPopoverTrigger extends LitElement {
22
- static { this.tagName = "dui-popover-trigger"; }
23
- static { this.styles = [base, hostStyles, componentStyles]; }
22
+ static tagName = "dui-popover-trigger";
23
+ static styles = [base, hostStyles, componentStyles];
24
24
  #ctx = new ContextConsumer(this, {
25
25
  context: popoverContext,
26
26
  subscribe: true,
@@ -1,9 +1,41 @@
1
1
  /** Ported from original DUI: deep-future-app/app/client/components/dui/popover */
2
- var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
3
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
4
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
5
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
6
- return c > 3 && r && Object.defineProperty(target, key, r), r;
2
+ var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
3
+ function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
4
+ var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
5
+ var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
6
+ var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
7
+ var _, done = false;
8
+ for (var i = decorators.length - 1; i >= 0; i--) {
9
+ var context = {};
10
+ for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
11
+ for (var p in contextIn.access) context.access[p] = contextIn.access[p];
12
+ context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
13
+ var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
14
+ if (kind === "accessor") {
15
+ if (result === void 0) continue;
16
+ if (result === null || typeof result !== "object") throw new TypeError("Object expected");
17
+ if (_ = accept(result.get)) descriptor.get = _;
18
+ if (_ = accept(result.set)) descriptor.set = _;
19
+ if (_ = accept(result.init)) initializers.unshift(_);
20
+ }
21
+ else if (_ = accept(result)) {
22
+ if (kind === "field") initializers.unshift(_);
23
+ else descriptor[key] = _;
24
+ }
25
+ }
26
+ if (target) Object.defineProperty(target, contextIn.name, descriptor);
27
+ done = true;
28
+ };
29
+ var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
30
+ var useValue = arguments.length > 2;
31
+ for (var i = 0; i < initializers.length; i++) {
32
+ value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
33
+ }
34
+ return useValue ? value : void 0;
35
+ };
36
+ var __setFunctionName = (this && this.__setFunctionName) || function (f, name, prefix) {
37
+ if (typeof name === "symbol") name = name.description ? "[".concat(name.description, "]") : "";
38
+ return Object.defineProperty(f, "name", { configurable: true, value: prefix ? "".concat(prefix, " ", name) : name });
7
39
  };
8
40
  import { css, html, LitElement } from "lit";
9
41
  import { property, state } from "lit/decorators.js";
@@ -23,124 +55,153 @@ const hostStyles = css `
23
55
  * @slot - Default slot for dui-popover-trigger and dui-popover-popup.
24
56
  * @fires open-change - Dispatched when the popover opens or closes.
25
57
  */
26
- export class DuiPopover extends LitElement {
27
- static { this.tagName = "dui-popover"; }
28
- static { this.styles = [base, hostStyles]; }
29
- #open_accessor_storage = false;
30
- /** Controlled open state. */
31
- get open() { return this.#open_accessor_storage; }
32
- set open(value) { this.#open_accessor_storage = value; }
33
- #defaultOpen_accessor_storage = false;
34
- /** Default open state for uncontrolled usage. */
35
- get defaultOpen() { return this.#defaultOpen_accessor_storage; }
36
- set defaultOpen(value) { this.#defaultOpen_accessor_storage = value; }
37
- #side_accessor_storage = "bottom";
38
- /** Which side of the trigger the popover appears on. */
39
- get side() { return this.#side_accessor_storage; }
40
- set side(value) { this.#side_accessor_storage = value; }
41
- #sideOffset_accessor_storage = 8;
42
- /** Offset from the trigger in pixels. */
43
- get sideOffset() { return this.#sideOffset_accessor_storage; }
44
- set sideOffset(value) { this.#sideOffset_accessor_storage = value; }
45
- #internalOpen_accessor_storage = false;
46
- get #internalOpen() { return this.#internalOpen_accessor_storage; }
47
- set #internalOpen(value) { this.#internalOpen_accessor_storage = value; }
48
- #triggerEl_accessor_storage;
49
- get #triggerEl() { return this.#triggerEl_accessor_storage; }
50
- set #triggerEl(value) { this.#triggerEl_accessor_storage = value; }
51
- get #isOpen() {
52
- return this.open || this.#internalOpen;
53
- }
54
- #triggerId = `popover-trigger-${crypto.randomUUID().slice(0, 8)}`;
55
- #popupId = `popover-popup-${crypto.randomUUID().slice(0, 8)}`;
56
- #_ctx_accessor_storage = {
57
- open: false,
58
- triggerId: this.#triggerId,
59
- popupId: this.#popupId,
60
- side: "bottom",
61
- sideOffset: 8,
62
- triggerEl: undefined,
63
- openPopover: () => this.#doOpen(),
64
- closePopover: () => this.#doClose(),
65
- togglePopover: () => this.#doToggle(),
66
- setTriggerEl: (el) => this.#setTriggerEl(el),
67
- };
68
- get _ctx() { return this.#_ctx_accessor_storage; }
69
- set _ctx(value) { this.#_ctx_accessor_storage = value; }
70
- connectedCallback() {
71
- super.connectedCallback();
72
- if (this.defaultOpen) {
58
+ let DuiPopover = (() => {
59
+ let _classSuper = LitElement;
60
+ let _open_decorators;
61
+ let _open_initializers = [];
62
+ let _open_extraInitializers = [];
63
+ let _defaultOpen_decorators;
64
+ let _defaultOpen_initializers = [];
65
+ let _defaultOpen_extraInitializers = [];
66
+ let _side_decorators;
67
+ let _side_initializers = [];
68
+ let _side_extraInitializers = [];
69
+ let _sideOffset_decorators;
70
+ let _sideOffset_initializers = [];
71
+ let _sideOffset_extraInitializers = [];
72
+ let _private_internalOpen_decorators;
73
+ let _private_internalOpen_initializers = [];
74
+ let _private_internalOpen_extraInitializers = [];
75
+ let _private_internalOpen_descriptor;
76
+ let _private_triggerEl_decorators;
77
+ let _private_triggerEl_initializers = [];
78
+ let _private_triggerEl_extraInitializers = [];
79
+ let _private_triggerEl_descriptor;
80
+ let __ctx_decorators;
81
+ let __ctx_initializers = [];
82
+ let __ctx_extraInitializers = [];
83
+ return class DuiPopover extends _classSuper {
84
+ static {
85
+ const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
86
+ _open_decorators = [property({ type: Boolean, reflect: true })];
87
+ _defaultOpen_decorators = [property({ type: Boolean, attribute: "default-open" })];
88
+ _side_decorators = [property({ reflect: true })];
89
+ _sideOffset_decorators = [property({ type: Number, attribute: "side-offset" })];
90
+ _private_internalOpen_decorators = [state()];
91
+ _private_triggerEl_decorators = [state()];
92
+ __ctx_decorators = [provide({ context: popoverContext }), state()];
93
+ __esDecorate(this, null, _open_decorators, { kind: "accessor", name: "open", static: false, private: false, access: { has: obj => "open" in obj, get: obj => obj.open, set: (obj, value) => { obj.open = value; } }, metadata: _metadata }, _open_initializers, _open_extraInitializers);
94
+ __esDecorate(this, null, _defaultOpen_decorators, { kind: "accessor", name: "defaultOpen", static: false, private: false, access: { has: obj => "defaultOpen" in obj, get: obj => obj.defaultOpen, set: (obj, value) => { obj.defaultOpen = value; } }, metadata: _metadata }, _defaultOpen_initializers, _defaultOpen_extraInitializers);
95
+ __esDecorate(this, null, _side_decorators, { kind: "accessor", name: "side", static: false, private: false, access: { has: obj => "side" in obj, get: obj => obj.side, set: (obj, value) => { obj.side = value; } }, metadata: _metadata }, _side_initializers, _side_extraInitializers);
96
+ __esDecorate(this, null, _sideOffset_decorators, { kind: "accessor", name: "sideOffset", static: false, private: false, access: { has: obj => "sideOffset" in obj, get: obj => obj.sideOffset, set: (obj, value) => { obj.sideOffset = value; } }, metadata: _metadata }, _sideOffset_initializers, _sideOffset_extraInitializers);
97
+ __esDecorate(this, _private_internalOpen_descriptor = { get: __setFunctionName(function () { return this.#internalOpen_accessor_storage; }, "#internalOpen", "get"), set: __setFunctionName(function (value) { this.#internalOpen_accessor_storage = value; }, "#internalOpen", "set") }, _private_internalOpen_decorators, { kind: "accessor", name: "#internalOpen", static: false, private: true, access: { has: obj => #internalOpen in obj, get: obj => obj.#internalOpen, set: (obj, value) => { obj.#internalOpen = value; } }, metadata: _metadata }, _private_internalOpen_initializers, _private_internalOpen_extraInitializers);
98
+ __esDecorate(this, _private_triggerEl_descriptor = { get: __setFunctionName(function () { return this.#triggerEl_accessor_storage; }, "#triggerEl", "get"), set: __setFunctionName(function (value) { this.#triggerEl_accessor_storage = value; }, "#triggerEl", "set") }, _private_triggerEl_decorators, { kind: "accessor", name: "#triggerEl", static: false, private: true, access: { has: obj => #triggerEl in obj, get: obj => obj.#triggerEl, set: (obj, value) => { obj.#triggerEl = value; } }, metadata: _metadata }, _private_triggerEl_initializers, _private_triggerEl_extraInitializers);
99
+ __esDecorate(this, null, __ctx_decorators, { kind: "accessor", name: "_ctx", static: false, private: false, access: { has: obj => "_ctx" in obj, get: obj => obj._ctx, set: (obj, value) => { obj._ctx = value; } }, metadata: _metadata }, __ctx_initializers, __ctx_extraInitializers);
100
+ if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
101
+ }
102
+ static tagName = "dui-popover";
103
+ static styles = [base, hostStyles];
104
+ #open_accessor_storage = __runInitializers(this, _open_initializers, false);
105
+ /** Controlled open state. */
106
+ get open() { return this.#open_accessor_storage; }
107
+ set open(value) { this.#open_accessor_storage = value; }
108
+ #defaultOpen_accessor_storage = (__runInitializers(this, _open_extraInitializers), __runInitializers(this, _defaultOpen_initializers, false));
109
+ /** Default open state for uncontrolled usage. */
110
+ get defaultOpen() { return this.#defaultOpen_accessor_storage; }
111
+ set defaultOpen(value) { this.#defaultOpen_accessor_storage = value; }
112
+ #side_accessor_storage = (__runInitializers(this, _defaultOpen_extraInitializers), __runInitializers(this, _side_initializers, "bottom"));
113
+ /** Which side of the trigger the popover appears on. */
114
+ get side() { return this.#side_accessor_storage; }
115
+ set side(value) { this.#side_accessor_storage = value; }
116
+ #sideOffset_accessor_storage = (__runInitializers(this, _side_extraInitializers), __runInitializers(this, _sideOffset_initializers, 8));
117
+ /** Offset from the trigger in pixels. */
118
+ get sideOffset() { return this.#sideOffset_accessor_storage; }
119
+ set sideOffset(value) { this.#sideOffset_accessor_storage = value; }
120
+ #internalOpen_accessor_storage = (__runInitializers(this, _sideOffset_extraInitializers), __runInitializers(this, _private_internalOpen_initializers, false));
121
+ get #internalOpen() { return _private_internalOpen_descriptor.get.call(this); }
122
+ set #internalOpen(value) { return _private_internalOpen_descriptor.set.call(this, value); }
123
+ #triggerEl_accessor_storage = (__runInitializers(this, _private_internalOpen_extraInitializers), __runInitializers(this, _private_triggerEl_initializers, void 0));
124
+ get #triggerEl() { return _private_triggerEl_descriptor.get.call(this); }
125
+ set #triggerEl(value) { return _private_triggerEl_descriptor.set.call(this, value); }
126
+ get #isOpen() {
127
+ return this.open || this.#internalOpen;
128
+ }
129
+ #triggerId = (__runInitializers(this, _private_triggerEl_extraInitializers), `popover-trigger-${crypto.randomUUID().slice(0, 8)}`);
130
+ #popupId = `popover-popup-${crypto.randomUUID().slice(0, 8)}`;
131
+ #_ctx_accessor_storage = __runInitializers(this, __ctx_initializers, {
132
+ open: false,
133
+ triggerId: this.#triggerId,
134
+ popupId: this.#popupId,
135
+ side: "bottom",
136
+ sideOffset: 8,
137
+ triggerEl: undefined,
138
+ openPopover: () => this.#doOpen(),
139
+ closePopover: () => this.#doClose(),
140
+ togglePopover: () => this.#doToggle(),
141
+ setTriggerEl: (el) => this.#setTriggerEl(el),
142
+ });
143
+ get _ctx() { return this.#_ctx_accessor_storage; }
144
+ set _ctx(value) { this.#_ctx_accessor_storage = value; }
145
+ connectedCallback() {
146
+ super.connectedCallback();
147
+ if (this.defaultOpen) {
148
+ this.#internalOpen = true;
149
+ }
150
+ document.addEventListener("keydown", this.#onDocumentKeyDown);
151
+ }
152
+ disconnectedCallback() {
153
+ super.disconnectedCallback();
154
+ document.removeEventListener("keydown", this.#onDocumentKeyDown);
155
+ }
156
+ willUpdate(changed) {
157
+ if (changed.has("open") ||
158
+ changed.has("side") ||
159
+ changed.has("sideOffset") ||
160
+ this._ctx.open !== this.#isOpen ||
161
+ this._ctx.triggerEl !== this.#triggerEl) {
162
+ this._ctx = {
163
+ ...this._ctx,
164
+ open: this.#isOpen,
165
+ side: this.side,
166
+ sideOffset: this.sideOffset,
167
+ triggerEl: this.#triggerEl,
168
+ };
169
+ }
170
+ }
171
+ #onDocumentKeyDown = (__runInitializers(this, __ctx_extraInitializers), (event) => {
172
+ if (!this.#isOpen)
173
+ return;
174
+ if (event.key === "Escape") {
175
+ event.preventDefault();
176
+ this.#doClose();
177
+ }
178
+ });
179
+ #doOpen() {
180
+ if (this.#internalOpen)
181
+ return;
73
182
  this.#internalOpen = true;
183
+ this.dispatchEvent(openChangeEvent({ open: true }));
74
184
  }
75
- document.addEventListener("keydown", this.#onDocumentKeyDown);
76
- }
77
- disconnectedCallback() {
78
- super.disconnectedCallback();
79
- document.removeEventListener("keydown", this.#onDocumentKeyDown);
80
- }
81
- willUpdate(changed) {
82
- if (changed.has("open") ||
83
- changed.has("side") ||
84
- changed.has("sideOffset") ||
85
- this._ctx.open !== this.#isOpen ||
86
- this._ctx.triggerEl !== this.#triggerEl) {
87
- this._ctx = {
88
- ...this._ctx,
89
- open: this.#isOpen,
90
- side: this.side,
91
- sideOffset: this.sideOffset,
92
- triggerEl: this.#triggerEl,
93
- };
185
+ #doClose() {
186
+ if (!this.#internalOpen)
187
+ return;
188
+ this.#internalOpen = false;
189
+ this.dispatchEvent(openChangeEvent({ open: false }));
94
190
  }
95
- }
96
- #onDocumentKeyDown = (event) => {
97
- if (!this.#isOpen)
98
- return;
99
- if (event.key === "Escape") {
100
- event.preventDefault();
101
- this.#doClose();
191
+ #doToggle() {
192
+ if (this.#isOpen) {
193
+ this.#doClose();
194
+ }
195
+ else {
196
+ this.#doOpen();
197
+ }
102
198
  }
103
- };
104
- #doOpen() {
105
- if (this.#internalOpen)
106
- return;
107
- this.#internalOpen = true;
108
- this.dispatchEvent(openChangeEvent({ open: true }));
109
- }
110
- #doClose() {
111
- if (!this.#internalOpen)
112
- return;
113
- this.#internalOpen = false;
114
- this.dispatchEvent(openChangeEvent({ open: false }));
115
- }
116
- #doToggle() {
117
- if (this.#isOpen) {
118
- this.#doClose();
199
+ #setTriggerEl(el) {
200
+ this.#triggerEl = el;
119
201
  }
120
- else {
121
- this.#doOpen();
202
+ render() {
203
+ return html `<slot></slot>`;
122
204
  }
123
- }
124
- #setTriggerEl(el) {
125
- this.#triggerEl = el;
126
- }
127
- render() {
128
- return html `<slot></slot>`;
129
- }
130
- }
131
- __decorate([
132
- property({ type: Boolean, reflect: true })
133
- ], DuiPopover.prototype, "open", null);
134
- __decorate([
135
- property({ type: Boolean, attribute: "default-open" })
136
- ], DuiPopover.prototype, "defaultOpen", null);
137
- __decorate([
138
- property({ reflect: true })
139
- ], DuiPopover.prototype, "side", null);
140
- __decorate([
141
- property({ type: Number, attribute: "side-offset" })
142
- ], DuiPopover.prototype, "sideOffset", null);
143
- __decorate([
144
- provide({ context: popoverContext }),
145
- state()
146
- ], DuiPopover.prototype, "_ctx", null);
205
+ };
206
+ })();
207
+ export { DuiPopover };