techsbcn-storybook 0.21.2 → 0.21.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -20,3 +20,4 @@ export * from './components/forms/ResetPasswordForm';
20
20
  export * from './components/modals/ModalComponent';
21
21
  export * from './components/wrappers/TabsComponent/TabsComponent';
22
22
  export * from './components/wrappers/LinearProgressComponent/LinearProgressComponent';
23
+ export * from './components/fields/DatePickerComponent/DatePickerComponent';
@@ -18,6 +18,8 @@ var yup = require('yup');
18
18
  var reactHookForm = require('react-hook-form');
19
19
  var yup$1 = require('@hookform/resolvers/yup');
20
20
  var lab = require('@mui/lab');
21
+ var xDatePickers = require('@mui/x-date-pickers');
22
+ var AdapterDayjs = require('@mui/x-date-pickers/AdapterDayjs');
21
23
 
22
24
  function styleInject(css, ref) {
23
25
  if ( ref === void 0 ) ref = {};
@@ -64,7 +66,7 @@ var PublicFormWrapper = function PublicFormWrapper(props) {
64
66
  }, props.children)));
65
67
  };
66
68
 
67
- var css_248z$1 = ".search-component .title {\n color: #000;\n font-size: calc(21px + (23 - 21) * calc(100vw - 300px)/1300) !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}";
69
+ var css_248z$1 = ".search-component .title {\n color: #000;\n font-size: calc(15pt + (17 - 15) * calc(100vw - 300px)/1300) !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}";
68
70
  styleInject(css_248z$1);
69
71
 
70
72
  var ActionsList = function ActionsList(actions) {
@@ -296,10 +298,10 @@ var MainWrapperComponent = function MainWrapperComponent(props) {
296
298
  })) : React__default.createElement(React__default.Fragment, null))));
297
299
  };
298
300
 
