react-aria-components 1.14.0 → 1.15.0

package/dist/ColorField.main.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/react-aria-components/src/ColorField.tsx"],"sourcesContent":["/*\n * Copyright 2022 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, useLocale} from 'react-aria';\nimport {\n  ClassNameOrFunction,\n  Provider,\n  RACValidation,\n  removeDataAttributes,\n  RenderProps,\n  SlotProps,\n  useContextProps,\n  useRenderProps,\n  useSlot\n} from './utils';\nimport {ColorChannel, ColorFieldState, ColorSpace, useColorChannelFieldState, useColorFieldState} from 'react-stately';\nimport {ColorFieldContext} from './RSPContexts';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {GlobalDOMAttributes, InputDOMProps, ValidationResult} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport React, {createContext, ForwardedRef, forwardRef, HTMLAttributes, InputHTMLAttributes, LabelHTMLAttributes, Ref, useRef} from 'react';\nimport {TextContext} from './Text';\n\nexport interface ColorFieldRenderProps {\n  /**\n   * Whether the color field is disabled.\n   * @selector [data-disabled]\n   */\n  isDisabled: boolean,\n  /**\n   * Whether the color field is invalid.\n   * @selector [data-invalid]\n   */\n  isInvalid: boolean,\n  /**\n   * The color channel that this field edits, or \"hex\" if no `channel` prop is set.\n   * @selector [data-channel=\"hex | hue | saturation | ...\"]\n   */\n  channel: ColorChannel | 'hex',\n  /**\n   * State of the color field.\n   */\n  state: ColorFieldState\n}\n\nexport interface ColorFieldProps extends Omit<AriaColorFieldProps, 'label' | 'placeholder' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, InputDOMProps, RenderProps<ColorFieldRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorField'\n   */\n  className?: ClassNameOrFunction<ColorFieldRenderProps>,\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}\n\nexport const ColorFieldStateContext = createContext<ColorFieldState | null>(null);\n\n/**\n * A color field allows users to edit a hex color or individual color channel value.\n */\nexport const ColorField = forwardRef(function ColorField(props: ColorFieldProps, ref: ForwardedRef<HTMLDivElement>) {\n  [props, ref] = useContextProps(props, ref, ColorFieldContext);\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<ColorFieldProps, 'channel'> {\n  channel: ColorChannel,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n}\n\nfunction ColorChannelField(props: ColorChannelFieldProps) {\n  let {locale} = useLocale();\n  let state = useColorChannelFieldState({\n    ...props,\n    locale\n  });\n\n  let inputRef = useRef<HTMLInputElement>(null);\n  let [labelRef, label] = useSlot(\n    !props['aria-label'] && !props['aria-labelledby']\n  );\n  let {\n    labelProps,\n    inputProps,\n    descriptionProps,\n    errorMessageProps,\n    ...validation\n  } = useColorChannelField({\n    ...removeDataAttributes(props),\n    label,\n    validationBehavior: props.validationBehavior ?? 'native'\n  }, state, inputRef);\n\n  return (\n    <>\n      {useChildren(\n        props,\n        state,\n        props.forwardedRef,\n        inputProps,\n        inputRef,\n        labelProps,\n        labelRef,\n        descriptionProps,\n        errorMessageProps,\n        validation\n      )}\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 ColorFieldProps {\n  forwardedRef: ForwardedRef<HTMLDivElement>\n}\n\nfunction HexColorField(props: HexColorFieldProps) {\n  let state = useColorFieldState({\n    ...props,\n    validationBehavior: props.validationBehavior ?? 'native'\n  });\n\n  let inputRef = useRef<HTMLInputElement>(null);\n  let [labelRef, label] = useSlot(\n    !props['aria-label'] && !props['aria-labelledby']\n  );\n  let {\n    labelProps,\n    inputProps,\n    descriptionProps,\n    errorMessageProps,\n    ...validation\n  } = useColorField({\n    ...removeDataAttributes(props),\n    label,\n    validationBehavior: props.validationBehavior ?? 'native'\n  }, state, inputRef);\n\n  return useChildren(\n    props,\n    state,\n    props.forwardedRef,\n    inputProps,\n    inputRef,\n    labelProps,\n    labelRef,\n    descriptionProps,\n    errorMessageProps,\n    validation\n  );\n}\n\nfunction useChildren(\n  props: ColorFieldProps,\n  state: ColorFieldState,\n  ref: ForwardedRef<HTMLDivElement>,\n  inputProps: InputHTMLAttributes<HTMLElement>,\n  inputRef: Ref<HTMLInputElement>,\n  labelProps: LabelHTMLAttributes<HTMLLabelElement>,\n  labelRef: Ref<HTMLLabelElement>,\n  descriptionProps: HTMLAttributes<HTMLElement>,\n  errorMessageProps: HTMLAttributes<HTMLElement>,\n  validation: ValidationResult\n) {\n  let renderProps = useRenderProps({\n    ...props,\n    values: {\n      state,\n      channel: props.channel || 'hex',\n      isDisabled: props.isDisabled || false,\n      isInvalid: validation.isInvalid || false\n    },\n    defaultClassName: 'react-aria-ColorField'\n  });\n\n  let DOMProps = filterDOMProps(props, {global: true});\n  delete DOMProps.id;\n\n  return (\n    <Provider\n      values={[\n        [ColorFieldStateContext, state],\n        [InputContext, {...inputProps, ref: inputRef}],\n        [LabelContext, {...labelProps, ref: labelRef}],\n        [GroupContext, {role: 'presentation', isInvalid: validation.isInvalid, isDisabled: props.isDisabled || false}],\n        [TextContext, {\n          slots: {\n            description: descriptionProps,\n            errorMessage: errorMessageProps\n          }\n        }],\n        [FieldErrorContext, validation]\n      ]}>\n      <div\n        {...DOMProps}\n        {...renderProps}\n        ref={ref}\n        slot={props.slot || undefined}\n        data-channel={props.channel || 'hex'}\n        data-disabled={props.isDisabled || undefined}\n        data-invalid={validation.isInvalid || undefined} />\n    </Provider>\n  );\n}\n"],"names":[],"version":3,"file":"ColorField.main.js.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;AA4EM,MAAM,0DAAyB,CAAA,GAAA,0BAAY,EAA0B;AAKrE,MAAM,0DAAa,CAAA,GAAA,uBAAS,EAAE,SAAS,WAAW,KAAsB,EAAE,GAAiC;IAChH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK,CAAA,GAAA,2CAAgB;IAC3D,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,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,0BAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,6CAAwB,EAAE;QACpC,GAAG,KAAK;gBACR;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAoB;IACxC,IAAI,CAAC,UAAU,MAAM,GAAG,CAAA,GAAA,iCAAM,EAC5B,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,KAAK,CAAC,kBAAkB;QAW7B;IATtB,IAAI,cACF,UAAU,cACV,UAAU,oBACV,gBAAgB,qBAChB,iBAAiB,EACjB,GAAG,YACJ,GAAG,CAAA,GAAA,qCAAmB,EAAE;QACvB,GAAG,CAAA,GAAA,8CAAmB,EAAE,MAAM;eAC9B;QACA,oBAAoB,CAAA,4BAAA,MAAM,kBAAkB,cAAxB,uCAAA,4BAA4B;IAClD,GAAG,OAAO;IAEV,qBACE,sHACG,kCACC,OACA,OACA,MAAM,YAAY,EAClB,YACA,UACA,YACA,UACA,kBACA,mBACA,aAED,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;QAGxB;IAFtB,IAAI,QAAQ,CAAA,GAAA,sCAAiB,EAAE;QAC7B,GAAG,KAAK;QACR,oBAAoB,CAAA,4BAAA,MAAM,kBAAkB,cAAxB,uCAAA,4BAA4B;IAClD;IAEA,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAoB;IACxC,IAAI,CAAC,UAAU,MAAM,GAAG,CAAA,GAAA,iCAAM,EAC5B,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,KAAK,CAAC,kBAAkB;QAW7B;IATtB,IAAI,cACF,UAAU,cACV,UAAU,oBACV,gBAAgB,qBAChB,iBAAiB,EACjB,GAAG,YACJ,GAAG,CAAA,GAAA,8BAAY,EAAE;QAChB,GAAG,CAAA,GAAA,8CAAmB,EAAE,MAAM;eAC9B;QACA,oBAAoB,CAAA,6BAAA,MAAM,kBAAkB,cAAxB,wCAAA,6BAA4B;IAClD,GAAG,OAAO;IAEV,OAAO,kCACL,OACA,OACA,MAAM,YAAY,EAClB,YACA,UACA,YACA,UACA,kBACA,mBACA;AAEJ;AAEA,SAAS,kCACP,KAAsB,EACtB,KAAsB,EACtB,GAAiC,EACjC,UAA4C,EAC5C,QAA+B,EAC/B,UAAiD,EACjD,QAA+B,EAC/B,gBAA6C,EAC7C,iBAA8C,EAC9C,UAA4B;IAE5B,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,QAAQ;mBACN;YACA,SAAS,MAAM,OAAO,IAAI;YAC1B,YAAY,MAAM,UAAU,IAAI;YAChC,WAAW,WAAW,SAAS,IAAI;YACnC,YAAY,MAAM,UAAU,IAAI;YAChC,YAAY,MAAM,UAAU,IAAI;QAClC;QACA,kBAAkB;IACpB;IAEA,IAAI,WAAW,CAAA,GAAA,oCAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,0DAAC,CAAA,GAAA,kCAAO;QACN,QAAQ;YACN;gBAAC;gBAAwB;aAAM;YAC/B;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YAC9C;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YAC9C;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,MAAM;oBAAgB,WAAW,WAAW,SAAS;oBAAE,YAAY,MAAM,UAAU,IAAI;gBAAK;aAAE;YAC9G;gBAAC,CAAA,GAAA,qCAAU;gBAAG;oBACZ,OAAO;wBACL,aAAa;wBACb,cAAc;oBAChB;gBACF;aAAE;YACF;gBAAC,CAAA,GAAA,2CAAgB;gBAAG;aAAW;SAChC;qBACD,0DAAC,CAAA,GAAA,6BAAE,EAAE,GAAG;QACL,GAAG,QAAQ;QACX,GAAG,WAAW;QACf,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,gBAAc,MAAM,OAAO,IAAI;QAC/B,iBAAe,MAAM,UAAU,IAAI;QACnC,gBAAc,WAAW,SAAS,IAAI;QACtC,iBAAe,MAAM,UAAU,IAAI;QACnC,iBAAe,MAAM,UAAU,IAAI;;AAG3C","sources":["packages/react-aria-components/src/ColorField.tsx"],"sourcesContent":["/*\n * Copyright 2022 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, useLocale} from 'react-aria';\nimport {\n  ClassNameOrFunction,\n  dom,\n  Provider,\n  RACValidation,\n  removeDataAttributes,\n  RenderProps,\n  SlotProps,\n  useContextProps,\n  useRenderProps,\n  useSlot\n} from './utils';\nimport {ColorChannel, ColorFieldState, ColorSpace, useColorChannelFieldState, useColorFieldState} from 'react-stately';\nimport {ColorFieldContext} from './RSPContexts';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {GlobalDOMAttributes, InputDOMProps, ValidationResult} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport React, {createContext, ForwardedRef, forwardRef, HTMLAttributes, InputHTMLAttributes, LabelHTMLAttributes, Ref, useRef} from 'react';\nimport {TextContext} from './Text';\n\nexport interface ColorFieldRenderProps {\n  /**\n   * Whether the color field is disabled.\n   * @selector [data-disabled]\n   */\n  isDisabled: boolean,\n  /**\n   * Whether the color field is invalid.\n   * @selector [data-invalid]\n   */\n  isInvalid: boolean,\n  /**\n   * Whether the color field is read only.\n   * @selector [data-readonly]\n   */\n   isReadOnly: boolean,\n   /**\n    * Whether the color field is required.\n    * @selector [data-required]\n    */\n   isRequired: boolean,\n  /**\n   * The color channel that this field edits, or \"hex\" if no `channel` prop is set.\n   * @selector [data-channel=\"hex | hue | saturation | ...\"]\n   */\n  channel: ColorChannel | 'hex',\n  /**\n   * State of the color field.\n   */\n  state: ColorFieldState\n}\n\nexport interface ColorFieldProps extends Omit<AriaColorFieldProps, 'label' | 'placeholder' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, InputDOMProps, RenderProps<ColorFieldRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorField'\n   */\n  className?: ClassNameOrFunction<ColorFieldRenderProps>,\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}\n\nexport const ColorFieldStateContext = createContext<ColorFieldState | null>(null);\n\n/**\n * A color field allows users to edit a hex color or individual color channel value.\n */\nexport const ColorField = forwardRef(function ColorField(props: ColorFieldProps, ref: ForwardedRef<HTMLDivElement>) {\n  [props, ref] = useContextProps(props, ref, ColorFieldContext);\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<ColorFieldProps, 'channel'> {\n  channel: ColorChannel,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n}\n\nfunction ColorChannelField(props: ColorChannelFieldProps) {\n  let {locale} = useLocale();\n  let state = useColorChannelFieldState({\n    ...props,\n    locale\n  });\n\n  let inputRef = useRef<HTMLInputElement>(null);\n  let [labelRef, label] = useSlot(\n    !props['aria-label'] && !props['aria-labelledby']\n  );\n  let {\n    labelProps,\n    inputProps,\n    descriptionProps,\n    errorMessageProps,\n    ...validation\n  } = useColorChannelField({\n    ...removeDataAttributes(props),\n    label,\n    validationBehavior: props.validationBehavior ?? 'native'\n  }, state, inputRef);\n\n  return (\n    <>\n      {useChildren(\n        props,\n        state,\n        props.forwardedRef,\n        inputProps,\n        inputRef,\n        labelProps,\n        labelRef,\n        descriptionProps,\n        errorMessageProps,\n        validation\n      )}\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 ColorFieldProps {\n  forwardedRef: ForwardedRef<HTMLDivElement>\n}\n\nfunction HexColorField(props: HexColorFieldProps) {\n  let state = useColorFieldState({\n    ...props,\n    validationBehavior: props.validationBehavior ?? 'native'\n  });\n\n  let inputRef = useRef<HTMLInputElement>(null);\n  let [labelRef, label] = useSlot(\n    !props['aria-label'] && !props['aria-labelledby']\n  );\n  let {\n    labelProps,\n    inputProps,\n    descriptionProps,\n    errorMessageProps,\n    ...validation\n  } = useColorField({\n    ...removeDataAttributes(props),\n    label,\n    validationBehavior: props.validationBehavior ?? 'native'\n  }, state, inputRef);\n\n  return useChildren(\n    props,\n    state,\n    props.forwardedRef,\n    inputProps,\n    inputRef,\n    labelProps,\n    labelRef,\n    descriptionProps,\n    errorMessageProps,\n    validation\n  );\n}\n\nfunction useChildren(\n  props: ColorFieldProps,\n  state: ColorFieldState,\n  ref: ForwardedRef<HTMLDivElement>,\n  inputProps: InputHTMLAttributes<HTMLElement>,\n  inputRef: Ref<HTMLInputElement>,\n  labelProps: LabelHTMLAttributes<HTMLLabelElement>,\n  labelRef: Ref<HTMLLabelElement>,\n  descriptionProps: HTMLAttributes<HTMLElement>,\n  errorMessageProps: HTMLAttributes<HTMLElement>,\n  validation: ValidationResult\n) {\n  let renderProps = useRenderProps({\n    ...props,\n    values: {\n      state,\n      channel: props.channel || 'hex',\n      isDisabled: props.isDisabled || false,\n      isInvalid: validation.isInvalid || false,\n      isReadOnly: props.isReadOnly || false,\n      isRequired: props.isRequired || false\n    },\n    defaultClassName: 'react-aria-ColorField'\n  });\n\n  let DOMProps = filterDOMProps(props, {global: true});\n  delete DOMProps.id;\n\n  return (\n    <Provider\n      values={[\n        [ColorFieldStateContext, state],\n        [InputContext, {...inputProps, ref: inputRef}],\n        [LabelContext, {...labelProps, ref: labelRef}],\n        [GroupContext, {role: 'presentation', isInvalid: validation.isInvalid, isDisabled: props.isDisabled || false}],\n        [TextContext, {\n          slots: {\n            description: descriptionProps,\n            errorMessage: errorMessageProps\n          }\n        }],\n        [FieldErrorContext, validation]\n      ]}>\n      <dom.div\n        {...DOMProps}\n        {...renderProps}\n        ref={ref}\n        slot={props.slot || undefined}\n        data-channel={props.channel || 'hex'}\n        data-disabled={props.isDisabled || undefined}\n        data-invalid={validation.isInvalid || undefined}\n        data-readonly={props.isReadOnly || undefined}\n        data-required={props.isRequired || undefined} />\n    </Provider>\n  );\n}\n"],"names":[],"version":3,"file":"ColorField.main.js.map"}

package/dist/ColorField.mjs

@@ -1,4 +1,4 @@
-import {Provider as $64fa3d84918910a7$export$2881499e37b75b9a, removeDataAttributes as $64fa3d84918910a7$export$ef03459518577ad4, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3, useSlot as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8} from "./utils.mjs";
+import {dom as $64fa3d84918910a7$export$df3a06d6289f983e, Provider as $64fa3d84918910a7$export$2881499e37b75b9a, removeDataAttributes as $64fa3d84918910a7$export$ef03459518577ad4, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3, useSlot as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8} from "./utils.mjs";
 import {ColorFieldContext as $4e85f108e88277b8$export$44644b8a16031b5b} from "./RSPContexts.mjs";
 import {FieldErrorContext as $ee014567cb39d3f0$export$ff05c3ac10437e03} from "./FieldError.mjs";
 import {GroupContext as $a049562f99e7db0e$export$f9c6924e160136d1} from "./Group.mjs";
@@ -88,7 +88,9 @@ function $3ada01a82feafb94$var$useChildren(props, state, ref, inputProps, inputR
             state: state,
             channel: props.channel || 'hex',
             isDisabled: props.isDisabled || false,
-            isInvalid: validation.isInvalid || false
+            isInvalid: validation.isInvalid || false,
+            isReadOnly: props.isReadOnly || false,
+            isRequired: props.isRequired || false
         },
         defaultClassName: 'react-aria-ColorField'
     });
@@ -138,14 +140,16 @@ function $3ada01a82feafb94$var$useChildren(props, state, ref, inputProps, inputR
                 validation
             ]
         ]
-    }, /*#__PURE__*/ (0, $kjuGe$react).createElement("div", {
+    }, /*#__PURE__*/ (0, $kjuGe$react).createElement((0, $64fa3d84918910a7$export$df3a06d6289f983e).div, {
         ...DOMProps,
         ...renderProps,
         ref: ref,
         slot: props.slot || undefined,
         "data-channel": props.channel || 'hex',
         "data-disabled": props.isDisabled || undefined,
-        "data-invalid": validation.isInvalid || undefined
+        "data-invalid": validation.isInvalid || undefined,
+        "data-readonly": props.isReadOnly || undefined,
+        "data-required": props.isRequired || undefined
     }));
 }
 

