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

package/Dialog/sc/material.mjs

@@ -1,21 +0,0 @@
-import { __makeTemplateObject } from "tslib";
-import styled from "styled-components";
-import { extendComponent } from "../../helpers";
-import { KoineDialog as _ } from "./bare";
-export var Root = styled(_.Root)(templateObject_1 || (templateObject_1 = __makeTemplateObject([""], [""])));
-export var Backdrop = styled(_.Backdrop)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background: rgba(0, 0, 0, 0.5);\n  filter: backdrop-blur(4px);\n"], ["\n  background: rgba(0, 0, 0, 0.5);\n  filter: backdrop-blur(4px);\n"])));
-export var Container = styled(_.Container)(templateObject_3 || (templateObject_3 = __makeTemplateObject([""], [""])));
-export var Paper = styled(_.Paper)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  max-width: 640px;\n  margin: 64px;\n  border-radius: 4px;\n  background: white;\n  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);\n"], ["\n  max-width: 640px;\n  margin: 64px;\n  border-radius: 4px;\n  background: white;\n  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);\n"])));
-export var Close = styled(_.Close)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  right: 0;\n  padding: 8px;\n  font-size: 2rem;\n  opacity: 0.5;\n"], ["\n  position: absolute;\n  top: 0;\n  right: 0;\n  padding: 8px;\n  font-size: 2rem;\n  opacity: 0.5;\n"])));
-export var Header = styled(_.Header)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  padding: 16px;\n  font-size: 1.25rem;\n"], ["\n  padding: 16px;\n  font-size: 1.25rem;\n"])));
-export var Body = styled(_.Body)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  padding: 16px;\n  border-top: 1px solid rgba(0, 0, 0, 0.08);\n"], ["\n  padding: 16px;\n  border-top: 1px solid rgba(0, 0, 0, 0.08);\n"])));
-export var KoineDialog = extendComponent(_, {
-    Root: Root,
-    Backdrop: Backdrop,
-    Container: Container,
-    Paper: Paper,
-    Close: Close,
-    Header: Header,
-    Body: Body,
-});
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;

package/Dialog/tw/bare.mjs

@@ -1,42 +0,0 @@
-import { __makeTemplateObject } from "tslib";
-import { classed, extendComponent } from "../../helpers";
-import * as _ from "../DialogMui";
-export var Root = classed(_.Root)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["< class=\"dialog fixed z-[1300] inset-0"], ["< class=\"dialog fixed z-[1300] inset-0"])));
-export var Backdrop = classed(_.Backdrop)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["< class=\"dialogBackdrop fixed -z-[1] inset-0 [-webkit-tap-highlight-color:transparent]"], ["< class=\"dialogBackdrop fixed -z-[1] inset-0 [-webkit-tap-highlight-color:transparent]"])));
-/**
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Dialog/Dialog.js#L64-L85
- */
-export var Container = classed(_.Container)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["< class=\"dialogContainer h-full outline-0 ", ""], ["< class=\"dialogContainer h-full outline-0 ", ""])), function (p) {
-    return p.$scrollPaper
-        ? "flex justify-center items-center"
-        : "overflow-y-auto overflow-x-hidden text-center [after:content:''] after:inline-block after:align-middle after:h-full after:w-0";
-});
-/**
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Dialog/Dialog.js#L104-L157
- */
-export var Paper = classed(_.Paper)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["< class=\"dialogPaper relative ", ""], ["< class=\"dialogPaper relative ", ""])), function (p) {
-    return p.$scrollPaper
-        ? "flex flex-col max-h-[calc(100%-64px)]"
-        : "inline-block align-middle [text-align:initial]";
-});
-export var Close = classed(_.Close)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["< class=\"dialogClose"], ["< class=\"dialogClose"])));
-export var Header = classed(_.Header)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["< class=\"dialogHeader"], ["< class=\"dialogHeader"])));
-/**
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/DialogContent/DialogContent.js#L29-L44
- * The arbitrary rule webkit-overflow-scrolling is to add iOS momentum scrolling for iOS < 13.0,
- * this was removed from tailiwnd 2.0 on
- *
- * @see https://github.com/tailwindlabs/tailwindcss.com/issues/483
- * @see https://v2.tailwindcss.com/docs/upgrading-to-v2#the-scrolling-touch-and-scrolling-auto-utilities-have-been-removed
- */
-export var Body = classed(_.Body)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["< class=\"dialogBody flex-1 basis-auto overflow-y-auto [-webkit-overflow-scrolling:touch]"], ["< class=\"dialogBody flex-1 basis-auto overflow-y-auto [-webkit-overflow-scrolling:touch]"])));
-export var KoineDialog = extendComponent(_.KoineDialog, {
-    Root: Root,
-    Backdrop: Backdrop,
-    Container: Container,
-    Paper: Paper,
-    Close: Close,
-    Header: Header,
-    Body: Body,
-});
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;

