@mw-kit/mw-ui 1.6.5 → 1.6.8

package/dist/components/Input/components/DateIntervalPicker/index.d.ts

@@ -1,4 +1,6 @@
 import React from 'react';
 import { DateIntervalPickerProps } from './interfaces';
-declare const DatePicker: React.ForwardRefExoticComponent<DateIntervalPickerProps & React.RefAttributes<HTMLInputElement>>;
+declare const DatePicker: React.ForwardRefExoticComponent<DateIntervalPickerProps & React.RefAttributes<HTMLInputElement>> & {
+    useDefaultDateIntervalState: () => [string, string];
+};
 export default DatePicker;

package/dist/components/Input/components/Input/interfaces.d.ts

@@ -26,6 +26,7 @@ export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement>
     arrows?: boolean;
     borderless?: boolean;
     paddingless?: boolean;
+    inputWidth?: string;
 }
 export interface StyledLabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
     required: 1 | 0;
@@ -43,4 +44,5 @@ export interface StyledInputProps extends Omit<React.InputHTMLAttributes<HTMLInp
     arrows: 1 | 0;
     borderless: 1 | 0;
     paddingless: 1 | 0;
+    width?: string;
 }

package/dist/components/Input/components/Phone/index.d.ts

@@ -1,5 +1,7 @@
 import React from 'react';
 import { Details, PhoneProps } from './interfaces';
-export declare const getDetails: (phone: string) => Details | null;
-declare const Phone: React.ForwardRefExoticComponent<PhoneProps & React.RefAttributes<HTMLInputElement>>;
+export declare const getPhoneDetails: (phone: string) => Details | null;
+declare const Phone: React.ForwardRefExoticComponent<PhoneProps & React.RefAttributes<HTMLInputElement>> & {
+    getPhoneDetails: (phone: string) => Details | null;
+};
 export default Phone;

package/dist/components/Input/components/Select/hooks/interfaces.d.ts

@@ -9,6 +9,8 @@ export interface CommonOption {
         element: ElementOrString;
     };
     value: string;
