@react-spectrum/s2 3.0.0-nightly-ab9fd5c68-241126 → 3.0.0-nightly-b0f156972-241128

package/dist/Disclosure.css.map

@@ -1 +1 @@
-{"mappings":"AC2CmB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAyEE;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAQA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA4EC;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA6CwB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAgE1B;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AA1QD;EAAA;;;;EAAA;;;;EAiFE;;;;EAyLD;;;;EAAA;;;;;AA1QD;;AAiFE;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;IAAA;;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAyLD;;;;;;AA7GE","sources":["af82a6f8008c749b","packages/@react-spectrum/s2/src/Disclosure.tsx"],"sourcesContent":["@import \"02b9b02b69a441b2\";\n@import \"80d1cf6aba9342e9\";\n@import \"d47c144c912b2c65\";\n@import \"54c3947845455457\";\n@import \"47e48706d70658de\";\n@import \"879f5cdc449bf13e\";\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 {ActionButtonContext} from './ActionButton';\nimport {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue, forwardRefType} from '@react-types/shared';\nimport {Button, ContextValue, DisclosureStateContext, Heading, Provider, Disclosure as RACDisclosure, DisclosurePanel as RACDisclosurePanel, DisclosurePanelProps as RACDisclosurePanelProps, DisclosureProps as RACDisclosureProps, useLocale, useSlottedContext} from 'react-aria-components';\nimport {CenterBaseline} from './CenterBaseline';\nimport {centerPadding, getAllowedOverrides, StyleProps, UnsafeStyles} from './style-utils' with { type: 'macro' };\nimport Chevron from '../ui-icons/Chevron';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {focusRing, lightDark, style} from '../style' with { type: 'macro' };\nimport React, {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface DisclosureProps extends Omit<RACDisclosureProps, 'className' | 'style' | 'children'>, StyleProps {\n  /**\n   * The size of the disclosure.\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL',\n  /**\n   * The amount of space between the disclosures.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /** Whether the disclosure should be displayed with a quiet style. */\n  isQuiet?: boolean,\n  /** The contents of the disclosure, consisting of a DisclosureTitle and DisclosurePanel. */\n  children: ReactNode\n}\n\nexport const DisclosureContext = createContext<ContextValue<Omit<DisclosureProps, 'children'>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst disclosure = style({\n  color: 'heading',\n  borderTopWidth: {\n    default: 1,\n    isQuiet: 0\n  },\n  borderBottomWidth: {\n    default: 1,\n    isQuiet: 0,\n    isInGroup: {\n      default: 0,\n      ':last-child': {\n        default: 1,\n        isQuiet: 0\n      }\n    }\n  },\n  borderStartWidth: 0,\n  borderEndWidth: 0,\n  borderStyle: 'solid',\n  borderColor: 'gray-200',\n  minWidth: 200\n}, getAllowedOverrides());\n\nfunction Disclosure(props: DisclosureProps, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, DisclosureContext);\n  let {\n    size = 'M',\n    density = 'regular',\n    isQuiet,\n    UNSAFE_style,\n    UNSAFE_className = ''\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  let isInGroup = useContext(DisclosureContext) !== null;\n\n  return (\n    <Provider\n      values={[\n        [DisclosureContext, {size, isQuiet, density}]\n      ]}>\n      <RACDisclosure\n        {...props}\n        ref={domRef}\n        style={UNSAFE_style}\n        className={(UNSAFE_className ?? '') + disclosure({isQuiet, isInGroup}, props.styles)}>\n        {props.children}\n      </RACDisclosure>\n    </Provider>\n  );\n}\n\n/**\n * A disclosure is a collapsible section of content. It is composed of a a header with a heading and trigger button, and a panel that contains the content.\n */\nlet _Disclosure = forwardRef(Disclosure);\nexport {_Disclosure as Disclosure};\n\nexport interface DisclosureTitleProps extends UnsafeStyles, DOMProps {\n  /** The heading level of the disclosure header.\n   * \n   * @default 3\n   */\n  level?: number,\n  /** The contents of the disclosure header. */\n  children: React.ReactNode\n}\n\ninterface DisclosureHeaderProps extends UnsafeStyles, DOMProps {\n  children: React.ReactNode\n}\n\nconst headingStyle = style({\n  margin: 0,\n  flexGrow: 1,\n  display: 'flex',\n  flexShrink: 1,\n  minWidth: 0\n});\n\nconst buttonStyles = style({\n  ...focusRing(),\n  outlineOffset: -2,\n  font: 'heading',\n  color: {\n    default: 'neutral',\n    isDisabled: 'disabled'\n  },\n  fontWeight: 'bold',\n  fontSize: {\n    size: {\n      S: 'heading-xs',\n      M: 'heading-sm',\n      L: 'heading',\n      XL: 'heading-lg'\n    }\n  },\n  lineHeight: 'ui',\n  display: 'flex',\n  flexGrow: 1,\n  alignItems: 'baseline',\n  paddingX: '[calc(self(minHeight) * 3/8 - 1px)]',\n  paddingY: centerPadding(),\n  gap: '[calc(self(minHeight) * 3/8 - 1px)]',\n  minHeight: {\n    // compact is equivalent to 'control', but other densities have more padding.\n    size: {\n      S: {\n        density: {\n          compact: 24,\n          regular: 32,\n          spacious: 40\n        }\n      },\n      M: {\n        density: {\n          compact: 32,\n          regular: 40,\n          spacious: 48\n        }\n      },\n      L: {\n        density: {\n          compact: 40,\n          regular: 48,\n          spacious: 56\n        }\n      },\n      XL: {\n        density: {\n          compact: 48,\n          regular: 56,\n          spacious: 64\n        }\n      }\n    }\n  },\n  width: 'full',\n  backgroundColor: {\n    default: 'transparent',\n    isFocusVisible: lightDark('transparent-black-100', 'transparent-white-100'),\n    isHovered: lightDark('transparent-black-100', 'transparent-white-100'),\n    isPressed: lightDark('transparent-black-300', 'transparent-white-300')\n  },\n  transition: 'default',\n  borderWidth: 0,\n  borderRadius: {\n    // Only rounded for keyboard focus and quiet.\n    default: 'none',\n    isFocusVisible: 'control',\n    isQuiet: 'control'\n  },\n  textAlign: 'start',\n  disableTapHighlight: true\n});\n\nconst chevronStyles = style({\n  rotate: {\n    isRTL: 180,\n    isExpanded: 90\n  },\n  transition: 'default',\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  },\n  flexShrink: 0\n});\n\nconst InternalDisclosureHeader = createContext<{} | null>(null);\n\nfunction DisclosureHeaderWithForwardRef(props: DisclosureHeaderProps, ref: DOMRef<HTMLDivElement>) {\n  let {\n    UNSAFE_className,\n    UNSAFE_style,\n    children\n  } = props;\n  let domRef = useDOMRef(ref);\n  let {size, isQuiet, density} = useSlottedContext(DisclosureContext)!;\n\n  let mapSize = {\n    S: 'XS',\n    M: 'S',\n    L: 'M',\n    XL: 'L'\n  };\n\n  // maps to one size smaller in the compact density to ensure there is space between the top and bottom of the action button and container\n  let newSize : 'XS' | 'S' | 'M' | 'L' | 'XL' | undefined = size;\n  if (density === 'compact') {\n    newSize = mapSize[size ?? 'M'] as 'XS' | 'S' | 'M' | 'L';\n  }\n\n  return (\n    <Provider\n      values={[\n        [ActionButtonContext, {size: newSize, isQuiet}],\n        [InternalDisclosureHeader, {}]\n      ]}>\n      <div\n        style={UNSAFE_style}\n        className={(UNSAFE_className ?? '') + style({display: 'flex', alignItems: 'center', gap: 4})}\n        ref={domRef}>\n        {children}\n      </div>\n    </Provider>\n  );\n}\n\n/**\n * A wrapper element for the disclosure title that can contain other elements not part of the trigger.\n */\nexport const DisclosureHeader = /*#__PURE__*/ (forwardRef as forwardRefType)(DisclosureHeaderWithForwardRef);\n\nfunction DisclosureTitle(props: DisclosureTitleProps, ref: DOMRef<HTMLDivElement>) {\n  let {\n    level = 3,\n    UNSAFE_style,\n    UNSAFE_className = '',\n    ...otherProps\n  } = props;\n  let domRef = useDOMRef(ref);\n  const domProps = filterDOMProps(otherProps);\n  let {direction} = useLocale();\n  let {isExpanded} = useContext(DisclosureStateContext)!;\n  let {size, density, isQuiet} = useSlottedContext(DisclosureContext)!;\n  let isRTL = direction === 'rtl';\n\n  let buttonTrigger = (\n    <Heading\n      {...domProps}\n      level={level}\n      ref={domRef}\n      style={UNSAFE_style}\n      className={(UNSAFE_className ?? '') + headingStyle}>\n      <Button className={(renderProps) => buttonStyles({...renderProps, size, density, isQuiet})} slot=\"trigger\">\n        <CenterBaseline>\n          <Chevron size={size} className={chevronStyles({isExpanded, isRTL})} aria-hidden=\"true\" />\n        </CenterBaseline>\n        {props.children}\n      </Button>\n    </Heading>\n  );\n  let ctx = useContext(InternalDisclosureHeader);\n  if (ctx) {\n    return buttonTrigger;\n  }\n\n  return (\n    <DisclosureHeader>\n      {buttonTrigger}\n    </DisclosureHeader>\n  );\n}\n\n/**\n * A disclosure title consisting of a heading and a trigger button to expand/collapse the panel.\n */\nlet _DisclosureTitle = forwardRef(DisclosureTitle);\nexport {_DisclosureTitle as DisclosureTitle};\n\nexport interface DisclosurePanelProps extends Omit<RACDisclosurePanelProps, 'className' | 'style' | 'children'>, UnsafeStyles, DOMProps, AriaLabelingProps {\n  children: React.ReactNode\n}\n\nconst panelStyles = style({\n  font: 'body',\n  paddingTop: {\n    isExpanded: 8\n  },\n  paddingBottom: {\n    isExpanded: 16\n  },\n  paddingX: {\n    isExpanded: {\n      size: {\n        S: 8,\n        M: 9,\n        L: 12,\n        XL: 15\n      }\n    }\n  }\n});\n\nfunction DisclosurePanel(props: DisclosurePanelProps, ref: DOMRef<HTMLDivElement>) {\n  let {\n    UNSAFE_style,\n    UNSAFE_className = '',\n    ...otherProps\n  } = props;\n  const domProps = filterDOMProps(otherProps);\n  let {size} = useSlottedContext(DisclosureContext)!;\n  let {isExpanded} = useContext(DisclosureStateContext)!;\n  let panelRef = useDOMRef(ref);\n  return (\n    <RACDisclosurePanel\n      {...domProps}\n      ref={panelRef}\n      style={UNSAFE_style}\n      className={(UNSAFE_className ?? '') + panelStyles({size, isExpanded})}>\n      {props.children}\n    </RACDisclosurePanel>\n  );\n}\n\n/**\n * A disclosure panel is a collapsible section of content that is hidden until the disclosure is expanded.\n */\nlet _DisclosurePanel = forwardRef(DisclosurePanel);\nexport {_DisclosurePanel as DisclosurePanel};\n\n"],"names":[],"version":3,"file":"Disclosure.css.map"}
+{"mappings":"AC2CmB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAsEE;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAQA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA4EC;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA6CwB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA6D1B;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AApQD;EAAA;;;;EAAA;;;;EA8EE;;;;EAsLD;;;;EAAA;;;;;AApQD;;AA8EE;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;IAAA;;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAsLD;;;;;;AA1GE","sources":["af82a6f8008c749b","packages/@react-spectrum/s2/src/Disclosure.tsx"],"sourcesContent":["@import \"02b9b02b69a441b2\";\n@import \"80d1cf6aba9342e9\";\n@import \"d47c144c912b2c65\";\n@import \"54c3947845455457\";\n@import \"47e48706d70658de\";\n@import \"879f5cdc449bf13e\";\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 {ActionButtonContext} from './ActionButton';\nimport {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue, forwardRefType} from '@react-types/shared';\nimport {Button, ContextValue, DisclosureStateContext, Heading, Provider, Disclosure as RACDisclosure, DisclosurePanel as RACDisclosurePanel, DisclosurePanelProps as RACDisclosurePanelProps, DisclosureProps as RACDisclosureProps, useLocale, useSlottedContext} from 'react-aria-components';\nimport {CenterBaseline} from './CenterBaseline';\nimport {centerPadding, getAllowedOverrides, StyleProps, UnsafeStyles} from './style-utils' with { type: 'macro' };\nimport Chevron from '../ui-icons/Chevron';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {focusRing, lightDark, style} from '../style' with { type: 'macro' };\nimport React, {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface DisclosureProps extends Omit<RACDisclosureProps, 'className' | 'style' | 'children'>, StyleProps {\n  /**\n   * The size of the disclosure.\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL',\n  /**\n   * The amount of space between the disclosures.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /** Whether the disclosure should be displayed with a quiet style. */\n  isQuiet?: boolean,\n  /** The contents of the disclosure, consisting of a DisclosureTitle and DisclosurePanel. */\n  children: ReactNode\n}\n\nexport const DisclosureContext = createContext<ContextValue<Omit<DisclosureProps, 'children'>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst disclosure = style({\n  color: 'heading',\n  borderTopWidth: {\n    default: 1,\n    isQuiet: 0\n  },\n  borderBottomWidth: {\n    default: 1,\n    isQuiet: 0,\n    isInGroup: {\n      default: 0,\n      ':last-child': {\n        default: 1,\n        isQuiet: 0\n      }\n    }\n  },\n  borderStartWidth: 0,\n  borderEndWidth: 0,\n  borderStyle: 'solid',\n  borderColor: 'gray-200',\n  minWidth: 200\n}, getAllowedOverrides());\n\n/**\n * A disclosure is a collapsible section of content. It is composed of a a header with a heading and trigger button, and a panel that contains the content.\n */\nexport const Disclosure = forwardRef(function Disclosure(props: DisclosureProps, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, DisclosureContext);\n  let {\n    size = 'M',\n    density = 'regular',\n    isQuiet,\n    UNSAFE_style,\n    UNSAFE_className = ''\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  let isInGroup = useContext(DisclosureContext) !== null;\n\n  return (\n    <Provider\n      values={[\n        [DisclosureContext, {size, isQuiet, density}]\n      ]}>\n      <RACDisclosure\n        {...props}\n        ref={domRef}\n        style={UNSAFE_style}\n        className={(UNSAFE_className ?? '') + disclosure({isQuiet, isInGroup}, props.styles)}>\n        {props.children}\n      </RACDisclosure>\n    </Provider>\n  );\n});\n\nexport interface DisclosureTitleProps extends UnsafeStyles, DOMProps {\n  /** The heading level of the disclosure header.\n   * \n   * @default 3\n   */\n  level?: number,\n  /** The contents of the disclosure header. */\n  children: React.ReactNode\n}\n\ninterface DisclosureHeaderProps extends UnsafeStyles, DOMProps {\n  children: React.ReactNode\n}\n\nconst headingStyle = style({\n  margin: 0,\n  flexGrow: 1,\n  display: 'flex',\n  flexShrink: 1,\n  minWidth: 0\n});\n\nconst buttonStyles = style({\n  ...focusRing(),\n  outlineOffset: -2,\n  font: 'heading',\n  color: {\n    default: 'neutral',\n    isDisabled: 'disabled'\n  },\n  fontWeight: 'bold',\n  fontSize: {\n    size: {\n      S: 'heading-xs',\n      M: 'heading-sm',\n      L: 'heading',\n      XL: 'heading-lg'\n    }\n  },\n  lineHeight: 'ui',\n  display: 'flex',\n  flexGrow: 1,\n  alignItems: 'baseline',\n  paddingX: '[calc(self(minHeight) * 3/8 - 1px)]',\n  paddingY: centerPadding(),\n  gap: '[calc(self(minHeight) * 3/8 - 1px)]',\n  minHeight: {\n    // compact is equivalent to 'control', but other densities have more padding.\n    size: {\n      S: {\n        density: {\n          compact: 24,\n          regular: 32,\n          spacious: 40\n        }\n      },\n      M: {\n        density: {\n          compact: 32,\n          regular: 40,\n          spacious: 48\n        }\n      },\n      L: {\n        density: {\n          compact: 40,\n          regular: 48,\n          spacious: 56\n        }\n      },\n      XL: {\n        density: {\n          compact: 48,\n          regular: 56,\n          spacious: 64\n        }\n      }\n    }\n  },\n  width: 'full',\n  backgroundColor: {\n    default: 'transparent',\n    isFocusVisible: lightDark('transparent-black-100', 'transparent-white-100'),\n    isHovered: lightDark('transparent-black-100', 'transparent-white-100'),\n    isPressed: lightDark('transparent-black-300', 'transparent-white-300')\n  },\n  transition: 'default',\n  borderWidth: 0,\n  borderRadius: {\n    // Only rounded for keyboard focus and quiet.\n    default: 'none',\n    isFocusVisible: 'control',\n    isQuiet: 'control'\n  },\n  textAlign: 'start',\n  disableTapHighlight: true\n});\n\nconst chevronStyles = style({\n  rotate: {\n    isRTL: 180,\n    isExpanded: 90\n  },\n  transition: 'default',\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  },\n  flexShrink: 0\n});\n\nconst InternalDisclosureHeader = createContext<{} | null>(null);\n\nfunction DisclosureHeaderWithForwardRef(props: DisclosureHeaderProps, ref: DOMRef<HTMLDivElement>) {\n  let {\n    UNSAFE_className,\n    UNSAFE_style,\n    children\n  } = props;\n  let domRef = useDOMRef(ref);\n  let {size, isQuiet, density} = useSlottedContext(DisclosureContext)!;\n\n  let mapSize = {\n    S: 'XS',\n    M: 'S',\n    L: 'M',\n    XL: 'L'\n  };\n\n  // maps to one size smaller in the compact density to ensure there is space between the top and bottom of the action button and container\n  let newSize : 'XS' | 'S' | 'M' | 'L' | 'XL' | undefined = size;\n  if (density === 'compact') {\n    newSize = mapSize[size ?? 'M'] as 'XS' | 'S' | 'M' | 'L';\n  }\n\n  return (\n    <Provider\n      values={[\n        [ActionButtonContext, {size: newSize, isQuiet}],\n        [InternalDisclosureHeader, {}]\n      ]}>\n      <div\n        style={UNSAFE_style}\n        className={(UNSAFE_className ?? '') + style({display: 'flex', alignItems: 'center', gap: 4})}\n        ref={domRef}>\n        {children}\n      </div>\n    </Provider>\n  );\n}\n\n/**\n * A wrapper element for the disclosure title that can contain other elements not part of the trigger.\n */\nexport const DisclosureHeader = /*#__PURE__*/ (forwardRef as forwardRefType)(DisclosureHeaderWithForwardRef);\n\n/**\n * A disclosure title consisting of a heading and a trigger button to expand/collapse the panel.\n */\nexport const DisclosureTitle = forwardRef(function DisclosureTitle(props: DisclosureTitleProps, ref: DOMRef<HTMLDivElement>) {\n  let {\n    level = 3,\n    UNSAFE_style,\n    UNSAFE_className = '',\n    ...otherProps\n  } = props;\n  let domRef = useDOMRef(ref);\n  const domProps = filterDOMProps(otherProps);\n  let {direction} = useLocale();\n  let {isExpanded} = useContext(DisclosureStateContext)!;\n  let {size, density, isQuiet} = useSlottedContext(DisclosureContext)!;\n  let isRTL = direction === 'rtl';\n\n  let buttonTrigger = (\n    <Heading\n      {...domProps}\n      level={level}\n      ref={domRef}\n      style={UNSAFE_style}\n      className={(UNSAFE_className ?? '') + headingStyle}>\n      <Button className={(renderProps) => buttonStyles({...renderProps, size, density, isQuiet})} slot=\"trigger\">\n        <CenterBaseline>\n          <Chevron size={size} className={chevronStyles({isExpanded, isRTL})} aria-hidden=\"true\" />\n        </CenterBaseline>\n        {props.children}\n      </Button>\n    </Heading>\n  );\n  let ctx = useContext(InternalDisclosureHeader);\n  if (ctx) {\n    return buttonTrigger;\n  }\n\n  return (\n    <DisclosureHeader>\n      {buttonTrigger}\n    </DisclosureHeader>\n  );\n});\n\nexport interface DisclosurePanelProps extends Omit<RACDisclosurePanelProps, 'className' | 'style' | 'children'>, UnsafeStyles, DOMProps, AriaLabelingProps {\n  children: React.ReactNode\n}\n\nconst panelStyles = style({\n  font: 'body',\n  paddingTop: {\n    isExpanded: 8\n  },\n  paddingBottom: {\n    isExpanded: 16\n  },\n  paddingX: {\n    isExpanded: {\n      size: {\n        S: 8,\n        M: 9,\n        L: 12,\n        XL: 15\n      }\n    }\n  }\n});\n\n/**\n * A disclosure panel is a collapsible section of content that is hidden until the disclosure is expanded.\n */\nexport const DisclosurePanel = forwardRef(function DisclosurePanel(props: DisclosurePanelProps, ref: DOMRef<HTMLDivElement>) {\n  let {\n    UNSAFE_style,\n    UNSAFE_className = '',\n    ...otherProps\n  } = props;\n  const domProps = filterDOMProps(otherProps);\n  let {size} = useSlottedContext(DisclosureContext)!;\n  let {isExpanded} = useContext(DisclosureStateContext)!;\n  let panelRef = useDOMRef(ref);\n  return (\n    <RACDisclosurePanel\n      {...domProps}\n      ref={panelRef}\n      style={UNSAFE_style}\n      className={(UNSAFE_className ?? '') + panelStyles({size, isExpanded})}>\n      {props.children}\n    </RACDisclosurePanel>\n  );\n});\n\n"],"names":[],"version":3,"file":"Disclosure.css.map"}

