@oscarpalmer/oui 0.35.0 → 0.36.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 (89) hide show
  1. package/dist/css/combobox.css +1 -1
  2. package/dist/css/listbox.css +152 -0
  3. package/dist/js/combobox/constants.combobox.d.mts +2 -2
  4. package/dist/js/combobox/constants.combobox.mjs +40 -33
  5. package/dist/js/combobox/dom.combobox.d.mts +8 -91
  6. package/dist/js/combobox/dom.combobox.mjs +204 -2
  7. package/dist/js/combobox/event.combobox.d.mts +14 -8
  8. package/dist/js/combobox/event.combobox.mjs +2 -2
  9. package/dist/js/combobox/index.d.mts +1 -1
  10. package/dist/js/combobox/index.mjs +20 -18
  11. package/dist/js/combobox/misc.combobox.d.mts +2 -2
  12. package/dist/js/combobox/misc.combobox.mjs +2 -2
  13. package/dist/js/combobox/models.combobox.d.mts +44 -2
  14. package/dist/js/combobox/state.combobox.d.mts +9 -10
  15. package/dist/js/combobox/state.combobox.mjs +2 -2
  16. package/dist/js/constants.combobox-DmRAMC64.d.mts +26 -0
  17. package/dist/js/constants.listbox-DRsXUxd3.d.mts +14 -0
  18. package/dist/js/index-EfkUSals.d.mts +139 -0
  19. package/dist/js/index.d.mts +4 -2
  20. package/dist/js/index.mjs +4 -2
  21. package/dist/js/internal/attributable.mjs +4 -3
  22. package/dist/js/internal/listbox/listbox.constants.d.mts +11 -0
  23. package/dist/js/internal/listbox/listbox.constants.mjs +23 -0
  24. package/dist/js/internal/listbox/listbox.data.d.mts +20 -0
  25. package/dist/js/internal/listbox/listbox.data.mjs +2 -0
  26. package/dist/js/internal/listbox/listbox.dom.d.mts +66 -0
  27. package/dist/js/internal/listbox/listbox.dom.mjs +2 -0
  28. package/dist/js/internal/listbox/listbox.event.d.mts +5 -0
  29. package/dist/js/internal/listbox/listbox.event.mjs +63 -0
  30. package/dist/js/internal/listbox/listbox.form.d.mts +6 -0
  31. package/dist/js/internal/listbox/listbox.form.mjs +52 -0
  32. package/dist/js/internal/listbox/listbox.misc.d.mts +12 -0
  33. package/dist/js/internal/listbox/listbox.misc.mjs +2 -0
  34. package/dist/js/internal/listbox/listbox.model.d.mts +2 -0
  35. package/dist/js/internal/listbox/listbox.model.mjs +1 -0
  36. package/dist/js/internal/listbox/listbox.state.d.mts +7 -0
  37. package/dist/js/internal/listbox/listbox.state.mjs +40 -0
  38. package/dist/js/internal/misc.d.mts +6 -0
  39. package/dist/js/internal/misc.mjs +13 -0
  40. package/dist/js/l10n-Bn-7RcwR.d.mts +20 -0
  41. package/dist/js/l10n.d.mts +2 -20
  42. package/dist/js/listbox/constants.listbox.d.mts +2 -0
  43. package/dist/js/listbox/constants.listbox.mjs +40 -0
  44. package/dist/js/listbox/event.listbox.d.mts +8 -0
  45. package/dist/js/listbox/event.listbox.mjs +2 -0
  46. package/dist/js/listbox/index.d.mts +116 -0
  47. package/dist/js/listbox/index.mjs +189 -0
  48. package/dist/js/listbox/misc.listbox.d.mts +2 -0
  49. package/dist/js/listbox/misc.listbox.mjs +2 -0
  50. package/dist/js/listbox/state.listbox.d.mts +11 -0
  51. package/dist/js/listbox/state.listbox.mjs +2 -0
  52. package/dist/js/listbox.data-BWd0PCy7.mjs +424 -0
  53. package/dist/js/listbox.model-CRReGOmu.d.mts +125 -0
  54. package/dist/js/misc.listbox-BI-XsTOf.mjs +197 -0
  55. package/dist/js/misc.listbox-gnoJhrTr.d.mts +20 -0
  56. package/dist/js/sortable/sortable.embedded.mjs +4 -2
  57. package/dist/js/state.combobox-4xq0FPCF.mjs +365 -0
  58. package/package.json +7 -3
  59. package/src/css/combobox.scss +1 -1
  60. package/src/css/listbox.scss +149 -0
  61. package/src/js/combobox/constants.combobox.ts +46 -25
  62. package/src/js/combobox/dom.combobox.ts +36 -454
  63. package/src/js/combobox/event.combobox.ts +129 -218
  64. package/src/js/combobox/index.ts +37 -30
  65. package/src/js/combobox/misc.combobox.ts +30 -114
  66. package/src/js/combobox/models.combobox.ts +7 -47
  67. package/src/js/combobox/state.combobox.ts +126 -127
  68. package/src/js/index.ts +1 -0
  69. package/src/js/internal/listbox/listbox.constants.ts +25 -0
  70. package/src/js/{combobox/data.combobox.ts → internal/listbox/listbox.data.ts} +94 -43
  71. package/src/js/internal/listbox/listbox.dom.ts +445 -0
  72. package/src/js/internal/listbox/listbox.event.ts +129 -0
  73. package/src/js/{combobox/form.combobox.ts → internal/listbox/listbox.form.ts} +12 -13
  74. package/src/js/internal/listbox/listbox.misc.ts +135 -0
  75. package/src/js/internal/listbox/listbox.model.ts +169 -0
  76. package/src/js/internal/listbox/listbox.state.ts +82 -0
  77. package/src/js/internal/misc.ts +27 -0
  78. package/src/js/l10n.ts +8 -8
  79. package/src/js/listbox/constants.listbox.ts +61 -0
  80. package/src/js/listbox/event.listbox.ts +106 -0
  81. package/src/js/listbox/index.ts +302 -0
  82. package/src/js/listbox/misc.listbox.ts +70 -0
  83. package/src/js/listbox/state.listbox.ts +196 -0
  84. package/dist/js/combobox/data.combobox.d.mts +0 -18
  85. package/dist/js/combobox/data.combobox.mjs +0 -2
  86. package/dist/js/combobox/form.combobox.d.mts +0 -6
  87. package/dist/js/combobox/form.combobox.mjs +0 -2
  88. package/dist/js/constants.combobox-h_kyDegw.d.mts +0 -248
  89. package/dist/js/data.combobox-B8HMkDOh.mjs +0 -1030
