@oscarpalmer/oui 0.38.0 → 0.40.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/README.md +1 -1
- package/dist/css/badge.css +11 -8
- package/dist/css/button.css +106 -14
- package/dist/css/color-picker.css +555 -73
- package/dist/css/color.css +86 -86
- package/dist/css/combobox.css +98 -4
- package/dist/css/content.css +7 -6
- package/dist/css/floatable.css +1 -3
- package/dist/css/form.css +99 -6
- package/dist/css/icon.css +99 -0
- package/dist/css/listbox.css +3 -0
- package/dist/css/message.css +4 -3
- package/dist/css/mixins/button.mixins.css +1 -0
- package/dist/css/reset.css +1 -1
- package/dist/css/tabs.css +95 -3
- package/dist/css/typography.css +90 -0
- package/dist/js/color-picker/color-picker.constants.d.mts +2 -0
- package/dist/js/color-picker/color-picker.constants.mjs +60 -0
- package/dist/js/color-picker/color-picker.dom.d.mts +8 -0
- package/dist/js/color-picker/color-picker.dom.mjs +191 -0
- package/dist/js/color-picker/color-picker.event.d.mts +9 -0
- package/dist/js/color-picker/color-picker.event.mjs +2 -0
- package/dist/js/color-picker/color-picker.form.d.mts +5 -0
- package/dist/js/color-picker/color-picker.form.mjs +27 -0
- package/dist/js/color-picker/color-picker.misc.d.mts +2 -0
- package/dist/js/color-picker/color-picker.misc.mjs +2 -0
- package/dist/js/color-picker/color-picker.model.d.mts +2 -0
- package/dist/js/color-picker/color-picker.model.mjs +24 -0
- package/dist/js/color-picker/color-picker.output.d.mts +8 -0
- package/dist/js/color-picker/color-picker.output.mjs +235 -0
- package/dist/js/color-picker/color-picker.state.d.mts +8 -0
- package/dist/js/color-picker/color-picker.state.mjs +2 -0
- package/dist/js/{color-picker.d.mts → color-picker/index.d.mts} +10 -43
- package/dist/js/color-picker/index.mjs +305 -0
- package/dist/js/color-picker.constants-D1mxw_Le.d.mts +179 -0
- package/dist/js/color-picker.event-Cksj5TvS.mjs +500 -0
- package/dist/js/color-picker.misc-CtsXGrOe.d.mts +27 -0
- package/dist/js/combobox/combobox.constants.d.mts +2 -0
- package/dist/js/combobox/{constants.combobox.mjs → combobox.constants.mjs} +21 -21
- package/dist/js/combobox/combobox.dom.d.mts +26 -0
- package/dist/js/combobox/{dom.combobox.mjs → combobox.dom.mjs} +44 -37
- package/dist/js/combobox/combobox.event.d.mts +22 -0
- package/dist/js/combobox/{event.combobox.mjs → combobox.event.mjs} +1 -1
- package/dist/js/combobox/combobox.misc.d.mts +2 -0
- package/dist/js/combobox/{misc.combobox.mjs → combobox.misc.mjs} +1 -1
- package/dist/js/combobox/combobox.model.d.mts +2 -0
- package/dist/js/combobox/combobox.state.d.mts +10 -0
- package/dist/js/combobox/combobox.state.mjs +2 -0
- package/dist/js/combobox/index.d.mts +163 -2
- package/dist/js/combobox/index.mjs +53 -52
- package/dist/js/combobox.constants-DZVkMP5g.d.mts +19 -0
- package/dist/js/combobox.misc-C1tPZZDi.d.mts +22 -0
- package/dist/js/{combobox/models.combobox.d.mts → combobox.model-oDV06XCN.d.mts} +6 -6
- package/dist/js/{state.combobox-Qm3FWzYW.mjs → combobox.state-BfJ3Hxg8.mjs} +96 -82
- package/dist/js/constants.listbox-C5Ap6Ag_.d.mts +9 -0
- package/dist/js/dialog/dialog.model.d.mts +2 -0
- package/dist/js/dialog/dialog.model.mjs +11 -0
- package/dist/js/dialog/index.d.mts +12 -0
- package/dist/js/dialog/index.mjs +123 -0
- package/dist/js/dialog.model-DX2mndMh.d.mts +45 -0
- package/dist/js/floatable/floatable.embedded.d.mts +2 -2
- package/dist/js/floatable/floatable.embedded.mjs +64 -92
- package/dist/js/floatable/floatable.model.d.mts +2 -0
- package/dist/js/floatable/floatable.model.mjs +23 -0
- package/dist/js/floatable/floatable.standalone.d.mts +2 -1
- package/dist/js/floatable.embedded-MeTyXjFn.d.mts +17 -0
- package/dist/js/floatable.model-DXsQgoU7.d.mts +62 -0
- package/dist/js/focus-trap/focus-trap.embedded.d.mts +2 -2
- package/dist/js/focus-trap/focus-trap.embedded.mjs +112 -134
- package/dist/js/focus-trap/focus-trap.model.d.mts +2 -0
- package/dist/js/focus-trap/focus-trap.model.mjs +15 -0
- package/dist/js/focus-trap/focus-trap.standalone.d.mts +2 -1
- package/dist/js/focus-trap.embedded-DIU05m1z.d.mts +13 -0
- package/dist/js/{focus-trap.embedded-DR8NpZfr.d.mts → focus-trap.model-BeX6UYlw.d.mts} +16 -18
- package/dist/js/index.d.mts +26 -14
- package/dist/js/index.mjs +18 -15
- package/dist/js/internal/attributable.d.mts +2 -3
- package/dist/js/internal/attributable.mjs +3 -2
- package/dist/js/internal/draggable/draggable.model.d.mts +2 -0
- package/dist/js/internal/draggable/draggable.model.mjs +37 -0
- package/dist/js/internal/draggable/index.d.mts +13 -0
- package/dist/js/internal/{draggable.mjs → draggable/index.mjs} +83 -114
- package/dist/js/internal/listbox/listbox.constants.d.mts +7 -10
- package/dist/js/internal/listbox/listbox.constants.mjs +15 -16
- package/dist/js/internal/listbox/listbox.data.d.mts +9 -10
- package/dist/js/internal/listbox/listbox.data.mjs +1 -1
- package/dist/js/internal/listbox/listbox.dom.d.mts +19 -20
- package/dist/js/internal/listbox/listbox.dom.mjs +1 -1
- package/dist/js/internal/listbox/listbox.event.d.mts +3 -4
- package/dist/js/internal/listbox/listbox.event.mjs +23 -20
- package/dist/js/internal/listbox/listbox.form.d.mts +4 -5
- package/dist/js/internal/listbox/listbox.form.mjs +15 -12
- package/dist/js/internal/listbox/listbox.misc.d.mts +10 -11
- package/dist/js/internal/listbox/listbox.misc.mjs +1 -1
- package/dist/js/internal/listbox/listbox.model.d.mts +2 -2
- package/dist/js/internal/listbox/listbox.state.d.mts +5 -6
- package/dist/js/internal/listbox/listbox.state.mjs +19 -20
- package/dist/js/internal/misc.d.mts +5 -4
- package/dist/js/internal/misc.mjs +7 -1
- package/dist/js/internal/navigable/index.d.mts +6 -0
- package/dist/js/internal/navigable/index.mjs +125 -0
- package/dist/js/internal/navigable/navigable.model.d.mts +2 -0
- package/dist/js/internal/navigable/navigable.model.mjs +18 -0
- package/dist/js/l10n/index.d.mts +9 -0
- package/dist/js/{l10n.mjs → l10n/index.mjs} +50 -23
- package/dist/js/l10n/l10n.model.d.mts +2 -0
- package/dist/js/l10n/l10n.model.mjs +9 -0
- package/dist/js/l10n.model-D6a9frgl.d.mts +26 -0
- package/dist/js/listbox/constants.listbox.d.mts +2 -2
- package/dist/js/listbox/constants.listbox.mjs +10 -14
- package/dist/js/listbox/event.listbox.d.mts +6 -7
- package/dist/js/listbox/event.listbox.mjs +47 -1
- package/dist/js/listbox/index.d.mts +8 -6
- package/dist/js/listbox/index.mjs +47 -49
- package/dist/js/listbox/misc.listbox.d.mts +1 -1
- package/dist/js/listbox/misc.listbox.mjs +1 -1
- package/dist/js/listbox/state.listbox.d.mts +8 -10
- package/dist/js/listbox/state.listbox.mjs +2 -2
- package/dist/js/{listbox.data-C7CRa5Ya.mjs → listbox.data-BQyZGKgr.mjs} +83 -66
- package/dist/js/{listbox.model-CRReGOmu.d.mts → listbox.model-CuBOj4qe.d.mts} +15 -11
- package/dist/js/menu/index.mjs +167 -0
- package/dist/js/menu/menu.model.d.mts +33 -0
- package/dist/js/menu/menu.model.mjs +15 -0
- package/dist/js/{misc.listbox-Cyz2CRDy.mjs → misc.listbox-CjfBUbHD.mjs} +27 -69
- package/dist/js/{misc.listbox-gnoJhrTr.d.mts → misc.listbox-CtoGvXQo.d.mts} +2 -2
- package/dist/js/movable/movable.embedded.d.mts +2 -2
- package/dist/js/movable/movable.embedded.mjs +60 -72
- package/dist/js/movable/movable.model.d.mts +2 -0
- package/dist/js/movable/movable.model.mjs +12 -0
- package/dist/js/movable/movable.standalone.d.mts +2 -1
- package/dist/js/movable.embedded-DoyXLegc.d.mts +11 -0
- package/dist/js/movable.model-BHaK_mKw.d.mts +186 -0
- package/dist/js/navigable.model-BPOM8DZk.d.mts +44 -0
- package/dist/js/popover/index.d.mts +12 -0
- package/dist/js/{popover.mjs → popover/index.mjs} +40 -50
- package/dist/js/popover/popover.model.d.mts +2 -0
- package/dist/js/popover/popover.model.mjs +12 -0
- package/dist/js/popover.model-ubKNG612.d.mts +38 -0
- package/dist/js/resizable/resizable.embedded.d.mts +2 -2
- package/dist/js/resizable/resizable.embedded.mjs +44 -59
- package/dist/js/resizable/resizable.model.d.mts +2 -0
- package/dist/js/resizable/resizable.model.mjs +21 -0
- package/dist/js/resizable/resizable.standalone.d.mts +2 -1
- package/dist/js/resizable.embedded-Bf1qBUdt.d.mts +11 -0
- package/dist/js/resizable.model-BwzJcTVJ.d.mts +46 -0
- package/dist/js/sortable/sortable.embedded.d.mts +2 -2
- package/dist/js/sortable/sortable.embedded.mjs +69 -82
- package/dist/js/sortable/sortable.model.d.mts +2 -0
- package/dist/js/sortable/sortable.model.mjs +24 -0
- package/dist/js/sortable/sortable.standalone.d.mts +2 -1
- package/dist/js/sortable.embedded-DzBKAwSG.d.mts +11 -0
- package/dist/js/{splitter.d.mts → splitter/index.d.mts} +8 -7
- package/dist/js/splitter/index.mjs +284 -0
- package/dist/js/splitter/splitter.model.d.mts +2 -0
- package/dist/js/splitter/splitter.model.mjs +37 -0
- package/dist/js/splitter.model-DOLNjLVS.d.mts +57 -0
- package/dist/js/{tabs.d.mts → tabs/index.d.mts} +7 -8
- package/dist/js/{tabs.mjs → tabs/index.mjs} +58 -58
- package/dist/js/tabs/tabs.model.d.mts +2 -0
- package/dist/js/tabs/tabs.model.mjs +18 -0
- package/dist/js/tabs.model-DRBX_JtI.d.mts +40 -0
- package/dist/js/toolbar/index.mjs +27 -0
- package/dist/js/toolbar/toolbar.model.d.mts +11 -0
- package/dist/js/toolbar/toolbar.model.mjs +7 -0
- package/dist/js/tooltip/index.d.mts +19 -0
- package/dist/js/{tooltip.mjs → tooltip/index.mjs} +60 -85
- package/dist/js/tooltip/tooltip.model.d.mts +2 -0
- package/dist/js/tooltip/tooltip.model.mjs +15 -0
- package/dist/js/tooltip.model-DRkY_BsL.d.mts +37 -0
- package/package.json +43 -37
- package/dist/js/color-picker.mjs +0 -924
- package/dist/js/combobox/constants.combobox.d.mts +0 -2
- package/dist/js/combobox/dom.combobox.d.mts +0 -27
- package/dist/js/combobox/event.combobox.d.mts +0 -23
- package/dist/js/combobox/misc.combobox.d.mts +0 -2
- package/dist/js/combobox/state.combobox.d.mts +0 -12
- package/dist/js/combobox/state.combobox.mjs +0 -2
- package/dist/js/constants.combobox-DmRAMC64.d.mts +0 -26
- package/dist/js/constants.listbox-DRsXUxd3.d.mts +0 -14
- package/dist/js/dialog.d.mts +0 -47
- package/dist/js/dialog.mjs +0 -131
- package/dist/js/draggable-a6w0J1OD.d.mts +0 -154
- package/dist/js/floatable.embedded-Bct4U5Dm.d.mts +0 -69
- package/dist/js/index-DJdFlTLm.d.mts +0 -177
- package/dist/js/internal/draggable.d.mts +0 -2
- package/dist/js/internal/navigable.d.mts +0 -37
- package/dist/js/internal/navigable.mjs +0 -135
- package/dist/js/l10n-Bn-7RcwR.d.mts +0 -20
- package/dist/js/l10n.d.mts +0 -2
- package/dist/js/menu.mjs +0 -172
- package/dist/js/popover.d.mts +0 -38
- package/dist/js/resizable.embedded-3qoR0Bjm.d.mts +0 -34
- package/dist/js/splitter.mjs +0 -322
- package/dist/js/toolbar.mjs +0 -31
- package/dist/js/tooltip.d.mts +0 -45
- package/src/css/a11y.scss +0 -13
- package/src/css/badge.scss +0 -62
- package/src/css/button.scss +0 -50
- package/src/css/color-picker.scss +0 -344
- package/src/css/color.scss +0 -113
- package/src/css/combobox.scss +0 -255
- package/src/css/content.scss +0 -181
- package/src/css/flex.scss +0 -107
- package/src/css/floatable.scss +0 -155
- package/src/css/form.scss +0 -575
- package/src/css/listbox.scss +0 -121
- package/src/css/message.scss +0 -74
- package/src/css/mixins/badge.mixins.scss +0 -53
- package/src/css/mixins/button.mixins.scss +0 -112
- package/src/css/mixins/input.mixins.scss +0 -114
- package/src/css/mixins/message.mixins.scss +0 -41
- package/src/css/mixins/misc.mixins.scss +0 -48
- package/src/css/mixins/shadow.mixins.scss +0 -57
- package/src/css/reset.scss +0 -392
- package/src/css/splitter.scss +0 -89
- package/src/css/table.scss +0 -107
- package/src/css/tabs.scss +0 -74
- package/src/js/color-picker.ts +0 -1653
- package/src/js/combobox/constants.combobox.ts +0 -83
- package/src/js/combobox/dom.combobox.ts +0 -411
- package/src/js/combobox/event.combobox.ts +0 -365
- package/src/js/combobox/index.ts +0 -382
- package/src/js/combobox/misc.combobox.ts +0 -104
- package/src/js/combobox/models.combobox.ts +0 -54
- package/src/js/combobox/state.combobox.ts +0 -246
- package/src/js/dialog.ts +0 -255
- package/src/js/floatable/floatable.embedded.ts +0 -336
- package/src/js/floatable/floatable.standalone.ts +0 -6
- package/src/js/focus-trap/focus-trap.embedded.ts +0 -411
- package/src/js/focus-trap/focus-trap.standalone.ts +0 -1
- package/src/js/index.ts +0 -16
- package/src/js/internal/attributable.ts +0 -73
- package/src/js/internal/draggable.ts +0 -657
- package/src/js/internal/listbox/listbox.constants.ts +0 -25
- package/src/js/internal/listbox/listbox.data.ts +0 -287
- package/src/js/internal/listbox/listbox.dom.ts +0 -446
- package/src/js/internal/listbox/listbox.event.ts +0 -129
- package/src/js/internal/listbox/listbox.form.ts +0 -125
- package/src/js/internal/listbox/listbox.misc.ts +0 -135
- package/src/js/internal/listbox/listbox.model.ts +0 -169
- package/src/js/internal/listbox/listbox.state.ts +0 -82
- package/src/js/internal/misc.ts +0 -27
- package/src/js/internal/navigable.ts +0 -317
- package/src/js/l10n.ts +0 -192
- package/src/js/listbox/constants.listbox.ts +0 -61
- package/src/js/listbox/event.listbox.ts +0 -106
- package/src/js/listbox/index.ts +0 -364
- package/src/js/listbox/misc.listbox.ts +0 -70
- package/src/js/listbox/state.listbox.ts +0 -194
- package/src/js/menu.ts +0 -348
- package/src/js/movable/movable.embedded.ts +0 -318
- package/src/js/movable/movable.standalone.ts +0 -2
- package/src/js/popover.ts +0 -229
- package/src/js/resizable/resizable.embedded.ts +0 -413
- package/src/js/resizable/resizable.standalone.ts +0 -5
- package/src/js/sortable/sortable.embedded.ts +0 -527
- package/src/js/sortable/sortable.standalone.ts +0 -2
- package/src/js/splitter.ts +0 -583
- package/src/js/tabs.ts +0 -441
- package/src/js/toolbar.ts +0 -63
- package/src/js/tooltip.ts +0 -367
- /package/dist/js/combobox/{models.combobox.mjs → combobox.model.mjs} +0 -0
- /package/dist/js/{menu.d.mts → menu/index.d.mts} +0 -0
- /package/dist/js/{toolbar.d.mts → toolbar/index.d.mts} +0 -0
|
@@ -1,177 +0,0 @@
|
|
|
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
|
-
* Form element associated with the combobox
|
|
51
|
-
*/
|
|
52
|
-
get form(): HTMLFormElement | null;
|
|
53
|
-
/**
|
|
54
|
-
* Label elements associated with the combobox
|
|
55
|
-
*/
|
|
56
|
-
get labels(): NodeList;
|
|
57
|
-
/**
|
|
58
|
-
* Maximum number of selected options
|
|
59
|
-
*/
|
|
60
|
-
get max(): number | undefined;
|
|
61
|
-
/**
|
|
62
|
-
* Set the maximum number of selected options
|
|
63
|
-
*/
|
|
64
|
-
set max(value: number);
|
|
65
|
-
/**
|
|
66
|
-
* Minimum number of selected options
|
|
67
|
-
*/
|
|
68
|
-
get min(): number | undefined;
|
|
69
|
-
/**
|
|
70
|
-
* Set the minimum number of selected options
|
|
71
|
-
*/
|
|
72
|
-
set min(value: number);
|
|
73
|
-
/**
|
|
74
|
-
* Does the combobox allow multiple values?
|
|
75
|
-
*/
|
|
76
|
-
get multiple(): boolean;
|
|
77
|
-
/**
|
|
78
|
-
* Name of the combobox
|
|
79
|
-
*/
|
|
80
|
-
get name(): string;
|
|
81
|
-
/**
|
|
82
|
-
* Is the combobox readonly?
|
|
83
|
-
*/
|
|
84
|
-
get readonly(): boolean;
|
|
85
|
-
/**
|
|
86
|
-
* Should the combobox be readonly?
|
|
87
|
-
*/
|
|
88
|
-
set readonly(value: boolean);
|
|
89
|
-
/**
|
|
90
|
-
* Is the combobox required?
|
|
91
|
-
*/
|
|
92
|
-
get required(): boolean;
|
|
93
|
-
/**
|
|
94
|
-
* Should the combobox be required?
|
|
95
|
-
*/
|
|
96
|
-
set required(value: boolean);
|
|
97
|
-
/**
|
|
98
|
-
* Selected options
|
|
99
|
-
*/
|
|
100
|
-
get selected(): HTMLElement[];
|
|
101
|
-
/**
|
|
102
|
-
* Type of combobox
|
|
103
|
-
*/
|
|
104
|
-
get type(): OuiListboxType;
|
|
105
|
-
/**
|
|
106
|
-
* Validation message for the combobox
|
|
107
|
-
*/
|
|
108
|
-
get validationMessage(): string;
|
|
109
|
-
/**
|
|
110
|
-
* Validity state for the combobox
|
|
111
|
-
*/
|
|
112
|
-
get validity(): ValidityState;
|
|
113
|
-
/**
|
|
114
|
-
* Current value
|
|
115
|
-
*/
|
|
116
|
-
get value(): string;
|
|
117
|
-
/**
|
|
118
|
-
* Set the value
|
|
119
|
-
*/
|
|
120
|
-
set value(value: unknown);
|
|
121
|
-
/**
|
|
122
|
-
* Current values
|
|
123
|
-
*/
|
|
124
|
-
get values(): string[];
|
|
125
|
-
/**
|
|
126
|
-
* Set the values
|
|
127
|
-
*/
|
|
128
|
-
set values(values: unknown[]);
|
|
129
|
-
/**
|
|
130
|
-
* Can the combobox be validated?
|
|
131
|
-
*/
|
|
132
|
-
get willValidate(): boolean;
|
|
133
|
-
constructor();
|
|
134
|
-
attributeChangedCallback(name: string, _: string | null, value: string | null): void;
|
|
135
|
-
/**
|
|
136
|
-
* Check if the combobox is valid
|
|
137
|
-
*
|
|
138
|
-
* @returns `true` if the combobox is valid, otherwise `false`
|
|
139
|
-
*/
|
|
140
|
-
checkValidity(): boolean;
|
|
141
|
-
/**
|
|
142
|
-
* Clear all selected options
|
|
143
|
-
*/
|
|
144
|
-
clear(): void;
|
|
145
|
-
connectedCallback(): void;
|
|
146
|
-
disconnectedCallback(): void;
|
|
147
|
-
formDisabledCallback(disabled: boolean): void;
|
|
148
|
-
formResetCallback(): void;
|
|
149
|
-
formStateRestoreCallback(state: unknown, reason: unknown): void;
|
|
150
|
-
/**
|
|
151
|
-
* Check if the combobox is valid and report any validation errors
|
|
152
|
-
*
|
|
153
|
-
* @returns `true` if the combobox is valid, otherwise `false`
|
|
154
|
-
*/
|
|
155
|
-
reportValidity(): boolean;
|
|
156
|
-
/**
|
|
157
|
-
* Set a custom validation message for the combobox
|
|
158
|
-
*
|
|
159
|
-
* @param message Validation message
|
|
160
|
-
*/
|
|
161
|
-
setCustomValidity(message: string): void;
|
|
162
|
-
/**
|
|
163
|
-
* Set combobox localizations for a specific language
|
|
164
|
-
*
|
|
165
|
-
* @param language Language code
|
|
166
|
-
* @param localizations Localizations for language
|
|
167
|
-
*/
|
|
168
|
-
setLocalizations(language: string, localizations: Partial<OuiListboxLocalizations>): void;
|
|
169
|
-
/**
|
|
170
|
-
* Set combobox localizations for one or more languages
|
|
171
|
-
*
|
|
172
|
-
* @param localizations Localizations for one or more languages
|
|
173
|
-
*/
|
|
174
|
-
setLocalizations(localizations: Record<string, Partial<OuiListboxLocalizations>>): void;
|
|
175
|
-
}
|
|
176
|
-
//#endregion
|
|
177
|
-
export { setComboboxLocalizations as a, hasTextSelection as i, getComboboxAutoComplete as n, updateComboboxLocalizations as o, getComboboxId as r, OuiComboboxElement as t };
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import { a as OuiDraggableGlobals, c as addDraggable, i as OuiDraggableBound, l as getDraggableStates, n as OuiDragMovePosition, o as OuiDraggableItem, r as OuiDraggable, s as OuiDraggableState, t as CreateOuiDraggableOptions, u as removeDraggable } from "../draggable-a6w0J1OD.mjs";
|
|
2
|
-
export { CreateOuiDraggableOptions, OuiDragMovePosition, OuiDraggable, OuiDraggableBound, OuiDraggableGlobals, OuiDraggableItem, OuiDraggableState, addDraggable, getDraggableStates, removeDraggable };
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
import { AriaRole, RemovableEventListener } from "@oscarpalmer/toretto/models";
|
|
2
|
-
//#region src/js/internal/navigable.d.ts
|
|
3
|
-
declare class OuiNavigable {
|
|
4
|
-
active: OuiNavigableActive;
|
|
5
|
-
element: HTMLElement;
|
|
6
|
-
listeners: RemovableEventListener[];
|
|
7
|
-
options: OuiNavigableOptions;
|
|
8
|
-
orientation: OuiNavigableOrientation;
|
|
9
|
-
constructor(element: HTMLElement, options: OuiNavigableOptions);
|
|
10
|
-
destroy(): void;
|
|
11
|
-
navigate(index: number, focus?: boolean): void;
|
|
12
|
-
}
|
|
13
|
-
type OuiNavigableActive = {
|
|
14
|
-
element?: HTMLElement;
|
|
15
|
-
index: number;
|
|
16
|
-
};
|
|
17
|
-
type OuiNavigableCallback<ReturnType> = (event: KeyboardEvent, navigable: OuiNavigable) => ReturnType;
|
|
18
|
-
type OuiNavigableOptions = {
|
|
19
|
-
orientation?: OuiNavigableOrientation;
|
|
20
|
-
role?: AriaRole;
|
|
21
|
-
selector: string;
|
|
22
|
-
vertical: boolean;
|
|
23
|
-
onActivate?: (navigable: OuiNavigable) => void;
|
|
24
|
-
onDeactivate?: OuiNavigableCallback<void>;
|
|
25
|
-
onNavigation?: (navigable: OuiNavigable) => void;
|
|
26
|
-
onPreventNavigation?: OuiNavigableCallback<boolean>;
|
|
27
|
-
onShouldActivate?: OuiNavigableCallback<boolean>;
|
|
28
|
-
onShouldDeactivate?: OuiNavigableCallback<boolean | undefined>;
|
|
29
|
-
};
|
|
30
|
-
type OuiNavigableOrientation = 'horizontal' | 'vertical';
|
|
31
|
-
declare function getNavigable(element: HTMLElement, options: OuiNavigableOptions): OuiNavigable;
|
|
32
|
-
declare function getNavigableOrientation(element: HTMLElement, vertical: boolean, aria?: boolean): OuiNavigableOrientation;
|
|
33
|
-
declare function updateNavigableFocus(navigable: OuiNavigable, focus: boolean, items?: HTMLElement[]): void;
|
|
34
|
-
declare const NAVIGABLE_KEYS_HORIZONTAL: Set<string>;
|
|
35
|
-
declare const NAVIGABLE_KEYS_VERTICAL: Set<string>;
|
|
36
|
-
//#endregion
|
|
37
|
-
export { NAVIGABLE_KEYS_HORIZONTAL, NAVIGABLE_KEYS_VERTICAL, OuiNavigable, OuiNavigableOptions, OuiNavigableOrientation, getNavigable, getNavigableOrientation, updateNavigableFocus };
|
|
@@ -1,135 +0,0 @@
|
|
|
1
|
-
import { clamp } from "@oscarpalmer/atoms/number";
|
|
2
|
-
import { getAria, setAria, setRole } from "@oscarpalmer/toretto/aria";
|
|
3
|
-
import { getAttribute } from "@oscarpalmer/toretto/attribute";
|
|
4
|
-
import { on } from "@oscarpalmer/toretto/event";
|
|
5
|
-
import { findAncestor } from "@oscarpalmer/toretto/find";
|
|
6
|
-
import { isHTMLOrSVGElement } from "@oscarpalmer/toretto/is";
|
|
7
|
-
//#region src/js/internal/navigable.ts
|
|
8
|
-
var OuiNavigable = class {
|
|
9
|
-
active = { index: 0 };
|
|
10
|
-
element;
|
|
11
|
-
listeners;
|
|
12
|
-
options;
|
|
13
|
-
orientation;
|
|
14
|
-
constructor(element, options) {
|
|
15
|
-
this.element = element;
|
|
16
|
-
this.options = options;
|
|
17
|
-
this.listeners = [
|
|
18
|
-
on(element, "click", (event) => {
|
|
19
|
-
onClick(this, event);
|
|
20
|
-
}, { passive: false }),
|
|
21
|
-
on(element, "focusin", (event) => {
|
|
22
|
-
onFocusin(this, event);
|
|
23
|
-
}),
|
|
24
|
-
on(element, "keydown", (event) => {
|
|
25
|
-
onKeydown(this, event);
|
|
26
|
-
}, { passive: false })
|
|
27
|
-
];
|
|
28
|
-
this.orientation = options?.orientation ?? getNavigableOrientation(element, options.vertical);
|
|
29
|
-
setAria(element, "orientation", this.orientation);
|
|
30
|
-
if (options.role != null) setRole(element, options.role);
|
|
31
|
-
}
|
|
32
|
-
destroy() {
|
|
33
|
-
const listeners = this.listeners.splice(0);
|
|
34
|
-
for (const listener of listeners) listener();
|
|
35
|
-
this.active.element = void 0;
|
|
36
|
-
this.element = void 0;
|
|
37
|
-
}
|
|
38
|
-
navigate(index, focus) {
|
|
39
|
-
const items = getItems(this.element, this.options.selector);
|
|
40
|
-
if (index >= 0 && index < items.length) onNavigate(this, index, items, focus ?? false);
|
|
41
|
-
}
|
|
42
|
-
};
|
|
43
|
-
function getItems(container, selector) {
|
|
44
|
-
return [...container.querySelectorAll(selector)].filter(isValidItem);
|
|
45
|
-
}
|
|
46
|
-
function getNavigable(element, options) {
|
|
47
|
-
return new OuiNavigable(element, options);
|
|
48
|
-
}
|
|
49
|
-
function getNavigableOrientation(element, vertical, aria) {
|
|
50
|
-
const attribute = aria ?? true ? getAria(element, "orientation") : getAttribute(element, "orientation");
|
|
51
|
-
return ORIENTATIONS.has(attribute) ? attribute : vertical ? ORIENTATION_VERTICAL : ORIENTATION_HORIZONTAL;
|
|
52
|
-
}
|
|
53
|
-
function isValidItem(element) {
|
|
54
|
-
return "disabled" in element ? element.disabled !== true : true;
|
|
55
|
-
}
|
|
56
|
-
function onClick(navigable, event) {
|
|
57
|
-
const item = findAncestor(event, navigable.options.selector);
|
|
58
|
-
const items = getItems(navigable.element, navigable.options.selector);
|
|
59
|
-
const index = items.indexOf(item);
|
|
60
|
-
if (index === -1) return;
|
|
61
|
-
if (index !== navigable.active.index) onNavigate(navigable, index, items, false);
|
|
62
|
-
navigable.options.onActivate?.(navigable);
|
|
63
|
-
item.focus();
|
|
64
|
-
}
|
|
65
|
-
function onNavigate(navigable, index, items, focus) {
|
|
66
|
-
navigable.active.element = items[index];
|
|
67
|
-
navigable.active.index = index;
|
|
68
|
-
updateNavigableFocus(navigable, focus, items);
|
|
69
|
-
navigable.options.onNavigation?.(navigable);
|
|
70
|
-
}
|
|
71
|
-
function onFocusin(navigable, event) {
|
|
72
|
-
const item = findAncestor(event, navigable.options.selector);
|
|
73
|
-
if (!isHTMLOrSVGElement(item) || !isValidItem(item)) return;
|
|
74
|
-
const items = getItems(navigable.element, navigable.options.selector);
|
|
75
|
-
const index = items.indexOf(item);
|
|
76
|
-
if (index === -1) return;
|
|
77
|
-
navigable.active.element = item;
|
|
78
|
-
navigable.active.index = index;
|
|
79
|
-
updateNavigableFocus(navigable, false, items);
|
|
80
|
-
}
|
|
81
|
-
function onKeydown(navigable, event) {
|
|
82
|
-
const escaped = event.key === "Escape";
|
|
83
|
-
const stopPropagation = navigable.options.onShouldDeactivate?.(event, navigable);
|
|
84
|
-
if (escaped || stopPropagation != null) {
|
|
85
|
-
if (escaped || stopPropagation) event.stopPropagation();
|
|
86
|
-
navigable.options.onDeactivate?.(event, navigable);
|
|
87
|
-
return;
|
|
88
|
-
}
|
|
89
|
-
if (!KEYS_ALL.has(event.key)) return;
|
|
90
|
-
const mustActivate = KEYS_ACTIVATE.has(event.key);
|
|
91
|
-
const shouldActivate = navigable.options.onShouldActivate?.(event, navigable) === true;
|
|
92
|
-
if (mustActivate || shouldActivate || navigable.options.onPreventNavigation?.(event, navigable) === true) event.stopPropagation();
|
|
93
|
-
if (mustActivate || shouldActivate) {
|
|
94
|
-
navigable.options.onActivate?.(navigable);
|
|
95
|
-
return;
|
|
96
|
-
}
|
|
97
|
-
const items = getItems(navigable.element, navigable.options.selector);
|
|
98
|
-
const { length } = items;
|
|
99
|
-
if (length === 0) return;
|
|
100
|
-
event.preventDefault();
|
|
101
|
-
let index;
|
|
102
|
-
if (KEYS_ABSOLUTE.has(event.key)) index = event.key === "Home" ? 0 : items.length - 1;
|
|
103
|
-
else {
|
|
104
|
-
const direction = NAVIGABLE_KEYS_HORIZONTAL.has(event.key) ? ORIENTATION_HORIZONTAL : ORIENTATION_VERTICAL;
|
|
105
|
-
if (navigable.orientation === direction) {
|
|
106
|
-
if (navigable.active.element instanceof HTMLSelectElement) event.preventDefault();
|
|
107
|
-
index = clamp(navigable.active.index + (KEYS_NEXT.has(event.key) ? 1 : -1), 0, length - 1, true);
|
|
108
|
-
}
|
|
109
|
-
}
|
|
110
|
-
if (index != null && index !== navigable.active.index) onNavigate(navigable, index, items, true);
|
|
111
|
-
}
|
|
112
|
-
function updateNavigableFocus(navigable, focus, items) {
|
|
113
|
-
const updated = items ?? getItems(navigable.element, navigable.options.selector);
|
|
114
|
-
const { length } = updated;
|
|
115
|
-
if (length === 0) return;
|
|
116
|
-
for (let index = 0; index < length; index += 1) updated[index].tabIndex = index === navigable.active.index ? 0 : -1;
|
|
117
|
-
navigable.active.element ??= updated[navigable.active.index];
|
|
118
|
-
if (focus) navigable.active.element?.focus();
|
|
119
|
-
}
|
|
120
|
-
const KEYS_ABSOLUTE = /* @__PURE__ */ new Set(["End", "Home"]);
|
|
121
|
-
const KEYS_ACTIVATE = /* @__PURE__ */ new Set(["Enter", " "]);
|
|
122
|
-
const NAVIGABLE_KEYS_HORIZONTAL = /* @__PURE__ */ new Set(["ArrowRight", "ArrowLeft"]);
|
|
123
|
-
const NAVIGABLE_KEYS_VERTICAL = /* @__PURE__ */ new Set(["ArrowDown", "ArrowUp"]);
|
|
124
|
-
const KEYS_ALL = /* @__PURE__ */ new Set([
|
|
125
|
-
...KEYS_ABSOLUTE,
|
|
126
|
-
...KEYS_ACTIVATE,
|
|
127
|
-
...NAVIGABLE_KEYS_HORIZONTAL,
|
|
128
|
-
...NAVIGABLE_KEYS_VERTICAL
|
|
129
|
-
]);
|
|
130
|
-
const KEYS_NEXT = /* @__PURE__ */ new Set(["ArrowDown", "ArrowRight"]);
|
|
131
|
-
const ORIENTATION_HORIZONTAL = "horizontal";
|
|
132
|
-
const ORIENTATION_VERTICAL = "vertical";
|
|
133
|
-
const ORIENTATIONS = /* @__PURE__ */ new Set([ORIENTATION_HORIZONTAL, ORIENTATION_VERTICAL]);
|
|
134
|
-
//#endregion
|
|
135
|
-
export { NAVIGABLE_KEYS_HORIZONTAL, NAVIGABLE_KEYS_VERTICAL, OuiNavigable, getNavigable, getNavigableOrientation, updateNavigableFocus };
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import { GenericCallback } from "@oscarpalmer/atoms/models";
|
|
2
|
-
//#region src/js/l10n.d.ts
|
|
3
|
-
type LocalizationParameters<Localization> = Localization extends GenericCallback ? Parameters<Localization> : never;
|
|
4
|
-
declare class OuiLocalizations<Localizations extends OuiLocalizationsValues> {
|
|
5
|
-
readonly defaults: Localizations;
|
|
6
|
-
readonly keys: Set<keyof Localizations>;
|
|
7
|
-
readonly values: Record<string, Partial<Localizations>>;
|
|
8
|
-
constructor(defaults: Localizations);
|
|
9
|
-
get<Key extends keyof Localizations>(element: Element, key: Key, localizations: Record<string, Partial<Localizations>>): string | GenericCallback;
|
|
10
|
-
set(language: string, localizations: Partial<Localizations>): void;
|
|
11
|
-
set(localizations: Record<string, Partial<Localizations>>): void;
|
|
12
|
-
}
|
|
13
|
-
type OuiLocalizationsValues = Record<string, string | GenericCallback>;
|
|
14
|
-
declare function getLanguage(element: Element): string;
|
|
15
|
-
declare function getLocalization<Localizations extends OuiLocalizationsValues, Key extends keyof Localizations>(localizations: OuiLocalizations<Localizations>, element: Element, key: Key, value: Record<string, Partial<Localizations>>): Localizations[Key] | GenericCallback;
|
|
16
|
-
declare function getLocalizations<Localizations extends OuiLocalizationsValues>(defaults: Localizations): OuiLocalizations<Localizations>;
|
|
17
|
-
declare function localize<Localizations extends OuiLocalizationsValues, Key extends keyof Localizations, Localization extends Localizations[Key]>(localization: Localization, data: Record<string, unknown>, parameters: LocalizationParameters<Localization>): string;
|
|
18
|
-
declare function updateLocalizations<Localizations extends OuiLocalizationsValues>(instance: OuiLocalizations<Localizations>, values: Record<string, Partial<Localizations>>, destination: Record<string, Partial<Localizations>>, onAfter?: () => void): void;
|
|
19
|
-
//#endregion
|
|
20
|
-
export { getLocalizations as a, getLocalization as i, OuiLocalizationsValues as n, localize as o, getLanguage as r, updateLocalizations as s, OuiLocalizations as t };
|
package/dist/js/l10n.d.mts
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import { a as getLocalizations, i as getLocalization, n as OuiLocalizationsValues, o as localize, r as getLanguage, s as updateLocalizations, t as OuiLocalizations } from "./l10n-Bn-7RcwR.mjs";
|
|
2
|
-
export { OuiLocalizations, OuiLocalizationsValues, getLanguage, getLocalization, getLocalizations, localize, updateLocalizations };
|
package/dist/js/menu.mjs
DELETED
|
@@ -1,172 +0,0 @@
|
|
|
1
|
-
import { createEmbeddedFloatable, getOnBeforeToggleListener } from "./floatable/floatable.embedded.mjs";
|
|
2
|
-
import { attributable } from "./internal/attributable.mjs";
|
|
3
|
-
import { NAVIGABLE_KEYS_HORIZONTAL, NAVIGABLE_KEYS_VERTICAL, getNavigable, updateNavigableFocus } from "./internal/navigable.mjs";
|
|
4
|
-
import { setAria, setRole } from "@oscarpalmer/toretto/aria";
|
|
5
|
-
import { setAttribute, setAttributes } from "@oscarpalmer/toretto/attribute";
|
|
6
|
-
import { on } from "@oscarpalmer/toretto/event";
|
|
7
|
-
import { findAncestor } from "@oscarpalmer/toretto/find";
|
|
8
|
-
//#region src/js/menu.ts
|
|
9
|
-
var OuiMenu = class {
|
|
10
|
-
content;
|
|
11
|
-
element;
|
|
12
|
-
floatable;
|
|
13
|
-
navigable;
|
|
14
|
-
toggle;
|
|
15
|
-
get open() {
|
|
16
|
-
return this.floatable.open;
|
|
17
|
-
}
|
|
18
|
-
constructor(element, navigable) {
|
|
19
|
-
this.element = element;
|
|
20
|
-
this.navigable = navigable;
|
|
21
|
-
this.content = navigable.element;
|
|
22
|
-
this.toggle = element.querySelector(SELECTOR_MENU_TOGGLE);
|
|
23
|
-
this.floatable = createEmbeddedFloatable(this.toggle, this.content, {
|
|
24
|
-
attribute: ATTRIBUTE_MENU_POSITION,
|
|
25
|
-
position: findAncestor(element.parentElement, SELECTOR_MENU_CONTENT) == null ? "below-start" : "end-top",
|
|
26
|
-
reusable: false
|
|
27
|
-
});
|
|
28
|
-
this.navigable.listeners.push(getOnBeforeToggleListener(this.content), on(this.content, "click", (event) => {
|
|
29
|
-
event.stopPropagation();
|
|
30
|
-
if (findAncestor(event, SELECTOR_MENU_TOGGLE) != null) return;
|
|
31
|
-
const elements = document.querySelectorAll(SELECTOR_MENU_CONTENT);
|
|
32
|
-
for (const element of elements) menus.get(element)?.floatable.hide();
|
|
33
|
-
const menu = menus.get(elements[0]);
|
|
34
|
-
if (menu != null && event.pointerId === -1) updateNavigableFocus(menu.navigable, true);
|
|
35
|
-
}), on(this.content, "toggle", (event) => {
|
|
36
|
-
const expanded = event.newState === "open";
|
|
37
|
-
if (expanded) {
|
|
38
|
-
this.floatable?.update();
|
|
39
|
-
updateNavigableFocus(this.navigable, true);
|
|
40
|
-
}
|
|
41
|
-
setAria(this.toggle, "expanded", expanded);
|
|
42
|
-
}));
|
|
43
|
-
this.floatable.update();
|
|
44
|
-
initializeMenu(this);
|
|
45
|
-
updateNavigableFocus(this.navigable, false);
|
|
46
|
-
}
|
|
47
|
-
destroy() {
|
|
48
|
-
this.floatable.destroy();
|
|
49
|
-
this.navigable.destroy();
|
|
50
|
-
this.floatable = void 0;
|
|
51
|
-
this.navigable = void 0;
|
|
52
|
-
}
|
|
53
|
-
};
|
|
54
|
-
var OuiMenubar = class {
|
|
55
|
-
element;
|
|
56
|
-
navigable;
|
|
57
|
-
constructor(element, navigable) {
|
|
58
|
-
this.element = element;
|
|
59
|
-
this.navigable = navigable;
|
|
60
|
-
updateNavigableFocus(this.navigable, false);
|
|
61
|
-
}
|
|
62
|
-
destroy() {
|
|
63
|
-
this.navigable.destroy();
|
|
64
|
-
this.navigable = void 0;
|
|
65
|
-
}
|
|
66
|
-
};
|
|
67
|
-
function addInstance(instances, ctor, element, content, options) {
|
|
68
|
-
if (!instances.has(content)) instances.set(content, new ctor(element, getNavigable(content, {
|
|
69
|
-
...options,
|
|
70
|
-
onDeactivate,
|
|
71
|
-
onPreventNavigation,
|
|
72
|
-
onShouldActivate,
|
|
73
|
-
onShouldDeactivate
|
|
74
|
-
})));
|
|
75
|
-
}
|
|
76
|
-
function addMenu(element) {
|
|
77
|
-
const content = element.querySelector(SELECTOR_MENU_CONTENT);
|
|
78
|
-
const toggle = element.querySelector(SELECTOR_MENU_TOGGLE);
|
|
79
|
-
if (content != null && toggle != null) addInstance(menus, OuiMenu, element, content, {
|
|
80
|
-
selector: SELECTOR_MENU_ITEM,
|
|
81
|
-
vertical: true
|
|
82
|
-
});
|
|
83
|
-
}
|
|
84
|
-
function addMenubar(element) {
|
|
85
|
-
addInstance(menubars, OuiMenubar, element, element, {
|
|
86
|
-
role: "menubar",
|
|
87
|
-
selector: SELECTOR_MENUBAR_ITEM,
|
|
88
|
-
vertical: false
|
|
89
|
-
});
|
|
90
|
-
}
|
|
91
|
-
function getId(element, value) {
|
|
92
|
-
let { id } = element;
|
|
93
|
-
if (id == null || id.trim().length === 0) {
|
|
94
|
-
id = value == null ? `oui_menu_${++index}` : `${value}_toggle`;
|
|
95
|
-
element.id = id;
|
|
96
|
-
}
|
|
97
|
-
return id;
|
|
98
|
-
}
|
|
99
|
-
function initializeMenu(menu) {
|
|
100
|
-
const id = getId(menu.content);
|
|
101
|
-
setAttribute(menu.toggle, "popovertarget", id);
|
|
102
|
-
setAria(menu.toggle, {
|
|
103
|
-
controls: id,
|
|
104
|
-
expanded: "false",
|
|
105
|
-
haspopup: "menu"
|
|
106
|
-
});
|
|
107
|
-
setAttributes(menu.content, {
|
|
108
|
-
popover: "",
|
|
109
|
-
tabindex: "-1"
|
|
110
|
-
});
|
|
111
|
-
setRole(menu.content, "menu");
|
|
112
|
-
}
|
|
113
|
-
function onDeactivate(_, navigable) {
|
|
114
|
-
const menu = menus.get(navigable.element);
|
|
115
|
-
if (menu == null) return;
|
|
116
|
-
menu.floatable.hide();
|
|
117
|
-
const element = findAncestor(menu.element.parentElement, SELECTORS);
|
|
118
|
-
if (element == null) return;
|
|
119
|
-
const instance = menubars.get(element) ?? menus.get(element);
|
|
120
|
-
if (instance != null) updateNavigableFocus(instance.navigable, true);
|
|
121
|
-
}
|
|
122
|
-
function onPreventNavigation(_, navigable) {
|
|
123
|
-
const instance = menubars.get(navigable.element) ?? menus.get(navigable.element);
|
|
124
|
-
return findAncestor(instance?.element.parentElement, SELECTORS) != null;
|
|
125
|
-
}
|
|
126
|
-
function onShouldActivate(event, navigable) {
|
|
127
|
-
let activate = false;
|
|
128
|
-
if (menubars.has(navigable.element)) activate = navigable.orientation === "horizontal" ? NAVIGABLE_KEYS_VERTICAL.has(event.key) : NAVIGABLE_KEYS_HORIZONTAL.has(event.key);
|
|
129
|
-
else if (menus.has(navigable.element)) activate = navigable.orientation === "horizontal" ? NAVIGABLE_KEYS_VERTICAL.has(event.key) : event.key === "ArrowRight";
|
|
130
|
-
if (activate) {
|
|
131
|
-
const target = event.target instanceof HTMLElement && event.target.matches(SELECTOR_MENU_TOGGLE) ? event.target : void 0;
|
|
132
|
-
if (target == null) activate = false;
|
|
133
|
-
else target.click();
|
|
134
|
-
}
|
|
135
|
-
return activate;
|
|
136
|
-
}
|
|
137
|
-
function onShouldDeactivate(event, navigable) {
|
|
138
|
-
if (menubars.has(navigable.element)) return;
|
|
139
|
-
const menu = menus.get(navigable.element);
|
|
140
|
-
if (menu == null) return;
|
|
141
|
-
const horizontal = navigable.orientation === "horizontal";
|
|
142
|
-
const altKey = horizontal ? "ArrowDown" : "ArrowRight";
|
|
143
|
-
const baseKey = horizontal ? "ArrowUp" : "ArrowLeft";
|
|
144
|
-
if (event.key === baseKey) return findAncestor(menu.element.parentElement, SELECTOR_MENU_CONTENT) != null;
|
|
145
|
-
if (event.key === altKey && event.target instanceof HTMLElement && !event.target.hasAttribute("popovertarget")) return false;
|
|
146
|
-
}
|
|
147
|
-
function removeInstance(instances, element) {
|
|
148
|
-
instances.get(element)?.destroy();
|
|
149
|
-
instances.delete(element);
|
|
150
|
-
}
|
|
151
|
-
function removeMenu(element) {
|
|
152
|
-
removeInstance(menus, element);
|
|
153
|
-
}
|
|
154
|
-
function removeMenubar(element) {
|
|
155
|
-
removeInstance(menubars, element);
|
|
156
|
-
}
|
|
157
|
-
const ATTRIBUTE_MENU = "oui-menu";
|
|
158
|
-
const ATTRIBUTE_MENU_POSITION = "oui-menu-position";
|
|
159
|
-
const ATTRIBUTE_MENUBAR = "oui-menubar";
|
|
160
|
-
const SELECTOR_MENUBAR = `[${ATTRIBUTE_MENUBAR}]`;
|
|
161
|
-
const SELECTOR_MENUBAR_ITEM = `:scope > [${ATTRIBUTE_MENUBAR}-item], :scope > * > [${ATTRIBUTE_MENUBAR}-item]`;
|
|
162
|
-
const SELECTOR_MENU_CONTENT = `[${ATTRIBUTE_MENU}-content]`;
|
|
163
|
-
const SELECTOR_MENU_ITEM = `:scope > [${ATTRIBUTE_MENU}-item], :scope > * > [${ATTRIBUTE_MENU}-item]`;
|
|
164
|
-
const SELECTOR_MENU_TOGGLE = `[${ATTRIBUTE_MENU}-toggle]`;
|
|
165
|
-
const SELECTORS = `${SELECTOR_MENUBAR}, ${SELECTOR_MENU_CONTENT}`;
|
|
166
|
-
const menubars = /* @__PURE__ */ new WeakMap();
|
|
167
|
-
const menus = /* @__PURE__ */ new WeakMap();
|
|
168
|
-
let index = 0;
|
|
169
|
-
attributable(ATTRIBUTE_MENU, addMenu, removeMenu);
|
|
170
|
-
attributable(ATTRIBUTE_MENUBAR, addMenubar, removeMenubar);
|
|
171
|
-
//#endregion
|
|
172
|
-
export {};
|
package/dist/js/popover.d.mts
DELETED
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
import { r as OuiFloatable } from "./floatable.embedded-Bct4U5Dm.mjs";
|
|
2
|
-
import { i as OuiFocusTrap } from "./focus-trap.embedded-DR8NpZfr.mjs";
|
|
3
|
-
import { RemovableEventListener } from "@oscarpalmer/toretto/models";
|
|
4
|
-
//#region src/js/popover.d.ts
|
|
5
|
-
declare class OuiPopover {
|
|
6
|
-
#private;
|
|
7
|
-
/**
|
|
8
|
-
* Is the popover open?
|
|
9
|
-
*/
|
|
10
|
-
get open(): boolean;
|
|
11
|
-
set open(value: boolean);
|
|
12
|
-
constructor(state: OuiPopoverState);
|
|
13
|
-
/**
|
|
14
|
-
* Closes the popover
|
|
15
|
-
*/
|
|
16
|
-
hide(): void;
|
|
17
|
-
/**
|
|
18
|
-
* Opens the popover
|
|
19
|
-
*/
|
|
20
|
-
show(): void;
|
|
21
|
-
}
|
|
22
|
-
type OuiPopoverState = {
|
|
23
|
-
anchor: HTMLElement;
|
|
24
|
-
content: HTMLElement;
|
|
25
|
-
floatable: OuiFloatable;
|
|
26
|
-
focusTrap?: OuiFocusTrap;
|
|
27
|
-
listeners: RemovableEventListener[];
|
|
28
|
-
popover: OuiPopover;
|
|
29
|
-
};
|
|
30
|
-
/**
|
|
31
|
-
* Get the _OuiPopover_ for an element
|
|
32
|
-
*
|
|
33
|
-
* @param element Element to get _OuiPopover_ for
|
|
34
|
-
* @returns _OuiPopover_ instance
|
|
35
|
-
*/
|
|
36
|
-
declare function getPopover(element: HTMLElement): OuiPopover | undefined;
|
|
37
|
-
//#endregion
|
|
38
|
-
export { type OuiPopover, getPopover };
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import { StyleToggler } from "@oscarpalmer/toretto/style";
|
|
2
|
-
//#region src/js/resizable/resizable.embedded.d.ts
|
|
3
|
-
type CreateOuiResizableOptions = {
|
|
4
|
-
maximumHeight?: number;
|
|
5
|
-
maximumWidth?: number;
|
|
6
|
-
minimumHeight?: number;
|
|
7
|
-
minimumWidth?: number;
|
|
8
|
-
};
|
|
9
|
-
declare class OuiResizable {
|
|
10
|
-
#private;
|
|
11
|
-
constructor(state: OuiResizableState);
|
|
12
|
-
destroy(): void;
|
|
13
|
-
set(): void;
|
|
14
|
-
reset(): void;
|
|
15
|
-
}
|
|
16
|
-
type OuiResizableState = {
|
|
17
|
-
element: HTMLElement;
|
|
18
|
-
handle: HTMLElement;
|
|
19
|
-
height: number;
|
|
20
|
-
options: Required<CreateOuiResizableOptions>;
|
|
21
|
-
styles: StyleToggler;
|
|
22
|
-
width: number;
|
|
23
|
-
};
|
|
24
|
-
/**
|
|
25
|
-
* Creates _(or retrieves)_ a _OuiResizable_ instance for an element
|
|
26
|
-
*
|
|
27
|
-
* @param element Element to make resizable
|
|
28
|
-
* @returns _OuiResizable_ instance
|
|
29
|
-
*/
|
|
30
|
-
declare function createResizable(element: HTMLElement, options?: CreateOuiResizableOptions): OuiResizable;
|
|
31
|
-
declare const RESIZABLE_ATTRIBUTE = "oui-resizable";
|
|
32
|
-
declare const RESIZABLE_ATTRIBUTE_HANDLE = "oui-resizable-handle";
|
|
33
|
-
//#endregion
|
|
34
|
-
export { createResizable as a, RESIZABLE_ATTRIBUTE_HANDLE as i, OuiResizable as n, RESIZABLE_ATTRIBUTE as r, CreateOuiResizableOptions as t };
|