@react-spectrum/color 3.1.7 → 3.2.0

package/dist/ColorThumb.mjs

@@ -1,141 +0,0 @@
-import "./color.f801bfa3.css";
-import $1UQoL$colorhandle_vars_cssmodulejs from "./colorhandle_vars_css.mjs";
-import "./color.ff589589.css";
-import $1UQoL$colorloupe_vars_cssmodulejs from "./colorloupe_vars_css.mjs";
-import {classNames as $1UQoL$classNames} from "@react-spectrum/utils";
-import {Overlay as $1UQoL$Overlay} from "@react-spectrum/overlays";
-import $1UQoL$react, {useRef as $1UQoL$useRef, useState as $1UQoL$useState} from "react";
-import {useId as $1UQoL$useId, useLayoutEffect as $1UQoL$useLayoutEffect} from "@react-aria/utils";
-import {useProvider as $1UQoL$useProvider} from "@react-spectrum/provider";
-
-
-function $parcel$interopDefault(a) {
-  return a && a.__esModule ? a.default : a;
-}
-/*
- * 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 $3a90e89d07d7bbd5$export$a3cc47cee1c1ccc(props) {
-    let { value: value, isDisabled: isDisabled, isDragging: isDragging, isFocused: isFocused, children: children, className: className = '', style: style, containerRef: containerRef, ...otherProps } = props;
-    let valueCSS = value.toString('css');
-    let loupeRef = (0, $1UQoL$useRef)(null);
-    let provider = (0, $1UQoL$useProvider)();
-    return /*#__PURE__*/ (0, $1UQoL$react).createElement("div", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorhandle_vars_cssmodulejs))), 'spectrum-ColorHandle', {
-            'is-focused': isFocused,
-            'is-disabled': isDisabled
-        }) + ' ' + className,
-        style: style,
-        ...otherProps
-    }, /*#__PURE__*/ (0, $1UQoL$react).createElement("div", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorhandle_vars_cssmodulejs))), 'spectrum-ColorHandle-color'),
-        style: {
-            backgroundColor: valueCSS
-        }
-    }), /*#__PURE__*/ (0, $1UQoL$react).createElement((0, $1UQoL$Overlay), {
-        isOpen: isDragging && provider != null,
-        nodeRef: loupeRef
-    }, /*#__PURE__*/ (0, $1UQoL$react).createElement($3a90e89d07d7bbd5$var$ColorLoupe, {
-        valueCSS: valueCSS,
-        containerRef: containerRef,
-        loupeRef: loupeRef,
-        style: style
-    })), children);
-}
-// ColorLoupe is rendered in a portal so that it breaks out of clipped/scrolling containers (e.g. popovers).
-function $3a90e89d07d7bbd5$var$ColorLoupe({ isOpen: isOpen, valueCSS: valueCSS, containerRef: containerRef, loupeRef: loupeRef, style: style }) {
-    let patternId = (0, $1UQoL$useId)();
-    // Get the bounding rectangle of the container (e.g. ColorArea/ColorSlider).
-    let [containerRect, setContainerRect] = (0, $1UQoL$useState)({
-        top: 0,
-        left: 0,
-        width: 0,
-        height: 0
-    });
-    (0, $1UQoL$useLayoutEffect)(()=>{
-        var _containerRef_current;
-        let rect = (_containerRef_current = containerRef.current) === null || _containerRef_current === void 0 ? void 0 : _containerRef_current.getBoundingClientRect();
-        setContainerRect({
-            top: (rect === null || rect === void 0 ? void 0 : rect.top) || 0,
-            left: (rect === null || rect === void 0 ? void 0 : rect.left) || 0,
-            width: (rect === null || rect === void 0 ? void 0 : rect.width) || 0,
-            height: (rect === null || rect === void 0 ? void 0 : rect.height) || 0
-        });
-    }, [
-        containerRef
-    ]);
-    // Compute the pixel position of the thumb.
-    let thumbTop = style.top || '50%';
-    if (typeof thumbTop === 'string' && thumbTop.endsWith('%')) thumbTop = parseFloat(style.top || '50%') / 100 * containerRect.height;
-    else if (typeof thumbTop === 'string' && thumbTop.endsWith('px')) thumbTop = parseFloat(thumbTop);
-    let thumbLeft = style.left || '50%';
-    if (typeof thumbLeft === 'string' && thumbLeft.endsWith('%')) thumbLeft = parseFloat(thumbLeft || '50%') / 100 * containerRect.width;
-    else if (typeof thumbLeft === 'string' && thumbLeft.endsWith('px')) thumbLeft = parseFloat(thumbLeft);
-    return /*#__PURE__*/ (0, $1UQoL$react).createElement("svg", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorloupe_vars_cssmodulejs))), 'spectrum-ColorLoupe', {
-            'is-open': isOpen
-        }),
-        style: {
-            // Position relative to the viewport.
-            position: 'fixed',
-            top: containerRect.top + thumbTop,
-            left: containerRect.left + thumbLeft
-        },
-        ref: loupeRef,
-        "aria-hidden": "true"
-    }, /*#__PURE__*/ (0, $1UQoL$react).createElement("pattern", {
-        id: patternId,
-        x: "0",
-        y: "0",
-        width: "16",
-        height: "16",
-        patternUnits: "userSpaceOnUse"
-    }, /*#__PURE__*/ (0, $1UQoL$react).createElement("rect", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorloupe_vars_cssmodulejs))), 'spectrum-ColorLoupe-inner-background'),
-        x: "0",
-        y: "0",
-        width: "16",
-        height: "16"
-    }), /*#__PURE__*/ (0, $1UQoL$react).createElement("rect", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorloupe_vars_cssmodulejs))), 'spectrum-ColorLoupe-inner-checker'),
-        x: "0",
-        y: "0",
-        width: "8",
-        height: "8"
-    }), /*#__PURE__*/ (0, $1UQoL$react).createElement("rect", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorloupe_vars_cssmodulejs))), 'spectrum-ColorLoupe-inner-checker'),
-        x: "8",
-        y: "8",
-        width: "8",
-        height: "8"
-    })), /*#__PURE__*/ (0, $1UQoL$react).createElement("path", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorloupe_vars_cssmodulejs))), 'spectrum-ColorLoupe-inner'),
-        d: "M25 1a24 24 0 0124 24c0 16.255-24 40-24 40S1 41.255 1 25A24 24 0 0125 1z",
-        fill: `url(#${patternId})`
-    }), /*#__PURE__*/ (0, $1UQoL$react).createElement("path", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorloupe_vars_cssmodulejs))), 'spectrum-ColorLoupe-inner'),
-        d: "M25 1a24 24 0 0124 24c0 16.255-24 40-24 40S1 41.255 1 25A24 24 0 0125 1z",
-        fill: valueCSS
-    }), /*#__PURE__*/ (0, $1UQoL$react).createElement("path", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorloupe_vars_cssmodulejs))), 'spectrum-ColorLoupe-outer'),
-        d: "M25 3A21.98 21.98 0 003 25c0 6.2 4 14.794 11.568 24.853A144.233 144.233 0 0025 62.132a144.085 144.085 0 0010.4-12.239C42.99 39.816 47 31.209 47 25A21.98 21.98 0 0025 3m0-2a24 24 0 0124 24c0 16.255-24 40-24 40S1 41.255 1 25A24 24 0 0125 1z"
-    }));
-}
-
-
-export {$3a90e89d07d7bbd5$export$a3cc47cee1c1ccc as ColorThumb};
-//# sourceMappingURL=ColorThumb.module.js.map

