@react-stately/color 3.5.4-nightly.4552 → 3.5.4-nightly.4558

package/dist/useColorSliderState.module.js

@@ -0,0 +1,70 @@
+import {normalizeColor as $799cddbef784668f$export$4cde5df63f53f473, parseColor as $799cddbef784668f$export$6e865ea70d7724f} from "./Color.module.js";
+import {useSliderState as $1Eavr$useSliderState} from "@react-stately/slider";
+import {useControlledState as $1Eavr$useControlledState} from "@react-stately/utils";
+
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ 
+
+
+function $25a25ac0d1624665$export$57bc203e1c9c6d44(props) {
+    let { channel: channel, value: value, defaultValue: defaultValue, onChange: onChange, locale: locale, ...otherProps } = props;
+    if (value == null && defaultValue == null) throw new Error("useColorSliderState requires a value or defaultValue");
+    let [color, setColor] = (0, $1Eavr$useControlledState)(value && (0, $799cddbef784668f$export$4cde5df63f53f473)(value), defaultValue && (0, $799cddbef784668f$export$4cde5df63f53f473)(defaultValue), onChange);
+    let sliderState = (0, $1Eavr$useSliderState)({
+        ...color.getChannelRange(channel),
+        ...otherProps,
+        // Unused except in getThumbValueLabel, which is overridden below. null to appease TypeScript.
+        numberFormatter: null,
+        value: color.getChannelValue(channel),
+        onChange (v) {
+            setColor(color.withChannelValue(channel, v));
+        },
+        onChangeEnd (v) {
+            // onChange will have already been called with the right value, this is just to trigger onChangeEnd
+            if (props.onChangeEnd) props.onChangeEnd(color.withChannelValue(channel, v));
+        }
+    });
+    let { step: step, pageSize: pageSize } = color.getChannelRange(channel);
+    return {
+        ...sliderState,
+        value: color,
+        setValue (value) {
+            setColor((0, $799cddbef784668f$export$4cde5df63f53f473)(value));
+        },
+        getDisplayColor () {
+            switch(channel){
+                case "hue":
+                    return (0, $799cddbef784668f$export$6e865ea70d7724f)(`hsl(${color.getChannelValue("hue")}, 100%, 50%)`);
+                case "lightness":
+                case "brightness":
+                case "saturation":
+                case "red":
+                case "green":
+                case "blue":
+                    return color.withChannelValue("alpha", 1);
+                case "alpha":
+                    return color;
+                default:
+                    throw new Error("Unknown color channel: " + channel);
+            }
+        },
+        getThumbValueLabel () {
+            return color.formatChannelValue(channel, locale);
+        },
+        step: step,
+        pageSize: pageSize
+    };
+}
+
+
+export {$25a25ac0d1624665$export$57bc203e1c9c6d44 as useColorSliderState};
+//# sourceMappingURL=useColorSliderState.module.js.map

package/dist/useColorSliderState.module.js.map

@@ -0,0 +1 @@
+{"mappings":";;;;AAAA;;;;;;;;;;CAUC;;;AA0BM,SAAS,0CAAoB,KAA8B;IAChE,IAAI,WAAC,OAAO,SAAE,KAAK,gBAAE,YAAY,YAAE,QAAQ,UAAE,MAAM,EAAE,GAAG,YAAW,GAAG;IACtE,IAAI,SAAS,QAAQ,gBAAgB,MACnC,MAAM,IAAI,MAAM;IAGlB,IAAI,CAAC,OAAO,SAAS,GAAG,CAAA,GAAA,yBAAiB,EAAE,SAAS,CAAA,GAAA,yCAAa,EAAE,QAAQ,gBAAgB,CAAA,GAAA,yCAAa,EAAE,eAAe;IACzH,IAAI,cAAc,CAAA,GAAA,qBAAa,EAAE;QAC/B,GAAG,MAAM,eAAe,CAAC,QAAQ;QACjC,GAAG,UAAU;QACb,8FAA8F;QAC9F,iBAAiB;QACjB,OAAO,MAAM,eAAe,CAAC;QAC7B,UAAS,CAAC;YACR,SAAS,MAAM,gBAAgB,CAAC,SAAS;QAC3C;QACA,aAAY,CAAC;YACX,mGAAmG;YACnG,IAAI,MAAM,WAAW,EACnB,MAAM,WAAW,CAAC,MAAM,gBAAgB,CAAC,SAAS;QAEtD;IACF;IAEA,IAAI,QAAC,IAAI,YAAE,QAAQ,EAAC,GAAG,MAAM,eAAe,CAAC;IAC7C,OAAO;QACL,GAAG,WAAW;QACd,OAAO;QACP,UAAS,KAAK;YACZ,SAAS,CAAA,GAAA,yCAAa,EAAE;QAC1B;QACA;YACE,OAAQ;gBACN,KAAK;oBACH,OAAO,CAAA,GAAA,wCAAS,EAAE,CAAC,IAAI,EAAE,MAAM,eAAe,CAAC,OAAO,YAAY,CAAC;gBACrE,KAAK;gBACL,KAAK;gBACL,KAAK;gBACL,KAAK;gBACL,KAAK;gBACL,KAAK;oBACH,OAAO,MAAM,gBAAgB,CAAC,SAAS;gBACzC,KAAK;oBACH,OAAO;gBAET;oBACE,MAAM,IAAI,MAAM,4BAA4B;YAChD;QACF;QACA;YACE,OAAO,MAAM,kBAAkB,CAAC,SAAS;QAC3C;cACA;kBACA;IACF;AACF","sources":["packages/@react-stately/color/src/useColorSliderState.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Color, ColorSliderProps} from '@react-types/color';\nimport {normalizeColor, parseColor} from './Color';\nimport {SliderState, useSliderState} from '@react-stately/slider';\nimport {useControlledState} from '@react-stately/utils';\n\nexport interface ColorSliderState extends SliderState {\n  /** The current color value represented by the color slider. */\n  readonly value: Color,\n  /** Sets the current color value. If a string is passed, it will be parsed to a Color. */\n  setValue(value: string | Color): void,\n  /** Returns the color that should be displayed in the slider instead of `value` or the optional parameter. */\n  getDisplayColor(): Color\n}\n\n\nexport interface ColorSliderStateOptions extends ColorSliderProps {\n  /** The locale to use for formatting the color channel value. */\n  locale: string\n}\n\n/**\n * Provides state management for a color slider component.\n * Color sliders allow users to adjust an individual channel of a color value.\n */\nexport function useColorSliderState(props: ColorSliderStateOptions): ColorSliderState {\n  let {channel, value, defaultValue, onChange, locale, ...otherProps} = props;\n  if (value == null && defaultValue == null) {\n    throw new Error('useColorSliderState requires a value or defaultValue');\n  }\n\n  let [color, setColor] = useControlledState(value && normalizeColor(value), defaultValue && normalizeColor(defaultValue), onChange);\n  let sliderState = useSliderState({\n    ...color.getChannelRange(channel),\n    ...otherProps,\n    // Unused except in getThumbValueLabel, which is overridden below. null to appease TypeScript.\n    numberFormatter: null,\n    value: color.getChannelValue(channel),\n    onChange(v) {\n      setColor(color.withChannelValue(channel, v));\n    },\n    onChangeEnd(v) {\n      // onChange will have already been called with the right value, this is just to trigger onChangeEnd\n      if (props.onChangeEnd) {\n        props.onChangeEnd(color.withChannelValue(channel, v));\n      }\n    }\n  });\n\n  let {step, pageSize} = color.getChannelRange(channel);\n  return {\n    ...sliderState,\n    value: color,\n    setValue(value) {\n      setColor(normalizeColor(value));\n    },\n    getDisplayColor() {\n      switch (channel) {\n        case 'hue':\n          return parseColor(`hsl(${color.getChannelValue('hue')}, 100%, 50%)`);\n        case 'lightness':\n        case 'brightness':\n        case 'saturation':\n        case 'red':\n        case 'green':\n        case 'blue':\n          return color.withChannelValue('alpha', 1);\n        case 'alpha': {\n          return color;\n        }\n        default:\n          throw new Error('Unknown color channel: ' + channel);\n      }\n    },\n    getThumbValueLabel() {\n      return color.formatChannelValue(channel, locale);\n    },\n    step,\n    pageSize\n  };\n}\n"],"names":[],"version":3,"file":"useColorSliderState.module.js.map"}

package/dist/useColorWheelState.main.js

