@salt-ds/lab 1.0.0-alpha.2 → 1.0.0-alpha.21

package/dist-cjs/tokenized-input/TokenizedInputBase.js

@@ -0,0 +1,296 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var clsx = require('clsx');
+var deepmerge = require('deepmerge');
+var React = require('react');
+var core = require('@salt-ds/core');
+var icons = require('@salt-ds/icons');
+var calcFirstHiddenIndex = require('./internal/calcFirstHiddenIndex.js');
+var defaultItemToString = require('./internal/defaultItemToString.js');
+var InputPill = require('./internal/InputPill.js');
+var InputRuler = require('./internal/InputRuler.js');
+var useResizeObserver = require('./internal/useResizeObserver.js');
+var useWidth = require('./internal/useWidth.js');
+var InputLegacy = require('../input-legacy/InputLegacy.js');
+require('../input-legacy/StaticInputAdornment.js');
+var window = require('@salt-ds/window');
+var styles = require('@salt-ds/styles');
+var TokenizedInput = require('./TokenizedInput.css.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var deepmerge__default = /*#__PURE__*/_interopDefaultLegacy(deepmerge);
+
+const INITIAL_INPUT_WIDTH = 5;
+const withBaseName = core.makePrefixer("saltTokenizedInput");
+const getItemsAriaLabel = (itemCount) => itemCount === 0 ? "no item selected" : `${itemCount} ${itemCount > 1 ? "items" : "item"}`;
+const hasHelpers = (helpers) => {
+  if (process.env.NODE_ENV !== "production") {
+    if (helpers == null) {
+      console.warn(
+        'TokenizedInputBase is used without helpers. You should pass in "helpers" from "useTokenizedInput".'
+      );
+    }
+  }
+  return helpers != null;
+};
+const TokenizedInputBase = React.forwardRef(function TokenizedInputBase2(props, ref) {
+  const {
+    InputProps: InputProps2 = {},
+    ExpandButtonProps = {},
+    className,
+    activeIndices = [],
+    selectedItems = [],
+    highlightedIndex,
+    value,
+    focused,
+    expanded,
+    disabled,
+    helpers,
+    onFocus,
+    onBlur,
+    onKeyUp,
+    onKeyDown,
+    onRemoveItem,
+    onInputChange,
+    onInputFocus,
+    onInputBlur,
+    onInputSelect,
+    onClear,
+    onClick,
+    inputRef,
+    itemToString = defaultItemToString.defaultItemToString,
+    id: idProp,
+    expandButtonRef: expandButtonRefProp,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    ...restProps
+  } = props;
+  const targetWindow = window.useWindow();
+  styles.useComponentCssInjection({
+    testId: "salt-tokenized-input",
+    css: TokenizedInput,
+    window: targetWindow
+  });
+  const density = core.useDensity();
+  const id = core.useId(idProp);
+  const inputId = `${id}-input`;
+  const expandButtonId = `${id}-expand-button`;
+  const clearButtonId = `${id}-clear-button`;
+  const pillGroupPadding = 16;
+  const pillsRef = React.useRef({});
+  const inputRulerRef = React.useRef(null);
+  const keydownExpandButton = React.useRef(false);
+  const [expandButtonRef, expandButtonWidth] = useWidth.useWidth(density);
+  const [clearButtonRef, clearButtonWidth] = useWidth.useWidth(density);
+  const [inputWidth, setInputWidth] = React.useState(INITIAL_INPUT_WIDTH);
+  const [pillGroupWidth, setPillGroupWidth] = React.useState(null);
+  const [firstHiddenIndex, setFirstHiddenIndex] = React.useState(null);
+  const showExpandButton = !expanded && firstHiddenIndex != null;
+  const widthOffset = pillGroupPadding + INITIAL_INPUT_WIDTH + (expanded ? clearButtonWidth : expandButtonWidth);
+  const containerRef = useResizeObserver.useResizeObserver(
+    React.useCallback(
+      ([{ contentRect }]) => {
+        setPillGroupWidth(contentRect.width - widthOffset);
+      },
+      [widthOffset]
+    )
+  );
+  core.useIsomorphicLayoutEffect(
+    () => () => {
+      setFirstHiddenIndex(null);
+    },
+    [density]
+  );
+  core.useIsomorphicLayoutEffect(
+    () => {
+      if (expanded) {
+        setFirstHiddenIndex(null);
+      } else if (pillGroupWidth != null) {
+        setFirstHiddenIndex(
+          calcFirstHiddenIndex.calcFirstHiddenIndex({
+            containerWidth: pillGroupWidth,
+            pillWidths: Object.values(pillsRef.current).filter(
+              Boolean
+            )
+          })
+        );
+      }
+    },
+    [expanded, pillGroupWidth, selectedItems]
+  );
+  core.useIsomorphicLayoutEffect(() => {
+    if (expanded && inputRulerRef.current) {
+      const newInputWidth = inputRulerRef.current.scrollWidth;
+      setInputWidth(Math.min(newInputWidth, pillGroupWidth || 0));
+    }
+  }, [expanded, pillGroupWidth, value]);
+  const handleExpandButtonKeyDown = (event) => {
+    const singleChar = event.key.length === 1;
+    const triggerExpand = [
+      "CONTROL",
+      "META",
+      "ENTER",
+      "BACKSPACE",
+      "ARROWDOWN",
+      "ARROWLEFT",
+      "ARROWRIGHT"
+    ].indexOf(event.key.toUpperCase()) !== -1;
+    if ((singleChar || triggerExpand) && hasHelpers(helpers)) {
+      if (event.key === "Enter" || event.key === " ") {
+        event.preventDefault();
+        event.stopPropagation();
+      }
+      helpers.updateExpanded(true);
+      keydownExpandButton.current = true;
+    }
+  };
+  const handleInputKeyUp = (event) => {
+    if (keydownExpandButton.current && "Enter" !== event.key) {
+      keydownExpandButton.current = false;
+      if (onKeyDown) {
+        onKeyDown(event);
+      }
+    }
+    if (onKeyUp) {
+      onKeyUp(event);
+    }
+  };
+  const handleExpand = (event) => {
+    event.stopPropagation();
+    if (hasHelpers(helpers)) {
+      helpers.updateExpanded(true);
+    }
+  };
+  const handleClearButtonFocus = (event) => {
+    event.stopPropagation();
+    if (hasHelpers(helpers)) {
+      helpers.setFocused(false);
+      helpers.cancelBlur();
+    }
+  };
+  const selectedItemIds = selectedItems.map(
+    (_, index) => `${id}-pill-${index}`
+  );
+  const inputAriaLabelledBy = disabled ? [ariaLabelledBy, inputId, ...selectedItemIds] : [ariaLabelledBy, inputId];
+  const mergedInputProps = deepmerge__default["default"](
+    {
+      inputProps: {
+        style: {
+          width: inputWidth,
+          minWidth: inputWidth
+        },
+        "aria-label": [ariaLabel, getItemsAriaLabel(selectedItems.length)].filter(Boolean).join(" "),
+        "aria-labelledby": inputAriaLabelledBy.filter(Boolean).join(" "),
+        "aria-activedescendant": highlightedIndex && highlightedIndex >= 0 ? `${id}-pill-${highlightedIndex}` : void 0
+      }
+    },
+    InputProps2
+  );
+  const {
+    accessibleText: expandButtonAccessibleText,
+    ...restExpandButtonProps
+  } = ExpandButtonProps;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
+    ...restProps,
+    className: clsx.clsx(
+      withBaseName(),
+      {
+        [withBaseName("focused")]: focused,
+        [withBaseName("expanded")]: expanded,
+        [withBaseName("disabled")]: disabled
+      },
+      className
+    ),
+    id,
+    onClick,
+    ref: core.useForkRef(ref, containerRef),
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", {
+        "aria-owns": selectedItemIds.join(" "),
+        className: withBaseName("hidden"),
+        role: "listbox"
+      }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", {
+        className: withBaseName("pillGroup"),
+        children: [
+          selectedItems.map((item, index) => {
+            const label = itemToString(item);
+            return /* @__PURE__ */ jsxRuntime.jsx(InputPill.InputPill, {
+              active: activeIndices.indexOf(index) !== -1,
+              disabled,
+              hidden: showExpandButton && index >= firstHiddenIndex,
+              highlighted: index === highlightedIndex,
+              id: `${id}-pill-${index}`,
+              index,
+              label,
+              lastVisible: !showExpandButton && index === selectedItems.length - 1,
+              onDelete: expanded ? onRemoveItem : void 0,
+              pillsRef
+            }, `${index}-${label}`);
+          }),
+          /* @__PURE__ */ jsxRuntime.jsx(core.Button, {
+            "aria-labelledby": [ariaLabelledBy, inputId, expandButtonId].filter(Boolean).join(" "),
+            className: clsx.clsx(withBaseName("expandButton"), {
+              [withBaseName("hidden")]: !showExpandButton
+            }),
+            disabled,
+            id: expandButtonId,
+            onBlur,
+            onClick: handleExpand,
+            onFocus,
+            onKeyDown: handleExpandButtonKeyDown,
+            ref: core.useForkRef(expandButtonRef, expandButtonRefProp),
+            variant: "secondary",
+            ...restExpandButtonProps,
+            children: /* @__PURE__ */ jsxRuntime.jsx(icons.OverflowMenuIcon, {
+              "aria-label": expandButtonAccessibleText === void 0 ? "expand edit" : expandButtonAccessibleText
+            })
+          }),
+          /* @__PURE__ */ jsxRuntime.jsx(InputLegacy.InputLegacy, {
+            ...mergedInputProps,
+            className: clsx.clsx(withBaseName("input"), withBaseName("inputField"), {
+              [withBaseName("hidden")]: showExpandButton
+            }),
+            disabled,
+            id: inputId,
+            onBlur: onInputBlur,
+            onChange: onInputChange,
+            onFocus: onInputFocus,
+            onKeyDown,
+            onKeyUp: handleInputKeyUp,
+            onSelect: onInputSelect,
+            renderSuffix: () => /* @__PURE__ */ jsxRuntime.jsx(InputRuler.InputRuler, {
+              ref: inputRulerRef,
+              value
+            }),
+            value,
+            ref: inputRef
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxRuntime.jsx(core.Button, {
+        className: clsx.clsx(withBaseName("clearButton"), {
+          [withBaseName("hidden")]: !expanded || selectedItems.length === 0
+        }),
+        disabled,
+        id: clearButtonId,
+        onBlur,
+        onClick: onClear,
+        onFocus: handleClearButtonFocus,
+        ref: clearButtonRef,
+        variant: "secondary",
+        "data-testid": "clear-button",
+        children: /* @__PURE__ */ jsxRuntime.jsx(icons.CloseIcon, {
+          "aria-label": "clear input"
+        })
+      })
+    ]
+  });
+});
+
+exports.TokenizedInputBase = TokenizedInputBase;
+//# sourceMappingURL=TokenizedInputBase.js.map

