@dreamcommerce/aurora 2.26.0-1 → 2.26.0-20

package/build/cjs/packages/aurora/src/components/accordion/constants.js

@@ -0,0 +1,17 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var ACCORDION_TOGGLER_ICON_POSITION = {
+  left: 'left',
+  right: 'right'
+};
+var ACCORDION_VARIANTS = {
+  primary: 'primary',
+  secondary: 'secondary',
+  tertiary: 'tertiary'
+};
+
+exports.ACCORDION_TOGGLER_ICON_POSITION = ACCORDION_TOGGLER_ICON_POSITION;
+exports.ACCORDION_VARIANTS = ACCORDION_VARIANTS;
+//# sourceMappingURL=constants.js.map

package/build/cjs/packages/aurora/src/components/accordion/constants.js.map

@@ -0,0 +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;"}

package/build/cjs/packages/aurora/src/components/accordion/css_classes.js

@@ -5,11 +5,13 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var accordionBaseCssClass = 'accordion';
 var CSS_CLASSES = {
   accordion: accordionBaseCssClass,
-  accordionHeader: "".concat(accordionBaseCssClass, "__header"),
+  accordionToggler: "".concat(accordionBaseCssClass, "__toggler"),
+  accordionTogglerIconLeft: "".concat(accordionBaseCssClass, "__toggler-icon_left"),
   accordionTitle: "".concat(accordionBaseCssClass, "__title"),
   accordionContent: "".concat(accordionBaseCssClass, "__content"),
   accordionIconRotate180: "".concat(accordionBaseCssClass, "__icon_rotate-180"),
-  accordionSecondary: "".concat(accordionBaseCssClass, "_secondary")
+  accordionSecondary: "".concat(accordionBaseCssClass, "_secondary"),
+  accordionTertiary: "".concat(accordionBaseCssClass, "_tertiary")
 };
 
 exports.default = CSS_CLASSES;

package/build/cjs/packages/aurora/src/components/accordion/css_classes.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;"}
+{"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;"}

package/build/cjs/packages/aurora/src/components/accordion/index.js

@@ -4,13 +4,18 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../_virtual/_rollupPluginBabelHelpers.js');
+var classnames = require('classnames');
+var index = require('../stack/index.js');
 var css_classes = require('./css_classes.js');
+var constants = require('./constants.js');
 var icon_arrow_down = require('../../assets/icon_arrow_down.js');
 var main_module = require('../../css/accordion/main.module.less.js');