package/dist/ColorThumb.module.js

@@ -1,141 +0,0 @@
-import "./color.f801bfa3.css";
-import $1UQoL$colorhandle_vars_cssmodulejs from "./colorhandle_vars_css.module.js";
-import "./color.ff589589.css";
-import $1UQoL$colorloupe_vars_cssmodulejs from "./colorloupe_vars_css.module.js";
-import {classNames as $1UQoL$classNames} from "@react-spectrum/utils";
-import {Overlay as $1UQoL$Overlay} from "@react-spectrum/overlays";
-import $1UQoL$react, {useRef as $1UQoL$useRef, useState as $1UQoL$useState} from "react";
-import {useId as $1UQoL$useId, useLayoutEffect as $1UQoL$useLayoutEffect} from "@react-aria/utils";
-import {useProvider as $1UQoL$useProvider} from "@react-spectrum/provider";
-
-
-function $parcel$interopDefault(a) {
-  return a && a.__esModule ? a.default : a;
-}
-/*
- * 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 $3a90e89d07d7bbd5$export$a3cc47cee1c1ccc(props) {
-    let { value: value, isDisabled: isDisabled, isDragging: isDragging, isFocused: isFocused, children: children, className: className = '', style: style, containerRef: containerRef, ...otherProps } = props;
-    let valueCSS = value.toString('css');
-    let loupeRef = (0, $1UQoL$useRef)(null);
-    let provider = (0, $1UQoL$useProvider)();
-    return /*#__PURE__*/ (0, $1UQoL$react).createElement("div", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorhandle_vars_cssmodulejs))), 'spectrum-ColorHandle', {
-            'is-focused': isFocused,
-            'is-disabled': isDisabled
-        }) + ' ' + className,
-        style: style,
-        ...otherProps
-    }, /*#__PURE__*/ (0, $1UQoL$react).createElement("div", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorhandle_vars_cssmodulejs))), 'spectrum-ColorHandle-color'),
-        style: {
-            backgroundColor: valueCSS
-        }
-    }), /*#__PURE__*/ (0, $1UQoL$react).createElement((0, $1UQoL$Overlay), {
-        isOpen: isDragging && provider != null,
-        nodeRef: loupeRef
-    }, /*#__PURE__*/ (0, $1UQoL$react).createElement($3a90e89d07d7bbd5$var$ColorLoupe, {
-        valueCSS: valueCSS,
-        containerRef: containerRef,
-        loupeRef: loupeRef,
-        style: style
-    })), children);
-}
-// ColorLoupe is rendered in a portal so that it breaks out of clipped/scrolling containers (e.g. popovers).
-function $3a90e89d07d7bbd5$var$ColorLoupe({ isOpen: isOpen, valueCSS: valueCSS, containerRef: containerRef, loupeRef: loupeRef, style: style }) {
-    let patternId = (0, $1UQoL$useId)();
-    // Get the bounding rectangle of the container (e.g. ColorArea/ColorSlider).
-    let [containerRect, setContainerRect] = (0, $1UQoL$useState)({
-        top: 0,
-        left: 0,
-        width: 0,
-        height: 0
-    });
-    (0, $1UQoL$useLayoutEffect)(()=>{
-        var _containerRef_current;
-        let rect = (_containerRef_current = containerRef.current) === null || _containerRef_current === void 0 ? void 0 : _containerRef_current.getBoundingClientRect();
-        setContainerRect({
-            top: (rect === null || rect === void 0 ? void 0 : rect.top) || 0,
-            left: (rect === null || rect === void 0 ? void 0 : rect.left) || 0,
-            width: (rect === null || rect === void 0 ? void 0 : rect.width) || 0,
-            height: (rect === null || rect === void 0 ? void 0 : rect.height) || 0
-        });
-    }, [
-        containerRef
-    ]);
-    // Compute the pixel position of the thumb.
-    let thumbTop = style.top || '50%';
-    if (typeof thumbTop === 'string' && thumbTop.endsWith('%')) thumbTop = parseFloat(style.top || '50%') / 100 * containerRect.height;
-    else if (typeof thumbTop === 'string' && thumbTop.endsWith('px')) thumbTop = parseFloat(thumbTop);
-    let thumbLeft = style.left || '50%';
-    if (typeof thumbLeft === 'string' && thumbLeft.endsWith('%')) thumbLeft = parseFloat(thumbLeft || '50%') / 100 * containerRect.width;
-    else if (typeof thumbLeft === 'string' && thumbLeft.endsWith('px')) thumbLeft = parseFloat(thumbLeft);
-    return /*#__PURE__*/ (0, $1UQoL$react).createElement("svg", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorloupe_vars_cssmodulejs))), 'spectrum-ColorLoupe', {
-            'is-open': isOpen
-        }),
-        style: {
-            // Position relative to the viewport.
-            position: 'fixed',
-            top: containerRect.top + thumbTop,
-            left: containerRect.left + thumbLeft
-        },
-        ref: loupeRef,
-        "aria-hidden": "true"
-    }, /*#__PURE__*/ (0, $1UQoL$react).createElement("pattern", {
-        id: patternId,
-        x: "0",
-        y: "0",
-        width: "16",
-        height: "16",
-        patternUnits: "userSpaceOnUse"
-    }, /*#__PURE__*/ (0, $1UQoL$react).createElement("rect", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorloupe_vars_cssmodulejs))), 'spectrum-ColorLoupe-inner-background'),
-        x: "0",
-        y: "0",
-        width: "16",
-        height: "16"
-    }), /*#__PURE__*/ (0, $1UQoL$react).createElement("rect", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorloupe_vars_cssmodulejs))), 'spectrum-ColorLoupe-inner-checker'),
-        x: "0",
-        y: "0",
-        width: "8",
-        height: "8"
-    }), /*#__PURE__*/ (0, $1UQoL$react).createElement("rect", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorloupe_vars_cssmodulejs))), 'spectrum-ColorLoupe-inner-checker'),
-        x: "8",
-        y: "8",
-        width: "8",
-        height: "8"
-    })), /*#__PURE__*/ (0, $1UQoL$react).createElement("path", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorloupe_vars_cssmodulejs))), 'spectrum-ColorLoupe-inner'),
-        d: "M25 1a24 24 0 0124 24c0 16.255-24 40-24 40S1 41.255 1 25A24 24 0 0125 1z",
-        fill: `url(#${patternId})`
-    }), /*#__PURE__*/ (0, $1UQoL$react).createElement("path", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorloupe_vars_cssmodulejs))), 'spectrum-ColorLoupe-inner'),
-        d: "M25 1a24 24 0 0124 24c0 16.255-24 40-24 40S1 41.255 1 25A24 24 0 0125 1z",
-        fill: valueCSS
-    }), /*#__PURE__*/ (0, $1UQoL$react).createElement("path", {
-        className: (0, $1UQoL$classNames)((0, ($parcel$interopDefault($1UQoL$colorloupe_vars_cssmodulejs))), 'spectrum-ColorLoupe-outer'),
-        d: "M25 3A21.98 21.98 0 003 25c0 6.2 4 14.794 11.568 24.853A144.233 144.233 0 0025 62.132a144.085 144.085 0 0010.4-12.239C42.99 39.816 47 31.209 47 25A21.98 21.98 0 0025 3m0-2a24 24 0 0124 24c0 16.255-24 40-24 40S1 41.255 1 25A24 24 0 0125 1z"
-    }));
-}
-
-
-export {$3a90e89d07d7bbd5$export$a3cc47cee1c1ccc as ColorThumb};
-//# sourceMappingURL=ColorThumb.module.js.map

