@vuu-ui/vuu-ui-controls 0.0.26

package/esm/tree/useTree.js

@@ -0,0 +1,104 @@
+import { useRef, useCallback } from 'react';
+import { useKeyboardNavigation } from './use-keyboard-navigation.js';
+import { useSelection } from './use-selection.js';
+import { useHierarchicalData } from './use-hierarchical-data.js';
+import { useCollapsibleGroups } from './use-collapsible-groups.js';
+import { useTreeKeyboardNavigation } from './use-tree-keyboard-navigation.js';
+
+const EMPTY_ARRAY = [];
+const useTree = ({
+  defaultSelected,
+  sourceWithIds,
+  onChange,
+  onHighlight: onHighlightProp,
+  selected: selectedProp,
+  selection
+}) => {
+  const lastSelection = useRef(EMPTY_ARRAY);
+  const dataHook = useHierarchicalData(sourceWithIds);
+  const handleKeyboardNavigation = (evt, nextIdx) => {
+    selectionHook.listHandlers.onKeyboardNavigation?.(evt, nextIdx);
+  };
+  const { highlightedIdx, ...keyboardHook } = useKeyboardNavigation({
+    treeNodes: dataHook.indexPositions,
+    onHighlight: onHighlightProp,
+    onKeyboardNavigation: handleKeyboardNavigation,
+    selected: lastSelection.current
+  });
+  const collapsibleHook = useCollapsibleGroups({
+    collapsibleHeaders: true,
+    highlightedIdx,
+    treeNodes: dataHook.indexPositions,
+    setVisibleData: dataHook.setData,
+    source: dataHook.data
+  });
+  const selectionHook = useSelection({
+    defaultSelected,
+    highlightedIdx,
+    treeNodes: dataHook.indexPositions,
+    onChange,
+    selected: selectedProp,
+    selection
+  });
+  const treeNavigationHook = useTreeKeyboardNavigation({
+    source: dataHook.data,
+    highlightedIdx,
+    hiliteItemAtIndex: keyboardHook.hiliteItemAtIndex,
+    indexPositions: dataHook.indexPositions
+  });
+  const handleClick = useCallback(
+    (evt) => {
+      collapsibleHook.listItemHandlers?.onClick(evt);
+      if (!evt.defaultPrevented) {
+        selectionHook.listItemHandlers?.onClick?.(evt);
+      }
+    },
+    [collapsibleHook, selectionHook]
+  );
+  const handleKeyDown = useCallback(
+    (evt) => {
+      keyboardHook.listProps.onKeyDown?.(evt);
+      if (!evt.defaultPrevented) {
+        selectionHook.listHandlers.onKeyDown?.(evt);
+      }
+      if (!evt.defaultPrevented) {
+        collapsibleHook.listHandlers.onKeyDown?.(evt);
+      }
+      if (!evt.defaultPrevented) {
+        treeNavigationHook.listHandlers.onKeyDown?.(evt);
+      }
+    },
+    [
+      collapsibleHook.listHandlers,
+      keyboardHook.listProps,
+      selectionHook.listHandlers,
+      treeNavigationHook.listHandlers
+    ]
+  );
+  const getActiveDescendant = () => highlightedIdx === void 0 || highlightedIdx === -1 ? void 0 : dataHook.indexPositions[highlightedIdx]?.id;
+  lastSelection.current = selectionHook.selected;
+  const listProps = {
+    "aria-activedescendant": getActiveDescendant(),
+    onBlur: keyboardHook.listProps.onBlur,
+    onFocus: keyboardHook.listProps.onFocus,
+    onKeyDown: handleKeyDown,
+    onMouseDownCapture: keyboardHook.listProps.onMouseDownCapture,
+    onMouseLeave: keyboardHook.listProps.onMouseLeave,
+    onMouseMove: keyboardHook.listProps.onMouseMove
+  };
+  const listItemHandlers = {
+    onClick: handleClick
+  };
+  return {
+    focusVisible: keyboardHook.focusVisible,
+    highlightedIdx,
+    hiliteItemAtIndex: keyboardHook.hiliteItemAtIndex,
+    listProps,
+    listItemHandlers,
+    selected: selectionHook.selected,
+    visibleData: dataHook.data
+  };
+};
+
+export { useTree };
+//# sourceMappingURL=useTree.js.map