+    disabled?: boolean;
+    disabledText?: string;
 }
 export interface CommonProps extends Omit<InputProps, 'type' | 'mask' | 'icon' | 'setValue' | 'name' | 'value' | 'onChange'> {
     onScrollEnd?: () => Promise<void>;

package/dist/components/Input/index.d.ts

@@ -12,5 +12,8 @@ import { RangeProps } from './components/Range/interfaces';
 import { RadioButtonProps } from './components/RadioButton/interfaces';
 import { DateIntervalPickerProps } from './components/DateIntervalPicker/interfaces';
 export declare type Props = DateProps | TimeProps | CheckboxProps | SelectProps | PasswordProps | PhoneProps | DatePickerProps | RangeProps | DefaultInputProps | SwitchProps | RadioButtonProps | DateIntervalPickerProps;
-declare const Input: React.ForwardRefExoticComponent<(TimeProps & React.RefAttributes<HTMLInputElement>) | (DefaultInputProps & React.RefAttributes<HTMLInputElement>) | (DateProps & React.RefAttributes<HTMLInputElement>) | (CheckboxProps & React.RefAttributes<HTMLInputElement>) | (import("./components/Select/hooks/Select/interfaces").SelectProps & React.RefAttributes<HTMLInputElement>) | (import("./components/Select/hooks/SelectMultiple/interfaces").SelectProps & React.RefAttributes<HTMLInputElement>) | (PasswordProps & React.RefAttributes<HTMLInputElement>) | (PhoneProps & React.RefAttributes<HTMLInputElement>) | (DatePickerProps & React.RefAttributes<HTMLInputElement>) | (RangeProps & React.RefAttributes<HTMLInputElement>) | (SwitchProps & React.RefAttributes<HTMLInputElement>) | (RadioButtonProps & React.RefAttributes<HTMLInputElement>) | (DateIntervalPickerProps & React.RefAttributes<HTMLInputElement>)>;
+declare const Input: React.ForwardRefExoticComponent<(TimeProps & React.RefAttributes<HTMLInputElement>) | (DefaultInputProps & React.RefAttributes<HTMLInputElement>) | (DateProps & React.RefAttributes<HTMLInputElement>) | (CheckboxProps & React.RefAttributes<HTMLInputElement>) | (import("./components/Select/hooks/Select/interfaces").SelectProps & React.RefAttributes<HTMLInputElement>) | (import("./components/Select/hooks/SelectMultiple/interfaces").SelectProps & React.RefAttributes<HTMLInputElement>) | (PasswordProps & React.RefAttributes<HTMLInputElement>) | (PhoneProps & React.RefAttributes<HTMLInputElement>) | (DatePickerProps & React.RefAttributes<HTMLInputElement>) | (RangeProps & React.RefAttributes<HTMLInputElement>) | (SwitchProps & React.RefAttributes<HTMLInputElement>) | (RadioButtonProps & React.RefAttributes<HTMLInputElement>) | (DateIntervalPickerProps & React.RefAttributes<HTMLInputElement>)> & {
+    useDefaultDateIntervalState: () => [string, string];
+    getPhoneDetails: (phone: string) => import("./components/Phone/interfaces").Details | null;
+};
 export default Input;

package/dist/index.js

@@ -182,14 +182,15 @@ var dateToIsoString = function dateToIsoString(date, time, fullYear, pattern) {
 
   var dateData = [date.getDate().toString().padStart(2, '0'), (date.getMonth() + 1).toString().padStart(2, '0'), date.getFullYear().toString().padStart(4, '0')];
   if (fullYear === false) dateData[2] = dateData[2].substring(2, 4);
+  var dateStr = dateData.join('/');
 
   if (pattern === 'us') {
     var tmp = dateData[0];
     dateData[0] = dateData[2];
     dateData[2] = tmp;
+    dateStr = dateData.join('-');
   }
 
-  var dateStr = dateData.join('/');
   if (!time) return dateStr;
   var timeStr = [date.getHours().toString().padStart(2, '0'), date.getMinutes().toString().padStart(2, '0'), date.getSeconds().toString().padStart(2, '0')].join(':');
   return [dateStr, timeStr].join(' ');
@@ -12606,7 +12607,7 @@ var IconContainer = styled__default.button(_templateObject$c || (_templateObject
   if (!onClick || disabled) return;
   return styled.css(_templateObject2$a || (_templateObject2$a = _taggedTemplateLiteralLoose(["\n      cursor: pointer;\n    "])));
 });
-var Input = styled__default.input(_templateObject3$a || (_templateObject3$a = _taggedTemplateLiteralLoose(["\n  ", ";\n\n  color: ", ";\n\n  line-height: 17px;\n\n  ::placeholder {\n    color: ", ";\n\n    line-height: 17px;\n\n    ", "\n  }\n\n  width: 100%;\n  box-sizing: border-box;\n\n  ", ";\n\n  border-width: 1px;\n  border-style: solid;\n  border-color: ", ";\n  border-radius: 4px;\n\n  background-color: ", ";\n\n  box-shadow: none;\n  outline: none;\n\n  ", "\n\n  ", "\n"])), function (_ref2) {
+var Input = styled__default.input(_templateObject3$a || (_templateObject3$a = _taggedTemplateLiteralLoose(["\n  ", ";\n\n  color: ", ";\n\n  line-height: 17px;\n\n  ::placeholder {\n    color: ", ";\n\n    line-height: 17px;\n\n    ", "\n  }\n\n  display: block;\n  width: ", ";\n  box-sizing: border-box;\n\n  ", ";\n\n  border-width: 1px;\n  border-style: solid;\n  border-color: ", ";\n  border-radius: 4px;\n\n  background-color: ", ";\n\n  box-shadow: none;\n  outline: none;\n\n  ", "\n\n  ", "\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.useTypography('p');
 }, function (_ref3) {
@@ -12629,59 +12630,62 @@ var Input = styled__default.input(_templateObject3$a || (_templateObject3$a = _t
 
   return styled.css(_templateObject5$8 || (_templateObject5$8 = _taggedTemplateLiteralLoose(["\n        opacity: 0.5;\n        font-size: 14px;\n        letter-spacing: 0px;\n      "])));
 }, function (_ref7) {
-  var theme = _ref7.theme,
-      paddingless = _ref7.paddingless;
-  if (paddingless) return;
-  return styled.css(_templateObject6$6 || (_templateObject6$6 = _taggedTemplateLiteralLoose(["\n      padding: ", " ", ";\n    "])), theme.spacings.s2, theme.spacings.s3);
+  var width = _ref7.width;
+  return width || '100%';
 }, function (_ref8) {
   var theme = _ref8.theme,
-      invalid = _ref8.invalid,
-      borderless = _ref8.borderless;
-  if (borderless) return 'transparent';
-  return invalid ? theme.colors.warningRed : theme.colors.lightGrey;
+      paddingless = _ref8.paddingless;
+  if (paddingless) return;
+  return styled.css(_templateObject6$6 || (_templateObject6$6 = _taggedTemplateLiteralLoose(["\n      padding: ", " ", ";\n    "])), theme.spacings.s2, theme.spacings.s3);
 }, function (_ref9) {
   var theme = _ref9.theme,
-      invalid = _ref9.invalid;
-  return invalid ? theme.getColor('warningRed', 5) : theme.colors.white;
+      invalid = _ref9.invalid,
+      borderless = _ref9.borderless;
+  if (borderless) return 'transparent';
+  return invalid ? theme.colors.warningRed : theme.colors.lightGrey;
 }, function (_ref10) {
-  var arrows = _ref10.arrows;
+  var theme = _ref10.theme,
+      invalid = _ref10.invalid;
+  return invalid ? theme.getColor('warningRed', 5) : theme.colors.white;
+}, function (_ref11) {
+  var arrows = _ref11.arrows;
   if (arrows) return;
   return styled.css(_templateObject7$4 || (_templateObject7$4 = _taggedTemplateLiteralLoose(["\n      /* Chrome, Safari, Edge, Opera */\n      :-webkit-outer-spin-button,\n      :-webkit-inner-spin-button {\n        -webkit-appearance: none;\n        margin: 0;\n      }\n\n      /* Firefox */\n      -moz-appearance: textfield;\n    "])));
-}, function (_ref11) {
-  var readOnly = _ref11.readOnly,
-      onClick = _ref11.onClick,
-      disabled = _ref11.disabled;
+}, function (_ref12) {
+  var readOnly = _ref12.readOnly,
+      onClick = _ref12.onClick,
+      disabled = _ref12.disabled;
   if (!readOnly) return;
   return styled.css(_templateObject8$3 || (_templateObject8$3 = _taggedTemplateLiteralLoose(["\n      cursor: ", ";\n    "])), !onClick || disabled ? 'unset' : 'pointer');
 });
-var Label = styled__default.label(_templateObject9$3 || (_templateObject9$3 = _taggedTemplateLiteralLoose(["\n  ", ";\n\n  color: ", ";\n\n  width: ", ";\n  box-sizing: border-box;\n  position: relative;\n  display: block;\n\n  ", "\n\n  > div:first-child {\n    display: inline-block;\n    margin-bottom: ", ";\n\n    ", "\n  }\n\n  > ", " {\n    bottom: ", ";\n  }\n\n  ", "\n"])), function (_ref12) {
-  var theme = _ref12.theme;
-  return theme.useTypography('p');
-}, function (_ref13) {
+var Label = styled__default.label(_templateObject9$3 || (_templateObject9$3 = _taggedTemplateLiteralLoose(["\n  ", ";\n\n  color: ", ";\n\n  width: ", ";\n  box-sizing: border-box;\n  position: relative;\n  display: block;\n\n  ", "\n\n  > div:first-child {\n    display: inline-block;\n    margin-bottom: ", ";\n\n    ", "\n  }\n\n  > ", " {\n    bottom: ", ";\n  }\n\n  ", "\n"])), function (_ref13) {
   var theme = _ref13.theme;
-  return theme.colors.greyishBlue;
+  return theme.useTypography('p');
 }, function (_ref14) {
-  var width = _ref14.width;
-  return width || '100%';
+  var theme = _ref14.theme;
+  return theme.colors.greyishBlue;
 }, function (_ref15) {
-  var disabled = _ref15.disabled;
+  var width = _ref15.width;
+  return width || '100%';
+}, function (_ref16) {
+  var disabled = _ref16.disabled;
   if (!disabled) return;
   return styled.css(_templateObject10$2 || (_templateObject10$2 = _taggedTemplateLiteralLoose(["\n      opacity: 0.5;\n    "])));
-}, function (_ref16) {
-  var theme = _ref16.theme;
-  return theme.spacings.s1;
 }, function (_ref17) {
-  var required = _ref17.required;
+  var theme = _ref17.theme;
+  return theme.spacings.s1;
+}, function (_ref18) {
+  var required = _ref18.required;
   if (!required) return;
   return styled.css(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteralLoose(["\n        :after {\n          content: ' *';\n        }\n      "])));
-}, IconContainer, function (_ref18) {
-  var theme = _ref18.theme,
-      paddingless = _ref18.paddingless;
-  return paddingless ? '2px' : "calc(" + theme.spacings.s2 + " + 1px)";
-}, function (_ref19) {
+}, IconContainer, function (_ref19) {
   var theme = _ref19.theme,
-      icon = _ref19.icon,
       paddingless = _ref19.paddingless;
+  return paddingless ? '2px' : "calc(" + theme.spacings.s2 + " + 1px)";
+}, function (_ref20) {
+  var theme = _ref20.theme,
+      icon = _ref20.icon,
+      paddingless = _ref20.paddingless;
   if (!icon) return;
   var width = icon.width,
       position = icon.position;
@@ -12731,12 +12735,13 @@ var Input$1 = React__default.forwardRef(function (props, ref) {
     iconOnClick = props.icon.onClick;
   }
 
-  var inputProps = filterObject(props, ['label', 'invalid', 'required', 'icon', 'mask', 'loading', 'clearable', 'setValue', 'onPressEnter', 'htmlDisabled', 'width', 'arrows', 'borderless', 'paddingless'], {
+  var inputProps = filterObject(props, ['label', 'invalid', 'required', 'icon', 'mask', 'loading', 'clearable', 'setValue', 'onPressEnter', 'htmlDisabled', 'width', 'inputWidth', 'arrows', 'borderless', 'paddingless'], {
     invalid: intInvalid,
     type: 'text',
     arrows: intArrows,
     borderless: intBorderless,
-    paddingless: intPaddingless
+    paddingless: intPaddingless,
+    width: props.inputWidth
   });
 
   var onChange = inputProps.onChange || function () {};
@@ -12803,7 +12808,7 @@ var Input$1 = React__default.forwardRef(function (props, ref) {
   }
 
   if (loading) {
-    position = position || 'left';
+    position = position || 'right';
     icon = {
       type: 'jsx',
       icon: React__default.createElement(Loader, {
@@ -13790,7 +13795,15 @@ var getOptions$1 = function getOptions(options, checked, setChecked) {
         element: React__default.createElement(Checkbox, {
           type: 'checkbox',
           checked: checked.includes(option.value),
-          label: label.element,
+          label: option.disabled && option.disabledText ? React__default.createElement(semanticUiReact.Popup, {
+            on: 'click',
+            trigger: React__default.createElement("div", null, label.element),
+            content: option.disabledText,
+            position: 'left center',
+            inverted: true,
+            wide: true
+          }) : label.element,
+          disabled: option.disabled,
           onChange: function onChange(event) {
             var isChecked = event.target.checked;
             setChecked(function (prev) {
@@ -14289,7 +14302,7 @@ var Label$2 = styled__default.div(_templateObject3$e || (_templateObject3$e = _t
   return theme.colors.darkestGrey;
 });
 
-var getDetails = function getDetails(phone) {
+var getPhoneDetails = function getPhoneDetails(phone) {
   if (!notEmptyString(phone)) return null;
   var splitted = phone.replace(/[^0-9\s]/g, '').split(' ');
   if (splitted.length < 2) return null;
@@ -14336,7 +14349,7 @@ var Button$2 = function Button(props) {
   }));
 };
 
-var Phone = React__default.forwardRef(function (props, ref) {
+var Component = React__default.forwardRef(function (props, ref) {
   var value = props.value,
       setValue = props.setValue;
 
@@ -14353,7 +14366,7 @@ var Phone = React__default.forwardRef(function (props, ref) {
       setOpen = _useState3[1];
 
   React.useEffect(function () {
-    var details = getDetails(value || '');
+    var details = getPhoneDetails(value || '');
     setCountry(details ? details.country : countries.br);
   }, [value]);
   var options = Object.keys(countries).map(function (iso) {
@@ -14378,7 +14391,7 @@ var Phone = React__default.forwardRef(function (props, ref) {
   };
 
   React.useEffect(function () {
-    var details = getDetails(value || '');
+    var details = getPhoneDetails(value || '');
     setCountry(details ? details.country : countries.br);
   }, [value]);
   React.useEffect(function () {
@@ -14437,7 +14450,10 @@ var Phone = React__default.forwardRef(function (props, ref) {
     }
   }));
 });
-Phone.displayName = 'Phone';
+Component.displayName = 'Phone';
+var Phone = Object.assign(Component, {
+  getPhoneDetails: getPhoneDetails
+});
 
 var _templateObject$l, _templateObject2$h, _templateObject3$f, _templateObject4$c, _templateObject5$b, _templateObject6$9, _templateObject7$7, _templateObject8$5, _templateObject9$5;
 var RelativeContainer$4 = styled__default.div(_templateObject$l || (_templateObject$l = _taggedTemplateLiteralLoose(["\n  position: relative;\n\n  input {\n    color: transparent;\n  }\n"])));
@@ -15111,8 +15127,8 @@ var intervalTypes = {
       var start = new Date(base);
       start.setDate(start.getDate() - start.getUTCDay());
       start.setHours(0, 0, 0, 0);
-      var end = new Date(base);
-      end.setDate(start.getDate() - start.getUTCDay() + 6);
+      var end = new Date(start);
+      end.setDate(start.getDate() + 6);
       end.setHours(23, 59, 59, 0);
       return [start, end];
     },
@@ -15152,7 +15168,7 @@ var intervalTypes = {
       var start = new Date(base);
       start.setDate(1);
       start.setHours(0, 0, 0, 0);
-      var end = new Date(base);
+      var end = new Date(start);
       end.setMonth(end.getMonth() + 1);
       end.setDate(0);
       end.setHours(23, 59, 59, 0);
@@ -15173,7 +15189,7 @@ var intervalTypes = {
       start.setDate(1);
       start.setMonth(start.getMonth() - 1);
       var end = new Date(start);
-      end.setMonth(end.getMonth() - 1);
+      end.setMonth(end.getMonth() + 1);
       end.setDate(0);
       end.setHours(23, 59, 59, 0);
       return [start, end];
@@ -15275,7 +15291,7 @@ var Button$4 = styled__default.button(_templateObject9$7 || (_templateObject9$7
   return styled.css(_templateObject10$5 || (_templateObject10$5 = _taggedTemplateLiteralLoose(["\n      :not(:disabled) {\n        cursor: pointer;\n      }\n    "])));
 });
 
-var DatePicker$1 = React__default.forwardRef(function (props, ref) {
+var Component$1 = React__default.forwardRef(function (props, ref) {
   var value = parse(props.value);
   var disabled = props.disabled || props.loading;
 
@@ -15452,9 +15468,21 @@ var DatePicker$1 = React__default.forwardRef(function (props, ref) {
     time: {}
   }));
 });
-DatePicker$1.displayName = 'DatePicker';
+Component$1.displayName = 'DatePicker';
+
+var useDefaultDateIntervalState = function useDefaultDateIntervalState() {
+  var start = new Date();
+  start.setHours(0, 0, 0, 0);
+  var end = new Date();
+  end.setHours(23, 59, 59, 0);
+  return [start.toISOString(), end.toISOString()];
+};
 
-var Input$3 = React__default.forwardRef(function (props, ref) {
+var DatePicker$1 = Object.assign(Component$1, {
+  useDefaultDateIntervalState: useDefaultDateIntervalState
+});
+
+var Component$2 = React__default.forwardRef(function (props, ref) {
   switch (props.type) {
     case 'date':
       {
@@ -15544,7 +15572,11 @@ var Input$3 = React__default.forwardRef(function (props, ref) {
       }
   }
 });
-Input$3.displayName = 'Input';
+Component$2.displayName = 'Input';
+var Input$3 = Object.assign(Component$2, {
+  useDefaultDateIntervalState: DatePicker$1.useDefaultDateIntervalState,
+  getPhoneDetails: Phone.getPhoneDetails
+});
 
 var Portal = function Portal(props) {
   var id = props.id,