@react-spectrum/s2 0.11.2 → 0.12.0

package/dist/ActionButton.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;AAkDD,yDAAyD;AACzD,MAAM,iCAAW;AACjB,MAAM,mCAAa;AACnB,MAAM,iCAAW;AACjB,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACC,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2Kb,4BAA4B;AAC5B,MAAM,mCAAa;IACjB,IAAI;IACJ,GAAG;IACH,GAAG;IACH,GAAG;IACH,GAAG;AACL;AAEO,MAAM,0DAAsB,CAAA,GAAA,oBAAY,EAAkF;AAM1H,MAAM,0DAAe,CAAA,GAAA,iBAAS,EAAE,SAAS,aAAa,KAAwB,EAAE,GAAoC;IACzH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,QAAQ,CAAA,GAAA,yCAAW,EAAE;IACrB,IAAI,SAAS,CAAA,GAAA,sBAAc,EAAE;IAC7B,IAAI,sBAAsB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,iCAAyB;IAC9D,IAAI,MAAM,CAAA,GAAA,wBAAgB,EAAE,CAAA,GAAA,yCAAuB;IACnD,IAAI,YAAY,CAAC,CAAC;IAClB,IAAI,WACF,UAAU,wBACV,WAAW,eACX,cAAc,2BACd,cAAc,MAAM,WAAW,WAC/B,UAAU,MAAM,OAAO,QACvB,OAAO,MAAM,IAAI,IAAI,iBACrB,aAAa,MAAM,UAAU,EAC9B,GAAG,OAAO,CAAC;IAGZ,qBACE,gBAAC,CAAA,GAAA,aAAQ;QACN,GAAG,KAAK;QACT,YAAY;QACZ,KAAK;QACL,OAAO,CAAA,GAAA,yCAAS,EAAE,QAAQ,MAAM,YAAY;QAC5C,WAAW,CAAA,cAAe,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,0CAAU;gBACnE,GAAG,WAAW;gBACd,+CAA+C;gBAC/C,WAAW,YAAY,SAAS,IAAI,qBAAqB,UAAU;6BACnE;gBACA,eAAe,CAAC,CAAC;sBACjB;yBACA;yBACA;6BACA;6BACA;2BACA;YACF,GAAG,MAAM,MAAM;kBACf,cAAA,gBAAC,CAAA,GAAA,eAAO;YACN,QAAQ;gBACN;oBAAC,CAAA,GAAA,yCAAc;oBAAG;iBAAK;gBACvB;oBAAC,CAAA,GAAA,yCAAU;oBAAG;wBAAC,MAAM;oBAAmC;iBAAE;gBAC1D;oBAAC,CAAA,GAAA,yCAAU;oBAAG;wBACZ,QAAQ,CAAA,GAAA,yCAAa,EAAE;4BAAC,MAAM;4BAAQ,MAAM;wBAAmB;wBAC/D,MAAM;oBACR;iBAAE;gBACF;oBAAC,CAAA,GAAA,yCAAY;oBAAG;wBACd,MAAM,gCAAU,CAAC,KAAK;wBACtB,MAAM;oBAQR;iBAAE;gBACF;oBAAC,CAAA,GAAA,yCAAuB;oBAAG;wBACzB,aAAa;wBACb,MAAM,MAAM,IAAI,KAAK,OAAO,YAAY,MAAM,IAAI;wBAClD,YAAY,MAAM,UAAU;wBAC5B,MAAM;oBACR;iBAAE;aACH;sBACA,OAAO,MAAM,QAAQ,KAAK,yBAAW,gBAAC,CAAA,GAAA,yCAAG;0BAAG,MAAM,QAAQ;iBAAW,MAAM,QAAQ;;;AAI5F","sources":["packages/@react-spectrum/s2/src/ActionButton.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 {ActionButtonGroupContext} from './ActionButtonGroup';\nimport {AvatarContext} from './Avatar';\nimport {baseColor, focusRing, fontRelative, lightDark, style} from '../style' with { type: 'macro' };\nimport {ButtonProps, ButtonRenderProps, ContextValue, OverlayTriggerStateContext, Provider, Button as RACButton, useSlottedContext} from 'react-aria-components';\nimport {centerBaseline} from './CenterBaseline';\nimport {control, getAllowedOverrides, staticColor, StyleProps} from './style-utils' with { type: 'macro' };\nimport {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {FocusableRef, FocusableRefValue, GlobalDOMAttributes} from '@react-types/shared';\nimport {IconContext} from './Icon';\nimport {NotificationBadgeContext} from './NotificationBadge';\nimport {pressScale} from './pressScale';\nimport {SkeletonContext} from './Skeleton';\nimport {Text, TextContext} from './Content';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useFormProps} from './Form';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ActionButtonStyleProps {\n  /**\n   * The size of the ActionButton.\n   *\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L' | 'XL',\n  /** The static color style to apply. Useful when the ActionButton appears over a color background. */\n  staticColor?: 'black' | 'white' | 'auto',\n  /** Whether the button should be displayed with a [quiet style](https://spectrum.adobe.com/page/action-button/#Quiet). */\n  isQuiet?: boolean\n}\n\ninterface ToggleButtonStyleProps {\n  /** Whether the ActionButton should be selected (controlled). */\n  isSelected?: boolean,\n  /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n  isEmphasized?: boolean\n}\n\ninterface ActionGroupItemStyleProps {\n  density?: 'regular' | 'compact',\n  orientation?: 'horizontal' | 'vertical',\n  isJustified?: boolean\n}\n\nexport interface ActionButtonProps extends Omit<ButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange' | 'isPending' | 'onClick' | keyof GlobalDOMAttributes>, StyleProps, ActionButtonStyleProps {\n  /** The content to display in the ActionButton. */\n  children: ReactNode\n}\n\n// These styles handle both ActionButton and ToggleButton\nconst iconOnly = ':has([slot=icon], [slot=avatar]):not(:has([data-rsp-slot=text]))';\nconst avatarOnly = ':has([slot=avatar]):not(:has([slot=icon], [data-rsp-slot=text]))';\nconst textOnly = ':has([data-rsp-slot=text]):not(:has([slot=icon], [slot=avatar]))';\nconst controlStyle = control({shape: 'default', icon: true});\nexport const btnStyles = style<ButtonRenderProps & ActionButtonStyleProps & ToggleButtonStyleProps & ActionGroupItemStyleProps & {isInGroup: boolean, isStaticColor: boolean}>({\n  ...focusRing(),\n  ...staticColor(),\n  ...controlStyle,\n  justifyContent: 'center',\n  flexShrink: {\n    default: 1,\n    isInGroup: 0\n  },\n  flexGrow: {\n    isJustified: 1\n  },\n  flexBasis: {\n    isJustified: 0\n  },\n  fontWeight: 'medium',\n  userSelect: 'none',\n  transition: 'default',\n  forcedColorAdjust: 'none',\n  backgroundColor: {\n    default: {\n      ...baseColor('gray-100'),\n      default: {\n        default: 'gray-100',\n        isQuiet: 'transparent'\n      }\n    },\n    isSelected: {\n      default: baseColor('neutral'),\n      isEmphasized: {\n        default: lightDark('accent-900', 'accent-700'),\n        isHovered: lightDark('accent-1000', 'accent-600'),\n        isPressed: lightDark('accent-1000', 'accent-600'),\n        isFocusVisible: lightDark('accent-1000', 'accent-600')\n      },\n      isDisabled: {\n        default: 'gray-100',\n        isQuiet: 'transparent'\n      }\n    },\n    isStaticColor: {\n      ...baseColor('transparent-overlay-100'),\n      default: {\n        default: 'transparent-overlay-100',\n        isQuiet: 'transparent'\n      },\n      isSelected: {\n        default: baseColor('transparent-overlay-800'),\n        isDisabled: {\n          default: 'transparent-overlay-100',\n          isQuiet: 'transparent'\n        }\n      }\n    },\n    forcedColors: {\n      default: 'ButtonFace',\n      isSelected: {\n        default: 'Highlight',\n        isDisabled: 'ButtonFace'\n      }\n    }\n  },\n  color: {\n    default: baseColor('neutral'),\n    isSelected: {\n      default: 'gray-25',\n      isEmphasized: 'white'\n    },\n    isDisabled: 'disabled',\n    isStaticColor: {\n      default: baseColor('transparent-overlay-800'),\n      isSelected: 'auto',\n      isDisabled: 'transparent-overlay-400'\n    },\n    forcedColors: {\n      default: 'ButtonText',\n      isSelected: 'HighlightText',\n      isDisabled: {\n        default: 'GrayText'\n      }\n    }\n  },\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  },\n  outlineColor: {\n    default: 'focus-ring',\n    isStaticColor: 'transparent-overlay-1000',\n    forcedColors: 'Highlight'\n  },\n  borderStyle: 'none',\n  borderTopStartRadius: {\n    default: controlStyle.borderRadius,\n    density: {\n      compact: {\n        default: 'none',\n        ':first-child': controlStyle.borderRadius\n      }\n    }\n  },\n  borderTopEndRadius: {\n    default: controlStyle.borderRadius,\n    density: {\n      compact: {\n        default: 'none',\n        orientation: {\n          horizontal: {\n            ':last-child': controlStyle.borderRadius\n          },\n          vertical: {\n            ':first-child': controlStyle.borderRadius\n          }\n        }\n      }\n    }\n  },\n  borderBottomStartRadius: {\n    default: controlStyle.borderRadius,\n    density: {\n      compact: {\n        default: 'none',\n        orientation: {\n          horizontal: {\n            ':first-child': controlStyle.borderRadius\n          },\n          vertical: {\n            ':last-child': controlStyle.borderRadius\n          }\n        }\n      }\n    }\n  },\n  borderBottomEndRadius: {\n    default: controlStyle.borderRadius,\n    density: {\n      compact: {\n        default: 'none',\n        ':last-child': controlStyle.borderRadius\n      }\n    }\n  },\n  zIndex: {\n    isFocusVisible: 2\n  },\n  disableTapHighlight: true,\n  '--badgeTop': {\n    type: 'top',\n    value: {\n      default: 'calc(self(height)/2 - var(--iconWidth)/2)',\n      [textOnly]: 0\n    }\n  },\n  '--iconWidth': {\n    type: 'width',\n    value: fontRelative(20)\n  },\n  '--badgePosition': {\n    type: 'width',\n    value: {\n      default: 'calc(self(paddingStart) + var(--iconWidth))',\n      [iconOnly]: 'calc(self(minWidth)/2 + var(--iconWidth)/2)',\n      [textOnly]: 'full'\n    }\n  },\n  paddingX: {\n    default: controlStyle.paddingX,\n    [avatarOnly]: 0\n  }\n}, getAllowedOverrides());\n\n// Matching icon sizes. TBD.\nconst avatarSize = {\n  XS: 14,\n  S: 16,\n  M: 20,\n  L: 22,\n  X: 26\n} as const;\n\nexport const ActionButtonContext = createContext<ContextValue<Partial<ActionButtonProps>, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * ActionButtons allow users to perform an action.\n * They're used for similar, task-based options within a workflow, and are ideal for interfaces where buttons aren't meant to draw a lot of attention.\n */\nexport const ActionButton = forwardRef(function ActionButton(props: ActionButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ActionButtonContext);\n  props = useFormProps(props as any);\n  let domRef = useFocusableRef(ref);\n  let overlayTriggerState = useContext(OverlayTriggerStateContext);\n  let ctx = useSlottedContext(ActionButtonGroupContext);\n  let isInGroup = !!ctx;\n  let {\n    density = 'regular',\n    isJustified,\n    orientation = 'horizontal',\n    staticColor = props.staticColor,\n    isQuiet = props.isQuiet,\n    size = props.size || 'M',\n    isDisabled = props.isDisabled\n  } = ctx || {};\n\n\n  return (\n    <RACButton\n      {...props}\n      isDisabled={isDisabled}\n      ref={domRef}\n      style={pressScale(domRef, props.UNSAFE_style)}\n      className={renderProps => (props.UNSAFE_className || '') + btnStyles({\n        ...renderProps,\n        // Retain hover styles when an overlay is open.\n        isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n        staticColor,\n        isStaticColor: !!staticColor,\n        size,\n        isQuiet,\n        density,\n        isJustified,\n        orientation,\n        isInGroup\n      }, props.styles)}>\n      <Provider\n        values={[\n          [SkeletonContext, null],\n          [TextContext, {styles: style({order: 1, truncate: true})}],\n          [IconContext, {\n            render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n            styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n          }],\n          [AvatarContext, {\n            size: avatarSize[size],\n            styles: style({\n              marginStart: {\n                default: '--iconMargin',\n                ':last-child': 0\n              },\n              flexShrink: 0,\n              order: 0\n            })\n          }],\n          [NotificationBadgeContext, {\n            staticColor: staticColor,\n            size: props.size === 'XS' ? undefined : props.size,\n            isDisabled: props.isDisabled,\n            styles: style({position: 'absolute', top: '--badgeTop', insetStart: '--badgePosition', marginTop: 'calc((self(height) * -1)/2)', marginStart: 'calc((self(height) * -1)/2)'})\n          }]\n        ]}>\n        {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n      </Provider>\n    </RACButton>\n  );\n});\n"],"names":[],"version":3,"file":"ActionButton.mjs.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/s2/src/ActionButton.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 {ActionButtonGroupContext} from './ActionButtonGroup';\nimport {AvatarContext} from './Avatar';\nimport {baseColor, focusRing, fontRelative, lightDark, style} from '../style' with { type: 'macro' };\nimport {ButtonProps, ButtonRenderProps, ContextValue, OverlayTriggerStateContext, Provider, Button as RACButton, useSlottedContext} from 'react-aria-components';\nimport {centerBaseline} from './CenterBaseline';\nimport {control, getAllowedOverrides, staticColor, StyleProps} from './style-utils' with { type: 'macro' };\nimport {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {FocusableRef, FocusableRefValue, GlobalDOMAttributes} from '@react-types/shared';\nimport {IconContext} from './Icon';\nimport {ImageContext} from './Image';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {NotificationBadgeContext} from './NotificationBadge';\nimport {pressScale} from './pressScale';\nimport {ProgressCircle} from './ProgressCircle';\nimport {SkeletonContext} from './Skeleton';\nimport {Text, TextContext} from './Content';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useFormProps} from './Form';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {usePendingState} from './Button';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ActionButtonStyleProps {\n  /**\n   * The size of the ActionButton.\n   *\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L' | 'XL',\n  /** The static color style to apply. Useful when the ActionButton appears over a color background. */\n  staticColor?: 'black' | 'white' | 'auto',\n  /** Whether the button should be displayed with a [quiet style](https://spectrum.adobe.com/page/action-button/#Quiet). */\n  isQuiet?: boolean\n}\n\ninterface ToggleButtonStyleProps {\n  /** Whether the ActionButton should be selected (controlled). */\n  isSelected?: boolean,\n  /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n  isEmphasized?: boolean\n}\n\ninterface ActionGroupItemStyleProps {\n  density?: 'regular' | 'compact',\n  orientation?: 'horizontal' | 'vertical',\n  isJustified?: boolean\n}\n\nexport interface ActionButtonProps extends Omit<ButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange' | 'onClick' | keyof GlobalDOMAttributes>, StyleProps, ActionButtonStyleProps {\n  /** The content to display in the ActionButton. */\n  children: ReactNode\n}\n\n// These styles handle both ActionButton and ToggleButton\nconst iconOnly = ':has([slot=icon], [slot=avatar]):not(:has([data-rsp-slot=text]))';\nconst avatarOnly = ':has([slot=avatar]):not(:has([slot=icon], [data-rsp-slot=text]))';\nconst textOnly = ':has([data-rsp-slot=text]):not(:has([slot=icon], [slot=avatar]))';\nconst controlStyle = control({shape: 'default', icon: true});\nexport const btnStyles = style<ButtonRenderProps & ActionButtonStyleProps & ToggleButtonStyleProps & ActionGroupItemStyleProps & {isInGroup: boolean, isStaticColor: boolean}>({\n  ...focusRing(),\n  ...staticColor(),\n  ...controlStyle,\n  position: 'relative',\n  justifyContent: 'center',\n  flexShrink: {\n    default: 1,\n    isInGroup: 0\n  },\n  flexGrow: {\n    isJustified: 1\n  },\n  flexBasis: {\n    isJustified: 0\n  },\n  fontWeight: 'medium',\n  userSelect: 'none',\n  transition: 'default',\n  forcedColorAdjust: 'none',\n  backgroundColor: {\n    default: {\n      ...baseColor('gray-100'),\n      default: {\n        default: 'gray-100',\n        isQuiet: 'transparent'\n      }\n    },\n    isSelected: {\n      default: baseColor('neutral'),\n      isEmphasized: {\n        default: lightDark('accent-900', 'accent-700'),\n        isHovered: lightDark('accent-1000', 'accent-600'),\n        isPressed: lightDark('accent-1000', 'accent-600'),\n        isFocusVisible: lightDark('accent-1000', 'accent-600')\n      },\n      isDisabled: {\n        default: 'gray-100',\n        isQuiet: 'transparent'\n      }\n    },\n    isStaticColor: {\n      ...baseColor('transparent-overlay-100'),\n      default: {\n        default: 'transparent-overlay-100',\n        isQuiet: 'transparent'\n      },\n      isSelected: {\n        default: baseColor('transparent-overlay-800'),\n        isDisabled: {\n          default: 'transparent-overlay-100',\n          isQuiet: 'transparent'\n        }\n      }\n    },\n    forcedColors: {\n      default: 'ButtonFace',\n      isSelected: {\n        default: 'Highlight',\n        isDisabled: 'ButtonFace'\n      }\n    }\n  },\n  color: {\n    default: baseColor('neutral'),\n    isSelected: {\n      default: 'gray-25',\n      isEmphasized: 'white'\n    },\n    isDisabled: 'disabled',\n    isStaticColor: {\n      default: baseColor('transparent-overlay-800'),\n      isSelected: 'auto',\n      isDisabled: 'transparent-overlay-400'\n    },\n    forcedColors: {\n      default: 'ButtonText',\n      isSelected: 'HighlightText',\n      isDisabled: {\n        default: 'GrayText'\n      }\n    }\n  },\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  },\n  outlineColor: {\n    default: 'focus-ring',\n    isStaticColor: 'transparent-overlay-1000',\n    forcedColors: 'Highlight'\n  },\n  borderStyle: 'none',\n  borderTopStartRadius: {\n    default: controlStyle.borderRadius,\n    density: {\n      compact: {\n        default: 'none',\n        ':first-child': controlStyle.borderRadius\n      }\n    }\n  },\n  borderTopEndRadius: {\n    default: controlStyle.borderRadius,\n    density: {\n      compact: {\n        default: 'none',\n        orientation: {\n          horizontal: {\n            ':last-child': controlStyle.borderRadius\n          },\n          vertical: {\n            ':first-child': controlStyle.borderRadius\n          }\n        }\n      }\n    }\n  },\n  borderBottomStartRadius: {\n    default: controlStyle.borderRadius,\n    density: {\n      compact: {\n        default: 'none',\n        orientation: {\n          horizontal: {\n            ':first-child': controlStyle.borderRadius\n          },\n          vertical: {\n            ':last-child': controlStyle.borderRadius\n          }\n        }\n      }\n    }\n  },\n  borderBottomEndRadius: {\n    default: controlStyle.borderRadius,\n    density: {\n      compact: {\n        default: 'none',\n        ':last-child': controlStyle.borderRadius\n      }\n    }\n  },\n  zIndex: {\n    isFocusVisible: 2\n  },\n  disableTapHighlight: true,\n  '--badgeTop': {\n    type: 'top',\n    value: {\n      default: 'calc(self(height)/2 - var(--iconWidth)/2)',\n      [textOnly]: 0\n    }\n  },\n  '--iconWidth': {\n    type: 'width',\n    value: fontRelative(20)\n  },\n  '--badgePosition': {\n    type: 'width',\n    value: {\n      default: 'calc(self(paddingStart) + var(--iconWidth))',\n      [iconOnly]: 'calc(self(minWidth)/2 + var(--iconWidth)/2)',\n      [textOnly]: 'full'\n    }\n  },\n  paddingX: {\n    default: controlStyle.paddingX,\n    [avatarOnly]: 0\n  },\n  // `control` sets this, but we need to override it for avatar only buttons.\n  '--iconMargin': {\n    type: 'marginStart',\n    value: {\n      default: fontRelative(-2),\n      [iconOnly]: 0,\n      [avatarOnly]: 0\n    }\n  }\n}, getAllowedOverrides());\n\n// Matching icon sizes. TBD.\nconst avatarSize = {\n  XS: 14,\n  S: 16,\n  M: 20,\n  L: 22,\n  X: 26\n} as const;\n\nexport const ActionButtonContext = createContext<ContextValue<Partial<ActionButtonProps>, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * ActionButtons allow users to perform an action.\n * They're used for similar, task-based options within a workflow, and are ideal for interfaces where buttons aren't meant to draw a lot of attention.\n */\nexport const ActionButton = forwardRef(function ActionButton(props: ActionButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ActionButtonContext);\n  props = useFormProps(props as any);\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  let {isPending = false} = props;\n  let domRef = useFocusableRef(ref);\n  let overlayTriggerState = useContext(OverlayTriggerStateContext);\n  let ctx = useSlottedContext(ActionButtonGroupContext);\n  let isInGroup = !!ctx;\n  let {\n    density = 'regular',\n    isJustified,\n    orientation = 'horizontal',\n    staticColor = props.staticColor,\n    isQuiet = props.isQuiet,\n    size = props.size || 'M'\n  } = ctx || {};\n\n  let {isProgressVisible} = usePendingState(isPending);\n\n  return (\n    <RACButton\n      {...props}\n      ref={domRef}\n      style={pressScale(domRef, props.UNSAFE_style)}\n      className={renderProps => (props.UNSAFE_className || '') + btnStyles({\n        ...renderProps,\n        // Retain hover styles when an overlay is open.\n        isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n        isDisabled: renderProps.isDisabled || isProgressVisible,\n        staticColor,\n        isStaticColor: !!staticColor,\n        size,\n        isQuiet,\n        density,\n        isJustified,\n        orientation,\n        isInGroup\n      }, props.styles)}>\n      {({isDisabled}) => (\n        <>\n          <Provider\n            values={[\n              [SkeletonContext, null],\n              [TextContext, {styles:\n                style({\n                  order: 1,\n                  truncate: true,\n                  visibility: {\n                    isProgressVisible: 'hidden'\n                  }\n                })({isProgressVisible})\n              }],\n              [IconContext, {\n                render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n                styles: style({\n                  size: fontRelative(20),\n                  marginStart: '--iconMargin',\n                  flexShrink: 0,\n                  visibility: {\n                    isProgressVisible: 'hidden'\n                  }\n                })({isProgressVisible})\n              }],\n              [AvatarContext, {\n                size: avatarSize[size],\n                styles: style({\n                  marginStart: '--iconMargin',\n                  flexShrink: 0,\n                  order: 0\n                })\n              }],\n              [ImageContext, {\n                styles: style({\n                  visibility: {\n                    isProgressVisible: 'hidden'\n                  }\n                })({isProgressVisible})\n              }],\n              [NotificationBadgeContext, {\n                staticColor: staticColor,\n                size: props.size === 'XS' ? undefined : props.size,\n                isDisabled: isDisabled,\n                styles: style({\n                  position: 'absolute',\n                  top: '--badgeTop',\n                  insetStart: '--badgePosition',\n                  marginTop: 'calc((self(height) * -1)/2)',\n                  marginStart: 'calc((self(height) * -1)/2)',\n                  visibility: {\n                    isProgressVisible: 'hidden'\n                  }\n                })({isProgressVisible})\n              }]\n            ]}>\n            {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n            {isPending &&\n              <div\n                className={style({\n                  position: 'absolute',\n                  top: '50%',\n                  left: '50%',\n                  transform: 'translate(-50%, -50%)',\n                  visibility: {\n                    default: 'hidden',\n                    isProgressVisible: 'visible'\n                  }\n                })({isProgressVisible, isPending})}>\n                <ProgressCircle\n                  isIndeterminate\n                  aria-label={stringFormatter.format('button.pending')}\n                  size=\"S\"\n                  staticColor={staticColor}\n                  styles={style({\n                    size: {\n                      size: {\n                        XS: 12,\n                        S: 14,\n                        M: 18,\n                        L: 20,\n                        XL: 24\n                      }\n                    }\n                  })({size})} />\n              </div>\n              }\n          </Provider>\n        </>\n      )}\n    </RACButton>\n  );\n});\n"],"names":[],"version":3,"file":"ActionButton.mjs.map"}