package/dist/ColorThumb.module.js.map

@@ -1 +0,0 @@
-{"mappings":"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","sources":["packages/@react-spectrum/color/src/ColorThumb.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {classNames} from '@react-spectrum/utils';\nimport {Color} from '@react-types/color';\nimport {DOMProps, RefObject} from '@react-types/shared';\nimport {Overlay} from '@react-spectrum/overlays';\nimport React, {CSSProperties, JSX, ReactElement, useRef, useState} from 'react';\nimport stylesHandle from '@adobe/spectrum-css-temp/components/colorhandle/vars.css';\nimport stylesLoupe from '@adobe/spectrum-css-temp/components/colorloupe/vars.css';\nimport {useId, useLayoutEffect} from '@react-aria/utils';\nimport {useProvider} from '@react-spectrum/provider';\n\ninterface ColorThumbProps extends DOMProps {\n  value: Color,\n  isDisabled?: boolean,\n  isDragging?: boolean, // shows the color loupe\n  isFocused?: boolean, // makes the circle larger\n  className?: string,\n  children?: ReactElement,\n  style?: CSSProperties,\n  containerRef?: RefObject<HTMLElement | null>\n}\n\nfunction ColorThumb(props: ColorThumbProps): JSX.Element {\n  let {value, isDisabled, isDragging, isFocused, children, className = '', style, containerRef, ...otherProps} = props;\n\n  let valueCSS = value.toString('css');\n  let loupeRef = useRef<HTMLElement | null>(null);\n  let provider = useProvider();\n\n  return (\n    <div className={classNames(stylesHandle, 'spectrum-ColorHandle', {'is-focused': isFocused, 'is-disabled': isDisabled}) + ' ' + className} style={style} {...otherProps}>\n      <div className={classNames(stylesHandle, 'spectrum-ColorHandle-color')} style={{backgroundColor: valueCSS}} />\n      <Overlay isOpen={isDragging && provider != null} nodeRef={loupeRef}>\n        <ColorLoupe valueCSS={valueCSS} containerRef={containerRef} loupeRef={loupeRef} style={style} />\n      </Overlay>\n      {children}\n    </div>\n  );\n}\n\n// ColorLoupe is rendered in a portal so that it breaks out of clipped/scrolling containers (e.g. popovers).\nfunction ColorLoupe({isOpen, valueCSS, containerRef, loupeRef, style}: any) {\n  let patternId = useId();\n\n  // Get the bounding rectangle of the container (e.g. ColorArea/ColorSlider).\n  let [containerRect, setContainerRect] = useState({top: 0, left: 0, width: 0, height: 0});\n  useLayoutEffect(() => {\n    let rect = containerRef.current?.getBoundingClientRect();\n    setContainerRect({\n      top: rect?.top || 0,\n      left: rect?.left || 0,\n      width: rect?.width || 0,\n      height: rect?.height || 0\n    });\n  }, [containerRef]);\n\n  // Compute the pixel position of the thumb.\n  let thumbTop = style.top || '50%';\n  if (typeof thumbTop === 'string' && thumbTop.endsWith('%')) {\n    thumbTop = parseFloat(style.top || '50%') / 100 * containerRect.height;\n  } else if (typeof thumbTop === 'string' && thumbTop.endsWith('px')) {\n    thumbTop = parseFloat(thumbTop);\n  }\n\n  let thumbLeft = style.left || '50%';\n  if (typeof thumbLeft === 'string' && thumbLeft.endsWith('%')) {\n    thumbLeft = parseFloat(thumbLeft || '50%') / 100 * containerRect.width;\n  } else if (typeof thumbLeft === 'string' && thumbLeft.endsWith('px')) {\n    thumbLeft = parseFloat(thumbLeft);\n  }\n\n  return (\n    <svg\n      className={classNames(stylesLoupe, 'spectrum-ColorLoupe',  {'is-open': isOpen})}\n      style={{\n        // Position relative to the viewport.\n        position: 'fixed',\n        top: containerRect.top + thumbTop,\n        left: containerRect.left + thumbLeft\n      }}\n      ref={loupeRef}\n      aria-hidden=\"true\">\n      <pattern id={patternId} x=\"0\" y=\"0\" width=\"16\" height=\"16\" patternUnits=\"userSpaceOnUse\">\n        <rect className={classNames(stylesLoupe, 'spectrum-ColorLoupe-inner-background')} x=\"0\" y=\"0\" width=\"16\" height=\"16\" />\n        <rect className={classNames(stylesLoupe, 'spectrum-ColorLoupe-inner-checker')} x=\"0\" y=\"0\" width=\"8\" height=\"8\" />\n        <rect className={classNames(stylesLoupe, 'spectrum-ColorLoupe-inner-checker')} x=\"8\" y=\"8\" width=\"8\" height=\"8\" />\n      </pattern>\n      <path\n        className={classNames(stylesLoupe, 'spectrum-ColorLoupe-inner')}\n        d=\"M25 1a24 24 0 0124 24c0 16.255-24 40-24 40S1 41.255 1 25A24 24 0 0125 1z\"\n        fill={`url(#${patternId})`} />\n      <path\n        className={classNames(stylesLoupe, 'spectrum-ColorLoupe-inner')}\n        d=\"M25 1a24 24 0 0124 24c0 16.255-24 40-24 40S1 41.255 1 25A24 24 0 0125 1z\"\n        fill={valueCSS} />\n      <path\n        className={classNames(stylesLoupe, 'spectrum-ColorLoupe-outer')}\n        d=\"M25 3A21.98 21.98 0 003 25c0 6.2 4 14.794 11.568 24.853A144.233 144.233 0 0025 62.132a144.085 144.085 0 0010.4-12.239C42.99 39.816 47 31.209 47 25A21.98 21.98 0 0025 3m0-2a24 24 0 0124 24c0 16.255-24 40-24 40S1 41.255 1 25A24 24 0 0125 1z\" />\n    </svg>\n  );\n}\n\nexport {ColorThumb};\n"],"names":[],"version":3,"file":"ColorThumb.module.js.map"}

