@react-spectrum/s2 0.5.0 → 0.7.0

package/dist/Form.mjs

@@ -42,7 +42,7 @@ function $9b916426527cebe7$export$a6b5be5c6b451665(props) {
         isSkeleton
     ]);
 }
-function $9b916426527cebe7$var$Form(props, ref) {
+const $9b916426527cebe7$export$a7fed597f4b8afd8 = /*#__PURE__*/ (0, $i5kLT$forwardRef)(function Form(props, ref) {
     let { labelPosition: labelPosition = 'top', labelAlign: labelAlign, necessityIndicator: necessityIndicator, isRequired: isRequired, isDisabled: isDisabled, isEmphasized: isEmphasized, size: size = 'M', ...formProps } = props;
     let domRef = (0, $i5kLT$useDOMRef)(ref);
     return /*#__PURE__*/ (0, $i5kLT$jsx)((0, $i5kLT$Form), {
@@ -51,11 +51,11 @@ function $9b916426527cebe7$var$Form(props, ref) {
         style: props.UNSAFE_style,
         className: (props.UNSAFE_className || '') + 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('');
-            rules += ' _Zf';
-            if (props.labelPosition === "side") rules += ' __h-hgmn7f';
-            else if (props.labelPosition === "top") rules += ' __h-nvqmqy';
+            rules += ' _0f';
+            if (props.labelPosition === "side") rules += ' __i-1owsa0z';
+            else if (props.labelPosition === "top") rules += ' __i-1ev27ke';
             if (props.size === "XL") rules += ' il';
             else if (props.size === "L") rules += ' ij';
             else if (props.size === "M") rules += ' ih';
@@ -80,10 +80,7 @@ function $9b916426527cebe7$var$Form(props, ref) {
             children: props.children
         })
     });
-}
-/**
- * Forms allow users to enter data that can be submitted while providing alignment and styling for form fields.
- */ let $9b916426527cebe7$export$a7fed597f4b8afd8 = /*#__PURE__*/ (0, $i5kLT$forwardRef)($9b916426527cebe7$var$Form);
+});
 
 
 export {$9b916426527cebe7$export$c24727297075ec6a as FormContext, $9b916426527cebe7$export$a6b5be5c6b451665 as useFormProps, $9b916426527cebe7$export$a7fed597f4b8afd8 as Form};

