@dreamcommerce/aurora 3.0.0-244 → 3.0.0-246

package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_overrides/color_picker_gradient_bar.js

@@ -0,0 +1,155 @@
+import React, { useRef, useEffect } from 'react';
+import { objectSpread2 as _objectSpread2, toConsumableArray as _toConsumableArray } from '../../../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { getHandleValue } from '../../../../../../../external/react-best-gradient-color-picker/dist/esm/utils/utils.js';
+import { low, high } from '../../../../../../../external/react-best-gradient-color-picker/dist/esm/utils/formatters.js';
+import { usePicker } from '../../../../../../../external/react-best-gradient-color-picker/dist/esm/context.js';
+
+/**
+ * Zmieniono wzgledem react-best-gradient-color-picker:
+ * - Dodano e.preventDefault() do handleDown
+ * - Wysokosc i szerokosc Handle
+ */
+var Handle = function Handle(_ref) {
+  var left = _ref.left,
+    i = _ref.i,
+    setDragging = _ref.setDragging;
+  var _usePicker = usePicker(),
+    colors = _usePicker.colors,
+    selectedColor = _usePicker.selectedColor,
+    squareWidth = _usePicker.squareWidth,
+    defaultStyles = _usePicker.defaultStyles,
+    createGradientStr = _usePicker.createGradientStr;
+  var isSelected = selectedColor === i;
+  var leftMultiplyer = (squareWidth - 18) / 100;
+  var setSelectedColor = function setSelectedColor(index) {
+    var newGradStr = colors === null || colors === void 0 ? void 0 : colors.map(function (cc, i) {
+      return _objectSpread2(_objectSpread2({}, cc), {}, {
+        value: i === index ? high(cc) : low(cc)
+      });
+    });
+    createGradientStr(newGradStr);
+  };
+  var handleDown = function handleDown(e) {
+    e.preventDefault();
+    e.stopPropagation();
+    setSelectedColor(i);
+    setDragging(true);
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    id: "gradient-handle-".concat(i),
+    onMouseDown: function onMouseDown(e) {
+      return handleDown(e);
+    },
+    style: _objectSpread2(_objectSpread2({}, defaultStyles.rbgcpGradientHandleWrap), {}, {
+      left: (left || 0) * leftMultiplyer,
+      top: -3
+    })
+  }, /*#__PURE__*/React.createElement("div", {
+    style: _objectSpread2(_objectSpread2(_objectSpread2({}, defaultStyles.rbgcpGradientHandle), isSelected ? {
+      boxShadow: '0px 0px 5px 1px rgba(86, 140, 245,.95)',
+      border: '2px solid white'
+    } : {}), {}, {
+      width: 16,
+      height: 16
+    })
+  }, isSelected && (/*#__PURE__*/React.createElement("div", {
+    style: {
+      width: 4,
+      height: 4,
+      borderRadius: '100%',
+      background: 'white'
+    }
+  }))));
+};
+/**
+ * Zmieniono wzgledem react-best-gradient-color-picker:
+ * - Przeniesiono handleMove na window
+ * - Wysokosc i marginesy GradientBar
+ */
+var GradientBar = function GradientBar() {
+  var _usePicker2 = usePicker(),
+    currentColor = _usePicker2.currentColor,
+    createGradientStr = _usePicker2.createGradientStr,
+    colors = _usePicker2.colors,
+    value = _usePicker2.value,
+    handleGradient = _usePicker2.handleGradient,
+    squareWidth = _usePicker2.squareWidth;
+  var barRef = useRef(null);
+  var draggingRef = useRef(false);
+  function force90degLinear(color) {
+    return color.replace(/(radial|linear)-gradient\([^,]+,/, 'linear-gradient(90deg,');
+  }
+  var setDragging = function setDragging(val) {
+    draggingRef.current = val;
+  };
+  var addPoint = function addPoint(e) {
+    var _ref2;
+    var left = getHandleValue(e);
+    var newColors = (_ref2 = [].concat(_toConsumableArray(colors.map(function (c) {
+      return _objectSpread2(_objectSpread2({}, c), {}, {
+        value: low(c)
+      });
+    })), [{
+      value: currentColor,
+      left: left
+    }])) === null || _ref2 === void 0 ? void 0 : _ref2.sort(function (a, b) {
+      return a.left - b.left;
+    });
+    createGradientStr(newColors);
+  };
+  var handleDown = function handleDown(e) {
+    if (draggingRef.current) return;
+    e.preventDefault();
+    e.stopPropagation();
+    addPoint(e);
+    setDragging(true);
+  };
+  useEffect(function () {
+    var handleUp = function handleUp() {
+      setDragging(false);
+    };
+    var handleMove = function handleMove(e) {
+      if (!draggingRef.current || !barRef.current) return;
+      var newEvent = {
+        target: barRef.current,
+        clientX: e.clientX
+      };
+      handleGradient(currentColor, getHandleValue(newEvent));
+    };
+    window.addEventListener('mouseup', handleUp);
+    window.addEventListener('mousemove', handleMove);
+    return function () {
+      window.removeEventListener('mouseup', handleUp);
+      window.removeEventListener('mousemove', handleMove);
+    };
+  }, [currentColor, handleGradient]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "aurora-my-[1px]",
+    style: {
+      width: '100%',
+      position: 'relative'
+    },
+    id: "gradient-bar"
+  }, /*#__PURE__*/React.createElement("div", {
+    ref: barRef,
+    style: {
+      height: 10,
+      borderRadius: 10,
+      width: squareWidth,
+      backgroundImage: force90degLinear(value)
+    },
+    onMouseDown: function onMouseDown(e) {
+      return handleDown(e);
+    }
+  }), colors === null || colors === void 0 ? void 0 : colors.map(function (c, i) {
+    return /*#__PURE__*/React.createElement(Handle, {
+      i: i,
+      left: c.left,
+      key: "".concat(i, "-").concat(c),
+      setDragging: setDragging
+    });
+  }));
+};
+
+export { GradientBar, Handle };
+//# sourceMappingURL=color_picker_gradient_bar.js.map

