@vuu-ui/vuu-ui-controls 2.1.17 → 2.1.19-beta.1
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/package.json +13 -15
- package/types/calendar/useCalendar.d.ts +3 -3
- package/types/calendar/useSelection.d.ts +1 -1
- package/types/date-input/DateInput.d.ts +1 -1
- package/types/date-picker/DatePicker.d.ts +1 -1
- package/types/date-picker/DatePickerContext.d.ts +2 -2
- package/types/date-picker/DatePickerPanel.d.ts +1 -1
- package/types/instrument-picker/useTablePicker.d.ts +4 -4
- package/types/split-button/useSplitButton.d.ts +120 -120
- package/types/tabs-next/hooks/useOverflow.d.ts +1 -1
- package/types/tabstrip/Tab.d.ts +1 -1
- package/types/tabstrip/useTabstrip.d.ts +1 -1
- package/types/toolbar/useToolbar.d.ts +1 -1
- package/cjs/calendar/Calendar.css.js +0 -6
- package/cjs/calendar/Calendar.css.js.map +0 -1
- package/cjs/calendar/Calendar.js +0 -93
- package/cjs/calendar/Calendar.js.map +0 -1
- package/cjs/calendar/internal/CalendarCarousel.css.js +0 -6
- package/cjs/calendar/internal/CalendarCarousel.css.js.map +0 -1
- package/cjs/calendar/internal/CalendarCarousel.js +0 -75
- package/cjs/calendar/internal/CalendarCarousel.js.map +0 -1
- package/cjs/calendar/internal/CalendarContext.js +0 -19
- package/cjs/calendar/internal/CalendarContext.js.map +0 -1
- package/cjs/calendar/internal/CalendarDay.css.js +0 -6
- package/cjs/calendar/internal/CalendarDay.css.js.map +0 -1
- package/cjs/calendar/internal/CalendarDay.js +0 -86
- package/cjs/calendar/internal/CalendarDay.js.map +0 -1
- package/cjs/calendar/internal/CalendarMonth.css.js +0 -6
- package/cjs/calendar/internal/CalendarMonth.css.js.map +0 -1
- package/cjs/calendar/internal/CalendarMonth.js +0 -71
- package/cjs/calendar/internal/CalendarMonth.js.map +0 -1
- package/cjs/calendar/internal/CalendarNavigation.css.js +0 -6
- package/cjs/calendar/internal/CalendarNavigation.css.js.map +0 -1
- package/cjs/calendar/internal/CalendarNavigation.js +0 -236
- package/cjs/calendar/internal/CalendarNavigation.js.map +0 -1
- package/cjs/calendar/internal/CalendarWeekHeader.css.js +0 -6
- package/cjs/calendar/internal/CalendarWeekHeader.css.js.map +0 -1
- package/cjs/calendar/internal/CalendarWeekHeader.js +0 -43
- package/cjs/calendar/internal/CalendarWeekHeader.js.map +0 -1
- package/cjs/calendar/internal/useFocusManagement.js +0 -66
- package/cjs/calendar/internal/useFocusManagement.js.map +0 -1
- package/cjs/calendar/internal/utils.js +0 -64
- package/cjs/calendar/internal/utils.js.map +0 -1
- package/cjs/calendar/useCalendar.js +0 -163
- package/cjs/calendar/useCalendar.js.map +0 -1
- package/cjs/calendar/useCalendarDay.js +0 -80
- package/cjs/calendar/useCalendarDay.js.map +0 -1
- package/cjs/calendar/useSelection.js +0 -248
- package/cjs/calendar/useSelection.js.map +0 -1
- package/cjs/column-picker/ColumnPicker.css.js +0 -6
- package/cjs/column-picker/ColumnPicker.css.js.map +0 -1
- package/cjs/column-picker/ColumnPicker.js +0 -128
- package/cjs/column-picker/ColumnPicker.js.map +0 -1
- package/cjs/column-picker/ColumnSearch.css.js +0 -6
- package/cjs/column-picker/ColumnSearch.css.js.map +0 -1
- package/cjs/column-picker/ColumnSearch.js +0 -82
- package/cjs/column-picker/ColumnSearch.js.map +0 -1
- package/cjs/common-hooks/selectionTypes.js +0 -18
- package/cjs/common-hooks/selectionTypes.js.map +0 -1
- package/cjs/common-hooks/use-resize-observer.js +0 -123
- package/cjs/common-hooks/use-resize-observer.js.map +0 -1
- package/cjs/common-hooks/useControlled.js +0 -58
- package/cjs/common-hooks/useControlled.js.map +0 -1
- package/cjs/context-panel-provider/ContextPanelProvider.js +0 -99
- package/cjs/context-panel-provider/ContextPanelProvider.js.map +0 -1
- package/cjs/cycle-state-button/CycleStateButton.js +0 -50
- package/cjs/cycle-state-button/CycleStateButton.js.map +0 -1
- package/cjs/date-input/DateInput.css.js +0 -6
- package/cjs/date-input/DateInput.css.js.map +0 -1
- package/cjs/date-input/DateInput.js +0 -277
- package/cjs/date-input/DateInput.js.map +0 -1
- package/cjs/date-picker/DatePicker.js +0 -169
- package/cjs/date-picker/DatePicker.js.map +0 -1
- package/cjs/date-picker/DatePickerContext.js +0 -26
- package/cjs/date-picker/DatePickerContext.js.map +0 -1
- package/cjs/date-picker/DatePickerPanel.css.js +0 -6
- package/cjs/date-picker/DatePickerPanel.css.js.map +0 -1
- package/cjs/date-picker/DatePickerPanel.js +0 -146
- package/cjs/date-picker/DatePickerPanel.js.map +0 -1
- package/cjs/drag-drop/DragDropProvider.js +0 -145
- package/cjs/drag-drop/DragDropProvider.js.map +0 -1
- package/cjs/drag-drop/DragDropState.js +0 -36
- package/cjs/drag-drop/DragDropState.js.map +0 -1
- package/cjs/drag-drop/Draggable.css.js +0 -6
- package/cjs/drag-drop/Draggable.css.js.map +0 -1
- package/cjs/drag-drop/Draggable.js +0 -90
- package/cjs/drag-drop/Draggable.js.map +0 -1
- package/cjs/drag-drop/dragDropTypes.js +0 -8
- package/cjs/drag-drop/dragDropTypes.js.map +0 -1
- package/cjs/drag-drop/drop-target-utils.js +0 -245
- package/cjs/drag-drop/drop-target-utils.js.map +0 -1
- package/cjs/drag-drop/useAutoScroll.js +0 -71
- package/cjs/drag-drop/useAutoScroll.js.map +0 -1
- package/cjs/drag-drop/useDragDisplacers.js +0 -160
- package/cjs/drag-drop/useDragDisplacers.js.map +0 -1
- package/cjs/drag-drop/useDragDrop.js +0 -504
- package/cjs/drag-drop/useDragDrop.js.map +0 -1
- package/cjs/drag-drop/useDragDropCopy.js +0 -34
- package/cjs/drag-drop/useDragDropCopy.js.map +0 -1
- package/cjs/drag-drop/useDragDropIndicator.js +0 -251
- package/cjs/drag-drop/useDragDropIndicator.js.map +0 -1
- package/cjs/drag-drop/useDragDropNaturalMovement.js +0 -265
- package/cjs/drag-drop/useDragDropNaturalMovement.js.map +0 -1
- package/cjs/drag-drop/useDropIndicator.js +0 -27
- package/cjs/drag-drop/useDropIndicator.js.map +0 -1
- package/cjs/drag-drop/useGlobalDragDrop.js +0 -89
- package/cjs/drag-drop/useGlobalDragDrop.js.map +0 -1
- package/cjs/editable/useEditableText.js +0 -211
- package/cjs/editable/useEditableText.js.map +0 -1
- package/cjs/editable-label/EditableLabel.css.js +0 -6
- package/cjs/editable-label/EditableLabel.css.js.map +0 -1
- package/cjs/editable-label/EditableLabel.js +0 -143
- package/cjs/editable-label/EditableLabel.js.map +0 -1
- package/cjs/expando-input/ExpandoInput.css.js +0 -6
- package/cjs/expando-input/ExpandoInput.css.js.map +0 -1
- package/cjs/expando-input/ExpandoInput.js +0 -53
- package/cjs/expando-input/ExpandoInput.js.map +0 -1
- package/cjs/hover-overlay/HoverOverlay.js +0 -96
- package/cjs/hover-overlay/HoverOverlay.js.map +0 -1
- package/cjs/icon-button/Icon.css.js +0 -6
- package/cjs/icon-button/Icon.css.js.map +0 -1
- package/cjs/icon-button/Icon.js +0 -37
- package/cjs/icon-button/Icon.js.map +0 -1
- package/cjs/icon-button/IconButton.css.js +0 -6
- package/cjs/icon-button/IconButton.css.js.map +0 -1
- package/cjs/icon-button/IconButton.js +0 -26
- package/cjs/icon-button/IconButton.js.map +0 -1
- package/cjs/icon-button/ToggleIconButton.css.js +0 -6
- package/cjs/icon-button/ToggleIconButton.css.js.map +0 -1
- package/cjs/icon-button/ToggleIconButton.js +0 -39
- package/cjs/icon-button/ToggleIconButton.js.map +0 -1
- package/cjs/index.js +0 -170
- package/cjs/index.js.map +0 -1
- package/cjs/instrument-picker/TablePicker.css.js +0 -6
- package/cjs/instrument-picker/TablePicker.css.js.map +0 -1
- package/cjs/instrument-picker/TablePicker.js +0 -130
- package/cjs/instrument-picker/TablePicker.js.map +0 -1
- package/cjs/instrument-picker/useTablePicker.js +0 -150
- package/cjs/instrument-picker/useTablePicker.js.map +0 -1
- package/cjs/measured-container/MeasuredContainer.css.js +0 -6
- package/cjs/measured-container/MeasuredContainer.css.js.map +0 -1
- package/cjs/measured-container/MeasuredContainer.js +0 -72
- package/cjs/measured-container/MeasuredContainer.js.map +0 -1
- package/cjs/measured-container/useMeasuredContainer.js +0 -167
- package/cjs/measured-container/useMeasuredContainer.js.map +0 -1
- package/cjs/modal-provider/ModalProvider.js +0 -143
- package/cjs/modal-provider/ModalProvider.js.map +0 -1
- package/cjs/overflow-container/OverflowContainer.css.js +0 -6
- package/cjs/overflow-container/OverflowContainer.css.js.map +0 -1
- package/cjs/overflow-container/OverflowContainer.js +0 -143
- package/cjs/overflow-container/OverflowContainer.js.map +0 -1
- package/cjs/overflow-container/overflow-utils.js +0 -286
- package/cjs/overflow-container/overflow-utils.js.map +0 -1
- package/cjs/overflow-container/useOverflowContainer.js +0 -143
- package/cjs/overflow-container/useOverflowContainer.js.map +0 -1
- package/cjs/price-ticker/PriceTicker.css.js +0 -6
- package/cjs/price-ticker/PriceTicker.css.js.map +0 -1
- package/cjs/price-ticker/PriceTicker.js +0 -50
- package/cjs/price-ticker/PriceTicker.js.map +0 -1
- package/cjs/prompt/Prompt.css.js +0 -6
- package/cjs/prompt/Prompt.css.js.map +0 -1
- package/cjs/prompt/Prompt.js +0 -142
- package/cjs/prompt/Prompt.js.map +0 -1
- package/cjs/sortable-list/SortableList.js +0 -37
- package/cjs/sortable-list/SortableList.js.map +0 -1
- package/cjs/split-button/SplitButton.css.js +0 -6
- package/cjs/split-button/SplitButton.css.js.map +0 -1
- package/cjs/split-button/SplitButton.js +0 -84
- package/cjs/split-button/SplitButton.js.map +0 -1
- package/cjs/split-button/SplitStateButton.css.js +0 -6
- package/cjs/split-button/SplitStateButton.css.js.map +0 -1
- package/cjs/split-button/SplitStateButton.js +0 -31
- package/cjs/split-button/SplitStateButton.js.map +0 -1
- package/cjs/split-button/useSplitButton.js +0 -84
- package/cjs/split-button/useSplitButton.js.map +0 -1
- package/cjs/table-search/SearchCell.css.js +0 -6
- package/cjs/table-search/SearchCell.css.js.map +0 -1
- package/cjs/table-search/SearchCell.js +0 -32
- package/cjs/table-search/SearchCell.js.map +0 -1
- package/cjs/table-search/TableSearch.css.js +0 -6
- package/cjs/table-search/TableSearch.css.js.map +0 -1
- package/cjs/table-search/TableSearch.js +0 -89
- package/cjs/table-search/TableSearch.js.map +0 -1
- package/cjs/table-search/useTableSearch.js +0 -39
- package/cjs/table-search/useTableSearch.js.map +0 -1
- package/cjs/tabs-next/TabBar.css.js +0 -6
- package/cjs/tabs-next/TabBar.css.js.map +0 -1
- package/cjs/tabs-next/TabBar.js +0 -41
- package/cjs/tabs-next/TabBar.js.map +0 -1
- package/cjs/tabs-next/TabListNext.css.js +0 -6
- package/cjs/tabs-next/TabListNext.css.js.map +0 -1
- package/cjs/tabs-next/TabListNext.js +0 -124
- package/cjs/tabs-next/TabListNext.js.map +0 -1
- package/cjs/tabs-next/TabNext.css.js +0 -6
- package/cjs/tabs-next/TabNext.css.js.map +0 -1
- package/cjs/tabs-next/TabNext.js +0 -110
- package/cjs/tabs-next/TabNext.js.map +0 -1
- package/cjs/tabs-next/TabNextAction.js +0 -35
- package/cjs/tabs-next/TabNextAction.js.map +0 -1
- package/cjs/tabs-next/TabNextContext.js +0 -23
- package/cjs/tabs-next/TabNextContext.js.map +0 -1
- package/cjs/tabs-next/TabNextPanel.css.js +0 -6
- package/cjs/tabs-next/TabNextPanel.css.js.map +0 -1
- package/cjs/tabs-next/TabNextPanel.js +0 -77
- package/cjs/tabs-next/TabNextPanel.js.map +0 -1
- package/cjs/tabs-next/TabNextTrigger.css.js +0 -6
- package/cjs/tabs-next/TabNextTrigger.css.js.map +0 -1
- package/cjs/tabs-next/TabNextTrigger.js +0 -74
- package/cjs/tabs-next/TabNextTrigger.js.map +0 -1
- package/cjs/tabs-next/TabOverflowList.css.js +0 -6
- package/cjs/tabs-next/TabOverflowList.css.js.map +0 -1
- package/cjs/tabs-next/TabOverflowList.js +0 -130
- package/cjs/tabs-next/TabOverflowList.js.map +0 -1
- package/cjs/tabs-next/TabsNext.js +0 -174
- package/cjs/tabs-next/TabsNext.js.map +0 -1
- package/cjs/tabs-next/TabsNextContext.js +0 -33
- package/cjs/tabs-next/TabsNextContext.js.map +0 -1
- package/cjs/tabs-next/hooks/useCollection.js +0 -91
- package/cjs/tabs-next/hooks/useCollection.js.map +0 -1
- package/cjs/tabs-next/hooks/useFocusOutside.js +0 -24
- package/cjs/tabs-next/hooks/useFocusOutside.js.map +0 -1
- package/cjs/tabs-next/hooks/useOverflow.js +0 -138
- package/cjs/tabs-next/hooks/useOverflow.js.map +0 -1
- package/cjs/tabstrip/Tab.css.js +0 -6
- package/cjs/tabstrip/Tab.css.js.map +0 -1
- package/cjs/tabstrip/Tab.js +0 -153
- package/cjs/tabstrip/Tab.js.map +0 -1
- package/cjs/tabstrip/TabMenu.css.js +0 -6
- package/cjs/tabstrip/TabMenu.css.js.map +0 -1
- package/cjs/tabstrip/TabMenu.js +0 -72
- package/cjs/tabstrip/TabMenu.js.map +0 -1
- package/cjs/tabstrip/TabMenuOptions.js +0 -20
- package/cjs/tabstrip/TabMenuOptions.js.map +0 -1
- package/cjs/tabstrip/Tabstrip.css.js +0 -6
- package/cjs/tabstrip/Tabstrip.css.js.map +0 -1
- package/cjs/tabstrip/Tabstrip.js +0 -160
- package/cjs/tabstrip/Tabstrip.js.map +0 -1
- package/cjs/tabstrip/tabstrip-dom-utils.js +0 -19
- package/cjs/tabstrip/tabstrip-dom-utils.js.map +0 -1
- package/cjs/tabstrip/useAnimatedSelectionThumb.js +0 -85
- package/cjs/tabstrip/useAnimatedSelectionThumb.js.map +0 -1
- package/cjs/tabstrip/useKeyboardNavigation.js +0 -247
- package/cjs/tabstrip/useKeyboardNavigation.js.map +0 -1
- package/cjs/tabstrip/useSelection.js +0 -60
- package/cjs/tabstrip/useSelection.js.map +0 -1
- package/cjs/tabstrip/useTabstrip.js +0 -233
- package/cjs/tabstrip/useTabstrip.js.map +0 -1
- package/cjs/time-input/MaskedInput.js +0 -377
- package/cjs/time-input/MaskedInput.js.map +0 -1
- package/cjs/time-input/TimeInput.css.js +0 -6
- package/cjs/time-input/TimeInput.css.js.map +0 -1
- package/cjs/time-input/TimeInput.js +0 -56
- package/cjs/time-input/TimeInput.js.map +0 -1
- package/cjs/time-input/useTimeInput.js +0 -121
- package/cjs/time-input/useTimeInput.js.map +0 -1
- package/cjs/toolbar/Toolbar.css.js +0 -6
- package/cjs/toolbar/Toolbar.css.js.map +0 -1
- package/cjs/toolbar/Toolbar.js +0 -90
- package/cjs/toolbar/Toolbar.js.map +0 -1
- package/cjs/toolbar/toolbar-dom-utils.js +0 -18
- package/cjs/toolbar/toolbar-dom-utils.js.map +0 -1
- package/cjs/toolbar/useKeyboardNavigation.js +0 -305
- package/cjs/toolbar/useKeyboardNavigation.js.map +0 -1
- package/cjs/toolbar/useSelection.js +0 -93
- package/cjs/toolbar/useSelection.js.map +0 -1
- package/cjs/toolbar/useToolbar.js +0 -100
- package/cjs/toolbar/useToolbar.js.map +0 -1
- package/cjs/utils/escapeRegExp.js +0 -9
- package/cjs/utils/escapeRegExp.js.map +0 -1
- package/cjs/utils/forwardCallbackProps.js +0 -22
- package/cjs/utils/forwardCallbackProps.js.map +0 -1
- package/cjs/utils/isOverflowElement.js +0 -8
- package/cjs/utils/isOverflowElement.js.map +0 -1
- package/cjs/utils/isPlainObject.js +0 -6
- package/cjs/utils/isPlainObject.js.map +0 -1
- package/cjs/vuu-date-picker/VuuDatePicker.js +0 -122
- package/cjs/vuu-date-picker/VuuDatePicker.js.map +0 -1
- package/cjs/vuu-input/VuuInput.css.js +0 -6
- package/cjs/vuu-input/VuuInput.css.js.map +0 -1
- package/cjs/vuu-input/VuuInput.js +0 -102
- package/cjs/vuu-input/VuuInput.js.map +0 -1
- package/cjs/vuu-time-picker/VuuTimePicker.css.js +0 -6
- package/cjs/vuu-time-picker/VuuTimePicker.css.js.map +0 -1
- package/cjs/vuu-time-picker/VuuTimePicker.js +0 -37
- package/cjs/vuu-time-picker/VuuTimePicker.js.map +0 -1
- package/cjs/vuu-typeahead-input/VuuTypeaheadInput.css.js +0 -6
- package/cjs/vuu-typeahead-input/VuuTypeaheadInput.css.js.map +0 -1
- package/cjs/vuu-typeahead-input/VuuTypeaheadInput.js +0 -80
- package/cjs/vuu-typeahead-input/VuuTypeaheadInput.js.map +0 -1
- package/cjs/vuu-typeahead-input/useVuuTypeaheadInput.js +0 -176
- package/cjs/vuu-typeahead-input/useVuuTypeaheadInput.js.map +0 -1
- package/esm/calendar/Calendar.css.js +0 -4
- package/esm/calendar/Calendar.css.js.map +0 -1
- package/esm/calendar/Calendar.js +0 -91
- package/esm/calendar/Calendar.js.map +0 -1
- package/esm/calendar/internal/CalendarCarousel.css.js +0 -4
- package/esm/calendar/internal/CalendarCarousel.css.js.map +0 -1
- package/esm/calendar/internal/CalendarCarousel.js +0 -73
- package/esm/calendar/internal/CalendarCarousel.js.map +0 -1
- package/esm/calendar/internal/CalendarContext.js +0 -16
- package/esm/calendar/internal/CalendarContext.js.map +0 -1
- package/esm/calendar/internal/CalendarDay.css.js +0 -4
- package/esm/calendar/internal/CalendarDay.css.js.map +0 -1
- package/esm/calendar/internal/CalendarDay.js +0 -84
- package/esm/calendar/internal/CalendarDay.js.map +0 -1
- package/esm/calendar/internal/CalendarMonth.css.js +0 -4
- package/esm/calendar/internal/CalendarMonth.css.js.map +0 -1
- package/esm/calendar/internal/CalendarMonth.js +0 -69
- package/esm/calendar/internal/CalendarMonth.js.map +0 -1
- package/esm/calendar/internal/CalendarNavigation.css.js +0 -4
- package/esm/calendar/internal/CalendarNavigation.css.js.map +0 -1
- package/esm/calendar/internal/CalendarNavigation.js +0 -234
- package/esm/calendar/internal/CalendarNavigation.js.map +0 -1
- package/esm/calendar/internal/CalendarWeekHeader.css.js +0 -4
- package/esm/calendar/internal/CalendarWeekHeader.css.js.map +0 -1
- package/esm/calendar/internal/CalendarWeekHeader.js +0 -41
- package/esm/calendar/internal/CalendarWeekHeader.js.map +0 -1
- package/esm/calendar/internal/useFocusManagement.js +0 -64
- package/esm/calendar/internal/useFocusManagement.js.map +0 -1
- package/esm/calendar/internal/utils.js +0 -55
- package/esm/calendar/internal/utils.js.map +0 -1
- package/esm/calendar/useCalendar.js +0 -161
- package/esm/calendar/useCalendar.js.map +0 -1
- package/esm/calendar/useCalendarDay.js +0 -78
- package/esm/calendar/useCalendarDay.js.map +0 -1
- package/esm/calendar/useSelection.js +0 -243
- package/esm/calendar/useSelection.js.map +0 -1
- package/esm/column-picker/ColumnPicker.css.js +0 -4
- package/esm/column-picker/ColumnPicker.css.js.map +0 -1
- package/esm/column-picker/ColumnPicker.js +0 -126
- package/esm/column-picker/ColumnPicker.js.map +0 -1
- package/esm/column-picker/ColumnSearch.css.js +0 -4
- package/esm/column-picker/ColumnSearch.css.js.map +0 -1
- package/esm/column-picker/ColumnSearch.js +0 -80
- package/esm/column-picker/ColumnSearch.js.map +0 -1
- package/esm/common-hooks/selectionTypes.js +0 -10
- package/esm/common-hooks/selectionTypes.js.map +0 -1
- package/esm/common-hooks/use-resize-observer.js +0 -118
- package/esm/common-hooks/use-resize-observer.js.map +0 -1
- package/esm/common-hooks/useControlled.js +0 -56
- package/esm/common-hooks/useControlled.js.map +0 -1
- package/esm/context-panel-provider/ContextPanelProvider.js +0 -94
- package/esm/context-panel-provider/ContextPanelProvider.js.map +0 -1
- package/esm/cycle-state-button/CycleStateButton.js +0 -48
- package/esm/cycle-state-button/CycleStateButton.js.map +0 -1
- package/esm/date-input/DateInput.css.js +0 -4
- package/esm/date-input/DateInput.css.js.map +0 -1
- package/esm/date-input/DateInput.js +0 -275
- package/esm/date-input/DateInput.js.map +0 -1
- package/esm/date-picker/DatePicker.js +0 -167
- package/esm/date-picker/DatePicker.js.map +0 -1
- package/esm/date-picker/DatePickerContext.js +0 -23
- package/esm/date-picker/DatePickerContext.js.map +0 -1
- package/esm/date-picker/DatePickerPanel.css.js +0 -4
- package/esm/date-picker/DatePickerPanel.css.js.map +0 -1
- package/esm/date-picker/DatePickerPanel.js +0 -144
- package/esm/date-picker/DatePickerPanel.js.map +0 -1
- package/esm/drag-drop/DragDropProvider.js +0 -142
- package/esm/drag-drop/DragDropProvider.js.map +0 -1
- package/esm/drag-drop/DragDropState.js +0 -34
- package/esm/drag-drop/DragDropState.js.map +0 -1
- package/esm/drag-drop/Draggable.css.js +0 -4
- package/esm/drag-drop/Draggable.css.js.map +0 -1
- package/esm/drag-drop/Draggable.js +0 -85
- package/esm/drag-drop/Draggable.js.map +0 -1
- package/esm/drag-drop/dragDropTypes.js +0 -5
- package/esm/drag-drop/dragDropTypes.js.map +0 -1
- package/esm/drag-drop/drop-target-utils.js +0 -228
- package/esm/drag-drop/drop-target-utils.js.map +0 -1
- package/esm/drag-drop/useAutoScroll.js +0 -69
- package/esm/drag-drop/useAutoScroll.js.map +0 -1
- package/esm/drag-drop/useDragDisplacers.js +0 -158
- package/esm/drag-drop/useDragDisplacers.js.map +0 -1
- package/esm/drag-drop/useDragDrop.js +0 -502
- package/esm/drag-drop/useDragDrop.js.map +0 -1
- package/esm/drag-drop/useDragDropCopy.js +0 -31
- package/esm/drag-drop/useDragDropCopy.js.map +0 -1
- package/esm/drag-drop/useDragDropIndicator.js +0 -249
- package/esm/drag-drop/useDragDropIndicator.js.map +0 -1
- package/esm/drag-drop/useDragDropNaturalMovement.js +0 -263
- package/esm/drag-drop/useDragDropNaturalMovement.js.map +0 -1
- package/esm/drag-drop/useDropIndicator.js +0 -25
- package/esm/drag-drop/useDropIndicator.js.map +0 -1
- package/esm/drag-drop/useGlobalDragDrop.js +0 -87
- package/esm/drag-drop/useGlobalDragDrop.js.map +0 -1
- package/esm/editable/useEditableText.js +0 -209
- package/esm/editable/useEditableText.js.map +0 -1
- package/esm/editable-label/EditableLabel.css.js +0 -4
- package/esm/editable-label/EditableLabel.css.js.map +0 -1
- package/esm/editable-label/EditableLabel.js +0 -140
- package/esm/editable-label/EditableLabel.js.map +0 -1
- package/esm/expando-input/ExpandoInput.css.js +0 -4
- package/esm/expando-input/ExpandoInput.css.js.map +0 -1
- package/esm/expando-input/ExpandoInput.js +0 -51
- package/esm/expando-input/ExpandoInput.js.map +0 -1
- package/esm/hover-overlay/HoverOverlay.js +0 -94
- package/esm/hover-overlay/HoverOverlay.js.map +0 -1
- package/esm/icon-button/Icon.css.js +0 -4
- package/esm/icon-button/Icon.css.js.map +0 -1
- package/esm/icon-button/Icon.js +0 -35
- package/esm/icon-button/Icon.js.map +0 -1
- package/esm/icon-button/IconButton.css.js +0 -4
- package/esm/icon-button/IconButton.css.js.map +0 -1
- package/esm/icon-button/IconButton.js +0 -24
- package/esm/icon-button/IconButton.js.map +0 -1
- package/esm/icon-button/ToggleIconButton.css.js +0 -4
- package/esm/icon-button/ToggleIconButton.css.js.map +0 -1
- package/esm/icon-button/ToggleIconButton.js +0 -37
- package/esm/icon-button/ToggleIconButton.js.map +0 -1
- package/esm/index.js +0 -59
- package/esm/index.js.map +0 -1
- package/esm/instrument-picker/TablePicker.css.js +0 -4
- package/esm/instrument-picker/TablePicker.css.js.map +0 -1
- package/esm/instrument-picker/TablePicker.js +0 -128
- package/esm/instrument-picker/TablePicker.js.map +0 -1
- package/esm/instrument-picker/useTablePicker.js +0 -148
- package/esm/instrument-picker/useTablePicker.js.map +0 -1
- package/esm/measured-container/MeasuredContainer.css.js +0 -4
- package/esm/measured-container/MeasuredContainer.css.js.map +0 -1
- package/esm/measured-container/MeasuredContainer.js +0 -70
- package/esm/measured-container/MeasuredContainer.js.map +0 -1
- package/esm/measured-container/useMeasuredContainer.js +0 -164
- package/esm/measured-container/useMeasuredContainer.js.map +0 -1
- package/esm/modal-provider/ModalProvider.js +0 -140
- package/esm/modal-provider/ModalProvider.js.map +0 -1
- package/esm/overflow-container/OverflowContainer.css.js +0 -4
- package/esm/overflow-container/OverflowContainer.css.js.map +0 -1
- package/esm/overflow-container/OverflowContainer.js +0 -141
- package/esm/overflow-container/OverflowContainer.js.map +0 -1
- package/esm/overflow-container/overflow-utils.js +0 -272
- package/esm/overflow-container/overflow-utils.js.map +0 -1
- package/esm/overflow-container/useOverflowContainer.js +0 -141
- package/esm/overflow-container/useOverflowContainer.js.map +0 -1
- package/esm/price-ticker/PriceTicker.css.js +0 -4
- package/esm/price-ticker/PriceTicker.css.js.map +0 -1
- package/esm/price-ticker/PriceTicker.js +0 -48
- package/esm/price-ticker/PriceTicker.js.map +0 -1
- package/esm/prompt/Prompt.css.js +0 -4
- package/esm/prompt/Prompt.css.js.map +0 -1
- package/esm/prompt/Prompt.js +0 -140
- package/esm/prompt/Prompt.js.map +0 -1
- package/esm/sortable-list/SortableList.js +0 -34
- package/esm/sortable-list/SortableList.js.map +0 -1
- package/esm/split-button/SplitButton.css.js +0 -4
- package/esm/split-button/SplitButton.css.js.map +0 -1
- package/esm/split-button/SplitButton.js +0 -82
- package/esm/split-button/SplitButton.js.map +0 -1
- package/esm/split-button/SplitStateButton.css.js +0 -4
- package/esm/split-button/SplitStateButton.css.js.map +0 -1
- package/esm/split-button/SplitStateButton.js +0 -29
- package/esm/split-button/SplitStateButton.js.map +0 -1
- package/esm/split-button/useSplitButton.js +0 -82
- package/esm/split-button/useSplitButton.js.map +0 -1
- package/esm/table-search/SearchCell.css.js +0 -4
- package/esm/table-search/SearchCell.css.js.map +0 -1
- package/esm/table-search/SearchCell.js +0 -30
- package/esm/table-search/SearchCell.js.map +0 -1
- package/esm/table-search/TableSearch.css.js +0 -4
- package/esm/table-search/TableSearch.css.js.map +0 -1
- package/esm/table-search/TableSearch.js +0 -87
- package/esm/table-search/TableSearch.js.map +0 -1
- package/esm/table-search/useTableSearch.js +0 -37
- package/esm/table-search/useTableSearch.js.map +0 -1
- package/esm/tabs-next/TabBar.css.js +0 -4
- package/esm/tabs-next/TabBar.css.js.map +0 -1
- package/esm/tabs-next/TabBar.js +0 -39
- package/esm/tabs-next/TabBar.js.map +0 -1
- package/esm/tabs-next/TabListNext.css.js +0 -4
- package/esm/tabs-next/TabListNext.css.js.map +0 -1
- package/esm/tabs-next/TabListNext.js +0 -122
- package/esm/tabs-next/TabListNext.js.map +0 -1
- package/esm/tabs-next/TabNext.css.js +0 -4
- package/esm/tabs-next/TabNext.css.js.map +0 -1
- package/esm/tabs-next/TabNext.js +0 -108
- package/esm/tabs-next/TabNext.js.map +0 -1
- package/esm/tabs-next/TabNextAction.js +0 -33
- package/esm/tabs-next/TabNextAction.js.map +0 -1
- package/esm/tabs-next/TabNextContext.js +0 -20
- package/esm/tabs-next/TabNextContext.js.map +0 -1
- package/esm/tabs-next/TabNextPanel.css.js +0 -4
- package/esm/tabs-next/TabNextPanel.css.js.map +0 -1
- package/esm/tabs-next/TabNextPanel.js +0 -75
- package/esm/tabs-next/TabNextPanel.js.map +0 -1
- package/esm/tabs-next/TabNextTrigger.css.js +0 -4
- package/esm/tabs-next/TabNextTrigger.css.js.map +0 -1
- package/esm/tabs-next/TabNextTrigger.js +0 -72
- package/esm/tabs-next/TabNextTrigger.js.map +0 -1
- package/esm/tabs-next/TabOverflowList.css.js +0 -4
- package/esm/tabs-next/TabOverflowList.css.js.map +0 -1
- package/esm/tabs-next/TabOverflowList.js +0 -128
- package/esm/tabs-next/TabOverflowList.js.map +0 -1
- package/esm/tabs-next/TabsNext.js +0 -172
- package/esm/tabs-next/TabsNext.js.map +0 -1
- package/esm/tabs-next/TabsNextContext.js +0 -30
- package/esm/tabs-next/TabsNextContext.js.map +0 -1
- package/esm/tabs-next/hooks/useCollection.js +0 -89
- package/esm/tabs-next/hooks/useCollection.js.map +0 -1
- package/esm/tabs-next/hooks/useFocusOutside.js +0 -22
- package/esm/tabs-next/hooks/useFocusOutside.js.map +0 -1
- package/esm/tabs-next/hooks/useOverflow.js +0 -136
- package/esm/tabs-next/hooks/useOverflow.js.map +0 -1
- package/esm/tabstrip/Tab.css.js +0 -4
- package/esm/tabstrip/Tab.css.js.map +0 -1
- package/esm/tabstrip/Tab.js +0 -151
- package/esm/tabstrip/Tab.js.map +0 -1
- package/esm/tabstrip/TabMenu.css.js +0 -4
- package/esm/tabstrip/TabMenu.css.js.map +0 -1
- package/esm/tabstrip/TabMenu.js +0 -70
- package/esm/tabstrip/TabMenu.js.map +0 -1
- package/esm/tabstrip/TabMenuOptions.js +0 -16
- package/esm/tabstrip/TabMenuOptions.js.map +0 -1
- package/esm/tabstrip/Tabstrip.css.js +0 -4
- package/esm/tabstrip/Tabstrip.css.js.map +0 -1
- package/esm/tabstrip/Tabstrip.js +0 -158
- package/esm/tabstrip/Tabstrip.js.map +0 -1
- package/esm/tabstrip/tabstrip-dom-utils.js +0 -16
- package/esm/tabstrip/tabstrip-dom-utils.js.map +0 -1
- package/esm/tabstrip/useAnimatedSelectionThumb.js +0 -83
- package/esm/tabstrip/useAnimatedSelectionThumb.js.map +0 -1
- package/esm/tabstrip/useKeyboardNavigation.js +0 -245
- package/esm/tabstrip/useKeyboardNavigation.js.map +0 -1
- package/esm/tabstrip/useSelection.js +0 -58
- package/esm/tabstrip/useSelection.js.map +0 -1
- package/esm/tabstrip/useTabstrip.js +0 -231
- package/esm/tabstrip/useTabstrip.js.map +0 -1
- package/esm/time-input/MaskedInput.js +0 -375
- package/esm/time-input/MaskedInput.js.map +0 -1
- package/esm/time-input/TimeInput.css.js +0 -4
- package/esm/time-input/TimeInput.css.js.map +0 -1
- package/esm/time-input/TimeInput.js +0 -54
- package/esm/time-input/TimeInput.js.map +0 -1
- package/esm/time-input/useTimeInput.js +0 -119
- package/esm/time-input/useTimeInput.js.map +0 -1
- package/esm/toolbar/Toolbar.css.js +0 -4
- package/esm/toolbar/Toolbar.css.js.map +0 -1
- package/esm/toolbar/Toolbar.js +0 -88
- package/esm/toolbar/Toolbar.js.map +0 -1
- package/esm/toolbar/toolbar-dom-utils.js +0 -15
- package/esm/toolbar/toolbar-dom-utils.js.map +0 -1
- package/esm/toolbar/useKeyboardNavigation.js +0 -303
- package/esm/toolbar/useKeyboardNavigation.js.map +0 -1
- package/esm/toolbar/useSelection.js +0 -91
- package/esm/toolbar/useSelection.js.map +0 -1
- package/esm/toolbar/useToolbar.js +0 -98
- package/esm/toolbar/useToolbar.js.map +0 -1
- package/esm/utils/escapeRegExp.js +0 -7
- package/esm/utils/escapeRegExp.js.map +0 -1
- package/esm/utils/forwardCallbackProps.js +0 -20
- package/esm/utils/forwardCallbackProps.js.map +0 -1
- package/esm/utils/isOverflowElement.js +0 -6
- package/esm/utils/isOverflowElement.js.map +0 -1
- package/esm/utils/isPlainObject.js +0 -4
- package/esm/utils/isPlainObject.js.map +0 -1
- package/esm/vuu-date-picker/VuuDatePicker.js +0 -120
- package/esm/vuu-date-picker/VuuDatePicker.js.map +0 -1
- package/esm/vuu-input/VuuInput.css.js +0 -4
- package/esm/vuu-input/VuuInput.css.js.map +0 -1
- package/esm/vuu-input/VuuInput.js +0 -100
- package/esm/vuu-input/VuuInput.js.map +0 -1
- package/esm/vuu-time-picker/VuuTimePicker.css.js +0 -4
- package/esm/vuu-time-picker/VuuTimePicker.css.js.map +0 -1
- package/esm/vuu-time-picker/VuuTimePicker.js +0 -35
- package/esm/vuu-time-picker/VuuTimePicker.js.map +0 -1
- package/esm/vuu-typeahead-input/VuuTypeaheadInput.css.js +0 -4
- package/esm/vuu-typeahead-input/VuuTypeaheadInput.css.js.map +0 -1
- package/esm/vuu-typeahead-input/VuuTypeaheadInput.js +0 -78
- package/esm/vuu-typeahead-input/VuuTypeaheadInput.js.map +0 -1
- package/esm/vuu-typeahead-input/useVuuTypeaheadInput.js +0 -174
- package/esm/vuu-typeahead-input/useVuuTypeaheadInput.js.map +0 -1
|
@@ -1,272 +0,0 @@
|
|
|
1
|
-
import { getElementByDataIndex } from '@vuu-ui/vuu-utils';
|
|
2
|
-
|
|
3
|
-
const NON_WRAPPED_ITEM = ".vuuOverflowContainer-item:not(.wrapped)";
|
|
4
|
-
const sortByScreenOrder = (elements) => elements.sort((e1, e2) => {
|
|
5
|
-
const {
|
|
6
|
-
dataset: { index: idx1 = "?" }
|
|
7
|
-
} = e1;
|
|
8
|
-
const {
|
|
9
|
-
dataset: { index: idx2 = "?" }
|
|
10
|
-
} = e2;
|
|
11
|
-
const isOverflowed1 = e1.classList.contains("wrapped");
|
|
12
|
-
const isOverflowed2 = e2.classList.contains("wrapped");
|
|
13
|
-
const isOverflowedIndicator1 = idx1 === "overflow";
|
|
14
|
-
const isOverflowedIndicator2 = idx2 === "overflow";
|
|
15
|
-
if (isOverflowed1 && !isOverflowed2) {
|
|
16
|
-
return 1;
|
|
17
|
-
} else if (!isOverflowed1 && isOverflowed2) {
|
|
18
|
-
return -1;
|
|
19
|
-
}
|
|
20
|
-
if (isOverflowedIndicator1) {
|
|
21
|
-
return 1;
|
|
22
|
-
} else if (isOverflowedIndicator2) {
|
|
23
|
-
return -1;
|
|
24
|
-
}
|
|
25
|
-
return parseInt(idx1) > parseInt(idx2) ? 1 : -1;
|
|
26
|
-
});
|
|
27
|
-
const NO_WRAPPED_ITEMS = [];
|
|
28
|
-
const getNonWrappedAndWrappedItems = (container, orientation) => {
|
|
29
|
-
const nonWrappedItems = [];
|
|
30
|
-
const wrappedItems = [];
|
|
31
|
-
let currentPosition = -1;
|
|
32
|
-
let overflowed = false;
|
|
33
|
-
const sortedChildren = sortByScreenOrder(
|
|
34
|
-
Array.from(container.children)
|
|
35
|
-
);
|
|
36
|
-
const positionAttribute = orientation === "vertical" ? "top" : "left";
|
|
37
|
-
for (const child of sortedChildren) {
|
|
38
|
-
const element = child;
|
|
39
|
-
const {
|
|
40
|
-
dataset: { index = "?", label = "?", overflowPriority = "0" }
|
|
41
|
-
} = element;
|
|
42
|
-
const { [positionAttribute]: position } = element.getBoundingClientRect();
|
|
43
|
-
if (position <= currentPosition) {
|
|
44
|
-
if (index === "overflow") {
|
|
45
|
-
wrappedItems.push(nonWrappedItems.pop());
|
|
46
|
-
} else {
|
|
47
|
-
wrappedItems.push({ index, label, overflowPriority });
|
|
48
|
-
}
|
|
49
|
-
overflowed = true;
|
|
50
|
-
} else if (overflowed) {
|
|
51
|
-
wrappedItems.push({ index, label, overflowPriority });
|
|
52
|
-
} else {
|
|
53
|
-
nonWrappedItems.push({ index, label, overflowPriority });
|
|
54
|
-
}
|
|
55
|
-
currentPosition = position;
|
|
56
|
-
}
|
|
57
|
-
return [nonWrappedItems, wrappedItems];
|
|
58
|
-
};
|
|
59
|
-
const applyOverflowClassToWrappedItems = (container, overflowedItems, classBase) => {
|
|
60
|
-
let ignoreOverflow = false;
|
|
61
|
-
const className = classBase ? `${classBase}-overflowed` : "overflow";
|
|
62
|
-
if (overflowedItems.find(({ index }) => index === "overflow")) {
|
|
63
|
-
if (overflowedItems.length === 1) {
|
|
64
|
-
ignoreOverflow = true;
|
|
65
|
-
}
|
|
66
|
-
}
|
|
67
|
-
for (const element of container.children) {
|
|
68
|
-
const {
|
|
69
|
-
dataset: { index = "?" }
|
|
70
|
-
} = element;
|
|
71
|
-
if (overflowedItems.length === 0 || ignoreOverflow) {
|
|
72
|
-
container.classList.remove(className);
|
|
73
|
-
} else {
|
|
74
|
-
container.classList.add(className);
|
|
75
|
-
}
|
|
76
|
-
if (index !== "overflow" && overflowedItems.find((item) => item.index === index)) {
|
|
77
|
-
element.classList.add("wrapped");
|
|
78
|
-
} else {
|
|
79
|
-
element.classList.remove("wrapped");
|
|
80
|
-
}
|
|
81
|
-
}
|
|
82
|
-
};
|
|
83
|
-
const maxPriority = (priority, { overflowPriority }) => Math.max(priority, parseInt(overflowPriority));
|
|
84
|
-
const minPriority = (priority, { overflowPriority }) => Math.min(priority, parseInt(overflowPriority));
|
|
85
|
-
const overflowIndicatorHasWrappedButShouldNotHave = (wrappedItems) => wrappedItems.length > 1 && wrappedItems.at(-1)?.index === "overflow";
|
|
86
|
-
const getHighestPriorityItem = (overflowItems) => {
|
|
87
|
-
let [highestPriorityItem] = overflowItems;
|
|
88
|
-
for (let i = 1; i < overflowItems.length; i++) {
|
|
89
|
-
const item = overflowItems[i];
|
|
90
|
-
if (parseInt(item.overflowPriority) > parseInt(highestPriorityItem.overflowPriority)) {
|
|
91
|
-
highestPriorityItem = item;
|
|
92
|
-
}
|
|
93
|
-
}
|
|
94
|
-
return highestPriorityItem;
|
|
95
|
-
};
|
|
96
|
-
const highPriorityItemsHaveWrappedButShouldNotHave = (nonWrappedItems, wrappedItems) => {
|
|
97
|
-
const minNonwrappedPriority = nonWrappedItems.reduce(
|
|
98
|
-
minPriority,
|
|
99
|
-
Number.MAX_SAFE_INTEGER
|
|
100
|
-
);
|
|
101
|
-
const maxwrappedPriority = wrappedItems.reduce(maxPriority, 0);
|
|
102
|
-
if (maxwrappedPriority > minNonwrappedPriority) {
|
|
103
|
-
return true;
|
|
104
|
-
} else {
|
|
105
|
-
return wrappedItems.length > 1 && wrappedItems.at(-1)?.index === "overflow";
|
|
106
|
-
}
|
|
107
|
-
};
|
|
108
|
-
const correctForWrappedOverflowIndicator = (container, overflowedItems, orientation) => new Promise((resolve) => {
|
|
109
|
-
requestAnimationFrame(() => {
|
|
110
|
-
const [, o2] = getNonWrappedAndWrappedItems(container, orientation);
|
|
111
|
-
const newlyOverflowed = getNewItems(overflowedItems, o2);
|
|
112
|
-
newlyOverflowed.forEach((item) => markElementAsWrapped(container, item));
|
|
113
|
-
resolve(o2);
|
|
114
|
-
});
|
|
115
|
-
});
|
|
116
|
-
const correctForWrappedHighPriorityItems = (container, nonWrapped, wrapped, orientation) => new Promise((resolve) => {
|
|
117
|
-
requestAnimationFrame(() => {
|
|
118
|
-
const [, o2] = getNonWrappedAndWrappedItems(container, orientation);
|
|
119
|
-
const highPriorityWrappedItem = getHighestPriorityItem(o2);
|
|
120
|
-
if (highPriorityWrappedItem) {
|
|
121
|
-
const [nonWrappedItems, wrappedItems] = switchWrappedItemIntoView(
|
|
122
|
-
container,
|
|
123
|
-
highPriorityWrappedItem,
|
|
124
|
-
orientation
|
|
125
|
-
);
|
|
126
|
-
resolve([nonWrappedItems, wrappedItems]);
|
|
127
|
-
} else {
|
|
128
|
-
resolve([nonWrapped, wrapped]);
|
|
129
|
-
}
|
|
130
|
-
});
|
|
131
|
-
});
|
|
132
|
-
const markElementAsWrapped = (container, item) => {
|
|
133
|
-
const el = getElementByDataIndex(container, item.index);
|
|
134
|
-
if (el) {
|
|
135
|
-
el.classList.add("wrapped");
|
|
136
|
-
} else {
|
|
137
|
-
throw Error(
|
|
138
|
-
`markElementAsWrapped element item with index ${item.index} not found`
|
|
139
|
-
);
|
|
140
|
-
}
|
|
141
|
-
};
|
|
142
|
-
const getElementsMarkedAsWrapped = (container) => Array.from(container.querySelectorAll(".wrapped"));
|
|
143
|
-
const getNewItems = (items1, items2) => {
|
|
144
|
-
const newItems = [];
|
|
145
|
-
for (const item of items2) {
|
|
146
|
-
if (!items1.find(({ index }) => index === item.index)) {
|
|
147
|
-
newItems.push(item);
|
|
148
|
-
}
|
|
149
|
-
}
|
|
150
|
-
return newItems;
|
|
151
|
-
};
|
|
152
|
-
const unmarkItemsWhichAreNoLongerWrapped = (container, wrappedItems) => {
|
|
153
|
-
const elementssMarkedAsWrapped = getElementsMarkedAsWrapped(container);
|
|
154
|
-
elementssMarkedAsWrapped.forEach((el) => {
|
|
155
|
-
const {
|
|
156
|
-
dataset: { index = "?" }
|
|
157
|
-
} = el;
|
|
158
|
-
if (!wrappedItems.find((i) => i.index === index)) {
|
|
159
|
-
el.classList.remove("wrapped");
|
|
160
|
-
}
|
|
161
|
-
});
|
|
162
|
-
};
|
|
163
|
-
const getOverflowIndicator = (container) => container.querySelector('[data-index="overflow"]');
|
|
164
|
-
const getOverflowedItem = (container) => container.querySelector(".wrapped");
|
|
165
|
-
const getElementSize = (el, sizeProperty) => {
|
|
166
|
-
const size = parseInt(getComputedStyle(el).getPropertyValue(sizeProperty));
|
|
167
|
-
const margin = sizeProperty === "width" ? parseInt(getComputedStyle(el).getPropertyValue("margin-left")) + parseInt(getComputedStyle(el).getPropertyValue("margin-right")) : parseInt(getComputedStyle(el).getPropertyValue("margin-top")) + parseInt(getComputedStyle(el).getPropertyValue("margin-bottom"));
|
|
168
|
-
return size + margin;
|
|
169
|
-
};
|
|
170
|
-
const getAvailableSpace = (container, overflowIndicator, orientation) => {
|
|
171
|
-
if (orientation === "horizontal") {
|
|
172
|
-
const { right: containerRight } = container.getBoundingClientRect();
|
|
173
|
-
const paddingRight = parseInt(
|
|
174
|
-
getComputedStyle(container).getPropertyValue("padding-right")
|
|
175
|
-
);
|
|
176
|
-
const { right: indicatorRight } = overflowIndicator.getBoundingClientRect();
|
|
177
|
-
return containerRight - paddingRight - indicatorRight;
|
|
178
|
-
} else {
|
|
179
|
-
const { bottom: containerBottom } = container.getBoundingClientRect();
|
|
180
|
-
const paddingBottom = parseInt(
|
|
181
|
-
getComputedStyle(container).getPropertyValue("padding-bottom")
|
|
182
|
-
);
|
|
183
|
-
const { bottom: indicatorBottom } = overflowIndicator.getBoundingClientRect();
|
|
184
|
-
return containerBottom - paddingBottom - indicatorBottom;
|
|
185
|
-
}
|
|
186
|
-
};
|
|
187
|
-
const removeOverflowIndicatorIfNoLongerNeeded = (container, orientation) => {
|
|
188
|
-
const sizeProperty = orientation === "horizontal" ? "width" : "height";
|
|
189
|
-
const overflowIndicator = getOverflowIndicator(container);
|
|
190
|
-
const availableSpace = getAvailableSpace(
|
|
191
|
-
container,
|
|
192
|
-
overflowIndicator,
|
|
193
|
-
orientation
|
|
194
|
-
);
|
|
195
|
-
const indicatorWidth = getElementSize(overflowIndicator, sizeProperty);
|
|
196
|
-
const overflowedItem = getOverflowedItem(container);
|
|
197
|
-
const overflowWidth = getElementSize(overflowedItem, sizeProperty);
|
|
198
|
-
if (overflowWidth <= availableSpace + indicatorWidth) {
|
|
199
|
-
container.classList.remove("vuuOverflowContainer-wrapContainer-overflowed");
|
|
200
|
-
overflowedItem.classList.remove("wrapped");
|
|
201
|
-
return true;
|
|
202
|
-
}
|
|
203
|
-
return false;
|
|
204
|
-
};
|
|
205
|
-
const byPriorityDescending = (h1, h2) => {
|
|
206
|
-
const {
|
|
207
|
-
dataset: { index: i1 = "0", overflowPriority: p1 = "0" }
|
|
208
|
-
} = h1;
|
|
209
|
-
const {
|
|
210
|
-
dataset: { index: i2 = "0", overflowPriority: p2 = "0" }
|
|
211
|
-
} = h2;
|
|
212
|
-
if (p1 > p2) {
|
|
213
|
-
return -1;
|
|
214
|
-
} else if (p1 < p2) {
|
|
215
|
-
return 1;
|
|
216
|
-
} else {
|
|
217
|
-
return parseInt(i1) - parseInt(i2);
|
|
218
|
-
}
|
|
219
|
-
};
|
|
220
|
-
const getNonwrappedItemsByPriority = (container) => Array.from(container.querySelectorAll(NON_WRAPPED_ITEM)).sort(
|
|
221
|
-
byPriorityDescending
|
|
222
|
-
);
|
|
223
|
-
const switchWrappedItemIntoView = (container, overflowItem, orientation) => {
|
|
224
|
-
const unwrappedItems = getNonwrappedItemsByPriority(container);
|
|
225
|
-
const targetElement = getElementByDataIndex(
|
|
226
|
-
container,
|
|
227
|
-
overflowItem.index,
|
|
228
|
-
true
|
|
229
|
-
);
|
|
230
|
-
let pos = -1;
|
|
231
|
-
let unwrappedItem = unwrappedItems.at(pos);
|
|
232
|
-
const sizeProperty = orientation === "horizontal" ? "width" : "height";
|
|
233
|
-
const itemWidth = getElementSize(unwrappedItem, sizeProperty);
|
|
234
|
-
const targetWidth = getElementSize(targetElement, sizeProperty);
|
|
235
|
-
const overflowIndicator = getOverflowIndicator(container);
|
|
236
|
-
let availableSpace = getAvailableSpace(container, overflowIndicator, orientation) + itemWidth;
|
|
237
|
-
if (availableSpace >= targetWidth) {
|
|
238
|
-
switchWrapOnElements(targetElement, unwrappedItem);
|
|
239
|
-
} else {
|
|
240
|
-
const { left: lastLeft } = unwrappedItem.getBoundingClientRect();
|
|
241
|
-
const baseAvailableSpace = availableSpace;
|
|
242
|
-
const wrapTargets = [unwrappedItem];
|
|
243
|
-
while (availableSpace < targetWidth) {
|
|
244
|
-
pos -= 1;
|
|
245
|
-
unwrappedItem = unwrappedItems.at(pos);
|
|
246
|
-
wrapTargets.push(unwrappedItem);
|
|
247
|
-
const { left: nextLeft } = unwrappedItem.getBoundingClientRect();
|
|
248
|
-
const extraSpace = lastLeft - nextLeft;
|
|
249
|
-
availableSpace = baseAvailableSpace + extraSpace;
|
|
250
|
-
}
|
|
251
|
-
targetElement?.classList.remove("wrapped");
|
|
252
|
-
wrapTargets.forEach((item) => {
|
|
253
|
-
item.classList.add("wrapped");
|
|
254
|
-
});
|
|
255
|
-
}
|
|
256
|
-
const [nonWrappedItems, wrappedItems] = getNonWrappedAndWrappedItems(
|
|
257
|
-
container,
|
|
258
|
-
orientation
|
|
259
|
-
);
|
|
260
|
-
unmarkItemsWhichAreNoLongerWrapped(container, wrappedItems);
|
|
261
|
-
return [nonWrappedItems, wrappedItems];
|
|
262
|
-
};
|
|
263
|
-
const switchWrapOnElements = (wrappedElement, nonWrappedElement) => {
|
|
264
|
-
if (!wrappedElement || !nonWrappedElement) {
|
|
265
|
-
throw Error("switchWrapOnElements, element undefined");
|
|
266
|
-
}
|
|
267
|
-
wrappedElement.classList.remove("wrapped");
|
|
268
|
-
nonWrappedElement.classList.add("wrapped");
|
|
269
|
-
};
|
|
270
|
-
|
|
271
|
-
export { NO_WRAPPED_ITEMS, applyOverflowClassToWrappedItems, correctForWrappedHighPriorityItems, correctForWrappedOverflowIndicator, getElementsMarkedAsWrapped, getNonWrappedAndWrappedItems, highPriorityItemsHaveWrappedButShouldNotHave, markElementAsWrapped, overflowIndicatorHasWrappedButShouldNotHave, removeOverflowIndicatorIfNoLongerNeeded, sortByScreenOrder, switchWrappedItemIntoView, unmarkItemsWhichAreNoLongerWrapped };
|
|
272
|
-
//# sourceMappingURL=overflow-utils.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"overflow-utils.js","sources":["../../../../packages/vuu-ui-controls/src/overflow-container/overflow-utils.ts"],"sourcesContent":["import { getElementByDataIndex, orientationType } from \"@vuu-ui/vuu-utils\";\n\nconst NON_WRAPPED_ITEM = \".vuuOverflowContainer-item:not(.wrapped)\";\n\nexport type OverflowItem = {\n index: string;\n label: string;\n overflowPriority: string;\n};\n\nexport const sortByScreenOrder = (elements: HTMLElement[]): HTMLElement[] =>\n elements.sort((e1, e2) => {\n const {\n dataset: { index: idx1 = \"?\" },\n } = e1;\n const {\n dataset: { index: idx2 = \"?\" },\n } = e2;\n const isOverflowed1 = e1.classList.contains(\"wrapped\");\n const isOverflowed2 = e2.classList.contains(\"wrapped\");\n const isOverflowedIndicator1 = idx1 === \"overflow\";\n const isOverflowedIndicator2 = idx2 === \"overflow\";\n if (isOverflowed1 && !isOverflowed2) {\n return 1;\n } else if (!isOverflowed1 && isOverflowed2) {\n return -1;\n }\n if (isOverflowedIndicator1) {\n return 1;\n } else if (isOverflowedIndicator2) {\n return -1;\n }\n return parseInt(idx1) > parseInt(idx2) ? 1 : -1;\n });\n\nexport const NO_WRAPPED_ITEMS: OverflowItem[] = [];\n\n/**\n Identify wrapped items by comparing position of each item. Any item\n not to the right of preceeding item has wrapped. Note: on-screen \n position of items does not necessarily match document position, due\n to use of css order. This is taken into account by sorting. \n TODO support Vertical orientation\n */\nexport const getNonWrappedAndWrappedItems = (\n container: HTMLElement,\n orientation: orientationType,\n): [OverflowItem[], OverflowItem[]] => {\n const nonWrappedItems: OverflowItem[] = [];\n const wrappedItems: OverflowItem[] = [];\n let currentPosition = -1;\n let overflowed = false;\n const sortedChildren = sortByScreenOrder(\n Array.from(container.children) as HTMLElement[],\n );\n const positionAttribute = orientation === \"vertical\" ? \"top\" : \"left\";\n for (const child of sortedChildren) {\n const element = child as HTMLElement;\n const {\n dataset: { index = \"?\", label = \"?\", overflowPriority = \"0\" },\n } = element;\n const { [positionAttribute]: position } = element.getBoundingClientRect();\n if (position <= currentPosition) {\n if (index === \"overflow\") {\n wrappedItems.push(nonWrappedItems.pop() as OverflowItem);\n } else {\n wrappedItems.push({ index, label, overflowPriority });\n }\n overflowed = true;\n } else if (overflowed) {\n wrappedItems.push({ index, label, overflowPriority });\n } else {\n nonWrappedItems.push({ index, label, overflowPriority });\n }\n currentPosition = position;\n }\n return [nonWrappedItems, wrappedItems];\n};\n\nexport const applyOverflowClassToWrappedItems = (\n container: HTMLElement,\n overflowedItems: OverflowItem[],\n classBase?: string,\n) => {\n let ignoreOverflow = false;\n const className = classBase ? `${classBase}-overflowed` : \"overflow\";\n if (overflowedItems.find(({ index }) => index === \"overflow\")) {\n if (overflowedItems.length === 1) {\n ignoreOverflow = true;\n }\n }\n for (const element of container.children) {\n const {\n dataset: { index = \"?\" },\n } = element as HTMLElement;\n if (overflowedItems.length === 0 || ignoreOverflow) {\n container.classList.remove(className);\n } else {\n container.classList.add(className);\n }\n if (\n index !== \"overflow\" &&\n overflowedItems.find((item) => item.index === index)\n ) {\n element.classList.add(\"wrapped\");\n } else {\n element.classList.remove(\"wrapped\");\n }\n }\n};\n\nconst maxPriority = (priority: number, { overflowPriority }: OverflowItem) =>\n Math.max(priority, parseInt(overflowPriority));\n\nconst minPriority = (priority: number, { overflowPriority }: OverflowItem) =>\n Math.min(priority, parseInt(overflowPriority));\n\nexport const overflowIndicatorHasWrappedButShouldNotHave = (\n wrappedItems: OverflowItem[],\n) => wrappedItems.length > 1 && wrappedItems.at(-1)?.index === \"overflow\";\n\nconst getHighestPriorityItem = (overflowItems: OverflowItem[]) => {\n let [highestPriorityItem] = overflowItems;\n for (let i = 1; i < overflowItems.length; i++) {\n const item = overflowItems[i];\n if (\n parseInt(item.overflowPriority) >\n parseInt(highestPriorityItem.overflowPriority)\n ) {\n highestPriorityItem = item;\n }\n }\n return highestPriorityItem;\n};\n\nexport const highPriorityItemsHaveWrappedButShouldNotHave = (\n nonWrappedItems: OverflowItem[],\n wrappedItems: OverflowItem[],\n) => {\n const minNonwrappedPriority = nonWrappedItems.reduce<number>(\n minPriority,\n Number.MAX_SAFE_INTEGER,\n );\n const maxwrappedPriority = wrappedItems.reduce<number>(maxPriority, 0);\n if (maxwrappedPriority > minNonwrappedPriority) {\n return true;\n } else {\n return wrappedItems.length > 1 && wrappedItems.at(-1)?.index === \"overflow\";\n }\n};\n\n/** \n An edge case that may occur when reducing width from unwrapped to\n wrapped, or on first render.\n We overflow one or more items. Then, when the overflowIndicator assumes\n full width, it may itself overflow.\n*/\nexport const correctForWrappedOverflowIndicator = (\n container: HTMLElement,\n overflowedItems: OverflowItem[],\n orientation: orientationType,\n): Promise<OverflowItem[]> =>\n new Promise((resolve) => {\n requestAnimationFrame(() => {\n const [, o2] = getNonWrappedAndWrappedItems(container, orientation);\n const newlyOverflowed = getNewItems(overflowedItems, o2);\n newlyOverflowed.forEach((item) => markElementAsWrapped(container, item));\n resolve(o2);\n });\n });\n\n/** \n An edge case that may occur when reducing width from unwrapped to\n wrapped, or on first render.\n We overflow one or more items. Then, when the overflowIndicator assumes\n full width, it may itself overflow.\n*/\nexport const correctForWrappedHighPriorityItems = (\n container: HTMLElement,\n nonWrapped: OverflowItem[],\n wrapped: OverflowItem[],\n orientation: orientationType,\n): Promise<[OverflowItem[], OverflowItem[]]> =>\n new Promise((resolve) => {\n requestAnimationFrame(() => {\n const [, o2] = getNonWrappedAndWrappedItems(container, orientation);\n const highPriorityWrappedItem = getHighestPriorityItem(o2);\n if (highPriorityWrappedItem) {\n const [nonWrappedItems, wrappedItems] = switchWrappedItemIntoView(\n container,\n highPriorityWrappedItem,\n orientation,\n );\n resolve([nonWrappedItems, wrappedItems]);\n } else {\n resolve([nonWrapped, wrapped]);\n }\n });\n });\n\nexport const markElementAsWrapped = (\n container: HTMLElement,\n item: OverflowItem,\n) => {\n const el = getElementByDataIndex(container, item.index);\n if (el) {\n el.classList.add(\"wrapped\");\n } else {\n throw Error(\n `markElementAsWrapped element item with index ${item.index} not found`,\n );\n }\n};\n\nexport const getElementsMarkedAsWrapped = (container: HTMLElement) =>\n Array.from(container.querySelectorAll(\".wrapped\")) as HTMLElement[];\n\nconst getNewItems = (items1: OverflowItem[], items2: OverflowItem[]) => {\n const newItems: OverflowItem[] = [];\n for (const item of items2) {\n if (!items1.find(({ index }) => index === item.index)) {\n newItems.push(item);\n }\n }\n return newItems;\n};\n\nexport const unmarkItemsWhichAreNoLongerWrapped = (\n container: HTMLElement,\n wrappedItems: OverflowItem[],\n) => {\n const elementssMarkedAsWrapped = getElementsMarkedAsWrapped(container);\n elementssMarkedAsWrapped.forEach((el) => {\n const {\n dataset: { index = \"?\" },\n } = el;\n if (!wrappedItems.find((i) => i.index === index)) {\n el.classList.remove(\"wrapped\");\n }\n });\n};\n\nconst getOverflowIndicator = (container: HTMLElement) =>\n container.querySelector('[data-index=\"overflow\"]') as HTMLElement;\nconst getOverflowedItem = (container: HTMLElement) =>\n container.querySelector(\".wrapped\") as HTMLElement;\nconst getElementSize = (el: HTMLElement, sizeProperty: \"width\" | \"height\") => {\n const size = parseInt(getComputedStyle(el).getPropertyValue(sizeProperty));\n const margin =\n sizeProperty === \"width\"\n ? parseInt(getComputedStyle(el).getPropertyValue(\"margin-left\")) +\n parseInt(getComputedStyle(el).getPropertyValue(\"margin-right\"))\n : parseInt(getComputedStyle(el).getPropertyValue(\"margin-top\")) +\n parseInt(getComputedStyle(el).getPropertyValue(\"margin-bottom\"));\n\n return size + margin;\n};\n\nconst getAvailableSpace = (\n container: HTMLElement,\n overflowIndicator: HTMLElement,\n orientation: orientationType,\n) => {\n if (orientation === \"horizontal\") {\n const { right: containerRight } = container.getBoundingClientRect();\n const paddingRight = parseInt(\n getComputedStyle(container).getPropertyValue(\"padding-right\"),\n );\n const { right: indicatorRight } = overflowIndicator.getBoundingClientRect();\n return containerRight - paddingRight - indicatorRight;\n } else {\n const { bottom: containerBottom } = container.getBoundingClientRect();\n const paddingBottom = parseInt(\n getComputedStyle(container).getPropertyValue(\"padding-bottom\"),\n );\n const { bottom: indicatorBottom } =\n overflowIndicator.getBoundingClientRect();\n return containerBottom - paddingBottom - indicatorBottom;\n }\n};\n\n/**\n An edge case. If container has grown but we still have one\n wrapped item - could the wrapped item return to the fold if the overflow\n indicaor were removed ?\n */\nexport const removeOverflowIndicatorIfNoLongerNeeded = (\n container: HTMLElement,\n orientation: orientationType,\n): boolean => {\n const sizeProperty = orientation === \"horizontal\" ? \"width\" : \"height\";\n const overflowIndicator = getOverflowIndicator(container);\n const availableSpace = getAvailableSpace(\n container,\n overflowIndicator,\n orientation,\n );\n const indicatorWidth = getElementSize(overflowIndicator, sizeProperty);\n const overflowedItem = getOverflowedItem(container);\n const overflowWidth = getElementSize(overflowedItem, sizeProperty);\n\n if (overflowWidth <= availableSpace + indicatorWidth) {\n container.classList.remove(\"vuuOverflowContainer-wrapContainer-overflowed\");\n overflowedItem.classList.remove(\"wrapped\");\n return true;\n }\n return false;\n};\n\nconst byPriorityDescending = (h1: Element, h2: Element) => {\n const {\n dataset: { index: i1 = \"0\", overflowPriority: p1 = \"0\" },\n } = h1 as HTMLElement;\n const {\n dataset: { index: i2 = \"0\", overflowPriority: p2 = \"0\" },\n } = h2 as HTMLElement;\n\n if (p1 > p2) {\n return -1;\n } else if (p1 < p2) {\n return 1;\n } else {\n return parseInt(i1) - parseInt(i2);\n }\n};\n\nconst getNonwrappedItemsByPriority = (container: HTMLElement) =>\n Array.from(container.querySelectorAll(NON_WRAPPED_ITEM)).sort(\n byPriorityDescending,\n ) as HTMLElement[];\n\n/**\n * This is used both when an overflow menu is used to select an overflowed item\n * and when a high priority item has overflowed, whilst lower priority items\n * remain in view.\n */\nexport const switchWrappedItemIntoView = (\n container: HTMLElement,\n overflowItem: OverflowItem,\n orientation: orientationType,\n): [OverflowItem[], OverflowItem[]] => {\n const unwrappedItems = getNonwrappedItemsByPriority(container);\n const targetElement = getElementByDataIndex(\n container,\n overflowItem.index,\n true,\n );\n let pos = -1;\n let unwrappedItem = unwrappedItems.at(pos) as HTMLElement;\n const sizeProperty = orientation === \"horizontal\" ? \"width\" : \"height\";\n const itemWidth = getElementSize(unwrappedItem, sizeProperty);\n const targetWidth = getElementSize(targetElement, sizeProperty);\n const overflowIndicator = getOverflowIndicator(container);\n let availableSpace =\n getAvailableSpace(container, overflowIndicator, orientation) + itemWidth;\n if (availableSpace >= targetWidth) {\n switchWrapOnElements(targetElement, unwrappedItem);\n } else {\n // we need to wrap multiple items to make space for the switched item\n const { left: lastLeft } = unwrappedItem.getBoundingClientRect();\n const baseAvailableSpace = availableSpace;\n const wrapTargets = [unwrappedItem];\n while (availableSpace < targetWidth) {\n pos -= 1;\n unwrappedItem = unwrappedItems.at(pos) as HTMLElement;\n wrapTargets.push(unwrappedItem);\n const { left: nextLeft } = unwrappedItem.getBoundingClientRect();\n const extraSpace = lastLeft - nextLeft;\n availableSpace = baseAvailableSpace + extraSpace;\n }\n\n targetElement?.classList.remove(\"wrapped\");\n wrapTargets.forEach((item) => {\n item.classList.add(\"wrapped\");\n });\n }\n const [nonWrappedItems, wrappedItems] = getNonWrappedAndWrappedItems(\n container,\n orientation,\n );\n unmarkItemsWhichAreNoLongerWrapped(container, wrappedItems);\n return [nonWrappedItems, wrappedItems];\n};\n\nconst switchWrapOnElements = (\n wrappedElement?: HTMLElement | null,\n nonWrappedElement?: HTMLElement,\n) => {\n if (!wrappedElement || !nonWrappedElement) {\n throw Error(\"switchWrapOnElements, element undefined\");\n }\n wrappedElement.classList.remove(\"wrapped\");\n nonWrappedElement.classList.add(\"wrapped\");\n};\n"],"names":[],"mappings":";;AAEA,MAAM,gBAAmB,GAAA,0CAAA;AAQlB,MAAM,oBAAoB,CAAC,QAAA,KAChC,SAAS,IAAK,CAAA,CAAC,IAAI,EAAO,KAAA;AACxB,EAAM,MAAA;AAAA,IACJ,OAAS,EAAA,EAAE,KAAO,EAAA,IAAA,GAAO,GAAI;AAAA,GAC3B,GAAA,EAAA;AACJ,EAAM,MAAA;AAAA,IACJ,OAAS,EAAA,EAAE,KAAO,EAAA,IAAA,GAAO,GAAI;AAAA,GAC3B,GAAA,EAAA;AACJ,EAAA,MAAM,aAAgB,GAAA,EAAA,CAAG,SAAU,CAAA,QAAA,CAAS,SAAS,CAAA;AACrD,EAAA,MAAM,aAAgB,GAAA,EAAA,CAAG,SAAU,CAAA,QAAA,CAAS,SAAS,CAAA;AACrD,EAAA,MAAM,yBAAyB,IAAS,KAAA,UAAA;AACxC,EAAA,MAAM,yBAAyB,IAAS,KAAA,UAAA;AACxC,EAAI,IAAA,aAAA,IAAiB,CAAC,aAAe,EAAA;AACnC,IAAO,OAAA,CAAA;AAAA,GACT,MAAA,IAAW,CAAC,aAAA,IAAiB,aAAe,EAAA;AAC1C,IAAO,OAAA,CAAA,CAAA;AAAA;AAET,EAAA,IAAI,sBAAwB,EAAA;AAC1B,IAAO,OAAA,CAAA;AAAA,aACE,sBAAwB,EAAA;AACjC,IAAO,OAAA,CAAA,CAAA;AAAA;AAET,EAAA,OAAO,SAAS,IAAI,CAAA,GAAI,QAAS,CAAA,IAAI,IAAI,CAAI,GAAA,CAAA,CAAA;AAC/C,CAAC;AAEI,MAAM,mBAAmC;AASnC,MAAA,4BAAA,GAA+B,CAC1C,SAAA,EACA,WACqC,KAAA;AACrC,EAAA,MAAM,kBAAkC,EAAC;AACzC,EAAA,MAAM,eAA+B,EAAC;AACtC,EAAA,IAAI,eAAkB,GAAA,CAAA,CAAA;AACtB,EAAA,IAAI,UAAa,GAAA,KAAA;AACjB,EAAA,MAAM,cAAiB,GAAA,iBAAA;AAAA,IACrB,KAAA,CAAM,IAAK,CAAA,SAAA,CAAU,QAAQ;AAAA,GAC/B;AACA,EAAM,MAAA,iBAAA,GAAoB,WAAgB,KAAA,UAAA,GAAa,KAAQ,GAAA,MAAA;AAC/D,EAAA,KAAA,MAAW,SAAS,cAAgB,EAAA;AAClC,IAAA,MAAM,OAAU,GAAA,KAAA;AAChB,IAAM,MAAA;AAAA,MACJ,SAAS,EAAE,KAAA,GAAQ,KAAK,KAAQ,GAAA,GAAA,EAAK,mBAAmB,GAAI;AAAA,KAC1D,GAAA,OAAA;AACJ,IAAA,MAAM,EAAE,CAAC,iBAAiB,GAAG,QAAS,EAAA,GAAI,QAAQ,qBAAsB,EAAA;AACxE,IAAA,IAAI,YAAY,eAAiB,EAAA;AAC/B,MAAA,IAAI,UAAU,UAAY,EAAA;AACxB,QAAa,YAAA,CAAA,IAAA,CAAK,eAAgB,CAAA,GAAA,EAAqB,CAAA;AAAA,OAClD,MAAA;AACL,QAAA,YAAA,CAAa,IAAK,CAAA,EAAE,KAAO,EAAA,KAAA,EAAO,kBAAkB,CAAA;AAAA;AAEtD,MAAa,UAAA,GAAA,IAAA;AAAA,eACJ,UAAY,EAAA;AACrB,MAAA,YAAA,CAAa,IAAK,CAAA,EAAE,KAAO,EAAA,KAAA,EAAO,kBAAkB,CAAA;AAAA,KAC/C,MAAA;AACL,MAAA,eAAA,CAAgB,IAAK,CAAA,EAAE,KAAO,EAAA,KAAA,EAAO,kBAAkB,CAAA;AAAA;AAEzD,IAAkB,eAAA,GAAA,QAAA;AAAA;AAEpB,EAAO,OAAA,CAAC,iBAAiB,YAAY,CAAA;AACvC;AAEO,MAAM,gCAAmC,GAAA,CAC9C,SACA,EAAA,eAAA,EACA,SACG,KAAA;AACH,EAAA,IAAI,cAAiB,GAAA,KAAA;AACrB,EAAA,MAAM,SAAY,GAAA,SAAA,GAAY,CAAG,EAAA,SAAS,CAAgB,WAAA,CAAA,GAAA,UAAA;AAC1D,EAAI,IAAA,eAAA,CAAgB,KAAK,CAAC,EAAE,OAAY,KAAA,KAAA,KAAU,UAAU,CAAG,EAAA;AAC7D,IAAI,IAAA,eAAA,CAAgB,WAAW,CAAG,EAAA;AAChC,MAAiB,cAAA,GAAA,IAAA;AAAA;AACnB;AAEF,EAAW,KAAA,MAAA,OAAA,IAAW,UAAU,QAAU,EAAA;AACxC,IAAM,MAAA;AAAA,MACJ,OAAA,EAAS,EAAE,KAAA,GAAQ,GAAI;AAAA,KACrB,GAAA,OAAA;AACJ,IAAI,IAAA,eAAA,CAAgB,MAAW,KAAA,CAAA,IAAK,cAAgB,EAAA;AAClD,MAAU,SAAA,CAAA,SAAA,CAAU,OAAO,SAAS,CAAA;AAAA,KAC/B,MAAA;AACL,MAAU,SAAA,CAAA,SAAA,CAAU,IAAI,SAAS,CAAA;AAAA;AAEnC,IACE,IAAA,KAAA,KAAU,cACV,eAAgB,CAAA,IAAA,CAAK,CAAC,IAAS,KAAA,IAAA,CAAK,KAAU,KAAA,KAAK,CACnD,EAAA;AACA,MAAQ,OAAA,CAAA,SAAA,CAAU,IAAI,SAAS,CAAA;AAAA,KAC1B,MAAA;AACL,MAAQ,OAAA,CAAA,SAAA,CAAU,OAAO,SAAS,CAAA;AAAA;AACpC;AAEJ;AAEA,MAAM,WAAA,GAAc,CAAC,QAAA,EAAkB,EAAE,gBAAA,EACvC,KAAA,IAAA,CAAK,GAAI,CAAA,QAAA,EAAU,QAAS,CAAA,gBAAgB,CAAC,CAAA;AAE/C,MAAM,WAAA,GAAc,CAAC,QAAA,EAAkB,EAAE,gBAAA,EACvC,KAAA,IAAA,CAAK,GAAI,CAAA,QAAA,EAAU,QAAS,CAAA,gBAAgB,CAAC,CAAA;AAElC,MAAA,2CAAA,GAA8C,CACzD,YAAA,KACG,YAAa,CAAA,MAAA,GAAS,KAAK,YAAa,CAAA,EAAA,CAAG,CAAE,CAAA,CAAA,EAAG,KAAU,KAAA;AAE/D,MAAM,sBAAA,GAAyB,CAAC,aAAkC,KAAA;AAChE,EAAI,IAAA,CAAC,mBAAmB,CAAI,GAAA,aAAA;AAC5B,EAAA,KAAA,IAAS,CAAI,GAAA,CAAA,EAAG,CAAI,GAAA,aAAA,CAAc,QAAQ,CAAK,EAAA,EAAA;AAC7C,IAAM,MAAA,IAAA,GAAO,cAAc,CAAC,CAAA;AAC5B,IAAA,IACE,SAAS,IAAK,CAAA,gBAAgB,IAC9B,QAAS,CAAA,mBAAA,CAAoB,gBAAgB,CAC7C,EAAA;AACA,MAAsB,mBAAA,GAAA,IAAA;AAAA;AACxB;AAEF,EAAO,OAAA,mBAAA;AACT,CAAA;AAEa,MAAA,4CAAA,GAA+C,CAC1D,eAAA,EACA,YACG,KAAA;AACH,EAAA,MAAM,wBAAwB,eAAgB,CAAA,MAAA;AAAA,IAC5C,WAAA;AAAA,IACA,MAAO,CAAA;AAAA,GACT;AACA,EAAA,MAAM,kBAAqB,GAAA,YAAA,CAAa,MAAe,CAAA,WAAA,EAAa,CAAC,CAAA;AACrE,EAAA,IAAI,qBAAqB,qBAAuB,EAAA;AAC9C,IAAO,OAAA,IAAA;AAAA,GACF,MAAA;AACL,IAAA,OAAO,aAAa,MAAS,GAAA,CAAA,IAAK,aAAa,EAAG,CAAA,CAAA,CAAE,GAAG,KAAU,KAAA,UAAA;AAAA;AAErE;AAQa,MAAA,kCAAA,GAAqC,CAChD,SACA,EAAA,eAAA,EACA,gBAEA,IAAI,OAAA,CAAQ,CAAC,OAAY,KAAA;AACvB,EAAA,qBAAA,CAAsB,MAAM;AAC1B,IAAA,MAAM,GAAG,EAAE,CAAI,GAAA,4BAAA,CAA6B,WAAW,WAAW,CAAA;AAClE,IAAM,MAAA,eAAA,GAAkB,WAAY,CAAA,eAAA,EAAiB,EAAE,CAAA;AACvD,IAAA,eAAA,CAAgB,QAAQ,CAAC,IAAA,KAAS,oBAAqB,CAAA,SAAA,EAAW,IAAI,CAAC,CAAA;AACvE,IAAA,OAAA,CAAQ,EAAE,CAAA;AAAA,GACX,CAAA;AACH,CAAC;AAQU,MAAA,kCAAA,GAAqC,CAChD,SACA,EAAA,UAAA,EACA,SACA,WAEA,KAAA,IAAI,OAAQ,CAAA,CAAC,OAAY,KAAA;AACvB,EAAA,qBAAA,CAAsB,MAAM;AAC1B,IAAA,MAAM,GAAG,EAAE,CAAI,GAAA,4BAAA,CAA6B,WAAW,WAAW,CAAA;AAClE,IAAM,MAAA,uBAAA,GAA0B,uBAAuB,EAAE,CAAA;AACzD,IAAA,IAAI,uBAAyB,EAAA;AAC3B,MAAM,MAAA,CAAC,eAAiB,EAAA,YAAY,CAAI,GAAA,yBAAA;AAAA,QACtC,SAAA;AAAA,QACA,uBAAA;AAAA,QACA;AAAA,OACF;AACA,MAAQ,OAAA,CAAA,CAAC,eAAiB,EAAA,YAAY,CAAC,CAAA;AAAA,KAClC,MAAA;AACL,MAAQ,OAAA,CAAA,CAAC,UAAY,EAAA,OAAO,CAAC,CAAA;AAAA;AAC/B,GACD,CAAA;AACH,CAAC;AAEU,MAAA,oBAAA,GAAuB,CAClC,SAAA,EACA,IACG,KAAA;AACH,EAAA,MAAM,EAAK,GAAA,qBAAA,CAAsB,SAAW,EAAA,IAAA,CAAK,KAAK,CAAA;AACtD,EAAA,IAAI,EAAI,EAAA;AACN,IAAG,EAAA,CAAA,SAAA,CAAU,IAAI,SAAS,CAAA;AAAA,GACrB,MAAA;AACL,IAAM,MAAA,KAAA;AAAA,MACJ,CAAA,6CAAA,EAAgD,KAAK,KAAK,CAAA,UAAA;AAAA,KAC5D;AAAA;AAEJ;AAEa,MAAA,0BAAA,GAA6B,CAAC,SACzC,KAAA,KAAA,CAAM,KAAK,SAAU,CAAA,gBAAA,CAAiB,UAAU,CAAC;AAEnD,MAAM,WAAA,GAAc,CAAC,MAAA,EAAwB,MAA2B,KAAA;AACtE,EAAA,MAAM,WAA2B,EAAC;AAClC,EAAA,KAAA,MAAW,QAAQ,MAAQ,EAAA;AACzB,IAAI,IAAA,CAAC,MAAO,CAAA,IAAA,CAAK,CAAC,EAAE,OAAY,KAAA,KAAA,KAAU,IAAK,CAAA,KAAK,CAAG,EAAA;AACrD,MAAA,QAAA,CAAS,KAAK,IAAI,CAAA;AAAA;AACpB;AAEF,EAAO,OAAA,QAAA;AACT,CAAA;AAEa,MAAA,kCAAA,GAAqC,CAChD,SAAA,EACA,YACG,KAAA;AACH,EAAM,MAAA,wBAAA,GAA2B,2BAA2B,SAAS,CAAA;AACrE,EAAyB,wBAAA,CAAA,OAAA,CAAQ,CAAC,EAAO,KAAA;AACvC,IAAM,MAAA;AAAA,MACJ,OAAA,EAAS,EAAE,KAAA,GAAQ,GAAI;AAAA,KACrB,GAAA,EAAA;AACJ,IAAI,IAAA,CAAC,aAAa,IAAK,CAAA,CAAC,MAAM,CAAE,CAAA,KAAA,KAAU,KAAK,CAAG,EAAA;AAChD,MAAG,EAAA,CAAA,SAAA,CAAU,OAAO,SAAS,CAAA;AAAA;AAC/B,GACD,CAAA;AACH;AAEA,MAAM,oBAAuB,GAAA,CAAC,SAC5B,KAAA,SAAA,CAAU,cAAc,yBAAyB,CAAA;AACnD,MAAM,iBAAoB,GAAA,CAAC,SACzB,KAAA,SAAA,CAAU,cAAc,UAAU,CAAA;AACpC,MAAM,cAAA,GAAiB,CAAC,EAAA,EAAiB,YAAqC,KAAA;AAC5E,EAAA,MAAM,OAAO,QAAS,CAAA,gBAAA,CAAiB,EAAE,CAAE,CAAA,gBAAA,CAAiB,YAAY,CAAC,CAAA;AACzE,EAAA,MAAM,MACJ,GAAA,YAAA,KAAiB,OACb,GAAA,QAAA,CAAS,iBAAiB,EAAE,CAAA,CAAE,gBAAiB,CAAA,aAAa,CAAC,CAAA,GAC7D,QAAS,CAAA,gBAAA,CAAiB,EAAE,CAAE,CAAA,gBAAA,CAAiB,cAAc,CAAC,CAC9D,GAAA,QAAA,CAAS,gBAAiB,CAAA,EAAE,EAAE,gBAAiB,CAAA,YAAY,CAAC,CAAA,GAC5D,SAAS,gBAAiB,CAAA,EAAE,CAAE,CAAA,gBAAA,CAAiB,eAAe,CAAC,CAAA;AAErE,EAAA,OAAO,IAAO,GAAA,MAAA;AAChB,CAAA;AAEA,MAAM,iBAAoB,GAAA,CACxB,SACA,EAAA,iBAAA,EACA,WACG,KAAA;AACH,EAAA,IAAI,gBAAgB,YAAc,EAAA;AAChC,IAAA,MAAM,EAAE,KAAA,EAAO,cAAe,EAAA,GAAI,UAAU,qBAAsB,EAAA;AAClE,IAAA,MAAM,YAAe,GAAA,QAAA;AAAA,MACnB,gBAAiB,CAAA,SAAS,CAAE,CAAA,gBAAA,CAAiB,eAAe;AAAA,KAC9D;AACA,IAAA,MAAM,EAAE,KAAA,EAAO,cAAe,EAAA,GAAI,kBAAkB,qBAAsB,EAAA;AAC1E,IAAA,OAAO,iBAAiB,YAAe,GAAA,cAAA;AAAA,GAClC,MAAA;AACL,IAAA,MAAM,EAAE,MAAA,EAAQ,eAAgB,EAAA,GAAI,UAAU,qBAAsB,EAAA;AACpE,IAAA,MAAM,aAAgB,GAAA,QAAA;AAAA,MACpB,gBAAiB,CAAA,SAAS,CAAE,CAAA,gBAAA,CAAiB,gBAAgB;AAAA,KAC/D;AACA,IAAA,MAAM,EAAE,MAAA,EAAQ,eAAgB,EAAA,GAC9B,kBAAkB,qBAAsB,EAAA;AAC1C,IAAA,OAAO,kBAAkB,aAAgB,GAAA,eAAA;AAAA;AAE7C,CAAA;AAOa,MAAA,uCAAA,GAA0C,CACrD,SAAA,EACA,WACY,KAAA;AACZ,EAAM,MAAA,YAAA,GAAe,WAAgB,KAAA,YAAA,GAAe,OAAU,GAAA,QAAA;AAC9D,EAAM,MAAA,iBAAA,GAAoB,qBAAqB,SAAS,CAAA;AACxD,EAAA,MAAM,cAAiB,GAAA,iBAAA;AAAA,IACrB,SAAA;AAAA,IACA,iBAAA;AAAA,IACA;AAAA,GACF;AACA,EAAM,MAAA,cAAA,GAAiB,cAAe,CAAA,iBAAA,EAAmB,YAAY,CAAA;AACrE,EAAM,MAAA,cAAA,GAAiB,kBAAkB,SAAS,CAAA;AAClD,EAAM,MAAA,aAAA,GAAgB,cAAe,CAAA,cAAA,EAAgB,YAAY,CAAA;AAEjE,EAAI,IAAA,aAAA,IAAiB,iBAAiB,cAAgB,EAAA;AACpD,IAAU,SAAA,CAAA,SAAA,CAAU,OAAO,+CAA+C,CAAA;AAC1E,IAAe,cAAA,CAAA,SAAA,CAAU,OAAO,SAAS,CAAA;AACzC,IAAO,OAAA,IAAA;AAAA;AAET,EAAO,OAAA,KAAA;AACT;AAEA,MAAM,oBAAA,GAAuB,CAAC,EAAA,EAAa,EAAgB,KAAA;AACzD,EAAM,MAAA;AAAA,IACJ,SAAS,EAAE,KAAA,EAAO,KAAK,GAAK,EAAA,gBAAA,EAAkB,KAAK,GAAI;AAAA,GACrD,GAAA,EAAA;AACJ,EAAM,MAAA;AAAA,IACJ,SAAS,EAAE,KAAA,EAAO,KAAK,GAAK,EAAA,gBAAA,EAAkB,KAAK,GAAI;AAAA,GACrD,GAAA,EAAA;AAEJ,EAAA,IAAI,KAAK,EAAI,EAAA;AACX,IAAO,OAAA,CAAA,CAAA;AAAA,GACT,MAAA,IAAW,KAAK,EAAI,EAAA;AAClB,IAAO,OAAA,CAAA;AAAA,GACF,MAAA;AACL,IAAA,OAAO,QAAS,CAAA,EAAE,CAAI,GAAA,QAAA,CAAS,EAAE,CAAA;AAAA;AAErC,CAAA;AAEA,MAAM,4BAAA,GAA+B,CAAC,SACpC,KAAA,KAAA,CAAM,KAAK,SAAU,CAAA,gBAAA,CAAiB,gBAAgB,CAAC,CAAE,CAAA,IAAA;AAAA,EACvD;AACF,CAAA;AAOK,MAAM,yBAA4B,GAAA,CACvC,SACA,EAAA,YAAA,EACA,WACqC,KAAA;AACrC,EAAM,MAAA,cAAA,GAAiB,6BAA6B,SAAS,CAAA;AAC7D,EAAA,MAAM,aAAgB,GAAA,qBAAA;AAAA,IACpB,SAAA;AAAA,IACA,YAAa,CAAA,KAAA;AAAA,IACb;AAAA,GACF;AACA,EAAA,IAAI,GAAM,GAAA,CAAA,CAAA;AACV,EAAI,IAAA,aAAA,GAAgB,cAAe,CAAA,EAAA,CAAG,GAAG,CAAA;AACzC,EAAM,MAAA,YAAA,GAAe,WAAgB,KAAA,YAAA,GAAe,OAAU,GAAA,QAAA;AAC9D,EAAM,MAAA,SAAA,GAAY,cAAe,CAAA,aAAA,EAAe,YAAY,CAAA;AAC5D,EAAM,MAAA,WAAA,GAAc,cAAe,CAAA,aAAA,EAAe,YAAY,CAAA;AAC9D,EAAM,MAAA,iBAAA,GAAoB,qBAAqB,SAAS,CAAA;AACxD,EAAA,IAAI,cACF,GAAA,iBAAA,CAAkB,SAAW,EAAA,iBAAA,EAAmB,WAAW,CAAI,GAAA,SAAA;AACjE,EAAA,IAAI,kBAAkB,WAAa,EAAA;AACjC,IAAA,oBAAA,CAAqB,eAAe,aAAa,CAAA;AAAA,GAC5C,MAAA;AAEL,IAAA,MAAM,EAAE,IAAA,EAAM,QAAS,EAAA,GAAI,cAAc,qBAAsB,EAAA;AAC/D,IAAA,MAAM,kBAAqB,GAAA,cAAA;AAC3B,IAAM,MAAA,WAAA,GAAc,CAAC,aAAa,CAAA;AAClC,IAAA,OAAO,iBAAiB,WAAa,EAAA;AACnC,MAAO,GAAA,IAAA,CAAA;AACP,MAAgB,aAAA,GAAA,cAAA,CAAe,GAAG,GAAG,CAAA;AACrC,MAAA,WAAA,CAAY,KAAK,aAAa,CAAA;AAC9B,MAAA,MAAM,EAAE,IAAA,EAAM,QAAS,EAAA,GAAI,cAAc,qBAAsB,EAAA;AAC/D,MAAA,MAAM,aAAa,QAAW,GAAA,QAAA;AAC9B,MAAA,cAAA,GAAiB,kBAAqB,GAAA,UAAA;AAAA;AAGxC,IAAe,aAAA,EAAA,SAAA,CAAU,OAAO,SAAS,CAAA;AACzC,IAAY,WAAA,CAAA,OAAA,CAAQ,CAAC,IAAS,KAAA;AAC5B,MAAK,IAAA,CAAA,SAAA,CAAU,IAAI,SAAS,CAAA;AAAA,KAC7B,CAAA;AAAA;AAEH,EAAM,MAAA,CAAC,eAAiB,EAAA,YAAY,CAAI,GAAA,4BAAA;AAAA,IACtC,SAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,kCAAA,CAAmC,WAAW,YAAY,CAAA;AAC1D,EAAO,OAAA,CAAC,iBAAiB,YAAY,CAAA;AACvC;AAEA,MAAM,oBAAA,GAAuB,CAC3B,cAAA,EACA,iBACG,KAAA;AACH,EAAI,IAAA,CAAC,cAAkB,IAAA,CAAC,iBAAmB,EAAA;AACzC,IAAA,MAAM,MAAM,yCAAyC,CAAA;AAAA;AAEvD,EAAe,cAAA,CAAA,SAAA,CAAU,OAAO,SAAS,CAAA;AACzC,EAAkB,iBAAA,CAAA,SAAA,CAAU,IAAI,SAAS,CAAA;AAC3C,CAAA;;;;"}
|
|
@@ -1,141 +0,0 @@
|
|
|
1
|
-
import { MEASURES, isValidNumber, useLayoutEffectSkipFirst } from '@vuu-ui/vuu-utils';
|
|
2
|
-
import { useState, useRef, useCallback, useMemo } from 'react';
|
|
3
|
-
import { NO_WRAPPED_ITEMS, getNonWrappedAndWrappedItems, applyOverflowClassToWrappedItems, overflowIndicatorHasWrappedButShouldNotHave, correctForWrappedOverflowIndicator, highPriorityItemsHaveWrappedButShouldNotHave, correctForWrappedHighPriorityItems, removeOverflowIndicatorIfNoLongerNeeded, switchWrappedItemIntoView } from './overflow-utils.js';
|
|
4
|
-
import '../drag-drop/DragDropProvider.js';
|
|
5
|
-
import { useDragDrop } from '../drag-drop/useDragDrop.js';
|
|
6
|
-
|
|
7
|
-
const useOverflowContainer = ({
|
|
8
|
-
allowDragDrop = false,
|
|
9
|
-
itemCount,
|
|
10
|
-
onMoveItem,
|
|
11
|
-
onSwitchWrappedItemIntoView,
|
|
12
|
-
orientation
|
|
13
|
-
}) => {
|
|
14
|
-
const [container, setContainer] = useState(null);
|
|
15
|
-
const wrappedItemsRef = useRef(NO_WRAPPED_ITEMS);
|
|
16
|
-
const containerRef = useRef(null);
|
|
17
|
-
const setOverflowTabIndex = useCallback((tabIndex) => {
|
|
18
|
-
if (containerRef.current) {
|
|
19
|
-
containerRef.current.querySelector(".vuuOverflowContainer-OverflowIndicator button")?.setAttribute("tabindex", tabIndex);
|
|
20
|
-
}
|
|
21
|
-
}, []);
|
|
22
|
-
const handleResize = useCallback(async () => {
|
|
23
|
-
if (container) {
|
|
24
|
-
let [nonWrapped, wrapped] = getNonWrappedAndWrappedItems(
|
|
25
|
-
container,
|
|
26
|
-
orientation
|
|
27
|
-
);
|
|
28
|
-
applyOverflowClassToWrappedItems(
|
|
29
|
-
container,
|
|
30
|
-
wrapped,
|
|
31
|
-
"vuuOverflowContainer-wrapContainer"
|
|
32
|
-
);
|
|
33
|
-
if (overflowIndicatorHasWrappedButShouldNotHave(wrapped)) {
|
|
34
|
-
wrapped = await correctForWrappedOverflowIndicator(
|
|
35
|
-
container,
|
|
36
|
-
wrapped,
|
|
37
|
-
orientation
|
|
38
|
-
);
|
|
39
|
-
}
|
|
40
|
-
while (highPriorityItemsHaveWrappedButShouldNotHave(nonWrapped, wrapped)) {
|
|
41
|
-
[nonWrapped, wrapped] = await correctForWrappedHighPriorityItems(
|
|
42
|
-
container,
|
|
43
|
-
nonWrapped,
|
|
44
|
-
wrapped,
|
|
45
|
-
orientation
|
|
46
|
-
);
|
|
47
|
-
}
|
|
48
|
-
if (wrapped.length === 1) {
|
|
49
|
-
if (removeOverflowIndicatorIfNoLongerNeeded(container, orientation)) {
|
|
50
|
-
wrapped = NO_WRAPPED_ITEMS;
|
|
51
|
-
}
|
|
52
|
-
}
|
|
53
|
-
if (wrappedItemsRef.current.length === 0 && wrapped.length > 0) {
|
|
54
|
-
setOverflowTabIndex("0");
|
|
55
|
-
} else if (wrappedItemsRef.current.length > 0 && wrapped.length === 0) {
|
|
56
|
-
setOverflowTabIndex("-1");
|
|
57
|
-
}
|
|
58
|
-
wrappedItemsRef.current = wrapped;
|
|
59
|
-
}
|
|
60
|
-
}, [container, orientation, setOverflowTabIndex]);
|
|
61
|
-
const hasOverflowItem = (opt) => typeof opt === "object" && opt !== null && "overflowItem" in opt;
|
|
62
|
-
const [menuBuilder, menuActionHandler] = useMemo(() => {
|
|
63
|
-
return [
|
|
64
|
-
() => {
|
|
65
|
-
const { current: menuItems } = wrappedItemsRef;
|
|
66
|
-
return menuItems.map((item) => {
|
|
67
|
-
return {
|
|
68
|
-
label: item.label,
|
|
69
|
-
id: `activate-item-${item.index}`,
|
|
70
|
-
options: { overflowItem: item }
|
|
71
|
-
};
|
|
72
|
-
});
|
|
73
|
-
},
|
|
74
|
-
// The menu items are our overflowed items, selecting one by default
|
|
75
|
-
// brings it back onto the toolbar - TODO is this right ?
|
|
76
|
-
(menuItemId, options) => {
|
|
77
|
-
if (container && hasOverflowItem(options)) {
|
|
78
|
-
const [, wrappedItems] = switchWrappedItemIntoView(
|
|
79
|
-
container,
|
|
80
|
-
options.overflowItem,
|
|
81
|
-
orientation
|
|
82
|
-
);
|
|
83
|
-
wrappedItemsRef.current = wrappedItems;
|
|
84
|
-
onSwitchWrappedItemIntoView?.(options.overflowItem);
|
|
85
|
-
}
|
|
86
|
-
return true;
|
|
87
|
-
}
|
|
88
|
-
];
|
|
89
|
-
}, [container, onSwitchWrappedItemIntoView, orientation]);
|
|
90
|
-
const resizeObserver = useMemo(() => {
|
|
91
|
-
const { sizeProp } = MEASURES[orientation];
|
|
92
|
-
let currentSize = 0;
|
|
93
|
-
return new ResizeObserver((entries) => {
|
|
94
|
-
for (const entry of entries) {
|
|
95
|
-
const { [sizeProp]: actualSize } = entry.contentRect;
|
|
96
|
-
const size = Math.round(actualSize);
|
|
97
|
-
if (isValidNumber(size) && currentSize !== size) {
|
|
98
|
-
currentSize = size;
|
|
99
|
-
handleResize();
|
|
100
|
-
}
|
|
101
|
-
}
|
|
102
|
-
});
|
|
103
|
-
}, [handleResize, orientation]);
|
|
104
|
-
useLayoutEffectSkipFirst(() => {
|
|
105
|
-
handleResize();
|
|
106
|
-
}, [handleResize, itemCount]);
|
|
107
|
-
useMemo(() => {
|
|
108
|
-
if (container) {
|
|
109
|
-
resizeObserver.observe(container);
|
|
110
|
-
}
|
|
111
|
-
}, [container, resizeObserver]);
|
|
112
|
-
const callbackRef = useCallback((el) => {
|
|
113
|
-
setContainer(containerRef.current = el);
|
|
114
|
-
}, []);
|
|
115
|
-
const handleDrop = useCallback(
|
|
116
|
-
({ fromIndex, toIndex }) => {
|
|
117
|
-
onMoveItem?.(fromIndex, toIndex);
|
|
118
|
-
},
|
|
119
|
-
[onMoveItem]
|
|
120
|
-
);
|
|
121
|
-
const { onMouseDown: dragDropHookHandleMouseDown, ...dragDropHook } = useDragDrop({
|
|
122
|
-
allowDragDrop,
|
|
123
|
-
containerRef,
|
|
124
|
-
// this is for useDragDropNext
|
|
125
|
-
draggableClassName: `vuuOverflowContainer`,
|
|
126
|
-
// extendedDropZone: overflowedItems.length > 0,
|
|
127
|
-
onDrop: handleDrop,
|
|
128
|
-
orientation: "horizontal",
|
|
129
|
-
itemQuery: ".vuuOverflowContainer-item"
|
|
130
|
-
});
|
|
131
|
-
return {
|
|
132
|
-
menuActionHandler,
|
|
133
|
-
menuBuilder,
|
|
134
|
-
onItemMouseDown: dragDropHookHandleMouseDown,
|
|
135
|
-
rootRef: callbackRef,
|
|
136
|
-
...dragDropHook
|
|
137
|
-
};
|
|
138
|
-
};
|
|
139
|
-
|
|
140
|
-
export { useOverflowContainer };
|
|
141
|
-
//# sourceMappingURL=useOverflowContainer.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useOverflowContainer.js","sources":["../../../../packages/vuu-ui-controls/src/overflow-container/useOverflowContainer.ts"],"sourcesContent":["import {\n isValidNumber,\n MEASURES,\n useLayoutEffectSkipFirst,\n} from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useMemo, useRef, useState } from \"react\";\nimport {\n applyOverflowClassToWrappedItems,\n removeOverflowIndicatorIfNoLongerNeeded,\n correctForWrappedHighPriorityItems,\n getNonWrappedAndWrappedItems,\n NO_WRAPPED_ITEMS,\n highPriorityItemsHaveWrappedButShouldNotHave,\n switchWrappedItemIntoView,\n OverflowItem,\n overflowIndicatorHasWrappedButShouldNotHave,\n correctForWrappedOverflowIndicator,\n} from \"./overflow-utils\";\nimport { OverflowContainerProps } from \"./OverflowContainer\";\nimport { DropOptions, useDragDrop } from \"../drag-drop\";\nimport { MenuActionHandler, MenuBuilder } from \"@vuu-ui/vuu-context-menu\";\n\nexport interface OverflowContainerHookProps\n extends Pick<OverflowContainerProps, \"allowDragDrop\" | \"onMoveItem\">,\n Required<Pick<OverflowContainerProps, \"orientation\">> {\n itemCount: number;\n onSwitchWrappedItemIntoView?: (overflowItem: OverflowItem) => void;\n}\n\nexport const useOverflowContainer = ({\n allowDragDrop = false,\n itemCount,\n onMoveItem,\n onSwitchWrappedItemIntoView,\n orientation,\n}: OverflowContainerHookProps) => {\n const [container, setContainer] = useState<HTMLDivElement | null>(null);\n const wrappedItemsRef = useRef<OverflowItem[]>(NO_WRAPPED_ITEMS);\n // Drag drop needs a ref to container\n const containerRef = useRef<HTMLDivElement | null>(null);\n\n const setOverflowTabIndex = useCallback((tabIndex: \"0\" | \"-1\") => {\n if (containerRef.current) {\n containerRef.current\n .querySelector(\".vuuOverflowContainer-OverflowIndicator button\")\n ?.setAttribute(\"tabindex\", tabIndex);\n }\n }, []);\n\n const handleResize = useCallback(async () => {\n if (container) {\n let [nonWrapped, wrapped] = getNonWrappedAndWrappedItems(\n container,\n orientation,\n );\n applyOverflowClassToWrappedItems(\n container,\n wrapped,\n \"vuuOverflowContainer-wrapContainer\",\n );\n if (overflowIndicatorHasWrappedButShouldNotHave(wrapped)) {\n wrapped = await correctForWrappedOverflowIndicator(\n container,\n wrapped,\n orientation,\n );\n }\n while (\n highPriorityItemsHaveWrappedButShouldNotHave(nonWrapped, wrapped)\n ) {\n [nonWrapped, wrapped] = await correctForWrappedHighPriorityItems(\n container,\n nonWrapped,\n wrapped,\n orientation,\n );\n }\n if (wrapped.length === 1) {\n if (removeOverflowIndicatorIfNoLongerNeeded(container, orientation)) {\n wrapped = NO_WRAPPED_ITEMS;\n }\n }\n\n if (wrappedItemsRef.current.length === 0 && wrapped.length > 0) {\n setOverflowTabIndex(\"0\");\n } else if (wrappedItemsRef.current.length > 0 && wrapped.length === 0) {\n setOverflowTabIndex(\"-1\");\n }\n\n wrappedItemsRef.current = wrapped;\n }\n }, [container, orientation, setOverflowTabIndex]);\n\n const hasOverflowItem = (\n opt: unknown,\n ): opt is {\n overflowItem: OverflowItem;\n } => typeof opt === \"object\" && opt !== null && \"overflowItem\" in opt;\n\n const [menuBuilder, menuActionHandler] = useMemo((): [\n MenuBuilder,\n MenuActionHandler,\n ] => {\n return [\n () => {\n const { current: menuItems } = wrappedItemsRef;\n return menuItems.map((item: OverflowItem) => {\n return {\n label: item.label,\n id: `activate-item-${item.index}`,\n options: { overflowItem: item },\n };\n });\n },\n // The menu items are our overflowed items, selecting one by default\n // brings it back onto the toolbar - TODO is this right ?\n (menuItemId, options) => {\n if (container && hasOverflowItem(options)) {\n // TODO do we always want to switch it into view - leave that to caller\n const [, wrappedItems] = switchWrappedItemIntoView(\n container,\n options.overflowItem,\n orientation,\n );\n wrappedItemsRef.current = wrappedItems;\n onSwitchWrappedItemIntoView?.(options.overflowItem);\n }\n return true;\n },\n ];\n }, [container, onSwitchWrappedItemIntoView, orientation]);\n\n const resizeObserver = useMemo(() => {\n const { sizeProp } = MEASURES[orientation];\n let currentSize = 0;\n return new ResizeObserver((entries: ResizeObserverEntry[]) => {\n for (const entry of entries) {\n const { [sizeProp]: actualSize } = entry.contentRect;\n // This is important. Sometimes tiny sub-pixel differeces\n // can be reported, which break the layout assumptions\n const size = Math.round(actualSize as number);\n if (isValidNumber(size) && currentSize !== size) {\n currentSize = size;\n handleResize();\n }\n }\n });\n }, [handleResize, orientation]);\n\n useLayoutEffectSkipFirst(() => {\n handleResize();\n }, [handleResize, itemCount]);\n\n useMemo(() => {\n if (container) {\n resizeObserver.observe(container);\n }\n }, [container, resizeObserver]);\n\n const callbackRef = useCallback((el: HTMLDivElement | null) => {\n setContainer((containerRef.current = el));\n }, []);\n\n const handleDrop = useCallback(\n ({ fromIndex, toIndex }: DropOptions) => {\n onMoveItem?.(fromIndex, toIndex);\n },\n [onMoveItem],\n );\n\n const { onMouseDown: dragDropHookHandleMouseDown, ...dragDropHook } =\n useDragDrop({\n allowDragDrop,\n containerRef,\n // this is for useDragDropNext\n draggableClassName: `vuuOverflowContainer`,\n // extendedDropZone: overflowedItems.length > 0,\n onDrop: handleDrop,\n orientation: \"horizontal\",\n itemQuery: \".vuuOverflowContainer-item\",\n });\n\n return {\n menuActionHandler,\n menuBuilder,\n onItemMouseDown: dragDropHookHandleMouseDown,\n rootRef: callbackRef,\n ...dragDropHook,\n };\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
var priceTickerCss = "@property --price-ticker-color {\n syntax: '<color>'; /* <- defined as type number for the transition to work */\n initial-value: #15171B;\n inherits: false;\n}\n \n.vuuPriceTicker {\n align-items: center;\n display: flex;\n font-size: var(--vuuPriceTicker-fontSize, var(--salt-text-fontSize));\n font-weight: var(--vuuPriceTicker-fontWeight, 700);\n transition-property: color;\n transition-duration: .3s;;\n}\n\n.vuuPriceTicker.up1 {\n --vuu-icon-color: var(--vuu-color-green-50);\n color: var(--vuu-color-green-50);\n animation-duration: 30s;\n }\n \n .vuuPriceTicker.up2 {\n --vuu-icon-color: var(--vuu-color-green-50);\n color: var(--vuu-color-green-50);\n animation-duration: 30s;\n }\n \n .vuuPriceTicker.down1 {\n --vuu-icon-transform: rotate(180deg);\n --vuu-icon-color: var(--vuu-color-red-50);\n color: var(--vuu-color-red-50);\n animation-duration: 30s;\n }\n \n .vuuPriceTicker.down2 {\n --vuu-icon-transform: rotate(180deg);\n --vuu-icon-color: var(--vuu-color-red-50);\n color: var(--vuu-color-red-50);\n animation-duration: 30s;\n }\n ";
|
|
2
|
-
|
|
3
|
-
export { priceTickerCss as default };
|
|
4
|
-
//# sourceMappingURL=PriceTicker.css.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"PriceTicker.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -1,48 +0,0 @@
|
|
|
1
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { isValidNumber, getMovingValueDirection, numericFormatter } from '@vuu-ui/vuu-utils';
|
|
3
|
-
import { memo, useRef, useMemo } from 'react';
|
|
4
|
-
import cx from 'clsx';
|
|
5
|
-
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
6
|
-
import { useWindow } from '@salt-ds/window';
|
|
7
|
-
import priceTickerCss from './PriceTicker.css.js';
|
|
8
|
-
|
|
9
|
-
const classBase = "vuuPriceTicker";
|
|
10
|
-
const getValueFormatter = (decimals) => numericFormatter({
|
|
11
|
-
type: {
|
|
12
|
-
name: "number",
|
|
13
|
-
formatting: {
|
|
14
|
-
decimals,
|
|
15
|
-
zeroPad: true
|
|
16
|
-
}
|
|
17
|
-
}
|
|
18
|
-
});
|
|
19
|
-
const INITIAL_VALUE = [void 0, void 0];
|
|
20
|
-
const PriceTicker = memo(
|
|
21
|
-
({
|
|
22
|
-
className,
|
|
23
|
-
decimals = 2,
|
|
24
|
-
price,
|
|
25
|
-
showArrow,
|
|
26
|
-
...htmlAttributes
|
|
27
|
-
}) => {
|
|
28
|
-
const targetWindow = useWindow();
|
|
29
|
-
useComponentCssInjection({
|
|
30
|
-
testId: "vuu-price-ticker",
|
|
31
|
-
css: priceTickerCss,
|
|
32
|
-
window: targetWindow
|
|
33
|
-
});
|
|
34
|
-
const ref = useRef(INITIAL_VALUE);
|
|
35
|
-
const [prevValue, prevDirection] = ref.current;
|
|
36
|
-
const formatNumber = useMemo(() => getValueFormatter(decimals), [decimals]);
|
|
37
|
-
const direction = isValidNumber(prevValue) ? getMovingValueDirection(price, prevDirection, prevValue, decimals) : "";
|
|
38
|
-
ref.current = [price, direction];
|
|
39
|
-
return /* @__PURE__ */ jsxs("div", { ...htmlAttributes, className: cx(classBase, className, direction), children: [
|
|
40
|
-
formatNumber(price),
|
|
41
|
-
showArrow ? /* @__PURE__ */ jsx("span", { "data-icon": "price-arrow" }) : null
|
|
42
|
-
] });
|
|
43
|
-
}
|
|
44
|
-
);
|
|
45
|
-
PriceTicker.displayName = "PriceTicker";
|
|
46
|
-
|
|
47
|
-
export { PriceTicker };
|
|
48
|
-
//# sourceMappingURL=PriceTicker.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"PriceTicker.js","sources":["../../../../packages/vuu-ui-controls/src/price-ticker/PriceTicker.tsx"],"sourcesContent":["import {\n getMovingValueDirection,\n isValidNumber,\n numericFormatter,\n valueChangeDirection,\n} from \"@vuu-ui/vuu-utils\";\nimport { HTMLAttributes, memo, useMemo, useRef } from \"react\";\nimport cx from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nconst classBase = \"vuuPriceTicker\";\n\nimport priceTickerCss from \"./PriceTicker.css\";\n\nconst getValueFormatter = (decimals: number) =>\n numericFormatter({\n type: {\n name: \"number\",\n formatting: {\n decimals,\n zeroPad: true,\n },\n },\n });\n\ntype State = [number | undefined, valueChangeDirection | undefined];\nconst INITIAL_VALUE: State = [undefined, undefined];\n\nexport interface PriceTickerProps extends HTMLAttributes<HTMLDivElement> {\n decimals?: number;\n price?: number;\n showArrow?: boolean;\n}\n\nexport const PriceTicker = memo(\n ({\n className,\n decimals = 2,\n price,\n showArrow,\n ...htmlAttributes\n }: PriceTickerProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-price-ticker\",\n css: priceTickerCss,\n window: targetWindow,\n });\n\n const ref = useRef<State>(INITIAL_VALUE);\n const [prevValue, prevDirection] = ref.current;\n const formatNumber = useMemo(() => getValueFormatter(decimals), [decimals]);\n\n const direction = isValidNumber(prevValue)\n ? getMovingValueDirection(price, prevDirection, prevValue, decimals)\n : \"\";\n\n ref.current = [price, direction];\n\n return (\n <div {...htmlAttributes} className={cx(classBase, className, direction)}>\n {formatNumber(price)}\n {showArrow ? <span data-icon=\"price-arrow\" /> : null}\n </div>\n );\n },\n);\nPriceTicker.displayName = \"PriceTicker\";\n"],"names":[],"mappings":";;;;;;;;AAWA,MAAM,SAAY,GAAA,gBAAA;AAIlB,MAAM,iBAAA,GAAoB,CAAC,QAAA,KACzB,gBAAiB,CAAA;AAAA,EACf,IAAM,EAAA;AAAA,IACJ,IAAM,EAAA,QAAA;AAAA,IACN,UAAY,EAAA;AAAA,MACV,QAAA;AAAA,MACA,OAAS,EAAA;AAAA;AACX;AAEJ,CAAC,CAAA;AAGH,MAAM,aAAA,GAAuB,CAAC,KAAA,CAAA,EAAW,KAAS,CAAA,CAAA;AAQ3C,MAAM,WAAc,GAAA,IAAA;AAAA,EACzB,CAAC;AAAA,IACC,SAAA;AAAA,IACA,QAAW,GAAA,CAAA;AAAA,IACX,KAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAG;AAAA,GACmB,KAAA;AACtB,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAA,cAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAM,MAAA,GAAA,GAAM,OAAc,aAAa,CAAA;AACvC,IAAA,MAAM,CAAC,SAAA,EAAW,aAAa,CAAA,GAAI,GAAI,CAAA,OAAA;AACvC,IAAM,MAAA,YAAA,GAAe,QAAQ,MAAM,iBAAA,CAAkB,QAAQ,CAAG,EAAA,CAAC,QAAQ,CAAC,CAAA;AAE1E,IAAM,MAAA,SAAA,GAAY,cAAc,SAAS,CAAA,GACrC,wBAAwB,KAAO,EAAA,aAAA,EAAe,SAAW,EAAA,QAAQ,CACjE,GAAA,EAAA;AAEJ,IAAI,GAAA,CAAA,OAAA,GAAU,CAAC,KAAA,EAAO,SAAS,CAAA;AAE/B,IACE,uBAAA,IAAA,CAAC,SAAK,GAAG,cAAA,EAAgB,WAAW,EAAG,CAAA,SAAA,EAAW,SAAW,EAAA,SAAS,CACnE,EAAA,QAAA,EAAA;AAAA,MAAA,YAAA,CAAa,KAAK,CAAA;AAAA,MAClB,SAAY,mBAAA,GAAA,CAAC,MAAK,EAAA,EAAA,WAAA,EAAU,eAAc,CAAK,GAAA;AAAA,KAClD,EAAA,CAAA;AAAA;AAGN;AACA,WAAA,CAAY,WAAc,GAAA,aAAA;;;;"}
|
package/esm/prompt/Prompt.css.js
DELETED
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
var promptCss = ".vuuPrompt {\n min-height: var(--vuuPrompt-minHeight, 257px);\n min-width: var(--vuuPrompt-minWidth,380px);\n\n .saltDialogHeader {\n .vuuIcon {\n width: 24px;\n --vuu-icon-size: 20px;\n }\n }\n\n .saltDialogActions {\n align-items: center;\n }\n\n}\n\n.vuuPrompt.saltDialog-warning {\n --salt-status-warning-borderColor: var(--vuu-color-yellow-20); \n --variant-color: var(--vuu-color-yellow-20);\n\n border-radius: 4px !important;\n min-height: var(--vuuPrompt-minHeight, 150px);\n min-width: var(--vuuPrompt-minWidth, 280px);\n padding-top:0 !important;\n\n .saltDialogHeader {\n background-color: var(--variant-color);\n padding-left: var(--salt-spacing-100);\n padding-bottom: var(--salt-spacing-100);\n padding-right: var(--salt-spacing-100);\n\n .saltDialogHeader-header {\n align-items: end;\n display: flex;\n gap: var(--salt-spacing-100);\n }\n }\n\n .saltDialogContent {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n } \n}\n\n";
|
|
2
|
-
|
|
3
|
-
export { promptCss as default };
|
|
4
|
-
//# sourceMappingURL=Prompt.css.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Prompt.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|