@salt-ds/core 1.47.0 → 1.47.2

package/dist-es/progress/CircularProgress/CircularProgress.css.js

@@ -1,4 +1,4 @@
-var css_248z = ".saltCircularProgress {\n  color: var(--salt-content-primary-foreground);\n  display: inline-flex;\n  position: relative;\n}\n\n.saltCircularProgress-progressLabel {\n  align-items: center;\n  color: var(--salt-content-primary-foreground);\n  display: flex;\n  height: 100%;\n  justify-content: center;\n  left: 0;\n  position: absolute;\n  width: 100%;\n}\n\n.saltCircularProgress-track {\n  inline-size: calc(var(--salt-size-base) * 3);\n  block-size: calc(var(--salt-size-base) * 3);\n  outline-style: var(--salt-track-borderStyle);\n  outline-width: var(--salt-size-bar);\n  outline-offset: calc(var(--salt-size-bar) * -1.5);\n  border-radius: calc(var(--salt-size-base) * 3);\n  outline-color: var(--salt-track-borderColor);\n  box-sizing: border-box;\n}\n\n.saltCircularProgress-bar,\n.saltCircularProgress-bufferBorder,\n.saltCircularProgress-bufferBackground {\n  inline-size: calc(var(--salt-size-base) * 3);\n  block-size: calc(var(--salt-size-base) * 3);\n  border-radius: calc(var(--salt-size-base) * 3);\n  box-sizing: border-box;\n}\n.saltCircularProgress-bar {\n  border-color: var(--salt-accent-background);\n  border-style: var(--salt-track-borderStyle);\n  border-width: var(--salt-size-bar-strong);\n}\n.saltCircularProgress-bufferBorder {\n  border: solid var(--salt-size-border) var(--salt-accent-background);\n  outline: solid var(--salt-size-border) var(--salt-accent-background);\n  outline-offset: calc(var(--salt-size-bar-strong) * -1);\n}\n\n.saltCircularProgress-bufferBackground {\n  border: solid var(--salt-size-bar-strong) var(--salt-container-primary-background);\n  position: absolute;\n  bottom: 0;\n  z-index: calc(var(--salt-zIndex-default) * -1);\n}\n\n.saltCircularProgress-bars {\n  position: absolute;\n  inset-block-start: 0;\n  inset-inline-start: 0;\n  inline-size: 100%;\n  block-size: 100%;\n}\n\n.saltCircularProgress-bufferOverlayRight,\n.saltCircularProgress-bufferOverlayLeft,\n.saltCircularProgress-barOverlayRight,\n.saltCircularProgress-barOverlayLeft,\n.saltCircularProgress-bufferSubOverlayRight,\n.saltCircularProgress-bufferSubOverlayLeft,\n.saltCircularProgress-barSubOverlayRight,\n.saltCircularProgress-barSubOverlayLeft {\n  block-size: 100%;\n  transform-origin: 100% center;\n  overflow: hidden;\n}\n\n.saltCircularProgress-bufferOverlayRight,\n.saltCircularProgress-bufferOverlayLeft,\n.saltCircularProgress-barOverlayRight,\n.saltCircularProgress-barOverlayLeft {\n  inline-size: 50%;\n  transform: rotate(180deg);\n  position: absolute;\n}\n\n.saltCircularProgress-bufferSubOverlayRight,\n.saltCircularProgress-bufferSubOverlayLeft,\n.saltCircularProgress-barSubOverlayRight,\n.saltCircularProgress-barSubOverlayLeft {\n  inline-size: 100%;\n  transform: rotate(-180deg);\n}\n\n.saltCircularProgress-bufferOverlayLeft,\n.saltCircularProgress-barOverlayLeft {\n  transform: rotate(0deg);\n}\n\n.saltCircularProgress-bufferOverlayRight:before,\n.saltCircularProgress-bufferSubOverlay:before {\n  content: \"\";\n  background: var(--salt-accent-background);\n  position: absolute;\n  right: 0;\n  width: var(--salt-size-border);\n  height: var(--salt-size-bar-strong);\n}\n.saltCircularProgress-bufferOverlayRight:before {\n  bottom: 0;\n  z-index: var(--salt-zIndex-default);\n}\n";
+var css_248z = ".saltCircularProgress {\n  color: var(--salt-content-primary-foreground);\n  display: inline-flex;\n  position: relative;\n}\n\n.saltCircularProgress-progressLabel {\n  align-items: center;\n  color: var(--salt-content-primary-foreground);\n  display: flex;\n  height: 100%;\n  justify-content: center;\n  left: 0;\n  position: absolute;\n  width: 100%;\n}\n\n.saltCircularProgress-track {\n  inline-size: calc(var(--salt-size-base) * 3);\n  block-size: calc(var(--salt-size-base) * 3);\n  outline-style: var(--salt-borderStyle-solid);\n  outline-width: var(--salt-size-bar);\n  outline-offset: calc(var(--salt-size-bar) * -1.5);\n  border-radius: calc(var(--salt-size-base) * 3);\n  outline-color: var(--salt-sentiment-neutral-track);\n  box-sizing: border-box;\n}\n\n.saltCircularProgress-bar,\n.saltCircularProgress-bufferBorder,\n.saltCircularProgress-bufferBackground {\n  inline-size: calc(var(--salt-size-base) * 3);\n  block-size: calc(var(--salt-size-base) * 3);\n  border-radius: calc(var(--salt-size-base) * 3);\n  box-sizing: border-box;\n}\n.saltCircularProgress-bar {\n  border-color: var(--salt-accent-background);\n  border-style: var(--salt-borderStyle-solid);\n  border-width: var(--salt-size-bar-strong);\n}\n.saltCircularProgress-bufferBorder {\n  border: solid var(--salt-size-fixed-100) var(--salt-accent-background);\n  outline: solid var(--salt-size-fixed-100) var(--salt-accent-background);\n  outline-offset: calc(var(--salt-size-bar-strong) * -1);\n}\n\n.saltCircularProgress-bufferBackground {\n  border: solid var(--salt-size-bar-strong) var(--salt-container-primary-background);\n  position: absolute;\n  bottom: 0;\n  z-index: calc(var(--salt-zIndex-default) * -1);\n}\n\n.saltCircularProgress-bars {\n  position: absolute;\n  inset-block-start: 0;\n  inset-inline-start: 0;\n  inline-size: 100%;\n  block-size: 100%;\n}\n\n.saltCircularProgress-bufferOverlayRight,\n.saltCircularProgress-bufferOverlayLeft,\n.saltCircularProgress-barOverlayRight,\n.saltCircularProgress-barOverlayLeft,\n.saltCircularProgress-bufferSubOverlayRight,\n.saltCircularProgress-bufferSubOverlayLeft,\n.saltCircularProgress-barSubOverlayRight,\n.saltCircularProgress-barSubOverlayLeft {\n  block-size: 100%;\n  transform-origin: 100% center;\n  overflow: hidden;\n}\n\n.saltCircularProgress-bufferOverlayRight,\n.saltCircularProgress-bufferOverlayLeft,\n.saltCircularProgress-barOverlayRight,\n.saltCircularProgress-barOverlayLeft {\n  inline-size: 50%;\n  transform: rotate(180deg);\n  position: absolute;\n}\n\n.saltCircularProgress-bufferSubOverlayRight,\n.saltCircularProgress-bufferSubOverlayLeft,\n.saltCircularProgress-barSubOverlayRight,\n.saltCircularProgress-barSubOverlayLeft {\n  inline-size: 100%;\n  transform: rotate(-180deg);\n}\n\n.saltCircularProgress-bufferOverlayLeft,\n.saltCircularProgress-barOverlayLeft {\n  transform: rotate(0deg);\n}\n\n.saltCircularProgress-bufferOverlayRight:before,\n.saltCircularProgress-bufferSubOverlay:before {\n  content: \"\";\n  background: var(--salt-accent-background);\n  position: absolute;\n  right: 0;\n  width: var(--salt-size-fixed-100);\n  height: var(--salt-size-bar-strong);\n}\n.saltCircularProgress-bufferOverlayRight:before {\n  bottom: 0;\n  z-index: var(--salt-zIndex-default);\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=CircularProgress.css.js.map

package/dist-es/progress/CircularProgress/CircularProgress.js

@@ -3,11 +3,11 @@ import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
 import { clsx } from 'clsx';
 import { forwardRef } from 'react';
-import { Text } from '../../text/Text.js';
 import '../../text/Code.js';
 import '../../text/Display.js';
 import '../../text/Headings.js';
 import '../../text/Label.js';
+import { Text } from '../../text/Text.js';
 import '../../text/TextAction.js';
 import '../../text/TextNotation.js';
 import { makePrefixer } from '../../utils/makePrefixer.js';

package/dist-es/progress/CircularProgress/CircularProgress.js.map

@@ -1 +1 @@
-{"version":3,"file":"CircularProgress.js","sources":["../src/progress/CircularProgress/CircularProgress.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type CSSProperties,\n  type ComponentPropsWithoutRef,\n  forwardRef,\n} from \"react\";\nimport { Text } from \"../../text\";\nimport { makePrefixer } from \"../../utils\";\n\nimport circularProgressCSS from \"./CircularProgress.css\";\n\nconst withBaseName = makePrefixer(\"saltCircularProgress\");\n\nconst getRotationAngle = (bar: number, shift = 0) => {\n  return -180 + ((bar - shift) / 50) * 180;\n};\n\nexport interface CircularProgressProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The value of the buffer indicator.\n   * Value between 0 and max.\n   */\n  bufferValue?: number;\n  /**\n   * Whether to hide the text label within the progress. Defaults to `false`.\n   */\n  hideLabel?: boolean;\n  /**\n   * The value of the max progress indicator.\n   * Default value is 100.\n   */\n  max?: number;\n  /**\n   * The value of the min progress indicator.\n   * Default value is 0.\n   */\n  min?: number;\n  /**\n   * The value of the progress indicator.\n   * Value between 0 and max.\n   */\n  value?: number;\n}\n\nexport const CircularProgress = forwardRef<\n  HTMLDivElement,\n  CircularProgressProps\n>(function CircularProgress(\n  {\n    className,\n    hideLabel = false,\n    max = 100,\n    min = 0,\n    value = 0,\n    bufferValue = 0,\n    ...rest\n  },\n  ref,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-circular-progress\",\n    css: circularProgressCSS,\n    window: targetWindow,\n  });\n\n  const bufferSubOverlayRightStyle: CSSProperties = {};\n  const bufferSubOverlayLeftStyle: CSSProperties = {};\n  const barSubOverlayRightStyle: CSSProperties = {};\n  const barSubOverlayLeftStyle: CSSProperties = {};\n\n  const buffer = ((bufferValue - min) / (max - min)) * 100;\n  const progress = ((value - min) / (max - min)) * 100;\n\n  if (progress <= 50) {\n    const rotationAngle = getRotationAngle(progress);\n    barSubOverlayRightStyle.transform = `rotate(${rotationAngle}deg)`;\n    barSubOverlayLeftStyle.transform = \"rotate(-180deg)\";\n  } else {\n    const rotationAngle = getRotationAngle(progress, 50);\n    barSubOverlayRightStyle.transform = \"rotate(0deg)\";\n    barSubOverlayLeftStyle.transform = `rotate(${rotationAngle}deg)`;\n  }\n  if (buffer <= 50) {\n    const rotationAngle = getRotationAngle(buffer);\n    bufferSubOverlayRightStyle.transform = `rotate(${rotationAngle}deg)`;\n    bufferSubOverlayLeftStyle.transform = \"rotate(-180deg)\";\n  } else {\n    const rotationAngle = getRotationAngle(buffer, 50);\n    bufferSubOverlayRightStyle.transform = \"rotate(0deg)\";\n    bufferSubOverlayLeftStyle.transform = `rotate(${rotationAngle}deg)`;\n  }\n\n  return (\n    <div\n      className={clsx(withBaseName(), className)}\n      ref={ref}\n      role=\"progressbar\"\n      aria-valuemax={max}\n      aria-valuemin={min}\n      aria-valuenow={Math.round(value)}\n      {...rest}\n    >\n      <div className={withBaseName(\"track\")} />\n      <div className={withBaseName(\"bars\")}>\n        {buffer > 0 && (\n          <div className={withBaseName(\"bufferOverlayRight\")}>\n            <div\n              className={clsx(withBaseName(\"bufferSubOverlayRight\"), {\n                [withBaseName(\"bufferSubOverlay\")]: buffer <= 50,\n              })}\n              style={bufferSubOverlayRightStyle}\n            >\n              <div className={withBaseName(\"bufferBackground\")} />\n              <div className={withBaseName(\"bufferBorder\")} />\n            </div>\n          </div>\n        )}\n        <div className={withBaseName(\"barOverlayRight\")}>\n          <div\n            className={withBaseName(\"barSubOverlayRight\")}\n            style={barSubOverlayRightStyle}\n          >\n            <div className={withBaseName(\"bar\")} />\n          </div>\n        </div>\n        {buffer > 0 && (\n          <div className={withBaseName(\"bufferOverlayLeft\")}>\n            <div\n              className={clsx(\n                withBaseName(\"bufferSubOverlay\"),\n                withBaseName(\"bufferSubOverlayLeft\"),\n              )}\n              style={bufferSubOverlayLeftStyle}\n            >\n              <div className={withBaseName(\"bufferBorder\")} />\n              <div className={withBaseName(\"bufferBackground\")} />\n            </div>\n          </div>\n        )}\n        <div className={withBaseName(\"barOverlayLeft\")}>\n          <div\n            className={withBaseName(\"barSubOverlayLeft\")}\n            style={barSubOverlayLeftStyle}\n          >\n            <div className={withBaseName(\"bar\")} />\n          </div>\n        </div>\n      </div>\n      {!hideLabel && (\n        <Text styleAs=\"h2\" className={withBaseName(\"progressLabel\")}>\n          {`${Math.round(progress)} %`}\n        </Text>\n      )}\n    </div>\n  );\n});\n"],"names":["CircularProgress","circularProgressCSS"],"mappings":";;;;;;;;;;;;;;;;;;;AAaA,MAAM,YAAA,GAAe,aAAa,sBAAsB,CAAA;AAExD,MAAM,gBAAmB,GAAA,CAAC,GAAa,EAAA,KAAA,GAAQ,CAAM,KAAA;AACnD,EAAO,OAAA,IAAA,GAAA,CAAS,GAAM,GAAA,KAAA,IAAS,EAAM,GAAA,GAAA;AACvC,CAAA;AA6Ba,MAAA,gBAAA,GAAmB,UAG9B,CAAA,SAASA,iBACT,CAAA;AAAA,EACE,SAAA;AAAA,EACA,SAAY,GAAA,KAAA;AAAA,EACZ,GAAM,GAAA,GAAA;AAAA,EACN,GAAM,GAAA,CAAA;AAAA,EACN,KAAQ,GAAA,CAAA;AAAA,EACR,WAAc,GAAA,CAAA;AAAA,EACd,GAAG;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,wBAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,6BAA4C,EAAC;AACnD,EAAA,MAAM,4BAA2C,EAAC;AAClD,EAAA,MAAM,0BAAyC,EAAC;AAChD,EAAA,MAAM,yBAAwC,EAAC;AAE/C,EAAA,MAAM,MAAW,GAAA,CAAA,WAAA,GAAc,GAAQ,KAAA,GAAA,GAAM,GAAQ,CAAA,GAAA,GAAA;AACrD,EAAA,MAAM,QAAa,GAAA,CAAA,KAAA,GAAQ,GAAQ,KAAA,GAAA,GAAM,GAAQ,CAAA,GAAA,GAAA;AAEjD,EAAA,IAAI,YAAY,EAAI,EAAA;AAClB,IAAM,MAAA,aAAA,GAAgB,iBAAiB,QAAQ,CAAA;AAC/C,IAAwB,uBAAA,CAAA,SAAA,GAAY,UAAU,aAAa,CAAA,IAAA,CAAA;AAC3D,IAAA,sBAAA,CAAuB,SAAY,GAAA,iBAAA;AAAA,GAC9B,MAAA;AACL,IAAM,MAAA,aAAA,GAAgB,gBAAiB,CAAA,QAAA,EAAU,EAAE,CAAA;AACnD,IAAA,uBAAA,CAAwB,SAAY,GAAA,cAAA;AACpC,IAAuB,sBAAA,CAAA,SAAA,GAAY,UAAU,aAAa,CAAA,IAAA,CAAA;AAAA;AAE5D,EAAA,IAAI,UAAU,EAAI,EAAA;AAChB,IAAM,MAAA,aAAA,GAAgB,iBAAiB,MAAM,CAAA;AAC7C,IAA2B,0BAAA,CAAA,SAAA,GAAY,UAAU,aAAa,CAAA,IAAA,CAAA;AAC9D,IAAA,yBAAA,CAA0B,SAAY,GAAA,iBAAA;AAAA,GACjC,MAAA;AACL,IAAM,MAAA,aAAA,GAAgB,gBAAiB,CAAA,MAAA,EAAQ,EAAE,CAAA;AACjD,IAAA,0BAAA,CAA2B,SAAY,GAAA,cAAA;AACvC,IAA0B,yBAAA,CAAA,SAAA,GAAY,UAAU,aAAa,CAAA,IAAA,CAAA;AAAA;AAG/D,EACE,uBAAA,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACA,IAAK,EAAA,aAAA;AAAA,MACL,eAAe,EAAA,GAAA;AAAA,MACf,eAAe,EAAA,GAAA;AAAA,MACf,eAAA,EAAe,IAAK,CAAA,KAAA,CAAM,KAAK,CAAA;AAAA,MAC9B,GAAG,IAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,OAAO,CAAG,EAAA,CAAA;AAAA,wBACtC,IAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,YAAA,CAAa,MAAM,CAChC,EAAA,QAAA,EAAA;AAAA,UAAA,MAAA,GAAS,qBACP,GAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,YAAA,CAAa,oBAAoB,CAC/C,EAAA,QAAA,kBAAA,IAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,SAAW,EAAA,IAAA,CAAK,YAAa,CAAA,uBAAuB,CAAG,EAAA;AAAA,gBACrD,CAAC,YAAA,CAAa,kBAAkB,CAAC,GAAG,MAAU,IAAA;AAAA,eAC/C,CAAA;AAAA,cACD,KAAO,EAAA,0BAAA;AAAA,cAEP,QAAA,EAAA;AAAA,gCAAA,GAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,kBAAkB,CAAG,EAAA,CAAA;AAAA,gCACjD,GAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,YAAA,CAAa,cAAc,CAAG,EAAA;AAAA;AAAA;AAAA,WAElD,EAAA,CAAA;AAAA,0BAED,GAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,YAAA,CAAa,iBAAiB,CAC5C,EAAA,QAAA,kBAAA,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,aAAa,oBAAoB,CAAA;AAAA,cAC5C,KAAO,EAAA,uBAAA;AAAA,cAEP,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,YAAA,CAAa,KAAK,CAAG,EAAA;AAAA;AAAA,WAEzC,EAAA,CAAA;AAAA,UACC,SAAS,CACR,oBAAA,GAAA,CAAC,SAAI,SAAW,EAAA,YAAA,CAAa,mBAAmB,CAC9C,EAAA,QAAA,kBAAA,IAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,SAAW,EAAA,IAAA;AAAA,gBACT,aAAa,kBAAkB,CAAA;AAAA,gBAC/B,aAAa,sBAAsB;AAAA,eACrC;AAAA,cACA,KAAO,EAAA,yBAAA;AAAA,cAEP,QAAA,EAAA;AAAA,gCAAA,GAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,cAAc,CAAG,EAAA,CAAA;AAAA,gCAC7C,GAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,YAAA,CAAa,kBAAkB,CAAG,EAAA;AAAA;AAAA;AAAA,WAEtD,EAAA,CAAA;AAAA,0BAED,GAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,YAAA,CAAa,gBAAgB,CAC3C,EAAA,QAAA,kBAAA,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,aAAa,mBAAmB,CAAA;AAAA,cAC3C,KAAO,EAAA,sBAAA;AAAA,cAEP,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,YAAA,CAAa,KAAK,CAAG,EAAA;AAAA;AAAA,WAEzC,EAAA;AAAA,SACF,EAAA,CAAA;AAAA,QACC,CAAC,SAAA,oBACC,GAAA,CAAA,IAAA,EAAA,EAAK,SAAQ,IAAK,EAAA,SAAA,EAAW,YAAa,CAAA,eAAe,GACvD,QAAG,EAAA,CAAA,EAAA,IAAA,CAAK,KAAM,CAAA,QAAQ,CAAC,CAC1B,EAAA,CAAA,EAAA;AAAA;AAAA;AAAA,GAEJ;AAEJ,CAAC;;;;"}
+{"version":3,"file":"CircularProgress.js","sources":["../src/progress/CircularProgress/CircularProgress.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  type CSSProperties,\n  forwardRef,\n} from \"react\";\nimport { Text } from \"../../text\";\nimport { makePrefixer } from \"../../utils\";\n\nimport circularProgressCSS from \"./CircularProgress.css\";\n\nconst withBaseName = makePrefixer(\"saltCircularProgress\");\n\nconst getRotationAngle = (bar: number, shift = 0) => {\n  return -180 + ((bar - shift) / 50) * 180;\n};\n\nexport interface CircularProgressProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The value of the buffer indicator.\n   * Value between 0 and max.\n   */\n  bufferValue?: number;\n  /**\n   * Whether to hide the text label within the progress. Defaults to `false`.\n   */\n  hideLabel?: boolean;\n  /**\n   * The value of the max progress indicator.\n   * Default value is 100.\n   */\n  max?: number;\n  /**\n   * The value of the min progress indicator.\n   * Default value is 0.\n   */\n  min?: number;\n  /**\n   * The value of the progress indicator.\n   * Value between 0 and max.\n   */\n  value?: number;\n}\n\nexport const CircularProgress = forwardRef<\n  HTMLDivElement,\n  CircularProgressProps\n>(function CircularProgress(\n  {\n    className,\n    hideLabel = false,\n    max = 100,\n    min = 0,\n    value = 0,\n    bufferValue = 0,\n    ...rest\n  },\n  ref,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-circular-progress\",\n    css: circularProgressCSS,\n    window: targetWindow,\n  });\n\n  const bufferSubOverlayRightStyle: CSSProperties = {};\n  const bufferSubOverlayLeftStyle: CSSProperties = {};\n  const barSubOverlayRightStyle: CSSProperties = {};\n  const barSubOverlayLeftStyle: CSSProperties = {};\n\n  const buffer = ((bufferValue - min) / (max - min)) * 100;\n  const progress = ((value - min) / (max - min)) * 100;\n\n  if (progress <= 50) {\n    const rotationAngle = getRotationAngle(progress);\n    barSubOverlayRightStyle.transform = `rotate(${rotationAngle}deg)`;\n    barSubOverlayLeftStyle.transform = \"rotate(-180deg)\";\n  } else {\n    const rotationAngle = getRotationAngle(progress, 50);\n    barSubOverlayRightStyle.transform = \"rotate(0deg)\";\n    barSubOverlayLeftStyle.transform = `rotate(${rotationAngle}deg)`;\n  }\n  if (buffer <= 50) {\n    const rotationAngle = getRotationAngle(buffer);\n    bufferSubOverlayRightStyle.transform = `rotate(${rotationAngle}deg)`;\n    bufferSubOverlayLeftStyle.transform = \"rotate(-180deg)\";\n  } else {\n    const rotationAngle = getRotationAngle(buffer, 50);\n    bufferSubOverlayRightStyle.transform = \"rotate(0deg)\";\n    bufferSubOverlayLeftStyle.transform = `rotate(${rotationAngle}deg)`;\n  }\n\n  return (\n    <div\n      className={clsx(withBaseName(), className)}\n      ref={ref}\n      role=\"progressbar\"\n      aria-valuemax={max}\n      aria-valuemin={min}\n      aria-valuenow={Math.round(value)}\n      {...rest}\n    >\n      <div className={withBaseName(\"track\")} />\n      <div className={withBaseName(\"bars\")}>\n        {buffer > 0 && (\n          <div className={withBaseName(\"bufferOverlayRight\")}>\n            <div\n              className={clsx(withBaseName(\"bufferSubOverlayRight\"), {\n                [withBaseName(\"bufferSubOverlay\")]: buffer <= 50,\n              })}\n              style={bufferSubOverlayRightStyle}\n            >\n              <div className={withBaseName(\"bufferBackground\")} />\n              <div className={withBaseName(\"bufferBorder\")} />\n            </div>\n          </div>\n        )}\n        <div className={withBaseName(\"barOverlayRight\")}>\n          <div\n            className={withBaseName(\"barSubOverlayRight\")}\n            style={barSubOverlayRightStyle}\n          >\n            <div className={withBaseName(\"bar\")} />\n          </div>\n        </div>\n        {buffer > 0 && (\n          <div className={withBaseName(\"bufferOverlayLeft\")}>\n            <div\n              className={clsx(\n                withBaseName(\"bufferSubOverlay\"),\n                withBaseName(\"bufferSubOverlayLeft\"),\n              )}\n              style={bufferSubOverlayLeftStyle}\n            >\n              <div className={withBaseName(\"bufferBorder\")} />\n              <div className={withBaseName(\"bufferBackground\")} />\n            </div>\n          </div>\n        )}\n        <div className={withBaseName(\"barOverlayLeft\")}>\n          <div\n            className={withBaseName(\"barSubOverlayLeft\")}\n            style={barSubOverlayLeftStyle}\n          >\n            <div className={withBaseName(\"bar\")} />\n          </div>\n        </div>\n      </div>\n      {!hideLabel && (\n        <Text styleAs=\"h2\" className={withBaseName(\"progressLabel\")}>\n          {`${Math.round(progress)} %`}\n        </Text>\n      )}\n    </div>\n  );\n});\n"],"names":["CircularProgress","circularProgressCSS"],"mappings":"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"}

