@salt-ds/core 1.31.0 → 1.33.0

package/dist-cjs/pagination/Paginator.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
+var icons = require('@salt-ds/icons');
 var clsx = require('clsx');
 var React = require('react');
 var Button = require('../button/Button.js');
@@ -29,7 +30,6 @@ require('../checkbox/Checkbox.js');
 require('../checkbox/CheckboxGroup.js');
 var styles = require('@salt-ds/styles');
 var window = require('@salt-ds/window');
-var icons = require('@salt-ds/icons');
 require('../combo-box/ComboBox.js');
 require('../dialog/Dialog.js');
 require('../dialog/DialogHeader.js');
@@ -48,6 +48,7 @@ require('../flex-item/FlexItem.js');
 require('../flex-layout/FlexLayout.js');
 require('../flow-layout/FlowLayout.js');
 require('../form-field/FormField.js');
+require('../form-field-context/FormFieldContext.js');
 require('../status-indicator/StatusIndicator.js');
 require('../text/Text.js');
 require('../text/Code.js');
@@ -56,7 +57,6 @@ require('../text/Headings.js');
 require('../text/Label.js');
 require('../text/TextAction.js');
 require('../text/TextNotation.js');
-require('../form-field-context/FormFieldContext.js');
 require('../grid-item/GridItem.js');
 require('../grid-layout/GridLayout.js');
 require('../input/Input.js');
@@ -67,12 +67,12 @@ require('../link/Link.js');
 require('../link-card/LinkCard.js');
 require('../list-box/ListBox.js');
 require('../list-control/ListControlContext.js');
-require('../menu/MenuContext.js');
 require('@floating-ui/react');
+require('../menu/MenuContext.js');
 require('../menu/MenuItem.js');
 require('../menu/MenuPanel.js');
-require('../menu/MenuTriggerContext.js');
 require('../menu/MenuPanelContext.js');
+require('../menu/MenuTriggerContext.js');
 require('../menu/MenuGroup.js');
 require('../multiline-input/MultilineInput.js');
 require('../navigation-item/NavigationItem.js');

package/dist-cjs/pagination/Paginator.js.map

