@mw-kit/mw-ui 1.7.95 → 1.7.97

package/dist/index.js

@@ -12229,7 +12229,7 @@ var EllipsisContainer$1 = function EllipsisContainer$1(props) {
 };
 
 var _templateObject$5, _templateObject2$5, _templateObject3$5, _templateObject4$3, _templateObject5$3, _templateObject6$2, _templateObject7$2, _templateObject8$1, _templateObject9$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1, _templateObject16$1, _templateObject17$1, _templateObject18$1, _templateObject19$1, _templateObject20$1, _templateObject21$1, _templateObject22$1;
-var IconContainer = styled__default.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  height: 17px;\n\n  background-color: transparent;\n  border: none;\n  box-shadow: none;\n  padding: 0;\n\n  cursor: auto;\n"])));
+var IconContainer = styled__default.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  height: 17px;\n\n  background-color: transparent;\n  border: none;\n  box-shadow: none;\n  padding: 0;\n"])));
 var ChildrenContainer = styled__default(EllipsisContainer$1)(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  bottom: 0;\n  left: 0;\n  line-height: 19px;\n  display: flex;\n  gap: calc(", " / 2);\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.spacings.s1;
@@ -13005,13 +13005,6 @@ var Delimiter = styled__default.div(_templateObject11$3 || (_templateObject11$3
   return theme.colors.greyishBlue;
 });
 
-var EmptyLabel = function EmptyLabel(_ref) {
-  var label = _ref.label;
-  return React__default.createElement(React__default.Fragment, {
-    children: label
-  });
-};
-
 var isVisible = function isVisible(elem, bound) {
   var docViewTop = bound.scrollTop;
   var docViewBottom = docViewTop + bound.offsetHeight;
@@ -13038,7 +13031,7 @@ var MenuComponent = function MenuComponent(props, ref) {
     if (isVisible(element, scrollRef)) return;
     scrollRef.scrollTo(0, element.offsetTop);
   }, [highlight, scrollRef]);
-  var absoluteContainerProps = filterObject(props, ['scrollSpacing', 'scrollTabIndex', 'label', 'rules', 'onClickOption', 'onScrollEnd', 'before', 'after', 'close', 'options', 'loading', 'children', 'emptyContent', 'highlight'], {
+  var absoluteContainerProps = filterObject(props, ['scrollSpacing', 'scrollTabIndex', 'onScrollEnd', 'before', 'after', 'close', 'options', 'loading', 'children', 'emptyContent', 'highlight'], {
     itemSpacing: 's1'
   });
   return React__default.createElement(Container$2, Object.assign({}, absoluteContainerProps, {
@@ -13066,23 +13059,23 @@ var MenuComponent = function MenuComponent(props, ref) {
     var onClick;
     var disabled = option.disabled;
 
-    var OptionContent = function OptionContent(_ref2) {
-      var children = _ref2.children;
+    var OptionContent = function OptionContent(_ref) {
+      var children = _ref.children;
       return children;
     };
 
     if (!disabled) {
-      var rule = (option.rules || props.rules || []).map(function (rule) {
+      var rule = (option.rules || []).map(function (rule) {
         return rule(index, data);
       }).find(function (result) {
         return result !== true;
       });
 
       if (rule === true || rule === undefined) {
-        var _onClick = option.onClick || props.onClickOption || function () {};
+        var _onClick = option.onClick || function () {};
 
         onClick = function onClick(e) {
-          _onClick(index, option.data, e);
+          _onClick(index, option, e);
 
           closeMenu();
         };
@@ -13090,8 +13083,8 @@ var MenuComponent = function MenuComponent(props, ref) {
         disabled = true;
 
         if (rule !== false) {
-          OptionContent = function OptionContent(_ref3) {
-            var children = _ref3.children;
+          OptionContent = function OptionContent(_ref2) {
+            var children = _ref2.children;
             return React__default.createElement(semanticUiReact.Popup, Object.assign({
               on: 'click',
               position: 'left center',
@@ -13112,7 +13105,14 @@ var MenuComponent = function MenuComponent(props, ref) {
     }
 
     OptionContent.displayName = 'OptionContent';
-    var LabelComponent = option.labelComponent || props.label || EmptyLabel;
+    var label = option.label;
+    var labelOptions = filterObject(option, ['onClick', 'label', 'rules']);
+    labelOptions.disabled = disabled;
+    var LabelComponent = typeof label === 'function' ? label : function () {
+      return React__default.createElement(React__default.Fragment, {
+        children: label
+      });
+    };
     return React__default.createElement(React__default.Fragment, {
       key: index
     }, React__default.createElement(OptionContent, null, React__default.createElement(Option, {
@@ -14646,9 +14646,9 @@ var EmptyContentContainer = styled__default.div(_templateObject3$d || (_template
 });
 var HiddenInput = styled__default.input(_templateObject4$a || (_templateObject4$a = _taggedTemplateLiteralLoose(["\n  width: 0;\n  height: 0;\n  border-width: 0;\n  padding: 0;\n  position: absolute;\n  outline: none;\n"])));
 
-var isAvailable = function isAvailable(index, option, rules) {
-  return !option.disabled && !(rules || []).some(function (rule) {
-    return rule(index, option) !== true;
+var isAvailable = function isAvailable(index, option) {
+  return !option.disabled && !(option.rules || []).some(function (rule) {
+    return rule(index, option.data) !== true;
   });
 };
 
@@ -14657,8 +14657,7 @@ var useNavigation = function useNavigation(props) {
       highlight = _props$highlight[0],
       setHighlight = _props$highlight[1],
       options = props.options,
-      onSelectHighlight = props.onSelectHighlight,
-      rules = props.rules;
+      onSelectHighlight = props.onSelectHighlight;
   var onKeyDown = React.useCallback(function (e) {
     if (e.key === 'ArrowDown') {
       e.preventDefault();
@@ -14667,7 +14666,7 @@ var useNavigation = function useNavigation(props) {
         var option = options[index];
         if (!option) return current;
 
-        if (isAvailable(index, option, rules)) {
+        if (isAvailable(index, option)) {
           return index;
         }
 
@@ -14684,7 +14683,7 @@ var useNavigation = function useNavigation(props) {
         var option = options[index];
         if (!option) return current;
 
-        if (isAvailable(index, option, rules)) {
+        if (isAvailable(index, option)) {
           return index;
         }
 
@@ -14702,10 +14701,12 @@ var useNavigation = function useNavigation(props) {
         onSelectHighlight(highlight, option);
       }
     }
-  }, [highlight, options, rules]);
+  }, [highlight, options]);
 
   var onFocus = function onFocus() {
-    setHighlight(0);
+    setHighlight(options.findIndex(function (e, i) {
+      return isAvailable(i, e);
+    }));
   };
 
   var onBlur = function onBlur() {
@@ -14754,22 +14755,40 @@ var Header$1 = function Header() {
   }));
 };
 
-var getOptions = function getOptions(options, selected) {
-  return options.map(function (option) {
+var getOptions = function getOptions(onSelect, options, selected) {
+  return options.map(function (option, index) {
+    var value = option.value,
+        onClick = option.onClick,
+        rules = option.rules,
+        disabled = option.disabled;
     var isSelected = option.value === (selected === null || selected === void 0 ? void 0 : selected.value);
-    var data = {
-      data: option.data,
-      value: option.value
-    };
+
+    var data = _extends({}, option.data, {
+      selected: isSelected,
+      value: value
+    });
+
+    var LabelComponent = option.label;
     var parsed = {
+      label: typeof LabelComponent !== 'function' ? LabelComponent : function (_ref) {
+        var disabled = _ref.disabled;
+        return React__default.createElement(LabelComponent, Object.assign({}, {
+          value: value,
+          data: data,
+          disabled: disabled
+        }));
+      },
+      onClick: onClick || function () {
+        onSelect(index, option);
+      },
+      disabled: disabled,
+      rules: rules,
       border: {
         left: {
           color: isSelected ? 'blue' : 'transparent'
         }
       },
       data: data,
-      label: option.label,
-      disabled: option.disabled,
       keepOpen: true
     };
     return parsed;
@@ -14786,32 +14805,28 @@ var getSelected = function getSelected(value, options) {
 };
 
 var getInputContent = function getInputContent(props, selectedOption) {
-  if (!props.optionLabel) return selectedOption.label;
-  var LabelComponent = props.optionLabel;
-  return React__default.createElement(LabelComponent, Object.assign({}, selectedOption, {
+  if (typeof selectedOption.label !== 'function') return selectedOption.label;
+  var LabelComponent = selectedOption.label;
+  return React__default.createElement(LabelComponent, {
+    data: _extends({}, selectedOption.data),
+    value: selectedOption.value,
     disabled: props.disabled || props.loading,
     mode: 'placeholder'
-  }));
+  });
 };
 
-var useSelect = function useSelect(props, _ref, _ref2, setOpen) {
-  var highlight = _ref[0],
-      setHighlight = _ref[1];
-  var options = _ref2[0],
-      setOptions = _ref2[1];
-
-  var _ref3 = typeof props.value === 'string' ? [getSelected(props.value, options), props.value] : [props.value, props.value.value],
-      selectedOption = _ref3[0],
-      value = _ref3[1];
+var useSelect = function useSelect(props, _ref2, _ref3, setOpen) {
+  var highlight = _ref2[0],
+      setHighlight = _ref2[1];
+  var options = _ref3[0],
+      setOptions = _ref3[1];
 
-  var parsedOptions = getOptions(options, selectedOption);
-
-  var onReset = function onReset() {};
-
-  var inputContent = selectedOption ? getInputContent(props, selectedOption) : props.value;
+  var _ref4 = typeof props.value === 'string' ? [getSelected(props.value, options), props.value] : [props.value, props.value.value],
+      selectedOption = _ref4[0],
+      value = _ref4[1];
 
   var onSelect = function onSelect(index, option) {
-    if (!isAvailable(index, option, props.rules)) {
+    if (!isAvailable(index, option)) {
       return;
     }
 
@@ -14820,6 +14835,11 @@ var useSelect = function useSelect(props, _ref, _ref2, setOpen) {
     setOpen(false);
   };
 
+  var parsedOptions = getOptions(onSelect, options, selectedOption);
+
+  var onReset = function onReset() {};
+
+  var inputContent = selectedOption ? getInputContent(props, selectedOption) : props.value;
   var parsed = {
     parsedOptions: parsedOptions,
     options: [options, setOptions],
@@ -14830,13 +14850,9 @@ var useSelect = function useSelect(props, _ref, _ref2, setOpen) {
       before: React__default.createElement(React__default.Fragment, null, React__default.createElement(Header$1, null), React__default.createElement(HiddenInput, Object.assign({}, useNavigation({
         highlight: [highlight, setHighlight],
         options: options,
-        onSelectHighlight: onSelect,
-        rules: props.rules
+        onSelectHighlight: onSelect
       })))),
-      maxHeight: props.maxHeight || props.search ? '238px' : '180px',
-      onClickOption: function onClickOption(index, option) {
-        onSelect(index, option);
-      }
+      maxHeight: props.maxHeight || props.search ? '238px' : '180px'
     },
     getContext: function getContext(base, children) {
       return React__default.createElement(Provider$1.Provider, {
@@ -14994,7 +15010,7 @@ var Label$2 = function Label(props) {
     checked: checked.findIndex(function (e) {
       return e.value === value;
     }) !== -1,
-    label: LabelComponent ? React__default.createElement(LabelComponent, Object.assign({}, props.option)) : props.option.label,
+    label: typeof LabelComponent !== 'function' ? LabelComponent : React__default.createElement(LabelComponent, Object.assign({}, props.option)),
     disabled: disabled,
     onChange: function onChange(event) {
       var isChecked = event.target.checked;
@@ -15027,16 +15043,28 @@ var Label$2 = function Label(props) {
   });
 };
 
-var getOptions$1 = function getOptions(options) {
+var getOptions$1 = function getOptions(options, value) {
   return options.map(function (option) {
+    var _label = option.label,
+        onClick = option.onClick;
     var data = {
       data: option.data,
       value: option.value
     };
     var parsed = {
+      label: function label(option) {
+        return React__default.createElement(Label$2, {
+          option: _extends({}, data, {
+            disabled: option.disabled
+          }),
+          label: _label,
+          value: value
+        });
+      },
+      onClick: onClick,
       data: data,
-      label: option.label,
       disabled: option.disabled,
+      rules: option.rules,
       keepOpen: true
     };
     return parsed;
@@ -15069,7 +15097,7 @@ var useSelectMultiple = function useSelectMultiple(props, _ref, _ref2) {
       checked = _useState[0],
       setChecked = _useState[1];
 
-  var parsedOptions = getOptions$1(options);
+  var parsedOptions = getOptions$1(options, initial);
   var inputContent = getInputContent$1(props.value);
 
   var onReset = function onReset() {
@@ -15077,7 +15105,7 @@ var useSelectMultiple = function useSelectMultiple(props, _ref, _ref2) {
   };
 
   var onSelectHighlight = function onSelectHighlight(index, option) {
-    if (!isAvailable(index, option, props.rules)) {
+    if (!isAvailable(index, option)) {
       return;
     }
 
@@ -15109,24 +15137,13 @@ var useSelectMultiple = function useSelectMultiple(props, _ref, _ref2) {
       before: React__default.createElement(React__default.Fragment, null, React__default.createElement(Header$2, null), React__default.createElement(HiddenInput, Object.assign({}, useNavigation({
         highlight: [highlight, setHighlight],
         options: options,
-        onSelectHighlight: onSelectHighlight,
-        rules: props.rules
+        onSelectHighlight: onSelectHighlight
       })))),
       after: {
         fluid: true,
         children: React__default.createElement(Footer$1, null)
       },
-      maxHeight: props.maxHeight || (props.selectAll ? '269px' : '224px'),
-      label: function label(option) {
-        return React__default.createElement(Label$2, {
-          option: _extends({}, option, {
-            value: option.data.value,
-            data: option.data.data
-          }),
-          label: props.optionLabel,
-          value: initial
-        });
-      }
+      maxHeight: props.maxHeight || (props.selectAll ? '269px' : '224px')
     },
     getContext: function getContext(base, children) {
       return React__default.createElement(Provider$2.Provider, {
@@ -15225,7 +15242,7 @@ var Select = React__default.forwardRef(function (props, ref) {
     setPage(1);
   };
 
-  var inputProps = filterObject(props, ['type', 'onScrollEnd', 'position', 'value', 'onClear', 'placeholder', 'initialLoader', 'onClickOption', 'rules', 'onScrollEnd', 'position', 'center', 'maxHeight', 'emptyContent', 'optionLabel']);
+  var inputProps = filterObject(props, ['type', 'onScrollEnd', 'position', 'value', 'onClear', 'placeholder', 'initialLoader', 'onScrollEnd', 'position', 'center', 'maxHeight', 'emptyContent']);
 
   var _onScrollEnd = props.onScrollEnd || function () {};
 
@@ -15347,11 +15364,6 @@ var Select = React__default.forwardRef(function (props, ref) {
   }, {
     children: inputContent
   })), React__default.createElement(Menu, Object.assign({}, menuProps, {
-    rules: (props.rules || []).map(function (rule) {
-      return function (index, data) {
-        return rule(index, data.data);
-      };
-    }),
     highlight: highlight,
     open: open,
     close: function close() {
@@ -15699,7 +15711,15 @@ var Component = React__default.forwardRef(function (props, ref) {
 
   var options = Object.keys(countries).map(function (iso) {
     return {
-      label: country.name,
+      label: function label(option) {
+        var country = option.data;
+        return React__default.createElement(Label$3, null, React__default.createElement(Flag, {
+          iso: iso
+        }), country.name, React__default.createElement("span", null, "+", country.ddi));
+      },
+      onClick: function onClick() {
+        setCountry(countries[iso]);
+      },
       data: countries[iso]
     };
   });
@@ -15765,16 +15785,6 @@ var Component = React__default.forwardRef(function (props, ref) {
       return setOpen(false);
     },
     options: options,
-    onClickOption: function onClickOption(_index, _ref) {
-      var iso = _ref.iso;
-      return setCountry(countries[iso]);
-    },
-    label: function label(option) {
-      var country = option.data;
-      return React__default.createElement(Label$3, null, React__default.createElement(Flag, {
-        iso: country.iso
-      }), country.name, React__default.createElement("span", null, "+", country.ddi));
-    },
     width: '100%',
     maxHeight: '165px',
     bordered: true,
@@ -16847,29 +16857,6 @@ var Component$1 = React__default.forwardRef(function (props, ref) {
     ref: ref,
     readOnly: true
   }));
-  var options = [{
-    label: 'Hoje',
-    data: {
-      intervalType: 'day'
-    }
-  }, {
-    label: 'Semana',
-    data: {
-      intervalType: 'week'
-    }
-  }, {
-    label: 'Mês',
-    data: {
-      intervalType: 'month'
-    }
-  }, {
-    label: 'Personalizado',
-    data: {
-      intervalType: 'custom'
-    },
-    keepOpen: true,
-    caret: true
-  }];
   return React__default.createElement(RelativeContainer$5, {
     ref: useOnClickOut(function () {
       return setOpen(null);
@@ -16930,16 +16917,33 @@ var Component$1 = React__default.forwardRef(function (props, ref) {
     references: {
       bottom: '35px'
     },
-    options: options,
-    onClickOption: function onClickOption(_index, _ref2) {
-      var intervalType = _ref2.intervalType;
-
-      if (intervalType === 'custom') {
-        setOpen('calendar');
-      } else {
-        setValue(intervalTypes[intervalType].initial(props.min));
-      }
-    },
+    options: [{
+      label: 'Hoje',
+      onClick: function onClick() {
+        return setValue(intervalTypes.day.initial(props.min));
+      },
+      data: {}
+    }, {
+      label: 'Semana',
+      onClick: function onClick() {
+        return setValue(intervalTypes.week.initial(props.min));
+      },
+      data: {}
+    }, {
+      label: 'Mês',
+      onClick: function onClick() {
+        return setValue(intervalTypes.month.initial(props.min));
+      },
+      data: {}
+    }, {
+      label: 'Personalizado',
+      onClick: function onClick() {
+        return setOpen('calendar');
+      },
+      data: {},
+      keepOpen: true,
+      caret: true
+    }],
     width: '165px',
     itemSpacing: 's3',
     bordered: true
@@ -16950,9 +16954,9 @@ var Component$1 = React__default.forwardRef(function (props, ref) {
     open: open === 'calendar',
     initialValue: value,
     onSubmit: {
-      onClick: function onClick(_ref3) {
-        var start = _ref3[0],
-            end = _ref3[1];
+      onClick: function onClick(_ref2) {
+        var start = _ref2[0],
+            end = _ref2[1];
         if (start === null || end === null) return;
         setValue([start, end]);
         setOpen(null);
@@ -17930,7 +17934,8 @@ var getInstance = function getInstance(props) {
     var _getOptions = function _getOptions(value) {
       try {
         var options = intialOptions.filter(function (option) {
-          return strCmp(option.label, value, {
+          var label = isString(option.label) ? option.label : option.label.text;
+          return strCmp(label, value, {
             contain: true
           });
         });
@@ -18095,8 +18100,9 @@ var Submenu = function Submenu(props) {
 
   var optionsParser = function optionsParser(option) {
     return {
-      label: option.label,
-      data: option.data
+      label: typeof option.label === 'string' ? option.label : option.label.element,
+      onClick: onClickOption,
+      data: {}
     };
   };
 
@@ -18114,8 +18120,6 @@ var Submenu = function Submenu(props) {
     close: close,
     width: isDynamic ? '275px' : '160px',
     height: '261px',
-    onClickOption: onClickOption,
-    label: props.optionLabel,
     containerSpacing: {
       top: 's3',
       left: 's1',
@@ -18160,11 +18164,16 @@ var FiltersMenu = function FiltersMenu(props) {
 
   var items = props.items.map(function (item) {
     return {
-      label: item.label,
+      label: typeof item.label === 'string' ? item.label : item.label.element,
       delimiter: item.delimiter,
       keepOpen: true,
       caret: true,
-      data: item
+      onClick: function onClick(index) {
+        setActive(function (prev) {
+          return prev === index ? -1 : index;
+        });
+      },
+      data: {}
     };
   });
   var selected = active >= 0 && active < props.items.length ? props.items[active] : undefined;
@@ -18178,12 +18187,6 @@ var FiltersMenu = function FiltersMenu(props) {
     close: close,
     width: '160px',
     maxHeight: '261px',
-    onClickOption: function onClickOption(index) {
-      setActive(function (prev) {
-        return prev === index ? -1 : index;
-      });
-    },
-    label: props.filterLabel,
     containerSpacing: {
       top: 's1',
       left: 's1',
@@ -18201,7 +18204,6 @@ var FiltersMenu = function FiltersMenu(props) {
     }
   }, props.containerProps || {}), React__default.createElement(Submenu, {
     item: selected,
-    optionLabel: props.optionLabel && selected ? props.optionLabel[selected.name] : undefined,
     close: function close() {
       return setActive(-1);
     },
@@ -18216,7 +18218,7 @@ var Filters = Object.assign(function (props) {
       setAppliedFilters = props.setAppliedFilters,
       containerProps = props.containerProps,
       subContainerProps = props.subContainerProps;
-  var buttonProps = filterObject(props, ['items', 'setAppliedFilters', 'filterLabel', 'optionLabel']);
+  var buttonProps = filterObject(props, ['items', 'setAppliedFilters']);
   return React__default.createElement(Button$5, Object.assign({}, buttonProps, {
     gap: 's4',
     getContent: function getContent(open, close) {
@@ -18226,9 +18228,7 @@ var Filters = Object.assign(function (props) {
         setAppliedFilters: setAppliedFilters,
         items: items,
         containerProps: containerProps,
-        subContainerProps: subContainerProps,
-        filterLabel: props.filterLabel,
-        optionLabel: props.optionLabel
+        subContainerProps: subContainerProps
       }));
     }
   }), "Filtros");