package/dist-es/progress/LinearProgress/LinearProgress.css.js

@@ -1,4 +1,4 @@
-var css_248z = ".saltLinearProgress {\n  align-items: center;\n  color: var(--salt-content-primary-foreground);\n  display: flex;\n  min-width: 400px;\n  font-size: var(--linearProgress-fontSize);\n  box-sizing: border-box;\n}\n\n.saltLinearProgress-barContainer {\n  background: none;\n  position: relative;\n  width: 100%;\n  overflow: hidden;\n  height: var(--salt-size-bar-strong);\n}\n\n.saltLinearProgress-bar,\n.saltLinearProgress-buffer {\n  position: absolute;\n  left: 0;\n  bottom: 0;\n  top: 0;\n  transition: transform 0.2s linear;\n  transform-origin: left;\n}\n\n.saltLinearProgress-buffer {\n  width: 0;\n  background: var(--salt-container-primary-background);\n  outline: solid var(--salt-size-border) var(--salt-accent-background);\n  z-index: var(--salt-zIndex-default);\n  outline-offset: calc(var(--salt-size-border) * -1);\n}\n\n.saltLinearProgress-bar {\n  width: 100%;\n  background: var(--salt-accent-background);\n  z-index: calc(var(--salt-zIndex-default) * 2);\n}\n\n.saltLinearProgress-track {\n  background: var(--salt-track-borderColor);\n  width: 100%;\n  height: var(--salt-size-bar);\n  position: absolute;\n  top: calc((var(--salt-size-bar-strong) - var(--salt-size-bar)) / 2);\n  right: 0;\n  transition: transform 0.2s linear;\n  transform-origin: left;\n}\n\n.saltLinearProgress-progressLabel {\n  color: inherit;\n  margin: 0;\n  white-space: nowrap;\n  padding-left: var(--salt-spacing-100);\n}\n\n.saltLinearProgress-indeterminate.saltLinearProgress-bar {\n  position: absolute;\n  left: 0px;\n  bottom: 0px;\n  top: 0px;\n  transform-origin: left center;\n  width: 66%;\n  animation: 1.8s ease-in-out infinite salt-indeterminate-progress-bar;\n}\n\n@keyframes salt-indeterminate-progress-bar {\n  0% {\n    transform: translateX(-100%);\n  }\n  60% {\n    /* 155% is slightly more than moving the bar off screen (with width of 66%) */\n    transform: translateX(155%);\n  }\n  100% {\n    transform: translateX(200%);\n  }\n}\n";
+var css_248z = ".saltLinearProgress {\n  align-items: center;\n  color: var(--salt-content-primary-foreground);\n  display: flex;\n  min-width: 400px;\n  font-size: var(--linearProgress-fontSize);\n  box-sizing: border-box;\n}\n\n.saltLinearProgress-barContainer {\n  background: none;\n  position: relative;\n  width: 100%;\n  overflow: hidden;\n  height: var(--salt-size-bar-strong);\n}\n\n.saltLinearProgress-bar,\n.saltLinearProgress-buffer {\n  position: absolute;\n  left: 0;\n  bottom: 0;\n  top: 0;\n  transition: transform 0.2s linear;\n  transform-origin: left;\n}\n\n.saltLinearProgress-buffer {\n  width: 0;\n  background: var(--salt-container-primary-background);\n  outline: solid var(--salt-size-fixed-100) var(--salt-accent-background);\n  z-index: var(--salt-zIndex-default);\n  outline-offset: calc(var(--salt-size-fixed-100) * -1);\n}\n\n.saltLinearProgress-bar {\n  width: 100%;\n  background: var(--salt-accent-background);\n  z-index: calc(var(--salt-zIndex-default) * 2);\n}\n\n.saltLinearProgress-track {\n  background: var(--salt-sentiment-neutral-track);\n  width: 100%;\n  height: var(--salt-size-bar);\n  position: absolute;\n  top: calc((var(--salt-size-bar-strong) - var(--salt-size-bar)) / 2);\n  right: 0;\n  transition: transform 0.2s linear;\n  transform-origin: left;\n}\n\n.saltLinearProgress-progressLabel {\n  color: inherit;\n  margin: 0;\n  white-space: nowrap;\n  padding-left: var(--salt-spacing-100);\n}\n\n.saltLinearProgress-indeterminate.saltLinearProgress-bar {\n  position: absolute;\n  left: 0px;\n  bottom: 0px;\n  top: 0px;\n  transform-origin: left center;\n  width: 66%;\n  animation: 1.8s ease-in-out infinite salt-indeterminate-progress-bar;\n}\n\n@keyframes salt-indeterminate-progress-bar {\n  0% {\n    transform: translateX(-100%);\n  }\n  60% {\n    /* 155% is slightly more than moving the bar off screen (with width of 66%) */\n    transform: translateX(155%);\n  }\n  100% {\n    transform: translateX(200%);\n  }\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=LinearProgress.css.js.map

package/dist-es/progress/LinearProgress/LinearProgress.js

@@ -3,11 +3,11 @@ import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
 import { clsx } from 'clsx';
 import { forwardRef } from 'react';
-import { Text } from '../../text/Text.js';
 import '../../text/Code.js';
 import '../../text/Display.js';
 import '../../text/Headings.js';
 import '../../text/Label.js';
+import { Text } from '../../text/Text.js';
 import '../../text/TextAction.js';
 import '../../text/TextNotation.js';
 import { makePrefixer } from '../../utils/makePrefixer.js';

package/dist-es/radio-button/RadioButton.css.js

@@ -1,4 +1,4 @@
-var css_248z = "/* Styles applied to RadioButton container */\n.saltRadioButton {\n  display: inline-flex;\n  gap: var(--salt-spacing-100);\n  cursor: var(--salt-selectable-cursor-hover);\n  position: relative;\n\n  font-size: var(--salt-text-fontSize);\n  line-height: var(--salt-text-lineHeight);\n  font-family: var(--salt-text-fontFamily);\n  font-weight: var(--salt-text-fontWeight);\n\n  --radioButton-icon-margin: calc((var(--salt-text-lineHeight) - var(--salt-size-selectable)) / 2);\n}\n\n/* Styles applied when RadioButton is disabled */\n.saltRadioButton-disabled {\n  color: var(--salt-content-primary-foreground-disabled);\n  cursor: var(--salt-selectable-cursor-disabled);\n}\n\n/* Styles applied to root component if `readOnly={true}` */\n.saltRadioButton-readOnly {\n  color: var(--salt-content-primary-foreground);\n  cursor: var(--salt-selectable-cursor-readonly);\n}\n\n/* Styles applied to input component */\n.saltRadioButton-input {\n  cursor: inherit;\n  position: absolute;\n  height: var(--salt-size-selectable);\n  opacity: 0;\n  padding: 0;\n  width: var(--salt-size-selectable);\n  z-index: var(--salt-zIndex-default);\n}\n\n.saltRadioButton-input,\n.saltRadioButtonIcon {\n  margin: var(--radioButton-icon-margin) 0;\n  box-sizing: border-box;\n}\n\n/* Styles applied to icon when :focus-visible */\n.saltRadioButton-input:focus-visible + .saltRadioButtonIcon {\n  outline: var(--saltRadioButton-outline, var(--salt-focused-outline));\n  outline-offset: var(--salt-focused-outlineOffset);\n  border-color: var(--salt-selectable-borderColor-hover);\n  color: var(--salt-selectable-foreground-hover);\n  clip-path: unset;\n}\n\n.saltRadioButton-input:focus-visible + .saltRadioButtonIcon-checked {\n  border-color: var(--salt-selectable-borderColor-selected);\n  color: var(--salt-selectable-foreground-selected);\n}\n\n.saltRadioButton-error .saltRadioButton-input:focus-visible + .saltRadioButtonIcon {\n  outline-color: var(--salt-status-error-foreground-decorative);\n  border-color: var(--salt-status-error-borderColor);\n  color: var(--salt-status-error-foreground-decorative);\n}\n\n.saltRadioButton-warning .saltRadioButton-input:focus-visible + .saltRadioButtonIcon {\n  outline-color: var(--salt-status-warning-foreground-decorative);\n  border-color: var(--salt-status-warning-borderColor);\n  color: var(--salt-status-warning-foreground-decorative);\n}\n";
+var css_248z = "/* Styles applied to RadioButton container */\n.saltRadioButton {\n  display: inline-flex;\n  gap: var(--salt-spacing-100);\n  cursor: var(--salt-cursor-hover);\n  position: relative;\n\n  font-size: var(--salt-text-fontSize);\n  line-height: var(--salt-text-lineHeight);\n  font-family: var(--salt-text-fontFamily);\n  font-weight: var(--salt-text-fontWeight);\n\n  --radioButton-icon-margin: calc((var(--salt-text-lineHeight) - var(--salt-size-selectable)) / 2);\n}\n\n/* Styles applied when RadioButton is disabled */\n.saltRadioButton-disabled {\n  color: var(--salt-content-primary-foreground-disabled);\n  cursor: var(--salt-cursor-disabled);\n}\n\n/* Styles applied to root component if `readOnly={true}` */\n.saltRadioButton-readOnly {\n  color: var(--salt-content-primary-foreground);\n  cursor: var(--salt-cursor-readonly);\n}\n\n/* Styles applied to input component */\n.saltRadioButton-input {\n  cursor: inherit;\n  position: absolute;\n  height: var(--salt-size-selectable);\n  opacity: 0;\n  padding: 0;\n  width: var(--salt-size-selectable);\n  z-index: var(--salt-zIndex-default);\n}\n\n.saltRadioButton-input,\n.saltRadioButtonIcon {\n  margin: var(--radioButton-icon-margin) 0;\n  box-sizing: border-box;\n}\n\n/* Styles applied to icon when :focus-visible */\n.saltRadioButton-input:focus-visible + .saltRadioButtonIcon {\n  outline: var(--saltRadioButton-outline, var(--salt-focused-outline));\n  outline-offset: var(--salt-focused-outlineOffset);\n  border-color: var(--salt-selectable-borderColor-hover);\n  color: var(--salt-selectable-foreground-hover);\n  clip-path: unset;\n}\n\n.saltRadioButton-input:focus-visible + .saltRadioButtonIcon-checked {\n  border-color: var(--salt-selectable-borderColor-selected);\n  color: var(--salt-selectable-foreground-selected);\n}\n\n.saltRadioButton-error .saltRadioButton-input:focus-visible + .saltRadioButtonIcon {\n  outline-color: var(--salt-status-error-foreground-decorative);\n  border-color: var(--salt-status-error-borderColor);\n  color: var(--salt-status-error-foreground-decorative);\n}\n\n.saltRadioButton-warning .saltRadioButton-input:focus-visible + .saltRadioButtonIcon {\n  outline-color: var(--salt-status-warning-foreground-decorative);\n  border-color: var(--salt-status-warning-borderColor);\n  color: var(--salt-status-warning-foreground-decorative);\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=RadioButton.css.js.map

package/dist-es/radio-button/RadioButton.js

@@ -11,9 +11,9 @@ import '../utils/useFloatingUI/useFloatingUI.js';
 import '../utils/useId.js';
 import '../salt-provider/SaltProvider.js';
 import '../viewport/ViewportProvider.js';
-import { RadioButtonIcon } from './RadioButtonIcon.js';
 import { useRadioGroup } from './internal/useRadioGroup.js';
 import css_248z from './RadioButton.css.js';
+import { RadioButtonIcon } from './RadioButtonIcon.js';
 
 const withBaseName = makePrefixer("saltRadioButton");
 const RadioButton = forwardRef(

package/dist-es/radio-button/RadioButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioButton.js","sources":["../src/radio-button/RadioButton.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ChangeEventHandler,\n  type ComponentPropsWithoutRef,\n  type FocusEventHandler,\n  type InputHTMLAttributes,\n  type ReactNode,\n  type Ref,\n  forwardRef,\n} from \"react\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport type { AdornmentValidationStatus } from \"../status-adornment\";\nimport type { DataAttributes } from \"../types\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { RadioButtonIcon } from \"./RadioButtonIcon\";\nimport { useRadioGroup } from \"./internal/useRadioGroup\";\n\nimport radioButtonCss from \"./RadioButton.css\";\n\nconst withBaseName = makePrefixer(\"saltRadioButton\");\n\nexport interface RadioButtonProps\n  extends Omit<\n    ComponentPropsWithoutRef<\"label\">,\n    \"onChange\" | \"onBlur\" | \"onFocus\"\n  > {\n  /**\n   * Set the default selected radio button in the group\n   */\n  checked?: boolean;\n  /**\n   * Set the disabled state\n   */\n  disabled?: boolean;\n  /**\n   * **Deprecated**: Use validationStatus instead\n   * Set the error state\n   */\n  error?: boolean;\n  /**\n   * Props to be passed to the radio input\n   */\n  inputProps?: Partial<InputHTMLAttributes<HTMLInputElement>> & DataAttributes;\n  /**\n   * Used to access the hidden `<input>` element.\n   */\n  inputRef?: Ref<HTMLInputElement>;\n  /**\n   * The label to be shown next to the radio icon\n   */\n  label?: ReactNode;\n  /**\n   * Name of the radio group\n   */\n  name?: string;\n  /**\n   * Callback for blur event\n   */\n  onBlur?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * Callback for change event\n   */\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n  /**\n   * Callback for focus event\n   */\n  onFocus?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * Set the read only state.\n   * **Note**: Setting a standalone radio button as read-only is not accessible. The whole radio buttton group should be set as read-only instead.\n   */\n  readOnly?: boolean;\n  /**\n   * Value of radio button\n   */\n  value?: string;\n  /**\n   * Validation status, one of \"warning\" | \"error\" | \"success\"\n   *\n   * RadioButton has styling variants for \"error\" and \"warning\".\n   * No visual styling will be applied on \"success\" variant.\n   */\n  validationStatus?: AdornmentValidationStatus;\n}\n\nexport const RadioButton = forwardRef<HTMLLabelElement, RadioButtonProps>(\n  function RadioButton(props, ref) {\n    const {\n      checked: checkedProp,\n      className,\n      disabled: disabledProp,\n      error,\n      inputProps = {},\n      inputRef,\n      label,\n      name: nameProp,\n      onFocus,\n      onBlur,\n      onChange,\n      readOnly: readOnlyProp,\n      value,\n      validationStatus: validationStatusProp,\n      ...rest\n    } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-radio-button\",\n      css: radioButtonCss,\n      window: targetWindow,\n    });\n\n    const {\n      a11yProps: formFieldA11yProps,\n      disabled: formFieldDisabled,\n      readOnly: formFieldReadOnly,\n      validationStatus: formFieldValidationStatus,\n    } = useFormFieldProps();\n\n    const radioGroup = useRadioGroup();\n\n    const {\n      \"aria-describedby\": inputDescribedBy,\n      \"aria-labelledby\": inputLabelledBy,\n      className: inputClassName,\n      onChange: inputOnChange,\n      ...restInputProps\n    } = inputProps;\n\n    const disabled = radioGroup?.disabled || formFieldDisabled || disabledProp;\n    const readOnly = radioGroup?.readOnly || formFieldReadOnly || readOnlyProp;\n    const validationStatus = !disabled\n      ? (radioGroup?.validationStatus ??\n        formFieldValidationStatus ??\n        validationStatusProp)\n      : undefined;\n\n    const radioGroupChecked =\n      checkedProp ??\n      (radioGroup && value ? radioGroup.value === value : checkedProp);\n    const name = nameProp ?? radioGroup?.name;\n\n    const [checked, setCheckedState] = useControlled({\n      controlled: radioGroupChecked,\n      default: Boolean(checkedProp),\n      name: \"RadioBase\",\n      state: \"checked\",\n    });\n\n    const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n      if (readOnly) return;\n\n      const newChecked = event.target.checked;\n      setCheckedState(newChecked);\n\n      onChange?.(event);\n      inputOnChange?.(event);\n      radioGroup?.onChange?.(event);\n    };\n\n    return (\n      <label\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"disabled\")]: disabled,\n            [withBaseName(\"readOnly\")]: readOnly,\n            [withBaseName(\"error\")]: error /* **Deprecated** */,\n            [withBaseName(validationStatus || \"\")]: validationStatus,\n          },\n          className,\n        )}\n        ref={ref}\n        {...rest}\n      >\n        <input\n          aria-describedby={\n            clsx(\n              radioGroup === undefined\n                ? formFieldA11yProps?.[\"aria-describedby\"]\n                : undefined,\n              inputDescribedBy,\n            ) || undefined\n          }\n          aria-labelledby={\n            clsx(\n              radioGroup === undefined\n                ? formFieldA11yProps?.[\"aria-labelledby\"]\n                : undefined,\n              inputLabelledBy,\n            ) || undefined\n          }\n          className={clsx(withBaseName(\"input\"), inputClassName)}\n          checked={checked}\n          disabled={disabled}\n          readOnly={readOnly}\n          name={name}\n          value={value}\n          onBlur={onBlur}\n          onChange={handleChange}\n          onFocus={onFocus}\n          type=\"radio\"\n          ref={inputRef}\n          {...restInputProps}\n        />\n        <RadioButtonIcon\n          checked={checked}\n          disabled={disabled}\n          readOnly={readOnly}\n          validationStatus={validationStatus}\n          error={error}\n        />\n        {label}\n      </label>\n    );\n  },\n);\n"],"names":["RadioButton","radioButtonCss"],"mappings":"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"}
+{"version":3,"file":"RadioButton.js","sources":["../src/radio-button/RadioButton.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ChangeEventHandler,\n  type ComponentPropsWithoutRef,\n  type FocusEventHandler,\n  forwardRef,\n  type InputHTMLAttributes,\n  type ReactNode,\n  type Ref,\n} from \"react\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport type { AdornmentValidationStatus } from \"../status-adornment\";\nimport type { DataAttributes } from \"../types\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { useRadioGroup } from \"./internal/useRadioGroup\";\nimport radioButtonCss from \"./RadioButton.css\";\nimport { RadioButtonIcon } from \"./RadioButtonIcon\";\n\nconst withBaseName = makePrefixer(\"saltRadioButton\");\n\nexport interface RadioButtonProps\n  extends Omit<\n    ComponentPropsWithoutRef<\"label\">,\n    \"onChange\" | \"onBlur\" | \"onFocus\"\n  > {\n  /**\n   * Set the default selected radio button in the group\n   */\n  checked?: boolean;\n  /**\n   * Set the disabled state\n   */\n  disabled?: boolean;\n  /**\n   * **Deprecated**: Use validationStatus instead\n   * Set the error state\n   */\n  error?: boolean;\n  /**\n   * Props to be passed to the radio input\n   */\n  inputProps?: Partial<InputHTMLAttributes<HTMLInputElement>> & DataAttributes;\n  /**\n   * Used to access the hidden `<input>` element.\n   */\n  inputRef?: Ref<HTMLInputElement>;\n  /**\n   * The label to be shown next to the radio icon\n   */\n  label?: ReactNode;\n  /**\n   * Name of the radio group\n   */\n  name?: string;\n  /**\n   * Callback for blur event\n   */\n  onBlur?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * Callback for change event\n   */\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n  /**\n   * Callback for focus event\n   */\n  onFocus?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * Set the read only state.\n   * **Note**: Setting a standalone radio button as read-only is not accessible. The whole radio buttton group should be set as read-only instead.\n   */\n  readOnly?: boolean;\n  /**\n   * Value of radio button\n   */\n  value?: string;\n  /**\n   * Validation status, one of \"warning\" | \"error\" | \"success\"\n   *\n   * RadioButton has styling variants for \"error\" and \"warning\".\n   * No visual styling will be applied on \"success\" variant.\n   */\n  validationStatus?: AdornmentValidationStatus;\n}\n\nexport const RadioButton = forwardRef<HTMLLabelElement, RadioButtonProps>(\n  function RadioButton(props, ref) {\n    const {\n      checked: checkedProp,\n      className,\n      disabled: disabledProp,\n      error,\n      inputProps = {},\n      inputRef,\n      label,\n      name: nameProp,\n      onFocus,\n      onBlur,\n      onChange,\n      readOnly: readOnlyProp,\n      value,\n      validationStatus: validationStatusProp,\n      ...rest\n    } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-radio-button\",\n      css: radioButtonCss,\n      window: targetWindow,\n    });\n\n    const {\n      a11yProps: formFieldA11yProps,\n      disabled: formFieldDisabled,\n      readOnly: formFieldReadOnly,\n      validationStatus: formFieldValidationStatus,\n    } = useFormFieldProps();\n\n    const radioGroup = useRadioGroup();\n\n    const {\n      \"aria-describedby\": inputDescribedBy,\n      \"aria-labelledby\": inputLabelledBy,\n      className: inputClassName,\n      onChange: inputOnChange,\n      ...restInputProps\n    } = inputProps;\n\n    const disabled = radioGroup?.disabled || formFieldDisabled || disabledProp;\n    const readOnly = radioGroup?.readOnly || formFieldReadOnly || readOnlyProp;\n    const validationStatus = !disabled\n      ? (radioGroup?.validationStatus ??\n        formFieldValidationStatus ??\n        validationStatusProp)\n      : undefined;\n\n    const radioGroupChecked =\n      checkedProp ??\n      (radioGroup && value ? radioGroup.value === value : checkedProp);\n    const name = nameProp ?? radioGroup?.name;\n\n    const [checked, setCheckedState] = useControlled({\n      controlled: radioGroupChecked,\n      default: Boolean(checkedProp),\n      name: \"RadioBase\",\n      state: \"checked\",\n    });\n\n    const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n      if (readOnly) return;\n\n      const newChecked = event.target.checked;\n      setCheckedState(newChecked);\n\n      onChange?.(event);\n      inputOnChange?.(event);\n      radioGroup?.onChange?.(event);\n    };\n\n    return (\n      <label\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"disabled\")]: disabled,\n            [withBaseName(\"readOnly\")]: readOnly,\n            [withBaseName(\"error\")]: error /* **Deprecated** */,\n            [withBaseName(validationStatus || \"\")]: validationStatus,\n          },\n          className,\n        )}\n        ref={ref}\n        {...rest}\n      >\n        <input\n          aria-describedby={\n            clsx(\n              radioGroup === undefined\n                ? formFieldA11yProps?.[\"aria-describedby\"]\n                : undefined,\n              inputDescribedBy,\n            ) || undefined\n          }\n          aria-labelledby={\n            clsx(\n              radioGroup === undefined\n                ? formFieldA11yProps?.[\"aria-labelledby\"]\n                : undefined,\n              inputLabelledBy,\n            ) || undefined\n          }\n          className={clsx(withBaseName(\"input\"), inputClassName)}\n          checked={checked}\n          disabled={disabled}\n          readOnly={readOnly}\n          name={name}\n          value={value}\n          onBlur={onBlur}\n          onChange={handleChange}\n          onFocus={onFocus}\n          type=\"radio\"\n          ref={inputRef}\n          {...restInputProps}\n        />\n        <RadioButtonIcon\n          checked={checked}\n          disabled={disabled}\n          readOnly={readOnly}\n          validationStatus={validationStatus}\n          error={error}\n        />\n        {label}\n      </label>\n    );\n  },\n);\n"],"names":["RadioButton","radioButtonCss"],"mappings":"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"}