@@ -1 +1 @@
-{"version":3,"file":"Paginator.js","sources":["../src/pagination/Paginator.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, MouseEventHandler } from \"react\";\nimport { Button } from \"../button\";\nimport { makePrefixer } from \"../utils\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"@salt-ds/icons\";\nimport { PageRanges } from \"./PageRanges\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport paginatorCss from \"./Paginator.css\";\n\nconst withBaseName = makePrefixer(\"saltPaginator\");\n\nexport interface PaginatorProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Number of pages next to the arrow buttons when page range is truncated.\n   */\n  boundaryCount?: number;\n  /**\n   * Number of pages on each side of the current page when page range is truncated.\n   */\n  siblingCount?: number;\n}\n\nexport const Paginator = forwardRef<HTMLDivElement, PaginatorProps>(\n  function Paginator(\n    { className, boundaryCount, siblingCount, ...restProps },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-paginator\",\n      css: paginatorCss,\n      window: targetWindow,\n    });\n\n    const { count, page, onPageChange } = usePaginationContext();\n\n    const onPreviousPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n      onPageChange(event, Math.max(1, page - 1));\n    };\n\n    const onNextPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n      onPageChange(event, Math.min(page + 1, count));\n    };\n\n    const isOnFirstPage = page === 1;\n    const isOnLastPage = page === count;\n\n    return (\n      <div className={clsx(withBaseName(), className)} {...restProps} ref={ref}>\n        <Button\n          variant=\"secondary\"\n          aria-label=\"Previous Page\"\n          onClick={onPreviousPage}\n          disabled={isOnFirstPage}\n          className={withBaseName(\"arrowButton-previous\")}\n        >\n          <ChevronLeftIcon aria-hidden />\n        </Button>\n        <PageRanges siblingCount={siblingCount} boundaryCount={boundaryCount} />\n        <Button\n          variant=\"secondary\"\n          aria-label=\"Next Page\"\n          onClick={onNextPage}\n          disabled={isOnLastPage}\n          className={withBaseName(\"arrowButton-next\")}\n        >\n          <ChevronRightIcon aria-hidden />\n        </Button>\n      </div>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","Paginator","useWindow","useComponentCssInjection","paginatorCss","usePaginationContext","jsxs","clsx","jsx","Button","ChevronLeftIcon","PageRanges","ChevronRightIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,MAAM,YAAA,GAAeA,0BAAa,eAAe,CAAA,CAAA;AAa1C,MAAM,SAAY,GAAAC,gBAAA;AAAA,EACvB,SAASC,WACP,EAAE,SAAA,EAAW,eAAe,YAAiB,EAAA,GAAA,SAAA,IAC7C,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,WAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAO,IAAM,EAAA,YAAA,KAAiBC,yCAAqB,EAAA,CAAA;AAE3D,IAAM,MAAA,cAAA,GAAuD,CAAC,KAAU,KAAA;AACtE,MAAA,YAAA,CAAa,OAAO,IAAK,CAAA,GAAA,CAAI,CAAG,EAAA,IAAA,GAAO,CAAC,CAAC,CAAA,CAAA;AAAA,KAC3C,CAAA;AAEA,IAAM,MAAA,UAAA,GAAmD,CAAC,KAAU,KAAA;AAClE,MAAA,YAAA,CAAa,OAAO,IAAK,CAAA,GAAA,CAAI,IAAO,GAAA,CAAA,EAAG,KAAK,CAAC,CAAA,CAAA;AAAA,KAC/C,CAAA;AAEA,IAAA,MAAM,gBAAgB,IAAS,KAAA,CAAA,CAAA;AAC/B,IAAA,MAAM,eAAe,IAAS,KAAA,KAAA,CAAA;AAE9B,IAAA,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MAAI,GAAG,SAAA;AAAA,MAAW,GAAA;AAAA,MAC9D,QAAA,EAAA;AAAA,wBAACC,cAAA,CAAAC,aAAA,EAAA;AAAA,UACC,OAAQ,EAAA,WAAA;AAAA,UACR,YAAW,EAAA,eAAA;AAAA,UACX,OAAS,EAAA,cAAA;AAAA,UACT,QAAU,EAAA,aAAA;AAAA,UACV,SAAA,EAAW,aAAa,sBAAsB,CAAA;AAAA,UAE9C,QAAC,kBAAAD,cAAA,CAAAE,qBAAA,EAAA;AAAA,YAAgB,aAAW,EAAA,IAAA;AAAA,WAAC,CAAA;AAAA,SAC/B,CAAA;AAAA,wBACCF,cAAA,CAAAG,qBAAA,EAAA;AAAA,UAAW,YAAA;AAAA,UAA4B,aAAA;AAAA,SAA8B,CAAA;AAAA,wBACrEH,cAAA,CAAAC,aAAA,EAAA;AAAA,UACC,OAAQ,EAAA,WAAA;AAAA,UACR,YAAW,EAAA,WAAA;AAAA,UACX,OAAS,EAAA,UAAA;AAAA,UACT,QAAU,EAAA,YAAA;AAAA,UACV,SAAA,EAAW,aAAa,kBAAkB,CAAA;AAAA,UAE1C,QAAC,kBAAAD,cAAA,CAAAI,sBAAA,EAAA;AAAA,YAAiB,aAAW,EAAA,IAAA;AAAA,WAAC,CAAA;AAAA,SAChC,CAAA;AAAA,OAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"Paginator.js","sources":["../src/pagination/Paginator.tsx"],"sourcesContent":["import { ChevronLeftIcon, ChevronRightIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport { type HTMLAttributes, type MouseEventHandler, forwardRef } from \"react\";\nimport { Button } from \"../button\";\nimport { makePrefixer } from \"../utils\";\nimport { PageRanges } from \"./PageRanges\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport paginatorCss from \"./Paginator.css\";\n\nconst withBaseName = makePrefixer(\"saltPaginator\");\n\nexport interface PaginatorProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Number of pages next to the arrow buttons when page range is truncated.\n   */\n  boundaryCount?: number;\n  /**\n   * Number of pages on each side of the current page when page range is truncated.\n   */\n  siblingCount?: number;\n}\n\nexport const Paginator = forwardRef<HTMLDivElement, PaginatorProps>(\n  function Paginator(\n    { className, boundaryCount, siblingCount, ...restProps },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-paginator\",\n      css: paginatorCss,\n      window: targetWindow,\n    });\n\n    const { count, page, onPageChange } = usePaginationContext();\n\n    const onPreviousPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n      onPageChange(event, Math.max(1, page - 1));\n    };\n\n    const onNextPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n      onPageChange(event, Math.min(page + 1, count));\n    };\n\n    const isOnFirstPage = page === 1;\n    const isOnLastPage = page === count;\n\n    return (\n      <div className={clsx(withBaseName(), className)} {...restProps} ref={ref}>\n        <Button\n          variant=\"secondary\"\n          aria-label=\"Previous Page\"\n          onClick={onPreviousPage}\n          disabled={isOnFirstPage}\n          className={withBaseName(\"arrowButton-previous\")}\n        >\n          <ChevronLeftIcon aria-hidden />\n        </Button>\n        <PageRanges siblingCount={siblingCount} boundaryCount={boundaryCount} />\n        <Button\n          variant=\"secondary\"\n          aria-label=\"Next Page\"\n          onClick={onNextPage}\n          disabled={isOnLastPage}\n          className={withBaseName(\"arrowButton-next\")}\n        >\n          <ChevronRightIcon aria-hidden />\n        </Button>\n      </div>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","Paginator","useWindow","useComponentCssInjection","paginatorCss","usePaginationContext","jsxs","clsx","jsx","Button","ChevronLeftIcon","PageRanges","ChevronRightIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,MAAM,YAAA,GAAeA,0BAAa,eAAe,CAAA,CAAA;AAa1C,MAAM,SAAY,GAAAC,gBAAA;AAAA,EACvB,SAASC,WACP,EAAE,SAAA,EAAW,eAAe,YAAiB,EAAA,GAAA,SAAA,IAC7C,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,WAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAO,IAAM,EAAA,YAAA,KAAiBC,yCAAqB,EAAA,CAAA;AAE3D,IAAM,MAAA,cAAA,GAAuD,CAAC,KAAU,KAAA;AACtE,MAAA,YAAA,CAAa,OAAO,IAAK,CAAA,GAAA,CAAI,CAAG,EAAA,IAAA,GAAO,CAAC,CAAC,CAAA,CAAA;AAAA,KAC3C,CAAA;AAEA,IAAM,MAAA,UAAA,GAAmD,CAAC,KAAU,KAAA;AAClE,MAAA,YAAA,CAAa,OAAO,IAAK,CAAA,GAAA,CAAI,IAAO,GAAA,CAAA,EAAG,KAAK,CAAC,CAAA,CAAA;AAAA,KAC/C,CAAA;AAEA,IAAA,MAAM,gBAAgB,IAAS,KAAA,CAAA,CAAA;AAC/B,IAAA,MAAM,eAAe,IAAS,KAAA,KAAA,CAAA;AAE9B,IAAA,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MAAI,GAAG,SAAA;AAAA,MAAW,GAAA;AAAA,MAC9D,QAAA,EAAA;AAAA,wBAACC,cAAA,CAAAC,aAAA,EAAA;AAAA,UACC,OAAQ,EAAA,WAAA;AAAA,UACR,YAAW,EAAA,eAAA;AAAA,UACX,OAAS,EAAA,cAAA;AAAA,UACT,QAAU,EAAA,aAAA;AAAA,UACV,SAAA,EAAW,aAAa,sBAAsB,CAAA;AAAA,UAE9C,QAAC,kBAAAD,cAAA,CAAAE,qBAAA,EAAA;AAAA,YAAgB,aAAW,EAAA,IAAA;AAAA,WAAC,CAAA;AAAA,SAC/B,CAAA;AAAA,wBACCF,cAAA,CAAAG,qBAAA,EAAA;AAAA,UAAW,YAAA;AAAA,UAA4B,aAAA;AAAA,SAA8B,CAAA;AAAA,wBACrEH,cAAA,CAAAC,aAAA,EAAA;AAAA,UACC,OAAQ,EAAA,WAAA;AAAA,UACR,YAAW,EAAA,WAAA;AAAA,UACX,OAAS,EAAA,UAAA;AAAA,UACT,QAAU,EAAA,YAAA;AAAA,UACV,SAAA,EAAW,aAAa,kBAAkB,CAAA;AAAA,UAE1C,QAAC,kBAAAD,cAAA,CAAAI,sBAAA,EAAA;AAAA,YAAiB,aAAW,EAAA,IAAA;AAAA,WAAC,CAAA;AAAA,SAChC,CAAA;AAAA,OAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-cjs/pagination/usePagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePagination.js","sources":["../src/pagination/usePagination.ts"],"sourcesContent":["export type PageRange = [number, number];\n\nexport function usePagination(\n  page: number,\n  count: number,\n  boundaryCount: number,\n  siblingCount: number\n) {\n  const totalButtonsVisible = 2 * (boundaryCount + siblingCount) + 3;\n  const isEnoughSpace = totalButtonsVisible >= count;\n\n  const isLeftEllipsis =\n    !isEnoughSpace && page - boundaryCount - siblingCount > 2;\n\n  const isRightEllipsis =\n    !isEnoughSpace && page + boundaryCount + siblingCount + 1 < count;\n\n  const leftPages = isLeftEllipsis\n    ? ([1, boundaryCount] as PageRange)\n    : undefined;\n\n  const rightPages = isRightEllipsis\n    ? ([count - boundaryCount + 1, count] as PageRange)\n    : undefined;\n\n  let middlePages: PageRange;\n\n  if (!isLeftEllipsis) {\n    middlePages = [\n      1,\n      isRightEllipsis ? boundaryCount + 2 + 2 * siblingCount : count,\n    ];\n  } else if (!isRightEllipsis) {\n    middlePages = [count - boundaryCount - 1 - 2 * siblingCount, count];\n  } else {\n    middlePages = [page - siblingCount, page + siblingCount];\n  }\n\n  return [leftPages, middlePages, rightPages] as const;\n}\n"],"names":[],"mappings":";;;;AAEO,SAAS,aACd,CAAA,IAAA,EACA,KACA,EAAA,aAAA,EACA,YACA,EAAA;AACA,EAAM,MAAA,mBAAA,GAAsB,CAAK,IAAA,aAAA,GAAgB,YAAgB,CAAA,GAAA,CAAA,CAAA;AACjE,EAAA,MAAM,gBAAgB,mBAAuB,IAAA,KAAA,CAAA;AAE7C,EAAA,MAAM,cACJ,GAAA,CAAC,aAAiB,IAAA,IAAA,GAAO,gBAAgB,YAAe,GAAA,CAAA,CAAA;AAE1D,EAAA,MAAM,kBACJ,CAAC,aAAA,IAAiB,IAAO,GAAA,aAAA,GAAgB,eAAe,CAAI,GAAA,KAAA,CAAA;AAE9D,EAAA,MAAM,SAAY,GAAA,cAAA,GACb,CAAC,CAAA,EAAG,aAAa,CAClB,GAAA,KAAA,CAAA,CAAA;AAEJ,EAAA,MAAM,aAAa,eACd,GAAA,CAAC,QAAQ,aAAgB,GAAA,CAAA,EAAG,KAAK,CAClC,GAAA,KAAA,CAAA,CAAA;AAEJ,EAAI,IAAA,WAAA,CAAA;AAEJ,EAAA,IAAI,CAAC,cAAgB,EAAA;AACnB,IAAc,WAAA,GAAA;AAAA,MACZ,CAAA;AAAA,MACA,eAAkB,GAAA,aAAA,GAAgB,CAAI,GAAA,CAAA,GAAI,YAAe,GAAA,KAAA;AAAA,KAC3D,CAAA;AAAA,GACF,MAAA,IAAW,CAAC,eAAiB,EAAA;AAC3B,IAAA,WAAA,GAAc,CAAC,KAAQ,GAAA,aAAA,GAAgB,CAAI,GAAA,CAAA,GAAI,cAAc,KAAK,CAAA,CAAA;AAAA,GAC7D,MAAA;AACL,IAAA,WAAA,GAAc,CAAC,IAAA,GAAO,YAAc,EAAA,IAAA,GAAO,YAAY,CAAA,CAAA;AAAA,GACzD;AAEA,EAAO,OAAA,CAAC,SAAW,EAAA,WAAA,EAAa,UAAU,CAAA,CAAA;AAC5C;;;;"}
+{"version":3,"file":"usePagination.js","sources":["../src/pagination/usePagination.ts"],"sourcesContent":["export type PageRange = [number, number];\n\nexport function usePagination(\n  page: number,\n  count: number,\n  boundaryCount: number,\n  siblingCount: number,\n) {\n  const totalButtonsVisible = 2 * (boundaryCount + siblingCount) + 3;\n  const isEnoughSpace = totalButtonsVisible >= count;\n\n  const isLeftEllipsis =\n    !isEnoughSpace && page - boundaryCount - siblingCount > 2;\n\n  const isRightEllipsis =\n    !isEnoughSpace && page + boundaryCount + siblingCount + 1 < count;\n\n  const leftPages = isLeftEllipsis\n    ? ([1, boundaryCount] as PageRange)\n    : undefined;\n\n  const rightPages = isRightEllipsis\n    ? ([count - boundaryCount + 1, count] as PageRange)\n    : undefined;\n\n  let middlePages: PageRange;\n\n  if (!isLeftEllipsis) {\n    middlePages = [\n      1,\n      isRightEllipsis ? boundaryCount + 2 + 2 * siblingCount : count,\n    ];\n  } else if (!isRightEllipsis) {\n    middlePages = [count - boundaryCount - 1 - 2 * siblingCount, count];\n  } else {\n    middlePages = [page - siblingCount, page + siblingCount];\n  }\n\n  return [leftPages, middlePages, rightPages] as const;\n}\n"],"names":[],"mappings":";;;;AAEO,SAAS,aACd,CAAA,IAAA,EACA,KACA,EAAA,aAAA,EACA,YACA,EAAA;AACA,EAAM,MAAA,mBAAA,GAAsB,CAAK,IAAA,aAAA,GAAgB,YAAgB,CAAA,GAAA,CAAA,CAAA;AACjE,EAAA,MAAM,gBAAgB,mBAAuB,IAAA,KAAA,CAAA;AAE7C,EAAA,MAAM,cACJ,GAAA,CAAC,aAAiB,IAAA,IAAA,GAAO,gBAAgB,YAAe,GAAA,CAAA,CAAA;AAE1D,EAAA,MAAM,kBACJ,CAAC,aAAA,IAAiB,IAAO,GAAA,aAAA,GAAgB,eAAe,CAAI,GAAA,KAAA,CAAA;AAE9D,EAAA,MAAM,SAAY,GAAA,cAAA,GACb,CAAC,CAAA,EAAG,aAAa,CAClB,GAAA,KAAA,CAAA,CAAA;AAEJ,EAAA,MAAM,aAAa,eACd,GAAA,CAAC,QAAQ,aAAgB,GAAA,CAAA,EAAG,KAAK,CAClC,GAAA,KAAA,CAAA,CAAA;AAEJ,EAAI,IAAA,WAAA,CAAA;AAEJ,EAAA,IAAI,CAAC,cAAgB,EAAA;AACnB,IAAc,WAAA,GAAA;AAAA,MACZ,CAAA;AAAA,MACA,eAAkB,GAAA,aAAA,GAAgB,CAAI,GAAA,CAAA,GAAI,YAAe,GAAA,KAAA;AAAA,KAC3D,CAAA;AAAA,GACF,MAAA,IAAW,CAAC,eAAiB,EAAA;AAC3B,IAAA,WAAA,GAAc,CAAC,KAAQ,GAAA,aAAA,GAAgB,CAAI,GAAA,CAAA,GAAI,cAAc,KAAK,CAAA,CAAA;AAAA,GAC7D,MAAA;AACL,IAAA,WAAA,GAAc,CAAC,IAAA,GAAO,YAAc,EAAA,IAAA,GAAO,YAAY,CAAA,CAAA;AAAA,GACzD;AAEA,EAAO,OAAA,CAAC,SAAW,EAAA,WAAA,EAAa,UAAU,CAAA,CAAA;AAC5C;;;;"}

package/dist-cjs/pagination/usePaginationContext.js

@@ -9,7 +9,7 @@ const usePaginationContext = () => {
   const context = React.useContext(PaginationContext.paginationContext);
   if (process.env.NODE_ENV !== "production") {
     if (!context) {
-      console.error(`usePaginationContext should be used inside of Pagination`);
+      console.error("usePaginationContext should be used inside of Pagination");
     }
   }
   return context;

package/dist-cjs/pagination/usePaginationContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePaginationContext.js","sources":["../src/pagination/usePaginationContext.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { paginationContext } from \"./PaginationContext\";\n\nexport const usePaginationContext = () => {\n  const context = useContext(paginationContext);\n  if (process.env.NODE_ENV !== \"production\") {\n    if (!context) {\n      console.error(`usePaginationContext should be used inside of Pagination`);\n    }\n  }\n  return context;\n};\n"],"names":["useContext","paginationContext"],"mappings":";;;;;;;AAGO,MAAM,uBAAuB,MAAM;AACxC,EAAM,MAAA,OAAA,GAAUA,iBAAWC,mCAAiB,CAAA,CAAA;AAC5C,EAAI,IAAA,OAAA,CAAQ,GAAI,CAAA,QAAA,KAAa,YAAc,EAAA;AACzC,IAAA,IAAI,CAAC,OAAS,EAAA;AACZ,MAAA,OAAA,CAAQ,MAAM,CAA0D,wDAAA,CAAA,CAAA,CAAA;AAAA,KAC1E;AAAA,GACF;AACA,EAAO,OAAA,OAAA,CAAA;AACT;;;;"}
+{"version":3,"file":"usePaginationContext.js","sources":["../src/pagination/usePaginationContext.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { paginationContext } from \"./PaginationContext\";\n\nexport const usePaginationContext = () => {\n  const context = useContext(paginationContext);\n  if (process.env.NODE_ENV !== \"production\") {\n    if (!context) {\n      console.error(\"usePaginationContext should be used inside of Pagination\");\n    }\n  }\n  return context;\n};\n"],"names":["useContext","paginationContext"],"mappings":";;;;;;;AAGO,MAAM,uBAAuB,MAAM;AACxC,EAAM,MAAA,OAAA,GAAUA,iBAAWC,mCAAiB,CAAA,CAAA;AAC5C,EAAI,IAAA,OAAA,CAAQ,GAAI,CAAA,QAAA,KAAa,YAAc,EAAA;AACzC,IAAA,IAAI,CAAC,OAAS,EAAA;AACZ,MAAA,OAAA,CAAQ,MAAM,0DAA0D,CAAA,CAAA;AAAA,KAC1E;AAAA,GACF;AACA,EAAO,OAAA,OAAA,CAAA;AACT;;;;"}

package/dist-cjs/panel/Panel.js

@@ -27,9 +27,9 @@ require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');
 require('../checkbox/CheckboxGroup.js');
+require('@salt-ds/icons');
 var styles = require('@salt-ds/styles');
 var window = require('@salt-ds/window');
-require('@salt-ds/icons');
 require('../combo-box/ComboBox.js');
 require('../dialog/Dialog.js');
 require('../dialog/DialogHeader.js');
@@ -48,6 +48,7 @@ require('../flex-item/FlexItem.js');
 require('../flex-layout/FlexLayout.js');
 require('../flow-layout/FlowLayout.js');
 require('../form-field/FormField.js');
+require('../form-field-context/FormFieldContext.js');
 require('../status-indicator/StatusIndicator.js');
 require('../text/Text.js');
 require('../text/Code.js');
@@ -56,7 +57,6 @@ require('../text/Headings.js');
 require('../text/Label.js');
 require('../text/TextAction.js');
 require('../text/TextNotation.js');
-require('../form-field-context/FormFieldContext.js');
 require('../grid-item/GridItem.js');
 require('../grid-layout/GridLayout.js');
 require('../input/Input.js');
@@ -67,12 +67,12 @@ require('../link/Link.js');
 require('../link-card/LinkCard.js');
 require('../list-box/ListBox.js');
 require('../list-control/ListControlContext.js');
-require('../menu/MenuContext.js');
 require('@floating-ui/react');
+require('../menu/MenuContext.js');
 require('../menu/MenuItem.js');
 require('../menu/MenuPanel.js');
-require('../menu/MenuTriggerContext.js');
 require('../menu/MenuPanelContext.js');
+require('../menu/MenuTriggerContext.js');
 require('../menu/MenuGroup.js');
 require('../multiline-input/MultilineInput.js');
 require('../navigation-item/NavigationItem.js');

package/dist-cjs/panel/Panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"Panel.js","sources":["../src/panel/Panel.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes } from \"react\";\nimport { makePrefixer } from \"../utils\";\n\nimport panelCss from \"./Panel.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\n/**\n * Panel component that acts as wrapper around a node\n *\n * @example\n * const PanelExample = () => (\n *   <Panel>\n *     <p>This is a panel around some text.</p>\n *   </Panel>\n * );\n *\n */\n\nexport interface PanelProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Styling variant; defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n}\n\nconst withBaseName = makePrefixer(\"saltPanel\");\n\nexport const Panel = forwardRef<HTMLDivElement, PanelProps>(function Panel(\n  { className, children, variant = \"primary\", ...restProps },\n  ref\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-panel\",\n    css: panelCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div\n      className={clsx(withBaseName(), withBaseName(variant), className)}\n      ref={ref}\n      {...restProps}\n    >\n      {children}\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","Panel","useWindow","useComponentCssInjection","panelCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,MAAM,YAAA,GAAeA,0BAAa,WAAW,CAAA,CAAA;AAEhC,MAAA,KAAA,GAAQC,gBAAuC,CAAA,SAASC,MACnE,CAAA,EAAE,SAAW,EAAA,QAAA,EAAU,OAAU,GAAA,SAAA,EAAA,GAAc,SAAU,EAAA,EACzD,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,YAAA;AAAA,IACR,GAAK,EAAAC,OAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,WAAWC,SAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,OAAO,GAAG,SAAS,CAAA;AAAA,IAChE,GAAA;AAAA,IACC,GAAG,SAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Panel.js","sources":["../src/panel/Panel.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { type HTMLAttributes, forwardRef } from \"react\";\nimport { makePrefixer } from \"../utils\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport panelCss from \"./Panel.css\";\n\n/**\n * Panel component that acts as wrapper around a node\n *\n * @example\n * const PanelExample = () => (\n *   <Panel>\n *     <p>This is a panel around some text.</p>\n *   </Panel>\n * );\n *\n */\n\nexport interface PanelProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Styling variant; defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n}\n\nconst withBaseName = makePrefixer(\"saltPanel\");\n\nexport const Panel = forwardRef<HTMLDivElement, PanelProps>(function Panel(\n  { className, children, variant = \"primary\", ...restProps },\n  ref,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-panel\",\n    css: panelCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div\n      className={clsx(withBaseName(), withBaseName(variant), className)}\n      ref={ref}\n      {...restProps}\n    >\n      {children}\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","Panel","useWindow","useComponentCssInjection","panelCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,MAAM,YAAA,GAAeA,0BAAa,WAAW,CAAA,CAAA;AAEhC,MAAA,KAAA,GAAQC,gBAAuC,CAAA,SAASC,MACnE,CAAA,EAAE,SAAW,EAAA,QAAA,EAAU,OAAU,GAAA,SAAA,EAAA,GAAc,SAAU,EAAA,EACzD,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,YAAA;AAAA,IACR,GAAK,EAAAC,OAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,WAAWC,SAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,OAAO,GAAG,SAAS,CAAA;AAAA,IAChE,GAAA;AAAA,IACC,GAAG,SAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-cjs/parent-child-layout/ParentChildLayout.js

@@ -3,6 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
 var clsx = require('clsx');
 var React = require('react');
 var makePrefixer = require('../utils/makePrefixer.js');
@@ -27,8 +29,6 @@ require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');
 require('../checkbox/CheckboxGroup.js');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
 require('@salt-ds/icons');
 require('../combo-box/ComboBox.js');
 require('../dialog/Dialog.js');
@@ -48,6 +48,7 @@ require('../flex-item/FlexItem.js');
 require('../flex-layout/FlexLayout.js');
 require('../flow-layout/FlowLayout.js');
 require('../form-field/FormField.js');
+require('../form-field-context/FormFieldContext.js');
 require('../status-indicator/StatusIndicator.js');
 require('../text/Text.js');
 require('../text/Code.js');
@@ -56,7 +57,6 @@ require('../text/Headings.js');
 require('../text/Label.js');
 require('../text/TextAction.js');
 require('../text/TextNotation.js');
-require('../form-field-context/FormFieldContext.js');
 require('../grid-item/GridItem.js');
 require('../grid-layout/GridLayout.js');
 require('../input/Input.js');
@@ -67,12 +67,12 @@ require('../link/Link.js');
 require('../link-card/LinkCard.js');
 require('../list-box/ListBox.js');
 require('../list-control/ListControlContext.js');
-require('../menu/MenuContext.js');
 require('@floating-ui/react');
+require('../menu/MenuContext.js');
 require('../menu/MenuItem.js');
 require('../menu/MenuPanel.js');
-require('../menu/MenuTriggerContext.js');
 require('../menu/MenuPanelContext.js');
+require('../menu/MenuTriggerContext.js');
 require('../menu/MenuGroup.js');
 require('../multiline-input/MultilineInput.js');
 require('../navigation-item/NavigationItem.js');

package/dist-cjs/parent-child-layout/ParentChildLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"ParentChildLayout.js","sources":["../src/parent-child-layout/ParentChildLayout.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ComponentPropsWithoutRef,\n  forwardRef,\n  ReactNode,\n  useEffect,\n} from \"react\";\nimport { Breakpoints } from \"../breakpoints\";\nimport { makePrefixer } from \"../utils\";\nimport { useIsViewportLargerThanBreakpoint } from \"./useIsViewportLargerThanBreakpoint\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport parentChildLayoutCss from \"./ParentChildLayout.css\";\nexport interface ParentChildLayoutProps\n  extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * Breakpoint at which the parent and child will stack.\n   */\n  collapseAtBreakpoint?: keyof Breakpoints;\n  /**\n   * View that is displayed when in a collapsed state.\n   */\n  visibleView?: \"child\" | \"parent\";\n  /**\n   * Controls the space between parent and child components, default is 0.\n   */\n  gap?: number;\n  /**\n   * Parent component to be rendered\n   */\n  parent: ReactNode;\n  /**\n   * Child component to be rendered\n   */\n  child: ReactNode;\n  /**\n   * Function called when the viewport size equal to or less than the collapseAtBreakpoint variable\n   */\n  onCollapseChange?: (isCollapsed: boolean) => void;\n}\n\nconst withBaseName = makePrefixer(\"saltParentChildLayout\");\n\nexport const ParentChildLayout = forwardRef<\n  HTMLDivElement,\n  ParentChildLayoutProps\n>(function ParentChildLayout(\n  {\n    collapseAtBreakpoint = \"sm\",\n    visibleView = \"child\",\n    parent,\n    child,\n    className,\n    gap = 0,\n    onCollapseChange,\n    style,\n    ...rest\n  },\n  ref\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-parent-child-layout\",\n    css: parentChildLayoutCss,\n    window: targetWindow,\n  });\n\n  const isCollapsed = useIsViewportLargerThanBreakpoint(collapseAtBreakpoint);\n\n  useEffect(() => {\n    onCollapseChange?.(isCollapsed);\n  }, [isCollapsed, onCollapseChange]);\n\n  const parentChildLayoutStyles = {\n    ...style,\n    \"--parentChildLayout-gap\": `calc(var(--salt-spacing-100) * ${gap})`,\n  };\n\n  return (\n    <div\n      ref={ref}\n      className={clsx(withBaseName(), className)}\n      style={parentChildLayoutStyles}\n      {...rest}\n    >\n      {isCollapsed ? (\n        <div\n          key={visibleView}\n          className={clsx({\n            [withBaseName(\"collapsed\")]: isCollapsed,\n            [withBaseName(\"childAnimation\")]: visibleView === \"child\",\n            [withBaseName(\"parentAnimation\")]: visibleView === \"parent\",\n          })}\n        >\n          {isCollapsed && visibleView === \"child\" ? child : parent}\n        </div>\n      ) : (\n        <>\n          <div className={withBaseName(\"parent\")}>{parent}</div>\n          <div className={withBaseName(\"child\")}>{child}</div>\n        </>\n      )}\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","ParentChildLayout","useWindow","useComponentCssInjection","parentChildLayoutCss","useIsViewportLargerThanBreakpoint","useEffect","jsx","clsx","jsxs","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0CA,MAAM,YAAA,GAAeA,0BAAa,uBAAuB,CAAA,CAAA;AAE5C,MAAA,iBAAA,GAAoBC,gBAG/B,CAAA,SAASC,kBACT,CAAA;AAAA,EACE,oBAAuB,GAAA,IAAA;AAAA,EACvB,WAAc,GAAA,OAAA;AAAA,EACd,MAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAM,GAAA,CAAA;AAAA,EACN,gBAAA;AAAA,EACA,KAAA;AAAA,EACG,GAAA,IAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,0BAAA;AAAA,IACR,GAAK,EAAAC,mBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,WAAA,GAAcC,oEAAkC,oBAAoB,CAAA,CAAA;AAE1E,EAAAC,eAAA,CAAU,MAAM;AACd,IAAmB,gBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,gBAAA,CAAA,WAAA,CAAA,CAAA;AAAA,GAClB,EAAA,CAAC,WAAa,EAAA,gBAAgB,CAAC,CAAA,CAAA;AAElC,EAAA,MAAM,uBAA0B,GAAA;AAAA,IAC9B,GAAG,KAAA;AAAA,IACH,2BAA2B,CAAkC,+BAAA,EAAA,GAAA,CAAA,CAAA,CAAA;AAAA,GAC/D,CAAA;AAEA,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,GAAA;AAAA,IACA,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IACzC,KAAO,EAAA,uBAAA;AAAA,IACN,GAAG,IAAA;AAAA,IAEH,wCACED,cAAA,CAAA,KAAA,EAAA;AAAA,MAEC,WAAWC,SAAK,CAAA;AAAA,QACd,CAAC,YAAa,CAAA,WAAW,CAAI,GAAA,WAAA;AAAA,QAC7B,CAAC,YAAA,CAAa,gBAAgB,CAAA,GAAI,WAAgB,KAAA,OAAA;AAAA,QAClD,CAAC,YAAA,CAAa,iBAAiB,CAAA,GAAI,WAAgB,KAAA,QAAA;AAAA,OACpD,CAAA;AAAA,MAEA,QAAA,EAAA,WAAA,IAAe,WAAgB,KAAA,OAAA,GAAU,KAAQ,GAAA,MAAA;AAAA,KAAA,EAP7C,WAQP,CAEA,mBAAAC,eAAA,CAAAC,mBAAA,EAAA;AAAA,MACE,QAAA,EAAA;AAAA,wBAACH,cAAA,CAAA,KAAA,EAAA;AAAA,UAAI,SAAA,EAAW,aAAa,QAAQ,CAAA;AAAA,UAAI,QAAA,EAAA,MAAA;AAAA,SAAO,CAAA;AAAA,wBAC/CA,cAAA,CAAA,KAAA,EAAA;AAAA,UAAI,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,UAAI,QAAA,EAAA,KAAA;AAAA,SAAM,CAAA;AAAA,OAAA;AAAA,KAChD,CAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"ParentChildLayout.js","sources":["../src/parent-child-layout/ParentChildLayout.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  type ReactNode,\n  forwardRef,\n  useEffect,\n} from \"react\";\nimport type { Breakpoints } from \"../breakpoints\";\nimport { makePrefixer } from \"../utils\";\nimport { useIsViewportLargerThanBreakpoint } from \"./useIsViewportLargerThanBreakpoint\";\n\nimport parentChildLayoutCss from \"./ParentChildLayout.css\";\nexport interface ParentChildLayoutProps\n  extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * Breakpoint at which the parent and child will stack.\n   */\n  collapseAtBreakpoint?: keyof Breakpoints;\n  /**\n   * View that is displayed when in a collapsed state.\n   */\n  visibleView?: \"child\" | \"parent\";\n  /**\n   * Controls the space between parent and child components, default is 0.\n   */\n  gap?: number;\n  /**\n   * Parent component to be rendered\n   */\n  parent: ReactNode;\n  /**\n   * Child component to be rendered\n   */\n  child: ReactNode;\n  /**\n   * Function called when the viewport size equal to or less than the collapseAtBreakpoint variable\n   */\n  onCollapseChange?: (isCollapsed: boolean) => void;\n}\n\nconst withBaseName = makePrefixer(\"saltParentChildLayout\");\n\nexport const ParentChildLayout = forwardRef<\n  HTMLDivElement,\n  ParentChildLayoutProps\n>(function ParentChildLayout(\n  {\n    collapseAtBreakpoint = \"sm\",\n    visibleView = \"child\",\n    parent,\n    child,\n    className,\n    gap = 0,\n    onCollapseChange,\n    style,\n    ...rest\n  },\n  ref,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-parent-child-layout\",\n    css: parentChildLayoutCss,\n    window: targetWindow,\n  });\n\n  const isCollapsed = useIsViewportLargerThanBreakpoint(collapseAtBreakpoint);\n\n  useEffect(() => {\n    onCollapseChange?.(isCollapsed);\n  }, [isCollapsed, onCollapseChange]);\n\n  const parentChildLayoutStyles = {\n    ...style,\n    \"--parentChildLayout-gap\": `calc(var(--salt-spacing-100) * ${gap})`,\n  };\n\n  return (\n    <div\n      ref={ref}\n      className={clsx(withBaseName(), className)}\n      style={parentChildLayoutStyles}\n      {...rest}\n    >\n      {isCollapsed ? (\n        <div\n          key={visibleView}\n          className={clsx({\n            [withBaseName(\"collapsed\")]: isCollapsed,\n            [withBaseName(\"childAnimation\")]: visibleView === \"child\",\n            [withBaseName(\"parentAnimation\")]: visibleView === \"parent\",\n          })}\n        >\n          {isCollapsed && visibleView === \"child\" ? child : parent}\n        </div>\n      ) : (\n        <>\n          <div className={withBaseName(\"parent\")}>{parent}</div>\n          <div className={withBaseName(\"child\")}>{child}</div>\n        </>\n      )}\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","ParentChildLayout","useWindow","useComponentCssInjection","parentChildLayoutCss","useIsViewportLargerThanBreakpoint","useEffect","jsx","clsx","jsxs","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0CA,MAAM,YAAA,GAAeA,0BAAa,uBAAuB,CAAA,CAAA;AAE5C,MAAA,iBAAA,GAAoBC,gBAG/B,CAAA,SAASC,kBACT,CAAA;AAAA,EACE,oBAAuB,GAAA,IAAA;AAAA,EACvB,WAAc,GAAA,OAAA;AAAA,EACd,MAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAM,GAAA,CAAA;AAAA,EACN,gBAAA;AAAA,EACA,KAAA;AAAA,EACG,GAAA,IAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,0BAAA;AAAA,IACR,GAAK,EAAAC,mBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,WAAA,GAAcC,oEAAkC,oBAAoB,CAAA,CAAA;AAE1E,EAAAC,eAAA,CAAU,MAAM;AACd,IAAmB,gBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,gBAAA,CAAA,WAAA,CAAA,CAAA;AAAA,GAClB,EAAA,CAAC,WAAa,EAAA,gBAAgB,CAAC,CAAA,CAAA;AAElC,EAAA,MAAM,uBAA0B,GAAA;AAAA,IAC9B,GAAG,KAAA;AAAA,IACH,2BAA2B,CAAkC,+BAAA,EAAA,GAAA,CAAA,CAAA,CAAA;AAAA,GAC/D,CAAA;AAEA,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,GAAA;AAAA,IACA,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IACzC,KAAO,EAAA,uBAAA;AAAA,IACN,GAAG,IAAA;AAAA,IAEH,wCACED,cAAA,CAAA,KAAA,EAAA;AAAA,MAEC,WAAWC,SAAK,CAAA;AAAA,QACd,CAAC,YAAa,CAAA,WAAW,CAAI,GAAA,WAAA;AAAA,QAC7B,CAAC,YAAA,CAAa,gBAAgB,CAAA,GAAI,WAAgB,KAAA,OAAA;AAAA,QAClD,CAAC,YAAA,CAAa,iBAAiB,CAAA,GAAI,WAAgB,KAAA,QAAA;AAAA,OACpD,CAAA;AAAA,MAEA,QAAA,EAAA,WAAA,IAAe,WAAgB,KAAA,OAAA,GAAU,KAAQ,GAAA,MAAA;AAAA,KAAA,EAP7C,WAQP,CAEA,mBAAAC,eAAA,CAAAC,mBAAA,EAAA;AAAA,MACE,QAAA,EAAA;AAAA,wBAACH,cAAA,CAAA,KAAA,EAAA;AAAA,UAAI,SAAA,EAAW,aAAa,QAAQ,CAAA;AAAA,UAAI,QAAA,EAAA,MAAA;AAAA,SAAO,CAAA;AAAA,wBAC/CA,cAAA,CAAA,KAAA,EAAA;AAAA,UAAI,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,UAAI,QAAA,EAAA,KAAA;AAAA,SAAM,CAAA;AAAA,OAAA;AAAA,KAChD,CAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-cjs/parent-child-layout/useIsViewportLargerThanBreakpoint.js

@@ -3,16 +3,16 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 require('react');
+require('react/jsx-runtime');
+require('clsx');
 require('../utils/useFloatingUI/useFloatingUI.js');
 require('../utils/useId.js');
 var useResponsiveProp = require('../utils/useResponsiveProp.js');
-require('clsx');
 require('../accordion/AccordionGroup.js');
 require('../accordion/AccordionPanel.js');
 require('../accordion/Accordion.js');
 require('../accordion/AccordionHeader.js');
 require('../aria-announcer/AriaAnnouncerContext.js');
-require('react/jsx-runtime');
 require('../avatar/Avatar.js');
 require('../badge/Badge.js');
 require('../banner/Banner.js');
@@ -25,10 +25,10 @@ require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');
 require('../checkbox/CheckboxGroup.js');
+require('@salt-ds/icons');
 require('@salt-ds/styles');
 require('@salt-ds/window');
 require('../salt-provider/SaltProvider.js');
-require('@salt-ds/icons');
 require('../combo-box/ComboBox.js');
 require('../dialog/Dialog.js');
 require('../dialog/DialogHeader.js');
@@ -47,6 +47,7 @@ require('../flex-item/FlexItem.js');
 require('../flex-layout/FlexLayout.js');
 require('../flow-layout/FlowLayout.js');
 require('../form-field/FormField.js');
+require('../form-field-context/FormFieldContext.js');
 require('../status-indicator/StatusIndicator.js');
 require('../text/Text.js');
 require('../text/Code.js');
@@ -55,7 +56,6 @@ require('../text/Headings.js');
 require('../text/Label.js');
 require('../text/TextAction.js');
 require('../text/TextNotation.js');
-require('../form-field-context/FormFieldContext.js');
 require('../grid-item/GridItem.js');
 require('../grid-layout/GridLayout.js');
 require('../input/Input.js');
@@ -66,12 +66,12 @@ require('../link/Link.js');
 require('../link-card/LinkCard.js');
 require('../list-box/ListBox.js');
 require('../list-control/ListControlContext.js');
-require('../menu/MenuContext.js');
 require('@floating-ui/react');
+require('../menu/MenuContext.js');
 require('../menu/MenuItem.js');
 require('../menu/MenuPanel.js');
-require('../menu/MenuTriggerContext.js');
 require('../menu/MenuPanelContext.js');
+require('../menu/MenuTriggerContext.js');
 require('../menu/MenuGroup.js');
 require('../multiline-input/MultilineInput.js');
 require('../navigation-item/NavigationItem.js');

package/dist-cjs/parent-child-layout/useIsViewportLargerThanBreakpoint.js.map

@@ -1 +1 @@
-{"version":3,"file":"useIsViewportLargerThanBreakpoint.js","sources":["../src/parent-child-layout/useIsViewportLargerThanBreakpoint.ts"],"sourcesContent":["import { Breakpoints } from \"../breakpoints\";\nimport { useCurrentBreakpoint, useOrderedBreakpoints } from \"../utils\";\n\nexport const useIsViewportLargerThanBreakpoint = (\n  targetedBreakpoint: keyof Breakpoints\n): boolean => {\n  const orderedBreakpoints = useOrderedBreakpoints();\n  const index = orderedBreakpoints.indexOf(targetedBreakpoint);\n  const currentBreakpoint = useCurrentBreakpoint();\n  const currentBreakpointIndex = orderedBreakpoints.indexOf(currentBreakpoint);\n  return index >= currentBreakpointIndex;\n};\n"],"names":["useOrderedBreakpoints","useCurrentBreakpoint"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGa,MAAA,iCAAA,GAAoC,CAC/C,kBACY,KAAA;AACZ,EAAA,MAAM,qBAAqBA,uCAAsB,EAAA,CAAA;AACjD,EAAM,MAAA,KAAA,GAAQ,kBAAmB,CAAA,OAAA,CAAQ,kBAAkB,CAAA,CAAA;AAC3D,EAAA,MAAM,oBAAoBC,sCAAqB,EAAA,CAAA;AAC/C,EAAM,MAAA,sBAAA,GAAyB,kBAAmB,CAAA,OAAA,CAAQ,iBAAiB,CAAA,CAAA;AAC3E,EAAA,OAAO,KAAS,IAAA,sBAAA,CAAA;AAClB;;;;"}
+{"version":3,"file":"useIsViewportLargerThanBreakpoint.js","sources":["../src/parent-child-layout/useIsViewportLargerThanBreakpoint.ts"],"sourcesContent":["import type { Breakpoints } from \"../breakpoints\";\nimport { useCurrentBreakpoint, useOrderedBreakpoints } from \"../utils\";\n\nexport const useIsViewportLargerThanBreakpoint = (\n  targetedBreakpoint: keyof Breakpoints,\n): boolean => {\n  const orderedBreakpoints = useOrderedBreakpoints();\n  const index = orderedBreakpoints.indexOf(targetedBreakpoint);\n  const currentBreakpoint = useCurrentBreakpoint();\n  const currentBreakpointIndex = orderedBreakpoints.indexOf(currentBreakpoint);\n  return index >= currentBreakpointIndex;\n};\n"],"names":["useOrderedBreakpoints","useCurrentBreakpoint"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGa,MAAA,iCAAA,GAAoC,CAC/C,kBACY,KAAA;AACZ,EAAA,MAAM,qBAAqBA,uCAAsB,EAAA,CAAA;AACjD,EAAM,MAAA,KAAA,GAAQ,kBAAmB,CAAA,OAAA,CAAQ,kBAAkB,CAAA,CAAA;AAC3D,EAAA,MAAM,oBAAoBC,sCAAqB,EAAA,CAAA;AAC/C,EAAM,MAAA,sBAAA,GAAyB,kBAAmB,CAAA,OAAA,CAAQ,iBAAiB,CAAA,CAAA;AAC3E,EAAA,OAAO,KAAS,IAAA,sBAAA,CAAA;AAClB;;;;"}

package/dist-cjs/pill/Pill.js

@@ -3,11 +3,12 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
-var clsx = require('clsx');
-var window = require('@salt-ds/window');
 var styles = require('@salt-ds/styles');
-var Pill$1 = require('./Pill.css.js');
+var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var React = require('react');
+require('../button/Button.js');
+var useButton = require('../button/useButton.js');
 var makePrefixer = require('../utils/makePrefixer.js');
 require('../utils/useFloatingUI/useFloatingUI.js');
 require('../utils/useId.js');
@@ -26,8 +27,6 @@ require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
 require('../breakpoints/BreakpointProvider.js');
-require('../button/Button.js');
-var useButton = require('../button/useButton.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');
 require('../checkbox/CheckboxGroup.js');
@@ -50,6 +49,7 @@ require('../flex-item/FlexItem.js');
 require('../flex-layout/FlexLayout.js');
 require('../flow-layout/FlowLayout.js');
 require('../form-field/FormField.js');
+require('../form-field-context/FormFieldContext.js');
 require('../status-indicator/StatusIndicator.js');
 require('../text/Text.js');
 require('../text/Code.js');
@@ -58,7 +58,6 @@ require('../text/Headings.js');
 require('../text/Label.js');
 require('../text/TextAction.js');
 require('../text/TextNotation.js');
-require('../form-field-context/FormFieldContext.js');
 require('../grid-item/GridItem.js');
 require('../grid-layout/GridLayout.js');
 require('../input/Input.js');
@@ -69,12 +68,12 @@ require('../link/Link.js');
 require('../link-card/LinkCard.js');
 require('../list-box/ListBox.js');
 require('../list-control/ListControlContext.js');
-require('../menu/MenuContext.js');
 require('@floating-ui/react');
+require('../menu/MenuContext.js');
 require('../menu/MenuItem.js');
 require('../menu/MenuPanel.js');
-require('../menu/MenuTriggerContext.js');
 require('../menu/MenuPanelContext.js');
+require('../menu/MenuTriggerContext.js');
 require('../menu/MenuGroup.js');
 require('../multiline-input/MultilineInput.js');
 require('../navigation-item/NavigationItem.js');
@@ -109,6 +108,7 @@ require('../toggle-button/ToggleButton.js');
 require('../toggle-button-group/ToggleButtonGroup.js');
 require('../toggle-button-group/ToggleButtonGroupContext.js');
 require('../tooltip/Tooltip.js');
+var Pill$1 = require('./Pill.css.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/dist-cjs/pill/Pill.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pill.js","sources":["../src/pill/Pill.tsx"],"sourcesContent":["import { forwardRef, ComponentPropsWithoutRef } from \"react\";\nimport clsx from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport pillCss from \"./Pill.css\";\nimport { makePrefixer } from \"../utils\";\nimport { useButton } from \"../button\";\n\nconst withBaseName = makePrefixer(\"saltPill\");\n\n/* eslint-disable @typescript-eslint/no-empty-interface */\nexport interface PillProps extends ComponentPropsWithoutRef<\"button\"> {}\n\nexport const Pill = forwardRef<HTMLButtonElement, PillProps>(function Pill(\n  {\n    children,\n    className,\n    disabled,\n    onKeyUp,\n    onKeyDown,\n    onClick,\n    onBlur,\n    ...rest\n  },\n  ref\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-pill\",\n    css: pillCss,\n    window: targetWindow,\n  });\n  const { buttonProps, active } = useButton<HTMLButtonElement>({\n    disabled,\n    onKeyUp,\n    onKeyDown,\n    onClick,\n    onBlur,\n  });\n  // we do not want to spread tab index in this case because the button element\n  // does not require tabindex=\"0\" attribute\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  const { tabIndex, ...restButtonProps } = buttonProps;\n  return (\n    <button\n      data-testid=\"pill\"\n      ref={ref}\n      className={clsx(\n        withBaseName(),\n        withBaseName(\"clickable\"),\n        { [withBaseName(\"active\")]: active },\n        className\n      )}\n      type=\"button\"\n      {...restButtonProps}\n      {...rest}\n    >\n      {children}\n    </button>\n  );\n});\n"],"names":["makePrefixer","forwardRef","Pill","useWindow","useComponentCssInjection","pillCss","useButton","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAM,YAAA,GAAeA,0BAAa,UAAU,CAAA,CAAA;AAK/B,MAAA,IAAA,GAAOC,gBAAyC,CAAA,SAASC,KACpE,CAAA;AAAA,EACE,QAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACG,GAAA,IAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,WAAA;AAAA,IACR,GAAK,EAAAC,MAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AACD,EAAA,MAAM,EAAE,WAAA,EAAa,MAAO,EAAA,GAAIC,mBAA6B,CAAA;AAAA,IAC3D,QAAA;AAAA,IACA,OAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAA;AAAA,IACA,MAAA;AAAA,GACD,CAAA,CAAA;AAID,EAAM,MAAA,EAAE,QAAa,EAAA,GAAA,eAAA,EAAoB,GAAA,WAAA,CAAA;AACzC,EAAA,uBACGC,cAAA,CAAA,QAAA,EAAA;AAAA,IACC,aAAY,EAAA,MAAA;AAAA,IACZ,GAAA;AAAA,IACA,SAAW,EAAAC,wBAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,aAAa,WAAW,CAAA;AAAA,MACxB,EAAE,CAAC,YAAa,CAAA,QAAQ,IAAI,MAAO,EAAA;AAAA,MACnC,SAAA;AAAA,KACF;AAAA,IACA,IAAK,EAAA,QAAA;AAAA,IACJ,GAAG,eAAA;AAAA,IACH,GAAG,IAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Pill.js","sources":["../src/pill/Pill.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport clsx from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { useButton } from \"../button\";\nimport { makePrefixer } from \"../utils\";\nimport pillCss from \"./Pill.css\";\n\nconst withBaseName = makePrefixer(\"saltPill\");\n\nexport interface PillProps extends ComponentPropsWithoutRef<\"button\"> {}\n\nexport const Pill = forwardRef<HTMLButtonElement, PillProps>(function Pill(\n  {\n    children,\n    className,\n    disabled,\n    onKeyUp,\n    onKeyDown,\n    onClick,\n    onBlur,\n    ...rest\n  },\n  ref,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-pill\",\n    css: pillCss,\n    window: targetWindow,\n  });\n  const { buttonProps, active } = useButton<HTMLButtonElement>({\n    disabled,\n    onKeyUp,\n    onKeyDown,\n    onClick,\n    onBlur,\n  });\n  // we do not want to spread tab index in this case because the button element\n  // does not require tabindex=\"0\" attribute\n  const { tabIndex, ...restButtonProps } = buttonProps;\n  return (\n    <button\n      data-testid=\"pill\"\n      ref={ref}\n      className={clsx(\n        withBaseName(),\n        withBaseName(\"clickable\"),\n        { [withBaseName(\"active\")]: active },\n        className,\n      )}\n      type=\"button\"\n      {...restButtonProps}\n      {...rest}\n    >\n      {children}\n    </button>\n  );\n});\n"],"names":["makePrefixer","forwardRef","Pill","useWindow","useComponentCssInjection","pillCss","useButton","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAM,YAAA,GAAeA,0BAAa,UAAU,CAAA,CAAA;AAI/B,MAAA,IAAA,GAAOC,gBAAyC,CAAA,SAASC,KACpE,CAAA;AAAA,EACE,QAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACG,GAAA,IAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,WAAA;AAAA,IACR,GAAK,EAAAC,MAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AACD,EAAA,MAAM,EAAE,WAAA,EAAa,MAAO,EAAA,GAAIC,mBAA6B,CAAA;AAAA,IAC3D,QAAA;AAAA,IACA,OAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAA;AAAA,IACA,MAAA;AAAA,GACD,CAAA,CAAA;AAGD,EAAM,MAAA,EAAE,QAAa,EAAA,GAAA,eAAA,EAAoB,GAAA,WAAA,CAAA;AACzC,EAAA,uBACGC,cAAA,CAAA,QAAA,EAAA;AAAA,IACC,aAAY,EAAA,MAAA;AAAA,IACZ,GAAA;AAAA,IACA,SAAW,EAAAC,wBAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,aAAa,WAAW,CAAA;AAAA,MACxB,EAAE,CAAC,YAAa,CAAA,QAAQ,IAAI,MAAO,EAAA;AAAA,MACnC,SAAA;AAAA,KACF;AAAA,IACA,IAAK,EAAA,QAAA;AAAA,IACJ,GAAG,eAAA;AAAA,IACH,GAAG,IAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-cjs/pill-input/PillInput.js

@@ -3,11 +3,15 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
-var clsx = require('clsx');
-var React = require('react');
+var icons = require('@salt-ds/icons');
 var styles = require('@salt-ds/styles');
 var window = require('@salt-ds/window');
-var icons = require('@salt-ds/icons');
+var clsx = require('clsx');
+var React = require('react');
+require('../form-field-context/FormFieldContext.js');
+var useFormFieldProps = require('../form-field-context/useFormFieldProps.js');
+var Pill = require('../pill/Pill.js');
+var StatusAdornment = require('../status-adornment/StatusAdornment.js');
 var makePrefixer = require('../utils/makePrefixer.js');
 var useControlled = require('../utils/useControlled.js');
 require('../utils/useFloatingUI/useFloatingUI.js');
@@ -58,8 +62,6 @@ require('../text/Headings.js');
 require('../text/Label.js');
 require('../text/TextAction.js');
 require('../text/TextNotation.js');
-require('../form-field-context/FormFieldContext.js');
-var useFormFieldProps = require('../form-field-context/useFormFieldProps.js');
 require('../grid-item/GridItem.js');
 require('../grid-layout/GridLayout.js');
 require('../input/Input.js');
@@ -70,12 +72,12 @@ require('../link/Link.js');
 require('../link-card/LinkCard.js');
 require('../list-box/ListBox.js');
 require('../list-control/ListControlContext.js');
-require('../menu/MenuContext.js');
 require('@floating-ui/react');
+require('../menu/MenuContext.js');
 require('../menu/MenuItem.js');
 require('../menu/MenuPanel.js');
-require('../menu/MenuTriggerContext.js');
 require('../menu/MenuPanelContext.js');
+require('../menu/MenuTriggerContext.js');
 require('../menu/MenuGroup.js');
 require('../multiline-input/MultilineInput.js');
 require('../navigation-item/NavigationItem.js');
@@ -92,7 +94,6 @@ require('../pagination/CompactPaginator.js');
 require('../pagination/GoToInput.js');
 require('../panel/Panel.js');
 require('../parent-child-layout/ParentChildLayout.js');
-var Pill = require('../pill/Pill.js');
 require('../progress/CircularProgress/CircularProgress.js');
 require('../progress/LinearProgress/LinearProgress.js');
 require('../radio-button/RadioButton.js');
@@ -101,7 +102,6 @@ require('../scrim/Scrim.js');
 require('../segmented-button-group/SegmentedButtonGroup.js');
 require('../spinner/Spinner.js');
 require('../stack-layout/StackLayout.js');
-var StatusAdornment = require('../status-adornment/StatusAdornment.js');
 require('../toast/Toast.js');
 require('../toast/ToastContent.js');
 require('../split-layout/SplitLayout.js');
@@ -202,7 +202,7 @@ const PillInput = React.forwardRef(function PillInput2({
   const handleKeyDown = (event) => {
     var _a;
     const target = event.currentTarget;
-    if (target.selectionStart === 0 && target.selectionEnd == 0) {
+    if (target.selectionStart === 0 && target.selectionEnd === 0) {
       const lastPillIndex = pills.length - 1;
       const lastPill = pills[lastPillIndex];
       if (event.key === "Backspace" && lastPill) {
@@ -229,7 +229,7 @@ const PillInput = React.forwardRef(function PillInput2({
       } else {
         (_c = pillElementsRef.current[index + 1]) == null ? void 0 : _c.focus();
       }
-    } else if (event.key == "Delete" || event.key === "Backspace") {
+    } else if (event.key === "Delete" || event.key === "Backspace") {
       event.preventDefault();
       onPillRemove == null ? void 0 : onPillRemove(event, index);
       if (pills.length === 1) {
@@ -309,7 +309,7 @@ const PillInput = React.forwardRef(function PillInput2({
                     })
                   ]
                 })
-              }, index)),
+              }, pill)),
               visiblePills.length < pills.length && /* @__PURE__ */ jsxRuntime.jsx("div", {
                 role: "listitem",
                 children: /* @__PURE__ */ jsxRuntime.jsx("div", {

package/dist-cjs/pill-input/PillInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"PillInput.js","sources":["../src/pill-input/PillInput.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ChangeEvent,\n  KeyboardEvent,\n  SyntheticEvent,\n  ComponentPropsWithoutRef,\n  MouseEvent,\n  ForwardedRef,\n  forwardRef,\n  InputHTMLAttributes,\n  ReactNode,\n  Ref,\n  useState,\n  useRef,\n} from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { CloseIcon, OverflowMenuIcon } from \"@salt-ds/icons\";\nimport { makePrefixer, useControlled, useId, useForkRef } from \"../utils\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { StatusAdornment } from \"../status-adornment\";\nimport { Pill } from \"../pill\";\nimport { useTruncatePills } from \"./useTruncatePills\";\n\nimport pillInputCss from \"./PillInput.css\";\n\nconst withBaseName = makePrefixer(\"saltPillInput\");\n\nexport interface PillInputProps\n  extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\">,\n    Pick<\n      ComponentPropsWithoutRef<\"input\">,\n      \"disabled\" | \"value\" | \"defaultValue\" | \"placeholder\"\n    > {\n  /**\n   * The marker to use in an empty read only Input.\n   * Use `''` to disable this feature. Defaults to '—'.\n   */\n  emptyReadOnlyMarker?: string;\n  /**\n   * End adornment component\n   */\n  endAdornment?: ReactNode;\n  /**\n   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.\n   */\n  inputProps?: InputHTMLAttributes<HTMLInputElement>;\n  /**\n   * Optional ref for the input component\n   */\n  inputRef?: Ref<HTMLInputElement>;\n  /**\n   * If `true`, the component is read only.\n   */\n  readOnly?: boolean;\n  /**\n   * The tokens to display in the input.\n   */\n  pills?: string[];\n  onPillRemove?: (event: SyntheticEvent, index: number) => void;\n  /**\n   * Start adornment component\n   */\n  startAdornment?: ReactNode;\n  /**\n   * Alignment of text within container. Defaults to \"left\"\n   */\n  textAlign?: \"left\" | \"center\" | \"right\";\n  /**\n   * Validation status.\n   */\n  validationStatus?: \"error\" | \"warning\" | \"success\";\n  /**\n   * Styling variant. Defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n  hidePillClose?: boolean;\n  truncate?: boolean;\n  /** Styling variant with full border. Defaults to false\n   */\n  bordered?: boolean;\n}\n\nexport const PillInput = forwardRef(function PillInput(\n  {\n    \"aria-activedescendant\": ariaActiveDescendant,\n    \"aria-expanded\": ariaExpanded,\n    \"aria-owns\": ariaOwns,\n    className: classNameProp,\n    disabled,\n    emptyReadOnlyMarker = \"—\",\n    endAdornment,\n    hidePillClose,\n    id: idProp,\n    inputProps = {},\n    inputRef: inputRefProp,\n    placeholder,\n    pills = [],\n    onPillRemove,\n    readOnly: readOnlyProp,\n    role,\n    startAdornment,\n    style,\n    textAlign = \"left\",\n    value: valueProp,\n    defaultValue: defaultValueProp = valueProp === undefined ? \"\" : undefined,\n    validationStatus: validationStatusProp,\n    variant = \"primary\",\n    truncate,\n    bordered = false,\n    ...other\n  }: PillInputProps,\n  ref: ForwardedRef<HTMLDivElement>\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-pill-input\",\n    css: pillInputCss,\n    window: targetWindow,\n  });\n\n  const {\n    a11yProps: {\n      \"aria-describedby\": formFieldDescribedBy,\n      \"aria-labelledby\": formFieldLabelledBy,\n    } = {},\n    disabled: formFieldDisabled,\n    readOnly: formFieldReadOnly,\n    necessity: formFieldRequired,\n    validationStatus: formFieldValidationStatus,\n  } = useFormFieldProps();\n\n  const restA11yProps = {\n    \"aria-activedescendant\": ariaActiveDescendant,\n    \"aria-expanded\": ariaExpanded,\n    \"aria-owns\": ariaOwns,\n  };\n\n  const isDisabled = disabled || formFieldDisabled;\n  const isReadOnly = readOnlyProp || formFieldReadOnly;\n  const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n\n  const [focusedPillIndex, setFocusedPillIndex] = useState(-1);\n\n  const isEmptyReadOnly = isReadOnly && !defaultValueProp && !valueProp;\n  const defaultValue = isEmptyReadOnly ? emptyReadOnlyMarker : defaultValueProp;\n\n  const {\n    \"aria-describedby\": inputDescribedBy,\n    \"aria-labelledby\": inputLabelledBy,\n    onChange,\n    required: inputPropsRequired,\n    onKeyDown: inputOnKeyDown,\n    ...restInputProps\n  } = inputProps;\n\n  const isRequired = formFieldRequired\n    ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n    : inputPropsRequired;\n\n  const [value, setValue] = useControlled({\n    controlled: valueProp,\n    default: defaultValue,\n    name: \"Input\",\n    state: \"value\",\n  });\n\n  const { visiblePills, pillListRef } = useTruncatePills({\n    pills,\n    enable: truncate && pills.length > 0,\n  });\n\n  const id = useId(idProp);\n  const pillListId = `${id}-optionsList`;\n\n  const pillElementsRef = useRef<HTMLElement[]>([]);\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const handleInputRef = useForkRef(inputRef, inputRefProp);\n\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    const value = event.target.value;\n    setValue(value);\n    onChange?.(event);\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n    const target = event.currentTarget;\n    if (target.selectionStart === 0 && target.selectionEnd == 0) {\n      const lastPillIndex = pills.length - 1;\n      const lastPill = pills[lastPillIndex];\n      if (event.key === \"Backspace\" && lastPill) {\n        event.preventDefault();\n        onPillRemove?.(event, lastPillIndex);\n      } else if (event.key === \"ArrowLeft\") {\n        event.preventDefault();\n        // Move focus to last pill\n        pillElementsRef.current[lastPillIndex]?.focus();\n      }\n    }\n\n    inputOnKeyDown?.(event);\n  };\n\n  const handlePillKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n    const target = event.currentTarget;\n    const index = Number(target.dataset.index);\n    if (event.key === \"ArrowLeft\") {\n      event.preventDefault();\n      // Move focus to previous pill\n      pillElementsRef.current[index - 1]?.focus();\n    } else if (event.key === \"ArrowRight\") {\n      event.preventDefault();\n      // Move focus to next pill or input\n      if (index === pills.length - 1) {\n        inputRef?.current?.focus();\n      } else {\n        pillElementsRef.current[index + 1]?.focus();\n      }\n    } else if (event.key == \"Delete\" || event.key === \"Backspace\") {\n      event.preventDefault();\n      onPillRemove?.(event, index);\n\n      if (pills.length === 1) {\n        inputRef.current?.focus();\n      } else if (index === pills.length - 1) {\n        pillElementsRef.current[pills.length - 2]?.focus();\n      } else {\n        pillElementsRef.current[index]?.focus();\n      }\n    }\n  };\n\n  const handlePillClick = (event: MouseEvent<HTMLButtonElement>) => {\n    const target = event.currentTarget;\n    const index = Number(target.dataset.index);\n    onPillRemove?.(event, index);\n    inputRef.current?.focus();\n  };\n\n  const inputStyle = {\n    \"--input-textAlign\": textAlign,\n    ...style,\n  };\n\n  return (\n    <div\n      className={clsx(\n        withBaseName(),\n        withBaseName(variant),\n        {\n          [withBaseName(\"disabled\")]: isDisabled,\n          [withBaseName(\"readOnly\")]: isReadOnly,\n          [withBaseName(\"truncate\")]: truncate,\n          [withBaseName(validationStatus ?? \"\")]: validationStatus,\n          [withBaseName(\"bordered\")]: bordered,\n        },\n        classNameProp\n      )}\n      ref={ref}\n      style={inputStyle}\n      {...other}\n    >\n      {startAdornment && (\n        <div className={withBaseName(\"startAdornmentContainer\")}>\n          {startAdornment}\n        </div>\n      )}\n      <div className={withBaseName(\"inputWrapper\")} ref={pillListRef}>\n        <div\n          role=\"list\"\n          className={withBaseName(\"pillList\")}\n          aria-labelledby={clsx(formFieldLabelledBy, pillListId)}\n          aria-label=\"Selected Options\"\n          id={pillListId}\n        >\n          {visiblePills?.map((pill, index) => (\n            <div role=\"listitem\" key={index}>\n              <Pill\n                data-index={index}\n                disabled={disabled}\n                ref={(element) => {\n                  if (element) {\n                    pillElementsRef.current[index] = element;\n                  } else {\n                    pillElementsRef.current = pillElementsRef.current.filter(\n                      (pillEl) => pillEl !== element\n                    );\n                  }\n                }}\n                onFocus={() => setFocusedPillIndex(index)}\n                onKeyDown={handlePillKeyDown}\n                onClick={handlePillClick}\n                tabIndex={\n                  focusedPillIndex === -1 || focusedPillIndex === index ? 0 : -1\n                }\n              >\n                {pill}\n                {!hidePillClose && <CloseIcon aria-label=\"click to close\" />}\n              </Pill>\n            </div>\n          ))}\n          {visiblePills.length < pills.length && (\n            <div role=\"listitem\">\n              <div\n                data-overflowindicator\n                className={withBaseName(\"overflowIndicator\")}\n              >\n                <OverflowMenuIcon aria-hidden />\n              </div>\n            </div>\n          )}\n        </div>\n        <input\n          aria-describedby={clsx(formFieldDescribedBy, inputDescribedBy)}\n          aria-labelledby={clsx(formFieldLabelledBy, inputLabelledBy)}\n          className={clsx(withBaseName(\"input\"), inputProps?.className)}\n          disabled={isDisabled}\n          id={id}\n          readOnly={isReadOnly}\n          ref={handleInputRef}\n          role={role}\n          tabIndex={isDisabled ? -1 : 0}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          placeholder={placeholder}\n          value={value}\n          {...restA11yProps}\n          {...restInputProps}\n          required={isRequired}\n        />\n      </div>\n      {!isDisabled && validationStatus && (\n        <StatusAdornment status={validationStatus} />\n      )}\n      {endAdornment && (\n        <div className={withBaseName(\"endAdornmentContainer\")}>\n          {endAdornment}\n        </div>\n      )}\n      <div className={withBaseName(\"activationIndicator\")} />\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","PillInput","useWindow","useComponentCssInjection","pillInputCss","useFormFieldProps","useState","useControlled","useTruncatePills","useId","useRef","useForkRef","value","jsxs","clsx","jsx","Pill","CloseIcon","OverflowMenuIcon","StatusAdornment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,MAAM,YAAA,GAAeA,0BAAa,eAAe,CAAA,CAAA;AAyDpC,MAAA,SAAA,GAAYC,gBAAW,CAAA,SAASC,UAC3C,CAAA;AAAA,EACE,uBAAyB,EAAA,oBAAA;AAAA,EACzB,eAAiB,EAAA,YAAA;AAAA,EACjB,WAAa,EAAA,QAAA;AAAA,EACb,SAAW,EAAA,aAAA;AAAA,EACX,QAAA;AAAA,EACA,mBAAsB,GAAA,QAAA;AAAA,EACtB,YAAA;AAAA,EACA,aAAA;AAAA,EACA,EAAI,EAAA,MAAA;AAAA,EACJ,aAAa,EAAC;AAAA,EACd,QAAU,EAAA,YAAA;AAAA,EACV,WAAA;AAAA,EACA,QAAQ,EAAC;AAAA,EACT,YAAA;AAAA,EACA,QAAU,EAAA,YAAA;AAAA,EACV,IAAA;AAAA,EACA,cAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAY,GAAA,MAAA;AAAA,EACZ,KAAO,EAAA,SAAA;AAAA,EACP,YAAc,EAAA,gBAAA,GAAmB,SAAc,KAAA,KAAA,CAAA,GAAY,EAAK,GAAA,KAAA,CAAA;AAAA,EAChE,gBAAkB,EAAA,oBAAA;AAAA,EAClB,OAAU,GAAA,SAAA;AAAA,EACV,QAAA;AAAA,EACA,QAAW,GAAA,KAAA;AAAA,EACR,GAAA,KAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,iBAAA;AAAA,IACR,GAAK,EAAAC,WAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA;AAAA,IACJ,SAAW,EAAA;AAAA,MACT,kBAAoB,EAAA,oBAAA;AAAA,MACpB,iBAAmB,EAAA,mBAAA;AAAA,QACjB,EAAC;AAAA,IACL,QAAU,EAAA,iBAAA;AAAA,IACV,QAAU,EAAA,iBAAA;AAAA,IACV,SAAW,EAAA,iBAAA;AAAA,IACX,gBAAkB,EAAA,yBAAA;AAAA,MAChBC,mCAAkB,EAAA,CAAA;AAEtB,EAAA,MAAM,aAAgB,GAAA;AAAA,IACpB,uBAAyB,EAAA,oBAAA;AAAA,IACzB,eAAiB,EAAA,YAAA;AAAA,IACjB,WAAa,EAAA,QAAA;AAAA,GACf,CAAA;AAEA,EAAA,MAAM,aAAa,QAAY,IAAA,iBAAA,CAAA;AAC/B,EAAA,MAAM,aAAa,YAAgB,IAAA,iBAAA,CAAA;AACnC,EAAA,MAAM,mBAAmB,yBAA6B,IAAA,IAAA,GAAA,yBAAA,GAAA,oBAAA,CAAA;AAEtD,EAAA,MAAM,CAAC,gBAAA,EAAkB,mBAAmB,CAAA,GAAIC,eAAS,CAAE,CAAA,CAAA,CAAA;AAE3D,EAAA,MAAM,eAAkB,GAAA,UAAA,IAAc,CAAC,gBAAA,IAAoB,CAAC,SAAA,CAAA;AAC5D,EAAM,MAAA,YAAA,GAAe,kBAAkB,mBAAsB,GAAA,gBAAA,CAAA;AAE7D,EAAM,MAAA;AAAA,IACJ,kBAAoB,EAAA,gBAAA;AAAA,IACpB,iBAAmB,EAAA,eAAA;AAAA,IACnB,QAAA;AAAA,IACA,QAAU,EAAA,kBAAA;AAAA,IACV,SAAW,EAAA,cAAA;AAAA,IACR,GAAA,cAAA;AAAA,GACD,GAAA,UAAA,CAAA;AAEJ,EAAM,MAAA,UAAA,GAAa,oBACf,CAAC,UAAA,EAAY,UAAU,CAAE,CAAA,QAAA,CAAS,iBAAiB,CACnD,GAAA,kBAAA,CAAA;AAEJ,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAIC,2BAAc,CAAA;AAAA,IACtC,UAAY,EAAA,SAAA;AAAA,IACZ,OAAS,EAAA,YAAA;AAAA,IACT,IAAM,EAAA,OAAA;AAAA,IACN,KAAO,EAAA,OAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,YAAA,EAAc,WAAY,EAAA,GAAIC,iCAAiB,CAAA;AAAA,IACrD,KAAA;AAAA,IACA,MAAA,EAAQ,QAAY,IAAA,KAAA,CAAM,MAAS,GAAA,CAAA;AAAA,GACpC,CAAA,CAAA;AAED,EAAM,MAAA,EAAA,GAAKC,YAAM,MAAM,CAAA,CAAA;AACvB,EAAA,MAAM,aAAa,CAAG,EAAA,EAAA,CAAA,YAAA,CAAA,CAAA;AAEtB,EAAM,MAAA,eAAA,GAAkBC,YAAsB,CAAA,EAAE,CAAA,CAAA;AAChD,EAAM,MAAA,QAAA,GAAWA,aAAyB,IAAI,CAAA,CAAA;AAE9C,EAAM,MAAA,cAAA,GAAiBC,qBAAW,CAAA,QAAA,EAAU,YAAY,CAAA,CAAA;AAExD,EAAM,MAAA,YAAA,GAAe,CAAC,KAAyC,KAAA;AAC7D,IAAMC,MAAAA,MAAAA,GAAQ,MAAM,MAAO,CAAA,KAAA,CAAA;AAC3B,IAAA,QAAA,CAASA,MAAK,CAAA,CAAA;AACd,IAAW,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACb,CAAA;AAEA,EAAM,MAAA,aAAA,GAAgB,CAAC,KAA2C,KAAA;AA1LpE,IAAA,IAAA,EAAA,CAAA;AA2LI,IAAA,MAAM,SAAS,KAAM,CAAA,aAAA,CAAA;AACrB,IAAA,IAAI,MAAO,CAAA,cAAA,KAAmB,CAAK,IAAA,MAAA,CAAO,gBAAgB,CAAG,EAAA;AAC3D,MAAM,MAAA,aAAA,GAAgB,MAAM,MAAS,GAAA,CAAA,CAAA;AACrC,MAAA,MAAM,WAAW,KAAM,CAAA,aAAA,CAAA,CAAA;AACvB,MAAI,IAAA,KAAA,CAAM,GAAQ,KAAA,WAAA,IAAe,QAAU,EAAA;AACzC,QAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,QAAA,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAe,KAAO,EAAA,aAAA,CAAA,CAAA;AAAA,OACxB,MAAA,IAAW,KAAM,CAAA,GAAA,KAAQ,WAAa,EAAA;AACpC,QAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AAErB,QAAgB,CAAA,EAAA,GAAA,eAAA,CAAA,OAAA,CAAQ,mBAAxB,IAAwC,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,OAC1C;AAAA,KACF;AAEA,IAAiB,cAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,cAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACnB,CAAA;AAEA,EAAM,MAAA,iBAAA,GAAoB,CAAC,KAA4C,KAAA;AA5MzE,IAAA,IAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,CAAA;AA6MI,IAAA,MAAM,SAAS,KAAM,CAAA,aAAA,CAAA;AACrB,IAAA,MAAM,KAAQ,GAAA,MAAA,CAAO,MAAO,CAAA,OAAA,CAAQ,KAAK,CAAA,CAAA;AACzC,IAAI,IAAA,KAAA,CAAM,QAAQ,WAAa,EAAA;AAC7B,MAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AAErB,MAAgB,CAAA,EAAA,GAAA,eAAA,CAAA,OAAA,CAAQ,KAAQ,GAAA,CAAA,CAAA,KAAhC,IAAoC,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,KACtC,MAAA,IAAW,KAAM,CAAA,GAAA,KAAQ,YAAc,EAAA;AACrC,MAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AAErB,MAAI,IAAA,KAAA,KAAU,KAAM,CAAA,MAAA,GAAS,CAAG,EAAA;AAC9B,QAAA,CAAA,EAAA,GAAA,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAU,YAAV,IAAmB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,OACd,MAAA;AACL,QAAgB,CAAA,EAAA,GAAA,eAAA,CAAA,OAAA,CAAQ,KAAQ,GAAA,CAAA,CAAA,KAAhC,IAAoC,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,OACtC;AAAA,eACS,KAAM,CAAA,GAAA,IAAO,QAAY,IAAA,KAAA,CAAM,QAAQ,WAAa,EAAA;AAC7D,MAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,MAAA,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAe,KAAO,EAAA,KAAA,CAAA,CAAA;AAEtB,MAAI,IAAA,KAAA,CAAM,WAAW,CAAG,EAAA;AACtB,QAAA,CAAA,EAAA,GAAA,QAAA,CAAS,YAAT,IAAkB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,OACT,MAAA,IAAA,KAAA,KAAU,KAAM,CAAA,MAAA,GAAS,CAAG,EAAA;AACrC,QAAA,CAAA,EAAA,GAAA,eAAA,CAAgB,OAAQ,CAAA,KAAA,CAAM,MAAS,GAAA,CAAA,CAAA,KAAvC,IAA2C,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,OACtC,MAAA;AACL,QAAgB,CAAA,EAAA,GAAA,eAAA,CAAA,OAAA,CAAQ,WAAxB,IAAgC,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,OAClC;AAAA,KACF;AAAA,GACF,CAAA;AAEA,EAAM,MAAA,eAAA,GAAkB,CAAC,KAAyC,KAAA;AAzOpE,IAAA,IAAA,EAAA,CAAA;AA0OI,IAAA,MAAM,SAAS,KAAM,CAAA,aAAA,CAAA;AACrB,IAAA,MAAM,KAAQ,GAAA,MAAA,CAAO,MAAO,CAAA,OAAA,CAAQ,KAAK,CAAA,CAAA;AACzC,IAAA,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAe,KAAO,EAAA,KAAA,CAAA,CAAA;AACtB,IAAA,CAAA,EAAA,GAAA,QAAA,CAAS,YAAT,IAAkB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,GACpB,CAAA;AAEA,EAAA,MAAM,UAAa,GAAA;AAAA,IACjB,mBAAqB,EAAA,SAAA;AAAA,IACrB,GAAG,KAAA;AAAA,GACL,CAAA;AAEA,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAW,EAAAC,SAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,aAAa,OAAO,CAAA;AAAA,MACpB;AAAA,QACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,UAAA;AAAA,QAC5B,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,UAAA;AAAA,QAC5B,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,QAC5B,CAAC,YAAA,CAAa,gBAAoB,IAAA,IAAA,GAAA,gBAAA,GAAA,EAAE,CAAI,GAAA,gBAAA;AAAA,QACxC,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,OAC9B;AAAA,MACA,aAAA;AAAA,KACF;AAAA,IACA,GAAA;AAAA,IACA,KAAO,EAAA,UAAA;AAAA,IACN,GAAG,KAAA;AAAA,IAEH,QAAA,EAAA;AAAA,MAAA,cAAA,oBACEC,cAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA,EAAW,aAAa,yBAAyB,CAAA;AAAA,QACnD,QAAA,EAAA,cAAA;AAAA,OACH,CAAA;AAAA,sBAEDF,eAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA,EAAW,aAAa,cAAc,CAAA;AAAA,QAAG,GAAK,EAAA,WAAA;AAAA,QACjD,QAAA,EAAA;AAAA,0BAACA,eAAA,CAAA,KAAA,EAAA;AAAA,YACC,IAAK,EAAA,MAAA;AAAA,YACL,SAAA,EAAW,aAAa,UAAU,CAAA;AAAA,YAClC,iBAAA,EAAiBC,SAAK,CAAA,mBAAA,EAAqB,UAAU,CAAA;AAAA,YACrD,YAAW,EAAA,kBAAA;AAAA,YACX,EAAI,EAAA,UAAA;AAAA,YAEH,QAAA,EAAA;AAAA,cAAA,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAc,GAAI,CAAA,CAAC,IAAM,EAAA,KAAA,qBACvBC,cAAA,CAAA,KAAA,EAAA;AAAA,gBAAI,IAAK,EAAA,UAAA;AAAA,gBACR,QAAC,kBAAAF,eAAA,CAAAG,SAAA,EAAA;AAAA,kBACC,YAAY,EAAA,KAAA;AAAA,kBACZ,QAAA;AAAA,kBACA,GAAA,EAAK,CAAC,OAAY,KAAA;AAChB,oBAAA,IAAI,OAAS,EAAA;AACX,sBAAA,eAAA,CAAgB,QAAQ,KAAS,CAAA,GAAA,OAAA,CAAA;AAAA,qBAC5B,MAAA;AACL,sBAAgB,eAAA,CAAA,OAAA,GAAU,gBAAgB,OAAQ,CAAA,MAAA;AAAA,wBAChD,CAAC,WAAW,MAAW,KAAA,OAAA;AAAA,uBACzB,CAAA;AAAA,qBACF;AAAA,mBACF;AAAA,kBACA,OAAA,EAAS,MAAM,mBAAA,CAAoB,KAAK,CAAA;AAAA,kBACxC,SAAW,EAAA,iBAAA;AAAA,kBACX,OAAS,EAAA,eAAA;AAAA,kBACT,QACE,EAAA,gBAAA,KAAqB,CAAM,CAAA,IAAA,gBAAA,KAAqB,QAAQ,CAAI,GAAA,CAAA,CAAA;AAAA,kBAG7D,QAAA,EAAA;AAAA,oBAAA,IAAA;AAAA,oBACA,CAAC,iCAAkBD,cAAA,CAAAE,eAAA,EAAA;AAAA,sBAAU,YAAW,EAAA,gBAAA;AAAA,qBAAiB,CAAA;AAAA,mBAAA;AAAA,iBAC5D,CAAA;AAAA,eAAA,EAtBwB,KAuB1B,CAAA,CAAA;AAAA,cAED,YAAa,CAAA,MAAA,GAAS,KAAM,CAAA,MAAA,oBAC1BF,cAAA,CAAA,KAAA,EAAA;AAAA,gBAAI,IAAK,EAAA,UAAA;AAAA,gBACR,QAAC,kBAAAA,cAAA,CAAA,KAAA,EAAA;AAAA,kBACC,wBAAsB,EAAA,IAAA;AAAA,kBACtB,SAAA,EAAW,aAAa,mBAAmB,CAAA;AAAA,kBAE3C,QAAC,kBAAAA,cAAA,CAAAG,sBAAA,EAAA;AAAA,oBAAiB,aAAW,EAAA,IAAA;AAAA,mBAAC,CAAA;AAAA,iBAChC,CAAA;AAAA,eACF,CAAA;AAAA,aAAA;AAAA,WAEJ,CAAA;AAAA,0BACCH,cAAA,CAAA,OAAA,EAAA;AAAA,YACC,kBAAA,EAAkBD,SAAK,CAAA,oBAAA,EAAsB,gBAAgB,CAAA;AAAA,YAC7D,iBAAA,EAAiBA,SAAK,CAAA,mBAAA,EAAqB,eAAe,CAAA;AAAA,YAC1D,WAAWA,SAAK,CAAA,YAAA,CAAa,OAAO,CAAA,EAAG,yCAAY,SAAS,CAAA;AAAA,YAC5D,QAAU,EAAA,UAAA;AAAA,YACV,EAAA;AAAA,YACA,QAAU,EAAA,UAAA;AAAA,YACV,GAAK,EAAA,cAAA;AAAA,YACL,IAAA;AAAA,YACA,QAAA,EAAU,aAAa,CAAK,CAAA,GAAA,CAAA;AAAA,YAC5B,QAAU,EAAA,YAAA;AAAA,YACV,SAAW,EAAA,aAAA;AAAA,YACX,WAAA;AAAA,YACA,KAAA;AAAA,YACC,GAAG,aAAA;AAAA,YACH,GAAG,cAAA;AAAA,YACJ,QAAU,EAAA,UAAA;AAAA,WACZ,CAAA;AAAA,SAAA;AAAA,OACF,CAAA;AAAA,MACC,CAAC,UAAc,IAAA,gBAAA,oBACbC,cAAA,CAAAI,+BAAA,EAAA;AAAA,QAAgB,MAAQ,EAAA,gBAAA;AAAA,OAAkB,CAAA;AAAA,MAE5C,gCACEJ,cAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA,EAAW,aAAa,uBAAuB,CAAA;AAAA,QACjD,QAAA,EAAA,YAAA;AAAA,OACH,CAAA;AAAA,sBAEDA,cAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA,EAAW,aAAa,qBAAqB,CAAA;AAAA,OAAG,CAAA;AAAA,KAAA;AAAA,GACvD,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"PillInput.js","sources":["../src/pill-input/PillInput.tsx"],"sourcesContent":["import { CloseIcon, OverflowMenuIcon } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ChangeEvent,\n  type ComponentPropsWithoutRef,\n  type ForwardedRef,\n  type InputHTMLAttributes,\n  type KeyboardEvent,\n  type MouseEvent,\n  type ReactNode,\n  type Ref,\n  type SyntheticEvent,\n  forwardRef,\n  useRef,\n  useState,\n} from \"react\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { Pill } from \"../pill\";\nimport { StatusAdornment } from \"../status-adornment\";\nimport { makePrefixer, useControlled, useForkRef, useId } from \"../utils\";\nimport { useTruncatePills } from \"./useTruncatePills\";\n\nimport pillInputCss from \"./PillInput.css\";\n\nconst withBaseName = makePrefixer(\"saltPillInput\");\n\nexport interface PillInputProps\n  extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\">,\n    Pick<\n      ComponentPropsWithoutRef<\"input\">,\n      \"disabled\" | \"value\" | \"defaultValue\" | \"placeholder\"\n    > {\n  /**\n   * The marker to use in an empty read only Input.\n   * Use `''` to disable this feature. Defaults to '—'.\n   */\n  emptyReadOnlyMarker?: string;\n  /**\n   * End adornment component\n   */\n  endAdornment?: ReactNode;\n  /**\n   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.\n   */\n  inputProps?: InputHTMLAttributes<HTMLInputElement>;\n  /**\n   * Optional ref for the input component\n   */\n  inputRef?: Ref<HTMLInputElement>;\n  /**\n   * If `true`, the component is read only.\n   */\n  readOnly?: boolean;\n  /**\n   * The tokens to display in the input.\n   */\n  pills?: string[];\n  onPillRemove?: (event: SyntheticEvent, index: number) => void;\n  /**\n   * Start adornment component\n   */\n  startAdornment?: ReactNode;\n  /**\n   * Alignment of text within container. Defaults to \"left\"\n   */\n  textAlign?: \"left\" | \"center\" | \"right\";\n  /**\n   * Validation status.\n   */\n  validationStatus?: \"error\" | \"warning\" | \"success\";\n  /**\n   * Styling variant. Defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n  hidePillClose?: boolean;\n  truncate?: boolean;\n  /** Styling variant with full border. Defaults to false\n   */\n  bordered?: boolean;\n}\n\nexport const PillInput = forwardRef(function PillInput(\n  {\n    \"aria-activedescendant\": ariaActiveDescendant,\n    \"aria-expanded\": ariaExpanded,\n    \"aria-owns\": ariaOwns,\n    className: classNameProp,\n    disabled,\n    emptyReadOnlyMarker = \"—\",\n    endAdornment,\n    hidePillClose,\n    id: idProp,\n    inputProps = {},\n    inputRef: inputRefProp,\n    placeholder,\n    pills = [],\n    onPillRemove,\n    readOnly: readOnlyProp,\n    role,\n    startAdornment,\n    style,\n    textAlign = \"left\",\n    value: valueProp,\n    defaultValue: defaultValueProp = valueProp === undefined ? \"\" : undefined,\n    validationStatus: validationStatusProp,\n    variant = \"primary\",\n    truncate,\n    bordered = false,\n    ...other\n  }: PillInputProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-pill-input\",\n    css: pillInputCss,\n    window: targetWindow,\n  });\n\n  const {\n    a11yProps: {\n      \"aria-describedby\": formFieldDescribedBy,\n      \"aria-labelledby\": formFieldLabelledBy,\n    } = {},\n    disabled: formFieldDisabled,\n    readOnly: formFieldReadOnly,\n    necessity: formFieldRequired,\n    validationStatus: formFieldValidationStatus,\n  } = useFormFieldProps();\n\n  const restA11yProps = {\n    \"aria-activedescendant\": ariaActiveDescendant,\n    \"aria-expanded\": ariaExpanded,\n    \"aria-owns\": ariaOwns,\n  };\n\n  const isDisabled = disabled || formFieldDisabled;\n  const isReadOnly = readOnlyProp || formFieldReadOnly;\n  const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n\n  const [focusedPillIndex, setFocusedPillIndex] = useState(-1);\n\n  const isEmptyReadOnly = isReadOnly && !defaultValueProp && !valueProp;\n  const defaultValue = isEmptyReadOnly ? emptyReadOnlyMarker : defaultValueProp;\n\n  const {\n    \"aria-describedby\": inputDescribedBy,\n    \"aria-labelledby\": inputLabelledBy,\n    onChange,\n    required: inputPropsRequired,\n    onKeyDown: inputOnKeyDown,\n    ...restInputProps\n  } = inputProps;\n\n  const isRequired = formFieldRequired\n    ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n    : inputPropsRequired;\n\n  const [value, setValue] = useControlled({\n    controlled: valueProp,\n    default: defaultValue,\n    name: \"Input\",\n    state: \"value\",\n  });\n\n  const { visiblePills, pillListRef } = useTruncatePills({\n    pills,\n    enable: truncate && pills.length > 0,\n  });\n\n  const id = useId(idProp);\n  const pillListId = `${id}-optionsList`;\n\n  const pillElementsRef = useRef<HTMLElement[]>([]);\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const handleInputRef = useForkRef(inputRef, inputRefProp);\n\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    const value = event.target.value;\n    setValue(value);\n    onChange?.(event);\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n    const target = event.currentTarget;\n    if (target.selectionStart === 0 && target.selectionEnd === 0) {\n      const lastPillIndex = pills.length - 1;\n      const lastPill = pills[lastPillIndex];\n      if (event.key === \"Backspace\" && lastPill) {\n        event.preventDefault();\n        onPillRemove?.(event, lastPillIndex);\n      } else if (event.key === \"ArrowLeft\") {\n        event.preventDefault();\n        // Move focus to last pill\n        pillElementsRef.current[lastPillIndex]?.focus();\n      }\n    }\n\n    inputOnKeyDown?.(event);\n  };\n\n  const handlePillKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n    const target = event.currentTarget;\n    const index = Number(target.dataset.index);\n    if (event.key === \"ArrowLeft\") {\n      event.preventDefault();\n      // Move focus to previous pill\n      pillElementsRef.current[index - 1]?.focus();\n    } else if (event.key === \"ArrowRight\") {\n      event.preventDefault();\n      // Move focus to next pill or input\n      if (index === pills.length - 1) {\n        inputRef?.current?.focus();\n      } else {\n        pillElementsRef.current[index + 1]?.focus();\n      }\n    } else if (event.key === \"Delete\" || event.key === \"Backspace\") {\n      event.preventDefault();\n      onPillRemove?.(event, index);\n\n      if (pills.length === 1) {\n        inputRef.current?.focus();\n      } else if (index === pills.length - 1) {\n        pillElementsRef.current[pills.length - 2]?.focus();\n      } else {\n        pillElementsRef.current[index]?.focus();\n      }\n    }\n  };\n\n  const handlePillClick = (event: MouseEvent<HTMLButtonElement>) => {\n    const target = event.currentTarget;\n    const index = Number(target.dataset.index);\n    onPillRemove?.(event, index);\n    inputRef.current?.focus();\n  };\n\n  const inputStyle = {\n    \"--input-textAlign\": textAlign,\n    ...style,\n  };\n\n  return (\n    <div\n      className={clsx(\n        withBaseName(),\n        withBaseName(variant),\n        {\n          [withBaseName(\"disabled\")]: isDisabled,\n          [withBaseName(\"readOnly\")]: isReadOnly,\n          [withBaseName(\"truncate\")]: truncate,\n          [withBaseName(validationStatus ?? \"\")]: validationStatus,\n          [withBaseName(\"bordered\")]: bordered,\n        },\n        classNameProp,\n      )}\n      ref={ref}\n      style={inputStyle}\n      {...other}\n    >\n      {startAdornment && (\n        <div className={withBaseName(\"startAdornmentContainer\")}>\n          {startAdornment}\n        </div>\n      )}\n      <div className={withBaseName(\"inputWrapper\")} ref={pillListRef}>\n        <div\n          role=\"list\"\n          className={withBaseName(\"pillList\")}\n          aria-labelledby={clsx(formFieldLabelledBy, pillListId)}\n          aria-label=\"Selected Options\"\n          id={pillListId}\n        >\n          {visiblePills?.map((pill, index) => (\n            <div role=\"listitem\" key={pill}>\n              <Pill\n                data-index={index}\n                disabled={disabled}\n                ref={(element) => {\n                  if (element) {\n                    pillElementsRef.current[index] = element;\n                  } else {\n                    pillElementsRef.current = pillElementsRef.current.filter(\n                      (pillEl) => pillEl !== element,\n                    );\n                  }\n                }}\n                onFocus={() => setFocusedPillIndex(index)}\n                onKeyDown={handlePillKeyDown}\n                onClick={handlePillClick}\n                tabIndex={\n                  focusedPillIndex === -1 || focusedPillIndex === index ? 0 : -1\n                }\n              >\n                {pill}\n                {!hidePillClose && <CloseIcon aria-label=\"click to close\" />}\n              </Pill>\n            </div>\n          ))}\n          {visiblePills.length < pills.length && (\n            <div role=\"listitem\">\n              <div\n                data-overflowindicator\n                className={withBaseName(\"overflowIndicator\")}\n              >\n                <OverflowMenuIcon aria-hidden />\n              </div>\n            </div>\n          )}\n        </div>\n        <input\n          aria-describedby={clsx(formFieldDescribedBy, inputDescribedBy)}\n          aria-labelledby={clsx(formFieldLabelledBy, inputLabelledBy)}\n          className={clsx(withBaseName(\"input\"), inputProps?.className)}\n          disabled={isDisabled}\n          id={id}\n          readOnly={isReadOnly}\n          ref={handleInputRef}\n          role={role}\n          tabIndex={isDisabled ? -1 : 0}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          placeholder={placeholder}\n          value={value}\n          {...restA11yProps}\n          {...restInputProps}\n          required={isRequired}\n        />\n      </div>\n      {!isDisabled && validationStatus && (\n        <StatusAdornment status={validationStatus} />\n      )}\n      {endAdornment && (\n        <div className={withBaseName(\"endAdornmentContainer\")}>\n          {endAdornment}\n        </div>\n      )}\n      <div className={withBaseName(\"activationIndicator\")} />\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","PillInput","useWindow","useComponentCssInjection","pillInputCss","useFormFieldProps","useState","useControlled","useTruncatePills","useId","useRef","useForkRef","value","jsxs","clsx","jsx","Pill","CloseIcon","OverflowMenuIcon","StatusAdornment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,MAAM,YAAA,GAAeA,0BAAa,eAAe,CAAA,CAAA;AAyDpC,MAAA,SAAA,GAAYC,gBAAW,CAAA,SAASC,UAC3C,CAAA;AAAA,EACE,uBAAyB,EAAA,oBAAA;AAAA,EACzB,eAAiB,EAAA,YAAA;AAAA,EACjB,WAAa,EAAA,QAAA;AAAA,EACb,SAAW,EAAA,aAAA;AAAA,EACX,QAAA;AAAA,EACA,mBAAsB,GAAA,QAAA;AAAA,EACtB,YAAA;AAAA,EACA,aAAA;AAAA,EACA,EAAI,EAAA,MAAA;AAAA,EACJ,aAAa,EAAC;AAAA,EACd,QAAU,EAAA,YAAA;AAAA,EACV,WAAA;AAAA,EACA,QAAQ,EAAC;AAAA,EACT,YAAA;AAAA,EACA,QAAU,EAAA,YAAA;AAAA,EACV,IAAA;AAAA,EACA,cAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAY,GAAA,MAAA;AAAA,EACZ,KAAO,EAAA,SAAA;AAAA,EACP,YAAc,EAAA,gBAAA,GAAmB,SAAc,KAAA,KAAA,CAAA,GAAY,EAAK,GAAA,KAAA,CAAA;AAAA,EAChE,gBAAkB,EAAA,oBAAA;AAAA,EAClB,OAAU,GAAA,SAAA;AAAA,EACV,QAAA;AAAA,EACA,QAAW,GAAA,KAAA;AAAA,EACR,GAAA,KAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,iBAAA;AAAA,IACR,GAAK,EAAAC,WAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA;AAAA,IACJ,SAAW,EAAA;AAAA,MACT,kBAAoB,EAAA,oBAAA;AAAA,MACpB,iBAAmB,EAAA,mBAAA;AAAA,QACjB,EAAC;AAAA,IACL,QAAU,EAAA,iBAAA;AAAA,IACV,QAAU,EAAA,iBAAA;AAAA,IACV,SAAW,EAAA,iBAAA;AAAA,IACX,gBAAkB,EAAA,yBAAA;AAAA,MAChBC,mCAAkB,EAAA,CAAA;AAEtB,EAAA,MAAM,aAAgB,GAAA;AAAA,IACpB,uBAAyB,EAAA,oBAAA;AAAA,IACzB,eAAiB,EAAA,YAAA;AAAA,IACjB,WAAa,EAAA,QAAA;AAAA,GACf,CAAA;AAEA,EAAA,MAAM,aAAa,QAAY,IAAA,iBAAA,CAAA;AAC/B,EAAA,MAAM,aAAa,YAAgB,IAAA,iBAAA,CAAA;AACnC,EAAA,MAAM,mBAAmB,yBAA6B,IAAA,IAAA,GAAA,yBAAA,GAAA,oBAAA,CAAA;AAEtD,EAAA,MAAM,CAAC,gBAAA,EAAkB,mBAAmB,CAAA,GAAIC,eAAS,CAAE,CAAA,CAAA,CAAA;AAE3D,EAAA,MAAM,eAAkB,GAAA,UAAA,IAAc,CAAC,gBAAA,IAAoB,CAAC,SAAA,CAAA;AAC5D,EAAM,MAAA,YAAA,GAAe,kBAAkB,mBAAsB,GAAA,gBAAA,CAAA;AAE7D,EAAM,MAAA;AAAA,IACJ,kBAAoB,EAAA,gBAAA;AAAA,IACpB,iBAAmB,EAAA,eAAA;AAAA,IACnB,QAAA;AAAA,IACA,QAAU,EAAA,kBAAA;AAAA,IACV,SAAW,EAAA,cAAA;AAAA,IACR,GAAA,cAAA;AAAA,GACD,GAAA,UAAA,CAAA;AAEJ,EAAM,MAAA,UAAA,GAAa,oBACf,CAAC,UAAA,EAAY,UAAU,CAAE,CAAA,QAAA,CAAS,iBAAiB,CACnD,GAAA,kBAAA,CAAA;AAEJ,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAIC,2BAAc,CAAA;AAAA,IACtC,UAAY,EAAA,SAAA;AAAA,IACZ,OAAS,EAAA,YAAA;AAAA,IACT,IAAM,EAAA,OAAA;AAAA,IACN,KAAO,EAAA,OAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,YAAA,EAAc,WAAY,EAAA,GAAIC,iCAAiB,CAAA;AAAA,IACrD,KAAA;AAAA,IACA,MAAA,EAAQ,QAAY,IAAA,KAAA,CAAM,MAAS,GAAA,CAAA;AAAA,GACpC,CAAA,CAAA;AAED,EAAM,MAAA,EAAA,GAAKC,YAAM,MAAM,CAAA,CAAA;AACvB,EAAA,MAAM,aAAa,CAAG,EAAA,EAAA,CAAA,YAAA,CAAA,CAAA;AAEtB,EAAM,MAAA,eAAA,GAAkBC,YAAsB,CAAA,EAAE,CAAA,CAAA;AAChD,EAAM,MAAA,QAAA,GAAWA,aAAyB,IAAI,CAAA,CAAA;AAE9C,EAAM,MAAA,cAAA,GAAiBC,qBAAW,CAAA,QAAA,EAAU,YAAY,CAAA,CAAA;AAExD,EAAM,MAAA,YAAA,GAAe,CAAC,KAAyC,KAAA;AAC7D,IAAMC,MAAAA,MAAAA,GAAQ,MAAM,MAAO,CAAA,KAAA,CAAA;AAC3B,IAAA,QAAA,CAASA,MAAK,CAAA,CAAA;AACd,IAAW,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACb,CAAA;AAEA,EAAM,MAAA,aAAA,GAAgB,CAAC,KAA2C,KAAA;AA1LpE,IAAA,IAAA,EAAA,CAAA;AA2LI,IAAA,MAAM,SAAS,KAAM,CAAA,aAAA,CAAA;AACrB,IAAA,IAAI,MAAO,CAAA,cAAA,KAAmB,CAAK,IAAA,MAAA,CAAO,iBAAiB,CAAG,EAAA;AAC5D,MAAM,MAAA,aAAA,GAAgB,MAAM,MAAS,GAAA,CAAA,CAAA;AACrC,MAAA,MAAM,WAAW,KAAM,CAAA,aAAA,CAAA,CAAA;AACvB,MAAI,IAAA,KAAA,CAAM,GAAQ,KAAA,WAAA,IAAe,QAAU,EAAA;AACzC,QAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,QAAA,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAe,KAAO,EAAA,aAAA,CAAA,CAAA;AAAA,OACxB,MAAA,IAAW,KAAM,CAAA,GAAA,KAAQ,WAAa,EAAA;AACpC,QAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AAErB,QAAgB,CAAA,EAAA,GAAA,eAAA,CAAA,OAAA,CAAQ,mBAAxB,IAAwC,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,OAC1C;AAAA,KACF;AAEA,IAAiB,cAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,cAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACnB,CAAA;AAEA,EAAM,MAAA,iBAAA,GAAoB,CAAC,KAA4C,KAAA;AA5MzE,IAAA,IAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,CAAA;AA6MI,IAAA,MAAM,SAAS,KAAM,CAAA,aAAA,CAAA;AACrB,IAAA,MAAM,KAAQ,GAAA,MAAA,CAAO,MAAO,CAAA,OAAA,CAAQ,KAAK,CAAA,CAAA;AACzC,IAAI,IAAA,KAAA,CAAM,QAAQ,WAAa,EAAA;AAC7B,MAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AAErB,MAAgB,CAAA,EAAA,GAAA,eAAA,CAAA,OAAA,CAAQ,KAAQ,GAAA,CAAA,CAAA,KAAhC,IAAoC,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,KACtC,MAAA,IAAW,KAAM,CAAA,GAAA,KAAQ,YAAc,EAAA;AACrC,MAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AAErB,MAAI,IAAA,KAAA,KAAU,KAAM,CAAA,MAAA,GAAS,CAAG,EAAA;AAC9B,QAAA,CAAA,EAAA,GAAA,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAU,YAAV,IAAmB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,OACd,MAAA;AACL,QAAgB,CAAA,EAAA,GAAA,eAAA,CAAA,OAAA,CAAQ,KAAQ,GAAA,CAAA,CAAA,KAAhC,IAAoC,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,OACtC;AAAA,eACS,KAAM,CAAA,GAAA,KAAQ,QAAY,IAAA,KAAA,CAAM,QAAQ,WAAa,EAAA;AAC9D,MAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,MAAA,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAe,KAAO,EAAA,KAAA,CAAA,CAAA;AAEtB,MAAI,IAAA,KAAA,CAAM,WAAW,CAAG,EAAA;AACtB,QAAA,CAAA,EAAA,GAAA,QAAA,CAAS,YAAT,IAAkB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,OACT,MAAA,IAAA,KAAA,KAAU,KAAM,CAAA,MAAA,GAAS,CAAG,EAAA;AACrC,QAAA,CAAA,EAAA,GAAA,eAAA,CAAgB,OAAQ,CAAA,KAAA,CAAM,MAAS,GAAA,CAAA,CAAA,KAAvC,IAA2C,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,OACtC,MAAA;AACL,QAAgB,CAAA,EAAA,GAAA,eAAA,CAAA,OAAA,CAAQ,WAAxB,IAAgC,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,OAClC;AAAA,KACF;AAAA,GACF,CAAA;AAEA,EAAM,MAAA,eAAA,GAAkB,CAAC,KAAyC,KAAA;AAzOpE,IAAA,IAAA,EAAA,CAAA;AA0OI,IAAA,MAAM,SAAS,KAAM,CAAA,aAAA,CAAA;AACrB,IAAA,MAAM,KAAQ,GAAA,MAAA,CAAO,MAAO,CAAA,OAAA,CAAQ,KAAK,CAAA,CAAA;AACzC,IAAA,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAe,KAAO,EAAA,KAAA,CAAA,CAAA;AACtB,IAAA,CAAA,EAAA,GAAA,QAAA,CAAS,YAAT,IAAkB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,GACpB,CAAA;AAEA,EAAA,MAAM,UAAa,GAAA;AAAA,IACjB,mBAAqB,EAAA,SAAA;AAAA,IACrB,GAAG,KAAA;AAAA,GACL,CAAA;AAEA,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAW,EAAAC,SAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,aAAa,OAAO,CAAA;AAAA,MACpB;AAAA,QACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,UAAA;AAAA,QAC5B,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,UAAA;AAAA,QAC5B,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,QAC5B,CAAC,YAAA,CAAa,gBAAoB,IAAA,IAAA,GAAA,gBAAA,GAAA,EAAE,CAAI,GAAA,gBAAA;AAAA,QACxC,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,OAC9B;AAAA,MACA,aAAA;AAAA,KACF;AAAA,IACA,GAAA;AAAA,IACA,KAAO,EAAA,UAAA;AAAA,IACN,GAAG,KAAA;AAAA,IAEH,QAAA,EAAA;AAAA,MAAA,cAAA,oBACEC,cAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA,EAAW,aAAa,yBAAyB,CAAA;AAAA,QACnD,QAAA,EAAA,cAAA;AAAA,OACH,CAAA;AAAA,sBAEDF,eAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA,EAAW,aAAa,cAAc,CAAA;AAAA,QAAG,GAAK,EAAA,WAAA;AAAA,QACjD,QAAA,EAAA;AAAA,0BAACA,eAAA,CAAA,KAAA,EAAA;AAAA,YACC,IAAK,EAAA,MAAA;AAAA,YACL,SAAA,EAAW,aAAa,UAAU,CAAA;AAAA,YAClC,iBAAA,EAAiBC,SAAK,CAAA,mBAAA,EAAqB,UAAU,CAAA;AAAA,YACrD,YAAW,EAAA,kBAAA;AAAA,YACX,EAAI,EAAA,UAAA;AAAA,YAEH,QAAA,EAAA;AAAA,cAAA,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAc,GAAI,CAAA,CAAC,IAAM,EAAA,KAAA,qBACvBC,cAAA,CAAA,KAAA,EAAA;AAAA,gBAAI,IAAK,EAAA,UAAA;AAAA,gBACR,QAAC,kBAAAF,eAAA,CAAAG,SAAA,EAAA;AAAA,kBACC,YAAY,EAAA,KAAA;AAAA,kBACZ,QAAA;AAAA,kBACA,GAAA,EAAK,CAAC,OAAY,KAAA;AAChB,oBAAA,IAAI,OAAS,EAAA;AACX,sBAAA,eAAA,CAAgB,QAAQ,KAAS,CAAA,GAAA,OAAA,CAAA;AAAA,qBAC5B,MAAA;AACL,sBAAgB,eAAA,CAAA,OAAA,GAAU,gBAAgB,OAAQ,CAAA,MAAA;AAAA,wBAChD,CAAC,WAAW,MAAW,KAAA,OAAA;AAAA,uBACzB,CAAA;AAAA,qBACF;AAAA,mBACF;AAAA,kBACA,OAAA,EAAS,MAAM,mBAAA,CAAoB,KAAK,CAAA;AAAA,kBACxC,SAAW,EAAA,iBAAA;AAAA,kBACX,OAAS,EAAA,eAAA;AAAA,kBACT,QACE,EAAA,gBAAA,KAAqB,CAAM,CAAA,IAAA,gBAAA,KAAqB,QAAQ,CAAI,GAAA,CAAA,CAAA;AAAA,kBAG7D,QAAA,EAAA;AAAA,oBAAA,IAAA;AAAA,oBACA,CAAC,iCAAkBD,cAAA,CAAAE,eAAA,EAAA;AAAA,sBAAU,YAAW,EAAA,gBAAA;AAAA,qBAAiB,CAAA;AAAA,mBAAA;AAAA,iBAC5D,CAAA;AAAA,eAAA,EAtBwB,IAuB1B,CAAA,CAAA;AAAA,cAED,YAAa,CAAA,MAAA,GAAS,KAAM,CAAA,MAAA,oBAC1BF,cAAA,CAAA,KAAA,EAAA;AAAA,gBAAI,IAAK,EAAA,UAAA;AAAA,gBACR,QAAC,kBAAAA,cAAA,CAAA,KAAA,EAAA;AAAA,kBACC,wBAAsB,EAAA,IAAA;AAAA,kBACtB,SAAA,EAAW,aAAa,mBAAmB,CAAA;AAAA,kBAE3C,QAAC,kBAAAA,cAAA,CAAAG,sBAAA,EAAA;AAAA,oBAAiB,aAAW,EAAA,IAAA;AAAA,mBAAC,CAAA;AAAA,iBAChC,CAAA;AAAA,eACF,CAAA;AAAA,aAAA;AAAA,WAEJ,CAAA;AAAA,0BACCH,cAAA,CAAA,OAAA,EAAA;AAAA,YACC,kBAAA,EAAkBD,SAAK,CAAA,oBAAA,EAAsB,gBAAgB,CAAA;AAAA,YAC7D,iBAAA,EAAiBA,SAAK,CAAA,mBAAA,EAAqB,eAAe,CAAA;AAAA,YAC1D,WAAWA,SAAK,CAAA,YAAA,CAAa,OAAO,CAAA,EAAG,yCAAY,SAAS,CAAA;AAAA,YAC5D,QAAU,EAAA,UAAA;AAAA,YACV,EAAA;AAAA,YACA,QAAU,EAAA,UAAA;AAAA,YACV,GAAK,EAAA,cAAA;AAAA,YACL,IAAA;AAAA,YACA,QAAA,EAAU,aAAa,CAAK,CAAA,GAAA,CAAA;AAAA,YAC5B,QAAU,EAAA,YAAA;AAAA,YACV,SAAW,EAAA,aAAA;AAAA,YACX,WAAA;AAAA,YACA,KAAA;AAAA,YACC,GAAG,aAAA;AAAA,YACH,GAAG,cAAA;AAAA,YACJ,QAAU,EAAA,UAAA;AAAA,WACZ,CAAA;AAAA,SAAA;AAAA,OACF,CAAA;AAAA,MACC,CAAC,UAAc,IAAA,gBAAA,oBACbC,cAAA,CAAAI,+BAAA,EAAA;AAAA,QAAgB,MAAQ,EAAA,gBAAA;AAAA,OAAkB,CAAA;AAAA,MAE5C,gCACEJ,cAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA,EAAW,aAAa,uBAAuB,CAAA;AAAA,QACjD,QAAA,EAAA,YAAA;AAAA,OACH,CAAA;AAAA,sBAEDA,cAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA,EAAW,aAAa,qBAAqB,CAAA;AAAA,OAAG,CAAA;AAAA,KAAA;AAAA,GACvD,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-cjs/pill-input/useTruncatePills.js

@@ -2,16 +2,17 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var window = require('@salt-ds/window');
 var React = require('react');
+require('react/jsx-runtime');
+require('clsx');
 require('../utils/useFloatingUI/useFloatingUI.js');
 require('../utils/useId.js');
 var useIsomorphicLayoutEffect = require('../utils/useIsomorphicLayoutEffect.js');
 require('../salt-provider/SaltProvider.js');
 require('../viewport/ViewportProvider.js');
-require('clsx');
 var useValueEffect = require('../utils/useValueEffect.js');
 var useResizeObserver = require('../utils/useResizeObserver.js');
-var window = require('@salt-ds/window');
 
 function useTruncatePills({
   pills,
@@ -31,7 +32,9 @@ function useTruncatePills({
           pillList.querySelectorAll('[role="listitem"]')
         );
         const maxWidth = pillList.getBoundingClientRect().width;
-        const listGap = parseInt(targetWindow.getComputedStyle(pillList).gap);
+        const listGap = Number.parseInt(
+          targetWindow.getComputedStyle(pillList).gap
+        );
         const isShowingOverflow = pillList.querySelector(
           "[data-overflowindicator]"
         );
@@ -67,7 +70,9 @@ function useTruncatePills({
       }
     });
   }, [pills, setVisibleItems, enable, targetWindow]);
-  useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(updateOverflow, [updateOverflow, pills]);
+  useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(() => {
+    updateOverflow();
+  }, [updateOverflow]);
   useResizeObserver.useResizeObserver({
     ref: pillListRef,
     onResize: updateOverflow