@react-aria/color 3.0.0-beta.13 → 3.0.0-beta.14

package/dist/module.js

@@ -1,7 +1,7 @@
 import {useGlobalListeners as $7KHxM$useGlobalListeners, focusWithoutScrolling as $7KHxM$focusWithoutScrolling, 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 {useRef as $7KHxM$useRef, useCallback as $7KHxM$useCallback, useMemo as $7KHxM$useMemo, useState as $7KHxM$useState} 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 {useMessageFormatter as $7KHxM$useMessageFormatter, useLocale as $7KHxM$useLocale} from "@react-aria/i18n";
+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 {useFormattedTextField as $7KHxM$useFormattedTextField} from "@react-aria/textfield";
@@ -10,148 +10,379 @@ import {useSpinButton as $7KHxM$useSpinButton} from "@react-aria/spinbutton";
 function $parcel$interopDefault(a) {
   return a && a.__esModule ? a.default : a;
 }
-function $parcel$export(e, n, v, s) {
-  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
-}
-var $60bd7d6e45dcddfa$exports = {};
-
-$parcel$export($60bd7d6e45dcddfa$exports, "useColorArea", () => $60bd7d6e45dcddfa$export$2f92a7a615a014f6);
 
 var $052cfdf4c32eb7c3$exports = {};
 var $eccab2b0118aef08$exports = {};
-$eccab2b0118aef08$exports = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"أداة انتقاء اللون\",\"twoDimensionalSlider\":\"مُنزلق 2D\"}");
+$eccab2b0118aef08$exports = {
+    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`
+    ,
+    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`
+    ,
+    "colorPicker": `أداة انتقاء اللون`,
+    "twoDimensionalSlider": `مُنزلق 2D`
+};
 
 
 var $bf2b4507594e3d45$exports = {};
-$bf2b4507594e3d45$exports = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Средство за избиране на цвят\",\"twoDimensionalSlider\":\"2D плъзгач\"}");
+$bf2b4507594e3d45$exports = {
+    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`
+    ,
+    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`
+    ,
+    "colorPicker": `Средство за избиране на цвят`,
+    "twoDimensionalSlider": `2D плъзгач`
+};
 
 
 var $01c08487af7ecd14$exports = {};
-$01c08487af7ecd14$exports = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Výběr barvy\",\"twoDimensionalSlider\":\"2D posuvník\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Farvevælger\",\"twoDimensionalSlider\":\"2D-skyder\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Farbwähler\",\"twoDimensionalSlider\":\"2D-Schieberegler\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Επιλογέας χρωμάτων\",\"twoDimensionalSlider\":\"Ρυθμιστικό 2D\"}");
+$18e4d1d5b500a9ee$exports = {
+    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`
+    ,
+    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`
+    ,
+    "colorPicker": `Επιλογέας χρωμάτων`,
+    "twoDimensionalSlider": `Ρυθμιστικό 2D`
+};
 
 
 var $bf90a11a7a42a0f7$exports = {};
-$bf90a11a7a42a0f7$exports = JSON.parse("{\"colorPicker\":\"Color picker\",\"twoDimensionalSlider\":\"2D slider\",\"colorNameAndValue\":\"{name}: {value}\",\"colorInputLabel\":\"{label}, {channelLabel}\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Selector de color\",\"twoDimensionalSlider\":\"Regulador 2D\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Värvivalija\",\"twoDimensionalSlider\":\"2D-liugur\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Värimuokkain\",\"twoDimensionalSlider\":\"2D-liukusäädin\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name} : {value}\",\"colorPicker\":\"Sélecteur de couleurs\",\"twoDimensionalSlider\":\"Curseur 2D\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"בוחר הצבעים\",\"twoDimensionalSlider\":\"מחוון דו מימדי\"}");
+$6912afb584340a2e$exports = {
+    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`
+    ,
+    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`
+    ,
+    "colorPicker": `בוחר הצבעים`,
+    "twoDimensionalSlider": `מחוון דו מימדי`
+};
 
 
 var $7b97fcacd84ec90f$exports = {};