package/build/esm/{external/react-best-gradient-color-picker/dist/esm/components/GradientControls.js.map → packages/aurora/src/components/color_picker/components/color_picker_overrides/color_picker_gradient_bar.js.map}

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA,+BAA+B,wFAA4F;AAC3H,0BAA0B,6FAAiG;AAC3H,0BAA0B,oFAAwF;AAClH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_overrides/color_picker_gradient_controls.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+/**
+ * Zmieniono wzgledem react-best-gradient-color-picker:
+ * - Zmieniono ikonke smietnika
+ */
+export declare const GradientControls: ({ hideGradientType, hideGradientAngle, hideGradientStop }: {
+    hideGradientType?: boolean | undefined;
+    hideGradientAngle?: boolean | undefined;
+    hideGradientStop?: boolean | undefined;
+}) => React.JSX.Element;

package/build/esm/{external/react-best-gradient-color-picker/dist/esm/components/GradientControls.js → packages/aurora/src/components/color_picker/components/color_picker_overrides/color_picker_gradient_controls.js}

@@ -1,25 +1,17 @@
 import React from 'react';
-import { formatInputValues, high, low } from '../utils/formatters.js';
-import { usePicker } from '../context.js';
-import TrashIcon, { LinearIcon, RadialIcon, StopIcon, DegreesIcon } from './icon.js';
-import { controlBtnStyles } from '../styles/styles.js';
+import { objectSpread2 as _objectSpread2 } from '../../../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { formatInputValues, high, low } from '../../../../../../../external/react-best-gradient-color-picker/dist/esm/utils/formatters.js';
+import { usePicker } from '../../../../../../../external/react-best-gradient-color-picker/dist/esm/context.js';
+import { LinearIcon, RadialIcon, StopIcon, DegreesIcon } from '../../../../../../../external/react-best-gradient-color-picker/dist/esm/components/icon.js';
+import { controlBtnStyles } from '../../../../../../../external/react-best-gradient-color-picker/dist/esm/styles/styles.js';
+import { DeleteBinLineIcon } from '../../../../assets/icons/delete_bin_icon.js';
 