@@ -0,0 +1,123 @@
+var $83fe1a57d631223b$exports = require("./Color.main.js");
+var $5Frb2$reactstatelyutils = require("@react-stately/utils");
+var $5Frb2$react = require("react");
+
+
+function $parcel$export(e, n, v, s) {
+  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
+}
+
+$parcel$export(module.exports, "useColorWheelState", () => $9d7d8736d45f74b8$export$f4301076d9336137);
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ 
+
+
+const $9d7d8736d45f74b8$var$DEFAULT_COLOR = (0, $83fe1a57d631223b$exports.parseColor)("hsl(0, 100%, 50%)");
+function $9d7d8736d45f74b8$var$roundToStep(value, step) {
+    return Math.round(value / step) * step;
+}
+function $9d7d8736d45f74b8$var$mod(n, m) {
+    return (n % m + m) % m;
+}
+function $9d7d8736d45f74b8$var$roundDown(v) {
+    let r = Math.floor(v);
+    if (r === v) return v - 1;
+    else return r;
+}
+function $9d7d8736d45f74b8$var$degToRad(deg) {
+    return deg * Math.PI / 180;
+}
+function $9d7d8736d45f74b8$var$radToDeg(rad) {
+    return rad * 180 / Math.PI;
+}
+// 0deg = 3 o'clock. increases clockwise
+function $9d7d8736d45f74b8$var$angleToCartesian(angle, radius) {
+    let rad = $9d7d8736d45f74b8$var$degToRad(360 - angle + 90);
+    let x = Math.sin(rad) * radius;
+    let y = Math.cos(rad) * radius;
+    return {
+        x: x,
+        y: y
+    };
+}
+function $9d7d8736d45f74b8$var$cartesianToAngle(x, y, radius) {
+    let deg = $9d7d8736d45f74b8$var$radToDeg(Math.atan2(y / radius, x / radius));
+    return (deg + 360) % 360;
+}
+function $9d7d8736d45f74b8$export$f4301076d9336137(props) {
+    let { defaultValue: defaultValue, onChange: onChange, onChangeEnd: onChangeEnd } = props;
+    if (!props.value && !defaultValue) defaultValue = $9d7d8736d45f74b8$var$DEFAULT_COLOR;
+    let [value, setValueState] = (0, $5Frb2$reactstatelyutils.useControlledState)((0, $83fe1a57d631223b$exports.normalizeColor)(props.value), (0, $83fe1a57d631223b$exports.normalizeColor)(defaultValue), onChange);
+    let valueRef = (0, $5Frb2$react.useRef)(value);
+    let setValue = (value)=>{
+        valueRef.current = value;
+        setValueState(value);
+    };
+    let channelRange = value.getChannelRange("hue");
+    let { minValue: minValueX, maxValue: maxValueX, step: step, pageSize: pageStep } = channelRange;
+    let [isDragging, setDragging] = (0, $5Frb2$react.useState)(false);
+    let isDraggingRef = (0, $5Frb2$react.useRef)(false);
+    let hue = value.getChannelValue("hue");
+    function setHue(v) {
+        if (v > 360) // Make sure you can always get back to 0.
+        v = 0;
+        v = $9d7d8736d45f74b8$var$roundToStep($9d7d8736d45f74b8$var$mod(v, 360), step);
+        if (hue !== v) {
+            let color = value.withChannelValue("hue", v);
+            setValue(color);
+        }
+    }
+    return {
+        value: value,
+        step: step,
+        pageStep: pageStep,
+        setValue (v) {
+            let color = (0, $83fe1a57d631223b$exports.normalizeColor)(v);
+            setValue(color);
+        },
+        hue: hue,
+        setHue: setHue,
+        setHueFromPoint (x, y, radius) {
+            setHue($9d7d8736d45f74b8$var$cartesianToAngle(x, y, radius));
+        },
+        getThumbPosition (radius) {
+            return $9d7d8736d45f74b8$var$angleToCartesian(value.getChannelValue("hue"), radius);
+        },
+        increment (stepSize = 1) {
+            let s = Math.max(stepSize, step);
+            let newValue = hue + s;
+            if (newValue >= maxValueX) // Make sure you can always get back to 0.
+            newValue = minValueX;
+            setHue($9d7d8736d45f74b8$var$roundToStep($9d7d8736d45f74b8$var$mod(newValue, 360), s));
+        },
+        decrement (stepSize = 1) {
+            let s = Math.max(stepSize, step);
+            if (hue === 0) // We can't just subtract step because this might be the case:
+            // |(previous step) - 0| < step size
+            setHue($9d7d8736d45f74b8$var$roundDown(360 / s) * s);
+            else setHue($9d7d8736d45f74b8$var$roundToStep($9d7d8736d45f74b8$var$mod(hue - s, 360), s));
+        },
+        setDragging (isDragging) {
+            let wasDragging = isDraggingRef.current;
+            isDraggingRef.current = isDragging;
+            if (onChangeEnd && !isDragging && wasDragging) onChangeEnd(valueRef.current);
+            setDragging(isDragging);
+        },
+        isDragging: isDragging,
+        getDisplayColor () {
+            return value.toFormat("hsl").withChannelValue("saturation", 100).withChannelValue("lightness", 50).withChannelValue("alpha", 1);
+        }
+    };
+}
+
+
+//# sourceMappingURL=useColorWheelState.main.js.map

package/dist/useColorWheelState.main.js.map

@@ -0,0 +1 @@
+{"mappings":"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","sources":["packages/@react-stately/color/src/useColorWheelState.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Color, ColorWheelProps} from '@react-types/color';\nimport {normalizeColor, parseColor} from './Color';\nimport {useControlledState} from '@react-stately/utils';\nimport {useRef, useState} from 'react';\n\nexport interface ColorWheelState {\n  /** The current color value represented by the color wheel. */\n  readonly value: Color,\n  /** Sets the color value represented by the color wheel, and triggers `onChange`. */\n  setValue(value: string | Color): void,\n\n  /** The current value of the hue channel displayed by the color wheel. */\n  readonly hue: number,\n  /** Sets the hue channel of the current color value and triggers `onChange`. */\n  setHue(value: number): void,\n\n  /** Sets the hue channel of the current color value based on the given coordinates and radius of the color wheel, and triggers `onChange`. */\n  setHueFromPoint(x: number, y: number, radius: number): void,\n  /** Returns the coordinates of the thumb relative to the center point of the color wheel. */\n  getThumbPosition(radius: number): {x: number, y: number},\n\n  /** Increments the hue by the given amount (defaults to 1). */\n  increment(stepSize?: number): void,\n  /** Decrements the hue by the given amount (defaults to 1). */\n  decrement(stepSize?: number): void,\n\n  /** Whether the color wheel is currently being dragged. */\n  readonly isDragging: boolean,\n  /** Sets whether the color wheel is being dragged. */\n  setDragging(value: boolean): void,\n  /** Returns the color that should be displayed in the color wheel instead of `value`. */\n  getDisplayColor(): Color,\n  /** The step value of the hue channel, used when incrementing and decrementing. */\n  step: number,\n  /** The page step value of the hue channel, used when incrementing and decrementing. */\n  pageStep: number\n}\n\nconst DEFAULT_COLOR = parseColor('hsl(0, 100%, 50%)');\n\nfunction roundToStep(value: number, step: number): number {\n  return Math.round(value / step) * step;\n}\n\nfunction mod(n: number, m: number) {\n  return ((n % m) + m) % m;\n}\n\nfunction roundDown(v: number) {\n  let r = Math.floor(v);\n  if (r === v) {\n    return v - 1;\n  } else {\n    return r;\n  }\n}\n\nfunction degToRad(deg: number) {\n  return deg * Math.PI / 180;\n}\n\nfunction radToDeg(rad: number) {\n  return rad * 180 / Math.PI;\n}\n\n// 0deg = 3 o'clock. increases clockwise\nfunction angleToCartesian(angle: number, radius: number): {x: number, y: number} {\n  let rad = degToRad(360 - angle + 90);\n  let x = Math.sin(rad) * (radius);\n  let y = Math.cos(rad) * (radius);\n  return {x, y};\n}\n\nfunction cartesianToAngle(x: number, y: number, radius: number): number {\n  let deg = radToDeg(Math.atan2(y / radius, x / radius));\n  return (deg + 360) % 360;\n}\n\n/**\n * Provides state management for a color wheel component.\n * Color wheels allow users to adjust the hue of an HSL or HSB color value on a circular track.\n */\nexport function useColorWheelState(props: ColorWheelProps): ColorWheelState {\n  let {defaultValue, onChange, onChangeEnd} = props;\n\n  if (!props.value && !defaultValue) {\n    defaultValue = DEFAULT_COLOR;\n  }\n\n  let [value, setValueState] = useControlledState(normalizeColor(props.value), normalizeColor(defaultValue), onChange);\n  let valueRef = useRef(value);\n  let setValue = (value: Color) => {\n    valueRef.current = value;\n    setValueState(value);\n  };\n\n  let channelRange = value.getChannelRange('hue');\n  let {minValue: minValueX, maxValue: maxValueX, step: step, pageSize: pageStep} = channelRange;\n  let [isDragging, setDragging] = useState(false);\n  let isDraggingRef = useRef(false);\n\n  let hue = value.getChannelValue('hue');\n  function setHue(v: number) {\n    if (v > 360) {\n      // Make sure you can always get back to 0.\n      v = 0;\n    }\n    v = roundToStep(mod(v, 360), step);\n    if (hue !== v) {\n      let color = value.withChannelValue('hue', v);\n      setValue(color);\n    }\n  }\n\n  return {\n    value,\n    step,\n    pageStep,\n    setValue(v) {\n      let color = normalizeColor(v);\n      setValue(color);\n    },\n    hue,\n    setHue,\n    setHueFromPoint(x, y, radius) {\n      setHue(cartesianToAngle(x, y, radius));\n    },\n    getThumbPosition(radius) {\n      return angleToCartesian(value.getChannelValue('hue'), radius);\n    },\n    increment(stepSize = 1) {\n      let s = Math.max(stepSize, step);\n      let newValue = hue + s;\n      if (newValue >= maxValueX) {\n        // Make sure you can always get back to 0.\n        newValue = minValueX;\n      }\n      setHue(roundToStep(mod(newValue, 360), s));\n    },\n    decrement(stepSize = 1) {\n      let s = Math.max(stepSize, step);\n      if (hue === 0) {\n        // We can't just subtract step because this might be the case:\n        // |(previous step) - 0| < step size\n        setHue(roundDown(360 / s) * s);\n      } else {\n        setHue(roundToStep(mod(hue - s, 360), s));\n      }\n    },\n    setDragging(isDragging) {\n      let wasDragging = isDraggingRef.current;\n      isDraggingRef.current = isDragging;\n\n      if (onChangeEnd && !isDragging && wasDragging) {\n        onChangeEnd(valueRef.current);\n      }\n\n      setDragging(isDragging);\n    },\n    isDragging,\n    getDisplayColor() {\n      return value.toFormat('hsl').withChannelValue('saturation', 100).withChannelValue('lightness', 50).withChannelValue('alpha', 1);\n    }\n  };\n}\n"],"names":[],"version":3,"file":"useColorWheelState.main.js.map"}