-$7b97fcacd84ec90f$exports = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Odabir boje\",\"twoDimensionalSlider\":\"2D klizač\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Színválasztó\",\"twoDimensionalSlider\":\"2D-csúszka\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Selettore colore\",\"twoDimensionalSlider\":\"Cursore 2D\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}、{channelLabel}\",\"colorNameAndValue\":\"{name} : {value}\",\"colorPicker\":\"カラーピッカー\",\"twoDimensionalSlider\":\"2D スライダー\"}");
+$760b09448e39c6cd$exports = {
+    "colorInputLabel": (args)=>`${args.label}、${args.channelLabel}`
+    ,
+    "colorNameAndValue": (args)=>`${args.name} : ${args.value}`
+    ,
+    "colorPicker": `カラーピッカー`,
+    "twoDimensionalSlider": `2D スライダー`
+};
 
 
 var $fc7b7d43be9703ec$exports = {};
-$fc7b7d43be9703ec$exports = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"색상 피커\",\"twoDimensionalSlider\":\"2D 슬라이더\"}");
+$fc7b7d43be9703ec$exports = {
+    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`
+    ,
+    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`
+    ,
+    "colorPicker": `색상 피커`,
+    "twoDimensionalSlider": `2D 슬라이더`
+};
 
 
 var $74918a1664156912$exports = {};
-$74918a1664156912$exports = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Spalvų parinkiklis\",\"twoDimensionalSlider\":\"2D slankiklis\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Krāsu atlasītājs\",\"twoDimensionalSlider\":\"2D slīdnis\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Fargevelger\",\"twoDimensionalSlider\":\"2D-glidebryter\"}");
+$6faa3defebc3eb72$exports = {
+    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`
+    ,
+    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`
+    ,
+    "colorPicker": `Fargevelger`,
+    "twoDimensionalSlider": `2D-glidebryter`
+};
 
 
 var $6ac9b6b1b7e3ca12$exports = {};
-$6ac9b6b1b7e3ca12$exports = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Kleurkiezer\",\"twoDimensionalSlider\":\"2D-schuifregelaar\"}");
+$6ac9b6b1b7e3ca12$exports = {
+    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`
+    ,
+    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`
+    ,
+    "colorPicker": `Kleurkiezer`,
+    "twoDimensionalSlider": `2D-schuifregelaar`
+};
 
 
 var $1be8b0ee8841f1e7$exports = {};
-$1be8b0ee8841f1e7$exports = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Próbnik kolorów\",\"twoDimensionalSlider\":\"Suwak 2D\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Seletor de cores\",\"twoDimensionalSlider\":\"Controle deslizante 2D\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Seletor de cores\",\"twoDimensionalSlider\":\"Controle deslizante 2D\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Selector de culori\",\"twoDimensionalSlider\":\"Glisor 2D\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Палитра цветов\",\"twoDimensionalSlider\":\"Ползунок 2D\"}");
+$f1107d94c09df9b8$exports = {
+    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`
+    ,
+    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`
+    ,
+    "colorPicker": `Палитра цветов`,
+    "twoDimensionalSlider": `Ползунок 2D`
+};
 
 
 var $b61325f242fafc7c$exports = {};
-$b61325f242fafc7c$exports = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Výber farieb\",\"twoDimensionalSlider\":\"2D jazdec\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Izbirnik barv\",\"twoDimensionalSlider\":\"2D drsnik\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Birač boja\",\"twoDimensionalSlider\":\"2D klizač\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Färgväljaren\",\"twoDimensionalSlider\":\"2D-reglage\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Renk Seçici\",\"twoDimensionalSlider\":\"2D sürgü\"}");
+$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 = JSON.parse("{\"colorInputLabel\":\"{label}, {channelLabel}\",\"colorNameAndValue\":\"{name}: {value}\",\"colorPicker\":\"Палітра кольорів\",\"twoDimensionalSlider\":\"Повзунок 2D\"}");
+$ee2044a77f24b118$exports = {
+    "colorInputLabel": (args)=>`${args.label}, ${args.channelLabel}`
+    ,
+    "colorNameAndValue": (args)=>`${args.name}: ${args.value}`
+    ,
+    "colorPicker": `Палітра кольорів`,
+    "twoDimensionalSlider": `Повзунок 2D`
+};
 
 
 var $4e1dbc65a687dd93$exports = {};