package/dist-es/radio-button/RadioButtonGroup.js

@@ -1,6 +1,10 @@
 import { jsx } from 'react/jsx-runtime';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
 import { clsx } from 'clsx';
 import { forwardRef } from 'react';
+import '../form-field-context/FormFieldContext.js';
+import { useFormFieldProps } from '../form-field-context/useFormFieldProps.js';
 import { makePrefixer } from '../utils/makePrefixer.js';
 import { useControlled } from '../utils/useControlled.js';
 import '../utils/useFloatingUI/useFloatingUI.js';
@@ -8,10 +12,6 @@ import { useId } from '../utils/useId.js';
 import '../salt-provider/SaltProvider.js';
 import '../viewport/ViewportProvider.js';
 import { RadioGroupContext } from './internal/RadioGroupContext.js';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
-import '../form-field-context/FormFieldContext.js';
-import { useFormFieldProps } from '../form-field-context/useFormFieldProps.js';
 import css_248z from './RadioButtonGroup.css.js';
 
 const withBaseName = makePrefixer("saltRadioButtonGroup");

package/dist-es/radio-button/RadioButtonGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioButtonGroup.js","sources":["../src/radio-button/RadioButtonGroup.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  type ChangeEventHandler,\n  type ComponentPropsWithoutRef,\n  forwardRef,\n} from \"react\";\nimport { makePrefixer, useControlled, useId } from \"../utils\";\nimport { RadioGroupContext } from \"./internal/RadioGroupContext\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport radioButtonGroupCss from \"./RadioButtonGroup.css\";\n\nconst withBaseName = makePrefixer(\"saltRadioButtonGroup\");\n\nexport interface RadioButtonGroupProps\n  extends Omit<ComponentPropsWithoutRef<\"fieldset\">, \"onChange\"> {\n  /**\n   * Set the selected value when initialized.\n   */\n  defaultValue?: string;\n  /**\n   * Set the group direction.\n   */\n  direction?: \"horizontal\" | \"vertical\";\n  /**\n   * Disable the RadioButton group\n   */\n  disabled?: boolean;\n  /**\n   * Only for horizontal direction. When `true` the text in radio button label will wrap to fit within the container. Otherwise the radio buttons will wrap onto the next line.\n   */\n  wrap?: boolean;\n  /**\n   * The name to be set on each radio button within the group. If not set, then one will be generated for you.\n   */\n  name?: string;\n  /**\n   * Callback for change event.\n   */\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n  /**\n   * Set the RadioButton group to read only.\n   */\n  readOnly?: boolean;\n  /**\n   * The value of the radio group, required for a controlled component.\n   */\n  value?: string;\n  /**\n   * Validation status.\n   */\n  validationStatus?: \"error\" | \"warning\";\n}\n\nexport const RadioButtonGroup = forwardRef<\n  HTMLFieldSetElement,\n  RadioButtonGroupProps\n>(function RadioButtonGroup(props, ref) {\n  const {\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    children,\n    className,\n    defaultValue,\n    direction = \"vertical\",\n    disabled: disabledProp,\n    wrap = true,\n    name: nameProp,\n    onChange,\n    readOnly: readOnlyProp,\n    value: valueProp,\n    validationStatus: validationStatusProp,\n    ...rest\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-radio-button-group\",\n    css: radioButtonGroupCss,\n    window: targetWindow,\n  });\n\n  const {\n    a11yProps,\n    disabled: formFieldDisabled,\n    readOnly: formFieldReadOnly,\n    validationStatus: formFieldValidationStatus,\n  } = useFormFieldProps();\n\n  const disabled = formFieldDisabled || disabledProp;\n  const readOnly = formFieldReadOnly || readOnlyProp;\n  const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n\n  const [value, setStateValue] = useControlled({\n    controlled: valueProp,\n    default: defaultValue,\n    state: \"value\",\n    name: \"RadioButtonGroup\",\n  });\n\n  const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n    setStateValue(event.target.value);\n    onChange?.(event);\n  };\n\n  const name = useId(nameProp);\n\n  return (\n    <fieldset\n      role=\"radiogroup\"\n      aria-readonly={readOnly}\n      aria-labelledby={\n        clsx(a11yProps?.[\"aria-labelledby\"], ariaLabelledBy) || undefined\n      }\n      aria-describedby={\n        clsx(a11yProps?.[\"aria-describedby\"], ariaDescribedBy) || undefined\n      }\n      className={clsx(\n        withBaseName(),\n        withBaseName(direction),\n        {\n          [withBaseName(\"noWrap\")]: !wrap,\n        },\n        className,\n      )}\n      data-testid=\"radio-button-group\"\n      ref={ref}\n      {...rest}\n    >\n      <RadioGroupContext.Provider\n        value={{\n          disabled,\n          name,\n          onChange: handleChange,\n          readOnly,\n          validationStatus,\n          value,\n        }}\n      >\n        {children}\n      </RadioGroupContext.Provider>\n    </fieldset>\n  );\n});\n"],"names":["RadioButtonGroup","radioButtonGroupCss"],"mappings":";;;;;;;;;;;;;;;;AAcA,MAAM,YAAA,GAAe,aAAa,sBAAsB,CAAA;AA0CjD,MAAM,gBAAmB,GAAA,UAAA,CAG9B,SAASA,iBAAAA,CAAiB,OAAO,GAAK,EAAA;AACtC,EAAM,MAAA;AAAA,IACJ,iBAAmB,EAAA,cAAA;AAAA,IACnB,kBAAoB,EAAA,eAAA;AAAA,IACpB,QAAA;AAAA,IACA,SAAA;AAAA,IACA,YAAA;AAAA,IACA,SAAY,GAAA,UAAA;AAAA,IACZ,QAAU,EAAA,YAAA;AAAA,IACV,IAAO,GAAA,IAAA;AAAA,IACP,IAAM,EAAA,QAAA;AAAA,IACN,QAAA;AAAA,IACA,QAAU,EAAA,YAAA;AAAA,IACV,KAAO,EAAA,SAAA;AAAA,IACP,gBAAkB,EAAA,oBAAA;AAAA,IAClB,GAAG;AAAA,GACD,GAAA,KAAA;AAEJ,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,yBAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA;AAAA,IACJ,SAAA;AAAA,IACA,QAAU,EAAA,iBAAA;AAAA,IACV,QAAU,EAAA,iBAAA;AAAA,IACV,gBAAkB,EAAA;AAAA,MAChB,iBAAkB,EAAA;AAEtB,EAAA,MAAM,WAAW,iBAAqB,IAAA,YAAA;AACtC,EAAA,MAAM,WAAW,iBAAqB,IAAA,YAAA;AACtC,EAAA,MAAM,mBAAmB,yBAA6B,IAAA,oBAAA;AAEtD,EAAA,MAAM,CAAC,KAAA,EAAO,aAAa,CAAA,GAAI,aAAc,CAAA;AAAA,IAC3C,UAAY,EAAA,SAAA;AAAA,IACZ,OAAS,EAAA,YAAA;AAAA,IACT,KAAO,EAAA,OAAA;AAAA,IACP,IAAM,EAAA;AAAA,GACP,CAAA;AAED,EAAM,MAAA,YAAA,GAAqD,CAAC,KAAU,KAAA;AACpE,IAAc,aAAA,CAAA,KAAA,CAAM,OAAO,KAAK,CAAA;AAChC,IAAW,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAA,KAAA,CAAA;AAAA,GACb;AAEA,EAAM,MAAA,IAAA,GAAO,MAAM,QAAQ,CAAA;AAE3B,EACE,uBAAA,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,IAAK,EAAA,YAAA;AAAA,MACL,eAAe,EAAA,QAAA;AAAA,MACf,iBACE,EAAA,IAAA,CAAK,SAAY,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAA,iBAAA,CAAA,EAAoB,cAAc,CAAK,IAAA,MAAA;AAAA,MAE1D,kBACE,EAAA,IAAA,CAAK,SAAY,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAA,kBAAA,CAAA,EAAqB,eAAe,CAAK,IAAA,MAAA;AAAA,MAE5D,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,aAAa,SAAS,CAAA;AAAA,QACtB;AAAA,UACE,CAAC,YAAA,CAAa,QAAQ,CAAC,GAAG,CAAC;AAAA,SAC7B;AAAA,QACA;AAAA,OACF;AAAA,MACA,aAAY,EAAA,oBAAA;AAAA,MACZ,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEJ,QAAA,kBAAA,GAAA;AAAA,QAAC,iBAAkB,CAAA,QAAA;AAAA,QAAlB;AAAA,UACC,KAAO,EAAA;AAAA,YACL,QAAA;AAAA,YACA,IAAA;AAAA,YACA,QAAU,EAAA,YAAA;AAAA,YACV,QAAA;AAAA,YACA,gBAAA;AAAA,YACA;AAAA,WACF;AAAA,UAEC;AAAA;AAAA;AACH;AAAA,GACF;AAEJ,CAAC;;;;"}
+{"version":3,"file":"RadioButtonGroup.js","sources":["../src/radio-button/RadioButtonGroup.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ChangeEventHandler,\n  type ComponentPropsWithoutRef,\n  forwardRef,\n} from \"react\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { makePrefixer, useControlled, useId } from \"../utils\";\nimport { RadioGroupContext } from \"./internal/RadioGroupContext\";\nimport radioButtonGroupCss from \"./RadioButtonGroup.css\";\n\nconst withBaseName = makePrefixer(\"saltRadioButtonGroup\");\n\nexport interface RadioButtonGroupProps\n  extends Omit<ComponentPropsWithoutRef<\"fieldset\">, \"onChange\"> {\n  /**\n   * Set the selected value when initialized.\n   */\n  defaultValue?: string;\n  /**\n   * Set the group direction.\n   */\n  direction?: \"horizontal\" | \"vertical\";\n  /**\n   * Disable the RadioButton group\n   */\n  disabled?: boolean;\n  /**\n   * Only for horizontal direction. When `true` the text in radio button label will wrap to fit within the container. Otherwise the radio buttons will wrap onto the next line.\n   */\n  wrap?: boolean;\n  /**\n   * The name to be set on each radio button within the group. If not set, then one will be generated for you.\n   */\n  name?: string;\n  /**\n   * Callback for change event.\n   */\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n  /**\n   * Set the RadioButton group to read only.\n   */\n  readOnly?: boolean;\n  /**\n   * The value of the radio group, required for a controlled component.\n   */\n  value?: string;\n  /**\n   * Validation status.\n   */\n  validationStatus?: \"error\" | \"warning\";\n}\n\nexport const RadioButtonGroup = forwardRef<\n  HTMLFieldSetElement,\n  RadioButtonGroupProps\n>(function RadioButtonGroup(props, ref) {\n  const {\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    children,\n    className,\n    defaultValue,\n    direction = \"vertical\",\n    disabled: disabledProp,\n    wrap = true,\n    name: nameProp,\n    onChange,\n    readOnly: readOnlyProp,\n    value: valueProp,\n    validationStatus: validationStatusProp,\n    ...rest\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-radio-button-group\",\n    css: radioButtonGroupCss,\n    window: targetWindow,\n  });\n\n  const {\n    a11yProps,\n    disabled: formFieldDisabled,\n    readOnly: formFieldReadOnly,\n    validationStatus: formFieldValidationStatus,\n  } = useFormFieldProps();\n\n  const disabled = formFieldDisabled || disabledProp;\n  const readOnly = formFieldReadOnly || readOnlyProp;\n  const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n\n  const [value, setStateValue] = useControlled({\n    controlled: valueProp,\n    default: defaultValue,\n    state: \"value\",\n    name: \"RadioButtonGroup\",\n  });\n\n  const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n    setStateValue(event.target.value);\n    onChange?.(event);\n  };\n\n  const name = useId(nameProp);\n\n  return (\n    <fieldset\n      role=\"radiogroup\"\n      aria-readonly={readOnly}\n      aria-labelledby={\n        clsx(a11yProps?.[\"aria-labelledby\"], ariaLabelledBy) || undefined\n      }\n      aria-describedby={\n        clsx(a11yProps?.[\"aria-describedby\"], ariaDescribedBy) || undefined\n      }\n      className={clsx(\n        withBaseName(),\n        withBaseName(direction),\n        {\n          [withBaseName(\"noWrap\")]: !wrap,\n        },\n        className,\n      )}\n      data-testid=\"radio-button-group\"\n      ref={ref}\n      {...rest}\n    >\n      <RadioGroupContext.Provider\n        value={{\n          disabled,\n          name,\n          onChange: handleChange,\n          readOnly,\n          validationStatus,\n          value,\n        }}\n      >\n        {children}\n      </RadioGroupContext.Provider>\n    </fieldset>\n  );\n});\n"],"names":["RadioButtonGroup","radioButtonGroupCss"],"mappings":";;;;;;;;;;;;;;;;AAaA,MAAM,YAAA,GAAe,aAAa,sBAAsB,CAAA;AA0CjD,MAAM,gBAAmB,GAAA,UAAA,CAG9B,SAASA,iBAAAA,CAAiB,OAAO,GAAK,EAAA;AACtC,EAAM,MAAA;AAAA,IACJ,iBAAmB,EAAA,cAAA;AAAA,IACnB,kBAAoB,EAAA,eAAA;AAAA,IACpB,QAAA;AAAA,IACA,SAAA;AAAA,IACA,YAAA;AAAA,IACA,SAAY,GAAA,UAAA;AAAA,IACZ,QAAU,EAAA,YAAA;AAAA,IACV,IAAO,GAAA,IAAA;AAAA,IACP,IAAM,EAAA,QAAA;AAAA,IACN,QAAA;AAAA,IACA,QAAU,EAAA,YAAA;AAAA,IACV,KAAO,EAAA,SAAA;AAAA,IACP,gBAAkB,EAAA,oBAAA;AAAA,IAClB,GAAG;AAAA,GACD,GAAA,KAAA;AAEJ,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,yBAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA;AAAA,IACJ,SAAA;AAAA,IACA,QAAU,EAAA,iBAAA;AAAA,IACV,QAAU,EAAA,iBAAA;AAAA,IACV,gBAAkB,EAAA;AAAA,MAChB,iBAAkB,EAAA;AAEtB,EAAA,MAAM,WAAW,iBAAqB,IAAA,YAAA;AACtC,EAAA,MAAM,WAAW,iBAAqB,IAAA,YAAA;AACtC,EAAA,MAAM,mBAAmB,yBAA6B,IAAA,oBAAA;AAEtD,EAAA,MAAM,CAAC,KAAA,EAAO,aAAa,CAAA,GAAI,aAAc,CAAA;AAAA,IAC3C,UAAY,EAAA,SAAA;AAAA,IACZ,OAAS,EAAA,YAAA;AAAA,IACT,KAAO,EAAA,OAAA;AAAA,IACP,IAAM,EAAA;AAAA,GACP,CAAA;AAED,EAAM,MAAA,YAAA,GAAqD,CAAC,KAAU,KAAA;AACpE,IAAc,aAAA,CAAA,KAAA,CAAM,OAAO,KAAK,CAAA;AAChC,IAAW,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAA,KAAA,CAAA;AAAA,GACb;AAEA,EAAM,MAAA,IAAA,GAAO,MAAM,QAAQ,CAAA;AAE3B,EACE,uBAAA,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,IAAK,EAAA,YAAA;AAAA,MACL,eAAe,EAAA,QAAA;AAAA,MACf,iBACE,EAAA,IAAA,CAAK,SAAY,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAA,iBAAA,CAAA,EAAoB,cAAc,CAAK,IAAA,MAAA;AAAA,MAE1D,kBACE,EAAA,IAAA,CAAK,SAAY,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAA,kBAAA,CAAA,EAAqB,eAAe,CAAK,IAAA,MAAA;AAAA,MAE5D,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,aAAa,SAAS,CAAA;AAAA,QACtB;AAAA,UACE,CAAC,YAAA,CAAa,QAAQ,CAAC,GAAG,CAAC;AAAA,SAC7B;AAAA,QACA;AAAA,OACF;AAAA,MACA,aAAY,EAAA,oBAAA;AAAA,MACZ,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEJ,QAAA,kBAAA,GAAA;AAAA,QAAC,iBAAkB,CAAA,QAAA;AAAA,QAAlB;AAAA,UACC,KAAO,EAAA;AAAA,YACL,QAAA;AAAA,YACA,IAAA;AAAA,YACA,QAAU,EAAA,YAAA;AAAA,YACV,QAAA;AAAA,YACA,gBAAA;AAAA,YACA;AAAA,WACF;AAAA,UAEC;AAAA;AAAA;AACH;AAAA,GACF;AAEJ,CAAC;;;;"}

