contentoh-components-library 21.4.102 → 21.4.104

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

@@ -1,70 +1,111 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.InputFormatter = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
 var _reactQuill = _interopRequireDefault(require("react-quill"));
+
 require("react-quill/dist/quill.snow.css");
+
 var _react = require("react");
+
 var _styles = require("./styles");
+
 var _jsxRuntime = require("react/jsx-runtime");
-const InputFormatter = _ref => {
-  let {
-    mainValue = "",
-    inputId,
-    articleId,
-    updatedDescriptions,
-    setUpdatedDescriptions,
-    isRequired,
-    maxChar
-  } = _ref;
-  const [inputValue, setInputValue] = (0, _react.useState)(mainValue);
-  const [selection, setSelection] = (0, _react.useState)(false);
-  const [position, setPosition] = (0, _react.useState)({
+
+var InputFormatter = function InputFormatter(_ref) {
+  var _ref$mainValue = _ref.mainValue,
+      mainValue = _ref$mainValue === void 0 ? "" : _ref$mainValue,
+      inputId = _ref.inputId,
+      articleId = _ref.articleId,
+      updatedDescriptions = _ref.updatedDescriptions,
+      setUpdatedDescriptions = _ref.setUpdatedDescriptions,
+      isRequired = _ref.isRequired,
+      maxChar = _ref.maxChar;
+
+  var _useState = (0, _react.useState)(mainValue),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      inputValue = _useState2[0],
+      setInputValue = _useState2[1];
+
+  var _useState3 = (0, _react.useState)(false),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+      selection = _useState4[0],
+      setSelection = _useState4[1];
+
+  var _useState5 = (0, _react.useState)({
     left: 0,
     top: 0
-  });
-  const [charsCounter, setCharsCounter] = (0, _react.useState)(0);
-  const [quillState, setQuillState] = (0, _react.useState)({});
-  const maxLength = maxChar ? maxChar : 999;
-  const getValue = value => {
-    let temp = value.replace(/\n/gm, "<br>").replace(/\&nbsp;/gm, " ").replace(/\&amp;/gm, "&");
+  }),
+      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+      position = _useState6[0],
+      setPosition = _useState6[1];
+
+  var _useState7 = (0, _react.useState)(0),
+      _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+      charsCounter = _useState8[0],
+      setCharsCounter = _useState8[1];
+
+  var _useState9 = (0, _react.useState)({}),
+      _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
+      quillState = _useState10[0],
+      setQuillState = _useState10[1];
+
+  var maxLength = maxChar ? maxChar : 999;
+
+  var getValue = function getValue(value) {
+    var temp = value.replace(/\n/gm, "<br>").replace(/\&nbsp;/gm, " ").replace(/\&amp;/gm, "&");
     return temp;
-  };
+  }; //const quillRef = useRef();
 
-  //const quillRef = useRef();
-  const setQuill = ref => {
+
+  var setQuill = function setQuill(ref) {
     if (!ref || ref === null) return;
     if (typeof ref.getEditor !== "function") return;
     setQuillState(ref.getEditor());
   };
-  const valueFormater = value => {
+
+  var valueFormater = function valueFormater(value) {
     return value.replace(/<\/p><p>/gm, "\n").replace(/<\/?br>|<\/?p>/gm, "").replace(/\&nbsp;/gm, " ").replace(/\&amp;/gm, "&");
   };
-  const onChange = (valueInput, h) => {
-    let value = "";
+
+  var _onChange = function onChange(valueInput, h) {
+    var value = "";
+
     try {
       if (h.getLength() - 1 <= maxLength) {
-        let unformattedText = valueInput.replace(/<li.*?>/gm, "   - ").replace(/<\/li>/gm, "\n").replace(/<\/p><p>/gm, "\n").replaceAll(/<\/?(?!\/?strong).*?>/gm, "").replace(/\&nbsp;/gm, " ").replace(/\&amp;/gm, "&");
+        var unformattedText = valueInput.replace(/<li.*?>/gm, "   - ").replace(/<\/li>/gm, "\n").replace(/<\/p><p>/gm, "\n").replaceAll(/<\/?(?!\/?strong).*?>/gm, "").replace(/\&nbsp;/gm, " ").replace(/\&amp;/gm, "&");
         setInputValue(valueInput);
         value = unformattedText;
       } else {
         quillState.deleteText(maxLength, quillState.getLength());
-        setInputValue(val => val = quillState.getText());
+        setInputValue(function (val) {
+          return val = quillState.getText();
+        });
         value = quillState.getText();
       }
     } catch (error) {
       console.log(error);
     }
+
     setCharsCounter(h.getLength() - 1);
     value = valueFormater(value);
+
     if (updatedDescriptions) {
-      let idInput = inputId;
-      let dataSave = updatedDescriptions === null || updatedDescriptions === void 0 ? void 0 : updatedDescriptions.slice();
+      var idInput = inputId;
+      var dataSave = updatedDescriptions === null || updatedDescriptions === void 0 ? void 0 : updatedDescriptions.slice();
+
       if ((dataSave === null || dataSave === void 0 ? void 0 : dataSave.length) > 0) {
-        const index = dataSave.findIndex(e => e.attributeId === idInput);
+        var index = dataSave.findIndex(function (e) {
+          return e.attributeId === idInput;
+        });
+
         if (index !== -1) {
           if (value !== mainValue) dataSave[index].value = value;else dataSave.splice(index, 1);
         } else {
@@ -83,13 +124,16 @@ const InputFormatter = _ref => {
           });
         }
       }
+
       setUpdatedDescriptions(dataSave);
     }
   };
-  const getSelection = (range, a, b) => {
+
+  var getSelection = function getSelection(range, a, b) {
     //getBounds(index,length)
-    const selected = b.getSelection();
-    const bounds = b.getBounds((selected === null || selected === void 0 ? void 0 : selected.index) || 0, (selected === null || selected === void 0 ? void 0 : selected.length) || 0);
+    var selected = b.getSelection();
+    var bounds = b.getBounds((selected === null || selected === void 0 ? void 0 : selected.index) || 0, (selected === null || selected === void 0 ? void 0 : selected.length) || 0);
+
     if (a === "user") {
       setPosition({
         left: bounds.left,
@@ -98,31 +142,38 @@ const InputFormatter = _ref => {
       setSelection((selected === null || selected === void 0 ? void 0 : selected.length) > 0);
     }
   };
+
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     isRequired: isRequired && (inputValue.replace(/<.*?>/gm, "").length === 0 || !inputValue),
     selection: selection,
     position: position,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactQuill.default, {
       id: inputId + "",
-      ref: el => setQuill(el),
-      defaultValue: getValue(inputValue)
-      //disabled={!props.enableInputs}
+      ref: function ref(el) {
+        return setQuill(el);
+      },
+      defaultValue: getValue(inputValue) //disabled={!props.enableInputs}
       ,
       modules: {
         toolbar: ["bold"]
       },
-      onKeyPress: e => {
+      onKeyPress: function onKeyPress(e) {
         if (charsCounter >= maxLength && e.key !== "Backspace") {
           e.preventDefault();
         }
       },
-      onKeyDown: e => {
-        let keysArray = ["Backspace", "Meta", "ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown"];
-        if (charsCounter >= maxLength && keysArray.every(key => e.key !== key)) {
+      onKeyDown: function onKeyDown(e) {
+        var keysArray = ["Backspace", "Meta", "ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown"];
+
+        if (charsCounter >= maxLength && keysArray.every(function (key) {
+          return e.key !== key;
+        })) {
           e.preventDefault();
         }
       },
-      onChange: (valueInput, user, range, h) => onChange(valueInput, h),
+      onChange: function onChange(valueInput, user, range, h) {
+        return _onChange(valueInput, h);
+      },
       onChangeSelection: getSelection
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("p", {
       className: "description-limit",
@@ -130,4 +181,5 @@ const InputFormatter = _ref => {
     })]
   });
 };
+
 exports.InputFormatter = InputFormatter;

package/dist/components/atoms/InputFormatter/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.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .quill {\n    background-color: ", ";\n    border: 1px solid\n      ", ";\n    position: relative;\n    border-radius: 5px;\n\n    .ql-toolbar {\n      background-color: ", ";\n      position: absolute;\n      z-index: 10;\n      border: 1px solid ", ";\n      width: 45px;\n      height: 45px;\n      border-radius: 4px;\n      visibility: ", ";\n      top: ", "px;\n      left: ", "px;\n    }\n\n    .ql-container {\n      border: none;\n      font-family: ", ";\n      color: ", ";\n      strong {\n        font-family: ", ";\n      }\n\n      .ql-editor{\n        padding: 8px 10px;\n      }\n    }\n  }\n  .description-limit {\n    font-size: 12px;\n    font-family: ", ";\n    color: ", ";\n    text-align: right;\n    margin-top: 5px;\n  }\n"])), _variables.GlobalColors.white, _ref => {
-  let {
-    focus,
-    isRequired
-  } = _ref;
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .quill {\n    background-color: ", ";\n    border: 1px solid\n      ", ";\n    position: relative;\n    border-radius: 5px;\n\n    .ql-toolbar {\n      background-color: ", ";\n      position: absolute;\n      z-index: 10;\n      border: 1px solid ", ";\n      width: 45px;\n      height: 45px;\n      border-radius: 4px;\n      visibility: ", ";\n      top: ", "px;\n      left: ", "px;\n    }\n\n    .ql-container {\n      border: none;\n      font-family: ", ";\n      color: ", ";\n      strong {\n        font-family: ", ";\n      }\n\n      .ql-editor{\n        padding: 8px 10px;\n      }\n    }\n  }\n  .description-limit {\n    font-size: 12px;\n    font-family: ", ";\n    color: ", ";\n    text-align: right;\n    margin-top: 5px;\n  }\n"])), _variables.GlobalColors.white, function (_ref) {
+  var focus = _ref.focus,
+      isRequired = _ref.isRequired;
   return focus ? _variables.GlobalColors.magenta_s2 : isRequired ? "red" : _variables.GlobalColors.gray_light;
-}, _variables.GlobalColors.s2, _variables.GlobalColors.gray_light, _ref2 => {
-  let {
-    selection
-  } = _ref2;
+}, _variables.GlobalColors.s2, _variables.GlobalColors.gray_light, function (_ref2) {
+  var selection = _ref2.selection;
   return selection ? "visible" : "hidden";
-}, _ref3 => {
-  let {
-    position
-  } = _ref3;
+}, function (_ref3) {
+  var position = _ref3.position;
   return position.top;
-}, _ref4 => {
-  let {
-    position
-  } = _ref4;
+}, function (_ref4) {
+  var position = _ref4.position;
   return position.left;
-}, _variables.FontFamily.AvenirNext, _variables.GlobalColors.deep_gray, _variables.FontFamily.Raleway_900, _variables.FontFamily.AvenirNext, _variables.GlobalColors.deep_gray);
+}, _variables.FontFamily.AvenirNext, _variables.GlobalColors.deep_gray, _variables.FontFamily.Raleway_900, _variables.FontFamily.AvenirNext, _variables.GlobalColors.deep_gray);
+
+exports.Container = Container;

package/dist/components/atoms/InputFormatterv2/Wysiwyg.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.DefaultInputFormatterv2 = 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/InputFormatterv2",
   component: _index.InputFormatterv2
 };
-const Template = args => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.InputFormatterv2, {
-  ...args
-});
-const DefaultInputFormatterv2 = exports.DefaultInputFormatterv2 = Template.bind({});
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.InputFormatterv2, (0, _objectSpread2.default)({}, args));
+};
+
+var DefaultInputFormatterv2 = Template.bind({});
+exports.DefaultInputFormatterv2 = DefaultInputFormatterv2;
 DefaultInputFormatterv2.args = {
   text: "hola mundo"
 };

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

@@ -1,70 +1,111 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.InputFormatterv2 = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
 var _reactQuill = _interopRequireDefault(require("react-quill"));
+
 require("react-quill/dist/quill.snow.css");
+
 var _react = require("react");
+
 var _styles = require("./styles");
+
 var _jsxRuntime = require("react/jsx-runtime");
-const InputFormatterv2 = _ref => {
-  let {
-    mainValue = "",
-    inputId,
-    articleId,
-    updatedDescriptions,
-    setUpdatedDescriptions,
-    isRequired,
-    maxChar
-  } = _ref;
-  const [inputValue, setInputValue] = (0, _react.useState)(mainValue);
-  const [selection, setSelection] = (0, _react.useState)(false);
-  const [position, setPosition] = (0, _react.useState)({
+
+var InputFormatterv2 = function InputFormatterv2(_ref) {
+  var _ref$mainValue = _ref.mainValue,
+      mainValue = _ref$mainValue === void 0 ? "" : _ref$mainValue,
+      inputId = _ref.inputId,
+      articleId = _ref.articleId,
+      updatedDescriptions = _ref.updatedDescriptions,
+      setUpdatedDescriptions = _ref.setUpdatedDescriptions,
+      isRequired = _ref.isRequired,
+      maxChar = _ref.maxChar;
+
+  var _useState = (0, _react.useState)(mainValue),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      inputValue = _useState2[0],
+      setInputValue = _useState2[1];
+
+  var _useState3 = (0, _react.useState)(false),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+      selection = _useState4[0],
+      setSelection = _useState4[1];
+
+  var _useState5 = (0, _react.useState)({
     left: 0,
     top: 0
-  });
-  const [charsCounter, setCharsCounter] = (0, _react.useState)(0);
-  const [quillState, setQuillState] = (0, _react.useState)({});
-  const maxLength = maxChar ? maxChar : 999;
-  const getValue = value => {
-    let temp = value.replace(/\n/gm, "<br>").replace(/\&nbsp;/gm, " ").replace(/\&amp;/gm, "&");
+  }),
+      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+      position = _useState6[0],
+      setPosition = _useState6[1];
+
+  var _useState7 = (0, _react.useState)(0),
+      _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+      charsCounter = _useState8[0],
+      setCharsCounter = _useState8[1];
+
+  var _useState9 = (0, _react.useState)({}),
+      _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
+      quillState = _useState10[0],
+      setQuillState = _useState10[1];
+
+  var maxLength = maxChar ? maxChar : 999;
+
+  var getValue = function getValue(value) {
+    var temp = value.replace(/\n/gm, "<br>").replace(/\&nbsp;/gm, " ").replace(/\&amp;/gm, "&");
     return temp;
-  };
+  }; //const quillRef = useRef();
 
-  //const quillRef = useRef();
-  const setQuill = ref => {
+
+  var setQuill = function setQuill(ref) {
     if (!ref || ref === null) return;
     if (typeof ref.getEditor !== "function") return;
     setQuillState(ref.getEditor());
   };
-  const valueFormater = value => {
+
+  var valueFormater = function valueFormater(value) {
     return value.replace(/<\/p><p>/gm, "\n").replace(/<\/?br>|<\/?p>/gm, "").replace(/\&nbsp;/gm, " ").replace(/\&amp;/gm, "&");
   };
-  const onChange = (valueInput, h) => {
-    let value = "";
+
+  var _onChange = function onChange(valueInput, h) {
+    var value = "";
+
     try {
       if (h.getLength() - 1 <= maxLength) {
-        let unformattedText = valueInput.replace(/<li.*?>/gm, "   - ").replace(/<\/li>/gm, "\n").replace(/<\/p><p>/gm, "\n").replaceAll(/<\/?(?!\/?strong).*?>/gm, "").replace(/\&nbsp;/gm, " ").replace(/\&amp;/gm, "&");
+        var unformattedText = valueInput.replace(/<li.*?>/gm, "   - ").replace(/<\/li>/gm, "\n").replace(/<\/p><p>/gm, "\n").replaceAll(/<\/?(?!\/?strong).*?>/gm, "").replace(/\&nbsp;/gm, " ").replace(/\&amp;/gm, "&");
         setInputValue(valueInput);
         value = unformattedText;
       } else {
         quillState.deleteText(maxLength, quillState.getLength());
-        setInputValue(val => val = quillState.getText());
+        setInputValue(function (val) {
+          return val = quillState.getText();
+        });
         value = quillState.getText();
       }
     } catch (error) {
       console.log(error);
     }
+
     setCharsCounter(h.getLength() - 1);
     value = valueFormater(value);
+
     if (updatedDescriptions) {
-      let idInput = inputId;
-      let dataSave = updatedDescriptions === null || updatedDescriptions === void 0 ? void 0 : updatedDescriptions.slice();
+      var idInput = inputId;
+      var dataSave = updatedDescriptions === null || updatedDescriptions === void 0 ? void 0 : updatedDescriptions.slice();
+
       if ((dataSave === null || dataSave === void 0 ? void 0 : dataSave.length) > 0) {
-        const index = dataSave.findIndex(e => e.attributeId === idInput);
+        var index = dataSave.findIndex(function (e) {
+          return e.attributeId === idInput;
+        });
+
         if (index !== -1) {
           if (value !== mainValue) dataSave[index].value = value;else dataSave.splice(index, 1);
         } else {
@@ -83,13 +124,16 @@ const InputFormatterv2 = _ref => {
           });
         }
       }
+
       setUpdatedDescriptions(dataSave);
     }
   };
-  const getSelection = (range, a, b) => {
+
+  var getSelection = function getSelection(range, a, b) {
     //getBounds(index,length)
-    const selected = b.getSelection();
-    const bounds = b.getBounds((selected === null || selected === void 0 ? void 0 : selected.index) || 0, (selected === null || selected === void 0 ? void 0 : selected.length) || 0);
+    var selected = b.getSelection();
+    var bounds = b.getBounds((selected === null || selected === void 0 ? void 0 : selected.index) || 0, (selected === null || selected === void 0 ? void 0 : selected.length) || 0);
+
     if (a === "user") {
       setPosition({
         left: bounds.left,
@@ -98,33 +142,41 @@ const InputFormatterv2 = _ref => {
       setSelection((selected === null || selected === void 0 ? void 0 : selected.length) > 0);
     }
   };
+
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
     isRequired: isRequired && (inputValue.replace(/<.*?>/gm, "").length === 0 || !inputValue),
     selection: selection,
     position: position,
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactQuill.default, {
       id: inputId + "",
-      ref: el => setQuill(el),
-      defaultValue: getValue(inputValue)
-      //disabled={!props.enableInputs}
+      ref: function ref(el) {
+        return setQuill(el);
+      },
+      defaultValue: getValue(inputValue) //disabled={!props.enableInputs}
       ,
       modules: {
         toolbar: ["bold"]
       },
-      onKeyPress: e => {
+      onKeyPress: function onKeyPress(e) {
         if (charsCounter >= maxLength && e.key !== "Backspace") {
           e.preventDefault();
         }
       },
-      onKeyDown: e => {
-        let keysArray = ["Backspace", "Meta", "ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown"];
-        if (charsCounter >= maxLength && keysArray.every(key => e.key !== key)) {
+      onKeyDown: function onKeyDown(e) {
+        var keysArray = ["Backspace", "Meta", "ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown"];
+
+        if (charsCounter >= maxLength && keysArray.every(function (key) {
+          return e.key !== key;
+        })) {
           e.preventDefault();
         }
       },
-      onChange: (valueInput, user, range, h) => onChange(valueInput, h),
+      onChange: function onChange(valueInput, user, range, h) {
+        return _onChange(valueInput, h);
+      },
       onChangeSelection: getSelection
     })
   });
 };
+
 exports.InputFormatterv2 = InputFormatterv2;

package/dist/components/atoms/InputFormatterv2/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.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .quill {\n    background-color: ", ";\n    border: 1px solid\n      ", ";\n    position: relative;\n    border-radius: 5px;\n\n    .ql-toolbar {\n      background-color: ", ";\n      position: absolute;\n      z-index: 10;\n      border: 1px solid ", ";\n      width: 45px;\n      height: 45px;\n      border-radius: 4px;\n      visibility: ", ";\n      top: ", "px;\n      left: ", "px;\n    }\n\n    .ql-container {\n      border: none;\n      font-family: ", ";\n      color: ", ";\n      strong {\n        font-family: ", ";\n      }\n\n      .ql-editor{\n        padding: 8px 10px;\n      }\n    }\n  }\n"])), _variables.GlobalColors.white, _ref => {
-  let {
-    focus,
-    isRequired
-  } = _ref;
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .quill {\n    background-color: ", ";\n    border: 1px solid\n      ", ";\n    position: relative;\n    border-radius: 5px;\n\n    .ql-toolbar {\n      background-color: ", ";\n      position: absolute;\n      z-index: 10;\n      border: 1px solid ", ";\n      width: 45px;\n      height: 45px;\n      border-radius: 4px;\n      visibility: ", ";\n      top: ", "px;\n      left: ", "px;\n    }\n\n    .ql-container {\n      border: none;\n      font-family: ", ";\n      color: ", ";\n      strong {\n        font-family: ", ";\n      }\n\n      .ql-editor{\n        padding: 8px 10px;\n      }\n    }\n  }\n"])), _variables.GlobalColors.white, function (_ref) {
+  var focus = _ref.focus,
+      isRequired = _ref.isRequired;
   return focus ? _variables.GlobalColors.magenta_s2 : isRequired ? "red" : _variables.GlobalColors.gray_light;
-}, _variables.GlobalColors.s2, _variables.GlobalColors.gray_light, _ref2 => {
-  let {
-    selection
-  } = _ref2;
+}, _variables.GlobalColors.s2, _variables.GlobalColors.gray_light, function (_ref2) {
+  var selection = _ref2.selection;
   return selection ? "visible" : "hidden";
-}, _ref3 => {
-  let {
-    position
-  } = _ref3;
+}, function (_ref3) {
+  var position = _ref3.position;
   return position.top;
-}, _ref4 => {
-  let {
-    position
-  } = _ref4;
+}, function (_ref4) {
+  var position = _ref4.position;
   return position.left;
-}, _variables.FontFamily.AvenirNext, _variables.GlobalColors.deep_gray, _variables.FontFamily.Raleway_900);
+}, _variables.FontFamily.AvenirNext, _variables.GlobalColors.deep_gray, _variables.FontFamily.Raleway_900);
+
+exports.Container = Container;

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

@@ -1,21 +1,31 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.Template = 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/InputImages",
   component: _.InputImages,
   argTypes: {}
 };
-const Template = args => /*#__PURE__*/(0, _jsxRuntime.jsx)(_.InputImages, {
-  ...args
-});
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_.InputImages, (0, _objectSpread2.default)({}, args));
+};
+
 exports.Template = Template;
-const InputImagesDefault = Template.bind({});
+var InputImagesDefault = Template.bind({});
 InputImagesDefault.args = {
   description_small: "Descripción del campo",
   required: true,

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

@@ -1,21 +1,26 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.InputImages = void 0;
+
 var _Input = _interopRequireDefault(require("../Input"));
+
 var _InputText = require("../InputText");
+
 var _TooltipLight = require("../TooltipLight");
+
 var _styles = require("./styles");
+
 var _jsxRuntime = require("react/jsx-runtime");
-const InputImages = _ref => {
-  let {
-    description_small,
-    required,
-    placeHolder
-  } = _ref;
+
+var InputImages = function InputImages(_ref) {
+  var description_small = _ref.description_small,
+      required = _ref.required,
+      placeHolder = _ref.placeHolder;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TooltipLight.TooltipLight, {
       description_small: description_small,
@@ -28,9 +33,14 @@ const InputImages = _ref => {
       transparent: true,
       size: 12,
       placeHolder: placeHolder,
-      onChangeText: newValue => setTextInputSearch(newValue),
-      onEnter: event => onClickSearch()
+      onChangeText: function onChangeText(newValue) {
+        return setTextInputSearch(newValue);
+      },
+      onEnter: function onEnter(event) {
+        return onClickSearch();
+      }
     })]
   });
 };
+
 exports.InputImages = InputImages;