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

package/Forms/Checkbox/Checkbox.js

@@ -1,62 +0,0 @@
-"use strict";
-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, {
-    CheckboxRoot: function() {
-        return CheckboxRoot;
-    },
-    CheckboxToggle: function() {
-        return CheckboxToggle;
-    },
-    CheckboxIndicator: function() {
-        return CheckboxIndicator;
-    },
-    CheckboxLabel: function() {
-        return CheckboxLabel;
-    },
-    Checkbox: function() {
-        return Checkbox;
-    }
-});
-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 _Toggle = require("../Toggle");
-const _useToggle = require("../Toggle/useToggle");
-const CheckboxRoot = _styledcomponents.default.label`
-  display: flex;
-  align-items: center;
-  cursor: pointer;
-`;
-const CheckboxToggle = (0, _styledcomponents.default)(_Toggle.Toggle)`
-  pointer-events: none;
-`;
-const CheckboxIndicator = (0, _styledcomponents.default)(_Toggle.ToggleIndicatorSquared)``;
-const CheckboxLabel = (0, _styledcomponents.default)(_Toggle.ToggleLabel)`
-  font-size: 0.8em;
-`;
-const Checkbox = /*#__PURE__*/ (0, _react.forwardRef)(function Checkbox(props, ref) {
-    const { rootProps, Inputs, label } = (0, _useToggle.useToggle)(props, ref);
-    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(CheckboxRoot, {
-        ...rootProps,
-        children: [
-            /*#__PURE__*/ (0, _jsxruntime.jsxs)(CheckboxToggle, {
-                children: [
-                    Inputs,
-                    /*#__PURE__*/ (0, _jsxruntime.jsx)(CheckboxIndicator, {})
-                ]
-            }),
-            label && /*#__PURE__*/ (0, _jsxruntime.jsx)(CheckboxLabel, {
-                children: label
-            })
-        ]
-    });
-});

package/Forms/Checkbox/index.js

@@ -1,6 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-const _export_star = require("@swc/helpers/_/_export_star");
-_export_star._(require("./Checkbox"), exports);

package/Forms/Feedback/Feedback.js

@@ -1,25 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "Feedback", {
-    enumerable: true,
-    get: function() {
-        return Feedback;
-    }
-});
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _jsxruntime = require("react/jsx-runtime");
-const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
-const Root = _styledcomponents.default.div`
-  margin-top: 0.2em;
-  font-size: 12px;
-  ${(p)=>p.$danger ? `color: var(--danger);` : ""}
-`;
-const Feedback = ({ $danger, children })=>{
-    return /*#__PURE__*/ (0, _jsxruntime.jsx)(Root, {
-        role: "alert",
-        $danger: $danger,
-        children: children
-    });
-};

package/Forms/Feedback/index.js

@@ -1,6 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-const _export_star = require("@swc/helpers/_/_export_star");
-_export_star._(require("./Feedback"), exports);

package/Forms/Field/Field.js

