@dreamcommerce/aurora 0.4.4 → 0.4.5

package/build/esm/packages/aurora/src/assets/icon_upload.js

@@ -1,18 +1,15 @@
 import React from 'react';
 import Icon from './icon.js';
 
-var IconUpload = function (_a) {
-    var _b = _a.className, className = _b === void 0 ? '' : _b;
-    return (React.createElement(Icon, null,
-        React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", className: className },
-            React.createElement("g", { fill: "none", fillRule: "evenodd" },
+const IconUpload = ({ className = '' }) => (React.createElement(Icon, null,
+    React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", className: className },
+        React.createElement("g", { fill: "none", fillRule: "evenodd" },
+            React.createElement("g", null,
                 React.createElement("g", null,
                     React.createElement("g", null,
                         React.createElement("g", null,
-                            React.createElement("g", null,
-                                React.createElement("path", { d: "M13.124 7.374H5.59L7.045 8.83c.44.44.44 1.15 0 1.59-.22.22-.508.33-.796.33-.288 0-.576-.11-.795-.33L2.08 7.046c-.103-.104-.186-.227-.243-.366-.114-.274-.114-.585 0-.86.057-.138.14-.261.243-.365L5.454 2.08c.44-.44 1.15-.44 1.59 0 .44.44.44 1.15 0 1.59L5.59 5.125h7.534c.621 0 1.125.504 1.125 1.125s-.504 1.125-1.125 1.125z", transform: "translate(-1728 -4529) translate(1590 3755) translate(0 602) translate(138 172) rotate(90 8 6.25)" }),
-                                React.createElement("path", { fillRule: "nonzero", d: "M14 14H2v-3H0v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1v-4h-2v3z", transform: "translate(-1728 -4529) translate(1590 3755) translate(0 602) translate(138 172)" })))))))));
-};
+                            React.createElement("path", { d: "M13.124 7.374H5.59L7.045 8.83c.44.44.44 1.15 0 1.59-.22.22-.508.33-.796.33-.288 0-.576-.11-.795-.33L2.08 7.046c-.103-.104-.186-.227-.243-.366-.114-.274-.114-.585 0-.86.057-.138.14-.261.243-.365L5.454 2.08c.44-.44 1.15-.44 1.59 0 .44.44.44 1.15 0 1.59L5.59 5.125h7.534c.621 0 1.125.504 1.125 1.125s-.504 1.125-1.125 1.125z", transform: "translate(-1728 -4529) translate(1590 3755) translate(0 602) translate(138 172) rotate(90 8 6.25)" }),
+                            React.createElement("path", { fillRule: "nonzero", d: "M14 14H2v-3H0v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1v-4h-2v3z", transform: "translate(-1728 -4529) translate(1590 3755) translate(0 602) translate(138 172)" })))))))));
 
 export default IconUpload;
 //# sourceMappingURL=icon_upload.js.map

