@react-spectrum/s2 0.9.0 → 0.9.2

package/dist/ActionButton.css.map

@@ -1 +1 @@
-{"mappings":"ACgEyB;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;;;;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;;;;EA8NQ;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAGb;;;;EAAA;;;;EAIA;;;;EAAA;;;;EAAA;;;;EAMA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AA3OK;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA;EAAA;;;;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA","sources":["2931924df01dc677","packages/@react-spectrum/s2/src/ActionButton.tsx"],"sourcesContent":["@import \"3cf237010a171787\";\n@import \"c38bef69f8745925\";\n@import \"3059048d79d64c86\";\n@import \"9bc41819d7d08688\";\n@import \"013b65d3da939c1f\";\n@import \"972afc4b5ba1159d\";\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 {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} 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'>, 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 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        isFocused: 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}, 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({marginStart: '--iconMargin', flexShrink: 0, order: 0})\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.css.map"}
+{"mappings":"ACgEyB;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;;;;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;;;;EA8NQ;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAGb;;;;EAAA;;;;EAIA;;;;EAAA;;;;EAAA;;;;EAMA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AA3OK;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA;EAAA;;;;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA","sources":["2931924df01dc677","packages/@react-spectrum/s2/src/ActionButton.tsx"],"sourcesContent":["@import \"3cf237010a171787\";\n@import \"c38bef69f8745925\";\n@import \"3059048d79d64c86\";\n@import \"9bc41819d7d08688\";\n@import \"013b65d3da939c1f\";\n@import \"972afc4b5ba1159d\";\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 {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} 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'>, 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 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}, 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({marginStart: '--iconMargin', flexShrink: 0, order: 0})\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.css.map"}

package/dist/ActionButton.mjs

@@ -118,236 +118,236 @@ const $da878a05ab4a403e$export$446543cff2a0f496 = function anonymous(props, over
         if (p[1] === "_9") zIndex = true;
         rules += p[0];
     }
-    if (props.isFocusVisible) rules += ' _Lf9';
-    else rules += ' _Le9';
-    if (props.isStaticColor) rules += ' Oe9';
-    else rules += ' Oh9';
-    rules += ' Olc9';
-    rules += ' _Mc9';
-    rules += ' _Kd9';
-    if (props.staticColor === "white") rules += ' -Ovbhqd-gcwrnr9';
-    else if (props.staticColor === "black") rules += ' -Ovbhqd-g4hn3s9';
+    if (props.isFocusVisible) rules += ' _Lf91';
+    else rules += ' _Le91';
+    if (props.isStaticColor) rules += ' Oe91';
+    else rules += ' Oh91';
+    rules += ' Olc91';
+    rules += ' _Mc91';
+    rules += ' _Kd91';
+    if (props.staticColor === "white") rules += ' -Ovbhqd-gcwrnr91';
+    else if (props.staticColor === "black") rules += ' -Ovbhqd-g4hn3s91';
     if (props.size === "XL") {
-        rules += ' ug9';
-        rules += ' uch9';
-        rules += ' udi9';
-        rules += ' uea9';
-        rules += ' ugb9';
-        rules += ' uhd9';
-        rules += ' uje9';
-        rules += ' uic9';
+        rules += ' ug91';
+        rules += ' uch91';
+        rules += ' udi91';
+        rules += ' uea91';
+        rules += ' ugb91';
+        rules += ' uhd91';
+        rules += ' uje91';
+        rules += ' uic91';
     } else if (props.size === "L") {
-        rules += ' ug9';
-        rules += ' uch9';
-        rules += ' udi9';
-        rules += ' uea9';
-        rules += ' ugb9';
-        rules += ' uhd9';
-        rules += ' uje9';
-        rules += ' uic9';
+        rules += ' ug91';
+        rules += ' uch91';
+        rules += ' udi91';
+        rules += ' uea91';
+        rules += ' ugb91';
+        rules += ' uhd91';
+        rules += ' uje91';
+        rules += ' uic91';
     } else if (props.size === "S") {
-        rules += ' ug9';
-        rules += ' uch9';
-        rules += ' udi9';
-        rules += ' uea9';
-        rules += ' ugb9';
-        rules += ' uhd9';
-        rules += ' uje9';
-        rules += ' uic9';
+        rules += ' ug91';
+        rules += ' uch91';
+        rules += ' udi91';
+        rules += ' uea91';
+        rules += ' ugb91';
+        rules += ' uhd91';
+        rules += ' uje91';
+        rules += ' uic91';
     } else if (props.size === "XS") {
-        rules += ' ug9';
-        rules += ' uch9';
-        rules += ' udi9';
-        rules += ' uea9';
-        rules += ' ugb9';
-        rules += ' uhd9';
-        rules += ' uje9';
-        rules += ' uic9';
+        rules += ' ug91';
+        rules += ' uch91';
+        rules += ' udi91';
+        rules += ' uea91';
+        rules += ' ugb91';
+        rules += ' uhd91';
+        rules += ' uje91';
+        rules += ' uic91';
     } else {
-        rules += ' ug9';
-        rules += ' uch9';
-        rules += ' udi9';
-        rules += ' uea9';
-        rules += ' ugb9';
-        rules += ' uhd9';
-        rules += ' uje9';
-        rules += ' uic9';
+        rules += ' ug91';
+        rules += ' uch91';
+        rules += ' udi91';
+        rules += ' uea91';
+        rules += ' ugb91';
+        rules += ' uhd91';
+        rules += ' uje91';
+        rules += ' uic91';
     }
     if (props.size === "XL") {
-        rules += ' vg9';
-        rules += ' vsj9';
+        rules += ' vg91';
+        rules += ' vsj91';
     } else if (props.size === "L") {
-        rules += ' vp9';
-        rules += ' vsh9';
+        rules += ' vp91';
+        rules += ' vsh91';
     } else if (props.size === "S") {
-        rules += ' vb9';
-        rules += ' vse9';
+        rules += ' vb91';
+        rules += ' vse91';
     } else if (props.size === "XS") {
-        rules += ' va9';
-        rules += ' vsc9';
+        rules += ' va91';
+        rules += ' vsc91';
     } else {
-        rules += ' vd9';
-        rules += ' vsf9';
+        rules += ' vd91';
+        rules += ' vsf91';
     }
-    rules += ' wc9';
-    rules += ' xc9';
-    rules += ' _xa9';
+    rules += ' wc91';
+    rules += ' xc91';
+    rules += ' _xa91';
     if (props.size === "XL") {
-        rules += ' _Fa9';
-        rules += ' _Ffb9';
+        rules += ' _Fa91';
+        rules += ' _Ffb91';
     } else if (props.size === "L") {
-        rules += ' _Fa9';
-        rules += ' _Ffb9';
+        rules += ' _Fa91';
+        rules += ' _Ffb91';
     } else if (props.size === "S") {
-        rules += ' _Fa9';
-        rules += ' _Ffb9';
+        rules += ' _Fa91';
+        rules += ' _Ffb91';
     } else if (props.size === "XS") {
-        rules += ' _Fa9';
-        rules += ' _Ffb9';
+        rules += ' _Fa91';
+        rules += ' _Ffb91';
     } else {
-        rules += ' _Fa9';
-        rules += ' _Ffb9';
+        rules += ' _Fa91';
+        rules += ' _Ffb91';
     }
     if (props.isStaticColor) {
-        if (props.isDisabled) rules += ' pi9';
-        else if (props.isSelected) rules += ' ph9';
+        if (props.isDisabled) rules += ' pi91';
+        else if (props.isSelected) rules += ' ph91';
         else {
-            if (props.isPressed) rules += ' pk9';
-            else if (props.isFocusVisible) rules += ' pk9';
-            else if (props.isHovered) rules += ' pk9';
-            else rules += ' pj9';
+            if (props.isPressed) rules += ' pk91';
+            else if (props.isFocusVisible) rules += ' pk91';
+            else if (props.isHovered) rules += ' pk91';
+            else rules += ' pj91';
         }
-    } else if (props.isDisabled) rules += ' pp9';
+    } else if (props.isDisabled) rules += ' pp91';
     else if (props.isSelected) {
-        if (props.isEmphasized) rules += ' px9';
-        else rules += ' pr9';
+        if (props.isEmphasized) rules += ' px91';
+        else rules += ' pr91';
     } else {
-        if (props.isPressed) rules += ' po9';
-        else if (props.isFocusVisible) rules += ' po9';
-        else if (props.isHovered) rules += ' po9';
-        else rules += ' pt9';
+        if (props.isPressed) rules += ' po91';
+        else if (props.isFocusVisible) rules += ' po91';
+        else if (props.isHovered) rules += ' po91';
+        else rules += ' pt91';
     }
-    if (props.isDisabled) rules += ' plc9';
-    else if (props.isSelected) rules += ' ple9';
-    else rules += ' plb9';
-    rules += ' sd9';
-    rules += ' eb9';
-    rules += ' _oa9';
-    rules += ' SMBFGYc9';
-    rules += ' Rv9';
-    rules += ' RgLWx3bd9';
-    if (!minWidth) rules += ' N7yFGYc9';
-    if (props.size === "XL") rules += ' -SFnbic-_JaP8ec9';
-    else if (props.size === "L") rules += ' -SFnbic-_J0K2hn9';
-    else if (props.size === "S") rules += ' -SFnbic-_JJOW22b9';
-    else if (props.size === "XS") rules += ' -SFnbic-_JICefdd9';
-    else rules += ' -SFnbic-_Jb9';
-    rules += ' -Bu7z1c-ob9';
+    if (props.isDisabled) rules += ' plc91';
+    else if (props.isSelected) rules += ' ple91';
+    else rules += ' plb91';
+    rules += ' sd91';
+    rules += ' eb91';
+    rules += ' _oa91';
+    rules += ' SMBFGYc91';
+    rules += ' Rv91';
+    rules += ' RgLWx3bd91';
+    if (!minWidth) rules += ' N7yFGYc91';
+    if (props.size === "XL") rules += ' -SFnbic-_JaP8ec91';
+    else if (props.size === "L") rules += ' -SFnbic-_J0K2hn91';
+    else if (props.size === "S") rules += ' -SFnbic-_JJOW22b91';
+    else if (props.size === "XS") rules += ' -SFnbic-_JICefdd91';
+    else rules += ' -SFnbic-_Jb91';
+    rules += ' -Bu7z1c-ob91';
     if (props.density === "compact") {
-        rules += ' od9';
-        rules += ' obj9';
-    } else rules += ' oj9';
+        rules += ' od91';
+        rules += ' obj91';
+    } else rules += ' oj91';
     if (props.density === "compact") {
-        if (props.orientation === "vertical") rules += ' nbj9';
-        else if (props.orientation === "horizontal") rules += ' nkj9';
-        else rules += ' nd9';
-    } else rules += ' nj9';
+        if (props.orientation === "vertical") rules += ' nbj91';
+        else if (props.orientation === "horizontal") rules += ' nkj91';
+        else rules += ' nd91';
+    } else rules += ' nj91';
     if (props.density === "compact") {
-        if (props.orientation === "vertical") rules += ' kkj9';
-        else if (props.orientation === "horizontal") rules += ' kbj9';
-        else rules += ' kd9';
-    } else rules += ' kj9';
+        if (props.orientation === "vertical") rules += ' kkj91';
+        else if (props.orientation === "horizontal") rules += ' kbj91';
+        else rules += ' kd91';
+    } else rules += ' kj91';
     if (props.density === "compact") {
-        rules += ' jd9';
-        rules += ' jkj9';
-    } else rules += ' jj9';
-    rules += ' qc9';
-    rules += ' qsd9';
-    rules += ' -Qg41Lb-IAxCW0c9';
-    rules += ' -Qg41Lb-gLWx3bIy9';
-    rules += ' FRuFGYc9';
-    rules += ' _Ca9';
+        rules += ' jd91';
+        rules += ' jkj91';
+    } else rules += ' jj91';
+    rules += ' qc91';
+    rules += ' qsd91';
+    rules += ' -Qg41Lb-IAxCW0c91';
+    rules += ' -Qg41Lb-gLWx3bIy91';
+    rules += ' FRuFGYc91';
+    rules += ' _Ca91';
     if (props.isInGroup) {
-        if (!flexShrink) rules += ' _va9';
-    } else if (!flexShrink) rules += ' _vb9';
+        if (!flexShrink) rules += ' _va91';
+    } else if (!flexShrink) rules += ' _vb91';
     if (props.isJustified) {
-        if (!flexGrow) rules += ' _ub9';
+        if (!flexGrow) rules += ' _ub91';
     }
     if (props.isJustified) {
-        if (!flexBasis) rules += ' _sb9';
+        if (!flexBasis) rules += ' _sb91';
     }
