@kubed.io/cdn 0.0.4 → 0.0.6

package/dist/chunks/kd-Bbw0GeQ5.js

@@ -1,1149 +0,0 @@
-import { a as e, c as t, l as n, n as r, o as i, r as a, s as o, t as s } from "./element-ChNBLJ5X.js";
-import { n as c } from "./define-XzEniRJH.js";
-//#region src/kd/helpers.ts
-function l(e) {
-	return JSON.stringify(e ?? null);
-}
-function u(e) {
-	e.registerHelper("kdjson", (e) => l(e));
-}
-//#endregion
-//#region node_modules/lit-html/directives/if-defined.js
-var d = (e) => e ?? i, ee = /^(~|null|true|false|yes|no|on|off|y|n)$/i, te = /^([-+]?(\.\d+|\d[\d_]*(\.\d*)?)([eE][-+]?\d+)?|0x[0-9a-f]+|0o[0-7]+|[-+]?\.(inf|nan)|[-+]?\d+(:[0-5]?\d)+(\.\d*)?)$/i, ne = /^\d{4}-\d\d?-\d\d?([Tt ]|$)/, re = /^([,[\]{}#&*!|>'"%@`]|[-?:](\s|$))/, f = /[\u0000-\u0008\u000b-\u001f\u007f]/;
-function p(e) {
-	return e === "" || ee.test(e) || te.test(e) || ne.test(e) || re.test(e) || /^\s|\s$/.test(e) || e.includes(": ") || e.includes(" #") || e.endsWith(":") || e.includes("\n") || e.includes("	") || f.test(e);
-}
-function m(e) {
-	return p(e) ? JSON.stringify(e) : e;
-}
-var h = (e, t) => ({
-	kind: e,
-	text: t
-});
-function g(e) {
-	return Array.isArray(e) ? e.length > 0 : typeof e == "object" && !!e && Object.values(e).some((e) => e !== void 0);
-}
-function ie(e) {
-	return typeof e == "string" && e.includes("\n") && !f.test(e);
-}
-function ae(e) {
-	return e == null ? h("null", "null") : typeof e == "boolean" ? h("bool", String(e)) : typeof e == "number" || typeof e == "bigint" ? h("num", String(e)) : Array.isArray(e) ? h("plain", "[]") : typeof e == "object" ? h("plain", "{}") : h("str", m(String(e)));
-}
-function oe(e) {
-	let t = e.endsWith("\n") ? e.endsWith("\n\n") ? "+" : "" : "-", n = (t === "-" ? e : e.slice(0, -1)).split("\n");
-	return {
-		header: `|${n.find((e) => e !== "")?.startsWith(" ") ? "2" : ""}${t}`,
-		lines: n
-	};
-}
-function _(e, t, n, r) {
-	let i = t.length ? [h("plain", " ")] : [];
-	if (ie(n)) {
-		let { header: a, lines: o } = oe(n);
-		return [{
-			prefix: e,
-			tokens: [
-				...t,
-				...i,
-				h("plain", a)
-			]
-		}, ...o.map((e) => ({
-			prefix: e ? r : "",
-			tokens: [h("str", e)]
-		}))];
-	}
-	return [{
-		prefix: e,
-		tokens: [
-			...t,
-			...i,
-			ae(n)
-		]
-	}];
-}
-function v(e, t, n) {
-	if (Array.isArray(e)) for (let r of e) if (g(r)) {
-		let e = [];
-		v(r, `${t}  `, e), e[0].prefix = `${t}- ${e[0].prefix.slice(t.length + 2)}`, n.push(...e);
-	} else n.push(..._(`${t}- `, [], r, `${t}  `));
-	else for (let [r, i] of Object.entries(e)) {
-		if (i === void 0) continue;
-		let e = [h("key", m(r)), h("plain", ":")];
-		g(i) ? (n.push({
-			prefix: t,
-			tokens: e
-		}), v(i, Array.isArray(i) ? t : `${t}  `, n)) : n.push(..._(t, e, i, `${t}  `));
-	}
-}
-function y(e) {
-	let t = [];
-	return g(e) ? v(e, "", t) : t.push(..._("", [], e, "  ")), t;
-}
-function b(e) {
-	return y(e).map((e) => e.prefix + e.tokens.map((e) => e.text).join("")).join("\n");
-}
-//#endregion
-//#region src/kd/elements/data.ts
-var x = class extends s {
-	static properties = {
-		data: {
-			attribute: "data",
-			converter: a
-		},
-		fold: { type: Number }
-	};
-	static styles = [r, n`
-      pre {
-        margin: 0;
-        font-family: var(--kd-font-mono, monospace);
-        font-size: 12px;
-        line-height: 1.5;
-        white-space: pre-wrap;
-        overflow-wrap: anywhere;
-      }
-      .key {
-        color: color-mix(in srgb, var(--kd-info, currentColor) 75%, var(--kd-text, currentColor));
-      }
-      .str {
-        color: color-mix(in srgb, var(--kd-success, currentColor) 70%, var(--kd-text, currentColor));
-      }
-      .num {
-        color: color-mix(in srgb, var(--kd-warning, currentColor) 55%, var(--kd-text, currentColor));
-      }
-      .bool,
-      .null {
-        color: color-mix(in srgb, var(--kd-primary, currentColor) 70%, var(--kd-text, currentColor));
-      }
-      summary {
-        width: max-content;
-        color: var(--kd-text-2, inherit);
-        font-family: var(--kd-font-mono, monospace);
-        font-size: 12px;
-        cursor: pointer;
-        list-style: none;
-      }
-      summary::-webkit-details-marker {
-        display: none;
-      }
-      summary::before {
-        content: '▸ ';
-      }
-      details[open] > summary::before {
-        content: '▾ ';
-      }
-      details > pre {
-        margin-top: 2px;
-      }
-    `];
-	constructor() {
-		super(), this.fold = 10;
-	}
-	render() {
-		let e = this.data;
-		if (e === void 0) return i;
-		let n = y(e), r = t`<pre>${n.map((e, n) => t`${n ? "\n" : ""}${e.prefix}${e.tokens.map((e) => e.kind === "plain" ? e.text : t`<span class=${e.kind}>${e.text}</span>`)}`)}</pre>`;
-		if (!(this.fold > 0 && n.length > this.fold && typeof e == "object" && e)) return r;
-		let a = Object.keys(e).length, o = Array.isArray(e) ? `[ ] ${a} item${a === 1 ? "" : "s"}` : `{ } ${a} key${a === 1 ? "" : "s"}`;
-		return t`<details><summary>${o}</summary>${r}</details>`;
-	}
-};
-c("kd-data", x);
-//#endregion
-//#region src/kd/parts.ts
-var se = /* @__PURE__ */ new Set([
-	"primary",
-	"success",
-	"warning",
-	"error",
-	"info",
-	"neutral"
-]);
-function S(e, t = "neutral") {
-	return typeof e == "string" && se.has(e) ? e : t;
-}
-var C = n`
-  .primary {
-    --tone: var(--kd-primary, currentColor);
-  }
-  .success {
-    --tone: var(--kd-success, currentColor);
-  }
-  .warning {
-    --tone: var(--kd-warning, currentColor);
-  }
-  .error {
-    --tone: var(--kd-error, currentColor);
-  }
-  .info {
-    --tone: var(--kd-info, currentColor);
-  }
-  .primary,
-  .success,
-  .warning,
-  .error,
-  .info {
-    --tone-ink: color-mix(in srgb, var(--tone) 75%, var(--kd-text, currentColor));
-    --tone-line: color-mix(in srgb, var(--tone) 50%, transparent);
-  }
-  .neutral {
-    --tone: var(--kd-text-2, currentColor);
-    --tone-ink: var(--kd-text-2, currentColor);
-    --tone-line: var(--kd-border-strong, currentColor);
-  }
-`, ce = /^(https?:|data:image\/|\/|\.\.?\/)/i;
-function w(e, n = "icon") {
-	return e ? ce.test(e) ? t`<img class=${n} src=${e} alt="" />` : t`<span class=${n}>${e}</span>` : i;
-}
-function T(e) {
-	if (e != null && e !== "") return /^\s*(javascript|vbscript|data):/i.test(e) ? void 0 : e;
-}
-//#endregion
-//#region src/kd/elements/link.ts
-function E(e) {
-	try {
-		let t = e?.location, n = /^(.*?)\/d\/([^/?#]+)/.exec(t?.pathname ?? "");
-		return {
-			prefix: n?.[1] ?? "",
-			uid: n ? decodeURIComponent(n[2]) : void 0,
-			params: new URLSearchParams(t?.search ?? "")
-		};
-	} catch {
-		return {
-			prefix: "",
-			params: new URLSearchParams()
-		};
-	}
-}
-function D(e, t) {
-	if (!e.dashboard) return T(e.href);
-	let n = E(t), r = e.dashboard.indexOf("?"), i = r < 0 ? e.dashboard : e.dashboard.slice(0, r), a = new URLSearchParams(r < 0 ? "" : e.dashboard.slice(r + 1));
-	for (let [t, n] of Object.entries(e.vars ?? {})) {
-		if (n == null) continue;
-		let e = t.startsWith("var-") ? t : `var-${t}`;
-		a.delete(e);
-		for (let t of Array.isArray(n) ? n : [n]) a.append(e, String(t));
-	}
-	for (let e of ["from", "to"]) {
-		let t = n.params.get(e);
-		t !== null && !a.has(e) && a.set(e, t);
-	}
-	if (e.back && n.uid) {
-		let e = new URLSearchParams([...n.params].filter(([e]) => e.startsWith("var-"))).toString();
-		a.set("var-back", e ? `${n.uid}?${e}` : n.uid);
-	}
-	let o = a.toString();
-	return `${n.prefix}/d/${i}${o ? `?${o}` : ""}`;
-}
-var O = /* @__PURE__ */ new WeakMap();
-function k(e) {
-	e && !O.has(e) && e.System?.import && (O.set(e, null), e.System.import("@grafana/runtime").then((t) => O.set(e, t), () => {}));
-}
-function A(e, t, n) {
-	if (!e || n.defaultPrevented || n.button !== 0 || n.metaKey || n.ctrlKey || n.shiftKey || n.altKey) return;
-	let r = O.get(e)?.locationService;
-	if (!r) return;
-	let i = new URL(t, e.location.href);
-	if (i.origin !== e.location.origin) return;
-	let { prefix: a } = E(e), o = a && i.pathname.startsWith(a) ? i.pathname.slice(a.length) : i.pathname;
-	n.preventDefault(), r.push(o + i.search + i.hash);
-}
-var j = class extends s {
-	static properties = {
-		data: {
-			attribute: "data",
-			converter: a
-		},
-		dashboard: {},
-		href: {},
-		vars: { converter: a },
-		text: {},
-		icon: {},
-		back: { type: Boolean }
-	};
-	static styles = [r, n`
-      :host {
-        display: inline;
-      }
-      /* One line: a long name ends in an ellipsis with the full text on hover.
-         A table caps links with --kd-link-max, since 100% means nothing to an
-         auto-layout column. */
-      a,
-      span.link {
-        display: inline-flex;
-        align-items: baseline;
-        max-width: var(--kd-link-max, 100%);
-        min-width: 0;
-        vertical-align: bottom;
-      }
-      .text {
-        min-width: 0;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-      }
-      a {
-        color: var(--kd-link, inherit);
-        text-decoration: none;
-      }
-      a:hover {
-        text-decoration: underline;
-      }
-      .icon {
-        width: 16px;
-        height: 16px;
-        margin-right: 4px;
-        vertical-align: -3px;
-      }
-    `];
-	get link() {
-		let e = this.data ?? {};
-		return {
-			dashboard: e.dashboard ?? this.dashboard,
-			href: e.href ?? this.href,
-			vars: e.vars ?? this.vars,
-			text: e.text ?? this.text,
-			icon: e.icon ?? this.icon,
-			title: e.title,
-			back: e.back ?? this.back
-		};
-	}
-	connectedCallback() {
-		super.connectedCallback(), k(this.ownerDocument?.defaultView);
-	}
-	#e = () => this.requestUpdate();
-	#t = (e) => {
-		let t = this.ownerDocument?.defaultView, n = D(this.link, t);
-		n !== void 0 && (e.currentTarget.setAttribute("href", n), A(t, n, e));
-	};
-	render() {
-		let e = this.link, n = D(e, this.ownerDocument?.defaultView), r = t`${w(e.icon)}<span class="text" title=${d(e.text)}
-      ><slot>${e.text ?? ""}</slot></span
-    >`, i = e.title ?? e.text;
-		return n === void 0 ? t`<span class="link" title=${d(i)}>${r}</span>` : t`<a
-      href=${n}
-      title=${d(i)}
-      @click=${this.#t}
-      @mouseenter=${this.#e}
-      @focus=${this.#e}
-      >${r}</a
-    >`;
-	}
-};
-c("kd-link", j);
-//#endregion
-//#region src/kd/elements/pill.ts
-var M = class extends s {
-	static properties = { tone: {} };
-	static styles = [
-		r,
-		C,
-		n`
-      :host {
-        display: inline-block;
-        margin: 1px 4px 1px 0;
-        vertical-align: baseline;
-      }
-      span {
-        display: inline-block;
-        padding: 0 8px;
-        border: 1px solid var(--tone-line);
-        border-radius: 10px;
-        background: color-mix(in srgb, var(--tone) 14%, transparent);
-        color: var(--tone-ink);
-        font-size: 11px;
-        line-height: 18px;
-        white-space: nowrap;
-      }
-    `
-	];
-	render() {
-		return t`<span class=${S(this.tone)}><slot></slot></span>`;
-	}
-};
-c("kd-pill", M);
-//#endregion
-//#region src/kd/cell.ts
-function N(e) {
-	return e == null || e === "" || Array.isArray(e) && e.every(N);
-}
-function P(e) {
-	return e == null ? i : Array.isArray(e) ? t`<span class="cells">${e.filter((e) => !N(e)).map((e) => t`<span>${P(e)}</span>`)}</span>` : typeof e == "object" ? "dashboard" in e || "href" in e ? t`<kd-link .data=${e}></kd-link>` : "data" in e ? t`<kd-data .data=${e.data}></kd-data>` : "code" in e ? t`<code>${String(e.code)}</code>` : "text" in e ? t`<kd-pill tone=${d(e.tone)} title=${d(e.title)}>${String(e.text)}</kd-pill>` : t`<kd-data .data=${e}></kd-data>` : String(e);
-}
-var F = n`
-  .cells {
-    display: inline-flex;
-    flex-wrap: wrap;
-    align-items: baseline;
-    gap: 2px 6px;
-  }
-  code {
-    font-family: var(--kd-font-mono, monospace);
-    font-size: 12px;
-    overflow-wrap: anywhere;
-  }
-`, I = class extends s {
-	static properties = { data: {
-		attribute: "data",
-		converter: a
-	} };
-	static styles = [
-		r,
-		F,
-		n`
-      .bar {
-        display: flex;
-        flex-wrap: wrap;
-        align-items: center;
-        gap: 8px 16px;
-        padding: 0 4px;
-      }
-      img.icon {
-        width: 42px;
-        height: 42px;
-      }
-      span.icon {
-        font-size: 34px;
-        line-height: 1;
-      }
-      .eyebrow {
-        color: var(--kd-text-2, inherit);
-        font-size: 11px;
-        letter-spacing: 0.1em;
-        text-transform: uppercase;
-      }
-      .title {
-        font-size: 22px;
-        font-weight: 500;
-        line-height: 1.2;
-        overflow-wrap: anywhere;
-      }
-      .grow {
-        flex: 1;
-      }
-      .chain {
-        font-size: 13px;
-      }
-      .sep {
-        margin: 0 6px;
-        color: var(--kd-text-dim, inherit);
-      }
-    `
-	];
-	render() {
-		let e = this.data;
-		if (!e) return i;
-		let n = (e.chips ?? []).filter((e) => !N(e)), r = (e.chain ?? []).filter((e) => !N(e));
-		return t`<div class="bar">
-      ${w(e.icon)}
-      <div class="id">
-        ${N(e.eyebrow) ? i : t`<div class="eyebrow">${P(e.eyebrow)}</div>`}
-        <div class="title">${e.title ?? ""}</div>
-      </div>
-      ${n.length ? t`<div class="chips">${n.map((e) => P(e))}</div>` : i}
-      <div class="grow"></div>
-      ${r.length ? t`<nav class="chain">
-            ${r.map((e, n) => t`${n ? t`<span class="sep">›</span>` : i}${P(e)}`)}
-          </nav>` : i}
-    </div>`;
-	}
-};
-c("kd-bar", I);
-//#endregion
-//#region src/kd/elements/groups.ts
-function le(e) {
-	let t = /* @__PURE__ */ new Map();
-	for (let [n, r] of Object.entries(e)) {
-		let e = n.indexOf("/"), i = e < 0 ? "" : n.slice(0, e), a = r == null ? "" : typeof r == "string" ? r : JSON.stringify(r), o = t.get(i);
-		o || t.set(i, o = {
-			prefix: i,
-			entries: []
-		}), o.entries.push({
-			key: n,
-			name: n.slice(e + 1),
-			value: a
-		});
-	}
-	return [...t.values()].sort((e, t) => e.prefix < t.prefix ? -1 : +(e.prefix > t.prefix));
-}
-function L(e) {
-	if (/^\s*[[{]/.test(e)) try {
-		let t = JSON.parse(e);
-		return typeof t == "object" && t ? t : void 0;
-	} catch {
-		return;
-	}
-}
-var R = 600, z = class extends s {
-	static properties = {
-		data: {
-			attribute: "data",
-			converter: a
-		},
-		mode: {}
-	};
-	static styles = [r, n`
-      .group + .group {
-        margin-top: 12px;
-      }
-      div.head,
-      tr.head td {
-        padding-bottom: 3px;
-        border-bottom: 1px solid var(--kd-border, transparent);
-        color: var(--kd-text-2, inherit);
-        font-family: var(--kd-font-mono, monospace);
-        font-size: 11px;
-      }
-      div.head {
-        margin-bottom: 6px;
-      }
-      table {
-        width: 100%;
-        border-collapse: collapse;
-        font-size: 13px;
-      }
-      td {
-        padding: 2px 12px 2px 0;
-        vertical-align: top;
-      }
-      tr.head td {
-        padding-top: 12px;
-      }
-      tr.head:first-child td {
-        padding-top: 0;
-      }
-      tr.head + tr td {
-        padding-top: 6px;
-      }
-      .k {
-        white-space: nowrap;
-      }
-      code {
-        font-family: var(--kd-font-mono, monospace);
-        font-size: 12px;
-      }
-      .twig {
-        margin: 0 8px 0 4px;
-        color: var(--kd-text-dim, inherit);
-        font-family: var(--kd-font-mono, monospace);
-      }
-      .v {
-        width: 100%;
-        color: color-mix(in srgb, var(--kd-success, currentColor) 70%, var(--kd-text, currentColor));
-        font-family: var(--kd-font-mono, monospace);
-        font-size: 12px;
-        overflow-wrap: anywhere;
-        word-break: break-word;
-      }
-      .none {
-        padding: 8px 0;
-        color: var(--kd-text-dim, inherit);
-      }
-    `];
-	render() {
-		let e = this.data;
-		if (!e || typeof e != "object") return i;
-		let n = le(e);
-		return n.length ? this.mode === "tree" ? this.#t(n) : this.#e(n) : t`<div class="none">none</div>`;
-	}
-	#e(e) {
-		return e.map((e) => t`<div class="group">
-        ${e.prefix ? t`<div class="head">${e.prefix}</div>` : i}
-        <div>
-          ${e.entries.map((e) => t`<kd-pill tone="info" title=${e.key}>${e.value === "" ? e.name : `${e.name}=${e.value}`}</kd-pill>`)}
-        </div>
-      </div>`);
-	}
-	#t(e) {
-		return t`<table>
-      <tbody>
-        ${e.map((e) => t`${e.prefix ? t`<tr class="head"><td colspan="2">${e.prefix}</td></tr>` : i}
-          ${e.entries.map((n, r) => {
-			let a = L(n.value);
-			return t`<tr>
-              <td class="k">
-                ${e.prefix ? t`<span class="twig">${r === e.entries.length - 1 ? "└" : "├"}</span>` : i}<code
-                  >${n.name}</code
-                >
-              </td>
-              <td class="v">
-                ${a ? t`<kd-data .data=${a}></kd-data>` : n.value.length > R ? `${n.value.slice(0, R)} …` : n.value}
-              </td>
-            </tr>`;
-		})}`)}
-      </tbody>
-    </table>`;
-	}
-};
-c("kd-groups", z);
-//#endregion
-//#region src/kd/elements/mask.ts
-var B = class extends s {
-	static properties = {
-		value: {},
-		shown: { state: !0 }
-	};
-	static styles = [r, n`
-      :host {
-        display: inline-block;
-      }
-      button {
-        padding: 0;
-        border: none;
-        background: none;
-        color: inherit;
-        font: inherit;
-        cursor: pointer;
-      }
-      .dots {
-        color: var(--kd-text-2, inherit);
-        letter-spacing: 0.1em;
-      }
-      code {
-        font-family: var(--kd-font-mono, monospace);
-        font-size: 12px;
-        overflow-wrap: anywhere;
-        white-space: pre-wrap;
-        user-select: all;
-      }
-      .hide {
-        margin-left: 6px;
-        color: var(--kd-text-dim, inherit);
-      }
-    `];
-	constructor() {
-		super(), this.shown = !1;
-	}
-	willUpdate(e) {
-		e.has("value") && e.get("value") !== void 0 && (this.shown = !1);
-	}
-	render() {
-		return this.shown ? t`<code>${this.value ?? ""}</code
-      ><button type="button" class="hide" aria-label="hide" @click=${() => this.shown = !1}>×</button>` : t`<button type="button" aria-label="show" @click=${() => this.shown = !0}>
-        <span class="dots">••••••••</span>
-      </button>`;
-	}
-};
-c("kd-mask", B);
-//#endregion
-//#region node_modules/lit-html/directive.js
-var V = {
-	ATTRIBUTE: 1,
-	CHILD: 2,
-	PROPERTY: 3,
-	BOOLEAN_ATTRIBUTE: 4,
-	EVENT: 5,
-	ELEMENT: 6
-}, H = (e) => (...t) => ({
-	_$litDirective$: e,
-	values: t
-}), U = class {
-	constructor(e) {}
-	get _$AU() {
-		return this._$AM._$AU;
-	}
-	_$AT(e, t, n) {
-		this._$Ct = e, this._$AM = t, this._$Ci = n;
-	}
-	_$AS(e, t) {
-		return this.update(e, t);
-	}
-	update(e, t) {
-		return this.render(...t);
-	}
-}, W = "important", ue = " !" + W, G = H(class extends U {
-	constructor(e) {
-		if (super(e), e.type !== V.ATTRIBUTE || e.name !== "style" || e.strings?.length > 2) throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.");
-	}
-	render(e) {
-		return Object.keys(e).reduce((t, n) => {
-			let r = e[n];
-			return r == null ? t : t + `${n = n.includes("-") ? n : n.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g, "-$&").toLowerCase()}:${r};`;
-		}, "");
-	}
-	update(e, [t]) {
-		let { style: n } = e.element;
-		if (this.ft === void 0) return this.ft = new Set(Object.keys(t)), this.render(t);
-		for (let e of this.ft) t[e] ?? (this.ft.delete(e), e.includes("-") ? n.removeProperty(e) : n[e] = null);
-		for (let e in t) {
-			let r = t[e];
-			if (r != null) {
-				this.ft.add(e);
-				let t = typeof r == "string" && r.endsWith(ue);
-				e.includes("-") || t ? n.setProperty(e, t ? r.slice(0, -11) : r, t ? W : "") : n[e] = r;
-			}
-		}
-		return o;
-	}
-}), K = (e) => new Intl.NumberFormat(void 0, { maximumFractionDigits: 2 }).format(e), q = class extends s {
-	static properties = { data: {
-		attribute: "data",
-		converter: a
-	} };
-	static styles = [
-		r,
-		C,
-		n`
-      .track {
-        position: relative;
-        height: 8px;
-        margin: 6px 0;
-        border-radius: 4px;
-        background: color-mix(in srgb, var(--kd-border-strong, currentColor) 35%, transparent);
-      }
-      .fill {
-        height: 100%;
-        border-radius: 4px;
-        background: var(--tone);
-      }
-      .mark {
-        position: absolute;
-        top: -3px;
-        bottom: -3px;
-        width: 2px;
-        background: var(--tone);
-        box-shadow: 0 0 0 1px var(--kd-bg, transparent);
-      }
-      .legend {
-        display: flex;
-        flex-wrap: wrap;
-        gap: 2px 20px;
-        font-size: 12px;
-      }
-      .value {
-        font-family: var(--kd-font-mono, monospace);
-        font-size: 14px;
-      }
-      .legend .mark-label {
-        color: var(--kd-text-2, inherit);
-      }
-      .legend .num {
-        color: var(--tone-ink);
-        font-family: var(--kd-font-mono, monospace);
-      }
-      .none {
-        color: var(--kd-text-dim, inherit);
-      }
-    `
-	];
-	render() {
-		let e = this.data;
-		if (!e || typeof e != "object") return i;
-		let n = typeof e.value == "number" && Number.isFinite(e.value) ? e.value : void 0, r = (e.marks ?? []).filter((e) => e && Number.isFinite(e.value)), a = e.unit ?? "", o = Math.max(n ?? 0, ...r.map((e) => e.value)), s = typeof e.max == "number" && e.max > 0 ? e.max : o > 0 ? o : 1, c = (e) => Math.min(1, Math.max(0, e)), l = (e) => `${Math.min(100, Math.max(0, e / s * 100))}%`, u = S((n === void 0 ? [] : r.filter((e) => e.tone && n >= e.value)).sort((e, t) => t.value - e.value)[0]?.tone, "primary");
-		return t`<div
-      role="meter"
-      aria-valuemin="0"
-      aria-valuemax=${s}
-      aria-valuenow=${n ?? i}
-    >
-      <div class="track">
-        ${n === void 0 ? i : t`<div class="fill ${u}" style=${G({ width: l(n) })}></div>`}
-        ${r.map((e) => t`<div
-              class="mark ${S(e.tone)}"
-              style=${G({ left: `calc(${l(e.value)} - ${c(e.value / s) * 2}px)` })}
-              title="${e.label} ${K(e.value)}${a}"
-            ></div>`)}
-      </div>
-      <div class="legend">
-        <span class="value ${n === void 0 ? "none" : ""}">${n === void 0 ? "–" : `${K(n)}${a}`}</span>
-        ${r.map((e) => t`<span class=${S(e.tone)}
-              ><span class="mark-label">${e.label}</span> <span class="num">${K(e.value)}${a}</span></span
-            >`)}
-      </div>
-    </div>`;
-	}
-};
-c("kd-meter", q);
-//#endregion
-//#region src/kd/elements/sheet.ts
-var J = class extends s {
-	static properties = { data: {
-		attribute: "data",
-		converter: a
-	} };
-	static styles = [
-		r,
-		F,
-		n`
-      dl {
-        display: grid;
-        grid-template-columns: max-content minmax(0, 1fr);
-        margin: 0;
-        font-size: 13px;
-      }
-      dt,
-      dd {
-        margin: 0;
-        padding: 5px 12px 5px 0;
-        border-bottom: 1px solid var(--kd-border, transparent);
-      }
-      dt {
-        color: var(--kd-text-2, inherit);
-      }
-      dd {
-        overflow-wrap: anywhere;
-      }
-    `
-	];
-	render() {
-		let e = this.data;
-		if (!e || typeof e != "object") return i;
-		let n = Array.isArray(e) ? e : Object.entries(e).map(([e, t]) => ({
-			key: e,
-			value: t
-		}));
-		return t`<dl>
-      ${n.filter((e) => e && !N(e.value)).map((e) => t`<dt>${e.key}</dt><dd>${P(e.value)}</dd>`)}
-    </dl>`;
-	}
-};
-c("kd-sheet", J);
-//#endregion
-//#region src/kd/elements/steps.ts
-var de = {
-	done: "success",
-	active: "primary",
-	failed: "error",
-	pending: "neutral"
-};
-function fe(e, t) {
-	return e === "success" ? "✓" : e === "error" ? "✗" : e === "warning" ? "!" : String(t);
-}
-var Y = class extends s {
-	static properties = { data: {
-		attribute: "data",
-		converter: a
-	} };
-	static styles = [
-		r,
-		C,
-		n`
-      ol {
-        display: flex;
-        margin: 0;
-        padding: 0;
-        list-style: none;
-      }
-      li {
-        position: relative;
-        flex: 1;
-        min-width: 0;
-        text-align: center;
-      }
-      li + li::before {
-        content: '';
-        position: absolute;
-        top: 12px;
-        right: 50%;
-        width: 100%;
-        height: 2px;
-        background: var(--kd-border-strong, currentColor);
-        opacity: 0.6;
-      }
-      li.reached::before {
-        background: var(--tone);
-        opacity: 1;
-      }
-      .dot {
-        position: relative;
-        z-index: 1;
-        width: 26px;
-        height: 26px;
-        margin: 0 auto;
-        border-radius: 50%;
-        background: var(--tone);
-        color: var(--kd-bg, inherit);
-        font-size: 13px;
-        font-weight: 700;
-        line-height: 26px;
-      }
-      .neutral .dot {
-        border: 2px solid var(--tone-line);
-        background: var(--kd-bg, transparent);
-        color: var(--kd-text-2, inherit);
-        line-height: 22px;
-      }
-      .active .dot {
-        box-shadow: 0 0 0 3px color-mix(in srgb, var(--tone) 30%, transparent);
-      }
-      .label {
-        margin-top: 4px;
-        font-size: 12px;
-      }
-      .time,
-      .detail {
-        color: var(--kd-text-2, inherit);
-        font-size: 11px;
-      }
-      .detail {
-        display: -webkit-box;
-        overflow: hidden;
-        -webkit-box-orient: vertical;
-        -webkit-line-clamp: 2;
-        overflow-wrap: anywhere;
-      }
-    `
-	];
-	render() {
-		let e = Array.isArray(this.data) ? this.data : [];
-		return e.length ? t`<ol>
-      ${e.map((e, n) => {
-			let r = S(de[e.status] ?? e.status), a = `${r}${e.status === "done" || e.status === "success" ? " reached" : ""}${e.status === "active" ? " active" : ""}`;
-			return t`<li class=${a} title=${d(e.detail)}>
-          <div class="dot">${fe(r, n + 1)}</div>
-          <div class="label">${e.label}</div>
-          ${e.time ? t`<div class="time">${e.time}</div>` : i}
-          ${e.detail ? t`<div class="detail">${e.detail}</div>` : i}
-        </li>`;
-		})}
-    </ol>` : i;
-	}
-};
-c("kd-steps", Y);
-//#endregion
-//#region src/kd/elements/table.ts
-var X = class extends s {
-	static properties = {
-		data: {
-			attribute: "data",
-			converter: a
-		},
-		empty: {}
-	};
-	static styles = [
-		r,
-		F,
-		n`
-      table {
-        width: 100%;
-        border-collapse: collapse;
-        font-size: 13px;
-      }
-      th,
-      td {
-        padding: 6px 12px 6px 0;
-        border-bottom: 1px solid var(--kd-border, transparent);
-        text-align: left;
-        vertical-align: top;
-      }
-      th {
-        color: var(--kd-text-2, inherit);
-        font-size: 10px;
-        font-weight: 500;
-        letter-spacing: 0.08em;
-        text-transform: uppercase;
-      }
-      .center {
-        text-align: center;
-      }
-      .right {
-        text-align: right;
-      }
-      /* Prose breaks anywhere so one hash in a message cannot widen the table;
-         links keep whole words and stop at 40ch with an ellipsis instead. */
-      td {
-        --kd-link-max: 40ch;
-        overflow-wrap: anywhere;
-      }
-      .nowrap {
-        white-space: nowrap;
-      }
-      .nowrap .cells {
-        flex-wrap: nowrap;
-      }
-      .none {
-        padding: 8px 0;
-        color: var(--kd-text-dim, inherit);
-      }
-    `
-	];
-	render() {
-		let e = this.data;
-		if (!e || typeof e != "object") return i;
-		let { columns: n, rows: r = [] } = Array.isArray(e) ? {
-			columns: void 0,
-			rows: e
-		} : e;
-		if (!r.length) return t`<div class="none">${this.empty ?? "none"}</div>`;
-		let a = n ?? [...new Set(r.flatMap((e) => Object.keys(e ?? {})))].map((e) => ({ key: e })), o = (e) => e.align === "right" || e.align === "center" ? e.align : "", s = (e) => [o(e), e.nowrap ? "nowrap" : ""].filter(Boolean).join(" ");
-		return t`<table>
-      <thead>
-        <tr>
-          ${a.map((e) => t`<th class=${o(e)}>${e.label ?? e.key}</th>`)}
-        </tr>
-      </thead>
-      <tbody>
-        ${r.map((e) => t`<tr>
-            ${a.map((n) => t`<td class=${s(n)}>${P(e?.[n.key])}</td>`)}
-          </tr>`)}
-      </tbody>
-    </table>`;
-	}
-};
-c("kd-table", X);
-//#endregion
-//#region src/kd/elements/tabs.ts
-var Z = (e, t) => e.getAttribute("label") || `Tab ${t + 1}`, Q = class extends s {
-	static properties = {
-		selected: {},
-		key: {}
-	};
-	static shadowRootOptions = {
-		...e.shadowRootOptions,
-		slotAssignment: "manual"
-	};
-	static styles = [r, n`
-      [role='tablist'] {
-        display: flex;
-        flex-wrap: wrap;
-        gap: 0 22px;
-        margin-bottom: 10px;
-        border-bottom: 1px solid var(--kd-border, transparent);
-      }
-      button {
-        margin: 0 0 -1px;
-        padding: 6px 1px;
-        border: none;
-        border-bottom: 2px solid transparent;
-        background: none;
-        color: var(--kd-text-2, inherit);
-        font: inherit;
-        font-size: 13px;
-        cursor: pointer;
-      }
-      button:hover {
-        color: var(--kd-text, inherit);
-      }
-      /* Grafana's own active tab is underlined in this orange. */
-      button[aria-selected='true'] {
-        border-bottom-color: var(--kd-warning, currentColor);
-        color: var(--kd-text, inherit);
-      }
-      .count {
-        margin-left: 2px;
-        color: var(--kd-text-dim, inherit);
-        font-size: 11px;
-      }
-    `];
-	#e;
-	connectedCallback() {
-		super.connectedCallback(), this.#e ??= new MutationObserver(() => this.requestUpdate()), this.#e.observe(this, {
-			childList: !0,
-			subtree: !0,
-			attributes: !0,
-			attributeFilter: ["label", "count"]
-		});
-	}
-	disconnectedCallback() {
-		super.disconnectedCallback(), this.#e?.disconnect();
-	}
-	get #t() {
-		try {
-			return this.ownerDocument?.defaultView?.sessionStorage ?? void 0;
-		} catch {
-			return;
-		}
-	}
-	willUpdate(e) {
-		if (e.has("key") && this.key) try {
-			let e = this.#t?.getItem(`kd-tabs:${this.key}`);
-			e != null && (this.selected = e);
-		} catch {}
-	}
-	#n() {
-		return [...this.children];
-	}
-	#r(e) {
-		let t = this.selected;
-		if (t == null || t === "") return 0;
-		let n = e.findIndex((e, n) => Z(e, n) === t);
-		if (n >= 0) return n;
-		let r = Number(t);
-		return Number.isInteger(r) && r >= 0 && r < e.length ? r : 0;
-	}
-	#i(e, t) {
-		let n = Z(e[t], t);
-		if (this.key) try {
-			this.#t?.setItem(`kd-tabs:${this.key}`, n);
-		} catch {}
-		n !== this.selected && (this.selected = n, this.dispatchEvent(new CustomEvent("change", {
-			detail: {
-				label: n,
-				index: t
-			},
-			bubbles: !0,
-			composed: !0
-		})));
-	}
-	render() {
-		let e = this.#n();
-		if (!e.length) return i;
-		let n = this.#r(e);
-		return t`<div role="tablist">
-        ${e.map((r, a) => {
-			let o = r.getAttribute("count");
-			return t`<button
-            type="button"
-            role="tab"
-            aria-selected=${a === n ? "true" : "false"}
-            @click=${() => this.#i(e, a)}
-          >
-            ${Z(r, a)}${o ? t`<span class="count">${o}</span>` : i}
-          </button>`;
-		})}
-      </div>
-      ${e.map((e, r) => t`<div role="tabpanel" ?hidden=${r !== n}><slot></slot></div>`)}`;
-	}
-	updated() {
-		let e = this.renderRoot.querySelectorAll("slot");
-		this.#n().forEach((t, n) => e[n]?.assign(t));
-	}
-};
-c("kd-tabs", Q);
-//#endregion
-//#region src/kd/elements/tile.ts
-var $ = class extends s {
-	static properties = {
-		icon: {},
-		label: {},
-		href: {}
-	};
-	static styles = [r, n`
-      a,
-      div {
-        display: block;
-        padding-top: 6px;
-        color: inherit;
-        text-align: center;
-        text-decoration: none;
-      }
-      .icon {
-        display: block;
-        height: 30px;
-        margin: 0 auto;
-        font-size: 30px;
-        line-height: 1;
-      }
-      .label {
-        display: block;
-        margin-top: 6px;
-        color: var(--kd-text-2, inherit);
-        font-size: 12px;
-      }
-    `];
-	render() {
-		let e = t`${w(this.icon)}<span class="label">${this.label ?? ""}</span>`, n = T(this.href);
-		if (!n) return t`<div>${e}</div>`;
-		let r = /^https?:/i.test(n);
-		return t`<a
-      href=${n}
-      target=${d(r ? "_blank" : void 0)}
-      rel=${d(r ? "noopener" : void 0)}
-      >${e}</a
-    >`;
-	}
-};
-c("kd-tile", $);
-//#endregion
-export { b as C, u as E, m as S, l as T, w as _, J as a, C as b, z as c, F as d, N as f, D as g, j as h, Y as i, L as l, M as m, Q as n, q as o, P as p, X as r, B as s, $ as t, I as u, T as v, y as w, x, S as y };
-
-//# sourceMappingURL=kd-Bbw0GeQ5.js.map