@react-spectrum/s2 0.5.0 → 0.7.0

package/dist/Divider.mjs

@@ -23,37 +23,36 @@ import {useDOMRef as $5nGzy$useDOMRef} from "@react-spectrum/utils";
 const $bdf52657dac0f070$export$30fbfd376abdf190 = /*#__PURE__*/ (0, $5nGzy$createContext)(null);
 const $bdf52657dac0f070$export$e8c9778bf415dd08 = function anonymous(props, overrides) {
     let rules = " .";
-    let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|_9|_8|h|_5|_4|__A|__c|__d|__a|__b|U|__Q|X|Z|V|W|l|q|r)[^\s]+/g) || [];
+    let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|__a|_9|h|_6|_5|__B|__d|__e|__b|__c|V|__R|Y|_a|W|X|l|q|r)[^\s]+/g) || [];
     rules += matches.join('');
-    let $_4 = false;
+    let $_5 = false;
     let $A = false;
     let $B = false;
     let $y = false;
     let $z = false;
     let $l = false;
     for (let p of matches){
-        if (/^\s*_4/.test(p)) $_4 = true;
+        if (/^\s*_5/.test(p)) $_5 = true;
         if (/^\s*A/.test(p)) $A = true;
         if (/^\s*B/.test(p)) $B = true;
         if (/^\s*y/.test(p)) $y = true;
         if (/^\s*z/.test(p)) $z = true;
         if (/^\s*l/.test(p)) $l = true;
     }
-    if (!$_4) rules += ' _4e';
-    rules += ' ba_____v';
-    if (props.staticColor === "black") {
-        if (props.size === "L") rules += ' b_____r';
-        else rules += ' b_____l';
-    } else if (props.staticColor === "white") {
-        if (props.size === "L") rules += ' b_____e';
-        else rules += ' b____8';
+    if (props.staticColor === "white") rules += ' -_1de2x0q_b-b';
+    else if (props.staticColor === "black") rules += ' -_1de2x0q_b-c';
+    if (!$_5) rules += ' _5e';
+    rules += ' ba_____I';
+    if (props.isStaticColor) {
+        if (props.size === "L") rules += ' b_____E';
+        else rules += ' b_____y';
     } else if (props.size === "L") rules += ' bn';
     else rules += ' bh';
     rules += ' wf';
-    rules += ' _vf';
     rules += ' _wf';
     rules += ' _xf';
     rules += ' _yf';
+    rules += ' _zf';
     if (!$A) rules += ' Aa';
     if (!$B) rules += ' Ba';
     if (!$y) rules += ' ya';
@@ -72,7 +71,7 @@ const $bdf52657dac0f070$export$e8c9778bf415dd08 = function anonymous(props, over
     }
     return rules;
 };
