@salt-ds/lab 1.0.0-alpha.10 → 1.0.0-alpha.101

package/dist-cjs/contact-details/internal/StarIcon.js

@@ -1,27 +1,23 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
+var react = require('react');
 
 const filledPath = "M6,0,4.21,4.05,0,4.58l3.11,3L2.29,12,6,9.5,9.71,12,8.89,7.62l3.11-3L7.79,4.05,6,0Z";
 const hollowPath = "M6,2.47l.87,2L7.1,5,7.66,5l2.16.27L8.19,6.91l-.38.37.1.53.38,2L6.56,8.67,6,8.29l-.56.38L3.71,9.84l.38-2,.1-.53-.38-.37L2.18,5.31,4.34,5,4.9,5l.23-.52.87-2M6,0,4.21,4.05,0,4.58l3.11,3L2.29,12,6,9.5,9.71,12,8.89,7.62l3.11-3L7.79,4.05,6,0Z";
-const StarIcon = React.forwardRef(
+const StarIcon = react.forwardRef(
   function StarIcon2({ className, selected, highlighted }, ref) {
     const path = !selected && !highlighted ? hollowPath : filledPath;
-    return /* @__PURE__ */ jsxRuntime.jsx("svg", {
-      "aria-hidden": "true",
-      className,
-      ref,
-      viewBox: "0 0 12 12",
-      children: /* @__PURE__ */ jsxRuntime.jsx("g", {
-        fillRule: "evenodd",
-        children: /* @__PURE__ */ jsxRuntime.jsx("path", {
-          d: path
-        })
-      })
-    });
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "svg",
+      {
+        "aria-hidden": "true",
+        className,
+        ref,
+        viewBox: "0 0 12 12",
+        children: /* @__PURE__ */ jsxRuntime.jsx("g", { fillRule: "evenodd", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: path }) })
+      }
+    );
   }
 );
 

package/dist-cjs/contact-details/internal/StarIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"StarIcon.js","sources":["../src/contact-details/internal/StarIcon.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\n\nconst filledPath =\n  \"M6,0,4.21,4.05,0,4.58l3.11,3L2.29,12,6,9.5,9.71,12,8.89,7.62l3.11-3L7.79,4.05,6,0Z\";\n\nconst hollowPath =\n  \"M6,2.47l.87,2L7.1,5,7.66,5l2.16.27L8.19,6.91l-.38.37.1.53.38,2L6.56,8.67,6,8.29l-.56.38L3.71,9.84l.38-2,.1-.53-.38-.37L2.18,5.31,4.34,5,4.9,5l.23-.52.87-2M6,0,4.21,4.05,0,4.58l3.11,3L2.29,12,6,9.5,9.71,12,8.89,7.62l3.11-3L7.79,4.05,6,0Z\";\n\nexport interface StarIconProps {\n  className?: string;\n  selected?: boolean;\n  highlighted?: boolean;\n}\n\nexport const StarIcon = forwardRef<SVGSVGElement, StarIconProps>(\n  function StarIcon({ className, selected, highlighted }, ref) {\n    const path = !selected && !highlighted ? hollowPath : filledPath;\n\n    return (\n      <svg\n        aria-hidden=\"true\"\n        className={className}\n        ref={ref}\n        viewBox=\"0 0 12 12\"\n      >\n        <g fillRule=\"evenodd\">\n          <path d={path} />\n        </g>\n      </svg>\n    );\n  }\n);\n"],"names":["forwardRef","StarIcon","jsx"],"mappings":";;;;;;;AAEA,MAAM,UACJ,GAAA,oFAAA,CAAA;AAEF,MAAM,UACJ,GAAA,8OAAA,CAAA;AAQK,MAAM,QAAW,GAAAA,gBAAA;AAAA,EACtB,SAASC,SAAS,CAAA,EAAE,WAAW,QAAU,EAAA,WAAA,IAAe,GAAK,EAAA;AAC3D,IAAA,MAAM,IAAO,GAAA,CAAC,QAAY,IAAA,CAAC,cAAc,UAAa,GAAA,UAAA,CAAA;AAEtD,IAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,MACC,aAAY,EAAA,MAAA;AAAA,MACZ,SAAA;AAAA,MACA,GAAA;AAAA,MACA,OAAQ,EAAA,WAAA;AAAA,MAER,QAAC,kBAAAA,cAAA,CAAA,GAAA,EAAA;AAAA,QAAE,QAAS,EAAA,SAAA;AAAA,QACV,QAAC,kBAAAA,cAAA,CAAA,MAAA,EAAA;AAAA,UAAK,CAAG,EAAA,IAAA;AAAA,SAAM,CAAA;AAAA,OACjB,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"StarIcon.js","sources":["../src/contact-details/internal/StarIcon.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nconst filledPath =\n  \"M6,0,4.21,4.05,0,4.58l3.11,3L2.29,12,6,9.5,9.71,12,8.89,7.62l3.11-3L7.79,4.05,6,0Z\";\n\nconst hollowPath =\n  \"M6,2.47l.87,2L7.1,5,7.66,5l2.16.27L8.19,6.91l-.38.37.1.53.38,2L6.56,8.67,6,8.29l-.56.38L3.71,9.84l.38-2,.1-.53-.38-.37L2.18,5.31,4.34,5,4.9,5l.23-.52.87-2M6,0,4.21,4.05,0,4.58l3.11,3L2.29,12,6,9.5,9.71,12,8.89,7.62l3.11-3L7.79,4.05,6,0Z\";\n\nexport interface StarIconProps {\n  className?: string;\n  selected?: boolean;\n  highlighted?: boolean;\n}\n\nexport const StarIcon = forwardRef<SVGSVGElement, StarIconProps>(\n  function StarIcon({ className, selected, highlighted }, ref) {\n    const path = !selected && !highlighted ? hollowPath : filledPath;\n\n    return (\n      <svg\n        aria-hidden=\"true\"\n        className={className}\n        ref={ref}\n        viewBox=\"0 0 12 12\"\n      >\n        <g fillRule=\"evenodd\">\n          <path d={path} />\n        </g>\n      </svg>\n    );\n  },\n);\n"],"names":["forwardRef","StarIcon","jsx"],"mappings":";;;;;AAEA,MAAM,UAAA,GACJ,oFAAA;AAEF,MAAM,UAAA,GACJ,8OAAA;AAQK,MAAM,QAAA,GAAWA,gBAAA;AAAA,EACtB,SAASC,SAAAA,CAAS,EAAE,WAAW,QAAA,EAAU,WAAA,IAAe,GAAA,EAAK;AAC3D,IAAA,MAAM,IAAA,GAAO,CAAC,QAAA,IAAY,CAAC,cAAc,UAAA,GAAa,UAAA;AAEtD,IAAA,uBACEC,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,aAAA,EAAY,MAAA;AAAA,QACZ,SAAA;AAAA,QACA,GAAA;AAAA,QACA,OAAA,EAAQ,WAAA;AAAA,QAER,QAAA,kBAAAA,cAAA,CAAC,OAAE,QAAA,EAAS,SAAA,EACV,yCAAC,MAAA,EAAA,EAAK,CAAA,EAAG,MAAM,CAAA,EACjB;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;;;;"}

package/dist-cjs/contact-details/internal/StarIconContainer.js

@@ -1,15 +1,13 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
-var clsx = require('clsx');
 var core = require('@salt-ds/core');
+var clsx = require('clsx');
+var react = require('react');
 var StarIcon = require('./StarIcon.js');
 
 const withBaseName = core.makePrefixer("saltContactFavoriteToggle");