-    rules += ' _4c9';
-    rules += ' Yd9';
-    rules += ' Xb9';
-    rules += ' _2b9';
-    rules += ' _yb9';
-    rules += ' gqMFGYc9';
-    rules += ' -_8sjo0b-t5ZbAob9';
-    rules += ' _je9';
+    rules += ' _4c91';
+    rules += ' Yd91';
+    rules += ' Xb91';
+    rules += ' _2b91';
+    rules += ' _yb91';
+    rules += ' gqMFGYc91';
+    rules += ' -_8sjo0b-t5ZbAob91';
+    rules += ' _je91';
     if (props.isFocusVisible) {
-        if (!zIndex) rules += ' _9d9';
+        if (!zIndex) rules += ' _9d91';
     }
-    rules += ' __ca9';
-    rules += ' -B5H9Ae-WXN7eQb9';
-    rules += ' -B5H9Ae-wAP22cWr9';
-    rules += ' -SqFa4c-ZuUmpre9';
-    rules += ' -dcAs1c-ZaYffXd9';
-    rules += ' -dcAs1c-y5UFLdZt9HF59';
-    rules += ' -dcAs1c-wAP22cZa9';
-    if (props.size === "XL") rules += ' -F_-Fz9';
-    else if (props.size === "L") rules += ' -F_-Fv9';
-    else if (props.size === "S") rules += ' -F_-Fp9';
-    else if (props.size === "XS") rules += ' -F_-Fn9';
-    else rules += ' -F_-Fx9';
+    rules += ' __ca91';
+    rules += ' -B5H9Ae-WXN7eQb91';
+    rules += ' -B5H9Ae-wAP22cWr91';
+    rules += ' -SqFa4c-ZuUmpre91';
+    rules += ' -dcAs1c-ZaYffXd91';
+    rules += ' -dcAs1c-y5UFLdZt9HF591';
+    rules += ' -dcAs1c-wAP22cZa91';
+    if (props.size === "XL") rules += ' -F_-Fz91';
+    else if (props.size === "L") rules += ' -F_-Fv91';
+    else if (props.size === "S") rules += ' -F_-Fp91';
+    else if (props.size === "XS") rules += ' -F_-Fn91';
+    else rules += ' -F_-Fx91';
     if (props.isStaticColor) {
         if (props.isSelected) {
             if (props.isDisabled) {
-                if (props.isQuiet) rules += ' -g_-g99';
-                else rules += ' -g_-gf9';
+                if (props.isQuiet) rules += ' -g_-g991';
+                else rules += ' -g_-gf91';
             } else {
-                if (props.isPressed) rules += ' -g_-gj9';
-                else if (props.isFocusVisible) rules += ' -g_-gj9';
-                else if (props.isHovered) rules += ' -g_-gj9';
-                else rules += ' -g_-gi9';
+                if (props.isPressed) rules += ' -g_-gj91';
+                else if (props.isFocusVisible) rules += ' -g_-gj91';
+                else if (props.isHovered) rules += ' -g_-gj91';
+                else rules += ' -g_-gi91';
             }
-        } else if (props.isPressed) rules += ' -g_-gg9';
-        else if (props.isFocusVisible) rules += ' -g_-gg9';
-        else if (props.isHovered) rules += ' -g_-gg9';
-        else if (props.isQuiet) rules += ' -g_-g99';
-        else rules += ' -g_-gf9';
+        } else if (props.isPressed) rules += ' -g_-gg91';
+        else if (props.isFocusVisible) rules += ' -g_-gg91';
+        else if (props.isHovered) rules += ' -g_-gg91';
+        else if (props.isQuiet) rules += ' -g_-g991';
+        else rules += ' -g_-gf91';
     } else if (props.isSelected) {
         if (props.isDisabled) {
-            if (props.isQuiet) rules += ' -g_-g99';
-            else rules += ' -g_-gH9';
+            if (props.isQuiet) rules += ' -g_-g991';
+            else rules += ' -g_-gH91';
         } else if (props.isEmphasized) {
-            if (props.isFocused) rules += ' -g_-gUgARdd9';
-            else if (props.isPressed) rules += ' -g_-gUgARdd9';
-            else if (props.isHovered) rules += ' -g_-gUgARdd9';
-            else rules += ' -g_-g5qAiPc9';
+            if (props.isFocusVisible) rules += ' -g_-gUgARdd91';
+            else if (props.isPressed) rules += ' -g_-gUgARdd91';
+            else if (props.isHovered) rules += ' -g_-gUgARdd91';
+            else rules += ' -g_-g5qAiPc91';
         } else {
-            if (props.isPressed) rules += ' -g_-gu9';
-            else if (props.isFocusVisible) rules += ' -g_-gu9';
-            else if (props.isHovered) rules += ' -g_-gu9';
-            else rules += ' -g_-g09';
+            if (props.isPressed) rules += ' -g_-gu91';
+            else if (props.isFocusVisible) rules += ' -g_-gu91';
+            else if (props.isHovered) rules += ' -g_-gu91';
+            else rules += ' -g_-g091';
         }
     } else {
-        if (props.isPressed) rules += ' -g_-gF9';
-        else if (props.isFocusVisible) rules += ' -g_-gF9';
-        else if (props.isHovered) rules += ' -g_-gF9';
-        else if (props.isQuiet) rules += ' -g_-g99';
-        else rules += ' -g_-gH9';
+        if (props.isPressed) rules += ' -g_-gF91';
+        else if (props.isFocusVisible) rules += ' -g_-gF91';
+        else if (props.isHovered) rules += ' -g_-gF91';
+        else if (props.isQuiet) rules += ' -g_-g991';
+        else rules += ' -g_-gH91';
     }
     if (props.isSelected) {
-        if (props.isDisabled) rules += ' -g_-lgb9';
-        else rules += ' -g_-lge9';
-    } else rules += ' -g_-lgb9';
-    rules += ' -S_-Sv9';
-    rules += ' -S_-gLWx3bSd9';
-    if (props.size === "XL") rules += ' -N_-Nl9';
-    else if (props.size === "L") rules += ' -N_-Nj9';
-    else if (props.size === "S") rules += ' -N_-Nf9';
-    else if (props.size === "XS") rules += ' -N_-Ne9';
-    else rules += ' -N_-Nk9';
+        if (props.isDisabled) rules += ' -g_-lgb91';
+        else rules += ' -g_-lge91';
+    } else rules += ' -g_-lgb91';
+    rules += ' -S_-Sv91';
+    rules += ' -S_-gLWx3bSd91';
+    if (props.size === "XL") rules += ' -N_-Nl91';
+    else if (props.size === "L") rules += ' -N_-Nj91';
+    else if (props.size === "S") rules += ' -N_-Nf91';
+    else if (props.size === "XS") rules += ' -N_-Ne91';
+    else rules += ' -N_-Nk91';
     return rules;
 };
 // Matching icon sizes. TBD.
