@tenancy.nz/ui 1.0.1 → 1.0.3

package/dist/cjs/components/Select.cjs

@@ -3,61 +3,81 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var _rollupPluginBabelHelpers = require('../_virtual/_rollupPluginBabelHelpers.cjs');
 var jsxRuntime = require('react/jsx-runtime');
 var uuid = require('react-uuid');
 var KeyboardArrowDownIcon = require('@mui/icons-material/KeyboardArrowDown');
 var FormControl = require('./FormControl.cjs');
 var Select_styled = require('./Select.styled.cjs');
 
-function Select({
-  color = "default",
-  disabled = false,
-  edges = "smooth",
-  errorMessage = "",
-  fullWidth = true,
-  helperText = "",
-  id = void 0,
-  inputRef = void 0,
-  inputProps = {},
-  label = void 0,
-  IconComponent = void 0,
-  message = "",
-  MenuProps = {},
-  name,
-  native = false,
-  placeholder = "",
-  required = false,
-  showError = false,
-  size = "medium",
-  readOnly = false,
-  options = [],
-  ...rest
-}) {
-  const allowEmpty = !!placeholder;
-  const inputAttrs = {
-    ...readOnly && { readOnly },
-    ...inputProps
-  };
-  const props = {
+var _excluded = ["color", "disabled", "edges", "errorMessage", "fullWidth", "helperText", "id", "inputRef", "inputProps", "label", "IconComponent", "message", "MenuProps", "name", "native", "placeholder", "required", "showError", "size", "readOnly", "options"],
+  _excluded2 = ["label"];
+function Select(_ref) {
+  var _ref$color = _ref.color,
+    color = _ref$color === void 0 ? "default" : _ref$color,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    _ref$edges = _ref.edges,
+    edges = _ref$edges === void 0 ? "smooth" : _ref$edges,
+    _ref$errorMessage = _ref.errorMessage,
+    errorMessage = _ref$errorMessage === void 0 ? "" : _ref$errorMessage,
+    _ref$fullWidth = _ref.fullWidth,
+    fullWidth = _ref$fullWidth === void 0 ? true : _ref$fullWidth,
+    _ref$helperText = _ref.helperText,
+    helperText = _ref$helperText === void 0 ? "" : _ref$helperText,
+    _ref$id = _ref.id,
+    id = _ref$id === void 0 ? void 0 : _ref$id,
+    _ref$inputRef = _ref.inputRef,
+    inputRef = _ref$inputRef === void 0 ? void 0 : _ref$inputRef,
+    _ref$inputProps = _ref.inputProps,
+    inputProps = _ref$inputProps === void 0 ? {} : _ref$inputProps,
+    _ref$label = _ref.label,
+    label = _ref$label === void 0 ? void 0 : _ref$label,
+    _ref$IconComponent = _ref.IconComponent,
+    IconComponent = _ref$IconComponent === void 0 ? void 0 : _ref$IconComponent,
+    _ref$message = _ref.message,
+    message = _ref$message === void 0 ? "" : _ref$message,
+    _ref$MenuProps = _ref.MenuProps,
+    MenuProps = _ref$MenuProps === void 0 ? {} : _ref$MenuProps,
+    name = _ref.name,
+    _ref$native = _ref.native,
+    native = _ref$native === void 0 ? false : _ref$native,
+    _ref$placeholder = _ref.placeholder,
+    placeholder = _ref$placeholder === void 0 ? "" : _ref$placeholder,
+    _ref$required = _ref.required,
+    required = _ref$required === void 0 ? false : _ref$required,
+    _ref$showError = _ref.showError,
+    showError = _ref$showError === void 0 ? false : _ref$showError,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? "medium" : _ref$size,
+    _ref$readOnly = _ref.readOnly,
+    readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
+    _ref$options = _ref.options,
+    options = _ref$options === void 0 ? [] : _ref$options,
+    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+  var allowEmpty = !!placeholder;
+  var inputAttrs = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, readOnly && {
+    readOnly: readOnly
+  }), inputProps);
+  var props = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({
     color: showError ? "error" : color,
-    disabled,
+    disabled: disabled,
     $edges: edges,
-    fullWidth,
+    fullWidth: fullWidth,
     id: id || name,
     inputProps: inputAttrs,
-    inputRef,
-    name,
-    placeholder,
-    required,
+    inputRef: inputRef,
+    name: name,
+    placeholder: placeholder,
+    required: required,
     error: showError,
-    readOnly,
-    size,
-    ...rest,
-    allowEmpty,
+    readOnly: readOnly,
+    size: size
+  }, rest), {}, {
+    allowEmpty: allowEmpty,
     displayEmpty: allowEmpty,
-    native,
-    MenuProps: {
-      ...MenuProps,
+    native: native,
+    MenuProps: _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, MenuProps), {}, {
       anchorOrigin: {
         vertical: "bottom",
         horizontal: "center"
@@ -67,39 +87,45 @@ function Select({
         horizontal: "center"
       },
       marginThreshold: 0
-    },
+    }),
     IconComponent: IconComponent || KeyboardArrowDownIcon
-  };
-  const renderValue = (selected) => {
+  });
+  var renderValue = function renderValue(selected) {
     if (!selected) {
-      return /* @__PURE__ */ jsxRuntime.jsx(Select_styled.StyledPlaceholder, { children: placeholder });
+      return /* @__PURE__ */jsxRuntime.jsx(Select_styled.StyledPlaceholder, {
+        children: placeholder
+      });
     }
-    return /* @__PURE__ */ jsxRuntime.jsx(Select_styled.StyledSelectValue, { children: selected });
+    return /* @__PURE__ */jsxRuntime.jsx(Select_styled.StyledSelectValue, {
+      children: selected
+    });
   };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    FormControl.default,