package/esm/tree/useTree.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTree.js","sources":["../../src/tree/useTree.ts"],"sourcesContent":["import { KeyboardEvent, useCallback, useRef } from \"react\";\nimport { useKeyboardNavigation } from \"./use-keyboard-navigation\";\nimport {\n  GroupSelection,\n  TreeNodeSelectionHandler,\n  TreeSelection,\n  useSelection,\n} from \"./use-selection\";\nimport { useHierarchicalData } from \"./use-hierarchical-data\";\nimport { useCollapsibleGroups } from \"./use-collapsible-groups\";\nimport { useTreeKeyboardNavigation } from \"./use-tree-keyboard-navigation\";\nimport type { NormalisedTreeSourceNode } from \"./treeTypes\";\n\nconst EMPTY_ARRAY: string[] = [];\n\nexport interface TreeHookProps {\n  defaultSelected?: string[];\n  groupSelection: GroupSelection;\n  onChange: TreeNodeSelectionHandler;\n  onHighlight?: (index: number) => void;\n  selected?: string[];\n  selection: TreeSelection;\n  sourceWithIds: NormalisedTreeSourceNode[];\n}\n\nexport const useTree = ({\n  defaultSelected,\n  sourceWithIds,\n  onChange,\n  onHighlight: onHighlightProp,\n  selected: selectedProp,\n  selection,\n}: TreeHookProps) => {\n  const lastSelection = useRef<string[]>(EMPTY_ARRAY);\n  const dataHook = useHierarchicalData(sourceWithIds);\n\n  const handleKeyboardNavigation = (evt: KeyboardEvent, nextIdx: number) => {\n    selectionHook.listHandlers.onKeyboardNavigation?.(evt, nextIdx);\n  };\n\n  const { highlightedIdx, ...keyboardHook } = useKeyboardNavigation({\n    treeNodes: dataHook.indexPositions,\n    onHighlight: onHighlightProp,\n    onKeyboardNavigation: handleKeyboardNavigation,\n    selected: lastSelection.current,\n  });\n\n  const collapsibleHook = useCollapsibleGroups({\n    collapsibleHeaders: true,\n    highlightedIdx,\n    treeNodes: dataHook.indexPositions,\n    setVisibleData: dataHook.setData,\n    source: dataHook.data,\n  });\n\n  const selectionHook = useSelection({\n    defaultSelected,\n    highlightedIdx,\n    treeNodes: dataHook.indexPositions,\n    onChange,\n    selected: selectedProp,\n    selection,\n  });\n\n  const treeNavigationHook = useTreeKeyboardNavigation({\n    source: dataHook.data,\n    highlightedIdx,\n    hiliteItemAtIndex: keyboardHook.hiliteItemAtIndex,\n    indexPositions: dataHook.indexPositions,\n  });\n\n  const handleClick = useCallback(\n    (evt) => {\n      collapsibleHook.listItemHandlers?.onClick(evt);\n      if (!evt.defaultPrevented) {\n        selectionHook.listItemHandlers?.onClick?.(evt);\n      }\n    },\n    [collapsibleHook, selectionHook]\n  );\n\n  const handleKeyDown = useCallback(\n    (evt) => {\n      keyboardHook.listProps.onKeyDown?.(evt);\n      if (!evt.defaultPrevented) {\n        selectionHook.listHandlers.onKeyDown?.(evt);\n      }\n      if (!evt.defaultPrevented) {\n        collapsibleHook.listHandlers.onKeyDown?.(evt);\n      }\n      if (!evt.defaultPrevented) {\n        treeNavigationHook.listHandlers.onKeyDown?.(evt);\n      }\n    },\n    [\n      collapsibleHook.listHandlers,\n      keyboardHook.listProps,\n      selectionHook.listHandlers,\n      treeNavigationHook.listHandlers,\n    ]\n  );\n\n  const getActiveDescendant = () =>\n    highlightedIdx === undefined || highlightedIdx === -1\n      ? undefined\n      : dataHook.indexPositions[highlightedIdx]?.id;\n\n  // We need this on reEntry for navigation hook to handle focus\n  lastSelection.current = selectionHook.selected;\n\n  const listProps = {\n    \"aria-activedescendant\": getActiveDescendant(),\n    onBlur: keyboardHook.listProps.onBlur,\n    onFocus: keyboardHook.listProps.onFocus,\n    onKeyDown: handleKeyDown,\n    onMouseDownCapture: keyboardHook.listProps.onMouseDownCapture,\n    onMouseLeave: keyboardHook.listProps.onMouseLeave,\n    onMouseMove: keyboardHook.listProps.onMouseMove,\n  };\n\n  const listItemHandlers = {\n    onClick: handleClick,\n  };\n\n  return {\n    focusVisible: keyboardHook.focusVisible,\n    highlightedIdx,\n    hiliteItemAtIndex: keyboardHook.hiliteItemAtIndex,\n    listProps,\n    listItemHandlers,\n    selected: selectionHook.selected,\n    visibleData: dataHook.data,\n  };\n};\n"],"names":[],"mappings":";;;;;;;AAaA,MAAM,cAAwB,EAAC,CAAA;AAYxB,MAAM,UAAU,CAAC;AAAA,EACtB,eAAA;AAAA,EACA,aAAA;AAAA,EACA,QAAA;AAAA,EACA,WAAa,EAAA,eAAA;AAAA,EACb,QAAU,EAAA,YAAA;AAAA,EACV,SAAA;AACF,CAAqB,KAAA;AACnB,EAAM,MAAA,aAAA,GAAgB,OAAiB,WAAW,CAAA,CAAA;AAClD,EAAM,MAAA,QAAA,GAAW,oBAAoB,aAAa,CAAA,CAAA;AAElD,EAAM,MAAA,wBAAA,GAA2B,CAAC,GAAA,EAAoB,OAAoB,KAAA;AACxE,IAAc,aAAA,CAAA,YAAA,CAAa,oBAAuB,GAAA,GAAA,EAAK,OAAO,CAAA,CAAA;AAAA,GAChE,CAAA;AAEA,EAAA,MAAM,EAAE,cAAA,EAAgB,GAAG,YAAA,KAAiB,qBAAsB,CAAA;AAAA,IAChE,WAAW,QAAS,CAAA,cAAA;AAAA,IACpB,WAAa,EAAA,eAAA;AAAA,IACb,oBAAsB,EAAA,wBAAA;AAAA,IACtB,UAAU,aAAc,CAAA,OAAA;AAAA,GACzB,CAAA,CAAA;AAED,EAAA,MAAM,kBAAkB,oBAAqB,CAAA;AAAA,IAC3C,kBAAoB,EAAA,IAAA;AAAA,IACpB,cAAA;AAAA,IACA,WAAW,QAAS,CAAA,cAAA;AAAA,IACpB,gBAAgB,QAAS,CAAA,OAAA;AAAA,IACzB,QAAQ,QAAS,CAAA,IAAA;AAAA,GAClB,CAAA,CAAA;AAED,EAAA,MAAM,gBAAgB,YAAa,CAAA;AAAA,IACjC,eAAA;AAAA,IACA,cAAA;AAAA,IACA,WAAW,QAAS,CAAA,cAAA;AAAA,IACpB,QAAA;AAAA,IACA,QAAU,EAAA,YAAA;AAAA,IACV,SAAA;AAAA,GACD,CAAA,CAAA;AAED,EAAA,MAAM,qBAAqB,yBAA0B,CAAA;AAAA,IACnD,QAAQ,QAAS,CAAA,IAAA;AAAA,IACjB,cAAA;AAAA,IACA,mBAAmB,YAAa,CAAA,iBAAA;AAAA,IAChC,gBAAgB,QAAS,CAAA,cAAA;AAAA,GAC1B,CAAA,CAAA;AAED,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,CAAC,GAAQ,KAAA;AACP,MAAgB,eAAA,CAAA,gBAAA,EAAkB,QAAQ,GAAG,CAAA,CAAA;AAC7C,MAAI,IAAA,CAAC,IAAI,gBAAkB,EAAA;AACzB,QAAc,aAAA,CAAA,gBAAA,EAAkB,UAAU,GAAG,CAAA,CAAA;AAAA,OAC/C;AAAA,KACF;AAAA,IACA,CAAC,iBAAiB,aAAa,CAAA;AAAA,GACjC,CAAA;AAEA,EAAA,MAAM,aAAgB,GAAA,WAAA;AAAA,IACpB,CAAC,GAAQ,KAAA;AACP,MAAa,YAAA,CAAA,SAAA,CAAU,YAAY,GAAG,CAAA,CAAA;AACtC,MAAI,IAAA,CAAC,IAAI,gBAAkB,EAAA;AACzB,QAAc,aAAA,CAAA,YAAA,CAAa,YAAY,GAAG,CAAA,CAAA;AAAA,OAC5C;AACA,MAAI,IAAA,CAAC,IAAI,gBAAkB,EAAA;AACzB,QAAgB,eAAA,CAAA,YAAA,CAAa,YAAY,GAAG,CAAA,CAAA;AAAA,OAC9C;AACA,MAAI,IAAA,CAAC,IAAI,gBAAkB,EAAA;AACzB,QAAmB,kBAAA,CAAA,YAAA,CAAa,YAAY,GAAG,CAAA,CAAA;AAAA,OACjD;AAAA,KACF;AAAA,IACA;AAAA,MACE,eAAgB,CAAA,YAAA;AAAA,MAChB,YAAa,CAAA,SAAA;AAAA,MACb,aAAc,CAAA,YAAA;AAAA,MACd,kBAAmB,CAAA,YAAA;AAAA,KACrB;AAAA,GACF,CAAA;AAEA,EAAM,MAAA,mBAAA,GAAsB,MAC1B,cAAA,KAAmB,KAAa,CAAA,IAAA,cAAA,KAAmB,KAC/C,KACA,CAAA,GAAA,QAAA,CAAS,cAAe,CAAA,cAAc,CAAG,EAAA,EAAA,CAAA;AAG/C,EAAA,aAAA,CAAc,UAAU,aAAc,CAAA,QAAA,CAAA;AAEtC,EAAA,MAAM,SAAY,GAAA;AAAA,IAChB,yBAAyB,mBAAoB,EAAA;AAAA,IAC7C,MAAA,EAAQ,aAAa,SAAU,CAAA,MAAA;AAAA,IAC/B,OAAA,EAAS,aAAa,SAAU,CAAA,OAAA;AAAA,IAChC,SAAW,EAAA,aAAA;AAAA,IACX,kBAAA,EAAoB,aAAa,SAAU,CAAA,kBAAA;AAAA,IAC3C,YAAA,EAAc,aAAa,SAAU,CAAA,YAAA;AAAA,IACrC,WAAA,EAAa,aAAa,SAAU,CAAA,WAAA;AAAA,GACtC,CAAA;AAEA,EAAA,MAAM,gBAAmB,GAAA;AAAA,IACvB,OAAS,EAAA,WAAA;AAAA,GACX,CAAA;AAEA,EAAO,OAAA;AAAA,IACL,cAAc,YAAa,CAAA,YAAA;AAAA,IAC3B,cAAA;AAAA,IACA,mBAAmB,YAAa,CAAA,iBAAA;AAAA,IAChC,SAAA;AAAA,IACA,gBAAA;AAAA,IACA,UAAU,aAAc,CAAA,QAAA;AAAA,IACxB,aAAa,QAAS,CAAA,IAAA;AAAA,GACxB,CAAA;AACF;;;;"}