@@ -1,75 +0,0 @@
-"use strict";
-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, {
-    field: function() {
-        return field;
-    },
-    FieldBase: function() {
-        return FieldBase;
-    },
-    FieldRoot: function() {
-        return FieldRoot;
-    },
-    Field: function() {
-        return Field;
-    }
-});
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _jsxruntime = require("react/jsx-runtime");
-const _styledcomponents = /*#__PURE__*/ _interop_require_wildcard._(require("styled-components"));
-const _Feedback = require("../Feedback");
-const field = (0, _styledcomponents.css)`
-  padding-bottom: 20px;
-`;
-const FieldBase = _styledcomponents.default.div`
-  ${field}
-`;
-const FieldRoot = (0, _styledcomponents.default)(FieldBase)`
-  ${(p)=>{
-    return p.$danger && `
-    color: var(--danger);
-    
-    textarea,
-    input,
-    select {
-      color: var(--danger);
-    }
-  `;
-}}
-`;
-const Field = ({ name, t, error, errors, children, ...props })=>{
-    const err = errors && name ? errors[name] : error;
-    let msg = "";
-    if (err) {
-        if (name && t && err.type !== "plain") {
-            msg = t(`errors.${name}.${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 /*#__PURE__*/ (0, _jsxruntime.jsxs)(FieldRoot, {
-        $danger: !!err,
-        ...props,
-        children: [
-            children,
-            msg && /*#__PURE__*/ (0, _jsxruntime.jsx)(_Feedback.Feedback, {
-                $danger: true,
-                children: msg
-            })
-        ]
-    });
-};

package/Forms/Field/FieldControl.js

@@ -1,69 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "FieldControl", {
-    enumerable: true,
-    get: function() {
-        return FieldControl;
-    }
-});
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _jsxruntime = require("react/jsx-runtime");
-const _react = require("react");
-const _reacthookform = require("react-hook-form");
-const _decode = /*#__PURE__*/ _interop_require_default._(require("@koine/utils/decode"));
-const _styles = require("../styles");
-const _Field = require("./Field");
-const _FieldHint = require("./FieldHint");
-const FieldControl = ({ control, register, setValue, name: maybeEncodedName, label, placeholder, hint, t, showError = true, children, encode, ...props })=>{
-    const name = encode ? (0, _decode.default)(maybeEncodedName) : maybeEncodedName;
-    const { errors } = (0, _reacthookform.useFormState)({
-        name,
-        control
-    });
-    const error = showError && errors[name] ? errors[name] : null;
-    const FormFieldContent = (0, _react.useMemo)(()=>children({
-            control,
-            register,
-            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.${name}`, undefined, {
-                default: ""
-            }),
-            placeholder: placeholder || t(`placeholders.${name}`, undefined, {
-                fallback: ""
-            })
-        }), [
-        children,
-        control,
-        register,
-        setValue,
-        name,
-        label,
-        t,
-        maybeEncodedName,
-        placeholder
-    ]);
-    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
-        children: [
-            /*#__PURE__*/ (0, _jsxruntime.jsxs)(_Field.Field, {
-                name: maybeEncodedName,
-                t: t,
-                error: error,
-                ...props,
-                children: [
-                    FormFieldContent,
-                    hint && /*#__PURE__*/ (0, _jsxruntime.jsx)(_FieldHint.FieldHint, {
-                        children: hint
-                    })
-                ]
-            }),
-            encode && register && /*#__PURE__*/ (0, _jsxruntime.jsx)(_styles.InputHoneypot, {
-                ...register(name)
-            })
-        ]
-    });
-};

package/Forms/Field/FieldHint.js

@@ -1,17 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "FieldHint", {
-    enumerable: true,
-    get: function() {
-        return FieldHint;
-    }
-});
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
-const FieldHint = _styledcomponents.default.div`
-  padding-top: 0.6em;
-  opacity: 0.7;
-  font-size: 75%;
-`;

package/Forms/Field/index.js

@@ -1,7 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-const _export_star = require("@swc/helpers/_/_export_star");
-_export_star._(require("./Field"), exports);
-_export_star._(require("./FieldControl"), exports);

package/Forms/Input/Input.js

@@ -1,67 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    InputWrap: function() {
-        return InputWrap;
-    },
-    InputMain: function() {
-        return InputMain;
-    },
-    InputPre: function() {
-        return InputPre;
-    },
-    InputPost: function() {
-        return InputPost;
-    },
-    InputNative: function() {
-        return InputNative;
-    },
-    Input: function() {
-        return Input;
-    }
-});
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _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 InputWrap = _styledcomponents.default.div`
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-`;
-const InputMain = _styledcomponents.default.div`
-  flex: 1;
-`;
-const InputPre = _styledcomponents.default.div``;
-const InputPost = _styledcomponents.default.div``;
-const InputNative = _styledcomponents.default.input`
-  ${_styles.inputBase}
-  ${_styles.inputFocus}
-`;
-const Input = /*#__PURE__*/ (0, _react.forwardRef)(function Input({ register, name, label, ...props }, ref) {
-    // console.log("Input: render");
-    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
-        children: [
-            label && /*#__PURE__*/ (0, _jsxruntime.jsx)(_Label.Label, {
-                children: label
-            }),
-            /*#__PURE__*/ (0, _jsxruntime.jsx)(InputNative, {
-                ...register ? register(name) : {
-                    name,
-                    ref
-                },
-                ...props
-            })
-        ]
-    });
-});

package/Forms/Input/index.js

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

package/Forms/InputGroup/InputGroup.js

