contentoh-components-library 21.4.102 → 21.4.104

package/dist/components/atoms/CustomIcon/index.js

@@ -1,29 +1,29 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.CustomIcon = void 0;
+
 var _styles = require("./styles");
+
 var _reactFontawesome = require("@fortawesome/react-fontawesome");
+
 var _react = _interopRequireDefault(require("react"));
+
 var _jsxRuntime = require("react/jsx-runtime");
-const CustomIcon = props => {
-  const {
-    id,
-    key,
-    className,
-    type,
-    // white | whiteS2 | pink | gray || purple | black  => (default white)
-    transparent,
-    // boolean
-    size,
-    // number ... default (13)
-    borderType,
-    // rectangle || circle (default)
-    icon // icon fontawesome
-  } = props;
+
+var CustomIcon = function CustomIcon(props) {
+  var id = props.id,
+      key = props.key,
+      className = props.className,
+      type = props.type,
+      transparent = props.transparent,
+      size = props.size,
+      borderType = props.borderType,
+      icon = props.icon;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
     children: icon ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
       id: id,
@@ -36,4 +36,5 @@ const CustomIcon = props => {
     }, key) : null
   });
 };
+
 exports.CustomIcon = CustomIcon;

package/dist/components/atoms/CustomIcon/styles.js

@@ -1,33 +1,33 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Container = void 0;
+
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
+
 var _styledComponents = _interopRequireDefault(require("styled-components"));
+
 var _variables = require("../../../global-files/variables");
+
 var _templateObject;
-const Container = exports.Container = _styledComponents.default.i(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: fit-content;\n  min-width: min-content;\n  cursor: default;\n  display: grid;\n  place-items: center;\n  font-size: ", "px;\n  border-radius: ", ";\n  padding: ", ";\n  border: ", ";\n\n  // tipos de iconos fill\n  &.fill {\n    &.white {\n      background-color: white;\n      color: #e33aa9;\n      border-color: #e33aa9;\n    }\n    &.whiteS2 {\n      background-color: white;\n      color: #7b7979;\n      border-color: #f0f0f0;\n    }\n    &.pink {\n      background-color: #e33aa9;\n      color: white;\n      border-color: #e33aa9;\n    }\n    &.gray {\n      background-color: #e8e5e5;\n      border-color: #7b7979;\n      color: #7b7979;\n    }\n    &.purple {\n      background-color: #f7f7fc;\n      color: #8a6caa;\n      border-color: #8a6caa;\n    }\n  }\n\n  // tipos de iconos transparent\n  &.transparent {\n    &.white {\n      color: white;\n      border-color: #e33aa9;\n    }\n    &.whiteS2 {\n      color: #7b7979;\n      border-color: #f0f0f0;\n    }\n    &.pink {\n      color: #e33aa9;\n      border-color: #e33aa9;\n    }\n    &.gray {\n      color: #7b7979;\n      border-color: #7b7979;\n    }\n    &.purple {\n      color: #8a6caa;\n      border-color: #8a6caa;\n    }\n    &.black {\n      color: #262626;\n      border-color: #262626;\n    }\n  }\n"])), _ref => {
-  let {
-    size
-  } = _ref;
+
+var Container = _styledComponents.default.i(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: fit-content;\n  min-width: min-content;\n  cursor: default;\n  display: grid;\n  place-items: center;\n  font-size: ", "px;\n  border-radius: ", ";\n  padding: ", ";\n  border: ", ";\n\n  // tipos de iconos fill\n  &.fill {\n    &.white {\n      background-color: white;\n      color: #e33aa9;\n      border-color: #e33aa9;\n    }\n    &.whiteS2 {\n      background-color: white;\n      color: #7b7979;\n      border-color: #f0f0f0;\n    }\n    &.pink {\n      background-color: #e33aa9;\n      color: white;\n      border-color: #e33aa9;\n    }\n    &.gray {\n      background-color: #e8e5e5;\n      border-color: #7b7979;\n      color: #7b7979;\n    }\n    &.purple {\n      background-color: #f7f7fc;\n      color: #8a6caa;\n      border-color: #8a6caa;\n    }\n  }\n\n  // tipos de iconos transparent\n  &.transparent {\n    &.white {\n      color: white;\n      border-color: #e33aa9;\n    }\n    &.whiteS2 {\n      color: #7b7979;\n      border-color: #f0f0f0;\n    }\n    &.pink {\n      color: #e33aa9;\n      border-color: #e33aa9;\n    }\n    &.gray {\n      color: #7b7979;\n      border-color: #7b7979;\n    }\n    &.purple {\n      color: #8a6caa;\n      border-color: #8a6caa;\n    }\n    &.black {\n      color: #262626;\n      border-color: #262626;\n    }\n  }\n"])), function (_ref) {
+  var size = _ref.size;
   return size ? size : "13";
-}, _ref2 => {
-  let {
-    borderType
-  } = _ref2;
+}, function (_ref2) {
+  var borderType = _ref2.borderType;
   return (borderType === null || borderType === void 0 ? void 0 : borderType.toLowerCase()) === "rectangle" ? "6px" : (borderType === null || borderType === void 0 ? void 0 : borderType.toLowerCase()) === "circle" ? "50%" : "0px";
-}, _ref3 => {
-  let {
-    borderType
-  } = _ref3;
+}, function (_ref3) {
+  var borderType = _ref3.borderType;
   return ["rectangle", "circle"].includes(borderType === null || borderType === void 0 ? void 0 : borderType.toLowerCase()) ? "5px" : "0px";
-}, _ref4 => {
-  let {
-    borderType,
-    transparent
-  } = _ref4;
+}, function (_ref4) {
+  var borderType = _ref4.borderType,
+      transparent = _ref4.transparent;
   return ["rectangle", "circle"].includes(borderType === null || borderType === void 0 ? void 0 : borderType.toLowerCase()) ? "1px solid black" : "none";
-});
+});
+
+exports.Container = Container;