-const StarIconContainer = React.forwardRef(function StarIconContainer2(props, ref) {
+const StarIconContainer = react.forwardRef(function StarIconContainer2(props, ref) {
   const {
     isSelected,
     isHighlighted,
@@ -18,28 +16,34 @@ const StarIconContainer = React.forwardRef(function StarIconContainer2(props, re
     className,
     ...other
   } = props;
-  return /* @__PURE__ */ jsxRuntime.jsx("span", {
-    className: clsx.clsx(
-      withBaseName(),
-      {
-        [withBaseName("focusVisible")]: isFocusVisible
-      },
-      className
-    ),
-    ...other,
-    ref,
-    children: /* @__PURE__ */ jsxRuntime.jsx(StarIcon.StarIcon, {
-      className: clsx.clsx(withBaseName("svg"), {
-        [withBaseName("focused")]: isFocusVisible && isFocused,
-        [withBaseName("selected")]: isSelected && !isHighlighted,
-        [withBaseName("selecting")]: !isSelected && isHighlighted,
-        [withBaseName("deselected")]: !isSelected && !isHighlighted,
-        [withBaseName("deselecting")]: isSelected && isHighlighted
-      }),
-      highlighted: isHighlighted,
-      selected: isSelected
-    })
-  });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      className: clsx.clsx(
+        withBaseName(),
+        {
+          [withBaseName("focusVisible")]: isFocusVisible
+        },
+        className
+      ),
+      ...other,
+      ref,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        StarIcon.StarIcon,
+        {
+          className: clsx.clsx(withBaseName("svg"), {
+            [withBaseName("focused")]: isFocusVisible && isFocused,
+            [withBaseName("selected")]: isSelected && !isHighlighted,
+            [withBaseName("selecting")]: !isSelected && isHighlighted,
+            [withBaseName("deselected")]: !isSelected && !isHighlighted,
+            [withBaseName("deselecting")]: isSelected && isHighlighted
+          }),
+          highlighted: isHighlighted,
+          selected: isSelected
+        }
+      )
+    }
+  );
 });
 
 exports.StarIconContainer = StarIconContainer;

package/dist-cjs/contact-details/internal/StarIconContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"StarIconContainer.js","sources":["../src/contact-details/internal/StarIconContainer.tsx"],"sourcesContent":["import React, { forwardRef, HTMLAttributes } from \"react\";\nimport { clsx } from \"clsx\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { StarIcon } from \"./StarIcon\";\n\nconst withBaseName = makePrefixer(\"saltContactFavoriteToggle\");\n\nexport interface StarIconContainerProps\n  extends HTMLAttributes<HTMLSpanElement> {\n  className?: string;\n  isFocusVisible?: boolean;\n  isFocused?: boolean;\n  isHighlighted?: boolean;\n  isSelected?: boolean;\n}\n\nexport const StarIconContainer = forwardRef<\n  HTMLSpanElement,\n  StarIconContainerProps\n>(function StarIconContainer(props, ref) {\n  const {\n    isSelected,\n    isHighlighted,\n    isFocused,\n    isFocusVisible,\n    className,\n    ...other\n  } = props;\n\n  return (\n    <span\n      className={clsx(\n        withBaseName(),\n        {\n          [withBaseName(\"focusVisible\")]: isFocusVisible,\n        },\n        className\n      )}\n      {...other}\n      ref={ref}\n    >\n      <StarIcon\n        className={clsx(withBaseName(\"svg\"), {\n          [withBaseName(\"focused\")]: isFocusVisible && isFocused,\n          [withBaseName(\"selected\")]: isSelected && !isHighlighted,\n          [withBaseName(\"selecting\")]: !isSelected && isHighlighted,\n          [withBaseName(\"deselected\")]: !isSelected && !isHighlighted,\n          [withBaseName(\"deselecting\")]: isSelected && isHighlighted,\n        })}\n        highlighted={isHighlighted}\n        selected={isSelected}\n      />\n    </span>\n  );\n});\n"],"names":["makePrefixer","forwardRef","StarIconContainer","jsx","clsx","StarIcon"],"mappings":";;;;;;;;;;AAKA,MAAM,YAAA,GAAeA,kBAAa,2BAA2B,CAAA,CAAA;AAWtD,MAAM,iBAAoB,GAAAC,gBAAA,CAG/B,SAASC,kBAAAA,CAAkB,OAAO,GAAK,EAAA;AACvC,EAAM,MAAA;AAAA,IACJ,UAAA;AAAA,IACA,aAAA;AAAA,IACA,SAAA;AAAA,IACA,cAAA;AAAA,IACA,SAAA;AAAA,IACG,GAAA,KAAA;AAAA,GACD,GAAA,KAAA,CAAA;AAEJ,EAAA,uBACGC,cAAA,CAAA,MAAA,EAAA;AAAA,IACC,SAAW,EAAAC,SAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb;AAAA,QACE,CAAC,YAAa,CAAA,cAAc,CAAI,GAAA,cAAA;AAAA,OAClC;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IACC,GAAG,KAAA;AAAA,IACJ,GAAA;AAAA,IAEA,QAAC,kBAAAD,cAAA,CAAAE,iBAAA,EAAA;AAAA,MACC,SAAW,EAAAD,SAAA,CAAK,YAAa,CAAA,KAAK,CAAG,EAAA;AAAA,QACnC,CAAC,YAAA,CAAa,SAAS,CAAA,GAAI,cAAkB,IAAA,SAAA;AAAA,QAC7C,CAAC,YAAA,CAAa,UAAU,CAAA,GAAI,cAAc,CAAC,aAAA;AAAA,QAC3C,CAAC,YAAA,CAAa,WAAW,CAAA,GAAI,CAAC,UAAc,IAAA,aAAA;AAAA,QAC5C,CAAC,YAAa,CAAA,YAAY,CAAI,GAAA,CAAC,cAAc,CAAC,aAAA;AAAA,QAC9C,CAAC,YAAA,CAAa,aAAa,CAAA,GAAI,UAAc,IAAA,aAAA;AAAA,OAC9C,CAAA;AAAA,MACD,WAAa,EAAA,aAAA;AAAA,MACb,QAAU,EAAA,UAAA;AAAA,KACZ,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"StarIconContainer.js","sources":["../src/contact-details/internal/StarIconContainer.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes } from \"react\";\nimport { StarIcon } from \"./StarIcon\";\n\nconst withBaseName = makePrefixer(\"saltContactFavoriteToggle\");\n\nexport interface StarIconContainerProps\n  extends HTMLAttributes<HTMLSpanElement> {\n  className?: string;\n  isFocusVisible?: boolean;\n  isFocused?: boolean;\n  isHighlighted?: boolean;\n  isSelected?: boolean;\n}\n\nexport const StarIconContainer = forwardRef<\n  HTMLSpanElement,\n  StarIconContainerProps\n>(function StarIconContainer(props, ref) {\n  const {\n    isSelected,\n    isHighlighted,\n    isFocused,\n    isFocusVisible,\n    className,\n    ...other\n  } = props;\n\n  return (\n    <span\n      className={clsx(\n        withBaseName(),\n        {\n          [withBaseName(\"focusVisible\")]: isFocusVisible,\n        },\n        className,\n      )}\n      {...other}\n      ref={ref}\n    >\n      <StarIcon\n        className={clsx(withBaseName(\"svg\"), {\n          [withBaseName(\"focused\")]: isFocusVisible && isFocused,\n          [withBaseName(\"selected\")]: isSelected && !isHighlighted,\n          [withBaseName(\"selecting\")]: !isSelected && isHighlighted,\n          [withBaseName(\"deselected\")]: !isSelected && !isHighlighted,\n          [withBaseName(\"deselecting\")]: isSelected && isHighlighted,\n        })}\n        highlighted={isHighlighted}\n        selected={isSelected}\n      />\n    </span>\n  );\n});\n"],"names":["makePrefixer","forwardRef","StarIconContainer","jsx","clsx","StarIcon"],"mappings":";;;;;;;;AAKA,MAAM,YAAA,GAAeA,kBAAa,2BAA2B,CAAA;AAWtD,MAAM,iBAAA,GAAoBC,gBAAA,CAG/B,SAASC,kBAAAA,CAAkB,OAAO,GAAA,EAAK;AACvC,EAAA,MAAM;AAAA,IACJ,UAAA;AAAA,IACA,aAAA;AAAA,IACA,SAAA;AAAA,IACA,cAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,uBACEC,cAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWC,SAAA;AAAA,QACT,YAAA,EAAa;AAAA,QACb;AAAA,UACE,CAAC,YAAA,CAAa,cAAc,CAAC,GAAG;AAAA,SAClC;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG,KAAA;AAAA,MACJ,GAAA;AAAA,MAEA,QAAA,kBAAAD,cAAA;AAAA,QAACE,iBAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAWD,SAAA,CAAK,YAAA,CAAa,KAAK,CAAA,EAAG;AAAA,YACnC,CAAC,YAAA,CAAa,SAAS,CAAC,GAAG,cAAA,IAAkB,SAAA;AAAA,YAC7C,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,cAAc,CAAC,aAAA;AAAA,YAC3C,CAAC,YAAA,CAAa,WAAW,CAAC,GAAG,CAAC,UAAA,IAAc,aAAA;AAAA,YAC5C,CAAC,YAAA,CAAa,YAAY,CAAC,GAAG,CAAC,cAAc,CAAC,aAAA;AAAA,YAC9C,CAAC,YAAA,CAAa,aAAa,CAAC,GAAG,UAAA,IAAc;AAAA,WAC9C,CAAA;AAAA,UACD,WAAA,EAAa,aAAA;AAAA,UACb,QAAA,EAAU;AAAA;AAAA;AACZ;AAAA,GACF;AAEJ,CAAC;;;;"}