package/dist/Disclosure.mjs

@@ -6,7 +6,7 @@ import {useSpectrumContextProps as $5ce63c423902f47d$export$764f6146fadd77f7} fr
 import {jsx as $7VHtn$jsx, jsxs as $7VHtn$jsxs} from "react/jsx-runtime";
 import {Provider as $7VHtn$Provider, Disclosure as $7VHtn$Disclosure, useSlottedContext as $7VHtn$useSlottedContext, useLocale as $7VHtn$useLocale, DisclosureStateContext as $7VHtn$DisclosureStateContext, Heading as $7VHtn$Heading, Button as $7VHtn$Button, DisclosurePanel as $7VHtn$DisclosurePanel} from "react-aria-components";
 import {filterDOMProps as $7VHtn$filterDOMProps} from "@react-aria/utils";
-import {createContext as $7VHtn$createContext, useContext as $7VHtn$useContext, forwardRef as $7VHtn$forwardRef} from "react";
+import {createContext as $7VHtn$createContext, forwardRef as $7VHtn$forwardRef, useContext as $7VHtn$useContext} from "react";
 import {useDOMRef as $7VHtn$useDOMRef} from "@react-spectrum/utils";
 
 /*
@@ -51,7 +51,7 @@ const $cf1d656285911959$var$disclosure = function anonymous(props, overrides) {
     if (!$q) rules += ' q___C';
     return rules;
 };
-function $cf1d656285911959$var$Disclosure(props, ref) {
+const $cf1d656285911959$export$74a362b31437ec83 = /*#__PURE__*/ (0, $7VHtn$forwardRef)(function Disclosure(props, ref) {
     [props, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $cf1d656285911959$export$d665dd135a51b28a);
     let { size: size = 'M', density: density = 'regular', isQuiet: isQuiet, UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className = '' } = props;
     let domRef = (0, $7VHtn$useDOMRef)(ref);
@@ -78,10 +78,7 @@ function $cf1d656285911959$var$Disclosure(props, ref) {
             children: props.children
         })
     });
-}
-/**
- * A disclosure is a collapsible section of content. It is composed of a a header with a heading and trigger button, and a panel that contains the content.
- */ let $cf1d656285911959$export$74a362b31437ec83 = /*#__PURE__*/ (0, $7VHtn$forwardRef)($cf1d656285911959$var$Disclosure);
+});
 const $cf1d656285911959$var$headingStyle = " . Aa Ba ya za _9-3t1y _Zd _8-3t1y qo";
 const $cf1d656285911959$var$buttonStyles = function anonymous(props) {
     let rules = " .";
@@ -227,7 +224,7 @@ function $cf1d656285911959$var$DisclosureHeaderWithForwardRef(props, ref) {
     });
 }
 const $cf1d656285911959$export$1e037ddd32f5b8ac = /*#__PURE__*/ (0, $7VHtn$forwardRef)($cf1d656285911959$var$DisclosureHeaderWithForwardRef);
-function $cf1d656285911959$var$DisclosureTitle(props, ref) {
+const $cf1d656285911959$export$7843c6a5b3e340a2 = /*#__PURE__*/ (0, $7VHtn$forwardRef)(function DisclosureTitle(props, ref) {
     let { level: level = 3, UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className = '', ...otherProps } = props;
     let domRef = (0, $7VHtn$useDOMRef)(ref);
     const domProps = (0, $7VHtn$filterDOMProps)(otherProps);
@@ -269,10 +266,7 @@ function $cf1d656285911959$var$DisclosureTitle(props, ref) {
     return /*#__PURE__*/ (0, $7VHtn$jsx)($cf1d656285911959$export$1e037ddd32f5b8ac, {
         children: buttonTrigger
     });
-}
-/**
- * A disclosure title consisting of a heading and a trigger button to expand/collapse the panel.
- */ let $cf1d656285911959$export$7843c6a5b3e340a2 = /*#__PURE__*/ (0, $7VHtn$forwardRef)($cf1d656285911959$var$DisclosureTitle);
+});
 const $cf1d656285911959$var$panelStyles = function anonymous(props) {
     let rules = " .";
     rules += ' _c-bc1l9oh';
@@ -305,7 +299,7 @@ const $cf1d656285911959$var$panelStyles = function anonymous(props) {
     }
     return rules;
 };
-function $cf1d656285911959$var$DisclosurePanel(props, ref) {
+const $cf1d656285911959$export$feabaa331e1d464c = /*#__PURE__*/ (0, $7VHtn$forwardRef)(function DisclosurePanel(props, ref) {
     let { UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className = '', ...otherProps } = props;
     const domProps = (0, $7VHtn$filterDOMProps)(otherProps);
     let { size: size } = (0, $7VHtn$useSlottedContext)($cf1d656285911959$export$d665dd135a51b28a);
@@ -321,10 +315,7 @@ function $cf1d656285911959$var$DisclosurePanel(props, ref) {
         }),
         children: props.children
     });
-}
-/**
- * A disclosure panel is a collapsible section of content that is hidden until the disclosure is expanded.
- */ let $cf1d656285911959$export$feabaa331e1d464c = /*#__PURE__*/ (0, $7VHtn$forwardRef)($cf1d656285911959$var$DisclosurePanel);
+});
 
 
 export {$cf1d656285911959$export$d665dd135a51b28a as DisclosureContext, $cf1d656285911959$export$74a362b31437ec83 as Disclosure, $cf1d656285911959$export$1e037ddd32f5b8ac as DisclosureHeader, $cf1d656285911959$export$7843c6a5b3e340a2 as DisclosureTitle, $cf1d656285911959$export$feabaa331e1d464c as DisclosurePanel};

