@react-spectrum/s2 1.3.0 → 1.4.0

package/dist/private/ProgressCircle.css

@@ -1,77 +1,77 @@
 @layer _.a {
-  .-Ovbhqd-g4hn3s13 {
+  .-Ovbhqd-g4hn3s131 {
     --s2-container-bg: white;
   }
 
-  .-Ovbhqd-gcwrnr13 {
+  .-Ovbhqd-gcwrnr131 {
     --s2-container-bg: black;
   }
 
-  .ZC13 {
+  .ZC131 {
     width: calc(2rem * var(--s2-scale));
   }
 
-  .Zu13 {
+  .Zu131 {
     width: calc(1rem * var(--s2-scale));
   }
 
-  .ZG13 {
+  .ZG131 {
     width: calc(4rem * var(--s2-scale));
   }
 
-  .Fx13 {
+  .Fx131 {
     height: calc(2rem * var(--s2-scale));
   }
 
-  .Ft13 {
+  .Ft131 {
     height: calc(1rem * var(--s2-scale));
   }
 
-  .FA13 {
+  .FA131 {
     height: calc(4rem * var(--s2-scale));
   }
 
-  .fa13 {
+  .fa131 {
     aspect-ratio: 1;
   }
 
-  .Vf13 {
+  .Vf131 {
     stroke: light-dark(#dadada, #393939);
   }
 
-  .Vd13 {
+  .Vd131 {
     stroke: lch(from var(--s2-container-bg) calc((49.44 - l) * infinity) 0 0 / .17);
   }
 
-  .Vh13 {
+  .Vh131 {
     stroke: light-dark(#3b63fb, #5681ff);
   }
 
-  .Ve13 {
+  .Ve131 {
     stroke: lch(from var(--s2-container-bg) calc((49.44 - l) * infinity) 0 0 / .94);
   }
 
-  ._Sa13 {
+  ._Sa131 {
     rotate: -90deg;
   }
 
-  ._0d13 {
+  ._0d131 {
     transform-origin: center;
   }
 
-  .VRWHrbc13 {
+  .VRWHrbc131 {
     stroke: #0000;
   }
 
-  ._Vwtfhvc13 {
+  ._Vwtfhvc131 {
     stroke-width: .1875rem;
   }
 
-  ._V7m7Gv13 {
+  ._V7m7Gv131 {
     stroke-width: .125rem;
   }
 
-  ._VuNalie13 {
+  ._VuNalie131 {
     stroke-width: .25rem;
   }
 }
@@ -80,23 +80,23 @@
 
 @layer _.b.l {
   @media (forced-colors: active) {
-    .Vla13 {
+    .Vla131 {
       stroke: background;
     }
 
-    ._Vl7m7Gv13 {
+    ._Vl7m7Gv131 {
       stroke-width: .125rem;
     }
 
-    ._Vlai5a013 {
+    ._Vlai5a0131 {
       stroke-width: .0625rem;
     }
 
-    ._Vlwtfhvc13 {
+    ._Vlwtfhvc131 {
       stroke-width: .1875rem;
     }
 
-    .VlUG8Hlc13 {
+    .VlUG8Hlc131 {
       stroke: buttontext;
     }
   }

package/dist/private/ProgressCircle.css.map

@@ -1 +1 @@
-{"mappings":"AC2CgB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAYF;;;;EAAA;;;;EAsBD;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAiBK;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAvCJ;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAsBD;;;;;;AAoCa;;;;;;;;;;AAWE","sources":["899fc8f7586d17bf","packages/@react-spectrum/s2/src/ProgressCircle.tsx"],"sourcesContent":["@import \"766ebfa3e9b99037\";\n@import \"cdcaa7bc1c97d336\";\n@import \"788ab0411a865673\";\n@import \"73f154e47fb53c5b\";\n@import \"6c6d672d6676880a\";\n@import \"99c6c5c836ac9ba8\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue} from 'react-aria-components/slots';\n\nimport {createContext, forwardRef} from 'react';\nimport {DOMRef, DOMRefValue, GlobalDOMAttributes} from '@react-types/shared';\nimport {getAllowedOverrides, staticColor, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {keyframes} from '../style/style-macro' with {type: 'macro'};\nimport {pxToRem} from './progress-utils' with {type: 'macro'};\nimport {ProgressBar as RACProgressBar, ProgressBarProps as RACProgressBarProps} from 'react-aria-components/ProgressBar';\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from './useDOMRef';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nconst pxToRemDynamic = (px: number): string => (px / 16) + 'rem';\nexport interface ProgressCircleStyleProps {\n  /**\n   * The size of the ProgressCircle.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L',\n  /** The static color style to apply. Useful when the button appears over a color background. */\n  staticColor?: 'black' | 'white' | 'auto',\n  /**\n   * Whether presentation is indeterminate when progress isn't known.\n   */\n  isIndeterminate?: boolean\n}\n\nexport const ProgressCircleContext = createContext<ContextValue<Partial<ProgressCircleProps>, DOMRefValue<HTMLDivElement>>>(null);\n\n// Double check the types passed to each style, may not need all for each\nconst wrapper = style<ProgressCircleStyleProps>({\n  ...staticColor(),\n  size: {\n    default: 32,\n    size: {\n      S: 16,\n      L: 64\n    }\n  },\n  aspectRatio: 'square'\n}, getAllowedOverrides({height: true}));\n\nconst track = style({\n  stroke: {\n    default: 'gray-300',\n    isStaticColor: 'transparent-overlay-300',\n    forcedColors: 'Background'\n  },\n  strokeWidth: {\n    default: `[${pxToRem(3)}]`,\n    size: {\n      S: `[${pxToRem(2)}]`,\n      L: `[${pxToRem(4)}]`\n    },\n    forcedColors: {\n      default: `[${pxToRem(2)}]`,\n      size: {\n        S: `[${pxToRem(1)}]`,\n        L: `[${pxToRem(3)}]`\n      }\n    }\n  }\n});\n\nconst fill = style({\n  stroke: {\n    default: 'blue-900',\n    isStaticColor: 'transparent-overlay-900',\n    forcedColors: 'ButtonText'\n  },\n  rotate: -90,\n  transformOrigin: 'center',\n  strokeWidth: {\n    default: `[${pxToRem(3)}]`,\n    size: {\n      S: `[${pxToRem(2)}]`,\n      L: `[${pxToRem(4)}]`\n    }\n  }\n});\n\nconst hcmStroke = style({\n  stroke: {\n    default: 'transparent',\n    forcedColors: 'ButtonText'\n  },\n  strokeWidth: {\n    default: `[${pxToRem(3)}]`,\n    size: {\n      S: `[${pxToRem(2)}]`,\n      L: `[${pxToRem(4)}]`\n    }\n  }\n});\n\nexport interface ProgressCircleProps extends Omit<RACProgressBarProps, 'children' | 'style' | 'valueLabel' | 'formatOptions' | 'label' | 'className' | 'render' | keyof GlobalDOMAttributes>, ProgressCircleStyleProps, UnsafeStyles {\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight\n}\n\nconst rotationAnimation = keyframes(`\n  0% {\n    transform: rotate(0deg);\n  }\n\n  100% {\n    transform: rotate(360deg);\n  }\n`);\n\n// stroke-dashoffset represents `100 - percentage`. See below for how this works.\nconst dashoffsetAnimation = keyframes(`\n  0%, 100% {\n    stroke-dashoffset: 75;\n  }\n\n  30% {\n    stroke-dashoffset: 20;\n  }\n`);\n\n/**\n * ProgressCircles show the progression of a system operation such as downloading, uploading, or processing, in a visual way.\n * They can represent determinate or indeterminate progress.\n */\nexport const ProgressCircle = /*#__PURE__*/ forwardRef(function ProgressCircle(props: ProgressCircleProps, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ProgressCircleContext);\n  let {\n    size = 'M',\n    staticColor,\n    UNSAFE_style,\n    UNSAFE_className = ''\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  let strokeWidth = 3;\n  if (size === 'S') {\n    strokeWidth = 2;\n  } else if (size === 'L') {\n    strokeWidth = 4;\n  }\n\n  // SVG strokes are centered, so subtract half the stroke width from the radius to create an inner stroke.\n  let radius = `calc(50% - ${pxToRemDynamic(strokeWidth / 2)})`;\n  let isStaticColor = !!staticColor;\n\n  return (\n    <RACProgressBar\n      {...props}\n      ref={domRef}\n      style={UNSAFE_style}\n      className={renderProps => UNSAFE_className + wrapper({\n        ...renderProps,\n        size,\n        staticColor\n      }, props.styles)}>\n      {({percentage, isIndeterminate}) => (\n        <svg\n          fill=\"none\"\n          width=\"100%\"\n          height=\"100%\">\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r={radius}\n            className={hcmStroke({size})} />\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r={radius}\n            className={track({isStaticColor, size})} />\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r={radius}\n            className={fill({isStaticColor, size})}\n            style={{\n              // These cubic-bezier timing functions were derived from the previous animation keyframes\n              // using a best fit algorithm, and then manually adjusted to approximate the original animation.\n              animation: isIndeterminate ? `${rotationAnimation} 1s cubic-bezier(.6, .1, .3, .9) infinite, ${dashoffsetAnimation} 1s cubic-bezier(.25, .1, .25, 1.3) infinite` : undefined\n            }}\n            // Normalize the path length to 100 so we can easily set stroke-dashoffset to a percentage.\n            pathLength=\"100\"\n            // Add extra gap between dashes so 0% works in Chrome.\n            strokeDasharray=\"100 200\"\n            strokeDashoffset={isIndeterminate || percentage == null ? undefined : 100 - percentage}\n            strokeLinecap=\"round\" />\n        </svg>\n      )}\n    </RACProgressBar>\n  );\n});\n"],"names":[],"version":3,"file":"ProgressCircle.css.map"}
+{"mappings":"ACoDgB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAeF;;;;EAAA;;;;EAsBD;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAiBK;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAvCJ;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAsBD;;;;;;AAkDa;;;;;;;;;;AAWE","sources":["899fc8f7586d17bf","packages/@react-spectrum/s2/src/ProgressCircle.tsx"],"sourcesContent":["@import \"766ebfa3e9b99037\";\n@import \"cdcaa7bc1c97d336\";\n@import \"788ab0411a865673\";\n@import \"73f154e47fb53c5b\";\n@import \"6c6d672d6676880a\";\n@import \"99c6c5c836ac9ba8\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue} from 'react-aria-components/slots';\n\nimport {createContext, forwardRef} from 'react';\nimport {DOMRef, DOMRefValue, GlobalDOMAttributes} from '@react-types/shared';\nimport {\n  getAllowedOverrides,\n  staticColor,\n  StylesPropWithHeight,\n  UnsafeStyles\n} from './style-utils' with {type: 'macro'};\nimport {keyframes} from '../style/style-macro' with {type: 'macro'};\nimport {pxToRem} from './progress-utils' with {type: 'macro'};\nimport {\n  ProgressBar as RACProgressBar,\n  ProgressBarProps as RACProgressBarProps\n} from 'react-aria-components/ProgressBar';\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from './useDOMRef';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nconst pxToRemDynamic = (px: number): string => px / 16 + 'rem';\nexport interface ProgressCircleStyleProps {\n  /**\n   * The size of the ProgressCircle.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L';\n  /** The static color style to apply. Useful when the button appears over a color background. */\n  staticColor?: 'black' | 'white' | 'auto';\n  /**\n   * Whether presentation is indeterminate when progress isn't known.\n   */\n  isIndeterminate?: boolean;\n}\n\nexport const ProgressCircleContext =\n  createContext<ContextValue<Partial<ProgressCircleProps>, DOMRefValue<HTMLDivElement>>>(null);\n\n// Double check the types passed to each style, may not need all for each\nconst wrapper = style<ProgressCircleStyleProps>(\n  {\n    ...staticColor(),\n    size: {\n      default: 32,\n      size: {\n        S: 16,\n        L: 64\n      }\n    },\n    aspectRatio: 'square'\n  },\n  getAllowedOverrides({height: true})\n);\n\nconst track = style({\n  stroke: {\n    default: 'gray-300',\n    isStaticColor: 'transparent-overlay-300',\n    forcedColors: 'Background'\n  },\n  strokeWidth: {\n    default: `[${pxToRem(3)}]`,\n    size: {\n      S: `[${pxToRem(2)}]`,\n      L: `[${pxToRem(4)}]`\n    },\n    forcedColors: {\n      default: `[${pxToRem(2)}]`,\n      size: {\n        S: `[${pxToRem(1)}]`,\n        L: `[${pxToRem(3)}]`\n      }\n    }\n  }\n});\n\nconst fill = style({\n  stroke: {\n    default: 'blue-900',\n    isStaticColor: 'transparent-overlay-900',\n    forcedColors: 'ButtonText'\n  },\n  rotate: -90,\n  transformOrigin: 'center',\n  strokeWidth: {\n    default: `[${pxToRem(3)}]`,\n    size: {\n      S: `[${pxToRem(2)}]`,\n      L: `[${pxToRem(4)}]`\n    }\n  }\n});\n\nconst hcmStroke = style({\n  stroke: {\n    default: 'transparent',\n    forcedColors: 'ButtonText'\n  },\n  strokeWidth: {\n    default: `[${pxToRem(3)}]`,\n    size: {\n      S: `[${pxToRem(2)}]`,\n      L: `[${pxToRem(4)}]`\n    }\n  }\n});\n\nexport interface ProgressCircleProps\n  extends\n    Omit<\n      RACProgressBarProps,\n      | 'children'\n      | 'style'\n      | 'valueLabel'\n      | 'formatOptions'\n      | 'label'\n      | 'className'\n      | 'render'\n      | keyof GlobalDOMAttributes\n    >,\n    ProgressCircleStyleProps,\n    UnsafeStyles {\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight;\n}\n\nconst rotationAnimation = keyframes(`\n  0% {\n    transform: rotate(0deg);\n  }\n\n  100% {\n    transform: rotate(360deg);\n  }\n`);\n\n// stroke-dashoffset represents `100 - percentage`. See below for how this works.\nconst dashoffsetAnimation = keyframes(`\n  0%, 100% {\n    stroke-dashoffset: 75;\n  }\n\n  30% {\n    stroke-dashoffset: 20;\n  }\n`);\n\n/**\n * ProgressCircles show the progression of a system operation such as downloading, uploading, or\n * processing, in a visual way. They can represent determinate or indeterminate progress.\n */\nexport const ProgressCircle = /*#__PURE__*/ forwardRef(function ProgressCircle(\n  props: ProgressCircleProps,\n  ref: DOMRef<HTMLDivElement>\n) {\n  [props, ref] = useSpectrumContextProps(props, ref, ProgressCircleContext);\n  let {size = 'M', staticColor, UNSAFE_style, UNSAFE_className = ''} = props;\n  let domRef = useDOMRef(ref);\n\n  let strokeWidth = 3;\n  if (size === 'S') {\n    strokeWidth = 2;\n  } else if (size === 'L') {\n    strokeWidth = 4;\n  }\n\n  // SVG strokes are centered, so subtract half the stroke width from the radius to create an inner stroke.\n  let radius = `calc(50% - ${pxToRemDynamic(strokeWidth / 2)})`;\n  let isStaticColor = !!staticColor;\n\n  return (\n    <RACProgressBar\n      {...props}\n      ref={domRef}\n      style={UNSAFE_style}\n      className={renderProps =>\n        UNSAFE_className +\n        wrapper(\n          {\n            ...renderProps,\n            size,\n            staticColor\n          },\n          props.styles\n        )\n      }>\n      {({percentage, isIndeterminate}) => (\n        <svg fill=\"none\" width=\"100%\" height=\"100%\">\n          <circle cx=\"50%\" cy=\"50%\" r={radius} className={hcmStroke({size})} />\n          <circle cx=\"50%\" cy=\"50%\" r={radius} className={track({isStaticColor, size})} />\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r={radius}\n            className={fill({isStaticColor, size})}\n            style={{\n              // These cubic-bezier timing functions were derived from the previous animation keyframes\n              // using a best fit algorithm, and then manually adjusted to approximate the original animation.\n              animation: isIndeterminate\n                ? `${rotationAnimation} 1s cubic-bezier(.6, .1, .3, .9) infinite, ${dashoffsetAnimation} 1s cubic-bezier(.25, .1, .25, 1.3) infinite`\n                : undefined\n            }}\n            // Normalize the path length to 100 so we can easily set stroke-dashoffset to a percentage.\n            pathLength=\"100\"\n            // Add extra gap between dashes so 0% works in Chrome.\n            strokeDasharray=\"100 200\"\n            strokeDashoffset={isIndeterminate || percentage == null ? undefined : 100 - percentage}\n            strokeLinecap=\"round\"\n          />\n        </svg>\n      )}\n    </RACProgressBar>\n  );\n});\n"],"names":[],"version":3,"file":"ProgressCircle.css.map"}

package/dist/private/ProgressCircle.mjs

@@ -33,53 +33,53 @@ const $41ddd91dbbf0c389$var$wrapper = function anonymous(props, overrides) {
         if (p[1] === "F") height = true;
         rules += p[0];
     }
-    if (props.staticColor === "white") rules += ' -Ovbhqd-gcwrnr13';
-    else if (props.staticColor === "black") rules += ' -Ovbhqd-g4hn3s13';
+    if (props.staticColor === "white") rules += ' -Ovbhqd-gcwrnr131';
+    else if (props.staticColor === "black") rules += ' -Ovbhqd-g4hn3s131';
     if (props.size === "L") {
-        if (!width) rules += ' ZG13';
+        if (!width) rules += ' ZG131';
     } else if (props.size === "S") {
-        if (!width) rules += ' Zu13';
-    } else if (!width) rules += ' ZC13';
+        if (!width) rules += ' Zu131';
+    } else if (!width) rules += ' ZC131';
     if (props.size === "L") {
-        if (!height) rules += ' FA13';
+        if (!height) rules += ' FA131';
     } else if (props.size === "S") {
-        if (!height) rules += ' Ft13';
-    } else if (!height) rules += ' Fx13';
-    rules += ' fa13';
+        if (!height) rules += ' Ft131';
+    } else if (!height) rules += ' Fx131';
+    rules += ' fa131';
     return rules;
 };
 const $41ddd91dbbf0c389$var$track = function anonymous(props) {
     let rules = " ";
-    if (props.isStaticColor) rules += ' Vd13';
-    else rules += ' Vf13';
-    rules += ' Vla13';
-    if (props.size === "L") rules += ' _VuNalie13';
-    else if (props.size === "S") rules += ' _V7m7Gv13';
-    else rules += ' _Vwtfhvc13';
-    if (props.size === "L") rules += ' _Vlwtfhvc13';
-    else if (props.size === "S") rules += ' _Vlai5a013';
-    else rules += ' _Vl7m7Gv13';
+    if (props.isStaticColor) rules += ' Vd131';
+    else rules += ' Vf131';
+    rules += ' Vla131';
+    if (props.size === "L") rules += ' _VuNalie131';
+    else if (props.size === "S") rules += ' _V7m7Gv131';
+    else rules += ' _Vwtfhvc131';
+    if (props.size === "L") rules += ' _Vlwtfhvc131';
+    else if (props.size === "S") rules += ' _Vlai5a0131';
+    else rules += ' _Vl7m7Gv131';
     return rules;
 };
 const $41ddd91dbbf0c389$var$fill = function anonymous(props) {
     let rules = " ";
-    if (props.isStaticColor) rules += ' Ve13';
-    else rules += ' Vh13';
-    rules += ' VlUG8Hlc13';
-    rules += ' _Sa13';
-    rules += ' _0d13';
-    if (props.size === "L") rules += ' _VuNalie13';
-    else if (props.size === "S") rules += ' _V7m7Gv13';
-    else rules += ' _Vwtfhvc13';
+    if (props.isStaticColor) rules += ' Ve131';
+    else rules += ' Vh131';
+    rules += ' VlUG8Hlc131';
+    rules += ' _Sa131';
+    rules += ' _0d131';
+    if (props.size === "L") rules += ' _VuNalie131';
+    else if (props.size === "S") rules += ' _V7m7Gv131';
+    else rules += ' _Vwtfhvc131';
     return rules;
 };
 const $41ddd91dbbf0c389$var$hcmStroke = function anonymous(props) {
     let rules = " ";
-    rules += ' VRWHrbc13';
-    rules += ' VlUG8Hlc13';
-    if (props.size === "L") rules += ' _VuNalie13';
-    else if (props.size === "S") rules += ' _V7m7Gv13';
-    else rules += ' _Vwtfhvc13';
+    rules += ' VRWHrbc131';
+    rules += ' VlUG8Hlc131';
+    if (props.size === "L") rules += ' _VuNalie131';
+    else if (props.size === "S") rules += ' _V7m7Gv131';
+    else rules += ' _Vwtfhvc131';
     return rules;
 };
 const $41ddd91dbbf0c389$var$rotationAnimation = "Z8Un9b";

package/dist/private/ProgressCircle.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAcD,MAAM,uCAAiB,CAAC,KAAuB,AAAC,KAAK,KAAM;AAgBpD,MAAM,0DAAwB,CAAA,GAAA,oBAAY,EAA2E;AAE5H,yEAAyE;AACzE,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;AAYN,MAAM;;;;;;;;;;;;;AAsBN,MAAM;;;;;;;;;;;;AAiBN,MAAM;;;;;;;;;AAmBN,MAAM;AAUN,iFAAiF;AACjF,MAAM;AAcC,MAAM,4CAAiB,WAAW,GAAG,CAAA,GAAA,iBAAS,EAAE,SAAS,eAAe,KAA0B,EAAE,GAA2B;IACpI,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,QACF,OAAO,kBACP,WAAW,gBACX,YAAY,oBACZ,mBAAmB,IACpB,GAAG;IACJ,IAAI,SAAS,CAAA,GAAA,yCAAQ,EAAE;IAEvB,IAAI,cAAc;IAClB,IAAI,SAAS,KACX,cAAc;SACT,IAAI,SAAS,KAClB,cAAc;IAGhB,yGAAyG;IACzG,IAAI,SAAS,CAAC,WAAW,EAAE,qCAAe,cAAc,GAAG,CAAC,CAAC;IAC7D,IAAI,gBAAgB,CAAC,CAAC;IAEtB,qBACE,gBAAC,CAAA,GAAA,kBAAa;QACX,GAAG,KAAK;QACT,KAAK;QACL,OAAO;QACP,WAAW,CAAA,cAAe,mBAAmB,8BAAQ;gBACnD,GAAG,WAAW;sBACd;6BACA;YACF,GAAG,MAAM,MAAM;kBACd,CAAC,cAAC,UAAU,mBAAE,eAAe,EAAC,iBAC7B,iBAAC;gBACC,MAAK;gBACL,OAAM;gBACN,QAAO;;kCACP,gBAAC;wBACC,IAAG;wBACH,IAAG;wBACH,GAAG;wBACH,WAAW,gCAAU;kCAAC;wBAAI;;kCAC5B,gBAAC;wBACC,IAAG;wBACH,IAAG;wBACH,GAAG;wBACH,WAAW,4BAAM;2CAAC;kCAAe;wBAAI;;kCACvC,gBAAC;wBACC,IAAG;wBACH,IAAG;wBACH,GAAG;wBACH,WAAW,2BAAK;2CAAC;kCAAe;wBAAI;wBACpC,OAAO;4BACL,yFAAyF;4BACzF,gGAAgG;4BAChG,WAAW,kBAAkB,GAAG,wCAAkB,2CAA2C,EAAE,0CAAoB,4CAA4C,CAAC,GAAG;wBACrK;wBACA,2FAA2F;wBAC3F,YAAW;wBACX,sDAAsD;wBACtD,iBAAgB;wBAChB,kBAAkB,mBAAmB,cAAc,OAAO,YAAY,MAAM;wBAC5E,eAAc;;;;;AAK1B","sources":["packages/@react-spectrum/s2/src/ProgressCircle.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue} from 'react-aria-components/slots';\n\nimport {createContext, forwardRef} from 'react';\nimport {DOMRef, DOMRefValue, GlobalDOMAttributes} from '@react-types/shared';\nimport {getAllowedOverrides, staticColor, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {keyframes} from '../style/style-macro' with {type: 'macro'};\nimport {pxToRem} from './progress-utils' with {type: 'macro'};\nimport {ProgressBar as RACProgressBar, ProgressBarProps as RACProgressBarProps} from 'react-aria-components/ProgressBar';\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from './useDOMRef';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nconst pxToRemDynamic = (px: number): string => (px / 16) + 'rem';\nexport interface ProgressCircleStyleProps {\n  /**\n   * The size of the ProgressCircle.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L',\n  /** The static color style to apply. Useful when the button appears over a color background. */\n  staticColor?: 'black' | 'white' | 'auto',\n  /**\n   * Whether presentation is indeterminate when progress isn't known.\n   */\n  isIndeterminate?: boolean\n}\n\nexport const ProgressCircleContext = createContext<ContextValue<Partial<ProgressCircleProps>, DOMRefValue<HTMLDivElement>>>(null);\n\n// Double check the types passed to each style, may not need all for each\nconst wrapper = style<ProgressCircleStyleProps>({\n  ...staticColor(),\n  size: {\n    default: 32,\n    size: {\n      S: 16,\n      L: 64\n    }\n  },\n  aspectRatio: 'square'\n}, getAllowedOverrides({height: true}));\n\nconst track = style({\n  stroke: {\n    default: 'gray-300',\n    isStaticColor: 'transparent-overlay-300',\n    forcedColors: 'Background'\n  },\n  strokeWidth: {\n    default: `[${pxToRem(3)}]`,\n    size: {\n      S: `[${pxToRem(2)}]`,\n      L: `[${pxToRem(4)}]`\n    },\n    forcedColors: {\n      default: `[${pxToRem(2)}]`,\n      size: {\n        S: `[${pxToRem(1)}]`,\n        L: `[${pxToRem(3)}]`\n      }\n    }\n  }\n});\n\nconst fill = style({\n  stroke: {\n    default: 'blue-900',\n    isStaticColor: 'transparent-overlay-900',\n    forcedColors: 'ButtonText'\n  },\n  rotate: -90,\n  transformOrigin: 'center',\n  strokeWidth: {\n    default: `[${pxToRem(3)}]`,\n    size: {\n      S: `[${pxToRem(2)}]`,\n      L: `[${pxToRem(4)}]`\n    }\n  }\n});\n\nconst hcmStroke = style({\n  stroke: {\n    default: 'transparent',\n    forcedColors: 'ButtonText'\n  },\n  strokeWidth: {\n    default: `[${pxToRem(3)}]`,\n    size: {\n      S: `[${pxToRem(2)}]`,\n      L: `[${pxToRem(4)}]`\n    }\n  }\n});\n\nexport interface ProgressCircleProps extends Omit<RACProgressBarProps, 'children' | 'style' | 'valueLabel' | 'formatOptions' | 'label' | 'className' | 'render' | keyof GlobalDOMAttributes>, ProgressCircleStyleProps, UnsafeStyles {\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight\n}\n\nconst rotationAnimation = keyframes(`\n  0% {\n    transform: rotate(0deg);\n  }\n\n  100% {\n    transform: rotate(360deg);\n  }\n`);\n\n// stroke-dashoffset represents `100 - percentage`. See below for how this works.\nconst dashoffsetAnimation = keyframes(`\n  0%, 100% {\n    stroke-dashoffset: 75;\n  }\n\n  30% {\n    stroke-dashoffset: 20;\n  }\n`);\n\n/**\n * ProgressCircles show the progression of a system operation such as downloading, uploading, or processing, in a visual way.\n * They can represent determinate or indeterminate progress.\n */\nexport const ProgressCircle = /*#__PURE__*/ forwardRef(function ProgressCircle(props: ProgressCircleProps, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ProgressCircleContext);\n  let {\n    size = 'M',\n    staticColor,\n    UNSAFE_style,\n    UNSAFE_className = ''\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  let strokeWidth = 3;\n  if (size === 'S') {\n    strokeWidth = 2;\n  } else if (size === 'L') {\n    strokeWidth = 4;\n  }\n\n  // SVG strokes are centered, so subtract half the stroke width from the radius to create an inner stroke.\n  let radius = `calc(50% - ${pxToRemDynamic(strokeWidth / 2)})`;\n  let isStaticColor = !!staticColor;\n\n  return (\n    <RACProgressBar\n      {...props}\n      ref={domRef}\n      style={UNSAFE_style}\n      className={renderProps => UNSAFE_className + wrapper({\n        ...renderProps,\n        size,\n        staticColor\n      }, props.styles)}>\n      {({percentage, isIndeterminate}) => (\n        <svg\n          fill=\"none\"\n          width=\"100%\"\n          height=\"100%\">\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r={radius}\n            className={hcmStroke({size})} />\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r={radius}\n            className={track({isStaticColor, size})} />\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r={radius}\n            className={fill({isStaticColor, size})}\n            style={{\n              // These cubic-bezier timing functions were derived from the previous animation keyframes\n              // using a best fit algorithm, and then manually adjusted to approximate the original animation.\n              animation: isIndeterminate ? `${rotationAnimation} 1s cubic-bezier(.6, .1, .3, .9) infinite, ${dashoffsetAnimation} 1s cubic-bezier(.25, .1, .25, 1.3) infinite` : undefined\n            }}\n            // Normalize the path length to 100 so we can easily set stroke-dashoffset to a percentage.\n            pathLength=\"100\"\n            // Add extra gap between dashes so 0% works in Chrome.\n            strokeDasharray=\"100 200\"\n            strokeDashoffset={isIndeterminate || percentage == null ? undefined : 100 - percentage}\n            strokeLinecap=\"round\" />\n        </svg>\n      )}\n    </RACProgressBar>\n  );\n});\n"],"names":[],"version":3,"file":"ProgressCircle.mjs.map"}
+{"mappings":";;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAsBD,MAAM,uCAAiB,CAAC,KAAuB,KAAK,KAAK;AAgBlD,MAAM,0DACX,CAAA,GAAA,oBAAY,EAA2E;AAEzF,yEAAyE;AACzE,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;AAeN,MAAM;;;;;;;;;;;;;AAsBN,MAAM;;;;;;;;;;;;AAiBN,MAAM;;;;;;;;;AAiCN,MAAM;AAUN,iFAAiF;AACjF,MAAM;AAcC,MAAM,4CAAiB,WAAW,GAAG,CAAA,GAAA,iBAAS,EAAE,SAAS,eAC9D,KAA0B,EAC1B,GAA2B;IAE3B,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,QAAC,OAAO,kBAAK,WAAW,gBAAE,YAAY,oBAAE,mBAAmB,IAAG,GAAG;IACrE,IAAI,SAAS,CAAA,GAAA,yCAAQ,EAAE;IAEvB,IAAI,cAAc;IAClB,IAAI,SAAS,KACX,cAAc;SACT,IAAI,SAAS,KAClB,cAAc;IAGhB,yGAAyG;IACzG,IAAI,SAAS,CAAC,WAAW,EAAE,qCAAe,cAAc,GAAG,CAAC,CAAC;IAC7D,IAAI,gBAAgB,CAAC,CAAC;IAEtB,qBACE,gBAAC,CAAA,GAAA,kBAAa;QACX,GAAG,KAAK;QACT,KAAK;QACL,OAAO;QACP,WAAW,CAAA,cACT,mBACA,8BACE;gBACE,GAAG,WAAW;sBACd;6BACA;YACF,GACA,MAAM,MAAM;kBAGf,CAAC,cAAC,UAAU,mBAAE,eAAe,EAAC,iBAC7B,iBAAC;gBAAI,MAAK;gBAAO,OAAM;gBAAO,QAAO;;kCACnC,gBAAC;wBAAO,IAAG;wBAAM,IAAG;wBAAM,GAAG;wBAAQ,WAAW,gCAAU;kCAAC;wBAAI;;kCAC/D,gBAAC;wBAAO,IAAG;wBAAM,IAAG;wBAAM,GAAG;wBAAQ,WAAW,4BAAM;2CAAC;kCAAe;wBAAI;;kCAC1E,gBAAC;wBACC,IAAG;wBACH,IAAG;wBACH,GAAG;wBACH,WAAW,2BAAK;2CAAC;kCAAe;wBAAI;wBACpC,OAAO;4BACL,yFAAyF;4BACzF,gGAAgG;4BAChG,WAAW,kBACP,GAAG,wCAAkB,2CAA2C,EAAE,0CAAoB,4CAA4C,CAAC,GACnI;wBACN;wBACA,2FAA2F;wBAC3F,YAAW;wBACX,sDAAsD;wBACtD,iBAAgB;wBAChB,kBAAkB,mBAAmB,cAAc,OAAO,YAAY,MAAM;wBAC5E,eAAc;;;;;AAM1B","sources":["packages/@react-spectrum/s2/src/ProgressCircle.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue} from 'react-aria-components/slots';\n\nimport {createContext, forwardRef} from 'react';\nimport {DOMRef, DOMRefValue, GlobalDOMAttributes} from '@react-types/shared';\nimport {\n  getAllowedOverrides,\n  staticColor,\n  StylesPropWithHeight,\n  UnsafeStyles\n} from './style-utils' with {type: 'macro'};\nimport {keyframes} from '../style/style-macro' with {type: 'macro'};\nimport {pxToRem} from './progress-utils' with {type: 'macro'};\nimport {\n  ProgressBar as RACProgressBar,\n  ProgressBarProps as RACProgressBarProps\n} from 'react-aria-components/ProgressBar';\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from './useDOMRef';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nconst pxToRemDynamic = (px: number): string => px / 16 + 'rem';\nexport interface ProgressCircleStyleProps {\n  /**\n   * The size of the ProgressCircle.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L';\n  /** The static color style to apply. Useful when the button appears over a color background. */\n  staticColor?: 'black' | 'white' | 'auto';\n  /**\n   * Whether presentation is indeterminate when progress isn't known.\n   */\n  isIndeterminate?: boolean;\n}\n\nexport const ProgressCircleContext =\n  createContext<ContextValue<Partial<ProgressCircleProps>, DOMRefValue<HTMLDivElement>>>(null);\n\n// Double check the types passed to each style, may not need all for each\nconst wrapper = style<ProgressCircleStyleProps>(\n  {\n    ...staticColor(),\n    size: {\n      default: 32,\n      size: {\n        S: 16,\n        L: 64\n      }\n    },\n    aspectRatio: 'square'\n  },\n  getAllowedOverrides({height: true})\n);\n\nconst track = style({\n  stroke: {\n    default: 'gray-300',\n    isStaticColor: 'transparent-overlay-300',\n    forcedColors: 'Background'\n  },\n  strokeWidth: {\n    default: `[${pxToRem(3)}]`,\n    size: {\n      S: `[${pxToRem(2)}]`,\n      L: `[${pxToRem(4)}]`\n    },\n    forcedColors: {\n      default: `[${pxToRem(2)}]`,\n      size: {\n        S: `[${pxToRem(1)}]`,\n        L: `[${pxToRem(3)}]`\n      }\n    }\n  }\n});\n\nconst fill = style({\n  stroke: {\n    default: 'blue-900',\n    isStaticColor: 'transparent-overlay-900',\n    forcedColors: 'ButtonText'\n  },\n  rotate: -90,\n  transformOrigin: 'center',\n  strokeWidth: {\n    default: `[${pxToRem(3)}]`,\n    size: {\n      S: `[${pxToRem(2)}]`,\n      L: `[${pxToRem(4)}]`\n    }\n  }\n});\n\nconst hcmStroke = style({\n  stroke: {\n    default: 'transparent',\n    forcedColors: 'ButtonText'\n  },\n  strokeWidth: {\n    default: `[${pxToRem(3)}]`,\n    size: {\n      S: `[${pxToRem(2)}]`,\n      L: `[${pxToRem(4)}]`\n    }\n  }\n});\n\nexport interface ProgressCircleProps\n  extends\n    Omit<\n      RACProgressBarProps,\n      | 'children'\n      | 'style'\n      | 'valueLabel'\n      | 'formatOptions'\n      | 'label'\n      | 'className'\n      | 'render'\n      | keyof GlobalDOMAttributes\n    >,\n    ProgressCircleStyleProps,\n    UnsafeStyles {\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight;\n}\n\nconst rotationAnimation = keyframes(`\n  0% {\n    transform: rotate(0deg);\n  }\n\n  100% {\n    transform: rotate(360deg);\n  }\n`);\n\n// stroke-dashoffset represents `100 - percentage`. See below for how this works.\nconst dashoffsetAnimation = keyframes(`\n  0%, 100% {\n    stroke-dashoffset: 75;\n  }\n\n  30% {\n    stroke-dashoffset: 20;\n  }\n`);\n\n/**\n * ProgressCircles show the progression of a system operation such as downloading, uploading, or\n * processing, in a visual way. They can represent determinate or indeterminate progress.\n */\nexport const ProgressCircle = /*#__PURE__*/ forwardRef(function ProgressCircle(\n  props: ProgressCircleProps,\n  ref: DOMRef<HTMLDivElement>\n) {\n  [props, ref] = useSpectrumContextProps(props, ref, ProgressCircleContext);\n  let {size = 'M', staticColor, UNSAFE_style, UNSAFE_className = ''} = props;\n  let domRef = useDOMRef(ref);\n\n  let strokeWidth = 3;\n  if (size === 'S') {\n    strokeWidth = 2;\n  } else if (size === 'L') {\n    strokeWidth = 4;\n  }\n\n  // SVG strokes are centered, so subtract half the stroke width from the radius to create an inner stroke.\n  let radius = `calc(50% - ${pxToRemDynamic(strokeWidth / 2)})`;\n  let isStaticColor = !!staticColor;\n\n  return (\n    <RACProgressBar\n      {...props}\n      ref={domRef}\n      style={UNSAFE_style}\n      className={renderProps =>\n        UNSAFE_className +\n        wrapper(\n          {\n            ...renderProps,\n            size,\n            staticColor\n          },\n          props.styles\n        )\n      }>\n      {({percentage, isIndeterminate}) => (\n        <svg fill=\"none\" width=\"100%\" height=\"100%\">\n          <circle cx=\"50%\" cy=\"50%\" r={radius} className={hcmStroke({size})} />\n          <circle cx=\"50%\" cy=\"50%\" r={radius} className={track({isStaticColor, size})} />\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r={radius}\n            className={fill({isStaticColor, size})}\n            style={{\n              // These cubic-bezier timing functions were derived from the previous animation keyframes\n              // using a best fit algorithm, and then manually adjusted to approximate the original animation.\n              animation: isIndeterminate\n                ? `${rotationAnimation} 1s cubic-bezier(.6, .1, .3, .9) infinite, ${dashoffsetAnimation} 1s cubic-bezier(.25, .1, .25, 1.3) infinite`\n                : undefined\n            }}\n            // Normalize the path length to 100 so we can easily set stroke-dashoffset to a percentage.\n            pathLength=\"100\"\n            // Add extra gap between dashes so 0% works in Chrome.\n            strokeDasharray=\"100 200\"\n            strokeDashoffset={isIndeterminate || percentage == null ? undefined : 100 - percentage}\n            strokeLinecap=\"round\"\n          />\n        </svg>\n      )}\n    </RACProgressBar>\n  );\n});\n"],"names":[],"version":3,"file":"ProgressCircle.mjs.map"}

package/dist/private/Provider.cjs

@@ -55,17 +55,29 @@ function $914a06b3a1c679bc$export$2881499e37b75b9a(props) {
 undefined;
 let $914a06b3a1c679bc$var$providerStyles = function anonymous(props) {
     let rules = " ";
-    if (props.colorScheme === "dark") rules += ' -ICUGx-_pa13';
-    else if (props.colorScheme === "light") rules += ' -ICUGx-_pb13';
-    else if (props.colorScheme === "light dark") rules += ' -ICUGx-_pc13';
-    rules += ' _pK8eoyd13';
-    if (props.background === "layer-2") rules += ' -Ovbhqd-g_g13';
-    else if (props.background === "layer-1") rules += ' -Ovbhqd-gqlRAZb13';
-    else if (props.background === "base") rules += ' -Ovbhqd-gX13';
-    if (props.background === "layer-2") rules += ' gEzkoQe13';
-    else if (props.background === "layer-1") rules += ' gEzkoQe13';
-    else if (props.background === "base") rules += ' gEzkoQe13';
-    rules += ' _Bb13';
+    if (props.colorScheme === "dark") rules += ' -ICUGx-_pa131';
+    else if (props.colorScheme === "light") rules += ' -ICUGx-_pb131';
+    else if (props.colorScheme === "light dark") rules += ' -ICUGx-_pc131';
+    rules += ' _pK8eoyd131';
+    if (props.colorScheme === "dark") rules += ' -NvXmrd-_ZLmU131';
+    else if (props.colorScheme === "light") rules += ' -NvXmrd-_ZN8Gi4c131';
+    else if (props.colorScheme === "light dark") {
+        rules += ' -NvXmrd-_ZN8Gi4c131';
+        rules += ' -NvXmrd-D1v0V_ZLmU131';
+    }
+    if (props.colorScheme === "dark") rules += ' -j9blY-_ZN8Gi4c131';
+    else if (props.colorScheme === "light") rules += ' -j9blY-_ZLmU131';
+    else if (props.colorScheme === "light dark") {
+        rules += ' -j9blY-_ZLmU131';
+        rules += ' -j9blY-D1v0V_ZN8Gi4c131';
+    }
+    if (props.background === "layer-2") rules += ' -Ovbhqd-g_g131';
+    else if (props.background === "layer-1") rules += ' -Ovbhqd-gqlRAZb131';
+    else if (props.background === "base") rules += ' -Ovbhqd-gX131';
+    if (props.background === "layer-2") rules += ' gEzkoQe131';
+    else if (props.background === "layer-1") rules += ' gEzkoQe131';
+    else if (props.background === "base") rules += ' gEzkoQe131';
+    rules += ' _Bb131';
     return rules;
 };
 function $914a06b3a1c679bc$var$ProviderInner(props) {

package/dist/private/Provider.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AAiDM,MAAM,0DAAqB,CAAA,GAAA,0BAAY,EAAqC;AAM5E,SAAS,0CAAS,KAAoB;IAC3C,IAAI,uBAAS,gCAAC;QAAe,GAAG,KAAK;;IACrC,IAAI,oBAAoB,CAAA,GAAA,uBAAS,EAAE;IACnC,IAAI,cAAc,MAAM,WAAW,IAAI;IACvC,uBAAS,gCAAC,0CAAmB,QAAQ;QAAC,OAAO;kBAAc;;IAE3D,IAAI,MAAM,MAAM,EACd,uBAAS,gCAAC,CAAA,GAAA,yCAAW;QAAE,QAAQ,MAAM,MAAM;kBAAG;;IAGhD,IAAI,MAAM,MAAM,EACd,uBAAS,gCAAC,CAAA,GAAA,mDAAa;QAAG,GAAG,MAAM,MAAM;kBAAG;;IAG9C,OAAO;AACT;;AAIA,IAAI;;;;;;;;;;;;;;;AAuBJ,SAAS,oCAAc,KAAoB;IACzC,IAAI,EACF,aAAa,UAAU,KAAK,gBAC5B,YAAY,oBACZ,mBAAmB,YACnB,MAAM,YACN,QAAQ,cACR,mFAAmF;IACnF,aAAa,YAAY,SAAS,SAAS,wBAC3C,WAAW,EACZ,GAAG;IACJ,IAAI,UAAC,MAAM,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,sCAAQ;IAClC,qBACE,iCAAC;QACE,GAAG,CAAA,GAAA,6CAAa,EAAE,MAAM;QACzB,MAAM;QACN,KAAK;QACL,OAAO;QACP,WAAW,mBAAmB,CAAA,GAAA,qCAAU,EACtC,QACA,qCAAe;wBAAC;yBAAY;QAAW;;0BAEzC,gCAAC,CAAA,GAAA,+BAAI;YACJ;;;AAGP","sources":["packages/@react-spectrum/s2/src/Provider.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {createContext, JSX, ReactNode, useContext} from 'react';\nimport {DOMProps, Href, RouterOptions} from '@react-types/shared';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {Fonts} from './Fonts';\nimport {generateDefaultColorSchemeStyles} from './page.macro' with {type: 'macro'};\nimport {I18nProvider, useLocale} from 'react-aria/I18nProvider';\nimport {mergeStyles} from '../style/runtime';\nimport {RouterProvider} from 'react-aria/private/utils/openLink';\nimport {setColorScheme, style} from '../style' with {type: 'macro'};\nimport {StyleString} from '../style/types';\nimport {UnsafeStyles} from './style-utils' with {type: 'macro'};\n\nexport type ColorScheme = 'light' | 'dark';\ninterface Router {\n  navigate: (path: string, routerOptions: RouterOptions | undefined) => void,\n  useHref?: (href: Href) => string\n}\n\nexport interface ProviderProps extends UnsafeStyles, DOMProps {\n  /** The content of the Provider. */\n  children: ReactNode,\n  /**\n   * The locale for your application as a [BCP 47](https://www.ietf.org/rfc/bcp/bcp47.txt) language code.\n   * Defaults to the browser/OS language setting.\n   * @default 'en-US'\n   */\n  locale?: string,\n  /**\n   * Provides a client side router to all nested React Spectrum links to enable client side navigation.\n   */\n  router?: Router,\n  /**\n   * The color scheme for your application.\n   * Defaults to operating system preferences.\n   */\n  colorScheme?: ColorScheme,\n  /** The background for this provider. If not provided, the background is transparent. */\n  background?: 'base' | 'layer-1' | 'layer-2',\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StyleString,\n  /**\n   * The DOM element to render.\n   * @default div\n   */\n  elementType?: keyof JSX.IntrinsicElements\n}\n\nexport const ColorSchemeContext = createContext<ColorScheme | 'light dark' | null>(null);\n\n/**\n * Provider is the container for all React Spectrum components.\n * It loads the font and sets the colorScheme, locale, and other application level settings.\n */\nexport function Provider(props: ProviderProps): JSX.Element {\n  let result = <ProviderInner {...props} />;\n  let parentColorScheme = useContext(ColorSchemeContext);\n  let colorScheme = props.colorScheme || parentColorScheme;\n  result = <ColorSchemeContext.Provider value={colorScheme}>{result}</ColorSchemeContext.Provider>;\n\n  if (props.locale) {\n    result = <I18nProvider locale={props.locale}>{result}</I18nProvider>;\n  }\n\n  if (props.router) {\n    result = <RouterProvider {...props.router}>{result}</RouterProvider>;\n  }\n\n  return result;\n}\n\ngenerateDefaultColorSchemeStyles();\n\nlet providerStyles = style({\n  ...setColorScheme(),\n  '--s2-container-bg': {\n    type: 'backgroundColor',\n    value: {\n      background: {\n        base: 'base',\n        'layer-1': 'layer-1',\n        'layer-2': 'layer-2'\n      }\n    }\n  },\n  backgroundColor: {\n    // Don't set a background unless one is requested.\n    background: {\n      base: '--s2-container-bg',\n      'layer-1': '--s2-container-bg',\n      'layer-2': '--s2-container-bg'\n    }\n  },\n  isolation: 'isolate'\n});\n\nfunction ProviderInner(props: ProviderProps) {\n  let {\n    elementType: Element = 'div',\n    UNSAFE_style,\n    UNSAFE_className = '',\n    styles,\n    children,\n    // Set a default background if the provider is rendered as the root <html> element.\n    background = Element === 'html' ? 'base' : undefined,\n    colorScheme\n  } = props;\n  let {locale, direction} = useLocale();\n  return (\n    <Element\n      {...filterDOMProps(props)}\n      lang={locale}\n      dir={direction}\n      style={UNSAFE_style}\n      className={UNSAFE_className + mergeStyles(\n        styles,\n        providerStyles({background, colorScheme})\n      )}>\n      <Fonts />\n      {children}\n    </Element>\n  );\n}\n"],"names":[],"version":3,"file":"Provider.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AAoDM,MAAM,0DAAqB,CAAA,GAAA,0BAAY,EAAqC;AAM5E,SAAS,0CAAS,KAAoB;IAC3C,IAAI,uBAAS,gCAAC;QAAe,GAAG,KAAK;;IACrC,IAAI,oBAAoB,CAAA,GAAA,uBAAS,EAAE;IACnC,IAAI,cAAc,MAAM,WAAW,IAAI;IACvC,uBAAS,gCAAC,0CAAmB,QAAQ;QAAC,OAAO;kBAAc;;IAE3D,IAAI,MAAM,MAAM,EACd,uBAAS,gCAAC,CAAA,GAAA,yCAAW;QAAE,QAAQ,MAAM,MAAM;kBAAG;;IAGhD,IAAI,MAAM,MAAM,EACd,uBAAS,gCAAC,CAAA,GAAA,mDAAa;QAAG,GAAG,MAAM,MAAM;kBAAG;;IAG9C,OAAO;AACT;;AAIA,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuBJ,SAAS,oCAAc,KAAoB;IACzC,IAAI,EACF,aAAa,UAAU,KAAK,gBAC5B,YAAY,oBACZ,mBAAmB,YACnB,MAAM,YACN,QAAQ,cACR,mFAAmF;IACnF,aAAa,YAAY,SAAS,SAAS,wBAC3C,WAAW,EACZ,GAAG;IACJ,IAAI,UAAC,MAAM,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,sCAAQ;IAClC,qBACE,iCAAC;QACE,GAAG,CAAA,GAAA,6CAAa,EAAE,MAAM;QACzB,MAAM;QACN,KAAK;QACL,OAAO;QACP,WAAW,mBAAmB,CAAA,GAAA,qCAAU,EAAE,QAAQ,qCAAe;wBAAC;yBAAY;QAAW;;0BACzF,gCAAC,CAAA,GAAA,+BAAI;YACJ;;;AAGP","sources":["packages/@react-spectrum/s2/src/Provider.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {createContext, JSX, ReactNode, useContext} from 'react';\nimport {DOMProps, Href, RouterOptions} from '@react-types/shared';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {Fonts} from './Fonts';\nimport {generateDefaultColorSchemeStyles} from './page.macro' with {type: 'macro'};\nimport {I18nProvider, useLocale} from 'react-aria/I18nProvider';\nimport {mergeStyles} from '../style/runtime';\nimport {RouterProvider} from 'react-aria/private/utils/openLink';\nimport {setColorScheme, style} from '../style' with {type: 'macro'};\nimport {StyleString} from '../style/types';\nimport {UnsafeStyles} from './style-utils' with {type: 'macro'};\n\nexport type ColorScheme = 'light' | 'dark';\ninterface Router {\n  navigate: (path: string, routerOptions: RouterOptions | undefined) => void;\n  useHref?: (href: Href) => string;\n}\n\nexport interface ProviderProps extends UnsafeStyles, DOMProps {\n  /** The content of the Provider. */\n  children: ReactNode;\n  /**\n   * The locale for your application as a [BCP 47](https://www.ietf.org/rfc/bcp/bcp47.txt) language\n   * code. Defaults to the browser/OS language setting.\n   *\n   * @default 'en-US'\n   */\n  locale?: string;\n  /**\n   * Provides a client side router to all nested React Spectrum links to enable client side\n   * navigation.\n   */\n  router?: Router;\n  /**\n   * The color scheme for your application.\n   * Defaults to operating system preferences.\n   */\n  colorScheme?: ColorScheme;\n  /** The background for this provider. If not provided, the background is transparent. */\n  background?: 'base' | 'layer-1' | 'layer-2';\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StyleString;\n  /**\n   * The DOM element to render.\n   *\n   * @default div\n   */\n  elementType?: keyof JSX.IntrinsicElements;\n}\n\nexport const ColorSchemeContext = createContext<ColorScheme | 'light dark' | null>(null);\n\n/**\n * Provider is the container for all React Spectrum components.\n * It loads the font and sets the colorScheme, locale, and other application level settings.\n */\nexport function Provider(props: ProviderProps): JSX.Element {\n  let result = <ProviderInner {...props} />;\n  let parentColorScheme = useContext(ColorSchemeContext);\n  let colorScheme = props.colorScheme || parentColorScheme;\n  result = <ColorSchemeContext.Provider value={colorScheme}>{result}</ColorSchemeContext.Provider>;\n\n  if (props.locale) {\n    result = <I18nProvider locale={props.locale}>{result}</I18nProvider>;\n  }\n\n  if (props.router) {\n    result = <RouterProvider {...props.router}>{result}</RouterProvider>;\n  }\n\n  return result;\n}\n\ngenerateDefaultColorSchemeStyles();\n\nlet providerStyles = style({\n  ...setColorScheme(),\n  '--s2-container-bg': {\n    type: 'backgroundColor',\n    value: {\n      background: {\n        base: 'base',\n        'layer-1': 'layer-1',\n        'layer-2': 'layer-2'\n      }\n    }\n  },\n  backgroundColor: {\n    // Don't set a background unless one is requested.\n    background: {\n      base: '--s2-container-bg',\n      'layer-1': '--s2-container-bg',\n      'layer-2': '--s2-container-bg'\n    }\n  },\n  isolation: 'isolate'\n});\n\nfunction ProviderInner(props: ProviderProps) {\n  let {\n    elementType: Element = 'div',\n    UNSAFE_style,\n    UNSAFE_className = '',\n    styles,\n    children,\n    // Set a default background if the provider is rendered as the root <html> element.\n    background = Element === 'html' ? 'base' : undefined,\n    colorScheme\n  } = props;\n  let {locale, direction} = useLocale();\n  return (\n    <Element\n      {...filterDOMProps(props)}\n      lang={locale}\n      dir={direction}\n      style={UNSAFE_style}\n      className={UNSAFE_className + mergeStyles(styles, providerStyles({background, colorScheme}))}>\n      <Fonts />\n      {children}\n    </Element>\n  );\n}\n"],"names":[],"version":3,"file":"Provider.cjs.map"}

package/dist/private/Provider.css

@@ -3,6 +3,13 @@
     --s2-color-scheme: light dark;
     --s2-scale: 1;
     --s2-font-size-base: 14;
+    --lightningcss-light: initial;
+    --lightningcss-dark: ;
+
+    @media (prefers-color-scheme: dark) {
+      --lightningcss-light: ;
+      --lightningcss-dark: initial;
+    }
 
     @media not ((hover: hover) and (pointer: fine)) {
       --s2-scale: 1.25;
@@ -10,42 +17,72 @@
     }
   }
 
-  .-ICUGx-_pc13 {
+  .-ICUGx-_pc131 {
     --s2-color-scheme: light dark;
   }
 
-  .-ICUGx-_pb13 {
+  .-ICUGx-_pb131 {
     --s2-color-scheme: light;
   }
 
-  .-ICUGx-_pa13 {
+  .-ICUGx-_pa131 {
     --s2-color-scheme: dark;
   }
 
-  ._pK8eoyd13 {
+  ._pK8eoyd131 {
     color-scheme: var(--s2-color-scheme);
   }
 
-  .-Ovbhqd-gX13 {
+  .-NvXmrd-_ZN8Gi4c131 {
+    --lightningcss-light: initial;
+  }
+
+  .-NvXmrd-_ZLmU131 {
+    --lightningcss-light:  ;
+  }
+
+  .-j9blY-_ZLmU131 {
+    --lightningcss-dark:  ;
+  }
+
+  .-j9blY-_ZN8Gi4c131 {
+    --lightningcss-dark: initial;
+  }
+
+  .-Ovbhqd-gX131 {
     --s2-container-bg: light-dark(#fff, #111);
   }
 
-  .-Ovbhqd-gqlRAZb13 {
+  .-Ovbhqd-gqlRAZb131 {
     --s2-container-bg: light-dark(#f8f8f8, #1b1b1b);
   }
 
-  .-Ovbhqd-g_g13 {
+  .-Ovbhqd-g_g131 {
     --s2-container-bg: light-dark(#fff, #222);
   }
 
-  .gEzkoQe13 {
+  .gEzkoQe131 {
     background-color: var(--s2-container-bg);
     background-color: var(--s2-container-bg);
     background-color: var(--s2-container-bg);
   }
 
-  ._Bb13 {
+  ._Bb131 {
     isolation: isolate;
   }
 }
+
+@layer _.b;
+
+@layer _.b.D1v0V {
+  @media (prefers-color-scheme: dark) {
+    .-NvXmrd-D1v0V_ZLmU131 {
+      --lightningcss-light:  ;
+    }
+
+    .-j9blY-D1v0V_ZN8Gi4c131 {
+      --lightningcss-dark: initial;
+    }
+  }
+}
 /*# sourceMappingURL=Provider.css.map */

package/dist/private/Provider.css.map

@@ -1 +1 @@
-{"mappings":"ACkFA;EAAA;;;;;IAAA;MAAA;;;;;EAEqB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA","sources":["4752c64624f60d5a","packages/@react-spectrum/s2/src/Provider.tsx"],"sourcesContent":["@import \"60fcf4ad83e6776f\";\n@import \"ac1adcd813d529e0\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {createContext, JSX, ReactNode, useContext} from 'react';\nimport {DOMProps, Href, RouterOptions} from '@react-types/shared';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {Fonts} from './Fonts';\nimport {generateDefaultColorSchemeStyles} from './page.macro' with {type: 'macro'};\nimport {I18nProvider, useLocale} from 'react-aria/I18nProvider';\nimport {mergeStyles} from '../style/runtime';\nimport {RouterProvider} from 'react-aria/private/utils/openLink';\nimport {setColorScheme, style} from '../style' with {type: 'macro'};\nimport {StyleString} from '../style/types';\nimport {UnsafeStyles} from './style-utils' with {type: 'macro'};\n\nexport type ColorScheme = 'light' | 'dark';\ninterface Router {\n  navigate: (path: string, routerOptions: RouterOptions | undefined) => void,\n  useHref?: (href: Href) => string\n}\n\nexport interface ProviderProps extends UnsafeStyles, DOMProps {\n  /** The content of the Provider. */\n  children: ReactNode,\n  /**\n   * The locale for your application as a [BCP 47](https://www.ietf.org/rfc/bcp/bcp47.txt) language code.\n   * Defaults to the browser/OS language setting.\n   * @default 'en-US'\n   */\n  locale?: string,\n  /**\n   * Provides a client side router to all nested React Spectrum links to enable client side navigation.\n   */\n  router?: Router,\n  /**\n   * The color scheme for your application.\n   * Defaults to operating system preferences.\n   */\n  colorScheme?: ColorScheme,\n  /** The background for this provider. If not provided, the background is transparent. */\n  background?: 'base' | 'layer-1' | 'layer-2',\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StyleString,\n  /**\n   * The DOM element to render.\n   * @default div\n   */\n  elementType?: keyof JSX.IntrinsicElements\n}\n\nexport const ColorSchemeContext = createContext<ColorScheme | 'light dark' | null>(null);\n\n/**\n * Provider is the container for all React Spectrum components.\n * It loads the font and sets the colorScheme, locale, and other application level settings.\n */\nexport function Provider(props: ProviderProps): JSX.Element {\n  let result = <ProviderInner {...props} />;\n  let parentColorScheme = useContext(ColorSchemeContext);\n  let colorScheme = props.colorScheme || parentColorScheme;\n  result = <ColorSchemeContext.Provider value={colorScheme}>{result}</ColorSchemeContext.Provider>;\n\n  if (props.locale) {\n    result = <I18nProvider locale={props.locale}>{result}</I18nProvider>;\n  }\n\n  if (props.router) {\n    result = <RouterProvider {...props.router}>{result}</RouterProvider>;\n  }\n\n  return result;\n}\n\ngenerateDefaultColorSchemeStyles();\n\nlet providerStyles = style({\n  ...setColorScheme(),\n  '--s2-container-bg': {\n    type: 'backgroundColor',\n    value: {\n      background: {\n        base: 'base',\n        'layer-1': 'layer-1',\n        'layer-2': 'layer-2'\n      }\n    }\n  },\n  backgroundColor: {\n    // Don't set a background unless one is requested.\n    background: {\n      base: '--s2-container-bg',\n      'layer-1': '--s2-container-bg',\n      'layer-2': '--s2-container-bg'\n    }\n  },\n  isolation: 'isolate'\n});\n\nfunction ProviderInner(props: ProviderProps) {\n  let {\n    elementType: Element = 'div',\n    UNSAFE_style,\n    UNSAFE_className = '',\n    styles,\n    children,\n    // Set a default background if the provider is rendered as the root <html> element.\n    background = Element === 'html' ? 'base' : undefined,\n    colorScheme\n  } = props;\n  let {locale, direction} = useLocale();\n  return (\n    <Element\n      {...filterDOMProps(props)}\n      lang={locale}\n      dir={direction}\n      style={UNSAFE_style}\n      className={UNSAFE_className + mergeStyles(\n        styles,\n        providerStyles({background, colorScheme})\n      )}>\n      <Fonts />\n      {children}\n    </Element>\n  );\n}\n"],"names":[],"version":3,"file":"Provider.css.map"}
+{"mappings":"ACqFA;EAAA;;;;;;;IAAA;MAAA;;;;IAAA;MAAA;;;;;EAEqB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;;AAAA;;AAAA;EAAA;IAAA;;;;IAAA","sources":["4752c64624f60d5a","packages/@react-spectrum/s2/src/Provider.tsx"],"sourcesContent":["@import \"60fcf4ad83e6776f\";\n@import \"ac1adcd813d529e0\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {createContext, JSX, ReactNode, useContext} from 'react';\nimport {DOMProps, Href, RouterOptions} from '@react-types/shared';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {Fonts} from './Fonts';\nimport {generateDefaultColorSchemeStyles} from './page.macro' with {type: 'macro'};\nimport {I18nProvider, useLocale} from 'react-aria/I18nProvider';\nimport {mergeStyles} from '../style/runtime';\nimport {RouterProvider} from 'react-aria/private/utils/openLink';\nimport {setColorScheme, style} from '../style' with {type: 'macro'};\nimport {StyleString} from '../style/types';\nimport {UnsafeStyles} from './style-utils' with {type: 'macro'};\n\nexport type ColorScheme = 'light' | 'dark';\ninterface Router {\n  navigate: (path: string, routerOptions: RouterOptions | undefined) => void;\n  useHref?: (href: Href) => string;\n}\n\nexport interface ProviderProps extends UnsafeStyles, DOMProps {\n  /** The content of the Provider. */\n  children: ReactNode;\n  /**\n   * The locale for your application as a [BCP 47](https://www.ietf.org/rfc/bcp/bcp47.txt) language\n   * code. Defaults to the browser/OS language setting.\n   *\n   * @default 'en-US'\n   */\n  locale?: string;\n  /**\n   * Provides a client side router to all nested React Spectrum links to enable client side\n   * navigation.\n   */\n  router?: Router;\n  /**\n   * The color scheme for your application.\n   * Defaults to operating system preferences.\n   */\n  colorScheme?: ColorScheme;\n  /** The background for this provider. If not provided, the background is transparent. */\n  background?: 'base' | 'layer-1' | 'layer-2';\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StyleString;\n  /**\n   * The DOM element to render.\n   *\n   * @default div\n   */\n  elementType?: keyof JSX.IntrinsicElements;\n}\n\nexport const ColorSchemeContext = createContext<ColorScheme | 'light dark' | null>(null);\n\n/**\n * Provider is the container for all React Spectrum components.\n * It loads the font and sets the colorScheme, locale, and other application level settings.\n */\nexport function Provider(props: ProviderProps): JSX.Element {\n  let result = <ProviderInner {...props} />;\n  let parentColorScheme = useContext(ColorSchemeContext);\n  let colorScheme = props.colorScheme || parentColorScheme;\n  result = <ColorSchemeContext.Provider value={colorScheme}>{result}</ColorSchemeContext.Provider>;\n\n  if (props.locale) {\n    result = <I18nProvider locale={props.locale}>{result}</I18nProvider>;\n  }\n\n  if (props.router) {\n    result = <RouterProvider {...props.router}>{result}</RouterProvider>;\n  }\n\n  return result;\n}\n\ngenerateDefaultColorSchemeStyles();\n\nlet providerStyles = style({\n  ...setColorScheme(),\n  '--s2-container-bg': {\n    type: 'backgroundColor',\n    value: {\n      background: {\n        base: 'base',\n        'layer-1': 'layer-1',\n        'layer-2': 'layer-2'\n      }\n    }\n  },\n  backgroundColor: {\n    // Don't set a background unless one is requested.\n    background: {\n      base: '--s2-container-bg',\n      'layer-1': '--s2-container-bg',\n      'layer-2': '--s2-container-bg'\n    }\n  },\n  isolation: 'isolate'\n});\n\nfunction ProviderInner(props: ProviderProps) {\n  let {\n    elementType: Element = 'div',\n    UNSAFE_style,\n    UNSAFE_className = '',\n    styles,\n    children,\n    // Set a default background if the provider is rendered as the root <html> element.\n    background = Element === 'html' ? 'base' : undefined,\n    colorScheme\n  } = props;\n  let {locale, direction} = useLocale();\n  return (\n    <Element\n      {...filterDOMProps(props)}\n      lang={locale}\n      dir={direction}\n      style={UNSAFE_style}\n      className={UNSAFE_className + mergeStyles(styles, providerStyles({background, colorScheme}))}>\n      <Fonts />\n      {children}\n    </Element>\n  );\n}\n"],"names":[],"version":3,"file":"Provider.css.map"}

package/dist/private/Provider.mjs

@@ -48,17 +48,29 @@ function $9affbfa4e13b9582$export$2881499e37b75b9a(props) {
 undefined;
 let $9affbfa4e13b9582$var$providerStyles = function anonymous(props) {
     let rules = " ";
-    if (props.colorScheme === "dark") rules += ' -ICUGx-_pa13';
-    else if (props.colorScheme === "light") rules += ' -ICUGx-_pb13';
-    else if (props.colorScheme === "light dark") rules += ' -ICUGx-_pc13';
-    rules += ' _pK8eoyd13';
-    if (props.background === "layer-2") rules += ' -Ovbhqd-g_g13';
-    else if (props.background === "layer-1") rules += ' -Ovbhqd-gqlRAZb13';
-    else if (props.background === "base") rules += ' -Ovbhqd-gX13';
-    if (props.background === "layer-2") rules += ' gEzkoQe13';
-    else if (props.background === "layer-1") rules += ' gEzkoQe13';
-    else if (props.background === "base") rules += ' gEzkoQe13';
-    rules += ' _Bb13';
+    if (props.colorScheme === "dark") rules += ' -ICUGx-_pa131';
+    else if (props.colorScheme === "light") rules += ' -ICUGx-_pb131';
+    else if (props.colorScheme === "light dark") rules += ' -ICUGx-_pc131';
+    rules += ' _pK8eoyd131';
+    if (props.colorScheme === "dark") rules += ' -NvXmrd-_ZLmU131';
+    else if (props.colorScheme === "light") rules += ' -NvXmrd-_ZN8Gi4c131';
+    else if (props.colorScheme === "light dark") {
+        rules += ' -NvXmrd-_ZN8Gi4c131';
+        rules += ' -NvXmrd-D1v0V_ZLmU131';
+    }
+    if (props.colorScheme === "dark") rules += ' -j9blY-_ZN8Gi4c131';
+    else if (props.colorScheme === "light") rules += ' -j9blY-_ZLmU131';
+    else if (props.colorScheme === "light dark") {
+        rules += ' -j9blY-_ZLmU131';
+        rules += ' -j9blY-D1v0V_ZN8Gi4c131';
+    }
+    if (props.background === "layer-2") rules += ' -Ovbhqd-g_g131';
+    else if (props.background === "layer-1") rules += ' -Ovbhqd-gqlRAZb131';
+    else if (props.background === "base") rules += ' -Ovbhqd-gX131';
+    if (props.background === "layer-2") rules += ' gEzkoQe131';
+    else if (props.background === "layer-1") rules += ' gEzkoQe131';
+    else if (props.background === "base") rules += ' gEzkoQe131';
+    rules += ' _Bb131';
     return rules;
 };
 function $9affbfa4e13b9582$var$ProviderInner(props) {

package/dist/private/Provider.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AAiDM,MAAM,0DAAqB,CAAA,GAAA,oBAAY,EAAqC;AAM5E,SAAS,0CAAS,KAAoB;IAC3C,IAAI,uBAAS,gBAAC;QAAe,GAAG,KAAK;;IACrC,IAAI,oBAAoB,CAAA,GAAA,iBAAS,EAAE;IACnC,IAAI,cAAc,MAAM,WAAW,IAAI;IACvC,uBAAS,gBAAC,0CAAmB,QAAQ;QAAC,OAAO;kBAAc;;IAE3D,IAAI,MAAM,MAAM,EACd,uBAAS,gBAAC,CAAA,GAAA,mBAAW;QAAE,QAAQ,MAAM,MAAM;kBAAG;;IAGhD,IAAI,MAAM,MAAM,EACd,uBAAS,gBAAC,CAAA,GAAA,qBAAa;QAAG,GAAG,MAAM,MAAM;kBAAG;;IAG9C,OAAO;AACT;;AAIA,IAAI;;;;;;;;;;;;;;;AAuBJ,SAAS,oCAAc,KAAoB;IACzC,IAAI,EACF,aAAa,UAAU,KAAK,gBAC5B,YAAY,oBACZ,mBAAmB,YACnB,MAAM,YACN,QAAQ,cACR,mFAAmF;IACnF,aAAa,YAAY,SAAS,SAAS,wBAC3C,WAAW,EACZ,GAAG;IACJ,IAAI,UAAC,MAAM,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,gBAAQ;IAClC,qBACE,iBAAC;QACE,GAAG,CAAA,GAAA,qBAAa,EAAE,MAAM;QACzB,MAAM;QACN,KAAK;QACL,OAAO;QACP,WAAW,mBAAmB,CAAA,GAAA,yCAAU,EACtC,QACA,qCAAe;wBAAC;yBAAY;QAAW;;0BAEzC,gBAAC,CAAA,GAAA,yCAAI;YACJ;;;AAGP","sources":["packages/@react-spectrum/s2/src/Provider.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {createContext, JSX, ReactNode, useContext} from 'react';\nimport {DOMProps, Href, RouterOptions} from '@react-types/shared';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {Fonts} from './Fonts';\nimport {generateDefaultColorSchemeStyles} from './page.macro' with {type: 'macro'};\nimport {I18nProvider, useLocale} from 'react-aria/I18nProvider';\nimport {mergeStyles} from '../style/runtime';\nimport {RouterProvider} from 'react-aria/private/utils/openLink';\nimport {setColorScheme, style} from '../style' with {type: 'macro'};\nimport {StyleString} from '../style/types';\nimport {UnsafeStyles} from './style-utils' with {type: 'macro'};\n\nexport type ColorScheme = 'light' | 'dark';\ninterface Router {\n  navigate: (path: string, routerOptions: RouterOptions | undefined) => void,\n  useHref?: (href: Href) => string\n}\n\nexport interface ProviderProps extends UnsafeStyles, DOMProps {\n  /** The content of the Provider. */\n  children: ReactNode,\n  /**\n   * The locale for your application as a [BCP 47](https://www.ietf.org/rfc/bcp/bcp47.txt) language code.\n   * Defaults to the browser/OS language setting.\n   * @default 'en-US'\n   */\n  locale?: string,\n  /**\n   * Provides a client side router to all nested React Spectrum links to enable client side navigation.\n   */\n  router?: Router,\n  /**\n   * The color scheme for your application.\n   * Defaults to operating system preferences.\n   */\n  colorScheme?: ColorScheme,\n  /** The background for this provider. If not provided, the background is transparent. */\n  background?: 'base' | 'layer-1' | 'layer-2',\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StyleString,\n  /**\n   * The DOM element to render.\n   * @default div\n   */\n  elementType?: keyof JSX.IntrinsicElements\n}\n\nexport const ColorSchemeContext = createContext<ColorScheme | 'light dark' | null>(null);\n\n/**\n * Provider is the container for all React Spectrum components.\n * It loads the font and sets the colorScheme, locale, and other application level settings.\n */\nexport function Provider(props: ProviderProps): JSX.Element {\n  let result = <ProviderInner {...props} />;\n  let parentColorScheme = useContext(ColorSchemeContext);\n  let colorScheme = props.colorScheme || parentColorScheme;\n  result = <ColorSchemeContext.Provider value={colorScheme}>{result}</ColorSchemeContext.Provider>;\n\n  if (props.locale) {\n    result = <I18nProvider locale={props.locale}>{result}</I18nProvider>;\n  }\n\n  if (props.router) {\n    result = <RouterProvider {...props.router}>{result}</RouterProvider>;\n  }\n\n  return result;\n}\n\ngenerateDefaultColorSchemeStyles();\n\nlet providerStyles = style({\n  ...setColorScheme(),\n  '--s2-container-bg': {\n    type: 'backgroundColor',\n    value: {\n      background: {\n        base: 'base',\n        'layer-1': 'layer-1',\n        'layer-2': 'layer-2'\n      }\n    }\n  },\n  backgroundColor: {\n    // Don't set a background unless one is requested.\n    background: {\n      base: '--s2-container-bg',\n      'layer-1': '--s2-container-bg',\n      'layer-2': '--s2-container-bg'\n    }\n  },\n  isolation: 'isolate'\n});\n\nfunction ProviderInner(props: ProviderProps) {\n  let {\n    elementType: Element = 'div',\n    UNSAFE_style,\n    UNSAFE_className = '',\n    styles,\n    children,\n    // Set a default background if the provider is rendered as the root <html> element.\n    background = Element === 'html' ? 'base' : undefined,\n    colorScheme\n  } = props;\n  let {locale, direction} = useLocale();\n  return (\n    <Element\n      {...filterDOMProps(props)}\n      lang={locale}\n      dir={direction}\n      style={UNSAFE_style}\n      className={UNSAFE_className + mergeStyles(\n        styles,\n        providerStyles({background, colorScheme})\n      )}>\n      <Fonts />\n      {children}\n    </Element>\n  );\n}\n"],"names":[],"version":3,"file":"Provider.mjs.map"}
+{"mappings":";;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AAoDM,MAAM,0DAAqB,CAAA,GAAA,oBAAY,EAAqC;AAM5E,SAAS,0CAAS,KAAoB;IAC3C,IAAI,uBAAS,gBAAC;QAAe,GAAG,KAAK;;IACrC,IAAI,oBAAoB,CAAA,GAAA,iBAAS,EAAE;IACnC,IAAI,cAAc,MAAM,WAAW,IAAI;IACvC,uBAAS,gBAAC,0CAAmB,QAAQ;QAAC,OAAO;kBAAc;;IAE3D,IAAI,MAAM,MAAM,EACd,uBAAS,gBAAC,CAAA,GAAA,mBAAW;QAAE,QAAQ,MAAM,MAAM;kBAAG;;IAGhD,IAAI,MAAM,MAAM,EACd,uBAAS,gBAAC,CAAA,GAAA,qBAAa;QAAG,GAAG,MAAM,MAAM;kBAAG;;IAG9C,OAAO;AACT;;AAIA,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuBJ,SAAS,oCAAc,KAAoB;IACzC,IAAI,EACF,aAAa,UAAU,KAAK,gBAC5B,YAAY,oBACZ,mBAAmB,YACnB,MAAM,YACN,QAAQ,cACR,mFAAmF;IACnF,aAAa,YAAY,SAAS,SAAS,wBAC3C,WAAW,EACZ,GAAG;IACJ,IAAI,UAAC,MAAM,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,gBAAQ;IAClC,qBACE,iBAAC;QACE,GAAG,CAAA,GAAA,qBAAa,EAAE,MAAM;QACzB,MAAM;QACN,KAAK;QACL,OAAO;QACP,WAAW,mBAAmB,CAAA,GAAA,yCAAU,EAAE,QAAQ,qCAAe;wBAAC;yBAAY;QAAW;;0BACzF,gBAAC,CAAA,GAAA,yCAAI;YACJ;;;AAGP","sources":["packages/@react-spectrum/s2/src/Provider.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {createContext, JSX, ReactNode, useContext} from 'react';\nimport {DOMProps, Href, RouterOptions} from '@react-types/shared';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {Fonts} from './Fonts';\nimport {generateDefaultColorSchemeStyles} from './page.macro' with {type: 'macro'};\nimport {I18nProvider, useLocale} from 'react-aria/I18nProvider';\nimport {mergeStyles} from '../style/runtime';\nimport {RouterProvider} from 'react-aria/private/utils/openLink';\nimport {setColorScheme, style} from '../style' with {type: 'macro'};\nimport {StyleString} from '../style/types';\nimport {UnsafeStyles} from './style-utils' with {type: 'macro'};\n\nexport type ColorScheme = 'light' | 'dark';\ninterface Router {\n  navigate: (path: string, routerOptions: RouterOptions | undefined) => void;\n  useHref?: (href: Href) => string;\n}\n\nexport interface ProviderProps extends UnsafeStyles, DOMProps {\n  /** The content of the Provider. */\n  children: ReactNode;\n  /**\n   * The locale for your application as a [BCP 47](https://www.ietf.org/rfc/bcp/bcp47.txt) language\n   * code. Defaults to the browser/OS language setting.\n   *\n   * @default 'en-US'\n   */\n  locale?: string;\n  /**\n   * Provides a client side router to all nested React Spectrum links to enable client side\n   * navigation.\n   */\n  router?: Router;\n  /**\n   * The color scheme for your application.\n   * Defaults to operating system preferences.\n   */\n  colorScheme?: ColorScheme;\n  /** The background for this provider. If not provided, the background is transparent. */\n  background?: 'base' | 'layer-1' | 'layer-2';\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StyleString;\n  /**\n   * The DOM element to render.\n   *\n   * @default div\n   */\n  elementType?: keyof JSX.IntrinsicElements;\n}\n\nexport const ColorSchemeContext = createContext<ColorScheme | 'light dark' | null>(null);\n\n/**\n * Provider is the container for all React Spectrum components.\n * It loads the font and sets the colorScheme, locale, and other application level settings.\n */\nexport function Provider(props: ProviderProps): JSX.Element {\n  let result = <ProviderInner {...props} />;\n  let parentColorScheme = useContext(ColorSchemeContext);\n  let colorScheme = props.colorScheme || parentColorScheme;\n  result = <ColorSchemeContext.Provider value={colorScheme}>{result}</ColorSchemeContext.Provider>;\n\n  if (props.locale) {\n    result = <I18nProvider locale={props.locale}>{result}</I18nProvider>;\n  }\n\n  if (props.router) {\n    result = <RouterProvider {...props.router}>{result}</RouterProvider>;\n  }\n\n  return result;\n}\n\ngenerateDefaultColorSchemeStyles();\n\nlet providerStyles = style({\n  ...setColorScheme(),\n  '--s2-container-bg': {\n    type: 'backgroundColor',\n    value: {\n      background: {\n        base: 'base',\n        'layer-1': 'layer-1',\n        'layer-2': 'layer-2'\n      }\n    }\n  },\n  backgroundColor: {\n    // Don't set a background unless one is requested.\n    background: {\n      base: '--s2-container-bg',\n      'layer-1': '--s2-container-bg',\n      'layer-2': '--s2-container-bg'\n    }\n  },\n  isolation: 'isolate'\n});\n\nfunction ProviderInner(props: ProviderProps) {\n  let {\n    elementType: Element = 'div',\n    UNSAFE_style,\n    UNSAFE_className = '',\n    styles,\n    children,\n    // Set a default background if the provider is rendered as the root <html> element.\n    background = Element === 'html' ? 'base' : undefined,\n    colorScheme\n  } = props;\n  let {locale, direction} = useLocale();\n  return (\n    <Element\n      {...filterDOMProps(props)}\n      lang={locale}\n      dir={direction}\n      style={UNSAFE_style}\n      className={UNSAFE_className + mergeStyles(styles, providerStyles({background, colorScheme}))}>\n      <Fonts />\n      {children}\n    </Element>\n  );\n}\n"],"names":[],"version":3,"file":"Provider.mjs.map"}