@koine/react 1.1.10 → 1.1.11

package/node/Forms/Label/index.js

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

package/node/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, tslib_1.__assign({ 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/node/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/node/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/node/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/node/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/node/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/node/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/node/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/node/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/node/Forms/Toggle/Toggle.js

@@ -1,36 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ToggleIndicatorRounded = exports.ToggleIndicatorSquared = exports.ToggleIndicatorFg = exports.ToggleIndicatorBgCircle = exports.ToggleIndicatorBgSquare = exports.ToggleIndicatorHolder = exports.ToggleLabelSub = exports.ToggleLabel = exports.Toggle = exports.toggleIndicatorFg = exports.toggleIndicatorBgShape = exports.toggleIndicatorBg = exports.toggleBase = void 0;
-var tslib_1 = require("tslib");
-var jsx_runtime_1 = require("react/jsx-runtime");
-/**
- * @file
- *
- * About accessibility:
- * - minimum target size of 44px https://www.w3.org/TR/WCAG21/#target-size
- */
-var react_1 = require("react");
-var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-var styled_1 = require("../../styles/styled");
-exports.toggleBase = "\n  border: 1px solid var(--forms-border-color);\n";
-exports.toggleIndicatorBg = "\n  display: inline-block;\n  flex-shrink: 0;\n  width: 100%;\n  height: 100%;\n";
-exports.toggleIndicatorBgShape = "\n  ".concat(exports.toggleIndicatorBg, "\n  fill: none;\n  stroke-width: 2px;\n  stroke: var(--forms-border-color);\n");
-exports.toggleIndicatorFg = "\n  position: absolute;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  fill: currentcolor;\n";
-exports.Toggle = styled_components_1.default.span(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 2em;\n  height: 2em;\n  margin: 0 -0.3em; /* rtl */\n  padding: 0.3em;\n"], ["\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 2em;\n  height: 2em;\n  margin: 0 -0.3em; /* rtl */\n  padding: 0.3em;\n"])));
-exports.ToggleLabel = styled_components_1.default.span(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  margin-left: 0.6em; /* rtl */\n"], ["\n  margin-left: 0.6em; /* rtl */\n"])));
-exports.ToggleLabelSub = styled_components_1.default.small(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n  opacity: 0.7;\n  font-size: 0.7em; ;\n"], ["\n  opacity: 0.7;\n  font-size: 0.7em; ;\n"])));
-exports.ToggleIndicatorHolder = styled_components_1.default.span(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n  position: relative;\n  display: flex;\n\n  input:focus ~ & {\n    ", "\n  }\n"], ["\n  position: relative;\n  display: flex;\n\n  input:focus ~ & {\n    ", "\n  }\n"])), styled_1.stateFocus);
-exports.ToggleIndicatorBgSquare = styled_components_1.default.svg(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), exports.toggleIndicatorBgShape);
-exports.ToggleIndicatorBgCircle = styled_components_1.default.svg(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), exports.toggleIndicatorBgShape);
-exports.ToggleIndicatorFg = styled_components_1.default.svg(templateObject_7 || (templateObject_7 = tslib_1.__makeTemplateObject(["\n  ", "\n  transform: scale(0);\n  transition: transform 0.18s ease;\n\n  input:checked + ", " & {\n    transform: scale(1);\n  }\n"], ["\n  ", "\n  transform: scale(0);\n  transition: transform 0.18s ease;\n\n  input:checked + ", " & {\n    transform: scale(1);\n  }\n"])), exports.toggleIndicatorFg, exports.ToggleIndicatorHolder);
-var ToggleIndicatorSquared = function (props) {
-    return ((0, jsx_runtime_1.jsxs)(exports.ToggleIndicatorHolder, { children: [(0, jsx_runtime_1.jsx)(exports.ToggleIndicatorBgSquare, tslib_1.__assign({ viewBox: "0 0 24 24" }, { children: (0, jsx_runtime_1.jsx)("rect", { width: "24", height: "24" }) })), (0, jsx_runtime_1.jsx)(exports.ToggleIndicatorFg, tslib_1.__assign({ viewBox: "0 0 24 24" }, { children: (0, jsx_runtime_1.jsx)("path", { d: "M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z" }) }))] }));
-};
-exports.ToggleIndicatorSquared = ToggleIndicatorSquared;
-var ToggleIndicatorRounded = function (_a) {
-    var _b = _a.r, r = _b === void 0 ? 6 : _b;
-    var id = (0, react_1.useId)();
-    return ((0, jsx_runtime_1.jsxs)(exports.ToggleIndicatorHolder, { children: [(0, jsx_runtime_1.jsxs)(exports.ToggleIndicatorBgCircle, tslib_1.__assign({ viewBox: "0 0 24 24" }, { children: [(0, jsx_runtime_1.jsx)("circle", { cy: "12", cx: "12", r: "12", id: "r_".concat(id), clipPath: "url(#c_".concat(id, ")") }), (0, jsx_runtime_1.jsx)("clipPath", tslib_1.__assign({ id: "c_".concat(id) }, { children: (0, jsx_runtime_1.jsx)("use", { xlinkHref: "#r_".concat(id) }) }))] })), (0, jsx_runtime_1.jsx)(exports.ToggleIndicatorFg, tslib_1.__assign({ viewBox: "0 0 24 24" }, { children: (0, jsx_runtime_1.jsx)("circle", { r: r, cx: "12", cy: "12" }) }))] }));
-};
-exports.ToggleIndicatorRounded = ToggleIndicatorRounded;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;

package/node/Forms/Toggle/index.js

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

package/node/Forms/index.js

@@ -1,19 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./antispam"), exports);
-tslib_1.__exportStar(require("./Checkbox"), exports);
-tslib_1.__exportStar(require("./Input"), exports);
-tslib_1.__exportStar(require("./InputGroup"), exports);
-tslib_1.__exportStar(require("./Feedback"), exports);
-tslib_1.__exportStar(require("./Field"), exports);
-tslib_1.__exportStar(require("./InputGroup"), exports);
-tslib_1.__exportStar(require("./Label"), exports);
-tslib_1.__exportStar(require("./Password"), exports);
-tslib_1.__exportStar(require("./Radio"), exports);
-// export * from "./Select";
-tslib_1.__exportStar(require("./Switch"), exports);
-tslib_1.__exportStar(require("./Textarea"), exports);
-tslib_1.__exportStar(require("./Toggle"), exports);
-tslib_1.__exportStar(require("./helpers"), exports);
-tslib_1.__exportStar(require("./styles"), exports);

package/node/Forms/styles.js

@@ -1,32 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.inputFocus = exports.inputBase = exports.inputReset = exports.inputPadding = exports.inputBorder = exports.inputResetAutofill = exports.InputProgress = exports.InputHoneypot = exports.InputInvisible = void 0;
-var tslib_1 = require("tslib");
-var jsx_runtime_1 = require("react/jsx-runtime");
-var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-var styled_1 = require("../styles/styled");
-var ProgressLinear_1 = require("../Progress/ProgressLinear");
-var styled_2 = require("../styles/styled");
-exports.InputInvisible = styled_components_1.default.input(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), styled_2.invisible);
-exports.InputHoneypot = (0, styled_components_1.default)(exports.InputInvisible).attrs({
-    type: "text",
-    autoComplete: "new-password",
-    tabIndex: -1,
-})(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject([""], [""])));
-exports.InputProgress = (0, styled_components_1.default)(function (p) { return ((0, jsx_runtime_1.jsx)(ProgressLinear_1.ProgressLinear, tslib_1.__assign({ fg: "var(--accent300)", bg: "var(--accent400)" }, p))); })(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n"], ["\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n"])));
-/**
- * Remove the default light blue background on autofilled inputs. To be used as
- * a function that outputs a CSS string.
- *
- * @see https://stackoverflow.com/a/62624824/1938970
- */
-exports.inputResetAutofill = "\n  &:-webkit-autofill,\n  &:-webkit-autofill:hover,\n  &:-webkit-autofill:focus,\n  &:-webkit-autofill:active {\n    -webkit-background-clip: text;\n  }\n";
-/* FIXME: find a nice way to override this styling from implementation */
-// border-bottom: 1px solid var(--forms-border-color);
-// border: 0;
-exports.inputBorder = "\n  border: 1px solid var(--forms-border-color);\n";
-exports.inputPadding = "\n  padding: var(--forms-gutter-y) var(--forms-gutter-x);\n";
-exports.inputReset = "\n  width: 100%;\n  min-height: 44px;\n  ".concat(exports.inputBorder, "\n  ").concat(exports.inputPadding, "\n");
-exports.inputBase = "\n  ".concat(exports.inputReset, "\n  ").concat(exports.inputResetAutofill, "\n  background: transparent;\n");
-exports.inputFocus = "\n  &:focus {\n    outline: 0px;\n    appearance: none;\n    ".concat(styled_1.stateFocus, "\n  }\n");
-var templateObject_1, templateObject_2, templateObject_3;

package/node/Grid/Grid.js

@@ -1,56 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Col = exports.Row = exports.ContainerFluid = exports.Container = exports.GRID_GUTTER_DEFAULT = exports.GRID_COLUMNS = void 0;
-var tslib_1 = require("tslib");
-var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-exports.GRID_COLUMNS = 12;
-exports.GRID_GUTTER_DEFAULT = "half";
-exports.Container = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  max-width: ", "px;\n  margin: 0 auto;\n  padding: 0 ", "px;\n  ", "\n"], ["\n  max-width: ", "px;\n  margin: 0 auto;\n  padding: 0 ", "px;\n  ", "\n"])), function (p) { return p.theme.breakpoints[p.size]; }, function (p) { return p.theme.gutter[p.$gutter || exports.GRID_GUTTER_DEFAULT]; }, function (p) { return (p.clamp ? "overflow: hidden;" : ""); });
-exports.ContainerFluid = styled_components_1.default.div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  padding: 0 ", "px;\n"], ["\n  padding: 0 ", "px;\n"])), function (p) { return p.theme.gutter[p.$gutter || exports.GRID_GUTTER_DEFAULT]; });
-exports.Row = styled_components_1.default.div(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n  margin: 0 -", "px;\n  display: flex;\n  ", "\n  ", ";\n  ", "\n"], ["\n  margin: 0 -", "px;\n  display: flex;\n  ", "\n  ", ";\n  ", "\n"])), function (p) { return p.theme.gutter[p.$gutter || exports.GRID_GUTTER_DEFAULT]; }, function (p) { return (p.$noWrap ? "overflow: auto;" : "flex-wrap: wrap;"); }, function (p) { return (p.$valign ? "align-items: ".concat(p.$valign) : ""); }, function (p) {
-    return p.$reverse &&
-        "@media (".concat(p.$reverse.split(":")[0], "-width: ").concat(p.$reverse.split(":")[1], "px) {\n      flex-direction: row-reverse;\n    }");
-});
-exports.Col = styled_components_1.default.div(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n  padding: 0 ", "px;\n  display: ", ";\n  ", ";\n  ", ";\n"], ["\n  padding: 0 ", "px;\n  display: ", ";\n  ", ";\n  ", ";\n"])), function (p) { return p.theme.gutter[p.$gutter || exports.GRID_GUTTER_DEFAULT]; }, function (p) { return (p.$flex ? "flex" : "block"); }, function (p) { return (p.$valign ? "align-items: " + p.$valign : ""); }, function (p) { return getColCss(p); });
-function getColWidth(breakpoints, breakpoint, value) {
-    var breakpointValue = breakpoints[breakpoint] + "px";
-    var width = (value * 100) / exports.GRID_COLUMNS;
-    var cssValue = "\n    min-width: ".concat(width, "%;\n    flex: 0 0 ").concat(width, "%;\n");
-    if (breakpoint === Object.keys(breakpoints)[0]) {
-        return cssValue;
-    }
-    return "\n  @media (min-width: ".concat(breakpointValue, "){\n    ").concat(cssValue, "\n  }");
-}
-function getColCss(props) {
-    var $auto = props.$auto, $offset = props.$offset, $width = props.$width;
-    var breakpoints = props.theme.breakpoints;
-    var css = "";
-    if ($offset) {
-        var offsets = $offset.split(",");
-        for (var i = 0; i <= offsets.length; i++) {
-            if (offsets[i]) {
-                var _a = offsets[i].split(":"), offsetBreakpoint = _a[0], offsetSize = _a[1];
-                css += " \n          @media(min-width: ".concat(breakpoints[offsetBreakpoint], "px){\n            margin-left: ").concat((100 * offsetSize) / exports.GRID_COLUMNS, "%;\n          }\n        ");
-            }
-        }
-    }
-    if ($width) {
-        // do nothing, width is set explicitly
-    }
-    else if ($auto) {
-        css += "flex: 0 0 auto; width: auto; max-width: none;";
-    }
-    else {
-        for (var breakpoint in breakpoints) {
-            var value = props[breakpoint];
-            if (typeof value !== "undefined") {
-                css += getColWidth(breakpoints, breakpoint, value);
-            }
-            else if (breakpoint === "xs") {
-                css += getColWidth(breakpoints, breakpoint, 12);
-            }
-        }
-    }
-    return css;
-}
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/node/Grid/index.js

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

package/node/Hamburger/Hamburger.js

@@ -1,56 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Hamburger = void 0;
-var tslib_1 = require("tslib");
-var jsx_runtime_1 = require("react/jsx-runtime");
-/**
- * @file
- *
- * Simplified from https://github.com/luukdv/hamburger-react
- */
-var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-var HamburgerLabel = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  position: absolute;\n  top: 30px;\n  font-size: ", ";\n  text-transform: uppercase;\n  left: 7px;\n  letter-spacing: 3px;\n"], ["\n  position: absolute;\n  top: 30px;\n  font-size: ", ";\n  text-transform: uppercase;\n  left: 7px;\n  letter-spacing: 3px;\n"])), function (_a) {
-    var $toggled = _a.$toggled;
-    return ($toggled ? "0" : "9px");
-});
-var area = 48;
-var lines = 3;
-var width = 32;
-var room = Math.round((area - width) / 2);
-var barHeightRaw = width / 12;
-var barHeight = Math.round(barHeightRaw);
-var space = 0.5;
-var marginRaw = width / (lines * (space + (lines === 3 ? 1 : 1.25)));
-var margin = Math.round(marginRaw);
-var height = barHeight * lines + margin * (lines - 1);
-var topOffset = Math.round((area - height) / 2);
-var translate = 4.6325;
-var deviation = (barHeightRaw - barHeight + (marginRaw - margin)) / (lines === 3 ? 1 : 2);
-var move = parseFloat((width / translate - deviation / (4 / 3)).toFixed(2));
-var time = 0.4;
-var easing = "cubic-bezier(0, 0, 0, 1)";
-var transition = "".concat(time, "s ").concat(easing);
-var burgerStyles = {
-    marginRight: "-8px",
-    position: "relative",
-    width: "".concat(area, "px"),
-    height: "".concat(area, "px"),
-    userSelect: "none",
-    outline: "0px",
-    cursor: "pointer",
-    transition: transition,
-};
-var barStyles = {
-    position: "absolute",
-    width: "".concat(width, "px"),
-    height: "".concat(barHeight, "px"),
-    left: "".concat(room, "px"),
-    background: "currentColor",
-    transition: transition,
-};
-var Hamburger = function (_a) {
-    var toggled = _a.toggled, props = tslib_1.__rest(_a, ["toggled"]);
-    return ((0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ style: tslib_1.__assign(tslib_1.__assign({}, burgerStyles), { transform: "".concat(toggled ? "rotate(90deg)" : "none") }), tabIndex: 0 }, props, { children: [(0, jsx_runtime_1.jsx)("div", { style: tslib_1.__assign(tslib_1.__assign({}, barStyles), { top: "".concat(topOffset, "px"), transform: "".concat(toggled ? "rotate(-45deg) translate(0px, ".concat(move, "px)") : "none") }) }), (0, jsx_runtime_1.jsx)("div", { style: tslib_1.__assign(tslib_1.__assign({}, barStyles), { top: "".concat(topOffset + barHeight + margin, "px"), transform: "".concat(toggled ? "rotate(45deg) translate(0, -".concat(move, "px)") : "none") }) }), (0, jsx_runtime_1.jsx)(HamburgerLabel, tslib_1.__assign({ "$toggled": toggled }, { children: "Menu" }))] })));
-};
-exports.Hamburger = Hamburger;
-var templateObject_1;

