@vuu-ui/vuu-ui-controls 2.1.18 → 2.1.19-beta.1

package/esm/hover-overlay/HoverOverlay.js

@@ -1,94 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { Overlay, OverlayTrigger, OverlayPanel, OverlayPanelContent } from '@salt-ds/core';
-import { useState, useRef, useCallback, useEffect } from 'react';
-
-const HoverOverlay = ({
-  children,
-  open: openProp = false,
-  onOpenChange,
-  placement = "right",
-  trigger
-}) => {
-  const [open, _setOpen] = useState(openProp);
-  const isOpen = useRef(false);
-  const showHandle = useRef(void 0);
-  const hideHandle = useRef(void 0);
-  const setOpen = useCallback(
-    (open2) => {
-      if (open2 !== isOpen.current) {
-        isOpen.current = open2;
-        _setOpen(open2);
-        onOpenChange?.(open2);
-      }
-    },
-    [onOpenChange]
-  );
-  useEffect(() => {
-    if (openProp !== isOpen.current) {
-      setOpen(openProp);
-    }
-  }, [openProp, setOpen]);
-  const handleOverlayMouseEnter = useCallback(() => {
-    if (hideHandle.current) {
-      clearTimeout(hideHandle.current);
-      hideHandle.current = void 0;
-    }
-  }, []);
-  const handleOverlayMouseLeave = useCallback(() => {
-    hideHandle.current = setTimeout(() => {
-      setOpen(false);
-      hideHandle.current = void 0;
-    }, 300);
-  }, [setOpen]);
-  const handleMouseEnter = useCallback(() => {
-    showHandle.current = setTimeout(() => {
-      setOpen(true);
-      showHandle.current = void 0;
-    }, 400);
-    if (hideHandle.current) {
-      clearTimeout(hideHandle.current);
-      hideHandle.current = void 0;
-    }
-  }, [setOpen]);
-  const handleMouseLeave = useCallback(() => {
-    if (showHandle.current) {
-      clearTimeout(showHandle.current);
-      showHandle.current = void 0;
-    } else if (isOpen.current) {
-      hideHandle.current = setTimeout(() => {
-        setOpen(false);
-        hideHandle.current = void 0;
-      }, 300);
-    }
-  }, [setOpen]);
-  const handleClick = useCallback(() => {
-    if (showHandle.current) {
-      clearTimeout(showHandle.current);
-      showHandle.current = void 0;
-    } else if (isOpen.current) {
-      setOpen(false);
-    }
-  }, [setOpen]);
-  return /* @__PURE__ */ jsxs(Overlay, { placement, onOpenChange, open, children: [
-    /* @__PURE__ */ jsx(OverlayTrigger, { children: /* @__PURE__ */ jsx(
-      "div",
-      {
-        onClick: handleClick,
-        onMouseEnter: handleMouseEnter,
-        onMouseLeave: handleMouseLeave,
-        children: trigger
-      }
-    ) }),
-    /* @__PURE__ */ jsx(OverlayPanel, { children: /* @__PURE__ */ jsx(
-      OverlayPanelContent,
-      {
-        onMouseEnter: handleOverlayMouseEnter,
-        onMouseLeave: handleOverlayMouseLeave,
-        children
-      }
-    ) })
-  ] });
-};
-
-export { HoverOverlay };
-//# sourceMappingURL=HoverOverlay.js.map

package/esm/hover-overlay/HoverOverlay.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"HoverOverlay.js","sources":["../../../../packages/vuu-ui-controls/src/hover-overlay/HoverOverlay.tsx"],"sourcesContent":["import {\n  Overlay,\n  OverlayPanel,\n  OverlayPanelContent,\n  OverlayProps,\n  OverlayTrigger,\n} from \"@salt-ds/core\";\nimport { ReactNode, useCallback, useEffect, useRef, useState } from \"react\";\n\nexport interface HoverOverlayProps\n  extends Pick<OverlayProps, \"placement\" | \"onOpenChange\"> {\n  children: ReactNode;\n  open?: boolean;\n  trigger: ReactNode;\n}\n\nexport const HoverOverlay = ({\n  children,\n  open: openProp = false,\n  onOpenChange,\n  placement = \"right\",\n  trigger,\n}: HoverOverlayProps) => {\n  const [open, _setOpen] = useState(openProp);\n  const isOpen = useRef(false);\n  const showHandle = useRef<ReturnType<typeof setTimeout>>(undefined);\n  const hideHandle = useRef<ReturnType<typeof setTimeout>>(undefined);\n\n  const setOpen = useCallback(\n    (open: boolean) => {\n      if (open !== isOpen.current) {\n        isOpen.current = open;\n        _setOpen(open);\n        onOpenChange?.(open);\n      }\n    },\n    [onOpenChange],\n  );\n\n  useEffect(() => {\n    if (openProp !== isOpen.current) {\n      setOpen(openProp);\n    }\n  }, [openProp, setOpen]);\n\n  const handleOverlayMouseEnter = useCallback(() => {\n    if (hideHandle.current) {\n      clearTimeout(hideHandle.current);\n      hideHandle.current = undefined;\n    }\n  }, []);\n\n  const handleOverlayMouseLeave = useCallback(() => {\n    hideHandle.current = setTimeout(() => {\n      setOpen(false);\n      hideHandle.current = undefined;\n    }, 300);\n  }, [setOpen]);\n\n  const handleMouseEnter = useCallback(() => {\n    showHandle.current = setTimeout(() => {\n      setOpen(true);\n      showHandle.current = undefined;\n    }, 400);\n    if (hideHandle.current) {\n      clearTimeout(hideHandle.current);\n      hideHandle.current = undefined;\n    }\n  }, [setOpen]);\n\n  const handleMouseLeave = useCallback(() => {\n    if (showHandle.current) {\n      clearTimeout(showHandle.current);\n      showHandle.current = undefined;\n    } else if (isOpen.current) {\n      hideHandle.current = setTimeout(() => {\n        setOpen(false);\n        hideHandle.current = undefined;\n      }, 300);\n    }\n  }, [setOpen]);\n\n  const handleClick = useCallback(() => {\n    if (showHandle.current) {\n      clearTimeout(showHandle.current);\n      showHandle.current = undefined;\n    } else if (isOpen.current) {\n      setOpen(false);\n    }\n  }, [setOpen]);\n\n  return (\n    <Overlay placement={placement} onOpenChange={onOpenChange} open={open}>\n      <OverlayTrigger>\n        <div\n          onClick={handleClick}\n          onMouseEnter={handleMouseEnter}\n          onMouseLeave={handleMouseLeave}\n        >\n          {trigger}\n        </div>\n      </OverlayTrigger>\n      <OverlayPanel>\n        <OverlayPanelContent\n          onMouseEnter={handleOverlayMouseEnter}\n          onMouseLeave={handleOverlayMouseLeave}\n        >\n          {children}\n        </OverlayPanelContent>\n      </OverlayPanel>\n    </Overlay>\n  );\n};\n"],"names":["open"],"mappings":"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"}

