@react-aria/color 3.0.0-beta.26 → 3.0.0-beta.28

package/dist/module.js

@@ -1,12 +1,48 @@
+import $eccab2b0118aef08$exports from "./ar-AE.module.js";
+import $bf2b4507594e3d45$exports from "./bg-BG.module.js";
+import $01c08487af7ecd14$exports from "./cs-CZ.module.js";
+import $5e997db6ea0d10f6$exports from "./da-DK.module.js";
+import $fe5998f640a79fd2$exports from "./de-DE.module.js";
+import $18e4d1d5b500a9ee$exports from "./el-GR.module.js";
+import $bf90a11a7a42a0f7$exports from "./en-US.module.js";
+import $dd0d25f885b5c5f3$exports from "./es-ES.module.js";
+import $d950967017e3485b$exports from "./et-EE.module.js";
+import $00a415a3f0ab315a$exports from "./fi-FI.module.js";
+import $d80f30fe86c95741$exports from "./fr-FR.module.js";
+import $6912afb584340a2e$exports from "./he-IL.module.js";
+import $7b97fcacd84ec90f$exports from "./hr-HR.module.js";
+import $da9b443e89eebc6b$exports from "./hu-HU.module.js";
+import $35f135b45eb4d95b$exports from "./it-IT.module.js";
+import $760b09448e39c6cd$exports from "./ja-JP.module.js";
+import $fc7b7d43be9703ec$exports from "./ko-KR.module.js";
+import $74918a1664156912$exports from "./lt-LT.module.js";
+import $4e6cde11c2bc9840$exports from "./lv-LV.module.js";
+import $6faa3defebc3eb72$exports from "./nb-NO.module.js";
+import $6ac9b6b1b7e3ca12$exports from "./nl-NL.module.js";
+import $1be8b0ee8841f1e7$exports from "./pl-PL.module.js";
+import $f9507c2d404ed689$exports from "./pt-BR.module.js";
+import $8f872ea59c02d67e$exports from "./pt-PT.module.js";
+import $b03b45b62a7ccae4$exports from "./ro-RO.module.js";
+import $f1107d94c09df9b8$exports from "./ru-RU.module.js";
+import $b61325f242fafc7c$exports from "./sk-SK.module.js";
+import $f44b7cf39ac8f315$exports from "./sl-SI.module.js";
+import $aa8cd83fc8d4982b$exports from "./sr-SP.module.js";
+import $7c4f4e5bb7c06f1e$exports from "./sv-SE.module.js";
+import $8045cf930ef745aa$exports from "./tr-TR.module.js";
+import $ee2044a77f24b118$exports from "./uk-UA.module.js";
+import $4e1dbc65a687dd93$exports from "./zh-CN.module.js";
+import $b0fef28529309aa6$exports from "./zh-TW.module.js";
 import {useGlobalListeners as $7KHxM$useGlobalListeners, focusWithoutScrolling as $7KHxM$focusWithoutScrolling, useFormReset as $7KHxM$useFormReset, mergeProps as $7KHxM$mergeProps, isIOS as $7KHxM$isIOS, isAndroid as $7KHxM$isAndroid, useLabels as $7KHxM$useLabels, useId as $7KHxM$useId} from "@react-aria/utils";
 import {useState as $7KHxM$useState, useCallback as $7KHxM$useCallback, useRef as $7KHxM$useRef, useMemo as $7KHxM$useMemo} from "react";
 import {useKeyboard as $7KHxM$useKeyboard, useMove as $7KHxM$useMove, useFocusWithin as $7KHxM$useFocusWithin, useFocus as $7KHxM$useFocus, useScrollWheel as $7KHxM$useScrollWheel} from "@react-aria/interactions";
 import {useLocalizedStringFormatter as $7KHxM$useLocalizedStringFormatter, useLocale as $7KHxM$useLocale} from "@react-aria/i18n";
 import {useVisuallyHidden as $7KHxM$useVisuallyHidden} from "@react-aria/visually-hidden";
 import {useSlider as $7KHxM$useSlider, useSliderThumb as $7KHxM$useSliderThumb} from "@react-aria/slider";
+import {privateValidationStateProp as $7KHxM$privateValidationStateProp} from "@react-stately/form";
 import {useFormattedTextField as $7KHxM$useFormattedTextField} from "@react-aria/textfield";
 import {useSpinButton as $7KHxM$useSpinButton} from "@react-aria/spinbutton";
 
+
 function $parcel$interopDefault(a) {
   return a && a.__esModule ? a.default : a;
 }
