@mw-kit/mw-ui 1.7.12 → 1.7.13

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

@@ -1,13 +1,19 @@
 /// <reference types="react" />
 import { ElementOrString } from '../../../../interfaces';
 export interface SwitchProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type'> {
-    label?: ElementOrString;
+    label?: ElementOrString | {
+        label?: ElementOrString;
+        before?: ElementOrString;
+        after?: ElementOrString;
+    };
     required?: boolean;
     invalid?: boolean;
     type: 'switch';
 }
 export interface LabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
     disabled?: 1 | 0;
-    required?: 1 | 0;
     invalid?: 1 | 0;
 }
+export interface LabelContainerProps extends React.HTMLAttributes<HTMLDivElement> {
+    required?: 1 | 0;
+}

package/dist/components/Input/components/Switch/styles.d.ts

@@ -1,3 +1,3 @@
-import { LabelProps } from './interfaces';
-export declare const LabelContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+import { LabelContainerProps, LabelProps } from './interfaces';
+export declare const LabelContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, LabelContainerProps, never>;
 export declare const Label: import("styled-components").StyledComponent<"label", import("styled-components").DefaultTheme, LabelProps, never>;

package/dist/index.js

@@ -15414,25 +15414,25 @@ var DatePicker = React__default.forwardRef(function (props, ref) {
 DatePicker.displayName = 'DatePicker';
 
 var _templateObject$r, _templateObject2$k, _templateObject3$g, _templateObject4$d, _templateObject5$c, _templateObject6$a, _templateObject7$9;
-var LabelContainer$3 = styled__default.div(_templateObject$r || (_templateObject$r = _taggedTemplateLiteralLoose(["\n  ", "\n  line-height: 14px;\n  display: flex;\n  align-items: center;\n"])), function (_ref) {
+var LabelContainer$3 = styled__default.div(_templateObject$r || (_templateObject$r = _taggedTemplateLiteralLoose(["\n  ", "\n  line-height: 14px;\n  display: flex;\n  align-items: center;\n\n  ", "\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.useTypography('p');
+}, function (_ref2) {
+  var required = _ref2.required;
+  if (!required) return;
+  return styled.css(_templateObject2$k || (_templateObject2$k = _taggedTemplateLiteralLoose(["\n      :after {\n        content: '*';\n      }\n    "])));
 });
-var Label$3 = styled__default.label(_templateObject2$k || (_templateObject2$k = _taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: ", ";\n  position: relative;\n\n  ", "\n\n  ", "\n\n  ", "\n\n  > input {\n    position: absolute;\n    height: 0%;\n    width: 0%;\n    opacity: 0;\n  }\n\n  > span {\n    position: relative;\n    width: 50px;\n    height: calc(", " + 1px);\n    background-color: ", ";\n    border-radius: 20px;\n    transition-property: background-color;\n    transition-duration: 0.4s;\n    transition-timing-function: ease-in-out;\n    box-sizing: content-box;\n    :before {\n      content: '';\n      transition-property: left;\n      transition-duration: 0.4s;\n      transition-timing-function: ease-in-out;\n      position: absolute;\n      border-width: 1px;\n      border-style: solid;\n      border-radius: 100%;\n      left: 0;\n      box-shadow: 0px 1px 3px ", ";\n      width: calc(", " - 1px);\n      height: calc(", " - 1px);\n      background-color: ", ";\n    }\n  }\n\n  > input:checked + span {\n    :before {\n      left: calc(100% - ", " - 1px);\n    }\n  }\n"])), function (_ref2) {
-  var theme = _ref2.theme;
+var Label$3 = styled__default.label(_templateObject3$g || (_templateObject3$g = _taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: ", ";\n  position: relative;\n\n  ", "\n\n  ", "\n\n  > input {\n    position: absolute;\n    height: 0%;\n    width: 0%;\n    opacity: 0;\n  }\n\n  > span {\n    position: relative;\n    width: 50px;\n    height: calc(", " + 1px);\n    background-color: ", ";\n    border-radius: 20px;\n    transition-property: background-color;\n    transition-duration: 0.4s;\n    transition-timing-function: ease-in-out;\n    box-sizing: content-box;\n    :before {\n      content: '';\n      transition-property: left;\n      transition-duration: 0.4s;\n      transition-timing-function: ease-in-out;\n      position: absolute;\n      border-width: 1px;\n      border-style: solid;\n      border-radius: 100%;\n      left: 0;\n      box-shadow: 0px 1px 3px ", ";\n      width: calc(", " - 1px);\n      height: calc(", " - 1px);\n      background-color: ", ";\n    }\n  }\n\n  > input:checked + span {\n    :before {\n      left: calc(100% - ", " - 1px);\n    }\n  }\n"])), function (_ref3) {
+  var theme = _ref3.theme;
   return theme.spacings.s1;
-}, function (_ref3) {
-  var disabled = _ref3.disabled;
+}, function (_ref4) {
+  var disabled = _ref4.disabled;
 
   if (!disabled) {
-    return styled.css(_templateObject3$g || (_templateObject3$g = _taggedTemplateLiteralLoose(["\n        > span {\n          cursor: pointer;\n        }\n      "])));
+    return styled.css(_templateObject4$d || (_templateObject4$d = _taggedTemplateLiteralLoose(["\n        > span {\n          cursor: pointer;\n        }\n      "])));
   }
 
-  return styled.css(_templateObject4$d || (_templateObject4$d = _taggedTemplateLiteralLoose(["\n      opacity: 0.5;\n    "])));
-}, function (_ref4) {
-  var required = _ref4.required;
-  if (!required) return;
-  return styled.css(_templateObject5$c || (_templateObject5$c = _taggedTemplateLiteralLoose(["\n      > ", " {\n        :after {\n          content: '*';\n        }\n      }\n    "])), LabelContainer$3);
+  return styled.css(_templateObject5$c || (_templateObject5$c = _taggedTemplateLiteralLoose(["\n      opacity: 0.5;\n    "])));
 }, function (_ref5) {
   var invalid = _ref5.invalid;
 
@@ -15477,18 +15477,21 @@ var Label$3 = styled__default.label(_templateObject2$k || (_templateObject2$k =
 });
 
 var Switch = function Switch(props) {
-  var label = props.label,
-      disabled = props.disabled,
+  var disabled = props.disabled,
       required = props.required,
       invalid = props.invalid;
+  var label = isObject(props.label) ? props.label : {
+    label: props.label
+  };
   var htmlProps = filterObject(props, ['label', 'invalid', 'required']);
   return React__default.createElement(Label$3, {
     disabled: disabled ? 1 : 0,
-    required: required ? 1 : 0,
     invalid: invalid ? 1 : 0
-  }, React__default.createElement("input", Object.assign({}, htmlProps, {
+  }, label.label && React__default.createElement(LabelContainer$3, {
+    required: required ? 1 : 0
+  }, label.label), label.before && React__default.createElement(LabelContainer$3, null, label.before), React__default.createElement("input", Object.assign({}, htmlProps, {
     type: 'checkbox'
-  })), React__default.createElement("span", null), label && React__default.createElement(LabelContainer$3, null, label));
+  })), React__default.createElement("span", null), label.after && React__default.createElement(LabelContainer$3, null, label.after));
 };
 
 var _templateObject$s, _templateObject2$l, _templateObject3$h, _templateObject4$e, _templateObject5$d, _templateObject6$b, _templateObject7$a, _templateObject8$7, _templateObject9$7, _templateObject10$4, _templateObject11$3, _templateObject12$2, _templateObject13$2, _templateObject14$2, _templateObject15$1, _templateObject16;