boreal-ui 0.0.31 → 0.0.33

package/dist/core/{Chip-DjWJJ19V.js → Chip-ByR2AKjl.js}

@@ -5,7 +5,7 @@ import { c as combineClassNames } from "./classNames-AS8QjFq7.js";
 import { c as capitalize } from "./capitalize-C0TSQSPh.js";
 import { a as getDefaultRounding, b as getDefaultShadow, c as getDefaultSize, d as getDefaultTheme } from "./boreal-style-config-BILmxkZG.js";
 import { C as CloseIcon } from "./CloseIcon-C3eQm4EK.js";
-import { I as IconButton } from "./IconButton-Dsw2M1s8.js";
+import { I as IconButton } from "./IconButton-B9WWbeSM.js";
 const ChipBase = ({
   id,
   message,
@@ -25,6 +25,7 @@ const ChipBase = ({
   closeIcon: CloseIcon2,
   IconButtonComponent,
   classMap,
+  stackIndex,
   "data-testid": testId = "chip"
 }) => {
   const [closing, setClosing] = useState(false);
@@ -38,6 +39,17 @@ const ChipBase = ({
       return () => clearTimeout(timer);
     }
   }, [autoClose, duration, visible, handleClose]);
+  useEffect(() => {
+    if (visible) setClosing(false);
+  }, [visible]);
+  useEffect(() => {
+    if (!visible) return;
+    const onKey = (e) => {
+      if (e.key === "Escape") handleClose();
+    };
+    window.addEventListener("keydown", onKey);
+    return () => window.removeEventListener("keydown", onKey);
+  }, [visible, handleClose]);
   if (!visible && !closing) return null;
   const chipClassName = combineClassNames(
     classMap.chip,
@@ -56,12 +68,21 @@ const ChipBase = ({
     "div",
     {
       className: chipClassName,
-      role: "status",
-      "aria-live": "polite",
+      role: "alert",
+      "aria-live": "assertive",
       "aria-atomic": "true",
       "data-testid": testId,
+      style: stackIndex != null ? { zIndex: stackIndex } : void 0,
       children: [
-        Icon && /* @__PURE__ */ jsx("span", { className: classMap.icon, "aria-hidden": "true", "data-testid": "icon", children: /* @__PURE__ */ jsx(Icon, { className: classMap.inner_icon }) }),
+        Icon && /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: classMap.icon,
+            "aria-hidden": "true",
+            "data-testid": `${testId}-icon`,
+            children: /* @__PURE__ */ jsx(Icon, { className: classMap.inner_icon })
+          }
+        ),
         /* @__PURE__ */ jsx("span", { className: classMap.message, id: `${testId}-message`, children: message }),
         /* @__PURE__ */ jsx(
           IconButtonComponent,
@@ -74,15 +95,7 @@ const ChipBase = ({
             className: classMap.close,
             onClick: handleClose,
             shadow: "none",
-            onKeyDown: (e) => {
-              if (e.key === "Enter" || e.key === " ") {
-                e.preventDefault();
-                handleClose();
-              }
-            },
-            role: "button",
-            tabIndex: 0,
-            "data-testid": "chip-close"
+            "data-testid": `${testId}-chip-close`
           }
         )
       ]
@@ -94,6 +107,7 @@ const ChipBase = ({
   }
   return chipElement;
 };
+ChipBase.displayName = "ChipBase";
 const classes = {
   chip: "chip",
   icon: "chip_icon",
@@ -144,4 +158,4 @@ const Chip = (props) => /* @__PURE__ */ jsx(
 export {
   Chip as C
 };
-//# sourceMappingURL=Chip-DjWJJ19V.js.map
+//# sourceMappingURL=Chip-ByR2AKjl.js.map

package/dist/core/Chip-ByR2AKjl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chip-ByR2AKjl.js","sources":["../../src/components/Chip/ChipBase.tsx","../../src/components/Chip/core/Chip.tsx"],"sourcesContent":["import { useCallback, useEffect, useState, KeyboardEvent } from \"react\";\r\nimport { createPortal } from \"react-dom\";\r\nimport { ChipBaseProps } from \"./Chip.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultSize,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst ChipBase: React.FC<ChipBaseProps> = ({\r\n  id,\r\n  message,\r\n  visible,\r\n  onClose,\r\n  icon: Icon,\r\n  size = getDefaultSize(),\r\n  theme = getDefaultTheme(),\r\n  rounding = getDefaultRounding(),\r\n  shadow = getDefaultShadow(),\r\n  state = \"\",\r\n  position = \"topCenter\",\r\n  usePortal = true,\r\n  className = \"\",\r\n  autoClose = true,\r\n  duration = 3000,\r\n  closeIcon: CloseIcon,\r\n  IconButtonComponent,\r\n  classMap,\r\n  stackIndex,\r\n  \"data-testid\": testId = \"chip\",\r\n}) => {\r\n  const [closing, setClosing] = useState(false);\r\n\r\n  const handleClose = useCallback(() => {\r\n    setClosing(true);\r\n    setTimeout(() => onClose?.(), 300);\r\n  }, [onClose]);\r\n\r\n  useEffect(() => {\r\n    if (autoClose && visible) {\r\n      const timer = setTimeout(() => handleClose(), duration);\r\n      return () => clearTimeout(timer);\r\n    }\r\n  }, [autoClose, duration, visible, handleClose]);\r\n\r\n  useEffect(() => {\r\n    if (visible) setClosing(false);\r\n  }, [visible]);\r\n\r\n  useEffect(() => {\r\n    if (!visible) return;\r\n    const onKey = (e: globalThis.KeyboardEvent) => {\r\n      if (e.key === \"Escape\") handleClose();\r\n    };\r\n    window.addEventListener(\"keydown\", onKey);\r\n    return () => window.removeEventListener(\"keydown\", onKey);\r\n  }, [visible, handleClose]);\r\n\r\n  if (!visible && !closing) return null;\r\n\r\n  const chipClassName = combineClassNames(\r\n    classMap.chip,\r\n    classMap[theme],\r\n    classMap[state],\r\n    classMap[size],\r\n    classMap[position],\r\n    shadow && classMap[`shadow${capitalize(shadow)}`],\r\n    rounding && classMap[`round${capitalize(rounding)}`],\r\n    closing && classMap.fadeout,\r\n    usePortal && classMap.fixed,\r\n    className\r\n  );\r\n\r\n  const isAssertive = state === \"error\" || state === \"warning\";\r\n\r\n  const portalEl =\r\n    typeof window !== \"undefined\"\r\n      ? document.getElementById(\"widget-portal\")\r\n      : null;\r\n\r\n  const chipElement = (\r\n    <div\r\n      key={id}\r\n      className={chipClassName}\r\n      role=\"alert\"\r\n      aria-live=\"assertive\"\r\n      aria-atomic=\"true\"\r\n      data-testid={testId}\r\n      style={stackIndex != null ? { zIndex: stackIndex } : undefined}\r\n    >\r\n      {Icon && (\r\n        <span\r\n          className={classMap.icon}\r\n          aria-hidden=\"true\"\r\n          data-testid={`${testId}-icon`}\r\n        >\r\n          <Icon className={classMap.inner_icon} />\r\n        </span>\r\n      )}\r\n      <span className={classMap.message} id={`${testId}-message`}>\r\n        {message}\r\n      </span>\r\n\r\n      <IconButtonComponent\r\n        icon={CloseIcon}\r\n        size={size}\r\n        theme=\"clear\"\r\n        ariaLabel=\"Close notification\"\r\n        aria-controls={`${testId}-message`}\r\n        className={classMap.close}\r\n        onClick={handleClose}\r\n        shadow=\"none\"\r\n        data-testid={`${testId}-chip-close`}\r\n      />\r\n    </div>\r\n  );\r\n\r\n  if (usePortal && portalEl) {\r\n    return createPortal(chipElement, portalEl);\r\n  }\r\n\r\n  return chipElement;\r\n};\r\n\r\nChipBase.displayName = \"ChipBase\";\r\nexport default ChipBase;\r\n","import React from \"react\";\r\nimport ChipBase from \"../ChipBase\";\r\nimport { CloseIcon } from \"@/Icons\";\r\nimport \"./Chip.scss\";\r\nimport IconButton from \"../../IconButton/core/IconButton\";\r\nimport { ChipProps } from \"../Chip.types\";\r\n\r\nconst classes = {\r\n  chip: \"chip\",\r\n  icon: \"chip_icon\",\r\n  inner_icon: \"chip_icon_inner\",\r\n  message: \"chip_message\",\r\n  close: \"chip_close\",\r\n  relative: \"chip_relative\",\r\n  fixed: \"chip_fixed\",\r\n  fadeout: \"chip_fadeout\",\r\n\r\n  topCenter: \"chip_top_center\",\r\n  bottomCenter: \"chip_bottom_center\",\r\n  topLeft: \"chip_top_left\",\r\n  topRight: \"chip_top_right\",\r\n  bottomLeft: \"chip_bottom_left\",\r\n  bottomRight: \"chip_bottom_right\",\r\n\r\n  primary: \"chip_primary\",\r\n  secondary: \"chip_secondary\",\r\n  tertiary: \"chip_tertiary\",\r\n  quaternary: \"chip_quaternary\",\r\n\r\n  success: \"chip_success\",\r\n  error: \"chip_error\",\r\n  warning: \"chip_warning\",\r\n\r\n  clear: \"chip_clear\",\r\n\r\n  xs: \"chip_xs\",\r\n  small: \"chip_small\",\r\n  medium: \"chip_medium\",\r\n  large: \"chip_large\",\r\n  xl: \"chip_xl\",\r\n\r\n  shadowNone: \"chip_shadow-None\",\r\n  shadowLight: \"chip_shadow-Light\",\r\n  shadowMedium: \"chip_shadow-Medium\",\r\n  shadowStrong: \"chip_shadow-Strong\",\r\n  shadowIntense: \"chip_shadow-Intense\",\r\n\r\n  roundNone: \"chip_round-None\",\r\n  roundSmall: \"chip_round-Small\",\r\n  roundMedium: \"chip_round-Medium\",\r\n  roundLarge: \"chip_round-Large\",\r\n};\r\n\r\nconst Chip: React.FC<ChipProps> = (props) => (\r\n  <ChipBase\r\n    {...props}\r\n    classMap={classes}\r\n    IconButtonComponent={IconButton}\r\n    closeIcon={CloseIcon}\r\n  />\r\n);\r\n\r\nexport default Chip;\r\n"],"names":["CloseIcon"],"mappings":"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"}

package/dist/core/{Chip-JKvM6DlT.cjs → Chip-C6sk2qAd.cjs}

@@ -6,7 +6,7 @@ const classNames = require("./classNames-BcWMx052.cjs");
 const capitalize = require("./capitalize-DoV-nOmN.cjs");
 const borealStyleConfig = require("./boreal-style-config-Rr5d5Qts.cjs");
 const CloseIcon = require("./CloseIcon-DSnN6ggf.cjs");
-const IconButton = require("./IconButton-BADgP1DD.cjs");
+const IconButton = require("./IconButton-D_W4nsPZ.cjs");
 const ChipBase = ({
   id,
   message,
@@ -26,6 +26,7 @@ const ChipBase = ({
   closeIcon: CloseIcon2,
   IconButtonComponent,
   classMap,
+  stackIndex,
   "data-testid": testId = "chip"
 }) => {
   const [closing, setClosing] = React.useState(false);
@@ -39,6 +40,17 @@ const ChipBase = ({
       return () => clearTimeout(timer);
     }
   }, [autoClose, duration, visible, handleClose]);
+  React.useEffect(() => {
+    if (visible) setClosing(false);
+  }, [visible]);
+  React.useEffect(() => {
+    if (!visible) return;
+    const onKey = (e) => {
+      if (e.key === "Escape") handleClose();
+    };
+    window.addEventListener("keydown", onKey);
+    return () => window.removeEventListener("keydown", onKey);
+  }, [visible, handleClose]);
   if (!visible && !closing) return null;
   const chipClassName = classNames.combineClassNames(
     classMap.chip,
@@ -57,12 +69,21 @@ const ChipBase = ({
     "div",
     {
       className: chipClassName,
-      role: "status",
-      "aria-live": "polite",
+      role: "alert",
+      "aria-live": "assertive",
       "aria-atomic": "true",
       "data-testid": testId,
+      style: stackIndex != null ? { zIndex: stackIndex } : void 0,
       children: [
-        Icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: classMap.icon, "aria-hidden": "true", "data-testid": "icon", children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: classMap.inner_icon }) }),
+        Icon && /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: classMap.icon,
+            "aria-hidden": "true",
+            "data-testid": `${testId}-icon`,
+            children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: classMap.inner_icon })
+          }
+        ),
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: classMap.message, id: `${testId}-message`, children: message }),
         /* @__PURE__ */ jsxRuntime.jsx(
           IconButtonComponent,
@@ -75,15 +96,7 @@ const ChipBase = ({
             className: classMap.close,
             onClick: handleClose,
             shadow: "none",
-            onKeyDown: (e) => {
-              if (e.key === "Enter" || e.key === " ") {
-                e.preventDefault();
-                handleClose();
-              }
-            },
-            role: "button",
-            tabIndex: 0,
-            "data-testid": "chip-close"
+            "data-testid": `${testId}-chip-close`
           }
         )
       ]
@@ -95,6 +108,7 @@ const ChipBase = ({
   }
   return chipElement;
 };
+ChipBase.displayName = "ChipBase";
 const classes = {
   chip: "chip",
   icon: "chip_icon",
@@ -143,4 +157,4 @@ const Chip = (props) => /* @__PURE__ */ jsxRuntime.jsx(
   }
 );
 exports.Chip = Chip;
-//# sourceMappingURL=Chip-JKvM6DlT.cjs.map
+//# sourceMappingURL=Chip-C6sk2qAd.cjs.map

package/dist/core/Chip-C6sk2qAd.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chip-C6sk2qAd.cjs","sources":["../../src/components/Chip/ChipBase.tsx","../../src/components/Chip/core/Chip.tsx"],"sourcesContent":["import { useCallback, useEffect, useState, KeyboardEvent } from \"react\";\r\nimport { createPortal } from \"react-dom\";\r\nimport { ChipBaseProps } from \"./Chip.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultSize,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst ChipBase: React.FC<ChipBaseProps> = ({\r\n  id,\r\n  message,\r\n  visible,\r\n  onClose,\r\n  icon: Icon,\r\n  size = getDefaultSize(),\r\n  theme = getDefaultTheme(),\r\n  rounding = getDefaultRounding(),\r\n  shadow = getDefaultShadow(),\r\n  state = \"\",\r\n  position = \"topCenter\",\r\n  usePortal = true,\r\n  className = \"\",\r\n  autoClose = true,\r\n  duration = 3000,\r\n  closeIcon: CloseIcon,\r\n  IconButtonComponent,\r\n  classMap,\r\n  stackIndex,\r\n  \"data-testid\": testId = \"chip\",\r\n}) => {\r\n  const [closing, setClosing] = useState(false);\r\n\r\n  const handleClose = useCallback(() => {\r\n    setClosing(true);\r\n    setTimeout(() => onClose?.(), 300);\r\n  }, [onClose]);\r\n\r\n  useEffect(() => {\r\n    if (autoClose && visible) {\r\n      const timer = setTimeout(() => handleClose(), duration);\r\n      return () => clearTimeout(timer);\r\n    }\r\n  }, [autoClose, duration, visible, handleClose]);\r\n\r\n  useEffect(() => {\r\n    if (visible) setClosing(false);\r\n  }, [visible]);\r\n\r\n  useEffect(() => {\r\n    if (!visible) return;\r\n    const onKey = (e: globalThis.KeyboardEvent) => {\r\n      if (e.key === \"Escape\") handleClose();\r\n    };\r\n    window.addEventListener(\"keydown\", onKey);\r\n    return () => window.removeEventListener(\"keydown\", onKey);\r\n  }, [visible, handleClose]);\r\n\r\n  if (!visible && !closing) return null;\r\n\r\n  const chipClassName = combineClassNames(\r\n    classMap.chip,\r\n    classMap[theme],\r\n    classMap[state],\r\n    classMap[size],\r\n    classMap[position],\r\n    shadow && classMap[`shadow${capitalize(shadow)}`],\r\n    rounding && classMap[`round${capitalize(rounding)}`],\r\n    closing && classMap.fadeout,\r\n    usePortal && classMap.fixed,\r\n    className\r\n  );\r\n\r\n  const isAssertive = state === \"error\" || state === \"warning\";\r\n\r\n  const portalEl =\r\n    typeof window !== \"undefined\"\r\n      ? document.getElementById(\"widget-portal\")\r\n      : null;\r\n\r\n  const chipElement = (\r\n    <div\r\n      key={id}\r\n      className={chipClassName}\r\n      role=\"alert\"\r\n      aria-live=\"assertive\"\r\n      aria-atomic=\"true\"\r\n      data-testid={testId}\r\n      style={stackIndex != null ? { zIndex: stackIndex } : undefined}\r\n    >\r\n      {Icon && (\r\n        <span\r\n          className={classMap.icon}\r\n          aria-hidden=\"true\"\r\n          data-testid={`${testId}-icon`}\r\n        >\r\n          <Icon className={classMap.inner_icon} />\r\n        </span>\r\n      )}\r\n      <span className={classMap.message} id={`${testId}-message`}>\r\n        {message}\r\n      </span>\r\n\r\n      <IconButtonComponent\r\n        icon={CloseIcon}\r\n        size={size}\r\n        theme=\"clear\"\r\n        ariaLabel=\"Close notification\"\r\n        aria-controls={`${testId}-message`}\r\n        className={classMap.close}\r\n        onClick={handleClose}\r\n        shadow=\"none\"\r\n        data-testid={`${testId}-chip-close`}\r\n      />\r\n    </div>\r\n  );\r\n\r\n  if (usePortal && portalEl) {\r\n    return createPortal(chipElement, portalEl);\r\n  }\r\n\r\n  return chipElement;\r\n};\r\n\r\nChipBase.displayName = \"ChipBase\";\r\nexport default ChipBase;\r\n","import React from \"react\";\r\nimport ChipBase from \"../ChipBase\";\r\nimport { CloseIcon } from \"@/Icons\";\r\nimport \"./Chip.scss\";\r\nimport IconButton from \"../../IconButton/core/IconButton\";\r\nimport { ChipProps } from \"../Chip.types\";\r\n\r\nconst classes = {\r\n  chip: \"chip\",\r\n  icon: \"chip_icon\",\r\n  inner_icon: \"chip_icon_inner\",\r\n  message: \"chip_message\",\r\n  close: \"chip_close\",\r\n  relative: \"chip_relative\",\r\n  fixed: \"chip_fixed\",\r\n  fadeout: \"chip_fadeout\",\r\n\r\n  topCenter: \"chip_top_center\",\r\n  bottomCenter: \"chip_bottom_center\",\r\n  topLeft: \"chip_top_left\",\r\n  topRight: \"chip_top_right\",\r\n  bottomLeft: \"chip_bottom_left\",\r\n  bottomRight: \"chip_bottom_right\",\r\n\r\n  primary: \"chip_primary\",\r\n  secondary: \"chip_secondary\",\r\n  tertiary: \"chip_tertiary\",\r\n  quaternary: \"chip_quaternary\",\r\n\r\n  success: \"chip_success\",\r\n  error: \"chip_error\",\r\n  warning: \"chip_warning\",\r\n\r\n  clear: \"chip_clear\",\r\n\r\n  xs: \"chip_xs\",\r\n  small: \"chip_small\",\r\n  medium: \"chip_medium\",\r\n  large: \"chip_large\",\r\n  xl: \"chip_xl\",\r\n\r\n  shadowNone: \"chip_shadow-None\",\r\n  shadowLight: \"chip_shadow-Light\",\r\n  shadowMedium: \"chip_shadow-Medium\",\r\n  shadowStrong: \"chip_shadow-Strong\",\r\n  shadowIntense: \"chip_shadow-Intense\",\r\n\r\n  roundNone: \"chip_round-None\",\r\n  roundSmall: \"chip_round-Small\",\r\n  roundMedium: \"chip_round-Medium\",\r\n  roundLarge: \"chip_round-Large\",\r\n};\r\n\r\nconst Chip: React.FC<ChipProps> = (props) => (\r\n  <ChipBase\r\n    {...props}\r\n    classMap={classes}\r\n    IconButtonComponent={IconButton}\r\n    closeIcon={CloseIcon}\r\n  />\r\n);\r\n\r\nexport default Chip;\r\n"],"names":["getDefaultSize","getDefaultTheme","getDefaultRounding","getDefaultShadow","CloseIcon","useState","useCallback","useEffect","combineClassNames","capitalize","jsxs","jsx","createPortal","IconButton"],"mappings":"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"}