package/esm/utils/escapeRegExp.js

@@ -0,0 +1,7 @@
+const regExp = /[.*+?^${}()|[\]\\]/g;
+function escapeRegExp(string) {
+  return string.replace(regExp, "\\$&");
+}
+
+export { escapeRegExp };
+//# sourceMappingURL=escapeRegExp.js.map

package/esm/utils/escapeRegExp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"escapeRegExp.js","sources":["../../src/utils/escapeRegExp.ts"],"sourcesContent":["const regExp = /[.*+?^${}()|[\\]\\\\]/g;\n\nexport function escapeRegExp(string: string): string {\n  return string.replace(regExp, \"\\\\$&\");\n}\n"],"names":[],"mappings":"AAAA,MAAM,MAAS,GAAA,qBAAA,CAAA;AAER,SAAS,aAAa,MAAwB,EAAA;AACnD,EAAO,OAAA,MAAA,CAAO,OAAQ,CAAA,MAAA,EAAQ,MAAM,CAAA,CAAA;AACtC;;;;"}

package/esm/utils/forwardCallbackProps.js

@@ -0,0 +1,20 @@
+const forwardCallbackProps = (ownProps, overrideProps) => {
+  const props = Object.keys(ownProps).reduce(
+    (map, name) => {
+      const ownProp = ownProps[name];
+      const overrideProp = overrideProps[name];
+      if (typeof ownProp === "function" && typeof overrideProp === "function") {
+        map[name] = (...args) => {
+          ownProp(...args);
+          overrideProp(...args);
+        };
+      }
+      return map;
+    },
+    { ...overrideProps }
+  );
+  return props;
+};
+
+export { forwardCallbackProps };
+//# sourceMappingURL=forwardCallbackProps.js.map

