@oscarpalmer/oui 0.39.0 → 0.41.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/color-picker.css +80 -69
- package/dist/css/listbox.css +169 -0
- package/dist/js/color-picker/color-picker.constants.d.mts +2 -0
- package/dist/js/color-picker/{constants.color-picker.mjs → color-picker.constants.mjs} +7 -4
- package/dist/js/color-picker/{dom.color-picker.d.mts → color-picker.dom.d.mts} +2 -2
- package/dist/js/color-picker/{dom.color-picker.mjs → color-picker.dom.mjs} +33 -16
- package/dist/js/color-picker/{event.color-picker.d.mts → color-picker.event.d.mts} +3 -3
- package/dist/js/color-picker/color-picker.event.mjs +233 -0
- package/dist/js/color-picker/{form.color-picker.d.mts → color-picker.form.d.mts} +2 -2
- package/dist/js/color-picker/{form.color-picker.mjs → color-picker.form.mjs} +9 -8
- package/dist/js/color-picker/color-picker.misc.d.mts +2 -0
- package/dist/js/color-picker/color-picker.misc.mjs +104 -0
- package/dist/js/color-picker/color-picker.model.d.mts +2 -0
- package/dist/js/color-picker/{models.color-picker.mjs → color-picker.model.mjs} +1 -1
- package/dist/js/color-picker/{output.color-picker.d.mts → color-picker.output.d.mts} +2 -2
- package/dist/js/color-picker/{output.color-picker.mjs → color-picker.output.mjs} +19 -18
- package/dist/js/color-picker/color-picker.state.d.mts +8 -0
- package/dist/js/color-picker/color-picker.state.mjs +168 -0
- package/dist/js/color-picker/index.d.mts +172 -2
- package/dist/js/color-picker/index.mjs +66 -59
- package/dist/js/color-picker.constants-BZgXQr5o.d.mts +177 -0
- package/dist/js/color-picker.misc-BIS3R6jk.d.mts +31 -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 +25 -0
- package/dist/js/combobox/{dom.combobox.mjs → combobox.dom.mjs} +51 -49
- package/dist/js/combobox/{event.combobox.d.mts → combobox.event.d.mts} +9 -9
- 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/combobox.misc.mjs +2 -0
- package/dist/js/combobox/combobox.model.d.mts +2 -0
- package/dist/js/combobox/combobox.state.d.mts +9 -0
- package/dist/js/combobox/combobox.state.mjs +2 -0
- package/dist/js/combobox/index.d.mts +152 -2
- package/dist/js/combobox/index.mjs +54 -55
- package/dist/js/combobox.constants-Hb3bqqQJ.d.mts +19 -0
- package/dist/js/combobox.misc-DRDFk6X8.d.mts +26 -0
- package/dist/js/combobox.model-gjEI2VqZ.d.mts +46 -0
- package/dist/js/{state.combobox-BWDFHwoi.mjs → combobox.state-AstCICiH.mjs} +109 -106
- 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-HVzYWoDo.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-ncshL3Sa.d.mts +17 -0
- package/dist/js/{floatable.embedded-DQYkXt8X.d.mts → floatable.model-DXsQgoU7.d.mts} +13 -20
- package/dist/js/focus-trap/focus-trap.embedded.d.mts +2 -2
- package/dist/js/focus-trap/focus-trap.embedded.mjs +117 -138
- 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-DpcPkP7c.d.mts +13 -0
- package/dist/js/{focus-trap.embedded-CjyFQYow.d.mts → focus-trap.model-CpltX5B5.d.mts} +16 -18
- package/dist/js/index.d.mts +26 -14
- package/dist/js/index.mjs +18 -17
- package/dist/js/internal/attributable.d.mts +1 -1
- 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/index.mjs +243 -0
- package/dist/js/internal/l10n/index.d.mts +5 -0
- package/dist/js/internal/l10n/index.mjs +147 -0
- package/dist/js/internal/l10n/l10n.model.d.mts +2 -0
- package/dist/js/internal/l10n/l10n.model.mjs +12 -0
- package/dist/js/internal/misc.d.mts +3 -2
- package/dist/js/internal/misc.mjs +4 -6
- 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/internal/option-list/option-list.constants.d.mts +8 -0
- package/dist/js/internal/option-list/option-list.constants.mjs +22 -0
- package/dist/js/internal/option-list/option-list.data.d.mts +21 -0
- package/dist/js/internal/option-list/option-list.data.mjs +2 -0
- package/dist/js/internal/option-list/option-list.dom.d.mts +18 -0
- package/dist/js/internal/option-list/option-list.dom.mjs +2 -0
- package/dist/js/internal/option-list/option-list.event.d.mts +6 -0
- package/dist/js/internal/option-list/option-list.event.mjs +66 -0
- package/dist/js/internal/option-list/option-list.form.d.mts +7 -0
- package/dist/js/internal/option-list/option-list.form.mjs +53 -0
- package/dist/js/internal/option-list/option-list.misc.d.mts +13 -0
- package/dist/js/internal/option-list/option-list.misc.mjs +2 -0
- package/dist/js/internal/option-list/option-list.model.d.mts +2 -0
- package/dist/js/internal/option-list/option-list.state.d.mts +8 -0
- package/dist/js/internal/option-list/option-list.state.mjs +39 -0
- package/dist/js/l10n/index.d.mts +3 -0
- package/dist/js/l10n/index.mjs +2 -0
- package/dist/js/l10n.model-D1E1u35L.d.mts +54 -0
- package/dist/js/listbox/index.d.mts +9 -18
- package/dist/js/listbox/index.mjs +49 -52
- package/dist/js/listbox/listbox.constants.d.mts +2 -0
- package/dist/js/listbox/{constants.listbox.mjs → listbox.constants.mjs} +11 -15
- package/dist/js/listbox/listbox.dom.d.mts +5 -0
- package/dist/js/listbox/listbox.dom.mjs +2 -0
- package/dist/js/listbox/listbox.event.d.mts +9 -0
- package/dist/js/listbox/listbox.event.mjs +2 -0
- package/dist/js/listbox/listbox.misc.d.mts +2 -0
- package/dist/js/listbox/listbox.misc.mjs +2 -0
- package/dist/js/listbox/listbox.model.d.mts +2 -0
- package/dist/js/listbox/listbox.model.mjs +1 -0
- package/dist/js/listbox/listbox.state.d.mts +9 -0
- package/dist/js/listbox/listbox.state.mjs +2 -0
- package/dist/js/listbox.constants-DOBMwKup.d.mts +9 -0
- package/dist/js/listbox.misc-DwfB4Mu_.d.mts +24 -0
- package/dist/js/listbox.model-C0MYWXZe.d.mts +20 -0
- package/dist/js/listbox.state-BrN296BM.mjs +240 -0
- package/dist/js/menu/index.mjs +171 -0
- package/dist/js/menu/menu.model.d.mts +33 -0
- package/dist/js/menu/menu.model.mjs +15 -0
- package/dist/js/movable/movable.embedded.d.mts +2 -2
- package/dist/js/movable/movable.embedded.mjs +77 -86
- 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-C1bDTLGs.d.mts +11 -0
- package/dist/js/movable.model-D9nnPWKk.d.mts +186 -0
- package/dist/js/navigable.model-BqoR6iBv.d.mts +44 -0
- package/dist/js/option-list.data-CgMyUwPc.mjs +441 -0
- package/dist/js/option-list.model-CCPUlPeX.d.mts +169 -0
- package/dist/js/popover/index.d.mts +12 -0
- package/dist/js/{popover.mjs → popover/index.mjs} +41 -51
- package/dist/js/popover/popover.model.d.mts +2 -0
- package/dist/js/popover/popover.model.mjs +12 -0
- package/dist/js/popover.model-DiLdz0Hc.d.mts +38 -0
- package/dist/js/resizable/resizable.embedded.d.mts +2 -2
- package/dist/js/resizable/resizable.embedded.mjs +43 -58
- 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-BemH-7Re.d.mts +11 -0
- package/dist/js/resizable.model-YEtcC9li.d.mts +46 -0
- package/dist/js/sortable/sortable.embedded.d.mts +2 -2
- package/dist/js/sortable/sortable.embedded.mjs +111 -116
- 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-CrEGff9k.d.mts +11 -0
- package/dist/js/{splitter.d.mts → splitter/index.d.mts} +6 -4
- package/dist/js/{splitter.mjs → splitter/index.mjs} +90 -128
- package/dist/js/splitter/splitter.model.d.mts +2 -0
- package/dist/js/splitter/splitter.model.mjs +37 -0
- package/dist/js/splitter.model-C24W6eZ7.d.mts +57 -0
- package/dist/js/{tabs.d.mts → tabs/index.d.mts} +8 -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-BHPy7fPo.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} +61 -86
- package/dist/js/tooltip/tooltip.model.d.mts +2 -0
- package/dist/js/tooltip/tooltip.model.mjs +15 -0
- package/dist/js/tooltip.model-BpNStw5z.d.mts +37 -0
- package/package.json +30 -24
- package/dist/js/color-picker/constants.color-picker.d.mts +0 -2
- package/dist/js/color-picker/event.color-picker.mjs +0 -2
- package/dist/js/color-picker/misc.color-picker.d.mts +0 -2
- package/dist/js/color-picker/misc.color-picker.mjs +0 -2
- package/dist/js/color-picker/models.color-picker.d.mts +0 -2
- package/dist/js/color-picker/state.color-picker.d.mts +0 -8
- package/dist/js/color-picker/state.color-picker.mjs +0 -2
- package/dist/js/combobox/constants.combobox.d.mts +0 -2
- package/dist/js/combobox/dom.combobox.d.mts +0 -26
- package/dist/js/combobox/misc.combobox.d.mts +0 -2
- package/dist/js/combobox/misc.combobox.mjs +0 -2
- package/dist/js/combobox/models.combobox.d.mts +0 -43
- package/dist/js/combobox/state.combobox.d.mts +0 -11
- package/dist/js/combobox/state.combobox.mjs +0 -2
- package/dist/js/constants.color-picker-B-gFjL8m.d.mts +0 -364
- package/dist/js/constants.combobox-8EMRmv09.d.mts +0 -18
- package/dist/js/constants.listbox-DGnX32kv.d.mts +0 -8
- package/dist/js/dialog.d.mts +0 -47
- package/dist/js/dialog.mjs +0 -131
- package/dist/js/draggable-B5-70SZm.d.mts +0 -155
- package/dist/js/event.color-picker-BEpq0Adu.mjs +0 -485
- package/dist/js/index-C5D3-oiI.d.mts +0 -177
- package/dist/js/internal/draggable.d.mts +0 -2
- package/dist/js/internal/draggable.mjs +0 -265
- package/dist/js/internal/listbox/listbox.constants.d.mts +0 -8
- package/dist/js/internal/listbox/listbox.constants.mjs +0 -22
- package/dist/js/internal/listbox/listbox.data.d.mts +0 -19
- package/dist/js/internal/listbox/listbox.data.mjs +0 -2
- package/dist/js/internal/listbox/listbox.dom.d.mts +0 -65
- package/dist/js/internal/listbox/listbox.dom.mjs +0 -2
- package/dist/js/internal/listbox/listbox.event.d.mts +0 -4
- package/dist/js/internal/listbox/listbox.event.mjs +0 -63
- package/dist/js/internal/listbox/listbox.form.d.mts +0 -5
- package/dist/js/internal/listbox/listbox.form.mjs +0 -53
- package/dist/js/internal/listbox/listbox.misc.d.mts +0 -11
- package/dist/js/internal/listbox/listbox.misc.mjs +0 -2
- package/dist/js/internal/listbox/listbox.model.d.mts +0 -2
- package/dist/js/internal/listbox/listbox.state.d.mts +0 -6
- package/dist/js/internal/listbox/listbox.state.mjs +0 -40
- package/dist/js/internal/navigable.d.mts +0 -36
- 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/l10n.mjs +0 -80
- package/dist/js/listbox/constants.listbox.d.mts +0 -2
- package/dist/js/listbox/event.listbox.d.mts +0 -7
- package/dist/js/listbox/event.listbox.mjs +0 -2
- package/dist/js/listbox/misc.listbox.d.mts +0 -2
- package/dist/js/listbox/misc.listbox.mjs +0 -2
- package/dist/js/listbox/state.listbox.d.mts +0 -10
- package/dist/js/listbox/state.listbox.mjs +0 -2
- package/dist/js/listbox.data-DQ7-x2uY.mjs +0 -425
- package/dist/js/listbox.model-BHPA7GM4.d.mts +0 -125
- package/dist/js/menu.mjs +0 -172
- package/dist/js/misc.listbox-DKB-j0UK.mjs +0 -196
- package/dist/js/misc.listbox-mZMuYOxg.d.mts +0 -20
- package/dist/js/popover.d.mts +0 -38
- package/dist/js/resizable.embedded-dvhdfQgt.d.mts +0 -34
- package/dist/js/toolbar.mjs +0 -31
- package/dist/js/tooltip.d.mts +0 -45
- /package/dist/js/combobox/{models.combobox.mjs → combobox.model.mjs} +0 -0
- /package/dist/js/internal/{listbox/listbox.model.mjs → option-list/option-list.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,62 +1,54 @@
|
|
|
1
1
|
import { attributable } from "../internal/attributable.mjs";
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
2
|
+
import { DRAGGABLE_SYMBOL, draggableGlobals } from "../internal/draggable/draggable.model.mjs";
|
|
3
|
+
import { MOVABLE_ATTRIBUTE, MOVABLE_ATTRIBUTE_CONTAINER, MOVABLE_ATTRIBUTE_DIRECTION, MOVABLE_ATTRIBUTE_MOVING, MOVABLE_CONTAINERS, MOVABLE_MESSAGE, MOVABLE_MOVED, MOVABLE_SELECTOR_HANDLE } from "./movable.model.mjs";
|
|
4
|
+
import { addDraggable, destroyDraggable, getDraggableElement, getDraggableStates, initializeDraggable, removeDraggable } from "../internal/draggable/index.mjs";
|
|
4
5
|
import { setAttribute } from "@oscarpalmer/toretto/attribute";
|
|
6
|
+
import { dispatch, getEventPosition, on } from "@oscarpalmer/toretto/event";
|
|
5
7
|
import { isHTMLOrSVGElement } from "@oscarpalmer/toretto/is";
|
|
6
8
|
import { getStyles, setStyle, setStyles } from "@oscarpalmer/toretto/style";
|
|
9
|
+
import { noop } from "@oscarpalmer/atoms/function";
|
|
7
10
|
//#region src/js/movable/movable.embedded.ts
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
/**
|
|
50
|
-
* Destroys the _Movable_
|
|
51
|
-
*/
|
|
52
|
-
destroy() {
|
|
53
|
-
MOVED.delete(this);
|
|
54
|
-
setStyles(this.#element, this.#style);
|
|
55
|
-
this.#element = void 0;
|
|
56
|
-
this.#style = void 0;
|
|
57
|
-
super.destroy();
|
|
58
|
-
}
|
|
59
|
-
};
|
|
11
|
+
function OuiMovable(element, options) {
|
|
12
|
+
const style = getStyles(element, ["inset", "position"]);
|
|
13
|
+
this[DRAGGABLE_SYMBOL] = initializeDraggable(this, "movable", "move", MOVABLE_ATTRIBUTE, element, {
|
|
14
|
+
container: {
|
|
15
|
+
attribute: MOVABLE_ATTRIBUTE_CONTAINER,
|
|
16
|
+
map: MOVABLE_CONTAINERS,
|
|
17
|
+
onDestroy: destroyContainer,
|
|
18
|
+
onInitialize: initializeContainer
|
|
19
|
+
},
|
|
20
|
+
direction: {
|
|
21
|
+
attribute: MOVABLE_ATTRIBUTE_DIRECTION,
|
|
22
|
+
onAfter: afterDirection
|
|
23
|
+
},
|
|
24
|
+
drag: {
|
|
25
|
+
onCancel,
|
|
26
|
+
onEnd,
|
|
27
|
+
onMove,
|
|
28
|
+
onBegin: noop
|
|
29
|
+
},
|
|
30
|
+
input: options,
|
|
31
|
+
position: {
|
|
32
|
+
getOffset: getOffsetPosition,
|
|
33
|
+
getOriginal: getOriginalPosition
|
|
34
|
+
},
|
|
35
|
+
getDragged() {
|
|
36
|
+
return element;
|
|
37
|
+
},
|
|
38
|
+
getOrigin() {
|
|
39
|
+
return element;
|
|
40
|
+
}
|
|
41
|
+
}, {
|
|
42
|
+
style,
|
|
43
|
+
hasHandles: element.querySelector(MOVABLE_SELECTOR_HANDLE) != null,
|
|
44
|
+
moved: false
|
|
45
|
+
});
|
|
46
|
+
}
|
|
47
|
+
OuiMovable.prototype.destroy = destroyMovable;
|
|
48
|
+
Object.defineProperties(OuiMovable.prototype, { element: {
|
|
49
|
+
enumerable: true,
|
|
50
|
+
get: getDraggableElement
|
|
51
|
+
} });
|
|
60
52
|
function afterDirection(item) {
|
|
61
53
|
const container = item.state.container?.getBoundingClientRect();
|
|
62
54
|
if (container != null) setOffset(item.state, container);
|
|
@@ -68,58 +60,66 @@ function afterDirection(item) {
|
|
|
68
60
|
* @returns _OuiMovable_ instance
|
|
69
61
|
*/
|
|
70
62
|
function createMovable(element, options) {
|
|
71
|
-
if (!isHTMLOrSVGElement(element)) throw new TypeError(
|
|
63
|
+
if (!isHTMLOrSVGElement(element)) throw new TypeError(MOVABLE_MESSAGE);
|
|
72
64
|
return addMovable(element, options);
|
|
73
65
|
}
|
|
74
66
|
function destroyContainer(_, container, empty) {
|
|
75
67
|
if (empty) resizer.unobserve(container);
|
|
76
68
|
}
|
|
77
|
-
function
|
|
69
|
+
function destroyMovable() {
|
|
70
|
+
const { element, style } = this[DRAGGABLE_SYMBOL];
|
|
71
|
+
MOVABLE_MOVED.delete(this);
|
|
72
|
+
setStyles(element, style);
|
|
73
|
+
destroyDraggable(this);
|
|
74
|
+
}
|
|
75
|
+
function getOffsetPosition(_, __, position) {
|
|
76
|
+
const { element } = draggableGlobals;
|
|
78
77
|
return {
|
|
79
|
-
x: position.x - (
|
|
80
|
-
y: position.y - (
|
|
78
|
+
x: position.x - (element?.rectangle.left ?? 0),
|
|
79
|
+
y: position.y - (element?.rectangle.top ?? 0)
|
|
81
80
|
};
|
|
82
81
|
}
|
|
83
|
-
function getOriginalPosition(
|
|
82
|
+
function getOriginalPosition() {
|
|
83
|
+
const { element } = draggableGlobals;
|
|
84
84
|
return {
|
|
85
|
-
x:
|
|
86
|
-
y:
|
|
85
|
+
x: element?.rectangle.left ?? 0,
|
|
86
|
+
y: element?.rectangle.top ?? 0
|
|
87
87
|
};
|
|
88
88
|
}
|
|
89
89
|
function initializeContainer(item) {
|
|
90
90
|
resizer.observe(item.state.container);
|
|
91
91
|
}
|
|
92
|
-
function
|
|
93
|
-
function onCancel(globals, item) {
|
|
92
|
+
function onCancel(item) {
|
|
94
93
|
const { element, moved, style } = item.state;
|
|
95
|
-
const { x, y } =
|
|
94
|
+
const { x, y } = draggableGlobals.original ?? {
|
|
96
95
|
x: 0,
|
|
97
96
|
y: 0
|
|
98
97
|
};
|
|
99
98
|
if (moved) setStyle(element, "inset", `${y}px auto auto ${x}px`);
|
|
100
99
|
else setStyles(element, style);
|
|
101
|
-
element.removeAttribute(
|
|
100
|
+
element.removeAttribute(MOVABLE_ATTRIBUTE_MOVING);
|
|
102
101
|
}
|
|
103
|
-
function onEnd(event,
|
|
102
|
+
function onEnd(event, item, reset) {
|
|
104
103
|
const movable = item.instance;
|
|
105
104
|
const state = item.state;
|
|
106
|
-
state.element.removeAttribute(
|
|
105
|
+
state.element.removeAttribute(MOVABLE_ATTRIBUTE_MOVING);
|
|
107
106
|
if (!state.moved) {
|
|
108
107
|
state.moved = true;
|
|
109
|
-
if (state.container != null)
|
|
108
|
+
if (state.container != null) MOVABLE_MOVED.add(movable);
|
|
110
109
|
}
|
|
111
110
|
const container = state.container?.getBoundingClientRect();
|
|
112
111
|
if (container != null) setOffset(state, container);
|
|
113
112
|
if (dispatch(state.element, "oui:movable:end", { detail: {
|
|
114
|
-
from: { ...
|
|
113
|
+
from: { ...draggableGlobals.original },
|
|
115
114
|
to: getEventPosition(event)
|
|
116
|
-
} }).defaultPrevented) onCancel(
|
|
115
|
+
} }).defaultPrevented) onCancel(item);
|
|
117
116
|
reset();
|
|
118
117
|
}
|
|
119
|
-
function onMove(_,
|
|
120
|
-
|
|
118
|
+
function onMove(_, __, position) {
|
|
119
|
+
const { element, original } = draggableGlobals;
|
|
120
|
+
setAttribute(element?.node, MOVABLE_ATTRIBUTE_MOVING, "");
|
|
121
121
|
return {
|
|
122
|
-
from: { ...
|
|
122
|
+
from: { ...original },
|
|
123
123
|
to: { ...position.calculated }
|
|
124
124
|
};
|
|
125
125
|
}
|
|
@@ -127,13 +127,13 @@ function onResize(entries) {
|
|
|
127
127
|
const { length } = entries;
|
|
128
128
|
for (let index = 0; index < length; index += 1) {
|
|
129
129
|
const entry = entries[index];
|
|
130
|
-
const set =
|
|
130
|
+
const set = MOVABLE_CONTAINERS.get(entry.target);
|
|
131
131
|
if (set == null) continue;
|
|
132
132
|
for (const movable of set) reposition(movable);
|
|
133
133
|
}
|
|
134
134
|
}
|
|
135
135
|
function onScroll() {
|
|
136
|
-
for (const moved of
|
|
136
|
+
for (const moved of MOVABLE_MOVED) reposition(moved);
|
|
137
137
|
}
|
|
138
138
|
function reposition(movable) {
|
|
139
139
|
const state = getDraggableStates(movable.element)?.movable;
|
|
@@ -149,15 +149,6 @@ function setOffset(state, container) {
|
|
|
149
149
|
state.offset.y = element.top - container.top;
|
|
150
150
|
state.offset.x = element.left - container.left;
|
|
151
151
|
}
|
|
152
|
-
const ATTRIBUTE_MOVABLE = "oui-movable";
|
|
153
|
-
const ATTRIBUTE_CONTAINER = `${ATTRIBUTE_MOVABLE}-container`;
|
|
154
|
-
const ATTRIBUTE_DIRECTION = `${ATTRIBUTE_MOVABLE}-direction`;
|
|
155
|
-
const ATTRIBUTE_MOVABLE_HANDLE = `${ATTRIBUTE_MOVABLE}-handle`;
|
|
156
|
-
const ATTRIBUTE_MOVING = `${ATTRIBUTE_MOVABLE}-moving`;
|
|
157
|
-
const CONTAINERS = /* @__PURE__ */ new Map();
|
|
158
|
-
const MESSAGE = "The element must be an instance of HTMLElement or SVGElement";
|
|
159
|
-
const MOVED = /* @__PURE__ */ new Set();
|
|
160
|
-
const SELECTOR_HANDLE = `[${ATTRIBUTE_MOVABLE_HANDLE}]`;
|
|
161
152
|
const bound = {
|
|
162
153
|
constructor: OuiMovable,
|
|
163
154
|
property: "movable"
|
|
@@ -166,6 +157,6 @@ const resizer = new ResizeObserver(onResize);
|
|
|
166
157
|
const addMovable = addDraggable.bind(bound);
|
|
167
158
|
const removeMovable = removeDraggable.bind(bound);
|
|
168
159
|
on(document, "scroll", onScroll);
|
|
169
|
-
attributable(
|
|
160
|
+
attributable(MOVABLE_ATTRIBUTE, addMovable, removeMovable);
|
|
170
161
|
//#endregion
|
|
171
|
-
export {
|
|
162
|
+
export { createMovable };
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import { a as MOVABLE_ATTRIBUTE_MOVING, c as MOVABLE_MOVED, d as OuiMovableState, f as OuiMovableStyle, i as MOVABLE_ATTRIBUTE_HANDLE, l as MOVABLE_SELECTOR_HANDLE, n as MOVABLE_ATTRIBUTE_CONTAINER, o as MOVABLE_CONTAINERS, r as MOVABLE_ATTRIBUTE_DIRECTION, s as MOVABLE_MESSAGE, t as MOVABLE_ATTRIBUTE, u as OuiMovable } from "../movable.model-D9nnPWKk.mjs";
|
|
2
|
+
export { MOVABLE_ATTRIBUTE, MOVABLE_ATTRIBUTE_CONTAINER, MOVABLE_ATTRIBUTE_DIRECTION, MOVABLE_ATTRIBUTE_HANDLE, MOVABLE_ATTRIBUTE_MOVING, MOVABLE_CONTAINERS, MOVABLE_MESSAGE, MOVABLE_MOVED, MOVABLE_SELECTOR_HANDLE, OuiMovable, OuiMovableState, OuiMovableStyle };
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
//#region src/js/movable/movable.model.ts
|
|
2
|
+
const MOVABLE_ATTRIBUTE = "oui-movable";
|
|
3
|
+
const MOVABLE_ATTRIBUTE_CONTAINER = `${MOVABLE_ATTRIBUTE}-container`;
|
|
4
|
+
const MOVABLE_ATTRIBUTE_DIRECTION = `${MOVABLE_ATTRIBUTE}-direction`;
|
|
5
|
+
const MOVABLE_ATTRIBUTE_HANDLE = `${MOVABLE_ATTRIBUTE}-handle`;
|
|
6
|
+
const MOVABLE_ATTRIBUTE_MOVING = `${MOVABLE_ATTRIBUTE}-moving`;
|
|
7
|
+
const MOVABLE_CONTAINERS = /* @__PURE__ */ new Map();
|
|
8
|
+
const MOVABLE_MESSAGE = "The element must be an instance of HTMLElement or SVGElement";
|
|
9
|
+
const MOVABLE_MOVED = /* @__PURE__ */ new Set();
|
|
10
|
+
const MOVABLE_SELECTOR_HANDLE = `[${MOVABLE_ATTRIBUTE_HANDLE}]`;
|
|
11
|
+
//#endregion
|
|
12
|
+
export { MOVABLE_ATTRIBUTE, MOVABLE_ATTRIBUTE_CONTAINER, MOVABLE_ATTRIBUTE_DIRECTION, MOVABLE_ATTRIBUTE_HANDLE, MOVABLE_ATTRIBUTE_MOVING, MOVABLE_CONTAINERS, MOVABLE_MESSAGE, MOVABLE_MOVED, MOVABLE_SELECTOR_HANDLE };
|
|
@@ -1,2 +1,3 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { p as CreateOuiDraggableOptions, u as OuiMovable } from "../movable.model-D9nnPWKk.mjs";
|
|
2
|
+
import { t as createMovable } from "../movable.embedded-C1bDTLGs.mjs";
|
|
2
3
|
export { type CreateOuiDraggableOptions as CreateOuiMovableOptions, type OuiMovable, createMovable };
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { p as CreateOuiDraggableOptions, u as OuiMovable } from "./movable.model-D9nnPWKk.mjs";
|
|
2
|
+
//#region src/js/movable/movable.embedded.d.ts
|
|
3
|
+
/**
|
|
4
|
+
* Creates _(or retrieves)_ a _OuiMovable_ instance for an element
|
|
5
|
+
*
|
|
6
|
+
* @param element Element to make movable
|
|
7
|
+
* @returns _OuiMovable_ instance
|
|
8
|
+
*/
|
|
9
|
+
declare function createMovable(element: Element, options?: CreateOuiDraggableOptions): OuiMovable;
|
|
10
|
+
//#endregion
|
|
11
|
+
export { createMovable as t };
|
|
@@ -0,0 +1,186 @@
|
|
|
1
|
+
import { StyleToggler } from "@oscarpalmer/toretto/style";
|
|
2
|
+
import { PlainObject } from "@oscarpalmer/atoms/models";
|
|
3
|
+
import { EventPosition } from "@oscarpalmer/toretto/models";
|
|
4
|
+
//#region src/js/sortable/sortable.model.d.ts
|
|
5
|
+
type OuiSortable = {
|
|
6
|
+
destroy(): void;
|
|
7
|
+
} & OuiDraggable<OuiSortableState>;
|
|
8
|
+
type OuiSortablePlaceholder = {
|
|
9
|
+
drag: OuiSortablePlaceholderDrag;
|
|
10
|
+
position: Element | undefined;
|
|
11
|
+
};
|
|
12
|
+
type OuiSortablePlaceholderDrag = {
|
|
13
|
+
custom: Element | SVGElement | undefined;
|
|
14
|
+
default: Element | undefined;
|
|
15
|
+
};
|
|
16
|
+
type OuiSortableState = {
|
|
17
|
+
connections: string | null | undefined;
|
|
18
|
+
origin?: Element;
|
|
19
|
+
};
|
|
20
|
+
declare const SORTABLE_ATTRIBUTE = "oui-sortable";
|
|
21
|
+
declare const SORTABLE_ATTRIBUTE_ACTIVE: string;
|
|
22
|
+
declare const SORTABLE_ATTRIBUTE_CONNECTIONS: string;
|
|
23
|
+
declare const SORTABLE_ATTRIBUTE_CONTAINER: string;
|
|
24
|
+
declare const SORTABLE_ATTRIBUTE_DIRECTION: string;
|
|
25
|
+
declare const SORTABLE_ATTRIBUTE_HORIZONTAL: string;
|
|
26
|
+
declare const SORTABLE_ATTRIBUTE_ORIGIN: string;
|
|
27
|
+
declare const SORTABLE_ATTRIBUTE_PLACEHOLDER_DRAG: string;
|
|
28
|
+
declare const SORTABLE_ATTRIBUTE_PLACEHOLDER_POSITION: string;
|
|
29
|
+
declare const SORTABLE_ATTRIBUTE_VERTICAL: string;
|
|
30
|
+
declare const SORTABLE_CONTAINERS: Map<HTMLElement, Set<OuiSortable>>;
|
|
31
|
+
declare const SORTABLE_MESSAGE = "The element must be an instance of HTMLElement or SVGElement";
|
|
32
|
+
declare const SORTABLE_SELECTOR: string;
|
|
33
|
+
declare const SORTABLE_SELECTOR_ITEM: string;
|
|
34
|
+
declare const sortablePlaceholder: OuiSortablePlaceholder;
|
|
35
|
+
//#endregion
|
|
36
|
+
//#region src/js/internal/draggable/draggable.model.d.ts
|
|
37
|
+
type CreateOuiDraggableOptions = {
|
|
38
|
+
/**
|
|
39
|
+
* Container to hold the draggable element and restrict its movement within. Can be `body`, `document`, `window`, a _CSS_ selector, or an element. _(If not provided, the draggable element will not have any constraints)_
|
|
40
|
+
*/
|
|
41
|
+
container?: string | Element;
|
|
42
|
+
/**
|
|
43
|
+
* Direction in which the element can be dragged. _(If not provided, the element can be dragged in any direction)_
|
|
44
|
+
*/
|
|
45
|
+
direction?: OuiDraggableDirection;
|
|
46
|
+
};
|
|
47
|
+
type OuiDraggableDirection = "horizontal" | "vertical" | "x" | "y";
|
|
48
|
+
interface OuiDraggable<ExtraState extends PlainObject> {
|
|
49
|
+
[DRAGGABLE_SYMBOL]: OuiDraggableState<ExtraState>;
|
|
50
|
+
get element(): Element;
|
|
51
|
+
destroy(): void;
|
|
52
|
+
}
|
|
53
|
+
type OuiDragBegin<State extends PlainObject> = (event: MouseEvent | TouchEvent, item: OuiDraggableItem<State>, element: Element, handle: Element, position: EventPosition) => void;
|
|
54
|
+
type OuiDragCancel<State extends PlainObject> = (item: OuiDraggableItem<State>) => void;
|
|
55
|
+
type OuiDragEnd<State extends PlainObject> = (event: MouseEvent | TouchEvent, item: OuiDraggableItem<State>, reset: () => void) => void;
|
|
56
|
+
type OuiDragMove<State extends PlainObject> = (event: MouseEvent | TouchEvent, item: OuiDraggableItem<State>, position: OuiDragMovePosition) => PlainObject | undefined;
|
|
57
|
+
type OuiDragMovePosition = {
|
|
58
|
+
calculated: EventPosition;
|
|
59
|
+
original: EventPosition;
|
|
60
|
+
};
|
|
61
|
+
type OuiDraggableBound<Property extends keyof OuiDraggableInstances = keyof OuiDraggableInstances, Instance extends OuiDraggableInstances[Property] = OuiDraggableInstances[Property]> = {
|
|
62
|
+
constructor: new (element: Element, options?: CreateOuiDraggableOptions) => Instance;
|
|
63
|
+
property: Property;
|
|
64
|
+
};
|
|
65
|
+
type OuiDraggableGlobals = {
|
|
66
|
+
container?: DOMRect;
|
|
67
|
+
element?: OuiDraggableGlobalsElement;
|
|
68
|
+
instances: WeakMap<Element, OuiDraggableInstances>;
|
|
69
|
+
offset?: EventPosition;
|
|
70
|
+
original?: EventPosition;
|
|
71
|
+
states: WeakMap<Element, OuiDraggableStates>;
|
|
72
|
+
};
|
|
73
|
+
type OuiDraggableGlobalsElement = {
|
|
74
|
+
node: Element;
|
|
75
|
+
rectangle: DOMRect;
|
|
76
|
+
};
|
|
77
|
+
type OuiDraggableInstances = {
|
|
78
|
+
movable?: OuiMovable;
|
|
79
|
+
sortable?: OuiSortable;
|
|
80
|
+
};
|
|
81
|
+
type OuiDraggableItem<ExtraState extends PlainObject> = {
|
|
82
|
+
instance: OuiDraggable<ExtraState>;
|
|
83
|
+
state: OuiDraggableState<ExtraState>;
|
|
84
|
+
};
|
|
85
|
+
type OuiDraggableOptions<ExtraState extends PlainObject> = {
|
|
86
|
+
container: OuiDraggableOptionsContainer<ExtraState>;
|
|
87
|
+
direction: OuiDraggableOptionsDirection<ExtraState>;
|
|
88
|
+
drag: OuiDraggableOptionsDrag<ExtraState>;
|
|
89
|
+
input?: CreateOuiDraggableOptions;
|
|
90
|
+
position: OuiDraggableOptionsPosition<ExtraState>;
|
|
91
|
+
getDragged(): Element;
|
|
92
|
+
getOrigin(): Element | undefined;
|
|
93
|
+
};
|
|
94
|
+
type OuiDraggableOptionsContainer<ExtraState extends PlainObject> = {
|
|
95
|
+
attribute: string;
|
|
96
|
+
map: Map<Element, Set<OuiDraggable<ExtraState>>>;
|
|
97
|
+
onDestroy?: OuiDraggableOptionsContainerOnDestroy<ExtraState>;
|
|
98
|
+
onInitialize?: OuiDraggableOptionsContainerOnInitialize<ExtraState>;
|
|
99
|
+
};
|
|
100
|
+
type OuiDraggableOptionsContainerOnDestroy<ExtraState extends PlainObject> = (item: OuiDraggableItem<ExtraState>, container: Element, empty: boolean) => void;
|
|
101
|
+
type OuiDraggableOptionsContainerOnInitialize<ExtraState extends PlainObject> = (item: OuiDraggableItem<ExtraState>) => void;
|
|
102
|
+
type OuiDraggableOptionsDirection<ExtraState extends PlainObject> = {
|
|
103
|
+
attribute: string;
|
|
104
|
+
onAfter?: OuiDraggableOptionsDirectionOnAfter<ExtraState>;
|
|
105
|
+
};
|
|
106
|
+
type OuiDraggableOptionsDirectionOnAfter<ExtraState extends PlainObject> = (item: OuiDraggableItem<ExtraState>) => void;
|
|
107
|
+
type OuiDraggableOptionsDrag<ExtraState extends PlainObject> = {
|
|
108
|
+
onBegin: OuiDragBegin<ExtraState>;
|
|
109
|
+
onCancel: OuiDragCancel<ExtraState>;
|
|
110
|
+
onEnd: OuiDragEnd<ExtraState>;
|
|
111
|
+
onMove: OuiDragMove<ExtraState>;
|
|
112
|
+
};
|
|
113
|
+
type OuiDraggableOptionsPosition<ExtraState extends PlainObject> = {
|
|
114
|
+
getOffset: OuiDraggableOptionsPositionGetOffset<ExtraState>;
|
|
115
|
+
getOriginal: OuiDraggableOptionsPositionGetOriginal<ExtraState>;
|
|
116
|
+
};
|
|
117
|
+
type OuiDraggableOptionsPositionGetOffset<ExtraState extends PlainObject> = (item: OuiDraggableItem<ExtraState>, element: Element, position: EventPosition) => EventPosition;
|
|
118
|
+
type OuiDraggableOptionsPositionGetOriginal<ExtraState extends PlainObject> = (item: OuiDraggableItem<ExtraState>, position: EventPosition) => EventPosition;
|
|
119
|
+
type OuiDraggableState<ExtraState extends PlainObject> = {
|
|
120
|
+
attribute: string;
|
|
121
|
+
container?: Element;
|
|
122
|
+
destroyed: boolean;
|
|
123
|
+
element: Element;
|
|
124
|
+
hasHandles?: boolean;
|
|
125
|
+
horizontal: boolean;
|
|
126
|
+
name: keyof OuiDraggableStates;
|
|
127
|
+
options: OuiDraggableOptions<ExtraState>;
|
|
128
|
+
styling: StyleToggler;
|
|
129
|
+
vertical: boolean;
|
|
130
|
+
} & ExtraState;
|
|
131
|
+
type OuiDraggableStates = {
|
|
132
|
+
movable?: OuiDraggableState<{}>;
|
|
133
|
+
sortable?: OuiDraggableState<{}>;
|
|
134
|
+
};
|
|
135
|
+
declare const DRAGGABLE_ATTRIBUTE_MOVABLE = "oui-movable";
|
|
136
|
+
declare const DRAGGABLE_ATTRIBUTE_SORTABLE = "oui-sortable";
|
|
137
|
+
declare const DRAGGABLE_KEY_ESCAPE = "Escape";
|
|
138
|
+
declare const DRAGGABLE_SELECTOR: string;
|
|
139
|
+
declare const DRAGGABLE_SELECTOR_MOVABLE_HANDLE: string;
|
|
140
|
+
declare const DRAGGABLE_SELECTOR_SORTABLE_HANDLE: string;
|
|
141
|
+
declare const DRAGGABLE_SELECTOR_SORTABLE_ITEM: string;
|
|
142
|
+
declare const DRAGGABLE_SYMBOL: unique symbol;
|
|
143
|
+
declare const draggableContainers: Set<string>;
|
|
144
|
+
declare const draggableHorizontals: Set<OuiDraggableDirection>;
|
|
145
|
+
declare const draggableProperties: Record<keyof OuiDraggableInstances, keyof OuiDraggableInstances>;
|
|
146
|
+
declare const draggableGlobals: OuiDraggableGlobals;
|
|
147
|
+
declare const draggableStyles: {
|
|
148
|
+
touchAction: string;
|
|
149
|
+
userSelect: string;
|
|
150
|
+
webkitUserSelect: string;
|
|
151
|
+
};
|
|
152
|
+
declare const draggableStyleToggler: StyleToggler;
|
|
153
|
+
declare const draggableVerticals: Set<OuiDraggableDirection>;
|
|
154
|
+
//#endregion
|
|
155
|
+
//#region src/js/movable/movable.model.d.ts
|
|
156
|
+
type OuiMovable = {
|
|
157
|
+
/**
|
|
158
|
+
* The movable element
|
|
159
|
+
*/
|
|
160
|
+
get element(): Element;
|
|
161
|
+
/**
|
|
162
|
+
* Destroy the movable
|
|
163
|
+
*/
|
|
164
|
+
destroy(): void;
|
|
165
|
+
} & OuiDraggable<OuiMovableState>;
|
|
166
|
+
type OuiMovableState = {
|
|
167
|
+
hasHandles?: boolean;
|
|
168
|
+
moved: boolean;
|
|
169
|
+
offset?: Partial<EventPosition>;
|
|
170
|
+
style: OuiMovableStyle;
|
|
171
|
+
};
|
|
172
|
+
type OuiMovableStyle = {
|
|
173
|
+
inset?: string;
|
|
174
|
+
position?: string;
|
|
175
|
+
};
|
|
176
|
+
declare const MOVABLE_ATTRIBUTE = "oui-movable";
|
|
177
|
+
declare const MOVABLE_ATTRIBUTE_CONTAINER: string;
|
|
178
|
+
declare const MOVABLE_ATTRIBUTE_DIRECTION: string;
|
|
179
|
+
declare const MOVABLE_ATTRIBUTE_HANDLE: string;
|
|
180
|
+
declare const MOVABLE_ATTRIBUTE_MOVING: string;
|
|
181
|
+
declare const MOVABLE_CONTAINERS: Map<Element, Set<OuiMovable>>;
|
|
182
|
+
declare const MOVABLE_MESSAGE = "The element must be an instance of HTMLElement or SVGElement";
|
|
183
|
+
declare const MOVABLE_MOVED: Set<OuiMovable>;
|
|
184
|
+
declare const MOVABLE_SELECTOR_HANDLE: string;
|
|
185
|
+
//#endregion
|
|
186
|
+
export { OuiSortable as $, OuiDraggableGlobals as A, OuiDraggableOptionsDrag as B, OuiDragCancel as C, OuiDraggable as D, OuiDragMovePosition as E, OuiDraggableOptionsContainer as F, OuiDraggableStates as G, OuiDraggableOptionsPositionGetOffset as H, OuiDraggableOptionsContainerOnDestroy as I, draggableHorizontals as J, draggableContainers as K, OuiDraggableOptionsContainerOnInitialize as L, OuiDraggableInstances as M, OuiDraggableItem as N, OuiDraggableBound as O, OuiDraggableOptions as P, draggableVerticals as Q, OuiDraggableOptionsDirection as R, OuiDragBegin as S, OuiDragMove as T, OuiDraggableOptionsPositionGetOriginal as U, OuiDraggableOptionsPosition as V, OuiDraggableState as W, draggableStyleToggler as X, draggableProperties as Y, draggableStyles as Z, DRAGGABLE_SELECTOR as _, sortablePlaceholder as _t, MOVABLE_ATTRIBUTE_MOVING as a, SORTABLE_ATTRIBUTE_CONNECTIONS as at, DRAGGABLE_SELECTOR_SORTABLE_ITEM as b, MOVABLE_MOVED as c, SORTABLE_ATTRIBUTE_HORIZONTAL as ct, OuiMovableState as d, SORTABLE_ATTRIBUTE_PLACEHOLDER_POSITION as dt, OuiSortablePlaceholder as et, OuiMovableStyle as f, SORTABLE_ATTRIBUTE_VERTICAL as ft, DRAGGABLE_KEY_ESCAPE as g, SORTABLE_SELECTOR_ITEM as gt, DRAGGABLE_ATTRIBUTE_SORTABLE as h, SORTABLE_SELECTOR as ht, MOVABLE_ATTRIBUTE_HANDLE as i, SORTABLE_ATTRIBUTE_ACTIVE as it, OuiDraggableGlobalsElement as j, OuiDraggableDirection as k, MOVABLE_SELECTOR_HANDLE as l, SORTABLE_ATTRIBUTE_ORIGIN as lt, DRAGGABLE_ATTRIBUTE_MOVABLE as m, SORTABLE_MESSAGE as mt, MOVABLE_ATTRIBUTE_CONTAINER as n, OuiSortableState as nt, MOVABLE_CONTAINERS as o, SORTABLE_ATTRIBUTE_CONTAINER as ot, CreateOuiDraggableOptions as p, SORTABLE_CONTAINERS as pt, draggableGlobals as q, MOVABLE_ATTRIBUTE_DIRECTION as r, SORTABLE_ATTRIBUTE as rt, MOVABLE_MESSAGE as s, SORTABLE_ATTRIBUTE_DIRECTION as st, MOVABLE_ATTRIBUTE as t, OuiSortablePlaceholderDrag as tt, OuiMovable as u, SORTABLE_ATTRIBUTE_PLACEHOLDER_DRAG as ut, DRAGGABLE_SELECTOR_MOVABLE_HANDLE as v, OuiDragEnd as w, DRAGGABLE_SYMBOL as x, DRAGGABLE_SELECTOR_SORTABLE_HANDLE as y, OuiDraggableOptionsDirectionOnAfter as z };
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { AriaRole, RemovableEventListener } from "@oscarpalmer/toretto/models";
|
|
2
|
+
//#region src/js/internal/navigable/navigable.model.d.ts
|
|
3
|
+
type OuiNavigable = {
|
|
4
|
+
[NAVIGABLE_SYMBOL]: OuiNavigableState;
|
|
5
|
+
destroy(): void;
|
|
6
|
+
navigate(index: number, focus?: boolean): void;
|
|
7
|
+
};
|
|
8
|
+
type OuiNavigableActive = {
|
|
9
|
+
element?: HTMLElement;
|
|
10
|
+
index: number;
|
|
11
|
+
};
|
|
12
|
+
type OuiNavigableCallback<ReturnType> = (event: KeyboardEvent, navigable: OuiNavigable) => ReturnType;
|
|
13
|
+
type OuiNavigableOptions = {
|
|
14
|
+
orientation?: OuiNavigableOrientation;
|
|
15
|
+
role?: AriaRole;
|
|
16
|
+
selector: string;
|
|
17
|
+
vertical: boolean;
|
|
18
|
+
onActivate?: (navigable: OuiNavigable) => void;
|
|
19
|
+
onDeactivate?: OuiNavigableCallback<void>;
|
|
20
|
+
onNavigation?: (navigable: OuiNavigable) => void;
|
|
21
|
+
onPreventNavigation?: OuiNavigableCallback<boolean>;
|
|
22
|
+
onShouldActivate?: OuiNavigableCallback<boolean>;
|
|
23
|
+
onShouldDeactivate?: OuiNavigableCallback<boolean | undefined>;
|
|
24
|
+
};
|
|
25
|
+
type OuiNavigableOrientation = "horizontal" | "vertical";
|
|
26
|
+
type OuiNavigableState = {
|
|
27
|
+
active: OuiNavigableActive;
|
|
28
|
+
element: Element;
|
|
29
|
+
listeners: RemovableEventListener[];
|
|
30
|
+
options: OuiNavigableOptions;
|
|
31
|
+
orientation: OuiNavigableOrientation;
|
|
32
|
+
};
|
|
33
|
+
declare const NAVIGABLE_KEYS_ABSOLUTE: Set<string>;
|
|
34
|
+
declare const NAVIGABLE_KEYS_ACTIVATE: Set<string>;
|
|
35
|
+
declare const NAVIGABLE_KEYS_HORIZONTAL: Set<string>;
|
|
36
|
+
declare const NAVIGABLE_KEYS_VERTICAL: Set<string>;
|
|
37
|
+
declare const NAVIGABLE_KEYS_ALL: Set<string>;
|
|
38
|
+
declare const NAVIGABLE_KEYS_NEXT: Set<string>;
|
|
39
|
+
declare const NAVIGABLE_ORIENTATION_HORIZONTAL: OuiNavigableOrientation;
|
|
40
|
+
declare const NAVIGABLE_ORIENTATION_VERTICAL: OuiNavigableOrientation;
|
|
41
|
+
declare const NAVIGABLE_ORIENTATIONS: Set<OuiNavigableOrientation>;
|
|
42
|
+
declare const NAVIGABLE_SYMBOL: unique symbol;
|
|
43
|
+
//#endregion
|
|
44
|
+
export { NAVIGABLE_KEYS_NEXT as a, NAVIGABLE_ORIENTATION_HORIZONTAL as c, OuiNavigable as d, OuiNavigableActive as f, OuiNavigableState as g, OuiNavigableOrientation as h, NAVIGABLE_KEYS_HORIZONTAL as i, NAVIGABLE_ORIENTATION_VERTICAL as l, OuiNavigableOptions as m, NAVIGABLE_KEYS_ACTIVATE as n, NAVIGABLE_KEYS_VERTICAL as o, OuiNavigableCallback as p, NAVIGABLE_KEYS_ALL as r, NAVIGABLE_ORIENTATIONS as s, NAVIGABLE_KEYS_ABSOLUTE as t, NAVIGABLE_SYMBOL as u };
|