@salt-ds/core 1.71.0 → 1.72.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/CHANGELOG.md +82 -0
- package/css/salt-core.css +189 -77
- package/dist-cjs/accordion/AccordionHeader.css.js +1 -1
- package/dist-cjs/avatar/Avatar.css.js +1 -1
- package/dist-cjs/badge/Badge.css.js +1 -1
- package/dist-cjs/banner/Banner.css.js +1 -1
- package/dist-cjs/breadcrumbs/Breadcrumb.css.js +1 -1
- package/dist-cjs/breadcrumbs/Breadcrumbs.css.js +1 -1
- package/dist-cjs/checkbox/Checkbox.css.js +1 -1
- package/dist-cjs/checkbox/CheckboxIcon.css.js +1 -1
- package/dist-cjs/combo-box/ComboBox.js +18 -36
- package/dist-cjs/combo-box/ComboBox.js.map +1 -1
- package/dist-cjs/combo-box/useComboBox.js +21 -21
- package/dist-cjs/combo-box/useComboBox.js.map +1 -1
- package/dist-cjs/dropdown/Dropdown.js +29 -30
- package/dist-cjs/dropdown/Dropdown.js.map +1 -1
- package/dist-cjs/file-drop-zone/FileDropZone.css.js +1 -1
- package/dist-cjs/form-field/FormField.css.js +1 -1
- package/dist-cjs/form-field/FormFieldHelperText.css.js +1 -1
- package/dist-cjs/form-field/FormFieldLabel.css.js +1 -1
- package/dist-cjs/form-field/FormFieldLabel.js +1 -1
- package/dist-cjs/form-field/FormFieldLabel.js.map +1 -1
- package/dist-cjs/index.js +2 -0
- package/dist-cjs/index.js.map +1 -1
- package/dist-cjs/input/Input.css.js +1 -1
- package/dist-cjs/interactable-card/InteractableCard.css.js +1 -1
- package/dist-cjs/interactable-card/InteractableCard.js +18 -7
- package/dist-cjs/interactable-card/InteractableCard.js.map +1 -1
- package/dist-cjs/interactable-card/InteractableCardGroup.js +71 -39
- package/dist-cjs/interactable-card/InteractableCardGroup.js.map +1 -1
- package/dist-cjs/interactable-card/InteractableCardGroupContext.js.map +1 -1
- package/dist-cjs/interactable-card/useInteractableCard.js +2 -3
- package/dist-cjs/interactable-card/useInteractableCard.js.map +1 -1
- package/dist-cjs/kbd/Kbd.css.js +1 -1
- package/dist-cjs/link/Link.css.js +1 -1
- package/dist-cjs/list-box/ListBox.js +19 -26
- package/dist-cjs/list-box/ListBox.js.map +1 -1
- package/dist-cjs/list-control/ListControlNavigationKeys.js +74 -0
- package/dist-cjs/list-control/ListControlNavigationKeys.js.map +1 -0
- package/dist-cjs/list-control/ListControlOptionContext.js +47 -0
- package/dist-cjs/list-control/ListControlOptionContext.js.map +1 -0
- package/dist-cjs/list-control/ListControlOptionStore.js +159 -0
- package/dist-cjs/list-control/ListControlOptionStore.js.map +1 -0
- package/dist-cjs/list-control/ListControlProvider.js +39 -0
- package/dist-cjs/list-control/ListControlProvider.js.map +1 -0
- package/dist-cjs/list-control/ListControlRegistry.js +161 -0
- package/dist-cjs/list-control/ListControlRegistry.js.map +1 -0
- package/dist-cjs/list-control/ListControlState.js +137 -109
- package/dist-cjs/list-control/ListControlState.js.map +1 -1
- package/dist-cjs/mega-menu/MegaMenuGroupHeading.css.js +1 -1
- package/dist-cjs/mega-menu/MegaMenuListItem.css.js +1 -1
- package/dist-cjs/menu/MenuGroup.css.js +1 -1
- package/dist-cjs/menu/MenuItem.css.js +1 -1
- package/dist-cjs/navigation-item/NavigationItem.css.js +1 -1
- package/dist-cjs/number-input/NumberInput.js +2 -2
- package/dist-cjs/number-input/NumberInput.js.map +1 -1
- package/dist-cjs/option/Option.js +58 -39
- package/dist-cjs/option/Option.js.map +1 -1
- package/dist-cjs/option/OptionGroup.css.js +1 -1
- package/dist-cjs/overlay/Overlay.js +12 -2
- package/dist-cjs/overlay/Overlay.js.map +1 -1
- package/dist-cjs/overlay/OverlayContext.js +6 -0
- package/dist-cjs/overlay/OverlayContext.js.map +1 -1
- package/dist-cjs/overlay/OverlayFooter.css.js +6 -0
- package/dist-cjs/overlay/OverlayFooter.css.js.map +1 -0
- package/dist-cjs/overlay/OverlayFooter.js +30 -0
- package/dist-cjs/overlay/OverlayFooter.js.map +1 -0
- package/dist-cjs/overlay/OverlayHeader.css.js +1 -1
- package/dist-cjs/overlay/OverlayHeader.js +51 -11
- package/dist-cjs/overlay/OverlayHeader.js.map +1 -1
- package/dist-cjs/overlay/OverlayPanel.css.js +1 -1
- package/dist-cjs/overlay/OverlayPanel.js +20 -7
- package/dist-cjs/overlay/OverlayPanel.js.map +1 -1
- package/dist-cjs/overlay/OverlayPanelContent.css.js +1 -1
- package/dist-cjs/overlay/OverlayPanelContent.js +11 -13
- package/dist-cjs/overlay/OverlayPanelContent.js.map +1 -1
- package/dist-cjs/overlay/hasOverlaySection.js +24 -0
- package/dist-cjs/overlay/hasOverlaySection.js.map +1 -0
- package/dist-cjs/pill-input/PillInput.css.js +1 -1
- package/dist-cjs/pill-input/PillInput.js +2 -2
- package/dist-cjs/pill-input/PillInput.js.map +1 -1
- package/dist-cjs/radio-button/RadioButton.css.js +1 -1
- package/dist-cjs/radio-button/RadioButtonIcon.css.js +1 -1
- package/dist-cjs/rating/Rating.css.js +1 -1
- package/dist-cjs/slider/internal/SliderTrack.css.js +1 -1
- package/dist-cjs/stepper/internal/StepText.css.js +1 -1
- package/dist-cjs/switch/Switch.css.js +1 -1
- package/dist-cjs/table/Table.css.js +1 -1
- package/dist-cjs/tag/Tag.css.js +1 -1
- package/dist-cjs/text/Text.css.js +1 -1
- package/dist-cjs/toast/Toast.css.js +1 -1
- package/dist-cjs/toggle-button/ToggleButton.js +8 -2
- package/dist-cjs/toggle-button/ToggleButton.js.map +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroup.js +71 -8
- package/dist-cjs/toggle-button-group/ToggleButtonGroup.js.map +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
- package/dist-cjs/toggletip/ToggletipPanel.css.js +1 -1
- package/dist-cjs/tooltip/Tooltip.css.js +1 -1
- package/dist-cjs/vertical-navigation/VerticalNavigationItemContent.css.js +1 -1
- package/dist-cjs/vertical-navigation/VerticalNavigationSubMenu.css.js +1 -1
- package/dist-es/accordion/AccordionHeader.css.js +1 -1
- package/dist-es/avatar/Avatar.css.js +1 -1
- package/dist-es/badge/Badge.css.js +1 -1
- package/dist-es/banner/Banner.css.js +1 -1
- package/dist-es/breadcrumbs/Breadcrumb.css.js +1 -1
- package/dist-es/breadcrumbs/Breadcrumbs.css.js +1 -1
- package/dist-es/checkbox/Checkbox.css.js +1 -1
- package/dist-es/checkbox/CheckboxIcon.css.js +1 -1
- package/dist-es/combo-box/ComboBox.js +18 -36
- package/dist-es/combo-box/ComboBox.js.map +1 -1
- package/dist-es/combo-box/useComboBox.js +21 -21
- package/dist-es/combo-box/useComboBox.js.map +1 -1
- package/dist-es/dropdown/Dropdown.js +29 -30
- package/dist-es/dropdown/Dropdown.js.map +1 -1
- package/dist-es/file-drop-zone/FileDropZone.css.js +1 -1
- package/dist-es/form-field/FormField.css.js +1 -1
- package/dist-es/form-field/FormFieldHelperText.css.js +1 -1
- package/dist-es/form-field/FormFieldLabel.css.js +1 -1
- package/dist-es/form-field/FormFieldLabel.js +1 -1
- package/dist-es/form-field/FormFieldLabel.js.map +1 -1
- package/dist-es/index.js +1 -0
- package/dist-es/index.js.map +1 -1
- package/dist-es/input/Input.css.js +1 -1
- package/dist-es/interactable-card/InteractableCard.css.js +1 -1
- package/dist-es/interactable-card/InteractableCard.js +18 -7
- package/dist-es/interactable-card/InteractableCard.js.map +1 -1
- package/dist-es/interactable-card/InteractableCardGroup.js +72 -40
- package/dist-es/interactable-card/InteractableCardGroup.js.map +1 -1
- package/dist-es/interactable-card/InteractableCardGroupContext.js.map +1 -1
- package/dist-es/interactable-card/useInteractableCard.js +2 -3
- package/dist-es/interactable-card/useInteractableCard.js.map +1 -1
- package/dist-es/kbd/Kbd.css.js +1 -1
- package/dist-es/link/Link.css.js +1 -1
- package/dist-es/list-box/ListBox.js +19 -26
- package/dist-es/list-box/ListBox.js.map +1 -1
- package/dist-es/list-control/ListControlNavigationKeys.js +69 -0
- package/dist-es/list-control/ListControlNavigationKeys.js.map +1 -0
- package/dist-es/list-control/ListControlOptionContext.js +44 -0
- package/dist-es/list-control/ListControlOptionContext.js.map +1 -0
- package/dist-es/list-control/ListControlOptionStore.js +153 -0
- package/dist-es/list-control/ListControlOptionStore.js.map +1 -0
- package/dist-es/list-control/ListControlProvider.js +37 -0
- package/dist-es/list-control/ListControlProvider.js.map +1 -0
- package/dist-es/list-control/ListControlRegistry.js +158 -0
- package/dist-es/list-control/ListControlRegistry.js.map +1 -0
- package/dist-es/list-control/ListControlState.js +137 -110
- package/dist-es/list-control/ListControlState.js.map +1 -1
- package/dist-es/mega-menu/MegaMenuGroupHeading.css.js +1 -1
- package/dist-es/mega-menu/MegaMenuListItem.css.js +1 -1
- package/dist-es/menu/MenuGroup.css.js +1 -1
- package/dist-es/menu/MenuItem.css.js +1 -1
- package/dist-es/navigation-item/NavigationItem.css.js +1 -1
- package/dist-es/number-input/NumberInput.js +2 -2
- package/dist-es/number-input/NumberInput.js.map +1 -1
- package/dist-es/option/Option.js +59 -40
- package/dist-es/option/Option.js.map +1 -1
- package/dist-es/option/OptionGroup.css.js +1 -1
- package/dist-es/overlay/Overlay.js +13 -3
- package/dist-es/overlay/Overlay.js.map +1 -1
- package/dist-es/overlay/OverlayContext.js +6 -0
- package/dist-es/overlay/OverlayContext.js.map +1 -1
- package/dist-es/overlay/OverlayFooter.css.js +4 -0
- package/dist-es/overlay/OverlayFooter.css.js.map +1 -0
- package/dist-es/overlay/OverlayFooter.js +28 -0
- package/dist-es/overlay/OverlayFooter.js.map +1 -0
- package/dist-es/overlay/OverlayHeader.css.js +1 -1
- package/dist-es/overlay/OverlayHeader.js +51 -11
- package/dist-es/overlay/OverlayHeader.js.map +1 -1
- package/dist-es/overlay/OverlayPanel.css.js +1 -1
- package/dist-es/overlay/OverlayPanel.js +20 -7
- package/dist-es/overlay/OverlayPanel.js.map +1 -1
- package/dist-es/overlay/OverlayPanelContent.css.js +1 -1
- package/dist-es/overlay/OverlayPanelContent.js +11 -13
- package/dist-es/overlay/OverlayPanelContent.js.map +1 -1
- package/dist-es/overlay/hasOverlaySection.js +22 -0
- package/dist-es/overlay/hasOverlaySection.js.map +1 -0
- package/dist-es/pill-input/PillInput.css.js +1 -1
- package/dist-es/pill-input/PillInput.js +2 -2
- package/dist-es/pill-input/PillInput.js.map +1 -1
- package/dist-es/radio-button/RadioButton.css.js +1 -1
- package/dist-es/radio-button/RadioButtonIcon.css.js +1 -1
- package/dist-es/rating/Rating.css.js +1 -1
- package/dist-es/slider/internal/SliderTrack.css.js +1 -1
- package/dist-es/stepper/internal/StepText.css.js +1 -1
- package/dist-es/switch/Switch.css.js +1 -1
- package/dist-es/table/Table.css.js +1 -1
- package/dist-es/tag/Tag.css.js +1 -1
- package/dist-es/text/Text.css.js +1 -1
- package/dist-es/toast/Toast.css.js +1 -1
- package/dist-es/toggle-button/ToggleButton.js +8 -2
- package/dist-es/toggle-button/ToggleButton.js.map +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroup.js +71 -8
- package/dist-es/toggle-button-group/ToggleButtonGroup.js.map +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
- package/dist-es/toggletip/ToggletipPanel.css.js +1 -1
- package/dist-es/tooltip/Tooltip.css.js +1 -1
- package/dist-es/vertical-navigation/VerticalNavigationItemContent.css.js +1 -1
- package/dist-es/vertical-navigation/VerticalNavigationSubMenu.css.js +1 -1
- package/dist-types/combo-box/useComboBox.d.ts +3 -6
- package/dist-types/interactable-card/InteractableCardGroupContext.d.ts +2 -0
- package/dist-types/interactable-card/useInteractableCard.d.ts +1 -2
- package/dist-types/list-control/ListControlNavigationKeys.d.ts +30 -0
- package/dist-types/list-control/ListControlOptionContext.d.ts +18 -0
- package/dist-types/list-control/ListControlOptionStore.d.ts +17 -0
- package/dist-types/list-control/ListControlProvider.d.ts +11 -0
- package/dist-types/list-control/ListControlRegistry.d.ts +22 -0
- package/dist-types/list-control/ListControlState.d.ts +6 -6
- package/dist-types/option/Option.d.ts +3 -1
- package/dist-types/overlay/Overlay.d.ts +2 -1
- package/dist-types/overlay/OverlayContext.d.ts +4 -0
- package/dist-types/overlay/OverlayFooter.d.ts +4 -0
- package/dist-types/overlay/hasOverlaySection.d.ts +2 -0
- package/dist-types/overlay/index.d.ts +1 -0
- package/dist-types/toggle-button-group/ToggleButtonGroupContext.d.ts +2 -1
- package/package.json +4 -4
|
@@ -2,15 +2,53 @@ import { useRef, useState, useEffect, useCallback } from 'react';
|
|
|
2
2
|
import 'clsx';
|
|
3
3
|
import 'react/jsx-runtime';
|
|
4
4
|
import { useControlled } from '../utils/useControlled.js';
|
|
5
|
+
import { useEventCallback } from '../utils/useEventCallback.js';
|
|
5
6
|
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
6
7
|
import { useForkRef } from '../utils/useForkRef.js';
|
|
7
8
|
import '../utils/useId.js';
|
|
9
|
+
import { useIsomorphicLayoutEffect } from '../utils/useIsomorphicLayoutEffect.js';
|
|
8
10
|
import '../salt-provider/SaltProvider.js';
|
|
9
11
|
import '../viewport/ViewportProvider.js';
|
|
12
|
+
import { ListControlOptionStore } from './ListControlOptionStore.js';
|
|
13
|
+
import { ListControlRegistry, createCoalescedRebuild } from './ListControlRegistry.js';
|
|
10
14
|
|
|
11
15
|
function defaultValueToString(item) {
|
|
12
16
|
return String(item);
|
|
13
17
|
}
|
|
18
|
+
function findOptionFromSearch(options, search, valueToString, startFrom) {
|
|
19
|
+
var _a;
|
|
20
|
+
const collator = new Intl.Collator("en", {
|
|
21
|
+
usage: "search",
|
|
22
|
+
sensitivity: "base"
|
|
23
|
+
});
|
|
24
|
+
const startFromIndex = startFrom ? options.findIndex((item) => item.data.value === startFrom.value) : -1;
|
|
25
|
+
const startIndex = startFrom ? startFromIndex + 1 : 0;
|
|
26
|
+
const firstIndexByValue = /* @__PURE__ */ new Map();
|
|
27
|
+
for (let index = 0; index < options.length; index++) {
|
|
28
|
+
const value = options[index].data.value;
|
|
29
|
+
if ((typeof value !== "number" || !Number.isNaN(value)) && !firstIndexByValue.has(value)) {
|
|
30
|
+
firstIndexByValue.set(value, index);
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
const letters = search.split("");
|
|
34
|
+
const allSameLetter = letters.length > 0 && letters.every((letter) => collator.compare(letter, letters[0]) === 0);
|
|
35
|
+
let repeatedCharacterMatch;
|
|
36
|
+
for (let offset = 0; offset < options.length; offset++) {
|
|
37
|
+
const index = (startIndex + offset) % options.length;
|
|
38
|
+
const option = options[index].data;
|
|
39
|
+
if (firstIndexByValue.get(option.value) !== index) {
|
|
40
|
+
continue;
|
|
41
|
+
}
|
|
42
|
+
const optionText = valueToString(option.value);
|
|
43
|
+
if (collator.compare(optionText.substring(0, search.length), search) === 0) {
|
|
44
|
+
return option;
|
|
45
|
+
}
|
|
46
|
+
if (repeatedCharacterMatch === void 0 && allSameLetter && collator.compare((_a = optionText[0]) == null ? void 0 : _a.toLowerCase(), letters[0]) === 0) {
|
|
47
|
+
repeatedCharacterMatch = option;
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
return repeatedCharacterMatch;
|
|
51
|
+
}
|
|
14
52
|
function useListControl(props) {
|
|
15
53
|
const {
|
|
16
54
|
open: openProp,
|
|
@@ -24,6 +62,13 @@ function useListControl(props) {
|
|
|
24
62
|
readOnly,
|
|
25
63
|
valueToString = defaultValueToString
|
|
26
64
|
} = props;
|
|
65
|
+
const optionStateStoreRef = useRef(null);
|
|
66
|
+
if (optionStateStoreRef.current === null) {
|
|
67
|
+
optionStateStoreRef.current = new ListControlOptionStore(
|
|
68
|
+
selectedProp ?? defaultSelected ?? []
|
|
69
|
+
);
|
|
70
|
+
}
|
|
71
|
+
const optionStateStore = optionStateStoreRef.current;
|
|
27
72
|
const listRef = useRef(null);
|
|
28
73
|
const [listElement, setListElement] = useState(null);
|
|
29
74
|
const setListRef = useForkRef(listRef, setListElement);
|
|
@@ -35,16 +80,9 @@ function useListControl(props) {
|
|
|
35
80
|
setFocusVisibleState(false);
|
|
36
81
|
}
|
|
37
82
|
}, [disabled, focusedState]);
|
|
38
|
-
const [activeState,
|
|
83
|
+
const [activeState, setActive] = useState(
|
|
39
84
|
void 0
|
|
40
85
|
);
|
|
41
|
-
const setActive = useCallback((option) => {
|
|
42
|
-
if (option) {
|
|
43
|
-
setActiveState(option);
|
|
44
|
-
} else {
|
|
45
|
-
setActiveState(void 0);
|
|
46
|
-
}
|
|
47
|
-
}, []);
|
|
48
86
|
const [openState, setOpenState] = useControlled({
|
|
49
87
|
controlled: openProp,
|
|
50
88
|
default: Boolean(defaultOpen),
|
|
@@ -68,152 +106,143 @@ function useListControl(props) {
|
|
|
68
106
|
name: "ListControl",
|
|
69
107
|
state: "selected"
|
|
70
108
|
});
|
|
71
|
-
const select = (
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
if (
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
109
|
+
const select = useEventCallback(
|
|
110
|
+
(event, option) => {
|
|
111
|
+
if (option.disabled || readOnly || disabled) {
|
|
112
|
+
return;
|
|
113
|
+
}
|
|
114
|
+
let newSelected = [option.value];
|
|
115
|
+
if (multiselect) {
|
|
116
|
+
if (selectedState.includes(option.value)) {
|
|
117
|
+
newSelected = selectedState.filter((item) => item !== option.value);
|
|
118
|
+
} else {
|
|
119
|
+
newSelected = selectedState.concat([option.value]);
|
|
120
|
+
}
|
|
121
|
+
}
|
|
122
|
+
setSelectedState(newSelected);
|
|
123
|
+
onSelectionChange == null ? void 0 : onSelectionChange(event, newSelected);
|
|
124
|
+
if (!multiselect) {
|
|
125
|
+
setOpen(false);
|
|
81
126
|
}
|
|
82
127
|
}
|
|
83
|
-
|
|
84
|
-
onSelectionChange == null ? void 0 : onSelectionChange(event, newSelected);
|
|
85
|
-
if (!multiselect) {
|
|
86
|
-
setOpen(false);
|
|
87
|
-
}
|
|
88
|
-
};
|
|
128
|
+
);
|
|
89
129
|
const clear = (event) => {
|
|
90
130
|
setSelectedState([]);
|
|
91
131
|
if (selectedState.length !== 0) {
|
|
92
132
|
onSelectionChange == null ? void 0 : onSelectionChange(event, []);
|
|
93
133
|
}
|
|
94
134
|
};
|
|
95
|
-
const
|
|
135
|
+
const registryRef = useRef(null);
|
|
136
|
+
if (registryRef.current === null) {
|
|
137
|
+
registryRef.current = new ListControlRegistry();
|
|
138
|
+
}
|
|
139
|
+
const registry = registryRef.current;
|
|
140
|
+
const scheduleRebuildRef = useRef(void 0);
|
|
141
|
+
useIsomorphicLayoutEffect(() => {
|
|
142
|
+
optionStateStore.setActiveId(activeState == null ? void 0 : activeState.id);
|
|
143
|
+
}, [activeState == null ? void 0 : activeState.id, optionStateStore]);
|
|
144
|
+
useIsomorphicLayoutEffect(() => {
|
|
145
|
+
optionStateStore.setFocusVisible(focusVisibleState);
|
|
146
|
+
}, [focusVisibleState, optionStateStore]);
|
|
147
|
+
useIsomorphicLayoutEffect(() => {
|
|
148
|
+
optionStateStore.setSelected(selectedState);
|
|
149
|
+
}, [optionStateStore, selectedState]);
|
|
96
150
|
const register = useCallback(
|
|
97
151
|
(optionValue, element) => {
|
|
98
|
-
|
|
99
|
-
const
|
|
100
|
-
|
|
101
|
-
);
|
|
102
|
-
if (existingIndex !== -1) {
|
|
103
|
-
optionsRef.current.splice(existingIndex, 1);
|
|
104
|
-
}
|
|
105
|
-
optionsRef.current.push({ data: optionValue, element });
|
|
152
|
+
var _a;
|
|
153
|
+
const unregisterOptionState = optionStateStore.register(optionValue);
|
|
154
|
+
const unregisterRegistry = registry.register(optionValue, element);
|
|
155
|
+
(_a = scheduleRebuildRef.current) == null ? void 0 : _a.call(scheduleRebuildRef);
|
|
106
156
|
return () => {
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
);
|
|
157
|
+
var _a2;
|
|
158
|
+
unregisterRegistry();
|
|
159
|
+
unregisterOptionState();
|
|
160
|
+
(_a2 = scheduleRebuildRef.current) == null ? void 0 : _a2.call(scheduleRebuildRef);
|
|
110
161
|
};
|
|
111
162
|
},
|
|
112
|
-
[]
|
|
163
|
+
[optionStateStore, registry]
|
|
113
164
|
);
|
|
114
165
|
useEffect(() => {
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
if (pos & Node.DOCUMENT_POSITION_FOLLOWING) return -1;
|
|
120
|
-
if (pos & Node.DOCUMENT_POSITION_PRECEDING) return 1;
|
|
121
|
-
return 0;
|
|
122
|
-
});
|
|
166
|
+
if (!listElement) return;
|
|
167
|
+
const rebuild = () => {
|
|
168
|
+
mutationObserver.takeRecords();
|
|
169
|
+
registry.rebuild(listElement);
|
|
123
170
|
};
|
|
171
|
+
const coalescedRebuild = createCoalescedRebuild(rebuild);
|
|
172
|
+
scheduleRebuildRef.current = coalescedRebuild.schedule;
|
|
173
|
+
const containsOption = (node) => node.nodeType === Node.ELEMENT_NODE && (node.matches('[role="option"]') || node.querySelector('[role="option"]') !== null);
|
|
124
174
|
const mutationObserver = new MutationObserver((mutations) => {
|
|
125
|
-
|
|
126
|
-
(
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
return node instanceof HTMLElement && ((_a = node.matches) == null ? void 0 : _a.call(node, '[role="option"]'));
|
|
130
|
-
}
|
|
131
|
-
)
|
|
132
|
-
);
|
|
133
|
-
if (optionsChanged) {
|
|
134
|
-
sortOptions();
|
|
175
|
+
if (mutations.some(
|
|
176
|
+
({ addedNodes, removedNodes }) => Array.from(addedNodes).some(containsOption) || Array.from(removedNodes).some(containsOption)
|
|
177
|
+
)) {
|
|
178
|
+
coalescedRebuild.schedule();
|
|
135
179
|
}
|
|
136
180
|
});
|
|
137
|
-
if (!listElement) return;
|
|
138
181
|
mutationObserver.observe(listElement, {
|
|
139
182
|
childList: true,
|
|
140
183
|
subtree: true
|
|
141
184
|
});
|
|
142
|
-
|
|
143
|
-
return () =>
|
|
144
|
-
|
|
185
|
+
rebuild();
|
|
186
|
+
return () => {
|
|
187
|
+
scheduleRebuildRef.current = void 0;
|
|
188
|
+
coalescedRebuild.cancel();
|
|
189
|
+
mutationObserver.disconnect();
|
|
190
|
+
};
|
|
191
|
+
}, [listElement, registry]);
|
|
145
192
|
const getOptionAtIndex = useCallback(
|
|
146
193
|
(index) => {
|
|
147
|
-
return
|
|
194
|
+
return registry.getAt(index);
|
|
148
195
|
},
|
|
149
|
-
[]
|
|
196
|
+
[registry]
|
|
197
|
+
);
|
|
198
|
+
const getIndexOfOption = useCallback(
|
|
199
|
+
(option) => {
|
|
200
|
+
return registry.indexOfValue(option.value);
|
|
201
|
+
},
|
|
202
|
+
[registry]
|
|
150
203
|
);
|
|
151
|
-
const getIndexOfOption = useCallback((option) => {
|
|
152
|
-
return optionsRef.current.findIndex(
|
|
153
|
-
(item) => item.data.value === option.value
|
|
154
|
-
);
|
|
155
|
-
}, []);
|
|
156
204
|
const getOptionsMatching = useCallback(
|
|
157
205
|
(predicate) => {
|
|
158
|
-
return
|
|
206
|
+
return registry.matching(predicate);
|
|
159
207
|
},
|
|
160
|
-
[]
|
|
208
|
+
[registry]
|
|
161
209
|
);
|
|
162
210
|
const getOptionFromSearch = useCallback(
|
|
163
211
|
(search, startFrom) => {
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
const searchList = optionsRef.current.map((item) => item.data);
|
|
170
|
-
let matches = searchList.filter(
|
|
171
|
-
(option) => collator.compare(
|
|
172
|
-
valueToString(option.value).substring(0, search.length),
|
|
173
|
-
search
|
|
174
|
-
) === 0
|
|
212
|
+
return findOptionFromSearch(
|
|
213
|
+
registry.snapshot(),
|
|
214
|
+
search,
|
|
215
|
+
valueToString,
|
|
216
|
+
startFrom
|
|
175
217
|
);
|
|
176
|
-
if (matches.length === 0) {
|
|
177
|
-
const letters = search.split("");
|
|
178
|
-
const allSameLetter = letters.length > 0 && letters.every((letter) => collator.compare(letter, letters[0]) === 0);
|
|
179
|
-
if (allSameLetter) {
|
|
180
|
-
matches = searchList.filter(
|
|
181
|
-
(option) => collator.compare(
|
|
182
|
-
valueToString(option.value)[0].toLowerCase(),
|
|
183
|
-
letters[0]
|
|
184
|
-
) === 0
|
|
185
|
-
);
|
|
186
|
-
}
|
|
187
|
-
}
|
|
188
|
-
return matches.find((option) => getIndexOfOption(option) >= startIndex);
|
|
189
218
|
},
|
|
190
|
-
[
|
|
219
|
+
[registry, valueToString]
|
|
191
220
|
);
|
|
192
221
|
const getFirstOption = useCallback(() => {
|
|
193
222
|
return getOptionAtIndex(0);
|
|
194
223
|
}, [getOptionAtIndex]);
|
|
195
224
|
const getLastOption = useCallback(() => {
|
|
196
|
-
return getOptionAtIndex(
|
|
197
|
-
}, [getOptionAtIndex]);
|
|
225
|
+
return getOptionAtIndex(registry.length - 1);
|
|
226
|
+
}, [getOptionAtIndex, registry]);
|
|
198
227
|
const getOptionBefore = useCallback(
|
|
199
228
|
(option) => {
|
|
200
|
-
const index =
|
|
229
|
+
const index = registry.indexOfId(option.id);
|
|
201
230
|
return getOptionAtIndex(index - 1);
|
|
202
231
|
},
|
|
203
|
-
[
|
|
232
|
+
[getOptionAtIndex, registry]
|
|
204
233
|
);
|
|
205
234
|
const getOptionAfter = useCallback(
|
|
206
235
|
(option) => {
|
|
207
|
-
const index =
|
|
236
|
+
const index = registry.indexOfId(option.id);
|
|
208
237
|
return getOptionAtIndex(index + 1);
|
|
209
238
|
},
|
|
210
|
-
[
|
|
239
|
+
[getOptionAtIndex, registry]
|
|
211
240
|
);
|
|
212
241
|
const getOptionPageAbove = useCallback(
|
|
213
242
|
(start) => {
|
|
214
243
|
var _a;
|
|
215
244
|
const list = listRef.current;
|
|
216
|
-
let option =
|
|
245
|
+
let option = registry.findByData(start);
|
|
217
246
|
if (!list || !option) {
|
|
218
247
|
return void 0;
|
|
219
248
|
}
|
|
@@ -230,12 +259,12 @@ function useListControl(props) {
|
|
|
230
259
|
}
|
|
231
260
|
return option ?? getFirstOption();
|
|
232
261
|
},
|
|
233
|
-
[getFirstOption, getOptionBefore]
|
|
262
|
+
[getFirstOption, getOptionBefore, registry]
|
|
234
263
|
);
|
|
235
264
|
const getOptionPageBelow = useCallback(
|
|
236
265
|
(start) => {
|
|
237
266
|
const list = listRef.current;
|
|
238
|
-
let option =
|
|
267
|
+
let option = registry.findByData(start);
|
|
239
268
|
if (!list || !option) {
|
|
240
269
|
return void 0;
|
|
241
270
|
}
|
|
@@ -252,14 +281,12 @@ function useListControl(props) {
|
|
|
252
281
|
}
|
|
253
282
|
return option ?? getLastOption();
|
|
254
283
|
},
|
|
255
|
-
[getLastOption, getOptionAfter]
|
|
284
|
+
[getLastOption, getOptionAfter, registry]
|
|
256
285
|
);
|
|
257
286
|
useEffect(() => {
|
|
258
287
|
var _a;
|
|
259
288
|
if (listRef.current) {
|
|
260
|
-
const activeElement = (_a =
|
|
261
|
-
(option) => option.data === activeState
|
|
262
|
-
)) == null ? void 0 : _a.element;
|
|
289
|
+
const activeElement = activeState ? (_a = registry.findByData(activeState)) == null ? void 0 : _a.element : void 0;
|
|
263
290
|
if (!activeElement) {
|
|
264
291
|
return;
|
|
265
292
|
}
|
|
@@ -268,7 +295,7 @@ function useListControl(props) {
|
|
|
268
295
|
inline: "nearest"
|
|
269
296
|
});
|
|
270
297
|
}
|
|
271
|
-
}, [activeState]);
|
|
298
|
+
}, [activeState, registry]);
|
|
272
299
|
return {
|
|
273
300
|
multiselect: Boolean(multiselect),
|
|
274
301
|
openState,
|
|
@@ -286,7 +313,6 @@ function useListControl(props) {
|
|
|
286
313
|
setFocusedState,
|
|
287
314
|
setListRef,
|
|
288
315
|
listRef,
|
|
289
|
-
options: optionsRef.current.map((option) => option.element),
|
|
290
316
|
register,
|
|
291
317
|
getOptionAtIndex,
|
|
292
318
|
getIndexOfOption,
|
|
@@ -299,9 +325,10 @@ function useListControl(props) {
|
|
|
299
325
|
getFirstOption,
|
|
300
326
|
getLastOption,
|
|
301
327
|
valueToString,
|
|
302
|
-
disabled
|
|
328
|
+
disabled,
|
|
329
|
+
optionStateStore
|
|
303
330
|
};
|
|
304
331
|
}
|
|
305
332
|
|
|
306
|
-
export { defaultValueToString, useListControl };
|
|
333
|
+
export { defaultValueToString, findOptionFromSearch, useListControl };
|
|
307
334
|
//# sourceMappingURL=ListControlState.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListControlState.js","sources":["../src/list-control/ListControlState.ts"],"sourcesContent":["import {\n type SyntheticEvent,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport { useControlled, useForkRef } from \"../utils\";\nimport type { OptionValue } from \"./ListControlContext\";\n\nexport type OpenChangeReason = \"input\" | \"manual\";\n\nexport type ListControlProps<Item> = {\n /**\n * If true, the control will be disabled.\n */\n disabled?: boolean;\n /**\n * If true, the control will be read-only.\n */\n readOnly?: boolean;\n /**\n * If true, the list will be open by default.\n */\n defaultOpen?: boolean;\n /**\n * If true, the list will be open. Useful for controlling the component.\n */\n open?: boolean;\n /**\n * Callback fired when the open state changes.\n */\n onOpenChange?: (newOpen: boolean, reason?: OpenChangeReason) => void;\n /**\n * The default selected options. If this is provided `defaultValue` should be provided as well.\n */\n defaultSelected?: Item[];\n /**\n * The selected options. The component will be controlled if this prop is provided.\n */\n selected?: Item[];\n /**\n * Callback fired when the selected options change.\n */\n onSelectionChange?: (event: SyntheticEvent, newSelected: Item[]) => void;\n /**\n * If true, multiple options can be selected.\n */\n multiselect?: boolean;\n /**\n * Callback used to convert an option's `value` to a string. This is needed when the value is different to the display value or the value is not a string.\n */\n valueToString?: (item: Item) => string;\n};\n\nexport function defaultValueToString<Item>(item: Item): string {\n return String(item);\n}\n\nexport function useListControl<Item>(props: ListControlProps<Item>) {\n const {\n open: openProp,\n defaultOpen,\n onOpenChange,\n multiselect,\n defaultSelected,\n selected: selectedProp,\n onSelectionChange,\n disabled,\n readOnly,\n valueToString = defaultValueToString,\n } = props;\n\n const listRef = useRef<HTMLDivElement>(null);\n const [listElement, setListElement] = useState<HTMLDivElement | null>(null);\n const setListRef = useForkRef<HTMLDivElement>(listRef, setListElement);\n\n const [focusedState, setFocusedState] = useState(false);\n const [focusVisibleState, setFocusVisibleState] = useState(false);\n\n useEffect(() => {\n // remove focus when controlling disabled\n if (disabled && focusedState) {\n setFocusedState(false);\n setFocusVisibleState(false);\n }\n }, [disabled, focusedState]);\n\n const [activeState, setActiveState] = useState<OptionValue<Item> | undefined>(\n undefined,\n );\n\n const setActive = useCallback((option?: OptionValue<Item>) => {\n if (option) {\n setActiveState(option);\n } else {\n setActiveState(undefined);\n }\n }, []);\n\n const [openState, setOpenState] = useControlled({\n controlled: openProp,\n default: Boolean(defaultOpen),\n name: \"ListControl\",\n state: \"open\",\n });\n\n const openKey = useRef<string | undefined>(undefined);\n\n const setOpen = (\n newOpen: boolean,\n reason?: OpenChangeReason,\n key?: string,\n ) => {\n if (disabled || readOnly) {\n return;\n }\n\n setOpenState(newOpen);\n openKey.current = key;\n\n if (newOpen !== openState) {\n onOpenChange?.(newOpen, reason);\n }\n };\n\n const [selectedState, setSelectedState] = useControlled({\n controlled: selectedProp,\n default: defaultSelected ?? [],\n name: \"ListControl\",\n state: \"selected\",\n });\n\n const select = (event: SyntheticEvent, option: OptionValue<Item>) => {\n if (option.disabled || readOnly || disabled) {\n return;\n }\n\n let newSelected = [option.value];\n\n if (multiselect) {\n if (selectedState.includes(option.value)) {\n newSelected = selectedState.filter((item) => item !== option.value);\n } else {\n newSelected = selectedState.concat([option.value]);\n }\n }\n\n setSelectedState(newSelected);\n onSelectionChange?.(event, newSelected);\n\n if (!multiselect) {\n setOpen(false);\n }\n };\n\n const clear = (event: SyntheticEvent) => {\n setSelectedState([]);\n if (selectedState.length !== 0) {\n onSelectionChange?.(event, []);\n }\n };\n\n const optionsRef = useRef<\n { data: OptionValue<Item>; element: HTMLElement }[]\n >([]);\n\n const register = useCallback(\n (optionValue: OptionValue<Item>, element: HTMLElement) => {\n const { id } = optionValue;\n\n // Remove any existing entry with the same id to prevent duplicates.\n // This is needed for virtualization where components may re-register.\n const existingIndex = optionsRef.current.findIndex(\n (item) => item.data.id === id,\n );\n if (existingIndex !== -1) {\n optionsRef.current.splice(existingIndex, 1);\n }\n\n optionsRef.current.push({ data: optionValue, element });\n\n return () => {\n optionsRef.current = optionsRef.current.filter(\n (item) => item.data.id !== id,\n );\n };\n },\n [],\n );\n\n useEffect(() => {\n const sortOptions = () => {\n optionsRef.current = optionsRef.current\n .filter((a) => a.element.isConnected)\n .sort(({ element: a }, { element: b }) => {\n if (a === b) return 0;\n const pos = a.compareDocumentPosition(b);\n if (pos & Node.DOCUMENT_POSITION_FOLLOWING) return -1;\n if (pos & Node.DOCUMENT_POSITION_PRECEDING) return 1;\n // Disconnected / impl-specific — keep input order (stable) or add your own rule\n return 0;\n });\n };\n\n const mutationObserver = new MutationObserver((mutations) => {\n const optionsChanged = mutations.some((mutation) =>\n Array.from(mutation.addedNodes).some(\n (node) =>\n node instanceof HTMLElement && node.matches?.('[role=\"option\"]'),\n ),\n );\n\n if (optionsChanged) {\n sortOptions();\n }\n });\n\n if (!listElement) return;\n mutationObserver.observe(listElement, {\n childList: true,\n subtree: true,\n });\n\n sortOptions();\n\n return () => mutationObserver.disconnect();\n }, [listElement]);\n\n const getOptionAtIndex = useCallback(\n (\n index: number,\n ): { data: OptionValue<Item>; element: HTMLElement } | undefined => {\n return optionsRef.current[index];\n },\n [],\n );\n\n const getIndexOfOption = useCallback((option: OptionValue<Item>) => {\n return optionsRef.current.findIndex(\n (item) => item.data.value === option.value,\n );\n }, []);\n\n const getOptionsMatching = useCallback(\n (predicate: (option: OptionValue<Item>) => boolean) => {\n return optionsRef.current.filter((item) => predicate(item.data));\n },\n [],\n );\n\n const getOptionFromSearch = useCallback(\n (search: string, startFrom?: OptionValue<Item>) => {\n const collator = new Intl.Collator(\"en\", {\n usage: \"search\",\n sensitivity: \"base\",\n });\n\n const startIndex = startFrom ? getIndexOfOption(startFrom) + 1 : 0;\n const searchList = optionsRef.current.map((item) => item.data);\n\n let matches = searchList.filter(\n (option) =>\n collator.compare(\n valueToString(option.value).substring(0, search.length),\n search,\n ) === 0,\n );\n\n if (matches.length === 0) {\n const letters = search.split(\"\");\n const allSameLetter =\n letters.length > 0 &&\n letters.every((letter) => collator.compare(letter, letters[0]) === 0);\n if (allSameLetter) {\n matches = searchList.filter(\n (option) =>\n collator.compare(\n valueToString(option.value)[0].toLowerCase(),\n letters[0],\n ) === 0,\n );\n }\n }\n\n return matches.find((option) => getIndexOfOption(option) >= startIndex);\n },\n [getIndexOfOption, valueToString],\n );\n\n const getFirstOption = useCallback(() => {\n return getOptionAtIndex(0);\n }, [getOptionAtIndex]);\n\n const getLastOption = useCallback(() => {\n return getOptionAtIndex(optionsRef.current.length - 1);\n }, [getOptionAtIndex]);\n\n const getOptionBefore = useCallback(\n (option: OptionValue<Item>) => {\n const index = getIndexOfOption(option);\n return getOptionAtIndex(index - 1);\n },\n [getIndexOfOption, getOptionAtIndex],\n );\n\n const getOptionAfter = useCallback(\n (option: OptionValue<Item>) => {\n const index = getIndexOfOption(option);\n return getOptionAtIndex(index + 1);\n },\n [getIndexOfOption, getOptionAtIndex],\n );\n\n const getOptionPageAbove = useCallback(\n (start: OptionValue<Item>) => {\n const list = listRef.current;\n let option = optionsRef.current.find((option) => option.data === start);\n\n if (!list || !option) {\n return undefined;\n }\n\n const containerRect = list.getBoundingClientRect();\n let optionRect: DOMRect | undefined =\n option.element.getBoundingClientRect();\n\n const listY = containerRect.y - list.scrollTop;\n const pageY = Math.max(\n 0,\n optionRect.y - listY + optionRect.height - containerRect.height,\n );\n\n while (option && optionRect && optionRect.y - listY > pageY) {\n option = getOptionBefore(option.data);\n optionRect = option?.element?.getBoundingClientRect();\n }\n\n return option ?? getFirstOption();\n },\n [getFirstOption, getOptionBefore],\n );\n\n const getOptionPageBelow = useCallback(\n (start: OptionValue<Item>) => {\n const list = listRef.current;\n let option = optionsRef.current.find((option) => option.data === start);\n\n if (!list || !option) {\n return undefined;\n }\n\n const containerRect = list.getBoundingClientRect();\n let optionRect: DOMRect | undefined =\n option.element.getBoundingClientRect();\n\n const listY = containerRect.y - list.scrollTop;\n const pageY = Math.min(\n list.scrollHeight,\n optionRect.y - listY - optionRect.height + containerRect.height,\n );\n\n while (option && optionRect && optionRect.y - listY < pageY) {\n option = getOptionAfter(option.data);\n optionRect = option?.element.getBoundingClientRect();\n }\n\n return option ?? getLastOption();\n },\n [getLastOption, getOptionAfter],\n );\n\n useEffect(() => {\n if (listRef.current) {\n const activeElement = optionsRef.current.find(\n (option) => option.data === activeState,\n )?.element;\n\n if (!activeElement) {\n return;\n }\n\n activeElement.scrollIntoView({\n block: \"nearest\",\n inline: \"nearest\",\n });\n }\n }, [activeState]);\n\n return {\n multiselect: Boolean(multiselect),\n openState,\n setOpen,\n openKey,\n activeState,\n setActive,\n selectedState,\n setSelectedState,\n select,\n clear,\n focusVisibleState,\n setFocusVisibleState,\n focusedState,\n setFocusedState,\n setListRef,\n listRef,\n options: optionsRef.current.map((option) => option.element),\n register,\n getOptionAtIndex,\n getIndexOfOption,\n getOptionsMatching,\n getOptionFromSearch,\n getOptionAfter,\n getOptionBefore,\n getOptionPageAbove,\n getOptionPageBelow,\n getFirstOption,\n getLastOption,\n valueToString,\n disabled,\n };\n}\n"],"names":["option"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ListControlState.js","sources":["../src/list-control/ListControlState.ts"],"sourcesContent":["import {\n type SyntheticEvent,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport {\n useControlled,\n useEventCallback,\n useForkRef,\n useIsomorphicLayoutEffect,\n} from \"../utils\";\nimport type { OptionValue } from \"./ListControlContext\";\nimport { ListControlOptionStore } from \"./ListControlOptionStore\";\nimport {\n createCoalescedRebuild,\n ListControlRegistry,\n type RegisteredOption,\n} from \"./ListControlRegistry\";\n\nexport type OpenChangeReason = \"input\" | \"manual\";\n\nexport type ListControlProps<Item> = {\n /**\n * If true, the control will be disabled.\n */\n disabled?: boolean;\n /**\n * If true, the control will be read-only.\n */\n readOnly?: boolean;\n /**\n * If true, the list will be open by default.\n */\n defaultOpen?: boolean;\n /**\n * If true, the list will be open. Useful for controlling the component.\n */\n open?: boolean;\n /**\n * Callback fired when the open state changes.\n */\n onOpenChange?: (newOpen: boolean, reason?: OpenChangeReason) => void;\n /**\n * The default selected options. If this is provided `defaultValue` should be provided as well.\n */\n defaultSelected?: Item[];\n /**\n * The selected options. The component will be controlled if this prop is provided.\n */\n selected?: Item[];\n /**\n * Callback fired when the selected options change.\n */\n onSelectionChange?: (event: SyntheticEvent, newSelected: Item[]) => void;\n /**\n * If true, multiple options can be selected.\n */\n multiselect?: boolean;\n /**\n * Callback used to convert an option's `value` to a string. This is needed when the value is different to the display value or the value is not a string.\n */\n valueToString?: (item: Item) => string;\n};\n\nexport function defaultValueToString<Item>(item: Item): string {\n return String(item);\n}\n\nexport function findOptionFromSearch<Item>(\n options: readonly Pick<RegisteredOption<Item>, \"data\">[],\n search: string,\n valueToString: (item: Item) => string,\n startFrom?: OptionValue<Item>,\n): OptionValue<Item> | undefined {\n const collator = new Intl.Collator(\"en\", {\n usage: \"search\",\n sensitivity: \"base\",\n });\n const startFromIndex = startFrom\n ? options.findIndex((item) => item.data.value === startFrom.value)\n : -1;\n const startIndex = startFrom ? startFromIndex + 1 : 0;\n const firstIndexByValue = new Map<Item, number>();\n\n for (let index = 0; index < options.length; index++) {\n const value = options[index].data.value;\n // Strict equality, used by the legacy lookup, never matches NaN.\n if (\n (typeof value !== \"number\" || !Number.isNaN(value)) &&\n !firstIndexByValue.has(value)\n ) {\n firstIndexByValue.set(value, index);\n }\n }\n\n const letters = search.split(\"\");\n const allSameLetter =\n letters.length > 0 &&\n letters.every((letter) => collator.compare(letter, letters[0]) === 0);\n let repeatedCharacterMatch: OptionValue<Item> | undefined;\n\n for (let offset = 0; offset < options.length; offset++) {\n const index = (startIndex + offset) % options.length;\n const option = options[index].data;\n\n if (firstIndexByValue.get(option.value) !== index) {\n continue;\n }\n\n const optionText = valueToString(option.value);\n if (\n collator.compare(optionText.substring(0, search.length), search) === 0\n ) {\n return option;\n }\n\n if (\n repeatedCharacterMatch === undefined &&\n allSameLetter &&\n collator.compare(optionText[0]?.toLowerCase(), letters[0]) === 0\n ) {\n repeatedCharacterMatch = option;\n }\n }\n\n return repeatedCharacterMatch;\n}\n\nexport function useListControl<Item>(props: ListControlProps<Item>) {\n const {\n open: openProp,\n defaultOpen,\n onOpenChange,\n multiselect,\n defaultSelected,\n selected: selectedProp,\n onSelectionChange,\n disabled,\n readOnly,\n valueToString = defaultValueToString,\n } = props;\n\n const optionStateStoreRef = useRef<ListControlOptionStore<Item> | null>(null);\n if (optionStateStoreRef.current === null) {\n optionStateStoreRef.current = new ListControlOptionStore(\n selectedProp ?? defaultSelected ?? [],\n );\n }\n const optionStateStore = optionStateStoreRef.current;\n\n const listRef = useRef<HTMLDivElement>(null);\n const [listElement, setListElement] = useState<HTMLDivElement | null>(null);\n const setListRef = useForkRef<HTMLDivElement>(listRef, setListElement);\n\n const [focusedState, setFocusedState] = useState(false);\n const [focusVisibleState, setFocusVisibleState] = useState(false);\n\n useEffect(() => {\n // remove focus when controlling disabled\n if (disabled && focusedState) {\n setFocusedState(false);\n setFocusVisibleState(false);\n }\n }, [disabled, focusedState]);\n\n const [activeState, setActive] = useState<OptionValue<Item> | undefined>(\n undefined,\n );\n\n const [openState, setOpenState] = useControlled({\n controlled: openProp,\n default: Boolean(defaultOpen),\n name: \"ListControl\",\n state: \"open\",\n });\n\n const openKey = useRef<string | undefined>(undefined);\n\n const setOpen = (\n newOpen: boolean,\n reason?: OpenChangeReason,\n key?: string,\n ) => {\n if (disabled || readOnly) {\n return;\n }\n\n setOpenState(newOpen);\n openKey.current = key;\n\n if (newOpen !== openState) {\n onOpenChange?.(newOpen, reason);\n }\n };\n\n const [selectedState, setSelectedState] = useControlled({\n controlled: selectedProp,\n default: defaultSelected ?? [],\n name: \"ListControl\",\n state: \"selected\",\n });\n\n const select = useEventCallback(\n (event: SyntheticEvent, option: OptionValue<Item>) => {\n if (option.disabled || readOnly || disabled) {\n return;\n }\n\n let newSelected = [option.value];\n\n if (multiselect) {\n if (selectedState.includes(option.value)) {\n newSelected = selectedState.filter((item) => item !== option.value);\n } else {\n newSelected = selectedState.concat([option.value]);\n }\n }\n\n setSelectedState(newSelected);\n onSelectionChange?.(event, newSelected);\n\n if (!multiselect) {\n setOpen(false);\n }\n },\n );\n\n const clear = (event: SyntheticEvent) => {\n setSelectedState([]);\n if (selectedState.length !== 0) {\n onSelectionChange?.(event, []);\n }\n };\n\n const registryRef = useRef<ListControlRegistry<Item> | null>(null);\n if (registryRef.current === null) {\n registryRef.current = new ListControlRegistry<Item>();\n }\n const registry = registryRef.current;\n const scheduleRebuildRef = useRef<(() => void) | undefined>(undefined);\n\n // React state (including controlled props) is authoritative. The store only\n // publishes committed state to the affected Options.\n useIsomorphicLayoutEffect(() => {\n optionStateStore.setActiveId(activeState?.id);\n }, [activeState?.id, optionStateStore]);\n\n useIsomorphicLayoutEffect(() => {\n optionStateStore.setFocusVisible(focusVisibleState);\n }, [focusVisibleState, optionStateStore]);\n\n useIsomorphicLayoutEffect(() => {\n optionStateStore.setSelected(selectedState);\n }, [optionStateStore, selectedState]);\n\n const register = useCallback(\n (optionValue: OptionValue<Item>, element: HTMLElement) => {\n const unregisterOptionState = optionStateStore.register(optionValue);\n const unregisterRegistry = registry.register(optionValue, element);\n // Changes to option metadata need not produce a child-list mutation.\n scheduleRebuildRef.current?.();\n return () => {\n unregisterRegistry();\n unregisterOptionState();\n scheduleRebuildRef.current?.();\n };\n },\n [optionStateStore, registry],\n );\n\n useEffect(() => {\n if (!listElement) return;\n const rebuild = () => {\n // Registration can queue this job before MutationObserver delivery.\n // The current DOM includes those mutations, so consume them here to\n // avoid rebuilding the same collection again from the observer.\n mutationObserver.takeRecords();\n registry.rebuild(listElement);\n };\n const coalescedRebuild = createCoalescedRebuild(rebuild);\n scheduleRebuildRef.current = coalescedRebuild.schedule;\n const containsOption = (node: Node) =>\n node.nodeType === Node.ELEMENT_NODE &&\n ((node as Element).matches('[role=\"option\"]') ||\n (node as Element).querySelector('[role=\"option\"]') !== null);\n const mutationObserver = new MutationObserver((mutations) => {\n // Check added AND removed subtrees so moving a group is handled too.\n // Checkmarks, badges, and other option content do not change DOM order.\n if (\n mutations.some(\n ({ addedNodes, removedNodes }) =>\n Array.from(addedNodes).some(containsOption) ||\n Array.from(removedNodes).some(containsOption),\n )\n ) {\n coalescedRebuild.schedule();\n }\n });\n mutationObserver.observe(listElement, {\n childList: true,\n subtree: true,\n });\n\n rebuild();\n\n return () => {\n scheduleRebuildRef.current = undefined;\n coalescedRebuild.cancel();\n mutationObserver.disconnect();\n };\n }, [listElement, registry]);\n\n const getOptionAtIndex = useCallback(\n (\n index: number,\n ): { data: OptionValue<Item>; element: HTMLElement } | undefined => {\n return registry.getAt(index);\n },\n [registry],\n );\n\n const getIndexOfOption = useCallback(\n (option: OptionValue<Item>) => {\n return registry.indexOfValue(option.value);\n },\n [registry],\n );\n\n const getOptionsMatching = useCallback(\n (predicate: (option: OptionValue<Item>) => boolean) => {\n return registry.matching(predicate);\n },\n [registry],\n );\n\n const getOptionFromSearch = useCallback(\n (search: string, startFrom?: OptionValue<Item>) => {\n return findOptionFromSearch(\n registry.snapshot(),\n search,\n valueToString,\n startFrom,\n );\n },\n [registry, valueToString],\n );\n\n const getFirstOption = useCallback(() => {\n return getOptionAtIndex(0);\n }, [getOptionAtIndex]);\n\n const getLastOption = useCallback(() => {\n return getOptionAtIndex(registry.length - 1);\n }, [getOptionAtIndex, registry]);\n\n const getOptionBefore = useCallback(\n (option: OptionValue<Item>) => {\n const index = registry.indexOfId(option.id);\n return getOptionAtIndex(index - 1);\n },\n [getOptionAtIndex, registry],\n );\n\n const getOptionAfter = useCallback(\n (option: OptionValue<Item>) => {\n const index = registry.indexOfId(option.id);\n return getOptionAtIndex(index + 1);\n },\n [getOptionAtIndex, registry],\n );\n\n const getOptionPageAbove = useCallback(\n (start: OptionValue<Item>) => {\n const list = listRef.current;\n let option = registry.findByData(start);\n\n if (!list || !option) {\n return undefined;\n }\n\n const containerRect = list.getBoundingClientRect();\n let optionRect: DOMRect | undefined =\n option.element.getBoundingClientRect();\n\n const listY = containerRect.y - list.scrollTop;\n const pageY = Math.max(\n 0,\n optionRect.y - listY + optionRect.height - containerRect.height,\n );\n\n while (option && optionRect && optionRect.y - listY > pageY) {\n option = getOptionBefore(option.data);\n optionRect = option?.element?.getBoundingClientRect();\n }\n\n return option ?? getFirstOption();\n },\n [getFirstOption, getOptionBefore, registry],\n );\n\n const getOptionPageBelow = useCallback(\n (start: OptionValue<Item>) => {\n const list = listRef.current;\n let option = registry.findByData(start);\n\n if (!list || !option) {\n return undefined;\n }\n\n const containerRect = list.getBoundingClientRect();\n let optionRect: DOMRect | undefined =\n option.element.getBoundingClientRect();\n\n const listY = containerRect.y - list.scrollTop;\n const pageY = Math.min(\n list.scrollHeight,\n optionRect.y - listY - optionRect.height + containerRect.height,\n );\n\n while (option && optionRect && optionRect.y - listY < pageY) {\n option = getOptionAfter(option.data);\n optionRect = option?.element.getBoundingClientRect();\n }\n\n return option ?? getLastOption();\n },\n [getLastOption, getOptionAfter, registry],\n );\n\n useEffect(() => {\n if (listRef.current) {\n const activeElement = activeState\n ? registry.findByData(activeState)?.element\n : undefined;\n\n if (!activeElement) {\n return;\n }\n\n activeElement.scrollIntoView({\n block: \"nearest\",\n inline: \"nearest\",\n });\n }\n }, [activeState, registry]);\n\n return {\n multiselect: Boolean(multiselect),\n openState,\n setOpen,\n openKey,\n activeState,\n setActive,\n selectedState,\n setSelectedState,\n select,\n clear,\n focusVisibleState,\n setFocusVisibleState,\n focusedState,\n setFocusedState,\n setListRef,\n listRef,\n register,\n getOptionAtIndex,\n getIndexOfOption,\n getOptionsMatching,\n getOptionFromSearch,\n getOptionAfter,\n getOptionBefore,\n getOptionPageAbove,\n getOptionPageBelow,\n getFirstOption,\n getLastOption,\n valueToString,\n disabled,\n optionStateStore,\n };\n}\n"],"names":["_a"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var css_248z = ".saltMegaMenuGroupHeading {\n display: flex;\n align-items: center;\n margin: 0 0 var(--salt-spacing-50);\n padding: var(--salt-spacing-50) var(--salt-spacing-100);\n border-bottom: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-separable-tertiary-borderColor);\n min-height: var(--salt-size-base);\n font-family: var(--salt-text-
|
|
1
|
+
var css_248z = ".saltMegaMenuGroupHeading {\n display: flex;\n align-items: center;\n margin: 0 0 var(--salt-spacing-50);\n padding: var(--salt-spacing-50) var(--salt-spacing-100);\n border-bottom: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-separable-tertiary-borderColor);\n min-height: var(--salt-size-base);\n font-family: var(--salt-text-fontFamily);\n font-size: var(--salt-text-label-fontSize);\n font-weight: var(--salt-text-fontWeight-strong);\n line-height: var(--salt-text-label-lineHeight);\n letter-spacing: var(--salt-text-letterSpacing);\n color: var(--salt-content-secondary-foreground);\n}\n";
|
|
2
2
|
|
|
3
3
|
export { css_248z as default };
|
|
4
4
|
//# sourceMappingURL=MegaMenuGroupHeading.css.js.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var css_248z = ".saltMegaMenuListItem {\n list-style: none;\n display: flex;\n flex-direction: column;\n}\n\n.saltMegaMenuListItem-wrapper {\n display: flex;\n padding: var(--salt-spacing-50) var(--salt-spacing-100);\n align-items: flex-start;\n color: var(--salt-content-primary-foreground);\n background: var(--salt-selectable-background);\n cursor: var(--salt-cursor-hover);\n min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n box-sizing: border-box;\n gap: var(--salt-spacing-100);\n position: relative;\n border-radius: var(--salt-palette-corner-weak, 0);\n text-decoration: none;\n border: none;\n font: inherit;\n text-align: start;\n}\n\n.saltMegaMenuListItem-wrapper > .saltIcon {\n display: flex;\n height: var(--salt-size-base);\n align-items: center;\n}\n\n.saltMegaMenuListItem-content {\n flex: 1 0;\n margin: var(--salt-spacing-75) 0;\n font-family: var(--salt-text-fontFamily);\n font-size: var(--salt-text-fontSize);\n font-weight: var(--salt-text-fontWeight);\n line-height: var(--salt-text-lineHeight);\n}\n\n.saltMegaMenuListItem-wrapper:focus-visible {\n outline: var(--salt-focused-outline);\n outline-offset: calc(var(--salt-size-fixed-100) * -2);\n}\n\n.saltMegaMenuListItem-wrapper:hover:not(:focus-visible) {\n outline: none;\n background: var(--salt-overlayable-background-hover);\n}\n\n.saltMegaMenuListItem-wrapper:active {\n background: var(--salt-navigable-accent-background-active);\n}\n\n.saltMegaMenuListItem-wrapper:active::before {\n content: \"\";\n position: absolute;\n inset: 0;\n box-sizing: border-box;\n border-radius: inherit;\n border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-navigable-accent-borderColor-active);\n pointer-events: none;\n}\n";
|
|
1
|
+
var css_248z = ".saltMegaMenuListItem {\n list-style: none;\n display: flex;\n flex-direction: column;\n}\n\n.saltMegaMenuListItem-wrapper {\n display: flex;\n padding: var(--salt-spacing-50) var(--salt-spacing-100);\n align-items: flex-start;\n color: var(--salt-content-primary-foreground);\n background: var(--salt-selectable-background);\n cursor: var(--salt-cursor-hover);\n min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n box-sizing: border-box;\n gap: var(--salt-spacing-100);\n position: relative;\n border-radius: var(--salt-palette-corner-weak, 0);\n text-decoration: none;\n border: none;\n font: inherit;\n text-align: start;\n}\n\n.saltMegaMenuListItem-wrapper > .saltIcon {\n display: flex;\n height: var(--salt-size-base);\n align-items: center;\n}\n\n.saltMegaMenuListItem-content {\n flex: 1 0;\n margin: var(--salt-spacing-75) 0;\n font-family: var(--salt-text-fontFamily);\n font-size: var(--salt-text-fontSize);\n font-weight: var(--salt-text-fontWeight);\n line-height: var(--salt-text-lineHeight);\n letter-spacing: var(--salt-text-letterSpacing);\n}\n\n.saltMegaMenuListItem-wrapper:focus-visible {\n outline: var(--salt-focused-outline);\n outline-offset: calc(var(--salt-size-fixed-100) * -2);\n}\n\n.saltMegaMenuListItem-wrapper:hover:not(:focus-visible) {\n outline: none;\n background: var(--salt-overlayable-background-hover);\n}\n\n.saltMegaMenuListItem-wrapper:active {\n background: var(--salt-navigable-accent-background-active);\n}\n\n.saltMegaMenuListItem-wrapper:active::before {\n content: \"\";\n position: absolute;\n inset: 0;\n box-sizing: border-box;\n border-radius: inherit;\n border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-navigable-accent-borderColor-active);\n pointer-events: none;\n}\n";
|
|
2
2
|
|
|
3
3
|
export { css_248z as default };
|
|
4
4
|
//# sourceMappingURL=MegaMenuListItem.css.js.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var css_248z = ".saltMenuGroup-label {\n background: var(--salt-container-primary-background);\n color: var(--salt-content-secondary-foreground);\n font-size: var(--salt-text-label-fontSize);\n font-weight: var(--salt-text-label-fontWeight-strong);\n font-family: var(--salt-text-
|
|
1
|
+
var css_248z = ".saltMenuGroup-label {\n background: var(--salt-container-primary-background);\n color: var(--salt-content-secondary-foreground);\n font-size: var(--salt-text-label-fontSize);\n font-weight: var(--salt-text-label-fontWeight-strong);\n font-family: var(--salt-text-fontFamily);\n line-height: var(--salt-text-label-lineHeight);\n letter-spacing: var(--salt-text-letterSpacing);\n height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n padding: calc(var(--salt-spacing-100) + var(--salt-spacing-25)) var(--salt-spacing-100);\n display: flex;\n box-sizing: border-box;\n}\n\n.saltMenuGroup {\n border-top: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-separable-tertiary-borderColor);\n}\n\n.saltMenuGroup:first-of-type {\n border-top: 0;\n}\n";
|
|
2
2
|
|
|
3
3
|
export { css_248z as default };
|
|
4
4
|
//# sourceMappingURL=MenuGroup.css.js.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var css_248z = ".saltMenuItem {\n color: var(--salt-content-primary-foreground);\n background: var(--salt-selectable-background);\n font-size: var(--salt-text-fontSize);\n font-weight: var(--salt-text-fontWeight);\n font-family: var(--salt-text-fontFamily);\n line-height: var(--salt-text-lineHeight);\n letter-spacing: var(--salt-text-letterSpacing);\n min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n padding: calc(var(--salt-spacing-100) + var(--salt-spacing-25)) var(--salt-spacing-100);\n display: flex;\n gap: var(--salt-spacing-100);\n position: relative;\n cursor: var(--salt-cursor-hover);\n box-sizing: border-box;\n flex-shrink: 0;\n}\n\n.saltMenuItem:focus-visible {\n outline: var(--salt-focused-outline);\n outline-offset: calc(var(--salt-size-fixed-100) * -2);\n}\n\n.saltMenuItem:hover {\n outline: none;\n}\n\n.saltMenuItem:hover,\n.saltMenuItem:focus-visible {\n background: var(--salt-selectable-background-hover);\n}\n\n.saltMenuItem:active {\n background: var(--salt-selectable-background-selected);\n box-shadow:\n 0 calc(var(--salt-size-fixed-100) * -1) 0 0 var(--salt-selectable-borderColor-selected),\n 0 var(--salt-size-fixed-100) 0 0 var(--salt-selectable-borderColor-selected);\n}\n\n.saltMenuItem[aria-disabled=\"true\"],\n.saltMenuItem[aria-disabled=\"true\"]:active {\n background: var(--salt-selectable-background
|
|
1
|
+
var css_248z = ".saltMenuItem {\n color: var(--salt-content-primary-foreground);\n background: var(--salt-selectable-background);\n font-size: var(--salt-text-fontSize);\n font-weight: var(--salt-text-fontWeight);\n font-family: var(--salt-text-fontFamily);\n line-height: var(--salt-text-lineHeight);\n letter-spacing: var(--salt-text-letterSpacing);\n min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n padding: calc(var(--salt-spacing-100) + var(--salt-spacing-25)) var(--salt-spacing-100);\n display: flex;\n gap: var(--salt-spacing-100);\n position: relative;\n cursor: var(--salt-cursor-hover);\n box-sizing: border-box;\n flex-shrink: 0;\n}\n\n.saltMenuItem:focus-visible {\n outline: var(--salt-focused-outline);\n outline-offset: calc(var(--salt-size-fixed-100) * -2);\n}\n\n.saltMenuItem:hover {\n outline: none;\n}\n\n.saltMenuItem:hover,\n.saltMenuItem:focus-visible {\n background: var(--salt-selectable-background-hover);\n}\n\n.saltMenuItem:active {\n background: var(--salt-selectable-background-selected);\n box-shadow:\n 0 calc(var(--salt-size-fixed-100) * -1) 0 0 var(--salt-selectable-borderColor-selected),\n 0 var(--salt-size-fixed-100) 0 0 var(--salt-selectable-borderColor-selected);\n}\n\n.saltMenuItem[aria-disabled=\"true\"],\n.saltMenuItem[aria-disabled=\"true\"]:active {\n opacity: 0.4;\n background: var(--salt-selectable-background);\n color: var(--salt-content-primary-foreground);\n cursor: var(--salt-cursor-disabled);\n box-shadow: none;\n}\n\n.saltMenuItem-blurActive {\n z-index: var(--salt-zIndex-default);\n background: var(--salt-selectable-background-selected);\n box-shadow:\n 0 calc(var(--salt-size-fixed-100) * -1) 0 0 var(--salt-selectable-borderColor-selected),\n 0 var(--salt-size-fixed-100) 0 0 var(--salt-selectable-borderColor-selected);\n}\n\n/* TODO: Find a better way of doing this */\n.saltMenuItem .saltIcon:not(.saltCheckboxIcon-icon) {\n min-height: var(--salt-text-lineHeight);\n}\n\n.saltMenuItem-expandIcon.saltIcon {\n margin-left: auto;\n}\n";
|
|
2
2
|
|
|
3
3
|
export { css_248z as default };
|
|
4
4
|
//# sourceMappingURL=MenuItem.css.js.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var css_248z = ".saltNavigationItem {\n color: var(--salt-content-primary-foreground);\n line-height: var(--salt-text-lineHeight);\n font-family: var(--salt-text-fontFamily);\n font-size: var(--salt-text-fontSize);\n font-weight: var(--salt-text-fontWeight);\n}\n\n/* Vars applied to root NavigationItem component */\n.saltNavigationItem-wrapper {\n display: flex;\n gap: var(--salt-spacing-100);\n align-items: center;\n position: relative;\n background: none;\n border: none;\n font: inherit;\n color: inherit;\n text-decoration: none;\n cursor: var(--salt-cursor-hover);\n /* Hover off animation */\n transition: all var(--salt-duration-instant) ease-in-out;\n box-sizing: border-box;\n}\n\n/* Vars applied to NavigationItem component when root */\n.saltNavigationItem-rootItem {\n font-weight: var(--salt-text-fontWeight-strong);\n}\n\n/* Styles applied to NavigationItem icon */\n.saltNavigationItem-label .saltIcon {\n top: var(--salt-spacing-25);\n}\n\n/* Styles applied when orientation = \"horizontal\" */\n.saltNavigationItem-horizontal {\n min-height: calc(var(--salt-size-base) + var(--salt-spacing-100) * 2);\n padding: 0 var(--salt-spacing-100);\n width: fit-content;\n}\n\n/* Styles applied when orientation = \"vertical\" */\n.saltNavigationItem-vertical {\n min-height: calc(var(--salt-size-base) + var(--salt-spacing-50) * 2);\n padding-top: 0;\n padding-bottom: 0;\n padding-right: var(--salt-spacing-100);\n padding-left: calc(var(--salt-spacing-300) * (min(var(--saltNavigationItem-level, 0) + 1, 2)));\n width: 100%;\n}\n\n/* Styles applied to NavigationItem label */\n.saltNavigationItem-label {\n padding-left: calc(var(--saltNavigationItem-level, 0) * var(--salt-spacing-100));\n flex: 1;\n text-align: left;\n display: flex;\n align-items: baseline;\n gap: var(--salt-spacing-100);\n}\n\n/* Styles applied when orientation = \"horizontal\" */\n.saltNavigationItem-horizontal {\n min-height: calc(var(--salt-size-base) + var(--salt-spacing-100) * 2);\n padding: 0 var(--salt-spacing-100);\n width: fit-content;\n}\n\n/* Styles applied when orientation = \"vertical\" */\n.saltNavigationItem-vertical {\n --saltButton-margin: var(--salt-spacing-50) 0;\n\n min-height: calc(var(--salt-size-base) + var(--salt-spacing-50) * 2);\n padding-right: var(--salt-spacing-100);\n padding-left: calc(var(--salt-spacing-300) * (min(var(--saltNavigationItem-level, 0) + 1, 2)));\n width: 100%;\n}\n\n/* Styles applied to NavigationItem label */\n.saltNavigationItem-label {\n padding-left: calc(var(--saltNavigationItem-level, 0) * var(--salt-spacing-100));\n flex: 1;\n text-align: left;\n display: flex;\n align-items: baseline;\n gap: var(--salt-spacing-100);\n}\n\n/* Styles applied to NavigationItem Badge */\n.saltNavigationItem-label .saltBadge {\n margin-left: auto;\n}\n\n/* Styles applied to NavigationItem when focus is visible */\n.saltNavigationItem-wrapper:focus-visible {\n outline: var(--salt-focused-outline);\n}\n\n/* Styles applied to NavigationItem for non-keyboard focus */\n.saltNavigationItem-wrapper:focus:not(:focus-visible) {\n outline: 0;\n}\n\n/* Styles applied to activation line */\n.saltNavigationItem-wrapper::after {\n content: \"\";\n position: absolute;\n top: var(--salt-spacing-25);\n left: 0;\n display: block;\n}\n\n/* Styles applied to activation line when orientation = \"horizontal\" */\n.saltNavigationItem-horizontal::after {\n width: 100%;\n height: var(--salt-size-indicator);\n}\n\n/* Styles applied to activation line when orientation = \"vertical\" */\n.saltNavigationItem-vertical::after {\n width: var(--salt-size-indicator);\n left: var(--salt-spacing-25);\n height: calc(100% - var(--salt-spacing-50));\n}\n\n/* Styles applied to activation line on hover */\n.saltNavigationItem-wrapper:hover::after,\n.saltNavigationItem-wrapper:focus-visible::after {\n background: var(--salt-navigable-indicator-hover);\n /* Hover on animation */\n transition: background var(--salt-duration-perceptible) ease-in-out;\n}\n\n/* Styles applied to activation line when item is active */\n.saltNavigationItem-active::after,\n.saltNavigationItem-active:hover::after,\n.saltNavigationItem-active:focus::after {\n background: var(--salt-navigable-accent-indicator-active);\n /* Hover on animation */\n transition: background var(--salt-duration-perceptible) ease-in-out;\n}\n";
|
|
1
|
+
var css_248z = ".saltNavigationItem {\n color: var(--salt-content-primary-foreground);\n line-height: var(--salt-text-lineHeight);\n font-family: var(--salt-text-fontFamily);\n font-size: var(--salt-text-fontSize);\n font-weight: var(--salt-text-fontWeight);\n letter-spacing: var(--salt-text-letterSpacing);\n}\n\n/* Vars applied to root NavigationItem component */\n.saltNavigationItem-wrapper {\n display: flex;\n gap: var(--salt-spacing-100);\n align-items: center;\n position: relative;\n background: none;\n border: none;\n font: inherit;\n color: inherit;\n text-decoration: none;\n cursor: var(--salt-cursor-hover);\n /* Hover off animation */\n transition: all var(--salt-duration-instant) ease-in-out;\n box-sizing: border-box;\n}\n\n/* Vars applied to NavigationItem component when root */\n.saltNavigationItem-rootItem {\n font-weight: var(--salt-text-fontWeight-strong);\n}\n\n/* Styles applied to NavigationItem icon */\n.saltNavigationItem-label .saltIcon {\n top: var(--salt-spacing-25);\n}\n\n/* Styles applied when orientation = \"horizontal\" */\n.saltNavigationItem-horizontal {\n min-height: calc(var(--salt-size-base) + var(--salt-spacing-100) * 2);\n padding: 0 var(--salt-spacing-100);\n width: fit-content;\n}\n\n/* Styles applied when orientation = \"vertical\" */\n.saltNavigationItem-vertical {\n min-height: calc(var(--salt-size-base) + var(--salt-spacing-50) * 2);\n padding-top: 0;\n padding-bottom: 0;\n padding-right: var(--salt-spacing-100);\n padding-left: calc(var(--salt-spacing-300) * (min(var(--saltNavigationItem-level, 0) + 1, 2)));\n width: 100%;\n}\n\n/* Styles applied to NavigationItem label */\n.saltNavigationItem-label {\n padding-left: calc(var(--saltNavigationItem-level, 0) * var(--salt-spacing-100));\n flex: 1;\n text-align: left;\n display: flex;\n align-items: baseline;\n gap: var(--salt-spacing-100);\n}\n\n/* Styles applied when orientation = \"horizontal\" */\n.saltNavigationItem-horizontal {\n min-height: calc(var(--salt-size-base) + var(--salt-spacing-100) * 2);\n padding: 0 var(--salt-spacing-100);\n width: fit-content;\n}\n\n/* Styles applied when orientation = \"vertical\" */\n.saltNavigationItem-vertical {\n --saltButton-margin: var(--salt-spacing-50) 0;\n\n min-height: calc(var(--salt-size-base) + var(--salt-spacing-50) * 2);\n padding-right: var(--salt-spacing-100);\n padding-left: calc(var(--salt-spacing-300) * (min(var(--saltNavigationItem-level, 0) + 1, 2)));\n width: 100%;\n}\n\n/* Styles applied to NavigationItem label */\n.saltNavigationItem-label {\n padding-left: calc(var(--saltNavigationItem-level, 0) * var(--salt-spacing-100));\n flex: 1;\n text-align: left;\n display: flex;\n align-items: baseline;\n gap: var(--salt-spacing-100);\n}\n\n/* Styles applied to NavigationItem Badge */\n.saltNavigationItem-label .saltBadge {\n margin-left: auto;\n}\n\n/* Styles applied to NavigationItem when focus is visible */\n.saltNavigationItem-wrapper:focus-visible {\n outline: var(--salt-focused-outline);\n}\n\n/* Styles applied to NavigationItem for non-keyboard focus */\n.saltNavigationItem-wrapper:focus:not(:focus-visible) {\n outline: 0;\n}\n\n/* Styles applied to activation line */\n.saltNavigationItem-wrapper::after {\n content: \"\";\n position: absolute;\n top: var(--salt-spacing-25);\n left: 0;\n display: block;\n}\n\n/* Styles applied to activation line when orientation = \"horizontal\" */\n.saltNavigationItem-horizontal::after {\n width: 100%;\n height: var(--salt-size-indicator);\n}\n\n/* Styles applied to activation line when orientation = \"vertical\" */\n.saltNavigationItem-vertical::after {\n width: var(--salt-size-indicator);\n left: var(--salt-spacing-25);\n height: calc(100% - var(--salt-spacing-50));\n}\n\n/* Styles applied to activation line on hover */\n.saltNavigationItem-wrapper:hover::after,\n.saltNavigationItem-wrapper:focus-visible::after {\n background: var(--salt-navigable-indicator-hover);\n /* Hover on animation */\n transition: background var(--salt-duration-perceptible) ease-in-out;\n}\n\n/* Styles applied to activation line when item is active */\n.saltNavigationItem-active::after,\n.saltNavigationItem-active:hover::after,\n.saltNavigationItem-active:focus::after {\n background: var(--salt-navigable-accent-indicator-active);\n /* Hover on animation */\n transition: background var(--salt-duration-perceptible) ease-in-out;\n}\n";
|
|
2
2
|
|
|
3
3
|
export { css_248z as default };
|
|
4
4
|
//# sourceMappingURL=NavigationItem.css.js.map
|
|
@@ -331,8 +331,8 @@ const NumberInput = forwardRef(
|
|
|
331
331
|
Number.isNaN(floatValue) ? value : String(floatValue)
|
|
332
332
|
);
|
|
333
333
|
}
|
|
334
|
-
const disableDecrement =
|
|
335
|
-
const disableIncrement =
|
|
334
|
+
const disableDecrement = isDisabled || floatValue - step < min;
|
|
335
|
+
const disableIncrement = isDisabled || floatValue + step > max;
|
|
336
336
|
return /* @__PURE__ */ jsxs(
|
|
337
337
|
"div",
|
|
338
338
|
{
|