techsbcn-storybook 0.23.3 → 0.23.6

package/dist/techsbcn-storybook.cjs.development.js

@@ -70,7 +70,7 @@ var PublicFormWrapper = function PublicFormWrapper(props) {
   }, props.children)));
 };
 
-var css_248z$1 = ".search-component .title {\n  color: #000;\n  font-size: 17px !important;\n  font-weight: 400;\n  position: relative;\n}\n.search-component .tune-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 50px;\n  cursor: pointer;\n  color: white;\n}\n.search-component .tune-btn:hover {\n  box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important;\n}\n.search-component .wrapper-actions.min-action-width .btn-action .MuiButton-root {\n  max-width: 100%;\n  width: auto;\n}\n.search-component .wrapper-actions.min-action-width .btn-action .btn {\n  max-width: 100%;\n  width: auto;\n}\n.search-component .wrapper-actions .btn-action {\n  cursor: pointer;\n}\n.search-component .wrapper-actions .btn-action .MuiButton-root {\n  width: max-content;\n}\n.search-component .wrapper-actions .btn-action .btn {\n  width: max-content;\n}\n.search-component .wrapper-actions .btn-action svg {\n  font-size: 40px;\n}\n\n.search-menu-actions .wrapper-actions .btn-action {\n  cursor: pointer;\n}\n.search-menu-actions .wrapper-actions .btn-action .btn {\n  width: max-content;\n}\n.search-menu-actions .wrapper-actions .btn-action svg {\n  font-size: 40px;\n}";
+var css_248z$1 = ".search-component .title {\n  color: #000;\n  font-size: 17px !important;\n  font-weight: 400;\n  position: relative;\n}\n.search-component .tune-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 50px;\n  cursor: pointer;\n  color: white;\n}\n.search-component .tune-btn:hover {\n  box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important;\n}\n.search-component .wrapper-actions.min-action-width .btn-action .MuiButton-root {\n  max-width: 100%;\n  width: auto;\n}\n.search-component .wrapper-actions.min-action-width .btn-action .btn {\n  max-width: 100%;\n  width: auto;\n}\n.search-component .wrapper-actions .btn-action {\n  cursor: pointer;\n}\n.search-component .wrapper-actions .btn-action .MuiButton-root {\n  width: max-content;\n}\n.search-component .wrapper-actions .btn-action .btn {\n  width: max-content;\n}\n.search-component .wrapper-actions .btn-action svg {\n  font-size: 30px;\n}\n\n.search-menu-actions .wrapper-actions .btn-action {\n  cursor: pointer;\n}\n.search-menu-actions .wrapper-actions .btn-action .btn {\n  width: max-content;\n}\n.search-menu-actions .wrapper-actions .btn-action svg {\n  font-size: 30px;\n}";
 styleInject(css_248z$1);
 
 var ActionsList = function ActionsList(actions) {
@@ -269,7 +269,7 @@ var LinearProgressComponent = function LinearProgressComponent() {
   }));
 };
 
-var css_248z$3 = ".main-wrapper-component {\n  background-color: white;\n  box-shadow: 0 1px 20px 0 rgba(69, 90, 100, 0.08);\n}\n.main-wrapper-component .main-background-color-after {\n  position: relative;\n}\n.main-wrapper-component .main-background-color-after:after {\n  content: \"\";\n  position: absolute;\n  left: -16px;\n  top: 2px;\n  width: 3px;\n  height: 20px;\n}\n.main-wrapper-component .wrapper-actions.min-action-width .btn-action .MuiButton-root {\n  max-width: 100%;\n  width: auto;\n}\n.main-wrapper-component .wrapper-actions .btn-action {\n  cursor: pointer;\n}\n.main-wrapper-component .wrapper-actions .btn-action .MuiButton-root {\n  width: max-content;\n}\n.main-wrapper-component .wrapper-actions .btn-action svg {\n  font-size: 40px;\n}";
+var css_248z$3 = ".main-wrapper-component {\n  background-color: white;\n  box-shadow: 0 1px 20px 0 rgba(69, 90, 100, 0.08);\n}\n.main-wrapper-component .main-background-color-after {\n  position: relative;\n}\n.main-wrapper-component .main-background-color-after:after {\n  content: \"\";\n  position: absolute;\n  left: -16px;\n  top: 2px;\n  width: 3px;\n  height: 20px;\n}\n.main-wrapper-component .wrapper-actions.min-action-width .btn-action .MuiButton-root {\n  max-width: 100%;\n  width: auto;\n}\n.main-wrapper-component .wrapper-actions .btn-action {\n  cursor: pointer;\n}\n.main-wrapper-component .wrapper-actions .btn-action .MuiButton-root {\n  width: max-content;\n}\n.main-wrapper-component .wrapper-actions .btn-action svg {\n  font-size: 30px;\n}";
 styleInject(css_248z$3);
 
 var MainWrapperComponent = function MainWrapperComponent(props) {
@@ -627,6 +627,7 @@ var TableComponent = function TableComponent(props) {
     }
 
     return React__default.createElement(_.Typography, {
+      component: 'span',
       whiteSpace: "break-spaces"
     }, value);
   };
