1 line
10 KiB
JSON
1 line
10 KiB
JSON
|
{"ast":null,"code":"import _slicedToArray from \"@babel/runtime/helpers/esm/slicedToArray\";\nimport React, { useRef } from 'react';\nimport useColorDrag from \"../hooks/useColorDrag\";\nimport Palette from \"./Palette\";\nimport classNames from 'classnames';\nimport { useEvent } from 'rc-util';\nimport { Color } from \"../color\";\nimport { calcOffset, calculateColor } from \"../util\";\nimport Gradient from \"./Gradient\";\nimport Handler from \"./Handler\";\nimport Transform from \"./Transform\";\nvar Slider = function Slider(props) {\n var prefixCls = props.prefixCls,\n colors = props.colors,\n disabled = props.disabled,\n onChange = props.onChange,\n onChangeComplete = props.onChangeComplete,\n color = props.color,\n type = props.type;\n var sliderRef = useRef();\n var transformRef = useRef();\n var colorRef = useRef(color);\n var getValue = function getValue(c) {\n return type === 'hue' ? c.getHue() : c.a * 100;\n };\n var onDragChange = useEvent(function (offsetValue) {\n var calcColor = calculateColor({\n offset: offsetValue,\n targetRef: transformRef,\n containerRef: sliderRef,\n color: color,\n type: type\n });\n colorRef.current = calcColor;\n onChange(getValue(calcColor));\n });\n var _useColorDrag = useColorDrag({\n color: color,\n targetRef: transformRef,\n containerRef: sliderRef,\n calculate: function calculate() {\n return calcOffset(color, type);\n },\n onDragChange: onDragChange,\n onDragChangeComplete: function onDragChangeComplete() {\n onChangeComplete(getValue(colorRef.current));\n },\n direction: 'x',\n disabledDrag: disabled\n }),\n _useColorDrag2 = _slicedToArray(_useColorDrag, 2),\n offset = _useColorDrag2[0],\n dragStartHandle = _useColorDrag2[1];\n var handleColor = React.useMemo(function () {\n if (type === 'hue') {\n var hsb = color.toHsb();\n hsb.s = 1;\n hsb.b = 1;\n hsb.a = 1;\n var lightColor = new Color(hsb);\n return lightColor;\n }\n return color;\n }, [color, type]);\n\n // ========================= Gradient =========================\n var gradientList = React.useMemo(function () {\n return colors.map(function (info) {\n return \"\".concat(info.color, \" \").concat(info.percent, \"%\");\n });\n }, [colors]);\n\n // ========================== Render ==========================\n return /*#__PURE__*/React.createElement(\"div\", {\n ref: sliderRef,\n className: classNames(\"\".concat(prefixCls, \"-slider\"), \"\".concat(prefixCls, \"-slider-\").concat(type)),\n onMouseDown: dragStartHandle,\n onTouchStart: dragStartHandle\n }, /*#__PURE__*/React.createElement(Palette, {\n prefixCls: prefixCls\n }, /*#__PURE__*/React.createElement(Transform, {\n x: offset.x,\n y: offset.y,\n ref: transformRef\n }, /*#__PURE__*/React.createElement(Handler, {\n size: \"small\",\n color: handleColor.toHexString(),\n prefixCls: prefixCls\n })), /*#__PURE__*/React.createElement(Gradient, {\n colors: gradientList,\n type: type,\n prefixCls: prefixCls\n })));\n};\nexport default Slider;","map":{"version":3,"names":["_slicedToArray","React","useRef","useColorDrag","Palette","classNames","useEvent","Color","calcOffset","calculateColor","Gradient","Handler","Transform","Slider","props","prefixCls","colors","disabled","onChange","onChangeComplete","color","type","sliderRef","transformRef","colorRef","getValue","c","getHue","a","onDragChange","offsetValue","calcColor","offset","targetRef","containerRef","current","_useColorDrag","calculate","onDragChangeComplete","direction","disabledDrag","_useColorDrag2","dragStartHandle","handleColor","useMemo","hsb","toHsb","s","b","lightColor","gradientList","map","info","concat","percent","createElement","ref","className","onMouseDown","onTouchStart","x","y","size","toHexString"],"sources":["C:/Users/Аришина)/Desktop/promo/node_modules/@rc-component/color-picker/es/components/Slider.js"],"sourcesContent":["import _slicedToArra
|