package/dist/useColorWheelState.mjs

@@ -0,0 +1,118 @@
+import {normalizeColor as $799cddbef784668f$export$4cde5df63f53f473, parseColor as $799cddbef784668f$export$6e865ea70d7724f} from "./Color.mjs";
+import {useControlledState as $d4Pfi$useControlledState} from "@react-stately/utils";
+import {useRef as $d4Pfi$useRef, useState as $d4Pfi$useState} from "react";
+
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ 
+
+
+const $ee4262c74a467b07$var$DEFAULT_COLOR = (0, $799cddbef784668f$export$6e865ea70d7724f)("hsl(0, 100%, 50%)");
+function $ee4262c74a467b07$var$roundToStep(value, step) {
+    return Math.round(value / step) * step;
+}
+function $ee4262c74a467b07$var$mod(n, m) {
+    return (n % m + m) % m;
+}
+function $ee4262c74a467b07$var$roundDown(v) {
+    let r = Math.floor(v);
+    if (r === v) return v - 1;
+    else return r;
+}
+function $ee4262c74a467b07$var$degToRad(deg) {
+    return deg * Math.PI / 180;
+}
+function $ee4262c74a467b07$var$radToDeg(rad) {
+    return rad * 180 / Math.PI;
+}
+// 0deg = 3 o'clock. increases clockwise
+function $ee4262c74a467b07$var$angleToCartesian(angle, radius) {
+    let rad = $ee4262c74a467b07$var$degToRad(360 - angle + 90);
+    let x = Math.sin(rad) * radius;
+    let y = Math.cos(rad) * radius;
+    return {
+        x: x,
+        y: y
+    };
+}
+function $ee4262c74a467b07$var$cartesianToAngle(x, y, radius) {
+    let deg = $ee4262c74a467b07$var$radToDeg(Math.atan2(y / radius, x / radius));
+    return (deg + 360) % 360;
+}
+function $ee4262c74a467b07$export$f4301076d9336137(props) {
+    let { defaultValue: defaultValue, onChange: onChange, onChangeEnd: onChangeEnd } = props;
+    if (!props.value && !defaultValue) defaultValue = $ee4262c74a467b07$var$DEFAULT_COLOR;
+    let [value, setValueState] = (0, $d4Pfi$useControlledState)((0, $799cddbef784668f$export$4cde5df63f53f473)(props.value), (0, $799cddbef784668f$export$4cde5df63f53f473)(defaultValue), onChange);
+    let valueRef = (0, $d4Pfi$useRef)(value);
+    let setValue = (value)=>{
+        valueRef.current = value;
+        setValueState(value);
+    };
+    let channelRange = value.getChannelRange("hue");
+    let { minValue: minValueX, maxValue: maxValueX, step: step, pageSize: pageStep } = channelRange;
+    let [isDragging, setDragging] = (0, $d4Pfi$useState)(false);
+    let isDraggingRef = (0, $d4Pfi$useRef)(false);
+    let hue = value.getChannelValue("hue");
+    function setHue(v) {
+        if (v > 360) // Make sure you can always get back to 0.
+        v = 0;
+        v = $ee4262c74a467b07$var$roundToStep($ee4262c74a467b07$var$mod(v, 360), step);
+        if (hue !== v) {
+            let color = value.withChannelValue("hue", v);
+            setValue(color);
+        }
+    }
+    return {
+        value: value,
+        step: step,
+        pageStep: pageStep,
+        setValue (v) {
+            let color = (0, $799cddbef784668f$export$4cde5df63f53f473)(v);
+            setValue(color);
+        },
+        hue: hue,
+        setHue: setHue,
+        setHueFromPoint (x, y, radius) {
+            setHue($ee4262c74a467b07$var$cartesianToAngle(x, y, radius));
+        },
+        getThumbPosition (radius) {
+            return $ee4262c74a467b07$var$angleToCartesian(value.getChannelValue("hue"), radius);
+        },
+        increment (stepSize = 1) {
+            let s = Math.max(stepSize, step);
+            let newValue = hue + s;
+            if (newValue >= maxValueX) // Make sure you can always get back to 0.
+            newValue = minValueX;
+            setHue($ee4262c74a467b07$var$roundToStep($ee4262c74a467b07$var$mod(newValue, 360), s));
+        },
+        decrement (stepSize = 1) {
+            let s = Math.max(stepSize, step);
+            if (hue === 0) // We can't just subtract step because this might be the case:
+            // |(previous step) - 0| < step size
+            setHue($ee4262c74a467b07$var$roundDown(360 / s) * s);
+            else setHue($ee4262c74a467b07$var$roundToStep($ee4262c74a467b07$var$mod(hue - s, 360), s));
+        },
+        setDragging (isDragging) {
+            let wasDragging = isDraggingRef.current;
+            isDraggingRef.current = isDragging;
+            if (onChangeEnd && !isDragging && wasDragging) onChangeEnd(valueRef.current);
+            setDragging(isDragging);
+        },
+        isDragging: isDragging,
+        getDisplayColor () {
+            return value.toFormat("hsl").withChannelValue("saturation", 100).withChannelValue("lightness", 50).withChannelValue("alpha", 1);
+        }
+    };
+}
+
+
+export {$ee4262c74a467b07$export$f4301076d9336137 as useColorWheelState};
+//# sourceMappingURL=useColorWheelState.mjs.map

package/dist/useColorWheelState.module.js