package/dist/Disclosure.mjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Disclosure.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 {ActionButtonContext} from './ActionButton';\nimport {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue, forwardRefType} from '@react-types/shared';\nimport {Button, ContextValue, DisclosureStateContext, Heading, Provider, Disclosure as RACDisclosure, DisclosurePanel as RACDisclosurePanel, DisclosurePanelProps as RACDisclosurePanelProps, DisclosureProps as RACDisclosureProps, useLocale, useSlottedContext} from 'react-aria-components';\nimport {CenterBaseline} from './CenterBaseline';\nimport {centerPadding, getAllowedOverrides, StyleProps, UnsafeStyles} from './style-utils' with { type: 'macro' };\nimport Chevron from '../ui-icons/Chevron';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {focusRing, lightDark, style} from '../style' with { type: 'macro' };\nimport React, {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface DisclosureProps extends Omit<RACDisclosureProps, 'className' | 'style' | 'children'>, StyleProps {\n  /**\n   * The size of the disclosure.\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL',\n  /**\n   * The amount of space between the disclosures.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /** Whether the disclosure should be displayed with a quiet style. */\n  isQuiet?: boolean,\n  /** The contents of the disclosure, consisting of a DisclosureTitle and DisclosurePanel. */\n  children: ReactNode\n}\n\nexport const DisclosureContext = createContext<ContextValue<Omit<DisclosureProps, 'children'>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst disclosure = style({\n  color: 'heading',\n  borderTopWidth: {\n    default: 1,\n    isQuiet: 0\n  },\n  borderBottomWidth: {\n    default: 1,\n    isQuiet: 0,\n    isInGroup: {\n      default: 0,\n      ':last-child': {\n        default: 1,\n        isQuiet: 0\n      }\n    }\n  },\n  borderStartWidth: 0,\n  borderEndWidth: 0,\n  borderStyle: 'solid',\n  borderColor: 'gray-200',\n  minWidth: 200\n}, getAllowedOverrides());\n\nfunction Disclosure(props: DisclosureProps, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, DisclosureContext);\n  let {\n    size = 'M',\n    density = 'regular',\n    isQuiet,\n    UNSAFE_style,\n    UNSAFE_className = ''\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  let isInGroup = useContext(DisclosureContext) !== null;\n\n  return (\n    <Provider\n      values={[\n        [DisclosureContext, {size, isQuiet, density}]\n      ]}>\n      <RACDisclosure\n        {...props}\n        ref={domRef}\n        style={UNSAFE_style}\n        className={(UNSAFE_className ?? '') + disclosure({isQuiet, isInGroup}, props.styles)}>\n        {props.children}\n      </RACDisclosure>\n    </Provider>\n  );\n}\n\n/**\n * A disclosure is a collapsible section of content. It is composed of a a header with a heading and trigger button, and a panel that contains the content.\n */\nlet _Disclosure = forwardRef(Disclosure);\nexport {_Disclosure as Disclosure};\n\nexport interface DisclosureTitleProps extends UnsafeStyles, DOMProps {\n  /** The heading level of the disclosure header.\n   * \n   * @default 3\n   */\n  level?: number,\n  /** The contents of the disclosure header. */\n  children: React.ReactNode\n}\n\ninterface DisclosureHeaderProps extends UnsafeStyles, DOMProps {\n  children: React.ReactNode\n}\n\nconst headingStyle = style({\n  margin: 0,\n  flexGrow: 1,\n  display: 'flex',\n  flexShrink: 1,\n  minWidth: 0\n});\n\nconst buttonStyles = style({\n  ...focusRing(),\n  outlineOffset: -2,\n  font: 'heading',\n  color: {\n    default: 'neutral',\n    isDisabled: 'disabled'\n  },\n  fontWeight: 'bold',\n  fontSize: {\n    size: {\n      S: 'heading-xs',\n      M: 'heading-sm',\n      L: 'heading',\n      XL: 'heading-lg'\n    }\n  },\n  lineHeight: 'ui',\n  display: 'flex',\n  flexGrow: 1,\n  alignItems: 'baseline',\n  paddingX: '[calc(self(minHeight) * 3/8 - 1px)]',\n  paddingY: centerPadding(),\n  gap: '[calc(self(minHeight) * 3/8 - 1px)]',\n  minHeight: {\n    // compact is equivalent to 'control', but other densities have more padding.\n    size: {\n      S: {\n        density: {\n          compact: 24,\n          regular: 32,\n          spacious: 40\n        }\n      },\n      M: {\n        density: {\n          compact: 32,\n          regular: 40,\n          spacious: 48\n        }\n      },\n      L: {\n        density: {\n          compact: 40,\n          regular: 48,\n          spacious: 56\n        }\n      },\n      XL: {\n        density: {\n          compact: 48,\n          regular: 56,\n          spacious: 64\n        }\n      }\n    }\n  },\n  width: 'full',\n  backgroundColor: {\n    default: 'transparent',\n    isFocusVisible: lightDark('transparent-black-100', 'transparent-white-100'),\n    isHovered: lightDark('transparent-black-100', 'transparent-white-100'),\n    isPressed: lightDark('transparent-black-300', 'transparent-white-300')\n  },\n  transition: 'default',\n  borderWidth: 0,\n  borderRadius: {\n    // Only rounded for keyboard focus and quiet.\n    default: 'none',\n    isFocusVisible: 'control',\n    isQuiet: 'control'\n  },\n  textAlign: 'start',\n  disableTapHighlight: true\n});\n\nconst chevronStyles = style({\n  rotate: {\n    isRTL: 180,\n    isExpanded: 90\n  },\n  transition: 'default',\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  },\n  flexShrink: 0\n});\n\nconst InternalDisclosureHeader = createContext<{} | null>(null);\n\nfunction DisclosureHeaderWithForwardRef(props: DisclosureHeaderProps, ref: DOMRef<HTMLDivElement>) {\n  let {\n    UNSAFE_className,\n    UNSAFE_style,\n    children\n  } = props;\n  let domRef = useDOMRef(ref);\n  let {size, isQuiet, density} = useSlottedContext(DisclosureContext)!;\n\n  let mapSize = {\n    S: 'XS',\n    M: 'S',\n    L: 'M',\n    XL: 'L'\n  };\n\n  // maps to one size smaller in the compact density to ensure there is space between the top and bottom of the action button and container\n  let newSize : 'XS' | 'S' | 'M' | 'L' | 'XL' | undefined = size;\n  if (density === 'compact') {\n    newSize = mapSize[size ?? 'M'] as 'XS' | 'S' | 'M' | 'L';\n  }\n\n  return (\n    <Provider\n      values={[\n        [ActionButtonContext, {size: newSize, isQuiet}],\n        [InternalDisclosureHeader, {}]\n      ]}>\n      <div\n        style={UNSAFE_style}\n        className={(UNSAFE_className ?? '') + style({display: 'flex', alignItems: 'center', gap: 4})}\n        ref={domRef}>\n        {children}\n      </div>\n    </Provider>\n  );\n}\n\n/**\n * A wrapper element for the disclosure title that can contain other elements not part of the trigger.\n */\nexport const DisclosureHeader = /*#__PURE__*/ (forwardRef as forwardRefType)(DisclosureHeaderWithForwardRef);\n\nfunction DisclosureTitle(props: DisclosureTitleProps, ref: DOMRef<HTMLDivElement>) {\n  let {\n    level = 3,\n    UNSAFE_style,\n    UNSAFE_className = '',\n    ...otherProps\n  } = props;\n  let domRef = useDOMRef(ref);\n  const domProps = filterDOMProps(otherProps);\n  let {direction} = useLocale();\n  let {isExpanded} = useContext(DisclosureStateContext)!;\n  let {size, density, isQuiet} = useSlottedContext(DisclosureContext)!;\n  let isRTL = direction === 'rtl';\n\n  let buttonTrigger = (\n    <Heading\n      {...domProps}\n      level={level}\n      ref={domRef}\n      style={UNSAFE_style}\n      className={(UNSAFE_className ?? '') + headingStyle}>\n      <Button className={(renderProps) => buttonStyles({...renderProps, size, density, isQuiet})} slot=\"trigger\">\n        <CenterBaseline>\n          <Chevron size={size} className={chevronStyles({isExpanded, isRTL})} aria-hidden=\"true\" />\n        </CenterBaseline>\n        {props.children}\n      </Button>\n    </Heading>\n  );\n  let ctx = useContext(InternalDisclosureHeader);\n  if (ctx) {\n    return buttonTrigger;\n  }\n\n  return (\n    <DisclosureHeader>\n      {buttonTrigger}\n    </DisclosureHeader>\n  );\n}\n\n/**\n * A disclosure title consisting of a heading and a trigger button to expand/collapse the panel.\n */\nlet _DisclosureTitle = forwardRef(DisclosureTitle);\nexport {_DisclosureTitle as DisclosureTitle};\n\nexport interface DisclosurePanelProps extends Omit<RACDisclosurePanelProps, 'className' | 'style' | 'children'>, UnsafeStyles, DOMProps, AriaLabelingProps {\n  children: React.ReactNode\n}\n\nconst panelStyles = style({\n  font: 'body',\n  paddingTop: {\n    isExpanded: 8\n  },\n  paddingBottom: {\n    isExpanded: 16\n  },\n  paddingX: {\n    isExpanded: {\n      size: {\n        S: 8,\n        M: 9,\n        L: 12,\n        XL: 15\n      }\n    }\n  }\n});\n\nfunction DisclosurePanel(props: DisclosurePanelProps, ref: DOMRef<HTMLDivElement>) {\n  let {\n    UNSAFE_style,\n    UNSAFE_className = '',\n    ...otherProps\n  } = props;\n  const domProps = filterDOMProps(otherProps);\n  let {size} = useSlottedContext(DisclosureContext)!;\n  let {isExpanded} = useContext(DisclosureStateContext)!;\n  let panelRef = useDOMRef(ref);\n  return (\n    <RACDisclosurePanel\n      {...domProps}\n      ref={panelRef}\n      style={UNSAFE_style}\n      className={(UNSAFE_className ?? '') + panelStyles({size, isExpanded})}>\n      {props.children}\n    </RACDisclosurePanel>\n  );\n}\n\n/**\n * A disclosure panel is a collapsible section of content that is hidden until the disclosure is expanded.\n */\nlet _DisclosurePanel = forwardRef(DisclosurePanel);\nexport {_DisclosurePanel as DisclosurePanel};\n\n"],"names":[],"version":3,"file":"Disclosure.mjs.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Disclosure.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 {ActionButtonContext} from './ActionButton';\nimport {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue, forwardRefType} from '@react-types/shared';\nimport {Button, ContextValue, DisclosureStateContext, Heading, Provider, Disclosure as RACDisclosure, DisclosurePanel as RACDisclosurePanel, DisclosurePanelProps as RACDisclosurePanelProps, DisclosureProps as RACDisclosureProps, useLocale, useSlottedContext} from 'react-aria-components';\nimport {CenterBaseline} from './CenterBaseline';\nimport {centerPadding, getAllowedOverrides, StyleProps, UnsafeStyles} from './style-utils' with { type: 'macro' };\nimport Chevron from '../ui-icons/Chevron';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {focusRing, lightDark, style} from '../style' with { type: 'macro' };\nimport React, {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface DisclosureProps extends Omit<RACDisclosureProps, 'className' | 'style' | 'children'>, StyleProps {\n  /**\n   * The size of the disclosure.\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL',\n  /**\n   * The amount of space between the disclosures.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /** Whether the disclosure should be displayed with a quiet style. */\n  isQuiet?: boolean,\n  /** The contents of the disclosure, consisting of a DisclosureTitle and DisclosurePanel. */\n  children: ReactNode\n}\n\nexport const DisclosureContext = createContext<ContextValue<Omit<DisclosureProps, 'children'>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst disclosure = style({\n  color: 'heading',\n  borderTopWidth: {\n    default: 1,\n    isQuiet: 0\n  },\n  borderBottomWidth: {\n    default: 1,\n    isQuiet: 0,\n    isInGroup: {\n      default: 0,\n      ':last-child': {\n        default: 1,\n        isQuiet: 0\n      }\n    }\n  },\n  borderStartWidth: 0,\n  borderEndWidth: 0,\n  borderStyle: 'solid',\n  borderColor: 'gray-200',\n  minWidth: 200\n}, getAllowedOverrides());\n\n/**\n * A disclosure is a collapsible section of content. It is composed of a a header with a heading and trigger button, and a panel that contains the content.\n */\nexport const Disclosure = forwardRef(function Disclosure(props: DisclosureProps, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, DisclosureContext);\n  let {\n    size = 'M',\n    density = 'regular',\n    isQuiet,\n    UNSAFE_style,\n    UNSAFE_className = ''\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  let isInGroup = useContext(DisclosureContext) !== null;\n\n  return (\n    <Provider\n      values={[\n        [DisclosureContext, {size, isQuiet, density}]\n      ]}>\n      <RACDisclosure\n        {...props}\n        ref={domRef}\n        style={UNSAFE_style}\n        className={(UNSAFE_className ?? '') + disclosure({isQuiet, isInGroup}, props.styles)}>\n        {props.children}\n      </RACDisclosure>\n    </Provider>\n  );\n});\n\nexport interface DisclosureTitleProps extends UnsafeStyles, DOMProps {\n  /** The heading level of the disclosure header.\n   * \n   * @default 3\n   */\n  level?: number,\n  /** The contents of the disclosure header. */\n  children: React.ReactNode\n}\n\ninterface DisclosureHeaderProps extends UnsafeStyles, DOMProps {\n  children: React.ReactNode\n}\n\nconst headingStyle = style({\n  margin: 0,\n  flexGrow: 1,\n  display: 'flex',\n  flexShrink: 1,\n  minWidth: 0\n});\n\nconst buttonStyles = style({\n  ...focusRing(),\n  outlineOffset: -2,\n  font: 'heading',\n  color: {\n    default: 'neutral',\n    isDisabled: 'disabled'\n  },\n  fontWeight: 'bold',\n  fontSize: {\n    size: {\n      S: 'heading-xs',\n      M: 'heading-sm',\n      L: 'heading',\n      XL: 'heading-lg'\n    }\n  },\n  lineHeight: 'ui',\n  display: 'flex',\n  flexGrow: 1,\n  alignItems: 'baseline',\n  paddingX: '[calc(self(minHeight) * 3/8 - 1px)]',\n  paddingY: centerPadding(),\n  gap: '[calc(self(minHeight) * 3/8 - 1px)]',\n  minHeight: {\n    // compact is equivalent to 'control', but other densities have more padding.\n    size: {\n      S: {\n        density: {\n          compact: 24,\n          regular: 32,\n          spacious: 40\n        }\n      },\n      M: {\n        density: {\n          compact: 32,\n          regular: 40,\n          spacious: 48\n        }\n      },\n      L: {\n        density: {\n          compact: 40,\n          regular: 48,\n          spacious: 56\n        }\n      },\n      XL: {\n        density: {\n          compact: 48,\n          regular: 56,\n          spacious: 64\n        }\n      }\n    }\n  },\n  width: 'full',\n  backgroundColor: {\n    default: 'transparent',\n    isFocusVisible: lightDark('transparent-black-100', 'transparent-white-100'),\n    isHovered: lightDark('transparent-black-100', 'transparent-white-100'),\n    isPressed: lightDark('transparent-black-300', 'transparent-white-300')\n  },\n  transition: 'default',\n  borderWidth: 0,\n  borderRadius: {\n    // Only rounded for keyboard focus and quiet.\n    default: 'none',\n    isFocusVisible: 'control',\n    isQuiet: 'control'\n  },\n  textAlign: 'start',\n  disableTapHighlight: true\n});\n\nconst chevronStyles = style({\n  rotate: {\n    isRTL: 180,\n    isExpanded: 90\n  },\n  transition: 'default',\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  },\n  flexShrink: 0\n});\n\nconst InternalDisclosureHeader = createContext<{} | null>(null);\n\nfunction DisclosureHeaderWithForwardRef(props: DisclosureHeaderProps, ref: DOMRef<HTMLDivElement>) {\n  let {\n    UNSAFE_className,\n    UNSAFE_style,\n    children\n  } = props;\n  let domRef = useDOMRef(ref);\n  let {size, isQuiet, density} = useSlottedContext(DisclosureContext)!;\n\n  let mapSize = {\n    S: 'XS',\n    M: 'S',\n    L: 'M',\n    XL: 'L'\n  };\n\n  // maps to one size smaller in the compact density to ensure there is space between the top and bottom of the action button and container\n  let newSize : 'XS' | 'S' | 'M' | 'L' | 'XL' | undefined = size;\n  if (density === 'compact') {\n    newSize = mapSize[size ?? 'M'] as 'XS' | 'S' | 'M' | 'L';\n  }\n\n  return (\n    <Provider\n      values={[\n        [ActionButtonContext, {size: newSize, isQuiet}],\n        [InternalDisclosureHeader, {}]\n      ]}>\n      <div\n        style={UNSAFE_style}\n        className={(UNSAFE_className ?? '') + style({display: 'flex', alignItems: 'center', gap: 4})}\n        ref={domRef}>\n        {children}\n      </div>\n    </Provider>\n  );\n}\n\n/**\n * A wrapper element for the disclosure title that can contain other elements not part of the trigger.\n */\nexport const DisclosureHeader = /*#__PURE__*/ (forwardRef as forwardRefType)(DisclosureHeaderWithForwardRef);\n\n/**\n * A disclosure title consisting of a heading and a trigger button to expand/collapse the panel.\n */\nexport const DisclosureTitle = forwardRef(function DisclosureTitle(props: DisclosureTitleProps, ref: DOMRef<HTMLDivElement>) {\n  let {\n    level = 3,\n    UNSAFE_style,\n    UNSAFE_className = '',\n    ...otherProps\n  } = props;\n  let domRef = useDOMRef(ref);\n  const domProps = filterDOMProps(otherProps);\n  let {direction} = useLocale();\n  let {isExpanded} = useContext(DisclosureStateContext)!;\n  let {size, density, isQuiet} = useSlottedContext(DisclosureContext)!;\n  let isRTL = direction === 'rtl';\n\n  let buttonTrigger = (\n    <Heading\n      {...domProps}\n      level={level}\n      ref={domRef}\n      style={UNSAFE_style}\n      className={(UNSAFE_className ?? '') + headingStyle}>\n      <Button className={(renderProps) => buttonStyles({...renderProps, size, density, isQuiet})} slot=\"trigger\">\n        <CenterBaseline>\n          <Chevron size={size} className={chevronStyles({isExpanded, isRTL})} aria-hidden=\"true\" />\n        </CenterBaseline>\n        {props.children}\n      </Button>\n    </Heading>\n  );\n  let ctx = useContext(InternalDisclosureHeader);\n  if (ctx) {\n    return buttonTrigger;\n  }\n\n  return (\n    <DisclosureHeader>\n      {buttonTrigger}\n    </DisclosureHeader>\n  );\n});\n\nexport interface DisclosurePanelProps extends Omit<RACDisclosurePanelProps, 'className' | 'style' | 'children'>, UnsafeStyles, DOMProps, AriaLabelingProps {\n  children: React.ReactNode\n}\n\nconst panelStyles = style({\n  font: 'body',\n  paddingTop: {\n    isExpanded: 8\n  },\n  paddingBottom: {\n    isExpanded: 16\n  },\n  paddingX: {\n    isExpanded: {\n      size: {\n        S: 8,\n        M: 9,\n        L: 12,\n        XL: 15\n      }\n    }\n  }\n});\n\n/**\n * A disclosure panel is a collapsible section of content that is hidden until the disclosure is expanded.\n */\nexport const DisclosurePanel = forwardRef(function DisclosurePanel(props: DisclosurePanelProps, ref: DOMRef<HTMLDivElement>) {\n  let {\n    UNSAFE_style,\n    UNSAFE_className = '',\n    ...otherProps\n  } = props;\n  const domProps = filterDOMProps(otherProps);\n  let {size} = useSlottedContext(DisclosureContext)!;\n  let {isExpanded} = useContext(DisclosureStateContext)!;\n  let panelRef = useDOMRef(ref);\n  return (\n    <RACDisclosurePanel\n      {...domProps}\n      ref={panelRef}\n      style={UNSAFE_style}\n      className={(UNSAFE_className ?? '') + panelStyles({size, isExpanded})}>\n      {props.children}\n    </RACDisclosurePanel>\n  );\n});\n\n"],"names":[],"version":3,"file":"Disclosure.mjs.map"}

package/dist/Divider.cjs

@@ -80,7 +80,7 @@ const $2d04acb918636de0$export$e8c9778bf415dd08 = function anonymous(props, over
     }
     return rules;
 };
-function $2d04acb918636de0$var$Divider(props, ref) {
+const $2d04acb918636de0$export$2e0a83ec2e27ecbb = /*#__PURE__*/ (0, $98jss$react.forwardRef)(function Divider(props, ref) {
     [props, ref] = (0, $ac757a4c2bd72aee$exports.useSpectrumContextProps)(props, ref, $2d04acb918636de0$export$30fbfd376abdf190);
     let domRef = (0, $98jss$reactspectrumutils.useDOMRef)(ref);
     return /*#__PURE__*/ (0, $98jss$reactjsxruntime.jsx)((0, $98jss$reactariacomponents.Separator), {
@@ -93,11 +93,7 @@ function $2d04acb918636de0$var$Divider(props, ref) {
             staticColor: props.staticColor
         }, props.styles)
     });
-}
-/**
- * Dividers bring clarity to a layout by grouping and dividing content in close proximity.
- * They can also be used to establish rhythm and hierarchy.
- */ let $2d04acb918636de0$export$2e0a83ec2e27ecbb = /*#__PURE__*/ (0, $98jss$react.forwardRef)($2d04acb918636de0$var$Divider);
+});
 
 
 //# sourceMappingURL=Divider.cjs.map

package/dist/Divider.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAgCM,MAAM,0DAAiB,CAAA,GAAA,0BAAY,EAA2C;AAE9E,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDb,SAAS,8BAAQ,KAAmB,EAAE,GAAW;IAC/C,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IAEvB,qBACE,gCAAC,CAAA,GAAA,oCAAW;QACT,GAAG,KAAK;QACT,KAAK;QACL,OAAO,MAAM,YAAY;QACzB,WAAW,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,0CAAQ;YAClD,MAAM,MAAM,IAAI,IAAI;YACpB,aAAa,MAAM,WAAW,IAAI;YAClC,aAAa,MAAM,WAAW;QAChC,GAAG,MAAM,MAAM;;AAErB;AAEA;;;CAGC,GACD,IAAI,4CAAW,WAAW,GAAG,CAAA,GAAA,uBAAS,EAAE","sources":["packages/@react-spectrum/s2/src/Divider.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, Separator as RACSeparator, SeparatorProps as RACSeparatorProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n/*\n * Adding as it's own type to deal with size being a part of the theme so we\n * can type style() and it's parameters.\n */\ninterface DividerSpectrumProps {\n  /**\n   * How thick the Divider should be.\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L',\n  /**\n   * How thick the Divider should be.\n   * @default 'horizontal'\n   */\n  orientation?: 'horizontal' | 'vertical',\n  /** The static color style to apply. Useful when the Divider appears over a color background. */\n  staticColor?: 'white' | 'black'\n}\n\n// TODO: allow overriding height (only when orientation is vertical)??\nexport interface DividerProps extends DividerSpectrumProps, Omit<RACSeparatorProps, 'className' | 'style' | 'elementType'>, StyleProps {}\n\nexport const DividerContext = createContext<ContextValue<DividerProps, DOMRefValue>>(null);\n\nexport const divider = style<DividerSpectrumProps>({\n  alignSelf: 'stretch',\n  backgroundColor: {\n    default: 'gray-200',\n    size: {\n      L: 'gray-800'\n    },\n    staticColor: {\n      white: {\n        default: 'transparent-white-200',\n        size: {\n          L: 'transparent-white-800'\n        }\n      },\n      black: {\n        default: 'transparent-black-200',\n        size: {\n          L: 'transparent-black-800'\n        }\n      }\n    },\n    forcedColors: 'ButtonBorder'\n  },\n  borderStyle: 'none',\n  borderRadius: 'full',\n  margin: 0,\n  height: {\n    orientation: {\n      horizontal: {\n        // These should be px not rems, because we're emulating a border.\n        default: '[2px]',\n        size: {\n          S: '[1px]',\n          L: '[4px]'\n        }\n      }\n    }\n  },\n  width: {\n    orientation: {\n      vertical: {\n        default: '[2px]',\n        size: {\n          S: '[1px]',\n          L: '[4px]'\n        }\n      }\n    }\n  }\n}, getAllowedOverrides());\n\nfunction Divider(props: DividerProps, ref: DOMRef) {\n  [props, ref] = useSpectrumContextProps(props, ref, DividerContext);\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACSeparator\n      {...props}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={(props.UNSAFE_className || '') + divider({\n        size: props.size || 'M',\n        orientation: props.orientation || 'horizontal',\n        staticColor: props.staticColor\n      }, props.styles)} />\n  );\n}\n\n/**\n * Dividers bring clarity to a layout by grouping and dividing content in close proximity.\n * They can also be used to establish rhythm and hierarchy.\n */\nlet _Divider = /*#__PURE__*/ forwardRef(Divider);\nexport {_Divider as Divider};\n"],"names":[],"version":3,"file":"Divider.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAgCM,MAAM,0DAAiB,CAAA,GAAA,0BAAY,EAA2C;AAE9E,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuDN,MAAM,4CAAU,WAAW,GAAG,CAAA,GAAA,uBAAS,EAAE,SAAS,QAAQ,KAAmB,EAAE,GAAW;IAC/F,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IAEvB,qBACE,gCAAC,CAAA,GAAA,oCAAW;QACT,GAAG,KAAK;QACT,KAAK;QACL,OAAO,MAAM,YAAY;QACzB,WAAW,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,0CAAQ;YAClD,MAAM,MAAM,IAAI,IAAI;YACpB,aAAa,MAAM,WAAW,IAAI;YAClC,aAAa,MAAM,WAAW;QAChC,GAAG,MAAM,MAAM;;AAErB","sources":["packages/@react-spectrum/s2/src/Divider.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, Separator as RACSeparator, SeparatorProps as RACSeparatorProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n/*\n * Adding as it's own type to deal with size being a part of the theme so we\n * can type style() and it's parameters.\n */\ninterface DividerSpectrumProps {\n  /**\n   * How thick the Divider should be.\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L',\n  /**\n   * How thick the Divider should be.\n   * @default 'horizontal'\n   */\n  orientation?: 'horizontal' | 'vertical',\n  /** The static color style to apply. Useful when the Divider appears over a color background. */\n  staticColor?: 'white' | 'black'\n}\n\n// TODO: allow overriding height (only when orientation is vertical)??\nexport interface DividerProps extends DividerSpectrumProps, Omit<RACSeparatorProps, 'className' | 'style' | 'elementType'>, StyleProps {}\n\nexport const DividerContext = createContext<ContextValue<DividerProps, DOMRefValue>>(null);\n\nexport const divider = style<DividerSpectrumProps>({\n  alignSelf: 'stretch',\n  backgroundColor: {\n    default: 'gray-200',\n    size: {\n      L: 'gray-800'\n    },\n    staticColor: {\n      white: {\n        default: 'transparent-white-200',\n        size: {\n          L: 'transparent-white-800'\n        }\n      },\n      black: {\n        default: 'transparent-black-200',\n        size: {\n          L: 'transparent-black-800'\n        }\n      }\n    },\n    forcedColors: 'ButtonBorder'\n  },\n  borderStyle: 'none',\n  borderRadius: 'full',\n  margin: 0,\n  height: {\n    orientation: {\n      horizontal: {\n        // These should be px not rems, because we're emulating a border.\n        default: '[2px]',\n        size: {\n          S: '[1px]',\n          L: '[4px]'\n        }\n      }\n    }\n  },\n  width: {\n    orientation: {\n      vertical: {\n        default: '[2px]',\n        size: {\n          S: '[1px]',\n          L: '[4px]'\n        }\n      }\n    }\n  }\n}, getAllowedOverrides());\n\n/**\n * Dividers bring clarity to a layout by grouping and dividing content in close proximity.\n * They can also be used to establish rhythm and hierarchy.\n */\nexport const Divider = /*#__PURE__*/ forwardRef(function Divider(props: DividerProps, ref: DOMRef) {\n  [props, ref] = useSpectrumContextProps(props, ref, DividerContext);\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACSeparator\n      {...props}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={(props.UNSAFE_className || '') + divider({\n        size: props.size || 'M',\n        orientation: props.orientation || 'horizontal',\n        staticColor: props.staticColor\n      }, props.styles)} />\n  );\n});\n"],"names":[],"version":3,"file":"Divider.cjs.map"}

package/dist/Divider.css.map

@@ -1 +1 @@
-{"mappings":"AA4CuB;;;;AAAA;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA;;AAAA;EAAA;IAAA","sources":["packages/@react-spectrum/s2/src/Divider.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, Separator as RACSeparator, SeparatorProps as RACSeparatorProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n/*\n * Adding as it's own type to deal with size being a part of the theme so we\n * can type style() and it's parameters.\n */\ninterface DividerSpectrumProps {\n  /**\n   * How thick the Divider should be.\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L',\n  /**\n   * How thick the Divider should be.\n   * @default 'horizontal'\n   */\n  orientation?: 'horizontal' | 'vertical',\n  /** The static color style to apply. Useful when the Divider appears over a color background. */\n  staticColor?: 'white' | 'black'\n}\n\n// TODO: allow overriding height (only when orientation is vertical)??\nexport interface DividerProps extends DividerSpectrumProps, Omit<RACSeparatorProps, 'className' | 'style' | 'elementType'>, StyleProps {}\n\nexport const DividerContext = createContext<ContextValue<DividerProps, DOMRefValue>>(null);\n\nexport const divider = style<DividerSpectrumProps>({\n  alignSelf: 'stretch',\n  backgroundColor: {\n    default: 'gray-200',\n    size: {\n      L: 'gray-800'\n    },\n    staticColor: {\n      white: {\n        default: 'transparent-white-200',\n        size: {\n          L: 'transparent-white-800'\n        }\n      },\n      black: {\n        default: 'transparent-black-200',\n        size: {\n          L: 'transparent-black-800'\n        }\n      }\n    },\n    forcedColors: 'ButtonBorder'\n  },\n  borderStyle: 'none',\n  borderRadius: 'full',\n  margin: 0,\n  height: {\n    orientation: {\n      horizontal: {\n        // These should be px not rems, because we're emulating a border.\n        default: '[2px]',\n        size: {\n          S: '[1px]',\n          L: '[4px]'\n        }\n      }\n    }\n  },\n  width: {\n    orientation: {\n      vertical: {\n        default: '[2px]',\n        size: {\n          S: '[1px]',\n          L: '[4px]'\n        }\n      }\n    }\n  }\n}, getAllowedOverrides());\n\nfunction Divider(props: DividerProps, ref: DOMRef) {\n  [props, ref] = useSpectrumContextProps(props, ref, DividerContext);\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACSeparator\n      {...props}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={(props.UNSAFE_className || '') + divider({\n        size: props.size || 'M',\n        orientation: props.orientation || 'horizontal',\n        staticColor: props.staticColor\n      }, props.styles)} />\n  );\n}\n\n/**\n * Dividers bring clarity to a layout by grouping and dividing content in close proximity.\n * They can also be used to establish rhythm and hierarchy.\n */\nlet _Divider = /*#__PURE__*/ forwardRef(Divider);\nexport {_Divider as Divider};\n"],"names":[],"version":3,"file":"Divider.css.map"}
+{"mappings":"AA4CuB;;;;AAAA;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA;;AAAA;EAAA;IAAA","sources":["packages/@react-spectrum/s2/src/Divider.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, Separator as RACSeparator, SeparatorProps as RACSeparatorProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n/*\n * Adding as it's own type to deal with size being a part of the theme so we\n * can type style() and it's parameters.\n */\ninterface DividerSpectrumProps {\n  /**\n   * How thick the Divider should be.\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L',\n  /**\n   * How thick the Divider should be.\n   * @default 'horizontal'\n   */\n  orientation?: 'horizontal' | 'vertical',\n  /** The static color style to apply. Useful when the Divider appears over a color background. */\n  staticColor?: 'white' | 'black'\n}\n\n// TODO: allow overriding height (only when orientation is vertical)??\nexport interface DividerProps extends DividerSpectrumProps, Omit<RACSeparatorProps, 'className' | 'style' | 'elementType'>, StyleProps {}\n\nexport const DividerContext = createContext<ContextValue<DividerProps, DOMRefValue>>(null);\n\nexport const divider = style<DividerSpectrumProps>({\n  alignSelf: 'stretch',\n  backgroundColor: {\n    default: 'gray-200',\n    size: {\n      L: 'gray-800'\n    },\n    staticColor: {\n      white: {\n        default: 'transparent-white-200',\n        size: {\n          L: 'transparent-white-800'\n        }\n      },\n      black: {\n        default: 'transparent-black-200',\n        size: {\n          L: 'transparent-black-800'\n        }\n      }\n    },\n    forcedColors: 'ButtonBorder'\n  },\n  borderStyle: 'none',\n  borderRadius: 'full',\n  margin: 0,\n  height: {\n    orientation: {\n      horizontal: {\n        // These should be px not rems, because we're emulating a border.\n        default: '[2px]',\n        size: {\n          S: '[1px]',\n          L: '[4px]'\n        }\n      }\n    }\n  },\n  width: {\n    orientation: {\n      vertical: {\n        default: '[2px]',\n        size: {\n          S: '[1px]',\n          L: '[4px]'\n        }\n      }\n    }\n  }\n}, getAllowedOverrides());\n\n/**\n * Dividers bring clarity to a layout by grouping and dividing content in close proximity.\n * They can also be used to establish rhythm and hierarchy.\n */\nexport const Divider = /*#__PURE__*/ forwardRef(function Divider(props: DividerProps, ref: DOMRef) {\n  [props, ref] = useSpectrumContextProps(props, ref, DividerContext);\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACSeparator\n      {...props}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={(props.UNSAFE_className || '') + divider({\n        size: props.size || 'M',\n        orientation: props.orientation || 'horizontal',\n        staticColor: props.staticColor\n      }, props.styles)} />\n  );\n});\n"],"names":[],"version":3,"file":"Divider.css.map"}

package/dist/Divider.mjs

@@ -72,7 +72,7 @@ const $bdf52657dac0f070$export$e8c9778bf415dd08 = function anonymous(props, over
     }
     return rules;
 };
-function $bdf52657dac0f070$var$Divider(props, ref) {
+const $bdf52657dac0f070$export$2e0a83ec2e27ecbb = /*#__PURE__*/ (0, $5nGzy$forwardRef)(function Divider(props, ref) {
     [props, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $bdf52657dac0f070$export$30fbfd376abdf190);
     let domRef = (0, $5nGzy$useDOMRef)(ref);
     return /*#__PURE__*/ (0, $5nGzy$jsx)((0, $5nGzy$Separator), {
@@ -85,11 +85,7 @@ function $bdf52657dac0f070$var$Divider(props, ref) {
             staticColor: props.staticColor
         }, props.styles)
     });
-}
-/**
- * Dividers bring clarity to a layout by grouping and dividing content in close proximity.
- * They can also be used to establish rhythm and hierarchy.
- */ let $bdf52657dac0f070$export$2e0a83ec2e27ecbb = /*#__PURE__*/ (0, $5nGzy$forwardRef)($bdf52657dac0f070$var$Divider);
+});
 
 
 export {$bdf52657dac0f070$export$30fbfd376abdf190 as DividerContext, $bdf52657dac0f070$export$e8c9778bf415dd08 as divider, $bdf52657dac0f070$export$2e0a83ec2e27ecbb as Divider};

