@salt-ds/lab 1.0.0-alpha.71 → 1.0.0-alpha.73

package/dist-es/list-deprecated/internal/DescendantContext.js

@@ -2,8 +2,11 @@ import { jsx } from 'react/jsx-runtime';
 import { useIsomorphicLayoutEffect } from '@salt-ds/core';
 import { createContext, useRef, useState, useContext } from 'react';
 
-const DescendantContext = createContext();
-function DescendantProvider({ items, ...props }) {
+const DescendantContext = createContext({});
+function DescendantProvider({
+  items,
+  ...props
+}) {
   const assigning = useRef(true);
   const [, forceUpdate] = useState();
   useIsomorphicLayoutEffect(() => {
@@ -14,7 +17,7 @@ function DescendantProvider({ items, ...props }) {
       assigning.current = true;
     }
     return () => {
-      if (assigning.current) {
+      if (assigning.current && items) {
         items.current = [];
       }
     };
@@ -25,7 +28,7 @@ function useDescendant(descendant) {
   const { assigning, items } = useContext(DescendantContext);
   const index = useRef(-1);
   useIsomorphicLayoutEffect(() => {
-    if (assigning.current) {
+    if ((assigning == null ? void 0 : assigning.current) && (items == null ? void 0 : items.current)) {
       index.current = items.current.push(descendant) - 1;
     }
   });

package/dist-es/list-deprecated/internal/DescendantContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"DescendantContext.js","sources":["../src/list-deprecated/internal/DescendantContext.jsx"],"sourcesContent":["import { useIsomorphicLayoutEffect } from \"@salt-ds/core\";\nimport { createContext, useContext, useRef, useState } from \"react\";\n\n// //////////////////////////////////////////////////////////////////////////////\n// SUPER HACKS AHEAD: The React team will hate this enough to hopefully give us\n// a way to know the index of a descendant given a parent (will help generate\n// IDs for accessibility a long with the ability create maximally composable\n// component abstractions).\n//\n// This is all to avoid cloneElement. If we can avoid cloneElement then people\n// can have arbitrary markup around MenuItems.  This basically takes advantage\n// of react's render lifecycles to let us \"register\" descendants to an\n// ancestor, so that we can track all the descendants and manage focus on them,\n// etc.  The super hacks here are for the child to know it's index as well, so\n// that it can set attributes, match against state from above, etc.\nexport const DescendantContext = createContext();\n\nexport function DescendantProvider({ items, ...props }) {\n  // On the first render we say we're \"assigning\", and the children will push\n  // into the array when they show up in their own useLayoutEffect.\n  const assigning = useRef(true);\n\n  // since children are pushed into the array in useLayoutEffect of the child,\n  // children can't read their index on first render.  So we need to cause a\n  // second render so they can read their index.\n  const [, forceUpdate] = useState();\n\n  // parent useLayoutEffect is always last\n  useIsomorphicLayoutEffect(() => {\n    if (assigning.current) {\n      // At this point all of the children have pushed into the array so we set\n      // assigning to false and force an update. Since we're in\n      // useLayoutEffect, we won't get a flash of rendered content, it will all\n      // happen synchronously. And now that this is false, children won't push\n      // into the array on the forceUpdate\n      assigning.current = false;\n      forceUpdate({});\n    } else {\n      // After the forceUpdate completes, we end up here and set assigning back\n      // to true for the next update from the app\n      assigning.current = true;\n    }\n    return () => {\n      // this cleanup function runs right before the next render, so it's the\n      // right time to empty out the array to be reassigned with whatever shows\n      // up next render.\n      if (assigning.current) {\n        // we only want to empty out the array before the next render cycle if\n        // it was NOT the result of our forceUpdate, so being guarded behind\n        // assigning.current works\n        items.current = [];\n      }\n    };\n  }, [items]);\n\n  return <DescendantContext.Provider {...props} value={{ items, assigning }} />;\n}\n\nexport function useDescendant(descendant) {\n  const { assigning, items } = useContext(DescendantContext);\n  const index = useRef(-1);\n\n  useIsomorphicLayoutEffect(() => {\n    if (assigning.current) {\n      index.current = items.current.push(descendant) - 1;\n    }\n  });\n\n  // first render its wrong, after a forceUpdate in parent useLayoutEffect it's\n  // right, and its all synchronous so we don't get any flashing\n  return index.current;\n}\n"],"names":[],"mappings":";;;;AAeO,MAAM,oBAAoB,aAAc;AAExC,SAAS,kBAAmB,CAAA,EAAE,KAAO,EAAA,GAAG,OAAS,EAAA;AAGtD,EAAM,MAAA,SAAA,GAAY,OAAO,IAAI,CAAA;AAK7B,EAAA,MAAM,GAAG,WAAW,CAAA,GAAI,QAAS,EAAA;AAGjC,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,UAAU,OAAS,EAAA;AAMrB,MAAA,SAAA,CAAU,OAAU,GAAA,KAAA;AACpB,MAAA,WAAA,CAAY,EAAE,CAAA;AAAA,KACT,MAAA;AAGL,MAAA,SAAA,CAAU,OAAU,GAAA,IAAA;AAAA;AAEtB,IAAA,OAAO,MAAM;AAIX,MAAA,IAAI,UAAU,OAAS,EAAA;AAIrB,QAAA,KAAA,CAAM,UAAU,EAAC;AAAA;AACnB,KACF;AAAA,GACF,EAAG,CAAC,KAAK,CAAC,CAAA;AAEV,EAAO,uBAAA,GAAA,CAAC,iBAAkB,CAAA,QAAA,EAAlB,EAA4B,GAAG,OAAO,KAAO,EAAA,EAAE,KAAO,EAAA,SAAA,EAAa,EAAA,CAAA;AAC7E;AAEO,SAAS,cAAc,UAAY,EAAA;AACxC,EAAA,MAAM,EAAE,SAAA,EAAW,KAAM,EAAA,GAAI,WAAW,iBAAiB,CAAA;AACzD,EAAM,MAAA,KAAA,GAAQ,OAAO,EAAE,CAAA;AAEvB,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,UAAU,OAAS,EAAA;AACrB,MAAA,KAAA,CAAM,OAAU,GAAA,KAAA,CAAM,OAAQ,CAAA,IAAA,CAAK,UAAU,CAAI,GAAA,CAAA;AAAA;AACnD,GACD,CAAA;AAID,EAAA,OAAO,KAAM,CAAA,OAAA;AACf;;;;"}
+{"version":3,"file":"DescendantContext.js","sources":["../src/list-deprecated/internal/DescendantContext.tsx"],"sourcesContent":["import { useIsomorphicLayoutEffect } from \"@salt-ds/core\";\nimport {\n  createContext,\n  type MutableRefObject,\n  type ReactNode,\n  useContext,\n  useRef,\n  useState,\n} from \"react\";\n\n// //////////////////////////////////////////////////////////////////////////////\n// SUPER HACKS AHEAD: The React team will hate this enough to hopefully give us\n// a way to know the index of a descendant given a parent (will help generate\n// IDs for accessibility a long with the ability create maximally composable\n// component abstractions).\n//\n// This is all to avoid cloneElement. If we can avoid cloneElement then people\n// can have arbitrary markup around MenuItems.  This basically takes advantage\n// of react's render lifecycles to let us \"register\" descendants to an\n// ancestor, so that we can track all the descendants and manage focus on them,\n// etc.  The super hacks here are for the child to know it's index as well, so\n// that it can set attributes, match against state from above, etc.\ninterface DescendantProviderProps {\n  children?: ReactNode;\n  items?: MutableRefObject<unknown[]>;\n}\n\ninterface DescendantContextType {\n  assigning?: MutableRefObject<boolean>;\n  items?: DescendantProviderProps[\"items\"];\n}\n\nexport const DescendantContext = createContext<DescendantContextType>({});\n\nexport function DescendantProvider({\n  items,\n  ...props\n}: DescendantProviderProps) {\n  // On the first render we say we're \"assigning\", and the children will push\n  // into the array when they show up in their own useLayoutEffect.\n  const assigning = useRef(true);\n\n  // since children are pushed into the array in useLayoutEffect of the child,\n  // children can't read their index on first render.  So we need to cause a\n  // second render so they can read their index.\n  const [, forceUpdate] = useState<unknown>();\n\n  // parent useLayoutEffect is always last\n  useIsomorphicLayoutEffect(() => {\n    if (assigning.current) {\n      // At this point all of the children have pushed into the array so we set\n      // assigning to false and force an update. Since we're in\n      // useLayoutEffect, we won't get a flash of rendered content, it will all\n      // happen synchronously. And now that this is false, children won't push\n      // into the array on the forceUpdate\n      assigning.current = false;\n      forceUpdate({});\n    } else {\n      // After the forceUpdate completes, we end up here and set assigning back\n      // to true for the next update from the app\n      assigning.current = true;\n    }\n    return () => {\n      // this cleanup function runs right before the next render, so it's the\n      // right time to empty out the array to be reassigned with whatever shows\n      // up next render.\n      if (assigning.current && items) {\n        // we only want to empty out the array before the next render cycle if\n        // it was NOT the result of our forceUpdate, so being guarded behind\n        // assigning.current works\n        items.current = [];\n      }\n    };\n  }, [items]);\n\n  return <DescendantContext.Provider {...props} value={{ items, assigning }} />;\n}\n\nexport function useDescendant(descendant: unknown) {\n  const { assigning, items } = useContext(DescendantContext);\n  const index = useRef(-1);\n\n  useIsomorphicLayoutEffect(() => {\n    if (assigning?.current && items?.current) {\n      index.current = items.current.push(descendant) - 1;\n    }\n  });\n\n  // first render its wrong, after a forceUpdate in parent useLayoutEffect it's\n  // right, and its all synchronous so we don't get any flashing\n  return index.current;\n}\n"],"names":[],"mappings":";;;;AAgCa,MAAA,iBAAA,GAAoB,aAAqC,CAAA,EAAE;AAEjE,SAAS,kBAAmB,CAAA;AAAA,EACjC,KAAA;AAAA,EACA,GAAG;AACL,CAA4B,EAAA;AAG1B,EAAM,MAAA,SAAA,GAAY,OAAO,IAAI,CAAA;AAK7B,EAAA,MAAM,GAAG,WAAW,CAAA,GAAI,QAAkB,EAAA;AAG1C,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,UAAU,OAAS,EAAA;AAMrB,MAAA,SAAA,CAAU,OAAU,GAAA,KAAA;AACpB,MAAA,WAAA,CAAY,EAAE,CAAA;AAAA,KACT,MAAA;AAGL,MAAA,SAAA,CAAU,OAAU,GAAA,IAAA;AAAA;AAEtB,IAAA,OAAO,MAAM;AAIX,MAAI,IAAA,SAAA,CAAU,WAAW,KAAO,EAAA;AAI9B,QAAA,KAAA,CAAM,UAAU,EAAC;AAAA;AACnB,KACF;AAAA,GACF,EAAG,CAAC,KAAK,CAAC,CAAA;AAEV,EAAO,uBAAA,GAAA,CAAC,iBAAkB,CAAA,QAAA,EAAlB,EAA4B,GAAG,OAAO,KAAO,EAAA,EAAE,KAAO,EAAA,SAAA,EAAa,EAAA,CAAA;AAC7E;AAEO,SAAS,cAAc,UAAqB,EAAA;AACjD,EAAA,MAAM,EAAE,SAAA,EAAW,KAAM,EAAA,GAAI,WAAW,iBAAiB,CAAA;AACzD,EAAM,MAAA,KAAA,GAAQ,OAAO,EAAE,CAAA;AAEvB,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAI,IAAA,CAAA,SAAA,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAW,OAAW,MAAA,KAAA,IAAA,IAAA,GAAA,MAAA,GAAA,KAAA,CAAO,OAAS,CAAA,EAAA;AACxC,MAAA,KAAA,CAAM,OAAU,GAAA,KAAA,CAAM,OAAQ,CAAA,IAAA,CAAK,UAAU,CAAI,GAAA,CAAA;AAAA;AACnD,GACD,CAAA;AAID,EAAA,OAAO,KAAM,CAAA,OAAA;AACf;;;;"}

package/dist-es/list-deprecated/internal/Highlighter.js

@@ -1,9 +1,9 @@
 import { jsx, Fragment } from 'react/jsx-runtime';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
 import { escapeRegExp } from '../../utils/escapeRegExp.js';
 import 'react';
 import '@salt-ds/core';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
 import css_248z from './Highlighter.css.js';
 
 const baseName = "saltHighlighter";

package/dist-es/list-deprecated/internal/Highlighter.js.map

@@ -1 +1 @@
-{"version":3,"file":"Highlighter.js","sources":["../src/list-deprecated/internal/Highlighter.jsx"],"sourcesContent":["import { escapeRegExp } from \"../../utils\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport highlighterCss from \"./Highlighter.css\";\n\nconst baseName = \"saltHighlighter\";\n\nexport const Highlighter = (props) => {\n  const { matchPattern, text = \"\" } = props;\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-highligher-deprecated\",\n    css: highlighterCss,\n    window: targetWindow,\n  });\n  const matchRegex =\n    typeof matchPattern === \"string\"\n      ? new RegExp(`(${escapeRegExp(matchPattern)})`, \"gi\")\n      : matchPattern;\n  return (\n    <>\n      {text.split(matchRegex).map((part, index) =>\n        part.match(matchRegex) ? (\n          <strong className={`${baseName}-highlight`} key={`${index}-${part}`}>\n            {part}\n          </strong>\n        ) : (\n          part\n        ),\n      )}\n    </>\n  );\n};\n"],"names":["highlighterCss"],"mappings":";;;;;;;;AAMA,MAAM,QAAW,GAAA,iBAAA;AAEJ,MAAA,WAAA,GAAc,CAAC,KAAU,KAAA;AACpC,EAAA,MAAM,EAAE,YAAA,EAAc,IAAO,GAAA,EAAA,EAAO,GAAA,KAAA;AACpC,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,4BAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AACD,EAAA,MAAM,UACJ,GAAA,OAAO,YAAiB,KAAA,QAAA,GACpB,IAAI,MAAA,CAAO,CAAI,CAAA,EAAA,YAAA,CAAa,YAAY,CAAC,CAAK,CAAA,CAAA,EAAA,IAAI,CAClD,GAAA,YAAA;AACN,EAAA,uBAEK,GAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA,IAAA,CAAK,KAAM,CAAA,UAAU,CAAE,CAAA,GAAA;AAAA,IAAI,CAAC,IAAM,EAAA,KAAA,KACjC,KAAK,KAAM,CAAA,UAAU,oBAClB,GAAA,CAAA,QAAA,EAAA,EAAO,WAAW,CAAG,EAAA,QAAQ,cAC3B,QAD8C,EAAA,IAAA,EAAA,EAAA,CAAA,EAAG,KAAK,CAAI,CAAA,EAAA,IAAI,EAEjE,CAEA,GAAA;AAAA,GAGN,EAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"Highlighter.js","sources":["../src/list-deprecated/internal/Highlighter.jsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { escapeRegExp } from \"../../utils\";\nimport highlighterCss from \"./Highlighter.css\";\n\nconst baseName = \"saltHighlighter\";\n\nexport const Highlighter = (props) => {\n  const { matchPattern, text = \"\" } = props;\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-highligher-deprecated\",\n    css: highlighterCss,\n    window: targetWindow,\n  });\n  const matchRegex =\n    typeof matchPattern === \"string\"\n      ? new RegExp(`(${escapeRegExp(matchPattern)})`, \"gi\")\n      : matchPattern;\n  return (\n    <>\n      {text.split(matchRegex).map((part, index) =>\n        part.match(matchRegex) ? (\n          <strong className={`${baseName}-highlight`} key={`${index}-${part}`}>\n            {part}\n          </strong>\n        ) : (\n          part\n        ),\n      )}\n    </>\n  );\n};\n"],"names":["highlighterCss"],"mappings":";;;;;;;;AAKA,MAAM,QAAW,GAAA,iBAAA;AAEJ,MAAA,WAAA,GAAc,CAAC,KAAU,KAAA;AACpC,EAAA,MAAM,EAAE,YAAA,EAAc,IAAO,GAAA,EAAA,EAAO,GAAA,KAAA;AACpC,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,4BAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AACD,EAAA,MAAM,UACJ,GAAA,OAAO,YAAiB,KAAA,QAAA,GACpB,IAAI,MAAA,CAAO,CAAI,CAAA,EAAA,YAAA,CAAa,YAAY,CAAC,CAAK,CAAA,CAAA,EAAA,IAAI,CAClD,GAAA,YAAA;AACN,EAAA,uBAEK,GAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA,IAAA,CAAK,KAAM,CAAA,UAAU,CAAE,CAAA,GAAA;AAAA,IAAI,CAAC,IAAM,EAAA,KAAA,KACjC,KAAK,KAAM,CAAA,UAAU,oBAClB,GAAA,CAAA,QAAA,EAAA,EAAO,WAAW,CAAG,EAAA,QAAQ,cAC3B,QAD8C,EAAA,IAAA,EAAA,EAAA,CAAA,EAAG,KAAK,CAAI,CAAA,EAAA,IAAI,EAEjE,CAEA,GAAA;AAAA,GAGN,EAAA,CAAA;AAEJ;;;;"}

package/dist-es/list-deprecated/itemToString.js

@@ -4,7 +4,7 @@ function itemToString(item) {
   if (!isPlainObject(item)) {
     return String(item);
   }
-  if (Object.prototype.hasOwnProperty.call(item, "label")) {
+  if (Object.hasOwn(item, "label")) {
     return String(item.label);
   }
   console.warn(

package/dist-es/list-deprecated/itemToString.js.map

@@ -1 +1 @@
-{"version":3,"file":"itemToString.js","sources":["../src/list-deprecated/itemToString.ts"],"sourcesContent":["import { isPlainObject } from \"./internal/helpers\";\n\nexport type ItemToStringFunction = (item: any) => string;\n\nexport function itemToString(item: any) {\n  if (!isPlainObject(item)) {\n    return String(item);\n  }\n\n  if (Object.prototype.hasOwnProperty.call(item, \"label\")) {\n    return String(item.label);\n  }\n\n  console.warn(\n    [\n      \"itemToString: you've likely forgotten to set the label prop on the item object.\",\n      \"You can also provide your own `itemToString` implementation.\",\n    ].join(\"\\n\"),\n  );\n\n  return \"\";\n}\n"],"names":[],"mappings":";;AAIO,SAAS,aAAa,IAAW,EAAA;AACtC,EAAI,IAAA,CAAC,aAAc,CAAA,IAAI,CAAG,EAAA;AACxB,IAAA,OAAO,OAAO,IAAI,CAAA;AAAA;AAGpB,EAAA,IAAI,OAAO,SAAU,CAAA,cAAA,CAAe,IAAK,CAAA,IAAA,EAAM,OAAO,CAAG,EAAA;AACvD,IAAO,OAAA,MAAA,CAAO,KAAK,KAAK,CAAA;AAAA;AAG1B,EAAQ,OAAA,CAAA,IAAA;AAAA,IACN;AAAA,MACE,iFAAA;AAAA,MACA;AAAA,KACF,CAAE,KAAK,IAAI;AAAA,GACb;AAEA,EAAO,OAAA,EAAA;AACT;;;;"}
+{"version":3,"file":"itemToString.js","sources":["../src/list-deprecated/itemToString.ts"],"sourcesContent":["import { isPlainObject } from \"./internal/helpers\";\n\nexport type ItemToStringFunction = (item: any) => string;\n\nexport function itemToString(item: any) {\n  if (!isPlainObject(item)) {\n    return String(item);\n  }\n\n  if (Object.hasOwn(item, \"label\")) {\n    return String(item.label);\n  }\n\n  console.warn(\n    [\n      \"itemToString: you've likely forgotten to set the label prop on the item object.\",\n      \"You can also provide your own `itemToString` implementation.\",\n    ].join(\"\\n\"),\n  );\n\n  return \"\";\n}\n"],"names":[],"mappings":";;AAIO,SAAS,aAAa,IAAW,EAAA;AACtC,EAAI,IAAA,CAAC,aAAc,CAAA,IAAI,CAAG,EAAA;AACxB,IAAA,OAAO,OAAO,IAAI,CAAA;AAAA;AAGpB,EAAA,IAAI,MAAO,CAAA,MAAA,CAAO,IAAM,EAAA,OAAO,CAAG,EAAA;AAChC,IAAO,OAAA,MAAA,CAAO,KAAK,KAAK,CAAA;AAAA;AAG1B,EAAQ,OAAA,CAAA,IAAA;AAAA,IACN;AAAA,MACE,iFAAA;AAAA,MACA;AAAA,KACF,CAAE,KAAK,IAAI;AAAA,GACb;AAEA,EAAO,OAAA,EAAA;AACT;;;;"}

package/dist-es/list-deprecated/useList.js.map

@@ -1 +1 @@
-{"version":3,"file":"useList.js","sources":["../src/list-deprecated/useList.ts"],"sourcesContent":["import {\n  ownerDocument,\n  useControlled,\n  useForkRef,\n  useId,\n  useIsFocusVisible,\n} from \"@salt-ds/core\";\n\nimport {\n  type AriaAttributes,\n  type Dispatch,\n  type FocusEvent,\n  type KeyboardEvent,\n  type KeyboardEventHandler,\n  type MouseEvent,\n  type Ref,\n  type SetStateAction,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport type {\n  ListMultiSelectionVariant,\n  ListProps,\n  ListSelectionVariant,\n} from \"./ListProps\";\n\ntype keyHandler = (event: KeyboardEvent<HTMLInputElement>) => void;\n\ninterface listBoxAriaProps\n  extends Pick<\n    AriaAttributes,\n    \"aria-activedescendant\" | \"aria-multiselectable\"\n  > {\n  role: string; // We will default it to be 'listbox', but users can override\n}\nexport interface ListState<\n  Item = string,\n  Variant extends ListSelectionVariant = \"default\",\n> {\n  id?: string;\n  focusVisible: boolean;\n  selectedItem?: Variant extends ListMultiSelectionVariant ? Array<Item> : Item;\n  highlightedIndex?: number;\n  isDeselectable: boolean;\n  isMultiSelect: boolean;\n  isDisabled: boolean;\n}\n\nexport interface ListHelpers<\n  Item = string,\n  Variant extends ListSelectionVariant = \"default\",\n> {\n  setFocusVisible: (visible: boolean) => void;\n  setSelectedItem: Dispatch<\n    SetStateAction<\n      (Variant extends ListMultiSelectionVariant ? Item[] : Item) | undefined\n    >\n  >;\n  setHighlightedIndex: (highlightedIndex?: number) => void;\n  handleSelect: (\n    event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>,\n    index: number | undefined,\n    item: Item,\n  ) => void;\n  keyDownHandlers: { [key: string]: KeyboardEventHandler };\n  // TODO: Form Field\n}\n\nexport function useList<Item, Variant extends ListSelectionVariant>(\n  props: ListProps<Item, Variant> = {},\n): {\n  focusedRef: Ref<any>;\n  listProps: Partial<ListProps<Item, Variant>> & listBoxAriaProps;\n  state: ListState<Item, Variant>;\n  helpers: ListHelpers<Item, Variant>;\n} {\n  validateProps(props);\n\n  const generatedId = useId(props.id);\n\n  const {\n    id = generatedId,\n    source = [],\n    itemCount = source.length,\n    getItemId = (index) => `${id}-item-${index}`,\n    getItemAtIndex: getItemAtIndexProp,\n    getItemIndex: getItemIndexProp,\n    displayedItemCount = 10,\n    initialSelectedItem,\n    selectionVariant,\n    disabled = false,\n    onBlur,\n    onChange,\n    onFocus,\n    onKeyDown,\n    onMouseDown,\n    onMouseLeave,\n    onSelect,\n    disableMouseDown,\n    restoreLastFocus,\n    highlightedIndex: highlightedIndexProp,\n    selectedItem: selectedItemProp,\n    tabToSelect,\n    ...restProps\n  } = props;\n\n  const {\n    isFocusVisibleRef,\n    onFocus: handleFocusVisible,\n    onBlur: handleBlurVisible,\n    ref: focusVisibleRef,\n  } = useIsFocusVisible();\n\n  const { current: isDeselectable } = useRef(\n    selectionVariant === \"deselectable\",\n  );\n  const { current: isMultiSelect } = useRef(\n    selectionVariant === \"multiple\" ||\n      selectionVariant === \"extended\" ||\n      Array.isArray(initialSelectedItem) ||\n      Array.isArray(selectedItemProp),\n  );\n\n  const { current: isExtendedSelect } = useRef(selectionVariant === \"extended\");\n\n  let getItemIndex = useCallback(\n    (item: Item) => source.indexOf(item),\n    [source],\n  );\n  let getItemAtIndex = useCallback((index: number) => source[index], [source]);\n\n  const indexComparator = useCallback(\n    (a: Item, b: Item) => getItemIndex(a) - getItemIndex(b),\n    [getItemIndex],\n  );\n\n  // Only use getItemIndex and getItemAtIndex if both are defined; otherwise keep the defaults\n  if (\n    typeof getItemIndexProp === \"function\" &&\n    typeof getItemAtIndexProp === \"function\"\n  ) {\n    getItemIndex = getItemIndexProp;\n    getItemAtIndex = getItemAtIndexProp;\n  }\n\n  const rootRef = useRef();\n  const [focusVisible, setFocusVisible] = useState(false);\n  const [lastFocusedIndex, setLastFocusedIndex] = useState(-1);\n\n  const [selectedItem, setSelectedItem] = useControlled<\n    undefined | (Variant extends ListMultiSelectionVariant ? Item[] : Item)\n  >({\n    controlled: selectedItemProp,\n    default:\n      initialSelectedItem ??\n      ((isMultiSelect\n        ? []\n        : null) as unknown as Variant extends ListMultiSelectionVariant\n        ? Item[]\n        : Item),\n    name: \"useList\",\n    state: \"selectedItem\",\n  });\n\n  const [highlightedIndex, setHighlightedIndex] = useControlled<\n    number | undefined\n  >({\n    controlled: highlightedIndexProp,\n    default: undefined,\n    name: \"useList\",\n    state: \"highlightedIndex\",\n  });\n\n  const handleSingleSelect = useCallback(\n    (\n      event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>,\n      index: number | undefined,\n      item: Item,\n    ) => {\n      const isSelected = item === selectedItem;\n      let nextItem: Item | null;\n\n      if (isSelected && !isDeselectable) {\n        return;\n      }\n\n      if (!isSelected) {\n        nextItem = item;\n        setHighlightedIndex(index);\n      } else {\n        nextItem = null;\n      }\n\n      setSelectedItem(\n        nextItem as Variant extends ListMultiSelectionVariant ? Item[] : Item,\n      );\n\n      if (onChange) {\n        onChange(\n          event,\n          nextItem as Variant extends ListMultiSelectionVariant ? Item[] : Item,\n        );\n      }\n    },\n    [isDeselectable, onChange, selectedItem],\n  );\n\n  const handleMultiSelect = useCallback(\n    (\n      event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>,\n      index: number | undefined,\n      item: Item,\n    ) => {\n      const isSelected = (selectedItem as Item[]).indexOf(item as Item) !== -1;\n      let nextItems = selectedItem as Item[];\n\n      if (!isSelected) {\n        nextItems = nextItems.concat([item]).sort(indexComparator);\n        setHighlightedIndex(index);\n      } else {\n        nextItems = nextItems.filter((selected) => selected !== item);\n      }\n\n      setSelectedItem(\n        nextItems as Variant extends ListMultiSelectionVariant ? Item[] : Item,\n      );\n\n      if (onChange) {\n        onChange(\n          event,\n          nextItems as Variant extends ListMultiSelectionVariant\n            ? Item[]\n            : Item,\n        );\n      }\n    },\n    [indexComparator, onChange, selectedItem],\n  );\n\n  const handleRangeSelect = useCallback(\n    (\n      event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>,\n      index?: number,\n    ) => {\n      const currentSelection =\n        event.ctrlKey || event.metaKey ? selectedItem : ([] as Item[]);\n\n      const lastSelectedItemIndex =\n        (selectedItem as Item[]).length > 0\n          ? getItemIndex(\n              (selectedItem as Item[])[(selectedItem as Item[]).length - 1],\n            )\n          : 0;\n\n      const startRegion = Math.min(\n        index ?? lastSelectedItemIndex,\n        lastSelectedItemIndex,\n      );\n      const endRegion = Math.max(\n        index ?? lastSelectedItemIndex,\n        lastSelectedItemIndex,\n      );\n      const rangeSelection = source.slice(startRegion, endRegion + 1);\n      // concat the current selection with a new selection and remove duplicates for overlaps\n      const nextItems = [\n        ...new Set([...(currentSelection as Item[]), ...rangeSelection]),\n      ];\n      // remove text selection caused by shift clicking\n      ownerDocument(event.currentTarget).getSelection()?.removeAllRanges();\n      setSelectedItem(\n        nextItems as Variant extends ListMultiSelectionVariant ? Item[] : Item,\n      );\n\n      if (onChange) {\n        onChange(\n          event,\n          nextItems as Variant extends ListMultiSelectionVariant\n            ? Item[]\n            : Item,\n        );\n      }\n    },\n    [getItemIndex, onChange, selectedItem, source],\n  );\n\n  const handleExtendedSelect = useCallback(\n    (\n      event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>,\n      index: number | undefined,\n      item: Item,\n    ) => {\n      let nextItems = selectedItem as Item[];\n      if (event.shiftKey) {\n        handleRangeSelect(event, index);\n      } else if (\n        (selectedItem as Item[]).length === 0 ||\n        event.ctrlKey ||\n        event.metaKey\n      ) {\n        console.log(\"handleMulti\");\n        handleMultiSelect(event, index, item);\n      } else {\n        nextItems = [item] as Item[];\n        setSelectedItem(\n          nextItems as Variant extends ListMultiSelectionVariant\n            ? Item[]\n            : Item,\n        );\n\n        if (onChange) {\n          onChange(\n            event,\n            nextItems as Variant extends ListMultiSelectionVariant\n              ? Item[]\n              : Item,\n          );\n        }\n      }\n    },\n    [handleMultiSelect, handleRangeSelect, onChange, selectedItem],\n  );\n\n  const handleSelect = useCallback(\n    (\n      event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>,\n      index: number | undefined,\n      item: Item | null,\n    ) => {\n      if (item == null || (item as any).disabled) {\n        return;\n      }\n\n      if (onSelect) {\n        console.log(\"onSelect\");\n        onSelect(event, item);\n      }\n\n      if (isExtendedSelect) {\n        handleExtendedSelect(event, index, item);\n      } else if (isMultiSelect) {\n        handleMultiSelect(event, index, item);\n      } else {\n        handleSingleSelect(event, index, item);\n      }\n    },\n    [\n      handleExtendedSelect,\n      handleMultiSelect,\n      handleSingleSelect,\n      isExtendedSelect,\n      isMultiSelect,\n      onSelect,\n    ],\n  );\n\n  const saveFocusedIndex = (index: number) => {\n    setLastFocusedIndex(index);\n    return index;\n  };\n\n  const keyDownHandlers: { [key: string]: keyHandler } = {\n    ArrowUp: (event) => {\n      event.preventDefault();\n      setHighlightedIndex((prevHighlightedIndex?: number) =>\n        saveFocusedIndex(Math.max(0, (prevHighlightedIndex ?? itemCount) - 1)),\n      );\n    },\n    ArrowDown: (event) => {\n      event.preventDefault();\n      setHighlightedIndex((prevHighlightedIndex?: number) =>\n        saveFocusedIndex(\n          Math.min(itemCount - 1, (prevHighlightedIndex ?? -1) + 1),\n        ),\n      );\n    },\n    PageUp: (event) => {\n      event.preventDefault();\n      setHighlightedIndex((prevHighlightedIndex?: number) =>\n        saveFocusedIndex(\n          Math.max(\n            0,\n            (prevHighlightedIndex ?? displayedItemCount) - displayedItemCount,\n          ),\n        ),\n      );\n    },\n    PageDown: (event) => {\n      event.preventDefault();\n      setHighlightedIndex((prevHighlightedIndex?: number) =>\n        saveFocusedIndex(\n          Math.min(\n            itemCount - 1,\n            (prevHighlightedIndex ?? 0) + displayedItemCount,\n          ),\n        ),\n      );\n    },\n    Home: (event) => {\n      event.preventDefault();\n      setHighlightedIndex(saveFocusedIndex(0));\n    },\n    End: (event) => {\n      event.preventDefault();\n      setHighlightedIndex(saveFocusedIndex(itemCount - 1));\n    },\n    Enter: (event) => {\n      event.preventDefault();\n      handleSelect(\n        event,\n        highlightedIndex,\n        highlightedIndex != null && highlightedIndex > -1\n          ? getItemAtIndex(highlightedIndex)\n          : null,\n      );\n    },\n    \" \": (event) => {\n      event.preventDefault();\n      handleSelect(\n        event,\n        highlightedIndex,\n        highlightedIndex != null && highlightedIndex > -1\n          ? getItemAtIndex(highlightedIndex)\n          : null,\n      );\n    },\n    Tab: (event) => {\n      if (tabToSelect) {\n        handleSelect(\n          event,\n          highlightedIndex,\n          highlightedIndex != null && highlightedIndex > -1\n            ? getItemAtIndex(highlightedIndex)\n            : null,\n        );\n      } else {\n        setHighlightedIndex(undefined);\n      }\n    },\n  };\n\n  const handleKeyDown: keyHandler = (event) => {\n    if (isFocusVisibleRef.current) {\n      setFocusVisible(true);\n    }\n\n    const handler: keyHandler = keyDownHandlers[event.key];\n\n    if (handler) {\n      handler(event);\n    }\n\n    if (onKeyDown) {\n      onKeyDown(event);\n    }\n  };\n\n  const handleFocus = (event: FocusEvent<HTMLDivElement>) => {\n    handleFocusVisible(event);\n    if (isFocusVisibleRef.current) {\n      setFocusVisible(true);\n    }\n\n    // Work out the index to highlight\n    if (highlightedIndex === undefined) {\n      const firstSelectedItem = isMultiSelect\n        ? (selectedItem as Item[])[0]\n        : (selectedItem as Item | undefined);\n\n      setHighlightedIndex(\n        Math.max(\n          restoreLastFocus\n            ? lastFocusedIndex\n            : firstSelectedItem\n              ? getItemIndex(firstSelectedItem)\n              : -1,\n          0,\n        ),\n      );\n    }\n\n    if (onFocus) {\n      onFocus(event);\n    }\n  };\n\n  const handleBlur = (event: FocusEvent<HTMLDivElement>) => {\n    setHighlightedIndex(undefined);\n    handleBlurVisible();\n    if (!isFocusVisibleRef.current) {\n      setFocusVisible(false);\n    }\n\n    if (onBlur) {\n      onBlur(event);\n    }\n  };\n\n  const handleMouseDown = (event: MouseEvent<HTMLDivElement>) => {\n    if (disableMouseDown) {\n      event.preventDefault();\n    } else if (onMouseDown) {\n      onMouseDown(event);\n    }\n  };\n\n  const handleMouseLeave = (event: MouseEvent<HTMLDivElement>) => {\n    if (focusVisible && id) {\n      // Get the root node of the component if we have access to it otherwise default to current document\n      const rootNode = (\n        rootRef.current || ownerDocument(event.currentTarget)\n      ).getRootNode();\n\n      const listNode = (rootNode as Document).getElementById(id);\n\n      // Safety check as `mouseleave` could have been accidentally triggered by an opening tooltip\n      // when you use keyboard to navigate, hence the focusVisible check earlier\n      if (listNode?.contains(event.target as Node)) {\n        setHighlightedIndex(undefined);\n      }\n    } else {\n      setHighlightedIndex(undefined);\n    }\n\n    if (onMouseLeave) {\n      onMouseLeave(event);\n    }\n  };\n\n  const eventHandlers = {\n    onFocus: handleFocus,\n    onBlur: handleBlur,\n    onKeyDown: handleKeyDown,\n    onMouseDown: handleMouseDown,\n    onMouseLeave: handleMouseLeave,\n  };\n\n  const ariaProps: listBoxAriaProps = {\n    role: \"listbox\",\n    \"aria-activedescendant\":\n      highlightedIndex !== undefined && highlightedIndex >= 0\n        ? getItemId(highlightedIndex)\n        : undefined,\n  };\n\n  if (isMultiSelect) {\n    ariaProps[\"aria-multiselectable\"] = true;\n  }\n\n  return {\n    focusedRef: useForkRef(rootRef, focusVisibleRef),\n    state: {\n      id,\n      focusVisible,\n      selectedItem,\n      highlightedIndex,\n      isDeselectable,\n      isMultiSelect,\n      isDisabled: disabled,\n    },\n    helpers: {\n      setFocusVisible,\n      setSelectedItem,\n      setHighlightedIndex,\n      keyDownHandlers,\n      handleSelect,\n    },\n    listProps: {\n      id,\n      source,\n      itemCount,\n      disableMouseDown,\n      displayedItemCount,\n      getItemAtIndex,\n      getItemIndex,\n      getItemId,\n      disabled,\n      ...ariaProps,\n      ...restProps,\n      ...(disabled ? {} : eventHandlers),\n    },\n  };\n}\n\nconst validateProps = <Item, Variant extends ListSelectionVariant>(\n  props: ListProps<Item, Variant>,\n) => {\n  if (process.env.NODE_ENV !== \"production\") {\n    const { source, itemCount, getItemIndex, getItemAtIndex } = props;\n\n    const hasIndexer =\n      typeof getItemIndex === \"function\" &&\n      typeof getItemAtIndex === \"function\";\n\n    const hasNoIndexer =\n      getItemIndex === undefined && getItemAtIndex === undefined;\n\n    const sourceNotArray = !Array.isArray(source);\n\n    useEffect(() => {\n      if (sourceNotArray) {\n        console.error(\"`source` for useList must be an array.\");\n      }\n    }, [sourceNotArray]);\n\n    useEffect(() => {\n      if (!hasNoIndexer && !hasIndexer) {\n        console.error(\n          \"useList needs to have both `getItemIndex` and `getItemAtIndex`.\",\n        );\n      }\n\n      if (!hasNoIndexer && itemCount === undefined) {\n        console.error(\n          \"useList needs to have `itemCount` if an indexer is used.\",\n        );\n      }\n    }, [hasIndexer, hasNoIndexer, itemCount]);\n  }\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useList.js","sources":["../src/list-deprecated/useList.ts"],"sourcesContent":["import {\n  ownerDocument,\n  useControlled,\n  useForkRef,\n  useId,\n  useIsFocusVisible,\n} from \"@salt-ds/core\";\n\nimport {\n  type AriaAttributes,\n  type Dispatch,\n  type FocusEvent,\n  type KeyboardEvent,\n  type KeyboardEventHandler,\n  type MouseEvent,\n  type Ref,\n  type SetStateAction,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport type {\n  ListMultiSelectionVariant,\n  ListProps,\n  ListSelectionVariant,\n} from \"./ListProps\";\n\ntype keyHandler = (event: KeyboardEvent<HTMLInputElement>) => void;\n\ninterface listBoxAriaProps\n  extends Pick<\n    AriaAttributes,\n    \"aria-activedescendant\" | \"aria-multiselectable\"\n  > {\n  role: string; // We will default it to be 'listbox', but users can override\n}\nexport interface ListState<\n  Item = string,\n  Variant extends ListSelectionVariant = \"default\",\n> {\n  id?: string;\n  focusVisible: boolean;\n  selectedItem?: Variant extends ListMultiSelectionVariant ? Array<Item> : Item;\n  highlightedIndex?: number;\n  isDeselectable: boolean;\n  isMultiSelect: boolean;\n  isDisabled: boolean;\n}\n\nexport interface ListHelpers<\n  Item = string,\n  Variant extends ListSelectionVariant = \"default\",\n> {\n  setFocusVisible: (visible: boolean) => void;\n  setSelectedItem: Dispatch<\n    SetStateAction<\n      (Variant extends ListMultiSelectionVariant ? Item[] : Item) | undefined\n    >\n  >;\n  setHighlightedIndex: (highlightedIndex?: number) => void;\n  handleSelect: (\n    event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>,\n    index: number | undefined,\n    item: Item,\n  ) => void;\n  keyDownHandlers: { [key: string]: KeyboardEventHandler };\n  // TODO: Form Field\n}\n\nexport function useList<Item, Variant extends ListSelectionVariant>(\n  props: ListProps<Item, Variant> = {},\n): {\n  focusedRef: Ref<any>;\n  listProps: Partial<ListProps<Item, Variant>> & listBoxAriaProps;\n  state: ListState<Item, Variant>;\n  helpers: ListHelpers<Item, Variant>;\n} {\n  validateProps(props);\n\n  const generatedId = useId(props.id);\n\n  const {\n    id = generatedId,\n    source = [],\n    itemCount = source.length,\n    getItemId = (index) => `${id}-item-${index}`,\n    getItemAtIndex: getItemAtIndexProp,\n    getItemIndex: getItemIndexProp,\n    displayedItemCount = 10,\n    initialSelectedItem,\n    selectionVariant,\n    disabled = false,\n    onBlur,\n    onChange,\n    onFocus,\n    onKeyDown,\n    onMouseDown,\n    onMouseLeave,\n    onSelect,\n    disableMouseDown,\n    restoreLastFocus,\n    highlightedIndex: highlightedIndexProp,\n    selectedItem: selectedItemProp,\n    tabToSelect,\n    ...restProps\n  } = props;\n\n  const {\n    isFocusVisibleRef,\n    onFocus: handleFocusVisible,\n    onBlur: handleBlurVisible,\n    ref: focusVisibleRef,\n  } = useIsFocusVisible();\n\n  const { current: isDeselectable } = useRef(\n    selectionVariant === \"deselectable\",\n  );\n  const { current: isMultiSelect } = useRef(\n    selectionVariant === \"multiple\" ||\n      selectionVariant === \"extended\" ||\n      Array.isArray(initialSelectedItem) ||\n      Array.isArray(selectedItemProp),\n  );\n\n  const { current: isExtendedSelect } = useRef(selectionVariant === \"extended\");\n\n  let getItemIndex = useCallback(\n    (item: Item) => source.indexOf(item),\n    [source],\n  );\n  let getItemAtIndex = useCallback((index: number) => source[index], [source]);\n\n  const indexComparator = useCallback(\n    (a: Item, b: Item) => getItemIndex(a) - getItemIndex(b),\n    [getItemIndex],\n  );\n\n  // Only use getItemIndex and getItemAtIndex if both are defined; otherwise keep the defaults\n  if (\n    typeof getItemIndexProp === \"function\" &&\n    typeof getItemAtIndexProp === \"function\"\n  ) {\n    getItemIndex = getItemIndexProp;\n    getItemAtIndex = getItemAtIndexProp;\n  }\n\n  const rootRef = useRef();\n  const [focusVisible, setFocusVisible] = useState(false);\n  const [lastFocusedIndex, setLastFocusedIndex] = useState(-1);\n\n  const [selectedItem, setSelectedItem] = useControlled<\n    undefined | (Variant extends ListMultiSelectionVariant ? Item[] : Item)\n  >({\n    controlled: selectedItemProp,\n    default:\n      initialSelectedItem ??\n      ((isMultiSelect\n        ? []\n        : null) as unknown as Variant extends ListMultiSelectionVariant\n        ? Item[]\n        : Item),\n    name: \"useList\",\n    state: \"selectedItem\",\n  });\n\n  const [highlightedIndex, setHighlightedIndex] = useControlled<\n    number | undefined\n  >({\n    controlled: highlightedIndexProp,\n    default: undefined,\n    name: \"useList\",\n    state: \"highlightedIndex\",\n  });\n\n  const handleSingleSelect = useCallback(\n    (\n      event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>,\n      index: number | undefined,\n      item: Item,\n    ) => {\n      const isSelected = item === selectedItem;\n      let nextItem: Item | null;\n\n      if (isSelected && !isDeselectable) {\n        return;\n      }\n\n      if (!isSelected) {\n        nextItem = item;\n        setHighlightedIndex(index);\n      } else {\n        nextItem = null;\n      }\n\n      setSelectedItem(\n        nextItem as Variant extends ListMultiSelectionVariant ? Item[] : Item,\n      );\n\n      if (onChange) {\n        onChange(\n          event,\n          nextItem as Variant extends ListMultiSelectionVariant ? Item[] : Item,\n        );\n      }\n    },\n    [isDeselectable, onChange, selectedItem],\n  );\n\n  const handleMultiSelect = useCallback(\n    (\n      event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>,\n      index: number | undefined,\n      item: Item,\n    ) => {\n      const isSelected = (selectedItem as Item[]).indexOf(item as Item) !== -1;\n      let nextItems = selectedItem as Item[];\n\n      if (!isSelected) {\n        nextItems = nextItems.concat([item]).sort(indexComparator);\n        setHighlightedIndex(index);\n      } else {\n        nextItems = nextItems.filter((selected) => selected !== item);\n      }\n\n      setSelectedItem(\n        nextItems as Variant extends ListMultiSelectionVariant ? Item[] : Item,\n      );\n\n      if (onChange) {\n        onChange(\n          event,\n          nextItems as Variant extends ListMultiSelectionVariant\n            ? Item[]\n            : Item,\n        );\n      }\n    },\n    [indexComparator, onChange, selectedItem],\n  );\n\n  const handleRangeSelect = useCallback(\n    (\n      event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>,\n      index?: number,\n    ) => {\n      const currentSelection =\n        event.ctrlKey || event.metaKey ? selectedItem : ([] as Item[]);\n\n      const lastSelectedItemIndex =\n        (selectedItem as Item[]).length > 0\n          ? getItemIndex(\n              (selectedItem as Item[])[(selectedItem as Item[]).length - 1],\n            )\n          : 0;\n\n      const startRegion = Math.min(\n        index ?? lastSelectedItemIndex,\n        lastSelectedItemIndex,\n      );\n      const endRegion = Math.max(\n        index ?? lastSelectedItemIndex,\n        lastSelectedItemIndex,\n      );\n      const rangeSelection = source.slice(startRegion, endRegion + 1);\n      // concat the current selection with a new selection and remove duplicates for overlaps\n      const nextItems = [\n        ...new Set([...(currentSelection as Item[]), ...rangeSelection]),\n      ];\n      // remove text selection caused by shift clicking\n      ownerDocument(event.currentTarget).getSelection()?.removeAllRanges();\n      setSelectedItem(\n        nextItems as Variant extends ListMultiSelectionVariant ? Item[] : Item,\n      );\n\n      if (onChange) {\n        onChange(\n          event,\n          nextItems as Variant extends ListMultiSelectionVariant\n            ? Item[]\n            : Item,\n        );\n      }\n    },\n    [getItemIndex, onChange, selectedItem, source],\n  );\n\n  const handleExtendedSelect = useCallback(\n    (\n      event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>,\n      index: number | undefined,\n      item: Item,\n    ) => {\n      let nextItems = selectedItem as Item[];\n      if (event.shiftKey) {\n        handleRangeSelect(event, index);\n      } else if (\n        (selectedItem as Item[]).length === 0 ||\n        event.ctrlKey ||\n        event.metaKey\n      ) {\n        console.log(\"handleMulti\");\n        handleMultiSelect(event, index, item);\n      } else {\n        nextItems = [item] as Item[];\n        setSelectedItem(\n          nextItems as Variant extends ListMultiSelectionVariant\n            ? Item[]\n            : Item,\n        );\n\n        if (onChange) {\n          onChange(\n            event,\n            nextItems as Variant extends ListMultiSelectionVariant\n              ? Item[]\n              : Item,\n          );\n        }\n      }\n    },\n    [handleMultiSelect, handleRangeSelect, onChange, selectedItem],\n  );\n\n  const handleSelect = useCallback(\n    (\n      event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>,\n      index: number | undefined,\n      item: Item | null,\n    ) => {\n      if (item == null || (item as any).disabled) {\n        return;\n      }\n\n      if (onSelect) {\n        console.log(\"onSelect\");\n        onSelect(event, item);\n      }\n\n      if (isExtendedSelect) {\n        handleExtendedSelect(event, index, item);\n      } else if (isMultiSelect) {\n        handleMultiSelect(event, index, item);\n      } else {\n        handleSingleSelect(event, index, item);\n      }\n    },\n    [\n      handleExtendedSelect,\n      handleMultiSelect,\n      handleSingleSelect,\n      isExtendedSelect,\n      isMultiSelect,\n      onSelect,\n    ],\n  );\n\n  const saveFocusedIndex = (index: number) => {\n    setLastFocusedIndex(index);\n    return index;\n  };\n\n  const keyDownHandlers: { [key: string]: keyHandler } = {\n    ArrowUp: (event) => {\n      event.preventDefault();\n      setHighlightedIndex((prevHighlightedIndex?: number) =>\n        saveFocusedIndex(Math.max(0, (prevHighlightedIndex ?? itemCount) - 1)),\n      );\n    },\n    ArrowDown: (event) => {\n      event.preventDefault();\n      setHighlightedIndex((prevHighlightedIndex?: number) =>\n        saveFocusedIndex(\n          Math.min(itemCount - 1, (prevHighlightedIndex ?? -1) + 1),\n        ),\n      );\n    },\n    PageUp: (event) => {\n      event.preventDefault();\n      setHighlightedIndex((prevHighlightedIndex?: number) =>\n        saveFocusedIndex(\n          Math.max(\n            0,\n            (prevHighlightedIndex ?? displayedItemCount) - displayedItemCount,\n          ),\n        ),\n      );\n    },\n    PageDown: (event) => {\n      event.preventDefault();\n      setHighlightedIndex((prevHighlightedIndex?: number) =>\n        saveFocusedIndex(\n          Math.min(\n            itemCount - 1,\n            (prevHighlightedIndex ?? 0) + displayedItemCount,\n          ),\n        ),\n      );\n    },\n    Home: (event) => {\n      event.preventDefault();\n      setHighlightedIndex(saveFocusedIndex(0));\n    },\n    End: (event) => {\n      event.preventDefault();\n      setHighlightedIndex(saveFocusedIndex(itemCount - 1));\n    },\n    Enter: (event) => {\n      event.preventDefault();\n      handleSelect(\n        event,\n        highlightedIndex,\n        highlightedIndex != null && highlightedIndex > -1\n          ? getItemAtIndex(highlightedIndex)\n          : null,\n      );\n    },\n    \" \": (event) => {\n      event.preventDefault();\n      handleSelect(\n        event,\n        highlightedIndex,\n        highlightedIndex != null && highlightedIndex > -1\n          ? getItemAtIndex(highlightedIndex)\n          : null,\n      );\n    },\n    Tab: (event) => {\n      if (tabToSelect) {\n        handleSelect(\n          event,\n          highlightedIndex,\n          highlightedIndex != null && highlightedIndex > -1\n            ? getItemAtIndex(highlightedIndex)\n            : null,\n        );\n      } else {\n        setHighlightedIndex(undefined);\n      }\n    },\n  };\n\n  const handleKeyDown: keyHandler = (event) => {\n    if (isFocusVisibleRef.current) {\n      setFocusVisible(true);\n    }\n\n    const handler: keyHandler = keyDownHandlers[event.key];\n\n    if (handler) {\n      handler(event);\n    }\n\n    if (onKeyDown) {\n      onKeyDown(event);\n    }\n  };\n\n  const handleFocus = (event: FocusEvent<HTMLDivElement>) => {\n    handleFocusVisible(event);\n    if (isFocusVisibleRef.current) {\n      setFocusVisible(true);\n    }\n\n    // Work out the index to highlight\n    if (highlightedIndex === undefined) {\n      const firstSelectedItem = isMultiSelect\n        ? (selectedItem as Item[])[0]\n        : (selectedItem as Item | undefined);\n\n      setHighlightedIndex(\n        Math.max(\n          restoreLastFocus\n            ? lastFocusedIndex\n            : firstSelectedItem\n              ? getItemIndex(firstSelectedItem)\n              : -1,\n          0,\n        ),\n      );\n    }\n\n    if (onFocus) {\n      onFocus(event);\n    }\n  };\n\n  const handleBlur = (event: FocusEvent<HTMLDivElement>) => {\n    setHighlightedIndex(undefined);\n    handleBlurVisible();\n    if (!isFocusVisibleRef.current) {\n      setFocusVisible(false);\n    }\n\n    if (onBlur) {\n      onBlur(event);\n    }\n  };\n\n  const handleMouseDown = (event: MouseEvent<HTMLDivElement>) => {\n    if (disableMouseDown) {\n      event.preventDefault();\n    } else if (onMouseDown) {\n      onMouseDown(event);\n    }\n  };\n\n  const handleMouseLeave = (event: MouseEvent<HTMLDivElement>) => {\n    if (focusVisible && id) {\n      // Get the root node of the component if we have access to it otherwise default to current document\n      const rootNode = (\n        rootRef.current || ownerDocument(event.currentTarget)\n      ).getRootNode();\n\n      const listNode = (rootNode as Document).getElementById(id);\n\n      // Safety check as `mouseleave` could have been accidentally triggered by an opening tooltip\n      // when you use keyboard to navigate, hence the focusVisible check earlier\n      if (listNode?.contains(event.target as Node)) {\n        setHighlightedIndex(undefined);\n      }\n    } else {\n      setHighlightedIndex(undefined);\n    }\n\n    if (onMouseLeave) {\n      onMouseLeave(event);\n    }\n  };\n\n  const eventHandlers = {\n    onFocus: handleFocus,\n    onBlur: handleBlur,\n    onKeyDown: handleKeyDown,\n    onMouseDown: handleMouseDown,\n    onMouseLeave: handleMouseLeave,\n  };\n\n  const ariaProps: listBoxAriaProps = {\n    role: \"listbox\",\n    \"aria-activedescendant\":\n      highlightedIndex !== undefined && highlightedIndex >= 0\n        ? getItemId(highlightedIndex)\n        : undefined,\n  };\n\n  if (isMultiSelect) {\n    ariaProps[\"aria-multiselectable\"] = true;\n  }\n\n  return {\n    focusedRef: useForkRef(rootRef, focusVisibleRef),\n    state: {\n      id,\n      focusVisible,\n      selectedItem,\n      highlightedIndex,\n      isDeselectable,\n      isMultiSelect,\n      isDisabled: disabled,\n    },\n    helpers: {\n      setFocusVisible,\n      setSelectedItem,\n      setHighlightedIndex,\n      keyDownHandlers,\n      handleSelect,\n    },\n    listProps: {\n      id,\n      source,\n      itemCount,\n      disableMouseDown,\n      displayedItemCount,\n      getItemAtIndex,\n      getItemIndex,\n      getItemId,\n      disabled,\n      ...ariaProps,\n      ...restProps,\n      ...(disabled ? {} : eventHandlers),\n    },\n  };\n}\n\nconst validateProps = <Item, Variant extends ListSelectionVariant>(\n  props: ListProps<Item, Variant>,\n) => {\n  if (process.env.NODE_ENV !== \"production\") {\n    const { source, itemCount, getItemIndex, getItemAtIndex } = props;\n\n    const hasIndexer =\n      typeof getItemIndex === \"function\" &&\n      typeof getItemAtIndex === \"function\";\n\n    const hasNoIndexer =\n      getItemIndex === undefined && getItemAtIndex === undefined;\n\n    const sourceNotArray = !Array.isArray(source);\n\n    // biome-ignore lint/correctness/useHookAtTopLevel: NODE_ENV is invariant at runtime.\n    useEffect(() => {\n      if (sourceNotArray) {\n        console.error(\"`source` for useList must be an array.\");\n      }\n    }, [sourceNotArray]);\n\n    // biome-ignore lint/correctness/useHookAtTopLevel: NODE_ENV is invariant at runtime.\n    useEffect(() => {\n      if (!hasNoIndexer && !hasIndexer) {\n        console.error(\n          \"useList needs to have both `getItemIndex` and `getItemAtIndex`.\",\n        );\n      }\n\n      if (!hasNoIndexer && itemCount === undefined) {\n        console.error(\n          \"useList needs to have `itemCount` if an indexer is used.\",\n        );\n      }\n    }, [hasIndexer, hasNoIndexer, itemCount]);\n  }\n};\n"],"names":[],"mappings":"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"}

package/dist-es/list-next/ListItemNext.css.js

@@ -1,4 +1,4 @@
-var css_248z = "/* Default variables applied to the root element */\n.saltListItemNext {\n  --listNext-item-text-color: var(--salt-content-primary-foreground);\n  --listNext-item-background: none;\n}\n\n.saltListItemNext {\n  color: var(--listNext-item-text-color);\n  background: var(--listNext-item-background);\n  height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  padding-left: var(--salt-spacing-100);\n  padding-right: var(--salt-spacing-100);\n  display: flex;\n  gap: var(--salt-size-unit);\n  position: relative;\n  align-items: center;\n  white-space: nowrap;\n  margin-top: var(--salt-size-fixed-100);\n  margin-bottom: var(--salt-size-fixed-100);\n  border: var(--salt-focused-outlineWidth) var(--salt-focused-outlineStyle) transparent;\n}\n\n/* Class applied to list item on focus using keyboard navigation only */\n.saltListItemNext-focused {\n  border: var(--salt-focused-outline);\n}\n\n/* Active list item on focus using keyboard navigation  */\n.saltListItemNext-highlighted:not([aria-disabled=\"true\"]) {\n  --listNext-item-background: var(--salt-selectable-background-hover);\n  cursor: var(--salt-cursor-hover);\n}\n\n.saltListItemNext[aria-selected=\"true\"] {\n  outline: var(--salt-size-fixed-100) var(--salt-container-borderStyle) var(--salt-selectable-borderColor-selected);\n  --listNext-item-background: var(--salt-selectable-background-selected);\n  --saltIcon-color: var(--salt-selectable-foreground-selected);\n}\n\n/* Style applied to disabled items */\n.saltListItemNext[aria-disabled=\"true\"] {\n  --listNext-item-text-color: var(--salt-content-primary-foreground-disabled);\n  cursor: var(--salt-cursor-disabled);\n}\n.saltListItemNext[aria-disabled=\"true\"] .saltText {\n  color: var(--listNext-item-text-color);\n}\n\n/* disabled list item when selected */\n.saltListItemNext[aria-disabled=\"true\"][aria-selected=\"true\"] {\n  outline: var(--salt-size-fixed-100) var(--salt-container-borderStyle) var(--salt-selectable-borderColor-selectedDisabled);\n  --listNext-item-background: var(--salt-selectable-background-selectedDisabled);\n}\n";
+var css_248z = "/* Default variables applied to the root element */\n.saltListItemNext {\n  --listNext-item-text-color: var(--salt-content-primary-foreground);\n  --listNext-item-background: none;\n}\n\n.saltListItemNext {\n  color: var(--listNext-item-text-color);\n  background: var(--listNext-item-background);\n  height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  padding-left: var(--salt-spacing-100);\n  padding-right: var(--salt-spacing-100);\n  display: flex;\n  gap: var(--salt-size-unit);\n  position: relative;\n  align-items: center;\n  white-space: nowrap;\n  margin-top: var(--salt-size-fixed-100);\n  margin-bottom: var(--salt-size-fixed-100);\n  border: var(--salt-focused-outlineWidth) var(--salt-focused-outlineStyle) transparent;\n}\n\n/* Class applied to list item on focus using keyboard navigation only */\n.saltListItemNext-focused {\n  border: var(--salt-focused-outline);\n}\n\n/* Active list item on focus using keyboard navigation  */\n.saltListItemNext-highlighted:not([aria-disabled=\"true\"]) {\n  --listNext-item-background: var(--salt-selectable-background-hover);\n  cursor: var(--salt-cursor-hover);\n}\n\n.saltListItemNext[aria-selected=\"true\"] {\n  outline: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-borderColor-selected);\n  --listNext-item-background: var(--salt-selectable-background-selected);\n  --saltIcon-color: var(--salt-selectable-foreground-selected);\n}\n\n/* Style applied to disabled items */\n.saltListItemNext[aria-disabled=\"true\"] {\n  --listNext-item-text-color: var(--salt-content-primary-foreground-disabled);\n  cursor: var(--salt-cursor-disabled);\n}\n.saltListItemNext[aria-disabled=\"true\"] .saltText {\n  color: var(--listNext-item-text-color);\n}\n\n/* disabled list item when selected */\n.saltListItemNext[aria-disabled=\"true\"][aria-selected=\"true\"] {\n  outline: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-borderColor-selectedDisabled);\n  --listNext-item-background: var(--salt-selectable-background-selectedDisabled);\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=ListItemNext.css.js.map

package/dist-es/list-next/ListItemNext.js

@@ -1,9 +1,9 @@
 import { jsx } from 'react/jsx-runtime';
 import { makePrefixer, useIdMemo } from '@salt-ds/core';
-import { clsx } from 'clsx';
-import { forwardRef } from 'react';
 import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
+import { clsx } from 'clsx';
+import { forwardRef } from 'react';
 import css_248z from './ListItemNext.css.js';
 import { useListItem } from './ListNextContext.js';
 

package/dist-es/list-next/ListItemNext.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemNext.js","sources":["../src/list-next/ListItemNext.tsx"],"sourcesContent":["import { makePrefixer, useIdMemo } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { type HTMLAttributes, type MouseEvent, forwardRef } from \"react\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport listItemNextCss from \"./ListItemNext.css\";\nimport { useListItem } from \"./ListNextContext\";\n\nconst withBaseName = makePrefixer(\"saltListItemNext\");\n\nexport interface ListItemNextProps extends HTMLAttributes<HTMLLIElement> {\n  /**\n   * If true, the particular list item in list will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * List item id.\n   */\n  id?: string;\n  /**\n   * List item value.\n   */\n  value: string;\n}\n\nexport const ListItemNext = forwardRef<HTMLLIElement, ListItemNextProps>(\n  function ListItemNext(\n    {\n      children,\n      className,\n      disabled: disabledProp,\n      id: idProp,\n      value,\n      onClick,\n      ...props\n    },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-list-item-next\",\n      css: listItemNextCss,\n      window: targetWindow,\n    });\n    const id = useIdMemo(idProp);\n\n    const listContext = useListItem();\n    if (!listContext) return null;\n\n    const {\n      id: contextId,\n      disabled: contextDisabled,\n      select,\n      isSelected,\n      isFocused,\n      highlight,\n      isHighlighted,\n    } = listContext;\n\n    const itemId = `${contextId || \"listNext\"}--${id}`;\n    const disabled = disabledProp || contextDisabled;\n    const selected = isSelected(value);\n    const focused = isFocused(value);\n    const highlighted = isHighlighted(value);\n\n    const handleClick = (event: MouseEvent<HTMLLIElement>) => {\n      if (!disabled) {\n        select(event);\n        onClick?.(event);\n      }\n    };\n\n    const handleMouseMove = (event: MouseEvent<HTMLLIElement>) => {\n      if (!highlighted) {\n        highlight(event);\n      }\n    };\n\n    return (\n      <li\n        ref={ref}\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"disabled\")]: disabled,\n            [withBaseName(\"highlighted\")]: highlighted,\n            [withBaseName(\"focused\")]: focused,\n          },\n          className,\n        )}\n        role=\"option\"\n        aria-disabled={disabled || undefined}\n        aria-selected={selected || undefined}\n        id={itemId}\n        data-value={value}\n        onClick={handleClick}\n        onMouseMove={handleMouseMove}\n        {...props}\n      >\n        {children}\n      </li>\n    );\n  },\n);\n"],"names":["ListItemNext","listItemNextCss"],"mappings":";;;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,kBAAkB,CAAA;AAiB7C,MAAM,YAAe,GAAA,UAAA;AAAA,EAC1B,SAASA,aACP,CAAA;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAU,EAAA,YAAA;AAAA,IACV,EAAI,EAAA,MAAA;AAAA,IACJ,KAAA;AAAA,IACA,OAAA;AAAA,IACA,GAAG;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,qBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AACD,IAAM,MAAA,EAAA,GAAK,UAAU,MAAM,CAAA;AAE3B,IAAA,MAAM,cAAc,WAAY,EAAA;AAChC,IAAI,IAAA,CAAC,aAAoB,OAAA,IAAA;AAEzB,IAAM,MAAA;AAAA,MACJ,EAAI,EAAA,SAAA;AAAA,MACJ,QAAU,EAAA,eAAA;AAAA,MACV,MAAA;AAAA,MACA,UAAA;AAAA,MACA,SAAA;AAAA,MACA,SAAA;AAAA,MACA;AAAA,KACE,GAAA,WAAA;AAEJ,IAAA,MAAM,MAAS,GAAA,CAAA,EAAG,SAAa,IAAA,UAAU,KAAK,EAAE,CAAA,CAAA;AAChD,IAAA,MAAM,WAAW,YAAgB,IAAA,eAAA;AACjC,IAAM,MAAA,QAAA,GAAW,WAAW,KAAK,CAAA;AACjC,IAAM,MAAA,OAAA,GAAU,UAAU,KAAK,CAAA;AAC/B,IAAM,MAAA,WAAA,GAAc,cAAc,KAAK,CAAA;AAEvC,IAAM,MAAA,WAAA,GAAc,CAAC,KAAqC,KAAA;AACxD,MAAA,IAAI,CAAC,QAAU,EAAA;AACb,QAAA,MAAA,CAAO,KAAK,CAAA;AACZ,QAAU,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAA,KAAA,CAAA;AAAA;AACZ,KACF;AAEA,IAAM,MAAA,eAAA,GAAkB,CAAC,KAAqC,KAAA;AAC5D,MAAA,IAAI,CAAC,WAAa,EAAA;AAChB,QAAA,SAAA,CAAU,KAAK,CAAA;AAAA;AACjB,KACF;AAEA,IACE,uBAAA,GAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAW,EAAA,IAAA;AAAA,UACT,YAAa,EAAA;AAAA,UACb;AAAA,YACE,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,QAAA;AAAA,YAC5B,CAAC,YAAA,CAAa,aAAa,CAAC,GAAG,WAAA;AAAA,YAC/B,CAAC,YAAA,CAAa,SAAS,CAAC,GAAG;AAAA,WAC7B;AAAA,UACA;AAAA,SACF;AAAA,QACA,IAAK,EAAA,QAAA;AAAA,QACL,iBAAe,QAAY,IAAA,MAAA;AAAA,QAC3B,iBAAe,QAAY,IAAA,MAAA;AAAA,QAC3B,EAAI,EAAA,MAAA;AAAA,QACJ,YAAY,EAAA,KAAA;AAAA,QACZ,OAAS,EAAA,WAAA;AAAA,QACT,WAAa,EAAA,eAAA;AAAA,QACZ,GAAG,KAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA;AAGN;;;;"}
+{"version":3,"file":"ListItemNext.js","sources":["../src/list-next/ListItemNext.tsx"],"sourcesContent":["import { makePrefixer, useIdMemo } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes, type MouseEvent } from \"react\";\nimport listItemNextCss from \"./ListItemNext.css\";\nimport { useListItem } from \"./ListNextContext\";\n\nconst withBaseName = makePrefixer(\"saltListItemNext\");\n\nexport interface ListItemNextProps extends HTMLAttributes<HTMLLIElement> {\n  /**\n   * If true, the particular list item in list will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * List item id.\n   */\n  id?: string;\n  /**\n   * List item value.\n   */\n  value: string;\n}\n\nexport const ListItemNext = forwardRef<HTMLLIElement, ListItemNextProps>(\n  function ListItemNext(\n    {\n      children,\n      className,\n      disabled: disabledProp,\n      id: idProp,\n      value,\n      onClick,\n      ...props\n    },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-list-item-next\",\n      css: listItemNextCss,\n      window: targetWindow,\n    });\n    const id = useIdMemo(idProp);\n\n    const listContext = useListItem();\n    if (!listContext) return null;\n\n    const {\n      id: contextId,\n      disabled: contextDisabled,\n      select,\n      isSelected,\n      isFocused,\n      highlight,\n      isHighlighted,\n    } = listContext;\n\n    const itemId = `${contextId || \"listNext\"}--${id}`;\n    const disabled = disabledProp || contextDisabled;\n    const selected = isSelected(value);\n    const focused = isFocused(value);\n    const highlighted = isHighlighted(value);\n\n    const handleClick = (event: MouseEvent<HTMLLIElement>) => {\n      if (!disabled) {\n        select(event);\n        onClick?.(event);\n      }\n    };\n\n    const handleMouseMove = (event: MouseEvent<HTMLLIElement>) => {\n      if (!highlighted) {\n        highlight(event);\n      }\n    };\n\n    return (\n      <li\n        ref={ref}\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"disabled\")]: disabled,\n            [withBaseName(\"highlighted\")]: highlighted,\n            [withBaseName(\"focused\")]: focused,\n          },\n          className,\n        )}\n        role=\"option\"\n        aria-disabled={disabled || undefined}\n        aria-selected={selected || undefined}\n        id={itemId}\n        data-value={value}\n        onClick={handleClick}\n        onMouseMove={handleMouseMove}\n        {...props}\n      >\n        {children}\n      </li>\n    );\n  },\n);\n"],"names":["ListItemNext","listItemNextCss"],"mappings":";;;;;;;;;AAQA,MAAM,YAAA,GAAe,aAAa,kBAAkB,CAAA;AAiB7C,MAAM,YAAe,GAAA,UAAA;AAAA,EAC1B,SAASA,aACP,CAAA;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAU,EAAA,YAAA;AAAA,IACV,EAAI,EAAA,MAAA;AAAA,IACJ,KAAA;AAAA,IACA,OAAA;AAAA,IACA,GAAG;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,qBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AACD,IAAM,MAAA,EAAA,GAAK,UAAU,MAAM,CAAA;AAE3B,IAAA,MAAM,cAAc,WAAY,EAAA;AAChC,IAAI,IAAA,CAAC,aAAoB,OAAA,IAAA;AAEzB,IAAM,MAAA;AAAA,MACJ,EAAI,EAAA,SAAA;AAAA,MACJ,QAAU,EAAA,eAAA;AAAA,MACV,MAAA;AAAA,MACA,UAAA;AAAA,MACA,SAAA;AAAA,MACA,SAAA;AAAA,MACA;AAAA,KACE,GAAA,WAAA;AAEJ,IAAA,MAAM,MAAS,GAAA,CAAA,EAAG,SAAa,IAAA,UAAU,KAAK,EAAE,CAAA,CAAA;AAChD,IAAA,MAAM,WAAW,YAAgB,IAAA,eAAA;AACjC,IAAM,MAAA,QAAA,GAAW,WAAW,KAAK,CAAA;AACjC,IAAM,MAAA,OAAA,GAAU,UAAU,KAAK,CAAA;AAC/B,IAAM,MAAA,WAAA,GAAc,cAAc,KAAK,CAAA;AAEvC,IAAM,MAAA,WAAA,GAAc,CAAC,KAAqC,KAAA;AACxD,MAAA,IAAI,CAAC,QAAU,EAAA;AACb,QAAA,MAAA,CAAO,KAAK,CAAA;AACZ,QAAU,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAA,KAAA,CAAA;AAAA;AACZ,KACF;AAEA,IAAM,MAAA,eAAA,GAAkB,CAAC,KAAqC,KAAA;AAC5D,MAAA,IAAI,CAAC,WAAa,EAAA;AAChB,QAAA,SAAA,CAAU,KAAK,CAAA;AAAA;AACjB,KACF;AAEA,IACE,uBAAA,GAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAW,EAAA,IAAA;AAAA,UACT,YAAa,EAAA;AAAA,UACb;AAAA,YACE,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,QAAA;AAAA,YAC5B,CAAC,YAAA,CAAa,aAAa,CAAC,GAAG,WAAA;AAAA,YAC/B,CAAC,YAAA,CAAa,SAAS,CAAC,GAAG;AAAA,WAC7B;AAAA,UACA;AAAA,SACF;AAAA,QACA,IAAK,EAAA,QAAA;AAAA,QACL,iBAAe,QAAY,IAAA,MAAA;AAAA,QAC3B,iBAAe,QAAY,IAAA,MAAA;AAAA,QAC3B,EAAI,EAAA,MAAA;AAAA,QACJ,YAAY,EAAA,KAAA;AAAA,QACZ,OAAS,EAAA,WAAA;AAAA,QACT,WAAa,EAAA,eAAA;AAAA,QACZ,GAAG,KAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA;AAGN;;;;"}

package/dist-es/list-next/ListNext.css.js

@@ -1,4 +1,4 @@
-var css_248z = "/* Style applied to the root element */\n.saltListNext {\n  margin: 0;\n  background: var(--salt-container-primary-background);\n  border-color: var(--salt-container-primary-borderColor);\n  border-style: var(--salt-container-borderStyle);\n  border-width: var(--salt-size-fixed-100);\n  height: 100%;\n  outline: none;\n  overflow-y: auto;\n  overflow-x: hidden;\n  position: relative;\n  padding-inline-start: 0;\n  box-sizing: content-box;\n\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-fontSize);\n  font-weight: var(--salt-text-fontWeight);\n  line-height: var(--salt-text-lineHeight);\n}\n";
+var css_248z = "/* Style applied to the root element */\n.saltListNext {\n  margin: 0;\n  background: var(--salt-container-primary-background);\n  border-color: var(--salt-container-primary-borderColor);\n  border-style: var(--salt-borderStyle-solid);\n  border-width: var(--salt-size-fixed-100);\n  height: 100%;\n  outline: none;\n  overflow-y: auto;\n  overflow-x: hidden;\n  position: relative;\n  padding-inline-start: 0;\n  box-sizing: content-box;\n\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-fontSize);\n  font-weight: var(--salt-text-fontWeight);\n  line-height: var(--salt-text-lineHeight);\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=ListNext.css.js.map

package/dist-es/list-next/ListNext.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListNext.js","sources":["../src/list-next/ListNext.tsx"],"sourcesContent":["import { makePrefixer, useForkRef, useId } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  type FocusEvent,\n  type KeyboardEvent,\n  type MouseEvent,\n  type SyntheticEvent,\n  forwardRef,\n  useRef,\n} from \"react\";\nimport listNextCss from \"./ListNext.css\";\nimport { ListNextContext } from \"./ListNextContext\";\nimport { useList } from \"./useList\";\n\nconst withBaseName = makePrefixer(\"saltListNext\");\n\nexport interface ListNextProps\n  extends Omit<ComponentPropsWithoutRef<\"ul\">, \"onChange\" | \"onSelect\"> {\n  /**\n   * If true, all items in list will be disabled.\n   */\n  disabled?: boolean;\n  /* If `true`, the component will not receive focus. */\n  disableFocus?: boolean;\n  /* Value for the controlled version. */\n  highlightedItem?: string;\n  /* Value for the controlled version. */\n  selected?: string;\n  /* Callback for change event. Returns current selection.*/\n  onChange?: (\n    event: SyntheticEvent,\n    data: { value: string | undefined },\n  ) => void;\n  /* Callback for select event. Returns new selected item.*/\n  onSelect?: (event: SyntheticEvent, data: { value: string }) => void;\n  /* Initial selection. */\n  defaultSelected?: string;\n}\n\nexport const ListNext = forwardRef<HTMLUListElement, ListNextProps>(\n  function ListNext(\n    {\n      children,\n      className,\n      disabled,\n      disableFocus,\n      id,\n      onSelect,\n      onFocus,\n      onBlur,\n      onKeyDown,\n      onMouseOver,\n      highlightedItem,\n      selected,\n      defaultSelected,\n      onChange,\n      ...rest\n    },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-list-next\",\n      css: listNextCss,\n      window: targetWindow,\n    });\n\n    const listId = useId(id);\n    const listRef = useRef<HTMLUListElement>(null);\n    const handleRef = useForkRef(listRef, ref);\n    const {\n      focusHandler,\n      keyDownHandler,\n      blurHandler,\n      mouseOverHandler,\n      activeDescendant,\n      contextValue,\n      focusVisibleRef,\n    } = useList({\n      disabled,\n      highlightedItem,\n      selected,\n      defaultSelected,\n      onChange,\n      onSelect,\n      id: listId,\n      ref: listRef,\n    });\n\n    const setListRef = useForkRef(focusVisibleRef, handleRef);\n\n    const handleFocus = (event: FocusEvent<HTMLUListElement>) => {\n      focusHandler(event);\n      onFocus?.(event);\n    };\n\n    const handleKeyDown = (event: KeyboardEvent<HTMLUListElement>) => {\n      if (disableFocus) {\n        event.preventDefault();\n        return;\n      }\n      keyDownHandler(event);\n      onKeyDown?.(event);\n    };\n\n    const handleBlur = (event: FocusEvent<HTMLUListElement>) => {\n      blurHandler();\n      onBlur?.(event);\n    };\n\n    const handleMouseOver = (event: MouseEvent<HTMLUListElement>) => {\n      mouseOverHandler();\n      onMouseOver?.(event);\n    };\n\n    return (\n      <ListNextContext.Provider value={contextValue}>\n        <ul\n          // TODO: fix type from useIsFocusVisible\n          // @ts-ignore\n          ref={setListRef}\n          id={listId}\n          className={clsx(withBaseName(), className)}\n          role=\"listbox\"\n          tabIndex={disabled || disableFocus ? -1 : 0}\n          aria-activedescendant={disabled ? undefined : activeDescendant}\n          aria-disabled={disabled}\n          onFocus={handleFocus}\n          onKeyDown={handleKeyDown}\n          onBlur={handleBlur}\n          onMouseOver={handleMouseOver}\n          {...rest}\n        >\n          {children}\n        </ul>\n      </ListNextContext.Provider>\n    );\n  },\n);\n"],"names":["ListNext","listNextCss"],"mappings":"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"}
+{"version":3,"file":"ListNext.js","sources":["../src/list-next/ListNext.tsx"],"sourcesContent":["import { makePrefixer, useForkRef, useId } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  type FocusEvent,\n  forwardRef,\n  type KeyboardEvent,\n  type MouseEvent,\n  type SyntheticEvent,\n  useRef,\n} from \"react\";\nimport listNextCss from \"./ListNext.css\";\nimport { ListNextContext } from \"./ListNextContext\";\nimport { useList } from \"./useList\";\n\nconst withBaseName = makePrefixer(\"saltListNext\");\n\nexport interface ListNextProps\n  extends Omit<ComponentPropsWithoutRef<\"ul\">, \"onChange\" | \"onSelect\"> {\n  /**\n   * If true, all items in list will be disabled.\n   */\n  disabled?: boolean;\n  /* If `true`, the component will not receive focus. */\n  disableFocus?: boolean;\n  /* Value for the controlled version. */\n  highlightedItem?: string;\n  /* Value for the controlled version. */\n  selected?: string;\n  /* Callback for change event. Returns current selection.*/\n  onChange?: (\n    event: SyntheticEvent,\n    data: { value: string | undefined },\n  ) => void;\n  /* Callback for select event. Returns new selected item.*/\n  onSelect?: (event: SyntheticEvent, data: { value: string }) => void;\n  /* Initial selection. */\n  defaultSelected?: string;\n}\n\nexport const ListNext = forwardRef<HTMLUListElement, ListNextProps>(\n  function ListNext(\n    {\n      children,\n      className,\n      disabled,\n      disableFocus,\n      id,\n      onSelect,\n      onFocus,\n      onBlur,\n      onKeyDown,\n      onMouseOver,\n      highlightedItem,\n      selected,\n      defaultSelected,\n      onChange,\n      ...rest\n    },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-list-next\",\n      css: listNextCss,\n      window: targetWindow,\n    });\n\n    const listId = useId(id);\n    const listRef = useRef<HTMLUListElement>(null);\n    const handleRef = useForkRef(listRef, ref);\n    const {\n      focusHandler,\n      keyDownHandler,\n      blurHandler,\n      mouseOverHandler,\n      activeDescendant,\n      contextValue,\n      focusVisibleRef,\n    } = useList({\n      disabled,\n      highlightedItem,\n      selected,\n      defaultSelected,\n      onChange,\n      onSelect,\n      id: listId,\n      ref: listRef,\n    });\n\n    const setListRef = useForkRef(focusVisibleRef, handleRef);\n\n    const handleFocus = (event: FocusEvent<HTMLUListElement>) => {\n      focusHandler(event);\n      onFocus?.(event);\n    };\n\n    const handleKeyDown = (event: KeyboardEvent<HTMLUListElement>) => {\n      if (disableFocus) {\n        event.preventDefault();\n        return;\n      }\n      keyDownHandler(event);\n      onKeyDown?.(event);\n    };\n\n    const handleBlur = (event: FocusEvent<HTMLUListElement>) => {\n      blurHandler();\n      onBlur?.(event);\n    };\n\n    const handleMouseOver = (event: MouseEvent<HTMLUListElement>) => {\n      mouseOverHandler();\n      onMouseOver?.(event);\n    };\n\n    return (\n      <ListNextContext.Provider value={contextValue}>\n        <ul\n          // TODO: fix type from useIsFocusVisible\n          // @ts-ignore\n          ref={setListRef}\n          id={listId}\n          className={clsx(withBaseName(), className)}\n          role=\"listbox\"\n          tabIndex={disabled || disableFocus ? -1 : 0}\n          aria-activedescendant={disabled ? undefined : activeDescendant}\n          aria-disabled={disabled}\n          onFocus={handleFocus}\n          onKeyDown={handleKeyDown}\n          onBlur={handleBlur}\n          onMouseOver={handleMouseOver}\n          {...rest}\n        >\n          {children}\n        </ul>\n      </ListNextContext.Provider>\n    );\n  },\n);\n"],"names":["ListNext","listNextCss"],"mappings":"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"}

package/dist-es/logo/Logo.js

@@ -1,9 +1,9 @@
 import { jsx } from 'react/jsx-runtime';
 import { makePrefixer } from '@salt-ds/core';
-import { clsx } from 'clsx';
-import { forwardRef } from 'react';
 import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
+import { clsx } from 'clsx';
+import { forwardRef } from 'react';
 import css_248z from './Logo.css.js';
 
 const withBaseName = makePrefixer("saltLogo");

package/dist-es/logo/Logo.js.map

@@ -1 +1 @@
-{"version":3,"file":"Logo.js","sources":["../src/logo/Logo.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef } from \"react\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport logoCss from \"./Logo.css\";\n\nexport type LogoProps = ComponentPropsWithoutRef<\"span\">;\n\nconst withBaseName = makePrefixer(\"saltLogo\");\n\nexport const Logo = forwardRef<HTMLSpanElement, LogoProps>(\n  function Logo(props, ref) {\n    const { className, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-logo\",\n      css: logoCss,\n      window: targetWindow,\n    });\n\n    return (\n      <span className={clsx(withBaseName(), className)} ref={ref} {...rest} />\n    );\n  },\n);\n"],"names":["Logo","logoCss"],"mappings":";;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,UAAU,CAAA;AAErC,MAAM,IAAO,GAAA,UAAA;AAAA,EAClB,SAASA,KAAK,CAAA,KAAA,EAAO,GAAK,EAAA;AACxB,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAS,GAAA,KAAA;AAE/B,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,WAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IACE,uBAAA,GAAA,CAAC,MAAK,EAAA,EAAA,SAAA,EAAW,IAAK,CAAA,YAAA,IAAgB,SAAS,CAAA,EAAG,GAAW,EAAA,GAAG,IAAM,EAAA,CAAA;AAAA;AAG5E;;;;"}
+{"version":3,"file":"Logo.js","sources":["../src/logo/Logo.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef } from \"react\";\n\nimport logoCss from \"./Logo.css\";\n\nexport type LogoProps = ComponentPropsWithoutRef<\"span\">;\n\nconst withBaseName = makePrefixer(\"saltLogo\");\n\nexport const Logo = forwardRef<HTMLSpanElement, LogoProps>(\n  function Logo(props, ref) {\n    const { className, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-logo\",\n      css: logoCss,\n      window: targetWindow,\n    });\n\n    return (\n      <span className={clsx(withBaseName(), className)} ref={ref} {...rest} />\n    );\n  },\n);\n"],"names":["Logo","logoCss"],"mappings":";;;;;;;;AAUA,MAAM,YAAA,GAAe,aAAa,UAAU,CAAA;AAErC,MAAM,IAAO,GAAA,UAAA;AAAA,EAClB,SAASA,KAAK,CAAA,KAAA,EAAO,GAAK,EAAA;AACxB,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAS,GAAA,KAAA;AAE/B,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,WAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IACE,uBAAA,GAAA,CAAC,MAAK,EAAA,EAAA,SAAA,EAAW,IAAK,CAAA,YAAA,IAAgB,SAAS,CAAA,EAAG,GAAW,EAAA,GAAG,IAAM,EAAA,CAAA;AAAA;AAG5E;;;;"}

package/dist-es/logo/LogoSeparator.css.js

@@ -1,4 +1,4 @@
-var css_248z = "/* Styles for LogoSeparator */\n.saltLogoSeparator {\n  height: var(--salt-size-separator-height);\n  border-right: var(--salt-size-fixed-100) var(--salt-separable-borderStyle) var(--salt-separable-primary-borderColor);\n}\n";
+var css_248z = "/* Styles for LogoSeparator */\n.saltLogoSeparator {\n  height: var(--salt-size-separator-height);\n  border-right: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-separable-primary-borderColor);\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=LogoSeparator.css.js.map

package/dist-es/logo/LogoSeparator.js

@@ -1,9 +1,9 @@
 import { jsx } from 'react/jsx-runtime';
 import { makePrefixer } from '@salt-ds/core';
-import { clsx } from 'clsx';
-import { forwardRef } from 'react';
 import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
+import { clsx } from 'clsx';
+import { forwardRef } from 'react';
 import css_248z from './LogoSeparator.css.js';
 
 const withBaseName = makePrefixer("saltLogoSeparator");

package/dist-es/logo/LogoSeparator.js.map

@@ -1 +1 @@
-{"version":3,"file":"LogoSeparator.js","sources":["../src/logo/LogoSeparator.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef } from \"react\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport logoSeparatorCss from \"./LogoSeparator.css\";\n\nexport type LogoSeparatorProps = ComponentPropsWithoutRef<\"span\">;\n\nconst withBaseName = makePrefixer(\"saltLogoSeparator\");\n\nexport const LogoSeparator = forwardRef<HTMLImageElement, LogoSeparatorProps>(\n  function LogoSeparator(props, ref) {\n    const { className, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-logo-separator\",\n      css: logoSeparatorCss,\n      window: targetWindow,\n    });\n\n    return (\n      <span {...rest} className={clsx(withBaseName(), className)} ref={ref} />\n    );\n  },\n);\n"],"names":["LogoSeparator","logoSeparatorCss"],"mappings":";;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA;AAE9C,MAAM,aAAgB,GAAA,UAAA;AAAA,EAC3B,SAASA,cAAc,CAAA,KAAA,EAAO,GAAK,EAAA;AACjC,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAS,GAAA,KAAA;AAE/B,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,qBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IACE,uBAAA,GAAA,CAAC,MAAM,EAAA,EAAA,GAAG,IAAM,EAAA,SAAA,EAAW,KAAK,YAAa,EAAA,EAAG,SAAS,CAAA,EAAG,GAAU,EAAA,CAAA;AAAA;AAG5E;;;;"}
+{"version":3,"file":"LogoSeparator.js","sources":["../src/logo/LogoSeparator.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef } from \"react\";\n\nimport logoSeparatorCss from \"./LogoSeparator.css\";\n\nexport type LogoSeparatorProps = ComponentPropsWithoutRef<\"span\">;\n\nconst withBaseName = makePrefixer(\"saltLogoSeparator\");\n\nexport const LogoSeparator = forwardRef<HTMLImageElement, LogoSeparatorProps>(\n  function LogoSeparator(props, ref) {\n    const { className, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-logo-separator\",\n      css: logoSeparatorCss,\n      window: targetWindow,\n    });\n\n    return (\n      <span {...rest} className={clsx(withBaseName(), className)} ref={ref} />\n    );\n  },\n);\n"],"names":["LogoSeparator","logoSeparatorCss"],"mappings":";;;;;;;;AAUA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA;AAE9C,MAAM,aAAgB,GAAA,UAAA;AAAA,EAC3B,SAASA,cAAc,CAAA,KAAA,EAAO,GAAK,EAAA;AACjC,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAS,GAAA,KAAA;AAE/B,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,qBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IACE,uBAAA,GAAA,CAAC,MAAM,EAAA,EAAA,GAAG,IAAM,EAAA,SAAA,EAAW,KAAK,YAAa,EAAA,EAAG,SAAS,CAAA,EAAG,GAAU,EAAA,CAAA;AAAA;AAG5E;;;;"}

package/dist-es/menu-button/MenuButton.js

@@ -3,8 +3,8 @@ import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
 import { forwardRef, useState, useCallback } from 'react';
 import { CascadingMenu } from '../cascading-menu/CascadingMenu.js';
-import { MenuButtonTrigger } from './MenuButtonTrigger.js';
 import css_248z from './MenuButton.css.js';
+import { MenuButtonTrigger } from './MenuButtonTrigger.js';
 
 const MenuButton = forwardRef(
   function MenuButton2({ variant = "secondary", CascadingMenuProps = {}, children, ...restProps }, ref) {

package/dist-es/menu-button/MenuButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuButton.js","sources":["../src/menu-button/MenuButton.tsx"],"sourcesContent":["import type { ButtonProps } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { type ReactNode, forwardRef, useCallback, useState } from \"react\";\nimport { CascadingMenu, type CascadingMenuProps } from \"../cascading-menu\";\nimport { MenuButtonTrigger } from \"./MenuButtonTrigger\";\n\nimport menuButtonCss from \"./MenuButton.css\";\n\nexport interface MenuButtonProps extends ButtonProps {\n  CascadingMenuProps: CascadingMenuProps;\n  children: ReactNode;\n  className?: string;\n  hideCaret?: boolean;\n}\n\nexport const MenuButton = forwardRef<HTMLButtonElement, MenuButtonProps>(\n  function MenuButton(\n    { variant = \"secondary\", CascadingMenuProps = {}, children, ...restProps },\n    ref,\n  ) {\n    const {\n      initialSource = { menuItems: [] },\n      onOpen,\n      onClose,\n      ...restMenuProps\n    } = CascadingMenuProps;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-menu-button\",\n      css: menuButtonCss,\n      window: targetWindow,\n    });\n\n    const [isMenuOpen, setMenuOpen] = useState(false);\n\n    const handleOpen = useCallback(() => {\n      setMenuOpen(true);\n      onOpen?.();\n    }, [onOpen]);\n\n    const handleClose = useCallback(() => {\n      setMenuOpen(false);\n      onClose?.();\n    }, [onClose]);\n\n    return (\n      <CascadingMenu\n        initialSource={initialSource}\n        onClose={handleClose}\n        onOpen={handleOpen}\n        {...restMenuProps}\n      >\n        <MenuButtonTrigger\n          aria-expanded={isMenuOpen}\n          aria-haspopup\n          isMenuOpen={isMenuOpen}\n          ref={ref}\n          variant={variant}\n          {...restProps}\n        >\n          {children}\n        </MenuButtonTrigger>\n      </CascadingMenu>\n    );\n  },\n);\n"],"names":["MenuButton","menuButtonCss"],"mappings":";;;;;;;;AAgBO,MAAM,UAAa,GAAA,UAAA;AAAA,EACxB,SAASA,WAAAA,CACP,EAAE,OAAA,GAAU,WAAa,EAAA,kBAAA,GAAqB,EAAC,EAAG,QAAU,EAAA,GAAG,SAAU,EAAA,EACzE,GACA,EAAA;AACA,IAAM,MAAA;AAAA,MACJ,aAAgB,GAAA,EAAE,SAAW,EAAA,EAAG,EAAA;AAAA,MAChC,MAAA;AAAA,MACA,OAAA;AAAA,MACA,GAAG;AAAA,KACD,GAAA,kBAAA;AAEJ,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAA,MAAM,CAAC,UAAA,EAAY,WAAW,CAAA,GAAI,SAAS,KAAK,CAAA;AAEhD,IAAM,MAAA,UAAA,GAAa,YAAY,MAAM;AACnC,MAAA,WAAA,CAAY,IAAI,CAAA;AAChB,MAAA,MAAA,IAAA,IAAA,GAAA,MAAA,GAAA,MAAA,EAAA;AAAA,KACF,EAAG,CAAC,MAAM,CAAC,CAAA;AAEX,IAAM,MAAA,WAAA,GAAc,YAAY,MAAM;AACpC,MAAA,WAAA,CAAY,KAAK,CAAA;AACjB,MAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,EAAA;AAAA,KACF,EAAG,CAAC,OAAO,CAAC,CAAA;AAEZ,IACE,uBAAA,GAAA;AAAA,MAAC,aAAA;AAAA,MAAA;AAAA,QACC,aAAA;AAAA,QACA,OAAS,EAAA,WAAA;AAAA,QACT,MAAQ,EAAA,UAAA;AAAA,QACP,GAAG,aAAA;AAAA,QAEJ,QAAA,kBAAA,GAAA;AAAA,UAAC,iBAAA;AAAA,UAAA;AAAA,YACC,eAAe,EAAA,UAAA;AAAA,YACf,eAAa,EAAA,IAAA;AAAA,YACb,UAAA;AAAA,YACA,GAAA;AAAA,YACA,OAAA;AAAA,YACC,GAAG,SAAA;AAAA,YAEH;AAAA;AAAA;AACH;AAAA,KACF;AAAA;AAGN;;;;"}
+{"version":3,"file":"MenuButton.js","sources":["../src/menu-button/MenuButton.tsx"],"sourcesContent":["import type { ButtonProps } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { forwardRef, type ReactNode, useCallback, useState } from \"react\";\nimport { CascadingMenu, type CascadingMenuProps } from \"../cascading-menu\";\nimport menuButtonCss from \"./MenuButton.css\";\nimport { MenuButtonTrigger } from \"./MenuButtonTrigger\";\n\nexport interface MenuButtonProps extends ButtonProps {\n  CascadingMenuProps: CascadingMenuProps;\n  children: ReactNode;\n  className?: string;\n  hideCaret?: boolean;\n}\n\nexport const MenuButton = forwardRef<HTMLButtonElement, MenuButtonProps>(\n  function MenuButton(\n    { variant = \"secondary\", CascadingMenuProps = {}, children, ...restProps },\n    ref,\n  ) {\n    const {\n      initialSource = { menuItems: [] },\n      onOpen,\n      onClose,\n      ...restMenuProps\n    } = CascadingMenuProps;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-menu-button\",\n      css: menuButtonCss,\n      window: targetWindow,\n    });\n\n    const [isMenuOpen, setMenuOpen] = useState(false);\n\n    const handleOpen = useCallback(() => {\n      setMenuOpen(true);\n      onOpen?.();\n    }, [onOpen]);\n\n    const handleClose = useCallback(() => {\n      setMenuOpen(false);\n      onClose?.();\n    }, [onClose]);\n\n    return (\n      <CascadingMenu\n        initialSource={initialSource}\n        onClose={handleClose}\n        onOpen={handleOpen}\n        {...restMenuProps}\n      >\n        <MenuButtonTrigger\n          aria-expanded={isMenuOpen}\n          aria-haspopup\n          isMenuOpen={isMenuOpen}\n          ref={ref}\n          variant={variant}\n          {...restProps}\n        >\n          {children}\n        </MenuButtonTrigger>\n      </CascadingMenu>\n    );\n  },\n);\n"],"names":["MenuButton","menuButtonCss"],"mappings":";;;;;;;;AAeO,MAAM,UAAa,GAAA,UAAA;AAAA,EACxB,SAASA,WAAAA,CACP,EAAE,OAAA,GAAU,WAAa,EAAA,kBAAA,GAAqB,EAAC,EAAG,QAAU,EAAA,GAAG,SAAU,EAAA,EACzE,GACA,EAAA;AACA,IAAM,MAAA;AAAA,MACJ,aAAgB,GAAA,EAAE,SAAW,EAAA,EAAG,EAAA;AAAA,MAChC,MAAA;AAAA,MACA,OAAA;AAAA,MACA,GAAG;AAAA,KACD,GAAA,kBAAA;AAEJ,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAA,MAAM,CAAC,UAAA,EAAY,WAAW,CAAA,GAAI,SAAS,KAAK,CAAA;AAEhD,IAAM,MAAA,UAAA,GAAa,YAAY,MAAM;AACnC,MAAA,WAAA,CAAY,IAAI,CAAA;AAChB,MAAA,MAAA,IAAA,IAAA,GAAA,MAAA,GAAA,MAAA,EAAA;AAAA,KACF,EAAG,CAAC,MAAM,CAAC,CAAA;AAEX,IAAM,MAAA,WAAA,GAAc,YAAY,MAAM;AACpC,MAAA,WAAA,CAAY,KAAK,CAAA;AACjB,MAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,EAAA;AAAA,KACF,EAAG,CAAC,OAAO,CAAC,CAAA;AAEZ,IACE,uBAAA,GAAA;AAAA,MAAC,aAAA;AAAA,MAAA;AAAA,QACC,aAAA;AAAA,QACA,OAAS,EAAA,WAAA;AAAA,QACT,MAAQ,EAAA,UAAA;AAAA,QACP,GAAG,aAAA;AAAA,QAEJ,QAAA,kBAAA,GAAA;AAAA,UAAC,iBAAA;AAAA,UAAA;AAAA,YACC,eAAe,EAAA,UAAA;AAAA,YACf,eAAa,EAAA,IAAA;AAAA,YACb,UAAA;AAAA,YACA,GAAA;AAAA,YACA,OAAA;AAAA,YACC,GAAG,SAAA;AAAA,YAEH;AAAA;AAAA;AACH;AAAA,KACF;AAAA;AAGN;;;;"}

package/dist-es/menu-button/MenuButtonTrigger.js

@@ -1,9 +1,9 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { makePrefixer, useIcon, Button } from '@salt-ds/core';
-import { clsx } from 'clsx';
-import { forwardRef } from 'react';
 import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
+import { clsx } from 'clsx';
+import { forwardRef } from 'react';
 import css_248z from './MenuButtonTrigger.css.js';
 
 const withBaseName = makePrefixer("saltMenuButtonTrigger");

package/dist-es/menu-button/MenuButtonTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuButtonTrigger.js","sources":["../src/menu-button/MenuButtonTrigger.tsx"],"sourcesContent":["import { Button, type ButtonProps, makePrefixer, useIcon } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { type ReactNode, forwardRef } from \"react\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport menuButtonTrigger from \"./MenuButtonTrigger.css\";\n\nconst withBaseName = makePrefixer(\"saltMenuButtonTrigger\");\n\nexport interface MenuButtonTriggerProps extends ButtonProps {\n  className?: string;\n  hideCaret?: boolean;\n  isMenuOpen?: boolean;\n  children?: ReactNode;\n}\n\nexport const MenuButtonTrigger = forwardRef<\n  HTMLButtonElement,\n  MenuButtonTriggerProps\n>(function MenuButtonTrigger(\n  { className, hideCaret, isMenuOpen, children, ...rest },\n  ref,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-menu-button-trigger\",\n    css: menuButtonTrigger,\n    window: targetWindow,\n  });\n  const { ExpandIcon } = useIcon();\n\n  return (\n    <Button\n      ref={ref}\n      className={clsx(withBaseName(), className, {\n        [withBaseName(\"buttonOpen\")]: isMenuOpen,\n      })}\n      data-testid=\"menu-button-trigger\"\n      {...rest}\n    >\n      {children}\n      {!hideCaret && (\n        <ExpandIcon\n          className={withBaseName(\"caretIcon\")}\n          data-testid=\"menu-button-trigger-caret\"\n        />\n      )}\n    </Button>\n  );\n});\n"],"names":["MenuButtonTrigger","menuButtonTrigger"],"mappings":";;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,uBAAuB,CAAA;AASlD,MAAM,iBAAoB,GAAA,UAAA,CAG/B,SAASA,kBAAAA,CACT,EAAE,SAAA,EAAW,SAAW,EAAA,UAAA,EAAY,QAAU,EAAA,GAAG,IAAK,EAAA,EACtD,GACA,EAAA;AACA,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,0BAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AACD,EAAM,MAAA,EAAE,UAAW,EAAA,GAAI,OAAQ,EAAA;AAE/B,EACE,uBAAA,IAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAW,EAAA;AAAA,QACzC,CAAC,YAAA,CAAa,YAAY,CAAC,GAAG;AAAA,OAC/B,CAAA;AAAA,MACD,aAAY,EAAA,qBAAA;AAAA,MACX,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,QACA,CAAC,SACA,oBAAA,GAAA;AAAA,UAAC,UAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,YACnC,aAAY,EAAA;AAAA;AAAA;AACd;AAAA;AAAA,GAEJ;AAEJ,CAAC;;;;"}
+{"version":3,"file":"MenuButtonTrigger.js","sources":["../src/menu-button/MenuButtonTrigger.tsx"],"sourcesContent":["import { Button, type ButtonProps, makePrefixer, useIcon } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type ReactNode } from \"react\";\n\nimport menuButtonTrigger from \"./MenuButtonTrigger.css\";\n\nconst withBaseName = makePrefixer(\"saltMenuButtonTrigger\");\n\nexport interface MenuButtonTriggerProps extends ButtonProps {\n  className?: string;\n  hideCaret?: boolean;\n  isMenuOpen?: boolean;\n  children?: ReactNode;\n}\n\nexport const MenuButtonTrigger = forwardRef<\n  HTMLButtonElement,\n  MenuButtonTriggerProps\n>(function MenuButtonTrigger(\n  { className, hideCaret, isMenuOpen, children, ...rest },\n  ref,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-menu-button-trigger\",\n    css: menuButtonTrigger,\n    window: targetWindow,\n  });\n  const { ExpandIcon } = useIcon();\n\n  return (\n    <Button\n      ref={ref}\n      className={clsx(withBaseName(), className, {\n        [withBaseName(\"buttonOpen\")]: isMenuOpen,\n      })}\n      data-testid=\"menu-button-trigger\"\n      {...rest}\n    >\n      {children}\n      {!hideCaret && (\n        <ExpandIcon\n          className={withBaseName(\"caretIcon\")}\n          data-testid=\"menu-button-trigger-caret\"\n        />\n      )}\n    </Button>\n  );\n});\n"],"names":["MenuButtonTrigger","menuButtonTrigger"],"mappings":";;;;;;;;AAQA,MAAM,YAAA,GAAe,aAAa,uBAAuB,CAAA;AASlD,MAAM,iBAAoB,GAAA,UAAA,CAG/B,SAASA,kBAAAA,CACT,EAAE,SAAA,EAAW,SAAW,EAAA,UAAA,EAAY,QAAU,EAAA,GAAG,IAAK,EAAA,EACtD,GACA,EAAA;AACA,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,0BAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AACD,EAAM,MAAA,EAAE,UAAW,EAAA,GAAI,OAAQ,EAAA;AAE/B,EACE,uBAAA,IAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAW,EAAA;AAAA,QACzC,CAAC,YAAA,CAAa,YAAY,CAAC,GAAG;AAAA,OAC/B,CAAA;AAAA,MACD,aAAY,EAAA,qBAAA;AAAA,MACX,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,QACA,CAAC,SACA,oBAAA,GAAA;AAAA,UAAC,UAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,YACnC,aAAY,EAAA;AAAA;AAAA;AACd;AAAA;AAAA,GAEJ;AAEJ,CAAC;;;;"}

package/dist-es/metric/Metric.js

@@ -1,10 +1,10 @@
 import { jsx } from 'react/jsx-runtime';
 import { makePrefixer, useId } from '@salt-ds/core';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
 import { clsx } from 'clsx';
 import { forwardRef, useMemo } from 'react';
 import { MetricContextProvider } from './internal/MetricContext.js';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
 import css_248z from './Metric.css.js';
 
 const withBaseName = makePrefixer("saltMetric");

package/dist-es/metric/Metric.js.map

@@ -1 +1 @@
-{"version":3,"file":"Metric.js","sources":["../src/metric/Metric.tsx"],"sourcesContent":["import { makePrefixer, useId } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { type HTMLAttributes, forwardRef, useMemo } from \"react\";\nimport { MetricContextProvider, type MetricContextValue } from \"./internal\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport metricCSS from \"./Metric.css\";\n\nconst withBaseName = makePrefixer(\"saltMetric\");\n\nexport interface MetricProps\n  extends MetricContextValue,\n    HTMLAttributes<HTMLDivElement> {\n  /**\n   * The aria-level attribute to be applied to the heading component. The default is 2.\n   *\n   * As an ADA requirement, the heading component should be the first valid component inside the Metric. It is the title\n   * if <MetricHeader/> is placed before <MerticContent/>. It is the main value if <MerticContent/> is placed before <MetricHeader/>.\n   */\n  headingAriaLevel?: number;\n  /**\n   * This prop is used to help implement the accessibility logic.\n   * If you don't provide this prop. It falls back to a randomly generated id.\n   */\n  id?: string;\n}\n\nexport const Metric = forwardRef<HTMLDivElement, MetricProps>(function Metric(\n  {\n    className,\n    children,\n    direction,\n    showIndicator,\n    align = \"left\",\n    orientation = \"vertical\",\n    indicatorPosition = \"end\",\n    headingAriaLevel = 2,\n    id: idProp,\n    size = \"medium\",\n    ...restProps\n  },\n  ref,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-metric\",\n    css: metricCSS,\n    window: targetWindow,\n  });\n\n  const id = useId(idProp);\n  const titleId = `metric-title-${id}`;\n  const subtitleId = `metric-subtitle-${id}`;\n  const valueId = `metric-value-${id}`;\n\n  const value = useMemo(\n    () => ({\n      align,\n      direction,\n      orientation,\n      showIndicator,\n      indicatorPosition,\n      headingAriaLevel,\n      size,\n      titleId,\n      subtitleId,\n      valueId,\n    }),\n    [\n      align,\n      direction,\n      orientation,\n      showIndicator,\n      indicatorPosition,\n      headingAriaLevel,\n      size,\n      titleId,\n      subtitleId,\n      valueId,\n    ],\n  );\n\n  return (\n    <MetricContextProvider value={value}>\n      <div\n        {...restProps}\n        className={clsx(\n          withBaseName(),\n          withBaseName(`size-${size}`),\n          {\n            [withBaseName(`direction-${direction}`)]: direction,\n            [withBaseName(`orientation-${orientation}`)]: orientation,\n            [withBaseName(`align-${align}`)]: align,\n          },\n          className,\n        )}\n        id={id}\n        ref={ref}\n      >\n        {children}\n      </div>\n    </MetricContextProvider>\n  );\n});\n"],"names":["Metric","metricCSS"],"mappings":";;;;;;;;;AAUA,MAAM,YAAA,GAAe,aAAa,YAAY,CAAA;AAmBjC,MAAA,MAAA,GAAS,UAAwC,CAAA,SAASA,OACrE,CAAA;AAAA,EACE,SAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,aAAA;AAAA,EACA,KAAQ,GAAA,MAAA;AAAA,EACR,WAAc,GAAA,UAAA;AAAA,EACd,iBAAoB,GAAA,KAAA;AAAA,EACpB,gBAAmB,GAAA,CAAA;AAAA,EACnB,EAAI,EAAA,MAAA;AAAA,EACJ,IAAO,GAAA,QAAA;AAAA,EACP,GAAG;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,aAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA,EAAA,GAAK,MAAM,MAAM,CAAA;AACvB,EAAM,MAAA,OAAA,GAAU,gBAAgB,EAAE,CAAA,CAAA;AAClC,EAAM,MAAA,UAAA,GAAa,mBAAmB,EAAE,CAAA,CAAA;AACxC,EAAM,MAAA,OAAA,GAAU,gBAAgB,EAAE,CAAA,CAAA;AAElC,EAAA,MAAM,KAAQ,GAAA,OAAA;AAAA,IACZ,OAAO;AAAA,MACL,KAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA;AAAA,MACA,aAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA;AAAA,KACF,CAAA;AAAA,IACA;AAAA,MACE,KAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA;AAAA,MACA,aAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA;AAAA;AACF,GACF;AAEA,EACE,uBAAA,GAAA,CAAC,yBAAsB,KACrB,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,SAAA;AAAA,MACJ,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,YAAA,CAAa,CAAQ,KAAA,EAAA,IAAI,CAAE,CAAA,CAAA;AAAA,QAC3B;AAAA,UACE,CAAC,YAAa,CAAA,CAAA,UAAA,EAAa,SAAS,CAAA,CAAE,CAAC,GAAG,SAAA;AAAA,UAC1C,CAAC,YAAa,CAAA,CAAA,YAAA,EAAe,WAAW,CAAA,CAAE,CAAC,GAAG,WAAA;AAAA,UAC9C,CAAC,YAAa,CAAA,CAAA,MAAA,EAAS,KAAK,CAAA,CAAE,CAAC,GAAG;AAAA,SACpC;AAAA,QACA;AAAA,OACF;AAAA,MACA,EAAA;AAAA,MACA,GAAA;AAAA,MAEC;AAAA;AAAA,GAEL,EAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Metric.js","sources":["../src/metric/Metric.tsx"],"sourcesContent":["import { makePrefixer, useId } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes, useMemo } from \"react\";\nimport { MetricContextProvider, type MetricContextValue } from \"./internal\";\n\nimport metricCSS from \"./Metric.css\";\n\nconst withBaseName = makePrefixer(\"saltMetric\");\n\nexport interface MetricProps\n  extends MetricContextValue,\n    HTMLAttributes<HTMLDivElement> {\n  /**\n   * The aria-level attribute to be applied to the heading component. The default is 2.\n   *\n   * As an ADA requirement, the heading component should be the first valid component inside the Metric. It is the title\n   * if <MetricHeader/> is placed before <MerticContent/>. It is the main value if <MerticContent/> is placed before <MetricHeader/>.\n   */\n  headingAriaLevel?: number;\n  /**\n   * This prop is used to help implement the accessibility logic.\n   * If you don't provide this prop. It falls back to a randomly generated id.\n   */\n  id?: string;\n}\n\nexport const Metric = forwardRef<HTMLDivElement, MetricProps>(function Metric(\n  {\n    className,\n    children,\n    direction,\n    showIndicator,\n    align = \"left\",\n    orientation = \"vertical\",\n    indicatorPosition = \"end\",\n    headingAriaLevel = 2,\n    id: idProp,\n    size = \"medium\",\n    ...restProps\n  },\n  ref,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-metric\",\n    css: metricCSS,\n    window: targetWindow,\n  });\n\n  const id = useId(idProp);\n  const titleId = `metric-title-${id}`;\n  const subtitleId = `metric-subtitle-${id}`;\n  const valueId = `metric-value-${id}`;\n\n  const value = useMemo(\n    () => ({\n      align,\n      direction,\n      orientation,\n      showIndicator,\n      indicatorPosition,\n      headingAriaLevel,\n      size,\n      titleId,\n      subtitleId,\n      valueId,\n    }),\n    [\n      align,\n      direction,\n      orientation,\n      showIndicator,\n      indicatorPosition,\n      headingAriaLevel,\n      size,\n      titleId,\n      subtitleId,\n      valueId,\n    ],\n  );\n\n  return (\n    <MetricContextProvider value={value}>\n      <div\n        {...restProps}\n        className={clsx(\n          withBaseName(),\n          withBaseName(`size-${size}`),\n          {\n            [withBaseName(`direction-${direction}`)]: direction,\n            [withBaseName(`orientation-${orientation}`)]: orientation,\n            [withBaseName(`align-${align}`)]: align,\n          },\n          className,\n        )}\n        id={id}\n        ref={ref}\n      >\n        {children}\n      </div>\n    </MetricContextProvider>\n  );\n});\n"],"names":["Metric","metricCSS"],"mappings":";;;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,YAAY,CAAA;AAmBjC,MAAA,MAAA,GAAS,UAAwC,CAAA,SAASA,OACrE,CAAA;AAAA,EACE,SAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,aAAA;AAAA,EACA,KAAQ,GAAA,MAAA;AAAA,EACR,WAAc,GAAA,UAAA;AAAA,EACd,iBAAoB,GAAA,KAAA;AAAA,EACpB,gBAAmB,GAAA,CAAA;AAAA,EACnB,EAAI,EAAA,MAAA;AAAA,EACJ,IAAO,GAAA,QAAA;AAAA,EACP,GAAG;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,aAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA,EAAA,GAAK,MAAM,MAAM,CAAA;AACvB,EAAM,MAAA,OAAA,GAAU,gBAAgB,EAAE,CAAA,CAAA;AAClC,EAAM,MAAA,UAAA,GAAa,mBAAmB,EAAE,CAAA,CAAA;AACxC,EAAM,MAAA,OAAA,GAAU,gBAAgB,EAAE,CAAA,CAAA;AAElC,EAAA,MAAM,KAAQ,GAAA,OAAA;AAAA,IACZ,OAAO;AAAA,MACL,KAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA;AAAA,MACA,aAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA;AAAA,KACF,CAAA;AAAA,IACA;AAAA,MACE,KAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA;AAAA,MACA,aAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA;AAAA;AACF,GACF;AAEA,EACE,uBAAA,GAAA,CAAC,yBAAsB,KACrB,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,SAAA;AAAA,MACJ,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,YAAA,CAAa,CAAQ,KAAA,EAAA,IAAI,CAAE,CAAA,CAAA;AAAA,QAC3B;AAAA,UACE,CAAC,YAAa,CAAA,CAAA,UAAA,EAAa,SAAS,CAAA,CAAE,CAAC,GAAG,SAAA;AAAA,UAC1C,CAAC,YAAa,CAAA,CAAA,YAAA,EAAe,WAAW,CAAA,CAAE,CAAC,GAAG,WAAA;AAAA,UAC9C,CAAC,YAAa,CAAA,CAAA,MAAA,EAAS,KAAK,CAAA,CAAE,CAAC,GAAG;AAAA,SACpC;AAAA,QACA;AAAA,OACF;AAAA,MACA,EAAA;AAAA,MACA,GAAA;AAAA,MAEC;AAAA;AAAA,GAEL,EAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-es/metric/MetricContent.css.js

@@ -1,4 +1,4 @@
-var css_248z = ".saltMetricContent {\n  display: flex;\n  flex-direction: column;\n  margin-top: var(--metric-content-marginTop, 0px);\n}\n\n.saltMetricContent-value-container {\n  align-items: baseline;\n  display: flex;\n  flex-direction: row;\n  gap: calc(var(--salt-size-unit) / 2);\n  margin-top: var(--metric-content-valueContainer-marginTop, 0px);\n}\n\n.saltMetric-direction-up .saltMetricContent-indicator {\n  fill: var(--salt-status-positive-foreground);\n}\n.saltMetric-direction-up .saltMetricContent-subvalue {\n  color: var(--salt-status-positive-foreground);\n}\n\n.saltMetric-direction-down .saltMetricContent-indicator {\n  fill: var(--salt-status-negative-foreground);\n}\n.saltMetric-direction-down .saltMetricContent-subvalue {\n  color: var(--salt-status-negative-foreground);\n}\n\n.saltMetricContent-subvalue {\n  margin-top: var(--metric-content-subvalue-marginTop, 0px);\n}\n\n.saltMetric-align-left .saltMetricContent {\n  text-align: left;\n}\n\n.saltMetric-align-center .saltMetricContent {\n  align-items: center;\n  text-align: center;\n}\n\n.saltMetric-align-right .saltMetricContent {\n  align-items: flex-end;\n  text-align: right;\n}\n";
+var css_248z = ".saltMetricContent {\n  display: flex;\n  flex-direction: column;\n  margin-top: var(--metric-content-marginTop, 0px);\n}\n\n.saltMetricContent-value-container {\n  align-items: baseline;\n  display: flex;\n  flex-direction: row;\n  gap: calc(var(--salt-size-unit) / 2);\n  margin-top: var(--metric-content-valueContainer-marginTop, 0px);\n}\n\n.saltMetric-direction-up .saltMetricContent-indicator {\n  fill: var(--salt-sentiment-positive-foreground-decorative);\n}\n.saltMetric-direction-up .saltMetricContent-subvalue {\n  color: var(--salt-sentiment-positive-foreground-informative);\n}\n\n.saltMetric-direction-down .saltMetricContent-indicator {\n  fill: var(--salt-sentiment-negative-foreground-decorative);\n}\n.saltMetric-direction-down .saltMetricContent-subvalue {\n  color: var(--salt-sentiment-negative-foreground-informative);\n}\n\n.saltMetricContent-subvalue {\n  margin-top: var(--metric-content-subvalue-marginTop, 0px);\n}\n\n.saltMetric-align-left .saltMetricContent {\n  text-align: left;\n}\n\n.saltMetric-align-center .saltMetricContent {\n  align-items: center;\n  text-align: center;\n}\n\n.saltMetric-align-right .saltMetricContent {\n  align-items: flex-end;\n  text-align: right;\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=MetricContent.css.js.map

package/dist-es/metric/MetricContent.js

@@ -1,11 +1,11 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { makePrefixer, Display1, Display2, Display3, Text } from '@salt-ds/core';
 import { ArrowUpIcon, ArrowDownIcon } from '@salt-ds/icons';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
 import { clsx } from 'clsx';
 import { forwardRef } from 'react';
 import { useMetricContext } from './internal/MetricContext.js';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
 import css_248z from './MetricContent.css.js';
 
 const iconComponentMap = {

package/dist-es/metric/MetricContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"MetricContent.js","sources":["../src/metric/MetricContent.tsx"],"sourcesContent":["import {\n  Display1,\n  Display2,\n  Display3,\n  Text,\n  makePrefixer,\n} from \"@salt-ds/core\";\nimport { ArrowDownIcon, ArrowUpIcon, type IconProps } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport { type ComponentType, type HTMLAttributes, forwardRef } from \"react\";\nimport { useMetricContext } from \"./internal\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport metricContentCss from \"./MetricContent.css\";\n\nexport interface MetricContentProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * These props will be passed to the indicator icon. Use this to render a\n   * custom icon.\n   *\n   * @see `Icon` for a list of valid props.\n   */\n  IndicatorIconProps?: Partial<IconProps>;\n  /**\n   * Replace the default Icon component\n   */\n  IndicatorIconComponent?: ComponentType<IconProps>;\n\n  /**\n   * Other data that may serve as additional information to the main value\n   */\n  subvalue?: string | number;\n  /**\n   * The main value to display in the metric\n   */\n  value: string | number;\n}\n\nconst iconComponentMap = {\n  down: ArrowDownIcon,\n  up: ArrowUpIcon,\n};\n\nconst withBaseName = makePrefixer(\"saltMetricContent\");\n\nexport const MetricContent = forwardRef<HTMLDivElement, MetricContentProps>(\n  function MetricContent(\n    {\n      IndicatorIconProps,\n      IndicatorIconComponent,\n      className,\n      value,\n      subvalue,\n      ...restProps\n    },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-metric-content\",\n      css: metricContentCss,\n      window: targetWindow,\n    });\n\n    const {\n      direction,\n      showIndicator,\n      indicatorPosition,\n      size = \"medium\",\n      valueId,\n      titleId,\n      subtitleId,\n    } = useMetricContext();\n\n    const iconSize = size === \"large\" ? 2 : 1;\n\n    const valueComponentMap = {\n      small: Display3,\n      medium: Display2,\n      large: Display1,\n    };\n    const ValueComponent = valueComponentMap[size];\n\n    const iconProps = {\n      \"aria-label\": direction,\n      className: withBaseName(\"indicator\"),\n      name: direction ? `movement-${direction}` : \"\",\n      size: iconSize,\n      ...IndicatorIconProps,\n    };\n\n    const IconComponent =\n      IndicatorIconComponent ??\n      (direction ? iconComponentMap[direction] : undefined);\n\n    const icon =\n      showIndicator && IconComponent ? <IconComponent {...iconProps} /> : null;\n\n    return (\n      <div\n        {...restProps}\n        className={clsx(withBaseName(), className)}\n        aria-labelledby={`${titleId || \"\"} ${subtitleId || \"\"}`}\n        ref={ref}\n      >\n        <div className={withBaseName(\"value-container\")}>\n          {indicatorPosition === \"start\" && icon}\n          <ValueComponent\n            data-testid=\"metric-value\"\n            id={valueId}\n            className={withBaseName(\"value\")}\n          >\n            {value}\n          </ValueComponent>\n          {indicatorPosition === \"end\" && icon}\n        </div>\n        {subvalue && (\n          <Text\n            className={withBaseName(\"subvalue\")}\n            data-testid=\"metric-subvalue\"\n          >\n            {subvalue}\n          </Text>\n        )}\n      </div>\n    );\n  },\n);\n"],"names":["MetricContent","metricContentCss"],"mappings":";;;;;;;;;;AAwCA,MAAM,gBAAmB,GAAA;AAAA,EACvB,IAAM,EAAA,aAAA;AAAA,EACN,EAAI,EAAA;AACN,CAAA;AAEA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA;AAE9C,MAAM,aAAgB,GAAA,UAAA;AAAA,EAC3B,SAASA,cACP,CAAA;AAAA,IACE,kBAAA;AAAA,IACA,sBAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,GAAG;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,qBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,aAAA;AAAA,MACA,iBAAA;AAAA,MACA,IAAO,GAAA,QAAA;AAAA,MACP,OAAA;AAAA,MACA,OAAA;AAAA,MACA;AAAA,QACE,gBAAiB,EAAA;AAErB,IAAM,MAAA,QAAA,GAAW,IAAS,KAAA,OAAA,GAAU,CAAI,GAAA,CAAA;AAExC,IAAA,MAAM,iBAAoB,GAAA;AAAA,MACxB,KAAO,EAAA,QAAA;AAAA,MACP,MAAQ,EAAA,QAAA;AAAA,MACR,KAAO,EAAA;AAAA,KACT;AACA,IAAM,MAAA,cAAA,GAAiB,kBAAkB,IAAI,CAAA;AAE7C,IAAA,MAAM,SAAY,GAAA;AAAA,MAChB,YAAc,EAAA,SAAA;AAAA,MACd,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,MACnC,IAAM,EAAA,SAAA,GAAY,CAAY,SAAA,EAAA,SAAS,CAAK,CAAA,GAAA,EAAA;AAAA,MAC5C,IAAM,EAAA,QAAA;AAAA,MACN,GAAG;AAAA,KACL;AAEA,IAAA,MAAM,aACJ,GAAA,sBAAA,KACC,SAAY,GAAA,gBAAA,CAAiB,SAAS,CAAI,GAAA,MAAA,CAAA;AAE7C,IAAA,MAAM,OACJ,aAAiB,IAAA,aAAA,uBAAiB,aAAe,EAAA,EAAA,GAAG,WAAW,CAAK,GAAA,IAAA;AAEtE,IACE,uBAAA,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACE,GAAG,SAAA;AAAA,QACJ,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,mBAAiB,CAAG,EAAA,OAAA,IAAW,EAAE,CAAA,CAAA,EAAI,cAAc,EAAE,CAAA,CAAA;AAAA,QACrD,GAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,iBAAiB,CAC3C,EAAA,QAAA,EAAA;AAAA,YAAA,iBAAA,KAAsB,OAAW,IAAA,IAAA;AAAA,4BAClC,GAAA;AAAA,cAAC,cAAA;AAAA,cAAA;AAAA,gBACC,aAAY,EAAA,cAAA;AAAA,gBACZ,EAAI,EAAA,OAAA;AAAA,gBACJ,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,gBAE9B,QAAA,EAAA;AAAA;AAAA,aACH;AAAA,YACC,sBAAsB,KAAS,IAAA;AAAA,WAClC,EAAA,CAAA;AAAA,UACC,QACC,oBAAA,GAAA;AAAA,YAAC,IAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,aAAa,UAAU,CAAA;AAAA,cAClC,aAAY,EAAA,iBAAA;AAAA,cAEX,QAAA,EAAA;AAAA;AAAA;AACH;AAAA;AAAA,KAEJ;AAAA;AAGN;;;;"}
+{"version":3,"file":"MetricContent.js","sources":["../src/metric/MetricContent.tsx"],"sourcesContent":["import {\n  Display1,\n  Display2,\n  Display3,\n  makePrefixer,\n  Text,\n} from \"@salt-ds/core\";\nimport { ArrowDownIcon, ArrowUpIcon, type IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentType, forwardRef, type HTMLAttributes } from \"react\";\nimport { useMetricContext } from \"./internal\";\n\nimport metricContentCss from \"./MetricContent.css\";\n\nexport interface MetricContentProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * These props will be passed to the indicator icon. Use this to render a\n   * custom icon.\n   *\n   * @see `Icon` for a list of valid props.\n   */\n  IndicatorIconProps?: Partial<IconProps>;\n  /**\n   * Replace the default Icon component\n   */\n  IndicatorIconComponent?: ComponentType<IconProps>;\n\n  /**\n   * Other data that may serve as additional information to the main value\n   */\n  subvalue?: string | number;\n  /**\n   * The main value to display in the metric\n   */\n  value: string | number;\n}\n\nconst iconComponentMap = {\n  down: ArrowDownIcon,\n  up: ArrowUpIcon,\n};\n\nconst withBaseName = makePrefixer(\"saltMetricContent\");\n\nexport const MetricContent = forwardRef<HTMLDivElement, MetricContentProps>(\n  function MetricContent(\n    {\n      IndicatorIconProps,\n      IndicatorIconComponent,\n      className,\n      value,\n      subvalue,\n      ...restProps\n    },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-metric-content\",\n      css: metricContentCss,\n      window: targetWindow,\n    });\n\n    const {\n      direction,\n      showIndicator,\n      indicatorPosition,\n      size = \"medium\",\n      valueId,\n      titleId,\n      subtitleId,\n    } = useMetricContext();\n\n    const iconSize = size === \"large\" ? 2 : 1;\n\n    const valueComponentMap = {\n      small: Display3,\n      medium: Display2,\n      large: Display1,\n    };\n    const ValueComponent = valueComponentMap[size];\n\n    const iconProps = {\n      \"aria-label\": direction,\n      className: withBaseName(\"indicator\"),\n      name: direction ? `movement-${direction}` : \"\",\n      size: iconSize,\n      ...IndicatorIconProps,\n    };\n\n    const IconComponent =\n      IndicatorIconComponent ??\n      (direction ? iconComponentMap[direction] : undefined);\n\n    const icon =\n      showIndicator && IconComponent ? <IconComponent {...iconProps} /> : null;\n\n    return (\n      <div\n        {...restProps}\n        className={clsx(withBaseName(), className)}\n        aria-labelledby={`${titleId || \"\"} ${subtitleId || \"\"}`}\n        ref={ref}\n      >\n        <div className={withBaseName(\"value-container\")}>\n          {indicatorPosition === \"start\" && icon}\n          <ValueComponent\n            data-testid=\"metric-value\"\n            id={valueId}\n            className={withBaseName(\"value\")}\n          >\n            {value}\n          </ValueComponent>\n          {indicatorPosition === \"end\" && icon}\n        </div>\n        {subvalue && (\n          <Text\n            className={withBaseName(\"subvalue\")}\n            data-testid=\"metric-subvalue\"\n          >\n            {subvalue}\n          </Text>\n        )}\n      </div>\n    );\n  },\n);\n"],"names":["MetricContent","metricContentCss"],"mappings":";;;;;;;;;;AAuCA,MAAM,gBAAmB,GAAA;AAAA,EACvB,IAAM,EAAA,aAAA;AAAA,EACN,EAAI,EAAA;AACN,CAAA;AAEA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA;AAE9C,MAAM,aAAgB,GAAA,UAAA;AAAA,EAC3B,SAASA,cACP,CAAA;AAAA,IACE,kBAAA;AAAA,IACA,sBAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,GAAG;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,qBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,aAAA;AAAA,MACA,iBAAA;AAAA,MACA,IAAO,GAAA,QAAA;AAAA,MACP,OAAA;AAAA,MACA,OAAA;AAAA,MACA;AAAA,QACE,gBAAiB,EAAA;AAErB,IAAM,MAAA,QAAA,GAAW,IAAS,KAAA,OAAA,GAAU,CAAI,GAAA,CAAA;AAExC,IAAA,MAAM,iBAAoB,GAAA;AAAA,MACxB,KAAO,EAAA,QAAA;AAAA,MACP,MAAQ,EAAA,QAAA;AAAA,MACR,KAAO,EAAA;AAAA,KACT;AACA,IAAM,MAAA,cAAA,GAAiB,kBAAkB,IAAI,CAAA;AAE7C,IAAA,MAAM,SAAY,GAAA;AAAA,MAChB,YAAc,EAAA,SAAA;AAAA,MACd,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,MACnC,IAAM,EAAA,SAAA,GAAY,CAAY,SAAA,EAAA,SAAS,CAAK,CAAA,GAAA,EAAA;AAAA,MAC5C,IAAM,EAAA,QAAA;AAAA,MACN,GAAG;AAAA,KACL;AAEA,IAAA,MAAM,aACJ,GAAA,sBAAA,KACC,SAAY,GAAA,gBAAA,CAAiB,SAAS,CAAI,GAAA,MAAA,CAAA;AAE7C,IAAA,MAAM,OACJ,aAAiB,IAAA,aAAA,uBAAiB,aAAe,EAAA,EAAA,GAAG,WAAW,CAAK,GAAA,IAAA;AAEtE,IACE,uBAAA,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACE,GAAG,SAAA;AAAA,QACJ,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,mBAAiB,CAAG,EAAA,OAAA,IAAW,EAAE,CAAA,CAAA,EAAI,cAAc,EAAE,CAAA,CAAA;AAAA,QACrD,GAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,iBAAiB,CAC3C,EAAA,QAAA,EAAA;AAAA,YAAA,iBAAA,KAAsB,OAAW,IAAA,IAAA;AAAA,4BAClC,GAAA;AAAA,cAAC,cAAA;AAAA,cAAA;AAAA,gBACC,aAAY,EAAA,cAAA;AAAA,gBACZ,EAAI,EAAA,OAAA;AAAA,gBACJ,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,gBAE9B,QAAA,EAAA;AAAA;AAAA,aACH;AAAA,YACC,sBAAsB,KAAS,IAAA;AAAA,WAClC,EAAA,CAAA;AAAA,UACC,QACC,oBAAA,GAAA;AAAA,YAAC,IAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,aAAa,UAAU,CAAA;AAAA,cAClC,aAAY,EAAA,iBAAA;AAAA,cAEX,QAAA,EAAA;AAAA;AAAA;AACH;AAAA;AAAA,KAEJ;AAAA;AAGN;;;;"}

package/dist-es/metric/MetricHeader.js

@@ -1,10 +1,10 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { makePrefixer, Text, Link } from '@salt-ds/core';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
 import { clsx } from 'clsx';
 import { forwardRef, useCallback } from 'react';
 import { useMetricContext } from './internal/MetricContext.js';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
 import css_248z from './MetricHeader.css.js';
 
 const withBaseName = makePrefixer("saltMetricHeader");