package/dist-es/radio-button/RadioButtonIcon.css.js

@@ -1,4 +1,4 @@
-var css_248z = "/* Styles applied to radio button icon */\n.saltRadioButtonIcon {\n  --radioButton-size: var(--salt-size-selectable);\n  width: var(--radioButton-size);\n  height: var(--radioButton-size);\n  min-width: var(--radioButton-size);\n  min-height: var(--radioButton-size);\n  border-radius: 50%;\n  position: relative;\n  border: var(--salt-size-border) var(--salt-selectable-borderStyle) var(--salt-selectable-borderColor);\n  color: var(--salt-selectable-foreground);\n  background: var(--salt-container-primary-background);\n  --saltIcon-size: 100%;\n  display: flex;\n  /* Using overflow:hidden here causes a thin white line */\n  clip-path: border-box;\n  box-sizing: border-box;\n}\n\n.saltRadioButton:hover .saltRadioButtonIcon {\n  border-color: var(--salt-selectable-borderColor-hover);\n  color: var(--salt-selectable-foreground-hover);\n}\n\n.saltRadioButtonIcon-checked,\n.saltRadioButton:hover .saltRadioButtonIcon-checked {\n  border-color: var(--salt-selectable-borderColor-selected);\n  color: var(--salt-selectable-foreground-selected);\n}\n\n.saltRadioButtonIcon-disabled,\n.saltRadioButton:hover .saltRadioButtonIcon-disabled {\n  border-color: var(--salt-selectable-borderColor-disabled);\n  background: var(--salt-container-primary-background-disabled);\n  color: var(--salt-selectable-foreground-disabled);\n}\n\n.saltRadioButtonIcon-checked.saltRadioButtonIcon-disabled,\n.saltRadioButton:hover .saltRadioButtonIcon-checked.saltRadioButtonIcon-disabled {\n  border-color: var(--salt-selectable-borderColor-selectedDisabled);\n  color: var(--salt-selectable-foreground-selectedDisabled);\n}\n\n.saltRadioButtonIcon-error,\n.saltRadioButton:hover .saltRadioButtonIcon-error {\n  color: var(--salt-status-error-foreground-decorative);\n  border-color: var(--salt-status-error-borderColor);\n  outline-color: var(--salt-status-error-foreground-decorative);\n}\n\n.saltRadioButtonIcon-warning,\n.saltRadioButton:hover .saltRadioButtonIcon-warning {\n  color: var(--salt-status-warning-foreground-decorative);\n  border-color: var(--salt-status-warning-borderColor);\n  outline-color: var(--salt-status-warning-foreground-decorative);\n}\n\n.saltRadioButtonIcon-readOnly,\n.saltRadioButton:hover .saltRadioButtonIcon-readOnly {\n  border-color: var(--salt-selectable-borderColor-readonly);\n  color: var(--salt-content-primary-foreground);\n}\n\n.saltRadioButtonIcon > svg {\n  position: absolute;\n  /* Ensure a gap doesn't appear when device scaling is used */\n  transform: scale(1.01);\n}\n";
+var css_248z = "/* Styles applied to radio button icon */\n.saltRadioButtonIcon {\n  --radioButton-size: var(--salt-size-selectable);\n  width: var(--radioButton-size);\n  height: var(--radioButton-size);\n  min-width: var(--radioButton-size);\n  min-height: var(--radioButton-size);\n  border-radius: 50%;\n  position: relative;\n  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-borderColor);\n  color: var(--salt-selectable-foreground);\n  background: var(--salt-container-primary-background);\n  --saltIcon-size: 100%;\n  display: flex;\n  /* Using overflow:hidden here causes a thin white line */\n  clip-path: border-box;\n  box-sizing: border-box;\n}\n\n.saltRadioButton:hover .saltRadioButtonIcon {\n  border-color: var(--salt-selectable-borderColor-hover);\n  color: var(--salt-selectable-foreground-hover);\n}\n\n.saltRadioButtonIcon-checked,\n.saltRadioButton:hover .saltRadioButtonIcon-checked {\n  border-color: var(--salt-selectable-borderColor-selected);\n  color: var(--salt-selectable-foreground-selected);\n}\n\n.saltRadioButtonIcon-disabled,\n.saltRadioButton:hover .saltRadioButtonIcon-disabled {\n  border-color: var(--salt-selectable-borderColor-disabled);\n  background: var(--salt-container-primary-background-disabled);\n  color: var(--salt-selectable-foreground-disabled);\n}\n\n.saltRadioButtonIcon-checked.saltRadioButtonIcon-disabled,\n.saltRadioButton:hover .saltRadioButtonIcon-checked.saltRadioButtonIcon-disabled {\n  border-color: var(--salt-selectable-borderColor-selectedDisabled);\n  color: var(--salt-selectable-foreground-selectedDisabled);\n}\n\n.saltRadioButtonIcon-error,\n.saltRadioButton:hover .saltRadioButtonIcon-error {\n  color: var(--salt-status-error-foreground-decorative);\n  border-color: var(--salt-status-error-borderColor);\n  outline-color: var(--salt-status-error-foreground-decorative);\n}\n\n.saltRadioButtonIcon-warning,\n.saltRadioButton:hover .saltRadioButtonIcon-warning {\n  color: var(--salt-status-warning-foreground-decorative);\n  border-color: var(--salt-status-warning-borderColor);\n  outline-color: var(--salt-status-warning-foreground-decorative);\n}\n\n.saltRadioButtonIcon-readOnly,\n.saltRadioButton:hover .saltRadioButtonIcon-readOnly {\n  border-color: var(--salt-selectable-borderColor-readonly);\n  color: var(--salt-content-primary-foreground);\n}\n\n.saltRadioButtonIcon > svg {\n  position: absolute;\n  /* Ensure a gap doesn't appear when device scaling is used */\n  transform: scale(1.01);\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=RadioButtonIcon.css.js.map

package/dist-es/radio-button/internal/RadioGroupContext.js

@@ -1,7 +1,7 @@
 import { createContext } from '../../utils/createContext.js';
-import 'react/jsx-runtime';
 import 'react';
 import 'clsx';
+import 'react/jsx-runtime';
 import '../../utils/useFloatingUI/useFloatingUI.js';
 import '../../utils/useId.js';
 import '../../salt-provider/SaltProvider.js';

package/dist-es/salt-provider/SaltProvider.js

@@ -5,8 +5,8 @@ import { clsx } from 'clsx';
 import { createContext, useContext, useMemo, isValidElement, cloneElement } from 'react';
 import '../aria-announcer/AriaAnnouncerContext.js';
 import { AriaAnnouncerProvider } from '../aria-announcer/AriaAnnouncerProvider.js';
-import { DEFAULT_BREAKPOINTS } from '../breakpoints/Breakpoints.js';
 import { useMatchedBreakpoints, BreakpointProvider } from '../breakpoints/BreakpointProvider.js';
+import { DEFAULT_BREAKPOINTS } from '../breakpoints/Breakpoints.js';
 import { useIsomorphicLayoutEffect } from '../utils/useIsomorphicLayoutEffect.js';
 import { ViewportProvider } from '../viewport/ViewportProvider.js';
 import css_248z from './SaltProvider.css.js';

