{"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;AAoCM,MAAM,0DAAc,CAAA,GAAA,sCAAI,EAAE,UAAU,CAAC,SAAS,YAAY,KAA+B,EAAE,GAA2B;IAC3H,IAAI,SAAC,KAAK,EAAC,GAAG,CAAA,GAAA,qCAAU;IACxB,QAAQ,CAAA,GAAA,0CAAe,EAAE;IACzB,QAAQ,CAAA,GAAA,sCAAW,EAAE,OAAO;IAE5B,IAAI,YACF,QAAQ,eACR,cAAc,0BACd,UAAU,SACV,QAAQ,SACR,GAAG,YACJ,GAAG;IAEJ,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,uCAAY,EAAE;IACjC,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,CAAC,aAAa,eAAe,GAAG,CAAA,GAAA,yDAAa,EAAE;IAEnD,IAAI,mBAAmB,CAAA,GAAA,wBAAU,EAAE;QACjC,IAAI,qBAAqB;YACvB,IAAI,OAAO,OAAO,IAAI,gBAAgB,cAAc;gBAClD,IAAI,sBAAsB,MAAM,IAAI,CAAC,OAAO,OAAO,CAAC,QAAQ;gBAC5D,IAAI,OAAO,OAAO,OAAO,CAAC,WAAW,GAAG,GAAG,qCAAqC;gBAChF,0EAA0E;gBAC1E,0EAA0E;gBAC1E,IAAI,oBAAoB,IAAI,CAAC,CAAA,QAAS,MAAM,UAAU,GAAG,KAAK,MAAM,UAAU,GAAG,MAAM,WAAW,GAAG,OACnG,OAAO;gBAET,OAAO;YACT;QACF;QACA,IAAI,gBAAgB,cAClB,eAAe;YACb,uCAAuC;YACvC,MAAM;YAEN,4CAA4C;YAC5C,MAAM;QACR;IAEJ,uDAAuD;IACvD,GAAG;QAAC;QAAQ;QAAa;QAAO;QAAgB;KAAS;IAEzD,mDAAmD;IACnD,8HAA8H;IAC9H,CAAA,GAAA,2DAAc,EAAE;QACd;IACF,GAAG;QAAC;KAAiB;IAErB,wKAAwK;IACxK,IAAI,SAAS,CAAA,GAAA,mBAAK,EAAe;IACjC,CAAA,GAAA,2DAAc,EAAE;QACd,IAAI,OAAO,OAAO,EAChB,OAAO,OAAO,GAAG,OAAO,OAAO,CAAC,aAAa;IAEjD,uDAAuD;IACvD,GAAG;QAAC,OAAO,OAAO;KAAC;IACnB,CAAA,GAAA,+DAAgB,EAAE;QAAC,KAAK;QAAQ,UAAU;IAAgB;IAE1D,qBACE,0DAAC;QACE,GAAG,CAAA,GAAA,6CAAa,EAAE,WAAW;QAC7B,GAAG,UAAU;QACd,KAAK;QACL,WACE,CAAA,GAAA,oCAAS,EACP,CAAA,GAAA,mDAAK,GACL,wBACA;YACE,kCAAkC,gBAAgB,cAAc;YAChE,kCAAkC,UAAU;YAC5C,qCAAqC,UAAU;QACjD,GACA,WAAW,SAAS;qBAGxB,0DAAC,CAAA,GAAA,sCAAW;QACV,OAAO;YACL,QAAQ;gBACN,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;YACvC;QACF;qBACA,0DAAC,CAAA,GAAA,kCAAO;QAAE,YAAY;OACnB;AAKX","sources":["packages/@adobe/react-spectrum/src/buttongroup/ButtonGroup.tsx"],"sourcesContent":["/*\n * Copyright 2020 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 {Alignment, DOMProps, DOMRef, Orientation, StyleProps} from '@react-types/shared';\nimport {classNames} from '../utils/classNames';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {Provider, useProvider, useProviderProps} from '../provider/Provider';\nimport React, {ReactNode, useCallback, useRef} from 'react';\nimport {SlotProvider, useSlotProps} from '../utils/Slots';\nimport styles from '@adobe/spectrum-css-temp/components/buttongroup/vars.css';\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useLayoutEffect} from 'react-aria/private/utils/useLayoutEffect';\nimport {useResizeObserver} from 'react-aria/private/utils/useResizeObserver';\nimport {useStyleProps} from '../utils/styleProps';\nimport {useValueEffect} from 'react-aria/private/utils/useValueEffect';\n\nexport interface SpectrumButtonGroupProps extends DOMProps, StyleProps {\n  /** Whether the Buttons in the ButtonGroup are all disabled. */\n  isDisabled?: boolean,\n  /**\n   * The axis the ButtonGroup should align with. Setting this to 'vertical' will prevent\n   * any switching behaviors between 'vertical' and 'horizontal'.\n   * @default 'horizontal'\n   */\n  orientation?: Orientation,\n  /** The Buttons contained within the ButtonGroup. */\n  children: ReactNode,\n  /**\n   * The alignment of the buttons within the ButtonGroup.\n   * @default 'start'\n   */\n  align?: Alignment | 'center'\n}\n\n/**\n * ButtonGroup handles overflow for a grouping of buttons whose actions are related to each other.\n */\nexport const ButtonGroup = React.forwardRef(function ButtonGroup(props: SpectrumButtonGroupProps, ref: DOMRef<HTMLDivElement>) {\n  let {scale} = useProvider();\n  props = useProviderProps(props);\n  props = useSlotProps(props, 'buttonGroup');\n\n  let {\n    children,\n    orientation = 'horizontal',\n    isDisabled,\n    align = 'start',\n    ...otherProps\n  } = props;\n\n  let {styleProps} = useStyleProps(otherProps);\n  let domRef = useDOMRef(ref);\n  let [hasOverflow, setHasOverflow] = useValueEffect(false);\n\n  let checkForOverflow = useCallback(() => {\n    let computeHasOverflow = () => {\n      if (domRef.current && orientation === 'horizontal') {\n        let buttonGroupChildren = Array.from(domRef.current.children) as HTMLElement[];\n        let maxX = domRef.current.offsetWidth + 1; // + 1 to account for rounding errors\n        // If any buttons have negative X positions (align=\"end\") or extend beyond\n        // the width of the button group (align=\"start\"), then switch to vertical.\n        if (buttonGroupChildren.some(child => child.offsetLeft < 0 || child.offsetLeft + child.offsetWidth > maxX)) {\n          return true;\n        }\n        return false;\n      }\n    };\n    if (orientation === 'horizontal') {\n      setHasOverflow(function* () {\n        // Force to horizontal for measurement.\n        yield false;\n\n        // Measure, and update if there is overflow.\n        yield computeHasOverflow();\n      });\n    }\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [domRef, orientation, scale, setHasOverflow, children]);\n\n  // There are two main reasons we need to remeasure:\n  // 1. Internal changes: Check for initial overflow or when orientation/scale/children change (from checkForOverflow dep array)\n  useLayoutEffect(() => {\n    checkForOverflow();\n  }, [checkForOverflow]);\n\n  // 2. External changes: buttongroup won't change size due to any parents changing size, so listen to its container for size changes to figure out if we should remeasure\n  let parent = useRef<HTMLElement>(undefined);\n  useLayoutEffect(() => {\n    if (domRef.current) {\n      parent.current = domRef.current.parentElement as HTMLElement;\n    }\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [domRef.current]);\n  useResizeObserver({ref: parent, onResize: checkForOverflow});\n\n  return (\n    <div\n      {...filterDOMProps(otherProps)}\n      {...styleProps}\n      ref={domRef}\n      className={\n        classNames(\n          styles,\n          'spectrum-ButtonGroup',\n          {\n            'spectrum-ButtonGroup--vertical': orientation === 'vertical' || hasOverflow,\n            'spectrum-ButtonGroup--alignEnd': align === 'end',\n            'spectrum-ButtonGroup--alignCenter': align === 'center'\n          },\n          styleProps.className\n        )\n      }>\n      <SlotProvider\n        slots={{\n          button: {\n            UNSAFE_className: classNames(styles, 'spectrum-ButtonGroup-Button')\n          }\n        }}>\n        <Provider isDisabled={isDisabled}>\n          {children}\n        </Provider>\n      </SlotProvider>\n    </div>\n  );\n});\n"],"names":[],"version":3,"file":"ButtonGroup.cjs.map"}