@cube-dev/ui-kit 0.168.0 → 0.169.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/dist/CHANGELOG.md +36 -0
- package/dist/_internal/hooks/use-chained-callback.js +1 -1
- package/dist/_internal/hooks/use-debounced-value.js +1 -1
- package/dist/_internal/hooks/use-deprecation-warning.js +1 -1
- package/dist/_internal/hooks/use-event.js +1 -1
- package/dist/_internal/hooks/use-is-first-render.js +1 -1
- package/dist/_internal/hooks/use-sync-ref.js +1 -1
- package/dist/_internal/hooks/use-timer/timer.js +1 -1
- package/dist/_internal/hooks/use-timer/use-timer.js +1 -1
- package/dist/_internal/hooks/use-warn.js +1 -1
- package/dist/components/Block.js +1 -1
- package/dist/components/CollectionItem.js +1 -1
- package/dist/components/GlobalStyles.js +1 -1
- package/dist/components/GridProvider.js +1 -1
- package/dist/components/HiddenInput.js +1 -1
- package/dist/components/Root.js +1 -1
- package/dist/components/Root.js.map +1 -1
- package/dist/components/actions/Action/Action.js +1 -1
- package/dist/components/actions/Banner/Banner.js +1 -1
- package/dist/components/actions/Button/Button.d.ts +1 -0
- package/dist/components/actions/Button/Button.js +1 -1
- package/dist/components/actions/Button/Button.js.map +1 -1
- package/dist/components/actions/ButtonGroup/ButtonGroup.js +1 -1
- package/dist/components/actions/ButtonSplit/ButtonSplit.js +2 -2
- package/dist/components/actions/ButtonSplit/context.js +1 -1
- package/dist/components/actions/CommandMenu/CommandMenu.js +1 -1
- package/dist/components/actions/CommandMenu/CommandMenu.js.map +1 -1
- package/dist/components/actions/CommandMenu/styled.js +1 -1
- package/dist/components/actions/ItemAction/ItemAction.js +1 -1
- package/dist/components/actions/ItemActionContext.js +1 -1
- package/dist/components/actions/ItemButton/ItemButton.js +1 -1
- package/dist/components/actions/Link/Link.js +1 -1
- package/dist/components/actions/Menu/Menu.js +1 -1
- package/dist/components/actions/Menu/MenuItem.js +2 -2
- package/dist/components/actions/Menu/MenuItem.js.map +1 -1
- package/dist/components/actions/Menu/MenuSection.js +1 -1
- package/dist/components/actions/Menu/MenuTrigger.js +1 -1
- package/dist/components/actions/Menu/SubMenuTrigger.js +1 -1
- package/dist/components/actions/Menu/SubmenuTriggerContext.js +1 -1
- package/dist/components/actions/Menu/context.js +1 -1
- package/dist/components/actions/Menu/styled.js +1 -1
- package/dist/components/actions/index.js +1 -1
- package/dist/components/actions/use-action.js +1 -1
- package/dist/components/actions/use-anchored-menu.js +1 -1
- package/dist/components/actions/use-context-menu.js +1 -1
- package/dist/components/content/ActiveZone/ActiveZone.js +1 -1
- package/dist/components/content/Alert/Alert.js +1 -1
- package/dist/components/content/Alert/use-alert.js +1 -1
- package/dist/components/content/Avatar/Avatar.js +1 -1
- package/dist/components/content/Badge/Badge.js +1 -1
- package/dist/components/content/Card/Card.js +1 -1
- package/dist/components/content/Content.js +1 -1
- package/dist/components/content/CopyPasteBlock/CopyPasteBlock.js +1 -1
- package/dist/components/content/CopyPasteBlock/CopyPasteBlock.js.map +1 -1
- package/dist/components/content/CopySnippet/CopySnippet.js +1 -1
- package/dist/components/content/CopySnippet/CopySnippet.js.map +1 -1
- package/dist/components/content/Disclosure/Disclosure.js +1 -1
- package/dist/components/content/Disclosure/Disclosure.js.map +1 -1
- package/dist/components/content/Divider.js +1 -1
- package/dist/components/content/Footer.js +1 -1
- package/dist/components/content/Header.js +1 -1
- package/dist/components/content/HotKeys/HotKeys.js +1 -1
- package/dist/components/content/InfoBadge/InfoBadge.js +1 -1
- package/dist/components/content/InfoBadge/InfoBadge.js.map +1 -1
- package/dist/components/content/InlineInput/InlineInput.d.ts +5 -0
- package/dist/components/content/InlineInput/InlineInput.js +3 -2
- package/dist/components/content/InlineInput/InlineInput.js.map +1 -1
- package/dist/components/content/Item/Item.js +1 -1
- package/dist/components/content/Item/Item.js.map +1 -1
- package/dist/components/content/ItemBadge/ItemBadge.js +1 -1
- package/dist/components/content/ItemCard/ItemCard.js +1 -1
- package/dist/components/content/Layout/GridLayout.js +1 -1
- package/dist/components/content/Layout/Layout.js +1 -1
- package/dist/components/content/Layout/LayoutBlock.js +1 -1
- package/dist/components/content/Layout/LayoutCenter.js +1 -1
- package/dist/components/content/Layout/LayoutContainer.js +1 -1
- package/dist/components/content/Layout/LayoutContent.js +1 -1
- package/dist/components/content/Layout/LayoutContext.js +1 -1
- package/dist/components/content/Layout/LayoutFlex.js +1 -1
- package/dist/components/content/Layout/LayoutFooter.js +1 -1
- package/dist/components/content/Layout/LayoutGrid.js +1 -1
- package/dist/components/content/Layout/LayoutHeader.js +2 -2
- package/dist/components/content/Layout/LayoutPane.js +1 -1
- package/dist/components/content/Layout/LayoutPanel.js +1 -1
- package/dist/components/content/Layout/LayoutPanelHeader.js +2 -2
- package/dist/components/content/Layout/LayoutToolbar.js +1 -1
- package/dist/components/content/Layout/hooks/useTinyScrollbar.js +1 -1
- package/dist/components/content/Layout/index.js +1 -1
- package/dist/components/content/Layout/utils.js +1 -1
- package/dist/components/content/Paragraph.js +1 -1
- package/dist/components/content/Placeholder/Placeholder.js +1 -1
- package/dist/components/content/PrismCode/PrismCode.js +1 -1
- package/dist/components/content/PrismCode/prismSetup.js +1 -1
- package/dist/components/content/PrismDiffCode/PrismDiffCode.js +1 -1
- package/dist/components/content/Result/Result.js +1 -1
- package/dist/components/content/Skeleton/Skeleton.js +1 -1
- package/dist/components/content/Tag/Tag.js +1 -1
- package/dist/components/content/Tag/Tag.js.map +1 -1
- package/dist/components/content/Text.d.ts +1351 -1351
- package/dist/components/content/Text.js +1 -1
- package/dist/components/content/TextItem/TextItem.js +1 -1
- package/dist/components/content/Title.js +1 -1
- package/dist/components/content/Tree/Tree.js +1 -1
- package/dist/components/content/Tree/TreeNode.js +2 -2
- package/dist/components/content/Tree/TreeNode.js.map +1 -1
- package/dist/components/content/Tree/styled.js +1 -1
- package/dist/components/content/Tree/tree-index.js +1 -1
- package/dist/components/content/Tree/use-checkbox-tree.js +1 -1
- package/dist/components/content/Tree/use-load-data.js +1 -1
- package/dist/components/content/highlightText.js +1 -1
- package/dist/components/content/use-auto-tooltip.js +1 -1
- package/dist/components/data/DataTable/DataTable.js +1 -1
- package/dist/components/data/ItemTable/ItemTable.js +1 -1
- package/dist/components/data/ItemTable/ItemTableBulkBar.js +2 -2
- package/dist/components/data/ItemTable/ItemTableBulkBar.js.map +1 -1
- package/dist/components/data/ItemTable/ItemTableDragPreview.js +1 -1
- package/dist/components/data/ItemTable/ItemTableFooter.js +1 -1
- package/dist/components/data/ItemTable/ItemTableToolbar.js +2 -2
- package/dist/components/data/ItemTable/ItemTableToolbar.js.map +1 -1
- package/dist/components/data/TableBase/ColumnResizer.js +1 -1
- package/dist/components/data/TableBase/RowCollection.js +1 -1
- package/dist/components/data/TableBase/TableHeaderCell.js +1 -1
- package/dist/components/data/TableBase/TableRow.js +1 -1
- package/dist/components/data/TableBase/TableView.js +4 -4
- package/dist/components/data/TableBase/TableView.js.map +1 -1
- package/dist/components/data/TableBase/column-menu.js +1 -1
- package/dist/components/data/TableBase/column-tint.js +1 -1
- package/dist/components/data/TableBase/row-menu.js +1 -1
- package/dist/components/data/TableBase/styled.d.ts +2 -1
- package/dist/components/data/TableBase/styled.js +1 -1
- package/dist/components/data/TableBase/table-tree.js +1 -1
- package/dist/components/data/TableBase/types.js +1 -1
- package/dist/components/data/TableBase/use-cell-selection.d.ts +1 -0
- package/dist/components/data/TableBase/use-cell-selection.js +0 -0
- package/dist/components/data/TableBase/use-column-order.js +1 -1
- package/dist/components/data/TableBase/use-container-width.js +1 -1
- package/dist/components/data/TableBase/use-row-move-animation.js +1 -1
- package/dist/components/data/TableBase/use-scrollability.js +1 -1
- package/dist/components/data/TableBase/use-table-columns.js +1 -1
- package/dist/components/data/TableBase/use-table-search.js +1 -1
- package/dist/components/data/TableBase/use-table-selection.js +1 -1
- package/dist/components/data/TableBase/use-table-sort.js +1 -1
- package/dist/components/data/TableBase/use-table-sorts.js +1 -1
- package/dist/components/data/TableBase/use-table-storage.js +1 -1
- package/dist/components/data/TableBase/use-table-tree-state.js +1 -1
- package/dist/components/fields/Checkbox/Checkbox.js +2 -2
- package/dist/components/fields/Checkbox/Checkbox.js.map +1 -1
- package/dist/components/fields/Checkbox/CheckboxGroup.js +2 -2
- package/dist/components/fields/Checkbox/context.js +1 -1
- package/dist/components/fields/ColorInput/ColorInput.js +4 -4
- package/dist/components/fields/ColorInput/ColorInput.js.map +1 -1
- package/dist/components/fields/ColorPicker/ColorPicker.js +2 -2
- package/dist/components/fields/ColorSwatch/ColorSwatch.js +1 -1
- package/dist/components/fields/ColorSwatchGroup/ColorSwatchGroup.js +1 -1
- package/dist/components/fields/ComboBox/ComboBox.js +5 -3
- package/dist/components/fields/ComboBox/ComboBox.js.map +1 -1
- package/dist/components/fields/CommandTextArea/CommandTextArea.js +2 -2
- package/dist/components/fields/CommandTextArea/caretPosition.js +1 -1
- package/dist/components/fields/CommandTextArea/useCaretAnchor.js +1 -1
- package/dist/components/fields/DatePicker/DateInput.js +1 -1
- package/dist/components/fields/DatePicker/DateInputBase.js +1 -1
- package/dist/components/fields/DatePicker/DatePicker.js +2 -2
- package/dist/components/fields/DatePicker/DatePickerButton.js +1 -1
- package/dist/components/fields/DatePicker/DatePickerButton.js.map +1 -1
- package/dist/components/fields/DatePicker/DatePickerElement.js +1 -1
- package/dist/components/fields/DatePicker/DatePickerInput.js +1 -1
- package/dist/components/fields/DatePicker/DatePickerSegment.js +1 -1
- package/dist/components/fields/DatePicker/DateRangePicker.js +2 -2
- package/dist/components/fields/DatePicker/DateRangeSeparatedPicker.js +2 -2
- package/dist/components/fields/DatePicker/MonthPicker.js +1 -1
- package/dist/components/fields/DatePicker/PeriodPicker.js +2 -2
- package/dist/components/fields/DatePicker/QuarterPicker.js +1 -1
- package/dist/components/fields/DatePicker/TimeInput.js +1 -1
- package/dist/components/fields/DatePicker/WeekPicker.js +1 -1
- package/dist/components/fields/DatePicker/YearPicker.js +1 -1
- package/dist/components/fields/DatePicker/parseDate.js +1 -1
- package/dist/components/fields/DatePicker/period.js +1 -1
- package/dist/components/fields/DatePicker/props.js +1 -1
- package/dist/components/fields/DatePicker/utils.js +1 -1
- package/dist/components/fields/FileInput/FileInput.js +1 -1
- package/dist/components/fields/FilterListBox/FilterListBox.js +1 -1
- package/dist/components/fields/FilterListBox/FilterListBox.js.map +1 -1
- package/dist/components/fields/FilterPicker/FilterPicker.js +3 -3
- package/dist/components/fields/FilterPicker/FilterPicker.js.map +1 -1
- package/dist/components/fields/Input/Input.js +1 -1
- package/dist/components/fields/ListBox/DraggableListBox.js +1 -1
- package/dist/components/fields/ListBox/ListBox.js +2 -2
- package/dist/components/fields/ListBox/ListBox.js.map +1 -1
- package/dist/components/fields/ListBoxPopover/ListBoxPopover.js +1 -1
- package/dist/components/fields/ListBoxPopover/index.d.ts +1 -0
- package/dist/components/fields/ListBoxPopover/listNavigation.js +1 -1
- package/dist/components/fields/ListBoxPopover/useCompositeFocus.d.ts +2 -0
- package/dist/components/fields/ListBoxPopover/useCompositeFocus.js +1 -1
- package/dist/components/fields/NumberInput/NumberInput.js +2 -2
- package/dist/components/fields/NumberInput/StepButton.js +1 -1
- package/dist/components/fields/NumberInput/StepButton.js.map +1 -1
- package/dist/components/fields/PasswordInput/PasswordInput.js +2 -2
- package/dist/components/fields/PasswordInput/PasswordInput.js.map +1 -1
- package/dist/components/fields/Picker/Picker.js +3 -3
- package/dist/components/fields/Picker/Picker.js.map +1 -1
- package/dist/components/fields/RadioGroup/Radio.js +1 -1
- package/dist/components/fields/RadioGroup/RadioGroup.js +2 -2
- package/dist/components/fields/RadioGroup/context.js +1 -1
- package/dist/components/fields/SearchComboBox/SearchComboBox.js +3 -3
- package/dist/components/fields/SearchComboBox/SearchComboBox.js.map +1 -1
- package/dist/components/fields/SearchInput/SearchInput.js +3 -3
- package/dist/components/fields/SearchInput/SearchInput.js.map +1 -1
- package/dist/components/fields/Select/Select.js +2 -2
- package/dist/components/fields/Select/Select.js.map +1 -1
- package/dist/components/fields/Slider/Gradation.js +1 -1
- package/dist/components/fields/Slider/HueSlider.js +1 -1
- package/dist/components/fields/Slider/RangeSlider.js +1 -1
- package/dist/components/fields/Slider/Slider.js +1 -1
- package/dist/components/fields/Slider/SliderBase.js +1 -1
- package/dist/components/fields/Slider/SliderThumb.js +1 -1
- package/dist/components/fields/Slider/SliderTrack.js +1 -1
- package/dist/components/fields/Slider/elements.js +1 -1
- package/dist/components/fields/Slider/index.js +1 -1
- package/dist/components/fields/Switch/Switch.js +2 -2
- package/dist/components/fields/Switch/Switch.js.map +1 -1
- package/dist/components/fields/TextArea/TextArea.js +2 -2
- package/dist/components/fields/TextInput/TextInput.js +2 -2
- package/dist/components/fields/TextInput/TextInputBase.d.ts +9 -0
- package/dist/components/fields/TextInput/TextInputBase.js +4 -3
- package/dist/components/fields/TextInput/TextInputBase.js.map +1 -1
- package/dist/components/fields/TextInput/useAutoSizeTextArea.js +1 -1
- package/dist/components/fields/TextInputMapper/TextInputMapper.d.ts +5 -0
- package/dist/components/fields/TextInputMapper/TextInputMapper.js +3 -3
- package/dist/components/fields/TextInputMapper/TextInputMapper.js.map +1 -1
- package/dist/components/fields/color/ColorPanel.js +1 -1
- package/dist/components/fields/color/channels.js +1 -1
- package/dist/components/fields/color/color.js +1 -1
- package/dist/components/fields/color/context.js +1 -1
- package/dist/components/form/FieldWrapper/FieldWrapper.js +6 -3
- package/dist/components/form/FieldWrapper/FieldWrapper.js.map +1 -1
- package/dist/components/form/Form/Field.js +1 -1
- package/dist/components/form/Form/Form.js +1 -1
- package/dist/components/form/Form/ResetButton/ResetButton.js +1 -1
- package/dist/components/form/Form/SubmitButton/SubmitButton.js +1 -1
- package/dist/components/form/Form/SubmitError.js +1 -1
- package/dist/components/form/Form/index.js +1 -1
- package/dist/components/form/Form/use-field/use-field-props.js +1 -1
- package/dist/components/form/Form/use-field/use-field.js +1 -1
- package/dist/components/form/Form/use-form.js +1 -1
- package/dist/components/form/Form/validation.js +1 -1
- package/dist/components/form/Label.d.ts +28 -1
- package/dist/components/form/Label.js +35 -16
- package/dist/components/form/Label.js.map +1 -1
- package/dist/components/form/index.d.ts +1 -1
- package/dist/components/form/validation/ValidationIndicator.js +1 -1
- package/dist/components/form/validation/ValidationIndicator.js.map +1 -1
- package/dist/components/form/validation/resolve-validation-props.js +1 -1
- package/dist/components/form/validation/use-validation-props.js +1 -1
- package/dist/components/form/wrapper.js +1 -1
- package/dist/components/helpers/DisplayTransition/DisplayTransition.js +1 -1
- package/dist/components/helpers/IconSwitch/IconSwitch.js +1 -1
- package/dist/components/layout/Board/Board.js +1 -1
- package/dist/components/layout/Board/Board.js.map +1 -1
- package/dist/components/layout/Board/BoardProvider.js +1 -1
- package/dist/components/layout/Board/BoardResponsive.js +1 -1
- package/dist/components/layout/Board/Widget.js +1 -1
- package/dist/components/layout/Board/WidgetHost.js +1 -1
- package/dist/components/layout/Board/board-context.js +1 -1
- package/dist/components/layout/Board/board-store.js +1 -1
- package/dist/components/layout/Board/grid-core/calculate.js +1 -1
- package/dist/components/layout/Board/grid-core/collision-modes.js +1 -1
- package/dist/components/layout/Board/grid-core/collision.js +1 -1
- package/dist/components/layout/Board/grid-core/compactors.js +1 -1
- package/dist/components/layout/Board/grid-core/constraints.js +1 -1
- package/dist/components/layout/Board/grid-core/group-move.js +1 -1
- package/dist/components/layout/Board/grid-core/layout.js +1 -1
- package/dist/components/layout/Board/grid-core/placement.js +1 -1
- package/dist/components/layout/Board/grid-core/sort.js +1 -1
- package/dist/components/layout/Board/index.js +1 -1
- package/dist/components/layout/Board/responsive-utils.js +1 -1
- package/dist/components/layout/Board/use-board-layout.js +1 -1
- package/dist/components/layout/Board/use-board-registry.js +1 -1
- package/dist/components/layout/Board/use-board-select-modifier-key.js +1 -1
- package/dist/components/layout/Board/use-board-selection.js +1 -1
- package/dist/components/layout/Flex.js +1 -1
- package/dist/components/layout/Flow.js +1 -1
- package/dist/components/layout/Grid.js +1 -1
- package/dist/components/layout/Panel.js +1 -1
- package/dist/components/layout/Prefix.js +1 -1
- package/dist/components/layout/ResizablePanel.js +1 -1
- package/dist/components/layout/Space.js +1 -1
- package/dist/components/layout/Suffix.js +1 -1
- package/dist/components/navigation/Pagination/Pagination.js +4 -4
- package/dist/components/navigation/Pagination/Pagination.js.map +1 -1
- package/dist/components/navigation/Pagination/use-pagination.js +1 -1
- package/dist/components/navigation/Tabs/DraggableTabList.js +1 -1
- package/dist/components/navigation/Tabs/TabButton.js +3 -3
- package/dist/components/navigation/Tabs/TabButton.js.map +1 -1
- package/dist/components/navigation/Tabs/TabDropIndicator.js +1 -1
- package/dist/components/navigation/Tabs/TabPanel.js +1 -1
- package/dist/components/navigation/Tabs/TabPicker.js +1 -1
- package/dist/components/navigation/Tabs/TabPicker.js.map +1 -1
- package/dist/components/navigation/Tabs/Tabs.js +1 -1
- package/dist/components/navigation/Tabs/Tabs.js.map +1 -1
- package/dist/components/navigation/Tabs/TabsAction.js +1 -1
- package/dist/components/navigation/Tabs/TabsContext.js +1 -1
- package/dist/components/navigation/Tabs/popover-placement.js +1 -1
- package/dist/components/navigation/Tabs/styled.js +1 -1
- package/dist/components/navigation/Tabs/types.js +1 -1
- package/dist/components/navigation/Tabs/use-tab-editing.js +1 -1
- package/dist/components/navigation/Tabs/use-tab-indicator.js +1 -1
- package/dist/components/organisms/StatsCard/StatsCard.js +1 -1
- package/dist/components/other/Calendar/Calendar.js +1 -1
- package/dist/components/other/Calendar/CalendarCell.js +1 -1
- package/dist/components/other/Calendar/CalendarGrid.js +1 -1
- package/dist/components/other/Calendar/CalendarHeader.js +2 -2
- package/dist/components/other/Calendar/CalendarHeader.js.map +1 -1
- package/dist/components/other/Calendar/CalendarPanel.js +1 -1
- package/dist/components/other/Calendar/PeriodCalendar.js +1 -1
- package/dist/components/other/Calendar/PeriodGrid.js +1 -1
- package/dist/components/other/Calendar/RangeCalendar.js +1 -1
- package/dist/components/other/Calendar/styled.js +1 -1
- package/dist/components/other/CubeLogo/CubeLogo.js +1 -1
- package/dist/components/other/NoDataIcon/NoDataIcon.js +1 -1
- package/dist/components/overlays/AlertDialog/AlertDialog.d.ts +0 -1
- package/dist/components/overlays/AlertDialog/AlertDialog.js +2 -2
- package/dist/components/overlays/AlertDialog/AlertDialog.js.map +1 -1
- package/dist/components/overlays/AlertDialog/AlertDialogApiProvider.js +1 -1
- package/dist/components/overlays/AlertDialog/AlertDialogZone.js +1 -1
- package/dist/components/overlays/AlertDialog/AlertDialogZone.js.map +1 -1
- package/dist/components/overlays/Dialog/Dialog.js +2 -2
- package/dist/components/overlays/Dialog/Dialog.js.map +1 -1
- package/dist/components/overlays/Dialog/DialogContainer.js +1 -1
- package/dist/components/overlays/Dialog/DialogForm.js +2 -2
- package/dist/components/overlays/Dialog/DialogTrigger.js +3 -2
- package/dist/components/overlays/Dialog/DialogTrigger.js.map +1 -1
- package/dist/components/overlays/Dialog/context.js +1 -1
- package/dist/components/overlays/Dialog/use-dialog-container.js +1 -1
- package/dist/components/overlays/Modal/Modal.d.ts +2 -1
- package/dist/components/overlays/Modal/Modal.js +1 -1
- package/dist/components/overlays/Modal/OpenTransitionContext.js +1 -1
- package/dist/components/overlays/Modal/Overlay.d.ts +1 -0
- package/dist/components/overlays/Modal/Overlay.js +1 -1
- package/dist/components/overlays/Modal/Popover.js +1 -1
- package/dist/components/overlays/Modal/Tray.js +1 -1
- package/dist/components/overlays/Modal/Underlay.js +1 -1
- package/dist/components/overlays/Modal/types.d.ts +1 -0
- package/dist/components/overlays/Notifications/Notification.js +1 -1
- package/dist/components/overlays/Notifications/NotificationAction.js +1 -1
- package/dist/components/overlays/Notifications/NotificationCard.js +1 -1
- package/dist/components/overlays/Notifications/NotificationContext.d.ts +2 -0
- package/dist/components/overlays/Notifications/NotificationContext.js +1 -1
- package/dist/components/overlays/Notifications/NotificationItem.js +1 -1
- package/dist/components/overlays/Notifications/OverlayContainer.js +1 -1
- package/dist/components/overlays/Notifications/OverlayProvider.js +1 -1
- package/dist/components/overlays/Notifications/PersistentNotificationsList.js +1 -1
- package/dist/components/overlays/Notifications/dismissed-storage.js +1 -1
- package/dist/components/overlays/Notifications/format-relative-time.js +1 -1
- package/dist/components/overlays/Notifications/index.js +1 -1
- package/dist/components/overlays/Notifications/use-notification-state.js +1 -1
- package/dist/components/overlays/Notifications/use-notifications.js +1 -1
- package/dist/components/overlays/Notifications/use-overlay-timers.js +1 -1
- package/dist/components/overlays/Notifications/use-persistent-notifications.js +1 -1
- package/dist/components/overlays/Notifications/use-persistent-state.js +1 -1
- package/dist/components/overlays/Notifications/use-toast-state.js +1 -1
- package/dist/components/overlays/Toast/ToastItem.js +1 -1
- package/dist/components/overlays/Toast/index.js +1 -1
- package/dist/components/overlays/Toast/useProgressToast.js +1 -1
- package/dist/components/overlays/Toast/useToast.js +3 -3
- package/dist/components/overlays/Toast/useToast.js.map +1 -1
- package/dist/components/overlays/Tooltip/Tooltip.js +1 -1
- package/dist/components/overlays/Tooltip/TooltipProvider.js +1 -1
- package/dist/components/overlays/Tooltip/TooltipTrigger.js +1 -1
- package/dist/components/overlays/Tooltip/context.js +1 -1
- package/dist/components/portal/Portal.js +1 -1
- package/dist/components/portal/PortalProvider.d.ts +2 -0
- package/dist/components/portal/PortalProvider.js +1 -1
- package/dist/components/portal/index.d.ts +1 -0
- package/dist/components/portal/usePortal.js +1 -1
- package/dist/components/shared/DraggableCollection.js +1 -1
- package/dist/components/shared/InvalidIcon.js +1 -1
- package/dist/components/shared/InvalidIcon.js.map +1 -1
- package/dist/components/shared/ValidIcon.js +1 -1
- package/dist/components/shared/ValidIcon.js.map +1 -1
- package/dist/components/status/LoadingAnimation/LoadingAnimation.js +1 -1
- package/dist/components/status/Spin/Cube.js +1 -1
- package/dist/components/status/Spin/InternalSpinner.js +1 -1
- package/dist/components/status/Spin/Spin.js +1 -1
- package/dist/components/status/Spin/SpinsContainer.js +1 -1
- package/dist/data/item-themes.js +1 -1
- package/dist/data/themes.js +1 -1
- package/dist/eslint-plugin/defaults.generated.js +5 -1
- package/dist/eslint-plugin/defaults.generated.js.map +1 -1
- package/dist/eslint-plugin/index.js +1 -1
- package/dist/eslint-plugin/rules/no-redundant-default-prop.js +1 -1
- package/dist/i18n/I18nProvider.js +1 -1
- package/dist/i18n/createFormatter.js +1 -1
- package/dist/i18n/index.js +1 -1
- package/dist/i18n/instance.js +1 -1
- package/dist/i18n/locales/de-DE/uikit.js +1 -1
- package/dist/i18n/locales/en-US/uikit.js +1 -1
- package/dist/i18n/locales/es-ES/uikit.js +1 -1
- package/dist/i18n/locales/es-MX/uikit.js +1 -1
- package/dist/i18n/locales/fr-FR/uikit.js +1 -1
- package/dist/i18n/locales/it-IT/uikit.js +1 -1
- package/dist/i18n/locales/ja-JP/uikit.js +1 -1
- package/dist/i18n/locales/nb-NO/uikit.js +1 -1
- package/dist/i18n/locales/pt-BR/uikit.js +1 -1
- package/dist/i18n/locales/pt-PT/uikit.js +1 -1
- package/dist/i18n/locales/sv-SE/uikit.js +1 -1
- package/dist/i18n/locales/vi-VN/uikit.js +1 -1
- package/dist/i18n/locales.js +1 -1
- package/dist/i18n/useFormatter.js +1 -1
- package/dist/i18n/useI18n.js +1 -1
- package/dist/icons/AdjustmentsHorizontalIcon.js +1 -1
- package/dist/icons/AdjustmentsIcon.js +1 -1
- package/dist/icons/AiIcon.js +1 -1
- package/dist/icons/AreaChartIcon.js +1 -1
- package/dist/icons/ArrowNarrowDownIcon.js +1 -1
- package/dist/icons/ArrowNarrowUpIcon.js +1 -1
- package/dist/icons/BackwardIcon.js +1 -1
- package/dist/icons/BarChartIcon.js +1 -1
- package/dist/icons/BellFilledIcon.js +1 -1
- package/dist/icons/BellIcon.js +1 -1
- package/dist/icons/BooleanIcon.js +1 -1
- package/dist/icons/CalendarEditIcon.js +1 -1
- package/dist/icons/CalendarIcon.js +1 -1
- package/dist/icons/CaretDownIcon.js +1 -1
- package/dist/icons/CaretUpIcon.js +1 -1
- package/dist/icons/ChartAreaStackedIcon.js +1 -1
- package/dist/icons/ChartAreaStackedPercentageIcon.js +1 -1
- package/dist/icons/ChartBarGroupedHorizontalIcon.js +1 -1
- package/dist/icons/ChartBarGroupedIcon.js +1 -1
- package/dist/icons/ChartBarHorizontalIcon.js +1 -1
- package/dist/icons/ChartBarLineIcon.js +1 -1
- package/dist/icons/ChartBarStackedHorizontalIcon.js +1 -1
- package/dist/icons/ChartBarStackedIcon.js +1 -1
- package/dist/icons/ChartBarStackedPercentageHorizontalIcon.js +1 -1
- package/dist/icons/ChartBarStackedPercentageIcon.js +1 -1
- package/dist/icons/ChartBoxPlot2Icon.js +1 -1
- package/dist/icons/ChartBoxPlotIcon.js +1 -1
- package/dist/icons/ChartBubbleIcon.js +1 -1
- package/dist/icons/ChartDonut2Icon.js +1 -1
- package/dist/icons/ChartFunnelIcon.js +1 -1
- package/dist/icons/ChartHeatmapIcon.js +1 -1
- package/dist/icons/ChartKPIIcon.js +1 -1
- package/dist/icons/ChartPie2Icon.js +1 -1
- package/dist/icons/ChartScatterIcon.js +1 -1
- package/dist/icons/CheckCircleFilledIcon.js +1 -1
- package/dist/icons/CheckCircleIcon.js +1 -1
- package/dist/icons/CheckIcon.js +1 -1
- package/dist/icons/CircleFilledIcon.js +1 -1
- package/dist/icons/ClearIcon.js +1 -1
- package/dist/icons/CloseCircleFilledIcon.js +1 -1
- package/dist/icons/CloseCircleIcon.js +1 -1
- package/dist/icons/CloseIcon.js +1 -1
- package/dist/icons/CodeIcon.js +1 -1
- package/dist/icons/ColumnTotalIcon.js +1 -1
- package/dist/icons/CopyIcon.js +1 -1
- package/dist/icons/CountIcon.js +1 -1
- package/dist/icons/CubeIcon.js +1 -1
- package/dist/icons/CubePauseIcon.js +1 -1
- package/dist/icons/CubePlayIcon.js +1 -1
- package/dist/icons/CurrencyDollarIcon.js +1 -1
- package/dist/icons/DangerIcon.js +1 -1
- package/dist/icons/DashboardIcon.js +1 -1
- package/dist/icons/DatabaseIcon.js +1 -1
- package/dist/icons/DecimalDecreaseIcon.js +1 -1
- package/dist/icons/DecimalIncreaseIcon.js +1 -1
- package/dist/icons/DirectionIcon.js +1 -1
- package/dist/icons/DonutIcon.js +1 -1
- package/dist/icons/DownIcon.js +1 -1
- package/dist/icons/EditIcon.js +1 -1
- package/dist/icons/ExclamationCircleFilledIcon.js +1 -1
- package/dist/icons/ExclamationCircleIcon.js +1 -1
- package/dist/icons/ExclamationIcon.js +1 -1
- package/dist/icons/EyeIcon.js +1 -1
- package/dist/icons/EyeInvisibleIcon.js +1 -1
- package/dist/icons/FilterIcon.js +1 -1
- package/dist/icons/FolderFilledIcon.js +1 -1
- package/dist/icons/FolderIcon.js +1 -1
- package/dist/icons/FolderOpenFilledIcon.js +1 -1
- package/dist/icons/FolderOpenIcon.js +1 -1
- package/dist/icons/ForwardIcon.js +1 -1
- package/dist/icons/GripVerticalIcon.js +1 -1
- package/dist/icons/HierarchyIcon.js +1 -1
- package/dist/icons/HierarchyOpenIcon.js +1 -1
- package/dist/icons/Icon.js +1 -1
- package/dist/icons/InfoCircleIcon.js +1 -1
- package/dist/icons/InfoIcon.js +1 -1
- package/dist/icons/KeyIcon.js +1 -1
- package/dist/icons/LeftIcon.js +1 -1
- package/dist/icons/LineChartIcon.js +1 -1
- package/dist/icons/LoadingIcon.js +1 -1
- package/dist/icons/LockFilledIcon.js +1 -1
- package/dist/icons/LockIcon.js +1 -1
- package/dist/icons/MoreIcon.js +1 -1
- package/dist/icons/NotAllowedIcon.js +1 -1
- package/dist/icons/Number123Icon.js +1 -1
- package/dist/icons/NumberIcon.js +1 -1
- package/dist/icons/PauseCircleFilledIcon.js +1 -1
- package/dist/icons/PauseCircleIcon.js +1 -1
- package/dist/icons/PauseIcon.js +1 -1
- package/dist/icons/PercentageIcon.js +1 -1
- package/dist/icons/PieChartIcon.js +1 -1
- package/dist/icons/PipetteIcon.js +1 -1
- package/dist/icons/PlayCircleIcon.js +1 -1
- package/dist/icons/PlayIcon.js +1 -1
- package/dist/icons/PlusIcon.js +1 -1
- package/dist/icons/ProgressBarIcon.js +1 -1
- package/dist/icons/ReloadIcon.js +1 -1
- package/dist/icons/ReportIcon.js +1 -1
- package/dist/icons/ReturnIcon.js +1 -1
- package/dist/icons/RightIcon.js +1 -1
- package/dist/icons/RowTotalsIcon.js +1 -1
- package/dist/icons/SchemeIcon.js +1 -1
- package/dist/icons/SearchIcon.js +1 -1
- package/dist/icons/SemanticQueryIcon.js +1 -1
- package/dist/icons/SettingsIcon.js +1 -1
- package/dist/icons/ShieldFilledIcon.js +1 -1
- package/dist/icons/ShieldIcon.js +1 -1
- package/dist/icons/SlashIcon.js +1 -1
- package/dist/icons/SparklesIcon.js +1 -1
- package/dist/icons/SqlIcon.js +1 -1
- package/dist/icons/StatsIcon.js +1 -1
- package/dist/icons/StopIcon.js +1 -1
- package/dist/icons/StringIcon.js +1 -1
- package/dist/icons/SubtotalsIcon.js +1 -1
- package/dist/icons/SwitchIcon.js +1 -1
- package/dist/icons/TableIcon.js +1 -1
- package/dist/icons/ThumbsDownIcon.js +1 -1
- package/dist/icons/ThumbsUpIcon.js +1 -1
- package/dist/icons/ThunderboltCrossedIcon.js +1 -1
- package/dist/icons/ThunderboltFilledIcon.js +1 -1
- package/dist/icons/ThunderboltIcon.js +1 -1
- package/dist/icons/TimeIcon.js +1 -1
- package/dist/icons/TrashIcon.js +1 -1
- package/dist/icons/UnlockIcon.js +1 -1
- package/dist/icons/UpIcon.js +1 -1
- package/dist/icons/UserGroupIcon.js +1 -1
- package/dist/icons/UserIcon.js +1 -1
- package/dist/icons/UserLockIcon.js +1 -1
- package/dist/icons/ViewIcon.js +1 -1
- package/dist/icons/WarningFilledIcon.js +1 -1
- package/dist/icons/WarningIcon.js +1 -1
- package/dist/icons/wrap-icon.js +1 -1
- package/dist/index.d.ts +2 -2
- package/dist/index.js +147 -147
- package/dist/probe/canonicalize.js +1 -1
- package/dist/probe/css.js +1 -1
- package/dist/probe/index.js +1 -1
- package/dist/provider.js +1 -1
- package/dist/providers/TrackingProvider.js +1 -1
- package/dist/providers/navigationAdapter.default.js +1 -1
- package/dist/tokens/all-tokens.js +1 -1
- package/dist/tokens/base.js +1 -1
- package/dist/tokens/color-seed.js +1 -1
- package/dist/tokens/color-theme.js +1 -1
- package/dist/tokens/colors.js +1 -1
- package/dist/tokens/layout.js +1 -1
- package/dist/tokens/lazy-styles.js +1 -1
- package/dist/tokens/palette-config.js +1 -1
- package/dist/tokens/palette.js +1 -1
- package/dist/tokens/resolve.js +1 -1
- package/dist/tokens/shadows.js +1 -1
- package/dist/tokens/sizes.js +1 -1
- package/dist/tokens/spacing.js +1 -1
- package/dist/tokens/typography.js +1 -1
- package/dist/utils/ResizeSensor.js +1 -1
- package/dist/utils/is-dev-env.js +1 -1
- package/dist/utils/modules.js +1 -1
- package/dist/utils/promise.js +1 -1
- package/dist/utils/raf.js +1 -1
- package/dist/utils/random.js +1 -1
- package/dist/utils/range.js +1 -1
- package/dist/utils/react/RenderCache.js +1 -1
- package/dist/utils/react/Slots.js +1 -1
- package/dist/utils/react/chain.js +1 -1
- package/dist/utils/react/disabledProps.js +1 -1
- package/dist/utils/react/forwardRefWithGenerics.js +1 -1
- package/dist/utils/react/index.js +1 -1
- package/dist/utils/react/interactions.js +1 -1
- package/dist/utils/react/isTextOnly.js +1 -1
- package/dist/utils/react/mapProps.js +1 -1
- package/dist/utils/react/mergeProps.js +1 -1
- package/dist/utils/react/nullableValue.js +1 -1
- package/dist/utils/react/resolveIcon.js +1 -1
- package/dist/utils/react/sharedStore.js +1 -1
- package/dist/utils/react/useBufferedValue.js +1 -1
- package/dist/utils/react/useCombinedRefs.js +1 -1
- package/dist/utils/react/useControlledFocusVisible.js +1 -1
- package/dist/utils/react/useEventBus.js +1 -1
- package/dist/utils/react/useId.js +1 -1
- package/dist/utils/react/useIsDarwin.js +1 -1
- package/dist/utils/react/useKeySymbols.js +1 -1
- package/dist/utils/react/useLayoutEffect.js +1 -1
- package/dist/utils/react/useLocalStorage.js +1 -1
- package/dist/utils/react/useMergeStyles.js +1 -1
- package/dist/utils/react/usePopoverSync.js +1 -1
- package/dist/utils/react/useQaProps.js +1 -1
- package/dist/utils/react/useViewportSize.js +1 -1
- package/dist/utils/react/wrapNodeIfPlain.js +1 -1
- package/dist/utils/selection.js +1 -1
- package/dist/utils/styles.js +1 -1
- package/dist/utils/tree.js +1 -1
- package/dist/utils/warnings.js +1 -1
- package/dist/version.js +2 -2
- package/docs/BaseProperties.md +1 -0
- package/docs/components/Block.md +2 -2
- package/docs/components/CollectionItem.md +2 -2
- package/docs/components/GridProvider.md +2 -2
- package/docs/components/actions/Action.md +2 -2
- package/docs/components/actions/Banner.md +2 -2
- package/docs/components/actions/Button.md +2 -2
- package/docs/components/actions/ButtonGroup.md +2 -2
- package/docs/components/actions/ButtonSplit.md +2 -2
- package/docs/components/actions/CommandMenu.md +2 -2
- package/docs/components/actions/Link.md +2 -2
- package/docs/components/actions/Menu.md +2 -2
- package/docs/components/actions/use-anchored-menu.md +2 -2
- package/docs/components/actions/use-context-menu.md +2 -2
- package/docs/components/content/ActiveZone.md +2 -2
- package/docs/components/content/Alert.md +15 -4
- package/docs/components/content/Avatar.md +2 -2
- package/docs/components/content/Card.md +2 -2
- package/docs/components/content/Content.md +2 -2
- package/docs/components/content/CopyPasteBlock.md +1 -1
- package/docs/components/content/CopySnippet.md +2 -2
- package/docs/components/content/Disclosure.md +1 -1
- package/docs/components/content/Divider.md +2 -2
- package/docs/components/content/Footer.md +2 -2
- package/docs/components/content/Header.md +2 -2
- package/docs/components/content/HotKeys.md +2 -2
- package/docs/components/content/InlineInput.md +1 -0
- package/docs/components/content/Item.md +8 -1
- package/docs/components/content/Layout.md +1 -1
- package/docs/components/content/Paragraph.md +2 -2
- package/docs/components/content/Placeholder.md +2 -2
- package/docs/components/content/Result.md +2 -2
- package/docs/components/content/Skeleton.md +2 -2
- package/docs/components/content/Title.md +2 -2
- package/docs/components/data/DataTable.md +4 -6
- package/docs/components/data/ItemTable.md +4 -6
- package/docs/components/fields/Checkbox.md +2 -2
- package/docs/components/fields/ComboBox.md +1 -1
- package/docs/components/fields/DatePicker.md +2 -2
- package/docs/components/fields/FileInput.md +2 -2
- package/docs/components/fields/FilterListBox.md +1 -1
- package/docs/components/fields/FilterPicker.md +1 -1
- package/docs/components/fields/HueSlider.md +1 -1
- package/docs/components/fields/ListBox.md +1 -1
- package/docs/components/fields/NumberInput.md +2 -2
- package/docs/components/fields/PasswordInput.md +2 -2
- package/docs/components/fields/Picker.md +1 -1
- package/docs/components/fields/RadioGroup.md +2 -2
- package/docs/components/fields/SearchInput.md +2 -2
- package/docs/components/fields/Select.md +1 -1
- package/docs/components/fields/Slider.md +1 -1
- package/docs/components/fields/Switch.md +1 -1
- package/docs/components/fields/TextArea.md +2 -2
- package/docs/components/fields/TextInput.md +2 -2
- package/docs/components/fields/TextInputMapper.md +2 -2
- package/docs/components/form/Field.md +2 -2
- package/docs/components/form/Form.md +2 -2
- package/docs/components/layout/Board.md +12 -2
- package/docs/components/layout/Flex.md +2 -2
- package/docs/components/layout/Flow.md +2 -2
- package/docs/components/layout/Grid.md +2 -2
- package/docs/components/layout/Panel.md +2 -2
- package/docs/components/layout/Prefix.md +2 -2
- package/docs/components/layout/ResizablePanel.md +2 -2
- package/docs/components/layout/Space.md +2 -2
- package/docs/components/layout/Suffix.md +2 -2
- package/docs/components/organisms/StatsCard.md +2 -2
- package/docs/components/overlays/AlertDialog.md +2 -2
- package/docs/components/overlays/Dialog.md +1 -1
- package/docs/components/overlays/DialogContainer.md +1 -1
- package/docs/components/overlays/DialogForm.md +1 -1
- package/docs/components/overlays/DialogTrigger.md +1 -1
- package/docs/components/overlays/Tooltip.md +2 -2
- package/docs/components/overlays/TooltipProvider.md +2 -2
- package/docs/components/overlays/TooltipTrigger.md +2 -2
- package/docs/components/status/LoadingAnimation.md +2 -2
- package/docs/components/status/Spin.md +2 -2
- package/package.json +4 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
//#region src/components/navigation/Tabs/popover-placement.ts
|
|
3
3
|
/**
|
|
4
4
|
* Maps the parent Tabs `placement` to the popover placement for menus and
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { _Text } from "../../content/Text.js";
|
|
3
3
|
import { _Title } from "../../content/Title.js";
|
|
4
4
|
import { Card } from "../../content/Card/Card.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { useProviderProps } from "../../../provider.js";
|
|
3
3
|
import { CalendarPanel } from "./CalendarPanel.js";
|
|
4
4
|
import { forwardRef, useImperativeHandle, useRef } from "react";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { getWeekNumber } from "../../fields/DatePicker/period.js";
|
|
3
3
|
import { CalendarCell } from "./CalendarCell.js";
|
|
4
4
|
import { tasty } from "@tenphi/tasty";
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { _Title } from "../../content/Title.js";
|
|
3
3
|
import { Space } from "../../layout/Space.js";
|
|
4
|
-
import { LeftIcon } from "../../../icons/LeftIcon.js";
|
|
5
4
|
import { RightIcon } from "../../../icons/RightIcon.js";
|
|
6
5
|
import { Button } from "../../actions/index.js";
|
|
6
|
+
import { LeftIcon } from "../../../icons/LeftIcon.js";
|
|
7
7
|
import { CalendarHeaderElement } from "./styled.js";
|
|
8
8
|
import { tasty } from "@tenphi/tasty";
|
|
9
9
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarHeader.js","names":["Title"],"sources":["../../../../src/components/other/Calendar/CalendarHeader.tsx"],"sourcesContent":["import { tasty } from '@tenphi/tasty';\nimport { ReactNode } from 'react';\n\nimport { LeftIcon
|
|
1
|
+
{"version":3,"file":"CalendarHeader.js","names":["Title"],"sources":["../../../../src/components/other/Calendar/CalendarHeader.tsx"],"sourcesContent":["import { tasty } from '@tenphi/tasty';\nimport { ReactNode } from 'react';\n\nimport { LeftIcon } from '../../../icons/LeftIcon';\nimport { RightIcon } from '../../../icons/RightIcon';\nimport { Button } from '../../actions';\nimport { Title } from '../../content/Title';\nimport { Space } from '../../layout/Space';\n\nimport { CalendarHeaderElement } from './styled';\n\nimport type { Props } from '../../../props';\n\n/**\n * A heading that holds the view switcher. Its own preset matches the type scale\n * of an `xsmall` button so the plain-title fallback (a decade range, or a\n * calendar with navigation turned off) doesn't outweigh the interactive one.\n */\nconst CalendarTitleElement = tasty(Title, {\n level: 6,\n preset: 't4',\n styles: {\n display: 'flex',\n placeItems: 'center',\n gap: '.25x',\n // Line the plain title up with the label inside a button.\n padding: {\n '': '0 (1x - 1bw)',\n interactive: 0,\n },\n },\n});\n\nconst CalendarTitleButton = tasty(Button, {\n 'data-popover-keep': true,\n type: 'clear',\n size: 'xsmall',\n});\n\nexport interface CubeCalendarHeaderSegment {\n key: string;\n label: string;\n onPress: () => void;\n isDisabled?: boolean;\n}\n\nexport interface CubeCalendarHeaderProps {\n /**\n * Interactive title segments (month / year). When omitted the header falls\n * back to a plain `title` — e.g. for a multi-month range.\n */\n segments?: CubeCalendarHeaderSegment[];\n title?: ReactNode;\n prevButtonProps?: Props;\n nextButtonProps?: Props;\n}\n\nexport function CalendarHeader(props: CubeCalendarHeaderProps) {\n let { segments, title, prevButtonProps, nextButtonProps } = props;\n\n return (\n <CalendarHeaderElement>\n <CalendarTitleElement mods={{ interactive: !!segments?.length }}>\n {segments?.length\n ? segments.map(({ key, label, onPress, isDisabled }) => (\n <CalendarTitleButton\n key={key}\n isDisabled={isDisabled}\n onPress={onPress}\n >\n {label}\n </CalendarTitleButton>\n ))\n : title}\n </CalendarTitleElement>\n <Space gap=\".5x\">\n <Button\n data-popover-keep\n size=\"xsmall\"\n {...prevButtonProps}\n icon={<LeftIcon />}\n />\n <Button\n data-popover-keep\n size=\"xsmall\"\n {...nextButtonProps}\n icon={<RightIcon />}\n />\n </Space>\n </CalendarHeaderElement>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAkBA,MAAM,uBAAuB,MAAMA,QAAO;CACxC,OAAO;CACP,QAAQ;CACR,QAAQ;EACN,SAAS;EACT,YAAY;EACZ,KAAK;EAEL,SAAS;GACP,IAAI;GACJ,aAAa;GACd;EACF;CACF,CAAC;AAEF,MAAM,sBAAsB,MAAM,QAAQ;CACxC,qBAAqB;CACrB,MAAM;CACN,MAAM;CACP,CAAC;AAoBF,SAAgB,eAAe,OAAgC;CAC7D,IAAI,EAAE,UAAU,OAAO,iBAAiB,oBAAoB;AAE5D,QACE,qBAAC,oCACC,oBAAC;EAAqB,MAAM,EAAE,aAAa,CAAC,CAAC,UAAU,QAAQ;YAC5D,UAAU,SACP,SAAS,KAAK,EAAE,KAAK,OAAO,SAAS,iBACnC,oBAAC;GAEa;GACH;aAER;KAJI,IAKe,CACtB,GACF;GACiB,EACvB,qBAAC;EAAM,KAAI;aACT,oBAAC;GACC;GACA,MAAK;GACL,GAAI;GACJ,MAAM,oBAAC,aAAW;IAClB,EACF,oBAAC;GACC;GACA,MAAK;GACL,GAAI;GACJ,MAAM,oBAAC,cAAY;IACnB;GACI,IACc"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
|
|
3
3
|
import { useI18n } from "../../../i18n/useI18n.js";
|
|
4
4
|
import { CalendarElement } from "./styled.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { useProviderProps } from "../../../provider.js";
|
|
3
3
|
import { useI18n } from "../../../i18n/useI18n.js";
|
|
4
4
|
import { getQuarter } from "../../fields/DatePicker/period.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { CALENDAR_CELL_STYLES } from "./styled.js";
|
|
3
3
|
import { tasty } from "@tenphi/tasty";
|
|
4
4
|
import { useLayoutEffect, useRef } from "react";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { useProviderProps } from "../../../provider.js";
|
|
3
3
|
import { CalendarPanel } from "./CalendarPanel.js";
|
|
4
4
|
import { forwardRef, useImperativeHandle, useRef } from "react";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { chain } from "../../../utils/react/chain.js";
|
|
3
3
|
import { Paragraph } from "../../content/Paragraph.js";
|
|
4
4
|
import { _Title } from "../../content/Title.js";
|
|
@@ -7,9 +7,9 @@ import { Button } from "../../actions/Button/Button.js";
|
|
|
7
7
|
import { ButtonGroup } from "../../actions/ButtonGroup/ButtonGroup.js";
|
|
8
8
|
import { useDialogContext } from "../Dialog/context.js";
|
|
9
9
|
import { Content } from "../../content/Content.js";
|
|
10
|
+
import { Footer } from "../../content/Footer.js";
|
|
10
11
|
import { Header } from "../../content/Header.js";
|
|
11
12
|
import { Dialog } from "../Dialog/Dialog.js";
|
|
12
|
-
import { Footer } from "../../content/Footer.js";
|
|
13
13
|
import { forwardRef } from "react";
|
|
14
14
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
15
15
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AlertDialog.js","names":["Title"],"sources":["../../../../src/components/overlays/AlertDialog/AlertDialog.tsx"],"sourcesContent":["import { forwardRef, ReactNode } from 'react';\n\nimport { useI18n } from '../../../i18n';\nimport { chain } from '../../../utils/react';\nimport { Button } from '../../actions/Button/Button';\nimport { ButtonGroup } from '../../actions/ButtonGroup/ButtonGroup';\nimport { Content } from '../../content/Content';\nimport { Footer } from '../../content/Footer';\nimport { Header } from '../../content/Header';\nimport { Paragraph } from '../../content/Paragraph';\nimport { Title } from '../../content/Title';\nimport {
|
|
1
|
+
{"version":3,"file":"AlertDialog.js","names":["Title"],"sources":["../../../../src/components/overlays/AlertDialog/AlertDialog.tsx"],"sourcesContent":["import { forwardRef, ReactNode } from 'react';\n\nimport { useI18n } from '../../../i18n';\nimport { chain } from '../../../utils/react';\nimport { Button } from '../../actions/Button/Button';\nimport { ButtonGroup } from '../../actions/ButtonGroup/ButtonGroup';\nimport { Content } from '../../content/Content';\nimport { Footer } from '../../content/Footer';\nimport { Header } from '../../content/Header';\nimport { Paragraph } from '../../content/Paragraph';\nimport { Title } from '../../content/Title';\nimport { useDialogContext } from '../Dialog/context';\nimport { CubeDialogProps, Dialog } from '../Dialog/Dialog';\n\nimport type { CubeButtonProps } from '../../actions/Button/Button';\n\nexport interface CubeAlertDialogActionsProps {\n confirm?: CubeButtonProps | boolean;\n secondary?: CubeButtonProps;\n cancel?: CubeButtonProps | boolean;\n}\n\nexport interface CubeAlertDialogProps\n extends Omit<CubeDialogProps, 'children'> {\n content?: ReactNode;\n /** Whether the dialog is an important prompt */\n danger?: boolean;\n actions?: CubeAlertDialogActionsProps;\n title?: string;\n noActions?: boolean;\n}\n\n/**\n * AlertDialogs are a specific type of Dialog. They display important information that users need to acknowledge.\n */\nfunction AlertDialog(props: CubeAlertDialogProps, ref) {\n const { onClose } = useDialogContext();\n const { t } = useI18n();\n\n const DEFAULT_CONFIRM_PROPS: CubeButtonProps = {\n label: t('alertDialog.confirm', 'Ok'),\n type: 'primary',\n };\n const DEFAULT_CANCEL_PROPS: CubeButtonProps = {\n label: t('alertDialog.cancel', 'Cancel'),\n };\n\n const { danger, actions, title, styles, noActions, content, ...otherProps } =\n props;\n\n let {\n confirm: confirmProps,\n secondary: secondaryProps,\n cancel: cancelProps,\n } = actions ?? {};\n\n // the confirm button is present by default\n confirmProps =\n confirmProps !== false\n ? {\n ...DEFAULT_CONFIRM_PROPS,\n ...(typeof confirmProps === 'object' ? confirmProps : null),\n }\n : undefined;\n\n // the cancel button is hidden by default\n cancelProps = cancelProps\n ? {\n ...DEFAULT_CANCEL_PROPS,\n ...(typeof cancelProps === 'object' ? cancelProps : null),\n }\n : undefined;\n\n return (\n <Dialog ref={ref} role=\"alertdialog\" isDismissable={false} {...otherProps}>\n {title ? (\n <Header>\n <Title>{title}</Title>\n </Header>\n ) : null}\n {content ? (\n <Content>\n {typeof content === 'string' ? (\n <Paragraph>{content}</Paragraph>\n ) : (\n content\n )}\n </Content>\n ) : null}\n {!noActions && (confirmProps || secondaryProps || cancelProps) ? (\n <Footer>\n <ButtonGroup>\n {confirmProps && (\n <Button\n autoFocus\n theme={danger ? 'danger' : undefined}\n {...confirmProps}\n onPress={(e) =>\n chain(\n (confirmProps as CubeButtonProps)?.onPress?.(e),\n onClose?.('confirm'),\n )\n }\n />\n )}\n {secondaryProps && (\n <Button\n {...secondaryProps}\n onPress={(e) =>\n chain(secondaryProps?.onPress?.(e), onClose?.('secondary'))\n }\n />\n )}\n {cancelProps && (\n <Button\n {...cancelProps}\n onPress={(e) =>\n chain(\n (cancelProps as CubeButtonProps)?.onPress?.(e),\n onClose?.('cancel'),\n )\n }\n />\n )}\n </ButtonGroup>\n </Footer>\n ) : null}\n </Dialog>\n );\n}\n\n/**\n * AlertDialogs are a specific type of Dialog. They display important information that users need to acknowledge.\n */\nconst _AlertDialog = forwardRef(AlertDialog);\n\n_AlertDialog.displayName = 'AlertDialog';\n\nexport { _AlertDialog as AlertDialog };\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAmCA,SAAS,YAAY,OAA6B,KAAK;CACrD,MAAM,EAAE,YAAY,kBAAkB;CACtC,MAAM,EAAE,MAAM,SAAS;CAEvB,MAAM,wBAAyC;EAC7C,OAAO,EAAE,uBAAuB,KAAK;EACrC,MAAM;EACP;CACD,MAAM,uBAAwC,EAC5C,OAAO,EAAE,sBAAsB,SAAS,EACzC;CAED,MAAM,EAAE,QAAQ,SAAS,OAAO,QAAQ,WAAW,SAAS,GAAG,eAC7D;CAEF,IAAI,EACF,SAAS,cACT,WAAW,gBACX,QAAQ,gBACN,WAAW,EAAE;AAGjB,gBACE,iBAAiB,QACb;EACE,GAAG;EACH,GAAI,OAAO,iBAAiB,WAAW,eAAe;EACvD,GACD;AAGN,eAAc,cACV;EACE,GAAG;EACH,GAAI,OAAO,gBAAgB,WAAW,cAAc;EACrD,GACD;AAEJ,QACE,qBAAC;EAAY;EAAK,MAAK;EAAc,eAAe;EAAO,GAAI;;GAC5D,QACC,oBAAC,oBACC,oBAACA,oBAAO,QAAc,GACf,GACP;GACH,UACC,oBAAC,qBACE,OAAO,YAAY,WAClB,oBAAC,uBAAW,UAAoB,GAEhC,UAEM,GACR;GACH,CAAC,cAAc,gBAAgB,kBAAkB,eAChD,oBAAC,oBACC,qBAAC;IACE,gBACC,oBAAC;KACC;KACA,OAAO,SAAS,WAAW;KAC3B,GAAI;KACJ,UAAU,MACR,MACG,cAAkC,UAAU,EAAE,EAC/C,UAAU,UAAU,CACrB;MAEH;IAEH,kBACC,oBAAC;KACC,GAAI;KACJ,UAAU,MACR,MAAM,gBAAgB,UAAU,EAAE,EAAE,UAAU,YAAY,CAAC;MAE7D;IAEH,eACC,oBAAC;KACC,GAAI;KACJ,UAAU,MACR,MACG,aAAiC,UAAU,EAAE,EAC9C,UAAU,SAAS,CACpB;MAEH;OAEQ,GACP,GACP;;GACG;;;;;AAOb,MAAM,eAAe,WAAW,YAAY;AAE5C,aAAa,cAAc"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { AlertDialogZone } from "./AlertDialogZone.js";
|
|
3
3
|
import { createContext, useContext, useMemo, useRef, useState } from "react";
|
|
4
4
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { Portal } from "../../portal/Portal.js";
|
|
3
3
|
import { DialogContainer } from "../Dialog/DialogContainer.js";
|
|
4
4
|
import { _AlertDialog } from "./AlertDialog.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AlertDialogZone.js","names":["AlertDialog"],"sources":["../../../../src/components/overlays/AlertDialog/AlertDialogZone.tsx"],"sourcesContent":["import { Portal } from '../../portal';\nimport { DialogContainer } from '../Dialog';\n\nimport { AlertDialog, CubeAlertDialogActionsProps } from './AlertDialog';\nimport { AlertDialogResolveStatus, Dialog } from './types';\n\nimport type { CubeButtonProps } from '../../actions/Button/Button';\n\nexport interface DialogZoneProps {\n openedDialog: Dialog | null;\n}\n\nconst PORTAL_KEY = 'AlertDialogZone';\n\n/**\n * @internal Do not use it\n */\nexport function AlertDialogZone(props: DialogZoneProps) {\n const { openedDialog } = props;\n\n if (openedDialog === null) return <Portal key={PORTAL_KEY} />;\n\n const {\n type,\n isDismissable = true,\n actions,\n onDismiss,\n content,\n ...options\n } = openedDialog.props;\n const { resolve, reject, isVisible, dialogType } = openedDialog.meta;\n\n const _actions: CubeAlertDialogActionsProps = (() => {\n const mergeActionProps = <\n T extends\n | CubeAlertDialogActionsProps['confirm']\n | CubeAlertDialogActionsProps['secondary'],\n >(\n action: T,\n status: AlertDialogResolveStatus,\n ): T => {\n if (typeof action === 'undefined') {\n return undefined as unknown as T;\n }\n\n if (typeof action === 'boolean') {\n return (action\n ? { onPress: () => resolve(status) }\n : false) as unknown as T;\n }\n\n const onPress = action.onPress;\n\n return {\n ...(action as CubeButtonProps),\n onPress: (e) => {\n onPress?.(e);\n resolve(status);\n },\n } as unknown as T;\n };\n\n if (typeof actions === 'undefined') return {};\n\n return {\n confirm: mergeActionProps(actions.confirm, 'confirm'),\n secondary: mergeActionProps(actions.secondary, 'secondary'),\n cancel:\n typeof actions.cancel === 'undefined'\n ? undefined\n : typeof actions.cancel === 'boolean'\n ? actions.cancel\n ? { onPress: () => reject(undefined) }\n : false\n : {\n ...(actions.cancel as CubeButtonProps),\n onPress: (e) => {\n (actions.cancel as CubeButtonProps).onPress?.(e);\n reject(undefined);\n },\n },\n };\n })();\n\n return (\n <Portal key={PORTAL_KEY}>\n <DialogContainer\n isOpen={isVisible}\n isDismissable={isDismissable}\n type={type}\n onDismiss={onDismiss}\n >\n <AlertDialog\n noActions={dialogType === 'form'}\n actions={_actions}\n isHidden={!isVisible}\n content={\n typeof content === 'function'\n ? content({ resolve, reject })\n : content\n }\n {...options}\n />\n </DialogContainer>\n </Portal>\n );\n}\n"],"mappings":";;;;;;;AAYA,MAAM,aAAa;;;;AAKnB,SAAgB,gBAAgB,OAAwB;CACtD,MAAM,EAAE,iBAAiB;AAEzB,KAAI,iBAAiB,KAAM,QAAO,oBAAC,YAAY,WAAc;CAE7D,MAAM,EACJ,MACA,gBAAgB,MAChB,SACA,WACA,SACA,GAAG,YACD,aAAa;CACjB,MAAM,EAAE,SAAS,QAAQ,WAAW,eAAe,aAAa;CAEhE,MAAM,kBAA+C;EACnD,MAAM,oBAKJ,QACA,WACM;AACN,OAAI,OAAO,WAAW,YACpB;AAGF,OAAI,OAAO,WAAW,UACpB,QAAQ,SACJ,EAAE,eAAe,QAAQ,OAAO,EAAE,GAClC;GAGN,MAAM,UAAU,OAAO;AAEvB,UAAO;IACL,GAAI;IACJ,UAAU,MAAM;AACd,eAAU,EAAE;AACZ,aAAQ,OAAO;;IAElB;;AAGH,MAAI,OAAO,YAAY,YAAa,QAAO,EAAE;AAE7C,SAAO;GACL,SAAS,iBAAiB,QAAQ,SAAS,UAAU;GACrD,WAAW,iBAAiB,QAAQ,WAAW,YAAY;GAC3D,QACE,OAAO,QAAQ,WAAW,cACtB,SACA,OAAO,QAAQ,WAAW,YACxB,QAAQ,SACN,EAAE,eAAe,OAAO,OAAU,EAAE,GACpC,QACF;IACE,GAAI,QAAQ;IACZ,UAAU,MAAM;AACd,KAAC,QAAQ,OAA2B,UAAU,EAAE;AAChD,YAAO,OAAU;;IAEpB;GACV;KACC;AAEJ,QACE,oBAAC,oBACC,oBAAC;EACC,QAAQ;EACO;EACT;EACK;YAEX,oBAACA;GACC,WAAW,eAAe;GAC1B,SAAS;GACT,UAAU,CAAC;GACX,SACE,OAAO,YAAY,aACf,QAAQ;IAAE;IAAS;IAAQ,CAAC,GAC5B;GAEN,GAAI;IACJ;GACc,IAlBP,WAmBJ"}
|
|
1
|
+
{"version":3,"file":"AlertDialogZone.js","names":["AlertDialog"],"sources":["../../../../src/components/overlays/AlertDialog/AlertDialogZone.tsx"],"sourcesContent":["import { Portal } from '../../portal';\nimport { DialogContainer } from '../Dialog/DialogContainer';\n\nimport { AlertDialog, CubeAlertDialogActionsProps } from './AlertDialog';\nimport { AlertDialogResolveStatus, Dialog } from './types';\n\nimport type { CubeButtonProps } from '../../actions/Button/Button';\n\nexport interface DialogZoneProps {\n openedDialog: Dialog | null;\n}\n\nconst PORTAL_KEY = 'AlertDialogZone';\n\n/**\n * @internal Do not use it\n */\nexport function AlertDialogZone(props: DialogZoneProps) {\n const { openedDialog } = props;\n\n if (openedDialog === null) return <Portal key={PORTAL_KEY} />;\n\n const {\n type,\n isDismissable = true,\n actions,\n onDismiss,\n content,\n ...options\n } = openedDialog.props;\n const { resolve, reject, isVisible, dialogType } = openedDialog.meta;\n\n const _actions: CubeAlertDialogActionsProps = (() => {\n const mergeActionProps = <\n T extends\n | CubeAlertDialogActionsProps['confirm']\n | CubeAlertDialogActionsProps['secondary'],\n >(\n action: T,\n status: AlertDialogResolveStatus,\n ): T => {\n if (typeof action === 'undefined') {\n return undefined as unknown as T;\n }\n\n if (typeof action === 'boolean') {\n return (action\n ? { onPress: () => resolve(status) }\n : false) as unknown as T;\n }\n\n const onPress = action.onPress;\n\n return {\n ...(action as CubeButtonProps),\n onPress: (e) => {\n onPress?.(e);\n resolve(status);\n },\n } as unknown as T;\n };\n\n if (typeof actions === 'undefined') return {};\n\n return {\n confirm: mergeActionProps(actions.confirm, 'confirm'),\n secondary: mergeActionProps(actions.secondary, 'secondary'),\n cancel:\n typeof actions.cancel === 'undefined'\n ? undefined\n : typeof actions.cancel === 'boolean'\n ? actions.cancel\n ? { onPress: () => reject(undefined) }\n : false\n : {\n ...(actions.cancel as CubeButtonProps),\n onPress: (e) => {\n (actions.cancel as CubeButtonProps).onPress?.(e);\n reject(undefined);\n },\n },\n };\n })();\n\n return (\n <Portal key={PORTAL_KEY}>\n <DialogContainer\n isOpen={isVisible}\n isDismissable={isDismissable}\n type={type}\n onDismiss={onDismiss}\n >\n <AlertDialog\n noActions={dialogType === 'form'}\n actions={_actions}\n isHidden={!isVisible}\n content={\n typeof content === 'function'\n ? content({ resolve, reject })\n : content\n }\n {...options}\n />\n </DialogContainer>\n </Portal>\n );\n}\n"],"mappings":";;;;;;;AAYA,MAAM,aAAa;;;;AAKnB,SAAgB,gBAAgB,OAAwB;CACtD,MAAM,EAAE,iBAAiB;AAEzB,KAAI,iBAAiB,KAAM,QAAO,oBAAC,YAAY,WAAc;CAE7D,MAAM,EACJ,MACA,gBAAgB,MAChB,SACA,WACA,SACA,GAAG,YACD,aAAa;CACjB,MAAM,EAAE,SAAS,QAAQ,WAAW,eAAe,aAAa;CAEhE,MAAM,kBAA+C;EACnD,MAAM,oBAKJ,QACA,WACM;AACN,OAAI,OAAO,WAAW,YACpB;AAGF,OAAI,OAAO,WAAW,UACpB,QAAQ,SACJ,EAAE,eAAe,QAAQ,OAAO,EAAE,GAClC;GAGN,MAAM,UAAU,OAAO;AAEvB,UAAO;IACL,GAAI;IACJ,UAAU,MAAM;AACd,eAAU,EAAE;AACZ,aAAQ,OAAO;;IAElB;;AAGH,MAAI,OAAO,YAAY,YAAa,QAAO,EAAE;AAE7C,SAAO;GACL,SAAS,iBAAiB,QAAQ,SAAS,UAAU;GACrD,WAAW,iBAAiB,QAAQ,WAAW,YAAY;GAC3D,QACE,OAAO,QAAQ,WAAW,cACtB,SACA,OAAO,QAAQ,WAAW,YACxB,QAAQ,SACN,EAAE,eAAe,OAAO,OAAU,EAAE,GACpC,QACF;IACE,GAAI,QAAQ;IACZ,UAAU,MAAM;AACd,KAAC,QAAQ,OAA2B,UAAU,EAAE;AAChD,YAAO,OAAU;;IAEpB;GACV;KACC;AAEJ,QACE,oBAAC,oBACC,oBAAC;EACC,QAAQ;EACO;EACT;EACK;YAEX,oBAACA;GACC,WAAW,eAAe;GAC1B,SAAS;GACT,UAAU,CAAC;GACX,SACE,OAAO,YAAY,aACf,QAAQ;IAAE;IAAS;IAAQ,CAAC,GAC5B;GAEN,GAAI;IACJ;GACc,IAlBP,WAmBJ"}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { extractStyles } from "../../../utils/styles.js";
|
|
3
3
|
import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
|
|
4
4
|
import { SlotProvider } from "../../../utils/react/Slots.js";
|
|
5
5
|
import { useI18n } from "../../../i18n/useI18n.js";
|
|
6
|
-
import { CloseIcon } from "../../../icons/CloseIcon.js";
|
|
7
6
|
import { useOpenTransitionContext } from "../Modal/OpenTransitionContext.js";
|
|
8
7
|
import { _ItemButton } from "../../actions/ItemButton/ItemButton.js";
|
|
9
8
|
import { useDialogContext } from "./context.js";
|
|
9
|
+
import { CloseIcon } from "../../../icons/CloseIcon.js";
|
|
10
10
|
import { BASE_STYLES, BLOCK_STYLES, DIMENSION_STYLES, FLOW_STYLES, tasty } from "@tenphi/tasty";
|
|
11
11
|
import { forwardRef, useEffect, useMemo } from "react";
|
|
12
12
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.js","names":["ItemButton","mergeProps"],"sources":["../../../../src/components/overlays/Dialog/Dialog.tsx"],"sourcesContent":["import { createFocusManager } from '@react-aria/focus';\nimport { useObjectRef } from '@react-aria/utils';\nimport {\n BASE_STYLES,\n BaseProps,\n BaseStyleProps,\n BLOCK_STYLES,\n BlockStyleProps,\n DIMENSION_STYLES,\n DimensionStyleProps,\n FLOW_STYLES,\n Styles,\n tasty,\n} from '@tenphi/tasty';\nimport { forwardRef, ReactElement, Ref, useEffect, useMemo } from 'react';\nimport {\n AriaDialogProps,\n DismissButton,\n FocusScope,\n useDialog,\n} from 'react-aria';\n\nimport { useI18n } from '../../../i18n';\nimport { CloseIcon } from '../../../icons';\nimport { mergeProps, SlotProvider } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { ItemButton } from '../../actions';\nimport { useOpenTransitionContext } from '../Modal/OpenTransitionContext';\n\nimport { useDialogContext } from './context';\n\nconst STYLES_LIST = [\n ...BASE_STYLES,\n ...DIMENSION_STYLES,\n ...BLOCK_STYLES,\n ...FLOW_STYLES,\n];\n\nconst DialogElement = tasty({\n as: 'section',\n styles: {\n display: 'flex',\n flow: 'column',\n fill: '#surface',\n pointerEvents: 'auto',\n outline: 0,\n position: {\n '': 'relative',\n 'type=panel': 'absolute',\n },\n width: {\n '': '$min-dialog-size $dialog-size (100dvw - 8x)',\n 'type=fullscreen': '(100dvw - 8x) (100dvw - 8x)',\n 'type=fullscreenTakeover': '100dvw 100dvw',\n 'type=panel': 'auto',\n },\n height: {\n '': 'auto (100dvh - 8x)',\n 'type=fullscreen': '(100dvh - 8x) (100dvh - 8x)',\n 'type=fullscreenTakeover | type=panel': '100dvh 100dvh',\n 'type=popover': 'initial initial (50dvh - 5x)',\n },\n gap: 0,\n border: {\n '': false,\n 'type=popover': true,\n },\n radius: {\n '': '1cr',\n 'type=tray': '1cr top',\n 'type=fullscreenTakeover': '0r',\n },\n shadow: {\n '': '$dialog-shadow',\n 'type=popover | type=panel': '$shadow',\n },\n top: {\n '': false,\n 'type=modal': '((50vh - 50%) / -3)',\n 'type=panel': 'auto',\n },\n '$dialog-title-padding-v': {\n '': '1.5x',\n 'type=popover': '1x',\n },\n '$dialog-content-padding-v': {\n '': '1.5x',\n 'type=popover': '1x',\n },\n '$dialog-padding-h': {\n '': '1.5x',\n 'type=popover': '1x',\n },\n '$dialog-footer-v': {\n '': '1.5x',\n 'type=popover': '1x',\n },\n '$dialog-content-gap': {\n '': '1.5x',\n 'type=popover': '1x',\n },\n },\n});\n\nconst CloseButton = tasty(ItemButton, {\n qa: 'ModalCloseButton',\n type: 'clear',\n styles: {\n position: 'absolute',\n top: '1x',\n right: '1x',\n },\n});\n\nconst sizeMap = {\n S: 'small',\n M: 'medium',\n L: 'large',\n};\nconst sizePxMap = {\n small: 360,\n medium: 479,\n large: 798,\n};\n\nexport interface CubeDialogProps\n extends Omit<BaseProps, 'role'>,\n AriaDialogProps,\n BaseStyleProps,\n BlockStyleProps,\n DimensionStyleProps {\n /** The size of the dialog */\n size?: 'S' | 'M' | 'L' | 'small' | 'medium' | 'large';\n /** Whether the dialog is dismissable */\n isDismissable?: boolean;\n /** Trigger when the dialog is dismissed */\n onDismiss?: (arg?: any) => void;\n /** That you can replace the close icon with */\n closeIcon?: ReactElement;\n closeButtonStyles?: Styles;\n role?: 'dialog' | 'alertdialog';\n}\n\n/**\n * Dialogs are windows containing contextual information, tasks, or workflows that appear over the user interface.\n * Depending on the kind of Dialog, further interactions may be blocked until the Dialog is acknowledged.\n */\nexport const Dialog = forwardRef(function Dialog(\n props: CubeDialogProps,\n ref: Ref<HTMLDivElement>,\n) {\n const transitionContext = useOpenTransitionContext();\n\n const isEntered = transitionContext?.transitionState === 'entered';\n\n const context = useDialogContext();\n\n const content = useMemo(() => {\n return <DialogContent key=\"content\" {...props} ref={ref} />;\n }, [props, ref]);\n\n const shouldContainFocus =\n isEntered && !!context.isOpen && context.type !== 'panel';\n\n return (\n // This component traps the focus inside the dialog and restores it on\n // close. The restore is the one that matters for popover-type dialogs —\n // `DialogTrigger`'s own restore is a no-op there — so `shouldRestoreFocus`\n // has to reach it. Containment is unaffected either way.\n <FocusScope\n restoreFocus={context.shouldRestoreFocus ?? true}\n contain={shouldContainFocus}\n >\n {content}\n </FocusScope>\n );\n});\n\nconst DialogContent = forwardRef(function DialogContent(\n props: CubeDialogProps,\n ref: Ref<HTMLDivElement>,\n) {\n let { type = 'modal', ...contextProps } = useDialogContext();\n\n let {\n qa,\n children,\n size = 'M',\n isDismissable = contextProps.isDismissable,\n onDismiss = contextProps.onClose,\n closeIcon,\n closeButtonStyles,\n style,\n ...otherProps\n } = props;\n\n size = sizeMap[size.toUpperCase()] || size;\n\n const styles: Styles = extractStyles(otherProps, STYLES_LIST);\n\n const { t } = useI18n();\n\n let domRef = useObjectRef(ref);\n let { dialogProps, titleProps } = useDialog(\n mergeProps(contextProps, props),\n domRef,\n );\n\n // If rendered in a popover or tray there won't be a visible dismiss button,\n // so we render a hidden one for screen readers.\n let dismissButton;\n if (type === 'popover' || type === 'tray') {\n dismissButton = <DismissButton onDismiss={onDismiss} />;\n }\n\n // Focus the first focusable element in the dialog when it opens.\n //\n // We also re-run the priority focus logic when the dialog <section>\n // itself is the active element. This recovers from a race that occurs\n // when a popover-based component (FilterPicker, Picker, Select, …) opens\n // inside another contained Dialog: React's native `autoFocus` on the\n // inner control fires during the mutation phase, before the popover's\n // FocusScope registers in react-aria's focus-scope tree, so the outer\n // FocusScope yanks focus back. useDialog then defaults focus to the\n // dialog <section>; without re-promoting it here, the priority element\n // (e.g. the search input) is never focused.\n useEffect(() => {\n if (contextProps.isOpen) {\n setTimeout(() => {\n if (!domRef.current) return;\n\n const activeElement = document.activeElement;\n const isFocusOutsideDialog = !domRef.current.contains(activeElement);\n const isFocusOnDialogShell = activeElement === domRef.current;\n\n // Priority 1: autofocus input or primary button\n const priorityElement = domRef.current.querySelector(\n 'input[data-autofocus], button[type=\"submit\"], button[data-type=\"primary\"]',\n ) as HTMLElement | null;\n\n if (priorityElement && (isFocusOutsideDialog || isFocusOnDialogShell)) {\n priorityElement.focus();\n return;\n }\n\n if (isFocusOutsideDialog) {\n // Fallback: focus first tabbable element, or dialog itself\n const focusManager = createFocusManager(domRef);\n\n if (!focusManager.focusFirst({ tabbable: true })) {\n domRef.current.focus();\n }\n }\n });\n }\n }, [contextProps.isOpen]);\n\n // let hasHeader = useHasChild('[data-id=\"Header\"]', domRef);\n // let hasFooter = useHasChild('[data-id=\"Footer\"]', domRef);\n\n let slots = {\n title: {\n level: 2,\n preset: 'h4',\n ...titleProps,\n },\n content: {\n styles: {\n flexGrow: 1,\n padding: '$dialog-content-padding-v $dialog-padding-h',\n gap: '$dialog-content-gap',\n height: {\n '': 'max (100% - (2 * $dialog-content-padding-v))',\n ':last-child': 'max (100% - $dialog-content-padding-v)',\n },\n },\n },\n header: {\n ellipsis: true,\n styles: {\n display: 'flex',\n flow: 'row',\n gap: '1x',\n placeItems: 'center stretch',\n placeContent: 'space-between',\n padding: `$dialog-title-padding-v ${\n isDismissable ? '($dialog-padding-h + 4x)' : '$dialog-padding-h'\n } $dialog-title-padding-v $dialog-padding-h`,\n border: 'bottom',\n },\n },\n footer: {\n styles: {\n display: 'flex',\n gap: '1x',\n flow: 'row-reverse',\n placeItems: 'baseline stretch',\n placeContent: 'space-between',\n padding: '$dialog-footer-v $dialog-padding-h',\n },\n },\n buttonGroup: {\n styles: {\n flow: 'row-reverse',\n },\n },\n };\n\n return (\n <DialogElement\n ref={domRef}\n data-id=\"Dialog\"\n data-qa={qa || 'Dialog'}\n styles={styles}\n as=\"section\"\n {...dialogProps}\n mods={{ dismissable: isDismissable }}\n style={{\n '--dialog-size': `${sizePxMap[size] || sizePxMap.small}px`,\n ...style,\n }}\n data-type={type}\n data-size={size}\n >\n {dismissButton}\n\n <SlotProvider slots={slots}>\n {isDismissable && (\n <CloseButton\n icon={closeIcon || <CloseIcon size={20} />}\n label={t('dialog.dismiss', 'Dismiss')}\n onPress={() => onDismiss && onDismiss()}\n />\n )}\n {children}\n </SlotProvider>\n </DialogElement>\n );\n});\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Dialog.js","names":["ItemButton","mergeProps"],"sources":["../../../../src/components/overlays/Dialog/Dialog.tsx"],"sourcesContent":["import { createFocusManager } from '@react-aria/focus';\nimport { useObjectRef } from '@react-aria/utils';\nimport {\n BASE_STYLES,\n BaseProps,\n BaseStyleProps,\n BLOCK_STYLES,\n BlockStyleProps,\n DIMENSION_STYLES,\n DimensionStyleProps,\n FLOW_STYLES,\n Styles,\n tasty,\n} from '@tenphi/tasty';\nimport { forwardRef, ReactElement, Ref, useEffect, useMemo } from 'react';\nimport {\n AriaDialogProps,\n DismissButton,\n FocusScope,\n useDialog,\n} from 'react-aria';\n\nimport { useI18n } from '../../../i18n';\nimport { CloseIcon } from '../../../icons/CloseIcon';\nimport { mergeProps, SlotProvider } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { ItemButton } from '../../actions/ItemButton/ItemButton';\nimport { useOpenTransitionContext } from '../Modal/OpenTransitionContext';\n\nimport { useDialogContext } from './context';\n\nconst STYLES_LIST = [\n ...BASE_STYLES,\n ...DIMENSION_STYLES,\n ...BLOCK_STYLES,\n ...FLOW_STYLES,\n];\n\nconst DialogElement = tasty({\n as: 'section',\n styles: {\n display: 'flex',\n flow: 'column',\n fill: '#surface',\n pointerEvents: 'auto',\n outline: 0,\n position: {\n '': 'relative',\n 'type=panel': 'absolute',\n },\n width: {\n '': '$min-dialog-size $dialog-size (100dvw - 8x)',\n 'type=fullscreen': '(100dvw - 8x) (100dvw - 8x)',\n 'type=fullscreenTakeover': '100dvw 100dvw',\n 'type=panel': 'auto',\n },\n height: {\n '': 'auto (100dvh - 8x)',\n 'type=fullscreen': '(100dvh - 8x) (100dvh - 8x)',\n 'type=fullscreenTakeover | type=panel': '100dvh 100dvh',\n 'type=popover': 'initial initial (50dvh - 5x)',\n },\n gap: 0,\n border: {\n '': false,\n 'type=popover': true,\n },\n radius: {\n '': '1cr',\n 'type=tray': '1cr top',\n 'type=fullscreenTakeover': '0r',\n },\n shadow: {\n '': '$dialog-shadow',\n 'type=popover | type=panel': '$shadow',\n },\n top: {\n '': false,\n 'type=modal': '((50vh - 50%) / -3)',\n 'type=panel': 'auto',\n },\n '$dialog-title-padding-v': {\n '': '1.5x',\n 'type=popover': '1x',\n },\n '$dialog-content-padding-v': {\n '': '1.5x',\n 'type=popover': '1x',\n },\n '$dialog-padding-h': {\n '': '1.5x',\n 'type=popover': '1x',\n },\n '$dialog-footer-v': {\n '': '1.5x',\n 'type=popover': '1x',\n },\n '$dialog-content-gap': {\n '': '1.5x',\n 'type=popover': '1x',\n },\n },\n});\n\nconst CloseButton = tasty(ItemButton, {\n qa: 'ModalCloseButton',\n type: 'clear',\n styles: {\n position: 'absolute',\n top: '1x',\n right: '1x',\n },\n});\n\nconst sizeMap = {\n S: 'small',\n M: 'medium',\n L: 'large',\n};\nconst sizePxMap = {\n small: 360,\n medium: 479,\n large: 798,\n};\n\nexport interface CubeDialogProps\n extends Omit<BaseProps, 'role'>,\n AriaDialogProps,\n BaseStyleProps,\n BlockStyleProps,\n DimensionStyleProps {\n /** The size of the dialog */\n size?: 'S' | 'M' | 'L' | 'small' | 'medium' | 'large';\n /** Whether the dialog is dismissable */\n isDismissable?: boolean;\n /** Trigger when the dialog is dismissed */\n onDismiss?: (arg?: any) => void;\n /** That you can replace the close icon with */\n closeIcon?: ReactElement;\n closeButtonStyles?: Styles;\n role?: 'dialog' | 'alertdialog';\n}\n\n/**\n * Dialogs are windows containing contextual information, tasks, or workflows that appear over the user interface.\n * Depending on the kind of Dialog, further interactions may be blocked until the Dialog is acknowledged.\n */\nexport const Dialog = forwardRef(function Dialog(\n props: CubeDialogProps,\n ref: Ref<HTMLDivElement>,\n) {\n const transitionContext = useOpenTransitionContext();\n\n const isEntered = transitionContext?.transitionState === 'entered';\n\n const context = useDialogContext();\n\n const content = useMemo(() => {\n return <DialogContent key=\"content\" {...props} ref={ref} />;\n }, [props, ref]);\n\n const shouldContainFocus =\n isEntered && !!context.isOpen && context.type !== 'panel';\n\n return (\n // This component traps the focus inside the dialog and restores it on\n // close. The restore is the one that matters for popover-type dialogs —\n // `DialogTrigger`'s own restore is a no-op there — so `shouldRestoreFocus`\n // has to reach it. Containment is unaffected either way.\n <FocusScope\n restoreFocus={context.shouldRestoreFocus ?? true}\n contain={shouldContainFocus}\n >\n {content}\n </FocusScope>\n );\n});\n\nconst DialogContent = forwardRef(function DialogContent(\n props: CubeDialogProps,\n ref: Ref<HTMLDivElement>,\n) {\n let { type = 'modal', ...contextProps } = useDialogContext();\n\n let {\n qa,\n children,\n size = 'M',\n isDismissable = contextProps.isDismissable,\n onDismiss = contextProps.onClose,\n closeIcon,\n closeButtonStyles,\n style,\n ...otherProps\n } = props;\n\n size = sizeMap[size.toUpperCase()] || size;\n\n const styles: Styles = extractStyles(otherProps, STYLES_LIST);\n\n const { t } = useI18n();\n\n let domRef = useObjectRef(ref);\n let { dialogProps, titleProps } = useDialog(\n mergeProps(contextProps, props),\n domRef,\n );\n\n // If rendered in a popover or tray there won't be a visible dismiss button,\n // so we render a hidden one for screen readers.\n let dismissButton;\n if (type === 'popover' || type === 'tray') {\n dismissButton = <DismissButton onDismiss={onDismiss} />;\n }\n\n // Focus the first focusable element in the dialog when it opens.\n //\n // We also re-run the priority focus logic when the dialog <section>\n // itself is the active element. This recovers from a race that occurs\n // when a popover-based component (FilterPicker, Picker, Select, …) opens\n // inside another contained Dialog: React's native `autoFocus` on the\n // inner control fires during the mutation phase, before the popover's\n // FocusScope registers in react-aria's focus-scope tree, so the outer\n // FocusScope yanks focus back. useDialog then defaults focus to the\n // dialog <section>; without re-promoting it here, the priority element\n // (e.g. the search input) is never focused.\n useEffect(() => {\n if (contextProps.isOpen) {\n setTimeout(() => {\n if (!domRef.current) return;\n\n const activeElement = document.activeElement;\n const isFocusOutsideDialog = !domRef.current.contains(activeElement);\n const isFocusOnDialogShell = activeElement === domRef.current;\n\n // Priority 1: autofocus input or primary button\n const priorityElement = domRef.current.querySelector(\n 'input[data-autofocus], button[type=\"submit\"], button[data-type=\"primary\"]',\n ) as HTMLElement | null;\n\n if (priorityElement && (isFocusOutsideDialog || isFocusOnDialogShell)) {\n priorityElement.focus();\n return;\n }\n\n if (isFocusOutsideDialog) {\n // Fallback: focus first tabbable element, or dialog itself\n const focusManager = createFocusManager(domRef);\n\n if (!focusManager.focusFirst({ tabbable: true })) {\n domRef.current.focus();\n }\n }\n });\n }\n }, [contextProps.isOpen]);\n\n // let hasHeader = useHasChild('[data-id=\"Header\"]', domRef);\n // let hasFooter = useHasChild('[data-id=\"Footer\"]', domRef);\n\n let slots = {\n title: {\n level: 2,\n preset: 'h4',\n ...titleProps,\n },\n content: {\n styles: {\n flexGrow: 1,\n padding: '$dialog-content-padding-v $dialog-padding-h',\n gap: '$dialog-content-gap',\n height: {\n '': 'max (100% - (2 * $dialog-content-padding-v))',\n ':last-child': 'max (100% - $dialog-content-padding-v)',\n },\n },\n },\n header: {\n ellipsis: true,\n styles: {\n display: 'flex',\n flow: 'row',\n gap: '1x',\n placeItems: 'center stretch',\n placeContent: 'space-between',\n padding: `$dialog-title-padding-v ${\n isDismissable ? '($dialog-padding-h + 4x)' : '$dialog-padding-h'\n } $dialog-title-padding-v $dialog-padding-h`,\n border: 'bottom',\n },\n },\n footer: {\n styles: {\n display: 'flex',\n gap: '1x',\n flow: 'row-reverse',\n placeItems: 'baseline stretch',\n placeContent: 'space-between',\n padding: '$dialog-footer-v $dialog-padding-h',\n },\n },\n buttonGroup: {\n styles: {\n flow: 'row-reverse',\n },\n },\n };\n\n return (\n <DialogElement\n ref={domRef}\n data-id=\"Dialog\"\n data-qa={qa || 'Dialog'}\n styles={styles}\n as=\"section\"\n {...dialogProps}\n mods={{ dismissable: isDismissable }}\n style={{\n '--dialog-size': `${sizePxMap[size] || sizePxMap.small}px`,\n ...style,\n }}\n data-type={type}\n data-size={size}\n >\n {dismissButton}\n\n <SlotProvider slots={slots}>\n {isDismissable && (\n <CloseButton\n icon={closeIcon || <CloseIcon size={20} />}\n label={t('dialog.dismiss', 'Dismiss')}\n onPress={() => onDismiss && onDismiss()}\n />\n )}\n {children}\n </SlotProvider>\n </DialogElement>\n );\n});\n"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { _Modal } from "../Modal/Modal.js";
|
|
3
3
|
import { DialogContext } from "./context.js";
|
|
4
4
|
import { Children, isValidElement, useRef } from "react";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { _Title } from "../../content/Title.js";
|
|
3
3
|
import { useI18n } from "../../../i18n/useI18n.js";
|
|
4
4
|
import { ButtonGroup } from "../../actions/ButtonGroup/ButtonGroup.js";
|
|
@@ -6,10 +6,10 @@ import { Button } from "../../actions/index.js";
|
|
|
6
6
|
import { useDialogContext } from "./context.js";
|
|
7
7
|
import { Content } from "../../content/Content.js";
|
|
8
8
|
import { Header } from "../../content/Header.js";
|
|
9
|
+
import { Dialog } from "./Dialog.js";
|
|
9
10
|
import { useForm } from "../../form/Form/use-form.js";
|
|
10
11
|
import { _SubmitButton } from "../../form/Form/SubmitButton/SubmitButton.js";
|
|
11
12
|
import { Form } from "../../form/Form/index.js";
|
|
12
|
-
import { Dialog } from "./Dialog.js";
|
|
13
13
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
14
14
|
|
|
15
15
|
//#region src/components/overlays/Dialog/DialogForm.tsx
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { useLayoutEffect as useLayoutEffect$1 } from "../../../utils/react/useLayoutEffect.js";
|
|
3
3
|
import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
|
|
4
4
|
import { usePopoverSync } from "../../../utils/react/usePopoverSync.js";
|
|
@@ -152,12 +152,13 @@ function PopoverTrigger(allProps) {
|
|
|
152
152
|
const resolveShouldCloseOnInteractOutside = useEvent((el) => {
|
|
153
153
|
const popoverTriggerEl = el.closest("[data-popover-trigger]");
|
|
154
154
|
if (!popoverTriggerEl) {
|
|
155
|
+
if (shouldCloseOnInteractOutside && !shouldCloseOnInteractOutside(el)) return false;
|
|
155
156
|
if (el.closest("[data-popover-keep]")) return false;
|
|
156
157
|
if (el.closest("[data-popover-dismiss]")) {
|
|
157
158
|
setTimeout(() => state.close(), 0);
|
|
158
159
|
return false;
|
|
159
160
|
}
|
|
160
|
-
return
|
|
161
|
+
return true;
|
|
161
162
|
}
|
|
162
163
|
const ownTrigger = targetRef?.current ?? triggerRef.current;
|
|
163
164
|
if (popoverTriggerEl === ownTrigger || ownTrigger?.contains(el)) return true;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DialogTrigger.js","names":["Modal","Tray","Popover"],"sources":["../../../../src/components/overlays/Dialog/DialogTrigger.tsx"],"sourcesContent":["import { PressResponder } from '@react-aria/interactions';\nimport { useMediaQuery } from '@react-spectrum/utils';\nimport { Styles } from '@tenphi/tasty';\nimport {\n Fragment,\n ReactElement,\n RefObject,\n useEffect,\n useMemo,\n useRef,\n} from 'react';\nimport {\n OverlayTriggerProps,\n Placement,\n PositionProps,\n useOverlayPosition,\n useOverlayTrigger,\n} from 'react-aria';\nimport { OverlayTriggerState, useOverlayTriggerState } from 'react-stately';\n\nimport { useEvent } from '../../../_internal';\nimport { generateRandomId } from '../../../utils/random';\nimport { useCombinedRefs, useLayoutEffect } from '../../../utils/react/index';\nimport { usePopoverSync } from '../../../utils/react/usePopoverSync';\nimport { Modal, Popover, Tray, WithCloseBehavior } from '../Modal';\n\nimport { DialogContext } from './context';\n\nexport type CubeDialogClose = (close: () => void) => ReactElement;\n\nexport interface CubeDialogTriggerProps\n extends OverlayTriggerProps,\n PositionProps,\n WithCloseBehavior {\n /** The Dialog and its trigger element. See the DialogTrigger [Content section](#content) for more information on what to provide as children. */\n children: [\n ReactElement | ((state: OverlayTriggerState) => ReactElement),\n CubeDialogClose | ReactElement,\n ];\n /**\n * The type of Dialog that should be rendered. See the DialogTrigger [types section](#dialog-types) for an explanation on each.\n * @default 'modal'\n */\n type?:\n | 'modal'\n | 'popover'\n | 'tray'\n | 'fullscreen'\n | 'fullscreenTakeover'\n | 'panel';\n /** The type of Dialog that should be rendered when on a mobile device. See DialogTrigger [types section](#dialog-types) for an explanation on each. */\n mobileType?:\n | 'modal'\n | 'tray'\n | 'fullscreen'\n | 'fullscreenTakeover'\n | 'panel'\n | 'popover';\n placement?: Placement;\n /**\n * Whether a popover type Dialog's arrow should be hidden.\n */\n hideArrow?: boolean;\n /** The ref of the element the Dialog should visually attach itself to. Defaults to the trigger button if not defined. */\n targetRef?: RefObject<HTMLElement | null>;\n /** Whether a modal type Dialog should be dismissable. */\n isDismissable?: boolean;\n /** Whether pressing the escape key to close the dialog should be disabled. */\n isKeyboardDismissDisabled?: boolean;\n /** The screen breakpoint for the mobile type */\n mobileViewport?: number;\n /** The style map for the overlay **/\n styles?: Styles;\n shouldCloseOnInteractOutside?: (element: Element) => boolean;\n onDismiss?: (action?: string) => void;\n isOpen?: boolean;\n onOpenChange?: (isOpen: boolean) => void;\n defaultOpen?: boolean;\n shouldFlip?: boolean;\n shouldUpdatePosition?: boolean;\n /** Minimum padding in pixels between the popover and viewport edges */\n containerPadding?: number;\n /**\n * Whether focus returns to the trigger when the dialog closes. Defaults to\n * `true`.\n *\n * The restore is skipped automatically whenever the action that closed the\n * dialog has already moved focus somewhere else, so an action that opens a\n * panel/dialog/inline editor and focuses it needs nothing here. Pass `false`\n * for the remaining case: a surface that claims focus *later* than the\n * dialog's own restore (after an async load, an entry animation, or a\n * `requestAnimationFrame`), where the trigger would otherwise take focus\n * first and produce a visible flash.\n */\n shouldRestoreFocus?: boolean;\n}\n\n/**\n * DialogTrigger serves as a wrapper around a Dialog and its associated trigger, linking the Dialog's\n * open state with the trigger's press state. Additionally, it allows you to customize the type and\n * positioning of the Dialog.\n */\nexport function DialogTrigger(props: CubeDialogTriggerProps) {\n let {\n children,\n type = 'modal',\n mobileType = type,\n hideArrow,\n targetRef,\n onDismiss,\n isDismissable = true,\n isKeyboardDismissDisabled,\n styles,\n mobileViewport = 700,\n hideOnClose,\n shouldCloseOnInteractOutside,\n shouldRestoreFocus = true,\n ...positionProps\n } = props;\n\n if (!Array.isArray(children) || children.length > 2) {\n throw new Error('DialogTrigger must have exactly 2 children');\n }\n // if a function is passed as the second child, it won't appear in toArray\n let [trigger, content] = children;\n\n // On small devices, show a modal or tray instead of a popover.\n let isMobile = useMediaQuery(`(max-width: ${mobileViewport}px)`);\n if (isMobile) {\n // handle cases where desktop popovers need a close button for the mobile modal view\n if (type !== 'modal' && mobileType === 'modal') {\n isDismissable = true;\n }\n\n type = mobileType;\n }\n\n let state = useOverlayTriggerState(props);\n\n if (typeof trigger === 'function') {\n trigger = trigger(state);\n }\n\n let wasOpen = useRef(false);\n let isExiting = useRef(false);\n let onExiting = () => (isExiting.current = true);\n let onExited = () => (isExiting.current = false);\n\n wasOpen.current = state.isOpen;\n\n // Shared identity + refs for `usePopoverSync`. Allocating here (rather than\n // inside the branch-specific sub-trees) keeps a single sync registration for\n // the lifetime of the trigger, even when `type` flips between popover and\n // modal at the mobile breakpoint. The refs are then threaded into the\n // appropriate branch so existing positioning / useOverlayTrigger hooks keep\n // their original ref targets and `usePopoverSync`'s `contains()` check has a\n // real DOM node to query.\n const dialogSyncId = useMemo(() => generateRandomId(), []);\n const syncTriggerRef = useRef<HTMLElement | null>(null);\n const syncOverlayRef = useRef<HTMLElement | null>(null);\n\n // Only popover-type Dialogs participate in the \"press inside dismisses\n // me\" / \"peer popover opening dismisses me\" behaviours: modals, trays,\n // fullscreen and panel Dialogs are persistent workspaces and must not be\n // yanked closed via the EventBus (which would bypass `isDismissable` and\n // call `state.close()` directly). Non-popover types DO still EMIT\n // `popover:open`, so opening a modal correctly dismisses peer popovers.\n const isPopoverFlavored = type === 'popover';\n usePopoverSync({\n menuId: dialogSyncId,\n isOpen: state.isOpen,\n onClose: () => state.close(),\n triggerRef: syncTriggerRef,\n containerRef: syncOverlayRef,\n dismissOnInnerButtonPress: isPopoverFlavored,\n closeOnPeerOpen: isPopoverFlavored,\n });\n\n useEffect(() => {\n return () => {\n if (\n (wasOpen.current || isExiting.current) &&\n type !== 'popover' &&\n type !== 'tray'\n ) {\n console.warn(\n 'CubeUIKit: A DialogTrigger unmounted while open. This is likely due to being placed within a trigger that unmounts or inside a conditional. Consider using a DialogContainer instead.',\n );\n }\n };\n }, []);\n\n function onClose(action) {\n if (isDismissable) {\n onDismiss && onDismiss(action);\n state.close();\n }\n }\n\n if (type === 'popover') {\n return (\n <PopoverTrigger\n {...positionProps}\n hideOnClose={hideOnClose}\n state={state}\n styles={styles}\n targetRef={targetRef}\n trigger={trigger}\n content={content}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n hideArrow={hideArrow}\n shouldCloseOnInteractOutside={shouldCloseOnInteractOutside}\n shouldRestoreFocus={shouldRestoreFocus}\n syncTriggerRef={syncTriggerRef}\n syncOverlayRef={syncOverlayRef}\n triggerType={type}\n onClose={onClose}\n />\n );\n }\n\n let renderOverlay = () => {\n switch (type) {\n case 'panel':\n case 'fullscreen':\n case 'fullscreenTakeover':\n case 'modal':\n return (\n <Modal\n ref={syncOverlayRef}\n hideOnClose={hideOnClose}\n isOpen={state.isOpen}\n isDismissable={isDismissable}\n type={type}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n styles={styles}\n shouldCloseOnInteractOutside={shouldCloseOnInteractOutside}\n onClose={onClose}\n onExiting={onExiting}\n onExited={onExited}\n >\n {typeof content === 'function' ? content(state.close) : content}\n </Modal>\n );\n case 'tray':\n return (\n <Tray\n ref={syncOverlayRef}\n hideOnClose={hideOnClose}\n isOpen={state.isOpen}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n styles={styles}\n onClose={onClose}\n >\n {typeof content === 'function' ? content(state.close) : content}\n </Tray>\n );\n }\n };\n\n return (\n <DialogTriggerBase\n type={type}\n state={state}\n isDismissable={isDismissable}\n trigger={trigger}\n overlay={renderOverlay()}\n hideOnClose={hideOnClose}\n syncTriggerRef={syncTriggerRef}\n overlayRef={syncOverlayRef}\n shouldRestoreFocus={shouldRestoreFocus}\n onClose={onClose}\n />\n );\n}\n\nfunction PopoverTrigger(allProps) {\n let {\n state,\n styles,\n targetRef,\n trigger,\n content,\n hideArrow,\n onClose,\n isKeyboardDismissDisabled,\n hideOnClose,\n shouldCloseOnInteractOutside,\n shouldRestoreFocus,\n keepOpenOnScroll,\n syncTriggerRef,\n syncOverlayRef,\n triggerType,\n ...props\n } = allProps;\n\n let triggerRef = useRef<HTMLButtonElement>(null);\n let overlayRef = useRef<HTMLDivElement>(null);\n\n // Mirror the trigger/overlay DOM nodes into the parent-owned sync refs.\n //\n // We deliberately do NOT use `useCombinedRefs` here: that hook returns a\n // brand new internal ref and propagates to the passed refs via a regular\n // `useEffect` (post-commit). `useOverlayPosition` below reads\n // `triggerRef.current` in its own layout effect during the SAME commit, so\n // if `triggerRef` only receives the DOM node via a delayed effect, the\n // first measurement sees `null` and the popover positions at the document\n // origin until something forces a re-measure.\n //\n // Keeping `triggerRef`/`overlayRef` as the direct React refs preserves\n // synchronous assignment for `useOverlayPosition`. The sync refs are only\n // ever read inside `popover:open` handlers, which fire via setTimeout(0),\n // so a layout-effect mirror is more than fast enough.\n useLayoutEffect(() => {\n if (syncTriggerRef) {\n syncTriggerRef.current = targetRef?.current ?? triggerRef.current ?? null;\n }\n if (syncOverlayRef) {\n syncOverlayRef.current = overlayRef.current ?? null;\n }\n });\n\n let {\n overlayProps: popoverProps,\n placement,\n arrowProps,\n updatePosition,\n } = useOverlayPosition({\n targetRef: targetRef || triggerRef,\n overlayRef: overlayRef,\n placement: props.placement,\n containerPadding: props.containerPadding,\n offset: props.offset || 8,\n crossOffset: props.crossOffset,\n shouldFlip: props.shouldFlip,\n shouldUpdatePosition: props.shouldUpdatePosition,\n isOpen: state.isOpen,\n });\n\n let overlayTriggerState = state;\n\n if (keepOpenOnScroll) {\n overlayTriggerState = { ...state, close: updatePosition };\n }\n\n let { triggerProps, overlayProps } = useOverlayTrigger(\n { type: 'dialog' },\n overlayTriggerState,\n triggerRef,\n );\n\n let triggerPropsWithRef = {\n ...triggerProps,\n ref: targetRef ? undefined : triggerRef,\n };\n\n // Mirror the Select/ComboBox/MenuTrigger pattern: when an outside click lands\n // on ANOTHER popover trigger, return `false` so react-aria's `useOverlay`\n // does NOT `stopPropagation()` the click. The click then reaches that trigger,\n // its popover opens, and `usePopoverSync` closes this one via the EventBus.\n // Without this, react-aria swallows every outside click and a single click on\n // a sibling trigger can't open it while this popover is open.\n const resolveShouldCloseOnInteractOutside = useEvent(\n (el: Element): boolean => {\n const popoverTriggerEl = el.closest('[data-popover-trigger]');\n if (!popoverTriggerEl) {\n if (el.closest('[data-popover-keep]')) return false;\n // Plain interactive controls (Button, ItemButton) opt in via\n // `data-popover-dismiss`. Schedule the close after the click finishes so\n // the control's `onPress` runs first instead of losing the click to\n // useOverlay's stopPropagation.\n if (el.closest('[data-popover-dismiss]')) {\n setTimeout(() => state.close(), 0);\n return false;\n }\n return shouldCloseOnInteractOutside\n ? shouldCloseOnInteractOutside(el)\n : true;\n }\n // Clicking our own trigger again should dismiss us.\n const ownTrigger = targetRef?.current ?? triggerRef.current;\n if (popoverTriggerEl === ownTrigger || ownTrigger?.contains(el))\n return true;\n // Another popover's trigger: let the click through so it can open.\n return false;\n },\n );\n\n let overlay = (\n <Popover\n ref={overlayRef}\n styles={styles}\n hideOnClose={hideOnClose}\n isOpen={state.isOpen}\n style={popoverProps.style}\n placement={placement}\n arrowProps={arrowProps}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n hideArrow={hideArrow}\n shouldCloseOnInteractOutside={resolveShouldCloseOnInteractOutside}\n onClose={onClose}\n >\n {typeof content === 'function' ? content(state.close) : content}\n </Popover>\n );\n\n return (\n <DialogTriggerBase\n type=\"popover\"\n state={state}\n triggerProps={triggerPropsWithRef}\n dialogProps={overlayProps}\n trigger={trigger}\n overlay={overlay}\n overlayRef={overlayRef}\n shouldRestoreFocus={shouldRestoreFocus}\n onClose={onClose}\n />\n );\n}\n\nfunction DialogTriggerBase(props: any) {\n const ref = useCombinedRefs<HTMLElement>(props.ref);\n const wasOpenRef = useRef(false);\n const overlayRef: RefObject<HTMLElement | null> | undefined =\n props.overlayRef;\n\n // Mirror the press-responder DOM node into the parent's sync trigger ref.\n // Done via `useLayoutEffect` rather than threading through `useCombinedRefs`\n // for consistency with `PopoverTrigger` (see comment there) — keeps the\n // sync-ref population deterministic regardless of branch.\n useLayoutEffect(() => {\n if (props.syncTriggerRef) {\n props.syncTriggerRef.current = ref.current ?? null;\n }\n });\n\n let {\n type,\n state,\n onClose,\n isDismissable,\n dialogProps = {},\n triggerProps = {},\n overlay,\n trigger,\n shouldRestoreFocus = true,\n } = props;\n\n let context = {\n type,\n onClose,\n isDismissable,\n isOpen: state.isOpen,\n // Reaches `Dialog`'s `FocusScope`, which owns the restore for\n // popover-type dialogs. `useDialog` filters it out of the DOM props.\n shouldRestoreFocus,\n ...dialogProps,\n };\n\n // Whether focus has been claimed by something outside the closing dialog —\n // the signal that an action handed focus off and the trigger must not take\n // it back. Same rule as `MenuTrigger` (see CUB-3962): an action that opens\n // a panel, another dialog or an inline editor focuses that surface, and\n // restoring here would undo the hand-off.\n //\n // Focus still inside the overlay means nobody claimed it (the pressed\n // control keeps focus while the overlay plays its ~350ms exit animation),\n // and focus on `<body>` or on a detached node means the focused element\n // went away with the dialog. Both belong back on the trigger.\n const hasFocusMovedOutsideDialog = useEvent(() => {\n const activeElement = document.activeElement;\n\n if (!activeElement || activeElement === document.body) return false;\n if (!activeElement.isConnected) return false;\n\n return !(\n overlayRef?.current?.contains(activeElement) ||\n ref.current?.contains(activeElement)\n );\n });\n\n // Restore focus manually when the dialog closes.\n //\n // Live for modal/tray/fullscreen/panel types only: in the popover branch\n // `triggerProps` carries its own `ref`, which overrides the `ref={ref}` on\n // `PressResponder` below, so `ref.current` stays null and this is a no-op.\n // Popovers get their restore from `Dialog`'s own `<FocusScope restoreFocus>`\n // instead, which already declines to restore when focus moved elsewhere.\n useEffect(() => {\n if (!state.isOpen && wasOpenRef.current) {\n wasOpenRef.current = false;\n if (!shouldRestoreFocus) return;\n if (hasFocusMovedOutsideDialog()) return;\n ref.current?.focus();\n } else if (state.isOpen) {\n wasOpenRef.current = true;\n }\n }, [state.isOpen, shouldRestoreFocus, hasFocusMovedOutsideDialog]);\n\n // Mark popover-type DialogTrigger children with `data-popover-trigger` so\n // `Button` / `ItemButton`'s default dismiss-on-press behaviour treats them\n // as popover triggers (skips the dismiss). Modal/tray/fullscreen children\n // intentionally stay UNMARKED — when a modal-type DialogTrigger lives\n // inside a popover footer, pressing it should dismiss the parent popover\n // (matching the \"modal takes over\" native UX).\n const triggerExtraProps =\n type === 'popover' ? { 'data-popover-trigger': '' } : {};\n\n return (\n <Fragment>\n <PressResponder\n ref={ref}\n {...triggerProps}\n {...triggerExtraProps}\n isPressed={\n state.isOpen &&\n type !== 'modal' &&\n type !== 'fullscreen' &&\n type !== 'fullscreenTakeover'\n }\n onPress={state.toggle}\n >\n {trigger}\n </PressResponder>\n <DialogContext.Provider value={context}>{overlay}</DialogContext.Provider>\n </Fragment>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DialogTrigger.js","names":["Modal","Tray","Popover"],"sources":["../../../../src/components/overlays/Dialog/DialogTrigger.tsx"],"sourcesContent":["import { PressResponder } from '@react-aria/interactions';\nimport { useMediaQuery } from '@react-spectrum/utils';\nimport { Styles } from '@tenphi/tasty';\nimport {\n Fragment,\n ReactElement,\n RefObject,\n useEffect,\n useMemo,\n useRef,\n} from 'react';\nimport {\n OverlayTriggerProps,\n Placement,\n PositionProps,\n useOverlayPosition,\n useOverlayTrigger,\n} from 'react-aria';\nimport { OverlayTriggerState, useOverlayTriggerState } from 'react-stately';\n\nimport { useEvent } from '../../../_internal';\nimport { generateRandomId } from '../../../utils/random';\nimport { useCombinedRefs, useLayoutEffect } from '../../../utils/react/index';\nimport { usePopoverSync } from '../../../utils/react/usePopoverSync';\nimport { Modal, Popover, Tray, WithCloseBehavior } from '../Modal';\n\nimport { DialogContext } from './context';\n\nexport type CubeDialogClose = (close: () => void) => ReactElement;\n\nexport interface CubeDialogTriggerProps\n extends OverlayTriggerProps,\n PositionProps,\n WithCloseBehavior {\n /** The Dialog and its trigger element. See the DialogTrigger [Content section](#content) for more information on what to provide as children. */\n children: [\n ReactElement | ((state: OverlayTriggerState) => ReactElement),\n CubeDialogClose | ReactElement,\n ];\n /**\n * The type of Dialog that should be rendered. See the DialogTrigger [types section](#dialog-types) for an explanation on each.\n * @default 'modal'\n */\n type?:\n | 'modal'\n | 'popover'\n | 'tray'\n | 'fullscreen'\n | 'fullscreenTakeover'\n | 'panel';\n /** The type of Dialog that should be rendered when on a mobile device. See DialogTrigger [types section](#dialog-types) for an explanation on each. */\n mobileType?:\n | 'modal'\n | 'tray'\n | 'fullscreen'\n | 'fullscreenTakeover'\n | 'panel'\n | 'popover';\n placement?: Placement;\n /**\n * Whether a popover type Dialog's arrow should be hidden.\n */\n hideArrow?: boolean;\n /** The ref of the element the Dialog should visually attach itself to. Defaults to the trigger button if not defined. */\n targetRef?: RefObject<HTMLElement | null>;\n /** Whether a modal type Dialog should be dismissable. */\n isDismissable?: boolean;\n /** Whether pressing the escape key to close the dialog should be disabled. */\n isKeyboardDismissDisabled?: boolean;\n /** The screen breakpoint for the mobile type */\n mobileViewport?: number;\n /** The style map for the overlay **/\n styles?: Styles;\n shouldCloseOnInteractOutside?: (element: Element) => boolean;\n onDismiss?: (action?: string) => void;\n isOpen?: boolean;\n onOpenChange?: (isOpen: boolean) => void;\n defaultOpen?: boolean;\n shouldFlip?: boolean;\n shouldUpdatePosition?: boolean;\n /** Minimum padding in pixels between the popover and viewport edges */\n containerPadding?: number;\n /**\n * Whether focus returns to the trigger when the dialog closes. Defaults to\n * `true`.\n *\n * The restore is skipped automatically whenever the action that closed the\n * dialog has already moved focus somewhere else, so an action that opens a\n * panel/dialog/inline editor and focuses it needs nothing here. Pass `false`\n * for the remaining case: a surface that claims focus *later* than the\n * dialog's own restore (after an async load, an entry animation, or a\n * `requestAnimationFrame`), where the trigger would otherwise take focus\n * first and produce a visible flash.\n */\n shouldRestoreFocus?: boolean;\n}\n\n/**\n * DialogTrigger serves as a wrapper around a Dialog and its associated trigger, linking the Dialog's\n * open state with the trigger's press state. Additionally, it allows you to customize the type and\n * positioning of the Dialog.\n */\nexport function DialogTrigger(props: CubeDialogTriggerProps) {\n let {\n children,\n type = 'modal',\n mobileType = type,\n hideArrow,\n targetRef,\n onDismiss,\n isDismissable = true,\n isKeyboardDismissDisabled,\n styles,\n mobileViewport = 700,\n hideOnClose,\n shouldCloseOnInteractOutside,\n shouldRestoreFocus = true,\n ...positionProps\n } = props;\n\n if (!Array.isArray(children) || children.length > 2) {\n throw new Error('DialogTrigger must have exactly 2 children');\n }\n // if a function is passed as the second child, it won't appear in toArray\n let [trigger, content] = children;\n\n // On small devices, show a modal or tray instead of a popover.\n let isMobile = useMediaQuery(`(max-width: ${mobileViewport}px)`);\n if (isMobile) {\n // handle cases where desktop popovers need a close button for the mobile modal view\n if (type !== 'modal' && mobileType === 'modal') {\n isDismissable = true;\n }\n\n type = mobileType;\n }\n\n let state = useOverlayTriggerState(props);\n\n if (typeof trigger === 'function') {\n trigger = trigger(state);\n }\n\n let wasOpen = useRef(false);\n let isExiting = useRef(false);\n let onExiting = () => (isExiting.current = true);\n let onExited = () => (isExiting.current = false);\n\n wasOpen.current = state.isOpen;\n\n // Shared identity + refs for `usePopoverSync`. Allocating here (rather than\n // inside the branch-specific sub-trees) keeps a single sync registration for\n // the lifetime of the trigger, even when `type` flips between popover and\n // modal at the mobile breakpoint. The refs are then threaded into the\n // appropriate branch so existing positioning / useOverlayTrigger hooks keep\n // their original ref targets and `usePopoverSync`'s `contains()` check has a\n // real DOM node to query.\n const dialogSyncId = useMemo(() => generateRandomId(), []);\n const syncTriggerRef = useRef<HTMLElement | null>(null);\n const syncOverlayRef = useRef<HTMLElement | null>(null);\n\n // Only popover-type Dialogs participate in the \"press inside dismisses\n // me\" / \"peer popover opening dismisses me\" behaviours: modals, trays,\n // fullscreen and panel Dialogs are persistent workspaces and must not be\n // yanked closed via the EventBus (which would bypass `isDismissable` and\n // call `state.close()` directly). Non-popover types DO still EMIT\n // `popover:open`, so opening a modal correctly dismisses peer popovers.\n const isPopoverFlavored = type === 'popover';\n usePopoverSync({\n menuId: dialogSyncId,\n isOpen: state.isOpen,\n onClose: () => state.close(),\n triggerRef: syncTriggerRef,\n containerRef: syncOverlayRef,\n dismissOnInnerButtonPress: isPopoverFlavored,\n closeOnPeerOpen: isPopoverFlavored,\n });\n\n useEffect(() => {\n return () => {\n if (\n (wasOpen.current || isExiting.current) &&\n type !== 'popover' &&\n type !== 'tray'\n ) {\n console.warn(\n 'CubeUIKit: A DialogTrigger unmounted while open. This is likely due to being placed within a trigger that unmounts or inside a conditional. Consider using a DialogContainer instead.',\n );\n }\n };\n }, []);\n\n function onClose(action) {\n if (isDismissable) {\n onDismiss && onDismiss(action);\n state.close();\n }\n }\n\n if (type === 'popover') {\n return (\n <PopoverTrigger\n {...positionProps}\n hideOnClose={hideOnClose}\n state={state}\n styles={styles}\n targetRef={targetRef}\n trigger={trigger}\n content={content}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n hideArrow={hideArrow}\n shouldCloseOnInteractOutside={shouldCloseOnInteractOutside}\n shouldRestoreFocus={shouldRestoreFocus}\n syncTriggerRef={syncTriggerRef}\n syncOverlayRef={syncOverlayRef}\n triggerType={type}\n onClose={onClose}\n />\n );\n }\n\n let renderOverlay = () => {\n switch (type) {\n case 'panel':\n case 'fullscreen':\n case 'fullscreenTakeover':\n case 'modal':\n return (\n <Modal\n ref={syncOverlayRef}\n hideOnClose={hideOnClose}\n isOpen={state.isOpen}\n isDismissable={isDismissable}\n type={type}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n styles={styles}\n shouldCloseOnInteractOutside={shouldCloseOnInteractOutside}\n onClose={onClose}\n onExiting={onExiting}\n onExited={onExited}\n >\n {typeof content === 'function' ? content(state.close) : content}\n </Modal>\n );\n case 'tray':\n return (\n <Tray\n ref={syncOverlayRef}\n hideOnClose={hideOnClose}\n isOpen={state.isOpen}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n styles={styles}\n onClose={onClose}\n >\n {typeof content === 'function' ? content(state.close) : content}\n </Tray>\n );\n }\n };\n\n return (\n <DialogTriggerBase\n type={type}\n state={state}\n isDismissable={isDismissable}\n trigger={trigger}\n overlay={renderOverlay()}\n hideOnClose={hideOnClose}\n syncTriggerRef={syncTriggerRef}\n overlayRef={syncOverlayRef}\n shouldRestoreFocus={shouldRestoreFocus}\n onClose={onClose}\n />\n );\n}\n\nfunction PopoverTrigger(allProps) {\n let {\n state,\n styles,\n targetRef,\n trigger,\n content,\n hideArrow,\n onClose,\n isKeyboardDismissDisabled,\n hideOnClose,\n shouldCloseOnInteractOutside,\n shouldRestoreFocus,\n keepOpenOnScroll,\n syncTriggerRef,\n syncOverlayRef,\n triggerType,\n ...props\n } = allProps;\n\n let triggerRef = useRef<HTMLButtonElement>(null);\n let overlayRef = useRef<HTMLDivElement>(null);\n\n // Mirror the trigger/overlay DOM nodes into the parent-owned sync refs.\n //\n // We deliberately do NOT use `useCombinedRefs` here: that hook returns a\n // brand new internal ref and propagates to the passed refs via a regular\n // `useEffect` (post-commit). `useOverlayPosition` below reads\n // `triggerRef.current` in its own layout effect during the SAME commit, so\n // if `triggerRef` only receives the DOM node via a delayed effect, the\n // first measurement sees `null` and the popover positions at the document\n // origin until something forces a re-measure.\n //\n // Keeping `triggerRef`/`overlayRef` as the direct React refs preserves\n // synchronous assignment for `useOverlayPosition`. The sync refs are only\n // ever read inside `popover:open` handlers, which fire via setTimeout(0),\n // so a layout-effect mirror is more than fast enough.\n useLayoutEffect(() => {\n if (syncTriggerRef) {\n syncTriggerRef.current = targetRef?.current ?? triggerRef.current ?? null;\n }\n if (syncOverlayRef) {\n syncOverlayRef.current = overlayRef.current ?? null;\n }\n });\n\n let {\n overlayProps: popoverProps,\n placement,\n arrowProps,\n updatePosition,\n } = useOverlayPosition({\n targetRef: targetRef || triggerRef,\n overlayRef: overlayRef,\n placement: props.placement,\n containerPadding: props.containerPadding,\n offset: props.offset || 8,\n crossOffset: props.crossOffset,\n shouldFlip: props.shouldFlip,\n shouldUpdatePosition: props.shouldUpdatePosition,\n isOpen: state.isOpen,\n });\n\n let overlayTriggerState = state;\n\n if (keepOpenOnScroll) {\n overlayTriggerState = { ...state, close: updatePosition };\n }\n\n let { triggerProps, overlayProps } = useOverlayTrigger(\n { type: 'dialog' },\n overlayTriggerState,\n triggerRef,\n );\n\n let triggerPropsWithRef = {\n ...triggerProps,\n ref: targetRef ? undefined : triggerRef,\n };\n\n // Mirror the Select/ComboBox/MenuTrigger pattern: when an outside click lands\n // on ANOTHER popover trigger, return `false` so react-aria's `useOverlay`\n // does NOT `stopPropagation()` the click. The click then reaches that trigger,\n // its popover opens, and `usePopoverSync` closes this one via the EventBus.\n // Without this, react-aria swallows every outside click and a single click on\n // a sibling trigger can't open it while this popover is open.\n const resolveShouldCloseOnInteractOutside = useEvent(\n (el: Element): boolean => {\n const popoverTriggerEl = el.closest('[data-popover-trigger]');\n if (!popoverTriggerEl) {\n // The caller's own predicate is asked FIRST, so an explicit \"keep me\n // open for this element\" wins over the automatic behaviours below\n // (CUB-4113). It used to be consulted last, which made the prop inert\n // for every `Button` / `ItemButton`: those carry\n // `data-popover-dismiss`, so the auto-dismiss branch matched and\n // closed the popover before the predicate was ever asked.\n //\n // React Aria hands over the element the pointer landed on — for a\n // `Button` that is the label inside it, not the `<button>` — so a\n // predicate that guards an element has to use `contains()` rather\n // than an identity check.\n if (shouldCloseOnInteractOutside && !shouldCloseOnInteractOutside(el)) {\n return false;\n }\n if (el.closest('[data-popover-keep]')) return false;\n // Plain interactive controls (Button, ItemButton) opt in via\n // `data-popover-dismiss`. Schedule the close after the click finishes so\n // the control's `onPress` runs first instead of losing the click to\n // useOverlay's stopPropagation.\n if (el.closest('[data-popover-dismiss]')) {\n setTimeout(() => state.close(), 0);\n return false;\n }\n return true;\n }\n // Clicking our own trigger again should dismiss us.\n const ownTrigger = targetRef?.current ?? triggerRef.current;\n if (popoverTriggerEl === ownTrigger || ownTrigger?.contains(el))\n return true;\n // Another popover's trigger: let the click through so it can open.\n return false;\n },\n );\n\n let overlay = (\n <Popover\n ref={overlayRef}\n styles={styles}\n hideOnClose={hideOnClose}\n isOpen={state.isOpen}\n style={popoverProps.style}\n placement={placement}\n arrowProps={arrowProps}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n hideArrow={hideArrow}\n shouldCloseOnInteractOutside={resolveShouldCloseOnInteractOutside}\n onClose={onClose}\n >\n {typeof content === 'function' ? content(state.close) : content}\n </Popover>\n );\n\n return (\n <DialogTriggerBase\n type=\"popover\"\n state={state}\n triggerProps={triggerPropsWithRef}\n dialogProps={overlayProps}\n trigger={trigger}\n overlay={overlay}\n overlayRef={overlayRef}\n shouldRestoreFocus={shouldRestoreFocus}\n onClose={onClose}\n />\n );\n}\n\nfunction DialogTriggerBase(props: any) {\n const ref = useCombinedRefs<HTMLElement>(props.ref);\n const wasOpenRef = useRef(false);\n const overlayRef: RefObject<HTMLElement | null> | undefined =\n props.overlayRef;\n\n // Mirror the press-responder DOM node into the parent's sync trigger ref.\n // Done via `useLayoutEffect` rather than threading through `useCombinedRefs`\n // for consistency with `PopoverTrigger` (see comment there) — keeps the\n // sync-ref population deterministic regardless of branch.\n useLayoutEffect(() => {\n if (props.syncTriggerRef) {\n props.syncTriggerRef.current = ref.current ?? null;\n }\n });\n\n let {\n type,\n state,\n onClose,\n isDismissable,\n dialogProps = {},\n triggerProps = {},\n overlay,\n trigger,\n shouldRestoreFocus = true,\n } = props;\n\n let context = {\n type,\n onClose,\n isDismissable,\n isOpen: state.isOpen,\n // Reaches `Dialog`'s `FocusScope`, which owns the restore for\n // popover-type dialogs. `useDialog` filters it out of the DOM props.\n shouldRestoreFocus,\n ...dialogProps,\n };\n\n // Whether focus has been claimed by something outside the closing dialog —\n // the signal that an action handed focus off and the trigger must not take\n // it back. Same rule as `MenuTrigger` (see CUB-3962): an action that opens\n // a panel, another dialog or an inline editor focuses that surface, and\n // restoring here would undo the hand-off.\n //\n // Focus still inside the overlay means nobody claimed it (the pressed\n // control keeps focus while the overlay plays its ~350ms exit animation),\n // and focus on `<body>` or on a detached node means the focused element\n // went away with the dialog. Both belong back on the trigger.\n const hasFocusMovedOutsideDialog = useEvent(() => {\n const activeElement = document.activeElement;\n\n if (!activeElement || activeElement === document.body) return false;\n if (!activeElement.isConnected) return false;\n\n return !(\n overlayRef?.current?.contains(activeElement) ||\n ref.current?.contains(activeElement)\n );\n });\n\n // Restore focus manually when the dialog closes.\n //\n // Live for modal/tray/fullscreen/panel types only: in the popover branch\n // `triggerProps` carries its own `ref`, which overrides the `ref={ref}` on\n // `PressResponder` below, so `ref.current` stays null and this is a no-op.\n // Popovers get their restore from `Dialog`'s own `<FocusScope restoreFocus>`\n // instead, which already declines to restore when focus moved elsewhere.\n useEffect(() => {\n if (!state.isOpen && wasOpenRef.current) {\n wasOpenRef.current = false;\n if (!shouldRestoreFocus) return;\n if (hasFocusMovedOutsideDialog()) return;\n ref.current?.focus();\n } else if (state.isOpen) {\n wasOpenRef.current = true;\n }\n }, [state.isOpen, shouldRestoreFocus, hasFocusMovedOutsideDialog]);\n\n // Mark popover-type DialogTrigger children with `data-popover-trigger` so\n // `Button` / `ItemButton`'s default dismiss-on-press behaviour treats them\n // as popover triggers (skips the dismiss). Modal/tray/fullscreen children\n // intentionally stay UNMARKED — when a modal-type DialogTrigger lives\n // inside a popover footer, pressing it should dismiss the parent popover\n // (matching the \"modal takes over\" native UX).\n const triggerExtraProps =\n type === 'popover' ? { 'data-popover-trigger': '' } : {};\n\n return (\n <Fragment>\n <PressResponder\n ref={ref}\n {...triggerProps}\n {...triggerExtraProps}\n isPressed={\n state.isOpen &&\n type !== 'modal' &&\n type !== 'fullscreen' &&\n type !== 'fullscreenTakeover'\n }\n onPress={state.toggle}\n >\n {trigger}\n </PressResponder>\n <DialogContext.Provider value={context}>{overlay}</DialogContext.Provider>\n </Fragment>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAsGA,SAAgB,cAAc,OAA+B;CAC3D,IAAI,EACF,UACA,OAAO,SACP,aAAa,MACb,WACA,WACA,WACA,gBAAgB,MAChB,2BACA,QACA,iBAAiB,KACjB,aACA,8BACA,qBAAqB,MACrB,GAAG,kBACD;AAEJ,KAAI,CAAC,MAAM,QAAQ,SAAS,IAAI,SAAS,SAAS,EAChD,OAAM,IAAI,MAAM,6CAA6C;CAG/D,IAAI,CAAC,SAAS,WAAW;AAIzB,KADe,cAAc,eAAe,eAAe,KAAK,EAClD;AAEZ,MAAI,SAAS,WAAW,eAAe,QACrC,iBAAgB;AAGlB,SAAO;;CAGT,IAAI,QAAQ,uBAAuB,MAAM;AAEzC,KAAI,OAAO,YAAY,WACrB,WAAU,QAAQ,MAAM;CAG1B,IAAI,UAAU,OAAO,MAAM;CAC3B,IAAI,YAAY,OAAO,MAAM;CAC7B,IAAI,kBAAmB,UAAU,UAAU;CAC3C,IAAI,iBAAkB,UAAU,UAAU;AAE1C,SAAQ,UAAU,MAAM;CASxB,MAAM,eAAe,cAAc,kBAAkB,EAAE,EAAE,CAAC;CAC1D,MAAM,iBAAiB,OAA2B,KAAK;CACvD,MAAM,iBAAiB,OAA2B,KAAK;CAQvD,MAAM,oBAAoB,SAAS;AACnC,gBAAe;EACb,QAAQ;EACR,QAAQ,MAAM;EACd,eAAe,MAAM,OAAO;EAC5B,YAAY;EACZ,cAAc;EACd,2BAA2B;EAC3B,iBAAiB;EAClB,CAAC;AAEF,iBAAgB;AACd,eAAa;AACX,QACG,QAAQ,WAAW,UAAU,YAC9B,SAAS,aACT,SAAS,OAET,SAAQ,KACN,wLACD;;IAGJ,EAAE,CAAC;CAEN,SAAS,QAAQ,QAAQ;AACvB,MAAI,eAAe;AACjB,gBAAa,UAAU,OAAO;AAC9B,SAAM,OAAO;;;AAIjB,KAAI,SAAS,UACX,QACE,oBAAC;EACC,GAAI;EACS;EACN;EACC;EACG;EACF;EACA;EACkB;EAChB;EACmB;EACV;EACJ;EACA;EAChB,aAAa;EACJ;GACT;CAIN,IAAI,sBAAsB;AACxB,UAAQ,MAAR;GACE,KAAK;GACL,KAAK;GACL,KAAK;GACL,KAAK,QACH,QACE,oBAACA;IACC,KAAK;IACQ;IACb,QAAQ,MAAM;IACC;IACT;IACqB;IACnB;IACsB;IACrB;IACE;IACD;cAET,OAAO,YAAY,aAAa,QAAQ,MAAM,MAAM,GAAG;KAClD;GAEZ,KAAK,OACH,QACE,oBAACC;IACC,KAAK;IACQ;IACb,QAAQ,MAAM;IACa;IACnB;IACC;cAER,OAAO,YAAY,aAAa,QAAQ,MAAM,MAAM,GAAG;KACnD;;;AAKf,QACE,oBAAC;EACO;EACC;EACQ;EACN;EACT,SAAS,eAAe;EACX;EACG;EAChB,YAAY;EACQ;EACX;GACT;;AAIN,SAAS,eAAe,UAAU;CAChC,IAAI,EACF,OACA,QACA,WACA,SACA,SACA,WACA,SACA,2BACA,aACA,8BACA,oBACA,kBACA,gBACA,gBACA,aACA,GAAG,UACD;CAEJ,IAAI,aAAa,OAA0B,KAAK;CAChD,IAAI,aAAa,OAAuB,KAAK;AAgB7C,yBAAsB;AACpB,MAAI,eACF,gBAAe,UAAU,WAAW,WAAW,WAAW,WAAW;AAEvE,MAAI,eACF,gBAAe,UAAU,WAAW,WAAW;GAEjD;CAEF,IAAI,EACF,cAAc,cACd,WACA,YACA,mBACE,mBAAmB;EACrB,WAAW,aAAa;EACZ;EACZ,WAAW,MAAM;EACjB,kBAAkB,MAAM;EACxB,QAAQ,MAAM,UAAU;EACxB,aAAa,MAAM;EACnB,YAAY,MAAM;EAClB,sBAAsB,MAAM;EAC5B,QAAQ,MAAM;EACf,CAAC;CAEF,IAAI,sBAAsB;AAE1B,KAAI,iBACF,uBAAsB;EAAE,GAAG;EAAO,OAAO;EAAgB;CAG3D,IAAI,EAAE,cAAc,iBAAiB,kBACnC,EAAE,MAAM,UAAU,EAClB,qBACA,WACD;CAED,IAAI,sBAAsB;EACxB,GAAG;EACH,KAAK,YAAY,SAAY;EAC9B;CAQD,MAAM,sCAAsC,UACzC,OAAyB;EACxB,MAAM,mBAAmB,GAAG,QAAQ,yBAAyB;AAC7D,MAAI,CAAC,kBAAkB;AAYrB,OAAI,gCAAgC,CAAC,6BAA6B,GAAG,CACnE,QAAO;AAET,OAAI,GAAG,QAAQ,sBAAsB,CAAE,QAAO;AAK9C,OAAI,GAAG,QAAQ,yBAAyB,EAAE;AACxC,qBAAiB,MAAM,OAAO,EAAE,EAAE;AAClC,WAAO;;AAET,UAAO;;EAGT,MAAM,aAAa,WAAW,WAAW,WAAW;AACpD,MAAI,qBAAqB,cAAc,YAAY,SAAS,GAAG,CAC7D,QAAO;AAET,SAAO;GAEV;AAoBD,QACE,oBAAC;EACC,MAAK;EACE;EACP,cAAc;EACd,aAAa;EACJ;EACT,SAxBF,oBAACC;GACC,KAAK;GACG;GACK;GACb,QAAQ,MAAM;GACd,OAAO,aAAa;GACT;GACC;GACe;GAChB;GACX,8BAA8B;GACrB;aAER,OAAO,YAAY,aAAa,QAAQ,MAAM,MAAM,GAAG;IAChD;EAWI;EACQ;EACX;GACT;;AAIN,SAAS,kBAAkB,OAAY;CACrC,MAAM,MAAM,gBAA6B,MAAM,IAAI;CACnD,MAAM,aAAa,OAAO,MAAM;CAChC,MAAM,aACJ,MAAM;AAMR,yBAAsB;AACpB,MAAI,MAAM,eACR,OAAM,eAAe,UAAU,IAAI,WAAW;GAEhD;CAEF,IAAI,EACF,MACA,OACA,SACA,eACA,cAAc,EAAE,EAChB,eAAe,EAAE,EACjB,SACA,SACA,qBAAqB,SACnB;CAEJ,IAAI,UAAU;EACZ;EACA;EACA;EACA,QAAQ,MAAM;EAGd;EACA,GAAG;EACJ;CAYD,MAAM,6BAA6B,eAAe;EAChD,MAAM,gBAAgB,SAAS;AAE/B,MAAI,CAAC,iBAAiB,kBAAkB,SAAS,KAAM,QAAO;AAC9D,MAAI,CAAC,cAAc,YAAa,QAAO;AAEvC,SAAO,EACL,YAAY,SAAS,SAAS,cAAc,IAC5C,IAAI,SAAS,SAAS,cAAc;GAEtC;AASF,iBAAgB;AACd,MAAI,CAAC,MAAM,UAAU,WAAW,SAAS;AACvC,cAAW,UAAU;AACrB,OAAI,CAAC,mBAAoB;AACzB,OAAI,4BAA4B,CAAE;AAClC,OAAI,SAAS,OAAO;aACX,MAAM,OACf,YAAW,UAAU;IAEtB;EAAC,MAAM;EAAQ;EAAoB;EAA2B,CAAC;CAQlE,MAAM,oBACJ,SAAS,YAAY,EAAE,wBAAwB,IAAI,GAAG,EAAE;AAE1D,QACE,qBAAC,uBACC,oBAAC;EACM;EACL,GAAI;EACJ,GAAI;EACJ,WACE,MAAM,UACN,SAAS,WACT,SAAS,gBACT,SAAS;EAEX,SAAS,MAAM;YAEd;GACc,EACjB,oBAAC,cAAc;EAAS,OAAO;YAAU;GAAiC,IACjE"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { mergeProps } from "../../../utils/react/mergeProps.js";
|
|
3
3
|
import { useEvent } from "../../../_internal/hooks/use-event.js";
|
|
4
4
|
import { DialogContainer } from "./DialogContainer.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
|
|
3
3
|
import { _Overlay } from "./Overlay.js";
|
|
4
4
|
import { _Underlay } from "./Underlay.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { DisplayTransition } from "../../helpers/DisplayTransition/DisplayTransition.js";
|
|
3
3
|
import { Provider, useProviderProps } from "../../../provider.js";
|
|
4
4
|
import { OpenTransitionContext } from "./OpenTransitionContext.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
|
|
3
3
|
import { _Overlay } from "./Overlay.js";
|
|
4
4
|
import { tasty } from "@tenphi/tasty";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
|
|
2
2
|
import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
|
|
3
3
|
import { _Overlay } from "./Overlay.js";
|
|
4
4
|
import { _Underlay } from "./Underlay.js";
|