@deepfuture/dui-components 0.0.11 → 0.0.13

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 (250) hide show
  1. package/README.md +191 -0
  2. package/_deprecated/center/center.js +2 -2
  3. package/_deprecated/center/index.d.ts +3 -1
  4. package/_deprecated/center/index.js +3 -1
  5. package/_deprecated/hstack/hstack.js +79 -33
  6. package/_deprecated/hstack/index.d.ts +3 -1
  7. package/_deprecated/hstack/index.js +3 -1
  8. package/_deprecated/page-inset/index.d.ts +3 -1
  9. package/_deprecated/page-inset/index.js +3 -1
  10. package/_deprecated/page-inset/page-inset.js +104 -56
  11. package/_deprecated/vstack/index.d.ts +3 -1
  12. package/_deprecated/vstack/index.js +3 -1
  13. package/_deprecated/vstack/vstack.js +61 -19
  14. package/accordion/accordion-item.js +217 -147
  15. package/accordion/accordion.js +214 -149
  16. package/accordion/index.d.ts +5 -2
  17. package/accordion/index.js +5 -2
  18. package/alert-dialog/alert-dialog-close.js +2 -2
  19. package/alert-dialog/alert-dialog-popup.js +230 -166
  20. package/alert-dialog/alert-dialog-trigger.js +2 -2
  21. package/alert-dialog/alert-dialog.js +128 -73
  22. package/alert-dialog/index.d.ts +9 -4
  23. package/alert-dialog/index.js +9 -4
  24. package/avatar/avatar.js +175 -115
  25. package/avatar/index.d.ts +3 -1
  26. package/avatar/index.js +3 -1
  27. package/badge/badge.js +2 -2
  28. package/badge/index.d.ts +3 -1
  29. package/badge/index.js +3 -1
  30. package/breadcrumb/breadcrumb-ellipsis.js +2 -2
  31. package/breadcrumb/breadcrumb-item.js +2 -2
  32. package/breadcrumb/breadcrumb-link.js +2 -2
  33. package/breadcrumb/breadcrumb-page.js +2 -2
  34. package/breadcrumb/breadcrumb-separator.js +2 -2
  35. package/breadcrumb/breadcrumb.js +2 -2
  36. package/breadcrumb/index.d.ts +13 -6
  37. package/breadcrumb/index.js +13 -6
  38. package/button/button.js +109 -65
  39. package/button/index.d.ts +3 -1
  40. package/button/index.js +3 -1
  41. package/calendar/calendar.js +368 -290
  42. package/calendar/index.d.ts +3 -1
  43. package/calendar/index.js +3 -1
  44. package/checkbox/checkbox-group.js +146 -87
  45. package/checkbox/checkbox.js +232 -167
  46. package/checkbox/index.d.ts +5 -2
  47. package/checkbox/index.js +5 -2
  48. package/collapsible/collapsible.js +210 -132
  49. package/collapsible/index.d.ts +3 -1
  50. package/collapsible/index.js +3 -1
  51. package/combobox/combobox.js +318 -252
  52. package/combobox/index.d.ts +3 -1
  53. package/combobox/index.js +3 -1
  54. package/command/command-empty.js +67 -25
  55. package/command/command-group.js +87 -47
  56. package/command/command-input.js +84 -44
  57. package/command/command-item.js +168 -124
  58. package/command/command-list.js +60 -18
  59. package/command/command-separator.js +2 -2
  60. package/command/command-shortcut.js +2 -2
  61. package/command/command.js +297 -232
  62. package/command/index.d.ts +17 -8
  63. package/command/index.js +17 -8
  64. package/data-table/data-table.js +225 -153
  65. package/data-table/index.d.ts +3 -1
  66. package/data-table/index.js +3 -1
  67. package/dialog/dialog-close.js +2 -2
  68. package/dialog/dialog-popup.js +247 -181
  69. package/dialog/dialog-trigger.js +2 -2
  70. package/dialog/dialog.js +128 -73
  71. package/dialog/index.d.ts +9 -4
  72. package/dialog/index.js +9 -4
  73. package/dropzone/dropzone.js +310 -249
  74. package/dropzone/index.d.ts +3 -1
  75. package/dropzone/index.js +3 -1
  76. package/icon/icon.js +2 -2
  77. package/icon/index.d.ts +3 -1
  78. package/icon/index.js +3 -1
  79. package/input/index.d.ts +3 -1
  80. package/input/index.js +3 -1
  81. package/input/input.js +204 -143
  82. package/link/index.d.ts +3 -1
  83. package/link/index.js +3 -1
  84. package/link/link.js +62 -24
  85. package/menu/index.d.ts +5 -2
  86. package/menu/index.js +5 -2
  87. package/menu/menu-item.js +66 -24
  88. package/menu/menu.js +189 -136
  89. package/menubar/index.d.ts +3 -1
  90. package/menubar/index.js +3 -1
  91. package/menubar/menubar.js +142 -91
  92. package/number-field/index.d.ts +3 -1
  93. package/number-field/index.js +3 -1
  94. package/number-field/number-field.js +277 -204
  95. package/package.json +5 -4
  96. package/popover/index.d.ts +9 -4
  97. package/popover/index.js +9 -4
  98. package/popover/popover-close.js +2 -2
  99. package/popover/popover-popup.js +126 -76
  100. package/popover/popover-trigger.js +2 -2
  101. package/popover/popover.js +181 -120
  102. package/portal/index.d.ts +3 -1
  103. package/portal/index.js +3 -1
  104. package/portal/portal.js +128 -86
  105. package/preview-card/index.d.ts +7 -3
  106. package/preview-card/index.js +7 -3
  107. package/preview-card/preview-card-popup.js +114 -66
  108. package/preview-card/preview-card-trigger.js +2 -2
  109. package/preview-card/preview-card.js +211 -142
  110. package/progress/index.d.ts +3 -1
  111. package/progress/index.js +3 -1
  112. package/progress/progress.js +91 -45
  113. package/radio/index.d.ts +5 -2
  114. package/radio/index.js +5 -2
  115. package/radio/radio-group.js +153 -90
  116. package/radio/radio.js +137 -94
  117. package/scroll-area/index.d.ts +3 -1
  118. package/scroll-area/index.js +3 -1
  119. package/scroll-area/scroll-area.js +382 -276
  120. package/select/index.d.ts +3 -1
  121. package/select/index.js +3 -1
  122. package/select/select.js +260 -203
  123. package/separator/index.d.ts +3 -1
  124. package/separator/index.js +3 -1
  125. package/separator/separator.js +60 -18
  126. package/sidebar/index.d.ts +27 -13
  127. package/sidebar/index.js +32 -13
  128. package/sidebar/sidebar-content.js +2 -2
  129. package/sidebar/sidebar-footer.js +2 -2
  130. package/sidebar/sidebar-group-label.js +2 -2
  131. package/sidebar/sidebar-group.js +2 -2
  132. package/sidebar/sidebar-header.js +2 -2
  133. package/sidebar/sidebar-inset.js +2 -2
  134. package/sidebar/sidebar-menu-button.js +118 -74
  135. package/sidebar/sidebar-menu-item.js +2 -2
  136. package/sidebar/sidebar-menu.js +2 -2
  137. package/sidebar/sidebar-provider.js +202 -129
  138. package/sidebar/sidebar-separator.js +2 -2
  139. package/sidebar/sidebar-trigger.js +2 -2
  140. package/sidebar/sidebar.js +150 -85
  141. package/slider/index.d.ts +3 -1
  142. package/slider/index.js +3 -1
  143. package/slider/slider.js +217 -159
  144. package/spinner/index.d.ts +3 -1
  145. package/spinner/index.js +3 -1
  146. package/spinner/spinner.js +70 -28
  147. package/switch/index.d.ts +3 -1
  148. package/switch/index.js +3 -1
  149. package/switch/switch.js +174 -111
  150. package/tabs/index.d.ts +11 -5
  151. package/tabs/index.js +11 -5
  152. package/tabs/tab.js +89 -47
  153. package/tabs/tabs-indicator.js +2 -2
  154. package/tabs/tabs-list.js +92 -54
  155. package/tabs/tabs-panel.js +90 -44
  156. package/tabs/tabs.js +130 -71
  157. package/textarea/index.d.ts +3 -1
  158. package/textarea/index.js +3 -1
  159. package/textarea/textarea.js +153 -95
  160. package/toggle/index.d.ts +5 -2
  161. package/toggle/index.js +5 -2
  162. package/toggle/toggle-group.js +184 -125
  163. package/toggle/toggle.js +131 -76
  164. package/toolbar/index.d.ts +3 -1
  165. package/toolbar/index.js +3 -1
  166. package/toolbar/toolbar.js +79 -33
  167. package/tooltip/index.d.ts +7 -3
  168. package/tooltip/index.js +7 -3
  169. package/tooltip/tooltip-popup.js +108 -60
  170. package/tooltip/tooltip-trigger.js +93 -55
  171. package/tooltip/tooltip.js +225 -154
  172. package/trunc/index.d.ts +3 -1
  173. package/trunc/index.js +3 -1
  174. package/trunc/trunc.js +78 -34
  175. package/accordion/register.d.ts +0 -1
  176. package/accordion/register.js +0 -8
  177. package/alert-dialog/register.d.ts +0 -1
  178. package/alert-dialog/register.js +0 -16
  179. package/avatar/register.d.ts +0 -1
  180. package/avatar/register.js +0 -4
  181. package/badge/register.d.ts +0 -1
  182. package/badge/register.js +0 -4
  183. package/breadcrumb/register.d.ts +0 -1
  184. package/breadcrumb/register.js +0 -14
  185. package/button/register.d.ts +0 -1
  186. package/button/register.js +0 -4
  187. package/calendar/register.d.ts +0 -1
  188. package/calendar/register.js +0 -4
  189. package/checkbox/register.d.ts +0 -1
  190. package/checkbox/register.js +0 -8
  191. package/collapsible/register.d.ts +0 -1
  192. package/collapsible/register.js +0 -4
  193. package/combobox/register.d.ts +0 -1
  194. package/combobox/register.js +0 -4
  195. package/command/register.d.ts +0 -1
  196. package/command/register.js +0 -22
  197. package/data-table/register.d.ts +0 -1
  198. package/data-table/register.js +0 -4
  199. package/dialog/register.d.ts +0 -1
  200. package/dialog/register.js +0 -16
  201. package/dropzone/register.d.ts +0 -1
  202. package/dropzone/register.js +0 -4
  203. package/icon/register.d.ts +0 -1
  204. package/icon/register.js +0 -4
  205. package/input/register.d.ts +0 -1
  206. package/input/register.js +0 -4
  207. package/link/register.d.ts +0 -1
  208. package/link/register.js +0 -4
  209. package/menu/register.d.ts +0 -1
  210. package/menu/register.js +0 -8
  211. package/menubar/register.d.ts +0 -1
  212. package/menubar/register.js +0 -4
  213. package/number-field/register.d.ts +0 -1
  214. package/number-field/register.js +0 -4
  215. package/popover/register.d.ts +0 -1
  216. package/popover/register.js +0 -16
  217. package/portal/register.d.ts +0 -1
  218. package/portal/register.js +0 -4
  219. package/preview-card/register.d.ts +0 -1
  220. package/preview-card/register.js +0 -12
  221. package/progress/register.d.ts +0 -1
  222. package/progress/register.js +0 -4
  223. package/radio/register.d.ts +0 -1
  224. package/radio/register.js +0 -8
  225. package/scroll-area/register.d.ts +0 -1
  226. package/scroll-area/register.js +0 -4
  227. package/select/register.d.ts +0 -1
  228. package/select/register.js +0 -4
  229. package/separator/register.d.ts +0 -1
  230. package/separator/register.js +0 -4
  231. package/sidebar/register.d.ts +0 -1
  232. package/sidebar/register.js +0 -52
  233. package/slider/register.d.ts +0 -1
  234. package/slider/register.js +0 -4
  235. package/spinner/register.d.ts +0 -1
  236. package/spinner/register.js +0 -4
  237. package/switch/register.d.ts +0 -1
  238. package/switch/register.js +0 -4
  239. package/tabs/register.d.ts +0 -1
  240. package/tabs/register.js +0 -10
  241. package/textarea/register.d.ts +0 -1
  242. package/textarea/register.js +0 -4
  243. package/toggle/register.d.ts +0 -1
  244. package/toggle/register.js +0 -8
  245. package/toolbar/register.d.ts +0 -1
  246. package/toolbar/register.js +0 -4
  247. package/tooltip/register.d.ts +0 -1
  248. package/tooltip/register.js +0 -12
  249. package/trunc/register.d.ts +0 -1
  250. package/trunc/register.js +0 -4