@@ -394,7 +394,7 @@ const $da878a05ab4a403e$export$cfc7921d29ef7b80 = /*#__PURE__*/ (0, $hl1Zj$forwa
                 [
                     (0, $8e847109a6ab556d$export$9afb8bc826b033ea),
                     {
-                        styles: " _Jb9 _Nc9 Pc9 _Yb9 _7c9"
+                        styles: " _Jb91 _Nc91 Pc91 _Yb91 _7c91"
                     }
                 ],
                 [
@@ -402,16 +402,16 @@ const $da878a05ab4a403e$export$cfc7921d29ef7b80 = /*#__PURE__*/ (0, $hl1Zj$forwa
                     {
                         render: (0, $1f4b04be3f24aae3$export$9d7e2342a7e53afa)({
                             slot: 'icon',
-                            styles: " _Ja9"
+                            styles: " _Ja91"
                         }),
-                        styles: " ZuUmpre9 FuUmpre9 I67logd9 _va9"
+                        styles: " ZuUmpre91 FuUmpre91 I67logd91 _va91"
                     }
                 ],
                 [
                     (0, $3ffa2cd930156220$export$a20dad690e1279e2),
                     {
                         size: $da878a05ab4a403e$var$avatarSize[size],
-                        styles: " I67logd9 _va9 _Ja9"
+                        styles: " I67logd91 _va91 _Ja91"
                     }
                 ],
                 [
@@ -420,7 +420,7 @@ const $da878a05ab4a403e$export$cfc7921d29ef7b80 = /*#__PURE__*/ (0, $hl1Zj$forwa
                         staticColor: staticColor,
                         size: props.size === 'XS' ? undefined : props.size,
                         isDisabled: props.isDisabled,
-                        styles: " _Pa9 WtedXZc9 _A1IiWH9 JlZStSb9 IlZStSb9"
+                        styles: " _Pa91 WtedXZc91 _A1IiWH91 JlZStSb91 IlZStSb91"
                     }
                 ]
             ],

package/dist/ActionButton.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;AAkDD,yDAAyD;AACzD,MAAM,iCAAW;AACjB,MAAM,iCAAW;AACjB,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACC,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuKb,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;oBACR;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} 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'>, 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 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        isFocused: 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}, 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({marginStart: '--iconMargin', flexShrink: 0, order: 0})\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":";;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;AAkDD,yDAAyD;AACzD,MAAM,iCAAW;AACjB,MAAM,iCAAW;AACjB,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACC,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuKb,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;oBACR;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} 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'>, 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 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}, 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({marginStart: '--iconMargin', flexShrink: 0, order: 0})\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"}