package/node/Hamburger/index.js

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

package/node/Header/index.js

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

package/node/Header/useHeader.js

@@ -1,35 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useHeader = void 0;
-var react_1 = require("react");
-var useScrollPosition_1 = require("../hooks/useScrollPosition");
-var theme_1 = require("../styles/theme");
-var media_1 = require("../styles/media");
-var useHeader = function () {
-    var _a = (0, react_1.useState)(false), isSticky = _a[0], setIsSticky = _a[1];
-    var themed = (0, theme_1.useTheme)().header;
-    var isDesktopLayout = (0, media_1.useMedia)("min:".concat(themed.breakpoint));
-    var valueIdx = isDesktopLayout ? 1 : 0;
-    var _b = (0, react_1.useState)(themed.height[valueIdx]), headerHeight = _b[0], setHeaderHeight = _b[1];
-    var _c = (0, react_1.useState)(themed.height[valueIdx]), placeholderHeight = _c[0], setPlaceholderHeight = _c[1];
-    var _d = (0, react_1.useState)(themed.logoWidth[valueIdx]), logoWidth = _d[0], setLogoWidth = _d[1];
-    (0, useScrollPosition_1.useScrollPosition)(function (currentPosition) {
-        var isPastThreshold = currentPosition.y * -1 > 40;
-        if (isSticky !== isPastThreshold)
-            setIsSticky(isPastThreshold);
-    }, [isSticky]);
-    (0, react_1.useEffect)(function () {
-        var valueIdx = isDesktopLayout ? 1 : 0;
-        setPlaceholderHeight(themed.height[valueIdx]);
-        setHeaderHeight(isSticky ? themed.heightSticky[valueIdx] : themed.height[valueIdx]);
-        setLogoWidth(isSticky ? themed.logoWidthSticky[valueIdx] : themed.logoWidth[valueIdx]);
-    }, [themed, isSticky, isDesktopLayout]);
-    return [
-        isSticky,
-        placeholderHeight,
-        headerHeight,
-        logoWidth,
-    ];
-};
-exports.useHeader = useHeader;
-exports.default = exports.useHeader;

