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

package/Forms/Password/Password.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-import type { FormControl } from "../helpers";
-export declare const PasswordInputNative: import("styled-components").StyledComponent<"input", import("styled-components").DefaultTheme, {}, never>;
-export type PasswordProps = FormControl;
-export declare const Password: import("react").ForwardRefExoticComponent<Omit<PasswordProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;

package/Forms/Password/Password.js

@@ -1,20 +0,0 @@
-"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, {}) })] })] }));
-});
-var templateObject_1, templateObject_2, templateObject_3;

package/Forms/Password/Password.mjs

@@ -1,17 +0,0 @@
-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 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, {}) })] })] }));
-});
-var templateObject_1, templateObject_2, templateObject_3;

package/Forms/Password/index.d.ts

@@ -1 +0,0 @@
-export * from "./Password";

package/Forms/Password/index.js

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

package/Forms/Password/index.mjs

@@ -1 +0,0 @@
-export * from "./Password";

package/Forms/Password/package.json

@@ -1,6 +0,0 @@
-{
-  "sideEffects": false,
-  "module": "./index.mjs",
-  "main": "./index.js",
-  "types": "./index.d.ts"
-}

package/Forms/Radio/Radio.d.ts

@@ -1,12 +0,0 @@
-/// <reference types="react" />
-import type { Option } from "../../types";
-import { FormControl } from "../helpers";
-type RadioOptionProps = Omit<FormControl, "value"> & Option & {
-    $ref: React.ForwardedRef<HTMLInputElement>;
-};
-export type RadioProps = Omit<FormControl, "value"> & {
-    value?: string;
-    options?: Pick<RadioOptionProps, "label" | "value">[];
-};
-export declare const Radio: import("react").ForwardRefExoticComponent<Omit<RadioProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
-export {};

package/Forms/Radio/Radio.js

@@ -1,28 +0,0 @@
-"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 })] }));
-});
-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)); })] }));
-});
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/Forms/Radio/Radio.mjs

@@ -1,25 +0,0 @@
-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 { label } from "../Label/Label";
-import { Toggle, ToggleLabel, ToggleIndicatorSquared } from "../Toggle";
-import { InputInvisible } from "../styles";
-var RadioRoot = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([""], [""])));
-var RadioLabel = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), label);
-var RadioOptionRoot = styled.label(templateObject_3 || (templateObject_3 = __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 = styled(Toggle)(templateObject_4 || (templateObject_4 = __makeTemplateObject([""], [""])));
-var RadioIndicator = styled(ToggleIndicatorSquared)(templateObject_5 || (templateObject_5 = __makeTemplateObject([""], [""])));
-var RadioOptionLabel = styled(ToggleLabel)(templateObject_6 || (templateObject_6 = __makeTemplateObject([""], [""])));
-var RadioOption = forwardRef(function RadioOption(_a, ref) {
-    var register = _a.register, name = _a.name, label = _a.label, $ref = _a.$ref, props = __rest(_a, ["register", "name", "label", "$ref"]);
-    var inputProps = register ? register(name) : { name: name, ref: $ref || ref };
-    return (_jsxs(RadioOptionRoot, { children: [_jsxs(RadioToggle, { children: [_jsx(InputInvisible, __assign({ type: "radio" }, inputProps, props)), _jsx(RadioIndicator, {})] }), _jsx(RadioOptionLabel, { children: label })] }));
-});
-export var Radio = forwardRef(function Radio(_a, ref) {
-    var label = _a.label, options = _a.options, props = __rest(_a, ["label", "options"]);
-    if (!options)
-        return null;
-    return (_jsxs(RadioRoot, { children: [label && _jsx(RadioLabel, { children: label }), options.map(function (option, idx) { return (_jsx(RadioOption, __assign({}, option, props, { "$ref": ref }), idx)); })] }));
-});
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/Forms/Radio/index.d.ts

@@ -1 +0,0 @@
-export * from "./Radio";

package/Forms/Radio/index.js

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

package/Forms/Radio/index.mjs

@@ -1 +0,0 @@
-export * from "./Radio";

package/Forms/Radio/package.json

@@ -1,6 +0,0 @@
-{
-  "sideEffects": false,
-  "module": "./index.mjs",
-  "main": "./index.js",
-  "types": "./index.d.ts"
-}

package/Forms/Switch/Switch.d.ts

@@ -1,9 +0,0 @@
-/// <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 type SwitchProps = UseToggleProps;
-/**
- * All logic and invisible Inputs come from the `useToggle` hook
- */
-export declare const Switch: import("react").ForwardRefExoticComponent<Omit<UseToggleProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;

package/Forms/Switch/Switch.js

@@ -1,23 +0,0 @@
-"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 })] })));
-});
-var templateObject_1, templateObject_2;

package/Forms/Switch/Switch.mjs