package/dist/components/atoms/CustomSelectItem/CustomSelectItem.stories.js

@@ -1,19 +1,30 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.CustomSelectItemDefault = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
 var _ = require(".");
+
 var _jsxRuntime = require("react/jsx-runtime");
-var _default = exports.default = {
+
+var _default = {
   title: "Components/atoms/CustomSelectItem",
   component: _.CustomSelectItem
 };
-const Template = args => /*#__PURE__*/(0, _jsxRuntime.jsx)(_.CustomSelectItem, {
-  ...args
-});
-const CustomSelectItemDefault = exports.CustomSelectItemDefault = Template.bind({});
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_.CustomSelectItem, (0, _objectSpread2.default)({}, args));
+};
+
+var CustomSelectItemDefault = Template.bind({});
+exports.CustomSelectItemDefault = CustomSelectItemDefault;
 CustomSelectItemDefault.args = {
   option: {
     id: 0,

package/dist/components/atoms/CustomSelectItem/index.js

@@ -1,124 +1,142 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.CustomSelectItem = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
+
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/typeof"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
 var _styles = require("./styles");
+
 var _CheckBox = require("../CheckBox");
+
 var _react = require("react");
+
 var _jsxRuntime = require("react/jsx-runtime");
-const CustomSelectItem = _ref => {
-  let {
-    option,
-    activeFilters = {},
-    parameterArray,
-    globalFilters,
-    setActiveFilters,
-    setParameterArray,
-    className,
-    route = "",
-    id = ""
-  } = _ref;
-  const [showSubOptions, setShowSubOptions] = (0, _react.useState)(false);
-  const filterRoute = route;
-  const returnFilterId = object => {
-    const {
-      subOptions,
-      id
-    } = object;
+
+var CustomSelectItem = function CustomSelectItem(_ref) {
+  var option = _ref.option,
+      _ref$activeFilters = _ref.activeFilters,
+      activeFilters = _ref$activeFilters === void 0 ? {} : _ref$activeFilters,
+      parameterArray = _ref.parameterArray,
+      globalFilters = _ref.globalFilters,
+      setActiveFilters = _ref.setActiveFilters,
+      setParameterArray = _ref.setParameterArray,
+      className = _ref.className,
+      _ref$route = _ref.route,
+      route = _ref$route === void 0 ? "" : _ref$route,
+      _ref$id = _ref.id,
+      id = _ref$id === void 0 ? "" : _ref$id;
+
+  var _useState = (0, _react.useState)(false),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      showSubOptions = _useState2[0],
+      setShowSubOptions = _useState2[1];
+
+  var filterRoute = route;
+
+  var returnFilterId = function returnFilterId(object) {
+    var subOptions = object.subOptions,
+        id = object.id;
     if (subOptions) return subOptions.map(returnFilterId);else return id;
   };
-  const oneDimensionArray = arr => {
+
+  var oneDimensionArray = function oneDimensionArray(arr) {
     var array = [];
-    arr.forEach(element => {
-      if (typeof element === "object") array.push(...oneDimensionArray(element));else array.push(element);
+    arr.forEach(function (element) {
+      if ((0, _typeof2.default)(element) === "object") array.push.apply(array, (0, _toConsumableArray2.default)(oneDimensionArray(element)));else array.push(element);
     });
     return array;
   };
-  const setFilter = function (object) {
-    let newObject = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    const {
-      subOptions
-    } = object;
+
+  var setFilter = function setFilter(object) {
+    var newObject = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    var subOptions = object.subOptions;
+
     if (subOptions) {
-      subOptions.forEach(option => {
+      subOptions.forEach(function (option) {
         newObject[option.name] = setFilter(option);
       });
       return newObject;
     } else return newObject[object.name] = 1;
   };
-  const createFilter = (rout, option, filters) => {
-    const levelsArray = rout.includes("|") ? rout.split("|").reverse() : [rout];
+
+  var createFilter = function createFilter(rout, option, filters) {
+    var levelsArray = rout.includes("|") ? rout.split("|").reverse() : [rout];
+
     if (levelsArray.length === 1) {
-      return {
-        [levelsArray[0]]: setFilter(option)
-      };
+      return (0, _defineProperty2.default)({}, levelsArray[0], setFilter(option));
     } else if (levelsArray.length === 2) {
-      const newObject = {};
-      newObject[levelsArray[1]] = {
-        ...filters
-      };
-      newObject[levelsArray[1]][levelsArray[0]] = {
-        ...setFilter(option)
-      };
-      return {
-        ...newObject
-      };
+      var newObject = {};
+      newObject[levelsArray[1]] = (0, _objectSpread2.default)({}, filters);
+      newObject[levelsArray[1]][levelsArray[0]] = (0, _objectSpread2.default)({}, setFilter(option));
+      return (0, _objectSpread2.default)({}, newObject);
     } else if (levelsArray.length === 3) {
-      let newObject = globalFilters;
-      if (newObject[levelsArray[2]]) {
-        newObject[levelsArray[2]][levelsArray[1]] = {
-          ...newObject[levelsArray[2]][levelsArray[1]],
-          ...filters
-        };
+      var _newObject = globalFilters;
+
+      if (_newObject[levelsArray[2]]) {
+        _newObject[levelsArray[2]][levelsArray[1]] = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, _newObject[levelsArray[2]][levelsArray[1]]), filters);
       } else {
-        newObject = {
-          [levelsArray[2]]: {
-            [levelsArray[1]]: {
-              ...filters
-            }
-          }
-        };
+        _newObject = (0, _defineProperty2.default)({}, levelsArray[2], (0, _defineProperty2.default)({}, levelsArray[1], (0, _objectSpread2.default)({}, filters)));
       }
-      newObject[levelsArray[2]][levelsArray[1]][levelsArray[0]] = 1;
-      return {
-        ...newObject
-      };
+
+      _newObject[levelsArray[2]][levelsArray[1]][levelsArray[0]] = 1;
+      return (0, _objectSpread2.default)({}, _newObject);
     }
   };
-  const deleteFilter = rout => {
-    const levelsArray = rout.includes("|") ? rout.split("|").reverse() : [rout];
-    const newObject = {
-      ...globalFilters
-    };
+
+  var deleteFilter = function deleteFilter(rout) {
+    var levelsArray = rout.includes("|") ? rout.split("|").reverse() : [rout];
+    var newObject = (0, _objectSpread2.default)({}, globalFilters);
     if (levelsArray.length === 1) delete newObject[levelsArray[0]];else if (levelsArray.length === 2) delete newObject[levelsArray[1]][levelsArray[0]];else if (levelsArray.length === 3) delete newObject[levelsArray[2]][levelsArray[1]][levelsArray[0]];
     return newObject;
   };
-  const onChangeChk = (e, object) => {
-    let idsFilter = returnFilterId(object);
-    if (typeof idsFilter === "object") {
+
+  var onChangeChk = function onChangeChk(e, object) {
+    var idsFilter = returnFilterId(object);
+
+    if ((0, _typeof2.default)(idsFilter) === "object") {
       idsFilter = oneDimensionArray(idsFilter);
     } else {
       idsFilter = [idsFilter];
     }
-    let tempArray = parameterArray.slice();
+
+    var tempArray = parameterArray.slice();
+
     if (e.target.checked) {
-      const newFilter = createFilter(route, option, activeFilters);
-      tempArray.push(...idsFilter);
-      setActiveFilters(current => {
-        return {
-          ...current,
-          ...newFilter
-        };
+      var _tempArray;
+
+      var newFilter = createFilter(route, option, activeFilters);
+
+      (_tempArray = tempArray).push.apply(_tempArray, (0, _toConsumableArray2.default)(idsFilter));
+
+      setActiveFilters(function (current) {
+        return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, current), newFilter);
       });
     } else {
-      tempArray = tempArray.filter(element => !idsFilter.includes(element));
-      const remainFilters = deleteFilter(route, globalFilters);
-      setActiveFilters(current => remainFilters);
+      tempArray = tempArray.filter(function (element) {
+        return !idsFilter.includes(element);
+      });
+      var remainFilters = deleteFilter(route, globalFilters);
+      setActiveFilters(function (current) {
+        return remainFilters;
+      });
     }
+
     setParameterArray(tempArray);
   };
+
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     mainDivClass: className,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
@@ -128,26 +146,33 @@ const CustomSelectItem = _ref => {
         label: option.name,
         checked: activeFilters[option.name],
         defaultChecked: activeFilters[option.name],
-        onChange: e => onChangeChk(e, option)
+        onChange: function onChange(e) {
+          return onChangeChk(e, option);
+        }
       }), option.subOptions && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        onClick: () => setShowSubOptions(!showSubOptions),
+        onClick: function onClick() {
+          return setShowSubOptions(!showSubOptions);
+        },
         className: "arrow-item",
         children: "\u25C0"
       })]
     }), showSubOptions && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "sub-options",
-      children: option.subOptions.map((subOption, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomSelectItem, {
-        option: subOption,
-        id: id,
-        className: "sub-option",
-        route: "".concat(filterRoute, "|").concat(subOption.name),
-        activeFilters: activeFilters[option.name],
-        parameterArray: parameterArray,
-        globalFilters: globalFilters,
-        setActiveFilters: setActiveFilters,
-        setParameterArray: setParameterArray
-      }, index + (id ? id + "-" : "") + subOption.name))
+      children: option.subOptions.map(function (subOption, index) {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomSelectItem, {
+          option: subOption,
+          id: id,
+          className: "sub-option",
+          route: "".concat(filterRoute, "|").concat(subOption.name),
+          activeFilters: activeFilters[option.name],
+          parameterArray: parameterArray,
+          globalFilters: globalFilters,
+          setActiveFilters: setActiveFilters,
+          setParameterArray: setParameterArray
+        }, index + (id ? id + "-" : "") + subOption.name);
+      })
     })]
   });
 };
+
 exports.CustomSelectItem = CustomSelectItem;

package/dist/components/atoms/CustomSelectItem/styles.js

@@ -1,11 +1,20 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Container = void 0;
+
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
+
 var _styledComponents = _interopRequireDefault(require("styled-components"));
+
 var _templateObject;
-const Container = exports.Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  & > .", " {\n    display: flex;\n    justify-content: space-between;\n    padding: 5px;\n    flex-wrap: nowrap;\n    white-space: nowrap;\n\n    .arrow-item {\n      transform: rotate(-90deg);\n      cursor: pointer;\n      font-size: 10px;\n    }\n\n    &:hover {\n      background-color: #f0f0f0;\n    }\n\n    input {\n      & + label {\n        cursor: pointer;\n      }\n    }\n  }\n  .sub-options {\n    & > * {\n      padding-left: 15px;\n    }\n  }\n"])), props => props.mainDivClass);
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  & > .", " {\n    display: flex;\n    justify-content: space-between;\n    padding: 5px;\n    flex-wrap: nowrap;\n    white-space: nowrap;\n\n    .arrow-item {\n      transform: rotate(-90deg);\n      cursor: pointer;\n      font-size: 10px;\n    }\n\n    &:hover {\n      background-color: #f0f0f0;\n    }\n\n    input {\n      & + label {\n        cursor: pointer;\n      }\n    }\n  }\n  .sub-options {\n    & > * {\n      padding-left: 15px;\n    }\n  }\n"])), function (props) {
+  return props.mainDivClass;
+});
+
+exports.Container = Container;

package/dist/components/atoms/CustomerTypeImage/CustomerTypeImage.stories.js

@@ -1,17 +1,28 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.CustomerTypeImagesDefault = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
 var _index = require("./index");
+
 var _jsxRuntime = require("react/jsx-runtime");
-var _default = exports.default = {
+
+var _default = {
   title: "Components/atoms/CustomerTypeImages",
   component: _index.CustomerTypeImages
 };
-const Template = args => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.CustomerTypeImages, {
-  ...args
-});
-const CustomerTypeImagesDefault = exports.CustomerTypeImagesDefault = Template.bind({});
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.CustomerTypeImages, (0, _objectSpread2.default)({}, args));
+};
+
+var CustomerTypeImagesDefault = Template.bind({});
+exports.CustomerTypeImagesDefault = CustomerTypeImagesDefault;
 CustomerTypeImagesDefault.args = {};

package/dist/components/atoms/CustomerTypeImage/index.js

@@ -1,18 +1,23 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.CustomerTypeImages = void 0;
+
 var _styles = require("./styles");
+
 var _Cadena = _interopRequireDefault(require("../../../assets/images/providerAndCadena/Cadena.svg"));
+
 var _Proveedor = _interopRequireDefault(require("../../../assets/images/providerAndCadena/Proveedor.svg"));
+
 var _jsxRuntime = require("react/jsx-runtime");
-const CustomerTypeImages = _ref => {
-  let {
-    imageType = "retailer"
-  } = _ref;
+
+var CustomerTypeImages = function CustomerTypeImages(_ref) {
+  var _ref$imageType = _ref.imageType,
+      imageType = _ref$imageType === void 0 ? "retailer" : _ref$imageType;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
     imageType: imageType,
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
@@ -21,4 +26,5 @@ const CustomerTypeImages = _ref => {
     })
   }, "image-".concat(imageType));
 };