+var use_accordions_group_api = require('../accordions_group/hooks/use_accordions_group_api.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
 
 var Accordion = function Accordion(_ref) {
   var id = _ref.id,
@@ -19,24 +24,50 @@ var Accordion = function Accordion(_ref) {
       isOpened = _ref$isOpened === void 0 ? false : _ref$isOpened,
       _ref$isStatic = _ref.isStatic,
       isStatic = _ref$isStatic === void 0 ? false : _ref$isStatic,
-      secondary = _ref.secondary,
+      _ref$variant = _ref.variant,
+      variant = _ref$variant === void 0 ? constants.ACCORDION_VARIANTS.primary : _ref$variant,
       negativeIndentValue = _ref.negativeIndentValue,
-      children = _ref.children;
+      children = _ref.children,
+      _ref$unmountOnExit = _ref.unmountOnExit,
+      unmountOnExit = _ref$unmountOnExit === void 0 ? true : _ref$unmountOnExit,
+      _ref$toggleIcon = _ref.toggleIcon,
+      toggleIcon = _ref$toggleIcon === void 0 ? /*#__PURE__*/React__default['default'].createElement(icon_arrow_down['default'], {
+    size: "m"
+  }) : _ref$toggleIcon,
+      _ref$toggleIconPositi = _ref.toggleIconPosition,
+      toggleIconPosition = _ref$toggleIconPositi === void 0 ? constants.ACCORDION_TOGGLER_ICON_POSITION.right : _ref$toggleIconPositi;
+  var accordionsGroupApi = use_accordions_group_api.useAccordionsGroupApi();
 
-  var _useState = React.useState(isOpened),
+  var _useState = React.useState(isStatic ? true : isOpened),
       _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
       isOpen = _useState2[0],
       setIsOpen = _useState2[1];
 
+  var accordion = accordionsGroupApi === null || accordionsGroupApi === void 0 ? void 0 : accordionsGroupApi.get(id);
+  React.useEffect(function () {
+    accordionsGroupApi === null || accordionsGroupApi === void 0 || accordionsGroupApi.add(id, {
+      expanded: isOpen
+    });
+  }, [id]);
+  React.useEffect(function () {
+    if (accordion) setIsOpen(accordion.expanded);
+  }, [accordion]);
+
   var handleOnClick = function handleOnClick() {
-    setIsOpen(!isOpen);
+    setIsOpenState(!isOpen);
   };
 
-  React.useEffect(function () {
-    if (isStatic) {
-      setIsOpen(true);
+  var setIsOpenState = function setIsOpenState(newIsOpen) {
+    var accordion = accordionsGroupApi === null || accordionsGroupApi === void 0 ? void 0 : accordionsGroupApi.get(id);
+
+    if (!accordion) {
+      setIsOpen(isStatic ? true : newIsOpen);
+      return;
     }
-  }, [isStatic]);
+
+    newIsOpen ? accordionsGroupApi === null || accordionsGroupApi === void 0 ? void 0 : accordionsGroupApi.expand(id) : accordionsGroupApi === null || accordionsGroupApi === void 0 ? void 0 : accordionsGroupApi.collapse(id);
+  };
+
   var wrapperIndentStyles = {
     marginLeft: "-".concat(negativeIndentValue, "px"),
     marginRight: "-".concat(negativeIndentValue, "px")
@@ -46,24 +77,30 @@ var Accordion = function Accordion(_ref) {
     paddingRight: "".concat(negativeIndentValue, "px")
   };
   return /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "".concat(main_module['default'][css_classes['default'].accordion], " ").concat(secondary ? main_module['default'][css_classes['default'].accordionSecondary] : ''),
+    className: classnames__default['default'](main_module['default'][css_classes['default'].accordion], _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, main_module['default'][css_classes['default'].accordionSecondary], variant === constants.ACCORDION_VARIANTS.secondary), main_module['default'][css_classes['default'].accordionTertiary], variant === constants.ACCORDION_VARIANTS.tertiary)),
     style: negativeIndentValue ? wrapperIndentStyles : undefined
   }, /*#__PURE__*/React__default['default'].createElement("div", {
-    className: main_module['default'][css_classes['default'].accordionHeader],
+    className: classnames__default['default'](main_module['default'][css_classes['default'].accordionToggler], _rollupPluginBabelHelpers.defineProperty({}, main_module['default'][css_classes['default'].accordionTogglerIconLeft], toggleIconPosition === constants.ACCORDION_TOGGLER_ICON_POSITION.left)),
     onClick: !isStatic ? handleOnClick : undefined,
     "aria-expanded": isOpen,
     "aria-controls": id,
     style: negativeIndentValue ? contentIndentStyles : undefined
   }, /*#__PURE__*/React__default['default'].createElement("div", {
     className: main_module['default'][css_classes['default'].accordionTitle]
-  }, title), !isStatic && /*#__PURE__*/React__default['default'].createElement(icon_arrow_down['default'], {
-    size: "m",
+  }, title), !isStatic && /*#__PURE__*/React__default['default'].createElement(index['default'], {
+    justify: "center",
+    align: "center",
     className: "".concat(isOpen ? main_module['default'][css_classes['default'].accordionIconRotate180] : '')
-  })), isOpen && /*#__PURE__*/React__default['default'].createElement("div", {
+  }, toggleIcon)), unmountOnExit && isOpen ? /*#__PURE__*/React__default['default'].createElement("div", {
+    id: id,
+    className: main_module['default'][css_classes['default'].accordionContent],
+    style: negativeIndentValue ? contentIndentStyles : undefined
+  }, children) : null, !unmountOnExit ? /*#__PURE__*/React__default['default'].createElement("div", {
     id: id,
+    hidden: !isOpen,
     className: main_module['default'][css_classes['default'].accordionContent],
     style: negativeIndentValue ? contentIndentStyles : undefined
-  }, children));
+  }, children) : null);
 };
 
 exports.default = Accordion;

