@salt-ds/core 1.68.0 → 1.70.0

package/dist-es/overlay/Overlay.js

@@ -13,7 +13,8 @@ const Overlay = ({
   children,
   open,
   onOpenChange,
-  placement: placementProp = "top"
+  placement: placementProp = "top",
+  hideArrow = false
 }) => {
   const arrowRef = useRef(null);
   const [openState, setOpenState] = useControlled({
@@ -26,16 +27,20 @@ const Overlay = ({
     setOpenState(newOpen);
     onOpenChange == null ? void 0 : onOpenChange(newOpen);
   };
+  const middleware = useMemo(
+    () => [
+      offset(8),
+      flip(),
+      shift({ limiter: limitShift() }),
+      arrow({ element: arrowRef })
+    ],
+    []
+  );
   const { x, y, strategy, context, elements, floating, reference } = useFloatingUI({
     open: openState,
     onOpenChange: handleOpenChange,
     placement: placementProp,
-    middleware: [
-      offset(11),
-      flip(),
-      shift({ limiter: limitShift() }),
-      arrow({ element: arrowRef })
-    ]
+    middleware
   });
   const { getReferenceProps, getFloatingProps } = useInteractions([
     useRole(context, { role: "dialog" }),
@@ -43,35 +48,47 @@ const Overlay = ({
     useDismiss(context)
   ]);
   const floatingStyles = useMemo(() => {
-    var _a, _b;
+    const floatingElement = elements.floating;
     return {
       top: y ?? 0,
       left: x ?? 0,
       position: strategy,
-      width: (_a = elements.floating) == null ? void 0 : _a.offsetWidth,
-      height: (_b = elements.floating) == null ? void 0 : _b.offsetHeight
+      width: floatingElement == null ? void 0 : floatingElement.offsetWidth,
+      height: floatingElement == null ? void 0 : floatingElement.offsetHeight
     };
   }, [elements.floating, strategy, x, y]);
-  const arrowProps = {
-    ref: arrowRef,
-    context
-  };
-  return /* @__PURE__ */ jsx(
-    OverlayContext.Provider,
-    {
-      value: {
-        openState,
-        floatingStyles,
-        context,
-        arrowProps,
-        floating,
-        reference,
-        getFloatingProps,
-        getReferenceProps
-      },
-      children
-    }
+  const arrowProps = useMemo(
+    () => ({
+      ref: arrowRef,
+      context
+    }),
+    [context]
+  );
+  const contextValue = useMemo(
+    () => ({
+      openState,
+      floatingStyles,
+      context,
+      arrowProps,
+      hideArrow,
+      floating,
+      reference,
+      getFloatingProps,
+      getReferenceProps
+    }),
+    [
+      openState,
+      floatingStyles,
+      context,
+      arrowProps,
+      hideArrow,
+      floating,
+      reference,
+      getFloatingProps,
+      getReferenceProps
+    ]
   );
+  return /* @__PURE__ */ jsx(OverlayContext.Provider, { value: contextValue, children });
 };
 
 export { Overlay };

package/dist-es/overlay/Overlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"Overlay.js","sources":["../src/overlay/Overlay.tsx"],"sourcesContent":["import {\n  arrow,\n  flip,\n  limitShift,\n  offset,\n  shift,\n  useClick,\n  useDismiss,\n  useInteractions,\n  useRole,\n} from \"@floating-ui/react\";\nimport { type ComponentPropsWithoutRef, useMemo, useRef } from \"react\";\nimport { useControlled, useFloatingUI } from \"../utils\";\nimport { OverlayContext } from \"./OverlayContext\";\n\nexport interface OverlayProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * Display or hide the component.\n   */\n  open?: boolean;\n  /**\n   * Callback function triggered when open state changes.\n   */\n  onOpenChange?: (open: boolean) => void;\n  /*\n   * Set the placement of the Overlay component relative to the trigger element. Defaults to `top`.\n   */\n  placement?: \"top\" | \"bottom\" | \"left\" | \"right\";\n}\n\nexport const Overlay = ({\n  children,\n  open,\n  onOpenChange,\n  placement: placementProp = \"top\",\n}: OverlayProps) => {\n  const arrowRef = useRef<SVGSVGElement | null>(null);\n\n  const [openState, setOpenState] = useControlled({\n    controlled: open,\n    default: false,\n    name: \"Overlay\",\n    state: \"open\",\n  });\n\n  const handleOpenChange = (newOpen: boolean) => {\n    setOpenState(newOpen);\n    onOpenChange?.(newOpen);\n  };\n\n  const { x, y, strategy, context, elements, floating, reference } =\n    useFloatingUI({\n      open: openState,\n      onOpenChange: handleOpenChange,\n      placement: placementProp,\n      middleware: [\n        offset(11),\n        flip(),\n        shift({ limiter: limitShift() }),\n        arrow({ element: arrowRef }),\n      ],\n    });\n\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useRole(context, { role: \"dialog\" }),\n    useClick(context),\n    useDismiss(context),\n  ]);\n\n  const floatingStyles = useMemo(() => {\n    return {\n      top: y ?? 0,\n      left: x ?? 0,\n      position: strategy,\n      width: elements.floating?.offsetWidth,\n      height: elements.floating?.offsetHeight,\n    };\n  }, [elements.floating, strategy, x, y]);\n\n  const arrowProps = {\n    ref: arrowRef,\n    context,\n  };\n\n  return (\n    <OverlayContext.Provider\n      value={{\n        openState,\n        floatingStyles,\n        context,\n        arrowProps,\n        floating,\n        reference,\n        getFloatingProps,\n        getReferenceProps,\n      }}\n    >\n      {children}\n    </OverlayContext.Provider>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;AA8BO,MAAM,UAAU,CAAC;AAAA,EACtB,QAAA;AAAA,EACA,IAAA;AAAA,EACA,YAAA;AAAA,EACA,WAAW,aAAA,GAAgB;AAC7B,CAAA,KAAoB;AAClB,EAAA,MAAM,QAAA,GAAW,OAA6B,IAAI,CAAA;AAElD,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,aAAA,CAAc;AAAA,IAC9C,UAAA,EAAY,IAAA;AAAA,IACZ,OAAA,EAAS,KAAA;AAAA,IACT,IAAA,EAAM,SAAA;AAAA,IACN,KAAA,EAAO;AAAA,GACR,CAAA;AAED,EAAA,MAAM,gBAAA,GAAmB,CAAC,OAAA,KAAqB;AAC7C,IAAA,YAAA,CAAa,OAAO,CAAA;AACpB,IAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAe,OAAA,CAAA;AAAA,EACjB,CAAA;AAEA,EAAA,MAAM,EAAE,GAAG,CAAA,EAAG,QAAA,EAAU,SAAS,QAAA,EAAU,QAAA,EAAU,SAAA,EAAU,GAC7D,aAAA,CAAc;AAAA,IACZ,IAAA,EAAM,SAAA;AAAA,IACN,YAAA,EAAc,gBAAA;AAAA,IACd,SAAA,EAAW,aAAA;AAAA,IACX,UAAA,EAAY;AAAA,MACV,OAAO,EAAE,CAAA;AAAA,MACT,IAAA,EAAK;AAAA,MACL,KAAA,CAAM,EAAE,OAAA,EAAS,UAAA,IAAc,CAAA;AAAA,MAC/B,KAAA,CAAM,EAAE,OAAA,EAAS,QAAA,EAAU;AAAA;AAC7B,GACD,CAAA;AAEH,EAAA,MAAM,EAAE,iBAAA,EAAmB,gBAAA,EAAiB,GAAI,eAAA,CAAgB;AAAA,IAC9D,OAAA,CAAQ,OAAA,EAAS,EAAE,IAAA,EAAM,UAAU,CAAA;AAAA,IACnC,SAAS,OAAO,CAAA;AAAA,IAChB,WAAW,OAAO;AAAA,GACnB,CAAA;AAED,EAAA,MAAM,cAAA,GAAiB,QAAQ,MAAM;AArEvC,IAAA,IAAA,EAAA,EAAA,EAAA;AAsEI,IAAA,OAAO;AAAA,MACL,KAAK,CAAA,IAAK,CAAA;AAAA,MACV,MAAM,CAAA,IAAK,CAAA;AAAA,MACX,QAAA,EAAU,QAAA;AAAA,MACV,KAAA,EAAA,CAAO,EAAA,GAAA,QAAA,CAAS,QAAA,KAAT,IAAA,GAAA,MAAA,GAAA,EAAA,CAAmB,WAAA;AAAA,MAC1B,MAAA,EAAA,CAAQ,EAAA,GAAA,QAAA,CAAS,QAAA,KAAT,IAAA,GAAA,MAAA,GAAA,EAAA,CAAmB;AAAA,KAC7B;AAAA,EACF,GAAG,CAAC,QAAA,CAAS,UAAU,QAAA,EAAU,CAAA,EAAG,CAAC,CAAC,CAAA;AAEtC,EAAA,MAAM,UAAA,GAAa;AAAA,IACjB,GAAA,EAAK,QAAA;AAAA,IACL;AAAA,GACF;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,cAAA,CAAe,QAAA;AAAA,IAAf;AAAA,MACC,KAAA,EAAO;AAAA,QACL,SAAA;AAAA,QACA,cAAA;AAAA,QACA,OAAA;AAAA,QACA,UAAA;AAAA,QACA,QAAA;AAAA,QACA,SAAA;AAAA,QACA,gBAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ;;;;"}
+{"version":3,"file":"Overlay.js","sources":["../src/overlay/Overlay.tsx"],"sourcesContent":["import {\n  arrow,\n  flip,\n  limitShift,\n  offset,\n  shift,\n  useClick,\n  useDismiss,\n  useInteractions,\n  useRole,\n} from \"@floating-ui/react\";\nimport { type ReactNode, useMemo, useRef } from \"react\";\nimport { useControlled, useFloatingUI } from \"../utils\";\nimport { OverlayContext, type OverlayContextValue } from \"./OverlayContext\";\n\nexport interface OverlayProps {\n  /**\n   * The content of the Overlay, typically an `OverlayTrigger` and `OverlayPanel`.\n   */\n  children?: ReactNode;\n  /**\n   * Display or hide the component.\n   */\n  open?: boolean;\n  /**\n   * Callback function triggered when open state changes.\n   */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * Set the placement of the Overlay component relative to the trigger element. Defaults to `top`.\n   */\n  placement?: \"top\" | \"bottom\" | \"left\" | \"right\";\n  /**\n   * When `true`, the arrow indicator is hidden\n   */\n  hideArrow?: boolean;\n}\n\nexport const Overlay = ({\n  children,\n  open,\n  onOpenChange,\n  placement: placementProp = \"top\",\n  hideArrow = false,\n}: OverlayProps) => {\n  const arrowRef = useRef<SVGSVGElement | null>(null);\n\n  const [openState, setOpenState] = useControlled({\n    controlled: open,\n    default: false,\n    name: \"Overlay\",\n    state: \"open\",\n  });\n\n  const handleOpenChange = (newOpen: boolean) => {\n    setOpenState(newOpen);\n    onOpenChange?.(newOpen);\n  };\n\n  const middleware = useMemo(\n    () => [\n      offset(8),\n      flip(),\n      shift({ limiter: limitShift() }),\n      arrow({ element: arrowRef }),\n    ],\n    [],\n  );\n\n  const { x, y, strategy, context, elements, floating, reference } =\n    useFloatingUI({\n      open: openState,\n      onOpenChange: handleOpenChange,\n      placement: placementProp,\n      middleware,\n    });\n\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useRole(context, { role: \"dialog\" }),\n    useClick(context),\n    useDismiss(context),\n  ]);\n\n  const floatingStyles = useMemo(() => {\n    const floatingElement = elements.floating;\n\n    return {\n      top: y ?? 0,\n      left: x ?? 0,\n      position: strategy,\n      width: floatingElement?.offsetWidth,\n      height: floatingElement?.offsetHeight,\n    };\n  }, [elements.floating, strategy, x, y]);\n\n  const arrowProps = useMemo(\n    () => ({\n      ref: arrowRef,\n      context,\n    }),\n    [context],\n  );\n\n  const contextValue = useMemo<OverlayContextValue>(\n    () => ({\n      openState,\n      floatingStyles,\n      context,\n      arrowProps,\n      hideArrow,\n      floating,\n      reference,\n      getFloatingProps,\n      getReferenceProps,\n    }),\n    [\n      openState,\n      floatingStyles,\n      context,\n      arrowProps,\n      hideArrow,\n      floating,\n      reference,\n      getFloatingProps,\n      getReferenceProps,\n    ],\n  );\n\n  return (\n    <OverlayContext.Provider value={contextValue}>\n      {children}\n    </OverlayContext.Provider>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAsCO,MAAM,UAAU,CAAC;AAAA,EACtB,QAAA;AAAA,EACA,IAAA;AAAA,EACA,YAAA;AAAA,EACA,WAAW,aAAA,GAAgB,KAAA;AAAA,EAC3B,SAAA,GAAY;AACd,CAAA,KAAoB;AAClB,EAAA,MAAM,QAAA,GAAW,OAA6B,IAAI,CAAA;AAElD,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,aAAA,CAAc;AAAA,IAC9C,UAAA,EAAY,IAAA;AAAA,IACZ,OAAA,EAAS,KAAA;AAAA,IACT,IAAA,EAAM,SAAA;AAAA,IACN,KAAA,EAAO;AAAA,GACR,CAAA;AAED,EAAA,MAAM,gBAAA,GAAmB,CAAC,OAAA,KAAqB;AAC7C,IAAA,YAAA,CAAa,OAAO,CAAA;AACpB,IAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAe,OAAA,CAAA;AAAA,EACjB,CAAA;AAEA,EAAA,MAAM,UAAA,GAAa,OAAA;AAAA,IACjB,MAAM;AAAA,MACJ,OAAO,CAAC,CAAA;AAAA,MACR,IAAA,EAAK;AAAA,MACL,KAAA,CAAM,EAAE,OAAA,EAAS,UAAA,IAAc,CAAA;AAAA,MAC/B,KAAA,CAAM,EAAE,OAAA,EAAS,QAAA,EAAU;AAAA,KAC7B;AAAA,IACA;AAAC,GACH;AAEA,EAAA,MAAM,EAAE,GAAG,CAAA,EAAG,QAAA,EAAU,SAAS,QAAA,EAAU,QAAA,EAAU,SAAA,EAAU,GAC7D,aAAA,CAAc;AAAA,IACZ,IAAA,EAAM,SAAA;AAAA,IACN,YAAA,EAAc,gBAAA;AAAA,IACd,SAAA,EAAW,aAAA;AAAA,IACX;AAAA,GACD,CAAA;AAEH,EAAA,MAAM,EAAE,iBAAA,EAAmB,gBAAA,EAAiB,GAAI,eAAA,CAAgB;AAAA,IAC9D,OAAA,CAAQ,OAAA,EAAS,EAAE,IAAA,EAAM,UAAU,CAAA;AAAA,IACnC,SAAS,OAAO,CAAA;AAAA,IAChB,WAAW,OAAO;AAAA,GACnB,CAAA;AAED,EAAA,MAAM,cAAA,GAAiB,QAAQ,MAAM;AACnC,IAAA,MAAM,kBAAkB,QAAA,CAAS,QAAA;AAEjC,IAAA,OAAO;AAAA,MACL,KAAK,CAAA,IAAK,CAAA;AAAA,MACV,MAAM,CAAA,IAAK,CAAA;AAAA,MACX,QAAA,EAAU,QAAA;AAAA,MACV,OAAO,eAAA,IAAA,IAAA,GAAA,MAAA,GAAA,eAAA,CAAiB,WAAA;AAAA,MACxB,QAAQ,eAAA,IAAA,IAAA,GAAA,MAAA,GAAA,eAAA,CAAiB;AAAA,KAC3B;AAAA,EACF,GAAG,CAAC,QAAA,CAAS,UAAU,QAAA,EAAU,CAAA,EAAG,CAAC,CAAC,CAAA;AAEtC,EAAA,MAAM,UAAA,GAAa,OAAA;AAAA,IACjB,OAAO;AAAA,MACL,GAAA,EAAK,QAAA;AAAA,MACL;AAAA,KACF,CAAA;AAAA,IACA,CAAC,OAAO;AAAA,GACV;AAEA,EAAA,MAAM,YAAA,GAAe,OAAA;AAAA,IACnB,OAAO;AAAA,MACL,SAAA;AAAA,MACA,cAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA,SAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,gBAAA;AAAA,MACA;AAAA,KACF,CAAA;AAAA,IACA;AAAA,MACE,SAAA;AAAA,MACA,cAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA,SAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,gBAAA;AAAA,MACA;AAAA;AACF,GACF;AAEA,EAAA,2BACG,cAAA,CAAe,QAAA,EAAf,EAAwB,KAAA,EAAO,cAC7B,QAAA,EACH,CAAA;AAEJ;;;;"}

package/dist-es/overlay/OverlayContext.js

@@ -18,6 +18,7 @@ const OverlayContext = createContext(
     },
     context: {},
     arrowProps: {},
+    hideArrow: false,
     reference: {},
     floating: {},
     getFloatingProps() {

package/dist-es/overlay/OverlayContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"OverlayContext.js","sources":["../src/overlay/OverlayContext.ts"],"sourcesContent":["import type {\n  FloatingArrowProps,\n  FloatingContext,\n  ReferenceType,\n  Strategy,\n} from \"@floating-ui/react\";\nimport { type HTMLProps, useContext } from \"react\";\nimport { createContext, type useFloatingUI } from \"../utils\";\n\ntype FloatingReturn = ReturnType<typeof useFloatingUI>;\ntype FloatingStyleProps = {\n  top: number;\n  left: number;\n  position: Strategy;\n  width?: number;\n  height?: number;\n};\n\nexport interface OverlayContextValue {\n  openState: boolean;\n  floatingStyles: FloatingStyleProps;\n  arrowProps: FloatingArrowProps;\n  context: FloatingContext;\n  reference?: (node: ReferenceType | null) => void;\n  floating?: (node: HTMLElement | null) => void;\n  getFloatingProps: (\n    userProps?: HTMLProps<HTMLElement> | undefined,\n  ) => Record<string, unknown>;\n  getReferenceProps: (\n    userProps?: HTMLProps<Element> | undefined,\n  ) => Record<string, unknown>;\n}\n\nexport const OverlayContext = createContext<OverlayContextValue>(\n  \"OverlayContext\",\n  {\n    openState: false,\n    floatingStyles: {\n      top: 0,\n      left: 0,\n      position: \"\" as Strategy,\n    },\n    context: {} as FloatingContext,\n    arrowProps: {} as FloatingArrowProps,\n    reference: {} as FloatingReturn[\"reference\"],\n    floating: {} as FloatingReturn[\"floating\"],\n    getFloatingProps() {\n      return {} as Record<string, unknown>;\n    },\n    getReferenceProps() {\n      return {} as Record<string, unknown>;\n    },\n  },\n);\n\nexport function useOverlayContext() {\n  return useContext(OverlayContext);\n}\n"],"names":[],"mappings":";;;;;;;;;AAiCO,MAAM,cAAA,GAAiB,aAAA;AAAA,EAC5B,gBAAA;AAAA,EACA;AAAA,IACE,SAAA,EAAW,KAAA;AAAA,IACX,cAAA,EAAgB;AAAA,MACd,GAAA,EAAK,CAAA;AAAA,MACL,IAAA,EAAM,CAAA;AAAA,MACN,QAAA,EAAU;AAAA,KACZ;AAAA,IACA,SAAS,EAAC;AAAA,IACV,YAAY,EAAC;AAAA,IACb,WAAW,EAAC;AAAA,IACZ,UAAU,EAAC;AAAA,IACX,gBAAA,GAAmB;AACjB,MAAA,OAAO,EAAC;AAAA,IACV,CAAA;AAAA,IACA,iBAAA,GAAoB;AAClB,MAAA,OAAO,EAAC;AAAA,IACV;AAAA;AAEJ;AAEO,SAAS,iBAAA,GAAoB;AAClC,EAAA,OAAO,WAAW,cAAc,CAAA;AAClC;;;;"}
+{"version":3,"file":"OverlayContext.js","sources":["../src/overlay/OverlayContext.ts"],"sourcesContent":["import type {\n  FloatingArrowProps,\n  FloatingContext,\n  ReferenceType,\n  Strategy,\n} from \"@floating-ui/react\";\nimport { type HTMLProps, useContext } from \"react\";\nimport { createContext, type useFloatingUI } from \"../utils\";\n\ntype FloatingReturn = ReturnType<typeof useFloatingUI>;\ntype FloatingStyleProps = {\n  top: number;\n  left: number;\n  position: Strategy;\n  width?: number;\n  height?: number;\n};\n\nexport interface OverlayContextValue {\n  openState: boolean;\n  floatingStyles: FloatingStyleProps;\n  arrowProps: FloatingArrowProps;\n  hideArrow: boolean;\n  context: FloatingContext;\n  reference?: (node: ReferenceType | null) => void;\n  floating?: (node: HTMLElement | null) => void;\n  getFloatingProps: (\n    userProps?: HTMLProps<HTMLElement> | undefined,\n  ) => Record<string, unknown>;\n  getReferenceProps: (\n    userProps?: HTMLProps<Element> | undefined,\n  ) => Record<string, unknown>;\n}\n\nexport const OverlayContext = createContext<OverlayContextValue>(\n  \"OverlayContext\",\n  {\n    openState: false,\n    floatingStyles: {\n      top: 0,\n      left: 0,\n      position: \"\" as Strategy,\n    },\n    context: {} as FloatingContext,\n    arrowProps: {} as FloatingArrowProps,\n    hideArrow: false,\n    reference: {} as FloatingReturn[\"reference\"],\n    floating: {} as FloatingReturn[\"floating\"],\n    getFloatingProps() {\n      return {} as Record<string, unknown>;\n    },\n    getReferenceProps() {\n      return {} as Record<string, unknown>;\n    },\n  },\n);\n\nexport function useOverlayContext() {\n  return useContext(OverlayContext);\n}\n"],"names":[],"mappings":";;;;;;;;;AAkCO,MAAM,cAAA,GAAiB,aAAA;AAAA,EAC5B,gBAAA;AAAA,EACA;AAAA,IACE,SAAA,EAAW,KAAA;AAAA,IACX,cAAA,EAAgB;AAAA,MACd,GAAA,EAAK,CAAA;AAAA,MACL,IAAA,EAAM,CAAA;AAAA,MACN,QAAA,EAAU;AAAA,KACZ;AAAA,IACA,SAAS,EAAC;AAAA,IACV,YAAY,EAAC;AAAA,IACb,SAAA,EAAW,KAAA;AAAA,IACX,WAAW,EAAC;AAAA,IACZ,UAAU,EAAC;AAAA,IACX,gBAAA,GAAmB;AACjB,MAAA,OAAO,EAAC;AAAA,IACV,CAAA;AAAA,IACA,iBAAA,GAAoB;AAClB,MAAA,OAAO,EAAC;AAAA,IACV;AAAA;AAEJ;AAEO,SAAS,iBAAA,GAAoB;AAClC,EAAA,OAAO,WAAW,cAAc,CAAA;AAClC;;;;"}

package/dist-es/overlay/OverlayPanel.css.js

@@ -1,4 +1,4 @@
-var css_248z = ".saltOverlayPanel {\n  --overlay-borderColor: var(--saltOverlay-borderColor, var(--salt-container-primary-borderColor));\n  --overlay-background: var(--saltOverlay-background, var(--salt-container-primary-background));\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--saltOverlay-fontSize, var(--salt-text-fontSize));\n  font-weight: var(--saltOverlay-fontWeight, var(--salt-text-fontWeight));\n  line-height: var(--saltOverlay-lineHeight, var(--salt-text-lineHeight));\n\n  border-color: var(--overlay-borderColor);\n  border-style: var(--saltOverlay-borderStyle, var(--salt-borderStyle-solid));\n  border-width: var(--saltOverlay-borderWidth, var(--salt-size-fixed-100));\n  border-radius: var(--saltOverlay-borderRadius, var(--salt-palette-corner, 0));\n\n  background: var(--overlay-background);\n  box-shadow: var(--saltOverlay-boxShadow, var(--salt-overlayable-shadow-popout));\n\n  color: var(--saltOverlay-text-color, var(--salt-content-primary-foreground));\n  z-index: var(--saltOverlay-zIndex, var(--salt-zIndex-flyover));\n  width: max-content;\n}\n";
+var css_248z = ".saltOverlayPanel {\n  --overlay-borderColor: var(--saltOverlay-borderColor, var(--salt-container-bold-borderColor));\n  --overlay-background: var(--saltOverlay-background, var(--salt-container-primary-background));\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--saltOverlay-fontSize, var(--salt-text-fontSize));\n  font-weight: var(--saltOverlay-fontWeight, var(--salt-text-fontWeight));\n  line-height: var(--saltOverlay-lineHeight, var(--salt-text-lineHeight));\n\n  border-color: var(--overlay-borderColor);\n  border-style: var(--saltOverlay-borderStyle, var(--salt-borderStyle-solid));\n  border-width: var(--saltOverlay-borderWidth, var(--salt-size-fixed-100));\n  border-radius: var(--saltOverlay-borderRadius, var(--salt-palette-corner, 0));\n\n  background: var(--overlay-background);\n  box-shadow: var(--saltOverlay-boxShadow, var(--salt-overlayable-shadow-popout));\n\n  color: var(--saltOverlay-text-color, var(--salt-content-primary-foreground));\n  z-index: var(--saltOverlay-zIndex, var(--salt-zIndex-flyover));\n  width: max-content;\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=OverlayPanel.css.js.map

package/dist-es/overlay/OverlayPanel.js

@@ -35,7 +35,8 @@ const OverlayPanel = forwardRef(
       context,
       getFloatingProps,
       floating,
-      arrowProps
+      arrowProps,
+      hideArrow
     } = useOverlayContext();
     const handleRef = useForkRef(floating, ref);
     const { top, left, width, height, position } = floatingStyles;
@@ -63,10 +64,11 @@ const OverlayPanel = forwardRef(
             children,
             " "
           ] }),
-          /* @__PURE__ */ jsx(
+          !hideArrow && /* @__PURE__ */ jsx(
             FloatingArrow,
             {
               ...arrowProps,
+              className: withBaseName("arrow"),
               strokeWidth: 1,
               fill: "var(--overlay-background)",
               stroke: "var(--overlay-borderColor)",

package/dist-es/overlay/OverlayPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"OverlayPanel.js","sources":["../src/overlay/OverlayPanel.tsx"],"sourcesContent":["import { FloatingArrow } from \"@floating-ui/react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n} from \"react\";\nimport { makePrefixer, useFloatingComponent, useForkRef } from \"../utils\";\nimport { useOverlayContext } from \"./OverlayContext\";\nimport overlayPanelCss from \"./OverlayPanel.css\";\n\nconst withBaseName = makePrefixer(\"saltOverlayPanel\");\nexport interface OverlayPanelProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content of Overlay Panel\n   */\n  children?: ReactNode;\n}\n\nexport const OverlayPanel = forwardRef<HTMLDivElement, OverlayPanelProps>(\n  function OverlayPanel(props, ref) {\n    const {\n      className,\n      \"aria-labelledby\": ariaLabelledby,\n      children,\n      ...rest\n    } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-overlay-panel\",\n      css: overlayPanelCss,\n      window: targetWindow,\n    });\n\n    const { Component: FloatingComponent } = useFloatingComponent();\n\n    const {\n      openState,\n      floatingStyles,\n      context,\n      getFloatingProps,\n      floating,\n      arrowProps,\n    } = useOverlayContext();\n\n    const handleRef = useForkRef<HTMLDivElement>(floating, ref);\n\n    const { top, left, width, height, position } = floatingStyles;\n\n    return (\n      <FloatingComponent\n        open={openState}\n        className={clsx(withBaseName(), className)}\n        aria-modal=\"true\"\n        {...getFloatingProps()}\n        ref={handleRef}\n        width={width}\n        height={height}\n        top={top}\n        left={left}\n        position={position}\n        focusManagerProps={{\n          context: context,\n          outsideElementsInert: true,\n        }}\n        aria-labelledby={ariaLabelledby}\n      >\n        <div {...rest}> {children} </div>\n        <FloatingArrow\n          {...arrowProps}\n          strokeWidth={1}\n          fill=\"var(--overlay-background)\"\n          stroke=\"var(--overlay-borderColor)\"\n          height={6}\n          width={12}\n        />\n      </FloatingComponent>\n    );\n  },\n);\n"],"names":["OverlayPanel","overlayPanelCss"],"mappings":";;;;;;;;;;;;;;;AAaA,MAAM,YAAA,GAAe,aAAa,kBAAkB,CAAA;AAQ7C,MAAM,YAAA,GAAe,UAAA;AAAA,EAC1B,SAASA,aAAAA,CAAa,KAAA,EAAO,GAAA,EAAK;AAChC,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,iBAAA,EAAmB,cAAA;AAAA,MACnB,QAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,oBAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,EAAE,SAAA,EAAW,iBAAA,EAAkB,GAAI,oBAAA,EAAqB;AAE9D,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,cAAA;AAAA,MACA,OAAA;AAAA,MACA,gBAAA;AAAA,MACA,QAAA;AAAA,MACA;AAAA,QACE,iBAAA,EAAkB;AAEtB,IAAA,MAAM,SAAA,GAAY,UAAA,CAA2B,QAAA,EAAU,GAAG,CAAA;AAE1D,IAAA,MAAM,EAAE,GAAA,EAAK,IAAA,EAAM,KAAA,EAAO,MAAA,EAAQ,UAAS,GAAI,cAAA;AAE/C,IAAA,uBACE,IAAA;AAAA,MAAC,iBAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAM,SAAA;AAAA,QACN,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,YAAA,EAAW,MAAA;AAAA,QACV,GAAG,gBAAA,EAAiB;AAAA,QACrB,GAAA,EAAK,SAAA;AAAA,QACL,KAAA;AAAA,QACA,MAAA;AAAA,QACA,GAAA;AAAA,QACA,IAAA;AAAA,QACA,QAAA;AAAA,QACA,iBAAA,EAAmB;AAAA,UACjB,OAAA;AAAA,UACA,oBAAA,EAAsB;AAAA,SACxB;AAAA,QACA,iBAAA,EAAiB,cAAA;AAAA,QAEjB,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,KAAA,EAAA,EAAK,GAAG,IAAA,EAAM,QAAA,EAAA;AAAA,YAAA,GAAA;AAAA,YAAE,QAAA;AAAA,YAAS;AAAA,WAAA,EAAC,CAAA;AAAA,0BAC3B,GAAA;AAAA,YAAC,aAAA;AAAA,YAAA;AAAA,cACE,GAAG,UAAA;AAAA,cACJ,WAAA,EAAa,CAAA;AAAA,cACb,IAAA,EAAK,2BAAA;AAAA,cACL,MAAA,EAAO,4BAAA;AAAA,cACP,MAAA,EAAQ,CAAA;AAAA,cACR,KAAA,EAAO;AAAA;AAAA;AACT;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;;;;"}
+{"version":3,"file":"OverlayPanel.js","sources":["../src/overlay/OverlayPanel.tsx"],"sourcesContent":["import { FloatingArrow } from \"@floating-ui/react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n} from \"react\";\nimport { makePrefixer, useFloatingComponent, useForkRef } from \"../utils\";\nimport { useOverlayContext } from \"./OverlayContext\";\nimport overlayPanelCss from \"./OverlayPanel.css\";\n\nconst withBaseName = makePrefixer(\"saltOverlayPanel\");\nexport interface OverlayPanelProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content of Overlay Panel\n   */\n  children?: ReactNode;\n}\n\nexport const OverlayPanel = forwardRef<HTMLDivElement, OverlayPanelProps>(\n  function OverlayPanel(props, ref) {\n    const {\n      className,\n      \"aria-labelledby\": ariaLabelledby,\n      children,\n      ...rest\n    } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-overlay-panel\",\n      css: overlayPanelCss,\n      window: targetWindow,\n    });\n\n    const { Component: FloatingComponent } = useFloatingComponent();\n\n    const {\n      openState,\n      floatingStyles,\n      context,\n      getFloatingProps,\n      floating,\n      arrowProps,\n      hideArrow,\n    } = useOverlayContext();\n\n    const handleRef = useForkRef<HTMLDivElement>(floating, ref);\n\n    const { top, left, width, height, position } = floatingStyles;\n\n    return (\n      <FloatingComponent\n        open={openState}\n        className={clsx(withBaseName(), className)}\n        aria-modal=\"true\"\n        {...getFloatingProps()}\n        ref={handleRef}\n        width={width}\n        height={height}\n        top={top}\n        left={left}\n        position={position}\n        focusManagerProps={{\n          context: context,\n          outsideElementsInert: true,\n        }}\n        aria-labelledby={ariaLabelledby}\n      >\n        <div {...rest}> {children} </div>\n        {!hideArrow && (\n          <FloatingArrow\n            {...arrowProps}\n            className={withBaseName(\"arrow\")}\n            strokeWidth={1}\n            fill=\"var(--overlay-background)\"\n            stroke=\"var(--overlay-borderColor)\"\n            height={6}\n            width={12}\n          />\n        )}\n      </FloatingComponent>\n    );\n  },\n);\n"],"names":["OverlayPanel","overlayPanelCss"],"mappings":";;;;;;;;;;;;;;;AAaA,MAAM,YAAA,GAAe,aAAa,kBAAkB,CAAA;AAQ7C,MAAM,YAAA,GAAe,UAAA;AAAA,EAC1B,SAASA,aAAAA,CAAa,KAAA,EAAO,GAAA,EAAK;AAChC,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,iBAAA,EAAmB,cAAA;AAAA,MACnB,QAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,oBAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,EAAE,SAAA,EAAW,iBAAA,EAAkB,GAAI,oBAAA,EAAqB;AAE9D,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,cAAA;AAAA,MACA,OAAA;AAAA,MACA,gBAAA;AAAA,MACA,QAAA;AAAA,MACA,UAAA;AAAA,MACA;AAAA,QACE,iBAAA,EAAkB;AAEtB,IAAA,MAAM,SAAA,GAAY,UAAA,CAA2B,QAAA,EAAU,GAAG,CAAA;AAE1D,IAAA,MAAM,EAAE,GAAA,EAAK,IAAA,EAAM,KAAA,EAAO,MAAA,EAAQ,UAAS,GAAI,cAAA;AAE/C,IAAA,uBACE,IAAA;AAAA,MAAC,iBAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAM,SAAA;AAAA,QACN,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,YAAA,EAAW,MAAA;AAAA,QACV,GAAG,gBAAA,EAAiB;AAAA,QACrB,GAAA,EAAK,SAAA;AAAA,QACL,KAAA;AAAA,QACA,MAAA;AAAA,QACA,GAAA;AAAA,QACA,IAAA;AAAA,QACA,QAAA;AAAA,QACA,iBAAA,EAAmB;AAAA,UACjB,OAAA;AAAA,UACA,oBAAA,EAAsB;AAAA,SACxB;AAAA,QACA,iBAAA,EAAiB,cAAA;AAAA,QAEjB,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,KAAA,EAAA,EAAK,GAAG,IAAA,EAAM,QAAA,EAAA;AAAA,YAAA,GAAA;AAAA,YAAE,QAAA;AAAA,YAAS;AAAA,WAAA,EAAC,CAAA;AAAA,UAC1B,CAAC,SAAA,oBACA,GAAA;AAAA,YAAC,aAAA;AAAA,YAAA;AAAA,cACE,GAAG,UAAA;AAAA,cACJ,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,cAC/B,WAAA,EAAa,CAAA;AAAA,cACb,IAAA,EAAK,2BAAA;AAAA,cACL,MAAA,EAAO,4BAAA;AAAA,cACP,MAAA,EAAQ,CAAA;AAAA,cACR,KAAA,EAAO;AAAA;AAAA;AACT;AAAA;AAAA,KAEJ;AAAA,EAEJ;AACF;;;;"}

package/dist-es/semantic-icon-provider/SemanticIconProvider.js

@@ -1,5 +1,5 @@
 import { jsx } from 'react/jsx-runtime';
-import { WarningSolidIcon, UserSolidIcon, UploadIcon, SuccessCircleSolidIcon, FavoriteStrongIcon, FavoriteSolidIcon, FavoriteIcon, ChevronLeftIcon, StepDefaultIcon, OverflowMenuIcon, ChevronRightIcon, LockedIcon, ProgressInprogressIcon, InfoSolidIcon, TriangleUpIcon, TearOutIcon, ChevronDownIcon, ErrorSolidIcon, TriangleDownIcon, DoubleChevronRightIcon, DoubleChevronLeftIcon, ChevronUpIcon, CloseIcon, CalendarIcon, StepActiveIcon } from '@salt-ds/icons';
+import { WarningSolidIcon, UserIcon, UploadIcon, SuccessCircleSolidIcon, FavoriteStrongIcon, FavoriteSolidIcon, FavoriteIcon, ChevronLeftIcon, StepDefaultIcon, OverflowMenuIcon, ChevronRightIcon, LockedIcon, ProgressInprogressIcon, InfoSolidIcon, TriangleUpIcon, TearOutIcon, ChevronDownIcon, ErrorSolidIcon, BankIcon, TriangleDownIcon, DoubleChevronRightIcon, DoubleChevronLeftIcon, ChevronUpIcon, CloseIcon, CalendarIcon, StepActiveIcon } from '@salt-ds/icons';
 import { createContext, useContext } from 'react';
 import { ErrorAdornmentIcon } from '../status-adornment/ErrorAdornment.js';
 import { SuccessAdornmentIcon } from '../status-adornment/SuccessAdornment.js';
@@ -15,6 +15,7 @@ const defaultIconMap = {
   CollapseRightIcon: DoubleChevronRightIcon,
   CompletedIcon: SuccessCircleSolidIcon,
   DecreaseIcon: TriangleDownIcon,
+  EntityIcon: BankIcon,
   ErrorIcon: ErrorSolidIcon,
   ErrorStatusAdornment: ErrorAdornmentIcon,
   ExpandGroupIcon: ChevronRightIcon,
@@ -35,7 +36,7 @@ const defaultIconMap = {
   SuccessIcon: SuccessCircleSolidIcon,
   SuccessStatusAdornment: SuccessAdornmentIcon,
   UploadIcon,
-  UserIcon: UserSolidIcon,
+  UserIcon,
   WarningIcon: WarningSolidIcon,
   WarningStatusAdornment: WarningAdornmentIcon
 };

package/dist-es/semantic-icon-provider/SemanticIconProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"SemanticIconProvider.js","sources":["../src/semantic-icon-provider/SemanticIconProvider.tsx"],"sourcesContent":["import {\n  CalendarIcon,\n  ChevronDownIcon,\n  ChevronLeftIcon,\n  ChevronRightIcon,\n  ChevronUpIcon,\n  CloseIcon,\n  DoubleChevronLeftIcon,\n  DoubleChevronRightIcon,\n  ErrorSolidIcon,\n  FavoriteIcon,\n  FavoriteSolidIcon,\n  FavoriteStrongIcon,\n  InfoSolidIcon,\n  LockedIcon,\n  OverflowMenuIcon,\n  ProgressInprogressIcon,\n  StepActiveIcon,\n  StepDefaultIcon,\n  SuccessCircleSolidIcon,\n  TearOutIcon,\n  TriangleDownIcon,\n  TriangleUpIcon,\n  UploadIcon,\n  UserSolidIcon,\n  WarningSolidIcon,\n} from \"@salt-ds/icons\";\nimport {\n  createContext,\n  type ElementType,\n  type ReactNode,\n  useContext,\n} from \"react\";\nimport { ErrorAdornmentIcon } from \"../status-adornment/ErrorAdornment\";\nimport { SuccessAdornmentIcon } from \"../status-adornment/SuccessAdornment\";\nimport { WarningAdornmentIcon } from \"../status-adornment/WarningAdornment\";\n\nexport interface SemanticIconMap {\n  ActiveIcon: ElementType;\n  CalendarIcon: ElementType;\n  CloseIcon: ElementType;\n  CollapseGroupIcon: ElementType;\n  CollapseIcon: ElementType;\n  CollapseLeftIcon: ElementType;\n  CollapseRightIcon: ElementType;\n  CompletedIcon: ElementType;\n  DecreaseIcon: ElementType;\n  ErrorIcon: ElementType;\n  ErrorStatusAdornment: ElementType;\n  ExpandGroupIcon: ElementType;\n  ExpandIcon: ElementType;\n  ExternalIcon: ElementType;\n  IncreaseIcon: ElementType;\n  InfoIcon: ElementType;\n  InProgressIcon: ElementType;\n  LockedIcon: ElementType;\n  LevelSeparatorIcon: ElementType;\n  NextIcon: ElementType;\n  OverflowIcon: ElementType;\n  PendingIcon: ElementType;\n  PreviousIcon: ElementType;\n  RatingIcon: ElementType;\n  RatingSelectedIcon: ElementType;\n  RatingUnselectingIcon: ElementType;\n  SuccessIcon: ElementType;\n  SuccessStatusAdornment: ElementType;\n  UploadIcon: ElementType;\n  UserIcon: ElementType;\n  WarningIcon: ElementType;\n  WarningStatusAdornment: ElementType;\n}\n\nexport interface SemanticIconProviderProps {\n  /**\n   * Custom mapping of icon names to components. Overrides default icons if provided.\n   */\n  iconMap?: Partial<SemanticIconMap>;\n\n  /**\n   * Child elements that will use the provided icons.\n   */\n  children: ReactNode;\n}\n\nconst defaultIconMap: SemanticIconMap = {\n  ActiveIcon: StepActiveIcon,\n  CalendarIcon: CalendarIcon,\n  CloseIcon: CloseIcon,\n  CollapseGroupIcon: ChevronDownIcon,\n  CollapseIcon: ChevronUpIcon,\n  CollapseLeftIcon: DoubleChevronLeftIcon,\n  CollapseRightIcon: DoubleChevronRightIcon,\n  CompletedIcon: SuccessCircleSolidIcon,\n  DecreaseIcon: TriangleDownIcon,\n  ErrorIcon: ErrorSolidIcon,\n  ErrorStatusAdornment: ErrorAdornmentIcon,\n  ExpandGroupIcon: ChevronRightIcon,\n  ExpandIcon: ChevronDownIcon,\n  ExternalIcon: TearOutIcon,\n  IncreaseIcon: TriangleUpIcon,\n  InfoIcon: InfoSolidIcon,\n  InProgressIcon: ProgressInprogressIcon,\n  LockedIcon: LockedIcon,\n  LevelSeparatorIcon: ChevronRightIcon,\n  NextIcon: ChevronRightIcon,\n  OverflowIcon: OverflowMenuIcon,\n  PendingIcon: StepDefaultIcon,\n  PreviousIcon: ChevronLeftIcon,\n  RatingIcon: FavoriteIcon,\n  RatingSelectedIcon: FavoriteSolidIcon,\n  RatingUnselectingIcon: FavoriteStrongIcon,\n  SuccessIcon: SuccessCircleSolidIcon,\n  SuccessStatusAdornment: SuccessAdornmentIcon,\n  UploadIcon,\n  UserIcon: UserSolidIcon,\n  WarningIcon: WarningSolidIcon,\n  WarningStatusAdornment: WarningAdornmentIcon,\n};\n\nconst SemanticIconContext = createContext<SemanticIconMap>(defaultIconMap);\n\nexport const SemanticIconProvider = ({\n  iconMap = {},\n  children,\n}: SemanticIconProviderProps) => (\n  <SemanticIconContext.Provider value={{ ...defaultIconMap, ...iconMap }}>\n    {children}\n  </SemanticIconContext.Provider>\n);\n\nexport const useIcon = () => {\n  const context = useContext(SemanticIconContext);\n  return context || defaultIconMap;\n};\n"],"names":[],"mappings":";;;;;;;AAoFA,MAAM,cAAA,GAAkC;AAAA,EACtC,UAAA,EAAY,cAAA;AAAA,EACZ,YAAA;AAAA,EACA,SAAA;AAAA,EACA,iBAAA,EAAmB,eAAA;AAAA,EACnB,YAAA,EAAc,aAAA;AAAA,EACd,gBAAA,EAAkB,qBAAA;AAAA,EAClB,iBAAA,EAAmB,sBAAA;AAAA,EACnB,aAAA,EAAe,sBAAA;AAAA,EACf,YAAA,EAAc,gBAAA;AAAA,EACd,SAAA,EAAW,cAAA;AAAA,EACX,oBAAA,EAAsB,kBAAA;AAAA,EACtB,eAAA,EAAiB,gBAAA;AAAA,EACjB,UAAA,EAAY,eAAA;AAAA,EACZ,YAAA,EAAc,WAAA;AAAA,EACd,YAAA,EAAc,cAAA;AAAA,EACd,QAAA,EAAU,aAAA;AAAA,EACV,cAAA,EAAgB,sBAAA;AAAA,EAChB,UAAA;AAAA,EACA,kBAAA,EAAoB,gBAAA;AAAA,EACpB,QAAA,EAAU,gBAAA;AAAA,EACV,YAAA,EAAc,gBAAA;AAAA,EACd,WAAA,EAAa,eAAA;AAAA,EACb,YAAA,EAAc,eAAA;AAAA,EACd,UAAA,EAAY,YAAA;AAAA,EACZ,kBAAA,EAAoB,iBAAA;AAAA,EACpB,qBAAA,EAAuB,kBAAA;AAAA,EACvB,WAAA,EAAa,sBAAA;AAAA,EACb,sBAAA,EAAwB,oBAAA;AAAA,EACxB,UAAA;AAAA,EACA,QAAA,EAAU,aAAA;AAAA,EACV,WAAA,EAAa,gBAAA;AAAA,EACb,sBAAA,EAAwB;AAC1B,CAAA;AAEA,MAAM,mBAAA,GAAsB,cAA+B,cAAc,CAAA;AAElE,MAAM,uBAAuB,CAAC;AAAA,EACnC,UAAU,EAAC;AAAA,EACX;AACF,CAAA,qBACE,GAAA,CAAC,mBAAA,CAAoB,QAAA,EAApB,EAA6B,KAAA,EAAO,EAAE,GAAG,cAAA,EAAgB,GAAG,OAAA,EAAQ,EAClE,QAAA,EACH;AAGK,MAAM,UAAU,MAAM;AAC3B,EAAA,MAAM,OAAA,GAAU,WAAW,mBAAmB,CAAA;AAC9C,EAAA,OAAO,OAAA,IAAW,cAAA;AACpB;;;;"}
+{"version":3,"file":"SemanticIconProvider.js","sources":["../src/semantic-icon-provider/SemanticIconProvider.tsx"],"sourcesContent":["import {\n  BankIcon,\n  CalendarIcon,\n  ChevronDownIcon,\n  ChevronLeftIcon,\n  ChevronRightIcon,\n  ChevronUpIcon,\n  CloseIcon,\n  DoubleChevronLeftIcon,\n  DoubleChevronRightIcon,\n  ErrorSolidIcon,\n  FavoriteIcon,\n  FavoriteSolidIcon,\n  FavoriteStrongIcon,\n  InfoSolidIcon,\n  LockedIcon,\n  OverflowMenuIcon,\n  ProgressInprogressIcon,\n  StepActiveIcon,\n  StepDefaultIcon,\n  SuccessCircleSolidIcon,\n  TearOutIcon,\n  TriangleDownIcon,\n  TriangleUpIcon,\n  UploadIcon,\n  UserIcon,\n  WarningSolidIcon,\n} from \"@salt-ds/icons\";\nimport {\n  createContext,\n  type ElementType,\n  type ReactNode,\n  useContext,\n} from \"react\";\nimport { ErrorAdornmentIcon } from \"../status-adornment/ErrorAdornment\";\nimport { SuccessAdornmentIcon } from \"../status-adornment/SuccessAdornment\";\nimport { WarningAdornmentIcon } from \"../status-adornment/WarningAdornment\";\n\nexport interface SemanticIconMap {\n  ActiveIcon: ElementType;\n  CalendarIcon: ElementType;\n  CloseIcon: ElementType;\n  CollapseGroupIcon: ElementType;\n  CollapseIcon: ElementType;\n  CollapseLeftIcon: ElementType;\n  CollapseRightIcon: ElementType;\n  CompletedIcon: ElementType;\n  DecreaseIcon: ElementType;\n  EntityIcon: ElementType;\n  ErrorIcon: ElementType;\n  ErrorStatusAdornment: ElementType;\n  ExpandGroupIcon: ElementType;\n  ExpandIcon: ElementType;\n  ExternalIcon: ElementType;\n  IncreaseIcon: ElementType;\n  InfoIcon: ElementType;\n  InProgressIcon: ElementType;\n  LockedIcon: ElementType;\n  LevelSeparatorIcon: ElementType;\n  NextIcon: ElementType;\n  OverflowIcon: ElementType;\n  PendingIcon: ElementType;\n  PreviousIcon: ElementType;\n  RatingIcon: ElementType;\n  RatingSelectedIcon: ElementType;\n  RatingUnselectingIcon: ElementType;\n  SuccessIcon: ElementType;\n  SuccessStatusAdornment: ElementType;\n  UploadIcon: ElementType;\n  UserIcon: ElementType;\n  WarningIcon: ElementType;\n  WarningStatusAdornment: ElementType;\n}\n\nexport interface SemanticIconProviderProps {\n  /**\n   * Custom mapping of icon names to components. Overrides default icons if provided.\n   */\n  iconMap?: Partial<SemanticIconMap>;\n\n  /**\n   * Child elements that will use the provided icons.\n   */\n  children: ReactNode;\n}\n\nconst defaultIconMap: SemanticIconMap = {\n  ActiveIcon: StepActiveIcon,\n  CalendarIcon: CalendarIcon,\n  CloseIcon: CloseIcon,\n  CollapseGroupIcon: ChevronDownIcon,\n  CollapseIcon: ChevronUpIcon,\n  CollapseLeftIcon: DoubleChevronLeftIcon,\n  CollapseRightIcon: DoubleChevronRightIcon,\n  CompletedIcon: SuccessCircleSolidIcon,\n  DecreaseIcon: TriangleDownIcon,\n  EntityIcon: BankIcon,\n  ErrorIcon: ErrorSolidIcon,\n  ErrorStatusAdornment: ErrorAdornmentIcon,\n  ExpandGroupIcon: ChevronRightIcon,\n  ExpandIcon: ChevronDownIcon,\n  ExternalIcon: TearOutIcon,\n  IncreaseIcon: TriangleUpIcon,\n  InfoIcon: InfoSolidIcon,\n  InProgressIcon: ProgressInprogressIcon,\n  LockedIcon: LockedIcon,\n  LevelSeparatorIcon: ChevronRightIcon,\n  NextIcon: ChevronRightIcon,\n  OverflowIcon: OverflowMenuIcon,\n  PendingIcon: StepDefaultIcon,\n  PreviousIcon: ChevronLeftIcon,\n  RatingIcon: FavoriteIcon,\n  RatingSelectedIcon: FavoriteSolidIcon,\n  RatingUnselectingIcon: FavoriteStrongIcon,\n  SuccessIcon: SuccessCircleSolidIcon,\n  SuccessStatusAdornment: SuccessAdornmentIcon,\n  UploadIcon,\n  UserIcon: UserIcon,\n  WarningIcon: WarningSolidIcon,\n  WarningStatusAdornment: WarningAdornmentIcon,\n};\n\nconst SemanticIconContext = createContext<SemanticIconMap>(defaultIconMap);\n\nexport const SemanticIconProvider = ({\n  iconMap = {},\n  children,\n}: SemanticIconProviderProps) => (\n  <SemanticIconContext.Provider value={{ ...defaultIconMap, ...iconMap }}>\n    {children}\n  </SemanticIconContext.Provider>\n);\n\nexport const useIcon = () => {\n  const context = useContext(SemanticIconContext);\n  return context || defaultIconMap;\n};\n"],"names":[],"mappings":";;;;;;;AAsFA,MAAM,cAAA,GAAkC;AAAA,EACtC,UAAA,EAAY,cAAA;AAAA,EACZ,YAAA;AAAA,EACA,SAAA;AAAA,EACA,iBAAA,EAAmB,eAAA;AAAA,EACnB,YAAA,EAAc,aAAA;AAAA,EACd,gBAAA,EAAkB,qBAAA;AAAA,EAClB,iBAAA,EAAmB,sBAAA;AAAA,EACnB,aAAA,EAAe,sBAAA;AAAA,EACf,YAAA,EAAc,gBAAA;AAAA,EACd,UAAA,EAAY,QAAA;AAAA,EACZ,SAAA,EAAW,cAAA;AAAA,EACX,oBAAA,EAAsB,kBAAA;AAAA,EACtB,eAAA,EAAiB,gBAAA;AAAA,EACjB,UAAA,EAAY,eAAA;AAAA,EACZ,YAAA,EAAc,WAAA;AAAA,EACd,YAAA,EAAc,cAAA;AAAA,EACd,QAAA,EAAU,aAAA;AAAA,EACV,cAAA,EAAgB,sBAAA;AAAA,EAChB,UAAA;AAAA,EACA,kBAAA,EAAoB,gBAAA;AAAA,EACpB,QAAA,EAAU,gBAAA;AAAA,EACV,YAAA,EAAc,gBAAA;AAAA,EACd,WAAA,EAAa,eAAA;AAAA,EACb,YAAA,EAAc,eAAA;AAAA,EACd,UAAA,EAAY,YAAA;AAAA,EACZ,kBAAA,EAAoB,iBAAA;AAAA,EACpB,qBAAA,EAAuB,kBAAA;AAAA,EACvB,WAAA,EAAa,sBAAA;AAAA,EACb,sBAAA,EAAwB,oBAAA;AAAA,EACxB,UAAA;AAAA,EACA,QAAA;AAAA,EACA,WAAA,EAAa,gBAAA;AAAA,EACb,sBAAA,EAAwB;AAC1B,CAAA;AAEA,MAAM,mBAAA,GAAsB,cAA+B,cAAc,CAAA;AAElE,MAAM,uBAAuB,CAAC;AAAA,EACnC,UAAU,EAAC;AAAA,EACX;AACF,CAAA,qBACE,GAAA,CAAC,mBAAA,CAAoB,QAAA,EAApB,EAA6B,KAAA,EAAO,EAAE,GAAG,cAAA,EAAgB,GAAG,OAAA,EAAQ,EAClE,QAAA,EACH;AAGK,MAAM,UAAU,MAAM;AAC3B,EAAA,MAAM,OAAA,GAAU,WAAW,mBAAmB,CAAA;AAC9C,EAAA,OAAO,OAAA,IAAW,cAAA;AACpB;;;;"}

package/dist-es/side-panel/SidePanel.css.js

@@ -1,4 +1,4 @@
-var css_248z = ".saltSidePanel {\n  --saltSidePanel-width: 300px;\n  --sidePanel-border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--sidePanel-borderColor, var(--salt-container-primary-borderColor));\n  --saltSidePanel-padding: var(--salt-spacing-300);\n  /* Outer wrapper. Idle: a normal flex column whose width comes from\n     --saltSidePanel-width (supports any CSS length, including %).\n     During enter/exit animation: animates `width` between 0 and the\n     panel width and clips the absolutely-positioned inner via\n     `contain: paint`. The inner uses a JS-resolved px width during\n     animation (--saltSidePanel-animation-width) so percentage widths\n     don't compound against the animating outer. */\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  flex: none;\n  width: var(--saltSidePanel-width);\n  height: 100%;\n  min-height: 0;\n  align-self: stretch;\n}\n\n.saltSidePanel-primary {\n  --sidePanel-background: var(--salt-container-primary-background);\n  --sidePanel-borderColor: var(--salt-container-primary-borderColor);\n}\n\n.saltSidePanel-secondary {\n  --sidePanel-background: var(--salt-container-secondary-background);\n  --sidePanel-borderColor: var(--salt-container-secondary-borderColor);\n}\n\n.saltSidePanel-tertiary {\n  --sidePanel-background: var(--salt-container-tertiary-background);\n  --sidePanel-borderColor: var(--salt-container-tertiary-borderColor);\n}\n\n.saltSidePanel-none {\n  --sidePanel-background: none;\n  --saltSidePanel-padding: var(--salt-spacing-200);\n}\n\n.saltSidePanel-inner {\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  min-height: 0;\n  padding: var(--saltSidePanel-padding);\n  width: 100%;\n  background-color: var(--sidePanel-background, var(--salt-container-primary-background));\n}\n\n.saltSidePanel-left .saltSidePanel-inner {\n  border-right: var(--sidePanel-border);\n}\n\n.saltSidePanel-right .saltSidePanel-inner {\n  border-left: var(--sidePanel-border);\n}\n\n.saltSidePanel-none .saltSidePanel-inner {\n  border: none;\n}\n\n/* Animation: outer becomes the gap + clip; inner is absolutely positioned\n   and anchored to the gap's GROWING edge so the leading edge tracks the\n   gap's expansion — content visibly pushes the sibling rather than being\n   revealed in place. Left grows rightward → anchor inner right; right\n   grows leftward → anchor inner left.\n\n   During animation the outer's width is interpolating, so the inner can't\n   rely on --saltSidePanel-width (which may be a percentage that would\n   resolve against the animating outer). Instead the JS layer measures the\n   resolved width once and exposes it as --saltSidePanel-animation-width\n   (a px value) for the inner to use. */\n.saltSidePanel-enterAnimation,\n.saltSidePanel-exitAnimation {\n  contain: paint;\n}\n\n.saltSidePanel-enterAnimation .saltSidePanel-inner,\n.saltSidePanel-exitAnimation .saltSidePanel-inner {\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  flex: none;\n  width: var(--saltSidePanel-animation-width, var(--saltSidePanel-width));\n}\n\n.saltSidePanel-left.saltSidePanel-enterAnimation .saltSidePanel-inner,\n.saltSidePanel-left.saltSidePanel-exitAnimation .saltSidePanel-inner {\n  right: 0;\n}\n\n.saltSidePanel-right.saltSidePanel-enterAnimation .saltSidePanel-inner,\n.saltSidePanel-right.saltSidePanel-exitAnimation .saltSidePanel-inner {\n  left: 0;\n}\n\n.saltSidePanel-exitAnimation .saltSidePanel-inner {\n  pointer-events: none;\n}\n\n.saltSidePanel-enterAnimation {\n  animation: saltSidePanel-open var(--salt-duration-perceptible) var(--salt-animation-timing-function);\n}\n\n.saltSidePanel-exitAnimation {\n  animation: saltSidePanel-close var(--salt-duration-perceptible) var(--salt-animation-timing-function) both;\n}\n\n@keyframes saltSidePanel-open {\n  from {\n    width: 0;\n  }\n}\n\n@keyframes saltSidePanel-close {\n  to {\n    width: 0;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .saltSidePanel-enterAnimation,\n  .saltSidePanel-exitAnimation {\n    animation: none;\n  }\n}\n";
+var css_248z = ".saltSidePanel {\n  --saltSidePanel-width: 300px;\n  --sidePanel-border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--sidePanel-borderColor, var(--salt-container-bold-borderColor));\n  --saltSidePanel-padding: var(--salt-spacing-300);\n  /* Outer wrapper. Idle: a normal flex column whose width comes from\n     --saltSidePanel-width (supports any CSS length, including %).\n     During enter/exit animation: animates `width` between 0 and the\n     panel width and clips the absolutely-positioned inner via\n     `contain: paint`. The inner uses a JS-resolved px width during\n     animation (--saltSidePanel-animation-width) so percentage widths\n     don't compound against the animating outer. */\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  flex: none;\n  width: var(--saltSidePanel-width);\n  height: 100%;\n  min-height: 0;\n  align-self: stretch;\n}\n\n.saltSidePanel-primary {\n  --sidePanel-background: var(--salt-container-primary-background);\n  --sidePanel-borderColor: var(--salt-container-bold-borderColor);\n}\n\n.saltSidePanel-secondary {\n  --sidePanel-background: var(--salt-container-secondary-background);\n  --sidePanel-borderColor: var(--salt-container-bold-borderColor);\n}\n\n.saltSidePanel-tertiary {\n  --sidePanel-background: var(--salt-container-tertiary-background);\n  --sidePanel-borderColor: var(--salt-container-bold-borderColor);\n}\n\n.saltSidePanel-none {\n  --sidePanel-background: none;\n  --saltSidePanel-padding: var(--salt-spacing-200);\n}\n\n.saltSidePanel-inner {\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  min-height: 0;\n  padding: var(--saltSidePanel-padding);\n  width: 100%;\n  background-color: var(--sidePanel-background, var(--salt-container-primary-background));\n}\n\n.saltSidePanel-left .saltSidePanel-inner {\n  border-right: var(--sidePanel-border);\n}\n\n.saltSidePanel-right .saltSidePanel-inner {\n  border-left: var(--sidePanel-border);\n}\n\n.saltSidePanel-none .saltSidePanel-inner {\n  border: none;\n}\n\n/* Animation: outer becomes the gap + clip; inner is absolutely positioned\n   and anchored to the gap's GROWING edge so the leading edge tracks the\n   gap's expansion — content visibly pushes the sibling rather than being\n   revealed in place. Left grows rightward → anchor inner right; right\n   grows leftward → anchor inner left.\n\n   During animation the outer's width is interpolating, so the inner can't\n   rely on --saltSidePanel-width (which may be a percentage that would\n   resolve against the animating outer). Instead the JS layer measures the\n   resolved width once and exposes it as --saltSidePanel-animation-width\n   (a px value) for the inner to use. */\n.saltSidePanel-enterAnimation,\n.saltSidePanel-exitAnimation {\n  contain: paint;\n}\n\n.saltSidePanel-enterAnimation .saltSidePanel-inner,\n.saltSidePanel-exitAnimation .saltSidePanel-inner {\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  flex: none;\n  width: var(--saltSidePanel-animation-width, var(--saltSidePanel-width));\n}\n\n.saltSidePanel-left.saltSidePanel-enterAnimation .saltSidePanel-inner,\n.saltSidePanel-left.saltSidePanel-exitAnimation .saltSidePanel-inner {\n  right: 0;\n}\n\n.saltSidePanel-right.saltSidePanel-enterAnimation .saltSidePanel-inner,\n.saltSidePanel-right.saltSidePanel-exitAnimation .saltSidePanel-inner {\n  left: 0;\n}\n\n.saltSidePanel-exitAnimation .saltSidePanel-inner {\n  pointer-events: none;\n}\n\n.saltSidePanel-enterAnimation {\n  animation: saltSidePanel-open var(--salt-duration-perceptible) var(--salt-animation-timing-function);\n}\n\n.saltSidePanel-exitAnimation {\n  animation: saltSidePanel-close var(--salt-duration-perceptible) var(--salt-animation-timing-function) both;\n}\n\n@keyframes saltSidePanel-open {\n  from {\n    width: 0;\n  }\n}\n\n@keyframes saltSidePanel-close {\n  to {\n    width: 0;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .saltSidePanel-enterAnimation,\n  .saltSidePanel-exitAnimation {\n    animation: none;\n  }\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=SidePanel.css.js.map

package/dist-es/slider/internal/SliderTooltip.css.js

@@ -1,4 +1,4 @@
-var css_248z = ".saltSliderTooltip {\n  background: var(--salt-container-primary-background);\n  border-color: var(--salt-container-primary-borderColor);\n  border-style: var(--saltTooltip-borderStyle, var(--salt-borderStyle-solid));\n  border-width: var(--saltTooltip-borderWidth, var(--salt-size-fixed-100));\n  border-radius: var(--saltTooltip-borderRadius, var(--salt-palette-corner-weak, 0));\n  box-shadow: var(--saltTooltip-shadow, var(--salt-overlayable-shadow-popout));\n  bottom: 50%;\n  left: 50%;\n  padding: var(--salt-spacing-50) var(--salt-spacing-100);\n  position: absolute;\n  transform: translate(-50%, -50%);\n  text-align: var(--saltTooltip-textAlign, left);\n  user-select: none;\n  visibility: hidden;\n  z-index: var(--saltTooltip-zIndex, var(--salt-zIndex-flyover));\n}\n\n.saltSliderTooltip-visible,\n.saltSliderTooltip:hover {\n  visibility: visible;\n}\n\n.saltSliderTooltip-arrow {\n  fill: var(--salt-container-primary-background);\n  height: var(--salt-size-icon);\n  left: 50%;\n  position: absolute;\n  pointer-events: none;\n  top: 100%;\n  transform: translateX(-50%);\n  stroke: var(--salt-container-primary-borderColor);\n  stroke-width: var(--salt-size-fixed-100);\n  width: var(--salt-size-icon);\n}\n\n.saltSliderTooltip-text {\n  white-space: nowrap;\n}\n";
+var css_248z = ".saltSliderTooltip {\n  background: var(--salt-container-primary-background);\n  border-color: var(--salt-container-bold-borderColor);\n  border-style: var(--saltTooltip-borderStyle, var(--salt-borderStyle-solid));\n  border-width: var(--saltTooltip-borderWidth, var(--salt-size-fixed-100));\n  border-radius: var(--saltTooltip-borderRadius, var(--salt-palette-corner-weak, 0));\n  box-shadow: var(--saltTooltip-shadow, var(--salt-overlayable-shadow-popout));\n  bottom: 50%;\n  left: 50%;\n  padding: var(--salt-spacing-50) var(--salt-spacing-100);\n  position: absolute;\n  transform: translate(-50%, -50%);\n  text-align: var(--saltTooltip-textAlign, left);\n  user-select: none;\n  visibility: hidden;\n  z-index: var(--saltTooltip-zIndex, var(--salt-zIndex-flyover));\n}\n\n.saltSliderTooltip-visible,\n.saltSliderTooltip:hover {\n  visibility: visible;\n}\n\n.saltSliderTooltip-arrow {\n  fill: var(--salt-container-primary-background);\n  height: var(--salt-size-icon);\n  left: 50%;\n  position: absolute;\n  pointer-events: none;\n  top: 100%;\n  transform: translateX(-50%);\n  stroke: var(--salt-container-bold-borderColor);\n  stroke-width: var(--salt-size-fixed-100);\n  width: var(--salt-size-icon);\n}\n\n.saltSliderTooltip-text {\n  white-space: nowrap;\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=SliderTooltip.css.js.map

package/dist-es/slider/internal/SliderTooltip.js

@@ -52,7 +52,7 @@ const SliderTooltip = ({ value, open }) => {
                 "path",
                 {
                   d: "M0,0 H14 L7,7 Q7,7 7,7 Z",
-                  stroke: "var(--salt-container-primary-borderColor)"
+                  stroke: "var(--salt-container-bold-borderColor)"
                 }
               )
             ]

package/dist-es/slider/internal/SliderTooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"SliderTooltip.js","sources":["../src/slider/internal/SliderTooltip.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { Text } from \"../../text\";\nimport { makePrefixer } from \"../../utils\";\nimport sliderTooltipCss from \"./SliderTooltip.css\";\n\nconst withBaseName = makePrefixer(\"saltSliderTooltip\");\n\ninterface SliderTooltipProps {\n  value: number | string;\n  open?: boolean;\n}\n\nexport const SliderTooltip = ({ value, open }: SliderTooltipProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-slider-tooltip\",\n    css: sliderTooltipCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div\n      aria-hidden\n      className={clsx(withBaseName(), {\n        [withBaseName(\"visible\")]: open,\n      })}\n      data-testid=\"sliderTooltip\"\n    >\n      <svg\n        className={withBaseName(\"arrow\")}\n        aria-hidden=\"true\"\n        viewBox=\"0 1 14 14\"\n      >\n        <path\n          d=\"M0,0 H14 L7,7 Q7,7 7,7 Z\"\n          stroke=\" var(--salt-container-primary-background)\"\n        />\n        <path\n          d=\"M0,0 H14 L7,7 Q7,7 7,7 Z\"\n          stroke=\"var(--salt-container-primary-borderColor)\"\n        />\n      </svg>\n      <Text className={withBaseName(\"text\")}>{value}</Text>\n    </div>\n  );\n};\n"],"names":["sliderTooltipCss"],"mappings":";;;;;;;;;;;;;;;;;;;AAOA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA;AAO9C,MAAM,aAAA,GAAgB,CAAC,EAAE,KAAA,EAAO,MAAK,KAA0B;AACpE,EAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,qBAAA;AAAA,IACR,GAAA,EAAKA,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,aAAA,EAAW,IAAA;AAAA,MACX,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG;AAAA,QAC9B,CAAC,YAAA,CAAa,SAAS,CAAC,GAAG;AAAA,OAC5B,CAAA;AAAA,MACD,aAAA,EAAY,eAAA;AAAA,MAEZ,QAAA,EAAA;AAAA,wBAAA,IAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,YAC/B,aAAA,EAAY,MAAA;AAAA,YACZ,OAAA,EAAQ,WAAA;AAAA,YAER,QAAA,EAAA;AAAA,8BAAA,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,CAAA,EAAE,0BAAA;AAAA,kBACF,MAAA,EAAO;AAAA;AAAA,eACT;AAAA,8BACA,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,CAAA,EAAE,0BAAA;AAAA,kBACF,MAAA,EAAO;AAAA;AAAA;AACT;AAAA;AAAA,SACF;AAAA,4BACC,IAAA,EAAA,EAAK,SAAA,EAAW,YAAA,CAAa,MAAM,GAAI,QAAA,EAAA,KAAA,EAAM;AAAA;AAAA;AAAA,GAChD;AAEJ;;;;"}
+{"version":3,"file":"SliderTooltip.js","sources":["../src/slider/internal/SliderTooltip.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { Text } from \"../../text\";\nimport { makePrefixer } from \"../../utils\";\nimport sliderTooltipCss from \"./SliderTooltip.css\";\n\nconst withBaseName = makePrefixer(\"saltSliderTooltip\");\n\ninterface SliderTooltipProps {\n  value: number | string;\n  open?: boolean;\n}\n\nexport const SliderTooltip = ({ value, open }: SliderTooltipProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-slider-tooltip\",\n    css: sliderTooltipCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div\n      aria-hidden\n      className={clsx(withBaseName(), {\n        [withBaseName(\"visible\")]: open,\n      })}\n      data-testid=\"sliderTooltip\"\n    >\n      <svg\n        className={withBaseName(\"arrow\")}\n        aria-hidden=\"true\"\n        viewBox=\"0 1 14 14\"\n      >\n        <path\n          d=\"M0,0 H14 L7,7 Q7,7 7,7 Z\"\n          stroke=\" var(--salt-container-primary-background)\"\n        />\n        <path\n          d=\"M0,0 H14 L7,7 Q7,7 7,7 Z\"\n          stroke=\"var(--salt-container-bold-borderColor)\"\n        />\n      </svg>\n      <Text className={withBaseName(\"text\")}>{value}</Text>\n    </div>\n  );\n};\n"],"names":["sliderTooltipCss"],"mappings":";;;;;;;;;;;;;;;;;;;AAOA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA;AAO9C,MAAM,aAAA,GAAgB,CAAC,EAAE,KAAA,EAAO,MAAK,KAA0B;AACpE,EAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,qBAAA;AAAA,IACR,GAAA,EAAKA,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,aAAA,EAAW,IAAA;AAAA,MACX,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG;AAAA,QAC9B,CAAC,YAAA,CAAa,SAAS,CAAC,GAAG;AAAA,OAC5B,CAAA;AAAA,MACD,aAAA,EAAY,eAAA;AAAA,MAEZ,QAAA,EAAA;AAAA,wBAAA,IAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,YAC/B,aAAA,EAAY,MAAA;AAAA,YACZ,OAAA,EAAQ,WAAA;AAAA,YAER,QAAA,EAAA;AAAA,8BAAA,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,CAAA,EAAE,0BAAA;AAAA,kBACF,MAAA,EAAO;AAAA;AAAA,eACT;AAAA,8BACA,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,CAAA,EAAE,0BAAA;AAAA,kBACF,MAAA,EAAO;AAAA;AAAA;AACT;AAAA;AAAA,SACF;AAAA,4BACC,IAAA,EAAA,EAAK,SAAA,EAAW,YAAA,CAAa,MAAM,GAAI,QAAA,EAAA,KAAA,EAAM;AAAA;AAAA;AAAA,GAChD;AAEJ;;;;"}

package/dist-es/toast/Toast.css.js

@@ -1,4 +1,4 @@
-var css_248z = "/* Styles applied to Toast root element */\n.saltToast {\n  --toast-background: var(--salt-container-primary-background);\n  --toast-borderColor: var(--salt-container-primary-borderColor);\n  --toast-iconColor: var(--salt-content-primary-foreground);\n\n  background: var(--saltToast-background, var(--toast-background));\n  border-color: var(--saltToast-borderColor, var(--toast-borderColor));\n  border-width: var(--saltToast-borderWidth, var(--salt-size-fixed-100));\n  border-style: var(--saltToast-borderStyle, var(--salt-borderStyle-solid));\n  border-radius: var(--saltToast-borderRadius, var(--salt-palette-corner, 0));\n\n  box-sizing: border-box;\n  box-shadow: var(--salt-overlayable-shadow-popout);\n  display: flex;\n  gap: var(--salt-spacing-75);\n  padding: var(--saltToast-padding, var(--salt-spacing-100));\n  min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  margin: 0 var(--salt-spacing-100) var(--salt-spacing-100) var(--salt-spacing-100);\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\n.saltToast:last-child {\n  margin-bottom: var(--salt-spacing-200);\n}\n\n/* Styles applied to icon */\n.saltToast-iconContainer > .saltIcon {\n  margin-top: calc(var(--salt-spacing-75) + calc((var(--salt-text-lineHeight) - max(var(--salt-size-icon), 12px)) / 2));\n  color: var(--toast-iconColor);\n}\n\n/* Styles applied when state = \"info\" */\n.saltToast-info {\n  --toast-borderColor: var(--salt-status-info-borderColor);\n  --toast-iconColor: var(--salt-status-info-foreground-decorative);\n}\n\n/* Styles applied when state = \"error\" */\n.saltToast-error {\n  --toast-borderColor: var(--salt-status-error-borderColor);\n  --toast-iconColor: var(--salt-status-error-foreground-decorative);\n}\n\n/* Styles applied when state = \"warning\" */\n.saltToast-warning {\n  --toast-borderColor: var(--salt-status-warning-borderColor);\n  --toast-iconColor: var(--salt-status-warning-foreground-decorative);\n}\n\n/* Styles applied when state = \"success\" */\n.saltToast-success {\n  --toast-borderColor: var(--salt-status-success-borderColor);\n  --toast-iconColor: var(--salt-status-success-foreground-decorative);\n}\n";
+var css_248z = "/* Styles applied to Toast root element */\n.saltToast {\n  --toast-background: var(--salt-container-primary-background);\n  --toast-borderColor: var(--salt-container-bold-borderColor);\n  --toast-iconColor: var(--salt-content-primary-foreground);\n\n  background: var(--saltToast-background, var(--toast-background));\n  border-color: var(--saltToast-borderColor, var(--toast-borderColor));\n  border-width: var(--saltToast-borderWidth, var(--salt-size-fixed-100));\n  border-style: var(--saltToast-borderStyle, var(--salt-borderStyle-solid));\n  border-radius: var(--saltToast-borderRadius, var(--salt-palette-corner, 0));\n\n  box-sizing: border-box;\n  box-shadow: var(--salt-overlayable-shadow-popout);\n  display: flex;\n  gap: var(--salt-spacing-75);\n  padding: var(--saltToast-padding, var(--salt-spacing-100));\n  min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  margin: 0 var(--salt-spacing-100) var(--salt-spacing-100) var(--salt-spacing-100);\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\n.saltToast:last-child {\n  margin-bottom: var(--salt-spacing-200);\n}\n\n/* Styles applied to icon */\n.saltToast-iconContainer > .saltIcon {\n  margin-top: calc(var(--salt-spacing-75) + calc((var(--salt-text-lineHeight) - max(var(--salt-size-icon), 12px)) / 2));\n  color: var(--toast-iconColor);\n}\n\n/* Styles applied when state = \"info\" */\n.saltToast-info {\n  --toast-borderColor: var(--salt-status-info-borderColor);\n  --toast-iconColor: var(--salt-status-info-foreground-decorative);\n}\n\n/* Styles applied when state = \"error\" */\n.saltToast-error {\n  --toast-borderColor: var(--salt-status-error-borderColor);\n  --toast-iconColor: var(--salt-status-error-foreground-decorative);\n}\n\n/* Styles applied when state = \"warning\" */\n.saltToast-warning {\n  --toast-borderColor: var(--salt-status-warning-borderColor);\n  --toast-iconColor: var(--salt-status-warning-foreground-decorative);\n}\n\n/* Styles applied when state = \"success\" */\n.saltToast-success {\n  --toast-borderColor: var(--salt-status-success-borderColor);\n  --toast-iconColor: var(--salt-status-success-foreground-decorative);\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=Toast.css.js.map

package/dist-es/toggle-button-group/ToggleButtonGroup.css.js

@@ -1,4 +1,4 @@
-var css_248z = ".saltToggleButtonGroup {\n  --toggleButtonGroup-borderWidth: var(--salt-size-fixed-100);\n\n  display: flex;\n  background: var(--salt-container-primary-background);\n  border: var(--toggleButtonGroup-borderWidth) var(--salt-borderStyle-solid) var(--salt-container-primary-borderColor);\n  border-radius: var(--salt-palette-corner-weak, 0);\n  width: fit-content;\n  gap: var(--salt-spacing-50);\n  padding: calc(var(--salt-spacing-50) - var(--toggleButtonGroup-borderWidth));\n  flex-direction: row;\n}\n\n.saltToggleButtonGroup-disabled {\n  background: var(--salt-container-primary-background-disabled);\n  border-color: var(--salt-container-primary-borderColor-disabled);\n  cursor: var(--salt-cursor-disabled);\n}\n\n.saltToggleButtonGroup-readOnly {\n  background: var(--salt-container-primary-background);\n  border-color: var(--salt-container-primary-borderColor);\n  cursor: var(--salt-cursor-disabled);\n}\n\n.saltToggleButtonGroup .saltToggleButton {\n  border-radius: var(--salt-palette-corner-weaker, 0);\n}\n\n.saltToggleButtonGroup-horizontal .saltToggleButton {\n  height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n}\n\n.saltToggleButtonGroup-vertical {\n  flex-direction: column;\n}\n\n.saltToggleButtonGroup-vertical .saltToggleButton {\n  justify-content: start;\n}\n";
+var css_248z = ".saltToggleButtonGroup {\n  --toggleButtonGroup-borderWidth: var(--salt-size-fixed-100);\n\n  display: flex;\n  background: var(--salt-container-primary-background);\n  border: var(--toggleButtonGroup-borderWidth) var(--salt-borderStyle-solid) var(--salt-container-bold-borderColor);\n  border-radius: var(--salt-palette-corner-weak, 0);\n  width: fit-content;\n  gap: var(--salt-spacing-50);\n  padding: calc(var(--salt-spacing-50) - var(--toggleButtonGroup-borderWidth));\n  flex-direction: row;\n}\n\n.saltToggleButtonGroup-disabled {\n  background: var(--salt-container-primary-background-disabled);\n  border-color: var(--salt-container-bold-borderColor-disabled);\n  cursor: var(--salt-cursor-disabled);\n}\n\n.saltToggleButtonGroup-readOnly {\n  background: var(--salt-container-primary-background);\n  border-color: var(--salt-container-bold-borderColor);\n  cursor: var(--salt-cursor-disabled);\n}\n\n.saltToggleButtonGroup .saltToggleButton {\n  border-radius: var(--salt-palette-corner-weaker, 0);\n}\n\n.saltToggleButtonGroup-horizontal .saltToggleButton {\n  height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n}\n\n.saltToggleButtonGroup-vertical {\n  flex-direction: column;\n}\n\n.saltToggleButtonGroup-vertical .saltToggleButton {\n  justify-content: start;\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=ToggleButtonGroup.css.js.map

package/dist-es/toggletip/ToggletipPanel.css.js

@@ -1,4 +1,4 @@
-var css_248z = ".saltToggletipPanel {\n  --toggletip-background: var(--salt-container-primary-background);\n  --toggletip-borderColor: var(--salt-container-primary-borderColor);\n\n  box-sizing: border-box;\n  padding: var(--salt-spacing-100);\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  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--toggletip-borderColor);\n  border-radius: var(--salt-palette-corner-weak);\n\n  background: var(--toggletip-background);\n  box-shadow: var(--salt-overlayable-shadow-popout);\n\n  color: var(--salt-content-primary-foreground);\n  z-index: var(--salt-zIndex-flyover);\n\n  max-width: 45ch;\n  max-height: 100vh;\n}\n\n.saltToggletipPanel-content {\n  max-height: 100%;\n  overflow-y: auto;\n}\n\n.saltToggletipPanel-content:focus-visible {\n  outline-offset: var(--salt-spacing-fixed-100);\n}\n";
+var css_248z = ".saltToggletipPanel {\n  --toggletip-background: var(--salt-container-primary-background);\n  --toggletip-borderColor: var(--salt-container-bold-borderColor);\n\n  box-sizing: border-box;\n  padding: var(--salt-spacing-100);\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  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--toggletip-borderColor);\n  border-radius: var(--salt-palette-corner-weak);\n\n  background: var(--toggletip-background);\n  box-shadow: var(--salt-overlayable-shadow-popout);\n\n  color: var(--salt-content-primary-foreground);\n  z-index: var(--salt-zIndex-flyover);\n\n  max-width: 45ch;\n  max-height: 100vh;\n}\n\n.saltToggletipPanel-content {\n  max-height: 100%;\n  overflow-y: auto;\n}\n\n.saltToggletipPanel-content:focus-visible {\n  outline-offset: var(--salt-spacing-fixed-100);\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=ToggletipPanel.css.js.map

package/dist-es/toolbar/Toolbar.css.js

@@ -1,4 +1,4 @@
-var css_248z = ".saltToolbar {\n  box-sizing: border-box;\n  inline-size: 100%;\n  min-width: 0;\n  position: relative;\n}\n\n.saltToolbar-layout {\n  align-items: center;\n  --saltToolbar-band-gap: var(--salt-spacing-100);\n}\n\n.saltToolbar-layout:not([data-centered]) {\n  display: flex;\n  column-gap: var(--saltToolbar-band-gap);\n}\n\n.saltToolbar-layout[data-centered] {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);\n}\n\n.saltToolbar-band {\n  display: flex;\n  align-items: center;\n  gap: var(--saltToolbar-band-gap);\n  min-width: 0;\n}\n\n.saltToolbar-layout:not([data-centered]) > .saltToolbar-band[data-band-position=\"end\"] {\n  justify-content: flex-end;\n  margin-inline-start: auto;\n}\n\n.saltToolbar-layout[data-centered] > .saltToolbar-band[data-band-position=\"start\"] {\n  grid-column: 1;\n}\n\n.saltToolbar-layout[data-centered] > .saltToolbar-band[data-band-position=\"center\"] {\n  grid-column: 2;\n  justify-content: center;\n}\n\n.saltToolbar-layout[data-centered] > .saltToolbar-band[data-band-position=\"end\"] {\n  grid-column: 3;\n  justify-content: flex-end;\n}\n\n.saltToolbar-fallback {\n  display: flex;\n  align-items: center;\n  gap: var(--salt-spacing-100);\n}\n\n.saltToolbar-layout > * {\n  min-width: 0;\n}\n\n.saltToolbar-primary {\n  --toolbar-background: var(--salt-container-primary-background);\n  --toolbar-borderColor: var(--salt-container-primary-borderColor);\n}\n\n.saltToolbar-secondary {\n  --toolbar-background: var(--salt-container-secondary-background);\n  --toolbar-borderColor: var(--salt-container-secondary-borderColor);\n}\n\n.saltToolbar-tertiary {\n  --toolbar-background: var(--salt-container-tertiary-background);\n  --toolbar-borderColor: var(--salt-container-tertiary-borderColor);\n}\n\n.saltToolbar-bordered {\n  background: var(--saltToolbar-background, var(--toolbar-background));\n  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--saltToolbar-borderColor, var(--toolbar-borderColor));\n  border-radius: var(--salt-palette-corner, 0);\n  padding: var(--salt-spacing-100);\n}\n\n.saltToolbar-transparent {\n  background: transparent;\n  border: none;\n  padding: 0;\n}\n\n.saltToolbar-measurements {\n  display: flex;\n  gap: var(--salt-spacing-100);\n  position: absolute;\n  visibility: hidden;\n  pointer-events: none;\n  inset: 0 auto auto 0;\n  block-size: 0;\n  overflow: hidden;\n}\n\n.saltToolbar-measureTrigger {\n  white-space: nowrap;\n}\n";
+var css_248z = ".saltToolbar {\n  box-sizing: border-box;\n  inline-size: 100%;\n  min-width: 0;\n  position: relative;\n}\n\n.saltToolbar-layout {\n  align-items: center;\n  --saltToolbar-band-gap: var(--salt-spacing-100);\n}\n\n.saltToolbar-layout:not([data-centered]) {\n  display: flex;\n  column-gap: var(--saltToolbar-band-gap);\n}\n\n.saltToolbar-layout[data-centered] {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);\n}\n\n.saltToolbar-band {\n  display: flex;\n  align-items: center;\n  gap: var(--saltToolbar-band-gap);\n  min-width: 0;\n}\n\n.saltToolbar-layout:not([data-centered]) > .saltToolbar-band[data-band-position=\"end\"] {\n  justify-content: flex-end;\n  margin-inline-start: auto;\n}\n\n.saltToolbar-layout[data-centered] > .saltToolbar-band[data-band-position=\"start\"] {\n  grid-column: 1;\n}\n\n.saltToolbar-layout[data-centered] > .saltToolbar-band[data-band-position=\"center\"] {\n  grid-column: 2;\n  justify-content: center;\n}\n\n.saltToolbar-layout[data-centered] > .saltToolbar-band[data-band-position=\"end\"] {\n  grid-column: 3;\n  justify-content: flex-end;\n}\n\n.saltToolbar-fallback {\n  display: flex;\n  align-items: center;\n  gap: var(--salt-spacing-100);\n}\n\n.saltToolbar-layout > * {\n  min-width: 0;\n}\n\n.saltToolbar-primary {\n  --toolbar-background: var(--salt-container-primary-background);\n  --toolbar-borderColor: var(--salt-container-bold-borderColor);\n}\n\n.saltToolbar-secondary {\n  --toolbar-background: var(--salt-container-secondary-background);\n  --toolbar-borderColor: var(--salt-container-bold-borderColor);\n}\n\n.saltToolbar-tertiary {\n  --toolbar-background: var(--salt-container-tertiary-background);\n  --toolbar-borderColor: var(--salt-container-bold-borderColor);\n}\n\n.saltToolbar-bordered {\n  background: var(--saltToolbar-background, var(--toolbar-background));\n  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--saltToolbar-borderColor, var(--toolbar-borderColor));\n  border-radius: var(--salt-palette-corner, 0);\n  padding: var(--salt-spacing-100);\n}\n\n.saltToolbar-transparent {\n  background: transparent;\n  border: none;\n  padding: 0;\n}\n\n.saltToolbar-measurements {\n  display: flex;\n  gap: var(--salt-spacing-100);\n  position: absolute;\n  visibility: hidden;\n  pointer-events: none;\n  inset: 0 auto auto 0;\n  block-size: 0;\n  overflow: hidden;\n}\n\n.saltToolbar-measureTrigger {\n  white-space: nowrap;\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=Toolbar.css.js.map

package/dist-es/tooltip/Tooltip.css.js

@@ -1,4 +1,4 @@
-var css_248z = "/* Styles applied to root component */\n.saltTooltip {\n  --tooltip-background: var(--saltTooltip-background, var(--salt-container-primary-background));\n  --tooltip-zIndex: var(--saltTooltip-zIndex, var(--salt-zIndex-flyover));\n  /* apply icon margin based on the text line height so it's aligned on all densities */\n  --tooltip-icon-marginTop: calc((var(--salt-text-lineHeight) - max(var(--salt-size-icon), 12px)) / 2);\n  --tooltip-status-borderColor: var(--salt-container-primary-borderColor);\n  /* Single line height should be size-base */\n  --tooltip-borderWidth: var(--salt-size-fixed-100);\n  --tooltip-padding: calc(var(--salt-spacing-75) - var(--tooltip-borderWidth)) var(--salt-spacing-100);\n}\n\n.saltTooltip {\n  box-sizing: border-box;\n  background: var(--tooltip-background);\n  border-color: var(--saltTooltip-borderColor, var(--tooltip-status-borderColor));\n  border-style: var(--saltTooltip-borderStyle, var(--salt-borderStyle-solid));\n  border-width: var(--saltTooltip-borderWidth, var(--tooltip-borderWidth));\n  border-radius: var(--saltTooltip-borderRadius, var(--salt-palette-corner-weak, 0));\n  box-shadow: var(--saltTooltip-shadow, var(--salt-overlayable-shadow-popout));\n  color: var(--saltTooltip-text-color, var(--salt-content-primary-foreground));\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--saltTooltip-fontSize, var(--salt-text-fontSize));\n  font-weight: var(--saltTooltip-fontWeight, var(--salt-text-fontWeight));\n  line-height: var(--saltTooltip-lineHeight, var(--salt-text-lineHeight));\n  max-width: var(--saltTooltip-maxWidth, 60ch);\n  padding: var(--saltTooltip-padding, var(--tooltip-padding));\n  position: relative;\n  text-align: var(--saltTooltip-textAlign, left);\n  z-index: var(--tooltip-zIndex);\n}\n\n/* Styles applied to container */\n.saltTooltip-container {\n  display: flex;\n  align-items: baseline;\n  position: relative;\n}\n\n/* Styles applied to content */\n.saltTooltip-content {\n  overflow: hidden;\n}\n\n/* Styles applied to status indicator */\n.saltTooltip-icon {\n  --saltIcon-margin: var(--tooltip-icon-marginTop) var(--salt-spacing-75) 0 0;\n  vertical-align: top;\n  align-self: flex-start;\n}\n\n/* Styles applied when status = \"info\" */\n.saltTooltip-info {\n  --tooltip-status-borderColor: var(--salt-status-info-borderColor);\n}\n\n/* Styles applied when status = \"error\" */\n.saltTooltip-error {\n  --tooltip-status-borderColor: var(--salt-status-error-borderColor);\n}\n\n/* Styles applied when status = \"warning\" */\n.saltTooltip-warning {\n  --tooltip-status-borderColor: var(--salt-status-warning-borderColor);\n}\n\n/* Styles applied when status = \"success\" */\n.saltTooltip-success {\n  --tooltip-status-borderColor: var(--salt-status-success-borderColor);\n}\n";
+var css_248z = "/* Styles applied to root component */\n.saltTooltip {\n  --tooltip-background: var(--saltTooltip-background, var(--salt-container-primary-background));\n  --tooltip-zIndex: var(--saltTooltip-zIndex, var(--salt-zIndex-flyover));\n  /* apply icon margin based on the text line height so it's aligned on all densities */\n  --tooltip-icon-marginTop: calc((var(--salt-text-lineHeight) - max(var(--salt-size-icon), 12px)) / 2);\n  --tooltip-status-borderColor: var(--salt-container-bold-borderColor);\n  /* Single line height should be size-base */\n  --tooltip-borderWidth: var(--salt-size-fixed-100);\n  --tooltip-padding: calc(var(--salt-spacing-75) - var(--tooltip-borderWidth)) var(--salt-spacing-100);\n}\n\n.saltTooltip {\n  box-sizing: border-box;\n  background: var(--tooltip-background);\n  border-color: var(--saltTooltip-borderColor, var(--tooltip-status-borderColor));\n  border-style: var(--saltTooltip-borderStyle, var(--salt-borderStyle-solid));\n  border-width: var(--saltTooltip-borderWidth, var(--tooltip-borderWidth));\n  border-radius: var(--saltTooltip-borderRadius, var(--salt-palette-corner-weak, 0));\n  box-shadow: var(--saltTooltip-shadow, var(--salt-overlayable-shadow-popout));\n  color: var(--saltTooltip-text-color, var(--salt-content-primary-foreground));\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--saltTooltip-fontSize, var(--salt-text-fontSize));\n  font-weight: var(--saltTooltip-fontWeight, var(--salt-text-fontWeight));\n  line-height: var(--saltTooltip-lineHeight, var(--salt-text-lineHeight));\n  max-width: var(--saltTooltip-maxWidth, 60ch);\n  padding: var(--saltTooltip-padding, var(--tooltip-padding));\n  position: relative;\n  text-align: var(--saltTooltip-textAlign, left);\n  z-index: var(--tooltip-zIndex);\n}\n\n/* Styles applied to container */\n.saltTooltip-container {\n  display: flex;\n  align-items: baseline;\n  position: relative;\n}\n\n/* Styles applied to content */\n.saltTooltip-content {\n  overflow: hidden;\n}\n\n/* Styles applied to status indicator */\n.saltTooltip-icon {\n  --saltIcon-margin: var(--tooltip-icon-marginTop) var(--salt-spacing-75) 0 0;\n  vertical-align: top;\n  align-self: flex-start;\n}\n\n/* Styles applied when status = \"info\" */\n.saltTooltip-info {\n  --tooltip-status-borderColor: var(--salt-status-info-borderColor);\n}\n\n/* Styles applied when status = \"error\" */\n.saltTooltip-error {\n  --tooltip-status-borderColor: var(--salt-status-error-borderColor);\n}\n\n/* Styles applied when status = \"warning\" */\n.saltTooltip-warning {\n  --tooltip-status-borderColor: var(--salt-status-warning-borderColor);\n}\n\n/* Styles applied when status = \"success\" */\n.saltTooltip-success {\n  --tooltip-status-borderColor: var(--salt-status-success-borderColor);\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=Tooltip.css.js.map

package/dist-es/vertical-navigation/VerticalNavigationItemTrigger.js

@@ -12,9 +12,9 @@ import '../viewport/ViewportProvider.js';
 import { useVerticalNavigationItem } from './VerticalNavigationItem.js';
 import css_248z from './VerticalNavigationItemTrigger.css.js';
 
-function ItemAction(props) {
-  return renderProps("a", props);
-}
+const ItemAction = forwardRef(function ItemAction2(props, ref) {
+  return renderProps("a", { ...props, ref });
+});
 const withBaseName = makePrefixer("saltVerticalNavigationItemTrigger");
 const VerticalNavigationItemTrigger = forwardRef(function VerticalNavigationItemTrigger2(props, ref) {
   const {

package/dist-es/vertical-navigation/VerticalNavigationItemTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"VerticalNavigationItemTrigger.js","sources":["../src/vertical-navigation/VerticalNavigationItemTrigger.tsx"],"sourcesContent":["import { 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 MouseEvent,\n  useRef,\n} from \"react\";\nimport { makePrefixer, type RenderPropsType, renderProps } from \"../utils\";\nimport { useVerticalNavigationItem } from \"./VerticalNavigationItem\";\nimport verticalNavigationItemTriggerCss from \"./VerticalNavigationItemTrigger.css\";\n\n// biome-ignore lint/suspicious/noExplicitAny: We don't know the exact type here\nfunction ItemAction(props: ComponentPropsWithoutRef<any>) {\n  return renderProps(\"a\", props);\n}\n\nexport interface VerticalNavigationItemTriggerProps\n  extends ComponentPropsWithoutRef<\"a\"> {\n  render?: RenderPropsType[\"render\"];\n}\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigationItemTrigger\");\n\nexport const VerticalNavigationItemTrigger = forwardRef<\n  HTMLAnchorElement,\n  VerticalNavigationItemTriggerProps\n>(function VerticalNavigationItemTrigger(props, ref) {\n  const {\n    className,\n    children,\n    render,\n    href,\n    onFocus,\n    onBlur,\n    onMouseDown,\n    ...rest\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-vertical-navigation-item-trigger\",\n    css: verticalNavigationItemTriggerCss,\n    window: targetWindow,\n  });\n\n  const isLink = href != null;\n  const { active, setFocusVisible } = useVerticalNavigationItem();\n\n  const wasMouseDownRef = useRef(false);\n\n  const handleFocus = (event: FocusEvent<never>) => {\n    if (!wasMouseDownRef.current) {\n      setFocusVisible(true);\n    }\n    wasMouseDownRef.current = false;\n    onFocus?.(event);\n  };\n\n  const handleBlur = (event: FocusEvent<never>) => {\n    setFocusVisible(false);\n    onBlur?.(event);\n  };\n\n  const handleMouseDown = (event: MouseEvent<never>) => {\n    wasMouseDownRef.current = true;\n    onMouseDown?.(event);\n  };\n\n  return (\n    <ItemAction\n      className={clsx(withBaseName(), className)}\n      href={href}\n      aria-current={active ? \"page\" : undefined}\n      render={render ?? (isLink ? undefined : <button type=\"button\" />)}\n      ref={ref}\n      onFocus={handleFocus}\n      onBlur={handleBlur}\n      onMouseDown={handleMouseDown}\n      {...rest}\n    >\n      {children}\n    </ItemAction>\n  );\n});\n"],"names":["VerticalNavigationItemTrigger","verticalNavigationItemTriggerCss"],"mappings":";;;;;;;;;;;;;;AAeA,SAAS,WAAW,KAAA,EAAsC;AACxD,EAAA,OAAO,WAAA,CAAY,KAAK,KAAK,CAAA;AAC/B;AAOA,MAAM,YAAA,GAAe,aAAa,mCAAmC,CAAA;AAE9D,MAAM,6BAAA,GAAgC,UAAA,CAG3C,SAASA,8BAAAA,CAA8B,OAAO,GAAA,EAAK;AACnD,EAAA,MAAM;AAAA,IACJ,SAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA;AAAA,IACA,IAAA;AAAA,IACA,OAAA;AAAA,IACA,MAAA;AAAA,IACA,WAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,uCAAA;AAAA,IACR,GAAA,EAAKC,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,SAAS,IAAA,IAAQ,IAAA;AACvB,EAAA,MAAM,EAAE,MAAA,EAAQ,eAAA,EAAgB,GAAI,yBAAA,EAA0B;AAE9D,EAAA,MAAM,eAAA,GAAkB,OAAO,KAAK,CAAA;AAEpC,EAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAA6B;AAChD,IAAA,IAAI,CAAC,gBAAgB,OAAA,EAAS;AAC5B,MAAA,eAAA,CAAgB,IAAI,CAAA;AAAA,IACtB;AACA,IAAA,eAAA,CAAgB,OAAA,GAAU,KAAA;AAC1B,IAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,CAAA;AAAA,EACZ,CAAA;AAEA,EAAA,MAAM,UAAA,GAAa,CAAC,KAAA,KAA6B;AAC/C,IAAA,eAAA,CAAgB,KAAK,CAAA;AACrB,IAAA,MAAA,IAAA,IAAA,GAAA,MAAA,GAAA,MAAA,CAAS,KAAA,CAAA;AAAA,EACX,CAAA;AAEA,EAAA,MAAM,eAAA,GAAkB,CAAC,KAAA,KAA6B;AACpD,IAAA,eAAA,CAAgB,OAAA,GAAU,IAAA;AAC1B,IAAA,WAAA,IAAA,IAAA,GAAA,MAAA,GAAA,WAAA,CAAc,KAAA,CAAA;AAAA,EAChB,CAAA;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,MACzC,IAAA;AAAA,MACA,cAAA,EAAc,SAAS,MAAA,GAAS,MAAA;AAAA,MAChC,QAAQ,MAAA,KAAW,MAAA,GAAS,yBAAY,GAAA,CAAC,QAAA,EAAA,EAAO,MAAK,QAAA,EAAS,CAAA,CAAA;AAAA,MAC9D,GAAA;AAAA,MACA,OAAA,EAAS,WAAA;AAAA,MACT,MAAA,EAAQ,UAAA;AAAA,MACR,WAAA,EAAa,eAAA;AAAA,MACZ,GAAG,IAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}
+{"version":3,"file":"VerticalNavigationItemTrigger.js","sources":["../src/vertical-navigation/VerticalNavigationItemTrigger.tsx"],"sourcesContent":["import { 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 MouseEvent,\n  useRef,\n} from \"react\";\nimport { makePrefixer, type RenderPropsType, renderProps } from \"../utils\";\nimport { useVerticalNavigationItem } from \"./VerticalNavigationItem\";\nimport verticalNavigationItemTriggerCss from \"./VerticalNavigationItemTrigger.css\";\n\nconst ItemAction = forwardRef<\n  HTMLAnchorElement,\n  // biome-ignore lint/suspicious/noExplicitAny: We don't know the exact type here\n  ComponentPropsWithoutRef<any>\n>(function ItemAction(props, ref) {\n  return renderProps(\"a\", { ...props, ref });\n});\n\nexport interface VerticalNavigationItemTriggerProps\n  extends ComponentPropsWithoutRef<\"a\"> {\n  render?: RenderPropsType[\"render\"];\n}\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigationItemTrigger\");\n\nexport const VerticalNavigationItemTrigger = forwardRef<\n  HTMLAnchorElement,\n  VerticalNavigationItemTriggerProps\n>(function VerticalNavigationItemTrigger(props, ref) {\n  const {\n    className,\n    children,\n    render,\n    href,\n    onFocus,\n    onBlur,\n    onMouseDown,\n    ...rest\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-vertical-navigation-item-trigger\",\n    css: verticalNavigationItemTriggerCss,\n    window: targetWindow,\n  });\n\n  const isLink = href != null;\n  const { active, setFocusVisible } = useVerticalNavigationItem();\n\n  const wasMouseDownRef = useRef(false);\n\n  const handleFocus = (event: FocusEvent<never>) => {\n    if (!wasMouseDownRef.current) {\n      setFocusVisible(true);\n    }\n    wasMouseDownRef.current = false;\n    onFocus?.(event);\n  };\n\n  const handleBlur = (event: FocusEvent<never>) => {\n    setFocusVisible(false);\n    onBlur?.(event);\n  };\n\n  const handleMouseDown = (event: MouseEvent<never>) => {\n    wasMouseDownRef.current = true;\n    onMouseDown?.(event);\n  };\n\n  return (\n    <ItemAction\n      className={clsx(withBaseName(), className)}\n      href={href}\n      aria-current={active ? \"page\" : undefined}\n      render={render ?? (isLink ? undefined : <button type=\"button\" />)}\n      ref={ref}\n      onFocus={handleFocus}\n      onBlur={handleBlur}\n      onMouseDown={handleMouseDown}\n      {...rest}\n    >\n      {children}\n    </ItemAction>\n  );\n});\n"],"names":["ItemAction","VerticalNavigationItemTrigger","verticalNavigationItemTriggerCss"],"mappings":";;;;;;;;;;;;;;AAcA,MAAM,UAAA,GAAa,UAAA,CAIjB,SAASA,WAAAA,CAAW,OAAO,GAAA,EAAK;AAChC,EAAA,OAAO,YAAY,GAAA,EAAK,EAAE,GAAG,KAAA,EAAO,KAAK,CAAA;AAC3C,CAAC,CAAA;AAOD,MAAM,YAAA,GAAe,aAAa,mCAAmC,CAAA;AAE9D,MAAM,6BAAA,GAAgC,UAAA,CAG3C,SAASC,8BAAAA,CAA8B,OAAO,GAAA,EAAK;AACnD,EAAA,MAAM;AAAA,IACJ,SAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA;AAAA,IACA,IAAA;AAAA,IACA,OAAA;AAAA,IACA,MAAA;AAAA,IACA,WAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,uCAAA;AAAA,IACR,GAAA,EAAKC,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,SAAS,IAAA,IAAQ,IAAA;AACvB,EAAA,MAAM,EAAE,MAAA,EAAQ,eAAA,EAAgB,GAAI,yBAAA,EAA0B;AAE9D,EAAA,MAAM,eAAA,GAAkB,OAAO,KAAK,CAAA;AAEpC,EAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAA6B;AAChD,IAAA,IAAI,CAAC,gBAAgB,OAAA,EAAS;AAC5B,MAAA,eAAA,CAAgB,IAAI,CAAA;AAAA,IACtB;AACA,IAAA,eAAA,CAAgB,OAAA,GAAU,KAAA;AAC1B,IAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,CAAA;AAAA,EACZ,CAAA;AAEA,EAAA,MAAM,UAAA,GAAa,CAAC,KAAA,KAA6B;AAC/C,IAAA,eAAA,CAAgB,KAAK,CAAA;AACrB,IAAA,MAAA,IAAA,IAAA,GAAA,MAAA,GAAA,MAAA,CAAS,KAAA,CAAA;AAAA,EACX,CAAA;AAEA,EAAA,MAAM,eAAA,GAAkB,CAAC,KAAA,KAA6B;AACpD,IAAA,eAAA,CAAgB,OAAA,GAAU,IAAA;AAC1B,IAAA,WAAA,IAAA,IAAA,GAAA,MAAA,GAAA,WAAA,CAAc,KAAA,CAAA;AAAA,EAChB,CAAA;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,MACzC,IAAA;AAAA,MACA,cAAA,EAAc,SAAS,MAAA,GAAS,MAAA;AAAA,MAChC,QAAQ,MAAA,KAAW,MAAA,GAAS,yBAAY,GAAA,CAAC,QAAA,EAAA,EAAO,MAAK,QAAA,EAAS,CAAA,CAAA;AAAA,MAC9D,GAAA;AAAA,MACA,OAAA,EAAS,WAAA;AAAA,MACT,MAAA,EAAQ,UAAA;AAAA,MACR,WAAA,EAAa,eAAA;AAAA,MACZ,GAAG,IAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}

package/dist-es/viewport/ViewportProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ViewportProvider.js","sources":["../src/viewport/ViewportProvider.tsx"],"sourcesContent":["import { createContext, type ReactNode, useContext, useState } from \"react\";\nimport { useIsomorphicLayoutEffect } from \"../utils/useIsomorphicLayoutEffect\";\n\nconst ViewportContext = createContext<number | null>(null);\n\ntype ViewportProviderProps = {\n  children?: ReactNode;\n};\n\nconst ViewportProvider = ({ children }: ViewportProviderProps) => {\n  // Get value directly from the ViewportContext so we can detect if the value is null (no inherited ViewportProvider)\n  const existingViewport = useContext(ViewportContext);\n  const [viewport, setViewport] = useState(existingViewport);\n\n  const noExistingViewport = existingViewport === null;\n  const viewportValue = existingViewport || viewport || 0;\n\n  useIsomorphicLayoutEffect(() => {\n    let observer: ResizeObserver | null = null;\n\n    if (noExistingViewport) {\n      observer = new ResizeObserver(\n        (observerEntries: ResizeObserverEntry[]) => {\n          setViewport(observerEntries[0].contentRect.width);\n        },\n      );\n\n      observer.observe(document.body);\n      setViewport(document.body.getBoundingClientRect().width);\n    }\n\n    return () => {\n      if (observer) {\n        observer.disconnect();\n      }\n    };\n  }, [noExistingViewport]);\n\n  return (\n    <ViewportContext.Provider value={viewportValue}>\n      {children}\n    </ViewportContext.Provider>\n  );\n};\n\nconst useViewport = (): number => {\n  const value = useContext(ViewportContext);\n  return value === null ? 0 : value;\n};\n\nexport { ViewportProvider, ViewportContext, useViewport };\n"],"names":[],"mappings":";;;;AAGA,MAAM,eAAA,GAAkB,cAA6B,IAAI;AAMzD,MAAM,gBAAA,GAAmB,CAAC,EAAE,QAAA,EAAS,KAA6B;AAEhE,EAAA,MAAM,gBAAA,GAAmB,WAAW,eAAe,CAAA;AACnD,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,SAAS,gBAAgB,CAAA;AAEzD,EAAA,MAAM,qBAAqB,gBAAA,KAAqB,IAAA;AAChD,EAAA,MAAM,aAAA,GAAgB,oBAAoB,QAAA,IAAY,CAAA;AAEtD,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,QAAA,GAAkC,IAAA;AAEtC,IAAA,IAAI,kBAAA,EAAoB;AACtB,MAAA,QAAA,GAAW,IAAI,cAAA;AAAA,QACb,CAAC,eAAA,KAA2C;AAC1C,UAAA,WAAA,CAAY,eAAA,CAAgB,CAAC,CAAA,CAAE,WAAA,CAAY,KAAK,CAAA;AAAA,QAClD;AAAA,OACF;AAEA,MAAA,QAAA,CAAS,OAAA,CAAQ,SAAS,IAAI,CAAA;AAC9B,MAAA,WAAA,CAAY,QAAA,CAAS,IAAA,CAAK,qBAAA,EAAsB,CAAE,KAAK,CAAA;AAAA,IACzD;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,QAAA,EAAU;AACZ,QAAA,QAAA,CAAS,UAAA,EAAW;AAAA,MACtB;AAAA,IACF,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,kBAAkB,CAAC,CAAA;AAEvB,EAAA,2BACG,eAAA,CAAgB,QAAA,EAAhB,EAAyB,KAAA,EAAO,eAC9B,QAAA,EACH,CAAA;AAEJ;AAEA,MAAM,cAAc,MAAc;AAChC,EAAA,MAAM,KAAA,GAAQ,WAAW,eAAe,CAAA;AACxC,EAAA,OAAO,KAAA,KAAU,OAAO,CAAA,GAAI,KAAA;AAC9B;;;;"}
+{"version":3,"file":"ViewportProvider.js","sources":["../src/viewport/ViewportProvider.tsx"],"sourcesContent":["import { createContext, type ReactNode, useContext, useState } from \"react\";\nimport { useIsomorphicLayoutEffect } from \"../utils/useIsomorphicLayoutEffect\";\n\nconst ViewportContext = createContext<number | null>(null);\n\ntype ViewportProviderProps = {\n  children?: ReactNode;\n};\n\nconst ViewportProvider = ({ children }: ViewportProviderProps) => {\n  // Get value directly from the ViewportContext so we can detect if the value is null (no inherited ViewportProvider)\n  const existingViewport = useContext(ViewportContext);\n  const [viewport, setViewport] = useState(existingViewport);\n\n  const noExistingViewport = existingViewport === null;\n  const viewportValue = existingViewport || viewport || 0;\n\n  useIsomorphicLayoutEffect(() => {\n    let observer: ResizeObserver | null = null;\n\n    if (noExistingViewport) {\n      observer = new ResizeObserver(\n        (observerEntries: ResizeObserverEntry[]) => {\n          setViewport(observerEntries[0].contentRect.width);\n        },\n      );\n\n      observer.observe(document.body);\n      setViewport(document.body.getBoundingClientRect().width);\n    }\n\n    return () => {\n      if (observer) {\n        observer.disconnect();\n      }\n    };\n  }, [noExistingViewport]);\n\n  return (\n    <ViewportContext.Provider value={viewportValue}>\n      {children}\n    </ViewportContext.Provider>\n  );\n};\n\nconst useViewport = (): number => {\n  const value = useContext(ViewportContext);\n  return value === null ? 0 : value;\n};\n\nexport { useViewport, ViewportContext, ViewportProvider };\n"],"names":[],"mappings":";;;;AAGA,MAAM,eAAA,GAAkB,cAA6B,IAAI;AAMzD,MAAM,gBAAA,GAAmB,CAAC,EAAE,QAAA,EAAS,KAA6B;AAEhE,EAAA,MAAM,gBAAA,GAAmB,WAAW,eAAe,CAAA;AACnD,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,SAAS,gBAAgB,CAAA;AAEzD,EAAA,MAAM,qBAAqB,gBAAA,KAAqB,IAAA;AAChD,EAAA,MAAM,aAAA,GAAgB,oBAAoB,QAAA,IAAY,CAAA;AAEtD,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,QAAA,GAAkC,IAAA;AAEtC,IAAA,IAAI,kBAAA,EAAoB;AACtB,MAAA,QAAA,GAAW,IAAI,cAAA;AAAA,QACb,CAAC,eAAA,KAA2C;AAC1C,UAAA,WAAA,CAAY,eAAA,CAAgB,CAAC,CAAA,CAAE,WAAA,CAAY,KAAK,CAAA;AAAA,QAClD;AAAA,OACF;AAEA,MAAA,QAAA,CAAS,OAAA,CAAQ,SAAS,IAAI,CAAA;AAC9B,MAAA,WAAA,CAAY,QAAA,CAAS,IAAA,CAAK,qBAAA,EAAsB,CAAE,KAAK,CAAA;AAAA,IACzD;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,QAAA,EAAU;AACZ,QAAA,QAAA,CAAS,UAAA,EAAW;AAAA,MACtB;AAAA,IACF,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,kBAAkB,CAAC,CAAA;AAEvB,EAAA,2BACG,eAAA,CAAgB,QAAA,EAAhB,EAAyB,KAAA,EAAO,eAC9B,QAAA,EACH,CAAA;AAEJ;AAEA,MAAM,cAAc,MAAc;AAChC,EAAA,MAAM,KAAA,GAAQ,WAAW,eAAe,CAAA;AACxC,EAAA,OAAO,KAAA,KAAU,OAAO,CAAA,GAAI,KAAA;AAC9B;;;;"}

package/dist-types/avatar/Avatar.d.ts

@@ -20,9 +20,19 @@ export interface AvatarProps extends HTMLAttributes<HTMLDivElement> {
      */
     size?: number;
     /**
-     * Icon to be used as a default item. Defaults to `UserIcon`.
+     * Icon to be used as a default item. Defaults to the semantic `UserIcon` when
+     * `kind` is `"person"`, and the semantic `EntityIcon` when `kind`
+     * is `"entity"`.
      */
     fallbackIcon?: ReactNode;
+    /**
+     * What the Avatar depicts, which determines its default shape and fallback icon:
+     * - `"person"` renders a circular Avatar (default).
+     * - `"entity"` renders a square Avatar.
+     *
+     * @default "person"
+     */
+    kind?: "person" | "entity";
     /**
      * Changes Avatar's color.
      */

package/dist-types/breadcrumbs/Breadcrumb.d.ts

@@ -0,0 +1,23 @@
+import { type ComponentPropsWithoutRef, type ReactNode } from "react";
+import { type RenderPropsType } from "../utils";
+export interface BreadcrumbProps extends Omit<ComponentPropsWithoutRef<"li">, "children"> {
+    /**
+     * Custom breadcrumb content. Use this for advanced composition with
+     * `BreadcrumbTrigger` and `BreadcrumbLabel`.
+     */
+    children?: ReactNode;
+    /**
+     * If `true`, the breadcrumb represents the current page.
+     */
+    current?: boolean;
+    /**
+     * The URL for the breadcrumb. Provide this for the current breadcrumb so it
+     * renders as a focusable link with `aria-current="page"`.
+     */
+    href?: string;
+    /**
+     * Render prop to enable customization of the underlying link element.
+     */
+    render?: RenderPropsType["render"];
+}
+export declare const Breadcrumb: import("react").ForwardRefExoticComponent<BreadcrumbProps & import("react").RefAttributes<HTMLLIElement>>;

package/dist-types/breadcrumbs/BreadcrumbLabel.d.ts

@@ -0,0 +1,4 @@
+import { type ComponentPropsWithoutRef } from "react";
+export interface BreadcrumbLabelProps extends ComponentPropsWithoutRef<"span"> {
+}
+export declare const BreadcrumbLabel: import("react").ForwardRefExoticComponent<BreadcrumbLabelProps & import("react").RefAttributes<HTMLSpanElement>>;

package/dist-types/breadcrumbs/BreadcrumbTrigger.d.ts

@@ -0,0 +1,8 @@
+import { type ComponentPropsWithoutRef, type ReactNode } from "react";
+export interface BreadcrumbTriggerProps extends Omit<ComponentPropsWithoutRef<"a">, "children" | "color" | "href"> {
+    /**
+     * Breadcrumb trigger content.
+     */
+    children?: ReactNode;
+}
+export declare const BreadcrumbTrigger: import("react").ForwardRefExoticComponent<BreadcrumbTriggerProps & import("react").RefAttributes<HTMLAnchorElement>>;

package/dist-types/breadcrumbs/Breadcrumbs.d.ts

@@ -0,0 +1,32 @@
+import { type ComponentPropsWithoutRef, type ReactNode } from "react";
+import { type RenderPropsType } from "../utils";
+export interface BreadcrumbsProps extends Omit<ComponentPropsWithoutRef<"nav">, "children"> {
+    /**
+     * Breadcrumb items.
+     */
+    children?: ReactNode;
+    /**
+     * The number of items to keep after the collapse point.
+     * Defaults to 1.
+     */
+    itemsAfterCollapse?: number;
+    /**
+     * The number of items to keep before the collapse point.
+     * Defaults to 1.
+     */
+    itemsBeforeCollapse?: number;
+    /**
+     * The maximum number of breadcrumbs to render before collapsing.
+     */
+    maxItems?: number;
+    /**
+     * Render prop to enable customization of the underlying link elements.
+     */
+    render?: RenderPropsType["render"];
+    /**
+     * If `true`, breadcrumbs can wrap onto multiple lines.
+     * Defaults to `false`.
+     */
+    wrap?: boolean;
+}
+export declare const Breadcrumbs: import("react").ForwardRefExoticComponent<BreadcrumbsProps & import("react").RefAttributes<HTMLElement>>;

package/dist-types/breadcrumbs/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./Breadcrumb";
+export * from "./BreadcrumbLabel";
+export * from "./Breadcrumbs";
+export * from "./BreadcrumbTrigger";

package/dist-types/breadcrumbs/internal/BreadcrumbContext.d.ts

@@ -0,0 +1,14 @@
+import { type Ref } from "react";
+import type { RenderPropsType } from "../../utils";
+export type BreadcrumbPlacement = "disclosure" | "trail";
+export interface BreadcrumbContextValue {
+    current: boolean;
+    href?: string;
+    onNavigate?: () => void;
+    placement: BreadcrumbPlacement;
+    render?: RenderPropsType["render"];
+    showSeparator: boolean;
+    triggerRef?: Ref<HTMLAnchorElement>;
+}
+export declare const BreadcrumbContext: import("react").Context<BreadcrumbContextValue | undefined>;
+export declare function useBreadcrumbContext(): BreadcrumbContextValue | undefined;

package/dist-types/breadcrumbs/internal/BreadcrumbOverflowDisclosure.d.ts

@@ -0,0 +1,9 @@
+import { type RenderPropsType } from "../../utils";
+import type { NormalizedBreadcrumb } from "./breadcrumbItems";
+interface BreadcrumbOverflowDisclosureProps {
+    currentIndex: number;
+    items: NormalizedBreadcrumb[];
+    render?: RenderPropsType["render"];
+}
+export declare function BreadcrumbOverflowDisclosure({ currentIndex, items, render, }: BreadcrumbOverflowDisclosureProps): import("react").JSX.Element;
+export {};

package/dist-types/breadcrumbs/internal/breadcrumbItems.d.ts

@@ -0,0 +1,9 @@
+import { type Key, type ReactElement, type ReactNode } from "react";
+import type { BreadcrumbProps } from "../Breadcrumb";
+export interface NormalizedBreadcrumb {
+    element: ReactElement<BreadcrumbProps>;
+    index: number;
+    key: Key;
+    props: BreadcrumbProps;
+}
+export declare function flattenBreadcrumbItems(children: ReactNode): ReactNode[];