@meddleware/ui 0.1.10 → 0.1.11

package/dist/base.css

@@ -1,2 +1,2 @@
-*,:before,:after{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);min-height:100vh;color:var(--text);font-family:var(--mw-font-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;font-size:16px;line-height:1.55}:where(ul,ol):where([role=list],[role=listitem]){margin:0;padding:0;list-style:none}:where(img,svg,video,canvas){max-width:100%;display:block}:where(fieldset){border:0;margin:0;padding:0}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}:where(button,input,select,textarea){font-family:inherit}:where(a,button,input,select,textarea):focus-visible{outline:2px solid var(--accent);outline-offset:2px}.mw-mono{font-family:var(--mw-font-mono)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important}}.mw-header[data-v-ad7cd1c5]{height:var(--mw-header-height,56px);background:var(--_bg);color:var(--_text);border-bottom:1px solid var(--_border);font-family:var(--mw-font-sans);align-items:center;gap:1rem;padding:0 1rem;display:flex}.mw-header--sticky[data-v-ad7cd1c5]{z-index:50;position:sticky;top:0}.mw-header__brand[data-v-ad7cd1c5]{letter-spacing:.01em;white-space:nowrap;align-items:center;gap:.5rem;font-weight:650;display:flex}.mw-header__center[data-v-ad7cd1c5]{flex:auto;min-width:0}.mw-header__actions[data-v-ad7cd1c5]{align-items:center;gap:.5rem;margin-left:auto;display:flex}.mw-sidebar[data-v-23c3c7f3]{height:100%;width:var(--mw-sidebar-width,240px);background:var(--_bg);color:var(--_text);border-right:1px solid var(--_border);font-family:var(--mw-font-sans);flex-direction:column;display:flex}.mw-sidebar__head[data-v-23c3c7f3]{border-bottom:1px solid var(--_border);padding:1rem}.mw-sidebar__nav[data-v-23c3c7f3]{flex-direction:column;flex:auto;gap:.25rem;padding:.75rem;display:flex;overflow-y:auto}.mw-sidebar__body[data-v-23c3c7f3]{flex-shrink:0}.mw-sidebar__foot[data-v-23c3c7f3]{border-top:1px solid var(--_border);color:var(--_muted);padding:.75rem 1rem;font-size:.85rem}.mw-footer[data-v-c646b8e1]{background:var(--_bg);color:var(--_muted);border-top:1px solid var(--_border);font-family:var(--mw-font-sans);flex-wrap:wrap;align-items:center;gap:1rem;padding:.75rem 1rem;font-size:.85rem;display:flex}.mw-footer--transparent[data-v-c646b8e1]{border-top:1px solid var(--border)}.mw-footer__center[data-v-c646b8e1]{flex:auto;min-width:0}.mw-footer__end[data-v-c646b8e1]{margin-left:auto}.mw-mode[data-v-186f8312]{border:1px solid var(--_border,var(--border));border-radius:var(--mw-radius,10px);background:color-mix(in srgb, var(--_text,var(--text)) 6%, transparent);gap:2px;padding:2px;display:inline-flex}.mw-mode__btn[data-v-186f8312]{border-radius:calc(var(--mw-radius,10px) - 3px);color:var(--_text,var(--text));font:inherit;cursor:pointer;opacity:.7;background:0 0;border:0;align-items:center;gap:.35rem;padding:.25rem .5rem;font-size:.8rem;display:inline-flex}.mw-mode__btn[data-v-186f8312]:hover{opacity:1}.mw-mode__btn.is-active[data-v-186f8312]{opacity:1;background:color-mix(in srgb, var(--_text,var(--text)) 14%, transparent)}.mw-mode__btn[data-v-186f8312]:focus-visible{outline:2px solid var(--accent);outline-offset:1px}@media (width<=640px){.mw-mode__label[data-v-186f8312]{display:none}}.mw-btn[data-v-299de2c3]{border-radius:var(--mw-radius,10px);font:inherit;cursor:pointer;border:1px solid #0000;justify-content:center;align-items:center;gap:.4rem;padding:.5rem .9rem;font-weight:550;transition:filter .12s,background .12s;display:inline-flex}.mw-btn[data-v-299de2c3]:disabled{opacity:.55;cursor:not-allowed}.mw-btn[data-v-299de2c3]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.mw-btn--primary[data-v-299de2c3]{background:var(--accent);color:var(--accent-contrast)}.mw-btn--primary[data-v-299de2c3]:not(:disabled):hover{filter:brightness(1.08)}.mw-btn--secondary[data-v-299de2c3]{background:var(--secondary);color:var(--secondary-contrast)}.mw-btn--secondary[data-v-299de2c3]:not(:disabled):hover{filter:brightness(1.08)}.mw-btn--ghost[data-v-299de2c3]{color:var(--text);border-color:var(--border);background:0 0}.mw-btn--ghost[data-v-299de2c3]:not(:disabled):hover{background:var(--lift)}.mw-btn--danger[data-v-299de2c3]{background:var(--danger);color:var(--mw-neutral-000)}.mw-btn--danger[data-v-299de2c3]:not(:disabled):hover{filter:brightness(1.08)}.mw-card[data-v-fd2fd7ab]{background:var(--surface);border:1px solid var(--border);border-radius:var(--mw-radius,10px);color:var(--text);overflow:hidden}.mw-card__header[data-v-fd2fd7ab]{border-bottom:1px solid var(--border);padding:.85rem 1rem}.mw-card__title[data-v-fd2fd7ab]{margin:0;font-size:1rem;font-weight:600}.mw-card__body[data-v-fd2fd7ab]{padding:1rem}.mw-card__footer[data-v-fd2fd7ab]{border-top:1px solid var(--border);background:var(--lift);padding:.75rem 1rem}.mw-select[data-v-b9468387]{position:relative}.mw-select select[data-v-b9468387]{appearance:none;background:var(--surface);width:100%;color:var(--text);border:1px solid var(--border);border-radius:var(--mw-radius,10px);font:inherit;padding:.5rem 2.5rem .5rem .7rem}.mw-select select[data-v-b9468387]:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.mw-select__chevron[data-v-b9468387]{pointer-events:none;stroke:var(--muted);stroke-width:1.5px;fill:none;position:absolute;top:50%;right:.75rem;transform:translateY(-50%)}.mw-notice[data-v-6f53d0be]{border:1px solid var(--border);border-radius:var(--mw-radius,10px);background:var(--lift);color:var(--text);border-left-width:3px;margin:0;padding:.6rem .8rem;font-size:.9rem}.mw-notice--error[data-v-6f53d0be]{border-left-color:var(--danger);color:var(--danger);background:color-mix(in srgb, var(--danger) 8%, transparent)}.mw-notice--ok[data-v-6f53d0be]{border-left-color:var(--ok);color:var(--ok);background:color-mix(in srgb, var(--ok) 8%, transparent)}.sidebar-item[data-v-e15afdf7]{border-radius:var(--mw-radius,10px);width:100%;color:inherit;font:inherit;text-align:left;cursor:pointer;opacity:.85;background:0 0;border:0;align-items:center;gap:.6rem;padding:.55rem .7rem;display:flex}.sidebar-item[data-v-e15afdf7]:hover:not(:disabled){background:color-mix(in srgb, currentColor 10%, transparent);opacity:1}.sidebar-item.is-active[data-v-e15afdf7]{background:color-mix(in srgb, var(--accent) 26%, transparent);opacity:1}.sidebar-item[data-v-e15afdf7]:disabled{cursor:default}.sidebar-item[data-v-e15afdf7]:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.sidebar-item__icon[data-v-e15afdf7]{text-align:center;width:1.1rem}.ca-root[data-v-08c3420b]{align-items:center;gap:.35em;display:inline-flex}.ca-value[data-v-08c3420b]{font-family:monospace;font-size:inherit}.ca-copy[data-v-08c3420b]{color:var(--muted,#888);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:0;line-height:1;transition:color .15s;display:inline-flex}.ca-copy[data-v-08c3420b]:hover{color:var(--text,#f0f0f0)}.ca-copy--copied[data-v-08c3420b]{color:var(--accent,#6366f1)}.ca-icon[data-v-08c3420b]{display:block}.el-root[data-v-7a44607e]{font-family:monospace;font-size:inherit;color:var(--accent,#6366f1);text-underline-offset:2px;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;transition:color .15s}.el-root[data-v-7a44607e]:hover{color:var(--text,#f0f0f0);text-decoration-style:solid}.status-widget[data-v-20197983]{color:inherit;opacity:.85;align-items:center;gap:.4rem;font-size:.8rem;text-decoration:none;display:inline-flex}.status-widget[data-v-20197983]:hover{opacity:1}.status-widget__dot[data-v-20197983]{border-radius:50%;flex-shrink:0;width:.55rem;height:.55rem}.status-widget--ok .status-widget__dot[data-v-20197983]{background:var(--mw-ok-500)}.status-widget--degraded .status-widget__dot[data-v-20197983]{background:var(--mw-gold-500)}.status-widget--error .status-widget__dot[data-v-20197983]{background:var(--mw-danger-500)}
+*,:before,:after{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);min-height:100vh;color:var(--text);font-family:var(--mw-font-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;font-size:16px;line-height:1.55}:where(ul,ol):where([role=list],[role=listitem]){margin:0;padding:0;list-style:none}:where(img,svg,video,canvas){max-width:100%;display:block}:where(fieldset){border:0;margin:0;padding:0}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}:where(button,input,select,textarea){font-family:inherit}:where(a,button,input,select,textarea):focus-visible{outline:2px solid var(--accent);outline-offset:2px}.mw-mono{font-family:var(--mw-font-mono)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important}}.mw-header[data-v-ad7cd1c5]{height:var(--mw-header-height,56px);background:var(--_bg);color:var(--_text);border-bottom:1px solid var(--_border);font-family:var(--mw-font-sans);align-items:center;gap:1rem;padding:0 1rem;display:flex}.mw-header--sticky[data-v-ad7cd1c5]{z-index:50;position:sticky;top:0}.mw-header__brand[data-v-ad7cd1c5]{letter-spacing:.01em;white-space:nowrap;align-items:center;gap:.5rem;font-weight:650;display:flex}.mw-header__center[data-v-ad7cd1c5]{flex:auto;min-width:0}.mw-header__actions[data-v-ad7cd1c5]{align-items:center;gap:.5rem;margin-left:auto;display:flex}.mw-sidebar[data-v-23c3c7f3]{height:100%;width:var(--mw-sidebar-width,240px);background:var(--_bg);color:var(--_text);border-right:1px solid var(--_border);font-family:var(--mw-font-sans);flex-direction:column;display:flex}.mw-sidebar__head[data-v-23c3c7f3]{border-bottom:1px solid var(--_border);padding:1rem}.mw-sidebar__nav[data-v-23c3c7f3]{flex-direction:column;flex:auto;gap:.25rem;padding:.75rem;display:flex;overflow-y:auto}.mw-sidebar__body[data-v-23c3c7f3]{flex-shrink:0}.mw-sidebar__foot[data-v-23c3c7f3]{border-top:1px solid var(--_border);color:var(--_muted);padding:.75rem 1rem;font-size:.85rem}.mw-footer[data-v-c646b8e1]{background:var(--_bg);color:var(--_muted);border-top:1px solid var(--_border);font-family:var(--mw-font-sans);flex-wrap:wrap;align-items:center;gap:1rem;padding:.75rem 1rem;font-size:.85rem;display:flex}.mw-footer--transparent[data-v-c646b8e1]{border-top:1px solid var(--border)}.mw-footer__center[data-v-c646b8e1]{flex:auto;min-width:0}.mw-footer__end[data-v-c646b8e1]{margin-left:auto}.mw-mode[data-v-186f8312]{border:1px solid var(--_border,var(--border));border-radius:var(--mw-radius,10px);background:color-mix(in srgb, var(--_text,var(--text)) 6%, transparent);gap:2px;padding:2px;display:inline-flex}.mw-mode__btn[data-v-186f8312]{border-radius:calc(var(--mw-radius,10px) - 3px);color:var(--_text,var(--text));font:inherit;cursor:pointer;opacity:.7;background:0 0;border:0;align-items:center;gap:.35rem;padding:.25rem .5rem;font-size:.8rem;display:inline-flex}.mw-mode__btn[data-v-186f8312]:hover{opacity:1}.mw-mode__btn.is-active[data-v-186f8312]{opacity:1;background:color-mix(in srgb, var(--_text,var(--text)) 14%, transparent)}.mw-mode__btn[data-v-186f8312]:focus-visible{outline:2px solid var(--accent);outline-offset:1px}@media (width<=640px){.mw-mode__label[data-v-186f8312]{display:none}}.mw-btn[data-v-299de2c3]{border-radius:var(--mw-radius,10px);font:inherit;cursor:pointer;border:1px solid #0000;justify-content:center;align-items:center;gap:.4rem;padding:.5rem .9rem;font-weight:550;transition:filter .12s,background .12s;display:inline-flex}.mw-btn[data-v-299de2c3]:disabled{opacity:.55;cursor:not-allowed}.mw-btn[data-v-299de2c3]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.mw-btn--primary[data-v-299de2c3]{background:var(--accent);color:var(--accent-contrast)}.mw-btn--primary[data-v-299de2c3]:not(:disabled):hover{filter:brightness(1.08)}.mw-btn--secondary[data-v-299de2c3]{background:var(--secondary);color:var(--secondary-contrast)}.mw-btn--secondary[data-v-299de2c3]:not(:disabled):hover{filter:brightness(1.08)}.mw-btn--ghost[data-v-299de2c3]{color:var(--text);border-color:var(--border);background:0 0}.mw-btn--ghost[data-v-299de2c3]:not(:disabled):hover{background:var(--lift)}.mw-btn--danger[data-v-299de2c3]{background:var(--danger);color:var(--mw-neutral-000)}.mw-btn--danger[data-v-299de2c3]:not(:disabled):hover{filter:brightness(1.08)}.mw-card[data-v-fd2fd7ab]{background:var(--surface);border:1px solid var(--border);border-radius:var(--mw-radius,10px);color:var(--text);overflow:hidden}.mw-card__header[data-v-fd2fd7ab]{border-bottom:1px solid var(--border);padding:.85rem 1rem}.mw-card__title[data-v-fd2fd7ab]{margin:0;font-size:1rem;font-weight:600}.mw-card__body[data-v-fd2fd7ab]{padding:1rem}.mw-card__footer[data-v-fd2fd7ab]{border-top:1px solid var(--border);background:var(--lift);padding:.75rem 1rem}.mw-select[data-v-b9468387]{position:relative}.mw-select select[data-v-b9468387]{appearance:none;background:var(--surface);width:100%;color:var(--text);border:1px solid var(--border);border-radius:var(--mw-radius,10px);font:inherit;padding:.5rem 2.5rem .5rem .7rem}.mw-select select[data-v-b9468387]:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.mw-select__chevron[data-v-b9468387]{pointer-events:none;stroke:var(--muted);stroke-width:1.5px;fill:none;position:absolute;top:50%;right:.75rem;transform:translateY(-50%)}.mw-notice[data-v-6f53d0be]{border:1px solid var(--border);border-radius:var(--mw-radius,10px);background:var(--lift);color:var(--text);border-left-width:3px;margin:0;padding:.6rem .8rem;font-size:.9rem}.mw-notice--error[data-v-6f53d0be]{border-left-color:var(--danger);color:var(--danger);background:color-mix(in srgb, var(--danger) 8%, transparent)}.mw-notice--ok[data-v-6f53d0be]{border-left-color:var(--ok);color:var(--ok);background:color-mix(in srgb, var(--ok) 8%, transparent)}.sidebar-item[data-v-e15afdf7]{border-radius:var(--mw-radius,10px);width:100%;color:inherit;font:inherit;text-align:left;cursor:pointer;opacity:.85;background:0 0;border:0;align-items:center;gap:.6rem;padding:.55rem .7rem;display:flex}.sidebar-item[data-v-e15afdf7]:hover:not(:disabled){background:color-mix(in srgb, currentColor 10%, transparent);opacity:1}.sidebar-item.is-active[data-v-e15afdf7]{background:color-mix(in srgb, var(--accent) 26%, transparent);opacity:1}.sidebar-item[data-v-e15afdf7]:disabled{cursor:default}.sidebar-item[data-v-e15afdf7]:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.sidebar-item__icon[data-v-e15afdf7]{text-align:center;width:1.1rem}.mw-tab-nav[data-v-88758ede]{border-bottom:2px solid var(--border);gap:.25rem;display:flex}.mw-tab-nav__tab[data-v-88758ede]{appearance:none;cursor:pointer;color:var(--muted);background:0 0;border:none;border-bottom:2px solid #0000;margin-bottom:-2px;padding:.5rem 1rem;font-size:.95rem;transition:color .1s,border-color .1s}.mw-tab-nav__tab[data-v-88758ede]:hover{color:var(--text)}.mw-tab-nav__tab--active[data-v-88758ede]{border-bottom-color:var(--accent);color:var(--text);font-weight:600}.ca-root[data-v-08c3420b]{align-items:center;gap:.35em;display:inline-flex}.ca-value[data-v-08c3420b]{font-family:monospace;font-size:inherit}.ca-copy[data-v-08c3420b]{color:var(--muted,#888);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:0;line-height:1;transition:color .15s;display:inline-flex}.ca-copy[data-v-08c3420b]:hover{color:var(--text,#f0f0f0)}.ca-copy--copied[data-v-08c3420b]{color:var(--accent,#6366f1)}.ca-icon[data-v-08c3420b]{display:block}.el-root[data-v-7a44607e]{font-family:monospace;font-size:inherit;color:var(--accent,#6366f1);text-underline-offset:2px;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;transition:color .15s}.el-root[data-v-7a44607e]:hover{color:var(--text,#f0f0f0);text-decoration-style:solid}.status-widget[data-v-20197983]{color:inherit;opacity:.85;align-items:center;gap:.4rem;font-size:.8rem;text-decoration:none;display:inline-flex}.status-widget[data-v-20197983]:hover{opacity:1}.status-widget__dot[data-v-20197983]{border-radius:50%;flex-shrink:0;width:.55rem;height:.55rem}.status-widget--ok .status-widget__dot[data-v-20197983]{background:var(--mw-ok-500)}.status-widget--degraded .status-widget__dot[data-v-20197983]{background:var(--mw-gold-500)}.status-widget--error .status-widget__dot[data-v-20197983]{background:var(--mw-danger-500)}
 /*$vite$:1*/

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

@@ -0,0 +1,16 @@
+export interface AppTab {
+    id: string;
+    label: string;
+}
+type __VLS_Props = {
+    tabs: AppTab[];
+    modelValue: string;
+    ariaLabel?: string;
+};
+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>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/index.d.ts

@@ -8,6 +8,8 @@ export { default as UiCard } from './components/UiCard.vue';
 export { default as UiSelect } from './components/UiSelect.vue';
 export { default as UiNotice } from './components/UiNotice.vue';
 export { default as SidebarItem } from './components/SidebarItem.vue';
+export { default as AppTabNav } from './components/AppTabNav.vue';
+export type { AppTab } from './components/AppTabNav.vue';
 export { default as CopyableAddress } from './components/CopyableAddress.vue';
 export { default as ExplorerLink } from './components/ExplorerLink.vue';
 export { default as StatusWidget } from './components/StatusWidget.vue';

package/dist/ui.js

@@ -1,4 +1,4 @@
-import { Fragment as e, computed as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, createTextVNode as a, defineComponent as o, mergeProps as s, normalizeClass as c, normalizeStyle as l, onMounted as u, onUnmounted as ee, openBlock as d, ref as f, renderList as p, renderSlot as m, toDisplayString as h, useModel as te, vModelSelect as ne, watch as re, withDirectives as ie } from "vue";
+import { Fragment as e, computed as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, createTextVNode as a, defineComponent as o, mergeProps as s, normalizeClass as c, normalizeStyle as l, onMounted as ee, onUnmounted as u, openBlock as d, ref as f, renderList as p, renderSlot as m, toDisplayString as h, useModel as te, vModelSelect as ne, watch as re, withDirectives as ie } from "vue";
 //#region src/internal/panel.ts
 function g(e, t) {
 	let n;
@@ -171,7 +171,7 @@ var ae = { class: "mw-header__brand" }, oe = { class: "mw-header__center" }, se
 			t.$slots.footer ? (d(), r("footer", z, [m(t.$slots, "footer", {}, void 0, !0)])) : n("", !0)
 		]));
 	}
