@salt-ds/lab 1.0.0-alpha.49 → 1.0.0-alpha.50

package/dist-cjs/tokenized-input-next/useTokenizedInputNext.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var core = require('@salt-ds/core');
 var copy = require('clipboard-copy');
-var React = require('react');
+var react = require('react');
 var escapeRegExp = require('../utils/escapeRegExp.js');
 var calcFirstHiddenIndex = require('./internal/calcFirstHiddenIndex.js');
 var useResizeObserver = require('./internal/useResizeObserver.js');
@@ -68,25 +68,25 @@ function useTokenizedInputNext(props) {
   } = props;
   const density = core.useDensity();
   const id = core.useId(idProp);
-  const [focused, setFocused] = React.useState(false);
-  const [pillGroupWidth, setPillGroupWidth] = React.useState(null);
-  const [firstHiddenIndex, setFirstHiddenIndex] = React.useState(null);
-  const [activeIndices, setActiveIndices] = React.useState([]);
-  const [highlightedIndex, setHighlightedIndex] = React.useState(
+  const [focused, setFocused] = react.useState(false);
+  const [pillGroupWidth, setPillGroupWidth] = react.useState(null);
+  const [firstHiddenIndex, setFirstHiddenIndex] = react.useState(null);
+  const [activeIndices, setActiveIndices] = react.useState([]);
+  const [highlightedIndex, setHighlightedIndex] = react.useState(
     void 0
   );
   const [expandButtonHookRef, expandButtonWidth] = useWidth.useWidth(density);
   const [clearButtonRef, clearButtonWidth] = useWidth.useWidth(density);
   const [statusAdornmentRef, statusAdornmentWidth] = useWidth.useWidth(density);
   const [inputRef, inputWidth] = useWidth.useWidth(density);
-  const containerRef = React.useRef(null);
-  const pillsRef = React.useRef({});
-  const textAreaRef = React.useRef(null);
-  const preventBlurOnCopy = React.useRef(false);
+  const containerRef = react.useRef(null);
+  const pillsRef = react.useRef({});
+  const textAreaRef = react.useRef(null);
+  const preventBlurOnCopy = react.useRef(false);
   const expandButtonRef = core.useForkRef(expandButtonHookRef, expandButtonRefProp);
   const hasActiveItems = Boolean(activeIndices.length);
   const primaryDelimiter = delimiters[0];
-  const delimiterRegex = React.useMemo(
+  const delimiterRegex = react.useMemo(
     () => new RegExp(delimiters.map(escapeRegExp.escapeRegExp).join("|"), "gi"),
     [delimiters]
   );
@@ -110,7 +110,7 @@ function useTokenizedInputNext(props) {
   });
   const widthOffset = inputWidth + statusAdornmentWidth + (expanded ? clearButtonWidth : expandButtonWidth);
   const containerObserverRef = useResizeObserver.useResizeObserver(
-    React.useCallback(
+    react.useCallback(
       ([{ contentRect }]) => {
         const padding = useWidth.getPadding(containerRef.current);
         setPillGroupWidth(contentRect.width - padding - widthOffset);
@@ -141,7 +141,7 @@ function useTokenizedInputNext(props) {
     },
     [expanded, pillGroupWidth, selectedItems]
   );
-  const focusInput = React.useCallback(() => {
+  const focusInput = react.useCallback(() => {
     if (textAreaRef.current) {
       textAreaRef.current.focus();
     }
@@ -151,7 +151,7 @@ function useTokenizedInputNext(props) {
       setValue(newValue);
     }
   };
-  const updateSelectedItems = React.useCallback(
+  const updateSelectedItems = react.useCallback(
     (event, action) => {
       if (!isSelectionControlled) {
         setSelectedItems((prevSelectedItems) => {
@@ -186,7 +186,7 @@ function useTokenizedInputNext(props) {
     setHighlightedIndex(void 0);
     setActiveIndices([]);
   };
-  const removeItems = React.useCallback(
+  const removeItems = react.useCallback(
     (event, itemIndices) => {
       updateSelectedItems(
         event,

package/dist-cjs/toolbar/Toolbar.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var jsxRuntime = require('react/jsx-runtime');
 var core = require('@salt-ds/core');
 var clsx = require('clsx');
-var React = require('react');
+var react = require('react');
 var OverflowPanel = require('./overflow-panel/OverflowPanel.js');
 var OverflowSeparator = require('./overflow-panel/OverflowSeparator.js');
 var overflowUtils = require('../responsive/overflowUtils.js');
@@ -19,7 +19,7 @@ var window = require('@salt-ds/window');
 var Toolbar$1 = require('./Toolbar.css.js');
 
 const classBase = "saltToolbar";
-const Toolbar = React.forwardRef(
+const Toolbar = react.forwardRef(
   function Toolbar2(props, ref) {
     const {
       TooltipComponent,
@@ -43,7 +43,7 @@ const Toolbar = React.forwardRef(
       window: targetWindow
     });
     const toolbarId = core.useIdMemo(idProp);
-    const containerRef = React.useRef(null);
+    const containerRef = react.useRef(null);
     const setContainerRef = core.useForkRef(ref, containerRef);
     const collectionHook = useOverflowCollectionItems.useOverflowCollectionItems({
       children,
@@ -65,9 +65,9 @@ const Toolbar = React.forwardRef(
           const tooltrayProps = element.props;
           const nestedElements = tooltrayProps.children;
           items.push(
-            ...React.Children.map(
+            ...react.Children.map(
               nestedElements,
-              (el) => React.cloneElement(el, {
+              (el) => react.cloneElement(el, {
                 "data-is-inside-panel": true,
                 key: id
               })
@@ -78,7 +78,7 @@ const Toolbar = React.forwardRef(
           }
         } else {
           items.push(
-            React.cloneElement(element, {
+            react.cloneElement(element, {
               key: id,
               "data-is-inside-panel": true
             })

package/dist-cjs/toolbar/ToolbarButton.js

@@ -4,12 +4,12 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
 var core = require('@salt-ds/core');
-var React = require('react');
+var react = require('react');
 var styles = require('@salt-ds/styles');
 var window = require('@salt-ds/window');
 var ToolbarButton$1 = require('./ToolbarButton.css.js');
 
-const ToolbarButton = React.forwardRef(
+const ToolbarButton = react.forwardRef(
   function ToolbarButton2({ label, ...props }, forwardedRef) {
     const targetWindow = window.useWindow();
     styles.useComponentCssInjection({

package/dist-cjs/toolbar/Tooltray.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var jsxRuntime = require('react/jsx-runtime');
 var core = require('@salt-ds/core');
 var clsx = require('clsx');
-var React = require('react');
+var react = require('react');
 var OverflowPanel = require('./overflow-panel/OverflowPanel.js');
 var useOverflowCollectionItems = require('../responsive/useOverflowCollectionItems.js');
 var useOverflowLayout = require('../responsive/useOverflowLayout.js');
@@ -59,7 +59,7 @@ const Tooltray = (props) => {
   });
   const overflowedItems = collapsed ? collectionHook.data.filter((item) => !item.isOverflowIndicator) : collectionHook.data.filter((item) => item.overflowed);
   const overflowMenuItems = overflowedItems.map(
-    (i) => React.cloneElement(collectionHook.data[i.index].element, {
+    (i) => react.cloneElement(collectionHook.data[i.index].element, {
       "data-is-inside-panel": true,
       key: i.index
     })

package/dist-cjs/toolbar/internal/renderToolbarItems.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
+var react = require('react');
 var ToolbarField = require('../toolbar-field/ToolbarField.js');
 var Tooltray = require('../Tooltray.js');
 require('@salt-ds/core');
@@ -11,10 +11,6 @@ var overflowUtils = require('../../responsive/overflowUtils.js');
 require('../../responsive/useResizeObserver.js');
 var utils = require('../../responsive/utils.js');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
 const renderToolbarItems = (collectionHook, overflowedItems, orientation) => {
   let centerAlign = false;
   let rightAlign = false;
@@ -62,14 +58,14 @@ const renderToolbarItems = (collectionHook, overflowedItems, orientation) => {
       orientation
     };
     if (item.element.type === Tooltray.Tooltray) {
-      return React__default["default"].cloneElement(item.element, toolbarItemProps);
+      return react.cloneElement(item.element, toolbarItemProps);
     }
     switch (item.element.type) {
       case ToolbarField.ToolbarField: {
         const props2 = item.element.props;
-        return React__default["default"].cloneElement(item.element, {
+        return react.cloneElement(item.element, {
           ...toolbarItemProps,
-          children: React__default["default"].cloneElement(props2.children, {
+          children: react.cloneElement(props2.children, {
             id: `toolbar-control-${item.id}`
           })
         });
@@ -79,7 +75,7 @@ const renderToolbarItems = (collectionHook, overflowedItems, orientation) => {
         return /* @__PURE__ */ jsxRuntime.jsx(ToolbarField.ToolbarField, {
           ...responsiveProps,
           ...toolbarItemProps,
-          children: React__default["default"].cloneElement(item.element, {
+          children: react.cloneElement(item.element, {
             ...componentProps,
             id: `toolbar-control-${item.id}`
           })

package/dist-cjs/toolbar/internal/renderToolbarItems.js.map

@@ -1 +1 @@
-{"version":3,"file":"renderToolbarItems.js","sources":["../src/toolbar/internal/renderToolbarItems.tsx"],"sourcesContent":["import React, { type HTMLAttributes, type ReactElement } from \"react\";\n\nimport type { ToolbarAlignmentProps } from \"../ToolbarProps\";\nimport { ToolbarField, type ToolbarFieldProps } from \"../toolbar-field\";\n\nimport { Tooltray } from \"../Tooltray\";\n\nimport {\n  type OverflowCollectionHookResult,\n  type OverflowItem,\n  isCollapsedOrCollapsing,\n  liftResponsivePropsToFormField,\n  type orientationType,\n} from \"../../responsive\";\n\n// These are the props we use for item alignment, either from individual element\n// declarations - e.g Tooltray (alignLeft etc) or generic data- attributes\ninterface ToolbarElementProps\n  extends ToolbarAlignmentProps,\n    HTMLAttributes<HTMLDivElement> {\n  \"data-align-center\"?: boolean;\n  \"data-align-end\"?: boolean;\n  \"data-align-start\"?: boolean;\n  \"data-priority\"?: number;\n}\n\nexport const renderToolbarItems = (\n  collectionHook: OverflowCollectionHookResult,\n  overflowedItems: OverflowItem[],\n  orientation: orientationType,\n): JSX.Element[] => {\n  let centerAlign = false;\n  let rightAlign = false;\n\n  const items = collectionHook.data;\n  const collapseItems = items.filter(isCollapsedOrCollapsing);\n\n  return items\n    .filter((item) => !item.isOverflowIndicator)\n    .map((item: OverflowItem, index) => {\n      const props = item.element.props as ToolbarElementProps;\n      const overflowed =\n        overflowedItems.findIndex((item) => item.index === index) === -1\n          ? undefined\n          : true;\n      const collapseItem = collapseItems.find((item) => item.index === index);\n      const collapsed = collapseItem?.collapsed || undefined;\n      const collapsing = collapseItem?.collapsing || undefined;\n\n      const {\n        alignCenter: alignCenterProp,\n        alignEnd: alignEndProp,\n        alignStart: alignStartProp,\n        \"data-align-center\": alignCenter = alignCenterProp,\n        \"data-align-end\": alignEnd = alignEndProp,\n        \"data-align-start\": alignStart = alignStartProp,\n      } = props;\n\n      let dataPadStart = false;\n      let dataPadEnd = false;\n      if (alignCenter && !centerAlign) {\n        centerAlign = true;\n        dataPadStart = true;\n      } else if (centerAlign && !alignCenter) {\n        rightAlign = true;\n        dataPadStart = true;\n      } else if (alignEnd && !rightAlign) {\n        rightAlign = true;\n        dataPadStart = true;\n      } else if (alignStart) {\n        dataPadEnd = true;\n      }\n\n      const toolbarItemProps = {\n        id: item.id,\n        key: item.id,\n        \"data-index\": index,\n        \"data-priority\": props[\"data-priority\"] ?? 2,\n        \"data-pad-start\": dataPadStart || undefined,\n        \"data-pad-end\": dataPadEnd || undefined,\n        \"data-collapsed\": collapsed,\n        \"data-collapsing\": collapsing,\n        \"data-overflowed\": overflowed,\n        orientation,\n      };\n\n      if (item.element.type === Tooltray) {\n        return React.cloneElement(item.element, toolbarItemProps);\n      }\n      switch (item.element.type) {\n        case ToolbarField: {\n          const props = item.element.props as ToolbarFieldProps;\n          return React.cloneElement(item.element, {\n            ...toolbarItemProps,\n            children: React.cloneElement(props.children as ReactElement, {\n              // Inject an id that nested Control can use to query status via context\n              id: `toolbar-control-${item.id}`,\n            }),\n          } as ToolbarFieldProps);\n        }\n        default: {\n          const [responsiveProps, componentProps] =\n            liftResponsivePropsToFormField(item.element.props);\n\n          return (\n            <ToolbarField {...responsiveProps} {...toolbarItemProps}>\n              {React.cloneElement(item.element, {\n                ...componentProps,\n                // Inject an id that nested Control can use to query status via context\n                id: `toolbar-control-${item.id}`,\n              })}\n            </ToolbarField>\n          );\n        }\n      }\n    });\n};\n"],"names":["isCollapsedOrCollapsing","item","Tooltray","React","ToolbarField","props","liftResponsivePropsToFormField","jsx"],"mappings":"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"}
+{"version":3,"file":"renderToolbarItems.js","sources":["../src/toolbar/internal/renderToolbarItems.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactElement, cloneElement } from \"react\";\n\nimport type { ToolbarAlignmentProps } from \"../ToolbarProps\";\nimport { ToolbarField, type ToolbarFieldProps } from \"../toolbar-field\";\n\nimport { Tooltray } from \"../Tooltray\";\n\nimport {\n  type OverflowCollectionHookResult,\n  type OverflowItem,\n  isCollapsedOrCollapsing,\n  liftResponsivePropsToFormField,\n  type orientationType,\n} from \"../../responsive\";\n\n// These are the props we use for item alignment, either from individual element\n// declarations - e.g Tooltray (alignLeft etc) or generic data- attributes\ninterface ToolbarElementProps\n  extends ToolbarAlignmentProps,\n    HTMLAttributes<HTMLDivElement> {\n  \"data-align-center\"?: boolean;\n  \"data-align-end\"?: boolean;\n  \"data-align-start\"?: boolean;\n  \"data-priority\"?: number;\n}\n\nexport const renderToolbarItems = (\n  collectionHook: OverflowCollectionHookResult,\n  overflowedItems: OverflowItem[],\n  orientation: orientationType,\n): JSX.Element[] => {\n  let centerAlign = false;\n  let rightAlign = false;\n\n  const items = collectionHook.data;\n  const collapseItems = items.filter(isCollapsedOrCollapsing);\n\n  return items\n    .filter((item) => !item.isOverflowIndicator)\n    .map((item: OverflowItem, index) => {\n      const props = item.element.props as ToolbarElementProps;\n      const overflowed =\n        overflowedItems.findIndex((item) => item.index === index) === -1\n          ? undefined\n          : true;\n      const collapseItem = collapseItems.find((item) => item.index === index);\n      const collapsed = collapseItem?.collapsed || undefined;\n      const collapsing = collapseItem?.collapsing || undefined;\n\n      const {\n        alignCenter: alignCenterProp,\n        alignEnd: alignEndProp,\n        alignStart: alignStartProp,\n        \"data-align-center\": alignCenter = alignCenterProp,\n        \"data-align-end\": alignEnd = alignEndProp,\n        \"data-align-start\": alignStart = alignStartProp,\n      } = props;\n\n      let dataPadStart = false;\n      let dataPadEnd = false;\n      if (alignCenter && !centerAlign) {\n        centerAlign = true;\n        dataPadStart = true;\n      } else if (centerAlign && !alignCenter) {\n        rightAlign = true;\n        dataPadStart = true;\n      } else if (alignEnd && !rightAlign) {\n        rightAlign = true;\n        dataPadStart = true;\n      } else if (alignStart) {\n        dataPadEnd = true;\n      }\n\n      const toolbarItemProps = {\n        id: item.id,\n        key: item.id,\n        \"data-index\": index,\n        \"data-priority\": props[\"data-priority\"] ?? 2,\n        \"data-pad-start\": dataPadStart || undefined,\n        \"data-pad-end\": dataPadEnd || undefined,\n        \"data-collapsed\": collapsed,\n        \"data-collapsing\": collapsing,\n        \"data-overflowed\": overflowed,\n        orientation,\n      };\n\n      if (item.element.type === Tooltray) {\n        return cloneElement(item.element, toolbarItemProps);\n      }\n      switch (item.element.type) {\n        case ToolbarField: {\n          const props = item.element.props as ToolbarFieldProps;\n          return cloneElement(item.element, {\n            ...toolbarItemProps,\n            children: cloneElement(props.children as ReactElement, {\n              // Inject an id that nested Control can use to query status via context\n              id: `toolbar-control-${item.id}`,\n            }),\n          } as ToolbarFieldProps);\n        }\n        default: {\n          const [responsiveProps, componentProps] =\n            liftResponsivePropsToFormField(item.element.props);\n\n          return (\n            <ToolbarField {...responsiveProps} {...toolbarItemProps}>\n              {cloneElement(item.element, {\n                ...componentProps,\n                // Inject an id that nested Control can use to query status via context\n                id: `toolbar-control-${item.id}`,\n              })}\n            </ToolbarField>\n          );\n        }\n      }\n    });\n};\n"],"names":["isCollapsedOrCollapsing","item","Tooltray","cloneElement","ToolbarField","props","liftResponsivePropsToFormField","jsx"],"mappings":"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"}

package/dist-cjs/toolbar/internal/renderTrayTools.js

@@ -2,14 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var React = require('react');
+var react = require('react');
 var utils = require('../../responsive/utils.js');
 var ToolbarField = require('../toolbar-field/ToolbarField.js');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
 const renderTrayTools = (collectionHook, overflowedItems, orientation, collapsed) => {
   if (collapsed) {
     return [];
@@ -29,30 +25,30 @@ const renderTrayTools = (collectionHook, overflowedItems, orientation, collapsed
       orientation
     };
     if (item.element.type === ToolbarField.ToolbarField) {
-      return React__default["default"].cloneElement(item.element, {
+      return react.cloneElement(item.element, {
         key: index,
         ...toolbarItemProps
       });
     }
     if (Object.keys(props).some(utils.isResponsiveAttribute)) {
       const [toolbarProps, restProps] = utils.liftResponsivePropsToFormField(props);
-      return /* @__PURE__ */ React.createElement(ToolbarField.ToolbarField, {
+      return /* @__PURE__ */ react.createElement(ToolbarField.ToolbarField, {
         ...toolbarProps,
         ...toolbarItemProps,
         "data-index": index,
         "data-priority": 2,
         key: index,
         "data-orientation": orientation
-      }, React__default["default"].cloneElement(item.element, { ...restProps }));
+      }, react.cloneElement(item.element, { ...restProps }));
     }
-    return /* @__PURE__ */ React.createElement(ToolbarField.ToolbarField, {
+    return /* @__PURE__ */ react.createElement(ToolbarField.ToolbarField, {
       ...toolbarItemProps,
       "data-index": index,
       "data-overflowed": overflowed,
       "data-priority": 2,
       key: index,
       "data-orientation": orientation
-    }, React__default["default"].cloneElement(item.element, {
+    }, react.cloneElement(item.element, {
       id: `tooltray-control-${item.id}`
     }));
   });

package/dist-cjs/toolbar/internal/renderTrayTools.js.map

@@ -1 +1 @@
-{"version":3,"file":"renderTrayTools.js","sources":["../src/toolbar/internal/renderTrayTools.tsx"],"sourcesContent":["import React, { type ReactNode } from \"react\";\nimport type {\n  OverflowCollectionHookResult,\n  OverflowItem,\n} from \"../../responsive/overflowTypes\";\nimport {\n  isResponsiveAttribute,\n  liftResponsivePropsToFormField,\n} from \"../../responsive/utils\";\nimport type { OrientationShape } from \"../ToolbarProps\";\nimport { ToolbarField } from \"../toolbar-field/ToolbarField\";\n\ntype TooltrayItem = {\n  \"data-priority\"?: number | string;\n  className: string;\n};\n\nexport const renderTrayTools = (\n  collectionHook: OverflowCollectionHookResult,\n  overflowedItems: OverflowItem[],\n  orientation: OrientationShape,\n  collapsed?: boolean | string,\n): ReactNode => {\n  if (collapsed) {\n    return [];\n  }\n\n  let index = -1;\n\n  const items = collectionHook.data.filter((item) => !item.isOverflowIndicator);\n\n  return items.map((item) => {\n    index += 1;\n    const props = item.element.props as TooltrayItem;\n\n    const overflowed =\n      overflowedItems.findIndex((i) => i.index === index) === -1\n        ? undefined\n        : true;\n\n    const toolbarItemProps = {\n      \"data-index\": index,\n      \"data-priority\": props[\"data-priority\"] ?? 2,\n      \"data-overflowed\": overflowed,\n      id: item.id,\n      orientation,\n    };\n    if (item.element.type === ToolbarField) {\n      return React.cloneElement(item.element, {\n        key: index,\n        ...toolbarItemProps,\n      });\n    }\n    if (Object.keys(props).some(isResponsiveAttribute)) {\n      const [toolbarProps, restProps] = liftResponsivePropsToFormField(props);\n      return (\n        <ToolbarField\n          {...toolbarProps}\n          {...toolbarItemProps}\n          // don't think we need the data-index\n          data-index={index}\n          data-priority={2}\n          key={index}\n          data-orientation={orientation}\n        >\n          {/* We clone here just to remove the responsive props */}\n          {React.cloneElement(item.element, { ...restProps })}\n        </ToolbarField>\n      );\n    }\n    return (\n      <ToolbarField\n        {...toolbarItemProps}\n        data-index={index}\n        data-overflowed={overflowed}\n        data-priority={2}\n        key={index}\n        data-orientation={orientation}\n      >\n        {React.cloneElement(item.element, {\n          id: `tooltray-control-${item.id}`,\n        })}\n      </ToolbarField>\n    );\n  });\n};\n"],"names":["ToolbarField","React","isResponsiveAttribute","liftResponsivePropsToFormField","createElement"],"mappings":";;;;;;;;;;;;AAiBO,MAAM,eAAkB,GAAA,CAC7B,cACA,EAAA,eAAA,EACA,aACA,SACc,KAAA;AACd,EAAA,IAAI,SAAW,EAAA;AACb,IAAA,OAAO,EAAC,CAAA;AAAA,GACV;AAEA,EAAA,IAAI,KAAQ,GAAA,CAAA,CAAA,CAAA;AAEZ,EAAM,MAAA,KAAA,GAAQ,eAAe,IAAK,CAAA,MAAA,CAAO,CAAC,IAAS,KAAA,CAAC,KAAK,mBAAmB,CAAA,CAAA;AAE5E,EAAO,OAAA,KAAA,CAAM,GAAI,CAAA,CAAC,IAAS,KAAA;AA/B7B,IAAA,IAAA,EAAA,CAAA;AAgCI,IAAS,KAAA,IAAA,CAAA,CAAA;AACT,IAAM,MAAA,KAAA,GAAQ,KAAK,OAAQ,CAAA,KAAA,CAAA;AAE3B,IAAM,MAAA,UAAA,GACJ,eAAgB,CAAA,SAAA,CAAU,CAAC,CAAA,KAAM,EAAE,KAAU,KAAA,KAAK,CAAM,KAAA,CAAA,CAAA,GACpD,KACA,CAAA,GAAA,IAAA,CAAA;AAEN,IAAA,MAAM,gBAAmB,GAAA;AAAA,MACvB,YAAc,EAAA,KAAA;AAAA,MACd,eAAA,EAAA,CAAiB,EAAM,GAAA,KAAA,CAAA,eAAA,CAAA,KAAN,IAA0B,GAAA,EAAA,GAAA,CAAA;AAAA,MAC3C,iBAAmB,EAAA,UAAA;AAAA,MACnB,IAAI,IAAK,CAAA,EAAA;AAAA,MACT,WAAA;AAAA,KACF,CAAA;AACA,IAAI,IAAA,IAAA,CAAK,OAAQ,CAAA,IAAA,KAASA,yBAAc,EAAA;AACtC,MAAO,OAAAC,yBAAA,CAAM,YAAa,CAAA,IAAA,CAAK,OAAS,EAAA;AAAA,QACtC,GAAK,EAAA,KAAA;AAAA,QACL,GAAG,gBAAA;AAAA,OACJ,CAAA,CAAA;AAAA,KACH;AACA,IAAA,IAAI,OAAO,IAAK,CAAA,KAAK,CAAE,CAAA,IAAA,CAAKC,2BAAqB,CAAG,EAAA;AAClD,MAAA,MAAM,CAAC,YAAA,EAAc,SAAS,CAAA,GAAIC,qCAA+B,KAAK,CAAA,CAAA;AACtE,MAAA,uBACGC,mBAAA,CAAAJ,yBAAA,EAAA;AAAA,QACE,GAAG,YAAA;AAAA,QACH,GAAG,gBAAA;AAAA,QAEJ,YAAY,EAAA,KAAA;AAAA,QACZ,eAAe,EAAA,CAAA;AAAA,QACf,GAAK,EAAA,KAAA;AAAA,QACL,kBAAkB,EAAA,WAAA;AAAA,OAGjB,EAAAC,yBAAA,CAAM,aAAa,IAAK,CAAA,OAAA,EAAS,EAAE,GAAG,SAAA,EAAW,CACpD,CAAA,CAAA;AAAA,KAEJ;AACA,IAAA,uBACGG,mBAAA,CAAAJ,yBAAA,EAAA;AAAA,MACE,GAAG,gBAAA;AAAA,MACJ,YAAY,EAAA,KAAA;AAAA,MACZ,iBAAiB,EAAA,UAAA;AAAA,MACjB,eAAe,EAAA,CAAA;AAAA,MACf,GAAK,EAAA,KAAA;AAAA,MACL,kBAAkB,EAAA,WAAA;AAAA,KAEjB,EAAAC,yBAAA,CAAM,YAAa,CAAA,IAAA,CAAK,OAAS,EAAA;AAAA,MAChC,EAAA,EAAI,oBAAoB,IAAK,CAAA,EAAA,CAAA,CAAA;AAAA,KAC9B,CACH,CAAA,CAAA;AAAA,GAEH,CAAA,CAAA;AACH;;;;"}
+{"version":3,"file":"renderTrayTools.js","sources":["../src/toolbar/internal/renderTrayTools.tsx"],"sourcesContent":["import React, { cloneElement, type ReactNode } from \"react\";\nimport type {\n  OverflowCollectionHookResult,\n  OverflowItem,\n} from \"../../responsive/overflowTypes\";\nimport {\n  isResponsiveAttribute,\n  liftResponsivePropsToFormField,\n} from \"../../responsive/utils\";\nimport type { OrientationShape } from \"../ToolbarProps\";\nimport { ToolbarField } from \"../toolbar-field/ToolbarField\";\n\ntype TooltrayItem = {\n  \"data-priority\"?: number | string;\n  className: string;\n};\n\nexport const renderTrayTools = (\n  collectionHook: OverflowCollectionHookResult,\n  overflowedItems: OverflowItem[],\n  orientation: OrientationShape,\n  collapsed?: boolean | string,\n): ReactNode => {\n  if (collapsed) {\n    return [];\n  }\n\n  let index = -1;\n\n  const items = collectionHook.data.filter((item) => !item.isOverflowIndicator);\n\n  return items.map((item) => {\n    index += 1;\n    const props = item.element.props as TooltrayItem;\n\n    const overflowed =\n      overflowedItems.findIndex((i) => i.index === index) === -1\n        ? undefined\n        : true;\n\n    const toolbarItemProps = {\n      \"data-index\": index,\n      \"data-priority\": props[\"data-priority\"] ?? 2,\n      \"data-overflowed\": overflowed,\n      id: item.id,\n      orientation,\n    };\n    if (item.element.type === ToolbarField) {\n      return cloneElement(item.element, {\n        key: index,\n        ...toolbarItemProps,\n      });\n    }\n    if (Object.keys(props).some(isResponsiveAttribute)) {\n      const [toolbarProps, restProps] = liftResponsivePropsToFormField(props);\n      return (\n        <ToolbarField\n          {...toolbarProps}\n          {...toolbarItemProps}\n          // don't think we need the data-index\n          data-index={index}\n          data-priority={2}\n          key={index}\n          data-orientation={orientation}\n        >\n          {/* We clone here just to remove the responsive props */}\n          {cloneElement(item.element, { ...restProps })}\n        </ToolbarField>\n      );\n    }\n    return (\n      <ToolbarField\n        {...toolbarItemProps}\n        data-index={index}\n        data-overflowed={overflowed}\n        data-priority={2}\n        key={index}\n        data-orientation={orientation}\n      >\n        {cloneElement(item.element, {\n          id: `tooltray-control-${item.id}`,\n        })}\n      </ToolbarField>\n    );\n  });\n};\n"],"names":["ToolbarField","cloneElement","isResponsiveAttribute","liftResponsivePropsToFormField","createElement"],"mappings":";;;;;;;;AAiBO,MAAM,eAAkB,GAAA,CAC7B,cACA,EAAA,eAAA,EACA,aACA,SACc,KAAA;AACd,EAAA,IAAI,SAAW,EAAA;AACb,IAAA,OAAO,EAAC,CAAA;AAAA,GACV;AAEA,EAAA,IAAI,KAAQ,GAAA,CAAA,CAAA,CAAA;AAEZ,EAAM,MAAA,KAAA,GAAQ,eAAe,IAAK,CAAA,MAAA,CAAO,CAAC,IAAS,KAAA,CAAC,KAAK,mBAAmB,CAAA,CAAA;AAE5E,EAAO,OAAA,KAAA,CAAM,GAAI,CAAA,CAAC,IAAS,KAAA;AA/B7B,IAAA,IAAA,EAAA,CAAA;AAgCI,IAAS,KAAA,IAAA,CAAA,CAAA;AACT,IAAM,MAAA,KAAA,GAAQ,KAAK,OAAQ,CAAA,KAAA,CAAA;AAE3B,IAAM,MAAA,UAAA,GACJ,eAAgB,CAAA,SAAA,CAAU,CAAC,CAAA,KAAM,EAAE,KAAU,KAAA,KAAK,CAAM,KAAA,CAAA,CAAA,GACpD,KACA,CAAA,GAAA,IAAA,CAAA;AAEN,IAAA,MAAM,gBAAmB,GAAA;AAAA,MACvB,YAAc,EAAA,KAAA;AAAA,MACd,eAAA,EAAA,CAAiB,EAAM,GAAA,KAAA,CAAA,eAAA,CAAA,KAAN,IAA0B,GAAA,EAAA,GAAA,CAAA;AAAA,MAC3C,iBAAmB,EAAA,UAAA;AAAA,MACnB,IAAI,IAAK,CAAA,EAAA;AAAA,MACT,WAAA;AAAA,KACF,CAAA;AACA,IAAI,IAAA,IAAA,CAAK,OAAQ,CAAA,IAAA,KAASA,yBAAc,EAAA;AACtC,MAAO,OAAAC,kBAAA,CAAa,KAAK,OAAS,EAAA;AAAA,QAChC,GAAK,EAAA,KAAA;AAAA,QACL,GAAG,gBAAA;AAAA,OACJ,CAAA,CAAA;AAAA,KACH;AACA,IAAA,IAAI,OAAO,IAAK,CAAA,KAAK,CAAE,CAAA,IAAA,CAAKC,2BAAqB,CAAG,EAAA;AAClD,MAAA,MAAM,CAAC,YAAA,EAAc,SAAS,CAAA,GAAIC,qCAA+B,KAAK,CAAA,CAAA;AACtE,MAAA,uBACGC,mBAAA,CAAAJ,yBAAA,EAAA;AAAA,QACE,GAAG,YAAA;AAAA,QACH,GAAG,gBAAA;AAAA,QAEJ,YAAY,EAAA,KAAA;AAAA,QACZ,eAAe,EAAA,CAAA;AAAA,QACf,GAAK,EAAA,KAAA;AAAA,QACL,kBAAkB,EAAA,WAAA;AAAA,OAAA,EAGjBC,mBAAa,IAAK,CAAA,OAAA,EAAS,EAAE,GAAG,SAAA,EAAW,CAC9C,CAAA,CAAA;AAAA,KAEJ;AACA,IAAA,uBACGG,mBAAA,CAAAJ,yBAAA,EAAA;AAAA,MACE,GAAG,gBAAA;AAAA,MACJ,YAAY,EAAA,KAAA;AAAA,MACZ,iBAAiB,EAAA,UAAA;AAAA,MACjB,eAAe,EAAA,CAAA;AAAA,MACf,GAAK,EAAA,KAAA;AAAA,MACL,kBAAkB,EAAA,WAAA;AAAA,KAEjB,EAAAC,kBAAA,CAAa,KAAK,OAAS,EAAA;AAAA,MAC1B,EAAA,EAAI,oBAAoB,IAAK,CAAA,EAAA,CAAA,CAAA;AAAA,KAC9B,CACH,CAAA,CAAA;AAAA,GAEH,CAAA,CAAA;AACH;;;;"}

package/dist-cjs/toolbar/overflow-panel/OverflowPanel.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
+var react = require('react');
 var core = require('@salt-ds/core');
 var icons = require('@salt-ds/icons');
 var clsx = require('clsx');
@@ -22,12 +22,8 @@ var styles = require('@salt-ds/styles');
 var window = require('@salt-ds/window');
 var OverflowPanel$1 = require('./OverflowPanel.css.js');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
 const withBaseName = core.makePrefixer("saltOverflowPanel");
-const OverflowPanel = React.forwardRef(function DropdownPanel({
+const OverflowPanel = react.forwardRef(function DropdownPanel({
   children,
   className,
   defaultIsOpen,
@@ -48,7 +44,7 @@ const OverflowPanel = React.forwardRef(function DropdownPanel({
     id,
     children
   });
-  const triggerRef = React.useRef(null);
+  const triggerRef = react.useRef(null);
   const [isOpen, setIsOpen] = core.useControlled({
     controlled: isOpenProp,
     default: defaultIsOpen || false,
@@ -60,12 +56,12 @@ const OverflowPanel = React.forwardRef(function DropdownPanel({
     focusOnHighlight: true,
     indexPositions: collectionHook.data
   });
-  const focusTrigger = React.useCallback(() => {
+  const focusTrigger = react.useCallback(() => {
     if (triggerRef.current) {
       triggerRef.current.focus();
     }
   }, []);
-  const setPanelRef = React.useCallback((el) => el == null ? void 0 : el.focus(), []);
+  const setPanelRef = react.useCallback((el) => el == null ? void 0 : el.focus(), []);
   const handleItemClick = (evt) => {
     setIsOpen(false);
     focusTrigger();
@@ -108,12 +104,9 @@ const OverflowPanel = React.forwardRef(function DropdownPanel({
             onClick: handleItemClick
           };
           if (type === ToolbarField.ToolbarField) {
-            return React__default["default"].cloneElement(
-              item.value,
-              formFieldProps
-            );
+            return react.cloneElement(item.value, formFieldProps);
           }
-          return /* @__PURE__ */ React.createElement(ToolbarField.ToolbarField, {
+          return /* @__PURE__ */ react.createElement(ToolbarField.ToolbarField, {
             ...formFieldProps,
             key: item.id
           }, item.value);

package/dist-cjs/toolbar/overflow-panel/OverflowPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"OverflowPanel.js","sources":["../src/toolbar/overflow-panel/OverflowPanel.tsx"],"sourcesContent":["import {\n  Button,\n  makePrefixer,\n  useControlled,\n  useIdMemo as useId,\n} from \"@salt-ds/core\";\nimport { OverflowMenuIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport React, {\n  type ForwardedRef,\n  forwardRef,\n  type MouseEvent,\n  type ReactElement,\n  useCallback,\n  useRef,\n} from \"react\";\nimport { ToolbarField, type ToolbarFieldProps } from \"../toolbar-field\";\nimport { OverflowSeparator } from \"./OverflowSeparator\";\n\nimport {\n  useCollectionItems,\n  useKeyboardNavigationPanel,\n} from \"../../common-hooks\";\n\nimport { DropdownBase, type DropdownBaseProps } from \"../../dropdown\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport overflowPanelCss from \"./OverflowPanel.css\";\n\nconst withBaseName = makePrefixer(\"saltOverflowPanel\");\n\nexport interface DropdownPanelProps extends DropdownBaseProps {\n  /**\n   * Trigger button icon\n   */\n  triggerButtonIcon?: JSX.Element;\n  /**\n   * Trigger button text\n   */\n  triggerButtonLabel?: string;\n}\n\nexport const OverflowPanel = forwardRef(function DropdownPanel(\n  {\n    children,\n    className,\n    defaultIsOpen,\n    isOpen: isOpenProp,\n    onOpenChange,\n    triggerButtonIcon,\n    triggerButtonLabel,\n    ...props\n  }: DropdownPanelProps,\n  forwardedRef?: ForwardedRef<HTMLDivElement>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-overflow-panel\",\n    css: overflowPanelCss,\n    window: targetWindow,\n  });\n\n  const id = useId();\n  const collectionHook = useCollectionItems<ReactElement>({\n    id,\n    children,\n  });\n\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const [isOpen, setIsOpen] = useControlled<boolean>({\n    controlled: isOpenProp,\n    default: defaultIsOpen || false,\n    name: \"DropdownPanel\",\n  });\n\n  const { highlightedIndex: highlightedIdx, ...keyboardHook } =\n    useKeyboardNavigationPanel({\n      cycleFocus: true,\n      defaultHighlightedIndex: 0,\n      focusOnHighlight: true,\n      indexPositions: collectionHook.data,\n    });\n\n  const focusTrigger = useCallback(() => {\n    if (triggerRef.current) {\n      triggerRef.current.focus();\n    }\n  }, []);\n\n  const setPanelRef = useCallback((el: HTMLElement | null) => el?.focus(), []);\n\n  const handleItemClick = (evt: MouseEvent) => {\n    // if (sourceItem.props[\"data-close-on-click\"] !== false) closeMenu();\n    setIsOpen(false);\n    focusTrigger();\n  };\n\n  const handleOpenChange = (open: boolean) => {\n    setIsOpen(open);\n    onOpenChange?.(open);\n  };\n\n  const getTriggerButtonIcon = () =>\n    triggerButtonIcon ?? triggerButtonLabel === undefined ? (\n      <OverflowMenuIcon />\n    ) : undefined;\n\n  return (\n    <DropdownBase\n      {...props}\n      className={clsx(withBaseName(), className)}\n      isOpen={isOpen}\n      onOpenChange={handleOpenChange}\n      placement=\"bottom-end\"\n      ref={forwardedRef}\n    >\n      <Button variant=\"secondary\" ref={triggerRef}>\n        {getTriggerButtonIcon()}\n        {triggerButtonLabel}\n      </Button>\n      <div\n        className={withBaseName(\"content\")}\n        ref={setPanelRef}\n        tabIndex={-1}\n        {...keyboardHook.listProps}\n      >\n        {collectionHook.data.map((item) => {\n          const { type } = item.value as ReactElement;\n          if (type === OverflowSeparator) {\n            return item.value;\n          }\n          const formFieldProps = {\n            id: item.id,\n            inOverflowPanel: true,\n            key: item.id,\n            onClick: handleItemClick,\n          } as ToolbarFieldProps;\n\n          if (type === ToolbarField) {\n            return React.cloneElement(\n              item.value as ReactElement,\n              formFieldProps,\n            );\n          }\n          return (\n            <ToolbarField {...formFieldProps} key={item.id}>\n              {item.value}\n            </ToolbarField>\n          );\n        })}\n      </div>\n    </DropdownBase>\n  );\n});\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","overflowPanelCss","useId","useCollectionItems","useRef","useControlled","useKeyboardNavigationPanel","useCallback","jsx","OverflowMenuIcon","jsxs","DropdownBase","clsx","Button","OverflowSeparator","ToolbarField","React","createElement"],"mappings":"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"}
+{"version":3,"file":"OverflowPanel.js","sources":["../src/toolbar/overflow-panel/OverflowPanel.tsx"],"sourcesContent":["import {\n  Button,\n  makePrefixer,\n  useControlled,\n  useIdMemo as useId,\n} from \"@salt-ds/core\";\nimport { OverflowMenuIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport {\n  type ForwardedRef,\n  type MouseEvent,\n  type ReactElement,\n  cloneElement,\n  forwardRef,\n  useCallback,\n  useRef,\n} from \"react\";\nimport { ToolbarField, type ToolbarFieldProps } from \"../toolbar-field\";\nimport { OverflowSeparator } from \"./OverflowSeparator\";\n\nimport {\n  useCollectionItems,\n  useKeyboardNavigationPanel,\n} from \"../../common-hooks\";\n\nimport { DropdownBase, type DropdownBaseProps } from \"../../dropdown\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport overflowPanelCss from \"./OverflowPanel.css\";\n\nconst withBaseName = makePrefixer(\"saltOverflowPanel\");\n\nexport interface DropdownPanelProps extends DropdownBaseProps {\n  /**\n   * Trigger button icon\n   */\n  triggerButtonIcon?: JSX.Element;\n  /**\n   * Trigger button text\n   */\n  triggerButtonLabel?: string;\n}\n\nexport const OverflowPanel = forwardRef(function DropdownPanel(\n  {\n    children,\n    className,\n    defaultIsOpen,\n    isOpen: isOpenProp,\n    onOpenChange,\n    triggerButtonIcon,\n    triggerButtonLabel,\n    ...props\n  }: DropdownPanelProps,\n  forwardedRef?: ForwardedRef<HTMLDivElement>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-overflow-panel\",\n    css: overflowPanelCss,\n    window: targetWindow,\n  });\n\n  const id = useId();\n  const collectionHook = useCollectionItems<ReactElement>({\n    id,\n    children,\n  });\n\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const [isOpen, setIsOpen] = useControlled<boolean>({\n    controlled: isOpenProp,\n    default: defaultIsOpen || false,\n    name: \"DropdownPanel\",\n  });\n\n  const { highlightedIndex: highlightedIdx, ...keyboardHook } =\n    useKeyboardNavigationPanel({\n      cycleFocus: true,\n      defaultHighlightedIndex: 0,\n      focusOnHighlight: true,\n      indexPositions: collectionHook.data,\n    });\n\n  const focusTrigger = useCallback(() => {\n    if (triggerRef.current) {\n      triggerRef.current.focus();\n    }\n  }, []);\n\n  const setPanelRef = useCallback((el: HTMLElement | null) => el?.focus(), []);\n\n  const handleItemClick = (evt: MouseEvent) => {\n    // if (sourceItem.props[\"data-close-on-click\"] !== false) closeMenu();\n    setIsOpen(false);\n    focusTrigger();\n  };\n\n  const handleOpenChange = (open: boolean) => {\n    setIsOpen(open);\n    onOpenChange?.(open);\n  };\n\n  const getTriggerButtonIcon = () =>\n    triggerButtonIcon ?? triggerButtonLabel === undefined ? (\n      <OverflowMenuIcon />\n    ) : undefined;\n\n  return (\n    <DropdownBase\n      {...props}\n      className={clsx(withBaseName(), className)}\n      isOpen={isOpen}\n      onOpenChange={handleOpenChange}\n      placement=\"bottom-end\"\n      ref={forwardedRef}\n    >\n      <Button variant=\"secondary\" ref={triggerRef}>\n        {getTriggerButtonIcon()}\n        {triggerButtonLabel}\n      </Button>\n      <div\n        className={withBaseName(\"content\")}\n        ref={setPanelRef}\n        tabIndex={-1}\n        {...keyboardHook.listProps}\n      >\n        {collectionHook.data.map((item) => {\n          const { type } = item.value as ReactElement;\n          if (type === OverflowSeparator) {\n            return item.value;\n          }\n          const formFieldProps = {\n            id: item.id,\n            inOverflowPanel: true,\n            key: item.id,\n            onClick: handleItemClick,\n          } as ToolbarFieldProps;\n\n          if (type === ToolbarField) {\n            return cloneElement(item.value as ReactElement, formFieldProps);\n          }\n          return (\n            <ToolbarField {...formFieldProps} key={item.id}>\n              {item.value}\n            </ToolbarField>\n          );\n        })}\n      </div>\n    </DropdownBase>\n  );\n});\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","overflowPanelCss","useId","useCollectionItems","useRef","useControlled","useKeyboardNavigationPanel","useCallback","jsx","OverflowMenuIcon","jsxs","DropdownBase","clsx","Button","OverflowSeparator","ToolbarField","cloneElement","createElement"],"mappings":"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"}

package/dist-cjs/toolbar/toolbar-field/ToolbarField.js

@@ -3,12 +3,12 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
+var react = require('react');
 var useToolbarField = require('./useToolbarField.js');
 var FormFieldLegacy = require('../../form-field-legacy/FormFieldLegacy.js');
 require('../../form-field-legacy/FormLabel.js');
 
-const ToolbarField = React.forwardRef(function ToolbarField2(props, forwardedRef) {
+const ToolbarField = react.forwardRef(function ToolbarField2(props, forwardedRef) {
   const toolbarFieldProps = useToolbarField.useToolbarField(props);
   return /* @__PURE__ */ jsxRuntime.jsx(FormFieldLegacy.FormFieldLegacy, {
     ...toolbarFieldProps,

package/dist-cjs/toolbar/toolbar-field/useToolbarField.js

@@ -3,13 +3,13 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var clsx = require('clsx');
-var React = require('react');
+var react = require('react');
 var ToolbarButton = require('../ToolbarButton.js');
 
 const NullActivationIndicator = () => null;
 const primaryControls = ["Dropdown", "Input"];
 const getChildElementName = (element) => {
-  if (React.isValidElement(element)) {
+  if (react.isValidElement(element)) {
     const { type } = element;
     if (typeof type === "string") {
       return type;
@@ -26,12 +26,12 @@ const getChildElementName = (element) => {
     "useToolbarField, child of ToolbarField is not valid ReactElememnt"
   );
 };
-const isToolbarButton = (element) => React.isValidElement(element) && element.type === ToolbarButton.ToolbarButton;
+const isToolbarButton = (element) => react.isValidElement(element) && element.type === ToolbarButton.ToolbarButton;
 const getToolbarFormFieldProps = (child, isOverflowPanel = false) => {
   let activationIndicator = NullActivationIndicator;
   let variant = "tertiary";
   const element = child;
-  if (React.isValidElement(element)) {
+  if (react.isValidElement(element)) {
     const name = getChildElementName(element);
     if (primaryControls.includes(name)) {
       activationIndicator = void 0;
@@ -60,7 +60,7 @@ const useToolbarField = (props) => {
   const childElementName = getChildElementName(props.children);
   const { className, ActivationIndicatorComponent, ...calculatedProps } = getToolbarFormFieldProps(props.children, inOverflowPanel);
   const labelPlacement = labelPlacementProp != null ? labelPlacementProp : inOverflowPanel ? "top" : "left";
-  const handleClick = React.useCallback(
+  const handleClick = react.useCallback(
     (e) => {
       if (onClick && !InteractiveComponents.includes(childElementName)) {
         onClick(e);

package/dist-cjs/tree/Tree.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
+var react = require('react');
 var core = require('@salt-ds/core');
 var clsx = require('clsx');
 var useAutoSizer = require('../common-hooks/useAutoSizer.js');
@@ -22,7 +22,7 @@ var window = require('@salt-ds/window');
 var Tree$1 = require('./Tree.css.js');
 
 const withBaseName = core.makePrefixer("saltTree");
-const Tree = React.forwardRef(function Tree2({
+const Tree = react.forwardRef(function Tree2({
   className,
   defaultSelected,
   disabled,
@@ -48,8 +48,8 @@ const Tree = React.forwardRef(function Tree2({
     window: targetWindow
   });
   const id = core.useIdMemo(idProp);
-  const rootRef = React.useRef(null);
-  const contentRef = React.useRef(null);
+  const rootRef = react.useRef(null);
+  const contentRef = react.useRef(null);
   const collectionHook = useCollectionItems.useCollectionItems({
     id,
     source,
@@ -69,10 +69,10 @@ const Tree = React.forwardRef(function Tree2({
     height: preferredHeight,
     width
   });
-  const handleSelect = React.useCallback(
+  const handleSelect = react.useCallback(
     (evt, selectedItem) => {
       if (onSelect) {
-        if (React.isValidElement(selectedItem.value)) {
+        if (react.isValidElement(selectedItem.value)) {
           onSelect(evt, selectedItem.label);
         } else if (selectedItem.value !== null) {
           onSelect(evt, selectedItem.value);
@@ -81,7 +81,7 @@ const Tree = React.forwardRef(function Tree2({
     },
     [onSelect]
   );
-  const handleSelectionChange = React.useCallback(
+  const handleSelectionChange = react.useCallback(
     (evt, selected2) => {
       if (onSelectionChange) {
         onSelectionChange(
@@ -158,7 +158,7 @@ const Tree = React.forwardRef(function Tree2({
     const item = items[i];
     idx.value += 1;
     list.push(
-      /* @__PURE__ */ React.createElement(TreeNode.TreeNode, {
+      /* @__PURE__ */ react.createElement(TreeNode.TreeNode, {
         ...defaultItemHandlers,
         ...listItemHandlers,
         "aria-disabled": disabled || item.disabled,

package/dist-cjs/tree/use-tree-keyboard-navigation.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var React = require('react');
+var react = require('react');
 var keyUtils = require('../common-hooks/keyUtils.js');
 
 const getNodeParentPath = ({ id }) => {
@@ -26,7 +26,7 @@ const useKeyboardNavigation = ({
   highlightedIdx,
   highlightItemAtIndex
 }) => {
-  const handleKeyDown = React.useCallback(
+  const handleKeyDown = react.useCallback(
     (e) => {
       if (e.key === keyUtils.ArrowLeft) {
         const node = collectionHook.data[highlightedIdx];

package/dist-cjs/tree/useTree.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var React = require('react');
+var react = require('react');
 require('@salt-ds/core');
 require('../common-hooks/collectionProvider.js');
 require('../common-hooks/keyUtils.js');
@@ -26,7 +26,7 @@ const useTree = ({
   selected: selectedProp,
   selectionStrategy
 }) => {
-  const lastSelection = React.useRef(selectedProp || defaultSelected);
+  const lastSelection = react.useRef(selectedProp || defaultSelected);
   const handleKeyboardNavigation = (evt, nextIdx) => {
     var _a, _b;
     (_b = (_a = selectionHook.listHandlers).onKeyboardNavigation) == null ? void 0 : _b.call(_a, evt, nextIdx);
@@ -58,7 +58,7 @@ const useTree = ({
     highlightedIdx,
     highlightItemAtIndex: keyboardHook.setHighlightedIndex
   });
-  const handleClick = React.useCallback(
+  const handleClick = react.useCallback(
     (evt) => {
       var _a, _b, _c;
       (_a = collapsibleHook == null ? void 0 : collapsibleHook.onClick) == null ? void 0 : _a.call(collapsibleHook, evt);
@@ -68,7 +68,7 @@ const useTree = ({
     },
     [collapsibleHook, selectionHook]
   );
-  const handleKeyDown = React.useCallback(
+  const handleKeyDown = react.useCallback(
     (evt) => {
       var _a, _b, _c, _d, _e, _f, _g;
       (_b = (_a = keyboardHook.listProps).onKeyDown) == null ? void 0 : _b.call(_a, evt);
@@ -95,7 +95,7 @@ const useTree = ({
     highlightedIdx,
     indexPositions: collectionHook.data
   });
-  const handleMouseMove = React.useCallback(
+  const handleMouseMove = react.useCallback(
     (evt) => {
       if (!isScrolling.current && !disabled) {
         keyboardHook.listProps.onMouseMove();

package/dist-cjs/utils/useClickOutside.js

@@ -2,12 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var React = require('react');
+var react = require('react');
 
 const defaultTriggerEvents = ["mousedown"];
 function useClickOutside(handler, triggerEvents, containers) {
-  const ref = React.useRef(null);
-  React.useEffect(() => {
+  const ref = react.useRef(null);
+  react.useEffect(() => {
     const handleEvent = (event) => {
       var _a;
       if (Array.isArray(containers)) {

package/dist-cjs/utils/useEventCallback.js

@@ -3,14 +3,14 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var core = require('@salt-ds/core');
-var React = require('react');
+var react = require('react');
 
 function useEventCallback(fn) {
-  const ref = React.useRef(fn);
+  const ref = react.useRef(fn);
   core.useIsomorphicLayoutEffect(() => {
     ref.current = fn;
   });
-  return React.useCallback(
+  return react.useCallback(
     (...args) => (0, ref.current)(...args),
     []
   );