package/esm/utils/forwardCallbackProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"forwardCallbackProps.js","sources":["../../src/utils/forwardCallbackProps.ts"],"sourcesContent":["/*\n  When we clone a React element and inject props, if any of these are\n  callback props, make sure original callback props are also invoked.\n\n React.cloneElement(\n    element,\n    forwardCallbackProps(element.props, overrideProps)\n  )\n */\n\ntype Props = Record<string, unknown>;\n\nexport const forwardCallbackProps = <P1 extends Props, P2 extends Props>(\n  ownProps: P1,\n  overrideProps: P2\n): P1 & P2 => {\n  const props = Object.keys(ownProps).reduce<Props>(\n    (map, name) => {\n      const ownProp = ownProps[name];\n      const overrideProp = overrideProps[name];\n      if (typeof ownProp === \"function\" && typeof overrideProp === \"function\") {\n        map[name] = (...args: unknown[]) => {\n          ownProp(...args);\n          overrideProp(...args);\n        };\n      }\n      return map;\n    },\n    { ...overrideProps }\n  );\n\n  return props as P1 & P2;\n};\n"],"names":[],"mappings":"AAYa,MAAA,oBAAA,GAAuB,CAClC,QAAA,EACA,aACY,KAAA;AACZ,EAAA,MAAM,KAAQ,GAAA,MAAA,CAAO,IAAK,CAAA,QAAQ,CAAE,CAAA,MAAA;AAAA,IAClC,CAAC,KAAK,IAAS,KAAA;AACb,MAAM,MAAA,OAAA,GAAU,SAAS,IAAI,CAAA,CAAA;AAC7B,MAAM,MAAA,YAAA,GAAe,cAAc,IAAI,CAAA,CAAA;AACvC,MAAA,IAAI,OAAO,OAAA,KAAY,UAAc,IAAA,OAAO,iBAAiB,UAAY,EAAA;AACvE,QAAI,GAAA,CAAA,IAAI,CAAI,GAAA,CAAA,GAAI,IAAoB,KAAA;AAClC,UAAA,OAAA,CAAQ,GAAG,IAAI,CAAA,CAAA;AACf,UAAA,YAAA,CAAa,GAAG,IAAI,CAAA,CAAA;AAAA,SACtB,CAAA;AAAA,OACF;AACA,MAAO,OAAA,GAAA,CAAA;AAAA,KACT;AAAA,IACA,EAAE,GAAG,aAAc,EAAA;AAAA,GACrB,CAAA;AAEA,EAAO,OAAA,KAAA,CAAA;AACT;;;;"}

package/esm/utils/isOverflowElement.js

@@ -0,0 +1,6 @@
+const isOverflowElement = (element) => element !== null && element.dataset.index === "overflow" && element.parentElement !== null && element.parentElement.classList.contains(
+  "vuuOverflowContainer-wrapContainer-overflowed"
+);
+
+export { isOverflowElement };
+//# sourceMappingURL=isOverflowElement.js.map

package/esm/utils/isOverflowElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"isOverflowElement.js","sources":["../../src/utils/isOverflowElement.ts"],"sourcesContent":["// TODO this is very fragile\nexport const isOverflowElement = (element: HTMLElement | null) =>\n  element !== null &&\n  element.dataset.index === \"overflow\" &&\n  element.parentElement !== null &&\n  element.parentElement.classList.contains(\n    \"vuuOverflowContainer-wrapContainer-overflowed\"\n  );\n"],"names":[],"mappings":"AACO,MAAM,iBAAoB,GAAA,CAAC,OAChC,KAAA,OAAA,KAAY,QACZ,OAAQ,CAAA,OAAA,CAAQ,KAAU,KAAA,UAAA,IAC1B,OAAQ,CAAA,aAAA,KAAkB,IAC1B,IAAA,OAAA,CAAQ,cAAc,SAAU,CAAA,QAAA;AAAA,EAC9B,+CAAA;AACF;;;;"}

package/esm/vuu-input/VuuInput.css.js

@@ -0,0 +1,4 @@
+var vuuInputCss = ".vuuInput {\n    --vuu-icon-size: 16px;\n}\n\n.vuuInput-errorIcon:after {\n    cursor: pointer;\n}";
+
+export { vuuInputCss as default };
+//# sourceMappingURL=VuuInput.css.js.map

package/esm/vuu-input/VuuInput.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VuuInput.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/esm/vuu-input/VuuInput.js

