base-ui-vue 0.1.0 → 0.2.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 +41 -1
- package/dist/button/Button.cjs +53 -12
- package/dist/button/Button.cjs.map +1 -1
- package/dist/button/Button.js +26 -15
- package/dist/button/Button.js.map +1 -1
- package/dist/button/ToolbarButton.cjs +367 -0
- package/dist/button/ToolbarButton.cjs.map +1 -0
- package/dist/button/ToolbarButton.js +320 -0
- package/dist/button/ToolbarButton.js.map +1 -0
- package/dist/button/ToolbarButtonDataAttributes.cjs +27 -0
- package/dist/button/ToolbarButtonDataAttributes.cjs.map +1 -0
- package/dist/button/ToolbarButtonDataAttributes.js +21 -0
- package/dist/button/ToolbarButtonDataAttributes.js.map +1 -0
- package/dist/checkbox/index.cjs +1173 -0
- package/dist/checkbox/index.cjs.map +1 -0
- package/dist/checkbox/index.js +1048 -0
- package/dist/checkbox/index.js.map +1 -0
- package/dist/checkbox-group/CheckboxGroup.cjs +629 -0
- package/dist/checkbox-group/CheckboxGroup.cjs.map +1 -0
- package/dist/checkbox-group/CheckboxGroup.js +540 -0
- package/dist/checkbox-group/CheckboxGroup.js.map +1 -0
- package/dist/checkbox-group/CheckboxGroupDataAttributes.cjs +18 -0
- package/dist/checkbox-group/CheckboxGroupDataAttributes.cjs.map +1 -0
- package/dist/checkbox-group/CheckboxGroupDataAttributes.js +12 -0
- package/dist/checkbox-group/CheckboxGroupDataAttributes.js.map +1 -0
- package/dist/composite/composite.cjs +167 -0
- package/dist/composite/composite.cjs.map +1 -1
- package/dist/composite/composite.js +96 -1
- package/dist/composite/composite.js.map +1 -1
- package/dist/composite/constants.cjs +12 -0
- package/dist/composite/constants.cjs.map +1 -0
- package/dist/composite/constants.js +6 -0
- package/dist/composite/constants.js.map +1 -0
- package/dist/control/FieldControl.cjs +18 -343
- package/dist/control/FieldControl.cjs.map +1 -1
- package/dist/control/FieldControl.js +14 -285
- package/dist/control/FieldControl.js.map +1 -1
- package/dist/control/SliderControl.cjs +636 -0
- package/dist/control/SliderControl.cjs.map +1 -0
- package/dist/control/SliderControl.js +553 -0
- package/dist/control/SliderControl.js.map +1 -0
- package/dist/control/SliderControlDataAttributes.cjs +47 -0
- package/dist/control/SliderControlDataAttributes.cjs.map +1 -0
- package/dist/control/SliderControlDataAttributes.js +41 -0
- package/dist/control/SliderControlDataAttributes.js.map +1 -0
- package/dist/csp-provider/CSPContext.cjs +32 -0
- package/dist/csp-provider/CSPContext.cjs.map +1 -0
- package/dist/csp-provider/CSPContext.js +21 -0
- package/dist/csp-provider/CSPContext.js.map +1 -0
- package/dist/csp-provider/CSPProvider.cjs +46 -0
- package/dist/csp-provider/CSPProvider.cjs.map +1 -0
- package/dist/csp-provider/CSPProvider.js +41 -0
- package/dist/csp-provider/CSPProvider.js.map +1 -0
- package/dist/description/FieldDescription.cjs +5 -5
- package/dist/description/FieldDescription.cjs.map +1 -1
- package/dist/description/FieldDescription.js +1 -1
- package/dist/direction-provider/DirectionProvider.cjs +2 -2
- package/dist/direction-provider/DirectionProvider.cjs.map +1 -1
- package/dist/direction-provider/DirectionProvider.js +1 -1
- package/dist/error/FieldError.cjs +10 -288
- package/dist/error/FieldError.cjs.map +1 -1
- package/dist/error/FieldError.js +4 -246
- package/dist/error/FieldError.js.map +1 -1
- package/dist/form/Form.cjs +5 -4
- package/dist/form/Form.cjs.map +1 -1
- package/dist/form/Form.js +5 -4
- package/dist/form/Form.js.map +1 -1
- package/dist/group/ToolbarGroup.cjs +92 -0
- package/dist/group/ToolbarGroup.cjs.map +1 -0
- package/dist/group/ToolbarGroup.js +87 -0
- package/dist/group/ToolbarGroup.js.map +1 -0
- package/dist/group/ToolbarGroupDataAttributes.cjs +23 -0
- package/dist/group/ToolbarGroupDataAttributes.cjs.map +1 -0
- package/dist/group/ToolbarGroupDataAttributes.js +17 -0
- package/dist/group/ToolbarGroupDataAttributes.js.map +1 -0
- package/dist/header/AccordionHeader.cjs +2 -2
- package/dist/header/AccordionHeader.js +1 -1
- package/dist/image/AvatarImage.cjs +4 -4
- package/dist/image/AvatarImage.cjs.map +1 -1
- package/dist/image/AvatarImage.js +1 -1
- package/dist/index.cjs +80 -10
- package/dist/index.d.cts +2751 -612
- package/dist/index.d.cts.map +1 -1
- package/dist/index.d.ts +2751 -612
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +15 -5
- package/dist/index2.cjs +3651 -370
- package/dist/index2.cjs.map +1 -1
- package/dist/index2.js +3365 -270
- package/dist/index2.js.map +1 -1
- package/package.json +8 -4
- package/src/accordion/root/AccordionRoot.vue +2 -1
- package/src/checkbox/index.ts +23 -0
- package/src/checkbox/indicator/CheckboxIndicator.vue +102 -0
- package/src/checkbox/indicator/CheckboxIndicatorDataAttributes.ts +61 -0
- package/src/checkbox/root/CheckboxRoot.vue +632 -0
- package/src/checkbox/root/CheckboxRootContext.ts +22 -0
- package/src/checkbox/root/CheckboxRootDataAttributes.ts +54 -0
- package/src/checkbox/utils/useStateAttributesMapping.ts +30 -0
- package/src/checkbox-group/CheckboxGroup.vue +241 -0
- package/src/checkbox-group/CheckboxGroupContext.ts +39 -0
- package/src/checkbox-group/CheckboxGroupDataAttributes.ts +6 -0
- package/src/checkbox-group/index.ts +11 -0
- package/src/checkbox-group/useCheckboxGroupParent.ts +173 -0
- package/src/collapsible/panel/useCollapsiblePanel.ts +2 -1
- package/src/collapsible/root/useCollapsibleRoot.ts +3 -1
- package/src/composite/composite.ts +2 -0
- package/src/composite/item/CompositeItem.vue +7 -8
- package/src/composite/root/CompositeRoot.vue +12 -1
- package/src/csp-provider/CSPContext.ts +26 -0
- package/src/csp-provider/CSPProvider.vue +40 -0
- package/src/csp-provider/index.ts +5 -0
- package/src/field/item/FieldItem.vue +6 -1
- package/src/field/label/FieldLabel.vue +10 -51
- package/src/field/root/FieldRoot.vue +16 -3
- package/src/floating-ui-vue/types.ts +1 -4
- package/src/floating-ui-vue/utils/element.ts +12 -0
- package/src/floating-ui-vue/utils/shadowDom.ts +44 -0
- package/src/floating-ui-vue/utils.ts +3 -0
- package/src/form/Form.vue +5 -3
- package/src/index.ts +9 -0
- package/src/labelable-provider/LabelableContext.ts +2 -2
- package/src/labelable-provider/LabelableProvider.vue +21 -4
- package/src/labelable-provider/index.ts +2 -0
- package/src/labelable-provider/useAriaLabelledBy.ts +9 -9
- package/src/labelable-provider/useLabel.ts +115 -0
- package/src/labelable-provider/useLabelableId.ts +12 -10
- package/src/separator/Separator.vue +65 -0
- package/src/separator/SeparatorDataAttributes.ts +7 -0
- package/src/separator/index.ts +3 -0
- package/src/slider/control/SliderControl.vue +497 -0
- package/src/slider/control/SliderControlDataAttributes.ts +35 -0
- package/src/slider/index.ts +35 -0
- package/src/slider/indicator/SliderIndicator.vue +144 -0
- package/src/slider/indicator/SliderIndicatorDataAttributes.ts +35 -0
- package/src/slider/label/SliderLabel.vue +75 -0
- package/src/slider/root/SliderRoot.vue +557 -0
- package/src/slider/root/SliderRootContext.ts +126 -0
- package/src/slider/root/SliderRootDataAttributes.ts +35 -0
- package/src/slider/root/stateAttributesMapping.ts +13 -0
- package/src/slider/thumb/SliderThumb.vue +601 -0
- package/src/slider/thumb/SliderThumbDataAttributes.ts +39 -0
- package/src/slider/thumb/prehydrationScript.min.ts +5 -0
- package/src/slider/thumb/prehydrationScript.template.js +69 -0
- package/src/slider/track/SliderTrack.vue +48 -0
- package/src/slider/track/SliderTrackDataAttributes.ts +10 -0
- package/src/slider/utils/asc.ts +3 -0
- package/src/slider/utils/getMidpoint.ts +9 -0
- package/src/slider/utils/getPushedThumbValues.ts +68 -0
- package/src/slider/utils/getSliderValue.ts +25 -0
- package/src/slider/utils/replaceArrayItemAtIndex.ts +15 -0
- package/src/slider/utils/resolveThumbCollision.ts +177 -0
- package/src/slider/utils/roundValueToStep.ts +19 -0
- package/src/slider/utils/test-utils.ts +25 -0
- package/src/slider/utils/validateMinimumDistance.ts +20 -0
- package/src/slider/utils/valueArrayToPercentages.ts +10 -0
- package/src/slider/value/SliderValue.vue +90 -0
- package/src/slider/value/SliderValueDataAttributes.ts +35 -0
- package/src/switch/index.ts +14 -0
- package/src/switch/root/SwitchRoot.vue +448 -0
- package/src/switch/root/SwitchRootContext.ts +22 -0
- package/src/switch/root/SwitchRootDataAttributes.ts +46 -0
- package/src/switch/stateAttributesMapping.ts +23 -0
- package/src/switch/thumb/SwitchThumb.vue +59 -0
- package/src/switch/thumb/SwitchThumbDataAttributes.ts +46 -0
- package/src/toggle/Toggle.vue +211 -0
- package/src/toggle/ToggleDataAttributes.ts +6 -0
- package/src/toggle/index.ts +3 -0
- package/src/toggle-group/ToggleGroup.vue +224 -0
- package/src/toggle-group/ToggleGroupContext.ts +45 -0
- package/src/toggle-group/ToggleGroupDataAttributes.ts +15 -0
- package/src/toggle-group/index.ts +5 -0
- package/src/toolbar/button/ToolbarButton.vue +99 -0
- package/src/toolbar/button/ToolbarButtonDataAttributes.ts +15 -0
- package/src/toolbar/group/ToolbarGroup.vue +70 -0
- package/src/toolbar/group/ToolbarGroupContext.ts +23 -0
- package/src/toolbar/group/ToolbarGroupDataAttributes.ts +11 -0
- package/src/toolbar/index.ts +27 -0
- package/src/toolbar/input/ToolbarInput.vue +114 -0
- package/src/toolbar/input/ToolbarInputDataAttributes.ts +15 -0
- package/src/toolbar/link/ToolbarLink.vue +54 -0
- package/src/toolbar/link/ToolbarLinkDataAttributes.ts +7 -0
- package/src/toolbar/root/ToolbarRoot.vue +144 -0
- package/src/toolbar/root/ToolbarRootContext.ts +29 -0
- package/src/toolbar/root/ToolbarRootDataAttributes.ts +11 -0
- package/src/toolbar/separator/ToolbarSeparator.vue +41 -0
- package/src/toolbar/separator/ToolbarSeparatorDataAttributes.ts +7 -0
- package/src/use-button/useButton.ts +2 -1
- package/src/utils/areArraysEqual.ts +12 -0
- package/src/utils/clamp.ts +7 -0
- package/src/utils/createBaseUIEventDetails.ts +9 -0
- package/src/utils/formatNumber.ts +7 -0
- package/src/utils/owner.ts +5 -0
- package/src/utils/resolveAriaLabelledBy.ts +10 -0
- package/src/utils/useControllableState.ts +78 -14
- package/src/utils/useFocusableWhenDisabled.ts +6 -1
- package/src/utils/useMergedRefs.ts +26 -2
- package/src/utils/useRegisteredLabelId.ts +21 -0
- package/src/utils/valueToPercent.ts +7 -0
- package/src/utils/visuallyHidden.ts +24 -0
- package/dist/direction-provider/DirectionContext.cjs +0 -26
- package/dist/direction-provider/DirectionContext.cjs.map +0 -1
- package/dist/direction-provider/DirectionContext.js +0 -15
- package/dist/direction-provider/DirectionContext.js.map +0 -1
|
@@ -7,22 +7,129 @@ const ARROW_LEFT = "ArrowLeft";
|
|
|
7
7
|
const ARROW_RIGHT = "ArrowRight";
|
|
8
8
|
const HOME = "Home";
|
|
9
9
|
const END = "End";
|
|
10
|
+
const PAGE_UP = "PageUp";
|
|
11
|
+
const PAGE_DOWN = "PageDown";
|
|
10
12
|
const HORIZONTAL_KEYS = new Set([ARROW_LEFT, ARROW_RIGHT]);
|
|
13
|
+
const HORIZONTAL_KEYS_WITH_EXTRA_KEYS = new Set([
|
|
14
|
+
ARROW_LEFT,
|
|
15
|
+
ARROW_RIGHT,
|
|
16
|
+
HOME,
|
|
17
|
+
END
|
|
18
|
+
]);
|
|
11
19
|
const VERTICAL_KEYS = new Set([ARROW_UP, ARROW_DOWN]);
|
|
20
|
+
const VERTICAL_KEYS_WITH_EXTRA_KEYS = new Set([
|
|
21
|
+
ARROW_UP,
|
|
22
|
+
ARROW_DOWN,
|
|
23
|
+
HOME,
|
|
24
|
+
END
|
|
25
|
+
]);
|
|
12
26
|
const ARROW_KEYS = new Set([...HORIZONTAL_KEYS, ...VERTICAL_KEYS]);
|
|
13
27
|
const ALL_KEYS = new Set([
|
|
14
28
|
...ARROW_KEYS,
|
|
15
29
|
HOME,
|
|
16
30
|
END
|
|
17
31
|
]);
|
|
32
|
+
const COMPOSITE_KEYS = new Set([
|
|
33
|
+
ARROW_UP,
|
|
34
|
+
ARROW_DOWN,
|
|
35
|
+
ARROW_LEFT,
|
|
36
|
+
ARROW_RIGHT,
|
|
37
|
+
HOME,
|
|
38
|
+
END
|
|
39
|
+
]);
|
|
40
|
+
const SHIFT = "Shift";
|
|
41
|
+
const CONTROL = "Control";
|
|
42
|
+
const ALT = "Alt";
|
|
43
|
+
const META = "Meta";
|
|
44
|
+
const MODIFIER_KEYS = new Set([
|
|
45
|
+
SHIFT,
|
|
46
|
+
CONTROL,
|
|
47
|
+
ALT,
|
|
48
|
+
META
|
|
49
|
+
]);
|
|
50
|
+
function isInputElement(element) {
|
|
51
|
+
return (0, _floating_ui_utils_dom.isHTMLElement)(element) && element.tagName === "INPUT";
|
|
52
|
+
}
|
|
53
|
+
function isNativeInput(element) {
|
|
54
|
+
if (isInputElement(element) && element.selectionStart != null) return true;
|
|
55
|
+
if ((0, _floating_ui_utils_dom.isHTMLElement)(element) && element.tagName === "TEXTAREA") return true;
|
|
56
|
+
return false;
|
|
57
|
+
}
|
|
58
|
+
function scrollIntoViewIfNeeded(scrollContainer, element, direction, orientation) {
|
|
59
|
+
if (!scrollContainer || !element || !element.scrollTo) return;
|
|
60
|
+
let targetX = scrollContainer.scrollLeft;
|
|
61
|
+
let targetY = scrollContainer.scrollTop;
|
|
62
|
+
const isOverflowingX = scrollContainer.clientWidth < scrollContainer.scrollWidth;
|
|
63
|
+
const isOverflowingY = scrollContainer.clientHeight < scrollContainer.scrollHeight;
|
|
64
|
+
if (isOverflowingX && orientation !== "vertical") {
|
|
65
|
+
const elementOffsetLeft = getOffset(scrollContainer, element, "left");
|
|
66
|
+
const containerStyles = getStyles(scrollContainer);
|
|
67
|
+
const elementStyles = getStyles(element);
|
|
68
|
+
if (direction === "ltr") {
|
|
69
|
+
if (elementOffsetLeft + element.offsetWidth + elementStyles.scrollMarginRight > scrollContainer.scrollLeft + scrollContainer.clientWidth - containerStyles.scrollPaddingRight) targetX = elementOffsetLeft + element.offsetWidth + elementStyles.scrollMarginRight - scrollContainer.clientWidth + containerStyles.scrollPaddingRight;
|
|
70
|
+
else if (elementOffsetLeft - elementStyles.scrollMarginLeft < scrollContainer.scrollLeft + containerStyles.scrollPaddingLeft) targetX = elementOffsetLeft - elementStyles.scrollMarginLeft - containerStyles.scrollPaddingLeft;
|
|
71
|
+
}
|
|
72
|
+
if (direction === "rtl") {
|
|
73
|
+
if (elementOffsetLeft - elementStyles.scrollMarginRight < scrollContainer.scrollLeft + containerStyles.scrollPaddingLeft) targetX = elementOffsetLeft - elementStyles.scrollMarginLeft - containerStyles.scrollPaddingLeft;
|
|
74
|
+
else if (elementOffsetLeft + element.offsetWidth + elementStyles.scrollMarginRight > scrollContainer.scrollLeft + scrollContainer.clientWidth - containerStyles.scrollPaddingRight) targetX = elementOffsetLeft + element.offsetWidth + elementStyles.scrollMarginRight - scrollContainer.clientWidth + containerStyles.scrollPaddingRight;
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
if (isOverflowingY && orientation !== "horizontal") {
|
|
78
|
+
const elementOffsetTop = getOffset(scrollContainer, element, "top");
|
|
79
|
+
const containerStyles = getStyles(scrollContainer);
|
|
80
|
+
const elementStyles = getStyles(element);
|
|
81
|
+
if (elementOffsetTop - elementStyles.scrollMarginTop < scrollContainer.scrollTop + containerStyles.scrollPaddingTop) targetY = elementOffsetTop - elementStyles.scrollMarginTop - containerStyles.scrollPaddingTop;
|
|
82
|
+
else if (elementOffsetTop + element.offsetHeight + elementStyles.scrollMarginBottom > scrollContainer.scrollTop + scrollContainer.clientHeight - containerStyles.scrollPaddingBottom) targetY = elementOffsetTop + element.offsetHeight + elementStyles.scrollMarginBottom - scrollContainer.clientHeight + containerStyles.scrollPaddingBottom;
|
|
83
|
+
}
|
|
84
|
+
scrollContainer.scrollTo({
|
|
85
|
+
left: targetX,
|
|
86
|
+
top: targetY,
|
|
87
|
+
behavior: "auto"
|
|
88
|
+
});
|
|
89
|
+
}
|
|
90
|
+
function getOffset(ancestor, element, side) {
|
|
91
|
+
const propName = side === "left" ? "offsetLeft" : "offsetTop";
|
|
92
|
+
let result = 0;
|
|
93
|
+
while (element.offsetParent) {
|
|
94
|
+
result += element[propName];
|
|
95
|
+
if (element.offsetParent === ancestor) break;
|
|
96
|
+
element = element.offsetParent;
|
|
97
|
+
}
|
|
98
|
+
return result;
|
|
99
|
+
}
|
|
100
|
+
function getStyles(element) {
|
|
101
|
+
const styles = getComputedStyle(element);
|
|
102
|
+
return {
|
|
103
|
+
scrollMarginTop: Number.parseFloat(styles.scrollMarginTop) || 0,
|
|
104
|
+
scrollMarginRight: Number.parseFloat(styles.scrollMarginRight) || 0,
|
|
105
|
+
scrollMarginBottom: Number.parseFloat(styles.scrollMarginBottom) || 0,
|
|
106
|
+
scrollMarginLeft: Number.parseFloat(styles.scrollMarginLeft) || 0,
|
|
107
|
+
scrollPaddingTop: Number.parseFloat(styles.scrollPaddingTop) || 0,
|
|
108
|
+
scrollPaddingRight: Number.parseFloat(styles.scrollPaddingRight) || 0,
|
|
109
|
+
scrollPaddingBottom: Number.parseFloat(styles.scrollPaddingBottom) || 0,
|
|
110
|
+
scrollPaddingLeft: Number.parseFloat(styles.scrollPaddingLeft) || 0
|
|
111
|
+
};
|
|
112
|
+
}
|
|
18
113
|
|
|
19
114
|
//#endregion
|
|
115
|
+
Object.defineProperty(exports, 'ALL_KEYS', {
|
|
116
|
+
enumerable: true,
|
|
117
|
+
get: function () {
|
|
118
|
+
return ALL_KEYS;
|
|
119
|
+
}
|
|
120
|
+
});
|
|
20
121
|
Object.defineProperty(exports, 'ARROW_DOWN', {
|
|
21
122
|
enumerable: true,
|
|
22
123
|
get: function () {
|
|
23
124
|
return ARROW_DOWN;
|
|
24
125
|
}
|
|
25
126
|
});
|
|
127
|
+
Object.defineProperty(exports, 'ARROW_KEYS', {
|
|
128
|
+
enumerable: true,
|
|
129
|
+
get: function () {
|
|
130
|
+
return ARROW_KEYS;
|
|
131
|
+
}
|
|
132
|
+
});
|
|
26
133
|
Object.defineProperty(exports, 'ARROW_LEFT', {
|
|
27
134
|
enumerable: true,
|
|
28
135
|
get: function () {
|
|
@@ -41,6 +148,12 @@ Object.defineProperty(exports, 'ARROW_UP', {
|
|
|
41
148
|
return ARROW_UP;
|
|
42
149
|
}
|
|
43
150
|
});
|
|
151
|
+
Object.defineProperty(exports, 'COMPOSITE_KEYS', {
|
|
152
|
+
enumerable: true,
|
|
153
|
+
get: function () {
|
|
154
|
+
return COMPOSITE_KEYS;
|
|
155
|
+
}
|
|
156
|
+
});
|
|
44
157
|
Object.defineProperty(exports, 'END', {
|
|
45
158
|
enumerable: true,
|
|
46
159
|
get: function () {
|
|
@@ -53,4 +166,58 @@ Object.defineProperty(exports, 'HOME', {
|
|
|
53
166
|
return HOME;
|
|
54
167
|
}
|
|
55
168
|
});
|
|
169
|
+
Object.defineProperty(exports, 'HORIZONTAL_KEYS', {
|
|
170
|
+
enumerable: true,
|
|
171
|
+
get: function () {
|
|
172
|
+
return HORIZONTAL_KEYS;
|
|
173
|
+
}
|
|
174
|
+
});
|
|
175
|
+
Object.defineProperty(exports, 'HORIZONTAL_KEYS_WITH_EXTRA_KEYS', {
|
|
176
|
+
enumerable: true,
|
|
177
|
+
get: function () {
|
|
178
|
+
return HORIZONTAL_KEYS_WITH_EXTRA_KEYS;
|
|
179
|
+
}
|
|
180
|
+
});
|
|
181
|
+
Object.defineProperty(exports, 'MODIFIER_KEYS', {
|
|
182
|
+
enumerable: true,
|
|
183
|
+
get: function () {
|
|
184
|
+
return MODIFIER_KEYS;
|
|
185
|
+
}
|
|
186
|
+
});
|
|
187
|
+
Object.defineProperty(exports, 'PAGE_DOWN', {
|
|
188
|
+
enumerable: true,
|
|
189
|
+
get: function () {
|
|
190
|
+
return PAGE_DOWN;
|
|
191
|
+
}
|
|
192
|
+
});
|
|
193
|
+
Object.defineProperty(exports, 'PAGE_UP', {
|
|
194
|
+
enumerable: true,
|
|
195
|
+
get: function () {
|
|
196
|
+
return PAGE_UP;
|
|
197
|
+
}
|
|
198
|
+
});
|
|
199
|
+
Object.defineProperty(exports, 'VERTICAL_KEYS', {
|
|
200
|
+
enumerable: true,
|
|
201
|
+
get: function () {
|
|
202
|
+
return VERTICAL_KEYS;
|
|
203
|
+
}
|
|
204
|
+
});
|
|
205
|
+
Object.defineProperty(exports, 'VERTICAL_KEYS_WITH_EXTRA_KEYS', {
|
|
206
|
+
enumerable: true,
|
|
207
|
+
get: function () {
|
|
208
|
+
return VERTICAL_KEYS_WITH_EXTRA_KEYS;
|
|
209
|
+
}
|
|
210
|
+
});
|
|
211
|
+
Object.defineProperty(exports, 'isNativeInput', {
|
|
212
|
+
enumerable: true,
|
|
213
|
+
get: function () {
|
|
214
|
+
return isNativeInput;
|
|
215
|
+
}
|
|
216
|
+
});
|
|
217
|
+
Object.defineProperty(exports, 'scrollIntoViewIfNeeded', {
|
|
218
|
+
enumerable: true,
|
|
219
|
+
get: function () {
|
|
220
|
+
return scrollIntoViewIfNeeded;
|
|
221
|
+
}
|
|
222
|
+
});
|
|
56
223
|
//# sourceMappingURL=composite.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"composite.cjs","names":[],"sources":["../../src/composite/composite.ts"],"sourcesContent":[],"mappings":";;;AAqBA,MAAa,WAAW;AACxB,MAAa,aAAa;AAC1B,MAAa,aAAa;AAC1B,MAAa,cAAc;AAC3B,MAAa,OAAO;AACpB,MAAa,MAAM;
|
|
1
|
+
{"version":3,"file":"composite.cjs","names":[],"sources":["../../src/composite/composite.ts"],"sourcesContent":[],"mappings":"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"}
|
|
@@ -7,15 +7,110 @@ const ARROW_LEFT = "ArrowLeft";
|
|
|
7
7
|
const ARROW_RIGHT = "ArrowRight";
|
|
8
8
|
const HOME = "Home";
|
|
9
9
|
const END = "End";
|
|
10
|
+
const PAGE_UP = "PageUp";
|
|
11
|
+
const PAGE_DOWN = "PageDown";
|
|
10
12
|
const HORIZONTAL_KEYS = new Set([ARROW_LEFT, ARROW_RIGHT]);
|
|
13
|
+
const HORIZONTAL_KEYS_WITH_EXTRA_KEYS = new Set([
|
|
14
|
+
ARROW_LEFT,
|
|
15
|
+
ARROW_RIGHT,
|
|
16
|
+
HOME,
|
|
17
|
+
END
|
|
18
|
+
]);
|
|
11
19
|
const VERTICAL_KEYS = new Set([ARROW_UP, ARROW_DOWN]);
|
|
20
|
+
const VERTICAL_KEYS_WITH_EXTRA_KEYS = new Set([
|
|
21
|
+
ARROW_UP,
|
|
22
|
+
ARROW_DOWN,
|
|
23
|
+
HOME,
|
|
24
|
+
END
|
|
25
|
+
]);
|
|
12
26
|
const ARROW_KEYS = new Set([...HORIZONTAL_KEYS, ...VERTICAL_KEYS]);
|
|
13
27
|
const ALL_KEYS = new Set([
|
|
14
28
|
...ARROW_KEYS,
|
|
15
29
|
HOME,
|
|
16
30
|
END
|
|
17
31
|
]);
|
|
32
|
+
const COMPOSITE_KEYS = new Set([
|
|
33
|
+
ARROW_UP,
|
|
34
|
+
ARROW_DOWN,
|
|
35
|
+
ARROW_LEFT,
|
|
36
|
+
ARROW_RIGHT,
|
|
37
|
+
HOME,
|
|
38
|
+
END
|
|
39
|
+
]);
|
|
40
|
+
const SHIFT = "Shift";
|
|
41
|
+
const CONTROL = "Control";
|
|
42
|
+
const ALT = "Alt";
|
|
43
|
+
const META = "Meta";
|
|
44
|
+
const MODIFIER_KEYS = new Set([
|
|
45
|
+
SHIFT,
|
|
46
|
+
CONTROL,
|
|
47
|
+
ALT,
|
|
48
|
+
META
|
|
49
|
+
]);
|
|
50
|
+
function isInputElement(element) {
|
|
51
|
+
return isHTMLElement(element) && element.tagName === "INPUT";
|
|
52
|
+
}
|
|
53
|
+
function isNativeInput(element) {
|
|
54
|
+
if (isInputElement(element) && element.selectionStart != null) return true;
|
|
55
|
+
if (isHTMLElement(element) && element.tagName === "TEXTAREA") return true;
|
|
56
|
+
return false;
|
|
57
|
+
}
|
|
58
|
+
function scrollIntoViewIfNeeded(scrollContainer, element, direction, orientation) {
|
|
59
|
+
if (!scrollContainer || !element || !element.scrollTo) return;
|
|
60
|
+
let targetX = scrollContainer.scrollLeft;
|
|
61
|
+
let targetY = scrollContainer.scrollTop;
|
|
62
|
+
const isOverflowingX = scrollContainer.clientWidth < scrollContainer.scrollWidth;
|
|
63
|
+
const isOverflowingY = scrollContainer.clientHeight < scrollContainer.scrollHeight;
|
|
64
|
+
if (isOverflowingX && orientation !== "vertical") {
|
|
65
|
+
const elementOffsetLeft = getOffset(scrollContainer, element, "left");
|
|
66
|
+
const containerStyles = getStyles(scrollContainer);
|
|
67
|
+
const elementStyles = getStyles(element);
|
|
68
|
+
if (direction === "ltr") {
|
|
69
|
+
if (elementOffsetLeft + element.offsetWidth + elementStyles.scrollMarginRight > scrollContainer.scrollLeft + scrollContainer.clientWidth - containerStyles.scrollPaddingRight) targetX = elementOffsetLeft + element.offsetWidth + elementStyles.scrollMarginRight - scrollContainer.clientWidth + containerStyles.scrollPaddingRight;
|
|
70
|
+
else if (elementOffsetLeft - elementStyles.scrollMarginLeft < scrollContainer.scrollLeft + containerStyles.scrollPaddingLeft) targetX = elementOffsetLeft - elementStyles.scrollMarginLeft - containerStyles.scrollPaddingLeft;
|
|
71
|
+
}
|
|
72
|
+
if (direction === "rtl") {
|
|
73
|
+
if (elementOffsetLeft - elementStyles.scrollMarginRight < scrollContainer.scrollLeft + containerStyles.scrollPaddingLeft) targetX = elementOffsetLeft - elementStyles.scrollMarginLeft - containerStyles.scrollPaddingLeft;
|
|
74
|
+
else if (elementOffsetLeft + element.offsetWidth + elementStyles.scrollMarginRight > scrollContainer.scrollLeft + scrollContainer.clientWidth - containerStyles.scrollPaddingRight) targetX = elementOffsetLeft + element.offsetWidth + elementStyles.scrollMarginRight - scrollContainer.clientWidth + containerStyles.scrollPaddingRight;
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
if (isOverflowingY && orientation !== "horizontal") {
|
|
78
|
+
const elementOffsetTop = getOffset(scrollContainer, element, "top");
|
|
79
|
+
const containerStyles = getStyles(scrollContainer);
|
|
80
|
+
const elementStyles = getStyles(element);
|
|
81
|
+
if (elementOffsetTop - elementStyles.scrollMarginTop < scrollContainer.scrollTop + containerStyles.scrollPaddingTop) targetY = elementOffsetTop - elementStyles.scrollMarginTop - containerStyles.scrollPaddingTop;
|
|
82
|
+
else if (elementOffsetTop + element.offsetHeight + elementStyles.scrollMarginBottom > scrollContainer.scrollTop + scrollContainer.clientHeight - containerStyles.scrollPaddingBottom) targetY = elementOffsetTop + element.offsetHeight + elementStyles.scrollMarginBottom - scrollContainer.clientHeight + containerStyles.scrollPaddingBottom;
|
|
83
|
+
}
|
|
84
|
+
scrollContainer.scrollTo({
|
|
85
|
+
left: targetX,
|
|
86
|
+
top: targetY,
|
|
87
|
+
behavior: "auto"
|
|
88
|
+
});
|
|
89
|
+
}
|
|
90
|
+
function getOffset(ancestor, element, side) {
|
|
91
|
+
const propName = side === "left" ? "offsetLeft" : "offsetTop";
|
|
92
|
+
let result = 0;
|
|
93
|
+
while (element.offsetParent) {
|
|
94
|
+
result += element[propName];
|
|
95
|
+
if (element.offsetParent === ancestor) break;
|
|
96
|
+
element = element.offsetParent;
|
|
97
|
+
}
|
|
98
|
+
return result;
|
|
99
|
+
}
|
|
100
|
+
function getStyles(element) {
|
|
101
|
+
const styles = getComputedStyle(element);
|
|
102
|
+
return {
|
|
103
|
+
scrollMarginTop: Number.parseFloat(styles.scrollMarginTop) || 0,
|
|
104
|
+
scrollMarginRight: Number.parseFloat(styles.scrollMarginRight) || 0,
|
|
105
|
+
scrollMarginBottom: Number.parseFloat(styles.scrollMarginBottom) || 0,
|
|
106
|
+
scrollMarginLeft: Number.parseFloat(styles.scrollMarginLeft) || 0,
|
|
107
|
+
scrollPaddingTop: Number.parseFloat(styles.scrollPaddingTop) || 0,
|
|
108
|
+
scrollPaddingRight: Number.parseFloat(styles.scrollPaddingRight) || 0,
|
|
109
|
+
scrollPaddingBottom: Number.parseFloat(styles.scrollPaddingBottom) || 0,
|
|
110
|
+
scrollPaddingLeft: Number.parseFloat(styles.scrollPaddingLeft) || 0
|
|
111
|
+
};
|
|
112
|
+
}
|
|
18
113
|
|
|
19
114
|
//#endregion
|
|
20
|
-
export { ARROW_DOWN, ARROW_LEFT, ARROW_RIGHT, ARROW_UP, END, HOME };
|
|
115
|
+
export { ALL_KEYS, ARROW_DOWN, ARROW_KEYS, ARROW_LEFT, ARROW_RIGHT, ARROW_UP, COMPOSITE_KEYS, END, HOME, HORIZONTAL_KEYS, HORIZONTAL_KEYS_WITH_EXTRA_KEYS, MODIFIER_KEYS, PAGE_DOWN, PAGE_UP, VERTICAL_KEYS, VERTICAL_KEYS_WITH_EXTRA_KEYS, isNativeInput, scrollIntoViewIfNeeded };
|
|
21
116
|
//# sourceMappingURL=composite.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"composite.js","names":[],"sources":["../../src/composite/composite.ts"],"sourcesContent":[],"mappings":";;;AAqBA,MAAa,WAAW;AACxB,MAAa,aAAa;AAC1B,MAAa,aAAa;AAC1B,MAAa,cAAc;AAC3B,MAAa,OAAO;AACpB,MAAa,MAAM;
|
|
1
|
+
{"version":3,"file":"composite.js","names":[],"sources":["../../src/composite/composite.ts"],"sourcesContent":[],"mappings":"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"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
|
|
2
|
+
//#region src/composite/constants.ts
|
|
3
|
+
const ACTIVE_COMPOSITE_ITEM = "data-composite-item-active";
|
|
4
|
+
|
|
5
|
+
//#endregion
|
|
6
|
+
Object.defineProperty(exports, 'ACTIVE_COMPOSITE_ITEM', {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return ACTIVE_COMPOSITE_ITEM;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
//# sourceMappingURL=constants.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"constants.cjs","names":[],"sources":["../../src/composite/constants.ts"],"sourcesContent":[],"mappings":";;AAAA,MAAa,wBAAwB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"constants.js","names":[],"sources":["../../src/composite/constants.ts"],"sourcesContent":[],"mappings":";AAAA,MAAa,wBAAwB"}
|