package/dist/Divider.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAgCM,MAAM,0DAAiB,CAAA,GAAA,oBAAY,EAA2C;AAE9E,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDb,SAAS,8BAAQ,KAAmB,EAAE,GAAW;IAC/C,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IAEvB,qBACE,gBAAC,CAAA,GAAA,gBAAW;QACT,GAAG,KAAK;QACT,KAAK;QACL,OAAO,MAAM,YAAY;QACzB,WAAW,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,0CAAQ;YAClD,MAAM,MAAM,IAAI,IAAI;YACpB,aAAa,MAAM,WAAW,IAAI;YAClC,aAAa,MAAM,WAAW;QAChC,GAAG,MAAM,MAAM;;AAErB;AAEA;;;CAGC,GACD,IAAI,4CAAW,WAAW,GAAG,CAAA,GAAA,iBAAS,EAAE","sources":["packages/@react-spectrum/s2/src/Divider.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, Separator as RACSeparator, SeparatorProps as RACSeparatorProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n/*\n * Adding as it's own type to deal with size being a part of the theme so we\n * can type style() and it's parameters.\n */\ninterface DividerSpectrumProps {\n  /**\n   * How thick the Divider should be.\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L',\n  /**\n   * How thick the Divider should be.\n   * @default 'horizontal'\n   */\n  orientation?: 'horizontal' | 'vertical',\n  /** The static color style to apply. Useful when the Divider appears over a color background. */\n  staticColor?: 'white' | 'black'\n}\n\n// TODO: allow overriding height (only when orientation is vertical)??\nexport interface DividerProps extends DividerSpectrumProps, Omit<RACSeparatorProps, 'className' | 'style' | 'elementType'>, StyleProps {}\n\nexport const DividerContext = createContext<ContextValue<DividerProps, DOMRefValue>>(null);\n\nexport const divider = style<DividerSpectrumProps>({\n  alignSelf: 'stretch',\n  backgroundColor: {\n    default: 'gray-200',\n    size: {\n      L: 'gray-800'\n    },\n    staticColor: {\n      white: {\n        default: 'transparent-white-200',\n        size: {\n          L: 'transparent-white-800'\n        }\n      },\n      black: {\n        default: 'transparent-black-200',\n        size: {\n          L: 'transparent-black-800'\n        }\n      }\n    },\n    forcedColors: 'ButtonBorder'\n  },\n  borderStyle: 'none',\n  borderRadius: 'full',\n  margin: 0,\n  height: {\n    orientation: {\n      horizontal: {\n        // These should be px not rems, because we're emulating a border.\n        default: '[2px]',\n        size: {\n          S: '[1px]',\n          L: '[4px]'\n        }\n      }\n    }\n  },\n  width: {\n    orientation: {\n      vertical: {\n        default: '[2px]',\n        size: {\n          S: '[1px]',\n          L: '[4px]'\n        }\n      }\n    }\n  }\n}, getAllowedOverrides());\n\nfunction Divider(props: DividerProps, ref: DOMRef) {\n  [props, ref] = useSpectrumContextProps(props, ref, DividerContext);\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACSeparator\n      {...props}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={(props.UNSAFE_className || '') + divider({\n        size: props.size || 'M',\n        orientation: props.orientation || 'horizontal',\n        staticColor: props.staticColor\n      }, props.styles)} />\n  );\n}\n\n/**\n * Dividers bring clarity to a layout by grouping and dividing content in close proximity.\n * They can also be used to establish rhythm and hierarchy.\n */\nlet _Divider = /*#__PURE__*/ forwardRef(Divider);\nexport {_Divider as Divider};\n"],"names":[],"version":3,"file":"Divider.mjs.map"}
+{"mappings":";;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAgCM,MAAM,0DAAiB,CAAA,GAAA,oBAAY,EAA2C;AAE9E,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuDN,MAAM,4CAAU,WAAW,GAAG,CAAA,GAAA,iBAAS,EAAE,SAAS,QAAQ,KAAmB,EAAE,GAAW;IAC/F,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IAEvB,qBACE,gBAAC,CAAA,GAAA,gBAAW;QACT,GAAG,KAAK;QACT,KAAK;QACL,OAAO,MAAM,YAAY;QACzB,WAAW,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,0CAAQ;YAClD,MAAM,MAAM,IAAI,IAAI;YACpB,aAAa,MAAM,WAAW,IAAI;YAClC,aAAa,MAAM,WAAW;QAChC,GAAG,MAAM,MAAM;;AAErB","sources":["packages/@react-spectrum/s2/src/Divider.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, Separator as RACSeparator, SeparatorProps as RACSeparatorProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n/*\n * Adding as it's own type to deal with size being a part of the theme so we\n * can type style() and it's parameters.\n */\ninterface DividerSpectrumProps {\n  /**\n   * How thick the Divider should be.\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L',\n  /**\n   * How thick the Divider should be.\n   * @default 'horizontal'\n   */\n  orientation?: 'horizontal' | 'vertical',\n  /** The static color style to apply. Useful when the Divider appears over a color background. */\n  staticColor?: 'white' | 'black'\n}\n\n// TODO: allow overriding height (only when orientation is vertical)??\nexport interface DividerProps extends DividerSpectrumProps, Omit<RACSeparatorProps, 'className' | 'style' | 'elementType'>, StyleProps {}\n\nexport const DividerContext = createContext<ContextValue<DividerProps, DOMRefValue>>(null);\n\nexport const divider = style<DividerSpectrumProps>({\n  alignSelf: 'stretch',\n  backgroundColor: {\n    default: 'gray-200',\n    size: {\n      L: 'gray-800'\n    },\n    staticColor: {\n      white: {\n        default: 'transparent-white-200',\n        size: {\n          L: 'transparent-white-800'\n        }\n      },\n      black: {\n        default: 'transparent-black-200',\n        size: {\n          L: 'transparent-black-800'\n        }\n      }\n    },\n    forcedColors: 'ButtonBorder'\n  },\n  borderStyle: 'none',\n  borderRadius: 'full',\n  margin: 0,\n  height: {\n    orientation: {\n      horizontal: {\n        // These should be px not rems, because we're emulating a border.\n        default: '[2px]',\n        size: {\n          S: '[1px]',\n          L: '[4px]'\n        }\n      }\n    }\n  },\n  width: {\n    orientation: {\n      vertical: {\n        default: '[2px]',\n        size: {\n          S: '[1px]',\n          L: '[4px]'\n        }\n      }\n    }\n  }\n}, getAllowedOverrides());\n\n/**\n * Dividers bring clarity to a layout by grouping and dividing content in close proximity.\n * They can also be used to establish rhythm and hierarchy.\n */\nexport const Divider = /*#__PURE__*/ forwardRef(function Divider(props: DividerProps, ref: DOMRef) {\n  [props, ref] = useSpectrumContextProps(props, ref, DividerContext);\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACSeparator\n      {...props}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={(props.UNSAFE_className || '') + divider({\n        size: props.size || 'M',\n        orientation: props.orientation || 'horizontal',\n        staticColor: props.staticColor\n      }, props.styles)} />\n  );\n});\n"],"names":[],"version":3,"file":"Divider.mjs.map"}

