elbe-ui 0.2.41 → 0.2.44

package/dist/ui/components/base/box.js

@@ -1,30 +1,28 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Box = void 0;
-exports.applyProps = applyProps;
-const preact_1 = require("preact");
-function applyProps(p, classes, style) {
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { Component, h } from "preact";
+export function applyProps(p, classes, style) {
+    var _a;
     if (Array.isArray(classes)) {
         classes = classes.filter((c) => c).join(" ");
     }
-    return {
-        id: p.id,
-        class: `${classes || ""} ${p.class || ""}`,
-        style: { ...(style ?? {}), ...(p.style ?? {}) },
-        ...(p.tooltip ? { ["data-tooltip"]: p.tooltip } : {}),
-    };
+    return Object.assign({ id: p.id, class: `${classes || ""} ${p.class || ""}`, style: Object.assign(Object.assign({}, (style !== null && style !== void 0 ? style : {})), ((_a = p.style) !== null && _a !== void 0 ? _a : {})) }, (p.tooltip ? { ["data-tooltip"]: p.tooltip } : {}));
 }
-class Box extends preact_1.Component {
-    static primary = (p) => new Box({ ...p, scheme: "primary" }).render();
-    static secondary = (p) => new Box({ ...p, scheme: "secondary" }).render();
-    static inverse = (p) => new Box({ ...p, scheme: "inverse" }).render();
+export class Box extends Component {
     render() {
-        const { scheme, mode, padding, margin, children, ...elbe } = this.props;
-        return (0, preact_1.h)("div", applyProps(elbe, [scheme, mode], {
-            padding: `${padding}rem`,
-            margin: `${margin}rem`,
-            ...elbe.style,
-        }), children);
+        const _a = this.props, { scheme, mode, padding, margin, children } = _a, elbe = __rest(_a, ["scheme", "mode", "padding", "margin", "children"]);
+        return h("div", applyProps(elbe, [scheme, mode], Object.assign({ padding: `${padding}rem`, margin: `${margin}rem` }, elbe.style)), children);
     }
 }
-exports.Box = Box;
+Box.primary = (p) => new Box(Object.assign(Object.assign({}, p), { scheme: "primary" })).render();
+Box.secondary = (p) => new Box(Object.assign(Object.assign({}, p), { scheme: "secondary" })).render();
+Box.inverse = (p) => new Box(Object.assign(Object.assign({}, p), { scheme: "inverse" })).render();

package/dist/ui/components/base/card.js

@@ -1,11 +1,20 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Card = Card;
-const jsx_runtime_1 = require("preact/jsx-runtime");
-const box_1 = require("./box");
-function Card({ mode, scheme = "primary", kind, manner, padding = 1, margin = 0, onTap, onLongTap, children, ...elbe }) {
-    return ((0, jsx_runtime_1.jsx)("div", { ...(0, box_1.applyProps)(elbe, ["card", mode, scheme, kind, manner], {
-            padding: `${padding}rem`,
-            margin: `${margin}rem`,
-        }), onClick: onTap, onContextMenu: onLongTap, children: children }));
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "preact/jsx-runtime";
+import { applyProps } from "./box";
+export function Card(_a) {
+    var { mode, scheme = "primary", kind, manner, padding = 1, margin = 0, onTap, onLongTap, children } = _a, elbe = __rest(_a, ["mode", "scheme", "kind", "manner", "padding", "margin", "onTap", "onLongTap", "children"]);
+    return (_jsx("div", Object.assign({}, applyProps(elbe, ["card", mode, scheme, kind, manner], {
+        padding: `${padding}rem`,
+        margin: `${margin}rem`,
+    }), { onClick: onTap, onContextMenu: onLongTap, children: children })));
 }

package/dist/ui/components/base/padded.js

@@ -1,23 +1,22 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
 };
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Padded = void 0;
-const jsx_runtime_1 = require("preact/jsx-runtime");
-const compat_1 = __importDefault(require("preact/compat"));
-class Padded extends compat_1.default.Component {
+import { jsx as _jsx } from "preact/jsx-runtime";
+import React from "preact/compat";
+export class Padded extends React.Component {
     constructor(props) {
         super(props);
     }
-    static all = ({ amount = 1, ...p }) => ((0, jsx_runtime_1.jsx)(Padded, { ...p, top: amount, right: amount, bottom: amount, left: amount }));
-    static symmetric = ({ vertical = 0, horizontal = 0, ...p }) => ((0, jsx_runtime_1.jsx)(Padded, { ...p,
-        top: vertical,
-        bottom: vertical,
-        left: horizontal,
-        right: horizontal }));
     render() {
-        return ((0, jsx_runtime_1.jsx)("div", { style: {
+        return (_jsx("div", { style: {
                 paddingTop: `${this.props.top}rem`,
                 paddingRight: `${this.props.right}rem`,
                 paddingBottom: `${this.props.bottom}rem`,
@@ -25,4 +24,14 @@ class Padded extends compat_1.default.Component {
             }, children: this.props.children }));
     }
 }
-exports.Padded = Padded;
+Padded.all = (_a) => {
+    var { amount = 1 } = _a, p = __rest(_a, ["amount"]);
+    return (_jsx(Padded, Object.assign({}, p, { top: amount, right: amount, bottom: amount, left: amount })));
+};
+Padded.symmetric = (_a) => {
+    var { vertical = 0, horizontal = 0 } = _a, p = __rest(_a, ["vertical", "horizontal"]);
+    return (_jsx(Padded, Object.assign({}, p, { top: vertical,
+        bottom: vertical,
+        left: horizontal,
+        right: horizontal })));
+};

package/dist/ui/components/button/button.js

@@ -1,27 +1,35 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Button = void 0;
-const jsx_runtime_1 = require("preact/jsx-runtime");
-const preact_1 = require("preact");
-const error_view_1 = require("../../util/error_view");
-const box_1 = require("../base/box");
-class Button extends preact_1.Component {
-    static major = (p) => _btn(p, "major");
-    static minor = (p) => _btn(p, "minor");
-    static flat = (p) => _btn(p, "flat");
-    static plain = (p) => _btn(p, "plain");
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
+import { Component } from "preact";
+import { _ElbeErr } from "../../util/error_view";
+import { applyProps } from "../base/box";
+export class Button extends Component {
     render() {
         return _btn(this.props, this.props.manner);
     }
 }
-exports.Button = Button;
-function _btn({ kind, onTap, icon, label, children, ...elbe }, manner) {
-    return label || icon || children ? ((0, jsx_runtime_1.jsxs)("button", { ...(0, box_1.applyProps)(elbe, [
-            "row",
-            "gap-half",
-            "main-center",
-            kind ?? (manner != "plain" && "accent"),
-            manner,
-            !onTap && "disabled",
-        ]), disabled: !onTap, onClick: (e) => onTap && onTap(e), children: [typeof icon === "function" ? icon({}) : icon, label && (0, jsx_runtime_1.jsx)("span", { children: label }), children] })) : ((0, error_view_1._ElbeErr)("Button requires either an icon and or a label, or a child"));
+Button.major = (p) => _btn(p, "major");
+Button.minor = (p) => _btn(p, "minor");
+Button.flat = (p) => _btn(p, "flat");
+Button.plain = (p) => _btn(p, "plain");
+function _btn(_a, manner) {
+    var { kind, onTap, icon, label, children } = _a, elbe = __rest(_a, ["kind", "onTap", "icon", "label", "children"]);
+    return label || icon || children ? (_jsxs("button", Object.assign({}, applyProps(elbe, [
+        "row",
+        "gap-half",
+        "main-center",
+        kind !== null && kind !== void 0 ? kind : (manner != "plain" && "accent"),
+        manner,
+        !onTap && "disabled",
+    ]), { disabled: !onTap, onClick: (e) => onTap && onTap(e), children: [typeof icon === "function" ? icon({}) : icon, label && _jsx("span", { children: label }), children] }))) : (_ElbeErr("Button requires either an icon and or a label, or a child"));
 }

package/dist/ui/components/button/choose_button.js

@@ -1,11 +1,8 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ChooseButton = ChooseButton;
-const jsx_runtime_1 = require("preact/jsx-runtime");
-const lucide_react_1 = require("lucide-react");
-const spaced_1 = require("../layout/spaced");
-const button_1 = require("./button");
-function ChooseButton({ items, value, onChange, kind, column = false, }) {
-    return ((0, jsx_runtime_1.jsx)("div", { class: `${column ? "column" : "row"} gap-none rounded accent minor card padding-none cross-stretch ${!onChange ? "disabled" : ""}`, style: "background: transparent", children: items.map((e) => ((0, jsx_runtime_1.jsxs)(button_1.Button, { manner: e.value === value ? "minor" : "flat", kind: kind, onTap: onChange && (() => onChange(e.value)), class: `sharp ${column ? "main-between gap-double" : ""}`, children: [(0, jsx_runtime_1.jsxs)("div", { class: "row gap-half", children: [typeof e.icon === "function" ? e.icon({}) : e.icon, e.label && (0, jsx_runtime_1.jsx)("span", { children: e.label })] }), column &&
-                    (e.value === value ? (0, jsx_runtime_1.jsx)(lucide_react_1.CheckIcon, {}) : (0, jsx_runtime_1.jsx)(spaced_1.Spaced, { amount: 1.5 }))] }))) }));
+import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
+import { CheckIcon } from "lucide-react";
+import { Spaced } from "../layout/spaced";
+import { Button } from "./button";
+export function ChooseButton({ items, value, onChange, kind, column = false, }) {
+    return (_jsx("div", { class: `${column ? "column" : "row"} gap-none rounded accent minor card padding-none cross-stretch ${!onChange ? "disabled" : ""}`, style: "background: transparent", children: items.map((e) => (_jsxs(Button, { manner: e.value === value ? "minor" : "flat", kind: kind, onTap: onChange && (() => onChange(e.value)), class: `sharp ${column ? "main-between gap-double" : ""}`, children: [_jsxs("div", { class: "row gap-half", children: [typeof e.icon === "function" ? e.icon({}) : e.icon, e.label && _jsx("span", { children: e.label })] }), column &&
+                    (e.value === value ? _jsx(CheckIcon, {}) : _jsx(Spaced, { amount: 1.5 }))] }))) }));
 }

package/dist/ui/components/button/icon_button.js

@@ -1,31 +1,41 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.IconButton = void 0;
-const jsx_runtime_1 = require("preact/jsx-runtime");
-const preact_1 = require("preact");
-const __1 = require("../../..");
-class IconButton extends preact_1.Component {
-    static major = (p) => _btn(p, "major");
-    static minor = (p) => _btn(p, "minor");
-    static flat = (p) => _btn(p, "flat");
-    static plain = (p) => _btn(p, "plain");
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "preact/jsx-runtime";
+import { Component } from "preact";
+import { applyProps, } from "../../..";
+export class IconButton extends Component {
     render() {
         return _btn(this.props, this.props.manner);
     }
 }
-exports.IconButton = IconButton;
-function _btn({ icon, onTap, ...elbe }, manner = "major") {
-    return ((0, jsx_runtime_1.jsx)("button", { ...(0, __1.applyProps)(elbe, [
-            "row",
-            "main-center",
-            "gap-half",
-            elbe.kind ?? (manner != "plain" && "accent"),
-            manner,
-            !onTap && "disabled",
-        ], {
-            border: "none",
-            borderRadius: "3rem",
-            height: "3rem",
-            width: "3rem",
-        }), onClick: (e) => onTap && onTap(e), children: typeof icon === "function" ? icon({}) : icon }));
+IconButton.major = (p) => _btn(p, "major");
+IconButton.minor = (p) => _btn(p, "minor");
+IconButton.flat = (p) => _btn(p, "flat");
+IconButton.plain = (p) => _btn(p, "plain");
+function _btn(_a, manner) {
+    var _b;
+    var { icon, onTap } = _a, elbe = __rest(_a, ["icon", "onTap"]);
+    if (manner === void 0) { manner = "major"; }
+    return (_jsx("button", Object.assign({}, applyProps(elbe, [
+        "row",
+        "main-center",
+        "gap-half",
+        (_b = elbe.kind) !== null && _b !== void 0 ? _b : (manner != "plain" && "accent"),
+        manner,
+        !onTap && "disabled",
+    ], {
+        border: "none",
+        borderRadius: "3rem",
+        height: "3rem",
+        width: "3rem",
+    }), { onClick: (e) => onTap && onTap(e), children: typeof icon === "function" ? icon({}) : icon })));
 }

package/dist/ui/components/button/toggle_button.js

@@ -1,11 +1,20 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ToggleButton = ToggleButton;
-const jsx_runtime_1 = require("preact/jsx-runtime");
-const lucide_react_1 = require("lucide-react");
-const box_1 = require("../base/box");
-const spaced_1 = require("../layout/spaced");
-const button_1 = require("./button");
-function ToggleButton({ value, onChange, label, icon, kind, ...elbe }) {
-    return ((0, jsx_runtime_1.jsxs)(button_1.Button, { manner: value ? "minor" : "flat", kind: kind, onTap: onChange && (() => onChange(!value)), ...(0, box_1.applyProps)(elbe, "main-between", { gap: "1.5rem" }), children: [(0, jsx_runtime_1.jsxs)("div", { class: "row gap-half", children: [typeof icon === "function" ? icon({}) : icon, label && (0, jsx_runtime_1.jsx)("span", { children: label })] }), value ? (0, jsx_runtime_1.jsx)(lucide_react_1.CheckIcon, {}) : (0, jsx_runtime_1.jsx)(spaced_1.Spaced, { amount: 1.5 })] }));
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
+import { CheckIcon } from "lucide-react";
+import { applyProps } from "../base/box";
+import { Spaced } from "../layout/spaced";
+import { Button } from "./button";
+export function ToggleButton(_a) {
+    var { value, onChange, label, icon, kind } = _a, elbe = __rest(_a, ["value", "onChange", "label", "icon", "kind"]);
+    return (_jsxs(Button, Object.assign({ manner: value ? "minor" : "flat", kind: kind, onTap: onChange && (() => onChange(!value)) }, applyProps(elbe, "main-between", { gap: "1.5rem" }), { children: [_jsxs("div", { class: "row gap-half", children: [typeof icon === "function" ? icon({}) : icon, label && _jsx("span", { children: label })] }), value ? _jsx(CheckIcon, {}) : _jsx(Spaced, { amount: 1.5 })] })));
 }

package/dist/ui/components/dialog.js

@@ -1,14 +1,11 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ElbeDialog = ElbeDialog;
-const jsx_runtime_1 = require("preact/jsx-runtime");
-const lucide_react_1 = require("lucide-react");
-const icon_button_1 = require("./button/icon_button");
-const spaced_1 = require("./layout/spaced");
-function ElbeDialog({ title, open, onClose, children, _style, }) {
-    return ((0, jsx_runtime_1.jsx)("dialog", { onClick: (e) => e.stopPropagation(), open: open, style: "text-align: start" + (_style ?? ""), children: (0, jsx_runtime_1.jsxs)("div", { class: "primary card plain-opaque padding-none", style: "max-width: 40rem; min-width: 10rem", children: [(0, jsx_runtime_1.jsxs)("div", { class: "row cross-center padded main-between", children: [(0, jsx_runtime_1.jsx)("div", { class: "body-l b", children: title }), (0, jsx_runtime_1.jsx)(icon_button_1.IconButton.plain, { icon: lucide_react_1.X, onTap: (e) => {
+import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
+import { X } from "lucide-react";
+import { IconButton } from "./button/icon_button";
+import { Spaced } from "./layout/spaced";
+export function ElbeDialog({ title, open, onClose, children, _style, }) {
+    return (_jsx("dialog", { onClick: (e) => e.stopPropagation(), open: open, style: "text-align: start" + (_style !== null && _style !== void 0 ? _style : ""), children: _jsxs("div", { class: "primary card plain-opaque padding-none", style: "max-width: 40rem; min-width: 10rem", children: [_jsxs("div", { class: "row cross-center padded main-between", children: [_jsx("div", { class: "body-l b", children: title }), _jsx(IconButton.plain, { icon: X, onTap: (e) => {
                                 e.stopPropagation();
                                 e.preventDefault();
                                 onClose();
-                            } })] }), (0, jsx_runtime_1.jsx)(spaced_1.Spaced, { amount: 0.5 }), (0, jsx_runtime_1.jsx)("div", { class: "padded", style: "max-height: 80vh; overflow: auto", children: children })] }) }));
+                            } })] }), _jsx(Spaced, { amount: 0.5 }), _jsx("div", { class: "padded", style: "max-height: 80vh; overflow: auto", children: children })] }) }));
 }

package/dist/ui/components/error_view.js

@@ -1,26 +1,24 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ErrorView = ErrorView;
-exports.PrettyErrorView = PrettyErrorView;
-const jsx_runtime_1 = require("preact/jsx-runtime");
-const signals_1 = require("@preact/signals");
-const preact_router_1 = require("preact-router");
-const __1 = require("../..");
-const s_api_1 = require("../../service/s_api");
-const dialog_1 = require("./dialog");
-function ErrorView({ error, retry, debug, }) {
-    const apiError = (0, s_api_1.ifApiError)(error) ?? {
+import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
+import { useSignal } from "@preact/signals";
+import { route } from "preact-router";
+import { Icons } from "../..";
+import { ifApiError } from "../../service/s_api";
+import { ElbeDialog } from "./dialog";
+export function ErrorView({ error, retry, debug, }) {
+    var _a;
+    const apiError = (_a = ifApiError(error)) !== null && _a !== void 0 ? _a : {
         code: 0,
         message: "unknown error",
         data: error,
     };
-    return !debug ? ((0, jsx_runtime_1.jsx)(PrettyErrorView, { apiError: apiError, retry: retry })) : ((0, jsx_runtime_1.jsxs)("div", { class: "column padded card inverse cross-stretch", children: [(0, jsx_runtime_1.jsxs)("h3", { style: "margin: 0", children: ["ERROR: ", apiError.code] }), (0, jsx_runtime_1.jsx)("p", { children: apiError.message }), (0, jsx_runtime_1.jsx)("pre", { children: JSON.stringify(apiError.data, null, 2) })] }));
+    return !debug ? (_jsx(PrettyErrorView, { apiError: apiError, retry: retry })) : (_jsxs("div", { class: "column padded card inverse cross-stretch", children: [_jsxs("h3", { style: "margin: 0", children: ["ERROR: ", apiError.code] }), _jsx("p", { children: apiError.message }), _jsx("pre", { children: JSON.stringify(apiError.data, null, 2) })] }));
 }
-function PrettyErrorView({ apiError, retry, labels = {
+export function PrettyErrorView({ apiError, retry, labels = {
     retry: "retry",
     home: "go home",
     details: "error details",
 }, }) {
-    const openSig = (0, signals_1.useSignal)(false);
-    return ((0, jsx_runtime_1.jsxs)("div", { class: "column padded cross-center", style: "margin: 1rem 0", children: [(0, jsx_runtime_1.jsx)(__1.Icons.OctagonAlert, {}), (0, jsx_runtime_1.jsx)("h3", { style: "margin: 0", children: apiError.code }), (0, jsx_runtime_1.jsx)("span", { class: "pointer", onClick: () => (openSig.value = true), children: apiError.message }), retry && ((0, jsx_runtime_1.jsxs)("button", { class: "action", onClick: () => retry(), children: [(0, jsx_runtime_1.jsx)(__1.Icons.RotateCcw, {}), " ", labels.retry ?? "retry"] })), apiError.code === 404 && ((0, jsx_runtime_1.jsxs)("button", { class: "action", onClick: () => (0, preact_router_1.route)("/"), children: [(0, jsx_runtime_1.jsx)(__1.Icons.House, {}), labels.home ?? "go home"] })), (0, jsx_runtime_1.jsx)(dialog_1.ElbeDialog, { title: labels.details ?? "error details", open: openSig.value, onClose: () => (openSig.value = false), children: (0, jsx_runtime_1.jsx)("pre", { class: "card inverse", children: JSON.stringify(apiError.data, null, 2) }) })] }));
+    var _a, _b, _c;
+    const openSig = useSignal(false);
+    return (_jsxs("div", { class: "column padded cross-center", style: "margin: 1rem 0", children: [_jsx(Icons.OctagonAlert, {}), _jsx("h3", { style: "margin: 0", children: apiError.code }), _jsx("span", { class: "pointer", onClick: () => (openSig.value = true), children: apiError.message }), retry && (_jsxs("button", { class: "action", onClick: () => retry(), children: [_jsx(Icons.RotateCcw, {}), " ", (_a = labels.retry) !== null && _a !== void 0 ? _a : "retry"] })), apiError.code === 404 && (_jsxs("button", { class: "action", onClick: () => route("/"), children: [_jsx(Icons.House, {}), (_b = labels.home) !== null && _b !== void 0 ? _b : "go home"] })), _jsx(ElbeDialog, { title: (_c = labels.details) !== null && _c !== void 0 ? _c : "error details", open: openSig.value, onClose: () => (openSig.value = false), children: _jsx("pre", { class: "card inverse", children: JSON.stringify(apiError.data, null, 2) }) })] }));
 }

package/dist/ui/components/input/checkbox.js

@@ -1,12 +1,21 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Checkbox = Checkbox;
-const jsx_runtime_1 = require("preact/jsx-runtime");
-const box_1 = require("../base/box");
-function Checkbox({ value, label, onChange, ...elbe }) {
-    return ((0, jsx_runtime_1.jsxs)("div", { class: `row ${onChange ? "" : "disabled"}`, style: {
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
+import { applyProps } from "../base/box";
+export function Checkbox(_a) {
+    var { value, label, onChange } = _a, elbe = __rest(_a, ["value", "label", "onChange"]);
+    return (_jsxs("div", { class: `row ${onChange ? "" : "disabled"}`, style: {
             gap: ".75rem",
             filter: onChange ? "" : "grayscale(1)",
             opacity: onChange ? "" : "0.5",
-        }, children: [(0, jsx_runtime_1.jsx)("input", { type: "checkbox", ...(0, box_1.applyProps)(elbe), disabled: !onChange, checked: value, onChange: (e) => onChange?.(e.currentTarget.checked) }), label && (0, jsx_runtime_1.jsx)("div", { style: "margin-top: -.25rem", children: label })] }));
+        }, children: [_jsx("input", Object.assign({ type: "checkbox" }, applyProps(elbe), { disabled: !onChange, checked: value, onChange: (e) => onChange === null || onChange === void 0 ? void 0 : onChange(e.currentTarget.checked) })), label && _jsx("div", { style: "margin-top: -.25rem", children: label })] }));
 }

package/dist/ui/components/input/input_field.js

@@ -1,31 +1,36 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
 };
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Field = void 0;
-const jsx_runtime_1 = require("preact/jsx-runtime");
-const compat_1 = __importDefault(require("preact/compat"));
-const box_1 = require("../base/box");
-const text_area_1 = require("./text_area");
-class Field extends compat_1.default.Component {
-    static text = (p) => (0, jsx_runtime_1.jsx)(Field, { ...p, type: "text" });
-    static number = (p) => (0, jsx_runtime_1.jsx)(Field, { ...p, type: "number" });
-    static password = (p) => (0, jsx_runtime_1.jsx)(Field, { ...p, type: "password" });
-    static date = (p) => (0, jsx_runtime_1.jsx)(Field, { ...p, type: "date" });
-    static time = (p) => (0, jsx_runtime_1.jsx)(Field, { ...p, type: "time" });
-    static email = (p) => (0, jsx_runtime_1.jsx)(Field, { ...p, type: "email" });
-    static multiLine = text_area_1._TextArea;
+import { jsx as _jsx } from "preact/jsx-runtime";
+import React from "preact/compat";
+import { applyProps } from "../base/box";
+import { _TextArea } from "./text_area";
+export class Field extends React.Component {
     render() {
-        const { label, hint, readonly, type, value, onInput, ...elbe } = this.props;
-        return ((0, jsx_runtime_1.jsx)("div", { style: {
+        var _a;
+        const _b = this.props, { label, hint, readonly, type, value, onInput } = _b, elbe = __rest(_b, ["label", "hint", "readonly", "type", "value", "onInput"]);
+        return (_jsx("div", { style: {
                 width: "12rem !important",
                 display: "flex",
                 flexDirection: "column",
                 alignItems: "stretch",
-            }, "data-tooltip": this.props?.tooltip, children: (0, jsx_runtime_1.jsx)("input", { type: this.props.type, ...(0, box_1.applyProps)(this.props, null, {
-                    width: "100%",
-                }), size: 5, label: this.props.label, placeholder: this.props.hint, value: this.props.value, onInput: (e) => this.props.onInput && this.props.onInput(e.currentTarget.value), readonly: this.props.readonly }) }));
+            }, "data-tooltip": (_a = this.props) === null || _a === void 0 ? void 0 : _a.tooltip, children: _jsx("input", Object.assign({ type: this.props.type }, applyProps(this.props, null, {
+                width: "100%",
+            }), { size: 5, label: this.props.label, placeholder: this.props.hint, value: this.props.value, onInput: (e) => this.props.onInput && this.props.onInput(e.currentTarget.value), readonly: this.props.readonly })) }));
     }
 }
-exports.Field = Field;
+Field.text = (p) => _jsx(Field, Object.assign({}, p, { type: "text" }));
+Field.number = (p) => _jsx(Field, Object.assign({}, p, { type: "number" }));
+Field.password = (p) => _jsx(Field, Object.assign({}, p, { type: "password" }));
+Field.date = (p) => _jsx(Field, Object.assign({}, p, { type: "date" }));
+Field.time = (p) => _jsx(Field, Object.assign({}, p, { type: "time" }));
+Field.email = (p) => _jsx(Field, Object.assign({}, p, { type: "email" }));
+Field.multiLine = _TextArea;

package/dist/ui/components/input/range.js

@@ -1,14 +1,31 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Range = Range;
-const jsx_runtime_1 = require("preact/jsx-runtime");
-const error_view_1 = require("../../util/error_view");
-const box_1 = require("../base/box");
-function Range({ value, onChange, min = 0, max = 100, step = 1, ...elbe }) {
-    return min > max ? ((0, error_view_1._ElbeErr)("Range: max is smaller than min")) : ((0, jsx_runtime_1.jsx)("input", { type: "range", ...(0, box_1.applyProps)(elbe, null, {
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "preact/jsx-runtime";
+import { _ElbeErr } from "../../util/error_view";
+import { applyProps } from "../base/box";
+import { Card } from "../base/card";
+export function Range(_a) {
+    var { value, onChange, min = 0, max = 100, step = 1 } = _a, elbe = __rest(_a, ["value", "onChange", "min", "max", "step"]);
+    return min > max ? (_ElbeErr("Range: max is smaller than min")) : (_jsx(Card, { scheme: "secondary", kind: "accent", manner: "minor", style: {
+            overflow: "unset",
+            backgroundColor: "transparent",
+            padding: "0",
+            margin: "0",
+            border: "none",
+            width: "100%",
+        }, children: _jsx("input", Object.assign({ type: "range" }, applyProps(elbe, null, {
             filter: onChange ? "" : "grayscale(1)",
             opacity: onChange ? "" : "0.5",
             cursor: onChange ? "pointer" : "not-allowed",
             width: "100%",
-        }), min: min, max: max, step: step, disabled: !onChange, value: value, onInput: (e) => onChange?.(Number(e.currentTarget.value)) }));
+        }), { min: min, max: max, step: step, disabled: !onChange, value: value, onInput: (e) => onChange === null || onChange === void 0 ? void 0 : onChange(Number(e.currentTarget.value)) })) }));
 }

package/dist/ui/components/input/select.js

@@ -1,8 +1,17 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Select = Select;
-const jsx_runtime_1 = require("preact/jsx-runtime");
-const box_1 = require("../base/box");
-function Select({ options, value, label, onChange, ...elbe }) {
-    return ((0, jsx_runtime_1.jsx)("select", { ...(0, box_1.applyProps)(elbe), value: value, label: label, onChange: (e) => onChange(e.currentTarget.value), children: options.map(({ key, label }) => ((0, jsx_runtime_1.jsx)("option", { value: key, children: label }, key))) }));
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "preact/jsx-runtime";
+import { applyProps } from "../base/box";
+export function Select(_a) {
+    var { options, value, label, onChange } = _a, elbe = __rest(_a, ["options", "value", "label", "onChange"]);
+    return (_jsx("select", Object.assign({}, applyProps(elbe), { value: value, label: label, onChange: (e) => onChange(e.currentTarget.value), children: options.map(({ key, label }) => (_jsx("option", { value: key, children: label }, key))) })));
 }

package/dist/ui/components/input/text_area.js

@@ -1,13 +1,22 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports._TextArea = _TextArea;
-const jsx_runtime_1 = require("preact/jsx-runtime");
-const box_1 = require("../base/box");
-function _TextArea({ label, hint, readonly, rows = 4, maxLength, value, onInput, ...elbe }) {
-    return ((0, jsx_runtime_1.jsx)("div", { style: {
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "preact/jsx-runtime";
+import { applyProps } from "../base/box";
+export function _TextArea(_a) {
+    var { label, hint, readonly, rows = 4, maxLength, value, onInput } = _a, elbe = __rest(_a, ["label", "hint", "readonly", "rows", "maxLength", "value", "onInput"]);
+    return (_jsx("div", { style: {
             width: "12rem !important",
             display: "flex",
             flexDirection: "column",
             alignItems: "stretch",
-        }, "data-tooltip": elbe.tooltip, children: (0, jsx_runtime_1.jsx)("textarea", { ...(0, box_1.applyProps)(elbe, null, { width: "100%" }), label: label, size: 5, cols: 5, placeholder: hint, rows: rows, maxLength: maxLength, value: value, onInput: (e) => onInput && onInput(e.currentTarget.value), readonly: readonly }) }));
+        }, "data-tooltip": elbe.tooltip, children: _jsx("textarea", Object.assign({}, applyProps(elbe, null, { width: "100%" }), { label: label, size: 5, cols: 5, placeholder: hint, rows: rows, maxLength: maxLength, value: value, onInput: (e) => onInput && onInput(e.currentTarget.value), readonly: readonly })) }));
 }