@@ -32,310 +68,38 @@ function $parcel$interopDefault(a) {
  * governing permissions and limitations under the License.
  */ 
 var $3493a52097159720$exports = {};
-var $eccab2b0118aef08$exports = {};
-$eccab2b0118aef08$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `أداة انتقاء اللون`,
-    "twoDimensionalSlider": `مُنزلق 2D`
-};
-
-
-var $bf2b4507594e3d45$exports = {};
-$bf2b4507594e3d45$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Средство за избиране на цвят`,
-    "twoDimensionalSlider": `2D плъзгач`
-};
-
-
-var $01c08487af7ecd14$exports = {};
-$01c08487af7ecd14$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Výběr barvy`,
-    "twoDimensionalSlider": `2D posuvník`
-};
-
-
-var $5e997db6ea0d10f6$exports = {};
-$5e997db6ea0d10f6$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Farvevælger`,
-    "twoDimensionalSlider": `2D-skyder`
-};
-
-
-var $fe5998f640a79fd2$exports = {};
-$fe5998f640a79fd2$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Farbwähler`,
-    "twoDimensionalSlider": `2D-Schieberegler`
-};
-
-
-var $18e4d1d5b500a9ee$exports = {};
-$18e4d1d5b500a9ee$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Επιλογέας χρωμάτων`,
-    "twoDimensionalSlider": `Ρυθμιστικό 2D`
-};
-
-
-var $bf90a11a7a42a0f7$exports = {};
-$bf90a11a7a42a0f7$exports = {
-    "colorPicker": `Color picker`,
-    "twoDimensionalSlider": `2D slider`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`
-};
-
-
-var $dd0d25f885b5c5f3$exports = {};
-$dd0d25f885b5c5f3$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Selector de color`,
-    "twoDimensionalSlider": `Regulador 2D`
-};
-
-
-var $d950967017e3485b$exports = {};
-$d950967017e3485b$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Värvivalija`,
-    "twoDimensionalSlider": `2D-liugur`
-};
-
-
-var $00a415a3f0ab315a$exports = {};
-$00a415a3f0ab315a$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Värimuokkain`,
-    "twoDimensionalSlider": `2D-liukusäädin`
-};
-
-
-var $d80f30fe86c95741$exports = {};
-$d80f30fe86c95741$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name} : ${args.value}`,
-    "colorPicker": `Sélecteur de couleurs`,
-    "twoDimensionalSlider": `Curseur 2D`
-};
-
-
-var $6912afb584340a2e$exports = {};
-$6912afb584340a2e$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `בוחר הצבעים`,
-    "twoDimensionalSlider": `מחוון דו מימדי`
-};
-
-
-var $7b97fcacd84ec90f$exports = {};
-$7b97fcacd84ec90f$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Odabir boje`,
-    "twoDimensionalSlider": `2D klizač`
-};
 
 
-var $da9b443e89eebc6b$exports = {};
-$da9b443e89eebc6b$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Színválasztó`,
-    "twoDimensionalSlider": `2D-csúszka`
-};
-
-
-var $35f135b45eb4d95b$exports = {};
-$35f135b45eb4d95b$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Selettore colore`,
-    "twoDimensionalSlider": `Cursore 2D`
-};
-
 
-var $760b09448e39c6cd$exports = {};
-$760b09448e39c6cd$exports = {
-    "colorInputLabel": (args)=>`${args.label}、${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name} : ${args.value}`,
-    "colorPicker": `カラーピッカー`,
-    "twoDimensionalSlider": `2D スライダー`
-};
 
 
-var $fc7b7d43be9703ec$exports = {};
-$fc7b7d43be9703ec$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `색상 피커`,
-    "twoDimensionalSlider": `2D 슬라이더`
-};
 
 
-var $74918a1664156912$exports = {};
-$74918a1664156912$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Spalvų parinkiklis`,
-    "twoDimensionalSlider": `2D slankiklis`
-};
 
 
-var $4e6cde11c2bc9840$exports = {};
-$4e6cde11c2bc9840$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Krāsu atlasītājs`,
-    "twoDimensionalSlider": `2D slīdnis`
-};
-
-
-var $6faa3defebc3eb72$exports = {};
-$6faa3defebc3eb72$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Fargevelger`,
-    "twoDimensionalSlider": `2D-glidebryter`
-};
-
-
-var $6ac9b6b1b7e3ca12$exports = {};
-$6ac9b6b1b7e3ca12$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Kleurkiezer`,
-    "twoDimensionalSlider": `2D-schuifregelaar`
-};
-
-
-var $1be8b0ee8841f1e7$exports = {};
-$1be8b0ee8841f1e7$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Próbnik kolorów`,
-    "twoDimensionalSlider": `Suwak 2D`
-};
-
 