package/dist/DropZone.cjs

@@ -109,7 +109,7 @@ const $797cda10ca96fc86$var$banner = function anonymous(props) {
     rules += ' -_375tou_o-I';
     return rules;
 };
-function $797cda10ca96fc86$var$DropZone(props, ref) {
+const $797cda10ca96fc86$export$3c6489d84dc98b6 = /*#__PURE__*/ (0, $faaBC$react.forwardRef)(function DropZone(props, ref) {
     let stringFormatter = (0, $faaBC$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($4526404114e78c80$exports))), '@react-spectrum/s2');
     [props, ref] = (0, $ac757a4c2bd72aee$exports.useSpectrumContextProps)(props, ref, $797cda10ca96fc86$export$14a72053295ff9a6);
     let { size: size = 'M' } = props;
@@ -140,10 +140,7 @@ function $797cda10ca96fc86$var$DropZone(props, ref) {
                 ]
             })
     });
-}
-/**
- * A drop zone is an area into which one or multiple objects can be dragged and dropped.
- */ let $797cda10ca96fc86$export$3c6489d84dc98b6 = /*#__PURE__*/ (0, $faaBC$react.forwardRef)($797cda10ca96fc86$var$DropZone);
+});
 
 
 //# sourceMappingURL=DropZone.cjs.map

