@koine/react 2.0.0-beta.2 → 2.0.0-beta.5

package/Forms/Input/Input.js

@@ -1,20 +1,59 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Input = exports.InputNative = exports.InputPost = exports.InputPre = exports.InputMain = exports.InputWrap = void 0;
-var tslib_1 = require("tslib");
-var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = require("react");
-var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-var Label_1 = require("../Label/Label");
-var styles_1 = require("../styles");
-exports.InputWrap = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"])));
-exports.InputMain = styled_components_1.default.div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  flex: 1;\n"], ["\n  flex: 1;\n"])));
-exports.InputPre = styled_components_1.default.div(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject([""], [""])));
-exports.InputPost = styled_components_1.default.div(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject([""], [""])));
-exports.InputNative = styled_components_1.default.input(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n  ", "\n  ", "\n"], ["\n  ", "\n  ", "\n"])), styles_1.inputBase, styles_1.inputFocus);
-exports.Input = (0, react_1.forwardRef)(function Input(_a, ref) {
-    var register = _a.register, name = _a.name, label = _a.label, props = tslib_1.__rest(_a, ["register", "name", "label"]);
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    InputWrap: function() {
+        return InputWrap;
+    },
+    InputMain: function() {
+        return InputMain;
+    },
+    InputPre: function() {
+        return InputPre;
+    },
+    InputPost: function() {
+        return InputPost;
+    },
+    InputNative: function() {
+        return InputNative;
+    },
+    Input: function() {
+        return Input;
+    }
+});
+const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
+const _react = require("react");
+const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
+const _Label = require("../Label/Label");
+const _styles = require("../styles");
+const InputWrap = _styledcomponents.default.div`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+`;
+const InputMain = _styledcomponents.default.div`
+  flex: 1;
+`;
+const InputPre = _styledcomponents.default.div``;
+const InputPost = _styledcomponents.default.div``;
+const InputNative = _styledcomponents.default.input`
+  ${_styles.inputBase}
+  ${_styles.inputFocus}
+`;
+const Input = /*#__PURE__*/ (0, _react.forwardRef)(function Input({ register, name, label, ...props }, ref) {
     // console.log("Input: render");
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [label && (0, jsx_runtime_1.jsx)(Label_1.Label, { children: label }), (0, jsx_runtime_1.jsx)(exports.InputNative, tslib_1.__assign({}, (register ? register(name) : { name: name, ref: ref }), props))] }));
+    return /*#__PURE__*/ React.createElement(React.Fragment, null, label && /*#__PURE__*/ React.createElement(_Label.Label, null, label), /*#__PURE__*/ React.createElement(InputNative, {
+        ...register ? register(name) : {
+            name,
+            ref
+        },
+        ...props
+    }));
 });
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;

package/Forms/Input/Input.mjs

@@ -1,17 +1,28 @@
-import { __assign, __makeTemplateObject, __rest } from "tslib";
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import styled from "styled-components";
 import { Label } from "../Label/Label";
 import { inputBase, inputFocus } from "../styles";