299
- var css_248z$4 = ".table-component .paper-container {\n box-shadow: none;\n background-color: transparent !important;\n}\n.table-component .paper-container .checkbox-cell .MuiCheckbox-root {\n padding: 0 !important;\n}\n.table-component .paper-container .checkbox-cell .MuiCheckbox-root:hover {\n background-color: transparent !important;\n}\n.table-component .paper-container .checkbox-cell .Mui-checked {\n color: rgba(0, 0, 0, 0.54) !important;\n}\n.table-component .paper-container .checkbox-cell .MuiCheckbox-indeterminate {\n color: #212529 !important;\n}\n.table-component .paper-container .table-container {\n border-bottom: 1px solid black;\n}\n.table-component .paper-container .table-container.with-scroll {\n max-height: 68vh;\n}\n.table-component .paper-container .table-container .table-column:first-child {\n border-radius: 5px 0 0 5px;\n}\n.table-component .paper-container .table-container .table-column:last-child {\n border-right: none !important;\n border-radius: 0 5px 5px 0;\n}\n.table-component .paper-container .table-container .table-column {\n font-weight: bold;\n padding: 10px !important;\n border-top: 1px solid #e0e0e0;\n border-right: 1px solid #e0e0e0;\n border-bottom: 2px solid #e0e0e0;\n}\n.table-component .paper-container .table-container .table-column .table-header-cell {\n color: black;\n padding: 0px 10px 0px 10px !important;\n}\n.table-component .paper-container .table-container .table-rows.row-click {\n cursor: pointer;\n}\n.table-component .paper-container .table-container .table-rows.row-click:hover {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.table-component .paper-container .table-container .table-rows.Mui-selected {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.table-component .paper-container .table-container .table-rows .Mui-selected {\n background-color: transparent !important;\n}\n.table-component .paper-container .table-container .table-rows .MuiTableCell-root {\n padding: 6px !important;\n overflow: hidden;\n}\n.table-component .paper-container .table-container .table-rows .img-table {\n width: 100%;\n height: 110px;\n}\n.table-component .paper-container .table-container .table-rows .img-table img {\n object-fit: contain;\n}\n.table-component .paper-container .table-container .table-rows .actions {\n float: right;\n}\n.table-component .paper-container .table-container .table-rows .btn-action {\n color: rgba(0, 0, 0, 0.54);\n display: inline-block;\n text-decoration: none;\n font-size: 1.6em !important;\n padding: 0px 7px;\n cursor: pointer;\n}\n.table-component .paper-container .MuiTable-root.loading {\n opacity: 0.5;\n}\n.table-component .paper-container .MuiTable-root.loading .MuiCircularProgress-root {\n width: 80px !important;\n height: 80px !important;\n position: absolute;\n left: 0;\n right: 0;\n top: 5px;\n margin: auto;\n color: grey;\n}\n.table-component .paper-container .MuiTablePagination-root {\n overflow: unset;\n}\n.table-component .paper-container .MuiTablePagination-root .MuiToolbar-root {\n justify-content: center !important;\n flex-wrap: wrap;\n padding: 0px !important;\n}\n.table-component .paper-container .MuiTablePagination-root .MuiTablePagination-spacer {\n flex: 0 !important;\n}\n.table-component .paper-container .MuiTablePagination-root .pagination .MuiPaginationItem-page {\n border-radius: 0px;\n margin: 1px;\n color: white !important;\n background-color: #3f4d67;\n}\n.table-component .paper-container .MuiTablePagination-root .pagination .MuiPaginationItem-page.Mui-selected {\n background-color: #3299C7;\n}\n.table-component .paper-container .MuiTablePagination-root .pagination li button {\n padding: 14px;\n}\n.table-component .paper-container .MuiTablePagination-root .pagination li:nth-child(2) .MuiPaginationItem-page {\n border-radius: 5px 0 0 5px !important;\n}\n.table-component .paper-container .MuiTablePagination-root .pagination li:nth-last-child(2) .MuiPaginationItem-page {\n border-radius: 0 5px 5px 0 !important;\n}\n@media (max-width: 992px) {\n .table-component .paper-container .table-container {\n max-height: 60vh;\n border-top: 1px solid #cccccc;\n }\n .table-component .paper-container .table-container .MuiTable-root {\n border-collapse: collapse !important;\n }\n .table-component .paper-container .table-container .MuiTableHead-root {\n display: none !important;\n }\n .table-component .paper-container .table-container .table-rows {\n border-bottom: 2px solid #cccccc;\n }\n .table-component .paper-container .table-container .table-rows .MuiTableCell-root {\n width: auto;\n border-bottom: none !important;\n }\n .table-component .paper-container .table-container .table-rows .MuiTableCell-root .label-cell {\n font-size: 1rem;\n vertical-align: top;\n width: 50%;\n height: auto;\n }\n .table-component .paper-container .table-container .table-rows .MuiTableCell-root .label-cell + div {\n display: inline-block;\n }\n .table-component .paper-container .table-container .table-rows .table-cell {\n display: block !important;\n }\n .table-component .paper-container .table-container .table-rows .format-value {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n width: 50%;\n max-width: 299px;\n }\n}";
301
+ var css_248z$4 = ".table-component .paper-container {\n box-shadow: none;\n background-color: transparent !important;\n}\n.table-component .paper-container .checkbox-cell .MuiCheckbox-root {\n padding: 0 !important;\n}\n.table-component .paper-container .checkbox-cell .MuiCheckbox-root:hover {\n background-color: transparent !important;\n}\n.table-component .paper-container .checkbox-cell .Mui-checked {\n color: rgba(0, 0, 0, 0.54) !important;\n}\n.table-component .paper-container .checkbox-cell .MuiCheckbox-indeterminate {\n color: #212529 !important;\n}\n.table-component .paper-container .table-container {\n border-bottom: 1px solid black;\n}\n.table-component .paper-container .table-container.with-scroll {\n max-height: 68vh;\n}\n.table-component .paper-container .table-container .table-column:first-child {\n border-radius: 5px 0 0 5px;\n}\n.table-component .paper-container .table-container .table-column:last-child {\n border-right: none !important;\n border-radius: 0 5px 5px 0;\n}\n.table-component .paper-container .table-container .table-column {\n font-weight: bold;\n font-size: calc(9pt + (11 - 9) * calc(100vw - 300px)/1300) !important;\n padding: 10px !important;\n border-top: 1px solid #e0e0e0;\n border-right: 1px solid #e0e0e0;\n border-bottom: 2px solid #e0e0e0;\n}\n.table-component .paper-container .table-container .table-column .table-header-cell {\n color: black;\n font-weight: bold;\n padding: 0px 10px 0px 10px !important;\n}\n.table-component .paper-container .table-container .table-rows.row-click {\n cursor: pointer;\n}\n.table-component .paper-container .table-container .table-rows.row-click:hover {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.table-component .paper-container .table-container .table-rows.Mui-selected {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.table-component .paper-container .table-container .table-rows .Mui-selected {\n background-color: transparent !important;\n}\n.table-component .paper-container .table-container .table-rows .MuiTableCell-root {\n padding: 6px !important;\n overflow: hidden;\n}\n.table-component .paper-container .table-container .table-rows .img-table {\n width: 100%;\n height: 110px;\n}\n.table-component .paper-container .table-container .table-rows .img-table img {\n object-fit: contain;\n}\n.table-component .paper-container .table-container .table-rows .actions {\n float: right;\n}\n.table-component .paper-container .table-container .table-rows .btn-action {\n color: rgba(0, 0, 0, 0.54);\n display: inline-block;\n text-decoration: none;\n font-size: 1.6em !important;\n padding: 0px 7px;\n cursor: pointer;\n}\n.table-component .paper-container .table-container .table-rows .format-value {\n font-size: calc(9pt + (11 - 9) * calc(100vw - 300px)/1300) !important;\n}\n.table-component .paper-container .table-container .table-rows .format-value .MuiTypography-root {\n font-size: calc(9pt + (11 - 9) * calc(100vw - 300px)/1300);\n}\n.table-component .paper-container .MuiTable-root.loading {\n opacity: 0.5;\n}\n.table-component .paper-container .MuiTable-root.loading .MuiCircularProgress-root {\n width: 80px !important;\n height: 80px !important;\n position: absolute;\n left: 0;\n right: 0;\n top: 5px;\n margin: auto;\n color: grey;\n}\n.table-component .paper-container .MuiTablePagination-root {\n overflow: unset;\n}\n.table-component .paper-container .MuiTablePagination-root .MuiToolbar-root {\n justify-content: center !important;\n flex-wrap: wrap;\n padding: 0px !important;\n}\n.table-component .paper-container .MuiTablePagination-root .MuiTablePagination-spacer {\n flex: 0 !important;\n}\n.table-component .paper-container .MuiTablePagination-root .pagination .MuiPaginationItem-page {\n border-radius: 0px;\n margin: 1px;\n color: white !important;\n background-color: #3f4d67;\n}\n.table-component .paper-container .MuiTablePagination-root .pagination .MuiPaginationItem-page.Mui-selected {\n background-color: #3299C7;\n}\n.table-component .paper-container .MuiTablePagination-root .pagination li button {\n padding: 14px;\n}\n.table-component .paper-container .MuiTablePagination-root .pagination li:nth-child(2) .MuiPaginationItem-page {\n border-radius: 5px 0 0 5px !important;\n}\n.table-component .paper-container .MuiTablePagination-root .pagination li:nth-last-child(2) .MuiPaginationItem-page {\n border-radius: 0 5px 5px 0 !important;\n}\n@media (max-width: 992px) {\n .table-component .paper-container .table-container {\n max-height: 60vh;\n border-top: 1px solid #cccccc;\n }\n .table-component .paper-container .table-container .MuiTable-root {\n border-collapse: collapse !important;\n }\n .table-component .paper-container .table-container .MuiTableHead-root {\n display: none !important;\n }\n .table-component .paper-container .table-container .table-rows {\n border-bottom: 2px solid #cccccc;\n }\n .table-component .paper-container .table-container .table-rows .MuiTableCell-root {\n width: auto;\n border-bottom: none !important;\n }\n .table-component .paper-container .table-container .table-rows .MuiTableCell-root .label-cell {\n font-size: 1rem;\n vertical-align: top;\n width: 50%;\n height: auto;\n }\n .table-component .paper-container .table-container .table-rows .MuiTableCell-root .label-cell + div {\n display: inline-block;\n }\n .table-component .paper-container .table-container .table-rows .table-cell {\n display: block !important;\n }\n .table-component .paper-container .table-container .table-rows .format-value {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n width: 50%;\n max-width: 299px;\n }\n}";
300
302
  styleInject(css_248z$4);