@@ -0,0 +1,118 @@
+import {normalizeColor as $799cddbef784668f$export$4cde5df63f53f473, parseColor as $799cddbef784668f$export$6e865ea70d7724f} from "./Color.module.js";
+import {useControlledState as $d4Pfi$useControlledState} from "@react-stately/utils";
+import {useRef as $d4Pfi$useRef, useState as $d4Pfi$useState} from "react";
+
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ 
+
+
+const $ee4262c74a467b07$var$DEFAULT_COLOR = (0, $799cddbef784668f$export$6e865ea70d7724f)("hsl(0, 100%, 50%)");
+function $ee4262c74a467b07$var$roundToStep(value, step) {
+    return Math.round(value / step) * step;
+}
+function $ee4262c74a467b07$var$mod(n, m) {
+    return (n % m + m) % m;
+}
+function $ee4262c74a467b07$var$roundDown(v) {
+    let r = Math.floor(v);
+    if (r === v) return v - 1;
+    else return r;
+}
+function $ee4262c74a467b07$var$degToRad(deg) {
+    return deg * Math.PI / 180;
+}
+function $ee4262c74a467b07$var$radToDeg(rad) {
+    return rad * 180 / Math.PI;
+}
+// 0deg = 3 o'clock. increases clockwise
+function $ee4262c74a467b07$var$angleToCartesian(angle, radius) {
+    let rad = $ee4262c74a467b07$var$degToRad(360 - angle + 90);
+    let x = Math.sin(rad) * radius;
+    let y = Math.cos(rad) * radius;
+    return {
+        x: x,
+        y: y
+    };
+}
+function $ee4262c74a467b07$var$cartesianToAngle(x, y, radius) {
+    let deg = $ee4262c74a467b07$var$radToDeg(Math.atan2(y / radius, x / radius));
+    return (deg + 360) % 360;
+}
+function $ee4262c74a467b07$export$f4301076d9336137(props) {
+    let { defaultValue: defaultValue, onChange: onChange, onChangeEnd: onChangeEnd } = props;
+    if (!props.value && !defaultValue) defaultValue = $ee4262c74a467b07$var$DEFAULT_COLOR;
+    let [value, setValueState] = (0, $d4Pfi$useControlledState)((0, $799cddbef784668f$export$4cde5df63f53f473)(props.value), (0, $799cddbef784668f$export$4cde5df63f53f473)(defaultValue), onChange);
+    let valueRef = (0, $d4Pfi$useRef)(value);
+    let setValue = (value)=>{
+        valueRef.current = value;
+        setValueState(value);
+    };
+    let channelRange = value.getChannelRange("hue");
+    let { minValue: minValueX, maxValue: maxValueX, step: step, pageSize: pageStep } = channelRange;
+    let [isDragging, setDragging] = (0, $d4Pfi$useState)(false);
+    let isDraggingRef = (0, $d4Pfi$useRef)(false);
+    let hue = value.getChannelValue("hue");
+    function setHue(v) {
+        if (v > 360) // Make sure you can always get back to 0.
+        v = 0;
+        v = $ee4262c74a467b07$var$roundToStep($ee4262c74a467b07$var$mod(v, 360), step);
+        if (hue !== v) {
+            let color = value.withChannelValue("hue", v);
+            setValue(color);
+        }
+    }
+    return {
+        value: value,
+        step: step,
+        pageStep: pageStep,
+        setValue (v) {
+            let color = (0, $799cddbef784668f$export$4cde5df63f53f473)(v);
+            setValue(color);
+        },
+        hue: hue,
+        setHue: setHue,
+        setHueFromPoint (x, y, radius) {
+            setHue($ee4262c74a467b07$var$cartesianToAngle(x, y, radius));
+        },
+        getThumbPosition (radius) {
+            return $ee4262c74a467b07$var$angleToCartesian(value.getChannelValue("hue"), radius);
+        },
+        increment (stepSize = 1) {
+            let s = Math.max(stepSize, step);
+            let newValue = hue + s;
+            if (newValue >= maxValueX) // Make sure you can always get back to 0.
+            newValue = minValueX;
+            setHue($ee4262c74a467b07$var$roundToStep($ee4262c74a467b07$var$mod(newValue, 360), s));
+        },
+        decrement (stepSize = 1) {
+            let s = Math.max(stepSize, step);
+            if (hue === 0) // We can't just subtract step because this might be the case:
+            // |(previous step) - 0| < step size
+            setHue($ee4262c74a467b07$var$roundDown(360 / s) * s);
+            else setHue($ee4262c74a467b07$var$roundToStep($ee4262c74a467b07$var$mod(hue - s, 360), s));
+        },
+        setDragging (isDragging) {
+            let wasDragging = isDraggingRef.current;
+            isDraggingRef.current = isDragging;
+            if (onChangeEnd && !isDragging && wasDragging) onChangeEnd(valueRef.current);
+            setDragging(isDragging);
+        },
+        isDragging: isDragging,
+        getDisplayColor () {
+            return value.toFormat("hsl").withChannelValue("saturation", 100).withChannelValue("lightness", 50).withChannelValue("alpha", 1);
+        }
+    };
+}
+
+
+export {$ee4262c74a467b07$export$f4301076d9336137 as useColorWheelState};
+//# sourceMappingURL=useColorWheelState.module.js.map

package/dist/useColorWheelState.module.js.map

@@ -0,0 +1 @@
+{"mappings":"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","sources":["packages/@react-stately/color/src/useColorWheelState.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Color, ColorWheelProps} from '@react-types/color';\nimport {normalizeColor, parseColor} from './Color';\nimport {useControlledState} from '@react-stately/utils';\nimport {useRef, useState} from 'react';\n\nexport interface ColorWheelState {\n  /** The current color value represented by the color wheel. */\n  readonly value: Color,\n  /** Sets the color value represented by the color wheel, and triggers `onChange`. */\n  setValue(value: string | Color): void,\n\n  /** The current value of the hue channel displayed by the color wheel. */\n  readonly hue: number,\n  /** Sets the hue channel of the current color value and triggers `onChange`. */\n  setHue(value: number): void,\n\n  /** Sets the hue channel of the current color value based on the given coordinates and radius of the color wheel, and triggers `onChange`. */\n  setHueFromPoint(x: number, y: number, radius: number): void,\n  /** Returns the coordinates of the thumb relative to the center point of the color wheel. */\n  getThumbPosition(radius: number): {x: number, y: number},\n\n  /** Increments the hue by the given amount (defaults to 1). */\n  increment(stepSize?: number): void,\n  /** Decrements the hue by the given amount (defaults to 1). */\n  decrement(stepSize?: number): void,\n\n  /** Whether the color wheel is currently being dragged. */\n  readonly isDragging: boolean,\n  /** Sets whether the color wheel is being dragged. */\n  setDragging(value: boolean): void,\n  /** Returns the color that should be displayed in the color wheel instead of `value`. */\n  getDisplayColor(): Color,\n  /** The step value of the hue channel, used when incrementing and decrementing. */\n  step: number,\n  /** The page step value of the hue channel, used when incrementing and decrementing. */\n  pageStep: number\n}\n\nconst DEFAULT_COLOR = parseColor('hsl(0, 100%, 50%)');\n\nfunction roundToStep(value: number, step: number): number {\n  return Math.round(value / step) * step;\n}\n\nfunction mod(n: number, m: number) {\n  return ((n % m) + m) % m;\n}\n\nfunction roundDown(v: number) {\n  let r = Math.floor(v);\n  if (r === v) {\n    return v - 1;\n  } else {\n    return r;\n  }\n}\n\nfunction degToRad(deg: number) {\n  return deg * Math.PI / 180;\n}\n\nfunction radToDeg(rad: number) {\n  return rad * 180 / Math.PI;\n}\n\n// 0deg = 3 o'clock. increases clockwise\nfunction angleToCartesian(angle: number, radius: number): {x: number, y: number} {\n  let rad = degToRad(360 - angle + 90);\n  let x = Math.sin(rad) * (radius);\n  let y = Math.cos(rad) * (radius);\n  return {x, y};\n}\n\nfunction cartesianToAngle(x: number, y: number, radius: number): number {\n  let deg = radToDeg(Math.atan2(y / radius, x / radius));\n  return (deg + 360) % 360;\n}\n\n/**\n * Provides state management for a color wheel component.\n * Color wheels allow users to adjust the hue of an HSL or HSB color value on a circular track.\n */\nexport function useColorWheelState(props: ColorWheelProps): ColorWheelState {\n  let {defaultValue, onChange, onChangeEnd} = props;\n\n  if (!props.value && !defaultValue) {\n    defaultValue = DEFAULT_COLOR;\n  }\n\n  let [value, setValueState] = useControlledState(normalizeColor(props.value), normalizeColor(defaultValue), onChange);\n  let valueRef = useRef(value);\n  let setValue = (value: Color) => {\n    valueRef.current = value;\n    setValueState(value);\n  };\n\n  let channelRange = value.getChannelRange('hue');\n  let {minValue: minValueX, maxValue: maxValueX, step: step, pageSize: pageStep} = channelRange;\n  let [isDragging, setDragging] = useState(false);\n  let isDraggingRef = useRef(false);\n\n  let hue = value.getChannelValue('hue');\n  function setHue(v: number) {\n    if (v > 360) {\n      // Make sure you can always get back to 0.\n      v = 0;\n    }\n    v = roundToStep(mod(v, 360), step);\n    if (hue !== v) {\n      let color = value.withChannelValue('hue', v);\n      setValue(color);\n    }\n  }\n\n  return {\n    value,\n    step,\n    pageStep,\n    setValue(v) {\n      let color = normalizeColor(v);\n      setValue(color);\n    },\n    hue,\n    setHue,\n    setHueFromPoint(x, y, radius) {\n      setHue(cartesianToAngle(x, y, radius));\n    },\n    getThumbPosition(radius) {\n      return angleToCartesian(value.getChannelValue('hue'), radius);\n    },\n    increment(stepSize = 1) {\n      let s = Math.max(stepSize, step);\n      let newValue = hue + s;\n      if (newValue >= maxValueX) {\n        // Make sure you can always get back to 0.\n        newValue = minValueX;\n      }\n      setHue(roundToStep(mod(newValue, 360), s));\n    },\n    decrement(stepSize = 1) {\n      let s = Math.max(stepSize, step);\n      if (hue === 0) {\n        // We can't just subtract step because this might be the case:\n        // |(previous step) - 0| < step size\n        setHue(roundDown(360 / s) * s);\n      } else {\n        setHue(roundToStep(mod(hue - s, 360), s));\n      }\n    },\n    setDragging(isDragging) {\n      let wasDragging = isDraggingRef.current;\n      isDraggingRef.current = isDragging;\n\n      if (onChangeEnd && !isDragging && wasDragging) {\n        onChangeEnd(valueRef.current);\n      }\n\n      setDragging(isDragging);\n    },\n    isDragging,\n    getDisplayColor() {\n      return value.toFormat('hsl').withChannelValue('saturation', 100).withChannelValue('lightness', 50).withChannelValue('alpha', 1);\n    }\n  };\n}\n"],"names":[],"version":3,"file":"useColorWheelState.module.js.map"}