-export var InputWrap = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"])));
-export var InputMain = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  flex: 1;\n"], ["\n  flex: 1;\n"])));
-export var InputPre = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject([""], [""])));
-export var InputPost = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject([""], [""])));
-export var InputNative = styled.input(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  ", "\n  ", "\n"], ["\n  ", "\n  ", "\n"])), inputBase, inputFocus);
-export var Input = forwardRef(function Input(_a, ref) {
-    var register = _a.register, name = _a.name, label = _a.label, props = __rest(_a, ["register", "name", "label"]);
+export const InputWrap = styled.div`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+`;
+export const InputMain = styled.div`
+  flex: 1;
+`;
+export const InputPre = styled.div``;
+export const InputPost = styled.div``;
+export const InputNative = styled.input`
+  ${inputBase}
+  ${inputFocus}
+`;
+export const Input = /*#__PURE__*/ forwardRef(function Input({ register, name, label, ...props }, ref) {
     // console.log("Input: render");
-    return (_jsxs(_Fragment, { children: [label && _jsx(Label, { children: label }), _jsx(InputNative, __assign({}, (register ? register(name) : { name: name, ref: ref }), props))] }));
+    return /*#__PURE__*/ React.createElement(React.Fragment, null, label && /*#__PURE__*/ React.createElement(Label, null, label), /*#__PURE__*/ React.createElement(InputNative, {
+        ...register ? register(name) : {
+            name,
+            ref
+        },
+        ...props
+    }));
 });
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;

package/Forms/Input/index.js

@@ -1,4 +1,6 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./Input"), exports);
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./Input"), exports);

package/Forms/InputGroup/InputGroup.js

@@ -1,19 +1,75 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.InputGroup = exports.InputGroupButtonPost = exports.InputGroupButtonPre = exports.InputGroupMain = exports.InputGroupRoot = void 0;
-var tslib_1 = require("tslib");
-var jsx_runtime_1 = require("react/jsx-runtime");
-var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-var Buttons_1 = require("../../Buttons");
-var Field_1 = require("../Field");
-var media_1 = require("../../styles/media");
-exports.InputGroupRoot = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  ", "\n  display: flex;\n  ", " {\n    flex-direction: column;\n  }\n"], ["\n  ", "\n  display: flex;\n  ", " {\n    flex-direction: column;\n  }\n"])), Field_1.field, media_1.max.sm);
-exports.InputGroupMain = styled_components_1.default.div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  flex: 1;\n"], ["\n  flex: 1;\n"])));
-exports.InputGroupButtonPre = (0, styled_components_1.default)(Buttons_1.KoineButton)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n  ", " {\n    border-bottom: 0;\n    border-bottom-left-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n  ", " {\n    border-right: 0;\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n"], ["\n  ", " {\n    border-bottom: 0;\n    border-bottom-left-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n  ", " {\n    border-right: 0;\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n"])), media_1.max.sm, media_1.min.sm);
-exports.InputGroupButtonPost = (0, styled_components_1.default)(Buttons_1.KoineButton)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n  ", " {\n    border-top: 0;\n    border-top-left-radius: 0;\n    border-top-right-radius: 0;\n  }\n  ", " {\n    border-left: 0;\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n  }\n"], ["\n  ", " {\n    border-top: 0;\n    border-top-left-radius: 0;\n    border-top-right-radius: 0;\n  }\n  ", " {\n    border-left: 0;\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n  }\n"])), media_1.max.sm, media_1.min.sm);
-var InputGroup = function (_a) {
-    var pre = _a.pre, post = _a.post, _b = _a.Button, Button = _b === void 0 ? Buttons_1.KoineButton : _b, _c = _a.btnProps, btnProps = _c === void 0 ? {} : _c, children = _a.children, props = tslib_1.__rest(_a, ["pre", "post", "Button", "btnProps", "children"]);
-    return ((0, jsx_runtime_1.jsxs)(exports.InputGroupRoot, tslib_1.__assign({}, props, { children: [pre && (0, jsx_runtime_1.jsx)(exports.InputGroupButtonPre, tslib_1.__assign({ as: Button }, btnProps)), (0, jsx_runtime_1.jsx)(exports.InputGroupMain, { children: children }), post && (0, jsx_runtime_1.jsx)(exports.InputGroupButtonPost, tslib_1.__assign({ as: Button }, btnProps))] })));
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    InputGroupRoot: function() {
+        return InputGroupRoot;
+    },
+    InputGroupMain: function() {
+        return InputGroupMain;
+    },
+    InputGroupButtonPre: function() {
+        return InputGroupButtonPre;
+    },
+    InputGroupButtonPost: function() {
+        return InputGroupButtonPost;
+    },
+    InputGroup: function() {
+        return InputGroup;
+    }
+});
+const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
+const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
+const _Buttons = require("../../Buttons");
+const _media = require("../../styles/media");
+const _Field = require("../Field");
+const InputGroupRoot = _styledcomponents.default.div`
+  ${_Field.field}
+  display: flex;
+  ${_media.max.sm} {
+    flex-direction: column;
+  }
+`;
+const InputGroupMain = _styledcomponents.default.div`
+  flex: 1;
+`;
+const InputGroupButtonPre = (0, _styledcomponents.default)(_Buttons.KoineButton)`
+  ${_media.max.sm} {
+    border-bottom: 0;
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+  }
+  ${_media.min.sm} {
+    border-right: 0;
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+  }
+`;
+const InputGroupButtonPost = (0, _styledcomponents.default)(_Buttons.KoineButton)`
+  ${_media.max.sm} {
+    border-top: 0;
+    border-top-left-radius: 0;
+    border-top-right-radius: 0;
+  }
+  ${_media.min.sm} {
+    border-left: 0;
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+  }
+`;
+const InputGroup = ({ pre, post, Button = _Buttons.KoineButton, btnProps = {}, children, ...props })=>{
+    return /*#__PURE__*/ React.createElement(InputGroupRoot, props, pre && /*#__PURE__*/ React.createElement(InputGroupButtonPre, {
+        as: Button,
+        ...btnProps
+    }), /*#__PURE__*/ React.createElement(InputGroupMain, null, children), post && /*#__PURE__*/ React.createElement(InputGroupButtonPost, {
+        as: Button,
+        ...btnProps
+    }));
 };
-exports.InputGroup = InputGroup;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/Forms/InputGroup/InputGroup.mjs

@@ -1,15 +1,47 @@
-import { __assign, __makeTemplateObject, __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import styled from "styled-components";
 import { KoineButton } from "../../Buttons";
-import { field } from "../Field";
 import { max, min } from "../../styles/media";
-export var InputGroupRoot = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", "\n  display: flex;\n  ", " {\n    flex-direction: column;\n  }\n"], ["\n  ", "\n  display: flex;\n  ", " {\n    flex-direction: column;\n  }\n"])), field, max.sm);
-export var InputGroupMain = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  flex: 1;\n"], ["\n  flex: 1;\n"])));
-export var InputGroupButtonPre = styled(KoineButton)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  ", " {\n    border-bottom: 0;\n    border-bottom-left-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n  ", " {\n    border-right: 0;\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n"], ["\n  ", " {\n    border-bottom: 0;\n    border-bottom-left-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n  ", " {\n    border-right: 0;\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n"])), max.sm, min.sm);
-export var InputGroupButtonPost = styled(KoineButton)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  ", " {\n    border-top: 0;\n    border-top-left-radius: 0;\n    border-top-right-radius: 0;\n  }\n  ", " {\n    border-left: 0;\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n  }\n"], ["\n  ", " {\n    border-top: 0;\n    border-top-left-radius: 0;\n    border-top-right-radius: 0;\n  }\n  ", " {\n    border-left: 0;\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n  }\n"])), max.sm, min.sm);
-export var InputGroup = function (_a) {
-    var pre = _a.pre, post = _a.post, _b = _a.Button, Button = _b === void 0 ? KoineButton : _b, _c = _a.btnProps, btnProps = _c === void 0 ? {} : _c, children = _a.children, props = __rest(_a, ["pre", "post", "Button", "btnProps", "children"]);
-    return (_jsxs(InputGroupRoot, __assign({}, props, { children: [pre && _jsx(InputGroupButtonPre, __assign({ as: Button }, btnProps)), _jsx(InputGroupMain, { children: children }), post && _jsx(InputGroupButtonPost, __assign({ as: Button }, btnProps))] })));
+import { field } from "../Field";
+export const InputGroupRoot = styled.div`
+  ${field}
+  display: flex;
+  ${max.sm} {
+    flex-direction: column;
+  }
+`;
+export const InputGroupMain = styled.div`
+  flex: 1;
+`;
+export const InputGroupButtonPre = styled(KoineButton)`
+  ${max.sm} {
+    border-bottom: 0;
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+  }
+  ${min.sm} {
+    border-right: 0;
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+  }
+`;
+export const InputGroupButtonPost = styled(KoineButton)`
+  ${max.sm} {
+    border-top: 0;
+    border-top-left-radius: 0;
+    border-top-right-radius: 0;
+  }
+  ${min.sm} {
+    border-left: 0;
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+  }
+`;
+export const InputGroup = ({ pre, post, Button = KoineButton, btnProps = {}, children, ...props })=>{
+    return /*#__PURE__*/ React.createElement(InputGroupRoot, props, pre && /*#__PURE__*/ React.createElement(InputGroupButtonPre, {
+        as: Button,
+        ...btnProps
+    }), /*#__PURE__*/ React.createElement(InputGroupMain, null, children), post && /*#__PURE__*/ React.createElement(InputGroupButtonPost, {
+        as: Button,
+        ...btnProps
+    }));
 };
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/Forms/InputGroup/index.js

@@ -1,4 +1,6 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./InputGroup"), exports);
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./InputGroup"), exports);

package/Forms/Label/Label.js

@@ -1,9 +1,46 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Label = exports.labelMaterial = exports.label = void 0;
-var tslib_1 = require("tslib");
-var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-exports.label = "\n  display: flex;\n  font-size: 13px;\n  cursor: pointer;\n";
-exports.labelMaterial = "\n  z-index: 2;\n  position: relative;\n  display: inline-block;\n  padding: 0 5px;\n  font-weight: 100;\n  font-size: 10px;\n  background: var(--bodyBg);\n  transform: translateY(-0.3em) translateX(1em);\n  cursor: pointer;\n\n  + * {\n    margin-top: -1em;\n  }\n";
-exports.Label = styled_components_1.default.label(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), exports.labelMaterial);
-var templateObject_1;
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    label: function() {
+        return label;
+    },
+    labelMaterial: function() {
+        return labelMaterial;
+    },
+    Label: function() {
+        return Label;
+    }
+});
+const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
+const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
+const label = `
+  display: flex;
+  font-size: 13px;
+  cursor: pointer;
+`;
+const labelMaterial = `
+  z-index: 2;
+  position: relative;
+  display: inline-block;
+  padding: 0 5px;
+  font-weight: 100;
+  font-size: 10px;
+  background: var(--bodyBg);
+  transform: translateY(-0.3em) translateX(1em);
+  cursor: pointer;
+
+  + * {
+    margin-top: -1em;
+  }
+`;
+const Label = _styledcomponents.default.label`
+  ${labelMaterial}
+`;

package/Forms/Label/Label.mjs

@@ -1,6 +1,24 @@
-import { __makeTemplateObject } from "tslib";
 import styled from "styled-components";
-export var label = "\n  display: flex;\n  font-size: 13px;\n  cursor: pointer;\n";
-export var labelMaterial = "\n  z-index: 2;\n  position: relative;\n  display: inline-block;\n  padding: 0 5px;\n  font-weight: 100;\n  font-size: 10px;\n  background: var(--bodyBg);\n  transform: translateY(-0.3em) translateX(1em);\n  cursor: pointer;\n\n  + * {\n    margin-top: -1em;\n  }\n";
-export var Label = styled.label(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), labelMaterial);
-var templateObject_1;
+export const label = `
+  display: flex;
+  font-size: 13px;
+  cursor: pointer;
+`;
+export const labelMaterial = `
+  z-index: 2;
+  position: relative;
+  display: inline-block;
+  padding: 0 5px;
+  font-weight: 100;
+  font-size: 10px;
+  background: var(--bodyBg);
+  transform: translateY(-0.3em) translateX(1em);
+  cursor: pointer;
+
+  + * {
+    margin-top: -1em;
+  }
+`;
+export const Label = styled.label`
+  ${labelMaterial}
+`;

package/Forms/Label/index.js

@@ -1,4 +1,6 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./Label"), exports);
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./Label"), exports);

package/Forms/Password/Password.js

@@ -1,20 +1,58 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Password = exports.PasswordInputNative = void 0;
-var tslib_1 = require("tslib");
-var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = require("react");
-var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-var im_1 = require("react-icons/im");
-var Label_1 = require("../Label/Label");
-var Input_1 = require("../Input/Input");
-var ICON_WIDTH = "2em";
-var PasswordInputWrap = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  position: relative;\n"], ["\n  position: relative;\n"])));
-exports.PasswordInputNative = (0, styled_components_1.default)(Input_1.InputNative)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  position: relative;\n  padding-right: ", ";\n"], ["\n  position: relative;\n  padding-right: ", ";\n"])), ICON_WIDTH);
-var PasswordIcon = styled_components_1.default.span(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  width: ", ";\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  opacity: 0.5;\n"], ["\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  width: ", ";\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  opacity: 0.5;\n"])), ICON_WIDTH);
-exports.Password = (0, react_1.forwardRef)(function Password(_a, ref) {
-    var register = _a.register, name = _a.name, label = _a.label, props = tslib_1.__rest(_a, ["register", "name", "label"]);
-    var _b = (0, react_1.useState)(false), visible = _b[0], setVisible = _b[1];
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [label && (0, jsx_runtime_1.jsx)(Label_1.Label, { children: label }), (0, jsx_runtime_1.jsxs)(PasswordInputWrap, { children: [(0, jsx_runtime_1.jsx)(exports.PasswordInputNative, tslib_1.__assign({ type: visible ? "text" : "password", autoComplete: "new-password" }, (register ? register(name) : { name: name, ref: ref }), props)), (0, jsx_runtime_1.jsx)(PasswordIcon, { onClick: function () { return setVisible(function (prev) { return !prev; }); }, children: visible ? (0, jsx_runtime_1.jsx)(im_1.ImEyeBlocked, {}) : (0, jsx_runtime_1.jsx)(im_1.ImEye, {}) })] })] }));
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    PasswordInputNative: function() {
+        return PasswordInputNative;
+    },
+    Password: function() {
+        return Password;
+    }
+});
+const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
+const _react = require("react");
+const _im = require("react-icons/im");
+const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
+const _Input = require("../Input/Input");
+const _Label = require("../Label/Label");
+const ICON_WIDTH = "2em";
+const PasswordInputWrap = _styledcomponents.default.div`
+  position: relative;
+`;
+const PasswordInputNative = (0, _styledcomponents.default)(_Input.InputNative)`
+  position: relative;
+  padding-right: ${ICON_WIDTH};
+`;
+const PasswordIcon = _styledcomponents.default.span`
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  width: ${ICON_WIDTH};
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  opacity: 0.5;
+`;
+const Password = /*#__PURE__*/ (0, _react.forwardRef)(function Password({ register, name, label, ...props }, ref) {
+    const [visible, setVisible] = (0, _react.useState)(false);
+    return /*#__PURE__*/ React.createElement(React.Fragment, null, label && /*#__PURE__*/ React.createElement(_Label.Label, null, label), /*#__PURE__*/ React.createElement(PasswordInputWrap, null, /*#__PURE__*/ React.createElement(PasswordInputNative, {
+        type: visible ? "text" : "password",
+        autoComplete: "new-password",
+        ...register ? register(name) : {
+            name,
+            ref
+        },
+        ...props
+    }), /*#__PURE__*/ React.createElement(PasswordIcon, {
+        onClick: ()=>setVisible((prev)=>!prev)
+    }, visible ? /*#__PURE__*/ React.createElement(_im.ImEyeBlocked, null) : /*#__PURE__*/ React.createElement(_im.ImEye, null))));
 });
-var templateObject_1, templateObject_2, templateObject_3;

package/Forms/Password/Password.mjs

@@ -1,17 +1,39 @@
-import { __assign, __makeTemplateObject, __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { forwardRef, useState } from "react";
+import { ImEyeBlocked as IconInvisible, ImEye as IconVisible } from "react-icons/im";
 import styled from "styled-components";
-import { ImEye as IconVisible, ImEyeBlocked as IconInvisible, } from "react-icons/im";
-import { Label } from "../Label/Label";
 import { InputNative } from "../Input/Input";
-var ICON_WIDTH = "2em";
-var PasswordInputWrap = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n"], ["\n  position: relative;\n"])));
-export var PasswordInputNative = styled(InputNative)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: relative;\n  padding-right: ", ";\n"], ["\n  position: relative;\n  padding-right: ", ";\n"])), ICON_WIDTH);
-var PasswordIcon = styled.span(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  width: ", ";\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  opacity: 0.5;\n"], ["\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  width: ", ";\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  opacity: 0.5;\n"])), ICON_WIDTH);
-export var Password = forwardRef(function Password(_a, ref) {
-    var register = _a.register, name = _a.name, label = _a.label, props = __rest(_a, ["register", "name", "label"]);
-    var _b = useState(false), visible = _b[0], setVisible = _b[1];
-    return (_jsxs(_Fragment, { children: [label && _jsx(Label, { children: label }), _jsxs(PasswordInputWrap, { children: [_jsx(PasswordInputNative, __assign({ type: visible ? "text" : "password", autoComplete: "new-password" }, (register ? register(name) : { name: name, ref: ref }), props)), _jsx(PasswordIcon, { onClick: function () { return setVisible(function (prev) { return !prev; }); }, children: visible ? _jsx(IconInvisible, {}) : _jsx(IconVisible, {}) })] })] }));
+import { Label } from "../Label/Label";
+const ICON_WIDTH = "2em";
+const PasswordInputWrap = styled.div`
+  position: relative;
+`;
+export const PasswordInputNative = styled(InputNative)`
+  position: relative;
+  padding-right: ${ICON_WIDTH};
+`;
+const PasswordIcon = styled.span`
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  width: ${ICON_WIDTH};
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  opacity: 0.5;
+`;
+export const Password = /*#__PURE__*/ forwardRef(function Password({ register, name, label, ...props }, ref) {
+    const [visible, setVisible] = useState(false);
+    return /*#__PURE__*/ React.createElement(React.Fragment, null, label && /*#__PURE__*/ React.createElement(Label, null, label), /*#__PURE__*/ React.createElement(PasswordInputWrap, null, /*#__PURE__*/ React.createElement(PasswordInputNative, {
+        type: visible ? "text" : "password",
+        autoComplete: "new-password",
+        ...register ? register(name) : {
+            name,
+            ref
+        },
+        ...props
+    }), /*#__PURE__*/ React.createElement(PasswordIcon, {
+        onClick: ()=>setVisible((prev)=>!prev)
+    }, visible ? /*#__PURE__*/ React.createElement(IconInvisible, null) : /*#__PURE__*/ React.createElement(IconVisible, null))));
 });
-var templateObject_1, templateObject_2, templateObject_3;

package/Forms/Password/index.js

@@ -1,4 +1,6 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./Password"), exports);
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./Password"), exports);

package/Forms/Radio/Radio.js

@@ -1,28 +1,49 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Radio = void 0;
-var tslib_1 = require("tslib");
-var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = require("react");
-var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-var Label_1 = require("../Label/Label");
-var Toggle_1 = require("../Toggle");
-var styles_1 = require("../styles");
-var RadioRoot = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject([""], [""])));
-var RadioLabel = styled_components_1.default.div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), Label_1.label);
-var RadioOptionRoot = styled_components_1.default.label(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  padding: 0.05em;\n  cursor: pointer;\n"], ["\n  display: flex;\n  align-items: center;\n  padding: 0.05em;\n  cursor: pointer;\n"])));
-var RadioToggle = (0, styled_components_1.default)(Toggle_1.Toggle)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject([""], [""])));
-var RadioIndicator = (0, styled_components_1.default)(Toggle_1.ToggleIndicatorSquared)(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject([""], [""])));
-var RadioOptionLabel = (0, styled_components_1.default)(Toggle_1.ToggleLabel)(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject([""], [""])));
-var RadioOption = (0, react_1.forwardRef)(function RadioOption(_a, ref) {
-    var register = _a.register, name = _a.name, label = _a.label, $ref = _a.$ref, props = tslib_1.__rest(_a, ["register", "name", "label", "$ref"]);
-    var inputProps = register ? register(name) : { name: name, ref: $ref || ref };
-    return ((0, jsx_runtime_1.jsxs)(RadioOptionRoot, { children: [(0, jsx_runtime_1.jsxs)(RadioToggle, { children: [(0, jsx_runtime_1.jsx)(styles_1.InputInvisible, tslib_1.__assign({ type: "radio" }, inputProps, props)), (0, jsx_runtime_1.jsx)(RadioIndicator, {})] }), (0, jsx_runtime_1.jsx)(RadioOptionLabel, { children: label })] }));
+Object.defineProperty(exports, "__esModule", {
+    value: true
 });
-exports.Radio = (0, react_1.forwardRef)(function Radio(_a, ref) {
-    var label = _a.label, options = _a.options, props = tslib_1.__rest(_a, ["label", "options"]);
-    if (!options)
-        return null;
-    return ((0, jsx_runtime_1.jsxs)(RadioRoot, { children: [label && (0, jsx_runtime_1.jsx)(RadioLabel, { children: label }), options.map(function (option, idx) { return ((0, jsx_runtime_1.jsx)(RadioOption, tslib_1.__assign({}, option, props, { "$ref": ref }), idx)); })] }));
+Object.defineProperty(exports, "Radio", {
+    enumerable: true,
+    get: function() {
+        return Radio;
+    }
+});
+const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
+const _react = require("react");
+const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
+const _Label = require("../Label/Label");
+const _Toggle = require("../Toggle");
+const _styles = require("../styles");
+const RadioRoot = _styledcomponents.default.div``;
+const RadioLabel = _styledcomponents.default.div`
+  ${_Label.label}
+`;
+const RadioOptionRoot = _styledcomponents.default.label`
+  display: flex;
+  align-items: center;
+  padding: 0.05em;
+  cursor: pointer;
+`;
+const RadioToggle = (0, _styledcomponents.default)(_Toggle.Toggle)``;
+const RadioIndicator = (0, _styledcomponents.default)(_Toggle.ToggleIndicatorSquared)``;
+const RadioOptionLabel = (0, _styledcomponents.default)(_Toggle.ToggleLabel)``;
+const RadioOption = /*#__PURE__*/ (0, _react.forwardRef)(function RadioOption({ register, name, label, $ref, ...props }, ref) {
+    const inputProps = register ? register(name) : {
+        name,
+        ref: $ref || ref
+    };
+    return /*#__PURE__*/ React.createElement(RadioOptionRoot, null, /*#__PURE__*/ React.createElement(RadioToggle, null, /*#__PURE__*/ React.createElement(_styles.InputInvisible, {
+        type: "radio",
+        ...inputProps,
+        ...props
+    }), /*#__PURE__*/ React.createElement(RadioIndicator, null)), /*#__PURE__*/ React.createElement(RadioOptionLabel, null, label));
+});
+const Radio = /*#__PURE__*/ (0, _react.forwardRef)(function Radio({ label, options, ...props }, ref) {
+    if (!options) return null;
+    return /*#__PURE__*/ React.createElement(RadioRoot, null, label && /*#__PURE__*/ React.createElement(RadioLabel, null, label), options.map((option, idx)=>/*#__PURE__*/ React.createElement(RadioOption, {
+            key: idx,
+            ...option,
+            ...props,
+            $ref: ref
+        })));
 });
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;