@@ -1,20 +0,0 @@
-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 { 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);
-/**
- * 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 })] })));
-});
-var templateObject_1, templateObject_2;

package/Forms/Switch/index.d.ts

@@ -1 +0,0 @@
-export * from "./Switch";

package/Forms/Switch/index.js

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

package/Forms/Switch/index.mjs

@@ -1 +0,0 @@
-export * from "./Switch";

package/Forms/Switch/package.json

@@ -1,6 +0,0 @@
-{
-  "sideEffects": false,
-  "module": "./index.mjs",
-  "main": "./index.js",
-  "types": "./index.d.ts"
-}

package/Forms/Textarea/Textarea.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-import { FormControl } from "../helpers";
-export declare const TextareaNative: import("styled-components").StyledComponent<"textarea", import("styled-components").DefaultTheme, {}, never>;
-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 +0,0 @@
-"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))] }));
-});
-var templateObject_1;

package/Forms/Textarea/Textarea.mjs

@@ -1,12 +0,0 @@
-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 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))] }));
-});
-var templateObject_1;

package/Forms/Textarea/TextareaRich.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="react" />
-import { FormControl } from "../helpers";
-export type TextareaRichProps = FormControl<"textarea"> & {
-    defaultValue?: string;
-};
-export declare const TextareaRich: import("react").ForwardRefExoticComponent<Omit<TextareaRichProps, "ref"> & import("react").RefAttributes<HTMLTextAreaElement>>;

package/Forms/Textarea/TextareaRich.js

@@ -1,31 +0,0 @@
-"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: {
-                    // 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))] }));
-});
-var templateObject_1;

package/Forms/Textarea/TextareaRich.mjs

@@ -1,28 +0,0 @@
-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 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: {
-                    // 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))] }));
-});
-var templateObject_1;

package/Forms/Textarea/index.d.ts

@@ -1,2 +0,0 @@
-export * from "./Textarea";
-export * from "./TextareaRich";

package/Forms/Textarea/index.js

@@ -1,5 +0,0 @@
-"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);

package/Forms/Textarea/index.mjs

@@ -1,2 +0,0 @@
-export * from "./Textarea";
-export * from "./TextareaRich";

package/Forms/Textarea/package.json

@@ -1,6 +0,0 @@
-{
-  "sideEffects": false,
-  "module": "./index.mjs",
-  "main": "./index.js",
-  "types": "./index.d.ts"
-}

package/Forms/Toggle/Toggle-tailwind.js

@@ -1,99 +0,0 @@
-"use strict";
-// /**
-//  * @file
-//  *
-//  * About accessibility:
-//  * - minimum target size of 44px https://www.w3.org/TR/WCAG21/#target-size
-//  *
-//  * @see tests on tailwind playground:
-//  * - https://play.tailwindcss.com/RVldIcmZa5
-//  */
-//  import { type FormControlState } from "../FormControl";
-//  import { FormControlStatefulElement } from "../FormControlStatefulElement";
-//  export type ToggleProps = React.ComponentProps<"span">;
-//  export const Toggle = ({ className = "", ...props }: ToggleProps) => {
-//    return (
-//      <span
-//        className={`relative my-0 -mx-1 inline-flex h-8 w-8 items-center justify-center p-1 ${className}`}
-//        {...props}
-//      />
-//    );
-//  };
-//  export type ToggleLabelProps = React.ComponentProps<"span">;
-//  export const ToggleLabel = ({ className = "", ...props }: ToggleLabelProps) => {
-//    return (
-//      <span
-//        className={`text-grey-200 ml-3 select-none ${className}`}
-//        {...props}
-//      />
-//    );
-//  };
-//  export type ToggleLabelSubProps = React.ComponentProps<"small">;
-//  export const ToggleLabelSub = ({
-//    className = "",
-//    ...props
-//  }: ToggleLabelSubProps) => {
-//    return (
-//      <span
-//        className={`text-xs opacity-70 ${className}`}
-//        {...props}
-//      />
-//    );
-//  };
-//  export type ToggleIndicatorProps = FormControlState & {
-//    className?: string;
-//  };
-//  export const ToggleIndicator = ({
-//    className,
-//    ...props
-//  }: ToggleIndicatorProps) => {
-//    return (
-//      <FormControlStatefulElement
-//        as="span"
-//        className={`relative flex h-[24px] w-[24px] rounded-md border border-solid ${className}`}
-//        {...props}
-//      />
-//    );
-//  };
-//  export type ToggleIndicatorFgProps = React.ComponentProps<"svg">;
-//  export const ToggleIndicatorFg = ({
-//    className = "",
-//    ...props
-//  }: ToggleIndicatorFgProps) => {
-//    return (
-//      <svg
-//        className={`on-toggle-checked:scale-100 absolute left-0 h-full w-full scale-0 transition-transform ${className}`}
-//        {...props}
-//      />
-//    );
-//  };
-//  export type ToggleIndicatorSquaredProps = ToggleIndicatorProps;
-//  export const ToggleIndicatorSquared = (props: ToggleIndicatorSquaredProps) => {
-//    return (
-//      <ToggleIndicator {...props}>
-//        <ToggleIndicatorFg viewBox="0 0 24 24">
-//          <path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z" />
-//        </ToggleIndicatorFg>
-//      </ToggleIndicator>
-//    );
-//  };
-//  export type ToggleIndicatorRoundedProps = ToggleIndicatorProps & {
-//    /** @default 6 */
-//    r?: number;
-//  };
-//  export const ToggleIndicatorRounded = ({
-//    r = 6,
-//    ...props
-//  }: ToggleIndicatorRoundedProps) => {
-//    return (
-//      <ToggleIndicator {...props}>
-//        <ToggleIndicatorFg viewBox="0 0 24 24">
-//          <circle
-//            r={r}
-//            cx="12"
-//            cy="12"
-//          />
-//        </ToggleIndicatorFg>
-//      </ToggleIndicator>
-//    );
-//  };