@@ -0,0 +1,103 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { useTooltip, Tooltip } from '@vuu-ui/vuu-popups';
+import { useId, isValidNumber } from '@vuu-ui/vuu-utils';
+import { Input } from '@salt-ds/core';
+import cx from 'clsx';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
+import { forwardRef, useCallback } from 'react';
+import vuuInputCss from './VuuInput.css.js';
+
+const classBase = "vuuInput";
+const constantInputProps = {
+  autoComplete: "off"
+};
+const VuuInput = forwardRef(function VuuInput2({
+  className,
+  errorMessage,
+  id: idProp,
+  onCommit,
+  onKeyDown,
+  type,
+  ...props
+}, forwardedRef) {
+  const targetWindow = useWindow();
+  useComponentCssInjection({
+    testId: "vuu-input",
+    css: vuuInputCss,
+    window: targetWindow
+  });
+  const id = useId(idProp);
+  const { anchorProps, tooltipProps } = useTooltip({
+    id,
+    tooltipContent: errorMessage
+  });
+  const commitValue = useCallback(
+    (evt, value) => {
+      if (type === "number") {
+        const numericValue = parseFloat(value);
+        if (isValidNumber(numericValue)) {
+          onCommit(evt, numericValue);
+        } else {
+          throw Error("Invalid value");
+        }
+      } else if (type === "boolean") {
+        onCommit(evt, Boolean(value));
+      } else {
+        onCommit(evt, value);
+      }
+    },
+    [onCommit, type]
+  );
+  const handleKeyDown = useCallback(
+    (evt) => {
+      if (evt.key === "Enter") {
+        evt.preventDefault();
+        evt.stopPropagation();
+        const { value } = evt.target;
+        commitValue(evt, value);
+      }
+      onKeyDown?.(evt);
+    },
+    [commitValue, onKeyDown]
+  );
+  const handleBlur = useCallback(
+    (evt) => {
+      const { value } = evt.target;
+      commitValue(evt, value);
+    },
+    [commitValue]
+  );
+  const endAdornment = errorMessage ? /* @__PURE__ */ jsx(
+    "span",
+    {
+      ...anchorProps,
+      className: `${classBase}-errorIcon`,
+      "data-icon": "error"
+    }
+  ) : void 0;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      Input,
+      {
+        ...props,
+        endAdornment,
+        id,
+        inputProps: {
+          ...constantInputProps,
+          ...props.inputProps
+        },
+        className: cx(classBase, className, {
+          [`${classBase}-errror`]: errorMessage
+        }),
+        onBlur: handleBlur,
+        ref: forwardedRef,
+        onKeyDown: handleKeyDown
+      }
+    ),
+    tooltipProps ? /* @__PURE__ */ jsx(Tooltip, { ...tooltipProps, status: "error" }) : null
+  ] });
+});
+
+export { VuuInput };
+//# sourceMappingURL=VuuInput.js.map

package/esm/vuu-input/VuuInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VuuInput.js","sources":["../../src/vuu-input/VuuInput.tsx"],"sourcesContent":["import { Tooltip, useTooltip } from \"@vuu-ui/vuu-popups\";\nimport { VuuRowDataItemType } from \"@vuu-ui/vuu-protocol-types\";\nimport { isValidNumber, useId } from \"@vuu-ui/vuu-utils\";\nimport { Input, InputProps } from \"@salt-ds/core\";\nimport cx from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n  FocusEventHandler,\n  ForwardedRef,\n  forwardRef,\n  KeyboardEventHandler,\n  ReactElement,\n  SyntheticEvent,\n  useCallback,\n} from \"react\";\n\nimport vuuInputCss from \"./VuuInput.css\";\n\nconst classBase = \"vuuInput\";\n\nconst constantInputProps = {\n  autoComplete: \"off\",\n};\n\nexport type Commithandler<T extends VuuRowDataItemType = string> = (\n  evt: SyntheticEvent<HTMLInputElement>,\n  value: T\n) => void;\nexport interface VuuInputProps<T extends VuuRowDataItemType = string>\n  extends InputProps {\n  errorMessage?: string;\n  onCommit: Commithandler<T>;\n  type?: T;\n}\n\n/**\n * A variant of Salt Input that provides a commit callback prop,\n * TODO along with cancel behaviour ?\n */\nexport const VuuInput = forwardRef(function VuuInput<\n  T extends VuuRowDataItemType = string\n>(\n  {\n    className,\n    errorMessage,\n    id: idProp,\n    onCommit,\n    onKeyDown,\n    type,\n    ...props\n  }: VuuInputProps<T>,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-input\",\n    css: vuuInputCss,\n    window: targetWindow,\n  });\n\n  const id = useId(idProp);\n  const { anchorProps, tooltipProps } = useTooltip({\n    id,\n    tooltipContent: errorMessage,\n  });\n\n  const commitValue = useCallback<Commithandler<string>>(\n    (evt, value) => {\n      if (type === \"number\") {\n        const numericValue = parseFloat(value);\n        if (isValidNumber(numericValue)) {\n          onCommit(evt, numericValue as T);\n        } else {\n          //TODO add validation logic\n          throw Error(\"Invalid value\");\n        }\n      } else if (type === \"boolean\") {\n        onCommit(evt, Boolean(value) as T);\n      } else {\n        onCommit(evt, value as T);\n      }\n    },\n    [onCommit, type]\n  );\n\n  const handleKeyDown = useCallback<KeyboardEventHandler<HTMLInputElement>>(\n    (evt) => {\n      if (evt.key === \"Enter\") {\n        evt.preventDefault();\n        evt.stopPropagation();\n        const { value } = evt.target as HTMLInputElement;\n        commitValue(evt, value);\n      }\n      onKeyDown?.(evt);\n    },\n    [commitValue, onKeyDown]\n  );\n\n  const handleBlur = useCallback<FocusEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const { value } = evt.target as HTMLInputElement;\n      commitValue(evt, value);\n    },\n    [commitValue]\n  );\n\n  const endAdornment = errorMessage ? (\n    <span\n      {...anchorProps}\n      className={`${classBase}-errorIcon`}\n      data-icon=\"error\"\n    />\n  ) : undefined;\n\n  return (\n    <>\n      <Input\n        {...props}\n        endAdornment={endAdornment}\n        id={id}\n        inputProps={{\n          ...constantInputProps,\n          ...props.inputProps,\n        }}\n        className={cx(classBase, className, {\n          [`${classBase}-errror`]: errorMessage,\n        })}\n        onBlur={handleBlur}\n        ref={forwardedRef}\n        onKeyDown={handleKeyDown}\n      />\n      {tooltipProps ? <Tooltip {...tooltipProps} status=\"error\" /> : null}\n    </>\n  );\n}) as <T extends VuuRowDataItemType = string>(\n  props: VuuInputProps<T> & {\n    ref?: ForwardedRef<HTMLDivElement>;\n  }\n) => ReactElement<VuuInputProps<T>>;\n"],"names":["VuuInput"],"mappings":"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"}

package/package.json