@@ -1,85 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    InputGroupRoot: function() {
-        return InputGroupRoot;
-    },
-    InputGroupMain: function() {
-        return InputGroupMain;
-    },
-    InputGroupButtonPre: function() {
-        return InputGroupButtonPre;
-    },
-    InputGroupButtonPost: function() {
-        return InputGroupButtonPost;
-    },
-    InputGroup: function() {
-        return InputGroup;
-    }
-});
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _jsxruntime = require("react/jsx-runtime");
-const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
-const _Buttons = require("../../Buttons");
-const _media = require("../../styles/media");
-const _Field = require("../Field");
-const InputGroupRoot = _styledcomponents.default.div`
-  ${_Field.field}
-  display: flex;
-  ${_media.max.sm} {
-    flex-direction: column;
-  }
-`;
-const InputGroupMain = _styledcomponents.default.div`
-  flex: 1;
-`;
-const InputGroupButtonPre = (0, _styledcomponents.default)(_Buttons.KoineButton)`
-  ${_media.max.sm} {
-    border-bottom: 0;
-    border-bottom-left-radius: 0;
-    border-bottom-right-radius: 0;
-  }
-  ${_media.min.sm} {
-    border-right: 0;
-    border-top-right-radius: 0;
-    border-bottom-right-radius: 0;
-  }
-`;
-const InputGroupButtonPost = (0, _styledcomponents.default)(_Buttons.KoineButton)`
-  ${_media.max.sm} {
-    border-top: 0;
-    border-top-left-radius: 0;
-    border-top-right-radius: 0;
-  }
-  ${_media.min.sm} {
-    border-left: 0;
-    border-top-left-radius: 0;
-    border-bottom-left-radius: 0;
-  }
-`;
-const InputGroup = ({ pre, post, Button = _Buttons.KoineButton, btnProps = {}, children, ...props })=>{
-    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(InputGroupRoot, {
-        ...props,
-        children: [
-            pre && /*#__PURE__*/ (0, _jsxruntime.jsx)(InputGroupButtonPre, {
-                as: Button,
-                ...btnProps
-            }),
-            /*#__PURE__*/ (0, _jsxruntime.jsx)(InputGroupMain, {
-                children: children
-            }),
-            post && /*#__PURE__*/ (0, _jsxruntime.jsx)(InputGroupButtonPost, {
-                as: Button,
-                ...btnProps
-            })
-        ]
-    });
-};

package/Forms/InputGroup/index.js

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

package/Forms/Label/Label.js

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

package/Forms/Label/index.js

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

package/Forms/Password/Password.js

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

package/Forms/Password/index.js

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

package/Forms/Radio/Radio.js

@@ -1,68 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "Radio", {
-    enumerable: true,
-    get: function() {
-        return Radio;
-    }
-});
-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 _Toggle = require("../Toggle");
-const _styles = require("../styles");
-const RadioRoot = _styledcomponents.default.div``;
-const RadioLabel = _styledcomponents.default.div`
-  ${_Label.label}
-`;
-const RadioOptionRoot = _styledcomponents.default.label`
-  display: flex;
-  align-items: center;
-  padding: 0.05em;
-  cursor: pointer;
-`;
-const RadioToggle = (0, _styledcomponents.default)(_Toggle.Toggle)``;
-const RadioIndicator = (0, _styledcomponents.default)(_Toggle.ToggleIndicatorSquared)``;
-const RadioOptionLabel = (0, _styledcomponents.default)(_Toggle.ToggleLabel)``;
-const RadioOption = /*#__PURE__*/ (0, _react.forwardRef)(function RadioOption({ register, name, label, $ref, ...props }, ref) {
-    const inputProps = register ? register(name) : {
-        name,
-        ref: $ref || ref
-    };
-    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(RadioOptionRoot, {
-        children: [
-            /*#__PURE__*/ (0, _jsxruntime.jsxs)(RadioToggle, {
-                children: [
-                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_styles.InputInvisible, {
-                        type: "radio",
-                        ...inputProps,
-                        ...props
-                    }),
-                    /*#__PURE__*/ (0, _jsxruntime.jsx)(RadioIndicator, {})
-                ]
-            }),
-            /*#__PURE__*/ (0, _jsxruntime.jsx)(RadioOptionLabel, {
-                children: label
-            })
-        ]
-    });
-});
-const Radio = /*#__PURE__*/ (0, _react.forwardRef)(function Radio({ label, options, ...props }, ref) {
-    if (!options) return null;
-    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(RadioRoot, {
-        children: [
-            label && /*#__PURE__*/ (0, _jsxruntime.jsx)(RadioLabel, {
-                children: label
-            }),
-            options.map((option, idx)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(RadioOption, {
-                    ...option,
-                    ...props,
-                    $ref: ref
-                }, idx))
-        ]
-    });
-});

package/Forms/Radio/index.js

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