package/dist/zh-CN.main.js

@@ -7,8 +7,8 @@ module.exports = {
     "lightness": `\u{660E}\u{4EAE}\u{5EA6}`,
     "red": `\u{7EA2}\u{8272}`,
     "saturation": `\u{9971}\u{548C}\u{5EA6}`,
-    "colorName": (args)=>`${args.transparency} ${args.lightness} ${args.chroma} ${args.hue}`,
-    "transparency": (args)=>`${args.percent} transparent`,
+    "colorName": (args)=>`${args.lightness} ${args.chroma} ${args.hue}`,
+    "transparentColorName": (args)=>`${args.lightness} ${args.chroma} ${args.hue}, ${args.percentTransparent} transparent`,
     "very dark": `very dark`,
     "dark": `dark`,
     "light": `light`,

package/dist/zh-CN.main.js.map

@@ -1 +1 @@
-{"mappings":"AAAA,iBAAiB;IAAG,SAAS,CAAC,KAAK,CAAC;IAClC,QAAQ,CAAC,gBAAE,CAAC;IACZ,cAAc,CAAC,gBAAE,CAAC;IAClB,SAAS,CAAC,gBAAE,CAAC;IACb,OAAO,CAAC,gBAAE,CAAC;IACX,aAAa,CAAC,wBAAG,CAAC;IAClB,OAAO,CAAC,gBAAE,CAAC;IACX,cAAc,CAAC,wBAAG,CAAC;IACnB,aAAa,CAAC,OAAS,CAAC,EAAE,KAAK,YAAY,CAAC,CAAC,EAAE,KAAK,SAAS,CAAC,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC;IAC1F,gBAAgB,CAAC,OAAS,CAAC,EAAE,KAAK,OAAO,CAAC,YAAY,CAAC;IACvD,aAAa,CAAC,SAAS,CAAC;IACxB,QAAQ,CAAC,IAAI,CAAC;IACd,SAAS,CAAC,KAAK,CAAC;IAChB,cAAc,CAAC,UAAU,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC;IACd,WAAW,CAAC,OAAO,CAAC;IACpB,WAAW,CAAC,OAAO,CAAC;IACpB,SAAS,CAAC,KAAK,CAAC;IAChB,SAAS,CAAC,KAAK,CAAC;IAChB,QAAQ,CAAC,IAAI,CAAC;IACd,QAAQ,CAAC,IAAI,CAAC;IACd,YAAY,CAAC,QAAQ,CAAC;IACtB,cAAc,CAAC,UAAU,CAAC;IAC1B,SAAS,CAAC,KAAK,CAAC;IAChB,UAAU,CAAC,MAAM,CAAC;IAClB,iBAAiB,CAAC,aAAa,CAAC;IAChC,gBAAgB,CAAC,YAAY,CAAC;IAC9B,UAAU,CAAC,MAAM,CAAC;IAClB,gBAAgB,CAAC,YAAY,CAAC;IAC9B,cAAc,CAAC,UAAU,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC;IACd,aAAa,CAAC,SAAS,CAAC;IACxB,eAAe,CAAC,WAAW,CAAC;IAC5B,UAAU,CAAC,MAAM,CAAC;IAClB,kBAAkB,CAAC,cAAc,CAAC;IAClC,WAAW,CAAC,OAAO,CAAC;IACpB,gBAAgB,CAAC,YAAY,CAAC;AAChC","sources":["packages/@react-stately/color/intl/zh-CN.json"],"sourcesContent":["{\n  \"alpha\": \"Alpha\",\n  \"blue\": \"蓝色\",\n  \"brightness\": \"亮度\",\n  \"green\": \"绿色\",\n  \"hue\": \"色相\",\n  \"lightness\": \"明亮度\",\n  \"red\": \"红色\",\n  \"saturation\": \"饱和度\",\n  \"colorName\": \"{transparency} {lightness} {chroma} {hue}\",\n  \"transparency\": \"{percent} transparent\",\n  \"very dark\": \"very dark\",\n  \"dark\": \"dark\",\n  \"light\": \"light\",\n  \"very light\": \"very light\",\n  \"pale\": \"pale\",\n  \"grayish\": \"grayish\",\n  \"vibrant\": \"vibrant\",\n  \"black\": \"black\",\n  \"white\": \"white\",\n  \"gray\": \"gray\",\n  \"pink\": \"pink\",\n  \"pink red\": \"pink red\",\n  \"red orange\": \"red orange\",\n  \"brown\": \"brown\",\n  \"orange\": \"orange\",\n  \"orange yellow\": \"orange yellow\",\n  \"brown yellow\": \"brown yellow\",\n  \"yellow\": \"yellow\",\n  \"yellow green\": \"yellow green\",\n  \"green cyan\": \"green cyan\",\n  \"cyan\": \"cyan\",\n  \"cyan blue\": \"cyan blue\",\n  \"blue purple\": \"blue purple\",\n  \"purple\": \"purple\",\n  \"purple magenta\": \"purple magenta\",\n  \"magenta\": \"magenta\",\n  \"magenta pink\": \"magenta pink\"\n}\n"],"names":[],"version":3,"file":"zh-CN.main.js.map"}
+{"mappings":"AAAA,iBAAiB;IAAG,SAAS,CAAC,KAAK,CAAC;IAClC,QAAQ,CAAC,gBAAE,CAAC;IACZ,cAAc,CAAC,gBAAE,CAAC;IAClB,SAAS,CAAC,gBAAE,CAAC;IACb,OAAO,CAAC,gBAAE,CAAC;IACX,aAAa,CAAC,wBAAG,CAAC;IAClB,OAAO,CAAC,gBAAE,CAAC;IACX,cAAc,CAAC,wBAAG,CAAC;IACnB,aAAa,CAAC,OAAS,CAAC,EAAE,KAAK,SAAS,CAAC,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC;IACrE,wBAAwB,CAAC,OAAS,CAAC,EAAE,KAAK,SAAS,CAAC,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,EAAE,KAAK,kBAAkB,CAAC,YAAY,CAAC;IACxH,aAAa,CAAC,SAAS,CAAC;IACxB,QAAQ,CAAC,IAAI,CAAC;IACd,SAAS,CAAC,KAAK,CAAC;IAChB,cAAc,CAAC,UAAU,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC;IACd,WAAW,CAAC,OAAO,CAAC;IACpB,WAAW,CAAC,OAAO,CAAC;IACpB,SAAS,CAAC,KAAK,CAAC;IAChB,SAAS,CAAC,KAAK,CAAC;IAChB,QAAQ,CAAC,IAAI,CAAC;IACd,QAAQ,CAAC,IAAI,CAAC;IACd,YAAY,CAAC,QAAQ,CAAC;IACtB,cAAc,CAAC,UAAU,CAAC;IAC1B,SAAS,CAAC,KAAK,CAAC;IAChB,UAAU,CAAC,MAAM,CAAC;IAClB,iBAAiB,CAAC,aAAa,CAAC;IAChC,gBAAgB,CAAC,YAAY,CAAC;IAC9B,UAAU,CAAC,MAAM,CAAC;IAClB,gBAAgB,CAAC,YAAY,CAAC;IAC9B,cAAc,CAAC,UAAU,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC;IACd,aAAa,CAAC,SAAS,CAAC;IACxB,eAAe,CAAC,WAAW,CAAC;IAC5B,UAAU,CAAC,MAAM,CAAC;IAClB,kBAAkB,CAAC,cAAc,CAAC;IAClC,WAAW,CAAC,OAAO,CAAC;IACpB,gBAAgB,CAAC,YAAY,CAAC;AAChC","sources":["packages/@react-stately/color/intl/zh-CN.json"],"sourcesContent":["{\n  \"alpha\": \"Alpha\",\n  \"blue\": \"蓝色\",\n  \"brightness\": \"亮度\",\n  \"green\": \"绿色\",\n  \"hue\": \"色相\",\n  \"lightness\": \"明亮度\",\n  \"red\": \"红色\",\n  \"saturation\": \"饱和度\",\n  \"colorName\": \"{lightness} {chroma} {hue}\",\n  \"transparentColorName\": \"{lightness} {chroma} {hue}, {percentTransparent} transparent\",\n  \"very dark\": \"very dark\",\n  \"dark\": \"dark\",\n  \"light\": \"light\",\n  \"very light\": \"very light\",\n  \"pale\": \"pale\",\n  \"grayish\": \"grayish\",\n  \"vibrant\": \"vibrant\",\n  \"black\": \"black\",\n  \"white\": \"white\",\n  \"gray\": \"gray\",\n  \"pink\": \"pink\",\n  \"pink red\": \"pink red\",\n  \"red orange\": \"red orange\",\n  \"brown\": \"brown\",\n  \"orange\": \"orange\",\n  \"orange yellow\": \"orange yellow\",\n  \"brown yellow\": \"brown yellow\",\n  \"yellow\": \"yellow\",\n  \"yellow green\": \"yellow green\",\n  \"green cyan\": \"green cyan\",\n  \"cyan\": \"cyan\",\n  \"cyan blue\": \"cyan blue\",\n  \"blue purple\": \"blue purple\",\n  \"purple\": \"purple\",\n  \"purple magenta\": \"purple magenta\",\n  \"magenta\": \"magenta\",\n  \"magenta pink\": \"magenta pink\"\n}\n"],"names":[],"version":3,"file":"zh-CN.main.js.map"}

package/dist/zh-CN.mjs

@@ -8,8 +8,8 @@ $a9cedf75b94e4916$exports = {
     "lightness": `\u{660E}\u{4EAE}\u{5EA6}`,
     "red": `\u{7EA2}\u{8272}`,
     "saturation": `\u{9971}\u{548C}\u{5EA6}`,
-    "colorName": (args)=>`${args.transparency} ${args.lightness} ${args.chroma} ${args.hue}`,
-    "transparency": (args)=>`${args.percent} transparent`,
+    "colorName": (args)=>`${args.lightness} ${args.chroma} ${args.hue}`,
+    "transparentColorName": (args)=>`${args.lightness} ${args.chroma} ${args.hue}, ${args.percentTransparent} transparent`,
     "very dark": `very dark`,
     "dark": `dark`,
     "light": `light`,
@@ -41,4 +41,4 @@ $a9cedf75b94e4916$exports = {
 
 
 export {$a9cedf75b94e4916$exports as default};
-//# sourceMappingURL=zh-CN.module.js.map
+//# sourceMappingURL=zh-CN.mjs.map

package/dist/zh-CN.module.js

@@ -8,8 +8,8 @@ $a9cedf75b94e4916$exports = {
     "lightness": `\u{660E}\u{4EAE}\u{5EA6}`,
     "red": `\u{7EA2}\u{8272}`,
     "saturation": `\u{9971}\u{548C}\u{5EA6}`,
-    "colorName": (args)=>`${args.transparency} ${args.lightness} ${args.chroma} ${args.hue}`,
-    "transparency": (args)=>`${args.percent} transparent`,
+    "colorName": (args)=>`${args.lightness} ${args.chroma} ${args.hue}`,
+    "transparentColorName": (args)=>`${args.lightness} ${args.chroma} ${args.hue}, ${args.percentTransparent} transparent`,
     "very dark": `very dark`,
     "dark": `dark`,
     "light": `light`,

package/dist/zh-CN.module.js.map

@@ -1 +1 @@
-{"mappings":";AAAA,4BAAiB;IAAG,SAAS,CAAC,KAAK,CAAC;IAClC,QAAQ,CAAC,gBAAE,CAAC;IACZ,cAAc,CAAC,gBAAE,CAAC;IAClB,SAAS,CAAC,gBAAE,CAAC;IACb,OAAO,CAAC,gBAAE,CAAC;IACX,aAAa,CAAC,wBAAG,CAAC;IAClB,OAAO,CAAC,gBAAE,CAAC;IACX,cAAc,CAAC,wBAAG,CAAC;IACnB,aAAa,CAAC,OAAS,CAAC,EAAE,KAAK,YAAY,CAAC,CAAC,EAAE,KAAK,SAAS,CAAC,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC;IAC1F,gBAAgB,CAAC,OAAS,CAAC,EAAE,KAAK,OAAO,CAAC,YAAY,CAAC;IACvD,aAAa,CAAC,SAAS,CAAC;IACxB,QAAQ,CAAC,IAAI,CAAC;IACd,SAAS,CAAC,KAAK,CAAC;IAChB,cAAc,CAAC,UAAU,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC;IACd,WAAW,CAAC,OAAO,CAAC;IACpB,WAAW,CAAC,OAAO,CAAC;IACpB,SAAS,CAAC,KAAK,CAAC;IAChB,SAAS,CAAC,KAAK,CAAC;IAChB,QAAQ,CAAC,IAAI,CAAC;IACd,QAAQ,CAAC,IAAI,CAAC;IACd,YAAY,CAAC,QAAQ,CAAC;IACtB,cAAc,CAAC,UAAU,CAAC;IAC1B,SAAS,CAAC,KAAK,CAAC;IAChB,UAAU,CAAC,MAAM,CAAC;IAClB,iBAAiB,CAAC,aAAa,CAAC;IAChC,gBAAgB,CAAC,YAAY,CAAC;IAC9B,UAAU,CAAC,MAAM,CAAC;IAClB,gBAAgB,CAAC,YAAY,CAAC;IAC9B,cAAc,CAAC,UAAU,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC;IACd,aAAa,CAAC,SAAS,CAAC;IACxB,eAAe,CAAC,WAAW,CAAC;IAC5B,UAAU,CAAC,MAAM,CAAC;IAClB,kBAAkB,CAAC,cAAc,CAAC;IAClC,WAAW,CAAC,OAAO,CAAC;IACpB,gBAAgB,CAAC,YAAY,CAAC;AAChC","sources":["packages/@react-stately/color/intl/zh-CN.json"],"sourcesContent":["{\n  \"alpha\": \"Alpha\",\n  \"blue\": \"蓝色\",\n  \"brightness\": \"亮度\",\n  \"green\": \"绿色\",\n  \"hue\": \"色相\",\n  \"lightness\": \"明亮度\",\n  \"red\": \"红色\",\n  \"saturation\": \"饱和度\",\n  \"colorName\": \"{transparency} {lightness} {chroma} {hue}\",\n  \"transparency\": \"{percent} transparent\",\n  \"very dark\": \"very dark\",\n  \"dark\": \"dark\",\n  \"light\": \"light\",\n  \"very light\": \"very light\",\n  \"pale\": \"pale\",\n  \"grayish\": \"grayish\",\n  \"vibrant\": \"vibrant\",\n  \"black\": \"black\",\n  \"white\": \"white\",\n  \"gray\": \"gray\",\n  \"pink\": \"pink\",\n  \"pink red\": \"pink red\",\n  \"red orange\": \"red orange\",\n  \"brown\": \"brown\",\n  \"orange\": \"orange\",\n  \"orange yellow\": \"orange yellow\",\n  \"brown yellow\": \"brown yellow\",\n  \"yellow\": \"yellow\",\n  \"yellow green\": \"yellow green\",\n  \"green cyan\": \"green cyan\",\n  \"cyan\": \"cyan\",\n  \"cyan blue\": \"cyan blue\",\n  \"blue purple\": \"blue purple\",\n  \"purple\": \"purple\",\n  \"purple magenta\": \"purple magenta\",\n  \"magenta\": \"magenta\",\n  \"magenta pink\": \"magenta pink\"\n}\n"],"names":[],"version":3,"file":"zh-CN.module.js.map"}
+{"mappings":";AAAA,4BAAiB;IAAG,SAAS,CAAC,KAAK,CAAC;IAClC,QAAQ,CAAC,gBAAE,CAAC;IACZ,cAAc,CAAC,gBAAE,CAAC;IAClB,SAAS,CAAC,gBAAE,CAAC;IACb,OAAO,CAAC,gBAAE,CAAC;IACX,aAAa,CAAC,wBAAG,CAAC;IAClB,OAAO,CAAC,gBAAE,CAAC;IACX,cAAc,CAAC,wBAAG,CAAC;IACnB,aAAa,CAAC,OAAS,CAAC,EAAE,KAAK,SAAS,CAAC,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC;IACrE,wBAAwB,CAAC,OAAS,CAAC,EAAE,KAAK,SAAS,CAAC,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,EAAE,KAAK,kBAAkB,CAAC,YAAY,CAAC;IACxH,aAAa,CAAC,SAAS,CAAC;IACxB,QAAQ,CAAC,IAAI,CAAC;IACd,SAAS,CAAC,KAAK,CAAC;IAChB,cAAc,CAAC,UAAU,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC;IACd,WAAW,CAAC,OAAO,CAAC;IACpB,WAAW,CAAC,OAAO,CAAC;IACpB,SAAS,CAAC,KAAK,CAAC;IAChB,SAAS,CAAC,KAAK,CAAC;IAChB,QAAQ,CAAC,IAAI,CAAC;IACd,QAAQ,CAAC,IAAI,CAAC;IACd,YAAY,CAAC,QAAQ,CAAC;IACtB,cAAc,CAAC,UAAU,CAAC;IAC1B,SAAS,CAAC,KAAK,CAAC;IAChB,UAAU,CAAC,MAAM,CAAC;IAClB,iBAAiB,CAAC,aAAa,CAAC;IAChC,gBAAgB,CAAC,YAAY,CAAC;IAC9B,UAAU,CAAC,MAAM,CAAC;IAClB,gBAAgB,CAAC,YAAY,CAAC;IAC9B,cAAc,CAAC,UAAU,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC;IACd,aAAa,CAAC,SAAS,CAAC;IACxB,eAAe,CAAC,WAAW,CAAC;IAC5B,UAAU,CAAC,MAAM,CAAC;IAClB,kBAAkB,CAAC,cAAc,CAAC;IAClC,WAAW,CAAC,OAAO,CAAC;IACpB,gBAAgB,CAAC,YAAY,CAAC;AAChC","sources":["packages/@react-stately/color/intl/zh-CN.json"],"sourcesContent":["{\n  \"alpha\": \"Alpha\",\n  \"blue\": \"蓝色\",\n  \"brightness\": \"亮度\",\n  \"green\": \"绿色\",\n  \"hue\": \"色相\",\n  \"lightness\": \"明亮度\",\n  \"red\": \"红色\",\n  \"saturation\": \"饱和度\",\n  \"colorName\": \"{lightness} {chroma} {hue}\",\n  \"transparentColorName\": \"{lightness} {chroma} {hue}, {percentTransparent} transparent\",\n  \"very dark\": \"very dark\",\n  \"dark\": \"dark\",\n  \"light\": \"light\",\n  \"very light\": \"very light\",\n  \"pale\": \"pale\",\n  \"grayish\": \"grayish\",\n  \"vibrant\": \"vibrant\",\n  \"black\": \"black\",\n  \"white\": \"white\",\n  \"gray\": \"gray\",\n  \"pink\": \"pink\",\n  \"pink red\": \"pink red\",\n  \"red orange\": \"red orange\",\n  \"brown\": \"brown\",\n  \"orange\": \"orange\",\n  \"orange yellow\": \"orange yellow\",\n  \"brown yellow\": \"brown yellow\",\n  \"yellow\": \"yellow\",\n  \"yellow green\": \"yellow green\",\n  \"green cyan\": \"green cyan\",\n  \"cyan\": \"cyan\",\n  \"cyan blue\": \"cyan blue\",\n  \"blue purple\": \"blue purple\",\n  \"purple\": \"purple\",\n  \"purple magenta\": \"purple magenta\",\n  \"magenta\": \"magenta\",\n  \"magenta pink\": \"magenta pink\"\n}\n"],"names":[],"version":3,"file":"zh-CN.module.js.map"}

package/dist/zh-TW.main.js

@@ -7,8 +7,8 @@ module.exports = {
     "lightness": `\u{660E}\u{4EAE}`,
     "red": `\u{7D05}\u{8272}`,
     "saturation": `\u{98FD}\u{548C}\u{5EA6}`,
-    "colorName": (args)=>`${args.transparency} ${args.lightness} ${args.chroma} ${args.hue}`,
-    "transparency": (args)=>`${args.percent} transparent`,
+    "colorName": (args)=>`${args.lightness} ${args.chroma} ${args.hue}`,
+    "transparentColorName": (args)=>`${args.lightness} ${args.chroma} ${args.hue}, ${args.percentTransparent} transparent`,
     "very dark": `very dark`,
     "dark": `dark`,
     "light": `light`,

package/dist/zh-TW.main.js.map

@@ -1 +1 @@
-{"mappings":"AAAA,iBAAiB;IAAG,SAAS,CAAC,KAAK,CAAC;IAClC,QAAQ,CAAC,gBAAE,CAAC;IACZ,cAAc,CAAC,gBAAE,CAAC;IAClB,SAAS,CAAC,gBAAE,CAAC;IACb,OAAO,CAAC,gBAAE,CAAC;IACX,aAAa,CAAC,gBAAE,CAAC;IACjB,OAAO,CAAC,gBAAE,CAAC;IACX,cAAc,CAAC,wBAAG,CAAC;IACnB,aAAa,CAAC,OAAS,CAAC,EAAE,KAAK,YAAY,CAAC,CAAC,EAAE,KAAK,SAAS,CAAC,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC;IAC1F,gBAAgB,CAAC,OAAS,CAAC,EAAE,KAAK,OAAO,CAAC,YAAY,CAAC;IACvD,aAAa,CAAC,SAAS,CAAC;IACxB,QAAQ,CAAC,IAAI,CAAC;IACd,SAAS,CAAC,KAAK,CAAC;IAChB,cAAc,CAAC,UAAU,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC;IACd,WAAW,CAAC,OAAO,CAAC;IACpB,WAAW,CAAC,OAAO,CAAC;IACpB,SAAS,CAAC,KAAK,CAAC;IAChB,SAAS,CAAC,KAAK,CAAC;IAChB,QAAQ,CAAC,IAAI,CAAC;IACd,QAAQ,CAAC,IAAI,CAAC;IACd,YAAY,CAAC,QAAQ,CAAC;IACtB,cAAc,CAAC,UAAU,CAAC;IAC1B,SAAS,CAAC,KAAK,CAAC;IAChB,UAAU,CAAC,MAAM,CAAC;IAClB,iBAAiB,CAAC,aAAa,CAAC;IAChC,gBAAgB,CAAC,YAAY,CAAC;IAC9B,UAAU,CAAC,MAAM,CAAC;IAClB,gBAAgB,CAAC,YAAY,CAAC;IAC9B,cAAc,CAAC,UAAU,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC;IACd,aAAa,CAAC,SAAS,CAAC;IACxB,eAAe,CAAC,WAAW,CAAC;IAC5B,UAAU,CAAC,MAAM,CAAC;IAClB,kBAAkB,CAAC,cAAc,CAAC;IAClC,WAAW,CAAC,OAAO,CAAC;IACpB,gBAAgB,CAAC,YAAY,CAAC;AAChC","sources":["packages/@react-stately/color/intl/zh-TW.json"],"sourcesContent":["{\n  \"alpha\": \"Alpha\",\n  \"blue\": \"藍色\",\n  \"brightness\": \"亮度\",\n  \"green\": \"綠色\",\n  \"hue\": \"色相\",\n  \"lightness\": \"明亮\",\n  \"red\": \"紅色\",\n  \"saturation\": \"飽和度\",\n  \"colorName\": \"{transparency} {lightness} {chroma} {hue}\",\n  \"transparency\": \"{percent} transparent\",\n  \"very dark\": \"very dark\",\n  \"dark\": \"dark\",\n  \"light\": \"light\",\n  \"very light\": \"very light\",\n  \"pale\": \"pale\",\n  \"grayish\": \"grayish\",\n  \"vibrant\": \"vibrant\",\n  \"black\": \"black\",\n  \"white\": \"white\",\n  \"gray\": \"gray\",\n  \"pink\": \"pink\",\n  \"pink red\": \"pink red\",\n  \"red orange\": \"red orange\",\n  \"brown\": \"brown\",\n  \"orange\": \"orange\",\n  \"orange yellow\": \"orange yellow\",\n  \"brown yellow\": \"brown yellow\",\n  \"yellow\": \"yellow\",\n  \"yellow green\": \"yellow green\",\n  \"green cyan\": \"green cyan\",\n  \"cyan\": \"cyan\",\n  \"cyan blue\": \"cyan blue\",\n  \"blue purple\": \"blue purple\",\n  \"purple\": \"purple\",\n  \"purple magenta\": \"purple magenta\",\n  \"magenta\": \"magenta\",\n  \"magenta pink\": \"magenta pink\"\n}\n"],"names":[],"version":3,"file":"zh-TW.main.js.map"}
+{"mappings":"AAAA,iBAAiB;IAAG,SAAS,CAAC,KAAK,CAAC;IAClC,QAAQ,CAAC,gBAAE,CAAC;IACZ,cAAc,CAAC,gBAAE,CAAC;IAClB,SAAS,CAAC,gBAAE,CAAC;IACb,OAAO,CAAC,gBAAE,CAAC;IACX,aAAa,CAAC,gBAAE,CAAC;IACjB,OAAO,CAAC,gBAAE,CAAC;IACX,cAAc,CAAC,wBAAG,CAAC;IACnB,aAAa,CAAC,OAAS,CAAC,EAAE,KAAK,SAAS,CAAC,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC;IACrE,wBAAwB,CAAC,OAAS,CAAC,EAAE,KAAK,SAAS,CAAC,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,EAAE,KAAK,kBAAkB,CAAC,YAAY,CAAC;IACxH,aAAa,CAAC,SAAS,CAAC;IACxB,QAAQ,CAAC,IAAI,CAAC;IACd,SAAS,CAAC,KAAK,CAAC;IAChB,cAAc,CAAC,UAAU,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC;IACd,WAAW,CAAC,OAAO,CAAC;IACpB,WAAW,CAAC,OAAO,CAAC;IACpB,SAAS,CAAC,KAAK,CAAC;IAChB,SAAS,CAAC,KAAK,CAAC;IAChB,QAAQ,CAAC,IAAI,CAAC;IACd,QAAQ,CAAC,IAAI,CAAC;IACd,YAAY,CAAC,QAAQ,CAAC;IACtB,cAAc,CAAC,UAAU,CAAC;IAC1B,SAAS,CAAC,KAAK,CAAC;IAChB,UAAU,CAAC,MAAM,CAAC;IAClB,iBAAiB,CAAC,aAAa,CAAC;IAChC,gBAAgB,CAAC,YAAY,CAAC;IAC9B,UAAU,CAAC,MAAM,CAAC;IAClB,gBAAgB,CAAC,YAAY,CAAC;IAC9B,cAAc,CAAC,UAAU,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC;IACd,aAAa,CAAC,SAAS,CAAC;IACxB,eAAe,CAAC,WAAW,CAAC;IAC5B,UAAU,CAAC,MAAM,CAAC;IAClB,kBAAkB,CAAC,cAAc,CAAC;IAClC,WAAW,CAAC,OAAO,CAAC;IACpB,gBAAgB,CAAC,YAAY,CAAC;AAChC","sources":["packages/@react-stately/color/intl/zh-TW.json"],"sourcesContent":["{\n  \"alpha\": \"Alpha\",\n  \"blue\": \"藍色\",\n  \"brightness\": \"亮度\",\n  \"green\": \"綠色\",\n  \"hue\": \"色相\",\n  \"lightness\": \"明亮\",\n  \"red\": \"紅色\",\n  \"saturation\": \"飽和度\",\n  \"colorName\": \"{lightness} {chroma} {hue}\",\n  \"transparentColorName\": \"{lightness} {chroma} {hue}, {percentTransparent} transparent\",\n  \"very dark\": \"very dark\",\n  \"dark\": \"dark\",\n  \"light\": \"light\",\n  \"very light\": \"very light\",\n  \"pale\": \"pale\",\n  \"grayish\": \"grayish\",\n  \"vibrant\": \"vibrant\",\n  \"black\": \"black\",\n  \"white\": \"white\",\n  \"gray\": \"gray\",\n  \"pink\": \"pink\",\n  \"pink red\": \"pink red\",\n  \"red orange\": \"red orange\",\n  \"brown\": \"brown\",\n  \"orange\": \"orange\",\n  \"orange yellow\": \"orange yellow\",\n  \"brown yellow\": \"brown yellow\",\n  \"yellow\": \"yellow\",\n  \"yellow green\": \"yellow green\",\n  \"green cyan\": \"green cyan\",\n  \"cyan\": \"cyan\",\n  \"cyan blue\": \"cyan blue\",\n  \"blue purple\": \"blue purple\",\n  \"purple\": \"purple\",\n  \"purple magenta\": \"purple magenta\",\n  \"magenta\": \"magenta\",\n  \"magenta pink\": \"magenta pink\"\n}\n"],"names":[],"version":3,"file":"zh-TW.main.js.map"}

package/dist/zh-TW.mjs

@@ -8,8 +8,8 @@ $37cff576474bc8d4$exports = {
     "lightness": `\u{660E}\u{4EAE}`,
     "red": `\u{7D05}\u{8272}`,
     "saturation": `\u{98FD}\u{548C}\u{5EA6}`,
-    "colorName": (args)=>`${args.transparency} ${args.lightness} ${args.chroma} ${args.hue}`,
-    "transparency": (args)=>`${args.percent} transparent`,
+    "colorName": (args)=>`${args.lightness} ${args.chroma} ${args.hue}`,
+    "transparentColorName": (args)=>`${args.lightness} ${args.chroma} ${args.hue}, ${args.percentTransparent} transparent`,
     "very dark": `very dark`,
     "dark": `dark`,
     "light": `light`,
@@ -41,4 +41,4 @@ $37cff576474bc8d4$exports = {
 
 
 export {$37cff576474bc8d4$exports as default};
-//# sourceMappingURL=zh-TW.module.js.map
+//# sourceMappingURL=zh-TW.mjs.map

package/dist/zh-TW.module.js

@@ -8,8 +8,8 @@ $37cff576474bc8d4$exports = {
     "lightness": `\u{660E}\u{4EAE}`,
     "red": `\u{7D05}\u{8272}`,
     "saturation": `\u{98FD}\u{548C}\u{5EA6}`,
-    "colorName": (args)=>`${args.transparency} ${args.lightness} ${args.chroma} ${args.hue}`,
-    "transparency": (args)=>`${args.percent} transparent`,
+    "colorName": (args)=>`${args.lightness} ${args.chroma} ${args.hue}`,
+    "transparentColorName": (args)=>`${args.lightness} ${args.chroma} ${args.hue}, ${args.percentTransparent} transparent`,
     "very dark": `very dark`,
     "dark": `dark`,
     "light": `light`,