@meddleware/ui 0.1.34 → 0.1.36

package/dist/components/UiNotice.css

@@ -0,0 +1 @@
+@layer mw.reset;@layer mw.components{.mw-notice[data-v-9bed4c15]{padding:var(--space-2xs) var(--space-xs);border:1px solid var(--border);border-left-width:var(--space-4xs);border-radius:var(--radius);background:var(--lift);color:var(--text);font-size:var(--font-size-sm);margin:0}.mw-notice--error[data-v-9bed4c15]{border-left-color:var(--danger);background:color-mix(in srgb, var(--danger) 8%, var(--lift))}.mw-notice--ok[data-v-9bed4c15]{border-left-color:var(--ok);background:color-mix(in srgb, var(--ok) 8%, var(--lift))}.mw-notice--warning[data-v-9bed4c15]{border-left-color:var(--warning);background:color-mix(in srgb, var(--warning) 12%, var(--lift))}}

package/dist/components/UiNotice.js

@@ -0,0 +1,7 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./UiNotice.vue_vue_type_script_setup_true_lang.js";
+import "./UiNotice.css";
+//#region src/components/UiNotice.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-9bed4c15"]]);
+//#endregion
+export { n as default };

package/dist/components/UiNotice.vue.d.ts

@@ -1,17 +1,25 @@
 type __VLS_Props = {
     /**
-     * Semantic intent — controls colour and ARIA role.
-     * - `'info'` (default): neutral informational note.
-     * - `'error'`: danger-coloured, sets `role="alert"` for assistive technologies.
-     * - `'ok'`: success-coloured, sets `role="status"`.
+     * Semantic intent: colour and ARIA role.
+     * - `'info'` (default): a neutral note.
+     * - `'warning'`: caution; `role="status"` (polite).
+     * - `'error'`: danger-coloured; `role="alert"` (assertive).
+     * - `'ok'`: success-coloured; `role="status"`.
      */
-    type?: 'info' | 'error' | 'ok';
+    type?: 'info' | 'warning' | 'error' | 'ok';
+    /** The message, for the common case of one sentence (instead of the default slot). */
+    message?: string;
+    /** Root element: a `<p>` (default) holds phrasing content; use `div` for block content (lists, several paragraphs). */
+    as?: 'p' | 'div';
 };
-declare var __VLS_1: {};
+declare var __VLS_7: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_1) => any;
+    default?: (props: typeof __VLS_7) => any;
 };
-declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    type: "ok" | "info" | "error" | "warning";
+    as: "div" | "p";
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/UiNotice.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,22 @@
+import { computed as e, createBlock as t, createTextVNode as n, defineComponent as r, normalizeClass as i, openBlock as a, renderSlot as o, resolveDynamicComponent as s, toDisplayString as c, withCtx as l } from "vue";
+//#region src/components/UiNotice.vue?vue&type=script&setup=true&lang.ts
+var u = /*@__PURE__*/ r({
+	__name: "UiNotice",
+	props: {
+		type: { default: "info" },
+		message: {},
+		as: { default: "p" }
+	},
+	setup(r) {
+		let u = r, d = e(() => u.type === "error" ? "alert" : u.type === "ok" || u.type === "warning" ? "status" : void 0);
+		return (e, u) => (a(), t(s(r.as), {
+			class: i(["mw-notice", r.type === "info" ? "" : `mw-notice--${r.type}`]),
+			role: d.value
+		}, {
+			default: l(() => [o(e.$slots, "default", {}, () => [n(c(r.message), 1)], !0)]),
+			_: 3
+		}, 8, ["class", "role"]));
+	}
+});
+//#endregion
+export { u as default };

package/dist/components/UiPager.css

@@ -0,0 +1 @@
+@layer mw.reset;@layer mw.components{.mw-pager[data-v-bdf9f25e]{gap:var(--space-sm);margin-top:var(--space-xs);justify-content:flex-end;align-items:center;display:flex}.mw-pager__page[data-v-bdf9f25e]{color:var(--muted);font-size:var(--font-size-sm)}}

