@tenancy.nz/ui 1.0.1 → 1.0.3

package/dist/esm/components/Stepper.js

@@ -1,4 +1,5 @@
 "use strict";
+import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import React from 'react';
 import PropTypes from 'prop-types';
@@ -11,40 +12,73 @@ import StepIcon from './StepIcon.js';
 import Heading from './Heading.js';
 import { StyledContainer } from './Stepper.styled.js';
 
-function Stepper({ steps, onChange = () => null, ...rest }) {
-  const isMobile = useMediaQuery((theme) => theme.breakpoints.down("sm"));
-  const [activeStep, setActiveStep] = React.useState(0);
-  const handleStep = (step) => () => {
-    setActiveStep(step);
-    onChange(step);
+var _excluded = ["steps", "onChange"];
+function Stepper(_ref) {
+  var steps = _ref.steps,
+    _ref$onChange = _ref.onChange,
+    onChange = _ref$onChange === void 0 ? function () {
+      return null;
+    } : _ref$onChange,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var isMobile = useMediaQuery(function (theme) {
+    return theme.breakpoints.down("sm");
+  });
+  var _React$useState = React.useState(0),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    activeStep = _React$useState2[0],
+    setActiveStep = _React$useState2[1];
+  var handleStep = function handleStep(step) {
+    return function () {
+      setActiveStep(step);
+      onChange(step);
+    };
   };
-  return /* @__PURE__ */ jsxs(StyledContainer, { isMobile, children: [
-    isMobile && /* @__PURE__ */ jsx(Heading, { as: "h3", align: "center", gutterBottom: false, children: steps[activeStep].label }),
-    /* @__PURE__ */ jsx(
-      MuiStepper,
-      {
-        alternativeLabel: true,
-        activeStep,
-        ...rest,
-        style: { padding: isMobile ? "18px 0" : "5px 0px 24px 0px" },
-        children: steps.map(({ label, error, completed, disabled }, index) => /* @__PURE__ */ jsx(Step, { completed, disabled: !!disabled, children: /* @__PURE__ */ jsx(StepButton, { onClick: handleStep(index), children: /* @__PURE__ */ jsx(StepLabel, { error, StepIconComponent: StepIcon, children: !isMobile && label }) }) }, label))
-      }
-    )
-  ] });
+  return /* @__PURE__ */jsxs(StyledContainer, {
+    isMobile: isMobile,
+    children: [isMobile && /* @__PURE__ */jsx(Heading, {
+      as: "h3",
+      align: "center",
+      gutterBottom: false,
+      children: steps[activeStep].label
+    }), /* @__PURE__ */jsx(MuiStepper, _objectSpread2(_objectSpread2({
+      alternativeLabel: true,
+      activeStep: activeStep
+    }, rest), {}, {
+      style: {
+        padding: isMobile ? "18px 0" : "5px 0px 24px 0px"
+      },
+      children: steps.map(function (_ref2, index) {
+        var label = _ref2.label,
+          error = _ref2.error,
+          completed = _ref2.completed,
+          disabled = _ref2.disabled;
+        return /* @__PURE__ */jsx(Step, {
+          completed: completed,
+          disabled: !!disabled,
+          children: /* @__PURE__ */jsx(StepButton, {
+            onClick: handleStep(index),
+            children: /* @__PURE__ */jsx(StepLabel, {
+              error: error,
+              StepIconComponent: StepIcon,
+              children: !isMobile && label
+            })
+          })
+        }, label);
+      })
+    }))]
+  });
 }
 Stepper.propTypes = {
   /**
    * Array of step labels
    */
-  steps: PropTypes.arrayOf(
-    PropTypes.shape({
-      optional: PropTypes.bool,
-      label: PropTypes.string,
-      error: PropTypes.bool,
-      completed: PropTypes.bool,
-      disabled: PropTypes.bool
-    })
-  ).isRequired,
+  steps: PropTypes.arrayOf(PropTypes.shape({
+    optional: PropTypes.bool,
+    label: PropTypes.string,
+    error: PropTypes.bool,
+    completed: PropTypes.bool,
+    disabled: PropTypes.bool
+  })).isRequired,
   /**
    * Function to trigger action when activeStep changes...
    */

package/dist/esm/components/Stepper.styled.js

@@ -1,59 +1,63 @@
 "use strict";
 import { styled } from '@mui/material/styles';
 
-const StyledContainer = styled("div")(({ isMobile, theme }) => ({
-  width: "100%",
-  paddingTop: isMobile ? 12 : 0,
-  "& .MuiStepper-root": {
-    paddingLeft: isMobile ? 0 : null,
-    paddingRight: isMobile ? 0 : null
-  },
-  "& .MuiStepConnector-alternativeLabel": {
-    top: "auto",
-    bottom: isMobile ? 15 : 25,
-    zIndex: 0
-  },
-  "& .MuiStepConnector-lineHorizontal": {
-    borderWidth: "2px"
-  },
-  "& .MuiStepConnector-completed .MuiStepConnector-lineHorizontal": {
-    borderColor: theme.palette.primary.main
-  },
-  "& .MuiStepper-alternativeLabel": {
-    alignItems: "flex-end"
-  },
-  "& .MuiStepButton-root": {
-    paddingTop: isMobile ? 0 : null
-  },
-  "& .MuiStepLabel-alternativeLabel": {
-    flexDirection: "column-reverse",
-    marginTop: theme.spacing(2),
-    fontWeight: theme.typography.fontWeightMedium
-  },
-  "& .MuiStepLabel-alternativeLabel .Mui-error": {
-    color: theme.palette.secondary.main
-  },
-  "& .MuiStepConnector-horizontal": {
-    left: isMobile ? "-50%" : null,
-    right: isMobile ? "50%" : null
-  },
-  "& .MuiStepButton-touchRipple": {
-    display: "none"
-  },
-  // disabled state
-  "& .MuiStepLabel-alternativeLabel:not(.Mui-error), & .MuiStep-alternativeLabel:not(.MuiStep-completed)": {
-    "& .Mui-disabled .MuiStepLabel-iconContainer > div": {
-      border: "1px solid rgba(236, 0, 140, 0.5)"
-    },
-    "& .Mui-disabled .MuiStepLabel-iconContainer > div > p": {
-      color: "rgba(236, 0, 140, 0.5)"
-    }
-  },
-  "& .MuiStepLabel-alternativeLabel.Mui-error, & .MuiStepLabel-alternativeLabel.Mui-error.Mui-disabled": {
-    "& .MuiStepLabel-iconContainer > div > p": {
-      color: "#fff !important"
+var StyledContainer = styled("div")(function (_ref) {
+  var isMobile = _ref.isMobile,
+    theme = _ref.theme;
+  return {
+    width: "100%",
+    paddingTop: isMobile ? 12 : 0,
+    "& .MuiStepper-root": {
+      paddingLeft: isMobile ? 0 : null,
+      paddingRight: isMobile ? 0 : null
+    },
+    "& .MuiStepConnector-alternativeLabel": {
+      top: "auto",
+      bottom: isMobile ? 15 : 25,
+      zIndex: 0
+    },
+    "& .MuiStepConnector-lineHorizontal": {
+      borderWidth: "2px"
+    },
+    "& .MuiStepConnector-completed .MuiStepConnector-lineHorizontal": {
+      borderColor: theme.palette.primary.main
+    },
+    "& .MuiStepper-alternativeLabel": {
+      alignItems: "flex-end"
+    },
+    "& .MuiStepButton-root": {
+      paddingTop: isMobile ? 0 : null
+    },
+    "& .MuiStepLabel-alternativeLabel": {
+      flexDirection: "column-reverse",
+      marginTop: theme.spacing(2),
+      fontWeight: theme.typography.fontWeightMedium
+    },
+    "& .MuiStepLabel-alternativeLabel .Mui-error": {
+      color: theme.palette.secondary.main
+    },
+    "& .MuiStepConnector-horizontal": {
+      left: isMobile ? "-50%" : null,
+      right: isMobile ? "50%" : null
+    },
+    "& .MuiStepButton-touchRipple": {
+      display: "none"
+    },
+    // disabled state
+    "& .MuiStepLabel-alternativeLabel:not(.Mui-error), & .MuiStep-alternativeLabel:not(.MuiStep-completed)": {
+      "& .Mui-disabled .MuiStepLabel-iconContainer > div": {
+        border: "1px solid rgba(236, 0, 140, 0.5)"
+      },
+      "& .Mui-disabled .MuiStepLabel-iconContainer > div > p": {
+        color: "rgba(236, 0, 140, 0.5)"
+      }
+    },
+    "& .MuiStepLabel-alternativeLabel.Mui-error, & .MuiStepLabel-alternativeLabel.Mui-error.Mui-disabled": {
+      "& .MuiStepLabel-iconContainer > div > p": {
+        color: "#fff !important"
+      }
     }
-  }
-}));
+  };
+});
 
 export { StyledContainer };

package/dist/esm/components/SuccessModal.js

@@ -1,4 +1,5 @@
 "use strict";
+import { slicedToArray as _slicedToArray } from '../_virtual/_rollupPluginBabelHelpers.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
@@ -8,18 +9,43 @@ import Heading from './Heading.js';
 import Modal from './Modal.js';
 import ModalContent from './ModalContent.js';
 
-function SuccessModal({ duration = 1500, message = "Saved!", show = false }) {
-  const [isOpen, setIsOpen] = useState(false);
-  useEffect(() => {
+function SuccessModal(_ref) {
+  var _ref$duration = _ref.duration,
+    duration = _ref$duration === void 0 ? 1500 : _ref$duration,
+    _ref$message = _ref.message,
+    message = _ref$message === void 0 ? "Saved!" : _ref$message,
+    _ref$show = _ref.show,
+    show = _ref$show === void 0 ? false : _ref$show;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isOpen = _useState2[0],
+    setIsOpen = _useState2[1];
+  useEffect(function () {
     if (show) {
       setIsOpen(true);
-      setTimeout(() => setIsOpen(false), duration);
+      setTimeout(function () {
+        return setIsOpen(false);
+      }, duration);
     }
   }, [duration, show]);
-  return /* @__PURE__ */ jsx(Modal, { open: isOpen, fullWidth: true, maxWidth: "sm", hideBackdrop: true, children: /* @__PURE__ */ jsx(ModalContent, { children: /* @__PURE__ */ jsxs(StyledContent, { children: [
-    /* @__PURE__ */ jsx(StyledIcon, { children: /* @__PURE__ */ jsx(CheckCircleOutlineIcon, {}) }),
-    /* @__PURE__ */ jsx(Heading, { align: "center", as: "h4", gutterBottom: false, children: message })
-  ] }) }) });
+  return /* @__PURE__ */jsx(Modal, {
+    open: isOpen,
+    fullWidth: true,
+    maxWidth: "sm",
+    hideBackdrop: true,
+    children: /* @__PURE__ */jsx(ModalContent, {
+      children: /* @__PURE__ */jsxs(StyledContent, {
+        children: [/* @__PURE__ */jsx(StyledIcon, {
+          children: /* @__PURE__ */jsx(CheckCircleOutlineIcon, {})
+        }), /* @__PURE__ */jsx(Heading, {
+          align: "center",
+          as: "h4",
+          gutterBottom: false,
+          children: message
+        })]
+      })
+    })
+  });
 }
 SuccessModal.propTypes = {
   /**

package/dist/esm/components/SuccessModal.styled.js

@@ -1,19 +1,12 @@
 "use strict";
+import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../_virtual/_rollupPluginBabelHelpers.js';
 import styled, { css } from 'styled-components';
 
-const StyledContent = styled.div`
-  text-align: center;
-  padding: 5rem;
-  & svg {
-    font-size: 150px;
-  }
-`;
-const StyledIcon = styled.div`
-  ${({ theme }) => css`
-    display: inline-flex;
-    margin-bottom: 10px;
-    color: ${theme.palette.success.main};
-  `}
-`;
+var _templateObject, _templateObject2, _templateObject3;
+var StyledContent = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  text-align: center;\n  padding: 5rem;\n  & svg {\n    font-size: 150px;\n  }\n"])));
+var StyledIcon = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  ", "\n"])), function (_ref) {
+  var theme = _ref.theme;
+  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    display: inline-flex;\n    margin-bottom: 10px;\n    color: ", ";\n  "])), theme.palette.success.main);
+});
 
 export { StyledContent, StyledIcon };

package/dist/esm/components/Switch.js

@@ -1,42 +1,63 @@
 "use strict";
+import { objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import FormLabel from './FormLabel.js';
 import { StyledSwitch, StyledSwitchInput, StyledSwitchTrack, StyledSwitchKnob } from './Switch.styled.js';
 
-function Switch({
-  checked = void 0,
-  color = "primary",
-  defaultChecked = void 0,
-  disabled = false,
-  label = void 0,
-  onChange = void 0,
-  name,
-  required = void 0,
-  size = "medium",
-  value = void 0
-}) {
-  const inputProps = {
-    disabled,
-    ...checked !== void 0 && { checked },
-    ...defaultChecked !== void 0 && { defaultChecked },
-    ...onChange !== void 0 && { onChange },
-    ...required !== void 0 && { required },
-    ...value !== void 0 && { value }
-  };
-  return /* @__PURE__ */ jsxs(StyledSwitch, { disabled, size, children: [
-    /* @__PURE__ */ jsx(
-      StyledSwitchInput,
-      {
-        color,
-        name,
-        size,
-        ...inputProps,
-        type: "checkbox"
-      }
-    ),
-    label && /* @__PURE__ */ jsx(FormLabel, { required, margin: "none", size, children: label }),
-    /* @__PURE__ */ jsx(StyledSwitchTrack, { size, children: /* @__PURE__ */ jsx(StyledSwitchKnob, { size }) })
-  ] });
+function Switch(_ref) {
+  var _ref$checked = _ref.checked,
+    checked = _ref$checked === void 0 ? void 0 : _ref$checked,
+    _ref$color = _ref.color,
+    color = _ref$color === void 0 ? "primary" : _ref$color,
+    _ref$defaultChecked = _ref.defaultChecked,
+    defaultChecked = _ref$defaultChecked === void 0 ? void 0 : _ref$defaultChecked,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    _ref$label = _ref.label,
+    label = _ref$label === void 0 ? void 0 : _ref$label,
+    _ref$onChange = _ref.onChange,
+    onChange = _ref$onChange === void 0 ? void 0 : _ref$onChange,
+    name = _ref.name,
+    _ref$required = _ref.required,
+    required = _ref$required === void 0 ? void 0 : _ref$required,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? "medium" : _ref$size,
+    _ref$value = _ref.value,
+    value = _ref$value === void 0 ? void 0 : _ref$value;
+  var inputProps = _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({
+    disabled: disabled
+  }, checked !== void 0 && {
+    checked: checked
+  }), defaultChecked !== void 0 && {
+    defaultChecked: defaultChecked
+  }), onChange !== void 0 && {
+    onChange: onChange
+  }), required !== void 0 && {
+    required: required
+  }), value !== void 0 && {
+    value: value
+  });
+  return /* @__PURE__ */jsxs(StyledSwitch, {
+    disabled: disabled,
+    size: size,
+    children: [/* @__PURE__ */jsx(StyledSwitchInput, _objectSpread2(_objectSpread2({
+      color: color,
+      name: name,
+      size: size
+    }, inputProps), {}, {
+      type: "checkbox"
+    })), label && /* @__PURE__ */jsx(FormLabel, {
+      required: required,
+      margin: "none",
+      size: size,
+      children: label
+    }), /* @__PURE__ */jsx(StyledSwitchTrack, {
+      size: size,
+      children: /* @__PURE__ */jsx(StyledSwitchKnob, {
+        size: size
+      })
+    })]
+  });
 }
 
 export { Switch as default };

package/dist/esm/components/Switch.styled.js

@@ -1,103 +1,34 @@
 "use strict";
+import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../_virtual/_rollupPluginBabelHelpers.js';
 import { css } from '@emotion/react';
 import styled from '@emotion/styled';
 import { getObjectProp } from '../utils/helpers/object.js';
 
-const StyledSwitch = styled.label`
-  ${({ disabled }) => css`
-    position: relative;
-    cursor: pointer;
-    display: inline-flex;
-    gap: 20px;
-    align-items: center;
-    ${disabled && css`
-      opacity: 0.5;
-      pointer-events: none;
-    `}
-  `}
-`;
-const StyledSwitchLabel = styled.span`
-  ${({ required, theme }) => css`
-    font-size: 13px;
-    font-weight: 600;
-    color: ${getObjectProp(theme, "palette.text.primary")};
-
-    ${required && css`
-      &:after {
-        content: '*';
-        color: ${getObjectProp(theme, "palette.error.main")};
-      }
-    `}
-  `}
-`;
-const StyledSwitchKnob = styled.span`
-  ${({ size, theme }) => css`
-    border-radius: 99999px;
-    box-shadow: ${getObjectProp(theme, "shadows.1")};
-    background: #fff;
-    position: absolute;
-    transition:
-      translate 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,
-      transform 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
-
-    ${size === "medium" && css`
-      width: 20px;
-      height: 20px;
-      top: 2px;
-      left: 2px;
-    `}
-
-    ${size === "small" && css`
-      width: 14px;
-      height: 14px;
-      top: 2px;
-      left: 2px;
-    `}
-  `}
-`;
-const StyledSwitchTrack = styled.span`
-  ${({ size, theme }) => css`
-    position: relative;
-    background: ${getObjectProp(theme, "palette.grey.300")};
-    transition: background 150ms linear;
-    display: inline-flex;
-    justify-content: center;
-    align-items: center;
-
-    &:focus {
-      box-shadow: 0px 0px 6px #1f1c4f;
-    }
-
-    ${size === "medium" && css`
-      height: 24px;
-      width: 44px;
-      border-radius: 12px;
-    `}
-
-    ${size === "small" && css`
-      height: 18px;
-      width: 38px;
-      border-radius: 11px;
-    `}
-  `}
-`;
-const StyledSwitchInput = styled.input`
-  ${({ color, size, theme }) => css`
-    position: absolute;
-    left: 0;
-    top: 0;
-    z-index: -1;
-    visibility: hidden;
-    opacity: 0;
-
-    &:checked ~ ${StyledSwitchTrack} {
-      background: ${getObjectProp(theme, `palette.${color}.main`)};
-    }
-
-    &:checked ~ ${StyledSwitchTrack} ${StyledSwitchKnob} {
-      transform: translateX(${size === "small" ? "20" : "20"}px);
-    }
-  `}
-`;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14;
+var StyledSwitch = styled.label(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", "\n"])), function (_ref) {
+  var disabled = _ref.disabled;
+  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    position: relative;\n    cursor: pointer;\n    display: inline-flex;\n    gap: 20px;\n    align-items: center;\n    ", "\n  "])), disabled && css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      opacity: 0.5;\n      pointer-events: none;\n    "]))));
+});
+var StyledSwitchLabel = styled.span(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  ", "\n"])), function (_ref2) {
+  var required = _ref2.required,
+    theme = _ref2.theme;
+  return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    font-size: 13px;\n    font-weight: 600;\n    color: ", ";\n\n    ", "\n  "])), getObjectProp(theme, "palette.text.primary"), required && css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n      &:after {\n        content: '*';\n        color: ", ";\n      }\n    "])), getObjectProp(theme, "palette.error.main")));
+});
+var StyledSwitchKnob = styled.span(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  ", "\n"])), function (_ref3) {
+  var size = _ref3.size,
+    theme = _ref3.theme;
+  return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n    border-radius: 99999px;\n    box-shadow: ", ";\n    background: #fff;\n    position: absolute;\n    transition:\n      translate 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,\n      transform 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n\n    ", "\n\n    ", "\n  "])), getObjectProp(theme, "shadows.1"), size === "medium" && css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n      width: 20px;\n      height: 20px;\n      top: 2px;\n      left: 2px;\n    "]))), size === "small" && css(_templateObject0 || (_templateObject0 = _taggedTemplateLiteral(["\n      width: 14px;\n      height: 14px;\n      top: 2px;\n      left: 2px;\n    "]))));
+});
+var StyledSwitchTrack = styled.span(_templateObject1 || (_templateObject1 = _taggedTemplateLiteral(["\n  ", "\n"])), function (_ref4) {
+  var size = _ref4.size,
+    theme = _ref4.theme;
+  return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n    position: relative;\n    background: ", ";\n    transition: background 150ms linear;\n    display: inline-flex;\n    justify-content: center;\n    align-items: center;\n\n    &:focus {\n      box-shadow: 0px 0px 6px #1f1c4f;\n    }\n\n    ", "\n\n    ", "\n  "])), getObjectProp(theme, "palette.grey.300"), size === "medium" && css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n      height: 24px;\n      width: 44px;\n      border-radius: 12px;\n    "]))), size === "small" && css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n      height: 18px;\n      width: 38px;\n      border-radius: 11px;\n    "]))));
+});
+var StyledSwitchInput = styled.input(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  ", "\n"])), function (_ref5) {
+  var color = _ref5.color,
+    size = _ref5.size,
+    theme = _ref5.theme;
+  return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n    position: absolute;\n    left: 0;\n    top: 0;\n    z-index: -1;\n    visibility: hidden;\n    opacity: 0;\n\n    &:checked ~ ", " {\n      background: ", ";\n    }\n\n    &:checked ~ ", " ", " {\n      transform: translateX(", "px);\n    }\n  "])), StyledSwitchTrack, getObjectProp(theme, "palette.".concat(color, ".main")), StyledSwitchTrack, StyledSwitchKnob, size === "small" ? "20" : "20");
+});
 
 export { StyledSwitch, StyledSwitchInput, StyledSwitchKnob, StyledSwitchLabel, StyledSwitchTrack };