-}), [["__scopeId", "data-v-fd2fd7ab"]]), le = { class: "mw-select" }, V = /*#__PURE__*/ _(/* @__PURE__ */ o({
+}), [["__scopeId", "data-v-fd2fd7ab"]]), V = { class: "mw-select" }, H = /*#__PURE__*/ _(/* @__PURE__ */ o({
 	inheritAttrs: !1,
 	__name: "UiSelect",
 	props: {
@@ -181,7 +181,7 @@ var ae = { class: "mw-header__brand" }, oe = { class: "mw-header__center" }, se
 	emits: ["update:modelValue"],
 	setup(e) {
 		let t = te(e, "modelValue");
-		return (e, n) => (d(), r("div", le, [ie(i("select", s(e.$attrs, { "onUpdate:modelValue": n[0] ||= (e) => t.value = e }), [m(e.$slots, "default", {}, void 0, !0)], 16), [[ne, t.value]]), n[1] ||= i("svg", {
+		return (e, n) => (d(), r("div", V, [ie(i("select", s(e.$attrs, { "onUpdate:modelValue": n[0] ||= (e) => t.value = e }), [m(e.$slots, "default", {}, void 0, !0)], 16), [[ne, t.value]]), n[1] ||= i("svg", {
 			class: "mw-select__chevron",
 			xmlns: "http://www.w3.org/2000/svg",
 			width: "12",
@@ -190,7 +190,7 @@ var ae = { class: "mw-header__brand" }, oe = { class: "mw-header__center" }, se
 			"aria-hidden": "true"
 		}, [i("path", { d: "M1 1l5 5 5-5" })], -1)]));
 	}
-}), [["__scopeId", "data-v-b9468387"]]), H = ["role"], U = /*#__PURE__*/ _(/* @__PURE__ */ o({
+}), [["__scopeId", "data-v-b9468387"]]), U = ["role"], W = /*#__PURE__*/ _(/* @__PURE__ */ o({
 	__name: "UiNotice",
 	props: { type: {} },
 	setup(e) {
@@ -201,13 +201,13 @@ var ae = { class: "mw-header__brand" }, oe = { class: "mw-header__center" }, se
 		return (t, n) => (d(), r("p", {
 			class: c(["mw-notice", e.type && e.type !== "info" ? `mw-notice--${e.type}` : ""]),
 			role: i.value
-		}, [m(t.$slots, "default", {}, void 0, !0)], 10, H));
+		}, [m(t.$slots, "default", {}, void 0, !0)], 10, U));
 	}
-}), [["__scopeId", "data-v-6f53d0be"]]), W = ["disabled", "aria-current"], ue = {
+}), [["__scopeId", "data-v-6f53d0be"]]), le = ["disabled", "aria-current"], ue = {
 	key: 0,
 	class: "sidebar-item__icon",
 	"aria-hidden": "true"
-}, de = { class: "sidebar-item__label" }, fe = /*#__PURE__*/ _(/* @__PURE__ */ o({
+}, G = { class: "sidebar-item__label" }, de = /*#__PURE__*/ _(/* @__PURE__ */ o({
 	__name: "SidebarItem",
 	props: {
 		label: {},
@@ -227,9 +227,30 @@ var ae = { class: "mw-header__brand" }, oe = { class: "mw-header__center" }, se
 			class: c(["sidebar-item", { "is-active": e.active }]),
 			disabled: e.disabled,
 			"aria-current": e.active ? "page" : void 0
-		}, [e.icon ? (d(), r("span", ue, h(e.icon), 1)) : n("", !0), i("span", de, h(e.label), 1)], 10, W));
+		}, [e.icon ? (d(), r("span", ue, h(e.icon), 1)) : n("", !0), i("span", G, h(e.label), 1)], 10, le));
 	}