package/dist/ColorWheel.main.js

@@ -1,114 +0,0 @@
-var $2b9adc23f6c7cae1$exports = require("./ColorThumb.main.js");
-require("./color.0da417e8.css");
-var $8fc6b1a2f4e7f682$exports = require("./colorwheel_vars_css.main.js");
-var $gEgjt$reactspectrumutils = require("@react-spectrum/utils");
-var $gEgjt$reactariacomponents = require("react-aria-components");
-var $gEgjt$react = require("react");
-var $gEgjt$reactariacolor = require("@react-aria/color");
-var $gEgjt$reactstatelycolor = require("@react-stately/color");
-var $gEgjt$reactariafocus = require("@react-aria/focus");
-var $gEgjt$reactariautils = require("@react-aria/utils");
-var $gEgjt$reactspectrumprovider = require("@react-spectrum/provider");
-
-
-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});
-}
-
-$parcel$export(module.exports, "ColorWheel", () => $63a2864687444ae1$export$f80663f808113381);
-/*
- * 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 $63a2864687444ae1$var$WHEEL_THICKNESS = 24;
-const $63a2864687444ae1$export$f80663f808113381 = /*#__PURE__*/ (0, ($parcel$interopDefault($gEgjt$react))).forwardRef(function ColorWheel(props, ref) {
-    props = (0, $gEgjt$reactspectrumprovider.useProviderProps)(props);
-    let inputRef = (0, $gEgjt$react.useRef)(null);
-    let containerRef = (0, $gEgjt$reactspectrumutils.useFocusableRef)(ref, inputRef);
-    [props, containerRef] = (0, $gEgjt$reactariacomponents.useContextProps)(props, containerRef, (0, $gEgjt$reactariacomponents.ColorWheelContext));
-    let { isDisabled: isDisabled } = props;
-    let size = props.size && (0, $gEgjt$reactspectrumutils.dimensionValue)(props.size);
-    let { styleProps: styleProps } = (0, $gEgjt$reactspectrumutils.useStyleProps)(props);
-    let [wheelRadius, setWheelRadius] = (0, $gEgjt$react.useState)(0);
-    let [wheelThickness, setWheelThickness] = (0, $gEgjt$react.useState)($63a2864687444ae1$var$WHEEL_THICKNESS);
-    let resizeHandler = (0, $gEgjt$react.useCallback)(()=>{
-        if (containerRef.current) {
-            setWheelRadius(containerRef.current.offsetWidth / 2);
-            let thickness = window.getComputedStyle(containerRef.current).getPropertyValue('--spectrum-colorwheel-track-thickness');
-            if (thickness) setWheelThickness(parseInt(thickness, 10));
-        }
-    }, [
-        containerRef,
-        setWheelRadius,
-        setWheelThickness
-    ]);
-    (0, $gEgjt$reactariautils.useLayoutEffect)(()=>{
-        // the size observer's fallback to the window resize event doesn't fire on mount
-        if (wheelRadius === 0) resizeHandler();
-    }, [
-        wheelRadius,
-        resizeHandler
-    ]);
-    (0, $gEgjt$reactariautils.useResizeObserver)({
-        ref: containerRef,
-        onResize: resizeHandler
-    });
-    let state = (0, $gEgjt$reactstatelycolor.useColorWheelState)(props);
-    let { trackProps: trackProps, inputProps: inputProps, thumbProps: thumbProps } = (0, $gEgjt$reactariacolor.useColorWheel)({
-        ...props,
-        innerRadius: wheelRadius - wheelThickness,
-        outerRadius: wheelRadius
-    }, state, inputRef);
-    let { focusProps: focusProps, isFocusVisible: isFocusVisible } = (0, $gEgjt$reactariafocus.useFocusRing)();
-    return /*#__PURE__*/ (0, ($parcel$interopDefault($gEgjt$react))).createElement("div", {
-        className: (0, $gEgjt$reactspectrumutils.classNames)((0, ($parcel$interopDefault($8fc6b1a2f4e7f682$exports))), 'spectrum-ColorWheel', {
-            'is-disabled': isDisabled
-        }, styleProps.className),
-        ref: containerRef,
-        style: {
-            ...styleProps.style,
-            // Workaround around https://github.com/adobe/spectrum-css/issues/1032
-            'width': size,
-            'height': size
-        }
-    }, /*#__PURE__*/ (0, ($parcel$interopDefault($gEgjt$react))).createElement("div", {
-        ...trackProps,
-        className: (0, $gEgjt$reactspectrumutils.classNames)((0, ($parcel$interopDefault($8fc6b1a2f4e7f682$exports))), 'spectrum-ColorWheel-gradient')
-    }), /*#__PURE__*/ (0, ($parcel$interopDefault($gEgjt$react))).createElement((0, $2b9adc23f6c7cae1$exports.ColorThumb), {
-        value: state.getDisplayColor(),
-        isFocused: isFocusVisible,
-        isDisabled: isDisabled,
-        isDragging: state.isDragging,
-        containerRef: containerRef,
-        className: (0, $gEgjt$reactspectrumutils.classNames)((0, ($parcel$interopDefault($8fc6b1a2f4e7f682$exports))), 'spectrum-ColorWheel-handle'),
-        ...thumbProps
-    }, /*#__PURE__*/ (0, ($parcel$interopDefault($gEgjt$react))).createElement("input", {
-        ...focusProps,
-        className: (0, $gEgjt$reactspectrumutils.classNames)((0, ($parcel$interopDefault($8fc6b1a2f4e7f682$exports))), 'spectrum-ColorWheel-slider'),
-        ...inputProps,
-        ref: inputRef
-    })));
-});
-
-
-//# sourceMappingURL=ColorWheel.main.js.map