package/dist-cjs/contact-details/internal/useComponentSize.js

@@ -1,22 +1,17 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
 var core = require('@salt-ds/core');
+var react = require('react');
 
 function useComponentSize(initialWidth) {
-  const [size, setSize] = React.useState({ width: initialWidth });
-  const ref = React.useRef(null);
-  const handleResize = React.useCallback(
-    function handleResize2({
-      width,
-      height
-    }) {
-      setSize({ width, height });
-    },
-    []
-  );
+  const [size, setSize] = react.useState({ width: initialWidth });
+  const ref = react.useRef(null);
+  const handleResize = react.useCallback(function handleResize2({
+    width,
+    height
+  }) {
+    setSize({ width, height });
+  }, []);
   core.useIsomorphicLayoutEffect(() => {
     if (!ref.current) {
       if (process.env.NODE_ENV !== "production") {

package/dist-cjs/contact-details/internal/useComponentSize.js.map

@@ -1 +1 @@
-{"version":3,"file":"useComponentSize.js","sources":["../src/contact-details/internal/useComponentSize.ts"],"sourcesContent":["import { MutableRefObject, useCallback, useRef, useState } from \"react\";\nimport { useIsomorphicLayoutEffect } from \"@salt-ds/core\";\n\nexport interface ComponentSize {\n  height?: number;\n  width: number;\n}\n\nexport function useComponentSize<T extends HTMLElement>(\n  initialWidth: number\n): [MutableRefObject<T | null>, ComponentSize] {\n  const [size, setSize] = useState<ComponentSize>({ width: initialWidth });\n  const ref = useRef<T>(null);\n\n  const handleResize = useCallback(function handleResize({\n    width,\n    height,\n  }: DOMRect) {\n    setSize({ width, height });\n  },\n  []);\n\n  useIsomorphicLayoutEffect(() => {\n    if (!ref.current) {\n      if (process.env.NODE_ENV !== \"production\") {\n        throw new Error(\n          \"ref returned by useComponentSize was not assigned to a component\"\n        );\n      }\n      return;\n    }\n    handleResize(ref.current.getBoundingClientRect());\n    const observer = new ResizeObserver(\n      (observerEntries: ResizeObserverEntry[]) => {\n        handleResize(observerEntries[0].contentRect);\n      }\n    );\n    observer.observe(ref.current);\n    return () => {\n      observer.disconnect();\n    };\n  }, [handleResize]);\n\n  return [ref, size];\n}\n"],"names":["useState","useRef","useCallback","handleResize","useIsomorphicLayoutEffect"],"mappings":";;;;;;;AAQO,SAAS,iBACd,YAC6C,EAAA;AAC7C,EAAM,MAAA,CAAC,MAAM,OAAO,CAAA,GAAIA,eAAwB,EAAE,KAAA,EAAO,cAAc,CAAA,CAAA;AACvE,EAAM,MAAA,GAAA,GAAMC,aAAU,IAAI,CAAA,CAAA;AAE1B,EAAA,MAAM,YAAe,GAAAC,iBAAA;AAAA,IAAY,SAASC,aAAa,CAAA;AAAA,MACrD,KAAA;AAAA,MACA,MAAA;AAAA,KACU,EAAA;AACV,MAAQ,OAAA,CAAA,EAAE,KAAO,EAAA,MAAA,EAAQ,CAAA,CAAA;AAAA,KAC3B;AAAA,IACA,EAAC;AAAA,GAAC,CAAA;AAEF,EAAAC,8BAAA,CAA0B,MAAM;AAC9B,IAAI,IAAA,CAAC,IAAI,OAAS,EAAA;AAChB,MAAI,IAAA,OAAA,CAAQ,GAAI,CAAA,QAAA,KAAa,YAAc,EAAA;AACzC,QAAA,MAAM,IAAI,KAAA;AAAA,UACR,kEAAA;AAAA,SACF,CAAA;AAAA,OACF;AACA,MAAA,OAAA;AAAA,KACF;AACA,IAAa,YAAA,CAAA,GAAA,CAAI,OAAQ,CAAA,qBAAA,EAAuB,CAAA,CAAA;AAChD,IAAA,MAAM,WAAW,IAAI,cAAA;AAAA,MACnB,CAAC,eAA2C,KAAA;AAC1C,QAAa,YAAA,CAAA,eAAA,CAAgB,GAAG,WAAW,CAAA,CAAA;AAAA,OAC7C;AAAA,KACF,CAAA;AACA,IAAS,QAAA,CAAA,OAAA,CAAQ,IAAI,OAAO,CAAA,CAAA;AAC5B,IAAA,OAAO,MAAM;AACX,MAAA,QAAA,CAAS,UAAW,EAAA,CAAA;AAAA,KACtB,CAAA;AAAA,GACF,EAAG,CAAC,YAAY,CAAC,CAAA,CAAA;AAEjB,EAAO,OAAA,CAAC,KAAK,IAAI,CAAA,CAAA;AACnB;;;;"}
+{"version":3,"file":"useComponentSize.js","sources":["../src/contact-details/internal/useComponentSize.ts"],"sourcesContent":["import { useIsomorphicLayoutEffect } from \"@salt-ds/core\";\nimport { type MutableRefObject, useCallback, useRef, useState } from \"react\";\n\nexport interface ComponentSize {\n  height?: number;\n  width: number;\n}\n\nexport function useComponentSize<T extends HTMLElement>(\n  initialWidth: number,\n): [MutableRefObject<T | null>, ComponentSize] {\n  const [size, setSize] = useState<ComponentSize>({ width: initialWidth });\n  const ref = useRef<T>(null);\n\n  const handleResize = useCallback(function handleResize({\n    width,\n    height,\n  }: DOMRect) {\n    setSize({ width, height });\n  }, []);\n\n  useIsomorphicLayoutEffect(() => {\n    if (!ref.current) {\n      if (process.env.NODE_ENV !== \"production\") {\n        throw new Error(\n          \"ref returned by useComponentSize was not assigned to a component\",\n        );\n      }\n      return;\n    }\n    handleResize(ref.current.getBoundingClientRect());\n    const observer = new ResizeObserver(\n      (observerEntries: ResizeObserverEntry[]) => {\n        handleResize(observerEntries[0].contentRect);\n      },\n    );\n    observer.observe(ref.current);\n    return () => {\n      observer.disconnect();\n    };\n  }, [handleResize]);\n\n  return [ref, size];\n}\n"],"names":["useState","useRef","useCallback","handleResize","useIsomorphicLayoutEffect"],"mappings":";;;;;AAQO,SAAS,iBACd,YAAA,EAC6C;AAC7C,EAAA,MAAM,CAAC,MAAM,OAAO,CAAA,GAAIA,eAAwB,EAAE,KAAA,EAAO,cAAc,CAAA;AACvE,EAAA,MAAM,GAAA,GAAMC,aAAU,IAAI,CAAA;AAE1B,EAAA,MAAM,YAAA,GAAeC,iBAAA,CAAY,SAASC,aAAAA,CAAa;AAAA,IACrD,KAAA;AAAA,IACA;AAAA,GACF,EAAY;AACV,IAAA,OAAA,CAAQ,EAAE,KAAA,EAAO,MAAA,EAAQ,CAAA;AAAA,EAC3B,CAAA,EAAG,EAAE,CAAA;AAEL,EAAAC,8BAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,CAAC,IAAI,OAAA,EAAS;AAChB,MAAA,IAAI,OAAA,CAAQ,GAAA,CAAI,QAAA,KAAa,YAAA,EAAc;AACzC,QAAA,MAAM,IAAI,KAAA;AAAA,UACR;AAAA,SACF;AAAA,MACF;AACA,MAAA;AAAA,IACF;AACA,IAAA,YAAA,CAAa,GAAA,CAAI,OAAA,CAAQ,qBAAA,EAAuB,CAAA;AAChD,IAAA,MAAM,WAAW,IAAI,cAAA;AAAA,MACnB,CAAC,eAAA,KAA2C;AAC1C,QAAA,YAAA,CAAa,eAAA,CAAgB,CAAC,CAAA,CAAE,WAAW,CAAA;AAAA,MAC7C;AAAA,KACF;AACA,IAAA,QAAA,CAAS,OAAA,CAAQ,IAAI,OAAO,CAAA;AAC5B,IAAA,OAAO,MAAM;AACX,MAAA,QAAA,CAAS,UAAA,EAAW;AAAA,IACtB,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,YAAY,CAAC,CAAA;AAEjB,EAAA,OAAO,CAAC,KAAK,IAAI,CAAA;AACnB;;;;"}

package/dist-cjs/content-status/ContentStatus.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = "/* Styles applied to root component (ContentStatus) */\n.saltContentStatus {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  text-align: var(--salt-text-textAlign-embedded);\n  gap: var(--salt-size-unit);\n}\n\n/* Styles applied to inner content */\n.saltContentStatus-content {\n  color: var(--saltContentStatus-content-color, var(--salt-text-primary-foreground));\n  display: flex;\n  flex-direction: column;\n  gap: var(--salt-size-unit);\n}\n\n/* Styles applied to status title */\n.saltContentStatus-title {\n  font-weight: var(--salt-text-display1-fontWeight); /* TODO: Use correct token */\n}\n\n/* Styles applied to status message */\n.saltContentStatus-message {\n}\n\n/* Styles applied to status actions */\n.saltContentStatus-actions {\n  margin-top: var(--saltContentStatus-actions-marginTop, var(--salt-size-unit));\n}\n";
+var css_248z = "/* Styles applied to root component (ContentStatus) */\n.saltContentStatus {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  text-align: var(--salt-text-textAlign-embedded);\n  gap: var(--salt-size-unit);\n}\n\n/* Styles applied to inner content */\n.saltContentStatus-content {\n  color: var(--saltContentStatus-content-color, var(--salt-content-primary-foreground));\n  display: flex;\n  flex-direction: column;\n  gap: var(--salt-size-unit);\n\n  font-size: var(--salt-text-fontSize);\n  line-height: var(--salt-text-lineHeight);\n  font-family: var(--salt-text-fontFamily);\n  font-weight: var(--salt-text-fontWeight);\n}\n\n/* Styles applied to status title */\n.saltContentStatus-title.saltText {\n  font-weight: var(--salt-text-display1-fontWeight);\n  /* TODO: Use correct token */\n}\n\n/* Styles applied to status actions */\n.saltContentStatus-actions {\n  margin-top: var(--saltContentStatus-actions-marginTop, var(--salt-size-unit));\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=ContentStatus.css.js.map

package/dist-cjs/content-status/ContentStatus.js

@@ -1,18 +1,16 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var jsxRuntime = require('react/jsx-runtime');
 var core = require('@salt-ds/core');
-var clsx = require('clsx');
-var React = require('react');
-var StatusIndicator = require('./internal/StatusIndicator.js');
-var window = require('@salt-ds/window');
 var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var react = require('react');
 var ContentStatus$1 = require('./ContentStatus.css.js');
+var StatusIndicator = require('./internal/StatusIndicator.js');
 
 const withBaseName = core.makePrefixer("saltContentStatus");
-const ContentStatus = React.forwardRef(
+const ContentStatus = react.forwardRef(
   function ContentStatus2({
     CircularProgressProps,
     SpinnerProps,
@@ -25,7 +23,6 @@ const ContentStatus = React.forwardRef(
     onActionClick,
     status = "info",
     title,
-    unit = "%",
     value,
     ...rest
   }, ref) {
@@ -40,9 +37,8 @@ const ContentStatus = React.forwardRef(
     const hasActions = children || hasDefaultActionContent;
     const hasContent = title || message || hasActions;
     const { announce } = core.useAriaAnnouncer();
-    React.useEffect(() => {
-      if (disableAnnouncer)
-        return;
+    react.useEffect(() => {
+      if (disableAnnouncer) return;
       const toBeAnnounced = [];
       if (title) {
         toBeAnnounced.push(title);
@@ -54,15 +50,13 @@ const ContentStatus = React.forwardRef(
         toBeAnnounced.push(status);
       }
       if (toBeAnnounced.length > 0) {
-        announce(toBeAnnounced.join(" "));
+        announce(toBeAnnounced.join(" "), { ariaLive: "polite" });
       }
     }, [announce, disableAnnouncer, message, status, title]);
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-      className: clsx.clsx(withBaseName(), className),
-      ref,
-      ...rest,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(StatusIndicator.StatusIndicator, {
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx.clsx(withBaseName(), className), ref, ...rest, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        StatusIndicator.StatusIndicator,
+        {
           CircularProgressProps,
           SpinnerProps,
           disableAnnouncer,
@@ -70,36 +64,25 @@ const ContentStatus = React.forwardRef(
           message,
           status,
           title,
-          unit,
           value,
           ...rest
-        }),
-        hasContent && /* @__PURE__ */ jsxRuntime.jsxs("div", {
+        }
+      ),
+      hasContent && /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
           "aria-labelledby": id,
           className: clsx.clsx(withBaseName("content")),
           id,
           role: "region",
           children: [
-            title && /* @__PURE__ */ jsxRuntime.jsx(core.Text, {
-              className: clsx.clsx(withBaseName("title")),
-              children: title
-            }),
-            message && /* @__PURE__ */ jsxRuntime.jsx(core.Text, {
-              className: clsx.clsx(withBaseName("message")),
-              children: message
-            }),
-            hasActions && /* @__PURE__ */ jsxRuntime.jsx("div", {
-              className: clsx.clsx(withBaseName("actions")),
-              children: children || /* @__PURE__ */ jsxRuntime.jsx(core.Button, {
-                onClick: onActionClick,
-                ref: buttonRef,
-                children: actionLabel
-              })
-            })
+            title && /* @__PURE__ */ jsxRuntime.jsx(core.Text, { className: clsx.clsx(withBaseName("title")), children: title }),
+            message && /* @__PURE__ */ jsxRuntime.jsx(core.Text, { className: clsx.clsx(withBaseName("message")), children: message }),
+            hasActions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx.clsx(withBaseName("actions")), children: children || /* @__PURE__ */ jsxRuntime.jsx(core.Button, { onClick: onActionClick, ref: buttonRef, children: actionLabel }) })
           ]
-        })
-      ]
-    });
+        }
+      )
+    ] });
   }
 );
 

package/dist-cjs/content-status/ContentStatus.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContentStatus.js","sources":["../src/content-status/ContentStatus.tsx"],"sourcesContent":["import {\n  Button,\n  makePrefixer,\n  Text,\n  useAriaAnnouncer,\n  useId,\n} from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, MouseEvent, Ref, useEffect } from \"react\";\n\nimport {\n  StatusIndicator,\n  StatusIndicatorProps,\n} from \"./internal/StatusIndicator\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport contentStatusCss from \"./ContentStatus.css\";\n\nconst withBaseName = makePrefixer(\"saltContentStatus\");\n\nexport interface ContentStatusProps\n  extends HTMLAttributes<HTMLDivElement>,\n    StatusIndicatorProps {\n  actionLabel?: string;\n  buttonRef?: Ref<any>;\n  onActionClick?: (evt: MouseEvent<HTMLButtonElement>) => void;\n}\n\nexport const ContentStatus = forwardRef<HTMLDivElement, ContentStatusProps>(\n  function ContentStatus(\n    {\n      CircularProgressProps,\n      SpinnerProps,\n      actionLabel,\n      buttonRef,\n      className,\n      children,\n      disableAnnouncer,\n      message,\n      onActionClick,\n      status = \"info\",\n      title,\n      unit = \"%\",\n      value,\n      ...rest\n    },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-content-status\",\n      css: contentStatusCss,\n      window: targetWindow,\n    });\n\n    const id = useId();\n\n    const hasDefaultActionContent = actionLabel && onActionClick;\n    const hasActions = children || hasDefaultActionContent;\n    const hasContent = title || message || hasActions;\n\n    const { announce } = useAriaAnnouncer();\n\n    useEffect(() => {\n      if (disableAnnouncer) return;\n\n      const toBeAnnounced = [];\n      if (title) {\n        toBeAnnounced.push(title);\n      }\n      if (message) {\n        toBeAnnounced.push(message);\n      }\n      // Loading is announced by the spinner\n      if (status !== \"loading\") {\n        toBeAnnounced.push(status);\n      }\n      if (toBeAnnounced.length > 0) {\n        announce(toBeAnnounced.join(\" \"));\n      }\n    }, [announce, disableAnnouncer, message, status, title]);\n\n    return (\n      <div className={clsx(withBaseName(), className)} ref={ref} {...rest}>\n        <StatusIndicator\n          CircularProgressProps={CircularProgressProps}\n          SpinnerProps={SpinnerProps}\n          disableAnnouncer={disableAnnouncer}\n          id={id}\n          message={message}\n          status={status}\n          title={title}\n          unit={unit}\n          value={value}\n          {...rest}\n        />\n        {hasContent && (\n          <div\n            // `aria-labelledby` to itself so that children of this div will show up in screen reader, and we don't need to join to aria-label\n            aria-labelledby={id}\n            className={clsx(withBaseName(\"content\"))}\n            id={id}\n            role=\"region\"\n          >\n            {title && (\n              <Text className={clsx(withBaseName(\"title\"))}>{title}</Text>\n            )}\n            {message && (\n              <Text className={clsx(withBaseName(\"message\"))}>{message}</Text>\n            )}\n            {hasActions && (\n              <div className={clsx(withBaseName(\"actions\"))}>\n                {children || (\n                  <Button onClick={onActionClick} ref={buttonRef}>\n                    {actionLabel}\n                  </Button>\n                )}\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","ContentStatus","useWindow","useComponentCssInjection","contentStatusCss","useId","useAriaAnnouncer","useEffect","jsxs","clsx","jsx","StatusIndicator","Text","Button"],"mappings":"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"}
+{"version":3,"file":"ContentStatus.js","sources":["../src/content-status/ContentStatus.tsx"],"sourcesContent":["import {\n  Button,\n  makePrefixer,\n  Text,\n  useAriaAnnouncer,\n  useId,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  forwardRef,\n  type HTMLAttributes,\n  type MouseEvent,\n  type Ref,\n  useEffect,\n} from \"react\";\nimport contentStatusCss from \"./ContentStatus.css\";\nimport {\n  StatusIndicator,\n  type StatusIndicatorProps,\n} from \"./internal/StatusIndicator\";\n\nconst withBaseName = makePrefixer(\"saltContentStatus\");\n\nexport interface ContentStatusProps\n  extends HTMLAttributes<HTMLDivElement>,\n    StatusIndicatorProps {\n  actionLabel?: string;\n  buttonRef?: Ref<HTMLButtonElement>;\n  onActionClick?: (evt: MouseEvent<HTMLButtonElement>) => void;\n}\n\nexport const ContentStatus = forwardRef<HTMLDivElement, ContentStatusProps>(\n  function ContentStatus(\n    {\n      CircularProgressProps,\n      SpinnerProps,\n      actionLabel,\n      buttonRef,\n      className,\n      children,\n      disableAnnouncer,\n      message,\n      onActionClick,\n      status = \"info\",\n      title,\n      value,\n      ...rest\n    },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-content-status\",\n      css: contentStatusCss,\n      window: targetWindow,\n    });\n\n    const id = useId();\n\n    const hasDefaultActionContent = actionLabel && onActionClick;\n    const hasActions = children || hasDefaultActionContent;\n    const hasContent = title || message || hasActions;\n\n    const { announce } = useAriaAnnouncer();\n\n    useEffect(() => {\n      if (disableAnnouncer) return;\n\n      const toBeAnnounced = [];\n      if (title) {\n        toBeAnnounced.push(title);\n      }\n      if (message) {\n        toBeAnnounced.push(message);\n      }\n      // Loading is announced by the spinner\n      if (status !== \"loading\") {\n        toBeAnnounced.push(status);\n      }\n      if (toBeAnnounced.length > 0) {\n        announce(toBeAnnounced.join(\" \"), { ariaLive: \"polite\" });\n      }\n    }, [announce, disableAnnouncer, message, status, title]);\n\n    return (\n      <div className={clsx(withBaseName(), className)} ref={ref} {...rest}>\n        <StatusIndicator\n          CircularProgressProps={CircularProgressProps}\n          SpinnerProps={SpinnerProps}\n          disableAnnouncer={disableAnnouncer}\n          id={id}\n          message={message}\n          status={status}\n          title={title}\n          value={value}\n          {...rest}\n        />\n        {hasContent && (\n          <div\n            // `aria-labelledby` to itself so that children of this div will show up in screen reader, and we don't need to join to aria-label\n            aria-labelledby={id}\n            className={clsx(withBaseName(\"content\"))}\n            id={id}\n            role=\"region\"\n          >\n            {title && (\n              <Text className={clsx(withBaseName(\"title\"))}>{title}</Text>\n            )}\n            {message && (\n              <Text className={clsx(withBaseName(\"message\"))}>{message}</Text>\n            )}\n            {hasActions && (\n              <div className={clsx(withBaseName(\"actions\"))}>\n                {children || (\n                  <Button onClick={onActionClick} ref={buttonRef}>\n                    {actionLabel}\n                  </Button>\n                )}\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","ContentStatus","useWindow","useComponentCssInjection","contentStatusCss","useId","useAriaAnnouncer","useEffect","jsxs","clsx","jsx","StatusIndicator","Text","Button"],"mappings":"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"}

