@koine/react 2.0.0-beta.1 → 2.0.0-beta.10

package/Forms/Radio/index.js

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

package/Forms/Switch/Switch.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { UseToggleProps } from "../Toggle/useToggle";
-export declare const SwitchTrack: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
-export declare const SwitchHandle: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
+export declare const SwitchTrack: any;
+export declare const SwitchHandle: any;
 export type SwitchProps = UseToggleProps;
 /**
  * All logic and invisible Inputs come from the `useToggle` hook

package/Forms/Switch/Switch.js

@@ -1,23 +1,80 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Switch = exports.SwitchHandle = exports.SwitchTrack = 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 Checkbox_1 = require("../Checkbox");
-var Toggle_1 = require("../Toggle");
-var useToggle_1 = require("../Toggle/useToggle");
-var styled_1 = require("../../styles/styled");
-var SWITCH_GUTTER = 0.25;
-var SWITCH_HANDLE_SIZE = 1;
-exports.SwitchTrack = styled_components_1.default.span(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  position: relative;\n  width: ", "em;\n  height: ", "em;\n  padding: ", "em;\n  border-radius: ", "em;\n  ", "\n\n  input:focus ~ & {\n    ", "\n  }\n\n  input:disabled ~ & {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n"], ["\n  position: relative;\n  width: ", "em;\n  height: ", "em;\n  padding: ", "em;\n  border-radius: ", "em;\n  ", "\n\n  input:focus ~ & {\n    ", "\n  }\n\n  input:disabled ~ & {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n"])), SWITCH_HANDLE_SIZE * 3, SWITCH_HANDLE_SIZE * 1.5, SWITCH_GUTTER, SWITCH_HANDLE_SIZE, Toggle_1.toggleBase, styled_1.stateFocus);
-exports.SwitchHandle = styled_components_1.default.span(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  position: absolute;\n  width: ", "em;\n  height: ", "em;\n  left: ", "em;\n  margin-top: -1px;\n  /* border: 1px solid currentColor; */\n  background: currentColor;\n  opacity: 0.5;\n  border-radius: 100%;\n  transition: all 0.18s ease-in-out;\n\n  input:checked + ", " & {\n    opacity: 1;\n    left: calc(100% - ", "em - ", "em);\n  }\n"], ["\n  position: absolute;\n  width: ", "em;\n  height: ", "em;\n  left: ", "em;\n  margin-top: -1px;\n  /* border: 1px solid currentColor; */\n  background: currentColor;\n  opacity: 0.5;\n  border-radius: 100%;\n  transition: all 0.18s ease-in-out;\n\n  input:checked + ", " & {\n    opacity: 1;\n    left: calc(100% - ", "em - ", "em);\n  }\n"])), SWITCH_HANDLE_SIZE, SWITCH_HANDLE_SIZE, SWITCH_GUTTER, exports.SwitchTrack, SWITCH_HANDLE_SIZE, SWITCH_GUTTER);
-/**
- * All logic and invisible Inputs come from the `useToggle` hook
- */
-exports.Switch = (0, react_1.forwardRef)(function Switch(props, ref) {
-    var _a = (0, useToggle_1.useToggle)(props, ref), rootProps = _a.rootProps, Inputs = _a.Inputs, label = _a.label;
-    return ((0, jsx_runtime_1.jsxs)(Checkbox_1.CheckboxRoot, tslib_1.__assign({}, rootProps, { children: [Inputs, (0, jsx_runtime_1.jsx)(exports.SwitchTrack, { children: (0, jsx_runtime_1.jsx)(exports.SwitchHandle, {}) }), label && (0, jsx_runtime_1.jsx)(Checkbox_1.CheckboxLabel, { children: 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, {
+    SwitchTrack: function() {
+        return SwitchTrack;
+    },
+    SwitchHandle: function() {
+        return SwitchHandle;
+    },
+    Switch: function() {
+        return Switch;
+    }
+});
+const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
+const _jsxruntime = require("react/jsx-runtime");
+const _react = require("react");
+const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
+const _styled = require("../../styles/styled");
+const _Checkbox = require("../Checkbox");
+const _Toggle = require("../Toggle");
+const _useToggle = require("../Toggle/useToggle");
+const SWITCH_GUTTER = 0.25;
+const SWITCH_HANDLE_SIZE = 1;
+const SwitchTrack = _styledcomponents.default.span`
+  position: relative;
+  width: ${SWITCH_HANDLE_SIZE * 3}em;
+  height: ${SWITCH_HANDLE_SIZE * 1.5}em;
+  padding: ${SWITCH_GUTTER}em;
+  border-radius: ${SWITCH_HANDLE_SIZE}em;
+  ${_Toggle.toggleBase}
+
+  input:focus ~ & {
+    ${_styled.stateFocus}
+  }
+
+  input:disabled ~ & {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+`;
+const SwitchHandle = _styledcomponents.default.span`
+  position: absolute;
+  width: ${SWITCH_HANDLE_SIZE}em;
+  height: ${SWITCH_HANDLE_SIZE}em;
+  left: ${SWITCH_GUTTER}em;
+  margin-top: -1px;
+  /* border: 1px solid currentColor; */
+  background: currentColor;
+  opacity: 0.5;
+  border-radius: 100%;
+  transition: all 0.18s ease-in-out;
+
+  input:checked + ${SwitchTrack} & {
+    opacity: 1;
+    left: calc(100% - ${SWITCH_HANDLE_SIZE}em - ${SWITCH_GUTTER}em);
+  }
+`;
+const Switch = /*#__PURE__*/ (0, _react.forwardRef)(function Switch(props, ref) {
+    const { rootProps, Inputs, label } = (0, _useToggle.useToggle)(props, ref);
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_Checkbox.CheckboxRoot, {
+        ...rootProps,
+        children: [
+            Inputs,
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(SwitchTrack, {
+                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(SwitchHandle, {})
+            }),
+            label && /*#__PURE__*/ (0, _jsxruntime.jsx)(_Checkbox.CheckboxLabel, {
+                children: label
+            })
+        ]
+    });
 });
-var templateObject_1, templateObject_2;

package/Forms/Switch/Switch.mjs

@@ -1,20 +1,60 @@
-import { __assign, __makeTemplateObject } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import styled from "styled-components";
-import { CheckboxRoot, CheckboxLabel } from "../Checkbox";
+import { stateFocus } from "../../styles/styled";
+import { CheckboxLabel, CheckboxRoot } from "../Checkbox";
 import { toggleBase } from "../Toggle";
 import { useToggle } from "../Toggle/useToggle";
-import { stateFocus } from "../../styles/styled";
-var SWITCH_GUTTER = 0.25;
-var SWITCH_HANDLE_SIZE = 1;
-export var SwitchTrack = styled.span(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  width: ", "em;\n  height: ", "em;\n  padding: ", "em;\n  border-radius: ", "em;\n  ", "\n\n  input:focus ~ & {\n    ", "\n  }\n\n  input:disabled ~ & {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n"], ["\n  position: relative;\n  width: ", "em;\n  height: ", "em;\n  padding: ", "em;\n  border-radius: ", "em;\n  ", "\n\n  input:focus ~ & {\n    ", "\n  }\n\n  input:disabled ~ & {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n"])), SWITCH_HANDLE_SIZE * 3, SWITCH_HANDLE_SIZE * 1.5, SWITCH_GUTTER, SWITCH_HANDLE_SIZE, toggleBase, stateFocus);
-export var SwitchHandle = styled.span(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: absolute;\n  width: ", "em;\n  height: ", "em;\n  left: ", "em;\n  margin-top: -1px;\n  /* border: 1px solid currentColor; */\n  background: currentColor;\n  opacity: 0.5;\n  border-radius: 100%;\n  transition: all 0.18s ease-in-out;\n\n  input:checked + ", " & {\n    opacity: 1;\n    left: calc(100% - ", "em - ", "em);\n  }\n"], ["\n  position: absolute;\n  width: ", "em;\n  height: ", "em;\n  left: ", "em;\n  margin-top: -1px;\n  /* border: 1px solid currentColor; */\n  background: currentColor;\n  opacity: 0.5;\n  border-radius: 100%;\n  transition: all 0.18s ease-in-out;\n\n  input:checked + ", " & {\n    opacity: 1;\n    left: calc(100% - ", "em - ", "em);\n  }\n"])), SWITCH_HANDLE_SIZE, SWITCH_HANDLE_SIZE, SWITCH_GUTTER, SwitchTrack, SWITCH_HANDLE_SIZE, SWITCH_GUTTER);
+const SWITCH_GUTTER = 0.25;
+const SWITCH_HANDLE_SIZE = 1;
+export const SwitchTrack = styled.span`
+  position: relative;
+  width: ${SWITCH_HANDLE_SIZE * 3}em;
+  height: ${SWITCH_HANDLE_SIZE * 1.5}em;
+  padding: ${SWITCH_GUTTER}em;
+  border-radius: ${SWITCH_HANDLE_SIZE}em;
+  ${toggleBase}
+
+  input:focus ~ & {
+    ${stateFocus}
+  }
+
+  input:disabled ~ & {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+`;
+export const SwitchHandle = styled.span`
+  position: absolute;
+  width: ${SWITCH_HANDLE_SIZE}em;
+  height: ${SWITCH_HANDLE_SIZE}em;
+  left: ${SWITCH_GUTTER}em;
+  margin-top: -1px;
+  /* border: 1px solid currentColor; */
+  background: currentColor;
+  opacity: 0.5;
+  border-radius: 100%;
+  transition: all 0.18s ease-in-out;
+
+  input:checked + ${SwitchTrack} & {
+    opacity: 1;
+    left: calc(100% - ${SWITCH_HANDLE_SIZE}em - ${SWITCH_GUTTER}em);
+  }
+`;
 /**
  * All logic and invisible Inputs come from the `useToggle` hook
- */
-export var Switch = forwardRef(function Switch(props, ref) {
-    var _a = useToggle(props, ref), rootProps = _a.rootProps, Inputs = _a.Inputs, label = _a.label;
-    return (_jsxs(CheckboxRoot, __assign({}, rootProps, { children: [Inputs, _jsx(SwitchTrack, { children: _jsx(SwitchHandle, {}) }), label && _jsx(CheckboxLabel, { children: label })] })));
+ */ export const Switch = /*#__PURE__*/ forwardRef(function Switch(props, ref) {
+    const { rootProps, Inputs, label } = useToggle(props, ref);
+    return /*#__PURE__*/ _jsxs(CheckboxRoot, {
+        ...rootProps,
+        children: [
+            Inputs,
+            /*#__PURE__*/ _jsx(SwitchTrack, {
+                children: /*#__PURE__*/ _jsx(SwitchHandle, {})
+            }),
+            label && /*#__PURE__*/ _jsx(CheckboxLabel, {
+                children: label
+            })
+        ]
+    });
 });
-var templateObject_1, templateObject_2;

package/Forms/Switch/index.js

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

package/Forms/Textarea/Textarea.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { FormControl } from "../helpers";
-export declare const TextareaNative: import("styled-components").StyledComponent<"textarea", import("styled-components").DefaultTheme, {}, never>;
+export declare const TextareaNative: any;
 export type TextareaProps = FormControl<"textarea">;
 export declare const Textarea: import("react").ForwardRefExoticComponent<Omit<TextareaProps, "ref"> & import("react").RefAttributes<HTMLTextAreaElement>>;

package/Forms/Textarea/Textarea.js

@@ -1,15 +1,45 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Textarea = exports.TextareaNative = 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.TextareaNative = styled_components_1.default.textarea(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  ", "\n  ", "\n  resize: vertical;\n"], ["\n  ", "\n  ", "\n  resize: vertical;\n"])), styles_1.inputBase, styles_1.inputFocus);
-exports.Textarea = (0, react_1.forwardRef)(function Textarea(_a, ref) {
-    var register = _a.register, name = _a.name, label = _a.label, props = tslib_1.__rest(_a, ["register", "name", "label"]);
-    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.TextareaNative, tslib_1.__assign({}, (register ? register(name) : { name: name, ref: ref }), props))] }));
+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, {
+    TextareaNative: function() {
+        return TextareaNative;
+    },
+    Textarea: function() {
+        return Textarea;
+    }
+});
+const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
+const _jsxruntime = require("react/jsx-runtime");
+const _react = require("react");
+const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
+const _Label = require("../Label/Label");
+const _styles = require("../styles");
+const TextareaNative = _styledcomponents.default.textarea`
+  ${_styles.inputBase}
+  ${_styles.inputFocus}
+  resize: vertical;
+`;
+const Textarea = /*#__PURE__*/ (0, _react.forwardRef)(function Textarea({ register, name, label, ...props }, ref) {
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
+        children: [
+            label && /*#__PURE__*/ (0, _jsxruntime.jsx)(_Label.Label, {
+                children: label
+            }),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(TextareaNative, {
+                ...register ? register(name) : {
+                    name,
+                    ref
+                },
+                ...props
+            })
+        ]
+    });
 });
-var templateObject_1;

package/Forms/Textarea/Textarea.mjs

@@ -1,12 +1,26 @@
-import { __assign, __makeTemplateObject, __rest } from "tslib";
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } 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 TextareaNative = styled.textarea(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", "\n  ", "\n  resize: vertical;\n"], ["\n  ", "\n  ", "\n  resize: vertical;\n"])), inputBase, inputFocus);
-export var Textarea = forwardRef(function Textarea(_a, ref) {
-    var register = _a.register, name = _a.name, label = _a.label, props = __rest(_a, ["register", "name", "label"]);
-    return (_jsxs(_Fragment, { children: [label && _jsx(Label, { children: label }), _jsx(TextareaNative, __assign({}, (register ? register(name) : { name: name, ref: ref }), props))] }));
+export const TextareaNative = styled.textarea`
+  ${inputBase}
+  ${inputFocus}
+  resize: vertical;
+`;
+export const Textarea = /*#__PURE__*/ forwardRef(function Textarea({ register, name, label, ...props }, ref) {
+    return /*#__PURE__*/ _jsxs(_Fragment, {
+        children: [
+            label && /*#__PURE__*/ _jsx(Label, {
+                children: label
+            }),
+            /*#__PURE__*/ _jsx(TextareaNative, {
+                ...register ? register(name) : {
+                    name,
+                    ref
+                },
+                ...props
+            })
+        ]
+    });
 });
-var templateObject_1;

package/Forms/Textarea/TextareaRich.js

@@ -1,31 +1,58 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextareaRich = 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"));
-// import TextareaAutosize from "@mui/base/TextareaAutosize";
-var Label_1 = require("../Label/Label");
-var Editor_1 = require("../../Editor");
-var helpers_1 = require("../helpers");
-var Root = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  .ProseMirror {\n    max-height: 160px;\n    overflow: auto;\n  }\n  .EditorContent {\n    position: relative;\n    &:after {\n      position: absolute;\n      content: \"\";\n      bottom: 0;\n      left: 0;\n      right: 16px; /* scrollbar width? */\n      height: 3em;\n      background: linear-gradient(0deg, white, white 33%, transparent);\n      pointer-events: none;\n    }\n  }\n"], ["\n  .ProseMirror {\n    max-height: 160px;\n    overflow: auto;\n  }\n  .EditorContent {\n    position: relative;\n    &:after {\n      position: absolute;\n      content: \"\";\n      bottom: 0;\n      left: 0;\n      right: 16px; /* scrollbar width? */\n      height: 3em;\n      background: linear-gradient(0deg, white, white 33%, transparent);\n      pointer-events: none;\n    }\n  }\n"])));
-exports.TextareaRich = (0, react_1.forwardRef)(function TextareaRich(_a, ref) {
-    var register = _a.register, setValue = _a.setValue, name = _a.name, label = _a.label, _b = _a.defaultValue, defaultValue = _b === void 0 ? "" : _b, onChange = _a.onChange, props = tslib_1.__rest(_a, ["register", "setValue", "name", "label", "defaultValue", "onChange"]);
-    if (register)
-        register(name);
-    return ((0, jsx_runtime_1.jsxs)(Root, { children: [label && (0, jsx_runtime_1.jsx)(Label_1.Label, { children: label }), (0, jsx_runtime_1.jsx)(Editor_1.Editor, tslib_1.__assign({ options: {
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "TextareaRich", {
+    enumerable: true,
+    get: function() {
+        return TextareaRich;
+    }
+});
+const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
+const _jsxruntime = require("react/jsx-runtime");
+const _react = require("react");
+const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
+const _Editor = require("../../Editor");
+const _Label = require("../Label/Label");
+const _helpers = require("../helpers");
+const Root = _styledcomponents.default.div`
+  .ProseMirror {
+    max-height: 160px;
+    overflow: auto;
+  }
+  .EditorContent {
+    position: relative;
+    &:after {
+      position: absolute;
+      content: "";
+      bottom: 0;
+      left: 0;
+      right: 16px; /* scrollbar width? */
+      height: 3em;
+      background: linear-gradient(0deg, white, white 33%, transparent);
+      pointer-events: none;
+    }
+  }
+`;
+const TextareaRich = /*#__PURE__*/ (0, _react.forwardRef)(function TextareaRich({ register, setValue, name, label, defaultValue = "", onChange, ...props }, ref) {
+    if (register) register(name);
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(Root, {
+        children: [
+            label && /*#__PURE__*/ (0, _jsxruntime.jsx)(_Label.Label, {
+                children: label
+            }),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_Editor.Editor, {
+                options: {
                     // element: <TextareaAutosize />,
                     content: defaultValue,
-                    onUpdate: (onChange || setValue) && name
-                        ? function (_a) {
-                            var editor = _a.editor;
-                            var value = editor.getHTML();
-                            if (setValue)
-                                setValue(name, value);
-                            (0, helpers_1.triggerOnChange)(onChange, name, value);
-                        }
-                        : undefined,
-                } }, props))] }));
+                    onUpdate: (onChange || setValue) && name ? ({ editor })=>{
+                        const value = editor.getHTML();
+                        if (setValue) setValue(name, value);
+                        (0, _helpers.triggerOnChange)(onChange, name, value);
+                    } : undefined
+                },
+                ...props
+            })
+        ]
+    });
 });
-var templateObject_1;

package/Forms/Textarea/TextareaRich.mjs

@@ -1,28 +1,48 @@
-import { __assign, __makeTemplateObject, __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import styled from "styled-components";
+import { Editor } from "../../Editor";
 // import TextareaAutosize from "@mui/base/TextareaAutosize";
 import { Label } from "../Label/Label";
-import { Editor } from "../../Editor";
 import { triggerOnChange } from "../helpers";
-var Root = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  .ProseMirror {\n    max-height: 160px;\n    overflow: auto;\n  }\n  .EditorContent {\n    position: relative;\n    &:after {\n      position: absolute;\n      content: \"\";\n      bottom: 0;\n      left: 0;\n      right: 16px; /* scrollbar width? */\n      height: 3em;\n      background: linear-gradient(0deg, white, white 33%, transparent);\n      pointer-events: none;\n    }\n  }\n"], ["\n  .ProseMirror {\n    max-height: 160px;\n    overflow: auto;\n  }\n  .EditorContent {\n    position: relative;\n    &:after {\n      position: absolute;\n      content: \"\";\n      bottom: 0;\n      left: 0;\n      right: 16px; /* scrollbar width? */\n      height: 3em;\n      background: linear-gradient(0deg, white, white 33%, transparent);\n      pointer-events: none;\n    }\n  }\n"])));
-export var TextareaRich = forwardRef(function TextareaRich(_a, ref) {
-    var register = _a.register, setValue = _a.setValue, name = _a.name, label = _a.label, _b = _a.defaultValue, defaultValue = _b === void 0 ? "" : _b, onChange = _a.onChange, props = __rest(_a, ["register", "setValue", "name", "label", "defaultValue", "onChange"]);
-    if (register)
-        register(name);
-    return (_jsxs(Root, { children: [label && _jsx(Label, { children: label }), _jsx(Editor, __assign({ options: {
+const Root = styled.div`
+  .ProseMirror {
+    max-height: 160px;
+    overflow: auto;
+  }
+  .EditorContent {
+    position: relative;
+    &:after {
+      position: absolute;
+      content: "";
+      bottom: 0;
+      left: 0;
+      right: 16px; /* scrollbar width? */
+      height: 3em;
+      background: linear-gradient(0deg, white, white 33%, transparent);
+      pointer-events: none;
+    }
+  }
+`;
+export const TextareaRich = /*#__PURE__*/ forwardRef(function TextareaRich({ register, setValue, name, label, defaultValue = "", onChange, ...props }, ref) {
+    if (register) register(name);
+    return /*#__PURE__*/ _jsxs(Root, {
+        children: [
+            label && /*#__PURE__*/ _jsx(Label, {
+                children: label
+            }),
+            /*#__PURE__*/ _jsx(Editor, {
+                options: {
                     // element: <TextareaAutosize />,
                     content: defaultValue,
-                    onUpdate: (onChange || setValue) && name
-                        ? function (_a) {
-                            var editor = _a.editor;
-                            var value = editor.getHTML();
-                            if (setValue)
-                                setValue(name, value);
-                            triggerOnChange(onChange, name, value);
-                        }
-                        : undefined,
-                } }, props))] }));
+                    onUpdate: (onChange || setValue) && name ? ({ editor })=>{
+                        const value = editor.getHTML();
+                        if (setValue) setValue(name, value);
+                        triggerOnChange(onChange, name, value);
+                    } : undefined
+                },
+                ...props
+            })
+        ]
+    });
 });
-var templateObject_1;

package/Forms/Textarea/index.js

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

package/Forms/Toggle/Toggle-tailwind.js

@@ -1,4 +1,3 @@
-"use strict";
 // /**
 //  * @file
 //  *
@@ -97,3 +96,4 @@
 //      </ToggleIndicator>
 //    );
 //  };
+"use strict";

package/Forms/Toggle/Toggle-tailwind.mjs

@@ -1,4 +1,3 @@
-"use strict";
 // /**
 //  * @file
 //  *

package/Forms/Toggle/Toggle.d.ts

@@ -2,13 +2,13 @@ export declare const toggleBase = "\n  border: 1px solid var(--forms-border-colo
 export declare const toggleIndicatorBg = "\n  display: inline-block;\n  flex-shrink: 0;\n  width: 100%;\n  height: 100%;\n";
 export declare const toggleIndicatorBgShape: string;
 export declare const toggleIndicatorFg = "\n  position: absolute;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  fill: currentcolor;\n";
-export declare const Toggle: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
-export declare const ToggleLabel: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
-export declare const ToggleLabelSub: import("styled-components").StyledComponent<"small", import("styled-components").DefaultTheme, {}, never>;
-export declare const ToggleIndicatorHolder: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
-export declare const ToggleIndicatorBgSquare: import("styled-components").StyledComponent<"svg", import("styled-components").DefaultTheme, {}, never>;
-export declare const ToggleIndicatorBgCircle: import("styled-components").StyledComponent<"svg", import("styled-components").DefaultTheme, {}, never>;
-export declare const ToggleIndicatorFg: import("styled-components").StyledComponent<"svg", import("styled-components").DefaultTheme, {}, never>;
+export declare const Toggle: any;
+export declare const ToggleLabel: any;
+export declare const ToggleLabelSub: any;
+export declare const ToggleIndicatorHolder: any;
+export declare const ToggleIndicatorBgSquare: any;
+export declare const ToggleIndicatorBgCircle: any;
+export declare const ToggleIndicatorFg: any;
 export type ToggleIndicatorProps = unknown;
 export type ToggleIndicatorSquaredProps = ToggleIndicatorProps;
 export declare const ToggleIndicatorSquared: (props: ToggleIndicatorSquaredProps) => import("react/jsx-runtime").JSX.Element;