package/dist/ActionButtonGroup.cjs

@@ -28,24 +28,24 @@ $parcel$export(module.exports, "ActionButtonGroup", () => $7a26131f6144af2b$expo
 
 const $7a26131f6144af2b$export$641cbcd1f6f6802f = function anonymous(props, overrides) {
     let rules = " ";
-    rules += ((overrides || '').match(/(?:^|\s)(J|G|I|H|_u|_v|_s|__A|_d|_J|z|y|B|A|_P|_9|W|_l|_A|_z|Z|N|L|F|M|K)[^\s]+/g) || []).join('');
-    rules += ' sd112';
-    if (props.orientation === "vertical") rules += ' _ta112';
-    else if (props.orientation === "horizontal") rules += ' _tc112';
+    rules += ((overrides || '').match(/(?:^|\s)(J|G|I|H|_u|_v|_s|__A|_d|_J|z|y|B|A|_P|_9|W|_l|_A|_z|_6|Z|N|L|F|M|K)[^\s]+/g) || []).join('');
+    rules += ' sd12';
+    if (props.orientation === "vertical") rules += ' _ta12';
+    else if (props.orientation === "horizontal") rules += ' _tc12';
     if (props.density === "regular") {
-        if (props.size === "XL") rules += ' Ue112';
-        else if (props.size === "L") rules += ' Ue112';
-        else if (props.size === "M") rules += ' Ue112';
-        else if (props.size === "S") rules += ' Ub112';
-        else if (props.size === "XS") rules += ' Ub112';
-    } else if (props.density === "compact") rules += ' Ua112';
+        if (props.size === "XL") rules += ' Ue12';
+        else if (props.size === "L") rules += ' Ue12';
+        else if (props.size === "M") rules += ' Ue12';
+        else if (props.size === "S") rules += ' Ub12';
+        else if (props.size === "XS") rules += ' Ub12';
+    } else if (props.density === "compact") rules += ' Ua12';
     if (props.density === "regular") {
-        if (props.size === "XL") rules += ' qe112';
-        else if (props.size === "L") rules += ' qe112';
-        else if (props.size === "M") rules += ' qe112';
-        else if (props.size === "S") rules += ' qb112';
-        else if (props.size === "XS") rules += ' qb112';
-    } else if (props.density === "compact") rules += ' qa112';
+        if (props.size === "XL") rules += ' qe12';
+        else if (props.size === "L") rules += ' qe12';
+        else if (props.size === "M") rules += ' qe12';
+        else if (props.size === "S") rules += ' qb12';
+        else if (props.size === "XS") rules += ' qb12';
+    } else if (props.density === "compact") rules += ' qa12';
     return rules;
 };
 const $7a26131f6144af2b$export$33f5f2f2cb85d743 = /*#__PURE__*/ (0, $jGK4W$react.createContext)(null);