@@ -0,0 +1,45 @@
+{
+  "version": "0.0.26",
+  "description": "VUU UI Controls",
+  "author": "heswell",
+  "license": "Apache-2.0",
+  "devDependencies": {
+    "@vuu-ui/vuu-data-types": "0.0.26",
+    "@vuu-ui/vuu-table-types": "0.0.26"
+  },
+  "dependencies": {
+    "@vuu-ui/vuu-layout": "0.0.26",
+    "@vuu-ui/vuu-popups": "0.0.26",
+    "@vuu-ui/vuu-table": "0.0.26",
+    "@vuu-ui/vuu-utils": "0.0.26",
+    "@salt-ds/core": "1.17.0",
+    "@salt-ds/icons": "1.9.1",
+    "@salt-ds/styles": "0.2.1",
+    "@salt-ds/window": "0.1.1"
+  },
+  "peerDependencies": {
+    "@internationalized/date": "^3.0.0",
+    "clsx": "^2.0.0",
+    "react": ">=17.0.2",
+    "react-dom": ">=17.0.2"
+  },
+  "sideEffects": false,
+  "type": "module",
+  "files": [
+    "README.md",
+    "esm",
+    "cjs",
+    "/types"
+  ],
+  "exports": {
+    ".": {
+      "require": "./cjs/index.js",
+      "import": "./esm/index.js",
+      "types": "./types/index.d.ts"
+    }
+  },
+  "main": "cjs/index.js",
+  "module": "esm/index.js",
+  "name": "@vuu-ui/vuu-ui-controls",
+  "types": "types/index.d.ts"
+}

package/types/calendar/Calendar.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { CalendarCarouselProps } from "./internal/CalendarCarousel";
+import { CalendarNavigationProps } from "./internal/CalendarNavigation";
+import { useCalendarProps } from "./useCalendar";
+export type CalendarProps = useCalendarProps & {
+    className?: string;
+    renderDayContents?: CalendarCarouselProps["renderDayContents"];
+    hideYearDropdown?: CalendarNavigationProps["hideYearDropdown"];
+    TooltipProps?: CalendarCarouselProps["TooltipProps"];
+    hideOutOfRangeDates?: CalendarCarouselProps["hideOutOfRangeDates"];
+};
+export declare const Calendar: import("react").ForwardRefExoticComponent<CalendarProps & import("react").RefAttributes<HTMLDivElement>>;

package/types/calendar/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./Calendar";
+export * from "./useCalendarDay";
+export * from "./useCalendar";
+export * from "./useSelection";

package/types/calendar/internal/CalendarCarousel.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { CalendarMonthProps } from "./CalendarMonth";
+export type CalendarCarouselProps = Omit<CalendarMonthProps, "date">;
+export declare const CalendarCarousel: import("react").ForwardRefExoticComponent<Omit<CalendarCarouselProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/types/calendar/internal/CalendarContext.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { useCalendar } from "../useCalendar";
+type CalendarState = {
+    state: ReturnType<typeof useCalendar>["state"];
+    helpers: ReturnType<typeof useCalendar>["helpers"];
+};
+declare const CalendarContext: import("react").Context<CalendarState | null>;
+declare function useCalendarContext(): CalendarState;
+export { CalendarContext, useCalendarContext };

package/types/calendar/internal/CalendarDay.d.ts

@@ -0,0 +1,14 @@
+import { TooltipProps } from "@salt-ds/core";
+import { ComponentPropsWithRef, ReactElement } from "react";
+import { DateValue } from "@internationalized/date";
+import { DayStatus } from "../useCalendarDay";
+export type DateFormatter = (day: Date) => string | undefined;
+export interface CalendarDayProps extends Omit<ComponentPropsWithRef<"button">, "children"> {
+    day: DateValue;
+    formatDate?: DateFormatter;
+    renderDayContents?: (date: DateValue, status: DayStatus) => ReactElement;
+    status?: DayStatus;
+    month: DateValue;
+    TooltipProps?: Partial<TooltipProps>;
+}
+export declare const CalendarDay: import("react").ForwardRefExoticComponent<Omit<CalendarDayProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;

package/types/calendar/internal/CalendarMonth.d.ts

@@ -0,0 +1,11 @@
+import { DateValue } from "@internationalized/date";
+import { ComponentPropsWithRef } from "react";
+import { CalendarDayProps } from "./CalendarDay";
+export interface CalendarMonthProps extends ComponentPropsWithRef<"div"> {
+    date: DateValue;
+    hideOutOfRangeDates?: boolean;
+    renderDayContents?: CalendarDayProps["renderDayContents"];
+    isVisible?: boolean;
+    TooltipProps?: CalendarDayProps["TooltipProps"];
+}
+export declare const CalendarMonth: import("react").ForwardRefExoticComponent<Omit<CalendarMonthProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/types/calendar/internal/CalendarNavigation.d.ts

@@ -0,0 +1,20 @@
+import { ButtonProps } from "@salt-ds/core";
+import { ComponentPropsWithRef } from "react";
+import { DropdownProps } from "../../dropdown";
+import { DateValue } from "@internationalized/date";
+type DropdownItem = {
+    value: DateValue;
+    disabled?: boolean;
+};
+type dateDropdownProps = DropdownProps<DropdownItem>;
+export interface CalendarNavigationProps extends ComponentPropsWithRef<"div"> {
+    MonthDropdownProps?: dateDropdownProps;
+    YearDropdownProps?: dateDropdownProps;
+    onMonthSelect?: dateDropdownProps["onChange"];
+    onYearSelect?: dateDropdownProps["onChange"];
+    onNavigateNext?: ButtonProps["onClick"];
+    onNavigatePrevious?: ButtonProps["onClick"];
+    hideYearDropdown?: boolean;
+}
+export declare const CalendarNavigation: import("react").ForwardRefExoticComponent<Omit<CalendarNavigationProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export {};

package/types/calendar/internal/CalendarWeekHeader.d.ts