package/build/cjs/packages/aurora/src/components/accordion/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;AACA;AACA;AACA;AACA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/cjs/packages/aurora/src/components/accordions_group/components/accordions_group_toggler.js

@@ -0,0 +1,46 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
+var use_accordions_group_api = require('../hooks/use_accordions_group_api.js');
+var index = require('../../button/index.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var _excluded = ["expandedContent", "collapsedContent", "onClick"];
+var AccordionsGroupToggler = function AccordionsGroupToggler(_ref) {
+  var expandedContent = _ref.expandedContent,
+      collapsedContent = _ref.collapsedContent,
+      onClick = _ref.onClick,
+      rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+
+  var accordionsGroupApi = use_accordions_group_api.useAccordionsGroupApi();
+
+  var _useState = React.useState(null),
+      _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
+      togglerContent = _useState2[0],
+      setTogglerContent = _useState2[1];
+
+  var areAllExpanded = accordionsGroupApi === null || accordionsGroupApi === void 0 ? void 0 : accordionsGroupApi.areAllExpanded;
+  var areAllCollapsed = accordionsGroupApi === null || accordionsGroupApi === void 0 ? void 0 : accordionsGroupApi.areAllCollapsed;
+  React.useEffect(function () {
+    if (areAllExpanded) setTogglerContent(expandedContent);
+    if (areAllCollapsed) setTogglerContent(collapsedContent);
+  }, [areAllExpanded, areAllCollapsed]);
+
+  var toggleGroups = function toggleGroups(ev) {
+    accordionsGroupApi !== null && accordionsGroupApi !== void 0 && accordionsGroupApi.areAllExpanded ? accordionsGroupApi === null || accordionsGroupApi === void 0 ? void 0 : accordionsGroupApi.collapseAll() : accordionsGroupApi === null || accordionsGroupApi === void 0 ? void 0 : accordionsGroupApi.expandAll();
+    onClick === null || onClick === void 0 || onClick(ev);
+  };
+
+  return /*#__PURE__*/React__default['default'].createElement(index['default'], _rollupPluginBabelHelpers.objectSpread2({
+    onClick: toggleGroups
+  }, rest), togglerContent);
+};
+
+exports.AccordionsGroupToggler = AccordionsGroupToggler;
+//# sourceMappingURL=accordions_group_toggler.js.map

package/build/cjs/packages/aurora/src/components/accordions_group/components/accordions_group_toggler.js.map

@@ -0,0 +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;"}

package/build/cjs/packages/aurora/src/components/accordions_group/context.js

@@ -0,0 +1,24 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+
+var AccordionsGroupContext = /*#__PURE__*/React.createContext({
+  expandAll: function expandAll() {},
+  collapseAll: function collapseAll() {},
+  expand: function expand() {},
+  collapse: function collapse() {},
+  add: function add() {},
+  remove: function remove() {},
+  get: function get() {
+    return undefined;
+  },
+  toggle: function toggle() {},
+  areAllExpanded: false,
+  areAllCollapsed: false,
+  accordions: []
+});
+
+exports.AccordionsGroupContext = AccordionsGroupContext;
+//# sourceMappingURL=context.js.map

package/build/cjs/packages/aurora/src/components/accordions_group/context.js.map

@@ -0,0 +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;"}

package/build/cjs/packages/aurora/src/components/accordions_group/hooks/use_accordions_group.js

@@ -0,0 +1,122 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
+
+var useAccordionsGroup = function useAccordionsGroup() {
+  var _useState = React.useState([]),
+      _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
+      accordions = _useState2[0],
+      setAccordions = _useState2[1];
+
+  var _useState3 = React.useState(false),
+      _useState4 = _rollupPluginBabelHelpers.slicedToArray(_useState3, 2),
+      areAllExpanded = _useState4[0],
+      setAreAllExpanded = _useState4[1];
+
+  var _useState5 = React.useState(false),
+      _useState6 = _rollupPluginBabelHelpers.slicedToArray(_useState5, 2),
+      areAllCollapsed = _useState6[0],
+      setAreAllCollapsed = _useState6[1];
+
+  React.useEffect(function () {
+    setAreAllExpanded(accordions.every(function (accordion) {
+      return accordion.expanded;
+    }));
+    setAreAllCollapsed(accordions.every(function (accordion) {
+      return !accordion.expanded;
+    }));
+  }, [accordions]);
+
+  var expandAll = function expandAll() {
+    setAccordions(function (accordions) {
+      return accordions.map(function (accordion) {
+        return _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, accordion), {}, {
+          expanded: true
+        });
+      });
+    });
+  };
+
+  var collapseAll = function collapseAll() {
+    setAccordions(function (accordions) {
+      return accordions.map(function (accordion) {
+        return _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, accordion), {}, {
+          expanded: false
+        });
+      });
+    });
+  };
+
+  var expand = function expand(id) {
+    setAccordions(function (accordions) {
+      return accordions.map(function (accordion) {
+        return accordion.id === id ? _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, accordion), {}, {
+          expanded: true
+        }) : accordion;
+      });
+    });
+  };
+
+  var collapse = function collapse(id) {
+    setAccordions(function (accordions) {
+      return accordions.map(function (accordion) {
+        return accordion.id === id ? _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, accordion), {}, {
+          expanded: false
+        }) : accordion;
+      });
+    });
+  };
+
+  var add = function add(id) {
+    var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
+      expanded: false
+    };
+    setAccordions(function (accordions) {
+      return [].concat(_rollupPluginBabelHelpers.toConsumableArray(accordions), [_rollupPluginBabelHelpers.objectSpread2({
+        id: id
+      }, config)]);
+    });
+  };
+
+  var remove = function remove(id) {
+    setAccordions(accordions.filter(function (accordion) {
+      return accordion.id !== id;
+    }));
+  };
+
+  var get = function get(id) {
+    return accordions.find(function (accordion) {
+      return accordion.id === id;
+    });
+  };
+
+  var toggle = function toggle(id) {
+    var accordion = get(id);
+
+    if (!accordion) {
+      return;
+    }
+
+    accordion.expanded ? collapse(id) : expand(id);
+  };
+
+  return {
+    expandAll: expandAll,
+    collapseAll: collapseAll,
+    expand: expand,
+    collapse: collapse,
+    add: add,
+    remove: remove,
+    get: get,
+    toggle: toggle,
+    accordions: accordions,
+    areAllExpanded: areAllExpanded,
+    areAllCollapsed: areAllCollapsed
+  };
+};
+
+exports.useAccordionsGroup = useAccordionsGroup;
+//# sourceMappingURL=use_accordions_group.js.map

