@backstage/ui 0.18.0 → 0.19.0-next.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 +20 -0
- package/dist/analytics/getNodeText.esm.js.map +1 -1
- package/dist/analytics/useAnalytics.esm.js.map +1 -1
- package/dist/components/Accordion/Accordion.esm.js.map +1 -1
- package/dist/components/Accordion/Accordion.module.css.esm.js.map +1 -1
- package/dist/components/Accordion/definition.esm.js.map +1 -1
- package/dist/components/Alert/Alert.esm.js.map +1 -1
- package/dist/components/Alert/Alert.module.css.esm.js.map +1 -1
- package/dist/components/Alert/definition.esm.js.map +1 -1
- package/dist/components/Avatar/Avatar.esm.js.map +1 -1
- package/dist/components/Avatar/Avatar.module.css.esm.js.map +1 -1
- package/dist/components/Avatar/definition.esm.js.map +1 -1
- package/dist/components/Badge/Badge.esm.js.map +1 -1
- package/dist/components/Badge/Badge.module.css.esm.js.map +1 -1
- package/dist/components/Badge/definition.esm.js.map +1 -1
- package/dist/components/Box/Box.esm.js.map +1 -1
- package/dist/components/Box/Box.module.css.esm.js.map +1 -1
- package/dist/components/Box/definition.esm.js.map +1 -1
- package/dist/components/Button/Button.esm.js.map +1 -1
- package/dist/components/Button/Button.module.css.esm.js.map +1 -1
- package/dist/components/Button/definition.esm.js.map +1 -1
- package/dist/components/ButtonIcon/ButtonIcon.esm.js.map +1 -1
- package/dist/components/ButtonIcon/ButtonIcon.module.css.esm.js.map +1 -1
- package/dist/components/ButtonIcon/definition.esm.js.map +1 -1
- package/dist/components/ButtonLink/ButtonLink.esm.js.map +1 -1
- package/dist/components/ButtonLink/ButtonLink.module.css.esm.js.map +1 -1
- package/dist/components/ButtonLink/definition.esm.js.map +1 -1
- package/dist/components/Card/Card.esm.js.map +1 -1
- package/dist/components/Card/Card.module.css.esm.js.map +1 -1
- package/dist/components/Card/definition.esm.js.map +1 -1
- package/dist/components/Checkbox/Checkbox.esm.js.map +1 -1
- package/dist/components/Checkbox/Checkbox.module.css.esm.js.map +1 -1
- package/dist/components/Checkbox/definition.esm.js.map +1 -1
- package/dist/components/CheckboxGroup/CheckboxGroup.esm.js.map +1 -1
- package/dist/components/CheckboxGroup/CheckboxGroup.module.css.esm.js.map +1 -1
- package/dist/components/CheckboxGroup/definition.esm.js.map +1 -1
- package/dist/components/Combobox/Combobox.esm.js +72 -10
- package/dist/components/Combobox/Combobox.esm.js.map +1 -1
- package/dist/components/Combobox/Combobox.module.css.esm.js.map +1 -1
- package/dist/components/Combobox/ComboboxInput.esm.js.map +1 -1
- package/dist/components/Combobox/ComboboxItem.esm.js.map +1 -1
- package/dist/components/Combobox/ComboboxListBox.esm.js +11 -34
- package/dist/components/Combobox/ComboboxListBox.esm.js.map +1 -1
- package/dist/components/Combobox/definition.esm.js +1 -1
- package/dist/components/Combobox/definition.esm.js.map +1 -1
- package/dist/components/Combobox/useAsyncComboboxState.esm.js.map +1 -1
- package/dist/components/Container/Container.esm.js.map +1 -1
- package/dist/components/Container/Container.module.css.esm.js.map +1 -1
- package/dist/components/Container/definition.esm.js.map +1 -1
- package/dist/components/DatePicker/DatePicker.esm.js.map +1 -1
- package/dist/components/DatePicker/DatePicker.module.css.esm.js.map +1 -1
- package/dist/components/DatePicker/DatePickerCalendar.esm.js.map +1 -1
- package/dist/components/DatePicker/DatePickerGroup.esm.js.map +1 -1
- package/dist/components/DatePicker/definition.esm.js.map +1 -1
- package/dist/components/DateRangePicker/DateRangePicker.esm.js.map +1 -1
- package/dist/components/DateRangePicker/DateRangePicker.module.css.esm.js.map +1 -1
- package/dist/components/DateRangePicker/DateRangePickerCalendar.esm.js.map +1 -1
- package/dist/components/DateRangePicker/DateRangePickerGroup.esm.js.map +1 -1
- package/dist/components/DateRangePicker/definition.esm.js.map +1 -1
- package/dist/components/Dialog/Dialog.esm.js.map +1 -1
- package/dist/components/Dialog/Dialog.module.css.esm.js.map +1 -1
- package/dist/components/Dialog/definition.esm.js.map +1 -1
- package/dist/components/FieldError/FieldError.esm.js.map +1 -1
- package/dist/components/FieldError/FieldError.module.css.esm.js.map +1 -1
- package/dist/components/FieldError/definition.esm.js.map +1 -1
- package/dist/components/FieldLabel/FieldLabel.esm.js.map +1 -1
- package/dist/components/FieldLabel/FieldLabel.module.css.esm.js.map +1 -1
- package/dist/components/FieldLabel/definition.esm.js.map +1 -1
- package/dist/components/Flex/Flex.esm.js.map +1 -1
- package/dist/components/Flex/Flex.module.css.esm.js.map +1 -1
- package/dist/components/Flex/definition.esm.js.map +1 -1
- package/dist/components/FullPage/FullPage.esm.js.map +1 -1
- package/dist/components/FullPage/FullPage.module.css.esm.js.map +1 -1
- package/dist/components/FullPage/definition.esm.js.map +1 -1
- package/dist/components/Grid/Grid.esm.js.map +1 -1
- package/dist/components/Grid/Grid.module.css.esm.js.map +1 -1
- package/dist/components/Grid/definition.esm.js.map +1 -1
- package/dist/components/Header/Header.esm.js.map +1 -1
- package/dist/components/Header/Header.module.css.esm.js.map +1 -1
- package/dist/components/Header/HeaderMetadataStatus.esm.js.map +1 -1
- package/dist/components/Header/HeaderMetadataStatus.module.css.esm.js.map +1 -1
- package/dist/components/Header/HeaderMetadataUsers.esm.js.map +1 -1
- package/dist/components/Header/HeaderMetadataUsers.module.css.esm.js.map +1 -1
- package/dist/components/Header/HeaderNav.esm.js.map +1 -1
- package/dist/components/Header/HeaderNav.module.css.esm.js.map +1 -1
- package/dist/components/Header/HeaderNavDefinition.esm.js.map +1 -1
- package/dist/components/Header/HeaderNavIndicators.esm.js.map +1 -1
- package/dist/components/Header/definition.esm.js.map +1 -1
- package/dist/components/Link/Link.esm.js.map +1 -1
- package/dist/components/Link/Link.module.css.esm.js.map +1 -1
- package/dist/components/Link/definition.esm.js.map +1 -1
- package/dist/components/List/List.esm.js.map +1 -1
- package/dist/components/List/List.module.css.esm.js.map +1 -1
- package/dist/components/List/definition.esm.js.map +1 -1
- package/dist/components/Menu/Menu.esm.js.map +1 -1
- package/dist/components/Menu/Menu.module.css.esm.js.map +1 -1
- package/dist/components/Menu/definition.esm.js.map +1 -1
- package/dist/components/NumberField/NumberField.esm.js.map +1 -1
- package/dist/components/NumberField/NumberField.module.css.esm.js.map +1 -1
- package/dist/components/NumberField/definition.esm.js.map +1 -1
- package/dist/components/PasswordField/PasswordField.esm.js.map +1 -1
- package/dist/components/PasswordField/PasswordField.module.css.esm.js.map +1 -1
- package/dist/components/PasswordField/definition.esm.js.map +1 -1
- package/dist/components/PluginHeader/PluginHeader.esm.js.map +1 -1
- package/dist/components/PluginHeader/PluginHeader.module.css.esm.js.map +1 -1
- package/dist/components/PluginHeader/PluginHeaderBreadcrumbs.esm.js.map +1 -1
- package/dist/components/PluginHeader/definition.esm.js.map +1 -1
- package/dist/components/PluginHeader/useIsTruncated.esm.js.map +1 -1
- package/dist/components/Popover/Popover.esm.js.map +1 -1
- package/dist/components/Popover/Popover.module.css.esm.js.map +1 -1
- package/dist/components/Popover/definition.esm.js.map +1 -1
- package/dist/components/RadioGroup/RadioGroup.esm.js.map +1 -1
- package/dist/components/RadioGroup/RadioGroup.module.css.esm.js.map +1 -1
- package/dist/components/RadioGroup/definition.esm.js.map +1 -1
- package/dist/components/SearchAutocomplete/SearchAutocomplete.esm.js.map +1 -1
- package/dist/components/SearchAutocomplete/SearchAutocomplete.module.css.esm.js.map +1 -1
- package/dist/components/SearchAutocomplete/definition.esm.js.map +1 -1
- package/dist/components/SearchField/SearchField.esm.js.map +1 -1
- package/dist/components/SearchField/SearchField.module.css.esm.js.map +1 -1
- package/dist/components/SearchField/definition.esm.js.map +1 -1
- package/dist/components/Select/Select.esm.js.map +1 -1
- package/dist/components/Select/Select.module.css.esm.js.map +1 -1
- package/dist/components/Select/SelectContent.esm.js.map +1 -1
- package/dist/components/Select/SelectItem.esm.js.map +1 -1
- package/dist/components/Select/SelectListBox.esm.js.map +1 -1
- package/dist/components/Select/SelectTrigger.esm.js.map +1 -1
- package/dist/components/Select/definition.esm.js.map +1 -1
- package/dist/components/Skeleton/Skeleton.esm.js.map +1 -1
- package/dist/components/Skeleton/Skeleton.module.css.esm.js.map +1 -1
- package/dist/components/Skeleton/definition.esm.js.map +1 -1
- package/dist/components/Slider/Slider.esm.js.map +1 -1
- package/dist/components/Slider/Slider.module.css.esm.js.map +1 -1
- package/dist/components/Slider/definition.esm.js.map +1 -1
- package/dist/components/Switch/Switch.esm.js.map +1 -1
- package/dist/components/Switch/Switch.module.css.esm.js.map +1 -1
- package/dist/components/Switch/definition.esm.js.map +1 -1
- package/dist/components/Table/Table.module.css.esm.js.map +1 -1
- package/dist/components/Table/components/Cell.esm.js.map +1 -1
- package/dist/components/Table/components/CellProfile.esm.js.map +1 -1
- package/dist/components/Table/components/CellText.esm.js.map +1 -1
- package/dist/components/Table/components/Column.esm.js.map +1 -1
- package/dist/components/Table/components/Row.esm.js.map +1 -1
- package/dist/components/Table/components/Table.esm.js.map +1 -1
- package/dist/components/Table/components/TableBody.esm.js.map +1 -1
- package/dist/components/Table/components/TableBodySkeleton.esm.js.map +1 -1
- package/dist/components/Table/components/TableHeader.esm.js.map +1 -1
- package/dist/components/Table/components/TableRoot.esm.js.map +1 -1
- package/dist/components/Table/definition.esm.js.map +1 -1
- package/dist/components/Table/hooks/getEffectivePageSize.esm.js.map +1 -1
- package/dist/components/Table/hooks/useCompletePagination.esm.js.map +1 -1
- package/dist/components/Table/hooks/useCursorPagination.esm.js.map +1 -1
- package/dist/components/Table/hooks/useDebouncedReload.esm.js.map +1 -1
- package/dist/components/Table/hooks/useDebouncedValue.esm.js.map +1 -1
- package/dist/components/Table/hooks/useOffsetPagination.esm.js.map +1 -1
- package/dist/components/Table/hooks/usePageCache.esm.js.map +1 -1
- package/dist/components/Table/hooks/useQueryState.esm.js.map +1 -1
- package/dist/components/Table/hooks/useStableCallback.esm.js.map +1 -1
- package/dist/components/Table/hooks/useTable.esm.js.map +1 -1
- package/dist/components/TablePagination/TablePagination.esm.js.map +1 -1
- package/dist/components/TablePagination/TablePagination.module.css.esm.js.map +1 -1
- package/dist/components/TablePagination/definition.esm.js.map +1 -1
- package/dist/components/Tabs/Tabs.esm.js.map +1 -1
- package/dist/components/Tabs/Tabs.module.css.esm.js.map +1 -1
- package/dist/components/Tabs/TabsIndicators.esm.js.map +1 -1
- package/dist/components/Tabs/definition.esm.js.map +1 -1
- package/dist/components/TagGroup/TagGroup.esm.js.map +1 -1
- package/dist/components/TagGroup/TagGroup.module.css.esm.js.map +1 -1
- package/dist/components/TagGroup/definition.esm.js.map +1 -1
- package/dist/components/Text/Text.esm.js.map +1 -1
- package/dist/components/Text/Text.module.css.esm.js.map +1 -1
- package/dist/components/Text/definition.esm.js.map +1 -1
- package/dist/components/TextAreaField/TextAreaField.esm.js.map +1 -1
- package/dist/components/TextAreaField/TextAreaField.module.css.esm.js.map +1 -1
- package/dist/components/TextAreaField/definition.esm.js.map +1 -1
- package/dist/components/TextField/TextField.esm.js.map +1 -1
- package/dist/components/TextField/TextField.module.css.esm.js.map +1 -1
- package/dist/components/TextField/definition.esm.js.map +1 -1
- package/dist/components/ToggleButton/ToggleButton.esm.js.map +1 -1
- package/dist/components/ToggleButton/ToggleButton.module.css.esm.js.map +1 -1
- package/dist/components/ToggleButton/definition.esm.js.map +1 -1
- package/dist/components/ToggleButtonGroup/ToggleButtonGroup.esm.js.map +1 -1
- package/dist/components/ToggleButtonGroup/ToggleButtonGroup.module.css.esm.js.map +1 -1
- package/dist/components/ToggleButtonGroup/definition.esm.js.map +1 -1
- package/dist/components/Tooltip/Tooltip.esm.js.map +1 -1
- package/dist/components/Tooltip/Tooltip.module.css.esm.js.map +1 -1
- package/dist/components/Tooltip/definition.esm.js.map +1 -1
- package/dist/components/VisuallyHidden/VisuallyHidden.esm.js.map +1 -1
- package/dist/components/VisuallyHidden/VisuallyHidden.module.css.esm.js.map +1 -1
- package/dist/components/VisuallyHidden/definition.esm.js.map +1 -1
- package/dist/css/styles.css +23 -1
- package/dist/hooks/useBg.esm.js.map +1 -1
- package/dist/hooks/useBreakpoint.esm.js.map +1 -1
- package/dist/hooks/useCollectionAdapter.esm.js.map +1 -1
- package/dist/hooks/useDefinition/defineComponent.esm.js.map +1 -1
- package/dist/hooks/useDefinition/helpers.esm.js.map +1 -1
- package/dist/hooks/useDefinition/useDefinition.esm.js.map +1 -1
- package/dist/hooks/useDefinition/useDefinitionNavigation.esm.js.map +1 -1
- package/dist/hooks/useDelayedVisibility.esm.js.map +1 -1
- package/dist/hooks/useIsomorphicLayoutEffect.esm.js.map +1 -1
- package/dist/hooks/useResolvedHref.esm.js.map +1 -1
- package/dist/hooks/useTrackedSelectionKeys.esm.js.map +1 -1
- package/dist/index.d.ts +7 -2
- package/dist/navigation/BUIRoutingProvider.esm.js.map +1 -1
- package/dist/navigation/useNavigation.esm.js.map +1 -1
- package/dist/navigation/useRouting.esm.js.map +1 -1
- package/dist/node_modules_dist/style-inject/dist/style-inject.es.esm.js.map +1 -1
- package/dist/provider/BUIContext.esm.js.map +1 -1
- package/dist/provider/BUIProvider.esm.js.map +1 -1
- package/dist/utils/linkUtils.esm.js.map +1 -1
- package/dist/utils/selectableCollection.esm.js +13 -1
- package/dist/utils/selectableCollection.esm.js.map +1 -1
- package/dist/utils/utilityClassMap.esm.js.map +1 -1
- package/package.json +7 -7
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { forwardRef, useEffect } from 'react';
|
|
2
|
+
import { forwardRef, useEffect, useState } from 'react';
|
|
3
3
|
import { ComboBox } from 'react-aria-components';
|
|
4
4
|
import { useFilter } from 'react-aria';
|
|
5
5
|
import { useDefinition } from '../../hooks/useDefinition/useDefinition.esm.js';
|
|
@@ -13,7 +13,7 @@ import '../FieldError/FieldError.module.css.esm.js';
|
|
|
13
13
|
import { ComboboxInput } from './ComboboxInput.esm.js';
|
|
14
14
|
import { ComboboxListBox } from './ComboboxListBox.esm.js';
|
|
15
15
|
import { useCollectionAdapter } from '../../hooks/useCollectionAdapter.esm.js';
|
|
16
|
-
import { resolveCollectionSource, isAsyncListSource } from '../../utils/selectableCollection.esm.js';
|
|
16
|
+
import { resolveCollectionSource, isAsyncListSource, filterOptionSections, normalizeOptions } from '../../utils/selectableCollection.esm.js';
|
|
17
17
|
import { useAsyncComboboxState, getAsyncComboboxItemTextValue } from './useAsyncComboboxState.esm.js';
|
|
18
18
|
|
|
19
19
|
function resolveComboboxStateProps({
|
|
@@ -87,10 +87,11 @@ function ComboboxImpl(props, ref) {
|
|
|
87
87
|
retainSelectedItems: false
|
|
88
88
|
});
|
|
89
89
|
const renderedItems = collectionSource.rendersItems ? collection.canonicalItems : void 0;
|
|
90
|
-
const rootItems = renderedItems ?? (collectionSource.options !== void 0 && search !== void 0 ? collection.canonicalItems : void 0);
|
|
91
90
|
const searchProps = typeof search === "object" ? search : void 0;
|
|
92
|
-
const
|
|
93
|
-
const
|
|
91
|
+
const isServerSearch = searchProps?.mode === "server";
|
|
92
|
+
const isDirectAsyncServer = isServerSearch && isAsyncListSource(collectionSource.source);
|
|
93
|
+
const hasCustomFilter = searchProps?.filter !== void 0;
|
|
94
|
+
const rootItems = isServerSearch || hasCustomFilter ? collection.canonicalItems : void 0;
|
|
94
95
|
const {
|
|
95
96
|
value,
|
|
96
97
|
defaultValue,
|
|
@@ -99,6 +100,7 @@ function ComboboxImpl(props, ref) {
|
|
|
99
100
|
defaultInputValue,
|
|
100
101
|
onInputChange,
|
|
101
102
|
menuTrigger = "focus",
|
|
103
|
+
onOpenChange,
|
|
102
104
|
...ariaProps
|
|
103
105
|
} = restProps;
|
|
104
106
|
const asyncComboboxProps = isDirectAsyncServer ? {
|
|
@@ -122,18 +124,78 @@ function ComboboxImpl(props, ref) {
|
|
|
122
124
|
collection,
|
|
123
125
|
hasSearch: search !== void 0
|
|
124
126
|
});
|
|
125
|
-
const
|
|
127
|
+
const [uncontrolledInputValue, setUncontrolledInputValue] = useState(
|
|
128
|
+
comboboxStateProps.defaultInputValue ?? ""
|
|
129
|
+
);
|
|
130
|
+
const currentInputValue = comboboxStateProps.inputValue ?? uncontrolledInputValue;
|
|
131
|
+
const [isMenuOpen, setIsMenuOpen] = useState(false);
|
|
132
|
+
const [showAllOptions, setShowAllOptions] = useState(false);
|
|
133
|
+
const [lastInputValue, setLastInputValue] = useState(currentInputValue);
|
|
134
|
+
if (lastInputValue !== currentInputValue) {
|
|
135
|
+
setLastInputValue(currentInputValue);
|
|
136
|
+
setShowAllOptions(false);
|
|
137
|
+
}
|
|
138
|
+
const keyProps = ariaProps;
|
|
139
|
+
const [uncontrolledSelectedKey, setUncontrolledSelectedKey] = useState(
|
|
140
|
+
comboboxStateProps.defaultValue ?? keyProps.defaultSelectedKey ?? null
|
|
141
|
+
);
|
|
142
|
+
let selectedKey = uncontrolledSelectedKey;
|
|
143
|
+
if (comboboxStateProps.value !== void 0) {
|
|
144
|
+
selectedKey = comboboxStateProps.value;
|
|
145
|
+
} else if (keyProps.selectedKey !== void 0) {
|
|
146
|
+
selectedKey = keyProps.selectedKey;
|
|
147
|
+
}
|
|
148
|
+
const customFilterQuery = hasCustomFilter && isMenuOpen && !showAllOptions ? currentInputValue : void 0;
|
|
149
|
+
const optionFilter = collectionSource.rendersItems ? void 0 : searchProps?.filter;
|
|
150
|
+
let hiddenKey;
|
|
151
|
+
const keepsSelected = (id, matches) => {
|
|
152
|
+
if (matches || id !== selectedKey) {
|
|
153
|
+
return matches;
|
|
154
|
+
}
|
|
155
|
+
hiddenKey = id;
|
|
156
|
+
return true;
|
|
157
|
+
};
|
|
158
|
+
const filteredOptions = optionFilter && customFilterQuery !== void 0 && collectionSource.options ? filterOptionSections(
|
|
159
|
+
normalizeOptions(collectionSource.options),
|
|
160
|
+
customFilterQuery,
|
|
161
|
+
(option, query) => keepsSelected(option.id, optionFilter(option, query))
|
|
162
|
+
) : collectionSource.options;
|
|
163
|
+
const itemFilter = collectionSource.rendersItems ? searchProps?.filter : void 0;
|
|
164
|
+
const filteredItems = itemFilter && customFilterQuery !== void 0 && renderedItems ? renderedItems.filter(
|
|
165
|
+
(item) => keepsSelected(item.id, itemFilter(item, customFilterQuery))
|
|
166
|
+
) : renderedItems;
|
|
167
|
+
const disabledKeys = hiddenKey === void 0 ? keyProps.disabledKeys : [...keyProps.disabledKeys ?? [], hiddenKey];
|
|
168
|
+
const handleChange = (key) => {
|
|
169
|
+
setUncontrolledSelectedKey(key);
|
|
170
|
+
comboboxStateProps.onChange?.(key);
|
|
171
|
+
};
|
|
172
|
+
const handleInputChange = (nextInputValue) => {
|
|
173
|
+
setUncontrolledInputValue(nextInputValue);
|
|
174
|
+
setShowAllOptions(false);
|
|
175
|
+
comboboxStateProps.onInputChange?.(nextInputValue);
|
|
176
|
+
};
|
|
177
|
+
const handleOpenChange = (isOpen, trigger) => {
|
|
178
|
+
setIsMenuOpen(isOpen);
|
|
179
|
+
if (isOpen) {
|
|
180
|
+
setShowAllOptions(trigger !== "input");
|
|
181
|
+
}
|
|
182
|
+
onOpenChange?.(isOpen, trigger);
|
|
183
|
+
};
|
|
126
184
|
const getItemTextValue = isDirectAsyncServer && items !== void 0 ? getAsyncComboboxItemTextValue : void 0;
|
|
127
185
|
return /* @__PURE__ */ jsxs(
|
|
128
186
|
ComboBox,
|
|
129
187
|
{
|
|
130
188
|
className: classes.root,
|
|
131
|
-
defaultFilter,
|
|
189
|
+
defaultFilter: contains,
|
|
132
190
|
items: rootItems,
|
|
133
191
|
...dataAttributes,
|
|
134
192
|
ref,
|
|
135
193
|
...ariaProps,
|
|
136
194
|
...comboboxStateProps,
|
|
195
|
+
disabledKeys,
|
|
196
|
+
onChange: handleChange,
|
|
197
|
+
onInputChange: handleInputChange,
|
|
198
|
+
onOpenChange: handleOpenChange,
|
|
137
199
|
menuTrigger,
|
|
138
200
|
allowsEmptyCollection: true,
|
|
139
201
|
children: [
|
|
@@ -151,10 +213,10 @@ function ComboboxImpl(props, ref) {
|
|
|
151
213
|
/* @__PURE__ */ jsx(Popover, { className: classes.popover, hideArrow: true, ...dataAttributes, children: /* @__PURE__ */ jsx(
|
|
152
214
|
ComboboxListBox,
|
|
153
215
|
{
|
|
154
|
-
options:
|
|
155
|
-
items:
|
|
216
|
+
options: filteredOptions,
|
|
217
|
+
items: filteredItems,
|
|
218
|
+
hiddenKey,
|
|
156
219
|
dependencies,
|
|
157
|
-
search,
|
|
158
220
|
loading: collection.loading,
|
|
159
221
|
isStale: collection.isStale,
|
|
160
222
|
getItemTextValue,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.esm.js","sources":["../../../src/components/Combobox/Combobox.tsx"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef, useEffect } from 'react';\nimport { ComboBox as AriaComboBox } from 'react-aria-components';\nimport { useFilter } from 'react-aria';\nimport type {\n ComboboxAsyncItemsProps,\n ComboboxAsyncOptionsProps,\n ComboboxItemsProps,\n ComboboxListBoxOwnProps,\n ComboboxOptionsProps,\n ComboboxProps,\n ComboboxServerItem,\n ComboboxServerItemsProps,\n ComboboxServerOptionsProps,\n ComboboxStaticProps,\n} from './types';\nimport type { Key } from 'react-aria-components';\nimport type {\n AsyncListSource,\n CollectionItem,\n NormalizedOption,\n} from '../../types/selectableCollection';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { ComboboxDefinition } from './definition';\nimport { Popover } from '../Popover';\nimport { FieldLabel } from '../FieldLabel';\nimport { FieldError } from '../FieldError';\nimport { ComboboxInput } from './ComboboxInput';\nimport { ComboboxListBox } from './ComboboxListBox';\nimport {\n useCollectionAdapter,\n type CollectionAdapterResult,\n} from '../../hooks/useCollectionAdapter';\nimport {\n isAsyncListSource,\n resolveCollectionSource,\n} from '../../utils/selectableCollection';\nimport {\n getAsyncComboboxItemTextValue,\n useAsyncComboboxState,\n} from './useAsyncComboboxState';\n\ntype ComboboxRuntimeStateProps<T extends CollectionItem> = {\n value?: Key | T | null;\n defaultValue?: Key | T | null;\n onChange?: ((value: Key | null) => void) | ((value: T | null) => void);\n inputValue?: string;\n defaultInputValue?: string;\n onInputChange?: (value: string) => void;\n};\n\ntype ComboboxAriaStateProps = {\n value?: Key | null;\n defaultValue?: Key | null;\n onChange?: (value: Key | null) => void;\n inputValue?: string;\n defaultInputValue?: string;\n onInputChange?: (value: string) => void;\n};\n\ntype AsyncComboboxState = {\n value: Key | null;\n inputValue: string;\n onChange: (value: Key | null) => void;\n onInputChange: (value: string) => void;\n};\n\nfunction resolveComboboxStateProps<T extends CollectionItem>({\n runtimeState,\n asyncState,\n collection,\n hasSearch,\n}: {\n runtimeState: ComboboxRuntimeStateProps<T>;\n asyncState?: AsyncComboboxState;\n collection: CollectionAdapterResult<T>;\n hasSearch: boolean;\n}): ComboboxAriaStateProps {\n if (asyncState) {\n return asyncState;\n }\n\n const selectionProps = {\n value: runtimeState.value as Key | null | undefined,\n defaultValue: runtimeState.defaultValue as Key | null | undefined,\n onChange: runtimeState.onChange as\n | ((value: Key | null) => void)\n | undefined,\n };\n\n if (hasSearch) {\n return {\n ...selectionProps,\n inputValue: collection.inputValue,\n defaultInputValue: collection.defaultInputValue,\n onInputChange: collection.onInputChange,\n };\n }\n\n return {\n ...selectionProps,\n inputValue: runtimeState.inputValue,\n defaultInputValue: runtimeState.defaultInputValue,\n onInputChange: runtimeState.onInputChange,\n };\n}\n\n/**\n * A text input combined with a dropdown list of options. The user can type to filter\n * suggestions, navigate with the keyboard, and pick a value. With\n * `allowsCustomValue`, unmatched typed text can remain in the input without\n * selecting an option. The suggestions open when the input receives focus by\n * default. Use `menuTrigger` to customize this behavior.\n *\n * @public\n */\nfunction ComboboxImpl<T extends CollectionItem = NormalizedOption>(\n props: ComboboxProps<T>,\n ref: React.ForwardedRef<HTMLDivElement>,\n) {\n const { contains } = useFilter({ sensitivity: 'base' });\n const { ownProps, restProps, dataAttributes } = useDefinition(\n ComboboxDefinition,\n props,\n );\n const {\n classes,\n label,\n description,\n options,\n items,\n children,\n dependencies,\n icon,\n placeholder,\n isRequired,\n secondaryLabel,\n search,\n loading,\n } = ownProps;\n\n const ariaLabel = restProps['aria-label'];\n const ariaLabelledBy = restProps['aria-labelledby'];\n\n useEffect(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn(\n 'Combobox requires either a visible label, aria-label, or aria-labelledby for accessibility',\n );\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n const secondaryLabelText = secondaryLabel || (isRequired ? 'Required' : null);\n const collectionSource = resolveCollectionSource<T>({\n options,\n items: items as Iterable<T> | AsyncListSource<T> | undefined,\n });\n const collection = useCollectionAdapter({\n items: collectionSource.source,\n search,\n loading,\n retainSelectedItems: false,\n });\n const renderedItems = collectionSource.rendersItems\n ? collection.canonicalItems\n : undefined;\n const rootItems =\n renderedItems ??\n (collectionSource.options !== undefined && search !== undefined\n ? collection.canonicalItems\n : undefined);\n const searchProps = typeof search === 'object' ? search : undefined;\n const isDirectAsyncServer =\n searchProps?.mode === 'server' &&\n isAsyncListSource(collectionSource.source);\n const shouldDisableRootFilter =\n searchProps?.mode === 'server' || searchProps?.filter !== undefined;\n const {\n value,\n defaultValue,\n onChange,\n inputValue,\n defaultInputValue,\n onInputChange,\n menuTrigger = 'focus',\n ...ariaProps\n } = restProps as typeof restProps & ComboboxRuntimeStateProps<T>;\n const asyncComboboxProps = isDirectAsyncServer\n ? {\n source: collectionSource.source as AsyncListSource<T>,\n value: value as T | null | undefined,\n defaultValue: defaultValue as T | null | undefined,\n onChange: onChange as ((value: T | null) => void) | undefined,\n allowsCustomValue: restProps.allowsCustomValue,\n }\n : undefined;\n const asyncComboboxState = useAsyncComboboxState(asyncComboboxProps);\n const comboboxStateProps = resolveComboboxStateProps({\n runtimeState: {\n value,\n defaultValue,\n onChange,\n inputValue,\n defaultInputValue,\n onInputChange,\n },\n asyncState: asyncComboboxState,\n collection,\n hasSearch: search !== undefined,\n });\n const defaultFilter = shouldDisableRootFilter ? () => true : contains;\n const getItemTextValue =\n isDirectAsyncServer && items !== undefined\n ? getAsyncComboboxItemTextValue\n : undefined;\n\n return (\n <AriaComboBox<T>\n className={classes.root}\n defaultFilter={defaultFilter}\n items={rootItems}\n {...dataAttributes}\n ref={ref}\n {...ariaProps}\n {...comboboxStateProps}\n menuTrigger={menuTrigger}\n allowsEmptyCollection\n >\n <FieldLabel\n label={label}\n secondaryLabel={secondaryLabelText}\n description={description}\n descriptionSlot=\"description\"\n />\n <ComboboxInput icon={icon} placeholder={placeholder} />\n <FieldError />\n <Popover className={classes.popover} hideArrow {...dataAttributes}>\n <ComboboxListBox\n options={collectionSource.options}\n items={renderedItems}\n dependencies={dependencies}\n search={search as never}\n loading={collection.loading}\n isStale={collection.isStale}\n getItemTextValue={getItemTextValue}\n >\n {children as ComboboxListBoxOwnProps<T>['children']}\n </ComboboxListBox>\n </Popover>\n </AriaComboBox>\n );\n}\n\n/** @public */\nexport const Combobox = forwardRef(ComboboxImpl) as unknown as {\n (\n props: ComboboxOptionsProps & React.RefAttributes<HTMLDivElement>,\n ): React.ReactElement;\n (\n props: ComboboxAsyncOptionsProps & React.RefAttributes<HTMLDivElement>,\n ): React.ReactElement;\n <T extends { id: Key }>(\n props: ComboboxItemsProps<T> & React.RefAttributes<HTMLDivElement>,\n ): React.ReactElement;\n <T extends { id: Key }>(\n props: ComboboxAsyncItemsProps<T> & React.RefAttributes<HTMLDivElement>,\n ): React.ReactElement;\n (\n props: ComboboxStaticProps & React.RefAttributes<HTMLDivElement>,\n ): React.ReactElement;\n (\n props: ComboboxServerOptionsProps & React.RefAttributes<HTMLDivElement>,\n ): React.ReactElement;\n <T extends ComboboxServerItem>(\n props: ComboboxServerItemsProps<T> & React.RefAttributes<HTMLDivElement>,\n ): React.ReactElement;\n displayName?: string;\n};\n\nCombobox.displayName = 'Combobox';\n"],"names":["AriaComboBox"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Combobox.esm.js","sources":["../../../src/components/Combobox/Combobox.tsx"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef, useEffect, useState } from 'react';\nimport { ComboBox as AriaComboBox } from 'react-aria-components';\nimport { useFilter } from 'react-aria';\nimport type {\n ComboboxAsyncItemsProps,\n ComboboxAsyncOptionsProps,\n ComboboxItemsProps,\n ComboboxListBoxOwnProps,\n ComboboxOptionsProps,\n ComboboxProps,\n ComboboxServerItem,\n ComboboxServerItemsProps,\n ComboboxServerOptionsProps,\n ComboboxStaticProps,\n} from './types';\nimport type {\n ComboBoxProps as AriaComboBoxProps,\n Key,\n} from 'react-aria-components';\nimport type {\n AsyncListSource,\n CollectionItem,\n NormalizedOption,\n} from '../../types/selectableCollection';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { ComboboxDefinition } from './definition';\nimport { Popover } from '../Popover';\nimport { FieldLabel } from '../FieldLabel';\nimport { FieldError } from '../FieldError';\nimport { ComboboxInput } from './ComboboxInput';\nimport { ComboboxListBox } from './ComboboxListBox';\nimport {\n useCollectionAdapter,\n type CollectionAdapterResult,\n} from '../../hooks/useCollectionAdapter';\nimport {\n filterOptionSections,\n isAsyncListSource,\n normalizeOptions,\n resolveCollectionSource,\n} from '../../utils/selectableCollection';\nimport {\n getAsyncComboboxItemTextValue,\n useAsyncComboboxState,\n} from './useAsyncComboboxState';\n\ntype ComboboxRuntimeStateProps<T extends CollectionItem> = {\n value?: Key | T | null;\n defaultValue?: Key | T | null;\n onChange?: ((value: Key | null) => void) | ((value: T | null) => void);\n inputValue?: string;\n defaultInputValue?: string;\n onInputChange?: (value: string) => void;\n};\n\ntype ComboboxAriaStateProps = {\n value?: Key | null;\n defaultValue?: Key | null;\n onChange?: (value: Key | null) => void;\n inputValue?: string;\n defaultInputValue?: string;\n onInputChange?: (value: string) => void;\n};\n\ntype AsyncComboboxState = {\n value: Key | null;\n inputValue: string;\n onChange: (value: Key | null) => void;\n onInputChange: (value: string) => void;\n};\n\nfunction resolveComboboxStateProps<T extends CollectionItem>({\n runtimeState,\n asyncState,\n collection,\n hasSearch,\n}: {\n runtimeState: ComboboxRuntimeStateProps<T>;\n asyncState?: AsyncComboboxState;\n collection: CollectionAdapterResult<T>;\n hasSearch: boolean;\n}): ComboboxAriaStateProps {\n if (asyncState) {\n return asyncState;\n }\n\n const selectionProps = {\n value: runtimeState.value as Key | null | undefined,\n defaultValue: runtimeState.defaultValue as Key | null | undefined,\n onChange: runtimeState.onChange as\n | ((value: Key | null) => void)\n | undefined,\n };\n\n if (hasSearch) {\n return {\n ...selectionProps,\n inputValue: collection.inputValue,\n defaultInputValue: collection.defaultInputValue,\n onInputChange: collection.onInputChange,\n };\n }\n\n return {\n ...selectionProps,\n inputValue: runtimeState.inputValue,\n defaultInputValue: runtimeState.defaultInputValue,\n onInputChange: runtimeState.onInputChange,\n };\n}\n\n/**\n * A text input combined with a dropdown list of options. The user can type to filter\n * suggestions, navigate with the keyboard, and pick a value. With\n * `allowsCustomValue`, unmatched typed text can remain in the input without\n * selecting an option. The suggestions open when the input receives focus by\n * default. Use `menuTrigger` to customize this behavior.\n *\n * @public\n */\nfunction ComboboxImpl<T extends CollectionItem = NormalizedOption>(\n props: ComboboxProps<T>,\n ref: React.ForwardedRef<HTMLDivElement>,\n) {\n const { contains } = useFilter({ sensitivity: 'base' });\n const { ownProps, restProps, dataAttributes } = useDefinition(\n ComboboxDefinition,\n props,\n );\n const {\n classes,\n label,\n description,\n options,\n items,\n children,\n dependencies,\n icon,\n placeholder,\n isRequired,\n secondaryLabel,\n search,\n loading,\n } = ownProps;\n\n const ariaLabel = restProps['aria-label'];\n const ariaLabelledBy = restProps['aria-labelledby'];\n\n useEffect(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn(\n 'Combobox requires either a visible label, aria-label, or aria-labelledby for accessibility',\n );\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n const secondaryLabelText = secondaryLabel || (isRequired ? 'Required' : null);\n const collectionSource = resolveCollectionSource<T>({\n options,\n items: items as Iterable<T> | AsyncListSource<T> | undefined,\n });\n const collection = useCollectionAdapter({\n items: collectionSource.source,\n search,\n loading,\n retainSelectedItems: false,\n });\n const renderedItems = collectionSource.rendersItems\n ? collection.canonicalItems\n : undefined;\n const searchProps = typeof search === 'object' ? search : undefined;\n const isServerSearch = searchProps?.mode === 'server';\n const isDirectAsyncServer =\n isServerSearch && isAsyncListSource(collectionSource.source);\n const hasCustomFilter = searchProps?.filter !== undefined;\n // React Aria builds the collection from the list box children and filters it\n // by text unless items are passed. Passing items turns that filter off, so\n // the server or the custom filter decides which options the list box renders.\n const rootItems =\n isServerSearch || hasCustomFilter ? collection.canonicalItems : undefined;\n const {\n value,\n defaultValue,\n onChange,\n inputValue,\n defaultInputValue,\n onInputChange,\n menuTrigger = 'focus',\n onOpenChange,\n ...ariaProps\n } = restProps as typeof restProps & ComboboxRuntimeStateProps<T>;\n const asyncComboboxProps = isDirectAsyncServer\n ? {\n source: collectionSource.source as AsyncListSource<T>,\n value: value as T | null | undefined,\n defaultValue: defaultValue as T | null | undefined,\n onChange: onChange as ((value: T | null) => void) | undefined,\n allowsCustomValue: restProps.allowsCustomValue,\n }\n : undefined;\n const asyncComboboxState = useAsyncComboboxState(asyncComboboxProps);\n const comboboxStateProps = resolveComboboxStateProps({\n runtimeState: {\n value,\n defaultValue,\n onChange,\n inputValue,\n defaultInputValue,\n onInputChange,\n },\n asyncState: asyncComboboxState,\n collection,\n hasSearch: search !== undefined,\n });\n const [uncontrolledInputValue, setUncontrolledInputValue] = useState(\n comboboxStateProps.defaultInputValue ?? '',\n );\n const currentInputValue =\n comboboxStateProps.inputValue ?? uncontrolledInputValue;\n const [isMenuOpen, setIsMenuOpen] = useState(false);\n const [showAllOptions, setShowAllOptions] = useState(false);\n const [lastInputValue, setLastInputValue] = useState(currentInputValue);\n if (lastInputValue !== currentInputValue) {\n setLastInputValue(currentInputValue);\n setShowAllOptions(false);\n }\n // The deprecated `selectedKey` and `defaultSelectedKey` props still reach\n // React Aria, so the selection mirror honors them too.\n const keyProps = ariaProps as {\n selectedKey?: Key | null;\n defaultSelectedKey?: Key | null;\n disabledKeys?: Iterable<Key>;\n };\n const [uncontrolledSelectedKey, setUncontrolledSelectedKey] = useState(\n comboboxStateProps.defaultValue ?? keyProps.defaultSelectedKey ?? null,\n );\n let selectedKey = uncontrolledSelectedKey;\n if (comboboxStateProps.value !== undefined) {\n selectedKey = comboboxStateProps.value;\n } else if (keyProps.selectedKey !== undefined) {\n selectedKey = keyProps.selectedKey;\n }\n // Like React Aria's own filtering, the custom filter only applies once the\n // input text changes in the open menu.\n const customFilterQuery =\n hasCustomFilter && isMenuOpen && !showAllOptions\n ? currentInputValue\n : undefined;\n // `search` mixes the options and items variants, so each branch narrows the\n // filter to the type it renders.\n const optionFilter = collectionSource.rendersItems\n ? undefined\n : (searchProps?.filter as\n | ((option: NormalizedOption, query: string) => boolean)\n | undefined);\n // React Aria reads the selected option's label from the collection when it\n // restores the input on Escape or blur, and the collection only holds the\n // options the list box renders. So the selected option stays in the\n // collection even when the filter excludes it, but it is disabled so the\n // keyboard skips it, and the list box hides it.\n let hiddenKey: Key | undefined;\n const keepsSelected = (id: Key, matches: boolean) => {\n if (matches || id !== selectedKey) {\n return matches;\n }\n hiddenKey = id;\n return true;\n };\n const filteredOptions =\n optionFilter && customFilterQuery !== undefined && collectionSource.options\n ? filterOptionSections(\n normalizeOptions(collectionSource.options),\n customFilterQuery,\n (option, query) =>\n keepsSelected(option.id, optionFilter(option, query)),\n )\n : collectionSource.options;\n const itemFilter = collectionSource.rendersItems\n ? (searchProps?.filter as ((item: T, query: string) => boolean) | undefined)\n : undefined;\n const filteredItems =\n itemFilter && customFilterQuery !== undefined && renderedItems\n ? renderedItems.filter(item =>\n keepsSelected(item.id, itemFilter(item, customFilterQuery)),\n )\n : renderedItems;\n const disabledKeys =\n hiddenKey === undefined\n ? keyProps.disabledKeys\n : [...(keyProps.disabledKeys ?? []), hiddenKey];\n const handleChange = (key: Key | null) => {\n setUncontrolledSelectedKey(key);\n comboboxStateProps.onChange?.(key);\n };\n const handleInputChange = (nextInputValue: string) => {\n setUncontrolledInputValue(nextInputValue);\n // The mirror misses the label React Aria shows for a default selection, so\n // an edit back to the mirrored value must still start filtering.\n setShowAllOptions(false);\n comboboxStateProps.onInputChange?.(nextInputValue);\n };\n const handleOpenChange: NonNullable<AriaComboBoxProps<T>['onOpenChange']> = (\n isOpen,\n trigger,\n ) => {\n setIsMenuOpen(isOpen);\n if (isOpen) {\n setShowAllOptions(trigger !== 'input');\n }\n onOpenChange?.(isOpen, trigger);\n };\n const getItemTextValue =\n isDirectAsyncServer && items !== undefined\n ? getAsyncComboboxItemTextValue\n : undefined;\n\n return (\n <AriaComboBox<T>\n className={classes.root}\n defaultFilter={contains}\n items={rootItems}\n {...dataAttributes}\n ref={ref}\n {...ariaProps}\n {...comboboxStateProps}\n disabledKeys={disabledKeys}\n onChange={handleChange}\n onInputChange={handleInputChange}\n onOpenChange={handleOpenChange}\n menuTrigger={menuTrigger}\n allowsEmptyCollection\n >\n <FieldLabel\n label={label}\n secondaryLabel={secondaryLabelText}\n description={description}\n descriptionSlot=\"description\"\n />\n <ComboboxInput icon={icon} placeholder={placeholder} />\n <FieldError />\n <Popover className={classes.popover} hideArrow {...dataAttributes}>\n <ComboboxListBox\n options={filteredOptions}\n items={filteredItems}\n hiddenKey={hiddenKey}\n dependencies={dependencies}\n loading={collection.loading}\n isStale={collection.isStale}\n getItemTextValue={getItemTextValue}\n >\n {children as ComboboxListBoxOwnProps<T>['children']}\n </ComboboxListBox>\n </Popover>\n </AriaComboBox>\n );\n}\n\n/** @public */\nexport const Combobox = forwardRef(ComboboxImpl) as unknown as {\n (\n props: ComboboxOptionsProps & React.RefAttributes<HTMLDivElement>,\n ): React.ReactElement;\n (\n props: ComboboxAsyncOptionsProps & React.RefAttributes<HTMLDivElement>,\n ): React.ReactElement;\n <T extends { id: Key }>(\n props: ComboboxItemsProps<T> & React.RefAttributes<HTMLDivElement>,\n ): React.ReactElement;\n <T extends { id: Key }>(\n props: ComboboxAsyncItemsProps<T> & React.RefAttributes<HTMLDivElement>,\n ): React.ReactElement;\n (\n props: ComboboxStaticProps & React.RefAttributes<HTMLDivElement>,\n ): React.ReactElement;\n (\n props: ComboboxServerOptionsProps & React.RefAttributes<HTMLDivElement>,\n ): React.ReactElement;\n <T extends ComboboxServerItem>(\n props: ComboboxServerItemsProps<T> & React.RefAttributes<HTMLDivElement>,\n ): React.ReactElement;\n displayName?: string;\n};\n\nCombobox.displayName = 'Combobox';\n"],"names":["AriaComboBox"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.module.css.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Combobox.module.css.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxInput.esm.js","sources":["../../../src/components/Combobox/ComboboxInput.tsx"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Button, Group, Input } from 'react-aria-components';\nimport { RiArrowDownSLine } from '@remixicon/react';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { ComboboxInputDefinition } from './definition';\nimport type { ComboboxInputOwnProps } from './types';\n\nexport function ComboboxInput(props: ComboboxInputOwnProps) {\n const { ownProps, dataAttributes } = useDefinition(\n ComboboxInputDefinition,\n props,\n );\n const { classes, icon, placeholder } = ownProps;\n\n return (\n <Group className={classes.root} {...dataAttributes}>\n {icon ? (\n <div className={classes.icon} aria-hidden=\"true\">\n {icon}\n </div>\n ) : null}\n <Input className={classes.input} placeholder={placeholder} />\n <Button className={classes.chevron}>\n <RiArrowDownSLine aria-hidden=\"true\" />\n </Button>\n </Group>\n );\n}\n"],"names":[],"mappings":";;;;;;AAsBO,SAAS,cAAc,KAAA,EAA8B;AAC1D,EAAA,MAAM,EAAE,QAAA,EAAU,cAAA,EAAe,GAAI,aAAA;AAAA,IACnC,uBAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,MAAM,EAAE,OAAA,EAAS,IAAA,EAAM,WAAA,EAAY,GAAI,QAAA;AAEvC,EAAA,4BACG,KAAA,EAAA,EAAM,SAAA,EAAW,OAAA,CAAQ,IAAA,EAAO,GAAG,cAAA,EACjC,QAAA,EAAA;AAAA,IAAA,IAAA,mBACC,GAAA,CAAC,SAAI,SAAA,EAAW,OAAA,CAAQ,MAAM,aAAA,EAAY,MAAA,EACvC,gBACH,CAAA,GACE,IAAA;AAAA,oBACJ,GAAA,CAAC,KAAA,EAAA,EAAM,SAAA,EAAW,OAAA,CAAQ,OAAO,WAAA,EAA0B,CAAA;AAAA,oBAC3D,GAAA,CAAC,UAAO,SAAA,EAAW,OAAA,CAAQ,SACzB,QAAA,kBAAA,GAAA,CAAC,gBAAA,EAAA,EAAiB,aAAA,EAAY,MAAA,EAAO,CAAA,EACvC;AAAA,GAAA,EACF,CAAA;AAEJ
|
|
1
|
+
{"version":3,"file":"ComboboxInput.esm.js","sources":["../../../src/components/Combobox/ComboboxInput.tsx"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Button, Group, Input } from 'react-aria-components';\nimport { RiArrowDownSLine } from '@remixicon/react';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { ComboboxInputDefinition } from './definition';\nimport type { ComboboxInputOwnProps } from './types';\n\nexport function ComboboxInput(props: ComboboxInputOwnProps) {\n const { ownProps, dataAttributes } = useDefinition(\n ComboboxInputDefinition,\n props,\n );\n const { classes, icon, placeholder } = ownProps;\n\n return (\n <Group className={classes.root} {...dataAttributes}>\n {icon ? (\n <div className={classes.icon} aria-hidden=\"true\">\n {icon}\n </div>\n ) : null}\n <Input className={classes.input} placeholder={placeholder} />\n <Button className={classes.chevron}>\n <RiArrowDownSLine aria-hidden=\"true\" />\n </Button>\n </Group>\n );\n}\n"],"names":[],"mappings":";;;;;;AAsBO,SAAS,cAAc,KAAA,EAA8B;AAC1D,EAAA,MAAM,EAAE,QAAA,EAAU,cAAA,EAAe,GAAI,aAAA;AAAA,IACnC,uBAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,MAAM,EAAE,OAAA,EAAS,IAAA,EAAM,WAAA,EAAY,GAAI,QAAA;AAEvC,EAAA,4BACG,KAAA,EAAA,EAAM,SAAA,EAAW,OAAA,CAAQ,IAAA,EAAO,GAAG,cAAA,EACjC,QAAA,EAAA;AAAA,IAAA,IAAA,mBACC,GAAA,CAAC,SAAI,SAAA,EAAW,OAAA,CAAQ,MAAM,aAAA,EAAY,MAAA,EACvC,gBACH,CAAA,GACE,IAAA;AAAA,oBACJ,GAAA,CAAC,KAAA,EAAA,EAAM,SAAA,EAAW,OAAA,CAAQ,OAAO,WAAA,EAA0B,CAAA;AAAA,oBAC3D,GAAA,CAAC,UAAO,SAAA,EAAW,OAAA,CAAQ,SACzB,QAAA,kBAAA,GAAA,CAAC,gBAAA,EAAA,EAAiB,aAAA,EAAY,MAAA,EAAO,CAAA,EACvC;AAAA,GAAA,EACF,CAAA;AAEJ;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxItem.esm.js","sources":["../../../src/components/Combobox/ComboboxItem.tsx"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { ListBoxItem, Text } from 'react-aria-components';\nimport { RiCheckLine } from '@remixicon/react';\nimport { Avatar } from '../Avatar';\nimport {\n useDefinition,\n type UseDefinitionResult,\n} from '../../hooks/useDefinition';\nimport {\n ComboboxItemDefinition,\n ComboboxItemProfileDefinition,\n ComboboxItemTextDefinition,\n} from './definition';\nimport type {\n ComboboxItemProfileProps,\n ComboboxItemProps,\n ComboboxItemTextProps,\n} from './types';\nimport {\n getReactAriaAnchorProps,\n type AnchorNavigation,\n} from '../../navigation/useNavigation';\n\ntype ComboboxItemViewProps = {\n definitionResult: UseDefinitionResult<\n typeof ComboboxItemDefinition,\n ComboboxItemProps\n >;\n navigation: AnchorNavigation;\n};\n\nfunction ComboboxItemView({\n definitionResult,\n navigation,\n}: ComboboxItemViewProps) {\n const { ownProps, restProps } = definitionResult;\n const { classes, children, textValue, showSelectionIndicator } = ownProps;\n const navigationProps = getReactAriaAnchorProps(navigation, restProps);\n\n return (\n <ListBoxItem\n {...restProps}\n className={classes.root}\n textValue={textValue}\n {...navigationProps}\n >\n {values => {\n const content =\n typeof children === 'function' ? children(values) : children;\n\n if (!showSelectionIndicator) {\n return content;\n }\n\n return (\n <>\n <div className={classes.indicator}>\n <RiCheckLine aria-hidden=\"true\" />\n </div>\n <div className={classes.content}>{content}</div>\n </>\n );\n }}\n </ListBoxItem>\n );\n}\n\n/**\n * A combobox item wrapper for custom content.\n *\n * @public\n */\nexport function ComboboxItem<T extends object = object>(\n props: ComboboxItemProps<T>,\n) {\n const definitionResult = useDefinition(ComboboxItemDefinition, props);\n const Navigation = definitionResult.navigation;\n\n return (\n <Navigation\n props={definitionResult.restProps}\n view={ComboboxItemView}\n viewProps={{ definitionResult }}\n />\n );\n}\n\n/**\n * A combobox item that renders a title with an optional description and\n * leading icon.\n *\n * @public\n */\nexport function ComboboxItemText<T extends object = object>(\n props: ComboboxItemTextProps<T>,\n) {\n const { ownProps, restProps } = useDefinition(\n ComboboxItemTextDefinition,\n props,\n );\n const { classes, title, description, leadingIcon, textValue } = ownProps;\n\n return (\n <ComboboxItem\n {...restProps}\n className={classes.root}\n textValue={textValue ?? title}\n showSelectionIndicator\n >\n {leadingIcon && <div className={classes.leadingIcon}>{leadingIcon}</div>}\n <div className={classes.text}>\n <Text slot=\"label\" className={classes.title}>\n {title}\n </Text>\n {description && (\n <Text slot=\"description\" className={classes.description}>\n {description}\n </Text>\n )}\n </div>\n </ComboboxItem>\n );\n}\n\n/**\n * A combobox item that renders a profile name with an optional avatar.\n *\n * @public\n */\nexport function ComboboxItemProfile<T extends object = object>(\n props: ComboboxItemProfileProps<T>,\n) {\n const { ownProps, restProps } = useDefinition(\n ComboboxItemProfileDefinition,\n props,\n );\n const { classes, name, src, textValue } = ownProps;\n\n return (\n <ComboboxItem\n {...restProps}\n className={classes.root}\n textValue={textValue ?? name}\n showSelectionIndicator\n >\n <div className={classes.avatar}>\n <Avatar\n src={src ?? ''}\n name={name}\n size=\"x-small\"\n purpose=\"decoration\"\n />\n </div>\n <Text slot=\"label\" className={classes.name}>\n {name}\n </Text>\n </ComboboxItem>\n );\n}\n"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"ComboboxItem.esm.js","sources":["../../../src/components/Combobox/ComboboxItem.tsx"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { ListBoxItem, Text } from 'react-aria-components';\nimport { RiCheckLine } from '@remixicon/react';\nimport { Avatar } from '../Avatar';\nimport {\n useDefinition,\n type UseDefinitionResult,\n} from '../../hooks/useDefinition';\nimport {\n ComboboxItemDefinition,\n ComboboxItemProfileDefinition,\n ComboboxItemTextDefinition,\n} from './definition';\nimport type {\n ComboboxItemProfileProps,\n ComboboxItemProps,\n ComboboxItemTextProps,\n} from './types';\nimport {\n getReactAriaAnchorProps,\n type AnchorNavigation,\n} from '../../navigation/useNavigation';\n\ntype ComboboxItemViewProps = {\n definitionResult: UseDefinitionResult<\n typeof ComboboxItemDefinition,\n ComboboxItemProps\n >;\n navigation: AnchorNavigation;\n};\n\nfunction ComboboxItemView({\n definitionResult,\n navigation,\n}: ComboboxItemViewProps) {\n const { ownProps, restProps } = definitionResult;\n const { classes, children, textValue, showSelectionIndicator } = ownProps;\n const navigationProps = getReactAriaAnchorProps(navigation, restProps);\n\n return (\n <ListBoxItem\n {...restProps}\n className={classes.root}\n textValue={textValue}\n {...navigationProps}\n >\n {values => {\n const content =\n typeof children === 'function' ? children(values) : children;\n\n if (!showSelectionIndicator) {\n return content;\n }\n\n return (\n <>\n <div className={classes.indicator}>\n <RiCheckLine aria-hidden=\"true\" />\n </div>\n <div className={classes.content}>{content}</div>\n </>\n );\n }}\n </ListBoxItem>\n );\n}\n\n/**\n * A combobox item wrapper for custom content.\n *\n * @public\n */\nexport function ComboboxItem<T extends object = object>(\n props: ComboboxItemProps<T>,\n) {\n const definitionResult = useDefinition(ComboboxItemDefinition, props);\n const Navigation = definitionResult.navigation;\n\n return (\n <Navigation\n props={definitionResult.restProps}\n view={ComboboxItemView}\n viewProps={{ definitionResult }}\n />\n );\n}\n\n/**\n * A combobox item that renders a title with an optional description and\n * leading icon.\n *\n * @public\n */\nexport function ComboboxItemText<T extends object = object>(\n props: ComboboxItemTextProps<T>,\n) {\n const { ownProps, restProps } = useDefinition(\n ComboboxItemTextDefinition,\n props,\n );\n const { classes, title, description, leadingIcon, textValue } = ownProps;\n\n return (\n <ComboboxItem\n {...restProps}\n className={classes.root}\n textValue={textValue ?? title}\n showSelectionIndicator\n >\n {leadingIcon && <div className={classes.leadingIcon}>{leadingIcon}</div>}\n <div className={classes.text}>\n <Text slot=\"label\" className={classes.title}>\n {title}\n </Text>\n {description && (\n <Text slot=\"description\" className={classes.description}>\n {description}\n </Text>\n )}\n </div>\n </ComboboxItem>\n );\n}\n\n/**\n * A combobox item that renders a profile name with an optional avatar.\n *\n * @public\n */\nexport function ComboboxItemProfile<T extends object = object>(\n props: ComboboxItemProfileProps<T>,\n) {\n const { ownProps, restProps } = useDefinition(\n ComboboxItemProfileDefinition,\n props,\n );\n const { classes, name, src, textValue } = ownProps;\n\n return (\n <ComboboxItem\n {...restProps}\n className={classes.root}\n textValue={textValue ?? name}\n showSelectionIndicator\n >\n <div className={classes.avatar}>\n <Avatar\n src={src ?? ''}\n name={name}\n size=\"x-small\"\n purpose=\"decoration\"\n />\n </div>\n <Text slot=\"label\" className={classes.name}>\n {name}\n </Text>\n </ComboboxItem>\n );\n}\n"],"names":[],"mappings":";;;;;;;;;AA8CA,SAAS,gBAAA,CAAiB;AAAA,EACxB,gBAAA;AAAA,EACA;AACF,CAAA,EAA0B;AACxB,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAU,GAAI,gBAAA;AAChC,EAAA,MAAM,EAAE,OAAA,EAAS,QAAA,EAAU,SAAA,EAAW,wBAAuB,GAAI,QAAA;AACjE,EAAA,MAAM,eAAA,GAAkB,uBAAA,CAAwB,UAAA,EAAY,SAAS,CAAA;AAErE,EAAA,uBACE,GAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACE,GAAG,SAAA;AAAA,MACJ,WAAW,OAAA,CAAQ,IAAA;AAAA,MACnB,SAAA;AAAA,MACC,GAAG,eAAA;AAAA,MAEH,QAAA,EAAA,CAAA,MAAA,KAAU;AACT,QAAA,MAAM,UACJ,OAAO,QAAA,KAAa,UAAA,GAAa,QAAA,CAAS,MAAM,CAAA,GAAI,QAAA;AAEtD,QAAA,IAAI,CAAC,sBAAA,EAAwB;AAC3B,UAAA,OAAO,OAAA;AAAA,QACT;AAEA,QAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,KAAA,EAAA,EAAI,WAAW,OAAA,CAAQ,SAAA,EACtB,8BAAC,WAAA,EAAA,EAAY,aAAA,EAAY,QAAO,CAAA,EAClC,CAAA;AAAA,0BACA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,OAAA,CAAQ,SAAU,QAAA,EAAA,OAAA,EAAQ;AAAA,SAAA,EAC5C,CAAA;AAAA,MAEJ;AAAA;AAAA,GACF;AAEJ;AAOO,SAAS,aACd,KAAA,EACA;AACA,EAAA,MAAM,gBAAA,GAAmB,aAAA,CAAc,sBAAA,EAAwB,KAAK,CAAA;AACpE,EAAA,MAAM,aAAa,gBAAA,CAAiB,UAAA;AAEpC,EAAA,uBACE,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,OAAO,gBAAA,CAAiB,SAAA;AAAA,MACxB,IAAA,EAAM,gBAAA;AAAA,MACN,SAAA,EAAW,EAAE,gBAAA;AAAiB;AAAA,GAChC;AAEJ;AAQO,SAAS,iBACd,KAAA,EACA;AACA,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAU,GAAI,aAAA;AAAA,IAC9B,0BAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,MAAM,EAAE,OAAA,EAAS,KAAA,EAAO,WAAA,EAAa,WAAA,EAAa,WAAU,GAAI,QAAA;AAEhE,EAAA,uBACE,IAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACE,GAAG,SAAA;AAAA,MACJ,WAAW,OAAA,CAAQ,IAAA;AAAA,MACnB,WAAW,SAAA,IAAa,KAAA;AAAA,MACxB,sBAAA,EAAsB,IAAA;AAAA,MAErB,QAAA,EAAA;AAAA,QAAA,WAAA,oBAAe,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,OAAA,CAAQ,aAAc,QAAA,EAAA,WAAA,EAAY,CAAA;AAAA,wBAClE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,OAAA,CAAQ,IAAA,EACtB,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,QAAK,IAAA,EAAK,OAAA,EAAQ,SAAA,EAAW,OAAA,CAAQ,OACnC,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,UACC,WAAA,wBACE,IAAA,EAAA,EAAK,IAAA,EAAK,eAAc,SAAA,EAAW,OAAA,CAAQ,aACzC,QAAA,EAAA,WAAA,EACH;AAAA,SAAA,EAEJ;AAAA;AAAA;AAAA,GACF;AAEJ;AAOO,SAAS,oBACd,KAAA,EACA;AACA,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAU,GAAI,aAAA;AAAA,IAC9B,6BAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,MAAM,EAAE,OAAA,EAAS,IAAA,EAAM,GAAA,EAAK,WAAU,GAAI,QAAA;AAE1C,EAAA,uBACE,IAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACE,GAAG,SAAA;AAAA,MACJ,WAAW,OAAA,CAAQ,IAAA;AAAA,MACnB,WAAW,SAAA,IAAa,IAAA;AAAA,MACxB,sBAAA,EAAsB,IAAA;AAAA,MAEtB,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,OAAA,CAAQ,MAAA,EACtB,QAAA,kBAAA,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,KAAK,GAAA,IAAO,EAAA;AAAA,YACZ,IAAA;AAAA,YACA,IAAA,EAAK,SAAA;AAAA,YACL,OAAA,EAAQ;AAAA;AAAA,SACV,EACF,CAAA;AAAA,4BACC,IAAA,EAAA,EAAK,IAAA,EAAK,SAAQ,SAAA,EAAW,OAAA,CAAQ,MACnC,QAAA,EAAA,IAAA,EACH;AAAA;AAAA;AAAA,GACF;AAEJ;;"}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import { useFilter } from 'react-aria';
|
|
2
|
+
import { cloneElement } from 'react';
|
|
3
|
+
import { ListBox, SelectableCollectionContext, Collection, ListBoxLoadMoreItem, ListBoxSection, Header, Text } from 'react-aria-components';
|
|
5
4
|
import clsx from 'clsx';
|
|
6
5
|
import { useDefinition } from '../../hooks/useDefinition/useDefinition.esm.js';
|
|
7
6
|
import { normalizeOptions } from '../../utils/selectableCollection.esm.js';
|
|
@@ -77,25 +76,6 @@ function renderComboboxOption(item) {
|
|
|
77
76
|
}
|
|
78
77
|
return /* @__PURE__ */ jsx(ComboboxOptionItem, { option: item }, item.id);
|
|
79
78
|
}
|
|
80
|
-
function getCollectionFilter({
|
|
81
|
-
search,
|
|
82
|
-
hasItems,
|
|
83
|
-
inputValue,
|
|
84
|
-
contains
|
|
85
|
-
}) {
|
|
86
|
-
const searchProps = typeof search === "object" ? search : void 0;
|
|
87
|
-
if (searchProps?.mode === "server") {
|
|
88
|
-
return void 0;
|
|
89
|
-
}
|
|
90
|
-
const customFilter = searchProps?.filter;
|
|
91
|
-
if (customFilter) {
|
|
92
|
-
return (_textValue, node) => customFilter(node.value, inputValue);
|
|
93
|
-
}
|
|
94
|
-
if (search || hasItems) {
|
|
95
|
-
return (textValue) => contains(textValue, inputValue);
|
|
96
|
-
}
|
|
97
|
-
return void 0;
|
|
98
|
-
}
|
|
99
79
|
function ComboboxCollection({
|
|
100
80
|
normalizedOptions,
|
|
101
81
|
items,
|
|
@@ -170,22 +150,13 @@ function ComboboxListBox(props) {
|
|
|
170
150
|
options,
|
|
171
151
|
items,
|
|
172
152
|
children,
|
|
153
|
+
hiddenKey,
|
|
173
154
|
dependencies,
|
|
174
|
-
search,
|
|
175
155
|
loading,
|
|
176
156
|
isStale,
|
|
177
157
|
getItemTextValue
|
|
178
158
|
} = ownProps;
|
|
179
159
|
const normalizedOptions = options && normalizeOptions(options);
|
|
180
|
-
const state = useContext(ComboBoxStateContext);
|
|
181
|
-
const { contains } = useFilter({ sensitivity: "base" });
|
|
182
|
-
const inputValue = state?.inputValue ?? "";
|
|
183
|
-
const filter = getCollectionFilter({
|
|
184
|
-
search,
|
|
185
|
-
hasItems: items !== void 0,
|
|
186
|
-
inputValue,
|
|
187
|
-
contains
|
|
188
|
-
});
|
|
189
160
|
const isCollectionLoading = loading?.state === "loading" || loading?.state === "filtering" || loading?.state === "sorting";
|
|
190
161
|
const isBusy = isCollectionLoading || loading?.state === "loadingMore";
|
|
191
162
|
const showStale = useDelayedVisibility(
|
|
@@ -234,10 +205,16 @@ function ComboboxListBox(props) {
|
|
|
234
205
|
}
|
|
235
206
|
);
|
|
236
207
|
const busyListBox = /* @__PURE__ */ jsx("div", { "aria-busy": isBusy || void 0, children: listBox });
|
|
237
|
-
if (
|
|
208
|
+
if (hiddenKey === void 0) {
|
|
238
209
|
return busyListBox;
|
|
239
210
|
}
|
|
240
|
-
return /* @__PURE__ */ jsx(
|
|
211
|
+
return /* @__PURE__ */ jsx(
|
|
212
|
+
SelectableCollectionContext.Provider,
|
|
213
|
+
{
|
|
214
|
+
value: { filter: (_textValue, node) => node.key !== hiddenKey },
|
|
215
|
+
children: busyListBox
|
|
216
|
+
}
|
|
217
|
+
);
|
|
241
218
|
}
|
|
242
219
|
|
|
243
220
|
export { ComboboxListBox };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxListBox.esm.js","sources":["../../../src/components/Combobox/ComboboxListBox.tsx"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { cloneElement, useContext } from 'react';\nimport {\n Collection,\n ComboBoxStateContext,\n Header,\n ListBox,\n ListBoxLoadMoreItem,\n ListBoxSection,\n SelectableCollectionContext,\n Text,\n} from 'react-aria-components';\nimport { useFilter } from 'react-aria';\nimport clsx from 'clsx';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { normalizeOptions } from '../../utils/selectableCollection';\nimport { ComboboxItem } from './ComboboxItem';\nimport {\n ComboboxItemTextDefinition,\n ComboboxListBoxDefinition,\n ComboboxListBoxItemDefinition,\n ComboboxSectionDefinition,\n} from './definition';\nimport type {\n CollectionItem,\n LoadingConfig,\n NormalizedOption,\n NormalizedOptionSection,\n} from '../../types/selectableCollection';\nimport type { ComboboxListBoxOwnProps } from './types';\nimport type { Node } from '@react-types/shared';\nimport { Skeleton } from '../Skeleton';\nimport { useDelayedVisibility } from '../../hooks/useDelayedVisibility';\n\nconst loadingRowWidths = ['70%', '55%', '65%'];\nconst loadingIndicatorDelayMs = 300;\n\nfunction LoadingRows({\n count,\n className,\n rowClassName,\n}: {\n count: number;\n className: string;\n rowClassName: string;\n}) {\n return (\n <div className={className} aria-hidden=\"true\">\n {loadingRowWidths.slice(0, count).map(width => (\n <div key={width} className={rowClassName}>\n <Skeleton width={width} height=\"0.75rem\" />\n </div>\n ))}\n </div>\n );\n}\n\nconst NoResults = () => {\n const { ownProps } = useDefinition(ComboboxListBoxDefinition, {});\n const { classes } = ownProps;\n\n return <div className={classes.noResults}>No results found.</div>;\n};\n\nfunction ComboboxOptionItem({ option }: { option: NormalizedOption }) {\n const { ownProps } = useDefinition(ComboboxItemTextDefinition, {\n title: option.label,\n description: option.description,\n leadingIcon: option.leadingIcon,\n });\n const { classes } = ownProps;\n const {\n ownProps: { classes: legacyOptionClasses },\n } = useDefinition(ComboboxListBoxItemDefinition, {});\n\n return (\n <ComboboxItem\n id={option.id}\n value={option}\n className={classes.root}\n textValue={option.label}\n isDisabled={option.disabled}\n showSelectionIndicator\n >\n {option.leadingIcon && (\n <div className={classes.leadingIcon}>{option.leadingIcon}</div>\n )}\n <div className={classes.text}>\n <Text\n slot=\"label\"\n className={clsx(classes.title, legacyOptionClasses.label)}\n >\n {option.label}\n </Text>\n {option.description && (\n <Text slot=\"description\" className={classes.description}>\n {option.description}\n </Text>\n )}\n </div>\n </ComboboxItem>\n );\n}\n\nfunction ComboboxSectionItems({\n section,\n}: {\n section: NormalizedOptionSection;\n}) {\n const { ownProps } = useDefinition(ComboboxSectionDefinition, {});\n const { classes } = ownProps;\n\n return (\n <ListBoxSection className={classes.root}>\n <Header className={classes.header}>{section.title}</Header>\n {section.options.map(option => (\n <ComboboxOptionItem key={option.id} option={option} />\n ))}\n </ListBoxSection>\n );\n}\n\nfunction renderComboboxOption(\n item: NormalizedOption | NormalizedOptionSection,\n) {\n if ('options' in item) {\n return <ComboboxSectionItems key={item.title} section={item} />;\n }\n\n return <ComboboxOptionItem key={item.id} option={item} />;\n}\n\nfunction getCollectionFilter<T extends CollectionItem>({\n search,\n hasItems,\n inputValue,\n contains,\n}: {\n search?: ComboboxListBoxOwnProps<T>['search'];\n hasItems: boolean;\n inputValue: string;\n contains: (textValue: string, inputValue: string) => boolean;\n}) {\n const searchProps = typeof search === 'object' ? search : undefined;\n if (searchProps?.mode === 'server') {\n return undefined;\n }\n\n const customFilter = searchProps?.filter;\n if (customFilter) {\n return (_textValue: string, node: Node<T>) =>\n customFilter(node.value as T, inputValue);\n }\n\n if (search || hasItems) {\n return (textValue: string) => contains(textValue, inputValue);\n }\n\n return undefined;\n}\n\nfunction ComboboxCollection<T extends CollectionItem>({\n normalizedOptions,\n items,\n children,\n dependencies,\n getItemTextValue,\n}: {\n normalizedOptions?: Array<NormalizedOption | NormalizedOptionSection>;\n items?: Iterable<T>;\n children?: React.ReactNode | ((item: T) => React.ReactElement);\n dependencies?: ReadonlyArray<unknown>;\n getItemTextValue?: (item: T) => string;\n}) {\n if (normalizedOptions) {\n return <>{normalizedOptions.map(renderComboboxOption)}</>;\n }\n\n if (items) {\n const renderItemWithTextValue = (item: T) => {\n let renderedItem: React.ReactElement;\n if (typeof children === 'function') {\n renderedItem = children(item);\n } else {\n renderedItem = (\n <ComboboxOptionItem option={item as unknown as NormalizedOption} />\n );\n }\n\n if (!getItemTextValue) {\n return renderedItem;\n }\n\n return cloneElement(renderedItem, {\n textValue: getItemTextValue(item),\n });\n };\n\n return (\n <Collection items={items} dependencies={dependencies}>\n {renderItemWithTextValue}\n </Collection>\n );\n }\n\n return children as React.ReactNode;\n}\n\nfunction ComboboxEmptyState({\n isLoading,\n className,\n rowClassName,\n}: {\n isLoading: boolean;\n className: string;\n rowClassName: string;\n}) {\n if (!isLoading) {\n return <NoResults />;\n }\n\n return (\n <LoadingRows count={3} className={className} rowClassName={rowClassName} />\n );\n}\n\nfunction ComboboxLoadMoreIndicator({\n loading,\n isCollectionLoading,\n isIndicatorVisible,\n className,\n rowClassName,\n}: {\n loading?: LoadingConfig;\n isCollectionLoading: boolean;\n isIndicatorVisible: boolean;\n className: string;\n rowClassName: string;\n}) {\n if (!loading?.onLoadMore || isCollectionLoading) {\n return null;\n }\n\n const onLoadMore =\n loading.state === 'loadingMore' ? undefined : loading.onLoadMore;\n\n return (\n <ListBoxLoadMoreItem\n isLoading={isIndicatorVisible}\n onLoadMore={onLoadMore}\n scrollOffset={0}\n >\n <LoadingRows\n count={1}\n className={className}\n rowClassName={rowClassName}\n />\n </ListBoxLoadMoreItem>\n );\n}\n\nexport function ComboboxListBox<T extends CollectionItem>(\n props: ComboboxListBoxOwnProps<T>,\n) {\n const { ownProps } = useDefinition(ComboboxListBoxDefinition, props);\n const {\n classes,\n options,\n items,\n children,\n dependencies,\n search,\n loading,\n isStale,\n getItemTextValue,\n } = ownProps;\n const normalizedOptions = options && normalizeOptions(options);\n const state = useContext(ComboBoxStateContext);\n const { contains } = useFilter({ sensitivity: 'base' });\n const inputValue = state?.inputValue ?? '';\n const filter = getCollectionFilter({\n search,\n hasItems: items !== undefined,\n inputValue,\n contains,\n });\n const isCollectionLoading =\n loading?.state === 'loading' ||\n loading?.state === 'filtering' ||\n loading?.state === 'sorting';\n const isBusy = isCollectionLoading || loading?.state === 'loadingMore';\n const showStale = useDelayedVisibility(\n isStale ?? false,\n loadingIndicatorDelayMs,\n );\n const showLoadMoreIndicator = useDelayedVisibility(\n loading?.state === 'loadingMore',\n loadingIndicatorDelayMs,\n );\n\n const listBox = (\n <ListBox\n className={classes.root}\n data-stale={showStale || undefined}\n renderEmptyState={() => (\n <ComboboxEmptyState\n isLoading={isCollectionLoading}\n className={classes.loading}\n rowClassName={classes.loadingRow}\n />\n )}\n >\n <ComboboxCollection\n normalizedOptions={normalizedOptions}\n items={items}\n dependencies={dependencies}\n getItemTextValue={getItemTextValue}\n >\n {children}\n </ComboboxCollection>\n <ComboboxLoadMoreIndicator\n loading={loading}\n isCollectionLoading={isCollectionLoading}\n isIndicatorVisible={showLoadMoreIndicator}\n className={classes.loading}\n rowClassName={classes.loadingRow}\n />\n </ListBox>\n );\n\n const busyListBox = <div aria-busy={isBusy || undefined}>{listBox}</div>;\n\n if (!filter) {\n return busyListBox;\n }\n\n return (\n <SelectableCollectionContext.Provider value={{ filter }}>\n {busyListBox}\n </SelectableCollectionContext.Provider>\n );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;AAiDA,MAAM,gBAAA,GAAmB,CAAC,KAAA,EAAO,KAAA,EAAO,KAAK,CAAA;AAC7C,MAAM,uBAAA,GAA0B,GAAA;AAEhC,SAAS,WAAA,CAAY;AAAA,EACnB,KAAA;AAAA,EACA,SAAA;AAAA,EACA;AACF,CAAA,EAIG;AACD,EAAA,uBACE,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAsB,aAAA,EAAY,MAAA,EACpC,2BAAiB,KAAA,CAAM,CAAA,EAAG,KAAK,CAAA,CAAE,GAAA,CAAI,CAAA,KAAA,yBACnC,KAAA,EAAA,EAAgB,SAAA,EAAW,YAAA,EAC1B,QAAA,kBAAA,GAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAc,QAAO,SAAA,EAAU,CAAA,EAAA,EADjC,KAEV,CACD,CAAA,EACH,CAAA;AAEJ;AAEA,MAAM,YAAY,MAAM;AACtB,EAAA,MAAM,EAAE,QAAA,EAAS,GAAI,aAAA,CAAc,yBAAA,EAA2B,EAAE,CAAA;AAChE,EAAA,MAAM,EAAE,SAAQ,GAAI,QAAA;AAEpB,EAAA,uBAAO,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,OAAA,CAAQ,WAAW,QAAA,EAAA,mBAAA,EAAiB,CAAA;AAC7D,CAAA;AAEA,SAAS,kBAAA,CAAmB,EAAE,MAAA,EAAO,EAAiC;AACpE,EAAA,MAAM,EAAE,QAAA,EAAS,GAAI,aAAA,CAAc,0BAAA,EAA4B;AAAA,IAC7D,OAAO,MAAA,CAAO,KAAA;AAAA,IACd,aAAa,MAAA,CAAO,WAAA;AAAA,IACpB,aAAa,MAAA,CAAO;AAAA,GACrB,CAAA;AACD,EAAA,MAAM,EAAE,SAAQ,GAAI,QAAA;AACpB,EAAA,MAAM;AAAA,IACJ,QAAA,EAAU,EAAE,OAAA,EAAS,mBAAA;AAAoB,GAC3C,GAAI,aAAA,CAAc,6BAAA,EAA+B,EAAE,CAAA;AAEnD,EAAA,uBACE,IAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,IAAI,MAAA,CAAO,EAAA;AAAA,MACX,KAAA,EAAO,MAAA;AAAA,MACP,WAAW,OAAA,CAAQ,IAAA;AAAA,MACnB,WAAW,MAAA,CAAO,KAAA;AAAA,MAClB,YAAY,MAAA,CAAO,QAAA;AAAA,MACnB,sBAAA,EAAsB,IAAA;AAAA,MAErB,QAAA,EAAA;AAAA,QAAA,MAAA,CAAO,+BACN,GAAA,CAAC,KAAA,EAAA,EAAI,WAAW,OAAA,CAAQ,WAAA,EAAc,iBAAO,WAAA,EAAY,CAAA;AAAA,wBAE3D,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,OAAA,CAAQ,IAAA,EACtB,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,IAAA;AAAA,YAAA;AAAA,cACC,IAAA,EAAK,OAAA;AAAA,cACL,SAAA,EAAW,IAAA,CAAK,OAAA,CAAQ,KAAA,EAAO,oBAAoB,KAAK,CAAA;AAAA,cAEvD,QAAA,EAAA,MAAA,CAAO;AAAA;AAAA,WACV;AAAA,UACC,MAAA,CAAO,WAAA,oBACN,GAAA,CAAC,IAAA,EAAA,EAAK,IAAA,EAAK,eAAc,SAAA,EAAW,OAAA,CAAQ,WAAA,EACzC,QAAA,EAAA,MAAA,CAAO,WAAA,EACV;AAAA,SAAA,EAEJ;AAAA;AAAA;AAAA,GACF;AAEJ;AAEA,SAAS,oBAAA,CAAqB;AAAA,EAC5B;AACF,CAAA,EAEG;AACD,EAAA,MAAM,EAAE,QAAA,EAAS,GAAI,aAAA,CAAc,yBAAA,EAA2B,EAAE,CAAA;AAChE,EAAA,MAAM,EAAE,SAAQ,GAAI,QAAA;AAEpB,EAAA,uBACE,IAAA,CAAC,cAAA,EAAA,EAAe,SAAA,EAAW,OAAA,CAAQ,IAAA,EACjC,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,MAAA,EAAA,EAAO,SAAA,EAAW,OAAA,CAAQ,MAAA,EAAS,kBAAQ,KAAA,EAAM,CAAA;AAAA,IACjD,OAAA,CAAQ,QAAQ,GAAA,CAAI,CAAA,MAAA,yBAClB,kBAAA,EAAA,EAAmC,MAAA,EAAA,EAAX,MAAA,CAAO,EAAoB,CACrD;AAAA,GAAA,EACH,CAAA;AAEJ;AAEA,SAAS,qBACP,IAAA,EACA;AACA,EAAA,IAAI,aAAa,IAAA,EAAM;AACrB,IAAA,uBAAO,GAAA,CAAC,oBAAA,EAAA,EAAsC,OAAA,EAAS,IAAA,EAAA,EAArB,KAAK,KAAsB,CAAA;AAAA,EAC/D;AAEA,EAAA,uBAAO,GAAA,CAAC,kBAAA,EAAA,EAAiC,MAAA,EAAQ,IAAA,EAAA,EAAjB,KAAK,EAAkB,CAAA;AACzD;AAEA,SAAS,mBAAA,CAA8C;AAAA,EACrD,MAAA;AAAA,EACA,QAAA;AAAA,EACA,UAAA;AAAA,EACA;AACF,CAAA,EAKG;AACD,EAAA,MAAM,WAAA,GAAc,OAAO,MAAA,KAAW,QAAA,GAAW,MAAA,GAAS,MAAA;AAC1D,EAAA,IAAI,WAAA,EAAa,SAAS,QAAA,EAAU;AAClC,IAAA,OAAO,MAAA;AAAA,EACT;AAEA,EAAA,MAAM,eAAe,WAAA,EAAa,MAAA;AAClC,EAAA,IAAI,YAAA,EAAc;AAChB,IAAA,OAAO,CAAC,UAAA,EAAoB,IAAA,KAC1B,YAAA,CAAa,IAAA,CAAK,OAAY,UAAU,CAAA;AAAA,EAC5C;AAEA,EAAA,IAAI,UAAU,QAAA,EAAU;AACtB,IAAA,OAAO,CAAC,SAAA,KAAsB,QAAA,CAAS,SAAA,EAAW,UAAU,CAAA;AAAA,EAC9D;AAEA,EAAA,OAAO,MAAA;AACT;AAEA,SAAS,kBAAA,CAA6C;AAAA,EACpD,iBAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,YAAA;AAAA,EACA;AACF,CAAA,EAMG;AACD,EAAA,IAAI,iBAAA,EAAmB;AACrB,IAAA,uBAAO,GAAA,CAAA,QAAA,EAAA,EAAG,QAAA,EAAA,iBAAA,CAAkB,GAAA,CAAI,oBAAoB,CAAA,EAAE,CAAA;AAAA,EACxD;AAEA,EAAA,IAAI,KAAA,EAAO;AACT,IAAA,MAAM,uBAAA,GAA0B,CAAC,IAAA,KAAY;AAC3C,MAAA,IAAI,YAAA;AACJ,MAAA,IAAI,OAAO,aAAa,UAAA,EAAY;AAClC,QAAA,YAAA,GAAe,SAAS,IAAI,CAAA;AAAA,MAC9B,CAAA,MAAO;AACL,QAAA,YAAA,mBACE,GAAA,CAAC,kBAAA,EAAA,EAAmB,MAAA,EAAQ,IAAA,EAAqC,CAAA;AAAA,MAErE;AAEA,MAAA,IAAI,CAAC,gBAAA,EAAkB;AACrB,QAAA,OAAO,YAAA;AAAA,MACT;AAEA,MAAA,OAAO,aAAa,YAAA,EAAc;AAAA,QAChC,SAAA,EAAW,iBAAiB,IAAI;AAAA,OACjC,CAAA;AAAA,IACH,CAAA;AAEA,IAAA,uBACE,GAAA,CAAC,UAAA,EAAA,EAAW,KAAA,EAAc,YAAA,EACvB,QAAA,EAAA,uBAAA,EACH,CAAA;AAAA,EAEJ;AAEA,EAAA,OAAO,QAAA;AACT;AAEA,SAAS,kBAAA,CAAmB;AAAA,EAC1B,SAAA;AAAA,EACA,SAAA;AAAA,EACA;AACF,CAAA,EAIG;AACD,EAAA,IAAI,CAAC,SAAA,EAAW;AACd,IAAA,2BAAQ,SAAA,EAAA,EAAU,CAAA;AAAA,EACpB;AAEA,EAAA,uBACE,GAAA,CAAC,WAAA,EAAA,EAAY,KAAA,EAAO,CAAA,EAAG,WAAsB,YAAA,EAA4B,CAAA;AAE7E;AAEA,SAAS,yBAAA,CAA0B;AAAA,EACjC,OAAA;AAAA,EACA,mBAAA;AAAA,EACA,kBAAA;AAAA,EACA,SAAA;AAAA,EACA;AACF,CAAA,EAMG;AACD,EAAA,IAAI,CAAC,OAAA,EAAS,UAAA,IAAc,mBAAA,EAAqB;AAC/C,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,MAAM,UAAA,GACJ,OAAA,CAAQ,KAAA,KAAU,aAAA,GAAgB,SAAY,OAAA,CAAQ,UAAA;AAExD,EAAA,uBACE,GAAA;AAAA,IAAC,mBAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,kBAAA;AAAA,MACX,UAAA;AAAA,MACA,YAAA,EAAc,CAAA;AAAA,MAEd,QAAA,kBAAA,GAAA;AAAA,QAAC,WAAA;AAAA,QAAA;AAAA,UACC,KAAA,EAAO,CAAA;AAAA,UACP,SAAA;AAAA,UACA;AAAA;AAAA;AACF;AAAA,GACF;AAEJ;AAEO,SAAS,gBACd,KAAA,EACA;AACA,EAAA,MAAM,EAAE,QAAA,EAAS,GAAI,aAAA,CAAc,2BAA2B,KAAK,CAAA;AACnE,EAAA,MAAM;AAAA,IACJ,OAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,YAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA;AAAA,GACF,GAAI,QAAA;AACJ,EAAA,MAAM,iBAAA,GAAoB,OAAA,IAAW,gBAAA,CAAiB,OAAO,CAAA;AAC7D,EAAA,MAAM,KAAA,GAAQ,WAAW,oBAAoB,CAAA;AAC7C,EAAA,MAAM,EAAE,QAAA,EAAS,GAAI,UAAU,EAAE,WAAA,EAAa,QAAQ,CAAA;AACtD,EAAA,MAAM,UAAA,GAAa,OAAO,UAAA,IAAc,EAAA;AACxC,EAAA,MAAM,SAAS,mBAAA,CAAoB;AAAA,IACjC,MAAA;AAAA,IACA,UAAU,KAAA,KAAU,MAAA;AAAA,IACpB,UAAA;AAAA,IACA;AAAA,GACD,CAAA;AACD,EAAA,MAAM,mBAAA,GACJ,SAAS,KAAA,KAAU,SAAA,IACnB,SAAS,KAAA,KAAU,WAAA,IACnB,SAAS,KAAA,KAAU,SAAA;AACrB,EAAA,MAAM,MAAA,GAAS,mBAAA,IAAuB,OAAA,EAAS,KAAA,KAAU,aAAA;AACzD,EAAA,MAAM,SAAA,GAAY,oBAAA;AAAA,IAChB,OAAA,IAAW,KAAA;AAAA,IACX;AAAA,GACF;AACA,EAAA,MAAM,qBAAA,GAAwB,oBAAA;AAAA,IAC5B,SAAS,KAAA,KAAU,aAAA;AAAA,IACnB;AAAA,GACF;AAEA,EAAA,MAAM,OAAA,mBACJ,IAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACC,WAAW,OAAA,CAAQ,IAAA;AAAA,MACnB,cAAY,SAAA,IAAa,MAAA;AAAA,MACzB,kBAAkB,sBAChB,GAAA;AAAA,QAAC,kBAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAW,mBAAA;AAAA,UACX,WAAW,OAAA,CAAQ,OAAA;AAAA,UACnB,cAAc,OAAA,CAAQ;AAAA;AAAA,OACxB;AAAA,MAGF,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,kBAAA;AAAA,UAAA;AAAA,YACC,iBAAA;AAAA,YACA,KAAA;AAAA,YACA,YAAA;AAAA,YACA,gBAAA;AAAA,YAEC;AAAA;AAAA,SACH;AAAA,wBACA,GAAA;AAAA,UAAC,yBAAA;AAAA,UAAA;AAAA,YACC,OAAA;AAAA,YACA,mBAAA;AAAA,YACA,kBAAA,EAAoB,qBAAA;AAAA,YACpB,WAAW,OAAA,CAAQ,OAAA;AAAA,YACnB,cAAc,OAAA,CAAQ;AAAA;AAAA;AACxB;AAAA;AAAA,GACF;AAGF,EAAA,MAAM,8BAAc,GAAA,CAAC,KAAA,EAAA,EAAI,WAAA,EAAW,MAAA,IAAU,QAAY,QAAA,EAAA,OAAA,EAAQ,CAAA;AAElE,EAAA,IAAI,CAAC,MAAA,EAAQ;AACX,IAAA,OAAO,WAAA;AAAA,EACT;AAEA,EAAA,uBACE,GAAA,CAAC,4BAA4B,QAAA,EAA5B,EAAqC,OAAO,EAAE,MAAA,IAC5C,QAAA,EAAA,WAAA,EACH,CAAA;AAEJ;;;;"}
|
|
1
|
+
{"version":3,"file":"ComboboxListBox.esm.js","sources":["../../../src/components/Combobox/ComboboxListBox.tsx"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { cloneElement } from 'react';\nimport {\n Collection,\n Header,\n ListBox,\n ListBoxLoadMoreItem,\n ListBoxSection,\n SelectableCollectionContext,\n Text,\n} from 'react-aria-components';\nimport clsx from 'clsx';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { normalizeOptions } from '../../utils/selectableCollection';\nimport { ComboboxItem } from './ComboboxItem';\nimport {\n ComboboxItemTextDefinition,\n ComboboxListBoxDefinition,\n ComboboxListBoxItemDefinition,\n ComboboxSectionDefinition,\n} from './definition';\nimport type {\n CollectionItem,\n LoadingConfig,\n NormalizedOption,\n NormalizedOptionSection,\n} from '../../types/selectableCollection';\nimport type { ComboboxListBoxOwnProps } from './types';\nimport { Skeleton } from '../Skeleton';\nimport { useDelayedVisibility } from '../../hooks/useDelayedVisibility';\n\nconst loadingRowWidths = ['70%', '55%', '65%'];\nconst loadingIndicatorDelayMs = 300;\n\nfunction LoadingRows({\n count,\n className,\n rowClassName,\n}: {\n count: number;\n className: string;\n rowClassName: string;\n}) {\n return (\n <div className={className} aria-hidden=\"true\">\n {loadingRowWidths.slice(0, count).map(width => (\n <div key={width} className={rowClassName}>\n <Skeleton width={width} height=\"0.75rem\" />\n </div>\n ))}\n </div>\n );\n}\n\nconst NoResults = () => {\n const { ownProps } = useDefinition(ComboboxListBoxDefinition, {});\n const { classes } = ownProps;\n\n return <div className={classes.noResults}>No results found.</div>;\n};\n\nfunction ComboboxOptionItem({ option }: { option: NormalizedOption }) {\n const { ownProps } = useDefinition(ComboboxItemTextDefinition, {\n title: option.label,\n description: option.description,\n leadingIcon: option.leadingIcon,\n });\n const { classes } = ownProps;\n const {\n ownProps: { classes: legacyOptionClasses },\n } = useDefinition(ComboboxListBoxItemDefinition, {});\n\n return (\n <ComboboxItem\n id={option.id}\n value={option}\n className={classes.root}\n textValue={option.label}\n isDisabled={option.disabled}\n showSelectionIndicator\n >\n {option.leadingIcon && (\n <div className={classes.leadingIcon}>{option.leadingIcon}</div>\n )}\n <div className={classes.text}>\n <Text\n slot=\"label\"\n className={clsx(classes.title, legacyOptionClasses.label)}\n >\n {option.label}\n </Text>\n {option.description && (\n <Text slot=\"description\" className={classes.description}>\n {option.description}\n </Text>\n )}\n </div>\n </ComboboxItem>\n );\n}\n\nfunction ComboboxSectionItems({\n section,\n}: {\n section: NormalizedOptionSection;\n}) {\n const { ownProps } = useDefinition(ComboboxSectionDefinition, {});\n const { classes } = ownProps;\n\n return (\n <ListBoxSection className={classes.root}>\n <Header className={classes.header}>{section.title}</Header>\n {section.options.map(option => (\n <ComboboxOptionItem key={option.id} option={option} />\n ))}\n </ListBoxSection>\n );\n}\n\nfunction renderComboboxOption(\n item: NormalizedOption | NormalizedOptionSection,\n) {\n if ('options' in item) {\n return <ComboboxSectionItems key={item.title} section={item} />;\n }\n\n return <ComboboxOptionItem key={item.id} option={item} />;\n}\n\nfunction ComboboxCollection<T extends CollectionItem>({\n normalizedOptions,\n items,\n children,\n dependencies,\n getItemTextValue,\n}: {\n normalizedOptions?: Array<NormalizedOption | NormalizedOptionSection>;\n items?: Iterable<T>;\n children?: React.ReactNode | ((item: T) => React.ReactElement);\n dependencies?: ReadonlyArray<unknown>;\n getItemTextValue?: (item: T) => string;\n}) {\n if (normalizedOptions) {\n return <>{normalizedOptions.map(renderComboboxOption)}</>;\n }\n\n if (items) {\n const renderItemWithTextValue = (item: T) => {\n let renderedItem: React.ReactElement;\n if (typeof children === 'function') {\n renderedItem = children(item);\n } else {\n renderedItem = (\n <ComboboxOptionItem option={item as unknown as NormalizedOption} />\n );\n }\n\n if (!getItemTextValue) {\n return renderedItem;\n }\n\n return cloneElement(renderedItem, {\n textValue: getItemTextValue(item),\n });\n };\n\n return (\n <Collection items={items} dependencies={dependencies}>\n {renderItemWithTextValue}\n </Collection>\n );\n }\n\n return children as React.ReactNode;\n}\n\nfunction ComboboxEmptyState({\n isLoading,\n className,\n rowClassName,\n}: {\n isLoading: boolean;\n className: string;\n rowClassName: string;\n}) {\n if (!isLoading) {\n return <NoResults />;\n }\n\n return (\n <LoadingRows count={3} className={className} rowClassName={rowClassName} />\n );\n}\n\nfunction ComboboxLoadMoreIndicator({\n loading,\n isCollectionLoading,\n isIndicatorVisible,\n className,\n rowClassName,\n}: {\n loading?: LoadingConfig;\n isCollectionLoading: boolean;\n isIndicatorVisible: boolean;\n className: string;\n rowClassName: string;\n}) {\n if (!loading?.onLoadMore || isCollectionLoading) {\n return null;\n }\n\n const onLoadMore =\n loading.state === 'loadingMore' ? undefined : loading.onLoadMore;\n\n return (\n <ListBoxLoadMoreItem\n isLoading={isIndicatorVisible}\n onLoadMore={onLoadMore}\n scrollOffset={0}\n >\n <LoadingRows\n count={1}\n className={className}\n rowClassName={rowClassName}\n />\n </ListBoxLoadMoreItem>\n );\n}\n\nexport function ComboboxListBox<T extends CollectionItem>(\n props: ComboboxListBoxOwnProps<T>,\n) {\n const { ownProps } = useDefinition(ComboboxListBoxDefinition, props);\n const {\n classes,\n options,\n items,\n children,\n hiddenKey,\n dependencies,\n loading,\n isStale,\n getItemTextValue,\n } = ownProps;\n const normalizedOptions = options && normalizeOptions(options);\n const isCollectionLoading =\n loading?.state === 'loading' ||\n loading?.state === 'filtering' ||\n loading?.state === 'sorting';\n const isBusy = isCollectionLoading || loading?.state === 'loadingMore';\n const showStale = useDelayedVisibility(\n isStale ?? false,\n loadingIndicatorDelayMs,\n );\n const showLoadMoreIndicator = useDelayedVisibility(\n loading?.state === 'loadingMore',\n loadingIndicatorDelayMs,\n );\n\n const listBox = (\n <ListBox\n className={classes.root}\n data-stale={showStale || undefined}\n renderEmptyState={() => (\n <ComboboxEmptyState\n isLoading={isCollectionLoading}\n className={classes.loading}\n rowClassName={classes.loadingRow}\n />\n )}\n >\n <ComboboxCollection\n normalizedOptions={normalizedOptions}\n items={items}\n dependencies={dependencies}\n getItemTextValue={getItemTextValue}\n >\n {children}\n </ComboboxCollection>\n <ComboboxLoadMoreIndicator\n loading={loading}\n isCollectionLoading={isCollectionLoading}\n isIndicatorVisible={showLoadMoreIndicator}\n className={classes.loading}\n rowClassName={classes.loadingRow}\n />\n </ListBox>\n );\n\n const busyListBox = <div aria-busy={isBusy || undefined}>{listBox}</div>;\n\n if (hiddenKey === undefined) {\n return busyListBox;\n }\n\n return (\n <SelectableCollectionContext.Provider\n value={{ filter: (_textValue, node) => node.key !== hiddenKey }}\n >\n {busyListBox}\n </SelectableCollectionContext.Provider>\n );\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"definition.esm.js","sources":["../../../src/components/Combobox/definition.ts"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { defineComponent } from '../../hooks/useDefinition';\nimport type {\n ComboboxOwnProps,\n ComboboxInputOwnProps,\n ComboboxItemOwnProps,\n ComboboxItemProfileOwnProps,\n ComboboxItemTextOwnProps,\n ComboboxListBoxOwnProps,\n ComboboxListBoxItemOwnProps,\n ComboboxSectionOwnProps,\n} from './types';\nimport styles from './Combobox.module.css';\n\n/** @public */\nexport const ComboboxDefinition = defineComponent<ComboboxOwnProps>()({\n styles,\n classNames: {\n root: 'bui-Combobox',\n popover: 'bui-ComboboxPopover',\n },\n propDefs: {\n icon: {},\n size: { dataAttribute: true, default: 'small' },\n options: {},\n items: {},\n children: {},\n dependencies: {},\n search: {},\n loading: {},\n placeholder: {},\n label: {},\n secondaryLabel: {},\n description: {},\n isRequired: {},\n className: {},\n },\n});\n\n/** @public */\nexport const ComboboxInputDefinition = defineComponent<ComboboxInputOwnProps>()(\n {\n styles,\n classNames: {\n root: 'bui-ComboboxInput',\n icon: 'bui-ComboboxInputIcon',\n input: 'bui-ComboboxInputField',\n chevron: 'bui-ComboboxInputChevron',\n },\n bg: 'consumer',\n propDefs: {\n icon: {},\n placeholder: {},\n },\n },\n);\n\n/** @public */\nexport const ComboboxListBoxDefinition = defineComponent<\n ComboboxListBoxOwnProps<any>\n>()({\n styles,\n classNames: {\n root: 'bui-ComboboxList',\n noResults: 'bui-ComboboxNoResults',\n loading: 'bui-ComboboxLoading',\n loadingRow: 'bui-ComboboxLoadingRow',\n },\n propDefs: {\n options: {},\n items: {},\n children: {},\n
|
|
1
|
+
{"version":3,"file":"definition.esm.js","sources":["../../../src/components/Combobox/definition.ts"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { defineComponent } from '../../hooks/useDefinition';\nimport type {\n ComboboxOwnProps,\n ComboboxInputOwnProps,\n ComboboxItemOwnProps,\n ComboboxItemProfileOwnProps,\n ComboboxItemTextOwnProps,\n ComboboxListBoxOwnProps,\n ComboboxListBoxItemOwnProps,\n ComboboxSectionOwnProps,\n} from './types';\nimport styles from './Combobox.module.css';\n\n/** @public */\nexport const ComboboxDefinition = defineComponent<ComboboxOwnProps>()({\n styles,\n classNames: {\n root: 'bui-Combobox',\n popover: 'bui-ComboboxPopover',\n },\n propDefs: {\n icon: {},\n size: { dataAttribute: true, default: 'small' },\n options: {},\n items: {},\n children: {},\n dependencies: {},\n search: {},\n loading: {},\n placeholder: {},\n label: {},\n secondaryLabel: {},\n description: {},\n isRequired: {},\n className: {},\n },\n});\n\n/** @public */\nexport const ComboboxInputDefinition = defineComponent<ComboboxInputOwnProps>()(\n {\n styles,\n classNames: {\n root: 'bui-ComboboxInput',\n icon: 'bui-ComboboxInputIcon',\n input: 'bui-ComboboxInputField',\n chevron: 'bui-ComboboxInputChevron',\n },\n bg: 'consumer',\n propDefs: {\n icon: {},\n placeholder: {},\n },\n },\n);\n\n/** @public */\nexport const ComboboxListBoxDefinition = defineComponent<\n ComboboxListBoxOwnProps<any>\n>()({\n styles,\n classNames: {\n root: 'bui-ComboboxList',\n noResults: 'bui-ComboboxNoResults',\n loading: 'bui-ComboboxLoading',\n loadingRow: 'bui-ComboboxLoadingRow',\n },\n propDefs: {\n options: {},\n items: {},\n children: {},\n hiddenKey: {},\n dependencies: {},\n loading: {},\n isStale: {},\n getItemTextValue: {},\n },\n});\n\n/** @public */\nexport const ComboboxListBoxItemDefinition =\n defineComponent<ComboboxListBoxItemOwnProps>()({\n styles,\n classNames: {\n root: 'bui-ComboboxItem',\n indicator: 'bui-ComboboxItemIndicator',\n label: 'bui-ComboboxItemLabel',\n },\n propDefs: {},\n });\n\n/** @public */\nexport const ComboboxItemDefinition = defineComponent<ComboboxItemOwnProps>()({\n styles,\n classNames: {\n root: 'bui-ComboboxItem',\n indicator: 'bui-ComboboxItemIndicator',\n content: 'bui-ComboboxItemContent',\n },\n navigation: { type: 'anchor' },\n propDefs: {\n children: {},\n textValue: {},\n showSelectionIndicator: {},\n className: {},\n },\n});\n\n/** @public */\nexport const ComboboxItemTextDefinition =\n defineComponent<ComboboxItemTextOwnProps>()({\n styles,\n classNames: {\n root: 'bui-ComboboxItemText',\n leadingIcon: 'bui-ComboboxItemTextLeadingIcon',\n text: 'bui-ComboboxItemTextContent',\n title: 'bui-ComboboxItemTitle',\n description: 'bui-ComboboxItemDescription',\n },\n propDefs: {\n title: {},\n description: {},\n leadingIcon: {},\n textValue: {},\n className: {},\n },\n });\n\n/** @public */\nexport const ComboboxItemProfileDefinition =\n defineComponent<ComboboxItemProfileOwnProps>()({\n styles,\n classNames: {\n root: 'bui-ComboboxItemProfile',\n avatar: 'bui-ComboboxItemAvatar',\n name: 'bui-ComboboxItemTitle',\n },\n propDefs: {\n name: {},\n src: {},\n textValue: {},\n className: {},\n },\n });\n\n/** @public */\nexport const ComboboxSectionDefinition =\n defineComponent<ComboboxSectionOwnProps>()({\n styles,\n classNames: {\n root: 'bui-ComboboxSection',\n header: 'bui-ComboboxSectionHeader',\n },\n propDefs: {},\n });\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useAsyncComboboxState.esm.js","sources":["../../../src/components/Combobox/useAsyncComboboxState.ts"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport type { Key } from 'react-aria-components';\nimport type {\n AsyncListSource,\n CollectionItem,\n} from '../../types/selectableCollection';\n\ntype AsyncComboboxItem = CollectionItem &\n ({ textValue: string } | { label: string });\n\nfunction getItemTextValue(item: AsyncComboboxItem) {\n return 'textValue' in item ? item.textValue : item.label;\n}\n\nfunction resolveNextSelectedItem<T extends CollectionItem>({\n key,\n currentItem,\n sourceItems,\n isControlled,\n}: {\n key: Key | null;\n currentItem: T | null;\n sourceItems: T[];\n isControlled: boolean;\n}) {\n if (key === null) {\n return null;\n }\n\n if (isControlled && currentItem?.id === key) {\n return currentItem;\n }\n\n return sourceItems.find(item => item.id === key) ?? currentItem;\n}\n\ntype UseAsyncComboboxStateProps<T extends CollectionItem> = {\n source: AsyncListSource<T>;\n value?: T | null;\n defaultValue?: T | null;\n onChange?: (value: T | null) => void;\n allowsCustomValue?: boolean;\n};\n\n/** @internal */\nexport function useAsyncComboboxState<T extends CollectionItem>(\n props?: UseAsyncComboboxStateProps<T>,\n) {\n const isEnabled = props !== undefined;\n const { source, value, defaultValue, onChange, allowsCustomValue } =\n props ?? {};\n const isControlled = value !== undefined;\n const [uncontrolledValue, setUncontrolledValue] = useState<T | null>(\n defaultValue ?? null,\n );\n const selectedItem = isControlled ? value ?? null : uncontrolledValue;\n const selectedItemRef = useRef(selectedItem);\n const sourceItemsRef = useRef<T[]>([]);\n const inputValueRef = useRef('');\n const sourceFilterText = source?.filterText ?? '';\n const setSourceFilterText = source?.setFilterText;\n const sourceFilterTextRef = useRef(sourceFilterText);\n const preserveInputOnClearRef = useRef(false);\n const [inputValue, setInputValue] = useState(() =>\n selectedItem\n ? getAsyncComboboxItemTextValue(selectedItem)\n : sourceFilterText,\n );\n\n selectedItemRef.current = selectedItem;\n sourceItemsRef.current = source ? [...source.items] : [];\n inputValueRef.current = inputValue;\n sourceFilterTextRef.current = sourceFilterText;\n\n const updateInputValue = useCallback(\n (nextInputValue: string) => {\n setInputValue(nextInputValue);\n if (\n isEnabled &&\n setSourceFilterText &&\n sourceFilterTextRef.current !== nextInputValue\n ) {\n sourceFilterTextRef.current = nextInputValue;\n setSourceFilterText(nextInputValue);\n }\n },\n [isEnabled, setSourceFilterText],\n );\n\n useEffect(() => {\n if (isEnabled) {\n setInputValue(sourceFilterText);\n }\n }, [isEnabled, sourceFilterText]);\n\n const selectedId = selectedItem?.id ?? null;\n const selectedTextValue = selectedItem\n ? getAsyncComboboxItemTextValue(selectedItem)\n : undefined;\n const previousSelectedId = useRef<Key | null>(null);\n const previousSelectedTextValue = useRef<string>();\n\n useEffect(() => {\n if (!isEnabled) {\n return;\n }\n\n const selectionChanged =\n previousSelectedId.current !== selectedId ||\n previousSelectedTextValue.current !== selectedTextValue;\n\n previousSelectedId.current = selectedId;\n previousSelectedTextValue.current = selectedTextValue;\n\n if (selectionChanged) {\n if (selectedTextValue !== undefined) {\n updateInputValue(selectedTextValue);\n } else if (preserveInputOnClearRef.current) {\n preserveInputOnClearRef.current = false;\n } else {\n updateInputValue('');\n }\n }\n }, [isEnabled, selectedId, selectedTextValue, updateInputValue]);\n\n const freshSelectedItem = selectedItem\n ? sourceItemsRef.current.find(item => item.id === selectedItem.id)\n : undefined;\n const isEditing =\n selectedTextValue !== undefined &&\n inputValueRef.current !== selectedTextValue;\n\n useEffect(() => {\n if (\n isEnabled &&\n !isControlled &&\n !isEditing &&\n freshSelectedItem &&\n freshSelectedItem !== selectedItemRef.current\n ) {\n setUncontrolledValue(freshSelectedItem);\n }\n }, [freshSelectedItem, isControlled, isEditing, isEnabled]);\n\n const handleChange = useCallback(\n (key: Key | null) => {\n const currentItem = selectedItemRef.current;\n const currentTextValue = currentItem\n ? getAsyncComboboxItemTextValue(currentItem)\n : undefined;\n\n if (\n key === null &&\n allowsCustomValue &&\n currentTextValue === inputValueRef.current\n ) {\n updateInputValue(currentTextValue);\n return;\n }\n\n if (key === null && allowsCustomValue && currentItem) {\n preserveInputOnClearRef.current = true;\n }\n\n if (key === null && !currentItem && !allowsCustomValue) {\n updateInputValue('');\n return;\n }\n\n const nextItem = resolveNextSelectedItem({\n key,\n currentItem,\n sourceItems: sourceItemsRef.current,\n isControlled,\n });\n\n if (nextItem) {\n updateInputValue(getAsyncComboboxItemTextValue(nextItem));\n }\n\n if (!isControlled) {\n setUncontrolledValue(nextItem);\n }\n\n if (nextItem?.id !== currentItem?.id) {\n onChange?.(nextItem);\n }\n },\n [allowsCustomValue, isControlled, onChange, updateInputValue],\n );\n\n if (!isEnabled) {\n return undefined;\n }\n\n return {\n value: selectedItem?.id ?? null,\n inputValue,\n onChange: handleChange,\n onInputChange: updateInputValue,\n };\n}\n\n/** @internal */\nexport function getAsyncComboboxItemTextValue(item: CollectionItem) {\n return getItemTextValue(item as AsyncComboboxItem);\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"useAsyncComboboxState.esm.js","sources":["../../../src/components/Combobox/useAsyncComboboxState.ts"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport type { Key } from 'react-aria-components';\nimport type {\n AsyncListSource,\n CollectionItem,\n} from '../../types/selectableCollection';\n\ntype AsyncComboboxItem = CollectionItem &\n ({ textValue: string } | { label: string });\n\nfunction getItemTextValue(item: AsyncComboboxItem) {\n return 'textValue' in item ? item.textValue : item.label;\n}\n\nfunction resolveNextSelectedItem<T extends CollectionItem>({\n key,\n currentItem,\n sourceItems,\n isControlled,\n}: {\n key: Key | null;\n currentItem: T | null;\n sourceItems: T[];\n isControlled: boolean;\n}) {\n if (key === null) {\n return null;\n }\n\n if (isControlled && currentItem?.id === key) {\n return currentItem;\n }\n\n return sourceItems.find(item => item.id === key) ?? currentItem;\n}\n\ntype UseAsyncComboboxStateProps<T extends CollectionItem> = {\n source: AsyncListSource<T>;\n value?: T | null;\n defaultValue?: T | null;\n onChange?: (value: T | null) => void;\n allowsCustomValue?: boolean;\n};\n\n/** @internal */\nexport function useAsyncComboboxState<T extends CollectionItem>(\n props?: UseAsyncComboboxStateProps<T>,\n) {\n const isEnabled = props !== undefined;\n const { source, value, defaultValue, onChange, allowsCustomValue } =\n props ?? {};\n const isControlled = value !== undefined;\n const [uncontrolledValue, setUncontrolledValue] = useState<T | null>(\n defaultValue ?? null,\n );\n const selectedItem = isControlled ? value ?? null : uncontrolledValue;\n const selectedItemRef = useRef(selectedItem);\n const sourceItemsRef = useRef<T[]>([]);\n const inputValueRef = useRef('');\n const sourceFilterText = source?.filterText ?? '';\n const setSourceFilterText = source?.setFilterText;\n const sourceFilterTextRef = useRef(sourceFilterText);\n const preserveInputOnClearRef = useRef(false);\n const [inputValue, setInputValue] = useState(() =>\n selectedItem\n ? getAsyncComboboxItemTextValue(selectedItem)\n : sourceFilterText,\n );\n\n selectedItemRef.current = selectedItem;\n sourceItemsRef.current = source ? [...source.items] : [];\n inputValueRef.current = inputValue;\n sourceFilterTextRef.current = sourceFilterText;\n\n const updateInputValue = useCallback(\n (nextInputValue: string) => {\n setInputValue(nextInputValue);\n if (\n isEnabled &&\n setSourceFilterText &&\n sourceFilterTextRef.current !== nextInputValue\n ) {\n sourceFilterTextRef.current = nextInputValue;\n setSourceFilterText(nextInputValue);\n }\n },\n [isEnabled, setSourceFilterText],\n );\n\n useEffect(() => {\n if (isEnabled) {\n setInputValue(sourceFilterText);\n }\n }, [isEnabled, sourceFilterText]);\n\n const selectedId = selectedItem?.id ?? null;\n const selectedTextValue = selectedItem\n ? getAsyncComboboxItemTextValue(selectedItem)\n : undefined;\n const previousSelectedId = useRef<Key | null>(null);\n const previousSelectedTextValue = useRef<string>();\n\n useEffect(() => {\n if (!isEnabled) {\n return;\n }\n\n const selectionChanged =\n previousSelectedId.current !== selectedId ||\n previousSelectedTextValue.current !== selectedTextValue;\n\n previousSelectedId.current = selectedId;\n previousSelectedTextValue.current = selectedTextValue;\n\n if (selectionChanged) {\n if (selectedTextValue !== undefined) {\n updateInputValue(selectedTextValue);\n } else if (preserveInputOnClearRef.current) {\n preserveInputOnClearRef.current = false;\n } else {\n updateInputValue('');\n }\n }\n }, [isEnabled, selectedId, selectedTextValue, updateInputValue]);\n\n const freshSelectedItem = selectedItem\n ? sourceItemsRef.current.find(item => item.id === selectedItem.id)\n : undefined;\n const isEditing =\n selectedTextValue !== undefined &&\n inputValueRef.current !== selectedTextValue;\n\n useEffect(() => {\n if (\n isEnabled &&\n !isControlled &&\n !isEditing &&\n freshSelectedItem &&\n freshSelectedItem !== selectedItemRef.current\n ) {\n setUncontrolledValue(freshSelectedItem);\n }\n }, [freshSelectedItem, isControlled, isEditing, isEnabled]);\n\n const handleChange = useCallback(\n (key: Key | null) => {\n const currentItem = selectedItemRef.current;\n const currentTextValue = currentItem\n ? getAsyncComboboxItemTextValue(currentItem)\n : undefined;\n\n if (\n key === null &&\n allowsCustomValue &&\n currentTextValue === inputValueRef.current\n ) {\n updateInputValue(currentTextValue);\n return;\n }\n\n if (key === null && allowsCustomValue && currentItem) {\n preserveInputOnClearRef.current = true;\n }\n\n if (key === null && !currentItem && !allowsCustomValue) {\n updateInputValue('');\n return;\n }\n\n const nextItem = resolveNextSelectedItem({\n key,\n currentItem,\n sourceItems: sourceItemsRef.current,\n isControlled,\n });\n\n if (nextItem) {\n updateInputValue(getAsyncComboboxItemTextValue(nextItem));\n }\n\n if (!isControlled) {\n setUncontrolledValue(nextItem);\n }\n\n if (nextItem?.id !== currentItem?.id) {\n onChange?.(nextItem);\n }\n },\n [allowsCustomValue, isControlled, onChange, updateInputValue],\n );\n\n if (!isEnabled) {\n return undefined;\n }\n\n return {\n value: selectedItem?.id ?? null,\n inputValue,\n onChange: handleChange,\n onInputChange: updateInputValue,\n };\n}\n\n/** @internal */\nexport function getAsyncComboboxItemTextValue(item: CollectionItem) {\n return getItemTextValue(item as AsyncComboboxItem);\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Container.esm.js","sources":["../../../src/components/Container/Container.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef } from 'react';\nimport type { ContainerProps } from './types';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { ContainerDefinition } from './definition';\n\n/**\n * A centered layout wrapper that constrains content to a maximum width and provides consistent page-level padding.\n *\n * @public\n */\nexport const Container = forwardRef<HTMLDivElement, ContainerProps>(\n (props, ref) => {\n const { ownProps, restProps, utilityStyle } = useDefinition(\n ContainerDefinition,\n props,\n );\n const { classes, children, style } = ownProps;\n\n return (\n <div\n ref={ref}\n className={classes.root}\n style={{ ...utilityStyle, ...style }}\n {...restProps}\n >\n {children}\n </div>\n );\n },\n);\n\nContainer.displayName = 'Container';\n"],"names":[],"mappings":";;;;;AA0BO,MAAM,SAAA,GAAY,UAAA;AAAA,EACvB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,YAAA,EAAa,GAAI,aAAA;AAAA,MAC5C,mBAAA;AAAA,MACA;AAAA,KACF;AACA,IAAA,MAAM,EAAE,OAAA,EAAS,QAAA,EAAU,KAAA,EAAM,GAAI,QAAA;AAErC,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,WAAW,OAAA,CAAQ,IAAA;AAAA,QACnB,KAAA,EAAO,EAAE,GAAG,YAAA,EAAc,GAAG,KAAA,EAAM;AAAA,QAClC,GAAG,SAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AAEA,SAAA,CAAU,WAAA,GAAc,WAAA
|
|
1
|
+
{"version":3,"file":"Container.esm.js","sources":["../../../src/components/Container/Container.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef } from 'react';\nimport type { ContainerProps } from './types';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { ContainerDefinition } from './definition';\n\n/**\n * A centered layout wrapper that constrains content to a maximum width and provides consistent page-level padding.\n *\n * @public\n */\nexport const Container = forwardRef<HTMLDivElement, ContainerProps>(\n (props, ref) => {\n const { ownProps, restProps, utilityStyle } = useDefinition(\n ContainerDefinition,\n props,\n );\n const { classes, children, style } = ownProps;\n\n return (\n <div\n ref={ref}\n className={classes.root}\n style={{ ...utilityStyle, ...style }}\n {...restProps}\n >\n {children}\n </div>\n );\n },\n);\n\nContainer.displayName = 'Container';\n"],"names":[],"mappings":";;;;;AA0BO,MAAM,SAAA,GAAY,UAAA;AAAA,EACvB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,YAAA,EAAa,GAAI,aAAA;AAAA,MAC5C,mBAAA;AAAA,MACA;AAAA,KACF;AACA,IAAA,MAAM,EAAE,OAAA,EAAS,QAAA,EAAU,KAAA,EAAM,GAAI,QAAA;AAErC,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,WAAW,OAAA,CAAQ,IAAA;AAAA,QACnB,KAAA,EAAO,EAAE,GAAG,YAAA,EAAc,GAAG,KAAA,EAAM;AAAA,QAClC,GAAG,SAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AAEA,SAAA,CAAU,WAAA,GAAc,WAAA;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Container.module.css.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Container.module.css.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"definition.esm.js","sources":["../../../src/components/Container/definition.ts"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { defineComponent } from '../../hooks/useDefinition';\nimport type { ContainerOwnProps } from './types';\nimport styles from './Container.module.css';\n\n/**\n * Component definition for Container\n * @public\n */\nexport const ContainerDefinition = defineComponent<ContainerOwnProps>()({\n styles,\n classNames: {\n root: 'bui-Container',\n },\n propDefs: {\n children: {},\n className: {},\n style: {},\n },\n utilityProps: ['my', 'mt', 'mb', 'py', 'pt', 'pb', 'display'],\n});\n"],"names":[],"mappings":";;;;;;;;;;;;AAwBO,MAAM,mBAAA,GAAsB,iBAAmC,CAAE;AAAA,EACtE,MAAA;AAAA,EACA,UAAA,EAAY;AAAA,IACV,IAAA,EAAM;AAAA,GACR;AAAA,EACA,QAAA,EAAU;AAAA,IACR,UAAU,EAAC;AAAA,IACX,WAAW,EAAC;AAAA,IACZ,OAAO;AAAC,GACV;AAAA,EACA,YAAA,EAAc,CAAC,IAAA,EAAM,IAAA,EAAM,MAAM,IAAA,EAAM,IAAA,EAAM,MAAM,SAAS;AAC9D,CAAC
|
|
1
|
+
{"version":3,"file":"definition.esm.js","sources":["../../../src/components/Container/definition.ts"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { defineComponent } from '../../hooks/useDefinition';\nimport type { ContainerOwnProps } from './types';\nimport styles from './Container.module.css';\n\n/**\n * Component definition for Container\n * @public\n */\nexport const ContainerDefinition = defineComponent<ContainerOwnProps>()({\n styles,\n classNames: {\n root: 'bui-Container',\n },\n propDefs: {\n children: {},\n className: {},\n style: {},\n },\n utilityProps: ['my', 'mt', 'mb', 'py', 'pt', 'pb', 'display'],\n});\n"],"names":[],"mappings":";;;;;;;;;;;;AAwBO,MAAM,mBAAA,GAAsB,iBAAmC,CAAE;AAAA,EACtE,MAAA;AAAA,EACA,UAAA,EAAY;AAAA,IACV,IAAA,EAAM;AAAA,GACR;AAAA,EACA,QAAA,EAAU;AAAA,IACR,UAAU,EAAC;AAAA,IACX,WAAW,EAAC;AAAA,IACZ,OAAO;AAAC,GACV;AAAA,EACA,YAAA,EAAc,CAAC,IAAA,EAAM,IAAA,EAAM,MAAM,IAAA,EAAM,IAAA,EAAM,MAAM,SAAS;AAC9D,CAAC;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePicker.esm.js","sources":["../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef, useEffect } from 'react';\nimport { DatePicker as AriaDatePicker } from 'react-aria-components';\nimport { FieldLabel } from '../FieldLabel';\nimport { FieldError } from '../FieldError';\nimport { Popover } from '../Popover';\nimport { DatePickerGroup } from './DatePickerGroup';\nimport { DatePickerCalendar } from './DatePickerCalendar';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { DatePickerDefinition } from './definition';\nimport type { DatePickerProps } from './types';\n\n/**\n * A date picker that combines a date field and a calendar popover, allowing\n * users to enter or select a date with full keyboard and screen reader\n * accessibility.\n *\n * @public\n */\nexport const DatePicker = forwardRef<HTMLDivElement, DatePickerProps>(\n (props, ref) => {\n const { ownProps, restProps, dataAttributes } = useDefinition(\n DatePickerDefinition,\n props,\n );\n\n const { classes, label, description, secondaryLabel } = ownProps;\n\n const ariaLabel = restProps['aria-label'];\n const ariaLabelledBy = restProps['aria-labelledby'];\n\n useEffect(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn(\n 'DatePicker requires either a visible label, aria-label, or aria-labelledby for accessibility',\n );\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n const secondaryLabelText =\n secondaryLabel || (restProps.isRequired ? 'Required' : null);\n\n return (\n <AriaDatePicker\n className={classes.root}\n {...dataAttributes}\n {...restProps}\n ref={ref}\n >\n <FieldLabel\n label={label}\n secondaryLabel={secondaryLabelText}\n description={description}\n descriptionSlot=\"description\"\n />\n <DatePickerGroup dataSize={dataAttributes['data-size']} />\n <FieldError />\n <Popover hideArrow>\n <DatePickerCalendar />\n </Popover>\n </AriaDatePicker>\n );\n },\n);\n\nDatePicker.displayName = 'DatePicker';\n"],"names":["AriaDatePicker"],"mappings":";;;;;;;;;;;;;;AAkCO,MAAM,UAAA,GAAa,UAAA;AAAA,EACxB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,cAAA,EAAe,GAAI,aAAA;AAAA,MAC9C,oBAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,MAAM,EAAE,OAAA,EAAS,KAAA,EAAO,WAAA,EAAa,gBAAe,GAAI,QAAA;AAExD,IAAA,MAAM,SAAA,GAAY,UAAU,YAAY,CAAA;AACxC,IAAA,MAAM,cAAA,GAAiB,UAAU,iBAAiB,CAAA;AAElD,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,CAAC,KAAA,IAAS,CAAC,SAAA,IAAa,CAAC,cAAA,EAAgB;AAC3C,QAAA,OAAA,CAAQ,IAAA;AAAA,UACN;AAAA,SACF;AAAA,MACF;AAAA,IACF,CAAA,EAAG,CAAC,KAAA,EAAO,SAAA,EAAW,cAAc,CAAC,CAAA;AAErC,IAAA,MAAM,kBAAA,GACJ,cAAA,KAAmB,SAAA,CAAU,UAAA,GAAa,UAAA,GAAa,IAAA,CAAA;AAEzD,IAAA,uBACE,IAAA;AAAA,MAACA,YAAA;AAAA,MAAA;AAAA,QACC,WAAW,OAAA,CAAQ,IAAA;AAAA,QAClB,GAAG,cAAA;AAAA,QACH,GAAG,SAAA;AAAA,QACJ,GAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,UAAA;AAAA,YAAA;AAAA,cACC,KAAA;AAAA,cACA,cAAA,EAAgB,kBAAA;AAAA,cAChB,WAAA;AAAA,cACA,eAAA,EAAgB;AAAA;AAAA,WAClB;AAAA,0BACA,GAAA,CAAC,eAAA,EAAA,EAAgB,QAAA,EAAU,cAAA,CAAe,WAAW,CAAA,EAAG,CAAA;AAAA,8BACvD,UAAA,EAAA,EAAW,CAAA;AAAA,8BACX,OAAA,EAAA,EAAQ,SAAA,EAAS,IAAA,EAChB,QAAA,kBAAA,GAAA,CAAC,sBAAmB,CAAA,EACtB;AAAA;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;AAEA,UAAA,CAAW,WAAA,GAAc,YAAA
|
|
1
|
+
{"version":3,"file":"DatePicker.esm.js","sources":["../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef, useEffect } from 'react';\nimport { DatePicker as AriaDatePicker } from 'react-aria-components';\nimport { FieldLabel } from '../FieldLabel';\nimport { FieldError } from '../FieldError';\nimport { Popover } from '../Popover';\nimport { DatePickerGroup } from './DatePickerGroup';\nimport { DatePickerCalendar } from './DatePickerCalendar';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { DatePickerDefinition } from './definition';\nimport type { DatePickerProps } from './types';\n\n/**\n * A date picker that combines a date field and a calendar popover, allowing\n * users to enter or select a date with full keyboard and screen reader\n * accessibility.\n *\n * @public\n */\nexport const DatePicker = forwardRef<HTMLDivElement, DatePickerProps>(\n (props, ref) => {\n const { ownProps, restProps, dataAttributes } = useDefinition(\n DatePickerDefinition,\n props,\n );\n\n const { classes, label, description, secondaryLabel } = ownProps;\n\n const ariaLabel = restProps['aria-label'];\n const ariaLabelledBy = restProps['aria-labelledby'];\n\n useEffect(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn(\n 'DatePicker requires either a visible label, aria-label, or aria-labelledby for accessibility',\n );\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n const secondaryLabelText =\n secondaryLabel || (restProps.isRequired ? 'Required' : null);\n\n return (\n <AriaDatePicker\n className={classes.root}\n {...dataAttributes}\n {...restProps}\n ref={ref}\n >\n <FieldLabel\n label={label}\n secondaryLabel={secondaryLabelText}\n description={description}\n descriptionSlot=\"description\"\n />\n <DatePickerGroup dataSize={dataAttributes['data-size']} />\n <FieldError />\n <Popover hideArrow>\n <DatePickerCalendar />\n </Popover>\n </AriaDatePicker>\n );\n },\n);\n\nDatePicker.displayName = 'DatePicker';\n"],"names":["AriaDatePicker"],"mappings":";;;;;;;;;;;;;;AAkCO,MAAM,UAAA,GAAa,UAAA;AAAA,EACxB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,cAAA,EAAe,GAAI,aAAA;AAAA,MAC9C,oBAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,MAAM,EAAE,OAAA,EAAS,KAAA,EAAO,WAAA,EAAa,gBAAe,GAAI,QAAA;AAExD,IAAA,MAAM,SAAA,GAAY,UAAU,YAAY,CAAA;AACxC,IAAA,MAAM,cAAA,GAAiB,UAAU,iBAAiB,CAAA;AAElD,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,CAAC,KAAA,IAAS,CAAC,SAAA,IAAa,CAAC,cAAA,EAAgB;AAC3C,QAAA,OAAA,CAAQ,IAAA;AAAA,UACN;AAAA,SACF;AAAA,MACF;AAAA,IACF,CAAA,EAAG,CAAC,KAAA,EAAO,SAAA,EAAW,cAAc,CAAC,CAAA;AAErC,IAAA,MAAM,kBAAA,GACJ,cAAA,KAAmB,SAAA,CAAU,UAAA,GAAa,UAAA,GAAa,IAAA,CAAA;AAEzD,IAAA,uBACE,IAAA;AAAA,MAACA,YAAA;AAAA,MAAA;AAAA,QACC,WAAW,OAAA,CAAQ,IAAA;AAAA,QAClB,GAAG,cAAA;AAAA,QACH,GAAG,SAAA;AAAA,QACJ,GAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,UAAA;AAAA,YAAA;AAAA,cACC,KAAA;AAAA,cACA,cAAA,EAAgB,kBAAA;AAAA,cAChB,WAAA;AAAA,cACA,eAAA,EAAgB;AAAA;AAAA,WAClB;AAAA,0BACA,GAAA,CAAC,eAAA,EAAA,EAAgB,QAAA,EAAU,cAAA,CAAe,WAAW,CAAA,EAAG,CAAA;AAAA,8BACvD,UAAA,EAAA,EAAW,CAAA;AAAA,8BACX,OAAA,EAAA,EAAQ,SAAA,EAAS,IAAA,EAChB,QAAA,kBAAA,GAAA,CAAC,sBAAmB,CAAA,EACtB;AAAA;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;AAEA,UAAA,CAAW,WAAA,GAAc,YAAA;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePicker.module.css.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"DatePicker.module.css.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
|