package/dist-cjs/content-status/internal/StatusIndicator.js

@@ -1,18 +1,13 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var jsxRuntime = require('react/jsx-runtime');
 var core = require('@salt-ds/core');
 var clsx = require('clsx');
-var CircularProgress = require('../../progress/CircularProgress/CircularProgress.js');
-require('../../progress/LinearProgress/LinearProgress.js');
 
 const withBaseName = core.makePrefixer("saltContentStatus");
 function StatusIndicator({
   status = "info",
   disableAnnouncer,
-  unit,
   value,
   title,
   message,
@@ -25,31 +20,38 @@ function StatusIndicator({
 }) {
   if (status === "loading") {
     if (value !== void 0) {
-      return /* @__PURE__ */ jsxRuntime.jsx(CircularProgress.CircularProgress, {
-        "aria-label": title || message,
-        className: clsx.clsx(
-          withBaseName("determinateLoading"),
-          circularProgressClassName
-        ),
-        size: "small",
-        unit,
-        value,
-        ...restCircularProgressProps
-      });
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        core.CircularProgress,
+        {
+          "aria-label": title || message,
+          className: clsx.clsx(
+            withBaseName("determinateLoading"),
+            circularProgressClassName
+          ),
+          value,
+          ...restCircularProgressProps
+        }
+      );
     }
-    return /* @__PURE__ */ jsxRuntime.jsx(core.Spinner, {
-      className: clsx.clsx(withBaseName("indeterminateLoading"), spinnerClassName),
-      completionAnnouncement: null,
-      "data-testid": `spinner-${id}`,
-      disableAnnouncer,
-      ...restSpinnerProps
-    });
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      core.Spinner,
+      {
+        className: clsx.clsx(withBaseName("indeterminateLoading"), spinnerClassName),
+        completionAnnouncement: null,
+        "data-testid": `spinner-${id}`,
+        disableAnnouncer,
+        ...restSpinnerProps
+      }
+    );
   }
-  return /* @__PURE__ */ jsxRuntime.jsx(core.StatusIndicator, {
-    status,
-    "data-jpmui-test": `icon-${status}-${id}`,
-    size: 2
-  });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    core.StatusIndicator,
+    {
+      status,
+      "data-jpmui-test": `icon-${status}-${id}`,
+      size: 2
+    }
+  );
 }
 
 exports.StatusIndicator = StatusIndicator;