+
 exports.CustomerTypeImages = CustomerTypeImages;

package/dist/components/atoms/CustomerTypeImage/styles.js

@@ -1,16 +1,21 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Container = void 0;
+
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
+
 var _styledComponents = _interopRequireDefault(require("styled-components"));
+
 var _templateObject;
-const Container = exports.Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  background-color: transparent;\n\n  img {\n    width: ", "%;\n    margin: auto;\n  }\n  & + * {\n    margin-top: 20px;\n  }\n"])), _ref => {
-  let {
-    imageType
-  } = _ref;
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  background-color: transparent;\n\n  img {\n    width: ", "%;\n    margin: auto;\n  }\n  & + * {\n    margin-top: 20px;\n  }\n"])), function (_ref) {
+  var imageType = _ref.imageType;
   return imageType === "retailer" ? 100 : 70;
-});
+});
+
+exports.Container = Container;

package/dist/components/atoms/DropDownButton/DropDownButton.stories.js

@@ -1,12 +1,19 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.DropDownButtonGeneral = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
 var _index = require("./index");
+
 var _jsxRuntime = require("react/jsx-runtime");
-var _default = exports.default = {
+
+var _default = {
   title: "Components/atoms/DropDownButton",
   component: _index.DropDownButton,
   argTypes: {
@@ -18,10 +25,14 @@ var _default = exports.default = {
     }
   }
 };
-const Template = args => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.DropDownButton, {
-  ...args
-});
-const DropDownButtonGeneral = exports.DropDownButtonGeneral = Template.bind({});
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.DropDownButton, (0, _objectSpread2.default)({}, args));
+};
+
+var DropDownButtonGeneral = Template.bind({});
+exports.DropDownButtonGeneral = DropDownButtonGeneral;
 DropDownButtonGeneral.args = {
   active: false
 };