package/Dialog/tw/elegant.mjs

@@ -1,20 +0,0 @@
-import { __makeTemplateObject } from "tslib";
-import { classed, extendComponent } from "../../helpers";
-import { KoineDialog as _ } from "./bare";
-export var Root = classed(_.Root)(templateObject_1 || (templateObject_1 = __makeTemplateObject([""], [""])));
-export var Backdrop = classed(_.Backdrop)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["< class=\"bg-white/[.5] backdrop-blur-sm"], ["< class=\"bg-white/[.5] backdrop-blur-sm"])));
-export var Container = classed(_.Container)(templateObject_3 || (templateObject_3 = __makeTemplateObject([""], [""])));
-export var Paper = classed(_.Paper)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["< class=\"bg-white shadow-xl m-8 max-w-screen-sm border border-gray-400"], ["< class=\"bg-white shadow-xl m-8 max-w-screen-sm border border-gray-400"])));
-export var Close = classed(_.Close)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["< class=\"absolute top-0 right-0 p-8 text-2xl opacity-20 hover:opacity-100 focus:opacity-100"], ["< class=\"absolute top-0 right-0 p-8 text-2xl opacity-20 hover:opacity-100 focus:opacity-100"])));
-export var Header = classed(_.Header)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["< class=\"p-8 text-2xl bold italic"], ["< class=\"p-8 text-2xl bold italic"])));
-export var Body = classed(_.Body)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["< class=\"p-8 pt-4"], ["< class=\"p-8 pt-4"])));
-export var KoineDialog = extendComponent(_, {
-    Root: Root,
-    Backdrop: Backdrop,
-    Container: Container,
-    Paper: Paper,
-    Close: Close,
-    Header: Header,
-    Body: Body,
-});
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;

package/Dialog/tw/framer.mjs

@@ -1,16 +0,0 @@
-import { m } from "framer-motion";
-import { extendComponent } from "../../helpers";
-import { dialogBackdropMotion, dialogPaperMotion } from "../m/basic";
-import { KoineDialog as _ } from "../m/bare";
-import { Root, Backdrop, Container, Paper, Close, Header, Body } from "./bare";
-export var KoineDialog = extendComponent(_, {
-    Root: Root,
-    Backdrop: m(Backdrop),
-    Container: Container,
-    Paper: m(Paper),
-    Close: Close,
-    Header: Header,
-    Body: Body,
-    mBackdrop: dialogBackdropMotion,
-    mPaper: dialogPaperMotion,
-});

package/Dialog/tw/framerMaterial.mjs

@@ -1,16 +0,0 @@
-import { m } from "framer-motion";
-import { extendComponent } from "../../helpers";
-import { dialogBackdropMotion, dialogPaperMotion } from "../m/basic";
-import { KoineDialog as _ } from "../m/bare";
-import { Root, Backdrop, Container, Paper, Close, Header, Body, } from "./material";
-export var KoineDialog = extendComponent(_, {
-    Root: Root,
-    Backdrop: m(Backdrop),
-    Container: Container,
-    Paper: m(Paper),
-    Close: Close,
-    Header: Header,
-    Body: Body,
-    mBackdrop: dialogBackdropMotion,
-    mPaper: dialogPaperMotion,
-});