-function $bdf52657dac0f070$var$Divider(props, ref) {
+const $bdf52657dac0f070$export$2e0a83ec2e27ecbb = /*#__PURE__*/ (0, $5nGzy$forwardRef)(function Divider(props, ref) {
     [props, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $bdf52657dac0f070$export$30fbfd376abdf190);
     let domRef = (0, $5nGzy$useDOMRef)(ref);
     return /*#__PURE__*/ (0, $5nGzy$jsx)((0, $5nGzy$Separator), {
@@ -82,14 +81,11 @@ function $bdf52657dac0f070$var$Divider(props, ref) {
         className: (props.UNSAFE_className || '') + $bdf52657dac0f070$export$e8c9778bf415dd08({
             size: props.size || 'M',
             orientation: props.orientation || 'horizontal',
-            staticColor: props.staticColor
+            staticColor: props.staticColor,
+            isStaticColor: !!props.staticColor
         }, props.styles)
     });
-}
-/**
- * Dividers bring clarity to a layout by grouping and dividing content in close proximity.
- * They can also be used to establish rhythm and hierarchy.
- */ let $bdf52657dac0f070$export$2e0a83ec2e27ecbb = /*#__PURE__*/ (0, $5nGzy$forwardRef)($bdf52657dac0f070$var$Divider);
+});
 
 
 export {$bdf52657dac0f070$export$30fbfd376abdf190 as DividerContext, $bdf52657dac0f070$export$e8c9778bf415dd08 as divider, $bdf52657dac0f070$export$2e0a83ec2e27ecbb as Divider};

package/dist/Divider.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAgCM,MAAM,0DAAiB,CAAA,GAAA,oBAAY,EAA2C;AAE9E,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDb,SAAS,8BAAQ,KAAmB,EAAE,GAAW;IAC/C,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IAEvB,qBACE,gBAAC,CAAA,GAAA,gBAAW;QACT,GAAG,KAAK;QACT,KAAK;QACL,OAAO,MAAM,YAAY;QACzB,WAAW,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,0CAAQ;YAClD,MAAM,MAAM,IAAI,IAAI;YACpB,aAAa,MAAM,WAAW,IAAI;YAClC,aAAa,MAAM,WAAW;QAChC,GAAG,MAAM,MAAM;;AAErB;AAEA;;;CAGC,GACD,IAAI,4CAAW,WAAW,GAAG,CAAA,GAAA,iBAAS,EAAE","sources":["packages/@react-spectrum/s2/src/Divider.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, Separator as RACSeparator, SeparatorProps as RACSeparatorProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n/*\n * Adding as it's own type to deal with size being a part of the theme so we\n * can type style() and it's parameters.\n */\ninterface DividerSpectrumProps {\n  /**\n   * How thick the Divider should be.\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L',\n  /**\n   * How thick the Divider should be.\n   * @default 'horizontal'\n   */\n  orientation?: 'horizontal' | 'vertical',\n  /** The static color style to apply. Useful when the Divider appears over a color background. */\n  staticColor?: 'white' | 'black'\n}\n\n// TODO: allow overriding height (only when orientation is vertical)??\nexport interface DividerProps extends DividerSpectrumProps, Omit<RACSeparatorProps, 'className' | 'style' | 'elementType'>, StyleProps {}\n\nexport const DividerContext = createContext<ContextValue<DividerProps, DOMRefValue>>(null);\n\nexport const divider = style<DividerSpectrumProps>({\n  alignSelf: 'stretch',\n  backgroundColor: {\n    default: 'gray-200',\n    size: {\n      L: 'gray-800'\n    },\n    staticColor: {\n      white: {\n        default: 'transparent-white-200',\n        size: {\n          L: 'transparent-white-800'\n        }\n      },\n      black: {\n        default: 'transparent-black-200',\n        size: {\n          L: 'transparent-black-800'\n        }\n      }\n    },\n    forcedColors: 'ButtonBorder'\n  },\n  borderStyle: 'none',\n  borderRadius: 'full',\n  margin: 0,\n  height: {\n    orientation: {\n      horizontal: {\n        // These should be px not rems, because we're emulating a border.\n        default: '[2px]',\n        size: {\n          S: '[1px]',\n          L: '[4px]'\n        }\n      }\n    }\n  },\n  width: {\n    orientation: {\n      vertical: {\n        default: '[2px]',\n        size: {\n          S: '[1px]',\n          L: '[4px]'\n        }\n      }\n    }\n  }\n}, getAllowedOverrides());\n\nfunction Divider(props: DividerProps, ref: DOMRef) {\n  [props, ref] = useSpectrumContextProps(props, ref, DividerContext);\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACSeparator\n      {...props}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={(props.UNSAFE_className || '') + divider({\n        size: props.size || 'M',\n        orientation: props.orientation || 'horizontal',\n        staticColor: props.staticColor\n      }, props.styles)} />\n  );\n}\n\n/**\n * Dividers bring clarity to a layout by grouping and dividing content in close proximity.\n * They can also be used to establish rhythm and hierarchy.\n */\nlet _Divider = /*#__PURE__*/ forwardRef(Divider);\nexport {_Divider as Divider};\n"],"names":[],"version":3,"file":"Divider.mjs.map"}
+{"mappings":";;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAgCM,MAAM,0DAAiB,CAAA,GAAA,oBAAY,EAAoD;AAEvF,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDN,MAAM,4CAAU,WAAW,GAAG,CAAA,GAAA,iBAAS,EAAE,SAAS,QAAQ,KAAmB,EAAE,GAAW;IAC/F,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IAEvB,qBACE,gBAAC,CAAA,GAAA,gBAAW;QACT,GAAG,KAAK;QACT,KAAK;QACL,OAAO,MAAM,YAAY;QACzB,WAAW,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,0CAAQ;YAClD,MAAM,MAAM,IAAI,IAAI;YACpB,aAAa,MAAM,WAAW,IAAI;YAClC,aAAa,MAAM,WAAW;YAC9B,eAAe,CAAC,CAAC,MAAM,WAAW;QACpC,GAAG,MAAM,MAAM;;AAErB","sources":["packages/@react-spectrum/s2/src/Divider.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, Separator as RACSeparator, SeparatorProps as RACSeparatorProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, staticColor, StyleProps} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n/*\n * Adding as it's own type to deal with size being a part of the theme so we\n * can type style() and it's parameters.\n */\ninterface DividerSpectrumProps {\n  /**\n   * How thick the Divider should be.\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L',\n  /**\n   * How thick the Divider should be.\n   * @default 'horizontal'\n   */\n  orientation?: 'horizontal' | 'vertical',\n  /** The static color style to apply. Useful when the Divider appears over a color background. */\n  staticColor?: 'white' | 'black' | 'auto'\n}\n\n// TODO: allow overriding height (only when orientation is vertical)??\nexport interface DividerProps extends DividerSpectrumProps, Omit<RACSeparatorProps, 'className' | 'style' | 'elementType'>, StyleProps {}\n\nexport const DividerContext = createContext<ContextValue<Partial<DividerProps>, DOMRefValue>>(null);\n\nexport const divider = style<DividerSpectrumProps & {isStaticColor: boolean}>({\n  ...staticColor(),\n  alignSelf: 'stretch',\n  backgroundColor: {\n    default: 'gray-200',\n    size: {\n      L: 'gray-800'\n    },\n    isStaticColor: {\n      default: 'transparent-overlay-200',\n      size: {\n        L: 'transparent-overlay-800'\n      }\n    },\n    forcedColors: 'ButtonBorder'\n  },\n  borderStyle: 'none',\n  borderRadius: 'full',\n  margin: 0,\n  height: {\n    orientation: {\n      horizontal: {\n        // These should be px not rems, because we're emulating a border.\n        default: '[2px]',\n        size: {\n          S: '[1px]',\n          L: '[4px]'\n        }\n      }\n    }\n  },\n  width: {\n    orientation: {\n      vertical: {\n        default: '[2px]',\n        size: {\n          S: '[1px]',\n          L: '[4px]'\n        }\n      }\n    }\n  }\n}, getAllowedOverrides());\n\n/**\n * Dividers bring clarity to a layout by grouping and dividing content in close proximity.\n * They can also be used to establish rhythm and hierarchy.\n */\nexport const Divider = /*#__PURE__*/ forwardRef(function Divider(props: DividerProps, ref: DOMRef) {\n  [props, ref] = useSpectrumContextProps(props, ref, DividerContext);\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACSeparator\n      {...props}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={(props.UNSAFE_className || '') + divider({\n        size: props.size || 'M',\n        orientation: props.orientation || 'horizontal',\n        staticColor: props.staticColor,\n        isStaticColor: !!props.staticColor\n      }, props.styles)} />\n  );\n});\n"],"names":[],"version":3,"file":"Divider.mjs.map"}

package/dist/DropZone.cjs

@@ -40,22 +40,22 @@ $parcel$export(module.exports, "DropZone", () => $797cda10ca96fc86$export$3c6489
 const $797cda10ca96fc86$export$14a72053295ff9a6 = /*#__PURE__*/ (0, $faaBC$react.createContext)(null);
 const $797cda10ca96fc86$var$dropzone = function anonymous(props, overrides) {
     let rules = " .";
-    let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|_9|_8|h|_5|_4|__A|__c|__d|__a|__b|U|__Q|X|Z|V|W|l|q|r|k|o|p)[^\s]+/g) || [];
+    let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|__a|_9|h|_6|_5|__B|__d|__e|__b|__c|V|__R|Y|_a|W|X|l|q|r|k|o|p)[^\s]+/g) || [];
     rules += matches.join('');
-    let $U = false;
-    for (let p of matches)if (/^\s*U/.test(p)) $U = true;
-    rules += ' _Zd';
-    rules += ' _2d';
-    rules += ' _1c';
-    if (!$U) rules += ' Uc';
-    rules += ' _c-bc1l9oh';
-    rules += ' _c-1uotwbwg';
-    rules += ' _c-eo0c6sf';
-    rules += ' _c-enzzrge';
-    rules += ' _c-enzykdd';
-    rules += ' _c-enzwzjc';
-    rules += ' _c-enzrfpb';
-    rules += ' _ca';
+    let $V = false;
+    for (let p of matches)if (/^\s*V/.test(p)) $V = true;
+    rules += ' _0d';
+    rules += ' _3d';
+    rules += ' _2c';
+    if (!$V) rules += ' Vc';
+    rules += ' _d-bc1l9oh';
+    rules += ' _d-1uotwbwg';
+    rules += ' _d-eo0c6sf';
+    rules += ' _d-enzzrge';
+    rules += ' _d-enzykdd';
+    rules += ' _d-enzwzjc';
+    rules += ' _d-enzrfpb';
+    rules += ' _da';
     rules += ' ao';
     if (props.isDropTarget) rules += ' wa';
     else rules += ' wb';