301
303
 
302
- var css_248z$5 = ".text-field-component .MuiFormLabel-root {\n color: #666666 !important;\n font-size: calc(12pt + (14 - 12) * calc(100vw - 300px)/1300) !important;\n transform: translate(0, 0.5px) scale(0.85);\n transform-origin: top left;\n text-overflow: initial !important;\n}\n.text-field-component .MuiFormLabel-root + .MuiInputBase-formControl {\n margin-top: 25px !important;\n}\n.text-field-component .MuiInputBase-root.no-border {\n border: none !important;\n padding: 0 !important;\n width: fit-content !important;\n}\n.text-field-component .MuiInputBase-root {\n color: #666666 !important;\n border: 1px solid grey;\n padding: 0.43rem 0.87rem;\n background-color: white !important;\n border-radius: 3px !important;\n}\n.text-field-component .MuiInputBase-root.Mui-error {\n border: 1px solid #F24726 !important;\n}\n.text-field-component .MuiInputBase-root:not(.Mui-disabled):hover {\n border: 1px solid grey;\n}\n.text-field-component .MuiInputBase-root.Mui-focused {\n border: 1px solid #3299C7;\n}\n.text-field-component .MuiInputBase-root .MuiInputBase-input {\n color: #666666 !important;\n background-color: white !important;\n}\n.text-field-component .MuiInputBase-root .MuiInputBase-input::placeholder {\n text-overflow: ellipsis !important;\n color: #666666 !important;\n opacity: 1;\n}\n.text-field-component .MuiInputBase-root .Mui-disabled {\n -webkit-text-fill-color: #666666 !important;\n}\n.text-field-component .MuiFormHelperText-root {\n padding: 0 !important;\n font-size: 0.85rem !important;\n color: #666666;\n}";
304
+ var css_248z$5 = ".text-field-component .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.text-field-component .MuiFormLabel-root + .MuiInputBase-formControl {\n margin-top: 25px !important;\n}\n.text-field-component .MuiInputBase-root.no-border {\n border: none !important;\n padding: 0 !important;\n width: fit-content !important;\n}\n.text-field-component .MuiInputBase-root {\n color: #666666 !important;\n border: 1px solid grey;\n padding: 0.43rem 0.87rem;\n background-color: white !important;\n border-radius: 3px !important;\n}\n.text-field-component .MuiInputBase-root.Mui-error {\n border: 1px solid #F24726 !important;\n}\n.text-field-component .MuiInputBase-root:not(.Mui-disabled):hover {\n border: 1px solid grey;\n}\n.text-field-component .MuiInputBase-root.Mui-focused {\n border: 1px solid #3299C7;\n}\n.text-field-component .MuiInputBase-root .MuiInputBase-input {\n color: #666666 !important;\n background-color: white !important;\n}\n.text-field-component .MuiInputBase-root .MuiInputBase-input::placeholder {\n text-overflow: ellipsis !important;\n color: #666666 !important;\n opacity: 1;\n}\n.text-field-component .MuiInputBase-root .Mui-disabled {\n -webkit-text-fill-color: #666666 !important;\n}\n.text-field-component .MuiFormHelperText-root {\n padding: 0 !important;\n font-size: 0.85rem !important;\n color: #666666;\n}";
303
305
  styleInject(css_248z$5);