package/dist-es/salt-provider/SaltProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"SaltProvider.js","sources":["../src/salt-provider/SaltProvider.tsx"],"sourcesContent":["import {\n  StyleInjectionProvider,\n  useComponentCssInjection,\n} from \"@salt-ds/styles\";\nimport { type WindowContextType, useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n  cloneElement,\n  createContext,\n  isValidElement,\n  useContext,\n  useMemo,\n} from \"react\";\nimport { AriaAnnouncerProvider } from \"../aria-announcer\";\nimport {\n  BreakpointProvider,\n  type Breakpoints,\n  DEFAULT_BREAKPOINTS,\n  useMatchedBreakpoints,\n} from \"../breakpoints\";\nimport type {\n  Accent,\n  ActionFont,\n  Corner,\n  Density,\n  HeadingFont,\n  Mode,\n  ThemeName,\n} from \"../theme\";\nimport { useIsomorphicLayoutEffect } from \"../utils/useIsomorphicLayoutEffect\";\nimport { ViewportProvider } from \"../viewport\";\nimport saltProviderCss from \"./SaltProvider.css\";\n\nexport const DEFAULT_DENSITY = \"medium\";\n\nconst DEFAULT_THEME_NAME = \"salt-theme\";\nconst DEFAULT_THEME_NAME_NEXT = \"salt-theme-next\";\n\nconst DEFAULT_MODE = \"light\";\nconst DEFAULT_CORNER: Corner = \"sharp\";\nconst DEFAULT_HEADING_FONT: HeadingFont = \"Open Sans\";\nconst DEFAULT_ACCENT: Accent = \"blue\";\nconst DEFAULT_ACTION_FONT: ActionFont = \"Open Sans\";\nexport interface ThemeContextProps {\n  theme: ThemeName;\n  mode: Mode;\n  window?: WindowContextType;\n  /** Only available when using SaltProviderNext. */\n  themeNext: boolean;\n  corner: Corner;\n  /** @deprecated use `corner`*/\n  UNSTABLE_corner: Corner;\n  headingFont: HeadingFont;\n  /** @deprecated use `headingFont` */\n  UNSTABLE_headingFont: HeadingFont;\n  accent: Accent;\n  /** @deprecated use `accent` */\n  UNSTABLE_accent: Accent;\n  actionFont: ActionFont;\n  /** @deprecated use `actionFont` */\n  UNSTABLE_actionFont: ActionFont;\n}\n\nexport const DensityContext = createContext<Density>(DEFAULT_DENSITY);\n\nexport const ThemeContext = createContext<ThemeContextProps>({\n  theme: \"\",\n  mode: DEFAULT_MODE,\n  themeNext: false,\n  corner: DEFAULT_CORNER,\n  UNSTABLE_corner: DEFAULT_CORNER,\n  headingFont: DEFAULT_HEADING_FONT,\n  UNSTABLE_headingFont: DEFAULT_HEADING_FONT,\n  accent: DEFAULT_ACCENT,\n  UNSTABLE_accent: DEFAULT_ACCENT,\n  actionFont: DEFAULT_ACTION_FONT,\n  UNSTABLE_actionFont: DEFAULT_ACTION_FONT,\n});\n\nexport const BreakpointContext =\n  createContext<Breakpoints>(DEFAULT_BREAKPOINTS);\n\n/**\n * We're relying `DEFAULT_THEME_NAME` to determine whether the provider is a root.\n */\nconst getThemeNames = (\n  themeName: ThemeName,\n  themeNext?: boolean,\n): ThemeName => {\n  if (themeNext) {\n    return themeName === DEFAULT_THEME_NAME\n      ? clsx(DEFAULT_THEME_NAME, DEFAULT_THEME_NAME_NEXT)\n      : clsx(DEFAULT_THEME_NAME, DEFAULT_THEME_NAME_NEXT, themeName);\n  }\n  return themeName === DEFAULT_THEME_NAME\n    ? themeName\n    : clsx(DEFAULT_THEME_NAME, themeName);\n};\n\ninterface ThemeNextProps {\n  themeNext?: boolean;\n}\n\nconst createThemedChildren = ({\n  children,\n  themeName,\n  density,\n  mode,\n  applyClassesTo,\n  themeNext,\n  corner,\n  headingFont,\n  accent,\n  actionFont,\n}: {\n  children: ReactNode;\n  themeName: ThemeName;\n  density: Density;\n  mode: Mode;\n  applyClassesTo?: TargetElement;\n} & ThemeNextProps &\n  SaltProviderNextAdditionalProps) => {\n  const themeNamesString = getThemeNames(themeName, themeNext);\n  const themeNextProps = {\n    \"data-corner\": corner,\n    \"data-heading-font\": headingFont,\n    \"data-accent\": accent,\n    \"data-action-font\": actionFont,\n  };\n  if (applyClassesTo === \"root\") {\n    return children;\n  }\n  if (applyClassesTo === \"child\") {\n    if (isValidElement<HTMLAttributes<HTMLElement>>(children)) {\n      return cloneElement(children, {\n        className: clsx(\n          children.props?.className,\n          themeNamesString,\n          `salt-density-${density}`,\n        ),\n        // @ts-ignore\n        \"data-mode\": mode,\n        ...(themeNext ? themeNextProps : {}),\n      });\n    }\n    console.warn(\n      `\\nSaltProvider can only apply CSS classes for theming to a single nested child element of the SaltProvider.\n        Either wrap elements with a single container or consider removing the applyClassesToChild prop, in which case a\n        div element will wrap your child elements`,\n    );\n    return children;\n  }\n  return (\n    <div\n      className={clsx(\n        \"salt-provider\",\n        themeNamesString,\n        `salt-density-${density}`,\n      )}\n      data-mode={mode}\n      {...(themeNext ? themeNextProps : {})}\n    >\n      {children}\n    </div>\n  );\n};\n\ntype TargetElement = \"root\" | \"scope\" | \"child\";\n\ninterface SaltProviderBaseProps {\n  /**\n   * Either \"root\", \"scope\" or \"child\".\n   * Specifies the location of salt theme class and attributes should be applied to.\n   *\n   * Defaults to \"root\" for a root provider, otherwise \"scope\".\n   */\n  applyClassesTo?: TargetElement;\n  /**\n   * Either \"high\", \"medium\", \"low\" or \"touch\".\n   * Determines the amount of content that can fit on a screen based on the size and spacing of components.\n   * Refer to [density](https://www.saltdesignsystem.com/salt/foundations/density) doc for more detail.\n   *\n   * @default \"medium\"\n   */\n  density?: Density;\n  /**\n   * A string. Specifies custom theme name(s) you want to apply, similar to `className`.\n   */\n  theme?: ThemeName;\n  /**\n   * Either \"light\" or \"dark\". Enable the color palette to change from light to dark.\n   * Refer to [modes](https://www.saltdesignsystem.com/salt/foundations/modes) doc for more detail.\n   *\n   * @default \"light\"\n   */\n  mode?: Mode;\n  /**\n   * Shape of `{ xs: number; sm: number; md: number; lg: number; xl: number; }`.\n   * Determines breakpoints used in responsive calculation for layout components.\n   */\n  breakpoints?: Breakpoints;\n  /**\n   * A boolean. Enables dynamic style injection for each component.\n   *\n   * If `false`, you'll need to include component CSS yourself.\n   *\n   * @default true\n   */\n  enableStyleInjection?: boolean;\n}\n\ninterface SaltProviderThatAppliesClassesToChild extends SaltProviderBaseProps {\n  children: ReactElement;\n  applyClassesTo: \"child\";\n}\n\ninterface SaltProviderThatInjectsThemeElement extends SaltProviderBaseProps {\n  children: ReactNode;\n}\n\ninterface SaltProviderThatClassesToRoot\n  extends SaltProviderThatInjectsThemeElement {\n  applyClassesTo: \"root\";\n}\n\ntype SaltProviderProps =\n  | SaltProviderThatAppliesClassesToChild\n  | SaltProviderThatInjectsThemeElement\n  | SaltProviderThatClassesToRoot;\n\nfunction InternalSaltProvider({\n  applyClassesTo: applyClassesToProp,\n  children,\n  density: densityProp,\n  theme: themeProp,\n  mode: modeProp,\n  breakpoints: breakpointsProp,\n  themeNext,\n  corner: cornerProp,\n  headingFont: headingFontProp,\n  accent: accentProp,\n  actionFont: actionFontProp,\n}: Omit<\n  SaltProviderProps & ThemeNextProps & SaltProviderNextProps,\n  \"enableStyleInjection\"\n>) {\n  const inheritedDensity = useContext(DensityContext);\n  const {\n    theme: inheritedTheme,\n    mode: inheritedMode,\n    window: inheritedWindow,\n    corner: inheritedCorner,\n    headingFont: inheritedHeadingFont,\n    accent: inheritedAccent,\n    actionFont: inheritedActionFont,\n  } = useContext(ThemeContext);\n\n  const isRootProvider = inheritedTheme === undefined || inheritedTheme === \"\";\n  const density = densityProp ?? inheritedDensity ?? DEFAULT_DENSITY;\n  const themeName =\n    themeProp ?? (inheritedTheme === \"\" ? DEFAULT_THEME_NAME : inheritedTheme);\n  const mode = modeProp ?? inheritedMode;\n  const breakpoints = breakpointsProp ?? DEFAULT_BREAKPOINTS;\n  const corner = cornerProp ?? inheritedCorner ?? DEFAULT_CORNER;\n  const headingFont =\n    headingFontProp ?? inheritedHeadingFont ?? DEFAULT_HEADING_FONT;\n  const accent = accentProp ?? inheritedAccent ?? DEFAULT_ACCENT;\n  const actionFont =\n    actionFontProp ?? inheritedActionFont ?? DEFAULT_ACTION_FONT;\n\n  const applyClassesTo =\n    applyClassesToProp ?? (isRootProvider ? \"root\" : \"scope\");\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-provider\",\n    css: saltProviderCss,\n    window: targetWindow,\n  });\n\n  const themeContextValue = useMemo(\n    () => ({\n      theme: themeName,\n      mode,\n      window: targetWindow,\n      themeNext: Boolean(themeNext),\n      corner: corner,\n      headingFont: headingFont,\n      accent: accent,\n      actionFont: actionFont,\n      // Backward compatibility\n      UNSTABLE_corner: corner,\n      UNSTABLE_headingFont: headingFont,\n      UNSTABLE_accent: accent,\n      UNSTABLE_actionFont: actionFont,\n    }),\n    [\n      themeName,\n      mode,\n      targetWindow,\n      themeNext,\n      corner,\n      headingFont,\n      accent,\n      actionFont,\n    ],\n  );\n\n  const themedChildren = createThemedChildren({\n    children,\n    themeName,\n    density,\n    mode,\n    applyClassesTo,\n    themeNext,\n    corner: corner,\n    headingFont,\n    accent,\n    actionFont,\n  });\n\n  useIsomorphicLayoutEffect(() => {\n    const themeNamesString = getThemeNames(themeName, themeNext);\n    const themeNames = themeNamesString.split(\" \");\n\n    if (applyClassesTo === \"root\" && targetWindow) {\n      if (inheritedWindow !== targetWindow) {\n        // add the styles we want to apply\n        targetWindow.document.documentElement.classList.add(\n          ...themeNames,\n          `salt-density-${density}`,\n        );\n        targetWindow.document.documentElement.dataset.mode = mode;\n        if (themeNext) {\n          targetWindow.document.documentElement.dataset.corner = corner;\n          targetWindow.document.documentElement.dataset.headingFont =\n            headingFont;\n          targetWindow.document.documentElement.dataset.accent = accent;\n          targetWindow.document.documentElement.dataset.actionFont = actionFont;\n        }\n      } else {\n        console.warn(\n          \"SaltProvider can only apply CSS classes to the root if it is the root level SaltProvider.\",\n        );\n      }\n    }\n    return () => {\n      if (applyClassesTo === \"root\" && targetWindow) {\n        // When unmounting/remounting, remove the applied styles from the root\n        targetWindow.document.documentElement.classList.remove(\n          ...themeNames,\n          `salt-density-${density}`,\n        );\n        targetWindow.document.documentElement.dataset.mode = undefined;\n        if (themeNext) {\n          delete targetWindow.document.documentElement.dataset.corner;\n          delete targetWindow.document.documentElement.dataset.headingFont;\n          delete targetWindow.document.documentElement.dataset.accent;\n          delete targetWindow.document.documentElement.dataset.actionFont;\n        }\n      }\n    };\n  }, [\n    applyClassesTo,\n    density,\n    mode,\n    themeName,\n    targetWindow,\n    inheritedWindow,\n    themeNext,\n    corner,\n    headingFont,\n    accent,\n    actionFont,\n  ]);\n\n  const matchedBreakpoints = useMatchedBreakpoints(breakpoints);\n\n  const saltProvider = (\n    <DensityContext.Provider value={density}>\n      <ThemeContext.Provider value={themeContextValue}>\n        <BreakpointProvider matchedBreakpoints={matchedBreakpoints}>\n          <BreakpointContext.Provider value={breakpoints}>\n            <ViewportProvider>{themedChildren}</ViewportProvider>\n          </BreakpointContext.Provider>\n        </BreakpointProvider>\n      </ThemeContext.Provider>\n    </DensityContext.Provider>\n  );\n\n  if (isRootProvider) {\n    return <AriaAnnouncerProvider>{saltProvider}</AriaAnnouncerProvider>;\n  }\n  return saltProvider;\n}\n\nexport function SaltProvider({\n  enableStyleInjection,\n  ...restProps\n}: SaltProviderProps) {\n  return (\n    <StyleInjectionProvider value={enableStyleInjection}>\n      <InternalSaltProvider {...restProps} />\n    </StyleInjectionProvider>\n  );\n}\n\ninterface SaltProviderNextAdditionalProps {\n  /**\n   * Either \"sharp\" or \"rounded\".\n   * Determines selected components corner radius.\n   * @default \"sharp\"\n   */\n  corner?: Corner;\n  /**\n   * Either \"Open Sans\" or \"Amplitude\".\n   * Determines font family of display and heading text.\n   * @default \"Open Sans\"\n   */\n  headingFont?: HeadingFont;\n  /**\n   * Either \"blue\" or \"teal\".\n   * Determines accent color used across components, e.g. Accent Button, List, Calendar.\n   * @default \"blue\"\n   */\n  accent?: Accent;\n  /**\n   * Either \"Open Sans\" or \"Amplitude\".\n   * Determines font family of action components, mostly Buttons.\n   * @default \"Open Sans\"\n   */\n  actionFont?: ActionFont;\n}\n\nexport type SaltProviderNextProps = SaltProviderProps &\n  SaltProviderNextAdditionalProps;\n/** @deprecated use `SaltProviderNextProps` */\nexport type UNSTABLE_SaltProviderNextProps = SaltProviderNextProps;\n\nexport function SaltProviderNext({\n  enableStyleInjection,\n  ...restProps\n}: SaltProviderNextProps) {\n  return (\n    <StyleInjectionProvider value={enableStyleInjection}>\n      {/* Leveraging InternalSaltProvider being not exported, so we can pass more props than previously supported */}\n      <InternalSaltProvider {...restProps} themeNext={true} />\n    </StyleInjectionProvider>\n  );\n}\n/** @deprecated use `SaltProviderNext` */\nexport const UNSTABLE_SaltProviderNext = SaltProviderNext;\n\nexport const useTheme = (): ThemeContextProps => {\n  const { window, ...contextWithoutWindow } = useContext(ThemeContext);\n\n  return contextWithoutWindow;\n};\n\n/**\n * `useDensity` merges density value from `DensityContext` with the one from component's props.\n */\nexport function useDensity(density?: Density): Density {\n  const densityFromContext = useContext(DensityContext);\n  return density ?? densityFromContext ?? DEFAULT_DENSITY;\n}\n\nexport const useBreakpoints = (): Breakpoints => {\n  return useContext(BreakpointContext);\n};\n"],"names":["saltProviderCss"],"mappings":"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"}
+{"version":3,"file":"SaltProvider.js","sources":["../src/salt-provider/SaltProvider.tsx"],"sourcesContent":["import {\n  StyleInjectionProvider,\n  useComponentCssInjection,\n} from \"@salt-ds/styles\";\nimport { useWindow, type WindowContextType } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  cloneElement,\n  createContext,\n  type HTMLAttributes,\n  isValidElement,\n  type ReactElement,\n  type ReactNode,\n  useContext,\n  useMemo,\n} from \"react\";\nimport { AriaAnnouncerProvider } from \"../aria-announcer\";\nimport {\n  BreakpointProvider,\n  type Breakpoints,\n  DEFAULT_BREAKPOINTS,\n  useMatchedBreakpoints,\n} from \"../breakpoints\";\nimport type {\n  Accent,\n  ActionFont,\n  Corner,\n  Density,\n  HeadingFont,\n  Mode,\n  ThemeName,\n} from \"../theme\";\nimport { useIsomorphicLayoutEffect } from \"../utils/useIsomorphicLayoutEffect\";\nimport { ViewportProvider } from \"../viewport\";\nimport saltProviderCss from \"./SaltProvider.css\";\n\nexport const DEFAULT_DENSITY = \"medium\";\n\nconst DEFAULT_THEME_NAME = \"salt-theme\";\nconst DEFAULT_THEME_NAME_NEXT = \"salt-theme-next\";\n\nconst DEFAULT_MODE = \"light\";\nconst DEFAULT_CORNER: Corner = \"sharp\";\nconst DEFAULT_HEADING_FONT: HeadingFont = \"Open Sans\";\nconst DEFAULT_ACCENT: Accent = \"blue\";\nconst DEFAULT_ACTION_FONT: ActionFont = \"Open Sans\";\nexport interface ThemeContextProps {\n  theme: ThemeName;\n  mode: Mode;\n  window?: WindowContextType;\n  /** Only available when using SaltProviderNext. */\n  themeNext: boolean;\n  corner: Corner;\n  /** @deprecated use `corner`*/\n  UNSTABLE_corner: Corner;\n  headingFont: HeadingFont;\n  /** @deprecated use `headingFont` */\n  UNSTABLE_headingFont: HeadingFont;\n  accent: Accent;\n  /** @deprecated use `accent` */\n  UNSTABLE_accent: Accent;\n  actionFont: ActionFont;\n  /** @deprecated use `actionFont` */\n  UNSTABLE_actionFont: ActionFont;\n}\n\nexport const DensityContext = createContext<Density>(DEFAULT_DENSITY);\n\nexport const ThemeContext = createContext<ThemeContextProps>({\n  theme: \"\",\n  mode: DEFAULT_MODE,\n  themeNext: false,\n  corner: DEFAULT_CORNER,\n  UNSTABLE_corner: DEFAULT_CORNER,\n  headingFont: DEFAULT_HEADING_FONT,\n  UNSTABLE_headingFont: DEFAULT_HEADING_FONT,\n  accent: DEFAULT_ACCENT,\n  UNSTABLE_accent: DEFAULT_ACCENT,\n  actionFont: DEFAULT_ACTION_FONT,\n  UNSTABLE_actionFont: DEFAULT_ACTION_FONT,\n});\n\nexport const BreakpointContext =\n  createContext<Breakpoints>(DEFAULT_BREAKPOINTS);\n\n/**\n * We're relying `DEFAULT_THEME_NAME` to determine whether the provider is a root.\n */\nconst getThemeNames = (\n  themeName: ThemeName,\n  themeNext?: boolean,\n): ThemeName => {\n  if (themeNext) {\n    return themeName === DEFAULT_THEME_NAME\n      ? clsx(DEFAULT_THEME_NAME, DEFAULT_THEME_NAME_NEXT)\n      : clsx(DEFAULT_THEME_NAME, DEFAULT_THEME_NAME_NEXT, themeName);\n  }\n  return themeName === DEFAULT_THEME_NAME\n    ? themeName\n    : clsx(DEFAULT_THEME_NAME, themeName);\n};\n\ninterface ThemeNextProps {\n  themeNext?: boolean;\n}\n\nconst createThemedChildren = ({\n  children,\n  themeName,\n  density,\n  mode,\n  applyClassesTo,\n  themeNext,\n  corner,\n  headingFont,\n  accent,\n  actionFont,\n}: {\n  children: ReactNode;\n  themeName: ThemeName;\n  density: Density;\n  mode: Mode;\n  applyClassesTo?: TargetElement;\n} & ThemeNextProps &\n  SaltProviderNextAdditionalProps) => {\n  const themeNamesString = getThemeNames(themeName, themeNext);\n  const themeNextProps = {\n    \"data-corner\": corner,\n    \"data-heading-font\": headingFont,\n    \"data-accent\": accent,\n    \"data-action-font\": actionFont,\n  };\n  if (applyClassesTo === \"root\") {\n    return children;\n  }\n  if (applyClassesTo === \"child\") {\n    if (isValidElement<HTMLAttributes<HTMLElement>>(children)) {\n      return cloneElement(children, {\n        className: clsx(\n          children.props?.className,\n          themeNamesString,\n          `salt-density-${density}`,\n        ),\n        // @ts-ignore\n        \"data-mode\": mode,\n        ...(themeNext ? themeNextProps : {}),\n      });\n    }\n    console.warn(\n      `\\nSaltProvider can only apply CSS classes for theming to a single nested child element of the SaltProvider.\n        Either wrap elements with a single container or consider removing the applyClassesToChild prop, in which case a\n        div element will wrap your child elements`,\n    );\n    return children;\n  }\n  return (\n    <div\n      className={clsx(\n        \"salt-provider\",\n        themeNamesString,\n        `salt-density-${density}`,\n      )}\n      data-mode={mode}\n      {...(themeNext ? themeNextProps : {})}\n    >\n      {children}\n    </div>\n  );\n};\n\ntype TargetElement = \"root\" | \"scope\" | \"child\";\n\ninterface SaltProviderBaseProps {\n  /**\n   * Either \"root\", \"scope\" or \"child\".\n   * Specifies the location of salt theme class and attributes should be applied to.\n   *\n   * Defaults to \"root\" for a root provider, otherwise \"scope\".\n   */\n  applyClassesTo?: TargetElement;\n  /**\n   * Either \"high\", \"medium\", \"low\" or \"touch\".\n   * Determines the amount of content that can fit on a screen based on the size and spacing of components.\n   * Refer to [density](https://www.saltdesignsystem.com/salt/foundations/density) doc for more detail.\n   *\n   * @default \"medium\"\n   */\n  density?: Density;\n  /**\n   * A string. Specifies custom theme name(s) you want to apply, similar to `className`.\n   */\n  theme?: ThemeName;\n  /**\n   * Either \"light\" or \"dark\". Enable the color palette to change from light to dark.\n   * Refer to [modes](https://www.saltdesignsystem.com/salt/foundations/modes) doc for more detail.\n   *\n   * @default \"light\"\n   */\n  mode?: Mode;\n  /**\n   * Shape of `{ xs: number; sm: number; md: number; lg: number; xl: number; }`.\n   * Determines breakpoints used in responsive calculation for layout components.\n   */\n  breakpoints?: Breakpoints;\n  /**\n   * A boolean. Enables dynamic style injection for each component.\n   *\n   * If `false`, you'll need to include component CSS yourself.\n   *\n   * @default true\n   */\n  enableStyleInjection?: boolean;\n}\n\ninterface SaltProviderThatAppliesClassesToChild extends SaltProviderBaseProps {\n  children: ReactElement;\n  applyClassesTo: \"child\";\n}\n\ninterface SaltProviderThatInjectsThemeElement extends SaltProviderBaseProps {\n  children: ReactNode;\n}\n\ninterface SaltProviderThatClassesToRoot\n  extends SaltProviderThatInjectsThemeElement {\n  applyClassesTo: \"root\";\n}\n\ntype SaltProviderProps =\n  | SaltProviderThatAppliesClassesToChild\n  | SaltProviderThatInjectsThemeElement\n  | SaltProviderThatClassesToRoot;\n\nfunction InternalSaltProvider({\n  applyClassesTo: applyClassesToProp,\n  children,\n  density: densityProp,\n  theme: themeProp,\n  mode: modeProp,\n  breakpoints: breakpointsProp,\n  themeNext,\n  corner: cornerProp,\n  headingFont: headingFontProp,\n  accent: accentProp,\n  actionFont: actionFontProp,\n}: Omit<\n  SaltProviderProps & ThemeNextProps & SaltProviderNextProps,\n  \"enableStyleInjection\"\n>) {\n  const inheritedDensity = useContext(DensityContext);\n  const {\n    theme: inheritedTheme,\n    mode: inheritedMode,\n    window: inheritedWindow,\n    corner: inheritedCorner,\n    headingFont: inheritedHeadingFont,\n    accent: inheritedAccent,\n    actionFont: inheritedActionFont,\n  } = useContext(ThemeContext);\n\n  const isRootProvider = inheritedTheme === undefined || inheritedTheme === \"\";\n  const density = densityProp ?? inheritedDensity ?? DEFAULT_DENSITY;\n  const themeName =\n    themeProp ?? (inheritedTheme === \"\" ? DEFAULT_THEME_NAME : inheritedTheme);\n  const mode = modeProp ?? inheritedMode;\n  const breakpoints = breakpointsProp ?? DEFAULT_BREAKPOINTS;\n  const corner = cornerProp ?? inheritedCorner ?? DEFAULT_CORNER;\n  const headingFont =\n    headingFontProp ?? inheritedHeadingFont ?? DEFAULT_HEADING_FONT;\n  const accent = accentProp ?? inheritedAccent ?? DEFAULT_ACCENT;\n  const actionFont =\n    actionFontProp ?? inheritedActionFont ?? DEFAULT_ACTION_FONT;\n\n  const applyClassesTo =\n    applyClassesToProp ?? (isRootProvider ? \"root\" : \"scope\");\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-provider\",\n    css: saltProviderCss,\n    window: targetWindow,\n  });\n\n  const themeContextValue = useMemo(\n    () => ({\n      theme: themeName,\n      mode,\n      window: targetWindow,\n      themeNext: Boolean(themeNext),\n      corner: corner,\n      headingFont: headingFont,\n      accent: accent,\n      actionFont: actionFont,\n      // Backward compatibility\n      UNSTABLE_corner: corner,\n      UNSTABLE_headingFont: headingFont,\n      UNSTABLE_accent: accent,\n      UNSTABLE_actionFont: actionFont,\n    }),\n    [\n      themeName,\n      mode,\n      targetWindow,\n      themeNext,\n      corner,\n      headingFont,\n      accent,\n      actionFont,\n    ],\n  );\n\n  const themedChildren = createThemedChildren({\n    children,\n    themeName,\n    density,\n    mode,\n    applyClassesTo,\n    themeNext,\n    corner: corner,\n    headingFont,\n    accent,\n    actionFont,\n  });\n\n  useIsomorphicLayoutEffect(() => {\n    const themeNamesString = getThemeNames(themeName, themeNext);\n    const themeNames = themeNamesString.split(\" \");\n\n    if (applyClassesTo === \"root\" && targetWindow) {\n      if (inheritedWindow !== targetWindow) {\n        // add the styles we want to apply\n        targetWindow.document.documentElement.classList.add(\n          ...themeNames,\n          `salt-density-${density}`,\n        );\n        targetWindow.document.documentElement.dataset.mode = mode;\n        if (themeNext) {\n          targetWindow.document.documentElement.dataset.corner = corner;\n          targetWindow.document.documentElement.dataset.headingFont =\n            headingFont;\n          targetWindow.document.documentElement.dataset.accent = accent;\n          targetWindow.document.documentElement.dataset.actionFont = actionFont;\n        }\n      } else {\n        console.warn(\n          \"SaltProvider can only apply CSS classes to the root if it is the root level SaltProvider.\",\n        );\n      }\n    }\n    return () => {\n      if (applyClassesTo === \"root\" && targetWindow) {\n        // When unmounting/remounting, remove the applied styles from the root\n        targetWindow.document.documentElement.classList.remove(\n          ...themeNames,\n          `salt-density-${density}`,\n        );\n        targetWindow.document.documentElement.dataset.mode = undefined;\n        if (themeNext) {\n          delete targetWindow.document.documentElement.dataset.corner;\n          delete targetWindow.document.documentElement.dataset.headingFont;\n          delete targetWindow.document.documentElement.dataset.accent;\n          delete targetWindow.document.documentElement.dataset.actionFont;\n        }\n      }\n    };\n  }, [\n    applyClassesTo,\n    density,\n    mode,\n    themeName,\n    targetWindow,\n    inheritedWindow,\n    themeNext,\n    corner,\n    headingFont,\n    accent,\n    actionFont,\n  ]);\n\n  const matchedBreakpoints = useMatchedBreakpoints(breakpoints);\n\n  const saltProvider = (\n    <DensityContext.Provider value={density}>\n      <ThemeContext.Provider value={themeContextValue}>\n        <BreakpointProvider matchedBreakpoints={matchedBreakpoints}>\n          <BreakpointContext.Provider value={breakpoints}>\n            <ViewportProvider>{themedChildren}</ViewportProvider>\n          </BreakpointContext.Provider>\n        </BreakpointProvider>\n      </ThemeContext.Provider>\n    </DensityContext.Provider>\n  );\n\n  if (isRootProvider) {\n    return <AriaAnnouncerProvider>{saltProvider}</AriaAnnouncerProvider>;\n  }\n  return saltProvider;\n}\n\nexport function SaltProvider({\n  enableStyleInjection,\n  ...restProps\n}: SaltProviderProps) {\n  return (\n    <StyleInjectionProvider value={enableStyleInjection}>\n      <InternalSaltProvider {...restProps} />\n    </StyleInjectionProvider>\n  );\n}\n\ninterface SaltProviderNextAdditionalProps {\n  /**\n   * Either \"sharp\" or \"rounded\".\n   * Determines selected components corner radius.\n   * @default \"sharp\"\n   */\n  corner?: Corner;\n  /**\n   * Either \"Open Sans\" or \"Amplitude\".\n   * Determines font family of display and heading text.\n   * @default \"Open Sans\"\n   */\n  headingFont?: HeadingFont;\n  /**\n   * Either \"blue\" or \"teal\".\n   * Determines accent color used across components, e.g. Accent Button, List, Calendar.\n   * @default \"blue\"\n   */\n  accent?: Accent;\n  /**\n   * Either \"Open Sans\" or \"Amplitude\".\n   * Determines font family of action components, mostly Buttons.\n   * @default \"Open Sans\"\n   */\n  actionFont?: ActionFont;\n}\n\nexport type SaltProviderNextProps = SaltProviderProps &\n  SaltProviderNextAdditionalProps;\n/** @deprecated use `SaltProviderNextProps` */\nexport type UNSTABLE_SaltProviderNextProps = SaltProviderNextProps;\n\nexport function SaltProviderNext({\n  enableStyleInjection,\n  ...restProps\n}: SaltProviderNextProps) {\n  return (\n    <StyleInjectionProvider value={enableStyleInjection}>\n      {/* Leveraging InternalSaltProvider being not exported, so we can pass more props than previously supported */}\n      <InternalSaltProvider {...restProps} themeNext={true} />\n    </StyleInjectionProvider>\n  );\n}\n/** @deprecated use `SaltProviderNext` */\nexport const UNSTABLE_SaltProviderNext = SaltProviderNext;\n\nexport const useTheme = (): ThemeContextProps => {\n  const { window, ...contextWithoutWindow } = useContext(ThemeContext);\n\n  return contextWithoutWindow;\n};\n\n/**\n * `useDensity` merges density value from `DensityContext` with the one from component's props.\n */\nexport function useDensity(density?: Density): Density {\n  const densityFromContext = useContext(DensityContext);\n  return density ?? densityFromContext ?? DEFAULT_DENSITY;\n}\n\nexport const useBreakpoints = (): Breakpoints => {\n  return useContext(BreakpointContext);\n};\n"],"names":["saltProviderCss"],"mappings":";;;;;;;;;;;;;AAoCO,MAAM,eAAkB,GAAA;AAE/B,MAAM,kBAAqB,GAAA,YAAA;AAC3B,MAAM,uBAA0B,GAAA,iBAAA;AAEhC,MAAM,YAAe,GAAA,OAAA;AACrB,MAAM,cAAyB,GAAA,OAAA;AAC/B,MAAM,oBAAoC,GAAA,WAAA;AAC1C,MAAM,cAAyB,GAAA,MAAA;AAC/B,MAAM,mBAAkC,GAAA,WAAA;AAqB3B,MAAA,cAAA,GAAiB,cAAuB,eAAe;AAE7D,MAAM,eAAe,aAAiC,CAAA;AAAA,EAC3D,KAAO,EAAA,EAAA;AAAA,EACP,IAAM,EAAA,YAAA;AAAA,EACN,SAAW,EAAA,KAAA;AAAA,EACX,MAAQ,EAAA,cAAA;AAAA,EACR,eAAiB,EAAA,cAAA;AAAA,EACjB,WAAa,EAAA,oBAAA;AAAA,EACb,oBAAsB,EAAA,oBAAA;AAAA,EACtB,MAAQ,EAAA,cAAA;AAAA,EACR,eAAiB,EAAA,cAAA;AAAA,EACjB,UAAY,EAAA,mBAAA;AAAA,EACZ,mBAAqB,EAAA;AACvB,CAAC;AAEY,MAAA,iBAAA,GACX,cAA2B,mBAAmB;AAKhD,MAAM,aAAA,GAAgB,CACpB,SAAA,EACA,SACc,KAAA;AACd,EAAA,IAAI,SAAW,EAAA;AACb,IAAO,OAAA,SAAA,KAAc,qBACjB,IAAK,CAAA,kBAAA,EAAoB,uBAAuB,CAChD,GAAA,IAAA,CAAK,kBAAoB,EAAA,uBAAA,EAAyB,SAAS,CAAA;AAAA;AAEjE,EAAA,OAAO,SAAc,KAAA,kBAAA,GACjB,SACA,GAAA,IAAA,CAAK,oBAAoB,SAAS,CAAA;AACxC,CAAA;AAMA,MAAM,uBAAuB,CAAC;AAAA,EAC5B,QAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,IAAA;AAAA,EACA,cAAA;AAAA,EACA,SAAA;AAAA,EACA,MAAA;AAAA,EACA,WAAA;AAAA,EACA,MAAA;AAAA,EACA;AACF,CAOsC,KAAA;AA5HtC,EAAA,IAAA,EAAA;AA6HE,EAAM,MAAA,gBAAA,GAAmB,aAAc,CAAA,SAAA,EAAW,SAAS,CAAA;AAC3D,EAAA,MAAM,cAAiB,GAAA;AAAA,IACrB,aAAe,EAAA,MAAA;AAAA,IACf,mBAAqB,EAAA,WAAA;AAAA,IACrB,aAAe,EAAA,MAAA;AAAA,IACf,kBAAoB,EAAA;AAAA,GACtB;AACA,EAAA,IAAI,mBAAmB,MAAQ,EAAA;AAC7B,IAAO,OAAA,QAAA;AAAA;AAET,EAAA,IAAI,mBAAmB,OAAS,EAAA;AAC9B,IAAI,IAAA,cAAA,CAA4C,QAAQ,CAAG,EAAA;AACzD,MAAA,OAAO,aAAa,QAAU,EAAA;AAAA,QAC5B,SAAW,EAAA,IAAA;AAAA,UACT,CAAA,EAAA,GAAA,QAAA,CAAS,UAAT,IAAgB,GAAA,MAAA,GAAA,EAAA,CAAA,SAAA;AAAA,UAChB,gBAAA;AAAA,UACA,gBAAgB,OAAO,CAAA;AAAA,SACzB;AAAA;AAAA,QAEA,WAAa,EAAA,IAAA;AAAA,QACb,GAAI,SAAY,GAAA,cAAA,GAAiB;AAAC,OACnC,CAAA;AAAA;AAEH,IAAQ,OAAA,CAAA,IAAA;AAAA,MACN;AAAA;AAAA;AAAA,iDAAA;AAAA,KAGF;AACA,IAAO,OAAA,QAAA;AAAA;AAET,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,eAAA;AAAA,QACA,gBAAA;AAAA,QACA,gBAAgB,OAAO,CAAA;AAAA,OACzB;AAAA,MACA,WAAW,EAAA,IAAA;AAAA,MACV,GAAI,SAAY,GAAA,cAAA,GAAiB,EAAC;AAAA,MAElC;AAAA;AAAA,GACH;AAEJ,CAAA;AAiEA,SAAS,oBAAqB,CAAA;AAAA,EAC5B,cAAgB,EAAA,kBAAA;AAAA,EAChB,QAAA;AAAA,EACA,OAAS,EAAA,WAAA;AAAA,EACT,KAAO,EAAA,SAAA;AAAA,EACP,IAAM,EAAA,QAAA;AAAA,EACN,WAAa,EAAA,eAAA;AAAA,EACb,SAAA;AAAA,EACA,MAAQ,EAAA,UAAA;AAAA,EACR,WAAa,EAAA,eAAA;AAAA,EACb,MAAQ,EAAA,UAAA;AAAA,EACR,UAAY,EAAA;AACd,CAGG,EAAA;AACD,EAAM,MAAA,gBAAA,GAAmB,WAAW,cAAc,CAAA;AAClD,EAAM,MAAA;AAAA,IACJ,KAAO,EAAA,cAAA;AAAA,IACP,IAAM,EAAA,aAAA;AAAA,IACN,MAAQ,EAAA,eAAA;AAAA,IACR,MAAQ,EAAA,eAAA;AAAA,IACR,WAAa,EAAA,oBAAA;AAAA,IACb,MAAQ,EAAA,eAAA;AAAA,IACR,UAAY,EAAA;AAAA,GACd,GAAI,WAAW,YAAY,CAAA;AAE3B,EAAM,MAAA,cAAA,GAAiB,cAAmB,KAAA,MAAA,IAAa,cAAmB,KAAA,EAAA;AAC1E,EAAM,MAAA,OAAA,GAAU,eAAe,gBAAoB,IAAA,eAAA;AACnD,EAAA,MAAM,SACJ,GAAA,SAAA,KAAc,cAAmB,KAAA,EAAA,GAAK,kBAAqB,GAAA,cAAA,CAAA;AAC7D,EAAA,MAAM,OAAO,QAAY,IAAA,aAAA;AACzB,EAAA,MAAM,cAAc,eAAmB,IAAA,mBAAA;AACvC,EAAM,MAAA,MAAA,GAAS,cAAc,eAAmB,IAAA,cAAA;AAChD,EAAM,MAAA,WAAA,GACJ,mBAAmB,oBAAwB,IAAA,oBAAA;AAC7C,EAAM,MAAA,MAAA,GAAS,cAAc,eAAmB,IAAA,cAAA;AAChD,EAAM,MAAA,UAAA,GACJ,kBAAkB,mBAAuB,IAAA,mBAAA;AAE3C,EAAM,MAAA,cAAA,GACJ,kBAAuB,KAAA,cAAA,GAAiB,MAAS,GAAA,OAAA,CAAA;AAEnD,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,eAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,iBAAoB,GAAA,OAAA;AAAA,IACxB,OAAO;AAAA,MACL,KAAO,EAAA,SAAA;AAAA,MACP,IAAA;AAAA,MACA,MAAQ,EAAA,YAAA;AAAA,MACR,SAAA,EAAW,QAAQ,SAAS,CAAA;AAAA,MAC5B,MAAA;AAAA,MACA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA;AAAA,MAEA,eAAiB,EAAA,MAAA;AAAA,MACjB,oBAAsB,EAAA,WAAA;AAAA,MACtB,eAAiB,EAAA,MAAA;AAAA,MACjB,mBAAqB,EAAA;AAAA,KACvB,CAAA;AAAA,IACA;AAAA,MACE,SAAA;AAAA,MACA,IAAA;AAAA,MACA,YAAA;AAAA,MACA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,WAAA;AAAA,MACA,MAAA;AAAA,MACA;AAAA;AACF,GACF;AAEA,EAAA,MAAM,iBAAiB,oBAAqB,CAAA;AAAA,IAC1C,QAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,cAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,WAAA;AAAA,IACA,MAAA;AAAA,IACA;AAAA,GACD,CAAA;AAED,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAM,MAAA,gBAAA,GAAmB,aAAc,CAAA,SAAA,EAAW,SAAS,CAAA;AAC3D,IAAM,MAAA,UAAA,GAAa,gBAAiB,CAAA,KAAA,CAAM,GAAG,CAAA;AAE7C,IAAI,IAAA,cAAA,KAAmB,UAAU,YAAc,EAAA;AAC7C,MAAA,IAAI,oBAAoB,YAAc,EAAA;AAEpC,QAAa,YAAA,CAAA,QAAA,CAAS,gBAAgB,SAAU,CAAA,GAAA;AAAA,UAC9C,GAAG,UAAA;AAAA,UACH,gBAAgB,OAAO,CAAA;AAAA,SACzB;AACA,QAAa,YAAA,CAAA,QAAA,CAAS,eAAgB,CAAA,OAAA,CAAQ,IAAO,GAAA,IAAA;AACrD,QAAA,IAAI,SAAW,EAAA;AACb,UAAa,YAAA,CAAA,QAAA,CAAS,eAAgB,CAAA,OAAA,CAAQ,MAAS,GAAA,MAAA;AACvD,UAAa,YAAA,CAAA,QAAA,CAAS,eAAgB,CAAA,OAAA,CAAQ,WAC5C,GAAA,WAAA;AACF,UAAa,YAAA,CAAA,QAAA,CAAS,eAAgB,CAAA,OAAA,CAAQ,MAAS,GAAA,MAAA;AACvD,UAAa,YAAA,CAAA,QAAA,CAAS,eAAgB,CAAA,OAAA,CAAQ,UAAa,GAAA,UAAA;AAAA;AAC7D,OACK,MAAA;AACL,QAAQ,OAAA,CAAA,IAAA;AAAA,UACN;AAAA,SACF;AAAA;AACF;AAEF,IAAA,OAAO,MAAM;AACX,MAAI,IAAA,cAAA,KAAmB,UAAU,YAAc,EAAA;AAE7C,QAAa,YAAA,CAAA,QAAA,CAAS,gBAAgB,SAAU,CAAA,MAAA;AAAA,UAC9C,GAAG,UAAA;AAAA,UACH,gBAAgB,OAAO,CAAA;AAAA,SACzB;AACA,QAAa,YAAA,CAAA,QAAA,CAAS,eAAgB,CAAA,OAAA,CAAQ,IAAO,GAAA,MAAA;AACrD,QAAA,IAAI,SAAW,EAAA;AACb,UAAO,OAAA,YAAA,CAAa,QAAS,CAAA,eAAA,CAAgB,OAAQ,CAAA,MAAA;AACrD,UAAO,OAAA,YAAA,CAAa,QAAS,CAAA,eAAA,CAAgB,OAAQ,CAAA,WAAA;AACrD,UAAO,OAAA,YAAA,CAAa,QAAS,CAAA,eAAA,CAAgB,OAAQ,CAAA,MAAA;AACrD,UAAO,OAAA,YAAA,CAAa,QAAS,CAAA,eAAA,CAAgB,OAAQ,CAAA,UAAA;AAAA;AACvD;AACF,KACF;AAAA,GACC,EAAA;AAAA,IACD,cAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,SAAA;AAAA,IACA,YAAA;AAAA,IACA,eAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,WAAA;AAAA,IACA,MAAA;AAAA,IACA;AAAA,GACD,CAAA;AAED,EAAM,MAAA,kBAAA,GAAqB,sBAAsB,WAAW,CAAA;AAE5D,EAAA,MAAM,YACJ,mBAAA,GAAA,CAAC,cAAe,CAAA,QAAA,EAAf,EAAwB,KAAA,EAAO,OAC9B,EAAA,QAAA,kBAAA,GAAA,CAAC,YAAa,CAAA,QAAA,EAAb,EAAsB,KAAA,EAAO,iBAC5B,EAAA,QAAA,kBAAA,GAAA,CAAC,kBAAmB,EAAA,EAAA,kBAAA,EAClB,QAAC,kBAAA,GAAA,CAAA,iBAAA,CAAkB,QAAlB,EAAA,EAA2B,KAAO,EAAA,WAAA,EACjC,QAAC,kBAAA,GAAA,CAAA,gBAAA,EAAA,EAAkB,QAAe,EAAA,cAAA,EAAA,CAAA,EACpC,CACF,EAAA,CAAA,EACF,CACF,EAAA,CAAA;AAGF,EAAA,IAAI,cAAgB,EAAA;AAClB,IAAO,uBAAA,GAAA,CAAC,yBAAuB,QAAa,EAAA,YAAA,EAAA,CAAA;AAAA;AAE9C,EAAO,OAAA,YAAA;AACT;AAEO,SAAS,YAAa,CAAA;AAAA,EAC3B,oBAAA;AAAA,EACA,GAAG;AACL,CAAsB,EAAA;AACpB,EACE,uBAAA,GAAA,CAAC,0BAAuB,KAAO,EAAA,oBAAA,EAC7B,8BAAC,oBAAsB,EAAA,EAAA,GAAG,WAAW,CACvC,EAAA,CAAA;AAEJ;AAkCO,SAAS,gBAAiB,CAAA;AAAA,EAC/B,oBAAA;AAAA,EACA,GAAG;AACL,CAA0B,EAAA;AACxB,EACE,uBAAA,GAAA,CAAC,sBAAuB,EAAA,EAAA,KAAA,EAAO,oBAE7B,EAAA,QAAA,kBAAA,GAAA,CAAC,wBAAsB,GAAG,SAAA,EAAW,SAAW,EAAA,IAAA,EAAM,CACxD,EAAA,CAAA;AAEJ;AAEO,MAAM,yBAA4B,GAAA;AAElC,MAAM,WAAW,MAAyB;AAC/C,EAAA,MAAM,EAAE,MAAQ,EAAA,GAAG,oBAAqB,EAAA,GAAI,WAAW,YAAY,CAAA;AAEnE,EAAO,OAAA,oBAAA;AACT;AAKO,SAAS,WAAW,OAA4B,EAAA;AACrD,EAAM,MAAA,kBAAA,GAAqB,WAAW,cAAc,CAAA;AACpD,EAAA,OAAO,WAAW,kBAAsB,IAAA,eAAA;AAC1C;AAEO,MAAM,iBAAiB,MAAmB;AAC/C,EAAA,OAAO,WAAW,iBAAiB,CAAA;AACrC;;;;"}

