@ixfx/components 0.14.7 → 0.15.0

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 (68) hide show
  1. package/bundle/index.d.ts +100 -2
  2. package/bundle/index.js +574 -247
  3. package/bundle/style.css +2 -82
  4. package/dist/ac-text.d.ts +1 -1
  5. package/dist/{ac-token-qEs3FsQv.d.ts → ac-token-Cq7lsYf-.d.ts} +1 -1
  6. package/dist/ac-token.d.ts +1 -1
  7. package/dist/{button-BYuf72aR.d.ts → button-D1sPDUCM.d.ts} +8 -1
  8. package/dist/{button-B7mgqtxR.js → button-ikByJJPN.js} +29 -8
  9. package/dist/button.d.ts +1 -1
  10. package/dist/button.js +1 -1
  11. package/dist/{colour-picker-BCMU7W7R.js → colour-picker-DwAa6RDh.js} +73 -9
  12. package/dist/colour-picker.d.ts +1 -1
  13. package/dist/colour-picker.js +1 -1
  14. package/dist/crumbs.d.ts +1 -1
  15. package/dist/{data-grid-DmkId8bu.d.ts → data-grid-_BmlhuUu.d.ts} +3 -3
  16. package/dist/data-grid.d.ts +1 -1
  17. package/dist/{detail-list-CmQqeXvp.d.ts → detail-list-DXMnTrYm.d.ts} +3 -3
  18. package/dist/detail-list.d.ts +2 -2
  19. package/dist/{flat-list-BmQBB3ZC.d.ts → flat-list-JfozgW7d.d.ts} +2 -2
  20. package/dist/flat-list.d.ts +1 -1
  21. package/dist/form-BGZK3jZd.d.ts +54 -0
  22. package/dist/form-CY0nibZ5.js +418 -0
  23. package/dist/form.d.ts +1 -13
  24. package/dist/form.js +1 -1
  25. package/dist/{grid-list-BVsUEvgd.d.ts → grid-list-tQwXs895.d.ts} +1 -1
  26. package/dist/grid-list.d.ts +1 -1
  27. package/dist/{grouped-item-lister-DETte0Dh.d.ts → grouped-item-lister-Bhyo-dkH.d.ts} +1 -1
  28. package/dist/grouped-item-lister.d.ts +1 -1
  29. package/dist/{icon-CDGprSdE.d.ts → icon-DR_3rSyZ.d.ts} +1 -1
  30. package/dist/icons.d.ts +2 -2
  31. package/dist/incr-search.d.ts +1 -1
  32. package/dist/{index-CoqtMSd9.d.ts → index-BUB5SICW.d.ts} +1 -1
  33. package/dist/{index-tq6f8007.d.ts → index-Bz3loIAf.d.ts} +4 -1
  34. package/dist/{index-UvnoZUAo.d.ts → index-CJ5fshD3.d.ts} +1 -1
  35. package/dist/{index-BvoXLnBf.d.ts → index-ChdhB7RK.d.ts} +1 -1
  36. package/dist/{index-DxyyVqzA.d.ts → index-cnaRPQPp.d.ts} +2 -2
  37. package/dist/{index-CYndvTWH.d.ts → index-garxxqgV.d.ts} +1 -1
  38. package/dist/{index-DuhzWWTr.d.ts → index-wUYiXH8c.d.ts} +1 -1
  39. package/dist/index.d.ts +69 -22
  40. package/dist/index.js +138 -8
  41. package/dist/{labelled-input-base-DiTme1JO.d.ts → labelled-input-base-Dp_9KP0G.d.ts} +1 -1
  42. package/dist/labelled-radial-input.d.ts +2 -2
  43. package/dist/labelled-range-input.d.ts +1 -1
  44. package/dist/labelled-slider-input.d.ts +1 -1
  45. package/dist/list-group-header.d.ts +1 -1
  46. package/dist/{menu-item-bF6narIz.d.ts → menu-item-B0zqw2xp.d.ts} +1 -1
  47. package/dist/menu.d.ts +2 -2
  48. package/dist/miller.d.ts +1 -1
  49. package/dist/panel.d.ts +1 -1
  50. package/dist/{split-layout-JK3xWVX2.d.ts → split-layout-C5SYbDrq.d.ts} +1 -1
  51. package/dist/split-layout.d.ts +1 -1
  52. package/dist/style.css +2 -82
  53. package/dist/tab-list-R_bGbDvO.js +766 -0
  54. package/dist/{tab-list-CexFFg6O.d.ts → tab-list-wC0xNz1b.d.ts} +2 -1
  55. package/dist/tabs.d.ts +1 -1
  56. package/dist/tabs.js +1 -673
  57. package/dist/{titlebar-Tqu-VvMU.d.ts → titlebar-B5zSTZnF.d.ts} +1 -1
  58. package/dist/titlebar.d.ts +1 -1
  59. package/dist/tree.d.ts +1 -1
  60. package/dist/{vertical-list-ztrdFvyT.d.ts → vertical-list-BYyb2n4x.d.ts} +1 -1
  61. package/dist/vertical-list.d.ts +1 -1
  62. package/docs-user/button.md +1 -0
  63. package/docs-user/colour-picker.md +19 -0
  64. package/docs-user/form.md +97 -4
  65. package/docs-user/index.json +2 -2
  66. package/docs-user/tabs.md +30 -0
  67. package/package.json +2 -1
  68. package/dist/form-CsXJX15p.js +0 -62