304
306
 
305
307
  var TextFieldComponent = function TextFieldComponent(props) {
@@ -862,7 +864,7 @@ TableComponent.defaultProps = {
862
864
  showTotalCount: true
863
865
  };
864
866
 
865
- var css_248z$6 = ".table-simple-component .paper-container {\n box-shadow: none;\n background-color: transparent !important;\n}\n.table-simple-component .paper-container .checkbox-cell .MuiCheckbox-root {\n padding: 0 !important;\n}\n.table-simple-component .paper-container .checkbox-cell .MuiCheckbox-root:hover {\n background-color: transparent !important;\n}\n.table-simple-component .paper-container .checkbox-cell .Mui-checked {\n color: rgba(0, 0, 0, 0.54) !important;\n}\n.table-simple-component .paper-container .checkbox-cell .MuiCheckbox-indeterminate {\n color: #212529 !important;\n}\n.table-simple-component .paper-container .table-container {\n border-bottom: 1px solid black;\n}\n.table-simple-component .paper-container .table-container.with-scroll {\n max-height: 68vh;\n}\n.table-simple-component .paper-container .table-container .table-column:first-child {\n border-radius: 5px 0 0 5px;\n}\n.table-simple-component .paper-container .table-container .table-column:last-child {\n border-right: none !important;\n border-radius: 0 5px 5px 0;\n}\n.table-simple-component .paper-container .table-container .table-column {\n font-weight: bold;\n padding: 10px !important;\n border-top: 1px solid #e0e0e0;\n border-right: 1px solid #e0e0e0;\n border-bottom: 2px solid #e0e0e0;\n}\n.table-simple-component .paper-container .table-container .table-column .table-header-cell {\n color: black;\n padding: 0px 10px 0px 10px !important;\n}\n.table-simple-component .paper-container .table-container .table-rows.row-click {\n cursor: pointer;\n}\n.table-simple-component .paper-container .table-container .table-rows.row-click:hover {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.table-simple-component .paper-container .table-container .table-rows.Mui-selected {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.table-simple-component .paper-container .table-container .table-rows .Mui-selected {\n background-color: transparent !important;\n}\n.table-simple-component .paper-container .table-container .table-rows .MuiTableCell-root {\n padding: 6px !important;\n overflow: hidden;\n}\n.table-simple-component .paper-container .table-container .table-rows .img-table {\n width: 100%;\n height: 110px;\n}\n.table-simple-component .paper-container .table-container .table-rows .img-table img {\n object-fit: contain;\n}\n.table-simple-component .paper-container .table-container .table-rows .actions {\n float: right;\n}\n.table-simple-component .paper-container .table-container .table-rows .btn-action {\n color: rgba(0, 0, 0, 0.54);\n display: inline-block;\n text-decoration: none;\n font-size: 1.6em !important;\n padding: 0px 7px;\n cursor: pointer;\n}\n.table-simple-component .paper-container .MuiTable-root.loading {\n opacity: 0.5;\n}\n.table-simple-component .paper-container .MuiTable-root.loading .MuiCircularProgress-root {\n width: 80px !important;\n height: 80px !important;\n position: absolute;\n left: 0;\n right: 0;\n top: 5px;\n margin: auto;\n color: grey;\n}\n@media (max-width: 992px) {\n .table-simple-component .paper-container .table-container {\n max-height: 60vh;\n border-top: 1px solid #cccccc;\n }\n .table-simple-component .paper-container .table-container .MuiTable-root {\n border-collapse: collapse !important;\n }\n .table-simple-component .paper-container .table-container .MuiTableHead-root {\n display: none !important;\n }\n .table-simple-component .paper-container .table-container .table-rows {\n border-bottom: 2px solid #cccccc;\n }\n .table-simple-component .paper-container .table-container .table-rows .MuiTableCell-root {\n width: auto;\n border-bottom: none !important;\n }\n .table-simple-component .paper-container .table-container .table-rows .MuiTableCell-root .label-cell {\n font-size: 1rem;\n vertical-align: top;\n width: 50%;\n height: auto;\n }\n .table-simple-component .paper-container .table-container .table-rows .MuiTableCell-root .label-cell + div {\n display: inline-block;\n }\n .table-simple-component .paper-container .table-container .table-rows .table-cell {\n display: block !important;\n }\n .table-simple-component .paper-container .table-container .table-rows .format-value {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n width: 50%;\n max-width: 299px;\n }\n}";
867
+ var css_248z$6 = ".table-simple-component .paper-container {\n box-shadow: none;\n background-color: transparent !important;\n}\n.table-simple-component .paper-container .checkbox-cell .MuiCheckbox-root {\n padding: 0 !important;\n}\n.table-simple-component .paper-container .checkbox-cell .MuiCheckbox-root:hover {\n background-color: transparent !important;\n}\n.table-simple-component .paper-container .checkbox-cell .Mui-checked {\n color: rgba(0, 0, 0, 0.54) !important;\n}\n.table-simple-component .paper-container .checkbox-cell .MuiCheckbox-indeterminate {\n color: #212529 !important;\n}\n.table-simple-component .paper-container .table-container {\n border-bottom: 1px solid black;\n}\n.table-simple-component .paper-container .table-container.with-scroll {\n max-height: 68vh;\n}\n.table-simple-component .paper-container .table-container .table-column:first-child {\n border-radius: 5px 0 0 5px;\n}\n.table-simple-component .paper-container .table-container .table-column:last-child {\n border-right: none !important;\n border-radius: 0 5px 5px 0;\n}\n.table-simple-component .paper-container .table-container .table-column {\n font-weight: bold;\n font-size: calc(9pt + (11 - 9) * calc(100vw - 300px)/1300) !important;\n padding: 10px !important;\n border-top: 1px solid #e0e0e0;\n border-right: 1px solid #e0e0e0;\n border-bottom: 2px solid #e0e0e0;\n}\n.table-simple-component .paper-container .table-container .table-column .table-header-cell {\n color: black;\n font-weight: bold;\n padding: 0px 10px 0px 10px !important;\n}\n.table-simple-component .paper-container .table-container .table-rows.row-click {\n cursor: pointer;\n}\n.table-simple-component .paper-container .table-container .table-rows.row-click:hover {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.table-simple-component .paper-container .table-container .table-rows.Mui-selected {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.table-simple-component .paper-container .table-container .table-rows .Mui-selected {\n background-color: transparent !important;\n}\n.table-simple-component .paper-container .table-container .table-rows .MuiTableCell-root {\n padding: 6px !important;\n overflow: hidden;\n}\n.table-simple-component .paper-container .table-container .table-rows .img-table {\n width: 100%;\n height: 110px;\n}\n.table-simple-component .paper-container .table-container .table-rows .img-table img {\n object-fit: contain;\n}\n.table-simple-component .paper-container .table-container .table-rows .actions {\n float: right;\n}\n.table-simple-component .paper-container .table-container .table-rows .btn-action {\n color: rgba(0, 0, 0, 0.54);\n display: inline-block;\n text-decoration: none;\n font-size: 1.6em !important;\n padding: 0px 7px;\n cursor: pointer;\n}\n.table-simple-component .paper-container .table-container .table-rows .format-value {\n font-size: calc(9pt + (11 - 9) * calc(100vw - 300px)/1300);\n}\n.table-simple-component .paper-container .table-container .table-rows .format-value .MuiTypography-root {\n font-size: calc(9pt + (11 - 9) * calc(100vw - 300px)/1300);\n}\n.table-simple-component .paper-container .MuiTable-root.loading {\n opacity: 0.5;\n}\n.table-simple-component .paper-container .MuiTable-root.loading .MuiCircularProgress-root {\n width: 80px !important;\n height: 80px !important;\n position: absolute;\n left: 0;\n right: 0;\n top: 5px;\n margin: auto;\n color: grey;\n}\n@media (max-width: 992px) {\n .table-simple-component .paper-container .table-container {\n max-height: 60vh;\n border-top: 1px solid #cccccc;\n }\n .table-simple-component .paper-container .table-container .MuiTable-root {\n border-collapse: collapse !important;\n }\n .table-simple-component .paper-container .table-container .MuiTableHead-root {\n display: none !important;\n }\n .table-simple-component .paper-container .table-container .table-rows {\n border-bottom: 2px solid #cccccc;\n }\n .table-simple-component .paper-container .table-container .table-rows .MuiTableCell-root {\n width: auto;\n border-bottom: none !important;\n }\n .table-simple-component .paper-container .table-container .table-rows .MuiTableCell-root .label-cell {\n font-size: 1rem;\n vertical-align: top;\n width: 50%;\n height: auto;\n }\n .table-simple-component .paper-container .table-container .table-rows .MuiTableCell-root .label-cell + div {\n display: inline-block;\n }\n .table-simple-component .paper-container .table-container .table-rows .table-cell {\n display: block !important;\n }\n .table-simple-component .paper-container .table-container .table-rows .format-value {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n width: 50%;\n max-width: 299px;\n }\n}";
866
868
  styleInject(css_248z$6);
867
869
 
868
870
  var SimpleTableComponent = function SimpleTableComponent(props) {
@@ -1592,7 +1594,7 @@ ButtonComponent.defaultProps = {
1592
1594
  component: 'button'
1593
1595
  };
1594
1596
 
1595
- var css_248z$e = ".text-simple-component .MuiFormLabel-root {\n color: #666666;\n font-size: calc(12pt + (14 - 12) * calc(100vw - 300px)/1300) !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: 1rem;\n border: 1px solid grey;\n padding: 0.868rem;\n border-radius: 3px !important;\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}";
1597
+ 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: 1rem;\n border: 1px solid grey;\n padding: 0.868rem;\n border-radius: 3px !important;\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}";
1596
1598
  styleInject(css_248z$e);
1597
1599
 
1598
1600
  var TextSimpleComponent = function TextSimpleComponent(props) {
@@ -1646,7 +1648,7 @@ TextSimpleComponent.defaultProps = {
1646
1648
  isFormLabel: true
1647
1649
  };
1648
1650
 
1649
- var css_248z$f = ".select-field .MuiFormLabel-root {\n color: #666666 !important;\n font-size: calc(12pt + (14 - 12) * calc(100vw - 300px)/1300) !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: 5px !important;\n padding: 0.33rem 0.2rem;\n font-size: 1rem;\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: 1rem;\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}";
1651
+ 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: 5px !important;\n padding: 0.33rem 0.2rem;\n font-size: 1rem;\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: 1rem;\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}";
1650
1652
  styleInject(css_248z$f);
1651
1653
 
1652
1654
  var SelectField = function SelectField(props) {
@@ -3121,10 +3123,86 @@ var TabsComponent = function TabsComponent(props) {
3121
3123
  }))));