package/dist-es/scrim/Scrim.js

@@ -1,4 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
 import { clsx } from 'clsx';
 import { forwardRef } from 'react';
 import { makePrefixer } from '../utils/makePrefixer.js';
@@ -6,8 +8,6 @@ import '../utils/useFloatingUI/useFloatingUI.js';
 import '../utils/useId.js';
 import '../salt-provider/SaltProvider.js';
 import '../viewport/ViewportProvider.js';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
 import css_248z from './Scrim.css.js';
 
 const withBaseName = makePrefixer("saltScrim");

package/dist-es/scrim/Scrim.js.map

@@ -1 +1 @@
-{"version":3,"file":"Scrim.js","sources":["../src/scrim/Scrim.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { makePrefixer } from \"../utils\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport scrimCss from \"./Scrim.css\";\n\nconst withBaseName = makePrefixer(\"saltScrim\");\n\nexport interface ScrimProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * If `true` the scrim is bound to the document viewport.\n   * The default value of this prop is false, and the default behavior is for Scrim to be bound to its parent container (nearest positioned ancestor).\n   */\n  fixed?: boolean;\n  /**\n   * If `true` the scrim is shown.\n   */\n  open?: boolean;\n}\n\nexport const Scrim = forwardRef<HTMLDivElement, ScrimProps>(function Scrim(\n  { className, children, fixed = false, open = true, ...rest },\n  ref,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-scrim\",\n    css: scrimCss,\n    window: targetWindow,\n  });\n\n  if (!open) {\n    return null;\n  }\n\n  return (\n    <div\n      className={clsx(\n        withBaseName(),\n        {\n          [withBaseName(\"fixed\")]: fixed,\n        },\n        className,\n      )}\n      data-testid=\"scrim\"\n      ref={ref}\n      {...rest}\n    >\n      {children}\n    </div>\n  );\n});\n"],"names":["Scrim","scrimCss"],"mappings":";;;;;;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,WAAW,CAAA;AActC,MAAM,KAAQ,GAAA,UAAA,CAAuC,SAASA,MAAAA,CACnE,EAAE,SAAW,EAAA,QAAA,EAAU,KAAQ,GAAA,KAAA,EAAO,IAAO,GAAA,IAAA,EAAM,GAAG,IAAA,IACtD,GACA,EAAA;AACA,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,YAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,IAAI,CAAC,IAAM,EAAA;AACT,IAAO,OAAA,IAAA;AAAA;AAGT,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAA,CAAa,OAAO,CAAC,GAAG;AAAA,SAC3B;AAAA,QACA;AAAA,OACF;AAAA,MACA,aAAY,EAAA,OAAA;AAAA,MACZ,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Scrim.js","sources":["../src/scrim/Scrim.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { makePrefixer } from \"../utils\";\n\nimport scrimCss from \"./Scrim.css\";\n\nconst withBaseName = makePrefixer(\"saltScrim\");\n\nexport interface ScrimProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * If `true` the scrim is bound to the document viewport.\n   * The default value of this prop is false, and the default behavior is for Scrim to be bound to its parent container (nearest positioned ancestor).\n   */\n  fixed?: boolean;\n  /**\n   * If `true` the scrim is shown.\n   */\n  open?: boolean;\n}\n\nexport const Scrim = forwardRef<HTMLDivElement, ScrimProps>(function Scrim(\n  { className, children, fixed = false, open = true, ...rest },\n  ref,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-scrim\",\n    css: scrimCss,\n    window: targetWindow,\n  });\n\n  if (!open) {\n    return null;\n  }\n\n  return (\n    <div\n      className={clsx(\n        withBaseName(),\n        {\n          [withBaseName(\"fixed\")]: fixed,\n        },\n        className,\n      )}\n      data-testid=\"scrim\"\n      ref={ref}\n      {...rest}\n    >\n      {children}\n    </div>\n  );\n});\n"],"names":["Scrim","scrimCss"],"mappings":";;;;;;;;;;;;AAQA,MAAM,YAAA,GAAe,aAAa,WAAW,CAAA;AActC,MAAM,KAAQ,GAAA,UAAA,CAAuC,SAASA,MAAAA,CACnE,EAAE,SAAW,EAAA,QAAA,EAAU,KAAQ,GAAA,KAAA,EAAO,IAAO,GAAA,IAAA,EAAM,GAAG,IAAA,IACtD,GACA,EAAA;AACA,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,YAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,IAAI,CAAC,IAAM,EAAA;AACT,IAAO,OAAA,IAAA;AAAA;AAGT,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAA,CAAa,OAAO,CAAC,GAAG;AAAA,SAC3B;AAAA,QACA;AAAA,OACF;AAAA,MACA,aAAY,EAAA,OAAA;AAAA,MACZ,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}

package/dist-es/segmented-button-group/SegmentedButtonGroup.css.js

@@ -1,4 +1,4 @@
-var css_248z = ".saltSegmentedButtonGroup {\n  display: flex;\n  flex-direction: row;\n  background: var(--button-background);\n  gap: var(--salt-size-border);\n}\n\n.saltSegmentedButtonGroup > .saltButton:not(:last-of-type)::after {\n  content: \"\";\n  width: var(--salt-size-border);\n  position: absolute;\n  background: var(--button-background);\n  /* Accomodate button border */\n  right: calc(var(--salt-size-border) * -2);\n  top: calc(var(--salt-size-border) * -1);\n  bottom: calc(var(--salt-size-border) * -1);\n}\n\n.saltSegmentedButtonGroup > .saltButton:not(:first-of-type)::before {\n  content: \"\";\n  width: var(--salt-size-border);\n  position: absolute;\n  background: var(--salt-separable-primary-borderColor);\n  /* Accomodate button border */\n  left: calc(var(--salt-size-border) * -2);\n  top: calc(var(--salt-size-border) * -1);\n  bottom: calc(var(--salt-size-border) * -1);\n}\n\n.saltSegmentedButtonGroup > .saltButton:not(:first-of-type) {\n  border-bottom-left-radius: 0;\n  border-top-left-radius: 0;\n}\n\n.saltSegmentedButtonGroup > .saltButton:not(:last-of-type) {\n  border-bottom-right-radius: 0;\n  border-top-right-radius: 0;\n}\n";
+var css_248z = ".saltSegmentedButtonGroup {\n  display: flex;\n  flex-direction: row;\n  background: var(--button-background);\n  gap: var(--salt-spacing-fixed-100);\n}\n\n.saltSegmentedButtonGroup > .saltButton:not(:last-of-type)::after {\n  content: \"\";\n  width: var(--salt-spacing-fixed-100);\n  position: absolute;\n  background: var(--button-background);\n  /* Accomodate button border */\n  right: calc(var(--salt-size-fixed-100) * -2);\n  top: calc(var(--salt-size-fixed-100) * -1);\n  bottom: calc(var(--salt-size-fixed-100) * -1);\n}\n\n.saltSegmentedButtonGroup > .saltButton:not(:first-of-type)::before {\n  content: \"\";\n  width: var(--salt-spacing-fixed-100);\n  position: absolute;\n  background: var(--salt-separable-primary-borderColor);\n  /* Accomodate button border */\n  left: calc(var(--salt-size-fixed-100) * -2);\n  top: calc(var(--salt-size-fixed-100) * -1);\n  bottom: calc(var(--salt-size-fixed-100) * -1);\n}\n\n.saltSegmentedButtonGroup > .saltButton:not(:first-of-type) {\n  border-bottom-left-radius: 0;\n  border-top-left-radius: 0;\n}\n\n.saltSegmentedButtonGroup > .saltButton:not(:last-of-type) {\n  border-bottom-right-radius: 0;\n  border-top-right-radius: 0;\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=SegmentedButtonGroup.css.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"SemanticIconProvider.js","sources":["../src/semantic-icon-provider/SemanticIconProvider.tsx"],"sourcesContent":["import {\n  CalendarIcon,\n  ChevronDownIcon,\n  ChevronLeftIcon,\n  ChevronRightIcon,\n  ChevronUpIcon,\n  CloseIcon,\n  ErrorSolidIcon,\n  InfoSolidIcon,\n  LockedIcon,\n  OverflowMenuIcon,\n  ProgressInprogressIcon,\n  StepActiveIcon,\n  StepDefaultIcon,\n  StepSuccessIcon,\n  SuccessTickIcon,\n  TearOutIcon,\n  TriangleDownIcon,\n  TriangleUpIcon,\n  UploadIcon,\n  UserSolidIcon,\n  WarningSolidIcon,\n} from \"@salt-ds/icons\";\nimport {\n  type ElementType,\n  type ReactNode,\n  createContext,\n  useContext,\n} from \"react\";\n\nexport type SemanticIconMap = {\n  ExpandIcon: ElementType;\n  CollapseIcon: ElementType;\n  ExpandGroupIcon: ElementType;\n  CollapseGroupIcon: ElementType;\n  NextIcon: ElementType;\n  PreviousIcon: ElementType;\n  IncreaseIcon: ElementType;\n  DecreaseIcon: ElementType;\n  UploadIcon: ElementType;\n  ErrorIcon: ElementType;\n  SuccessIcon: ElementType;\n  InfoIcon: ElementType;\n  WarningIcon: ElementType;\n  OverflowIcon: ElementType;\n  UserIcon: ElementType;\n  CalendarIcon: ElementType;\n  CloseIcon: ElementType;\n  ExternalIcon: ElementType;\n  PendingIcon: ElementType;\n  ActiveIcon: ElementType;\n  CompletedIcon: ElementType;\n  LockedIcon: ElementType;\n  InProgressIcon: ElementType;\n};\n\nexport interface SemanticIconProviderProps {\n  /**\n   * Custom mapping of icon names to components. Overrides default icons if provided.\n   */\n  iconMap?: Partial<SemanticIconMap>;\n\n  /**\n   * Child elements that will use the provided icons.\n   */\n  children: ReactNode;\n}\n\nconst defaultIconMap: SemanticIconMap = {\n  ExpandIcon: ChevronDownIcon,\n  CollapseIcon: ChevronUpIcon,\n  ExpandGroupIcon: ChevronRightIcon,\n  CollapseGroupIcon: ChevronDownIcon,\n  NextIcon: ChevronRightIcon,\n  PreviousIcon: ChevronLeftIcon,\n  IncreaseIcon: TriangleUpIcon,\n  DecreaseIcon: TriangleDownIcon,\n  UploadIcon,\n  ErrorIcon: ErrorSolidIcon,\n  SuccessIcon: SuccessTickIcon,\n  InfoIcon: InfoSolidIcon,\n  WarningIcon: WarningSolidIcon,\n  OverflowIcon: OverflowMenuIcon,\n  UserIcon: UserSolidIcon,\n  CalendarIcon: CalendarIcon,\n  CloseIcon: CloseIcon,\n  ExternalIcon: TearOutIcon,\n  PendingIcon: StepDefaultIcon,\n  ActiveIcon: StepActiveIcon,\n  CompletedIcon: StepSuccessIcon,\n  LockedIcon: LockedIcon,\n  InProgressIcon: ProgressInprogressIcon,\n};\n\nconst SemanticIconContext = createContext<SemanticIconMap>(defaultIconMap);\n\nexport const SemanticIconProvider = ({\n  iconMap = {},\n  children,\n}: SemanticIconProviderProps) => (\n  <SemanticIconContext.Provider value={{ ...defaultIconMap, ...iconMap }}>\n    {children}\n  </SemanticIconContext.Provider>\n);\n\nexport const useIcon = () => {\n  const context = useContext(SemanticIconContext);\n  return context || defaultIconMap;\n};\n"],"names":[],"mappings":";;;;AAoEA,MAAM,cAAkC,GAAA;AAAA,EACtC,UAAY,EAAA,eAAA;AAAA,EACZ,YAAc,EAAA,aAAA;AAAA,EACd,eAAiB,EAAA,gBAAA;AAAA,EACjB,iBAAmB,EAAA,eAAA;AAAA,EACnB,QAAU,EAAA,gBAAA;AAAA,EACV,YAAc,EAAA,eAAA;AAAA,EACd,YAAc,EAAA,cAAA;AAAA,EACd,YAAc,EAAA,gBAAA;AAAA,EACd,UAAA;AAAA,EACA,SAAW,EAAA,cAAA;AAAA,EACX,WAAa,EAAA,eAAA;AAAA,EACb,QAAU,EAAA,aAAA;AAAA,EACV,WAAa,EAAA,gBAAA;AAAA,EACb,YAAc,EAAA,gBAAA;AAAA,EACd,QAAU,EAAA,aAAA;AAAA,EACV,YAAA;AAAA,EACA,SAAA;AAAA,EACA,YAAc,EAAA,WAAA;AAAA,EACd,WAAa,EAAA,eAAA;AAAA,EACb,UAAY,EAAA,cAAA;AAAA,EACZ,aAAe,EAAA,eAAA;AAAA,EACf,UAAA;AAAA,EACA,cAAgB,EAAA;AAClB,CAAA;AAEA,MAAM,mBAAA,GAAsB,cAA+B,cAAc,CAAA;AAElE,MAAM,uBAAuB,CAAC;AAAA,EACnC,UAAU,EAAC;AAAA,EACX;AACF,CACE,qBAAA,GAAA,CAAC,mBAAoB,CAAA,QAAA,EAApB,EAA6B,KAAA,EAAO,EAAE,GAAG,cAAgB,EAAA,GAAG,OAAQ,EAAA,EAClE,QACH,EAAA;AAGK,MAAM,UAAU,MAAM;AAC3B,EAAM,MAAA,OAAA,GAAU,WAAW,mBAAmB,CAAA;AAC9C,EAAA,OAAO,OAAW,IAAA,cAAA;AACpB;;;;"}
+{"version":3,"file":"SemanticIconProvider.js","sources":["../src/semantic-icon-provider/SemanticIconProvider.tsx"],"sourcesContent":["import {\n  CalendarIcon,\n  ChevronDownIcon,\n  ChevronLeftIcon,\n  ChevronRightIcon,\n  ChevronUpIcon,\n  CloseIcon,\n  ErrorSolidIcon,\n  InfoSolidIcon,\n  LockedIcon,\n  OverflowMenuIcon,\n  ProgressInprogressIcon,\n  StepActiveIcon,\n  StepDefaultIcon,\n  StepSuccessIcon,\n  SuccessTickIcon,\n  TearOutIcon,\n  TriangleDownIcon,\n  TriangleUpIcon,\n  UploadIcon,\n  UserSolidIcon,\n  WarningSolidIcon,\n} from \"@salt-ds/icons\";\nimport {\n  createContext,\n  type ElementType,\n  type ReactNode,\n  useContext,\n} from \"react\";\n\nexport type SemanticIconMap = {\n  ExpandIcon: ElementType;\n  CollapseIcon: ElementType;\n  ExpandGroupIcon: ElementType;\n  CollapseGroupIcon: ElementType;\n  NextIcon: ElementType;\n  PreviousIcon: ElementType;\n  IncreaseIcon: ElementType;\n  DecreaseIcon: ElementType;\n  UploadIcon: ElementType;\n  ErrorIcon: ElementType;\n  SuccessIcon: ElementType;\n  InfoIcon: ElementType;\n  WarningIcon: ElementType;\n  OverflowIcon: ElementType;\n  UserIcon: ElementType;\n  CalendarIcon: ElementType;\n  CloseIcon: ElementType;\n  ExternalIcon: ElementType;\n  PendingIcon: ElementType;\n  ActiveIcon: ElementType;\n  CompletedIcon: ElementType;\n  LockedIcon: ElementType;\n  InProgressIcon: ElementType;\n};\n\nexport interface SemanticIconProviderProps {\n  /**\n   * Custom mapping of icon names to components. Overrides default icons if provided.\n   */\n  iconMap?: Partial<SemanticIconMap>;\n\n  /**\n   * Child elements that will use the provided icons.\n   */\n  children: ReactNode;\n}\n\nconst defaultIconMap: SemanticIconMap = {\n  ExpandIcon: ChevronDownIcon,\n  CollapseIcon: ChevronUpIcon,\n  ExpandGroupIcon: ChevronRightIcon,\n  CollapseGroupIcon: ChevronDownIcon,\n  NextIcon: ChevronRightIcon,\n  PreviousIcon: ChevronLeftIcon,\n  IncreaseIcon: TriangleUpIcon,\n  DecreaseIcon: TriangleDownIcon,\n  UploadIcon,\n  ErrorIcon: ErrorSolidIcon,\n  SuccessIcon: SuccessTickIcon,\n  InfoIcon: InfoSolidIcon,\n  WarningIcon: WarningSolidIcon,\n  OverflowIcon: OverflowMenuIcon,\n  UserIcon: UserSolidIcon,\n  CalendarIcon: CalendarIcon,\n  CloseIcon: CloseIcon,\n  ExternalIcon: TearOutIcon,\n  PendingIcon: StepDefaultIcon,\n  ActiveIcon: StepActiveIcon,\n  CompletedIcon: StepSuccessIcon,\n  LockedIcon: LockedIcon,\n  InProgressIcon: ProgressInprogressIcon,\n};\n\nconst SemanticIconContext = createContext<SemanticIconMap>(defaultIconMap);\n\nexport const SemanticIconProvider = ({\n  iconMap = {},\n  children,\n}: SemanticIconProviderProps) => (\n  <SemanticIconContext.Provider value={{ ...defaultIconMap, ...iconMap }}>\n    {children}\n  </SemanticIconContext.Provider>\n);\n\nexport const useIcon = () => {\n  const context = useContext(SemanticIconContext);\n  return context || defaultIconMap;\n};\n"],"names":[],"mappings":";;;;AAoEA,MAAM,cAAkC,GAAA;AAAA,EACtC,UAAY,EAAA,eAAA;AAAA,EACZ,YAAc,EAAA,aAAA;AAAA,EACd,eAAiB,EAAA,gBAAA;AAAA,EACjB,iBAAmB,EAAA,eAAA;AAAA,EACnB,QAAU,EAAA,gBAAA;AAAA,EACV,YAAc,EAAA,eAAA;AAAA,EACd,YAAc,EAAA,cAAA;AAAA,EACd,YAAc,EAAA,gBAAA;AAAA,EACd,UAAA;AAAA,EACA,SAAW,EAAA,cAAA;AAAA,EACX,WAAa,EAAA,eAAA;AAAA,EACb,QAAU,EAAA,aAAA;AAAA,EACV,WAAa,EAAA,gBAAA;AAAA,EACb,YAAc,EAAA,gBAAA;AAAA,EACd,QAAU,EAAA,aAAA;AAAA,EACV,YAAA;AAAA,EACA,SAAA;AAAA,EACA,YAAc,EAAA,WAAA;AAAA,EACd,WAAa,EAAA,eAAA;AAAA,EACb,UAAY,EAAA,cAAA;AAAA,EACZ,aAAe,EAAA,eAAA;AAAA,EACf,UAAA;AAAA,EACA,cAAgB,EAAA;AAClB,CAAA;AAEA,MAAM,mBAAA,GAAsB,cAA+B,cAAc,CAAA;AAElE,MAAM,uBAAuB,CAAC;AAAA,EACnC,UAAU,EAAC;AAAA,EACX;AACF,CACE,qBAAA,GAAA,CAAC,mBAAoB,CAAA,QAAA,EAApB,EAA6B,KAAA,EAAO,EAAE,GAAG,cAAgB,EAAA,GAAG,OAAQ,EAAA,EAClE,QACH,EAAA;AAGK,MAAM,UAAU,MAAM;AAC3B,EAAM,MAAA,OAAA,GAAU,WAAW,mBAAmB,CAAA;AAC9C,EAAA,OAAO,OAAW,IAAA,cAAA;AACpB;;;;"}