-var __assign = undefined && undefined.__assign || function () {
-  __assign = Object.assign || function (t) {
-    for (var s, i = 1, n = arguments.length; i < n; i++) {
-      s = arguments[i];
-      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-    }
-    return t;
-  };
-  return __assign.apply(this, arguments);
-};
 var GradientType = function GradientType() {
-  var _a = usePicker(),
-    gradientType = _a.gradientType,
-    onChange = _a.onChange,
-    value = _a.value,
-    defaultStyles = _a.defaultStyles;
+  var _usePicker = usePicker(),
+    gradientType = _usePicker.gradientType,
+    onChange = _usePicker.onChange,
+    value = _usePicker.value,
+    defaultStyles = _usePicker.defaultStyles;
   var isLinear = gradientType === 'linear-gradient';
   var isRadial = gradientType === 'radial-gradient';
   var handleLinear = function handleLinear() {
@@ -35,7 +27,7 @@ var GradientType = function GradientType() {
   }, /*#__PURE__*/React.createElement("div", {
     onClick: handleLinear,
     id: "rbgcp-linear-btn",
-    style: __assign(__assign({}, defaultStyles.rbgcpControlBtn), isLinear && defaultStyles.rbgcpControlBtnSelected),
+    style: _objectSpread2(_objectSpread2({}, defaultStyles.rbgcpControlBtn), isLinear && defaultStyles.rbgcpControlBtnSelected),
     tabIndex: 0,
     role: "button",
     onKeyDown: function onKeyDown() {
@@ -46,7 +38,7 @@ var GradientType = function GradientType() {
   })), /*#__PURE__*/React.createElement("div", {
     onClick: handleRadial,
     id: "rbgcp-radial-btn",
-    style: __assign(__assign({}, defaultStyles.rbgcpControlBtn), isRadial && defaultStyles.rbgcpControlBtnSelected),
+    style: _objectSpread2(_objectSpread2({}, defaultStyles.rbgcpControlBtn), isRadial && defaultStyles.rbgcpControlBtnSelected),
     tabIndex: 0,
     role: "button",
     onKeyDown: function onKeyDown() {
@@ -57,16 +49,16 @@ var GradientType = function GradientType() {
   })));
 };
 var StopPicker = function StopPicker() {
-  var _a = usePicker(),
-    currentLeft = _a.currentLeft,
-    handleGradient = _a.handleGradient,
-    currentColor = _a.currentColor,
-    defaultStyles = _a.defaultStyles;
+  var _usePicker2 = usePicker(),
+    currentLeft = _usePicker2.currentLeft,
+    handleGradient = _usePicker2.handleGradient,
+    currentColor = _usePicker2.currentColor,
+    defaultStyles = _usePicker2.defaultStyles;
   var handleMove = function handleMove(newVal) {
     handleGradient(currentColor, formatInputValues(parseInt(newVal), 0, 100));
   };
   return /*#__PURE__*/React.createElement("div", {
-    style: __assign(__assign(__assign(__assign({}, defaultStyles.rbgcpControlBtnWrapper), defaultStyles.rbgcpControlInputWrap), defaultStyles.rbgcpStopInputWrap), {
+    style: _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({}, defaultStyles.rbgcpControlBtnWrapper), defaultStyles.rbgcpControlInputWrap), defaultStyles.rbgcpStopInputWrap), {}, {
       paddingLeft: 8
     })
   }, /*#__PURE__*/React.createElement(StopIcon, null), /*#__PURE__*/React.createElement("input", {
@@ -75,31 +67,31 @@ var StopPicker = function StopPicker() {
     onChange: function onChange(e) {
       return handleMove(e.target.value);
     },
-    style: __assign(__assign({}, defaultStyles.rbgcpControlInput), defaultStyles.rbgcpStopInput)
+    style: _objectSpread2(_objectSpread2({}, defaultStyles.rbgcpControlInput), defaultStyles.rbgcpStopInput)
   }));
 };
 var DegreePicker = function DegreePicker() {
-  var _a = usePicker(),
-    degrees = _a.degrees,
-    onChange = _a.onChange,
-    value = _a.value,
-    defaultStyles = _a.defaultStyles;
+  var _usePicker3 = usePicker(),
+    degrees = _usePicker3.degrees,
+    onChange = _usePicker3.onChange,
+    value = _usePicker3.value,
+    defaultStyles = _usePicker3.defaultStyles;
   var handleDegrees = function handleDegrees(e) {
     var newValue = formatInputValues(e.target.value, 0, 360);
     var remaining = value.split(/,(.+)/)[1];
     onChange("linear-gradient(".concat(newValue || 0, "deg, ").concat(remaining));
   };
   return /*#__PURE__*/React.createElement("div", {
-    style: __assign(__assign(__assign({}, defaultStyles.rbgcpControlBtnWrapper), defaultStyles.rbgcpControlInputWrap), defaultStyles.rbgcpDegreeInputWrap)
+    style: _objectSpread2(_objectSpread2(_objectSpread2({}, defaultStyles.rbgcpControlBtnWrapper), defaultStyles.rbgcpControlInputWrap), defaultStyles.rbgcpDegreeInputWrap)
   }, /*#__PURE__*/React.createElement(DegreesIcon, null), /*#__PURE__*/React.createElement("input", {
     value: degrees,
     id: "rbgcp-degree-input",
     onChange: function onChange(e) {
       return handleDegrees(e);
     },
-    style: __assign(__assign({}, defaultStyles.rbgcpControlInput), defaultStyles.rbgcpDegreeInput)
+    style: _objectSpread2(_objectSpread2({}, defaultStyles.rbgcpControlInput), defaultStyles.rbgcpDegreeInput)
   }), /*#__PURE__*/React.createElement("div", {
-    style: __assign(__assign({}, defaultStyles.rbgcpDegreeIcon), {
+    style: _objectSpread2(_objectSpread2({}, defaultStyles.rbgcpDegreeIcon), {}, {
       position: 'absolute',
       right: degrees > 99 ? 0 : degrees < 10 ? 7 : 3,
       top: 1,
@@ -109,15 +101,15 @@ var DegreePicker = function DegreePicker() {
   }, "\xB0"));
 };
 var DeleteBtn = function DeleteBtn() {
-  var _a = usePicker(),
-    colors = _a.colors,
-    selectedColor = _a.selectedColor,
-    createGradientStr = _a.createGradientStr,
-    defaultStyles = _a.defaultStyles;
+  var _usePicker4 = usePicker(),
+    colors = _usePicker4.colors,
+    selectedColor = _usePicker4.selectedColor,
+    createGradientStr = _usePicker4.createGradientStr,
+    defaultStyles = _usePicker4.defaultStyles;
   var deletePoint = function deletePoint() {
     if ((colors === null || colors === void 0 ? void 0 : colors.length) > 2) {
       var formatted = colors === null || colors === void 0 ? void 0 : colors.map(function (fc, i) {
-        return __assign(__assign({}, fc), {
+        return _objectSpread2(_objectSpread2({}, fc), {}, {
           value: i === selectedColor - 1 ? high(fc) : low(fc)
         });
       });
@@ -129,8 +121,9 @@ var DeleteBtn = function DeleteBtn() {
   };
   return /*#__PURE__*/React.createElement("div", {
     onClick: deletePoint,
-    style: __assign(__assign({}, controlBtnStyles(false, defaultStyles)), {
-      width: 28
+    style: _objectSpread2(_objectSpread2({}, controlBtnStyles(false, defaultStyles)), {}, {
+      width: 28,
+      background: '#F5F6FA'
     }),
     id: "rbgcp-point-delete-btn",
     tabIndex: 0,
@@ -138,17 +131,23 @@ var DeleteBtn = function DeleteBtn() {
     onKeyDown: function onKeyDown() {
       return;
     }
-  }, /*#__PURE__*/React.createElement(TrashIcon, null));
+  }, /*#__PURE__*/React.createElement(DeleteBinLineIcon, {
+    className: "aurora-w-4 aurora-h-4 aurora-stroke-0"
+  }));
 };
-var GradientControls = function GradientControls(_a) {
-  var hideGradientType = _a.hideGradientType,
-    hideGradientAngle = _a.hideGradientAngle,
-    hideGradientStop = _a.hideGradientStop;
-  var _b = usePicker(),
-    gradientType = _b.gradientType,
-    defaultStyles = _b.defaultStyles;
+/**
+ * Zmieniono wzgledem react-best-gradient-color-picker:
+ * - Zmieniono ikonke smietnika
+ */
+var GradientControls = function GradientControls(_ref) {
+  var hideGradientType = _ref.hideGradientType,
+    hideGradientAngle = _ref.hideGradientAngle,
+    hideGradientStop = _ref.hideGradientStop;
+  var _usePicker5 = usePicker(),
+    gradientType = _usePicker5.gradientType,
+    defaultStyles = _usePicker5.defaultStyles;
   return /*#__PURE__*/React.createElement("div", {
-    style: __assign(__assign({}, defaultStyles.rbgcpControlBtnWrapper), {
+    style: _objectSpread2(_objectSpread2({}, defaultStyles.rbgcpControlBtnWrapper), {}, {
       marginTop: 12,
       marginBottom: -4,
       justifyContent: 'space-between',
@@ -159,8 +158,8 @@ var GradientControls = function GradientControls(_a) {
     style: {
       width: 53
     }
-  }, !hideGradientAngle && gradientType === 'linear-gradient' && (/*#__PURE__*/React.createElement(DegreePicker, null))), !hideGradientStop && /*#__PURE__*/React.createElement(StopPicker, null), /*#__PURE__*/React.createElement(DeleteBtn, null));
+  }, !hideGradientAngle && gradientType === 'linear-gradient' && /*#__PURE__*/React.createElement(DegreePicker, null)), !hideGradientStop && /*#__PURE__*/React.createElement(StopPicker, null), /*#__PURE__*/React.createElement(DeleteBtn, null));
 };
 
-export default GradientControls;
-//# sourceMappingURL=GradientControls.js.map
+export { GradientControls };
+//# sourceMappingURL=color_picker_gradient_controls.js.map

package/build/esm/{external/react-best-gradient-color-picker/dist/esm/components/GradientBar.js.map → packages/aurora/src/components/color_picker/components/color_picker_overrides/color_picker_gradient_controls.js.map}

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA,6CAA6C,6FAAiG;AAC9I,0BAA0B,oFAAwF;AAClH,8DAA8D,4FAAgG;AAC9J,iCAAiC,0FAA8F;AAC/H;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_overrides/color_picker_hue.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+/**
+ * Zmieniono wzgledem react-best-gradient-color-picker:
+ * - Przeniesiono handleMove na window
+ * - Wysokosc i marginesy
+ * - Zmiana onClick na onMouseDown
+ */
+export declare const Hue: () => React.JSX.Element;

package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_overrides/color_picker_hue.js

@@ -0,0 +1,111 @@
+import React, { useRef, useCallback, useEffect } from 'react';
+import { objectSpread2 as _objectSpread2 } from '../../../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import tinycolor from '../../../../../../../external/tinycolor2/esm/tinycolor.js';
+import { getHandleValue } from '../../../../../../../external/react-best-gradient-color-picker/dist/esm/utils/utils.js';
+import { usePicker } from '../../../../../../../external/react-best-gradient-color-picker/dist/esm/context.js';
+import usePaintHue from '../../../../../../../external/react-best-gradient-color-picker/dist/esm/hooks/usePaintHue.js';
+
+/**
+ * Zmieniono wzgledem react-best-gradient-color-picker:
+ * - Przeniesiono handleMove na window
+ * - Wysokosc i marginesy
+ * - Zmiana onClick na onMouseDown
+ */
+var Hue = function Hue() {
+  var barRef = useRef(null);
+  var _usePicker = usePicker(),
+    handleChange = _usePicker.handleChange,
+    squareWidth = _usePicker.squareWidth,
+    hc = _usePicker.hc,
+    setHc = _usePicker.setHc;
+  usePaintHue(barRef, squareWidth);
+  var containerRef = useRef(null);
+  var draggingRef = useRef(false);
+  var stopDragging = function stopDragging() {
+    draggingRef.current = false;
+  };
+  var handleDown = function handleDown() {
+    draggingRef.current = true;
+  };
+  var handleHue = useCallback(function (e) {
+    var newHue = getHandleValue(e) * 3.6;
+    var tinyHsv = tinycolor({
+      h: newHue,
+      s: hc === null || hc === void 0 ? void 0 : hc.s,
+      v: hc === null || hc === void 0 ? void 0 : hc.v
+    });
+    var _tinyHsv$toRgb = tinyHsv.toRgb(),
+      r = _tinyHsv$toRgb.r,
+      g = _tinyHsv$toRgb.g,
+      b = _tinyHsv$toRgb.b;
+    handleChange("rgba(".concat(r, ", ").concat(g, ", ").concat(b, ", ").concat(hc.a, ")"));
+    setHc(_objectSpread2(_objectSpread2({}, hc), {}, {
+      h: newHue
+    }));
+  }, [handleChange, hc, setHc]);
+  var handleBarMouseDown = function handleBarMouseDown(e) {
+    if (draggingRef.current) return;
+    handleHue(e);
+    draggingRef.current = true;
+  };
+  useEffect(function () {
+    var handleUp = function handleUp() {
+      stopDragging();
+    };
+    var handleMove = function handleMove(e) {
+      if (!draggingRef.current) return;
+      var newEvent = {
+        target: containerRef.current,
+        clientX: e.clientX
+      };
+      handleHue(newEvent);
+    };
+    window.addEventListener('mouseup', handleUp);
+    window.addEventListener('mousemove', handleMove);
+    return function () {
+      window.removeEventListener('mouseup', handleUp);
+      window.removeEventListener('mousemove', handleMove);
+    };
+  }, [handleHue]);
+  return /*#__PURE__*/React.createElement("div", {
+    ref: containerRef,
+    style: {
+      height: 12,
+      cursor: 'ew-resize',
+      position: 'relative'
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    tabIndex: 0,
+    role: "button",
+    style: {
+      border: '2px solid white',
+      borderRadius: '50%',
+      boxShadow: '0px 0px 3px rgba(0, 0, 0, 0.5)',
+      width: '16px',
+      height: '16px',
+      zIndex: 1000,
+      transition: 'all 10ms linear',
+      position: 'absolute',
+      left: (hc === null || hc === void 0 ? void 0 : hc.h) * ((squareWidth - 18) / 360),
+      top: -2,
+      cursor: 'ew-resize',
+      boxSizing: 'border-box'
+    },
+    onMouseDown: handleDown
+  }), /*#__PURE__*/React.createElement("canvas", {
+    ref: barRef,
+    height: "12px",
+    width: "".concat(squareWidth, "px"),
+    onMouseDown: function onMouseDown(e) {
+      return handleBarMouseDown(e);
+    },
+    style: {
+      position: 'relative',
+      borderRadius: 14,
+      verticalAlign: 'top'
+    }
+  }));
+};
+
+export { Hue };
+//# sourceMappingURL=color_picker_hue.js.map

package/build/esm/{external/react-best-gradient-color-picker/dist/esm/components/Hue.js.map → packages/aurora/src/components/color_picker/components/color_picker_overrides/color_picker_hue.js.map}

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,sBAAsB,2CAA+C;AACrE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA,sBAAsB,2DAA+D;AACrF,+BAA+B,wFAA4F;AAC3H,0BAA0B,oFAAwF;AAClH,wBAAwB,8FAAkG;AAC1H;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_overrides/color_picker_opacity.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+/**
+ * Zmieniono wzgledem react-best-gradient-color-picker:
+ * - Przeniesiono handleMove na window
+ * - Wysokosc i marginesy
+ * - Zmiana onClick na onMouseDown
+ */
+export declare const Opacity: () => React.JSX.Element;

package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_overrides/color_picker_opacity.js

@@ -0,0 +1,92 @@
+import React, { useRef, useCallback, useEffect } from 'react';
+import { objectSpread2 as _objectSpread2 } from '../../../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { getHandleValue } from '../../../../../../../external/react-best-gradient-color-picker/dist/esm/utils/utils.js';
+import { usePicker } from '../../../../../../../external/react-best-gradient-color-picker/dist/esm/context.js';
+
+/**
+ * Zmieniono wzgledem react-best-gradient-color-picker:
+ * - Przeniesiono handleMove na window
+ * - Wysokosc i marginesy
+ * - Zmiana onClick na onMouseDown
+ */
+var Opacity = function Opacity() {
+  var _usePicker = usePicker(),
+    handleChange = _usePicker.handleChange,
+    _usePicker$hc = _usePicker.hc,
+    hc = _usePicker$hc === void 0 ? {} : _usePicker$hc,
+    squareWidth = _usePicker.squareWidth,
+    defaultStyles = _usePicker.defaultStyles;
+  var r = hc.r,
+    g = hc.g,
+    b = hc.b;
+  var bg = "linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(".concat(r, ",").concat(g, ",").concat(b, ",.5) 100%)");
+  var containerRef = useRef(null);
+  var draggingRef = useRef(false);
+  var stopDragging = function stopDragging() {
+    draggingRef.current = false;
+  };
+  var handleDown = function handleDown() {
+    draggingRef.current = true;
+  };
+  var handleOpacity = useCallback(function (e) {
+    var newO = getHandleValue(e) / 100;
+    var newColor = "rgba(".concat(r, ", ").concat(g, ", ").concat(b, ", ").concat(newO, ")");
+    handleChange(newColor);
+  }, [b, g, handleChange, r]);
+  var handleMouseDown = function handleMouseDown(e) {
+    if (draggingRef.current) return;
+    handleOpacity(e);
+    draggingRef.current = true;
+  };
+  var left = squareWidth - 18;
+  useEffect(function () {
+    var handleUp = function handleUp() {
+      stopDragging();
+    };
+    var handleMove = function handleMove(e) {
+      if (!draggingRef.current) return;
+      var newEvent = {
+        target: containerRef.current,
+        clientX: e.clientX
+      };
+      handleOpacity(newEvent);
+    };
+    window.addEventListener('mouseup', handleUp);
+    window.addEventListener('mousemove', handleMove);
+    return function () {
+      window.removeEventListener('mouseup', handleUp);
+      window.removeEventListener('mousemove', handleMove);
+    };
+  }, [handleOpacity]);
+  return /*#__PURE__*/React.createElement("div", {
+    ref: containerRef,
+    onMouseDown: handleDown,
+    style: {
+      height: 12,
+      cursor: 'ew-resize',
+      position: 'relative'
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    style: _objectSpread2(_objectSpread2({}, defaultStyles.rbgcpCheckered), {}, {
+      width: '100%',
+      height: 12
+    })
+  }), /*#__PURE__*/React.createElement("div", {
+    style: _objectSpread2(_objectSpread2({}, defaultStyles.rbgcpHandle), {}, {
+      left: left * (hc === null || hc === void 0 ? void 0 : hc.a),
+      top: -2,
+      width: 16,
+      height: 16
+    })
+  }), /*#__PURE__*/React.createElement("div", {
+    style: _objectSpread2(_objectSpread2({}, defaultStyles.rbgcpOpacityOverlay), {}, {
+      background: bg
+    }),
+    onMouseDown: function onMouseDown(e) {
+      return handleMouseDown(e);
+    }
+  }));
+};
+
+export { Opacity };
+//# sourceMappingURL=color_picker_opacity.js.map

package/build/esm/{external/react-best-gradient-color-picker/dist/esm/components/Opacity.js.map → packages/aurora/src/components/color_picker/components/color_picker_overrides/color_picker_opacity.js.map}

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA,+BAA+B,wFAA4F;AAC3H,0BAA0B,oFAAwF;AAClH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_overrides/color_picker_square.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+/**
+ * Zmieniono wzgledem react-best-gradient-color-picker:
+ * - Przeniesiono handleMove na window
+ * - Usunieto throttle ktore i tak nie dzialalo -.-
+ */
+export declare const Square: () => React.JSX.Element;