@@ -0,0 +1,418 @@
1
+ import { n as safeCustomElement, t as __decorate } from "./decorate-VRK8rslU.js";
2
+ import { LitElement, css } from "lit";
3
+ import { property } from "lit/decorators.js";
4
+ //#region src/util/light-dom-styles.ts
5
+ const adoptedRoots = /* @__PURE__ */ new WeakMap();
6
+ /**
7
+ * Makes styles available to a light-DOM component, wherever it is rendered.
8
+ *
9
+ * Light-DOM components can't use Lit's `static styles`, and a global
10
+ * stylesheet can't reach into a shadow root. Call this from
11
+ * `connectedCallback()`: the styles are added once per root (the document, or
12
+ * the shadow root the host is in) and placed first so consumer styles win ties.
13
+ */
14
+ function adoptLightDomStyles(host, styles) {
15
+ const root = host.getRootNode();
16
+ if (!(root instanceof ShadowRoot) && !(root instanceof Document)) return;
17
+ const done = adoptedRoots.get(root) ?? /* @__PURE__ */ new Set();
18
+ if (done.has(styles)) return;
19
+ done.add(styles);
20
+ adoptedRoots.set(root, done);
21
+ if (root instanceof Document) {
22
+ const style = document.createElement(`style`);
23
+ style.textContent = styles.cssText;
24
+ document.head.prepend(style);
25
+ return;
26
+ }
27
+ const sheet = styles.styleSheet;
28
+ if (sheet && `adoptedStyleSheets` in root) root.adoptedStyleSheets = [sheet, ...root.adoptedStyleSheets];
29
+ else {
30
+ const style = document.createElement(`style`);
31
+ style.textContent = styles.cssText;
32
+ root.prepend(style);
33
+ }
34
+ }
35
+ //#endregion
36
+ //#region src/form/form-styles.ts
37
+ /**
38
+ * Layout rules for the light-DOM form components. Light DOM means Lit's
39
+ * `static styles` can't apply them, so each component calls
40
+ * `adoptLightDomStyles(this, formStyles)` when it connects: the rules land in
41
+ * the document, or in the enclosing shadow root if there is one.
42
+ */
43
+ const formStyles = css`
44
+ ixfx-form > form {
45
+ display: block;
46
+ margin: 0;
47
+ }
48
+
49
+ ixfx-form {
50
+ display: block;
51
+ }
52
+
53
+ ixfx-form[label-align="left"],
54
+ ixfx-form-group[label-align="left"] {
55
+ --ixfx-form-label-align: left;
56
+ }
57
+
58
+ ixfx-form[label-align="right"],
59
+ ixfx-form-group[label-align="right"] {
60
+ --ixfx-form-label-align: right;
61
+ }
62
+
63
+ ixfx-form-group {
64
+ display: block;
65
+ container-type: inline-size;
66
+ }
67
+
68
+ ixfx-form-group fieldset {
69
+ display: grid;
70
+ grid-template-columns: 1fr;
71
+ gap: var(--space-m) var(--space-l);
72
+ border: 0;
73
+ margin: 0;
74
+ padding: 0;
75
+ margin-block-start: var(--space-m);
76
+ margin-block-end: var(--space-m);
77
+
78
+ min-inline-size: 0;
79
+ }
80
+
81
+ ixfx-form-group fieldset > legend:empty {
82
+ display: none;
83
+ }
84
+
85
+ ixfx-form-group fieldset > legend {
86
+ grid-column: 1 / -1;
87
+ font-weight: var(--font-weight-bold);
88
+ padding: 0;
89
+ margin-block-start: var(--space-m);
90
+ margin-block-end: var(--space-s);
91
+ }
92
+
93
+ ixfx-form-group fieldset > :not(ixfx-form-part) {
94
+ grid-column: 1 / -1;
95
+ }
96
+
97
+ ixfx-form-part {
98
+ display: grid;
99
+ grid-column: 1 / -1;
100
+ grid-template-columns: 1fr;
101
+ align-items: start;
102
+ }
103
+
104
+ ixfx-form-row {
105
+ display: grid;
106
+ grid-column: 1 / -1;
107
+ grid-template-columns: repeat(var(--ixfx-form-pairs, 1), minmax(0, 1fr));
108
+ gap: 0 var(--space-l);
109
+ }
110
+
111
+ ixfx-form-row > ixfx-form-part {
112
+ display: contents;
113
+ }
114
+
115
+ ixfx-form-part > label {
116
+ grid-column: 1;
117
+ grid-row: 1;
118
+ font-size: var(--ixfx-form-label-font-size, var(--text-s));
119
+ font-weight: var(--ixfx-form-label-font-weight, inherit);
120
+ font-family: var(--ixfx-form-label-font-family, inherit);
121
+ color: var(--ixfx-form-label-color, inherit);
122
+ text-transform: var(--ixfx-form-label-text-transform, uppercase);
123
+ padding-bottom: var(--space-xs);
124
+ user-select: none;
125
+ }
126
+
127
+ ixfx-form-part > input[type="checkbox"],
128
+ ixfx-form-part > input[type="radio"] {
129
+ justify-self: start;
130
+ margin-inline-start: 0;
131
+ }
132
+
133
+ ixfx-form-part > input,
134
+ ixfx-form-part > select,
135
+ ixfx-form-part > textarea {
136
+ grid-column: 1;
137
+ grid-row: 2;
138
+ }
139
+
140
+ ixfx-form-row > ixfx-form-part > label {
141
+ grid-column: var(--ixfx-form-part-index, 1);
142
+ }
143
+
144
+ ixfx-form-row > ixfx-form-part > input,
145
+ ixfx-form-row > ixfx-form-part > select,
146
+ ixfx-form-row > ixfx-form-part > textarea {
147
+ grid-column: var(--ixfx-form-part-index, 1);
148
+ }
149
+
150
+ ixfx-form-options {
151
+ display: grid;
152
+ grid-column: 1 / -1;
153
+ grid-template-columns: 1fr;
154
+ align-items: start;
155
+ }
156
+
157
+ ixfx-form-options > .ixfx-form-options-label {
158
+ font-size: var(--ixfx-form-label-font-size, var(--text-s));
159
+ font-weight: var(--ixfx-form-label-font-weight, inherit);
160
+ font-family: var(--ixfx-form-label-font-family, inherit);
161
+ color: var(--ixfx-form-label-color, inherit);
162
+ text-transform: var(--ixfx-form-label-text-transform, uppercase);
163
+ padding-bottom: var(--space-xs);
164
+ user-select: none;
165
+ }
166
+
167
+ ixfx-form-options > .ixfx-form-options-items {
168
+ display: flex;
169
+ flex-wrap: wrap;
170
+ gap: var(--space-s) var(--ixfx-form-option-gap, var(--space-l));
171
+ }
172
+
173
+ ixfx-form-options[orientation="vertical"] > .ixfx-form-options-items {
174
+ flex-direction: column;
175
+ align-items: flex-start;
176
+ }
177
+
178
+ ixfx-form-options ixfx-form-part {
179
+ display: flex;
180
+ flex-direction: column;
181
+ align-items: center;
182
+ gap: var(--space-xs);
183
+ }
184
+
185
+ ixfx-form-options ixfx-form-part > label {
186
+ order: 2;
187
+ padding: 0;
188
+ text-align: center;
189
+ }
190
+
191
+ ixfx-form-options ixfx-form-part > input {
192
+ order: 1;
193
+ margin: 0;
194
+ }
195
+
196
+ ixfx-form-options[orientation="vertical"] ixfx-form-part {
197
+ flex-direction: row;
198
+ }
199
+
200
+ ixfx-form-options[orientation="vertical"] ixfx-form-part > label {
201
+ text-align: start;
202
+ }
203
+
204
+ @container (min-width: 30rem) {
205
+ ixfx-form-group fieldset {
206
+ grid-template-columns: repeat(var(--ixfx-form-pairs, 1), max-content 1fr);
207
+ column-gap: var(--ixfx-form-label-gap, var(--space-s));
208
+ }
209
+
210
+ ixfx-form-row {
211
+ grid-template-columns: subgrid;
212
+ column-gap: normal;
213
+ align-items: baseline;
214
+ }
215
+
216
+ ixfx-form-group fieldset > ixfx-form-part > input,
217
+ ixfx-form-group fieldset > ixfx-form-part > select,
218
+ ixfx-form-group fieldset > ixfx-form-part > textarea {
219
+ grid-column: 2 / -1;
220
+ }
221
+
222
+ ixfx-form-row > ixfx-form-part > label {
223
+ grid-column: calc(var(--ixfx-form-part-index, 1) * 2 - 1);
224
+ grid-row: 1;
225
+ }
226
+
227
+ ixfx-form-row > ixfx-form-part:not(:first-child) > label {
228
+ padding-inline-start: var(--ixfx-form-pair-gap, var(--space-l));
229
+ }
230
+
231
+ ixfx-form-row > ixfx-form-part > input,
232
+ ixfx-form-row > ixfx-form-part > select,
233
+ ixfx-form-row > ixfx-form-part > textarea {
234
+ grid-column: calc(var(--ixfx-form-part-index, 1) * 2);
235
+ grid-row: 1;
236
+ }
237
+
238
+ ixfx-form-part {
239
+ display: grid;
240
+ grid-column: 1 / -1;
241
+ grid-template-columns: subgrid;
242
+ align-items: baseline;
243
+ }
244
+
245
+ ixfx-form-part > label {
246
+ grid-column: 1;
247
+ grid-row: 1;
248
+ padding-bottom: 0;
249
+ text-align: var(--ixfx-form-label-align, right);
250
+ }
251
+
252
+ ixfx-form-part > input,
253
+ ixfx-form-part > select,
254
+ ixfx-form-part > textarea {
255
+ grid-column: 2;
256
+ grid-row: 1;
257
+ }
258
+
259
+ ixfx-form-options {
260
+ grid-template-columns: subgrid;
261
+ }
262
+
263
+ ixfx-form-options > .ixfx-form-options-label {
264
+ grid-column: 1;
265
+ padding-bottom: 0;
266
+ text-align: var(--ixfx-form-label-align, right);
267
+ }
268
+
269
+ ixfx-form-options > .ixfx-form-options-items {
270
+ grid-column: 2 / -1;
271
+ }
272
+ }
273
+ `;
274
+ //#endregion
275
+ //#region src/form/form-values.ts
276
+ function collectFormValues(root, options = {}) {
277
+ const values = {};
278
+ root.querySelectorAll(`[name]`).forEach((el) => {
279
+ const name = el.getAttribute(`name`);
280
+ if (!name) return;
281
+ if (el instanceof HTMLInputElement) {
282
+ if (el.type === `radio`) {
283
+ if (el.checked) values[name] = el.value;
284
+ } else if (el.type === `checkbox`) values[name] = el.checked;
285
+ else if (options.typed && (el.type === `number` || el.type === `range`)) values[name] = Number.isNaN(el.valueAsNumber) ? null : el.valueAsNumber;
286
+ else values[name] = el.value;
287
+ } else if (el instanceof HTMLSelectElement) {
288
+ if (el.multiple) values[name] = Array.from(el.selectedOptions).map((opt) => opt.value);
289
+ else values[name] = el.value;
290
+ } else if (el instanceof HTMLTextAreaElement) values[name] = el.value;
291
+ else if (`value` in el) values[name] = el.value;
292
+ });
293
+ return values;
294
+ }
295
+ function applyFormValues(root, data) {
296
+ root.querySelectorAll(`[name]`).forEach((el) => {
297
+ const name = el.getAttribute(`name`);
298
+ if (!name || !(name in data)) return;
299
+ const value = data[name];
300
+ if (el instanceof HTMLInputElement) {
301
+ if (el.type === `radio`) el.checked = el.value === value;
302
+ else if (el.type === `checkbox`) el.checked = Boolean(value);
303
+ else el.value = String(value ?? ``);
304
+ el.dispatchEvent(new Event(`input`, { bubbles: true }));
305
+ el.dispatchEvent(new Event(`change`, { bubbles: true }));
306
+ } else if (el instanceof HTMLSelectElement) {
307
+ if (el.multiple && Array.isArray(value)) Array.from(el.options).forEach((opt) => {
308
+ opt.selected = value.includes(opt.value);
309
+ });
310
+ else el.value = String(value ?? ``);
311
+ el.dispatchEvent(new Event(`input`, { bubbles: true }));
312
+ el.dispatchEvent(new Event(`change`, { bubbles: true }));
313
+ } else if (el instanceof HTMLTextAreaElement) {
314
+ el.value = String(value ?? ``);
315
+ el.dispatchEvent(new Event(`input`, { bubbles: true }));
316
+ el.dispatchEvent(new Event(`change`, { bubbles: true }));
317
+ } else if (`value` in el) el.value = value;
318
+ });
319
+ }
320
+ //#endregion
321
+ //#region src/form/form.ts
322
+ /** Input types where Enter does not mean "submit". */
323
+ const NON_SUBMITTING_INPUTS = /* @__PURE__ */ new Set([
324
+ `button`,
325
+ `submit`,
326
+ `reset`,
327
+ `image`,
328
+ `file`,
329
+ `color`
330
+ ]);
331
+ let FormElement = class FormElement extends LitElement {
332
+ constructor(..._args) {
333
+ super(..._args);
334
+ this.labelAlign = `right`;
335
+ this.noValidate = false;
336
+ this._onKeydown = (e) => {
337
+ if (e.key !== `Enter` || e.defaultPrevented || e.isComposing || e.shiftKey || e.ctrlKey || e.altKey || e.metaKey) return;
338
+ const target = e.target;
339
+ if (!(target instanceof HTMLInputElement) || NON_SUBMITTING_INPUTS.has(target.type)) return;
340
+ if (this.form.querySelector(`button:not([type]), button[type=submit], input[type=submit], input[type=image]`)) return;
341
+ e.preventDefault();
342
+ this.requestSubmit();
343
+ };
344
+ }
345
+ createRenderRoot() {
346
+ return this;
347
+ }
348
+ /** The native form element that holds the content. */
349
+ get form() {
350
+ if (!this._form) {
351
+ this._form = document.createElement(`form`);
352
+ this._form.addEventListener(`submit`, (e) => e.preventDefault());
353
+ this._form.addEventListener(`keydown`, this._onKeydown);
354
+ }
355
+ return this._form;
356
+ }
357
+ /** Native controls in the form. Components with their own shadow root are not included. */
358
+ get elements() {
359
+ return this.form.elements;
360
+ }
361
+ connectedCallback() {
362
+ super.connectedCallback();
363
+ adoptLightDomStyles(this, formStyles);
364
+ this._adoptChildren();
365
+ this._observer = new MutationObserver(() => this._adoptChildren());
366
+ this._observer.observe(this, { childList: true });
367
+ }
368
+ disconnectedCallback() {
369
+ super.disconnectedCallback();
370
+ this._observer?.disconnect();
371
+ }
372
+ updated() {
373
+ this.form.noValidate = this.noValidate;
374
+ }
375
+ /** Moves everything into the native form. Nodes (not just elements) move so Lit's markers stay with their content. */
376
+ _adoptChildren() {
377
+ const form = this.form;
378
+ if (form.parentNode !== this) this.append(form);
379
+ const nodes = Array.from(this.childNodes).filter((n) => n !== form);
380
+ if (nodes.length > 0) form.append(...nodes);
381
+ }
382
+ /** Validates (unless `novalidate`), then fires `submit`. */
383
+ requestSubmit() {
384
+ this.form.requestSubmit();
385
+ }
386
+ /** Resets native controls. Components with their own shadow root are not reset. */
387
+ reset() {
388
+ this.form.reset();
389
+ }
390
+ /** True if all native controls are valid. Shows nothing. */
391
+ checkValidity() {
392
+ return this.form.checkValidity();
393
+ }
394
+ /** True if all native controls are valid. Otherwise shows the browser's message on the first invalid one. */
395
+ reportValidity() {
396
+ return this.form.reportValidity();
397
+ }
398
+ /** Values of all named controls, including components with their own shadow root. Numbers are strings unless `typed`. */
399
+ getValues(options) {
400
+ return collectFormValues(this, options);
401
+ }
402
+ setValues(data) {
403
+ applyFormValues(this, data);
404
+ }
405
+ };
406
+ __decorate([property({
407
+ type: String,
408
+ attribute: `label-align`,
409
+ reflect: true
410
+ })], FormElement.prototype, "labelAlign", void 0);
411
+ __decorate([property({
412
+ type: Boolean,
413
+ attribute: `novalidate`,
414
+ reflect: true
415
+ })], FormElement.prototype, "noValidate", void 0);
416
+ FormElement = __decorate([safeCustomElement(`ixfx-form`)], FormElement);
417
+ //#endregion
418
+ export { formStyles as n, adoptLightDomStyles as r, FormElement as t };
package/dist/form.d.ts CHANGED
@@ -1,14 +1,2 @@
1
- import { LitElement } from "lit";
2
- //#region src/form/form.d.ts
3
- declare class FormElement extends LitElement {
4
- protected createRenderRoot(): this;
5
- getValues(): Record<string, unknown>;
6
- setValues(data: Record<string, unknown>): void;
7
- }
8
- declare global {
9
- interface HTMLElementTagNameMap {
10
- 'ixfx-form': FormElement;
11
- }
12
- }
13
- //#endregion
1
+ import { t as FormElement } from "./form-BGZK3jZd.js";
14
2
  export { FormElement };