package/Dialog/tw/material.mjs

@@ -1,20 +0,0 @@
-import { __makeTemplateObject } from "tslib";
-import { classed, extendComponent } from "../../helpers";
-import { KoineDialog as _ } from "./bare";
-export var Root = classed(_.Root)(templateObject_1 || (templateObject_1 = __makeTemplateObject([""], [""])));
-export var Backdrop = classed(_.Backdrop)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["< class=\"bg-black/[.5] backdrop-blur-sm"], ["< class=\"bg-black/[.5] backdrop-blur-sm"])));
-export var Container = classed(_.Container)(templateObject_3 || (templateObject_3 = __makeTemplateObject([""], [""])));
-export var Paper = classed(_.Paper)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["< class=\"rounded bg-white shadow-xl m-8 max-w-screen-sm"], ["< class=\"rounded bg-white shadow-xl m-8 max-w-screen-sm"])));
-export var Close = classed(_.Close)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["< class=\"absolute top-0 right-0 p-4 text-2xl opacity-50"], ["< class=\"absolute top-0 right-0 p-4 text-2xl opacity-50"])));
-export var Header = classed(_.Header)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["< class=\"p-4 text-xl"], ["< class=\"p-4 text-xl"])));
-export var Body = classed(_.Body)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["< class=\"p-4 border-t border-gray-200"], ["< class=\"p-4 border-t border-gray-200"])));
-export var KoineDialog = extendComponent(_, {
-    Root: Root,
-    Backdrop: Backdrop,
-    Container: Container,
-    Paper: Paper,
-    Close: Close,
-    Header: Header,
-    Body: Body,
-});
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;

package/Editor/Editor--tiptap.mjs

@@ -1,26 +0,0 @@
-import { __assign, __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback } from "react";
-import { useEditor, EditorContent } from "@tiptap/react";
-import StarterKit from "@tiptap/starter-kit";
-import { EditorGlobalStyles, EditorRoot, EditorBarRoot, EditorBarBtn, EditorIconBold, EditorIconItalic, } from "./components";
-export var EditorBar = function (_a) {
-    var editor = _a.editor;
-    var handleClick = useCallback(function (e, type) {
-        e.preventDefault();
-        editor === null || editor === void 0 ? void 0 : editor.chain().focus()["toggle".concat(type)]().run();
-    }, [editor]);
-    if (!editor) {
-        return null;
-    }
-    return (_jsxs(EditorBarRoot, { children: [_jsx(EditorBarBtn, { onClick: function (e) {
-                    return handleClick(e, "Bold");
-                }, className: editor.isActive("bold") ? "is-active" : "", children: _jsx(EditorIconBold, {}) }), _jsx(EditorBarBtn, { onClick: function (e) {
-                    return handleClick(e, "Italic");
-                }, className: editor.isActive("bold") ? "is-active" : "", children: _jsx(EditorIconItalic, {}) })] }));
-};
-export var Editor = function (_a) {
-    var options = _a.options, props = __rest(_a, ["options"]);
-    var editor = useEditor(__assign({ extensions: [StarterKit], content: "" }, (options || {})));
-    return (_jsxs(EditorRoot, { children: [_jsx(EditorGlobalStyles, {}), _jsx(EditorBar, { editor: editor }), _jsx(EditorContent, __assign({ className: "EditorContent", editor: editor }, props))] }));
-};

package/Editor/components.mjs

