@react-spectrum/s2 0.2.1-nightly.4980 → 0.3.0

package/dist/Breadcrumbs.mjs

@@ -1,8 +1,10 @@
 import "./Breadcrumbs.css";
 import $4b69f02ec06b9226$export$2e2bcd8739ae039 from "./Chevron.mjs";
 import {jsx as $a1dfd$jsx, jsxs as $a1dfd$jsxs, Fragment as $a1dfd$Fragment} from "react/jsx-runtime";
-import {Breadcrumbs as $a1dfd$Breadcrumbs, Provider as $a1dfd$Provider, Breadcrumb as $a1dfd$Breadcrumb, HeadingContext as $a1dfd$HeadingContext, Link as $a1dfd$Link} from "react-aria-components";
-import {createContext as $a1dfd$createContext, useRef as $a1dfd$useRef, Children as $a1dfd$Children, isValidElement as $a1dfd$isValidElement, cloneElement as $a1dfd$cloneElement, forwardRef as $a1dfd$forwardRef, useContext as $a1dfd$useContext} from "react";
+import {Breadcrumbs as $a1dfd$Breadcrumbs, useSlottedContext as $a1dfd$useSlottedContext, Breadcrumb as $a1dfd$Breadcrumb, Provider as $a1dfd$Provider, HeadingContext as $a1dfd$HeadingContext, Link as $a1dfd$Link} from "react-aria-components";
+import {useLocale as $a1dfd$useLocale} from "react-aria";
+import {createContext as $a1dfd$createContext, forwardRef as $a1dfd$forwardRef, useRef as $a1dfd$useRef} from "react";
+import {useDOMRef as $a1dfd$useDOMRef} from "@react-spectrum/utils";
 
 /*
  * Copyright 2024 Adobe. All rights reserved.
@@ -18,9 +20,12 @@ import {createContext as $a1dfd$createContext, useRef as $a1dfd$useRef, Children
 
 
 
+
+
+const $f329dd4f2aa58cd0$export$65596d3621b0a4a0 = /*#__PURE__*/ (0, $a1dfd$createContext)(null);
 const $f329dd4f2aa58cd0$var$wrapper = function anonymous(props, overrides) {
     let rules = " .";
-    let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|l|q|r|_9|_8|h|_5|_4|__A|__c|__d|__a|__b|U|__Q|X|Z|V|W)[^\s]+/g) || [];
+    let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|_9|_8|h|_5|_4|__A|__c|__d|__a|__b|U|__Q|X|Z|V|W|l|q|r)[^\s]+/g) || [];
     rules += matches.join('');
     let $_9 = false;
     let $_8 = false;
@@ -77,42 +82,19 @@ const $f329dd4f2aa58cd0$var$wrapper = function anonymous(props, overrides) {
     }
     return rules;
 };
