contentoh-components-library 21.4.136 → 21.4.138

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

@@ -0,0 +1,57 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MenuProfile = void 0;
+
+var _styles = require("./styles");
+
+var _myAccount = _interopRequireDefault(require("../../../assets/images/menuProfile/myAccount.svg"));
+
+var _settings = _interopRequireDefault(require("../../../assets/images/menuProfile/settings.svg"));
+
+var _logOut = _interopRequireDefault(require("../../../assets/images/menuProfile/logOut.svg"));
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var MenuProfile = function MenuProfile(_ref) {
+  var user = _ref.user;
+  var content = [{
+    icon: _myAccount.default,
+    label: "Mi cuenta"
+  }, {
+    icon: _settings.default,
+    label: "Ajustes"
+  }, {
+    icon: _logOut.default,
+    label: "Cerrar sesión"
+  }];
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
+    id: "menu-profile",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+        children: user
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("ul", {
+      className: "overall-list",
+      children: content.map(function (item, index) {
+        return /*#__PURE__*/(0, _jsxRuntime.jsxs)("li", {
+          onClick: function onClick() {
+            console.log(item.label);
+          },
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+            src: item.icon,
+            alt: item.label
+          }), " ", /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+            children: item.label
+          })]
+        }, index);
+      })
+    })]
+  });
+};
+
+exports.MenuProfile = MenuProfile;

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

@@ -0,0 +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 _variables = require("../../../global-files/variables");
+
+var _templateObject;
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 200px;\n  height: auto;\n  border-radius: 20px;\n  background-color: ", ";\n  padding: 16px;\n  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);\n  position: absolute;\n  top: calc(100% + 5px);\n  left: 0px;\n  div {\n    background-color: ", ";\n    border-radius: 15px;\n    padding-top: 4px;\n    padding-bottom: 1px;\n    p {\n      text-align: center;\n      font-family: ", ";\n      font-style: normal;\n      font-weight: 500;\n      line-height: 20px;\n      font-size: 14px;\n      color: #ededed;\n      letter-spacing: -0.015em;\n    }\n  }\n  .overall-list {\n    margin-top: 5px;\n    margin-left: 25px;\n    list-style: none;\n    li {\n      display: flex;\n      align-items: center;\n      & + * {\n        margin-top: 8px;\n      }\n      img {\n        & + * {\n          margin-left: 10px;\n        }\n      }\n      p {\n        margin-top: 3px;\n        line-height: 14px;\n        font-size: 14px;\n        letter-spacing: -0.015em;\n        color: ", ";\n        font-family: ", ";\n        font-style: normal;\n        font-weight: normal;\n      }\n    }\n  }\n"])), _variables.GlobalColors.s2, _variables.GlobalColors.original_purpura, _variables.FontFamily.AvenirNext, _variables.GlobalColors.s4, _variables.FontFamily.AvenirNext);
+
+exports.Container = Container;

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

@@ -0,0 +1,31 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.MetricCardDefault = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+var _index = require("./index");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var _default = {
+  title: "Components/atoms/MetricCard",
+  component: _index.MetricCard
+};
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.MetricCard, (0, _objectSpread2.default)({}, args));
+};
+
+var MetricCardDefault = Template.bind({});
+exports.MetricCardDefault = MetricCardDefault;
+MetricCardDefault.args = {
+  label: "Productos Totales",
+  number: 2367
+};

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

@@ -0,0 +1,24 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MetricCard = void 0;
+
+var _styles = require("./styles");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var MetricCard = function MetricCard(_ref) {
+  var label = _ref.label,
+      number = _ref.number;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+      children: label
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+      children: number
+    })]
+  });
+};
+
+exports.MetricCard = MetricCard;

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