package/dist/form.js CHANGED
@@ -1,2 +1,2 @@
1
- import { t as FormElement } from "./form-CsXJX15p.js";
1
+ import { t as FormElement } from "./form-CY0nibZ5.js";
2
2
  export { FormElement };
@@ -1,5 +1,5 @@
1
1
  import { B as ListNativeDragStartEvent, I as ListDragPreviewRenderer, L as ListDragPreviewSourceResolver } from "./tree-component-CDsYTBDi.js";
2
- import { S as ListSearchController } from "./index-BvoXLnBf.js";
2
+ import { S as ListSearchController } from "./index-ChdhB7RK.js";
3
3
  import "./pan-text-CoYmt2qd.js";
4
4
  import { i as ListGroupChangeEvent, n as ListGroupBy, o as ListGroupInfo, s as ListGroupLabel, u as ListGroupToggleEvent } from "./grouping-CUKgmkMm.js";
5
5
  import { i as ListInteractionMode, l as ListSelectionMode } from "./list-selection-types-PjKdhF-a.js";
@@ -1,5 +1,5 @@
1
1
  import { B as ListNativeDragStartEvent, F as ListDragPreviewContext, I as ListDragPreviewRenderer, N as ListDragEntry, P as ListDragPreview, R as ListDragSource, z as ListNativeDragStartDetail } from "./tree-component-CDsYTBDi.js";