@@ -1,10 +0,0 @@
-import { __makeTemplateObject } from "tslib";
-import styled, { createGlobalStyle } from "styled-components";
-import { IconButton } from "../Buttons/IconButton";
-import { inputPadding, inputBorder, inputFocus } from "../Forms/styles";
-export { MdFormatBold as EditorIconBold, MdFormatItalic as EditorIconItalic, } from "react-icons/md";
-export var EditorRoot = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", "\n  ", "\n"], ["\n  ", "\n  ", "\n"])), inputBorder, inputFocus);
-export var EditorBarRoot = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  justify-content: flex-end;\n  border-bottom: 1px solid rgba(0, 0, 0, 0.1);\n  /* background: var(--grey900); */\n"], ["\n  display: flex;\n  justify-content: flex-end;\n  border-bottom: 1px solid rgba(0, 0, 0, 0.1);\n  /* background: var(--grey900); */\n"])));
-export var EditorBarBtn = styled(IconButton)(templateObject_3 || (templateObject_3 = __makeTemplateObject([""], [""])));
-export var EditorGlobalStyles = createGlobalStyle(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  .ProseMirror {\n    ", "\n    \n    &:focus {\n      outline:none;\n    }\n\n    > *:first-child {\n      margin-top: 0;\n    }\n  }\n"], ["\n  .ProseMirror {\n    ", "\n    \n    &:focus {\n      outline:none;\n    }\n\n    > *:first-child {\n      margin-top: 0;\n    }\n  }\n"])), inputPadding);
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/Editor/index.mjs

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

package/Editor/package.json

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

package/FaviconTags/FaviconTags.js

@@ -1,20 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FaviconTags = void 0;
-var jsx_runtime_1 = require("react/jsx-runtime");
-/**
- * Favicon tags.
- *
- * This component is meant to be wrapped in a `<head>` manager component.
- *
- * These tags have been produced by [realfavicongenerator.net](https://realfavicongenerator.net/)
- * on _**16 Feb 2022**_.
- *
- * @see https://realfavicongenerator.net/
- */
-var FaviconTags = function (_a) {
-    var name = _a.name, color = _a.color, safariTabColor = _a.safariTabColor, tileColor = _a.tileColor, themeColor = _a.themeColor;
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("link", { rel: "shortcut icon", href: "/favicon.ico", type: "image/x-icon" }), (0, jsx_runtime_1.jsx)("link", { rel: "apple-touch-icon", sizes: "180x180", href: "/apple-touch-icon.png" }), (0, jsx_runtime_1.jsx)("link", { rel: "icon", type: "image/png", sizes: "32x32", href: "/favicon-32x32.png" }), (0, jsx_runtime_1.jsx)("link", { rel: "icon", type: "image/png", sizes: "16x16", href: "/favicon-16x16.png" }), (0, jsx_runtime_1.jsx)("link", { rel: "manifest", href: "/site.webmanifest" }), (0, jsx_runtime_1.jsx)("link", { rel: "mask-icon", href: "/safari-pinned-tab.svg", color: safariTabColor || color }), (0, jsx_runtime_1.jsx)("meta", { name: "apple-mobile-web-app-title", content: name }), (0, jsx_runtime_1.jsx)("meta", { name: "application-name", content: name }), (0, jsx_runtime_1.jsx)("meta", { name: "msapplication-TileColor", content: tileColor || color }), (0, jsx_runtime_1.jsx)("meta", { name: "theme-color", content: themeColor || color })] }));
-};
-exports.FaviconTags = FaviconTags;
-exports.default = exports.FaviconTags;

package/FaviconTags/index.d.ts

@@ -1,2 +0,0 @@
-export { FaviconTags, FaviconTagsProps } from "./FaviconTags";
-export { FaviconTags as default } from "./FaviconTags";

package/FaviconTags/index.js

@@ -1,7 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = exports.FaviconTags = void 0;
-var FaviconTags_1 = require("./FaviconTags");
-Object.defineProperty(exports, "FaviconTags", { enumerable: true, get: function () { return FaviconTags_1.FaviconTags; } });
-var FaviconTags_2 = require("./FaviconTags");
-Object.defineProperty(exports, "default", { enumerable: true, get: function () { return FaviconTags_2.FaviconTags; } });

package/FaviconTags/index.mjs

@@ -1,2 +0,0 @@
-export { FaviconTags } from "./FaviconTags";
-export { FaviconTags as default } from "./FaviconTags";

package/FaviconTags/package.json

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

package/Form/Form.mjs