package/node/Hidden/Hidden.js

@@ -1,13 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Hidden = void 0;
-var tslib_1 = require("tslib");
-var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-exports.Hidden = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), function (p) {
-    return "".concat(p.$min
-        ? "\n  @media (min-width: ".concat(p.theme.breakpoints[p.$min], "px) {\n    display: none;\n  }")
-        : "", " ").concat(p.$max
-        ? "\n  @media (max-width: ".concat(p.theme.breakpoints[p.$max], "px) {\n    display: none;\n  }")
-        : "");
-});
-var templateObject_1;

package/node/Hidden/index.js

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

package/node/Img/index.js

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

package/node/Img/types.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/node/Link/Link.js

@@ -1,7 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoineLink = void 0;
-var tslib_1 = require("tslib");
-var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-exports.KoineLink = styled_components_1.default.a(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject([""], [""])));
-var templateObject_1;

package/node/Link/LinkBlank.js

@@ -1,21 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.LinkBlank = exports.LinkBlankIcon = exports.LinkBlankA = void 0;
-var tslib_1 = require("tslib");
-var jsx_runtime_1 = require("react/jsx-runtime");
-var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-var md_1 = require("react-icons/md");
-var media_1 = require("../styles/media");
-exports.LinkBlankA = styled_components_1.default.a.attrs({
-    target: "_blank",
-    rel: "noopener",
-})(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject([""], [""])));
-// TODO: use `touch` class on <html> instead of relying on screenwidth,
-// probably implement a lean Modernizr like thing with react-helmet
-exports.LinkBlankIcon = (0, styled_components_1.default)(md_1.MdLaunch)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  color: var(---grey100);\n  font-size: inherit;\n  margin-left: 3px;\n  line-height: inherit;\n  vertical-align: middle;\n  width: 0px;\n  transition: width 0.1s ease-in-out;\n  ", " {\n    width: 20px;\n    opacity: 0.8;\n  }\n"], ["\n  color: var(---grey100);\n  font-size: inherit;\n  margin-left: 3px;\n  line-height: inherit;\n  vertical-align: middle;\n  width: 0px;\n  transition: width 0.1s ease-in-out;\n  ", " {\n    width: 20px;\n    opacity: 0.8;\n  }\n"])), media_1.max.sm);
-var LinkBlank = function (_a) {
-    var children = _a.children, target = _a.target, rel = _a.rel, props = tslib_1.__rest(_a, ["children", "target", "rel"]);
-    return ((0, jsx_runtime_1.jsxs)(exports.LinkBlankA, tslib_1.__assign({}, props, { children: [children, (0, jsx_runtime_1.jsx)(exports.LinkBlankIcon, {})] })));
-};
-exports.LinkBlank = LinkBlank;
-var templateObject_1, templateObject_2;