package/build/cjs/packages/aurora/src/components/accordions_group/hooks/use_accordions_group.js.map

@@ -0,0 +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;"}

package/build/cjs/packages/aurora/src/components/accordions_group/hooks/use_accordions_group_api.js

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var context = require('../context.js');
+
+var useAccordionsGroupApi = function useAccordionsGroupApi() {
+  return React.useContext(context.AccordionsGroupContext);
+};
+
+exports.useAccordionsGroupApi = useAccordionsGroupApi;
+//# sourceMappingURL=use_accordions_group_api.js.map

package/build/cjs/packages/aurora/src/components/accordions_group/hooks/use_accordions_group_api.js.map

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

package/build/cjs/packages/aurora/src/components/accordions_group/index.js

@@ -0,0 +1,22 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var context = require('./context.js');
+var use_accordions_group = require('./hooks/use_accordions_group.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var AccordionsGroup = function AccordionsGroup(_ref) {
+  var children = _ref.children;
+  var accordionsGroupApi = use_accordions_group.useAccordionsGroup();
+  return /*#__PURE__*/React__default['default'].createElement(context.AccordionsGroupContext.Provider, {
+    value: accordionsGroupApi
+  }, children);
+};
+
+exports.AccordionsGroup = AccordionsGroup;
+//# sourceMappingURL=index.js.map