@@ -0,0 +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 _variables = require("../../../global-files/variables");
+
+var _templateObject;
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  padding: 10px 20px;\n  border: 1px solid ", ";\n  width: fit-content;\n  text-align: center;\n  border-radius: 10px;\n\n  p {\n    color: #000;\n    font-size: 25px;\n    font-family: ", ";\n    font-size: 25px;\n    font-feature-settings: \"pnum\", \"lnum\";\n\n    &:first-of-type {\n      color: ", ";\n      font-family: ", ";\n      font-weight: 500;\n      font-size: 13px;\n      line-height: 13px;\n    }\n\n    & + * {\n      margin-top: 3px;\n    }\n  }\n"])), _variables.GlobalColors.s3, _variables.FontFamily.Raleway_600, _variables.GlobalColors.s3, _variables.FontFamily.Raleway);
+
+exports.Container = Container;

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

@@ -0,0 +1,46 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.MetricSelectDefault = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _react = require("react");
+
+var _ = require(".");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var _default = {
+  title: "Components/atoms/MetricSelect",
+  component: _.MetricSelect
+};
+exports.default = _default;
+
+var Template = function Template(args) {
+  var _useState = (0, _react.useState)("Semana actual"),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      optionSelected = _useState2[0],
+      setSelectedOption = _useState2[1];
+
+  var onChange = function onChange(e) {
+    setSelectedOption(e.target.value);
+  };
+
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_.MetricSelect, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, args), {}, {
+    optionSelected: optionSelected,
+    onChange: onChange
+  }));
+};
+
+var MetricSelectDefault = Template.bind({});
+exports.MetricSelectDefault = MetricSelectDefault;
+MetricSelectDefault.args = {
+  options: ["12/12/12", "12/12/13", "12/12/14", "12/12/15", "12/12/16", "12/12/17", "12/12/18", "12/12/19", "12/12/20", "12/12/21", "12/12/22"]
+};

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

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MetricSelect = void 0;
+
+var _styles = require("./styles");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var MetricSelect = function MetricSelect(_ref) {
+  var options = _ref.options,
+      optionSelected = _ref.optionSelected,
+      onChange = _ref.onChange,
+      label = _ref.label,
+      className = _ref.className;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
+    className: className,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("select", {
+      value: optionSelected,
+      onChange: onChange,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("option", {
+        value: "",
+        disabled: true,
+        children: label
+      }), options === null || options === void 0 ? void 0 : options.map(function (option) {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)("option", {
+          value: option.id,
+          children: option.name
+        }, option.name);
+      })]
+    })
+  });
+};
+
+exports.MetricSelect = MetricSelect;

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

@@ -0,0 +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 _variables = require("../../../global-files/variables");
+
+var _templateObject;
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  background-color: ", ";\n  width: fit-content;\n  display: block;\n  padding-right: 10px;\n  border-radius: 5px;\n\n  select {\n    color: ", ";\n    outline: none;\n    padding: 10px;\n    background-color: transparent;\n    border: none;\n    option:first-of-type {\n    }\n  }\n"])), _variables.GlobalColors.s2, _variables.GlobalColors.s4);
+
+exports.Container = Container;

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