package/esm/icon-button/Icon.css.js

@@ -1,4 +0,0 @@
-var iconCss = ".vuuIcon {\n    --vuu-icon-left: 0;\n}";
-
-export { iconCss as default };
-//# sourceMappingURL=Icon.css.js.map

package/esm/icon-button/Icon.css.js.map

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

package/esm/icon-button/Icon.js

@@ -1,35 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import cx from 'clsx';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
-import iconCss from './Icon.css.js';
-
-const classBase = "vuuIcon";
-const Icon = ({
-  className,
-  name,
-  size,
-  style: styleProp,
-  ...htmlAttributes
-}) => {
-  const targetWindow = useWindow();
-  useComponentCssInjection({
-    testId: "vuu-icon",
-    css: iconCss,
-    window: targetWindow
-  });
-  const style = typeof size === "number" ? { ...styleProp, "--vuu-icon-size": `${size}px` } : styleProp;
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      ...htmlAttributes,
-      className: cx(classBase, className),
-      "data-icon": name,
-      role: "img",
-      style
-    }
-  );
-};
-
-export { Icon };
-//# sourceMappingURL=Icon.js.map

package/esm/icon-button/Icon.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Icon.js","sources":["../../../../packages/vuu-ui-controls/src/icon-button/Icon.tsx"],"sourcesContent":["import { HTMLAttributes } from \"react\";\nimport cx from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport iconCss from \"./Icon.css\";\n\nconst classBase = \"vuuIcon\";\n\nexport interface IconProps extends HTMLAttributes<HTMLSpanElement> {\n  name: string;\n  size?: number;\n}\n\nexport const Icon = ({\n  className,\n  name,\n  size,\n  style: styleProp,\n  ...htmlAttributes\n}: IconProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-icon\",\n    css: iconCss,\n    window: targetWindow,\n  });\n\n  const style =\n    typeof size === \"number\"\n      ? { ...styleProp, \"--vuu-icon-size\": `${size}px` }\n      : styleProp;\n  return (\n    <span\n      {...htmlAttributes}\n      className={cx(classBase, className)}\n      data-icon={name}\n      role=\"img\"\n      style={style}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;AAOA,MAAM,SAAY,GAAA,SAAA;AAOX,MAAM,OAAO,CAAC;AAAA,EACnB,SAAA;AAAA,EACA,IAAA;AAAA,EACA,IAAA;AAAA,EACA,KAAO,EAAA,SAAA;AAAA,EACP,GAAG;AACL,CAAiB,KAAA;AACf,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,UAAA;AAAA,IACR,GAAK,EAAA,OAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA,KAAA,GACJ,OAAO,IAAA,KAAS,QACZ,GAAA,EAAE,GAAG,SAAA,EAAW,iBAAmB,EAAA,CAAA,EAAG,IAAI,CAAA,EAAA,CAAA,EAC1C,GAAA,SAAA;AACN,EACE,uBAAA,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACE,GAAG,cAAA;AAAA,MACJ,SAAA,EAAW,EAAG,CAAA,SAAA,EAAW,SAAS,CAAA;AAAA,MAClC,WAAW,EAAA,IAAA;AAAA,MACX,IAAK,EAAA,KAAA;AAAA,MACL;AAAA;AAAA,GACF;AAEJ;;;;"}

package/esm/icon-button/IconButton.css.js

@@ -1,4 +0,0 @@
-var iconButtonCss = ".vuuIconButton.saltButton {\n  --saltButton-padding: 0;\n  --saltButton-minWidth: var(--salt-size-base);\n  width: var(--saltButton-width, calc(var(--salt-size-base) + var(--salt-size-fixed-400)));\n}\n";
-
-export { iconButtonCss as default };
-//# sourceMappingURL=IconButton.css.js.map

package/esm/icon-button/IconButton.css.js.map

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

package/esm/icon-button/IconButton.js