@@ -1,6 +1,8 @@
1
1
  import { updateLocalizations } from "../l10n.mjs";
2
+ import { C as setListboxDisabled, D as setListboxReadonly, O as setListboxRequired, T as setListboxLimit, a as setListboxValue, o as setListboxValues, w as setListboxFilter } from "../listbox.data-BWd0PCy7.mjs";
3
+ import { attachListbox, detachListbox } from "../internal/listbox/listbox.state.mjs";
2
4
  import { COMBOBOX_TAGNAME } from "./constants.combobox.mjs";
3
- import { C as setComboboxRequired, I as createComboboxState, L as detachCombobox, N as attachCombobox, P as comboboxLocalizations, S as setComboboxReadonly, a as setComboboxValues, at as setComboboxLimit, i as setComboboxValue, it as setComboboxFilter, ot as setComboboxLocalizations, x as setComboboxDisabled } from "../data.combobox-B8HMkDOh.mjs";
5
+ import { D as setComboboxLocalizations, a as onDetachCombobox, i as onAttachCombobox, n as comboboxStates, r as createComboboxState } from "../state.combobox-4xq0FPCF.mjs";
4
6
  import { getAttribute } from "@oscarpalmer/toretto/attribute";
5
7
  import { parse } from "@oscarpalmer/atoms/string";
6
8
  //#region src/js/combobox/index.ts