@@ -1,61 +0,0 @@
-import { __assign, __rest } from "tslib";
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useState } from "react";
-// import type { MotionProps } from "framer-motion";
-import { extendComponent, } from "../helpers";
-export var Root = "form";
-export var Overlay = "div";
-export var Progress = "div";
-export var Collapsable = "div";
-export var Ok = null;
-export var Fail = null;
-export var Form = function (_a) {
-    var _Root = _a.Root, _Overlay = _a.Overlay, _Progress = _a.Progress, _Collapsable = _a.Collapsable, ok = _a.ok, fail = _a.fail, loading = _a.loading, _Ok = _a.Ok, _b = _a.okProps, okProps = _b === void 0 ? {
-        children: "Sent!",
-    } : _b, _Fail = _a.Fail, _c = _a.failProps, failProps = _c === void 0 ? {
-        children: "Failed.",
-    } : _c, collapseOnOk = _a.collapseOnOk, collapseOnFail = _a.collapseOnFail, _d = _a.okTimeout, okTimeout = _d === void 0 ? 3000 : _d, _e = _a.failTimeout, failTimeout = _e === void 0 ? 3000 : _e, children = _a.children, props = __rest(_a, ["Root", "Overlay", "Progress", "Collapsable", "ok", "fail", "loading", "Ok", "okProps", "Fail", "failProps", "collapseOnOk", "collapseOnFail", "okTimeout", "failTimeout", "children"]);
-    var _f = useState(""), open = _f[0], setOpen = _f[1];
-    var commonProps = {
-        head: null,
-        components: {
-            HeadIcon: null,
-        },
-    };
-    useEffect(function () {
-        if (!loading) {
-            if (ok)
-                setOpen("ok");
-            else if (fail)
-                setOpen("fail");
-        }
-    }, [ok, fail, loading]);
-    useEffect(function () {
-        var timeout;
-        if (open === "fail" && failTimeout) {
-            timeout = setTimeout(function () { return setOpen(""); }, failTimeout);
-        }
-        else if (open === "ok" && okTimeout) {
-            timeout = setTimeout(function () { return setOpen(""); }, okTimeout);
-        }
-        return function () {
-            if (timeout) {
-                clearTimeout(timeout);
-            }
-        };
-    }, [open, failTimeout, okTimeout]);
-    var formExpanded = true;
-    if (collapseOnFail && fail)
-        formExpanded = false;
-    if (collapseOnOk && ok)
-        formExpanded = false;
-    return (_jsxs(Root, __assign({ method: "post", noValidate: true }, props, { children: [_jsx(Collapsable, __assign({}, commonProps, { "$open": formExpanded, recalc: loading, body: _jsxs(_Fragment, { children: [children, loading && (_jsx(Overlay, { children: _jsx(Progress, {}) }))] }) })), _jsx(Collapsable, __assign({}, commonProps, { "$open": open === "ok" && !loading, body: _jsx(Ok, __assign({}, okProps)) })), _jsx(Collapsable, __assign({}, commonProps, { "$open": open === "fail" && !loading, body: _jsx(Fail, __assign({}, failProps)) }))] })));
-};
-export var KoineForm = extendComponent(Form, {
-    Root: Root,
-    Overlay: Overlay,
-    Progress: Progress,
-    Collapsable: Collapsable,
-    Ok: Ok,
-    Fail: Fail,
-});

package/Form/index.mjs

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

package/Form/package.json

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

package/Form/sc/bare.mjs

@@ -1,20 +0,0 @@
-import { __makeTemplateObject } from "tslib";
-import styled from "styled-components";
-import { overlay, centered } from "../../styles/styled";
-import { Collapsable } from "../../Collapsable";
-import { ProgressCircular } from "../../Progress";
-import { Alert } from "../../Alert";
-import { extendComponent } from "../../helpers";
-import * as _ from "../Form";
-export var Root = styled(_.Root)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n"], ["\n  position: relative;\n"])));
-export var Overlay = styled(_.Overlay)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  z-index: 4;\n  ", "\n  ", "\n  background: rgba(var(--bodyBg--rgb),.8);\n  pointer-events: none;\n  backdrop-filter: blur(2px);\n"], ["\n  z-index: 4;\n  ", "\n  ", "\n  background: rgba(var(--bodyBg--rgb),.8);\n  pointer-events: none;\n  backdrop-filter: blur(2px);\n"])), overlay, centered);
-export var Feedback = styled(Alert)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  padding: 2em 0;\n"], ["\n  padding: 2em 0;\n"])));
-export var KoineForm = extendComponent(_.KoineForm, {
-    Root: Root,
-    Overlay: Overlay,
-    Progress: ProgressCircular,
-    Collapsable: Collapsable,
-    Ok: Feedback,
-    Fail: Feedback,
-});
-var templateObject_1, templateObject_2, templateObject_3;