package/dist/Form.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AA0BM,MAAM,0DAAc,CAAA,GAAA,oBAAY,EAAyB;AACzD,SAAS,0CAAuC,KAAQ;IAC7D,IAAI,MAAM,CAAA,GAAA,iBAAS,EAAE;IACrB,IAAI,aAAa,CAAA,GAAA,yCAAY;IAC7B,OAAO,CAAA,GAAA,cAAM,EAAE;QACb,IAAI,SAAY;QAChB,IAAI,OAAO,YACT,SAAS;YAAC,GAAG,KAAK;QAAA;QAGpB,IAAI,KAAK;YACP,8EAA8E;YAC9E,IAAK,IAAI,OAAO,IACd,IAAI,MAAM,CAAC,IAAI,KAAK,WAClB,MAAM,CAAC,IAAI,GAAG,GAAG,CAAC,IAAI;QAG5B;QAEA,yCAAyC;QACzC,IAAI,YACF,OAAO,UAAU,GAAG;QAGtB,OAAO;IACT,GAAG;QAAC;QAAK;QAAO;KAAW;AAC7B;AAEA,SAAS,2BAAK,KAAgB,EAAE,GAA4B;IAC1D,IAAI,iBACF,gBAAgB,mBAChB,UAAU,sBACV,kBAAkB,cAClB,UAAU,cACV,UAAU,gBACV,YAAY,QACZ,OAAO,KACP,GAAG,WACJ,GAAG;IACJ,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IAEvB,qBACE,gBAAC,CAAA,GAAA,WAAM;QACJ,GAAG,SAAS;QACb,KAAK;QACL,OAAO,MAAM,YAAY;QACzB,WAAW,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK;;;;;;;;;;;;;;UAmBlB;2BAAC;kBAAe;QAAI,GAAG,MAAM,MAAM;kBAC7D,cAAA,gBAAC,0CAAY,QAAQ;YACnB,OAAO;+BACL;4BACA;oCACA;4BACA;4BACA;8BACA;sBACA;YACF;sBACC,MAAM,QAAQ;;;AAIvB;AAEA;;CAEC,GACD,IAAI,4CAAQ,WAAW,GAAG,CAAA,GAAA,iBAAS,EAAE","sources":["packages/@react-spectrum/s2/src/Form.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, forwardRef, ReactNode, useContext, useMemo} from 'react';\nimport {DOMRef, SpectrumLabelableProps} from '@react-types/shared';\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {Form as RACForm, FormProps as RACFormProps} from 'react-aria-components';\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useIsSkeleton} from './Skeleton';\n\ninterface FormStyleProps extends Omit<SpectrumLabelableProps, 'label' | 'contextualHelp'> {\n  /**\n   * Size of the Form elements.\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL',\n  /** Whether the Form elements are disabled. */\n  isDisabled?: boolean,\n  /** Whether the Form elements are rendered with their emphasized style. */\n  isEmphasized?: boolean\n}\n\nexport interface FormProps extends FormStyleProps, Omit<RACFormProps, 'className' | 'style' | 'children'>, StyleProps {\n  children?: ReactNode\n}\n\nexport const FormContext = createContext<FormStyleProps | null>(null);\nexport function useFormProps<T extends FormStyleProps>(props: T): T {\n  let ctx = useContext(FormContext);\n  let isSkeleton = useIsSkeleton();\n  return useMemo(() => {\n    let result: T = props;\n    if (ctx || isSkeleton) {\n      result = {...props};\n    }\n\n    if (ctx) {\n      // This is a subset of mergeProps. We just need to merge non-undefined values.\n      for (let key in ctx) {\n        if (result[key] === undefined) {\n          result[key] = ctx[key];\n        }\n      }\n    }\n\n    // Skeleton always wins over local props.\n    if (isSkeleton) {\n      result.isDisabled = true;\n    }\n\n    return result;\n  }, [ctx, props, isSkeleton]);\n}\n\nfunction Form(props: FormProps, ref: DOMRef<HTMLFormElement>) {\n  let {\n    labelPosition = 'top',\n    labelAlign,\n    necessityIndicator,\n    isRequired,\n    isDisabled,\n    isEmphasized,\n    size = 'M',\n    ...formProps\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACForm\n      {...formProps}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={(props.UNSAFE_className || '') + style({\n        display: 'grid',\n        gridTemplateColumns: {\n          labelPosition: {\n            top: ['[field] 1fr'],\n            side: ['[label] auto', '[field] 1fr']\n          }\n        },\n        // TODO: confirm when we have tokens\n        rowGap: {\n          size: {\n            XS: 16,\n            S: 20,\n            M: 24,\n            L: 32,\n            XL: 40\n          }\n        },\n        columnGap: 'text-to-control'\n      }, getAllowedOverrides())({labelPosition, size}, props.styles)}>\n      <FormContext.Provider\n        value={{\n          labelPosition,\n          labelAlign,\n          necessityIndicator,\n          isRequired,\n          isDisabled,\n          isEmphasized,\n          size\n        }}>\n        {props.children}\n      </FormContext.Provider>\n    </RACForm>\n  );\n}\n\n/**\n * Forms allow users to enter data that can be submitted while providing alignment and styling for form fields.\n */\nlet _Form = /*#__PURE__*/ forwardRef(Form);\nexport {_Form as Form};\n"],"names":[],"version":3,"file":"Form.mjs.map"}
+{"mappings":";;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AA0BM,MAAM,0DAAc,CAAA,GAAA,oBAAY,EAAkC;AAClE,SAAS,0CAAuC,KAAQ;IAC7D,IAAI,MAAM,CAAA,GAAA,iBAAS,EAAE;IACrB,IAAI,aAAa,CAAA,GAAA,yCAAY;IAC7B,OAAO,CAAA,GAAA,cAAM,EAAE;QACb,IAAI,SAAY;QAChB,IAAI,OAAO,YACT,SAAS;YAAC,GAAG,KAAK;QAAA;QAGpB,IAAI,KAAK;YACP,8EAA8E;YAC9E,IAAK,IAAI,OAAO,IACd,IAAI,MAAM,CAAC,IAAI,KAAK,WAClB,MAAM,CAAC,IAAI,GAAG,GAAG,CAAC,IAAI;QAG5B;QAEA,yCAAyC;QACzC,IAAI,YACF,OAAO,UAAU,GAAG;QAGtB,OAAO;IACT,GAAG;QAAC;QAAK;QAAO;KAAW;AAC7B;AAKO,MAAM,4CAAO,WAAW,GAAG,CAAA,GAAA,iBAAS,EAAE,SAAS,KAAK,KAAgB,EAAE,GAA4B;IACvG,IAAI,iBACF,gBAAgB,mBAChB,UAAU,sBACV,kBAAkB,cAClB,UAAU,cACV,UAAU,gBACV,YAAY,QACZ,OAAO,KACP,GAAG,WACJ,GAAG;IACJ,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IAEvB,qBACE,gBAAC,CAAA,GAAA,WAAM;QACJ,GAAG,SAAS;QACb,KAAK;QACL,OAAO,MAAM,YAAY;QACzB,WAAW,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK;;;;;;;;;;;;;;UAmBlB;2BAAC;kBAAe;QAAI,GAAG,MAAM,MAAM;kBAC7D,cAAA,gBAAC,0CAAY,QAAQ;YACnB,OAAO;+BACL;4BACA;oCACA;4BACA;4BACA;8BACA;sBACA;YACF;sBACC,MAAM,QAAQ;;;AAIvB","sources":["packages/@react-spectrum/s2/src/Form.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, forwardRef, ReactNode, useContext, useMemo} from 'react';\nimport {DOMRef, SpectrumLabelableProps} from '@react-types/shared';\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {Form as RACForm, FormProps as RACFormProps} from 'react-aria-components';\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useIsSkeleton} from './Skeleton';\n\ninterface FormStyleProps extends Omit<SpectrumLabelableProps, 'label' | 'contextualHelp'> {\n  /**\n   * Size of the Form elements.\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL',\n  /** Whether the Form elements are disabled. */\n  isDisabled?: boolean,\n  /** Whether the Form elements are rendered with their emphasized style. */\n  isEmphasized?: boolean\n}\n\nexport interface FormProps extends FormStyleProps, Omit<RACFormProps, 'className' | 'style' | 'children'>, StyleProps {\n  children: ReactNode\n}\n\nexport const FormContext = createContext<Partial<FormStyleProps | null>>(null);\nexport function useFormProps<T extends FormStyleProps>(props: T): T {\n  let ctx = useContext(FormContext);\n  let isSkeleton = useIsSkeleton();\n  return useMemo(() => {\n    let result: T = props;\n    if (ctx || isSkeleton) {\n      result = {...props};\n    }\n\n    if (ctx) {\n      // This is a subset of mergeProps. We just need to merge non-undefined values.\n      for (let key in ctx) {\n        if (result[key] === undefined) {\n          result[key] = ctx[key];\n        }\n      }\n    }\n\n    // Skeleton always wins over local props.\n    if (isSkeleton) {\n      result.isDisabled = true;\n    }\n\n    return result;\n  }, [ctx, props, isSkeleton]);\n}\n\n/**\n * Forms allow users to enter data that can be submitted while providing alignment and styling for form fields.\n */\nexport const Form = /*#__PURE__*/ forwardRef(function Form(props: FormProps, ref: DOMRef<HTMLFormElement>) {\n  let {\n    labelPosition = 'top',\n    labelAlign,\n    necessityIndicator,\n    isRequired,\n    isDisabled,\n    isEmphasized,\n    size = 'M',\n    ...formProps\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACForm\n      {...formProps}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={(props.UNSAFE_className || '') + style({\n        display: 'grid',\n        gridTemplateColumns: {\n          labelPosition: {\n            top: ['[field] 1fr'],\n            side: ['[label] auto', '[field] 1fr']\n          }\n        },\n        // TODO: confirm when we have tokens\n        rowGap: {\n          size: {\n            XS: 16,\n            S: 20,\n            M: 24,\n            L: 32,\n            XL: 40\n          }\n        },\n        columnGap: 'text-to-control'\n      }, getAllowedOverrides())({labelPosition, size}, props.styles)}>\n      <FormContext.Provider\n        value={{\n          labelPosition,\n          labelAlign,\n          necessityIndicator,\n          isRequired,\n          isDisabled,\n          isEmphasized,\n          size\n        }}>\n        {props.children}\n      </FormContext.Provider>\n    </RACForm>\n  );\n});\n"],"names":[],"version":3,"file":"Form.mjs.map"}

package/dist/FullscreenDialog.cjs

@@ -30,12 +30,12 @@ $parcel$export(module.exports, "FullscreenDialog", () => $59876d274d9473a9$expor
 
 
 
-const $59876d274d9473a9$var$heading = " . __a-go5hed __b-go5hed __c-go5hed __d-go5hed _9-3t1y Aa Ba _ca _c-enzrfpb _c-enzwzjc _c-enzykdd _c-enzzrge _c-eo0c6sf _c-1uotwbwg _c-bc1l9oh _dj _dbm _ee _e-1x99dloe _fa _f-1x99dlob ao";
-const $59876d274d9473a9$var$header = " . __a-i6pim __b-i6pim __c-i6pim __d-i6pim yc_d zc_d _ca _c-enzrfpb _c-enzwzjc _c-enzykdd _c-enzzrge _c-eo0c6sf _c-1uotwbwg _c-bc1l9oh _di _dbj _eb _fb _f-1x99dloc an";
-const $59876d274d9473a9$var$content = " . __a-1mod4sg __b-1mod4sg __c-1mod4sg __d-1mod4sg _9-3t1y __wa __w-l92dlrd _ca _c-enzrfpb _c-enzwzjc _c-enzykdd _c-enzzrge _c-eo0c6sf _c-1uotwbwg _c-bc1l9oh _dg _dbh _eb _fb _f-1x99dloc an";
-const $59876d274d9473a9$var$buttonGroup = " . __a-15bi2vo __b-15bi2vo __c-15bi2vo __d-15bi2vo y_d rb";
-const $59876d274d9473a9$export$6af31f836f9aa6f2 = " . _Zf __j-1fflgh0 __jc-1viqiso __h-375yi6 __hc-fdenls __i-36luh1 __ic-1wmzwss Eh Ecj Fh Fcj Ch Ccj Dh Dcj jf jch p-17zqamw kb __na _La _ca _c-enzrfpb _c-enzwzjc _c-enzykdd _c-enzzrge _c-eo0c6sf _c-1uotwbwg _c-bc1l9oh _v-17zqamw _w-17zqamw _x-17zqamw _y-17zqamw __va __wa";
-function $59876d274d9473a9$var$FullscreenDialog(props, ref) {
+const $59876d274d9473a9$var$heading = " __b-1c6tcyh __c-1c6tcyh __d-1c6tcyh __e-1c6tcyh __a-3t1y Aa Ba _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _ej _ebm _fe _f-1x99dloe _ga _g-1x99dlob ao";
+const $59876d274d9473a9$var$header = " __b-5rjl76 __c-5rjl76 __d-5rjl76 __e-5rjl76 yc_d zc_d _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _ei _ebj _fb _gb _g-1x99dloc an";
+const $59876d274d9473a9$var$content = " __b-drkpd0 __c-drkpd0 __d-drkpd0 __e-drkpd0 __a-3t1y __xa __x-l92dlrd _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _eg _ebh _fb _gb _g-1x99dloc an";
+const $59876d274d9473a9$var$buttonGroup = " __b-980e48 __c-980e48 __d-980e48 __e-980e48 y_d rb";
+const $59876d274d9473a9$export$6af31f836f9aa6f2 = " _0f __k-1akynrw __kc-1ebha6s __i-2wzs0i __ic-1a6w430 __j-1fstnmd __jc-1xtwrbo Eh Ecj Fh Fcj Ch Ccj Dh Dcj jf jch p-17zqamw kb __oa _Ma _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _w-17zqamw _x-17zqamw _y-17zqamw _z-17zqamw __wa __xa";
+const $59876d274d9473a9$export$7082b7e805d2626f = /*#__PURE__*/ (0, $Yi1VH$react.forwardRef)(function FullscreenDialog(props, ref) {
     let { variant: variant = 'fullscreen', isKeyboardDismissDisabled: isKeyboardDismissDisabled } = props;
     let domRef = (0, $Yi1VH$reactspectrumutils.useDOMRef)(ref);
     return /*#__PURE__*/ (0, $Yi1VH$reactjsxruntime.jsx)((0, $8e678305a8c10028$exports.Modal), {
@@ -81,10 +81,7 @@ function $59876d274d9473a9$var$FullscreenDialog(props, ref) {
                 }))
         })
     });
-}
-/**
- * Takeover dialogs are large types of dialogs. They use the totality of the screen and should be used for modal experiences with complex workflows.
- */ let $59876d274d9473a9$export$7082b7e805d2626f = /*#__PURE__*/ (0, $Yi1VH$react.forwardRef)($59876d274d9473a9$var$FullscreenDialog);
+});
 
 
 //# sourceMappingURL=FullscreenDialog.cjs.map

package/dist/FullscreenDialog.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AAuBD,MAAM;AAON,MAAM;AAQN,MAAM;AAWN,MAAM;AAMC,MAAM;AAsDb,SAAS,uCAAiB,KAA4B,EAAE,GAAW;IACjE,IAAI,WAAC,UAAU,yCAAc,yBAAyB,EAAC,GAAG;IAC1D,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IAEvB,qBACE,gCAAC,CAAA,GAAA,+BAAI;QAAE,MAAM;QAAS,2BAA2B;kBAC/C,cAAA,gCAAC,CAAA,GAAA,iCAAQ;YACN,GAAG,KAAK;YACT,KAAK;YACL,OAAO,MAAM,YAAY;YACzB,WAAW,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK;sBAC3C,CAAA,GAAA,6CAAiB,EAAE,MAAM,QAAQ,EAAE,CAAC,WACnC,oGAAoG;8BACpG,gCAAC,CAAA,GAAA,qDAAyB,EAAE,QAAQ;oBAAC,OAAO;8BAC1C,cAAA,gCAAC,CAAA,GAAA,mCAAO;wBACN,QAAQ;4BACN;gCAAC,CAAA,GAAA,wCAAa;gCAAG;oCAAC,QAAQ;gCAAO;6BAAE;4BACnC;gCAAC,CAAA,GAAA,uCAAY;gCAAG;oCAAC,QAAQ;gCAAM;6BAAE;4BACjC;gCAAC,CAAA,GAAA,wCAAa;gCAAG;oCAAC,QAAQ;gCAAO;6BAAE;4BACnC;gCAAC,CAAA,GAAA,4CAAiB;gCAAG;oCAAC,QAAQ;gCAAW;6BAAE;yBAC5C;kCACA;;;;;AAOf;AAEA;;CAEC,GACD,IAAI,0DAAoB,CAAA,GAAA,uBAAS,EAAE","sources":["packages/@react-spectrum/s2/src/FullscreenDialog.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 {ButtonGroupContext} from './ButtonGroup';\nimport {composeRenderProps, OverlayTriggerStateContext, Provider, Dialog as RACDialog, DialogProps as RACDialogProps} from 'react-aria-components';\nimport {ContentContext, HeaderContext, HeadingContext} from './Content';\nimport {DOMRef} from '@react-types/shared';\nimport {forwardRef} from 'react';\nimport {Modal} from './Modal';\nimport {style} from '../style' with {type: 'macro'};\nimport {StyleProps} from './style-utils';\nimport {useDOMRef} from '@react-spectrum/utils';\n\n// TODO: what style overrides should be allowed?\nexport interface FullscreenDialogProps extends Omit<RACDialogProps, 'className' | 'style'>, StyleProps {\n  /**\n   * The variant of fullscreen dialog to display.\n   * @default \"fullscreen\"\n   */\n  variant?: 'fullscreen' | 'fullscreenTakeover',\n  /** Whether pressing the escape key to close the dialog should be disabled. */\n  isKeyboardDismissDisabled?: boolean\n}\n\nconst heading = style({\n  gridArea: 'heading',\n  flexGrow: 1,\n  marginY: 0,\n  font: 'heading'\n});\n\nconst header = style({\n  gridArea: 'header',\n  marginX: {\n    sm: 'auto'\n  },\n  font: 'body-lg'\n});\n\nconst content =  style({\n  gridArea: 'content',\n  flexGrow: 1,\n  overflowY: {\n    default: 'auto',\n    // Make the whole dialog scroll rather than only the content when the height it small.\n    '@media (height < 400)': 'visible'\n  },\n  font: 'body'\n});\n\nconst buttonGroup = style({\n  gridArea: 'buttons',\n  marginStart: 'auto',\n  maxWidth: 'full'\n});\n\nexport const dialogInner = style({\n  display: 'grid',\n  gridTemplateAreas: {\n    // Button group moves to the bottom on small screens.\n    default: [\n      'heading',\n      'header',\n      '.',\n      'content',\n      '.',\n      'buttons'\n    ],\n    sm: [\n      'heading header buttons',\n      '. . .',\n      'content content content'\n    ]\n  },\n  gridTemplateColumns: {\n    default: ['1fr'],\n    sm: ['auto', '1fr', 'auto']\n  },\n  gridTemplateRows: {\n    default: [\n      'auto',\n      'auto',\n      24,\n      '1fr',\n      24,\n      'auto'\n    ],\n    sm: [\n      'auto',\n      32,\n      '1fr'\n    ]\n  },\n  padding: {\n    default: 24,\n    sm: 32\n  },\n  columnGap: {\n    default: 16,\n    sm: 24\n  },\n  maxHeight: '[inherit]',\n  height: 'full',\n  boxSizing: 'border-box',\n  outlineStyle: 'none',\n  fontFamily: 'sans',\n  borderRadius: '[inherit]',\n  overflow: 'auto'\n});\n\nfunction FullscreenDialog(props: FullscreenDialogProps, ref: DOMRef) {\n  let {variant = 'fullscreen', isKeyboardDismissDisabled} = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <Modal size={variant} isKeyboardDismissDisabled={isKeyboardDismissDisabled}>\n      <RACDialog\n        {...props}\n        ref={domRef}\n        style={props.UNSAFE_style}\n        className={(props.UNSAFE_className || '') + dialogInner}>\n        {composeRenderProps(props.children, (children) => (\n          // Reset OverlayTriggerStateContext so the buttons inside the dialog don't retain their hover state.\n          <OverlayTriggerStateContext.Provider value={null}>\n            <Provider\n              values={[\n                [HeadingContext, {styles: heading}],\n                [HeaderContext, {styles: header}],\n                [ContentContext, {styles: content}],\n                [ButtonGroupContext, {styles: buttonGroup}]\n              ]}>\n              {children}\n            </Provider>\n          </OverlayTriggerStateContext.Provider>\n        ))}\n      </RACDialog>\n    </Modal>\n  );\n}\n\n/**\n * Takeover dialogs are large types of dialogs. They use the totality of the screen and should be used for modal experiences with complex workflows.\n */\nlet _FullscreenDialog = forwardRef(FullscreenDialog);\nexport {_FullscreenDialog as FullscreenDialog};\n\n"],"names":[],"version":3,"file":"FullscreenDialog.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AAuBD,MAAM;AAON,MAAM;AAQN,MAAM;AAWN,MAAM;AAMC,MAAM;AAyDN,MAAM,0DAAmB,CAAA,GAAA,uBAAS,EAAE,SAAS,iBAAiB,KAA4B,EAAE,GAAW;IAC5G,IAAI,WAAC,UAAU,yCAAc,yBAAyB,EAAC,GAAG;IAC1D,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IAEvB,qBACE,gCAAC,CAAA,GAAA,+BAAI;QAAE,MAAM;QAAS,2BAA2B;kBAC/C,cAAA,gCAAC,CAAA,GAAA,iCAAQ;YACN,GAAG,KAAK;YACT,KAAK;YACL,OAAO,MAAM,YAAY;YACzB,WAAW,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK;sBAC3C,CAAA,GAAA,6CAAiB,EAAE,MAAM,QAAQ,EAAE,CAAC,WACnC,oGAAoG;8BACpG,gCAAC,CAAA,GAAA,qDAAyB,EAAE,QAAQ;oBAAC,OAAO;8BAC1C,cAAA,gCAAC,CAAA,GAAA,mCAAO;wBACN,QAAQ;4BACN;gCAAC,CAAA,GAAA,wCAAa;gCAAG;oCAAC,QAAQ;gCAAO;6BAAE;4BACnC;gCAAC,CAAA,GAAA,uCAAY;gCAAG;oCAAC,QAAQ;gCAAM;6BAAE;4BACjC;gCAAC,CAAA,GAAA,wCAAa;gCAAG;oCAAC,QAAQ;gCAAO;6BAAE;4BACnC;gCAAC,CAAA,GAAA,4CAAiB;gCAAG;oCAAC,QAAQ;gCAAW;6BAAE;yBAC5C;kCACA;;;;;AAOf","sources":["packages/@react-spectrum/s2/src/FullscreenDialog.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 {ButtonGroupContext} from './ButtonGroup';\nimport {composeRenderProps, OverlayTriggerStateContext, Provider, Dialog as RACDialog, DialogProps as RACDialogProps} from 'react-aria-components';\nimport {ContentContext, HeaderContext, HeadingContext} from './Content';\nimport {DOMRef} from '@react-types/shared';\nimport {forwardRef} from 'react';\nimport {Modal} from './Modal';\nimport {style} from '../style' with {type: 'macro'};\nimport {StyleProps} from './style-utils';\nimport {useDOMRef} from '@react-spectrum/utils';\n\n// TODO: what style overrides should be allowed?\nexport interface FullscreenDialogProps extends Omit<RACDialogProps, 'className' | 'style'>, StyleProps {\n  /**\n   * The variant of fullscreen dialog to display.\n   * @default \"fullscreen\"\n   */\n  variant?: 'fullscreen' | 'fullscreenTakeover',\n  /** Whether pressing the escape key to close the dialog should be disabled. */\n  isKeyboardDismissDisabled?: boolean\n}\n\nconst heading = style({\n  gridArea: 'heading',\n  flexGrow: 1,\n  marginY: 0,\n  font: 'heading'\n});\n\nconst header = style({\n  gridArea: 'header',\n  marginX: {\n    sm: 'auto'\n  },\n  font: 'body-lg'\n});\n\nconst content =  style({\n  gridArea: 'content',\n  flexGrow: 1,\n  overflowY: {\n    default: 'auto',\n    // Make the whole dialog scroll rather than only the content when the height it small.\n    '@media (height < 400)': 'visible'\n  },\n  font: 'body'\n});\n\nconst buttonGroup = style({\n  gridArea: 'buttons',\n  marginStart: 'auto',\n  maxWidth: 'full'\n});\n\nexport const dialogInner = style({\n  display: 'grid',\n  gridTemplateAreas: {\n    // Button group moves to the bottom on small screens.\n    default: [\n      'heading',\n      'header',\n      '.',\n      'content',\n      '.',\n      'buttons'\n    ],\n    sm: [\n      'heading header buttons',\n      '. . .',\n      'content content content'\n    ]\n  },\n  gridTemplateColumns: {\n    default: ['1fr'],\n    sm: ['auto', '1fr', 'auto']\n  },\n  gridTemplateRows: {\n    default: [\n      'auto',\n      'auto',\n      24,\n      '1fr',\n      24,\n      'auto'\n    ],\n    sm: [\n      'auto',\n      32,\n      '1fr'\n    ]\n  },\n  padding: {\n    default: 24,\n    sm: 32\n  },\n  columnGap: {\n    default: 16,\n    sm: 24\n  },\n  maxHeight: '[inherit]',\n  height: 'full',\n  boxSizing: 'border-box',\n  outlineStyle: 'none',\n  fontFamily: 'sans',\n  borderRadius: '[inherit]',\n  overflow: 'auto'\n});\n\n/**\n * Takeover dialogs are large types of dialogs. They use the totality of the screen and should be used for modal experiences with complex workflows.\n */\nexport const FullscreenDialog = forwardRef(function FullscreenDialog(props: FullscreenDialogProps, ref: DOMRef) {\n  let {variant = 'fullscreen', isKeyboardDismissDisabled} = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <Modal size={variant} isKeyboardDismissDisabled={isKeyboardDismissDisabled}>\n      <RACDialog\n        {...props}\n        ref={domRef}\n        style={props.UNSAFE_style}\n        className={(props.UNSAFE_className || '') + dialogInner}>\n        {composeRenderProps(props.children, (children) => (\n          // Reset OverlayTriggerStateContext so the buttons inside the dialog don't retain their hover state.\n          <OverlayTriggerStateContext.Provider value={null}>\n            <Provider\n              values={[\n                [HeadingContext, {styles: heading}],\n                [HeaderContext, {styles: header}],\n                [ContentContext, {styles: content}],\n                [ButtonGroupContext, {styles: buttonGroup}]\n              ]}>\n              {children}\n            </Provider>\n          </OverlayTriggerStateContext.Provider>\n        ))}\n      </RACDialog>\n    </Modal>\n  );\n});\n\n"],"names":[],"version":3,"file":"FullscreenDialog.cjs.map"}

package/dist/FullscreenDialog.css

@@ -1,17 +1,17 @@
 @layer _.a {
-  .__a-go5hed {
+  .__b-1c6tcyh {
     grid-column-start: heading;
   }
 
-  .__b-go5hed {
+  .__c-1c6tcyh {
     grid-column-end: heading;
   }
 
-  .__c-go5hed {
+  .__d-1c6tcyh {
     grid-row-start: heading;
   }
 
-  .__d-go5hed {
+  .__e-1c6tcyh {
     grid-row-end: heading;
   }
 
@@ -23,17 +23,17 @@
     margin-bottom: 0;
   }
 
-  ._dj {
+  ._ej {
     font-size: 1.375rem;
   }
 
-  ._ee {
+  ._fe {
     font-variation-settings: "wght" 800;
     font-synthesis-weight: none;
     font-weight: 800;
   }
 
-  ._fa {
+  ._ga {
     line-height: 1.3;
   }
 
@@ -41,57 +41,57 @@
     color: var(--lightningcss-light, #131313) var(--lightningcss-dark, #f2f2f2);
   }
 
-  .__a-i6pim {
+  .__b-5rjl76 {
     grid-column-start: header;
   }
 
-  .__b-i6pim {
+  .__c-5rjl76 {
     grid-column-end: header;
   }
 
-  .__c-i6pim {
+  .__d-5rjl76 {
     grid-row-start: header;
   }
 
-  .__d-i6pim {
+  .__e-5rjl76 {
     grid-row-end: header;
   }
 
-  ._di {
+  ._ei {
     font-size: 1.125rem;
   }
 
-  .__a-1mod4sg {
+  .__b-drkpd0 {
     grid-column-start: content;
   }
 
-  .__b-1mod4sg {
+  .__c-drkpd0 {
     grid-column-end: content;
   }
 
-  .__c-1mod4sg {
+  .__d-drkpd0 {
     grid-row-start: content;
   }
 
-  .__d-1mod4sg {
+  .__e-drkpd0 {
     grid-row-end: content;
   }
 
-  ._9-3t1y {
+  .__a-3t1y {
     flex-grow: 1;
   }
 
-  ._dg {
+  ._eg {
     font-size: 1rem;
   }
 
-  ._eb {
+  ._fb {
     font-variation-settings: "wght" 400;
     font-synthesis-weight: none;
     font-weight: 400;
   }
 
-  ._fb {
+  ._gb {
     line-height: 1.5;
   }
 
@@ -99,19 +99,19 @@
     color: var(--lightningcss-light, #292929) var(--lightningcss-dark, #dbdbdb);
   }
 
-  .__a-15bi2vo {
+  .__b-980e48 {
     grid-column-start: buttons;
   }
 
-  .__b-15bi2vo {
+  .__c-980e48 {
     grid-column-end: buttons;
   }
 
-  .__c-15bi2vo {
+  .__d-980e48 {
     grid-row-start: buttons;
   }
 
-  .__d-15bi2vo {
+  .__e-980e48 {
     grid-row-end: buttons;
   }
 
@@ -123,11 +123,11 @@
     max-width: 100%;
   }
 
-  ._Zf {
+  ._0f {
     display: grid;
   }
 
-  .__j-1fflgh0 {
+  .__k-1akynrw {
     grid-template-areas: "heading"
                          "header"
                          "."
@@ -136,11 +136,11 @@
                          "buttons";
   }
 
-  .__h-375yi6 {
+  .__i-2wzs0i {
     grid-template-columns: 1fr;
   }
 
-  .__i-36luh1 {
+  .__j-1fstnmd {
     grid-template-rows: auto auto 1.5rem 1fr 1.5rem auto;
   }
 
@@ -172,112 +172,110 @@
     height: 100%;
   }
 
-  .__na {
+  .__oa {
     box-sizing: border-box;
   }
 
-  ._La {
+  ._Ma {
     outline-style: none;
   }
 
-  ._ca {
+  ._da {
     font-family: adobe-clean-variable, adobe-clean, ui-sans-serif, system-ui, sans-serif;
   }
 
-  ._v-17zqamw {
+  ._w-17zqamw {
     border-start-start-radius: inherit;
   }
 
-  ._w-17zqamw {
+  ._x-17zqamw {
     border-start-end-radius: inherit;
   }
 
-  ._x-17zqamw {
+  ._y-17zqamw {
     border-end-start-radius: inherit;
   }
 
-  ._y-17zqamw {
+  ._z-17zqamw {
     border-end-end-radius: inherit;
   }
 
-  .__va {
+  .__wa {
     overflow-x: auto;
   }
 
-  .__wa {
+  .__xa {
     overflow-y: auto;
   }
 }
 
 @layer _.b {
-  ._e-1x99dloe:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
+  ._f-1x99dloe:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
     font-variation-settings: "wght" 800;
     font-synthesis-weight: none;
     font-weight: 800;
   }
 
-  ._f-1x99dlob:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
+  ._g-1x99dlob:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
     line-height: 1.5;
   }
 
-  ._f-1x99dloc:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
+  ._g-1x99dloc:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
     line-height: 1.7;
   }
 
-  ._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;
-
 @layer _.b.b {
   @media not ((hover: hover) and (pointer: fine)) {
-    ._dbm {
+    ._ebm {
       font-size: 1.6875rem;
     }
 
-    ._dbj {
+    ._ebj {
       font-size: 1.375rem;
     }
 
-    ._dbh {
+    ._ebh {
       font-size: 1.1875rem;
     }
   }
@@ -293,17 +291,17 @@
       margin-inline-end: auto;
     }
 
-    .__jc-1viqiso {
+    .__kc-1ebha6s {
       grid-template-areas: "heading header buttons"
                            ". . ."
                            "content content content";
     }
 
-    .__hc-fdenls {
+    .__ic-1a6w430 {
       grid-template-columns: auto 1fr auto;
     }
 
-    .__ic-1wmzwss {
+    .__jc-1xtwrbo {
       grid-template-rows: auto 2rem 1fr;
     }
 
@@ -331,13 +329,9 @@
 
 @layer _.b.-l92dlr {
   @media (height < 400px) {
-    .__w-l92dlrd {
+    .__x-l92dlrd {
       overflow-y: visible;
     }
   }
 }
-
-.\.:not(#a#b) {
-  all: revert-layer;
-}
 /*# sourceMappingURL=FullscreenDialog.css.map */

package/dist/FullscreenDialog.css.map

@@ -1 +1 @@
-{"mappings":"ACiCgB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAOD;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAQE;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAWG;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAMO;;;;EAAA;;;;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAhCX;EAAA;;;;;;EAAA;;;;EAeC;;;;EAiBU;;;;;AAhCX;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;;AAAA;EAAA;IAAA;;;;IAOD;;;;IAQE;;;;;;AARF;EAAA;IAAA;;;;IAAA;;;;IAyBY;;;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAjBV;EAAA;IAAA;;;;;;AAWG","sources":["08b4ee4dfdd3fb23","packages/@react-spectrum/s2/src/FullscreenDialog.tsx"],"sourcesContent":["@import \"eeaa872c96a96271\";\n@import \"73747769865790da\";\n@import \"b069e4051c7a440c\";\n@import \"38e814a136cf19ae\";\n@import \"1bc91e670be29799\";\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 {ButtonGroupContext} from './ButtonGroup';\nimport {composeRenderProps, OverlayTriggerStateContext, Provider, Dialog as RACDialog, DialogProps as RACDialogProps} from 'react-aria-components';\nimport {ContentContext, HeaderContext, HeadingContext} from './Content';\nimport {DOMRef} from '@react-types/shared';\nimport {forwardRef} from 'react';\nimport {Modal} from './Modal';\nimport {style} from '../style' with {type: 'macro'};\nimport {StyleProps} from './style-utils';\nimport {useDOMRef} from '@react-spectrum/utils';\n\n// TODO: what style overrides should be allowed?\nexport interface FullscreenDialogProps extends Omit<RACDialogProps, 'className' | 'style'>, StyleProps {\n  /**\n   * The variant of fullscreen dialog to display.\n   * @default \"fullscreen\"\n   */\n  variant?: 'fullscreen' | 'fullscreenTakeover',\n  /** Whether pressing the escape key to close the dialog should be disabled. */\n  isKeyboardDismissDisabled?: boolean\n}\n\nconst heading = style({\n  gridArea: 'heading',\n  flexGrow: 1,\n  marginY: 0,\n  font: 'heading'\n});\n\nconst header = style({\n  gridArea: 'header',\n  marginX: {\n    sm: 'auto'\n  },\n  font: 'body-lg'\n});\n\nconst content =  style({\n  gridArea: 'content',\n  flexGrow: 1,\n  overflowY: {\n    default: 'auto',\n    // Make the whole dialog scroll rather than only the content when the height it small.\n    '@media (height < 400)': 'visible'\n  },\n  font: 'body'\n});\n\nconst buttonGroup = style({\n  gridArea: 'buttons',\n  marginStart: 'auto',\n  maxWidth: 'full'\n});\n\nexport const dialogInner = style({\n  display: 'grid',\n  gridTemplateAreas: {\n    // Button group moves to the bottom on small screens.\n    default: [\n      'heading',\n      'header',\n      '.',\n      'content',\n      '.',\n      'buttons'\n    ],\n    sm: [\n      'heading header buttons',\n      '. . .',\n      'content content content'\n    ]\n  },\n  gridTemplateColumns: {\n    default: ['1fr'],\n    sm: ['auto', '1fr', 'auto']\n  },\n  gridTemplateRows: {\n    default: [\n      'auto',\n      'auto',\n      24,\n      '1fr',\n      24,\n      'auto'\n    ],\n    sm: [\n      'auto',\n      32,\n      '1fr'\n    ]\n  },\n  padding: {\n    default: 24,\n    sm: 32\n  },\n  columnGap: {\n    default: 16,\n    sm: 24\n  },\n  maxHeight: '[inherit]',\n  height: 'full',\n  boxSizing: 'border-box',\n  outlineStyle: 'none',\n  fontFamily: 'sans',\n  borderRadius: '[inherit]',\n  overflow: 'auto'\n});\n\nfunction FullscreenDialog(props: FullscreenDialogProps, ref: DOMRef) {\n  let {variant = 'fullscreen', isKeyboardDismissDisabled} = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <Modal size={variant} isKeyboardDismissDisabled={isKeyboardDismissDisabled}>\n      <RACDialog\n        {...props}\n        ref={domRef}\n        style={props.UNSAFE_style}\n        className={(props.UNSAFE_className || '') + dialogInner}>\n        {composeRenderProps(props.children, (children) => (\n          // Reset OverlayTriggerStateContext so the buttons inside the dialog don't retain their hover state.\n          <OverlayTriggerStateContext.Provider value={null}>\n            <Provider\n              values={[\n                [HeadingContext, {styles: heading}],\n                [HeaderContext, {styles: header}],\n                [ContentContext, {styles: content}],\n                [ButtonGroupContext, {styles: buttonGroup}]\n              ]}>\n              {children}\n            </Provider>\n          </OverlayTriggerStateContext.Provider>\n        ))}\n      </RACDialog>\n    </Modal>\n  );\n}\n\n/**\n * Takeover dialogs are large types of dialogs. They use the totality of the screen and should be used for modal experiences with complex workflows.\n */\nlet _FullscreenDialog = forwardRef(FullscreenDialog);\nexport {_FullscreenDialog as FullscreenDialog};\n\n"],"names":[],"version":3,"file":"FullscreenDialog.css.map"}
+{"mappings":"ACiCgB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAOD;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAQE;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAWG;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAMO;;;;EAAA;;;;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAhCX;EAAA;;;;;;EAAA;;;;EAeC;;;;EAiBU;;;;;AAhCX;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;IAAA;;;;IAOD;;;;IAQE;;;;;;AARF;EAAA;IAAA;;;;IAAA;;;;IAyBY;;;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAjBV;EAAA;IAAA","sources":["08b4ee4dfdd3fb23","packages/@react-spectrum/s2/src/FullscreenDialog.tsx"],"sourcesContent":["@import \"eeaa872c96a96271\";\n@import \"73747769865790da\";\n@import \"b069e4051c7a440c\";\n@import \"38e814a136cf19ae\";\n@import \"1bc91e670be29799\";\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 {ButtonGroupContext} from './ButtonGroup';\nimport {composeRenderProps, OverlayTriggerStateContext, Provider, Dialog as RACDialog, DialogProps as RACDialogProps} from 'react-aria-components';\nimport {ContentContext, HeaderContext, HeadingContext} from './Content';\nimport {DOMRef} from '@react-types/shared';\nimport {forwardRef} from 'react';\nimport {Modal} from './Modal';\nimport {style} from '../style' with {type: 'macro'};\nimport {StyleProps} from './style-utils';\nimport {useDOMRef} from '@react-spectrum/utils';\n\n// TODO: what style overrides should be allowed?\nexport interface FullscreenDialogProps extends Omit<RACDialogProps, 'className' | 'style'>, StyleProps {\n  /**\n   * The variant of fullscreen dialog to display.\n   * @default \"fullscreen\"\n   */\n  variant?: 'fullscreen' | 'fullscreenTakeover',\n  /** Whether pressing the escape key to close the dialog should be disabled. */\n  isKeyboardDismissDisabled?: boolean\n}\n\nconst heading = style({\n  gridArea: 'heading',\n  flexGrow: 1,\n  marginY: 0,\n  font: 'heading'\n});\n\nconst header = style({\n  gridArea: 'header',\n  marginX: {\n    sm: 'auto'\n  },\n  font: 'body-lg'\n});\n\nconst content =  style({\n  gridArea: 'content',\n  flexGrow: 1,\n  overflowY: {\n    default: 'auto',\n    // Make the whole dialog scroll rather than only the content when the height it small.\n    '@media (height < 400)': 'visible'\n  },\n  font: 'body'\n});\n\nconst buttonGroup = style({\n  gridArea: 'buttons',\n  marginStart: 'auto',\n  maxWidth: 'full'\n});\n\nexport const dialogInner = style({\n  display: 'grid',\n  gridTemplateAreas: {\n    // Button group moves to the bottom on small screens.\n    default: [\n      'heading',\n      'header',\n      '.',\n      'content',\n      '.',\n      'buttons'\n    ],\n    sm: [\n      'heading header buttons',\n      '. . .',\n      'content content content'\n    ]\n  },\n  gridTemplateColumns: {\n    default: ['1fr'],\n    sm: ['auto', '1fr', 'auto']\n  },\n  gridTemplateRows: {\n    default: [\n      'auto',\n      'auto',\n      24,\n      '1fr',\n      24,\n      'auto'\n    ],\n    sm: [\n      'auto',\n      32,\n      '1fr'\n    ]\n  },\n  padding: {\n    default: 24,\n    sm: 32\n  },\n  columnGap: {\n    default: 16,\n    sm: 24\n  },\n  maxHeight: '[inherit]',\n  height: 'full',\n  boxSizing: 'border-box',\n  outlineStyle: 'none',\n  fontFamily: 'sans',\n  borderRadius: '[inherit]',\n  overflow: 'auto'\n});\n\n/**\n * Takeover dialogs are large types of dialogs. They use the totality of the screen and should be used for modal experiences with complex workflows.\n */\nexport const FullscreenDialog = forwardRef(function FullscreenDialog(props: FullscreenDialogProps, ref: DOMRef) {\n  let {variant = 'fullscreen', isKeyboardDismissDisabled} = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <Modal size={variant} isKeyboardDismissDisabled={isKeyboardDismissDisabled}>\n      <RACDialog\n        {...props}\n        ref={domRef}\n        style={props.UNSAFE_style}\n        className={(props.UNSAFE_className || '') + dialogInner}>\n        {composeRenderProps(props.children, (children) => (\n          // Reset OverlayTriggerStateContext so the buttons inside the dialog don't retain their hover state.\n          <OverlayTriggerStateContext.Provider value={null}>\n            <Provider\n              values={[\n                [HeadingContext, {styles: heading}],\n                [HeaderContext, {styles: header}],\n                [ContentContext, {styles: content}],\n                [ButtonGroupContext, {styles: buttonGroup}]\n              ]}>\n              {children}\n            </Provider>\n          </OverlayTriggerStateContext.Provider>\n        ))}\n      </RACDialog>\n    </Modal>\n  );\n});\n\n"],"names":[],"version":3,"file":"FullscreenDialog.css.map"}

package/dist/FullscreenDialog.mjs

@@ -24,12 +24,12 @@ import {useDOMRef as $900FG$useDOMRef} from "@react-spectrum/utils";
 
 
 
-const $8e7a38ff5b9798e1$var$heading = " . __a-go5hed __b-go5hed __c-go5hed __d-go5hed _9-3t1y Aa Ba _ca _c-enzrfpb _c-enzwzjc _c-enzykdd _c-enzzrge _c-eo0c6sf _c-1uotwbwg _c-bc1l9oh _dj _dbm _ee _e-1x99dloe _fa _f-1x99dlob ao";
-const $8e7a38ff5b9798e1$var$header = " . __a-i6pim __b-i6pim __c-i6pim __d-i6pim yc_d zc_d _ca _c-enzrfpb _c-enzwzjc _c-enzykdd _c-enzzrge _c-eo0c6sf _c-1uotwbwg _c-bc1l9oh _di _dbj _eb _fb _f-1x99dloc an";
-const $8e7a38ff5b9798e1$var$content = " . __a-1mod4sg __b-1mod4sg __c-1mod4sg __d-1mod4sg _9-3t1y __wa __w-l92dlrd _ca _c-enzrfpb _c-enzwzjc _c-enzykdd _c-enzzrge _c-eo0c6sf _c-1uotwbwg _c-bc1l9oh _dg _dbh _eb _fb _f-1x99dloc an";
-const $8e7a38ff5b9798e1$var$buttonGroup = " . __a-15bi2vo __b-15bi2vo __c-15bi2vo __d-15bi2vo y_d rb";
-const $8e7a38ff5b9798e1$export$6af31f836f9aa6f2 = " . _Zf __j-1fflgh0 __jc-1viqiso __h-375yi6 __hc-fdenls __i-36luh1 __ic-1wmzwss Eh Ecj Fh Fcj Ch Ccj Dh Dcj jf jch p-17zqamw kb __na _La _ca _c-enzrfpb _c-enzwzjc _c-enzykdd _c-enzzrge _c-eo0c6sf _c-1uotwbwg _c-bc1l9oh _v-17zqamw _w-17zqamw _x-17zqamw _y-17zqamw __va __wa";
-function $8e7a38ff5b9798e1$var$FullscreenDialog(props, ref) {
+const $8e7a38ff5b9798e1$var$heading = " __b-1c6tcyh __c-1c6tcyh __d-1c6tcyh __e-1c6tcyh __a-3t1y Aa Ba _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _ej _ebm _fe _f-1x99dloe _ga _g-1x99dlob ao";
+const $8e7a38ff5b9798e1$var$header = " __b-5rjl76 __c-5rjl76 __d-5rjl76 __e-5rjl76 yc_d zc_d _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _ei _ebj _fb _gb _g-1x99dloc an";
+const $8e7a38ff5b9798e1$var$content = " __b-drkpd0 __c-drkpd0 __d-drkpd0 __e-drkpd0 __a-3t1y __xa __x-l92dlrd _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _eg _ebh _fb _gb _g-1x99dloc an";
+const $8e7a38ff5b9798e1$var$buttonGroup = " __b-980e48 __c-980e48 __d-980e48 __e-980e48 y_d rb";
+const $8e7a38ff5b9798e1$export$6af31f836f9aa6f2 = " _0f __k-1akynrw __kc-1ebha6s __i-2wzs0i __ic-1a6w430 __j-1fstnmd __jc-1xtwrbo Eh Ecj Fh Fcj Ch Ccj Dh Dcj jf jch p-17zqamw kb __oa _Ma _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _w-17zqamw _x-17zqamw _y-17zqamw _z-17zqamw __wa __xa";
+const $8e7a38ff5b9798e1$export$7082b7e805d2626f = /*#__PURE__*/ (0, $900FG$forwardRef)(function FullscreenDialog(props, ref) {
     let { variant: variant = 'fullscreen', isKeyboardDismissDisabled: isKeyboardDismissDisabled } = props;
     let domRef = (0, $900FG$useDOMRef)(ref);
     return /*#__PURE__*/ (0, $900FG$jsx)((0, $c46d159bd615e407$export$2b77a92f1a5ad772), {
@@ -75,10 +75,7 @@ function $8e7a38ff5b9798e1$var$FullscreenDialog(props, ref) {
                 }))
         })
     });
-}
-/**
- * Takeover dialogs are large types of dialogs. They use the totality of the screen and should be used for modal experiences with complex workflows.
- */ let $8e7a38ff5b9798e1$export$7082b7e805d2626f = /*#__PURE__*/ (0, $900FG$forwardRef)($8e7a38ff5b9798e1$var$FullscreenDialog);
+});
 
 
 export {$8e7a38ff5b9798e1$export$6af31f836f9aa6f2 as dialogInner, $8e7a38ff5b9798e1$export$7082b7e805d2626f as FullscreenDialog};

package/dist/FullscreenDialog.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AAuBD,MAAM;AAON,MAAM;AAQN,MAAM;AAWN,MAAM;AAMC,MAAM;AAsDb,SAAS,uCAAiB,KAA4B,EAAE,GAAW;IACjE,IAAI,WAAC,UAAU,yCAAc,yBAAyB,EAAC,GAAG;IAC1D,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IAEvB,qBACE,gBAAC,CAAA,GAAA,yCAAI;QAAE,MAAM;QAAS,2BAA2B;kBAC/C,cAAA,gBAAC,CAAA,GAAA,aAAQ;YACN,GAAG,KAAK;YACT,KAAK;YACL,OAAO,MAAM,YAAY;YACzB,WAAW,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK;sBAC3C,CAAA,GAAA,yBAAiB,EAAE,MAAM,QAAQ,EAAE,CAAC,WACnC,oGAAoG;8BACpG,gBAAC,CAAA,GAAA,iCAAyB,EAAE,QAAQ;oBAAC,OAAO;8BAC1C,cAAA,gBAAC,CAAA,GAAA,eAAO;wBACN,QAAQ;4BACN;gCAAC,CAAA,GAAA,yCAAa;gCAAG;oCAAC,QAAQ;gCAAO;6BAAE;4BACnC;gCAAC,CAAA,GAAA,yCAAY;gCAAG;oCAAC,QAAQ;gCAAM;6BAAE;4BACjC;gCAAC,CAAA,GAAA,yCAAa;gCAAG;oCAAC,QAAQ;gCAAO;6BAAE;4BACnC;gCAAC,CAAA,GAAA,yCAAiB;gCAAG;oCAAC,QAAQ;gCAAW;6BAAE;yBAC5C;kCACA;;;;;AAOf;AAEA;;CAEC,GACD,IAAI,0DAAoB,CAAA,GAAA,iBAAS,EAAE","sources":["packages/@react-spectrum/s2/src/FullscreenDialog.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 {ButtonGroupContext} from './ButtonGroup';\nimport {composeRenderProps, OverlayTriggerStateContext, Provider, Dialog as RACDialog, DialogProps as RACDialogProps} from 'react-aria-components';\nimport {ContentContext, HeaderContext, HeadingContext} from './Content';\nimport {DOMRef} from '@react-types/shared';\nimport {forwardRef} from 'react';\nimport {Modal} from './Modal';\nimport {style} from '../style' with {type: 'macro'};\nimport {StyleProps} from './style-utils';\nimport {useDOMRef} from '@react-spectrum/utils';\n\n// TODO: what style overrides should be allowed?\nexport interface FullscreenDialogProps extends Omit<RACDialogProps, 'className' | 'style'>, StyleProps {\n  /**\n   * The variant of fullscreen dialog to display.\n   * @default \"fullscreen\"\n   */\n  variant?: 'fullscreen' | 'fullscreenTakeover',\n  /** Whether pressing the escape key to close the dialog should be disabled. */\n  isKeyboardDismissDisabled?: boolean\n}\n\nconst heading = style({\n  gridArea: 'heading',\n  flexGrow: 1,\n  marginY: 0,\n  font: 'heading'\n});\n\nconst header = style({\n  gridArea: 'header',\n  marginX: {\n    sm: 'auto'\n  },\n  font: 'body-lg'\n});\n\nconst content =  style({\n  gridArea: 'content',\n  flexGrow: 1,\n  overflowY: {\n    default: 'auto',\n    // Make the whole dialog scroll rather than only the content when the height it small.\n    '@media (height < 400)': 'visible'\n  },\n  font: 'body'\n});\n\nconst buttonGroup = style({\n  gridArea: 'buttons',\n  marginStart: 'auto',\n  maxWidth: 'full'\n});\n\nexport const dialogInner = style({\n  display: 'grid',\n  gridTemplateAreas: {\n    // Button group moves to the bottom on small screens.\n    default: [\n      'heading',\n      'header',\n      '.',\n      'content',\n      '.',\n      'buttons'\n    ],\n    sm: [\n      'heading header buttons',\n      '. . .',\n      'content content content'\n    ]\n  },\n  gridTemplateColumns: {\n    default: ['1fr'],\n    sm: ['auto', '1fr', 'auto']\n  },\n  gridTemplateRows: {\n    default: [\n      'auto',\n      'auto',\n      24,\n      '1fr',\n      24,\n      'auto'\n    ],\n    sm: [\n      'auto',\n      32,\n      '1fr'\n    ]\n  },\n  padding: {\n    default: 24,\n    sm: 32\n  },\n  columnGap: {\n    default: 16,\n    sm: 24\n  },\n  maxHeight: '[inherit]',\n  height: 'full',\n  boxSizing: 'border-box',\n  outlineStyle: 'none',\n  fontFamily: 'sans',\n  borderRadius: '[inherit]',\n  overflow: 'auto'\n});\n\nfunction FullscreenDialog(props: FullscreenDialogProps, ref: DOMRef) {\n  let {variant = 'fullscreen', isKeyboardDismissDisabled} = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <Modal size={variant} isKeyboardDismissDisabled={isKeyboardDismissDisabled}>\n      <RACDialog\n        {...props}\n        ref={domRef}\n        style={props.UNSAFE_style}\n        className={(props.UNSAFE_className || '') + dialogInner}>\n        {composeRenderProps(props.children, (children) => (\n          // Reset OverlayTriggerStateContext so the buttons inside the dialog don't retain their hover state.\n          <OverlayTriggerStateContext.Provider value={null}>\n            <Provider\n              values={[\n                [HeadingContext, {styles: heading}],\n                [HeaderContext, {styles: header}],\n                [ContentContext, {styles: content}],\n                [ButtonGroupContext, {styles: buttonGroup}]\n              ]}>\n              {children}\n            </Provider>\n          </OverlayTriggerStateContext.Provider>\n        ))}\n      </RACDialog>\n    </Modal>\n  );\n}\n\n/**\n * Takeover dialogs are large types of dialogs. They use the totality of the screen and should be used for modal experiences with complex workflows.\n */\nlet _FullscreenDialog = forwardRef(FullscreenDialog);\nexport {_FullscreenDialog as FullscreenDialog};\n\n"],"names":[],"version":3,"file":"FullscreenDialog.mjs.map"}
+{"mappings":";;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AAuBD,MAAM;AAON,MAAM;AAQN,MAAM;AAWN,MAAM;AAMC,MAAM;AAyDN,MAAM,0DAAmB,CAAA,GAAA,iBAAS,EAAE,SAAS,iBAAiB,KAA4B,EAAE,GAAW;IAC5G,IAAI,WAAC,UAAU,yCAAc,yBAAyB,EAAC,GAAG;IAC1D,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IAEvB,qBACE,gBAAC,CAAA,GAAA,yCAAI;QAAE,MAAM;QAAS,2BAA2B;kBAC/C,cAAA,gBAAC,CAAA,GAAA,aAAQ;YACN,GAAG,KAAK;YACT,KAAK;YACL,OAAO,MAAM,YAAY;YACzB,WAAW,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK;sBAC3C,CAAA,GAAA,yBAAiB,EAAE,MAAM,QAAQ,EAAE,CAAC,WACnC,oGAAoG;8BACpG,gBAAC,CAAA,GAAA,iCAAyB,EAAE,QAAQ;oBAAC,OAAO;8BAC1C,cAAA,gBAAC,CAAA,GAAA,eAAO;wBACN,QAAQ;4BACN;gCAAC,CAAA,GAAA,yCAAa;gCAAG;oCAAC,QAAQ;gCAAO;6BAAE;4BACnC;gCAAC,CAAA,GAAA,yCAAY;gCAAG;oCAAC,QAAQ;gCAAM;6BAAE;4BACjC;gCAAC,CAAA,GAAA,yCAAa;gCAAG;oCAAC,QAAQ;gCAAO;6BAAE;4BACnC;gCAAC,CAAA,GAAA,yCAAiB;gCAAG;oCAAC,QAAQ;gCAAW;6BAAE;yBAC5C;kCACA;;;;;AAOf","sources":["packages/@react-spectrum/s2/src/FullscreenDialog.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 {ButtonGroupContext} from './ButtonGroup';\nimport {composeRenderProps, OverlayTriggerStateContext, Provider, Dialog as RACDialog, DialogProps as RACDialogProps} from 'react-aria-components';\nimport {ContentContext, HeaderContext, HeadingContext} from './Content';\nimport {DOMRef} from '@react-types/shared';\nimport {forwardRef} from 'react';\nimport {Modal} from './Modal';\nimport {style} from '../style' with {type: 'macro'};\nimport {StyleProps} from './style-utils';\nimport {useDOMRef} from '@react-spectrum/utils';\n\n// TODO: what style overrides should be allowed?\nexport interface FullscreenDialogProps extends Omit<RACDialogProps, 'className' | 'style'>, StyleProps {\n  /**\n   * The variant of fullscreen dialog to display.\n   * @default \"fullscreen\"\n   */\n  variant?: 'fullscreen' | 'fullscreenTakeover',\n  /** Whether pressing the escape key to close the dialog should be disabled. */\n  isKeyboardDismissDisabled?: boolean\n}\n\nconst heading = style({\n  gridArea: 'heading',\n  flexGrow: 1,\n  marginY: 0,\n  font: 'heading'\n});\n\nconst header = style({\n  gridArea: 'header',\n  marginX: {\n    sm: 'auto'\n  },\n  font: 'body-lg'\n});\n\nconst content =  style({\n  gridArea: 'content',\n  flexGrow: 1,\n  overflowY: {\n    default: 'auto',\n    // Make the whole dialog scroll rather than only the content when the height it small.\n    '@media (height < 400)': 'visible'\n  },\n  font: 'body'\n});\n\nconst buttonGroup = style({\n  gridArea: 'buttons',\n  marginStart: 'auto',\n  maxWidth: 'full'\n});\n\nexport const dialogInner = style({\n  display: 'grid',\n  gridTemplateAreas: {\n    // Button group moves to the bottom on small screens.\n    default: [\n      'heading',\n      'header',\n      '.',\n      'content',\n      '.',\n      'buttons'\n    ],\n    sm: [\n      'heading header buttons',\n      '. . .',\n      'content content content'\n    ]\n  },\n  gridTemplateColumns: {\n    default: ['1fr'],\n    sm: ['auto', '1fr', 'auto']\n  },\n  gridTemplateRows: {\n    default: [\n      'auto',\n      'auto',\n      24,\n      '1fr',\n      24,\n      'auto'\n    ],\n    sm: [\n      'auto',\n      32,\n      '1fr'\n    ]\n  },\n  padding: {\n    default: 24,\n    sm: 32\n  },\n  columnGap: {\n    default: 16,\n    sm: 24\n  },\n  maxHeight: '[inherit]',\n  height: 'full',\n  boxSizing: 'border-box',\n  outlineStyle: 'none',\n  fontFamily: 'sans',\n  borderRadius: '[inherit]',\n  overflow: 'auto'\n});\n\n/**\n * Takeover dialogs are large types of dialogs. They use the totality of the screen and should be used for modal experiences with complex workflows.\n */\nexport const FullscreenDialog = forwardRef(function FullscreenDialog(props: FullscreenDialogProps, ref: DOMRef) {\n  let {variant = 'fullscreen', isKeyboardDismissDisabled} = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <Modal size={variant} isKeyboardDismissDisabled={isKeyboardDismissDisabled}>\n      <RACDialog\n        {...props}\n        ref={domRef}\n        style={props.UNSAFE_style}\n        className={(props.UNSAFE_className || '') + dialogInner}>\n        {composeRenderProps(props.children, (children) => (\n          // Reset OverlayTriggerStateContext so the buttons inside the dialog don't retain their hover state.\n          <OverlayTriggerStateContext.Provider value={null}>\n            <Provider\n              values={[\n                [HeadingContext, {styles: heading}],\n                [HeaderContext, {styles: header}],\n                [ContentContext, {styles: content}],\n                [ButtonGroupContext, {styles: buttonGroup}]\n              ]}>\n              {children}\n            </Provider>\n          </OverlayTriggerStateContext.Provider>\n        ))}\n      </RACDialog>\n    </Modal>\n  );\n});\n\n"],"names":[],"version":3,"file":"FullscreenDialog.mjs.map"}