package/node/Link/index.js

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

package/node/Menu/Menu.js

@@ -1,7 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Menu = void 0;
-var tslib_1 = require("tslib");
-var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-exports.Menu = styled_components_1.default.ul(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  z-index: 3;\n  position: absolute;\n  list-style-type: none;\n  margin: 0;\n  padding: 0;\n  background: #fff;\n  width: 100%;\n  box-shadow: var(--shadow);\n"], ["\n  z-index: 3;\n  position: absolute;\n  list-style-type: none;\n  margin: 0;\n  padding: 0;\n  background: #fff;\n  width: 100%;\n  box-shadow: var(--shadow);\n"])));
-var templateObject_1;

package/node/Menu/MenuMui.js

@@ -1,78 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Menu = void 0;
-var tslib_1 = require("tslib");
-var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = require("react");
-var utils_1 = require("@mui/utils");
-var framer_motion_1 = require("framer-motion");
-var MenuUnstyled_1 = require("@mui/base/MenuUnstyled");
-var ModalUnstyled_1 = tslib_1.__importDefault(require("@mui/base/ModalUnstyled"));
-var ClickAwayListener_1 = tslib_1.__importDefault(require("@mui/base/ClickAwayListener"));
-var react_popper_1 = require("react-popper");
-var clsx_1 = tslib_1.__importDefault(require("@koine/utils/clsx"));
-var MenuRoot = framer_motion_1.motion.div;
-var MenuBackdrop = function () { return (0, jsx_runtime_1.jsx)("div", { className: "fixed inset-0" }); };
-exports.Menu = (0, react_1.forwardRef)(function Menu(props, ref) {
-    var Button = props.Button, placement = props.placement, children = props.children, className = props.className, htmlAttributes = tslib_1.__rest(props, ["Button", "placement", "children", "className"]);
-    var id = (0, react_1.useId)();
-    var buttonRef = (0, react_1.useRef)(null);
-    var menuActions = (0, react_1.useRef)(null);
-    var _a = (0, react_1.useState)(null), popperElement = _a[0], setPopperElement = _a[1];
-    var _b = (0, react_1.useState)(null), anchorEl = _b[0], setAnchorEl = _b[1];
-    var open = Boolean(anchorEl);
-    var styles = (0, react_popper_1.usePopper)(anchorEl, popperElement, {
-        placement: placement,
-        // strategy: "absolute",
-    }).styles;
-    var _c = (0, MenuUnstyled_1.useMenu)({
-        listboxId: id,
-        listboxRef: setPopperElement,
-        // these two make the Tab key behaviour correct, closing the menu on Tab
-        // press and re-focusing the Button trigger element
-        open: open,
-        onClose: function () { return setAnchorEl(null); },
-    }), registerItem = _c.registerItem, unregisterItem = _c.unregisterItem, getListboxProps = _c.getListboxProps, getItemProps = _c.getItemProps, getItemState = _c.getItemState;
-    var contextValue = {
-        registerItem: registerItem,
-        unregisterItem: unregisterItem,
-        getItemState: getItemState,
-        getItemProps: getItemProps,
-        open: open,
-    };
-    var handleButtonClick = function (event) {
-        if (open) {
-            setAnchorEl(null);
-        }
-        else {
-            setAnchorEl(event.currentTarget);
-        }
-    };
-    var handleButtonKeyDown = function (event) {
-        var _a;
-        if (event.key === "ArrowDown" || event.key === "ArrowUp") {
-            event.preventDefault();
-            setAnchorEl(event.currentTarget);
-            if (event.key === "ArrowUp") {
-                (_a = menuActions.current) === null || _a === void 0 ? void 0 : _a.highlightLastItem();
-            }
-        }
-    };
-    var close = (0, utils_1.unstable_useEventCallback)(function () {
-        var _a;
-        setAnchorEl(null);
-        (_a = buttonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-    });
-    var renderChildren = (0, react_1.useMemo)(function () {
-        var childrenProps = { close: close };
-        return children(childrenProps);
-    }, [children, close]);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Button, { ref: buttonRef, id: id, "aria-haspopup": "true", "aria-controls": open ? id : undefined, "aria-expanded": open ? "true" : undefined, onClick: handleButtonClick, onKeyDown: handleButtonKeyDown }), (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: open && ((0, jsx_runtime_1.jsx)(ModalUnstyled_1.default, tslib_1.__assign({ slots: { backdrop: MenuBackdrop }, onClose: close, onBackdropClick: close, open: open }, { children: (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(ClickAwayListener_1.default, tslib_1.__assign({ onClickAway: close }, { children: (0, jsx_runtime_1.jsx)(MenuRoot, tslib_1.__assign({ initial: {
-                                    opacity: 0,
-                                }, animate: {
-                                    opacity: 1,
-                                }, exit: {
-                                    opacity: 0,
-                                }, className: (0, clsx_1.default)(className), style: styles["popper"] }, htmlAttributes, getListboxProps(), { "aria-labelledby": id }, { children: (0, jsx_runtime_1.jsx)(MenuUnstyled_1.MenuUnstyledContext.Provider, tslib_1.__assign({ value: contextValue }, { children: renderChildren })) })) })) }) }))) })] }));
-});
-exports.default = exports.Menu;

package/node/Menu/index.js

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

package/node/MenuItem/MenuItem.js

@@ -1,7 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MenuItem = void 0;
-var tslib_1 = require("tslib");
-var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-exports.MenuItem = styled_components_1.default.li(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  padding: 8px 16px;\n\n  &[aria-selected=\"true\"] {\n    background: var(--accent400);\n  }\n\n  /** DEP: this is just for MultiselectMui? */\n  &.Mui-focused,\n  &[data-focus=\"true\"] {\n    background: var(--accent300);\n    color: white;\n  }\n\n  &:not([disabled]):hover {\n    cursor: pointer;\n    background: var(--accent300);\n  }\n"], ["\n  padding: 8px 16px;\n\n  &[aria-selected=\"true\"] {\n    background: var(--accent400);\n  }\n\n  /** DEP: this is just for MultiselectMui? */\n  &.Mui-focused,\n  &[data-focus=\"true\"] {\n    background: var(--accent300);\n    color: white;\n  }\n\n  &:not([disabled]):hover {\n    cursor: pointer;\n    background: var(--accent300);\n  }\n"])));
-var templateObject_1;