package/dist/ColorField.module.js

@@ -1,4 +1,4 @@
-import {Provider as $64fa3d84918910a7$export$2881499e37b75b9a, removeDataAttributes as $64fa3d84918910a7$export$ef03459518577ad4, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3, useSlot as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8} from "./utils.module.js";
+import {dom as $64fa3d84918910a7$export$df3a06d6289f983e, Provider as $64fa3d84918910a7$export$2881499e37b75b9a, removeDataAttributes as $64fa3d84918910a7$export$ef03459518577ad4, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3, useSlot as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8} from "./utils.module.js";
 import {ColorFieldContext as $4e85f108e88277b8$export$44644b8a16031b5b} from "./RSPContexts.module.js";
 import {FieldErrorContext as $ee014567cb39d3f0$export$ff05c3ac10437e03} from "./FieldError.module.js";
 import {GroupContext as $a049562f99e7db0e$export$f9c6924e160136d1} from "./Group.module.js";
@@ -88,7 +88,9 @@ function $3ada01a82feafb94$var$useChildren(props, state, ref, inputProps, inputR
             state: state,
             channel: props.channel || 'hex',
             isDisabled: props.isDisabled || false,
-            isInvalid: validation.isInvalid || false
+            isInvalid: validation.isInvalid || false,
+            isReadOnly: props.isReadOnly || false,
+            isRequired: props.isRequired || false
         },
         defaultClassName: 'react-aria-ColorField'
     });
@@ -138,14 +140,16 @@ function $3ada01a82feafb94$var$useChildren(props, state, ref, inputProps, inputR
                 validation
             ]
         ]
-    }, /*#__PURE__*/ (0, $kjuGe$react).createElement("div", {
+    }, /*#__PURE__*/ (0, $kjuGe$react).createElement((0, $64fa3d84918910a7$export$df3a06d6289f983e).div, {
         ...DOMProps,
         ...renderProps,
         ref: ref,
         slot: props.slot || undefined,
         "data-channel": props.channel || 'hex',
         "data-disabled": props.isDisabled || undefined,
-        "data-invalid": validation.isInvalid || undefined
+        "data-invalid": validation.isInvalid || undefined,
+        "data-readonly": props.isReadOnly || undefined,
+        "data-required": props.isRequired || undefined
     }));
 }
 

package/dist/ColorField.module.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/react-aria-components/src/ColorField.tsx"],"sourcesContent":["/*\n * Copyright 2022 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, useLocale} from 'react-aria';\nimport {\n  ClassNameOrFunction,\n  Provider,\n  RACValidation,\n  removeDataAttributes,\n  RenderProps,\n  SlotProps,\n  useContextProps,\n  useRenderProps,\n  useSlot\n} from './utils';\nimport {ColorChannel, ColorFieldState, ColorSpace, useColorChannelFieldState, useColorFieldState} from 'react-stately';\nimport {ColorFieldContext} from './RSPContexts';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {GlobalDOMAttributes, InputDOMProps, ValidationResult} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport React, {createContext, ForwardedRef, forwardRef, HTMLAttributes, InputHTMLAttributes, LabelHTMLAttributes, Ref, useRef} from 'react';\nimport {TextContext} from './Text';\n\nexport interface ColorFieldRenderProps {\n  /**\n   * Whether the color field is disabled.\n   * @selector [data-disabled]\n   */\n  isDisabled: boolean,\n  /**\n   * Whether the color field is invalid.\n   * @selector [data-invalid]\n   */\n  isInvalid: boolean,\n  /**\n   * The color channel that this field edits, or \"hex\" if no `channel` prop is set.\n   * @selector [data-channel=\"hex | hue | saturation | ...\"]\n   */\n  channel: ColorChannel | 'hex',\n  /**\n   * State of the color field.\n   */\n  state: ColorFieldState\n}\n\nexport interface ColorFieldProps extends Omit<AriaColorFieldProps, 'label' | 'placeholder' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, InputDOMProps, RenderProps<ColorFieldRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorField'\n   */\n  className?: ClassNameOrFunction<ColorFieldRenderProps>,\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}\n\nexport const ColorFieldStateContext = createContext<ColorFieldState | null>(null);\n\n/**\n * A color field allows users to edit a hex color or individual color channel value.\n */\nexport const ColorField = forwardRef(function ColorField(props: ColorFieldProps, ref: ForwardedRef<HTMLDivElement>) {\n  [props, ref] = useContextProps(props, ref, ColorFieldContext);\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<ColorFieldProps, 'channel'> {\n  channel: ColorChannel,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n}\n\nfunction ColorChannelField(props: ColorChannelFieldProps) {\n  let {locale} = useLocale();\n  let state = useColorChannelFieldState({\n    ...props,\n    locale\n  });\n\n  let inputRef = useRef<HTMLInputElement>(null);\n  let [labelRef, label] = useSlot(\n    !props['aria-label'] && !props['aria-labelledby']\n  );\n  let {\n    labelProps,\n    inputProps,\n    descriptionProps,\n    errorMessageProps,\n    ...validation\n  } = useColorChannelField({\n    ...removeDataAttributes(props),\n    label,\n    validationBehavior: props.validationBehavior ?? 'native'\n  }, state, inputRef);\n\n  return (\n    <>\n      {useChildren(\n        props,\n        state,\n        props.forwardedRef,\n        inputProps,\n        inputRef,\n        labelProps,\n        labelRef,\n        descriptionProps,\n        errorMessageProps,\n        validation\n      )}\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 ColorFieldProps {\n  forwardedRef: ForwardedRef<HTMLDivElement>\n}\n\nfunction HexColorField(props: HexColorFieldProps) {\n  let state = useColorFieldState({\n    ...props,\n    validationBehavior: props.validationBehavior ?? 'native'\n  });\n\n  let inputRef = useRef<HTMLInputElement>(null);\n  let [labelRef, label] = useSlot(\n    !props['aria-label'] && !props['aria-labelledby']\n  );\n  let {\n    labelProps,\n    inputProps,\n    descriptionProps,\n    errorMessageProps,\n    ...validation\n  } = useColorField({\n    ...removeDataAttributes(props),\n    label,\n    validationBehavior: props.validationBehavior ?? 'native'\n  }, state, inputRef);\n\n  return useChildren(\n    props,\n    state,\n    props.forwardedRef,\n    inputProps,\n    inputRef,\n    labelProps,\n    labelRef,\n    descriptionProps,\n    errorMessageProps,\n    validation\n  );\n}\n\nfunction useChildren(\n  props: ColorFieldProps,\n  state: ColorFieldState,\n  ref: ForwardedRef<HTMLDivElement>,\n  inputProps: InputHTMLAttributes<HTMLElement>,\n  inputRef: Ref<HTMLInputElement>,\n  labelProps: LabelHTMLAttributes<HTMLLabelElement>,\n  labelRef: Ref<HTMLLabelElement>,\n  descriptionProps: HTMLAttributes<HTMLElement>,\n  errorMessageProps: HTMLAttributes<HTMLElement>,\n  validation: ValidationResult\n) {\n  let renderProps = useRenderProps({\n    ...props,\n    values: {\n      state,\n      channel: props.channel || 'hex',\n      isDisabled: props.isDisabled || false,\n      isInvalid: validation.isInvalid || false\n    },\n    defaultClassName: 'react-aria-ColorField'\n  });\n\n  let DOMProps = filterDOMProps(props, {global: true});\n  delete DOMProps.id;\n\n  return (\n    <Provider\n      values={[\n        [ColorFieldStateContext, state],\n        [InputContext, {...inputProps, ref: inputRef}],\n        [LabelContext, {...labelProps, ref: labelRef}],\n        [GroupContext, {role: 'presentation', isInvalid: validation.isInvalid, isDisabled: props.isDisabled || false}],\n        [TextContext, {\n          slots: {\n            description: descriptionProps,\n            errorMessage: errorMessageProps\n          }\n        }],\n        [FieldErrorContext, validation]\n      ]}>\n      <div\n        {...DOMProps}\n        {...renderProps}\n        ref={ref}\n        slot={props.slot || undefined}\n        data-channel={props.channel || 'hex'}\n        data-disabled={props.isDisabled || undefined}\n        data-invalid={validation.isInvalid || undefined} />\n    </Provider>\n  );\n}\n"],"names":[],"version":3,"file":"ColorField.module.js.map"}
+{"mappings":"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","sources":["packages/react-aria-components/src/ColorField.tsx"],"sourcesContent":["/*\n * Copyright 2022 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, useLocale} from 'react-aria';\nimport {\n  ClassNameOrFunction,\n  dom,\n  Provider,\n  RACValidation,\n  removeDataAttributes,\n  RenderProps,\n  SlotProps,\n  useContextProps,\n  useRenderProps,\n  useSlot\n} from './utils';\nimport {ColorChannel, ColorFieldState, ColorSpace, useColorChannelFieldState, useColorFieldState} from 'react-stately';\nimport {ColorFieldContext} from './RSPContexts';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {GlobalDOMAttributes, InputDOMProps, ValidationResult} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport React, {createContext, ForwardedRef, forwardRef, HTMLAttributes, InputHTMLAttributes, LabelHTMLAttributes, Ref, useRef} from 'react';\nimport {TextContext} from './Text';\n\nexport interface ColorFieldRenderProps {\n  /**\n   * Whether the color field is disabled.\n   * @selector [data-disabled]\n   */\n  isDisabled: boolean,\n  /**\n   * Whether the color field is invalid.\n   * @selector [data-invalid]\n   */\n  isInvalid: boolean,\n  /**\n   * Whether the color field is read only.\n   * @selector [data-readonly]\n   */\n   isReadOnly: boolean,\n   /**\n    * Whether the color field is required.\n    * @selector [data-required]\n    */\n   isRequired: boolean,\n  /**\n   * The color channel that this field edits, or \"hex\" if no `channel` prop is set.\n   * @selector [data-channel=\"hex | hue | saturation | ...\"]\n   */\n  channel: ColorChannel | 'hex',\n  /**\n   * State of the color field.\n   */\n  state: ColorFieldState\n}\n\nexport interface ColorFieldProps extends Omit<AriaColorFieldProps, 'label' | 'placeholder' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, InputDOMProps, RenderProps<ColorFieldRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorField'\n   */\n  className?: ClassNameOrFunction<ColorFieldRenderProps>,\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}\n\nexport const ColorFieldStateContext = createContext<ColorFieldState | null>(null);\n\n/**\n * A color field allows users to edit a hex color or individual color channel value.\n */\nexport const ColorField = forwardRef(function ColorField(props: ColorFieldProps, ref: ForwardedRef<HTMLDivElement>) {\n  [props, ref] = useContextProps(props, ref, ColorFieldContext);\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<ColorFieldProps, 'channel'> {\n  channel: ColorChannel,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n}\n\nfunction ColorChannelField(props: ColorChannelFieldProps) {\n  let {locale} = useLocale();\n  let state = useColorChannelFieldState({\n    ...props,\n    locale\n  });\n\n  let inputRef = useRef<HTMLInputElement>(null);\n  let [labelRef, label] = useSlot(\n    !props['aria-label'] && !props['aria-labelledby']\n  );\n  let {\n    labelProps,\n    inputProps,\n    descriptionProps,\n    errorMessageProps,\n    ...validation\n  } = useColorChannelField({\n    ...removeDataAttributes(props),\n    label,\n    validationBehavior: props.validationBehavior ?? 'native'\n  }, state, inputRef);\n\n  return (\n    <>\n      {useChildren(\n        props,\n        state,\n        props.forwardedRef,\n        inputProps,\n        inputRef,\n        labelProps,\n        labelRef,\n        descriptionProps,\n        errorMessageProps,\n        validation\n      )}\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 ColorFieldProps {\n  forwardedRef: ForwardedRef<HTMLDivElement>\n}\n\nfunction HexColorField(props: HexColorFieldProps) {\n  let state = useColorFieldState({\n    ...props,\n    validationBehavior: props.validationBehavior ?? 'native'\n  });\n\n  let inputRef = useRef<HTMLInputElement>(null);\n  let [labelRef, label] = useSlot(\n    !props['aria-label'] && !props['aria-labelledby']\n  );\n  let {\n    labelProps,\n    inputProps,\n    descriptionProps,\n    errorMessageProps,\n    ...validation\n  } = useColorField({\n    ...removeDataAttributes(props),\n    label,\n    validationBehavior: props.validationBehavior ?? 'native'\n  }, state, inputRef);\n\n  return useChildren(\n    props,\n    state,\n    props.forwardedRef,\n    inputProps,\n    inputRef,\n    labelProps,\n    labelRef,\n    descriptionProps,\n    errorMessageProps,\n    validation\n  );\n}\n\nfunction useChildren(\n  props: ColorFieldProps,\n  state: ColorFieldState,\n  ref: ForwardedRef<HTMLDivElement>,\n  inputProps: InputHTMLAttributes<HTMLElement>,\n  inputRef: Ref<HTMLInputElement>,\n  labelProps: LabelHTMLAttributes<HTMLLabelElement>,\n  labelRef: Ref<HTMLLabelElement>,\n  descriptionProps: HTMLAttributes<HTMLElement>,\n  errorMessageProps: HTMLAttributes<HTMLElement>,\n  validation: ValidationResult\n) {\n  let renderProps = useRenderProps({\n    ...props,\n    values: {\n      state,\n      channel: props.channel || 'hex',\n      isDisabled: props.isDisabled || false,\n      isInvalid: validation.isInvalid || false,\n      isReadOnly: props.isReadOnly || false,\n      isRequired: props.isRequired || false\n    },\n    defaultClassName: 'react-aria-ColorField'\n  });\n\n  let DOMProps = filterDOMProps(props, {global: true});\n  delete DOMProps.id;\n\n  return (\n    <Provider\n      values={[\n        [ColorFieldStateContext, state],\n        [InputContext, {...inputProps, ref: inputRef}],\n        [LabelContext, {...labelProps, ref: labelRef}],\n        [GroupContext, {role: 'presentation', isInvalid: validation.isInvalid, isDisabled: props.isDisabled || false}],\n        [TextContext, {\n          slots: {\n            description: descriptionProps,\n            errorMessage: errorMessageProps\n          }\n        }],\n        [FieldErrorContext, validation]\n      ]}>\n      <dom.div\n        {...DOMProps}\n        {...renderProps}\n        ref={ref}\n        slot={props.slot || undefined}\n        data-channel={props.channel || 'hex'}\n        data-disabled={props.isDisabled || undefined}\n        data-invalid={validation.isInvalid || undefined}\n        data-readonly={props.isReadOnly || undefined}\n        data-required={props.isRequired || undefined} />\n    </Provider>\n  );\n}\n"],"names":[],"version":3,"file":"ColorField.module.js.map"}

package/dist/ColorSlider.main.js

@@ -98,7 +98,7 @@ const $037f8448dff48149$export$44fd664bcca5b6fb = /*#__PURE__*/ (0, $cPSMR$react
                 }
             ]
         ]