-$4e1dbc65a687dd93$exports = JSON.parse("{\"colorInputLabel\":\"{label}、{channelLabel}\",\"colorNameAndValue\":\"{name}：{value}\",\"colorPicker\":\"拾色器\",\"twoDimensionalSlider\":\"2D 滑块\"}");
+$4e1dbc65a687dd93$exports = {
+    "colorInputLabel": (args)=>`${args.label}、${args.channelLabel}`
+    ,
+    "colorNameAndValue": (args)=>`${args.name}：${args.value}`
+    ,
+    "colorPicker": `拾色器`,
+    "twoDimensionalSlider": `2D 滑块`
+};
 
 
 var $b0fef28529309aa6$exports = {};
-$b0fef28529309aa6$exports = JSON.parse("{\"colorInputLabel\":\"{label}，{channelLabel}\",\"colorNameAndValue\":\"{name}：{value}\",\"colorPicker\":\"檢色器\",\"twoDimensionalSlider\":\"2D 滑桿\"}");
+$b0fef28529309aa6$exports = {
+    "colorInputLabel": (args)=>`${args.label}，${args.channelLabel}`
+    ,
+    "colorNameAndValue": (args)=>`${args.name}：${args.value}`
+    ,
+    "colorPicker": `檢色器`,
+    "twoDimensionalSlider": `2D 滑桿`
+};
 
 
 $052cfdf4c32eb7c3$exports = {
@@ -370,17 +601,22 @@ function $40297c24c53588e6$export$dd62420467d245ca({ direction: direction , stat
         }
         let { x: x , y: y  } = state.getThumbPosition();
         if (direction === 'rtl') x = 1 - x;
+        let forcedColorAdjustNoneStyle = {
+            forcedColorAdjust: 'none'
+        };
         return {
             colorAreaStyleProps: {
                 style: {
                     position: 'relative',
                     touchAction: 'none',
+                    ...forcedColorAdjustNoneStyle,
                     ...background.colorAreaStyles
                 }
             },
             gradientStyleProps: {
                 style: {
                     touchAction: 'none',
+                    ...forcedColorAdjustNoneStyle,
                     ...background.gradientStyles
                 }
             },
@@ -390,7 +626,8 @@ function $40297c24c53588e6$export$dd62420467d245ca({ direction: direction , stat
                     left: `${x * 100}%`,
                     top: `${y * 100}%`,
                     transform: 'translate(0%, 0%)',
-                    touchAction: 'none'
+                    touchAction: 'none',
+                    ...forcedColorAdjustNoneStyle
                 }
             }
         };
@@ -410,7 +647,7 @@ function $40297c24c53588e6$export$dd62420467d245ca({ direction: direction , stat
 
 function $60bd7d6e45dcddfa$export$2f92a7a615a014f6(props, state) {
     let { isDisabled: isDisabled , inputXRef: inputXRef , inputYRef: inputYRef , containerRef: containerRef , 'aria-label': ariaLabel  } = props;
-    let formatMessage = $7KHxM$useMessageFormatter((/*@__PURE__*/$parcel$interopDefault($052cfdf4c32eb7c3$exports)));
+    let stringFormatter = $7KHxM$useLocalizedStringFormatter((/*@__PURE__*/$parcel$interopDefault($052cfdf4c32eb7c3$exports)));
     let { addGlobalListener: addGlobalListener , removeGlobalListener: removeGlobalListener  } = $7KHxM$useGlobalListeners();
     let { direction: direction , locale: locale  } = $7KHxM$useLocale();
     let focusedInputRef = $7KHxM$useRef(null);
@@ -627,40 +864,40 @@ function $60bd7d6e45dcddfa$export$2f92a7a615a014f6(props, state) {
     });
     let isMobile = $7KHxM$isIOS() || $7KHxM$isAndroid();
     function getAriaValueTextForChannel(channel) {
-        return valueChangedViaKeyboard.current ? formatMessage('colorNameAndValue', {
+        return valueChangedViaKeyboard.current ? stringFormatter.format('colorNameAndValue', {
             name: state.value.getChannelName(channel, locale),
             value: state.value.formatChannelValue(channel, locale)
         }) : [
-            formatMessage('colorNameAndValue', {
+            stringFormatter.format('colorNameAndValue', {
                 name: state.value.getChannelName(channel, locale),
                 value: state.value.formatChannelValue(channel, locale)
             }),
-            formatMessage('colorNameAndValue', {
+            stringFormatter.format('colorNameAndValue', {
                 name: state.value.getChannelName(channel === yChannel ? xChannel : yChannel, locale),
                 value: state.value.formatChannelValue(channel === yChannel ? xChannel : yChannel, locale)
             })
         ].join(', ');
     }
-    let colorPickerLabel = formatMessage('colorPicker');
+    let colorPickerLabel = stringFormatter.format('colorPicker');
     let xInputLabellingProps = $7KHxM$useLabels({
         ...props,
-        'aria-label': ariaLabel ? formatMessage('colorInputLabel', {
+        'aria-label': ariaLabel ? stringFormatter.format('colorInputLabel', {
             label: ariaLabel,
             channelLabel: colorPickerLabel
         }) : colorPickerLabel
     });
     let yInputLabellingProps = $7KHxM$useLabels({
         ...props,
-        'aria-label': ariaLabel ? formatMessage('colorInputLabel', {
+        'aria-label': ariaLabel ? stringFormatter.format('colorInputLabel', {
             label: ariaLabel,
             channelLabel: colorPickerLabel
         }) : colorPickerLabel
     });
-    let colorAriaLabellingProps = $7KHxM$useLabels({
+    let colorAreaLabellingProps = $7KHxM$useLabels({
         ...props,
-        'aria-label': ariaLabel ? `${ariaLabel} ${colorPickerLabel}` : undefined
+        'aria-label': ariaLabel ? `${ariaLabel}, ${colorPickerLabel}` : undefined
     }, isMobile ? colorPickerLabel : undefined);
-    let ariaRoleDescription = formatMessage('twoDimensionalSlider');
+    let ariaRoleDescription = stringFormatter.format('twoDimensionalSlider');
     let { visuallyHiddenProps: visuallyHiddenProps  } = $7KHxM$useVisuallyHidden({
         style: {
             opacity: '0.0001',
@@ -678,7 +915,7 @@ function $60bd7d6e45dcddfa$export$2f92a7a615a014f6(props, state) {
     });
     return {
         colorAreaProps: {
-            ...colorAriaLabellingProps,
+            ...colorAreaLabellingProps,
             ...colorAreaInteractions,
             ...colorAreaStyleProps,
             role: 'group'
@@ -709,7 +946,7 @@ function $60bd7d6e45dcddfa$export$2f92a7a615a014f6(props, state) {
         So that only a single "2d slider" control shows up when listing form elements for screen readers,
         add aria-hidden="true" to the unfocused control when the value has not changed via the keyboard,
         but remove aria-hidden to reveal the input for each channel when the value has changed with the keyboard.
-      */ 'aria-hidden': !isMobile && focusedInputRef.current === inputYRef.current && !valueChangedViaKeyboard.current ? 'true' : undefined,
+      */ 'aria-hidden': isMobile || !focusedInputRef.current || focusedInputRef.current === inputXRef.current || valueChangedViaKeyboard.current ? undefined : 'true',
             onChange: (e)=>{
                 state.setXValue(parseFloat(e.target.value));
             }
@@ -727,12 +964,12 @@ function $60bd7d6e45dcddfa$export$2f92a7a615a014f6(props, state) {
             'aria-orientation': 'vertical',
             disabled: isDisabled,
             value: state.value.getChannelValue(yChannel),
-            tabIndex: isMobile || focusedInputRef.current === inputYRef.current ? undefined : -1,
+            tabIndex: isMobile || focusedInputRef.current && focusedInputRef.current === inputYRef.current ? undefined : -1,
             /*
         So that only a single "2d slider" control shows up when listing form elements for screen readers,
         add aria-hidden="true" to the unfocused input when the value has not changed via the keyboard,
         but remove aria-hidden to reveal the input for each channel when the value has changed with the keyboard.
-      */ 'aria-hidden': isMobile || focusedInputRef.current === inputYRef.current || valueChangedViaKeyboard.current ? undefined : 'true',
+      */ 'aria-hidden': isMobile || focusedInputRef.current && focusedInputRef.current === inputYRef.current || valueChangedViaKeyboard.current ? undefined : 'true',
             onChange: (e)=>{
                 state.setYValue(parseFloat(e.target.value));
             }
@@ -741,9 +978,6 @@ function $60bd7d6e45dcddfa$export$2f92a7a615a014f6(props, state) {
 }
 
 
-var $40af666d6c251e36$exports = {};
-
-$parcel$export($40af666d6c251e36$exports, "useColorSlider", () => $40af666d6c251e36$export$106b7a4e66508f66);
 
 
 
@@ -799,14 +1033,15 @@ function $40af666d6c251e36$export$106b7a4e66508f66(props, state) {
                 throw new Error('Unknown color channel: ' + channel);
         }
     };
-    let thumbPosition = state.getThumbPercent(0);
-    if (orientation === 'vertical' || direction === 'rtl') thumbPosition = 1 - thumbPosition;
+    let forcedColorAdjustNoneStyle = {
+        forcedColorAdjust: 'none'
+    };
     return {
         trackProps: {
             ...$7KHxM$mergeProps(groupProps, trackProps),
             style: {
-                position: 'relative',
-                touchAction: 'none',
+                ...trackProps.style,
+                ...forcedColorAdjustNoneStyle,
                 background: generateBackground()
             }
         },
@@ -814,10 +1049,8 @@ function $40af666d6c251e36$export$106b7a4e66508f66(props, state) {
         thumbProps: {
             ...thumbProps,
             style: {
-                touchAction: 'none',
-                position: 'absolute',
-                [orientation === 'vertical' ? 'top' : 'left']: `${thumbPosition * 100}%`,
-                transform: 'translate(-50%, -50%)'
+                ...thumbProps.style,
+                ...forcedColorAdjustNoneStyle
             }
         },
         labelProps: labelProps,
@@ -826,9 +1059,6 @@ function $40af666d6c251e36$export$106b7a4e66508f66(props, state) {
 }
 
 
-var $b4a0a4fdc900495e$exports = {};
-
-$parcel$export($b4a0a4fdc900495e$exports, "useColorWheel", () => $b4a0a4fdc900495e$export$9064ff4e44b3729a);
 
 
 
@@ -1005,6 +1235,9 @@ function $b4a0a4fdc900495e$export$9064ff4e44b3729a(props, state, inputRef) {
         'aria-label': ariaLabel
     });
     let { minValue: minValue , maxValue: maxValue , step: step  } = state.value.getChannelRange('hue');
+    let forcedColorAdjustNoneStyle = {
+        forcedColorAdjust: 'none'
+    };
     return {
         trackProps: {
             ...trackInteractions,
@@ -1031,7 +1264,8 @@ function $b4a0a4fdc900495e$export$9064ff4e44b3729a(props, state, inputRef) {
             hsl(360, 100%, 50%)
           )
         `,
-                clipPath: `path(evenodd, "${$b4a0a4fdc900495e$var$circlePath(outerRadius, outerRadius, outerRadius)} ${$b4a0a4fdc900495e$var$circlePath(outerRadius, outerRadius, innerRadius)}")`
+                clipPath: `path(evenodd, "${$b4a0a4fdc900495e$var$circlePath(outerRadius, outerRadius, outerRadius)} ${$b4a0a4fdc900495e$var$circlePath(outerRadius, outerRadius, innerRadius)}")`,
+                ...forcedColorAdjustNoneStyle
             }
         },
         thumbProps: {
@@ -1041,7 +1275,8 @@ function $b4a0a4fdc900495e$export$9064ff4e44b3729a(props, state, inputRef) {
                 left: '50%',
                 top: '50%',
                 transform: `translate(calc(${x1}px - 50%), calc(${y1}px - 50%))`,
-                touchAction: 'none'
+                touchAction: 'none',
+                ...forcedColorAdjustNoneStyle
             }
         },
         inputProps: $7KHxM$mergeProps(inputLabellingProps, {
@@ -1064,9 +1299,6 @@ function $b4a0a4fdc900495e$var$circlePath(cx, cy, r) {
 }
 
 
-var $f6896b05b2ecad12$exports = {};
-
-$parcel$export($f6896b05b2ecad12$exports, "useColorField", () => $f6896b05b2ecad12$export$77e32ca575a28fdf);