package/dist/DropZone.cjs.map

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

package/dist/DropZone.css.map

@@ -1 +1 @@
-{"mappings":"AC2CiB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAwBF;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAxBE;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;;AAwBF","sources":["1c1855bb3a6aeea4","packages/@react-spectrum/s2/src/DropZone.tsx"],"sourcesContent":["@import \"ab564bdb126b567b\";\n@import \"d5049ba06c2da1c6\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, DropZoneRenderProps, DropZone as RACDropZone, DropZoneProps as RACDropZoneProps} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {IllustratedMessageContext} from './IllustratedMessage';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface DropZoneProps extends Omit<RACDropZoneProps, 'className' | 'style' | 'children' | 'isDisabled' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, UnsafeStyles, DOMProps {\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight,\n  /** The content to display in the drop zone. */\n  children?: ReactNode,\n  /** Whether the drop zone has been filled. */\n  isFilled?: boolean,\n  /** The message to replace the default banner message that is shown when the drop zone is filled. */\n  replaceMessage?: string,\n  /**\n   * The size of the DropZone.\n   *\n   * @default 'M'\n   */\n    size?: 'S' | 'M' | 'L'\n}\n\nexport const DropZoneContext = createContext<ContextValue<DropZoneProps, DOMRefValue<HTMLDivElement>>>(null);\n\nconst dropzone = style<DropZoneRenderProps>({\n  display: 'flex',\n  justifyContent: 'center',\n  alignItems: 'center',\n  position: 'relative',\n  fontFamily: 'sans',\n  color: 'gray-900',\n  borderStyle: {\n    default: 'dashed',\n    isDropTarget: 'solid'\n  },\n  backgroundColor: {\n    isDropTarget: 'blue-200'\n  },\n  borderWidth: 2,\n  borderColor: {\n    default: 'gray-300',\n    isDropTarget: 'blue-800',\n    isFocusVisible: 'blue-800'\n  },\n  borderRadius: 'lg',\n  padding: 24\n}, getAllowedOverrides({height: true}));\n\nconst banner = style({\n  position: 'absolute',\n  left: 0,\n  right: 0,\n  marginX: 'auto',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  minHeight: 20,\n  width: 'fit',\n  maxWidth: {\n    default: 192,\n    size: {\n      S: 160,\n      L: 208\n    }\n  },\n  backgroundColor: 'accent',\n  borderRadius: 'default',\n  color: 'white',\n  fontWeight: 'bold',\n  padding: '[calc((self(minHeight))/1.5)]'\n});\n\nfunction DropZone(props: DropZoneProps, ref: DOMRef<HTMLDivElement>) {\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  [props, ref] = useSpectrumContextProps(props, ref, DropZoneContext);\n  let {\n    size = 'M'\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACDropZone\n      {...props}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={renderProps => (props.UNSAFE_className || '') + dropzone(renderProps, props.styles)}>\n      {renderProps => (\n        <>\n          <IllustratedMessageContext.Provider value={{isInDropZone: true, isDropTarget: renderProps.isDropTarget, size}}>\n            {props.children}\n          </IllustratedMessageContext.Provider>\n          {(renderProps.isDropTarget && props.isFilled) &&\n            <div className={banner({size})}>\n              <span>\n                {props.replaceMessage ? props.replaceMessage : stringFormatter.format('dropzone.replaceMessage')}\n              </span>\n            </div>\n          }\n        </>\n      )}\n    </RACDropZone>\n  );\n}\n\n/**\n * A drop zone is an area into which one or multiple objects can be dragged and dropped.\n */\nlet _DropZone = /*#__PURE__*/ forwardRef(DropZone);\nexport {_DropZone as DropZone};\n"],"names":[],"version":3,"file":"DropZone.css.map"}
+{"mappings":"AC2CiB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAwBF;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAxBE;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;;AAwBF","sources":["1c1855bb3a6aeea4","packages/@react-spectrum/s2/src/DropZone.tsx"],"sourcesContent":["@import \"ab564bdb126b567b\";\n@import \"d5049ba06c2da1c6\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, DropZoneRenderProps, DropZone as RACDropZone, DropZoneProps as RACDropZoneProps} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {IllustratedMessageContext} from './IllustratedMessage';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface DropZoneProps extends Omit<RACDropZoneProps, 'className' | 'style' | 'children' | 'isDisabled' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, UnsafeStyles, DOMProps {\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight,\n  /** The content to display in the drop zone. */\n  children?: ReactNode,\n  /** Whether the drop zone has been filled. */\n  isFilled?: boolean,\n  /** The message to replace the default banner message that is shown when the drop zone is filled. */\n  replaceMessage?: string,\n  /**\n   * The size of the DropZone.\n   *\n   * @default 'M'\n   */\n    size?: 'S' | 'M' | 'L'\n}\n\nexport const DropZoneContext = createContext<ContextValue<DropZoneProps, DOMRefValue<HTMLDivElement>>>(null);\n\nconst dropzone = style<DropZoneRenderProps>({\n  display: 'flex',\n  justifyContent: 'center',\n  alignItems: 'center',\n  position: 'relative',\n  fontFamily: 'sans',\n  color: 'gray-900',\n  borderStyle: {\n    default: 'dashed',\n    isDropTarget: 'solid'\n  },\n  backgroundColor: {\n    isDropTarget: 'blue-200'\n  },\n  borderWidth: 2,\n  borderColor: {\n    default: 'gray-300',\n    isDropTarget: 'blue-800',\n    isFocusVisible: 'blue-800'\n  },\n  borderRadius: 'lg',\n  padding: 24\n}, getAllowedOverrides({height: true}));\n\nconst banner = style({\n  position: 'absolute',\n  left: 0,\n  right: 0,\n  marginX: 'auto',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  minHeight: 20,\n  width: 'fit',\n  maxWidth: {\n    default: 192,\n    size: {\n      S: 160,\n      L: 208\n    }\n  },\n  backgroundColor: 'accent',\n  borderRadius: 'default',\n  color: 'white',\n  fontWeight: 'bold',\n  padding: '[calc((self(minHeight))/1.5)]'\n});\n\n/**\n * A drop zone is an area into which one or multiple objects can be dragged and dropped.\n */\nexport const DropZone = /*#__PURE__*/ forwardRef(function DropZone(props: DropZoneProps, ref: DOMRef<HTMLDivElement>) {\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  [props, ref] = useSpectrumContextProps(props, ref, DropZoneContext);\n  let {\n    size = 'M'\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <RACDropZone\n      {...props}\n      ref={domRef}\n      style={props.UNSAFE_style}\n      className={renderProps => (props.UNSAFE_className || '') + dropzone(renderProps, props.styles)}>\n      {renderProps => (\n        <>\n          <IllustratedMessageContext.Provider value={{isInDropZone: true, isDropTarget: renderProps.isDropTarget, size}}>\n            {props.children}\n          </IllustratedMessageContext.Provider>\n          {(renderProps.isDropTarget && props.isFilled) &&\n            <div className={banner({size})}>\n              <span>\n                {props.replaceMessage ? props.replaceMessage : stringFormatter.format('dropzone.replaceMessage')}\n              </span>\n            </div>\n          }\n        </>\n      )}\n    </RACDropZone>\n  );\n});\n"],"names":[],"version":3,"file":"DropZone.css.map"}

package/dist/DropZone.mjs

@@ -102,7 +102,7 @@ const $fb6e45fba2483f65$var$banner = function anonymous(props) {
     rules += ' -_375tou_o-I';
     return rules;
 };
-function $fb6e45fba2483f65$var$DropZone(props, ref) {
+const $fb6e45fba2483f65$export$3c6489d84dc98b6 = /*#__PURE__*/ (0, $4h9kk$forwardRef)(function DropZone(props, ref) {
     let stringFormatter = (0, $4h9kk$useLocalizedStringFormatter)((0, ($parcel$interopDefault($4h9kk$intlStringsmjs))), '@react-spectrum/s2');
     [props, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $fb6e45fba2483f65$export$14a72053295ff9a6);
     let { size: size = 'M' } = props;
@@ -133,10 +133,7 @@ function $fb6e45fba2483f65$var$DropZone(props, ref) {
                 ]
             })
     });