package/dist-cjs/content-status/internal/StatusIndicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusIndicator.js","sources":["../src/content-status/internal/StatusIndicator.tsx"],"sourcesContent":["import {\n  makePrefixer,\n  StatusIndicator as BaseStatusIndicator,\n  StatusIndicatorProps as BaseStatusIndicatorProps,\n  Spinner,\n  SpinnerProps,\n} from \"@salt-ds/core\";\nimport { ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport { CircularProgress, CircularProgressProps } from \"../../progress\";\n\nexport interface StatusIndicatorProps\n  extends Pick<SpinnerProps, \"disableAnnouncer\">,\n    Pick<CircularProgressProps, \"unit\" | \"value\"> {\n  title?: string;\n  message?: string;\n  CircularProgressProps?: Partial<CircularProgressProps>;\n  SpinnerProps?: Partial<SpinnerProps>;\n  id?: string;\n  status?: BaseStatusIndicatorProps[\"status\"] | \"loading\";\n}\n\nconst withBaseName = makePrefixer(\"saltContentStatus\");\n\nexport function StatusIndicator({\n  status = \"info\",\n  disableAnnouncer,\n  unit,\n  value,\n  title,\n  message,\n  CircularProgressProps: {\n    className: circularProgressClassName,\n    ...restCircularProgressProps\n  } = {},\n  SpinnerProps: { className: spinnerClassName, ...restSpinnerProps } = {},\n  id,\n}: StatusIndicatorProps): ReactElement {\n  if (status === \"loading\") {\n    if (value !== undefined) {\n      return (\n        <CircularProgress\n          aria-label={title || message}\n          className={clsx(\n            withBaseName(\"determinateLoading\"),\n            circularProgressClassName\n          )}\n          size=\"small\"\n          unit={unit}\n          value={value}\n          {...restCircularProgressProps}\n        />\n      );\n    }\n    return (\n      <Spinner\n        className={clsx(withBaseName(\"indeterminateLoading\"), spinnerClassName)}\n        // Announcement of the content status is more useful than completion announcement from spinner\n        completionAnnouncement={null}\n        data-testid={`spinner-${id!}`}\n        disableAnnouncer={disableAnnouncer}\n        {...restSpinnerProps}\n      />\n    );\n  }\n\n  return (\n    <BaseStatusIndicator\n      status={status}\n      data-jpmui-test={`icon-${status}-${id!}`}\n      size={2}\n    />\n  );\n}\n"],"names":["makePrefixer","jsx","CircularProgress","clsx","Spinner","BaseStatusIndicator"],"mappings":";;;;;;;;;;AAuBA,MAAM,YAAA,GAAeA,kBAAa,mBAAmB,CAAA,CAAA;AAE9C,SAAS,eAAgB,CAAA;AAAA,EAC9B,MAAS,GAAA,MAAA;AAAA,EACT,gBAAA;AAAA,EACA,IAAA;AAAA,EACA,KAAA;AAAA,EACA,KAAA;AAAA,EACA,OAAA;AAAA,EACA,qBAAuB,EAAA;AAAA,IACrB,SAAW,EAAA,yBAAA;AAAA,IACR,GAAA,yBAAA;AAAA,MACD,EAAC;AAAA,EACL,cAAc,EAAE,SAAA,EAAW,gBAAqB,EAAA,GAAA,gBAAA,KAAqB,EAAC;AAAA,EACtE,EAAA;AACF,CAAuC,EAAA;AACrC,EAAA,IAAI,WAAW,SAAW,EAAA;AACxB,IAAA,IAAI,UAAU,KAAW,CAAA,EAAA;AACvB,MAAA,uBACGC,cAAA,CAAAC,iCAAA,EAAA;AAAA,QACC,cAAY,KAAS,IAAA,OAAA;AAAA,QACrB,SAAW,EAAAC,SAAA;AAAA,UACT,aAAa,oBAAoB,CAAA;AAAA,UACjC,yBAAA;AAAA,SACF;AAAA,QACA,IAAK,EAAA,OAAA;AAAA,QACL,IAAA;AAAA,QACA,KAAA;AAAA,QACC,GAAG,yBAAA;AAAA,OACN,CAAA,CAAA;AAAA,KAEJ;AACA,IAAA,uBACGF,cAAA,CAAAG,YAAA,EAAA;AAAA,MACC,SAAW,EAAAD,SAAA,CAAK,YAAa,CAAA,sBAAsB,GAAG,gBAAgB,CAAA;AAAA,MAEtE,sBAAwB,EAAA,IAAA;AAAA,MACxB,eAAa,CAAW,QAAA,EAAA,EAAA,CAAA,CAAA;AAAA,MACxB,gBAAA;AAAA,MACC,GAAG,gBAAA;AAAA,KACN,CAAA,CAAA;AAAA,GAEJ;AAEA,EAAA,uBACGF,cAAA,CAAAI,oBAAA,EAAA;AAAA,IACC,MAAA;AAAA,IACA,iBAAA,EAAiB,QAAQ,MAAU,CAAA,CAAA,EAAA,EAAA,CAAA,CAAA;AAAA,IACnC,IAAM,EAAA,CAAA;AAAA,GACR,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"StatusIndicator.js","sources":["../src/content-status/internal/StatusIndicator.tsx"],"sourcesContent":["import {\n  StatusIndicator as BaseStatusIndicator,\n  type StatusIndicatorProps as BaseStatusIndicatorProps,\n  CircularProgress,\n  type CircularProgressProps,\n  makePrefixer,\n  Spinner,\n  type SpinnerProps,\n} from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport type { ReactElement } from \"react\";\n\nexport interface StatusIndicatorProps\n  extends Pick<SpinnerProps, \"disableAnnouncer\">,\n    Pick<CircularProgressProps, \"value\"> {\n  title?: string;\n  message?: string;\n  CircularProgressProps?: Partial<CircularProgressProps>;\n  SpinnerProps?: Partial<SpinnerProps>;\n  id?: string;\n  status?: BaseStatusIndicatorProps[\"status\"] | \"loading\";\n}\n\nconst withBaseName = makePrefixer(\"saltContentStatus\");\n\nexport function StatusIndicator({\n  status = \"info\",\n  disableAnnouncer,\n  value,\n  title,\n  message,\n  CircularProgressProps: {\n    className: circularProgressClassName,\n    ...restCircularProgressProps\n  } = {},\n  SpinnerProps: { className: spinnerClassName, ...restSpinnerProps } = {},\n  id,\n}: StatusIndicatorProps): ReactElement {\n  if (status === \"loading\") {\n    if (value !== undefined) {\n      return (\n        <CircularProgress\n          aria-label={title || message}\n          className={clsx(\n            withBaseName(\"determinateLoading\"),\n            circularProgressClassName,\n          )}\n          value={value}\n          {...restCircularProgressProps}\n        />\n      );\n    }\n    return (\n      <Spinner\n        className={clsx(withBaseName(\"indeterminateLoading\"), spinnerClassName)}\n        // Announcement of the content status is more useful than completion announcement from spinner\n        completionAnnouncement={null}\n        data-testid={`spinner-${id}`}\n        disableAnnouncer={disableAnnouncer}\n        {...restSpinnerProps}\n      />\n    );\n  }\n\n  return (\n    <BaseStatusIndicator\n      status={status}\n      data-jpmui-test={`icon-${status}-${id}`}\n      size={2}\n    />\n  );\n}\n"],"names":["makePrefixer","jsx","CircularProgress","clsx","Spinner","BaseStatusIndicator"],"mappings":";;;;;;AAuBA,MAAM,YAAA,GAAeA,kBAAa,mBAAmB,CAAA;AAE9C,SAAS,eAAA,CAAgB;AAAA,EAC9B,MAAA,GAAS,MAAA;AAAA,EACT,gBAAA;AAAA,EACA,KAAA;AAAA,EACA,KAAA;AAAA,EACA,OAAA;AAAA,EACA,qBAAA,EAAuB;AAAA,IACrB,SAAA,EAAW,yBAAA;AAAA,IACX,GAAG;AAAA,MACD,EAAC;AAAA,EACL,cAAc,EAAE,SAAA,EAAW,kBAAkB,GAAG,gBAAA,KAAqB,EAAC;AAAA,EACtE;AACF,CAAA,EAAuC;AACrC,EAAA,IAAI,WAAW,SAAA,EAAW;AACxB,IAAA,IAAI,UAAU,MAAA,EAAW;AACvB,MAAA,uBACEC,cAAA;AAAA,QAACC,qBAAA;AAAA,QAAA;AAAA,UACC,cAAY,KAAA,IAAS,OAAA;AAAA,UACrB,SAAA,EAAWC,SAAA;AAAA,YACT,aAAa,oBAAoB,CAAA;AAAA,YACjC;AAAA,WACF;AAAA,UACA,KAAA;AAAA,UACC,GAAG;AAAA;AAAA,OACN;AAAA,IAEJ;AACA,IAAA,uBACEF,cAAA;AAAA,MAACG,YAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAWD,SAAA,CAAK,YAAA,CAAa,sBAAsB,GAAG,gBAAgB,CAAA;AAAA,QAEtE,sBAAA,EAAwB,IAAA;AAAA,QACxB,aAAA,EAAa,WAAW,EAAE,CAAA,CAAA;AAAA,QAC1B,gBAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AAEA,EAAA,uBACEF,cAAA;AAAA,IAACI,oBAAA;AAAA,IAAA;AAAA,MACC,MAAA;AAAA,MACA,iBAAA,EAAiB,CAAA,KAAA,EAAQ,MAAM,CAAA,CAAA,EAAI,EAAE,CAAA,CAAA;AAAA,MACrC,IAAA,EAAM;AAAA;AAAA,GACR;AAEJ;;;;"}