package/dist/ActionButtonGroup.css

@@ -1,37 +1,37 @@
 @layer _.a {
-  .sd112 {
+  .sd12 {
     display: flex;
   }
 
-  ._tc112 {
+  ._tc12 {
     flex-direction: row;
   }
 
-  ._ta112 {
+  ._ta12 {
     flex-direction: column;
   }
 
-  .Ua112 {
+  .Ua12 {
     row-gap: .125rem;
   }
 
-  .Ub112 {
+  .Ub12 {
     row-gap: .25rem;
   }
 
-  .Ue112 {
+  .Ue12 {
     row-gap: .5rem;
   }
 
-  .qa112 {
+  .qa12 {
     column-gap: .125rem;
   }
 
-  .qb112 {
+  .qb12 {
     column-gap: .25rem;
   }
 
-  .qe112 {
+  .qe12 {
     column-gap: .5rem;
   }
 }

package/dist/ActionButtonGroup.mjs

@@ -20,24 +20,24 @@ import {createContext as $aTsYn$createContext, forwardRef as $aTsYn$forwardRef}
 
 const $10401bdc118cbc90$export$641cbcd1f6f6802f = function anonymous(props, overrides) {
     let rules = " ";
-    rules += ((overrides || '').match(/(?:^|\s)(J|G|I|H|_u|_v|_s|__A|_d|_J|z|y|B|A|_P|_9|W|_l|_A|_z|Z|N|L|F|M|K)[^\s]+/g) || []).join('');
-    rules += ' sd112';
-    if (props.orientation === "vertical") rules += ' _ta112';
-    else if (props.orientation === "horizontal") rules += ' _tc112';
+    rules += ((overrides || '').match(/(?:^|\s)(J|G|I|H|_u|_v|_s|__A|_d|_J|z|y|B|A|_P|_9|W|_l|_A|_z|_6|Z|N|L|F|M|K)[^\s]+/g) || []).join('');
+    rules += ' sd12';
+    if (props.orientation === "vertical") rules += ' _ta12';
+    else if (props.orientation === "horizontal") rules += ' _tc12';
     if (props.density === "regular") {
-        if (props.size === "XL") rules += ' Ue112';
-        else if (props.size === "L") rules += ' Ue112';
-        else if (props.size === "M") rules += ' Ue112';
-        else if (props.size === "S") rules += ' Ub112';
-        else if (props.size === "XS") rules += ' Ub112';
-    } else if (props.density === "compact") rules += ' Ua112';
+        if (props.size === "XL") rules += ' Ue12';
+        else if (props.size === "L") rules += ' Ue12';
+        else if (props.size === "M") rules += ' Ue12';
+        else if (props.size === "S") rules += ' Ub12';
+        else if (props.size === "XS") rules += ' Ub12';
+    } else if (props.density === "compact") rules += ' Ua12';
     if (props.density === "regular") {
-        if (props.size === "XL") rules += ' qe112';
-        else if (props.size === "L") rules += ' qe112';
-        else if (props.size === "M") rules += ' qe112';
-        else if (props.size === "S") rules += ' qb112';
-        else if (props.size === "XS") rules += ' qb112';
-    } else if (props.density === "compact") rules += ' qa112';
+        if (props.size === "XL") rules += ' qe12';
+        else if (props.size === "L") rules += ' qe12';
+        else if (props.size === "M") rules += ' qe12';
+        else if (props.size === "S") rules += ' qb12';
+        else if (props.size === "XS") rules += ' qb12';
+    } else if (props.density === "compact") rules += ' qa12';
     return rules;
 };
 const $10401bdc118cbc90$export$33f5f2f2cb85d743 = /*#__PURE__*/ (0, $aTsYn$createContext)(null);

package/dist/Add.cjs

@@ -30,16 +30,16 @@ $parcel$export(module.exports, "default", () => $54686c7c3f031ee2$export$2e2bcd8
 
 let $54686c7c3f031ee2$var$styles = function anonymous(props) {
     let rules = " ";
-    if (props.size === "S") rules += ' Zh112';
-    else if (props.size === "XS") rules += ' Zh112';
-    else if (props.size === "XL") rules += ' Zj112';
-    else if (props.size === "L") rules += ' Zj112';
-    else if (props.size === "M") rules += ' Zi112';
-    if (props.size === "S") rules += ' Fi112';
-    else if (props.size === "XS") rules += ' Fi112';
-    else if (props.size === "XL") rules += ' Fk112';
-    else if (props.size === "L") rules += ' Fk112';
-    else if (props.size === "M") rules += ' Fj112';
+    if (props.size === "S") rules += ' Zh12';
+    else if (props.size === "XS") rules += ' Zh12';
+    else if (props.size === "XL") rules += ' Zj12';
+    else if (props.size === "L") rules += ' Zj12';
+    else if (props.size === "M") rules += ' Zi12';
+    if (props.size === "S") rules += ' Fi12';
+    else if (props.size === "XS") rules += ' Fi12';
+    else if (props.size === "XL") rules += ' Fk12';
+    else if (props.size === "L") rules += ' Fk12';
+    else if (props.size === "M") rules += ' Fj12';
     return rules;
 };
 function $54686c7c3f031ee2$export$2e2bcd8739ae039(props) {

package/dist/Add.css

@@ -1,28 +1,28 @@
 @layer _.a {
-  .Zi112 {
+  .Zi12 {
     width: calc(.625rem * var(--s2-scale));
   }
 
-  .Zj112 {
+  .Zj12 {
     width: calc(.75rem * var(--s2-scale));
     width: calc(.75rem * var(--s2-scale));
   }
 
-  .Zh112 {
+  .Zh12 {
     width: calc(.5rem * var(--s2-scale));
     width: calc(.5rem * var(--s2-scale));
   }
 
-  .Fj112 {
+  .Fj12 {
     height: calc(.625rem * var(--s2-scale));
   }
 
-  .Fk112 {
+  .Fk12 {
     height: calc(.75rem * var(--s2-scale));
     height: calc(.75rem * var(--s2-scale));
   }
 
-  .Fi112 {
+  .Fi12 {
     height: calc(.5rem * var(--s2-scale));
     height: calc(.5rem * var(--s2-scale));
   }

package/dist/Add.mjs

@@ -24,16 +24,16 @@ import {jsx as $e5O6h$jsx} from "react/jsx-runtime";
 
 let $053de6aaf5f9b7bd$var$styles = function anonymous(props) {
     let rules = " ";
-    if (props.size === "S") rules += ' Zh112';
-    else if (props.size === "XS") rules += ' Zh112';
-    else if (props.size === "XL") rules += ' Zj112';
-    else if (props.size === "L") rules += ' Zj112';
-    else if (props.size === "M") rules += ' Zi112';
-    if (props.size === "S") rules += ' Fi112';
-    else if (props.size === "XS") rules += ' Fi112';
-    else if (props.size === "XL") rules += ' Fk112';
-    else if (props.size === "L") rules += ' Fk112';
-    else if (props.size === "M") rules += ' Fj112';
+    if (props.size === "S") rules += ' Zh12';
+    else if (props.size === "XS") rules += ' Zh12';
+    else if (props.size === "XL") rules += ' Zj12';
+    else if (props.size === "L") rules += ' Zj12';
+    else if (props.size === "M") rules += ' Zi12';
+    if (props.size === "S") rules += ' Fi12';
+    else if (props.size === "XS") rules += ' Fi12';
+    else if (props.size === "XL") rules += ' Fk12';
+    else if (props.size === "L") rules += ' Fk12';
+    else if (props.size === "M") rules += ' Fj12';
     return rules;
 };
 function $053de6aaf5f9b7bd$export$2e2bcd8739ae039(props) {

package/dist/AlertDialog.cjs

@@ -50,9 +50,9 @@ $parcel$export(module.exports, "AlertDialog", () => $d67aa10f4fac9e2b$export$de4
 
 const $d67aa10f4fac9e2b$var$icon = function anonymous(props) {
     let rules = " ";
-    rules += ' Hv112';
-    if (props.variant === "warning") rules += ' -_8sjo0b-tm112';
-    else if (props.variant === "error") rules += ' -_8sjo0b-tq112';
+    rules += ' Hv12';
+    if (props.variant === "warning") rules += ' -_8sjo0b-tm12';
+    else if (props.variant === "error") rules += ' -_8sjo0b-tq12';
     return rules;
 };
 const $d67aa10f4fac9e2b$export$de466dd8317b0b75 = /*#__PURE__*/ (0, $dZ5J1$react.forwardRef)(function AlertDialog(props, ref) {

package/dist/AlertDialog.css

@@ -1,13 +1,13 @@
 @layer _.a {
-  .Hv112 {
+  .Hv12 {
     margin-inline-end: .5rem;
   }
 
-  .-_8sjo0b-tq112 {
+  .-_8sjo0b-tq12 {
     --iconPrimary: var(--lightningcss-light, #f03823) var(--lightningcss-dark, #fc432e);
   }
 
-  .-_8sjo0b-tm112 {
+  .-_8sjo0b-tm12 {
     --iconPrimary: var(--lightningcss-light, #d45b00) var(--lightningcss-dark, #e06400);
   }
 }

package/dist/AlertDialog.mjs

@@ -44,9 +44,9 @@ function $parcel$interopDefault(a) {
 
 const $94a8ad475d9a330c$var$icon = function anonymous(props) {
     let rules = " ";
-    rules += ' Hv112';
-    if (props.variant === "warning") rules += ' -_8sjo0b-tm112';
-    else if (props.variant === "error") rules += ' -_8sjo0b-tq112';
+    rules += ' Hv12';
+    if (props.variant === "warning") rules += ' -_8sjo0b-tm12';
+    else if (props.variant === "error") rules += ' -_8sjo0b-tq12';
     return rules;
 };
 const $94a8ad475d9a330c$export$de466dd8317b0b75 = /*#__PURE__*/ (0, $2iZqV$forwardRef)(function AlertDialog(props, ref) {

package/dist/Asterisk.cjs

@@ -26,12 +26,12 @@ $parcel$export(module.exports, "default", () => $5d3efbee7071458b$export$2e2bcd8
 
 let $5d3efbee7071458b$var$styles = function anonymous(props) {
     let rules = " ";
-    if (props.size === "XL") rules += ' Zi112';
-    else if (props.size === "L") rules += ' Zi112';
-    else if (props.size === "M") rules += ' Zh112';
-    if (props.size === "XL") rules += ' Fj112';
-    else if (props.size === "L") rules += ' Fj112';
-    else if (props.size === "M") rules += ' Fi112';
+    if (props.size === "XL") rules += ' Zi12';
+    else if (props.size === "L") rules += ' Zi12';
+    else if (props.size === "M") rules += ' Zh12';
+    if (props.size === "XL") rules += ' Fj12';
+    else if (props.size === "L") rules += ' Fj12';
+    else if (props.size === "M") rules += ' Fi12';
     return rules;
 };
 function $5d3efbee7071458b$export$2e2bcd8739ae039(props) {

package/dist/Asterisk.css

@@ -1,18 +1,18 @@
 @layer _.a {
-  .Zh112 {
+  .Zh12 {
     width: calc(.5rem * var(--s2-scale));
   }
 
-  .Zi112 {
+  .Zi12 {
     width: calc(.625rem * var(--s2-scale));
     width: calc(.625rem * var(--s2-scale));
   }
 
-  .Fi112 {
+  .Fi12 {
     height: calc(.5rem * var(--s2-scale));
   }
 
-  .Fj112 {
+  .Fj12 {
     height: calc(.625rem * var(--s2-scale));
     height: calc(.625rem * var(--s2-scale));
   }

package/dist/Asterisk.mjs

@@ -20,12 +20,12 @@ import {jsx as $7AxvV$jsx} from "react/jsx-runtime";
 
 let $8373af657584cab2$var$styles = function anonymous(props) {
     let rules = " ";
-    if (props.size === "XL") rules += ' Zi112';
-    else if (props.size === "L") rules += ' Zi112';
-    else if (props.size === "M") rules += ' Zh112';
-    if (props.size === "XL") rules += ' Fj112';
-    else if (props.size === "L") rules += ' Fj112';
-    else if (props.size === "M") rules += ' Fi112';
+    if (props.size === "XL") rules += ' Zi12';
+    else if (props.size === "L") rules += ' Zi12';
+    else if (props.size === "M") rules += ' Zh12';
+    if (props.size === "XL") rules += ' Fj12';
+    else if (props.size === "L") rules += ' Fj12';
+    else if (props.size === "M") rules += ' Fi12';
     return rules;
 };
 function $8373af657584cab2$export$2e2bcd8739ae039(props) {

package/dist/Avatar.cjs

@@ -1,4 +1,5 @@
 require("./Avatar.css");
+var $e991cbcdf82ced71$exports = require("./CenterBaseline.cjs");
 var $053b76ed3d29e13b$exports = require("./Image.cjs");
 var $ac757a4c2bd72aee$exports = require("../icons/useSpectrumContextProps.cjs");
 var $1YWJ0$reactjsxruntime = require("react/jsx-runtime");
@@ -29,30 +30,33 @@ $parcel$export(module.exports, "Avatar", () => $38071d9ce246d4cf$export$e2255cf6
 
 
 
+
 const $38071d9ce246d4cf$var$imageStyles = function anonymous(props, overrides) {
     let rules = " ";
     let flexShrink = false;
     let flexGrow = false;
-    let matches = (overrides || '').matchAll(/(?:^|\s)(J|G|I|H|_u|_v|_s|__A|_d|_J|z|y|B|A|_P|_9|W|_l|_A|_z)[^\s]+/g);
+    let matches = (overrides || '').matchAll(/(?:^|\s)(J|G|I|H|_u|_v|_s|__A|_d|_J|z|y|B|A|_P|_9|W|_l|_A|_z|_6)[^\s]+/g);
     for (let p of matches){
         if (p[1] === "_v") flexShrink = true;
         if (p[1] === "_u") flexGrow = true;
         rules += p[0];
     }
-    rules += ' og112';
-    rules += ' ng112';
-    rules += ' kg112';
-    rules += ' jg112';
-    rules += ' Zm112';
-    rules += ' Fn112';
-    if (!flexShrink) rules += ' _va112';
-    if (!flexGrow) rules += ' _ua112';
-    rules += ' __ca112';
-    if (props.isOverBackground) rules += ' _Lf112';
-    else rules += ' _Le112';
-    rules += ' OEzkoQe112';
-    if (props.isLarge) rules += ' _Mc112';
-    else rules += ' _Mb112';
+    rules += ' sd12';
+    rules += ' eb12';
+    rules += ' og12';
+    rules += ' ng12';
+    rules += ' kg12';
+    rules += ' jg12';
+    rules += ' Zm12';
+    rules += ' Fn12';
+    if (!flexShrink) rules += ' _va12';
+    if (!flexGrow) rules += ' _ua12';
+    rules += ' __ca12';
+    if (props.isOverBackground) rules += ' _Lf12';
+    else rules += ' _Le12';
+    rules += ' OEzkoQe12';
+    if (props.isLarge) rules += ' _Mc12';
+    else rules += ' _Mb12';
     return rules;
 };
 const $38071d9ce246d4cf$export$a20dad690e1279e2 = /*#__PURE__*/ (0, $1YWJ0$react.createContext)(null);
@@ -73,7 +77,7 @@ const $38071d9ce246d4cf$export$e2255cf6045e8d47 = /*#__PURE__*/ (0, $1YWJ0$react
             width: remSize,
             height: remSize
         },
-        UNSAFE_className: UNSAFE_className,
+        UNSAFE_className: UNSAFE_className + ' ' + (0, $e991cbcdf82ced71$exports.centerBaselineBefore),
         styles: $38071d9ce246d4cf$var$imageStyles({
             isOverBackground: isOverBackground,
             isLarge: isLarge

package/dist/Avatar.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA4BD,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBC,MAAM,0DAAgB,CAAA,GAAA,0BAAY,EAAqE;AAKvG,MAAM,0DAAS,CAAA,GAAA,uBAAS,EAAE,SAAS,OAAO,KAAkB,EAAE,GAA6B;IAChG,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,OACF,MAAM,SACN,GAAG,gBACH,YAAY,oBACZ,mBAAmB,UACnB,OAAO,sBACP,gBAAgB,QAChB,OAAO,UACP,GAAG,YACJ,GAAG;IACJ,MAAM,WAAW,CAAA,GAAA,oCAAa,EAAE;IAEhC,IAAI,UAAU,OAAO,KAAK;IAC1B,IAAI,UAAU,QAAQ;IACtB,qBACE,gCAAC,CAAA,GAAA,+BAAI;QACF,GAAG,QAAQ;QACZ,KAAK;QACL,MAAM;QACN,KAAK;QACL,cAAc;YACZ,GAAG,YAAY;YACf,OAAO;YACP,QAAQ;QACV;QACA,kBAAkB;QAClB,QAAQ,kCAAY;8BAAC;qBAAkB;QAAO,GAAG,MAAM,MAAM;QAC7D,KAAK;;AAEX","sources":["packages/@react-spectrum/s2/src/Avatar.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, SlotProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {Image} from './Image';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarProps extends UnsafeStyles, DOMProps, SlotProps {\n  /** Text description of the avatar. */\n  alt?: string,\n  /** The image URL for the avatar. */\n  src?: string,\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithoutWidth,\n  /**\n   * The size of the avatar.\n   * @default 24\n   */\n  size?: 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 80 | 96 | 112 | (number & {}),\n  /** Whether the avatar is over a color background. */\n  isOverBackground?: boolean\n}\n\nconst imageStyles = style({\n  borderRadius: 'full',\n  size: 20,\n  flexShrink: 0,\n  flexGrow: 0,\n  disableTapHighlight: true,\n  outlineStyle: {\n    default: 'none',\n    isOverBackground: 'solid'\n  },\n  outlineColor: '--s2-container-bg',\n  outlineWidth: {\n    default: 1,\n    isLarge: 2\n  }\n}, getAllowedOverrides({width: false}));\n\nexport const AvatarContext = createContext<ContextValue<Partial<AvatarProps>, DOMRefValue<HTMLImageElement>>>(null);\n\n/**\n * An avatar is a thumbnail representation of an entity, such as a user or an organization.\n */\nexport const Avatar = forwardRef(function Avatar(props: AvatarProps, ref: DOMRef<HTMLImageElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, AvatarContext);\n  let domRef = useDOMRef(ref);\n  let {\n    alt = '',\n    src,\n    UNSAFE_style,\n    UNSAFE_className = '',\n    size = 24,\n    isOverBackground,\n    slot = 'avatar',\n    ...otherProps\n  } = props;\n  const domProps = filterDOMProps(otherProps);\n\n  let remSize = size / 16 + 'rem';\n  let isLarge = size >= 64;\n  return (\n    <Image\n      {...domProps}\n      ref={domRef}\n      slot={slot}\n      alt={alt}\n      UNSAFE_style={{\n        ...UNSAFE_style,\n        width: remSize,\n        height: remSize\n      }}\n      UNSAFE_className={UNSAFE_className}\n      styles={imageStyles({isOverBackground, isLarge}, props.styles)}\n      src={src} />\n  );\n});\n"],"names":[],"version":3,"file":"Avatar.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AA6BD,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBC,MAAM,0DAAgB,CAAA,GAAA,0BAAY,EAAqE;AAKvG,MAAM,0DAAS,CAAA,GAAA,uBAAS,EAAE,SAAS,OAAO,KAAkB,EAAE,GAA6B;IAChG,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,OACF,MAAM,SACN,GAAG,gBACH,YAAY,oBACZ,mBAAmB,UACnB,OAAO,sBACP,gBAAgB,QAChB,OAAO,UACP,GAAG,YACJ,GAAG;IACJ,MAAM,WAAW,CAAA,GAAA,oCAAa,EAAE;IAEhC,IAAI,UAAU,OAAO,KAAK;IAC1B,IAAI,UAAU,QAAQ;IACtB,qBACE,gCAAC,CAAA,GAAA,+BAAI;QACF,GAAG,QAAQ;QACZ,KAAK;QACL,MAAM;QACN,KAAK;QACL,cAAc;YACZ,GAAG,YAAY;YACf,OAAO;YACP,QAAQ;QACV;QACA,kBAAkB,mBAAmB,MAAO,CAAA,GAAA,8CAAmB;QAC/D,QAAQ,kCAAY;8BAAC;qBAAkB;QAAO,GAAG,MAAM,MAAM;QAC7D,KAAK;;AAEX","sources":["packages/@react-spectrum/s2/src/Avatar.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 {centerBaselineBefore} from './CenterBaseline';\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {Image} from './Image';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarProps extends UnsafeStyles, DOMProps, SlotProps {\n  /** Text description of the avatar. */\n  alt?: string,\n  /** The image URL for the avatar. */\n  src?: string,\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithoutWidth,\n  /**\n   * The size of the avatar.\n   * @default 24\n   */\n  size?: 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 80 | 96 | 112 | (number & {}),\n  /** Whether the avatar is over a color background. */\n  isOverBackground?: boolean\n}\n\nconst imageStyles = style({\n  display: 'flex',\n  alignItems: 'center',\n  borderRadius: 'full',\n  size: 20,\n  flexShrink: 0,\n  flexGrow: 0,\n  disableTapHighlight: true,\n  outlineStyle: {\n    default: 'none',\n    isOverBackground: 'solid'\n  },\n  outlineColor: '--s2-container-bg',\n  outlineWidth: {\n    default: 1,\n    isLarge: 2\n  }\n}, getAllowedOverrides({width: false}));\n\nexport const AvatarContext = createContext<ContextValue<Partial<AvatarProps>, DOMRefValue<HTMLImageElement>>>(null);\n\n/**\n * An avatar is a thumbnail representation of an entity, such as a user or an organization.\n */\nexport const Avatar = forwardRef(function Avatar(props: AvatarProps, ref: DOMRef<HTMLImageElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, AvatarContext);\n  let domRef = useDOMRef(ref);\n  let {\n    alt = '',\n    src,\n    UNSAFE_style,\n    UNSAFE_className = '',\n    size = 24,\n    isOverBackground,\n    slot = 'avatar',\n    ...otherProps\n  } = props;\n  const domProps = filterDOMProps(otherProps);\n\n  let remSize = size / 16 + 'rem';\n  let isLarge = size >= 64;\n  return (\n    <Image\n      {...domProps}\n      ref={domRef}\n      slot={slot}\n      alt={alt}\n      UNSAFE_style={{\n        ...UNSAFE_style,\n        width: remSize,\n        height: remSize\n      }}\n      UNSAFE_className={UNSAFE_className + ' ' +  centerBaselineBefore}\n      styles={imageStyles({isOverBackground, isLarge}, props.styles)}\n      src={src} />\n  );\n});\n"],"names":[],"version":3,"file":"Avatar.cjs.map"}

package/dist/Avatar.css

@@ -1,57 +1,65 @@
 @layer _.a {
-  .og112 {
+  .sd12 {
+    display: flex;
+  }
+
+  .eb12 {
+    align-items: center;
+  }
+
+  .og12 {
     border-start-start-radius: 9999px;
   }
 
-  .ng112 {
+  .ng12 {
     border-start-end-radius: 9999px;
   }
 
-  .kg112 {
+  .kg12 {
     border-end-start-radius: 9999px;
   }
 
-  .jg112 {
+  .jg12 {
     border-end-end-radius: 9999px;
   }
 
-  .Zm112 {
+  .Zm12 {
     width: calc(1.25rem * var(--s2-scale));
   }
 
-  .Fn112 {
+  .Fn12 {
     height: calc(1.25rem * var(--s2-scale));
   }
 
-  ._va112 {
+  ._va12 {
     flex-shrink: 0;
   }
 
-  ._ua112 {
+  ._ua12 {
     flex-grow: 0;
   }
 
-  .__ca112 {
+  .__ca12 {
     -webkit-tap-highlight-color: #0000;
   }
 
-  ._Le112 {
+  ._Le12 {
     outline-style: none;
   }
 
-  ._Lf112 {
+  ._Lf12 {
     outline-style: solid;
   }
 
-  .OEzkoQe112 {
+  .OEzkoQe12 {
     outline-color: var(--s2-container-bg);
   }
 
-  ._Mb112 {
+  ._Mb12 {
     outline-width: 1px;
   }
 
-  ._Mc112 {
+  ._Mc12 {
     outline-width: 2px;
   }
 }

package/dist/Avatar.css.map

@@ -1 +1 @@
-{"mappings":"AAsCoB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA","sources":["packages/@react-spectrum/s2/src/Avatar.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, SlotProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {Image} from './Image';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarProps extends UnsafeStyles, DOMProps, SlotProps {\n  /** Text description of the avatar. */\n  alt?: string,\n  /** The image URL for the avatar. */\n  src?: string,\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithoutWidth,\n  /**\n   * The size of the avatar.\n   * @default 24\n   */\n  size?: 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 80 | 96 | 112 | (number & {}),\n  /** Whether the avatar is over a color background. */\n  isOverBackground?: boolean\n}\n\nconst imageStyles = style({\n  borderRadius: 'full',\n  size: 20,\n  flexShrink: 0,\n  flexGrow: 0,\n  disableTapHighlight: true,\n  outlineStyle: {\n    default: 'none',\n    isOverBackground: 'solid'\n  },\n  outlineColor: '--s2-container-bg',\n  outlineWidth: {\n    default: 1,\n    isLarge: 2\n  }\n}, getAllowedOverrides({width: false}));\n\nexport const AvatarContext = createContext<ContextValue<Partial<AvatarProps>, DOMRefValue<HTMLImageElement>>>(null);\n\n/**\n * An avatar is a thumbnail representation of an entity, such as a user or an organization.\n */\nexport const Avatar = forwardRef(function Avatar(props: AvatarProps, ref: DOMRef<HTMLImageElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, AvatarContext);\n  let domRef = useDOMRef(ref);\n  let {\n    alt = '',\n    src,\n    UNSAFE_style,\n    UNSAFE_className = '',\n    size = 24,\n    isOverBackground,\n    slot = 'avatar',\n    ...otherProps\n  } = props;\n  const domProps = filterDOMProps(otherProps);\n\n  let remSize = size / 16 + 'rem';\n  let isLarge = size >= 64;\n  return (\n    <Image\n      {...domProps}\n      ref={domRef}\n      slot={slot}\n      alt={alt}\n      UNSAFE_style={{\n        ...UNSAFE_style,\n        width: remSize,\n        height: remSize\n      }}\n      UNSAFE_className={UNSAFE_className}\n      styles={imageStyles({isOverBackground, isLarge}, props.styles)}\n      src={src} />\n  );\n});\n"],"names":[],"version":3,"file":"Avatar.css.map"}
+{"mappings":"AAuCoB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA","sources":["packages/@react-spectrum/s2/src/Avatar.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 {centerBaselineBefore} from './CenterBaseline';\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {Image} from './Image';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarProps extends UnsafeStyles, DOMProps, SlotProps {\n  /** Text description of the avatar. */\n  alt?: string,\n  /** The image URL for the avatar. */\n  src?: string,\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithoutWidth,\n  /**\n   * The size of the avatar.\n   * @default 24\n   */\n  size?: 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 80 | 96 | 112 | (number & {}),\n  /** Whether the avatar is over a color background. */\n  isOverBackground?: boolean\n}\n\nconst imageStyles = style({\n  display: 'flex',\n  alignItems: 'center',\n  borderRadius: 'full',\n  size: 20,\n  flexShrink: 0,\n  flexGrow: 0,\n  disableTapHighlight: true,\n  outlineStyle: {\n    default: 'none',\n    isOverBackground: 'solid'\n  },\n  outlineColor: '--s2-container-bg',\n  outlineWidth: {\n    default: 1,\n    isLarge: 2\n  }\n}, getAllowedOverrides({width: false}));\n\nexport const AvatarContext = createContext<ContextValue<Partial<AvatarProps>, DOMRefValue<HTMLImageElement>>>(null);\n\n/**\n * An avatar is a thumbnail representation of an entity, such as a user or an organization.\n */\nexport const Avatar = forwardRef(function Avatar(props: AvatarProps, ref: DOMRef<HTMLImageElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, AvatarContext);\n  let domRef = useDOMRef(ref);\n  let {\n    alt = '',\n    src,\n    UNSAFE_style,\n    UNSAFE_className = '',\n    size = 24,\n    isOverBackground,\n    slot = 'avatar',\n    ...otherProps\n  } = props;\n  const domProps = filterDOMProps(otherProps);\n\n  let remSize = size / 16 + 'rem';\n  let isLarge = size >= 64;\n  return (\n    <Image\n      {...domProps}\n      ref={domRef}\n      slot={slot}\n      alt={alt}\n      UNSAFE_style={{\n        ...UNSAFE_style,\n        width: remSize,\n        height: remSize\n      }}\n      UNSAFE_className={UNSAFE_className + ' ' +  centerBaselineBefore}\n      styles={imageStyles({isOverBackground, isLarge}, props.styles)}\n      src={src} />\n  );\n});\n"],"names":[],"version":3,"file":"Avatar.css.map"}