-    }, /*#__PURE__*/ (0, ($parcel$interopDefault($cPSMR$react))).createElement("div", {
+    }, /*#__PURE__*/ (0, ($parcel$interopDefault($cPSMR$react))).createElement((0, $c5ccf687772c0422$exports.dom).div, {
         ...DOMProps,
         ...renderProps,
         ref: ref,

package/dist/ColorSlider.main.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CO,MAAM,0DAA0B,CAAA,GAAA,0BAAY,EAA2B;AAKvE,MAAM,0DAAc,CAAA,GAAA,uBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAAiC;IACnH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK,CAAA,GAAA,4CAAiB;IAC5D,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,0BAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,uCAAkB,EAAE;QAAC,GAAG,KAAK;gBAAE;IAAM;IACjD,IAAI,WAAW,CAAA,GAAA,sCAAI,EAAE,MAAM,CAAC;IAC5B,IAAI,WAAW,CAAA,GAAA,sCAAI,EAAE,MAAM,CAAC;IAE5B,IAAI,CAAC,UAAU,MAAM,GAAG,CAAA,GAAA,iCAAM,EAC5B,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,KAAK,CAAC,kBAAkB;IAEnD,IAAI,cACF,UAAU,cACV,UAAU,cACV,UAAU,cACV,UAAU,eACV,WAAW,EACZ,GAAG,CAAA,GAAA,+BAAa,EAAE;QACjB,GAAG,KAAK;eACR;kBACA;kBACA;IACF,GAAG;IAEH,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,QAAQ;YACN,aAAa,MAAM,WAAW;YAC9B,YAAY,MAAM,UAAU;mBAC5B;QACF;QACA,kBAAkB;IACpB;IAEA,IAAI,WAAW,CAAA,GAAA,oCAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,0DAAC,CAAA,GAAA,kCAAO;QACN,QAAQ;YACN;gBAAC;gBAAyB;aAAM;YAChC;gBAAC,CAAA,GAAA,4CAAiB;gBAAG;aAAM;YAC3B;gBAAC,CAAA,GAAA,4CAAiB;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YACpD;gBAAC,CAAA,GAAA,6CAAkB;gBAAG;aAAY;YAClC;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBACb,GAAG,UAAU;oBACb,KAAK;oBACL,UAAU,MAAM,KAAK,CAAC,cAAc,CAAC,MAAM,OAAO,EAAE;gBACtD;aAAE;YACF;gBAAC,CAAA,GAAA,mDAAwB;gBAAG;2BAAC;gCAAO;oBAAY,WAAW;oBAAU,aAAa;oBAAY,YAAY,MAAM,UAAU;gBAAA;aAAE;SAC7H;qBACD,0DAAC;QACE,GAAG,QAAQ;QACX,GAAG,WAAW;QACf,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,oBAAkB,MAAM,WAAW;QACnC,iBAAe,MAAM,UAAU,IAAI;;AAG3C","sources":["packages/react-aria-components/src/ColorSlider.tsx"],"sourcesContent":["import {AriaColorSliderProps, Orientation, useColorSlider, useLocale} from 'react-aria';\nimport {\n  ClassNameOrFunction,\n  Provider,\n  RenderProps,\n  SlotProps,\n  useContextProps,\n  useRenderProps,\n  useSlot\n} from './utils';\nimport {ColorSliderContext} from './RSPContexts';\nimport {ColorSliderState, useColorSliderState} from 'react-stately';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {GlobalDOMAttributes} from '@react-types/shared';\nimport {InternalColorThumbContext} from './ColorThumb';\nimport {LabelContext} from './Label';\nimport React, {createContext, ForwardedRef, forwardRef} from 'react';\nimport {SliderOutputContext, SliderStateContext, SliderTrackContext} from './Slider';\n\nexport interface ColorSliderRenderProps {\n  /**\n   * The orientation of the color slider.\n   * @selector [data-orientation=\"horizontal | vertical\"]\n   */\n  orientation: Orientation,\n  /**\n   * Whether the color slider is disabled.\n   * @selector [data-disabled]\n   */\n  isDisabled: boolean,\n  /**\n   * State of the color slider.\n   */\n  state: ColorSliderState\n}\n\nexport interface ColorSliderProps extends Omit<AriaColorSliderProps, 'label'>, RenderProps<ColorSliderRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorSlider'\n   */\n  className?: ClassNameOrFunction<ColorSliderRenderProps>\n}\n\nexport const ColorSliderStateContext = createContext<ColorSliderState | null>(null);\n\n/**\n * A color slider allows users to adjust an individual channel of a color value.\n */\nexport const ColorSlider = forwardRef(function ColorSlider(props: ColorSliderProps, ref: ForwardedRef<HTMLDivElement>) {\n  [props, ref] = useContextProps(props, ref, ColorSliderContext);\n  let {locale} = useLocale();\n  let state = useColorSliderState({...props, locale});\n  let trackRef = React.useRef(null);\n  let inputRef = React.useRef(null);\n\n  let [labelRef, label] = useSlot(\n    !props['aria-label'] && !props['aria-labelledby']\n  );\n  let {\n    trackProps,\n    thumbProps,\n    inputProps,\n    labelProps,\n    outputProps\n  } = useColorSlider({\n    ...props,\n    label,\n    trackRef,\n    inputRef\n  }, state);\n\n  let renderProps = useRenderProps({\n    ...props,\n    values: {\n      orientation: state.orientation,\n      isDisabled: state.isDisabled,\n      state\n    },\n    defaultClassName: 'react-aria-ColorSlider'\n  });\n\n  let DOMProps = filterDOMProps(props, {global: true});\n  delete DOMProps.id;\n\n  return (\n    <Provider\n      values={[\n        [ColorSliderStateContext, state],\n        [SliderStateContext, state],\n        [SliderTrackContext, {...trackProps, ref: trackRef}],\n        [SliderOutputContext, outputProps],\n        [LabelContext, {\n          ...labelProps,\n          ref: labelRef,\n          children: state.value.getChannelName(props.channel, locale)\n        }],\n        [InternalColorThumbContext, {state, thumbProps, inputXRef: inputRef, xInputProps: inputProps, isDisabled: props.isDisabled}]\n      ]}>\n      <div\n        {...DOMProps}\n        {...renderProps}\n        ref={ref}\n        slot={props.slot || undefined}\n        data-orientation={state.orientation}\n        data-disabled={state.isDisabled || undefined} />\n    </Provider>\n  );\n});\n"],"names":[],"version":3,"file":"ColorSlider.main.js.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6CO,MAAM,0DAA0B,CAAA,GAAA,0BAAY,EAA2B;AAKvE,MAAM,0DAAc,CAAA,GAAA,uBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAAiC;IACnH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK,CAAA,GAAA,4CAAiB;IAC5D,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,0BAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,uCAAkB,EAAE;QAAC,GAAG,KAAK;gBAAE;IAAM;IACjD,IAAI,WAAW,CAAA,GAAA,sCAAI,EAAE,MAAM,CAAC;IAC5B,IAAI,WAAW,CAAA,GAAA,sCAAI,EAAE,MAAM,CAAC;IAE5B,IAAI,CAAC,UAAU,MAAM,GAAG,CAAA,GAAA,iCAAM,EAC5B,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,KAAK,CAAC,kBAAkB;IAEnD,IAAI,cACF,UAAU,cACV,UAAU,cACV,UAAU,cACV,UAAU,eACV,WAAW,EACZ,GAAG,CAAA,GAAA,+BAAa,EAAE;QACjB,GAAG,KAAK;eACR;kBACA;kBACA;IACF,GAAG;IAEH,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,QAAQ;YACN,aAAa,MAAM,WAAW;YAC9B,YAAY,MAAM,UAAU;mBAC5B;QACF;QACA,kBAAkB;IACpB;IAEA,IAAI,WAAW,CAAA,GAAA,oCAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,0DAAC,CAAA,GAAA,kCAAO;QACN,QAAQ;YACN;gBAAC;gBAAyB;aAAM;YAChC;gBAAC,CAAA,GAAA,4CAAiB;gBAAG;aAAM;YAC3B;gBAAC,CAAA,GAAA,4CAAiB;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YACpD;gBAAC,CAAA,GAAA,6CAAkB;gBAAG;aAAY;YAClC;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBACb,GAAG,UAAU;oBACb,KAAK;oBACL,UAAU,MAAM,KAAK,CAAC,cAAc,CAAC,MAAM,OAAO,EAAE;gBACtD;aAAE;YACF;gBAAC,CAAA,GAAA,mDAAwB;gBAAG;2BAAC;gCAAO;oBAAY,WAAW;oBAAU,aAAa;oBAAY,YAAY,MAAM,UAAU;gBAAA;aAAE;SAC7H;qBACD,0DAAC,CAAA,GAAA,6BAAE,EAAE,GAAG;QACL,GAAG,QAAQ;QACX,GAAG,WAAW;QACf,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,oBAAkB,MAAM,WAAW;QACnC,iBAAe,MAAM,UAAU,IAAI;;AAG3C","sources":["packages/react-aria-components/src/ColorSlider.tsx"],"sourcesContent":["import {AriaColorSliderProps, Orientation, useColorSlider, useLocale} from 'react-aria';\nimport {\n  ClassNameOrFunction,\n  dom,\n  Provider,\n  RenderProps,\n  SlotProps,\n  useContextProps,\n  useRenderProps,\n  useSlot\n} from './utils';\nimport {ColorSliderContext} from './RSPContexts';\nimport {ColorSliderState, useColorSliderState} from 'react-stately';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {GlobalDOMAttributes} from '@react-types/shared';\nimport {InternalColorThumbContext} from './ColorThumb';\nimport {LabelContext} from './Label';\nimport React, {createContext, ForwardedRef, forwardRef} from 'react';\nimport {SliderOutputContext, SliderStateContext, SliderTrackContext} from './Slider';\n\nexport interface ColorSliderRenderProps {\n  /**\n   * The orientation of the color slider.\n   * @selector [data-orientation=\"horizontal | vertical\"]\n   */\n  orientation: Orientation,\n  /**\n   * Whether the color slider is disabled.\n   * @selector [data-disabled]\n   */\n  isDisabled: boolean,\n  /**\n   * State of the color slider.\n   */\n  state: ColorSliderState\n}\n\nexport interface ColorSliderProps extends Omit<AriaColorSliderProps, 'label'>, RenderProps<ColorSliderRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorSlider'\n   */\n  className?: ClassNameOrFunction<ColorSliderRenderProps>\n}\n\nexport const ColorSliderStateContext = createContext<ColorSliderState | null>(null);\n\n/**\n * A color slider allows users to adjust an individual channel of a color value.\n */\nexport const ColorSlider = forwardRef(function ColorSlider(props: ColorSliderProps, ref: ForwardedRef<HTMLDivElement>) {\n  [props, ref] = useContextProps(props, ref, ColorSliderContext);\n  let {locale} = useLocale();\n  let state = useColorSliderState({...props, locale});\n  let trackRef = React.useRef(null);\n  let inputRef = React.useRef(null);\n\n  let [labelRef, label] = useSlot(\n    !props['aria-label'] && !props['aria-labelledby']\n  );\n  let {\n    trackProps,\n    thumbProps,\n    inputProps,\n    labelProps,\n    outputProps\n  } = useColorSlider({\n    ...props,\n    label,\n    trackRef,\n    inputRef\n  }, state);\n\n  let renderProps = useRenderProps({\n    ...props,\n    values: {\n      orientation: state.orientation,\n      isDisabled: state.isDisabled,\n      state\n    },\n    defaultClassName: 'react-aria-ColorSlider'\n  });\n\n  let DOMProps = filterDOMProps(props, {global: true});\n  delete DOMProps.id;\n\n  return (\n    <Provider\n      values={[\n        [ColorSliderStateContext, state],\n        [SliderStateContext, state],\n        [SliderTrackContext, {...trackProps, ref: trackRef}],\n        [SliderOutputContext, outputProps],\n        [LabelContext, {\n          ...labelProps,\n          ref: labelRef,\n          children: state.value.getChannelName(props.channel, locale)\n        }],\n        [InternalColorThumbContext, {state, thumbProps, inputXRef: inputRef, xInputProps: inputProps, isDisabled: props.isDisabled}]\n      ]}>\n      <dom.div\n        {...DOMProps}\n        {...renderProps}\n        ref={ref}\n        slot={props.slot || undefined}\n        data-orientation={state.orientation}\n        data-disabled={state.isDisabled || undefined} />\n    </Provider>\n  );\n});\n"],"names":[],"version":3,"file":"ColorSlider.main.js.map"}

package/dist/ColorSlider.mjs

@@ -1,4 +1,4 @@
-import {Provider as $64fa3d84918910a7$export$2881499e37b75b9a, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3, useSlot as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8} from "./utils.mjs";
+import {dom as $64fa3d84918910a7$export$df3a06d6289f983e, Provider as $64fa3d84918910a7$export$2881499e37b75b9a, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3, useSlot as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8} from "./utils.mjs";
 import {ColorSliderContext as $4e85f108e88277b8$export$717b2c0a523a0b53} from "./RSPContexts.mjs";
 import {InternalColorThumbContext as $e2b71ec1d6016406$export$c80c0ea2ca5cb846} from "./ColorThumb.mjs";
 import {LabelContext as $01b77f81d0f07f68$export$75b6ee27786ba447} from "./Label.mjs";
@@ -87,7 +87,7 @@ const $1cca5300a3c2e7f9$export$44fd664bcca5b6fb = /*#__PURE__*/ (0, $bYfIo$forwa
                 }
             ]
         ]
