@mailstep/design-system 0.8.27 → 0.8.28

package/ui/Forms/RadioButton/styles.js

@@ -1,76 +1,86 @@
-function _tagged_template_literal(strings, raw) {
-    if (!raw) {
-        raw = strings.slice(0);
-    }
-    return Object.freeze(Object.defineProperties(strings, {
-        raw: {
-            value: Object.freeze(raw)
-        }
-    }));
-}
-function _templateObject() {
-    var data = _tagged_template_literal([
-        "\n  display: flex;\n  align-items: center;\n  height: auto;\n  width: auto;\n  box-sizing: border-box;\n"
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject1() {
-    var data = _tagged_template_literal([
-        "\n  display: flex;\n  position: relative;\n  width: 18px;\n  height: 18px;\n  & > span > span {\n    width: 10px;\n    height: 10px;\n  }\n  & > * {\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    left: 0;\n    top: 0;\n  }\n"
-    ]);
-    _templateObject1 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject2() {
-    var data = _tagged_template_literal([
-        "\n  border-radius: 50%;\n  background-color: white;\n  border: 1.5px solid;\n  border-color: lightGray5;\n  pointer-events: none;\n  cursor: pointer;\n  position: relative;\n\n  & span {\n    position: absolute;\n    left: 50%;\n    top: 50%;\n    transform: translate(-50%, -50%);\n    box-sizing: border-box;\n    border-radius: 50%;\n    transition: opacity 100ms ease-out;\n    background-color: white;\n  }\n\n  input[type='radio']:checked + & {\n    border-color: red1;\n  }\n\n  input[type='radio']:disabled + & {\n    border-color: gray1;\n  }\n\n  input[type='radio']:not(:disabled):not(:checked):hover + & {\n    border-color: gray1;\n  }\n\n  input[type='radio']:hover:not(:disabled):not(:checked) + & > span,\n  input[type='radio']:checked:disabled + & > span {\n    background-color: gray1;\n  }\n\n  input[type='radio']:checked + & > span {\n    background-color: red1;\n  }\n"
-    ]);
-    _templateObject2 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject3() {
-    var data = _tagged_template_literal([
-        "\n  width: 10px;\n  height: 10px;\n"
-    ]);
-    _templateObject3 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject4() {
-    var data = _tagged_template_literal([
-        "\n  opacity: 0;\n  border-radius: 50%;\n  width: 18px;\n  height: 18px;\n  cursor: ",
-        ";\n  margin: 0;\n"
-    ]);
-    _templateObject4 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject5() {
-    var data = _tagged_template_literal([
-        "\n  margin: 0;\n  margin-left: 8px;\n  font-size: 14px;\n"
-    ]);
-    _templateObject5 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-import styled from "@xstyled/styled-components";
-var Wrapper = styled.div(_templateObject());
-var Item = styled.div(_templateObject1());
-var PaintoverLayer = styled.span(_templateObject2());
-var CenterDot = styled.span(_templateObject3());
-var StyledRadio = styled.input(_templateObject4(), function(param) {
-    var disabled = param.disabled;
-    return disabled ? "default" : "pointer";
-});
-var Label = styled.label(_templateObject5());
+import styled$1 from "@xstyled/styled-components";
+//#region packages/ui/Forms/RadioButton/styles.ts
+const Wrapper = styled$1.div`
+  display: flex;
+  align-items: center;
+  height: auto;
+  width: auto;
+  box-sizing: border-box;
+`;
+const Item = styled$1.div`
+  display: flex;
+  position: relative;
+  width: 18px;
+  height: 18px;
+  & > span > span {
+    width: 10px;
+    height: 10px;
+  }
+  & > * {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    left: 0;
+    top: 0;
+  }
+`;
+const PaintoverLayer = styled$1.span`
+  border-radius: 50%;
+  background-color: white;
+  border: 1.5px solid;
+  border-color: lightGray5;
+  pointer-events: none;
+  cursor: pointer;
+  position: relative;
+
+  & span {
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    box-sizing: border-box;
+    border-radius: 50%;
+    transition: opacity 100ms ease-out;
+    background-color: white;
+  }
+
+  input[type='radio']:checked + & {
+    border-color: red1;
+  }
+
+  input[type='radio']:disabled + & {
+    border-color: gray1;
+  }
+
+  input[type='radio']:not(:disabled):not(:checked):hover + & {
+    border-color: gray1;
+  }
+
+  input[type='radio']:hover:not(:disabled):not(:checked) + & > span,
+  input[type='radio']:checked:disabled + & > span {
+    background-color: gray1;
+  }
+
+  input[type='radio']:checked + & > span {
+    background-color: red1;
+  }
+`;
+const CenterDot = styled$1.span`
+  width: 10px;
+  height: 10px;
+`;
+const StyledRadio = styled$1.input`
+  opacity: 0;
+  border-radius: 50%;
+  width: 18px;
+  height: 18px;
+  cursor: ${({ disabled }) => disabled ? "default" : "pointer"};
+  margin: 0;
+`;
+const Label = styled$1.label`
+  margin: 0;
+  margin-left: 8px;
+  font-size: 14px;
+`;
+//#endregion
 export { CenterDot, Item, Label, PaintoverLayer, StyledRadio, Wrapper };

package/ui/Forms/RadioButton/types.js

@@ -0,0 +1 @@
+export {};

package/ui/Forms/TextArea/TextArea.js

@@ -1,155 +1,35 @@
-function _define_property(obj, key, value) {
-    if (key in obj) {
-        Object.defineProperty(obj, key, {
-            value: value,
-            enumerable: true,
-            configurable: true,
-            writable: true
-        });
-    } else {
-        obj[key] = value;
-    }
-    return obj;
-}
-function _object_spread(target) {
-    for(var i = 1; i < arguments.length; i++){
-        var source = arguments[i] != null ? arguments[i] : {};
-        var ownKeys = Object.keys(source);
-        if (typeof Object.getOwnPropertySymbols === "function") {
-            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
-                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
-            }));
-        }
-        ownKeys.forEach(function(key) {
-            _define_property(target, key, source[key]);
-        });
-    }
-    return target;
-}
-function ownKeys(object, enumerableOnly) {
-    var keys = Object.keys(object);
-    if (Object.getOwnPropertySymbols) {
-        var symbols = Object.getOwnPropertySymbols(object);
-        if (enumerableOnly) {
-            symbols = symbols.filter(function(sym) {
-                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-            });
-        }
-        keys.push.apply(keys, symbols);
-    }
-    return keys;
-}
-function _object_spread_props(target, source) {
-    source = source != null ? source : {};
-    if (Object.getOwnPropertyDescriptors) {
-        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-    } else {
-        ownKeys(Object(source)).forEach(function(key) {
-            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-        });
-    }
-    return target;
-}
-function _object_without_properties(source, excluded) {
-    if (source == null) return {};
-    var target = {}, sourceKeys, key, i;
-    if (typeof Reflect !== "undefined" && Reflect.ownKeys) {
-        sourceKeys = Reflect.ownKeys(Object(source));
-        for(i = 0; i < sourceKeys.length; i++){
-            key = sourceKeys[i];
-            if (excluded.indexOf(key) >= 0) continue;
-            if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
-            target[key] = source[key];
-        }
-        return target;
-    }
-    target = _object_without_properties_loose(source, excluded);
-    if (Object.getOwnPropertySymbols) {
-        sourceKeys = Object.getOwnPropertySymbols(source);
-        for(i = 0; i < sourceKeys.length; i++){
-            key = sourceKeys[i];
-            if (excluded.indexOf(key) >= 0) continue;
-            if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
-            target[key] = source[key];
-        }
-    }
-    return target;
-}
-function _object_without_properties_loose(source, excluded) {
-    if (source == null) return {};
-    var target = {}, sourceKeys = Object.getOwnPropertyNames(source), key, i;
-    for(i = 0; i < sourceKeys.length; i++){
-        key = sourceKeys[i];
-        if (excluded.indexOf(key) >= 0) continue;
-        if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
-        target[key] = source[key];
-    }
-    return target;
-}
+import Icon from "../../Elements/Icon/Icon.js";
+import ErrorMessage from "../../Elements/ErrorMessage/ErrorMessage.js";
+import { FieldLabel } from "../../Elements/Label/Label.js";
+import "../../Elements/Label/index.js";
+import SpaceAroundWrap from "../../Elements/SpaceAround/SpaceAround.js";
+import "../../Elements/SpaceAround/index.js";
+import { BorderWrap, IconWrap, InnerWrap, StyledTextArea, TextAreaWrap } from "./styles.js";
+import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import ErrorMessage from "../../Elements/ErrorMessage/ErrorMessage";
-import FaIcon from "../../Elements/Icon/Icon";
-import { FieldLabel } from "../../Elements/Label";
-import { SpaceAroundWrap } from "../../Elements/SpaceAround";
-import { StyledTextArea, TextAreaWrap, InnerWrap, BorderWrap, IconWrap } from "./styles";
-var TextArea = function TextArea(_0) {
-    var name = _0.name, label = _0.label, value = _0.value, disabled = _0.disabled, error = _0.error, _0_spaceAround = _0.spaceAround, spaceAround = _0_spaceAround === void 0 ? false : _0_spaceAround, _0_isInvalid = _0.isInvalid, isInvalid = _0_isInvalid === void 0 ? void 0 : _0_isInvalid, className = _0.className, resize = _0.resize, icon = _0.icon, _0_rows = _0.rows, rows = _0_rows === void 0 ? 4 : _0_rows, Footer = _0.Footer, rest = _object_without_properties(_0, [
-        "name",
-        "label",
-        "value",
-        "disabled",
-        "error",
-        "spaceAround",
-        "isInvalid",
-        "className",
-        "resize",
-        "icon",
-        "rows",
-        "Footer"
-    ]);
-    var $isInvalid = isInvalid !== void 0 ? isInvalid : !!error;
-    return /* @__PURE__ */ jsxs(SpaceAroundWrap, {
-        spaceAround: spaceAround,
-        children: [
-            /* @__PURE__ */ jsxs(TextAreaWrap, {
-                children: [
-                    label && /* @__PURE__ */ jsx(FieldLabel, {
-                        htmlFor: name,
-                        children: label
-                    }),
-                    /* @__PURE__ */ jsxs(BorderWrap, {
-                        $isInvalid: $isInvalid,
-                        disabled: disabled,
-                        children: [
-                            /* @__PURE__ */ jsxs(InnerWrap, {
-                                children: [
-                                    icon && /* @__PURE__ */ jsx(IconWrap, {
-                                        children: /* @__PURE__ */ jsx(FaIcon, {
-                                            icon: icon
-                                        })
-                                    }),
-                                    /* @__PURE__ */ jsx(StyledTextArea, _object_spread_props(_object_spread({
-                                        name: name,
-                                        value: value,
-                                        disabled: disabled,
-                                        className: className,
-                                        $isInvalid: $isInvalid,
-                                        $resize: resize
-                                    }, rest), {
-                                        rows: rows
-                                    }))
-                                ]
-                            }),
-                            Footer
-                        ]
-                    })
-                ]
-            }),
-            error && /* @__PURE__ */ jsx(ErrorMessage, {
-                children: error
-            })
-        ]
-    });
+//#region packages/ui/Forms/TextArea/TextArea.tsx
+const TextArea = ({ name, label, value, disabled, error, spaceAround = false, isInvalid = void 0, className, resize, icon, rows = 4, Footer, ...rest }) => {
+	const $isInvalid = isInvalid !== void 0 ? isInvalid : !!error;
+	return /* @__PURE__ */ jsxs(SpaceAroundWrap, {
+		spaceAround,
+		children: [/* @__PURE__ */ jsxs(TextAreaWrap, { children: [label && /* @__PURE__ */ jsx(FieldLabel, {
+			htmlFor: name,
+			children: label
+		}), /* @__PURE__ */ jsxs(BorderWrap, {
+			$isInvalid,
+			disabled,
+			children: [/* @__PURE__ */ jsxs(InnerWrap, { children: [icon && /* @__PURE__ */ jsx(IconWrap, { children: /* @__PURE__ */ jsx(Icon, { icon }) }), /* @__PURE__ */ jsx(StyledTextArea, {
+				name,
+				value,
+				disabled,
+				className,
+				$isInvalid,
+				$resize: resize,
+				...rest,
+				rows
+			})] }), Footer]
+		})] }), error && /* @__PURE__ */ jsx(ErrorMessage, { children: error })]
+	});
 };
-var TextArea_default = TextArea;
-export { TextArea_default as default };
+//#endregion
+export { TextArea as default };

package/ui/Forms/TextArea/index.js

@@ -1,3 +1,5 @@
-import TextArea from "./TextArea";
+import TextArea from "./TextArea.js";
+//#region packages/ui/Forms/TextArea/index.ts
 var TextArea_default = TextArea;
+//#endregion
 export { TextArea_default as default };

package/ui/Forms/TextArea/styles.js

@@ -1,100 +1,76 @@
-function _tagged_template_literal(strings, raw) {
-    if (!raw) {
-        raw = strings.slice(0);
-    }
-    return Object.freeze(Object.defineProperties(strings, {
-        raw: {
-            value: Object.freeze(raw)
-        }
-    }));
-}
-function _templateObject() {
-    var data = _tagged_template_literal([
-        "\n  font-size: 12px;\n  color: ",
-        ";\n\n  & svg {\n    margin-top: 2;\n    margin-right: 1;\n  }\n"
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject1() {
-    var data = _tagged_template_literal([
-        "\n          resize: ",
-        ";\n        "
-    ]);
-    _templateObject1 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject2() {
-    var data = _tagged_template_literal([
-        "\n  ",
-        ";\n  display: block;\n  width: 100%;\n  font-size: 1;\n  font-family: ",
-        ";\n  line-height: 0;\n  transition: inputTransition;\n  border: none;\n  font-weight: 800;\n  color: ",
-        ";\n  background-color: transparent;\n  :focus {\n    outline: 0;\n    color: blue2;\n  }\n  ",
-        "\n\n  ::placeholder {\n    color: lightGray5;\n    font-size: 14px;\n    font-weight: 400;\n  }\n"
-    ]);
-    _templateObject2 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject3() {
-    var data = _tagged_template_literal([
-        "\n  position: relative;\n"
-    ]);
-    _templateObject3 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject4() {
-    var data = _tagged_template_literal([
-        "\n  display: flex;\n  flex-direction: column;\n  background-color: white;\n  padding-top: 1;\n  padding-bottom: 1;\n  padding-right: 1;\n  padding-left: 12px;\n  border: slim;\n  border-color: ",
-        ";\n  color: ",
-        ";\n  background-color: ",
-        ";\n  background-clip: padding-box;\n  border-radius: lg;\n\n  :focus-within {\n    background-color: white;\n    border-color: blue2;\n    color: blue2;\n  }\n\n  :hover {\n    border-color: ",
-        ";\n  }\n\n  :disabled {\n    background-color: lightGray1;\n  }\n"
-    ]);
-    _templateObject4 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject5() {
-    var data = _tagged_template_literal([
-        "\n  display: flex;\n  position: relative;\n"
-    ]);
-    _templateObject5 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-import styled, { css } from "@xstyled/styled-components";
-import { system, th } from "@xstyled/system";
-var IconWrap = styled.div(_templateObject(), th.color("lightGray5"));
-var StyledTextArea = styled.textarea(_templateObject2(), system, th("fonts.primary"), function(param) {
-    var $isInvalid = param.$isInvalid, disabled = param.disabled;
-    return $isInvalid ? th.color("red1") : disabled ? th.color("gray") : th.color("typoPrimary");
-}, function(param) {
-    var $resize = param.$resize;
-    return $resize ? css(_templateObject1(), $resize) : "";
-});
-var TextAreaWrap = styled.div(_templateObject3());
-var BorderWrap = styled.div(_templateObject4(), function(param) {
-    var $isInvalid = param.$isInvalid;
-    return $isInvalid ? th.color("red1") : th.color("lightGray6");
-}, function(param) {
-    var $isInvalid = param.$isInvalid;
-    return $isInvalid ? th.color("red1") : th.color("gray");
-}, function(param) {
-    var disabled = param.disabled;
-    return disabled ? th("colors.lightGray1") : "unset";
-}, function(param) {
-    var disabled = param.disabled;
-    return disabled ? th("colors.lightGray3") : th("colors.gray5");
-});
-var InnerWrap = styled.div(_templateObject5());
+import styled$1, { css } from "@xstyled/styled-components";
+import { system as system$1, th as th$1 } from "/home/linomorfed/Projects/design-system/node_modules/@xstyled/system/dist/index.mjs";
+//#region packages/ui/Forms/TextArea/styles.ts
+const IconWrap = styled$1.div`
+  font-size: 12px;
+  color: ${th$1.color("lightGray5")};
+
+  & svg {
+    margin-top: 2;
+    margin-right: 1;
+  }
+`;
+const StyledTextArea = styled$1.textarea`
+  ${system$1};
+  display: block;
+  width: 100%;
+  font-size: 1;
+  font-family: ${th$1("fonts.primary")};
+  line-height: 0;
+  transition: inputTransition;
+  border: none;
+  font-weight: 800;
+  color: ${({ $isInvalid, disabled }) => $isInvalid ? th$1.color("red1") : disabled ? th$1.color("gray") : th$1.color("typoPrimary")};
+  background-color: transparent;
+  :focus {
+    outline: 0;
+    color: blue2;
+  }
+  ${({ $resize }) => $resize ? css`
+          resize: ${$resize};
+        ` : ""}
+
+  ::placeholder {
+    color: lightGray5;
+    font-size: 14px;
+    font-weight: 400;
+  }
+`;
+const TextAreaWrap = styled$1.div`
+  position: relative;
+`;
+const BorderWrap = styled$1.div`
+  display: flex;
+  flex-direction: column;
+  background-color: white;
+  padding-top: 1;
+  padding-bottom: 1;
+  padding-right: 1;
+  padding-left: 12px;
+  border: slim;
+  border-color: ${({ $isInvalid }) => $isInvalid ? th$1.color("red1") : th$1.color("lightGray6")};
+  color: ${({ $isInvalid }) => $isInvalid ? th$1.color("red1") : th$1.color("gray")};
+  background-color: ${({ disabled }) => disabled ? th$1("colors.lightGray1") : "unset"};
+  background-clip: padding-box;
+  border-radius: lg;
+
+  :focus-within {
+    background-color: white;
+    border-color: blue2;
+    color: blue2;
+  }
+
+  :hover {
+    border-color: ${({ disabled }) => disabled ? th$1("colors.lightGray3") : th$1("colors.gray5")};
+  }
+
+  :disabled {
+    background-color: lightGray1;
+  }
+`;
+const InnerWrap = styled$1.div`
+  display: flex;
+  position: relative;
+`;
+//#endregion
 export { BorderWrap, IconWrap, InnerWrap, StyledTextArea, TextAreaWrap };

package/ui/System/Fonts/index.js

@@ -1,17 +1,54 @@
+import Inter_Light_mailstep_default from "../../packages/assets/fonts/Inter-Light_mailstep.js";
+import Inter_Regular_mailstep_default from "../../packages/assets/fonts/Inter-Regular_mailstep.js";
+import Inter_Medium_mailstep_default from "../../packages/assets/fonts/Inter-Medium_mailstep.js";
+import Inter_SemiBold_mailstep_default from "../../packages/assets/fonts/Inter-SemiBold_mailstep.js";
+import Inter_Bold_mailstep_default from "../../packages/assets/fonts/Inter-Bold_mailstep.js";
 import { jsx } from "react/jsx-runtime";
 import { Helmet } from "react-helmet";
-import InterLightMailstep from "../../../assets/fonts/Inter-Light_mailstep.woff2";
-import InterRegularMailstep from "../../../assets/fonts/Inter-Regular_mailstep.woff2";
-import InterMediumMailstep from "../../../assets/fonts/Inter-Medium_mailstep.woff2";
-import InterSemiBoldMailstep from "../../../assets/fonts/Inter-SemiBold_mailstep.woff2";
-import InterBoldMailstep from "../../../assets/fonts/Inter-Bold_mailstep.woff2";
-var Fonts = function Fonts() {
-    return /* @__PURE__ */ jsx(Helmet, {
-        children: /* @__PURE__ */ jsx("style", {
-            type: "text/css",
-            children: "\n        @font-face {\n          font-family: 'Inter';\n          font-style: normal;\n          font-weight: 300;\n          font-display: swap;\n          src: url(".concat(InterLightMailstep, ") format('woff2');\n        }\n\n        @font-face {\n          font-family: 'Inter';\n          font-style: normal;\n          font-weight: 400;\n          font-display: swap;\n          src: url(").concat(InterRegularMailstep, ") format('woff2');\n        }\n      \n        @font-face {\n          font-family: 'Inter';\n          font-style: normal;\n          font-weight: 500;\n          font-display: swap;\n          src: url(").concat(InterMediumMailstep, ") format('woff2');\n        }\n\n        @font-face {\n          font-family: 'Inter';\n          font-style: normal;\n          font-weight: 600;\n          font-display: swap;\n          src: url(").concat(InterSemiBoldMailstep, ") format('woff2');\n        }\n      \n        @font-face {\n          font-family: 'Inter';\n          font-style: normal;\n          font-weight: 700;\n          font-display: swap;\n          src: url(").concat(InterBoldMailstep, ") format('woff2');\n        }\n    ")
-        })
-    });
-};
-var Fonts_default = Fonts;
-export { Fonts_default as default };
+//#region packages/ui/System/Fonts/index.tsx
+const Fonts = () => /* @__PURE__ */ jsx(Helmet, { children: /* @__PURE__ */ jsx("style", {
+	type: "text/css",
+	children: `
+        @font-face {
+          font-family: 'Inter';
+          font-style: normal;
+          font-weight: 300;
+          font-display: swap;
+          src: url(${Inter_Light_mailstep_default}) format('woff2');
+        }
+
+        @font-face {
+          font-family: 'Inter';
+          font-style: normal;
+          font-weight: 400;
+          font-display: swap;
+          src: url(${Inter_Regular_mailstep_default}) format('woff2');
+        }
+      
+        @font-face {
+          font-family: 'Inter';
+          font-style: normal;
+          font-weight: 500;
+          font-display: swap;
+          src: url(${Inter_Medium_mailstep_default}) format('woff2');
+        }
+
+        @font-face {
+          font-family: 'Inter';
+          font-style: normal;
+          font-weight: 600;
+          font-display: swap;
+          src: url(${Inter_SemiBold_mailstep_default}) format('woff2');
+        }
+      
+        @font-face {
+          font-family: 'Inter';
+          font-style: normal;
+          font-weight: 700;
+          font-display: swap;
+          src: url(${Inter_Bold_mailstep_default}) format('woff2');
+        }
+    `
+}) });
+//#endregion
+export { Fonts as default };

package/ui/ThemeProvider/ThemeProvider.js

@@ -1,20 +1,17 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import themes from "./themes/index.js";
 import { createContext } from "react";
-import { ThemeProvider, Preflight } from "@xstyled/styled-components";
-import themes from "./themes";
-var LanguageContext = createContext("en");
-var MailstepThemeProvider = function MailstepThemeProvider(param) {
-    var children = param.children, _param_theme = param.theme, theme = _param_theme === void 0 ? "default" : _param_theme, _param_preflight = param.preflight, preflight = _param_preflight === void 0 ? true : _param_preflight, _param_language = param.language, language = _param_language === void 0 ? "en" : _param_language;
-    return /* @__PURE__ */ jsx(LanguageContext.Provider, {
-        value: language,
-        children: /* @__PURE__ */ jsxs(ThemeProvider, {
-            theme: themes[theme],
-            children: [
-                preflight && /* @__PURE__ */ jsx(Preflight, {}),
-                children
-            ]
-        })
-    });
+import { Preflight, ThemeProvider } from "@xstyled/styled-components";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region packages/ui/ThemeProvider/ThemeProvider.tsx
+const LanguageContext = createContext("en");
+const MailstepThemeProvider = ({ children, theme = "default", preflight = true, language = "en" }) => {
+	return /* @__PURE__ */ jsx(LanguageContext.Provider, {
+		value: language,
+		children: /* @__PURE__ */ jsxs(ThemeProvider, {
+			theme: themes[theme],
+			children: [preflight && /* @__PURE__ */ jsx(Preflight, {}), children]
+		})
+	});
 };
-var ThemeProvider_default = MailstepThemeProvider;
-export { LanguageContext, ThemeProvider_default as default };
+//#endregion
+export { LanguageContext, MailstepThemeProvider as default };