-}
-/**
- * A drop zone is an area into which one or multiple objects can be dragged and dropped.
- */ let $fb6e45fba2483f65$export$3c6489d84dc98b6 = /*#__PURE__*/ (0, $4h9kk$forwardRef)($fb6e45fba2483f65$var$DropZone);
+});
 
 
 export {$fb6e45fba2483f65$export$14a72053295ff9a6 as DropZoneContext, $fb6e45fba2483f65$export$3c6489d84dc98b6 as DropZone};

package/dist/DropZone.mjs.map

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

package/dist/Field.cjs

@@ -50,7 +50,7 @@ $parcel$export(module.exports, "FieldErrorIcon", () => $a0b996a550bb0891$export$
 
 
 
-function $a0b996a550bb0891$var$FieldLabel(props, ref) {
+const $a0b996a550bb0891$export$1acdcf5a973a8414 = /*#__PURE__*/ (0, $4hgIp$react.forwardRef)(function FieldLabel(props, ref) {
     let stringFormatter = (0, $4hgIp$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($4526404114e78c80$exports))), '@react-spectrum/s2');
     let { isDisabled: isDisabled, isRequired: isRequired, size: size = 'M', necessityIndicator: necessityIndicator = 'icon', includeNecessityIndicatorInAccessibilityName: includeNecessityIndicatorInAccessibilityName = false, labelAlign: labelAlign, labelPosition: labelPosition, staticColor: staticColor, contextualHelp: contextualHelp, isQuiet: isQuiet, UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className = '', ...labelProps } = props;
     let domRef = (0, $4hgIp$reactspectrumutils.useDOMRef)(ref);
@@ -164,8 +164,7 @@ function $a0b996a550bb0891$var$FieldLabel(props, ref) {
             })
         ]
     });