-}), [["__scopeId", "data-v-e15afdf7"]]), pe = { class: "ca-root" }, me = ["title"], he = ["title", "aria-label"], ge = {
+}), [["__scopeId", "data-v-e15afdf7"]]), fe = ["aria-label"], pe = ["aria-current", "onClick"], me = /*#__PURE__*/ _(/* @__PURE__ */ o({
+	__name: "AppTabNav",
+	props: {
+		tabs: {},
+		modelValue: {},
+		ariaLabel: {}
+	},
+	emits: ["update:modelValue"],
+	setup(t, { emit: n }) {
+		let i = n;
+		return (n, a) => (d(), r("nav", {
+			class: "mw-tab-nav",
+			"aria-label": t.ariaLabel
+		}, [(d(!0), r(e, null, p(t.tabs, (e) => (d(), r("button", {
+			key: e.id,
+			type: "button",
+			class: c(["mw-tab-nav__tab", { "mw-tab-nav__tab--active": t.modelValue === e.id }]),
+			"aria-current": t.modelValue === e.id ? "page" : void 0,
+			onClick: (t) => i("update:modelValue", e.id)
+		}, h(e.label), 11, pe))), 128))], 8, fe));
+	}
+}), [["__scopeId", "data-v-88758ede"]]), he = { class: "ca-root" }, ge = ["title"], _e = ["title", "aria-label"], ve = {
 	key: 0,
 	class: "ca-icon",
 	viewBox: "0 0 24 24",
@@ -241,7 +262,7 @@ var ae = { class: "mw-header__brand" }, oe = { class: "mw-header__center" }, se
 	"stroke-linecap": "round",
 	"stroke-linejoin": "round",
 	"aria-hidden": "true"
-}, _e = {
+}, ye = {
 	key: 1,
 	class: "ca-icon",
 	viewBox: "0 0 24 24",
@@ -253,7 +274,7 @@ var ae = { class: "mw-header__brand" }, oe = { class: "mw-header__center" }, se
 	"stroke-linecap": "round",
 	"stroke-linejoin": "round",
 	"aria-hidden": "true"
-}, ve = /*#__PURE__*/ _(/* @__PURE__ */ o({
+}, be = /*#__PURE__*/ _(/* @__PURE__ */ o({
 	__name: "CopyableAddress",
 	props: {
 		address: {},
@@ -275,25 +296,25 @@ var ae = { class: "mw-header__brand" }, oe = { class: "mw-header__center" }, se
 				o.value = !1;
 			}, 1500);
 		}
-		return (t, n) => (d(), r("span", pe, [i("span", {
+		return (t, n) => (d(), r("span", he, [i("span", {
 			class: "ca-value",
 			title: e.address
-		}, [m(t.$slots, "default", {}, () => [a(h(s.value), 1)], !0)], 8, me), i("button", {
+		}, [m(t.$slots, "default", {}, () => [a(h(s.value), 1)], !0)], 8, ge), i("button", {
 			type: "button",
 			class: c(["ca-copy", { "ca-copy--copied": o.value }]),
 			title: o.value ? "Copied!" : e.label,
 			"aria-label": o.value ? "Copied" : e.label,
 			onClick: l
-		}, [o.value ? (d(), r("svg", ge, [...n[0] ||= [i("polyline", { points: "20 6 9 17 4 12" }, null, -1)]])) : (d(), r("svg", _e, [...n[1] ||= [i("rect", {
+		}, [o.value ? (d(), r("svg", ve, [...n[0] ||= [i("polyline", { points: "20 6 9 17 4 12" }, null, -1)]])) : (d(), r("svg", ye, [...n[1] ||= [i("rect", {
 			x: "9",
 			y: "9",
 			width: "13",
 			height: "13",
 			rx: "2",
 			ry: "2"
-		}, null, -1), i("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" }, null, -1)]]))], 10, he)]));
+		}, null, -1), i("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" }, null, -1)]]))], 10, _e)]));
 	}