@@ -1,24 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import cx from 'clsx';
-import { Button } from '@salt-ds/core';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
-import { Icon } from './Icon.js';
-import { forwardRef } from 'react';
-import iconButtonCss from './IconButton.css.js';
-
-const classBase = "vuuIconButton";
-const IconButton = forwardRef(
-  function IconButton2({ "aria-label": ariaLabel, className, icon, size, ...buttonProps }, ref) {
-    const targetWindow = useWindow();
-    useComponentCssInjection({
-      testId: "vuu-icon-button",
-      css: iconButtonCss,
-      window: targetWindow
-    });
-    return /* @__PURE__ */ jsx(Button, { ...buttonProps, className: cx(classBase, className), ref, children: /* @__PURE__ */ jsx(Icon, { "aria-label": ariaLabel, name: icon, size }) });
-  }
-);
-
-export { IconButton };
-//# sourceMappingURL=IconButton.js.map

package/esm/icon-button/IconButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"IconButton.js","sources":["../../../../packages/vuu-ui-controls/src/icon-button/IconButton.tsx"],"sourcesContent":["import cx from \"clsx\";\nimport { Button, ButtonProps } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { Icon } from \"./Icon\";\nimport { forwardRef } from \"react\";\n\nimport iconButtonCss from \"./IconButton.css\";\n\nconst classBase = \"vuuIconButton\";\n\nexport interface IconButtonProps extends Omit<ButtonProps, \"children\"> {\n  icon: string;\n  size?: number;\n}\n\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n  function IconButton(\n    { \"aria-label\": ariaLabel, className, icon, size, ...buttonProps },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"vuu-icon-button\",\n      css: iconButtonCss,\n      window: targetWindow,\n    });\n\n    return (\n      <Button {...buttonProps} className={cx(classBase, className)} ref={ref}>\n        <Icon aria-label={ariaLabel} name={icon} size={size} />\n      </Button>\n    );\n  }\n);\n"],"names":["IconButton"],"mappings":";;;;;;;;;AASA,MAAM,SAAY,GAAA,eAAA;AAOX,MAAM,UAAa,GAAA,UAAA;AAAA,EACxB,SAASA,WACP,CAAA,EAAE,YAAc,EAAA,SAAA,EAAW,SAAW,EAAA,IAAA,EAAM,IAAM,EAAA,GAAG,WAAY,EAAA,EACjE,GACA,EAAA;AACA,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,iBAAA;AAAA,MACR,GAAK,EAAA,aAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAA,2BACG,MAAQ,EAAA,EAAA,GAAG,WAAa,EAAA,SAAA,EAAW,GAAG,SAAW,EAAA,SAAS,CAAG,EAAA,GAAA,EAC5D,8BAAC,IAAK,EAAA,EAAA,YAAA,EAAY,WAAW,IAAM,EAAA,IAAA,EAAM,MAAY,CACvD,EAAA,CAAA;AAAA;AAGN;;;;"}

package/esm/icon-button/ToggleIconButton.css.js

@@ -1,4 +0,0 @@
-var toggleIconCss = ".vuuToggleIconButton {\n  &.saltButton {\n    &:active {\n      --saltButton-background-active: transparent;\n    }\n    &:hover {\n      --saltButton-background-hover: transparent;\n    }\n    .vuuIcon {\n      --vuu-icon-height: 18px;\n      --vuu-icon-left: -3px;\n      --vuu-icon-width: 18px;\n      &:after {\n        transition: transform 0.1s linear;\n      }\n      &[data-icon=\"triangle-down\"]:after {\n        --vuu-icon-left: -1px;\n        --vuu-icon-top: -3px;\n      }\n    }\n    border: none;\n    border-radius: 0;\n    height: 18px;\n    left: 0;\n    min-width: 18px;\n    padding: 0;\n    width: 18px;\n  }\n}\n\n.vuuTableGroupCell:hover {\n  .vuuToggleIconButton {\n    .vuuIcon:after {\n      --vuu-icon-color: var(--salt-palette-interact-cta-background-hover);\n    }\n  }\n}\n";
-
-export { toggleIconCss as default };
-//# sourceMappingURL=ToggleIconButton.css.js.map

package/esm/icon-button/ToggleIconButton.css.js.map

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

package/esm/icon-button/ToggleIconButton.js

@@ -1,37 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
-import cx from 'clsx';
-import { IconButton } from './IconButton.js';
-import toggleIconCss from './ToggleIconButton.css.js';
-
-const classBase = "vuuToggleIconButton";
-const ToggleIconButton = ({
-  className,
-  isExpanded,
-  size = 7,
-  ...props
-}) => {
-  const targetWindow = useWindow();
-  useComponentCssInjection({
-    testId: "vuu-toggle-icon-button",
-    css: toggleIconCss,
-    window: targetWindow
-  });
-  const icon = isExpanded ? "triangle-down" : "triangle-right";
-  return /* @__PURE__ */ jsx(
-    IconButton,
-    {
-      ...props,
-      appearance: "transparent",
-      className: cx(classBase, className),
-      "data-embedded": true,
-      icon,
-      sentiment: "neutral",
-      size
-    }
-  );
-};
-
-export { ToggleIconButton };
-//# sourceMappingURL=ToggleIconButton.js.map