3122
3124
  };
3123
3125
 
3126
+ var css_248z$h = ".data-picker-component .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.data-picker-component .MuiFormLabel-root + .MuiInputBase-formControl {\n margin-top: 25px !important;\n}\n.data-picker-component .MuiInputBase-root.no-border {\n border: none !important;\n padding: 0 !important;\n width: fit-content !important;\n}\n.data-picker-component .MuiInputBase-root {\n color: #666666 !important;\n border: 1px solid grey;\n padding: 0.43rem 0.87rem;\n background-color: white !important;\n border-radius: 3px !important;\n}\n.data-picker-component .MuiInputBase-root.Mui-error {\n border: 1px solid #F24726 !important;\n}\n.data-picker-component .MuiInputBase-root:not(.Mui-disabled):hover {\n border: 1px solid grey;\n}\n.data-picker-component .MuiInputBase-root.Mui-focused {\n border: 1px solid #3299C7;\n}\n.data-picker-component .MuiInputBase-root .MuiInputBase-input {\n color: #666666 !important;\n background-color: white !important;\n}\n.data-picker-component .MuiInputBase-root .MuiInputBase-input::placeholder {\n text-overflow: ellipsis !important;\n color: #666666 !important;\n opacity: 1;\n}\n.data-picker-component .MuiInputBase-root .Mui-disabled {\n -webkit-text-fill-color: #666666 !important;\n}\n.data-picker-component .MuiFormHelperText-root {\n padding: 0 !important;\n font-size: 0.85rem !important;\n color: #666666;\n}";
3127
+ styleInject(css_248z$h);
3128
+
3129
+ var DatePickerComponent = function DatePickerComponent(props) {
3130
+ var _React$useState = React__default.useState(props.value),
3131
+ value = _React$useState[0],
3132
+ setValue = _React$useState[1];
3133
+
3134
+ var _React$useState2 = React__default.useState(false),
3135
+ hover = _React$useState2[0],
3136
+ setHover = _React$useState2[1];
3137
+
3138
+ return React__default.createElement(_.Box, {
3139
+ className: "data-picker-component",
3140
+ width: "100%"
3141
+ }, React__default.createElement(xDatePickers.LocalizationProvider, {
3142
+ dateAdapter: AdapterDayjs.AdapterDayjs
3143
+ }, React__default.createElement(xDatePickers.DatePicker, {
3144
+ value: value,
3145
+ maxDate: props.maxDate,
3146
+ minDate: props.minDate,
3147
+ disabled: props.disabled,
3148
+ inputFormat: props.inputFormat,
3149
+ inputRef: props.inputRef,
3150
+ disableMaskedInput: true,
3151
+ onChange: function onChange(d, e) {
3152
+ setValue(d);
3153
+ props.onChange(d, e);
3154
+ },
3155
+ renderDay: function renderDay(_day, _selectedDays, pickersDayProps) {
3156
+ return React__default.createElement(xDatePickers.PickersDay, Object.assign({}, pickersDayProps, {
3157
+ classes: {
3158
+ selected: 'main-background-color'
3159
+ }
3160
+ }));
3161
+ },
3162
+ renderInput: function renderInput(params) {
3163
+ var _params$InputProps;
3164
+
3165
+ return React__default.createElement(_.TextField, Object.assign({}, params, {
3166
+ onMouseEnter: function onMouseEnter() {
3167
+ return setHover(true);
3168
+ },
3169
+ onMouseLeave: function onMouseLeave() {
3170
+ return setHover(false);
3171
+ },
3172
+ name: props.name,
3173
+ error: props.error,
3174
+ id: props.id,
3175
+ label: props.label,
3176
+ className: props.className,
3177
+ required: props.required,
3178
+ variant: "standard",
3179
+ InputProps: {
3180
+ className: (props.noBorders ? 'no-border' : '') + " " + (!props.disabled && hover ? 'main-border-color' : ''),
3181
+ disableUnderline: true,
3182
+ startAdornment: props.startIcon,
3183
+ endAdornment: (_params$InputProps = params.InputProps) == null ? void 0 : _params$InputProps.endAdornment,
3184
+ classes: {
3185
+ focused: 'main-border-color'
3186
+ }
3187
+ },
3188
+ InputLabelProps: {
3189
+ shrink: true
3190
+ },
3191
+ helperText: props.helperText,
3192
+ fullWidth: props.fullWidth
3193
+ }));
3194
+ }
3195
+ })));
3196
+ };
3197
+ DatePickerComponent.defaultProps = {
3198
+ fullWidth: true
3199
+ };
3200
+
3124
3201
  exports.AppHeader = AppHeader;
3125
3202
  exports.AppSidebar = AppSidebar;
3126
3203
  exports.ButtonComponent = ButtonComponent;
3127
3204
  exports.ChangePasswordForm = ChangePasswordForm;
3205
+ exports.DatePickerComponent = DatePickerComponent;
3128
3206
  exports.DrawerSidebar = DrawerSidebar;
3129
3207
  exports.LinearProgressComponent = LinearProgressComponent;
3130
3208
  exports.LoginForm = LoginForm;