@react-spectrum/s2 0.6.0 → 0.7.1

package/dist/NumberField.mjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/s2/src/NumberField.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 Add from '../ui-icons/Add';\nimport {\n  ButtonProps as AriaButtonProps,\n  NumberField as AriaNumberField,\n  NumberFieldProps as AriaNumberFieldProps,\n  ButtonContext,\n  ContextValue,\n  InputContext,\n  Text,\n  useContextProps\n} from 'react-aria-components';\nimport {baseColor, space, style} from '../style' with {type: 'macro'};\nimport {createContext, CSSProperties, ForwardedRef, forwardRef, ReactNode, Ref, useContext, useImperativeHandle, useMemo, useRef} from 'react';\nimport {createFocusableRef} from '@react-spectrum/utils';\nimport Dash from '../ui-icons/Dash';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {FieldErrorIcon, FieldGroup, FieldLabel, HelpText, Input} from './Field';\nimport {filterDOMProps, mergeProps, mergeRefs} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\nimport {pressScale} from './pressScale';\nimport {TextFieldRef} from '@react-types/textfield';\nimport {useButton, useFocusRing, useHover} from 'react-aria';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface NumberFieldProps extends\n  Omit<AriaNumberFieldProps, 'children' | 'className' | 'style'>,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps {\n  /**\n   * Whether to hide the increment and decrement buttons.\n   * @default false\n   */\n  hideStepper?: boolean,\n  /**\n   * The size of the NumberField.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL'\n}\n\nexport const NumberFieldContext = createContext<ContextValue<NumberFieldProps, TextFieldRef>>(null);\n\nconst inputButton = style({\n  display: 'flex',\n  outlineStyle: 'none',\n  textAlign: 'center',\n  borderStyle: 'none',\n  borderTopRadius: {\n    default: {\n      size: {\n        S: '[3px]',\n        M: '[4px]',\n        L: '[5px]',\n        XL: '[6px]'\n      }\n    },\n    type: {\n      decrementStep: 'none'\n    }\n  },\n  borderBottomRadius: {\n    default: {\n      size: {\n        S: '[3px]',\n        M: '[4px]',\n        L: '[5px]',\n        XL: '[6px]'\n      }\n    },\n    type: {\n      incrementStep: 'none'\n    }\n  },\n  alignItems: 'center',\n  justifyContent: 'center',\n  width: {\n    size: {\n      S: 16,\n      M: 20,\n      L: 24,\n      XL: 32\n    }\n  },\n  height: 'auto',\n  marginStart: {\n    default: 'text-to-control',\n    type: {\n      increment: 0\n    }\n  },\n  aspectRatio: 'square',\n  flexShrink: 0,\n  minHeight: 0,\n  transition: {\n    default: 'default',\n    forcedColors: 'none'\n  },\n  backgroundColor: {\n    default: baseColor('gray-100'),\n    isDisabled: 'disabled',\n    forcedColors: {\n      default: 'ButtonText',\n      isHovered: 'Highlight',\n      isDisabled: 'GrayText'\n    }\n  },\n  color: {\n    default: 'neutral',\n    isDisabled: 'disabled',\n    forcedColors: {\n      default: 'ButtonFace'\n    }\n  },\n  cursor: 'default'\n});\n\nconst iconStyles = style({\n  flexShrink: 0,\n  rotate: {\n    default: 0,\n    type: {\n      incrementStep: 270,\n      decrementStep: 90\n    }\n  },\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  }\n});\n\nconst stepperContainerStyles = style({\n  display: 'flex',\n  flexDirection: 'row',\n  gap: {\n    size: {\n      S: 8,\n      M: 4,\n      L: 8,\n      XL: 8\n    }\n  },\n  paddingEnd: {\n    size: {\n      S: 2,\n      M: 4,\n      L: space(6),\n      XL: space(6)\n    }\n  }\n});\n\n/**\n * NumberFields allow users to input number values with a keyboard or increment/decrement with step buttons.\n */\nexport const NumberField = forwardRef(function NumberField(props: NumberFieldProps, ref: Ref<TextFieldRef>) {\n  [props, ref] = useSpectrumContextProps(props, ref, NumberFieldContext);\n  let {\n    label,\n    contextualHelp,\n    description: descriptionMessage,\n    errorMessage,\n    hideStepper,\n    isRequired,\n    size = 'M',\n    labelPosition = 'top',\n    necessityIndicator,\n    labelAlign = 'start',\n    UNSAFE_className = '',\n    UNSAFE_style,\n    ...numberFieldProps\n  } = props;\n  let formContext = useContext(FormContext);\n  let domRef = useRef<HTMLDivElement | null>(null);\n  let inputRef = useRef<HTMLInputElement | null>(null);\n  let decrementButtonRef = useRef<HTMLDivElement | null>(null);\n  let incrementButtonRef = useRef<HTMLDivElement | null>(null);\n\n  // Expose imperative interface for ref\n  useImperativeHandle(ref, () => ({\n    ...createFocusableRef(domRef, inputRef),\n    select() {\n      if (inputRef.current) {\n        inputRef.current.select();\n      }\n    },\n    getInputElement() {\n      return inputRef.current;\n    }\n  }));\n\n\n  return (\n    <AriaNumberField\n      isRequired={isRequired}\n      {...numberFieldProps}\n      style={UNSAFE_style}\n      className={UNSAFE_className + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, props.styles)}>\n      {\n          ({isDisabled, isInvalid}) => {\n            return  (\n              <>\n                <FieldLabel\n                  isDisabled={isDisabled}\n                  isRequired={isRequired}\n                  size={size}\n                  labelPosition={labelPosition}\n                  labelAlign={labelAlign}\n                  necessityIndicator={necessityIndicator}\n                  contextualHelp={contextualHelp}>\n                  {label}\n                </FieldLabel>\n                <FieldGroup\n                  role=\"presentation\"\n                  isDisabled={isDisabled}\n                  isInvalid={isInvalid}\n                  size={size}\n                  styles={style({\n                    ...fieldInput(),\n                    paddingStart: 'edge-to-text',\n                    paddingEnd: {\n                      default: 0,\n                      isStepperHidden: 'edge-to-text'\n                    }\n                  })({size, isStepperHidden: hideStepper})}>\n                  <InputContext.Consumer>\n                    {ctx => (\n                      <InputContext.Provider value={{...ctx, ref: mergeRefs((ctx as any)?.ref, inputRef)}}>\n                        <Input />\n                      </InputContext.Provider>\n                    )}\n                  </InputContext.Consumer>\n                  {isInvalid && <FieldErrorIcon isDisabled={isDisabled} />}\n                  {!hideStepper && <div className={stepperContainerStyles({size})}>\n                    <StepButton\n                      ref={decrementButtonRef}\n                      slot=\"decrement\"\n                      style={renderProps => pressScale(decrementButtonRef)(renderProps)}\n                      className={renderProps => inputButton({\n                        ...renderProps,\n                        type: 'decrement',\n                        size\n                      })}>\n                      <Dash size={size} className={iconStyles({})} />\n                    </StepButton>\n                    <StepButton\n                      ref={incrementButtonRef}\n                      slot=\"increment\"\n                      style={renderProps => pressScale(incrementButtonRef)(renderProps)}\n                      className={renderProps => inputButton({\n                        ...renderProps,\n                        type: 'increment',\n                        size\n                      })}>\n                      <Add size={size} className={iconStyles({})} />\n                    </StepButton>\n                  </div>}\n                </FieldGroup>\n                {descriptionMessage && <Text slot=\"description\">{descriptionMessage}</Text>}\n                <HelpText\n                  size={size}\n                  isDisabled={isDisabled}\n                  isInvalid={isInvalid}\n                  description={descriptionMessage}>\n                  {errorMessage}\n                </HelpText>\n              </>\n            );\n          }\n        }\n    </AriaNumberField>\n  );\n});\n\ninterface StepButtonProps extends AriaButtonProps {\n}\n\nconst additionalButtonHTMLAttributes = new Set(['form', 'formAction', 'formEncType', 'formMethod', 'formNoValidate', 'formTarget', 'name', 'value']);\n\nlet StepButton = forwardRef((props: StepButtonProps, ref: ForwardedRef<HTMLDivElement>) => {\n  [props, ref] = useContextProps(props, ref, ButtonContext as any);\n  let ctx = props as any;\n  /**\n   * Must use div for now because Safari pointer event bugs on disabled form elements.\n   * Link https://bugs.webkit.org/show_bug.cgi?id=219188.\n   */\n  let {buttonProps, isPressed} = useButton({...props, elementType: 'div'}, ref);\n  let {focusProps, isFocused, isFocusVisible} = useFocusRing(props);\n  let {hoverProps, isHovered} = useHover(props);\n  let renderProps = useRenderProps({\n    ...props,\n    values: {isHovered, isPressed, isFocused, isFocusVisible, isDisabled: props.isDisabled || false},\n    defaultClassName: 'react-aria-Button'\n  });\n  return (\n    <div\n      {...filterDOMProps(props, {propNames: additionalButtonHTMLAttributes})}\n      {...mergeProps(buttonProps, focusProps, hoverProps)}\n      {...renderProps}\n      ref={ref}\n      slot={props.slot || undefined}\n      data-disabled={props.isDisabled || undefined}\n      data-pressed={ctx.isPressed || isPressed || undefined}\n      data-hovered={isHovered || undefined}\n      data-focused={isFocused || undefined}\n      data-focus-visible={isFocusVisible || undefined} />\n  );\n});\n\n// replace from RAC\nfunction useRenderProps(props: any) {\n  let {\n    className,\n    style,\n    children,\n    defaultClassName = undefined,\n    defaultChildren = undefined,\n    defaultStyle,\n    values\n  } = props;\n\n  return useMemo(() => {\n    let computedClassName: string | undefined;\n    let computedStyle: CSSProperties | undefined;\n    let computedChildren: ReactNode | undefined;\n\n    if (typeof className === 'function') {\n      computedClassName = className({...values, defaultClassName});\n    } else {\n      computedClassName = className;\n    }\n\n    if (typeof style === 'function') {\n      computedStyle = style({...values, defaultStyle: defaultStyle || {}});\n    } else {\n      computedStyle = style;\n    }\n\n    if (typeof children === 'function') {\n      computedChildren = children({...values, defaultChildren});\n    } else if (children == null) {\n      computedChildren = defaultChildren;\n    } else {\n      computedChildren = children;\n    }\n\n    return {\n      className: computedClassName ?? defaultClassName,\n      style: (computedStyle || defaultStyle) ? {...defaultStyle, ...computedStyle} : undefined,\n      children: computedChildren ?? defaultChildren,\n      'data-rac': ''\n    };\n  }, [className, style, children, defaultClassName, defaultChildren, defaultStyle, values]);\n}\n"],"names":[],"version":3,"file":"NumberField.mjs.map"}
+{"mappings":";;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;AA8CM,MAAM,0DAAqB,CAAA,GAAA,oBAAY,EAAyD;AAEvG,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0EN,MAAM;;;;;;;;;AAeN,MAAM;;;;;;;;;;;;;;;;;;AAwBC,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAAY,MAAuB,EAAE,GAAsB;IACxG,CAAC,QAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,QAAO,KAAK;IACnD,IAAI,SACF,KAAK,kBACL,cAAc,EACd,aAAa,kBAAkB,gBAC/B,YAAY,eACZ,WAAW,cACX,UAAU,QACV,OAAO,oBACP,gBAAgB,2BAChB,kBAAkB,cAClB,aAAa,2BACb,mBAAmB,kBACnB,YAAY,EACZ,GAAG,kBACJ,GAAG;IACJ,IAAI,cAAc,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAU;IACvC,IAAI,SAAS,CAAA,GAAA,aAAK,EAAyB;IAC3C,IAAI,WAAW,CAAA,GAAA,aAAK,EAA2B;IAC/C,IAAI,qBAAqB,CAAA,GAAA,aAAK,EAAyB;IACvD,IAAI,qBAAqB,CAAA,GAAA,aAAK,EAAyB;IAEvD,sCAAsC;IACtC,CAAA,GAAA,0BAAkB,EAAE,KAAK,IAAO,CAAA;YAC9B,GAAG,CAAA,GAAA,yBAAiB,EAAE,QAAQ,SAAS;YACvC;gBACE,IAAI,SAAS,OAAO,EAClB,SAAS,OAAO,CAAC,MAAM;YAE3B;YACA;gBACE,OAAO,SAAS,OAAO;YACzB;QACF,CAAA;IAGA,qBACE,gBAAC,CAAA,GAAA,kBAAc;QACb,YAAY;QACX,GAAG,gBAAgB;QACpB,OAAO;QACP,WAAW,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAAsC;YAClE,UAAU,CAAC,CAAC;2BACZ;kBACA;QACF,GAAG,OAAM,MAAM;kBAEX,CAAC,cAAC,UAAU,aAAE,SAAS,EAAC;YACtB,qBACE;;kCACE,gBAAC,CAAA,GAAA,yCAAS;wBACR,YAAY;wBACZ,YAAY;wBACZ,MAAM;wBACN,eAAe;wBACf,YAAY;wBACZ,oBAAoB;wBACpB,gBAAgB;kCACf;;kCAEH,iBAAC,CAAA,GAAA,yCAAS;wBACR,MAAK;wBACL,YAAY;wBACZ,WAAW;wBACX,MAAM;wBACN,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;0BAOL;kCAAC;4BAAM,iBAAiB;wBAAW;;0CACtC,gBAAC,CAAA,GAAA,mBAAW,EAAE,QAAQ;0CACnB,CAAA,oBACC,gBAAC,CAAA,GAAA,mBAAW,EAAE,QAAQ;wCAAC,OAAO;4CAAC,GAAG,GAAG;4CAAE,KAAK,CAAA,GAAA,gBAAQ,EAAG,KAAa,KAAK;wCAAS;kDAChF,cAAA,gBAAC,CAAA,GAAA,yCAAI;;;4BAIV,2BAAa,gBAAC,CAAA,GAAA,yCAAa;gCAAE,YAAY;;4BACzC,CAAC,6BAAe,iBAAC;gCAAI,WAAW,6CAAuB;0CAAC;gCAAI;;kDAC3D,gBAAC;wCACC,KAAK;wCACL,MAAK;wCACL,OAAO,CAAA,cAAe,CAAA,GAAA,yCAAS,EAAE,oBAAoB;wCACrD,WAAW,CAAA,cAAe,kCAAY;gDACpC,GAAG,WAAW;gDACd,MAAM;sDACN;4CACF;kDACA,cAAA,gBAAC,CAAA,GAAA,wCAAG;4CAAE,MAAM;4CAAM,WAAW,iCAAW,CAAC;;;kDAE3C,gBAAC;wCACC,KAAK;wCACL,MAAK;wCACL,OAAO,CAAA,cAAe,CAAA,GAAA,yCAAS,EAAE,oBAAoB;wCACrD,WAAW,CAAA,cAAe,kCAAY;gDACpC,GAAG,WAAW;gDACd,MAAM;sDACN;4CACF;kDACA,cAAA,gBAAC,CAAA,GAAA,wCAAE;4CAAE,MAAM;4CAAM,WAAW,iCAAW,CAAC;;;;;;;oBAI7C,oCAAsB,gBAAC,CAAA,GAAA,WAAG;wBAAE,MAAK;kCAAe;;kCACjD,gBAAC,CAAA,GAAA,yCAAO;wBACN,MAAM;wBACN,YAAY;wBACZ,WAAW;wBACX,aAAa;kCACZ;;;;QAIT;;AAIV;AAKA,MAAM,uDAAiC,IAAI,IAAI;IAAC;IAAQ;IAAc;IAAe;IAAc;IAAkB;IAAc;IAAQ;CAAQ;AAEnJ,IAAI,iDAAa,CAAA,GAAA,iBAAS,EAAE,CAAC,OAAwB;IACnD,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,sBAAc,EAAE,OAAO,KAAK,CAAA,GAAA,oBAAY;IACvD,IAAI,MAAM;IACV;;;GAGC,GACD,IAAI,eAAC,WAAW,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,gBAAQ,EAAE;QAAC,GAAG,KAAK;QAAE,aAAa;IAAK,GAAG;IACzE,IAAI,cAAC,UAAU,aAAE,SAAS,kBAAE,cAAc,EAAC,GAAG,CAAA,GAAA,mBAAW,EAAE;IAC3D,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;IACvC,IAAI,cAAc,qCAAe;QAC/B,GAAG,KAAK;QACR,QAAQ;uBAAC;uBAAW;uBAAW;4BAAW;YAAgB,YAAY,MAAM,UAAU,IAAI;QAAK;QAC/F,kBAAkB;IACpB;IACA,qBACE,gBAAC;QACE,GAAG,CAAA,GAAA,qBAAa,EAAE,OAAO;YAAC,WAAW;QAA8B,EAAE;QACrE,GAAG,CAAA,GAAA,iBAAS,EAAE,aAAa,YAAY,WAAW;QAClD,GAAG,WAAW;QACf,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,iBAAe,MAAM,UAAU,IAAI;QACnC,gBAAc,IAAI,SAAS,IAAI,aAAa;QAC5C,gBAAc,aAAa;QAC3B,gBAAc,aAAa;QAC3B,sBAAoB,kBAAkB;;AAE5C;AAEA,mBAAmB;AACnB,SAAS,qCAAe,KAAU;IAChC,IAAI,aACF,SAAS,SACT,KAAK,YACL,QAAQ,oBACR,gBAAgB,mBAChB,eAAe,gBACf,YAAY,UACZ,MAAM,EACP,GAAG;IAEJ,OAAO,CAAA,GAAA,cAAM,EAAE;QACb,IAAI;QACJ,IAAI;QACJ,IAAI;QAEJ,IAAI,OAAO,cAAc,YACvB,oBAAoB,UAAU;YAAC,GAAG,MAAM;8BAAE;QAAgB;aAE1D,oBAAoB;QAGtB,IAAI,OAAO,UAAU,YACnB,gBAAgB,MAAM;YAAC,GAAG,MAAM;YAAE,cAAc,gBAAgB,CAAC;QAAC;aAElE,gBAAgB;QAGlB,IAAI,OAAO,aAAa,YACtB,mBAAmB,SAAS;YAAC,GAAG,MAAM;6BAAE;QAAe;aAClD,IAAI,YAAY,MACrB,mBAAmB;aAEnB,mBAAmB;QAGrB,OAAO;YACL,WAAW,qBAAqB;YAChC,OAAO,AAAC,iBAAiB,eAAgB;gBAAC,GAAG,YAAY;gBAAE,GAAG,aAAa;YAAA,IAAI;YAC/E,UAAU,oBAAoB;YAC9B,YAAY;QACd;IACF,GAAG;QAAC;QAAW;QAAO;QAAU;QAAkB;QAAiB;QAAc;KAAO;AAC1F","sources":["packages/@react-spectrum/s2/src/NumberField.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 Add from '../ui-icons/Add';\nimport {\n  ButtonProps as AriaButtonProps,\n  NumberField as AriaNumberField,\n  NumberFieldProps as AriaNumberFieldProps,\n  ButtonContext,\n  ContextValue,\n  InputContext,\n  Text,\n  useContextProps\n} from 'react-aria-components';\nimport {baseColor, space, style} from '../style' with {type: 'macro'};\nimport {createContext, CSSProperties, ForwardedRef, forwardRef, ReactNode, Ref, useContext, useImperativeHandle, useMemo, useRef} from 'react';\nimport {createFocusableRef} from '@react-spectrum/utils';\nimport Dash from '../ui-icons/Dash';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {FieldErrorIcon, FieldGroup, FieldLabel, HelpText, Input} from './Field';\nimport {filterDOMProps, mergeProps, mergeRefs} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\nimport {pressScale} from './pressScale';\nimport {TextFieldRef} from '@react-types/textfield';\nimport {useButton, useFocusRing, useHover} from 'react-aria';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface NumberFieldProps extends\n  Omit<AriaNumberFieldProps, 'children' | 'className' | 'style'>,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps {\n  /**\n   * Whether to hide the increment and decrement buttons.\n   * @default false\n   */\n  hideStepper?: boolean,\n  /**\n   * The size of the NumberField.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL'\n}\n\nexport const NumberFieldContext = createContext<ContextValue<Partial<NumberFieldProps>, TextFieldRef>>(null);\n\nconst inputButton = style({\n  display: 'flex',\n  outlineStyle: 'none',\n  textAlign: 'center',\n  borderStyle: 'none',\n  borderTopRadius: {\n    default: {\n      size: {\n        S: '[3px]',\n        M: '[4px]',\n        L: '[5px]',\n        XL: '[6px]'\n      }\n    },\n    type: {\n      decrementStep: 'none'\n    }\n  },\n  borderBottomRadius: {\n    default: {\n      size: {\n        S: '[3px]',\n        M: '[4px]',\n        L: '[5px]',\n        XL: '[6px]'\n      }\n    },\n    type: {\n      incrementStep: 'none'\n    }\n  },\n  alignItems: 'center',\n  justifyContent: 'center',\n  width: {\n    size: {\n      S: 16,\n      M: 20,\n      L: 24,\n      XL: 32\n    }\n  },\n  height: 'auto',\n  marginStart: {\n    default: 'text-to-control',\n    type: {\n      increment: 0\n    }\n  },\n  aspectRatio: 'square',\n  flexShrink: 0,\n  minHeight: 0,\n  transition: {\n    default: 'default',\n    forcedColors: 'none'\n  },\n  backgroundColor: {\n    default: baseColor('gray-100'),\n    isDisabled: 'disabled',\n    forcedColors: {\n      default: 'ButtonText',\n      isHovered: 'Highlight',\n      isDisabled: 'GrayText'\n    }\n  },\n  color: {\n    default: 'neutral',\n    isDisabled: 'disabled',\n    forcedColors: {\n      default: 'ButtonFace'\n    }\n  },\n  cursor: 'default'\n});\n\nconst iconStyles = style({\n  flexShrink: 0,\n  rotate: {\n    default: 0,\n    type: {\n      incrementStep: 270,\n      decrementStep: 90\n    }\n  },\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  }\n});\n\nconst stepperContainerStyles = style({\n  display: 'flex',\n  flexDirection: 'row',\n  gap: {\n    size: {\n      S: 8,\n      M: 4,\n      L: 8,\n      XL: 8\n    }\n  },\n  paddingEnd: {\n    size: {\n      S: 2,\n      M: 4,\n      L: space(6),\n      XL: space(6)\n    }\n  }\n});\n\n/**\n * NumberFields allow users to input number values with a keyboard or increment/decrement with step buttons.\n */\nexport const NumberField = forwardRef(function NumberField(props: NumberFieldProps, ref: Ref<TextFieldRef>) {\n  [props, ref] = useSpectrumContextProps(props, ref, NumberFieldContext);\n  let {\n    label,\n    contextualHelp,\n    description: descriptionMessage,\n    errorMessage,\n    hideStepper,\n    isRequired,\n    size = 'M',\n    labelPosition = 'top',\n    necessityIndicator,\n    labelAlign = 'start',\n    UNSAFE_className = '',\n    UNSAFE_style,\n    ...numberFieldProps\n  } = props;\n  let formContext = useContext(FormContext);\n  let domRef = useRef<HTMLDivElement | null>(null);\n  let inputRef = useRef<HTMLInputElement | null>(null);\n  let decrementButtonRef = useRef<HTMLDivElement | null>(null);\n  let incrementButtonRef = useRef<HTMLDivElement | null>(null);\n\n  // Expose imperative interface for ref\n  useImperativeHandle(ref, () => ({\n    ...createFocusableRef(domRef, inputRef),\n    select() {\n      if (inputRef.current) {\n        inputRef.current.select();\n      }\n    },\n    getInputElement() {\n      return inputRef.current;\n    }\n  }));\n\n\n  return (\n    <AriaNumberField\n      isRequired={isRequired}\n      {...numberFieldProps}\n      style={UNSAFE_style}\n      className={UNSAFE_className + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, props.styles)}>\n      {\n          ({isDisabled, isInvalid}) => {\n            return  (\n              <>\n                <FieldLabel\n                  isDisabled={isDisabled}\n                  isRequired={isRequired}\n                  size={size}\n                  labelPosition={labelPosition}\n                  labelAlign={labelAlign}\n                  necessityIndicator={necessityIndicator}\n                  contextualHelp={contextualHelp}>\n                  {label}\n                </FieldLabel>\n                <FieldGroup\n                  role=\"presentation\"\n                  isDisabled={isDisabled}\n                  isInvalid={isInvalid}\n                  size={size}\n                  styles={style({\n                    ...fieldInput(),\n                    paddingStart: 'edge-to-text',\n                    paddingEnd: {\n                      default: 0,\n                      isStepperHidden: 'edge-to-text'\n                    }\n                  })({size, isStepperHidden: hideStepper})}>\n                  <InputContext.Consumer>\n                    {ctx => (\n                      <InputContext.Provider value={{...ctx, ref: mergeRefs((ctx as any)?.ref, inputRef)}}>\n                        <Input />\n                      </InputContext.Provider>\n                    )}\n                  </InputContext.Consumer>\n                  {isInvalid && <FieldErrorIcon isDisabled={isDisabled} />}\n                  {!hideStepper && <div className={stepperContainerStyles({size})}>\n                    <StepButton\n                      ref={decrementButtonRef}\n                      slot=\"decrement\"\n                      style={renderProps => pressScale(decrementButtonRef)(renderProps)}\n                      className={renderProps => inputButton({\n                        ...renderProps,\n                        type: 'decrement',\n                        size\n                      })}>\n                      <Dash size={size} className={iconStyles({})} />\n                    </StepButton>\n                    <StepButton\n                      ref={incrementButtonRef}\n                      slot=\"increment\"\n                      style={renderProps => pressScale(incrementButtonRef)(renderProps)}\n                      className={renderProps => inputButton({\n                        ...renderProps,\n                        type: 'increment',\n                        size\n                      })}>\n                      <Add size={size} className={iconStyles({})} />\n                    </StepButton>\n                  </div>}\n                </FieldGroup>\n                {descriptionMessage && <Text slot=\"description\">{descriptionMessage}</Text>}\n                <HelpText\n                  size={size}\n                  isDisabled={isDisabled}\n                  isInvalid={isInvalid}\n                  description={descriptionMessage}>\n                  {errorMessage}\n                </HelpText>\n              </>\n            );\n          }\n        }\n    </AriaNumberField>\n  );\n});\n\ninterface StepButtonProps extends AriaButtonProps {\n}\n\nconst additionalButtonHTMLAttributes = new Set(['form', 'formAction', 'formEncType', 'formMethod', 'formNoValidate', 'formTarget', 'name', 'value']);\n\nlet StepButton = forwardRef((props: StepButtonProps, ref: ForwardedRef<HTMLDivElement>) => {\n  [props, ref] = useContextProps(props, ref, ButtonContext as any);\n  let ctx = props as any;\n  /**\n   * Must use div for now because Safari pointer event bugs on disabled form elements.\n   * Link https://bugs.webkit.org/show_bug.cgi?id=219188.\n   */\n  let {buttonProps, isPressed} = useButton({...props, elementType: 'div'}, ref);\n  let {focusProps, isFocused, isFocusVisible} = useFocusRing(props);\n  let {hoverProps, isHovered} = useHover(props);\n  let renderProps = useRenderProps({\n    ...props,\n    values: {isHovered, isPressed, isFocused, isFocusVisible, isDisabled: props.isDisabled || false},\n    defaultClassName: 'react-aria-Button'\n  });\n  return (\n    <div\n      {...filterDOMProps(props, {propNames: additionalButtonHTMLAttributes})}\n      {...mergeProps(buttonProps, focusProps, hoverProps)}\n      {...renderProps}\n      ref={ref}\n      slot={props.slot || undefined}\n      data-disabled={props.isDisabled || undefined}\n      data-pressed={ctx.isPressed || isPressed || undefined}\n      data-hovered={isHovered || undefined}\n      data-focused={isFocused || undefined}\n      data-focus-visible={isFocusVisible || undefined} />\n  );\n});\n\n// replace from RAC\nfunction useRenderProps(props: any) {\n  let {\n    className,\n    style,\n    children,\n    defaultClassName = undefined,\n    defaultChildren = undefined,\n    defaultStyle,\n    values\n  } = props;\n\n  return useMemo(() => {\n    let computedClassName: string | undefined;\n    let computedStyle: CSSProperties | undefined;\n    let computedChildren: ReactNode | undefined;\n\n    if (typeof className === 'function') {\n      computedClassName = className({...values, defaultClassName});\n    } else {\n      computedClassName = className;\n    }\n\n    if (typeof style === 'function') {\n      computedStyle = style({...values, defaultStyle: defaultStyle || {}});\n    } else {\n      computedStyle = style;\n    }\n\n    if (typeof children === 'function') {\n      computedChildren = children({...values, defaultChildren});\n    } else if (children == null) {\n      computedChildren = defaultChildren;\n    } else {\n      computedChildren = children;\n    }\n\n    return {\n      className: computedClassName ?? defaultClassName,\n      style: (computedStyle || defaultStyle) ? {...defaultStyle, ...computedStyle} : undefined,\n      children: computedChildren ?? defaultChildren,\n      'data-rac': ''\n    };\n  }, [className, style, children, defaultClassName, defaultChildren, defaultStyle, values]);\n}\n"],"names":[],"version":3,"file":"NumberField.mjs.map"}

package/dist/Picker.cjs

@@ -13,8 +13,10 @@ var $2061c83559b50a66$exports = require("./pressScale.cjs");
 var $ac757a4c2bd72aee$exports = require("../icons/useSpectrumContextProps.cjs");
 var $ceqeb$reactjsxruntime = require("react/jsx-runtime");
 var $ceqeb$reactariacomponents = require("react-aria-components");
+var $ceqeb$reactariainteractions = require("@react-aria/interactions");
 var $ceqeb$react = require("react");
 var $ceqeb$reactspectrumutils = require("@react-spectrum/utils");
+var $ceqeb$reactariautils = require("@react-aria/utils");
 var $ceqeb$reactariai18n = require("@react-aria/i18n");
 
 
@@ -58,6 +60,8 @@ $parcel$export(module.exports, "PickerSection", () => $b9c30139cd63c62a$export$a
 
 
 
+
+
 const $b9c30139cd63c62a$export$b72b8dade9393cd5 = /*#__PURE__*/ (0, $ceqeb$react.createContext)(null);
 const $b9c30139cd63c62a$var$inputButton = function anonymous(props) {
     let rules = " .";
@@ -162,11 +166,12 @@ const $b9c30139cd63c62a$var$inputButton = function anonymous(props) {
     else rules += ' -_375toq_k-f';
     return rules;
 };
-const $b9c30139cd63c62a$var$quietFocusLine = " . lb k-375zlr Va _aa _wf _xf _yf _zf bx ba_____M";
+const $b9c30139cd63c62a$var$quietFocusLine = " lb k-375zlr Va _aa _wf _xf _yf _zf bx ba_____M";
 let $b9c30139cd63c62a$export$b1e5508a851be14d = function anonymous(props) {
     let rules = " .";
     rules += ' _Ma';
     rules += ' _0f';
+    rules += ' lb';
     if (props.size === "XL") rules += ' __i-14g31og';
     else if (props.size === "L") rules += ' __i-1pqbi84';
     else if (props.size === "M") rules += ' __i-n6rb9a';
@@ -203,6 +208,7 @@ let $b9c30139cd63c62a$export$b1e5508a851be14d = function anonymous(props) {
         rules += ' _ebf';
         rules += ' _ee';
     }
+    rules += ' __g-zexzcl';
     return rules;
 };
 const $b9c30139cd63c62a$var$invalidBorder = function anonymous(props) {
@@ -243,7 +249,7 @@ const $b9c30139cd63c62a$var$valueStyles = function anonymous(props) {
     rules += ' _2c';
     return rules;
 };
-const $b9c30139cd63c62a$var$iconStyles = " . _9-3t1x R-3hn0u -rwx0fg_e-b";
+const $b9c30139cd63c62a$var$iconStyles = " _9-3t1x R-3hn0u -rwx0fg_e-b";
 let $b9c30139cd63c62a$var$InternalPickerContext = /*#__PURE__*/ (0, $ceqeb$react.createContext)({
     size: 'M'
 });
@@ -261,6 +267,21 @@ const $b9c30139cd63c62a$export$ba25329847403e11 = /*#__PURE__*/ (0, $ceqeb$react
     else if (size === 'M') menuOffset = 6;
     else if (size === 'L') menuOffset = 7;
     else menuOffset = 8;
+    // For mouse interactions, pickers open on press start. When the popover underlay appears
+    // it covers the trigger button, causing onPressEnd to fire immediately and no press scaling
+    // to occur. We override this by listening for pointerup on the document ourselves.
+    let [isPressed, setPressed] = (0, $ceqeb$react.useState)(false);
+    let { addGlobalListener: addGlobalListener } = (0, $ceqeb$reactariautils.useGlobalListeners)();
+    let onPressStart = (e)=>{
+        if (e.pointerType !== 'mouse') return;
+        setPressed(true);
+        addGlobalListener(document, 'pointerup', ()=>{
+            setPressed(false);
+        }, {
+            once: true,
+            capture: true
+        });
+    };
     return /*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsx)((0, $ceqeb$reactariacomponents.Select), {
         ...pickerProps,
         placeholder: placeholder,
@@ -343,80 +364,84 @@ const $b9c30139cd63c62a$export$ba25329847403e11 = /*#__PURE__*/ (0, $ceqeb$react
                             contextualHelp: props1.contextualHelp,
                             children: label
                         }),
-                        /*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsx)((0, $ceqeb$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)=>$b9c30139cd63c62a$var$inputButton({
-                                    ...renderProps,
-                                    size: size,
-                                    isOpen: isOpen,
-                                    isQuiet: isQuiet
-                                }),
-                            children: (renderProps)=>/*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsxs)((0, $ceqeb$reactjsxruntime.Fragment), {
-                                    children: [
-                                        /*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsx)((0, $ceqeb$reactariacomponents.SelectValue), {
-                                            className: $b9c30139cd63c62a$var$valueStyles({
-                                                isQuiet: isQuiet
-                                            }) + ' ' + "-u6zm92",
-                                            children: ({ defaultChildren: defaultChildren })=>{
-                                                return /*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsx)((0, $ceqeb$reactariacomponents.Provider), {
-                                                    values: [
-                                                        [
-                                                            (0, $bde97c91243ed164$exports.IconContext),
-                                                            {
-                                                                slots: {
-                                                                    icon: {
-                                                                        render: (0, $e991cbcdf82ced71$exports.centerBaseline)({
-                                                                            slot: 'icon',
-                                                                            styles: (0, $e741ea6b88ce4866$exports.iconCenterWrapper)
-                                                                        }),
-                                                                        styles: (0, $e741ea6b88ce4866$exports.icon)
+                        /*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsx)((0, $ceqeb$reactariainteractions.PressResponder), {
+                            onPressStart: onPressStart,
+                            isPressed: isPressed,
+                            children: /*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsx)((0, $ceqeb$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)=>$b9c30139cd63c62a$var$inputButton({
+                                        ...renderProps,
+                                        size: size,
+                                        isOpen: isOpen,
+                                        isQuiet: isQuiet
+                                    }),
+                                children: (renderProps)=>/*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsxs)((0, $ceqeb$reactjsxruntime.Fragment), {
+                                        children: [
+                                            /*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsx)((0, $ceqeb$reactariacomponents.SelectValue), {
+                                                className: $b9c30139cd63c62a$var$valueStyles({
+                                                    isQuiet: isQuiet
+                                                }) + ' ' + "-u6zm92",
+                                                children: ({ defaultChildren: defaultChildren })=>{
+                                                    return /*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsx)((0, $ceqeb$reactariacomponents.Provider), {
+                                                        values: [
+                                                            [
+                                                                (0, $bde97c91243ed164$exports.IconContext),
+                                                                {
+                                                                    slots: {
+                                                                        icon: {
+                                                                            render: (0, $e991cbcdf82ced71$exports.centerBaseline)({
+                                                                                slot: 'icon',
+                                                                                styles: (0, $e741ea6b88ce4866$exports.iconCenterWrapper)
+                                                                            }),
+                                                                            styles: (0, $e741ea6b88ce4866$exports.icon)
+                                                                        }
                                                                     }
                                                                 }
-                                                            }
-                                                        ],
-                                                        [
-                                                            (0, $6367bc87eb7d24ad$exports.TextContext),
-                                                            {
-                                                                slots: {
-                                                                    description: {},
-                                                                    label: {
-                                                                        styles: " . _0a __a-3t1y __wb __xb _na _qb"
+                                                            ],
+                                                            [
+                                                                (0, $6367bc87eb7d24ad$exports.TextContext),
+                                                                {
+                                                                    slots: {
+                                                                        description: {},
+                                                                        label: {
+                                                                            styles: " _0a __a-3t1y __wb __xb _na _qb"
+                                                                        }
                                                                     }
                                                                 }
-                                                            }
+                                                            ],
+                                                            [
+                                                                $b9c30139cd63c62a$var$InsideSelectValueContext,
+                                                                true
+                                                            ]
                                                         ],
-                                                        [
-                                                            $b9c30139cd63c62a$var$InsideSelectValueContext,
-                                                            true
-                                                        ]
-                                                    ],
-                                                    children: defaultChildren
-                                                });
-                                            }
-                                        }),
-                                        isInvalid && /*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsx)((0, $a0b996a550bb0891$exports.FieldErrorIcon), {
-                                            isDisabled: isDisabled
-                                        }),
-                                        /*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsx)((0, $1df9f1c9262ce5df$exports.default), {
-                                            size: size,
-                                            className: $b9c30139cd63c62a$var$iconStyles
-                                        }),
-                                        isFocusVisible && isQuiet && /*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsx)("span", {
-                                            className: $b9c30139cd63c62a$var$quietFocusLine
-                                        }),
-                                        isInvalid && !isDisabled && !isQuiet && // @ts-ignore known limitation detecting functions from the theme
-                                        /*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsx)("div", {
-                                            className: $b9c30139cd63c62a$var$invalidBorder({
-                                                ...renderProps,
-                                                size: size
+                                                        children: defaultChildren
+                                                    });
+                                                }
+                                            }),
+                                            isInvalid && /*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsx)((0, $a0b996a550bb0891$exports.FieldErrorIcon), {
+                                                isDisabled: isDisabled
+                                            }),
+                                            /*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsx)((0, $1df9f1c9262ce5df$exports.default), {
+                                                size: size,
+                                                className: $b9c30139cd63c62a$var$iconStyles
+                                            }),
+                                            isFocusVisible && isQuiet && /*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsx)("span", {
+                                                className: $b9c30139cd63c62a$var$quietFocusLine
+                                            }),
+                                            isInvalid && !isDisabled && !isQuiet && // @ts-ignore known limitation detecting functions from the theme
+                                            /*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsx)("div", {
+                                                className: $b9c30139cd63c62a$var$invalidBorder({
+                                                    ...renderProps,
+                                                    size: size
+                                                })
                                             })
-                                        })
-                                    ]
-                                })
+                                        ]
+                                    })
+                            })
                         }),
                         /*#__PURE__*/ (0, $ceqeb$reactjsxruntime.jsx)((0, $a0b996a550bb0891$exports.HelpText), {
                             size: size,

package/dist/Picker.cjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Picker.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  ListBoxSection as AriaListBoxSection,\n  PopoverProps as AriaPopoverProps,\n  Select as AriaSelect,\n  SelectProps as AriaSelectProps,\n  SelectRenderProps as AriaSelectRenderProps,\n  Button,\n  ButtonRenderProps,\n  ContextValue,\n  ListBox,\n  ListBoxItem,\n  ListBoxItemProps,\n  ListBoxProps,\n  Provider,\n  SectionProps,\n  SelectValue\n} from 'react-aria-components';\nimport {baseColor, edgeToText, focusRing, style} from '../style' with {type: 'macro'};\nimport {centerBaseline} from './CenterBaseline';\nimport {\n  checkmark,\n  description,\n  Divider,\n  icon,\n  iconCenterWrapper,\n  label,\n  menuitem,\n  section,\n  sectionHeader,\n  sectionHeading\n} from './Menu';\nimport CheckmarkIcon from '../ui-icons/Checkmark';\nimport ChevronIcon from '../ui-icons/Chevron';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {\n  FieldErrorIcon,\n  FieldLabel,\n  HelpText\n} from './Field';\nimport {FocusableRef, FocusableRefValue, HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\nimport {FormContext, useFormProps} from './Form';\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 {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface PickerStyleProps {\n  /**\n   * The size of the Picker.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL',\n  /**\n   * Whether the picker should be displayed with a quiet style.\n   * @private\n   */\n  isQuiet?: boolean\n}\n\nexport interface PickerProps<T extends object> extends\n  Omit<AriaSelectProps<T>, 'children' | 'style' | 'className'>,\n  PickerStyleProps,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps,\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}\n\ninterface PickerButtonProps extends PickerStyleProps, ButtonRenderProps {}\n\nexport const PickerContext = createContext<ContextValue<Partial<PickerProps<any>>, FocusableRefValue<HTMLButtonElement>>>(null);\n\nconst inputButton = style<PickerButtonProps | AriaSelectRenderProps>({\n  ...focusRing(),\n  ...fieldInput(),\n  outlineStyle: {\n    default: 'none',\n    isFocusVisible: 'solid',\n    isQuiet: 'none'\n  },\n  position: 'relative',\n  font: 'control',\n  display: 'flex',\n  textAlign: 'start',\n  borderStyle: {\n    default: 'none',\n    forcedColors: 'solid'\n  },\n  borderColor: {\n    forcedColors: {\n      default: 'ButtonText',\n      isDisabled: 'GrayText'\n    }\n  },\n  borderRadius: 'control',\n  alignItems: 'center',\n  height: 'control',\n  transition: 'default',\n  columnGap: {\n    default: 'text-to-control',\n    isQuiet: 'text-to-visual'\n  },\n  paddingX: {\n    default: 'edge-to-text',\n    isQuiet: 0\n  },\n  backgroundColor: {\n    default: baseColor('gray-100'),\n    isOpen: 'gray-200',\n    isDisabled: 'disabled',\n    isQuiet: 'transparent'\n  },\n  color: {\n    default: 'neutral',\n    isDisabled: 'disabled'\n  },\n  maxWidth: {\n    isQuiet: 'max'\n  },\n  disableTapHighlight: true\n});\n\nconst quietFocusLine = style({\n  width: 'full',\n  // Use pixels since we are emulating a border.\n  height: '[2px]',\n  position: 'absolute',\n  bottom: 0,\n  borderRadius: 'full',\n  backgroundColor: {\n    default: 'blue-800',\n    forcedColors: 'Highlight'\n  }\n});\n\nexport let menu = style({\n  outlineStyle: 'none',\n  display: 'grid',\n  gridTemplateColumns: {\n    size: {\n      S: [edgeToText(24), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(24)],\n      M: [edgeToText(32), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(32)],\n      L: [edgeToText(40), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(40)],\n      XL: [edgeToText(48), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(48)]\n    }\n  },\n  boxSizing: 'border-box',\n  maxHeight: '[inherit]',\n  overflow: 'auto',\n  padding: 8,\n  fontFamily: 'sans',\n  fontSize: 'control'\n});\n\nconst invalidBorder = style({\n  position: 'absolute',\n  top: 0,\n  left: 0,\n  bottom: 0,\n  right: 0,\n  pointerEvents: 'none',\n  borderRadius: 'control',\n  borderStyle: 'solid',\n  borderWidth: 2,\n  borderColor: 'negative',\n  transition: 'default'\n});\n\nconst valueStyles = style({\n  flexGrow: {\n    default: 1,\n    isQuiet: 0\n  },\n  truncate: true,\n  display: 'flex',\n  alignItems: 'center'\n});\n\nconst iconStyles = style({\n  flexShrink: 0,\n  rotate: 90,\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  }\n});\n\nlet InternalPickerContext = createContext<{size: 'S' | 'M' | 'L' | 'XL'}>({size: 'M'});\nlet InsideSelectValueContext = createContext(false);\n\n/**\n * Pickers allow users to choose a single option from a collapsible list of options when space is limited.\n */\nexport const Picker = /*#__PURE__*/ (forwardRef as forwardRefType)(function 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  let formContext = useContext(FormContext);\n  props = useFormProps(props);\n  let {\n    direction = 'bottom',\n    align = 'start',\n    shouldFlip = true,\n    menuWidth,\n    label,\n    description: descriptionMessage,\n    errorMessage,\n    children,\n    items,\n    size = 'M',\n    labelPosition = 'top',\n    labelAlign = 'start',\n    necessityIndicator,\n    UNSAFE_className = '',\n    UNSAFE_style,\n    placeholder = stringFormatter.format('picker.placeholder'),\n    isQuiet,\n    ...pickerProps\n  } = props;\n\n  // Better way to encode this into a style? need to account for flipping\n  let menuOffset: number;\n  if (size === 'S') {\n    menuOffset = 6;\n  } else if (size === 'M') {\n    menuOffset = 6;\n  } else if (size === 'L') {\n    menuOffset = 7;\n  } else {\n    menuOffset = 8;\n  }\n\n  return (\n    <AriaSelect\n      {...pickerProps}\n      placeholder={placeholder}\n      style={UNSAFE_style}\n      className={UNSAFE_className + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, props.styles)}>\n      {({isDisabled, isOpen, isFocusVisible, isInvalid, isRequired}) => (\n        <>\n          <InternalPickerContext.Provider value={{size}}>\n            <FieldLabel\n              isDisabled={isDisabled}\n              isRequired={isRequired}\n              size={size}\n              labelPosition={labelPosition}\n              labelAlign={labelAlign}\n              isQuiet={isQuiet}\n              necessityIndicator={necessityIndicator}\n              contextualHelp={props.contextualHelp}>\n              {label}\n            </FieldLabel>\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: size,\n                isOpen,\n                isQuiet\n              })}>\n              {(renderProps) => (\n                <>\n                  <SelectValue className={valueStyles({isQuiet}) + ' ' + raw('&> * {display: none;}')}>\n                    {({defaultChildren}) => {\n                      return (\n                        <Provider\n                          values={[\n                            [IconContext, {\n                              slots: {\n                                icon: {\n                                  render: centerBaseline({slot: 'icon', styles: iconCenterWrapper}),\n                                  styles: icon\n                                }\n                              }\n                            }],\n                            [TextContext, {\n                              slots: {\n                                description: {},\n                                label: {styles: style({\n                                  display: 'block',\n                                  flexGrow: 1,\n                                  truncate: true\n                                })}\n                              }\n                            }],\n                            [InsideSelectValueContext, true]\n                          ]}>\n                          {defaultChildren}\n                        </Provider>\n                      );\n                    }}\n                  </SelectValue>\n                  {isInvalid && (\n                    <FieldErrorIcon isDisabled={isDisabled} />\n                  )}\n                  <ChevronIcon\n                    size={size}\n                    className={iconStyles} />\n                  {isFocusVisible && isQuiet && <span className={quietFocusLine} /> }\n                  {isInvalid && !isDisabled && !isQuiet &&\n                    // @ts-ignore known limitation detecting functions from the theme\n                    <div className={invalidBorder({...renderProps, size})} />\n                  }\n                </>\n              )}\n            </Button>\n            <HelpText\n              size={size}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              description={descriptionMessage}>\n              {errorMessage}\n            </HelpText>\n            <PopoverBase\n              hideArrow\n              offset={menuOffset}\n              placement={`${direction} ${align}` as Placement}\n              shouldFlip={shouldFlip}\n              UNSAFE_style={{\n                width: menuWidth && !isQuiet ? `${menuWidth}px` : undefined\n              }}\n              styles={style({\n                marginStart: {\n                  isQuiet: -12\n                },\n                minWidth: {\n                  default: '[var(--trigger-width)]',\n                  isQuiet: 192\n                },\n                width: {\n                  default: '[var(--trigger-width)]',\n                  isQuiet: '[calc(var(--trigger-width) + (-2 * self(marginStart)))]'\n                }\n              })(props)}>\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({size})}>\n                  {children}\n                </ListBox>\n              </Provider>\n            </PopoverBase>\n          </InternalPickerContext.Provider>\n        </>\n      )}\n    </AriaSelect>\n  );\n});\n\nexport interface PickerItemProps extends Omit<ListBoxItemProps, 'children' | 'style' | 'className'>, StyleProps {\n  children: ReactNode\n}\n\nconst checkmarkIconSize = {\n  S: 'XS',\n  M: 'M',\n  L: 'L',\n  XL: 'XL'\n} as const;\n\nexport function PickerItem(props: PickerItemProps) {\n  let ref = useRef(null);\n  let isLink = props.href != null;\n  let {size} = useContext(InternalPickerContext);\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                  label: {styles: label({size})},\n                  description: {styles: description({...renderProps, size})}\n                }\n              }}>\n              {!isLink && <CheckmarkIcon size={checkmarkIconSize[size]} className={checkmark({...renderProps, size})} />}\n              {typeof children === 'string' ? <Text slot=\"label\">{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\nexport interface PickerSectionProps<T extends object> extends SectionProps<T> {}\nexport function PickerSection<T extends object>(props: PickerSectionProps<T>) {\n  let {size} = useContext(InternalPickerContext);\n  return (\n    <>\n      <AriaListBoxSection\n        {...props}\n        className={section({size})}>\n        {props.children}\n      </AriaListBoxSection>\n      <Divider />\n    </>\n  );\n}\n"],"names":[],"version":3,"file":"Picker.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;;;;;;AAsGM,MAAM,0DAAgB,CAAA,GAAA,0BAAY,EAAiF;AAE1H,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkDN,MAAM;AAaC,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBX,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;AAcN,MAAM;;;;;;;;;;;;AAUN,MAAM;AASN,IAAI,4DAAwB,CAAA,GAAA,0BAAY,EAAkC;IAAC,MAAM;AAAG;AACpF,IAAI,+DAA2B,CAAA,GAAA,0BAAY,EAAE;AAKtC,MAAM,4CAAuB,AAAd,WAAW,GAAI,CAAA,GAAA,uBAAS,EAAqB,SAAS,OAAyB,MAAqB,EAAE,GAAoC;IAC9J,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,IAAI,cAAc,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,qCAAU;IACvC,SAAQ,CAAA,GAAA,sCAAW,EAAE;IACrB,IAAI,aACF,YAAY,iBACZ,QAAQ,qBACR,aAAa,iBACb,SAAS,SACT,KAAK,EACL,aAAa,kBAAkB,gBAC/B,YAAY,YACZ,QAAQ,SACR,KAAK,QACL,OAAO,oBACP,gBAAgB,mBAChB,aAAa,6BACb,kBAAkB,oBAClB,mBAAmB,kBACnB,YAAY,eACZ,cAAc,gBAAgB,MAAM,CAAC,gCACrC,OAAO,EACP,GAAG,aACJ,GAAG;IAEJ,uEAAuE;IACvE,IAAI;IACJ,IAAI,SAAS,KACX,aAAa;SACR,IAAI,SAAS,KAClB,aAAa;SACR,IAAI,SAAS,KAClB,aAAa;SAEb,aAAa;IAGf,yFAAyF;IACzF,4FAA4F;IAC5F,mFAAmF;IACnF,IAAI,CAAC,WAAW,WAAW,GAAG,CAAA,GAAA,qBAAO,EAAE;IACvC,IAAI,qBAAC,iBAAiB,EAAC,GAAG,CAAA,GAAA,wCAAiB;IAC3C,IAAI,eAAe,CAAC;QAClB,IAAI,EAAE,WAAW,KAAK,SACpB;QAEF,WAAW;QACX,kBAAkB,UAAU,aAAa;YACvC,WAAW;QACb,GAAG;YAAC,MAAM;YAAM,SAAS;QAAI;IAC/B;IAEA,qBACE,gCAAC,CAAA,GAAA,iCAAS;QACP,GAAG,WAAW;QACf,aAAa;QACb,OAAO;QACP,WAAW,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAAsC;YAClE,UAAU,CAAC,CAAC;2BACZ;kBACA;QACF,GAAG,OAAM,MAAM;kBACd,CAAC,cAAC,UAAU,UAAE,MAAM,kBAAE,cAAc,aAAE,SAAS,cAAE,UAAU,EAAC,iBAC3D;0BACE,cAAA,iCAAC,4CAAsB,QAAQ;oBAAC,OAAO;8BAAC;oBAAI;;sCAC1C,gCAAC,CAAA,GAAA,oCAAS;4BACR,YAAY;4BACZ,YAAY;4BACZ,MAAM;4BACN,eAAe;4BACf,YAAY;4BACZ,SAAS;4BACT,oBAAoB;4BACpB,gBAAgB,OAAM,cAAc;sCACnC;;sCAEH,gCAAC,CAAA,GAAA,2CAAa;4BAAE,cAAc;4BAAc,WAAW;sCACrD,cAAA,gCAAC,CAAA,GAAA,iCAAK;gCACJ,KAAK;gCACL,OAAO,CAAA,cAAe,CAAA,GAAA,oCAAS,EAAE,QAAQ;gCACzC,0DAA0D;gCAC1D,aAAa;gCACb,WAAW;gCACX,WAAW,CAAA,cAAe,kCAAY;wCACpC,GAAG,WAAW;wCACd,MAAM;gDACN;iDACA;oCACF;0CACC,CAAC,4BACA;;0DACE,gCAAC,CAAA,GAAA,sCAAU;gDAAE,WAAW,kCAAY;6DAAC;gDAAO,KAAK;0DAC9C,CAAC,mBAAC,eAAe,EAAC;oDACjB,qBACE,gCAAC,CAAA,GAAA,mCAAO;wDACN,QAAQ;4DACN;gEAAC,CAAA,GAAA,qCAAU;gEAAG;oEACZ,OAAO;wEACL,MAAM;4EACJ,QAAQ,CAAA,GAAA,wCAAa,EAAE;gFAAC,MAAM;gFAAQ,QAAQ,CAAA,GAAA,2CAAgB;4EAAC;4EAC/D,QAAQ,CAAA,GAAA,8BAAG;wEACb;oEACF;gEACF;6DAAE;4DACF;gEAAC,CAAA,GAAA,qCAAU;gEAAG;oEACZ,OAAO;wEACL,aAAa,CAAC;wEACd,OAAO;4EAAC,MAAM;wEAIZ;oEACJ;gEACF;6DAAE;4DACF;gEAAC;gEAA0B;6DAAK;yDACjC;kEACA;;gDAGP;;4CAED,2BACC,gCAAC,CAAA,GAAA,wCAAa;gDAAE,YAAY;;0DAE9B,gCAAC,CAAA,GAAA,iCAAU;gDACT,MAAM;gDACN,WAAW;;4CACZ,kBAAkB,yBAAW,gCAAC;gDAAK,WAAW;;4CAC9C,aAAa,CAAC,cAAc,CAAC,WAC5B,iEAAiE;0DACjE,gCAAC;gDAAI,WAAW,oCAAc;oDAAC,GAAG,WAAW;0DAAE;gDAAI;;;;;;sCAM7D,gCAAC,CAAA,GAAA,kCAAO;4BACN,MAAM;4BACN,YAAY;4BACZ,WAAW;4BACX,aAAa;sCACZ;;sCAEH,gCAAC,CAAA,GAAA,qCAAU;4BACT,SAAS;4BACT,QAAQ;4BACR,WAAW,GAAG,UAAU,CAAC,EAAE,OAAO;4BAClC,YAAY;4BACZ,cAAc;gCACZ,OAAO,aAAa,CAAC,UAAU,GAAG,UAAU,EAAE,CAAC,GAAG;4BACpD;4BACA,QAAQ;;;;;;;;;8BAYL;sCACH,cAAA,gCAAC,CAAA,GAAA,mCAAO;gCACN,QAAQ;oCACN;wCAAC,CAAA,GAAA,uCAAY;wCAAG;4CAAC,QAAQ,CAAA,GAAA,uCAAY,EAAE;sDAAC;4CAAI;wCAAE;qCAAE;oCAChD;wCAAC,CAAA,GAAA,wCAAa;wCAAG;4CAAC,QAAQ,CAAA,GAAA,wCAAa;wCAAC;qCAAE;oCAC1C;wCAAC,CAAA,GAAA,qCAAU;wCAAG;4CACZ,OAAO;gDACL,aAAa;oDAAC,QAAQ,CAAA,GAAA,qCAAU,EAAE;8DAAC;oDAAI;gDAAE;4CAC3C;wCACF;qCAAE;iCACH;0CACD,cAAA,gCAAC,CAAA,GAAA,kCAAM;oCACL,OAAO;oCACP,WAAW,0CAAK;8CAAC;oCAAI;8CACpB;;;;;;;;AASnB;AAMA,MAAM,0CAAoB;IACxB,GAAG;IACH,GAAG;IACH,GAAG;IACH,IAAI;AACN;AAEO,SAAS,0CAAW,KAAsB;IAC/C,IAAI,MAAM,CAAA,GAAA,mBAAK,EAAE;IACjB,IAAI,SAAS,MAAM,IAAI,IAAI;IAC3B,IAAI,QAAC,IAAI,EAAC,GAAG,CAAA,GAAA,uBAAS,EAAE;IACxB,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,CAAA,GAAA,2CAAgB;4BAAC;4BAAI,QAAQ,CAAA,GAAA,8BAAG;wBAAC;oBACxF;gBAAC;0BACD,cAAA,iCAAC;oBACC,SAAS,CAAA,GAAA,qCAAU;oBACnB,OAAO;wBACL,OAAO;4BACL,OAAO;gCAAC,QAAQ,CAAA,GAAA,+BAAI,EAAE;0CAAC;gCAAI;4BAAE;4BAC7B,aAAa;gCAAC,QAAQ,CAAA,GAAA,qCAAU,EAAE;oCAAC,GAAG,WAAW;0CAAE;gCAAI;4BAAE;wBAC3D;oBACF;;wBACC,CAAC,wBAAU,gCAAC,CAAA,GAAA,iCAAY;4BAAE,MAAM,uCAAiB,CAAC,KAAK;4BAAE,WAAW,CAAA,GAAA,mCAAQ,EAAE;gCAAC,GAAG,WAAW;sCAAE;4BAAI;;wBACnG,OAAO,aAAa,yBAAW,gCAAC,CAAA,GAAA,8BAAG;4BAAE,MAAK;sCAAS;6BAAmB;;;;QAI/E;;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;AAGO,SAAS,0CAAgC,KAA4B;IAC1E,IAAI,QAAC,IAAI,EAAC,GAAG,CAAA,GAAA,uBAAS,EAAE;IACxB,qBACE;;0BACE,gCAAC,CAAA,GAAA,yCAAiB;gBACf,GAAG,KAAK;gBACT,WAAW,CAAA,GAAA,iCAAM,EAAE;0BAAC;gBAAI;0BACvB,MAAM,QAAQ;;0BAEjB,gCAAC,CAAA,GAAA,iCAAM;;;AAGb","sources":["packages/@react-spectrum/s2/src/Picker.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  ListBoxSection as AriaListBoxSection,\n  PopoverProps as AriaPopoverProps,\n  Select as AriaSelect,\n  SelectProps as AriaSelectProps,\n  SelectRenderProps as AriaSelectRenderProps,\n  Button,\n  ButtonRenderProps,\n  ContextValue,\n  ListBox,\n  ListBoxItem,\n  ListBoxItemProps,\n  ListBoxProps,\n  Provider,\n  SectionProps,\n  SelectValue\n} from 'react-aria-components';\nimport {baseColor, edgeToText, focusRing, style} from '../style' with {type: 'macro'};\nimport {centerBaseline} from './CenterBaseline';\nimport {\n  checkmark,\n  description,\n  Divider,\n  icon,\n  iconCenterWrapper,\n  label,\n  menuitem,\n  section,\n  sectionHeader,\n  sectionHeading\n} from './Menu';\nimport CheckmarkIcon from '../ui-icons/Checkmark';\nimport ChevronIcon from '../ui-icons/Chevron';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {\n  FieldErrorIcon,\n  FieldLabel,\n  HelpText\n} from './Field';\nimport {FocusableRef, FocusableRefValue, HelpTextProps, PressEvent, SpectrumLabelableProps} from '@react-types/shared';\nimport {FormContext, useFormProps} from './Form';\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 {PressResponder} from '@react-aria/interactions';\nimport {pressScale} from './pressScale';\nimport {raw} from '../style/style-macro' with {type: 'macro'};\nimport React, {createContext, forwardRef, ReactNode, useContext, useRef, useState} from 'react';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useGlobalListeners} from '@react-aria/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface PickerStyleProps {\n  /**\n   * The size of the Picker.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL',\n  /**\n   * Whether the picker should be displayed with a quiet style.\n   * @private\n   */\n  isQuiet?: boolean\n}\n\nexport interface PickerProps<T extends object> extends\n  Omit<AriaSelectProps<T>, 'children' | 'style' | 'className'>,\n  PickerStyleProps,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps,\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}\n\ninterface PickerButtonProps extends PickerStyleProps, ButtonRenderProps {}\n\nexport const PickerContext = createContext<ContextValue<Partial<PickerProps<any>>, FocusableRefValue<HTMLButtonElement>>>(null);\n\nconst inputButton = style<PickerButtonProps | AriaSelectRenderProps>({\n  ...focusRing(),\n  ...fieldInput(),\n  outlineStyle: {\n    default: 'none',\n    isFocusVisible: 'solid',\n    isQuiet: 'none'\n  },\n  position: 'relative',\n  font: 'control',\n  display: 'flex',\n  textAlign: 'start',\n  borderStyle: {\n    default: 'none',\n    forcedColors: 'solid'\n  },\n  borderColor: {\n    forcedColors: {\n      default: 'ButtonText',\n      isDisabled: 'GrayText'\n    }\n  },\n  borderRadius: 'control',\n  alignItems: 'center',\n  height: 'control',\n  transition: 'default',\n  columnGap: {\n    default: 'text-to-control',\n    isQuiet: 'text-to-visual'\n  },\n  paddingX: {\n    default: 'edge-to-text',\n    isQuiet: 0\n  },\n  backgroundColor: {\n    default: baseColor('gray-100'),\n    isOpen: 'gray-200',\n    isDisabled: 'disabled',\n    isQuiet: 'transparent'\n  },\n  color: {\n    default: 'neutral',\n    isDisabled: 'disabled'\n  },\n  maxWidth: {\n    isQuiet: 'max'\n  },\n  disableTapHighlight: true\n});\n\nconst quietFocusLine = style({\n  width: 'full',\n  // Use pixels since we are emulating a border.\n  height: '[2px]',\n  position: 'absolute',\n  bottom: 0,\n  borderRadius: 'full',\n  backgroundColor: {\n    default: 'blue-800',\n    forcedColors: 'Highlight'\n  }\n});\n\nexport let menu = style({\n  outlineStyle: 'none',\n  display: 'grid',\n  width: 'full',\n  gridTemplateColumns: {\n    size: {\n      S: [edgeToText(24), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(24)],\n      M: [edgeToText(32), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(32)],\n      L: [edgeToText(40), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(40)],\n      XL: [edgeToText(48), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(48)]\n    }\n  },\n  boxSizing: 'border-box',\n  maxHeight: '[inherit]',\n  overflow: 'auto',\n  padding: 8,\n  fontFamily: 'sans',\n  fontSize: 'control',\n  gridAutoRows: 'min-content'\n});\n\nconst invalidBorder = style({\n  position: 'absolute',\n  top: 0,\n  left: 0,\n  bottom: 0,\n  right: 0,\n  pointerEvents: 'none',\n  borderRadius: 'control',\n  borderStyle: 'solid',\n  borderWidth: 2,\n  borderColor: 'negative',\n  transition: 'default'\n});\n\nconst valueStyles = style({\n  flexGrow: {\n    default: 1,\n    isQuiet: 0\n  },\n  truncate: true,\n  display: 'flex',\n  alignItems: 'center'\n});\n\nconst iconStyles = style({\n  flexShrink: 0,\n  rotate: 90,\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  }\n});\n\nlet InternalPickerContext = createContext<{size: 'S' | 'M' | 'L' | 'XL'}>({size: 'M'});\nlet InsideSelectValueContext = createContext(false);\n\n/**\n * Pickers allow users to choose a single option from a collapsible list of options when space is limited.\n */\nexport const Picker = /*#__PURE__*/ (forwardRef as forwardRefType)(function 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  let formContext = useContext(FormContext);\n  props = useFormProps(props);\n  let {\n    direction = 'bottom',\n    align = 'start',\n    shouldFlip = true,\n    menuWidth,\n    label,\n    description: descriptionMessage,\n    errorMessage,\n    children,\n    items,\n    size = 'M',\n    labelPosition = 'top',\n    labelAlign = 'start',\n    necessityIndicator,\n    UNSAFE_className = '',\n    UNSAFE_style,\n    placeholder = stringFormatter.format('picker.placeholder'),\n    isQuiet,\n    ...pickerProps\n  } = props;\n\n  // Better way to encode this into a style? need to account for flipping\n  let menuOffset: number;\n  if (size === 'S') {\n    menuOffset = 6;\n  } else if (size === 'M') {\n    menuOffset = 6;\n  } else if (size === 'L') {\n    menuOffset = 7;\n  } else {\n    menuOffset = 8;\n  }\n\n  // For mouse interactions, pickers open on press start. When the popover underlay appears\n  // it covers the trigger button, causing onPressEnd to fire immediately and no press scaling\n  // to occur. We override this by listening for pointerup on the document ourselves.\n  let [isPressed, setPressed] = useState(false);\n  let {addGlobalListener} = useGlobalListeners();\n  let onPressStart = (e: PressEvent) => {\n    if (e.pointerType !== 'mouse') {\n      return;\n    }\n    setPressed(true);\n    addGlobalListener(document, 'pointerup', () => {\n      setPressed(false);\n    }, {once: true, capture: true});\n  };\n\n  return (\n    <AriaSelect\n      {...pickerProps}\n      placeholder={placeholder}\n      style={UNSAFE_style}\n      className={UNSAFE_className + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, props.styles)}>\n      {({isDisabled, isOpen, isFocusVisible, isInvalid, isRequired}) => (\n        <>\n          <InternalPickerContext.Provider value={{size}}>\n            <FieldLabel\n              isDisabled={isDisabled}\n              isRequired={isRequired}\n              size={size}\n              labelPosition={labelPosition}\n              labelAlign={labelAlign}\n              isQuiet={isQuiet}\n              necessityIndicator={necessityIndicator}\n              contextualHelp={props.contextualHelp}>\n              {label}\n            </FieldLabel>\n            <PressResponder onPressStart={onPressStart} isPressed={isPressed}>\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: size,\n                  isOpen,\n                  isQuiet\n                })}>\n                {(renderProps) => (\n                  <>\n                    <SelectValue className={valueStyles({isQuiet}) + ' ' + raw('&> * {display: none;}')}>\n                      {({defaultChildren}) => {\n                        return (\n                          <Provider\n                            values={[\n                              [IconContext, {\n                                slots: {\n                                  icon: {\n                                    render: centerBaseline({slot: 'icon', styles: iconCenterWrapper}),\n                                    styles: icon\n                                  }\n                                }\n                              }],\n                              [TextContext, {\n                                slots: {\n                                  description: {},\n                                  label: {styles: style({\n                                    display: 'block',\n                                    flexGrow: 1,\n                                    truncate: true\n                                  })}\n                                }\n                              }],\n                              [InsideSelectValueContext, true]\n                            ]}>\n                            {defaultChildren}\n                          </Provider>\n                        );\n                      }}\n                    </SelectValue>\n                    {isInvalid && (\n                      <FieldErrorIcon isDisabled={isDisabled} />\n                    )}\n                    <ChevronIcon\n                      size={size}\n                      className={iconStyles} />\n                    {isFocusVisible && isQuiet && <span className={quietFocusLine} /> }\n                    {isInvalid && !isDisabled && !isQuiet &&\n                      // @ts-ignore known limitation detecting functions from the theme\n                      <div className={invalidBorder({...renderProps, size})} />\n                    }\n                  </>\n                )}\n              </Button>\n            </PressResponder>\n            <HelpText\n              size={size}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              description={descriptionMessage}>\n              {errorMessage}\n            </HelpText>\n            <PopoverBase\n              hideArrow\n              offset={menuOffset}\n              placement={`${direction} ${align}` as Placement}\n              shouldFlip={shouldFlip}\n              UNSAFE_style={{\n                width: menuWidth && !isQuiet ? `${menuWidth}px` : undefined\n              }}\n              styles={style({\n                marginStart: {\n                  isQuiet: -12\n                },\n                minWidth: {\n                  default: '[var(--trigger-width)]',\n                  isQuiet: 192\n                },\n                width: {\n                  default: '[var(--trigger-width)]',\n                  isQuiet: '[calc(var(--trigger-width) + (-2 * self(marginStart)))]'\n                }\n              })(props)}>\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({size})}>\n                  {children}\n                </ListBox>\n              </Provider>\n            </PopoverBase>\n          </InternalPickerContext.Provider>\n        </>\n      )}\n    </AriaSelect>\n  );\n});\n\nexport interface PickerItemProps extends Omit<ListBoxItemProps, 'children' | 'style' | 'className'>, StyleProps {\n  children: ReactNode\n}\n\nconst checkmarkIconSize = {\n  S: 'XS',\n  M: 'M',\n  L: 'L',\n  XL: 'XL'\n} as const;\n\nexport function PickerItem(props: PickerItemProps) {\n  let ref = useRef(null);\n  let isLink = props.href != null;\n  let {size} = useContext(InternalPickerContext);\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                  label: {styles: label({size})},\n                  description: {styles: description({...renderProps, size})}\n                }\n              }}>\n              {!isLink && <CheckmarkIcon size={checkmarkIconSize[size]} className={checkmark({...renderProps, size})} />}\n              {typeof children === 'string' ? <Text slot=\"label\">{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\nexport interface PickerSectionProps<T extends object> extends SectionProps<T> {}\nexport function PickerSection<T extends object>(props: PickerSectionProps<T>) {\n  let {size} = useContext(InternalPickerContext);\n  return (\n    <>\n      <AriaListBoxSection\n        {...props}\n        className={section({size})}>\n        {props.children}\n      </AriaListBoxSection>\n      <Divider />\n    </>\n  );\n}\n"],"names":[],"version":3,"file":"Picker.cjs.map"}

package/dist/Picker.css

@@ -177,10 +177,6 @@
     --k: calc(3rem * var(--s2-scale));
   }
 
-  .lb {
-    width: 100%;
-  }
-
   .k-375zlr {
     height: 2px;
   }
@@ -209,6 +205,10 @@
     outline-style: none;
   }
 
+  .lb {
+    width: 100%;
+  }
+
   .__i-iov3cy {
     grid-template-columns: .5625rem auto auto minmax(0, 1fr) auto auto auto .5625rem;
   }
@@ -261,6 +261,10 @@
     font-family: adobe-clean-variable, adobe-clean, ui-sans-serif, system-ui, sans-serif;
   }
 
+  .__g-zexzcl {
+    grid-auto-rows: min-content;
+  }
+
   .Va {
     position: absolute;
   }
@@ -571,8 +575,6 @@
   }
 }
 
-@layer UNSAFE_overrides;
-
 @layer _.b.a {
   @media (forced-colors: active) {
     .da_____M {
@@ -632,8 +634,4 @@
     }
   }
 }
-
-.\.:not(#a#b) {
-  all: revert-layer;
-}
 /*# sourceMappingURL=Picker.css.map */

package/dist/Picker.css.map

@@ -1 +1 @@
-{"mappings":"ACgHoB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAkDG;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAaL;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAmBI;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAcF;;;;EAAA;;;;EAAA;;;;EAUD;;;;EAAA;;;;EAAA;;;;EA2DiB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAiCqC;;;;EAgBzB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA2C1B;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAjQF;EA+DF;;;;EAsGkB;;;;;AArKhB;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAkDG;;;;;;AAlDH;EAAA;IAAA;;;;;;AAAA;EAAA;IAAA;;;;IAqKgB;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAnHb","sources":["552e27cf637b06d3","packages/@react-spectrum/s2/src/Picker.tsx"],"sourcesContent":["@import \"3ea1b03e909704b0\";\n@import \"ee9bbd6fcdd43977\";\n@import \"6c757f8583900bce\";\n@import \"5664d1276ba33182\";\n@import \"4581fd7ca88158d4\";\n@import \"6f2c83ecc9c1c922\";\n@import \"5f2bbc1985161dbd\";\n@import \"19b2c692b4947046\";\n@import \"4d3d8008ddb5ca39\";\n@import \"6c5e73b19354c1ee\";\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 {\n  ListBoxSection as AriaListBoxSection,\n  PopoverProps as AriaPopoverProps,\n  Select as AriaSelect,\n  SelectProps as AriaSelectProps,\n  SelectRenderProps as AriaSelectRenderProps,\n  Button,\n  ButtonRenderProps,\n  ContextValue,\n  ListBox,\n  ListBoxItem,\n  ListBoxItemProps,\n  ListBoxProps,\n  Provider,\n  SectionProps,\n  SelectValue\n} from 'react-aria-components';\nimport {baseColor, edgeToText, focusRing, style} from '../style' with {type: 'macro'};\nimport {centerBaseline} from './CenterBaseline';\nimport {\n  checkmark,\n  description,\n  Divider,\n  icon,\n  iconCenterWrapper,\n  label,\n  menuitem,\n  section,\n  sectionHeader,\n  sectionHeading\n} from './Menu';\nimport CheckmarkIcon from '../ui-icons/Checkmark';\nimport ChevronIcon from '../ui-icons/Chevron';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {\n  FieldErrorIcon,\n  FieldLabel,\n  HelpText\n} from './Field';\nimport {FocusableRef, FocusableRefValue, HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\nimport {FormContext, useFormProps} from './Form';\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 {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface PickerStyleProps {\n  /**\n   * The size of the Picker.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL',\n  /**\n   * Whether the picker should be displayed with a quiet style.\n   * @private\n   */\n  isQuiet?: boolean\n}\n\nexport interface PickerProps<T extends object> extends\n  Omit<AriaSelectProps<T>, 'children' | 'style' | 'className'>,\n  PickerStyleProps,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps,\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}\n\ninterface PickerButtonProps extends PickerStyleProps, ButtonRenderProps {}\n\nexport const PickerContext = createContext<ContextValue<Partial<PickerProps<any>>, FocusableRefValue<HTMLButtonElement>>>(null);\n\nconst inputButton = style<PickerButtonProps | AriaSelectRenderProps>({\n  ...focusRing(),\n  ...fieldInput(),\n  outlineStyle: {\n    default: 'none',\n    isFocusVisible: 'solid',\n    isQuiet: 'none'\n  },\n  position: 'relative',\n  font: 'control',\n  display: 'flex',\n  textAlign: 'start',\n  borderStyle: {\n    default: 'none',\n    forcedColors: 'solid'\n  },\n  borderColor: {\n    forcedColors: {\n      default: 'ButtonText',\n      isDisabled: 'GrayText'\n    }\n  },\n  borderRadius: 'control',\n  alignItems: 'center',\n  height: 'control',\n  transition: 'default',\n  columnGap: {\n    default: 'text-to-control',\n    isQuiet: 'text-to-visual'\n  },\n  paddingX: {\n    default: 'edge-to-text',\n    isQuiet: 0\n  },\n  backgroundColor: {\n    default: baseColor('gray-100'),\n    isOpen: 'gray-200',\n    isDisabled: 'disabled',\n    isQuiet: 'transparent'\n  },\n  color: {\n    default: 'neutral',\n    isDisabled: 'disabled'\n  },\n  maxWidth: {\n    isQuiet: 'max'\n  },\n  disableTapHighlight: true\n});\n\nconst quietFocusLine = style({\n  width: 'full',\n  // Use pixels since we are emulating a border.\n  height: '[2px]',\n  position: 'absolute',\n  bottom: 0,\n  borderRadius: 'full',\n  backgroundColor: {\n    default: 'blue-800',\n    forcedColors: 'Highlight'\n  }\n});\n\nexport let menu = style({\n  outlineStyle: 'none',\n  display: 'grid',\n  gridTemplateColumns: {\n    size: {\n      S: [edgeToText(24), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(24)],\n      M: [edgeToText(32), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(32)],\n      L: [edgeToText(40), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(40)],\n      XL: [edgeToText(48), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(48)]\n    }\n  },\n  boxSizing: 'border-box',\n  maxHeight: '[inherit]',\n  overflow: 'auto',\n  padding: 8,\n  fontFamily: 'sans',\n  fontSize: 'control'\n});\n\nconst invalidBorder = style({\n  position: 'absolute',\n  top: 0,\n  left: 0,\n  bottom: 0,\n  right: 0,\n  pointerEvents: 'none',\n  borderRadius: 'control',\n  borderStyle: 'solid',\n  borderWidth: 2,\n  borderColor: 'negative',\n  transition: 'default'\n});\n\nconst valueStyles = style({\n  flexGrow: {\n    default: 1,\n    isQuiet: 0\n  },\n  truncate: true,\n  display: 'flex',\n  alignItems: 'center'\n});\n\nconst iconStyles = style({\n  flexShrink: 0,\n  rotate: 90,\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  }\n});\n\nlet InternalPickerContext = createContext<{size: 'S' | 'M' | 'L' | 'XL'}>({size: 'M'});\nlet InsideSelectValueContext = createContext(false);\n\n/**\n * Pickers allow users to choose a single option from a collapsible list of options when space is limited.\n */\nexport const Picker = /*#__PURE__*/ (forwardRef as forwardRefType)(function 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  let formContext = useContext(FormContext);\n  props = useFormProps(props);\n  let {\n    direction = 'bottom',\n    align = 'start',\n    shouldFlip = true,\n    menuWidth,\n    label,\n    description: descriptionMessage,\n    errorMessage,\n    children,\n    items,\n    size = 'M',\n    labelPosition = 'top',\n    labelAlign = 'start',\n    necessityIndicator,\n    UNSAFE_className = '',\n    UNSAFE_style,\n    placeholder = stringFormatter.format('picker.placeholder'),\n    isQuiet,\n    ...pickerProps\n  } = props;\n\n  // Better way to encode this into a style? need to account for flipping\n  let menuOffset: number;\n  if (size === 'S') {\n    menuOffset = 6;\n  } else if (size === 'M') {\n    menuOffset = 6;\n  } else if (size === 'L') {\n    menuOffset = 7;\n  } else {\n    menuOffset = 8;\n  }\n\n  return (\n    <AriaSelect\n      {...pickerProps}\n      placeholder={placeholder}\n      style={UNSAFE_style}\n      className={UNSAFE_className + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, props.styles)}>\n      {({isDisabled, isOpen, isFocusVisible, isInvalid, isRequired}) => (\n        <>\n          <InternalPickerContext.Provider value={{size}}>\n            <FieldLabel\n              isDisabled={isDisabled}\n              isRequired={isRequired}\n              size={size}\n              labelPosition={labelPosition}\n              labelAlign={labelAlign}\n              isQuiet={isQuiet}\n              necessityIndicator={necessityIndicator}\n              contextualHelp={props.contextualHelp}>\n              {label}\n            </FieldLabel>\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: size,\n                isOpen,\n                isQuiet\n              })}>\n              {(renderProps) => (\n                <>\n                  <SelectValue className={valueStyles({isQuiet}) + ' ' + raw('&> * {display: none;}')}>\n                    {({defaultChildren}) => {\n                      return (\n                        <Provider\n                          values={[\n                            [IconContext, {\n                              slots: {\n                                icon: {\n                                  render: centerBaseline({slot: 'icon', styles: iconCenterWrapper}),\n                                  styles: icon\n                                }\n                              }\n                            }],\n                            [TextContext, {\n                              slots: {\n                                description: {},\n                                label: {styles: style({\n                                  display: 'block',\n                                  flexGrow: 1,\n                                  truncate: true\n                                })}\n                              }\n                            }],\n                            [InsideSelectValueContext, true]\n                          ]}>\n                          {defaultChildren}\n                        </Provider>\n                      );\n                    }}\n                  </SelectValue>\n                  {isInvalid && (\n                    <FieldErrorIcon isDisabled={isDisabled} />\n                  )}\n                  <ChevronIcon\n                    size={size}\n                    className={iconStyles} />\n                  {isFocusVisible && isQuiet && <span className={quietFocusLine} /> }\n                  {isInvalid && !isDisabled && !isQuiet &&\n                    // @ts-ignore known limitation detecting functions from the theme\n                    <div className={invalidBorder({...renderProps, size})} />\n                  }\n                </>\n              )}\n            </Button>\n            <HelpText\n              size={size}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              description={descriptionMessage}>\n              {errorMessage}\n            </HelpText>\n            <PopoverBase\n              hideArrow\n              offset={menuOffset}\n              placement={`${direction} ${align}` as Placement}\n              shouldFlip={shouldFlip}\n              UNSAFE_style={{\n                width: menuWidth && !isQuiet ? `${menuWidth}px` : undefined\n              }}\n              styles={style({\n                marginStart: {\n                  isQuiet: -12\n                },\n                minWidth: {\n                  default: '[var(--trigger-width)]',\n                  isQuiet: 192\n                },\n                width: {\n                  default: '[var(--trigger-width)]',\n                  isQuiet: '[calc(var(--trigger-width) + (-2 * self(marginStart)))]'\n                }\n              })(props)}>\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({size})}>\n                  {children}\n                </ListBox>\n              </Provider>\n            </PopoverBase>\n          </InternalPickerContext.Provider>\n        </>\n      )}\n    </AriaSelect>\n  );\n});\n\nexport interface PickerItemProps extends Omit<ListBoxItemProps, 'children' | 'style' | 'className'>, StyleProps {\n  children: ReactNode\n}\n\nconst checkmarkIconSize = {\n  S: 'XS',\n  M: 'M',\n  L: 'L',\n  XL: 'XL'\n} as const;\n\nexport function PickerItem(props: PickerItemProps) {\n  let ref = useRef(null);\n  let isLink = props.href != null;\n  let {size} = useContext(InternalPickerContext);\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                  label: {styles: label({size})},\n                  description: {styles: description({...renderProps, size})}\n                }\n              }}>\n              {!isLink && <CheckmarkIcon size={checkmarkIconSize[size]} className={checkmark({...renderProps, size})} />}\n              {typeof children === 'string' ? <Text slot=\"label\">{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\nexport interface PickerSectionProps<T extends object> extends SectionProps<T> {}\nexport function PickerSection<T extends object>(props: PickerSectionProps<T>) {\n  let {size} = useContext(InternalPickerContext);\n  return (\n    <>\n      <AriaListBoxSection\n        {...props}\n        className={section({size})}>\n        {props.children}\n      </AriaListBoxSection>\n      <Divider />\n    </>\n  );\n}\n"],"names":[],"version":3,"file":"Picker.css.map"}
+{"mappings":"ACkHoB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAkDG;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAaL;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAqBI;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAcF;;;;EAAA;;;;EAAA;;;;EAUD;;;;EAAA;;;;EAAA;;;;EA0EiB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAkCuC;;;;EAgBzB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA4C5B;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AApRF;EA+DF;;;;EAuHkB;;;;;AAtLhB;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAkDG;;;;;;AAlDH;EAAA;IAAA;;;;;;AAAA;EAAA;IAAA;;;;IAsLgB;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA","sources":["552e27cf637b06d3","packages/@react-spectrum/s2/src/Picker.tsx"],"sourcesContent":["@import \"3ea1b03e909704b0\";\n@import \"ee9bbd6fcdd43977\";\n@import \"6c757f8583900bce\";\n@import \"5664d1276ba33182\";\n@import \"4581fd7ca88158d4\";\n@import \"6f2c83ecc9c1c922\";\n@import \"5f2bbc1985161dbd\";\n@import \"19b2c692b4947046\";\n@import \"4d3d8008ddb5ca39\";\n@import \"6c5e73b19354c1ee\";\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 {\n  ListBoxSection as AriaListBoxSection,\n  PopoverProps as AriaPopoverProps,\n  Select as AriaSelect,\n  SelectProps as AriaSelectProps,\n  SelectRenderProps as AriaSelectRenderProps,\n  Button,\n  ButtonRenderProps,\n  ContextValue,\n  ListBox,\n  ListBoxItem,\n  ListBoxItemProps,\n  ListBoxProps,\n  Provider,\n  SectionProps,\n  SelectValue\n} from 'react-aria-components';\nimport {baseColor, edgeToText, focusRing, style} from '../style' with {type: 'macro'};\nimport {centerBaseline} from './CenterBaseline';\nimport {\n  checkmark,\n  description,\n  Divider,\n  icon,\n  iconCenterWrapper,\n  label,\n  menuitem,\n  section,\n  sectionHeader,\n  sectionHeading\n} from './Menu';\nimport CheckmarkIcon from '../ui-icons/Checkmark';\nimport ChevronIcon from '../ui-icons/Chevron';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {\n  FieldErrorIcon,\n  FieldLabel,\n  HelpText\n} from './Field';\nimport {FocusableRef, FocusableRefValue, HelpTextProps, PressEvent, SpectrumLabelableProps} from '@react-types/shared';\nimport {FormContext, useFormProps} from './Form';\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 {PressResponder} from '@react-aria/interactions';\nimport {pressScale} from './pressScale';\nimport {raw} from '../style/style-macro' with {type: 'macro'};\nimport React, {createContext, forwardRef, ReactNode, useContext, useRef, useState} from 'react';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useGlobalListeners} from '@react-aria/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface PickerStyleProps {\n  /**\n   * The size of the Picker.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL',\n  /**\n   * Whether the picker should be displayed with a quiet style.\n   * @private\n   */\n  isQuiet?: boolean\n}\n\nexport interface PickerProps<T extends object> extends\n  Omit<AriaSelectProps<T>, 'children' | 'style' | 'className'>,\n  PickerStyleProps,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps,\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}\n\ninterface PickerButtonProps extends PickerStyleProps, ButtonRenderProps {}\n\nexport const PickerContext = createContext<ContextValue<Partial<PickerProps<any>>, FocusableRefValue<HTMLButtonElement>>>(null);\n\nconst inputButton = style<PickerButtonProps | AriaSelectRenderProps>({\n  ...focusRing(),\n  ...fieldInput(),\n  outlineStyle: {\n    default: 'none',\n    isFocusVisible: 'solid',\n    isQuiet: 'none'\n  },\n  position: 'relative',\n  font: 'control',\n  display: 'flex',\n  textAlign: 'start',\n  borderStyle: {\n    default: 'none',\n    forcedColors: 'solid'\n  },\n  borderColor: {\n    forcedColors: {\n      default: 'ButtonText',\n      isDisabled: 'GrayText'\n    }\n  },\n  borderRadius: 'control',\n  alignItems: 'center',\n  height: 'control',\n  transition: 'default',\n  columnGap: {\n    default: 'text-to-control',\n    isQuiet: 'text-to-visual'\n  },\n  paddingX: {\n    default: 'edge-to-text',\n    isQuiet: 0\n  },\n  backgroundColor: {\n    default: baseColor('gray-100'),\n    isOpen: 'gray-200',\n    isDisabled: 'disabled',\n    isQuiet: 'transparent'\n  },\n  color: {\n    default: 'neutral',\n    isDisabled: 'disabled'\n  },\n  maxWidth: {\n    isQuiet: 'max'\n  },\n  disableTapHighlight: true\n});\n\nconst quietFocusLine = style({\n  width: 'full',\n  // Use pixels since we are emulating a border.\n  height: '[2px]',\n  position: 'absolute',\n  bottom: 0,\n  borderRadius: 'full',\n  backgroundColor: {\n    default: 'blue-800',\n    forcedColors: 'Highlight'\n  }\n});\n\nexport let menu = style({\n  outlineStyle: 'none',\n  display: 'grid',\n  width: 'full',\n  gridTemplateColumns: {\n    size: {\n      S: [edgeToText(24), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(24)],\n      M: [edgeToText(32), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(32)],\n      L: [edgeToText(40), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(40)],\n      XL: [edgeToText(48), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(48)]\n    }\n  },\n  boxSizing: 'border-box',\n  maxHeight: '[inherit]',\n  overflow: 'auto',\n  padding: 8,\n  fontFamily: 'sans',\n  fontSize: 'control',\n  gridAutoRows: 'min-content'\n});\n\nconst invalidBorder = style({\n  position: 'absolute',\n  top: 0,\n  left: 0,\n  bottom: 0,\n  right: 0,\n  pointerEvents: 'none',\n  borderRadius: 'control',\n  borderStyle: 'solid',\n  borderWidth: 2,\n  borderColor: 'negative',\n  transition: 'default'\n});\n\nconst valueStyles = style({\n  flexGrow: {\n    default: 1,\n    isQuiet: 0\n  },\n  truncate: true,\n  display: 'flex',\n  alignItems: 'center'\n});\n\nconst iconStyles = style({\n  flexShrink: 0,\n  rotate: 90,\n  '--iconPrimary': {\n    type: 'fill',\n    value: 'currentColor'\n  }\n});\n\nlet InternalPickerContext = createContext<{size: 'S' | 'M' | 'L' | 'XL'}>({size: 'M'});\nlet InsideSelectValueContext = createContext(false);\n\n/**\n * Pickers allow users to choose a single option from a collapsible list of options when space is limited.\n */\nexport const Picker = /*#__PURE__*/ (forwardRef as forwardRefType)(function 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  let formContext = useContext(FormContext);\n  props = useFormProps(props);\n  let {\n    direction = 'bottom',\n    align = 'start',\n    shouldFlip = true,\n    menuWidth,\n    label,\n    description: descriptionMessage,\n    errorMessage,\n    children,\n    items,\n    size = 'M',\n    labelPosition = 'top',\n    labelAlign = 'start',\n    necessityIndicator,\n    UNSAFE_className = '',\n    UNSAFE_style,\n    placeholder = stringFormatter.format('picker.placeholder'),\n    isQuiet,\n    ...pickerProps\n  } = props;\n\n  // Better way to encode this into a style? need to account for flipping\n  let menuOffset: number;\n  if (size === 'S') {\n    menuOffset = 6;\n  } else if (size === 'M') {\n    menuOffset = 6;\n  } else if (size === 'L') {\n    menuOffset = 7;\n  } else {\n    menuOffset = 8;\n  }\n\n  // For mouse interactions, pickers open on press start. When the popover underlay appears\n  // it covers the trigger button, causing onPressEnd to fire immediately and no press scaling\n  // to occur. We override this by listening for pointerup on the document ourselves.\n  let [isPressed, setPressed] = useState(false);\n  let {addGlobalListener} = useGlobalListeners();\n  let onPressStart = (e: PressEvent) => {\n    if (e.pointerType !== 'mouse') {\n      return;\n    }\n    setPressed(true);\n    addGlobalListener(document, 'pointerup', () => {\n      setPressed(false);\n    }, {once: true, capture: true});\n  };\n\n  return (\n    <AriaSelect\n      {...pickerProps}\n      placeholder={placeholder}\n      style={UNSAFE_style}\n      className={UNSAFE_className + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, props.styles)}>\n      {({isDisabled, isOpen, isFocusVisible, isInvalid, isRequired}) => (\n        <>\n          <InternalPickerContext.Provider value={{size}}>\n            <FieldLabel\n              isDisabled={isDisabled}\n              isRequired={isRequired}\n              size={size}\n              labelPosition={labelPosition}\n              labelAlign={labelAlign}\n              isQuiet={isQuiet}\n              necessityIndicator={necessityIndicator}\n              contextualHelp={props.contextualHelp}>\n              {label}\n            </FieldLabel>\n            <PressResponder onPressStart={onPressStart} isPressed={isPressed}>\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: size,\n                  isOpen,\n                  isQuiet\n                })}>\n                {(renderProps) => (\n                  <>\n                    <SelectValue className={valueStyles({isQuiet}) + ' ' + raw('&> * {display: none;}')}>\n                      {({defaultChildren}) => {\n                        return (\n                          <Provider\n                            values={[\n                              [IconContext, {\n                                slots: {\n                                  icon: {\n                                    render: centerBaseline({slot: 'icon', styles: iconCenterWrapper}),\n                                    styles: icon\n                                  }\n                                }\n                              }],\n                              [TextContext, {\n                                slots: {\n                                  description: {},\n                                  label: {styles: style({\n                                    display: 'block',\n                                    flexGrow: 1,\n                                    truncate: true\n                                  })}\n                                }\n                              }],\n                              [InsideSelectValueContext, true]\n                            ]}>\n                            {defaultChildren}\n                          </Provider>\n                        );\n                      }}\n                    </SelectValue>\n                    {isInvalid && (\n                      <FieldErrorIcon isDisabled={isDisabled} />\n                    )}\n                    <ChevronIcon\n                      size={size}\n                      className={iconStyles} />\n                    {isFocusVisible && isQuiet && <span className={quietFocusLine} /> }\n                    {isInvalid && !isDisabled && !isQuiet &&\n                      // @ts-ignore known limitation detecting functions from the theme\n                      <div className={invalidBorder({...renderProps, size})} />\n                    }\n                  </>\n                )}\n              </Button>\n            </PressResponder>\n            <HelpText\n              size={size}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              description={descriptionMessage}>\n              {errorMessage}\n            </HelpText>\n            <PopoverBase\n              hideArrow\n              offset={menuOffset}\n              placement={`${direction} ${align}` as Placement}\n              shouldFlip={shouldFlip}\n              UNSAFE_style={{\n                width: menuWidth && !isQuiet ? `${menuWidth}px` : undefined\n              }}\n              styles={style({\n                marginStart: {\n                  isQuiet: -12\n                },\n                minWidth: {\n                  default: '[var(--trigger-width)]',\n                  isQuiet: 192\n                },\n                width: {\n                  default: '[var(--trigger-width)]',\n                  isQuiet: '[calc(var(--trigger-width) + (-2 * self(marginStart)))]'\n                }\n              })(props)}>\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({size})}>\n                  {children}\n                </ListBox>\n              </Provider>\n            </PopoverBase>\n          </InternalPickerContext.Provider>\n        </>\n      )}\n    </AriaSelect>\n  );\n});\n\nexport interface PickerItemProps extends Omit<ListBoxItemProps, 'children' | 'style' | 'className'>, StyleProps {\n  children: ReactNode\n}\n\nconst checkmarkIconSize = {\n  S: 'XS',\n  M: 'M',\n  L: 'L',\n  XL: 'XL'\n} as const;\n\nexport function PickerItem(props: PickerItemProps) {\n  let ref = useRef(null);\n  let isLink = props.href != null;\n  let {size} = useContext(InternalPickerContext);\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                  label: {styles: label({size})},\n                  description: {styles: description({...renderProps, size})}\n                }\n              }}>\n              {!isLink && <CheckmarkIcon size={checkmarkIconSize[size]} className={checkmark({...renderProps, size})} />}\n              {typeof children === 'string' ? <Text slot=\"label\">{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\nexport interface PickerSectionProps<T extends object> extends SectionProps<T> {}\nexport function PickerSection<T extends object>(props: PickerSectionProps<T>) {\n  let {size} = useContext(InternalPickerContext);\n  return (\n    <>\n      <AriaListBoxSection\n        {...props}\n        className={section({size})}>\n        {props.children}\n      </AriaListBoxSection>\n      <Divider />\n    </>\n  );\n}\n"],"names":[],"version":3,"file":"Picker.css.map"}