package/esm/icon-button/ToggleIconButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ToggleIconButton.js","sources":["../../../../packages/vuu-ui-controls/src/icon-button/ToggleIconButton.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { IconButton, IconButtonProps } from \"./IconButton\";\n\nimport toggleIconCss from \"./ToggleIconButton.css\";\n\nconst classBase = \"vuuToggleIconButton\";\n\nexport interface ToggleIconButtonProps extends Omit<IconButtonProps, \"icon\"> {\n  isExpanded: boolean;\n}\n\nexport const ToggleIconButton = ({\n  className,\n  isExpanded,\n  size = 7,\n  ...props\n}: ToggleIconButtonProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-toggle-icon-button\",\n    css: toggleIconCss,\n    window: targetWindow,\n  });\n\n  const icon = isExpanded ? \"triangle-down\" : \"triangle-right\";\n  return (\n    <IconButton\n      {...props}\n      appearance=\"transparent\"\n      className={cx(classBase, className)}\n      data-embedded\n      icon={icon}\n      sentiment=\"neutral\"\n      size={size}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;;AAOA,MAAM,SAAY,GAAA,qBAAA;AAMX,MAAM,mBAAmB,CAAC;AAAA,EAC/B,SAAA;AAAA,EACA,UAAA;AAAA,EACA,IAAO,GAAA,CAAA;AAAA,EACP,GAAG;AACL,CAA6B,KAAA;AAC3B,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,wBAAA;AAAA,IACR,GAAK,EAAA,aAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA,IAAA,GAAO,aAAa,eAAkB,GAAA,gBAAA;AAC5C,EACE,uBAAA,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACE,GAAG,KAAA;AAAA,MACJ,UAAW,EAAA,aAAA;AAAA,MACX,SAAA,EAAW,EAAG,CAAA,SAAA,EAAW,SAAS,CAAA;AAAA,MAClC,eAAa,EAAA,IAAA;AAAA,MACb,IAAA;AAAA,MACA,SAAU,EAAA,SAAA;AAAA,MACV;AAAA;AAAA,GACF;AAEJ;;;;"}

package/esm/index.js

@@ -1,59 +0,0 @@
-export { Calendar } from './calendar/Calendar.js';
-export { useCalendarDay } from './calendar/useCalendarDay.js';
-export { useCalendar } from './calendar/useCalendar.js';
-export { isRangeOrOffsetSelectionValue, isRangeOrOffsetSelectionWithStartDate, useSelectionCalendar, useSelectionDay } from './calendar/useSelection.js';
-export { ColumnPicker } from './column-picker/ColumnPicker.js';
-export { ColumnSearch } from './column-picker/ColumnSearch.js';
-export { useControlled } from './common-hooks/useControlled.js';
-export { HeightOnly, WidthHeight, WidthOnly, useResizeObserver } from './common-hooks/use-resize-observer.js';
-export { allowMultipleSelection, deselectionIsAllowed, getFirstSelectedItem, hasSelection, isMultiSelection, isSingleSelection, selectionIsDisallowed } from './common-hooks/selectionTypes.js';
-export { ContextPanelProvider, useContextPanel, useHideContextPanel } from './context-panel-provider/ContextPanelProvider.js';
-export { CycleStateButton } from './cycle-state-button/CycleStateButton.js';
-export { DateInput } from './date-input/DateInput.js';
-export { DatePicker } from './date-picker/DatePicker.js';
-export { BWD, FWD } from './drag-drop/dragDropTypes.js';
-export { DragDropProvider, useDragDropProvider } from './drag-drop/DragDropProvider.js';
-export { DragDropState } from './drag-drop/DragDropState.js';
-export { useDragDrop } from './drag-drop/useDragDrop.js';
-export { NOT_HIDDEN, NOT_OVERFLOWED, cloneElement, constrainRect, dimensions, dropTargetsDebugString, getIndexOfDraggedItem, getItemById, getItemParentContainer, getNextDropTarget, getScrollableContainer, isContainerScrollable, measureDropTargets, measureElementSizeAndPosition, mutateDropTargetsSwitchDropTargetPosition, removeDraggedItem } from './drag-drop/drop-target-utils.js';
-export { useGlobalDragDrop } from './drag-drop/useGlobalDragDrop.js';
-export { useEditableText } from './editable/useEditableText.js';
-export { EditableLabel, NullEditAPI } from './editable-label/EditableLabel.js';
-export { ExpandoInput } from './expando-input/ExpandoInput.js';
-export { HoverOverlay } from './hover-overlay/HoverOverlay.js';
-export { Icon } from './icon-button/Icon.js';
-export { IconButton } from './icon-button/IconButton.js';
-export { ToggleIconButton } from './icon-button/ToggleIconButton.js';
-export { TablePicker } from './instrument-picker/TablePicker.js';
-export { MeasuredContainer } from './measured-container/MeasuredContainer.js';
-export { reduceSizeHeight, useMeasuredContainer } from './measured-container/useMeasuredContainer.js';
-export { ModalProvider, useModal } from './modal-provider/ModalProvider.js';
-export { OverflowContainer } from './overflow-container/OverflowContainer.js';
-export { NO_WRAPPED_ITEMS, applyOverflowClassToWrappedItems, correctForWrappedHighPriorityItems, correctForWrappedOverflowIndicator, getElementsMarkedAsWrapped, getNonWrappedAndWrappedItems, highPriorityItemsHaveWrappedButShouldNotHave, markElementAsWrapped, overflowIndicatorHasWrappedButShouldNotHave, removeOverflowIndicatorIfNoLongerNeeded, sortByScreenOrder, switchWrappedItemIntoView, unmarkItemsWhichAreNoLongerWrapped } from './overflow-container/overflow-utils.js';
-export { PriceTicker } from './price-ticker/PriceTicker.js';
-export { Prompt } from './prompt/Prompt.js';
-export { SortableList, SortableOption } from './sortable-list/SortableList.js';
-export { SplitButton } from './split-button/SplitButton.js';
-export { SplitStateButton } from './split-button/SplitStateButton.js';
-export { TableSearch } from './table-search/TableSearch.js';
-export { TabNext } from './tabs-next/TabNext.js';
-export { TabListNext } from './tabs-next/TabListNext.js';
-export { TabsNext } from './tabs-next/TabsNext.js';
-export { TabNextPanel } from './tabs-next/TabNextPanel.js';
-export { TabBar } from './tabs-next/TabBar.js';
-export { TabNextTrigger } from './tabs-next/TabNextTrigger.js';
-export { TabNextAction } from './tabs-next/TabNextAction.js';
-export { Tabstrip } from './tabstrip/Tabstrip.js';
-export { Tab } from './tabstrip/Tab.js';
-export { getIndexOfEditedItem, getIndexOfSelectedTab } from './tabstrip/tabstrip-dom-utils.js';
-export { TimeInput } from './time-input/TimeInput.js';
-export { Toolbar } from './toolbar/Toolbar.js';
-export { escapeRegExp } from './utils/escapeRegExp.js';
-export { isOverflowElement } from './utils/isOverflowElement.js';
-export { isPlainObject } from './utils/isPlainObject.js';
-export { forwardCallbackProps } from './utils/forwardCallbackProps.js';
-export { VuuDatePicker } from './vuu-date-picker/VuuDatePicker.js';
-export { VuuInput } from './vuu-input/VuuInput.js';
-export { VuuTimePicker } from './vuu-time-picker/VuuTimePicker.js';
-export { VuuTypeaheadInput } from './vuu-typeahead-input/VuuTypeaheadInput.js';
-//# sourceMappingURL=index.js.map