-}
-let $a0b996a550bb0891$export$1acdcf5a973a8414 = /*#__PURE__*/ (0, $4hgIp$react.forwardRef)($a0b996a550bb0891$var$FieldLabel);
+});
 const $a0b996a550bb0891$var$fieldGroupStyles = function anonymous(props) {
     let rules = " .";
     if (props.isFocusVisible) rules += ' _Lb';
@@ -274,7 +273,7 @@ const $a0b996a550bb0891$var$fieldGroupStyles = function anonymous(props) {
     else rules += ' -_375toq_k-f';
     return rules;
 };
-function $a0b996a550bb0891$var$FieldGroup(props, ref) {
+const $a0b996a550bb0891$export$f0fe469072bc6950 = /*#__PURE__*/ (0, $4hgIp$react.forwardRef)(function FieldGroup(props, ref) {
     return /*#__PURE__*/ (0, $4hgIp$reactjsxruntime.jsx)((0, $4hgIp$reactariacomponents.Group), {
         ref: ref,
         ...props,
@@ -297,9 +296,8 @@ function $a0b996a550bb0891$var$FieldGroup(props, ref) {
                 size: props.size || 'M'
             }), props.styles)
     });
-}
-let $a0b996a550bb0891$export$f0fe469072bc6950 = /*#__PURE__*/ (0, $4hgIp$react.forwardRef)($a0b996a550bb0891$var$FieldGroup);
-function $a0b996a550bb0891$var$Input(props, ref) {
+});
+const $a0b996a550bb0891$export$f5b8910cec6cf069 = /*#__PURE__*/ (0, $4hgIp$react.forwardRef)(function Input(props, ref) {
     let { UNSAFE_className: UNSAFE_className = '', UNSAFE_style: UNSAFE_style, styles: styles, ...otherProps } = props;
     return /*#__PURE__*/ (0, $4hgIp$reactjsxruntime.jsx)((0, $4hgIp$reactariacomponents.Input), {
         ...otherProps,
@@ -307,8 +305,7 @@ function $a0b996a550bb0891$var$Input(props, ref) {
         style: UNSAFE_style,
         className: UNSAFE_className + (0, $308b180f49d82d28$exports.mergeStyles)(" . Ea Fa Ca Da ba a-17zqamw _c-17zqamw _d-17zqamw _e-17zqamw _9-3t1y _8-3t1y qo lb _La wf __vb __wb _ma _pb", styles)
     });
-}
-let $a0b996a550bb0891$export$f5b8910cec6cf069 = /*#__PURE__*/ (0, $4hgIp$react.forwardRef)($a0b996a550bb0891$var$Input);
+});
 const $a0b996a550bb0891$var$helpTextStyles = function anonymous(props) {
     let rules = " .";
     rules += ' __a-1oa8qr7';

package/dist/Field.cjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Field.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 AlertIcon from '../s2wf-icons/S2_Icon_AlertTriangle_20_N.svg';\nimport {Alignment, DOMRef, NecessityIndicator} from '@react-types/shared';\nimport AsteriskIcon from '../ui-icons/Asterisk';\nimport {baseColor, focusRing, fontRelative, style} from '../style' with {type: 'macro'};\nimport {CenterBaseline, centerBaseline, centerBaselineBefore} from './CenterBaseline';\nimport {composeRenderProps, FieldError, FieldErrorProps, Group, GroupProps, Label, LabelProps, Provider, Input as RACInput, InputProps as RACInputProps, Text} from 'react-aria-components';\nimport {ContextualHelpContext} from './ContextualHelp';\nimport {fieldInput, fieldLabel, StyleProps, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {ForwardedRef, forwardRef, ReactNode} from 'react';\nimport {IconContext} from './Icon';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {mergeStyles} from '../style/runtime';\nimport {StyleString} from '../style/types';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useId} from '@react-aria/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\n\ninterface FieldLabelProps extends Omit<LabelProps, 'className' | 'style' | 'children'>, StyleProps {\n  isDisabled?: boolean,\n  isRequired?: boolean,\n  size?: 'S' | 'M' | 'L' | 'XL',\n  necessityIndicator?: NecessityIndicator,\n  labelAlign?: Alignment,\n  labelPosition?: 'top' | 'side',\n  includeNecessityIndicatorInAccessibilityName?: boolean,\n  staticColor?: 'white' | 'black',\n  contextualHelp?: ReactNode,\n  isQuiet?: boolean,\n  children?: ReactNode\n}\n\nfunction FieldLabel(props: FieldLabelProps, ref: DOMRef<HTMLLabelElement>) {\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  let {\n    isDisabled,\n    isRequired,\n    size = 'M',\n    necessityIndicator = 'icon',\n    includeNecessityIndicatorInAccessibilityName = false,\n    labelAlign,\n    labelPosition,\n    staticColor,\n    contextualHelp,\n    isQuiet,\n    UNSAFE_style,\n    UNSAFE_className = '',\n    ...labelProps\n  } = props;\n\n  let domRef = useDOMRef(ref);\n  let contextualHelpId = useId();\n  let fallbackLabelPropsId = useId();\n  if (contextualHelp && !labelProps.id) {\n    labelProps.id = fallbackLabelPropsId;\n  }\n\n  if (!props.children) {\n    return null;\n  }\n\n  return (\n    <div\n      className={style({\n        gridArea: 'label',\n        display: 'inline',\n        textAlign: {\n          labelAlign: {\n            start: 'start',\n            end: 'end'\n          }\n        },\n        paddingBottom: {\n          labelPosition: {\n            top: '--field-gap'\n          }\n        },\n        contain: {\n          labelPosition: {\n            top: 'inline-size'\n          },\n          isQuiet: 'none'\n        }\n      })({labelAlign, labelPosition, isQuiet})}>\n      <Label\n        {...labelProps}\n        ref={domRef}\n        style={UNSAFE_style}\n        className={UNSAFE_className + mergeStyles(style(fieldLabel())({labelPosition, isDisabled, size, staticColor}), props.styles)}>\n        {props.children}\n        {(isRequired || necessityIndicator === 'label') && (\n          <span className={style({whiteSpace: 'nowrap'})}>\n            &nbsp;\n            {necessityIndicator === 'icon' &&\n              <AsteriskIcon\n                size={size === 'S' ? 'M' : size}\n                className={style({\n                  '--iconPrimary': {\n                    type: 'fill',\n                    value: 'currentColor'\n                  }\n                })}\n                aria-label={includeNecessityIndicatorInAccessibilityName ? stringFormatter.format('label.(required)') : undefined} />\n            }\n            {necessityIndicator === 'label' &&\n              /* The necessity label is hidden to screen readers if the field is required because\n              * aria-required is set on the field in that case. That will already be announced,\n              * so no need to duplicate it here. If optional, we do want it to be announced here.\n              */\n              <span aria-hidden={!includeNecessityIndicatorInAccessibilityName ? isRequired : undefined}>\n                {isRequired ? stringFormatter.format('label.(required)') : stringFormatter.format('label.(optional)')}\n              </span>\n            }\n          </span>\n        )}\n      </Label>\n      {contextualHelp && (\n        <CenterBaseline\n          styles={style({\n            display: 'inline-flex',\n            height: 0,\n            marginStart: 4\n          })}>\n          <ContextualHelpContext.Provider\n            value={{\n              id: contextualHelpId,\n              'aria-labelledby': labelProps?.id ? `${labelProps.id} ${contextualHelpId}` : undefined,\n              size: (size === 'L' || size === 'XL') ? 'S' : 'XS'\n            }}>\n            {contextualHelp}\n          </ContextualHelpContext.Provider>\n        </CenterBaseline>\n      )}\n    </div>\n  );\n}\n\nlet _FieldLabel = forwardRef(FieldLabel);\nexport {_FieldLabel as FieldLabel};\n\ninterface FieldGroupProps extends Omit<GroupProps, 'className' | 'style' | 'children'>, UnsafeStyles {\n  size?: 'S' | 'M' | 'L' | 'XL',\n  children?: ReactNode,\n  styles?: StyleString\n}\n\nconst fieldGroupStyles = style({\n  ...focusRing(),\n  ...fieldInput(),\n  display: 'flex',\n  alignItems: 'center',\n  height: 'control',\n  boxSizing: 'border-box',\n  paddingX: 'edge-to-text',\n  font: 'control',\n  borderRadius: 'control',\n  borderWidth: 2,\n  borderStyle: 'solid',\n  transition: 'default',\n  borderColor: {\n    default: baseColor('gray-300'),\n    isInvalid: 'negative',\n    isFocusWithin: {\n      default: 'gray-900',\n      isInvalid: 'negative-1000',\n      forcedColors: 'Highlight'\n    },\n    isDisabled: {\n      default: 'disabled',\n      forcedColors: 'GrayText'\n    }\n  },\n  backgroundColor: 'gray-25',\n  color: {\n    default: 'neutral',\n    isDisabled: 'disabled'\n  },\n  cursor: {\n    default: 'text',\n    isDisabled: 'default'\n  }\n});\n\nfunction FieldGroup(props: FieldGroupProps, ref: ForwardedRef<HTMLDivElement>) {\n  return (\n    <Group\n      ref={ref}\n      {...props}\n      onPointerDown={(e) => {\n        // Forward focus to input element when clicking on a non-interactive child (e.g. icon or padding)\n        if (e.pointerType === 'mouse' && !(e.target as Element).closest('button,input,textarea')) {\n          e.preventDefault();\n          e.currentTarget.querySelector('input')?.focus();\n        }\n      }}\n      onPointerUp={e => {\n        if (e.pointerType !== 'mouse' && !(e.target as Element).closest('button,input,textarea')) {\n          e.preventDefault();\n          e.currentTarget.querySelector('input')?.focus();\n        }\n      }}\n      style={props.UNSAFE_style}\n      className={renderProps => (props.UNSAFE_className || '') + ' ' + centerBaselineBefore + mergeStyles(\n        fieldGroupStyles({...renderProps, size: props.size || 'M'}),\n        props.styles\n      )} />\n  );\n}\n\nlet _FieldGroup = forwardRef(FieldGroup);\nexport {_FieldGroup as FieldGroup};\n\nexport interface InputProps extends Omit<RACInputProps, 'className' | 'style'>, StyleProps {}\n\nfunction Input(props: InputProps, ref: ForwardedRef<HTMLInputElement>) {\n  let {UNSAFE_className = '', UNSAFE_style, styles, ...otherProps} = props;\n  return (\n    <RACInput\n      {...otherProps}\n      ref={ref}\n      style={UNSAFE_style}\n      className={UNSAFE_className + mergeStyles(style({\n        padding: 0,\n        backgroundColor: 'transparent',\n        color: '[inherit]',\n        fontFamily: '[inherit]',\n        fontSize: '[inherit]',\n        fontWeight: '[inherit]',\n        flexGrow: 1,\n        flexShrink: 1,\n        minWidth: 0,\n        width: 'full',\n        outlineStyle: 'none',\n        borderStyle: 'none',\n        truncate: true\n      }), styles)} />\n  );\n}\n\nlet _Input = forwardRef(Input);\nexport {_Input as Input};\n\ninterface HelpTextProps extends FieldErrorProps {\n  size?: 'S' | 'M' | 'L' | 'XL',\n  isDisabled?: boolean,\n  isInvalid?: boolean, // TODO: export FieldErrorContext from RAC to get this.\n  description?: ReactNode,\n  showErrorIcon?: boolean\n}\n\nconst helpTextStyles = style({\n  gridArea: 'helptext',\n  display: 'flex',\n  alignItems: 'baseline',\n  gap: 'text-to-visual',\n  font: 'control',\n  color: {\n    default: 'neutral-subdued',\n    isInvalid: 'negative',\n    isDisabled: 'disabled'\n  },\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  },\n  contain: 'inline-size',\n  paddingTop: '--field-gap',\n  cursor: {\n    default: 'text',\n    isDisabled: 'default'\n  }\n});\n\nexport function HelpText(props: HelpTextProps & {descriptionRef?: DOMRef<HTMLDivElement>, errorRef?: DOMRef<HTMLDivElement>}) {\n  let domDescriptionRef = useDOMRef(props.descriptionRef || null);\n  let domErrorRef = useDOMRef(props.errorRef || null);\n\n  if (!props.isInvalid && props.description) {\n    return (\n      <Text\n        slot=\"description\"\n        ref={domDescriptionRef}\n        className={helpTextStyles({size: props.size || 'M', isDisabled: props.isDisabled})}>\n        {props.description}\n      </Text>\n    );\n  }\n\n  return (\n    <FieldError\n      {...props}\n      ref={domErrorRef}\n      className={renderProps => helpTextStyles({...renderProps, size: props.size || 'M', isDisabled: props.isDisabled})}>\n      {composeRenderProps(props.children, (children, {validationErrors}) => (<>\n        {props.showErrorIcon &&\n          <CenterBaseline>\n            <AlertIcon />\n          </CenterBaseline>\n        }\n        <span>{children || validationErrors.join(' ')}</span>\n      </>))}\n    </FieldError>\n  );\n}\n\nexport function FieldErrorIcon(props: {isDisabled?: boolean}) {\n  return (\n    <Provider\n      values={[\n        [IconContext, {\n          render: centerBaseline({\n            slot: 'icon',\n            styles: style({\n              order: 0,\n              flexShrink: 0,\n              '--iconPrimary': {\n                type: 'fill',\n                value: {\n                  default: 'negative',\n                  forcedColors: 'ButtonText'\n                }\n              }\n            })}),\n          styles: style({\n            size: fontRelative(20),\n            marginStart: 'text-to-visual',\n            marginEnd: fontRelative(-2),\n            flexShrink: 0\n          })\n        }]\n      ]}>\n      {!props.isDisabled && <AlertIcon />}\n    </Provider>\n  );\n}\n"],"names":[],"version":3,"file":"Field.cjs.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Field.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 AlertIcon from '../s2wf-icons/S2_Icon_AlertTriangle_20_N.svg';\nimport {Alignment, DOMRef, NecessityIndicator} from '@react-types/shared';\nimport AsteriskIcon from '../ui-icons/Asterisk';\nimport {baseColor, focusRing, fontRelative, style} from '../style' with {type: 'macro'};\nimport {CenterBaseline, centerBaseline, centerBaselineBefore} from './CenterBaseline';\nimport {composeRenderProps, FieldError, FieldErrorProps, Group, GroupProps, Label, LabelProps, Provider, Input as RACInput, InputProps as RACInputProps, Text} from 'react-aria-components';\nimport {ContextualHelpContext} from './ContextualHelp';\nimport {fieldInput, fieldLabel, StyleProps, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {ForwardedRef, forwardRef, ReactNode} from 'react';\nimport {IconContext} from './Icon';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {mergeStyles} from '../style/runtime';\nimport {StyleString} from '../style/types';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useId} from '@react-aria/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\n\ninterface FieldLabelProps extends Omit<LabelProps, 'className' | 'style' | 'children'>, StyleProps {\n  isDisabled?: boolean,\n  isRequired?: boolean,\n  size?: 'S' | 'M' | 'L' | 'XL',\n  necessityIndicator?: NecessityIndicator,\n  labelAlign?: Alignment,\n  labelPosition?: 'top' | 'side',\n  includeNecessityIndicatorInAccessibilityName?: boolean,\n  staticColor?: 'white' | 'black',\n  contextualHelp?: ReactNode,\n  isQuiet?: boolean,\n  children?: ReactNode\n}\n\nexport const FieldLabel = forwardRef(function FieldLabel(props: FieldLabelProps, ref: DOMRef<HTMLLabelElement>) {\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  let {\n    isDisabled,\n    isRequired,\n    size = 'M',\n    necessityIndicator = 'icon',\n    includeNecessityIndicatorInAccessibilityName = false,\n    labelAlign,\n    labelPosition,\n    staticColor,\n    contextualHelp,\n    isQuiet,\n    UNSAFE_style,\n    UNSAFE_className = '',\n    ...labelProps\n  } = props;\n\n  let domRef = useDOMRef(ref);\n  let contextualHelpId = useId();\n  let fallbackLabelPropsId = useId();\n  if (contextualHelp && !labelProps.id) {\n    labelProps.id = fallbackLabelPropsId;\n  }\n\n  if (!props.children) {\n    return null;\n  }\n\n  return (\n    <div\n      className={style({\n        gridArea: 'label',\n        display: 'inline',\n        textAlign: {\n          labelAlign: {\n            start: 'start',\n            end: 'end'\n          }\n        },\n        paddingBottom: {\n          labelPosition: {\n            top: '--field-gap'\n          }\n        },\n        contain: {\n          labelPosition: {\n            top: 'inline-size'\n          },\n          isQuiet: 'none'\n        }\n      })({labelAlign, labelPosition, isQuiet})}>\n      <Label\n        {...labelProps}\n        ref={domRef}\n        style={UNSAFE_style}\n        className={UNSAFE_className + mergeStyles(style(fieldLabel())({labelPosition, isDisabled, size, staticColor}), props.styles)}>\n        {props.children}\n        {(isRequired || necessityIndicator === 'label') && (\n          <span className={style({whiteSpace: 'nowrap'})}>\n            &nbsp;\n            {necessityIndicator === 'icon' &&\n              <AsteriskIcon\n                size={size === 'S' ? 'M' : size}\n                className={style({\n                  '--iconPrimary': {\n                    type: 'fill',\n                    value: 'currentColor'\n                  }\n                })}\n                aria-label={includeNecessityIndicatorInAccessibilityName ? stringFormatter.format('label.(required)') : undefined} />\n            }\n            {necessityIndicator === 'label' &&\n              /* The necessity label is hidden to screen readers if the field is required because\n              * aria-required is set on the field in that case. That will already be announced,\n              * so no need to duplicate it here. If optional, we do want it to be announced here.\n              */\n              <span aria-hidden={!includeNecessityIndicatorInAccessibilityName ? isRequired : undefined}>\n                {isRequired ? stringFormatter.format('label.(required)') : stringFormatter.format('label.(optional)')}\n              </span>\n            }\n          </span>\n        )}\n      </Label>\n      {contextualHelp && (\n        <CenterBaseline\n          styles={style({\n            display: 'inline-flex',\n            height: 0,\n            marginStart: 4\n          })}>\n          <ContextualHelpContext.Provider\n            value={{\n              id: contextualHelpId,\n              'aria-labelledby': labelProps?.id ? `${labelProps.id} ${contextualHelpId}` : undefined,\n              size: (size === 'L' || size === 'XL') ? 'S' : 'XS'\n            }}>\n            {contextualHelp}\n          </ContextualHelpContext.Provider>\n        </CenterBaseline>\n      )}\n    </div>\n  );\n});\n\ninterface FieldGroupProps extends Omit<GroupProps, 'className' | 'style' | 'children'>, UnsafeStyles {\n  size?: 'S' | 'M' | 'L' | 'XL',\n  children?: ReactNode,\n  styles?: StyleString\n}\n\nconst fieldGroupStyles = style({\n  ...focusRing(),\n  ...fieldInput(),\n  display: 'flex',\n  alignItems: 'center',\n  height: 'control',\n  boxSizing: 'border-box',\n  paddingX: 'edge-to-text',\n  font: 'control',\n  borderRadius: 'control',\n  borderWidth: 2,\n  borderStyle: 'solid',\n  transition: 'default',\n  borderColor: {\n    default: baseColor('gray-300'),\n    isInvalid: 'negative',\n    isFocusWithin: {\n      default: 'gray-900',\n      isInvalid: 'negative-1000',\n      forcedColors: 'Highlight'\n    },\n    isDisabled: {\n      default: 'disabled',\n      forcedColors: 'GrayText'\n    }\n  },\n  backgroundColor: 'gray-25',\n  color: {\n    default: 'neutral',\n    isDisabled: 'disabled'\n  },\n  cursor: {\n    default: 'text',\n    isDisabled: 'default'\n  }\n});\n\nexport const FieldGroup = forwardRef(function FieldGroup(props: FieldGroupProps, ref: ForwardedRef<HTMLDivElement>) {\n  return (\n    <Group\n      ref={ref}\n      {...props}\n      onPointerDown={(e) => {\n        // Forward focus to input element when clicking on a non-interactive child (e.g. icon or padding)\n        if (e.pointerType === 'mouse' && !(e.target as Element).closest('button,input,textarea')) {\n          e.preventDefault();\n          e.currentTarget.querySelector('input')?.focus();\n        }\n      }}\n      onPointerUp={e => {\n        if (e.pointerType !== 'mouse' && !(e.target as Element).closest('button,input,textarea')) {\n          e.preventDefault();\n          e.currentTarget.querySelector('input')?.focus();\n        }\n      }}\n      style={props.UNSAFE_style}\n      className={renderProps => (props.UNSAFE_className || '') + ' ' + centerBaselineBefore + mergeStyles(\n        fieldGroupStyles({...renderProps, size: props.size || 'M'}),\n        props.styles\n      )} />\n  );\n});\n\nexport interface InputProps extends Omit<RACInputProps, 'className' | 'style'>, StyleProps {}\n\nexport const Input = forwardRef(function Input(props: InputProps, ref: ForwardedRef<HTMLInputElement>) {\n  let {UNSAFE_className = '', UNSAFE_style, styles, ...otherProps} = props;\n  return (\n    <RACInput\n      {...otherProps}\n      ref={ref}\n      style={UNSAFE_style}\n      className={UNSAFE_className + mergeStyles(style({\n        padding: 0,\n        backgroundColor: 'transparent',\n        color: '[inherit]',\n        fontFamily: '[inherit]',\n        fontSize: '[inherit]',\n        fontWeight: '[inherit]',\n        flexGrow: 1,\n        flexShrink: 1,\n        minWidth: 0,\n        width: 'full',\n        outlineStyle: 'none',\n        borderStyle: 'none',\n        truncate: true\n      }), styles)} />\n  );\n});\n\ninterface HelpTextProps extends FieldErrorProps {\n  size?: 'S' | 'M' | 'L' | 'XL',\n  isDisabled?: boolean,\n  isInvalid?: boolean, // TODO: export FieldErrorContext from RAC to get this.\n  description?: ReactNode,\n  showErrorIcon?: boolean\n}\n\nconst helpTextStyles = style({\n  gridArea: 'helptext',\n  display: 'flex',\n  alignItems: 'baseline',\n  gap: 'text-to-visual',\n  font: 'control',\n  color: {\n    default: 'neutral-subdued',\n    isInvalid: 'negative',\n    isDisabled: 'disabled'\n  },\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  },\n  contain: 'inline-size',\n  paddingTop: '--field-gap',\n  cursor: {\n    default: 'text',\n    isDisabled: 'default'\n  }\n});\n\nexport function HelpText(props: HelpTextProps & {descriptionRef?: DOMRef<HTMLDivElement>, errorRef?: DOMRef<HTMLDivElement>}) {\n  let domDescriptionRef = useDOMRef(props.descriptionRef || null);\n  let domErrorRef = useDOMRef(props.errorRef || null);\n\n  if (!props.isInvalid && props.description) {\n    return (\n      <Text\n        slot=\"description\"\n        ref={domDescriptionRef}\n        className={helpTextStyles({size: props.size || 'M', isDisabled: props.isDisabled})}>\n        {props.description}\n      </Text>\n    );\n  }\n\n  return (\n    <FieldError\n      {...props}\n      ref={domErrorRef}\n      className={renderProps => helpTextStyles({...renderProps, size: props.size || 'M', isDisabled: props.isDisabled})}>\n      {composeRenderProps(props.children, (children, {validationErrors}) => (<>\n        {props.showErrorIcon &&\n          <CenterBaseline>\n            <AlertIcon />\n          </CenterBaseline>\n        }\n        <span>{children || validationErrors.join(' ')}</span>\n      </>))}\n    </FieldError>\n  );\n}\n\nexport function FieldErrorIcon(props: {isDisabled?: boolean}) {\n  return (\n    <Provider\n      values={[\n        [IconContext, {\n          render: centerBaseline({\n            slot: 'icon',\n            styles: style({\n              order: 0,\n              flexShrink: 0,\n              '--iconPrimary': {\n                type: 'fill',\n                value: {\n                  default: 'negative',\n                  forcedColors: 'ButtonText'\n                }\n              }\n            })}),\n          styles: style({\n            size: fontRelative(20),\n            marginStart: 'text-to-visual',\n            marginEnd: fontRelative(-2),\n            flexShrink: 0\n          })\n        }]\n      ]}>\n      {!props.isDisabled && <AlertIcon />}\n    </Provider>\n  );\n}\n"],"names":[],"version":3,"file":"Field.cjs.map"}