package/dist/esm/components/Tab.js

@@ -1,21 +1,24 @@
 "use strict";
+import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
 import { jsx } from 'react/jsx-runtime';
 import 'react';
 import PropTypes from 'prop-types';
 import { StyledTab } from './Tab.styled.js';
 
-function Tab({ label, disabled = false, ...rest }) {
-  return /* @__PURE__ */ jsx(
-    StyledTab,
-    {
-      label,
-      disabled,
-      ...rest,
-      disableRipple: true,
-      disableFocusRipple: true,
-      disableTouchRipple: true
-    }
-  );
+var _excluded = ["label", "disabled"];
+function Tab(_ref) {
+  var label = _ref.label,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /* @__PURE__ */jsx(StyledTab, _objectSpread2(_objectSpread2({
+    label: label,
+    disabled: disabled
+  }, rest), {}, {
+    disableRipple: true,
+    disableFocusRipple: true,
+    disableTouchRipple: true
+  }));
 }
 Tab.propTypes = {
   /**

package/dist/esm/components/Tab.styled.js

@@ -1,12 +1,9 @@
 "use strict";
+import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../_virtual/_rollupPluginBabelHelpers.js';
 import styled from 'styled-components';
 import MuiTab from '@mui/material/Tab';
 
-const StyledTab = styled(MuiTab)`
-  line-height: 1.4;
-  &&:not(:disabled) {
-    opacity: 1;
-  }
-`;
+var _templateObject;
+var StyledTab = styled(MuiTab)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  line-height: 1.4;\n  &&:not(:disabled) {\n    opacity: 1;\n  }\n"])));
 
 export { StyledTab };

package/dist/esm/components/TabPanel.js

@@ -4,8 +4,15 @@ import 'react';
 import PropTypes from 'prop-types';
 import { StyledTabPanel } from './TabPanel.styled.js';
 
-function TabPanel({ children, index, value }) {
-  return /* @__PURE__ */ jsx(StyledTabPanel, { index, value, children });
+function TabPanel(_ref) {
+  var children = _ref.children,
+    index = _ref.index,
+    value = _ref.value;
+  return /* @__PURE__ */jsx(StyledTabPanel, {
+    index: index,
+    value: value,
+    children: children
+  });
 }
 TabPanel.propTypes = {
   /**

package/dist/esm/components/TabPanel.styled.js

@@ -1,10 +1,12 @@
 "use strict";
+import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../_virtual/_rollupPluginBabelHelpers.js';
 import styled, { css } from 'styled-components';
 
-const StyledTabPanel = styled.div`
-  ${({ index, value }) => css`
-    display: ${index === value ? "block" : "none"};
-  `}
-`;
+var _templateObject, _templateObject2;
+var StyledTabPanel = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", "\n"])), function (_ref) {
+  var index = _ref.index,
+    value = _ref.value;
+  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    display: ", ";\n  "])), index === value ? "block" : "none");
+});
 
 export { StyledTabPanel };