thailife-react 0.0.13 → 0.0.14

package/dist/index.js

@@ -1456,57 +1456,148 @@ if (process.env.NODE_ENV === 'production') {
 
 var jsxRuntimeExports = jsxRuntime.exports;
 
+const theme = {
+  colors: {
+    primary: "#007AC2",
+    error: "#ff1100",
+    dark: "#333333",
+    light: "#666666",
+    white: "#ffffff",
+    black: "#000000",
+    gray: {
+      50: "#f9fafb",
+      100: "#f3f4f6",
+      200: "#e5e7eb",
+      300: "#d1d5db",
+      400: "#9ca3af",
+      500: "#6b7280",
+      600: "#4b5563",
+      700: "#374151",
+      800: "#1f2937",
+      900: "#111827"
+    }
+  },
+  spacing: {
+    0: "0",
+    1: "0.25rem",
+    2: "0.5rem",
+    3: "0.75rem",
+    4: "1rem",
+    5: "1.25rem",
+    6: "1.5rem",
+    8: "2rem",
+    10: "2.5rem",
+    12: "3rem",
+    16: "4rem",
+    18: "4.5rem",
+    20: "5rem",
+    24: "6rem",
+    32: "8rem",
+    40: "10rem",
+    48: "12rem",
+    56: "14rem",
+    64: "16rem",
+    88: "22rem"
+  },
+  fontSize: {
+    xs: "0.75rem",
+    sm: "0.875rem",
+    base: "1rem",
+    lg: "1.125rem",
+    xl: "1.25rem",
+    "2xl": "1.5rem",
+    "3xl": "1.875rem",
+    "4xl": "2.25rem",
+    "5xl": "3rem",
+    "6xl": "3.75rem"
+  },
+  fontFamily: {
+    sans: ["Inter", "system-ui", "sans-serif"],
+    serif: ["Georgia", "Cambria", "Times New Roman", "Times", "serif"],
+    mono: ["Menlo", "Monaco", "Consolas", "Liberation Mono", "Courier New", "monospace"]
+  },
+  borderRadius: {
+    none: "0",
+    sm: "0.125rem",
+    base: "0.25rem",
+    md: "0.375rem",
+    lg: "0.5rem",
+    xl: "0.75rem",
+    "2xl": "1rem",
+    "3xl": "1.5rem",
+    full: "9999px"
+  },
+  shadows: {
+    sm: "0 1px 2px 0 rgba(0, 0, 0, 0.05)",
+    base: "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)",
+    md: "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
+    lg: "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
+    xl: "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)"
+  },
+  transitions: {
+    fast: "150ms ease-in-out",
+    base: "300ms ease-in-out",
+    slow: "500ms ease-in-out"
+  }
+};
+
 const _excluded$6 = ["className", "color", "variant", "size", "fullWidth", "loading", "disabled", "children"];
 var _templateObject$6, _templateObject2$6, _templateObject3$6, _templateObject4$6, _templateObject5$6, _templateObject6$6, _templateObject7$6, _templateObject8$6, _templateObject9$6, _templateObject0$6;
 const StyledButton = styled.button(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border: none;\n  border-radius: ", ";\n  font-family: ", ";\n  font-weight: 500;\n  cursor: pointer;\n  transition: all ", ";\n  outline: none;\n\n  &:focus-visible {\n    outline: 2px solid ", ";\n    outline-offset: 2px;\n  }\n\n  &:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  ", "\n\n  ", "\n\n  ", "\n"])), _ref => {
+  var _theme$borderRadius;
   let {
-    theme
+    theme: theme$1
   } = _ref;
-  return theme.borderRadius.md;
+  return (theme$1 === null || theme$1 === void 0 || (_theme$borderRadius = theme$1.borderRadius) === null || _theme$borderRadius === void 0 ? void 0 : _theme$borderRadius.md) || theme.borderRadius.md;
 }, _ref2 => {
+  var _theme$fontFamily;
   let {
-    theme
+    theme: theme$1
   } = _ref2;
-  return theme.fontFamily.sans.join(", ");
+  return (theme$1 === null || theme$1 === void 0 || (_theme$fontFamily = theme$1.fontFamily) === null || _theme$fontFamily === void 0 || (_theme$fontFamily = _theme$fontFamily.sans) === null || _theme$fontFamily === void 0 ? void 0 : _theme$fontFamily.join(", ")) || theme.fontFamily.sans.join(", ");
 }, _ref3 => {
+  var _theme$transitions;
   let {
-    theme
+    theme: theme$1
   } = _ref3;
-  return theme.transitions.base;
+  return (theme$1 === null || theme$1 === void 0 || (_theme$transitions = theme$1.transitions) === null || _theme$transitions === void 0 ? void 0 : _theme$transitions.base) || theme.transitions.base;
 }, _ref4 => {
+  var _theme$colors;
   let {
-    theme
+    theme: theme$1
   } = _ref4;
-  return theme.colors.primary;
+  return (theme$1 === null || theme$1 === void 0 || (_theme$colors = theme$1.colors) === null || _theme$colors === void 0 ? void 0 : _theme$colors.primary) || theme.colors.primary;
 }, _ref5 => {
   let {
     variant,
     color,
-    theme
+    theme: theme$1
   } = _ref5;
+  const currentTheme = theme$1 || theme;
   if (variant === "contained") {
-    return styled.css(_templateObject2$6 || (_templateObject2$6 = _taggedTemplateLiteral(["\n        background-color: ", ";\n        color: ", ";\n        &:hover:not(:disabled) {\n          background-color: ", "cc;\n        }\n      "])), theme.colors[color || "primary"], theme.colors.white, theme.colors[color || "primary"]);
+    return styled.css(_templateObject2$6 || (_templateObject2$6 = _taggedTemplateLiteral(["\n        background-color: ", ";\n        color: ", ";\n        &:hover:not(:disabled) {\n          background-color: ", "cc;\n        }\n      "])), currentTheme.colors[color || "primary"], currentTheme.colors.white, currentTheme.colors[color || "primary"]);
   }
   if (variant === "outlined") {
-    return styled.css(_templateObject3$6 || (_templateObject3$6 = _taggedTemplateLiteral(["\n        background-color: transparent;\n        border: 1px solid ", ";\n        color: ", ";\n        &:hover:not(:disabled) {\n          background-color: ", "1a;\n        }\n      "])), theme.colors[color || "primary"], theme.colors[color || "primary"], theme.colors[color || "primary"]);
+    return styled.css(_templateObject3$6 || (_templateObject3$6 = _taggedTemplateLiteral(["\n        background-color: transparent;\n        border: 1px solid ", ";\n        color: ", ";\n        &:hover:not(:disabled) {\n          background-color: ", "1a;\n        }\n      "])), currentTheme.colors[color || "primary"], currentTheme.colors[color || "primary"], currentTheme.colors[color || "primary"]);
   }
   if (variant === "link") {
-    return styled.css(_templateObject4$6 || (_templateObject4$6 = _taggedTemplateLiteral(["\n        background-color: transparent;\n        color: ", ";\n        text-decoration: underline;\n        &:hover:not(:disabled) {\n          text-decoration: none;\n        }\n      "])), theme.colors[color || "primary"]);
+    return styled.css(_templateObject4$6 || (_templateObject4$6 = _taggedTemplateLiteral(["\n        background-color: transparent;\n        color: ", ";\n        text-decoration: underline;\n        &:hover:not(:disabled) {\n          text-decoration: none;\n        }\n      "])), currentTheme.colors[color || "primary"]);
   }
   return styled.css(_templateObject5$6 || (_templateObject5$6 = _taggedTemplateLiteral([""])));
 }, _ref6 => {
   let {
     size,
-    theme
+    theme: theme$1
   } = _ref6;
+  const currentTheme = theme$1 || theme;
   if (size === "sm") {
-    return styled.css(_templateObject6$6 || (_templateObject6$6 = _taggedTemplateLiteral(["\n        padding: ", " ", ";\n        font-size: ", ";\n      "])), theme.spacing[3], theme.spacing[3], theme.fontSize.sm);
+    return styled.css(_templateObject6$6 || (_templateObject6$6 = _taggedTemplateLiteral(["\n        padding: ", " ", ";\n        font-size: ", ";\n      "])), currentTheme.spacing[3], currentTheme.spacing[3], currentTheme.fontSize.sm);
   }
   if (size === "md") {
-    return styled.css(_templateObject7$6 || (_templateObject7$6 = _taggedTemplateLiteral(["\n        padding: ", " ", ";\n        font-size: ", ";\n      "])), theme.spacing[2], theme.spacing[4], theme.fontSize.sm);
+    return styled.css(_templateObject7$6 || (_templateObject7$6 = _taggedTemplateLiteral(["\n        padding: ", " ", ";\n        font-size: ", ";\n      "])), currentTheme.spacing[2], currentTheme.spacing[4], currentTheme.fontSize.sm);
   }
   if (size === "lg") {
-    return styled.css(_templateObject8$6 || (_templateObject8$6 = _taggedTemplateLiteral(["\n        padding: ", " ", ";\n        font-size: ", ";\n      "])), theme.spacing[3], theme.spacing[6], theme.fontSize.base);
+    return styled.css(_templateObject8$6 || (_templateObject8$6 = _taggedTemplateLiteral(["\n        padding: ", " ", ";\n        font-size: ", ";\n      "])), currentTheme.spacing[3], currentTheme.spacing[6], currentTheme.fontSize.base);
   }
   return styled.css(_templateObject9$6 || (_templateObject9$6 = _taggedTemplateLiteral([""])));
 }, _ref7 => {
@@ -1551,66 +1642,76 @@ const InputContainer = styled.div(_templateObject$5 || (_templateObject$5 = _tag
   return fullWidth && styled.css(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteral(["\n      width: 100%;\n    "])));
 });
 const InputLabel = styled.label(_templateObject3$5 || (_templateObject3$5 = _taggedTemplateLiteral(["\n  margin-bottom: ", ";\n  font-size: ", ";\n  font-weight: 500;\n  color: ", ";\n"])), _ref2 => {
+  var _theme$spacing;
   let {
-    theme
+    theme: theme$1
   } = _ref2;
-  return theme.spacing[1];
+  return (theme$1 === null || theme$1 === void 0 || (_theme$spacing = theme$1.spacing) === null || _theme$spacing === void 0 ? void 0 : _theme$spacing[1]) || theme.spacing[1];
 }, _ref3 => {
+  var _theme$fontSize;
   let {
-    theme
+    theme: theme$1
   } = _ref3;
-  return theme.fontSize.sm;
+  return (theme$1 === null || theme$1 === void 0 || (_theme$fontSize = theme$1.fontSize) === null || _theme$fontSize === void 0 ? void 0 : _theme$fontSize.sm) || theme.fontSize.sm;
 }, _ref4 => {
+  var _theme$colors;
   let {
-    theme
+    theme: theme$1
   } = _ref4;
-  return theme.colors.gray[700];
+  return (theme$1 === null || theme$1 === void 0 || (_theme$colors = theme$1.colors) === null || _theme$colors === void 0 || (_theme$colors = _theme$colors.gray) === null || _theme$colors === void 0 ? void 0 : _theme$colors[700]) || theme.colors.gray[700];
 });
 const StyledInput = styled.input(_templateObject4$5 || (_templateObject4$5 = _taggedTemplateLiteral(["\n  border: 1px solid ", ";\n  border-radius: ", ";\n  transition: border-color ", ";\n  outline: none;\n  font-family: ", ";\n\n  &:focus {\n    border-color: ", ";\n  }\n\n  &:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n    background-color: ", ";\n  }\n\n  ", "\n\n  ", "\n"])), _ref5 => {
+  var _theme$colors2, _theme$colors3;
   let {
-    theme,
+    theme: theme$1,
     hasError
   } = _ref5;
-  return hasError ? theme.colors.error : theme.colors.gray[300];
+  return hasError ? (theme$1 === null || theme$1 === void 0 || (_theme$colors2 = theme$1.colors) === null || _theme$colors2 === void 0 ? void 0 : _theme$colors2.error) || theme.colors.error : (theme$1 === null || theme$1 === void 0 || (_theme$colors3 = theme$1.colors) === null || _theme$colors3 === void 0 || (_theme$colors3 = _theme$colors3.gray) === null || _theme$colors3 === void 0 ? void 0 : _theme$colors3[300]) || theme.colors.gray[300];
 }, _ref6 => {
+  var _theme$borderRadius;
   let {
-    theme
+    theme: theme$1
   } = _ref6;
-  return theme.borderRadius.md;
+  return (theme$1 === null || theme$1 === void 0 || (_theme$borderRadius = theme$1.borderRadius) === null || _theme$borderRadius === void 0 ? void 0 : _theme$borderRadius.md) || theme.borderRadius.md;
 }, _ref7 => {
+  var _theme$transitions;
   let {
-    theme
+    theme: theme$1
   } = _ref7;
-  return theme.transitions.base;
+  return (theme$1 === null || theme$1 === void 0 || (_theme$transitions = theme$1.transitions) === null || _theme$transitions === void 0 ? void 0 : _theme$transitions.base) || theme.transitions.base;
 }, _ref8 => {
+  var _theme$fontFamily;
   let {
-    theme
+    theme: theme$1
   } = _ref8;
-  return theme.fontFamily.sans.join(", ");
+  return (theme$1 === null || theme$1 === void 0 || (_theme$fontFamily = theme$1.fontFamily) === null || _theme$fontFamily === void 0 || (_theme$fontFamily = _theme$fontFamily.sans) === null || _theme$fontFamily === void 0 ? void 0 : _theme$fontFamily.join(", ")) || theme.fontFamily.sans.join(", ");
 }, _ref9 => {
+  var _theme$colors4, _theme$colors5;
   let {
-    theme,
+    theme: theme$1,
     hasError
   } = _ref9;
-  return hasError ? theme.colors.error : theme.colors.primary;
+  return hasError ? (theme$1 === null || theme$1 === void 0 || (_theme$colors4 = theme$1.colors) === null || _theme$colors4 === void 0 ? void 0 : _theme$colors4.error) || theme.colors.error : (theme$1 === null || theme$1 === void 0 || (_theme$colors5 = theme$1.colors) === null || _theme$colors5 === void 0 ? void 0 : _theme$colors5.primary) || theme.colors.primary;
 }, _ref0 => {
+  var _theme$colors6;
   let {
-    theme
+    theme: theme$1
   } = _ref0;
-  return theme.colors.gray[50];
+  return (theme$1 === null || theme$1 === void 0 || (_theme$colors6 = theme$1.colors) === null || _theme$colors6 === void 0 || (_theme$colors6 = _theme$colors6.gray) === null || _theme$colors6 === void 0 ? void 0 : _theme$colors6[50]) || theme.colors.gray[50];
 }, _ref1 => {
   let {
     size,
-    theme
+    theme: theme$1
   } = _ref1;
+  const currentTheme = theme$1 || theme;
   if (size === "sm") {
-    return styled.css(_templateObject5$5 || (_templateObject5$5 = _taggedTemplateLiteral(["\n        padding: ", " ", ";\n        font-size: ", ";\n      "])), theme.spacing[3], theme.spacing[3], theme.fontSize.sm);
+    return styled.css(_templateObject5$5 || (_templateObject5$5 = _taggedTemplateLiteral(["\n        padding: ", " ", ";\n        font-size: ", ";\n      "])), currentTheme.spacing[3], currentTheme.spacing[3], currentTheme.fontSize.sm);
   }
   if (size === "md") {
-    return styled.css(_templateObject6$5 || (_templateObject6$5 = _taggedTemplateLiteral(["\n        padding: ", " ", ";\n        font-size: ", ";\n      "])), theme.spacing[2], theme.spacing[4], theme.fontSize.sm);
+    return styled.css(_templateObject6$5 || (_templateObject6$5 = _taggedTemplateLiteral(["\n        padding: ", " ", ";\n        font-size: ", ";\n      "])), currentTheme.spacing[2], currentTheme.spacing[4], currentTheme.fontSize.sm);
   }
   if (size === "lg") {
-    return styled.css(_templateObject7$5 || (_templateObject7$5 = _taggedTemplateLiteral(["\n        padding: ", " ", ";\n        font-size: ", ";\n      "])), theme.spacing[3], theme.spacing[4], theme.fontSize.base);
+    return styled.css(_templateObject7$5 || (_templateObject7$5 = _taggedTemplateLiteral(["\n        padding: ", " ", ";\n        font-size: ", ";\n      "])), currentTheme.spacing[3], currentTheme.spacing[4], currentTheme.fontSize.base);
   }
   return styled.css(_templateObject8$5 || (_templateObject8$5 = _taggedTemplateLiteral([""])));
 }, _ref10 => {
@@ -1620,21 +1721,24 @@ const StyledInput = styled.input(_templateObject4$5 || (_templateObject4$5 = _ta
   return fullWidth && styled.css(_templateObject9$5 || (_templateObject9$5 = _taggedTemplateLiteral(["\n      width: 100%;\n    "])));
 });
 const HelperText$5 = styled.p(_templateObject0$5 || (_templateObject0$5 = _taggedTemplateLiteral(["\n  margin-top: ", ";\n  font-size: ", ";\n  color: ", ";\n"])), _ref11 => {
+  var _theme$spacing2;
   let {
-    theme
+    theme: theme$1
   } = _ref11;
-  return theme.spacing[1];
+  return (theme$1 === null || theme$1 === void 0 || (_theme$spacing2 = theme$1.spacing) === null || _theme$spacing2 === void 0 ? void 0 : _theme$spacing2[1]) || theme.spacing[1];
 }, _ref12 => {
+  var _theme$fontSize2;
   let {
-    theme
+    theme: theme$1
   } = _ref12;
-  return theme.fontSize.xs;
+  return (theme$1 === null || theme$1 === void 0 || (_theme$fontSize2 = theme$1.fontSize) === null || _theme$fontSize2 === void 0 ? void 0 : _theme$fontSize2.xs) || theme.fontSize.xs;
 }, _ref13 => {
+  var _theme$colors7, _theme$colors8;
   let {
-    theme,
+    theme: theme$1,
     hasError
   } = _ref13;
-  return hasError ? theme.colors.error : theme.colors.gray[500];
+  return hasError ? (theme$1 === null || theme$1 === void 0 || (_theme$colors7 = theme$1.colors) === null || _theme$colors7 === void 0 ? void 0 : _theme$colors7.error) || theme.colors.error : (theme$1 === null || theme$1 === void 0 || (_theme$colors8 = theme$1.colors) === null || _theme$colors8 === void 0 || (_theme$colors8 = _theme$colors8.gray) === null || _theme$colors8 === void 0 ? void 0 : _theme$colors8[500]) || theme.colors.gray[500];
 });
 const Input = /*#__PURE__*/React.forwardRef((_ref14, ref) => {
   let {
@@ -2389,91 +2493,6 @@ const Select = /*#__PURE__*/React.forwardRef((_ref16, ref) => {
 });
 Select.displayName = "Select";
 
-const theme = {
-  colors: {
-    primary: "#007AC2",
-    error: "#ff1100",
-    dark: "#333333",
-    light: "#666666",
-    white: "#ffffff",
-    black: "#000000",
-    gray: {
-      50: "#f9fafb",
-      100: "#f3f4f6",
-      200: "#e5e7eb",
-      300: "#d1d5db",
-      400: "#9ca3af",
-      500: "#6b7280",
-      600: "#4b5563",
-      700: "#374151",
-      800: "#1f2937",
-      900: "#111827"
-    }
-  },
-  spacing: {
-    0: "0",
-    1: "0.25rem",
-    2: "0.5rem",
-    3: "0.75rem",
-    4: "1rem",
-    5: "1.25rem",
-    6: "1.5rem",
-    8: "2rem",
-    10: "2.5rem",
-    12: "3rem",
-    16: "4rem",
-    18: "4.5rem",
-    20: "5rem",
-    24: "6rem",
-    32: "8rem",
-    40: "10rem",
-    48: "12rem",
-    56: "14rem",
-    64: "16rem",
-    88: "22rem"
-  },
-  fontSize: {
-    xs: "0.75rem",
-    sm: "0.875rem",
-    base: "1rem",
-    lg: "1.125rem",
-    xl: "1.25rem",
-    "2xl": "1.5rem",
-    "3xl": "1.875rem",
-    "4xl": "2.25rem",
-    "5xl": "3rem",
-    "6xl": "3.75rem"
-  },
-  fontFamily: {
-    sans: ["Inter", "system-ui", "sans-serif"],
-    serif: ["Georgia", "Cambria", "Times New Roman", "Times", "serif"],
-    mono: ["Menlo", "Monaco", "Consolas", "Liberation Mono", "Courier New", "monospace"]
-  },
-  borderRadius: {
-    none: "0",
-    sm: "0.125rem",
-    base: "0.25rem",
-    md: "0.375rem",
-    lg: "0.5rem",
-    xl: "0.75rem",
-    "2xl": "1rem",
-    "3xl": "1.5rem",
-    full: "9999px"
-  },
-  shadows: {
-    sm: "0 1px 2px 0 rgba(0, 0, 0, 0.05)",
-    base: "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)",
-    md: "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
-    lg: "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
-    xl: "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)"
-  },
-  transitions: {
-    fast: "150ms ease-in-out",
-    base: "300ms ease-in-out",
-    slow: "500ms ease-in-out"
-  }
-};
-
 const ThemeProvider = _ref => {
   let {
     children