package/dist/components/atoms/DropDownButton/index.js

@@ -1,17 +1,20 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.DropDownButton = void 0;
+
 var _styles = require("./styles");
+
 var _dropDownArrowButton = _interopRequireDefault(require("../../../assets/images/dropDownButton/dropDownArrowButton.svg"));
+
 var _jsxRuntime = require("react/jsx-runtime");
-const DropDownButton = _ref => {
-  let {
-    active
-  } = _ref;
+
+var DropDownButton = function DropDownButton(_ref) {
+  var active = _ref.active;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
     className: active && "active",
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
@@ -20,4 +23,5 @@ const DropDownButton = _ref => {
     })
   });
 };
+
 exports.DropDownButton = DropDownButton;

package/dist/components/atoms/DropDownButton/styles.js

@@ -1,11 +1,18 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Container = void 0;
+
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
+
 var _styledComponents = _interopRequireDefault(require("styled-components"));
+
 var _templateObject;
-const Container = exports.Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  height: 22px;\n  width: 10px;\n  border-left: 1px solid #342b3f;\n  padding-left: 3px;\n\n  img {\n    width: 7px;\n    vertical-align: middle;\n  }\n\n  &.active {\n    img {\n      transform: rotate(180deg);\n    }\n  }\n"])));
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  height: 22px;\n  width: 10px;\n  border-left: 1px solid #342b3f;\n  padding-left: 3px;\n\n  img {\n    width: 7px;\n    vertical-align: middle;\n  }\n\n  &.active {\n    img {\n      transform: rotate(180deg);\n    }\n  }\n"])));
+
+exports.Container = Container;