package/dist/components/UiPager.js

@@ -0,0 +1,7 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./UiPager.vue_vue_type_script_setup_true_lang.js";
+import "./UiPager.css";
+//#region src/components/UiPager.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-bdf9f25e"]]);
+//#endregion
+export { n as default };

package/dist/components/UiPager.vue.d.ts

@@ -0,0 +1,23 @@
+type __VLS_Props = {
+    /** Zero-based index of the page shown. */
+    index: number;
+    hasNext: boolean;
+    loading?: boolean;
+    /** Names the navigation landmark. */
+    label?: string;
+    prevLabel?: string;
+    nextLabel?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    prev: () => any;
+    next: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onPrev?: (() => any) | undefined;
+    onNext?: (() => any) | undefined;
+}>, {
+    label: string;
+    prevLabel: string;
+    nextLabel: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/UiPager.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,46 @@
+import e from "./UiButton.js";
+import { Fragment as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, createTextVNode as a, createVNode as o, defineComponent as s, openBlock as c, toDisplayString as l, withCtx as u } from "vue";
+//#region src/components/UiPager.vue?vue&type=script&setup=true&lang.ts
+var d = ["aria-label"], f = {
+	class: "mw-pager__page",
+	"aria-label": "Current page"
+}, p = /*@__PURE__*/ s({
+	__name: "UiPager",
+	props: {
+		index: {},
+		hasNext: { type: Boolean },
+		loading: { type: Boolean },
+		label: { default: "Pages" },
+		prevLabel: { default: "Previous" },
+		nextLabel: { default: "Next" }
+	},
+	emits: ["prev", "next"],
+	setup(s) {
+		return (p, m) => (c(), r("nav", {
+			class: "mw-pager",
+			"aria-label": s.label
+		}, [
+			o(e, {
+				variant: "ghost",
+				size: "sm",
+				disabled: s.index === 0 || s.loading,
+				onClick: m[0] ||= (e) => p.$emit("prev")
+			}, {
+				default: u(() => [a(l(s.prevLabel), 1)]),
+				_: 1
+			}, 8, ["disabled"]),
+			i("output", f, [a("Page " + l(s.index + 1), 1), s.loading ? (c(), r(t, { key: 0 }, [a(" (loading…)")], 64)) : n("", !0)]),
+			o(e, {
+				variant: "ghost",
+				size: "sm",
+				disabled: !s.hasNext || s.loading,
+				onClick: m[1] ||= (e) => p.$emit("next")
+			}, {
+				default: u(() => [a(l(s.nextLabel), 1)]),
+				_: 1
+			}, 8, ["disabled"])
+		], 8, d));
+	}
+});
+//#endregion
+export { p as default };

package/dist/components/UiPanel.css

@@ -0,0 +1 @@
+@layer mw.reset;@layer mw.components{.mw-panel[data-v-db89a6f2]{padding:var(--space-xs);border:1px solid var(--border);border-radius:var(--radius-xs);background:var(--surface);overflow:hidden}.mw-panel__title[data-v-db89a6f2]{margin:calc(-1 * var(--space-xs)) calc(-1 * var(--space-xs)) var(--space-xs);padding:var(--space-3xs) var(--space-xs);font-size:var(--font-size-2xs);font-weight:var(--font-weight-semibold);letter-spacing:var(--tracking-wide);line-height:inherit;text-transform:uppercase;color:var(--muted);background:var(--lift);border-bottom:1px solid var(--border)}}

package/dist/components/UiPanel.js

@@ -0,0 +1,7 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./UiPanel.vue_vue_type_script_setup_true_lang.js";
+import "./UiPanel.css";
+//#region src/components/UiPanel.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-db89a6f2"]]);
+//#endregion
+export { n as default };

package/dist/components/UiPanel.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,21 @@
+import { computed as e, createBlock as t, createCommentVNode as n, createElementBlock as r, createTextVNode as i, defineComponent as a, openBlock as o, renderSlot as s, resolveDynamicComponent as c, toDisplayString as l, useSlots as u, withCtx as d } from "vue";
+//#region src/components/UiPanel.vue?vue&type=script&setup=true&lang.ts
+var f = { class: "mw-panel" }, p = /*@__PURE__*/ a({
+	__name: "UiPanel",
+	props: {
+		title: {},
+		level: { default: 2 }
+	},
+	setup(a) {
+		let p = a, m = u(), h = e(() => !!(p.title || m.title));
+		return (e, u) => (o(), r("section", f, [h.value ? (o(), t(c(`h${a.level}`), {
+			key: 0,
+			class: "mw-panel__title"
+		}, {
+			default: d(() => [s(e.$slots, "title", {}, () => [i(l(a.title), 1)], !0)]),
+			_: 3
+		})) : n("", !0), s(e.$slots, "default", {}, void 0, !0)]));
+	}
+});
+//#endregion
+export { p as default };

package/dist/components/UiSegmentedControl.css

@@ -0,0 +1 @@
+@layer mw.reset;@layer mw.components{.mw-seg[data-v-895d43d3]{border:1px solid var(--border);border-radius:var(--radius);min-inline-size:0;margin:0;padding:0;display:inline-flex;overflow:hidden}.mw-seg__legend[data-v-895d43d3]{float:inline-start;width:100%;padding:var(--space-3xs) var(--space-xs);font-size:var(--font-size-sm)}.mw-seg--wrap[data-v-895d43d3]{flex-wrap:wrap}@media (width<36em){.mw-seg--grid[data-v-895d43d3]{grid-template-columns:repeat(auto-fit,minmax(min(100%,7rem),1fr));display:grid}.mw-seg--grid .mw-seg__item[data-v-895d43d3]{white-space:normal;padding-block:var(--space-4xs);text-align:center}}.mw-seg__item[data-v-895d43d3]{justify-content:center;align-items:center;gap:var(--space-3xs);min-height:var(--space-md);padding:0 var(--space-sm);border-right:1px solid var(--border);cursor:pointer;font-size:var(--font-size-sm);color:var(--text);transition:background var(--transition-base), color var(--transition-base);-webkit-user-select:none;user-select:none;white-space:nowrap;background:0 0;margin:0;display:flex}.mw-seg__item[data-v-895d43d3]:last-child{border-right:none}.mw-seg__item[data-v-895d43d3]:hover:not(.mw-seg__item--active){background:var(--lift)}.mw-seg__item--active[data-v-895d43d3]{background:var(--accent);color:var(--accent-contrast)}.mw-seg__item[data-v-895d43d3]:has(input:focus-visible){outline:2px solid var(--focus-ring);outline-offset:-2px}.mw-seg__item--disabled[data-v-895d43d3]{filter:grayscale(.6);pointer-events:none;cursor:not-allowed}.mw-seg__item input[type=radio][data-v-895d43d3]{opacity:0;pointer-events:none;width:0;height:0;position:absolute}}

package/dist/components/UiSegmentedControl.js

@@ -0,0 +1,7 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./UiSegmentedControl.vue_vue_type_script_setup_true_lang.js";
+import "./UiSegmentedControl.css";
+//#region src/components/UiSegmentedControl.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-895d43d3"]]);
+//#endregion
+export { n as default };

package/dist/components/UiSegmentedControl.vue.d.ts

@@ -7,12 +7,22 @@ export interface SegmentedOption {
 type __VLS_Props = {
     options: SegmentedOption[];
     modelValue: string;
+    /** Names the group (its `<legend>`). Required for a usable control: say what is being chosen. */
+    label?: string;
+    /** Visually hide the legend (default true); it still names the group for assistive technology. */
+    labelHidden?: boolean;
+    /** @deprecated Use `label`. */
     ariaLabel?: string;
+    /** `inline` (default): one row. `wrap`: wraps onto more rows. `grid`: two columns on a narrow screen, one row from 36em. */
+    layout?: 'inline' | 'wrap' | 'grid';
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (id: string) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     "onUpdate:modelValue"?: ((id: string) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}>, {
+    labelHidden: boolean;
+    layout: "inline" | "wrap" | "grid";
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/UiSegmentedControl.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,57 @@
+import { Fragment as e, computed as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, createTextVNode as a, defineComponent as o, normalizeClass as s, openBlock as c, renderList as l, toDisplayString as u, unref as d, useId as f } from "vue";
+//#region src/components/UiSegmentedControl.vue?vue&type=script&setup=true&lang.ts
+var p = ["title"], m = [
+	"name",
+	"value",
+	"checked",
+	"disabled",
+	"onChange"
+], h = {
+	key: 0,
+	class: "mw-seg__tick",
+	"aria-hidden": "true"
+}, g = /*@__PURE__*/ o({
+	__name: "UiSegmentedControl",
+	props: {
+		options: {},
+		modelValue: {},
+		label: {},
+		labelHidden: {
+			type: Boolean,
+			default: !0
+		},
+		ariaLabel: {},
+		layout: { default: "inline" }
+	},
+	emits: ["update:modelValue"],
+	setup(o, { emit: g }) {
+		let _ = o, v = g, y = f(), b = t(() => _.label ?? _.ariaLabel);
+		return (t, f) => (c(), r("fieldset", { class: s(["mw-seg", `mw-seg--${o.layout}`]) }, [b.value ? (c(), r("legend", {
+			key: 0,
+			class: s({
+				"mw-visually-hidden": o.labelHidden,
+				"mw-seg__legend": !o.labelHidden
+			})
+		}, u(b.value), 3)) : n("", !0), (c(!0), r(e, null, l(o.options, (e) => (c(), r("label", {
+			key: e.id,
+			class: s(["mw-seg__item", {
+				"mw-seg__item--active": o.modelValue === e.id,
+				"mw-seg__item--disabled": e.disabled
+			}]),
+			title: e.title
+		}, [
+			i("input", {
+				type: "radio",
+				name: d(y),
+				value: e.id,
+				checked: o.modelValue === e.id,
+				disabled: e.disabled,
+				onChange: (t) => v("update:modelValue", e.id)
+			}, null, 40, m),
+			o.modelValue === e.id ? (c(), r("span", h, "✓")) : n("", !0),
+			a(" " + u(e.label), 1)
+		], 10, p))), 128))], 2));
+	}
+});
+//#endregion
+export { g as default };

package/dist/components/UiSelect.css

@@ -0,0 +1 @@
+@layer mw.reset;@layer mw.components{.mw-select[data-v-927a9c2d]{--_chevron-stroke:var(--muted);--_chevron-arm:var(--space-2xs);appearance:none;width:100%;padding:var(--space-2xs) calc(var(--space-md) + var(--space-2xs)) var(--space-2xs) var(--space-xs);background-color:var(--surface);background-image:linear-gradient(45deg, transparent calc(50% - var(--space-4xs) / 2), var(--_chevron-stroke) calc(50% - var(--space-4xs) / 2), var(--_chevron-stroke) calc(50% + var(--space-4xs) / 2), transparent calc(50% + var(--space-4xs) / 2)), linear-gradient(-45deg, transparent calc(50% - var(--space-4xs) / 2), var(--_chevron-stroke) calc(50% - var(--space-4xs) / 2), var(--_chevron-stroke) calc(50% + var(--space-4xs) / 2), transparent calc(50% + var(--space-4xs) / 2));background-position:right calc(var(--space-xs) + var(--_chevron-arm)) center, right var(--space-xs) center;background-size:var(--_chevron-arm) var(--_chevron-arm);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);font:inherit;background-repeat:no-repeat}.mw-select[data-v-927a9c2d]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px}}

package/dist/components/UiSelect.js

@@ -0,0 +1,7 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./UiSelect.vue_vue_type_script_setup_true_lang.js";
+import "./UiSelect.css";
+//#region src/components/UiSelect.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-927a9c2d"]]);
+//#endregion
+export { n as default };

package/dist/components/UiSelect.vue.d.ts

@@ -1,5 +1,6 @@
 type __VLS_ModelProps = {
-    /** Styled native <select>. A single root element: attributes (id, aria-*, disabled…) fall
+    /** Styled native <select>, labelled by the consuming context (UiFormField's label[for], or an aria-label passed as an attribute); this primitive carries no own label.
+     * A single root element: attributes (id, aria-*, disabled…) fall
      * through to the select itself, and the chevron is painted in its background with two
      * token-coloured gradient strokes (so it follows the theme without an overlay element). */
     modelValue?: string;

package/dist/components/UiSelect.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,19 @@
+import { createElementBlock as e, defineComponent as t, openBlock as n, renderSlot as r, useModel as i, vModelSelect as a, withDirectives as o } from "vue";
+//#region src/components/UiSelect.vue?vue&type=script&setup=true&lang.ts
+var s = /*@__PURE__*/ t({
+	__name: "UiSelect",
+	props: {
+		modelValue: {},
+		modelModifiers: {}
+	},
+	emits: ["update:modelValue"],
+	setup(t) {
+		let s = i(t, "modelValue");
+		return (t, i) => o((n(), e("select", {
+			"onUpdate:modelValue": i[0] ||= (e) => s.value = e,
+			class: "mw-select"
+		}, [r(t.$slots, "default", {}, void 0, !0)], 512)), [[a, s.value]]);
+	}
+});
+//#endregion
+export { s as default };

package/dist/components/UiSelectField.js

@@ -0,0 +1,5 @@
+import e from "./UiSelectField.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/UiSelectField.vue
+var t = e;
+//#endregion
+export { t as default };

package/dist/components/UiSelectField.vue.d.ts

@@ -0,0 +1,29 @@
+type __VLS_Props = {
+    id: string;
+    label: string;
+    options: ReadonlyArray<readonly [string, string]>;
+    placeholder?: string;
+    hint?: string;
+    error?: string | null;
+};
+type __VLS_ModelProps = {
+    modelValue?: string;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare var __VLS_8: {};
+type __VLS_Slots = {} & {
+    'label-suffix'?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/UiSelectField.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,58 @@
+import e from "./UiSelect.js";
+import t from "./UiFormField.js";
+import { Fragment as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createSlots as o, createVNode as s, defineComponent as c, mergeModels as l, mergeProps as u, openBlock as d, renderList as f, renderSlot as p, toDisplayString as m, useModel as h, withCtx as g } from "vue";
+//#region src/components/UiSelectField.vue?vue&type=script&setup=true&lang.ts
+var _ = {
+	key: 0,
+	value: ""
+}, v = ["value"], y = /*@__PURE__*/ c({
+	inheritAttrs: !1,
+	__name: "UiSelectField",
+	props: /*@__PURE__*/ l({
+		id: {},
+		label: {},
+		options: {},
+		placeholder: {},
+		hint: {},
+		error: {}
+	}, {
+		modelValue: { default: "" },
+		modelModifiers: {}
+	}),
+	emits: ["update:modelValue"],
+	setup(c) {
+		let l = h(c, "modelValue");
+		return (h, y) => (d(), r(t, {
+			id: c.id,
+			label: c.label,
+			hint: c.hint,
+			error: c.error
+		}, o({
+			default: g(({ attrs: t }) => [s(e, u({
+				modelValue: l.value,
+				"onUpdate:modelValue": y[0] ||= (e) => l.value = e
+			}, {
+				...t,
+				...h.$attrs
+			}), {
+				default: g(() => [c.placeholder === void 0 ? i("", !0) : (d(), a("option", _, m(c.placeholder), 1)), (d(!0), a(n, null, f(c.options, ([e, t]) => (d(), a("option", {
+					key: e,
+					value: e
+				}, m(t), 9, v))), 128))]),
+				_: 1
+			}, 16, ["modelValue"])]),
+			_: 2
+		}, [h.$slots["label-suffix"] ? {
+			name: "label-suffix",
+			fn: g(() => [p(h.$slots, "label-suffix")]),
+			key: "0"
+		} : void 0]), 1032, [
+			"id",
+			"label",
+			"hint",
+			"error"
+		]));
+	}
+});
+//#endregion
+export { y as default };

package/dist/components/UiSkipLink.css

@@ -0,0 +1 @@
+@layer mw.reset;@layer mw.components{.mw-skip[data-v-ddc3c0de]{z-index:var(--z-skip);padding:var(--space-2xs) var(--space-xs);background:var(--accent);color:var(--accent-contrast);border-radius:var(--radius-sm);font-weight:var(--font-weight-semibold);position:absolute;inset-block-start:var(--space-2xs);inset-inline-start:var(--space-2xs);transform:translateY(-200%)}.mw-skip[data-v-ddc3c0de]:focus{transform:none}}

package/dist/components/UiSkipLink.js

@@ -0,0 +1,7 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./UiSkipLink.vue_vue_type_script_setup_true_lang.js";
+import "./UiSkipLink.css";
+//#region src/components/UiSkipLink.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-ddc3c0de"]]);
+//#endregion
+export { n as default };

package/dist/components/UiSkipLink.vue.d.ts

@@ -0,0 +1,8 @@
+type __VLS_Props = {
+    label?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    label: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/UiSkipLink.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,14 @@
+import { createElementBlock as e, defineComponent as t, openBlock as n, toDisplayString as r } from "vue";
+//#region src/components/UiSkipLink.vue?vue&type=script&setup=true&lang.ts
+var i = {
+	class: "mw-skip",
+	href: "#main"
+}, a = /*@__PURE__*/ t({
+	__name: "UiSkipLink",
+	props: { label: { default: "Skip to content" } },
+	setup(t) {
+		return (a, o) => (n(), e("a", i, r(t.label), 1));
+	}
+});
+//#endregion
+export { a as default };

package/dist/components/UiStatGrid.css

@@ -0,0 +1 @@
+@layer mw.reset;@layer mw.components{.mw-stat-grid[data-v-d0a6288d]{gap:var(--space-4xs) var(--space-xs);font-size:var(--font-size-sm);grid-template-columns:fit-content(40%) minmax(0,1fr);margin:0;display:grid}}

package/dist/components/UiStatGrid.js

@@ -0,0 +1,7 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./UiStatGrid.vue_vue_type_script_setup_true_lang.js";
+import "./UiStatGrid.css";
+//#region src/components/UiStatGrid.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-d0a6288d"]]);
+//#endregion
+export { n as default };

package/dist/components/UiStatGrid.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,10 @@
+import { createElementBlock as e, defineComponent as t, openBlock as n, renderSlot as r } from "vue";
+//#region src/components/UiStatGrid.vue?vue&type=script&setup=true&lang.ts
+var i = { class: "mw-stat-grid" }, a = /*@__PURE__*/ t({
+	__name: "UiStatGrid",
+	setup(t) {
+		return (t, a) => (n(), e("dl", i, [r(t.$slots, "default", {}, void 0, !0)]));
+	}
+});
+//#endregion
+export { a as default };

package/dist/components/UiStatRow.css

@@ -0,0 +1 @@
+@layer mw.reset;@layer mw.components{.mw-stat-grid__label[data-v-437d86d6]{color:var(--muted);overflow-wrap:anywhere}.mw-stat-grid__value[data-v-437d86d6]{font-family:var(--mw-font-mono);color:var(--text);text-align:right;overflow-wrap:anywhere;margin:0}.mw-stat-grid__value--left[data-v-437d86d6]{text-align:left}}

package/dist/components/UiStatRow.js

@@ -0,0 +1,7 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./UiStatRow.vue_vue_type_script_setup_true_lang.js";
+import "./UiStatRow.css";
+//#region src/components/UiStatRow.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-437d86d6"]]);
+//#endregion
+export { n as default };

package/dist/components/UiStatRow.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,19 @@
+import { Fragment as e, computed as t, createElementBlock as n, createElementVNode as r, defineComponent as i, normalizeClass as a, openBlock as o, renderSlot as s, toDisplayString as c, useAttrs as l } from "vue";
+//#region src/components/UiStatRow.vue?vue&type=script&setup=true&lang.ts
+var u = { class: "mw-stat-grid__label" }, d = ["id"], f = /*@__PURE__*/ i({
+	inheritAttrs: !1,
+	__name: "UiStatRow",
+	props: {
+		label: {},
+		align: { default: "right" }
+	},
+	setup(i) {
+		let f = l(), p = t(() => f.id), m = t(() => f.class);
+		return (t, l) => (o(), n(e, null, [r("dt", u, c(i.label), 1), r("dd", {
+			id: p.value,
+			class: a(["mw-stat-grid__value", [m.value, { "mw-stat-grid__value--left": i.align === "left" }]])
+		}, [s(t.$slots, "default", {}, void 0, !0)], 10, d)], 64));
+	}
+});
+//#endregion
+export { f as default };

package/dist/components/UiStatusBar.css

@@ -0,0 +1 @@
+@layer mw.reset;@layer mw.components{.mw-statusbar[data-v-df7ff616]{align-items:center;gap:var(--space-4xs) var(--space-sm);padding:var(--space-4xs) var(--space-xs);font-size:var(--font-size-2xs);color:var(--muted);background:var(--surface);border-top:1px solid var(--border);font-family:var(--mw-font-mono);z-index:var(--z-raised);flex-wrap:wrap;flex-shrink:0;margin:0;list-style:none;display:flex;position:sticky;bottom:0}.mw-statusbar[data-v-df7ff616]>li{align-items:center;gap:var(--space-3xs);display:flex}.mw-statusbar[data-v-df7ff616]>li+li:before{content:"│" / "";color:var(--border);margin-inline-end:var(--space-xs)}.mw-statusbar__pending[data-v-df7ff616]{font-style:italic}}

package/dist/components/UiStatusBar.js

@@ -0,0 +1,7 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./UiStatusBar.vue_vue_type_script_setup_true_lang.js";
+import "./UiStatusBar.css";
+//#region src/components/UiStatusBar.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-df7ff616"]]);
+//#endregion
+export { n as default };

package/dist/components/UiStatusBar.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,45 @@
+import { useNow as e } from "../composables/useNow.js";
+import t from "./UiStatusDot.js";
+import { Fragment as n, computed as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createTextVNode as s, createVNode as c, defineComponent as l, openBlock as u, renderSlot as d, toDisplayString as f } from "vue";
+//#region src/components/UiStatusBar.vue?vue&type=script&setup=true&lang.ts
+var p = {
+	role: "list",
+	class: "mw-statusbar",
+	"aria-label": "Status"
+}, m = { key: 0 }, h = { class: "mw-visually-hidden" }, g = { key: 0 }, _ = {
+	key: 1,
+	class: "mw-statusbar__pending"
+}, v = { key: 0 }, y = {
+	key: 1,
+	class: "mw-statusbar__pending"
+}, b = /*@__PURE__*/ l({
+	__name: "UiStatusBar",
+	props: {
+		network: {},
+		healthy: {
+			type: Boolean,
+			default: !0
+		},
+		epoch: {},
+		lastRefresh: {}
+	},
+	setup(l) {
+		let b = l, x = e(1e3), S = r(() => b.network ? b.network.charAt(0).toUpperCase() + b.network.slice(1) : "");
+		function C(e) {
+			let t = Math.max(0, Math.floor((x.value - e.getTime()) / 1e3));
+			return t < 5 ? "just now" : t < 60 ? `${t}s ago` : `${Math.floor(t / 60)}m ago`;
+		}
+		return (e, r) => (u(), a("ul", p, [
+			l.network ? (u(), a("li", m, [
+				c(t, { status: l.healthy ? "ok" : "error" }, null, 8, ["status"]),
+				s(" " + f(S.value) + " ", 1),
+				o("span", h, "(" + f(l.healthy ? "status OK" : "status error") + ")", 1)
+			])) : i("", !0),
+			l.epoch === void 0 ? i("", !0) : (u(), a(n, { key: 1 }, [l.epoch === null ? (u(), a("li", _, "Epoch —")) : (u(), a("li", g, "Epoch " + f(l.epoch), 1))], 64)),
+			l.lastRefresh === void 0 ? i("", !0) : (u(), a(n, { key: 2 }, [l.lastRefresh ? (u(), a("li", v, "Refreshed " + f(C(l.lastRefresh)), 1)) : (u(), a("li", y, "Loading…"))], 64)),
+			d(e.$slots, "default", {}, void 0, !0)
+		]));
+	}
+});
+//#endregion
+export { b as default };

package/dist/components/UiStatusDot.css

@@ -0,0 +1 @@
+@layer mw.reset;@layer mw.components{.mw-status-dot[data-v-271bba4b]{border-radius:50%;flex-shrink:0;display:inline-block}.mw-status-dot--sm[data-v-271bba4b]{width:var(--space-2xs);height:var(--space-2xs)}.mw-status-dot--md[data-v-271bba4b]{width:var(--space-xs);height:var(--space-xs)}.mw-status-dot--ok[data-v-271bba4b]{background:var(--ok)}.mw-status-dot--warn[data-v-271bba4b]{background:var(--warning)}.mw-status-dot--error[data-v-271bba4b]{background:var(--danger)}.mw-status-dot--unknown[data-v-271bba4b]{background:var(--muted)}}

package/dist/components/UiStatusDot.js

@@ -0,0 +1,7 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./UiStatusDot.vue_vue_type_script_setup_true_lang.js";
+import "./UiStatusDot.css";
+//#region src/components/UiStatusDot.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-271bba4b"]]);
+//#endregion
+export { n as default };

package/dist/components/UiStatusDot.vue.d.ts

@@ -1,8 +1,12 @@
+import type { StatusLevel } from '@meddleware/web-utils';
+export type StatusDotStatus = StatusLevel | 'ok' | 'warn' | 'error';
 type __VLS_Props = {
-    status?: 'ok' | 'warn' | 'error';
+    status?: StatusDotStatus;
+    size?: 'sm' | 'md';
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    status: "ok" | "error" | "warn";
+    size: "md" | "sm";
+    status: StatusDotStatus;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/UiStatusDot.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,26 @@
+import { createElementBlock as e, defineComponent as t, normalizeClass as n, openBlock as r } from "vue";
+//#region src/components/UiStatusDot.vue?vue&type=script&setup=true&lang.ts
+var i = /*@__PURE__*/ t({
+	__name: "UiStatusDot",
+	props: {
+		status: { default: "ok" },
+		size: { default: "sm" }
+	},
+	setup(t) {
+		let i = {
+			ok: "ok",
+			operational: "ok",
+			warn: "warn",
+			degraded: "warn",
+			error: "error",
+			down: "error",
+			unknown: "unknown"
+		};
+		return (a, o) => (r(), e("span", {
+			class: n(["mw-status-dot", [`mw-status-dot--${i[t.status]}`, `mw-status-dot--${t.size}`]]),
+			"aria-hidden": "true"
+		}, null, 2));
+	}
+});
+//#endregion
+export { i as default };