package/dist-es/skip-link/SkipLink.js

@@ -8,8 +8,8 @@ import '../utils/useFloatingUI/useFloatingUI.js';
 import '../utils/useId.js';
 import '../salt-provider/SaltProvider.js';
 import '../viewport/ViewportProvider.js';
-import css_248z from './SkipLink.css.js';
 import { useManageFocusOnTarget } from './internal/useManageFocusOnTarget.js';
+import css_248z from './SkipLink.css.js';
 
 const withBaseName = makePrefixer("saltSkipLink");
 const SkipLink = forwardRef(

package/dist-es/skip-link/SkipLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"SkipLink.js","sources":["../src/skip-link/SkipLink.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport skipLinkCss from \"./SkipLink.css\";\nimport { useManageFocusOnTarget } from \"./internal/useManageFocusOnTarget\";\n\ninterface SkipLinkProps extends ComponentPropsWithoutRef<\"a\"> {\n  /**\n   * The ID of the target element to apply focus when the link is clicked.\n   * If the element with this ID is not found, the SkipLink will not be rendered.\n   */\n  targetId: string;\n}\n\nconst withBaseName = makePrefixer(\"saltSkipLink\");\n\nexport const SkipLink = forwardRef<HTMLAnchorElement, SkipLinkProps>(\n  function SkipLink(\n    { className, targetId, children, onKeyUp, onBlur, onClick, ...rest },\n    ref,\n  ) {\n    const [isTargetAvailable, setIsTargetAvailable] = useState(false);\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-skip-link\",\n      css: skipLinkCss,\n      window: targetWindow,\n    });\n\n    const targetRef = useRef<HTMLElement | null>(null);\n\n    useEffect(() => {\n      if (targetWindow) {\n        targetRef.current = targetWindow.document.getElementById(targetId);\n      }\n      setIsTargetAvailable(!!targetRef.current);\n    }, [targetId, targetWindow]);\n\n    const eventHandlers = useManageFocusOnTarget({\n      onKeyUp,\n      onBlur,\n      onClick,\n      targetRef,\n      targetClass: withBaseName(\"target\"),\n    });\n\n    if (!isTargetAvailable) return null;\n    return (\n      <a\n        className={clsx(withBaseName(), className)}\n        href={`#${targetId}`}\n        ref={ref}\n        target=\"_self\"\n        {...eventHandlers}\n        {...rest}\n      >\n        {children}\n      </a>\n    );\n  },\n);\n"],"names":["SkipLink","skipLinkCss"],"mappings":";;;;;;;;;;;;;AAsBA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA;AAEzC,MAAM,QAAW,GAAA,UAAA;AAAA,EACtB,SAASA,SAAAA,CACP,EAAE,SAAA,EAAW,QAAU,EAAA,QAAA,EAAU,OAAS,EAAA,MAAA,EAAQ,OAAS,EAAA,GAAG,IAAK,EAAA,EACnE,GACA,EAAA;AACA,IAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,GAAI,SAAS,KAAK,CAAA;AAChE,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAM,MAAA,SAAA,GAAY,OAA2B,IAAI,CAAA;AAEjD,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,YAAc,EAAA;AAChB,QAAA,SAAA,CAAU,OAAU,GAAA,YAAA,CAAa,QAAS,CAAA,cAAA,CAAe,QAAQ,CAAA;AAAA;AAEnE,MAAqB,oBAAA,CAAA,CAAC,CAAC,SAAA,CAAU,OAAO,CAAA;AAAA,KACvC,EAAA,CAAC,QAAU,EAAA,YAAY,CAAC,CAAA;AAE3B,IAAA,MAAM,gBAAgB,sBAAuB,CAAA;AAAA,MAC3C,OAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,EAAa,aAAa,QAAQ;AAAA,KACnC,CAAA;AAED,IAAI,IAAA,CAAC,mBAA0B,OAAA,IAAA;AAC/B,IACE,uBAAA,GAAA;AAAA,MAAC,GAAA;AAAA,MAAA;AAAA,QACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,IAAA,EAAM,IAAI,QAAQ,CAAA,CAAA;AAAA,QAClB,GAAA;AAAA,QACA,MAAO,EAAA,OAAA;AAAA,QACN,GAAG,aAAA;AAAA,QACH,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA;AAGN;;;;"}
+{"version":3,"file":"SkipLink.js","sources":["../src/skip-link/SkipLink.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { useManageFocusOnTarget } from \"./internal/useManageFocusOnTarget\";\nimport skipLinkCss from \"./SkipLink.css\";\n\ninterface SkipLinkProps extends ComponentPropsWithoutRef<\"a\"> {\n  /**\n   * The ID of the target element to apply focus when the link is clicked.\n   * If the element with this ID is not found, the SkipLink will not be rendered.\n   */\n  targetId: string;\n}\n\nconst withBaseName = makePrefixer(\"saltSkipLink\");\n\nexport const SkipLink = forwardRef<HTMLAnchorElement, SkipLinkProps>(\n  function SkipLink(\n    { className, targetId, children, onKeyUp, onBlur, onClick, ...rest },\n    ref,\n  ) {\n    const [isTargetAvailable, setIsTargetAvailable] = useState(false);\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-skip-link\",\n      css: skipLinkCss,\n      window: targetWindow,\n    });\n\n    const targetRef = useRef<HTMLElement | null>(null);\n\n    useEffect(() => {\n      if (targetWindow) {\n        targetRef.current = targetWindow.document.getElementById(targetId);\n      }\n      setIsTargetAvailable(!!targetRef.current);\n    }, [targetId, targetWindow]);\n\n    const eventHandlers = useManageFocusOnTarget({\n      onKeyUp,\n      onBlur,\n      onClick,\n      targetRef,\n      targetClass: withBaseName(\"target\"),\n    });\n\n    if (!isTargetAvailable) return null;\n    return (\n      <a\n        className={clsx(withBaseName(), className)}\n        href={`#${targetId}`}\n        ref={ref}\n        target=\"_self\"\n        {...eventHandlers}\n        {...rest}\n      >\n        {children}\n      </a>\n    );\n  },\n);\n"],"names":["SkipLink","skipLinkCss"],"mappings":";;;;;;;;;;;;;AAsBA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA;AAEzC,MAAM,QAAW,GAAA,UAAA;AAAA,EACtB,SAASA,SAAAA,CACP,EAAE,SAAA,EAAW,QAAU,EAAA,QAAA,EAAU,OAAS,EAAA,MAAA,EAAQ,OAAS,EAAA,GAAG,IAAK,EAAA,EACnE,GACA,EAAA;AACA,IAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,GAAI,SAAS,KAAK,CAAA;AAChE,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAM,MAAA,SAAA,GAAY,OAA2B,IAAI,CAAA;AAEjD,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,YAAc,EAAA;AAChB,QAAA,SAAA,CAAU,OAAU,GAAA,YAAA,CAAa,QAAS,CAAA,cAAA,CAAe,QAAQ,CAAA;AAAA;AAEnE,MAAqB,oBAAA,CAAA,CAAC,CAAC,SAAA,CAAU,OAAO,CAAA;AAAA,KACvC,EAAA,CAAC,QAAU,EAAA,YAAY,CAAC,CAAA;AAE3B,IAAA,MAAM,gBAAgB,sBAAuB,CAAA;AAAA,MAC3C,OAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,EAAa,aAAa,QAAQ;AAAA,KACnC,CAAA;AAED,IAAI,IAAA,CAAC,mBAA0B,OAAA,IAAA;AAC/B,IACE,uBAAA,GAAA;AAAA,MAAC,GAAA;AAAA,MAAA;AAAA,QACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,IAAA,EAAM,IAAI,QAAQ,CAAA,CAAA;AAAA,QAClB,GAAA;AAAA,QACA,MAAO,EAAA,OAAA;AAAA,QACN,GAAG,aAAA;AAAA,QACH,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA;AAGN;;;;"}

package/dist-es/slider/RangeSlider.js

@@ -50,10 +50,10 @@ const RangeSlider = forwardRef(
       disabled: formFieldDisabled
     } = useFormFieldProps();
     const disabled = formFieldDisabled || disabledProp;
