@vuu-ui/vuu-ui-controls 4.0.0-alpha.21 → 4.0.0-alpha.22

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.
Files changed (145) hide show
  1. package/package.json +11 -10
  2. package/src/hover-overlay/HoverOverlay.css.js +8 -0
  3. package/src/hover-overlay/HoverOverlay.js +87 -38
  4. package/src/item-picker/useItemPicker.js +5 -1
  5. package/types/hover-overlay/HoverOverlay.d.ts +7 -1
  6. package/types/index.d.ts +1 -1
  7. package/types/modal-provider/ModalProvider.d.ts +0 -13
  8. package/types/src/calendar/Calendar.d.ts +0 -13
  9. package/types/src/calendar/index.d.ts +0 -4
  10. package/types/src/calendar/internal/CalendarCarousel.d.ts +0 -3
  11. package/types/src/calendar/internal/CalendarContext.d.ts +0 -8
  12. package/types/src/calendar/internal/CalendarDay.d.ts +0 -14
  13. package/types/src/calendar/internal/CalendarMonth.d.ts +0 -10
  14. package/types/src/calendar/internal/CalendarNavigation.d.ts +0 -16
  15. package/types/src/calendar/internal/CalendarWeekHeader.d.ts +0 -3
  16. package/types/src/calendar/internal/useFocusManagement.d.ts +0 -9
  17. package/types/src/calendar/internal/utils.d.ts +0 -15
  18. package/types/src/calendar/useCalendar.d.ts +0 -54
  19. package/types/src/calendar/useCalendarDay.d.ts +0 -22
  20. package/types/src/calendar/useSelection.d.ts +0 -78
  21. package/types/src/column-picker/ColumnPicker.d.ts +0 -7
  22. package/types/src/column-picker/ColumnSearch.d.ts +0 -12
  23. package/types/src/column-picker/index.d.ts +0 -2
  24. package/types/src/column-picker/moving-window.d.ts +0 -14
  25. package/types/src/common-hooks/index.d.ts +0 -3
  26. package/types/src/common-hooks/selectionTypes.d.ts +0 -70
  27. package/types/src/common-hooks/use-resize-observer.d.ts +0 -16
  28. package/types/src/common-hooks/useControlled.d.ts +0 -24
  29. package/types/src/context-panel-provider/ContextPanelProvider.d.ts +0 -17
  30. package/types/src/cycle-state-button/CycleStateButton.d.ts +0 -11
  31. package/types/src/cycle-state-button/index.d.ts +0 -1
  32. package/types/src/date-input/DateInput.d.ts +0 -60
  33. package/types/src/date-input/index.d.ts +0 -1
  34. package/types/src/date-picker/DatePicker.d.ts +0 -66
  35. package/types/src/date-picker/DatePickerContext.d.ts +0 -19
  36. package/types/src/date-picker/DatePickerPanel.d.ts +0 -10
  37. package/types/src/date-picker/index.d.ts +0 -1
  38. package/types/src/drag-drop/DragDropProvider.d.ts +0 -38
  39. package/types/src/drag-drop/DragDropState.d.ts +0 -15
  40. package/types/src/drag-drop/Draggable.d.ts +0 -13
  41. package/types/src/drag-drop/DropIndicator.d.ts +0 -5
  42. package/types/src/drag-drop/dragDropTypes.d.ts +0 -100
  43. package/types/src/drag-drop/drop-target-utils.d.ts +0 -82
  44. package/types/src/drag-drop/index.d.ts +0 -6
  45. package/types/src/drag-drop/useAutoScroll.d.ts +0 -11
  46. package/types/src/drag-drop/useDragDisplacers.d.ts +0 -17
  47. package/types/src/drag-drop/useDragDrop.d.ts +0 -2
  48. package/types/src/drag-drop/useDragDropCopy.d.ts +0 -6
  49. package/types/src/drag-drop/useDragDropIndicator.d.ts +0 -2
  50. package/types/src/drag-drop/useDragDropNaturalMovement.d.ts +0 -2
  51. package/types/src/drag-drop/useDropIndicator.d.ts +0 -8
  52. package/types/src/drag-drop/useGlobalDragDrop.d.ts +0 -11
  53. package/types/src/drag-drop/useTransition.d.ts +0 -3
  54. package/types/src/editable/index.d.ts +0 -1
  55. package/types/src/editable/useEditableText.d.ts +0 -21
  56. package/types/src/editable-label/EditableLabel.d.ts +0 -19
  57. package/types/src/editable-label/index.d.ts +0 -1
  58. package/types/src/expando-input/ExpandoInput.d.ts +0 -6
  59. package/types/src/expando-input/index.d.ts +0 -1
  60. package/types/src/highlighter/Highlighter.d.ts +0 -6
  61. package/types/src/highlighter/index.d.ts +0 -1
  62. package/types/src/hover-overlay/HoverOverlay.d.ts +0 -8
  63. package/types/src/icon-button/Icon.d.ts +0 -6
  64. package/types/src/icon-button/IconButton.d.ts +0 -6
  65. package/types/src/icon-button/ToggleIconButton.d.ts +0 -5
  66. package/types/src/icon-button/index.d.ts +0 -3
  67. package/types/src/index.d.ts +0 -33
  68. package/types/src/instrument-picker/SearchCell.d.ts +0 -2
  69. package/types/src/instrument-picker/TablePicker.d.ts +0 -11
  70. package/types/src/instrument-picker/index.d.ts +0 -1
  71. package/types/src/instrument-picker/moving-window.d.ts +0 -14
  72. package/types/src/instrument-picker/useDataSource.d.ts +0 -6
  73. package/types/src/instrument-picker/useTablePicker.d.ts +0 -47
  74. package/types/src/item-picker/ItemPicker.d.ts +0 -14
  75. package/types/src/item-picker/useItemPicker.d.ts +0 -35
  76. package/types/src/measured-container/MeasuredContainer.d.ts +0 -16
  77. package/types/src/measured-container/index.d.ts +0 -2
  78. package/types/src/measured-container/useMeasuredContainer.d.ts +0 -23
  79. package/types/src/modal-provider/ModalProvider.d.ts +0 -13
  80. package/types/src/overflow-container/OverflowContainer.d.ts +0 -15
  81. package/types/src/overflow-container/index.d.ts +0 -2
  82. package/types/src/overflow-container/overflow-utils.d.ts +0 -48
  83. package/types/src/overflow-container/useOverflowContainer.d.ts +0 -19
  84. package/types/src/price-ticker/PriceTicker.d.ts +0 -7
  85. package/types/src/price-ticker/index.d.ts +0 -1
  86. package/types/src/prompt/Prompt.d.ts +0 -53
  87. package/types/src/sortable-list/SortableList.d.ts +0 -8
  88. package/types/src/split-button/SplitButton.d.ts +0 -11
  89. package/types/src/split-button/SplitStateButton.d.ts +0 -5
  90. package/types/src/split-button/index.d.ts +0 -2
  91. package/types/src/split-button/useSplitButton.d.ts +0 -311
  92. package/types/src/table-search/SearchCell.d.ts +0 -2
  93. package/types/src/table-search/TableSearch.d.ts +0 -9
  94. package/types/src/table-search/index.d.ts +0 -1
  95. package/types/src/table-search/moving-window.d.ts +0 -14
  96. package/types/src/table-search/useTableSearch.d.ts +0 -15
  97. package/types/src/tabs-next/TabBar.d.ts +0 -12
  98. package/types/src/tabs-next/TabListNext.d.ts +0 -12
  99. package/types/src/tabs-next/TabNext.d.ts +0 -12
  100. package/types/src/tabs-next/TabNextAction.d.ts +0 -5
  101. package/types/src/tabs-next/TabNextContext.d.ts +0 -12
  102. package/types/src/tabs-next/TabNextPanel.d.ts +0 -8
  103. package/types/src/tabs-next/TabNextTrigger.d.ts +0 -5
  104. package/types/src/tabs-next/TabOverflowList.d.ts +0 -11
  105. package/types/src/tabs-next/TabsNext.d.ts +0 -17
  106. package/types/src/tabs-next/TabsNextContext.d.ts +0 -21
  107. package/types/src/tabs-next/hooks/useCollection.d.ts +0 -18
  108. package/types/src/tabs-next/hooks/useFocusOutside.d.ts +0 -2
  109. package/types/src/tabs-next/hooks/useOverflow.d.ts +0 -11
  110. package/types/src/tabs-next/index.d.ts +0 -7
  111. package/types/src/tabstrip/Tab.d.ts +0 -27
  112. package/types/src/tabstrip/TabMenu.d.ts +0 -23
  113. package/types/src/tabstrip/TabMenuOptions.d.ts +0 -10
  114. package/types/src/tabstrip/TabsTypes.d.ts +0 -127
  115. package/types/src/tabstrip/Tabstrip.d.ts +0 -3
  116. package/types/src/tabstrip/index.d.ts +0 -5
  117. package/types/src/tabstrip/tabstrip-dom-utils.d.ts +0 -2
  118. package/types/src/tabstrip/useAnimatedSelectionThumb.d.ts +0 -7
  119. package/types/src/tabstrip/useKeyboardNavigation.d.ts +0 -29
  120. package/types/src/tabstrip/useSelection.d.ts +0 -13
  121. package/types/src/tabstrip/useTabstrip.d.ts +0 -55
  122. package/types/src/time-input/MaskedInput.d.ts +0 -49
  123. package/types/src/time-input/TimeInput.d.ts +0 -5
  124. package/types/src/time-input/useTimeInput.d.ts +0 -21
  125. package/types/src/toolbar/Toolbar.d.ts +0 -20
  126. package/types/src/toolbar/index.d.ts +0 -1
  127. package/types/src/toolbar/toolbar-dom-utils.d.ts +0 -3
  128. package/types/src/toolbar/useKeyboardNavigation.d.ts +0 -32
  129. package/types/src/toolbar/useSelection.d.ts +0 -22
  130. package/types/src/toolbar/useToolbar.d.ts +0 -28
  131. package/types/src/utils/deprecated-types.d.ts +0 -2
  132. package/types/src/utils/escapeRegExp.d.ts +0 -1
  133. package/types/src/utils/forwardCallbackProps.d.ts +0 -3
  134. package/types/src/utils/index.d.ts +0 -5
  135. package/types/src/utils/isOverflowElement.d.ts +0 -1
  136. package/types/src/utils/isPlainObject.d.ts +0 -1
  137. package/types/src/vuu-date-picker/VuuDatePicker.d.ts +0 -7
  138. package/types/src/vuu-date-picker/index.d.ts +0 -1
  139. package/types/src/vuu-input/VuuInput.d.ts +0 -18
  140. package/types/src/vuu-input/index.d.ts +0 -1
  141. package/types/src/vuu-time-picker/TimeRangePicker.d.ts +0 -0
  142. package/types/src/vuu-time-picker/VuuTimePicker.d.ts +0 -7
  143. package/types/src/vuu-typeahead-input/VuuTypeaheadInput.d.ts +0 -6
  144. package/types/src/vuu-typeahead-input/index.d.ts +0 -1
  145. package/types/src/vuu-typeahead-input/useVuuTypeaheadInput.d.ts +0 -49