-var $f9507c2d404ed689$exports = {};
-$f9507c2d404ed689$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Seletor de cores`,
-    "twoDimensionalSlider": `Controle deslizante 2D`
-};
 
 
-var $8f872ea59c02d67e$exports = {};
-$8f872ea59c02d67e$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Seletor de cores`,
-    "twoDimensionalSlider": `Controle deslizante 2D`
-};
 
 
-var $b03b45b62a7ccae4$exports = {};
-$b03b45b62a7ccae4$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Selector de culori`,
-    "twoDimensionalSlider": `Glisor 2D`
-};
 
 
-var $f1107d94c09df9b8$exports = {};
-$f1107d94c09df9b8$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Палитра цветов`,
-    "twoDimensionalSlider": `Ползунок 2D`
-};
 
 
-var $b61325f242fafc7c$exports = {};
-$b61325f242fafc7c$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Výber farieb`,
-    "twoDimensionalSlider": `2D jazdec`
-};
 
 
-var $f44b7cf39ac8f315$exports = {};
-$f44b7cf39ac8f315$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Izbirnik barv`,
-    "twoDimensionalSlider": `2D drsnik`
-};
 
 
-var $aa8cd83fc8d4982b$exports = {};
-$aa8cd83fc8d4982b$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Birač boja`,
-    "twoDimensionalSlider": `2D klizač`
-};
 
 
-var $7c4f4e5bb7c06f1e$exports = {};
-$7c4f4e5bb7c06f1e$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Färgväljaren`,
-    "twoDimensionalSlider": `2D-reglage`
-};
 
 
-var $8045cf930ef745aa$exports = {};
-$8045cf930ef745aa$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Renk Seçici`,
-    "twoDimensionalSlider": `2D sürgü`
-};
 
 
-var $ee2044a77f24b118$exports = {};
-$ee2044a77f24b118$exports = {
-    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`,
-    "colorPicker": `Палітра кольорів`,
-    "twoDimensionalSlider": `Повзунок 2D`
-};
 
 
-var $4e1dbc65a687dd93$exports = {};
-$4e1dbc65a687dd93$exports = {
-    "colorInputLabel": (args)=>`${args.label}、${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}：${args.value}`,
-    "colorPicker": `拾色器`,
-    "twoDimensionalSlider": `2D 滑块`
-};
 
 
-var $b0fef28529309aa6$exports = {};
-$b0fef28529309aa6$exports = {
-    "colorInputLabel": (args)=>`${args.label}，${args.channelLabel}`,
-    "colorNameAndValue": (args)=>`${args.name}：${args.value}`,
-    "colorPicker": `檢色器`,
-    "twoDimensionalSlider": `2D 滑桿`
-};
 
 
 $3493a52097159720$exports = {
@@ -602,7 +366,7 @@ function $40297c24c53588e6$export$dd62420467d245ca({ direction: direction, state
 
 function $60bd7d6e45dcddfa$export$2f92a7a615a014f6(props, state) {
     let { isDisabled: isDisabled, inputXRef: inputXRef, inputYRef: inputYRef, containerRef: containerRef, "aria-label": ariaLabel, xName: xName, yName: yName } = props;
-    let stringFormatter = (0, $7KHxM$useLocalizedStringFormatter)((0, (/*@__PURE__*/$parcel$interopDefault($3493a52097159720$exports))));
+    let stringFormatter = (0, $7KHxM$useLocalizedStringFormatter)((0, (/*@__PURE__*/$parcel$interopDefault($3493a52097159720$exports))), "@react-aria/color");
     let { addGlobalListener: addGlobalListener, removeGlobalListener: removeGlobalListener } = (0, $7KHxM$useGlobalListeners)();
     let { direction: direction, locale: locale } = (0, $7KHxM$useLocale)();
     let [focusedInput, setFocusedInput] = (0, $7KHxM$useState)(null);
@@ -668,9 +432,13 @@ function $60bd7d6e45dcddfa$export$2f92a7a615a014f6(props, state) {
             state.setDragging(true);
         },
         onMove ({ deltaX: deltaX, deltaY: deltaY, pointerType: pointerType, shiftKey: shiftKey }) {
+            var _containerRef_current;
             let { incrementX: incrementX, decrementX: decrementX, incrementY: incrementY, decrementY: decrementY, xChannelPageStep: xChannelPageStep, xChannelStep: xChannelStep, yChannelPageStep: yChannelPageStep, yChannelStep: yChannelStep, getThumbPosition: getThumbPosition, setColorFromPoint: setColorFromPoint } = state;
             if (currentPosition.current == null) currentPosition.current = getThumbPosition();
-            let { width: width, height: height } = containerRef.current.getBoundingClientRect();
+            let { width: width, height: height } = ((_containerRef_current = containerRef.current) === null || _containerRef_current === void 0 ? void 0 : _containerRef_current.getBoundingClientRect()) || {
+                width: 0,
+                height: 0
+            };
             let valueChanged = deltaX !== 0 || deltaY !== 0;
             if (pointerType === "keyboard") {
                 let deltaXValue = shiftKey && xChannelPageStep > xChannelStep ? xChannelPageStep : xChannelStep;
@@ -690,7 +458,7 @@ function $60bd7d6e45dcddfa$export$2f92a7a615a014f6(props, state) {
             }
         },
         onMoveEnd () {
-            isOnColorArea.current = undefined;
+            isOnColorArea.current = false;
             state.setDragging(false);
             let input = focusedInput === "x" ? inputXRef : inputYRef;
             focusInput(input);
@@ -1098,7 +866,7 @@ function $b4a0a4fdc900495e$export$9064ff4e44b3729a(props, state, inputRef) {
             } else state.setHueFromPoint(currentPosition.current.x, currentPosition.current.y, thumbRadius);
         },
         onMoveEnd () {
-            isOnTrack.current = undefined;
+            isOnTrack.current = false;
             state.setDragging(false);
             focusInput();
         }
@@ -1297,9 +1065,10 @@ function $b4a0a4fdc900495e$var$circlePath(cx, cy, r) {
 
 
 
+
 function $f6896b05b2ecad12$export$77e32ca575a28fdf(props, state, ref) {
-    let { isDisabled: isDisabled, isReadOnly: isReadOnly, isRequired: isRequired } = props;
-    let { colorValue: colorValue, inputValue: inputValue, commit: commit, increment: increment, decrement: decrement, incrementToMax: incrementToMax, decrementToMin: decrementToMin } = state;
+    let { isDisabled: isDisabled, isReadOnly: isReadOnly, isRequired: isRequired, validationBehavior: validationBehavior = "aria" } = props;
+    let { colorValue: colorValue, inputValue: inputValue, increment: increment, decrement: decrement, incrementToMax: incrementToMax, decrementToMin: decrementToMin, commit: commit } = state;
     let inputId = (0, $7KHxM$useId)();
     let { spinButtonProps: spinButtonProps } = (0, $7KHxM$useSpinButton)({
         isDisabled: isDisabled,
@@ -1336,26 +1105,30 @@ function $f6896b05b2ecad12$export$77e32ca575a28fdf(props, state, ref) {
     let onChange = (value)=>{
         if (state.validate(value)) state.setInputValue(value);
     };
-    let { labelProps: labelProps, inputProps: inputProps } = (0, $7KHxM$useFormattedTextField)((0, $7KHxM$mergeProps)(props, {
+    let { inputProps: inputProps, ...otherProps } = (0, $7KHxM$useFormattedTextField)((0, $7KHxM$mergeProps)(props, {
         id: inputId,
         value: inputValue,
         defaultValue: undefined,
+        validate: undefined,
+        [(0, $7KHxM$privateValidationStateProp)]: state,
         type: "text",
         autoComplete: "off",
         onChange: onChange
     }), state, ref);
+    inputProps = (0, $7KHxM$mergeProps)(inputProps, spinButtonProps, focusWithinProps, {
+        role: "textbox",
+        "aria-valuemax": null,
+        "aria-valuemin": null,
+        "aria-valuenow": null,
+        "aria-valuetext": null,
+        autoCorrect: "off",
+        spellCheck: "false",
+        onBlur: commit
+    });
+    if (validationBehavior === "native") inputProps["aria-required"] = undefined;
     return {
-        labelProps: labelProps,
-        inputProps: (0, $7KHxM$mergeProps)(inputProps, spinButtonProps, focusWithinProps, {
-            role: "textbox",
-            "aria-valuemax": null,
-            "aria-valuemin": null,
-            "aria-valuenow": null,
-            "aria-valuetext": null,
-            autoCorrect: "off",
-            spellCheck: "false",
-            onBlur: commit
-        })
+        inputProps: inputProps,
+        ...otherProps
     };
 }