-}), [["__scopeId", "data-v-08c3420b"]]), ye = ["href", "title"], be = /*#__PURE__*/ _(/* @__PURE__ */ o({
+}), [["__scopeId", "data-v-08c3420b"]]), xe = ["href", "title"], Se = /*#__PURE__*/ _(/* @__PURE__ */ o({
 	__name: "ExplorerLink",
 	props: {
 		href: {},
@@ -317,25 +338,25 @@ var ae = { class: "mw-header__brand" }, oe = { class: "mw-header__center" }, se
 			target: "_blank",
 			rel: "noopener noreferrer",
 			title: e.value
-		}, [m(t.$slots, "default", {}, () => [a(h(i.value), 1)], !0)], 8, ye));
+		}, [m(t.$slots, "default", {}, () => [a(h(i.value), 1)], !0)], 8, xe));
 	}
-}), [["__scopeId", "data-v-7a44607e"]]), xe = /* @__PURE__ */ new Set([
+}), [["__scopeId", "data-v-7a44607e"]]), Ce = /* @__PURE__ */ new Set([
 	"operational",
 	"degraded",
 	"down",
 	"unknown"
 ]);
-function G(e) {
-	return typeof e == "string" && xe.has(e);
-}
 function K(e) {
+	return typeof e == "string" && Ce.has(e);
+}
+function q(e) {
 	if (typeof e != "object" || !e) return null;
 	let t = e;
-	return !G(t.overall) || typeof t.generated_at != "string" || !Array.isArray(t.groups) ? null : e;
+	return !K(t.overall) || typeof t.generated_at != "string" || !Array.isArray(t.groups) ? null : e;
 }
 //#endregion
 //#region src/components/StatusWidget.vue?vue&type=script&setup=true&lang.ts