-const $f329dd4f2aa58cd0$var$BreadcrumbsInternalContext = /*#__PURE__*/ (0, $a1dfd$createContext)({
-    length: 0
-});
-function $f329dd4f2aa58cd0$var$Breadcrumbs({ UNSAFE_className: UNSAFE_className = '', UNSAFE_style: UNSAFE_style, styles: styles, ...props }) {
-    let { size: size = 'M', isDisabled: isDisabled } = props;
-    let ref = (0, $a1dfd$useRef)(null);
-    // TODO: Remove when https://github.com/adobe/react-spectrum/pull/6440 is released
-    let childArray = [];
-    (0, $a1dfd$Children).forEach(props.children, (child, index)=>{
-        if (/*#__PURE__*/ (0, $a1dfd$isValidElement)(child)) {
-            child = /*#__PURE__*/ (0, $a1dfd$cloneElement)(child, {
-                key: index,
-                index: index
-            });
-            childArray.push(child);
-        }
-    });
+function $f329dd4f2aa58cd0$var$Breadcrumbs(props, ref) {
+    let { UNSAFE_className: UNSAFE_className = '', UNSAFE_style: UNSAFE_style, styles: styles, size: size = 'M', children: children, ...otherProps } = props;
+    let domRef = (0, $a1dfd$useDOMRef)(ref);
     return /*#__PURE__*/ (0, $a1dfd$jsx)((0, $a1dfd$Breadcrumbs), {
-        ...props,
-        ref: ref,
+        ...otherProps,
+        ref: domRef,
         style: UNSAFE_style,
         className: UNSAFE_className + $f329dd4f2aa58cd0$var$wrapper({
             size: size
         }, styles),
-        children: /*#__PURE__*/ (0, $a1dfd$jsx)((0, $a1dfd$Provider), {
-            values: [
-                [
-                    $f329dd4f2aa58cd0$var$BreadcrumbsInternalContext,
-                    {
-                        size: size,
-                        isDisabled: isDisabled,
-                        length: childArray.length
-                    }
-                ]
-            ],
-            children: childArray
+        children: /*#__PURE__*/ (0, $a1dfd$jsx)($f329dd4f2aa58cd0$export$65596d3621b0a4a0.Provider, {
+            value: props,
+            children: children
         })
     });
 }
@@ -154,7 +136,14 @@ const $f329dd4f2aa58cd0$var$breadcrumbStyles = function anonymous(props) {
     rules += ' wf';
     return rules;
 };
-const $f329dd4f2aa58cd0$var$chevronStyles = " . yF ybG -rwx0fg_e-b";
+const $f329dd4f2aa58cd0$var$chevronStyles = function anonymous(props) {
+    let rules = " .";
+    if (props.direction === "rtl") rules += ' S-3hmpv';
+    rules += ' ybG';
+    rules += ' yF';
+    rules += ' -rwx0fg_e-b';
+    return rules;
+};
 const $f329dd4f2aa58cd0$var$linkStyles = function anonymous(props) {
     let rules = " .";
     if (props.isFocusVisible) rules += ' _Lb';
@@ -247,65 +236,66 @@ const $f329dd4f2aa58cd0$var$currentStyles = function anonymous(props) {
 const $f329dd4f2aa58cd0$var$heading = " . Aa Ba ya za _ca _c-enzrfpb _c-enzwzjc _c-enzykdd _c-enzzrge _c-eo0c6sf _c-1uotwbwg _c-bc1l9oh _dn _dbo _ee _fa _f-1x99dlob ao";
 function $f329dd4f2aa58cd0$export$dabcc1ec9dd9d1cc({ children: children, ...props }) {
     let { href: href, target: target, rel: rel, download: download, ping: ping, referrerPolicy: referrerPolicy, ...other } = props;
-    let { size: size = 'M', length: length, isDisabled: isDisabled } = (0, $a1dfd$useContext)($f329dd4f2aa58cd0$var$BreadcrumbsInternalContext);
+    let { size: size = 'M', isDisabled: isDisabled } = (0, $a1dfd$useSlottedContext)($f329dd4f2aa58cd0$export$65596d3621b0a4a0);
     let ref = (0, $a1dfd$useRef)(null);
-    // TODO: use isCurrent render prop when https://github.com/adobe/react-spectrum/pull/6440 is released
-    let isCurrent = props.index === length - 1;
+    let { direction: direction } = (0, $a1dfd$useLocale)();
     return /*#__PURE__*/ (0, $a1dfd$jsx)((0, $a1dfd$Breadcrumb), {
         ...other,
         ref: ref,
-        className: $f329dd4f2aa58cd0$var$breadcrumbStyles({
-            size: size,
-            isCurrent: isCurrent
-        }),
-        children: isCurrent ? /*#__PURE__*/ (0, $a1dfd$jsx)("span", {
-            className: $f329dd4f2aa58cd0$var$currentStyles({
-                size: size
+        className: ({ isCurrent: isCurrent })=>$f329dd4f2aa58cd0$var$breadcrumbStyles({
+                size: size,
+                isCurrent: isCurrent
             }),
-            children: /*#__PURE__*/ (0, $a1dfd$jsx)((0, $a1dfd$Provider), {
-                values: [
-                    [
-                        (0, $a1dfd$HeadingContext),
-                        {
-                            className: $f329dd4f2aa58cd0$var$heading
-                        }
-                    ]
-                ],
-                children: children
-            })
-        }) : /*#__PURE__*/ (0, $a1dfd$jsxs)((0, $a1dfd$Fragment), {
-            children: [
-                /*#__PURE__*/ (0, $a1dfd$jsx)((0, $a1dfd$Link), {
-                    style: ({ isFocusVisible: isFocusVisible })=>({
-                            clipPath: isFocusVisible ? 'none' : 'margin-box'
-                        }),
-                    href: href,
-                    target: target,
-                    rel: rel,
-                    download: download,
-                    ping: ping,
-                    referrerPolicy: referrerPolicy,
-                    isDisabled: isDisabled || isCurrent,
-                    className: ({ isFocused: isFocused, isFocusVisible: isFocusVisible, isHovered: isHovered, isDisabled: isDisabled, isPressed: isPressed })=>$f329dd4f2aa58cd0$var$linkStyles({
-                            isFocused: isFocused,
-                            isFocusVisible: isFocusVisible,
-                            isHovered: isHovered,
-                            isDisabled: isDisabled,
-                            size: size,
-                            isCurrent: isCurrent,
-                            isPressed: isPressed
-                        }),
-                    children: children
+        children: ({ isCurrent: isCurrent })=>isCurrent ? /*#__PURE__*/ (0, $a1dfd$jsx)("span", {
+                className: $f329dd4f2aa58cd0$var$currentStyles({
+                    size: size
                 }),
-                /*#__PURE__*/ (0, $a1dfd$jsx)((0, $4b69f02ec06b9226$export$2e2bcd8739ae039), {
-                    size: "M",
-                    className: $f329dd4f2aa58cd0$var$chevronStyles
+                children: /*#__PURE__*/ (0, $a1dfd$jsx)((0, $a1dfd$Provider), {
+                    values: [
+                        [
+                            (0, $a1dfd$HeadingContext),
+                            {
+                                className: $f329dd4f2aa58cd0$var$heading
+                            }
+                        ]
+                    ],
+                    children: children
                 })
-            ]
-        })
+            }) : /*#__PURE__*/ (0, $a1dfd$jsxs)((0, $a1dfd$Fragment), {
+                children: [
+                    /*#__PURE__*/ (0, $a1dfd$jsx)((0, $a1dfd$Link), {
+                        style: ({ isFocusVisible: isFocusVisible })=>({
+                                clipPath: isFocusVisible ? 'none' : 'margin-box'
+                            }),
+                        href: href,
+                        target: target,
+                        rel: rel,
+                        download: download,
+                        ping: ping,
+                        referrerPolicy: referrerPolicy,
+                        isDisabled: isDisabled || isCurrent,
+                        className: ({ isFocused: isFocused, isFocusVisible: isFocusVisible, isHovered: isHovered, isDisabled: isDisabled, isPressed: isPressed })=>$f329dd4f2aa58cd0$var$linkStyles({
+                                isFocused: isFocused,
+                                isFocusVisible: isFocusVisible,
+                                isHovered: isHovered,
+                                isDisabled: isDisabled,
+                                size: size,
+                                isCurrent: isCurrent,
+                                isPressed: isPressed
+                            }),
+                        children: children
+                    }),
+                    /*#__PURE__*/ (0, $a1dfd$jsx)((0, $4b69f02ec06b9226$export$2e2bcd8739ae039), {
+                        size: "M",
+                        className: $f329dd4f2aa58cd0$var$chevronStyles({
+                            direction: direction
+                        })
+                    })
+                ]
+            })
     });
 }
 
 
-export {$f329dd4f2aa58cd0$export$2dc68d50d56fbbd as Breadcrumbs, $f329dd4f2aa58cd0$export$dabcc1ec9dd9d1cc as Breadcrumb};
+export {$f329dd4f2aa58cd0$export$65596d3621b0a4a0 as BreadcrumbsContext, $f329dd4f2aa58cd0$export$2dc68d50d56fbbd as Breadcrumbs, $f329dd4f2aa58cd0$export$dabcc1ec9dd9d1cc as Breadcrumb};
 //# sourceMappingURL=Breadcrumbs.mjs.map

package/dist/Breadcrumbs.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;AAAA;;;;;;;;;;CAUC;;;;AAiCD,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BN,MAAM,iEAA6B,CAAA,GAAA,oBAAY,EAA4C;IAAC,QAAQ;AAAC;AAErG,SAAS,kCAA8B,oBACnC,mBAAmB,kBACnB,YAAY,UACZ,MAAM,EACN,GAAG,OACe;IACpB,IAAI,QAAC,OAAO,iBAAK,UAAU,EAAC,GAAG;IAC/B,IAAI,MAAM,CAAA,GAAA,aAAK,EAAE;IACjB,kFAAkF;IAClF,IAAI,aAA6B,EAAE;IACnC,CAAA,GAAA,eAAO,EAAE,OAAO,CAAC,MAAM,QAAQ,EAAE,CAAC,OAAO;QACvC,kBAAI,CAAA,GAAA,qBAAa,EAAmB,QAAQ;YAC1C,sBAAQ,CAAA,GAAA,mBAAW,EAAE,OAAO;gBAAC,KAAK;uBAAO;YAAK;YAC9C,WAAW,IAAI,CAAC;QAClB;IACF;IACA,qBACE,gBAAC,CAAA,GAAA,kBAAa;QACX,GAAG,KAAK;QACT,KAAK;QACL,OAAO;QACP,WAAW,mBAAmB,8BAAQ;kBACpC;QACF,GAAG;kBACH,cAAA,gBAAC,CAAA,GAAA,eAAO;YACN,QAAQ;gBACN;oBAAC;oBAA4B;8BAAC;oCAAM;wBAAY,QAAQ,WAAW,MAAM;oBAAA;iBAAE;aAC5E;sBACA;;;AAIT;AAEA,qGAAqG,GACrG,IAAI,2CAA6B,AAAd,WAAW,GAAI,CAAA,GAAA,iBAAS,EAAqB;AAGhE,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBN,MAAM;AAQN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUN,8EAA8E;AAC9E,MAAM;AAWC,SAAS,0CAAW,YAAC,QAAQ,EAAE,GAAG,OAAuB;IAC9D,IAAI,QAAC,IAAI,UAAE,MAAM,OAAE,GAAG,YAAE,QAAQ,QAAE,IAAI,kBAAE,cAAc,EAAE,GAAG,OAAM,GAAG;IACpE,IAAI,QAAC,OAAO,aAAK,MAAM,cAAE,UAAU,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE;IAClD,IAAI,MAAM,CAAA,GAAA,aAAK,EAAE;IACjB,qGAAqG;IACrG,IAAI,YAAY,AAAC,MAA4C,KAAK,KAAK,SAAS;IAChF,qBACE,gBAAC,CAAA,GAAA,iBAAa;QACX,GAAG,KAAK;QACT,KAAK;QACL,WAAW,uCAAiB;kBAAC;uBAAM;QAAS;kBAC3C,0BACC,gBAAC;YACC,WAAW,oCAAc;sBAAC;YAAI;sBAC9B,cAAA,gBAAC,CAAA,GAAA,eAAO;gBACN,QAAQ;oBACN;wBAAC,CAAA,GAAA,qBAAa;wBAAG;4BAAC,WAAW;wBAAO;qBAAE;iBACvC;0BACA;;2BAIH;;8BACE,gBAAC,CAAA,GAAA,WAAG;oBACF,OAAO,CAAC,kBAAC,cAAc,EAAC,GAAM,CAAA;4BAAC,UAAU,iBAAiB,SAAS;wBAAY,CAAA;oBAC/E,MAAM;oBACN,QAAQ;oBACR,KAAK;oBACL,UAAU;oBACV,MAAM;oBACN,gBAAgB;oBAChB,YAAY,cAAc;oBAC1B,WAAW,CAAC,aAAC,SAAS,kBAAE,cAAc,aAAE,SAAS,cAAE,UAAU,aAAE,SAAS,EAAC,GAAK,iCAAW;uCAAC;4CAAW;uCAAgB;wCAAW;kCAAY;uCAAM;uCAAW;wBAAS;8BACrK;;8BAEH,gBAAC,CAAA,GAAA,wCAAU;oBACT,MAAK;oBACL,WAAW;;;;;AAKzB","sources":["packages/@react-spectrum/s2/src/Breadcrumbs.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 {Breadcrumb as AriaBreadcrumb, BreadcrumbsProps as AriaBreadcrumbsProps, HeadingContext, Link, Provider, Breadcrumbs as RACBreadcrumbs} from 'react-aria-components';\nimport {AriaBreadcrumbItemProps} from 'react-aria';\nimport ChevronIcon from '../ui-icons/Chevron';\nimport {Children, cloneElement, createContext, forwardRef, isValidElement, ReactElement, ReactNode, useContext, useRef} from 'react';\nimport {focusRing, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {forwardRefType} from './types';\nimport {LinkDOMProps} from '@react-types/shared';\nimport {size, style} from '../style/spectrum-theme' with { type: 'macro' };\n\ninterface BreadcrumbsStyleProps {\n  /**\n   * Size of the Breadcrumbs including spacing and layout.\n   *\n   * @default 'M'\n   */\n  size?: 'M' | 'L',\n  /** Whether the breadcrumbs are disabled. */\n  isDisabled?: boolean\n  /**\n   * Whether to place the last Breadcrumb item onto a new line.\n   */\n  // TODO: isMultiline?: boolean\n  /** Whether to always show the root item if the items are collapsed. */\n  // TODO: showRoot?: boolean,\n}\n\nexport interface BreadcrumbsProps<T> extends Omit<AriaBreadcrumbsProps<T>, 'children' | 'items' | 'style' | 'className'>, BreadcrumbsStyleProps, StyleProps {\n  /** The children of the Breadcrumbs. */\n  children?: ReactNode\n}\n\nconst wrapper = style<BreadcrumbsStyleProps>({\n  display: 'flex',\n  justifyContent: 'start',\n  listStyleType: 'none',\n  flexWrap: 'nowrap',\n  flexGrow: 1,\n  flexShrink: 0,\n  flexBasis: 0,\n  gap: {\n    size: {\n      M: size(6), // breadcrumbs-text-to-separator-medium\n      L: size(9) // breadcrumbs-text-to-separator-large\n    }\n  },\n  padding: 0,\n  transition: 'default',\n  marginTop: 0,\n  marginBottom: 0,\n  marginStart: {\n    size: {\n      M: size(6),\n      L: size(9)\n    }\n  }\n}, getAllowedOverrides());\n\nconst BreadcrumbsInternalContext = createContext<BreadcrumbsProps<any> & {length: number}>({length: 0});\n\nfunction Breadcrumbs<T extends object>({\n    UNSAFE_className = '',\n    UNSAFE_style,\n    styles,\n    ...props\n}: BreadcrumbsProps<T>) {\n  let {size = 'M', isDisabled} = props;\n  let ref = useRef(null);\n  // TODO: Remove when https://github.com/adobe/react-spectrum/pull/6440 is released\n  let childArray: ReactElement[] = [];\n  Children.forEach(props.children, (child, index) => {\n    if (isValidElement<{index: number}>(child)) {\n      child = cloneElement(child, {key: index, index});\n      childArray.push(child);\n    }\n  });\n  return (\n    <RACBreadcrumbs\n      {...props}\n      ref={ref}\n      style={UNSAFE_style}\n      className={UNSAFE_className + wrapper({\n        size\n      }, styles)}>\n      <Provider\n        values={[\n          [BreadcrumbsInternalContext, {size, isDisabled, length: childArray.length}]\n        ]}>\n        {childArray}\n      </Provider>\n    </RACBreadcrumbs>\n  );\n}\n\n/** Breadcrumbs show hierarchy and navigational context for a user’s location within an application. */\nlet _Breadcrumbs = /*#__PURE__*/ (forwardRef as forwardRefType)(Breadcrumbs);\nexport {_Breadcrumbs as Breadcrumbs};\n\nconst breadcrumbStyles = style({\n  display: 'inline-flex',\n  alignItems: 'center',\n  justifyContent: 'start',\n  height: 'control',\n  transition: 'default',\n  position: 'relative',\n  color: {\n    default: 'neutral',\n    isDisabled: 'disabled',\n    forcedColors: {\n      default: 'ButtonText',\n      isDisabled: 'GrayText'\n    }\n  },\n  borderStyle: 'none'\n});\n\nconst chevronStyles = style({\n  marginStart: 'text-to-visual',\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  }\n});\n\nconst linkStyles = style({\n  ...focusRing(),\n  borderRadius: 'sm',\n  color: {\n    default: 'neutral-subdued',\n    isDisabled: 'disabled',\n    isCurrent: 'neutral',\n    forcedColors: {\n      default: 'LinkText',\n      isDisabled: 'GrayText'\n    }\n  },\n  transition: 'default',\n  font: 'control',\n  fontWeight: {\n    default: 'normal',\n    isCurrent: 'bold'\n  },\n  textDecoration: {\n    default: 'none',\n    isHovered: 'underline',\n    isFocusVisible: 'underline',\n    isDisabled: 'none'\n  },\n  cursor: {\n    default: 'pointer',\n    isDisabled: 'default'\n  },\n  outlineColor: {\n    default: 'focus-ring',\n    forcedColors: 'Highlight'\n  },\n  disableTapHighlight: true\n});\n\nconst currentStyles = style<{size: string}>({\n  color: {\n    default: 'neutral',\n    forcedColors: 'ButtonText'\n  },\n  transition: 'default',\n  font: 'control',\n  fontWeight: 'bold'\n});\n\n// TODO: support user heading size customization, for now just set it to large\nconst heading = style({\n  margin: 0,\n  font: 'heading-lg',\n  fontWeight: 'extra-bold'\n});\n\nexport interface BreadcrumbProps extends Omit<AriaBreadcrumbItemProps, 'children' | 'style' | 'className' | 'autoFocus'>, LinkDOMProps {\n  /** The children of the breadcrumb item. */\n  children?: ReactNode\n}\n\nexport function Breadcrumb({children, ...props}: BreadcrumbProps) {\n  let {href, target, rel, download, ping, referrerPolicy, ...other} = props;\n  let {size = 'M', length, isDisabled} = useContext(BreadcrumbsInternalContext);\n  let ref = useRef(null);\n  // TODO: use isCurrent render prop when https://github.com/adobe/react-spectrum/pull/6440 is released\n  let isCurrent = (props as BreadcrumbProps & {index: number}).index === length - 1;\n  return (\n    <AriaBreadcrumb\n      {...other}\n      ref={ref}\n      className={breadcrumbStyles({size, isCurrent})} >\n      {isCurrent ?\n        <span\n          className={currentStyles({size})}>\n          <Provider\n            values={[\n              [HeadingContext, {className: heading}]\n            ]}>\n            {children}\n          </Provider>\n        </span>\n        : (\n          <>\n            <Link\n              style={({isFocusVisible}) => ({clipPath: isFocusVisible ? 'none' : 'margin-box'})}\n              href={href}\n              target={target}\n              rel={rel}\n              download={download}\n              ping={ping}\n              referrerPolicy={referrerPolicy}\n              isDisabled={isDisabled || isCurrent}\n              className={({isFocused, isFocusVisible, isHovered, isDisabled, isPressed}) => linkStyles({isFocused, isFocusVisible, isHovered, isDisabled, size, isCurrent, isPressed})}>\n              {children}\n            </Link>\n            <ChevronIcon\n              size=\"M\"\n              className={chevronStyles} />\n          </>\n        )}\n    </AriaBreadcrumb>\n  );\n}\n"],"names":[],"version":3,"file":"Breadcrumbs.mjs.map"}
+{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AAkCM,MAAM,0DAAqB,CAAA,GAAA,oBAAY,EAAoE;AAElH,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BN,SAAS,kCAA8B,KAA0B,EAAE,GAA6B;IAC9F,IAAI,oBACF,mBAAmB,kBACnB,YAAY,UACZ,MAAM,QACN,OAAO,eACP,QAAQ,EACR,GAAG,YACJ,GAAG;IACJ,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IACvB,qBACE,gBAAC,CAAA,GAAA,kBAAa;QACX,GAAG,UAAU;QACd,KAAK;QACL,OAAO;QACP,WAAW,mBAAmB,8BAAQ;kBACpC;QACF,GAAG;kBACH,cAAA,gBAAC,0CAAmB,QAAQ;YAAC,OAAO;sBACjC;;;AAIT;AAEA,qGAAqG,GACrG,IAAI,2CAA6B,AAAd,WAAW,GAAI,CAAA,GAAA,iBAAS,EAAqB;AAGhE,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBN,MAAM;;;;;;;;AAaN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUN,8EAA8E;AAC9E,MAAM;AAWC,SAAS,0CAAW,YAAC,QAAQ,EAAE,GAAG,OAAuB;IAC9D,IAAI,QAAC,IAAI,UAAE,MAAM,OAAE,GAAG,YAAE,QAAQ,QAAE,IAAI,kBAAE,cAAc,EAAE,GAAG,OAAM,GAAG;IACpE,IAAI,QAAC,OAAO,iBAAK,UAAU,EAAC,GAAG,CAAA,GAAA,wBAAgB,EAAE;IACjD,IAAI,MAAM,CAAA,GAAA,aAAK,EAAE;IACjB,IAAI,aAAC,SAAS,EAAC,GAAG,CAAA,GAAA,gBAAQ;IAC1B,qBACE,gBAAC,CAAA,GAAA,iBAAa;QACX,GAAG,KAAK;QACT,KAAK;QACL,WAAW,CAAC,aAAC,SAAS,EAAC,GAAK,uCAAiB;sBAAC;2BAAM;YAAS;kBAC5D,CAAC,aAAC,SAAS,EAAC,GACX,0BACE,gBAAC;gBACC,WAAW,oCAAc;0BAAC;gBAAI;0BAC9B,cAAA,gBAAC,CAAA,GAAA,eAAO;oBACN,QAAQ;wBACN;4BAAC,CAAA,GAAA,qBAAa;4BAAG;gCAAC,WAAW;4BAAO;yBAAE;qBACvC;8BACA;;+BAIH;;kCACE,gBAAC,CAAA,GAAA,WAAG;wBACF,OAAO,CAAC,kBAAC,cAAc,EAAC,GAAM,CAAA;gCAAC,UAAU,iBAAiB,SAAS;4BAAY,CAAA;wBAC/E,MAAM;wBACN,QAAQ;wBACR,KAAK;wBACL,UAAU;wBACV,MAAM;wBACN,gBAAgB;wBAChB,YAAY,cAAc;wBAC1B,WAAW,CAAC,aAAC,SAAS,kBAAE,cAAc,aAAE,SAAS,cAAE,UAAU,aAAE,SAAS,EAAC,GAAK,iCAAW;2CAAC;gDAAW;2CAAgB;4CAAW;sCAAY;2CAAM;2CAAW;4BAAS;kCACrK;;kCAEH,gBAAC,CAAA,GAAA,wCAAU;wBACT,MAAK;wBACL,WAAW,oCAAc;uCAAC;wBAAS;;;;;AAMnD","sources":["packages/@react-spectrum/s2/src/Breadcrumbs.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 {Breadcrumb as AriaBreadcrumb, BreadcrumbsProps as AriaBreadcrumbsProps, ContextValue, HeadingContext, Link, Provider, Breadcrumbs as RACBreadcrumbs, useSlottedContext} from 'react-aria-components';\nimport {AriaBreadcrumbItemProps, useLocale} from 'react-aria';\nimport ChevronIcon from '../ui-icons/Chevron';\nimport {createContext, forwardRef, ReactNode, useRef} from 'react';\nimport {DOMRef, DOMRefValue, LinkDOMProps} from '@react-types/shared';\nimport {focusRing, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {forwardRefType} from './types';\nimport {size, style} from '../style/spectrum-theme' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\n\ninterface BreadcrumbsStyleProps {\n  /**\n   * Size of the Breadcrumbs including spacing and layout.\n   *\n   * @default 'M'\n   */\n  size?: 'M' | 'L',\n  /** Whether the breadcrumbs are disabled. */\n  isDisabled?: boolean\n  /**\n   * Whether to place the last Breadcrumb item onto a new line.\n   */\n  // TODO: isMultiline?: boolean\n  /** Whether to always show the root item if the items are collapsed. */\n  // TODO: showRoot?: boolean,\n}\n\nexport interface BreadcrumbsProps<T> extends Omit<AriaBreadcrumbsProps<T>, 'children' | 'items' | 'style' | 'className'>, BreadcrumbsStyleProps, StyleProps {\n  /** The children of the Breadcrumbs. */\n  children?: ReactNode\n}\n\nexport const BreadcrumbsContext = createContext<ContextValue<BreadcrumbsProps<any>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst wrapper = style<BreadcrumbsStyleProps>({\n  display: 'flex',\n  justifyContent: 'start',\n  listStyleType: 'none',\n  flexWrap: 'nowrap',\n  flexGrow: 1,\n  flexShrink: 0,\n  flexBasis: 0,\n  gap: {\n    size: {\n      M: size(6), // breadcrumbs-text-to-separator-medium\n      L: size(9) // breadcrumbs-text-to-separator-large\n    }\n  },\n  padding: 0,\n  transition: 'default',\n  marginTop: 0,\n  marginBottom: 0,\n  marginStart: {\n    size: {\n      M: size(6),\n      L: size(9)\n    }\n  }\n}, getAllowedOverrides());\n\nfunction Breadcrumbs<T extends object>(props: BreadcrumbsProps<T>, ref: DOMRef<HTMLOListElement>) {\n  let {\n    UNSAFE_className = '',\n    UNSAFE_style,\n    styles,\n    size = 'M',\n    children,\n    ...otherProps\n  } = props;\n  let domRef = useDOMRef(ref);\n  return (\n    <RACBreadcrumbs\n      {...otherProps}\n      ref={domRef}\n      style={UNSAFE_style}\n      className={UNSAFE_className + wrapper({\n        size\n      }, styles)}>\n      <BreadcrumbsContext.Provider value={props}>\n        {children}\n      </BreadcrumbsContext.Provider>\n    </RACBreadcrumbs>\n  );\n}\n\n/** Breadcrumbs show hierarchy and navigational context for a user’s location within an application. */\nlet _Breadcrumbs = /*#__PURE__*/ (forwardRef as forwardRefType)(Breadcrumbs);\nexport {_Breadcrumbs as Breadcrumbs};\n\nconst breadcrumbStyles = style({\n  display: 'inline-flex',\n  alignItems: 'center',\n  justifyContent: 'start',\n  height: 'control',\n  transition: 'default',\n  position: 'relative',\n  color: {\n    default: 'neutral',\n    isDisabled: 'disabled',\n    forcedColors: {\n      default: 'ButtonText',\n      isDisabled: 'GrayText'\n    }\n  },\n  borderStyle: 'none'\n});\n\nconst chevronStyles = style({\n  scale: {\n    direction: {\n      rtl: -1\n    }\n  },\n  marginStart: 'text-to-visual',\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  }\n});\n\nconst linkStyles = style({\n  ...focusRing(),\n  borderRadius: 'sm',\n  color: {\n    default: 'neutral-subdued',\n    isDisabled: 'disabled',\n    isCurrent: 'neutral',\n    forcedColors: {\n      default: 'LinkText',\n      isDisabled: 'GrayText'\n    }\n  },\n  transition: 'default',\n  font: 'control',\n  fontWeight: {\n    default: 'normal',\n    isCurrent: 'bold'\n  },\n  textDecoration: {\n    default: 'none',\n    isHovered: 'underline',\n    isFocusVisible: 'underline',\n    isDisabled: 'none'\n  },\n  cursor: {\n    default: 'pointer',\n    isDisabled: 'default'\n  },\n  outlineColor: {\n    default: 'focus-ring',\n    forcedColors: 'Highlight'\n  },\n  disableTapHighlight: true\n});\n\nconst currentStyles = style<{size: string}>({\n  color: {\n    default: 'neutral',\n    forcedColors: 'ButtonText'\n  },\n  transition: 'default',\n  font: 'control',\n  fontWeight: 'bold'\n});\n\n// TODO: support user heading size customization, for now just set it to large\nconst heading = style({\n  margin: 0,\n  font: 'heading-lg',\n  fontWeight: 'extra-bold'\n});\n\nexport interface BreadcrumbProps extends Omit<AriaBreadcrumbItemProps, 'children' | 'style' | 'className' | 'autoFocus'>, LinkDOMProps {\n  /** The children of the breadcrumb item. */\n  children?: ReactNode\n}\n\nexport function Breadcrumb({children, ...props}: BreadcrumbProps) {\n  let {href, target, rel, download, ping, referrerPolicy, ...other} = props;\n  let {size = 'M', isDisabled} = useSlottedContext(BreadcrumbsContext)!;\n  let ref = useRef(null);\n  let {direction} = useLocale();\n  return (\n    <AriaBreadcrumb\n      {...other}\n      ref={ref}\n      className={({isCurrent}) => breadcrumbStyles({size, isCurrent})}>\n      {({isCurrent}) => (\n        isCurrent ?\n          <span\n            className={currentStyles({size})}>\n            <Provider\n              values={[\n                [HeadingContext, {className: heading}]\n              ]}>\n              {children}\n            </Provider>\n          </span>\n          : (\n            <>\n              <Link\n                style={({isFocusVisible}) => ({clipPath: isFocusVisible ? 'none' : 'margin-box'})}\n                href={href}\n                target={target}\n                rel={rel}\n                download={download}\n                ping={ping}\n                referrerPolicy={referrerPolicy}\n                isDisabled={isDisabled || isCurrent}\n                className={({isFocused, isFocusVisible, isHovered, isDisabled, isPressed}) => linkStyles({isFocused, isFocusVisible, isHovered, isDisabled, size, isCurrent, isPressed})}>\n                {children}\n              </Link>\n              <ChevronIcon\n                size=\"M\"\n                className={chevronStyles({direction})} />\n            </>\n          )\n        )}\n    </AriaBreadcrumb>\n  );\n}\n"],"names":[],"version":3,"file":"Breadcrumbs.mjs.map"}

package/dist/Button.cjs

@@ -3,10 +3,10 @@ var $e991cbcdf82ced71$exports = require("./CenterBaseline.cjs");
 var $bde97c91243ed164$exports = require("../icons/Icon.cjs");
 var $2061c83559b50a66$exports = require("./pressScale.cjs");
 var $6367bc87eb7d24ad$exports = require("./Content.cjs");
+var $ac757a4c2bd72aee$exports = require("./useSpectrumContextProps.cjs");
 var $8owBJ$reactjsxruntime = require("react/jsx-runtime");
 var $8owBJ$reactariacomponents = require("react-aria-components");
 var $8owBJ$react = require("react");
-var $8owBJ$reactaria = require("react-aria");
 var $8owBJ$reactspectrumutils = require("@react-spectrum/utils");
 
 
@@ -15,6 +15,7 @@ function $parcel$export(e, n, v, s) {
 }
 
 $parcel$export(module.exports, "ButtonContext", () => $25d06cf8d4e72761$export$24d547caef80ccd1);
+$parcel$export(module.exports, "LinkButtonContext", () => $25d06cf8d4e72761$export$1c1a176f3b9e48d3);
 $parcel$export(module.exports, "Button", () => $25d06cf8d4e72761$export$353f5b6fc5456de1);
 $parcel$export(module.exports, "LinkButton", () => $25d06cf8d4e72761$export$29d11c0fe2fc51d8);
 /*
@@ -36,10 +37,11 @@ $parcel$export(module.exports, "LinkButton", () => $25d06cf8d4e72761$export$29d1
 
 
 
-const $25d06cf8d4e72761$export$24d547caef80ccd1 = /*#__PURE__*/ (0, $8owBJ$react.createContext)({});
+const $25d06cf8d4e72761$export$24d547caef80ccd1 = /*#__PURE__*/ (0, $8owBJ$react.createContext)(null);
+const $25d06cf8d4e72761$export$1c1a176f3b9e48d3 = /*#__PURE__*/ (0, $8owBJ$react.createContext)(null);
 const $25d06cf8d4e72761$var$button = function anonymous(props, overrides) {
     let rules = " .";
-    let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|l|q|r|_9|_8|h|_5|_4|__A|__c|__d|__a|__b|U|__Q|X|Z|V|W)[^\s]+/g) || [];
+    let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|_9|_8|h|_5|_4|__A|__c|__d|__a|__b|U|__Q|X|Z|V|W|l|q|r)[^\s]+/g) || [];
     rules += matches.join('');
     let $q = false;
     let $l = false;
@@ -334,9 +336,8 @@ const $25d06cf8d4e72761$var$button = function anonymous(props, overrides) {
     return rules;
 };
 function $25d06cf8d4e72761$var$Button(props, ref) {
+    [props, ref] = (0, $ac757a4c2bd72aee$exports.useSpectrumContextProps)(props, ref, $25d06cf8d4e72761$export$24d547caef80ccd1);
     let domRef = (0, $8owBJ$reactspectrumutils.useFocusableRef)(ref);
-    let ctx = (0, $8owBJ$react.useContext)($25d06cf8d4e72761$export$24d547caef80ccd1);
-    props = (0, $8owBJ$reactaria.mergeProps)(ctx, props);
     let overlayTriggerState = (0, $8owBJ$react.useContext)((0, $8owBJ$reactariacomponents.OverlayTriggerStateContext));
     return /*#__PURE__*/ (0, $8owBJ$reactjsxruntime.jsx)((0, $8owBJ$reactariacomponents.Button), {
         ...props,
@@ -356,7 +357,7 @@ function $25d06cf8d4e72761$var$Button(props, ref) {
                 [
                     (0, $6367bc87eb7d24ad$exports.TextContext),
                     {
-                        className: " . E-1gogtue F-1gogtue __A-3t1y"
+                        styles: " . E-1gogtue F-1gogtue __A-3t1y"
                     }
                 ],
                 [
@@ -364,7 +365,7 @@ function $25d06cf8d4e72761$var$Button(props, ref) {
                     {
                         render: (0, $e991cbcdf82ced71$exports.centerBaseline)({
                             slot: 'icon',
-                            className: " . __A-3t1x"
+                            styles: " . __A-3t1x"
                         }),
                         styles: " . l-1sthc3k k-1sthc3k y-oelgqu _8-3t1x"
                     }
@@ -382,9 +383,8 @@ function $25d06cf8d4e72761$var$Button(props, ref) {
  * where a user needs to do something in order to move forward in a flow.
  */ let $25d06cf8d4e72761$export$353f5b6fc5456de1 = /*#__PURE__*/ (0, $8owBJ$react.forwardRef)($25d06cf8d4e72761$var$Button);
 function $25d06cf8d4e72761$var$LinkButton(props, ref) {
+    [props, ref] = (0, $ac757a4c2bd72aee$exports.useSpectrumContextProps)(props, ref, $25d06cf8d4e72761$export$1c1a176f3b9e48d3);
     let domRef = (0, $8owBJ$reactspectrumutils.useFocusableRef)(ref);
-    let ctx = (0, $8owBJ$react.useContext)($25d06cf8d4e72761$export$24d547caef80ccd1);
-    props = (0, $8owBJ$reactaria.mergeProps)(ctx, props);
     let overlayTriggerState = (0, $8owBJ$react.useContext)((0, $8owBJ$reactariacomponents.OverlayTriggerStateContext));
     return /*#__PURE__*/ (0, $8owBJ$reactjsxruntime.jsx)((0, $8owBJ$reactariacomponents.Link), {
         ...props,
@@ -404,7 +404,7 @@ function $25d06cf8d4e72761$var$LinkButton(props, ref) {
                 [
                     (0, $6367bc87eb7d24ad$exports.TextContext),
                     {
-                        className: " . E-1gogtue F-1gogtue __A-3t1y"
+                        styles: " . E-1gogtue F-1gogtue __A-3t1y"
                     }
                 ],
                 [
@@ -412,7 +412,7 @@ function $25d06cf8d4e72761$var$LinkButton(props, ref) {
                     {
                         render: (0, $e991cbcdf82ced71$exports.centerBaseline)({
                             slot: 'icon',
-                            className: " . __A-3t1x"
+                            styles: " . __A-3t1x"
                         }),
                         styles: " . l-1sthc3k k-1sthc3k y-oelgqu _8-3t1x"
                     }

package/dist/Button.cjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Button.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 {baseColor, fontRelative, style} from '../style/spectrum-theme' with {type: 'macro'};\nimport {ButtonRenderProps, Link, LinkProps, OverlayTriggerStateContext, Provider, Button as RACButton, ButtonProps as RACButtonProps} from 'react-aria-components';\nimport {centerBaseline} from './CenterBaseline';\nimport {centerPadding, focusRing, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {FocusableRef} from '@react-types/shared';\nimport {IconContext} from './Icon';\nimport {mergeProps} from 'react-aria';\nimport {pressScale} from './pressScale';\nimport {Text, TextContext} from './Content';\nimport {useFocusableRef} from '@react-spectrum/utils';\n\ninterface ButtonStyleProps {\n  /**\n   * The [visual style](https://spectrum.adobe.com/page/button/#Options) of the button.\n   *\n   * @default 'primary'\n   */\n  variant?: 'primary' | 'secondary' | 'accent' | 'negative',\n  /**\n   * The background style of the Button.\n   *\n   * @default 'fill'\n   */\n  fillStyle?: 'fill' | 'outline',\n  /**\n   * The size of the Button.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL',\n  /** The static color style to apply. Useful when the Button appears over a color background. */\n  staticColor?: 'white' | 'black'\n}\n\nexport interface ButtonProps extends Omit<RACButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, StyleProps, ButtonStyleProps {\n  /** The content to display in the Button. */\n  children?: ReactNode\n}\n\nexport interface LinkButtonProps extends Omit<LinkProps, 'className' | 'style' | 'children'>, StyleProps, ButtonStyleProps {\n  /** The content to display in the Button. */\n  children?: ReactNode\n}\n\ninterface ButtonContextValue extends ButtonStyleProps, StyleProps {\n  /** Whether the Button is disabled. */\n  isDisabled?: boolean\n}\n\nexport const ButtonContext = createContext<ButtonContextValue>({});\n\nconst button = style<ButtonRenderProps & ButtonStyleProps>({\n  ...focusRing(),\n  display: 'flex',\n  alignItems: {\n    default: 'baseline',\n    ':has([slot=icon]:only-child)': 'center'\n  },\n  justifyContent: 'center',\n  textAlign: 'start',\n  columnGap: 'text-to-visual',\n  font: 'control',\n  fontWeight: 'bold',\n  userSelect: 'none',\n  minHeight: 'control',\n  minWidth: {\n    ':has([slot=icon]:only-child)': 'control'\n  },\n  borderRadius: 'pill',\n  boxSizing: 'border-box',\n  width: 'fit',\n  textDecoration: 'none', // for link buttons\n  paddingX: {\n    default: 'pill',\n    ':has([slot=icon]:only-child)': 0\n  },\n  paddingY: 0,\n  aspectRatio: {\n    ':has([slot=icon]:only-child)': 'square'\n  },\n  transition: 'default',\n  borderStyle: 'solid',\n  borderWidth: {\n    fillStyle: {\n      fill: 0,\n      outline: 2\n    }\n  },\n  '--labelPadding': {\n    type: 'paddingTop',\n    value: centerPadding()\n  },\n  '--iconMargin': {\n    type: 'marginTop',\n    value: {\n      default: fontRelative(-2),\n      ':has([slot=icon]:only-child)': 0\n    }\n  },\n  borderColor: {\n    variant: {\n      primary: baseColor('gray-800'),\n      secondary: baseColor('gray-300')\n    },\n    isDisabled: 'disabled',\n    staticColor: {\n      white: {\n        variant: {\n          primary: baseColor('transparent-white-800'),\n          secondary: baseColor('transparent-white-300')\n        },\n        isDisabled: 'transparent-white-300'\n      },\n      black: {\n        variant: {\n          primary: baseColor('transparent-black-800'),\n          secondary: baseColor('transparent-black-300')\n        },\n        isDisabled: 'transparent-black-300'\n      }\n    },\n    forcedColors: {\n      default: 'ButtonBorder',\n      isHovered: 'Highlight',\n      isDisabled: 'GrayText'\n    }\n  },\n  backgroundColor: {\n    fillStyle: {\n      fill: {\n        variant: {\n          primary: 'neutral',\n          secondary: baseColor('gray-100'),\n          accent: 'accent',\n          negative: 'negative'\n        },\n        isDisabled: 'disabled'\n      },\n      outline: {\n        default: 'transparent',\n        isHovered: 'gray-100',\n        isPressed: 'gray-100',\n        isFocusVisible: 'gray-100'\n      }\n    },\n    staticColor: {\n      white: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: baseColor('transparent-white-800'),\n              secondary: baseColor('transparent-white-100')\n            },\n            isDisabled: 'transparent-white-100'\n          },\n          outline: {\n            default: 'transparent',\n            isHovered: 'transparent-white-100',\n            isPressed: 'transparent-white-100',\n            isFocusVisible: 'transparent-white-100'\n          }\n        }\n      },\n      black: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: baseColor('transparent-black-800'),\n              secondary: baseColor('transparent-black-100')\n            },\n            isDisabled: 'transparent-black-100'\n          },\n          outline: {\n            default: 'transparent',\n            isHovered: 'transparent-black-100',\n            isPressed: 'transparent-black-100',\n            isFocusVisible: 'transparent-black-100'\n          }\n        }\n      }\n    },\n    forcedColors: {\n      fillStyle: {\n        fill: {\n          default: 'ButtonText',\n          isHovered: 'Highlight',\n          isDisabled: 'GrayText'\n        },\n        outline: 'ButtonFace'\n      }\n    }\n  },\n  color: {\n    fillStyle: {\n      fill: {\n        variant: {\n          primary: 'gray-25',\n          secondary: 'neutral',\n          accent: 'white',\n          negative: 'white'\n        },\n        isDisabled: 'disabled'\n      },\n      outline: {\n        default: 'neutral',\n        isDisabled: 'disabled'\n      }\n    },\n    staticColor: {\n      white: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: 'black',\n              secondary: baseColor('transparent-white-800')\n            }\n          },\n          outline: baseColor('transparent-white-800')\n        },\n        isDisabled: 'transparent-white-400'\n      },\n      black: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: 'white',\n              secondary: baseColor('transparent-black-800')\n            }\n          },\n          outline: baseColor('transparent-black-800')\n        },\n        isDisabled: 'transparent-black-400'\n      }\n    },\n    forcedColors: {\n      fillStyle: {\n        fill: {\n          default: 'ButtonFace',\n          isDisabled: 'HighlightText'\n        },\n        outline: {\n          default: 'ButtonText',\n          isDisabled: 'GrayText'\n        }\n      }\n    }\n  },\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  },\n  outlineColor: {\n    default: 'focus-ring',\n    staticColor: {\n      white: 'white',\n      black: 'black'\n    },\n    forcedColors: 'Highlight'\n  },\n  forcedColorAdjust: 'none',\n  disableTapHighlight: true\n}, getAllowedOverrides());\n\nfunction Button(props: ButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n  let domRef = useFocusableRef(ref);\n  let ctx = useContext(ButtonContext);\n  props = mergeProps(ctx, props);\n  let overlayTriggerState = useContext(OverlayTriggerStateContext);\n\n  return (\n    <RACButton\n      {...props}\n      ref={domRef}\n      style={pressScale(domRef, props.UNSAFE_style)}\n      className={renderProps => (props.UNSAFE_className || '') + button({\n        ...renderProps,\n        // Retain hover styles when an overlay is open.\n        isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n        variant: props.variant || 'primary',\n        fillStyle: props.fillStyle || 'fill',\n        size: props.size || 'M',\n        staticColor: props.staticColor\n      }, props.styles)}>\n      <Provider\n        values={[\n          [TextContext, {className: style({paddingY: '--labelPadding', order: 1})}],\n          [IconContext, {\n            render: centerBaseline({slot: 'icon', className: style({order: 0})}),\n            styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n          }]\n        ]}>\n        {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n      </Provider>\n    </RACButton>\n  );\n}\n\n/**\n * Buttons allow users to perform an action.\n * They have multiple styles for various needs, and are ideal for calling attention to\n * where a user needs to do something in order to move forward in a flow.\n */\nlet _Button = forwardRef(Button);\nexport {_Button as Button};\n\nfunction LinkButton(props: LinkButtonProps, ref: FocusableRef<HTMLAnchorElement>) {\n  let domRef = useFocusableRef(ref);\n  let ctx = useContext(ButtonContext);\n  props = mergeProps(ctx, props);\n  let overlayTriggerState = useContext(OverlayTriggerStateContext);\n\n  return (\n    <Link\n      {...props}\n      ref={domRef}\n      style={pressScale(domRef, props.UNSAFE_style)}\n      className={renderProps => (props.UNSAFE_className || '') + button({\n        ...renderProps,\n        // Retain hover styles when an overlay is open.\n        isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n        variant: props.variant || 'primary',\n        fillStyle: props.fillStyle || 'fill',\n        size: props.size || 'M',\n        staticColor: props.staticColor\n      }, props.styles)}>\n      <Provider\n        values={[\n          [TextContext, {className: style({paddingY: '--labelPadding', order: 1})}],\n          [IconContext, {\n            render: centerBaseline({slot: 'icon', className: style({order: 0})}),\n            styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n          }]\n        ]}>\n        {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n      </Provider>\n    </Link>\n  );\n}\n\n/**\n * A LinkButton combines the functionality of a link with the appearance of a button. Useful for allowing users to navigate to another page.\n */\nlet _LinkButton = forwardRef(LinkButton);\nexport {_LinkButton as LinkButton};\n"],"names":[],"version":3,"file":"Button.cjs.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Button.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 {baseColor, fontRelative, style} from '../style/spectrum-theme' with {type: 'macro'};\nimport {ButtonRenderProps, ContextValue, Link, LinkProps, OverlayTriggerStateContext, Provider, Button as RACButton, ButtonProps as RACButtonProps} from 'react-aria-components';\nimport {centerBaseline} from './CenterBaseline';\nimport {centerPadding, focusRing, getAllowedOverrides, 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 {pressScale} from './pressScale';\nimport {Text, TextContext} from './Content';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\ninterface ButtonStyleProps {\n  /**\n   * The [visual style](https://spectrum.adobe.com/page/button/#Options) of the button.\n   *\n   * @default 'primary'\n   */\n  variant?: 'primary' | 'secondary' | 'accent' | 'negative',\n  /**\n   * The background style of the Button.\n   *\n   * @default 'fill'\n   */\n  fillStyle?: 'fill' | 'outline',\n  /**\n   * The size of the Button.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL',\n  /** The static color style to apply. Useful when the Button appears over a color background. */\n  staticColor?: 'white' | 'black'\n}\n\nexport interface ButtonProps extends Omit<RACButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, StyleProps, ButtonStyleProps {\n  /** The content to display in the Button. */\n  children?: ReactNode\n}\n\nexport interface LinkButtonProps extends Omit<LinkProps, 'className' | 'style' | 'children'>, StyleProps, ButtonStyleProps {\n  /** The content to display in the Button. */\n  children?: ReactNode\n}\n\nexport const ButtonContext = createContext<ContextValue<ButtonProps, FocusableRefValue<HTMLButtonElement>>>(null);\nexport const LinkButtonContext = createContext<ContextValue<ButtonProps, FocusableRefValue<HTMLAnchorElement>>>(null);\n\nconst button = style<ButtonRenderProps & ButtonStyleProps>({\n  ...focusRing(),\n  display: 'flex',\n  alignItems: {\n    default: 'baseline',\n    ':has([slot=icon]:only-child)': 'center'\n  },\n  justifyContent: 'center',\n  textAlign: 'start',\n  columnGap: 'text-to-visual',\n  font: 'control',\n  fontWeight: 'bold',\n  userSelect: 'none',\n  minHeight: 'control',\n  minWidth: {\n    ':has([slot=icon]:only-child)': 'control'\n  },\n  borderRadius: 'pill',\n  boxSizing: 'border-box',\n  width: 'fit',\n  textDecoration: 'none', // for link buttons\n  paddingX: {\n    default: 'pill',\n    ':has([slot=icon]:only-child)': 0\n  },\n  paddingY: 0,\n  aspectRatio: {\n    ':has([slot=icon]:only-child)': 'square'\n  },\n  transition: 'default',\n  borderStyle: 'solid',\n  borderWidth: {\n    fillStyle: {\n      fill: 0,\n      outline: 2\n    }\n  },\n  '--labelPadding': {\n    type: 'paddingTop',\n    value: centerPadding()\n  },\n  '--iconMargin': {\n    type: 'marginTop',\n    value: {\n      default: fontRelative(-2),\n      ':has([slot=icon]:only-child)': 0\n    }\n  },\n  borderColor: {\n    variant: {\n      primary: baseColor('gray-800'),\n      secondary: baseColor('gray-300')\n    },\n    isDisabled: 'disabled',\n    staticColor: {\n      white: {\n        variant: {\n          primary: baseColor('transparent-white-800'),\n          secondary: baseColor('transparent-white-300')\n        },\n        isDisabled: 'transparent-white-300'\n      },\n      black: {\n        variant: {\n          primary: baseColor('transparent-black-800'),\n          secondary: baseColor('transparent-black-300')\n        },\n        isDisabled: 'transparent-black-300'\n      }\n    },\n    forcedColors: {\n      default: 'ButtonBorder',\n      isHovered: 'Highlight',\n      isDisabled: 'GrayText'\n    }\n  },\n  backgroundColor: {\n    fillStyle: {\n      fill: {\n        variant: {\n          primary: 'neutral',\n          secondary: baseColor('gray-100'),\n          accent: 'accent',\n          negative: 'negative'\n        },\n        isDisabled: 'disabled'\n      },\n      outline: {\n        default: 'transparent',\n        isHovered: 'gray-100',\n        isPressed: 'gray-100',\n        isFocusVisible: 'gray-100'\n      }\n    },\n    staticColor: {\n      white: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: baseColor('transparent-white-800'),\n              secondary: baseColor('transparent-white-100')\n            },\n            isDisabled: 'transparent-white-100'\n          },\n          outline: {\n            default: 'transparent',\n            isHovered: 'transparent-white-100',\n            isPressed: 'transparent-white-100',\n            isFocusVisible: 'transparent-white-100'\n          }\n        }\n      },\n      black: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: baseColor('transparent-black-800'),\n              secondary: baseColor('transparent-black-100')\n            },\n            isDisabled: 'transparent-black-100'\n          },\n          outline: {\n            default: 'transparent',\n            isHovered: 'transparent-black-100',\n            isPressed: 'transparent-black-100',\n            isFocusVisible: 'transparent-black-100'\n          }\n        }\n      }\n    },\n    forcedColors: {\n      fillStyle: {\n        fill: {\n          default: 'ButtonText',\n          isHovered: 'Highlight',\n          isDisabled: 'GrayText'\n        },\n        outline: 'ButtonFace'\n      }\n    }\n  },\n  color: {\n    fillStyle: {\n      fill: {\n        variant: {\n          primary: 'gray-25',\n          secondary: 'neutral',\n          accent: 'white',\n          negative: 'white'\n        },\n        isDisabled: 'disabled'\n      },\n      outline: {\n        default: 'neutral',\n        isDisabled: 'disabled'\n      }\n    },\n    staticColor: {\n      white: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: 'black',\n              secondary: baseColor('transparent-white-800')\n            }\n          },\n          outline: baseColor('transparent-white-800')\n        },\n        isDisabled: 'transparent-white-400'\n      },\n      black: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: 'white',\n              secondary: baseColor('transparent-black-800')\n            }\n          },\n          outline: baseColor('transparent-black-800')\n        },\n        isDisabled: 'transparent-black-400'\n      }\n    },\n    forcedColors: {\n      fillStyle: {\n        fill: {\n          default: 'ButtonFace',\n          isDisabled: 'HighlightText'\n        },\n        outline: {\n          default: 'ButtonText',\n          isDisabled: 'GrayText'\n        }\n      }\n    }\n  },\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  },\n  outlineColor: {\n    default: 'focus-ring',\n    staticColor: {\n      white: 'white',\n      black: 'black'\n    },\n    forcedColors: 'Highlight'\n  },\n  forcedColorAdjust: 'none',\n  disableTapHighlight: true\n}, getAllowedOverrides());\n\nfunction Button(props: ButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ButtonContext);\n  let domRef = useFocusableRef(ref);\n  let overlayTriggerState = useContext(OverlayTriggerStateContext);\n\n  return (\n    <RACButton\n      {...props}\n      ref={domRef}\n      style={pressScale(domRef, props.UNSAFE_style)}\n      className={renderProps => (props.UNSAFE_className || '') + button({\n        ...renderProps,\n        // Retain hover styles when an overlay is open.\n        isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n        variant: props.variant || 'primary',\n        fillStyle: props.fillStyle || 'fill',\n        size: props.size || 'M',\n        staticColor: props.staticColor\n      }, props.styles)}>\n      <Provider\n        values={[\n          [TextContext, {styles: style({paddingY: '--labelPadding', order: 1})}],\n          [IconContext, {\n            render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n            styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n          }]\n        ]}>\n        {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n      </Provider>\n    </RACButton>\n  );\n}\n\n/**\n * Buttons allow users to perform an action.\n * They have multiple styles for various needs, and are ideal for calling attention to\n * where a user needs to do something in order to move forward in a flow.\n */\nlet _Button = forwardRef(Button);\nexport {_Button as Button};\n\nfunction LinkButton(props: LinkButtonProps, ref: FocusableRef<HTMLAnchorElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, LinkButtonContext);\n  let domRef = useFocusableRef(ref);\n  let overlayTriggerState = useContext(OverlayTriggerStateContext);\n\n  return (\n    <Link\n      {...props}\n      ref={domRef}\n      style={pressScale(domRef, props.UNSAFE_style)}\n      className={renderProps => (props.UNSAFE_className || '') + button({\n        ...renderProps,\n        // Retain hover styles when an overlay is open.\n        isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n        variant: props.variant || 'primary',\n        fillStyle: props.fillStyle || 'fill',\n        size: props.size || 'M',\n        staticColor: props.staticColor\n      }, props.styles)}>\n      <Provider\n        values={[\n          [TextContext, {styles: style({paddingY: '--labelPadding', order: 1})}],\n          [IconContext, {\n            render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n            styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n          }]\n        ]}>\n        {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n      </Provider>\n    </Link>\n  );\n}\n\n/**\n * A LinkButton combines the functionality of a link with the appearance of a button. Useful for allowing users to navigate to another page.\n */\nlet _LinkButton = forwardRef(LinkButton);\nexport {_LinkButton as LinkButton};\n"],"names":[],"version":3,"file":"Button.cjs.map"}

package/dist/Button.css.map

@@ -1 +1 @@
-{"mappings":"ACgEe;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;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAoRqB;;;;EAAA;;;;EAAA;;;;EAEyB;;;;EACzC;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAvRL;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AA0OqB","sources":["47c518d02ef77298","packages/@react-spectrum/s2/src/Button.tsx"],"sourcesContent":["@import \"84fda4530d887d61\";\n@import \"58029840d81c849c\";\n@import \"741c49b4968f5e00\";\n@import \"d2d5d6a0faea83be\";\n@import \"7420f4e12e7ef59c\";\n@import \"b849e4ca63c3cc49\";\n@import \"36ff0e1e9ec0e357\";\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 {baseColor, fontRelative, style} from '../style/spectrum-theme' with {type: 'macro'};\nimport {ButtonRenderProps, Link, LinkProps, OverlayTriggerStateContext, Provider, Button as RACButton, ButtonProps as RACButtonProps} from 'react-aria-components';\nimport {centerBaseline} from './CenterBaseline';\nimport {centerPadding, focusRing, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {FocusableRef} from '@react-types/shared';\nimport {IconContext} from './Icon';\nimport {mergeProps} from 'react-aria';\nimport {pressScale} from './pressScale';\nimport {Text, TextContext} from './Content';\nimport {useFocusableRef} from '@react-spectrum/utils';\n\ninterface ButtonStyleProps {\n  /**\n   * The [visual style](https://spectrum.adobe.com/page/button/#Options) of the button.\n   *\n   * @default 'primary'\n   */\n  variant?: 'primary' | 'secondary' | 'accent' | 'negative',\n  /**\n   * The background style of the Button.\n   *\n   * @default 'fill'\n   */\n  fillStyle?: 'fill' | 'outline',\n  /**\n   * The size of the Button.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL',\n  /** The static color style to apply. Useful when the Button appears over a color background. */\n  staticColor?: 'white' | 'black'\n}\n\nexport interface ButtonProps extends Omit<RACButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, StyleProps, ButtonStyleProps {\n  /** The content to display in the Button. */\n  children?: ReactNode\n}\n\nexport interface LinkButtonProps extends Omit<LinkProps, 'className' | 'style' | 'children'>, StyleProps, ButtonStyleProps {\n  /** The content to display in the Button. */\n  children?: ReactNode\n}\n\ninterface ButtonContextValue extends ButtonStyleProps, StyleProps {\n  /** Whether the Button is disabled. */\n  isDisabled?: boolean\n}\n\nexport const ButtonContext = createContext<ButtonContextValue>({});\n\nconst button = style<ButtonRenderProps & ButtonStyleProps>({\n  ...focusRing(),\n  display: 'flex',\n  alignItems: {\n    default: 'baseline',\n    ':has([slot=icon]:only-child)': 'center'\n  },\n  justifyContent: 'center',\n  textAlign: 'start',\n  columnGap: 'text-to-visual',\n  font: 'control',\n  fontWeight: 'bold',\n  userSelect: 'none',\n  minHeight: 'control',\n  minWidth: {\n    ':has([slot=icon]:only-child)': 'control'\n  },\n  borderRadius: 'pill',\n  boxSizing: 'border-box',\n  width: 'fit',\n  textDecoration: 'none', // for link buttons\n  paddingX: {\n    default: 'pill',\n    ':has([slot=icon]:only-child)': 0\n  },\n  paddingY: 0,\n  aspectRatio: {\n    ':has([slot=icon]:only-child)': 'square'\n  },\n  transition: 'default',\n  borderStyle: 'solid',\n  borderWidth: {\n    fillStyle: {\n      fill: 0,\n      outline: 2\n    }\n  },\n  '--labelPadding': {\n    type: 'paddingTop',\n    value: centerPadding()\n  },\n  '--iconMargin': {\n    type: 'marginTop',\n    value: {\n      default: fontRelative(-2),\n      ':has([slot=icon]:only-child)': 0\n    }\n  },\n  borderColor: {\n    variant: {\n      primary: baseColor('gray-800'),\n      secondary: baseColor('gray-300')\n    },\n    isDisabled: 'disabled',\n    staticColor: {\n      white: {\n        variant: {\n          primary: baseColor('transparent-white-800'),\n          secondary: baseColor('transparent-white-300')\n        },\n        isDisabled: 'transparent-white-300'\n      },\n      black: {\n        variant: {\n          primary: baseColor('transparent-black-800'),\n          secondary: baseColor('transparent-black-300')\n        },\n        isDisabled: 'transparent-black-300'\n      }\n    },\n    forcedColors: {\n      default: 'ButtonBorder',\n      isHovered: 'Highlight',\n      isDisabled: 'GrayText'\n    }\n  },\n  backgroundColor: {\n    fillStyle: {\n      fill: {\n        variant: {\n          primary: 'neutral',\n          secondary: baseColor('gray-100'),\n          accent: 'accent',\n          negative: 'negative'\n        },\n        isDisabled: 'disabled'\n      },\n      outline: {\n        default: 'transparent',\n        isHovered: 'gray-100',\n        isPressed: 'gray-100',\n        isFocusVisible: 'gray-100'\n      }\n    },\n    staticColor: {\n      white: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: baseColor('transparent-white-800'),\n              secondary: baseColor('transparent-white-100')\n            },\n            isDisabled: 'transparent-white-100'\n          },\n          outline: {\n            default: 'transparent',\n            isHovered: 'transparent-white-100',\n            isPressed: 'transparent-white-100',\n            isFocusVisible: 'transparent-white-100'\n          }\n        }\n      },\n      black: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: baseColor('transparent-black-800'),\n              secondary: baseColor('transparent-black-100')\n            },\n            isDisabled: 'transparent-black-100'\n          },\n          outline: {\n            default: 'transparent',\n            isHovered: 'transparent-black-100',\n            isPressed: 'transparent-black-100',\n            isFocusVisible: 'transparent-black-100'\n          }\n        }\n      }\n    },\n    forcedColors: {\n      fillStyle: {\n        fill: {\n          default: 'ButtonText',\n          isHovered: 'Highlight',\n          isDisabled: 'GrayText'\n        },\n        outline: 'ButtonFace'\n      }\n    }\n  },\n  color: {\n    fillStyle: {\n      fill: {\n        variant: {\n          primary: 'gray-25',\n          secondary: 'neutral',\n          accent: 'white',\n          negative: 'white'\n        },\n        isDisabled: 'disabled'\n      },\n      outline: {\n        default: 'neutral',\n        isDisabled: 'disabled'\n      }\n    },\n    staticColor: {\n      white: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: 'black',\n              secondary: baseColor('transparent-white-800')\n            }\n          },\n          outline: baseColor('transparent-white-800')\n        },\n        isDisabled: 'transparent-white-400'\n      },\n      black: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: 'white',\n              secondary: baseColor('transparent-black-800')\n            }\n          },\n          outline: baseColor('transparent-black-800')\n        },\n        isDisabled: 'transparent-black-400'\n      }\n    },\n    forcedColors: {\n      fillStyle: {\n        fill: {\n          default: 'ButtonFace',\n          isDisabled: 'HighlightText'\n        },\n        outline: {\n          default: 'ButtonText',\n          isDisabled: 'GrayText'\n        }\n      }\n    }\n  },\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  },\n  outlineColor: {\n    default: 'focus-ring',\n    staticColor: {\n      white: 'white',\n      black: 'black'\n    },\n    forcedColors: 'Highlight'\n  },\n  forcedColorAdjust: 'none',\n  disableTapHighlight: true\n}, getAllowedOverrides());\n\nfunction Button(props: ButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n  let domRef = useFocusableRef(ref);\n  let ctx = useContext(ButtonContext);\n  props = mergeProps(ctx, props);\n  let overlayTriggerState = useContext(OverlayTriggerStateContext);\n\n  return (\n    <RACButton\n      {...props}\n      ref={domRef}\n      style={pressScale(domRef, props.UNSAFE_style)}\n      className={renderProps => (props.UNSAFE_className || '') + button({\n        ...renderProps,\n        // Retain hover styles when an overlay is open.\n        isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n        variant: props.variant || 'primary',\n        fillStyle: props.fillStyle || 'fill',\n        size: props.size || 'M',\n        staticColor: props.staticColor\n      }, props.styles)}>\n      <Provider\n        values={[\n          [TextContext, {className: style({paddingY: '--labelPadding', order: 1})}],\n          [IconContext, {\n            render: centerBaseline({slot: 'icon', className: style({order: 0})}),\n            styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n          }]\n        ]}>\n        {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n      </Provider>\n    </RACButton>\n  );\n}\n\n/**\n * Buttons allow users to perform an action.\n * They have multiple styles for various needs, and are ideal for calling attention to\n * where a user needs to do something in order to move forward in a flow.\n */\nlet _Button = forwardRef(Button);\nexport {_Button as Button};\n\nfunction LinkButton(props: LinkButtonProps, ref: FocusableRef<HTMLAnchorElement>) {\n  let domRef = useFocusableRef(ref);\n  let ctx = useContext(ButtonContext);\n  props = mergeProps(ctx, props);\n  let overlayTriggerState = useContext(OverlayTriggerStateContext);\n\n  return (\n    <Link\n      {...props}\n      ref={domRef}\n      style={pressScale(domRef, props.UNSAFE_style)}\n      className={renderProps => (props.UNSAFE_className || '') + button({\n        ...renderProps,\n        // Retain hover styles when an overlay is open.\n        isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n        variant: props.variant || 'primary',\n        fillStyle: props.fillStyle || 'fill',\n        size: props.size || 'M',\n        staticColor: props.staticColor\n      }, props.styles)}>\n      <Provider\n        values={[\n          [TextContext, {className: style({paddingY: '--labelPadding', order: 1})}],\n          [IconContext, {\n            render: centerBaseline({slot: 'icon', className: style({order: 0})}),\n            styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n          }]\n        ]}>\n        {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n      </Provider>\n    </Link>\n  );\n}\n\n/**\n * A LinkButton combines the functionality of a link with the appearance of a button. Useful for allowing users to navigate to another page.\n */\nlet _LinkButton = forwardRef(LinkButton);\nexport {_LinkButton as LinkButton};\n"],"names":[],"version":3,"file":"Button.css.map"}
+{"mappings":"AC4De;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;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAkRkB;;;;EAAA;;;;EAAA;;;;EAEyB;;;;EACtC;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AArRL;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAyOkB","sources":["47c518d02ef77298","packages/@react-spectrum/s2/src/Button.tsx"],"sourcesContent":["@import \"84fda4530d887d61\";\n@import \"58029840d81c849c\";\n@import \"741c49b4968f5e00\";\n@import \"d2d5d6a0faea83be\";\n@import \"7420f4e12e7ef59c\";\n@import \"b849e4ca63c3cc49\";\n@import \"36ff0e1e9ec0e357\";\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 {baseColor, fontRelative, style} from '../style/spectrum-theme' with {type: 'macro'};\nimport {ButtonRenderProps, ContextValue, Link, LinkProps, OverlayTriggerStateContext, Provider, Button as RACButton, ButtonProps as RACButtonProps} from 'react-aria-components';\nimport {centerBaseline} from './CenterBaseline';\nimport {centerPadding, focusRing, getAllowedOverrides, 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 {pressScale} from './pressScale';\nimport {Text, TextContext} from './Content';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\ninterface ButtonStyleProps {\n  /**\n   * The [visual style](https://spectrum.adobe.com/page/button/#Options) of the button.\n   *\n   * @default 'primary'\n   */\n  variant?: 'primary' | 'secondary' | 'accent' | 'negative',\n  /**\n   * The background style of the Button.\n   *\n   * @default 'fill'\n   */\n  fillStyle?: 'fill' | 'outline',\n  /**\n   * The size of the Button.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL',\n  /** The static color style to apply. Useful when the Button appears over a color background. */\n  staticColor?: 'white' | 'black'\n}\n\nexport interface ButtonProps extends Omit<RACButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, StyleProps, ButtonStyleProps {\n  /** The content to display in the Button. */\n  children?: ReactNode\n}\n\nexport interface LinkButtonProps extends Omit<LinkProps, 'className' | 'style' | 'children'>, StyleProps, ButtonStyleProps {\n  /** The content to display in the Button. */\n  children?: ReactNode\n}\n\nexport const ButtonContext = createContext<ContextValue<ButtonProps, FocusableRefValue<HTMLButtonElement>>>(null);\nexport const LinkButtonContext = createContext<ContextValue<ButtonProps, FocusableRefValue<HTMLAnchorElement>>>(null);\n\nconst button = style<ButtonRenderProps & ButtonStyleProps>({\n  ...focusRing(),\n  display: 'flex',\n  alignItems: {\n    default: 'baseline',\n    ':has([slot=icon]:only-child)': 'center'\n  },\n  justifyContent: 'center',\n  textAlign: 'start',\n  columnGap: 'text-to-visual',\n  font: 'control',\n  fontWeight: 'bold',\n  userSelect: 'none',\n  minHeight: 'control',\n  minWidth: {\n    ':has([slot=icon]:only-child)': 'control'\n  },\n  borderRadius: 'pill',\n  boxSizing: 'border-box',\n  width: 'fit',\n  textDecoration: 'none', // for link buttons\n  paddingX: {\n    default: 'pill',\n    ':has([slot=icon]:only-child)': 0\n  },\n  paddingY: 0,\n  aspectRatio: {\n    ':has([slot=icon]:only-child)': 'square'\n  },\n  transition: 'default',\n  borderStyle: 'solid',\n  borderWidth: {\n    fillStyle: {\n      fill: 0,\n      outline: 2\n    }\n  },\n  '--labelPadding': {\n    type: 'paddingTop',\n    value: centerPadding()\n  },\n  '--iconMargin': {\n    type: 'marginTop',\n    value: {\n      default: fontRelative(-2),\n      ':has([slot=icon]:only-child)': 0\n    }\n  },\n  borderColor: {\n    variant: {\n      primary: baseColor('gray-800'),\n      secondary: baseColor('gray-300')\n    },\n    isDisabled: 'disabled',\n    staticColor: {\n      white: {\n        variant: {\n          primary: baseColor('transparent-white-800'),\n          secondary: baseColor('transparent-white-300')\n        },\n        isDisabled: 'transparent-white-300'\n      },\n      black: {\n        variant: {\n          primary: baseColor('transparent-black-800'),\n          secondary: baseColor('transparent-black-300')\n        },\n        isDisabled: 'transparent-black-300'\n      }\n    },\n    forcedColors: {\n      default: 'ButtonBorder',\n      isHovered: 'Highlight',\n      isDisabled: 'GrayText'\n    }\n  },\n  backgroundColor: {\n    fillStyle: {\n      fill: {\n        variant: {\n          primary: 'neutral',\n          secondary: baseColor('gray-100'),\n          accent: 'accent',\n          negative: 'negative'\n        },\n        isDisabled: 'disabled'\n      },\n      outline: {\n        default: 'transparent',\n        isHovered: 'gray-100',\n        isPressed: 'gray-100',\n        isFocusVisible: 'gray-100'\n      }\n    },\n    staticColor: {\n      white: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: baseColor('transparent-white-800'),\n              secondary: baseColor('transparent-white-100')\n            },\n            isDisabled: 'transparent-white-100'\n          },\n          outline: {\n            default: 'transparent',\n            isHovered: 'transparent-white-100',\n            isPressed: 'transparent-white-100',\n            isFocusVisible: 'transparent-white-100'\n          }\n        }\n      },\n      black: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: baseColor('transparent-black-800'),\n              secondary: baseColor('transparent-black-100')\n            },\n            isDisabled: 'transparent-black-100'\n          },\n          outline: {\n            default: 'transparent',\n            isHovered: 'transparent-black-100',\n            isPressed: 'transparent-black-100',\n            isFocusVisible: 'transparent-black-100'\n          }\n        }\n      }\n    },\n    forcedColors: {\n      fillStyle: {\n        fill: {\n          default: 'ButtonText',\n          isHovered: 'Highlight',\n          isDisabled: 'GrayText'\n        },\n        outline: 'ButtonFace'\n      }\n    }\n  },\n  color: {\n    fillStyle: {\n      fill: {\n        variant: {\n          primary: 'gray-25',\n          secondary: 'neutral',\n          accent: 'white',\n          negative: 'white'\n        },\n        isDisabled: 'disabled'\n      },\n      outline: {\n        default: 'neutral',\n        isDisabled: 'disabled'\n      }\n    },\n    staticColor: {\n      white: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: 'black',\n              secondary: baseColor('transparent-white-800')\n            }\n          },\n          outline: baseColor('transparent-white-800')\n        },\n        isDisabled: 'transparent-white-400'\n      },\n      black: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: 'white',\n              secondary: baseColor('transparent-black-800')\n            }\n          },\n          outline: baseColor('transparent-black-800')\n        },\n        isDisabled: 'transparent-black-400'\n      }\n    },\n    forcedColors: {\n      fillStyle: {\n        fill: {\n          default: 'ButtonFace',\n          isDisabled: 'HighlightText'\n        },\n        outline: {\n          default: 'ButtonText',\n          isDisabled: 'GrayText'\n        }\n      }\n    }\n  },\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  },\n  outlineColor: {\n    default: 'focus-ring',\n    staticColor: {\n      white: 'white',\n      black: 'black'\n    },\n    forcedColors: 'Highlight'\n  },\n  forcedColorAdjust: 'none',\n  disableTapHighlight: true\n}, getAllowedOverrides());\n\nfunction Button(props: ButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ButtonContext);\n  let domRef = useFocusableRef(ref);\n  let overlayTriggerState = useContext(OverlayTriggerStateContext);\n\n  return (\n    <RACButton\n      {...props}\n      ref={domRef}\n      style={pressScale(domRef, props.UNSAFE_style)}\n      className={renderProps => (props.UNSAFE_className || '') + button({\n        ...renderProps,\n        // Retain hover styles when an overlay is open.\n        isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n        variant: props.variant || 'primary',\n        fillStyle: props.fillStyle || 'fill',\n        size: props.size || 'M',\n        staticColor: props.staticColor\n      }, props.styles)}>\n      <Provider\n        values={[\n          [TextContext, {styles: style({paddingY: '--labelPadding', order: 1})}],\n          [IconContext, {\n            render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n            styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n          }]\n        ]}>\n        {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n      </Provider>\n    </RACButton>\n  );\n}\n\n/**\n * Buttons allow users to perform an action.\n * They have multiple styles for various needs, and are ideal for calling attention to\n * where a user needs to do something in order to move forward in a flow.\n */\nlet _Button = forwardRef(Button);\nexport {_Button as Button};\n\nfunction LinkButton(props: LinkButtonProps, ref: FocusableRef<HTMLAnchorElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, LinkButtonContext);\n  let domRef = useFocusableRef(ref);\n  let overlayTriggerState = useContext(OverlayTriggerStateContext);\n\n  return (\n    <Link\n      {...props}\n      ref={domRef}\n      style={pressScale(domRef, props.UNSAFE_style)}\n      className={renderProps => (props.UNSAFE_className || '') + button({\n        ...renderProps,\n        // Retain hover styles when an overlay is open.\n        isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n        variant: props.variant || 'primary',\n        fillStyle: props.fillStyle || 'fill',\n        size: props.size || 'M',\n        staticColor: props.staticColor\n      }, props.styles)}>\n      <Provider\n        values={[\n          [TextContext, {styles: style({paddingY: '--labelPadding', order: 1})}],\n          [IconContext, {\n            render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n            styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n          }]\n        ]}>\n        {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n      </Provider>\n    </Link>\n  );\n}\n\n/**\n * A LinkButton combines the functionality of a link with the appearance of a button. Useful for allowing users to navigate to another page.\n */\nlet _LinkButton = forwardRef(LinkButton);\nexport {_LinkButton as LinkButton};\n"],"names":[],"version":3,"file":"Button.css.map"}

package/dist/Button.mjs

@@ -3,10 +3,10 @@ import {centerBaseline as $1f4b04be3f24aae3$export$9d7e2342a7e53afa} from "./Cen
 import {IconContext as $ac8c32e6775ddd1f$export$a49f528ae1a4d0ed} from "../icons/Icon.mjs";
 import {pressScale as $10ea7662e51a285b$export$56e8cba416805d8d} from "./pressScale.mjs";
 import {Text as $8e847109a6ab556d$export$5f1af8db9871e1d6, TextContext as $8e847109a6ab556d$export$9afb8bc826b033ea} from "./Content.mjs";
+import {useSpectrumContextProps as $5ce63c423902f47d$export$764f6146fadd77f7} from "./useSpectrumContextProps.mjs";
 import {jsx as $7BBHC$jsx} from "react/jsx-runtime";
 import {OverlayTriggerStateContext as $7BBHC$OverlayTriggerStateContext, Button as $7BBHC$Button, Provider as $7BBHC$Provider, Link as $7BBHC$Link} from "react-aria-components";
 import {createContext as $7BBHC$createContext, useContext as $7BBHC$useContext, forwardRef as $7BBHC$forwardRef} from "react";
-import {mergeProps as $7BBHC$mergeProps} from "react-aria";
 import {useFocusableRef as $7BBHC$useFocusableRef} from "@react-spectrum/utils";
 
 /*
@@ -28,10 +28,11 @@ import {useFocusableRef as $7BBHC$useFocusableRef} from "@react-spectrum/utils";
 
 
 
-const $067ea9f64ccd4e8e$export$24d547caef80ccd1 = /*#__PURE__*/ (0, $7BBHC$createContext)({});
+const $067ea9f64ccd4e8e$export$24d547caef80ccd1 = /*#__PURE__*/ (0, $7BBHC$createContext)(null);
+const $067ea9f64ccd4e8e$export$1c1a176f3b9e48d3 = /*#__PURE__*/ (0, $7BBHC$createContext)(null);
 const $067ea9f64ccd4e8e$var$button = function anonymous(props, overrides) {
     let rules = " .";
-    let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|l|q|r|_9|_8|h|_5|_4|__A|__c|__d|__a|__b|U|__Q|X|Z|V|W)[^\s]+/g) || [];
+    let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|_9|_8|h|_5|_4|__A|__c|__d|__a|__b|U|__Q|X|Z|V|W|l|q|r)[^\s]+/g) || [];
     rules += matches.join('');
     let $q = false;
     let $l = false;
@@ -326,9 +327,8 @@ const $067ea9f64ccd4e8e$var$button = function anonymous(props, overrides) {
     return rules;
 };
 function $067ea9f64ccd4e8e$var$Button(props, ref) {
+    [props, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $067ea9f64ccd4e8e$export$24d547caef80ccd1);
     let domRef = (0, $7BBHC$useFocusableRef)(ref);
-    let ctx = (0, $7BBHC$useContext)($067ea9f64ccd4e8e$export$24d547caef80ccd1);
-    props = (0, $7BBHC$mergeProps)(ctx, props);
     let overlayTriggerState = (0, $7BBHC$useContext)((0, $7BBHC$OverlayTriggerStateContext));
     return /*#__PURE__*/ (0, $7BBHC$jsx)((0, $7BBHC$Button), {
         ...props,
@@ -348,7 +348,7 @@ function $067ea9f64ccd4e8e$var$Button(props, ref) {
                 [
                     (0, $8e847109a6ab556d$export$9afb8bc826b033ea),
                     {
-                        className: " . E-1gogtue F-1gogtue __A-3t1y"
+                        styles: " . E-1gogtue F-1gogtue __A-3t1y"
                     }
                 ],
                 [
@@ -356,7 +356,7 @@ function $067ea9f64ccd4e8e$var$Button(props, ref) {
                     {
                         render: (0, $1f4b04be3f24aae3$export$9d7e2342a7e53afa)({
                             slot: 'icon',
-                            className: " . __A-3t1x"
+                            styles: " . __A-3t1x"
                         }),
                         styles: " . l-1sthc3k k-1sthc3k y-oelgqu _8-3t1x"
                     }
@@ -374,9 +374,8 @@ function $067ea9f64ccd4e8e$var$Button(props, ref) {
  * where a user needs to do something in order to move forward in a flow.
  */ let $067ea9f64ccd4e8e$export$353f5b6fc5456de1 = /*#__PURE__*/ (0, $7BBHC$forwardRef)($067ea9f64ccd4e8e$var$Button);
 function $067ea9f64ccd4e8e$var$LinkButton(props, ref) {
+    [props, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $067ea9f64ccd4e8e$export$1c1a176f3b9e48d3);
     let domRef = (0, $7BBHC$useFocusableRef)(ref);
-    let ctx = (0, $7BBHC$useContext)($067ea9f64ccd4e8e$export$24d547caef80ccd1);
-    props = (0, $7BBHC$mergeProps)(ctx, props);
     let overlayTriggerState = (0, $7BBHC$useContext)((0, $7BBHC$OverlayTriggerStateContext));
     return /*#__PURE__*/ (0, $7BBHC$jsx)((0, $7BBHC$Link), {
         ...props,
@@ -396,7 +395,7 @@ function $067ea9f64ccd4e8e$var$LinkButton(props, ref) {
                 [
                     (0, $8e847109a6ab556d$export$9afb8bc826b033ea),
                     {
-                        className: " . E-1gogtue F-1gogtue __A-3t1y"
+                        styles: " . E-1gogtue F-1gogtue __A-3t1y"
                     }
                 ],
                 [
@@ -404,7 +403,7 @@ function $067ea9f64ccd4e8e$var$LinkButton(props, ref) {
                     {
                         render: (0, $1f4b04be3f24aae3$export$9d7e2342a7e53afa)({
                             slot: 'icon',
-                            className: " . __A-3t1x"
+                            styles: " . __A-3t1x"
                         }),
                         styles: " . l-1sthc3k k-1sthc3k y-oelgqu _8-3t1x"
                     }
@@ -421,5 +420,5 @@ function $067ea9f64ccd4e8e$var$LinkButton(props, ref) {
  */ let $067ea9f64ccd4e8e$export$29d11c0fe2fc51d8 = /*#__PURE__*/ (0, $7BBHC$forwardRef)($067ea9f64ccd4e8e$var$LinkButton);
 
 
-export {$067ea9f64ccd4e8e$export$24d547caef80ccd1 as ButtonContext, $067ea9f64ccd4e8e$export$353f5b6fc5456de1 as Button, $067ea9f64ccd4e8e$export$29d11c0fe2fc51d8 as LinkButton};
+export {$067ea9f64ccd4e8e$export$24d547caef80ccd1 as ButtonContext, $067ea9f64ccd4e8e$export$1c1a176f3b9e48d3 as LinkButtonContext, $067ea9f64ccd4e8e$export$353f5b6fc5456de1 as Button, $067ea9f64ccd4e8e$export$29d11c0fe2fc51d8 as LinkButton};
 //# sourceMappingURL=Button.mjs.map