package/Forms/Checkbox/Checkbox.mjs

@@ -1,18 +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 { Toggle, ToggleLabel, ToggleIndicatorSquared } from "../Toggle";
-import { useToggle } from "../Toggle/useToggle";
-export var CheckboxRoot = styled.label(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n"], ["\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n"])));
-export var CheckboxToggle = styled(Toggle)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  pointer-events: none;\n"], ["\n  pointer-events: none;\n"])));
-export var CheckboxIndicator = styled(ToggleIndicatorSquared)(templateObject_3 || (templateObject_3 = __makeTemplateObject([""], [""])));
-export var CheckboxLabel = styled(ToggleLabel)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  font-size: 0.8em;\n"], ["\n  font-size: 0.8em;\n"])));
-/**
- * All logic and invisible Inputs come from the `useToggle` hook
- */
-export var Checkbox = forwardRef(function Checkbox(props, ref) {
-    var _a = useToggle(props, ref), rootProps = _a.rootProps, Inputs = _a.Inputs, label = _a.label;
-    return (_jsxs(CheckboxRoot, __assign({}, rootProps, { children: [_jsxs(CheckboxToggle, { children: [Inputs, _jsx(CheckboxIndicator, {})] }), label && _jsx(CheckboxLabel, { children: label })] })));
-});
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/Forms/Checkbox/index.mjs

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

package/Forms/Checkbox/package.json

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

package/Forms/Feedback/Feedback.mjs

@@ -1,9 +0,0 @@
-import { __makeTemplateObject } from "tslib";
-import { jsx as _jsx } from "react/jsx-runtime";
-import styled from "styled-components";
-var Root = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin-top: 0.2em;\n  font-size: 12px;\n  ", "\n"], ["\n  margin-top: 0.2em;\n  font-size: 12px;\n  ", "\n"])), function (p) { return (p.$danger ? "color: var(--danger);" : ""); });
-export var Feedback = function (_a) {
-    var $danger = _a.$danger, children = _a.children;
-    return (_jsx(Root, { role: "alert", "$danger": $danger, children: children }));
-};
-var templateObject_1;

package/Forms/Feedback/index.mjs

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

package/Forms/Feedback/package.json

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

package/Forms/Field/Field.mjs

@@ -1,31 +0,0 @@
-import { __assign, __makeTemplateObject, __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import styled, { css } from "styled-components";
-import { Feedback } from "../Feedback";
-export var field = css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  padding-bottom: 20px;\n"], ["\n  padding-bottom: 20px;\n"])));
-export var FieldBase = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), field);
-export var FieldRoot = styled(FieldBase)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), function (p) {
-    return (p.$danger &&
-        "\n    color: var(--danger);\n    \n    textarea,\n    input,\n    select {\n      color: var(--danger);\n    }\n  ");
-});
-export var Field = function (_a) {
-    var name = _a.name, t = _a.t, error = _a.error, errors = _a.errors, children = _a.children, props = __rest(_a, ["name", "t", "error", "errors", "children"]);
-    var err = (errors && name ? errors[name] : error);
-    var msg = "";
-    if (err) {
-        if (name && t && err.type !== "plain") {
-            msg = t("errors.".concat(name, ".").concat(err.type || err.message));
-        }
-        else {
-            msg = err.message;
-        }
-    }
-    // dynamic i18n namespace loading does not seem to work yet
-    // const t = useT("core.Forms");
-    // const { locale } = useRouter();
-    // useEffect(() => {
-    //   i18n.addResourceBundle(locale, "core.Forms", null);
-    // }, []);
-    return (_jsxs(FieldRoot, __assign({ "$danger": !!err }, props, { children: [children, msg && _jsx(Feedback, { "$danger": true, children: msg })] })));
-};
-var templateObject_1, templateObject_2, templateObject_3;