@@ -0,0 +1,303 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.MultiselectDefault = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+var _index = require("./index");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var _default = {
+  title: "Components/atoms/Multiselect",
+  component: _index.Multiselect,
+  argTypes: {}
+};
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Multiselect, (0, _objectSpread2.default)({}, args));
+};
+
+var MultiselectDefault = Template.bind({});
+exports.MultiselectDefault = MultiselectDefault;
+MultiselectDefault.args = {
+  token: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiIxZmFjNjY2Ny1hMDMzLTQ1NjAtOWU5ZC01MTQwMDc2MmI2MWYiLCJjb2duaXRvOmdyb3VwcyI6WyJ1c3VhcmlvX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwicGhvbmVfbnVtYmVyX3ZlcmlmaWVkIjpmYWxzZSwiY29nbml0bzp1c2VybmFtZSI6IjFmYWM2NjY3LWEwMzMtNDU2MC05ZTlkLTUxNDAwNzYyYjYxZiIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiI1YjFkNTAxMS1mZjYxLTQ5ZDUtYjQ1Mi05MWY4YWFjMzc2NjciLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTcwNDI5NjI1MywibmFtZSI6IlJhZGlvc2NoYWNrIE9uYm9hcmRpbmciLCJwaG9uZV9udW1iZXIiOiIrNTIxMjM0NTY3ODk4IiwiZXhwIjoxNzA0Mjk5ODUzLCJpYXQiOjE3MDQyOTYyNTMsImVtYWlsIjoicmFkaW9zaGFja2Ryb3BzaGlwQGFsbGZyZWVtYWlsLm5ldCJ9.jxuawcG-ktvnugT2_bJnHbj6JFn5OEY5ehBxI5mQNVkY92CAvzVud5LLMTfhis7FtctJGWY49-iP2IQJQZM-D7nmySieEyIlgl0jeZsmEFUIpXF5y6IjGVdVpM5I7BKwAJeZbk80tgz1FHEJO_U1RKlXc88roNJK9ZZRHXO795Ilk4DH1wN1HPPtmSSBF7kAUSpolWcywNyg2o-7hUfmxu8UDJ3gYaOq2IkKjD2efQkw7PwBIzCobGYQfoWAo8QaQo-lbxh5SGcC33Qtu-T8Abk-Cm8AGCkKyDiX5ml4FbPnsCf-ND_1-lPWOY6z0n1YPf8ow32l0Aa0eOhdphsnPg",
+  showSearchBar: true,
+  arrayData: [{
+    "idUser": 380,
+    "userName": "Flujo Dos",
+    "userEmail": "cadenaradioshackflujouno@allfreemail.net",
+    "groups": [{
+      "groupId": 60,
+      "groupName": "Compras",
+      "userContentGroup": 1
+    }, {
+      "groupId": 65,
+      "groupName": "Jefe Comercial",
+      "userContentGroup": 0
+    }, {
+      "groupId": 66,
+      "groupName": "Planogramas",
+      "userContentGroup": 1
+    }, {
+      "groupId": 67,
+      "groupName": "Impuestos",
+      "userContentGroup": 0
+    }, {
+      "groupId": 68,
+      "groupName": "eCommerce",
+      "userContentGroup": 0
+    }, {
+      "groupId": 69,
+      "groupName": "Datos Maestros",
+      "userContentGroup": 0
+    }]
+  }, {
+    "idUser": 381,
+    "userName": "Flujo Tres",
+    "userEmail": "cadenaradioshackflujodos@allfreemail.net",
+    "groups": [{
+      "groupId": "Sin id",
+      "groupName": "No tiene grupo asignado",
+      "userContentGroup": 0
+    }, {
+      "groupId": 60,
+      "groupName": "Compras",
+      "userContentGroup": 0
+    }, {
+      "groupId": 65,
+      "groupName": "Jefe Comercial",
+      "userContentGroup": 0
+    }, {
+      "groupId": 66,
+      "groupName": "Planogramas",
+      "userContentGroup": 0
+    }, {
+      "groupId": 67,
+      "groupName": "Impuestos",
+      "userContentGroup": 0
+    }, {
+      "groupId": 68,
+      "groupName": "eCommerce",
+      "userContentGroup": 0
+    }, {
+      "groupId": 69,
+      "groupName": "Datos Maestros",
+      "userContentGroup": 0
+    }]
+  }, {
+    "idUser": 385,
+    "userName": "Flujo Cuatro",
+    "userEmail": "cadenaradioshackflujotres@AllFreeMail.net",
+    "groups": [{
+      "groupId": "Sin id",
+      "groupName": "No tiene grupo asignado",
+      "userContentGroup": 0
+    }, {
+      "groupId": 60,
+      "groupName": "Compras",
+      "userContentGroup": 0
+    }, {
+      "groupId": 65,
+      "groupName": "Jefe Comercial",
+      "userContentGroup": 0
+    }, {
+      "groupId": 66,
+      "groupName": "Planogramas",
+      "userContentGroup": 0
+    }, {
+      "groupId": 67,
+      "groupName": "Impuestos",
+      "userContentGroup": 0
+    }, {
+      "groupId": 68,
+      "groupName": "eCommerce",
+      "userContentGroup": 0
+    }, {
+      "groupId": 69,
+      "groupName": "Datos Maestros",
+      "userContentGroup": 0
+    }]
+  }, {
+    "idUser": 387,
+    "userName": "Compras",
+    "userEmail": "comprasradioshack@allfreemail.net",
+    "groups": [{
+      "groupId": 60,
+      "groupName": "Compras",
+      "userContentGroup": 1
+    }, {
+      "groupId": 65,
+      "groupName": "Jefe Comercial",
+      "userContentGroup": 0
+    }, {
+      "groupId": 66,
+      "groupName": "Planogramas",
+      "userContentGroup": 0
+    }, {
+      "groupId": 67,
+      "groupName": "Impuestos",
+      "userContentGroup": 0
+    }, {
+      "groupId": 68,
+      "groupName": "eCommerce",
+      "userContentGroup": 0
+    }, {
+      "groupId": 69,
+      "groupName": "Datos Maestros",
+      "userContentGroup": 0
+    }]
+  }, {
+    "idUser": 388,
+    "userName": "Jefe",
+    "userEmail": "jefecomercial@allfreemail.net",
+    "groups": [{
+      "groupId": 65,
+      "groupName": "Jefe Comercial",
+      "userContentGroup": 1
+    }, {
+      "groupId": 60,
+      "groupName": "Compras",
+      "userContentGroup": 0
+    }, {
+      "groupId": 66,
+      "groupName": "Planogramas",
+      "userContentGroup": 0
+    }, {
+      "groupId": 67,
+      "groupName": "Impuestos",
+      "userContentGroup": 0
+    }, {
+      "groupId": 68,
+      "groupName": "eCommerce",
+      "userContentGroup": 0
+    }, {
+      "groupId": 69,
+      "groupName": "Datos Maestros",
+      "userContentGroup": 0
+    }]
+  }, {
+    "idUser": 389,
+    "userName": "Planogramas",
+    "userEmail": "planogramas@allfreemail.net",
+    "groups": [{
+      "groupId": 66,
+      "groupName": "Planogramas",
+      "userContentGroup": 1
+    }, {
+      "groupId": 60,
+      "groupName": "Compras",
+      "userContentGroup": 0
+    }, {
+      "groupId": 65,
+      "groupName": "Jefe Comercial",
+      "userContentGroup": 0
+    }, {
+      "groupId": 67,
+      "groupName": "Impuestos",
+      "userContentGroup": 0
+    }, {
+      "groupId": 68,
+      "groupName": "eCommerce",
+      "userContentGroup": 0
+    }, {
+      "groupId": 69,
+      "groupName": "Datos Maestros",
+      "userContentGroup": 0
+    }]
+  }, {
+    "idUser": 390,
+    "userName": "Impuestos",
+    "userEmail": "impuestos@allfreemail.net",
+    "groups": [{
+      "groupId": 67,
+      "groupName": "Impuestos",
+      "userContentGroup": 1
+    }, {
+      "groupId": 60,
+      "groupName": "Compras",
+      "userContentGroup": 0
+    }, {
+      "groupId": 65,
+      "groupName": "Jefe Comercial",
+      "userContentGroup": 0
+    }, {
+      "groupId": 66,
+      "groupName": "Planogramas",
+      "userContentGroup": 0
+    }, {
+      "groupId": 68,
+      "groupName": "eCommerce",
+      "userContentGroup": 0
+    }, {
+      "groupId": 69,
+      "groupName": "Datos Maestros",
+      "userContentGroup": 0
+    }]
+  }, {
+    "idUser": 391,
+    "userName": "Ecommerce",
+    "userEmail": "ecommerce@allfreemail.net",
+    "groups": [{
+      "groupId": 68,
+      "groupName": "eCommerce",
+      "userContentGroup": 1
+    }, {
+      "groupId": 60,
+      "groupName": "Compras",
+      "userContentGroup": 0
+    }, {
+      "groupId": 65,
+      "groupName": "Jefe Comercial",
+      "userContentGroup": 0
+    }, {
+      "groupId": 66,
+      "groupName": "Planogramas",
+      "userContentGroup": 0
+    }, {
+      "groupId": 67,
+      "groupName": "Impuestos",
+      "userContentGroup": 0
+    }, {
+      "groupId": 69,
+      "groupName": "Datos Maestros",
+      "userContentGroup": 0
+    }]
+  }, {
+    "idUser": 392,
+    "userName": "Datos",
+    "userEmail": "datosmaestros@allfreemail.net",
+    "groups": [{
+      "groupId": 69,
+      "groupName": "Datos Maestros",
+      "userContentGroup": 1
+    }, {
+      "groupId": 60,
+      "groupName": "Compras",
+      "userContentGroup": 0
+    }, {
+      "groupId": 65,
+      "groupName": "Jefe Comercial",
+      "userContentGroup": 0
+    }, {
+      "groupId": 66,
+      "groupName": "Planogramas",
+      "userContentGroup": 0
+    }, {
+      "groupId": 67,
+      "groupName": "Impuestos",
+      "userContentGroup": 0
+    }, {
+      "groupId": 68,
+      "groupName": "eCommerce",
+      "userContentGroup": 0
+    }]
+  }],
+  userId: 380
+};