2
2
  import { i as ListGroupChangeEvent, l as ListGroupToggleDetail, n as ListGroupBy, o as ListGroupInfo, r as ListGroupChangeDetail, s as ListGroupLabel, u as ListGroupToggleEvent } from "./grouping-CUKgmkMm.js";
3
3
  import { i as ListInteractionMode, l as ListSelectionMode } from "./list-selection-types-PjKdhF-a.js";
4
- import { _ as GridListTickleDetail, a as GridListCaptionBackdrop, b as GridListViewportChangeEvent, c as GridListDataAdapter, d as GridListItemClickDetail, f as GridListItemClickEvent, g as GridListSelectEvent, h as GridListSelectDetail, i as GridListCaptionAlign, l as GridListElementEventMap, m as GridListOrientation, n as GridListActivateDetail, o as GridListCaptionPosition, p as GridListItemEventDetail, r as GridListActivateEvent, s as GridListCaptionStyle, t as GridListElement, u as GridListFullElementEventMap, v as GridListTickleEvent, y as GridListViewportChangeDetail } from "./grid-list-BVsUEvgd.js";
4
+ import { _ as GridListTickleDetail, a as GridListCaptionBackdrop, b as GridListViewportChangeEvent, c as GridListDataAdapter, d as GridListItemClickDetail, f as GridListItemClickEvent, g as GridListSelectEvent, h as GridListSelectDetail, i as GridListCaptionAlign, l as GridListElementEventMap, m as GridListOrientation, n as GridListActivateDetail, o as GridListCaptionPosition, p as GridListItemEventDetail, r as GridListActivateEvent, s as GridListCaptionStyle, t as GridListElement, u as GridListFullElementEventMap, v as GridListTickleEvent, y as GridListViewportChangeDetail } from "./grid-list-tQwXs895.js";
5
5
  export { type GridListActivateDetail, type GridListActivateEvent, type GridListCaptionAlign, type GridListCaptionBackdrop, type GridListCaptionPosition, type GridListCaptionStyle, type GridListDataAdapter, GridListElement, type GridListElementEventMap, type GridListFullElementEventMap, type GridListItemClickDetail, type GridListItemClickEvent, type GridListItemEventDetail, type GridListOrientation, type GridListSelectDetail, type GridListSelectEvent, type GridListTickleDetail, type GridListTickleEvent, type GridListViewportChangeDetail, type GridListViewportChangeEvent, type ListDragEntry, type ListDragPreview, type ListDragPreviewContext, type ListDragPreviewRenderer, type ListDragSource, type ListGroupBy, type ListGroupChangeDetail, type ListGroupChangeEvent, type ListGroupInfo, type ListGroupLabel, type ListGroupToggleDetail, type ListGroupToggleEvent, type ListInteractionMode, type ListNativeDragStartDetail, type ListNativeDragStartEvent, type ListSelectionMode };