package/esm/index.js.map

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

package/esm/instrument-picker/TablePicker.css.js

@@ -1,4 +0,0 @@
-var tablePickerCss = ".vuuTablePicker {\n  border-radius: 6px;\n  height: var(--salt-size-base);\n  padding: 1px;\n  box-sizing: content-box;\n}\n\n.vuuTablePicker-floating-table {\n  border: solid 1px var(--salt-container-secondary-borderColor);\n  border-radius: 4px;\n  overflow: auto;\n  padding: var(--salt-spacing-100) 0;\n  z-index: var(--salt-zIndex-popout);\n}\n\n[data-floating-ui-portal] [data-floating-ui-portal] .vuuTablePicker-floating-table {\n  z-index: calc(var(--salt-zIndex-modal) + var(--salt-zIndex-popout));\n}\n";
-
-export { tablePickerCss as default };
-//# sourceMappingURL=TablePicker.css.js.map

package/esm/instrument-picker/TablePicker.css.js.map

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

package/esm/instrument-picker/TablePicker.js

@@ -1,128 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { Table } from '@vuu-ui/vuu-table';
-import { useFloatingComponent, useIdMemo, Input } from '@salt-ds/core';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
-import cx from 'clsx';
-import { forwardRef, useMemo } from 'react';
-import { IconButton } from '../icon-button/IconButton.js';
-import tablePickerCss from './TablePicker.css.js';
-import { useTablePicker } from './useTablePicker.js';
-
-const classBase = "vuuTablePicker";
-const FloatingTable = forwardRef(
-  function FloatingTable2({ children, className, collapsed, open, ...props }, forwardedRef) {
-    const { Component: FloatingComponent } = useFloatingComponent();
-    return /* @__PURE__ */ jsx(
-      FloatingComponent,
-      {
-        className: cx(
-          `${classBase}-floating-table`,
-          {
-            [`${classBase}-collapsed`]: collapsed
-          },
-          className
-        ),
-        role: "listbox",
-        open,
-        ...props,
-        ref: forwardedRef,
-        children
-      }
-    );
-  }
-);
-const TablePicker = ({
-  TableProps,
-  onSelect,
-  rowToString,
-  schema,
-  searchColumns,
-  ...htmlAttributes
-}) => {
-  const targetWindow = useWindow();
-  useComponentCssInjection({
-    testId: "vuu-table-picker",
-    css: tablePickerCss,
-    window: targetWindow
-  });
-  const tableId = useIdMemo();
-  const {
-    containerRef,
-    dataSource,
-    highlightedIndex,
-    floatingUIProps: { x, y, strategy, floating, reference },
-    inputProps,
-    interactionPropGetters: { getFloatingProps, getReferenceProps },
-    onKeyDown,
-    open,
-    tableConfig,
-    tableHandlers,
-    tableRef,
-    value,
-    width
-  } = useTablePicker({
-    TableProps,
-    rowToString,
-    onSelect,
-    schema,
-    searchColumns
-  });
-  const endAdornment = useMemo(
-    () => /* @__PURE__ */ jsx(
-      IconButton,
-      {
-        ...getReferenceProps(),
-        appearance: "transparent",
-        "data-embedded": true,
-        ref: reference,
-        icon: "chevron-down",
-        onKeyDown,
-        sentiment: "neutral"
-      }
-    ),
-    [getReferenceProps, onKeyDown, reference]
-  );
-  return /* @__PURE__ */ jsxs("div", { ...htmlAttributes, className: classBase, ref: containerRef, children: [
-    /* @__PURE__ */ jsx(
-      Input,
-      {
-        ...inputProps,
-        bordered: true,
-        endAdornment,
-        value
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      FloatingTable,
-      {
-        ...getFloatingProps(),
-        collapsed: !open,
-        id: tableId,
-        open,
-        left: x + 3,
-        position: strategy,
-        ref: floating,
-        top: y + 3,
-        children: /* @__PURE__ */ jsx(
-          Table,
-          {
-            ...tableHandlers,
-            config: tableConfig,
-            dataSource,
-            highlightedIndex,
-            maxViewportRowLimit: 10,
-            navigationStyle: "row",
-            ref: tableRef,
-            selectionModel: "single",
-            showColumnHeaders: false,
-            width: width - 3
-          }
-        )
-      }
-    )
-  ] });
-};
-
-export { TablePicker };
-//# sourceMappingURL=TablePicker.js.map

package/esm/instrument-picker/TablePicker.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TablePicker.js","sources":["../../../../packages/vuu-ui-controls/src/instrument-picker/TablePicker.tsx"],"sourcesContent":["import type { TableSchema } from \"@vuu-ui/vuu-data-types\";\nimport { Table, type TableProps } from \"@vuu-ui/vuu-table\";\nimport {\n  Input,\n  useFloatingComponent,\n  useIdMemo,\n  type FloatingComponentProps,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { forwardRef, useMemo, type HTMLAttributes } from \"react\";\nimport { IconButton } from \"../icon-button\";\nimport tablePickerCss from \"./TablePicker.css\";\nimport { useTablePicker } from \"./useTablePicker\";\nimport { DataRow } from \"@vuu-ui/vuu-table-types\";\n\nconst classBase = \"vuuTablePicker\";\n\ninterface FloatingTableProps extends FloatingComponentProps {\n  collapsed?: boolean;\n}\n\nexport interface TablePickerProps\n  extends Omit<HTMLAttributes<HTMLElement>, \"onSelect\">,\n    Pick<TableProps, \"onSelect\"> {\n  TableProps?: Pick<TableProps, \"config\">;\n  rowToString?: (dataRow: DataRow) => string;\n  schema: TableSchema;\n  searchColumns?: string[];\n}\n\nconst FloatingTable = forwardRef<HTMLDivElement, FloatingTableProps>(\n  function FloatingTable(\n    { children, className, collapsed, open, ...props },\n    forwardedRef,\n  ) {\n    const { Component: FloatingComponent } = useFloatingComponent();\n    return (\n      <FloatingComponent\n        className={cx(\n          `${classBase}-floating-table`,\n          {\n            [`${classBase}-collapsed`]: collapsed,\n          },\n          className,\n        )}\n        role=\"listbox\"\n        open={open}\n        {...props}\n        ref={forwardedRef}\n      >\n        {children}\n      </FloatingComponent>\n    );\n  },\n);\n\nexport const TablePicker = ({\n  TableProps,\n  onSelect,\n  rowToString,\n  schema,\n  searchColumns,\n  ...htmlAttributes\n}: TablePickerProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-table-picker\",\n    css: tablePickerCss,\n    window: targetWindow,\n  });\n\n  const tableId = useIdMemo();\n\n  const {\n    containerRef,\n    dataSource,\n    highlightedIndex,\n    floatingUIProps: { x, y, strategy, floating, reference },\n    inputProps,\n    interactionPropGetters: { getFloatingProps, getReferenceProps },\n    onKeyDown,\n    open,\n    tableConfig,\n    tableHandlers,\n    tableRef,\n    value,\n    width,\n  } = useTablePicker({\n    TableProps,\n    rowToString,\n    onSelect,\n    schema,\n    searchColumns,\n  });\n\n  const endAdornment = useMemo(\n    () => (\n      <IconButton\n        {...getReferenceProps()}\n        appearance=\"transparent\"\n        data-embedded\n        ref={reference}\n        icon=\"chevron-down\"\n        onKeyDown={onKeyDown}\n        sentiment=\"neutral\"\n      />\n    ),\n    [getReferenceProps, onKeyDown, reference],\n  );\n\n  return (\n    <div {...htmlAttributes} className={classBase} ref={containerRef}>\n      <Input\n        {...inputProps}\n        bordered\n        endAdornment={endAdornment}\n        value={value}\n      />\n      <FloatingTable\n        {...getFloatingProps()}\n        collapsed={!open}\n        id={tableId}\n        open={open}\n        left={x + 3}\n        position={strategy}\n        ref={floating}\n        top={y + 3}\n      >\n        <Table\n          {...tableHandlers}\n          config={tableConfig}\n          dataSource={dataSource}\n          highlightedIndex={highlightedIndex}\n          maxViewportRowLimit={10}\n          navigationStyle=\"row\"\n          ref={tableRef}\n          selectionModel=\"single\"\n          showColumnHeaders={false}\n          width={width - 3}\n        />\n      </FloatingTable>\n    </div>\n  );\n};\n"],"names":["FloatingTable"],"mappings":"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"}