-    {
-      color,
-      id: props.id,
-      label,
-      helperText,
-      showError,
-      message: errorMessage || message,
-      fullWidth,
-      disabled,
-      required,
-      size,
-      children: /* @__PURE__ */ jsxRuntime.jsx(Select_styled.default, { renderValue, ...props, variant: "outlined", children: options.map(({ label: optionLabel, ...others }) => /* @__PURE__ */ jsxRuntime.jsx(
-        Select_styled.StyledSelectOption,
-        {
-          ...others,
-          ...native && { as: "option" },
+  return /* @__PURE__ */jsxRuntime.jsx(FormControl.default, {
+    color: color,
+    id: props.id,
+    label: label,
+    helperText: helperText,
+    showError: showError,
+    message: errorMessage || message,
+    fullWidth: fullWidth,
+    disabled: disabled,
+    required: required,
+    size: size,
+    children: /* @__PURE__ */jsxRuntime.jsx(Select_styled.default, _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({
+      renderValue: renderValue
+    }, props), {}, {
+      variant: "outlined",
+      children: options.map(function (_ref2) {
+        var optionLabel = _ref2.label,
+          others = _rollupPluginBabelHelpers.objectWithoutProperties(_ref2, _excluded2);
+        return /* @__PURE__ */jsxRuntime.jsx(Select_styled.StyledSelectOption, _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, others), native && {
+          as: "option"
+        }), {}, {
           children: optionLabel
-        },
-        uuid()
-      )) })
-    }
-  );
+        }), uuid());
+      })
+    }))
+  });
 }
 
 exports.default = Select;

package/dist/cjs/components/Select.styled.cjs

@@ -3,6 +3,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var _rollupPluginBabelHelpers = require('../_virtual/_rollupPluginBabelHelpers.cjs');
 var react = require('@emotion/react');
 require('@emotion/styled');
 var styles = require('@mui/material/styles');
@@ -11,90 +12,54 @@ var Select = require('@mui/material/Select');
 var TextInput_styled = require('./TextInput.styled.cjs');
 var object = require('../utils/helpers/object.cjs');
 
