@oscarpalmer/oui 0.33.0 → 0.35.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.
- package/dist/js/combobox/constants.combobox.d.mts +2 -0
- package/dist/js/combobox/constants.combobox.mjs +46 -0
- package/dist/js/combobox/data.combobox.d.mts +18 -0
- package/dist/js/combobox/data.combobox.mjs +2 -0
- package/dist/js/combobox/dom.combobox.d.mts +110 -0
- package/dist/js/combobox/dom.combobox.mjs +2 -0
- package/dist/js/combobox/event.combobox.d.mts +17 -0
- package/dist/js/combobox/event.combobox.mjs +2 -0
- package/dist/js/combobox/form.combobox.d.mts +6 -0
- package/dist/js/combobox/form.combobox.mjs +2 -0
- package/dist/js/combobox/index.d.mts +2 -0
- package/dist/js/combobox/index.mjs +195 -0
- package/dist/js/combobox/misc.combobox.d.mts +2 -0
- package/dist/js/combobox/misc.combobox.mjs +2 -0
- package/dist/js/combobox/models.combobox.d.mts +2 -0
- package/dist/js/combobox/models.combobox.mjs +1 -0
- package/dist/js/combobox/state.combobox.d.mts +13 -0
- package/dist/js/combobox/state.combobox.mjs +2 -0
- package/dist/js/constants.combobox-h_kyDegw.d.mts +248 -0
- package/dist/js/data.combobox-B8HMkDOh.mjs +1030 -0
- package/dist/js/dialog.mjs +3 -2
- package/dist/js/floatable/floatable.embedded.mjs +4 -4
- package/dist/js/focus-trap/focus-trap.embedded.mjs +3 -3
- package/dist/js/index.d.mts +14 -643
- package/dist/js/index.mjs +19 -4875
- package/dist/js/internal/draggable.mjs +6 -6
- package/dist/js/internal/navigable.mjs +3 -3
- package/dist/js/l10n.d.mts +20 -0
- package/dist/js/l10n.mjs +80 -0
- package/dist/js/menu.d.mts +1 -1
- package/dist/js/menu.mjs +3 -2
- package/dist/js/movable/movable.embedded.mjs +3 -3
- package/dist/js/popover.mjs +1 -1
- package/dist/js/resizable/resizable.embedded.mjs +7 -7
- package/dist/js/sortable/sortable.embedded.mjs +7 -6
- package/dist/js/splitter.mjs +7 -13
- package/dist/js/toolbar.d.mts +1 -1
- package/dist/js/tooltip.mjs +3 -3
- package/package.json +4 -4
- package/src/js/combobox/constants.combobox.ts +62 -0
- package/src/js/combobox/data.combobox.ts +236 -0
- package/src/js/combobox/dom.combobox.ts +825 -0
- package/src/js/combobox/event.combobox.ts +454 -0
- package/src/js/combobox/form.combobox.ts +116 -0
- package/src/js/combobox/index.ts +313 -0
- package/src/js/combobox/misc.combobox.ts +188 -0
- package/src/js/combobox/models.combobox.ts +94 -0
- package/src/js/combobox/state.combobox.ts +247 -0
- package/src/js/index.ts +1 -1
- package/src/js/internal/draggable.ts +3 -3
- package/src/js/l10n.ts +192 -0
- package/src/js/movable/movable.embedded.ts +2 -2
- package/src/js/resizable/resizable.embedded.ts +3 -3
- package/src/js/sortable/sortable.embedded.ts +2 -2
- package/src/js/splitter.ts +2 -2
- package/dist/js/combobox.d.mts +0 -91
- package/dist/js/combobox.mjs +0 -797
- package/src/js/combobox.ts +0 -2410
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import { C as COMBOBOX_TYPES, S as COMBOBOX_TAGNAME, _ as COMBOBOX_MESSAGE_LABEL, a as COMBOBOX_ATTRIBUTE_HEADER, b as COMBOBOX_SELECTOR_OPTION, c as COMBOBOX_ATTRIBUTE_MESSAGE, d as COMBOBOX_ATTRIBUTE_SELECTION, f as COMBOBOX_ATTRIBUTE_SELECTION_ITEM, g as COMBOBOX_KEYS_SELECTION, h as COMBOBOX_KEYS_NAVIGATION, i as COMBOBOX_ATTRIBUTE_FILTER_INPUT, l as COMBOBOX_ATTRIBUTE_OPTION, m as COMBOBOX_KEYS_ACTIVATION, n as COMBOBOX_ATTRIBUTE_CONTENT, o as COMBOBOX_ATTRIBUTE_HIDDEN, p as COMBOBOX_AUTOCOMPLETES, r as COMBOBOX_ATTRIBUTE_FILTER, s as COMBOBOX_ATTRIBUTE_LIST, t as COMBOBOX_ATTRIBUTE_ANCHOR, u as COMBOBOX_ATTRIBUTE_OPTION_ACTIVE, v as COMBOBOX_MESSAGE_SELECT, w as comboboxScrollOptions, x as COMBOBOX_SELECTOR_SELECTION_ITEM, y as COMBOBOX_SELECTOR_ANCHOR } from "../constants.combobox-h_kyDegw.mjs";
|
|
2
|
+
export { COMBOBOX_ATTRIBUTE_ANCHOR, COMBOBOX_ATTRIBUTE_CONTENT, COMBOBOX_ATTRIBUTE_FILTER, COMBOBOX_ATTRIBUTE_FILTER_INPUT, COMBOBOX_ATTRIBUTE_HEADER, COMBOBOX_ATTRIBUTE_HIDDEN, COMBOBOX_ATTRIBUTE_LIST, COMBOBOX_ATTRIBUTE_MESSAGE, COMBOBOX_ATTRIBUTE_OPTION, COMBOBOX_ATTRIBUTE_OPTION_ACTIVE, COMBOBOX_ATTRIBUTE_SELECTION, COMBOBOX_ATTRIBUTE_SELECTION_ITEM, COMBOBOX_AUTOCOMPLETES, COMBOBOX_KEYS_ACTIVATION, COMBOBOX_KEYS_NAVIGATION, COMBOBOX_KEYS_SELECTION, COMBOBOX_MESSAGE_LABEL, COMBOBOX_MESSAGE_SELECT, COMBOBOX_SELECTOR_ANCHOR, COMBOBOX_SELECTOR_OPTION, COMBOBOX_SELECTOR_SELECTION_ITEM, COMBOBOX_TAGNAME, COMBOBOX_TYPES, comboboxScrollOptions };
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
//#region src/js/combobox/constants.combobox.ts
|
|
2
|
+
const COMBOBOX_TAGNAME = "oui-combobox";
|
|
3
|
+
const COMBOBOX_ATTRIBUTE_ANCHOR = `${COMBOBOX_TAGNAME}-anchor`;
|
|
4
|
+
const COMBOBOX_ATTRIBUTE_CONTENT = `${COMBOBOX_TAGNAME}-content`;
|
|
5
|
+
const COMBOBOX_ATTRIBUTE_FILTER = `${COMBOBOX_TAGNAME}-filter`;
|
|
6
|
+
const COMBOBOX_ATTRIBUTE_FILTER_INPUT = `${COMBOBOX_ATTRIBUTE_FILTER}-input`;
|
|
7
|
+
const COMBOBOX_ATTRIBUTE_HEADER = `${COMBOBOX_TAGNAME}-header`;
|
|
8
|
+
const COMBOBOX_ATTRIBUTE_HIDDEN = `${COMBOBOX_TAGNAME}-hidden`;
|
|
9
|
+
const COMBOBOX_ATTRIBUTE_LIST = `${COMBOBOX_TAGNAME}-list`;
|
|
10
|
+
const COMBOBOX_ATTRIBUTE_MESSAGE = `${COMBOBOX_TAGNAME}-message`;
|
|
11
|
+
const COMBOBOX_ATTRIBUTE_OPTION = `${COMBOBOX_TAGNAME}-option`;
|
|
12
|
+
const COMBOBOX_ATTRIBUTE_OPTION_ACTIVE = `${COMBOBOX_TAGNAME}-option-active`;
|
|
13
|
+
const COMBOBOX_ATTRIBUTE_SELECTION = `${COMBOBOX_TAGNAME}-selection`;
|
|
14
|
+
const COMBOBOX_ATTRIBUTE_SELECTION_ITEM = `${COMBOBOX_TAGNAME}-selection-item`;
|
|
15
|
+
const COMBOBOX_AUTOCOMPLETES = /* @__PURE__ */ new Set([
|
|
16
|
+
"both",
|
|
17
|
+
"inline",
|
|
18
|
+
"list",
|
|
19
|
+
"none"
|
|
20
|
+
]);
|
|
21
|
+
const COMBOBOX_KEYS_ACTIVATION = /* @__PURE__ */ new Set([
|
|
22
|
+
" ",
|
|
23
|
+
"Backspace",
|
|
24
|
+
"Delete",
|
|
25
|
+
"Enter"
|
|
26
|
+
]);
|
|
27
|
+
const COMBOBOX_KEYS_NAVIGATION = /* @__PURE__ */ new Set([
|
|
28
|
+
"ArrowDown",
|
|
29
|
+
"ArrowUp",
|
|
30
|
+
"PageDown",
|
|
31
|
+
"PageUp"
|
|
32
|
+
]);
|
|
33
|
+
const COMBOBOX_KEYS_SELECTION = /* @__PURE__ */ new Set(["ArrowRight", "End"]);
|
|
34
|
+
const COMBOBOX_MESSAGE_LABEL = `<${COMBOBOX_TAGNAME}> must contain a <label> element for the <select> element`;
|
|
35
|
+
const COMBOBOX_MESSAGE_SELECT = `<${COMBOBOX_TAGNAME}> must contain a valid <select> element`;
|
|
36
|
+
const COMBOBOX_SELECTOR_ANCHOR = `[${COMBOBOX_ATTRIBUTE_ANCHOR}]`;
|
|
37
|
+
const COMBOBOX_SELECTOR_SELECTION_ITEM = `[${COMBOBOX_ATTRIBUTE_SELECTION_ITEM}]`;
|
|
38
|
+
const COMBOBOX_SELECTOR_OPTION = `[${COMBOBOX_ATTRIBUTE_OPTION}]`;
|
|
39
|
+
const COMBOBOX_TYPES = /* @__PURE__ */ new Set(["autocomplete", "select"]);
|
|
40
|
+
const comboboxScrollOptions = {
|
|
41
|
+
behavior: "auto",
|
|
42
|
+
block: "nearest",
|
|
43
|
+
inline: "nearest"
|
|
44
|
+
};
|
|
45
|
+
//#endregion
|
|
46
|
+
export { COMBOBOX_ATTRIBUTE_ANCHOR, COMBOBOX_ATTRIBUTE_CONTENT, COMBOBOX_ATTRIBUTE_FILTER, COMBOBOX_ATTRIBUTE_FILTER_INPUT, COMBOBOX_ATTRIBUTE_HEADER, COMBOBOX_ATTRIBUTE_HIDDEN, COMBOBOX_ATTRIBUTE_LIST, COMBOBOX_ATTRIBUTE_MESSAGE, COMBOBOX_ATTRIBUTE_OPTION, COMBOBOX_ATTRIBUTE_OPTION_ACTIVE, COMBOBOX_ATTRIBUTE_SELECTION, COMBOBOX_ATTRIBUTE_SELECTION_ITEM, COMBOBOX_AUTOCOMPLETES, COMBOBOX_KEYS_ACTIVATION, COMBOBOX_KEYS_NAVIGATION, COMBOBOX_KEYS_SELECTION, COMBOBOX_MESSAGE_LABEL, COMBOBOX_MESSAGE_SELECT, COMBOBOX_SELECTOR_ANCHOR, COMBOBOX_SELECTOR_OPTION, COMBOBOX_SELECTOR_SELECTION_ITEM, COMBOBOX_TAGNAME, COMBOBOX_TYPES, comboboxScrollOptions };
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { I as OuiComboboxState } from "../constants.combobox-h_kyDegw.mjs";
|
|
2
|
+
//#region src/js/combobox/data.combobox.d.ts
|
|
3
|
+
type ApplySelectionParameters = {
|
|
4
|
+
added: boolean;
|
|
5
|
+
emit?: boolean;
|
|
6
|
+
option?: HTMLElement;
|
|
7
|
+
selected?: HTMLElement[];
|
|
8
|
+
state: OuiComboboxState;
|
|
9
|
+
values?: string[];
|
|
10
|
+
};
|
|
11
|
+
declare function applyComboboxSelection(parameters: ApplySelectionParameters): void;
|
|
12
|
+
declare function filterComboboxOption(state: OuiComboboxState, value: unknown, textContent?: boolean): HTMLElement | undefined;
|
|
13
|
+
declare function filterComboboxOptions(state: OuiComboboxState): HTMLElement | undefined;
|
|
14
|
+
declare function setComboboxValue(state: OuiComboboxState, value: unknown, emit?: boolean): void;
|
|
15
|
+
declare function setComboboxValues(state: OuiComboboxState, value: unknown, emit?: boolean): void;
|
|
16
|
+
declare function toggleComboboxOption(state: OuiComboboxState, option?: HTMLElement): void;
|
|
17
|
+
//#endregion
|
|
18
|
+
export { applyComboboxSelection, filterComboboxOption, filterComboboxOptions, setComboboxValue, setComboboxValues, toggleComboboxOption };
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import { a as setComboboxValues, i as setComboboxValue, n as filterComboboxOption, o as toggleComboboxOption, r as filterComboboxOptions, t as applyComboboxSelection } from "../data.combobox-B8HMkDOh.mjs";
|
|
2
|
+
export { applyComboboxSelection, filterComboboxOption, filterComboboxOptions, setComboboxValue, setComboboxValues, toggleComboboxOption };
|
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
import { D as OuiComboboxAutoCompleteType, E as OuiComboboxAutoComplete, F as OuiComboboxSelectionItem, I as OuiComboboxState, L as OuiComboboxType, N as OuiComboboxPreview, P as OuiComboboxSelection, k as OuiComboboxGroup } from "../constants.combobox-h_kyDegw.mjs";
|
|
2
|
+
//#region src/js/combobox/dom.combobox.d.ts
|
|
3
|
+
type CreateAnchor = {
|
|
4
|
+
container?: HTMLElement;
|
|
5
|
+
element: HTMLElement;
|
|
6
|
+
selection?: OuiComboboxSelection;
|
|
7
|
+
};
|
|
8
|
+
type CreatAnchorParameters = {
|
|
9
|
+
autocomplete: OuiComboboxAutoComplete;
|
|
10
|
+
id: string;
|
|
11
|
+
label: HTMLLabelElement;
|
|
12
|
+
multiple: boolean;
|
|
13
|
+
select: HTMLSelectElement;
|
|
14
|
+
type: OuiComboboxType;
|
|
15
|
+
};
|
|
16
|
+
type CreateContent = {
|
|
17
|
+
element: HTMLElement;
|
|
18
|
+
filter?: CreateFilter;
|
|
19
|
+
list: CreateList;
|
|
20
|
+
message: HTMLElement;
|
|
21
|
+
};
|
|
22
|
+
type CreateContentParameters = {
|
|
23
|
+
autocomplete: OuiComboboxAutoComplete;
|
|
24
|
+
id: string;
|
|
25
|
+
label: HTMLLabelElement;
|
|
26
|
+
multiple: boolean;
|
|
27
|
+
select: HTMLSelectElement;
|
|
28
|
+
type: OuiComboboxType;
|
|
29
|
+
};
|
|
30
|
+
type CreateFilter = {
|
|
31
|
+
container: HTMLElement;
|
|
32
|
+
element: HTMLInputElement;
|
|
33
|
+
};
|
|
34
|
+
type CreateFilterParameters = {
|
|
35
|
+
autocomplete: OuiComboboxAutoCompleteType;
|
|
36
|
+
id: string;
|
|
37
|
+
label: HTMLLabelElement;
|
|
38
|
+
type: OuiComboboxType;
|
|
39
|
+
};
|
|
40
|
+
type CreateGroupParameters = {
|
|
41
|
+
autocomplete: OuiComboboxAutoComplete;
|
|
42
|
+
group: HTMLOptGroupElement;
|
|
43
|
+
groupOptions: HTMLOptionElement[];
|
|
44
|
+
selected: HTMLElement[];
|
|
45
|
+
};
|
|
46
|
+
type CreateInputParameters = {
|
|
47
|
+
autocomplete: OuiComboboxAutoCompleteType;
|
|
48
|
+
id: string;
|
|
49
|
+
label: HTMLLabelElement;
|
|
50
|
+
type: OuiComboboxType;
|
|
51
|
+
value: string;
|
|
52
|
+
};
|
|
53
|
+
type CreateList = {
|
|
54
|
+
element: HTMLElement;
|
|
55
|
+
groups?: OuiComboboxGroup[];
|
|
56
|
+
options: HTMLElement[];
|
|
57
|
+
selected: HTMLElement[];
|
|
58
|
+
};
|
|
59
|
+
type CreateListParameters = {
|
|
60
|
+
autocomplete: OuiComboboxAutoComplete;
|
|
61
|
+
id: string;
|
|
62
|
+
label: HTMLLabelElement;
|
|
63
|
+
multiple: boolean;
|
|
64
|
+
select: HTMLSelectElement;
|
|
65
|
+
};
|
|
66
|
+
type CreateOptionParameters = {
|
|
67
|
+
autocomplete: OuiComboboxAutoComplete;
|
|
68
|
+
group?: string;
|
|
69
|
+
index: number;
|
|
70
|
+
option: HTMLOptionElement;
|
|
71
|
+
};
|
|
72
|
+
type CreateOptionsParameters = {
|
|
73
|
+
autocomplete: OuiComboboxAutoComplete;
|
|
74
|
+
group?: string;
|
|
75
|
+
list: HTMLElement;
|
|
76
|
+
options: HTMLOptionElement[];
|
|
77
|
+
selected: HTMLElement[];
|
|
78
|
+
};
|
|
79
|
+
type CreateSelectionItemsParameters = {
|
|
80
|
+
container: HTMLElement;
|
|
81
|
+
items: OuiComboboxSelectionItem[];
|
|
82
|
+
options: HTMLElement[];
|
|
83
|
+
state?: OuiComboboxState;
|
|
84
|
+
};
|
|
85
|
+
declare function createComboboxAnchor(parameters: CreatAnchorParameters): CreateAnchor;
|
|
86
|
+
declare function createComboboxButton(parameters: CreatAnchorParameters): CreateAnchor;
|
|
87
|
+
declare function createComboboxContent(parameters: CreateContentParameters): CreateContent;
|
|
88
|
+
declare function createComboboxFilter(parameters: CreateFilterParameters): CreateFilter | undefined;
|
|
89
|
+
declare function createComboboxGroup(parameters: CreateGroupParameters): OuiComboboxGroup;
|
|
90
|
+
declare function createComboboxHeader(group: HTMLOptGroupElement): HTMLElement;
|
|
91
|
+
declare function createComboboxInput(parameters: CreateInputParameters): HTMLInputElement;
|
|
92
|
+
declare function createComboboxList(parameters: CreateListParameters): CreateList;
|
|
93
|
+
declare function createComboboxMessage(): HTMLElement;
|
|
94
|
+
declare function createComboboxOption(parameters: CreateOptionParameters): HTMLElement;
|
|
95
|
+
declare function createComboboxOptions(parameters: CreateOptionsParameters): HTMLElement[];
|
|
96
|
+
declare function createComboboxSelection(id: string, select: HTMLSelectElement): OuiComboboxSelection;
|
|
97
|
+
declare function createComboboxSelectionItem(option: HTMLElement, state?: OuiComboboxState): OuiComboboxSelectionItem;
|
|
98
|
+
declare function createComboboxSelectionItems(parameters: CreateSelectionItemsParameters): void;
|
|
99
|
+
declare function setComboboxDisabled(state: OuiComboboxState, value: boolean): void;
|
|
100
|
+
declare function setComboboxReadonly(state: OuiComboboxState, value: boolean): void;
|
|
101
|
+
declare function setComboboxRequired(state: OuiComboboxState, value: boolean): void;
|
|
102
|
+
declare function updateComboboxTabindices(state: OuiComboboxState, active?: HTMLElement): void;
|
|
103
|
+
declare function updateComboboxAnchor(state: OuiComboboxState): void;
|
|
104
|
+
declare function updateComboboxAutocomplete(preview: OuiComboboxPreview, state: OuiComboboxState, active?: HTMLElement): void;
|
|
105
|
+
declare function updateComboboxMessage(state: OuiComboboxState, visible: number): void;
|
|
106
|
+
declare function updateComboboxPreview(preview: OuiComboboxPreview, state: OuiComboboxState, active?: HTMLElement): void;
|
|
107
|
+
declare function updateComboboxSelection(state: OuiComboboxState, active: HTMLElement | undefined, added: boolean, selected?: HTMLElement[]): void;
|
|
108
|
+
declare function updateComboboxSelectionItems(state: OuiComboboxState): void;
|
|
109
|
+
//#endregion
|
|
110
|
+
export { createComboboxAnchor, createComboboxButton, createComboboxContent, createComboboxFilter, createComboboxGroup, createComboboxHeader, createComboboxInput, createComboboxList, createComboboxMessage, createComboboxOption, createComboboxOptions, createComboboxSelection, createComboboxSelectionItem, createComboboxSelectionItems, setComboboxDisabled, setComboboxReadonly, setComboboxRequired, updateComboboxAnchor, updateComboboxAutocomplete, updateComboboxMessage, updateComboboxPreview, updateComboboxSelection, updateComboboxSelectionItems, updateComboboxTabindices };
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import { A as updateComboboxTabindices, C as setComboboxRequired, D as updateComboboxPreview, E as updateComboboxMessage, O as updateComboboxSelection, S as setComboboxReadonly, T as updateComboboxAutocomplete, _ as createComboboxOptions, b as createComboboxSelectionItems, c as createComboboxButton, d as createComboboxGroup, f as createComboboxHeader, g as createComboboxOption, h as createComboboxMessage, k as updateComboboxSelectionItems, l as createComboboxContent, m as createComboboxList, p as createComboboxInput, s as createComboboxAnchor, u as createComboboxFilter, v as createComboboxSelection, w as updateComboboxAnchor, x as setComboboxDisabled, y as createComboboxSelectionItem } from "../data.combobox-B8HMkDOh.mjs";
|
|
2
|
+
export { createComboboxAnchor, createComboboxButton, createComboboxContent, createComboboxFilter, createComboboxGroup, createComboboxHeader, createComboboxInput, createComboboxList, createComboboxMessage, createComboboxOption, createComboboxOptions, createComboboxSelection, createComboboxSelectionItem, createComboboxSelectionItems, setComboboxDisabled, setComboboxReadonly, setComboboxRequired, updateComboboxAnchor, updateComboboxAutocomplete, updateComboboxMessage, updateComboboxPreview, updateComboboxSelection, updateComboboxSelectionItems, updateComboboxTabindices };
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { I as OuiComboboxState } from "../constants.combobox-h_kyDegw.mjs";
|
|
2
|
+
//#region src/js/combobox/event.combobox.d.ts
|
|
3
|
+
declare function onComboboxClickContent(event: PointerEvent, content: HTMLElement): void;
|
|
4
|
+
declare function onComboboxClickDocument(event: PointerEvent): void;
|
|
5
|
+
declare function onComboboxEnter(state: OuiComboboxState): void;
|
|
6
|
+
declare function onComboboxEscape(state: OuiComboboxState): void;
|
|
7
|
+
declare function onComboboxFilter(type: InputEvent['inputType'], state: OuiComboboxState, manual?: boolean, emit?: boolean): void;
|
|
8
|
+
declare function onComboboxFocusout(state: OuiComboboxState): void;
|
|
9
|
+
declare function onComboboxInput(event: InputEvent): void;
|
|
10
|
+
declare function onComboboxKeydown(event: KeyboardEvent): void;
|
|
11
|
+
declare function onComboboxKeydownSelection(event: KeyboardEvent, state: OuiComboboxState, item: HTMLElement): void;
|
|
12
|
+
declare function onComboboxNavigation(event: KeyboardEvent, state: OuiComboboxState): void;
|
|
13
|
+
declare function onComboboxRemoveSelection(state: OuiComboboxState, item: HTMLElement): void;
|
|
14
|
+
declare function onComboboxSelection(state: OuiComboboxState): void;
|
|
15
|
+
declare function onComboboxTab(state: OuiComboboxState): void;
|
|
16
|
+
//#endregion
|
|
17
|
+
export { onComboboxClickContent, onComboboxClickDocument, onComboboxEnter, onComboboxEscape, onComboboxFilter, onComboboxFocusout, onComboboxInput, onComboboxKeydown, onComboboxKeydownSelection, onComboboxNavigation, onComboboxRemoveSelection, onComboboxSelection, onComboboxTab };
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import { B as onComboboxEnter, G as onComboboxKeydown, H as onComboboxFilter, J as onComboboxRemoveSelection, K as onComboboxKeydownSelection, R as onComboboxClickContent, U as onComboboxFocusout, V as onComboboxEscape, W as onComboboxInput, X as onComboboxTab, Y as onComboboxSelection, q as onComboboxNavigation, z as onComboboxClickDocument } from "../data.combobox-B8HMkDOh.mjs";
|
|
2
|
+
export { onComboboxClickContent, onComboboxClickDocument, onComboboxEnter, onComboboxEscape, onComboboxFilter, onComboboxFocusout, onComboboxInput, onComboboxKeydown, onComboboxKeydownSelection, onComboboxNavigation, onComboboxRemoveSelection, onComboboxSelection, onComboboxTab };
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { I as OuiComboboxState } from "../constants.combobox-h_kyDegw.mjs";
|
|
2
|
+
//#region src/js/combobox/form.combobox.d.ts
|
|
3
|
+
declare function updateComboboxForm(state: OuiComboboxState, values: string[], emit?: boolean): void;
|
|
4
|
+
declare function updateComboboxValidity(state: OuiComboboxState): void;
|
|
5
|
+
//#endregion
|
|
6
|
+
export { updateComboboxForm, updateComboboxValidity };
|
|
@@ -0,0 +1,195 @@
|
|
|
1
|
+
import { updateLocalizations } from "../l10n.mjs";
|
|
2
|
+
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";
|
|
4
|
+
import { getAttribute } from "@oscarpalmer/toretto/attribute";
|
|
5
|
+
import { parse } from "@oscarpalmer/atoms/string";
|
|
6
|
+
//#region src/js/combobox/index.ts
|
|
7
|
+
var OuiComboboxElement = class extends HTMLElement {
|
|
8
|
+
static formAssociated = true;
|
|
9
|
+
static observedAttributes = [
|
|
10
|
+
"max",
|
|
11
|
+
"min",
|
|
12
|
+
"required",
|
|
13
|
+
"value"
|
|
14
|
+
];
|
|
15
|
+
#internals;
|
|
16
|
+
#restored;
|
|
17
|
+
#state;
|
|
18
|
+
/**
|
|
19
|
+
* Is the combobox disabled?
|
|
20
|
+
*/
|
|
21
|
+
get disabled() {
|
|
22
|
+
return this.#state?.disabled ?? false;
|
|
23
|
+
}
|
|
24
|
+
/**
|
|
25
|
+
* Should the combobox be disabled?
|
|
26
|
+
*/
|
|
27
|
+
set disabled(value) {
|
|
28
|
+
if (typeof value === "boolean" && value !== this.disabled) setComboboxDisabled(this.#state, value);
|
|
29
|
+
}
|
|
30
|
+
/**
|
|
31
|
+
* Current filter value
|
|
32
|
+
*/
|
|
33
|
+
get filter() {
|
|
34
|
+
return this.#state.filter.element.value;
|
|
35
|
+
}
|
|
36
|
+
/**
|
|
37
|
+
* Set the filter value
|
|
38
|
+
*/
|
|
39
|
+
set filter(value) {
|
|
40
|
+
setComboboxFilter(this.#state, value);
|
|
41
|
+
}
|
|
42
|
+
/**
|
|
43
|
+
* Maximum number of selected options
|
|
44
|
+
*/
|
|
45
|
+
get max() {
|
|
46
|
+
return this.#state?.max;
|
|
47
|
+
}
|
|
48
|
+
/**
|
|
49
|
+
* Set the maximum number of selected options
|
|
50
|
+
*/
|
|
51
|
+
set max(value) {
|
|
52
|
+
setComboboxLimit("max", this.#state, value);
|
|
53
|
+
}
|
|
54
|
+
/**
|
|
55
|
+
* Minimum number of selected options
|
|
56
|
+
*/
|
|
57
|
+
get min() {
|
|
58
|
+
return this.#state?.min;
|
|
59
|
+
}
|
|
60
|
+
/**
|
|
61
|
+
* Set the minimum number of selected options
|
|
62
|
+
*/
|
|
63
|
+
set min(value) {
|
|
64
|
+
setComboboxLimit("min", this.#state, value);
|
|
65
|
+
}
|
|
66
|
+
/**
|
|
67
|
+
* Does the combobox allow multiple values?
|
|
68
|
+
*/
|
|
69
|
+
get multiple() {
|
|
70
|
+
return this.hasAttribute("multiple");
|
|
71
|
+
}
|
|
72
|
+
/**
|
|
73
|
+
* Name of the combobox
|
|
74
|
+
*/
|
|
75
|
+
get name() {
|
|
76
|
+
return getAttribute(this, "name") ?? "";
|
|
77
|
+
}
|
|
78
|
+
/**
|
|
79
|
+
* Is the combobox readonly?
|
|
80
|
+
*/
|
|
81
|
+
get readonly() {
|
|
82
|
+
return this.#state?.readonly ?? false;
|
|
83
|
+
}
|
|
84
|
+
/**
|
|
85
|
+
* Should the combobox be readonly?
|
|
86
|
+
*/
|
|
87
|
+
set readonly(value) {
|
|
88
|
+
if (typeof value === "boolean" && value !== this.readonly) setComboboxReadonly(this.#state, value);
|
|
89
|
+
}
|
|
90
|
+
/**
|
|
91
|
+
* Is the combobox required?
|
|
92
|
+
*/
|
|
93
|
+
get required() {
|
|
94
|
+
return this.#state?.required ?? false;
|
|
95
|
+
}
|
|
96
|
+
/**
|
|
97
|
+
* Should the combobox be required?
|
|
98
|
+
*/
|
|
99
|
+
set required(value) {
|
|
100
|
+
if (typeof value === "boolean" && value !== this.required) setComboboxRequired(this.#state, value);
|
|
101
|
+
}
|
|
102
|
+
/**
|
|
103
|
+
* Selected options
|
|
104
|
+
*/
|
|
105
|
+
get selected() {
|
|
106
|
+
return this.#state.options.selected.slice();
|
|
107
|
+
}
|
|
108
|
+
/**
|
|
109
|
+
* Type of combobox
|
|
110
|
+
*/
|
|
111
|
+
get type() {
|
|
112
|
+
return this.#state.type;
|
|
113
|
+
}
|
|
114
|
+
/**
|
|
115
|
+
* Current value
|
|
116
|
+
*/
|
|
117
|
+
get value() {
|
|
118
|
+
return this.#state.values.current[0];
|
|
119
|
+
}
|
|
120
|
+
/**
|
|
121
|
+
* Set the value
|
|
122
|
+
*/
|
|
123
|
+
set value(value) {
|
|
124
|
+
setComboboxValue(this.#state, value);
|
|
125
|
+
}
|
|
126
|
+
/**
|
|
127
|
+
* Current values
|
|
128
|
+
*/
|
|
129
|
+
get values() {
|
|
130
|
+
return this.#state.values.current.slice();
|
|
131
|
+
}
|
|
132
|
+
/**
|
|
133
|
+
* Set the values
|
|
134
|
+
*/
|
|
135
|
+
set values(value) {
|
|
136
|
+
setComboboxValues(this.#state, value);
|
|
137
|
+
}
|
|
138
|
+
constructor() {
|
|
139
|
+
super();
|
|
140
|
+
this.#internals = this.attachInternals();
|
|
141
|
+
}
|
|
142
|
+
attributeChangedCallback(name, _, value) {
|
|
143
|
+
if (this.#state == null) return;
|
|
144
|
+
switch (name) {
|
|
145
|
+
case "required":
|
|
146
|
+
this[name] = this.hasAttribute(name);
|
|
147
|
+
break;
|
|
148
|
+
case "max":
|
|
149
|
+
case "min":
|
|
150
|
+
setComboboxLimit(name, this.#state, value);
|
|
151
|
+
break;
|
|
152
|
+
case "value": this.value = value ?? "";
|
|
153
|
+
}
|
|
154
|
+
}
|
|
155
|
+
/**
|
|
156
|
+
* Clear all selected options
|
|
157
|
+
*/
|
|
158
|
+
clear() {
|
|
159
|
+
setComboboxValues(this.#state, []);
|
|
160
|
+
}
|
|
161
|
+
connectedCallback() {
|
|
162
|
+
if (this.#state == null) this.#initialize();
|
|
163
|
+
else attachCombobox(this.#state);
|
|
164
|
+
}
|
|
165
|
+
disconnectedCallback() {
|
|
166
|
+
if (this.#state != null) detachCombobox(this.#state);
|
|
167
|
+
}
|
|
168
|
+
formDisabledCallback(disabled) {
|
|
169
|
+
this.disabled = disabled;
|
|
170
|
+
}
|
|
171
|
+
formResetCallback() {
|
|
172
|
+
setComboboxValues(this.#state, this.#state.values.initial, false);
|
|
173
|
+
}
|
|
174
|
+
formStateRestoreCallback(state, reason) {
|
|
175
|
+
if (reason !== "restore") return;
|
|
176
|
+
const parsed = typeof state === "string" ? parse(state) : void 0;
|
|
177
|
+
if (!Array.isArray(parsed)) return;
|
|
178
|
+
if (this.#state == null) this.#restored = parsed;
|
|
179
|
+
else setComboboxValues(this.#state, parsed);
|
|
180
|
+
}
|
|
181
|
+
setLocalizations(first, second) {
|
|
182
|
+
updateLocalizations(comboboxLocalizations, typeof first === "string" ? { [first]: second } : first, this.#state.localizations);
|
|
183
|
+
}
|
|
184
|
+
#initialize() {
|
|
185
|
+
this.tabIndex = -1;
|
|
186
|
+
this.#state = createComboboxState(this, this.#internals);
|
|
187
|
+
if (this.#restored != null) {
|
|
188
|
+
setComboboxValues(this.#state, this.#restored, false);
|
|
189
|
+
this.#restored = void 0;
|
|
190
|
+
}
|
|
191
|
+
}
|
|
192
|
+
};
|
|
193
|
+
customElements.define(COMBOBOX_TAGNAME, OuiComboboxElement);
|
|
194
|
+
//#endregion
|
|
195
|
+
export { OuiComboboxElement, setComboboxLocalizations };
|
|
@@ -0,0 +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 };
|
|
@@ -0,0 +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 };
|
|
@@ -0,0 +1,2 @@
|
|
|
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 };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { I as OuiComboboxState, j as OuiComboboxLocalizations, z as OuiComboboxElement } from "../constants.combobox-h_kyDegw.mjs";
|
|
2
|
+
import { OuiLocalizations } from "../l10n.mjs";
|
|
3
|
+
//#region src/js/combobox/state.combobox.d.ts
|
|
4
|
+
declare function attachCombobox(state: OuiComboboxState): void;
|
|
5
|
+
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
|
+
};
|
|
12
|
+
//#endregion
|
|
13
|
+
export { attachCombobox, comboboxLocalizations, comboboxStates, createComboboxState, detachCombobox };
|