@@ -106,7 +106,7 @@ declare class GroupedItemListerElement<T = unknown> extends LitElement {
106
106
  connectedCallback(): void;
107
107
  disconnectedCallback(): void;
108
108
  protected updated(changed: PropertyValues): void;
109
- protected render(): typeof nothing | import("lit").TemplateResult<1>;
109
+ protected render(): import("lit").TemplateResult<1> | typeof nothing;
110
110
  }
111
111
  declare global {
112
112
  interface HTMLElementTagNameMap {
@@ -1,2 +1,2 @@
1
- import { a as IGroupedSubComponent, c as SubComponentActivateEvent, d as SubComponentItemClickEvent, f as SubComponentSelectDetail, h as SubComponentTickleEvent, i as GroupedSelectEvent, l as SubComponentFactory, m as SubComponentTickleDetail, n as GroupedItemListerElementEventMap, o as IGroupedSubComponentEventMap, p as SubComponentSelectEvent, r as GroupedSelectDetail, s as SubComponentActivateDetail, t as GroupedItemListerElement, u as SubComponentItemClickDetail } from "./grouped-item-lister-DETte0Dh.js";
1
+ import { a as IGroupedSubComponent, c as SubComponentActivateEvent, d as SubComponentItemClickEvent, f as SubComponentSelectDetail, h as SubComponentTickleEvent, i as GroupedSelectEvent, l as SubComponentFactory, m as SubComponentTickleDetail, n as GroupedItemListerElementEventMap, o as IGroupedSubComponentEventMap, p as SubComponentSelectEvent, r as GroupedSelectDetail, s as SubComponentActivateDetail, t as GroupedItemListerElement, u as SubComponentItemClickDetail } from "./grouped-item-lister-Bhyo-dkH.js";
2
2
  export { GroupedItemListerElement, type GroupedItemListerElementEventMap, type GroupedSelectDetail, type GroupedSelectEvent, type IGroupedSubComponent, type IGroupedSubComponentEventMap, type SubComponentActivateDetail, type SubComponentActivateEvent, type SubComponentFactory, type SubComponentItemClickDetail, type SubComponentItemClickEvent, type SubComponentSelectDetail, type SubComponentSelectEvent, type SubComponentTickleDetail, type SubComponentTickleEvent };
@@ -9,7 +9,7 @@ declare class IxfxIconElement extends LitElement {
9
9
  rotate: string;
10
10
  connectedCallback(): void;
11
11
  disconnectedCallback(): void;
12
- protected render(): typeof nothing | import("lit").TemplateResult<1>;
12
+ protected render(): import("lit").TemplateResult<1> | typeof nothing;
13
13
  protected updated(changed: Map<string, unknown>): void;
14
14
  static styles: import("lit").CSSResult[];
15
15
  }
package/dist/icons.d.ts CHANGED
@@ -1,3 +1,3 @@
1
- import { t as IxfxIconElement } from "./icon-CDGprSdE.js";
2
- import { a as getIconEntry, c as iconBus, d as setIconFont, f as svgToDataUri, g as ICON_CLOSE, h as ICON_CHEVRON_DOWN, i as getIcon, l as registerFontIcon, m as ICON_CHECK, n as IconChangedEvent, o as getIconFont, p as ICON_CARET_RIGHT, r as IconEntry, s as hasIcon, t as IconChangedDetail, u as registerIcon } from "./index-CYndvTWH.js";
1
+ import { t as IxfxIconElement } from "./icon-DR_3rSyZ.js";
2
+ import { a as getIconEntry, c as iconBus, d as setIconFont, f as svgToDataUri, g as ICON_CLOSE, h as ICON_CHEVRON_DOWN, i as getIcon, l as registerFontIcon, m as ICON_CHECK, n as IconChangedEvent, o as getIconFont, p as ICON_CARET_RIGHT, r as IconEntry, s as hasIcon, t as IconChangedDetail, u as registerIcon } from "./index-garxxqgV.js";
3
3
  export { ICON_CARET_RIGHT, ICON_CHECK, ICON_CHEVRON_DOWN, ICON_CLOSE, type IconChangedDetail, type IconChangedEvent, type IconEntry, IxfxIconElement, getIcon, getIconEntry, getIconFont, hasIcon, iconBus, registerFontIcon, registerIcon, setIconFont, svgToDataUri };
@@ -1,2 +1,2 @@
1
- import { A as FuzzySearch, C as ListSearchControllerOptions, D as IncrSearchTreeOptions, E as IncrSearchTreeController, F as IncrSearchChangeCallback, I as IncrSearchOptions, L as IncrSearchResult, M as HighlightOptions, N as HighlightTarget, O as createAcCompletionProvider, P as IncrSearch, R as IncrSearchState, S as ListSearchController, T as ListSearchMode, _ as DataListSearchAdapterOptions, a as RegisterListSearchCommandsOptions, b as LIST_SEARCH_MODES, c as applyHighlights, d as createFuzzySearch, f as ElementIncrSearch, g as createElementListSearchAdapter, h as ElementListSearchHost, i as LIST_SEARCH_COMMAND_IDS, j as FuzzySearchOptions, k as ElementIncrSearchOptions, l as buildHighlightTargets, m as ElementListSearchAdapterOptions, n as createTreeListSearchAdapter, o as registerListSearchCommands, p as createElementIncrSearch, r as listSearchStyles, s as createIncrSearch, t as TreeListSearchAdapterOptions, u as clearHighlights, v as DataListSearchItem, w as ListSearchHost, x as ListSearchAdapter, y as createDataListSearchAdapter } from "./index-BvoXLnBf.js";
1
+ import { A as FuzzySearch, C as ListSearchControllerOptions, D as IncrSearchTreeOptions, E as IncrSearchTreeController, F as IncrSearchChangeCallback, I as IncrSearchOptions, L as IncrSearchResult, M as HighlightOptions, N as HighlightTarget, O as createAcCompletionProvider, P as IncrSearch, R as IncrSearchState, S as ListSearchController, T as ListSearchMode, _ as DataListSearchAdapterOptions, a as RegisterListSearchCommandsOptions, b as LIST_SEARCH_MODES, c as applyHighlights, d as createFuzzySearch, f as ElementIncrSearch, g as createElementListSearchAdapter, h as ElementListSearchHost, i as LIST_SEARCH_COMMAND_IDS, j as FuzzySearchOptions, k as ElementIncrSearchOptions, l as buildHighlightTargets, m as ElementListSearchAdapterOptions, n as createTreeListSearchAdapter, o as registerListSearchCommands, p as createElementIncrSearch, r as listSearchStyles, s as createIncrSearch, t as TreeListSearchAdapterOptions, u as clearHighlights, v as DataListSearchItem, w as ListSearchHost, x as ListSearchAdapter, y as createDataListSearchAdapter } from "./index-ChdhB7RK.js";
2
2
  export { type DataListSearchAdapterOptions, type DataListSearchItem, type ElementIncrSearch, type ElementIncrSearchOptions, type ElementListSearchAdapterOptions, type ElementListSearchHost, type FuzzySearch, type FuzzySearchOptions, type HighlightOptions, type HighlightTarget, type IncrSearch, type IncrSearchChangeCallback, IncrSearchTreeController as IncrSearchMillerController, IncrSearchTreeController, type IncrSearchTreeOptions as IncrSearchMillerOptions, type IncrSearchTreeOptions, type IncrSearchOptions, type IncrSearchResult, type IncrSearchState, LIST_SEARCH_COMMAND_IDS, LIST_SEARCH_MODES, type ListSearchAdapter, ListSearchController, type ListSearchControllerOptions, type ListSearchHost, type ListSearchMode, type RegisterListSearchCommandsOptions, type TreeListSearchAdapterOptions, applyHighlights, buildHighlightTargets, clearHighlights, createAcCompletionProvider, createDataListSearchAdapter, createElementIncrSearch, createElementListSearchAdapter, createFuzzySearch, createIncrSearch, createTreeListSearchAdapter, listSearchStyles, registerListSearchCommands };
@@ -1,4 +1,4 @@
1
- import { t as LabelledInputBase } from "./labelled-input-base-DiTme1JO.js";
1
+ import { t as LabelledInputBase } from "./labelled-input-base-Dp_9KP0G.js";
2
2
  import { CSSResultGroup } from "lit";
3
3
  //#region src/labelled-range-input/labelled-range-input.d.ts
4
4
  declare class LabelledRangeInput extends LabelledInputBase {
@@ -1,4 +1,4 @@
1
- import "./index-CoqtMSd9.js";
1
+ import "./index-BUB5SICW.js";
2
2
  import { CSSResultGroup, LitElement, PropertyValues } from "lit";
3
3
  import { Colour } from "@ixfx/visual";
4
4
  //#region src/colour-picker/types.d.ts
@@ -143,6 +143,7 @@ declare class ColourPickerPopup extends LitElement {
143
143
  size: PickerSize;
144
144
  private _isOpen;
145
145
  private _everOpened;
146
+ private _hasAction;
146
147
  _popupEl: HTMLElement;
147
148
  _pickerEl: ColourPicker;
148
149
  private readonly _uid;
@@ -171,6 +172,8 @@ declare class ColourPickerPopup extends LitElement {
171
172
  private _onPickerInput;
172
173
  private _onPickerChange;
173
174
  private _onConfirm;
175
+ private _onActionSlotChange;
176
+ close(): void;
174
177
  private _onSwatchClick;
175
178
  private _dispatchInput;
176
179
  private _dispatchChange;
@@ -1,4 +1,4 @@
1
- import { t as LabelledInputBase } from "./labelled-input-base-DiTme1JO.js";
1
+ import { t as LabelledInputBase } from "./labelled-input-base-Dp_9KP0G.js";
2
2
  import { n as EditableLabel } from "./editable-label-rzXkjf1H.js";
3
3
  import { n as WheelNudgeConsumer, t as WheelDirection } from "./wheel-nudge-By5s_ioH.js";
4
4
  import { f as SliderMarkerStyle, m as SliderSingleStyle } from "./slider-input-BxURAAmD.js";
@@ -1,4 +1,4 @@
1
- import "./icon-CDGprSdE.js";
1
+ import "./icon-DR_3rSyZ.js";
2
2
  import { E as TreeSearchHost } from "./tree-component-CDsYTBDi.js";
3
3
  import { o as TreeNode } from "./types-Jky6oNAp.js";
4
4
  import { ReactiveController, ReactiveControllerHost, TemplateResult, nothing } from "lit";
@@ -1,6 +1,6 @@
1
- import "./icon-CDGprSdE.js";
1
+ import "./icon-DR_3rSyZ.js";
2
2
  import { o as TreeNode } from "./types-Jky6oNAp.js";
3
- import { i as MenuContainer, n as MenuTrigger, r as MenuTriggerCommandDetail, t as MenuItem } from "./menu-item-bF6narIz.js";
3
+ import { i as MenuContainer, n as MenuTrigger, r as MenuTriggerCommandDetail, t as MenuItem } from "./menu-item-B0zqw2xp.js";
4
4
  import { LitElement, TemplateResult } from "lit";
5
5
  import { CommandRegistry, KeyboardManager } from "@clinth/ui-commands";
6
6
  //#region src/menu/menu-bar.d.ts
@@ -1,4 +1,4 @@
1
- import "./icon-CDGprSdE.js";
1
+ import "./icon-DR_3rSyZ.js";
2
2
  //#region src/icons/defaults.d.ts
3
3
  /** Chevron pointing down (Lucide `chevron-down`). Used for split-button dropdown toggle. */
4
4
  declare const ICON_CHEVRON_DOWN = "<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"m6 9 6 6 6-6\"/></svg>";
@@ -1,6 +1,6 @@
1
1
  import { A as TreeTickleEvent, C as TreeItemDblClickEvent, E as TreeSearchHost, I as ListDragPreviewRenderer, L as ListDragPreviewSourceResolver, O as TreeSelectEvent, _ as TreeDropTarget, a as TreeComponent, c as TreeDragContext, d as TreeDragStartEvent, h as TreeDropEvent, i as TreeCollapseEvent, j as TreeDataModel, l as TreeDragEndEvent, m as TreeDropDetail, n as TreeActivateEvent, o as TreeComponentEventMap, p as TreeDropContext, s as TreeDndMode, u as TreeDragOverEvent, w as TreeNavigateOptions, x as TreeItemClickEvent, y as TreeExpandEvent, z as ListNativeDragStartDetail } from "./tree-component-CDsYTBDi.js";
2
2
  import { a as TreeItem, i as TreeInteractionMode, n as TreeExclusivity, o as TreeNode, r as TreeFilterPredicate, s as TreeSelectionFilter, t as LoadChildrenCallback } from "./types-Jky6oNAp.js";
3
- import { S as ListSearchController } from "./index-BvoXLnBf.js";
3
+ import { S as ListSearchController } from "./index-ChdhB7RK.js";
4
4
  import { t as ListNativeDragController } from "./list-native-drag-controller-NMspr0E1.js";
5
5
  import { n as TickledController } from "./tickled-controller-DodxD3eQ.js";
6
6
  import { LitElement, PropertyValues, ReactiveController, ReactiveControllerHost, TemplateResult, nothing } from "lit";