package/Forms/Field/FieldControl.mjs

@@ -1,47 +0,0 @@
-import { __assign, __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useMemo } from "react";
-import { useFormState } from "react-hook-form";
-import decode from "@koine/utils/decode";
-import { Field } from "./Field";
-import { FieldHint } from "./FieldHint";
-import { InputHoneypot } from "../styles";
-/**
- *
- * - it expects the `field` object from our `useForm` wrapper around react-hook-form
- * - automatically get translated strings from the given `t` function` for the
- * field `label`, `placeholder` and `errors`. The .json expected by the `t` function
- * look like this:
- *
- * ```json
- * ```
- */
-export var FieldControl = function (_a) {
-    var control = _a.control, register = _a.register, setValue = _a.setValue, maybeEncodedName = _a.name, label = _a.label, placeholder = _a.placeholder, hint = _a.hint, t = _a.t, _b = _a.showError, showError = _b === void 0 ? true : _b, children = _a.children, encode = _a.encode, props = __rest(_a, ["control", "register", "setValue", "name", "label", "placeholder", "hint", "t", "showError", "children", "encode"]);
-    var name = encode ? decode(maybeEncodedName) : maybeEncodedName;
-    var errors = useFormState({ name: name, control: control }).errors;
-    var error = showError && errors[name] ? errors[name] : null;
-    var FormFieldContent = useMemo(function () {
-        return children({
-            control: control,
-            register: register,
-            setValue: setValue,
-            name: maybeEncodedName,
-            // @see https://github.com/vinissimus/next-translate/pull/461
-            // @see https://github.com/vinissimus/next-translate/issues/429
-            label: label || t("labels.".concat(name), undefined, { default: "" }),
-            placeholder: placeholder || t("placeholders.".concat(name), undefined, { fallback: "" }),
-        });
-    }, [
-        children,
-        control,
-        register,
-        setValue,
-        name,
-        label,
-        t,
-        maybeEncodedName,
-        placeholder,
-    ]);
-    return (_jsxs(_Fragment, { children: [_jsxs(Field, __assign({ name: maybeEncodedName, t: t, error: error }, props, { children: [FormFieldContent, hint && _jsx(FieldHint, { children: hint })] })), encode && register && _jsx(InputHoneypot, __assign({}, register(name)))] }));
-};

package/Forms/Field/FieldHint.mjs

@@ -1,4 +0,0 @@
-import { __makeTemplateObject } from "tslib";
-import styled from "styled-components";
-export var FieldHint = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  padding-top: 0.6em;\n  opacity: 0.7;\n  font-size: 75%;\n"], ["\n  padding-top: 0.6em;\n  opacity: 0.7;\n  font-size: 75%;\n"])));
-var templateObject_1;

package/Forms/Field/index.mjs

@@ -1,2 +0,0 @@
-export * from "./Field";
-export * from "./FieldControl";

package/Forms/Field/package.json

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

package/Forms/Input/Input.mjs

@@ -1,17 +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 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"]);
-    // console.log("Input: render");
-    return (_jsxs(_Fragment, { children: [label && _jsx(Label, { children: label }), _jsx(InputNative, __assign({}, (register ? register(name) : { name: name, ref: ref }), props))] }));
-});
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;

package/Forms/Input/index.mjs

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

package/Forms/Input/package.json

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

package/Forms/InputGroup/InputGroup.mjs

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

package/Forms/InputGroup/index.mjs

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

package/Forms/InputGroup/package.json

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

package/Forms/Label/Label.mjs

@@ -1,6 +0,0 @@
-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;

package/Forms/Label/index.mjs

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

package/Forms/Label/package.json

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

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.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"
-}