@react-spectrum/s2 3.0.0-nightly-101d0772b-250113 → 3.0.0-nightly-1b425caa2-250114

package/src/Tooltip.tsx

@@ -24,7 +24,6 @@ import {ColorScheme} from '@react-types/provider';
 import {ColorSchemeContext} from './Provider';
 import {createContext, forwardRef, MutableRefObject, ReactNode, useCallback, useContext, useState} from 'react';
 import {DOMRef} from '@react-types/shared';
-import {keyframes} from '../style/style-macro' with {type: 'macro'};
 import {style} from '../style' with {type: 'macro'};
 import {useDOMRef} from '@react-spectrum/utils';
 
@@ -44,18 +43,6 @@ export interface TooltipProps extends Omit<AriaTooltipProps, 'children' | 'class
   children?: ReactNode
 }
 
-const slide = keyframes(`
-  from {
-    transform: translate(var(--originX), var(--originY));
-    opacity: 0;
-  }
-
-  to {
-    transform: translateY(0);
-    opacity: 1;
-  }
-`);
-
 const tooltip = style<TooltipRenderProps & {colorScheme: ColorScheme | 'light dark' | null}>({
   ...colorScheme(),
   justifyContent: 'center',
@@ -82,42 +69,38 @@ const tooltip = style<TooltipRenderProps & {colorScheme: ColorScheme | 'light da
   paddingX: 'edge-to-text',
   paddingY: centerPadding(),
   margin: 8,
-  animation: {
-    isEntering: slide,
-    isExiting: slide
-  },
-  animationDuration: {
-    isEntering: 200,
-    isExiting: 200
-  },
-  animationDirection: {
-    isEntering: 'normal',
-    isExiting: 'reverse'
-  },
-  animationTimingFunction: {
+  transition: 'default',
+  transitionDuration: 200,
+  transitionTimingFunction: {
     isExiting: 'in'
   },
-  '--originX': {
-    type: 'marginTop',
-    value: {
-      placement: {
-        top: 0,
-        bottom: 0,
-        left: 4,
-        right: -4
+  translateX: {
+    placement: {
+      left: {
+        isEntering: 4,
+        isExiting: 4
+      },
+      right: {
+        isEntering: -4,
+        isExiting: -4
       }
     }
   },
-  '--originY': {
-    type: 'marginTop',
-    value: {
-      placement: {
-        top: 4,
-        bottom: -4,
-        left: 0,
-        right: -0
+  translateY: {
+    placement: {
+      top: {
+        isEntering: 4,
+        isExiting: 4
+      },
+      bottom: {
+        isEntering: -4,
+        isExiting: -4
       }
     }
+  },
+  opacity: {
+    isEntering: 0,
+    isExiting: 0
   }
 });
 

package/dist/TabsPicker.cjs

@@ -1,388 +0,0 @@
-require("./TabsPicker.css");
-var $e991cbcdf82ced71$exports = require("./CenterBaseline.cjs");
-var $e741ea6b88ce4866$exports = require("./Menu.cjs");
-var $dba2b18fc5727f9b$exports = require("./Checkmark.cjs");
-var $1df9f1c9262ce5df$exports = require("./Chevron.cjs");
-var $a0b996a550bb0891$exports = require("./Field.cjs");
-var $6367bc87eb7d24ad$exports = require("./Content.cjs");
-var $bde97c91243ed164$exports = require("../icons/Icon.cjs");
-var $4526404114e78c80$exports = require("./intlStrings.cjs");
-var $493371ef39bf7a55$exports = require("./Popover.cjs");
-var $2061c83559b50a66$exports = require("./pressScale.cjs");
-var $bfa4962d90c8af48$exports = require("./Form.cjs");
-var $ac757a4c2bd72aee$exports = require("../icons/useSpectrumContextProps.cjs");
-var $7pV4n$reactjsxruntime = require("react/jsx-runtime");
-var $7pV4n$reactariacomponents = require("react-aria-components");
-var $7pV4n$react = require("react");
-var $7pV4n$reactspectrumutils = require("@react-spectrum/utils");
-var $7pV4n$reactariai18n = require("@react-aria/i18n");
-
-
-function $parcel$interopDefault(a) {
-  return a && a.__esModule ? a.default : a;
-}
-
-function $parcel$export(e, n, v, s) {
-  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
-}
-
-$parcel$export(module.exports, "Picker", () => $9d2c38978395d44a$export$ba25329847403e11);
-$parcel$export(module.exports, "PickerItem", () => $9d2c38978395d44a$export$d601881f38163e28);
-/*
- * Copyright 2024 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */ 
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-const $9d2c38978395d44a$export$b72b8dade9393cd5 = /*#__PURE__*/ (0, $7pV4n$react.createContext)(null);
-const $9d2c38978395d44a$var$inputButton = function anonymous(props) {
-    let rules = " .";
-    if (props.isFocusVisible) rules += ' _Mb';
-    else rules += ' _Ma';
-    rules += ' da_____M';
-    rules += ' dx';
-    rules += ' _Oc';
-    rules += ' _N-3t1z';
-    rules += ' __b-g2ozi1';
-    rules += ' __c-g2ozi1';
-    rules += ' __d-g2ozi1';
-    rules += ' __e-g2ozi1';
-    if (props.size === "XL") rules += ' qj';
-    else if (props.size === "L") rules += ' qi';
-    else if (props.size === "S") rules += ' qh';
-    else if (props.size === "XS") rules += ' qg';
-    else rules += ' qf';
-    if (props.isQuiet) rules += ' __na';
-    else rules += ' __n-1s8glxue';
-    if (props.size === "XL") rules += ' -usygro_l-____g';
-    else if (props.size === "L") rules += ' -usygro_l-___0';
-    else if (props.size === "S") rules += ' -usygro_l-___u';
-    else rules += ' -usygro_l-___K';
-    rules += ' m-rwozxi';
-    rules += ' Vc';
-    rules += ' _d-bc1l9oh';
-    rules += ' _d-1uotwbwg';
-    rules += ' _d-eo0c6sf';
-    rules += ' _d-enzzrge';
-    rules += ' _d-enzykdd';
-    rules += ' _d-enzwzjc';
-    rules += ' _d-enzrfpb';
-    rules += ' _da';
-    rules += ' _ebf';
-    rules += ' _ee';
-    rules += ' _fb';
-    rules += ' _g-1x99dlob';
-    rules += ' _ga';
-    if (props.isDisabled) rules += ' aj';
-    else {
-        if (props.isPressed) rules += ' ao';
-        else if (props.isFocusVisible) rules += ' ao';
-        else if (props.isHovered) rules += ' ao';
-        else rules += ' an';
-    }
-    rules += ' _0d';
-    rules += ' _ka';
-    rules += ' wf';
-    rules += ' _wb';
-    rules += ' _xb';
-    rules += ' _yb';
-    rules += ' _zb';
-    rules += ' _2c';
-    rules += ' _Pa';
-    rules += ' _R-375x7f';
-    rules += ' _Sa';
-    rules += ' jbH';
-    rules += ' jG';
-    rules += ' C-375tnm';
-    rules += ' D-375tnn';
-    rules += ' ba';
-    if (props.isQuiet) rules += ' rd';
-    rules += ' __S-yksgrp';
-    if (props.density === "compact") rules += ' kU';
-    else rules += ' k_a';
-    rules += ' __oa';
-    rules += ' -_375tnm_C-a';
-    rules += ' -_375tnn_D-a';
-    return rules;
-};
-let $9d2c38978395d44a$export$b1e5508a851be14d = function anonymous(props) {
-    let rules = " .";
-    rules += ' _Ma';
-    rules += ' _0f';
-    rules += ' __i-n6rb9a';
-    rules += ' __oa';
-    rules += ' p-17zqamw';
-    rules += ' __wa';
-    rules += ' __xa';
-    rules += ' Ed';
-    rules += ' Fd';
-    rules += ' Cd';
-    rules += ' Dd';
-    rules += ' _d-bc1l9oh';
-    rules += ' _d-1uotwbwg';
-    rules += ' _d-eo0c6sf';
-    rules += ' _d-enzzrge';
-    rules += ' _d-enzykdd';
-    rules += ' _d-enzwzjc';
-    rules += ' _d-enzrfpb';
-    rules += ' _da';
-    if (props.size === "XL") {
-        rules += ' _ebj';
-        rules += ' _ei';
-    } else if (props.size === "L") {
-        rules += ' _ebh';
-        rules += ' _eg';
-    } else if (props.size === "S") {
-        rules += ' _ebd';
-        rules += ' _ec';
-    } else if (props.size === "XS") {
-        rules += ' _ebb';
-        rules += ' _ea';
-    } else {
-        rules += ' _ebf';
-        rules += ' _ee';
-    }
-    return rules;
-};
-const $9d2c38978395d44a$var$valueStyles = " . __a-3t1x __wb __xb _na _qb _0d _2c kb";
-const $9d2c38978395d44a$var$iconStyles = " . _9-3t1x R-3hn0u -rwx0fg_e-b";
-const $9d2c38978395d44a$var$iconCenterWrapper = function anonymous(props) {
-    let rules = " .";
-    rules += ' _0d';
-    rules += ' __b-qb5q8i';
-    rules += ' __c-qb5q8i';
-    rules += ' __d-qb5q8i';
-    rules += ' __e-qb5q8i';
-    if (props.labelBehavior === "hide") rules += ' C-ve8p9e';
-    return rules;
-};
-let $9d2c38978395d44a$var$InsideSelectValueContext = /*#__PURE__*/ (0, $7pV4n$react.createContext)(false);
-function $9d2c38978395d44a$var$Picker(props1, ref) {
-    let stringFormatter = (0, $7pV4n$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($4526404114e78c80$exports))), '@react-spectrum/s2');
-    [props1, ref] = (0, $ac757a4c2bd72aee$exports.useSpectrumContextProps)(props1, ref, $9d2c38978395d44a$export$b72b8dade9393cd5);
-    let domRef = (0, $7pV4n$reactspectrumutils.useFocusableRef)(ref);
-    props1 = (0, $bfa4962d90c8af48$exports.useFormProps)(props1);
-    let { direction: direction = 'bottom', align: align = 'start', shouldFlip: shouldFlip = true, children: children, items: items, placeholder: placeholder = stringFormatter.format('picker.placeholder'), density: density, labelBehavior: labelBehavior = 'show', ...pickerProps } = props1;
-    let isQuiet = true;
-    const menuOffset = 6;
-    const size = 'M';
-    return /*#__PURE__*/ (0, $7pV4n$reactjsxruntime.jsx)((0, $7pV4n$reactariacomponents.Select), {
-        ...pickerProps,
-        placeholder: placeholder,
-        children: ({ isOpen: isOpen })=>/*#__PURE__*/ (0, $7pV4n$reactjsxruntime.jsxs)((0, $7pV4n$reactjsxruntime.Fragment), {
-                children: [
-                    /*#__PURE__*/ (0, $7pV4n$reactjsxruntime.jsx)((0, $a0b996a550bb0891$exports.FieldLabel), {
-                        isQuiet: isQuiet
-                    }),
-                    /*#__PURE__*/ (0, $7pV4n$reactjsxruntime.jsxs)((0, $7pV4n$reactariacomponents.Button), {
-                        ref: domRef,
-                        style: (renderProps)=>(0, $2061c83559b50a66$exports.pressScale)(domRef)(renderProps),
-                        // Prevent press scale from sticking while Picker is open.
-                        // @ts-ignore
-                        isPressed: false,
-                        className: (renderProps)=>$9d2c38978395d44a$var$inputButton({
-                                ...renderProps,
-                                size: 'M',
-                                isOpen: isOpen,
-                                isQuiet: isQuiet,
-                                density: density
-                            }),
-                        children: [
-                            /*#__PURE__*/ (0, $7pV4n$reactjsxruntime.jsx)((0, $7pV4n$reactariacomponents.SelectValue), {
-                                className: $9d2c38978395d44a$var$valueStyles + ' ' + "-u6zm92",
-                                children: ({ defaultChildren: defaultChildren })=>{
-                                    return /*#__PURE__*/ (0, $7pV4n$reactjsxruntime.jsx)((0, $7pV4n$reactariacomponents.Provider), {
-                                        values: [
-                                            [
-                                                (0, $bde97c91243ed164$exports.IconContext),
-                                                {
-                                                    slots: {
-                                                        icon: {
-                                                            render: (0, $e991cbcdf82ced71$exports.centerBaseline)({
-                                                                slot: 'icon',
-                                                                styles: $9d2c38978395d44a$var$iconCenterWrapper({
-                                                                    labelBehavior: labelBehavior
-                                                                })
-                                                            }),
-                                                            styles: (0, $e741ea6b88ce4866$exports.icon)
-                                                        }
-                                                    }
-                                                }
-                                            ],
-                                            [
-                                                (0, $6367bc87eb7d24ad$exports.TextContext),
-                                                {
-                                                    slots: {
-                                                        // Default slot is useful when converting other collections to PickerItems.
-                                                        [(0, $7pV4n$reactariacomponents.DEFAULT_SLOT)]: {
-                                                            styles: function anonymous(props) {
-                                                                let rules = " .";
-                                                                if (props.labelBehavior === "hide") rules += ' _0j';
-                                                                else rules += ' _0a';
-                                                                rules += ' __a-3t1y';
-                                                                rules += ' __wb';
-                                                                rules += ' __xb';
-                                                                rules += ' _na';
-                                                                rules += ' _qb';
-                                                                return rules;
-                                                            }({
-                                                                labelBehavior: labelBehavior
-                                                            })
-                                                        }
-                                                    }
-                                                }
-                                            ],
-                                            [
-                                                $9d2c38978395d44a$var$InsideSelectValueContext,
-                                                true
-                                            ]
-                                        ],
-                                        children: defaultChildren
-                                    });
-                                }
-                            }),
-                            /*#__PURE__*/ (0, $7pV4n$reactjsxruntime.jsx)((0, $1df9f1c9262ce5df$exports.default), {
-                                size: size,
-                                className: $9d2c38978395d44a$var$iconStyles
-                            })
-                        ]
-                    }),
-                    /*#__PURE__*/ (0, $7pV4n$reactjsxruntime.jsx)((0, $493371ef39bf7a55$exports.PopoverBase), {
-                        hideArrow: true,
-                        offset: menuOffset,
-                        placement: `${direction} ${align}`,
-                        shouldFlip: shouldFlip,
-                        styles: " . y-375tp4 q___u l-13f72lm -_375tp4_y-M",
-                        children: /*#__PURE__*/ (0, $7pV4n$reactjsxruntime.jsx)((0, $7pV4n$reactariacomponents.Provider), {
-                            values: [
-                                [
-                                    (0, $6367bc87eb7d24ad$exports.HeaderContext),
-                                    {
-                                        styles: (0, $e741ea6b88ce4866$exports.sectionHeader)({
-                                            size: size
-                                        })
-                                    }
-                                ],
-                                [
-                                    (0, $6367bc87eb7d24ad$exports.HeadingContext),
-                                    {
-                                        styles: (0, $e741ea6b88ce4866$exports.sectionHeading)
-                                    }
-                                ],
-                                [
-                                    (0, $6367bc87eb7d24ad$exports.TextContext),
-                                    {
-                                        slots: {
-                                            description: {
-                                                styles: (0, $e741ea6b88ce4866$exports.description)({
-                                                    size: size
-                                                })
-                                            }
-                                        }
-                                    }
-                                ]
-                            ],
-                            children: /*#__PURE__*/ (0, $7pV4n$reactjsxruntime.jsx)((0, $7pV4n$reactariacomponents.ListBox), {
-                                items: items,
-                                className: $9d2c38978395d44a$export$b1e5508a851be14d,
-                                children: children
-                            })
-                        })
-                    })
-                ]
-            })
-    });
-}
-/**
- * Pickers allow users to choose a single option from a collapsible list of options when space is limited.
- */ let $9d2c38978395d44a$export$ba25329847403e11 = /*#__PURE__*/ (0, $7pV4n$react.forwardRef)($9d2c38978395d44a$var$Picker);
-function $9d2c38978395d44a$export$d601881f38163e28(props) {
-    let ref = (0, $7pV4n$react.useRef)(null);
-    let isLink = props.href != null;
-    const size = 'M';
-    return /*#__PURE__*/ (0, $7pV4n$reactjsxruntime.jsx)((0, $7pV4n$reactariacomponents.ListBoxItem), {
-        ...props,
-        ref: ref,
-        textValue: props.textValue || (typeof props.children === 'string' ? props.children : undefined),
-        style: (0, $2061c83559b50a66$exports.pressScale)(ref, props.UNSAFE_style),
-        className: (renderProps)=>(props.UNSAFE_className || '') + (0, $e741ea6b88ce4866$exports.menuitem)({
-                ...renderProps,
-                size: size,
-                isLink: isLink
-            }, props.styles),
-        children: (renderProps)=>{
-            let { children: children } = props;
-            return /*#__PURE__*/ (0, $7pV4n$reactjsxruntime.jsx)($9d2c38978395d44a$var$DefaultProvider, {
-                context: (0, $bde97c91243ed164$exports.IconContext),
-                value: {
-                    slots: {
-                        icon: {
-                            render: (0, $e991cbcdf82ced71$exports.centerBaseline)({
-                                slot: 'icon',
-                                styles: $9d2c38978395d44a$var$iconCenterWrapper({})
-                            }),
-                            styles: (0, $e741ea6b88ce4866$exports.icon)
-                        }
-                    }
-                },
-                children: /*#__PURE__*/ (0, $7pV4n$reactjsxruntime.jsxs)($9d2c38978395d44a$var$DefaultProvider, {
-                    context: (0, $6367bc87eb7d24ad$exports.TextContext),
-                    value: {
-                        slots: {
-                            [(0, $7pV4n$reactariacomponents.DEFAULT_SLOT)]: {
-                                styles: (0, $e741ea6b88ce4866$exports.label)({
-                                    size: size
-                                })
-                            }
-                        }
-                    },
-                    children: [
-                        !isLink && /*#__PURE__*/ (0, $7pV4n$reactjsxruntime.jsx)((0, $dba2b18fc5727f9b$exports.default), {
-                            size: size,
-                            className: (0, $e741ea6b88ce4866$exports.checkmark)({
-                                ...renderProps,
-                                size: size
-                            })
-                        }),
-                        typeof children === 'string' ? /*#__PURE__*/ (0, $7pV4n$reactjsxruntime.jsx)((0, $6367bc87eb7d24ad$exports.Text), {
-                            children: children
-                        }) : children
-                    ]
-                })
-            });
-        }
-    });
-}
-// A Context.Provider that only sets a value if not inside SelectValue.
-function $9d2c38978395d44a$var$DefaultProvider({ context: context, value: value, children: children }) {
-    let inSelectValue = (0, $7pV4n$react.useContext)($9d2c38978395d44a$var$InsideSelectValueContext);
-    if (inSelectValue) return children;
-    return /*#__PURE__*/ (0, $7pV4n$reactjsxruntime.jsx)(context.Provider, {
-        value: value,
-        children: children
-    });
-}
-
-
-//# sourceMappingURL=TabsPicker.cjs.map

package/dist/TabsPicker.cjs.map

@@ -1 +0,0 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;;;;AAqFM,MAAM,0DAAgB,CAAA,GAAA,0BAAY,EAAiF;AAE1H,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCC,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYX,MAAM;AAQN,MAAM;AASN,MAAM;;;;;;;;;;AAUN,IAAI,+DAA2B,CAAA,GAAA,0BAAY,EAAE;AAE7C,SAAS,6BAAyB,MAAqB,EAAE,GAAoC;IAC3F,IAAI,kBAAkB,CAAA,GAAA,gDAA0B,EAAE,CAAA,GAAA,mDAAW,GAAG;IAChE,CAAC,QAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,QAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE;IAC7B,SAAQ,CAAA,GAAA,sCAAW,EAAE;IACrB,IAAI,aACF,YAAY,iBACZ,QAAQ,qBACR,aAAa,gBACb,QAAQ,SACR,KAAK,eACL,cAAc,gBAAgB,MAAM,CAAC,gCACrC,OAAO,iBACP,gBAAgB,QAChB,GAAG,aACJ,GAAG;IACJ,IAAI,UAAU;IAEd,MAAM,aAAqB;IAC3B,MAAM,OAAO;IAEb,qBACE,gCAAC,CAAA,GAAA,iCAAS;QACP,GAAG,WAAW;QACf,aAAa;kBACZ,CAAC,UAAC,MAAM,EAAC,iBACR;;kCACE,gCAAC,CAAA,GAAA,oCAAS;wBAAE,SAAS;;kCACrB,iCAAC,CAAA,GAAA,iCAAK;wBACJ,KAAK;wBACL,OAAO,CAAA,cAAe,CAAA,GAAA,oCAAS,EAAE,QAAQ;wBACzC,0DAA0D;wBAC1D,aAAa;wBACb,WAAW;wBACX,WAAW,CAAA,cAAe,kCAAY;gCACpC,GAAG,WAAW;gCACd,MAAM;wCACN;yCACA;yCACA;4BACF;;0CACA,gCAAC,CAAA,GAAA,sCAAU;gCAAE,WAAW,oCAAc;0CACnC,CAAC,mBAAC,eAAe,EAAC;oCACjB,qBACE,gCAAC,CAAA,GAAA,mCAAO;wCACN,QAAQ;4CACN;gDAAC,CAAA,GAAA,qCAAU;gDAAG;oDACZ,OAAO;wDACL,MAAM;4DACJ,QAAQ,CAAA,GAAA,wCAAa,EAAE;gEAAC,MAAM;gEAAQ,QAAQ,wCAAkB;mFAAC;gEAAa;4DAAE;4DAChF,QAAQ,CAAA,GAAA,8BAAG;wDACb;oDACF;gDACF;6CAAE;4CACF;gDAAC,CAAA,GAAA,qCAAU;gDAAG;oDACZ,OAAO;wDACL,2EAA2E;wDAC3E,CAAC,CAAA,GAAA,uCAAW,EAAE,EAAE;4DAAC,QAAQ;;;;;;;;;;8DAStB;+EAAC;4DAAa;wDAAE;oDACrB;gDACF;6CAAE;4CACF;gDAAC;gDAA0B;6CAAK;yCACjC;kDACA;;gCAGP;;0CAEF,gCAAC,CAAA,GAAA,iCAAU;gCACT,MAAM;gCACN,WAAW;;;;kCAEf,gCAAC,CAAA,GAAA,qCAAU;wBACT,SAAS;wBACT,QAAQ;wBACR,WAAW,GAAG,UAAU,CAAC,EAAE,OAAO;wBAClC,YAAY;wBACZ,MAAM;kCAKN,cAAA,gCAAC,CAAA,GAAA,mCAAO;4BACN,QAAQ;gCACN;oCAAC,CAAA,GAAA,uCAAY;oCAAG;wCAAC,QAAQ,CAAA,GAAA,uCAAY,EAAE;kDAAC;wCAAI;oCAAE;iCAAE;gCAChD;oCAAC,CAAA,GAAA,wCAAa;oCAAG;wCAAC,QAAQ,CAAA,GAAA,wCAAa;oCAAC;iCAAE;gCAC1C;oCAAC,CAAA,GAAA,qCAAU;oCAAG;wCACZ,OAAO;4CACL,aAAa;gDAAC,QAAQ,CAAA,GAAA,qCAAU,EAAE;0DAAC;gDAAI;4CAAE;wCAC3C;oCACF;iCAAE;6BACH;sCACD,cAAA,gCAAC,CAAA,GAAA,kCAAM;gCACL,OAAO;gCACP,WAAW;0CACV;;;;;;;AAQjB;AAEA;;CAEC,GACD,IAAI,4CAAwB,AAAd,WAAW,GAAI,CAAA,GAAA,uBAAS,EAAqB;AAOpD,SAAS,0CAAW,KAAsB;IAC/C,IAAI,MAAM,CAAA,GAAA,mBAAK,EAAE;IACjB,IAAI,SAAS,MAAM,IAAI,IAAI;IAC3B,MAAM,OAAO;IACb,qBACE,gCAAC,CAAA,GAAA,sCAAU;QACR,GAAG,KAAK;QACT,KAAK;QACL,WAAW,MAAM,SAAS,IAAK,CAAA,OAAO,MAAM,QAAQ,KAAK,WAAW,MAAM,QAAQ,GAAa,SAAQ;QACvG,OAAO,CAAA,GAAA,oCAAS,EAAE,KAAK,MAAM,YAAY;QACzC,WAAW,CAAA,cAAe,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,CAAA,GAAA,kCAAO,EAAE;gBAAC,GAAG,WAAW;sBAAE;wBAAM;YAAM,GAAG,MAAM,MAAM;kBAC/G,CAAC;YACA,IAAI,YAAC,QAAQ,EAAC,GAAG;YACjB,qBACE,gCAAC;gBACC,SAAS,CAAA,GAAA,qCAAU;gBACnB,OAAO;oBAAC,OAAO;wBACb,MAAM;4BAAC,QAAQ,CAAA,GAAA,wCAAa,EAAE;gCAAC,MAAM;gCAAQ,QAAQ,wCAAkB,CAAC;4BAAE;4BAAI,QAAQ,CAAA,GAAA,8BAAG;wBAAC;oBAC5F;gBAAC;0BACD,cAAA,iCAAC;oBACC,SAAS,CAAA,GAAA,qCAAU;oBACnB,OAAO;wBACL,OAAO;4BACL,CAAC,CAAA,GAAA,uCAAW,EAAE,EAAE;gCAAC,QAAQ,CAAA,GAAA,+BAAI,EAAE;0CAAC;gCAAI;4BAAE;wBACxC;oBACF;;wBACC,CAAC,wBAAU,gCAAC,CAAA,GAAA,iCAAY;4BAAE,MAAM;4BAAM,WAAW,CAAA,GAAA,mCAAQ,EAAE;gCAAC,GAAG,WAAW;sCAAE;4BAAI;;wBAChF,OAAO,aAAa,yBAAW,gCAAC,CAAA,GAAA,8BAAG;sCAAG;6BAAmB;;;;QAIlE;;AAGN;AAEA,uEAAuE;AACvE,SAAS,sCAAgB,WAAC,OAAO,SAAE,KAAK,YAAE,QAAQ,EAA2D;IAC3G,IAAI,gBAAgB,CAAA,GAAA,uBAAS,EAAE;IAC/B,IAAI,eACF,OAAO;IAGT,qBAAO,gCAAC,QAAQ,QAAQ;QAAC,OAAO;kBAAQ;;AAC1C","sources":["packages/@react-spectrum/s2/src/TabsPicker.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 {\n  PopoverProps as AriaPopoverProps,\n  Select as AriaSelect,\n  SelectProps as AriaSelectProps,\n  Button,\n  ContextValue,\n  DEFAULT_SLOT,\n  ListBox,\n  ListBoxItem,\n  ListBoxItemProps,\n  ListBoxProps,\n  Provider,\n  SelectValue\n} from 'react-aria-components';\nimport {centerBaseline} from './CenterBaseline';\nimport {\n  checkmark,\n  description,\n  icon,\n  label,\n  menuitem,\n  sectionHeader,\n  sectionHeading\n} from './Menu';\nimport CheckmarkIcon from '../ui-icons/Checkmark';\nimport ChevronIcon from '../ui-icons/Chevron';\nimport {edgeToText, focusRing, size, style} from '../style' with {type: 'macro'};\nimport {fieldInput, StyleProps} from './style-utils' with {type: 'macro'};\nimport {\n  FieldLabel\n} from './Field';\nimport {FocusableRef, FocusableRefValue, SpectrumLabelableProps} from '@react-types/shared';\nimport {forwardRefType} from './types';\nimport {HeaderContext, HeadingContext, Text, TextContext} from './Content';\nimport {IconContext} from './Icon';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {Placement} from 'react-aria';\nimport {PopoverBase} from './Popover';\nimport {pressScale} from './pressScale';\nimport {raw} from '../style/style-macro' with {type: 'macro'};\nimport React, {createContext, forwardRef, ReactNode, useContext, useRef} from 'react';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useFormProps} from './Form';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface PickerStyleProps {\n}\n\nexport interface PickerProps<T extends object> extends\n  Omit<AriaSelectProps<T>, 'children' | 'style' | 'className'>,\n  PickerStyleProps,\n  StyleProps,\n  SpectrumLabelableProps,\n  Pick<ListBoxProps<T>, 'items'>,\n  Pick<AriaPopoverProps, 'shouldFlip'> {\n    /** The contents of the collection. */\n    children: ReactNode | ((item: T) => ReactNode),\n    /**\n     * Direction the menu will render relative to the Picker.\n     *\n     * @default 'bottom'\n     */\n    direction?: 'bottom' | 'top',\n    /**\n     * Alignment of the menu relative to the input target.\n     *\n     * @default 'start'\n     */\n    align?: 'start' | 'end',\n    /** Width of the menu. By default, matches width of the trigger. Note that the minimum width of the dropdown is always equal to the trigger's width. */\n    menuWidth?: number,\n    /** Density of the tabs, affects the height of the picker. */\n    density: 'compact' | 'regular',\n    /**\n     * If the tab picker should only display icon and no text for the button label.\n     * @default 'show\n     */\n    labelBehavior?: 'show' | 'hide'\n}\n\nexport const PickerContext = createContext<ContextValue<Partial<PickerProps<any>>, FocusableRefValue<HTMLButtonElement>>>(null);\n\nconst inputButton = style({\n  ...focusRing(),\n  ...fieldInput(),\n  outlineStyle: {\n    default: 'none',\n    isFocusVisible: 'solid'\n  },\n  position: 'relative',\n  font: 'ui',\n  display: 'flex',\n  textAlign: 'start',\n  borderStyle: 'none',\n  borderRadius: 'sm',\n  alignItems: 'center',\n  transition: 'default',\n  columnGap: 'text-to-visual',\n  paddingX: 0,\n  backgroundColor: 'transparent',\n  color: {\n    default: 'neutral',\n    isDisabled: 'disabled'\n  },\n  maxWidth: {\n    isQuiet: 'max'\n  },\n  disableTapHighlight: true,\n  height: {\n    default: 48,\n    density: {\n      compact: 32\n    }\n  },\n  boxSizing: 'border-box'\n});\n\nexport let menu = style({\n  outlineStyle: 'none',\n  display: 'grid',\n  gridTemplateColumns: [edgeToText(32), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(32)],\n  boxSizing: 'border-box',\n  maxHeight: '[inherit]',\n  overflow: 'auto',\n  padding: 8,\n  fontFamily: 'sans',\n  fontSize: 'control'\n});\n\nconst valueStyles = style({\n  flexGrow: 0,\n  truncate: true,\n  display: 'flex',\n  alignItems: 'center',\n  height: 'full'\n});\n\nconst iconStyles = style({\n  flexShrink: 0,\n  rotate: 90,\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  }\n});\n\nconst iconCenterWrapper = style({\n  display: 'flex',\n  gridArea: 'icon',\n  paddingStart: {\n    labelBehavior: {\n      hide: size(6)\n    }\n  }\n});\n\nlet InsideSelectValueContext = createContext(false);\n\nfunction Picker<T extends object>(props: PickerProps<T>, ref: FocusableRef<HTMLButtonElement>) {\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  [props, ref] = useSpectrumContextProps(props, ref, PickerContext);\n  let domRef = useFocusableRef(ref);\n  props = useFormProps(props);\n  let {\n    direction = 'bottom',\n    align = 'start',\n    shouldFlip = true,\n    children,\n    items,\n    placeholder = stringFormatter.format('picker.placeholder'),\n    density,\n    labelBehavior = 'show',\n    ...pickerProps\n  } = props;\n  let isQuiet = true;\n\n  const menuOffset: number = 6;\n  const size = 'M';\n\n  return (\n    <AriaSelect\n      {...pickerProps}\n      placeholder={placeholder}>\n      {({isOpen}) => (\n        <>\n          <FieldLabel isQuiet={isQuiet} />\n          <Button\n            ref={domRef}\n            style={renderProps => pressScale(domRef)(renderProps)}\n            // Prevent press scale from sticking while Picker is open.\n            // @ts-ignore\n            isPressed={false}\n            className={renderProps => inputButton({\n              ...renderProps,\n              size: 'M',\n              isOpen,\n              isQuiet,\n              density\n            })}>\n            <SelectValue className={valueStyles + ' ' + raw('&> * {display: none;}')}>\n              {({defaultChildren}) => {\n                return (\n                  <Provider\n                    values={[\n                      [IconContext, {\n                        slots: {\n                          icon: {\n                            render: centerBaseline({slot: 'icon', styles: iconCenterWrapper({labelBehavior})}),\n                            styles: icon\n                          }\n                        }\n                      }],\n                      [TextContext, {\n                        slots: {\n                          // Default slot is useful when converting other collections to PickerItems.\n                          [DEFAULT_SLOT]: {styles: style({\n                            display: {\n                              default: 'block',\n                              labelBehavior: {\n                                hide: 'none'\n                              }\n                            },\n                            flexGrow: 1,\n                            truncate: true\n                          })({labelBehavior})}\n                        }\n                      }],\n                      [InsideSelectValueContext, true]\n                    ]}>\n                    {defaultChildren}\n                  </Provider>\n                );\n              }}\n            </SelectValue>\n            <ChevronIcon\n              size={size}\n              className={iconStyles} />\n          </Button>\n          <PopoverBase\n            hideArrow\n            offset={menuOffset}\n            placement={`${direction} ${align}` as Placement}\n            shouldFlip={shouldFlip}\n            styles={style({\n              marginStart: -12,\n              minWidth: 192,\n              width: '[calc(var(--trigger-width) + (-2 * self(marginStart)))]'\n            })}>\n            <Provider\n              values={[\n                [HeaderContext, {styles: sectionHeader({size})}],\n                [HeadingContext, {styles: sectionHeading}],\n                [TextContext, {\n                  slots: {\n                    description: {styles: description({size})}\n                  }\n                }]\n              ]}>\n              <ListBox\n                items={items}\n                className={menu}>\n                {children}\n              </ListBox>\n            </Provider>\n          </PopoverBase>\n        </>\n      )}\n    </AriaSelect>\n  );\n}\n\n/**\n * Pickers allow users to choose a single option from a collapsible list of options when space is limited.\n */\nlet _Picker = /*#__PURE__*/ (forwardRef as forwardRefType)(Picker);\nexport {_Picker as Picker};\n\nexport interface PickerItemProps extends Omit<ListBoxItemProps, 'children' | 'style' | 'className'>, StyleProps {\n  children: ReactNode\n}\n\nexport function PickerItem(props: PickerItemProps) {\n  let ref = useRef(null);\n  let isLink = props.href != null;\n  const size = 'M';\n  return (\n    <ListBoxItem\n      {...props}\n      ref={ref}\n      textValue={props.textValue || (typeof props.children === 'string' ? props.children as string : undefined)}\n      style={pressScale(ref, props.UNSAFE_style)}\n      className={renderProps => (props.UNSAFE_className || '') + menuitem({...renderProps, size, isLink}, props.styles)}>\n      {(renderProps) => {\n        let {children} = props;\n        return (\n          <DefaultProvider\n            context={IconContext}\n            value={{slots: {\n              icon: {render: centerBaseline({slot: 'icon', styles: iconCenterWrapper({})}), styles: icon}\n            }}}>\n            <DefaultProvider\n              context={TextContext}\n              value={{\n                slots: {\n                  [DEFAULT_SLOT]: {styles: label({size})}\n                }\n              }}>\n              {!isLink && <CheckmarkIcon size={size} className={checkmark({...renderProps, size})} />}\n              {typeof children === 'string' ? <Text>{children}</Text> : children}\n            </DefaultProvider>\n          </DefaultProvider>\n        );\n      }}\n    </ListBoxItem>\n  );\n}\n\n// A Context.Provider that only sets a value if not inside SelectValue.\nfunction DefaultProvider({context, value, children}: {context: React.Context<any>, value: any, children: any}) {\n  let inSelectValue = useContext(InsideSelectValueContext);\n  if (inSelectValue) {\n    return children;\n  }\n\n  return <context.Provider value={value}>{children}</context.Provider>;\n}\n"],"names":[],"version":3,"file":"TabsPicker.cjs.map"}