package/tabs/tabs-list.js CHANGED
@@ -1,9 +1,37 @@
1
1
  /** Ported from original DUI: deep-future-app/app/client/components/dui/tabs */
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;
7
35
  };
8
36
  import { css, html, LitElement } from "lit";
9
37
  import { consume } from "@lit/context";
@@ -27,59 +55,69 @@ const styles = css `
27
55
  /**
28
56
  * Container for tab triggers. Manages indicator positioning via CSS custom properties.
29
57
  */
30
- export class DuiTabsList extends LitElement {
31
- static { this.tagName = "dui-tabs-list"; }
32
- static { this.styles = [base, styles]; }
33
- #_ctx_accessor_storage;
34
- get _ctx() { return this.#_ctx_accessor_storage; }
35
- set _ctx(value) { this.#_ctx_accessor_storage = value; }
36
- #resizeObserver;
37
- connectedCallback() {
38
- super.connectedCallback();
39
- this.#resizeObserver = new ResizeObserver(() => {
58
+ let DuiTabsList = (() => {
59
+ let _classSuper = LitElement;
60
+ let __ctx_decorators;
61
+ let __ctx_initializers = [];
62
+ let __ctx_extraInitializers = [];
63
+ return class DuiTabsList extends _classSuper {
64
+ static {
65
+ const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
66
+ __ctx_decorators = [consume({ context: tabsContext, subscribe: true })];
67
+ __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);
68
+ if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
69
+ }
70
+ static tagName = "dui-tabs-list";
71
+ static styles = [base, styles];
72
+ #_ctx_accessor_storage = __runInitializers(this, __ctx_initializers, void 0);
73
+ get _ctx() { return this.#_ctx_accessor_storage; }
74
+ set _ctx(value) { this.#_ctx_accessor_storage = value; }
75
+ #resizeObserver = __runInitializers(this, __ctx_extraInitializers);
76
+ connectedCallback() {
77
+ super.connectedCallback();
78
+ this.#resizeObserver = new ResizeObserver(() => {
79
+ this.#updateIndicatorPosition();
80
+ });
81
+ }
82
+ disconnectedCallback() {
83
+ super.disconnectedCallback();
84
+ this.#resizeObserver?.disconnect();
85
+ }
86
+ firstUpdated() {
87
+ const list = this.shadowRoot?.querySelector("[part='list']");
88
+ if (list) {
89
+ this.#resizeObserver?.observe(list);
90
+ }
40
91
  this.#updateIndicatorPosition();
41
- });
42
- }
43
- disconnectedCallback() {
44
- super.disconnectedCallback();
45
- this.#resizeObserver?.disconnect();
46
- }
47
- firstUpdated() {
48
- const list = this.shadowRoot?.querySelector("[part='list']");
49
- if (list) {
50
- this.#resizeObserver?.observe(list);
51
92
  }
52
- this.#updateIndicatorPosition();
53
- }
54
- updated() {
55
- this.#updateIndicatorPosition();
56
- }
57
- #updateIndicatorPosition() {
58
- const list = this.shadowRoot?.querySelector("[part='list']");
59
- if (!list)
60
- return;
61
- const slot = this.shadowRoot?.querySelector("slot");
62
- const slottedElements = slot?.assignedElements() ?? [];
63
- const activeTab = slottedElements.find((el) => el.tagName === "DUI-TAB" &&
64
- el.getAttribute("value") === this._ctx?.value);
65
- if (activeTab) {
66
- const listRect = list.getBoundingClientRect();
67
- const tabRect = activeTab.getBoundingClientRect();
68
- const left = tabRect.left - listRect.left;
69
- const width = tabRect.width;
70
- list.style.setProperty("--active-tab-left", `${left}px`);
71
- list.style.setProperty("--active-tab-width", `${width}px`);
93
+ updated() {
94
+ this.#updateIndicatorPosition();
72
95
  }
73
- }
74
- render() {
75
- const orientation = this._ctx?.orientation ?? "horizontal";
76
- return html `
96
+ #updateIndicatorPosition() {
97
+ const list = this.shadowRoot?.querySelector("[part='list']");
98
+ if (!list)
99
+ return;
100
+ const slot = this.shadowRoot?.querySelector("slot");
101
+ const slottedElements = slot?.assignedElements() ?? [];
102
+ const activeTab = slottedElements.find((el) => el.tagName === "DUI-TAB" &&
103
+ el.getAttribute("value") === this._ctx?.value);
104
+ if (activeTab) {
105
+ const listRect = list.getBoundingClientRect();
106
+ const tabRect = activeTab.getBoundingClientRect();
107
+ const left = tabRect.left - listRect.left;
108
+ const width = tabRect.width;
109
+ list.style.setProperty("--active-tab-left", `${left}px`);
110
+ list.style.setProperty("--active-tab-width", `${width}px`);
111
+ }
112
+ }
113
+ render() {
114
+ const orientation = this._ctx?.orientation ?? "horizontal";
115
+ return html `
77
116
  <div part="list" role="tablist" data-orientation=${orientation}>
78
117
  <slot></slot>
79
118
  </div>
80
119
  `;
81
- }
82
- }
83
- __decorate([
84
- consume({ context: tabsContext, subscribe: true })
85
- ], DuiTabsList.prototype, "_ctx", null);
120
+ }
121
+ };
122
+ })();
123
+ export { DuiTabsList };
@@ -1,9 +1,37 @@
1
1
  /** Ported from original DUI: deep-future-app/app/client/components/dui/tabs */
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;
7
35
  };