package/package.json CHANGED
@@ -1,26 +1,26 @@
1
1
  {
2
- "version": "4.0.0-alpha.21",
2
+ "version": "4.0.0-alpha.22",
3
3
  "description": "VUU UI Controls",
4
4
  "main": "./src/index.js",
5
5
  "author": "heswell",
6
6
  "license": "Apache-2.0",
7
- "type": "module",
8
7
  "scripts": {
9
8
  "build:dev": "node ../../scripts/run-build.mjs",
10
9
  "build": "node ../../scripts/run-build-rslib.ts",
11
10
  "type-defs": "node ../../scripts/build-type-defs.mjs"
12
11
  },
13
12
  "devDependencies": {
14
- "@vuu-ui/vuu-data-types": "4.0.0-alpha.21",
15
- "@vuu-ui/vuu-protocol-types": "4.0.0-alpha.21",
16
- "@vuu-ui/vuu-table-types": "4.0.0-alpha.21"
13
+ "@vuu-ui/vuu-data-types": "4.0.0-alpha.22",
14
+ "@vuu-ui/vuu-protocol-types": "4.0.0-alpha.22",
15
+ "@vuu-ui/vuu-table-types": "4.0.0-alpha.22"
17
16
  },
18
17
  "dependencies": {
19
- "@vuu-ui/vuu-context-menu": "4.0.0-alpha.21",
20
- "@vuu-ui/vuu-data-react": "4.0.0-alpha.21",
21
- "@vuu-ui/vuu-popups": "4.0.0-alpha.21",
22
- "@vuu-ui/vuu-table": "4.0.0-alpha.21",
23
- "@vuu-ui/vuu-utils": "4.0.0-alpha.21",
18
+ "@vuu-ui/vuu-context-menu": "4.0.0-alpha.22",
19
+ "@vuu-ui/vuu-data-react": "4.0.0-alpha.22",
20
+ "@vuu-ui/vuu-layout": "4.0.0-alpha.22",
21
+ "@vuu-ui/vuu-popups": "4.0.0-alpha.22",
22
+ "@vuu-ui/vuu-table": "4.0.0-alpha.22",
23
+ "@vuu-ui/vuu-utils": "4.0.0-alpha.22",
24
24
  "@salt-ds/core": "1.72.0",
25
25
  "@salt-ds/icons": "1.18.3",
26
26
  "@salt-ds/styles": "0.4.1",
@@ -35,6 +35,7 @@
35
35
  "react-dom": "^19.2.3"
36
36
  },
37
37
  "sideEffects": false,
38
+ "type": "module",
38
39
  "files": [
39
40
  "README.md",
40
41
  "src",
@@ -0,0 +1,8 @@
1
+ const css = `
2
+ .vuuHoverOverlay-panel {
3
+ --saltOverlay-borderColor: var(--salt-container-primary-borderColor);
4
+ }
5
+
6
+
7
+ `;
8
+ export default css;
@@ -1,11 +1,38 @@
1
1
  import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import { Overlay, OverlayPanel, OverlayPanelContent, OverlayTrigger } from "@salt-ds/core";
3
+ import { useComponentCssInjection } from "@salt-ds/styles";
4
+ import { useWindow } from "@salt-ds/window";
5
+ import { containsPoint } from "@vuu-ui/vuu-utils";
3
6
  import { useCallback, useEffect, useRef, useState } from "react";
4
- const HoverOverlay = ({ children, open: openProp = false, onOpenChange, placement = "right", trigger })=>{
7
+ import HoverOverlay from "./HoverOverlay.css";
8
+ const classBase = "vuuHoverOverlay";
9
+ const OPEN_DELAY = 400;
10
+ const CLOSE_DELAY = 300;
11
+ const HoverOverlay_HoverOverlay = ({ children, open: openProp = false, onOpenChange, openOn = "hover", placement = "right", trigger })=>{
12
+ const targetWindow = useWindow();
13
+ useComponentCssInjection({
14
+ testId: "vuu-hover-overlay",
15
+ css: HoverOverlay,
16
+ window: targetWindow
17
+ });
5
18
  const [open, _setOpen] = useState(openProp);
6
19
  const isOpen = useRef(false);
7
20
  const showHandle = useRef(void 0);
8
21
  const hideHandle = useRef(void 0);
22
+ const triggerRef = useRef(null);
23
+ const panelRef = useRef(null);
24
+ const clearShowTimer = useCallback(()=>{
25
+ if (showHandle.current) {
26
+ clearTimeout(showHandle.current);
27
+ showHandle.current = void 0;
28
+ }
29
+ }, []);
30
+ const clearHideTimer = useCallback(()=>{
31
+ if (hideHandle.current) {
32
+ clearTimeout(hideHandle.current);
33
+ hideHandle.current = void 0;
34
+ }
35
+ }, []);
9
36
  const setOpen = useCallback((open)=>{
10
37
  if (open !== isOpen.current) {
11
38
  isOpen.current = open;
@@ -15,78 +42,100 @@ const HoverOverlay = ({ children, open: openProp = false, onOpenChange, placemen
15
42
  }, [
16
43
  onOpenChange
17
44
  ]);
45
+ const startHideTimer = useCallback(()=>{
46
+ if (void 0 === hideHandle.current) hideHandle.current = setTimeout(()=>{
47
+ hideHandle.current = void 0;
48
+ setOpen(false);
49
+ }, CLOSE_DELAY);
50
+ }, [
51
+ setOpen
52
+ ]);
18
53
  useEffect(()=>{
19
54
  if (openProp !== isOpen.current) setOpen(openProp);
20
55
  }, [
21
56
  openProp,
22
57
  setOpen
23
58
  ]);
24
- const handleOverlayMouseEnter = useCallback(()=>{
25
- if (hideHandle.current) {
26
- clearTimeout(hideHandle.current);
27
- hideHandle.current = void 0;
59
+ useEffect(()=>()=>{
60
+ clearShowTimer();
61
+ clearHideTimer();
62
+ }, [
63
+ clearHideTimer,
64
+ clearShowTimer
65
+ ]);
66
+ useEffect(()=>{
67
+ if (open && "hover" === openOn) {
68
+ const doc = triggerRef.current?.ownerDocument ?? document;
69
+ const handlePointerMove = ({ clientX, clientY })=>{
70
+ if (containsPoint(triggerRef.current, clientX, clientY) || containsPoint(panelRef.current, clientX, clientY)) clearHideTimer();
71
+ else startHideTimer();
72
+ };
73
+ doc.addEventListener("pointermove", handlePointerMove);
74
+ doc.documentElement.addEventListener("mouseleave", startHideTimer);
75
+ return ()=>{
76
+ doc.removeEventListener("pointermove", handlePointerMove);
77
+ doc.documentElement.removeEventListener("mouseleave", startHideTimer);
78
+ clearHideTimer();
79
+ };
28
80
  }
29
- }, []);
30
- const handleOverlayMouseLeave = useCallback(()=>{
31
- hideHandle.current = setTimeout(()=>{
32
- setOpen(false);
33
- hideHandle.current = void 0;
34
- }, 300);
35
81
  }, [
36
- setOpen
82
+ clearHideTimer,
83
+ open,
84
+ openOn,
85
+ startHideTimer
37
86
  ]);
38
87
  const handleMouseEnter = useCallback(()=>{
39
- showHandle.current = setTimeout(()=>{
40
- setOpen(true);
88
+ if (!isOpen.current && void 0 === showHandle.current) showHandle.current = setTimeout(()=>{
41
89
  showHandle.current = void 0;
42
- }, 400);
43
- if (hideHandle.current) {
44
- clearTimeout(hideHandle.current);
45
- hideHandle.current = void 0;
46
- }
90
+ setOpen(true);
91
+ }, OPEN_DELAY);
47
92
  }, [
48
93
  setOpen
49
94
  ]);
50
95
  const handleMouseLeave = useCallback(()=>{
51
- if (showHandle.current) {
52
- clearTimeout(showHandle.current);
53
- showHandle.current = void 0;
54
- } else if (isOpen.current) hideHandle.current = setTimeout(()=>{
55
- setOpen(false);
56
- hideHandle.current = void 0;
57
- }, 300);
96
+ clearShowTimer();
58
97
  }, [
59
- setOpen
98
+ clearShowTimer
60
99
  ]);
61
100
  const handleClick = useCallback(()=>{
62
- if (showHandle.current) {
63
- clearTimeout(showHandle.current);
64
- showHandle.current = void 0;
65
- } else if (isOpen.current) setOpen(false);
101
+ clearShowTimer();
102
+ }, [
103
+ clearShowTimer
104
+ ]);
105
+ const handleOpenChange = useCallback((open)=>{
106
+ clearShowTimer();
107
+ clearHideTimer();
108
+ setOpen(open);
66
109
  }, [
110
+ clearHideTimer,
111
+ clearShowTimer,
67
112
  setOpen
68
113
  ]);
114
+ const triggerProps = "hover" === openOn ? {
115
+ onClick: handleClick,
116
+ onMouseEnter: handleMouseEnter,
117
+ onMouseLeave: handleMouseLeave
118
+ } : void 0;
69
119
  return /*#__PURE__*/ jsxs(Overlay, {
70
120
  placement: placement,
71
- onOpenChange: onOpenChange,
121
+ onOpenChange: handleOpenChange,
72
122
  open: open,
73
123
  children: [
74
124
  /*#__PURE__*/ jsx(OverlayTrigger, {
75
125
  children: /*#__PURE__*/ jsx("div", {
76
- onClick: handleClick,
77
- onMouseEnter: handleMouseEnter,
78
- onMouseLeave: handleMouseLeave,
126
+ ...triggerProps,
127
+ ref: triggerRef,
79
128
  children: trigger
80
129
  })
81
130
  }),
82
131
  /*#__PURE__*/ jsx(OverlayPanel, {
132
+ className: `${classBase}-panel`,
133
+ ref: panelRef,
83
134
  children: /*#__PURE__*/ jsx(OverlayPanelContent, {
84
- onMouseEnter: handleOverlayMouseEnter,
85
- onMouseLeave: handleOverlayMouseLeave,
86
135
  children: children
87
136
  })
88
137
  })
89
138
  ]
90
139
  });
91
140
  };
92
- export { HoverOverlay };
141
+ export { HoverOverlay_HoverOverlay as HoverOverlay };
@@ -17,7 +17,11 @@ const itemName = (target)=>{
17
17
  if (name) return name;
18
18
  throw Error("[useItemPicker] item name could not be identified, data-name attribute not found");
19
19
  };
20
- const byItemName = ({ name: n1 }, { name: n2 })=>n1 > n2 ? 1 : n2 > n1 ? -1 : 0;
20
+ const byItemName = (item1, item2)=>{
21
+ const n1 = item1.label ? item1.label : item1.name;
22
+ const n2 = item2.label ? item2.label : item2.name;
23
+ return n1 > n2 ? 1 : n2 > n1 ? -1 : 0;
24
+ };
21
25
  const useItemPicker = ({ allItems, selectedItems, maxSelections, onSelectedItemsChange })=>{
22
26
  if (maxSelections && selectedItems.length > maxSelections) throw Error(`[useItemPicker] max selections ${maxSelections} exceeded by selected items (that has count ${selectedItems.length})`);
23
27
  const [searchPattern, setSearchPattern] = useState("");
@@ -3,6 +3,12 @@ import { ReactNode } from "react";
3
3
  export interface HoverOverlayProps extends Pick<OverlayProps, "placement" | "onOpenChange"> {
4
4
  children: ReactNode;
5
5
  open?: boolean;
6
+ /**
7
+ * hover (default) opens the overlay after a short delay when pointer
8
+ * enters trigger and closes it when pointer leaves both trigger and
9
+ * overlay. click leaves open/close entirely to Salt Overlay.
10
+ */
11
+ openOn?: "hover" | "click";
6
12
  trigger: ReactNode;
7
13
  }
8
- export declare const HoverOverlay: ({ children, open: openProp, onOpenChange, placement, trigger, }: HoverOverlayProps) => import("react/jsx-runtime").JSX.Element;
14
+ export declare const HoverOverlay: ({ children, open: openProp, onOpenChange, openOn, placement, trigger, }: HoverOverlayProps) => import("react/jsx-runtime").JSX.Element;
package/types/index.d.ts CHANGED
@@ -9,7 +9,7 @@ export * from "./drag-drop";
9
9
  export * from "./editable";
10
10
  export * from "./editable-label";
11
11
  export * from "./expando-input";
12
- export { HoverOverlay } from "./hover-overlay/HoverOverlay";
12
+ export { HoverOverlay, type HoverOverlayProps, } from "./hover-overlay/HoverOverlay";
13
13
  export * from "./icon-button";
14
14
  export * from "./instrument-picker";
15
15
  export { ItemPicker, type ItemPickerProps } from "./item-picker/ItemPicker";
@@ -1,13 +0,0 @@
1
- import { ReactElement, ReactNode } from "react";
2
- import { PromptProps } from "../prompt/Prompt";
3
- export type ShowDialog = (dialogContent: ReactElement, title: string, dialogActionButtons?: ReactElement[], hideCloseButton?: boolean) => void;
4
- export type ShowPrompt = (promptContent: ReactElement, promptProps: PromptProps) => void;
5
- export declare const ModalProvider: ({ children }: {
6
- children: ReactNode;
7
- }) => import("react/jsx-runtime").JSX.Element;
8
- export declare const useModal: () => {
9
- showDialog: ShowDialog;
10
- closeDialog: () => void;
11
- showPrompt: ShowPrompt;
12
- closePrompt: () => void;
13
- };
@@ -1,13 +0,0 @@
1
- import { type CalendarCarouselProps } from "./internal/CalendarCarousel";
2
- import { type CalendarNavigationProps } from "./internal/CalendarNavigation";
3
- import { type useCalendarProps } from "./useCalendar";
4
- export type CalendarProps = useCalendarProps & {
5
- className?: string;
6
- id?: string;
7
- renderDayContents?: CalendarCarouselProps["renderDayContents"];
8
- hideYearDropdown?: CalendarNavigationProps["hideYearDropdown"];
9
- borderedDropdown?: CalendarNavigationProps["borderedDropdown"];
10
- TooltipProps?: CalendarCarouselProps["TooltipProps"];
11
- hideOutOfRangeDates?: CalendarCarouselProps["hideOutOfRangeDates"];
12
- };
13
- export declare const Calendar: import("react").ForwardRefExoticComponent<CalendarProps & import("react").RefAttributes<HTMLDivElement>>;
@@ -1,4 +0,0 @@
1
- export * from "./Calendar";
2
- export * from "./useCalendarDay";
3
- export * from "./useCalendar";
4
- export * from "./useSelection";
@@ -1,3 +0,0 @@
1
- import { type CalendarMonthProps } from "./CalendarMonth";
2
- export type CalendarCarouselProps = Omit<CalendarMonthProps, "date">;
3
- export declare const CalendarCarousel: import("react").ForwardRefExoticComponent<Omit<CalendarCarouselProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
@@ -1,8 +0,0 @@
1
- import type { useCalendar } from "../useCalendar";
2
- interface CalendarState {
3
- state: ReturnType<typeof useCalendar>["state"];
4
- helpers: ReturnType<typeof useCalendar>["helpers"];
5
- }
6
- declare const CalendarContext: import("react").Context<CalendarState | null>;
7
- declare function useCalendarContext(): CalendarState;
8
- export { CalendarContext, useCalendarContext };
@@ -1,14 +0,0 @@
1
- import type { DateValue } from "@internationalized/date";
2
- import { type TooltipProps } from "@salt-ds/core";
3
- import { type ComponentPropsWithRef, type ReactElement } from "react";
4
- import { type DayStatus } from "../useCalendarDay";
5
- export type DateFormatter = (day: Date) => string | undefined;
6
- export interface CalendarDayProps extends Omit<ComponentPropsWithRef<"button">, "children"> {
7
- day: DateValue;
8
- formatDate?: DateFormatter;
9
- renderDayContents?: (date: DateValue, status: DayStatus) => ReactElement;
10
- status?: DayStatus;
11
- month: DateValue;
12
- TooltipProps?: Partial<TooltipProps>;
13
- }
14
- export declare const CalendarDay: import("react").ForwardRefExoticComponent<Omit<CalendarDayProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
@@ -1,10 +0,0 @@
1
- import type { DateValue } from "@internationalized/date";
2
- import { type ComponentPropsWithRef } from "react";
3
- import { type CalendarDayProps } from "./CalendarDay";
4
- export interface CalendarMonthProps extends ComponentPropsWithRef<"div"> {
5
- date: DateValue;
6
- hideOutOfRangeDates?: boolean;
7
- renderDayContents?: CalendarDayProps["renderDayContents"];
8
- TooltipProps?: CalendarDayProps["TooltipProps"];
9
- }
10
- export declare const CalendarMonth: import("react").ForwardRefExoticComponent<Omit<CalendarMonthProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
@@ -1,16 +0,0 @@
1
- import { type ButtonProps, type DropdownProps } from "@salt-ds/core";
2
- import { type ComponentPropsWithRef } from "react";
3
- import { type DateValue } from "@internationalized/date";
4
- type dateDropdownProps = DropdownProps<DateValue>;
5
- export interface CalendarNavigationProps extends ComponentPropsWithRef<"div"> {
6
- MonthDropdownProps?: dateDropdownProps;
7
- YearDropdownProps?: dateDropdownProps;
8
- onMonthSelect?: dateDropdownProps["onChange"];
9
- onYearSelect?: dateDropdownProps["onChange"];
10
- borderedDropdown?: dateDropdownProps["bordered"];
11
- onNavigateNext?: ButtonProps["onClick"];
12
- onNavigatePrevious?: ButtonProps["onClick"];
13
- hideYearDropdown?: boolean;
14
- }
15
- export declare const CalendarNavigation: import("react").ForwardRefExoticComponent<Omit<CalendarNavigationProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
16
- export {};
@@ -1,3 +0,0 @@
1
- import { type ComponentPropsWithRef } from "react";
2
- export type CalendarWeekHeaderProps = ComponentPropsWithRef<"div">;
3
- export declare const CalendarWeekHeader: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
@@ -1,9 +0,0 @@
1
- import { type DateValue } from "@internationalized/date";
2
- import type { FocusEventHandler, KeyboardEventHandler, MouseEventHandler } from "react";
3
- export declare function useFocusManagement({ date }: {
4
- date: DateValue;
5
- }): {
6
- handleClick: MouseEventHandler<HTMLButtonElement>;
7
- handleKeyDown: KeyboardEventHandler<HTMLButtonElement>;
8
- handleFocus: FocusEventHandler<HTMLButtonElement>;
9
- };
@@ -1,15 +0,0 @@
1
- import { DateFormatter, type DateValue } from "@internationalized/date";
2
- export declare function getCurrentLocale(): string;
3
- export declare function getDateFormatter(options?: Intl.DateTimeFormatOptions): DateFormatter;
4
- export declare function formatDate(date: DateValue, options?: Intl.DateTimeFormatOptions): string;
5
- export declare function getCalender(): import("@internationalized/date").Calendar;
6
- type WeekdayFormat = Intl.DateTimeFormatOptions["weekday"];
7
- export declare function daysForLocale(weekday?: WeekdayFormat): string[];
8
- export declare function monthsForLocale(currentYear: DateValue): (import("@internationalized/date").CalendarDate | import("@internationalized/date").CalendarDateTime | import("@internationalized/date").ZonedDateTime)[];
9
- export declare function generateVisibleDays(currentMonth: DateValue): {
10
- date: DateValue;
11
- dateOfMonth: number;
12
- isCurrentMonth: boolean;
13
- }[];
14
- export declare function monthDiff(a: DateValue, b: DateValue): number;
15
- export {};
@@ -1,54 +0,0 @@
1
- import { type DateValue } from "@internationalized/date";
2
- import { type SyntheticEvent } from "react";
3
- import { type UseMultiSelectionCalendarProps, type UseOffsetSelectionCalendarProps, type UseRangeSelectionCalendarProps, type UseSingleSelectionCalendarProps } from "./useSelection";
4
- interface BaseUseCalendarProps {
5
- defaultVisibleMonth?: DateValue;
6
- onVisibleMonthChange?: (event: SyntheticEvent, visibleMonth: DateValue) => void;
7
- isDayUnselectable?: (date: DateValue) => string | false | undefined;
8
- isDayHighlighted?: (date: DateValue) => string | false | undefined;
9
- isDayDisabled?: (date: DateValue) => boolean;
10
- visibleMonth?: DateValue;
11
- hideOutOfRangeDates?: boolean;
12
- hideYearDropdown?: boolean;
13
- minDate?: DateValue;
14
- maxDate?: DateValue;
15
- }
16
- export type useCalendarProps = (Omit<UseSingleSelectionCalendarProps, "isDaySelectable"> | Omit<UseMultiSelectionCalendarProps, "isDaySelectable"> | Omit<UseRangeSelectionCalendarProps, "isDaySelectable"> | Omit<UseOffsetSelectionCalendarProps, "isDaySelectable">) & BaseUseCalendarProps;
17
- export declare function useCalendar(props: useCalendarProps): {
18
- state: {
19
- selectedDate: DateValue[] | {
20
- startDate?: DateValue;
21
- endDate?: DateValue;
22
- } | import("./useSelection").RangeSelectionValueType | DateValue | null | undefined;
23
- hoveredDate: import("@internationalized/date").CalendarDate | import("@internationalized/date").CalendarDateTime | import("@internationalized/date").ZonedDateTime | null | undefined;
24
- visibleMonth: DateValue;
25
- focusedDate: DateValue;
26
- minDate: DateValue | undefined;
27
- maxDate: DateValue | undefined;
28
- selectionVariant: "default" | "multiselect" | "offset" | "range";
29
- hideOutOfRangeDates: boolean | undefined;
30
- calendarFocused: boolean;
31
- };
32
- helpers: {
33
- setSelectedDate: (event: SyntheticEvent<HTMLButtonElement>, newSelectedDate: DateValue) => void;
34
- isSelected: (date: DateValue) => boolean;
35
- setHoveredDate: (event: SyntheticEvent, date: DateValue | null) => void;
36
- isHovered: (date: DateValue) => boolean;
37
- isSelectedSpan: (date: DateValue) => boolean;
38
- isHoveredSpan: (date: DateValue) => boolean;
39
- isSelectedStart: (date: DateValue) => boolean;
40
- isSelectedEnd: (date: DateValue) => boolean;
41
- isHoveredOffset: (date: DateValue) => boolean;
42
- setVisibleMonth: (event: SyntheticEvent, newVisibleMonth: DateValue) => void;
43
- setFocusedDate: (event: SyntheticEvent, date: DateValue) => void;
44
- setCalendarFocused: import("react").Dispatch<import("react").SetStateAction<boolean>>;
45
- isDayUnselectable: (date: DateValue) => string | false | undefined;
46
- isDayHighlighted: (date: DateValue) => string | false | undefined;
47
- isDayDisabled: (date: DateValue) => boolean;
48
- isDayVisible: (date: DateValue) => boolean;
49
- isOutsideAllowedDates: (date: DateValue) => boolean;
50
- isOutsideAllowedMonths: (date: DateValue) => boolean;
51
- isOutsideAllowedYears: (date: DateValue) => boolean;
52
- };
53
- };
54
- export {};
@@ -1,22 +0,0 @@
1
- import { type DateValue } from "@internationalized/date";
2
- import { type ComponentPropsWithoutRef, type RefObject } from "react";
3
- export interface DayStatus {
4
- outOfRange?: boolean;
5
- selected?: boolean;
6
- today?: boolean;
7
- unselectable?: string | false;
8
- highlighted?: string | false;
9
- focused?: boolean;
10
- disabled?: boolean;
11
- hidden?: boolean;
12
- }
13
- export interface useCalendarDayProps {
14
- date: DateValue;
15
- month: DateValue;
16
- }
17
- export declare function useCalendarDay({ date, month }: useCalendarDayProps, ref: RefObject<HTMLElement | null>): {
18
- status: DayStatus;
19
- dayProps: ComponentPropsWithoutRef<"button">;
20
- unselectableReason: string | false | undefined;
21
- highlightedReason: string | false | undefined;
22
- };
@@ -1,78 +0,0 @@
1
- import { CalendarDate, type DateValue } from "@internationalized/date";
2
- import type { KeyboardEventHandler, MouseEventHandler, SyntheticEvent } from "react";
3
- interface BaseUseSelectionCalendarProps<SelectionVariantType> {
4
- hoveredDate?: DateValue | null;
5
- selectedDate?: SelectionVariantType | null;
6
- defaultSelectedDate?: SelectionVariantType;
7
- onSelectedDateChange?: (event: SyntheticEvent, selectedDate: SelectionVariantType) => void;
8
- isDaySelectable: (date?: DateValue) => boolean;
9
- onHoveredDateChange?: (event: SyntheticEvent, hoveredDate: DateValue | null) => void;
10
- }
11
- export type SingleSelectionValueType = DateValue;
12
- type MultiSelectionValueType = DateValue[];
13
- export type RangeSelectionValueType = {
14
- startDate?: DateValue;
15
- endDate?: DateValue;
16
- };
17
- type OffsetSelectionValueType = {
18
- startDate?: DateValue;
19
- endDate?: DateValue;
20
- };
21
- type AllSelectionValueType = SingleSelectionValueType | MultiSelectionValueType | RangeSelectionValueType | OffsetSelectionValueType | null;
22
- export interface UseOffsetSelectionCalendarProps extends Omit<BaseUseSelectionCalendarProps<OffsetSelectionValueType>, "startDateOffset" | "endDateOffset"> {
23
- selectionVariant: "offset";
24
- startDateOffset?: (date: DateValue) => DateValue;
25
- endDateOffset?: (date: DateValue) => DateValue;
26
- }
27
- export interface UseRangeSelectionCalendarProps extends BaseUseSelectionCalendarProps<RangeSelectionValueType> {
28
- selectionVariant: "range";
29
- }
30
- export interface UseMultiSelectionCalendarProps extends BaseUseSelectionCalendarProps<MultiSelectionValueType> {
31
- selectionVariant: "multiselect";
32
- }
33
- export interface UseSingleSelectionCalendarProps extends BaseUseSelectionCalendarProps<SingleSelectionValueType> {
34
- selectionVariant: "default";
35
- }
36
- export type useSelectionCalendarProps = UseSingleSelectionCalendarProps | UseMultiSelectionCalendarProps | UseRangeSelectionCalendarProps | UseOffsetSelectionCalendarProps;
37
- export declare function isRangeOrOffsetSelectionValue(selectionValue?: AllSelectionValueType): selectionValue is RangeSelectionValueType | OffsetSelectionValueType;
38
- export declare function isRangeOrOffsetSelectionWithStartDate(selectionValue?: AllSelectionValueType): selectionValue is RangeSelectionValueType | OffsetSelectionValueType;
39
- export declare function useSelectionCalendar(props: useSelectionCalendarProps): {
40
- state: {
41
- selectedDate: MultiSelectionValueType | OffsetSelectionValueType | RangeSelectionValueType | DateValue | null | undefined;
42
- hoveredDate: CalendarDate | import("@internationalized/date").CalendarDateTime | import("@internationalized/date").ZonedDateTime | null | undefined;
43
- };
44
- helpers: {
45
- setSelectedDate: (event: SyntheticEvent<HTMLButtonElement>, newSelectedDate: DateValue) => void;
46
- isSelected: (date: DateValue) => boolean;
47
- setHoveredDate: (event: SyntheticEvent, date: DateValue | null) => void;
48
- isHovered: (date: DateValue) => boolean;
49
- isSelectedSpan: (date: DateValue) => boolean;
50
- isHoveredSpan: (date: DateValue) => boolean;
51
- isSelectedStart: (date: DateValue) => boolean;
52
- isSelectedEnd: (date: DateValue) => boolean;
53
- isHoveredOffset: (date: DateValue) => boolean;
54
- };
55
- };
56
- export declare function useSelectionDay({ date }: {
57
- date: DateValue;
58
- }): {
59
- handleClick: MouseEventHandler<HTMLButtonElement>;
60
- handleKeyDown: KeyboardEventHandler<HTMLButtonElement>;
61
- handleMouseOver: MouseEventHandler<HTMLButtonElement>;
62
- handleMouseLeave: MouseEventHandler<HTMLButtonElement>;
63
- status: {
64
- selected: boolean;
65
- selectedSpan: boolean;
66
- hoveredSpan: boolean;
67
- selectedStart: boolean;
68
- selectedEnd: boolean;
69
- hovered: boolean;
70
- hoveredOffset: boolean;
71
- };
72
- dayProps: {
73
- className: string;
74
- "aria-pressed": string | undefined;
75
- "aria-disabled": string | undefined;
76
- };
77
- };
78
- export {};
@@ -1,7 +0,0 @@
1
- import { IconButtonProps } from "../icon-button";
2
- import { ColumnSearchProps } from "./ColumnSearch";
3
- export interface ColumnPickerProps extends Omit<IconButtonProps, "icon">, Pick<ColumnSearchProps, "columns" | "onSelectionChange" | "selected"> {
4
- icon?: string;
5
- iconSize?: number;
6
- }
7
- export declare const ColumnPicker: import("react").ForwardRefExoticComponent<ColumnPickerProps & import("react").RefAttributes<HTMLButtonElement>>;
@@ -1,12 +0,0 @@
1
- import { ListBoxProps } from "@salt-ds/core";
2
- import { HTMLAttributes } from "react";
3
- export interface ColumnSearchProps extends HTMLAttributes<HTMLDivElement>, Pick<ListBoxProps, "onSelectionChange" | "selected"> {
4
- columns: string[];
5
- onReorderColumns: (columns: string[]) => void;
6
- }
7
- /**
8
- * @deprecated
9
- *
10
- * use ColumnList instead
11
- */
12
- export declare const ColumnSearch: import("react").ForwardRefExoticComponent<ColumnSearchProps & import("react").RefAttributes<HTMLDivElement>>;
@@ -1,2 +0,0 @@
1
- export * from "./ColumnPicker";
2
- export * from "./ColumnSearch";
@@ -1,14 +0,0 @@
1
- import type { DataSourceRow } from "@vuu-ui/vuu-data-types";
2
- import type { VuuRange } from "@vuu-ui/vuu-protocol-types";
3
- export declare class MovingWindow {
4
- data: DataSourceRow[];
5
- rowCount: number;
6
- private range;
7
- constructor({ from, to }: VuuRange);
8
- setRowCount: (rowCount: number) => void;
9
- add(data: DataSourceRow): void;
10
- getAtIndex(index: number): DataSourceRow | undefined;
11
- isWithinRange(index: number): boolean;
12
- setRange({ from, to }: VuuRange): void;
13
- getSelectedRows(): DataSourceRow[];
14
- }
@@ -1,3 +0,0 @@
1
- export * from "./useControlled";
2
- export * from "./use-resize-observer";
3
- export * from "./selectionTypes";