@@ -67,10 +67,10 @@ const $797cda10ca96fc86$var$dropzone = function anonymous(props, overrides) {
     if (props.isFocusVisible) rules += ' cx';
     else if (props.isDropTarget) rules += ' cx';
     else rules += ' ci';
-    rules += ' _vd';
     rules += ' _wd';
     rules += ' _xd';
     rules += ' _yd';
+    rules += ' _zd';
     rules += ' Eh';
     rules += ' Fh';
     rules += ' Ch';
@@ -79,29 +79,29 @@ const $797cda10ca96fc86$var$dropzone = function anonymous(props, overrides) {
 };
 const $797cda10ca96fc86$var$banner = function anonymous(props) {
     let rules = " .";
-    rules += ' Ua';
-    rules += ' Ya';
-    rules += ' _aa';
+    rules += ' Va';
+    rules += ' Za';
+    rules += ' _ba';
     rules += ' y_d';
     rules += ' z_d';
-    rules += ' _Zd';
-    rules += ' _1c';
-    rules += ' _2d';
+    rules += ' _0d';
+    rules += ' _2c';
+    rules += ' _3d';
     rules += ' o-375tou';
     rules += ' le';
     if (props.size === "L") rules += ' r___L';
     else if (props.size === "S") rules += ' r__Z';
     else rules += ' r___v';
-    if (props.isPressed) rules += ' b_____F';
-    else if (props.isFocusVisible) rules += ' b_____F';
-    else if (props.isHovered) rules += ' b_____F';
-    else rules += ' b_____E';
-    rules += ' _vc';
+    if (props.isPressed) rules += ' b_____S';
+    else if (props.isFocusVisible) rules += ' b_____S';
+    else if (props.isHovered) rules += ' b_____S';
+    else rules += ' b_____R';
     rules += ' _wc';
     rules += ' _xc';
     rules += ' _yc';
+    rules += ' _zc';
     rules += ' ac';
-    rules += ' _ed';
+    rules += ' _fd';
     rules += ' E-17c1d5h';
     rules += ' F-17c1d5h';
     rules += ' C-17c1d5h';
@@ -109,7 +109,7 @@ const $797cda10ca96fc86$var$banner = function anonymous(props) {
     rules += ' -_375tou_o-I';
     return rules;
 };
-function $797cda10ca96fc86$var$DropZone(props, ref) {
+const $797cda10ca96fc86$export$3c6489d84dc98b6 = /*#__PURE__*/ (0, $faaBC$react.forwardRef)(function DropZone(props, ref) {
     let stringFormatter = (0, $faaBC$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($4526404114e78c80$exports))), '@react-spectrum/s2');
     [props, ref] = (0, $ac757a4c2bd72aee$exports.useSpectrumContextProps)(props, ref, $797cda10ca96fc86$export$14a72053295ff9a6);
     let { size: size = 'M' } = props;
@@ -140,10 +140,7 @@ function $797cda10ca96fc86$var$DropZone(props, ref) {
                 ]
             })
     });
-}
-/**
- * A drop zone is an area into which one or multiple objects can be dragged and dropped.
- */ let $797cda10ca96fc86$export$3c6489d84dc98b6 = /*#__PURE__*/ (0, $faaBC$react.forwardRef)($797cda10ca96fc86$var$DropZone);
+});
 
 
 //# sourceMappingURL=DropZone.cjs.map

