@react-spectrum/s2 1.3.1 → 1.5.0

package/dist/private/Dialog.css

@@ -1,292 +1,292 @@
 @layer _.a {
-  .Za13 {
+  .Za15 {
     width: 100%;
   }
 
-  .FC13 {
+  .FC15 {
     height: calc(8.75rem * var(--s2-scale));
   }
 
-  ._va13 {
+  ._va15 {
     flex-shrink: 0;
   }
 
-  ._Hb13 {
+  ._Hb15 {
     object-fit: cover;
   }
 
-  .Jy13 {
+  .Jy15 {
     margin-top: 0;
   }
 
-  .Gy13 {
+  .Gy15 {
     margin-bottom: 0;
   }
 
-  .-_6BNtrc-g13 {
+  .-_6BNtrc-g15 {
     --fs: pow(1.125, 4);
   }
 
-  .xd13 {
+  .xd15 {
     font-weight: 700;
   }
 
-  ._Fd13 {
+  ._Fd15 {
     line-height: round(1em * (1.15 + (1 - ((min(32, var(--s2-font-size-base, 14) * var(--fs)) - 10)) / 22) * .15), 2px);
   }
 
-  .po13 {
+  .po15 {
     color: light-dark(#131313, #f2f2f2);
   }
 
-  .-_6BNtrc-d13 {
+  .-_6BNtrc-d15 {
     --fs: pow(1.125, 1);
   }
 
-  .vx13 {
+  .vx15 {
     font-size: round(var(--s2-font-size-base, 14) * var(--fs) / 16 * 1rem, 1px);
   }
 
-  .xb13 {
+  .xb15 {
     font-weight: 400;
   }
 
-  ._xa13 {
+  ._xa15 {
     font-synthesis-weight: none;
   }
 
-  ._Fb13 {
+  ._Fb15 {
     line-height: 1.5;
   }
 
-  .pt13 {
+  .pt15 {
     color: light-dark(#292929, #dbdbdb);
   }
 
-  .IM13 {
+  .IM15 {
     margin-inline-start: auto;
   }
 
-  .La13 {
+  .La15 {
     max-width: 100%;
   }
 
-  .K40ub4c13 {
+  .K40ub4c15 {
     max-height: inherit;
   }
 
-  ._oa13 {
+  ._oa15 {
     box-sizing: border-box;
   }
 
-  ._Le13 {
+  ._Le15 {
     outline-style: none;
   }
 
-  .uk13 {
+  .uk15 {
     font-family: var(--s2-font-family-sans, adobe-clean-spectrum-vf), adobe-clean-variable, adobe-clean, ui-sans-serif, system-ui, sans-serif;
   }
 
-  .oi13 {
+  .oi15 {
     border-start-start-radius: inherit;
   }
 
-  .ni13 {
+  .ni15 {
     border-start-end-radius: inherit;
   }
 
-  .ki13 {
+  .ki15 {
     border-end-start-radius: inherit;
   }
 
-  .ji13 {
+  .ji15 {
     border-end-end-radius: inherit;
   }
 
-  ._Na13 {
+  ._Na15 {
     overflow-x: auto;
   }
 
-  .Pa13 {
+  .Pa15 {
     overflow-y: auto;
   }
 
-  .qg13 {
+  .qg15 {
     column-gap: .75rem;
   }
 
-  .Re13 {
+  .Re15 {
     padding-inline-end: 12px;
   }
 
-  .Te13 {
+  .Te15 {
     padding-top: 12px;
   }
 
-  ._ub13 {
+  ._ub15 {
     flex-grow: 1;
   }
 
-  .Jz13 {
+  .Jz15 {
     margin-top: 1.25rem;
   }
 
-  .GC13 {
+  .GC15 {
     margin-bottom: 1rem;
   }
 
-  .Ue13 {
+  .Ue15 {
     row-gap: .5rem;
   }
 
-  ._ta13 {
+  ._ta15 {
     flex-direction: column;
   }
 
-  .ed13 {
+  .ed15 {
     align-items: start;
   }
 
-  .Gx13 {
+  .Gx15 {
     margin-bottom: .75rem;
   }
 
-  .sd13 {
+  .sd15 {
     display: flex;
   }
 
-  .Sk13 {
+  .Sk15 {
     padding-inline-start: 32px;
   }
 
-  .Rk13 {
+  .Rk15 {
     padding-inline-end: 32px;
   }
 
-  .Qk13 {
+  .Qk15 {
     padding-bottom: 32px;
   }
 
-  .Tk13 {
+  .Tk15 {
     padding-top: 32px;
   }
 
-  .Uj13 {
+  .Uj15 {
     row-gap: 1.5rem;
   }
 
-  .qj13 {
+  .qj15 {
     column-gap: 1.5rem;
   }
 
-  .eb13 {
+  .eb15 {
     align-items: center;
   }
 
-  ._wb13 {
+  ._wb15 {
     flex-wrap: wrap;
   }
 }
 
 @layer _.b {
-  .xX0cczbc13:is(:lang(ja), :lang(ko), :lang(zh)) {
+  .xX0cczbc15:is(:lang(ja), :lang(ko), :lang(zh)) {
     font-weight: 500;
   }
 
-  ._xX0cczba13:is(:lang(ja), :lang(ko), :lang(zh)) {
+  ._xX0cczba15:is(:lang(ja), :lang(ko), :lang(zh)) {
     font-synthesis-weight: none;
   }
 
-  ._FnuYUweb13:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans), :lang(zh-CN), :lang(zh-SG)) {
+  ._FnuYUweb15:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans), :lang(zh-CN), :lang(zh-SG)) {
     line-height: 1.5;
   }
 
-  ._FnuYUwec13:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans), :lang(zh-CN), :lang(zh-SG)) {
+  ._FnuYUwec15:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans), :lang(zh-CN), :lang(zh-SG)) {
     line-height: 1.7;
   }
 
-  .ucJ9TBTb13:lang(ar) {
+  .ucJ9TBTb15:lang(ar) {
     font-family: adobe-clean-arabic, myriad-arabic, ui-sans-serif, system-ui, sans-serif;
   }
 
-  .Jay13:empty {
+  .Jay15:empty {
     margin-top: 0;
   }
 
-  .Gay13:empty {
+  .Gay15:empty {
     margin-bottom: 0;
   }
 
-  .Tad13:empty {
+  .Tad15:empty {
     padding-top: 0;
   }
 }
 
 @layer _.c {
-  .xfd13:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
+  .xfd15:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
     font-weight: 700;
   }
 
-  ._xfa13:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
+  ._xfa15:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
     font-synthesis-weight: none;
   }
 
-  .ud3Euai13:lang(he) {
+  .ud3Euai15:lang(he) {
     font-family: adobe-clean-hebrew, myriad-hebrew, ui-sans-serif, system-ui, sans-serif;
   }
 }
 
 @layer _.d {
-  .xfX0cczbc13:is(:lang(ja), :lang(ko), :lang(zh)):is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
+  .xfX0cczbc15:is(:lang(ja), :lang(ko), :lang(zh)):is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
     font-weight: 500;
   }
 
-  ._xfX0cczba13:is(:lang(ja), :lang(ko), :lang(zh)):is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
+  ._xfX0cczba15:is(:lang(ja), :lang(ko), :lang(zh)):is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
     font-synthesis-weight: none;
   }
 
-  .uea13:lang(ja) {
+  .uea15: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 {
-  .ugb13:lang(ko) {
+  .ugb15:lang(ko) {
     font-family: adobe-clean-han-korean, source-han-korean, Malgun Gothic, Apple Gothic, sans-serif;
   }
 }
 
 @layer _.f {
-  .uhd13:lang(zh) {
+  .uhd15:lang(zh) {
     font-family: adobe-clean-han-traditional, source-han-traditional, MingLiu, Heiti TC Light, sans-serif;
   }
 }
 
 @layer _.g {
-  .uje13:lang(zh-hant) {
+  .uje15: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 {
-  .u2NhKxcl13:lang(zh-HK) {
+  .u2NhKxcl15:lang(zh-HK) {
     font-family: adobe-clean-han-hong-kong, source-han-hong-kong, MingLiu, Microsoft JhengHei UI, Microsoft JhengHei, Heiti TC Light, sans-serif;
   }
 }
 
 @layer _.i {
-  .uic13:is(:lang(zh-Hans), :lang(zh-CN), :lang(zh-SG)) {
+  .uic15: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 _.b._7GYNyb {
   @container (height < 31.25rem) {
-    ._v7GYNyba13 {
+    ._v7GYNyba15 {
       flex-shrink: 0;
     }
 
-    .P7GYNybe13 {
+    .P7GYNybe15 {
       overflow-y: visible;
     }
   }
@@ -294,11 +294,11 @@
 
 @layer _.b.n {
   @media (width >= 40rem) {
-    ._tnc13 {
+    ._tnc15 {
       flex-direction: row;
     }
 
-    .enb13 {
+    .enb15 {
       align-items: center;
     }
   }

package/dist/private/Dialog.css.map

@@ -1 +1 @@
-{"mappings":"AC8Cc;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAOE;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA2BD;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAKK;;;;EAAA;;;;EAKO;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA8CF;;;;EAAA;;;;EAAA;;;;EAiBE;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAqCU;;;;EAiBZ;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AA1JT;EAAA;;;;EAAA;;;;EAAA;;;;EA2BD;;;;EAUY;;;;EA+DA;;;;EAAA;;;;EAsDF;;;;;AA1JT;EAAA;;;;EAAA;;;;EAMD;;;;;AANC;EAAA;;;;EAAA;;;;EAMD;;;;;AANC;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAUC;EAAA;IAAA;;;;IAAA;;;;;;AA0FU;EAAA;IAAA;;;;IAAA","sources":["ebf76300d207adbd","packages/@react-spectrum/s2/src/Dialog.tsx"],"sourcesContent":["@import \"41c4aa1296799ea1\";\n@import \"b6cb6ab59865bde8\";\n@import \"c2aa69bcd8dab7fb\";\n@import \"e9cdd4f3ada8c5d9\";\n@import \"722603297b70d86b\";\n@import \"d1b118504b390ed5\";\n@import \"a59d0f5a0e9cb2ac\";\n@import \"26ac236cb46f8555\";\n@import \"8b070308c4891c21\";\n@import \"5ec9bfe5eed7daff\";\n@import \"7eb24a82f7ffd3c6\";\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 {CloseButton} from './CloseButton';\nimport {composeRenderProps} from 'react-aria-components/composeRenderProps';\nimport {ContentContext, FooterContext, HeaderContext, HeadingContext} from './Content';\nimport {DOMRef, GlobalDOMAttributes} from '@react-types/shared';\nimport {forwardRef} from 'react';\nimport {ImageContext} from './Image';\nimport {Modal} from './Modal';\nimport {\n  OverlayTriggerStateContext,\n  Dialog as RACDialog,\n  DialogProps as RACDialogProps\n} from 'react-aria-components/Dialog';\nimport {Provider} from 'react-aria-components/slots';\nimport {style} from '../style' with {type: 'macro'};\nimport {StyleProps} from './style-utils';\nimport {useDOMRef} from './useDOMRef';\n\n// TODO: what style overrides should be allowed?\nexport interface DialogProps extends Omit<RACDialogProps, 'className' | 'style' | 'render' | keyof GlobalDOMAttributes>, StyleProps {\n  /**\n   * Whether the Dialog is dismissible.\n   */\n  isDismissible?: boolean,\n  /**\n   * The size of the Dialog.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL',\n  /** Whether pressing the escape key to close the dialog should be disabled. */\n  isKeyboardDismissDisabled?: boolean\n}\n\nconst image = style({\n  width: 'full',\n  height: 140,\n  flexShrink: 0,\n  objectFit: 'cover'\n});\n\nconst heading = style({\n  flexGrow: 1,\n  marginY: 0,\n  font: 'title-2xl'\n});\n\nconst header = style({\n  font: 'body'\n});\n\nconst content =  style({\n  flexGrow: 1,\n  flexShrink: {\n    [`@container (height < ${500 / 16}rem)`]: 0\n  },\n  overflowY: {\n    default: 'auto',\n    // Make the whole dialog scroll rather than only the content when the height is small.\n    [`@container (height < ${500 / 16}rem)`]: 'visible'\n  },\n  font: 'body',\n  // TODO: adjust margin on mobile?\n  paddingX: {\n    default: 32\n  }\n});\n\nconst footer = style({\n  flexGrow: 1,\n  font: 'body'\n});\n\nconst buttonGroup = style({\n  marginStart: 'auto',\n  maxWidth: 'full'\n});\n\nexport const dialogInner = style({\n  display: 'flex',\n  flexDirection: 'column',\n  flexGrow: 1,\n  maxHeight: 'inherit',\n  boxSizing: 'border-box',\n  outlineStyle: 'none',\n  fontFamily: 'sans',\n  borderRadius: 'inherit',\n  overflow: 'auto'\n});\n\n/**\n * Dialogs are windows containing contextual information, tasks, or workflows that appear over the user interface.\n * Depending on the kind of Dialog, further interactions may be blocked until the Dialog is acknowledged.\n */\nexport const Dialog = forwardRef(function Dialog(props: DialogProps, ref: DOMRef) {\n  let {size = 'M', isDismissible, isKeyboardDismissDisabled} = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    (<Modal size={size} isDismissable={isDismissible} 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          // Render the children multiple times inside the wrappers we need to implement the layout.\n          // Each instance hides certain children so that they are all rendered in the correct locations.\n          // Reset OverlayTriggerStateContext so the buttons inside the dialog don't retain their hover state.\n          (<OverlayTriggerStateContext.Provider value={null}>\n            {/* Hero image */}\n            <Provider\n              values={[\n                [ImageContext, {styles: image}],\n                [HeadingContext, {isHidden: true}],\n                [HeaderContext, {isHidden: true}],\n                [ContentContext, {isHidden: true}],\n                [FooterContext, {isHidden: true}],\n                [ButtonGroupContext, {isHidden: true}]\n              ]}>\n              {children}\n            </Provider>\n            {/* Top header: heading, header, dismiss button, and button group (in fullscreen dialogs). */}\n            <div\n              className={style({\n                // Wrapper that creates the margin for the dismiss button.\n                display: 'flex',\n                alignItems: 'start',\n                columnGap: 12,\n                paddingStart: {\n                  default: 32\n                },\n                paddingEnd: {\n                  default: 32,\n                  isDismissible: 12\n                },\n                paddingTop: {\n                  default: 12 // margin to dismiss button\n                }\n              })({isDismissible: props.isDismissible})}>\n              <div\n                className={style({\n                  // Wrapper for heading, header, and button group.\n                  // This swaps orientation from horizontal to vertical at small screen sizes.\n                  display: 'flex',\n                  flexGrow: 1,\n                  marginTop: {\n                    default: 20, // 32 - 12 (handled above)\n                    ':empty': 0\n                  },\n                  marginBottom: {\n                    default: 16,\n                    ':empty': 0\n                  },\n                  columnGap: 24,\n                  rowGap: 8,\n                  flexDirection: {\n                    default: 'column',\n                    sm: 'row'\n                  },\n                  alignItems: {\n                    default: 'start',\n                    sm: 'center'\n                  }\n                })}>\n                <Provider\n                  values={[\n                    [ImageContext, {hidden: true}],\n                    [HeadingContext, {styles: heading}],\n                    [HeaderContext, {styles: header}],\n                    [ContentContext, {isHidden: true}],\n                    [FooterContext, {isHidden: true}],\n                    [ButtonGroupContext, {isHidden: true}]\n                  ]}>\n                  {children}\n                </Provider>\n              </div>\n              {props.isDismissible &&\n                <CloseButton styles={style({marginBottom: 12})} />\n              }\n            </div>\n            {/* Main content */}\n            <Provider\n              values={[\n                [ImageContext, {hidden: true}],\n                [HeadingContext, {isHidden: true}],\n                [HeaderContext, {isHidden: true}],\n                [ContentContext, {styles: content}],\n                [FooterContext, {isHidden: true}],\n                [ButtonGroupContext, {isHidden: true}]\n              ]}>\n              {children}\n            </Provider>\n            {/* Footer and button group */}\n            <div\n              className={style({\n                display: 'flex',\n                paddingX: {\n                  default: 32\n                },\n                paddingBottom: {\n                  default: 32\n                },\n                paddingTop: {\n                  default: 32,\n                  ':empty': 0\n                },\n                gap: 24,\n                alignItems: 'center',\n                flexWrap: 'wrap'\n              })}>\n              <Provider\n                values={[\n                  [ImageContext, {hidden: true}],\n                  [HeadingContext, {isHidden: true}],\n                  [HeaderContext, {isHidden: true}],\n                  [ContentContext, {isHidden: true}],\n                  [FooterContext, {styles: footer}],\n                  [ButtonGroupContext, {isHidden: props.isDismissible, styles: buttonGroup, align: 'end'}]\n                ]}>\n                {children}\n              </Provider>\n            </div>\n          </OverlayTriggerStateContext.Provider>)\n        ))}\n      </RACDialog>\n    </Modal>)\n  );\n});\n"],"names":[],"version":3,"file":"Dialog.css.map"}
+{"mappings":"ACiDc;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAOE;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA2BD;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAKK;;;;EAAA;;;;EAKO;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAkDF;;;;EAAA;;;;EAAA;;;;EAiBE;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAoCgC;;;;EAgBlC;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AA5JT;EAAA;;;;EAAA;;;;EAAA;;;;EA2BD;;;;EAUY;;;;EAmEA;;;;EAAA;;;;EAoDF;;;;;AA5JT;EAAA;;;;EAAA;;;;EAMD;;;;;AANC;EAAA;;;;EAAA;;;;EAMD;;;;;AANC;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAUA;EAAA;IAAA;;;;IAAA;;;;;;AA8FW;EAAA;IAAA;;;;IAAA","sources":["ebf76300d207adbd","packages/@react-spectrum/s2/src/Dialog.tsx"],"sourcesContent":["@import \"41c4aa1296799ea1\";\n@import \"b6cb6ab59865bde8\";\n@import \"c2aa69bcd8dab7fb\";\n@import \"e9cdd4f3ada8c5d9\";\n@import \"722603297b70d86b\";\n@import \"d1b118504b390ed5\";\n@import \"a59d0f5a0e9cb2ac\";\n@import \"26ac236cb46f8555\";\n@import \"8b070308c4891c21\";\n@import \"5ec9bfe5eed7daff\";\n@import \"7eb24a82f7ffd3c6\";\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 {CloseButton} from './CloseButton';\nimport {composeRenderProps} from 'react-aria-components/composeRenderProps';\nimport {ContentContext, FooterContext, HeaderContext, HeadingContext} from './Content';\nimport {DOMRef, GlobalDOMAttributes} from '@react-types/shared';\nimport {forwardRef} from 'react';\nimport {ImageContext} from './Image';\nimport {Modal} from './Modal';\nimport {\n  OverlayTriggerStateContext,\n  Dialog as RACDialog,\n  DialogProps as RACDialogProps\n} from 'react-aria-components/Dialog';\nimport {Provider} from 'react-aria-components/slots';\nimport {style} from '../style' with {type: 'macro'};\nimport {StyleProps} from './style-utils';\nimport {useDOMRef} from './useDOMRef';\n\n// TODO: what style overrides should be allowed?\nexport interface DialogProps\n  extends\n    Omit<RACDialogProps, 'className' | 'style' | 'render' | keyof GlobalDOMAttributes>,\n    StyleProps {\n  /**\n   * Whether the Dialog is dismissible.\n   */\n  isDismissible?: boolean;\n  /**\n   * The size of the Dialog.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL';\n  /** Whether pressing the escape key to close the dialog should be disabled. */\n  isKeyboardDismissDisabled?: boolean;\n}\n\nconst image = style({\n  width: 'full',\n  height: 140,\n  flexShrink: 0,\n  objectFit: 'cover'\n});\n\nconst heading = style({\n  flexGrow: 1,\n  marginY: 0,\n  font: 'title-2xl'\n});\n\nconst header = style({\n  font: 'body'\n});\n\nconst content = style({\n  flexGrow: 1,\n  flexShrink: {\n    [`@container (height < ${500 / 16}rem)`]: 0\n  },\n  overflowY: {\n    default: 'auto',\n    // Make the whole dialog scroll rather than only the content when the height is small.\n    [`@container (height < ${500 / 16}rem)`]: 'visible'\n  },\n  font: 'body',\n  // TODO: adjust margin on mobile?\n  paddingX: {\n    default: 32\n  }\n});\n\nconst footer = style({\n  flexGrow: 1,\n  font: 'body'\n});\n\nconst buttonGroup = style({\n  marginStart: 'auto',\n  maxWidth: 'full'\n});\n\nexport const dialogInner = style({\n  display: 'flex',\n  flexDirection: 'column',\n  flexGrow: 1,\n  maxHeight: 'inherit',\n  boxSizing: 'border-box',\n  outlineStyle: 'none',\n  fontFamily: 'sans',\n  borderRadius: 'inherit',\n  overflow: 'auto'\n});\n\n/**\n * Dialogs are windows containing contextual information, tasks, or workflows that appear over the\n * user interface. Depending on the kind of Dialog, further interactions may be blocked until the\n * Dialog is acknowledged.\n */\nexport const Dialog = forwardRef(function Dialog(props: DialogProps, ref: DOMRef) {\n  let {size = 'M', isDismissible, isKeyboardDismissDisabled} = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <Modal\n      size={size}\n      isDismissable={isDismissible}\n      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          // Render the children multiple times inside the wrappers we need to implement the layout.\n          // Each instance hides certain children so that they are all rendered in the correct locations.\n          // Reset OverlayTriggerStateContext so the buttons inside the dialog don't retain their hover state.\n          <OverlayTriggerStateContext.Provider value={null}>\n            {/* Hero image */}\n            <Provider\n              values={[\n                [ImageContext, {styles: image}],\n                [HeadingContext, {isHidden: true}],\n                [HeaderContext, {isHidden: true}],\n                [ContentContext, {isHidden: true}],\n                [FooterContext, {isHidden: true}],\n                [ButtonGroupContext, {isHidden: true}]\n              ]}>\n              {children}\n            </Provider>\n            {/* Top header: heading, header, dismiss button, and button group (in fullscreen dialogs). */}\n            <div\n              className={style({\n                // Wrapper that creates the margin for the dismiss button.\n                display: 'flex',\n                alignItems: 'start',\n                columnGap: 12,\n                paddingStart: {\n                  default: 32\n                },\n                paddingEnd: {\n                  default: 32,\n                  isDismissible: 12\n                },\n                paddingTop: {\n                  default: 12 // margin to dismiss button\n                }\n              })({isDismissible: props.isDismissible})}>\n              <div\n                className={style({\n                  // Wrapper for heading, header, and button group.\n                  // This swaps orientation from horizontal to vertical at small screen sizes.\n                  display: 'flex',\n                  flexGrow: 1,\n                  marginTop: {\n                    default: 20, // 32 - 12 (handled above)\n                    ':empty': 0\n                  },\n                  marginBottom: {\n                    default: 16,\n                    ':empty': 0\n                  },\n                  columnGap: 24,\n                  rowGap: 8,\n                  flexDirection: {\n                    default: 'column',\n                    sm: 'row'\n                  },\n                  alignItems: {\n                    default: 'start',\n                    sm: 'center'\n                  }\n                })}>\n                <Provider\n                  values={[\n                    [ImageContext, {hidden: true}],\n                    [HeadingContext, {styles: heading}],\n                    [HeaderContext, {styles: header}],\n                    [ContentContext, {isHidden: true}],\n                    [FooterContext, {isHidden: true}],\n                    [ButtonGroupContext, {isHidden: true}]\n                  ]}>\n                  {children}\n                </Provider>\n              </div>\n              {props.isDismissible && <CloseButton styles={style({marginBottom: 12})} />}\n            </div>\n            {/* Main content */}\n            <Provider\n              values={[\n                [ImageContext, {hidden: true}],\n                [HeadingContext, {isHidden: true}],\n                [HeaderContext, {isHidden: true}],\n                [ContentContext, {styles: content}],\n                [FooterContext, {isHidden: true}],\n                [ButtonGroupContext, {isHidden: true}]\n              ]}>\n              {children}\n            </Provider>\n            {/* Footer and button group */}\n            <div\n              className={style({\n                display: 'flex',\n                paddingX: {\n                  default: 32\n                },\n                paddingBottom: {\n                  default: 32\n                },\n                paddingTop: {\n                  default: 32,\n                  ':empty': 0\n                },\n                gap: 24,\n                alignItems: 'center',\n                flexWrap: 'wrap'\n              })}>\n              <Provider\n                values={[\n                  [ImageContext, {hidden: true}],\n                  [HeadingContext, {isHidden: true}],\n                  [HeaderContext, {isHidden: true}],\n                  [ContentContext, {isHidden: true}],\n                  [FooterContext, {styles: footer}],\n                  [\n                    ButtonGroupContext,\n                    {isHidden: props.isDismissible, styles: buttonGroup, align: 'end'}\n                  ]\n                ]}>\n                {children}\n              </Provider>\n            </div>\n          </OverlayTriggerStateContext.Provider>\n        ))}\n      </RACDialog>\n    </Modal>\n  );\n});\n"],"names":[],"version":3,"file":"Dialog.css.map"}

package/dist/private/Dialog.mjs

@@ -32,13 +32,13 @@ import {Provider as $9Rtwv$Provider} from "react-aria-components/slots";
 
 
 
-const $9bbc115952dac5a6$var$image = " Za13 FC13 _va13 _Hb13";
-const $9bbc115952dac5a6$var$heading = " _ub13 Jy13 Gy13 uk13 ucJ9TBTb13 ud3Euai13 uea13 ugb13 uhd13 uje13 u2NhKxcl13 uic13 -_6BNtrc-g13 vx13 xd13 _xa13 xX0cczbc13 _xX0cczba13 xfd13 _xfa13 xfX0cczbc13 _xfX0cczba13 _Fd13 _FnuYUweb13 po13";
-const $9bbc115952dac5a6$var$header = " uk13 ucJ9TBTb13 ud3Euai13 uea13 ugb13 uhd13 uje13 u2NhKxcl13 uic13 -_6BNtrc-d13 vx13 xb13 _xa13 _Fb13 _FnuYUwec13 pt13";
-const $9bbc115952dac5a6$var$content = " _ub13 _v7GYNyba13 Pa13 P7GYNybe13 uk13 ucJ9TBTb13 ud3Euai13 uea13 ugb13 uhd13 uje13 u2NhKxcl13 uic13 -_6BNtrc-d13 vx13 xb13 _xa13 _Fb13 _FnuYUwec13 pt13 Sk13 Rk13";
-const $9bbc115952dac5a6$var$footer = " _ub13 uk13 ucJ9TBTb13 ud3Euai13 uea13 ugb13 uhd13 uje13 u2NhKxcl13 uic13 -_6BNtrc-d13 vx13 xb13 _xa13 _Fb13 _FnuYUwec13 pt13";
-const $9bbc115952dac5a6$var$buttonGroup = " IM13 La13";
-const $9bbc115952dac5a6$export$6af31f836f9aa6f2 = " sd13 _ta13 _ub13 K40ub4c13 _oa13 _Le13 uk13 ucJ9TBTb13 ud3Euai13 uea13 ugb13 uhd13 uje13 u2NhKxcl13 uic13 oi13 ni13 ki13 ji13 _Na13 Pa13";
+const $9bbc115952dac5a6$var$image = " Za15 FC15 _va15 _Hb15";
+const $9bbc115952dac5a6$var$heading = " _ub15 Jy15 Gy15 uk15 ucJ9TBTb15 ud3Euai15 uea15 ugb15 uhd15 uje15 u2NhKxcl15 uic15 -_6BNtrc-g15 vx15 xd15 _xa15 xX0cczbc15 _xX0cczba15 xfd15 _xfa15 xfX0cczbc15 _xfX0cczba15 _Fd15 _FnuYUweb15 po15";
+const $9bbc115952dac5a6$var$header = " uk15 ucJ9TBTb15 ud3Euai15 uea15 ugb15 uhd15 uje15 u2NhKxcl15 uic15 -_6BNtrc-d15 vx15 xb15 _xa15 _Fb15 _FnuYUwec15 pt15";
+const $9bbc115952dac5a6$var$content = " _ub15 _v7GYNyba15 Pa15 P7GYNybe15 uk15 ucJ9TBTb15 ud3Euai15 uea15 ugb15 uhd15 uje15 u2NhKxcl15 uic15 -_6BNtrc-d15 vx15 xb15 _xa15 _Fb15 _FnuYUwec15 pt15 Sk15 Rk15";
+const $9bbc115952dac5a6$var$footer = " _ub15 uk15 ucJ9TBTb15 ud3Euai15 uea15 ugb15 uhd15 uje15 u2NhKxcl15 uic15 -_6BNtrc-d15 vx15 xb15 _xa15 _Fb15 _FnuYUwec15 pt15";
+const $9bbc115952dac5a6$var$buttonGroup = " IM15 La15";
+const $9bbc115952dac5a6$export$6af31f836f9aa6f2 = " sd15 _ta15 _ub15 K40ub4c15 _oa15 _Le15 uk15 ucJ9TBTb15 ud3Euai15 uea15 ugb15 uhd15 uje15 u2NhKxcl15 uic15 oi15 ni15 ki15 ji15 _Na15 Pa15";
 const $9bbc115952dac5a6$export$3ddf2d174ce01153 = /*#__PURE__*/ (0, $9Rtwv$forwardRef)(function Dialog(props, ref) {
     let { size: size = 'M', isDismissible: isDismissible, isKeyboardDismissDisabled: isKeyboardDismissDisabled } = props;
     let domRef = (0, $80ecb974df713a30$export$c2c55ef9111cafd8)(ref);
@@ -51,7 +51,10 @@ const $9bbc115952dac5a6$export$3ddf2d174ce01153 = /*#__PURE__*/ (0, $9Rtwv$forwa
             ref: domRef,
             style: props.UNSAFE_style,
             className: (props.UNSAFE_className || '') + $9bbc115952dac5a6$export$6af31f836f9aa6f2,
-            children: (0, $9Rtwv$composeRenderProps)(props.children, (children)=>/*#__PURE__*/ (0, $9Rtwv$jsxs)((0, $9Rtwv$OverlayTriggerStateContext).Provider, {
+            children: (0, $9Rtwv$composeRenderProps)(props.children, (children)=>// Render the children multiple times inside the wrappers we need to implement the layout.
+                // Each instance hides certain children so that they are all rendered in the correct locations.
+                // Reset OverlayTriggerStateContext so the buttons inside the dialog don't retain their hover state.
+                /*#__PURE__*/ (0, $9Rtwv$jsxs)((0, $9Rtwv$OverlayTriggerStateContext).Provider, {
                     value: null,
                     children: [
                         /*#__PURE__*/ (0, $9Rtwv$jsx)((0, $9Rtwv$Provider), {
@@ -98,20 +101,20 @@ const $9bbc115952dac5a6$export$3ddf2d174ce01153 = /*#__PURE__*/ (0, $9Rtwv$forwa
                         /*#__PURE__*/ (0, $9Rtwv$jsxs)("div", {
                             className: function anonymous(props) {
                                 let rules = " ";
-                                rules += ' sd13';
-                                rules += ' ed13';
-                                rules += ' qg13';
-                                rules += ' Sk13';
-                                if (props.isDismissible) rules += ' Re13';
-                                else rules += ' Rk13';
-                                rules += ' Te13';
+                                rules += ' sd15';
+                                rules += ' ed15';
+                                rules += ' qg15';
+                                rules += ' Sk15';
+                                if (props.isDismissible) rules += ' Re15';
+                                else rules += ' Rk15';
+                                rules += ' Te15';
                                 return rules;
                             }({
                                 isDismissible: props.isDismissible
                             }),
                             children: [
                                 /*#__PURE__*/ (0, $9Rtwv$jsx)("div", {
-                                    className: " sd13 _ub13 Jz13 Jay13 GC13 Gay13 qj13 Ue13 _ta13 _tnc13 ed13 enb13",
+                                    className: " sd15 _ub15 Jz15 Jay15 GC15 Gay15 qj15 Ue15 _ta15 _tnc15 ed15 enb15",
                                     children: /*#__PURE__*/ (0, $9Rtwv$jsx)((0, $9Rtwv$Provider), {
                                         values: [
                                             [
@@ -155,7 +158,7 @@ const $9bbc115952dac5a6$export$3ddf2d174ce01153 = /*#__PURE__*/ (0, $9Rtwv$forwa
                                     })
                                 }),
                                 props.isDismissible && /*#__PURE__*/ (0, $9Rtwv$jsx)((0, $a9cda54c4f47ce52$export$de65de8213222d10), {
-                                    styles: " Gx13"
+                                    styles: " Gx15"
                                 })
                             ]
                         }),
@@ -201,7 +204,7 @@ const $9bbc115952dac5a6$export$3ddf2d174ce01153 = /*#__PURE__*/ (0, $9Rtwv$forwa
                             children: children
                         }),
                         /*#__PURE__*/ (0, $9Rtwv$jsx)("div", {
-                            className: " sd13 Sk13 Rk13 Qk13 Tk13 Tad13 Uj13 qj13 eb13 _wb13",
+                            className: " sd15 Sk15 Rk15 Qk15 Tk15 Tad15 Uj15 qj15 eb15 _wb15",
                             children: /*#__PURE__*/ (0, $9Rtwv$jsx)((0, $9Rtwv$Provider), {
                                 values: [
                                     [

package/dist/private/Dialog.mjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Dialog.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 {CloseButton} from './CloseButton';\nimport {composeRenderProps} from 'react-aria-components/composeRenderProps';\nimport {ContentContext, FooterContext, HeaderContext, HeadingContext} from './Content';\nimport {DOMRef, GlobalDOMAttributes} from '@react-types/shared';\nimport {forwardRef} from 'react';\nimport {ImageContext} from './Image';\nimport {Modal} from './Modal';\nimport {\n  OverlayTriggerStateContext,\n  Dialog as RACDialog,\n  DialogProps as RACDialogProps\n} from 'react-aria-components/Dialog';\nimport {Provider} from 'react-aria-components/slots';\nimport {style} from '../style' with {type: 'macro'};\nimport {StyleProps} from './style-utils';\nimport {useDOMRef} from './useDOMRef';\n\n// TODO: what style overrides should be allowed?\nexport interface DialogProps extends Omit<RACDialogProps, 'className' | 'style' | 'render' | keyof GlobalDOMAttributes>, StyleProps {\n  /**\n   * Whether the Dialog is dismissible.\n   */\n  isDismissible?: boolean,\n  /**\n   * The size of the Dialog.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL',\n  /** Whether pressing the escape key to close the dialog should be disabled. */\n  isKeyboardDismissDisabled?: boolean\n}\n\nconst image = style({\n  width: 'full',\n  height: 140,\n  flexShrink: 0,\n  objectFit: 'cover'\n});\n\nconst heading = style({\n  flexGrow: 1,\n  marginY: 0,\n  font: 'title-2xl'\n});\n\nconst header = style({\n  font: 'body'\n});\n\nconst content =  style({\n  flexGrow: 1,\n  flexShrink: {\n    [`@container (height < ${500 / 16}rem)`]: 0\n  },\n  overflowY: {\n    default: 'auto',\n    // Make the whole dialog scroll rather than only the content when the height is small.\n    [`@container (height < ${500 / 16}rem)`]: 'visible'\n  },\n  font: 'body',\n  // TODO: adjust margin on mobile?\n  paddingX: {\n    default: 32\n  }\n});\n\nconst footer = style({\n  flexGrow: 1,\n  font: 'body'\n});\n\nconst buttonGroup = style({\n  marginStart: 'auto',\n  maxWidth: 'full'\n});\n\nexport const dialogInner = style({\n  display: 'flex',\n  flexDirection: 'column',\n  flexGrow: 1,\n  maxHeight: 'inherit',\n  boxSizing: 'border-box',\n  outlineStyle: 'none',\n  fontFamily: 'sans',\n  borderRadius: 'inherit',\n  overflow: 'auto'\n});\n\n/**\n * Dialogs are windows containing contextual information, tasks, or workflows that appear over the user interface.\n * Depending on the kind of Dialog, further interactions may be blocked until the Dialog is acknowledged.\n */\nexport const Dialog = forwardRef(function Dialog(props: DialogProps, ref: DOMRef) {\n  let {size = 'M', isDismissible, isKeyboardDismissDisabled} = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    (<Modal size={size} isDismissable={isDismissible} 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          // Render the children multiple times inside the wrappers we need to implement the layout.\n          // Each instance hides certain children so that they are all rendered in the correct locations.\n          // Reset OverlayTriggerStateContext so the buttons inside the dialog don't retain their hover state.\n          (<OverlayTriggerStateContext.Provider value={null}>\n            {/* Hero image */}\n            <Provider\n              values={[\n                [ImageContext, {styles: image}],\n                [HeadingContext, {isHidden: true}],\n                [HeaderContext, {isHidden: true}],\n                [ContentContext, {isHidden: true}],\n                [FooterContext, {isHidden: true}],\n                [ButtonGroupContext, {isHidden: true}]\n              ]}>\n              {children}\n            </Provider>\n            {/* Top header: heading, header, dismiss button, and button group (in fullscreen dialogs). */}\n            <div\n              className={style({\n                // Wrapper that creates the margin for the dismiss button.\n                display: 'flex',\n                alignItems: 'start',\n                columnGap: 12,\n                paddingStart: {\n                  default: 32\n                },\n                paddingEnd: {\n                  default: 32,\n                  isDismissible: 12\n                },\n                paddingTop: {\n                  default: 12 // margin to dismiss button\n                }\n              })({isDismissible: props.isDismissible})}>\n              <div\n                className={style({\n                  // Wrapper for heading, header, and button group.\n                  // This swaps orientation from horizontal to vertical at small screen sizes.\n                  display: 'flex',\n                  flexGrow: 1,\n                  marginTop: {\n                    default: 20, // 32 - 12 (handled above)\n                    ':empty': 0\n                  },\n                  marginBottom: {\n                    default: 16,\n                    ':empty': 0\n                  },\n                  columnGap: 24,\n                  rowGap: 8,\n                  flexDirection: {\n                    default: 'column',\n                    sm: 'row'\n                  },\n                  alignItems: {\n                    default: 'start',\n                    sm: 'center'\n                  }\n                })}>\n                <Provider\n                  values={[\n                    [ImageContext, {hidden: true}],\n                    [HeadingContext, {styles: heading}],\n                    [HeaderContext, {styles: header}],\n                    [ContentContext, {isHidden: true}],\n                    [FooterContext, {isHidden: true}],\n                    [ButtonGroupContext, {isHidden: true}]\n                  ]}>\n                  {children}\n                </Provider>\n              </div>\n              {props.isDismissible &&\n                <CloseButton styles={style({marginBottom: 12})} />\n              }\n            </div>\n            {/* Main content */}\n            <Provider\n              values={[\n                [ImageContext, {hidden: true}],\n                [HeadingContext, {isHidden: true}],\n                [HeaderContext, {isHidden: true}],\n                [ContentContext, {styles: content}],\n                [FooterContext, {isHidden: true}],\n                [ButtonGroupContext, {isHidden: true}]\n              ]}>\n              {children}\n            </Provider>\n            {/* Footer and button group */}\n            <div\n              className={style({\n                display: 'flex',\n                paddingX: {\n                  default: 32\n                },\n                paddingBottom: {\n                  default: 32\n                },\n                paddingTop: {\n                  default: 32,\n                  ':empty': 0\n                },\n                gap: 24,\n                alignItems: 'center',\n                flexWrap: 'wrap'\n              })}>\n              <Provider\n                values={[\n                  [ImageContext, {hidden: true}],\n                  [HeadingContext, {isHidden: true}],\n                  [HeaderContext, {isHidden: true}],\n                  [ContentContext, {isHidden: true}],\n                  [FooterContext, {styles: footer}],\n                  [ButtonGroupContext, {isHidden: props.isDismissible, styles: buttonGroup, align: 'end'}]\n                ]}>\n                {children}\n              </Provider>\n            </div>\n          </OverlayTriggerStateContext.Provider>)\n        ))}\n      </RACDialog>\n    </Modal>)\n  );\n});\n"],"names":[],"version":3,"file":"Dialog.mjs.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Dialog.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 {CloseButton} from './CloseButton';\nimport {composeRenderProps} from 'react-aria-components/composeRenderProps';\nimport {ContentContext, FooterContext, HeaderContext, HeadingContext} from './Content';\nimport {DOMRef, GlobalDOMAttributes} from '@react-types/shared';\nimport {forwardRef} from 'react';\nimport {ImageContext} from './Image';\nimport {Modal} from './Modal';\nimport {\n  OverlayTriggerStateContext,\n  Dialog as RACDialog,\n  DialogProps as RACDialogProps\n} from 'react-aria-components/Dialog';\nimport {Provider} from 'react-aria-components/slots';\nimport {style} from '../style' with {type: 'macro'};\nimport {StyleProps} from './style-utils';\nimport {useDOMRef} from './useDOMRef';\n\n// TODO: what style overrides should be allowed?\nexport interface DialogProps\n  extends\n    Omit<RACDialogProps, 'className' | 'style' | 'render' | keyof GlobalDOMAttributes>,\n    StyleProps {\n  /**\n   * Whether the Dialog is dismissible.\n   */\n  isDismissible?: boolean;\n  /**\n   * The size of the Dialog.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL';\n  /** Whether pressing the escape key to close the dialog should be disabled. */\n  isKeyboardDismissDisabled?: boolean;\n}\n\nconst image = style({\n  width: 'full',\n  height: 140,\n  flexShrink: 0,\n  objectFit: 'cover'\n});\n\nconst heading = style({\n  flexGrow: 1,\n  marginY: 0,\n  font: 'title-2xl'\n});\n\nconst header = style({\n  font: 'body'\n});\n\nconst content = style({\n  flexGrow: 1,\n  flexShrink: {\n    [`@container (height < ${500 / 16}rem)`]: 0\n  },\n  overflowY: {\n    default: 'auto',\n    // Make the whole dialog scroll rather than only the content when the height is small.\n    [`@container (height < ${500 / 16}rem)`]: 'visible'\n  },\n  font: 'body',\n  // TODO: adjust margin on mobile?\n  paddingX: {\n    default: 32\n  }\n});\n\nconst footer = style({\n  flexGrow: 1,\n  font: 'body'\n});\n\nconst buttonGroup = style({\n  marginStart: 'auto',\n  maxWidth: 'full'\n});\n\nexport const dialogInner = style({\n  display: 'flex',\n  flexDirection: 'column',\n  flexGrow: 1,\n  maxHeight: 'inherit',\n  boxSizing: 'border-box',\n  outlineStyle: 'none',\n  fontFamily: 'sans',\n  borderRadius: 'inherit',\n  overflow: 'auto'\n});\n\n/**\n * Dialogs are windows containing contextual information, tasks, or workflows that appear over the\n * user interface. Depending on the kind of Dialog, further interactions may be blocked until the\n * Dialog is acknowledged.\n */\nexport const Dialog = forwardRef(function Dialog(props: DialogProps, ref: DOMRef) {\n  let {size = 'M', isDismissible, isKeyboardDismissDisabled} = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <Modal\n      size={size}\n      isDismissable={isDismissible}\n      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          // Render the children multiple times inside the wrappers we need to implement the layout.\n          // Each instance hides certain children so that they are all rendered in the correct locations.\n          // Reset OverlayTriggerStateContext so the buttons inside the dialog don't retain their hover state.\n          <OverlayTriggerStateContext.Provider value={null}>\n            {/* Hero image */}\n            <Provider\n              values={[\n                [ImageContext, {styles: image}],\n                [HeadingContext, {isHidden: true}],\n                [HeaderContext, {isHidden: true}],\n                [ContentContext, {isHidden: true}],\n                [FooterContext, {isHidden: true}],\n                [ButtonGroupContext, {isHidden: true}]\n              ]}>\n              {children}\n            </Provider>\n            {/* Top header: heading, header, dismiss button, and button group (in fullscreen dialogs). */}\n            <div\n              className={style({\n                // Wrapper that creates the margin for the dismiss button.\n                display: 'flex',\n                alignItems: 'start',\n                columnGap: 12,\n                paddingStart: {\n                  default: 32\n                },\n                paddingEnd: {\n                  default: 32,\n                  isDismissible: 12\n                },\n                paddingTop: {\n                  default: 12 // margin to dismiss button\n                }\n              })({isDismissible: props.isDismissible})}>\n              <div\n                className={style({\n                  // Wrapper for heading, header, and button group.\n                  // This swaps orientation from horizontal to vertical at small screen sizes.\n                  display: 'flex',\n                  flexGrow: 1,\n                  marginTop: {\n                    default: 20, // 32 - 12 (handled above)\n                    ':empty': 0\n                  },\n                  marginBottom: {\n                    default: 16,\n                    ':empty': 0\n                  },\n                  columnGap: 24,\n                  rowGap: 8,\n                  flexDirection: {\n                    default: 'column',\n                    sm: 'row'\n                  },\n                  alignItems: {\n                    default: 'start',\n                    sm: 'center'\n                  }\n                })}>\n                <Provider\n                  values={[\n                    [ImageContext, {hidden: true}],\n                    [HeadingContext, {styles: heading}],\n                    [HeaderContext, {styles: header}],\n                    [ContentContext, {isHidden: true}],\n                    [FooterContext, {isHidden: true}],\n                    [ButtonGroupContext, {isHidden: true}]\n                  ]}>\n                  {children}\n                </Provider>\n              </div>\n              {props.isDismissible && <CloseButton styles={style({marginBottom: 12})} />}\n            </div>\n            {/* Main content */}\n            <Provider\n              values={[\n                [ImageContext, {hidden: true}],\n                [HeadingContext, {isHidden: true}],\n                [HeaderContext, {isHidden: true}],\n                [ContentContext, {styles: content}],\n                [FooterContext, {isHidden: true}],\n                [ButtonGroupContext, {isHidden: true}]\n              ]}>\n              {children}\n            </Provider>\n            {/* Footer and button group */}\n            <div\n              className={style({\n                display: 'flex',\n                paddingX: {\n                  default: 32\n                },\n                paddingBottom: {\n                  default: 32\n                },\n                paddingTop: {\n                  default: 32,\n                  ':empty': 0\n                },\n                gap: 24,\n                alignItems: 'center',\n                flexWrap: 'wrap'\n              })}>\n              <Provider\n                values={[\n                  [ImageContext, {hidden: true}],\n                  [HeadingContext, {isHidden: true}],\n                  [HeaderContext, {isHidden: true}],\n                  [ContentContext, {isHidden: true}],\n                  [FooterContext, {styles: footer}],\n                  [\n                    ButtonGroupContext,\n                    {isHidden: props.isDismissible, styles: buttonGroup, align: 'end'}\n                  ]\n                ]}>\n                {children}\n              </Provider>\n            </div>\n          </OverlayTriggerStateContext.Provider>\n        ))}\n      </RACDialog>\n    </Modal>\n  );\n});\n"],"names":[],"version":3,"file":"Dialog.mjs.map"}

package/dist/private/DialogContainer.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;AAmBM,SAAS,0CAAgB,KAA2B;IACzD,IAAI,YACF,QAAQ,aACR,SAAS,EACV,GAAG;IAEJ,IAAI,aAAa,CAAA,GAAA,sCAAI,EAAE,QAAQ,CAAC,OAAO,CAAC;IACxC,IAAI,WAAW,MAAM,GAAG,GACtB,MAAM,IAAI,MAAM;IAGlB,IAAI,CAAC,WAAW,aAAa,GAAG,CAAA,GAAA,qBAAO,EAAuB;IAE9D,6EAA6E;IAC7E,0DAA0D;IAC1D,IAAI,QAAkC;IACtC,IAAI,MAAM,OAAO,CAAC,WAChB,QAAQ,SAAS,IAAI,CAAC,CAAA,GAAA,sCAAI,EAAE,cAAc;SACrC,kBAAI,CAAA,GAAA,sCAAI,EAAE,cAAc,CAAC,WAC9B,QAAQ;IAGV,IAAI,SAAS,UAAU,WACrB,aAAa;IAGf,IAAI,eAAe,CAAC;QAClB,IAAI,CAAC,QACH;IAEJ;IAEA,qBACE,gCAAC,CAAA,GAAA,4CAAW,EAAE,QAAQ;QAAC,OAAO;YAAC,QAAQ,CAAC,CAAC;0BAAO;QAAY;kBACzD;;AAGP;AASO,SAAS;IACd,IAAI,UAAU,CAAA,GAAA,iDAAgB,EAAE,CAAA,GAAA,4CAAW;IAC3C,IAAI,CAAC,SACH,MAAM,IAAI,MAAM;IAGlB,OAAO;QACL;YACE,SAAS,eAAe;QAC1B;IACF;AACF","sources":["packages/@react-spectrum/s2/src/DialogContainer.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 {ModalContext} from 'react-aria-components/Modal';\n\nimport React, {ReactElement, ReactNode, useState} from 'react';\nimport {useSlottedContext} from 'react-aria-components/slots';\n\nexport interface DialogContainerProps {\n  /** The Dialog to display, if any. */\n  children: ReactNode,\n  /** Handler that is called when the 'x' button of a dismissable Dialog is clicked. */\n  onDismiss: () => void\n}\n\n/**\n * A DialogContainer accepts a single Dialog as a child, and manages showing and hiding\n * it in a modal. Useful in cases where there is no trigger element\n * or when the trigger unmounts while the dialog is open.\n */\nexport function DialogContainer(props: DialogContainerProps): ReactNode {\n  let {\n    children,\n    onDismiss\n  } = props;\n\n  let childArray = React.Children.toArray(children);\n  if (childArray.length > 1) {\n    throw new Error('Only a single child can be passed to DialogContainer.');\n  }\n\n  let [lastChild, setLastChild] = useState<ReactElement | null>(null);\n\n  // React.Children.toArray mutates the children, and we need them to be stable\n  // between renders so that the lastChild comparison works.\n  let child: ReactElement | undefined = undefined;\n  if (Array.isArray(children)) {\n    child = children.find(React.isValidElement);\n  } else if (React.isValidElement(children)) {\n    child = children;\n  }\n\n  if (child && child !== lastChild) {\n    setLastChild(child);\n  }\n\n  let onOpenChange = (isOpen: boolean) => {\n    if (!isOpen) {\n      onDismiss();\n    }\n  };\n\n  return (\n    <ModalContext.Provider value={{isOpen: !!child, onOpenChange}}>\n      {lastChild}\n    </ModalContext.Provider>\n  );\n}\n\nexport interface DialogContainerValue {\n  /**\n   * A handler to programmatically dismiss the dialog.\n   */\n  dismiss(): void\n}\n\nexport function useDialogContainer(): DialogContainerValue {\n  let context = useSlottedContext(ModalContext);\n  if (!context) {\n    throw new Error('Cannot call useDialogContext outside a <DialogTrigger> or <DialogContainer>.');\n  }\n\n  return {\n    dismiss() {\n      context?.onOpenChange?.(false);\n    }\n  };\n}\n"],"names":[],"version":3,"file":"DialogContainer.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;AAmBM,SAAS,0CAAgB,KAA2B;IACzD,IAAI,YAAC,QAAQ,aAAE,SAAS,EAAC,GAAG;IAE5B,IAAI,aAAa,CAAA,GAAA,sCAAI,EAAE,QAAQ,CAAC,OAAO,CAAC;IACxC,IAAI,WAAW,MAAM,GAAG,GACtB,MAAM,IAAI,MAAM;IAGlB,IAAI,CAAC,WAAW,aAAa,GAAG,CAAA,GAAA,qBAAO,EAAuB;IAE9D,6EAA6E;IAC7E,0DAA0D;IAC1D,IAAI,QAAkC;IACtC,IAAI,MAAM,OAAO,CAAC,WAChB,QAAQ,SAAS,IAAI,CAAC,CAAA,GAAA,sCAAI,EAAE,cAAc;SACrC,kBAAI,CAAA,GAAA,sCAAI,EAAE,cAAc,CAAC,WAC9B,QAAQ;IAGV,IAAI,SAAS,UAAU,WACrB,aAAa;IAGf,IAAI,eAAe,CAAC;QAClB,IAAI,CAAC,QACH;IAEJ;IAEA,qBACE,gCAAC,CAAA,GAAA,4CAAW,EAAE,QAAQ;QAAC,OAAO;YAAC,QAAQ,CAAC,CAAC;0BAAO;QAAY;kBACzD;;AAGP;AASO,SAAS;IACd,IAAI,UAAU,CAAA,GAAA,iDAAgB,EAAE,CAAA,GAAA,4CAAW;IAC3C,IAAI,CAAC,SACH,MAAM,IAAI,MAAM;IAGlB,OAAO;QACL;YACE,SAAS,eAAe;QAC1B;IACF;AACF","sources":["packages/@react-spectrum/s2/src/DialogContainer.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 {ModalContext} from 'react-aria-components/Modal';\n\nimport React, {ReactElement, ReactNode, useState} from 'react';\nimport {useSlottedContext} from 'react-aria-components/slots';\n\nexport interface DialogContainerProps {\n  /** The Dialog to display, if any. */\n  children: ReactNode;\n  /** Handler that is called when the 'x' button of a dismissable Dialog is clicked. */\n  onDismiss: () => void;\n}\n\n/**\n * A DialogContainer accepts a single Dialog as a child, and manages showing and hiding\n * it in a modal. Useful in cases where there is no trigger element\n * or when the trigger unmounts while the dialog is open.\n */\nexport function DialogContainer(props: DialogContainerProps): ReactNode {\n  let {children, onDismiss} = props;\n\n  let childArray = React.Children.toArray(children);\n  if (childArray.length > 1) {\n    throw new Error('Only a single child can be passed to DialogContainer.');\n  }\n\n  let [lastChild, setLastChild] = useState<ReactElement | null>(null);\n\n  // React.Children.toArray mutates the children, and we need them to be stable\n  // between renders so that the lastChild comparison works.\n  let child: ReactElement | undefined = undefined;\n  if (Array.isArray(children)) {\n    child = children.find(React.isValidElement);\n  } else if (React.isValidElement(children)) {\n    child = children;\n  }\n\n  if (child && child !== lastChild) {\n    setLastChild(child);\n  }\n\n  let onOpenChange = (isOpen: boolean) => {\n    if (!isOpen) {\n      onDismiss();\n    }\n  };\n\n  return (\n    <ModalContext.Provider value={{isOpen: !!child, onOpenChange}}>\n      {lastChild}\n    </ModalContext.Provider>\n  );\n}\n\nexport interface DialogContainerValue {\n  /**\n   * A handler to programmatically dismiss the dialog.\n   */\n  dismiss(): void;\n}\n\nexport function useDialogContainer(): DialogContainerValue {\n  let context = useSlottedContext(ModalContext);\n  if (!context) {\n    throw new Error('Cannot call useDialogContext outside a <DialogTrigger> or <DialogContainer>.');\n  }\n\n  return {\n    dismiss() {\n      context?.onOpenChange?.(false);\n    }\n  };\n}\n"],"names":[],"version":3,"file":"DialogContainer.cjs.map"}

package/dist/private/DialogContainer.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;AAAA;;;;;;;;;;CAUC;;;;AAmBM,SAAS,0CAAgB,KAA2B;IACzD,IAAI,YACF,QAAQ,aACR,SAAS,EACV,GAAG;IAEJ,IAAI,aAAa,CAAA,GAAA,YAAI,EAAE,QAAQ,CAAC,OAAO,CAAC;IACxC,IAAI,WAAW,MAAM,GAAG,GACtB,MAAM,IAAI,MAAM;IAGlB,IAAI,CAAC,WAAW,aAAa,GAAG,CAAA,GAAA,eAAO,EAAuB;IAE9D,6EAA6E;IAC7E,0DAA0D;IAC1D,IAAI,QAAkC;IACtC,IAAI,MAAM,OAAO,CAAC,WAChB,QAAQ,SAAS,IAAI,CAAC,CAAA,GAAA,YAAI,EAAE,cAAc;SACrC,kBAAI,CAAA,GAAA,YAAI,EAAE,cAAc,CAAC,WAC9B,QAAQ;IAGV,IAAI,SAAS,UAAU,WACrB,aAAa;IAGf,IAAI,eAAe,CAAC;QAClB,IAAI,CAAC,QACH;IAEJ;IAEA,qBACE,gBAAC,CAAA,GAAA,mBAAW,EAAE,QAAQ;QAAC,OAAO;YAAC,QAAQ,CAAC,CAAC;0BAAO;QAAY;kBACzD;;AAGP;AASO,SAAS;IACd,IAAI,UAAU,CAAA,GAAA,wBAAgB,EAAE,CAAA,GAAA,mBAAW;IAC3C,IAAI,CAAC,SACH,MAAM,IAAI,MAAM;IAGlB,OAAO;QACL;YACE,SAAS,eAAe;QAC1B;IACF;AACF","sources":["packages/@react-spectrum/s2/src/DialogContainer.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 {ModalContext} from 'react-aria-components/Modal';\n\nimport React, {ReactElement, ReactNode, useState} from 'react';\nimport {useSlottedContext} from 'react-aria-components/slots';\n\nexport interface DialogContainerProps {\n  /** The Dialog to display, if any. */\n  children: ReactNode,\n  /** Handler that is called when the 'x' button of a dismissable Dialog is clicked. */\n  onDismiss: () => void\n}\n\n/**\n * A DialogContainer accepts a single Dialog as a child, and manages showing and hiding\n * it in a modal. Useful in cases where there is no trigger element\n * or when the trigger unmounts while the dialog is open.\n */\nexport function DialogContainer(props: DialogContainerProps): ReactNode {\n  let {\n    children,\n    onDismiss\n  } = props;\n\n  let childArray = React.Children.toArray(children);\n  if (childArray.length > 1) {\n    throw new Error('Only a single child can be passed to DialogContainer.');\n  }\n\n  let [lastChild, setLastChild] = useState<ReactElement | null>(null);\n\n  // React.Children.toArray mutates the children, and we need them to be stable\n  // between renders so that the lastChild comparison works.\n  let child: ReactElement | undefined = undefined;\n  if (Array.isArray(children)) {\n    child = children.find(React.isValidElement);\n  } else if (React.isValidElement(children)) {\n    child = children;\n  }\n\n  if (child && child !== lastChild) {\n    setLastChild(child);\n  }\n\n  let onOpenChange = (isOpen: boolean) => {\n    if (!isOpen) {\n      onDismiss();\n    }\n  };\n\n  return (\n    <ModalContext.Provider value={{isOpen: !!child, onOpenChange}}>\n      {lastChild}\n    </ModalContext.Provider>\n  );\n}\n\nexport interface DialogContainerValue {\n  /**\n   * A handler to programmatically dismiss the dialog.\n   */\n  dismiss(): void\n}\n\nexport function useDialogContainer(): DialogContainerValue {\n  let context = useSlottedContext(ModalContext);\n  if (!context) {\n    throw new Error('Cannot call useDialogContext outside a <DialogTrigger> or <DialogContainer>.');\n  }\n\n  return {\n    dismiss() {\n      context?.onOpenChange?.(false);\n    }\n  };\n}\n"],"names":[],"version":3,"file":"DialogContainer.mjs.map"}
+{"mappings":";;;;;AAAA;;;;;;;;;;CAUC;;;;AAmBM,SAAS,0CAAgB,KAA2B;IACzD,IAAI,YAAC,QAAQ,aAAE,SAAS,EAAC,GAAG;IAE5B,IAAI,aAAa,CAAA,GAAA,YAAI,EAAE,QAAQ,CAAC,OAAO,CAAC;IACxC,IAAI,WAAW,MAAM,GAAG,GACtB,MAAM,IAAI,MAAM;IAGlB,IAAI,CAAC,WAAW,aAAa,GAAG,CAAA,GAAA,eAAO,EAAuB;IAE9D,6EAA6E;IAC7E,0DAA0D;IAC1D,IAAI,QAAkC;IACtC,IAAI,MAAM,OAAO,CAAC,WAChB,QAAQ,SAAS,IAAI,CAAC,CAAA,GAAA,YAAI,EAAE,cAAc;SACrC,kBAAI,CAAA,GAAA,YAAI,EAAE,cAAc,CAAC,WAC9B,QAAQ;IAGV,IAAI,SAAS,UAAU,WACrB,aAAa;IAGf,IAAI,eAAe,CAAC;QAClB,IAAI,CAAC,QACH;IAEJ;IAEA,qBACE,gBAAC,CAAA,GAAA,mBAAW,EAAE,QAAQ;QAAC,OAAO;YAAC,QAAQ,CAAC,CAAC;0BAAO;QAAY;kBACzD;;AAGP;AASO,SAAS;IACd,IAAI,UAAU,CAAA,GAAA,wBAAgB,EAAE,CAAA,GAAA,mBAAW;IAC3C,IAAI,CAAC,SACH,MAAM,IAAI,MAAM;IAGlB,OAAO;QACL;YACE,SAAS,eAAe;QAC1B;IACF;AACF","sources":["packages/@react-spectrum/s2/src/DialogContainer.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 {ModalContext} from 'react-aria-components/Modal';\n\nimport React, {ReactElement, ReactNode, useState} from 'react';\nimport {useSlottedContext} from 'react-aria-components/slots';\n\nexport interface DialogContainerProps {\n  /** The Dialog to display, if any. */\n  children: ReactNode;\n  /** Handler that is called when the 'x' button of a dismissable Dialog is clicked. */\n  onDismiss: () => void;\n}\n\n/**\n * A DialogContainer accepts a single Dialog as a child, and manages showing and hiding\n * it in a modal. Useful in cases where there is no trigger element\n * or when the trigger unmounts while the dialog is open.\n */\nexport function DialogContainer(props: DialogContainerProps): ReactNode {\n  let {children, onDismiss} = props;\n\n  let childArray = React.Children.toArray(children);\n  if (childArray.length > 1) {\n    throw new Error('Only a single child can be passed to DialogContainer.');\n  }\n\n  let [lastChild, setLastChild] = useState<ReactElement | null>(null);\n\n  // React.Children.toArray mutates the children, and we need them to be stable\n  // between renders so that the lastChild comparison works.\n  let child: ReactElement | undefined = undefined;\n  if (Array.isArray(children)) {\n    child = children.find(React.isValidElement);\n  } else if (React.isValidElement(children)) {\n    child = children;\n  }\n\n  if (child && child !== lastChild) {\n    setLastChild(child);\n  }\n\n  let onOpenChange = (isOpen: boolean) => {\n    if (!isOpen) {\n      onDismiss();\n    }\n  };\n\n  return (\n    <ModalContext.Provider value={{isOpen: !!child, onOpenChange}}>\n      {lastChild}\n    </ModalContext.Provider>\n  );\n}\n\nexport interface DialogContainerValue {\n  /**\n   * A handler to programmatically dismiss the dialog.\n   */\n  dismiss(): void;\n}\n\nexport function useDialogContainer(): DialogContainerValue {\n  let context = useSlottedContext(ModalContext);\n  if (!context) {\n    throw new Error('Cannot call useDialogContext outside a <DialogTrigger> or <DialogContainer>.');\n  }\n\n  return {\n    dismiss() {\n      context?.onOpenChange?.(false);\n    }\n  };\n}\n"],"names":[],"version":3,"file":"DialogContainer.mjs.map"}

package/dist/private/DialogTrigger.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;AAgBM,SAAS,0CAAc,KAAyB;IACrD,qBACE,gCAAC,CAAA,GAAA,8CAAgB;QAAG,GAAG,KAAK;kBAG1B,cAAA,gCAAC,CAAA,GAAA,gEAAa;YAAE,WAAW;sBACxB,MAAM,QAAQ;;;AAIvB","sources":["packages/@react-spectrum/s2/src/DialogTrigger.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 {\n  DialogTrigger as AriaDialogTrigger,\n  DialogTriggerProps as AriaDialogTriggerProps\n} from 'react-aria-components/Dialog';\nimport {PressResponder} from 'react-aria/private/interactions/PressResponder';\nimport {ReactNode} from 'react';\n\nexport interface DialogTriggerProps extends AriaDialogTriggerProps {}\n\n/**\n * DialogTrigger serves as a wrapper around a Dialog and its associated trigger, linking the Dialog's\n * open state with the trigger's press state. Additionally, it allows you to customize the type and\n * positioning of the Dialog.\n */\nexport function DialogTrigger(props: DialogTriggerProps): ReactNode {\n  return (\n    <AriaDialogTrigger {...props}>\n      {/* RAC sets isPressed via PressResponder when the dialog is open.\n          We don't want press scaling to appear to get \"stuck\", so override this. */}\n      <PressResponder isPressed={false}>\n        {props.children}\n      </PressResponder>\n    </AriaDialogTrigger>\n  );\n}\n"],"names":[],"version":3,"file":"DialogTrigger.cjs.map"}
+{"mappings":";;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;AAgBM,SAAS,0CAAc,KAAyB;IACrD,qBACE,gCAAC,CAAA,GAAA,8CAAgB;QAAG,GAAG,KAAK;kBAG1B,cAAA,gCAAC,CAAA,GAAA,gEAAa;YAAE,WAAW;sBAAQ,MAAM,QAAQ;;;AAGvD","sources":["packages/@react-spectrum/s2/src/DialogTrigger.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 {\n  DialogTrigger as AriaDialogTrigger,\n  DialogTriggerProps as AriaDialogTriggerProps\n} from 'react-aria-components/Dialog';\nimport {PressResponder} from 'react-aria/private/interactions/PressResponder';\nimport {ReactNode} from 'react';\n\nexport interface DialogTriggerProps extends AriaDialogTriggerProps {}\n\n/**\n * DialogTrigger serves as a wrapper around a Dialog and its associated trigger, linking the\n * Dialog's open state with the trigger's press state. Additionally, it allows you to customize the\n * type and positioning of the Dialog.\n */\nexport function DialogTrigger(props: DialogTriggerProps): ReactNode {\n  return (\n    <AriaDialogTrigger {...props}>\n      {/* RAC sets isPressed via PressResponder when the dialog is open.\n          We don't want press scaling to appear to get \"stuck\", so override this. */}\n      <PressResponder isPressed={false}>{props.children}</PressResponder>\n    </AriaDialogTrigger>\n  );\n}\n"],"names":[],"version":3,"file":"DialogTrigger.cjs.map"}

package/dist/private/DialogTrigger.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;AAAA;;;;;;;;;;CAUC;;;AAgBM,SAAS,0CAAc,KAAyB;IACrD,qBACE,gBAAC,CAAA,GAAA,oBAAgB;QAAG,GAAG,KAAK;kBAG1B,cAAA,gBAAC,CAAA,GAAA,qBAAa;YAAE,WAAW;sBACxB,MAAM,QAAQ;;;AAIvB","sources":["packages/@react-spectrum/s2/src/DialogTrigger.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 {\n  DialogTrigger as AriaDialogTrigger,\n  DialogTriggerProps as AriaDialogTriggerProps\n} from 'react-aria-components/Dialog';\nimport {PressResponder} from 'react-aria/private/interactions/PressResponder';\nimport {ReactNode} from 'react';\n\nexport interface DialogTriggerProps extends AriaDialogTriggerProps {}\n\n/**\n * DialogTrigger serves as a wrapper around a Dialog and its associated trigger, linking the Dialog's\n * open state with the trigger's press state. Additionally, it allows you to customize the type and\n * positioning of the Dialog.\n */\nexport function DialogTrigger(props: DialogTriggerProps): ReactNode {\n  return (\n    <AriaDialogTrigger {...props}>\n      {/* RAC sets isPressed via PressResponder when the dialog is open.\n          We don't want press scaling to appear to get \"stuck\", so override this. */}\n      <PressResponder isPressed={false}>\n        {props.children}\n      </PressResponder>\n    </AriaDialogTrigger>\n  );\n}\n"],"names":[],"version":3,"file":"DialogTrigger.mjs.map"}
+{"mappings":";;;;AAAA;;;;;;;;;;CAUC;;;AAgBM,SAAS,0CAAc,KAAyB;IACrD,qBACE,gBAAC,CAAA,GAAA,oBAAgB;QAAG,GAAG,KAAK;kBAG1B,cAAA,gBAAC,CAAA,GAAA,qBAAa;YAAE,WAAW;sBAAQ,MAAM,QAAQ;;;AAGvD","sources":["packages/@react-spectrum/s2/src/DialogTrigger.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 {\n  DialogTrigger as AriaDialogTrigger,\n  DialogTriggerProps as AriaDialogTriggerProps\n} from 'react-aria-components/Dialog';\nimport {PressResponder} from 'react-aria/private/interactions/PressResponder';\nimport {ReactNode} from 'react';\n\nexport interface DialogTriggerProps extends AriaDialogTriggerProps {}\n\n/**\n * DialogTrigger serves as a wrapper around a Dialog and its associated trigger, linking the\n * Dialog's open state with the trigger's press state. Additionally, it allows you to customize the\n * type and positioning of the Dialog.\n */\nexport function DialogTrigger(props: DialogTriggerProps): ReactNode {\n  return (\n    <AriaDialogTrigger {...props}>\n      {/* RAC sets isPressed via PressResponder when the dialog is open.\n          We don't want press scaling to appear to get \"stuck\", so override this. */}\n      <PressResponder isPressed={false}>{props.children}</PressResponder>\n    </AriaDialogTrigger>\n  );\n}\n"],"names":[],"version":3,"file":"DialogTrigger.mjs.map"}