package/esm/instrument-picker/useTablePicker.js

@@ -1,148 +0,0 @@
-import { size, flip, useInteractions, useDismiss, useClick } from '@floating-ui/react';
-import { useFloatingUI } from '@salt-ds/core';
-import { useState, useRef, useCallback, useMemo } from 'react';
-import { useData, isStringColumn, toColumnName } from '@vuu-ui/vuu-utils';
-import { useControlledTableNavigation, isNavigationKey, isRowSelectionKey } from '@vuu-ui/vuu-table';
-
-const defaultRowToString = (dataRow) => Object.values(dataRow).join(" ");
-const useTablePicker = ({
-  TableProps,
-  onSelect,
-  rowToString = defaultRowToString,
-  schema,
-  searchColumns = schema.columns.filter(isStringColumn).map(toColumnName)
-}) => {
-  const { VuuDataSource } = useData();
-  const [value, setValue] = useState("");
-  const [open, setOpen] = useState(false);
-  const widthRef = useRef(-1);
-  const tableColumns = TableProps?.config.columns;
-  const containerRef = useCallback((el) => {
-    widthRef.current = el?.clientWidth ?? -1;
-  }, []);
-  const dataSource = useMemo(() => {
-    const columns = tableColumns ?? schema.columns;
-    return new VuuDataSource({
-      columns: columns.map((c) => c.name),
-      table: schema.table
-    });
-  }, [tableColumns, VuuDataSource, schema]);
-  const navigation = useControlledTableNavigation(-1, dataSource.size);
-  const baseFilterPattern = useMemo(
-    // TODO make this contains once server supports it
-    () => searchColumns.map((col) => `${col} starts "__VALUE__"`).join(" or "),
-    [searchColumns]
-  );
-  const { context, elements, ...floatingUIProps } = useFloatingUI({
-    open,
-    onOpenChange: setOpen,
-    placement: "bottom-end",
-    strategy: "fixed",
-    middleware: [
-      size({
-        apply({ rects, elements: elements2, availableHeight }) {
-          Object.assign(elements2.floating.style, {
-            minWidth: `${rects.reference.width}px`,
-            maxHeight: `max(calc(${availableHeight}px - var(--salt-spacing-100)), calc((var(--salt-size-base) + var(--salt-spacing-100)) * 5))`
-          });
-        }
-      }),
-      flip({ fallbackStrategy: "initialPlacement" })
-    ]
-  });
-  const interactionPropGetters = useInteractions([
-    useDismiss(context),
-    useClick(context, { keyboardHandlers: false, toggle: false })
-  ]);
-  const handleInputChange = useCallback(
-    (evt) => {
-      const { value: value2 } = evt.target;
-      setValue(value2);
-      console.log(`input changed ${value2}`);
-      if (value2 && value2.trim().length) {
-        const filter = baseFilterPattern.replaceAll("__VALUE__", value2);
-        dataSource.filter = {
-          filter
-        };
-      } else {
-        dataSource.filter = {
-          filter: ""
-        };
-      }
-    },
-    [baseFilterPattern, dataSource]
-  );
-  const handleSelectRow = useCallback(
-    (dataRow) => {
-      const value2 = dataRow === null ? "" : rowToString(dataRow);
-      setValue(value2);
-      onSelect?.(dataRow);
-      requestAnimationFrame(() => {
-        setOpen(false);
-      });
-    },
-    [onSelect, rowToString]
-  );
-  const handleKeyDown = useCallback(
-    (evt) => {
-      if (open) {
-        if (isNavigationKey(evt.key, "row") || isRowSelectionKey(evt.key)) {
-          navigation.onKeyDown(evt);
-        }
-      } else {
-        if (evt.key === "ArrowDown" || evt.key === "Enter") {
-          setOpen(true);
-        }
-      }
-    },
-    [navigation, open]
-  );
-  const inputProps = {
-    inputProps: {
-      autoComplete: "off",
-      onKeyDown: handleKeyDown
-    },
-    onChange: handleInputChange
-  };
-  const tableHandlers = {
-    onSelect: handleSelectRow
-  };
-  const tableConfig = useMemo(() => {
-    const config = TableProps?.config;
-    if (config) {
-      const {
-        columns = schema.columns,
-        columnLayout = "fit",
-        ...rest
-      } = config;
-      return {
-        columns,
-        columnLayout,
-        ...rest
-      };
-    } else {
-      return {
-        columnLayout: "fit",
-        columns: schema.columns
-      };
-    }
-  }, [TableProps, schema]);
-  return {
-    containerRef,
-    dataSource,
-    highlightedIndex: navigation.highlightedIndexRef.current,
-    floatingUIProps,
-    inputProps,
-    interactionPropGetters,
-    onKeyDown: handleKeyDown,
-    open,
-    tableConfig,
-    tableHandlers,
-    tableRef: navigation.tableRef,
-    value,
-    width: widthRef.current
-  };
-};
-
-export { useTablePicker };
-//# sourceMappingURL=useTablePicker.js.map