package/dist/DropZone.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;AA+BM,MAAM,0DAAkB,CAAA,GAAA,0BAAY,EAA4D;AAEvG,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwBN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwBN,SAAS,+BAAS,KAAoB,EAAE,GAA2B;IACjE,IAAI,kBAAkB,CAAA,GAAA,gDAA0B,EAAE,CAAA,GAAA,mDAAW,GAAG;IAChE,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,QACF,OAAO,KACR,GAAG;IACJ,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IAEvB,qBACE,gCAAC,CAAA,GAAA,mCAAU;QACR,GAAG,KAAK;QACT,KAAK;QACL,OAAO,MAAM,YAAY;QACzB,WAAW,CAAA,cAAe,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,+BAAS,aAAa,MAAM,MAAM;kBAC5F,CAAA,4BACC;;kCACE,gCAAC,CAAA,GAAA,mDAAwB,EAAE,QAAQ;wBAAC,OAAO;4BAAC,cAAc;4BAAM,cAAc,YAAY,YAAY;kCAAE;wBAAI;kCACzG,MAAM,QAAQ;;oBAEf,YAAY,YAAY,IAAI,MAAM,QAAQ,kBAC1C,gCAAC;wBAAI,WAAW,6BAAO;kCAAC;wBAAI;kCAC1B,cAAA,gCAAC;sCACE,MAAM,cAAc,GAAG,MAAM,cAAc,GAAG,gBAAgB,MAAM,CAAC;;;;;;AAQtF;AAEA;;CAEC,GACD,IAAI,2CAAY,WAAW,GAAG,CAAA,GAAA,uBAAS,EAAE","sources":["packages/@react-spectrum/s2/src/DropZone.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, DropZoneRenderProps, DropZone as RACDropZone, DropZoneProps as RACDropZoneProps} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {IllustratedMessageContext} from './IllustratedMessage';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface DropZoneProps extends Omit<RACDropZoneProps, 'className' | 'style' | 'children' | 'isDisabled' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, UnsafeStyles, DOMProps {\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight,\n  /** The content to display in the drop zone. */\n  children?: ReactNode,\n  /** Whether the drop zone has been filled. */\n  isFilled?: boolean,\n  /** The message to replace the default banner message that is shown when the drop zone is filled. */\n  replaceMessage?: string,\n  /**\n   * The size of the DropZone.\n   *\n   * @default 'M'\n   */\n    size?: 'S' | 'M' | 'L'\n}\n\nexport const DropZoneContext = createContext<ContextValue<DropZoneProps, DOMRefValue<HTMLDivElement>>>(null);\n\nconst dropzone = style<DropZoneRenderProps>({\n  display: 'flex',\n  justifyContent: 'center',\n  alignItems: 'center',\n  position: 'relative',\n  fontFamily: 'sans',\n  color: 'gray-900',\n  borderStyle: {\n    default: 'dashed',\n    isDropTarget: 'solid'\n  },\n  backgroundColor: {\n    isDropTarget: 'blue-200'\n  },\n  borderWidth: 2,\n  borderColor: {\n    default: 'gray-300',\n    isDropTarget: 'blue-800',\n    isFocusVisible: 'blue-800'\n  },\n  borderRadius: 'lg',\n  padding: 24\n}, getAllowedOverrides({height: true}));\n\nconst banner = style({\n  position: 'absolute',\n  left: 0,\n  right: 0,\n  marginX: 'auto',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  minHeight: 20,\n  width: 'fit',\n  maxWidth: {\n    default: 192,\n    size: {\n      S: 160,\n      L: 208\n    }\n  },\n  backgroundColor: 'accent',\n  borderRadius: 'default',\n  color: 'white',\n  fontWeight: 'bold',\n  padding: '[calc((self(minHeight))/1.5)]'\n});\n\nfunction DropZone(props: DropZoneProps, ref: DOMRef<HTMLDivElement>) {\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  [props, ref] = useSpectrumContextProps(props, ref, DropZoneContext);\n  let {\n    size = 'M'\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACDropZone\n      {...props}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={renderProps => (props.UNSAFE_className || '') + dropzone(renderProps, props.styles)}>\n      {renderProps => (\n        <>\n          <IllustratedMessageContext.Provider value={{isInDropZone: true, isDropTarget: renderProps.isDropTarget, size}}>\n            {props.children}\n          </IllustratedMessageContext.Provider>\n          {(renderProps.isDropTarget && props.isFilled) &&\n            <div className={banner({size})}>\n              <span>\n                {props.replaceMessage ? props.replaceMessage : stringFormatter.format('dropzone.replaceMessage')}\n              </span>\n            </div>\n          }\n        </>\n      )}\n    </RACDropZone>\n  );\n}\n\n/**\n * A drop zone is an area into which one or multiple objects can be dragged and dropped.\n */\nlet _DropZone = /*#__PURE__*/ forwardRef(DropZone);\nexport {_DropZone as DropZone};\n"],"names":[],"version":3,"file":"DropZone.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;AA+BM,MAAM,0DAAkB,CAAA,GAAA,0BAAY,EAAqE;AAEhH,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwBN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BC,MAAM,2CAAW,WAAW,GAAG,CAAA,GAAA,uBAAS,EAAE,SAAS,SAAS,KAAoB,EAAE,GAA2B;IAClH,IAAI,kBAAkB,CAAA,GAAA,gDAA0B,EAAE,CAAA,GAAA,mDAAW,GAAG;IAChE,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,QACF,OAAO,KACR,GAAG;IACJ,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IAEvB,qBACE,gCAAC,CAAA,GAAA,mCAAU;QACR,GAAG,KAAK;QACT,KAAK;QACL,OAAO,MAAM,YAAY;QACzB,WAAW,CAAA,cAAe,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,+BAAS,aAAa,MAAM,MAAM;kBAC5F,CAAA,4BACC;;kCACE,gCAAC,CAAA,GAAA,mDAAwB,EAAE,QAAQ;wBAAC,OAAO;4BAAC,cAAc;4BAAM,cAAc,YAAY,YAAY;kCAAE;wBAAI;kCACzG,MAAM,QAAQ;;oBAEf,YAAY,YAAY,IAAI,MAAM,QAAQ,kBAC1C,gCAAC;wBAAI,WAAW,6BAAO;kCAAC;wBAAI;kCAC1B,cAAA,gCAAC;sCACE,MAAM,cAAc,GAAG,MAAM,cAAc,GAAG,gBAAgB,MAAM,CAAC;;;;;;AAQtF","sources":["packages/@react-spectrum/s2/src/DropZone.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, DropZoneRenderProps, DropZone as RACDropZone, DropZoneProps as RACDropZoneProps} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {IllustratedMessageContext} from './IllustratedMessage';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface DropZoneProps extends Omit<RACDropZoneProps, 'className' | 'style' | 'children' | 'isDisabled' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, UnsafeStyles, DOMProps {\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight,\n  /** The content to display in the drop zone. */\n  children: ReactNode,\n  /** Whether the drop zone has been filled. */\n  isFilled?: boolean,\n  /** The message to replace the default banner message that is shown when the drop zone is filled. */\n  replaceMessage?: string,\n  /**\n   * The size of the DropZone.\n   *\n   * @default 'M'\n   */\n    size?: 'S' | 'M' | 'L'\n}\n\nexport const DropZoneContext = createContext<ContextValue<Partial<DropZoneProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst dropzone = style<DropZoneRenderProps>({\n  display: 'flex',\n  justifyContent: 'center',\n  alignItems: 'center',\n  position: 'relative',\n  fontFamily: 'sans',\n  color: 'gray-900',\n  borderStyle: {\n    default: 'dashed',\n    isDropTarget: 'solid'\n  },\n  backgroundColor: {\n    isDropTarget: 'blue-200'\n  },\n  borderWidth: 2,\n  borderColor: {\n    default: 'gray-300',\n    isDropTarget: 'blue-800',\n    isFocusVisible: 'blue-800'\n  },\n  borderRadius: 'lg',\n  padding: 24\n}, getAllowedOverrides({height: true}));\n\nconst banner = style({\n  position: 'absolute',\n  left: 0,\n  right: 0,\n  marginX: 'auto',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  minHeight: 20,\n  width: 'fit',\n  maxWidth: {\n    default: 192,\n    size: {\n      S: 160,\n      L: 208\n    }\n  },\n  backgroundColor: 'accent',\n  borderRadius: 'default',\n  color: 'white',\n  fontWeight: 'bold',\n  padding: '[calc((self(minHeight))/1.5)]'\n});\n\n/**\n * A drop zone is an area into which one or multiple objects can be dragged and dropped.\n */\nexport const DropZone = /*#__PURE__*/ forwardRef(function DropZone(props: DropZoneProps, ref: DOMRef<HTMLDivElement>) {\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  [props, ref] = useSpectrumContextProps(props, ref, DropZoneContext);\n  let {\n    size = 'M'\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACDropZone\n      {...props}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={renderProps => (props.UNSAFE_className || '') + dropzone(renderProps, props.styles)}>\n      {renderProps => (\n        <>\n          <IllustratedMessageContext.Provider value={{isInDropZone: true, isDropTarget: renderProps.isDropTarget, size}}>\n            {props.children}\n          </IllustratedMessageContext.Provider>\n          {(renderProps.isDropTarget && props.isFilled) &&\n            <div className={banner({size})}>\n              <span>\n                {props.replaceMessage ? props.replaceMessage : stringFormatter.format('dropzone.replaceMessage')}\n              </span>\n            </div>\n          }\n        </>\n      )}\n    </RACDropZone>\n  );\n});\n"],"names":[],"version":3,"file":"DropZone.cjs.map"}

package/dist/DropZone.css