@@ -1033,6 +1034,7 @@ var SimpleTableComponent = function SimpleTableComponent(props) {
     }
 
     return React__default.createElement(_.Typography, {
+      component: 'span',
       whiteSpace: "break-spaces"
     }, value);
   };
@@ -1602,7 +1604,7 @@ var AppHeader = function AppHeader(props) {
   }, React__default.createElement(MenuIcon, null)), props.children));
 };
 
-var css_248z$d = ".MuiButton-root {\n  width: auto;\n  padding: 0.8rem 1rem !important;\n  text-transform: inherit !important;\n  line-height: inherit !important;\n  box-shadow: none !important;\n  font-size: 14px !important;\n  background-color: #3299C7;\n}\n.MuiButton-root.Mui-disabled {\n  opacity: 0.5;\n}\n.MuiButton-root.loading-button {\n  opacity: 1 !important;\n}\n.MuiButton-root.main-background-color.Mui-disabled {\n  color: white !important;\n}\n.MuiButton-root.btn-login {\n  width: 100%;\n}\n.MuiButton-root.btn-reverse-color {\n  border: 1px solid #3299C7;\n  color: #3299C7;\n  background-color: white !important;\n}\n.MuiButton-root.btn-modal-cancel {\n  background-color: #748892 !important;\n}\n.MuiButton-root.btn-modal-cancel.Mui-disabled {\n  background-color: #748892 !important;\n}\n.MuiButton-root:hover {\n  box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important;\n}\n.MuiButton-root .MuiCircularProgress-root {\n  color: white;\n  width: 17px !important;\n  height: 17px !important;\n}\n.MuiButton-root .MuiButton-label .MuiCircularProgress-root {\n  color: white;\n}\n.MuiButton-root .MuiButton-startIcon svg {\n  font-size: 20px !important;\n}\n.MuiButton-root .MuiButton-endIcon svg {\n  font-size: 20px !important;\n}";
+var css_248z$d = ".MuiButton-root {\n  width: auto;\n  padding: 0.8rem 1rem !important;\n  text-transform: inherit !important;\n  line-height: inherit !important;\n  box-shadow: none !important;\n  font-size: 14px !important;\n  background-color: #3299C7;\n  border: 1px solid transparent !important;\n}\n.MuiButton-root.Mui-disabled {\n  opacity: 0.5;\n}\n.MuiButton-root.loading-button {\n  opacity: 1 !important;\n}\n.MuiButton-root.main-background-color.Mui-disabled {\n  color: white !important;\n}\n.MuiButton-root.btn-login {\n  width: 100%;\n}\n.MuiButton-root.btn-reverse-color {\n  border: 1px solid #3299C7 !important;\n  color: #3299C7;\n  background-color: white !important;\n}\n.MuiButton-root.btn-modal-cancel {\n  background-color: #748892 !important;\n}\n.MuiButton-root.btn-modal-cancel.Mui-disabled {\n  background-color: #748892 !important;\n}\n.MuiButton-root:hover {\n  box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important;\n}\n.MuiButton-root .MuiCircularProgress-root {\n  color: white;\n  width: 17px !important;\n  height: 17px !important;\n}\n.MuiButton-root .MuiButton-label .MuiCircularProgress-root {\n  color: white;\n}\n.MuiButton-root .MuiButton-startIcon svg {\n  font-size: 20px !important;\n}\n.MuiButton-root .MuiButton-endIcon svg {\n  font-size: 20px !important;\n}";
 styleInject(css_248z$d);
 
 var ButtonComponent = function ButtonComponent(props) {
@@ -1625,7 +1627,7 @@ ButtonComponent.defaultProps = {
   component: 'button'
 };
 
-var css_248z$e = ".text-simple-component .MuiFormLabel-root {\n  color: #666666;\n  font-size: 1rem !important;\n  transform: translate(0, 0.5px) scale(0.85);\n  transform-origin: top left;\n  text-overflow: initial !important;\n}\n.text-simple-component .MuiFormLabel-root + .text-simple-box.no-border {\n  margin-top: 16px !important;\n}\n.text-simple-component .MuiFormLabel-root + .text-simple-box.no-margin.no-border {\n  margin-top: 7px !important;\n}\n.text-simple-component .text-simple-box.no-border {\n  border: none !important;\n  padding: 0 !important;\n}\n.text-simple-component .text-simple-box {\n  color: #666666;\n  font-size: 14px;\n  border: 1px solid grey;\n  border-radius: 3px !important;\n  padding: 0.611rem 0.87rem;\n  line-height: 1.4375em;\n  letter-spacing: 0.00938em;\n}\n.text-simple-component .text-simple-box.icon-padding {\n  padding: 0.49rem 0.87rem;\n}\n.text-simple-component .text-simple-box.end-icon-padding {\n  padding: 0.177rem 0.87rem;\n}\n.text-simple-component .helper-text {\n  font-size: 0.85rem !important;\n  padding: 0 !important;\n  margin-top: 3px;\n  line-height: 1.66;\n  color: #666666 !important;\n  letter-spacing: 0.03333em;\n}\n.text-simple-component .has-error-border {\n  border-color: #F24726 !important;\n}\n.text-simple-component .has-error {\n  color: #F24726 !important;\n}";
+var css_248z$e = ".text-simple-component .MuiFormLabel-root {\n  color: #666666;\n  font-size: 1rem !important;\n  transform: translate(0, 0.5px) scale(0.85);\n  transform-origin: top left;\n  text-overflow: initial !important;\n}\n.text-simple-component .MuiFormLabel-root + .text-simple-box {\n  margin-top: 2px;\n}\n.text-simple-component .MuiFormLabel-root + .text-simple-box.no-border {\n  margin-top: 16px !important;\n}\n.text-simple-component .MuiFormLabel-root + .text-simple-box.no-margin.no-border {\n  margin-top: 7px !important;\n}\n.text-simple-component .text-simple-box.no-border {\n  border: none !important;\n  padding: 0 !important;\n}\n.text-simple-component .text-simple-box {\n  color: #666666;\n  font-size: 14px;\n  border: 1px solid grey;\n  border-radius: 3px !important;\n  padding: 0.611rem 0.87rem;\n  line-height: 1.4375em;\n  letter-spacing: 0.00938em;\n}\n.text-simple-component .text-simple-box.icon-padding {\n  padding: 0.49rem 0.87rem;\n}\n.text-simple-component .text-simple-box.end-icon-padding {\n  padding: 0.177rem 0.87rem;\n}\n.text-simple-component .helper-text {\n  font-size: 0.85rem !important;\n  padding: 0 !important;\n  margin-top: 3px;\n  line-height: 1.66;\n  color: #666666 !important;\n  letter-spacing: 0.03333em;\n}\n.text-simple-component .has-error-border {\n  border-color: #F24726 !important;\n}\n.text-simple-component .has-error {\n  color: #F24726 !important;\n}";
 styleInject(css_248z$e);
 
 var TextSimpleComponent = function TextSimpleComponent(props) {
@@ -1683,7 +1685,7 @@ TextSimpleComponent.defaultProps = {
   isFormLabel: true
 };
 
-var css_248z$f = ".select-field .MuiFormLabel-root {\n  color: #666666 !important;\n  font-size: 1rem !important;\n  transform: translate(0, 0.5px) scale(0.85);\n  transform-origin: top left;\n  text-overflow: initial !important;\n}\n.select-field .select {\n  font-size: 1rem;\n}\n.select-field .select__menu {\n  z-index: 3 !important;\n  background-color: white;\n}\n.select-field .select__control {\n  cursor: pointer;\n  border: 1px solid grey;\n  border-radius: 3px !important;\n  padding: 0.12rem 0.2rem;\n  font-size: 14px;\n  color: grey !important;\n  background-color: transparent;\n}\n.select-field .select__option {\n  cursor: pointer;\n  color: #666666 !important;\n  background-color: white !important;\n}\n.select-field .select__option--is-focused {\n  background-color: rgba(0, 0, 0, 0.04) !important;\n  color: #666666 !important;\n}\n.select-field .select__option--is-selected {\n  color: white !important;\n}\n.select-field .select__indicator {\n  color: grey !important;\n}\n.select-field .select__indicator:hover {\n  color: black !important;\n}\n.select-field .select__placeholder {\n  text-overflow: ellipsis !important;\n  color: #666666 !important;\n  opacity: 1;\n}\n.select-field .select__single-value {\n  color: #666666 !important;\n}\n.select-field .select__multi-value__label {\n  color: #666666 !important;\n  font-size: 14px;\n}\n.select-field .select__control--is-focused {\n  border-color: grey !important;\n  box-shadow: none !important;\n}\n.select-field .helper-text {\n  font-size: 0.85rem !important;\n  padding: 0 !important;\n  margin-top: 3px;\n  line-height: 1.66;\n  color: #666666 !important;\n  letter-spacing: 0.03333em;\n}\n.select-field .has-error {\n  color: #F24726 !important;\n}\n.select-field .has-error .select__control {\n  border: 1px #F24726 solid !important;\n}\n.select-field .has-error .select__control--is-focused {\n  border-color: #F24726 !important;\n  box-shadow: 0 0 0 1px #F24726;\n}";
+var css_248z$f = ".select-field .MuiFormLabel-root {\n  color: #666666 !important;\n  font-size: 1rem !important;\n  transform: translate(0, 0.5px) scale(0.85);\n  transform-origin: top left;\n  text-overflow: initial !important;\n}\n.select-field .MuiFormLabel-root + .basic-multi-select .select__control {\n  margin-top: 1.85px;\n}\n.select-field .select {\n  font-size: 1rem;\n}\n.select-field .select__menu {\n  z-index: 3 !important;\n  background-color: white;\n}\n.select-field .select__control {\n  cursor: pointer;\n  border: 1px solid grey;\n  border-radius: 3px !important;\n  padding: 0.12rem 0.2rem;\n  font-size: 14px;\n  color: grey !important;\n  background-color: transparent;\n}\n.select-field .select__option {\n  cursor: pointer;\n  color: #666666 !important;\n  background-color: white !important;\n}\n.select-field .select__option--is-focused {\n  background-color: rgba(0, 0, 0, 0.04) !important;\n  color: #666666 !important;\n}\n.select-field .select__option--is-selected {\n  color: white !important;\n}\n.select-field .select__indicator {\n  color: grey !important;\n}\n.select-field .select__indicator:hover {\n  color: black !important;\n}\n.select-field .select__placeholder {\n  text-overflow: ellipsis !important;\n  color: #666666 !important;\n  opacity: 1;\n}\n.select-field .select__single-value {\n  color: #666666 !important;\n}\n.select-field .select__multi-value__label {\n  color: #666666 !important;\n  font-size: 14px;\n}\n.select-field .select__control--is-focused {\n  border-color: grey !important;\n  box-shadow: none !important;\n}\n.select-field .helper-text {\n  font-size: 0.85rem !important;\n  padding: 0 !important;\n  margin-top: 3px;\n  line-height: 1.66;\n  color: #666666 !important;\n  letter-spacing: 0.03333em;\n}\n.select-field .has-error {\n  color: #F24726 !important;\n}\n.select-field .has-error .select__control {\n  border: 1px #F24726 solid !important;\n}\n.select-field .has-error .select__control--is-focused {\n  border-color: #F24726 !important;\n  box-shadow: 0 0 0 1px #F24726;\n}";
 styleInject(css_248z$f);
 
 var SelectField = function SelectField(props) {
@@ -1695,7 +1697,7 @@ var SelectField = function SelectField(props) {
     className: "select-field",
     display: "flex",
     flexDirection: "column"
-  }, React__default.createElement(_.FormLabel, null, props.label), React__default.createElement(Select, {
+  }, props.label && React__default.createElement(_.FormLabel, null, props.label), React__default.createElement(Select, {
     defaultValue: props.defaultOptions,
     isMulti: props.isMulti,
     name: props.name,
@@ -2590,7 +2592,7 @@ var SelectAsyncField = function SelectAsyncField(props) {
     className: "select-field",
     display: "flex",
     flexDirection: "column"
-  }, React__default.createElement(_.FormLabel, null, props.label), React__default.createElement(reactSelectAsyncPaginate.AsyncPaginate, {
+  }, props.label && React__default.createElement(_.FormLabel, null, props.label), React__default.createElement(reactSelectAsyncPaginate.AsyncPaginate, {
     defaultValue: props.defaultOptions,
     isMulti: props.isMulti,
     name: props.name,