package/dist/ColorWheel.main.js.map

@@ -1 +0,0 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;AAeD,MAAM,wCAAkB;AAKjB,MAAM,0DAAa,CAAA,GAAA,sCAAI,EAAE,UAAU,CAAC,SAAS,WAAW,KAA8B,EAAE,GAAiC;IAC9H,QAAQ,CAAA,GAAA,6CAAe,EAAE;IACzB,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAE;IACtB,IAAI,eAAe,CAAA,GAAA,yCAAc,EAAE,KAAK;IACxC,CAAC,OAAO,aAAa,GAAG,CAAA,GAAA,0CAAc,EAAE,OAAO,cAAc,CAAA,GAAA,4CAAgB;IAE7E,IAAI,cAAC,UAAU,EAAC,GAAG;IACnB,IAAI,OAAO,MAAM,IAAI,IAAI,CAAA,GAAA,wCAAa,EAAE,MAAM,IAAI;IAClD,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,uCAAY,EAAE;IAGjC,IAAI,CAAC,aAAa,eAAe,GAAG,CAAA,GAAA,qBAAO,EAAU;IACrD,IAAI,CAAC,gBAAgB,kBAAkB,GAAG,CAAA,GAAA,qBAAO,EAAE;IAEnD,IAAI,gBAAgB,CAAA,GAAA,wBAAU,EAAE;QAC9B,IAAI,aAAa,OAAO,EAAE;YACxB,eAAe,aAAa,OAAO,CAAC,WAAW,GAAG;YAClD,IAAI,YAAY,OAAO,gBAAgB,CAAC,aAAa,OAAO,EACzD,gBAAgB,CAAC;YACpB,IAAI,WACF,kBAAkB,SAAS,WAAW;QAE1C;IACF,GAAG;QAAC;QAAc;QAAgB;KAAkB;IAEpD,CAAA,GAAA,qCAAc,EAAE;QACd,gFAAgF;QAChF,IAAI,gBAAgB,GAClB;IAEJ,GAAG;QAAC;QAAa;KAAc;IAE/B,CAAA,GAAA,uCAAgB,EAAE;QAChB,KAAK;QACL,UAAU;IACZ;IAEA,IAAI,QAAQ,CAAA,GAAA,2CAAiB,EAAE;IAE/B,IAAI,cAAC,UAAU,cAAE,UAAU,cAAE,UAAU,EAAC,GAAG,CAAA,GAAA,mCAAY,EAAE;QACvD,GAAG,KAAK;QACR,aAAa,cAAc;QAC3B,aAAa;IACf,GAAG,OAAO;IAEV,IAAI,cAAC,UAAU,kBAAE,cAAc,EAAC,GAAG,CAAA,GAAA,kCAAW;IAE9C,qBACE,0DAAC;QACC,WACE,CAAA,GAAA,oCAAS,EACP,CAAA,GAAA,mDAAK,GACL,uBACA;YACE,eAAe;QACjB,GACA,WAAW,SAAS;QAGxB,KAAK;QACL,OAAO;YACL,GAAG,WAAW,KAAK;YACnB,sEAAsE;YACtE,SAAS;YACT,UAAU;QACZ;qBACA,0DAAC;QAAK,GAAG,UAAU;QAAE,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;sBACnD,0DAAC,CAAA,GAAA,oCAAS;QACR,OAAO,MAAM,eAAe;QAC5B,WAAW;QACX,YAAY;QACZ,YAAY,MAAM,UAAU;QAC5B,cAAc;QACd,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;QAC7B,GAAG,UAAU;qBACd,0DAAC;QAAO,GAAG,UAAU;QAAE,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;QAAgC,GAAG,UAAU;QAAE,KAAK;;AAIjH","sources":["packages/@react-spectrum/color/src/ColorWheel.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {classNames, dimensionValue, useFocusableRef, useStyleProps} from '@react-spectrum/utils';\nimport {ColorThumb} from './ColorThumb';\nimport {ColorWheelContext, useContextProps} from 'react-aria-components';\nimport {FocusableRef} from '@react-types/shared';\nimport React, {useCallback, useRef, useState} from 'react';\nimport {SpectrumColorWheelProps} from '@react-types/color';\nimport styles from '@adobe/spectrum-css-temp/components/colorwheel/vars.css';\nimport {useColorWheel} from '@react-aria/color';\nimport {useColorWheelState} from '@react-stately/color';\nimport {useFocusRing} from '@react-aria/focus';\nimport {useLayoutEffect, useResizeObserver} from '@react-aria/utils';\nimport {useProviderProps} from '@react-spectrum/provider';\n\nconst WHEEL_THICKNESS = 24;\n\n/**\n * ColorWheels allow users to adjust the hue of an HSL or HSB color value on a circular track.\n */\nexport const ColorWheel = React.forwardRef(function ColorWheel(props: SpectrumColorWheelProps, ref: FocusableRef<HTMLDivElement>) {\n  props = useProviderProps(props);\n  let inputRef = useRef(null);\n  let containerRef = useFocusableRef(ref, inputRef);\n  [props, containerRef] = useContextProps(props, containerRef, ColorWheelContext);\n\n  let {isDisabled} = props;\n  let size = props.size && dimensionValue(props.size);\n  let {styleProps} = useStyleProps(props);\n\n\n  let [wheelRadius, setWheelRadius] = useState<number>(0);\n  let [wheelThickness, setWheelThickness] = useState(WHEEL_THICKNESS);\n\n  let resizeHandler = useCallback(() => {\n    if (containerRef.current) {\n      setWheelRadius(containerRef.current.offsetWidth / 2);\n      let thickness = window.getComputedStyle(containerRef.current)\n        .getPropertyValue('--spectrum-colorwheel-track-thickness');\n      if (thickness) {\n        setWheelThickness(parseInt(thickness, 10));\n      }\n    }\n  }, [containerRef, setWheelRadius, setWheelThickness]);\n\n  useLayoutEffect(() => {\n    // the size observer's fallback to the window resize event doesn't fire on mount\n    if (wheelRadius === 0) {\n      resizeHandler();\n    }\n  }, [wheelRadius, resizeHandler]);\n\n  useResizeObserver({\n    ref: containerRef,\n    onResize: resizeHandler\n  });\n\n  let state = useColorWheelState(props);\n\n  let {trackProps, inputProps, thumbProps} = useColorWheel({\n    ...props,\n    innerRadius: wheelRadius - wheelThickness,\n    outerRadius: wheelRadius\n  }, state, inputRef);\n\n  let {focusProps, isFocusVisible} = useFocusRing();\n\n  return (\n    <div\n      className={\n        classNames(\n          styles,\n          'spectrum-ColorWheel',\n          {\n            'is-disabled': isDisabled\n          },\n          styleProps.className\n        )\n      }\n      ref={containerRef}\n      style={{\n        ...styleProps.style,\n        // Workaround around https://github.com/adobe/spectrum-css/issues/1032\n        'width': size,\n        'height': size\n      }}>\n      <div {...trackProps} className={classNames(styles, 'spectrum-ColorWheel-gradient')} />\n      <ColorThumb\n        value={state.getDisplayColor()}\n        isFocused={isFocusVisible}\n        isDisabled={isDisabled}\n        isDragging={state.isDragging}\n        containerRef={containerRef}\n        className={classNames(styles, 'spectrum-ColorWheel-handle')}\n        {...thumbProps}>\n        <input {...focusProps} className={classNames(styles, 'spectrum-ColorWheel-slider')} {...inputProps} ref={inputRef} />\n      </ColorThumb>\n    </div>\n  );\n});\n"],"names":[],"version":3,"file":"ColorWheel.main.js.map"}

package/dist/ColorWheel.mjs

@@ -1,109 +0,0 @@
-import {ColorThumb as $3a90e89d07d7bbd5$export$a3cc47cee1c1ccc} from "./ColorThumb.mjs";
-import "./color.0da417e8.css";
-import $bv4AR$colorwheel_vars_cssmodulejs from "./colorwheel_vars_css.mjs";
-import {useFocusableRef as $bv4AR$useFocusableRef, dimensionValue as $bv4AR$dimensionValue, useStyleProps as $bv4AR$useStyleProps, classNames as $bv4AR$classNames} from "@react-spectrum/utils";
-import {useContextProps as $bv4AR$useContextProps, ColorWheelContext as $bv4AR$ColorWheelContext} from "react-aria-components";
-import $bv4AR$react, {useRef as $bv4AR$useRef, useState as $bv4AR$useState, useCallback as $bv4AR$useCallback} from "react";
-import {useColorWheel as $bv4AR$useColorWheel} from "@react-aria/color";
-import {useColorWheelState as $bv4AR$useColorWheelState} from "@react-stately/color";
-import {useFocusRing as $bv4AR$useFocusRing} from "@react-aria/focus";
-import {useLayoutEffect as $bv4AR$useLayoutEffect, useResizeObserver as $bv4AR$useResizeObserver} from "@react-aria/utils";
-import {useProviderProps as $bv4AR$useProviderProps} from "@react-spectrum/provider";
-
-
-function $parcel$interopDefault(a) {
-  return a && a.__esModule ? a.default : a;
-}
-/*
- * 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 $3aac1c27203f04b5$var$WHEEL_THICKNESS = 24;
-const $3aac1c27203f04b5$export$f80663f808113381 = /*#__PURE__*/ (0, $bv4AR$react).forwardRef(function ColorWheel(props, ref) {
-    props = (0, $bv4AR$useProviderProps)(props);
-    let inputRef = (0, $bv4AR$useRef)(null);
-    let containerRef = (0, $bv4AR$useFocusableRef)(ref, inputRef);
-    [props, containerRef] = (0, $bv4AR$useContextProps)(props, containerRef, (0, $bv4AR$ColorWheelContext));
-    let { isDisabled: isDisabled } = props;
-    let size = props.size && (0, $bv4AR$dimensionValue)(props.size);
-    let { styleProps: styleProps } = (0, $bv4AR$useStyleProps)(props);
-    let [wheelRadius, setWheelRadius] = (0, $bv4AR$useState)(0);
-    let [wheelThickness, setWheelThickness] = (0, $bv4AR$useState)($3aac1c27203f04b5$var$WHEEL_THICKNESS);
-    let resizeHandler = (0, $bv4AR$useCallback)(()=>{
-        if (containerRef.current) {
-            setWheelRadius(containerRef.current.offsetWidth / 2);
-            let thickness = window.getComputedStyle(containerRef.current).getPropertyValue('--spectrum-colorwheel-track-thickness');
-            if (thickness) setWheelThickness(parseInt(thickness, 10));
-        }
-    }, [
-        containerRef,
-        setWheelRadius,
-        setWheelThickness
-    ]);
-    (0, $bv4AR$useLayoutEffect)(()=>{
-        // the size observer's fallback to the window resize event doesn't fire on mount
-        if (wheelRadius === 0) resizeHandler();
-    }, [
-        wheelRadius,
-        resizeHandler
-    ]);
-    (0, $bv4AR$useResizeObserver)({
-        ref: containerRef,
-        onResize: resizeHandler
-    });
-    let state = (0, $bv4AR$useColorWheelState)(props);
-    let { trackProps: trackProps, inputProps: inputProps, thumbProps: thumbProps } = (0, $bv4AR$useColorWheel)({
-        ...props,
-        innerRadius: wheelRadius - wheelThickness,
-        outerRadius: wheelRadius
-    }, state, inputRef);
-    let { focusProps: focusProps, isFocusVisible: isFocusVisible } = (0, $bv4AR$useFocusRing)();
-    return /*#__PURE__*/ (0, $bv4AR$react).createElement("div", {
-        className: (0, $bv4AR$classNames)((0, ($parcel$interopDefault($bv4AR$colorwheel_vars_cssmodulejs))), 'spectrum-ColorWheel', {
-            'is-disabled': isDisabled
-        }, styleProps.className),
-        ref: containerRef,
-        style: {
-            ...styleProps.style,
-            // Workaround around https://github.com/adobe/spectrum-css/issues/1032
-            'width': size,
-            'height': size
-        }
-    }, /*#__PURE__*/ (0, $bv4AR$react).createElement("div", {
-        ...trackProps,
-        className: (0, $bv4AR$classNames)((0, ($parcel$interopDefault($bv4AR$colorwheel_vars_cssmodulejs))), 'spectrum-ColorWheel-gradient')
-    }), /*#__PURE__*/ (0, $bv4AR$react).createElement((0, $3a90e89d07d7bbd5$export$a3cc47cee1c1ccc), {
-        value: state.getDisplayColor(),
-        isFocused: isFocusVisible,
-        isDisabled: isDisabled,
-        isDragging: state.isDragging,
-        containerRef: containerRef,
-        className: (0, $bv4AR$classNames)((0, ($parcel$interopDefault($bv4AR$colorwheel_vars_cssmodulejs))), 'spectrum-ColorWheel-handle'),
-        ...thumbProps
-    }, /*#__PURE__*/ (0, $bv4AR$react).createElement("input", {
-        ...focusProps,
-        className: (0, $bv4AR$classNames)((0, ($parcel$interopDefault($bv4AR$colorwheel_vars_cssmodulejs))), 'spectrum-ColorWheel-slider'),
-        ...inputProps,
-        ref: inputRef
-    })));
-});
-
-
-export {$3aac1c27203f04b5$export$f80663f808113381 as ColorWheel};
-//# sourceMappingURL=ColorWheel.module.js.map

package/dist/ColorWheel.module.js

@@ -1,109 +0,0 @@
-import {ColorThumb as $3a90e89d07d7bbd5$export$a3cc47cee1c1ccc} from "./ColorThumb.module.js";
-import "./color.0da417e8.css";
-import $bv4AR$colorwheel_vars_cssmodulejs from "./colorwheel_vars_css.module.js";
-import {useFocusableRef as $bv4AR$useFocusableRef, dimensionValue as $bv4AR$dimensionValue, useStyleProps as $bv4AR$useStyleProps, classNames as $bv4AR$classNames} from "@react-spectrum/utils";
-import {useContextProps as $bv4AR$useContextProps, ColorWheelContext as $bv4AR$ColorWheelContext} from "react-aria-components";
-import $bv4AR$react, {useRef as $bv4AR$useRef, useState as $bv4AR$useState, useCallback as $bv4AR$useCallback} from "react";
-import {useColorWheel as $bv4AR$useColorWheel} from "@react-aria/color";
-import {useColorWheelState as $bv4AR$useColorWheelState} from "@react-stately/color";
-import {useFocusRing as $bv4AR$useFocusRing} from "@react-aria/focus";
-import {useLayoutEffect as $bv4AR$useLayoutEffect, useResizeObserver as $bv4AR$useResizeObserver} from "@react-aria/utils";
-import {useProviderProps as $bv4AR$useProviderProps} from "@react-spectrum/provider";
-
-
-function $parcel$interopDefault(a) {
-  return a && a.__esModule ? a.default : a;
-}
-/*
- * 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 $3aac1c27203f04b5$var$WHEEL_THICKNESS = 24;
-const $3aac1c27203f04b5$export$f80663f808113381 = /*#__PURE__*/ (0, $bv4AR$react).forwardRef(function ColorWheel(props, ref) {
-    props = (0, $bv4AR$useProviderProps)(props);
-    let inputRef = (0, $bv4AR$useRef)(null);
-    let containerRef = (0, $bv4AR$useFocusableRef)(ref, inputRef);
-    [props, containerRef] = (0, $bv4AR$useContextProps)(props, containerRef, (0, $bv4AR$ColorWheelContext));
-    let { isDisabled: isDisabled } = props;
-    let size = props.size && (0, $bv4AR$dimensionValue)(props.size);
-    let { styleProps: styleProps } = (0, $bv4AR$useStyleProps)(props);
-    let [wheelRadius, setWheelRadius] = (0, $bv4AR$useState)(0);
-    let [wheelThickness, setWheelThickness] = (0, $bv4AR$useState)($3aac1c27203f04b5$var$WHEEL_THICKNESS);
-    let resizeHandler = (0, $bv4AR$useCallback)(()=>{
-        if (containerRef.current) {
-            setWheelRadius(containerRef.current.offsetWidth / 2);
-            let thickness = window.getComputedStyle(containerRef.current).getPropertyValue('--spectrum-colorwheel-track-thickness');
-            if (thickness) setWheelThickness(parseInt(thickness, 10));
-        }
-    }, [
-        containerRef,
-        setWheelRadius,
-        setWheelThickness
-    ]);
-    (0, $bv4AR$useLayoutEffect)(()=>{
-        // the size observer's fallback to the window resize event doesn't fire on mount
-        if (wheelRadius === 0) resizeHandler();
-    }, [
-        wheelRadius,
-        resizeHandler
-    ]);
-    (0, $bv4AR$useResizeObserver)({
-        ref: containerRef,
-        onResize: resizeHandler
-    });
-    let state = (0, $bv4AR$useColorWheelState)(props);
-    let { trackProps: trackProps, inputProps: inputProps, thumbProps: thumbProps } = (0, $bv4AR$useColorWheel)({
-        ...props,
-        innerRadius: wheelRadius - wheelThickness,
-        outerRadius: wheelRadius
-    }, state, inputRef);
-    let { focusProps: focusProps, isFocusVisible: isFocusVisible } = (0, $bv4AR$useFocusRing)();
-    return /*#__PURE__*/ (0, $bv4AR$react).createElement("div", {
-        className: (0, $bv4AR$classNames)((0, ($parcel$interopDefault($bv4AR$colorwheel_vars_cssmodulejs))), 'spectrum-ColorWheel', {
-            'is-disabled': isDisabled
-        }, styleProps.className),
-        ref: containerRef,
-        style: {
-            ...styleProps.style,
-            // Workaround around https://github.com/adobe/spectrum-css/issues/1032
-            'width': size,
-            'height': size
-        }
-    }, /*#__PURE__*/ (0, $bv4AR$react).createElement("div", {
-        ...trackProps,
-        className: (0, $bv4AR$classNames)((0, ($parcel$interopDefault($bv4AR$colorwheel_vars_cssmodulejs))), 'spectrum-ColorWheel-gradient')
-    }), /*#__PURE__*/ (0, $bv4AR$react).createElement((0, $3a90e89d07d7bbd5$export$a3cc47cee1c1ccc), {
-        value: state.getDisplayColor(),
-        isFocused: isFocusVisible,
-        isDisabled: isDisabled,
-        isDragging: state.isDragging,
-        containerRef: containerRef,
-        className: (0, $bv4AR$classNames)((0, ($parcel$interopDefault($bv4AR$colorwheel_vars_cssmodulejs))), 'spectrum-ColorWheel-handle'),
-        ...thumbProps
-    }, /*#__PURE__*/ (0, $bv4AR$react).createElement("input", {
-        ...focusProps,
-        className: (0, $bv4AR$classNames)((0, ($parcel$interopDefault($bv4AR$colorwheel_vars_cssmodulejs))), 'spectrum-ColorWheel-slider'),
-        ...inputProps,
-        ref: inputRef
-    })));
-});
-
-
-export {$3aac1c27203f04b5$export$f80663f808113381 as ColorWheel};
-//# sourceMappingURL=ColorWheel.module.js.map