-    const inputRefs = Array.from(
-      { length: 2 },
-      () => useRef(null)
-    );
+    const inputRefs = [
+      useRef(null),
+      useRef(null)
+    ];
     const value = clampRange(
       valueState,
       max,

package/dist-es/slider/RangeSlider.js.map

@@ -1 +1 @@
-{"version":3,"file":"RangeSlider.js","sources":["../src/slider/RangeSlider.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  type ChangeEvent,\n  type HTMLAttributes,\n  forwardRef,\n  useRef,\n} from \"react\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { useControlled } from \"../utils\";\nimport { SliderThumb } from \"./internal/SliderThumb\";\nimport { SliderTrack } from \"./internal/SliderTrack\";\nimport { useRangeSliderThumb } from \"./internal/useRangeSliderThumb\";\nimport { calculatePercentage, clampRange, toFloat } from \"./internal/utils\";\n\nexport interface RangeSliderProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\" | \"defaultValue\"> {\n  /**\n   * Accessible text to announce maximum value label.\n   */\n  accessibleMaxText?: string;\n  /**\n   * Accessible text to announce minimum value label.\n   */\n  accessibleMinText?: string;\n  /**\n   * When minimum and maximum labels are defined, ensure\n   * they are confined within the boundary of the slider.\n   */\n  constrainLabelPosition?: boolean;\n  /**\n   * The number of allowed decimal places\n   * @default 2\n   */\n  decimalPlaces?: number;\n  /**\n   * The default value. Use when the component is not controlled.\n   * @default [min, min + (max - min) / 2]\n   */\n  defaultValue?: [number, number];\n  /**\n   * Disable the slider.\n   */\n  disabled?: boolean;\n  /**\n   * Show visual ticks above the marks.\n   */\n  showTicks?: boolean;\n  /**\n   * A callback to format the display value in the tooltip, min and max labels\n   * and the `aria-valuetext` attribute.\n   */\n  format?: (value: number) => string | number;\n  /**\n   * Marks that are displayed under the track.\n   */\n  marks?: { label: string; value: number }[];\n  /**\n   * Maximum slider value.\n   * @default 10\n   */\n  max?: number;\n  /**\n   * Minimum slider value.\n   * @default 0\n   */\n  min?: number;\n  /**\n   * Label for maximum value.\n   */\n  maxLabel?: string;\n  /**\n   * Label for minimum value.\n   */\n  minLabel?: string;\n  /**\n   * Callback called when slider value is changed.\n   * It provides a generic event and the current value of the slider.\n   */\n  onChange?: (event: Event, value: [number, number]) => void;\n  /**\n   * Callback called when the slider is stopped from being dragged or\n   * its value is changed from the keyboard. It provides a generic\n   * event and the current value of the slider.\n   */\n  onChangeEnd?: (event: Event, value: [number, number]) => void;\n  /**\n   * Restrict slider value to marks only. The step will be ignored.\n   */\n  restrictToMarks?: boolean;\n  /**\n   * Show the slider value in a tooltip when the thumb is hovered.\n   * @default true\n   */\n  showTooltip?: boolean;\n  /**\n   * Minimum interval the slider thumb can move.\n   * @default 1\n   */\n  step?: number;\n  /**\n   * Maximum interval the slider thumb can move when using PageUp and PageDown keys.\n   * @default 2\n   */\n  stepMultiplier?: number;\n  /**\n   * Value of the slider, to be used when in a controlled state.\n   */\n  value?: [number, number];\n}\n\nexport const RangeSlider = forwardRef<HTMLDivElement, RangeSliderProps>(\n  function RangeSlider(\n    {\n      \"aria-label\": ariaLabel,\n      \"aria-labelledby\": ariaLabelledBy,\n      \"aria-valuetext\": ariaValueText,\n      accessibleMaxText,\n      accessibleMinText,\n      decimalPlaces = 2,\n      disabled: disabledProp = false,\n      format,\n      marks,\n      max = 100,\n      min = 0,\n      maxLabel,\n      minLabel,\n      onChange,\n      onChangeEnd,\n      restrictToMarks = false,\n      showTooltip = true,\n      step = 1,\n      stepMultiplier = 2,\n      value: valueProp,\n      defaultValue = [min, min + (max - min) / 2],\n      ...rest\n    },\n    ref,\n  ) {\n    const [valueState, setValue] = useControlled({\n      controlled: valueProp,\n      default: defaultValue,\n      name: \"RangeSlider\",\n      state: \"value\",\n    });\n    const lastValueRef = useRef<[number, number]>(valueState);\n\n    const {\n      a11yProps: { \"aria-labelledby\": formFieldLabelledBy } = {},\n      disabled: formFieldDisabled,\n    } = useFormFieldProps();\n\n    const disabled = formFieldDisabled || disabledProp;\n    const inputRefs = Array.from({ length: 2 }, () =>\n      useRef<HTMLInputElement>(null),\n    );\n    const value: [number, number] = clampRange(\n      valueState,\n      max,\n      min,\n      step,\n      decimalPlaces,\n      marks,\n      restrictToMarks,\n    );\n    const progressPercentageStart = calculatePercentage(value[0], max, min);\n    const progressPercentageEnd = calculatePercentage(value[1], max, min);\n\n    const handleInputChange = (\n      event: ChangeEvent<HTMLInputElement>,\n      thumbIndex: number,\n    ) => {\n      const parsedValue = toFloat(event.target.value);\n      const values = preventThumbOverlap(parsedValue, value, thumbIndex);\n      const haveValuesChanged =\n        values[0] !== lastValueRef.current[0] ||\n        values[1] !== lastValueRef.current[1];\n      if (haveValuesChanged) {\n        const values = preventThumbOverlap(parsedValue, value, thumbIndex);\n        setValue(values as [number, number]);\n        onChange?.(event.nativeEvent, values as [number, number]);\n        onChangeEnd?.(event.nativeEvent, values as [number, number]);\n        lastValueRef.current = values;\n      }\n    };\n\n    const {\n      handleBlur,\n      handleFocus,\n      handleKeydownOnThumb,\n      handlePointerDownOnThumb,\n      handlePointerDownOnTrack,\n      isDragging,\n      isFocusVisible,\n      sliderRef,\n      thumbIndexState,\n      preventThumbOverlap,\n    } = useRangeSliderThumb({\n      decimalPlaces,\n      handleInputChange,\n      inputRefs,\n      marks,\n      min,\n      max,\n      step,\n      value,\n      onChange,\n      onChangeEnd,\n      restrictToMarks,\n      setValue,\n      stepMultiplier,\n    });\n\n    const thumbProps = {\n      \"aria-label\": ariaLabel,\n      \"aria-labelledby\": clsx(formFieldLabelledBy, ariaLabelledBy),\n      \"aria-valuemax\": max,\n      \"aria-valuemin\": min,\n      \"aria-valuetext\": ariaValueText,\n      accessibleMaxText: accessibleMaxText,\n      accessibleMinText: accessibleMinText,\n      disabled: disabled,\n      format: format,\n      max: max,\n      maxLabel: maxLabel,\n      min: min,\n      minLabel: minLabel,\n      restrictToMarks: restrictToMarks,\n      showTooltip: showTooltip,\n      step: step,\n      stepMultiplier: stepMultiplier,\n      sliderValue: value,\n    };\n\n    return (\n      <SliderTrack\n        disabled={disabled}\n        format={format}\n        handlePointerDown={handlePointerDownOnTrack}\n        isDragging={isDragging}\n        isRange\n        marks={marks}\n        min={min}\n        minLabel={minLabel}\n        max={max}\n        maxLabel={maxLabel}\n        progressPercentageRange={[\n          progressPercentageStart,\n          progressPercentageEnd,\n        ]}\n        ref={ref}\n        sliderRef={sliderRef}\n        {...rest}\n      >\n        <SliderThumb\n          index={0}\n          handleInputChange={(event) => handleInputChange(event, 0)}\n          handlePointerDown={(event) => handlePointerDownOnThumb(event, 0)}\n          handleKeydownOnThumb={(event) => handleKeydownOnThumb(event, 0)}\n          offsetPercentage={`${calculatePercentage(value[0], max, min)}%`}\n          trackDragging={isDragging && thumbIndexState === 0}\n          isFocusVisible={isFocusVisible && thumbIndexState === 0}\n          inputRef={inputRefs[0]}\n          onFocus={() => handleFocus(0)}\n          onBlur={() => handleBlur(0)}\n          {...thumbProps}\n        />\n        <SliderThumb\n          index={1}\n          handleInputChange={(event) => handleInputChange(event, 1)}\n          handlePointerDown={(event) => handlePointerDownOnThumb(event, 1)}\n          handleKeydownOnThumb={(event) => handleKeydownOnThumb(event, 1)}\n          offsetPercentage={`${calculatePercentage(value[1], max, min)}%`}\n          trackDragging={isDragging && thumbIndexState === 1}\n          isFocusVisible={isFocusVisible && thumbIndexState === 1}\n          inputRef={inputRefs[1]}\n          onFocus={() => handleFocus(1)}\n          onBlur={() => handleBlur(1)}\n          {...thumbProps}\n        />\n      </SliderTrack>\n    );\n  },\n);\n"],"names":["RangeSlider","values"],"mappings":"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"}
+{"version":3,"file":"RangeSlider.js","sources":["../src/slider/RangeSlider.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  type ChangeEvent,\n  forwardRef,\n  type HTMLAttributes,\n  useRef,\n} from \"react\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { useControlled } from \"../utils\";\nimport { SliderThumb } from \"./internal/SliderThumb\";\nimport { SliderTrack } from \"./internal/SliderTrack\";\nimport { useRangeSliderThumb } from \"./internal/useRangeSliderThumb\";\nimport { calculatePercentage, clampRange, toFloat } from \"./internal/utils\";\n\nexport interface RangeSliderProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\" | \"defaultValue\"> {\n  /**\n   * Accessible text to announce maximum value label.\n   */\n  accessibleMaxText?: string;\n  /**\n   * Accessible text to announce minimum value label.\n   */\n  accessibleMinText?: string;\n  /**\n   * When minimum and maximum labels are defined, ensure\n   * they are confined within the boundary of the slider.\n   */\n  constrainLabelPosition?: boolean;\n  /**\n   * The number of allowed decimal places\n   * @default 2\n   */\n  decimalPlaces?: number;\n  /**\n   * The default value. Use when the component is not controlled.\n   * @default [min, min + (max - min) / 2]\n   */\n  defaultValue?: [number, number];\n  /**\n   * Disable the slider.\n   */\n  disabled?: boolean;\n  /**\n   * Show visual ticks above the marks.\n   */\n  showTicks?: boolean;\n  /**\n   * A callback to format the display value in the tooltip, min and max labels\n   * and the `aria-valuetext` attribute.\n   */\n  format?: (value: number) => string | number;\n  /**\n   * Marks that are displayed under the track.\n   */\n  marks?: { label: string; value: number }[];\n  /**\n   * Maximum slider value.\n   * @default 10\n   */\n  max?: number;\n  /**\n   * Minimum slider value.\n   * @default 0\n   */\n  min?: number;\n  /**\n   * Label for maximum value.\n   */\n  maxLabel?: string;\n  /**\n   * Label for minimum value.\n   */\n  minLabel?: string;\n  /**\n   * Callback called when slider value is changed.\n   * It provides a generic event and the current value of the slider.\n   */\n  onChange?: (event: Event, value: [number, number]) => void;\n  /**\n   * Callback called when the slider is stopped from being dragged or\n   * its value is changed from the keyboard. It provides a generic\n   * event and the current value of the slider.\n   */\n  onChangeEnd?: (event: Event, value: [number, number]) => void;\n  /**\n   * Restrict slider value to marks only. The step will be ignored.\n   */\n  restrictToMarks?: boolean;\n  /**\n   * Show the slider value in a tooltip when the thumb is hovered.\n   * @default true\n   */\n  showTooltip?: boolean;\n  /**\n   * Minimum interval the slider thumb can move.\n   * @default 1\n   */\n  step?: number;\n  /**\n   * Maximum interval the slider thumb can move when using PageUp and PageDown keys.\n   * @default 2\n   */\n  stepMultiplier?: number;\n  /**\n   * Value of the slider, to be used when in a controlled state.\n   */\n  value?: [number, number];\n}\n\nexport const RangeSlider = forwardRef<HTMLDivElement, RangeSliderProps>(\n  function RangeSlider(\n    {\n      \"aria-label\": ariaLabel,\n      \"aria-labelledby\": ariaLabelledBy,\n      \"aria-valuetext\": ariaValueText,\n      accessibleMaxText,\n      accessibleMinText,\n      decimalPlaces = 2,\n      disabled: disabledProp = false,\n      format,\n      marks,\n      max = 100,\n      min = 0,\n      maxLabel,\n      minLabel,\n      onChange,\n      onChangeEnd,\n      restrictToMarks = false,\n      showTooltip = true,\n      step = 1,\n      stepMultiplier = 2,\n      value: valueProp,\n      defaultValue = [min, min + (max - min) / 2],\n      ...rest\n    },\n    ref,\n  ) {\n    const [valueState, setValue] = useControlled({\n      controlled: valueProp,\n      default: defaultValue,\n      name: \"RangeSlider\",\n      state: \"value\",\n    });\n    const lastValueRef = useRef<[number, number]>(valueState);\n\n    const {\n      a11yProps: { \"aria-labelledby\": formFieldLabelledBy } = {},\n      disabled: formFieldDisabled,\n    } = useFormFieldProps();\n\n    const disabled = formFieldDisabled || disabledProp;\n    const inputRefs = [\n      useRef<HTMLInputElement>(null),\n      useRef<HTMLInputElement>(null),\n    ];\n    const value: [number, number] = clampRange(\n      valueState,\n      max,\n      min,\n      step,\n      decimalPlaces,\n      marks,\n      restrictToMarks,\n    );\n    const progressPercentageStart = calculatePercentage(value[0], max, min);\n    const progressPercentageEnd = calculatePercentage(value[1], max, min);\n\n    const handleInputChange = (\n      event: ChangeEvent<HTMLInputElement>,\n      thumbIndex: number,\n    ) => {\n      const parsedValue = toFloat(event.target.value);\n      const values = preventThumbOverlap(parsedValue, value, thumbIndex);\n      const haveValuesChanged =\n        values[0] !== lastValueRef.current[0] ||\n        values[1] !== lastValueRef.current[1];\n      if (haveValuesChanged) {\n        const values = preventThumbOverlap(parsedValue, value, thumbIndex);\n        setValue(values as [number, number]);\n        onChange?.(event.nativeEvent, values as [number, number]);\n        onChangeEnd?.(event.nativeEvent, values as [number, number]);\n        lastValueRef.current = values;\n      }\n    };\n\n    const {\n      handleBlur,\n      handleFocus,\n      handleKeydownOnThumb,\n      handlePointerDownOnThumb,\n      handlePointerDownOnTrack,\n      isDragging,\n      isFocusVisible,\n      sliderRef,\n      thumbIndexState,\n      preventThumbOverlap,\n    } = useRangeSliderThumb({\n      decimalPlaces,\n      handleInputChange,\n      inputRefs,\n      marks,\n      min,\n      max,\n      step,\n      value,\n      onChange,\n      onChangeEnd,\n      restrictToMarks,\n      setValue,\n      stepMultiplier,\n    });\n\n    const thumbProps = {\n      \"aria-label\": ariaLabel,\n      \"aria-labelledby\": clsx(formFieldLabelledBy, ariaLabelledBy),\n      \"aria-valuemax\": max,\n      \"aria-valuemin\": min,\n      \"aria-valuetext\": ariaValueText,\n      accessibleMaxText: accessibleMaxText,\n      accessibleMinText: accessibleMinText,\n      disabled: disabled,\n      format: format,\n      max: max,\n      maxLabel: maxLabel,\n      min: min,\n      minLabel: minLabel,\n      restrictToMarks: restrictToMarks,\n      showTooltip: showTooltip,\n      step: step,\n      stepMultiplier: stepMultiplier,\n      sliderValue: value,\n    };\n\n    return (\n      <SliderTrack\n        disabled={disabled}\n        format={format}\n        handlePointerDown={handlePointerDownOnTrack}\n        isDragging={isDragging}\n        isRange\n        marks={marks}\n        min={min}\n        minLabel={minLabel}\n        max={max}\n        maxLabel={maxLabel}\n        progressPercentageRange={[\n          progressPercentageStart,\n          progressPercentageEnd,\n        ]}\n        ref={ref}\n        sliderRef={sliderRef}\n        {...rest}\n      >\n        <SliderThumb\n          index={0}\n          handleInputChange={(event) => handleInputChange(event, 0)}\n          handlePointerDown={(event) => handlePointerDownOnThumb(event, 0)}\n          handleKeydownOnThumb={(event) => handleKeydownOnThumb(event, 0)}\n          offsetPercentage={`${calculatePercentage(value[0], max, min)}%`}\n          trackDragging={isDragging && thumbIndexState === 0}\n          isFocusVisible={isFocusVisible && thumbIndexState === 0}\n          inputRef={inputRefs[0]}\n          onFocus={() => handleFocus(0)}\n          onBlur={() => handleBlur(0)}\n          {...thumbProps}\n        />\n        <SliderThumb\n          index={1}\n          handleInputChange={(event) => handleInputChange(event, 1)}\n          handlePointerDown={(event) => handlePointerDownOnThumb(event, 1)}\n          handleKeydownOnThumb={(event) => handleKeydownOnThumb(event, 1)}\n          offsetPercentage={`${calculatePercentage(value[1], max, min)}%`}\n          trackDragging={isDragging && thumbIndexState === 1}\n          isFocusVisible={isFocusVisible && thumbIndexState === 1}\n          inputRef={inputRefs[1]}\n          onFocus={() => handleFocus(1)}\n          onBlur={() => handleBlur(1)}\n          {...thumbProps}\n        />\n      </SliderTrack>\n    );\n  },\n);\n"],"names":["RangeSlider","values"],"mappings":";;;;;;;;;;;;;;;AA8GO,MAAM,WAAc,GAAA,UAAA;AAAA,EACzB,SAASA,YACP,CAAA;AAAA,IACE,YAAc,EAAA,SAAA;AAAA,IACd,iBAAmB,EAAA,cAAA;AAAA,IACnB,gBAAkB,EAAA,aAAA;AAAA,IAClB,iBAAA;AAAA,IACA,iBAAA;AAAA,IACA,aAAgB,GAAA,CAAA;AAAA,IAChB,UAAU,YAAe,GAAA,KAAA;AAAA,IACzB,MAAA;AAAA,IACA,KAAA;AAAA,IACA,GAAM,GAAA,GAAA;AAAA,IACN,GAAM,GAAA,CAAA;AAAA,IACN,QAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAA;AAAA,IACA,eAAkB,GAAA,KAAA;AAAA,IAClB,WAAc,GAAA,IAAA;AAAA,IACd,IAAO,GAAA,CAAA;AAAA,IACP,cAAiB,GAAA,CAAA;AAAA,IACjB,KAAO,EAAA,SAAA;AAAA,IACP,eAAe,CAAC,GAAA,EAAK,GAAO,GAAA,CAAA,GAAA,GAAM,OAAO,CAAC,CAAA;AAAA,IAC1C,GAAG;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,CAAC,UAAA,EAAY,QAAQ,CAAA,GAAI,aAAc,CAAA;AAAA,MAC3C,UAAY,EAAA,SAAA;AAAA,MACZ,OAAS,EAAA,YAAA;AAAA,MACT,IAAM,EAAA,aAAA;AAAA,MACN,KAAO,EAAA;AAAA,KACR,CAAA;AACD,IAAM,MAAA,YAAA,GAAe,OAAyB,UAAU,CAAA;AAExD,IAAM,MAAA;AAAA,MACJ,SAAW,EAAA,EAAE,iBAAmB,EAAA,mBAAA,KAAwB,EAAC;AAAA,MACzD,QAAU,EAAA;AAAA,QACR,iBAAkB,EAAA;AAEtB,IAAA,MAAM,WAAW,iBAAqB,IAAA,YAAA;AACtC,IAAA,MAAM,SAAY,GAAA;AAAA,MAChB,OAAyB,IAAI,CAAA;AAAA,MAC7B,OAAyB,IAAI;AAAA,KAC/B;AACA,IAAA,MAAM,KAA0B,GAAA,UAAA;AAAA,MAC9B,UAAA;AAAA,MACA,GAAA;AAAA,MACA,GAAA;AAAA,MACA,IAAA;AAAA,MACA,aAAA;AAAA,MACA,KAAA;AAAA,MACA;AAAA,KACF;AACA,IAAA,MAAM,0BAA0B,mBAAoB,CAAA,KAAA,CAAM,CAAC,CAAA,EAAG,KAAK,GAAG,CAAA;AACtE,IAAA,MAAM,wBAAwB,mBAAoB,CAAA,KAAA,CAAM,CAAC,CAAA,EAAG,KAAK,GAAG,CAAA;AAEpE,IAAM,MAAA,iBAAA,GAAoB,CACxB,KAAA,EACA,UACG,KAAA;AACH,MAAA,MAAM,WAAc,GAAA,OAAA,CAAQ,KAAM,CAAA,MAAA,CAAO,KAAK,CAAA;AAC9C,MAAA,MAAM,MAAS,GAAA,mBAAA,CAAoB,WAAa,EAAA,KAAA,EAAO,UAAU,CAAA;AACjE,MAAA,MAAM,iBACJ,GAAA,MAAA,CAAO,CAAC,CAAA,KAAM,YAAa,CAAA,OAAA,CAAQ,CAAC,CAAA,IACpC,MAAO,CAAA,CAAC,CAAM,KAAA,YAAA,CAAa,QAAQ,CAAC,CAAA;AACtC,MAAA,IAAI,iBAAmB,EAAA;AACrB,QAAA,MAAMC,OAAS,GAAA,mBAAA,CAAoB,WAAa,EAAA,KAAA,EAAO,UAAU,CAAA;AACjE,QAAA,QAAA,CAASA,OAA0B,CAAA;AACnC,QAAA,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAW,MAAM,WAAaA,EAAAA,OAAAA,CAAAA;AAC9B,QAAA,WAAA,IAAA,IAAA,GAAA,MAAA,GAAA,WAAA,CAAc,MAAM,WAAaA,EAAAA,OAAAA,CAAAA;AACjC,QAAA,YAAA,CAAa,OAAUA,GAAAA,OAAAA;AAAA;AACzB,KACF;AAEA,IAAM,MAAA;AAAA,MACJ,UAAA;AAAA,MACA,WAAA;AAAA,MACA,oBAAA;AAAA,MACA,wBAAA;AAAA,MACA,wBAAA;AAAA,MACA,UAAA;AAAA,MACA,cAAA;AAAA,MACA,SAAA;AAAA,MACA,eAAA;AAAA,MACA;AAAA,QACE,mBAAoB,CAAA;AAAA,MACtB,aAAA;AAAA,MACA,iBAAA;AAAA,MACA,SAAA;AAAA,MACA,KAAA;AAAA,MACA,GAAA;AAAA,MACA,GAAA;AAAA,MACA,IAAA;AAAA,MACA,KAAA;AAAA,MACA,QAAA;AAAA,MACA,WAAA;AAAA,MACA,eAAA;AAAA,MACA,QAAA;AAAA,MACA;AAAA,KACD,CAAA;AAED,IAAA,MAAM,UAAa,GAAA;AAAA,MACjB,YAAc,EAAA,SAAA;AAAA,MACd,iBAAA,EAAmB,IAAK,CAAA,mBAAA,EAAqB,cAAc,CAAA;AAAA,MAC3D,eAAiB,EAAA,GAAA;AAAA,MACjB,eAAiB,EAAA,GAAA;AAAA,MACjB,gBAAkB,EAAA,aAAA;AAAA,MAClB,iBAAA;AAAA,MACA,iBAAA;AAAA,MACA,QAAA;AAAA,MACA,MAAA;AAAA,MACA,GAAA;AAAA,MACA,QAAA;AAAA,MACA,GAAA;AAAA,MACA,QAAA;AAAA,MACA,eAAA;AAAA,MACA,WAAA;AAAA,MACA,IAAA;AAAA,MACA,cAAA;AAAA,MACA,WAAa,EAAA;AAAA,KACf;AAEA,IACE,uBAAA,IAAA;AAAA,MAAC,WAAA;AAAA,MAAA;AAAA,QACC,QAAA;AAAA,QACA,MAAA;AAAA,QACA,iBAAmB,EAAA,wBAAA;AAAA,QACnB,UAAA;AAAA,QACA,OAAO,EAAA,IAAA;AAAA,QACP,KAAA;AAAA,QACA,GAAA;AAAA,QACA,QAAA;AAAA,QACA,GAAA;AAAA,QACA,QAAA;AAAA,QACA,uBAAyB,EAAA;AAAA,UACvB,uBAAA;AAAA,UACA;AAAA,SACF;AAAA,QACA,GAAA;AAAA,QACA,SAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,WAAA;AAAA,YAAA;AAAA,cACC,KAAO,EAAA,CAAA;AAAA,cACP,iBAAmB,EAAA,CAAC,KAAU,KAAA,iBAAA,CAAkB,OAAO,CAAC,CAAA;AAAA,cACxD,iBAAmB,EAAA,CAAC,KAAU,KAAA,wBAAA,CAAyB,OAAO,CAAC,CAAA;AAAA,cAC/D,oBAAsB,EAAA,CAAC,KAAU,KAAA,oBAAA,CAAqB,OAAO,CAAC,CAAA;AAAA,cAC9D,gBAAA,EAAkB,GAAG,mBAAoB,CAAA,KAAA,CAAM,CAAC,CAAG,EAAA,GAAA,EAAK,GAAG,CAAC,CAAA,CAAA,CAAA;AAAA,cAC5D,aAAA,EAAe,cAAc,eAAoB,KAAA,CAAA;AAAA,cACjD,cAAA,EAAgB,kBAAkB,eAAoB,KAAA,CAAA;AAAA,cACtD,QAAA,EAAU,UAAU,CAAC,CAAA;AAAA,cACrB,OAAA,EAAS,MAAM,WAAA,CAAY,CAAC,CAAA;AAAA,cAC5B,MAAA,EAAQ,MAAM,UAAA,CAAW,CAAC,CAAA;AAAA,cACzB,GAAG;AAAA;AAAA,WACN;AAAA,0BACA,GAAA;AAAA,YAAC,WAAA;AAAA,YAAA;AAAA,cACC,KAAO,EAAA,CAAA;AAAA,cACP,iBAAmB,EAAA,CAAC,KAAU,KAAA,iBAAA,CAAkB,OAAO,CAAC,CAAA;AAAA,cACxD,iBAAmB,EAAA,CAAC,KAAU,KAAA,wBAAA,CAAyB,OAAO,CAAC,CAAA;AAAA,cAC/D,oBAAsB,EAAA,CAAC,KAAU,KAAA,oBAAA,CAAqB,OAAO,CAAC,CAAA;AAAA,cAC9D,gBAAA,EAAkB,GAAG,mBAAoB,CAAA,KAAA,CAAM,CAAC,CAAG,EAAA,GAAA,EAAK,GAAG,CAAC,CAAA,CAAA,CAAA;AAAA,cAC5D,aAAA,EAAe,cAAc,eAAoB,KAAA,CAAA;AAAA,cACjD,cAAA,EAAgB,kBAAkB,eAAoB,KAAA,CAAA;AAAA,cACtD,QAAA,EAAU,UAAU,CAAC,CAAA;AAAA,cACrB,OAAA,EAAS,MAAM,WAAA,CAAY,CAAC,CAAA;AAAA,cAC5B,MAAA,EAAQ,MAAM,UAAA,CAAW,CAAC,CAAA;AAAA,cACzB,GAAG;AAAA;AAAA;AACN;AAAA;AAAA,KACF;AAAA;AAGN;;;;"}