8
36
  import { css, html, LitElement, nothing } from "lit";
9
37
  import { property } from "lit/decorators.js";
@@ -31,37 +59,58 @@ const styles = css `
31
59
  /**
32
60
  * Content panel for a tab. Shown when the matching tab is active.
33
61
  */
34
- export class DuiTabsPanel extends LitElement {
35
- static { this.tagName = "dui-tabs-panel"; }
36
- static { this.styles = [base, styles]; }
37
- #value_accessor_storage = "";
38
- /** Panel value — must match the corresponding tab's value. */
39
- get value() { return this.#value_accessor_storage; }
40
- set value(value) { this.#value_accessor_storage = value; }
41
- #keepMounted_accessor_storage = false;
42
- /** Keep panel in DOM when not active. */
43
- get keepMounted() { return this.#keepMounted_accessor_storage; }
44
- set keepMounted(value) { this.#keepMounted_accessor_storage = value; }
45
- #_ctx_accessor_storage;
46
- get _ctx() { return this.#_ctx_accessor_storage; }
47
- set _ctx(value) { this.#_ctx_accessor_storage = value; }
48
- get #isActive() {
49
- return this._ctx?.value === this.value;
50
- }
51
- willUpdate() {
52
- if (this.#isActive) {
53
- this.removeAttribute("data-hidden");
62
+ let DuiTabsPanel = (() => {
63
+ let _classSuper = LitElement;
64
+ let _value_decorators;
65
+ let _value_initializers = [];
66
+ let _value_extraInitializers = [];
67
+ let _keepMounted_decorators;
68
+ let _keepMounted_initializers = [];
69
+ let _keepMounted_extraInitializers = [];
70
+ let __ctx_decorators;
71
+ let __ctx_initializers = [];
72
+ let __ctx_extraInitializers = [];
73
+ return class DuiTabsPanel extends _classSuper {
74
+ static {
75
+ const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
76
+ _value_decorators = [property()];
77
+ _keepMounted_decorators = [property({ type: Boolean, attribute: "keep-mounted" })];
78
+ __ctx_decorators = [consume({ context: tabsContext, subscribe: true })];
79
+ __esDecorate(this, null, _value_decorators, { kind: "accessor", name: "value", static: false, private: false, access: { has: obj => "value" in obj, get: obj => obj.value, set: (obj, value) => { obj.value = value; } }, metadata: _metadata }, _value_initializers, _value_extraInitializers);
80
+ __esDecorate(this, null, _keepMounted_decorators, { kind: "accessor", name: "keepMounted", static: false, private: false, access: { has: obj => "keepMounted" in obj, get: obj => obj.keepMounted, set: (obj, value) => { obj.keepMounted = value; } }, metadata: _metadata }, _keepMounted_initializers, _keepMounted_extraInitializers);
81
+ __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);
82
+ if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
54
83
  }
55
- else {
56
- this.setAttribute("data-hidden", "");
84
+ static tagName = "dui-tabs-panel";
85
+ static styles = [base, styles];
86
+ #value_accessor_storage = __runInitializers(this, _value_initializers, "");
87
+ /** Panel value — must match the corresponding tab's value. */
88
+ get value() { return this.#value_accessor_storage; }
89
+ set value(value) { this.#value_accessor_storage = value; }
90
+ #keepMounted_accessor_storage = (__runInitializers(this, _value_extraInitializers), __runInitializers(this, _keepMounted_initializers, false));
91
+ /** Keep panel in DOM when not active. */
92
+ get keepMounted() { return this.#keepMounted_accessor_storage; }
93
+ set keepMounted(value) { this.#keepMounted_accessor_storage = value; }
94
+ #_ctx_accessor_storage = (__runInitializers(this, _keepMounted_extraInitializers), __runInitializers(this, __ctx_initializers, void 0));
95
+ get _ctx() { return this.#_ctx_accessor_storage; }
96
+ set _ctx(value) { this.#_ctx_accessor_storage = value; }
97
+ get #isActive() {
98
+ return this._ctx?.value === this.value;
57
99
  }
58
- }
59
- render() {
60
- const isActive = this.#isActive;
61
- if (!isActive && !this.keepMounted) {
62
- return nothing;
100
+ willUpdate() {
101
+ if (this.#isActive) {
102
+ this.removeAttribute("data-hidden");
103
+ }
104
+ else {
105
+ this.setAttribute("data-hidden", "");
106
+ }
63
107
  }
64
- return html `
108
+ render() {
109
+ const isActive = this.#isActive;
110
+ if (!isActive && !this.keepMounted) {
111
+ return nothing;
112
+ }
113
+ return html `
65
114
  <div
66
115
  part="panel"
67
116
  role="tabpanel"
@@ -71,14 +120,11 @@ export class DuiTabsPanel extends LitElement {
71
120
  <slot></slot>
72
121
  </div>
73
122
  `;
74
- }
75
- }
76
- __decorate([
77
- property()
78
- ], DuiTabsPanel.prototype, "value", null);
79
- __decorate([
80
- property({ type: Boolean, attribute: "keep-mounted" })
81
- ], DuiTabsPanel.prototype, "keepMounted", null);
82
- __decorate([
83
- consume({ context: tabsContext, subscribe: true })
84
- ], DuiTabsPanel.prototype, "_ctx", null);
123
+ }
124
+ constructor() {
125
+ super(...arguments);
126
+ __runInitializers(this, __ctx_extraInitializers);
127
+ }
128
+ };
129
+ })();
130
+ export { DuiTabsPanel };
package/tabs/tabs.js CHANGED
@@ -1,9 +1,41 @@
1
1
  /** Ported from original DUI: deep-future-app/app/client/components/dui/tabs */
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";
@@ -36,76 +68,103 @@ const styles = css `
36
68
  /**
37
69
  * A tabbed interface component with animated indicator and keyboard navigation.
38
70
  */
39
- export class DuiTabs extends LitElement {
40
- static { this.tagName = "dui-tabs"; }
41
- static { this.styles = [base, styles]; }
42
- #value_accessor_storage = undefined;
43
- /** Controlled active tab value. */
44
- get value() { return this.#value_accessor_storage; }
45
- set value(value) { this.#value_accessor_storage = value; }
46
- #defaultValue_accessor_storage = undefined;
47
- /** Initial active tab value (uncontrolled mode). */
48
- get defaultValue() { return this.#defaultValue_accessor_storage; }
49
- set defaultValue(value) { this.#defaultValue_accessor_storage = value; }
50
- #orientation_accessor_storage = "horizontal";
51
- /** Layout orientation. */
52
- get orientation() { return this.#orientation_accessor_storage; }
53
- set orientation(value) { this.#orientation_accessor_storage = value; }
54
- #controls_accessor_storage = "header";
55
- /** Whether tab list appears above or below content. */
56
- get controls() { return this.#controls_accessor_storage; }
57
- set controls(value) { this.#controls_accessor_storage = value; }
58
- #internalValue_accessor_storage = undefined;
59
- get #internalValue() { return this.#internalValue_accessor_storage; }
60
- set #internalValue(value) { this.#internalValue_accessor_storage = value; }
61
- #getValue = () => this.value ?? this.#internalValue;
62
- #select = (tabValue) => {
63
- if (this.value === undefined) {
64
- this.#internalValue = tabValue;
71
+ let DuiTabs = (() => {
72
+ let _classSuper = LitElement;
73
+ let _value_decorators;
74
+ let _value_initializers = [];
75
+ let _value_extraInitializers = [];
76
+ let _defaultValue_decorators;
77
+ let _defaultValue_initializers = [];
78
+ let _defaultValue_extraInitializers = [];
79
+ let _orientation_decorators;
80
+ let _orientation_initializers = [];
81
+ let _orientation_extraInitializers = [];
82
+ let _controls_decorators;
83
+ let _controls_initializers = [];
84
+ let _controls_extraInitializers = [];
85
+ let _private_internalValue_decorators;
86
+ let _private_internalValue_initializers = [];
87
+ let _private_internalValue_extraInitializers = [];
88
+ let _private_internalValue_descriptor;
89
+ let __ctx_decorators;
90
+ let __ctx_initializers = [];
91
+ let __ctx_extraInitializers = [];
92
+ return class DuiTabs extends _classSuper {
93
+ static {
94
+ const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
95
+ _value_decorators = [property()];
96
+ _defaultValue_decorators = [property({ attribute: "default-value" })];
97
+ _orientation_decorators = [property({ reflect: true })];
98
+ _controls_decorators = [property({ reflect: true })];
99
+ _private_internalValue_decorators = [state()];
100
+ __ctx_decorators = [provide({ context: tabsContext }), state()];
101
+ __esDecorate(this, null, _value_decorators, { kind: "accessor", name: "value", static: false, private: false, access: { has: obj => "value" in obj, get: obj => obj.value, set: (obj, value) => { obj.value = value; } }, metadata: _metadata }, _value_initializers, _value_extraInitializers);
102
+ __esDecorate(this, null, _defaultValue_decorators, { kind: "accessor", name: "defaultValue", static: false, private: false, access: { has: obj => "defaultValue" in obj, get: obj => obj.defaultValue, set: (obj, value) => { obj.defaultValue = value; } }, metadata: _metadata }, _defaultValue_initializers, _defaultValue_extraInitializers);
103
+ __esDecorate(this, null, _orientation_decorators, { kind: "accessor", name: "orientation", static: false, private: false, access: { has: obj => "orientation" in obj, get: obj => obj.orientation, set: (obj, value) => { obj.orientation = value; } }, metadata: _metadata }, _orientation_initializers, _orientation_extraInitializers);
104
+ __esDecorate(this, null, _controls_decorators, { kind: "accessor", name: "controls", static: false, private: false, access: { has: obj => "controls" in obj, get: obj => obj.controls, set: (obj, value) => { obj.controls = value; } }, metadata: _metadata }, _controls_initializers, _controls_extraInitializers);
105
+ __esDecorate(this, _private_internalValue_descriptor = { get: __setFunctionName(function () { return this.#internalValue_accessor_storage; }, "#internalValue", "get"), set: __setFunctionName(function (value) { this.#internalValue_accessor_storage = value; }, "#internalValue", "set") }, _private_internalValue_decorators, { kind: "accessor", name: "#internalValue", static: false, private: true, access: { has: obj => #internalValue in obj, get: obj => obj.#internalValue, set: (obj, value) => { obj.#internalValue = value; } }, metadata: _metadata }, _private_internalValue_initializers, _private_internalValue_extraInitializers);
106
+ __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);
107
+ if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
65
108
  }
66
- this.dispatchEvent(valueChangeEvent(tabValue));
67
- };
68
- #_ctx_accessor_storage = this.#buildContext();
69
- get _ctx() { return this.#_ctx_accessor_storage; }
70
- set _ctx(value) { this.#_ctx_accessor_storage = value; }
71
- #buildContext() {
72
- return {
73
- value: this.#getValue(),
74
- orientation: this.orientation,
75
- select: this.#select,
109
+ static tagName = "dui-tabs";
110
+ static styles = [base, styles];
111
+ #value_accessor_storage = __runInitializers(this, _value_initializers, undefined);
112
+ /** Controlled active tab value. */
113
+ get value() { return this.#value_accessor_storage; }
114
+ set value(value) { this.#value_accessor_storage = value; }
115
+ #defaultValue_accessor_storage = (__runInitializers(this, _value_extraInitializers), __runInitializers(this, _defaultValue_initializers, undefined));
116
+ /** Initial active tab value (uncontrolled mode). */
117
+ get defaultValue() { return this.#defaultValue_accessor_storage; }
118
+ set defaultValue(value) { this.#defaultValue_accessor_storage = value; }
119
+ #orientation_accessor_storage = (__runInitializers(this, _defaultValue_extraInitializers), __runInitializers(this, _orientation_initializers, "horizontal"));
120
+ /** Layout orientation. */
121
+ get orientation() { return this.#orientation_accessor_storage; }
122
+ set orientation(value) { this.#orientation_accessor_storage = value; }
123
+ #controls_accessor_storage = (__runInitializers(this, _orientation_extraInitializers), __runInitializers(this, _controls_initializers, "header"));
124
+ /** Whether tab list appears above or below content. */
125
+ get controls() { return this.#controls_accessor_storage; }
126
+ set controls(value) { this.#controls_accessor_storage = value; }
127
+ #internalValue_accessor_storage = (__runInitializers(this, _controls_extraInitializers), __runInitializers(this, _private_internalValue_initializers, undefined));
128
+ get #internalValue() { return _private_internalValue_descriptor.get.call(this); }
129
+ set #internalValue(value) { return _private_internalValue_descriptor.set.call(this, value); }
130
+ #getValue = (__runInitializers(this, _private_internalValue_extraInitializers), () => this.value ?? this.#internalValue);
131
+ #select = (tabValue) => {
132
+ if (this.value === undefined) {
133
+ this.#internalValue = tabValue;
134
+ }
135
+ this.dispatchEvent(valueChangeEvent(tabValue));
76
136
  };
77
- }
78
- connectedCallback() {
79
- super.connectedCallback();
80
- if (this.value === undefined && this.defaultValue !== undefined) {
81
- this.#internalValue = this.defaultValue;
137
+ #_ctx_accessor_storage = __runInitializers(this, __ctx_initializers, this.#buildContext());
138
+ get _ctx() { return this.#_ctx_accessor_storage; }
139
+ set _ctx(value) { this.#_ctx_accessor_storage = value; }
140
+ #buildContext() {
141
+ return {
142
+ value: this.#getValue(),
143
+ orientation: this.orientation,
144
+ select: this.#select,
145
+ };
82
146
  }
83
- this._ctx = this.#buildContext();
84
- }
85
- willUpdate() {
86
- this._ctx = this.#buildContext();
87
- }
88
- render() {
89
- return html `
147
+ connectedCallback() {
148
+ super.connectedCallback();
149
+ if (this.value === undefined && this.defaultValue !== undefined) {
150
+ this.#internalValue = this.defaultValue;
151
+ }
152
+ this._ctx = this.#buildContext();
153
+ }
154
+ willUpdate() {
155
+ this._ctx = this.#buildContext();
156
+ }
157
+ render() {
158
+ return html `
90
159
  <div part="root" data-orientation=${this.orientation}>
91
160
  <slot></slot>
92
161
  </div>
93
162
  `;
94
- }
95
- }
96
- __decorate([
97
- property()
98
- ], DuiTabs.prototype, "value", null);
99
- __decorate([
100
- property({ attribute: "default-value" })
101
- ], DuiTabs.prototype, "defaultValue", null);
102
- __decorate([
103
- property({ reflect: true })
104
- ], DuiTabs.prototype, "orientation", null);
105
- __decorate([
106
- property({ reflect: true })
107
- ], DuiTabs.prototype, "controls", null);
108
- __decorate([
109
- provide({ context: tabsContext }),
110
- state()
111
- ], DuiTabs.prototype, "_ctx", null);
163
+ }
164
+ constructor() {
165
+ super(...arguments);
166
+ __runInitializers(this, __ctx_extraInitializers);
167
+ }
168
+ };
169
+ })();
170
+ export { DuiTabs };
@@ -1,2 +1,4 @@
1
- export { DuiTextarea, textareaChangeEvent } from "./textarea.js";
1
+ import { DuiTextarea, textareaChangeEvent } from "./textarea.js";
2
+ export { DuiTextarea, textareaChangeEvent };
2
3
  export type { TextareaResize } from "./textarea.js";
4
+ export declare const textareaFamily: (typeof DuiTextarea)[];
package/textarea/index.js CHANGED
@@ -1 +1,3 @@
1
- export { DuiTextarea, textareaChangeEvent } from "./textarea.js";
1
+ import { DuiTextarea, textareaChangeEvent } from "./textarea.js";
2
+ export { DuiTextarea, textareaChangeEvent };
3
+ export const textareaFamily = [DuiTextarea];