@@ -0,0 +1,5 @@
+import { ComponentPropsWithRef } from "react";
+export type CalendarWeekHeaderProps = ComponentPropsWithRef<"div">;
+export declare const CalendarWeekHeader: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/types/calendar/internal/useFocusManagement.d.ts

@@ -0,0 +1,9 @@
+import { FocusEventHandler, KeyboardEventHandler, MouseEventHandler } from "react";
+import { DateValue } from "@internationalized/date";
+export declare function useFocusManagement({ date }: {
+    date: DateValue;
+}): {
+    handleClick: MouseEventHandler<HTMLButtonElement>;
+    handleKeyDown: KeyboardEventHandler<HTMLButtonElement>;
+    handleFocus: FocusEventHandler<HTMLButtonElement>;
+};

package/types/calendar/internal/utils.d.ts

@@ -0,0 +1,14 @@
+import { DateValue } from "@internationalized/date";
+export declare function getCurrentLocale(): string;
+export declare function formatDate(date: DateValue, options?: Intl.DateTimeFormatOptions): string;
+export declare function getCalender(): import("@internationalized/date").Calendar;
+type WeekdayFormat = Intl.DateTimeFormatOptions["weekday"];
+export declare function daysForLocale(weekday?: WeekdayFormat): string[];
+export declare function monthsForLocale(currentYear: DateValue): (import("@internationalized/date").CalendarDate | import("@internationalized/date").CalendarDateTime | import("@internationalized/date").ZonedDateTime)[];
+export declare function generateVisibleDays(currentMonth: DateValue): {
+    date: DateValue;
+    dateOfMonth: number;
+    isCurrentMonth: boolean;
+}[];
+export declare function monthDiff(a: DateValue, b: DateValue): number;
+export {};

package/types/calendar/useCalendar.d.ts

@@ -0,0 +1,57 @@
+import { DateValue } from "@internationalized/date";
+import { SyntheticEvent } from "react";
+import { UseMultiSelectionCalendarProps, UseOffsetSelectionCalendarProps, UseRangeSelectionCalendarProps, UseSingleSelectionCalendarProps } from "./useSelection";
+export type UnselectableInfo = {
+    emphasis: "medium";
+    tooltip: string;
+} | {
+    emphasis: "low";
+    tooltip?: string;
+};
+interface BaseUseCalendarProps {
+    defaultVisibleMonth?: DateValue;
+    onVisibleMonthChange?: (event: SyntheticEvent, visibleMonth: DateValue) => void;
+    isDayUnselectable?: (date: DateValue) => UnselectableInfo | boolean | void;
+    visibleMonth?: DateValue;
+    hideOutOfRangeDates?: boolean;
+    hideYearDropdown?: boolean;
+    minDate?: DateValue;
+    maxDate?: DateValue;
+}
+export type useCalendarProps = (Omit<UseSingleSelectionCalendarProps, "isDaySelectable"> | Omit<UseMultiSelectionCalendarProps, "isDaySelectable"> | Omit<UseRangeSelectionCalendarProps, "isDaySelectable"> | Omit<UseOffsetSelectionCalendarProps, "isDaySelectable">) & BaseUseCalendarProps;
+export declare function useCalendar(props: useCalendarProps): {
+    state: {
+        selectedDate: DateValue | import("./useSelection").RangeSelectionValueType | {
+            startDate?: DateValue | undefined;
+            endDate?: DateValue | undefined;
+        } | DateValue[] | null | undefined;
+        hoveredDate: import("@internationalized/date").CalendarDate | import("@internationalized/date").CalendarDateTime | import("@internationalized/date").ZonedDateTime | null | undefined;
+        visibleMonth: DateValue;
+        focusedDate: DateValue;
+        minDate: DateValue | undefined;
+        maxDate: DateValue | undefined;
+        selectionVariant: "offset" | "range" | "multiselect" | "default";
+        hideOutOfRangeDates: boolean | undefined;
+        calendarFocused: boolean;
+    };
+    helpers: {
+        setSelectedDate: (event: SyntheticEvent<HTMLButtonElement, Event>, newSelectedDate: DateValue) => void;
+        isSelected: (date: DateValue) => boolean;
+        setHoveredDate: (event: SyntheticEvent<Element, Event>, date: DateValue | null) => void;
+        isHovered: (date: DateValue) => boolean;
+        isSelectedSpan: (date: DateValue) => boolean;
+        isHoveredSpan: (date: DateValue) => boolean;
+        isSelectedStart: (date: DateValue) => boolean;
+        isSelectedEnd: (date: DateValue) => boolean;
+        isHoveredOffset: (date: DateValue) => boolean;
+        setVisibleMonth: (event: SyntheticEvent, newVisibleMonth: DateValue) => void;
+        setFocusedDate: (event: SyntheticEvent, date: DateValue) => void;
+        setCalendarFocused: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+        isDayUnselectable: (date: DateValue) => boolean | void | UnselectableInfo;
+        isDayVisible: (date: DateValue) => boolean;
+        isOutsideAllowedDates: (date: DateValue) => boolean;
+        isOutsideAllowedMonths: (date: DateValue) => boolean;
+        isOutsideAllowedYears: (date: DateValue) => boolean;
+    };
+};
+export {};

package/types/calendar/useCalendarDay.d.ts

@@ -0,0 +1,19 @@
+import { DateValue } from "@internationalized/date";
+import { RefObject } from "react";
+export type DayStatus = {
+    outOfRange?: boolean;
+    selected?: boolean;
+    today?: boolean;
+    unselectable?: "medium" | "low" | false;
+    focused?: boolean;
+    hidden?: boolean;
+};
+export interface useCalendarDayProps {
+    date: DateValue;
+    month: DateValue;
+}
+export declare function useCalendarDay({ date, month }: useCalendarDayProps, ref: RefObject<HTMLElement>): {
+    status: DayStatus;
+    dayProps: Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">;
+    unselectableReason: string | undefined;
+};

