@cube-dev/ui-kit 0.83.2 → 0.84.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 +14 -0
- package/es/_internal/hooks/index.js +1 -1
- package/es/_internal/hooks/use-chained-callback.js +1 -1
- package/es/_internal/hooks/use-debounced-value.js +1 -1
- package/es/_internal/hooks/use-deprecation-warning.js +1 -1
- package/es/_internal/hooks/use-effect-once.js +1 -1
- package/es/_internal/hooks/use-event.js +1 -1
- package/es/_internal/hooks/use-is-first-render.js +1 -1
- package/es/_internal/hooks/use-sync-ref.js +1 -1
- package/es/_internal/hooks/use-timer/index.js +1 -1
- package/es/_internal/hooks/use-timer/timer.js +1 -1
- package/es/_internal/hooks/use-timer/use-timer.js +1 -1
- package/es/_internal/hooks/use-update-effect.js +1 -1
- package/es/_internal/hooks/use-warn.js +1 -1
- package/es/_internal/index.js +1 -1
- package/es/components/Block.js +1 -1
- package/es/components/GlobalStyles.js +1 -1
- package/es/components/GridProvider.js +1 -1
- package/es/components/HiddenInput.js +1 -1
- package/es/components/Item.js +1 -1
- package/es/components/OpenTrasition.js +1 -1
- package/es/components/Root.js +1 -1
- package/es/components/actions/Action/Action.js +1 -1
- package/es/components/actions/Button/Button.js +1 -1
- package/es/components/actions/Button/index.js +1 -1
- package/es/components/actions/ButtonGroup/ButtonGroup.js +1 -1
- package/es/components/actions/CommandMenu/CommandMenu.js +1 -1
- package/es/components/actions/CommandMenu/index.js +1 -1
- package/es/components/actions/CommandMenu/styled.js +1 -1
- package/es/components/actions/ItemAction/ItemAction.js +1 -1
- package/es/components/actions/ItemAction/index.js +1 -1
- package/es/components/actions/ItemButton/ItemButton.js +1 -1
- package/es/components/actions/ItemButton/index.js +1 -1
- package/es/components/actions/Link/Link.js +1 -1
- package/es/components/actions/Menu/Menu.js +1 -1
- package/es/components/actions/Menu/MenuItem.js +1 -1
- package/es/components/actions/Menu/MenuSection.js +1 -1
- package/es/components/actions/Menu/MenuTrigger.js +1 -1
- package/es/components/actions/Menu/SubMenuTrigger.js +1 -1
- package/es/components/actions/Menu/SubmenuTriggerContext.js +1 -1
- package/es/components/actions/Menu/context.js +1 -1
- package/es/components/actions/Menu/index.js +1 -1
- package/es/components/actions/Menu/styled.js +1 -1
- package/es/components/actions/index.js +1 -1
- package/es/components/actions/use-action.js +1 -1
- package/es/components/actions/use-anchored-menu.js +1 -1
- package/es/components/actions/use-context-menu.js +1 -1
- package/es/components/content/ActiveZone/ActiveZone.js +1 -1
- package/es/components/content/Alert/Alert.js +1 -1
- package/es/components/content/Alert/index.js +1 -1
- package/es/components/content/Alert/types.js +1 -1
- package/es/components/content/Alert/use-alert.js +1 -1
- package/es/components/content/Avatar/Avatar.js +1 -1
- package/es/components/content/Badge/Badge.js +1 -1
- package/es/components/content/Card/Card.js +1 -1
- package/es/components/content/Content.js +1 -1
- package/es/components/content/CopyPasteBlock/CopyPasteBlock.js +1 -1
- package/es/components/content/CopyPasteBlock/index.js +1 -1
- package/es/components/content/CopySnippet/CopySnippet.js +1 -1
- package/es/components/content/CopySnippet/index.js +1 -1
- package/es/components/content/Divider.js +1 -1
- package/es/components/content/Footer.js +1 -1
- package/es/components/content/Header.js +1 -1
- package/es/components/content/HotKeys/HotKeys.js +1 -1
- package/es/components/content/HotKeys/index.js +1 -1
- package/es/components/content/ItemBase/ItemBase.js +1 -1
- package/es/components/content/ItemBase/index.js +1 -1
- package/es/components/content/List/SectionHeading.js +1 -1
- package/es/components/content/List/index.js +1 -1
- package/es/components/content/Paragraph.js +1 -1
- package/es/components/content/Placeholder/Placeholder.js +1 -1
- package/es/components/content/PrismCode/PrismCode.js +1 -1
- package/es/components/content/PrismCode/prismSetup.js +1 -1
- package/es/components/content/PrismDiffCode/PrismDiffCode.js +1 -1
- package/es/components/content/Result/Result.js +1 -1
- package/es/components/content/Skeleton/Skeleton.js +1 -1
- package/es/components/content/Tag/Tag.js +1 -1
- package/es/components/content/Text.js +1 -1
- package/es/components/content/Title.js +1 -1
- package/es/components/fields/Checkbox/Checkbox.js +1 -1
- package/es/components/fields/Checkbox/CheckboxGroup.js +1 -1
- package/es/components/fields/Checkbox/context.js +1 -1
- package/es/components/fields/Checkbox/index.js +1 -1
- package/es/components/fields/ComboBox/ComboBox.js +211 -123
- package/es/components/fields/ComboBox/index.js +1 -1
- package/es/components/fields/DatePicker/DateInput.js +1 -1
- package/es/components/fields/DatePicker/DateInputBase.js +1 -1
- package/es/components/fields/DatePicker/DatePicker.js +1 -1
- package/es/components/fields/DatePicker/DatePickerButton.js +1 -1
- package/es/components/fields/DatePicker/DatePickerElement.js +1 -1
- package/es/components/fields/DatePicker/DatePickerInput.js +1 -1
- package/es/components/fields/DatePicker/DatePickerSegment.js +1 -1
- package/es/components/fields/DatePicker/DateRangePicker.js +1 -1
- package/es/components/fields/DatePicker/DateRangeSeparatedPicker.js +1 -1
- package/es/components/fields/DatePicker/TimeInput.js +1 -1
- package/es/components/fields/DatePicker/index.js +1 -1
- package/es/components/fields/DatePicker/intl.js +1 -1
- package/es/components/fields/DatePicker/parseDate.js +1 -1
- package/es/components/fields/DatePicker/props.js +1 -1
- package/es/components/fields/DatePicker/types.js +1 -1
- package/es/components/fields/DatePicker/utils.js +1 -1
- package/es/components/fields/FileInput/FileInput.js +1 -1
- package/es/components/fields/FilterListBox/FilterListBox.js +4 -7
- package/es/components/fields/FilterListBox/index.js +1 -1
- package/es/components/fields/FilterPicker/FilterPicker.js +4 -4
- package/es/components/fields/FilterPicker/index.js +1 -1
- package/es/components/fields/Input/Input.js +1 -1
- package/es/components/fields/Input/index.js +1 -1
- package/es/components/fields/LegacyComboBox/LegacyComboBox.js +1 -1
- package/es/components/fields/LegacyComboBox/index.js +1 -1
- package/es/components/fields/ListBox/ListBox.js +7 -6
- package/es/components/fields/ListBox/index.js +1 -1
- package/es/components/fields/NumberInput/NumberInput.js +1 -1
- package/es/components/fields/NumberInput/StepButton.js +1 -1
- package/es/components/fields/PasswordInput/PasswordInput.js +1 -1
- package/es/components/fields/Picker/Picker.js +419 -0
- package/es/components/fields/Picker/index.js +10 -0
- package/es/components/fields/RadioGroup/Radio.js +3 -5
- package/es/components/fields/RadioGroup/RadioGroup.js +1 -1
- package/es/components/fields/RadioGroup/context.js +1 -1
- package/es/components/fields/RadioGroup/index.js +1 -1
- package/es/components/fields/SearchInput/SearchInput.js +1 -1
- package/es/components/fields/SearchInput/index.js +1 -1
- package/es/components/fields/Select/Select.js +1 -1
- package/es/components/fields/Select/index.js +1 -1
- package/es/components/fields/Slider/Gradation.js +1 -1
- package/es/components/fields/Slider/Header.js +1 -1
- package/es/components/fields/Slider/RangeSlider.js +1 -1
- package/es/components/fields/Slider/Slider.js +1 -1
- package/es/components/fields/Slider/SliderBase.js +1 -1
- package/es/components/fields/Slider/SliderInput.js +1 -1
- package/es/components/fields/Slider/SliderThumb.js +1 -1
- package/es/components/fields/Slider/SliderTrack.js +1 -1
- package/es/components/fields/Slider/elements.js +1 -1
- package/es/components/fields/Slider/index.js +1 -1
- package/es/components/fields/Slider/types.js +1 -1
- package/es/components/fields/Switch/Switch.js +1 -1
- package/es/components/fields/Switch/index.js +1 -1
- package/es/components/fields/TextArea/TextArea.js +1 -1
- package/es/components/fields/TextArea/index.js +1 -1
- package/es/components/fields/TextInput/TextInput.js +1 -1
- package/es/components/fields/TextInput/TextInputBase.js +1 -1
- package/es/components/fields/TextInput/index.js +1 -1
- package/es/components/fields/TextInputMapper/TextInputMapper.js +1 -1
- package/es/components/fields/TextInputMapper/index.js +1 -1
- package/es/components/fields/index.js +2 -1
- package/es/components/form/FieldWrapper/FieldWrapper.js +1 -1
- package/es/components/form/FieldWrapper/extract-field-wrapper-props.js +1 -1
- package/es/components/form/FieldWrapper/index.js +1 -1
- package/es/components/form/FieldWrapper/types.js +1 -1
- package/es/components/form/Form/Field.js +1 -1
- package/es/components/form/Form/Form.js +1 -1
- package/es/components/form/Form/ResetButton/ResetButton.js +1 -1
- package/es/components/form/Form/ResetButton/index.js +1 -1
- package/es/components/form/Form/SubmitButton/SubmitButton.js +1 -1
- package/es/components/form/Form/SubmitButton/index.js +1 -1
- package/es/components/form/Form/SubmitError.js +1 -1
- package/es/components/form/Form/index.js +1 -1
- package/es/components/form/Form/types.js +1 -1
- package/es/components/form/Form/use-field/index.js +1 -1
- package/es/components/form/Form/use-field/types.js +1 -1
- package/es/components/form/Form/use-field/use-field-props.js +1 -1
- package/es/components/form/Form/use-field/use-field.js +1 -1
- package/es/components/form/Form/use-form.js +1 -1
- package/es/components/form/Form/validation.js +1 -1
- package/es/components/form/Label.js +1 -1
- package/es/components/form/index.js +1 -1
- package/es/components/form/wrapper.js +1 -1
- package/es/components/helpers/DisplayTransition/DisplayTransition.js +1 -1
- package/es/components/helpers/index.js +1 -1
- package/es/components/layout/Flex.js +1 -1
- package/es/components/layout/Flow.js +1 -1
- package/es/components/layout/Grid.js +1 -1
- package/es/components/layout/Panel.js +1 -1
- package/es/components/layout/Prefix.js +1 -1
- package/es/components/layout/ResizablePanel.js +1 -1
- package/es/components/layout/Space.js +1 -1
- package/es/components/layout/Suffix.js +1 -1
- package/es/components/navigation/LegacyTabs/LegacyTabs.js +1 -1
- package/es/components/organisms/FileTabs/FileTabs.js +1 -1
- package/es/components/organisms/StatsCard/StatsCard.js +1 -1
- package/es/components/other/Base64Upload/Base64Upload.js +1 -1
- package/es/components/other/Calendar/Calendar.js +1 -1
- package/es/components/other/Calendar/CalendarCell.js +1 -1
- package/es/components/other/Calendar/CalendarGrid.js +1 -1
- package/es/components/other/Calendar/RangeCalendar.js +1 -1
- package/es/components/other/CloudLogo/CloudLogo.js +1 -1
- package/es/components/overlays/AlertDialog/AlertDialog.js +1 -1
- package/es/components/overlays/AlertDialog/AlertDialogApiProvider.js +1 -1
- package/es/components/overlays/AlertDialog/AlertDialogZone.js +1 -1
- package/es/components/overlays/AlertDialog/index.js +1 -1
- package/es/components/overlays/AlertDialog/types.js +1 -1
- package/es/components/overlays/Dialog/Dialog.js +2 -1
- package/es/components/overlays/Dialog/DialogContainer.js +1 -1
- package/es/components/overlays/Dialog/DialogForm.js +1 -1
- package/es/components/overlays/Dialog/DialogTrigger.js +1 -1
- package/es/components/overlays/Dialog/context.js +1 -1
- package/es/components/overlays/Dialog/index.js +1 -1
- package/es/components/overlays/Dialog/use-dialog-container.js +1 -1
- package/es/components/overlays/Modal/Modal.js +1 -1
- package/es/components/overlays/Modal/OpenTransition.js +1 -1
- package/es/components/overlays/Modal/Overlay.js +1 -1
- package/es/components/overlays/Modal/Popover.js +1 -1
- package/es/components/overlays/Modal/Tray.js +1 -1
- package/es/components/overlays/Modal/Underlay.js +1 -1
- package/es/components/overlays/Modal/index.js +1 -1
- package/es/components/overlays/Modal/types.js +1 -1
- package/es/components/overlays/NewNotifications/Bar/FloatingNotification.js +1 -1
- package/es/components/overlays/NewNotifications/Bar/NotificationsBar.js +1 -1
- package/es/components/overlays/NewNotifications/Bar/TransitionComponent.js +1 -1
- package/es/components/overlays/NewNotifications/Bar/index.js +1 -1
- package/es/components/overlays/NewNotifications/Dialog/NotificationsDialogContext.js +1 -1
- package/es/components/overlays/NewNotifications/Dialog/NotificationsDialogTrigger.js +1 -1
- package/es/components/overlays/NewNotifications/Dialog/index.js +1 -1
- package/es/components/overlays/NewNotifications/Notification.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationView/NotificationAction.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationView/NotificationCloseButton.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationView/NotificationDescription.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationView/NotificationFooter.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationView/NotificationHeader.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationView/NotificationIcon.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationView/NotificationProvider.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationView/NotificationView.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationView/index.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationView/types.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationsContext/NotificationsContext.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationsContext/NotificationsProvider.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationsContext/index.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationsContext/use-notifications.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationsList/NotificationsList.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationsList/NotificationsListItem.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationsList/index.js +1 -1
- package/es/components/overlays/NewNotifications/NotificationsList/types.js +1 -1
- package/es/components/overlays/NewNotifications/hooks/index.js +1 -1
- package/es/components/overlays/NewNotifications/hooks/types.js +1 -1
- package/es/components/overlays/NewNotifications/hooks/use-notification-list-item.js +1 -1
- package/es/components/overlays/NewNotifications/hooks/use-notifications-api.js +1 -1
- package/es/components/overlays/NewNotifications/hooks/use-notifications-list.js +1 -1
- package/es/components/overlays/NewNotifications/hooks/use-notifications-observer.js +1 -1
- package/es/components/overlays/NewNotifications/index.js +1 -1
- package/es/components/overlays/NewNotifications/types.js +1 -1
- package/es/components/overlays/Notification/Notification.js +1 -1
- package/es/components/overlays/OverlayWrapper.js +1 -1
- package/es/components/overlays/Toasts/Toast.js +1 -1
- package/es/components/overlays/Toasts/index.js +1 -1
- package/es/components/overlays/Toasts/types.js +1 -1
- package/es/components/overlays/Toasts/use-toasts-api.js +1 -1
- package/es/components/overlays/Tooltip/Tooltip.js +1 -1
- package/es/components/overlays/Tooltip/TooltipProvider.js +1 -1
- package/es/components/overlays/Tooltip/TooltipTrigger.js +1 -1
- package/es/components/overlays/Tooltip/context.js +1 -1
- package/es/components/overlays/Tooltip/index.js +1 -1
- package/es/components/portal/Portal.js +1 -1
- package/es/components/portal/PortalProvider.js +1 -1
- package/es/components/portal/index.js +1 -1
- package/es/components/portal/types.js +1 -1
- package/es/components/portal/usePortal.js +1 -1
- package/es/components/shared/InvalidIcon.js +1 -1
- package/es/components/shared/ValidIcon.js +1 -1
- package/es/components/status/LoadingAnimation/LoadingAnimation.js +1 -1
- package/es/components/status/LoadingAnimation/index.js +1 -1
- package/es/components/status/Spin/Cube.js +1 -1
- package/es/components/status/Spin/InternalSpinner.js +1 -1
- package/es/components/status/Spin/Spin.js +1 -1
- package/es/components/status/Spin/SpinsContainer.js +1 -1
- package/es/components/status/Spin/index.js +1 -1
- package/es/components/status/Spin/types.js +1 -1
- package/es/components/status/index.js +1 -1
- package/es/data/item-themes.js +1 -1
- package/es/data/themes.js +1 -1
- package/es/icons/AdjustmentsHorizontalIcon.js +1 -1
- package/es/icons/AdjustmentsIcon.js +1 -1
- package/es/icons/AiIcon.js +1 -1
- package/es/icons/AreaChartIcon.js +1 -1
- package/es/icons/BackwardIcon.js +1 -1
- package/es/icons/BarChartIcon.js +1 -1
- package/es/icons/BellFilledIcon.js +1 -1
- package/es/icons/BellIcon.js +1 -1
- package/es/icons/BooleanIcon.js +1 -1
- package/es/icons/CalendarEditIcon.js +1 -1
- package/es/icons/CalendarIcon.js +1 -1
- package/es/icons/CaretDownIcon.js +1 -1
- package/es/icons/CaretUpIcon.js +1 -1
- package/es/icons/ChartAreaStackedIcon.js +1 -1
- package/es/icons/ChartAreaStackedPercentageIcon.js +1 -1
- package/es/icons/ChartBarGroupedHorizontalIcon.js +1 -1
- package/es/icons/ChartBarGroupedIcon.js +1 -1
- package/es/icons/ChartBarHorizontalIcon.js +1 -1
- package/es/icons/ChartBarLineIcon.js +1 -1
- package/es/icons/ChartBarStackedHorizontalIcon.js +1 -1
- package/es/icons/ChartBarStackedIcon.js +1 -1
- package/es/icons/ChartBarStackedPercentageHorizontalIcon.js +1 -1
- package/es/icons/ChartBarStackedPercentageIcon.js +1 -1
- package/es/icons/ChartBoxPlot2Icon.js +1 -1
- package/es/icons/ChartBoxPlotIcon.js +1 -1
- package/es/icons/ChartBubbleIcon.js +1 -1
- package/es/icons/ChartDonut2Icon.js +1 -1
- package/es/icons/ChartFunnelIcon.js +1 -1
- package/es/icons/ChartHeatmapIcon.js +1 -1
- package/es/icons/ChartKPIIcon.js +1 -1
- package/es/icons/ChartPie2Icon.js +1 -1
- package/es/icons/ChartScatterIcon.js +1 -1
- package/es/icons/CheckCircleFilledIcon.js +1 -1
- package/es/icons/CheckCircleIcon.js +1 -1
- package/es/icons/CheckIcon.js +1 -1
- package/es/icons/CircleFilledIcon.js +1 -1
- package/es/icons/ClearIcon.js +1 -1
- package/es/icons/CloseCircleFilledIcon.js +1 -1
- package/es/icons/CloseCircleIcon.js +1 -1
- package/es/icons/CloseIcon.js +1 -1
- package/es/icons/CodeIcon.js +1 -1
- package/es/icons/CopyIcon.js +1 -1
- package/es/icons/CountIcon.js +1 -1
- package/es/icons/CubeIcon.js +1 -1
- package/es/icons/CubePauseIcon.js +1 -1
- package/es/icons/CubePlayIcon.js +1 -1
- package/es/icons/CurrencyDollarIcon.js +1 -1
- package/es/icons/DangerIcon.js +1 -1
- package/es/icons/DashboardIcon.js +1 -1
- package/es/icons/DatabaseIcon.js +1 -1
- package/es/icons/DecimalDecreaseIcon.js +1 -1
- package/es/icons/DecimalIncreaseIcon.js +1 -1
- package/es/icons/DirectionIcon.js +1 -1
- package/es/icons/DonutIcon.js +1 -1
- package/es/icons/DownIcon.js +1 -1
- package/es/icons/EditIcon.js +1 -1
- package/es/icons/ExclamationCircleFilledIcon.js +1 -1
- package/es/icons/ExclamationCircleIcon.js +1 -1
- package/es/icons/ExclamationIcon.js +1 -1
- package/es/icons/EyeIcon.js +1 -1
- package/es/icons/EyeInvisibleIcon.js +1 -1
- package/es/icons/FilterIcon.js +1 -1
- package/es/icons/FolderFilledIcon.js +1 -1
- package/es/icons/FolderIcon.js +1 -1
- package/es/icons/FolderOpenFilledIcon.js +1 -1
- package/es/icons/FolderOpenIcon.js +1 -1
- package/es/icons/ForwardIcon.js +1 -1
- package/es/icons/HierarchyIcon.js +1 -1
- package/es/icons/Icon.js +1 -1
- package/es/icons/InfoCircleIcon.js +1 -1
- package/es/icons/InfoIcon.js +1 -1
- package/es/icons/KeyIcon.js +1 -1
- package/es/icons/LeftIcon.js +1 -1
- package/es/icons/LineChartIcon.js +1 -1
- package/es/icons/LoadingIcon.js +1 -1
- package/es/icons/LockFilledIcon.js +1 -1
- package/es/icons/LockIcon.js +1 -1
- package/es/icons/MoreIcon.js +1 -1
- package/es/icons/NotAllowedIcon.js +1 -1
- package/es/icons/Number123Icon.js +1 -1
- package/es/icons/NumberIcon.js +1 -1
- package/es/icons/PauseCircleFilledIcon.js +1 -1
- package/es/icons/PauseCircleIcon.js +1 -1
- package/es/icons/PauseIcon.js +1 -1
- package/es/icons/PercentageIcon.js +1 -1
- package/es/icons/PieChartIcon.js +1 -1
- package/es/icons/PlayCircleIcon.js +1 -1
- package/es/icons/PlayIcon.js +1 -1
- package/es/icons/PlusIcon.js +1 -1
- package/es/icons/ProgressBarIcon.js +12 -0
- package/es/icons/ReloadIcon.js +1 -1
- package/es/icons/ReportIcon.js +1 -1
- package/es/icons/ReturnIcon.js +1 -1
- package/es/icons/RightIcon.js +1 -1
- package/es/icons/SchemeIcon.js +1 -1
- package/es/icons/SearchIcon.js +1 -1
- package/es/icons/SettingsIcon.js +1 -1
- package/es/icons/ShieldFilledIcon.js +1 -1
- package/es/icons/ShieldIcon.js +1 -1
- package/es/icons/SlashIcon.js +1 -1
- package/es/icons/SparklesIcon.js +1 -1
- package/es/icons/SqlIcon.js +1 -1
- package/es/icons/StatsIcon.js +1 -1
- package/es/icons/StopIcon.js +1 -1
- package/es/icons/StringIcon.js +1 -1
- package/es/icons/SwitchIcon.js +1 -1
- package/es/icons/TableIcon.js +1 -1
- package/es/icons/ThumbsDownIcon.js +1 -1
- package/es/icons/ThumbsUpIcon.js +1 -1
- package/es/icons/ThunderboltCrossedIcon.js +1 -1
- package/es/icons/ThunderboltFilledIcon.js +1 -1
- package/es/icons/ThunderboltIcon.js +1 -1
- package/es/icons/TimeIcon.js +1 -1
- package/es/icons/UnlockIcon.js +1 -1
- package/es/icons/UpIcon.js +1 -1
- package/es/icons/UserGroupIcon.js +1 -1
- package/es/icons/UserIcon.js +1 -1
- package/es/icons/UserLockIcon.js +1 -1
- package/es/icons/ViewIcon.js +1 -1
- package/es/icons/WarningFilledIcon.js +1 -1
- package/es/icons/WarningIcon.js +1 -1
- package/es/icons/add-new-icon.js +1 -1
- package/es/icons/index.js +2 -1
- package/es/icons/wrap-icon.js +1 -1
- package/es/index.js +1 -1
- package/es/provider.js +1 -1
- package/es/providers/TrackingProvider.js +1 -1
- package/es/providers/navigation.types.js +1 -1
- package/es/providers/navigationAdapter.default.js +1 -1
- package/es/services/notification.js +1 -1
- package/es/shared/form.js +1 -1
- package/es/shared/index.js +1 -1
- package/es/stories/Form.legacy-stories.js +1 -1
- package/es/stories/FormFieldArgs.js +1 -1
- package/es/stories/Layout.stories.js +1 -1
- package/es/stories/Tasty.stories.js +1 -1
- package/es/stories/components/ConfirmDeletionDialogForm.js +1 -1
- package/es/stories/components/DialogFormApp.js +1 -1
- package/es/stories/components/StyledButton.js +1 -1
- package/es/stories/lists/baseProps.js +1 -1
- package/es/tasty/debug.js +1 -1
- package/es/tasty/index.js +1 -1
- package/es/tasty/injector/index.js +1 -1
- package/es/tasty/injector/injector.js +1 -1
- package/es/tasty/injector/sheet-manager.js +1 -1
- package/es/tasty/injector/types.js +1 -1
- package/es/tasty/parser/classify.js +1 -1
- package/es/tasty/parser/const.js +1 -1
- package/es/tasty/parser/lru.js +1 -1
- package/es/tasty/parser/parser.js +1 -1
- package/es/tasty/parser/tokenizer.js +1 -1
- package/es/tasty/parser/types.js +1 -1
- package/es/tasty/providers/BreakpointsProvider.js +1 -1
- package/es/tasty/styles/align.js +1 -1
- package/es/tasty/styles/border.js +1 -1
- package/es/tasty/styles/boxShadow.combinator.js +1 -1
- package/es/tasty/styles/color.js +1 -1
- package/es/tasty/styles/createStyle.js +1 -1
- package/es/tasty/styles/dimension.js +1 -1
- package/es/tasty/styles/display.js +1 -1
- package/es/tasty/styles/fade.js +1 -1
- package/es/tasty/styles/fill.js +1 -1
- package/es/tasty/styles/flow.js +1 -1
- package/es/tasty/styles/font.js +1 -1
- package/es/tasty/styles/fontStyle.js +1 -1
- package/es/tasty/styles/gap.js +1 -1
- package/es/tasty/styles/groupRadius.js +1 -1
- package/es/tasty/styles/height.js +1 -1
- package/es/tasty/styles/index.js +1 -1
- package/es/tasty/styles/inset.js +1 -1
- package/es/tasty/styles/justify.js +1 -1
- package/es/tasty/styles/list.js +1 -1
- package/es/tasty/styles/margin.js +1 -1
- package/es/tasty/styles/outline.js +1 -1
- package/es/tasty/styles/padding.js +1 -1
- package/es/tasty/styles/place.js +1 -1
- package/es/tasty/styles/predefined.js +1 -1
- package/es/tasty/styles/preset.js +1 -1
- package/es/tasty/styles/radius.js +1 -1
- package/es/tasty/styles/reset.js +1 -1
- package/es/tasty/styles/scrollbar.js +1 -1
- package/es/tasty/styles/shadow.js +1 -1
- package/es/tasty/styles/styledScrollbar.js +1 -1
- package/es/tasty/styles/transition.js +1 -1
- package/es/tasty/styles/types.js +1 -1
- package/es/tasty/styles/width.js +1 -1
- package/es/tasty/tasty.js +1 -1
- package/es/tasty/types.js +1 -1
- package/es/tasty/utils/cache-wrapper.js +1 -1
- package/es/tasty/utils/case-converter.js +1 -1
- package/es/tasty/utils/colors.js +1 -1
- package/es/tasty/utils/dotize.js +1 -1
- package/es/tasty/utils/filterBaseProps.js +1 -1
- package/es/tasty/utils/getDisplayName.js +1 -1
- package/es/tasty/utils/getModCombinations.js +1 -1
- package/es/tasty/utils/isDevEnv.js +1 -1
- package/es/tasty/utils/mergeStyles.js +1 -1
- package/es/tasty/utils/modAttrs.js +1 -1
- package/es/tasty/utils/renderStyles.js +1 -1
- package/es/tasty/utils/responsive.js +1 -1
- package/es/tasty/utils/string.js +1 -1
- package/es/tasty/utils/styles.js +1 -1
- package/es/tasty/utils/warnings.js +1 -1
- package/es/tokens.js +1 -1
- package/es/utils/ResizeSensor.js +1 -1
- package/es/utils/modules.js +1 -1
- package/es/utils/promise.js +1 -1
- package/es/utils/random.js +1 -1
- package/es/utils/range.js +1 -1
- package/es/utils/react/Slots.js +1 -1
- package/es/utils/react/chain.js +1 -1
- package/es/utils/react/forwardRefWithGenerics.js +1 -1
- package/es/utils/react/index.js +1 -1
- package/es/utils/react/interactions.js +1 -1
- package/es/utils/react/isTextOnly.js +1 -1
- package/es/utils/react/mapProps.js +1 -1
- package/es/utils/react/mergeProps.js +1 -1
- package/es/utils/react/nullableValue.js +1 -1
- package/es/utils/react/sharedStore.js +1 -1
- package/es/utils/react/useCombinedRefs.js +1 -1
- package/es/utils/react/useControlledFocusVisible.js +1 -1
- package/es/utils/react/useEventBus.js +1 -1
- package/es/utils/react/useId.js +1 -1
- package/es/utils/react/useIsDarwin.js +1 -1
- package/es/utils/react/useKeySymbols.js +1 -1
- package/es/utils/react/useLayoutEffect.js +1 -1
- package/es/utils/react/useQaProps.js +1 -1
- package/es/utils/react/useViewportSize.js +1 -1
- package/es/utils/react/wrapNodeIfPlain.js +1 -1
- package/es/utils/transitions.js +1 -1
- package/es/utils/tree.js +1 -1
- package/es/utils/warnings.js +1 -1
- package/es/version.js +2 -2
- package/package.json +1 -1
- package/types/components/fields/FilterListBox/FilterListBox.d.ts +1 -1
- package/types/components/fields/ListBox/ListBox.d.ts +6 -0
- package/types/components/fields/Picker/Picker.d.ts +69 -0
- package/types/components/fields/Picker/index.d.ts +2 -0
- package/types/components/fields/index.d.ts +1 -0
- package/types/icons/ProgressBarIcon.d.ts +4 -0
- package/types/icons/index.d.ts +1 -0
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @license MIT
|
|
3
3
|
* author: Cube Dev Team
|
|
4
|
-
* @cube-dev/ui-kit v0.
|
|
4
|
+
* @cube-dev/ui-kit v0.84.0
|
|
5
5
|
* Released under the MIT license.
|
|
6
6
|
*/
|
|
7
7
|
|
|
8
8
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
9
9
|
import React, { cloneElement, forwardRef, useCallback, useEffect, useMemo, useRef, useState, } from 'react';
|
|
10
10
|
import { useFilter, useKeyboard, useOverlay, useOverlayPosition, } from 'react-aria';
|
|
11
|
-
import { Section as BaseSection } from 'react-stately';
|
|
11
|
+
import { Section as BaseSection, useListState } from 'react-stately';
|
|
12
12
|
import { useEvent } from '../../../_internal';
|
|
13
13
|
import { CloseIcon, DirectionIcon, LoadingIcon } from '../../../icons';
|
|
14
14
|
import { useProviderProps } from '../../../provider';
|
|
@@ -118,65 +118,37 @@ function useComboBoxState({ selectedKey, defaultSelectedKey, inputValue, default
|
|
|
118
118
|
isControlledInput,
|
|
119
119
|
};
|
|
120
120
|
}
|
|
121
|
-
function useComboBoxFiltering({
|
|
121
|
+
function useComboBoxFiltering({ effectiveInputValue, filter, }) {
|
|
122
122
|
const [isFilterActive, setIsFilterActive] = useState(false);
|
|
123
123
|
const { contains } = useFilter({ sensitivity: 'base' });
|
|
124
124
|
const textFilterFn = useMemo(() => (filter === false ? () => true : filter || contains), [filter, contains]);
|
|
125
|
-
//
|
|
126
|
-
const
|
|
125
|
+
// Create a filter function for collection nodes
|
|
126
|
+
const filterFn = useCallback((nodes) => {
|
|
127
127
|
const term = effectiveInputValue.trim();
|
|
128
|
-
if
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
const filterChildren = (childNodes) => {
|
|
140
|
-
if (!childNodes)
|
|
141
|
-
return null;
|
|
142
|
-
const childArray = Array.isArray(childNodes) ? childNodes : [childNodes];
|
|
143
|
-
const filteredNodes = [];
|
|
144
|
-
childArray.forEach((child) => {
|
|
145
|
-
if (!child || typeof child !== 'object') {
|
|
146
|
-
return;
|
|
147
|
-
}
|
|
148
|
-
if (child.type === BaseSection ||
|
|
149
|
-
child.type?.displayName === 'Section') {
|
|
150
|
-
const sectionChildren = Array.isArray(child.props.children)
|
|
151
|
-
? child.props.children
|
|
152
|
-
: [child.props.children];
|
|
153
|
-
const filteredSectionChildren = sectionChildren.filter((sectionChild) => {
|
|
154
|
-
return (sectionChild &&
|
|
155
|
-
typeof sectionChild === 'object' &&
|
|
156
|
-
nodeMatches(sectionChild));
|
|
157
|
-
});
|
|
158
|
-
if (filteredSectionChildren.length > 0) {
|
|
159
|
-
filteredNodes.push(cloneElement(child, {
|
|
160
|
-
key: child.key,
|
|
161
|
-
children: filteredSectionChildren,
|
|
162
|
-
}));
|
|
163
|
-
}
|
|
164
|
-
}
|
|
165
|
-
else if (child.type === Item) {
|
|
166
|
-
if (nodeMatches(child)) {
|
|
167
|
-
filteredNodes.push(child);
|
|
168
|
-
}
|
|
169
|
-
}
|
|
170
|
-
else if (nodeMatches(child)) {
|
|
171
|
-
filteredNodes.push(child);
|
|
128
|
+
// Don't filter if not active or no search term
|
|
129
|
+
if (!isFilterActive || !term) {
|
|
130
|
+
return nodes;
|
|
131
|
+
}
|
|
132
|
+
// Filter nodes based on their textValue and preserve section structure
|
|
133
|
+
return [...nodes]
|
|
134
|
+
.map((node) => {
|
|
135
|
+
if (node.type === 'section' && node.childNodes) {
|
|
136
|
+
const filteredChildren = [...node.childNodes].filter((child) => textFilterFn(child.textValue || '', term));
|
|
137
|
+
if (filteredChildren.length === 0) {
|
|
138
|
+
return null;
|
|
172
139
|
}
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
140
|
+
return {
|
|
141
|
+
...node,
|
|
142
|
+
childNodes: filteredChildren,
|
|
143
|
+
hasChildNodes: true,
|
|
144
|
+
};
|
|
145
|
+
}
|
|
146
|
+
return textFilterFn(node.textValue || '', term) ? node : null;
|
|
147
|
+
})
|
|
148
|
+
.filter(Boolean);
|
|
149
|
+
}, [isFilterActive, effectiveInputValue, textFilterFn]);
|
|
178
150
|
return {
|
|
179
|
-
|
|
151
|
+
filterFn,
|
|
180
152
|
isFilterActive,
|
|
181
153
|
setIsFilterActive,
|
|
182
154
|
};
|
|
@@ -293,6 +265,22 @@ function useComboBoxKeyboard({ isPopoverOpen, listStateRef, hasResults, allowsCu
|
|
|
293
265
|
}
|
|
294
266
|
}
|
|
295
267
|
else if (e.key === 'Enter') {
|
|
268
|
+
// If popover is open, try to select the focused item first
|
|
269
|
+
if (isPopoverOpen) {
|
|
270
|
+
const listState = listStateRef.current;
|
|
271
|
+
if (listState) {
|
|
272
|
+
const keyToSelect = listState.selectionManager.focusedKey;
|
|
273
|
+
if (keyToSelect != null) {
|
|
274
|
+
e.preventDefault();
|
|
275
|
+
listState.selectionManager.select(keyToSelect, e);
|
|
276
|
+
// Ensure the popover closes even if selection stays the same
|
|
277
|
+
onClosePopover();
|
|
278
|
+
inputRef.current?.focus();
|
|
279
|
+
return;
|
|
280
|
+
}
|
|
281
|
+
}
|
|
282
|
+
}
|
|
283
|
+
// If no results, handle empty input or custom values
|
|
296
284
|
if (!hasResults) {
|
|
297
285
|
e.preventDefault();
|
|
298
286
|
if (allowsCustomValue) {
|
|
@@ -304,18 +292,12 @@ function useComboBoxKeyboard({ isPopoverOpen, listStateRef, hasResults, allowsCu
|
|
|
304
292
|
}
|
|
305
293
|
return;
|
|
306
294
|
}
|
|
307
|
-
if (
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
e.preventDefault();
|
|
314
|
-
listState.selectionManager.select(keyToSelect, e);
|
|
315
|
-
// Ensure the popover closes even if selection stays the same
|
|
316
|
-
onClosePopover();
|
|
317
|
-
inputRef.current?.focus();
|
|
318
|
-
}
|
|
295
|
+
// Clear selection if input is empty and popover is closed (or no focused item)
|
|
296
|
+
const trimmed = (effectiveInputValue || '').trim();
|
|
297
|
+
if (trimmed === '') {
|
|
298
|
+
e.preventDefault();
|
|
299
|
+
onSelectionChange(null);
|
|
300
|
+
return;
|
|
319
301
|
}
|
|
320
302
|
}
|
|
321
303
|
else if (e.key === 'Escape') {
|
|
@@ -376,7 +358,7 @@ const ComboBoxInput = forwardRef(function ComboBoxInput({ qa, inputRef, id, valu
|
|
|
376
358
|
? `ListBoxItem-${listStateRef.current?.selectionManager.focusedKey}`
|
|
377
359
|
: undefined }));
|
|
378
360
|
});
|
|
379
|
-
function ComboBoxOverlay({ isOpen, triggerRef, popoverRef, listBoxRef, direction, shouldFlip, overlayOffset, comboBoxWidth, comboBoxId, overlayStyles, listBoxStyles, optionStyles, sectionStyles, headingStyles, effectiveSelectedKey, isDisabled, disabledKeys, items, children, listStateRef, onSelectionChange, onClose, label, ariaLabel, compositeFocusProps, }) {
|
|
361
|
+
function ComboBoxOverlay({ isOpen, triggerRef, popoverRef, listBoxRef, direction, shouldFlip, overlayOffset, comboBoxWidth, comboBoxId, overlayStyles, listBoxStyles, optionStyles, sectionStyles, headingStyles, effectiveSelectedKey, isDisabled, disabledKeys, items, children, listStateRef, onSelectionChange, onClose, label, ariaLabel, compositeFocusProps, filter, }) {
|
|
380
362
|
// Overlay positioning
|
|
381
363
|
const { overlayProps: overlayPositionProps, placement, updatePosition, } = useOverlayPosition({
|
|
382
364
|
targetRef: triggerRef,
|
|
@@ -414,7 +396,7 @@ function ComboBoxOverlay({ isOpen, triggerRef, popoverRef, listBoxRef, direction
|
|
|
414
396
|
}, [isOpen, updatePosition]);
|
|
415
397
|
// Extract primary placement direction for consistent styling
|
|
416
398
|
const placementDirection = placement?.split(' ')[0] || direction;
|
|
417
|
-
const overlayContent = (_jsx(DisplayTransition, {
|
|
399
|
+
const overlayContent = (_jsx(DisplayTransition, { isShown: isOpen, children: ({ phase, isShown, ref: transitionRef }) => (_jsx(ComboBoxOverlayElement, { ...mergeProps(overlayPositionProps, overlayBehaviorProps, compositeFocusProps), ref: (value) => {
|
|
418
400
|
transitionRef(value);
|
|
419
401
|
popoverRef.current = value;
|
|
420
402
|
}, "data-placement": placementDirection, "data-phase": phase, mods: {
|
|
@@ -423,7 +405,7 @@ function ComboBoxOverlay({ isOpen, triggerRef, popoverRef, listBoxRef, direction
|
|
|
423
405
|
}, styles: overlayStyles, style: {
|
|
424
406
|
'--min-width': comboBoxWidth ? `${comboBoxWidth}px` : undefined,
|
|
425
407
|
...overlayPositionProps.style,
|
|
426
|
-
}, children: _jsx(ListBox, { ref: listBoxRef, focusOnHover: true, disableSelectionToggle: true, id: `ComboBoxListBox-${comboBoxId}`, "aria-label": ariaLabel || (typeof label === 'string' ? label : 'Options'), selectedKey: effectiveSelectedKey, selectionMode: "single", isDisabled: isDisabled, disabledKeys: disabledKeys, shouldUseVirtualFocus: true, items: items, styles: listBoxStyles, optionStyles: optionStyles, sectionStyles: sectionStyles, headingStyles: headingStyles, stateRef: listStateRef, mods: {
|
|
408
|
+
}, children: _jsx(ListBox, { ref: listBoxRef, focusOnHover: true, disableSelectionToggle: true, id: `ComboBoxListBox-${comboBoxId}`, "aria-label": ariaLabel || (typeof label === 'string' ? label : 'Options'), selectedKey: effectiveSelectedKey, selectionMode: "single", isDisabled: isDisabled, disabledKeys: disabledKeys, shouldUseVirtualFocus: true, items: items, filter: filter, styles: listBoxStyles, optionStyles: optionStyles, sectionStyles: sectionStyles, headingStyles: headingStyles, stateRef: listStateRef, mods: {
|
|
427
409
|
popover: true,
|
|
428
410
|
}, onSelectionChange: onSelectionChange, children: children }) })) }));
|
|
429
411
|
return _jsx(Portal, { children: overlayContent });
|
|
@@ -553,63 +535,152 @@ export const ComboBox = forwardRef(function ComboBox(props, ref) {
|
|
|
553
535
|
}
|
|
554
536
|
}, [isPopoverOpen, effectiveSelectedKey]);
|
|
555
537
|
// Filtering hook
|
|
556
|
-
const {
|
|
557
|
-
children,
|
|
538
|
+
const { filterFn, isFilterActive, setIsFilterActive } = useComboBoxFiltering({
|
|
558
539
|
effectiveInputValue,
|
|
559
540
|
filter,
|
|
560
541
|
});
|
|
561
|
-
//
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
}, [isPopoverOpen, filteredChildren]);
|
|
569
|
-
// Use frozen children during close animation, fresh children when open
|
|
570
|
-
const displayedFilteredChildren = isPopoverOpen
|
|
571
|
-
? filteredChildren
|
|
572
|
-
: frozenFilteredChildrenRef.current ?? filteredChildren;
|
|
542
|
+
// Create local collection state for reading item data (labels, etc.)
|
|
543
|
+
// This allows us to read item labels even before the popover opens
|
|
544
|
+
const localCollectionState = useListState({
|
|
545
|
+
children,
|
|
546
|
+
items: sortedItems,
|
|
547
|
+
selectionMode: 'none', // Don't manage selection in this state
|
|
548
|
+
});
|
|
573
549
|
const { isFocused, focusProps } = useFocus({ isDisabled });
|
|
550
|
+
// Helper to check if current input value is valid
|
|
551
|
+
const checkInputValidity = useCallback(() => {
|
|
552
|
+
if (!effectiveInputValue.trim()) {
|
|
553
|
+
return { isValid: false, singleMatchKey: null, filteredCount: 0 };
|
|
554
|
+
}
|
|
555
|
+
// Get filtered collection based on current input
|
|
556
|
+
const filteredNodes = filterFn(localCollectionState.collection);
|
|
557
|
+
const filteredItems = [];
|
|
558
|
+
// Flatten filtered nodes (handle sections)
|
|
559
|
+
for (const node of filteredNodes) {
|
|
560
|
+
if (node.type === 'section' && node.childNodes) {
|
|
561
|
+
for (const child of node.childNodes) {
|
|
562
|
+
if (child.type === 'item') {
|
|
563
|
+
filteredItems.push({
|
|
564
|
+
key: child.key,
|
|
565
|
+
textValue: child.textValue || '',
|
|
566
|
+
});
|
|
567
|
+
}
|
|
568
|
+
}
|
|
569
|
+
}
|
|
570
|
+
else if (node.type === 'item') {
|
|
571
|
+
filteredItems.push({
|
|
572
|
+
key: node.key,
|
|
573
|
+
textValue: node.textValue || '',
|
|
574
|
+
});
|
|
575
|
+
}
|
|
576
|
+
}
|
|
577
|
+
const filteredCount = filteredItems.length;
|
|
578
|
+
// Check for exact match
|
|
579
|
+
const exactMatch = filteredItems.find((item) => item.textValue.toLowerCase() ===
|
|
580
|
+
effectiveInputValue.trim().toLowerCase());
|
|
581
|
+
if (exactMatch) {
|
|
582
|
+
return { isValid: true, singleMatchKey: exactMatch.key, filteredCount };
|
|
583
|
+
}
|
|
584
|
+
// If exactly one filtered result, consider it valid
|
|
585
|
+
if (filteredCount === 1) {
|
|
586
|
+
return {
|
|
587
|
+
isValid: true,
|
|
588
|
+
singleMatchKey: filteredItems[0].key,
|
|
589
|
+
filteredCount,
|
|
590
|
+
};
|
|
591
|
+
}
|
|
592
|
+
return { isValid: false, singleMatchKey: null, filteredCount };
|
|
593
|
+
}, [effectiveInputValue, filterFn, localCollectionState.collection]);
|
|
574
594
|
// Composite blur handler - fires when focus leaves the entire component
|
|
575
595
|
const handleCompositeBlur = useEvent(() => {
|
|
576
|
-
//
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
shouldCommitOnBlur &&
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
596
|
+
// NOTE: Do NOT disable filter yet; we need it active for validity check
|
|
597
|
+
// In allowsCustomValue mode
|
|
598
|
+
if (allowsCustomValue) {
|
|
599
|
+
// Commit the input value if it's non-empty and nothing is selected
|
|
600
|
+
if (shouldCommitOnBlur &&
|
|
601
|
+
effectiveInputValue &&
|
|
602
|
+
effectiveSelectedKey == null) {
|
|
603
|
+
externalOnSelectionChange?.(effectiveInputValue);
|
|
604
|
+
if (!isControlledKey) {
|
|
605
|
+
setInternalSelectedKey(effectiveInputValue);
|
|
606
|
+
}
|
|
607
|
+
onBlur?.();
|
|
608
|
+
setIsFilterActive(false);
|
|
609
|
+
return;
|
|
610
|
+
}
|
|
611
|
+
// Clear selection if input is empty
|
|
612
|
+
if (!String(effectiveInputValue).trim()) {
|
|
613
|
+
externalOnSelectionChange?.(null);
|
|
614
|
+
if (!isControlledKey) {
|
|
615
|
+
setInternalSelectedKey(null);
|
|
616
|
+
}
|
|
617
|
+
if (!isControlledInput) {
|
|
618
|
+
setInternalInputValue('');
|
|
619
|
+
}
|
|
620
|
+
onInputChange?.('');
|
|
621
|
+
onBlur?.();
|
|
622
|
+
setIsFilterActive(false);
|
|
623
|
+
return;
|
|
586
624
|
}
|
|
587
|
-
// Call user's onBlur callback
|
|
588
|
-
onBlur?.();
|
|
589
|
-
return;
|
|
590
625
|
}
|
|
591
|
-
// In
|
|
592
|
-
if (
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
626
|
+
// In non-custom-value mode, validate input and handle accordingly
|
|
627
|
+
if (!allowsCustomValue) {
|
|
628
|
+
const { isValid, singleMatchKey } = checkInputValidity();
|
|
629
|
+
// If there's exactly one filtered result, auto-select it
|
|
630
|
+
if (isValid &&
|
|
631
|
+
singleMatchKey != null &&
|
|
632
|
+
singleMatchKey !== effectiveSelectedKey) {
|
|
633
|
+
const label = getItemLabel(singleMatchKey);
|
|
634
|
+
if (!isControlledKey) {
|
|
635
|
+
setInternalSelectedKey(singleMatchKey);
|
|
636
|
+
}
|
|
637
|
+
if (!isControlledInput) {
|
|
638
|
+
setInternalInputValue(label);
|
|
639
|
+
}
|
|
640
|
+
onInputChange?.(label);
|
|
641
|
+
externalOnSelectionChange?.(singleMatchKey);
|
|
642
|
+
onBlur?.();
|
|
643
|
+
setIsFilterActive(false);
|
|
644
|
+
return;
|
|
596
645
|
}
|
|
597
|
-
|
|
598
|
-
|
|
646
|
+
// If input is invalid (no exact match, not a single result)
|
|
647
|
+
if (!isValid) {
|
|
648
|
+
const trimmedInput = effectiveInputValue.trim();
|
|
649
|
+
// Clear if clearOnBlur is set or input is empty
|
|
650
|
+
if (clearOnBlur || !trimmedInput) {
|
|
651
|
+
externalOnSelectionChange?.(null);
|
|
652
|
+
if (!isControlledKey) {
|
|
653
|
+
setInternalSelectedKey(null);
|
|
654
|
+
}
|
|
655
|
+
if (!isControlledInput) {
|
|
656
|
+
setInternalInputValue('');
|
|
657
|
+
}
|
|
658
|
+
onInputChange?.('');
|
|
659
|
+
onBlur?.();
|
|
660
|
+
setIsFilterActive(false);
|
|
661
|
+
return;
|
|
662
|
+
}
|
|
663
|
+
// Reset input to current selected value (or empty if none)
|
|
664
|
+
const nextValue = effectiveSelectedKey != null
|
|
665
|
+
? getItemLabel(effectiveSelectedKey)
|
|
666
|
+
: '';
|
|
667
|
+
if (!isControlledInput) {
|
|
668
|
+
setInternalInputValue(nextValue);
|
|
669
|
+
}
|
|
670
|
+
onInputChange?.(nextValue);
|
|
671
|
+
onBlur?.();
|
|
672
|
+
setIsFilterActive(false);
|
|
673
|
+
return;
|
|
599
674
|
}
|
|
600
|
-
onInputChange?.('');
|
|
601
|
-
// Call user's onBlur callback
|
|
602
|
-
onBlur?.();
|
|
603
|
-
return;
|
|
604
675
|
}
|
|
605
|
-
// Reset input to show current selection (or empty if none)
|
|
676
|
+
// Fallback: Reset input to show current selection (or empty if none)
|
|
606
677
|
const nextValue = effectiveSelectedKey != null ? getItemLabel(effectiveSelectedKey) : '';
|
|
607
678
|
if (!isControlledInput) {
|
|
608
679
|
setInternalInputValue(nextValue);
|
|
609
680
|
}
|
|
610
681
|
onInputChange?.(nextValue);
|
|
611
|
-
// Call user's onBlur callback
|
|
612
682
|
onBlur?.();
|
|
683
|
+
setIsFilterActive(false);
|
|
613
684
|
});
|
|
614
685
|
// Composite focus hook - handles focus tracking across wrapper and portaled popover
|
|
615
686
|
const { compositeFocusProps } = useCompositeFocus({
|
|
@@ -625,11 +696,11 @@ export const ComboBox = forwardRef(function ComboBox(props, ref) {
|
|
|
625
696
|
// Ref to access internal ListBox state
|
|
626
697
|
const listStateRef = useRef(null);
|
|
627
698
|
const focusInitAttemptsRef = useRef(0);
|
|
628
|
-
// Helper to get label from collection
|
|
699
|
+
// Helper to get label from local collection
|
|
629
700
|
const getItemLabel = useCallback((key) => {
|
|
630
|
-
const item =
|
|
701
|
+
const item = localCollectionState?.collection?.getItem(key);
|
|
631
702
|
return item?.textValue || String(key);
|
|
632
|
-
}, []);
|
|
703
|
+
}, [localCollectionState?.collection]);
|
|
633
704
|
// Selection change handler
|
|
634
705
|
const handleSelectionChange = useEvent((selection) => {
|
|
635
706
|
// Extract single key from selection (we only support single selection)
|
|
@@ -700,9 +771,6 @@ export const ComboBox = forwardRef(function ComboBox(props, ref) {
|
|
|
700
771
|
}
|
|
701
772
|
// Priority 2: fall back to defaultSelectedKey's label
|
|
702
773
|
if (defaultSelectedKey) {
|
|
703
|
-
// Wait for collection to be ready
|
|
704
|
-
if (!listStateRef.current?.collection)
|
|
705
|
-
return;
|
|
706
774
|
const label = getItemLabel(defaultSelectedKey);
|
|
707
775
|
setInternalInputValue(label);
|
|
708
776
|
setHasInitialized(true);
|
|
@@ -716,13 +784,17 @@ export const ComboBox = forwardRef(function ComboBox(props, ref) {
|
|
|
716
784
|
children,
|
|
717
785
|
]);
|
|
718
786
|
// Sync input value with controlled selectedKey
|
|
787
|
+
const lastSyncedSelectedKey = useRef(undefined);
|
|
719
788
|
useEffect(() => {
|
|
720
789
|
// Only run when selectedKey is controlled but inputValue is uncontrolled
|
|
721
790
|
if (!isControlledKey || isControlledInput)
|
|
722
791
|
return;
|
|
723
|
-
//
|
|
724
|
-
if (
|
|
792
|
+
// Skip if the key hasn't actually changed (prevents unnecessary resets when collection rebuilds)
|
|
793
|
+
if (lastSyncedSelectedKey.current !== undefined &&
|
|
794
|
+
lastSyncedSelectedKey.current === effectiveSelectedKey) {
|
|
725
795
|
return;
|
|
796
|
+
}
|
|
797
|
+
lastSyncedSelectedKey.current = effectiveSelectedKey;
|
|
726
798
|
// Get the expected label for the current selection
|
|
727
799
|
const expectedLabel = effectiveSelectedKey != null ? getItemLabel(effectiveSelectedKey) : '';
|
|
728
800
|
// Update the input value to match the selected key's label
|
|
@@ -745,10 +817,26 @@ export const ComboBox = forwardRef(function ComboBox(props, ref) {
|
|
|
745
817
|
? effectiveInputValue !== ''
|
|
746
818
|
: effectiveSelectedKey != null;
|
|
747
819
|
let showClearButton = isClearable && hasValue && !isDisabled && !isReadOnly;
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
|
|
751
|
-
|
|
820
|
+
// Check if there are any results after filtering
|
|
821
|
+
const hasResults = useMemo(() => {
|
|
822
|
+
if (!children)
|
|
823
|
+
return false;
|
|
824
|
+
if (!Array.isArray(children) && children === null)
|
|
825
|
+
return false;
|
|
826
|
+
// If we have a collection, check if filtering will produce any results
|
|
827
|
+
if (localCollectionState?.collection) {
|
|
828
|
+
const filteredNodes = filterFn(localCollectionState.collection);
|
|
829
|
+
const resultArray = Array.from(filteredNodes).flatMap((node) => {
|
|
830
|
+
if (node.type === 'section' && node.childNodes) {
|
|
831
|
+
return [...node.childNodes];
|
|
832
|
+
}
|
|
833
|
+
return [node];
|
|
834
|
+
});
|
|
835
|
+
return resultArray.length > 0;
|
|
836
|
+
}
|
|
837
|
+
// Fallback: check if children exists
|
|
838
|
+
return Array.isArray(children) ? children.length > 0 : true;
|
|
839
|
+
}, [children, localCollectionState?.collection, filterFn]);
|
|
752
840
|
// Clear function
|
|
753
841
|
let clearValue = useEvent(() => {
|
|
754
842
|
// Clear input
|
|
@@ -889,7 +977,7 @@ export const ComboBox = forwardRef(function ComboBox(props, ref) {
|
|
|
889
977
|
}
|
|
890
978
|
}
|
|
891
979
|
}
|
|
892
|
-
} })) : null] }), _jsx(ComboBoxOverlay, { isOpen: shouldShowPopover, triggerRef: wrapperRef, popoverRef: popoverRef, listBoxRef: listBoxRef, direction: direction, shouldFlip: shouldFlip, overlayOffset: overlayOffset, comboBoxWidth: comboBoxWidth, comboBoxId: comboBoxId, overlayStyles: overlayStyles, listBoxStyles: listBoxStyles, optionStyles: optionStyles, sectionStyles: sectionStyles, headingStyles: headingStyles, effectiveSelectedKey: effectiveSelectedKey, isDisabled: isDisabled, disabledKeys: props.disabledKeys, items: sortedItems, listStateRef: listStateRef, label: label, ariaLabel: props['aria-label'], compositeFocusProps: compositeFocusProps, onSelectionChange: handleSelectionChange, onClose: () => setIsPopoverOpen(false), children:
|
|
980
|
+
} })) : null] }), _jsx(ComboBoxOverlay, { isOpen: shouldShowPopover, triggerRef: wrapperRef, popoverRef: popoverRef, listBoxRef: listBoxRef, direction: direction, shouldFlip: shouldFlip, overlayOffset: overlayOffset, comboBoxWidth: comboBoxWidth, comboBoxId: comboBoxId, overlayStyles: overlayStyles, listBoxStyles: listBoxStyles, optionStyles: optionStyles, sectionStyles: sectionStyles, headingStyles: headingStyles, effectiveSelectedKey: effectiveSelectedKey, isDisabled: isDisabled, disabledKeys: props.disabledKeys, items: sortedItems, listStateRef: listStateRef, label: label, ariaLabel: props['aria-label'], compositeFocusProps: compositeFocusProps, filter: filterFn, onSelectionChange: handleSelectionChange, onClose: () => setIsPopoverOpen(false), children: children })] }));
|
|
893
981
|
const { children: _, ...propsWithoutChildren } = props;
|
|
894
982
|
const finalProps = {
|
|
895
983
|
...propsWithoutChildren,
|