@adobe/react-spectrum 3.47.0 → 3.47.1

package/dist/private/color/ColorField.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;AAoCM,MAAM,0DAAa,CAAA,GAAA,sCAAI,EAAE,UAAU,CAAC,SAAS,WAAW,KAA8B,EAAE,GAAsB;IACnH,QAAQ,CAAA,GAAA,0CAAe,EAAE;IACzB,QAAQ,CAAA,GAAA,sCAAW,EAAE;IACrB,CAAC,MAAM,GAAG,CAAA,GAAA,+CAAc,EAAE,OAAO,MAAM,CAAA,GAAA,sDAAgB;IAEvD,IAAI,YAAY,CAAA,GAAA,mBAAK,EAAE;IACvB,CAAA,GAAA,sBAAQ,EAAE;QACR,IAAI,MAAM,WAAW,IAAI,CAAC,UAAU,OAAO,IAAI,QAAQ,GAAG,CAAC,QAAQ,KAAK,cAAc;YACpF,QAAQ,IAAI,CAAC;YACb,UAAU,OAAO,GAAG;QACtB;IACF,GAAG;QAAC,MAAM,WAAW;KAAC;IAEtB,IAAI,MAAM,OAAO,EACf,qBAAO,0DAAC;QAAmB,GAAG,KAAK;QAAE,SAAS,MAAM,OAAO;QAAE,cAAc;;SAE3E,qBAAO,0DAAC;QAAe,GAAG,KAAK;QAAE,cAAc;;AAEnD;AAOA,SAAS,wCAAkB,KAA6B;IACtD,IAAI,SACF,qDAAqD;IACrD,KAAK,gBACL,YAAY,YACZ,QAAQ,YACR,QAAQ,gBACR,YAAY,EACZ,GAAG,YACJ,GAAG;IACJ,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,sCAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,+DAAwB,EAAE;QACpC,GAAG,KAAK;gBACR;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,mBAAK,EAA0C;IAC9D,IAAI,SAAS,CAAA,GAAA,kDAAmB,EAAE,YAAY,OAAO;IAErD,qBACE,oIACE,0DAAC,CAAA,GAAA,uCAAY;QACV,GAAG,UAAU;QACd,KAAK;QACL,UAAU;QACT,GAAG,MAAM;QACV,gBAAgB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;QACpC,MAAM,IAAI,kBAAI,0DAAC;QAAM,MAAK;QAAS,MAAM,MAAM,IAAI;QAAE,MAAM,MAAM,IAAI;QAAE,OAAO,MAAM,MAAM,WAAW,IAAI,KAAK,MAAM,WAAW;;AAGtI;AAMA,SAAS,oCAAc,KAAyB;IAC9C,IAAI,SACF,qDAAqD;IACrD,KAAK,gBACL,YAAY,YACZ,QAAQ,gBACR,YAAY,EACZ,GAAG,YACJ,GAAG;IACJ,IAAI,QAAQ,CAAA,GAAA,wDAAiB,EAAE;IAC/B,IAAI,WAAW,CAAA,GAAA,mBAAK,EAA0C;IAC9D,IAAI,SAAS,CAAA,GAAA,2CAAY,EAAE,YAAY,OAAO;IAE9C,qBACE,0DAAC,CAAA,GAAA,uCAAY;QACV,GAAG,UAAU;QACd,KAAK;QACL,UAAU;QACT,GAAG,MAAM;QACV,gBAAgB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;;AAEzC","sources":["packages/@adobe/react-spectrum/src/color/ColorField.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorFieldProps, useColorChannelField, useColorField} from 'react-aria/useColorField';\n\nimport {classNames} from '../utils/classNames';\nimport {Color, ColorChannel, ColorSpace} from 'react-stately/Color';\nimport {ColorFieldContext} from 'react-aria-components/ColorField';\nimport React, {Ref, useEffect, useRef} from 'react';\nimport {SpectrumFieldValidation, SpectrumLabelableProps, SpectrumTextInputBase, StyleProps} from '@react-types/shared';\nimport styles from './colorfield.css';\nimport {TextFieldBase} from '../textfield/TextFieldBase';\nimport {TextFieldRef} from '../textfield/TextField';\nimport {useColorChannelFieldState, useColorFieldState} from 'react-stately/useColorFieldState';\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useFormProps} from '../form/Form';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useProviderProps} from '../provider/Provider';\n\nexport interface SpectrumColorFieldProps extends SpectrumTextInputBase, Omit<AriaColorFieldProps, 'isInvalid' | 'validationState'>, SpectrumFieldValidation<Color | null>, SpectrumLabelableProps, StyleProps {\n  /**\n   * The color channel that this field edits. If not provided,\n   * the color is edited as a hex value.\n   */\n  channel?: ColorChannel,\n  /**\n   * The color space that the color field operates in if a `channel` prop is provided.\n   * If no `channel` is provided, the color field always displays the color as an RGB hex value.\n   */\n  colorSpace?: ColorSpace,\n  /** Whether the ColorField should be displayed with a quiet style. */\n  isQuiet?: boolean\n}\n\n/**\n * A color field allows users to edit a hex color or individual color channel value.\n */\nexport const ColorField = React.forwardRef(function ColorField(props: SpectrumColorFieldProps, ref: Ref<TextFieldRef>) {\n  props = useProviderProps(props);\n  props = useFormProps(props);\n  [props] = useContextProps(props, null, ColorFieldContext);\n  \n  let hasWarned = useRef(false);\n  useEffect(() => {\n    if (props.placeholder && !hasWarned.current && process.env.NODE_ENV !== 'production') {\n      console.warn('Placeholders are deprecated due to accessibility issues. Please use help text instead. See the docs for details: https://react-spectrum.adobe.com/react-spectrum/ColorField.html#help-text');\n      hasWarned.current = true;\n    }\n  }, [props.placeholder]);\n\n  if (props.channel) {\n    return <ColorChannelField {...props} channel={props.channel} forwardedRef={ref} />;\n  } else {\n    return <HexColorField {...props} forwardedRef={ref} />;\n  }\n});\n\ninterface ColorChannelFieldProps extends Omit<SpectrumColorFieldProps, 'channel'> {\n  channel: ColorChannel,\n  forwardedRef: Ref<TextFieldRef>\n}\n\nfunction ColorChannelField(props: ColorChannelFieldProps) {\n  let {\n    // These disabled props are handled by the state hook\n    value,          // eslint-disable-line @typescript-eslint/no-unused-vars\n    defaultValue,   // eslint-disable-line @typescript-eslint/no-unused-vars\n    onChange,       // eslint-disable-line @typescript-eslint/no-unused-vars\n    validate,       // eslint-disable-line @typescript-eslint/no-unused-vars\n    forwardedRef,\n    ...otherProps\n  } = props;\n  let {locale} = useLocale();\n  let state = useColorChannelFieldState({\n    ...props,\n    locale\n  });\n\n  let inputRef = useRef<HTMLInputElement & HTMLTextAreaElement>(null);\n  let result = useColorChannelField(otherProps, state, inputRef);\n\n  return (\n    <>\n      <TextFieldBase\n        {...otherProps}\n        ref={forwardedRef}\n        inputRef={inputRef}\n        {...result}\n        inputClassName={classNames(styles, 'react-spectrum-ColorField-input')} />\n      {props.name && <input type=\"hidden\" name={props.name} form={props.form} value={isNaN(state.numberValue) ? '' : state.numberValue} />}\n    </>\n  );\n}\n\ninterface HexColorFieldProps extends SpectrumColorFieldProps {\n  forwardedRef: Ref<TextFieldRef>\n}\n\nfunction HexColorField(props: HexColorFieldProps) {\n  let {\n    // These disabled props are handled by the state hook\n    value,          // eslint-disable-line @typescript-eslint/no-unused-vars\n    defaultValue,   // eslint-disable-line @typescript-eslint/no-unused-vars\n    onChange,       // eslint-disable-line @typescript-eslint/no-unused-vars\n    forwardedRef,\n    ...otherProps\n  } = props;\n  let state = useColorFieldState(props);\n  let inputRef = useRef<HTMLInputElement & HTMLTextAreaElement>(null);\n  let result = useColorField(otherProps, state, inputRef);\n\n  return (\n    <TextFieldBase\n      {...otherProps}\n      ref={forwardedRef}\n      inputRef={inputRef}\n      {...result}\n      inputClassName={classNames(styles, 'react-spectrum-ColorField-input')} />\n  );\n}\n"],"names":[],"version":3,"file":"ColorField.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;AA+CM,MAAM,0DAAa,CAAA,GAAA,sCAAI,EAAE,UAAU,CAAC,SAAS,WAClD,KAA8B,EAC9B,GAAsB;IAEtB,QAAQ,CAAA,GAAA,0CAAe,EAAE;IACzB,QAAQ,CAAA,GAAA,sCAAW,EAAE;IACrB,CAAC,MAAM,GAAG,CAAA,GAAA,+CAAc,EAAE,OAAO,MAAM,CAAA,GAAA,sDAAgB;IAEvD,IAAI,YAAY,CAAA,GAAA,mBAAK,EAAE;IACvB,CAAA,GAAA,sBAAQ,EAAE;QACR,IAAI,MAAM,WAAW,IAAI,CAAC,UAAU,OAAO,IAAI,QAAQ,GAAG,CAAC,QAAQ,KAAK,cAAc;YACpF,QAAQ,IAAI,CACV;YAEF,UAAU,OAAO,GAAG;QACtB;IACF,GAAG;QAAC,MAAM,WAAW;KAAC;IAEtB,IAAI,MAAM,OAAO,EACf,qBAAO,0DAAC;QAAmB,GAAG,KAAK;QAAE,SAAS,MAAM,OAAO;QAAE,cAAc;;SAE3E,qBAAO,0DAAC;QAAe,GAAG,KAAK;QAAE,cAAc;;AAEnD;AAOA,SAAS,wCAAkB,KAA6B;IACtD,IAAI,SACF,qDAAqD;IACrD,KAAK,gBACL,YAAY,YACZ,QAAQ,YACR,QAAQ,gBACR,YAAY,EACZ,GAAG,YACJ,GAAG;IACJ,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,sCAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,+DAAwB,EAAE;QACpC,GAAG,KAAK;gBACR;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,mBAAK,EAA0C;IAC9D,IAAI,SAAS,CAAA,GAAA,kDAAmB,EAAE,YAAY,OAAO;IAErD,qBACE,oIACE,0DAAC,CAAA,GAAA,uCAAY;QACV,GAAG,UAAU;QACd,KAAK;QACL,UAAU;QACT,GAAG,MAAM;QACV,gBAAgB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;QAEpC,MAAM,IAAI,kBACT,0DAAC;QACC,MAAK;QACL,MAAM,MAAM,IAAI;QAChB,MAAM,MAAM,IAAI;QAChB,OAAO,MAAM,MAAM,WAAW,IAAI,KAAK,MAAM,WAAW;;AAKlE;AAMA,SAAS,oCAAc,KAAyB;IAC9C,IAAI,SACF,qDAAqD;IACrD,KAAK,gBACL,YAAY,YACZ,QAAQ,gBACR,YAAY,EACZ,GAAG,YACJ,GAAG;IACJ,IAAI,QAAQ,CAAA,GAAA,wDAAiB,EAAE;IAC/B,IAAI,WAAW,CAAA,GAAA,mBAAK,EAA0C;IAC9D,IAAI,SAAS,CAAA,GAAA,2CAAY,EAAE,YAAY,OAAO;IAE9C,qBACE,0DAAC,CAAA,GAAA,uCAAY;QACV,GAAG,UAAU;QACd,KAAK;QACL,UAAU;QACT,GAAG,MAAM;QACV,gBAAgB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;;AAGzC","sources":["packages/@adobe/react-spectrum/src/color/ColorField.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorFieldProps, useColorChannelField, useColorField} from 'react-aria/useColorField';\n\nimport {classNames} from '../utils/classNames';\nimport {Color, ColorChannel, ColorSpace} from 'react-stately/Color';\nimport {ColorFieldContext} from 'react-aria-components/ColorField';\nimport React, {Ref, useEffect, useRef} from 'react';\nimport {\n  SpectrumFieldValidation,\n  SpectrumLabelableProps,\n  SpectrumTextInputBase,\n  StyleProps\n} from '@react-types/shared';\nimport styles from './colorfield.css';\nimport {TextFieldBase} from '../textfield/TextFieldBase';\nimport {TextFieldRef} from '../textfield/TextField';\nimport {useColorChannelFieldState, useColorFieldState} from 'react-stately/useColorFieldState';\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useFormProps} from '../form/Form';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useProviderProps} from '../provider/Provider';\n\nexport interface SpectrumColorFieldProps\n  extends\n    SpectrumTextInputBase,\n    Omit<AriaColorFieldProps, 'isInvalid' | 'validationState'>,\n    SpectrumFieldValidation<Color | null>,\n    SpectrumLabelableProps,\n    StyleProps {\n  /**\n   * The color channel that this field edits. If not provided,\n   * the color is edited as a hex value.\n   */\n  channel?: ColorChannel;\n  /**\n   * The color space that the color field operates in if a `channel` prop is provided.\n   * If no `channel` is provided, the color field always displays the color as an RGB hex value.\n   */\n  colorSpace?: ColorSpace;\n  /** Whether the ColorField should be displayed with a quiet style. */\n  isQuiet?: boolean;\n}\n\n/**\n * A color field allows users to edit a hex color or individual color channel value.\n */\nexport const ColorField = React.forwardRef(function ColorField(\n  props: SpectrumColorFieldProps,\n  ref: Ref<TextFieldRef>\n) {\n  props = useProviderProps(props);\n  props = useFormProps(props);\n  [props] = useContextProps(props, null, ColorFieldContext);\n\n  let hasWarned = useRef(false);\n  useEffect(() => {\n    if (props.placeholder && !hasWarned.current && process.env.NODE_ENV !== 'production') {\n      console.warn(\n        'Placeholders are deprecated due to accessibility issues. Please use help text instead. See the docs for details: https://react-spectrum.adobe.com/react-spectrum/ColorField.html#help-text'\n      );\n      hasWarned.current = true;\n    }\n  }, [props.placeholder]);\n\n  if (props.channel) {\n    return <ColorChannelField {...props} channel={props.channel} forwardedRef={ref} />;\n  } else {\n    return <HexColorField {...props} forwardedRef={ref} />;\n  }\n});\n\ninterface ColorChannelFieldProps extends Omit<SpectrumColorFieldProps, 'channel'> {\n  channel: ColorChannel;\n  forwardedRef: Ref<TextFieldRef>;\n}\n\nfunction ColorChannelField(props: ColorChannelFieldProps) {\n  let {\n    // These disabled props are handled by the state hook\n    value, // eslint-disable-line @typescript-eslint/no-unused-vars\n    defaultValue, // eslint-disable-line @typescript-eslint/no-unused-vars\n    onChange, // eslint-disable-line @typescript-eslint/no-unused-vars\n    validate, // eslint-disable-line @typescript-eslint/no-unused-vars\n    forwardedRef,\n    ...otherProps\n  } = props;\n  let {locale} = useLocale();\n  let state = useColorChannelFieldState({\n    ...props,\n    locale\n  });\n\n  let inputRef = useRef<HTMLInputElement & HTMLTextAreaElement>(null);\n  let result = useColorChannelField(otherProps, state, inputRef);\n\n  return (\n    <>\n      <TextFieldBase\n        {...otherProps}\n        ref={forwardedRef}\n        inputRef={inputRef}\n        {...result}\n        inputClassName={classNames(styles, 'react-spectrum-ColorField-input')}\n      />\n      {props.name && (\n        <input\n          type=\"hidden\"\n          name={props.name}\n          form={props.form}\n          value={isNaN(state.numberValue) ? '' : state.numberValue}\n        />\n      )}\n    </>\n  );\n}\n\ninterface HexColorFieldProps extends SpectrumColorFieldProps {\n  forwardedRef: Ref<TextFieldRef>;\n}\n\nfunction HexColorField(props: HexColorFieldProps) {\n  let {\n    // These disabled props are handled by the state hook\n    value, // eslint-disable-line @typescript-eslint/no-unused-vars\n    defaultValue, // eslint-disable-line @typescript-eslint/no-unused-vars\n    onChange, // eslint-disable-line @typescript-eslint/no-unused-vars\n    forwardedRef,\n    ...otherProps\n  } = props;\n  let state = useColorFieldState(props);\n  let inputRef = useRef<HTMLInputElement & HTMLTextAreaElement>(null);\n  let result = useColorField(otherProps, state, inputRef);\n\n  return (\n    <TextFieldBase\n      {...otherProps}\n      ref={forwardedRef}\n      inputRef={inputRef}\n      {...result}\n      inputClassName={classNames(styles, 'react-spectrum-ColorField-input')}\n    />\n  );\n}\n"],"names":[],"version":3,"file":"ColorField.cjs.map"}

package/dist/private/color/ColorField.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;AAoCM,MAAM,0DAAa,CAAA,GAAA,YAAI,EAAE,UAAU,CAAC,SAAS,WAAW,KAA8B,EAAE,GAAsB;IACnH,QAAQ,CAAA,GAAA,yCAAe,EAAE;IACzB,QAAQ,CAAA,GAAA,yCAAW,EAAE;IACrB,CAAC,MAAM,GAAG,CAAA,GAAA,sBAAc,EAAE,OAAO,MAAM,CAAA,GAAA,wBAAgB;IAEvD,IAAI,YAAY,CAAA,GAAA,aAAK,EAAE;IACvB,CAAA,GAAA,gBAAQ,EAAE;QACR,IAAI,MAAM,WAAW,IAAI,CAAC,UAAU,OAAO,IAAI,QAAQ,GAAG,CAAC,QAAQ,KAAK,cAAc;YACpF,QAAQ,IAAI,CAAC;YACb,UAAU,OAAO,GAAG;QACtB;IACF,GAAG;QAAC,MAAM,WAAW;KAAC;IAEtB,IAAI,MAAM,OAAO,EACf,qBAAO,gCAAC;QAAmB,GAAG,KAAK;QAAE,SAAS,MAAM,OAAO;QAAE,cAAc;;SAE3E,qBAAO,gCAAC;QAAe,GAAG,KAAK;QAAE,cAAc;;AAEnD;AAOA,SAAS,wCAAkB,KAA6B;IACtD,IAAI,SACF,qDAAqD;IACrD,KAAK,gBACL,YAAY,YACZ,QAAQ,YACR,QAAQ,gBACR,YAAY,EACZ,GAAG,YACJ,GAAG;IACJ,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,gBAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,gCAAwB,EAAE;QACpC,GAAG,KAAK;gBACR;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,aAAK,EAA0C;IAC9D,IAAI,SAAS,CAAA,GAAA,2BAAmB,EAAE,YAAY,OAAO;IAErD,qBACE,gFACE,gCAAC,CAAA,GAAA,yCAAY;QACV,GAAG,UAAU;QACd,KAAK;QACL,UAAU;QACT,GAAG,MAAM;QACV,gBAAgB,CAAA,GAAA,yCAAS,EAAE,CAAA,GAAA,kDAAK,GAAG;QACpC,MAAM,IAAI,kBAAI,gCAAC;QAAM,MAAK;QAAS,MAAM,MAAM,IAAI;QAAE,MAAM,MAAM,IAAI;QAAE,OAAO,MAAM,MAAM,WAAW,IAAI,KAAK,MAAM,WAAW;;AAGtI;AAMA,SAAS,oCAAc,KAAyB;IAC9C,IAAI,SACF,qDAAqD;IACrD,KAAK,gBACL,YAAY,YACZ,QAAQ,gBACR,YAAY,EACZ,GAAG,YACJ,GAAG;IACJ,IAAI,QAAQ,CAAA,GAAA,yBAAiB,EAAE;IAC/B,IAAI,WAAW,CAAA,GAAA,aAAK,EAA0C;IAC9D,IAAI,SAAS,CAAA,GAAA,oBAAY,EAAE,YAAY,OAAO;IAE9C,qBACE,gCAAC,CAAA,GAAA,yCAAY;QACV,GAAG,UAAU;QACd,KAAK;QACL,UAAU;QACT,GAAG,MAAM;QACV,gBAAgB,CAAA,GAAA,yCAAS,EAAE,CAAA,GAAA,kDAAK,GAAG;;AAEzC","sources":["packages/@adobe/react-spectrum/src/color/ColorField.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorFieldProps, useColorChannelField, useColorField} from 'react-aria/useColorField';\n\nimport {classNames} from '../utils/classNames';\nimport {Color, ColorChannel, ColorSpace} from 'react-stately/Color';\nimport {ColorFieldContext} from 'react-aria-components/ColorField';\nimport React, {Ref, useEffect, useRef} from 'react';\nimport {SpectrumFieldValidation, SpectrumLabelableProps, SpectrumTextInputBase, StyleProps} from '@react-types/shared';\nimport styles from './colorfield.css';\nimport {TextFieldBase} from '../textfield/TextFieldBase';\nimport {TextFieldRef} from '../textfield/TextField';\nimport {useColorChannelFieldState, useColorFieldState} from 'react-stately/useColorFieldState';\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useFormProps} from '../form/Form';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useProviderProps} from '../provider/Provider';\n\nexport interface SpectrumColorFieldProps extends SpectrumTextInputBase, Omit<AriaColorFieldProps, 'isInvalid' | 'validationState'>, SpectrumFieldValidation<Color | null>, SpectrumLabelableProps, StyleProps {\n  /**\n   * The color channel that this field edits. If not provided,\n   * the color is edited as a hex value.\n   */\n  channel?: ColorChannel,\n  /**\n   * The color space that the color field operates in if a `channel` prop is provided.\n   * If no `channel` is provided, the color field always displays the color as an RGB hex value.\n   */\n  colorSpace?: ColorSpace,\n  /** Whether the ColorField should be displayed with a quiet style. */\n  isQuiet?: boolean\n}\n\n/**\n * A color field allows users to edit a hex color or individual color channel value.\n */\nexport const ColorField = React.forwardRef(function ColorField(props: SpectrumColorFieldProps, ref: Ref<TextFieldRef>) {\n  props = useProviderProps(props);\n  props = useFormProps(props);\n  [props] = useContextProps(props, null, ColorFieldContext);\n  \n  let hasWarned = useRef(false);\n  useEffect(() => {\n    if (props.placeholder && !hasWarned.current && process.env.NODE_ENV !== 'production') {\n      console.warn('Placeholders are deprecated due to accessibility issues. Please use help text instead. See the docs for details: https://react-spectrum.adobe.com/react-spectrum/ColorField.html#help-text');\n      hasWarned.current = true;\n    }\n  }, [props.placeholder]);\n\n  if (props.channel) {\n    return <ColorChannelField {...props} channel={props.channel} forwardedRef={ref} />;\n  } else {\n    return <HexColorField {...props} forwardedRef={ref} />;\n  }\n});\n\ninterface ColorChannelFieldProps extends Omit<SpectrumColorFieldProps, 'channel'> {\n  channel: ColorChannel,\n  forwardedRef: Ref<TextFieldRef>\n}\n\nfunction ColorChannelField(props: ColorChannelFieldProps) {\n  let {\n    // These disabled props are handled by the state hook\n    value,          // eslint-disable-line @typescript-eslint/no-unused-vars\n    defaultValue,   // eslint-disable-line @typescript-eslint/no-unused-vars\n    onChange,       // eslint-disable-line @typescript-eslint/no-unused-vars\n    validate,       // eslint-disable-line @typescript-eslint/no-unused-vars\n    forwardedRef,\n    ...otherProps\n  } = props;\n  let {locale} = useLocale();\n  let state = useColorChannelFieldState({\n    ...props,\n    locale\n  });\n\n  let inputRef = useRef<HTMLInputElement & HTMLTextAreaElement>(null);\n  let result = useColorChannelField(otherProps, state, inputRef);\n\n  return (\n    <>\n      <TextFieldBase\n        {...otherProps}\n        ref={forwardedRef}\n        inputRef={inputRef}\n        {...result}\n        inputClassName={classNames(styles, 'react-spectrum-ColorField-input')} />\n      {props.name && <input type=\"hidden\" name={props.name} form={props.form} value={isNaN(state.numberValue) ? '' : state.numberValue} />}\n    </>\n  );\n}\n\ninterface HexColorFieldProps extends SpectrumColorFieldProps {\n  forwardedRef: Ref<TextFieldRef>\n}\n\nfunction HexColorField(props: HexColorFieldProps) {\n  let {\n    // These disabled props are handled by the state hook\n    value,          // eslint-disable-line @typescript-eslint/no-unused-vars\n    defaultValue,   // eslint-disable-line @typescript-eslint/no-unused-vars\n    onChange,       // eslint-disable-line @typescript-eslint/no-unused-vars\n    forwardedRef,\n    ...otherProps\n  } = props;\n  let state = useColorFieldState(props);\n  let inputRef = useRef<HTMLInputElement & HTMLTextAreaElement>(null);\n  let result = useColorField(otherProps, state, inputRef);\n\n  return (\n    <TextFieldBase\n      {...otherProps}\n      ref={forwardedRef}\n      inputRef={inputRef}\n      {...result}\n      inputClassName={classNames(styles, 'react-spectrum-ColorField-input')} />\n  );\n}\n"],"names":[],"version":3,"file":"ColorField.js.map"}
+{"mappings":";;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;AA+CM,MAAM,0DAAa,CAAA,GAAA,YAAI,EAAE,UAAU,CAAC,SAAS,WAClD,KAA8B,EAC9B,GAAsB;IAEtB,QAAQ,CAAA,GAAA,yCAAe,EAAE;IACzB,QAAQ,CAAA,GAAA,yCAAW,EAAE;IACrB,CAAC,MAAM,GAAG,CAAA,GAAA,sBAAc,EAAE,OAAO,MAAM,CAAA,GAAA,wBAAgB;IAEvD,IAAI,YAAY,CAAA,GAAA,aAAK,EAAE;IACvB,CAAA,GAAA,gBAAQ,EAAE;QACR,IAAI,MAAM,WAAW,IAAI,CAAC,UAAU,OAAO,IAAI,QAAQ,GAAG,CAAC,QAAQ,KAAK,cAAc;YACpF,QAAQ,IAAI,CACV;YAEF,UAAU,OAAO,GAAG;QACtB;IACF,GAAG;QAAC,MAAM,WAAW;KAAC;IAEtB,IAAI,MAAM,OAAO,EACf,qBAAO,gCAAC;QAAmB,GAAG,KAAK;QAAE,SAAS,MAAM,OAAO;QAAE,cAAc;;SAE3E,qBAAO,gCAAC;QAAe,GAAG,KAAK;QAAE,cAAc;;AAEnD;AAOA,SAAS,wCAAkB,KAA6B;IACtD,IAAI,SACF,qDAAqD;IACrD,KAAK,gBACL,YAAY,YACZ,QAAQ,YACR,QAAQ,gBACR,YAAY,EACZ,GAAG,YACJ,GAAG;IACJ,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,gBAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,gCAAwB,EAAE;QACpC,GAAG,KAAK;gBACR;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,aAAK,EAA0C;IAC9D,IAAI,SAAS,CAAA,GAAA,2BAAmB,EAAE,YAAY,OAAO;IAErD,qBACE,gFACE,gCAAC,CAAA,GAAA,yCAAY;QACV,GAAG,UAAU;QACd,KAAK;QACL,UAAU;QACT,GAAG,MAAM;QACV,gBAAgB,CAAA,GAAA,yCAAS,EAAE,CAAA,GAAA,kDAAK,GAAG;QAEpC,MAAM,IAAI,kBACT,gCAAC;QACC,MAAK;QACL,MAAM,MAAM,IAAI;QAChB,MAAM,MAAM,IAAI;QAChB,OAAO,MAAM,MAAM,WAAW,IAAI,KAAK,MAAM,WAAW;;AAKlE;AAMA,SAAS,oCAAc,KAAyB;IAC9C,IAAI,SACF,qDAAqD;IACrD,KAAK,gBACL,YAAY,YACZ,QAAQ,gBACR,YAAY,EACZ,GAAG,YACJ,GAAG;IACJ,IAAI,QAAQ,CAAA,GAAA,yBAAiB,EAAE;IAC/B,IAAI,WAAW,CAAA,GAAA,aAAK,EAA0C;IAC9D,IAAI,SAAS,CAAA,GAAA,oBAAY,EAAE,YAAY,OAAO;IAE9C,qBACE,gCAAC,CAAA,GAAA,yCAAY;QACV,GAAG,UAAU;QACd,KAAK;QACL,UAAU;QACT,GAAG,MAAM;QACV,gBAAgB,CAAA,GAAA,yCAAS,EAAE,CAAA,GAAA,kDAAK,GAAG;;AAGzC","sources":["packages/@adobe/react-spectrum/src/color/ColorField.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorFieldProps, useColorChannelField, useColorField} from 'react-aria/useColorField';\n\nimport {classNames} from '../utils/classNames';\nimport {Color, ColorChannel, ColorSpace} from 'react-stately/Color';\nimport {ColorFieldContext} from 'react-aria-components/ColorField';\nimport React, {Ref, useEffect, useRef} from 'react';\nimport {\n  SpectrumFieldValidation,\n  SpectrumLabelableProps,\n  SpectrumTextInputBase,\n  StyleProps\n} from '@react-types/shared';\nimport styles from './colorfield.css';\nimport {TextFieldBase} from '../textfield/TextFieldBase';\nimport {TextFieldRef} from '../textfield/TextField';\nimport {useColorChannelFieldState, useColorFieldState} from 'react-stately/useColorFieldState';\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useFormProps} from '../form/Form';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useProviderProps} from '../provider/Provider';\n\nexport interface SpectrumColorFieldProps\n  extends\n    SpectrumTextInputBase,\n    Omit<AriaColorFieldProps, 'isInvalid' | 'validationState'>,\n    SpectrumFieldValidation<Color | null>,\n    SpectrumLabelableProps,\n    StyleProps {\n  /**\n   * The color channel that this field edits. If not provided,\n   * the color is edited as a hex value.\n   */\n  channel?: ColorChannel;\n  /**\n   * The color space that the color field operates in if a `channel` prop is provided.\n   * If no `channel` is provided, the color field always displays the color as an RGB hex value.\n   */\n  colorSpace?: ColorSpace;\n  /** Whether the ColorField should be displayed with a quiet style. */\n  isQuiet?: boolean;\n}\n\n/**\n * A color field allows users to edit a hex color or individual color channel value.\n */\nexport const ColorField = React.forwardRef(function ColorField(\n  props: SpectrumColorFieldProps,\n  ref: Ref<TextFieldRef>\n) {\n  props = useProviderProps(props);\n  props = useFormProps(props);\n  [props] = useContextProps(props, null, ColorFieldContext);\n\n  let hasWarned = useRef(false);\n  useEffect(() => {\n    if (props.placeholder && !hasWarned.current && process.env.NODE_ENV !== 'production') {\n      console.warn(\n        'Placeholders are deprecated due to accessibility issues. Please use help text instead. See the docs for details: https://react-spectrum.adobe.com/react-spectrum/ColorField.html#help-text'\n      );\n      hasWarned.current = true;\n    }\n  }, [props.placeholder]);\n\n  if (props.channel) {\n    return <ColorChannelField {...props} channel={props.channel} forwardedRef={ref} />;\n  } else {\n    return <HexColorField {...props} forwardedRef={ref} />;\n  }\n});\n\ninterface ColorChannelFieldProps extends Omit<SpectrumColorFieldProps, 'channel'> {\n  channel: ColorChannel;\n  forwardedRef: Ref<TextFieldRef>;\n}\n\nfunction ColorChannelField(props: ColorChannelFieldProps) {\n  let {\n    // These disabled props are handled by the state hook\n    value, // eslint-disable-line @typescript-eslint/no-unused-vars\n    defaultValue, // eslint-disable-line @typescript-eslint/no-unused-vars\n    onChange, // eslint-disable-line @typescript-eslint/no-unused-vars\n    validate, // eslint-disable-line @typescript-eslint/no-unused-vars\n    forwardedRef,\n    ...otherProps\n  } = props;\n  let {locale} = useLocale();\n  let state = useColorChannelFieldState({\n    ...props,\n    locale\n  });\n\n  let inputRef = useRef<HTMLInputElement & HTMLTextAreaElement>(null);\n  let result = useColorChannelField(otherProps, state, inputRef);\n\n  return (\n    <>\n      <TextFieldBase\n        {...otherProps}\n        ref={forwardedRef}\n        inputRef={inputRef}\n        {...result}\n        inputClassName={classNames(styles, 'react-spectrum-ColorField-input')}\n      />\n      {props.name && (\n        <input\n          type=\"hidden\"\n          name={props.name}\n          form={props.form}\n          value={isNaN(state.numberValue) ? '' : state.numberValue}\n        />\n      )}\n    </>\n  );\n}\n\ninterface HexColorFieldProps extends SpectrumColorFieldProps {\n  forwardedRef: Ref<TextFieldRef>;\n}\n\nfunction HexColorField(props: HexColorFieldProps) {\n  let {\n    // These disabled props are handled by the state hook\n    value, // eslint-disable-line @typescript-eslint/no-unused-vars\n    defaultValue, // eslint-disable-line @typescript-eslint/no-unused-vars\n    onChange, // eslint-disable-line @typescript-eslint/no-unused-vars\n    forwardedRef,\n    ...otherProps\n  } = props;\n  let state = useColorFieldState(props);\n  let inputRef = useRef<HTMLInputElement & HTMLTextAreaElement>(null);\n  let result = useColorField(otherProps, state, inputRef);\n\n  return (\n    <TextFieldBase\n      {...otherProps}\n      ref={forwardedRef}\n      inputRef={inputRef}\n      {...result}\n      inputClassName={classNames(styles, 'react-spectrum-ColorField-input')}\n    />\n  );\n}\n"],"names":[],"version":3,"file":"ColorField.js.map"}

package/dist/private/color/ColorField.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;AAoCM,MAAM,0DAAa,CAAA,GAAA,YAAI,EAAE,UAAU,CAAC,SAAS,WAAW,KAA8B,EAAE,GAAsB;IACnH,QAAQ,CAAA,GAAA,yCAAe,EAAE;IACzB,QAAQ,CAAA,GAAA,yCAAW,EAAE;IACrB,CAAC,MAAM,GAAG,CAAA,GAAA,sBAAc,EAAE,OAAO,MAAM,CAAA,GAAA,wBAAgB;IAEvD,IAAI,YAAY,CAAA,GAAA,aAAK,EAAE;IACvB,CAAA,GAAA,gBAAQ,EAAE;QACR,IAAI,MAAM,WAAW,IAAI,CAAC,UAAU,OAAO,IAAI,QAAQ,GAAG,CAAC,QAAQ,KAAK,cAAc;YACpF,QAAQ,IAAI,CAAC;YACb,UAAU,OAAO,GAAG;QACtB;IACF,GAAG;QAAC,MAAM,WAAW;KAAC;IAEtB,IAAI,MAAM,OAAO,EACf,qBAAO,gCAAC;QAAmB,GAAG,KAAK;QAAE,SAAS,MAAM,OAAO;QAAE,cAAc;;SAE3E,qBAAO,gCAAC;QAAe,GAAG,KAAK;QAAE,cAAc;;AAEnD;AAOA,SAAS,wCAAkB,KAA6B;IACtD,IAAI,SACF,qDAAqD;IACrD,KAAK,gBACL,YAAY,YACZ,QAAQ,YACR,QAAQ,gBACR,YAAY,EACZ,GAAG,YACJ,GAAG;IACJ,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,gBAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,gCAAwB,EAAE;QACpC,GAAG,KAAK;gBACR;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,aAAK,EAA0C;IAC9D,IAAI,SAAS,CAAA,GAAA,2BAAmB,EAAE,YAAY,OAAO;IAErD,qBACE,gFACE,gCAAC,CAAA,GAAA,yCAAY;QACV,GAAG,UAAU;QACd,KAAK;QACL,UAAU;QACT,GAAG,MAAM;QACV,gBAAgB,CAAA,GAAA,yCAAS,EAAE,CAAA,GAAA,kDAAK,GAAG;QACpC,MAAM,IAAI,kBAAI,gCAAC;QAAM,MAAK;QAAS,MAAM,MAAM,IAAI;QAAE,MAAM,MAAM,IAAI;QAAE,OAAO,MAAM,MAAM,WAAW,IAAI,KAAK,MAAM,WAAW;;AAGtI;AAMA,SAAS,oCAAc,KAAyB;IAC9C,IAAI,SACF,qDAAqD;IACrD,KAAK,gBACL,YAAY,YACZ,QAAQ,gBACR,YAAY,EACZ,GAAG,YACJ,GAAG;IACJ,IAAI,QAAQ,CAAA,GAAA,yBAAiB,EAAE;IAC/B,IAAI,WAAW,CAAA,GAAA,aAAK,EAA0C;IAC9D,IAAI,SAAS,CAAA,GAAA,oBAAY,EAAE,YAAY,OAAO;IAE9C,qBACE,gCAAC,CAAA,GAAA,yCAAY;QACV,GAAG,UAAU;QACd,KAAK;QACL,UAAU;QACT,GAAG,MAAM;QACV,gBAAgB,CAAA,GAAA,yCAAS,EAAE,CAAA,GAAA,kDAAK,GAAG;;AAEzC","sources":["packages/@adobe/react-spectrum/src/color/ColorField.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorFieldProps, useColorChannelField, useColorField} from 'react-aria/useColorField';\n\nimport {classNames} from '../utils/classNames';\nimport {Color, ColorChannel, ColorSpace} from 'react-stately/Color';\nimport {ColorFieldContext} from 'react-aria-components/ColorField';\nimport React, {Ref, useEffect, useRef} from 'react';\nimport {SpectrumFieldValidation, SpectrumLabelableProps, SpectrumTextInputBase, StyleProps} from '@react-types/shared';\nimport styles from './colorfield.css';\nimport {TextFieldBase} from '../textfield/TextFieldBase';\nimport {TextFieldRef} from '../textfield/TextField';\nimport {useColorChannelFieldState, useColorFieldState} from 'react-stately/useColorFieldState';\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useFormProps} from '../form/Form';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useProviderProps} from '../provider/Provider';\n\nexport interface SpectrumColorFieldProps extends SpectrumTextInputBase, Omit<AriaColorFieldProps, 'isInvalid' | 'validationState'>, SpectrumFieldValidation<Color | null>, SpectrumLabelableProps, StyleProps {\n  /**\n   * The color channel that this field edits. If not provided,\n   * the color is edited as a hex value.\n   */\n  channel?: ColorChannel,\n  /**\n   * The color space that the color field operates in if a `channel` prop is provided.\n   * If no `channel` is provided, the color field always displays the color as an RGB hex value.\n   */\n  colorSpace?: ColorSpace,\n  /** Whether the ColorField should be displayed with a quiet style. */\n  isQuiet?: boolean\n}\n\n/**\n * A color field allows users to edit a hex color or individual color channel value.\n */\nexport const ColorField = React.forwardRef(function ColorField(props: SpectrumColorFieldProps, ref: Ref<TextFieldRef>) {\n  props = useProviderProps(props);\n  props = useFormProps(props);\n  [props] = useContextProps(props, null, ColorFieldContext);\n  \n  let hasWarned = useRef(false);\n  useEffect(() => {\n    if (props.placeholder && !hasWarned.current && process.env.NODE_ENV !== 'production') {\n      console.warn('Placeholders are deprecated due to accessibility issues. Please use help text instead. See the docs for details: https://react-spectrum.adobe.com/react-spectrum/ColorField.html#help-text');\n      hasWarned.current = true;\n    }\n  }, [props.placeholder]);\n\n  if (props.channel) {\n    return <ColorChannelField {...props} channel={props.channel} forwardedRef={ref} />;\n  } else {\n    return <HexColorField {...props} forwardedRef={ref} />;\n  }\n});\n\ninterface ColorChannelFieldProps extends Omit<SpectrumColorFieldProps, 'channel'> {\n  channel: ColorChannel,\n  forwardedRef: Ref<TextFieldRef>\n}\n\nfunction ColorChannelField(props: ColorChannelFieldProps) {\n  let {\n    // These disabled props are handled by the state hook\n    value,          // eslint-disable-line @typescript-eslint/no-unused-vars\n    defaultValue,   // eslint-disable-line @typescript-eslint/no-unused-vars\n    onChange,       // eslint-disable-line @typescript-eslint/no-unused-vars\n    validate,       // eslint-disable-line @typescript-eslint/no-unused-vars\n    forwardedRef,\n    ...otherProps\n  } = props;\n  let {locale} = useLocale();\n  let state = useColorChannelFieldState({\n    ...props,\n    locale\n  });\n\n  let inputRef = useRef<HTMLInputElement & HTMLTextAreaElement>(null);\n  let result = useColorChannelField(otherProps, state, inputRef);\n\n  return (\n    <>\n      <TextFieldBase\n        {...otherProps}\n        ref={forwardedRef}\n        inputRef={inputRef}\n        {...result}\n        inputClassName={classNames(styles, 'react-spectrum-ColorField-input')} />\n      {props.name && <input type=\"hidden\" name={props.name} form={props.form} value={isNaN(state.numberValue) ? '' : state.numberValue} />}\n    </>\n  );\n}\n\ninterface HexColorFieldProps extends SpectrumColorFieldProps {\n  forwardedRef: Ref<TextFieldRef>\n}\n\nfunction HexColorField(props: HexColorFieldProps) {\n  let {\n    // These disabled props are handled by the state hook\n    value,          // eslint-disable-line @typescript-eslint/no-unused-vars\n    defaultValue,   // eslint-disable-line @typescript-eslint/no-unused-vars\n    onChange,       // eslint-disable-line @typescript-eslint/no-unused-vars\n    forwardedRef,\n    ...otherProps\n  } = props;\n  let state = useColorFieldState(props);\n  let inputRef = useRef<HTMLInputElement & HTMLTextAreaElement>(null);\n  let result = useColorField(otherProps, state, inputRef);\n\n  return (\n    <TextFieldBase\n      {...otherProps}\n      ref={forwardedRef}\n      inputRef={inputRef}\n      {...result}\n      inputClassName={classNames(styles, 'react-spectrum-ColorField-input')} />\n  );\n}\n"],"names":[],"version":3,"file":"ColorField.mjs.map"}
+{"mappings":";;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;AA+CM,MAAM,0DAAa,CAAA,GAAA,YAAI,EAAE,UAAU,CAAC,SAAS,WAClD,KAA8B,EAC9B,GAAsB;IAEtB,QAAQ,CAAA,GAAA,yCAAe,EAAE;IACzB,QAAQ,CAAA,GAAA,yCAAW,EAAE;IACrB,CAAC,MAAM,GAAG,CAAA,GAAA,sBAAc,EAAE,OAAO,MAAM,CAAA,GAAA,wBAAgB;IAEvD,IAAI,YAAY,CAAA,GAAA,aAAK,EAAE;IACvB,CAAA,GAAA,gBAAQ,EAAE;QACR,IAAI,MAAM,WAAW,IAAI,CAAC,UAAU,OAAO,IAAI,QAAQ,GAAG,CAAC,QAAQ,KAAK,cAAc;YACpF,QAAQ,IAAI,CACV;YAEF,UAAU,OAAO,GAAG;QACtB;IACF,GAAG;QAAC,MAAM,WAAW;KAAC;IAEtB,IAAI,MAAM,OAAO,EACf,qBAAO,gCAAC;QAAmB,GAAG,KAAK;QAAE,SAAS,MAAM,OAAO;QAAE,cAAc;;SAE3E,qBAAO,gCAAC;QAAe,GAAG,KAAK;QAAE,cAAc;;AAEnD;AAOA,SAAS,wCAAkB,KAA6B;IACtD,IAAI,SACF,qDAAqD;IACrD,KAAK,gBACL,YAAY,YACZ,QAAQ,YACR,QAAQ,gBACR,YAAY,EACZ,GAAG,YACJ,GAAG;IACJ,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,gBAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,gCAAwB,EAAE;QACpC,GAAG,KAAK;gBACR;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,aAAK,EAA0C;IAC9D,IAAI,SAAS,CAAA,GAAA,2BAAmB,EAAE,YAAY,OAAO;IAErD,qBACE,gFACE,gCAAC,CAAA,GAAA,yCAAY;QACV,GAAG,UAAU;QACd,KAAK;QACL,UAAU;QACT,GAAG,MAAM;QACV,gBAAgB,CAAA,GAAA,yCAAS,EAAE,CAAA,GAAA,kDAAK,GAAG;QAEpC,MAAM,IAAI,kBACT,gCAAC;QACC,MAAK;QACL,MAAM,MAAM,IAAI;QAChB,MAAM,MAAM,IAAI;QAChB,OAAO,MAAM,MAAM,WAAW,IAAI,KAAK,MAAM,WAAW;;AAKlE;AAMA,SAAS,oCAAc,KAAyB;IAC9C,IAAI,SACF,qDAAqD;IACrD,KAAK,gBACL,YAAY,YACZ,QAAQ,gBACR,YAAY,EACZ,GAAG,YACJ,GAAG;IACJ,IAAI,QAAQ,CAAA,GAAA,yBAAiB,EAAE;IAC/B,IAAI,WAAW,CAAA,GAAA,aAAK,EAA0C;IAC9D,IAAI,SAAS,CAAA,GAAA,oBAAY,EAAE,YAAY,OAAO;IAE9C,qBACE,gCAAC,CAAA,GAAA,yCAAY;QACV,GAAG,UAAU;QACd,KAAK;QACL,UAAU;QACT,GAAG,MAAM;QACV,gBAAgB,CAAA,GAAA,yCAAS,EAAE,CAAA,GAAA,kDAAK,GAAG;;AAGzC","sources":["packages/@adobe/react-spectrum/src/color/ColorField.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorFieldProps, useColorChannelField, useColorField} from 'react-aria/useColorField';\n\nimport {classNames} from '../utils/classNames';\nimport {Color, ColorChannel, ColorSpace} from 'react-stately/Color';\nimport {ColorFieldContext} from 'react-aria-components/ColorField';\nimport React, {Ref, useEffect, useRef} from 'react';\nimport {\n  SpectrumFieldValidation,\n  SpectrumLabelableProps,\n  SpectrumTextInputBase,\n  StyleProps\n} from '@react-types/shared';\nimport styles from './colorfield.css';\nimport {TextFieldBase} from '../textfield/TextFieldBase';\nimport {TextFieldRef} from '../textfield/TextField';\nimport {useColorChannelFieldState, useColorFieldState} from 'react-stately/useColorFieldState';\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useFormProps} from '../form/Form';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useProviderProps} from '../provider/Provider';\n\nexport interface SpectrumColorFieldProps\n  extends\n    SpectrumTextInputBase,\n    Omit<AriaColorFieldProps, 'isInvalid' | 'validationState'>,\n    SpectrumFieldValidation<Color | null>,\n    SpectrumLabelableProps,\n    StyleProps {\n  /**\n   * The color channel that this field edits. If not provided,\n   * the color is edited as a hex value.\n   */\n  channel?: ColorChannel;\n  /**\n   * The color space that the color field operates in if a `channel` prop is provided.\n   * If no `channel` is provided, the color field always displays the color as an RGB hex value.\n   */\n  colorSpace?: ColorSpace;\n  /** Whether the ColorField should be displayed with a quiet style. */\n  isQuiet?: boolean;\n}\n\n/**\n * A color field allows users to edit a hex color or individual color channel value.\n */\nexport const ColorField = React.forwardRef(function ColorField(\n  props: SpectrumColorFieldProps,\n  ref: Ref<TextFieldRef>\n) {\n  props = useProviderProps(props);\n  props = useFormProps(props);\n  [props] = useContextProps(props, null, ColorFieldContext);\n\n  let hasWarned = useRef(false);\n  useEffect(() => {\n    if (props.placeholder && !hasWarned.current && process.env.NODE_ENV !== 'production') {\n      console.warn(\n        'Placeholders are deprecated due to accessibility issues. Please use help text instead. See the docs for details: https://react-spectrum.adobe.com/react-spectrum/ColorField.html#help-text'\n      );\n      hasWarned.current = true;\n    }\n  }, [props.placeholder]);\n\n  if (props.channel) {\n    return <ColorChannelField {...props} channel={props.channel} forwardedRef={ref} />;\n  } else {\n    return <HexColorField {...props} forwardedRef={ref} />;\n  }\n});\n\ninterface ColorChannelFieldProps extends Omit<SpectrumColorFieldProps, 'channel'> {\n  channel: ColorChannel;\n  forwardedRef: Ref<TextFieldRef>;\n}\n\nfunction ColorChannelField(props: ColorChannelFieldProps) {\n  let {\n    // These disabled props are handled by the state hook\n    value, // eslint-disable-line @typescript-eslint/no-unused-vars\n    defaultValue, // eslint-disable-line @typescript-eslint/no-unused-vars\n    onChange, // eslint-disable-line @typescript-eslint/no-unused-vars\n    validate, // eslint-disable-line @typescript-eslint/no-unused-vars\n    forwardedRef,\n    ...otherProps\n  } = props;\n  let {locale} = useLocale();\n  let state = useColorChannelFieldState({\n    ...props,\n    locale\n  });\n\n  let inputRef = useRef<HTMLInputElement & HTMLTextAreaElement>(null);\n  let result = useColorChannelField(otherProps, state, inputRef);\n\n  return (\n    <>\n      <TextFieldBase\n        {...otherProps}\n        ref={forwardedRef}\n        inputRef={inputRef}\n        {...result}\n        inputClassName={classNames(styles, 'react-spectrum-ColorField-input')}\n      />\n      {props.name && (\n        <input\n          type=\"hidden\"\n          name={props.name}\n          form={props.form}\n          value={isNaN(state.numberValue) ? '' : state.numberValue}\n        />\n      )}\n    </>\n  );\n}\n\ninterface HexColorFieldProps extends SpectrumColorFieldProps {\n  forwardedRef: Ref<TextFieldRef>;\n}\n\nfunction HexColorField(props: HexColorFieldProps) {\n  let {\n    // These disabled props are handled by the state hook\n    value, // eslint-disable-line @typescript-eslint/no-unused-vars\n    defaultValue, // eslint-disable-line @typescript-eslint/no-unused-vars\n    onChange, // eslint-disable-line @typescript-eslint/no-unused-vars\n    forwardedRef,\n    ...otherProps\n  } = props;\n  let state = useColorFieldState(props);\n  let inputRef = useRef<HTMLInputElement & HTMLTextAreaElement>(null);\n  let result = useColorField(otherProps, state, inputRef);\n\n  return (\n    <TextFieldBase\n      {...otherProps}\n      ref={forwardedRef}\n      inputRef={inputRef}\n      {...result}\n      inputClassName={classNames(styles, 'react-spectrum-ColorField-input')}\n    />\n  );\n}\n"],"names":[],"version":3,"file":"ColorField.mjs.map"}

package/dist/private/color/ColorPicker.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;AAoCM,MAAM,0DAAc,CAAA,GAAA,sCAAI,EAAE,UAAU,CAAC,SAAS,YAAY,KAA+B,EAAE,GAAoC;IACpI,IAAI,YAAY,CAAA,GAAA,mBAAK,EAAE;IACvB,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE;IAC7B,IAAI,UAAU,CAAA,GAAA,2BAAI;IAClB,qBACE,0DAAC,CAAA,GAAA,iDAAc,GAAM,qBACnB,0DAAC,CAAA,GAAA,uCAAY;QAAE,MAAK;QAAU,YAAW;QAAO,WAAW,CAAA,GAAA,sCAAW,EAAE;qBACtE,0DAAC,CAAA,GAAA,uCAAK;QACJ,KAAK;QACL,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;UAkBR;YAAC,MAAM,MAAM,IAAI,IAAI;QAAG;OAC1B,CAAC,kBAAC,cAAc,EAAC,iBAChB,oIACE,0DAAC;YACC,WAAW;;;;;;;;;;;;;cASR;gCAAC;YAAc;yBAClB,0DAAC,CAAA,GAAA,qCAAU;YACT,KAAK;YACL,OAAO,MAAM,KAAK;YAClB,MAAM,MAAM,IAAI;YAChB,UAAU,MAAM,QAAQ;YACxB,cAAY,KAAK,CAAC,aAAa;YAC/B,mBAAiB,KAAK,CAAC,kBAAkB;YACzC,oBAAkB,KAAK,CAAC,mBAAmB;YAC3C,gBAAc,KAAK,CAAC,eAAe;aAEtC,MAAM,KAAK,kBACV,0DAAC;YAAK,IAAI;WAAU,MAAM,KAAK,mBAKvC,0DAAC,CAAA,GAAA,gCAAK;QACJ,mBAAiB,MAAM,KAAK,GAAG,UAAU,KAAK,CAAC,kBAAkB;QACjE,cAAY,KAAK,CAAC,aAAa;QAC/B,cAAc;YACZ,OAAO;YACP,UAAU;YACV,QAAQ,SAAS,sBAAsB;QACzC;qBACA,0DAAC,CAAA,GAAA,iCAAM;QACL,cAAc;YACZ,UAAU;YACV,QAAQ;YACR,SAAS;QACX;OACC,MAAM,QAAQ;AAM3B","sources":["packages/@adobe/react-spectrum/src/color/ColorPicker.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 {ColorPicker as AriaColorPicker} from 'react-aria-components/ColorPicker';\n\nimport {AriaLabelingProps, FocusableRef, ValueBase} from '@react-types/shared';\nimport {Button} from 'react-aria-components/Button';\nimport {Color} from 'react-stately/Color';\nimport {ColorSwatch} from './ColorSwatch';\nimport {Content} from '../view/Content';\nimport {Dialog} from '../dialog/Dialog';\nimport {DialogTrigger} from '../dialog/DialogTrigger';\nimport React, {ReactNode, useRef} from 'react';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {unwrapDOMRef, useFocusableRef} from '../utils/useDOMRef';\nimport {useId} from 'react-aria/useId';\n\nexport interface SpectrumColorPickerProps extends ValueBase<string | Color, Color>, AriaLabelingProps {\n  /** A visual label for the color picker. */\n  label?: ReactNode,\n  /** The contents of the color picker popover, e.g. `<ColorEditor />`. */\n  children?: ReactNode,\n  /**\n   * The size of the color swatch.\n   * @default \"M\"\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the color swatch.\n   * @default \"default\"\n   */\n  rounding?: 'default' | 'none' | 'full'\n}\n\n/**\n * A ColorPicker combines a swatch with a customizable popover for editing a color.\n */\nexport const ColorPicker = React.forwardRef(function ColorPicker(props: SpectrumColorPickerProps, ref: FocusableRef<HTMLButtonElement>) {\n  let swatchRef = useRef(null);\n  let domRef = useFocusableRef(ref);\n  let labelId = useId();\n  return (\n    <AriaColorPicker {...props}>\n      <DialogTrigger type=\"popover\" mobileType=\"tray\" targetRef={unwrapDOMRef(swatchRef)}>\n        <Button \n          ref={domRef}\n          className={style({\n            backgroundColor: 'transparent',\n            borderStyle: 'none',\n            padding: 0,\n            display: 'flex',\n            alignItems: 'center',\n            gap: 'text-to-control',\n            outlineStyle: 'none',\n            fontFamily: 'sans',\n            color: 'body',\n            fontSize: {\n              size: {\n                XS: 'xs',\n                S: 'sm',\n                M: 'base',\n                L: 'lg'\n              }\n            }\n          })({size: props.size || 'M'})}>\n          {({isFocusVisible}) => (\n            <>\n              <div\n                className={style({\n                  outlineStyle: {\n                    default: 'none',\n                    isFocusVisible: 'solid'\n                  },\n                  outlineColor: 'focus-ring',\n                  outlineWidth: 2,\n                  outlineOffset: 2,\n                  borderRadius: 'default'\n                })({isFocusVisible})}>\n                <ColorSwatch\n                  ref={swatchRef}\n                  color={props.value}\n                  size={props.size}\n                  rounding={props.rounding}\n                  aria-label={props['aria-label']}\n                  aria-labelledby={props['aria-labelledby']}\n                  aria-describedby={props['aria-describedby']}\n                  aria-details={props['aria-details']} />\n              </div>\n              {props.label && \n                <span id={labelId}>{props.label}</span>\n              }\n            </>\n          )}\n        </Button>\n        <Dialog \n          aria-labelledby={props.label ? labelId : props['aria-labelledby']}\n          aria-label={props['aria-label']}\n          UNSAFE_style={{\n            width: 'fit-content',\n            minWidth: 0,\n            margin: '0 auto' // Center within tray.\n          }}>\n          <Content \n            UNSAFE_style={{\n              position: 'relative',\n              margin: 'calc(var(--spectrum-dialog-padding) * -1)',\n              padding: 'var(--spectrum-global-dimension-size-200)'\n            }}>\n            {props.children}\n          </Content>\n        </Dialog>\n      </DialogTrigger>\n    </AriaColorPicker>\n  );\n});\n"],"names":[],"version":3,"file":"ColorPicker.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;AAuCM,MAAM,0DAAc,CAAA,GAAA,sCAAI,EAAE,UAAU,CAAC,SAAS,YACnD,KAA+B,EAC/B,GAAoC;IAEpC,IAAI,YAAY,CAAA,GAAA,mBAAK,EAAE;IACvB,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE;IAC7B,IAAI,UAAU,CAAA,GAAA,2BAAI;IAClB,qBACE,0DAAC,CAAA,GAAA,iDAAc,GAAM,qBACnB,0DAAC,CAAA,GAAA,uCAAY;QAAE,MAAK;QAAU,YAAW;QAAO,WAAW,CAAA,GAAA,sCAAW,EAAE;qBACtE,0DAAC,CAAA,GAAA,uCAAK;QACJ,KAAK;QACL,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;UAkBR;YAAC,MAAM,MAAM,IAAI,IAAI;QAAG;OAC1B,CAAC,kBAAC,cAAc,EAAC,iBAChB,oIACE,0DAAC;YACC,WAAW;;;;;;;;;;;;;cASR;gCAAC;YAAc;yBAClB,0DAAC,CAAA,GAAA,qCAAU;YACT,KAAK;YACL,OAAO,MAAM,KAAK;YAClB,MAAM,MAAM,IAAI;YAChB,UAAU,MAAM,QAAQ;YACxB,cAAY,KAAK,CAAC,aAAa;YAC/B,mBAAiB,KAAK,CAAC,kBAAkB;YACzC,oBAAkB,KAAK,CAAC,mBAAmB;YAC3C,gBAAc,KAAK,CAAC,eAAe;aAGtC,MAAM,KAAK,kBAAI,0DAAC;YAAK,IAAI;WAAU,MAAM,KAAK,mBAIrD,0DAAC,CAAA,GAAA,gCAAK;QACJ,mBAAiB,MAAM,KAAK,GAAG,UAAU,KAAK,CAAC,kBAAkB;QACjE,cAAY,KAAK,CAAC,aAAa;QAC/B,cAAc;YACZ,OAAO;YACP,UAAU;YACV,QAAQ,SAAS,sBAAsB;QACzC;qBACA,0DAAC,CAAA,GAAA,iCAAM;QACL,cAAc;YACZ,UAAU;YACV,QAAQ;YACR,SAAS;QACX;OACC,MAAM,QAAQ;AAM3B","sources":["packages/@adobe/react-spectrum/src/color/ColorPicker.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 {ColorPicker as AriaColorPicker} from 'react-aria-components/ColorPicker';\n\nimport {AriaLabelingProps, FocusableRef, ValueBase} from '@react-types/shared';\nimport {Button} from 'react-aria-components/Button';\nimport {Color} from 'react-stately/Color';\nimport {ColorSwatch} from './ColorSwatch';\nimport {Content} from '../view/Content';\nimport {Dialog} from '../dialog/Dialog';\nimport {DialogTrigger} from '../dialog/DialogTrigger';\nimport React, {ReactNode, useRef} from 'react';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {unwrapDOMRef, useFocusableRef} from '../utils/useDOMRef';\nimport {useId} from 'react-aria/useId';\n\nexport interface SpectrumColorPickerProps\n  extends ValueBase<string | Color, Color>, AriaLabelingProps {\n  /** A visual label for the color picker. */\n  label?: ReactNode;\n  /** The contents of the color picker popover, e.g. `<ColorEditor />`. */\n  children?: ReactNode;\n  /**\n   * The size of the color swatch.\n   *\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L';\n  /**\n   * The corner rounding of the color swatch.\n   *\n   * @default 'default'\n   */\n  rounding?: 'default' | 'none' | 'full';\n}\n\n/**\n * A ColorPicker combines a swatch with a customizable popover for editing a color.\n */\nexport const ColorPicker = React.forwardRef(function ColorPicker(\n  props: SpectrumColorPickerProps,\n  ref: FocusableRef<HTMLButtonElement>\n) {\n  let swatchRef = useRef(null);\n  let domRef = useFocusableRef(ref);\n  let labelId = useId();\n  return (\n    <AriaColorPicker {...props}>\n      <DialogTrigger type=\"popover\" mobileType=\"tray\" targetRef={unwrapDOMRef(swatchRef)}>\n        <Button\n          ref={domRef}\n          className={style({\n            backgroundColor: 'transparent',\n            borderStyle: 'none',\n            padding: 0,\n            display: 'flex',\n            alignItems: 'center',\n            gap: 'text-to-control',\n            outlineStyle: 'none',\n            fontFamily: 'sans',\n            color: 'body',\n            fontSize: {\n              size: {\n                XS: 'xs',\n                S: 'sm',\n                M: 'base',\n                L: 'lg'\n              }\n            }\n          })({size: props.size || 'M'})}>\n          {({isFocusVisible}) => (\n            <>\n              <div\n                className={style({\n                  outlineStyle: {\n                    default: 'none',\n                    isFocusVisible: 'solid'\n                  },\n                  outlineColor: 'focus-ring',\n                  outlineWidth: 2,\n                  outlineOffset: 2,\n                  borderRadius: 'default'\n                })({isFocusVisible})}>\n                <ColorSwatch\n                  ref={swatchRef}\n                  color={props.value}\n                  size={props.size}\n                  rounding={props.rounding}\n                  aria-label={props['aria-label']}\n                  aria-labelledby={props['aria-labelledby']}\n                  aria-describedby={props['aria-describedby']}\n                  aria-details={props['aria-details']}\n                />\n              </div>\n              {props.label && <span id={labelId}>{props.label}</span>}\n            </>\n          )}\n        </Button>\n        <Dialog\n          aria-labelledby={props.label ? labelId : props['aria-labelledby']}\n          aria-label={props['aria-label']}\n          UNSAFE_style={{\n            width: 'fit-content',\n            minWidth: 0,\n            margin: '0 auto' // Center within tray.\n          }}>\n          <Content\n            UNSAFE_style={{\n              position: 'relative',\n              margin: 'calc(var(--spectrum-dialog-padding) * -1)',\n              padding: 'var(--spectrum-global-dimension-size-200)'\n            }}>\n            {props.children}\n          </Content>\n        </Dialog>\n      </DialogTrigger>\n    </AriaColorPicker>\n  );\n});\n"],"names":[],"version":3,"file":"ColorPicker.cjs.map"}

package/dist/private/color/ColorPicker.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;AAoCM,MAAM,0DAAc,CAAA,GAAA,YAAI,EAAE,UAAU,CAAC,SAAS,YAAY,KAA+B,EAAE,GAAoC;IACpI,IAAI,YAAY,CAAA,GAAA,aAAK,EAAE;IACvB,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE;IAC7B,IAAI,UAAU,CAAA,GAAA,YAAI;IAClB,qBACE,gCAAC,CAAA,GAAA,kBAAc,GAAM,qBACnB,gCAAC,CAAA,GAAA,yCAAY;QAAE,MAAK;QAAU,YAAW;QAAO,WAAW,CAAA,GAAA,yCAAW,EAAE;qBACtE,gCAAC,CAAA,GAAA,aAAK;QACJ,KAAK;QACL,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;UAkBR;YAAC,MAAM,MAAM,IAAI,IAAI;QAAG;OAC1B,CAAC,kBAAC,cAAc,EAAC,iBAChB,gFACE,gCAAC;YACC,WAAW;;;;;;;;;;;;;cASR;gCAAC;YAAc;yBAClB,gCAAC,CAAA,GAAA,yCAAU;YACT,KAAK;YACL,OAAO,MAAM,KAAK;YAClB,MAAM,MAAM,IAAI;YAChB,UAAU,MAAM,QAAQ;YACxB,cAAY,KAAK,CAAC,aAAa;YAC/B,mBAAiB,KAAK,CAAC,kBAAkB;YACzC,oBAAkB,KAAK,CAAC,mBAAmB;YAC3C,gBAAc,KAAK,CAAC,eAAe;aAEtC,MAAM,KAAK,kBACV,gCAAC;YAAK,IAAI;WAAU,MAAM,KAAK,mBAKvC,gCAAC,CAAA,GAAA,yCAAK;QACJ,mBAAiB,MAAM,KAAK,GAAG,UAAU,KAAK,CAAC,kBAAkB;QACjE,cAAY,KAAK,CAAC,aAAa;QAC/B,cAAc;YACZ,OAAO;YACP,UAAU;YACV,QAAQ,SAAS,sBAAsB;QACzC;qBACA,gCAAC,CAAA,GAAA,yCAAM;QACL,cAAc;YACZ,UAAU;YACV,QAAQ;YACR,SAAS;QACX;OACC,MAAM,QAAQ;AAM3B","sources":["packages/@adobe/react-spectrum/src/color/ColorPicker.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 {ColorPicker as AriaColorPicker} from 'react-aria-components/ColorPicker';\n\nimport {AriaLabelingProps, FocusableRef, ValueBase} from '@react-types/shared';\nimport {Button} from 'react-aria-components/Button';\nimport {Color} from 'react-stately/Color';\nimport {ColorSwatch} from './ColorSwatch';\nimport {Content} from '../view/Content';\nimport {Dialog} from '../dialog/Dialog';\nimport {DialogTrigger} from '../dialog/DialogTrigger';\nimport React, {ReactNode, useRef} from 'react';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {unwrapDOMRef, useFocusableRef} from '../utils/useDOMRef';\nimport {useId} from 'react-aria/useId';\n\nexport interface SpectrumColorPickerProps extends ValueBase<string | Color, Color>, AriaLabelingProps {\n  /** A visual label for the color picker. */\n  label?: ReactNode,\n  /** The contents of the color picker popover, e.g. `<ColorEditor />`. */\n  children?: ReactNode,\n  /**\n   * The size of the color swatch.\n   * @default \"M\"\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the color swatch.\n   * @default \"default\"\n   */\n  rounding?: 'default' | 'none' | 'full'\n}\n\n/**\n * A ColorPicker combines a swatch with a customizable popover for editing a color.\n */\nexport const ColorPicker = React.forwardRef(function ColorPicker(props: SpectrumColorPickerProps, ref: FocusableRef<HTMLButtonElement>) {\n  let swatchRef = useRef(null);\n  let domRef = useFocusableRef(ref);\n  let labelId = useId();\n  return (\n    <AriaColorPicker {...props}>\n      <DialogTrigger type=\"popover\" mobileType=\"tray\" targetRef={unwrapDOMRef(swatchRef)}>\n        <Button \n          ref={domRef}\n          className={style({\n            backgroundColor: 'transparent',\n            borderStyle: 'none',\n            padding: 0,\n            display: 'flex',\n            alignItems: 'center',\n            gap: 'text-to-control',\n            outlineStyle: 'none',\n            fontFamily: 'sans',\n            color: 'body',\n            fontSize: {\n              size: {\n                XS: 'xs',\n                S: 'sm',\n                M: 'base',\n                L: 'lg'\n              }\n            }\n          })({size: props.size || 'M'})}>\n          {({isFocusVisible}) => (\n            <>\n              <div\n                className={style({\n                  outlineStyle: {\n                    default: 'none',\n                    isFocusVisible: 'solid'\n                  },\n                  outlineColor: 'focus-ring',\n                  outlineWidth: 2,\n                  outlineOffset: 2,\n                  borderRadius: 'default'\n                })({isFocusVisible})}>\n                <ColorSwatch\n                  ref={swatchRef}\n                  color={props.value}\n                  size={props.size}\n                  rounding={props.rounding}\n                  aria-label={props['aria-label']}\n                  aria-labelledby={props['aria-labelledby']}\n                  aria-describedby={props['aria-describedby']}\n                  aria-details={props['aria-details']} />\n              </div>\n              {props.label && \n                <span id={labelId}>{props.label}</span>\n              }\n            </>\n          )}\n        </Button>\n        <Dialog \n          aria-labelledby={props.label ? labelId : props['aria-labelledby']}\n          aria-label={props['aria-label']}\n          UNSAFE_style={{\n            width: 'fit-content',\n            minWidth: 0,\n            margin: '0 auto' // Center within tray.\n          }}>\n          <Content \n            UNSAFE_style={{\n              position: 'relative',\n              margin: 'calc(var(--spectrum-dialog-padding) * -1)',\n              padding: 'var(--spectrum-global-dimension-size-200)'\n            }}>\n            {props.children}\n          </Content>\n        </Dialog>\n      </DialogTrigger>\n    </AriaColorPicker>\n  );\n});\n"],"names":[],"version":3,"file":"ColorPicker.js.map"}
+{"mappings":";;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;AAuCM,MAAM,0DAAc,CAAA,GAAA,YAAI,EAAE,UAAU,CAAC,SAAS,YACnD,KAA+B,EAC/B,GAAoC;IAEpC,IAAI,YAAY,CAAA,GAAA,aAAK,EAAE;IACvB,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE;IAC7B,IAAI,UAAU,CAAA,GAAA,YAAI;IAClB,qBACE,gCAAC,CAAA,GAAA,kBAAc,GAAM,qBACnB,gCAAC,CAAA,GAAA,yCAAY;QAAE,MAAK;QAAU,YAAW;QAAO,WAAW,CAAA,GAAA,yCAAW,EAAE;qBACtE,gCAAC,CAAA,GAAA,aAAK;QACJ,KAAK;QACL,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;UAkBR;YAAC,MAAM,MAAM,IAAI,IAAI;QAAG;OAC1B,CAAC,kBAAC,cAAc,EAAC,iBAChB,gFACE,gCAAC;YACC,WAAW;;;;;;;;;;;;;cASR;gCAAC;YAAc;yBAClB,gCAAC,CAAA,GAAA,yCAAU;YACT,KAAK;YACL,OAAO,MAAM,KAAK;YAClB,MAAM,MAAM,IAAI;YAChB,UAAU,MAAM,QAAQ;YACxB,cAAY,KAAK,CAAC,aAAa;YAC/B,mBAAiB,KAAK,CAAC,kBAAkB;YACzC,oBAAkB,KAAK,CAAC,mBAAmB;YAC3C,gBAAc,KAAK,CAAC,eAAe;aAGtC,MAAM,KAAK,kBAAI,gCAAC;YAAK,IAAI;WAAU,MAAM,KAAK,mBAIrD,gCAAC,CAAA,GAAA,yCAAK;QACJ,mBAAiB,MAAM,KAAK,GAAG,UAAU,KAAK,CAAC,kBAAkB;QACjE,cAAY,KAAK,CAAC,aAAa;QAC/B,cAAc;YACZ,OAAO;YACP,UAAU;YACV,QAAQ,SAAS,sBAAsB;QACzC;qBACA,gCAAC,CAAA,GAAA,yCAAM;QACL,cAAc;YACZ,UAAU;YACV,QAAQ;YACR,SAAS;QACX;OACC,MAAM,QAAQ;AAM3B","sources":["packages/@adobe/react-spectrum/src/color/ColorPicker.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 {ColorPicker as AriaColorPicker} from 'react-aria-components/ColorPicker';\n\nimport {AriaLabelingProps, FocusableRef, ValueBase} from '@react-types/shared';\nimport {Button} from 'react-aria-components/Button';\nimport {Color} from 'react-stately/Color';\nimport {ColorSwatch} from './ColorSwatch';\nimport {Content} from '../view/Content';\nimport {Dialog} from '../dialog/Dialog';\nimport {DialogTrigger} from '../dialog/DialogTrigger';\nimport React, {ReactNode, useRef} from 'react';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {unwrapDOMRef, useFocusableRef} from '../utils/useDOMRef';\nimport {useId} from 'react-aria/useId';\n\nexport interface SpectrumColorPickerProps\n  extends ValueBase<string | Color, Color>, AriaLabelingProps {\n  /** A visual label for the color picker. */\n  label?: ReactNode;\n  /** The contents of the color picker popover, e.g. `<ColorEditor />`. */\n  children?: ReactNode;\n  /**\n   * The size of the color swatch.\n   *\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L';\n  /**\n   * The corner rounding of the color swatch.\n   *\n   * @default 'default'\n   */\n  rounding?: 'default' | 'none' | 'full';\n}\n\n/**\n * A ColorPicker combines a swatch with a customizable popover for editing a color.\n */\nexport const ColorPicker = React.forwardRef(function ColorPicker(\n  props: SpectrumColorPickerProps,\n  ref: FocusableRef<HTMLButtonElement>\n) {\n  let swatchRef = useRef(null);\n  let domRef = useFocusableRef(ref);\n  let labelId = useId();\n  return (\n    <AriaColorPicker {...props}>\n      <DialogTrigger type=\"popover\" mobileType=\"tray\" targetRef={unwrapDOMRef(swatchRef)}>\n        <Button\n          ref={domRef}\n          className={style({\n            backgroundColor: 'transparent',\n            borderStyle: 'none',\n            padding: 0,\n            display: 'flex',\n            alignItems: 'center',\n            gap: 'text-to-control',\n            outlineStyle: 'none',\n            fontFamily: 'sans',\n            color: 'body',\n            fontSize: {\n              size: {\n                XS: 'xs',\n                S: 'sm',\n                M: 'base',\n                L: 'lg'\n              }\n            }\n          })({size: props.size || 'M'})}>\n          {({isFocusVisible}) => (\n            <>\n              <div\n                className={style({\n                  outlineStyle: {\n                    default: 'none',\n                    isFocusVisible: 'solid'\n                  },\n                  outlineColor: 'focus-ring',\n                  outlineWidth: 2,\n                  outlineOffset: 2,\n                  borderRadius: 'default'\n                })({isFocusVisible})}>\n                <ColorSwatch\n                  ref={swatchRef}\n                  color={props.value}\n                  size={props.size}\n                  rounding={props.rounding}\n                  aria-label={props['aria-label']}\n                  aria-labelledby={props['aria-labelledby']}\n                  aria-describedby={props['aria-describedby']}\n                  aria-details={props['aria-details']}\n                />\n              </div>\n              {props.label && <span id={labelId}>{props.label}</span>}\n            </>\n          )}\n        </Button>\n        <Dialog\n          aria-labelledby={props.label ? labelId : props['aria-labelledby']}\n          aria-label={props['aria-label']}\n          UNSAFE_style={{\n            width: 'fit-content',\n            minWidth: 0,\n            margin: '0 auto' // Center within tray.\n          }}>\n          <Content\n            UNSAFE_style={{\n              position: 'relative',\n              margin: 'calc(var(--spectrum-dialog-padding) * -1)',\n              padding: 'var(--spectrum-global-dimension-size-200)'\n            }}>\n            {props.children}\n          </Content>\n        </Dialog>\n      </DialogTrigger>\n    </AriaColorPicker>\n  );\n});\n"],"names":[],"version":3,"file":"ColorPicker.js.map"}

package/dist/private/color/ColorPicker.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;AAoCM,MAAM,0DAAc,CAAA,GAAA,YAAI,EAAE,UAAU,CAAC,SAAS,YAAY,KAA+B,EAAE,GAAoC;IACpI,IAAI,YAAY,CAAA,GAAA,aAAK,EAAE;IACvB,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE;IAC7B,IAAI,UAAU,CAAA,GAAA,YAAI;IAClB,qBACE,gCAAC,CAAA,GAAA,kBAAc,GAAM,qBACnB,gCAAC,CAAA,GAAA,yCAAY;QAAE,MAAK;QAAU,YAAW;QAAO,WAAW,CAAA,GAAA,yCAAW,EAAE;qBACtE,gCAAC,CAAA,GAAA,aAAK;QACJ,KAAK;QACL,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;UAkBR;YAAC,MAAM,MAAM,IAAI,IAAI;QAAG;OAC1B,CAAC,kBAAC,cAAc,EAAC,iBAChB,gFACE,gCAAC;YACC,WAAW;;;;;;;;;;;;;cASR;gCAAC;YAAc;yBAClB,gCAAC,CAAA,GAAA,yCAAU;YACT,KAAK;YACL,OAAO,MAAM,KAAK;YAClB,MAAM,MAAM,IAAI;YAChB,UAAU,MAAM,QAAQ;YACxB,cAAY,KAAK,CAAC,aAAa;YAC/B,mBAAiB,KAAK,CAAC,kBAAkB;YACzC,oBAAkB,KAAK,CAAC,mBAAmB;YAC3C,gBAAc,KAAK,CAAC,eAAe;aAEtC,MAAM,KAAK,kBACV,gCAAC;YAAK,IAAI;WAAU,MAAM,KAAK,mBAKvC,gCAAC,CAAA,GAAA,yCAAK;QACJ,mBAAiB,MAAM,KAAK,GAAG,UAAU,KAAK,CAAC,kBAAkB;QACjE,cAAY,KAAK,CAAC,aAAa;QAC/B,cAAc;YACZ,OAAO;YACP,UAAU;YACV,QAAQ,SAAS,sBAAsB;QACzC;qBACA,gCAAC,CAAA,GAAA,yCAAM;QACL,cAAc;YACZ,UAAU;YACV,QAAQ;YACR,SAAS;QACX;OACC,MAAM,QAAQ;AAM3B","sources":["packages/@adobe/react-spectrum/src/color/ColorPicker.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 {ColorPicker as AriaColorPicker} from 'react-aria-components/ColorPicker';\n\nimport {AriaLabelingProps, FocusableRef, ValueBase} from '@react-types/shared';\nimport {Button} from 'react-aria-components/Button';\nimport {Color} from 'react-stately/Color';\nimport {ColorSwatch} from './ColorSwatch';\nimport {Content} from '../view/Content';\nimport {Dialog} from '../dialog/Dialog';\nimport {DialogTrigger} from '../dialog/DialogTrigger';\nimport React, {ReactNode, useRef} from 'react';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {unwrapDOMRef, useFocusableRef} from '../utils/useDOMRef';\nimport {useId} from 'react-aria/useId';\n\nexport interface SpectrumColorPickerProps extends ValueBase<string | Color, Color>, AriaLabelingProps {\n  /** A visual label for the color picker. */\n  label?: ReactNode,\n  /** The contents of the color picker popover, e.g. `<ColorEditor />`. */\n  children?: ReactNode,\n  /**\n   * The size of the color swatch.\n   * @default \"M\"\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the color swatch.\n   * @default \"default\"\n   */\n  rounding?: 'default' | 'none' | 'full'\n}\n\n/**\n * A ColorPicker combines a swatch with a customizable popover for editing a color.\n */\nexport const ColorPicker = React.forwardRef(function ColorPicker(props: SpectrumColorPickerProps, ref: FocusableRef<HTMLButtonElement>) {\n  let swatchRef = useRef(null);\n  let domRef = useFocusableRef(ref);\n  let labelId = useId();\n  return (\n    <AriaColorPicker {...props}>\n      <DialogTrigger type=\"popover\" mobileType=\"tray\" targetRef={unwrapDOMRef(swatchRef)}>\n        <Button \n          ref={domRef}\n          className={style({\n            backgroundColor: 'transparent',\n            borderStyle: 'none',\n            padding: 0,\n            display: 'flex',\n            alignItems: 'center',\n            gap: 'text-to-control',\n            outlineStyle: 'none',\n            fontFamily: 'sans',\n            color: 'body',\n            fontSize: {\n              size: {\n                XS: 'xs',\n                S: 'sm',\n                M: 'base',\n                L: 'lg'\n              }\n            }\n          })({size: props.size || 'M'})}>\n          {({isFocusVisible}) => (\n            <>\n              <div\n                className={style({\n                  outlineStyle: {\n                    default: 'none',\n                    isFocusVisible: 'solid'\n                  },\n                  outlineColor: 'focus-ring',\n                  outlineWidth: 2,\n                  outlineOffset: 2,\n                  borderRadius: 'default'\n                })({isFocusVisible})}>\n                <ColorSwatch\n                  ref={swatchRef}\n                  color={props.value}\n                  size={props.size}\n                  rounding={props.rounding}\n                  aria-label={props['aria-label']}\n                  aria-labelledby={props['aria-labelledby']}\n                  aria-describedby={props['aria-describedby']}\n                  aria-details={props['aria-details']} />\n              </div>\n              {props.label && \n                <span id={labelId}>{props.label}</span>\n              }\n            </>\n          )}\n        </Button>\n        <Dialog \n          aria-labelledby={props.label ? labelId : props['aria-labelledby']}\n          aria-label={props['aria-label']}\n          UNSAFE_style={{\n            width: 'fit-content',\n            minWidth: 0,\n            margin: '0 auto' // Center within tray.\n          }}>\n          <Content \n            UNSAFE_style={{\n              position: 'relative',\n              margin: 'calc(var(--spectrum-dialog-padding) * -1)',\n              padding: 'var(--spectrum-global-dimension-size-200)'\n            }}>\n            {props.children}\n          </Content>\n        </Dialog>\n      </DialogTrigger>\n    </AriaColorPicker>\n  );\n});\n"],"names":[],"version":3,"file":"ColorPicker.mjs.map"}
+{"mappings":";;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;AAuCM,MAAM,0DAAc,CAAA,GAAA,YAAI,EAAE,UAAU,CAAC,SAAS,YACnD,KAA+B,EAC/B,GAAoC;IAEpC,IAAI,YAAY,CAAA,GAAA,aAAK,EAAE;IACvB,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE;IAC7B,IAAI,UAAU,CAAA,GAAA,YAAI;IAClB,qBACE,gCAAC,CAAA,GAAA,kBAAc,GAAM,qBACnB,gCAAC,CAAA,GAAA,yCAAY;QAAE,MAAK;QAAU,YAAW;QAAO,WAAW,CAAA,GAAA,yCAAW,EAAE;qBACtE,gCAAC,CAAA,GAAA,aAAK;QACJ,KAAK;QACL,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;UAkBR;YAAC,MAAM,MAAM,IAAI,IAAI;QAAG;OAC1B,CAAC,kBAAC,cAAc,EAAC,iBAChB,gFACE,gCAAC;YACC,WAAW;;;;;;;;;;;;;cASR;gCAAC;YAAc;yBAClB,gCAAC,CAAA,GAAA,yCAAU;YACT,KAAK;YACL,OAAO,MAAM,KAAK;YAClB,MAAM,MAAM,IAAI;YAChB,UAAU,MAAM,QAAQ;YACxB,cAAY,KAAK,CAAC,aAAa;YAC/B,mBAAiB,KAAK,CAAC,kBAAkB;YACzC,oBAAkB,KAAK,CAAC,mBAAmB;YAC3C,gBAAc,KAAK,CAAC,eAAe;aAGtC,MAAM,KAAK,kBAAI,gCAAC;YAAK,IAAI;WAAU,MAAM,KAAK,mBAIrD,gCAAC,CAAA,GAAA,yCAAK;QACJ,mBAAiB,MAAM,KAAK,GAAG,UAAU,KAAK,CAAC,kBAAkB;QACjE,cAAY,KAAK,CAAC,aAAa;QAC/B,cAAc;YACZ,OAAO;YACP,UAAU;YACV,QAAQ,SAAS,sBAAsB;QACzC;qBACA,gCAAC,CAAA,GAAA,yCAAM;QACL,cAAc;YACZ,UAAU;YACV,QAAQ;YACR,SAAS;QACX;OACC,MAAM,QAAQ;AAM3B","sources":["packages/@adobe/react-spectrum/src/color/ColorPicker.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 {ColorPicker as AriaColorPicker} from 'react-aria-components/ColorPicker';\n\nimport {AriaLabelingProps, FocusableRef, ValueBase} from '@react-types/shared';\nimport {Button} from 'react-aria-components/Button';\nimport {Color} from 'react-stately/Color';\nimport {ColorSwatch} from './ColorSwatch';\nimport {Content} from '../view/Content';\nimport {Dialog} from '../dialog/Dialog';\nimport {DialogTrigger} from '../dialog/DialogTrigger';\nimport React, {ReactNode, useRef} from 'react';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {unwrapDOMRef, useFocusableRef} from '../utils/useDOMRef';\nimport {useId} from 'react-aria/useId';\n\nexport interface SpectrumColorPickerProps\n  extends ValueBase<string | Color, Color>, AriaLabelingProps {\n  /** A visual label for the color picker. */\n  label?: ReactNode;\n  /** The contents of the color picker popover, e.g. `<ColorEditor />`. */\n  children?: ReactNode;\n  /**\n   * The size of the color swatch.\n   *\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L';\n  /**\n   * The corner rounding of the color swatch.\n   *\n   * @default 'default'\n   */\n  rounding?: 'default' | 'none' | 'full';\n}\n\n/**\n * A ColorPicker combines a swatch with a customizable popover for editing a color.\n */\nexport const ColorPicker = React.forwardRef(function ColorPicker(\n  props: SpectrumColorPickerProps,\n  ref: FocusableRef<HTMLButtonElement>\n) {\n  let swatchRef = useRef(null);\n  let domRef = useFocusableRef(ref);\n  let labelId = useId();\n  return (\n    <AriaColorPicker {...props}>\n      <DialogTrigger type=\"popover\" mobileType=\"tray\" targetRef={unwrapDOMRef(swatchRef)}>\n        <Button\n          ref={domRef}\n          className={style({\n            backgroundColor: 'transparent',\n            borderStyle: 'none',\n            padding: 0,\n            display: 'flex',\n            alignItems: 'center',\n            gap: 'text-to-control',\n            outlineStyle: 'none',\n            fontFamily: 'sans',\n            color: 'body',\n            fontSize: {\n              size: {\n                XS: 'xs',\n                S: 'sm',\n                M: 'base',\n                L: 'lg'\n              }\n            }\n          })({size: props.size || 'M'})}>\n          {({isFocusVisible}) => (\n            <>\n              <div\n                className={style({\n                  outlineStyle: {\n                    default: 'none',\n                    isFocusVisible: 'solid'\n                  },\n                  outlineColor: 'focus-ring',\n                  outlineWidth: 2,\n                  outlineOffset: 2,\n                  borderRadius: 'default'\n                })({isFocusVisible})}>\n                <ColorSwatch\n                  ref={swatchRef}\n                  color={props.value}\n                  size={props.size}\n                  rounding={props.rounding}\n                  aria-label={props['aria-label']}\n                  aria-labelledby={props['aria-labelledby']}\n                  aria-describedby={props['aria-describedby']}\n                  aria-details={props['aria-details']}\n                />\n              </div>\n              {props.label && <span id={labelId}>{props.label}</span>}\n            </>\n          )}\n        </Button>\n        <Dialog\n          aria-labelledby={props.label ? labelId : props['aria-labelledby']}\n          aria-label={props['aria-label']}\n          UNSAFE_style={{\n            width: 'fit-content',\n            minWidth: 0,\n            margin: '0 auto' // Center within tray.\n          }}>\n          <Content\n            UNSAFE_style={{\n              position: 'relative',\n              margin: 'calc(var(--spectrum-dialog-padding) * -1)',\n              padding: 'var(--spectrum-global-dimension-size-200)'\n            }}>\n            {props.children}\n          </Content>\n        </Dialog>\n      </DialogTrigger>\n    </AriaColorPicker>\n  );\n});\n"],"names":[],"version":3,"file":"ColorPicker.mjs.map"}

package/dist/private/color/ColorSlider.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;;;AA+BM,MAAM,0DAAc,CAAA,GAAA,sCAAI,EAAE,UAAU,CAAC,SAAS,YAAY,KAA+B,EAAE,GAAiC;IACjI,QAAQ,CAAA,GAAA,0CAAe,EAAE;IACzB,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAE;IACtB,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAE;IACtB,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE,KAAK;IAClC,CAAC,OAAO,OAAO,GAAG,CAAA,GAAA,+CAAc,EAAE,OAAO,QAAQ,CAAA,GAAA,wDAAiB;IAElE,IAAI,cACF,UAAU,WACV,OAAO,eACP,WAAW,SACX,KAAK,kBACL,cAAc,EACd,cAAc,SAAS,EACxB,GAAG;IACJ,IAAI,WAAW,gBAAgB;IAE/B,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,uCAAY,EAAE;IACjC,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,sCAAQ;IAEvB,IAAI,QAAQ,CAAA,GAAA,0DAAkB,EAAE;QAAC,GAAG,KAAK;gBAAE;IAAM;IAEjD,wEAAwE;IACxE,IAAI,YAAY,OAAO;QACrB,YAAY,aAAc,CAAA,OAAO,UAAU,WAAW,QAAQ,SAAQ;QACtE,QAAQ;IACV;IAEA,mEAAmE;IACnE,qDAAqD;IACrD,8FAA8F;IAC9F,mEAAmE;IACnE,IAAI,UAAU,aAAa,CAAC,aAAa,CAAC,KAAK,CAAC,kBAAkB,IAAI,CAAC,UACrE,QAAQ,MAAM,KAAK,CAAC,cAAc,CAAC,SAAS;IAG9C,8DAA8D;IAC9D,IAAI,kBAAkB,MACpB,iBAAiB,CAAC,CAAC;IAGrB,IAAI,cAAC,UAAU,cAAE,UAAU,cAAE,UAAU,cAAE,UAAU,eAAE,WAAW,EAAC,GAAG,CAAA,GAAA,6CAAa,EAAE;QACjF,GAAG,KAAK;eACR;QACA,cAAc;kBACd;kBACA;IACF,GAAG;IAEH,IAAI,kBAAC,cAAc,EAAC,GAAG,CAAA,GAAA,+CAAc;IACrC,IAAI,CAAC,WAAW,aAAa,GAAG,CAAA,GAAA,qBAAO,EAAE;IACzC,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,iCAAO,EAAE;oBAC1B;QACA,eAAe;IACjB;IAEA,qBACE,0DAAC;QACC,KAAK;QACJ,GAAG,UAAU;QACd,WAAW,CAAA,GAAA,oCAAS,EAClB,CAAA,GAAA,mDAAK,GACL;YACE,8CAA8C,CAAC;YAC/C,4CAA4C;QAC9C,GACA,WAAW,SAAS;OAErB,uBACC,0DAAC;QAAI,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;qBACjC,0DAAC,CAAA,GAAA,+BAAI,GAAM,YAAa,QACvB,MAAM,cAAc,kBACnB,0DAAC,CAAA,GAAA,sCAAW;QACV,OAAO;YACL,cAAc;gBACZ,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;YACvC;QACF;OACC,MAAM,cAAc,GAGxB,gCACC,0DAAC,CAAA,GAAA,+BAAI;QAAE,aAAY;QAAO,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;qBAC7D,0DAAC,UAAW,aAAc,MAAM,KAAK,CAAC,kBAAkB,CAAC,SAAS,0BAK1E,0DAAC;QACE,GAAG,UAAU;QACd,KAAK;QACL,WAAW,CAAA,GAAA,oCAAS,EAClB,CAAA,GAAA,mDAAK,GACL,wBAAwB;YACtB,eAAe;YACf,kCAAkC;QACpC;qBAGF,0DAAC,CAAA,GAAA,oCAAS;QACR,OAAO,MAAM,eAAe;QAC5B,WAAW,aAAa;QACxB,YAAY;QACZ,YAAY,MAAM,eAAe,CAAC;QAClC,cAAc;QACd,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;QAC7B,GAAG,UAAU;qBACd,0DAAC;QAAO,GAAG,UAAU;QAAG,GAAG,UAAU;QAAE,KAAK;QAAU,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;;AAK9F","sources":["packages/@adobe/react-spectrum/src/color/ColorSlider.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorSliderProps, useColorSlider} from 'react-aria/useColorSlider';\n\nimport {classNames} from '../utils/classNames';\nimport {ColorSliderContext} from 'react-aria-components/ColorSlider';\nimport {ColorThumb} from './ColorThumb';\nimport {FocusableRef, StyleProps} from '@react-types/shared';\nimport {Label} from '../label/Label';\nimport React, {ReactNode, useRef, useState} from 'react';\nimport {SlotProvider} from '../utils/Slots';\nimport styles from '@adobe/spectrum-css-temp/components/colorslider/vars.css';\nimport {useColorSliderState} from 'react-stately/useColorSliderState';\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useFocus} from 'react-aria/useFocus';\nimport {useFocusableRef} from '../utils/useDOMRef';\nimport {useFocusVisible} from 'react-aria/useFocusVisible';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useProviderProps} from '../provider/Provider';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSliderProps extends AriaColorSliderProps, StyleProps {\n  /** Whether the value label is displayed. True by default if there is a label, false by default if not. */\n  showValueLabel?: boolean,\n  /** A ContextualHelp element to place next to the label. */\n  contextualHelp?: ReactNode\n}\n\n/**\n * ColorSliders allow users to adjust an individual channel of a color value.\n */\nexport const ColorSlider = React.forwardRef(function ColorSlider(props: SpectrumColorSliderProps, ref: FocusableRef<HTMLDivElement>) {\n  props = useProviderProps(props);\n  let inputRef = useRef(null);\n  let trackRef = useRef(null);\n  let domRef = useFocusableRef(ref, inputRef);\n  [props, domRef] = useContextProps(props, domRef, ColorSliderContext);\n\n  let {\n    isDisabled,\n    channel,\n    orientation,\n    label,\n    showValueLabel,\n    'aria-label': ariaLabel\n  } = props;\n  let vertical = orientation === 'vertical';\n\n  let {styleProps} = useStyleProps(props);\n  let {locale} = useLocale();\n\n  let state = useColorSliderState({...props, locale});\n\n  // If vertical and a label is provided, use it as an aria-label instead.\n  if (vertical && label) {\n    ariaLabel = ariaLabel || (typeof label === 'string' ? label : undefined);\n    label = null;\n  }\n\n  // If no external label, aria-label or aria-labelledby is provided,\n  // default to displaying the localized channel value.\n  // Specifically check if label is undefined. If label is `null` then display no visible label.\n  // A default aria-label is provided by useColorSlider in that case.\n  if (label === undefined && !ariaLabel && !props['aria-labelledby'] && !vertical) {\n    label = state.value.getChannelName(channel, locale);\n  }\n\n  // Show the value label by default if there is a visible label\n  if (showValueLabel == null) {\n    showValueLabel = !!label;\n  }\n\n  let {inputProps, thumbProps, trackProps, labelProps, outputProps} = useColorSlider({\n    ...props,\n    label,\n    'aria-label': ariaLabel,\n    trackRef,\n    inputRef\n  }, state);\n\n  let {isFocusVisible} = useFocusVisible();\n  let [isFocused, setIsFocused] = useState(false);\n  let {focusProps} = useFocus({\n    isDisabled,\n    onFocusChange: setIsFocused\n  });\n\n  return (\n    <div\n      ref={domRef}\n      {...styleProps}\n      className={classNames(\n        styles,\n        {\n          'spectrum-ColorSlider-container--horizontal': !vertical,\n          'spectrum-ColorSlider-container--vertical': vertical\n        },\n        styleProps.className\n      )}>\n      {label &&\n        <div className={classNames(styles, 'spectrum-ColorSlider-labelContainer')}>\n          <Label {...labelProps}>{label}</Label>\n          {props.contextualHelp &&\n            <SlotProvider\n              slots={{\n                actionButton: {\n                  UNSAFE_className: classNames(styles, 'spectrum-ColorSlider-contextualHelp')\n                }\n              }}>\n              {props.contextualHelp}\n            </SlotProvider>\n          }\n          {showValueLabel && (\n            <Label elementType=\"span\" UNSAFE_className={classNames(styles, 'spectrum-ColorSlider-valueLabel')}>\n              <output {...outputProps}>{state.value.formatChannelValue(channel, locale)}</output>\n            </Label>\n          )}\n        </div>\n      }\n      <div\n        {...trackProps}\n        ref={trackRef}\n        className={classNames(\n          styles,\n          'spectrum-ColorSlider', {\n            'is-disabled': isDisabled,\n            'spectrum-ColorSlider--vertical': vertical\n          }\n        )\n      }>\n        <ColorThumb\n          value={state.getDisplayColor()}\n          isFocused={isFocused && isFocusVisible}\n          isDisabled={isDisabled}\n          isDragging={state.isThumbDragging(0)}\n          containerRef={trackRef}\n          className={classNames(styles, 'spectrum-ColorSlider-handle')}\n          {...thumbProps}>\n          <input {...inputProps} {...focusProps} ref={inputRef} className={classNames(styles, 'spectrum-ColorSlider-slider')} />\n        </ColorThumb>\n      </div>\n    </div>\n  );\n});\n"],"names":[],"version":3,"file":"ColorSlider.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;;;AAkCM,MAAM,0DAAc,CAAA,GAAA,sCAAI,EAAE,UAAU,CAAC,SAAS,YACnD,KAA+B,EAC/B,GAAiC;IAEjC,QAAQ,CAAA,GAAA,0CAAe,EAAE;IACzB,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAE;IACtB,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAE;IACtB,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE,KAAK;IAClC,CAAC,OAAO,OAAO,GAAG,CAAA,GAAA,+CAAc,EAAE,OAAO,QAAQ,CAAA,GAAA,wDAAiB;IAElE,IAAI,cAAC,UAAU,WAAE,OAAO,eAAE,WAAW,SAAE,KAAK,kBAAE,cAAc,EAAE,cAAc,SAAS,EAAC,GAAG;IACzF,IAAI,WAAW,gBAAgB;IAE/B,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,uCAAY,EAAE;IACjC,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,sCAAQ;IAEvB,IAAI,QAAQ,CAAA,GAAA,0DAAkB,EAAE;QAAC,GAAG,KAAK;gBAAE;IAAM;IAEjD,wEAAwE;IACxE,IAAI,YAAY,OAAO;QACrB,YAAY,aAAc,CAAA,OAAO,UAAU,WAAW,QAAQ,SAAQ;QACtE,QAAQ;IACV;IAEA,mEAAmE;IACnE,qDAAqD;IACrD,8FAA8F;IAC9F,mEAAmE;IACnE,IAAI,UAAU,aAAa,CAAC,aAAa,CAAC,KAAK,CAAC,kBAAkB,IAAI,CAAC,UACrE,QAAQ,MAAM,KAAK,CAAC,cAAc,CAAC,SAAS;IAG9C,8DAA8D;IAC9D,IAAI,kBAAkB,MACpB,iBAAiB,CAAC,CAAC;IAGrB,IAAI,cAAC,UAAU,cAAE,UAAU,cAAE,UAAU,cAAE,UAAU,eAAE,WAAW,EAAC,GAAG,CAAA,GAAA,6CAAa,EAC/E;QACE,GAAG,KAAK;eACR;QACA,cAAc;kBACd;kBACA;IACF,GACA;IAGF,IAAI,kBAAC,cAAc,EAAC,GAAG,CAAA,GAAA,+CAAc;IACrC,IAAI,CAAC,WAAW,aAAa,GAAG,CAAA,GAAA,qBAAO,EAAE;IACzC,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,iCAAO,EAAE;oBAC1B;QACA,eAAe;IACjB;IAEA,qBACE,0DAAC;QACC,KAAK;QACJ,GAAG,UAAU;QACd,WAAW,CAAA,GAAA,oCAAS,EAClB,CAAA,GAAA,mDAAK,GACL;YACE,8CAA8C,CAAC;YAC/C,4CAA4C;QAC9C,GACA,WAAW,SAAS;OAErB,uBACC,0DAAC;QAAI,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;qBACjC,0DAAC,CAAA,GAAA,+BAAI,GAAM,YAAa,QACvB,MAAM,cAAc,kBACnB,0DAAC,CAAA,GAAA,sCAAW;QACV,OAAO;YACL,cAAc;gBACZ,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;YACvC;QACF;OACC,MAAM,cAAc,GAGxB,gCACC,0DAAC,CAAA,GAAA,+BAAI;QACH,aAAY;QACZ,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;qBACrC,0DAAC,UAAW,aAAc,MAAM,KAAK,CAAC,kBAAkB,CAAC,SAAS,0BAK1E,0DAAC;QACE,GAAG,UAAU;QACd,KAAK;QACL,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG,wBAAwB;YACpD,eAAe;YACf,kCAAkC;QACpC;qBACA,0DAAC,CAAA,GAAA,oCAAS;QACR,OAAO,MAAM,eAAe;QAC5B,WAAW,aAAa;QACxB,YAAY;QACZ,YAAY,MAAM,eAAe,CAAC;QAClC,cAAc;QACd,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;QAC7B,GAAG,UAAU;qBACd,0DAAC;QACE,GAAG,UAAU;QACb,GAAG,UAAU;QACd,KAAK;QACL,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;;AAM1C","sources":["packages/@adobe/react-spectrum/src/color/ColorSlider.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorSliderProps, useColorSlider} from 'react-aria/useColorSlider';\n\nimport {classNames} from '../utils/classNames';\nimport {ColorSliderContext} from 'react-aria-components/ColorSlider';\nimport {ColorThumb} from './ColorThumb';\nimport {FocusableRef, StyleProps} from '@react-types/shared';\nimport {Label} from '../label/Label';\nimport React, {ReactNode, useRef, useState} from 'react';\nimport {SlotProvider} from '../utils/Slots';\nimport styles from '@adobe/spectrum-css-temp/components/colorslider/vars.css';\nimport {useColorSliderState} from 'react-stately/useColorSliderState';\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useFocus} from 'react-aria/useFocus';\nimport {useFocusableRef} from '../utils/useDOMRef';\nimport {useFocusVisible} from 'react-aria/useFocusVisible';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useProviderProps} from '../provider/Provider';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSliderProps extends AriaColorSliderProps, StyleProps {\n  /**\n   * Whether the value label is displayed. True by default if there is a label, false by default if\n   * not.\n   */\n  showValueLabel?: boolean;\n  /** A ContextualHelp element to place next to the label. */\n  contextualHelp?: ReactNode;\n}\n\n/**\n * ColorSliders allow users to adjust an individual channel of a color value.\n */\nexport const ColorSlider = React.forwardRef(function ColorSlider(\n  props: SpectrumColorSliderProps,\n  ref: FocusableRef<HTMLDivElement>\n) {\n  props = useProviderProps(props);\n  let inputRef = useRef(null);\n  let trackRef = useRef(null);\n  let domRef = useFocusableRef(ref, inputRef);\n  [props, domRef] = useContextProps(props, domRef, ColorSliderContext);\n\n  let {isDisabled, channel, orientation, label, showValueLabel, 'aria-label': ariaLabel} = props;\n  let vertical = orientation === 'vertical';\n\n  let {styleProps} = useStyleProps(props);\n  let {locale} = useLocale();\n\n  let state = useColorSliderState({...props, locale});\n\n  // If vertical and a label is provided, use it as an aria-label instead.\n  if (vertical && label) {\n    ariaLabel = ariaLabel || (typeof label === 'string' ? label : undefined);\n    label = null;\n  }\n\n  // If no external label, aria-label or aria-labelledby is provided,\n  // default to displaying the localized channel value.\n  // Specifically check if label is undefined. If label is `null` then display no visible label.\n  // A default aria-label is provided by useColorSlider in that case.\n  if (label === undefined && !ariaLabel && !props['aria-labelledby'] && !vertical) {\n    label = state.value.getChannelName(channel, locale);\n  }\n\n  // Show the value label by default if there is a visible label\n  if (showValueLabel == null) {\n    showValueLabel = !!label;\n  }\n\n  let {inputProps, thumbProps, trackProps, labelProps, outputProps} = useColorSlider(\n    {\n      ...props,\n      label,\n      'aria-label': ariaLabel,\n      trackRef,\n      inputRef\n    },\n    state\n  );\n\n  let {isFocusVisible} = useFocusVisible();\n  let [isFocused, setIsFocused] = useState(false);\n  let {focusProps} = useFocus({\n    isDisabled,\n    onFocusChange: setIsFocused\n  });\n\n  return (\n    <div\n      ref={domRef}\n      {...styleProps}\n      className={classNames(\n        styles,\n        {\n          'spectrum-ColorSlider-container--horizontal': !vertical,\n          'spectrum-ColorSlider-container--vertical': vertical\n        },\n        styleProps.className\n      )}>\n      {label && (\n        <div className={classNames(styles, 'spectrum-ColorSlider-labelContainer')}>\n          <Label {...labelProps}>{label}</Label>\n          {props.contextualHelp && (\n            <SlotProvider\n              slots={{\n                actionButton: {\n                  UNSAFE_className: classNames(styles, 'spectrum-ColorSlider-contextualHelp')\n                }\n              }}>\n              {props.contextualHelp}\n            </SlotProvider>\n          )}\n          {showValueLabel && (\n            <Label\n              elementType=\"span\"\n              UNSAFE_className={classNames(styles, 'spectrum-ColorSlider-valueLabel')}>\n              <output {...outputProps}>{state.value.formatChannelValue(channel, locale)}</output>\n            </Label>\n          )}\n        </div>\n      )}\n      <div\n        {...trackProps}\n        ref={trackRef}\n        className={classNames(styles, 'spectrum-ColorSlider', {\n          'is-disabled': isDisabled,\n          'spectrum-ColorSlider--vertical': vertical\n        })}>\n        <ColorThumb\n          value={state.getDisplayColor()}\n          isFocused={isFocused && isFocusVisible}\n          isDisabled={isDisabled}\n          isDragging={state.isThumbDragging(0)}\n          containerRef={trackRef}\n          className={classNames(styles, 'spectrum-ColorSlider-handle')}\n          {...thumbProps}>\n          <input\n            {...inputProps}\n            {...focusProps}\n            ref={inputRef}\n            className={classNames(styles, 'spectrum-ColorSlider-slider')}\n          />\n        </ColorThumb>\n      </div>\n    </div>\n  );\n});\n"],"names":[],"version":3,"file":"ColorSlider.cjs.map"}

package/dist/private/color/ColorSlider.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@adobe/react-spectrum/src/color/ColorSlider.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorSliderProps, useColorSlider} from 'react-aria/useColorSlider';\n\nimport {classNames} from '../utils/classNames';\nimport {ColorSliderContext} from 'react-aria-components/ColorSlider';\nimport {ColorThumb} from './ColorThumb';\nimport {FocusableRef, StyleProps} from '@react-types/shared';\nimport {Label} from '../label/Label';\nimport React, {ReactNode, useRef, useState} from 'react';\nimport {SlotProvider} from '../utils/Slots';\nimport styles from '@adobe/spectrum-css-temp/components/colorslider/vars.css';\nimport {useColorSliderState} from 'react-stately/useColorSliderState';\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useFocus} from 'react-aria/useFocus';\nimport {useFocusableRef} from '../utils/useDOMRef';\nimport {useFocusVisible} from 'react-aria/useFocusVisible';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useProviderProps} from '../provider/Provider';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSliderProps extends AriaColorSliderProps, StyleProps {\n  /** Whether the value label is displayed. True by default if there is a label, false by default if not. */\n  showValueLabel?: boolean,\n  /** A ContextualHelp element to place next to the label. */\n  contextualHelp?: ReactNode\n}\n\n/**\n * ColorSliders allow users to adjust an individual channel of a color value.\n */\nexport const ColorSlider = React.forwardRef(function ColorSlider(props: SpectrumColorSliderProps, ref: FocusableRef<HTMLDivElement>) {\n  props = useProviderProps(props);\n  let inputRef = useRef(null);\n  let trackRef = useRef(null);\n  let domRef = useFocusableRef(ref, inputRef);\n  [props, domRef] = useContextProps(props, domRef, ColorSliderContext);\n\n  let {\n    isDisabled,\n    channel,\n    orientation,\n    label,\n    showValueLabel,\n    'aria-label': ariaLabel\n  } = props;\n  let vertical = orientation === 'vertical';\n\n  let {styleProps} = useStyleProps(props);\n  let {locale} = useLocale();\n\n  let state = useColorSliderState({...props, locale});\n\n  // If vertical and a label is provided, use it as an aria-label instead.\n  if (vertical && label) {\n    ariaLabel = ariaLabel || (typeof label === 'string' ? label : undefined);\n    label = null;\n  }\n\n  // If no external label, aria-label or aria-labelledby is provided,\n  // default to displaying the localized channel value.\n  // Specifically check if label is undefined. If label is `null` then display no visible label.\n  // A default aria-label is provided by useColorSlider in that case.\n  if (label === undefined && !ariaLabel && !props['aria-labelledby'] && !vertical) {\n    label = state.value.getChannelName(channel, locale);\n  }\n\n  // Show the value label by default if there is a visible label\n  if (showValueLabel == null) {\n    showValueLabel = !!label;\n  }\n\n  let {inputProps, thumbProps, trackProps, labelProps, outputProps} = useColorSlider({\n    ...props,\n    label,\n    'aria-label': ariaLabel,\n    trackRef,\n    inputRef\n  }, state);\n\n  let {isFocusVisible} = useFocusVisible();\n  let [isFocused, setIsFocused] = useState(false);\n  let {focusProps} = useFocus({\n    isDisabled,\n    onFocusChange: setIsFocused\n  });\n\n  return (\n    <div\n      ref={domRef}\n      {...styleProps}\n      className={classNames(\n        styles,\n        {\n          'spectrum-ColorSlider-container--horizontal': !vertical,\n          'spectrum-ColorSlider-container--vertical': vertical\n        },\n        styleProps.className\n      )}>\n      {label &&\n        <div className={classNames(styles, 'spectrum-ColorSlider-labelContainer')}>\n          <Label {...labelProps}>{label}</Label>\n          {props.contextualHelp &&\n            <SlotProvider\n              slots={{\n                actionButton: {\n                  UNSAFE_className: classNames(styles, 'spectrum-ColorSlider-contextualHelp')\n                }\n              }}>\n              {props.contextualHelp}\n            </SlotProvider>\n          }\n          {showValueLabel && (\n            <Label elementType=\"span\" UNSAFE_className={classNames(styles, 'spectrum-ColorSlider-valueLabel')}>\n              <output {...outputProps}>{state.value.formatChannelValue(channel, locale)}</output>\n            </Label>\n          )}\n        </div>\n      }\n      <div\n        {...trackProps}\n        ref={trackRef}\n        className={classNames(\n          styles,\n          'spectrum-ColorSlider', {\n            'is-disabled': isDisabled,\n            'spectrum-ColorSlider--vertical': vertical\n          }\n        )\n      }>\n        <ColorThumb\n          value={state.getDisplayColor()}\n          isFocused={isFocused && isFocusVisible}\n          isDisabled={isDisabled}\n          isDragging={state.isThumbDragging(0)}\n          containerRef={trackRef}\n          className={classNames(styles, 'spectrum-ColorSlider-handle')}\n          {...thumbProps}>\n          <input {...inputProps} {...focusProps} ref={inputRef} className={classNames(styles, 'spectrum-ColorSlider-slider')} />\n        </ColorThumb>\n      </div>\n    </div>\n  );\n});\n"],"names":[],"version":3,"file":"ColorSlider.js.map"}
+{"mappings":"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","sources":["packages/@adobe/react-spectrum/src/color/ColorSlider.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorSliderProps, useColorSlider} from 'react-aria/useColorSlider';\n\nimport {classNames} from '../utils/classNames';\nimport {ColorSliderContext} from 'react-aria-components/ColorSlider';\nimport {ColorThumb} from './ColorThumb';\nimport {FocusableRef, StyleProps} from '@react-types/shared';\nimport {Label} from '../label/Label';\nimport React, {ReactNode, useRef, useState} from 'react';\nimport {SlotProvider} from '../utils/Slots';\nimport styles from '@adobe/spectrum-css-temp/components/colorslider/vars.css';\nimport {useColorSliderState} from 'react-stately/useColorSliderState';\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useFocus} from 'react-aria/useFocus';\nimport {useFocusableRef} from '../utils/useDOMRef';\nimport {useFocusVisible} from 'react-aria/useFocusVisible';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useProviderProps} from '../provider/Provider';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSliderProps extends AriaColorSliderProps, StyleProps {\n  /**\n   * Whether the value label is displayed. True by default if there is a label, false by default if\n   * not.\n   */\n  showValueLabel?: boolean;\n  /** A ContextualHelp element to place next to the label. */\n  contextualHelp?: ReactNode;\n}\n\n/**\n * ColorSliders allow users to adjust an individual channel of a color value.\n */\nexport const ColorSlider = React.forwardRef(function ColorSlider(\n  props: SpectrumColorSliderProps,\n  ref: FocusableRef<HTMLDivElement>\n) {\n  props = useProviderProps(props);\n  let inputRef = useRef(null);\n  let trackRef = useRef(null);\n  let domRef = useFocusableRef(ref, inputRef);\n  [props, domRef] = useContextProps(props, domRef, ColorSliderContext);\n\n  let {isDisabled, channel, orientation, label, showValueLabel, 'aria-label': ariaLabel} = props;\n  let vertical = orientation === 'vertical';\n\n  let {styleProps} = useStyleProps(props);\n  let {locale} = useLocale();\n\n  let state = useColorSliderState({...props, locale});\n\n  // If vertical and a label is provided, use it as an aria-label instead.\n  if (vertical && label) {\n    ariaLabel = ariaLabel || (typeof label === 'string' ? label : undefined);\n    label = null;\n  }\n\n  // If no external label, aria-label or aria-labelledby is provided,\n  // default to displaying the localized channel value.\n  // Specifically check if label is undefined. If label is `null` then display no visible label.\n  // A default aria-label is provided by useColorSlider in that case.\n  if (label === undefined && !ariaLabel && !props['aria-labelledby'] && !vertical) {\n    label = state.value.getChannelName(channel, locale);\n  }\n\n  // Show the value label by default if there is a visible label\n  if (showValueLabel == null) {\n    showValueLabel = !!label;\n  }\n\n  let {inputProps, thumbProps, trackProps, labelProps, outputProps} = useColorSlider(\n    {\n      ...props,\n      label,\n      'aria-label': ariaLabel,\n      trackRef,\n      inputRef\n    },\n    state\n  );\n\n  let {isFocusVisible} = useFocusVisible();\n  let [isFocused, setIsFocused] = useState(false);\n  let {focusProps} = useFocus({\n    isDisabled,\n    onFocusChange: setIsFocused\n  });\n\n  return (\n    <div\n      ref={domRef}\n      {...styleProps}\n      className={classNames(\n        styles,\n        {\n          'spectrum-ColorSlider-container--horizontal': !vertical,\n          'spectrum-ColorSlider-container--vertical': vertical\n        },\n        styleProps.className\n      )}>\n      {label && (\n        <div className={classNames(styles, 'spectrum-ColorSlider-labelContainer')}>\n          <Label {...labelProps}>{label}</Label>\n          {props.contextualHelp && (\n            <SlotProvider\n              slots={{\n                actionButton: {\n                  UNSAFE_className: classNames(styles, 'spectrum-ColorSlider-contextualHelp')\n                }\n              }}>\n              {props.contextualHelp}\n            </SlotProvider>\n          )}\n          {showValueLabel && (\n            <Label\n              elementType=\"span\"\n              UNSAFE_className={classNames(styles, 'spectrum-ColorSlider-valueLabel')}>\n              <output {...outputProps}>{state.value.formatChannelValue(channel, locale)}</output>\n            </Label>\n          )}\n        </div>\n      )}\n      <div\n        {...trackProps}\n        ref={trackRef}\n        className={classNames(styles, 'spectrum-ColorSlider', {\n          'is-disabled': isDisabled,\n          'spectrum-ColorSlider--vertical': vertical\n        })}>\n        <ColorThumb\n          value={state.getDisplayColor()}\n          isFocused={isFocused && isFocusVisible}\n          isDisabled={isDisabled}\n          isDragging={state.isThumbDragging(0)}\n          containerRef={trackRef}\n          className={classNames(styles, 'spectrum-ColorSlider-handle')}\n          {...thumbProps}>\n          <input\n            {...inputProps}\n            {...focusProps}\n            ref={inputRef}\n            className={classNames(styles, 'spectrum-ColorSlider-slider')}\n          />\n        </ColorThumb>\n      </div>\n    </div>\n  );\n});\n"],"names":[],"version":3,"file":"ColorSlider.js.map"}

package/dist/private/color/ColorSlider.mjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@adobe/react-spectrum/src/color/ColorSlider.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorSliderProps, useColorSlider} from 'react-aria/useColorSlider';\n\nimport {classNames} from '../utils/classNames';\nimport {ColorSliderContext} from 'react-aria-components/ColorSlider';\nimport {ColorThumb} from './ColorThumb';\nimport {FocusableRef, StyleProps} from '@react-types/shared';\nimport {Label} from '../label/Label';\nimport React, {ReactNode, useRef, useState} from 'react';\nimport {SlotProvider} from '../utils/Slots';\nimport styles from '@adobe/spectrum-css-temp/components/colorslider/vars.css';\nimport {useColorSliderState} from 'react-stately/useColorSliderState';\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useFocus} from 'react-aria/useFocus';\nimport {useFocusableRef} from '../utils/useDOMRef';\nimport {useFocusVisible} from 'react-aria/useFocusVisible';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useProviderProps} from '../provider/Provider';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSliderProps extends AriaColorSliderProps, StyleProps {\n  /** Whether the value label is displayed. True by default if there is a label, false by default if not. */\n  showValueLabel?: boolean,\n  /** A ContextualHelp element to place next to the label. */\n  contextualHelp?: ReactNode\n}\n\n/**\n * ColorSliders allow users to adjust an individual channel of a color value.\n */\nexport const ColorSlider = React.forwardRef(function ColorSlider(props: SpectrumColorSliderProps, ref: FocusableRef<HTMLDivElement>) {\n  props = useProviderProps(props);\n  let inputRef = useRef(null);\n  let trackRef = useRef(null);\n  let domRef = useFocusableRef(ref, inputRef);\n  [props, domRef] = useContextProps(props, domRef, ColorSliderContext);\n\n  let {\n    isDisabled,\n    channel,\n    orientation,\n    label,\n    showValueLabel,\n    'aria-label': ariaLabel\n  } = props;\n  let vertical = orientation === 'vertical';\n\n  let {styleProps} = useStyleProps(props);\n  let {locale} = useLocale();\n\n  let state = useColorSliderState({...props, locale});\n\n  // If vertical and a label is provided, use it as an aria-label instead.\n  if (vertical && label) {\n    ariaLabel = ariaLabel || (typeof label === 'string' ? label : undefined);\n    label = null;\n  }\n\n  // If no external label, aria-label or aria-labelledby is provided,\n  // default to displaying the localized channel value.\n  // Specifically check if label is undefined. If label is `null` then display no visible label.\n  // A default aria-label is provided by useColorSlider in that case.\n  if (label === undefined && !ariaLabel && !props['aria-labelledby'] && !vertical) {\n    label = state.value.getChannelName(channel, locale);\n  }\n\n  // Show the value label by default if there is a visible label\n  if (showValueLabel == null) {\n    showValueLabel = !!label;\n  }\n\n  let {inputProps, thumbProps, trackProps, labelProps, outputProps} = useColorSlider({\n    ...props,\n    label,\n    'aria-label': ariaLabel,\n    trackRef,\n    inputRef\n  }, state);\n\n  let {isFocusVisible} = useFocusVisible();\n  let [isFocused, setIsFocused] = useState(false);\n  let {focusProps} = useFocus({\n    isDisabled,\n    onFocusChange: setIsFocused\n  });\n\n  return (\n    <div\n      ref={domRef}\n      {...styleProps}\n      className={classNames(\n        styles,\n        {\n          'spectrum-ColorSlider-container--horizontal': !vertical,\n          'spectrum-ColorSlider-container--vertical': vertical\n        },\n        styleProps.className\n      )}>\n      {label &&\n        <div className={classNames(styles, 'spectrum-ColorSlider-labelContainer')}>\n          <Label {...labelProps}>{label}</Label>\n          {props.contextualHelp &&\n            <SlotProvider\n              slots={{\n                actionButton: {\n                  UNSAFE_className: classNames(styles, 'spectrum-ColorSlider-contextualHelp')\n                }\n              }}>\n              {props.contextualHelp}\n            </SlotProvider>\n          }\n          {showValueLabel && (\n            <Label elementType=\"span\" UNSAFE_className={classNames(styles, 'spectrum-ColorSlider-valueLabel')}>\n              <output {...outputProps}>{state.value.formatChannelValue(channel, locale)}</output>\n            </Label>\n          )}\n        </div>\n      }\n      <div\n        {...trackProps}\n        ref={trackRef}\n        className={classNames(\n          styles,\n          'spectrum-ColorSlider', {\n            'is-disabled': isDisabled,\n            'spectrum-ColorSlider--vertical': vertical\n          }\n        )\n      }>\n        <ColorThumb\n          value={state.getDisplayColor()}\n          isFocused={isFocused && isFocusVisible}\n          isDisabled={isDisabled}\n          isDragging={state.isThumbDragging(0)}\n          containerRef={trackRef}\n          className={classNames(styles, 'spectrum-ColorSlider-handle')}\n          {...thumbProps}>\n          <input {...inputProps} {...focusProps} ref={inputRef} className={classNames(styles, 'spectrum-ColorSlider-slider')} />\n        </ColorThumb>\n      </div>\n    </div>\n  );\n});\n"],"names":[],"version":3,"file":"ColorSlider.mjs.map"}
+{"mappings":"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","sources":["packages/@adobe/react-spectrum/src/color/ColorSlider.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorSliderProps, useColorSlider} from 'react-aria/useColorSlider';\n\nimport {classNames} from '../utils/classNames';\nimport {ColorSliderContext} from 'react-aria-components/ColorSlider';\nimport {ColorThumb} from './ColorThumb';\nimport {FocusableRef, StyleProps} from '@react-types/shared';\nimport {Label} from '../label/Label';\nimport React, {ReactNode, useRef, useState} from 'react';\nimport {SlotProvider} from '../utils/Slots';\nimport styles from '@adobe/spectrum-css-temp/components/colorslider/vars.css';\nimport {useColorSliderState} from 'react-stately/useColorSliderState';\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useFocus} from 'react-aria/useFocus';\nimport {useFocusableRef} from '../utils/useDOMRef';\nimport {useFocusVisible} from 'react-aria/useFocusVisible';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useProviderProps} from '../provider/Provider';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSliderProps extends AriaColorSliderProps, StyleProps {\n  /**\n   * Whether the value label is displayed. True by default if there is a label, false by default if\n   * not.\n   */\n  showValueLabel?: boolean;\n  /** A ContextualHelp element to place next to the label. */\n  contextualHelp?: ReactNode;\n}\n\n/**\n * ColorSliders allow users to adjust an individual channel of a color value.\n */\nexport const ColorSlider = React.forwardRef(function ColorSlider(\n  props: SpectrumColorSliderProps,\n  ref: FocusableRef<HTMLDivElement>\n) {\n  props = useProviderProps(props);\n  let inputRef = useRef(null);\n  let trackRef = useRef(null);\n  let domRef = useFocusableRef(ref, inputRef);\n  [props, domRef] = useContextProps(props, domRef, ColorSliderContext);\n\n  let {isDisabled, channel, orientation, label, showValueLabel, 'aria-label': ariaLabel} = props;\n  let vertical = orientation === 'vertical';\n\n  let {styleProps} = useStyleProps(props);\n  let {locale} = useLocale();\n\n  let state = useColorSliderState({...props, locale});\n\n  // If vertical and a label is provided, use it as an aria-label instead.\n  if (vertical && label) {\n    ariaLabel = ariaLabel || (typeof label === 'string' ? label : undefined);\n    label = null;\n  }\n\n  // If no external label, aria-label or aria-labelledby is provided,\n  // default to displaying the localized channel value.\n  // Specifically check if label is undefined. If label is `null` then display no visible label.\n  // A default aria-label is provided by useColorSlider in that case.\n  if (label === undefined && !ariaLabel && !props['aria-labelledby'] && !vertical) {\n    label = state.value.getChannelName(channel, locale);\n  }\n\n  // Show the value label by default if there is a visible label\n  if (showValueLabel == null) {\n    showValueLabel = !!label;\n  }\n\n  let {inputProps, thumbProps, trackProps, labelProps, outputProps} = useColorSlider(\n    {\n      ...props,\n      label,\n      'aria-label': ariaLabel,\n      trackRef,\n      inputRef\n    },\n    state\n  );\n\n  let {isFocusVisible} = useFocusVisible();\n  let [isFocused, setIsFocused] = useState(false);\n  let {focusProps} = useFocus({\n    isDisabled,\n    onFocusChange: setIsFocused\n  });\n\n  return (\n    <div\n      ref={domRef}\n      {...styleProps}\n      className={classNames(\n        styles,\n        {\n          'spectrum-ColorSlider-container--horizontal': !vertical,\n          'spectrum-ColorSlider-container--vertical': vertical\n        },\n        styleProps.className\n      )}>\n      {label && (\n        <div className={classNames(styles, 'spectrum-ColorSlider-labelContainer')}>\n          <Label {...labelProps}>{label}</Label>\n          {props.contextualHelp && (\n            <SlotProvider\n              slots={{\n                actionButton: {\n                  UNSAFE_className: classNames(styles, 'spectrum-ColorSlider-contextualHelp')\n                }\n              }}>\n              {props.contextualHelp}\n            </SlotProvider>\n          )}\n          {showValueLabel && (\n            <Label\n              elementType=\"span\"\n              UNSAFE_className={classNames(styles, 'spectrum-ColorSlider-valueLabel')}>\n              <output {...outputProps}>{state.value.formatChannelValue(channel, locale)}</output>\n            </Label>\n          )}\n        </div>\n      )}\n      <div\n        {...trackProps}\n        ref={trackRef}\n        className={classNames(styles, 'spectrum-ColorSlider', {\n          'is-disabled': isDisabled,\n          'spectrum-ColorSlider--vertical': vertical\n        })}>\n        <ColorThumb\n          value={state.getDisplayColor()}\n          isFocused={isFocused && isFocusVisible}\n          isDisabled={isDisabled}\n          isDragging={state.isThumbDragging(0)}\n          containerRef={trackRef}\n          className={classNames(styles, 'spectrum-ColorSlider-handle')}\n          {...thumbProps}>\n          <input\n            {...inputProps}\n            {...focusProps}\n            ref={inputRef}\n            className={classNames(styles, 'spectrum-ColorSlider-slider')}\n          />\n        </ColorThumb>\n      </div>\n    </div>\n  );\n});\n"],"names":[],"version":3,"file":"ColorSlider.mjs.map"}

package/dist/private/color/ColorSwatch.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA8BM,MAAM,0DAA6B,CAAA,GAAA,0BAAY,EAA0C;AAKzF,MAAM,0DAAc,CAAA,GAAA,uBAAS,EAAE,SAAS,YAAY,KAA+B,EAAE,GAA2B;IACrH,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,CAAC,OAAO,OAAO,GAAG,CAAA,GAAA,+CAAc,EAAE,OAAO,QAAQ,CAAA,GAAA,wDAAiB;IAClE,IAAI,oBAAC,gBAAgB,SAAE,KAAK,EAAC,GAAG,CAAA,GAAA,6CAAa,EAAE;IAC/C,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,uCAAY,EAAE;IACjC,IAAI,MAAM,CAAA,GAAA,uBAAS,EAAE;IACrB,IAAI,QACF,OAAO,KAAK,QAAQ,eACpB,WAAW,KAAK,YAAY,WAC7B,GAAG;IAEJ,IAAI,uBACF,0DAAC;QACE,GAAG,gBAAgB;QACnB,GAAG,UAAU;QACd,KAAK;QACL,OAAO;YACL,GAAG,WAAW,KAAK;YACnB,oFAAoF;YACpF,YAAY,MAAM,eAAe,CAAC,WAAW,IACzC,CAAC,gBAAgB,EAAE,MAAM,EAAE,EAAE,MAAM,4EAA4E,CAAC,GAEhH;QACN;QACA,WAAW,WAAW,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAuB/B;kBAAC;sBAAM;QAAQ;;IAGtB,+DAA+D;IAC/D,IAAI,KACF,OAAO,IAAI,UAAU,CAAC,QAAQ,OAAO;IAGvC,OAAO;AACT","sources":["packages/@adobe/react-spectrum/src/color/ColorSwatch.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 {AriaColorSwatchProps, useColorSwatch} from 'react-aria/useColorSwatch';\n\nimport {Color} from 'react-stately/Color';\nimport {ColorSwatchContext} from 'react-aria-components/ColorSwatch';\nimport {DOMRef, StyleProps} from '@react-types/shared';\nimport React, {createContext, forwardRef, JSX, ReactElement, useContext} from 'react';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSwatchProps extends AriaColorSwatchProps, StyleProps {\n  /**\n   * The size of the ColorSwatch.\n   * @default \"M\"\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the ColorSwatch.\n   * @default \"default\"\n   */\n  rounding?: 'default' | 'none' | 'full'\n}\n\ninterface SpectrumColorSwatchContextValue extends Pick<SpectrumColorSwatchProps, 'size' | 'rounding'> {\n  useWrapper: (swatch: ReactElement, color: Color, rounding: SpectrumColorSwatchProps['rounding']) => JSX.Element\n}\n\nexport const SpectrumColorSwatchContext = createContext<SpectrumColorSwatchContextValue | null>(null);\n\n/**\n * A ColorSwatch displays a preview of a selected color.\n */\nexport const ColorSwatch = forwardRef(function ColorSwatch(props: SpectrumColorSwatchProps, ref: DOMRef<HTMLDivElement>): JSX.Element {\n  let domRef = useDOMRef(ref);\n  [props, domRef] = useContextProps(props, domRef, ColorSwatchContext);\n  let {colorSwatchProps, color} = useColorSwatch(props);\n  let {styleProps} = useStyleProps(props);\n  let ctx = useContext(SpectrumColorSwatchContext);\n  let {\n    size = ctx?.size || 'M',\n    rounding = ctx?.rounding || 'default'\n  } = props;\n\n  let swatch = (\n    <div\n      {...colorSwatchProps}\n      {...styleProps}\n      ref={domRef}\n      style={{\n        ...styleProps.style,\n        // TODO: should there be a distinction between transparent and no value (e.g. null)?\n        background: color.getChannelValue('alpha') > 0\n          ? `linear-gradient(${color}, ${color}), repeating-conic-gradient(#e6e6e6 0% 25%, white 0% 50%) 0% 50% / 16px 16px`\n          // Red slash to indicate there is no selected color.\n          : 'linear-gradient(to bottom right, transparent calc(50% - 2px), var(--spectrum-red-900) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) no-repeat'\n      }}\n      className={styleProps.className + style({\n        size: {\n          size: {\n            XS: 4,\n            S: 6,\n            M: 8,\n            L: 10\n          }\n        },\n        borderRadius: {\n          rounding: {\n            default: 'default',\n            none: 'none',\n            full: 'full'\n          }\n        },\n        // Trick to create a partially transparent color from a variable.\n        // Ideally we'd use relative color syntax for this but it's not in Firefox yet.\n        borderColor: '[color-mix(in srgb, var(--spectrum-gray-900), transparent 49%)]',\n        borderWidth: 1,\n        borderStyle: 'solid',\n        boxSizing: 'border-box',\n        forcedColorAdjust: 'none'\n      })({size, rounding})} />\n  );\n\n  // ColorSwatchPicker needs to wrap the swatch in a ListBoxItem.\n  if (ctx) {\n    return ctx.useWrapper(swatch, color, rounding);\n  }\n\n  return swatch;\n});\n"],"names":[],"version":3,"file":"ColorSwatch.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AAuCM,MAAM,0DAA6B,CAAA,GAAA,0BAAY,EACpD;AAMK,MAAM,0DAAc,CAAA,GAAA,uBAAS,EAAE,SAAS,YAC7C,KAA+B,EAC/B,GAA2B;IAE3B,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,CAAC,OAAO,OAAO,GAAG,CAAA,GAAA,+CAAc,EAAE,OAAO,QAAQ,CAAA,GAAA,wDAAiB;IAClE,IAAI,oBAAC,gBAAgB,SAAE,KAAK,EAAC,GAAG,CAAA,GAAA,6CAAa,EAAE;IAC/C,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,uCAAY,EAAE;IACjC,IAAI,MAAM,CAAA,GAAA,uBAAS,EAAE;IACrB,IAAI,QAAC,OAAO,KAAK,QAAQ,eAAK,WAAW,KAAK,YAAY,WAAU,GAAG;IAEvE,IAAI,uBACF,0DAAC;QACE,GAAG,gBAAgB;QACnB,GAAG,UAAU;QACd,KAAK;QACL,OAAO;YACL,GAAG,WAAW,KAAK;YACnB,oFAAoF;YACpF,YACE,MAAM,eAAe,CAAC,WAAW,IAC7B,CAAC,gBAAgB,EAAE,MAAM,EAAE,EAAE,MAAM,4EAA4E,CAAC,GAEhH;QACR;QACA,WACE,WAAW,SAAS,GACpB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAuBG;kBAAC;sBAAM;QAAQ;;IAKxB,+DAA+D;IAC/D,IAAI,KACF,OAAO,IAAI,UAAU,CAAC,QAAQ,OAAO;IAGvC,OAAO;AACT","sources":["packages/@adobe/react-spectrum/src/color/ColorSwatch.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 {AriaColorSwatchProps, useColorSwatch} from 'react-aria/useColorSwatch';\n\nimport {Color} from 'react-stately/Color';\nimport {ColorSwatchContext} from 'react-aria-components/ColorSwatch';\nimport {DOMRef, StyleProps} from '@react-types/shared';\nimport React, {createContext, forwardRef, JSX, ReactElement, useContext} from 'react';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSwatchProps extends AriaColorSwatchProps, StyleProps {\n  /**\n   * The size of the ColorSwatch.\n   *\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L';\n  /**\n   * The corner rounding of the ColorSwatch.\n   *\n   * @default 'default'\n   */\n  rounding?: 'default' | 'none' | 'full';\n}\n\ninterface SpectrumColorSwatchContextValue extends Pick<\n  SpectrumColorSwatchProps,\n  'size' | 'rounding'\n> {\n  useWrapper: (\n    swatch: ReactElement,\n    color: Color,\n    rounding: SpectrumColorSwatchProps['rounding']\n  ) => JSX.Element;\n}\n\nexport const SpectrumColorSwatchContext = createContext<SpectrumColorSwatchContextValue | null>(\n  null\n);\n\n/**\n * A ColorSwatch displays a preview of a selected color.\n */\nexport const ColorSwatch = forwardRef(function ColorSwatch(\n  props: SpectrumColorSwatchProps,\n  ref: DOMRef<HTMLDivElement>\n): JSX.Element {\n  let domRef = useDOMRef(ref);\n  [props, domRef] = useContextProps(props, domRef, ColorSwatchContext);\n  let {colorSwatchProps, color} = useColorSwatch(props);\n  let {styleProps} = useStyleProps(props);\n  let ctx = useContext(SpectrumColorSwatchContext);\n  let {size = ctx?.size || 'M', rounding = ctx?.rounding || 'default'} = props;\n\n  let swatch = (\n    <div\n      {...colorSwatchProps}\n      {...styleProps}\n      ref={domRef}\n      style={{\n        ...styleProps.style,\n        // TODO: should there be a distinction between transparent and no value (e.g. null)?\n        background:\n          color.getChannelValue('alpha') > 0\n            ? `linear-gradient(${color}, ${color}), repeating-conic-gradient(#e6e6e6 0% 25%, white 0% 50%) 0% 50% / 16px 16px`\n            : // Red slash to indicate there is no selected color.\n              'linear-gradient(to bottom right, transparent calc(50% - 2px), var(--spectrum-red-900) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) no-repeat'\n      }}\n      className={\n        styleProps.className +\n        style({\n          size: {\n            size: {\n              XS: 4,\n              S: 6,\n              M: 8,\n              L: 10\n            }\n          },\n          borderRadius: {\n            rounding: {\n              default: 'default',\n              none: 'none',\n              full: 'full'\n            }\n          },\n          // Trick to create a partially transparent color from a variable.\n          // Ideally we'd use relative color syntax for this but it's not in Firefox yet.\n          borderColor: '[color-mix(in srgb, var(--spectrum-gray-900), transparent 49%)]',\n          borderWidth: 1,\n          borderStyle: 'solid',\n          boxSizing: 'border-box',\n          forcedColorAdjust: 'none'\n        })({size, rounding})\n      }\n    />\n  );\n\n  // ColorSwatchPicker needs to wrap the swatch in a ListBoxItem.\n  if (ctx) {\n    return ctx.useWrapper(swatch, color, rounding);\n  }\n\n  return swatch;\n});\n"],"names":[],"version":3,"file":"ColorSwatch.cjs.map"}

package/dist/private/color/ColorSwatch.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA8BM,MAAM,0DAA6B,CAAA,GAAA,oBAAY,EAA0C;AAKzF,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAAY,KAA+B,EAAE,GAA2B;IACrH,IAAI,SAAS,CAAA,GAAA,yCAAQ,EAAE;IACvB,CAAC,OAAO,OAAO,GAAG,CAAA,GAAA,sBAAc,EAAE,OAAO,QAAQ,CAAA,GAAA,yBAAiB;IAClE,IAAI,oBAAC,gBAAgB,SAAE,KAAK,EAAC,GAAG,CAAA,GAAA,qBAAa,EAAE;IAC/C,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,yCAAY,EAAE;IACjC,IAAI,MAAM,CAAA,GAAA,iBAAS,EAAE;IACrB,IAAI,QACF,OAAO,CAAA,gBAAA,0BAAA,IAAK,IAAI,KAAI,eACpB,WAAW,CAAA,gBAAA,0BAAA,IAAK,QAAQ,KAAI,WAC7B,GAAG;IAEJ,IAAI,uBACF,gCAAC;QACE,GAAG,gBAAgB;QACnB,GAAG,UAAU;QACd,KAAK;QACL,OAAO;YACL,GAAG,WAAW,KAAK;YACnB,oFAAoF;YACpF,YAAY,MAAM,eAAe,CAAC,WAAW,IACzC,CAAC,gBAAgB,EAAE,MAAM,EAAE,EAAE,MAAM,4EAA4E,CAAC,GAEhH;QACN;QACA,WAAW,WAAW,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAuB/B;kBAAC;sBAAM;QAAQ;;IAGtB,+DAA+D;IAC/D,IAAI,KACF,OAAO,IAAI,UAAU,CAAC,QAAQ,OAAO;IAGvC,OAAO;AACT","sources":["packages/@adobe/react-spectrum/src/color/ColorSwatch.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 {AriaColorSwatchProps, useColorSwatch} from 'react-aria/useColorSwatch';\n\nimport {Color} from 'react-stately/Color';\nimport {ColorSwatchContext} from 'react-aria-components/ColorSwatch';\nimport {DOMRef, StyleProps} from '@react-types/shared';\nimport React, {createContext, forwardRef, JSX, ReactElement, useContext} from 'react';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSwatchProps extends AriaColorSwatchProps, StyleProps {\n  /**\n   * The size of the ColorSwatch.\n   * @default \"M\"\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the ColorSwatch.\n   * @default \"default\"\n   */\n  rounding?: 'default' | 'none' | 'full'\n}\n\ninterface SpectrumColorSwatchContextValue extends Pick<SpectrumColorSwatchProps, 'size' | 'rounding'> {\n  useWrapper: (swatch: ReactElement, color: Color, rounding: SpectrumColorSwatchProps['rounding']) => JSX.Element\n}\n\nexport const SpectrumColorSwatchContext = createContext<SpectrumColorSwatchContextValue | null>(null);\n\n/**\n * A ColorSwatch displays a preview of a selected color.\n */\nexport const ColorSwatch = forwardRef(function ColorSwatch(props: SpectrumColorSwatchProps, ref: DOMRef<HTMLDivElement>): JSX.Element {\n  let domRef = useDOMRef(ref);\n  [props, domRef] = useContextProps(props, domRef, ColorSwatchContext);\n  let {colorSwatchProps, color} = useColorSwatch(props);\n  let {styleProps} = useStyleProps(props);\n  let ctx = useContext(SpectrumColorSwatchContext);\n  let {\n    size = ctx?.size || 'M',\n    rounding = ctx?.rounding || 'default'\n  } = props;\n\n  let swatch = (\n    <div\n      {...colorSwatchProps}\n      {...styleProps}\n      ref={domRef}\n      style={{\n        ...styleProps.style,\n        // TODO: should there be a distinction between transparent and no value (e.g. null)?\n        background: color.getChannelValue('alpha') > 0\n          ? `linear-gradient(${color}, ${color}), repeating-conic-gradient(#e6e6e6 0% 25%, white 0% 50%) 0% 50% / 16px 16px`\n          // Red slash to indicate there is no selected color.\n          : 'linear-gradient(to bottom right, transparent calc(50% - 2px), var(--spectrum-red-900) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) no-repeat'\n      }}\n      className={styleProps.className + style({\n        size: {\n          size: {\n            XS: 4,\n            S: 6,\n            M: 8,\n            L: 10\n          }\n        },\n        borderRadius: {\n          rounding: {\n            default: 'default',\n            none: 'none',\n            full: 'full'\n          }\n        },\n        // Trick to create a partially transparent color from a variable.\n        // Ideally we'd use relative color syntax for this but it's not in Firefox yet.\n        borderColor: '[color-mix(in srgb, var(--spectrum-gray-900), transparent 49%)]',\n        borderWidth: 1,\n        borderStyle: 'solid',\n        boxSizing: 'border-box',\n        forcedColorAdjust: 'none'\n      })({size, rounding})} />\n  );\n\n  // ColorSwatchPicker needs to wrap the swatch in a ListBoxItem.\n  if (ctx) {\n    return ctx.useWrapper(swatch, color, rounding);\n  }\n\n  return swatch;\n});\n"],"names":[],"version":3,"file":"ColorSwatch.js.map"}
+{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AAuCM,MAAM,0DAA6B,CAAA,GAAA,oBAAY,EACpD;AAMK,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAC7C,KAA+B,EAC/B,GAA2B;IAE3B,IAAI,SAAS,CAAA,GAAA,yCAAQ,EAAE;IACvB,CAAC,OAAO,OAAO,GAAG,CAAA,GAAA,sBAAc,EAAE,OAAO,QAAQ,CAAA,GAAA,yBAAiB;IAClE,IAAI,oBAAC,gBAAgB,SAAE,KAAK,EAAC,GAAG,CAAA,GAAA,qBAAa,EAAE;IAC/C,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,yCAAY,EAAE;IACjC,IAAI,MAAM,CAAA,GAAA,iBAAS,EAAE;IACrB,IAAI,QAAC,OAAO,CAAA,gBAAA,0BAAA,IAAK,IAAI,KAAI,eAAK,WAAW,CAAA,gBAAA,0BAAA,IAAK,QAAQ,KAAI,WAAU,GAAG;IAEvE,IAAI,uBACF,gCAAC;QACE,GAAG,gBAAgB;QACnB,GAAG,UAAU;QACd,KAAK;QACL,OAAO;YACL,GAAG,WAAW,KAAK;YACnB,oFAAoF;YACpF,YACE,MAAM,eAAe,CAAC,WAAW,IAC7B,CAAC,gBAAgB,EAAE,MAAM,EAAE,EAAE,MAAM,4EAA4E,CAAC,GAEhH;QACR;QACA,WACE,WAAW,SAAS,GACpB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAuBG;kBAAC;sBAAM;QAAQ;;IAKxB,+DAA+D;IAC/D,IAAI,KACF,OAAO,IAAI,UAAU,CAAC,QAAQ,OAAO;IAGvC,OAAO;AACT","sources":["packages/@adobe/react-spectrum/src/color/ColorSwatch.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 {AriaColorSwatchProps, useColorSwatch} from 'react-aria/useColorSwatch';\n\nimport {Color} from 'react-stately/Color';\nimport {ColorSwatchContext} from 'react-aria-components/ColorSwatch';\nimport {DOMRef, StyleProps} from '@react-types/shared';\nimport React, {createContext, forwardRef, JSX, ReactElement, useContext} from 'react';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSwatchProps extends AriaColorSwatchProps, StyleProps {\n  /**\n   * The size of the ColorSwatch.\n   *\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L';\n  /**\n   * The corner rounding of the ColorSwatch.\n   *\n   * @default 'default'\n   */\n  rounding?: 'default' | 'none' | 'full';\n}\n\ninterface SpectrumColorSwatchContextValue extends Pick<\n  SpectrumColorSwatchProps,\n  'size' | 'rounding'\n> {\n  useWrapper: (\n    swatch: ReactElement,\n    color: Color,\n    rounding: SpectrumColorSwatchProps['rounding']\n  ) => JSX.Element;\n}\n\nexport const SpectrumColorSwatchContext = createContext<SpectrumColorSwatchContextValue | null>(\n  null\n);\n\n/**\n * A ColorSwatch displays a preview of a selected color.\n */\nexport const ColorSwatch = forwardRef(function ColorSwatch(\n  props: SpectrumColorSwatchProps,\n  ref: DOMRef<HTMLDivElement>\n): JSX.Element {\n  let domRef = useDOMRef(ref);\n  [props, domRef] = useContextProps(props, domRef, ColorSwatchContext);\n  let {colorSwatchProps, color} = useColorSwatch(props);\n  let {styleProps} = useStyleProps(props);\n  let ctx = useContext(SpectrumColorSwatchContext);\n  let {size = ctx?.size || 'M', rounding = ctx?.rounding || 'default'} = props;\n\n  let swatch = (\n    <div\n      {...colorSwatchProps}\n      {...styleProps}\n      ref={domRef}\n      style={{\n        ...styleProps.style,\n        // TODO: should there be a distinction between transparent and no value (e.g. null)?\n        background:\n          color.getChannelValue('alpha') > 0\n            ? `linear-gradient(${color}, ${color}), repeating-conic-gradient(#e6e6e6 0% 25%, white 0% 50%) 0% 50% / 16px 16px`\n            : // Red slash to indicate there is no selected color.\n              'linear-gradient(to bottom right, transparent calc(50% - 2px), var(--spectrum-red-900) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) no-repeat'\n      }}\n      className={\n        styleProps.className +\n        style({\n          size: {\n            size: {\n              XS: 4,\n              S: 6,\n              M: 8,\n              L: 10\n            }\n          },\n          borderRadius: {\n            rounding: {\n              default: 'default',\n              none: 'none',\n              full: 'full'\n            }\n          },\n          // Trick to create a partially transparent color from a variable.\n          // Ideally we'd use relative color syntax for this but it's not in Firefox yet.\n          borderColor: '[color-mix(in srgb, var(--spectrum-gray-900), transparent 49%)]',\n          borderWidth: 1,\n          borderStyle: 'solid',\n          boxSizing: 'border-box',\n          forcedColorAdjust: 'none'\n        })({size, rounding})\n      }\n    />\n  );\n\n  // ColorSwatchPicker needs to wrap the swatch in a ListBoxItem.\n  if (ctx) {\n    return ctx.useWrapper(swatch, color, rounding);\n  }\n\n  return swatch;\n});\n"],"names":[],"version":3,"file":"ColorSwatch.js.map"}

package/dist/private/color/ColorSwatch.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA8BM,MAAM,0DAA6B,CAAA,GAAA,oBAAY,EAA0C;AAKzF,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAAY,KAA+B,EAAE,GAA2B;IACrH,IAAI,SAAS,CAAA,GAAA,yCAAQ,EAAE;IACvB,CAAC,OAAO,OAAO,GAAG,CAAA,GAAA,sBAAc,EAAE,OAAO,QAAQ,CAAA,GAAA,yBAAiB;IAClE,IAAI,oBAAC,gBAAgB,SAAE,KAAK,EAAC,GAAG,CAAA,GAAA,qBAAa,EAAE;IAC/C,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,yCAAY,EAAE;IACjC,IAAI,MAAM,CAAA,GAAA,iBAAS,EAAE;IACrB,IAAI,QACF,OAAO,KAAK,QAAQ,eACpB,WAAW,KAAK,YAAY,WAC7B,GAAG;IAEJ,IAAI,uBACF,gCAAC;QACE,GAAG,gBAAgB;QACnB,GAAG,UAAU;QACd,KAAK;QACL,OAAO;YACL,GAAG,WAAW,KAAK;YACnB,oFAAoF;YACpF,YAAY,MAAM,eAAe,CAAC,WAAW,IACzC,CAAC,gBAAgB,EAAE,MAAM,EAAE,EAAE,MAAM,4EAA4E,CAAC,GAEhH;QACN;QACA,WAAW,WAAW,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAuB/B;kBAAC;sBAAM;QAAQ;;IAGtB,+DAA+D;IAC/D,IAAI,KACF,OAAO,IAAI,UAAU,CAAC,QAAQ,OAAO;IAGvC,OAAO;AACT","sources":["packages/@adobe/react-spectrum/src/color/ColorSwatch.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 {AriaColorSwatchProps, useColorSwatch} from 'react-aria/useColorSwatch';\n\nimport {Color} from 'react-stately/Color';\nimport {ColorSwatchContext} from 'react-aria-components/ColorSwatch';\nimport {DOMRef, StyleProps} from '@react-types/shared';\nimport React, {createContext, forwardRef, JSX, ReactElement, useContext} from 'react';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSwatchProps extends AriaColorSwatchProps, StyleProps {\n  /**\n   * The size of the ColorSwatch.\n   * @default \"M\"\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the ColorSwatch.\n   * @default \"default\"\n   */\n  rounding?: 'default' | 'none' | 'full'\n}\n\ninterface SpectrumColorSwatchContextValue extends Pick<SpectrumColorSwatchProps, 'size' | 'rounding'> {\n  useWrapper: (swatch: ReactElement, color: Color, rounding: SpectrumColorSwatchProps['rounding']) => JSX.Element\n}\n\nexport const SpectrumColorSwatchContext = createContext<SpectrumColorSwatchContextValue | null>(null);\n\n/**\n * A ColorSwatch displays a preview of a selected color.\n */\nexport const ColorSwatch = forwardRef(function ColorSwatch(props: SpectrumColorSwatchProps, ref: DOMRef<HTMLDivElement>): JSX.Element {\n  let domRef = useDOMRef(ref);\n  [props, domRef] = useContextProps(props, domRef, ColorSwatchContext);\n  let {colorSwatchProps, color} = useColorSwatch(props);\n  let {styleProps} = useStyleProps(props);\n  let ctx = useContext(SpectrumColorSwatchContext);\n  let {\n    size = ctx?.size || 'M',\n    rounding = ctx?.rounding || 'default'\n  } = props;\n\n  let swatch = (\n    <div\n      {...colorSwatchProps}\n      {...styleProps}\n      ref={domRef}\n      style={{\n        ...styleProps.style,\n        // TODO: should there be a distinction between transparent and no value (e.g. null)?\n        background: color.getChannelValue('alpha') > 0\n          ? `linear-gradient(${color}, ${color}), repeating-conic-gradient(#e6e6e6 0% 25%, white 0% 50%) 0% 50% / 16px 16px`\n          // Red slash to indicate there is no selected color.\n          : 'linear-gradient(to bottom right, transparent calc(50% - 2px), var(--spectrum-red-900) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) no-repeat'\n      }}\n      className={styleProps.className + style({\n        size: {\n          size: {\n            XS: 4,\n            S: 6,\n            M: 8,\n            L: 10\n          }\n        },\n        borderRadius: {\n          rounding: {\n            default: 'default',\n            none: 'none',\n            full: 'full'\n          }\n        },\n        // Trick to create a partially transparent color from a variable.\n        // Ideally we'd use relative color syntax for this but it's not in Firefox yet.\n        borderColor: '[color-mix(in srgb, var(--spectrum-gray-900), transparent 49%)]',\n        borderWidth: 1,\n        borderStyle: 'solid',\n        boxSizing: 'border-box',\n        forcedColorAdjust: 'none'\n      })({size, rounding})} />\n  );\n\n  // ColorSwatchPicker needs to wrap the swatch in a ListBoxItem.\n  if (ctx) {\n    return ctx.useWrapper(swatch, color, rounding);\n  }\n\n  return swatch;\n});\n"],"names":[],"version":3,"file":"ColorSwatch.mjs.map"}
+{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AAuCM,MAAM,0DAA6B,CAAA,GAAA,oBAAY,EACpD;AAMK,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAC7C,KAA+B,EAC/B,GAA2B;IAE3B,IAAI,SAAS,CAAA,GAAA,yCAAQ,EAAE;IACvB,CAAC,OAAO,OAAO,GAAG,CAAA,GAAA,sBAAc,EAAE,OAAO,QAAQ,CAAA,GAAA,yBAAiB;IAClE,IAAI,oBAAC,gBAAgB,SAAE,KAAK,EAAC,GAAG,CAAA,GAAA,qBAAa,EAAE;IAC/C,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,yCAAY,EAAE;IACjC,IAAI,MAAM,CAAA,GAAA,iBAAS,EAAE;IACrB,IAAI,QAAC,OAAO,KAAK,QAAQ,eAAK,WAAW,KAAK,YAAY,WAAU,GAAG;IAEvE,IAAI,uBACF,gCAAC;QACE,GAAG,gBAAgB;QACnB,GAAG,UAAU;QACd,KAAK;QACL,OAAO;YACL,GAAG,WAAW,KAAK;YACnB,oFAAoF;YACpF,YACE,MAAM,eAAe,CAAC,WAAW,IAC7B,CAAC,gBAAgB,EAAE,MAAM,EAAE,EAAE,MAAM,4EAA4E,CAAC,GAEhH;QACR;QACA,WACE,WAAW,SAAS,GACpB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAuBG;kBAAC;sBAAM;QAAQ;;IAKxB,+DAA+D;IAC/D,IAAI,KACF,OAAO,IAAI,UAAU,CAAC,QAAQ,OAAO;IAGvC,OAAO;AACT","sources":["packages/@adobe/react-spectrum/src/color/ColorSwatch.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 {AriaColorSwatchProps, useColorSwatch} from 'react-aria/useColorSwatch';\n\nimport {Color} from 'react-stately/Color';\nimport {ColorSwatchContext} from 'react-aria-components/ColorSwatch';\nimport {DOMRef, StyleProps} from '@react-types/shared';\nimport React, {createContext, forwardRef, JSX, ReactElement, useContext} from 'react';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSwatchProps extends AriaColorSwatchProps, StyleProps {\n  /**\n   * The size of the ColorSwatch.\n   *\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L';\n  /**\n   * The corner rounding of the ColorSwatch.\n   *\n   * @default 'default'\n   */\n  rounding?: 'default' | 'none' | 'full';\n}\n\ninterface SpectrumColorSwatchContextValue extends Pick<\n  SpectrumColorSwatchProps,\n  'size' | 'rounding'\n> {\n  useWrapper: (\n    swatch: ReactElement,\n    color: Color,\n    rounding: SpectrumColorSwatchProps['rounding']\n  ) => JSX.Element;\n}\n\nexport const SpectrumColorSwatchContext = createContext<SpectrumColorSwatchContextValue | null>(\n  null\n);\n\n/**\n * A ColorSwatch displays a preview of a selected color.\n */\nexport const ColorSwatch = forwardRef(function ColorSwatch(\n  props: SpectrumColorSwatchProps,\n  ref: DOMRef<HTMLDivElement>\n): JSX.Element {\n  let domRef = useDOMRef(ref);\n  [props, domRef] = useContextProps(props, domRef, ColorSwatchContext);\n  let {colorSwatchProps, color} = useColorSwatch(props);\n  let {styleProps} = useStyleProps(props);\n  let ctx = useContext(SpectrumColorSwatchContext);\n  let {size = ctx?.size || 'M', rounding = ctx?.rounding || 'default'} = props;\n\n  let swatch = (\n    <div\n      {...colorSwatchProps}\n      {...styleProps}\n      ref={domRef}\n      style={{\n        ...styleProps.style,\n        // TODO: should there be a distinction between transparent and no value (e.g. null)?\n        background:\n          color.getChannelValue('alpha') > 0\n            ? `linear-gradient(${color}, ${color}), repeating-conic-gradient(#e6e6e6 0% 25%, white 0% 50%) 0% 50% / 16px 16px`\n            : // Red slash to indicate there is no selected color.\n              'linear-gradient(to bottom right, transparent calc(50% - 2px), var(--spectrum-red-900) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) no-repeat'\n      }}\n      className={\n        styleProps.className +\n        style({\n          size: {\n            size: {\n              XS: 4,\n              S: 6,\n              M: 8,\n              L: 10\n            }\n          },\n          borderRadius: {\n            rounding: {\n              default: 'default',\n              none: 'none',\n              full: 'full'\n            }\n          },\n          // Trick to create a partially transparent color from a variable.\n          // Ideally we'd use relative color syntax for this but it's not in Firefox yet.\n          borderColor: '[color-mix(in srgb, var(--spectrum-gray-900), transparent 49%)]',\n          borderWidth: 1,\n          borderStyle: 'solid',\n          boxSizing: 'border-box',\n          forcedColorAdjust: 'none'\n        })({size, rounding})\n      }\n    />\n  );\n\n  // ColorSwatchPicker needs to wrap the swatch in a ListBoxItem.\n  if (ctx) {\n    return ctx.useWrapper(swatch, color, rounding);\n  }\n\n  return swatch;\n});\n"],"names":[],"version":3,"file":"ColorSwatch.mjs.map"}

package/dist/private/color/ColorSwatchPicker.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAsCM,MAAM,0DAAoB,CAAA,GAAA,uBAAS,EAAE,SAAS,kBAAkB,KAAqC,EAAE,GAA2B;IACvI,IAAI,WACF,UAAU,iBACV,OAAO,eACP,WAAW,QACX,GAAG,YACJ,GAAG;IACJ,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,uCAAY,EAAE;IACjC,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IAEvB,qBACE,0DAAC,CAAA,GAAA,6DAAoB;QAClB,GAAG,UAAU;QACd,OAAO,WAAW,KAAK;QACvB,KAAK;QACL,WAAW,WAAW,SAAS,GAAG;;;;;;;;;;;UAU/B;qBAAC;QAAO;qBACX,0DAAC,CAAA,GAAA,oDAAyB,EAAE,QAAQ;QAAC,OAAO;wBAAC;kBAAY;sBAAM;QAAQ;OACpE,MAAM,QAAQ;AAIvB;AAEA,SAAS,iCAAW,MAAoB,EAAE,KAAY,EAAE,QAA8C;IACpG,qBACE,0DAAC,CAAA,GAAA,iEAAwB;QACvB,OAAO;QACP,WAAW,CAAA,cAAe;;;;;;;;;;;;;;;;;;;;;;eAgBvB;gBAAC,GAAG,WAAW;0BAAE;YAAQ;OAC3B,CAAC,cAAC,UAAU,EAAC,iBAAM,sHACjB,QACA,4BACC,0DAAC;YACC,eAAA;YACA,WAAW;;;;;;;;;;;;;;;;;AAYvB","sources":["packages/@adobe/react-spectrum/src/color/ColorSwatchPicker.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  ColorSwatchPicker as AriaColorSwatchPicker,\n  ColorSwatchPickerItem as AriaColorSwatchPickerItem\n} from 'react-aria-components/ColorSwatchPicker';\n\nimport {Color} from 'react-stately/Color';\nimport {DOMRef, StyleProps, ValueBase} from '@react-types/shared';\nimport React, {forwardRef, ReactElement, ReactNode} from 'react';\nimport {SpectrumColorSwatchContext, SpectrumColorSwatchProps} from './ColorSwatch';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSwatchPickerProps extends ValueBase<string | Color, Color>, StyleProps {\n  /** The ColorSwatches within the ColorSwatchPicker. */\n  children: ReactNode,\n  /**\n   * The amount of padding between the swatches.\n   * @default \"regular\"\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /**\n   * The size of the color swatches.\n   * @default \"M\"\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the color swatches.\n   * @default \"none\"\n   */\n  rounding?: 'none' | 'default' | 'full'\n}\n\n/**\n * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.\n */\nexport const ColorSwatchPicker = forwardRef(function ColorSwatchPicker(props: SpectrumColorSwatchPickerProps, ref: DOMRef<HTMLDivElement>) {\n  let {\n    density = 'regular',\n    size = 'M',\n    rounding = 'none',\n    ...otherProps\n  } = props;\n  let {styleProps} = useStyleProps(props);\n  let domRef = useDOMRef(ref);\n\n  return (\n    <AriaColorSwatchPicker\n      {...otherProps}\n      style={styleProps.style}\n      ref={domRef}\n      className={styleProps.className + style({\n        display: 'flex',\n        flexWrap: 'wrap',\n        gap: {\n          density: {\n            compact: 0.5,\n            regular: 1,\n            spacious: 2\n          }\n        }\n      })({density})}>\n      <SpectrumColorSwatchContext.Provider value={{useWrapper, size, rounding}}>\n        {props.children}\n      </SpectrumColorSwatchContext.Provider>\n    </AriaColorSwatchPicker>\n  );\n});\n\nfunction useWrapper(swatch: ReactElement, color: Color, rounding: SpectrumColorSwatchProps['rounding']) {\n  return (\n    <AriaColorSwatchPickerItem\n      color={color}\n      className={renderProps => style({\n        outlineStyle: {\n          default: 'none',\n          isFocusVisible: 'solid'\n        },\n        outlineColor: 'focus-ring',\n        outlineWidth: 2,\n        outlineOffset: 2,\n        position: 'relative',\n        borderRadius: {\n          rounding: {\n            none: 'none',\n            default: 'default',\n            full: 'full'\n          }\n        }\n      })({...renderProps, rounding})}>\n      {({isSelected}) => (<>\n        {swatch}\n        {isSelected && (\n          <div\n            aria-hidden\n            className={style({\n              position: 'absolute',\n              pointerEvents: 'none',\n              inset: 0,\n              boxShadow: '[inset 0 0 0 2px var(--spectrum-gray-900), inset 0 0 0 4px var(--spectrum-gray-50)]',\n              forcedColorAdjust: 'none',\n              borderRadius: '[inherit]'\n            })()} />\n        )}\n      </>)}\n    </AriaColorSwatchPickerItem>\n  );\n}\n"],"names":[],"version":3,"file":"ColorSwatchPicker.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AA0CM,MAAM,0DAAoB,CAAA,GAAA,uBAAS,EAAE,SAAS,kBACnD,KAAqC,EACrC,GAA2B;IAE3B,IAAI,WAAC,UAAU,iBAAW,OAAO,eAAK,WAAW,QAAQ,GAAG,YAAW,GAAG;IAC1E,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,uCAAY,EAAE;IACjC,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IAEvB,qBACE,0DAAC,CAAA,GAAA,6DAAoB;QAClB,GAAG,UAAU;QACd,OAAO,WAAW,KAAK;QACvB,KAAK;QACL,WACE,WAAW,SAAS,GACpB;;;;;;;;;;;UAUG;qBAAC;QAAO;qBAEb,0DAAC,CAAA,GAAA,oDAAyB,EAAE,QAAQ;QAAC,OAAO;wBAAC;kBAAY;sBAAM;QAAQ;OACpE,MAAM,QAAQ;AAIvB;AAEA,SAAS,iCACP,MAAoB,EACpB,KAAY,EACZ,QAA8C;IAE9C,qBACE,0DAAC,CAAA,GAAA,iEAAwB;QACvB,OAAO;QACP,WAAW,CAAA,cACT;;;;;;;;;;;;;;;;;;;;;;eAgBG;gBAAC,GAAG,WAAW;0BAAE;YAAQ;OAE7B,CAAC,cAAC,UAAU,EAAC,iBACZ,sHACG,QACA,4BACC,0DAAC;YACC,eAAA;YACA,WAAW;;;;;;;;;;;;;;;;;AAezB","sources":["packages/@adobe/react-spectrum/src/color/ColorSwatchPicker.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  ColorSwatchPicker as AriaColorSwatchPicker,\n  ColorSwatchPickerItem as AriaColorSwatchPickerItem\n} from 'react-aria-components/ColorSwatchPicker';\n\nimport {Color} from 'react-stately/Color';\nimport {DOMRef, StyleProps, ValueBase} from '@react-types/shared';\nimport React, {forwardRef, ReactElement, ReactNode} from 'react';\nimport {SpectrumColorSwatchContext, SpectrumColorSwatchProps} from './ColorSwatch';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSwatchPickerProps\n  extends ValueBase<string | Color, Color>, StyleProps {\n  /** The ColorSwatches within the ColorSwatchPicker. */\n  children: ReactNode;\n  /**\n   * The amount of padding between the swatches.\n   *\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious';\n  /**\n   * The size of the color swatches.\n   *\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L';\n  /**\n   * The corner rounding of the color swatches.\n   *\n   * @default 'none'\n   */\n  rounding?: 'none' | 'default' | 'full';\n}\n\n/**\n * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.\n */\nexport const ColorSwatchPicker = forwardRef(function ColorSwatchPicker(\n  props: SpectrumColorSwatchPickerProps,\n  ref: DOMRef<HTMLDivElement>\n) {\n  let {density = 'regular', size = 'M', rounding = 'none', ...otherProps} = props;\n  let {styleProps} = useStyleProps(props);\n  let domRef = useDOMRef(ref);\n\n  return (\n    <AriaColorSwatchPicker\n      {...otherProps}\n      style={styleProps.style}\n      ref={domRef}\n      className={\n        styleProps.className +\n        style({\n          display: 'flex',\n          flexWrap: 'wrap',\n          gap: {\n            density: {\n              compact: 0.5,\n              regular: 1,\n              spacious: 2\n            }\n          }\n        })({density})\n      }>\n      <SpectrumColorSwatchContext.Provider value={{useWrapper, size, rounding}}>\n        {props.children}\n      </SpectrumColorSwatchContext.Provider>\n    </AriaColorSwatchPicker>\n  );\n});\n\nfunction useWrapper(\n  swatch: ReactElement,\n  color: Color,\n  rounding: SpectrumColorSwatchProps['rounding']\n) {\n  return (\n    <AriaColorSwatchPickerItem\n      color={color}\n      className={renderProps =>\n        style({\n          outlineStyle: {\n            default: 'none',\n            isFocusVisible: 'solid'\n          },\n          outlineColor: 'focus-ring',\n          outlineWidth: 2,\n          outlineOffset: 2,\n          position: 'relative',\n          borderRadius: {\n            rounding: {\n              none: 'none',\n              default: 'default',\n              full: 'full'\n            }\n          }\n        })({...renderProps, rounding})\n      }>\n      {({isSelected}) => (\n        <>\n          {swatch}\n          {isSelected && (\n            <div\n              aria-hidden\n              className={style({\n                position: 'absolute',\n                pointerEvents: 'none',\n                inset: 0,\n                boxShadow:\n                  '[inset 0 0 0 2px var(--spectrum-gray-900), inset 0 0 0 4px var(--spectrum-gray-50)]',\n                forcedColorAdjust: 'none',\n                borderRadius: '[inherit]'\n              })()}\n            />\n          )}\n        </>\n      )}\n    </AriaColorSwatchPickerItem>\n  );\n}\n"],"names":[],"version":3,"file":"ColorSwatchPicker.cjs.map"}

package/dist/private/color/ColorSwatchPicker.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAsCM,MAAM,0DAAoB,CAAA,GAAA,iBAAS,EAAE,SAAS,kBAAkB,KAAqC,EAAE,GAA2B;IACvI,IAAI,WACF,UAAU,iBACV,OAAO,eACP,WAAW,QACX,GAAG,YACJ,GAAG;IACJ,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,yCAAY,EAAE;IACjC,IAAI,SAAS,CAAA,GAAA,yCAAQ,EAAE;IAEvB,qBACE,gCAAC,CAAA,GAAA,wBAAoB;QAClB,GAAG,UAAU;QACd,OAAO,WAAW,KAAK;QACvB,KAAK;QACL,WAAW,WAAW,SAAS,GAAG;;;;;;;;;;;UAU/B;qBAAC;QAAO;qBACX,gCAAC,CAAA,GAAA,yCAAyB,EAAE,QAAQ;QAAC,OAAO;wBAAC;kBAAY;sBAAM;QAAQ;OACpE,MAAM,QAAQ;AAIvB;AAEA,SAAS,iCAAW,MAAoB,EAAE,KAAY,EAAE,QAA8C;IACpG,qBACE,gCAAC,CAAA,GAAA,4BAAwB;QACvB,OAAO;QACP,WAAW,CAAA,cAAe;;;;;;;;;;;;;;;;;;;;;;eAgBvB;gBAAC,GAAG,WAAW;0BAAE;YAAQ;OAC3B,CAAC,cAAC,UAAU,EAAC,iBAAM,kEACjB,QACA,4BACC,gCAAC;YACC,eAAA;YACA,WAAW;;;;;;;;;;;;;;;;;AAYvB","sources":["packages/@adobe/react-spectrum/src/color/ColorSwatchPicker.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  ColorSwatchPicker as AriaColorSwatchPicker,\n  ColorSwatchPickerItem as AriaColorSwatchPickerItem\n} from 'react-aria-components/ColorSwatchPicker';\n\nimport {Color} from 'react-stately/Color';\nimport {DOMRef, StyleProps, ValueBase} from '@react-types/shared';\nimport React, {forwardRef, ReactElement, ReactNode} from 'react';\nimport {SpectrumColorSwatchContext, SpectrumColorSwatchProps} from './ColorSwatch';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSwatchPickerProps extends ValueBase<string | Color, Color>, StyleProps {\n  /** The ColorSwatches within the ColorSwatchPicker. */\n  children: ReactNode,\n  /**\n   * The amount of padding between the swatches.\n   * @default \"regular\"\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /**\n   * The size of the color swatches.\n   * @default \"M\"\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the color swatches.\n   * @default \"none\"\n   */\n  rounding?: 'none' | 'default' | 'full'\n}\n\n/**\n * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.\n */\nexport const ColorSwatchPicker = forwardRef(function ColorSwatchPicker(props: SpectrumColorSwatchPickerProps, ref: DOMRef<HTMLDivElement>) {\n  let {\n    density = 'regular',\n    size = 'M',\n    rounding = 'none',\n    ...otherProps\n  } = props;\n  let {styleProps} = useStyleProps(props);\n  let domRef = useDOMRef(ref);\n\n  return (\n    <AriaColorSwatchPicker\n      {...otherProps}\n      style={styleProps.style}\n      ref={domRef}\n      className={styleProps.className + style({\n        display: 'flex',\n        flexWrap: 'wrap',\n        gap: {\n          density: {\n            compact: 0.5,\n            regular: 1,\n            spacious: 2\n          }\n        }\n      })({density})}>\n      <SpectrumColorSwatchContext.Provider value={{useWrapper, size, rounding}}>\n        {props.children}\n      </SpectrumColorSwatchContext.Provider>\n    </AriaColorSwatchPicker>\n  );\n});\n\nfunction useWrapper(swatch: ReactElement, color: Color, rounding: SpectrumColorSwatchProps['rounding']) {\n  return (\n    <AriaColorSwatchPickerItem\n      color={color}\n      className={renderProps => style({\n        outlineStyle: {\n          default: 'none',\n          isFocusVisible: 'solid'\n        },\n        outlineColor: 'focus-ring',\n        outlineWidth: 2,\n        outlineOffset: 2,\n        position: 'relative',\n        borderRadius: {\n          rounding: {\n            none: 'none',\n            default: 'default',\n            full: 'full'\n          }\n        }\n      })({...renderProps, rounding})}>\n      {({isSelected}) => (<>\n        {swatch}\n        {isSelected && (\n          <div\n            aria-hidden\n            className={style({\n              position: 'absolute',\n              pointerEvents: 'none',\n              inset: 0,\n              boxShadow: '[inset 0 0 0 2px var(--spectrum-gray-900), inset 0 0 0 4px var(--spectrum-gray-50)]',\n              forcedColorAdjust: 'none',\n              borderRadius: '[inherit]'\n            })()} />\n        )}\n      </>)}\n    </AriaColorSwatchPickerItem>\n  );\n}\n"],"names":[],"version":3,"file":"ColorSwatchPicker.js.map"}
+{"mappings":";;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AA0CM,MAAM,0DAAoB,CAAA,GAAA,iBAAS,EAAE,SAAS,kBACnD,KAAqC,EACrC,GAA2B;IAE3B,IAAI,WAAC,UAAU,iBAAW,OAAO,eAAK,WAAW,QAAQ,GAAG,YAAW,GAAG;IAC1E,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,yCAAY,EAAE;IACjC,IAAI,SAAS,CAAA,GAAA,yCAAQ,EAAE;IAEvB,qBACE,gCAAC,CAAA,GAAA,wBAAoB;QAClB,GAAG,UAAU;QACd,OAAO,WAAW,KAAK;QACvB,KAAK;QACL,WACE,WAAW,SAAS,GACpB;;;;;;;;;;;UAUG;qBAAC;QAAO;qBAEb,gCAAC,CAAA,GAAA,yCAAyB,EAAE,QAAQ;QAAC,OAAO;wBAAC;kBAAY;sBAAM;QAAQ;OACpE,MAAM,QAAQ;AAIvB;AAEA,SAAS,iCACP,MAAoB,EACpB,KAAY,EACZ,QAA8C;IAE9C,qBACE,gCAAC,CAAA,GAAA,4BAAwB;QACvB,OAAO;QACP,WAAW,CAAA,cACT;;;;;;;;;;;;;;;;;;;;;;eAgBG;gBAAC,GAAG,WAAW;0BAAE;YAAQ;OAE7B,CAAC,cAAC,UAAU,EAAC,iBACZ,kEACG,QACA,4BACC,gCAAC;YACC,eAAA;YACA,WAAW;;;;;;;;;;;;;;;;;AAezB","sources":["packages/@adobe/react-spectrum/src/color/ColorSwatchPicker.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  ColorSwatchPicker as AriaColorSwatchPicker,\n  ColorSwatchPickerItem as AriaColorSwatchPickerItem\n} from 'react-aria-components/ColorSwatchPicker';\n\nimport {Color} from 'react-stately/Color';\nimport {DOMRef, StyleProps, ValueBase} from '@react-types/shared';\nimport React, {forwardRef, ReactElement, ReactNode} from 'react';\nimport {SpectrumColorSwatchContext, SpectrumColorSwatchProps} from './ColorSwatch';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSwatchPickerProps\n  extends ValueBase<string | Color, Color>, StyleProps {\n  /** The ColorSwatches within the ColorSwatchPicker. */\n  children: ReactNode;\n  /**\n   * The amount of padding between the swatches.\n   *\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious';\n  /**\n   * The size of the color swatches.\n   *\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L';\n  /**\n   * The corner rounding of the color swatches.\n   *\n   * @default 'none'\n   */\n  rounding?: 'none' | 'default' | 'full';\n}\n\n/**\n * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.\n */\nexport const ColorSwatchPicker = forwardRef(function ColorSwatchPicker(\n  props: SpectrumColorSwatchPickerProps,\n  ref: DOMRef<HTMLDivElement>\n) {\n  let {density = 'regular', size = 'M', rounding = 'none', ...otherProps} = props;\n  let {styleProps} = useStyleProps(props);\n  let domRef = useDOMRef(ref);\n\n  return (\n    <AriaColorSwatchPicker\n      {...otherProps}\n      style={styleProps.style}\n      ref={domRef}\n      className={\n        styleProps.className +\n        style({\n          display: 'flex',\n          flexWrap: 'wrap',\n          gap: {\n            density: {\n              compact: 0.5,\n              regular: 1,\n              spacious: 2\n            }\n          }\n        })({density})\n      }>\n      <SpectrumColorSwatchContext.Provider value={{useWrapper, size, rounding}}>\n        {props.children}\n      </SpectrumColorSwatchContext.Provider>\n    </AriaColorSwatchPicker>\n  );\n});\n\nfunction useWrapper(\n  swatch: ReactElement,\n  color: Color,\n  rounding: SpectrumColorSwatchProps['rounding']\n) {\n  return (\n    <AriaColorSwatchPickerItem\n      color={color}\n      className={renderProps =>\n        style({\n          outlineStyle: {\n            default: 'none',\n            isFocusVisible: 'solid'\n          },\n          outlineColor: 'focus-ring',\n          outlineWidth: 2,\n          outlineOffset: 2,\n          position: 'relative',\n          borderRadius: {\n            rounding: {\n              none: 'none',\n              default: 'default',\n              full: 'full'\n            }\n          }\n        })({...renderProps, rounding})\n      }>\n      {({isSelected}) => (\n        <>\n          {swatch}\n          {isSelected && (\n            <div\n              aria-hidden\n              className={style({\n                position: 'absolute',\n                pointerEvents: 'none',\n                inset: 0,\n                boxShadow:\n                  '[inset 0 0 0 2px var(--spectrum-gray-900), inset 0 0 0 4px var(--spectrum-gray-50)]',\n                forcedColorAdjust: 'none',\n                borderRadius: '[inherit]'\n              })()}\n            />\n          )}\n        </>\n      )}\n    </AriaColorSwatchPickerItem>\n  );\n}\n"],"names":[],"version":3,"file":"ColorSwatchPicker.js.map"}

package/dist/private/color/ColorSwatchPicker.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAsCM,MAAM,0DAAoB,CAAA,GAAA,iBAAS,EAAE,SAAS,kBAAkB,KAAqC,EAAE,GAA2B;IACvI,IAAI,WACF,UAAU,iBACV,OAAO,eACP,WAAW,QACX,GAAG,YACJ,GAAG;IACJ,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,yCAAY,EAAE;IACjC,IAAI,SAAS,CAAA,GAAA,yCAAQ,EAAE;IAEvB,qBACE,gCAAC,CAAA,GAAA,wBAAoB;QAClB,GAAG,UAAU;QACd,OAAO,WAAW,KAAK;QACvB,KAAK;QACL,WAAW,WAAW,SAAS,GAAG;;;;;;;;;;;UAU/B;qBAAC;QAAO;qBACX,gCAAC,CAAA,GAAA,yCAAyB,EAAE,QAAQ;QAAC,OAAO;wBAAC;kBAAY;sBAAM;QAAQ;OACpE,MAAM,QAAQ;AAIvB;AAEA,SAAS,iCAAW,MAAoB,EAAE,KAAY,EAAE,QAA8C;IACpG,qBACE,gCAAC,CAAA,GAAA,4BAAwB;QACvB,OAAO;QACP,WAAW,CAAA,cAAe;;;;;;;;;;;;;;;;;;;;;;eAgBvB;gBAAC,GAAG,WAAW;0BAAE;YAAQ;OAC3B,CAAC,cAAC,UAAU,EAAC,iBAAM,kEACjB,QACA,4BACC,gCAAC;YACC,eAAA;YACA,WAAW;;;;;;;;;;;;;;;;;AAYvB","sources":["packages/@adobe/react-spectrum/src/color/ColorSwatchPicker.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  ColorSwatchPicker as AriaColorSwatchPicker,\n  ColorSwatchPickerItem as AriaColorSwatchPickerItem\n} from 'react-aria-components/ColorSwatchPicker';\n\nimport {Color} from 'react-stately/Color';\nimport {DOMRef, StyleProps, ValueBase} from '@react-types/shared';\nimport React, {forwardRef, ReactElement, ReactNode} from 'react';\nimport {SpectrumColorSwatchContext, SpectrumColorSwatchProps} from './ColorSwatch';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSwatchPickerProps extends ValueBase<string | Color, Color>, StyleProps {\n  /** The ColorSwatches within the ColorSwatchPicker. */\n  children: ReactNode,\n  /**\n   * The amount of padding between the swatches.\n   * @default \"regular\"\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /**\n   * The size of the color swatches.\n   * @default \"M\"\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the color swatches.\n   * @default \"none\"\n   */\n  rounding?: 'none' | 'default' | 'full'\n}\n\n/**\n * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.\n */\nexport const ColorSwatchPicker = forwardRef(function ColorSwatchPicker(props: SpectrumColorSwatchPickerProps, ref: DOMRef<HTMLDivElement>) {\n  let {\n    density = 'regular',\n    size = 'M',\n    rounding = 'none',\n    ...otherProps\n  } = props;\n  let {styleProps} = useStyleProps(props);\n  let domRef = useDOMRef(ref);\n\n  return (\n    <AriaColorSwatchPicker\n      {...otherProps}\n      style={styleProps.style}\n      ref={domRef}\n      className={styleProps.className + style({\n        display: 'flex',\n        flexWrap: 'wrap',\n        gap: {\n          density: {\n            compact: 0.5,\n            regular: 1,\n            spacious: 2\n          }\n        }\n      })({density})}>\n      <SpectrumColorSwatchContext.Provider value={{useWrapper, size, rounding}}>\n        {props.children}\n      </SpectrumColorSwatchContext.Provider>\n    </AriaColorSwatchPicker>\n  );\n});\n\nfunction useWrapper(swatch: ReactElement, color: Color, rounding: SpectrumColorSwatchProps['rounding']) {\n  return (\n    <AriaColorSwatchPickerItem\n      color={color}\n      className={renderProps => style({\n        outlineStyle: {\n          default: 'none',\n          isFocusVisible: 'solid'\n        },\n        outlineColor: 'focus-ring',\n        outlineWidth: 2,\n        outlineOffset: 2,\n        position: 'relative',\n        borderRadius: {\n          rounding: {\n            none: 'none',\n            default: 'default',\n            full: 'full'\n          }\n        }\n      })({...renderProps, rounding})}>\n      {({isSelected}) => (<>\n        {swatch}\n        {isSelected && (\n          <div\n            aria-hidden\n            className={style({\n              position: 'absolute',\n              pointerEvents: 'none',\n              inset: 0,\n              boxShadow: '[inset 0 0 0 2px var(--spectrum-gray-900), inset 0 0 0 4px var(--spectrum-gray-50)]',\n              forcedColorAdjust: 'none',\n              borderRadius: '[inherit]'\n            })()} />\n        )}\n      </>)}\n    </AriaColorSwatchPickerItem>\n  );\n}\n"],"names":[],"version":3,"file":"ColorSwatchPicker.mjs.map"}
+{"mappings":";;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AA0CM,MAAM,0DAAoB,CAAA,GAAA,iBAAS,EAAE,SAAS,kBACnD,KAAqC,EACrC,GAA2B;IAE3B,IAAI,WAAC,UAAU,iBAAW,OAAO,eAAK,WAAW,QAAQ,GAAG,YAAW,GAAG;IAC1E,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,yCAAY,EAAE;IACjC,IAAI,SAAS,CAAA,GAAA,yCAAQ,EAAE;IAEvB,qBACE,gCAAC,CAAA,GAAA,wBAAoB;QAClB,GAAG,UAAU;QACd,OAAO,WAAW,KAAK;QACvB,KAAK;QACL,WACE,WAAW,SAAS,GACpB;;;;;;;;;;;UAUG;qBAAC;QAAO;qBAEb,gCAAC,CAAA,GAAA,yCAAyB,EAAE,QAAQ;QAAC,OAAO;wBAAC;kBAAY;sBAAM;QAAQ;OACpE,MAAM,QAAQ;AAIvB;AAEA,SAAS,iCACP,MAAoB,EACpB,KAAY,EACZ,QAA8C;IAE9C,qBACE,gCAAC,CAAA,GAAA,4BAAwB;QACvB,OAAO;QACP,WAAW,CAAA,cACT;;;;;;;;;;;;;;;;;;;;;;eAgBG;gBAAC,GAAG,WAAW;0BAAE;YAAQ;OAE7B,CAAC,cAAC,UAAU,EAAC,iBACZ,kEACG,QACA,4BACC,gCAAC;YACC,eAAA;YACA,WAAW;;;;;;;;;;;;;;;;;AAezB","sources":["packages/@adobe/react-spectrum/src/color/ColorSwatchPicker.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  ColorSwatchPicker as AriaColorSwatchPicker,\n  ColorSwatchPickerItem as AriaColorSwatchPickerItem\n} from 'react-aria-components/ColorSwatchPicker';\n\nimport {Color} from 'react-stately/Color';\nimport {DOMRef, StyleProps, ValueBase} from '@react-types/shared';\nimport React, {forwardRef, ReactElement, ReactNode} from 'react';\nimport {SpectrumColorSwatchContext, SpectrumColorSwatchProps} from './ColorSwatch';\nimport {style} from '@react-spectrum/style-macro-s1' with {type: 'macro'};\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useStyleProps} from '../utils/styleProps';\n\nexport interface SpectrumColorSwatchPickerProps\n  extends ValueBase<string | Color, Color>, StyleProps {\n  /** The ColorSwatches within the ColorSwatchPicker. */\n  children: ReactNode;\n  /**\n   * The amount of padding between the swatches.\n   *\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious';\n  /**\n   * The size of the color swatches.\n   *\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L';\n  /**\n   * The corner rounding of the color swatches.\n   *\n   * @default 'none'\n   */\n  rounding?: 'none' | 'default' | 'full';\n}\n\n/**\n * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.\n */\nexport const ColorSwatchPicker = forwardRef(function ColorSwatchPicker(\n  props: SpectrumColorSwatchPickerProps,\n  ref: DOMRef<HTMLDivElement>\n) {\n  let {density = 'regular', size = 'M', rounding = 'none', ...otherProps} = props;\n  let {styleProps} = useStyleProps(props);\n  let domRef = useDOMRef(ref);\n\n  return (\n    <AriaColorSwatchPicker\n      {...otherProps}\n      style={styleProps.style}\n      ref={domRef}\n      className={\n        styleProps.className +\n        style({\n          display: 'flex',\n          flexWrap: 'wrap',\n          gap: {\n            density: {\n              compact: 0.5,\n              regular: 1,\n              spacious: 2\n            }\n          }\n        })({density})\n      }>\n      <SpectrumColorSwatchContext.Provider value={{useWrapper, size, rounding}}>\n        {props.children}\n      </SpectrumColorSwatchContext.Provider>\n    </AriaColorSwatchPicker>\n  );\n});\n\nfunction useWrapper(\n  swatch: ReactElement,\n  color: Color,\n  rounding: SpectrumColorSwatchProps['rounding']\n) {\n  return (\n    <AriaColorSwatchPickerItem\n      color={color}\n      className={renderProps =>\n        style({\n          outlineStyle: {\n            default: 'none',\n            isFocusVisible: 'solid'\n          },\n          outlineColor: 'focus-ring',\n          outlineWidth: 2,\n          outlineOffset: 2,\n          position: 'relative',\n          borderRadius: {\n            rounding: {\n              none: 'none',\n              default: 'default',\n              full: 'full'\n            }\n          }\n        })({...renderProps, rounding})\n      }>\n      {({isSelected}) => (\n        <>\n          {swatch}\n          {isSelected && (\n            <div\n              aria-hidden\n              className={style({\n                position: 'absolute',\n                pointerEvents: 'none',\n                inset: 0,\n                boxShadow:\n                  '[inset 0 0 0 2px var(--spectrum-gray-900), inset 0 0 0 4px var(--spectrum-gray-50)]',\n                forcedColorAdjust: 'none',\n                borderRadius: '[inherit]'\n              })()}\n            />\n          )}\n        </>\n      )}\n    </AriaColorSwatchPickerItem>\n  );\n}\n"],"names":[],"version":3,"file":"ColorSwatchPicker.mjs.map"}