@@ -25,7 +27,7 @@ var OuiComboboxElement = class extends HTMLElement {
25
27
  * Should the combobox be disabled?
26
28
  */
27
29
  set disabled(value) {
28
- if (typeof value === "boolean" && value !== this.disabled) setComboboxDisabled(this.#state, value);
30
+ if (typeof value === "boolean" && value !== this.disabled) setListboxDisabled(this.#state, value);
29
31
  }
30
32
  /**
31
33
  * Current filter value
@@ -37,7 +39,7 @@ var OuiComboboxElement = class extends HTMLElement {
37
39
  * Set the filter value
38
40
  */
39
41
  set filter(value) {
40
- setComboboxFilter(this.#state, value);
42
+ setListboxFilter(this.#state, value);
41
43
  }
42
44
  /**
43
45
  * Maximum number of selected options
@@ -49,7 +51,7 @@ var OuiComboboxElement = class extends HTMLElement {
49
51
  * Set the maximum number of selected options
50
52
  */
51
53
  set max(value) {
52
- setComboboxLimit("max", this.#state, value);
54
+ setListboxLimit("max", this.#state, value);
53
55
  }
54
56
  /**
55
57
  * Minimum number of selected options
@@ -61,7 +63,7 @@ var OuiComboboxElement = class extends HTMLElement {
61
63
  * Set the minimum number of selected options
62
64
  */
63
65
  set min(value) {
64
- setComboboxLimit("min", this.#state, value);
66
+ setListboxLimit("min", this.#state, value);
65
67
  }
66
68
  /**
67
69
  * Does the combobox allow multiple values?
@@ -85,7 +87,7 @@ var OuiComboboxElement = class extends HTMLElement {
85
87
  * Should the combobox be readonly?
86
88
  */
87
89
  set readonly(value) {
88
- if (typeof value === "boolean" && value !== this.readonly) setComboboxReadonly(this.#state, value);
90
+ if (typeof value === "boolean" && value !== this.readonly) setListboxReadonly(this.#state, value);
89
91
  }
90
92
  /**
91
93
  * Is the combobox required?
@@ -97,7 +99,7 @@ var OuiComboboxElement = class extends HTMLElement {
97
99
  * Should the combobox be required?
98
100
  */
99
101
  set required(value) {
100
- if (typeof value === "boolean" && value !== this.required) setComboboxRequired(this.#state, value);
102
+ if (typeof value === "boolean" && value !== this.required) setListboxRequired(this.#state, value);
101
103
  }
102
104
  /**
103
105
  * Selected options
@@ -121,7 +123,7 @@ var OuiComboboxElement = class extends HTMLElement {
121
123
  * Set the value
122
124
  */
123
125
  set value(value) {
124
- setComboboxValue(this.#state, value);
126
+ setListboxValue(this.#state, value);
125
127
  }
126
128
  /**
127
129
  * Current values
@@ -132,8 +134,8 @@ var OuiComboboxElement = class extends HTMLElement {
132
134
  /**
133
135
  * Set the values
134
136
  */
135
- set values(value) {
136
- setComboboxValues(this.#state, value);
137
+ set values(values) {
138
+ setListboxValues(this.#state, values);
137
139
  }
138
140
  constructor() {
139
141
  super();
@@ -147,7 +149,7 @@ var OuiComboboxElement = class extends HTMLElement {
147
149
  break;
148
150
  case "max":
149
151
  case "min":
150
- setComboboxLimit(name, this.#state, value);
152
+ setListboxLimit(name, this.#state, value);
151
153
  break;
152
154
  case "value": this.value = value ?? "";
153
155
  }
@@ -156,36 +158,36 @@ var OuiComboboxElement = class extends HTMLElement {
156
158
  * Clear all selected options
157
159
  */
158
160
  clear() {
159
- setComboboxValues(this.#state, []);
161
+ setListboxValues(this.#state, []);
160
162
  }
161
163
  connectedCallback() {
162
164
  if (this.#state == null) this.#initialize();
163
- else attachCombobox(this.#state);
165
+ else attachListbox(this.#state, comboboxStates, onAttachCombobox);
164
166
  }
165
167
  disconnectedCallback() {
166
- if (this.#state != null) detachCombobox(this.#state);
168
+ if (this.#state != null) detachListbox(this.#state, comboboxStates, onDetachCombobox);
167
169
  }
168
170
  formDisabledCallback(disabled) {
169
171
  this.disabled = disabled;
170
172
  }
171
173
  formResetCallback() {
172
- setComboboxValues(this.#state, this.#state.values.initial, false);
174
+ setListboxValues(this.#state, this.#state.values.initial);
173
175
  }
174
176
  formStateRestoreCallback(state, reason) {
175
177
  if (reason !== "restore") return;
176
178
  const parsed = typeof state === "string" ? parse(state) : void 0;
177
179
  if (!Array.isArray(parsed)) return;
178
180
  if (this.#state == null) this.#restored = parsed;
179
- else setComboboxValues(this.#state, parsed);
181
+ else setListboxValues(this.#state, parsed);
180
182
  }
181
183
  setLocalizations(first, second) {
182
- updateLocalizations(comboboxLocalizations, typeof first === "string" ? { [first]: second } : first, this.#state.localizations);
184
+ updateLocalizations(this.#state.localizations.global, typeof first === "string" ? { [first]: second } : first, this.#state.localizations.component);
183
185
  }
184
186
  #initialize() {
185
187
  this.tabIndex = -1;
186
188
  this.#state = createComboboxState(this, this.#internals);
187
189
  if (this.#restored != null) {
188
- setComboboxValues(this.#state, this.#restored, false);
190
+ setListboxValues(this.#state, this.#restored);
189
191
  this.#restored = void 0;
190
192
  }
191
193
  }
@@ -1,2 +1,2 @@
1
- import { B as generateComboboxIds, G as getComboboxVisibleOptions, H as getComboboxAutoComplete, J as setComboboxLimit, K as hasTextSelection, U as getComboboxBooleanAria, V as getComboboxAttributeValue, W as getComboboxId, Y as setComboboxLocalizations, q as setComboboxFilter } from "../constants.combobox-h_kyDegw.mjs";
2
- export { generateComboboxIds, getComboboxAttributeValue, getComboboxAutoComplete, getComboboxBooleanAria, getComboboxId, getComboboxVisibleOptions, hasTextSelection, setComboboxFilter, setComboboxLimit, setComboboxLocalizations };
1
+ import { a as setComboboxLocalizations, i as hasTextSelection, n as getComboboxAutoComplete, o as updateComboboxLocalizations, r as getComboboxId } from "../index-EfkUSals.mjs";
2
+ export { getComboboxAutoComplete, getComboboxId, hasTextSelection, setComboboxLocalizations, updateComboboxLocalizations };
@@ -1,2 +1,2 @@
1
- import { $ as getComboboxAutoComplete, Q as getComboboxAttributeValue, Z as generateComboboxIds, at as setComboboxLimit, et as getComboboxBooleanAria, it as setComboboxFilter, nt as getComboboxVisibleOptions, ot as setComboboxLocalizations, rt as hasTextSelection, tt as getComboboxId } from "../data.combobox-B8HMkDOh.mjs";
2
- export { generateComboboxIds, getComboboxAttributeValue, getComboboxAutoComplete, getComboboxBooleanAria, getComboboxId, getComboboxVisibleOptions, hasTextSelection, setComboboxFilter, setComboboxLimit, setComboboxLocalizations };
1
+ import { D as setComboboxLocalizations, E as hasTextSelection, O as updateComboboxLocalizations, T as getComboboxId, w as getComboboxAutoComplete } from "../state.combobox-4xq0FPCF.mjs";
2
+ export { getComboboxAutoComplete, getComboboxId, hasTextSelection, setComboboxLocalizations, updateComboboxLocalizations };
@@ -1,2 +1,44 @@
1
- import { A as OuiComboboxLabel, D as OuiComboboxAutoCompleteType, E as OuiComboboxAutoComplete, F as OuiComboboxSelectionItem, I as OuiComboboxState, L as OuiComboboxType, M as OuiComboboxOptions, N as OuiComboboxPreview, O as OuiComboboxFilter, P as OuiComboboxSelection, R as OuiComboboxValues, T as OuiComboboxAnchor, j as OuiComboboxLocalizations, k as OuiComboboxGroup } from "../constants.combobox-h_kyDegw.mjs";
2
- export { OuiComboboxAnchor, OuiComboboxAutoComplete, OuiComboboxAutoCompleteType, OuiComboboxFilter, OuiComboboxGroup, OuiComboboxLabel, OuiComboboxLocalizations, OuiComboboxOptions, OuiComboboxPreview, OuiComboboxSelection, OuiComboboxSelectionItem, OuiComboboxState, OuiComboboxType, OuiComboboxValues };
1
+ import { d as OuiListboxType, l as OuiListboxState } from "../listbox.model-CRReGOmu.mjs";
2
+ import { r as OuiFloatable } from "../floatable.embedded-Bct4U5Dm.mjs";
3
+ //#region src/js/combobox/models.combobox.d.ts
4
+ type OuiComboboxAnchor = {
5
+ container?: HTMLElement;
6
+ element: HTMLElement;
7
+ };
8
+ type OuiComboboxFilter = {
9
+ element: HTMLInputElement;
10
+ value: string;
11
+ };
12
+ type OuiComboboxGroup = {
13
+ element: HTMLElement;
14
+ header: HTMLElement;
15
+ options: HTMLElement[];
16
+ };
17
+ type OuiComboboxLabel = {
18
+ element: HTMLLabelElement;
19
+ id: string;
20
+ };
21
+ type OuiComboboxOptions = {
22
+ all: HTMLElement[];
23
+ selected: HTMLElement[];
24
+ };
25
+ type OuiComboboxSelection = {
26
+ container: HTMLElement;
27
+ items: OuiComboboxSelectionItem[];
28
+ };
29
+ type OuiComboboxSelectionItem = {
30
+ button: HTMLButtonElement;
31
+ element: HTMLElement;
32
+ };
33
+ type OuiComboboxState = {
34
+ anchor: OuiComboboxAnchor;
35
+ floatable: OuiFloatable;
36
+ selection?: OuiComboboxSelection;
37
+ type: OuiListboxType;
38
+ } & OuiListboxState;
39
+ type OuiComboboxValues = {
40
+ current: string[];
41
+ initial: string[];
42
+ };
43
+ //#endregion
44
+ export { OuiComboboxAnchor, OuiComboboxFilter, OuiComboboxGroup, OuiComboboxLabel, OuiComboboxOptions, OuiComboboxSelection, OuiComboboxSelectionItem, OuiComboboxState, OuiComboboxValues };
@@ -1,13 +1,12 @@
1
- import { I as OuiComboboxState, j as OuiComboboxLocalizations, z as OuiComboboxElement } from "../constants.combobox-h_kyDegw.mjs";
2
- import { OuiLocalizations } from "../l10n.mjs";
1
+ import { t as OuiLocalizations } from "../l10n-Bn-7RcwR.mjs";
2
+ import { o as OuiListboxLocalizations, u as OuiListboxStates } from "../listbox.model-CRReGOmu.mjs";
3
+ import { OuiComboboxState } from "./models.combobox.mjs";
4
+ import { t as OuiComboboxElement } from "../index-EfkUSals.mjs";
3
5
  //#region src/js/combobox/state.combobox.d.ts
4
- declare function attachCombobox(state: OuiComboboxState): void;
5
6
  declare function createComboboxState(element: OuiComboboxElement, internals: ElementInternals): OuiComboboxState;
6
- declare function detachCombobox(state: OuiComboboxState): void;
7
- declare const comboboxLocalizations: OuiLocalizations<OuiComboboxLocalizations>;
8
- declare const comboboxStates: {
9
- map: WeakMap<HTMLElement, OuiComboboxState>;
10
- set: Set<OuiComboboxState>;
11
- };
7
+ declare function onAttachCombobox(state: OuiComboboxState): void;
8
+ declare function onDetachCombobox(state: OuiComboboxState): void;
9
+ declare const comboboxLocalizations: OuiLocalizations<OuiListboxLocalizations>;
10
+ declare const comboboxStates: OuiListboxStates<OuiComboboxState>;
12
11
  //#endregion
13
- export { attachCombobox, comboboxLocalizations, comboboxStates, createComboboxState, detachCombobox };
12
+ export { comboboxLocalizations, comboboxStates, createComboboxState, onAttachCombobox, onDetachCombobox };
@@ -1,2 +1,2 @@
1
- import { F as comboboxStates, I as createComboboxState, L as detachCombobox, N as attachCombobox, P as comboboxLocalizations } from "../data.combobox-B8HMkDOh.mjs";
2
- export { attachCombobox, comboboxLocalizations, comboboxStates, createComboboxState, detachCombobox };
1
+ import { a as onDetachCombobox, i as onAttachCombobox, n as comboboxStates, r as createComboboxState, t as comboboxLocalizations } from "../state.combobox-4xq0FPCF.mjs";
2
+ export { comboboxLocalizations, comboboxStates, createComboboxState, onAttachCombobox, onDetachCombobox };
@@ -0,0 +1,26 @@
1
+ import { r as OuiListboxAutoCompleteType, t as OuiListboxAttributes } from "./listbox.model-CRReGOmu.mjs";
2
+ //#region src/js/combobox/constants.combobox.d.ts
3
+ declare const COMBOBOX_TAGNAME = "oui-combobox";
4
+ declare const COMBOBOX_ATTRIBUTE_ANCHOR = "oui-combobox-anchor";
5
+ declare const COMBOBOX_ATTRIBUTE_SELECTION = "oui-combobox-selection";
6
+ declare const COMBOBOX_ATTRIBUTE_SELECTION_ITEM = "oui-combobox-selection-item";
7
+ declare const COMBOBOX_AUTOCOMPLETES: Set<OuiListboxAutoCompleteType>;
8
+ declare const messageLabel = "<oui-combobox> must contain a <label> element for the <select> element";
9
+ declare const messageSelect = "<oui-combobox> must contain a valid <select> element";
10
+ declare const selectorAnchor = "[oui-combobox-anchor]";
11
+ declare const selectorContent = "[oui-combobox-content]";
12
+ declare const selectorOption = "[oui-combobox-option]";
13
+ declare const selectorSelectionItem = "[oui-combobox-selection-item]";
14
+ declare const COMBOBOX_ATTRIBUTES: OuiListboxAttributes;
15
+ declare const COMBOBOX_MESSAGES: {
16
+ label: string;
17
+ select: string;
18
+ };
19
+ declare const COMBOBOX_SELECTORS: {
20
+ anchor: string;
21
+ content: string;
22
+ selectionItem: string;
23
+ option: string;
24
+ };
25
+ //#endregion
26
+ export { COMBOBOX_AUTOCOMPLETES as a, COMBOBOX_TAGNAME as c, selectorAnchor as d, selectorContent as f, COMBOBOX_ATTRIBUTE_SELECTION_ITEM as i, messageLabel as l, selectorSelectionItem as m, COMBOBOX_ATTRIBUTE_ANCHOR as n, COMBOBOX_MESSAGES as o, selectorOption as p, COMBOBOX_ATTRIBUTE_SELECTION as r, COMBOBOX_SELECTORS as s, COMBOBOX_ATTRIBUTES as t, messageSelect as u };
@@ -0,0 +1,14 @@
1
+ import { t as OuiListboxAttributes } from "./listbox.model-CRReGOmu.mjs";
2
+ //#region src/js/listbox/constants.listbox.d.ts
3
+ declare const LISTBOX_TAGNAME = "oui-listbox";
4
+ declare const LISTBOX_ATTRIBUTES: OuiListboxAttributes;
5
+ declare const LISTBOX_MESSAGES: {
6
+ label: string;
7
+ select: string;
8
+ };
9
+ declare const LISTBOX_SELECTORS: {
10
+ filter: string;
11
+ option: string;
12
+ };
13
+ //#endregion
14
+ export { LISTBOX_TAGNAME as i, LISTBOX_MESSAGES as n, LISTBOX_SELECTORS as r, LISTBOX_ATTRIBUTES as t };
@@ -0,0 +1,139 @@
1
+ import { t as OuiLocalizations } from "./l10n-Bn-7RcwR.mjs";
2
+ import { d as OuiListboxType, n as OuiListboxAutoComplete, o as OuiListboxLocalizations } from "./listbox.model-CRReGOmu.mjs";
3
+ import { c as COMBOBOX_TAGNAME } from "./constants.combobox-DmRAMC64.mjs";
4
+ //#region src/js/combobox/misc.combobox.d.ts
5
+ declare function getComboboxAutoComplete(element: OuiComboboxElement, select: boolean): OuiListboxAutoComplete;
6
+ declare function getComboboxId(): string;
7
+ declare function hasTextSelection(element: HTMLElement): element is HTMLInputElement;
8
+ /**
9
+ * Set combobox localizations for a specific language
10
+ *
11
+ * @param language Language code
12
+ * @param localizations Localizations for language
13
+ */
14
+ declare function setComboboxLocalizations(language: string, localizations: Partial<OuiListboxLocalizations>): void;
15
+ /**
16
+ * Set combobox localizations for one or more languages
17
+ *
18
+ * @param localizations Localizations for one or more languages
19
+ */
20
+ declare function setComboboxLocalizations(localizations: Record<string, Partial<OuiListboxLocalizations>>): void;
21
+ declare function updateComboboxLocalizations(instance: OuiLocalizations<OuiListboxLocalizations>, destination: Record<string, Partial<OuiListboxLocalizations>>, first: string | Record<string, Partial<OuiListboxLocalizations>>, second?: Partial<OuiListboxLocalizations>): void;
22
+ //#endregion
23
+ //#region src/js/combobox/index.d.ts
24
+ declare global {
25
+ interface HTMLElementTagNameMap {
26
+ [COMBOBOX_TAGNAME]: OuiComboboxElement;
27
+ }
28
+ }
29
+ declare class OuiComboboxElement extends HTMLElement {
30
+ #private;
31
+ static formAssociated: boolean;
32
+ static observedAttributes: string[];
33
+ /**
34
+ * Is the combobox disabled?
35
+ */
36
+ get disabled(): boolean;
37
+ /**
38
+ * Should the combobox be disabled?
39
+ */
40
+ set disabled(value: boolean);
41
+ /**
42
+ * Current filter value
43
+ */
44
+ get filter(): string;
45
+ /**
46
+ * Set the filter value
47
+ */
48
+ set filter(value: string);
49
+ /**
50
+ * Maximum number of selected options
51
+ */
52
+ get max(): number | undefined;
53
+ /**
54
+ * Set the maximum number of selected options
55
+ */
56
+ set max(value: number);
57
+ /**
58
+ * Minimum number of selected options
59
+ */
60
+ get min(): number | undefined;
61
+ /**
62
+ * Set the minimum number of selected options
63
+ */
64
+ set min(value: number);
65
+ /**
66
+ * Does the combobox allow multiple values?
67
+ */
68
+ get multiple(): boolean;
69
+ /**
70
+ * Name of the combobox
71
+ */
72
+ get name(): string;
73
+ /**
74
+ * Is the combobox readonly?
75
+ */
76
+ get readonly(): boolean;
77
+ /**
78
+ * Should the combobox be readonly?
79
+ */
80
+ set readonly(value: boolean);
81
+ /**
82
+ * Is the combobox required?
83
+ */
84
+ get required(): boolean;
85
+ /**
86
+ * Should the combobox be required?
87
+ */
88
+ set required(value: boolean);
89
+ /**
90
+ * Selected options
91
+ */
92
+ get selected(): HTMLElement[];
93
+ /**
94
+ * Type of combobox
95
+ */
96
+ get type(): OuiListboxType;
97
+ /**
98
+ * Current value
99
+ */
100
+ get value(): string;
101
+ /**
102
+ * Set the value
103
+ */
104
+ set value(value: unknown);
105
+ /**
106
+ * Current values
107
+ */
108
+ get values(): string[];
109
+ /**
110
+ * Set the values
111
+ */
112
+ set values(values: unknown[]);
113
+ constructor();
114
+ attributeChangedCallback(name: string, _: string | null, value: string | null): void;
115
+ /**
116
+ * Clear all selected options
117
+ */
118
+ clear(): void;
119
+ connectedCallback(): void;
120
+ disconnectedCallback(): void;
121
+ formDisabledCallback(disabled: boolean): void;
122
+ formResetCallback(): void;
123
+ formStateRestoreCallback(state: string | File | FormData, reason: unknown): void;
124
+ /**
125
+ * Set combobox localizations for a specific language
126
+ *
127
+ * @param language Language code
128
+ * @param localizations Localizations for language
129
+ */
130
+ setLocalizations(language: string, localizations: Partial<OuiListboxLocalizations>): void;
131
+ /**
132
+ * Set combobox localizations for one or more languages
133
+ *
134
+ * @param localizations Localizations for one or more languages
135
+ */
136
+ setLocalizations(localizations: Record<string, Partial<OuiListboxLocalizations>>): void;
137
+ }
138
+ //#endregion
139
+ export { setComboboxLocalizations as a, hasTextSelection as i, getComboboxAutoComplete as n, updateComboboxLocalizations as o, getComboboxId as r, OuiComboboxElement as t };
@@ -1,5 +1,5 @@
1
1
  import { a as OuiFloatablePosition, n as CreateOuiFloatableOptions, r as OuiFloatable, s as createFloatable } from "./floatable.embedded-Bct4U5Dm.mjs";
2
- import { Y as setComboboxLocalizations, z as OuiComboboxElement } from "./constants.combobox-h_kyDegw.mjs";
2
+ import { a as setComboboxLocalizations, t as OuiComboboxElement } from "./index-EfkUSals.mjs";
3
3
  import { d as OuiSortable, f as createSortable, g as createMovable, h as OuiMovable, t as CreateOuiDraggableOptions } from "./draggable-a6w0J1OD.mjs";
4
4
  import "./movable/movable.standalone.mjs";
5
5
  import { a as createResizable, n as OuiResizable, t as CreateOuiResizableOptions } from "./resizable.embedded-3qoR0Bjm.mjs";
@@ -7,8 +7,10 @@ import "./resizable/resizable.standalone.mjs";
7
7
  import { OuiDialog, getDialog } from "./dialog.mjs";
8
8
  import "./floatable/floatable.standalone.mjs";
9
9
  import { a as OuiFocusTrapOptions, i as OuiFocusTrap, o as createFocusTrap } from "./focus-trap.embedded-DR8NpZfr.mjs";
10
+ import { n as setListboxLocalizations } from "./misc.listbox-gnoJhrTr.mjs";
11
+ import { OuiListboxElement } from "./listbox/index.mjs";
10
12
  import { OuiPopover, getPopover } from "./popover.mjs";
11
13
  import "./sortable/sortable.standalone.mjs";
12
14
  import { OuiSplitterElement } from "./splitter.mjs";
13
15
  import { OuiTooltip, getTooltip, setTooltipDelay } from "./tooltip.mjs";
14
- export { type CreateOuiFloatableOptions, type CreateOuiDraggableOptions as CreateOuiMovableOptions, type CreateOuiDraggableOptions as CreateOuiSortableOptions, type CreateOuiResizableOptions, OuiComboboxElement, type OuiDialog, type OuiFloatable, type OuiFloatablePosition, type OuiFocusTrap, type OuiFocusTrapOptions, type OuiMovable, type OuiPopover, type OuiResizable, type OuiSortable, OuiSplitterElement, type OuiTooltip, createFloatable, createFocusTrap, createMovable, createResizable as createOuiResizable, createSortable, getDialog, getPopover, getTooltip, setComboboxLocalizations, setTooltipDelay };
16
+ export { type CreateOuiFloatableOptions, type CreateOuiDraggableOptions as CreateOuiMovableOptions, type CreateOuiDraggableOptions as CreateOuiSortableOptions, type CreateOuiResizableOptions, OuiComboboxElement, type OuiDialog, type OuiFloatable, type OuiFloatablePosition, type OuiFocusTrap, type OuiFocusTrapOptions, OuiListboxElement, type OuiMovable, type OuiPopover, type OuiResizable, type OuiSortable, OuiSplitterElement, type OuiTooltip, createFloatable, createFocusTrap, createMovable, createResizable as createOuiResizable, createSortable, getDialog, getPopover, getTooltip, setComboboxLocalizations, setListboxLocalizations, setTooltipDelay };
package/dist/js/index.mjs CHANGED
@@ -5,15 +5,17 @@ import { createResizable } from "./resizable/resizable.embedded.mjs";
5
5
  import { getDialog } from "./dialog.mjs";
6
6
  import "./menu.mjs";
7
7
  import "./toolbar.mjs";
8
- import { ot as setComboboxLocalizations } from "./data.combobox-B8HMkDOh.mjs";
8
+ import { D as setComboboxLocalizations } from "./state.combobox-4xq0FPCF.mjs";
9
9
  import { OuiComboboxElement } from "./combobox/index.mjs";
10
10
  import "./floatable/floatable.standalone.mjs";
11
11
  import { createFocusTrap } from "./focus-trap/focus-trap.embedded.mjs";
12
12
  import "./focus-trap/focus-trap.standalone.mjs";
13
+ import { n as setListboxLocalizations } from "./misc.listbox-BI-XsTOf.mjs";
14
+ import { OuiListboxElement } from "./listbox/index.mjs";
13
15
  import { getPopover } from "./popover.mjs";
14
16
  import "./resizable/resizable.standalone.mjs";
15
17
  import { createSortable } from "./sortable/sortable.embedded.mjs";
16
18
  import "./sortable/sortable.standalone.mjs";
17
19
  import { OuiSplitterElement } from "./splitter.mjs";
18
20
  import { getTooltip, setTooltipDelay } from "./tooltip.mjs";
19
- export { OuiComboboxElement, OuiSplitterElement, createFloatable, createFocusTrap, createMovable, createResizable as createOuiResizable, createSortable, getDialog, getPopover, getTooltip, setComboboxLocalizations, setTooltipDelay };
21
+ export { OuiComboboxElement, OuiListboxElement, OuiSplitterElement, createFloatable, createFocusTrap, createMovable, createResizable as createOuiResizable, createSortable, getDialog, getPopover, getTooltip, setComboboxLocalizations, setListboxLocalizations, setTooltipDelay };
@@ -4,9 +4,10 @@ function attributable(attribute, add, remove) {
4
4
  const { length } = entries;
5
5
  for (let index = 0; index < length; index += 1) {
6
6
  const entry = entries[index];
7
- if (entry.type === "attributes" && entry.target instanceof Element) if (entry.target.hasAttribute(attribute)) handleAdded(attribute, [entry.target], add);
8
- else handleRemoved([entry.target], remove);
9
- else if (entry.type === "childList") {
7
+ if (entry.type === "attributes" && entry.target instanceof Element) {
8
+ if (entry.target.hasAttribute(attribute)) handleAdded(attribute, [entry.target], add);
9
+ else handleRemoved([entry.target], remove);
10
+ } else if (entry.type === "childList") {
10
11
  handleAdded(attribute, entry.addedNodes, add);
11
12
  handleRemoved(entry.removedNodes, remove);
12
13
  }
@@ -0,0 +1,11 @@
1
+ import { d as OuiListboxType } from "../../listbox.model-CRReGOmu.mjs";
2
+ //#region src/js/internal/listbox/listbox.constants.d.ts
3
+ declare const LISTBOX_KEYS: {
4
+ activation: Set<string>;
5
+ navigation: Set<string>;
6
+ selection: Set<string>;
7
+ };
8
+ declare const LISTBOX_TYPES: Set<OuiListboxType>;
9
+ declare const listboxScrollOptions: ScrollIntoViewOptions;
10
+ //#endregion
11
+ export { LISTBOX_KEYS, LISTBOX_TYPES, listboxScrollOptions };
@@ -0,0 +1,23 @@
1
+ const LISTBOX_KEYS = {
2
+ activation: /* @__PURE__ */ new Set([
3
+ " ",
4
+ "Backspace",
5
+ "Delete",
6
+ "Enter"
7
+ ]),
8
+ navigation: /* @__PURE__ */ new Set([
9
+ "ArrowDown",
10
+ "ArrowUp",
11
+ "PageDown",
12
+ "PageUp"
13
+ ]),
14
+ selection: /* @__PURE__ */ new Set(["ArrowRight", "End"])
15
+ };
16
+ const LISTBOX_TYPES = /* @__PURE__ */ new Set(["autocomplete", "select"]);
17
+ const listboxScrollOptions = {
18
+ behavior: "auto",
19
+ block: "nearest",
20
+ inline: "nearest"
21
+ };
22
+ //#endregion
23
+ export { LISTBOX_KEYS, LISTBOX_TYPES, listboxScrollOptions };
@@ -0,0 +1,20 @@
1
+ import { l as OuiListboxState } from "../../listbox.model-CRReGOmu.mjs";
2
+ //#region src/js/internal/listbox/listbox.data.d.ts
3
+ type ApplySelectionParameters<State extends OuiListboxState = OuiListboxState> = {
4
+ added: boolean;
5
+ emit?: boolean;
6
+ option?: HTMLElement;
7
+ scroll?: boolean;
8
+ selected?: HTMLElement[];
9
+ state: State;
10
+ values?: string[];
11
+ };
12
+ declare function applyListboxSelection<State extends OuiListboxState>(parameters: ApplySelectionParameters<State>): void;
13
+ declare function filterListbox(type: InputEvent['inputType'], state: OuiListboxState): void;
14
+ declare function filterListboxOption(state: OuiListboxState, value: unknown, textContent?: boolean): HTMLElement | undefined;
15
+ declare function filterListboxOptions(state: OuiListboxState): HTMLElement | undefined;
16
+ declare function setListboxValue<State extends OuiListboxState>(state: State, value: unknown, emit?: boolean): void;
17
+ declare function setListboxValues<State extends OuiListboxState>(state: State, value: unknown[], emit?: boolean): void;
18
+ declare function toggleListboxOption<State extends OuiListboxState>(state: State, option?: HTMLElement): void;
19
+ //#endregion
20
+ export { applyListboxSelection, filterListbox, filterListboxOption, filterListboxOptions, setListboxValue, setListboxValues, toggleListboxOption };
@@ -0,0 +1,2 @@
1
+ import { a as setListboxValue, i as filterListboxOptions, n as filterListbox, o as setListboxValues, r as filterListboxOption, s as toggleListboxOption, t as applyListboxSelection } from "../../listbox.data-BWd0PCy7.mjs";
2
+ export { applyListboxSelection, filterListbox, filterListboxOption, filterListboxOptions, setListboxValue, setListboxValues, toggleListboxOption };
@@ -0,0 +1,66 @@
1
+ import { a as OuiListboxGroup, c as OuiListboxPreview, d as OuiListboxType, l as OuiListboxState, n as OuiListboxAutoComplete, s as OuiListboxOptions, t as OuiListboxAttributes } from "../../listbox.model-CRReGOmu.mjs";
2
+ //#region src/js/internal/listbox/listbox.dom.d.ts
3
+ type CreateListboxContent = {
4
+ element: HTMLDivElement;
5
+ filter?: CreateListboxFilter;
6
+ list: CreateListboxList;
7
+ message: HTMLDivElement;
8
+ value: HTMLSpanElement;
9
+ };
10
+ type CreateListboxContentParameters = {
11
+ attributes: OuiListboxAttributes;
12
+ autocomplete: OuiListboxAutoComplete;
13
+ element: HTMLElement;
14
+ id: string;
15
+ label: HTMLLabelElement;
16
+ listbox: boolean;
17
+ multiple: boolean;
18
+ select: HTMLSelectElement;
19
+ type: OuiListboxType;
20
+ };
21
+ type CreateListboxFilter = {
22
+ container: HTMLElement;
23
+ element: HTMLInputElement;
24
+ };
25
+ type CreateListboxGroupParameters = {
26
+ group: HTMLOptGroupElement;
27
+ groupOptions: HTMLOptionElement[];
28
+ original: CreateListboxContentParameters;
29
+ selected: HTMLElement[];
30
+ type: OuiListboxType;
31
+ };
32
+ type CreateListboxList = {
33
+ element: HTMLUListElement;
34
+ groups?: OuiListboxGroup[];
35
+ options: OuiListboxOptions;
36
+ };
37
+ type CreateListboxOptionParameters = {
38
+ group?: string;
39
+ index: number;
40
+ option: HTMLOptionElement;
41
+ original: CreateListboxContentParameters;
42
+ type: OuiListboxType;
43
+ };
44
+ type CreateListboxOptionsParameters = {
45
+ group?: string;
46
+ list: HTMLElement;
47
+ options: HTMLOptionElement[];
48
+ original: CreateListboxContentParameters;
49
+ selected: HTMLElement[];
50
+ type: OuiListboxType;
51
+ };
52
+ declare function createListboxContent(parameters: CreateListboxContentParameters): CreateListboxContent;
53
+ declare function createListboxFilter(parameters: CreateListboxContentParameters): CreateListboxFilter | undefined;
54
+ declare function createListboxGroup(parameters: CreateListboxGroupParameters): OuiListboxGroup;
55
+ declare function createListboxHeader(parameters: CreateListboxGroupParameters, group: HTMLOptGroupElement): HTMLElement;
56
+ declare function createListboxInput(parameters: CreateListboxContentParameters, value: string): HTMLInputElement;
57
+ declare function createListboxList(parameters: CreateListboxContentParameters): CreateListboxList;
58
+ declare function createListboxMessage(attribute: string): HTMLDivElement;
59
+ declare function createListboxOption(parameters: CreateListboxOptionParameters): HTMLElement;
60
+ declare function createListboxOptions(parameters: CreateListboxOptionsParameters): HTMLElement[];
61
+ declare function createListboxValueLabel(id: string): HTMLSpanElement;
62
+ declare function updateListboxMessage(state: OuiListboxState): void;
63
+ declare function updateListboxPreview<State extends OuiListboxState>(preview: OuiListboxPreview, state: State, active?: HTMLElement, scroll?: boolean): void;
64
+ declare function updateListboxValueLabel<State extends OuiListboxState>(state: State): void;
65
+ //#endregion
66
+ export { CreateListboxContent, CreateListboxContentParameters, CreateListboxFilter, CreateListboxList, createListboxContent, createListboxFilter, createListboxGroup, createListboxHeader, createListboxInput, createListboxList, createListboxMessage, createListboxOption, createListboxOptions, createListboxValueLabel, updateListboxMessage, updateListboxPreview, updateListboxValueLabel };
@@ -0,0 +1,2 @@
1
+ import { _ as createListboxValueLabel, b as updateListboxValueLabel, c as createListboxContent, d as createListboxHeader, f as createListboxInput, g as createListboxOptions, h as createListboxOption, l as createListboxFilter, m as createListboxMessage, p as createListboxList, u as createListboxGroup, v as updateListboxMessage, y as updateListboxPreview } from "../../listbox.data-BWd0PCy7.mjs";
2
+ export { createListboxContent, createListboxFilter, createListboxGroup, createListboxHeader, createListboxInput, createListboxList, createListboxMessage, createListboxOption, createListboxOptions, createListboxValueLabel, updateListboxMessage, updateListboxPreview, updateListboxValueLabel };
@@ -0,0 +1,5 @@
1
+ import { l as OuiListboxState } from "../../listbox.model-CRReGOmu.mjs";
2
+ //#region src/js/internal/listbox/listbox.event.d.ts
3
+ declare function processListboxKeydown<State extends OuiListboxState>(event: KeyboardEvent, state: State): void;
4
+ //#endregion
5
+ export { processListboxKeydown };