@@ -1,9 +1,9 @@
 @layer _.a {
-  .Uc {
+  .Vc {
     position: relative;
   }
 
-  ._ca {
+  ._da {
     font-family: adobe-clean-variable, adobe-clean, ui-sans-serif, system-ui, sans-serif;
   }
 
@@ -47,19 +47,19 @@
     border-color: var(--lightningcss-light, #4b75ff) var(--lightningcss-dark, #4069fd);
   }
 
-  ._vd {
+  ._wd {
     border-start-start-radius: .625rem;
   }
 
-  ._wd {
+  ._xd {
     border-start-end-radius: .625rem;
   }
 
-  ._xd {
+  ._yd {
     border-end-start-radius: .625rem;
   }
 
-  ._yd {
+  ._zd {
     border-end-end-radius: .625rem;
   }
 
@@ -79,15 +79,15 @@
     padding-inline-end: 1.5rem;
   }
 
-  .Ua {
+  .Va {
     position: absolute;
   }
 
-  .Ya {
+  .Za {
     left: 0;
   }
 
-  ._aa {
+  ._ba {
     right: 0;
   }
 
@@ -99,15 +99,15 @@
     margin-inline-end: auto;
   }
 
-  ._Zd {
+  ._0d {
     display: flex;
   }
 
-  ._1c {
+  ._2c {
     align-items: center;
   }
 
-  ._2d {
+  ._3d {
     justify-content: center;
   }
 
@@ -131,27 +131,27 @@
     max-width: calc(13rem * var(--s2-scale));
   }
 
-  .b_____E {
+  .b_____R {
     background-color: var(--lightningcss-light, #3b63fb) var(--lightningcss-dark, #4069fd);
   }
 
-  .b_____F {
+  .b_____S {
     background-color: var(--lightningcss-light, #274dea) var(--lightningcss-dark, #345bf8);
   }
 
-  ._vc {
+  ._wc {
     border-start-start-radius: .5rem;
   }
 
-  ._wc {
+  ._xc {
     border-start-end-radius: .5rem;
   }
 
-  ._xc {
+  ._yc {
     border-end-start-radius: .5rem;
   }
 
-  ._yc {
+  ._zc {
     border-end-end-radius: .5rem;
   }
 
@@ -159,7 +159,7 @@
     color: #fff;
   }
 
-  ._ed {
+  ._fd {
     font-variation-settings: "wght" 700;
     font-synthesis-weight: none;
     font-weight: 700;
@@ -187,50 +187,44 @@
 }
 
 @layer _.b {
-  ._c-enzrfpb:lang(ar) {
+  ._d-enzrfpb:lang(ar) {
     font-family: myriad-arabic, ui-sans-serif, system-ui, sans-serif;
   }
 }
 
 @layer _.c {
-  ._c-enzwzjc:lang(he) {
+  ._d-enzwzjc:lang(he) {
     font-family: myriad-hebrew, ui-sans-serif, system-ui, sans-serif;
   }
 }
 
 @layer _.d {
-  ._c-enzykdd:lang(ja) {
+  ._d-enzykdd:lang(ja) {
     font-family: adobe-clean-han-japanese, Hiragino Kaku Gothic ProN, ヒラギノ角ゴ ProN W3, Osaka, YuGothic, Yu Gothic, メイリオ, Meiryo, ＭＳ Ｐゴシック, MS PGothic, sans-serif;
   }
 }
 
 @layer _.e {
-  ._c-enzzrge:lang(ko) {
+  ._d-enzzrge:lang(ko) {
     font-family: adobe-clean-han-korean, source-han-korean, Malgun Gothic, Apple Gothic, sans-serif;
   }
 }
 
 @layer _.f {
-  ._c-eo0c6sf:lang(zh) {
+  ._d-eo0c6sf:lang(zh) {
     font-family: adobe-clean-han-traditional, source-han-traditional, MingLiu, Heiti TC Light, sans-serif;
   }
 }
 
 @layer _.g {
-  ._c-1uotwbwg:lang(zh-hant) {
+  ._d-1uotwbwg:lang(zh-hant) {
     font-family: adobe-clean-han-traditional, source-han-traditional, MingLiu, Microsoft JhengHei UI, Microsoft JhengHei, Heiti TC Light, sans-serif;
   }
 }
 
 @layer _.h {
-  ._c-bc1l9oh:is(:lang(zh-Hans), :lang(zh-CN), :lang(zh-SG)) {
+  ._d-bc1l9oh:is(:lang(zh-Hans), :lang(zh-CN), :lang(zh-SG)) {
     font-family: adobe-clean-han-simplified-c, source-han-simplified-c, SimSun, Heiti SC Light, sans-serif;
   }
 }
-
-@layer UNSAFE_overrides;
-
-.\.:not(#a#b) {
-  all: revert-layer;
-}
 /*# sourceMappingURL=DropZone.css.map */

package/dist/DropZone.css.map

@@ -1 +1 @@
-{"mappings":"AC2CiB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAwBF;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAxBE;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;;AAwBF","sources":["1c1855bb3a6aeea4","packages/@react-spectrum/s2/src/DropZone.tsx"],"sourcesContent":["@import \"ab564bdb126b567b\";\n@import \"d5049ba06c2da1c6\";\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, DropZoneRenderProps, DropZone as RACDropZone, DropZoneProps as RACDropZoneProps} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {IllustratedMessageContext} from './IllustratedMessage';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface DropZoneProps extends Omit<RACDropZoneProps, 'className' | 'style' | 'children' | 'isDisabled' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, UnsafeStyles, DOMProps {\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight,\n  /** The content to display in the drop zone. */\n  children?: ReactNode,\n  /** Whether the drop zone has been filled. */\n  isFilled?: boolean,\n  /** The message to replace the default banner message that is shown when the drop zone is filled. */\n  replaceMessage?: string,\n  /**\n   * The size of the DropZone.\n   *\n   * @default 'M'\n   */\n    size?: 'S' | 'M' | 'L'\n}\n\nexport const DropZoneContext = createContext<ContextValue<DropZoneProps, DOMRefValue<HTMLDivElement>>>(null);\n\nconst dropzone = style<DropZoneRenderProps>({\n  display: 'flex',\n  justifyContent: 'center',\n  alignItems: 'center',\n  position: 'relative',\n  fontFamily: 'sans',\n  color: 'gray-900',\n  borderStyle: {\n    default: 'dashed',\n    isDropTarget: 'solid'\n  },\n  backgroundColor: {\n    isDropTarget: 'blue-200'\n  },\n  borderWidth: 2,\n  borderColor: {\n    default: 'gray-300',\n    isDropTarget: 'blue-800',\n    isFocusVisible: 'blue-800'\n  },\n  borderRadius: 'lg',\n  padding: 24\n}, getAllowedOverrides({height: true}));\n\nconst banner = style({\n  position: 'absolute',\n  left: 0,\n  right: 0,\n  marginX: 'auto',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  minHeight: 20,\n  width: 'fit',\n  maxWidth: {\n    default: 192,\n    size: {\n      S: 160,\n      L: 208\n    }\n  },\n  backgroundColor: 'accent',\n  borderRadius: 'default',\n  color: 'white',\n  fontWeight: 'bold',\n  padding: '[calc((self(minHeight))/1.5)]'\n});\n\nfunction DropZone(props: DropZoneProps, ref: DOMRef<HTMLDivElement>) {\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  [props, ref] = useSpectrumContextProps(props, ref, DropZoneContext);\n  let {\n    size = 'M'\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACDropZone\n      {...props}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={renderProps => (props.UNSAFE_className || '') + dropzone(renderProps, props.styles)}>\n      {renderProps => (\n        <>\n          <IllustratedMessageContext.Provider value={{isInDropZone: true, isDropTarget: renderProps.isDropTarget, size}}>\n            {props.children}\n          </IllustratedMessageContext.Provider>\n          {(renderProps.isDropTarget && props.isFilled) &&\n            <div className={banner({size})}>\n              <span>\n                {props.replaceMessage ? props.replaceMessage : stringFormatter.format('dropzone.replaceMessage')}\n              </span>\n            </div>\n          }\n        </>\n      )}\n    </RACDropZone>\n  );\n}\n\n/**\n * A drop zone is an area into which one or multiple objects can be dragged and dropped.\n */\nlet _DropZone = /*#__PURE__*/ forwardRef(DropZone);\nexport {_DropZone as DropZone};\n"],"names":[],"version":3,"file":"DropZone.css.map"}
+{"mappings":"AC2CiB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAwBF;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAxBE;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA","sources":["1c1855bb3a6aeea4","packages/@react-spectrum/s2/src/DropZone.tsx"],"sourcesContent":["@import \"ab564bdb126b567b\";\n@import \"d5049ba06c2da1c6\";\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, DropZoneRenderProps, DropZone as RACDropZone, DropZoneProps as RACDropZoneProps} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {IllustratedMessageContext} from './IllustratedMessage';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface DropZoneProps extends Omit<RACDropZoneProps, 'className' | 'style' | 'children' | 'isDisabled' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, UnsafeStyles, DOMProps {\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight,\n  /** The content to display in the drop zone. */\n  children: ReactNode,\n  /** Whether the drop zone has been filled. */\n  isFilled?: boolean,\n  /** The message to replace the default banner message that is shown when the drop zone is filled. */\n  replaceMessage?: string,\n  /**\n   * The size of the DropZone.\n   *\n   * @default 'M'\n   */\n    size?: 'S' | 'M' | 'L'\n}\n\nexport const DropZoneContext = createContext<ContextValue<Partial<DropZoneProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst dropzone = style<DropZoneRenderProps>({\n  display: 'flex',\n  justifyContent: 'center',\n  alignItems: 'center',\n  position: 'relative',\n  fontFamily: 'sans',\n  color: 'gray-900',\n  borderStyle: {\n    default: 'dashed',\n    isDropTarget: 'solid'\n  },\n  backgroundColor: {\n    isDropTarget: 'blue-200'\n  },\n  borderWidth: 2,\n  borderColor: {\n    default: 'gray-300',\n    isDropTarget: 'blue-800',\n    isFocusVisible: 'blue-800'\n  },\n  borderRadius: 'lg',\n  padding: 24\n}, getAllowedOverrides({height: true}));\n\nconst banner = style({\n  position: 'absolute',\n  left: 0,\n  right: 0,\n  marginX: 'auto',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  minHeight: 20,\n  width: 'fit',\n  maxWidth: {\n    default: 192,\n    size: {\n      S: 160,\n      L: 208\n    }\n  },\n  backgroundColor: 'accent',\n  borderRadius: 'default',\n  color: 'white',\n  fontWeight: 'bold',\n  padding: '[calc((self(minHeight))/1.5)]'\n});\n\n/**\n * A drop zone is an area into which one or multiple objects can be dragged and dropped.\n */\nexport const DropZone = /*#__PURE__*/ forwardRef(function DropZone(props: DropZoneProps, ref: DOMRef<HTMLDivElement>) {\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  [props, ref] = useSpectrumContextProps(props, ref, DropZoneContext);\n  let {\n    size = 'M'\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACDropZone\n      {...props}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={renderProps => (props.UNSAFE_className || '') + dropzone(renderProps, props.styles)}>\n      {renderProps => (\n        <>\n          <IllustratedMessageContext.Provider value={{isInDropZone: true, isDropTarget: renderProps.isDropTarget, size}}>\n            {props.children}\n          </IllustratedMessageContext.Provider>\n          {(renderProps.isDropTarget && props.isFilled) &&\n            <div className={banner({size})}>\n              <span>\n                {props.replaceMessage ? props.replaceMessage : stringFormatter.format('dropzone.replaceMessage')}\n              </span>\n            </div>\n          }\n        </>\n      )}\n    </RACDropZone>\n  );\n});\n"],"names":[],"version":3,"file":"DropZone.css.map"}

package/dist/DropZone.mjs

@@ -33,22 +33,22 @@ function $parcel$interopDefault(a) {
 const $fb6e45fba2483f65$export$14a72053295ff9a6 = /*#__PURE__*/ (0, $4h9kk$createContext)(null);
 const $fb6e45fba2483f65$var$dropzone = function anonymous(props, overrides) {
     let rules = " .";
-    let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|_9|_8|h|_5|_4|__A|__c|__d|__a|__b|U|__Q|X|Z|V|W|l|q|r|k|o|p)[^\s]+/g) || [];
+    let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|__a|_9|h|_6|_5|__B|__d|__e|__b|__c|V|__R|Y|_a|W|X|l|q|r|k|o|p)[^\s]+/g) || [];
     rules += matches.join('');
-    let $U = false;
-    for (let p of matches)if (/^\s*U/.test(p)) $U = true;
-    rules += ' _Zd';
-    rules += ' _2d';
-    rules += ' _1c';
-    if (!$U) rules += ' Uc';
-    rules += ' _c-bc1l9oh';
-    rules += ' _c-1uotwbwg';
-    rules += ' _c-eo0c6sf';
-    rules += ' _c-enzzrge';
-    rules += ' _c-enzykdd';
-    rules += ' _c-enzwzjc';
-    rules += ' _c-enzrfpb';
-    rules += ' _ca';
+    let $V = false;
+    for (let p of matches)if (/^\s*V/.test(p)) $V = true;
+    rules += ' _0d';
+    rules += ' _3d';
+    rules += ' _2c';
+    if (!$V) rules += ' Vc';
+    rules += ' _d-bc1l9oh';
+    rules += ' _d-1uotwbwg';
+    rules += ' _d-eo0c6sf';
+    rules += ' _d-enzzrge';
+    rules += ' _d-enzykdd';
+    rules += ' _d-enzwzjc';
+    rules += ' _d-enzrfpb';
+    rules += ' _da';
     rules += ' ao';
     if (props.isDropTarget) rules += ' wa';
     else rules += ' wb';
@@ -60,10 +60,10 @@ const $fb6e45fba2483f65$var$dropzone = function anonymous(props, overrides) {
     if (props.isFocusVisible) rules += ' cx';
     else if (props.isDropTarget) rules += ' cx';
     else rules += ' ci';
-    rules += ' _vd';
     rules += ' _wd';
     rules += ' _xd';
     rules += ' _yd';
+    rules += ' _zd';
     rules += ' Eh';
     rules += ' Fh';
     rules += ' Ch';
@@ -72,29 +72,29 @@ const $fb6e45fba2483f65$var$dropzone = function anonymous(props, overrides) {
 };
 const $fb6e45fba2483f65$var$banner = function anonymous(props) {
     let rules = " .";
-    rules += ' Ua';
-    rules += ' Ya';
-    rules += ' _aa';
+    rules += ' Va';
+    rules += ' Za';
+    rules += ' _ba';
     rules += ' y_d';
     rules += ' z_d';
-    rules += ' _Zd';
-    rules += ' _1c';
-    rules += ' _2d';
+    rules += ' _0d';
+    rules += ' _2c';
+    rules += ' _3d';
     rules += ' o-375tou';
     rules += ' le';
     if (props.size === "L") rules += ' r___L';
     else if (props.size === "S") rules += ' r__Z';
     else rules += ' r___v';
-    if (props.isPressed) rules += ' b_____F';
-    else if (props.isFocusVisible) rules += ' b_____F';
-    else if (props.isHovered) rules += ' b_____F';
-    else rules += ' b_____E';
-    rules += ' _vc';
+    if (props.isPressed) rules += ' b_____S';
+    else if (props.isFocusVisible) rules += ' b_____S';
+    else if (props.isHovered) rules += ' b_____S';
+    else rules += ' b_____R';
     rules += ' _wc';
     rules += ' _xc';
     rules += ' _yc';
+    rules += ' _zc';
     rules += ' ac';
-    rules += ' _ed';
+    rules += ' _fd';
     rules += ' E-17c1d5h';
     rules += ' F-17c1d5h';
     rules += ' C-17c1d5h';
@@ -102,7 +102,7 @@ const $fb6e45fba2483f65$var$banner = function anonymous(props) {
     rules += ' -_375tou_o-I';
     return rules;
 };
-function $fb6e45fba2483f65$var$DropZone(props, ref) {
+const $fb6e45fba2483f65$export$3c6489d84dc98b6 = /*#__PURE__*/ (0, $4h9kk$forwardRef)(function DropZone(props, ref) {
     let stringFormatter = (0, $4h9kk$useLocalizedStringFormatter)((0, ($parcel$interopDefault($4h9kk$intlStringsmjs))), '@react-spectrum/s2');
     [props, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $fb6e45fba2483f65$export$14a72053295ff9a6);
     let { size: size = 'M' } = props;
@@ -133,10 +133,7 @@ function $fb6e45fba2483f65$var$DropZone(props, ref) {
                 ]
             })
     });
-}
-/**
- * A drop zone is an area into which one or multiple objects can be dragged and dropped.
- */ let $fb6e45fba2483f65$export$3c6489d84dc98b6 = /*#__PURE__*/ (0, $4h9kk$forwardRef)($fb6e45fba2483f65$var$DropZone);
+});
 
 
 export {$fb6e45fba2483f65$export$14a72053295ff9a6 as DropZoneContext, $fb6e45fba2483f65$export$3c6489d84dc98b6 as DropZone};

package/dist/DropZone.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;AA+BM,MAAM,0DAAkB,CAAA,GAAA,oBAAY,EAA4D;AAEvG,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwBN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwBN,SAAS,+BAAS,KAAoB,EAAE,GAA2B;IACjE,IAAI,kBAAkB,CAAA,GAAA,kCAA0B,EAAE,CAAA,GAAA,+CAAW,GAAG;IAChE,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,QACF,OAAO,KACR,GAAG;IACJ,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IAEvB,qBACE,gBAAC,CAAA,GAAA,eAAU;QACR,GAAG,KAAK;QACT,KAAK;QACL,OAAO,MAAM,YAAY;QACzB,WAAW,CAAA,cAAe,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,+BAAS,aAAa,MAAM,MAAM;kBAC5F,CAAA,4BACC;;kCACE,gBAAC,CAAA,GAAA,yCAAwB,EAAE,QAAQ;wBAAC,OAAO;4BAAC,cAAc;4BAAM,cAAc,YAAY,YAAY;kCAAE;wBAAI;kCACzG,MAAM,QAAQ;;oBAEf,YAAY,YAAY,IAAI,MAAM,QAAQ,kBAC1C,gBAAC;wBAAI,WAAW,6BAAO;kCAAC;wBAAI;kCAC1B,cAAA,gBAAC;sCACE,MAAM,cAAc,GAAG,MAAM,cAAc,GAAG,gBAAgB,MAAM,CAAC;;;;;;AAQtF;AAEA;;CAEC,GACD,IAAI,2CAAY,WAAW,GAAG,CAAA,GAAA,iBAAS,EAAE","sources":["packages/@react-spectrum/s2/src/DropZone.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, DropZoneRenderProps, DropZone as RACDropZone, DropZoneProps as RACDropZoneProps} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {IllustratedMessageContext} from './IllustratedMessage';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface DropZoneProps extends Omit<RACDropZoneProps, 'className' | 'style' | 'children' | 'isDisabled' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, UnsafeStyles, DOMProps {\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight,\n  /** The content to display in the drop zone. */\n  children?: ReactNode,\n  /** Whether the drop zone has been filled. */\n  isFilled?: boolean,\n  /** The message to replace the default banner message that is shown when the drop zone is filled. */\n  replaceMessage?: string,\n  /**\n   * The size of the DropZone.\n   *\n   * @default 'M'\n   */\n    size?: 'S' | 'M' | 'L'\n}\n\nexport const DropZoneContext = createContext<ContextValue<DropZoneProps, DOMRefValue<HTMLDivElement>>>(null);\n\nconst dropzone = style<DropZoneRenderProps>({\n  display: 'flex',\n  justifyContent: 'center',\n  alignItems: 'center',\n  position: 'relative',\n  fontFamily: 'sans',\n  color: 'gray-900',\n  borderStyle: {\n    default: 'dashed',\n    isDropTarget: 'solid'\n  },\n  backgroundColor: {\n    isDropTarget: 'blue-200'\n  },\n  borderWidth: 2,\n  borderColor: {\n    default: 'gray-300',\n    isDropTarget: 'blue-800',\n    isFocusVisible: 'blue-800'\n  },\n  borderRadius: 'lg',\n  padding: 24\n}, getAllowedOverrides({height: true}));\n\nconst banner = style({\n  position: 'absolute',\n  left: 0,\n  right: 0,\n  marginX: 'auto',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  minHeight: 20,\n  width: 'fit',\n  maxWidth: {\n    default: 192,\n    size: {\n      S: 160,\n      L: 208\n    }\n  },\n  backgroundColor: 'accent',\n  borderRadius: 'default',\n  color: 'white',\n  fontWeight: 'bold',\n  padding: '[calc((self(minHeight))/1.5)]'\n});\n\nfunction DropZone(props: DropZoneProps, ref: DOMRef<HTMLDivElement>) {\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  [props, ref] = useSpectrumContextProps(props, ref, DropZoneContext);\n  let {\n    size = 'M'\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACDropZone\n      {...props}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={renderProps => (props.UNSAFE_className || '') + dropzone(renderProps, props.styles)}>\n      {renderProps => (\n        <>\n          <IllustratedMessageContext.Provider value={{isInDropZone: true, isDropTarget: renderProps.isDropTarget, size}}>\n            {props.children}\n          </IllustratedMessageContext.Provider>\n          {(renderProps.isDropTarget && props.isFilled) &&\n            <div className={banner({size})}>\n              <span>\n                {props.replaceMessage ? props.replaceMessage : stringFormatter.format('dropzone.replaceMessage')}\n              </span>\n            </div>\n          }\n        </>\n      )}\n    </RACDropZone>\n  );\n}\n\n/**\n * A drop zone is an area into which one or multiple objects can be dragged and dropped.\n */\nlet _DropZone = /*#__PURE__*/ forwardRef(DropZone);\nexport {_DropZone as DropZone};\n"],"names":[],"version":3,"file":"DropZone.mjs.map"}
+{"mappings":";;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;AA+BM,MAAM,0DAAkB,CAAA,GAAA,oBAAY,EAAqE;AAEhH,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwBN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BC,MAAM,2CAAW,WAAW,GAAG,CAAA,GAAA,iBAAS,EAAE,SAAS,SAAS,KAAoB,EAAE,GAA2B;IAClH,IAAI,kBAAkB,CAAA,GAAA,kCAA0B,EAAE,CAAA,GAAA,+CAAW,GAAG;IAChE,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,QACF,OAAO,KACR,GAAG;IACJ,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IAEvB,qBACE,gBAAC,CAAA,GAAA,eAAU;QACR,GAAG,KAAK;QACT,KAAK;QACL,OAAO,MAAM,YAAY;QACzB,WAAW,CAAA,cAAe,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,+BAAS,aAAa,MAAM,MAAM;kBAC5F,CAAA,4BACC;;kCACE,gBAAC,CAAA,GAAA,yCAAwB,EAAE,QAAQ;wBAAC,OAAO;4BAAC,cAAc;4BAAM,cAAc,YAAY,YAAY;kCAAE;wBAAI;kCACzG,MAAM,QAAQ;;oBAEf,YAAY,YAAY,IAAI,MAAM,QAAQ,kBAC1C,gBAAC;wBAAI,WAAW,6BAAO;kCAAC;wBAAI;kCAC1B,cAAA,gBAAC;sCACE,MAAM,cAAc,GAAG,MAAM,cAAc,GAAG,gBAAgB,MAAM,CAAC;;;;;;AAQtF","sources":["packages/@react-spectrum/s2/src/DropZone.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, DropZoneRenderProps, DropZone as RACDropZone, DropZoneProps as RACDropZoneProps} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {IllustratedMessageContext} from './IllustratedMessage';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface DropZoneProps extends Omit<RACDropZoneProps, 'className' | 'style' | 'children' | 'isDisabled' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, UnsafeStyles, DOMProps {\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight,\n  /** The content to display in the drop zone. */\n  children: ReactNode,\n  /** Whether the drop zone has been filled. */\n  isFilled?: boolean,\n  /** The message to replace the default banner message that is shown when the drop zone is filled. */\n  replaceMessage?: string,\n  /**\n   * The size of the DropZone.\n   *\n   * @default 'M'\n   */\n    size?: 'S' | 'M' | 'L'\n}\n\nexport const DropZoneContext = createContext<ContextValue<Partial<DropZoneProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst dropzone = style<DropZoneRenderProps>({\n  display: 'flex',\n  justifyContent: 'center',\n  alignItems: 'center',\n  position: 'relative',\n  fontFamily: 'sans',\n  color: 'gray-900',\n  borderStyle: {\n    default: 'dashed',\n    isDropTarget: 'solid'\n  },\n  backgroundColor: {\n    isDropTarget: 'blue-200'\n  },\n  borderWidth: 2,\n  borderColor: {\n    default: 'gray-300',\n    isDropTarget: 'blue-800',\n    isFocusVisible: 'blue-800'\n  },\n  borderRadius: 'lg',\n  padding: 24\n}, getAllowedOverrides({height: true}));\n\nconst banner = style({\n  position: 'absolute',\n  left: 0,\n  right: 0,\n  marginX: 'auto',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  minHeight: 20,\n  width: 'fit',\n  maxWidth: {\n    default: 192,\n    size: {\n      S: 160,\n      L: 208\n    }\n  },\n  backgroundColor: 'accent',\n  borderRadius: 'default',\n  color: 'white',\n  fontWeight: 'bold',\n  padding: '[calc((self(minHeight))/1.5)]'\n});\n\n/**\n * A drop zone is an area into which one or multiple objects can be dragged and dropped.\n */\nexport const DropZone = /*#__PURE__*/ forwardRef(function DropZone(props: DropZoneProps, ref: DOMRef<HTMLDivElement>) {\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  [props, ref] = useSpectrumContextProps(props, ref, DropZoneContext);\n  let {\n    size = 'M'\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACDropZone\n      {...props}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={renderProps => (props.UNSAFE_className || '') + dropzone(renderProps, props.styles)}>\n      {renderProps => (\n        <>\n          <IllustratedMessageContext.Provider value={{isInDropZone: true, isDropTarget: renderProps.isDropTarget, size}}>\n            {props.children}\n          </IllustratedMessageContext.Provider>\n          {(renderProps.isDropTarget && props.isFilled) &&\n            <div className={banner({size})}>\n              <span>\n                {props.replaceMessage ? props.replaceMessage : stringFormatter.format('dropzone.replaceMessage')}\n              </span>\n            </div>\n          }\n        </>\n      )}\n    </RACDropZone>\n  );\n});\n"],"names":[],"version":3,"file":"DropZone.mjs.map"}