package/dist/core/Chip.cjs.js

@@ -1,4 +1,4 @@
 "use strict";
-const Chip = require("./Chip-JKvM6DlT.cjs");
+const Chip = require("./Chip-C6sk2qAd.cjs");
 module.exports = Chip.Chip;
 //# sourceMappingURL=Chip.cjs.js.map

package/dist/core/Chip.js

@@ -1,4 +1,4 @@
-import { C } from "./Chip-DjWJJ19V.js";
+import { C } from "./Chip-ByR2AKjl.js";
 export {
   C as default
 };

package/dist/core/{CircularProgress-B-N4px22.cjs → CircularProgress-CNh3NKwl.cjs}

@@ -24,16 +24,15 @@ const CircularProgressBase = ({
   classMap,
   "data-testid": testId = "circular-progress"
 }) => {
+  const range = Math.max(0, max - min);
   const clamped = Math.min(max, Math.max(min, rating));
-  const percent = (clamped - min) / (max - min) * 100;
+  const percent = range === 0 ? 0 : (clamped - min) / range * 100;
   const [displayPercent, setDisplayPercent] = React.useState(0);
-  const [angle, setAngle] = React.useState(0);
   React.useEffect(() => {
-    const newAngle = Math.min(360, percent / 100 * 360);
-    setAngle(newAngle);
     setDisplayPercent(Math.round(percent));
   }, [percent]);
-  const progressColor = getColor(percent);
+  const progressColor = state && classMap[state] ? void 0 : getColor(percent);
+  const angle = Math.min(360, percent / 100 * 360);
   const combinedClassName = React.useMemo(
     () => classNames.combineClassNames(
       classMap.circular_progress,
@@ -43,8 +42,9 @@ const CircularProgressBase = ({
       shadow && classMap[`shadow${capitalize.capitalize(shadow)}`],
       className
     ),
-    [shadow, className, classMap]
+    [classMap, theme, size, state, shadow, className]
   );
+  const valueText = showRaw ? `${clamped}/${max}` : `${displayPercent}%`;
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -53,28 +53,30 @@ const CircularProgressBase = ({
       "aria-valuemin": min,
       "aria-valuemax": max,
       "aria-valuenow": clamped,
+      "aria-valuetext": valueText,
       "aria-label": label,
-      "aria-describedby": `${testId}-desc`,
       "data-testid": testId,
       children: /* @__PURE__ */ jsxRuntime.jsx(
         "div",
         {
-          className: classMap.circle_border,
-          style: {
+          className: classNames.combineClassNames(
+            classMap.circle_border,
+            state && classMap[`state_${state}`]
+          ),
+          style: progressColor ? {
             background: `conic-gradient(
-            ${progressColor} 0deg,
-            ${progressColor} ${angle}deg,
-            transparent ${angle}deg 360deg
-          )`
-          },
+                  ${progressColor} 0deg,
+                  ${progressColor} ${angle}deg,
+                  transparent ${angle}deg 360deg
+                )`
+          } : void 0,
           children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: classMap.inner_circle, children: /* @__PURE__ */ jsxRuntime.jsx(
             "span",
             {
-              id: `${testId}-desc`,
               className: classMap.rating_text,
               "aria-live": "polite",
               "aria-atomic": "true",
-              children: showRaw ? `${clamped}/${max}` : `${displayPercent}%`
+              children: valueText
             }
           ) })
         }
@@ -82,6 +84,7 @@ const CircularProgressBase = ({
     }
   );
 };
+CircularProgressBase.displayName = "CircularProgressBase";
 const classes = {
   circular_progress: "circular_progress",
   circle_border: "circular_progress_circle_border",
@@ -108,4 +111,4 @@ const classes = {
 };
 const CircularProgress = (props) => /* @__PURE__ */ jsxRuntime.jsx(CircularProgressBase, { ...props, classMap: classes });
 exports.CircularProgress = CircularProgress;
-//# sourceMappingURL=CircularProgress-B-N4px22.cjs.map
+//# sourceMappingURL=CircularProgress-CNh3NKwl.cjs.map

package/dist/core/CircularProgress-CNh3NKwl.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CircularProgress-CNh3NKwl.cjs","sources":["../../src/components/CircularProgress/CircularProgressBase.tsx","../../src/components/CircularProgress/core/CircularProgress.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from \"react\";\r\nimport type { CircularProgressBaseProps } from \"./CircularProgress.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultShadow,\r\n  getDefaultSize,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst getColor = (percent: number): string => {\r\n  if (percent <= 0) return \"var(--background-color)\";\r\n  if (percent <= 40) return \"var(--error-color)\";\r\n  if (percent <= 70) return \"var(--warning-color)\";\r\n  return \"var(--success-color)\";\r\n};\r\n\r\nconst CircularProgressBase: React.FC<CircularProgressBaseProps> = ({\r\n  rating,\r\n  min = 0,\r\n  max = 100,\r\n  label = \"Progress\",\r\n  shadow = getDefaultShadow(),\r\n  showRaw = false,\r\n  size = getDefaultSize(),\r\n  theme = getDefaultTheme(),\r\n  state = \"\",\r\n  className = \"\",\r\n  classMap,\r\n  \"data-testid\": testId = \"circular-progress\",\r\n}) => {\r\n  const range = Math.max(0, max - min);\r\n  const clamped = Math.min(max, Math.max(min, rating));\r\n  const percent = range === 0 ? 0 : ((clamped - min) / range) * 100;\r\n\r\n  const [displayPercent, setDisplayPercent] = useState(0);\r\n  useEffect(() => {\r\n    setDisplayPercent(Math.round(percent));\r\n  }, [percent]);\r\n\r\n  const progressColor =\r\n    state && classMap[state] ? undefined : getColor(percent);\r\n\r\n  const angle = Math.min(360, (percent / 100) * 360);\r\n\r\n  const combinedClassName = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.circular_progress,\r\n        classMap[theme],\r\n        classMap[size],\r\n        classMap[state],\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        className\r\n      ),\r\n    [classMap, theme, size, state, shadow, className]\r\n  );\r\n\r\n  const valueText = showRaw ? `${clamped}/${max}` : `${displayPercent}%`;\r\n\r\n  return (\r\n    <div\r\n      className={combinedClassName}\r\n      role=\"progressbar\"\r\n      aria-valuemin={min}\r\n      aria-valuemax={max}\r\n      aria-valuenow={clamped}\r\n      aria-valuetext={valueText}\r\n      aria-label={label}\r\n      data-testid={testId}\r\n    >\r\n      <div\r\n        className={combineClassNames(\r\n          classMap.circle_border,\r\n          state && classMap[`state_${state}`]\r\n        )}\r\n        style={\r\n          progressColor\r\n            ? {\r\n                background: `conic-gradient(\r\n                  ${progressColor} 0deg,\r\n                  ${progressColor} ${angle}deg,\r\n                  transparent ${angle}deg 360deg\r\n                )`,\r\n              }\r\n            : undefined\r\n        }\r\n      >\r\n        <div className={classMap.inner_circle}>\r\n          <span\r\n            className={classMap.rating_text}\r\n            aria-live=\"polite\"\r\n            aria-atomic=\"true\"\r\n          >\r\n            {valueText}\r\n          </span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nCircularProgressBase.displayName = \"CircularProgressBase\";\r\nexport default CircularProgressBase;\r\n","import React from \"react\";\r\nimport CircularProgressBase from \"../CircularProgressBase\";\r\nimport \"./CircularProgress.scss\";\r\nimport { CircularProgressProps } from \"../CircularProgress.types\";\r\n\r\nconst classes = {\r\n  circular_progress: \"circular_progress\",\r\n  circle_border: \"circular_progress_circle_border\",\r\n  inner_circle: \"circular_progress_inner_circle\",\r\n  rating_text: \"circular_progress_rating_text\",\r\n\r\n  primary: \"circular_progress_primary\",\r\n  secondary: \"circular_progress_secondary\",\r\n  tertiary: \"circular_progress_tertiary\",\r\n  quaternary: \"circular_progress_quaternary\",\r\n\r\n  success: \"circular_progress_success\",\r\n  error: \"circular_progress_error\",\r\n  warning: \"circular_progress_warning\",\r\n\r\n  clear: \"circular_progress_clear\",\r\n\r\n  xs: \"circular_progress_xs\",\r\n  small: \"circular_progress_small\",\r\n  medium: \"circular_progress_medium\",\r\n  large: \"circular_progress_large\",\r\n  xl: \"circular_progress_xl\",\r\n\r\n  shadowNone: \"circular_progress_shadow-None\",\r\n  shadowLight: \"circular_progress_shadow-Light\",\r\n  shadowMedium: \"circular_progress_shadow-Medium\",\r\n  shadowStrong: \"circular_progress_shadow-Strong\",\r\n  shadowIntense: \"circular_progress_shadow-Intense\",\r\n};\r\n\r\nconst CircularProgress: React.FC<CircularProgressProps> = (props) => (\r\n  <CircularProgressBase {...props} classMap={classes} />\r\n);\r\n\r\nexport default CircularProgress;\r\n"],"names":["getDefaultShadow","getDefaultSize","getDefaultTheme","useState","useEffect","useMemo","combineClassNames","capitalize","jsx"],"mappings":"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"}

package/dist/core/{CircularProgress-ClCxzsSz.js → CircularProgress-CSkKaHhU.js}

@@ -23,16 +23,15 @@ const CircularProgressBase = ({
   classMap,
   "data-testid": testId = "circular-progress"
 }) => {
+  const range = Math.max(0, max - min);
   const clamped = Math.min(max, Math.max(min, rating));
-  const percent = (clamped - min) / (max - min) * 100;
+  const percent = range === 0 ? 0 : (clamped - min) / range * 100;
   const [displayPercent, setDisplayPercent] = useState(0);
-  const [angle, setAngle] = useState(0);
   useEffect(() => {
-    const newAngle = Math.min(360, percent / 100 * 360);
-    setAngle(newAngle);
     setDisplayPercent(Math.round(percent));
   }, [percent]);
-  const progressColor = getColor(percent);
+  const progressColor = state && classMap[state] ? void 0 : getColor(percent);
+  const angle = Math.min(360, percent / 100 * 360);
   const combinedClassName = useMemo(
     () => combineClassNames(
       classMap.circular_progress,
@@ -42,8 +41,9 @@ const CircularProgressBase = ({
       shadow && classMap[`shadow${capitalize(shadow)}`],
       className
     ),
-    [shadow, className, classMap]
+    [classMap, theme, size, state, shadow, className]
   );
+  const valueText = showRaw ? `${clamped}/${max}` : `${displayPercent}%`;
   return /* @__PURE__ */ jsx(
     "div",
     {
@@ -52,28 +52,30 @@ const CircularProgressBase = ({
       "aria-valuemin": min,
       "aria-valuemax": max,
       "aria-valuenow": clamped,
+      "aria-valuetext": valueText,
       "aria-label": label,
-      "aria-describedby": `${testId}-desc`,
       "data-testid": testId,
       children: /* @__PURE__ */ jsx(
         "div",
         {
-          className: classMap.circle_border,
-          style: {
+          className: combineClassNames(
+            classMap.circle_border,
+            state && classMap[`state_${state}`]
+          ),
+          style: progressColor ? {
             background: `conic-gradient(
-            ${progressColor} 0deg,
-            ${progressColor} ${angle}deg,
-            transparent ${angle}deg 360deg
-          )`
-          },
+                  ${progressColor} 0deg,
+                  ${progressColor} ${angle}deg,
+                  transparent ${angle}deg 360deg
+                )`
+          } : void 0,
           children: /* @__PURE__ */ jsx("div", { className: classMap.inner_circle, children: /* @__PURE__ */ jsx(
             "span",
             {
-              id: `${testId}-desc`,
               className: classMap.rating_text,
               "aria-live": "polite",
               "aria-atomic": "true",
-              children: showRaw ? `${clamped}/${max}` : `${displayPercent}%`
+              children: valueText
             }
           ) })
         }
@@ -81,6 +83,7 @@ const CircularProgressBase = ({
     }
   );
 };
+CircularProgressBase.displayName = "CircularProgressBase";
 const classes = {
   circular_progress: "circular_progress",
   circle_border: "circular_progress_circle_border",
@@ -109,4 +112,4 @@ const CircularProgress = (props) => /* @__PURE__ */ jsx(CircularProgressBase, {
 export {
   CircularProgress as C
 };
-//# sourceMappingURL=CircularProgress-ClCxzsSz.js.map
+//# sourceMappingURL=CircularProgress-CSkKaHhU.js.map

package/dist/core/CircularProgress-CSkKaHhU.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CircularProgress-CSkKaHhU.js","sources":["../../src/components/CircularProgress/CircularProgressBase.tsx","../../src/components/CircularProgress/core/CircularProgress.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from \"react\";\r\nimport type { CircularProgressBaseProps } from \"./CircularProgress.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultShadow,\r\n  getDefaultSize,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst getColor = (percent: number): string => {\r\n  if (percent <= 0) return \"var(--background-color)\";\r\n  if (percent <= 40) return \"var(--error-color)\";\r\n  if (percent <= 70) return \"var(--warning-color)\";\r\n  return \"var(--success-color)\";\r\n};\r\n\r\nconst CircularProgressBase: React.FC<CircularProgressBaseProps> = ({\r\n  rating,\r\n  min = 0,\r\n  max = 100,\r\n  label = \"Progress\",\r\n  shadow = getDefaultShadow(),\r\n  showRaw = false,\r\n  size = getDefaultSize(),\r\n  theme = getDefaultTheme(),\r\n  state = \"\",\r\n  className = \"\",\r\n  classMap,\r\n  \"data-testid\": testId = \"circular-progress\",\r\n}) => {\r\n  const range = Math.max(0, max - min);\r\n  const clamped = Math.min(max, Math.max(min, rating));\r\n  const percent = range === 0 ? 0 : ((clamped - min) / range) * 100;\r\n\r\n  const [displayPercent, setDisplayPercent] = useState(0);\r\n  useEffect(() => {\r\n    setDisplayPercent(Math.round(percent));\r\n  }, [percent]);\r\n\r\n  const progressColor =\r\n    state && classMap[state] ? undefined : getColor(percent);\r\n\r\n  const angle = Math.min(360, (percent / 100) * 360);\r\n\r\n  const combinedClassName = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.circular_progress,\r\n        classMap[theme],\r\n        classMap[size],\r\n        classMap[state],\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        className\r\n      ),\r\n    [classMap, theme, size, state, shadow, className]\r\n  );\r\n\r\n  const valueText = showRaw ? `${clamped}/${max}` : `${displayPercent}%`;\r\n\r\n  return (\r\n    <div\r\n      className={combinedClassName}\r\n      role=\"progressbar\"\r\n      aria-valuemin={min}\r\n      aria-valuemax={max}\r\n      aria-valuenow={clamped}\r\n      aria-valuetext={valueText}\r\n      aria-label={label}\r\n      data-testid={testId}\r\n    >\r\n      <div\r\n        className={combineClassNames(\r\n          classMap.circle_border,\r\n          state && classMap[`state_${state}`]\r\n        )}\r\n        style={\r\n          progressColor\r\n            ? {\r\n                background: `conic-gradient(\r\n                  ${progressColor} 0deg,\r\n                  ${progressColor} ${angle}deg,\r\n                  transparent ${angle}deg 360deg\r\n                )`,\r\n              }\r\n            : undefined\r\n        }\r\n      >\r\n        <div className={classMap.inner_circle}>\r\n          <span\r\n            className={classMap.rating_text}\r\n            aria-live=\"polite\"\r\n            aria-atomic=\"true\"\r\n          >\r\n            {valueText}\r\n          </span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nCircularProgressBase.displayName = \"CircularProgressBase\";\r\nexport default CircularProgressBase;\r\n","import React from \"react\";\r\nimport CircularProgressBase from \"../CircularProgressBase\";\r\nimport \"./CircularProgress.scss\";\r\nimport { CircularProgressProps } from \"../CircularProgress.types\";\r\n\r\nconst classes = {\r\n  circular_progress: \"circular_progress\",\r\n  circle_border: \"circular_progress_circle_border\",\r\n  inner_circle: \"circular_progress_inner_circle\",\r\n  rating_text: \"circular_progress_rating_text\",\r\n\r\n  primary: \"circular_progress_primary\",\r\n  secondary: \"circular_progress_secondary\",\r\n  tertiary: \"circular_progress_tertiary\",\r\n  quaternary: \"circular_progress_quaternary\",\r\n\r\n  success: \"circular_progress_success\",\r\n  error: \"circular_progress_error\",\r\n  warning: \"circular_progress_warning\",\r\n\r\n  clear: \"circular_progress_clear\",\r\n\r\n  xs: \"circular_progress_xs\",\r\n  small: \"circular_progress_small\",\r\n  medium: \"circular_progress_medium\",\r\n  large: \"circular_progress_large\",\r\n  xl: \"circular_progress_xl\",\r\n\r\n  shadowNone: \"circular_progress_shadow-None\",\r\n  shadowLight: \"circular_progress_shadow-Light\",\r\n  shadowMedium: \"circular_progress_shadow-Medium\",\r\n  shadowStrong: \"circular_progress_shadow-Strong\",\r\n  shadowIntense: \"circular_progress_shadow-Intense\",\r\n};\r\n\r\nconst CircularProgress: React.FC<CircularProgressProps> = (props) => (\r\n  <CircularProgressBase {...props} classMap={classes} />\r\n);\r\n\r\nexport default CircularProgress;\r\n"],"names":[],"mappings":";;;;;AAUA,MAAM,WAAW,CAAC,YAA4B;AAC5C,MAAI,WAAW,EAAG,QAAO;AACzB,MAAI,WAAW,GAAI,QAAO;AAC1B,MAAI,WAAW,GAAI,QAAO;AAC1B,SAAO;AACT;AAEA,MAAM,uBAA4D,CAAC;AAAA,EACjE;AAAA,EACA,MAAM;AAAA,EACN,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,SAAS,iBAAA;AAAA,EACT,UAAU;AAAA,EACV,OAAO,eAAA;AAAA,EACP,QAAQ,gBAAA;AAAA,EACR,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ;AAAA,EACA,eAAe,SAAS;AAC1B,MAAM;AACJ,QAAM,QAAQ,KAAK,IAAI,GAAG,MAAM,GAAG;AACnC,QAAM,UAAU,KAAK,IAAI,KAAK,KAAK,IAAI,KAAK,MAAM,CAAC;AACnD,QAAM,UAAU,UAAU,IAAI,KAAM,UAAU,OAAO,QAAS;AAE9D,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,SAAS,CAAC;AACtD,YAAU,MAAM;AACd,sBAAkB,KAAK,MAAM,OAAO,CAAC;AAAA,EACvC,GAAG,CAAC,OAAO,CAAC;AAEZ,QAAM,gBACJ,SAAS,SAAS,KAAK,IAAI,SAAY,SAAS,OAAO;AAEzD,QAAM,QAAQ,KAAK,IAAI,KAAM,UAAU,MAAO,GAAG;AAEjD,QAAM,oBAAoB;AAAA,IACxB,MACE;AAAA,MACE,SAAS;AAAA,MACT,SAAS,KAAK;AAAA,MACd,SAAS,IAAI;AAAA,MACb,SAAS,KAAK;AAAA,MACd,UAAU,SAAS,SAAS,WAAW,MAAM,CAAC,EAAE;AAAA,MAChD;AAAA,IAAA;AAAA,IAEJ,CAAC,UAAU,OAAO,MAAM,OAAO,QAAQ,SAAS;AAAA,EAAA;AAGlD,QAAM,YAAY,UAAU,GAAG,OAAO,IAAI,GAAG,KAAK,GAAG,cAAc;AAEnE,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,MACX,MAAK;AAAA,MACL,iBAAe;AAAA,MACf,iBAAe;AAAA,MACf,iBAAe;AAAA,MACf,kBAAgB;AAAA,MAChB,cAAY;AAAA,MACZ,eAAa;AAAA,MAEb,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW;AAAA,YACT,SAAS;AAAA,YACT,SAAS,SAAS,SAAS,KAAK,EAAE;AAAA,UAAA;AAAA,UAEpC,OACE,gBACI;AAAA,YACE,YAAY;AAAA,oBACR,aAAa;AAAA,oBACb,aAAa,IAAI,KAAK;AAAA,gCACV,KAAK;AAAA;AAAA,UAAA,IAGvB;AAAA,UAGN,UAAA,oBAAC,OAAA,EAAI,WAAW,SAAS,cACvB,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW,SAAS;AAAA,cACpB,aAAU;AAAA,cACV,eAAY;AAAA,cAEX,UAAA;AAAA,YAAA;AAAA,UAAA,EACH,CACF;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAGN;AAEA,qBAAqB,cAAc;ACjGnC,MAAM,UAAU;AAAA,EACd,mBAAmB;AAAA,EACnB,eAAe;AAAA,EACf,cAAc;AAAA,EACd,aAAa;AAAA,EAEb,SAAS;AAAA,EACT,WAAW;AAAA,EACX,UAAU;AAAA,EACV,YAAY;AAAA,EAEZ,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AAAA,EAET,OAAO;AAAA,EAEP,IAAI;AAAA,EACJ,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,IAAI;AAAA,EAEJ,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,cAAc;AAAA,EACd,cAAc;AAAA,EACd,eAAe;AACjB;AAEA,MAAM,mBAAoD,CAAC,UACzD,oBAAC,wBAAsB,GAAG,OAAO,UAAU,QAAA,CAAS;"}

package/dist/core/CircularProgress.cjs.js

@@ -1,4 +1,4 @@
 "use strict";
-const CircularProgress = require("./CircularProgress-B-N4px22.cjs");
+const CircularProgress = require("./CircularProgress-CNh3NKwl.cjs");
 module.exports = CircularProgress.CircularProgress;
 //# sourceMappingURL=CircularProgress.cjs.js.map

package/dist/core/CircularProgress.js

@@ -1,4 +1,4 @@
-import { C } from "./CircularProgress-ClCxzsSz.js";
+import { C } from "./CircularProgress-CSkKaHhU.js";
 export {
   C as default
 };

package/dist/core/{ColorPicker-BQiTjeqQ.js → ColorPicker-Btkkzx1b.js}

@@ -28,50 +28,51 @@ const ColorPickerBase = ({
     {
       className: combineClassNames(classMap.color_picker, className),
       disabled,
-      "aria-disabled": disabled,
-      "aria-labelledby": legendId,
-      role: "radiogroup",
       "data-testid": testId,
       children: [
         /* @__PURE__ */ jsx("legend", { id: legendId, className: classMap.legend, children: label }),
-        /* @__PURE__ */ jsx("div", { className: classMap.color_picker_grid, children: colors.map((color, i) => /* @__PURE__ */ jsxs(
-          "label",
-          {
-            className: combineClassNames(labelClass),
-            htmlFor: `${testId}-color-${i}`,
-            title: color.label,
-            "data-testid": `${testId}-option-${color.value}`,
-            children: [
-              /* @__PURE__ */ jsx(
-                "input",
-                {
-                  type: "radio",
-                  name,
-                  id: `${testId}-color-${i}`,
-                  value: color.value,
-                  checked: selected === color.value,
-                  onChange: () => onChange(color.value),
-                  className: classMap.radio_input
-                }
-              ),
-              /* @__PURE__ */ jsx("span", { className: "sr_only", children: color.label }),
-              /* @__PURE__ */ jsx(
-                "span",
-                {
-                  className: combineClassNames(
-                    classMap.preview,
-                    classMap[shape],
-                    selected === color.value && classMap.selected,
-                    shadow && classMap[`shadow${capitalize(shadow)}`]
-                  ),
-                  style: { backgroundColor: color.value },
-                  "aria-hidden": "true"
-                }
-              )
-            ]
-          },
-          color.value
-        )) }),
+        /* @__PURE__ */ jsx("div", { className: classMap.color_picker_grid, children: colors.map((color, i) => {
+          const id = `${testId}-color-${i}`;
+          const isSelected = selected === color.value;
+          return /* @__PURE__ */ jsxs(
+            "label",
+            {
+              className: labelClass,
+              htmlFor: id,
+              title: color.label,
+              "data-testid": `${testId}-option-${color.value}`,
+              children: [
+                /* @__PURE__ */ jsx(
+                  "input",
+                  {
+                    type: "radio",
+                    name,
+                    id,
+                    value: color.value,
+                    checked: isSelected,
+                    onChange: () => onChange(color.value),
+                    className: classMap.radio_input
+                  }
+                ),
+                /* @__PURE__ */ jsx("span", { className: "sr_only", children: color.label }),
+                /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: combineClassNames(
+                      classMap.preview,
+                      classMap[shape],
+                      isSelected && classMap.selected,
+                      shadow && classMap[`shadow${capitalize(shadow)}`]
+                    ),
+                    style: { backgroundColor: color.value },
+                    "aria-hidden": "true"
+                  }
+                )
+              ]
+            },
+            `${color.value}-${i}`
+          );
+        }) }),
         allowCustom && /* @__PURE__ */ jsx(
           "input",
           {
@@ -87,6 +88,7 @@ const ColorPickerBase = ({
     }
   );
 };
+ColorPickerBase.displayName = "ColorPickerBase";
 const classes = {
   color_picker: "color_picker",
   legend: "color_picker_legend",
@@ -114,4 +116,4 @@ const ColorPicker = (props) => /* @__PURE__ */ jsx(ColorPickerBase, { ...props,
 export {
   ColorPicker as C
 };
-//# sourceMappingURL=ColorPicker-BQiTjeqQ.js.map
+//# sourceMappingURL=ColorPicker-Btkkzx1b.js.map

package/dist/core/ColorPicker-Btkkzx1b.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPicker-Btkkzx1b.js","sources":["../../src/components/ColorPicker/ColorPickerBase.tsx","../../src/components/ColorPicker/core/ColorPicker.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport type { ColorPickerBaseProps } from \"./ColorPicker.types\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultShadow,\r\n  getDefaultSize,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst ColorPickerBase: React.FC<ColorPickerBaseProps> = ({\r\n  label = \"Choose a color\",\r\n  colors,\r\n  selected,\r\n  onChange,\r\n  name = \"color-picker\",\r\n  disabled = false,\r\n  size = getDefaultSize(),\r\n  shadow = getDefaultShadow(),\r\n  shape = \"round\",\r\n  allowCustom = false,\r\n  className = \"\",\r\n  classMap,\r\n  \"data-testid\": testId = \"color-picker\",\r\n}) => {\r\n  const legendId = `${testId}-legend`;\r\n\r\n  const labelClass = useMemo(\r\n    () => combineClassNames(classMap.swatch, classMap[size], classMap[shape]),\r\n    [classMap, size, shape]\r\n  );\r\n\r\n  return (\r\n    <fieldset\r\n      className={combineClassNames(classMap.color_picker, className)}\r\n      disabled={disabled}\r\n      data-testid={testId}\r\n    >\r\n      <legend id={legendId} className={classMap.legend}>\r\n        {label}\r\n      </legend>\r\n\r\n      <div className={classMap.color_picker_grid}>\r\n        {colors.map((color, i) => {\r\n          const id = `${testId}-color-${i}`;\r\n          const isSelected = selected === color.value;\r\n          return (\r\n            <label\r\n              key={`${color.value}-${i}`}\r\n              className={labelClass}\r\n              htmlFor={id}\r\n              title={color.label}\r\n              data-testid={`${testId}-option-${color.value}`}\r\n            >\r\n              <input\r\n                type=\"radio\"\r\n                name={name}\r\n                id={id}\r\n                value={color.value}\r\n                checked={isSelected}\r\n                onChange={() => onChange(color.value)}\r\n                className={classMap.radio_input}\r\n              />\r\n              <span className=\"sr_only\">{color.label}</span>\r\n              <span\r\n                className={combineClassNames(\r\n                  classMap.preview,\r\n                  classMap[shape],\r\n                  isSelected && classMap.selected,\r\n                  shadow && classMap[`shadow${capitalize(shadow)}`]\r\n                )}\r\n                style={{ backgroundColor: color.value }}\r\n                aria-hidden=\"true\"\r\n              />\r\n            </label>\r\n          );\r\n        })}\r\n      </div>\r\n\r\n      {allowCustom && (\r\n        <input\r\n          type=\"color\"\r\n          className={classMap.custom_input}\r\n          value={selected}\r\n          onChange={(e) => onChange(e.target.value)}\r\n          aria-label=\"Custom color picker\"\r\n          data-testid={`${testId}-custom-input`}\r\n        />\r\n      )}\r\n    </fieldset>\r\n  );\r\n};\r\nColorPickerBase.displayName = \"ColorPickerBase\";\r\nexport default ColorPickerBase;\r\n","import React from \"react\";\r\nimport ColorPickerBase from \"../ColorPickerBase\";\r\nimport \"./ColorPicker.scss\";\r\nimport { ColorPickerProps } from \"../ColorPicker.types\";\r\n\r\nconst classes = {\r\n  color_picker: \"color_picker\",\r\n  legend: \"color_picker_legend\",\r\n  grid: \"color_picker_grid\",\r\n  swatch: \"color_picker_swatch\",\r\n  preview: \"color_picker_preview\",\r\n  radio_input: \"color_picker_radio_input\",\r\n  custom_input: \"color_picker_custom_input\",\r\n  selected: \"color_picker_selected\",\r\n\r\n  xs: \"color_picker_xs\",\r\n  small: \"color_picker_small\",\r\n  medium: \"color_picker_medium\",\r\n  large: \"color_picker_large\",\r\n  xl: \"color_picker_xl\",\r\n\r\n  shadowNone: \"color_picker_shadow-None\",\r\n  shadowLight: \"color_picker_shadow-Light\",\r\n  shadowMedium: \"color_picker_shadow-Medium\",\r\n  shadowStrong: \"color_picker_shadow-Strong\",\r\n  shadowIntense: \"color_picker_shadow-Intense\",\r\n\r\n  pill: \"color_picker_pill\",\r\n  round: \"color_picker_round\",\r\n  square: \"color_picker_square\",\r\n};\r\n\r\nconst ColorPicker: React.FC<ColorPickerProps> = (props) => (\r\n  <ColorPickerBase {...props} classMap={classes} />\r\n);\r\n\r\nexport default ColorPicker;\r\n"],"names":[],"mappings":"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"}