package/dist-cjs/tokenized-input/TokenizedInputBase.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TokenizedInputBase.js","sources":["../src/tokenized-input/TokenizedInputBase.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport deepmerge from \"deepmerge\";\nimport {\n  ChangeEventHandler,\n  FocusEvent,\n  FocusEventHandler,\n  ForwardedRef,\n  forwardRef,\n  HTMLAttributes,\n  KeyboardEvent,\n  KeyboardEventHandler,\n  ReactElement,\n  ReactEventHandler,\n  Ref,\n  SyntheticEvent,\n  useCallback,\n  useRef,\n  useState,\n} from \"react\";\nimport {\n  Button,\n  ButtonProps,\n  makePrefixer,\n  useDensity,\n  useForkRef,\n  useId,\n  useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { CloseIcon, OverflowMenuIcon } from \"@salt-ds/icons\";\nimport { calcFirstHiddenIndex } from \"./internal/calcFirstHiddenIndex\";\nimport { defaultItemToString } from \"./internal/defaultItemToString\";\nimport { InputPill } from \"./internal/InputPill\";\nimport { InputRuler } from \"./internal/InputRuler\";\nimport { useResizeObserver } from \"./internal/useResizeObserver\";\nimport { useWidth } from \"./internal/useWidth\";\nimport {\n  TokenizedInputHelpers,\n  TokenizedInputState,\n} from \"./useTokenizedInput\";\nimport {\n  InputLegacy as Input,\n  InputLegacyProps as InputProps,\n} from \"../input-legacy\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport tokenizedInputCss from \"./TokenizedInput.css\";\n\nexport type RemoveItemHandler = (itemIndex: number) => void;\nexport type ItemToString<Item> = (item: Item) => string;\nexport type ExpandButtonProps = Pick<\n  ButtonProps,\n  \"role\" | \"aria-roledescription\" | \"aria-describedby\"\n> & { accessibleText?: string };\n\nexport interface TokenizedInputBaseProps<Item>\n  extends Partial<TokenizedInputState<Item>>,\n    Omit<\n      HTMLAttributes<HTMLDivElement>,\n      \"onFocus\" | \"onBlur\" | \"onChange\" | \"onKeyUp\" | \"onKeyDown\"\n    > {\n  ExpandButtonProps?: ExpandButtonProps;\n  InputProps?: Pick<InputProps, \"aria-describedby\" | \"inputProps\">;\n  disabled?: boolean;\n  expandButtonRef?: Ref<HTMLButtonElement>;\n  helpers: TokenizedInputHelpers<Item>;\n  inputRef?: Ref<HTMLInputElement>;\n  itemToString?: ItemToString<Item>;\n  onFocus?: FocusEventHandler<HTMLInputElement | HTMLButtonElement>;\n  onBlur?: FocusEventHandler<HTMLInputElement | HTMLButtonElement>;\n  onKeyUp?: KeyboardEventHandler<HTMLInputElement>;\n  // Can key down on either input or expand button\n  onKeyDown?: KeyboardEventHandler<HTMLInputElement | HTMLButtonElement>;\n  onRemoveItem?: RemoveItemHandler;\n  onInputBlur?: FocusEventHandler<HTMLInputElement>;\n  onInputFocus?: FocusEventHandler<HTMLInputElement>;\n  onInputChange?: ChangeEventHandler<HTMLInputElement>;\n  onInputSelect?: ReactEventHandler<HTMLInputElement>;\n  onClick?: (event: SyntheticEvent<HTMLElement>) => void;\n  onClear?: ReactEventHandler;\n}\n\nconst INITIAL_INPUT_WIDTH = 5;\nconst withBaseName = makePrefixer(\"saltTokenizedInput\");\n\nconst getItemsAriaLabel = (itemCount: number) =>\n  itemCount === 0\n    ? \"no item selected\"\n    : `${itemCount} ${itemCount > 1 ? \"items\" : \"item\"}`;\n\nconst hasHelpers = (helpers: any) => {\n  if (process.env.NODE_ENV !== \"production\") {\n    if (helpers == null) {\n      console.warn(\n        'TokenizedInputBase is used without helpers. You should pass in \"helpers\" from \"useTokenizedInput\".'\n      );\n    }\n  }\n  return helpers != null;\n};\n\nexport const TokenizedInputBase = forwardRef(function TokenizedInputBase<Item>(\n  props: TokenizedInputBaseProps<Item>,\n  ref: ForwardedRef<HTMLDivElement>\n) {\n  const {\n    InputProps = {},\n    ExpandButtonProps = {},\n    className,\n    activeIndices = [],\n    selectedItems = [],\n    highlightedIndex,\n    value,\n    focused,\n    expanded,\n    disabled,\n    helpers,\n    onFocus,\n    onBlur,\n    onKeyUp,\n    onKeyDown,\n    onRemoveItem,\n    onInputChange,\n    onInputFocus,\n    onInputBlur,\n    onInputSelect,\n    onClear,\n    onClick,\n    inputRef,\n    itemToString = defaultItemToString,\n    id: idProp,\n    expandButtonRef: expandButtonRefProp,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    ...restProps\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-tokenized-input\",\n    css: tokenizedInputCss,\n    window: targetWindow,\n  });\n\n  const density = useDensity();\n\n  const id = useId(idProp);\n  const inputId = `${id}-input`;\n  const expandButtonId = `${id}-expand-button`;\n  const clearButtonId = `${id}-clear-button`;\n\n  // TODO: Use proper machanism to get variable values from theme in React. Something like below\n  // getComputedStyle(document.documentElement)\n  // .getPropertyValue('--my-variable-name'); // #999999\n  const pillGroupPadding = 16;\n  const lastVisiblePillMargin = 4;\n\n  const pillsRef = useRef<{ [index: number]: number | undefined }>({});\n  const inputRulerRef = useRef<HTMLSpanElement | null>(null);\n  const keydownExpandButton = useRef(false);\n\n  const [expandButtonRef, expandButtonWidth] = useWidth(density);\n  const [clearButtonRef, clearButtonWidth] = useWidth(density);\n  const [inputWidth, setInputWidth] = useState(INITIAL_INPUT_WIDTH);\n  const [pillGroupWidth, setPillGroupWidth] = useState<number | null>(null);\n  const [firstHiddenIndex, setFirstHiddenIndex] = useState<number | null>(null);\n\n  const showExpandButton = !expanded && firstHiddenIndex != null;\n\n  const widthOffset =\n    pillGroupPadding +\n    INITIAL_INPUT_WIDTH +\n    (expanded ? clearButtonWidth : expandButtonWidth);\n\n  const containerRef = useResizeObserver<HTMLDivElement>(\n    useCallback(\n      ([{ contentRect }]) => {\n        setPillGroupWidth(contentRect.width - widthOffset);\n      },\n      [widthOffset]\n    )\n  );\n\n  useIsomorphicLayoutEffect(\n    () => () => {\n      // When density changes, set hidden index to null so that pills are in their\n      // readonly state before they are measured.\n      setFirstHiddenIndex(null);\n    },\n    [density]\n  );\n\n  // useLayoutEffect because of potential layout change\n  // We want to do that before paint to avoid layout jumps\n  useIsomorphicLayoutEffect(\n    () => {\n      if (expanded) {\n        setFirstHiddenIndex(null);\n      } else if (pillGroupWidth != null) {\n        setFirstHiddenIndex(\n          calcFirstHiddenIndex({\n            containerWidth: pillGroupWidth,\n            pillWidths: Object.values(pillsRef.current).filter(\n              Boolean\n            ) as number[],\n          })\n        );\n      }\n    },\n    // Additional dependency on selectedItems is for the controlled version\n    [expanded, pillGroupWidth, selectedItems]\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    if (expanded && inputRulerRef.current) {\n      const newInputWidth = inputRulerRef.current.scrollWidth;\n      setInputWidth(Math.min(newInputWidth, pillGroupWidth || 0));\n    }\n  }, [expanded, pillGroupWidth, value]);\n\n  const handleExpandButtonKeyDown = (\n    event: KeyboardEvent<HTMLButtonElement>\n  ) => {\n    const singleChar = event.key.length === 1;\n    const triggerExpand =\n      [\n        \"CONTROL\",\n        \"META\",\n        \"ENTER\",\n        \"BACKSPACE\",\n        \"ARROWDOWN\",\n        \"ARROWLEFT\",\n        \"ARROWRIGHT\",\n      ].indexOf(event.key.toUpperCase()) !== -1;\n\n    if ((singleChar || triggerExpand) && hasHelpers(helpers)) {\n      if (event.key === \"Enter\" || event.key === \" \") {\n        event.preventDefault();\n        event.stopPropagation();\n      }\n      helpers.updateExpanded(true);\n      keydownExpandButton.current = true;\n    }\n  };\n\n  const handleInputKeyUp = (event: KeyboardEvent<HTMLInputElement>) => {\n    // Call keydown again if the initail event has been used to expand the input\n    if (keydownExpandButton.current && \"Enter\" !== event.key) {\n      keydownExpandButton.current = false;\n\n      if (onKeyDown) {\n        onKeyDown(event);\n      }\n    }\n\n    if (onKeyUp) {\n      onKeyUp(event);\n    }\n  };\n\n  const handleExpand = (event: SyntheticEvent<HTMLButtonElement>) => {\n    event.stopPropagation();\n\n    if (hasHelpers(helpers)) {\n      helpers.updateExpanded(true);\n    }\n  };\n\n  const handleClearButtonFocus = (event: FocusEvent<HTMLButtonElement>) => {\n    event.stopPropagation();\n\n    if (hasHelpers(helpers)) {\n      helpers.setFocused(false);\n      helpers.cancelBlur();\n    }\n  };\n\n  const selectedItemIds = selectedItems.map(\n    (_, index) => `${id}-pill-${index}`\n  );\n\n  const inputAriaLabelledBy = disabled\n    ? [ariaLabelledBy, inputId, ...selectedItemIds]\n    : [ariaLabelledBy, inputId];\n\n  const mergedInputProps = deepmerge(\n    {\n      inputProps: {\n        style: {\n          width: inputWidth,\n          minWidth: inputWidth,\n        },\n        \"aria-label\": [ariaLabel, getItemsAriaLabel(selectedItems.length)]\n          .filter(Boolean)\n          .join(\" \"),\n        \"aria-labelledby\": inputAriaLabelledBy.filter(Boolean).join(\" \"),\n        \"aria-activedescendant\":\n          highlightedIndex && highlightedIndex >= 0\n            ? `${id}-pill-${highlightedIndex}`\n            : undefined,\n      },\n    },\n    InputProps\n  );\n\n  const {\n    accessibleText: expandButtonAccessibleText,\n    ...restExpandButtonProps\n  } = ExpandButtonProps;\n\n  return (\n    <div\n      {...restProps}\n      className={clsx(\n        withBaseName(),\n        {\n          [withBaseName(\"focused\")]: focused,\n          [withBaseName(\"expanded\")]: expanded,\n          [withBaseName(\"disabled\")]: disabled,\n        },\n        className\n      )}\n      id={id}\n      onClick={onClick}\n      ref={useForkRef(ref, containerRef)}\n    >\n      <span\n        aria-owns={selectedItemIds.join(\" \")}\n        className={withBaseName(\"hidden\")}\n        role=\"listbox\"\n      />\n      <div className={withBaseName(\"pillGroup\")}>\n        {selectedItems.map((item, index) => {\n          const label = itemToString(item);\n\n          return (\n            <InputPill\n              active={activeIndices.indexOf(index) !== -1}\n              disabled={disabled}\n              hidden={showExpandButton && index >= firstHiddenIndex}\n              highlighted={index === highlightedIndex}\n              id={`${id}-pill-${index}`}\n              index={index}\n              key={`${index}-${label}`}\n              label={label}\n              lastVisible={\n                !showExpandButton && index === selectedItems.length - 1\n              }\n              onDelete={expanded ? onRemoveItem : undefined}\n              pillsRef={pillsRef}\n            />\n          );\n        })}\n        <Button\n          aria-labelledby={[ariaLabelledBy, inputId, expandButtonId]\n            .filter(Boolean)\n            .join(\" \")}\n          className={clsx(withBaseName(\"expandButton\"), {\n            [withBaseName(\"hidden\")]: !showExpandButton,\n          })}\n          disabled={disabled}\n          id={expandButtonId}\n          onBlur={onBlur}\n          onClick={handleExpand}\n          onFocus={onFocus}\n          onKeyDown={handleExpandButtonKeyDown}\n          ref={useForkRef(expandButtonRef, expandButtonRefProp)}\n          variant=\"secondary\"\n          {...restExpandButtonProps}\n        >\n          <OverflowMenuIcon\n            aria-label={\n              expandButtonAccessibleText === undefined\n                ? \"expand edit\"\n                : expandButtonAccessibleText\n            }\n          />\n        </Button>\n        <Input\n          {...mergedInputProps}\n          className={clsx(withBaseName(\"input\"), withBaseName(\"inputField\"), {\n            [withBaseName(\"hidden\")]: showExpandButton,\n          })}\n          disabled={disabled}\n          id={inputId}\n          // TODO: Use multi line input when available\n          // multiline\n          onBlur={onInputBlur}\n          onChange={onInputChange}\n          onFocus={onInputFocus}\n          onKeyDown={onKeyDown}\n          onKeyUp={handleInputKeyUp}\n          onSelect={onInputSelect}\n          renderSuffix={() => <InputRuler ref={inputRulerRef} value={value} />}\n          value={value}\n          ref={inputRef}\n        />\n      </div>\n      <Button\n        className={clsx(withBaseName(\"clearButton\"), {\n          [withBaseName(\"hidden\")]: !expanded || selectedItems.length === 0,\n        })}\n        disabled={disabled}\n        id={clearButtonId}\n        onBlur={onBlur}\n        onClick={onClear}\n        onFocus={handleClearButtonFocus}\n        ref={clearButtonRef}\n        variant=\"secondary\"\n        data-testid=\"clear-button\"\n      >\n        <CloseIcon aria-label=\"clear input\" />\n      </Button>\n    </div>\n  );\n}) as <Item>(\n  p: TokenizedInputBaseProps<Item> & { ref?: ForwardedRef<HTMLDivElement> }\n) => ReactElement<TokenizedInputBaseProps<Item>>;\n"],"names":["makePrefixer","forwardRef","TokenizedInputBase","InputProps","defaultItemToString","useWindow","useComponentCssInjection","tokenizedInputCss","useDensity","useId","useRef","useWidth","useState","useResizeObserver","useCallback","useIsomorphicLayoutEffect","calcFirstHiddenIndex","deepmerge","jsxs","clsx","useForkRef","jsx","InputPill","Button","OverflowMenuIcon","Input","InputRuler","CloseIcon"],"mappings":"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"}