package/dist-cjs/deck-item/DeckItem.js

@@ -1,17 +1,15 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var jsxRuntime = require('react/jsx-runtime');
-var clsx = require('clsx');
-var React = require('react');
 var core = require('@salt-ds/core');
-var window = require('@salt-ds/window');
 var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var react = require('react');
 var DeckItem$1 = require('./DeckItem.css.js');
 
 const withBaseName = core.makePrefixer("saltDeckItem");
-const DeckItem = React.forwardRef(
+const DeckItem = react.forwardRef(
   function DeckItem2({
     activeIndex = 0,
     animation,
@@ -28,33 +26,38 @@ const DeckItem = React.forwardRef(
       css: DeckItem$1,
       window: targetWindow
     });
-    const sliderRef = React.useRef(null);
+    const sliderRef = react.useRef(null);
     const isCurrent = activeIndex === index;
-    const position = React.useMemo(() => {
+    const position = react.useMemo(() => {
       return isCurrent ? "current" : activeIndex < index ? "next" : "previous";
     }, [activeIndex, index, isCurrent]);
     const classesIndex = animation && position === "current" ? 0 : 1;
     const getActiveClasses = [
       `${animation || "fade"}-in`,
+      // in-right
       `${animation || "fade"}-out`
+      // out-left
     ];
     const id = core.useId(idProp);
-    return /* @__PURE__ */ jsxRuntime.jsx("div", {
-      className: clsx.clsx(
-        withBaseName(),
-        withBaseName(`${animation ? animation : "static"}-${position}`),
-        {
-          [withBaseName(getActiveClasses[classesIndex])]: animation === "fade"
-        },
-        className
-      ),
-      ref: core.useForkRef(ref, sliderRef),
-      role,
-      tabIndex: isCurrent ? 0 : -1,
-      id,
-      ...rest,
-      children
-    });
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: clsx.clsx(
+          withBaseName(),
+          withBaseName(`${animation ? animation : "static"}-${position}`),
+          {
+            [withBaseName(getActiveClasses[classesIndex])]: animation === "fade"
+          },
+          className
+        ),
+        ref: core.useForkRef(ref, sliderRef),
+        role,
+        tabIndex: isCurrent ? 0 : -1,
+        id,
+        ...rest,
+        children
+      }
+    );
   }
 );
 

package/dist-cjs/deck-item/DeckItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"DeckItem.js","sources":["../src/deck-item/DeckItem.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, useMemo, useRef } from \"react\";\nimport { makePrefixer, useForkRef, useId } from \"@salt-ds/core\";\nimport { LayoutAnimation } from \"../deck-layout\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport deckItemCss from \"./DeckItem.css\";\n\nconst withBaseName = makePrefixer(\"saltDeckItem\");\n\nexport interface DeckItemProps extends HTMLAttributes<HTMLDivElement> {\n  activeIndex?: number;\n  animation?: LayoutAnimation;\n  index: number;\n  role?: string;\n}\n\nexport const DeckItem = forwardRef<HTMLDivElement, DeckItemProps>(\n  function DeckItem(\n    {\n      activeIndex = 0,\n      animation,\n      children,\n      className,\n      index,\n      role = \"group\",\n      id: idProp,\n      ...rest\n    },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-deck-item\",\n      css: deckItemCss,\n      window: targetWindow,\n    });\n\n    const sliderRef = useRef<HTMLDivElement | null>(null);\n\n    const isCurrent = activeIndex === index;\n\n    const position = useMemo(() => {\n      return isCurrent ? \"current\" : activeIndex < index ? \"next\" : \"previous\";\n    }, [activeIndex, index, isCurrent]);\n\n    const classesIndex = animation && position === \"current\" ? 0 : 1;\n\n    const getActiveClasses = [\n      `${animation || \"fade\"}-in`, // in-right\n      `${animation || \"fade\"}-out`, // out-left\n    ];\n\n    const id = useId(idProp);\n\n    return (\n      <div\n        className={clsx(\n          withBaseName(),\n          withBaseName(`${animation ? animation : \"static\"}-${position}`),\n          {\n            [withBaseName(getActiveClasses[classesIndex])]:\n              animation === \"fade\",\n          },\n          className\n        )}\n        ref={useForkRef(ref, sliderRef)}\n        role={role}\n        tabIndex={isCurrent ? 0 : -1}\n        id={id}\n        {...rest}\n      >\n        {children}\n      </div>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","DeckItem","useWindow","useComponentCssInjection","deckItemCss","useRef","useMemo","useId","jsx","clsx","useForkRef"],"mappings":";;;;;;;;;;;;AAUA,MAAM,YAAA,GAAeA,kBAAa,cAAc,CAAA,CAAA;AASzC,MAAM,QAAW,GAAAC,gBAAA;AAAA,EACtB,SAASC,SACP,CAAA;AAAA,IACE,WAAc,GAAA,CAAA;AAAA,IACd,SAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAO,GAAA,OAAA;AAAA,IACP,EAAI,EAAA,MAAA;AAAA,IACD,GAAA,IAAA;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,UAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAM,MAAA,SAAA,GAAYC,aAA8B,IAAI,CAAA,CAAA;AAEpD,IAAA,MAAM,YAAY,WAAgB,KAAA,KAAA,CAAA;AAElC,IAAM,MAAA,QAAA,GAAWC,cAAQ,MAAM;AAC7B,MAAA,OAAO,SAAY,GAAA,SAAA,GAAY,WAAc,GAAA,KAAA,GAAQ,MAAS,GAAA,UAAA,CAAA;AAAA,KAC7D,EAAA,CAAC,WAAa,EAAA,KAAA,EAAO,SAAS,CAAC,CAAA,CAAA;AAElC,IAAA,MAAM,YAAe,GAAA,SAAA,IAAa,QAAa,KAAA,SAAA,GAAY,CAAI,GAAA,CAAA,CAAA;AAE/D,IAAA,MAAM,gBAAmB,GAAA;AAAA,MACvB,GAAG,SAAa,IAAA,MAAA,CAAA,GAAA,CAAA;AAAA,MAChB,GAAG,SAAa,IAAA,MAAA,CAAA,IAAA,CAAA;AAAA,KAClB,CAAA;AAEA,IAAM,MAAA,EAAA,GAAKC,WAAM,MAAM,CAAA,CAAA;AAEvB,IAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,YAAa,CAAA,CAAA,EAAG,SAAY,GAAA,SAAA,GAAY,YAAY,QAAU,CAAA,CAAA,CAAA;AAAA,QAC9D;AAAA,UACE,CAAC,YAAA,CAAa,gBAAiB,CAAA,YAAA,CAAa,IAC1C,SAAc,KAAA,MAAA;AAAA,SAClB;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,GAAA,EAAKC,eAAW,CAAA,GAAA,EAAK,SAAS,CAAA;AAAA,MAC9B,IAAA;AAAA,MACA,QAAA,EAAU,YAAY,CAAI,GAAA,CAAA,CAAA;AAAA,MAC1B,EAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"DeckItem.js","sources":["../src/deck-item/DeckItem.tsx"],"sourcesContent":["import { makePrefixer, useForkRef, useId } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes, useMemo, useRef } from \"react\";\nimport type { LayoutAnimation } from \"../deck-layout\";\n\nimport deckItemCss from \"./DeckItem.css\";\n\nconst withBaseName = makePrefixer(\"saltDeckItem\");\n\nexport interface DeckItemProps extends HTMLAttributes<HTMLDivElement> {\n  activeIndex?: number;\n  animation?: LayoutAnimation;\n  index: number;\n  role?: string;\n}\n\nexport const DeckItem = forwardRef<HTMLDivElement, DeckItemProps>(\n  function DeckItem(\n    {\n      activeIndex = 0,\n      animation,\n      children,\n      className,\n      index,\n      role = \"group\",\n      id: idProp,\n      ...rest\n    },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-deck-item\",\n      css: deckItemCss,\n      window: targetWindow,\n    });\n\n    const sliderRef = useRef<HTMLDivElement | null>(null);\n\n    const isCurrent = activeIndex === index;\n\n    const position = useMemo(() => {\n      return isCurrent ? \"current\" : activeIndex < index ? \"next\" : \"previous\";\n    }, [activeIndex, index, isCurrent]);\n\n    const classesIndex = animation && position === \"current\" ? 0 : 1;\n\n    const getActiveClasses = [\n      `${animation || \"fade\"}-in`, // in-right\n      `${animation || \"fade\"}-out`, // out-left\n    ];\n\n    const id = useId(idProp);\n\n    return (\n      <div\n        className={clsx(\n          withBaseName(),\n          withBaseName(`${animation ? animation : \"static\"}-${position}`),\n          {\n            [withBaseName(getActiveClasses[classesIndex])]:\n              animation === \"fade\",\n          },\n          className,\n        )}\n        ref={useForkRef(ref, sliderRef)}\n        role={role}\n        tabIndex={isCurrent ? 0 : -1}\n        id={id}\n        {...rest}\n      >\n        {children}\n      </div>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","DeckItem","useWindow","useComponentCssInjection","deckItemCss","useRef","useMemo","useId","jsx","clsx","useForkRef"],"mappings":";;;;;;;;;;AASA,MAAM,YAAA,GAAeA,kBAAa,cAAc,CAAA;AASzC,MAAM,QAAA,GAAWC,gBAAA;AAAA,EACtB,SAASC,SAAAA,CACP;AAAA,IACE,WAAA,GAAc,CAAA;AAAA,IACd,SAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA,GAAO,OAAA;AAAA,IACP,EAAA,EAAI,MAAA;AAAA,IACJ,GAAG;AAAA,KAEL,GAAA,EACA;AACA,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,gBAAA;AAAA,MACR,GAAA,EAAKC,UAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,SAAA,GAAYC,aAA8B,IAAI,CAAA;AAEpD,IAAA,MAAM,YAAY,WAAA,KAAgB,KAAA;AAElC,IAAA,MAAM,QAAA,GAAWC,cAAQ,MAAM;AAC7B,MAAA,OAAO,SAAA,GAAY,SAAA,GAAY,WAAA,GAAc,KAAA,GAAQ,MAAA,GAAS,UAAA;AAAA,IAChE,CAAA,EAAG,CAAC,WAAA,EAAa,KAAA,EAAO,SAAS,CAAC,CAAA;AAElC,IAAA,MAAM,YAAA,GAAe,SAAA,IAAa,QAAA,KAAa,SAAA,GAAY,CAAA,GAAI,CAAA;AAE/D,IAAA,MAAM,gBAAA,GAAmB;AAAA,MACvB,CAAA,EAAG,aAAa,MAAM,CAAA,GAAA,CAAA;AAAA;AAAA,MACtB,CAAA,EAAG,aAAa,MAAM,CAAA,IAAA;AAAA;AAAA,KACxB;AAEA,IAAA,MAAM,EAAA,GAAKC,WAAM,MAAM,CAAA;AAEvB,IAAA,uBACEC,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAWC,SAAA;AAAA,UACT,YAAA,EAAa;AAAA,UACb,aAAa,CAAA,EAAG,SAAA,GAAY,YAAY,QAAQ,CAAA,CAAA,EAAI,QAAQ,CAAA,CAAE,CAAA;AAAA,UAC9D;AAAA,YACE,CAAC,YAAA,CAAa,gBAAA,CAAiB,YAAY,CAAC,CAAC,GAC3C,SAAA,KAAc;AAAA,WAClB;AAAA,UACA;AAAA,SACF;AAAA,QACA,GAAA,EAAKC,eAAA,CAAW,GAAA,EAAK,SAAS,CAAA;AAAA,QAC9B,IAAA;AAAA,QACA,QAAA,EAAU,YAAY,CAAA,GAAI,EAAA;AAAA,QAC1B,EAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;;;;"}