package/build/esm/packages/aurora/src/assets/icon_upload.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;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/button/components/button/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IAsButtonProps } from './types';
 export declare const button: {
     render({ type, onClick, children }: IAsButtonProps, classNames: string): JSX.Element;

package/build/esm/packages/aurora/src/components/button/components/button/index.js

@@ -1,8 +1,7 @@
 import React from 'react';
 
-var button = {
-    render: function (_a, classNames) {
-        var _b = _a.type, type = _b === void 0 ? 'button' : _b, onClick = _a.onClick, children = _a.children;
+const button = {
+    render({ type = 'button', onClick, children }, classNames) {
         return (React.createElement("button", { type: type, onClick: onClick, className: classNames }, children));
     }
 };

package/build/esm/packages/aurora/src/components/button/components/button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/button/components/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare const buttonTypes: {
     button: {
         render({ type, onClick, children }: import("./button/types").IAsButtonProps, classNames: string): JSX.Element;

package/build/esm/packages/aurora/src/components/button/components/index.js

@@ -1,9 +1,9 @@
 import { button } from './button/index.js';
 import { link } from './link/index.js';
 
-var buttonTypes = {
-    button: button,
-    link: link
+const buttonTypes = {
+    button,
+    link
 };
 
 export { buttonTypes };

package/build/esm/packages/aurora/src/components/button/components/link/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IAsLinkProps } from './types';
 export declare const link: {
     render({ href, target, onClick, children }: IAsLinkProps, classNames: string): JSX.Element;

package/build/esm/packages/aurora/src/components/button/components/link/index.js

@@ -1,8 +1,7 @@
 import React from 'react';
 
-var link = {
-    render: function (_a, classNames) {
-        var href = _a.href, target = _a.target, onClick = _a.onClick, children = _a.children;
+const link = {
+    render({ href, target, onClick, children }, classNames) {
         return (React.createElement("a", { href: href, target: target, onClick: onClick, className: classNames }, children));
     }
 };

package/build/esm/packages/aurora/src/components/button/components/link/index.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/button/css_classes.js

@@ -1,9 +1,9 @@
-var cssButton = 'btn';
-var cssButtonOutline = "".concat(cssButton, "_outline");
-var cssButtonBg = "".concat(cssButton, "_bg");
-var cssButtonS = "".concat(cssButton, "_s");
-var cssButtonLink = "".concat(cssButton, "_link");
-var cssButtonInactive = "".concat(cssButton, "_inactive");
+const cssButton = 'btn';
+const cssButtonOutline = `${cssButton}_outline`;
+const cssButtonBg = `${cssButton}_bg`;
+const cssButtonS = `${cssButton}_s`;
+const cssButtonLink = `${cssButton}_link`;
+const cssButtonInactive = `${cssButton}_inactive`;
 
 export { cssButton, cssButtonBg, cssButtonInactive, cssButtonLink, cssButtonOutline, cssButtonS };
 //# sourceMappingURL=css_classes.js.map

package/build/esm/packages/aurora/src/components/button/index.js

@@ -1,5 +1,4 @@
 import 'react';
-import { __rest } from '../../../../../_virtual/_tslib.js';
 import { cssButton, cssButtonS, cssButtonBg, cssButtonOutline, cssButtonLink, cssButtonInactive } from './css_classes.js';
 import { buttonTypes } from './components/index.js';
 import classnames from 'classnames';
@@ -22,19 +21,17 @@ import cssClasses from '../../css/button/main.module.less.js';
  *  </Button>
  * )
  */
-var Button = function (_a) {
-    var _b;
-    var _c = _a.as, as = _c === void 0 ? 'button' : _c, size = _a.size, color = _a.color, variant = _a.variant, inactive = _a.inactive, _d = _a.className, className = _d === void 0 ? '' : _d, props = __rest(_a, ["as", "size", "color", "variant", "inactive", "className"]);
-    var btnColor = "".concat(cssButton, "_").concat(color);
-    var buttonClassNames = classnames(cssClasses[cssButton], (_b = {},
-        _b[className] = className,
-        _b[cssClasses[cssButtonS]] = size,
-        _b[cssClasses[cssButtonBg]] = !variant,
-        _b[cssClasses[cssButtonOutline]] = variant === 'outline',
-        _b[cssClasses[cssButtonLink]] = variant === 'link',
-        _b[cssClasses[btnColor]] = true,
-        _b[cssClasses[cssButtonInactive]] = inactive,
-        _b));
+const Button = ({ as = 'button', size, color, variant, inactive, className = '', ...props }) => {
+    const btnColor = `${cssButton}_${color}`;
+    const buttonClassNames = classnames(cssClasses[cssButton], {
+        [className]: className,
+        [cssClasses[cssButtonS]]: size,
+        [cssClasses[cssButtonBg]]: !variant,
+        [cssClasses[cssButtonOutline]]: variant === 'outline',
+        [cssClasses[cssButtonLink]]: variant === 'link',
+        [cssClasses[btnColor]]: true,
+        [cssClasses[cssButtonInactive]]: inactive
+    });
     return buttonTypes[as].render(props, buttonClassNames);
 };
 

package/build/esm/packages/aurora/src/components/button/index.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;"}
+{"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;"}

package/build/esm/packages/aurora/src/components/buttons_group/css_classes.js

@@ -1,7 +1,7 @@
-var cssButtonsGroup = 'buttons-group';
-var cssButtonsGroupHCenter = "".concat(cssButtonsGroup, "_hcenter");
-var cssButtonsGroupHRight = "".concat(cssButtonsGroup, "_hright");
-var cssButtonsGroupReverseOrder = "".concat(cssButtonsGroup, "_reverse-order");
+const cssButtonsGroup = 'buttons-group';
+const cssButtonsGroupHCenter = `${cssButtonsGroup}_hcenter`;
+const cssButtonsGroupHRight = `${cssButtonsGroup}_hright`;
+const cssButtonsGroupReverseOrder = `${cssButtonsGroup}_reverse-order`;
 
 export { cssButtonsGroup, cssButtonsGroupHCenter, cssButtonsGroupHRight, cssButtonsGroupReverseOrder };
 //# sourceMappingURL=css_classes.js.map

package/build/esm/packages/aurora/src/components/buttons_group/index.js

@@ -3,14 +3,12 @@ import classnames from 'classnames';
 import cssClasses from '../../css/buttons_group/main.module.less.js';
 import { cssButtonsGroup, cssButtonsGroupHCenter, cssButtonsGroupHRight, cssButtonsGroupReverseOrder } from './css_classes.js';
 
-var ButtonsGroup = function (_a) {
-    var _b;
-    var _c = _a.align, align = _c === void 0 ? 'right' : _c, isOrderReversed = _a.isOrderReversed, children = _a.children;
-    var classNames = classnames(cssClasses[cssButtonsGroup], (_b = {},
-        _b[cssClasses[cssButtonsGroupHCenter]] = align === 'center',
-        _b[cssClasses[cssButtonsGroupHRight]] = align === 'right',
-        _b[cssClasses[cssButtonsGroupReverseOrder]] = isOrderReversed,
-        _b));
+const ButtonsGroup = ({ align = 'right', isOrderReversed, children }) => {
+    const classNames = classnames(cssClasses[cssButtonsGroup], {
+        [cssClasses[cssButtonsGroupHCenter]]: align === 'center',
+        [cssClasses[cssButtonsGroupHRight]]: align === 'right',
+        [cssClasses[cssButtonsGroupReverseOrder]]: isOrderReversed
+    });
     return React.createElement("div", { className: classNames }, children);
 };
 

package/build/esm/packages/aurora/src/components/buttons_group/index.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;"}
+{"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;"}

package/build/esm/packages/aurora/src/components/color_picker/components/buttons.js

@@ -1,6 +1,5 @@
 import React, { useContext } from 'react';
 import { useTranslation } from '../../../../../../external/react-i18next/dist/es/useTranslation.js';
-import { __assign } from '../../../../../../_virtual/_tslib.js';
 import Button from '../../button/index.js';
 import ButtonsGroup from '../../buttons_group/index.js';
 import styles from '../../../css/color_picker/main.module.less.js';
@@ -8,31 +7,30 @@ import { cssColorPickerButtonsGroup } from '../css_classes.js';
 import { DropdownContext } from '../../dropdown/context/index.js';
 import { useScreenDetect } from '../../../hooks/use_screen_detect.js';
 
-var ColorPickerButtons = function (_a) {
-    var restoreInitialColor = _a.restoreInitialColor;
-    var t = useTranslation()[0];
-    var toggleDropdown = useContext(DropdownContext).toggleDropdown;
-    var screenSize = useScreenDetect();
-    var onCancel = function () {
+const ColorPickerButtons = ({ restoreInitialColor }) => {
+    const [t] = useTranslation();
+    const { toggleDropdown } = useContext(DropdownContext);
+    const screenSize = useScreenDetect();
+    const onCancel = () => {
         restoreInitialColor();
         toggleDropdown === null || toggleDropdown === void 0 ? void 0 : toggleDropdown();
     };
-    var onChoose = function () {
+    const onChoose = () => {
         toggleDropdown === null || toggleDropdown === void 0 ? void 0 : toggleDropdown();
     };
-    var primaryButtonProps = {
+    const primaryButtonProps = {
         variant: screenSize === 'xs' ? undefined : 'link',
         size: screenSize === 'xs' ? 'small' : undefined
     };
-    var secondaryButtonProps = {
+    const secondaryButtonProps = {
         variant: screenSize === 'xs' ? 'outline' : 'link',
         size: screenSize === 'xs' ? 'small' : undefined,
         color: screenSize === 'xs' ? undefined : 'secondary'
     };
     return (React.createElement("div", { className: styles[cssColorPickerButtonsGroup] },
         React.createElement(ButtonsGroup, null,
-            React.createElement(Button, __assign({ as: "button" }, secondaryButtonProps, { onClick: onCancel }), t('cancel')),
-            React.createElement(Button, __assign({ as: "button" }, primaryButtonProps, { onClick: onChoose }), t('choose')))));
+            React.createElement(Button, { as: "button", ...secondaryButtonProps, onClick: onCancel }, t('cancel')),
+            React.createElement(Button, { as: "button", ...primaryButtonProps, onClick: onChoose }, t('choose')))));
 };
 
 export default ColorPickerButtons;

package/build/esm/packages/aurora/src/components/color_picker/components/buttons.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,oEAAwE;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,+BAA+B,oEAAwE;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/hue_picker.js

@@ -1,5 +1,4 @@
 import React, { useContext } from 'react';
-import { __assign } from '../../../../../../_virtual/_tslib.js';
 import styles from '../../../css/color_picker/main.module.less.js';
 import { getIndicatorPositionFromPosition } from '../../../utilities/range/range_mappings.js';
 import { ColorConverter } from '../../../utilities/colors/color_converter.js';
@@ -8,33 +7,36 @@ import { mapMouseEventToPosition, registerOnMouseEvents, mapTouchEventToPosition
 import { ColorPickerContext } from '../context.js';
 import { cssColorPickerHuePicker, cssColorPickerPointer, cssColorPickerPointerInside } from '../css_classes.js';
 
-var HuePicker = function (_a) {
-    var hueSliderRef = _a.hueSliderRef, classes = _a.classes;
-    var _b = useContext(ColorPickerContext), setColor = _b.setColor, setHueSliderPointer = _b.setHueSliderPointer, screenName = _b.screenName;
-    var onSliderEvent = function (position) {
+const HuePicker = ({ hueSliderRef, classes }) => {
+    const { setColor, setHueSliderPointer, screenName } = useContext(ColorPickerContext);
+    const onSliderEvent = (position) => {
         if (!(hueSliderRef === null || hueSliderRef === void 0 ? void 0 : hueSliderRef.current)) {
             return;
         }
-        var hue = getHueFromPosition({
+        const { hue } = getHueFromPosition({
             hueSliderRect: hueSliderRef.current.getBoundingClientRect(),
-            position: position,
-            screenName: screenName
-        }).hue;
-        var _a = getIndicatorPositionFromPosition({
+            position,
+            screenName
+        });
+        const { positionY, positionX } = getIndicatorPositionFromPosition({
             elementRect: hueSliderRef.current.getBoundingClientRect(),
-            position: position
-        }), positionY = _a.positionY, positionX = _a.positionX;
-        setColor(function (color) { return (__assign(__assign({}, color), { hue: hue, hex: ColorConverter.hsl2hex({ hue: hue, saturation: color.saturation, lightness: color.lightness }) })); });
+            position
+        });
+        setColor((color) => ({
+            ...color,
+            hue,
+            hex: ColorConverter.hsl2hex({ hue, saturation: color.saturation, lightness: color.lightness })
+        }));
         setHueSliderPointer({ top: positionY, left: positionX });
     };
-    var onSliderDown = function (event) {
+    const onSliderDown = (event) => {
         if (!(hueSliderRef === null || hueSliderRef === void 0 ? void 0 : hueSliderRef.current)) {
             return;
         }
         onSliderEvent(mapMouseEventToPosition(event));
         registerOnMouseEvents(onSliderEvent);
     };
-    var onTouchStart = function (event) {
+    const onTouchStart = (event) => {
         if (!(hueSliderRef === null || hueSliderRef === void 0 ? void 0 : hueSliderRef.current)) {
             return;
         }
@@ -42,7 +44,7 @@ var HuePicker = function (_a) {
         registerOnTouchEvents(onSliderEvent);
     };
     return (React.createElement("div", { className: styles[cssColorPickerHuePicker], ref: hueSliderRef, onMouseDown: onSliderDown, onTouchStart: onTouchStart },
-        React.createElement("div", { className: "".concat(classes.huePointer, " ").concat(styles[cssColorPickerPointer]), onDrag: onSliderEvent, onTouchStart: onTouchStart },
+        React.createElement("div", { className: `${classes.huePointer} ${styles[cssColorPickerPointer]}`, onDrag: onSliderEvent, onTouchStart: onTouchStart },
             React.createElement("div", { className: styles[cssColorPickerPointerInside] }))));
 };
 

package/build/esm/packages/aurora/src/components/color_picker/components/hue_picker.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;"}
+{"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;"}

package/build/esm/packages/aurora/src/components/color_picker/components/label.js

@@ -6,27 +6,23 @@ import { cssColorPickerInputColorPreview } from '../css_classes.js';
 import { DropdownContext } from '../../dropdown/context/index.js';
 import InputWrapper from '../../controls/components/input_wrapper.js';
 
-var useStyles = createUseStyles({
+const useStyles = createUseStyles({
     colorPreview: {
-        background: function (_a) {
-            var hex = _a.color.hex;
-            return hex;
-        }
+        background: ({ color: { hex } }) => hex
     }
 });
-var ColorPickerLabel = function (_a) {
-    var name = _a.name, isRequired = _a.isRequired, id = _a.id;
-    var _b = useContext(ColorPickerContext), setInitialColor = _b.setInitialColor, color = _b.color;
-    var isOpen = useContext(DropdownContext).isOpen;
-    var classes = useStyles({ color: color });
-    useEffect(function () {
+const ColorPickerLabel = ({ name, isRequired, id }) => {
+    const { setInitialColor, color } = useContext(ColorPickerContext);
+    const { isOpen } = useContext(DropdownContext);
+    const classes = useStyles({ color });
+    useEffect(() => {
         if (isOpen) {
             setInitialColor(color);
         }
         // eslint-disable-next-line
     }, [isOpen]);
     return (React.createElement(React.Fragment, null,
-        React.createElement(InputWrapper, { value: color === null || color === void 0 ? void 0 : color.hex, size: "small", isFocused: isOpen, preElements: React.createElement("div", { className: "".concat(classes.colorPreview, " ").concat(styles[cssColorPickerInputColorPreview]) }) }),
+        React.createElement(InputWrapper, { value: color === null || color === void 0 ? void 0 : color.hex, size: "small", isFocused: isOpen, preElements: React.createElement("div", { className: `${classes.colorPreview} ${styles[cssColorPickerInputColorPreview]}` }) }),
         React.createElement("input", { type: "hidden", id: id, name: name, value: (color === null || color === void 0 ? void 0 : color.hex) || '', "aria-required": isRequired })));
 };
 

package/build/esm/packages/aurora/src/components/color_picker/components/label.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,gCAAgC,4DAAgE;AAChG;AACA;AACA;AACA;AACA;AACA;AACA;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,gCAAgC,4DAAgE;AAChG;AACA;AACA;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/saturation_lightness_picker.js

@@ -1,30 +1,33 @@
 import React, { useContext } from 'react';
-import { __assign } from '../../../../../../_virtual/_tslib.js';
 import styles from '../../../css/color_picker/main.module.less.js';
 import { getIndicatorPositionFromPosition } from '../../../utilities/range/range_mappings.js';
 import { ColorConverter } from '../../../utilities/colors/color_converter.js';
 import { getSaturationLightnessFromPosition } from '../utilities.js';
-import { mapMouseEventToPosition, registerOnMouseEvents, mapTouchEventToPosition, registerOnTouchEvents } from '../../../utilities/events/event_registration.js';
+import { registerOnMouseEvents, mapTouchEventToPosition, registerOnTouchEvents, mapMouseEventToPosition } from '../../../utilities/events/event_registration.js';
 import { ColorPickerContext } from '../context.js';
 import { cssColorPickerSaturationLightnessPicker, cssColorPickerMask, cssColorPickerMaskWhite, cssColorPickerMaskBlack, cssColorPickerPointer, cssColorPickerPointerInside } from '../css_classes.js';
 
-var SaturationLightnessPicker = function (_a) {
-    var classes = _a.classes, saturationLightnessPanelRef = _a.saturationLightnessPanelRef;
-    var _b = useContext(ColorPickerContext), setColor = _b.setColor, setSaturationLightnessPointer = _b.setSaturationLightnessPointer;
-    var saturationLightnessPickerEvent = function (position) {
+const SaturationLightnessPicker = ({ classes, saturationLightnessPanelRef }) => {
+    const { setColor, setSaturationLightnessPointer } = useContext(ColorPickerContext);
+    const saturationLightnessPickerEvent = (position) => {
         if (!saturationLightnessPanelRef.current) {
             return;
         }
-        var elementRect = saturationLightnessPanelRef.current.getBoundingClientRect();
-        var _a = getIndicatorPositionFromPosition({ elementRect: elementRect, position: position }), positionX = _a.positionX, positionY = _a.positionY;
-        var _b = getSaturationLightnessFromPosition({ elementRect: elementRect, position: position }), lightness = _b.lightness, saturation = _b.saturation;
-        setColor(function (color) { return (__assign(__assign({}, color), { saturation: saturation, lightness: lightness, hex: ColorConverter.hsl2hex({ hue: color.hue, lightness: lightness, saturation: saturation }) })); });
+        const elementRect = saturationLightnessPanelRef.current.getBoundingClientRect();
+        const { positionX, positionY } = getIndicatorPositionFromPosition({ elementRect, position });
+        const { lightness, saturation } = getSaturationLightnessFromPosition({ elementRect, position });
+        setColor((color) => ({
+            ...color,
+            saturation,
+            lightness,
+            hex: ColorConverter.hsl2hex({ hue: color.hue, lightness, saturation })
+        }));
         setSaturationLightnessPointer({
             left: positionX,
             top: positionY
         });
     };
-    var onMouseDown = function (event) {
+    const onMouseDown = (event) => {
         event.preventDefault();
         if (!(saturationLightnessPanelRef === null || saturationLightnessPanelRef === void 0 ? void 0 : saturationLightnessPanelRef.current)) {
             return;
@@ -32,7 +35,7 @@ var SaturationLightnessPicker = function (_a) {
         saturationLightnessPickerEvent(mapMouseEventToPosition(event));
         registerOnMouseEvents(saturationLightnessPickerEvent);
     };
-    var onTouchStart = function (event) {
+    const onTouchStart = (event) => {
         event.preventDefault();
         if (!(saturationLightnessPanelRef === null || saturationLightnessPanelRef === void 0 ? void 0 : saturationLightnessPanelRef.current)) {
             return;
@@ -40,10 +43,10 @@ var SaturationLightnessPicker = function (_a) {
         saturationLightnessPickerEvent(mapTouchEventToPosition(event));
         registerOnTouchEvents(saturationLightnessPickerEvent);
     };
-    return (React.createElement("div", { className: "".concat(classes.saturationLightnessPanel, " ").concat(styles[cssColorPickerSaturationLightnessPicker]), ref: saturationLightnessPanelRef, onMouseDown: onMouseDown, onTouchStart: onTouchStart },
-        React.createElement("div", { className: "".concat(styles[cssColorPickerMask], " ").concat(styles[cssColorPickerMaskWhite]) }),
-        React.createElement("div", { className: "".concat(styles[cssColorPickerMask], " ").concat(styles[cssColorPickerMaskBlack]) }),
-        React.createElement("div", { className: "".concat(classes.saturationLightnessPointer, " ").concat(styles[cssColorPickerPointer]), onDrag: saturationLightnessPickerEvent, onTouchStart: onTouchStart },
+    return (React.createElement("div", { className: `${classes.saturationLightnessPanel} ${styles[cssColorPickerSaturationLightnessPicker]}`, ref: saturationLightnessPanelRef, onMouseDown: onMouseDown, onTouchStart: onTouchStart },
+        React.createElement("div", { className: `${styles[cssColorPickerMask]} ${styles[cssColorPickerMaskWhite]}` }),
+        React.createElement("div", { className: `${styles[cssColorPickerMask]} ${styles[cssColorPickerMaskBlack]}` }),
+        React.createElement("div", { className: `${classes.saturationLightnessPointer} ${styles[cssColorPickerPointer]}`, onDrag: saturationLightnessPickerEvent, onTouchStart: onTouchStart },
             React.createElement("div", { className: styles[cssColorPickerPointerInside] }))));
 };
 

package/build/esm/packages/aurora/src/components/color_picker/components/saturation_lightness_picker.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;"}
+{"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;"}

package/build/esm/packages/aurora/src/components/color_picker/constants.js

@@ -1,7 +1,7 @@
-var MAX_HUE_VALUE = 360;
-var MAX_LIGHTNESS_VALUE = 100;
-var MAX_SATURATION_VALUE = 100;
-var SATURATION_OFFSET = 0.00001; // To avoid package bug
+const MAX_HUE_VALUE = 360;
+const MAX_LIGHTNESS_VALUE = 100;
+const MAX_SATURATION_VALUE = 100;
+const SATURATION_OFFSET = 0.00001; // To avoid package bug
 
 export { MAX_HUE_VALUE, MAX_LIGHTNESS_VALUE, MAX_SATURATION_VALUE, SATURATION_OFFSET };
 //# sourceMappingURL=constants.js.map

package/build/esm/packages/aurora/src/components/color_picker/context.js

@@ -1,13 +1,13 @@
 import { createContext } from 'react';
 
-var ColorPickerContext = createContext({
+const ColorPickerContext = createContext({
     color: {
         hue: 0,
         saturation: 0,
         lightness: 0,
         hex: ''
     },
-    setColor: function () { },
+    setColor: () => { },
     initialColor: {
         hue: 0,
         saturation: 0,
@@ -15,11 +15,11 @@ var ColorPickerContext = createContext({
         hex: ''
     },
     screenName: '',
-    setInitialColor: function () { },
+    setInitialColor: () => { },
     hueSliderPointer: { top: 0, left: 0 },
-    setHueSliderPointer: function () { },
+    setHueSliderPointer: () => { },
     saturationLightnessPointer: { top: 0, left: 0 },
-    setSaturationLightnessPointer: function () { }
+    setSaturationLightnessPointer: () => { }
 });
 
 export { ColorPickerContext };

package/build/esm/packages/aurora/src/components/color_picker/css_classes.js

@@ -1,15 +1,15 @@
-var cssColorPicker = 'color-picker';
-var cssColorPickerInputColorPreview = "".concat(cssColorPicker, "__input-color-preview");
-var cssColorPickerButtonsGroup = "".concat(cssColorPicker, "__buttons-group");
-var cssColorPickerHuePicker = "".concat(cssColorPicker, "__hue-picker");
-var cssColorPickerPointer = "".concat(cssColorPicker, "__pointer");
-var cssColorPickerPointerInside = "".concat(cssColorPicker, "__pointer-inside");
-var cssColorPickerSaturationLightnessPicker = "".concat(cssColorPicker, "__saturation-lightness-picker");
-var cssColorPickerMask = "".concat(cssColorPicker, "__mask");
-var cssColorPickerMaskWhite = "".concat(cssColorPickerMask, "_white");
-var cssColorPickerMaskBlack = "".concat(cssColorPickerMask, "_black");
-var cssColorPickerPreviewContainer = "".concat(cssColorPicker, "__preview-container");
-var cssColorPickerPreview = "".concat(cssColorPicker, "__preview");
+const cssColorPicker = 'color-picker';
+const cssColorPickerInputColorPreview = `${cssColorPicker}__input-color-preview`;
+const cssColorPickerButtonsGroup = `${cssColorPicker}__buttons-group`;
+const cssColorPickerHuePicker = `${cssColorPicker}__hue-picker`;
+const cssColorPickerPointer = `${cssColorPicker}__pointer`;
+const cssColorPickerPointerInside = `${cssColorPicker}__pointer-inside`;
+const cssColorPickerSaturationLightnessPicker = `${cssColorPicker}__saturation-lightness-picker`;
+const cssColorPickerMask = `${cssColorPicker}__mask`;
+const cssColorPickerMaskWhite = `${cssColorPickerMask}_white`;
+const cssColorPickerMaskBlack = `${cssColorPickerMask}_black`;
+const cssColorPickerPreviewContainer = `${cssColorPicker}__preview-container`;
+const cssColorPickerPreview = `${cssColorPicker}__preview`;
 
 export { cssColorPicker, cssColorPickerButtonsGroup, cssColorPickerHuePicker, cssColorPickerInputColorPreview, cssColorPickerMask, cssColorPickerMaskBlack, cssColorPickerMaskWhite, cssColorPickerPointer, cssColorPickerPointerInside, cssColorPickerPreview, cssColorPickerPreviewContainer, cssColorPickerSaturationLightnessPicker };
 //# sourceMappingURL=css_classes.js.map