-    }, /*#__PURE__*/ (0, $bYfIo$react).createElement("div", {
+    }, /*#__PURE__*/ (0, $bYfIo$react).createElement((0, $64fa3d84918910a7$export$df3a06d6289f983e).div, {
         ...DOMProps,
         ...renderProps,
         ref: ref,

package/dist/ColorSlider.module.js

@@ -1,4 +1,4 @@
-import {Provider as $64fa3d84918910a7$export$2881499e37b75b9a, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3, useSlot as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8} from "./utils.module.js";
+import {dom as $64fa3d84918910a7$export$df3a06d6289f983e, Provider as $64fa3d84918910a7$export$2881499e37b75b9a, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3, useSlot as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8} from "./utils.module.js";
 import {ColorSliderContext as $4e85f108e88277b8$export$717b2c0a523a0b53} from "./RSPContexts.module.js";
 import {InternalColorThumbContext as $e2b71ec1d6016406$export$c80c0ea2ca5cb846} from "./ColorThumb.module.js";
 import {LabelContext as $01b77f81d0f07f68$export$75b6ee27786ba447} from "./Label.module.js";
@@ -87,7 +87,7 @@ const $1cca5300a3c2e7f9$export$44fd664bcca5b6fb = /*#__PURE__*/ (0, $bYfIo$forwa
                 }
             ]
         ]
-    }, /*#__PURE__*/ (0, $bYfIo$react).createElement("div", {
+    }, /*#__PURE__*/ (0, $bYfIo$react).createElement((0, $64fa3d84918910a7$export$df3a06d6289f983e).div, {
         ...DOMProps,
         ...renderProps,
         ref: ref,

package/dist/ColorSlider.module.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;AA4CO,MAAM,0DAA0B,CAAA,GAAA,oBAAY,EAA2B;AAKvE,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAAiC;IACnH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK,CAAA,GAAA,yCAAiB;IAC5D,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,gBAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,0BAAkB,EAAE;QAAC,GAAG,KAAK;gBAAE;IAAM;IACjD,IAAI,WAAW,CAAA,GAAA,YAAI,EAAE,MAAM,CAAC;IAC5B,IAAI,WAAW,CAAA,GAAA,YAAI,EAAE,MAAM,CAAC;IAE5B,IAAI,CAAC,UAAU,MAAM,GAAG,CAAA,GAAA,yCAAM,EAC5B,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,KAAK,CAAC,kBAAkB;IAEnD,IAAI,cACF,UAAU,cACV,UAAU,cACV,UAAU,cACV,UAAU,eACV,WAAW,EACZ,GAAG,CAAA,GAAA,qBAAa,EAAE;QACjB,GAAG,KAAK;eACR;kBACA;kBACA;IACF,GAAG;IAEH,IAAI,cAAc,CAAA,GAAA,uCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,QAAQ;YACN,aAAa,MAAM,WAAW;YAC9B,YAAY,MAAM,UAAU;mBAC5B;QACF;QACA,kBAAkB;IACpB;IAEA,IAAI,WAAW,CAAA,GAAA,qBAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,gCAAC,CAAA,GAAA,yCAAO;QACN,QAAQ;YACN;gBAAC;gBAAyB;aAAM;YAChC;gBAAC,CAAA,GAAA,yCAAiB;gBAAG;aAAM;YAC3B;gBAAC,CAAA,GAAA,yCAAiB;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YACpD;gBAAC,CAAA,GAAA,yCAAkB;gBAAG;aAAY;YAClC;gBAAC,CAAA,GAAA,yCAAW;gBAAG;oBACb,GAAG,UAAU;oBACb,KAAK;oBACL,UAAU,MAAM,KAAK,CAAC,cAAc,CAAC,MAAM,OAAO,EAAE;gBACtD;aAAE;YACF;gBAAC,CAAA,GAAA,yCAAwB;gBAAG;2BAAC;gCAAO;oBAAY,WAAW;oBAAU,aAAa;oBAAY,YAAY,MAAM,UAAU;gBAAA;aAAE;SAC7H;qBACD,gCAAC;QACE,GAAG,QAAQ;QACX,GAAG,WAAW;QACf,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,oBAAkB,MAAM,WAAW;QACnC,iBAAe,MAAM,UAAU,IAAI;;AAG3C","sources":["packages/react-aria-components/src/ColorSlider.tsx"],"sourcesContent":["import {AriaColorSliderProps, Orientation, useColorSlider, useLocale} from 'react-aria';\nimport {\n  ClassNameOrFunction,\n  Provider,\n  RenderProps,\n  SlotProps,\n  useContextProps,\n  useRenderProps,\n  useSlot\n} from './utils';\nimport {ColorSliderContext} from './RSPContexts';\nimport {ColorSliderState, useColorSliderState} from 'react-stately';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {GlobalDOMAttributes} from '@react-types/shared';\nimport {InternalColorThumbContext} from './ColorThumb';\nimport {LabelContext} from './Label';\nimport React, {createContext, ForwardedRef, forwardRef} from 'react';\nimport {SliderOutputContext, SliderStateContext, SliderTrackContext} from './Slider';\n\nexport interface ColorSliderRenderProps {\n  /**\n   * The orientation of the color slider.\n   * @selector [data-orientation=\"horizontal | vertical\"]\n   */\n  orientation: Orientation,\n  /**\n   * Whether the color slider is disabled.\n   * @selector [data-disabled]\n   */\n  isDisabled: boolean,\n  /**\n   * State of the color slider.\n   */\n  state: ColorSliderState\n}\n\nexport interface ColorSliderProps extends Omit<AriaColorSliderProps, 'label'>, RenderProps<ColorSliderRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorSlider'\n   */\n  className?: ClassNameOrFunction<ColorSliderRenderProps>\n}\n\nexport const ColorSliderStateContext = createContext<ColorSliderState | null>(null);\n\n/**\n * A color slider allows users to adjust an individual channel of a color value.\n */\nexport const ColorSlider = forwardRef(function ColorSlider(props: ColorSliderProps, ref: ForwardedRef<HTMLDivElement>) {\n  [props, ref] = useContextProps(props, ref, ColorSliderContext);\n  let {locale} = useLocale();\n  let state = useColorSliderState({...props, locale});\n  let trackRef = React.useRef(null);\n  let inputRef = React.useRef(null);\n\n  let [labelRef, label] = useSlot(\n    !props['aria-label'] && !props['aria-labelledby']\n  );\n  let {\n    trackProps,\n    thumbProps,\n    inputProps,\n    labelProps,\n    outputProps\n  } = useColorSlider({\n    ...props,\n    label,\n    trackRef,\n    inputRef\n  }, state);\n\n  let renderProps = useRenderProps({\n    ...props,\n    values: {\n      orientation: state.orientation,\n      isDisabled: state.isDisabled,\n      state\n    },\n    defaultClassName: 'react-aria-ColorSlider'\n  });\n\n  let DOMProps = filterDOMProps(props, {global: true});\n  delete DOMProps.id;\n\n  return (\n    <Provider\n      values={[\n        [ColorSliderStateContext, state],\n        [SliderStateContext, state],\n        [SliderTrackContext, {...trackProps, ref: trackRef}],\n        [SliderOutputContext, outputProps],\n        [LabelContext, {\n          ...labelProps,\n          ref: labelRef,\n          children: state.value.getChannelName(props.channel, locale)\n        }],\n        [InternalColorThumbContext, {state, thumbProps, inputXRef: inputRef, xInputProps: inputProps, isDisabled: props.isDisabled}]\n      ]}>\n      <div\n        {...DOMProps}\n        {...renderProps}\n        ref={ref}\n        slot={props.slot || undefined}\n        data-orientation={state.orientation}\n        data-disabled={state.isDisabled || undefined} />\n    </Provider>\n  );\n});\n"],"names":[],"version":3,"file":"ColorSlider.module.js.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;AA6CO,MAAM,0DAA0B,CAAA,GAAA,oBAAY,EAA2B;AAKvE,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAAiC;IACnH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK,CAAA,GAAA,yCAAiB;IAC5D,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,gBAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,0BAAkB,EAAE;QAAC,GAAG,KAAK;gBAAE;IAAM;IACjD,IAAI,WAAW,CAAA,GAAA,YAAI,EAAE,MAAM,CAAC;IAC5B,IAAI,WAAW,CAAA,GAAA,YAAI,EAAE,MAAM,CAAC;IAE5B,IAAI,CAAC,UAAU,MAAM,GAAG,CAAA,GAAA,yCAAM,EAC5B,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,KAAK,CAAC,kBAAkB;IAEnD,IAAI,cACF,UAAU,cACV,UAAU,cACV,UAAU,cACV,UAAU,eACV,WAAW,EACZ,GAAG,CAAA,GAAA,qBAAa,EAAE;QACjB,GAAG,KAAK;eACR;kBACA;kBACA;IACF,GAAG;IAEH,IAAI,cAAc,CAAA,GAAA,uCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,QAAQ;YACN,aAAa,MAAM,WAAW;YAC9B,YAAY,MAAM,UAAU;mBAC5B;QACF;QACA,kBAAkB;IACpB;IAEA,IAAI,WAAW,CAAA,GAAA,qBAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,gCAAC,CAAA,GAAA,yCAAO;QACN,QAAQ;YACN;gBAAC;gBAAyB;aAAM;YAChC;gBAAC,CAAA,GAAA,yCAAiB;gBAAG;aAAM;YAC3B;gBAAC,CAAA,GAAA,yCAAiB;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YACpD;gBAAC,CAAA,GAAA,yCAAkB;gBAAG;aAAY;YAClC;gBAAC,CAAA,GAAA,yCAAW;gBAAG;oBACb,GAAG,UAAU;oBACb,KAAK;oBACL,UAAU,MAAM,KAAK,CAAC,cAAc,CAAC,MAAM,OAAO,EAAE;gBACtD;aAAE;YACF;gBAAC,CAAA,GAAA,yCAAwB;gBAAG;2BAAC;gCAAO;oBAAY,WAAW;oBAAU,aAAa;oBAAY,YAAY,MAAM,UAAU;gBAAA;aAAE;SAC7H;qBACD,gCAAC,CAAA,GAAA,yCAAE,EAAE,GAAG;QACL,GAAG,QAAQ;QACX,GAAG,WAAW;QACf,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,oBAAkB,MAAM,WAAW;QACnC,iBAAe,MAAM,UAAU,IAAI;;AAG3C","sources":["packages/react-aria-components/src/ColorSlider.tsx"],"sourcesContent":["import {AriaColorSliderProps, Orientation, useColorSlider, useLocale} from 'react-aria';\nimport {\n  ClassNameOrFunction,\n  dom,\n  Provider,\n  RenderProps,\n  SlotProps,\n  useContextProps,\n  useRenderProps,\n  useSlot\n} from './utils';\nimport {ColorSliderContext} from './RSPContexts';\nimport {ColorSliderState, useColorSliderState} from 'react-stately';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {GlobalDOMAttributes} from '@react-types/shared';\nimport {InternalColorThumbContext} from './ColorThumb';\nimport {LabelContext} from './Label';\nimport React, {createContext, ForwardedRef, forwardRef} from 'react';\nimport {SliderOutputContext, SliderStateContext, SliderTrackContext} from './Slider';\n\nexport interface ColorSliderRenderProps {\n  /**\n   * The orientation of the color slider.\n   * @selector [data-orientation=\"horizontal | vertical\"]\n   */\n  orientation: Orientation,\n  /**\n   * Whether the color slider is disabled.\n   * @selector [data-disabled]\n   */\n  isDisabled: boolean,\n  /**\n   * State of the color slider.\n   */\n  state: ColorSliderState\n}\n\nexport interface ColorSliderProps extends Omit<AriaColorSliderProps, 'label'>, RenderProps<ColorSliderRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorSlider'\n   */\n  className?: ClassNameOrFunction<ColorSliderRenderProps>\n}\n\nexport const ColorSliderStateContext = createContext<ColorSliderState | null>(null);\n\n/**\n * A color slider allows users to adjust an individual channel of a color value.\n */\nexport const ColorSlider = forwardRef(function ColorSlider(props: ColorSliderProps, ref: ForwardedRef<HTMLDivElement>) {\n  [props, ref] = useContextProps(props, ref, ColorSliderContext);\n  let {locale} = useLocale();\n  let state = useColorSliderState({...props, locale});\n  let trackRef = React.useRef(null);\n  let inputRef = React.useRef(null);\n\n  let [labelRef, label] = useSlot(\n    !props['aria-label'] && !props['aria-labelledby']\n  );\n  let {\n    trackProps,\n    thumbProps,\n    inputProps,\n    labelProps,\n    outputProps\n  } = useColorSlider({\n    ...props,\n    label,\n    trackRef,\n    inputRef\n  }, state);\n\n  let renderProps = useRenderProps({\n    ...props,\n    values: {\n      orientation: state.orientation,\n      isDisabled: state.isDisabled,\n      state\n    },\n    defaultClassName: 'react-aria-ColorSlider'\n  });\n\n  let DOMProps = filterDOMProps(props, {global: true});\n  delete DOMProps.id;\n\n  return (\n    <Provider\n      values={[\n        [ColorSliderStateContext, state],\n        [SliderStateContext, state],\n        [SliderTrackContext, {...trackProps, ref: trackRef}],\n        [SliderOutputContext, outputProps],\n        [LabelContext, {\n          ...labelProps,\n          ref: labelRef,\n          children: state.value.getChannelName(props.channel, locale)\n        }],\n        [InternalColorThumbContext, {state, thumbProps, inputXRef: inputRef, xInputProps: inputProps, isDisabled: props.isDisabled}]\n      ]}>\n      <dom.div\n        {...DOMProps}\n        {...renderProps}\n        ref={ref}\n        slot={props.slot || undefined}\n        data-orientation={state.orientation}\n        data-disabled={state.isDisabled || undefined} />\n    </Provider>\n  );\n});\n"],"names":[],"version":3,"file":"ColorSlider.module.js.map"}

package/dist/ColorSwatch.main.js

@@ -33,7 +33,7 @@ const $804cfb3beb27b520$export$cae13e90592f246a = /*#__PURE__*/ (0, $8RzkX$react
     let DOMProps = (0, $8RzkX$reactariautils.filterDOMProps)(props, {
         global: true
     });
-    return /*#__PURE__*/ (0, ($parcel$interopDefault($8RzkX$react))).createElement("div", {
+    return /*#__PURE__*/ (0, ($parcel$interopDefault($8RzkX$react))).createElement((0, $c5ccf687772c0422$exports.dom).div, {
         ...(0, $8RzkX$reactariautils.mergeProps)(DOMProps, colorSwatchProps, renderProps),
         slot: props.slot || undefined,
         ref: ref

package/dist/ColorSwatch.main.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;AA2BO,MAAM,0DAAqB,CAAA,GAAA,0BAAY,EAAkD;AAKzF,MAAM,0DAAc,CAAA,GAAA,uBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAAiC;IACnH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,oBAAC,gBAAgB,SAAE,KAAK,EAAC,GAAG,CAAA,GAAA,+BAAa,EAAE;IAC/C,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,kBAAkB;QAClB,cAAc,iBAAiB,KAAK;QACpC,QAAQ;mBACN;QACF;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,oCAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAElD,qBACE,0DAAC;QACE,GAAG,CAAA,GAAA,gCAAS,EAAE,UAAU,kBAAkB,YAAY;QACvD,MAAM,MAAM,IAAI,IAAI;QACpB,KAAK;;AAEX","sources":["packages/react-aria-components/src/ColorSwatch.tsx"],"sourcesContent":["import {AriaColorSwatchProps, useColorSwatch} from 'react-aria';\nimport {\n  ClassNameOrFunction,\n  ContextValue,\n  SlotProps,\n  StyleRenderProps,\n  useContextProps,\n  useRenderProps\n} from './utils';\nimport {Color} from 'react-stately';\nimport {filterDOMProps, mergeProps} from '@react-aria/utils';\nimport {GlobalDOMAttributes} from '@react-types/shared';\nimport React, {createContext, ForwardedRef, forwardRef} from 'react';\n\nexport interface ColorSwatchRenderProps {\n  /** The color of the swatch. */\n  color: Color\n}\n\nexport interface ColorSwatchProps extends AriaColorSwatchProps, StyleRenderProps<ColorSwatchRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorSwatch'\n   */\n  className?: ClassNameOrFunction<ColorSwatchRenderProps>\n}\n\nexport const ColorSwatchContext = createContext<ContextValue<ColorSwatchProps, HTMLDivElement>>(null);\n\n/**\n * A ColorSwatch displays a preview of a selected color.\n */\nexport const ColorSwatch = forwardRef(function ColorSwatch(props: ColorSwatchProps, ref: ForwardedRef<HTMLDivElement>) {\n  [props, ref] = useContextProps(props, ref, ColorSwatchContext);\n  let {colorSwatchProps, color} = useColorSwatch(props);\n  let renderProps = useRenderProps({\n    ...props,\n    defaultClassName: 'react-aria-ColorSwatch',\n    defaultStyle: colorSwatchProps.style,\n    values: {\n      color\n    }\n  });\n\n  let DOMProps = filterDOMProps(props, {global: true});\n  \n  return (\n    <div\n      {...mergeProps(DOMProps, colorSwatchProps, renderProps)}\n      slot={props.slot || undefined}\n      ref={ref} />\n  );\n});\n"],"names":[],"version":3,"file":"ColorSwatch.main.js.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;AA4BO,MAAM,0DAAqB,CAAA,GAAA,0BAAY,EAAkD;AAKzF,MAAM,0DAAc,CAAA,GAAA,uBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAAiC;IACnH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,oBAAC,gBAAgB,SAAE,KAAK,EAAC,GAAG,CAAA,GAAA,+BAAa,EAAE;IAC/C,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,kBAAkB;QAClB,cAAc,iBAAiB,KAAK;QACpC,QAAQ;mBACN;QACF;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,oCAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAElD,qBACE,0DAAC,CAAA,GAAA,6BAAE,EAAE,GAAG;QACL,GAAG,CAAA,GAAA,gCAAS,EAAE,UAAU,kBAAkB,YAAY;QACvD,MAAM,MAAM,IAAI,IAAI;QACpB,KAAK;;AAEX","sources":["packages/react-aria-components/src/ColorSwatch.tsx"],"sourcesContent":["import {AriaColorSwatchProps, useColorSwatch} from 'react-aria';\nimport {\n  ClassNameOrFunction,\n  ContextValue,\n  dom,\n  SlotProps,\n  StyleRenderProps,\n  useContextProps,\n  useRenderProps\n} from './utils';\nimport {Color} from 'react-stately';\nimport {filterDOMProps, mergeProps} from '@react-aria/utils';\nimport {GlobalDOMAttributes} from '@react-types/shared';\nimport React, {createContext, ForwardedRef, forwardRef} from 'react';\n\nexport interface ColorSwatchRenderProps {\n  /** The color of the swatch. */\n  color: Color\n}\n\nexport interface ColorSwatchProps extends AriaColorSwatchProps, StyleRenderProps<ColorSwatchRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorSwatch'\n   */\n  className?: ClassNameOrFunction<ColorSwatchRenderProps>\n}\n\nexport const ColorSwatchContext = createContext<ContextValue<ColorSwatchProps, HTMLDivElement>>(null);\n\n/**\n * A ColorSwatch displays a preview of a selected color.\n */\nexport const ColorSwatch = forwardRef(function ColorSwatch(props: ColorSwatchProps, ref: ForwardedRef<HTMLDivElement>) {\n  [props, ref] = useContextProps(props, ref, ColorSwatchContext);\n  let {colorSwatchProps, color} = useColorSwatch(props);\n  let renderProps = useRenderProps({\n    ...props,\n    defaultClassName: 'react-aria-ColorSwatch',\n    defaultStyle: colorSwatchProps.style,\n    values: {\n      color\n    }\n  });\n\n  let DOMProps = filterDOMProps(props, {global: true});\n  \n  return (\n    <dom.div\n      {...mergeProps(DOMProps, colorSwatchProps, renderProps)}\n      slot={props.slot || undefined}\n      ref={ref} />\n  );\n});\n"],"names":[],"version":3,"file":"ColorSwatch.main.js.map"}

package/dist/ColorSwatch.mjs

@@ -1,4 +1,4 @@
-import {useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from "./utils.mjs";
+import {dom as $64fa3d84918910a7$export$df3a06d6289f983e, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from "./utils.mjs";
 import {useColorSwatch as $dfXrE$useColorSwatch} from "react-aria";
 import {filterDOMProps as $dfXrE$filterDOMProps, mergeProps as $dfXrE$mergeProps} from "@react-aria/utils";
 import $dfXrE$react, {createContext as $dfXrE$createContext, forwardRef as $dfXrE$forwardRef} from "react";
@@ -22,7 +22,7 @@ const $251c695a52d94a8d$export$cae13e90592f246a = /*#__PURE__*/ (0, $dfXrE$forwa
     let DOMProps = (0, $dfXrE$filterDOMProps)(props, {
         global: true
     });
-    return /*#__PURE__*/ (0, $dfXrE$react).createElement("div", {
+    return /*#__PURE__*/ (0, $dfXrE$react).createElement((0, $64fa3d84918910a7$export$df3a06d6289f983e).div, {
         ...(0, $dfXrE$mergeProps)(DOMProps, colorSwatchProps, renderProps),
         slot: props.slot || undefined,
         ref: ref

package/dist/ColorSwatch.module.js

@@ -1,4 +1,4 @@
-import {useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from "./utils.module.js";
+import {dom as $64fa3d84918910a7$export$df3a06d6289f983e, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from "./utils.module.js";
 import {useColorSwatch as $dfXrE$useColorSwatch} from "react-aria";
 import {filterDOMProps as $dfXrE$filterDOMProps, mergeProps as $dfXrE$mergeProps} from "@react-aria/utils";
 import $dfXrE$react, {createContext as $dfXrE$createContext, forwardRef as $dfXrE$forwardRef} from "react";
@@ -22,7 +22,7 @@ const $251c695a52d94a8d$export$cae13e90592f246a = /*#__PURE__*/ (0, $dfXrE$forwa
     let DOMProps = (0, $dfXrE$filterDOMProps)(props, {
         global: true
     });
-    return /*#__PURE__*/ (0, $dfXrE$react).createElement("div", {
+    return /*#__PURE__*/ (0, $dfXrE$react).createElement((0, $64fa3d84918910a7$export$df3a06d6289f983e).div, {
         ...(0, $dfXrE$mergeProps)(DOMProps, colorSwatchProps, renderProps),
         slot: props.slot || undefined,
         ref: ref

package/dist/ColorSwatch.module.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;AA2BO,MAAM,0DAAqB,CAAA,GAAA,oBAAY,EAAkD;AAKzF,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAAiC;IACnH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,oBAAC,gBAAgB,SAAE,KAAK,EAAC,GAAG,CAAA,GAAA,qBAAa,EAAE;IAC/C,IAAI,cAAc,CAAA,GAAA,uCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,kBAAkB;QAClB,cAAc,iBAAiB,KAAK;QACpC,QAAQ;mBACN;QACF;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,qBAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAElD,qBACE,gCAAC;QACE,GAAG,CAAA,GAAA,iBAAS,EAAE,UAAU,kBAAkB,YAAY;QACvD,MAAM,MAAM,IAAI,IAAI;QACpB,KAAK;;AAEX","sources":["packages/react-aria-components/src/ColorSwatch.tsx"],"sourcesContent":["import {AriaColorSwatchProps, useColorSwatch} from 'react-aria';\nimport {\n  ClassNameOrFunction,\n  ContextValue,\n  SlotProps,\n  StyleRenderProps,\n  useContextProps,\n  useRenderProps\n} from './utils';\nimport {Color} from 'react-stately';\nimport {filterDOMProps, mergeProps} from '@react-aria/utils';\nimport {GlobalDOMAttributes} from '@react-types/shared';\nimport React, {createContext, ForwardedRef, forwardRef} from 'react';\n\nexport interface ColorSwatchRenderProps {\n  /** The color of the swatch. */\n  color: Color\n}\n\nexport interface ColorSwatchProps extends AriaColorSwatchProps, StyleRenderProps<ColorSwatchRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorSwatch'\n   */\n  className?: ClassNameOrFunction<ColorSwatchRenderProps>\n}\n\nexport const ColorSwatchContext = createContext<ContextValue<ColorSwatchProps, HTMLDivElement>>(null);\n\n/**\n * A ColorSwatch displays a preview of a selected color.\n */\nexport const ColorSwatch = forwardRef(function ColorSwatch(props: ColorSwatchProps, ref: ForwardedRef<HTMLDivElement>) {\n  [props, ref] = useContextProps(props, ref, ColorSwatchContext);\n  let {colorSwatchProps, color} = useColorSwatch(props);\n  let renderProps = useRenderProps({\n    ...props,\n    defaultClassName: 'react-aria-ColorSwatch',\n    defaultStyle: colorSwatchProps.style,\n    values: {\n      color\n    }\n  });\n\n  let DOMProps = filterDOMProps(props, {global: true});\n  \n  return (\n    <div\n      {...mergeProps(DOMProps, colorSwatchProps, renderProps)}\n      slot={props.slot || undefined}\n      ref={ref} />\n  );\n});\n"],"names":[],"version":3,"file":"ColorSwatch.module.js.map"}
+{"mappings":";;;;;;;;;AA4BO,MAAM,0DAAqB,CAAA,GAAA,oBAAY,EAAkD;AAKzF,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAAiC;IACnH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,oBAAC,gBAAgB,SAAE,KAAK,EAAC,GAAG,CAAA,GAAA,qBAAa,EAAE;IAC/C,IAAI,cAAc,CAAA,GAAA,uCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,kBAAkB;QAClB,cAAc,iBAAiB,KAAK;QACpC,QAAQ;mBACN;QACF;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,qBAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAElD,qBACE,gCAAC,CAAA,GAAA,yCAAE,EAAE,GAAG;QACL,GAAG,CAAA,GAAA,iBAAS,EAAE,UAAU,kBAAkB,YAAY;QACvD,MAAM,MAAM,IAAI,IAAI;QACpB,KAAK;;AAEX","sources":["packages/react-aria-components/src/ColorSwatch.tsx"],"sourcesContent":["import {AriaColorSwatchProps, useColorSwatch} from 'react-aria';\nimport {\n  ClassNameOrFunction,\n  ContextValue,\n  dom,\n  SlotProps,\n  StyleRenderProps,\n  useContextProps,\n  useRenderProps\n} from './utils';\nimport {Color} from 'react-stately';\nimport {filterDOMProps, mergeProps} from '@react-aria/utils';\nimport {GlobalDOMAttributes} from '@react-types/shared';\nimport React, {createContext, ForwardedRef, forwardRef} from 'react';\n\nexport interface ColorSwatchRenderProps {\n  /** The color of the swatch. */\n  color: Color\n}\n\nexport interface ColorSwatchProps extends AriaColorSwatchProps, StyleRenderProps<ColorSwatchRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorSwatch'\n   */\n  className?: ClassNameOrFunction<ColorSwatchRenderProps>\n}\n\nexport const ColorSwatchContext = createContext<ContextValue<ColorSwatchProps, HTMLDivElement>>(null);\n\n/**\n * A ColorSwatch displays a preview of a selected color.\n */\nexport const ColorSwatch = forwardRef(function ColorSwatch(props: ColorSwatchProps, ref: ForwardedRef<HTMLDivElement>) {\n  [props, ref] = useContextProps(props, ref, ColorSwatchContext);\n  let {colorSwatchProps, color} = useColorSwatch(props);\n  let renderProps = useRenderProps({\n    ...props,\n    defaultClassName: 'react-aria-ColorSwatch',\n    defaultStyle: colorSwatchProps.style,\n    values: {\n      color\n    }\n  });\n\n  let DOMProps = filterDOMProps(props, {global: true});\n  \n  return (\n    <dom.div\n      {...mergeProps(DOMProps, colorSwatchProps, renderProps)}\n      slot={props.slot || undefined}\n      ref={ref} />\n  );\n});\n"],"names":[],"version":3,"file":"ColorSwatch.module.js.map"}

package/dist/ColorSwatchPicker.main.js

@@ -84,6 +84,8 @@ const $4adbbc5a2d33d279$export$abcd89c27081c2ef = /*#__PURE__*/ (0, $1ahOz$react
     };
     return /*#__PURE__*/ (0, ($parcel$interopDefault($1ahOz$react))).createElement((0, $a03b42240404b420$exports.ListBoxItem), {
         ...props,
+        // ColorSwatchPickerItem is never a link.
+        render: props.render,
         ref: ref,
         id: color.toString('hexa'),
         textValue: color.getColorName(locale),

package/dist/ColorSwatchPicker.main.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCO,MAAM,0DAA2B,CAAA,GAAA,0BAAY,EAAwD;AAC5G,MAAM,sDAAkB,CAAA,GAAA,0BAAY,EAA6B;AAK1D,MAAM,0DAAoB,CAAA,GAAA,uBAAS,EAAE,SAAS,kBAAkB,KAA6B,EAAE,GAAiC;IACrI,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,QAAQ,CAAA,GAAA,uCAAkB,EAAE;IAChC,IAAI,WAAW,CAAA,GAAA,oBAAM,EAAE,IAAM,IAAI,OAAO,EAAE;IAC1C,IAAI,YAAY,CAAA,GAAA,4CAA0B,EAAE,CAAA,GAAA,mDAAW,GAAG;IAE1D,qBACE,0DAAC,CAAA,GAAA,iCAAM;QACJ,GAAG,CAAA,GAAA,oCAAa,EAAE,OAAO;YAAC,WAAW;QAAI,EAAE;QAC5C,KAAK;QACL,WAAW,MAAM,SAAS,IAAI;QAC9B,OAAO,MAAM,KAAK;QAClB,cAAY,KAAK,CAAC,aAAa,IAAK,CAAA,CAAC,KAAK,CAAC,kBAAkB,GAAG,UAAU,MAAM,CAAC,uBAAuB,SAAQ;QAChH,QAAQ,MAAM,MAAM,IAAI;QACxB,eAAc;QACd,cAAc;YAAC,MAAM,KAAK,CAAC,QAAQ,CAAC;SAAQ;QAC5C,mBAAmB,CAAC;YAClB,yDAAyD;YACzD,IAAI,SAAS,OACX,MAAM,QAAQ,CAAC,SAAS,GAAG,CAAC;mBAAI;aAAK,CAAC,EAAE;QAE5C;QACA,wBAAA;qBACA,0DAAC,sCAAgB,QAAQ;QAAC,OAAO;OAC9B,MAAM,QAAQ;AAIvB;AAmBO,MAAM,0DAAwB,CAAA,GAAA,uBAAS,EAAE,SAAS,sBAAsB,KAAiC,EAAE,GAAiC;IACjJ,IAAI,YAAY,MAAM,KAAK,IAAI;IAC/B,IAAI,QAAQ,CAAA,GAAA,oBAAM,EAAE,IAAM,OAAO,cAAc,WAAW,CAAA,GAAA,8BAAS,EAAE,aAAa,WAAW;QAAC;KAAU;IACxG,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,0BAAQ;IACvB,IAAI,MAAM,CAAA,GAAA,uBAAS,EAAE;IACrB,CAAA,GAAA,sBAAQ,EAAE;QACR,IAAI,MAAM,MAAM,QAAQ,CAAC;QACzB,IAAI,GAAG,CAAC,KAAK;QACb,OAAO;YACL,IAAI,MAAM,CAAC;QACb;IACF,GAAG;QAAC;QAAO;KAAI;IAEf,IAAI,OAAO,CAAC;QACV,IAAI,OAAO,MAAM,YACf,OAAO,CAAC,cAAgB,EAAE;gBAAC,GAAG,WAAW;uBAAE;YAAK;QAElD,OAAO;IACT;IAEA,qBACE,0DAAC,CAAA,GAAA,qCAAU;QACR,GAAG,KAAK;QACT,KAAK;QACL,IAAI,MAAM,QAAQ,CAAC;QACnB,WAAW,MAAM,YAAY,CAAC;QAC9B,WAAW,KAAK,MAAM,SAAS,IAAI;QACnC,OAAO,KAAK,MAAM,KAAK;OACtB,CAAA,GAAA,4CAAiB,EAAE,KAAK,MAAM,QAAQ,GAAG,CAAA,yBACxC,0DAAC,CAAA,GAAA,4CAAiB,EAAE,QAAQ;YAAC,OAAO;uBAAC;YAAK;WACvC;AAKX","sources":["packages/react-aria-components/src/ColorSwatchPicker.tsx"],"sourcesContent":["import {AriaLabelingProps, GlobalDOMAttributes, HoverEvents, PressEvents, ValueBase} from '@react-types/shared';\nimport {\n  ClassNameOrFunction,\n  composeRenderProps,\n  ContextValue,\n  RenderProps,\n  StyleRenderProps,\n  useContextProps\n} from './utils';\nimport {Color, parseColor, useColorPickerState} from 'react-stately';\nimport {ColorSwatchContext} from './ColorSwatch';\nimport {filterDOMProps} from '@react-aria/utils';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListBox, ListBoxItem, ListBoxItemRenderProps, ListBoxRenderProps} from './ListBox';\nimport React, {createContext, ForwardedRef, forwardRef, ReactNode, useContext, useEffect, useMemo} from 'react';\nimport {useLocale, useLocalizedStringFormatter} from 'react-aria';\n\nexport interface ColorSwatchPickerRenderProps extends Omit<ListBoxRenderProps, 'isDropTarget'> {}\nexport interface ColorSwatchPickerProps extends ValueBase<string | Color, Color>, AriaLabelingProps, StyleRenderProps<ColorSwatchPickerRenderProps>, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorSwatchPicker'\n   */\n  className?: ClassNameOrFunction<ColorSwatchPickerRenderProps>,\n  /** The children of the ColorSwatchPicker. */\n  children?: ReactNode,\n  /**\n   * Whether the items are arranged in a stack or grid.\n   * @default 'grid'\n   */\n  layout?: 'grid' | 'stack'\n}\n\nexport const ColorSwatchPickerContext = createContext<ContextValue<ColorSwatchPickerProps, HTMLDivElement>>(null);\nconst ColorMapContext = createContext<Map<string, Color> | null>(null);\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: ColorSwatchPickerProps, ref: ForwardedRef<HTMLDivElement>) {\n  [props, ref] = useContextProps(props, ref, ColorSwatchPickerContext);\n  let state = useColorPickerState(props);\n  let colorMap = useMemo(() => new Map(), []);\n  let formatter = useLocalizedStringFormatter(intlMessages, 'react-aria-components');\n\n  return (\n    <ListBox\n      {...filterDOMProps(props, {labelable: true})}\n      ref={ref}\n      className={props.className || 'react-aria-ColorSwatchPicker'}\n      style={props.style}\n      aria-label={props['aria-label'] || (!props['aria-labelledby'] ? formatter.format('colorSwatchPicker') : undefined)}\n      layout={props.layout || 'grid'}\n      selectionMode=\"single\"\n      selectedKeys={[state.color.toString('hexa')]}\n      onSelectionChange={(keys) => {\n        // single select, 'all' cannot occur. appease typescript.\n        if (keys !== 'all') {\n          state.setColor(colorMap.get([...keys][0]));\n        }\n      }}\n      disallowEmptySelection>\n      <ColorMapContext.Provider value={colorMap}>\n        {props.children}\n      </ColorMapContext.Provider>\n    </ListBox>\n  );\n});\n\nexport interface ColorSwatchPickerItemRenderProps extends Omit<ListBoxItemRenderProps, 'selectionMode' | 'selectionBehavior'> {\n  /** The color of the swatch. */\n  color: Color\n}\n\nexport interface ColorSwatchPickerItemProps extends RenderProps<ColorSwatchPickerItemRenderProps>, HoverEvents, PressEvents, Omit<GlobalDOMAttributes<HTMLDivElement>, 'onClick'> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorSwatchPickerItem'\n   */\n  className?: ClassNameOrFunction<ColorSwatchPickerItemRenderProps>,\n  /** The color of the swatch. */\n  color: string | Color,\n  /** Whether the color swatch is disabled. */\n  isDisabled?: boolean\n}\n\nexport const ColorSwatchPickerItem = forwardRef(function ColorSwatchPickerItem(props: ColorSwatchPickerItemProps, ref: ForwardedRef<HTMLDivElement>) {\n  let propColor = props.color || '#0000';\n  let color = useMemo(() => typeof propColor === 'string' ? parseColor(propColor) : propColor, [propColor]);\n  let {locale} = useLocale();\n  let map = useContext(ColorMapContext)!;\n  useEffect(() => {\n    let key = color.toString('hexa');\n    map.set(key, color);\n    return () => {\n      map.delete(key);\n    };\n  }, [color, map]);\n\n  let wrap = (v) => {\n    if (typeof v === 'function') {\n      return (renderProps) => v({...renderProps, color});\n    }\n    return v;\n  };\n\n  return (\n    <ListBoxItem\n      {...props}\n      ref={ref}\n      id={color.toString('hexa')}\n      textValue={color.getColorName(locale)}\n      className={wrap(props.className || 'react-aria-ColorSwatchPickerItem')}\n      style={wrap(props.style)}>\n      {composeRenderProps(wrap(props.children), children => (\n        <ColorSwatchContext.Provider value={{color}}>\n          {children}\n        </ColorSwatchContext.Provider>\n      ))}\n    </ListBoxItem>\n  );\n});\n"],"names":[],"version":3,"file":"ColorSwatchPicker.main.js.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCO,MAAM,0DAA2B,CAAA,GAAA,0BAAY,EAAwD;AAC5G,MAAM,sDAAkB,CAAA,GAAA,0BAAY,EAA6B;AAK1D,MAAM,0DAAoB,CAAA,GAAA,uBAAS,EAAE,SAAS,kBAAkB,KAA6B,EAAE,GAAiC;IACrI,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,QAAQ,CAAA,GAAA,uCAAkB,EAAE;IAChC,IAAI,WAAW,CAAA,GAAA,oBAAM,EAAE,IAAM,IAAI,OAAO,EAAE;IAC1C,IAAI,YAAY,CAAA,GAAA,4CAA0B,EAAE,CAAA,GAAA,mDAAW,GAAG;IAE1D,qBACE,0DAAC,CAAA,GAAA,iCAAM;QACJ,GAAG,CAAA,GAAA,oCAAa,EAAE,OAAO;YAAC,WAAW;QAAI,EAAE;QAC5C,KAAK;QACL,WAAW,MAAM,SAAS,IAAI;QAC9B,OAAO,MAAM,KAAK;QAClB,cAAY,KAAK,CAAC,aAAa,IAAK,CAAA,CAAC,KAAK,CAAC,kBAAkB,GAAG,UAAU,MAAM,CAAC,uBAAuB,SAAQ;QAChH,QAAQ,MAAM,MAAM,IAAI;QACxB,eAAc;QACd,cAAc;YAAC,MAAM,KAAK,CAAC,QAAQ,CAAC;SAAQ;QAC5C,mBAAmB,CAAC;YAClB,yDAAyD;YACzD,IAAI,SAAS,OACX,MAAM,QAAQ,CAAC,SAAS,GAAG,CAAC;mBAAI;aAAK,CAAC,EAAE;QAE5C;QACA,wBAAA;qBACA,0DAAC,sCAAgB,QAAQ;QAAC,OAAO;OAC9B,MAAM,QAAQ;AAIvB;AAmBO,MAAM,0DAAwB,CAAA,GAAA,uBAAS,EAAE,SAAS,sBAAsB,KAAiC,EAAE,GAAiC;IACjJ,IAAI,YAAY,MAAM,KAAK,IAAI;IAC/B,IAAI,QAAQ,CAAA,GAAA,oBAAM,EAAE,IAAM,OAAO,cAAc,WAAW,CAAA,GAAA,8BAAS,EAAE,aAAa,WAAW;QAAC;KAAU;IACxG,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,0BAAQ;IACvB,IAAI,MAAM,CAAA,GAAA,uBAAS,EAAE;IACrB,CAAA,GAAA,sBAAQ,EAAE;QACR,IAAI,MAAM,MAAM,QAAQ,CAAC;QACzB,IAAI,GAAG,CAAC,KAAK;QACb,OAAO;YACL,IAAI,MAAM,CAAC;QACb;IACF,GAAG;QAAC;QAAO;KAAI;IAEf,IAAI,OAAO,CAAC;QACV,IAAI,OAAO,MAAM,YACf,OAAO,CAAC,cAAgB,EAAE;gBAAC,GAAG,WAAW;uBAAE;YAAK;QAElD,OAAO;IACT;IAEA,qBACE,0DAAC,CAAA,GAAA,qCAAU;QACR,GAAG,KAAK;QACT,yCAAyC;QACzC,QAAQ,MAAM,MAAM;QACpB,KAAK;QACL,IAAI,MAAM,QAAQ,CAAC;QACnB,WAAW,MAAM,YAAY,CAAC;QAC9B,WAAW,KAAK,MAAM,SAAS,IAAI;QACnC,OAAO,KAAK,MAAM,KAAK;OACtB,CAAA,GAAA,4CAAiB,EAAE,KAAK,MAAM,QAAQ,GAAG,CAAA,yBACxC,0DAAC,CAAA,GAAA,4CAAiB,EAAE,QAAQ;YAAC,OAAO;uBAAC;YAAK;WACvC;AAKX","sources":["packages/react-aria-components/src/ColorSwatchPicker.tsx"],"sourcesContent":["import {AriaLabelingProps, GlobalDOMAttributes, HoverEvents, PressEvents, ValueBase} from '@react-types/shared';\nimport {\n  ClassNameOrFunction,\n  composeRenderProps,\n  ContextValue,\n  RenderProps,\n  StyleRenderProps,\n  useContextProps\n} from './utils';\nimport {Color, parseColor, useColorPickerState} from 'react-stately';\nimport {ColorSwatchContext} from './ColorSwatch';\nimport {filterDOMProps} from '@react-aria/utils';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListBox, ListBoxItem, ListBoxItemRenderProps, ListBoxRenderProps} from './ListBox';\nimport React, {createContext, ForwardedRef, forwardRef, ReactNode, useContext, useEffect, useMemo} from 'react';\nimport {useLocale, useLocalizedStringFormatter} from 'react-aria';\n\nexport interface ColorSwatchPickerRenderProps extends Omit<ListBoxRenderProps, 'isDropTarget'> {}\nexport interface ColorSwatchPickerProps extends ValueBase<string | Color, Color>, AriaLabelingProps, StyleRenderProps<ColorSwatchPickerRenderProps>, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorSwatchPicker'\n   */\n  className?: ClassNameOrFunction<ColorSwatchPickerRenderProps>,\n  /** The children of the ColorSwatchPicker. */\n  children?: ReactNode,\n  /**\n   * Whether the items are arranged in a stack or grid.\n   * @default 'grid'\n   */\n  layout?: 'grid' | 'stack'\n}\n\nexport const ColorSwatchPickerContext = createContext<ContextValue<ColorSwatchPickerProps, HTMLDivElement>>(null);\nconst ColorMapContext = createContext<Map<string, Color> | null>(null);\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: ColorSwatchPickerProps, ref: ForwardedRef<HTMLDivElement>) {\n  [props, ref] = useContextProps(props, ref, ColorSwatchPickerContext);\n  let state = useColorPickerState(props);\n  let colorMap = useMemo(() => new Map(), []);\n  let formatter = useLocalizedStringFormatter(intlMessages, 'react-aria-components');\n\n  return (\n    <ListBox\n      {...filterDOMProps(props, {labelable: true})}\n      ref={ref}\n      className={props.className || 'react-aria-ColorSwatchPicker'}\n      style={props.style}\n      aria-label={props['aria-label'] || (!props['aria-labelledby'] ? formatter.format('colorSwatchPicker') : undefined)}\n      layout={props.layout || 'grid'}\n      selectionMode=\"single\"\n      selectedKeys={[state.color.toString('hexa')]}\n      onSelectionChange={(keys) => {\n        // single select, 'all' cannot occur. appease typescript.\n        if (keys !== 'all') {\n          state.setColor(colorMap.get([...keys][0]));\n        }\n      }}\n      disallowEmptySelection>\n      <ColorMapContext.Provider value={colorMap}>\n        {props.children}\n      </ColorMapContext.Provider>\n    </ListBox>\n  );\n});\n\nexport interface ColorSwatchPickerItemRenderProps extends Omit<ListBoxItemRenderProps, 'selectionMode' | 'selectionBehavior'> {\n  /** The color of the swatch. */\n  color: Color\n}\n\nexport interface ColorSwatchPickerItemProps extends RenderProps<ColorSwatchPickerItemRenderProps>, HoverEvents, PressEvents, Omit<GlobalDOMAttributes<HTMLDivElement>, 'onClick'> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorSwatchPickerItem'\n   */\n  className?: ClassNameOrFunction<ColorSwatchPickerItemRenderProps>,\n  /** The color of the swatch. */\n  color: string | Color,\n  /** Whether the color swatch is disabled. */\n  isDisabled?: boolean\n}\n\nexport const ColorSwatchPickerItem = forwardRef(function ColorSwatchPickerItem(props: ColorSwatchPickerItemProps, ref: ForwardedRef<HTMLDivElement>) {\n  let propColor = props.color || '#0000';\n  let color = useMemo(() => typeof propColor === 'string' ? parseColor(propColor) : propColor, [propColor]);\n  let {locale} = useLocale();\n  let map = useContext(ColorMapContext)!;\n  useEffect(() => {\n    let key = color.toString('hexa');\n    map.set(key, color);\n    return () => {\n      map.delete(key);\n    };\n  }, [color, map]);\n\n  let wrap = (v) => {\n    if (typeof v === 'function') {\n      return (renderProps) => v({...renderProps, color});\n    }\n    return v;\n  };\n\n  return (\n    <ListBoxItem\n      {...props}\n      // ColorSwatchPickerItem is never a link.\n      render={props.render as any}\n      ref={ref}\n      id={color.toString('hexa')}\n      textValue={color.getColorName(locale)}\n      className={wrap(props.className || 'react-aria-ColorSwatchPickerItem')}\n      style={wrap(props.style)}>\n      {composeRenderProps(wrap(props.children), children => (\n        <ColorSwatchContext.Provider value={{color}}>\n          {children}\n        </ColorSwatchContext.Provider>\n      ))}\n    </ListBoxItem>\n  );\n});\n"],"names":[],"version":3,"file":"ColorSwatchPicker.main.js.map"}

package/dist/ColorSwatchPicker.mjs

@@ -76,6 +76,8 @@ const $0bb41941cfe72bd4$export$abcd89c27081c2ef = /*#__PURE__*/ (0, $jTaLw$forwa
     };
     return /*#__PURE__*/ (0, $jTaLw$react).createElement((0, $eed445e0843c11d0$export$a11e76429ed99b4), {
         ...props,
+        // ColorSwatchPickerItem is never a link.
+        render: props.render,
         ref: ref,
         id: color.toString('hexa'),
         textValue: color.getColorName(locale),

package/dist/ColorSwatchPicker.module.js

@@ -76,6 +76,8 @@ const $0bb41941cfe72bd4$export$abcd89c27081c2ef = /*#__PURE__*/ (0, $jTaLw$forwa
     };
     return /*#__PURE__*/ (0, $jTaLw$react).createElement((0, $eed445e0843c11d0$export$a11e76429ed99b4), {
         ...props,
+        // ColorSwatchPickerItem is never a link.
+        render: props.render,
         ref: ref,
         id: color.toString('hexa'),
         textValue: color.getColorName(locale),

package/dist/ColorSwatchPicker.module.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;;AAkCO,MAAM,0DAA2B,CAAA,GAAA,oBAAY,EAAwD;AAC5G,MAAM,sDAAkB,CAAA,GAAA,oBAAY,EAA6B;AAK1D,MAAM,0DAAoB,CAAA,GAAA,iBAAS,EAAE,SAAS,kBAAkB,KAA6B,EAAE,GAAiC;IACrI,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,QAAQ,CAAA,GAAA,0BAAkB,EAAE;IAChC,IAAI,WAAW,CAAA,GAAA,cAAM,EAAE,IAAM,IAAI,OAAO,EAAE;IAC1C,IAAI,YAAY,CAAA,GAAA,kCAA0B,EAAE,CAAA,GAAA,oDAAW,GAAG;IAE1D,qBACE,gCAAC,CAAA,GAAA,yCAAM;QACJ,GAAG,CAAA,GAAA,qBAAa,EAAE,OAAO;YAAC,WAAW;QAAI,EAAE;QAC5C,KAAK;QACL,WAAW,MAAM,SAAS,IAAI;QAC9B,OAAO,MAAM,KAAK;QAClB,cAAY,KAAK,CAAC,aAAa,IAAK,CAAA,CAAC,KAAK,CAAC,kBAAkB,GAAG,UAAU,MAAM,CAAC,uBAAuB,SAAQ;QAChH,QAAQ,MAAM,MAAM,IAAI;QACxB,eAAc;QACd,cAAc;YAAC,MAAM,KAAK,CAAC,QAAQ,CAAC;SAAQ;QAC5C,mBAAmB,CAAC;YAClB,yDAAyD;YACzD,IAAI,SAAS,OACX,MAAM,QAAQ,CAAC,SAAS,GAAG,CAAC;mBAAI;aAAK,CAAC,EAAE;QAE5C;QACA,wBAAA;qBACA,gCAAC,sCAAgB,QAAQ;QAAC,OAAO;OAC9B,MAAM,QAAQ;AAIvB;AAmBO,MAAM,0DAAwB,CAAA,GAAA,iBAAS,EAAE,SAAS,sBAAsB,KAAiC,EAAE,GAAiC;IACjJ,IAAI,YAAY,MAAM,KAAK,IAAI;IAC/B,IAAI,QAAQ,CAAA,GAAA,cAAM,EAAE,IAAM,OAAO,cAAc,WAAW,CAAA,GAAA,iBAAS,EAAE,aAAa,WAAW;QAAC;KAAU;IACxG,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,gBAAQ;IACvB,IAAI,MAAM,CAAA,GAAA,iBAAS,EAAE;IACrB,CAAA,GAAA,gBAAQ,EAAE;QACR,IAAI,MAAM,MAAM,QAAQ,CAAC;QACzB,IAAI,GAAG,CAAC,KAAK;QACb,OAAO;YACL,IAAI,MAAM,CAAC;QACb;IACF,GAAG;QAAC;QAAO;KAAI;IAEf,IAAI,OAAO,CAAC;QACV,IAAI,OAAO,MAAM,YACf,OAAO,CAAC,cAAgB,EAAE;gBAAC,GAAG,WAAW;uBAAE;YAAK;QAElD,OAAO;IACT;IAEA,qBACE,gCAAC,CAAA,GAAA,wCAAU;QACR,GAAG,KAAK;QACT,KAAK;QACL,IAAI,MAAM,QAAQ,CAAC;QACnB,WAAW,MAAM,YAAY,CAAC;QAC9B,WAAW,KAAK,MAAM,SAAS,IAAI;QACnC,OAAO,KAAK,MAAM,KAAK;OACtB,CAAA,GAAA,yCAAiB,EAAE,KAAK,MAAM,QAAQ,GAAG,CAAA,yBACxC,gCAAC,CAAA,GAAA,yCAAiB,EAAE,QAAQ;YAAC,OAAO;uBAAC;YAAK;WACvC;AAKX","sources":["packages/react-aria-components/src/ColorSwatchPicker.tsx"],"sourcesContent":["import {AriaLabelingProps, GlobalDOMAttributes, HoverEvents, PressEvents, ValueBase} from '@react-types/shared';\nimport {\n  ClassNameOrFunction,\n  composeRenderProps,\n  ContextValue,\n  RenderProps,\n  StyleRenderProps,\n  useContextProps\n} from './utils';\nimport {Color, parseColor, useColorPickerState} from 'react-stately';\nimport {ColorSwatchContext} from './ColorSwatch';\nimport {filterDOMProps} from '@react-aria/utils';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListBox, ListBoxItem, ListBoxItemRenderProps, ListBoxRenderProps} from './ListBox';\nimport React, {createContext, ForwardedRef, forwardRef, ReactNode, useContext, useEffect, useMemo} from 'react';\nimport {useLocale, useLocalizedStringFormatter} from 'react-aria';\n\nexport interface ColorSwatchPickerRenderProps extends Omit<ListBoxRenderProps, 'isDropTarget'> {}\nexport interface ColorSwatchPickerProps extends ValueBase<string | Color, Color>, AriaLabelingProps, StyleRenderProps<ColorSwatchPickerRenderProps>, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorSwatchPicker'\n   */\n  className?: ClassNameOrFunction<ColorSwatchPickerRenderProps>,\n  /** The children of the ColorSwatchPicker. */\n  children?: ReactNode,\n  /**\n   * Whether the items are arranged in a stack or grid.\n   * @default 'grid'\n   */\n  layout?: 'grid' | 'stack'\n}\n\nexport const ColorSwatchPickerContext = createContext<ContextValue<ColorSwatchPickerProps, HTMLDivElement>>(null);\nconst ColorMapContext = createContext<Map<string, Color> | null>(null);\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: ColorSwatchPickerProps, ref: ForwardedRef<HTMLDivElement>) {\n  [props, ref] = useContextProps(props, ref, ColorSwatchPickerContext);\n  let state = useColorPickerState(props);\n  let colorMap = useMemo(() => new Map(), []);\n  let formatter = useLocalizedStringFormatter(intlMessages, 'react-aria-components');\n\n  return (\n    <ListBox\n      {...filterDOMProps(props, {labelable: true})}\n      ref={ref}\n      className={props.className || 'react-aria-ColorSwatchPicker'}\n      style={props.style}\n      aria-label={props['aria-label'] || (!props['aria-labelledby'] ? formatter.format('colorSwatchPicker') : undefined)}\n      layout={props.layout || 'grid'}\n      selectionMode=\"single\"\n      selectedKeys={[state.color.toString('hexa')]}\n      onSelectionChange={(keys) => {\n        // single select, 'all' cannot occur. appease typescript.\n        if (keys !== 'all') {\n          state.setColor(colorMap.get([...keys][0]));\n        }\n      }}\n      disallowEmptySelection>\n      <ColorMapContext.Provider value={colorMap}>\n        {props.children}\n      </ColorMapContext.Provider>\n    </ListBox>\n  );\n});\n\nexport interface ColorSwatchPickerItemRenderProps extends Omit<ListBoxItemRenderProps, 'selectionMode' | 'selectionBehavior'> {\n  /** The color of the swatch. */\n  color: Color\n}\n\nexport interface ColorSwatchPickerItemProps extends RenderProps<ColorSwatchPickerItemRenderProps>, HoverEvents, PressEvents, Omit<GlobalDOMAttributes<HTMLDivElement>, 'onClick'> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorSwatchPickerItem'\n   */\n  className?: ClassNameOrFunction<ColorSwatchPickerItemRenderProps>,\n  /** The color of the swatch. */\n  color: string | Color,\n  /** Whether the color swatch is disabled. */\n  isDisabled?: boolean\n}\n\nexport const ColorSwatchPickerItem = forwardRef(function ColorSwatchPickerItem(props: ColorSwatchPickerItemProps, ref: ForwardedRef<HTMLDivElement>) {\n  let propColor = props.color || '#0000';\n  let color = useMemo(() => typeof propColor === 'string' ? parseColor(propColor) : propColor, [propColor]);\n  let {locale} = useLocale();\n  let map = useContext(ColorMapContext)!;\n  useEffect(() => {\n    let key = color.toString('hexa');\n    map.set(key, color);\n    return () => {\n      map.delete(key);\n    };\n  }, [color, map]);\n\n  let wrap = (v) => {\n    if (typeof v === 'function') {\n      return (renderProps) => v({...renderProps, color});\n    }\n    return v;\n  };\n\n  return (\n    <ListBoxItem\n      {...props}\n      ref={ref}\n      id={color.toString('hexa')}\n      textValue={color.getColorName(locale)}\n      className={wrap(props.className || 'react-aria-ColorSwatchPickerItem')}\n      style={wrap(props.style)}>\n      {composeRenderProps(wrap(props.children), children => (\n        <ColorSwatchContext.Provider value={{color}}>\n          {children}\n        </ColorSwatchContext.Provider>\n      ))}\n    </ListBoxItem>\n  );\n});\n"],"names":[],"version":3,"file":"ColorSwatchPicker.module.js.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;;AAkCO,MAAM,0DAA2B,CAAA,GAAA,oBAAY,EAAwD;AAC5G,MAAM,sDAAkB,CAAA,GAAA,oBAAY,EAA6B;AAK1D,MAAM,0DAAoB,CAAA,GAAA,iBAAS,EAAE,SAAS,kBAAkB,KAA6B,EAAE,GAAiC;IACrI,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,QAAQ,CAAA,GAAA,0BAAkB,EAAE;IAChC,IAAI,WAAW,CAAA,GAAA,cAAM,EAAE,IAAM,IAAI,OAAO,EAAE;IAC1C,IAAI,YAAY,CAAA,GAAA,kCAA0B,EAAE,CAAA,GAAA,oDAAW,GAAG;IAE1D,qBACE,gCAAC,CAAA,GAAA,yCAAM;QACJ,GAAG,CAAA,GAAA,qBAAa,EAAE,OAAO;YAAC,WAAW;QAAI,EAAE;QAC5C,KAAK;QACL,WAAW,MAAM,SAAS,IAAI;QAC9B,OAAO,MAAM,KAAK;QAClB,cAAY,KAAK,CAAC,aAAa,IAAK,CAAA,CAAC,KAAK,CAAC,kBAAkB,GAAG,UAAU,MAAM,CAAC,uBAAuB,SAAQ;QAChH,QAAQ,MAAM,MAAM,IAAI;QACxB,eAAc;QACd,cAAc;YAAC,MAAM,KAAK,CAAC,QAAQ,CAAC;SAAQ;QAC5C,mBAAmB,CAAC;YAClB,yDAAyD;YACzD,IAAI,SAAS,OACX,MAAM,QAAQ,CAAC,SAAS,GAAG,CAAC;mBAAI;aAAK,CAAC,EAAE;QAE5C;QACA,wBAAA;qBACA,gCAAC,sCAAgB,QAAQ;QAAC,OAAO;OAC9B,MAAM,QAAQ;AAIvB;AAmBO,MAAM,0DAAwB,CAAA,GAAA,iBAAS,EAAE,SAAS,sBAAsB,KAAiC,EAAE,GAAiC;IACjJ,IAAI,YAAY,MAAM,KAAK,IAAI;IAC/B,IAAI,QAAQ,CAAA,GAAA,cAAM,EAAE,IAAM,OAAO,cAAc,WAAW,CAAA,GAAA,iBAAS,EAAE,aAAa,WAAW;QAAC;KAAU;IACxG,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,gBAAQ;IACvB,IAAI,MAAM,CAAA,GAAA,iBAAS,EAAE;IACrB,CAAA,GAAA,gBAAQ,EAAE;QACR,IAAI,MAAM,MAAM,QAAQ,CAAC;QACzB,IAAI,GAAG,CAAC,KAAK;QACb,OAAO;YACL,IAAI,MAAM,CAAC;QACb;IACF,GAAG;QAAC;QAAO;KAAI;IAEf,IAAI,OAAO,CAAC;QACV,IAAI,OAAO,MAAM,YACf,OAAO,CAAC,cAAgB,EAAE;gBAAC,GAAG,WAAW;uBAAE;YAAK;QAElD,OAAO;IACT;IAEA,qBACE,gCAAC,CAAA,GAAA,wCAAU;QACR,GAAG,KAAK;QACT,yCAAyC;QACzC,QAAQ,MAAM,MAAM;QACpB,KAAK;QACL,IAAI,MAAM,QAAQ,CAAC;QACnB,WAAW,MAAM,YAAY,CAAC;QAC9B,WAAW,KAAK,MAAM,SAAS,IAAI;QACnC,OAAO,KAAK,MAAM,KAAK;OACtB,CAAA,GAAA,yCAAiB,EAAE,KAAK,MAAM,QAAQ,GAAG,CAAA,yBACxC,gCAAC,CAAA,GAAA,yCAAiB,EAAE,QAAQ;YAAC,OAAO;uBAAC;YAAK;WACvC;AAKX","sources":["packages/react-aria-components/src/ColorSwatchPicker.tsx"],"sourcesContent":["import {AriaLabelingProps, GlobalDOMAttributes, HoverEvents, PressEvents, ValueBase} from '@react-types/shared';\nimport {\n  ClassNameOrFunction,\n  composeRenderProps,\n  ContextValue,\n  RenderProps,\n  StyleRenderProps,\n  useContextProps\n} from './utils';\nimport {Color, parseColor, useColorPickerState} from 'react-stately';\nimport {ColorSwatchContext} from './ColorSwatch';\nimport {filterDOMProps} from '@react-aria/utils';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListBox, ListBoxItem, ListBoxItemRenderProps, ListBoxRenderProps} from './ListBox';\nimport React, {createContext, ForwardedRef, forwardRef, ReactNode, useContext, useEffect, useMemo} from 'react';\nimport {useLocale, useLocalizedStringFormatter} from 'react-aria';\n\nexport interface ColorSwatchPickerRenderProps extends Omit<ListBoxRenderProps, 'isDropTarget'> {}\nexport interface ColorSwatchPickerProps extends ValueBase<string | Color, Color>, AriaLabelingProps, StyleRenderProps<ColorSwatchPickerRenderProps>, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorSwatchPicker'\n   */\n  className?: ClassNameOrFunction<ColorSwatchPickerRenderProps>,\n  /** The children of the ColorSwatchPicker. */\n  children?: ReactNode,\n  /**\n   * Whether the items are arranged in a stack or grid.\n   * @default 'grid'\n   */\n  layout?: 'grid' | 'stack'\n}\n\nexport const ColorSwatchPickerContext = createContext<ContextValue<ColorSwatchPickerProps, HTMLDivElement>>(null);\nconst ColorMapContext = createContext<Map<string, Color> | null>(null);\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: ColorSwatchPickerProps, ref: ForwardedRef<HTMLDivElement>) {\n  [props, ref] = useContextProps(props, ref, ColorSwatchPickerContext);\n  let state = useColorPickerState(props);\n  let colorMap = useMemo(() => new Map(), []);\n  let formatter = useLocalizedStringFormatter(intlMessages, 'react-aria-components');\n\n  return (\n    <ListBox\n      {...filterDOMProps(props, {labelable: true})}\n      ref={ref}\n      className={props.className || 'react-aria-ColorSwatchPicker'}\n      style={props.style}\n      aria-label={props['aria-label'] || (!props['aria-labelledby'] ? formatter.format('colorSwatchPicker') : undefined)}\n      layout={props.layout || 'grid'}\n      selectionMode=\"single\"\n      selectedKeys={[state.color.toString('hexa')]}\n      onSelectionChange={(keys) => {\n        // single select, 'all' cannot occur. appease typescript.\n        if (keys !== 'all') {\n          state.setColor(colorMap.get([...keys][0]));\n        }\n      }}\n      disallowEmptySelection>\n      <ColorMapContext.Provider value={colorMap}>\n        {props.children}\n      </ColorMapContext.Provider>\n    </ListBox>\n  );\n});\n\nexport interface ColorSwatchPickerItemRenderProps extends Omit<ListBoxItemRenderProps, 'selectionMode' | 'selectionBehavior'> {\n  /** The color of the swatch. */\n  color: Color\n}\n\nexport interface ColorSwatchPickerItemProps extends RenderProps<ColorSwatchPickerItemRenderProps>, HoverEvents, PressEvents, Omit<GlobalDOMAttributes<HTMLDivElement>, 'onClick'> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorSwatchPickerItem'\n   */\n  className?: ClassNameOrFunction<ColorSwatchPickerItemRenderProps>,\n  /** The color of the swatch. */\n  color: string | Color,\n  /** Whether the color swatch is disabled. */\n  isDisabled?: boolean\n}\n\nexport const ColorSwatchPickerItem = forwardRef(function ColorSwatchPickerItem(props: ColorSwatchPickerItemProps, ref: ForwardedRef<HTMLDivElement>) {\n  let propColor = props.color || '#0000';\n  let color = useMemo(() => typeof propColor === 'string' ? parseColor(propColor) : propColor, [propColor]);\n  let {locale} = useLocale();\n  let map = useContext(ColorMapContext)!;\n  useEffect(() => {\n    let key = color.toString('hexa');\n    map.set(key, color);\n    return () => {\n      map.delete(key);\n    };\n  }, [color, map]);\n\n  let wrap = (v) => {\n    if (typeof v === 'function') {\n      return (renderProps) => v({...renderProps, color});\n    }\n    return v;\n  };\n\n  return (\n    <ListBoxItem\n      {...props}\n      // ColorSwatchPickerItem is never a link.\n      render={props.render as any}\n      ref={ref}\n      id={color.toString('hexa')}\n      textValue={color.getColorName(locale)}\n      className={wrap(props.className || 'react-aria-ColorSwatchPickerItem')}\n      style={wrap(props.style)}>\n      {composeRenderProps(wrap(props.children), children => (\n        <ColorSwatchContext.Provider value={{color}}>\n          {children}\n        </ColorSwatchContext.Provider>\n      ))}\n    </ListBoxItem>\n  );\n});\n"],"names":[],"version":3,"file":"ColorSwatchPicker.module.js.map"}

package/dist/ColorThumb.main.js

@@ -43,7 +43,7 @@ const $9775047c98afa2ef$export$a3cc47cee1c1ccc = /*#__PURE__*/ (0, $3jWEE$react.
         global: true
     });
     delete DOMProps.id;
-    return /*#__PURE__*/ (0, ($parcel$interopDefault($3jWEE$react))).createElement("div", {
+    return /*#__PURE__*/ (0, ($parcel$interopDefault($3jWEE$react))).createElement((0, $c5ccf687772c0422$exports.dom).div, {
         ...(0, $3jWEE$reactaria.mergeProps)(thumbProps, hoverProps, DOMProps),
         ...renderProps,
         ref: ref,

package/dist/ColorThumb.main.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;AAsBO,MAAM,0DAA4B,CAAA,GAAA,0BAAY,EAAyC;AA6CvF,MAAM,yDAAa,CAAA,GAAA,uBAAS,EAAE,SAAS,WAAW,KAAsB,EAAE,GAAiC;IAChH,IAAI,SAAC,KAAK,cAAE,UAAU,aAAE,SAAS,aAAE,SAAS,eAAE,WAAW,eAAE,WAAW,cAAE,aAAa,OAAM,GAAG,CAAA,GAAA,uBAAS,EAAE;IACzG,IAAI,cAAC,UAAU,aAAE,SAAS,kBAAE,cAAc,EAAC,GAAG,CAAA,GAAA,6BAAW;IACzD,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,yBAAO,EAAE;IAEvC,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,kBAAkB;QAClB,cAAc;YACZ,GAAG,WAAW,KAAK;YACnB,iBAAiB,MAAM,eAAe,GAAG,QAAQ;QACnD;QACA,QAAQ;YACN,OAAO,MAAM,eAAe;uBAC5B;YACA,YAAY,MAAM,UAAU;uBAC5B;4BACA;wBACA;QACF;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,oCAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,0DAAC;QACE,GAAG,CAAA,GAAA,2BAAS,EAAE,YAAY,YAAY,SAAS;QAC/C,GAAG,WAAW;QACf,KAAK;QACL,gBAAc,aAAa;QAC3B,iBAAe,MAAM,UAAU,IAAI;QACnC,gBAAc,aAAa;QAC3B,sBAAoB,kBAAkB;QACtC,iBAAe,cAAc;qBAC7B,0DAAC;QAAM,KAAK;QAAY,GAAG,WAAW;QAAG,GAAG,UAAU;QACrD,6BAAe,0DAAC;QAAM,KAAK;QAAY,GAAG,WAAW;QAAG,GAAG,UAAU;QACrE,YAAY,QAAQ;AAG3B","sources":["packages/react-aria-components/src/ColorThumb.tsx"],"sourcesContent":["import {ClassNameOrFunction, RenderProps, useRenderProps} from './utils';\nimport {Color} from 'react-stately';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {GlobalDOMAttributes, HoverEvents, RefObject} from '@react-types/shared';\nimport {mergeProps, useFocusRing, useHover} from 'react-aria';\nimport React, {createContext, ForwardedRef, forwardRef, HTMLAttributes, InputHTMLAttributes, useContext} from 'react';\n\ninterface ColorState {\n  getDisplayColor(): Color,\n  isDragging: boolean\n}\n\ninterface InternalColorThumbContextValue {\n  state: ColorState,\n  thumbProps: HTMLAttributes<HTMLElement>,\n  inputXRef: RefObject<HTMLInputElement | null>,\n  inputYRef?: RefObject<HTMLInputElement | null>,\n  xInputProps: InputHTMLAttributes<HTMLInputElement>,\n  yInputProps?: InputHTMLAttributes<HTMLInputElement>,\n  isDisabled?: boolean\n}\n\nexport const InternalColorThumbContext = createContext<InternalColorThumbContextValue | null>(null);\n\nexport interface ColorThumbRenderProps {\n  /**\n   * The selected color, excluding the alpha channel.\n   */\n  color: Color,\n  /**\n   * Whether this thumb is currently being dragged.\n   * @selector [data-dragging]\n   */\n  isDragging: boolean,\n  /**\n   * Whether the thumb is currently hovered with a mouse.\n   * @selector [data-hovered]\n   */\n  isHovered: boolean,\n  /**\n   * Whether the thumb is currently focused.\n   * @selector [data-focused]\n   */\n  isFocused: boolean,\n  /**\n   * Whether the thumb is keyboard focused.\n   * @selector [data-focus-visible]\n   */\n  isFocusVisible: boolean,\n  /**\n   * Whether the thumb is disabled.\n   * @selector [data-disabled]\n   */\n  isDisabled: boolean\n}\n\nexport interface ColorThumbProps extends HoverEvents, RenderProps<ColorThumbRenderProps>, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorThumb'\n   */\n  className?: ClassNameOrFunction<ColorThumbRenderProps>\n}\n\n/**\n * A color thumb appears within a ColorArea, ColorSlider, or ColorWheel and allows a user to drag to adjust the color value.\n */\nexport const ColorThumb = forwardRef(function ColorThumb(props: ColorThumbProps, ref: ForwardedRef<HTMLDivElement>) {\n  let {state, thumbProps, inputXRef, inputYRef, xInputProps, yInputProps, isDisabled = false} = useContext(InternalColorThumbContext)!;\n  let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n  let {hoverProps, isHovered} = useHover(props);\n\n  let renderProps = useRenderProps({\n    ...props,\n    defaultClassName: 'react-aria-ColorThumb',\n    defaultStyle: {\n      ...thumbProps.style,\n      backgroundColor: state.getDisplayColor().toString()\n    },\n    values: {\n      color: state.getDisplayColor(),\n      isHovered,\n      isDragging: state.isDragging,\n      isFocused,\n      isFocusVisible,\n      isDisabled\n    }\n  });\n\n  let DOMProps = filterDOMProps(props, {global: true});\n  delete DOMProps.id;\n\n  return (\n    <div\n      {...mergeProps(thumbProps, hoverProps, DOMProps)}\n      {...renderProps}\n      ref={ref}\n      data-hovered={isHovered || undefined}\n      data-dragging={state.isDragging || undefined}\n      data-focused={isFocused || undefined}\n      data-focus-visible={isFocusVisible || undefined}\n      data-disabled={isDisabled || undefined}>\n      <input ref={inputXRef} {...xInputProps} {...focusProps} />\n      {yInputProps && <input ref={inputYRef} {...yInputProps} {...focusProps} />}\n      {renderProps.children}\n    </div>\n  );\n});\n"],"names":[],"version":3,"file":"ColorThumb.main.js.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;AAsBO,MAAM,0DAA4B,CAAA,GAAA,0BAAY,EAAyC;AA6CvF,MAAM,yDAAa,CAAA,GAAA,uBAAS,EAAE,SAAS,WAAW,KAAsB,EAAE,GAAiC;IAChH,IAAI,SAAC,KAAK,cAAE,UAAU,aAAE,SAAS,aAAE,SAAS,eAAE,WAAW,eAAE,WAAW,cAAE,aAAa,OAAM,GAAG,CAAA,GAAA,uBAAS,EAAE;IACzG,IAAI,cAAC,UAAU,aAAE,SAAS,kBAAE,cAAc,EAAC,GAAG,CAAA,GAAA,6BAAW;IACzD,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,yBAAO,EAAE;IAEvC,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,kBAAkB;QAClB,cAAc;YACZ,GAAG,WAAW,KAAK;YACnB,iBAAiB,MAAM,eAAe,GAAG,QAAQ;QACnD;QACA,QAAQ;YACN,OAAO,MAAM,eAAe;uBAC5B;YACA,YAAY,MAAM,UAAU;uBAC5B;4BACA;wBACA;QACF;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,oCAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,0DAAC,CAAA,GAAA,6BAAE,EAAE,GAAG;QACL,GAAG,CAAA,GAAA,2BAAS,EAAE,YAAY,YAAY,SAAS;QAC/C,GAAG,WAAW;QACf,KAAK;QACL,gBAAc,aAAa;QAC3B,iBAAe,MAAM,UAAU,IAAI;QACnC,gBAAc,aAAa;QAC3B,sBAAoB,kBAAkB;QACtC,iBAAe,cAAc;qBAC7B,0DAAC;QAAM,KAAK;QAAY,GAAG,WAAW;QAAG,GAAG,UAAU;QACrD,6BAAe,0DAAC;QAAM,KAAK;QAAY,GAAG,WAAW;QAAG,GAAG,UAAU;QACrE,YAAY,QAAQ;AAG3B","sources":["packages/react-aria-components/src/ColorThumb.tsx"],"sourcesContent":["import {ClassNameOrFunction, dom, RenderProps, useRenderProps} from './utils';\nimport {Color} from 'react-stately';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {GlobalDOMAttributes, HoverEvents, RefObject} from '@react-types/shared';\nimport {mergeProps, useFocusRing, useHover} from 'react-aria';\nimport React, {createContext, ForwardedRef, forwardRef, HTMLAttributes, InputHTMLAttributes, useContext} from 'react';\n\ninterface ColorState {\n  getDisplayColor(): Color,\n  isDragging: boolean\n}\n\ninterface InternalColorThumbContextValue {\n  state: ColorState,\n  thumbProps: HTMLAttributes<HTMLElement>,\n  inputXRef: RefObject<HTMLInputElement | null>,\n  inputYRef?: RefObject<HTMLInputElement | null>,\n  xInputProps: InputHTMLAttributes<HTMLInputElement>,\n  yInputProps?: InputHTMLAttributes<HTMLInputElement>,\n  isDisabled?: boolean\n}\n\nexport const InternalColorThumbContext = createContext<InternalColorThumbContextValue | null>(null);\n\nexport interface ColorThumbRenderProps {\n  /**\n   * The selected color, excluding the alpha channel.\n   */\n  color: Color,\n  /**\n   * Whether this thumb is currently being dragged.\n   * @selector [data-dragging]\n   */\n  isDragging: boolean,\n  /**\n   * Whether the thumb is currently hovered with a mouse.\n   * @selector [data-hovered]\n   */\n  isHovered: boolean,\n  /**\n   * Whether the thumb is currently focused.\n   * @selector [data-focused]\n   */\n  isFocused: boolean,\n  /**\n   * Whether the thumb is keyboard focused.\n   * @selector [data-focus-visible]\n   */\n  isFocusVisible: boolean,\n  /**\n   * Whether the thumb is disabled.\n   * @selector [data-disabled]\n   */\n  isDisabled: boolean\n}\n\nexport interface ColorThumbProps extends HoverEvents, RenderProps<ColorThumbRenderProps>, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorThumb'\n   */\n  className?: ClassNameOrFunction<ColorThumbRenderProps>\n}\n\n/**\n * A color thumb appears within a ColorArea, ColorSlider, or ColorWheel and allows a user to drag to adjust the color value.\n */\nexport const ColorThumb = forwardRef(function ColorThumb(props: ColorThumbProps, ref: ForwardedRef<HTMLDivElement>) {\n  let {state, thumbProps, inputXRef, inputYRef, xInputProps, yInputProps, isDisabled = false} = useContext(InternalColorThumbContext)!;\n  let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n  let {hoverProps, isHovered} = useHover(props);\n\n  let renderProps = useRenderProps({\n    ...props,\n    defaultClassName: 'react-aria-ColorThumb',\n    defaultStyle: {\n      ...thumbProps.style,\n      backgroundColor: state.getDisplayColor().toString()\n    },\n    values: {\n      color: state.getDisplayColor(),\n      isHovered,\n      isDragging: state.isDragging,\n      isFocused,\n      isFocusVisible,\n      isDisabled\n    }\n  });\n\n  let DOMProps = filterDOMProps(props, {global: true});\n  delete DOMProps.id;\n\n  return (\n    <dom.div\n      {...mergeProps(thumbProps, hoverProps, DOMProps)}\n      {...renderProps}\n      ref={ref}\n      data-hovered={isHovered || undefined}\n      data-dragging={state.isDragging || undefined}\n      data-focused={isFocused || undefined}\n      data-focus-visible={isFocusVisible || undefined}\n      data-disabled={isDisabled || undefined}>\n      <input ref={inputXRef} {...xInputProps} {...focusProps} />\n      {yInputProps && <input ref={inputYRef} {...yInputProps} {...focusProps} />}\n      {renderProps.children}\n    </dom.div>\n  );\n});\n"],"names":[],"version":3,"file":"ColorThumb.main.js.map"}

package/dist/ColorThumb.mjs

@@ -1,4 +1,4 @@
-import {useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from "./utils.mjs";
+import {dom as $64fa3d84918910a7$export$df3a06d6289f983e, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from "./utils.mjs";
 import {filterDOMProps as $1Ipl1$filterDOMProps} from "@react-aria/utils";
 import {useFocusRing as $1Ipl1$useFocusRing, useHover as $1Ipl1$useHover, mergeProps as $1Ipl1$mergeProps} from "react-aria";
 import $1Ipl1$react, {createContext as $1Ipl1$createContext, forwardRef as $1Ipl1$forwardRef, useContext as $1Ipl1$useContext} from "react";
@@ -32,7 +32,7 @@ const $e2b71ec1d6016406$export$a3cc47cee1c1ccc = /*#__PURE__*/ (0, $1Ipl1$forwar
         global: true
     });
     delete DOMProps.id;
-    return /*#__PURE__*/ (0, $1Ipl1$react).createElement("div", {
+    return /*#__PURE__*/ (0, $1Ipl1$react).createElement((0, $64fa3d84918910a7$export$df3a06d6289f983e).div, {
         ...(0, $1Ipl1$mergeProps)(thumbProps, hoverProps, DOMProps),
         ...renderProps,
         ref: ref,

package/dist/ColorThumb.module.js

@@ -1,4 +1,4 @@
-import {useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from "./utils.module.js";
+import {dom as $64fa3d84918910a7$export$df3a06d6289f983e, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from "./utils.module.js";
 import {filterDOMProps as $1Ipl1$filterDOMProps} from "@react-aria/utils";
 import {useFocusRing as $1Ipl1$useFocusRing, useHover as $1Ipl1$useHover, mergeProps as $1Ipl1$mergeProps} from "react-aria";
 import $1Ipl1$react, {createContext as $1Ipl1$createContext, forwardRef as $1Ipl1$forwardRef, useContext as $1Ipl1$useContext} from "react";
@@ -32,7 +32,7 @@ const $e2b71ec1d6016406$export$a3cc47cee1c1ccc = /*#__PURE__*/ (0, $1Ipl1$forwar
         global: true
     });
     delete DOMProps.id;
-    return /*#__PURE__*/ (0, $1Ipl1$react).createElement("div", {
+    return /*#__PURE__*/ (0, $1Ipl1$react).createElement((0, $64fa3d84918910a7$export$df3a06d6289f983e).div, {
         ...(0, $1Ipl1$mergeProps)(thumbProps, hoverProps, DOMProps),
         ...renderProps,
         ref: ref,

package/dist/ColorThumb.module.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;AAsBO,MAAM,0DAA4B,CAAA,GAAA,oBAAY,EAAyC;AA6CvF,MAAM,yDAAa,CAAA,GAAA,iBAAS,EAAE,SAAS,WAAW,KAAsB,EAAE,GAAiC;IAChH,IAAI,SAAC,KAAK,cAAE,UAAU,aAAE,SAAS,aAAE,SAAS,eAAE,WAAW,eAAE,WAAW,cAAE,aAAa,OAAM,GAAG,CAAA,GAAA,iBAAS,EAAE;IACzG,IAAI,cAAC,UAAU,aAAE,SAAS,kBAAE,cAAc,EAAC,GAAG,CAAA,GAAA,mBAAW;IACzD,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;IAEvC,IAAI,cAAc,CAAA,GAAA,uCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,kBAAkB;QAClB,cAAc;YACZ,GAAG,WAAW,KAAK;YACnB,iBAAiB,MAAM,eAAe,GAAG,QAAQ;QACnD;QACA,QAAQ;YACN,OAAO,MAAM,eAAe;uBAC5B;YACA,YAAY,MAAM,UAAU;uBAC5B;4BACA;wBACA;QACF;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,qBAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,gCAAC;QACE,GAAG,CAAA,GAAA,iBAAS,EAAE,YAAY,YAAY,SAAS;QAC/C,GAAG,WAAW;QACf,KAAK;QACL,gBAAc,aAAa;QAC3B,iBAAe,MAAM,UAAU,IAAI;QACnC,gBAAc,aAAa;QAC3B,sBAAoB,kBAAkB;QACtC,iBAAe,cAAc;qBAC7B,gCAAC;QAAM,KAAK;QAAY,GAAG,WAAW;QAAG,GAAG,UAAU;QACrD,6BAAe,gCAAC;QAAM,KAAK;QAAY,GAAG,WAAW;QAAG,GAAG,UAAU;QACrE,YAAY,QAAQ;AAG3B","sources":["packages/react-aria-components/src/ColorThumb.tsx"],"sourcesContent":["import {ClassNameOrFunction, RenderProps, useRenderProps} from './utils';\nimport {Color} from 'react-stately';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {GlobalDOMAttributes, HoverEvents, RefObject} from '@react-types/shared';\nimport {mergeProps, useFocusRing, useHover} from 'react-aria';\nimport React, {createContext, ForwardedRef, forwardRef, HTMLAttributes, InputHTMLAttributes, useContext} from 'react';\n\ninterface ColorState {\n  getDisplayColor(): Color,\n  isDragging: boolean\n}\n\ninterface InternalColorThumbContextValue {\n  state: ColorState,\n  thumbProps: HTMLAttributes<HTMLElement>,\n  inputXRef: RefObject<HTMLInputElement | null>,\n  inputYRef?: RefObject<HTMLInputElement | null>,\n  xInputProps: InputHTMLAttributes<HTMLInputElement>,\n  yInputProps?: InputHTMLAttributes<HTMLInputElement>,\n  isDisabled?: boolean\n}\n\nexport const InternalColorThumbContext = createContext<InternalColorThumbContextValue | null>(null);\n\nexport interface ColorThumbRenderProps {\n  /**\n   * The selected color, excluding the alpha channel.\n   */\n  color: Color,\n  /**\n   * Whether this thumb is currently being dragged.\n   * @selector [data-dragging]\n   */\n  isDragging: boolean,\n  /**\n   * Whether the thumb is currently hovered with a mouse.\n   * @selector [data-hovered]\n   */\n  isHovered: boolean,\n  /**\n   * Whether the thumb is currently focused.\n   * @selector [data-focused]\n   */\n  isFocused: boolean,\n  /**\n   * Whether the thumb is keyboard focused.\n   * @selector [data-focus-visible]\n   */\n  isFocusVisible: boolean,\n  /**\n   * Whether the thumb is disabled.\n   * @selector [data-disabled]\n   */\n  isDisabled: boolean\n}\n\nexport interface ColorThumbProps extends HoverEvents, RenderProps<ColorThumbRenderProps>, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorThumb'\n   */\n  className?: ClassNameOrFunction<ColorThumbRenderProps>\n}\n\n/**\n * A color thumb appears within a ColorArea, ColorSlider, or ColorWheel and allows a user to drag to adjust the color value.\n */\nexport const ColorThumb = forwardRef(function ColorThumb(props: ColorThumbProps, ref: ForwardedRef<HTMLDivElement>) {\n  let {state, thumbProps, inputXRef, inputYRef, xInputProps, yInputProps, isDisabled = false} = useContext(InternalColorThumbContext)!;\n  let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n  let {hoverProps, isHovered} = useHover(props);\n\n  let renderProps = useRenderProps({\n    ...props,\n    defaultClassName: 'react-aria-ColorThumb',\n    defaultStyle: {\n      ...thumbProps.style,\n      backgroundColor: state.getDisplayColor().toString()\n    },\n    values: {\n      color: state.getDisplayColor(),\n      isHovered,\n      isDragging: state.isDragging,\n      isFocused,\n      isFocusVisible,\n      isDisabled\n    }\n  });\n\n  let DOMProps = filterDOMProps(props, {global: true});\n  delete DOMProps.id;\n\n  return (\n    <div\n      {...mergeProps(thumbProps, hoverProps, DOMProps)}\n      {...renderProps}\n      ref={ref}\n      data-hovered={isHovered || undefined}\n      data-dragging={state.isDragging || undefined}\n      data-focused={isFocused || undefined}\n      data-focus-visible={isFocusVisible || undefined}\n      data-disabled={isDisabled || undefined}>\n      <input ref={inputXRef} {...xInputProps} {...focusProps} />\n      {yInputProps && <input ref={inputYRef} {...yInputProps} {...focusProps} />}\n      {renderProps.children}\n    </div>\n  );\n});\n"],"names":[],"version":3,"file":"ColorThumb.module.js.map"}
+{"mappings":";;;;;;;;;AAsBO,MAAM,0DAA4B,CAAA,GAAA,oBAAY,EAAyC;AA6CvF,MAAM,yDAAa,CAAA,GAAA,iBAAS,EAAE,SAAS,WAAW,KAAsB,EAAE,GAAiC;IAChH,IAAI,SAAC,KAAK,cAAE,UAAU,aAAE,SAAS,aAAE,SAAS,eAAE,WAAW,eAAE,WAAW,cAAE,aAAa,OAAM,GAAG,CAAA,GAAA,iBAAS,EAAE;IACzG,IAAI,cAAC,UAAU,aAAE,SAAS,kBAAE,cAAc,EAAC,GAAG,CAAA,GAAA,mBAAW;IACzD,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;IAEvC,IAAI,cAAc,CAAA,GAAA,uCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,kBAAkB;QAClB,cAAc;YACZ,GAAG,WAAW,KAAK;YACnB,iBAAiB,MAAM,eAAe,GAAG,QAAQ;QACnD;QACA,QAAQ;YACN,OAAO,MAAM,eAAe;uBAC5B;YACA,YAAY,MAAM,UAAU;uBAC5B;4BACA;wBACA;QACF;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,qBAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,gCAAC,CAAA,GAAA,yCAAE,EAAE,GAAG;QACL,GAAG,CAAA,GAAA,iBAAS,EAAE,YAAY,YAAY,SAAS;QAC/C,GAAG,WAAW;QACf,KAAK;QACL,gBAAc,aAAa;QAC3B,iBAAe,MAAM,UAAU,IAAI;QACnC,gBAAc,aAAa;QAC3B,sBAAoB,kBAAkB;QACtC,iBAAe,cAAc;qBAC7B,gCAAC;QAAM,KAAK;QAAY,GAAG,WAAW;QAAG,GAAG,UAAU;QACrD,6BAAe,gCAAC;QAAM,KAAK;QAAY,GAAG,WAAW;QAAG,GAAG,UAAU;QACrE,YAAY,QAAQ;AAG3B","sources":["packages/react-aria-components/src/ColorThumb.tsx"],"sourcesContent":["import {ClassNameOrFunction, dom, RenderProps, useRenderProps} from './utils';\nimport {Color} from 'react-stately';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {GlobalDOMAttributes, HoverEvents, RefObject} from '@react-types/shared';\nimport {mergeProps, useFocusRing, useHover} from 'react-aria';\nimport React, {createContext, ForwardedRef, forwardRef, HTMLAttributes, InputHTMLAttributes, useContext} from 'react';\n\ninterface ColorState {\n  getDisplayColor(): Color,\n  isDragging: boolean\n}\n\ninterface InternalColorThumbContextValue {\n  state: ColorState,\n  thumbProps: HTMLAttributes<HTMLElement>,\n  inputXRef: RefObject<HTMLInputElement | null>,\n  inputYRef?: RefObject<HTMLInputElement | null>,\n  xInputProps: InputHTMLAttributes<HTMLInputElement>,\n  yInputProps?: InputHTMLAttributes<HTMLInputElement>,\n  isDisabled?: boolean\n}\n\nexport const InternalColorThumbContext = createContext<InternalColorThumbContextValue | null>(null);\n\nexport interface ColorThumbRenderProps {\n  /**\n   * The selected color, excluding the alpha channel.\n   */\n  color: Color,\n  /**\n   * Whether this thumb is currently being dragged.\n   * @selector [data-dragging]\n   */\n  isDragging: boolean,\n  /**\n   * Whether the thumb is currently hovered with a mouse.\n   * @selector [data-hovered]\n   */\n  isHovered: boolean,\n  /**\n   * Whether the thumb is currently focused.\n   * @selector [data-focused]\n   */\n  isFocused: boolean,\n  /**\n   * Whether the thumb is keyboard focused.\n   * @selector [data-focus-visible]\n   */\n  isFocusVisible: boolean,\n  /**\n   * Whether the thumb is disabled.\n   * @selector [data-disabled]\n   */\n  isDisabled: boolean\n}\n\nexport interface ColorThumbProps extends HoverEvents, RenderProps<ColorThumbRenderProps>, GlobalDOMAttributes<HTMLDivElement> {\n  /**\n   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n   * @default 'react-aria-ColorThumb'\n   */\n  className?: ClassNameOrFunction<ColorThumbRenderProps>\n}\n\n/**\n * A color thumb appears within a ColorArea, ColorSlider, or ColorWheel and allows a user to drag to adjust the color value.\n */\nexport const ColorThumb = forwardRef(function ColorThumb(props: ColorThumbProps, ref: ForwardedRef<HTMLDivElement>) {\n  let {state, thumbProps, inputXRef, inputYRef, xInputProps, yInputProps, isDisabled = false} = useContext(InternalColorThumbContext)!;\n  let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n  let {hoverProps, isHovered} = useHover(props);\n\n  let renderProps = useRenderProps({\n    ...props,\n    defaultClassName: 'react-aria-ColorThumb',\n    defaultStyle: {\n      ...thumbProps.style,\n      backgroundColor: state.getDisplayColor().toString()\n    },\n    values: {\n      color: state.getDisplayColor(),\n      isHovered,\n      isDragging: state.isDragging,\n      isFocused,\n      isFocusVisible,\n      isDisabled\n    }\n  });\n\n  let DOMProps = filterDOMProps(props, {global: true});\n  delete DOMProps.id;\n\n  return (\n    <dom.div\n      {...mergeProps(thumbProps, hoverProps, DOMProps)}\n      {...renderProps}\n      ref={ref}\n      data-hovered={isHovered || undefined}\n      data-dragging={state.isDragging || undefined}\n      data-focused={isFocused || undefined}\n      data-focus-visible={isFocusVisible || undefined}\n      data-disabled={isDisabled || undefined}>\n      <input ref={inputXRef} {...xInputProps} {...focusProps} />\n      {yInputProps && <input ref={inputYRef} {...yInputProps} {...focusProps} />}\n      {renderProps.children}\n    </dom.div>\n  );\n});\n"],"names":[],"version":3,"file":"ColorThumb.module.js.map"}

package/dist/ColorWheel.main.js

@@ -47,7 +47,7 @@ const $85ae22f3b2559b04$export$f80663f808113381 = /*#__PURE__*/ (0, $k1tmY$react
         global: true
     });
     delete DOMProps.id;
-    return /*#__PURE__*/ (0, ($parcel$interopDefault($k1tmY$react))).createElement("div", {
+    return /*#__PURE__*/ (0, ($parcel$interopDefault($k1tmY$react))).createElement((0, $c5ccf687772c0422$exports.dom).div, {
         ...DOMProps,
         ...renderProps,
         ref: ref,
@@ -90,7 +90,7 @@ const $85ae22f3b2559b04$export$aaae3dd1f909c692 = /*#__PURE__*/ (0, $k1tmY$react
             state: state
         }
     });
-    return /*#__PURE__*/ (0, ($parcel$interopDefault($k1tmY$react))).createElement("div", {
+    return /*#__PURE__*/ (0, ($parcel$interopDefault($k1tmY$react))).createElement((0, $c5ccf687772c0422$exports.dom).div, {
         ...rest,
         ...renderProps,
         ref: ref,