boreal-ui 0.0.34 → 0.0.36

package/dist/next/{CircularProgress-B0pzDdsh.cjs → CircularProgress-C7kuOtnG.cjs}

@@ -85,35 +85,35 @@ const CircularProgressBase = ({
   );
 };
 CircularProgressBase.displayName = "CircularProgressBase";
-const noScroll = "_noScroll_1mgep_91";
-const errorMessage = "_errorMessage_1mgep_92";
-const loadingContainer = "_loadingContainer_1mgep_93";
-const hideScrollbar = "_hideScrollbar_1mgep_85";
-const sr_only = "_sr_only_1mgep_94";
-const circular_progress = "_circular_progress_1mgep_540";
-const shadowNone = "_shadowNone_1mgep_545";
-const circle_border = "_circle_border_1mgep_545";
-const shadowLight = "_shadowLight_1mgep_548";
-const shadowMedium = "_shadowMedium_1mgep_551";
-const shadowStrong = "_shadowStrong_1mgep_554";
-const shadowIntense = "_shadowIntense_1mgep_557";
-const xs = "_xs_1mgep_560";
-const rating_text = "_rating_text_1mgep_564";
-const small = "_small_1mgep_569";
-const medium = "_medium_1mgep_578";
-const large = "_large_1mgep_587";
-const xl = "_xl_1mgep_596";
-const inner_circle = "_inner_circle_1mgep_614";
-const primary = "_primary_1mgep_624";
-const secondary = "_secondary_1mgep_627";
-const tertiary = "_tertiary_1mgep_630";
-const quaternary = "_quaternary_1mgep_633";
-const clear = "_clear_1mgep_636";
-const success = "_success_1mgep_639";
-const error = "_error_1mgep_92";
-const warning = "_warning_1mgep_645";
-const spin = "_spin_1mgep_1";
-const pulse = "_pulse_1mgep_1";
+const noScroll = "_noScroll_5h4i7_108";
+const errorMessage = "_errorMessage_5h4i7_109";
+const loadingContainer = "_loadingContainer_5h4i7_110";
+const hideScrollbar = "_hideScrollbar_5h4i7_102";
+const sr_only = "_sr_only_5h4i7_111";
+const circular_progress = "_circular_progress_5h4i7_540";
+const circle_border = "_circle_border_5h4i7_545";
+const inner_circle = "_inner_circle_5h4i7_558";
+const primary = "_primary_5h4i7_580";
+const secondary = "_secondary_5h4i7_583";
+const tertiary = "_tertiary_5h4i7_586";
+const quaternary = "_quaternary_5h4i7_589";
+const clear = "_clear_5h4i7_592";
+const success = "_success_5h4i7_595";
+const error = "_error_5h4i7_109";
+const warning = "_warning_5h4i7_601";
+const shadowNone = "_shadowNone_5h4i7_605";
+const shadowLight = "_shadowLight_5h4i7_609";
+const shadowMedium = "_shadowMedium_5h4i7_613";
+const shadowStrong = "_shadowStrong_5h4i7_617";
+const shadowIntense = "_shadowIntense_5h4i7_621";
+const xs = "_xs_5h4i7_625";
+const rating_text = "_rating_text_5h4i7_641";
+const small = "_small_5h4i7_660";
+const medium = "_medium_5h4i7_695";
+const large = "_large_5h4i7_730";
+const xl = "_xl_5h4i7_765";
+const spin = "_spin_5h4i7_1";
+const pulse = "_pulse_5h4i7_1";
 const styles = {
   noScroll,
   errorMessage,
@@ -121,8 +121,17 @@ const styles = {
   hideScrollbar,
   sr_only,
   circular_progress,
-  shadowNone,
   circle_border,
+  inner_circle,
+  primary,
+  secondary,
+  tertiary,
+  quaternary,
+  clear,
+  success,
+  error,
+  warning,
+  shadowNone,
   shadowLight,
   shadowMedium,
   shadowStrong,
@@ -133,25 +142,16 @@ const styles = {
   medium,
   large,
   xl,
-  inner_circle,
-  primary,
-  secondary,
-  tertiary,
-  quaternary,
-  clear,
-  success,
-  error,
-  warning,
-  "fade-in": "_fade-in_1mgep_1",
-  "slide-up": "_slide-up_1mgep_1",
-  "spin-3d": "_spin-3d_1mgep_1",
+  "fade-in": "_fade-in_5h4i7_1",
+  "slide-up": "_slide-up_5h4i7_1",
+  "spin-3d": "_spin-3d_5h4i7_1",
   spin,
   pulse,
-  "fade-in-up": "_fade-in-up_1mgep_1",
-  "progress-grow": "_progress-grow_1mgep_1",
-  "indeterminate-move": "_indeterminate-move_1mgep_1",
-  "skeleton-loading": "_skeleton-loading_1mgep_1"
+  "fade-in-up": "_fade-in-up_5h4i7_1",
+  "progress-grow": "_progress-grow_5h4i7_1",
+  "indeterminate-move": "_indeterminate-move_5h4i7_1",
+  "skeleton-loading": "_skeleton-loading_5h4i7_1"
 };
 const CircularProgress = (props) => /* @__PURE__ */ require$$2.jsx(CircularProgressBase, { ...props, classMap: styles });
 exports.CircularProgress = CircularProgress;
-//# sourceMappingURL=CircularProgress-B0pzDdsh.cjs.map
+//# sourceMappingURL=CircularProgress-C7kuOtnG.cjs.map

package/dist/next/{CircularProgress-B0pzDdsh.cjs.map → CircularProgress-C7kuOtnG.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"CircularProgress-B0pzDdsh.cjs","sources":["../../src/components/CircularProgress/CircularProgressBase.tsx","../../src/components/CircularProgress/next/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","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport CircularProgressBase from \"../CircularProgressBase\";\r\nimport styles from \"./CircularProgress.module.scss\";\r\nimport { CircularProgressProps } from \"../CircularProgress.types\";\r\n\r\nconst CircularProgress: React.FC<CircularProgressProps> = (props) => (\r\n  <CircularProgressBase {...props} classMap={styles} />\r\n);\r\n\r\nexport default CircularProgress;\r\n"],"names":["getDefaultShadow","getDefaultSize","getDefaultTheme","useState","useEffect","useMemo","combineClassNames","capitalize","jsx"],"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,SAASA,kBAAAA,iBAAA;AAAA,EACT,UAAU;AAAA,EACV,OAAOC,kBAAAA,eAAA;AAAA,EACP,QAAQC,kBAAAA,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,IAAIC,MAAAA,SAAS,CAAC;AACtDC,QAAAA,UAAU,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,oBAAoBC,MAAAA;AAAAA,IACxB,MACEC,WAAAA;AAAAA,MACE,SAAS;AAAA,MACT,SAAS,KAAK;AAAA,MACd,SAAS,IAAI;AAAA,MACb,SAAS,KAAK;AAAA,MACd,UAAU,SAAS,SAASC,WAAAA,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,SACEC,2BAAAA;AAAAA,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,UAAAA,2BAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWF,WAAAA;AAAAA,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,UAAAE,2BAAAA,IAAC,OAAA,EAAI,WAAW,SAAS,cACvB,UAAAA,2BAAAA;AAAAA,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/FnC,MAAM,mBAAoD,CAAC,UACzDA,+BAAC,wBAAsB,GAAG,OAAO,UAAU,OAAA,CAAQ;;"}
+{"version":3,"file":"CircularProgress-C7kuOtnG.cjs","sources":["../../src/components/CircularProgress/CircularProgressBase.tsx","../../src/components/CircularProgress/next/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","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport CircularProgressBase from \"../CircularProgressBase\";\r\nimport styles from \"./CircularProgress.module.scss\";\r\nimport { CircularProgressProps } from \"../CircularProgress.types\";\r\n\r\nconst CircularProgress: React.FC<CircularProgressProps> = (props) => (\r\n  <CircularProgressBase {...props} classMap={styles} />\r\n);\r\n\r\nexport default CircularProgress;\r\n"],"names":["getDefaultShadow","getDefaultSize","getDefaultTheme","useState","useEffect","useMemo","combineClassNames","capitalize","jsx"],"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,SAASA,kBAAAA,iBAAA;AAAA,EACT,UAAU;AAAA,EACV,OAAOC,kBAAAA,eAAA;AAAA,EACP,QAAQC,kBAAAA,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,IAAIC,MAAAA,SAAS,CAAC;AACtDC,QAAAA,UAAU,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,oBAAoBC,MAAAA;AAAAA,IACxB,MACEC,WAAAA;AAAAA,MACE,SAAS;AAAA,MACT,SAAS,KAAK;AAAA,MACd,SAAS,IAAI;AAAA,MACb,SAAS,KAAK;AAAA,MACd,UAAU,SAAS,SAASC,WAAAA,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,SACEC,2BAAAA;AAAAA,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,UAAAA,2BAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWF,WAAAA;AAAAA,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,UAAAE,2BAAAA,IAAC,OAAA,EAAI,WAAW,SAAS,cACvB,UAAAA,2BAAAA;AAAAA,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/FnC,MAAM,mBAAoD,CAAC,UACzDA,+BAAC,wBAAsB,GAAG,OAAO,UAAU,OAAA,CAAQ;;"}

package/dist/next/CircularProgress.cjs.js

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

package/dist/next/CircularProgress.js

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

package/dist/next/{ColorPicker-CDHrECBi.cjs → ColorPicker-C3dyO_vv.cjs}

@@ -90,35 +90,36 @@ const ColorPickerBase = ({
   );
 };
 ColorPickerBase.displayName = "ColorPickerBase";
-const noScroll = "_noScroll_z0z9a_91";
-const errorMessage = "_errorMessage_z0z9a_92";
-const loadingContainer = "_loadingContainer_z0z9a_93";
-const hideScrollbar = "_hideScrollbar_z0z9a_85";
-const sr_only = "_sr_only_z0z9a_94";
-const color_picker = "_color_picker_z0z9a_540";
-const legend = "_legend_z0z9a_553";
-const grid = "_grid_z0z9a_559";
-const selected = "_selected_z0z9a_565";
-const swatch = "_swatch_z0z9a_571";
-const xs = "_xs_z0z9a_581";
-const small = "_small_z0z9a_585";
-const medium = "_medium_z0z9a_589";
-const large = "_large_z0z9a_593";
-const xl = "_xl_z0z9a_597";
-const circle = "_circle_z0z9a_602";
-const square = "_square_z0z9a_606";
-const round = "_round_z0z9a_610";
-const radio_input = "_radio_input_z0z9a_614";
-const preview = "_preview_z0z9a_618";
-const custom_input = "_custom_input_z0z9a_626";
-const rounded = "_rounded_z0z9a_639";
-const shadowNone = "_shadowNone_z0z9a_644";
-const shadowLight = "_shadowLight_z0z9a_648";
-const shadowMedium = "_shadowMedium_z0z9a_652";
-const shadowStrong = "_shadowStrong_z0z9a_656";
-const shadowIntense = "_shadowIntense_z0z9a_660";
-const spin = "_spin_z0z9a_1";
-const pulse = "_pulse_z0z9a_1";
+const noScroll = "_noScroll_1v6qg_108";
+const errorMessage = "_errorMessage_1v6qg_109";
+const loadingContainer = "_loadingContainer_1v6qg_110";
+const hideScrollbar = "_hideScrollbar_1v6qg_102";
+const sr_only = "_sr_only_1v6qg_111";
+const color_picker = "_color_picker_1v6qg_540";
+const legend = "_legend_1v6qg_565";
+const grid = "_grid_1v6qg_581";
+const selected = "_selected_1v6qg_597";
+const swatch = "_swatch_1v6qg_603";
+const round = "_round_1v6qg_620";
+const square = "_square_1v6qg_623";
+const pill = "_pill_1v6qg_626";
+const xs = "_xs_1v6qg_630";
+const small = "_small_1v6qg_646";
+const medium = "_medium_1v6qg_662";
+const large = "_large_1v6qg_678";
+const xl = "_xl_1v6qg_694";
+const radio_input = "_radio_input_1v6qg_711";
+const preview = "_preview_1v6qg_715";
+const custom_input = "_custom_input_1v6qg_723";
+const circle = "_circle_1v6qg_738";
+const rounded = "_rounded_1v6qg_746";
+const shadowNone = "_shadowNone_1v6qg_750";
+const shadowLight = "_shadowLight_1v6qg_754";
+const shadowMedium = "_shadowMedium_1v6qg_758";
+const shadowStrong = "_shadowStrong_1v6qg_762";
+const shadowIntense = "_shadowIntense_1v6qg_766";
+const spin = "_spin_1v6qg_1";
+const pulse = "_pulse_1v6qg_1";
 const styles = {
   noScroll,
   errorMessage,
@@ -130,33 +131,34 @@ const styles = {
   grid,
   selected,
   swatch,
+  round,
+  square,
+  pill,
   xs,
   small,
   medium,
   large,
   xl,
-  circle,
-  square,
-  round,
   radio_input,
   preview,
   custom_input,
+  circle,
   rounded,
   shadowNone,
   shadowLight,
   shadowMedium,
   shadowStrong,
   shadowIntense,
-  "fade-in": "_fade-in_z0z9a_1",
-  "slide-up": "_slide-up_z0z9a_1",
-  "spin-3d": "_spin-3d_z0z9a_1",
+  "fade-in": "_fade-in_1v6qg_1",
+  "slide-up": "_slide-up_1v6qg_1",
+  "spin-3d": "_spin-3d_1v6qg_1",
   spin,
   pulse,
-  "fade-in-up": "_fade-in-up_z0z9a_1",
-  "progress-grow": "_progress-grow_z0z9a_1",
-  "indeterminate-move": "_indeterminate-move_z0z9a_1",
-  "skeleton-loading": "_skeleton-loading_z0z9a_1"
+  "fade-in-up": "_fade-in-up_1v6qg_1",
+  "progress-grow": "_progress-grow_1v6qg_1",
+  "indeterminate-move": "_indeterminate-move_1v6qg_1",
+  "skeleton-loading": "_skeleton-loading_1v6qg_1"
 };
 const ColorPicker = (props) => /* @__PURE__ */ require$$2.jsx(ColorPickerBase, { ...props, classMap: styles });
 exports.ColorPicker = ColorPicker;
-//# sourceMappingURL=ColorPicker-CDHrECBi.cjs.map
+//# sourceMappingURL=ColorPicker-C3dyO_vv.cjs.map

package/dist/next/{ColorPicker-CDHrECBi.cjs.map → ColorPicker-C3dyO_vv.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"ColorPicker-CDHrECBi.cjs","sources":["../../src/components/ColorPicker/ColorPickerBase.tsx","../../src/components/ColorPicker/next/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","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport ColorPickerBase from \"../ColorPickerBase\";\r\nimport styles from \"./ColorPicker.module.scss\";\r\nimport { ColorPickerProps } from \"../ColorPicker.types\";\r\n\r\nconst ColorPicker: React.FC<ColorPickerProps> = (props) => (\r\n  <ColorPickerBase {...props} classMap={styles} />\r\n);\r\n\r\nexport default ColorPicker;\r\n"],"names":["selected","getDefaultSize","getDefaultShadow","useMemo","combineClassNames","jsxs","jsx","capitalize"],"mappings":";;;;;;AASA,MAAM,kBAAkD,CAAC;AAAA,EACvD,QAAQ;AAAA,EACR;AAAA,EACA,UAAAA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,WAAW;AAAA,EACX,OAAOC,kBAAAA,eAAA;AAAA,EACP,SAASC,kBAAAA,iBAAA;AAAA,EACT,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,YAAY;AAAA,EACZ;AAAA,EACA,eAAe,SAAS;AAC1B,MAAM;AACJ,QAAM,WAAW,GAAG,MAAM;AAE1B,QAAM,aAAaC,MAAAA;AAAAA,IACjB,MAAMC,WAAAA,kBAAkB,SAAS,QAAQ,SAAS,IAAI,GAAG,SAAS,KAAK,CAAC;AAAA,IACxE,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAGxB,SACEC,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWD,WAAAA,kBAAkB,SAAS,cAAc,SAAS;AAAA,MAC7D;AAAA,MACA,eAAa;AAAA,MAEb,UAAA;AAAA,QAAAE,+BAAC,YAAO,IAAI,UAAU,WAAW,SAAS,QACvC,UAAA,OACH;AAAA,QAEAA,2BAAAA,IAAC,SAAI,WAAW,SAAS,mBACtB,UAAA,OAAO,IAAI,CAAC,OAAO,MAAM;AACxB,gBAAM,KAAK,GAAG,MAAM,UAAU,CAAC;AAC/B,gBAAM,aAAaN,cAAa,MAAM;AACtC,iBACEK,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cAEC,WAAW;AAAA,cACX,SAAS;AAAA,cACT,OAAO,MAAM;AAAA,cACb,eAAa,GAAG,MAAM,WAAW,MAAM,KAAK;AAAA,cAE5C,UAAA;AAAA,gBAAAC,2BAAAA;AAAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,MAAK;AAAA,oBACL;AAAA,oBACA;AAAA,oBACA,OAAO,MAAM;AAAA,oBACb,SAAS;AAAA,oBACT,UAAU,MAAM,SAAS,MAAM,KAAK;AAAA,oBACpC,WAAW,SAAS;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAEtBA,2BAAAA,IAAC,QAAA,EAAK,WAAU,WAAW,gBAAM,OAAM;AAAA,gBACvCA,2BAAAA;AAAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,WAAWF,WAAAA;AAAAA,sBACT,SAAS;AAAA,sBACT,SAAS,KAAK;AAAA,sBACd,cAAc,SAAS;AAAA,sBACvB,UAAU,SAAS,SAASG,WAAAA,WAAW,MAAM,CAAC,EAAE;AAAA,oBAAA;AAAA,oBAElD,OAAO,EAAE,iBAAiB,MAAM,MAAA;AAAA,oBAChC,eAAY;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACd;AAAA,YAAA;AAAA,YAzBK,GAAG,MAAM,KAAK,IAAI,CAAC;AAAA,UAAA;AAAA,QA4B9B,CAAC,EAAA,CACH;AAAA,QAEC,eACCD,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,WAAW,SAAS;AAAA,YACpB,OAAON;AAAA,YACP,UAAU,CAAC,MAAM,SAAS,EAAE,OAAO,KAAK;AAAA,YACxC,cAAW;AAAA,YACX,eAAa,GAAG,MAAM;AAAA,UAAA;AAAA,QAAA;AAAA,MACxB;AAAA,IAAA;AAAA,EAAA;AAIR;AACA,gBAAgB,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpF9B,MAAM,cAA0C,CAAC,UAC/CM,+BAAC,mBAAiB,GAAG,OAAO,UAAU,OAAA,CAAQ;;"}
+{"version":3,"file":"ColorPicker-C3dyO_vv.cjs","sources":["../../src/components/ColorPicker/ColorPickerBase.tsx","../../src/components/ColorPicker/next/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","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport ColorPickerBase from \"../ColorPickerBase\";\r\nimport styles from \"./ColorPicker.module.scss\";\r\nimport { ColorPickerProps } from \"../ColorPicker.types\";\r\n\r\nconst ColorPicker: React.FC<ColorPickerProps> = (props) => (\r\n  <ColorPickerBase {...props} classMap={styles} />\r\n);\r\n\r\nexport default ColorPicker;\r\n"],"names":["selected","getDefaultSize","getDefaultShadow","useMemo","combineClassNames","jsxs","jsx","capitalize"],"mappings":";;;;;;AASA,MAAM,kBAAkD,CAAC;AAAA,EACvD,QAAQ;AAAA,EACR;AAAA,EACA,UAAAA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,WAAW;AAAA,EACX,OAAOC,kBAAAA,eAAA;AAAA,EACP,SAASC,kBAAAA,iBAAA;AAAA,EACT,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,YAAY;AAAA,EACZ;AAAA,EACA,eAAe,SAAS;AAC1B,MAAM;AACJ,QAAM,WAAW,GAAG,MAAM;AAE1B,QAAM,aAAaC,MAAAA;AAAAA,IACjB,MAAMC,WAAAA,kBAAkB,SAAS,QAAQ,SAAS,IAAI,GAAG,SAAS,KAAK,CAAC;AAAA,IACxE,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAGxB,SACEC,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWD,WAAAA,kBAAkB,SAAS,cAAc,SAAS;AAAA,MAC7D;AAAA,MACA,eAAa;AAAA,MAEb,UAAA;AAAA,QAAAE,+BAAC,YAAO,IAAI,UAAU,WAAW,SAAS,QACvC,UAAA,OACH;AAAA,QAEAA,2BAAAA,IAAC,SAAI,WAAW,SAAS,mBACtB,UAAA,OAAO,IAAI,CAAC,OAAO,MAAM;AACxB,gBAAM,KAAK,GAAG,MAAM,UAAU,CAAC;AAC/B,gBAAM,aAAaN,cAAa,MAAM;AACtC,iBACEK,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cAEC,WAAW;AAAA,cACX,SAAS;AAAA,cACT,OAAO,MAAM;AAAA,cACb,eAAa,GAAG,MAAM,WAAW,MAAM,KAAK;AAAA,cAE5C,UAAA;AAAA,gBAAAC,2BAAAA;AAAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,MAAK;AAAA,oBACL;AAAA,oBACA;AAAA,oBACA,OAAO,MAAM;AAAA,oBACb,SAAS;AAAA,oBACT,UAAU,MAAM,SAAS,MAAM,KAAK;AAAA,oBACpC,WAAW,SAAS;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAEtBA,2BAAAA,IAAC,QAAA,EAAK,WAAU,WAAW,gBAAM,OAAM;AAAA,gBACvCA,2BAAAA;AAAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,WAAWF,WAAAA;AAAAA,sBACT,SAAS;AAAA,sBACT,SAAS,KAAK;AAAA,sBACd,cAAc,SAAS;AAAA,sBACvB,UAAU,SAAS,SAASG,WAAAA,WAAW,MAAM,CAAC,EAAE;AAAA,oBAAA;AAAA,oBAElD,OAAO,EAAE,iBAAiB,MAAM,MAAA;AAAA,oBAChC,eAAY;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACd;AAAA,YAAA;AAAA,YAzBK,GAAG,MAAM,KAAK,IAAI,CAAC;AAAA,UAAA;AAAA,QA4B9B,CAAC,EAAA,CACH;AAAA,QAEC,eACCD,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,WAAW,SAAS;AAAA,YACpB,OAAON;AAAA,YACP,UAAU,CAAC,MAAM,SAAS,EAAE,OAAO,KAAK;AAAA,YACxC,cAAW;AAAA,YACX,eAAa,GAAG,MAAM;AAAA,UAAA;AAAA,QAAA;AAAA,MACxB;AAAA,IAAA;AAAA,EAAA;AAIR;AACA,gBAAgB,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpF9B,MAAM,cAA0C,CAAC,UAC/CM,+BAAC,mBAAiB,GAAG,OAAO,UAAU,OAAA,CAAQ;;"}

package/dist/next/{ColorPicker-4Fw0fwbk.js → ColorPicker-DgLJQRJu.js}

@@ -89,35 +89,36 @@ const ColorPickerBase = ({
   );
 };
 ColorPickerBase.displayName = "ColorPickerBase";
-const noScroll = "_noScroll_z0z9a_91";
-const errorMessage = "_errorMessage_z0z9a_92";
-const loadingContainer = "_loadingContainer_z0z9a_93";
-const hideScrollbar = "_hideScrollbar_z0z9a_85";
-const sr_only = "_sr_only_z0z9a_94";
-const color_picker = "_color_picker_z0z9a_540";
-const legend = "_legend_z0z9a_553";
-const grid = "_grid_z0z9a_559";
-const selected = "_selected_z0z9a_565";
-const swatch = "_swatch_z0z9a_571";
-const xs = "_xs_z0z9a_581";
-const small = "_small_z0z9a_585";
-const medium = "_medium_z0z9a_589";
-const large = "_large_z0z9a_593";
-const xl = "_xl_z0z9a_597";
-const circle = "_circle_z0z9a_602";
-const square = "_square_z0z9a_606";
-const round = "_round_z0z9a_610";
-const radio_input = "_radio_input_z0z9a_614";
-const preview = "_preview_z0z9a_618";
-const custom_input = "_custom_input_z0z9a_626";
-const rounded = "_rounded_z0z9a_639";
-const shadowNone = "_shadowNone_z0z9a_644";
-const shadowLight = "_shadowLight_z0z9a_648";
-const shadowMedium = "_shadowMedium_z0z9a_652";
-const shadowStrong = "_shadowStrong_z0z9a_656";
-const shadowIntense = "_shadowIntense_z0z9a_660";
-const spin = "_spin_z0z9a_1";
-const pulse = "_pulse_z0z9a_1";
+const noScroll = "_noScroll_1v6qg_108";
+const errorMessage = "_errorMessage_1v6qg_109";
+const loadingContainer = "_loadingContainer_1v6qg_110";
+const hideScrollbar = "_hideScrollbar_1v6qg_102";
+const sr_only = "_sr_only_1v6qg_111";
+const color_picker = "_color_picker_1v6qg_540";
+const legend = "_legend_1v6qg_565";
+const grid = "_grid_1v6qg_581";
+const selected = "_selected_1v6qg_597";
+const swatch = "_swatch_1v6qg_603";
+const round = "_round_1v6qg_620";
+const square = "_square_1v6qg_623";
+const pill = "_pill_1v6qg_626";
+const xs = "_xs_1v6qg_630";
+const small = "_small_1v6qg_646";
+const medium = "_medium_1v6qg_662";
+const large = "_large_1v6qg_678";
+const xl = "_xl_1v6qg_694";
+const radio_input = "_radio_input_1v6qg_711";
+const preview = "_preview_1v6qg_715";
+const custom_input = "_custom_input_1v6qg_723";
+const circle = "_circle_1v6qg_738";
+const rounded = "_rounded_1v6qg_746";
+const shadowNone = "_shadowNone_1v6qg_750";
+const shadowLight = "_shadowLight_1v6qg_754";
+const shadowMedium = "_shadowMedium_1v6qg_758";
+const shadowStrong = "_shadowStrong_1v6qg_762";
+const shadowIntense = "_shadowIntense_1v6qg_766";
+const spin = "_spin_1v6qg_1";
+const pulse = "_pulse_1v6qg_1";
 const styles = {
   noScroll,
   errorMessage,
@@ -129,35 +130,36 @@ const styles = {
   grid,
   selected,
   swatch,
+  round,
+  square,
+  pill,
   xs,
   small,
   medium,
   large,
   xl,
-  circle,
-  square,
-  round,
   radio_input,
   preview,
   custom_input,
+  circle,
   rounded,
   shadowNone,
   shadowLight,
   shadowMedium,
   shadowStrong,
   shadowIntense,
-  "fade-in": "_fade-in_z0z9a_1",
-  "slide-up": "_slide-up_z0z9a_1",
-  "spin-3d": "_spin-3d_z0z9a_1",
+  "fade-in": "_fade-in_1v6qg_1",
+  "slide-up": "_slide-up_1v6qg_1",
+  "spin-3d": "_spin-3d_1v6qg_1",
   spin,
   pulse,
-  "fade-in-up": "_fade-in-up_z0z9a_1",
-  "progress-grow": "_progress-grow_z0z9a_1",
-  "indeterminate-move": "_indeterminate-move_z0z9a_1",
-  "skeleton-loading": "_skeleton-loading_z0z9a_1"
+  "fade-in-up": "_fade-in-up_1v6qg_1",
+  "progress-grow": "_progress-grow_1v6qg_1",
+  "indeterminate-move": "_indeterminate-move_1v6qg_1",
+  "skeleton-loading": "_skeleton-loading_1v6qg_1"
 };
 const ColorPicker = (props) => /* @__PURE__ */ jsx(ColorPickerBase, { ...props, classMap: styles });
 export {
   ColorPicker as C
 };
-//# sourceMappingURL=ColorPicker-4Fw0fwbk.js.map
+//# sourceMappingURL=ColorPicker-DgLJQRJu.js.map

package/dist/next/{ColorPicker-4Fw0fwbk.js.map → ColorPicker-DgLJQRJu.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ColorPicker-4Fw0fwbk.js","sources":["../../src/components/ColorPicker/ColorPickerBase.tsx","../../src/components/ColorPicker/next/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","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport ColorPickerBase from \"../ColorPickerBase\";\r\nimport styles from \"./ColorPicker.module.scss\";\r\nimport { ColorPickerProps } from \"../ColorPicker.types\";\r\n\r\nconst ColorPicker: React.FC<ColorPickerProps> = (props) => (\r\n  <ColorPickerBase {...props} classMap={styles} />\r\n);\r\n\r\nexport default ColorPicker;\r\n"],"names":["selected"],"mappings":";;;;;AASA,MAAM,kBAAkD,CAAC;AAAA,EACvD,QAAQ;AAAA,EACR;AAAA,EACA,UAAAA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,WAAW;AAAA,EACX,OAAO,eAAA;AAAA,EACP,SAAS,iBAAA;AAAA,EACT,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,YAAY;AAAA,EACZ;AAAA,EACA,eAAe,SAAS;AAC1B,MAAM;AACJ,QAAM,WAAW,GAAG,MAAM;AAE1B,QAAM,aAAa;AAAA,IACjB,MAAM,kBAAkB,SAAS,QAAQ,SAAS,IAAI,GAAG,SAAS,KAAK,CAAC;AAAA,IACxE,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAGxB,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,kBAAkB,SAAS,cAAc,SAAS;AAAA,MAC7D;AAAA,MACA,eAAa;AAAA,MAEb,UAAA;AAAA,QAAA,oBAAC,YAAO,IAAI,UAAU,WAAW,SAAS,QACvC,UAAA,OACH;AAAA,QAEA,oBAAC,SAAI,WAAW,SAAS,mBACtB,UAAA,OAAO,IAAI,CAAC,OAAO,MAAM;AACxB,gBAAM,KAAK,GAAG,MAAM,UAAU,CAAC;AAC/B,gBAAM,aAAaA,cAAa,MAAM;AACtC,iBACE;AAAA,YAAC;AAAA,YAAA;AAAA,cAEC,WAAW;AAAA,cACX,SAAS;AAAA,cACT,OAAO,MAAM;AAAA,cACb,eAAa,GAAG,MAAM,WAAW,MAAM,KAAK;AAAA,cAE5C,UAAA;AAAA,gBAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,MAAK;AAAA,oBACL;AAAA,oBACA;AAAA,oBACA,OAAO,MAAM;AAAA,oBACb,SAAS;AAAA,oBACT,UAAU,MAAM,SAAS,MAAM,KAAK;AAAA,oBACpC,WAAW,SAAS;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAEtB,oBAAC,QAAA,EAAK,WAAU,WAAW,gBAAM,OAAM;AAAA,gBACvC;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,WAAW;AAAA,sBACT,SAAS;AAAA,sBACT,SAAS,KAAK;AAAA,sBACd,cAAc,SAAS;AAAA,sBACvB,UAAU,SAAS,SAAS,WAAW,MAAM,CAAC,EAAE;AAAA,oBAAA;AAAA,oBAElD,OAAO,EAAE,iBAAiB,MAAM,MAAA;AAAA,oBAChC,eAAY;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACd;AAAA,YAAA;AAAA,YAzBK,GAAG,MAAM,KAAK,IAAI,CAAC;AAAA,UAAA;AAAA,QA4B9B,CAAC,EAAA,CACH;AAAA,QAEC,eACC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,WAAW,SAAS;AAAA,YACpB,OAAOA;AAAA,YACP,UAAU,CAAC,MAAM,SAAS,EAAE,OAAO,KAAK;AAAA,YACxC,cAAW;AAAA,YACX,eAAa,GAAG,MAAM;AAAA,UAAA;AAAA,QAAA;AAAA,MACxB;AAAA,IAAA;AAAA,EAAA;AAIR;AACA,gBAAgB,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpF9B,MAAM,cAA0C,CAAC,UAC/C,oBAAC,mBAAiB,GAAG,OAAO,UAAU,OAAA,CAAQ;"}
+{"version":3,"file":"ColorPicker-DgLJQRJu.js","sources":["../../src/components/ColorPicker/ColorPickerBase.tsx","../../src/components/ColorPicker/next/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","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport ColorPickerBase from \"../ColorPickerBase\";\r\nimport styles from \"./ColorPicker.module.scss\";\r\nimport { ColorPickerProps } from \"../ColorPicker.types\";\r\n\r\nconst ColorPicker: React.FC<ColorPickerProps> = (props) => (\r\n  <ColorPickerBase {...props} classMap={styles} />\r\n);\r\n\r\nexport default ColorPicker;\r\n"],"names":["selected"],"mappings":";;;;;AASA,MAAM,kBAAkD,CAAC;AAAA,EACvD,QAAQ;AAAA,EACR;AAAA,EACA,UAAAA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,WAAW;AAAA,EACX,OAAO,eAAA;AAAA,EACP,SAAS,iBAAA;AAAA,EACT,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,YAAY;AAAA,EACZ;AAAA,EACA,eAAe,SAAS;AAC1B,MAAM;AACJ,QAAM,WAAW,GAAG,MAAM;AAE1B,QAAM,aAAa;AAAA,IACjB,MAAM,kBAAkB,SAAS,QAAQ,SAAS,IAAI,GAAG,SAAS,KAAK,CAAC;AAAA,IACxE,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAGxB,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,kBAAkB,SAAS,cAAc,SAAS;AAAA,MAC7D;AAAA,MACA,eAAa;AAAA,MAEb,UAAA;AAAA,QAAA,oBAAC,YAAO,IAAI,UAAU,WAAW,SAAS,QACvC,UAAA,OACH;AAAA,QAEA,oBAAC,SAAI,WAAW,SAAS,mBACtB,UAAA,OAAO,IAAI,CAAC,OAAO,MAAM;AACxB,gBAAM,KAAK,GAAG,MAAM,UAAU,CAAC;AAC/B,gBAAM,aAAaA,cAAa,MAAM;AACtC,iBACE;AAAA,YAAC;AAAA,YAAA;AAAA,cAEC,WAAW;AAAA,cACX,SAAS;AAAA,cACT,OAAO,MAAM;AAAA,cACb,eAAa,GAAG,MAAM,WAAW,MAAM,KAAK;AAAA,cAE5C,UAAA;AAAA,gBAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,MAAK;AAAA,oBACL;AAAA,oBACA;AAAA,oBACA,OAAO,MAAM;AAAA,oBACb,SAAS;AAAA,oBACT,UAAU,MAAM,SAAS,MAAM,KAAK;AAAA,oBACpC,WAAW,SAAS;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAEtB,oBAAC,QAAA,EAAK,WAAU,WAAW,gBAAM,OAAM;AAAA,gBACvC;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,WAAW;AAAA,sBACT,SAAS;AAAA,sBACT,SAAS,KAAK;AAAA,sBACd,cAAc,SAAS;AAAA,sBACvB,UAAU,SAAS,SAAS,WAAW,MAAM,CAAC,EAAE;AAAA,oBAAA;AAAA,oBAElD,OAAO,EAAE,iBAAiB,MAAM,MAAA;AAAA,oBAChC,eAAY;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACd;AAAA,YAAA;AAAA,YAzBK,GAAG,MAAM,KAAK,IAAI,CAAC;AAAA,UAAA;AAAA,QA4B9B,CAAC,EAAA,CACH;AAAA,QAEC,eACC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,WAAW,SAAS;AAAA,YACpB,OAAOA;AAAA,YACP,UAAU,CAAC,MAAM,SAAS,EAAE,OAAO,KAAK;AAAA,YACxC,cAAW;AAAA,YACX,eAAa,GAAG,MAAM;AAAA,UAAA;AAAA,QAAA;AAAA,MACxB;AAAA,IAAA;AAAA,EAAA;AAIR;AACA,gBAAgB,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpF9B,MAAM,cAA0C,CAAC,UAC/C,oBAAC,mBAAiB,GAAG,OAAO,UAAU,OAAA,CAAQ;"}

package/dist/next/ColorPicker.cjs.js

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

package/dist/next/ColorPicker.js

@@ -1,4 +1,4 @@
-import { C } from "./ColorPicker-4Fw0fwbk.js";
+import { C } from "./ColorPicker-DgLJQRJu.js";
 export {
   C as default
 };

package/dist/next/{CommandPalette-DhyChRCJ.cjs → CommandPalette-CzwGz-Py.cjs}

@@ -5,7 +5,7 @@ const ReactDOM = require("react-dom");
 const classNames = require("./classNames-BcWMx052.cjs");
 const capitalize = require("./capitalize-DoV-nOmN.cjs");
 const borealStyleConfig = require("./boreal-style-config-Rr5d5Qts.cjs");
-const TextInput = require("./TextInput-CpbTf99E.cjs");
+const TextInput = require("./TextInput-Cr0WjibW.cjs");
 const CommandPaletteBase = ({
   commands,
   placeholder = "Search...",
@@ -226,39 +226,39 @@ const CommandPaletteBase = ({
   );
 };
 CommandPaletteBase.displayName = "CommandPaletteBase";
-const noScroll = "_noScroll_19rnn_91";
-const errorMessage = "_errorMessage_19rnn_92";
-const loadingContainer = "_loadingContainer_19rnn_93";
-const hideScrollbar = "_hideScrollbar_19rnn_85";
-const sr_only = "_sr_only_19rnn_94";
-const overlay = "_overlay_19rnn_540";
-const command_palette = "_command_palette_19rnn_551";
-const roundNone = "_roundNone_19rnn_564";
-const item = "_item_19rnn_568";
-const roundSmall = "_roundSmall_19rnn_572";
-const roundMedium = "_roundMedium_19rnn_580";
-const roundLarge = "_roundLarge_19rnn_588";
-const roundFull = "_roundFull_19rnn_596";
-const shadowNone = "_shadowNone_19rnn_604";
-const shadowLight = "_shadowLight_19rnn_608";
-const shadowMedium = "_shadowMedium_19rnn_612";
-const shadowStrong = "_shadowStrong_19rnn_616";
-const shadowIntense = "_shadowIntense_19rnn_620";
-const input = "_input_19rnn_624";
-const list = "_list_19rnn_630";
-const icon = "_icon_19rnn_649";
-const empty = "_empty_19rnn_653";
-const active = "_active_19rnn_658";
-const primary = "_primary_19rnn_662";
-const secondary = "_secondary_19rnn_675";
-const tertiary = "_tertiary_19rnn_688";
-const quaternary = "_quaternary_19rnn_701";
-const clear = "_clear_19rnn_714";
-const success = "_success_19rnn_727";
-const error = "_error_19rnn_92";
-const warning = "_warning_19rnn_753";
-const spin = "_spin_19rnn_1";
-const pulse = "_pulse_19rnn_1";
+const noScroll = "_noScroll_1o5x8_108";
+const errorMessage = "_errorMessage_1o5x8_109";
+const loadingContainer = "_loadingContainer_1o5x8_110";
+const hideScrollbar = "_hideScrollbar_1o5x8_102";
+const sr_only = "_sr_only_1o5x8_111";
+const overlay = "_overlay_1o5x8_540";
+const command_palette = "_command_palette_1o5x8_561";
+const roundNone = "_roundNone_1o5x8_592";
+const item = "_item_1o5x8_596";
+const roundSmall = "_roundSmall_1o5x8_600";
+const roundMedium = "_roundMedium_1o5x8_608";
+const roundLarge = "_roundLarge_1o5x8_616";
+const roundFull = "_roundFull_1o5x8_624";
+const shadowNone = "_shadowNone_1o5x8_632";
+const shadowLight = "_shadowLight_1o5x8_636";
+const shadowMedium = "_shadowMedium_1o5x8_640";
+const shadowStrong = "_shadowStrong_1o5x8_644";
+const shadowIntense = "_shadowIntense_1o5x8_648";
+const input = "_input_1o5x8_652";
+const list = "_list_1o5x8_677";
+const icon = "_icon_1o5x8_737";
+const empty = "_empty_1o5x8_741";
+const active = "_active_1o5x8_756";
+const primary = "_primary_1o5x8_761";
+const secondary = "_secondary_1o5x8_779";
+const tertiary = "_tertiary_1o5x8_797";
+const quaternary = "_quaternary_1o5x8_815";
+const clear = "_clear_1o5x8_833";
+const success = "_success_1o5x8_851";
+const error = "_error_1o5x8_109";
+const warning = "_warning_1o5x8_887";
+const spin = "_spin_1o5x8_1";
+const pulse = "_pulse_1o5x8_1";
 const styles = {
   noScroll,
   errorMessage,
@@ -291,15 +291,15 @@ const styles = {
   success,
   error,
   warning,
-  "fade-in": "_fade-in_19rnn_1",
-  "slide-up": "_slide-up_19rnn_1",
-  "spin-3d": "_spin-3d_19rnn_1",
+  "fade-in": "_fade-in_1o5x8_1",
+  "slide-up": "_slide-up_1o5x8_1",
+  "spin-3d": "_spin-3d_1o5x8_1",
   spin,
   pulse,
-  "fade-in-up": "_fade-in-up_19rnn_1",
-  "progress-grow": "_progress-grow_19rnn_1",
-  "indeterminate-move": "_indeterminate-move_19rnn_1",
-  "skeleton-loading": "_skeleton-loading_19rnn_1"
+  "fade-in-up": "_fade-in-up_1o5x8_1",
+  "progress-grow": "_progress-grow_1o5x8_1",
+  "indeterminate-move": "_indeterminate-move_1o5x8_1",
+  "skeleton-loading": "_skeleton-loading_1o5x8_1"
 };
 const CommandPalette = (props) => /* @__PURE__ */ require$$2.jsx(
   CommandPaletteBase,
@@ -310,4 +310,4 @@ const CommandPalette = (props) => /* @__PURE__ */ require$$2.jsx(
   }
 );
 exports.CommandPalette = CommandPalette;
-//# sourceMappingURL=CommandPalette-DhyChRCJ.cjs.map
+//# sourceMappingURL=CommandPalette-CzwGz-Py.cjs.map