package/esm/instrument-picker/useTablePicker.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useTablePicker.js","sources":["../../../../packages/vuu-ui-controls/src/instrument-picker/useTablePicker.ts"],"sourcesContent":["import {\n  flip,\n  size,\n  useClick,\n  useDismiss,\n  useInteractions,\n} from \"@floating-ui/react\";\nimport { useFloatingUI } from \"@salt-ds/core\";\nimport {\n  ChangeEvent,\n  KeyboardEventHandler,\n  RefCallback,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\n\nimport type {\n  DataRow,\n  TableConfig,\n  TableRowSelectHandler,\n} from \"@vuu-ui/vuu-table-types\";\nimport { isStringColumn, toColumnName, useData } from \"@vuu-ui/vuu-utils\";\nimport type { TablePickerProps } from \"./TablePicker\";\nimport {\n  isNavigationKey,\n  isRowSelectionKey,\n  useControlledTableNavigation,\n} from \"@vuu-ui/vuu-table\";\n\nexport interface TablePickerHookProps\n  extends Pick<\n    TablePickerProps,\n    \"TableProps\" | \"onSelect\" | \"rowToString\" | \"schema\" | \"searchColumns\"\n  > {\n  defaultIsOpen?: boolean;\n  isOpen?: boolean;\n}\n\nconst defaultRowToString = (dataRow: DataRow) =>\n  Object.values(dataRow).join(\" \");\n\nexport const useTablePicker = ({\n  TableProps,\n  onSelect,\n  rowToString = defaultRowToString,\n  schema,\n  searchColumns = schema.columns.filter(isStringColumn).map(toColumnName),\n}: TablePickerHookProps) => {\n  const { VuuDataSource } = useData();\n  const [value, setValue] = useState(\"\");\n  const [open, setOpen] = useState(false);\n\n  const widthRef = useRef(-1);\n\n  const tableColumns = TableProps?.config.columns;\n\n  const containerRef = useCallback<RefCallback<HTMLDivElement>>((el) => {\n    widthRef.current = el?.clientWidth ?? -1;\n  }, []);\n\n  const dataSource = useMemo(() => {\n    const columns = tableColumns ?? schema.columns;\n\n    return new VuuDataSource({\n      columns: columns.map((c) => c.name),\n      table: schema.table,\n    });\n  }, [tableColumns, VuuDataSource, schema]);\n\n  const navigation = useControlledTableNavigation(-1, dataSource.size);\n\n  const baseFilterPattern = useMemo(\n    // TODO make this contains once server supports it\n    () => searchColumns.map((col) => `${col} starts \"__VALUE__\"`).join(\" or \"),\n    [searchColumns],\n  );\n\n  // const handleOpenChange = useCallback<OpenChangeHandler>(\n  //   (open, closeReason) => {\n  //     setIsOpen(open);\n  //     onOpenChange?.(open, closeReason);\n  //   },\n  //   [onOpenChange, setIsOpen],\n  // );\n\n  const { context, elements, ...floatingUIProps } = useFloatingUI({\n    open,\n    onOpenChange: setOpen,\n    placement: \"bottom-end\",\n    strategy: \"fixed\",\n    middleware: [\n      size({\n        apply({ rects, elements, availableHeight }) {\n          Object.assign(elements.floating.style, {\n            minWidth: `${rects.reference.width}px`,\n            maxHeight: `max(calc(${availableHeight}px - var(--salt-spacing-100)), calc((var(--salt-size-base) + var(--salt-spacing-100)) * 5))`,\n          });\n        },\n      }),\n      flip({ fallbackStrategy: \"initialPlacement\" }),\n    ],\n  });\n\n  const interactionPropGetters = useInteractions([\n    useDismiss(context),\n    useClick(context, { keyboardHandlers: false, toggle: false }),\n  ]);\n\n  const handleInputChange = useCallback(\n    (evt: ChangeEvent<HTMLInputElement>) => {\n      const { value } = evt.target;\n      setValue(value);\n\n      console.log(`input changed ${value}`);\n\n      if (value && value.trim().length) {\n        const filter = baseFilterPattern.replaceAll(\"__VALUE__\", value);\n        dataSource.filter = {\n          filter,\n        };\n      } else {\n        dataSource.filter = {\n          filter: \"\",\n        };\n      }\n    },\n    [baseFilterPattern, dataSource],\n  );\n\n  const handleSelectRow = useCallback<TableRowSelectHandler>(\n    (dataRow) => {\n      const value = dataRow === null ? \"\" : rowToString(dataRow);\n      setValue(value);\n      onSelect?.(dataRow);\n      // TODO do we need to include a reason ?\n      requestAnimationFrame(() => {\n        setOpen(false);\n      });\n    },\n    [onSelect, rowToString],\n  );\n\n  const handleKeyDown = useCallback<KeyboardEventHandler<HTMLElement>>(\n    (evt) => {\n      if (open) {\n        if (isNavigationKey(evt.key, \"row\") || isRowSelectionKey(evt.key)) {\n          navigation.onKeyDown(evt);\n        }\n      } else {\n        if (evt.key === \"ArrowDown\" || evt.key === \"Enter\") {\n          setOpen(true);\n        }\n      }\n    },\n    [navigation, open],\n  );\n\n  const inputProps = {\n    inputProps: {\n      autoComplete: \"off\",\n      onKeyDown: handleKeyDown,\n    },\n    onChange: handleInputChange,\n  };\n  const tableHandlers = {\n    onSelect: handleSelectRow,\n  };\n\n  const tableConfig = useMemo<TableConfig>(() => {\n    const config = TableProps?.config;\n    if (config) {\n      const {\n        columns = schema.columns,\n        columnLayout = \"fit\",\n        ...rest\n      } = config;\n      return {\n        columns,\n        columnLayout,\n        ...rest,\n      };\n    } else {\n      return {\n        columnLayout: \"fit\",\n        columns: schema.columns,\n      };\n    }\n  }, [TableProps, schema]);\n\n  return {\n    containerRef,\n    dataSource,\n    highlightedIndex: navigation.highlightedIndexRef.current,\n    floatingUIProps,\n    inputProps,\n    interactionPropGetters,\n    onKeyDown: handleKeyDown,\n    open,\n    tableConfig,\n    tableHandlers,\n    tableRef: navigation.tableRef,\n    value,\n    width: widthRef.current,\n  };\n};\n"],"names":["elements","value"],"mappings":"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"}

package/esm/measured-container/MeasuredContainer.css.js

@@ -1,4 +0,0 @@
-var measuredContainerCss = "\n.vuuMeasuredContainer {\n    flex: var(--vuuMeasuredContainer-flex, none);\n    height: var(--vuuMeasuredContainer-height, var(--measured-css-height));\n    min-height: 0;\n    width: var(--measured-css-width);\n  \n}";
-
-export { measuredContainerCss as default };
-//# sourceMappingURL=MeasuredContainer.css.js.map