package/dist/ActionButtonGroup.cjs

@@ -29,23 +29,23 @@ $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 += ' sd9';
-    if (props.orientation === "vertical") rules += ' _ta9';
-    else if (props.orientation === "horizontal") rules += ' _tc9';
+    rules += ' sd91';
+    if (props.orientation === "vertical") rules += ' _ta91';
+    else if (props.orientation === "horizontal") rules += ' _tc91';
     if (props.density === "regular") {
-        if (props.size === "XL") rules += ' Ue9';
-        else if (props.size === "L") rules += ' Ue9';
-        else if (props.size === "M") rules += ' Ue9';
-        else if (props.size === "S") rules += ' Ub9';
-        else if (props.size === "XS") rules += ' Ub9';
-    } else if (props.density === "compact") rules += ' Ua9';
+        if (props.size === "XL") rules += ' Ue91';
+        else if (props.size === "L") rules += ' Ue91';
+        else if (props.size === "M") rules += ' Ue91';
+        else if (props.size === "S") rules += ' Ub91';
+        else if (props.size === "XS") rules += ' Ub91';
+    } else if (props.density === "compact") rules += ' Ua91';
     if (props.density === "regular") {
-        if (props.size === "XL") rules += ' qe9';
-        else if (props.size === "L") rules += ' qe9';
-        else if (props.size === "M") rules += ' qe9';
-        else if (props.size === "S") rules += ' qb9';
-        else if (props.size === "XS") rules += ' qb9';
-    } else if (props.density === "compact") rules += ' qa9';
+        if (props.size === "XL") rules += ' qe91';
+        else if (props.size === "L") rules += ' qe91';
+        else if (props.size === "M") rules += ' qe91';
+        else if (props.size === "S") rules += ' qb91';
+        else if (props.size === "XS") rules += ' qb91';
+    } else if (props.density === "compact") rules += ' qa91';
     return rules;
 };
 const $7a26131f6144af2b$export$33f5f2f2cb85d743 = /*#__PURE__*/ (0, $jGK4W$react.createContext)(null);