package/Forms/Toggle/Toggle-tailwind.mjs

@@ -1,99 +0,0 @@
-"use strict";
-// /**
-//  * @file
-//  *
-//  * About accessibility:
-//  * - minimum target size of 44px https://www.w3.org/TR/WCAG21/#target-size
-//  *
-//  * @see tests on tailwind playground:
-//  * - https://play.tailwindcss.com/RVldIcmZa5
-//  */
-//  import { type FormControlState } from "../FormControl";
-//  import { FormControlStatefulElement } from "../FormControlStatefulElement";
-//  export type ToggleProps = React.ComponentProps<"span">;
-//  export const Toggle = ({ className = "", ...props }: ToggleProps) => {
-//    return (
-//      <span
-//        className={`relative my-0 -mx-1 inline-flex h-8 w-8 items-center justify-center p-1 ${className}`}
-//        {...props}
-//      />
-//    );
-//  };
-//  export type ToggleLabelProps = React.ComponentProps<"span">;
-//  export const ToggleLabel = ({ className = "", ...props }: ToggleLabelProps) => {
-//    return (
-//      <span
-//        className={`text-grey-200 ml-3 select-none ${className}`}
-//        {...props}
-//      />
-//    );
-//  };
-//  export type ToggleLabelSubProps = React.ComponentProps<"small">;
-//  export const ToggleLabelSub = ({
-//    className = "",
-//    ...props
-//  }: ToggleLabelSubProps) => {
-//    return (
-//      <span
-//        className={`text-xs opacity-70 ${className}`}
-//        {...props}
-//      />
-//    );
-//  };
-//  export type ToggleIndicatorProps = FormControlState & {
-//    className?: string;
-//  };
-//  export const ToggleIndicator = ({
-//    className,
-//    ...props
-//  }: ToggleIndicatorProps) => {
-//    return (
-//      <FormControlStatefulElement
-//        as="span"
-//        className={`relative flex h-[24px] w-[24px] rounded-md border border-solid ${className}`}
-//        {...props}
-//      />
-//    );
-//  };
-//  export type ToggleIndicatorFgProps = React.ComponentProps<"svg">;
-//  export const ToggleIndicatorFg = ({
-//    className = "",
-//    ...props
-//  }: ToggleIndicatorFgProps) => {
-//    return (
-//      <svg
-//        className={`on-toggle-checked:scale-100 absolute left-0 h-full w-full scale-0 transition-transform ${className}`}
-//        {...props}
-//      />
-//    );
-//  };
-//  export type ToggleIndicatorSquaredProps = ToggleIndicatorProps;
-//  export const ToggleIndicatorSquared = (props: ToggleIndicatorSquaredProps) => {
-//    return (
-//      <ToggleIndicator {...props}>
-//        <ToggleIndicatorFg viewBox="0 0 24 24">
-//          <path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z" />
-//        </ToggleIndicatorFg>
-//      </ToggleIndicator>
-//    );
-//  };
-//  export type ToggleIndicatorRoundedProps = ToggleIndicatorProps & {
-//    /** @default 6 */
-//    r?: number;
-//  };
-//  export const ToggleIndicatorRounded = ({
-//    r = 6,
-//    ...props
-//  }: ToggleIndicatorRoundedProps) => {
-//    return (
-//      <ToggleIndicator {...props}>
-//        <ToggleIndicatorFg viewBox="0 0 24 24">
-//          <circle
-//            r={r}
-//            cx="12"
-//            cy="12"
-//          />
-//        </ToggleIndicatorFg>
-//      </ToggleIndicator>
-//    );
-//  };

package/Forms/Toggle/Toggle.d.ts

@@ -1,19 +0,0 @@
-export declare const toggleBase = "\n  border: 1px solid var(--forms-border-color);\n";
-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 type ToggleIndicatorProps = unknown;
-export type ToggleIndicatorSquaredProps = ToggleIndicatorProps;
-export declare const ToggleIndicatorSquared: (props: ToggleIndicatorSquaredProps) => import("react/jsx-runtime").JSX.Element;
-export type ToggleIndicatorRoundedProps = ToggleIndicatorProps & {
-    /** @default 6 */
-    r?: number;
-};
-export declare const ToggleIndicatorRounded: ({ r, }: ToggleIndicatorRoundedProps) => import("react/jsx-runtime").JSX.Element;