package/dist-cjs/tokenized-input/internal/InputRuler.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltInputRuler {\n  position: absolute;\n  left: 0;\n  white-space: nowrap;\n  visibility: hidden;\n  overflow: hidden;\n  max-width: 100%;\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=InputRuler.css.js.map

package/dist-cjs/tokenized-input/internal/InputRuler.css.js.map

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

package/dist-cjs/tokenized-input/internal/InputRuler.js

@@ -0,0 +1,29 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var core = require('@salt-ds/core');
+var InputRuler$1 = require('./InputRuler.css.js');
+var window = require('@salt-ds/window');
+var styles = require('@salt-ds/styles');
+
+const withBaseName = core.makePrefixer("saltInputRuler");
+const InputRuler = React.forwardRef(function InputRuler2(props, ref) {
+  const { value } = props;
+  const targetWindow = window.useWindow();
+  styles.useComponentCssInjection({
+    testId: "salt-input-ruler",
+    css: InputRuler$1,
+    window: targetWindow
+  });
+  return /* @__PURE__ */ jsxRuntime.jsx("span", {
+    className: withBaseName(),
+    ref,
+    children: value
+  });
+});
+
+exports.InputRuler = InputRuler;
+//# sourceMappingURL=InputRuler.js.map

package/dist-cjs/tokenized-input/internal/InputRuler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputRuler.js","sources":["../src/tokenized-input/internal/InputRuler.tsx"],"sourcesContent":["import { ForwardedRef, forwardRef, InputHTMLAttributes } from \"react\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport inputRuler from \"./InputRuler.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltInputRuler\");\n\n/**\n * This hidden component is used to wrap a copy of an input value\n * so that we can use it to determine the input width dynamically\n */\nexport const InputRuler = forwardRef(function InputRuler(\n  props: { value: InputHTMLAttributes<HTMLInputElement>[\"value\"] },\n  ref: ForwardedRef<HTMLSpanElement>\n) {\n  const { value } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-input-ruler\",\n    css: inputRuler,\n    window: targetWindow,\n  });\n\n  return (\n    <span className={withBaseName()} ref={ref}>\n      {value}\n    </span>\n  );\n});\n"],"names":["makePrefixer","forwardRef","InputRuler","useWindow","useComponentCssInjection","inputRuler","jsx"],"mappings":";;;;;;;;;;;AAMA,MAAM,YAAA,GAAeA,kBAAa,gBAAgB,CAAA,CAAA;AAM3C,MAAM,UAAa,GAAAC,gBAAA,CAAW,SAASC,WAAAA,CAC5C,OACA,GACA,EAAA;AACA,EAAM,MAAA,EAAE,OAAU,GAAA,KAAA,CAAA;AAElB,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAAC,YAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,cAAA,CAAA,MAAA,EAAA;AAAA,IAAK,WAAW,YAAa,EAAA;AAAA,IAAG,GAAA;AAAA,IAC9B,QAAA,EAAA,KAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}