package/types/calendar/useSelection.d.ts

@@ -0,0 +1,75 @@
+import { KeyboardEventHandler, MouseEventHandler, SyntheticEvent } from "react";
+import { CalendarDate, DateValue } from "@internationalized/date";
+interface BaseUseSelectionCalendarProps<SelectionVariantType> {
+    hoveredDate?: DateValue | null;
+    selectedDate?: SelectionVariantType | null;
+    defaultSelectedDate?: SelectionVariantType;
+    onSelectedDateChange?: (event: SyntheticEvent, selectedDate: SelectionVariantType) => void;
+    isDaySelectable: (date?: DateValue) => boolean;
+    onHoveredDateChange?: (event: SyntheticEvent, hoveredDate: DateValue | null) => void;
+}
+type SingleSelectionValueType = DateValue;
+type MultiSelectionValueType = DateValue[];
+export type RangeSelectionValueType = {
+    startDate?: DateValue;
+    endDate?: DateValue;
+};
+type OffsetSelectionValueType = {
+    startDate?: DateValue;
+    endDate?: DateValue;
+};
+export interface UseOffsetSelectionCalendarProps extends Omit<BaseUseSelectionCalendarProps<OffsetSelectionValueType>, "startDateOffset" | "endDateOffset"> {
+    selectionVariant: "offset";
+    startDateOffset?: (date: DateValue) => DateValue;
+    endDateOffset?: (date: DateValue) => DateValue;
+}
+export interface UseRangeSelectionCalendarProps extends BaseUseSelectionCalendarProps<RangeSelectionValueType> {
+    selectionVariant: "range";
+}
+export interface UseMultiSelectionCalendarProps extends BaseUseSelectionCalendarProps<MultiSelectionValueType> {
+    selectionVariant: "multiselect";
+}
+export interface UseSingleSelectionCalendarProps extends BaseUseSelectionCalendarProps<SingleSelectionValueType> {
+    selectionVariant: "default";
+}
+export type useSelectionCalendarProps = UseSingleSelectionCalendarProps | UseMultiSelectionCalendarProps | UseRangeSelectionCalendarProps | UseOffsetSelectionCalendarProps;
+export declare function useSelectionCalendar(props: useSelectionCalendarProps): {
+    state: {
+        selectedDate: DateValue | RangeSelectionValueType | OffsetSelectionValueType | MultiSelectionValueType | null | undefined;
+        hoveredDate: CalendarDate | import("@internationalized/date").CalendarDateTime | import("@internationalized/date").ZonedDateTime | null | undefined;
+    };
+    helpers: {
+        setSelectedDate: (event: SyntheticEvent<HTMLButtonElement>, newSelectedDate: DateValue) => void;
+        isSelected: (date: DateValue) => boolean;
+        setHoveredDate: (event: SyntheticEvent, date: DateValue | null) => void;
+        isHovered: (date: DateValue) => boolean;
+        isSelectedSpan: (date: DateValue) => boolean;
+        isHoveredSpan: (date: DateValue) => boolean;
+        isSelectedStart: (date: DateValue) => boolean;
+        isSelectedEnd: (date: DateValue) => boolean;
+        isHoveredOffset: (date: DateValue) => boolean;
+    };
+};
+export declare function useSelectionDay({ date }: {
+    date: DateValue;
+}): {
+    handleClick: MouseEventHandler<HTMLButtonElement>;
+    handleKeyDown: KeyboardEventHandler<HTMLButtonElement>;
+    handleMouseOver: MouseEventHandler<HTMLButtonElement>;
+    handleMouseLeave: MouseEventHandler<HTMLButtonElement>;
+    status: {
+        selected: boolean;
+        selectedSpan: boolean;
+        hoveredSpan: boolean;
+        selectedStart: boolean;
+        selectedEnd: boolean;
+        hovered: boolean;
+        hoveredOffset: boolean;
+    };
+    dayProps: {
+        className: string;
+        "aria-pressed": string | undefined;
+        "aria-disabled": string | undefined;
+    };
+};
+export {};

package/types/combo-box/ComboBox.d.ts

@@ -0,0 +1,24 @@
+import { InputProps } from "@salt-ds/core";
+import { ForwardedRef, ReactElement } from "react";
+import { ComponentSelectionProps, SelectionStrategy } from "../common-hooks";
+import { DropdownBaseProps } from "../dropdown";
+import { ListProps } from "../list";
+export interface ComboBoxProps<Item = string, S extends SelectionStrategy = "default"> extends Omit<DropdownBaseProps, "triggerComponent" | "onBlur" | "onChange" | "onFocus">, Pick<InputProps, "onBlur" | "onChange" | "onFocus" | "onSelect">, Omit<ComponentSelectionProps<Item, S>, "onSelect">, Pick<ListProps<Item, S>, "ListItem" | "itemToString" | "source" | "width"> {
+    InputProps?: InputProps;
+    ListProps?: Omit<ListProps<Item>, "ListItem" | "itemToString" | "source" | "onSelect" | "onSelectionChange">;
+    allowBackspaceClearsSelection?: boolean;
+    allowEnterCommitsText?: boolean;
+    allowFreeText?: boolean;
+    defaultValue?: string;
+    getFilterRegex?: (inputValue: string) => RegExp;
+    initialHighlightedIndex?: number;
+    itemsToString?: (items: Item[]) => string;
+    onDeselect?: () => void;
+    onSetSelectedText?: (text: string) => void;
+    onListItemSelect?: ListProps<Item, S>["onSelect"];
+    disableFilter?: boolean;
+    value?: string;
+}
+export declare const ComboBox: <Item, S extends SelectionStrategy = "default">(props: ComboBoxProps<Item, S> & {
+    ref?: ForwardedRef<HTMLDivElement> | undefined;
+}) => ReactElement<ComboBoxProps<Item, "default">, string | import("react").JSXElementConstructor<any>>;