package/build/cjs/packages/aurora/src/components/accordions_group/index.js.map

@@ -0,0 +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;"}

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

@@ -14,8 +14,10 @@ var button = {
         type = _ref$type === void 0 ? 'button' : _ref$type,
         onClick = _ref.onClick,
         testId = _ref.testId,
-        children = _ref.children;
+        children = _ref.children,
+        disabled = _ref.disabled;
     return /*#__PURE__*/React__default['default'].createElement("button", {
+      disabled: disabled,
       type: type,
       onClick: onClick,
       className: classNames,

package/build/cjs/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;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;"}

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

@@ -5,11 +5,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var useTranslation = require('../../../../../../external/react-i18next/dist/es/useTranslation.js');
 var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
+var use_screen_detect = require('../../../hooks/use_screen_detect.js');
 var index$2 = require('../../button/index.js');
 var index$1 = require('../../buttons_group/index.js');
 var css_classes = require('../css_classes.js');
 var index = require('../../dropdown/context/index.js');
-var use_screen_detect = require('../../../hooks/use_screen_detect.js');
 var main_module = require('../../../css/color_picker/main.module.less.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

package/build/cjs/packages/aurora/src/components/color_picker/use_color_picker.js

@@ -4,8 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../_virtual/_rollupPluginBabelHelpers.js');
-var constants = require('./constants.js');
 var use_screen_detect = require('../../hooks/use_screen_detect.js');
+var constants = require('./constants.js');
 
 var useColorPicker = function useColorPicker(_ref) {
   var initialColorHex = _ref.initialColorHex,

package/build/cjs/packages/aurora/src/components/controls/components/checkbox.js

@@ -4,8 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
-var classnames = require('classnames');
 var css_classes = require('../css_classes.js');
+var classnames = require('classnames');
 var main_module = require('../../../css/checkbox/main.module.less.js');
 var icon_tick = require('../../../assets/icon_tick.js');
 

package/build/cjs/packages/aurora/src/components/controls/components/checkbox_switch.js

@@ -4,8 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
-var classnames = require('classnames');
 var css_classes = require('../css_classes.js');
+var classnames = require('classnames');
 var main_module = require('../../../css/checkbox/main.module.less.js');
 var icon_tick = require('../../../assets/icon_tick.js');
 

package/build/cjs/packages/aurora/src/components/controls/components/element.js

@@ -5,8 +5,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
 var positions = require('../../../constants/positions.js');
-var classnames = require('classnames');
 var css_classes = require('../css_classes.js');
+var classnames = require('classnames');
 var main_module = require('../../../css/controls/main.module.less.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

package/build/cjs/packages/aurora/src/components/controls/components/input.js

@@ -4,11 +4,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
-var classnames = require('classnames');
 var css_classes = require('../css_classes.js');
+var classnames = require('classnames');
+var main_module$1 = require('../../../css/controls/main.module.less.js');
 var main_module = require('../../../css/input/main.module.less.js');
 var context = require('../context.js');
-var main_module$1 = require('../../../css/controls/main.module.less.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/build/cjs/packages/aurora/src/components/controls/components/input_wrapper.js

@@ -4,8 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
-var classnames = require('classnames');
 var css_classes = require('../css_classes.js');
+var classnames = require('classnames');
 var main_module = require('../../../css/input/main.module.less.js');
 var context = require('../context.js');
 

package/build/cjs/packages/aurora/src/components/controls/components/radio.js

@@ -4,8 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
-var classnames = require('classnames');
 var css_classes = require('../css_classes.js');
+var classnames = require('classnames');
 var main_module = require('../../../css/radio/main.module.less.js');
 var classNames = require('../../../utilities/styles/classNames.js');
 

package/build/cjs/packages/aurora/src/components/controls/components/textarea.js

@@ -4,8 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
-var classnames = require('classnames');
 var css_classes = require('../css_classes.js');
+var classnames = require('classnames');
 var main_module = require('../../../css/input/main.module.less.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

package/build/cjs/packages/aurora/src/components/controls/components/values_syncer.js

@@ -4,26 +4,28 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
-var classnames = require('classnames');
-var css_classes = require('../css_classes.js');
 var use_toggle = require('../../dropdown/hooks/use_toggle.js');
 var lock_closed = require('../../../assets/lock_closed.js');
 var lock_opened = require('../../../assets/lock_opened.js');
+var css_classes = require('../css_classes.js');
+var stack_constants = require('../../stack/stack_constants.js');
+var index = require('../../stack/index.js');
+var main_module = require('../../../css/controls/main.module.less.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
 
 var ValuesSyncer = function ValuesSyncer(_ref) {
   var firstControl = _ref.firstControl,
       secondControl = _ref.secondControl,
       initialFirstValue = _ref.initialFirstValue,
       initialSecondValue = _ref.initialSecondValue,
-      cssClasses = _ref.cssClasses,
+      onLock = _ref.onLock,
+      isLocked = _ref.isLocked,
       onChange = _ref.onChange;
 
-  var _useToggle = use_toggle.useToggle(false),
+  var _useToggle = use_toggle.useToggle(isLocked),
       _useToggle2 = _rollupPluginBabelHelpers.slicedToArray(_useToggle, 2),
       locked = _useToggle2[0],
       toggleLock = _useToggle2[1];
@@ -39,8 +41,23 @@ var ValuesSyncer = function ValuesSyncer(_ref) {
       setSecondControlValue = _useState4[1];
 
   React.useEffect(function () {
-    onChange === null || onChange === void 0 || onChange(locked);
-  }, [locked, onChange]);
+    onLock === null || onLock === void 0 || onLock(locked);
+
+    if (locked) {
+      setSecondControlValue(firstControlValue);
+    }
+  }, [locked, onLock, firstControlValue]);
+  React.useEffect(function () {
+    setFirstControlValue(initialFirstValue);
+    setSecondControlValue(initialSecondValue);
+  }, [initialSecondValue, initialFirstValue]);
+  React.useEffect(function () {
+    onChange === null || onChange === void 0 || onChange({
+      first: firstControlValue,
+      second: secondControlValue,
+      isLocked: locked
+    });
+  }, [firstControlValue, secondControlValue]);
 
   var setFirstControl = function setFirstControl(value) {
     setFirstControlValue(value);
@@ -58,10 +75,11 @@ var ValuesSyncer = function ValuesSyncer(_ref) {
     }
   };
 
-  return /*#__PURE__*/React__default['default'].createElement("div", {
-    className: classnames__default['default'](css_classes.valuesSyncer, cssClasses)
+  return /*#__PURE__*/React__default['default'].createElement(index['default'], {
+    spacing: 16,
+    align: stack_constants.STACK_ALIGNMENTS.end
   }, firstControl(firstControlValue, setFirstControl), /*#__PURE__*/React__default['default'].createElement("button", {
-    className: css_classes.valuesSyncerLockButton,
+    className: main_module['default'][css_classes.valuesSyncerLockButton],
     "aria-label": "Lock values",
     type: "button",
     onClick: toggleLock

package/build/cjs/packages/aurora/src/components/controls/components/values_syncer.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;"}
+{"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;"}