-const hoverStyles = react.css`
-  border-color: #1f1c4f;
-`;
-const focusStyles = ({ color, theme }) => react.css`
-  box-shadow: 0px 0px 6px 0px
-    ${object.getObjectProp(theme, `vars.palette.${color}.main`)};
-  border-color: ${object.getObjectProp(theme, `vars.palette.${color}.main`)};
-`;
-const StyledPlaceholder = styles.styled(
-  "span"
-)`
-  ${({ disabled, theme }) => react.css`
-    color: ${object.getObjectProp(theme, "vars.palette.grey.600")};
-
-    ${disabled && `
-      color: ${object.getObjectProp(theme, "vars.palette.grey.600")};
-    `}
-  `}
-`;
-const StyledSelectValue = styles.styled(
-  "span"
-)`
-  ${({ disabled, theme }) => react.css`
-    color: ${object.getObjectProp(theme, "vars.palette.text.primary")};
-
-    ${disabled && `
-      color: ${object.getObjectProp(theme, "vars.palette.grey.600")};
-    `}
-  `}
-`;
-const StyledSelectOption = styles.styled(
-  MuiMenuItem
-)`
-  ${({ theme }) => react.css`
-    color: ${object.getObjectProp(theme, "vars.palette.text.primary")};
-  `}
-`;
-const StyledSelect = styles.styled(Select)`
-  ${({ color, disabled, $edges, multiline, readOnly, size, theme }) => react.css`
-    font-weight: 400;
-    color: ${object.getObjectProp(theme, "vars.palette.text.primary")};
-    ${TextInput_styled.edgesStyles({ edges: $edges, theme })}
-    ${TextInput_styled.sizeStyles({ size, multiline, theme })}
-
-    .MuiSvgIcon-root,
-    .MuiSelect-select {
-      z-index: 2;
-    }
-
-    .MuiSelect-select {
-      padding-left: 0px;
-    }
-
-    .MuiNativeSelect-select {
-      padding-left: 0px;
-      padding-top: 0px;
-      padding-bottom: 0px;
-    }
-
-    fieldset {
-      ${TextInput_styled.colorStyles({ color, theme })}
-    }
-
-    &&:hover fieldset {
-      ${!disabled && !readOnly && hoverStyles}
-    }
-
-    &&.Mui-focused fieldset {
-      ${!disabled && !readOnly && focusStyles({ color: color === "default" ? "info" : color, theme })}
-    }
-
-    &&.Mui-readOnly fieldset {
-      ${!disabled && readOnly && TextInput_styled.readOnlyStyles({ theme })}
-      border: 1px solid ${object.getObjectProp(theme, "vars.palette.grey.600")};
-    }
-
-    &&.Mui-disabled {
-      color: ${object.getObjectProp(theme, "vars.palette.grey.600")};
-      fieldset {
-        ${disabled && TextInput_styled.disabledStyles({ theme })}
-      }
-    }
-  `}
-`;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0;
+var hoverStyles = react.css(_templateObject || (_templateObject = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n  border-color: #1f1c4f;\n"])));
+var focusStyles = function focusStyles(_ref) {
+  var color = _ref.color,
+    theme = _ref.theme;
+  return react.css(_templateObject2 || (_templateObject2 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n  box-shadow: 0px 0px 6px 0px\n    ", ";\n  border-color: ", ";\n"])), object.getObjectProp(theme, "vars.palette.".concat(color, ".main")), object.getObjectProp(theme, "vars.palette.".concat(color, ".main")));
+};
+var StyledPlaceholder = styles.styled("span")(_templateObject3 || (_templateObject3 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n  ", "\n"])), function (_ref2) {
+  var disabled = _ref2.disabled,
+    theme = _ref2.theme;
+  return react.css(_templateObject4 || (_templateObject4 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    color: ", ";\n\n    ", "\n  "])), object.getObjectProp(theme, "vars.palette.grey.600"), disabled && "\n      color: ".concat(object.getObjectProp(theme, "vars.palette.grey.600"), ";\n    "));
+});
+var StyledSelectValue = styles.styled("span")(_templateObject5 || (_templateObject5 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n  ", "\n"])), function (_ref3) {
+  var disabled = _ref3.disabled,
+    theme = _ref3.theme;
+  return react.css(_templateObject6 || (_templateObject6 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    color: ", ";\n\n    ", "\n  "])), object.getObjectProp(theme, "vars.palette.text.primary"), disabled && "\n      color: ".concat(object.getObjectProp(theme, "vars.palette.grey.600"), ";\n    "));
+});
+var StyledSelectOption = styles.styled(MuiMenuItem)(_templateObject7 || (_templateObject7 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n  ", "\n"])), function (_ref4) {
+  var theme = _ref4.theme;
+  return react.css(_templateObject8 || (_templateObject8 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    color: ", ";\n  "])), object.getObjectProp(theme, "vars.palette.text.primary"));
+});
+var StyledSelect = styles.styled(Select)(_templateObject9 || (_templateObject9 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n  ", "\n"])), function (_ref5) {
+  var color = _ref5.color,
+    disabled = _ref5.disabled,
+    $edges = _ref5.$edges,
+    multiline = _ref5.multiline,
+    readOnly = _ref5.readOnly,
+    size = _ref5.size,
+    theme = _ref5.theme;
+  return react.css(_templateObject0 || (_templateObject0 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    font-weight: 400;\n    color: ", ";\n    ", "\n    ", "\n\n    .MuiSvgIcon-root,\n    .MuiSelect-select {\n      z-index: 2;\n    }\n\n    .MuiSelect-select {\n      padding-left: 0px;\n    }\n\n    .MuiNativeSelect-select {\n      padding-left: 0px;\n      padding-top: 0px;\n      padding-bottom: 0px;\n    }\n\n    fieldset {\n      ", "\n    }\n\n    &&:hover fieldset {\n      ", "\n    }\n\n    &&.Mui-focused fieldset {\n      ", "\n    }\n\n    &&.Mui-readOnly fieldset {\n      ", "\n      border: 1px solid ", ";\n    }\n\n    &&.Mui-disabled {\n      color: ", ";\n      fieldset {\n        ", "\n      }\n    }\n  "])), object.getObjectProp(theme, "vars.palette.text.primary"), TextInput_styled.edgesStyles({
+    edges: $edges,
+    theme: theme
+  }), TextInput_styled.sizeStyles({
+    size: size,
+    multiline: multiline,
+    theme: theme
+  }), TextInput_styled.colorStyles({
+    color: color,
+    theme: theme
+  }), !disabled && !readOnly && hoverStyles, !disabled && !readOnly && focusStyles({
+    color: color === "default" ? "info" : color,
+    theme: theme
+  }), !disabled && readOnly && TextInput_styled.readOnlyStyles({
+    theme: theme
+  }), object.getObjectProp(theme, "vars.palette.grey.600"), object.getObjectProp(theme, "vars.palette.grey.600"), disabled && TextInput_styled.disabledStyles({
+    theme: theme
+  }));
+});
 
 exports.StyledPlaceholder = StyledPlaceholder;
 exports.StyledSelectOption = StyledSelectOption;

package/dist/cjs/components/Skeleton.cjs

@@ -3,21 +3,32 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var _rollupPluginBabelHelpers = require('../_virtual/_rollupPluginBabelHelpers.cjs');
 var jsxRuntime = require('react/jsx-runtime');
 var Skeleton$1 = require('@mui/material/Skeleton');
 
-function Skeleton({
-  animation = "pulse",
-  children = void 0,
-  light = false,
-  variant = "text",
-  ...others
-}) {
-  const rest = { animation, variant, ...others };
-  const styles = {
-    ...light && { backgroundColor: "rgba(255, 255, 255, 0.13)" }
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(Skeleton$1, { ...rest, sx: styles, children });
+var _excluded = ["animation", "children", "light", "variant"];
+function Skeleton(_ref) {
+  var _ref$animation = _ref.animation,
+    animation = _ref$animation === void 0 ? "pulse" : _ref$animation,
+    _ref$children = _ref.children,
+    children = _ref$children === void 0 ? void 0 : _ref$children,
+    _ref$light = _ref.light,
+    light = _ref$light === void 0 ? false : _ref$light,
+    _ref$variant = _ref.variant,
+    variant = _ref$variant === void 0 ? "text" : _ref$variant,
+    others = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+  var rest = _rollupPluginBabelHelpers.objectSpread2({
+    animation: animation,
+    variant: variant
+  }, others);
+  var styles = _rollupPluginBabelHelpers.objectSpread2({}, light && {
+    backgroundColor: "rgba(255, 255, 255, 0.13)"
+  });
+  return /* @__PURE__ */jsxRuntime.jsx(Skeleton$1, _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, rest), {}, {
+    sx: styles,
+    children: children
+  }));
 }
 
 exports.default = Skeleton;

package/dist/cjs/components/StatusMessage.cjs

@@ -3,25 +3,30 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var _rollupPluginBabelHelpers = require('../_virtual/_rollupPluginBabelHelpers.cjs');
 var jsxRuntime = require('react/jsx-runtime');
 var Alert = require('./Alert.cjs');
 
-function StatusMessage({
-  children,
-  color = "info",
-  sx = {}
-}) {
-  const styles = {
-    color: `${color}.main`,
+function StatusMessage(_ref) {
+  var children = _ref.children,
+    _ref$color = _ref.color,
+    color = _ref$color === void 0 ? "info" : _ref$color,
+    _ref$sx = _ref.sx,
+    sx = _ref$sx === void 0 ? {} : _ref$sx;
+  var styles = _rollupPluginBabelHelpers.objectSpread2({
+    color: "".concat(color, ".main"),
     border: "none",
     background: "none",
     padding: "0px",
     "& .MuiAlert-icon": {
-      color: `${color}.main`
-    },
-    ...sx
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(Alert.default, { variant: "standard", sx: styles, children });
+      color: "".concat(color, ".main")
+    }
+  }, sx);
+  return /* @__PURE__ */jsxRuntime.jsx(Alert.default, {
+    variant: "standard",
+    sx: styles,
+    children: children
+  });
 }
 
 exports.default = StatusMessage;

package/dist/cjs/components/StepIcon.cjs

@@ -3,6 +3,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var _rollupPluginBabelHelpers = require('../_virtual/_rollupPluginBabelHelpers.cjs');
 var jsxRuntime = require('react/jsx-runtime');
 require('react');
 var PropTypes = require('prop-types');
@@ -10,23 +11,39 @@ var useMediaQuery = require('@mui/material/useMediaQuery');
 var CheckIcon = require('@mui/icons-material/Check');
 var StepIcon_styled = require('./StepIcon.styled.cjs');
 
-function StepIcon({ active, completed, error, icon }) {
-  const isMobile = useMediaQuery((theme) => theme.breakpoints.down("sm"));
-  const commonProps = {
-    active,
-    completed,
-    error,
-    isMobile
+function StepIcon(_ref) {
+  var active = _ref.active,
+    completed = _ref.completed,
+    error = _ref.error,
+    icon = _ref.icon;
+  var isMobile = useMediaQuery(function (theme) {
+    return theme.breakpoints.down("sm");
+  });
+  var commonProps = {
+    active: active,
+    completed: completed,
+    error: error,
+    isMobile: isMobile
   };
-  return /* @__PURE__ */ jsxRuntime.jsx(StepIcon_styled.StyledContainer, { ...commonProps, children: (() => {
-    if (error) {
-      return /* @__PURE__ */ jsxRuntime.jsx(StepIcon_styled.StyledText, { align: "center", ...commonProps, children: "!" });
-    }
-    if (completed && !active) {
-      return /* @__PURE__ */ jsxRuntime.jsx(CheckIcon, {});
-    }
-    return /* @__PURE__ */ jsxRuntime.jsx(StepIcon_styled.StyledText, { align: "center", ...commonProps, children: icon });
-  })() });
+  return /* @__PURE__ */jsxRuntime.jsx(StepIcon_styled.StyledContainer, _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, commonProps), {}, {
+    children: function () {
+      if (error) {
+        return /* @__PURE__ */jsxRuntime.jsx(StepIcon_styled.StyledText, _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({
+          align: "center"
+        }, commonProps), {}, {
+          children: "!"
+        }));
+      }
+      if (completed && !active) {
+        return /* @__PURE__ */jsxRuntime.jsx(CheckIcon, {});
+      }
+      return /* @__PURE__ */jsxRuntime.jsx(StepIcon_styled.StyledText, _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({
+        align: "center"
+      }, commonProps), {}, {
+        children: icon
+      }));
+    }()
+  }));
 }
 StepIcon.propTypes = {
   /**

package/dist/cjs/components/StepIcon.styled.cjs

@@ -4,7 +4,7 @@
 var styles = require('@mui/material/styles');
 var Typography = require('@mui/material/Typography');
 
-const backgroundColorStyles = (active, completed, error, theme) => {
+var backgroundColorStyles = function backgroundColorStyles(active, completed, error, theme) {
   if (active || completed) {
     return theme.palette.primary.main;
   }
@@ -13,23 +13,28 @@ const backgroundColorStyles = (active, completed, error, theme) => {
   }
   return "#fff";
 };
-const borderStyles = (active, completed, error, theme) => {
+var borderStyles = function borderStyles(active, completed, error, theme) {
   if (active || completed) {
-    return `1px solid ${theme.palette.primary.main}`;
+    return "1px solid ".concat(theme.palette.primary.main);
   }
   if (!completed || error) {
-    return `1px solid ${theme.palette.secondary.main}`;
+    return "1px solid ".concat(theme.palette.secondary.main);
   }
-  return `1px solid ${theme.palette.grey[400]}`;
+  return "1px solid ".concat(theme.palette.grey[400]);
 };
-const textColorStyles = (active, completed, error, theme) => {
+var textColorStyles = function textColorStyles(active, completed, error, theme) {
   if (!active && !error && !completed) {
     return theme.palette.secondary.main;
   }
   return "#fff";
 };
-const StyledContainer = styles.styled("div")(
-  ({ active, completed, error, isMobile, theme }) => ({
+var StyledContainer = styles.styled("div")(function (_ref) {
+  var active = _ref.active,
+    completed = _ref.completed,
+    error = _ref.error,
+    isMobile = _ref.isMobile,
+    theme = _ref.theme;
+  return {
     borderRadius: 99,
     height: isMobile ? 32 : 50,
     width: isMobile ? 32 : 50,
@@ -43,15 +48,20 @@ const StyledContainer = styles.styled("div")(
     "& svg": {
       color: "#fff"
     }
-  })
-);
-const StyledText = styles.styled(Typography)(
-  ({ active, completed, error, isMobile, theme }) => ({
+  };
+});
+var StyledText = styles.styled(Typography)(function (_ref2) {
+  var active = _ref2.active,
+    completed = _ref2.completed,
+    error = _ref2.error,
+    isMobile = _ref2.isMobile,
+    theme = _ref2.theme;
+  return {
     fontSize: isMobile ? 16 : 22,
     fontWeight: 700,
     color: textColorStyles(active, completed, error, theme)
-  })
-);
+  };
+});
 
 exports.StyledContainer = StyledContainer;
 exports.StyledText = StyledText;