-var Se = ["href", "title"], Ce = { class: "status-widget__label" }, we = /*#__PURE__*/ _(/* @__PURE__ */ o({
+var we = ["href", "title"], Te = { class: "status-widget__label" }, Ee = /*#__PURE__*/ _(/* @__PURE__ */ o({
 	__name: "StatusWidget",
 	props: {
 		apiUrl: { default: "https://status.meddleware.co.uk/api/status" },
@@ -358,16 +379,16 @@ var Se = ["href", "title"], Ce = { class: "status-widget__label" }, we = /*#__PU
 			try {
 				let e = await fetch(t.apiUrl);
 				if (!e.ok) throw Error(`HTTP ${e.status}`);
-				let r = K(await e.json());
+				let r = q(await e.json());
 				if (!r) throw Error("unexpected response shape");
 				o.value = n[r.overall], s.value = a[r.overall];
 			} catch {
 				o.value = "error", s.value = "Status unavailable";
 			}
 		}
-		return u(() => {
+		return ee(() => {
 			p(), l = setInterval(p, t.pollInterval);
-		}), ee(() => {
+		}), u(() => {
 			l !== null && clearInterval(l);
 		}), (t, n) => (d(), r("a", {
 			href: e.href,
@@ -378,56 +399,56 @@ var Se = ["href", "title"], Ce = { class: "status-widget__label" }, we = /*#__PU
 		}, [n[0] ||= i("span", {
 			class: "status-widget__dot",
 			"aria-hidden": "true"
-		}, null, -1), i("span", Ce, h(s.value), 1)], 10, Se));
+		}, null, -1), i("span", Te, h(s.value), 1)], 10, we));
 	}
-}), [["__scopeId", "data-v-20197983"]]), q = {
+}), [["__scopeId", "data-v-20197983"]]), J = {
 	mainnet: "https://suivision.xyz",
 	testnet: "https://testnet.suivision.xyz",
 	devnet: "https://devnet.suivision.xyz"
 };
-function Te(e, t, n = "testnet") {
-	return `${q[n] ?? q.testnet}/${e}/${t}`;
+function De(e, t, n = "testnet") {
+	return `${J[n] ?? J.testnet}/${e}/${t}`;
 }
 //#endregion
 //#region src/composables/useColorMode.ts
-var J = "mw-color-mode", Y = f("system"), X = !1;
-function Z() {
+var Y = "mw-color-mode", X = f("system"), Z = !1;
+function Oe() {
 	return typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia("(prefers-color-scheme: dark)").matches;
 }
 function Q(e) {
-	return e === "dark" || e === "system" && Z();
+	return e === "dark" || e === "system" && Oe();
 }
 function $(e) {
 	typeof document > "u" || document.documentElement.setAttribute("data-theme", Q(e) ? "dark" : "light");
 }
-function Ee(e = "system") {
-	if (!X) {
-		X = !0;
+function ke(e = "system") {
+	if (!Z) {
+		Z = !0;
 		let t = null;
 		try {
-			t = typeof localStorage < "u" ? localStorage.getItem(J) : null;
+			t = typeof localStorage < "u" ? localStorage.getItem(Y) : null;
 		} catch {}
-		Y.value = t ?? e, $(Y.value), typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", () => {
-			Y.value === "system" && $("system");
-		}), re(Y, (e) => {
+		X.value = t ?? e, $(X.value), typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", () => {
+			X.value === "system" && $("system");
+		}), re(X, (e) => {
 			$(e);
 			try {
-				typeof localStorage < "u" && localStorage.setItem(J, e);
+				typeof localStorage < "u" && localStorage.setItem(Y, e);
 			} catch {}
 		});
 	}
 	function t(e) {
-		Y.value = e;
+		X.value = e;
 	}
 	function n() {
-		t(Y.value === "light" ? "dark" : Y.value === "dark" ? "system" : "light");
+		t(X.value === "light" ? "dark" : X.value === "dark" ? "system" : "light");
 	}
 	return {
-		mode: Y,
+		mode: X,
 		set: t,
 		cycle: n,
-		isDark: () => Q(Y.value)
+		isDark: () => Q(X.value)
 	};
 }
 //#endregion
-export { D as AppFooter, v as AppHeader, C as AppSidebar, M as ColorModeControl, ve as CopyableAddress, be as ExplorerLink, fe as SidebarItem, we as StatusWidget, P as UiButton, B as UiCard, U as UiNotice, V as UiSelect, G as isStatusLevel, K as parseSnapshot, Te as suiExplorerUrl, Ee as useColorMode };
+export { D as AppFooter, v as AppHeader, C as AppSidebar, me as AppTabNav, M as ColorModeControl, be as CopyableAddress, Se as ExplorerLink, de as SidebarItem, Ee as StatusWidget, P as UiButton, B as UiCard, W as UiNotice, H as UiSelect, K as isStatusLevel, q as parseSnapshot, De as suiExplorerUrl, ke as useColorMode };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@meddleware/ui",
-  "version": "0.1.10",
+  "version": "0.1.11",
   "description": "Shared Vue 3 component library for @meddleware UIs \u2014 layout shell (header/sidebar/footer), colour-mode control, and primitives. Built on @meddleware/design-tokens.",
   "license": "0BSD",
   "type": "module",