northline 0.1.0

package/dist/index.js

@@ -0,0 +1,2769 @@
+import { Fragment as e, jsx as t, jsxs as n } from "react/jsx-runtime";
+import { Component as r, createContext as i, useCallback as a, useContext as o, useEffect as s, useId as c, useMemo as l, useRef as u, useState as d } from "react";
+import { createPortal as f } from "react-dom";
+import { Chart as p, registerables as m } from "chart.js";
+import h from "chartjs-plugin-datalabels";
+//#region src/components/Sparkline.tsx
+function g({ data: e, color: n = "#8FB4F5", height: r = 36 }) {
+	if (!e || e.length < 2) return null;
+	let i = Math.min(...e), a = Math.max(...e) - i || 1, o = e.map((t, n) => [n / (e.length - 1) * 200, 4 + (1 - (t - i) / a) * (r - 8)]).map(([e, t], n) => `${n === 0 ? "M" : "L"}${e.toFixed(1)},${t.toFixed(1)}`).join(" ");
+	return /* @__PURE__ */ t("svg", {
+		className: "score-card__sparkline",
+		viewBox: `0 0 200 ${r}`,
+		preserveAspectRatio: "none",
+		children: /* @__PURE__ */ t("path", {
+			d: o,
+			fill: "none",
+			stroke: n,
+			strokeWidth: "1.75",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+//#endregion
+//#region src/components/ScoreCard.tsx
+function _({ label: e, value: r, accent: i, sub: a, direction: o, trend: s }) {
+	return /* @__PURE__ */ n("div", {
+		className: `score-card score-card--${i}`,
+		children: [
+			/* @__PURE__ */ t("span", {
+				className: "score-card__label",
+				children: e
+			}),
+			/* @__PURE__ */ t("span", {
+				className: "score-card__value",
+				children: r
+			}),
+			a && /* @__PURE__ */ t("span", {
+				className: `score-card__sub${o ? ` score-card__sub--${o}` : ""}`,
+				children: a
+			}),
+			s && /* @__PURE__ */ t(g, {
+				data: s,
+				color: "var(--accent)"
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/Icon.tsx
+var v = {
+	close: /* @__PURE__ */ t("path", { d: "M6 6L18 18M18 6L6 18" }),
+	check: /* @__PURE__ */ t("path", { d: "M5 12.5L9.5 17L19 7" }),
+	"chevron-left": /* @__PURE__ */ t("path", { d: "M15 6L9 12L15 18" }),
+	"chevron-right": /* @__PURE__ */ t("path", { d: "M9 6L15 12L9 18" }),
+	kebab: /* @__PURE__ */ n(e, { children: [
+		/* @__PURE__ */ t("circle", {
+			cx: "12",
+			cy: "5",
+			r: "1.5",
+			fill: "currentColor",
+			stroke: "none"
+		}),
+		/* @__PURE__ */ t("circle", {
+			cx: "12",
+			cy: "12",
+			r: "1.5",
+			fill: "currentColor",
+			stroke: "none"
+		}),
+		/* @__PURE__ */ t("circle", {
+			cx: "12",
+			cy: "19",
+			r: "1.5",
+			fill: "currentColor",
+			stroke: "none"
+		})
+	] }),
+	"drag-handle": /* @__PURE__ */ n(e, { children: [
+		/* @__PURE__ */ t("circle", {
+			cx: "9",
+			cy: "6",
+			r: "1.3",
+			fill: "currentColor",
+			stroke: "none"
+		}),
+		/* @__PURE__ */ t("circle", {
+			cx: "15",
+			cy: "6",
+			r: "1.3",
+			fill: "currentColor",
+			stroke: "none"
+		}),
+		/* @__PURE__ */ t("circle", {
+			cx: "9",
+			cy: "12",
+			r: "1.3",
+			fill: "currentColor",
+			stroke: "none"
+		}),
+		/* @__PURE__ */ t("circle", {
+			cx: "15",
+			cy: "12",
+			r: "1.3",
+			fill: "currentColor",
+			stroke: "none"
+		}),
+		/* @__PURE__ */ t("circle", {
+			cx: "9",
+			cy: "18",
+			r: "1.3",
+			fill: "currentColor",
+			stroke: "none"
+		}),
+		/* @__PURE__ */ t("circle", {
+			cx: "15",
+			cy: "18",
+			r: "1.3",
+			fill: "currentColor",
+			stroke: "none"
+		})
+	] }),
+	copy: /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t("rect", {
+		x: "8",
+		y: "8",
+		width: "12",
+		height: "12",
+		rx: "2"
+	}), /* @__PURE__ */ t("path", { d: "M16 8V6a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h2" })] }),
+	trash: /* @__PURE__ */ n(e, { children: [
+		/* @__PURE__ */ t("path", { d: "M5 7h14" }),
+		/* @__PURE__ */ t("path", { d: "M10 11v6M14 11v6" }),
+		/* @__PURE__ */ t("path", { d: "M6 7l1 12a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2l1-12" }),
+		/* @__PURE__ */ t("path", { d: "M9 7V5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v2" })
+	] }),
+	plus: /* @__PURE__ */ t("path", { d: "M12 5V19M5 12H19" }),
+	minus: /* @__PURE__ */ t("path", { d: "M5 12H19" }),
+	upload: /* @__PURE__ */ n(e, { children: [
+		/* @__PURE__ */ t("path", { d: "M12 4V15" }),
+		/* @__PURE__ */ t("path", { d: "M7 9L12 4L17 9" }),
+		/* @__PURE__ */ t("path", { d: "M5 16v2a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-2" })
+	] }),
+	star: /* @__PURE__ */ t("path", {
+		d: "M12 3l2.6 5.8 6.2.6-4.7 4.2 1.4 6.2L12 16.9 6.5 19.8l1.4-6.2L3.2 9.4l6.2-.6L12 3z",
+		strokeLinejoin: "round"
+	}),
+	info: /* @__PURE__ */ n(e, { children: [
+		/* @__PURE__ */ t("circle", {
+			cx: "12",
+			cy: "12",
+			r: "9"
+		}),
+		/* @__PURE__ */ t("path", { d: "M12 11v5" }),
+		/* @__PURE__ */ t("circle", {
+			cx: "12",
+			cy: "8",
+			r: "0.5",
+			fill: "currentColor"
+		})
+	] }),
+	warning: /* @__PURE__ */ n(e, { children: [
+		/* @__PURE__ */ t("path", {
+			d: "M12 3L22 20H2L12 3z",
+			strokeLinejoin: "round"
+		}),
+		/* @__PURE__ */ t("path", { d: "M12 10v4" }),
+		/* @__PURE__ */ t("circle", {
+			cx: "12",
+			cy: "17",
+			r: "0.5",
+			fill: "currentColor"
+		})
+	] }),
+	settings: /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t("circle", {
+		cx: "12",
+		cy: "12",
+		r: "3"
+	}), /* @__PURE__ */ t("path", { d: "M19 12a7 7 0 0 0-.1-1.2l2-1.6-2-3.4-2.4 1a7 7 0 0 0-2-1.2L14 3h-4l-.5 2.6a7 7 0 0 0-2 1.2l-2.4-1-2 3.4 2 1.6A7 7 0 0 0 5 12a7 7 0 0 0 .1 1.2l-2 1.6 2 3.4 2.4-1a7 7 0 0 0 2 1.2L10 21h4l.5-2.6a7 7 0 0 0 2-1.2l2.4 1 2-3.4-2-1.6c.067-.395.1-.796.1-1.2z" })] }),
+	inbox: /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t("path", { d: "M4 12h4l2 3h4l2-3h4" }), /* @__PURE__ */ t("path", {
+		d: "M6 5h12l2 7v6a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-6l2-7z",
+		strokeLinejoin: "round"
+	})] }),
+	search: /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t("circle", {
+		cx: "10.5",
+		cy: "10.5",
+		r: "6.5"
+	}), /* @__PURE__ */ t("path", { d: "M19.5 19.5L15 15" })] }),
+	calendar: /* @__PURE__ */ n(e, { children: [
+		/* @__PURE__ */ t("rect", {
+			x: "3.5",
+			y: "5",
+			width: "17",
+			height: "16",
+			rx: "2"
+		}),
+		/* @__PURE__ */ t("path", { d: "M3.5 10h17" }),
+		/* @__PURE__ */ t("path", { d: "M8 3v4M16 3v4" })
+	] }),
+	eye: /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t("path", {
+		d: "M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7z",
+		strokeLinejoin: "round"
+	}), /* @__PURE__ */ t("circle", {
+		cx: "12",
+		cy: "12",
+		r: "3"
+	})] }),
+	"eye-off": /* @__PURE__ */ n(e, { children: [
+		/* @__PURE__ */ t("path", { d: "M3 3l18 18" }),
+		/* @__PURE__ */ t("path", { d: "M10.6 5.2A10.6 10.6 0 0 1 12 5c6.5 0 10 7 10 7a15.6 15.6 0 0 1-3.4 4.3M6.6 6.6A15.7 15.7 0 0 0 2 12s3.5 7 10 7a10.4 10.4 0 0 0 3.4-.6" }),
+		/* @__PURE__ */ t("path", { d: "M9.9 9.9a3 3 0 0 0 4.2 4.2" })
+	] })
+};
+function y({ name: e, size: n = 16, color: r = "currentColor", filled: i = !1 }) {
+	return /* @__PURE__ */ t("svg", {
+		width: n,
+		height: n,
+		viewBox: "0 0 24 24",
+		fill: i ? r : "none",
+		stroke: r,
+		strokeWidth: 1.8,
+		strokeLinecap: "round",
+		"aria-hidden": "true",
+		focusable: "false",
+		children: v[e]
+	});
+}
+//#endregion
+//#region src/components/InfoTooltip.tsx
+function b({ text: e }) {
+	return e ? /* @__PURE__ */ n("span", {
+		className: "info-tooltip",
+		tabIndex: 0,
+		role: "note",
+		"aria-label": e,
+		children: [/* @__PURE__ */ t("span", {
+			className: "info-tooltip__icon",
+			children: /* @__PURE__ */ t(y, {
+				name: "info",
+				size: 11
+			})
+		}), /* @__PURE__ */ t("span", {
+			className: "info-tooltip__bubble",
+			children: e
+		})]
+	}) : null;
+}
+//#endregion
+//#region src/components/ChartCard.tsx
+function x({ id: e, title: r, info: i, height: a = 320, width: o, children: c, onDragStart: l, onDragOver: d, onDrop: f, onDragEnd: p, onResize: m, registerRef: h, isDragOver: g, isDragging: _, draggable: v = !0 }) {
+	let x = u(null), S = u(m);
+	return S.current = m, s(() => {
+		let t = x.current;
+		if (!t) return;
+		let n = new ResizeObserver(([n]) => {
+			if (!n) return;
+			let r = n.borderBoxSize?.[0], i = r ? r.inlineSize : t.getBoundingClientRect().width, a = r ? r.blockSize : t.getBoundingClientRect().height;
+			(i !== 0 || a !== 0) && S.current?.(e, {
+				width: Math.round(i),
+				height: Math.round(a)
+			});
+		});
+		return n.observe(t), () => n.disconnect();
+	}, [e]), /* @__PURE__ */ n("div", {
+		ref: (t) => {
+			x.current = t, h?.(e, t);
+		},
+		className: `card chart-card${g ? " chart-card--drag-over" : ""}${_ ? " chart-card--dragging" : ""}`,
+		style: {
+			height: a,
+			width: o,
+			flex: "0 0 auto"
+		},
+		draggable: v,
+		onDragStart: v && l ? (t) => l(t, e) : void 0,
+		onDragOver: v && d ? (t) => {
+			t.preventDefault(), d(e);
+		} : void 0,
+		onDrop: v && f ? (t) => {
+			t.preventDefault(), f(e);
+		} : void 0,
+		onDragEnd: v && p ? p : void 0,
+		children: [/* @__PURE__ */ n("h2", {
+			className: "chart-card__title",
+			children: [
+				v && /* @__PURE__ */ t("span", {
+					className: "chart-card__handle",
+					title: "Drag to reorder",
+					children: /* @__PURE__ */ t(y, {
+						name: "drag-handle",
+						size: 14
+					})
+				}),
+				r,
+				/* @__PURE__ */ t(b, { text: i })
+			]
+		}), /* @__PURE__ */ t("div", {
+			className: "chart-card__body",
+			children: c
+		})]
+	});
+}
+//#endregion
+//#region src/components/Select.tsx
+function S(e) {
+	let { options: r, label: i, multiple: a = !1 } = e, [o, c] = d(!1), l = u(null);
+	s(() => {
+		if (!o) return;
+		let e = (e) => {
+			l.current && !l.current.contains(e.target) && c(!1);
+		}, t = (e) => {
+			e.key === "Escape" && c(!1);
+		};
+		return document.addEventListener("mousedown", e), document.addEventListener("keydown", t), () => {
+			document.removeEventListener("mousedown", e), document.removeEventListener("keydown", t);
+		};
+	}, [o]);
+	let f = r[0]?.value, p = e.multiple ? e.value : [e.value], m = () => {
+		if (!e.multiple) return r.find((t) => t.value === e.value)?.label ?? e.value;
+		let t = e.value;
+		return !t.length || t.includes(f) ? r[0]?.label : t.length === 1 ? r.find((e) => e.value === t[0])?.label ?? t[0] : `${t.length} selected`;
+	}, h = (t) => {
+		if (!e.multiple) {
+			e.onChange(t), c(!1);
+			return;
+		}
+		if (t === f) {
+			e.onChange([f]);
+			return;
+		}
+		let n = e.value.filter((e) => e !== f), r = n.includes(t) ? n.filter((e) => e !== t) : [...n, t];
+		e.onChange(r.length ? r : [f]);
+	};
+	return /* @__PURE__ */ n("div", {
+		className: "select",
+		ref: l,
+		children: [/* @__PURE__ */ n("button", {
+			type: "button",
+			className: "select__trigger",
+			"aria-haspopup": "listbox",
+			"aria-expanded": o,
+			"aria-label": i,
+			onClick: () => c((e) => !e),
+			children: [/* @__PURE__ */ t("span", { children: m() }), /* @__PURE__ */ t("span", {
+				className: "select__chevron",
+				"aria-hidden": "true"
+			})]
+		}), o && /* @__PURE__ */ t("ul", {
+			className: "select__menu",
+			role: "listbox",
+			"aria-multiselectable": a,
+			"aria-label": i,
+			children: r.map((e) => {
+				let r = p.includes(e.value);
+				return /* @__PURE__ */ n("li", {
+					role: "option",
+					"aria-selected": r,
+					className: `select__option${r ? " select__option--selected" : ""}${a ? " select__option--multi" : ""}`,
+					onClick: () => h(e.value),
+					children: [a && /* @__PURE__ */ t("span", {
+						className: `select__checkbox${r ? " select__checkbox--checked" : ""}`,
+						"aria-hidden": "true"
+					}), e.label]
+				}, e.value);
+			})
+		})]
+	});
+}
+//#endregion
+//#region src/components/DateRangePicker.tsx
+var C = [
+	"Su",
+	"Mo",
+	"Tu",
+	"We",
+	"Th",
+	"Fr",
+	"Sa"
+], w = [
+	"January",
+	"February",
+	"March",
+	"April",
+	"May",
+	"June",
+	"July",
+	"August",
+	"September",
+	"October",
+	"November",
+	"December"
+];
+function T(e) {
+	if (!e) return null;
+	let [t, n, r] = e.split("-").map(Number);
+	return t === void 0 || n === void 0 || r === void 0 ? null : new Date(t, n - 1, r);
+}
+function E(e) {
+	return `${e.getFullYear()}-${String(e.getMonth() + 1).padStart(2, "0")}-${String(e.getDate()).padStart(2, "0")}`;
+}
+function D(e) {
+	let t = T(e);
+	return t ? `${String(t.getMonth() + 1).padStart(2, "0")}/${String(t.getDate()).padStart(2, "0")}/${t.getFullYear()}` : "";
+}
+function O({ from: e, to: r, min: i, max: a, onChange: o, label: c = "Date range" }) {
+	let [l, f] = d(!1), [p, m] = d(null), h = T(e), g = T(r), _ = T(i), v = T(a), [b, x] = d(() => h ?? /* @__PURE__ */ new Date()), S = u(null);
+	s(() => {
+		l && (x(h ?? /* @__PURE__ */ new Date()), m(null));
+	}, [l]), s(() => {
+		if (!l) return;
+		let e = (e) => {
+			S.current && !S.current.contains(e.target) && f(!1);
+		}, t = (e) => {
+			e.key === "Escape" && f(!1);
+		};
+		return document.addEventListener("mousedown", e), document.addEventListener("keydown", t), () => {
+			document.removeEventListener("mousedown", e), document.removeEventListener("keydown", t);
+		};
+	}, [l]);
+	let O = b.getFullYear(), k = b.getMonth(), A = new Date(O, k, 1).getDay(), j = new Date(O, k + 1, 0).getDate(), M = [];
+	for (let e = 0; e < A; e++) M.push(null);
+	for (let e = 1; e <= j; e++) M.push(new Date(O, k, e));
+	let ee = (e) => !!(_ && e < _ || v && e > v), N = p ?? h, P = p ? null : g, F = (e) => !!(N && e.toDateString() === N.toDateString()), I = (e) => !!(P && e.toDateString() === P.toDateString()), L = (e) => !!(N && P && e > N && e < P), R = (e) => e.toDateString() === (/* @__PURE__ */ new Date()).toDateString(), z = (e) => x(new Date(O, k + e, 1)), B = (e) => {
+		if (!p) {
+			m(e);
+			return;
+		}
+		let t = p, n = e;
+		n < t && ([t, n] = [n, t]), o(E(t), E(n)), m(null), f(!1);
+	};
+	return /* @__PURE__ */ n("div", {
+		className: "datepicker",
+		ref: S,
+		children: [/* @__PURE__ */ n("button", {
+			type: "button",
+			className: "select__trigger datepicker__trigger--range",
+			"aria-haspopup": "dialog",
+			"aria-expanded": l,
+			"aria-label": c,
+			onClick: () => f((e) => !e),
+			children: [/* @__PURE__ */ n("span", { children: [
+				D(e),
+				" – ",
+				D(r)
+			] }), /* @__PURE__ */ t("span", {
+				className: "datepicker__icon",
+				"aria-hidden": "true"
+			})]
+		}), l && /* @__PURE__ */ n("div", {
+			className: "datepicker__panel",
+			role: "dialog",
+			"aria-label": c,
+			children: [
+				/* @__PURE__ */ n("div", {
+					className: "datepicker__header",
+					children: [
+						/* @__PURE__ */ t("button", {
+							type: "button",
+							className: "datepicker__nav",
+							onClick: () => z(-1),
+							"aria-label": "Previous month",
+							children: /* @__PURE__ */ t(y, {
+								name: "chevron-left",
+								size: 14
+							})
+						}),
+						/* @__PURE__ */ n("span", {
+							className: "datepicker__title",
+							children: [
+								w[k],
+								" ",
+								O
+							]
+						}),
+						/* @__PURE__ */ t("button", {
+							type: "button",
+							className: "datepicker__nav",
+							onClick: () => z(1),
+							"aria-label": "Next month",
+							children: /* @__PURE__ */ t(y, {
+								name: "chevron-right",
+								size: 14
+							})
+						})
+					]
+				}),
+				/* @__PURE__ */ t("p", {
+					className: "datepicker__hint",
+					children: p ? "Pick the end date" : "Pick the start date"
+				}),
+				/* @__PURE__ */ t("div", {
+					className: "datepicker__weekdays",
+					children: C.map((e) => /* @__PURE__ */ t("span", { children: e }, e))
+				}),
+				/* @__PURE__ */ t("div", {
+					className: "datepicker__grid",
+					children: M.map((e, n) => e ? /* @__PURE__ */ t("button", {
+						type: "button",
+						disabled: ee(e),
+						className: [
+							"datepicker__day",
+							(F(e) || I(e)) && "datepicker__day--selected",
+							L(e) && "datepicker__day--in-range",
+							R(e) && "datepicker__day--today"
+						].filter(Boolean).join(" "),
+						onClick: () => B(e),
+						children: e.getDate()
+					}, n) : /* @__PURE__ */ t("span", {}, n))
+				})
+			]
+		})]
+	});
+}
+//#endregion
+//#region src/components/Tabs.tsx
+function k({ tabs: e, active: r, onChange: i }) {
+	return /* @__PURE__ */ t("div", {
+		className: "tabs",
+		role: "tablist",
+		children: e.map((e) => /* @__PURE__ */ n("button", {
+			role: "tab",
+			"aria-selected": r === e.id,
+			disabled: e.comingSoon,
+			className: `tab${r === e.id ? " tab--active" : ""}`,
+			onClick: () => !e.comingSoon && i(e.id),
+			children: [e.label, e.comingSoon && /* @__PURE__ */ t("span", {
+				className: "tab__badge",
+				children: "Soon"
+			})]
+		}, e.id))
+	});
+}
+//#endregion
+//#region src/components/Button.tsx
+function A({ children: e, variant: n = "primary", size: r = "md", type: i = "button", disabled: a = !1, onClick: o, ...s }) {
+	return /* @__PURE__ */ t("button", {
+		type: i,
+		disabled: a,
+		onClick: o,
+		className: `btn btn--${n}${r === "sm" ? " btn--sm" : ""}`,
+		...s,
+		children: e
+	});
+}
+//#endregion
+//#region src/components/Badge.tsx
+function j({ children: e, tone: r = "neutral", dot: i = !1 }) {
+	return /* @__PURE__ */ n("span", {
+		className: `badge${r === "neutral" ? "" : ` badge--${r}`}`,
+		children: [i && /* @__PURE__ */ t("span", {
+			className: "badge__dot",
+			"aria-hidden": "true"
+		}), e]
+	});
+}
+//#endregion
+//#region src/components/Input.tsx
+function M({ label: e, value: r, onChange: i, type: a = "text", placeholder: o, disabled: s = !1, error: l = !1, hint: u, id: d, ...f }) {
+	let p = c(), m = d ?? p;
+	return /* @__PURE__ */ n("div", {
+		className: `field${l ? " field--error" : ""}`,
+		children: [
+			e && /* @__PURE__ */ t("label", {
+				className: "field__label",
+				htmlFor: m,
+				children: e
+			}),
+			/* @__PURE__ */ t("input", {
+				id: m,
+				className: "field__input",
+				type: a,
+				value: r,
+				onChange: (e) => i?.(e.target.value),
+				placeholder: o,
+				disabled: s,
+				"aria-invalid": l || void 0,
+				...f
+			}),
+			u && /* @__PURE__ */ t("span", {
+				className: "field__hint",
+				children: u
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/Switch.tsx
+function ee({ checked: e, onChange: r, label: i, disabled: a = !1 }) {
+	let o = c();
+	return /* @__PURE__ */ n("label", {
+		htmlFor: o,
+		className: `switch${e ? " switch--checked" : ""}${a ? " switch--disabled" : ""}`,
+		children: [
+			/* @__PURE__ */ t("input", {
+				id: o,
+				type: "checkbox",
+				className: "switch__input",
+				checked: e,
+				disabled: a,
+				onChange: (e) => r?.(e.target.checked)
+			}),
+			/* @__PURE__ */ t("span", {
+				className: "switch__control",
+				"aria-hidden": "true"
+			}),
+			i && /* @__PURE__ */ t("span", {
+				className: "switch__label",
+				children: i
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/Table.tsx
+function N({ columns: e, rows: r, getRowKey: i, onRowClick: a, emptyMessage: o = "No data" }) {
+	return /* @__PURE__ */ t("div", {
+		className: "nl-table-wrap",
+		children: /* @__PURE__ */ n("table", {
+			className: `nl-table${a ? " nl-table--hoverable" : ""}`,
+			children: [/* @__PURE__ */ t("thead", { children: /* @__PURE__ */ t("tr", { children: e.map((e) => /* @__PURE__ */ t("th", {
+				"data-align": e.align,
+				children: e.header
+			}, e.key)) }) }), /* @__PURE__ */ n("tbody", { children: [r.length === 0 && /* @__PURE__ */ t("tr", { children: /* @__PURE__ */ t("td", {
+				className: "nl-table__empty",
+				colSpan: e.length,
+				children: o
+			}) }), r.map((n, r) => /* @__PURE__ */ t("tr", {
+				onClick: () => a?.(n),
+				children: e.map((e) => /* @__PURE__ */ t("td", {
+					"data-align": e.align,
+					children: e.render ? e.render(n) : n[e.key]
+				}, e.key))
+			}, i ? i(n) : r))] })]
+		})
+	});
+}
+//#endregion
+//#region src/components/Modal.tsx
+function P({ open: e, onClose: r, title: i, children: a, footer: o, size: c = "md" }) {
+	return s(() => {
+		if (!e) return;
+		let t = (e) => {
+			e.key === "Escape" && r?.();
+		};
+		return document.addEventListener("keydown", t), () => document.removeEventListener("keydown", t);
+	}, [e, r]), e ? f(/* @__PURE__ */ t("div", {
+		className: "modal-backdrop",
+		onMouseDown: () => r?.(),
+		children: /* @__PURE__ */ n("div", {
+			className: `modal modal--${c}`,
+			role: "dialog",
+			"aria-modal": "true",
+			"aria-label": typeof i == "string" ? i : void 0,
+			onMouseDown: (e) => e.stopPropagation(),
+			children: [
+				i && /* @__PURE__ */ n("div", {
+					className: "modal__header",
+					children: [/* @__PURE__ */ t("h2", {
+						className: "modal__title",
+						children: i
+					}), /* @__PURE__ */ t("button", {
+						type: "button",
+						className: "modal__close",
+						"aria-label": "Close",
+						onClick: () => r?.(),
+						children: /* @__PURE__ */ t(y, {
+							name: "close",
+							size: 16
+						})
+					})]
+				}),
+				/* @__PURE__ */ t("div", {
+					className: "modal__body",
+					children: a
+				}),
+				o && /* @__PURE__ */ t("div", {
+					className: "modal__footer",
+					children: o
+				})
+			]
+		})
+	}), document.body) : null;
+}
+//#endregion
+//#region src/components/Toast.tsx
+var F = i(null), I = 0;
+function L({ children: e }) {
+	let [r, i] = d([]), o = u(/* @__PURE__ */ new Map()), s = a((e) => {
+		i((t) => t.filter((t) => t.id !== e));
+		let t = o.current.get(e);
+		t && clearTimeout(t), o.current.delete(e);
+	}, []), c = a((e, { tone: t = "neutral", duration: n = 4e3 } = {}) => {
+		let r = I += 1;
+		if (i((n) => [...n, {
+			id: r,
+			message: e,
+			tone: t
+		}]), n > 0) {
+			let e = setTimeout(() => s(r), n);
+			o.current.set(r, e);
+		}
+		return r;
+	}, [s]);
+	return /* @__PURE__ */ n(F.Provider, {
+		value: {
+			show: c,
+			dismiss: s
+		},
+		children: [e, f(/* @__PURE__ */ t("div", {
+			className: "toast-stack",
+			role: "status",
+			"aria-live": "polite",
+			children: r.map((e) => /* @__PURE__ */ n("div", {
+				className: `toast${e.tone === "neutral" ? "" : ` toast--${e.tone}`}`,
+				children: [/* @__PURE__ */ t("span", {
+					className: "toast__message",
+					children: e.message
+				}), /* @__PURE__ */ t("button", {
+					type: "button",
+					className: "toast__close",
+					"aria-label": "Dismiss",
+					onClick: () => s(e.id),
+					children: /* @__PURE__ */ t(y, {
+						name: "close",
+						size: 14
+					})
+				})]
+			}, e.id))
+		}), document.body)]
+	});
+}
+function R() {
+	let e = o(F);
+	if (!e) throw Error("useToast must be used within a ToastProvider");
+	return e;
+}
+//#endregion
+//#region src/components/Checkbox.tsx
+function z({ checked: e, onChange: r, label: i, disabled: a = !1 }) {
+	let o = c();
+	return /* @__PURE__ */ n("label", {
+		htmlFor: o,
+		className: `checkbox${a ? " checkbox--disabled" : ""}`,
+		children: [
+			/* @__PURE__ */ t("input", {
+				id: o,
+				type: "checkbox",
+				className: "checkbox__input",
+				checked: e,
+				disabled: a,
+				onChange: (e) => r?.(e.target.checked)
+			}),
+			/* @__PURE__ */ t("span", {
+				className: "checkbox__box",
+				"aria-hidden": "true"
+			}),
+			i && /* @__PURE__ */ t("span", {
+				className: "checkbox__label",
+				children: i
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/Radio.tsx
+function B({ name: e, value: r, checked: i, onChange: a, label: o, disabled: s = !1 }) {
+	let l = c();
+	return /* @__PURE__ */ n("label", {
+		htmlFor: l,
+		className: `radio${s ? " radio--disabled" : ""}`,
+		children: [
+			/* @__PURE__ */ t("input", {
+				id: l,
+				type: "radio",
+				name: e,
+				className: "radio__input",
+				checked: i,
+				disabled: s,
+				onChange: () => a?.(r)
+			}),
+			/* @__PURE__ */ t("span", {
+				className: "radio__dot",
+				"aria-hidden": "true"
+			}),
+			o && /* @__PURE__ */ t("span", {
+				className: "radio__label",
+				children: o
+			})
+		]
+	});
+}
+function te({ name: e, value: n, onChange: r, options: i, disabled: a = !1 }) {
+	return /* @__PURE__ */ t("div", {
+		className: "radio-group",
+		role: "radiogroup",
+		children: i.map((i) => /* @__PURE__ */ t(B, {
+			name: e,
+			value: i.value,
+			checked: n === i.value,
+			onChange: r,
+			label: i.label,
+			disabled: a || i.disabled
+		}, i.value))
+	});
+}
+//#endregion
+//#region src/components/Textarea.tsx
+function ne({ label: e, value: r, onChange: i, placeholder: a, disabled: o = !1, error: s = !1, hint: l, rows: u = 4, id: d, ...f }) {
+	let p = c(), m = d ?? p;
+	return /* @__PURE__ */ n("div", {
+		className: `field${s ? " field--error" : ""}`,
+		children: [
+			e && /* @__PURE__ */ t("label", {
+				className: "field__label",
+				htmlFor: m,
+				children: e
+			}),
+			/* @__PURE__ */ t("textarea", {
+				id: m,
+				className: "field__input field__input--textarea",
+				rows: u,
+				value: r,
+				onChange: (e) => i?.(e.target.value),
+				placeholder: a,
+				disabled: o,
+				"aria-invalid": s || void 0,
+				...f
+			}),
+			l && /* @__PURE__ */ t("span", {
+				className: "field__hint",
+				children: l
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/Skeleton.tsx
+function re({ variant: e = "text", width: n, height: r, radius: i }) {
+	return /* @__PURE__ */ t("span", {
+		className: "skeleton",
+		style: {
+			width: n ?? (e === "circle" ? 32 : "100%"),
+			height: r ?? (e === "circle" ? 32 : e === "rect" ? 120 : 14),
+			borderRadius: i ?? (e === "circle" ? "50%" : e === "rect" ? 8 : 4)
+		},
+		"aria-hidden": "true"
+	});
+}
+//#endregion
+//#region src/components/Menu.tsx
+function ie({ items: e, label: r = "Actions", trigger: i }) {
+	let [a, o] = d(!1), c = u(null);
+	return s(() => {
+		if (!a) return;
+		let e = (e) => {
+			c.current && !c.current.contains(e.target) && o(!1);
+		}, t = (e) => {
+			e.key === "Escape" && o(!1);
+		};
+		return document.addEventListener("mousedown", e), document.addEventListener("keydown", t), () => {
+			document.removeEventListener("mousedown", e), document.removeEventListener("keydown", t);
+		};
+	}, [a]), /* @__PURE__ */ n("div", {
+		className: "menu",
+		ref: c,
+		children: [i ? /* @__PURE__ */ t("span", {
+			onClick: () => o((e) => !e),
+			children: i
+		}) : /* @__PURE__ */ t("button", {
+			type: "button",
+			className: "menu__kebab",
+			"aria-haspopup": "menu",
+			"aria-expanded": a,
+			"aria-label": r,
+			onClick: () => o((e) => !e),
+			children: /* @__PURE__ */ t(y, {
+				name: "kebab",
+				size: 16
+			})
+		}), a && /* @__PURE__ */ t("ul", {
+			className: "menu__list",
+			role: "menu",
+			"aria-label": r,
+			children: e.map((e) => /* @__PURE__ */ t("li", {
+				role: "none",
+				children: /* @__PURE__ */ t("button", {
+					type: "button",
+					role: "menuitem",
+					disabled: e.disabled,
+					className: `menu__item${e.danger ? " menu__item--danger" : ""}`,
+					onClick: () => {
+						o(!1), e.onClick?.();
+					},
+					children: e.label
+				})
+			}, e.label))
+		})]
+	});
+}
+//#endregion
+//#region src/components/Pagination.tsx
+function ae(e, t) {
+	return [.../* @__PURE__ */ new Set([
+		1,
+		t,
+		e,
+		e - 1,
+		e + 1
+	])].filter((e) => e >= 1 && e <= t).sort((e, t) => e - t).reduce((e, t, n, r) => {
+		let i = r[n - 1];
+		return n > 0 && i !== void 0 && t - i > 1 && e.push("ellipsis-" + t), e.push(t), e;
+	}, []);
+}
+function oe({ page: e, pageCount: r, onChange: i }) {
+	if (r <= 1) return null;
+	let a = ae(e, r);
+	return /* @__PURE__ */ n("nav", {
+		className: "pagination",
+		"aria-label": "Pagination",
+		children: [
+			/* @__PURE__ */ t("button", {
+				type: "button",
+				className: "pagination__nav",
+				disabled: e <= 1,
+				onClick: () => i(e - 1),
+				"aria-label": "Previous page",
+				children: /* @__PURE__ */ t(y, {
+					name: "chevron-left",
+					size: 14
+				})
+			}),
+			a.map((n) => typeof n == "number" ? /* @__PURE__ */ t("button", {
+				type: "button",
+				className: `pagination__page${n === e ? " pagination__page--active" : ""}`,
+				"aria-current": n === e ? "page" : void 0,
+				onClick: () => i(n),
+				children: n
+			}, n) : /* @__PURE__ */ t("span", {
+				className: "pagination__ellipsis",
+				children: "…"
+			}, n)),
+			/* @__PURE__ */ t("button", {
+				type: "button",
+				className: "pagination__nav",
+				disabled: e >= r,
+				onClick: () => i(e + 1),
+				"aria-label": "Next page",
+				children: /* @__PURE__ */ t(y, {
+					name: "chevron-right",
+					size: 14
+				})
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/Breadcrumbs.tsx
+function se({ items: e }) {
+	return /* @__PURE__ */ t("nav", {
+		className: "breadcrumbs",
+		"aria-label": "Breadcrumb",
+		children: e.map((r, i) => {
+			let a = i === e.length - 1;
+			return /* @__PURE__ */ n("span", {
+				className: "breadcrumbs__item",
+				children: [a ? /* @__PURE__ */ t("span", {
+					className: "breadcrumbs__current",
+					"aria-current": "page",
+					children: r.label
+				}) : /* @__PURE__ */ t("button", {
+					type: "button",
+					className: "breadcrumbs__link",
+					onClick: r.onClick,
+					children: r.label
+				}), !a && /* @__PURE__ */ t("span", {
+					className: "breadcrumbs__sep",
+					"aria-hidden": "true",
+					children: "/"
+				})]
+			}, r.label);
+		})
+	});
+}
+//#endregion
+//#region src/components/ProgressBar.tsx
+function ce({ value: e, max: r = 100, tone: i = "blue", label: a }) {
+	let o = Math.max(0, Math.min(100, e / r * 100));
+	return /* @__PURE__ */ n("div", {
+		className: "progress",
+		children: [a && /* @__PURE__ */ n("div", {
+			className: "progress__label-row",
+			children: [/* @__PURE__ */ t("span", {
+				className: "progress__label",
+				children: a
+			}), /* @__PURE__ */ n("span", {
+				className: "progress__value",
+				children: [Math.round(o), "%"]
+			})]
+		}), /* @__PURE__ */ t("div", {
+			className: "progress__track",
+			role: "progressbar",
+			"aria-valuenow": e,
+			"aria-valuemin": 0,
+			"aria-valuemax": r,
+			children: /* @__PURE__ */ t("div", {
+				className: `progress__fill progress__fill--${i}`,
+				style: { width: `${o}%` }
+			})
+		})]
+	});
+}
+//#endregion
+//#region src/components/Gauge.tsx
+function le({ value: e, max: r = 100, tone: i = "blue", size: a = 96, label: o }) {
+	let s = Math.max(0, Math.min(100, e / r * 100)), c = a * .1, l = (a - c) / 2, u = 2 * Math.PI * l, d = u * (1 - s / 100);
+	return /* @__PURE__ */ n("div", {
+		className: "gauge",
+		style: {
+			width: a,
+			height: a
+		},
+		children: [/* @__PURE__ */ n("svg", {
+			viewBox: `0 0 ${a} ${a}`,
+			width: a,
+			height: a,
+			children: [/* @__PURE__ */ t("circle", {
+				cx: a / 2,
+				cy: a / 2,
+				r: l,
+				fill: "none",
+				stroke: "var(--neutral-100)",
+				strokeWidth: c
+			}), /* @__PURE__ */ t("circle", {
+				cx: a / 2,
+				cy: a / 2,
+				r: l,
+				fill: "none",
+				stroke: `var(--chart-${i})`,
+				strokeWidth: c,
+				strokeLinecap: "round",
+				strokeDasharray: u,
+				strokeDashoffset: d,
+				transform: `rotate(-90 ${a / 2} ${a / 2})`
+			})]
+		}), /* @__PURE__ */ n("div", {
+			className: "gauge__center",
+			children: [/* @__PURE__ */ n("span", {
+				className: "gauge__value",
+				children: [Math.round(s), "%"]
+			}), o && /* @__PURE__ */ t("span", {
+				className: "gauge__label",
+				children: o
+			})]
+		})]
+	});
+}
+//#endregion
+//#region src/components/Avatar.tsx
+var V = [
+	"blue",
+	"teal",
+	"purple",
+	"orange",
+	"red",
+	"green"
+];
+function ue(e) {
+	return V[[...e].reduce((e, t) => e + t.charCodeAt(0), 0) % V.length];
+}
+function de(e) {
+	let t = e.trim().split(/\s+/), n = t[0] ?? "";
+	if (t.length === 1) return n.slice(0, 2).toUpperCase();
+	let r = t[t.length - 1] ?? "";
+	return (n[0] ?? "").concat(r[0] ?? "").toUpperCase();
+}
+function H({ name: e, src: n, size: r = 32, tone: i }) {
+	let a = i ?? ue(e ?? ""), o = {
+		width: r,
+		height: r,
+		fontSize: Math.round(r * .4)
+	};
+	return n ? /* @__PURE__ */ t("img", {
+		className: "avatar",
+		style: o,
+		src: n,
+		alt: e ?? ""
+	}) : /* @__PURE__ */ t("span", {
+		className: `avatar avatar--${a}`,
+		style: o,
+		title: e,
+		children: e ? de(e) : "?"
+	});
+}
+//#endregion
+//#region src/components/Card.tsx
+function fe({ title: e, children: r, className: i }) {
+	return /* @__PURE__ */ n("div", {
+		className: `card${i ? ` ${i}` : ""}`,
+		children: [e && /* @__PURE__ */ t("h2", { children: e }), r]
+	});
+}
+//#endregion
+//#region src/components/EmptyState.tsx
+function pe({ icon: e, title: r, description: i, action: a }) {
+	return /* @__PURE__ */ n("div", {
+		className: "empty-state",
+		children: [
+			e && /* @__PURE__ */ t("div", {
+				className: "empty-state__icon",
+				children: e
+			}),
+			/* @__PURE__ */ t("h2", { children: r }),
+			i && /* @__PURE__ */ t("p", { children: i }),
+			a
+		]
+	});
+}
+//#endregion
+//#region src/components/Spinner.tsx
+function U({ size: e = 32, label: n = "Loading" }) {
+	return /* @__PURE__ */ t("span", {
+		className: "spinner",
+		role: "status",
+		"aria-label": n,
+		style: {
+			width: e,
+			height: e
+		}
+	});
+}
+//#endregion
+//#region src/components/Accordion.tsx
+function me({ items: e, openIds: r, onChange: i, allowMultiple: a = !1, defaultOpenIds: o = [] }) {
+	let [s, c] = d(o), l = r ?? s, u = (e) => {
+		let t = l.includes(e) ? l.filter((t) => t !== e) : a ? [...l, e] : [e];
+		i ? i(t) : c(t);
+	};
+	return /* @__PURE__ */ t("div", {
+		className: "accordion",
+		children: e.map((e) => {
+			let r = l.includes(e.id);
+			return /* @__PURE__ */ n("div", {
+				className: `accordion__item${r ? " accordion__item--open" : ""}`,
+				children: [/* @__PURE__ */ n("button", {
+					type: "button",
+					className: "accordion__header",
+					"aria-expanded": r,
+					disabled: e.disabled,
+					onClick: () => u(e.id),
+					children: [/* @__PURE__ */ t("span", {
+						className: "accordion__chevron",
+						"aria-hidden": "true"
+					}), e.title]
+				}), r && /* @__PURE__ */ t("div", {
+					className: "accordion__panel",
+					children: e.content
+				})]
+			}, e.id);
+		})
+	});
+}
+//#endregion
+//#region src/components/SegmentedControl.tsx
+function he({ options: e, value: n, onChange: r, label: i = "Options" }) {
+	return /* @__PURE__ */ t("div", {
+		className: "segmented",
+		role: "radiogroup",
+		"aria-label": i,
+		children: e.map((e) => /* @__PURE__ */ t("button", {
+			type: "button",
+			role: "radio",
+			"aria-checked": e.value === n,
+			disabled: e.disabled,
+			className: `segmented__option${e.value === n ? " segmented__option--active" : ""}`,
+			onClick: () => r(e.value),
+			children: e.label
+		}, e.value))
+	});
+}
+//#endregion
+//#region src/components/ChartLegend.tsx
+function ge({ items: e, hidden: r = [], onToggle: i }) {
+	return /* @__PURE__ */ t("ul", {
+		className: "chart-legend",
+		role: "list",
+		children: e.map((e) => {
+			let a = r.includes(e.label);
+			return /* @__PURE__ */ t("li", { children: /* @__PURE__ */ n("button", {
+				type: "button",
+				className: `chart-legend__item${a ? " chart-legend__item--hidden" : ""}${i ? "" : " chart-legend__item--static"}`,
+				onClick: i ? () => i(e.label) : void 0,
+				disabled: !i,
+				children: [/* @__PURE__ */ t("span", {
+					className: "chart-legend__swatch",
+					style: { background: e.color },
+					"aria-hidden": "true"
+				}), e.label]
+			}) }, e.label);
+		})
+	});
+}
+//#endregion
+//#region src/components/MiniBar.tsx
+function _e({ data: e, color: n = "#8FB4F5", height: r = 36 }) {
+	if (!e || e.length === 0) return null;
+	let i = Math.max(...e, 0) || 1, a = 200 / e.length - 2;
+	return /* @__PURE__ */ t("svg", {
+		className: "score-card__sparkline",
+		viewBox: `0 0 200 ${r}`,
+		preserveAspectRatio: "none",
+		children: e.map((e, o) => {
+			let s = Math.max(e / i * r, 1), c = o * (a + 2), l = r - s;
+			return /* @__PURE__ */ t("rect", {
+				x: c,
+				y: l,
+				width: a,
+				height: s,
+				fill: n,
+				rx: 1
+			}, o);
+		})
+	});
+}
+//#endregion
+//#region src/components/BulletChart.tsx
+function ve({ value: e, target: r, max: i, tone: a = "blue", label: o }) {
+	let s = i ?? (Math.max(e, r) * 1.2 || 1), c = Math.max(0, Math.min(100, e / s * 100)), l = Math.max(0, Math.min(100, r / s * 100));
+	return /* @__PURE__ */ n("div", {
+		className: "bullet",
+		children: [o && /* @__PURE__ */ n("div", {
+			className: "bullet__label-row",
+			children: [/* @__PURE__ */ t("span", {
+				className: "progress__label",
+				children: o
+			}), /* @__PURE__ */ n("span", {
+				className: "progress__value",
+				children: [
+					e,
+					" / ",
+					r
+				]
+			})]
+		}), /* @__PURE__ */ n("div", {
+			className: "bullet__track",
+			children: [/* @__PURE__ */ t("div", {
+				className: `bullet__fill bullet__fill--${a}`,
+				style: { width: `${c}%` }
+			}), /* @__PURE__ */ t("div", {
+				className: "bullet__target",
+				style: { left: `${l}%` }
+			})]
+		})]
+	});
+}
+//#endregion
+//#region src/components/Slider.tsx
+function ye({ value: e, onChange: r, min: i = 0, max: a = 100, step: o = 1, label: s, disabled: l = !1, formatValue: u }) {
+	let d = c(), f = (e - i) / (a - i || 1) * 100;
+	return /* @__PURE__ */ n("div", {
+		className: "field",
+		children: [s && /* @__PURE__ */ n("div", {
+			className: "progress__label-row",
+			children: [/* @__PURE__ */ t("label", {
+				className: "field__label",
+				htmlFor: d,
+				children: s
+			}), /* @__PURE__ */ t("span", {
+				className: "progress__value",
+				children: u ? u(e) : e
+			})]
+		}), /* @__PURE__ */ t("input", {
+			id: d,
+			type: "range",
+			className: "slider",
+			style: { "--slider-fill": `${f}%` },
+			value: e,
+			min: i,
+			max: a,
+			step: o,
+			disabled: l,
+			onChange: (e) => r(Number(e.target.value))
+		})]
+	});
+}
+//#endregion
+//#region src/components/Stepper.tsx
+function be({ steps: e, activeId: r, completedIds: i = [] }) {
+	let a = e.findIndex((e) => e.id === r);
+	return /* @__PURE__ */ t("div", {
+		className: "stepper",
+		role: "list",
+		children: e.map((o, s) => {
+			let c = i.includes(o.id) || s < a, l = o.id === r;
+			return /* @__PURE__ */ n("div", {
+				role: "listitem",
+				className: `stepper__step${l ? " stepper__step--active" : ""}${c ? " stepper__step--completed" : ""}`,
+				children: [
+					/* @__PURE__ */ t("span", {
+						className: "stepper__dot",
+						"aria-hidden": "true",
+						children: c ? /* @__PURE__ */ t(y, {
+							name: "check",
+							size: 13
+						}) : s + 1
+					}),
+					/* @__PURE__ */ t("span", {
+						className: "stepper__label",
+						children: o.label
+					}),
+					s < e.length - 1 && /* @__PURE__ */ t("span", {
+						className: "stepper__connector",
+						"aria-hidden": "true"
+					})
+				]
+			}, o.id);
+		})
+	});
+}
+//#endregion
+//#region src/components/Drawer.tsx
+function xe({ open: e, onClose: r, title: i, children: a, footer: o, side: c = "right", width: l = 380 }) {
+	return s(() => {
+		if (!e) return;
+		let t = (e) => {
+			e.key === "Escape" && r?.();
+		};
+		return document.addEventListener("keydown", t), () => document.removeEventListener("keydown", t);
+	}, [e, r]), e ? f(/* @__PURE__ */ t("div", {
+		className: "drawer-backdrop",
+		onMouseDown: () => r?.(),
+		children: /* @__PURE__ */ n("div", {
+			className: `drawer drawer--${c}`,
+			style: { width: l },
+			role: "dialog",
+			"aria-modal": "true",
+			"aria-label": typeof i == "string" ? i : void 0,
+			onMouseDown: (e) => e.stopPropagation(),
+			children: [
+				i && /* @__PURE__ */ n("div", {
+					className: "modal__header",
+					children: [/* @__PURE__ */ t("h2", {
+						className: "modal__title",
+						children: i
+					}), /* @__PURE__ */ t("button", {
+						type: "button",
+						className: "modal__close",
+						"aria-label": "Close",
+						onClick: () => r?.(),
+						children: /* @__PURE__ */ t(y, {
+							name: "close",
+							size: 16
+						})
+					})]
+				}),
+				/* @__PURE__ */ t("div", {
+					className: "drawer__body",
+					children: a
+				}),
+				o && /* @__PURE__ */ t("div", {
+					className: "modal__footer",
+					children: o
+				})
+			]
+		})
+	}), document.body) : null;
+}
+//#endregion
+//#region src/components/Popover.tsx
+function Se({ trigger: e, children: r, label: i = "More", align: a = "left" }) {
+	let [o, c] = d(!1), l = u(null);
+	return s(() => {
+		if (!o) return;
+		let e = (e) => {
+			l.current && !l.current.contains(e.target) && c(!1);
+		}, t = (e) => {
+			e.key === "Escape" && c(!1);
+		};
+		return document.addEventListener("mousedown", e), document.addEventListener("keydown", t), () => {
+			document.removeEventListener("mousedown", e), document.removeEventListener("keydown", t);
+		};
+	}, [o]), /* @__PURE__ */ n("div", {
+		className: "popover",
+		ref: l,
+		children: [/* @__PURE__ */ t("span", {
+			onClick: () => c((e) => !e),
+			children: e
+		}), o && /* @__PURE__ */ t("div", {
+			className: `popover__panel popover__panel--${a}`,
+			role: "dialog",
+			"aria-label": i,
+			children: r
+		})]
+	});
+}
+//#endregion
+//#region src/components/TagInput.tsx
+function Ce({ value: e, onChange: r, label: i, placeholder: a = "Add a tag...", disabled: o = !1 }) {
+	let [s, l] = d(""), u = c(), f = () => {
+		let t = s.trim();
+		t && !e.includes(t) && r([...e, t]), l("");
+	}, p = (t) => {
+		t.key === "Enter" || t.key === "," ? (t.preventDefault(), f()) : t.key === "Backspace" && !s && e.length && r(e.slice(0, -1));
+	}, m = (t) => r(e.filter((e, n) => n !== t));
+	return /* @__PURE__ */ n("div", {
+		className: "field",
+		children: [i && /* @__PURE__ */ t("label", {
+			className: "field__label",
+			htmlFor: u,
+			children: i
+		}), /* @__PURE__ */ n("div", {
+			className: `tag-input${o ? " tag-input--disabled" : ""}`,
+			children: [e.map((e, r) => /* @__PURE__ */ n("span", {
+				className: "tag-input__tag",
+				children: [e, !o && /* @__PURE__ */ t("button", {
+					type: "button",
+					"aria-label": `Remove ${e}`,
+					onClick: () => m(r),
+					children: "×"
+				})]
+			}, e)), /* @__PURE__ */ t("input", {
+				id: u,
+				className: "tag-input__field",
+				value: s,
+				onChange: (e) => l(e.target.value),
+				onKeyDown: p,
+				onBlur: f,
+				placeholder: e.length ? "" : a,
+				disabled: o
+			})]
+		})]
+	});
+}
+//#endregion
+//#region src/components/SearchInput.tsx
+function we({ value: e, onChange: r, placeholder: i = "Search...", disabled: a = !1 }) {
+	return /* @__PURE__ */ n("div", {
+		className: "search-input",
+		children: [
+			/* @__PURE__ */ t("span", {
+				className: "search-input__icon",
+				"aria-hidden": "true"
+			}),
+			/* @__PURE__ */ t("input", {
+				className: "search-input__field",
+				type: "search",
+				value: e,
+				onChange: (e) => r(e.target.value),
+				placeholder: i,
+				disabled: a
+			}),
+			e && /* @__PURE__ */ t("button", {
+				type: "button",
+				className: "search-input__clear",
+				"aria-label": "Clear search",
+				onClick: () => r(""),
+				children: "×"
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/CopyButton.tsx
+function W({ text: e, label: n = "Copy" }) {
+	let [r, i] = d(!1);
+	return /* @__PURE__ */ t("button", {
+		type: "button",
+		className: "copy-button",
+		"aria-label": r ? "Copied" : n,
+		onClick: async () => {
+			try {
+				await navigator.clipboard.writeText(e);
+			} catch {}
+			i(!0), setTimeout(() => i(!1), 1500);
+		},
+		children: /* @__PURE__ */ t(y, {
+			name: r ? "check" : "copy",
+			size: 14
+		})
+	});
+}
+//#endregion
+//#region src/components/StatusDot.tsx
+function Te({ tone: e = "green", label: r, pulse: i = !1 }) {
+	return /* @__PURE__ */ n("span", {
+		className: "status-dot",
+		children: [/* @__PURE__ */ t("span", {
+			className: `status-dot__dot status-dot__dot--${e}${i ? " status-dot__dot--pulse" : ""}`,
+			"aria-hidden": "true"
+		}), r && /* @__PURE__ */ t("span", {
+			className: "status-dot__label",
+			children: r
+		})]
+	});
+}
+//#endregion
+//#region src/components/DescriptionList.tsx
+function Ee({ items: e, columns: r = 1 }) {
+	return /* @__PURE__ */ t("dl", {
+		className: "description-list",
+		style: { gridTemplateColumns: `repeat(${r}, 1fr)` },
+		children: e.map((e, r) => /* @__PURE__ */ n("div", {
+			className: "description-list__item",
+			children: [/* @__PURE__ */ t("dt", { children: e.label }), /* @__PURE__ */ t("dd", { children: e.value })]
+		}, r))
+	});
+}
+//#endregion
+//#region src/components/Text.tsx
+function De({ as: e = "p", size: n = "md", weight: r = "regular", color: i = "default", mono: a = !1, children: o, className: s }) {
+	return /* @__PURE__ */ t(e, {
+		className: `nl-text nl-text--${n} nl-text--${r} nl-text--${i}${a ? " nl-text--mono" : ""}${s ? ` ${s}` : ""}`,
+		children: o
+	});
+}
+//#endregion
+//#region src/components/Heading.tsx
+function Oe({ level: e = 2, children: n, className: r }) {
+	let i = `h${e}`;
+	return /* @__PURE__ */ t(i, {
+		className: `nl-heading nl-heading--${e}${r ? ` ${r}` : ""}`,
+		children: n
+	});
+}
+//#endregion
+//#region src/components/Container.tsx
+function ke({ size: e = "lg", children: n, className: r }) {
+	return /* @__PURE__ */ t("div", {
+		className: `nl-container nl-container--${e}${r ? ` ${r}` : ""}`,
+		children: n
+	});
+}
+//#endregion
+//#region src/components/Stack.tsx
+function G({ direction: e = "column", gap: n = 12, align: r, justify: i, wrap: a = !1, children: o, className: s }) {
+	return /* @__PURE__ */ t("div", {
+		className: `nl-stack${s ? ` ${s}` : ""}`,
+		style: {
+			display: "flex",
+			flexDirection: e,
+			gap: n,
+			alignItems: r,
+			justifyContent: i,
+			flexWrap: a ? "wrap" : "nowrap"
+		},
+		children: o
+	});
+}
+function Ae(e) {
+	return /* @__PURE__ */ t(G, {
+		...e,
+		direction: "column"
+	});
+}
+function je(e) {
+	return /* @__PURE__ */ t(G, {
+		...e,
+		direction: "row"
+	});
+}
+//#endregion
+//#region src/components/Grid.tsx
+function Me({ columns: e = 12, gap: n = 16, children: r, className: i }) {
+	let a = Math.max(120, Math.floor(1200 / e));
+	return /* @__PURE__ */ t("div", {
+		className: `nl-grid${i ? ` ${i}` : ""}`,
+		style: {
+			display: "grid",
+			gridTemplateColumns: `repeat(auto-fit, minmax(${a}px, 1fr))`,
+			gap: n
+		},
+		children: r
+	});
+}
+//#endregion
+//#region src/components/Divider.tsx
+function Ne({ orientation: e = "horizontal", label: r }) {
+	return e === "vertical" ? /* @__PURE__ */ t("span", {
+		className: "nl-divider nl-divider--vertical",
+		role: "separator"
+	}) : r ? /* @__PURE__ */ n("div", {
+		className: "nl-divider--labeled",
+		role: "separator",
+		children: [
+			/* @__PURE__ */ t("span", { className: "nl-divider--labeled__line" }),
+			/* @__PURE__ */ t("span", {
+				className: "nl-divider--labeled__text",
+				children: r
+			}),
+			/* @__PURE__ */ t("span", { className: "nl-divider--labeled__line" })
+		]
+	}) : /* @__PURE__ */ t("hr", { className: "nl-divider" });
+}
+//#endregion
+//#region src/components/Link.tsx
+function Pe({ children: e, external: n = !1, ...r }) {
+	return /* @__PURE__ */ t("a", {
+		className: "nl-link",
+		...n ? {
+			target: "_blank",
+			rel: "noopener noreferrer"
+		} : {},
+		...r,
+		children: e
+	});
+}
+//#endregion
+//#region src/components/Alert.tsx
+var Fe = {
+	info: "info",
+	success: "check",
+	warning: "warning",
+	danger: "close"
+};
+function K({ tone: e = "info", title: r, children: i, onDismiss: a }) {
+	return /* @__PURE__ */ n("div", {
+		className: `alert alert--${e}`,
+		role: e === "danger" ? "alert" : "status",
+		children: [
+			/* @__PURE__ */ t("span", {
+				className: "alert__icon",
+				"aria-hidden": "true",
+				children: /* @__PURE__ */ t(y, {
+					name: Fe[e],
+					size: 12,
+					color: "var(--neutral-0)"
+				})
+			}),
+			/* @__PURE__ */ n("div", {
+				className: "alert__body",
+				children: [r && /* @__PURE__ */ t("div", {
+					className: "alert__title",
+					children: r
+				}), i && /* @__PURE__ */ t("div", {
+					className: "alert__message",
+					children: i
+				})]
+			}),
+			a && /* @__PURE__ */ t("button", {
+				type: "button",
+				className: "alert__dismiss",
+				"aria-label": "Dismiss",
+				onClick: a,
+				children: /* @__PURE__ */ t(y, {
+					name: "close",
+					size: 14
+				})
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/IconButton.tsx
+function Ie({ children: e, variant: n = "ghost", size: r = "md", label: i, ...a }) {
+	return /* @__PURE__ */ t("button", {
+		type: "button",
+		"aria-label": i,
+		className: `icon-button icon-button--${n} icon-button--${r}`,
+		...a,
+		children: e
+	});
+}
+//#endregion
+//#region src/components/Tooltip.tsx
+function Le({ content: e, children: r, placement: i = "top" }) {
+	return /* @__PURE__ */ n("span", {
+		className: "tooltip-wrapper",
+		children: [r, /* @__PURE__ */ t("span", {
+			className: `tooltip-wrapper__bubble tooltip-wrapper__bubble--${i}`,
+			role: "tooltip",
+			children: e
+		})]
+	});
+}
+//#endregion
+//#region src/components/Fieldset.tsx
+function Re({ label: e, hint: r, error: i = !1, htmlFor: a, children: o }) {
+	return /* @__PURE__ */ n("div", {
+		className: `field${i ? " field--error" : ""}`,
+		children: [
+			e && /* @__PURE__ */ t("label", {
+				className: "field__label",
+				htmlFor: a,
+				children: e
+			}),
+			o,
+			r && /* @__PURE__ */ t("span", {
+				className: "field__hint",
+				children: r
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/Combobox.tsx
+function ze({ value: e, onChange: r, options: i, label: a, placeholder: o = "Search...", disabled: c = !1 }) {
+	let [f, p] = d(!1), [m, h] = d(""), g = u(null), _ = i.find((t) => t.value === e)?.label ?? e;
+	s(() => {
+		f || h("");
+	}, [f]), s(() => {
+		if (!f) return;
+		let e = (e) => {
+			g.current && !g.current.contains(e.target) && p(!1);
+		}, t = (e) => {
+			e.key === "Escape" && p(!1);
+		};
+		return document.addEventListener("mousedown", e), document.addEventListener("keydown", t), () => {
+			document.removeEventListener("mousedown", e), document.removeEventListener("keydown", t);
+		};
+	}, [f]);
+	let v = l(() => {
+		let e = m.trim().toLowerCase();
+		return e ? i.filter((t) => t.label.toLowerCase().includes(e)) : i;
+	}, [i, m]), y = (e) => {
+		r(e.value), p(!1);
+	};
+	return /* @__PURE__ */ n("div", {
+		className: "select combobox",
+		ref: g,
+		children: [f ? /* @__PURE__ */ t("input", {
+			autoFocus: !0,
+			className: "select__trigger",
+			value: m,
+			placeholder: _ || o,
+			onChange: (e) => h(e.target.value),
+			disabled: c
+		}) : /* @__PURE__ */ n("button", {
+			type: "button",
+			className: "select__trigger",
+			"aria-haspopup": "listbox",
+			"aria-expanded": f,
+			"aria-label": a,
+			disabled: c,
+			onClick: () => p(!0),
+			children: [/* @__PURE__ */ t("span", { children: _ || /* @__PURE__ */ t("span", {
+				className: "combobox__placeholder",
+				children: o
+			}) }), /* @__PURE__ */ t("span", {
+				className: "select__chevron",
+				"aria-hidden": "true"
+			})]
+		}), f && /* @__PURE__ */ n("ul", {
+			className: "select__menu",
+			role: "listbox",
+			"aria-label": a,
+			children: [v.length === 0 && /* @__PURE__ */ t("li", {
+				className: "select__option combobox__empty",
+				children: "No matches"
+			}), v.map((n) => /* @__PURE__ */ t("li", {
+				role: "option",
+				"aria-selected": n.value === e,
+				className: `select__option${n.value === e ? " select__option--selected" : ""}`,
+				onClick: () => y(n),
+				children: n.label
+			}, n.value))]
+		})]
+	});
+}
+//#endregion
+//#region src/components/NumberStepper.tsx
+function Be({ value: e, onChange: r, min: i = -Infinity, max: a = Infinity, step: o = 1, label: s, disabled: c = !1 }) {
+	let l = (e) => Math.min(a, Math.max(i, e)), u = (e) => r(l(e));
+	return /* @__PURE__ */ n("div", {
+		className: "number-stepper",
+		role: "group",
+		"aria-label": s,
+		children: [
+			/* @__PURE__ */ t("button", {
+				type: "button",
+				className: "number-stepper__btn",
+				"aria-label": "Decrease",
+				disabled: c || e <= i,
+				onClick: () => u(e - o),
+				children: /* @__PURE__ */ t(y, {
+					name: "minus",
+					size: 13
+				})
+			}),
+			/* @__PURE__ */ t("input", {
+				className: "number-stepper__field",
+				type: "number",
+				value: e,
+				min: i === -Infinity ? void 0 : i,
+				max: a === -Infinity ? void 0 : a,
+				step: o,
+				disabled: c,
+				onChange: (e) => {
+					let t = Number(e.target.value);
+					Number.isNaN(t) || u(t);
+				}
+			}),
+			/* @__PURE__ */ t("button", {
+				type: "button",
+				className: "number-stepper__btn",
+				"aria-label": "Increase",
+				disabled: c || e >= a,
+				onClick: () => u(e + o),
+				children: /* @__PURE__ */ t(y, {
+					name: "plus",
+					size: 13
+				})
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/FileUpload.tsx
+function Ve({ onFiles: e, accept: r, multiple: i = !1, disabled: a = !1, label: o = "Drag files here or click to browse", hint: s }) {
+	let [l, f] = d(!1), p = u(null), m = c(), h = (t) => {
+		t && t.length && e(Array.from(t));
+	};
+	return /* @__PURE__ */ n("div", {
+		className: `file-upload${l ? " file-upload--drag-over" : ""}${a ? " file-upload--disabled" : ""}`,
+		onDragOver: (e) => {
+			e.preventDefault(), a || f(!0);
+		},
+		onDragLeave: () => f(!1),
+		onDrop: (e) => {
+			e.preventDefault(), f(!1), a || h(e.dataTransfer.files);
+		},
+		onClick: () => !a && p.current?.click(),
+		role: "button",
+		tabIndex: a ? -1 : 0,
+		"aria-disabled": a,
+		children: [
+			/* @__PURE__ */ t("input", {
+				ref: p,
+				id: m,
+				type: "file",
+				className: "file-upload__input",
+				accept: r,
+				multiple: i,
+				disabled: a,
+				onChange: (e) => h(e.target.files)
+			}),
+			/* @__PURE__ */ t("span", {
+				className: "file-upload__icon",
+				"aria-hidden": "true",
+				children: /* @__PURE__ */ t(y, {
+					name: "upload",
+					size: 22
+				})
+			}),
+			/* @__PURE__ */ t("span", {
+				className: "file-upload__label",
+				children: o
+			}),
+			s && /* @__PURE__ */ t("span", {
+				className: "file-upload__hint",
+				children: s
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/DatePicker.tsx
+var He = [
+	"Su",
+	"Mo",
+	"Tu",
+	"We",
+	"Th",
+	"Fr",
+	"Sa"
+], Ue = [
+	"January",
+	"February",
+	"March",
+	"April",
+	"May",
+	"June",
+	"July",
+	"August",
+	"September",
+	"October",
+	"November",
+	"December"
+];
+function q(e) {
+	if (!e) return null;
+	let [t, n, r] = e.split("-").map(Number);
+	return t === void 0 || n === void 0 || r === void 0 ? null : new Date(t, n - 1, r);
+}
+function We(e) {
+	return `${e.getFullYear()}-${String(e.getMonth() + 1).padStart(2, "0")}-${String(e.getDate()).padStart(2, "0")}`;
+}
+function Ge(e) {
+	let t = q(e);
+	return t ? `${String(t.getMonth() + 1).padStart(2, "0")}/${String(t.getDate()).padStart(2, "0")}/${t.getFullYear()}` : "";
+}
+function Ke({ value: e, min: r, max: i, onChange: a, label: o = "Date", placeholder: c = "Select date" }) {
+	let [l, f] = d(!1), p = q(e), m = q(r), h = q(i), [g, _] = d(() => p ?? /* @__PURE__ */ new Date()), v = u(null);
+	s(() => {
+		l && _(p ?? /* @__PURE__ */ new Date());
+	}, [l]), s(() => {
+		if (!l) return;
+		let e = (e) => {
+			v.current && !v.current.contains(e.target) && f(!1);
+		}, t = (e) => {
+			e.key === "Escape" && f(!1);
+		};
+		return document.addEventListener("mousedown", e), document.addEventListener("keydown", t), () => {
+			document.removeEventListener("mousedown", e), document.removeEventListener("keydown", t);
+		};
+	}, [l]);
+	let b = g.getFullYear(), x = g.getMonth(), S = new Date(b, x, 1).getDay(), C = new Date(b, x + 1, 0).getDate(), w = [];
+	for (let e = 0; e < S; e++) w.push(null);
+	for (let e = 1; e <= C; e++) w.push(new Date(b, x, e));
+	let T = (e) => !!(m && e < m || h && e > h), E = (e) => !!(p && e.toDateString() === p.toDateString()), D = (e) => e.toDateString() === (/* @__PURE__ */ new Date()).toDateString(), O = (e) => _(new Date(b, x + e, 1)), k = (e) => {
+		a(We(e)), f(!1);
+	};
+	return /* @__PURE__ */ n("div", {
+		className: "datepicker",
+		ref: v,
+		children: [/* @__PURE__ */ n("button", {
+			type: "button",
+			className: "select__trigger",
+			"aria-haspopup": "dialog",
+			"aria-expanded": l,
+			"aria-label": o,
+			onClick: () => f((e) => !e),
+			children: [/* @__PURE__ */ t("span", { children: e ? Ge(e) : c }), /* @__PURE__ */ t("span", {
+				className: "datepicker__icon",
+				"aria-hidden": "true"
+			})]
+		}), l && /* @__PURE__ */ n("div", {
+			className: "datepicker__panel",
+			role: "dialog",
+			"aria-label": o,
+			children: [
+				/* @__PURE__ */ n("div", {
+					className: "datepicker__header",
+					children: [
+						/* @__PURE__ */ t("button", {
+							type: "button",
+							className: "datepicker__nav",
+							onClick: () => O(-1),
+							"aria-label": "Previous month",
+							children: /* @__PURE__ */ t(y, {
+								name: "chevron-left",
+								size: 14
+							})
+						}),
+						/* @__PURE__ */ n("span", {
+							className: "datepicker__title",
+							children: [
+								Ue[x],
+								" ",
+								b
+							]
+						}),
+						/* @__PURE__ */ t("button", {
+							type: "button",
+							className: "datepicker__nav",
+							onClick: () => O(1),
+							"aria-label": "Next month",
+							children: /* @__PURE__ */ t(y, {
+								name: "chevron-right",
+								size: 14
+							})
+						})
+					]
+				}),
+				/* @__PURE__ */ t("div", {
+					className: "datepicker__weekdays",
+					children: He.map((e) => /* @__PURE__ */ t("span", { children: e }, e))
+				}),
+				/* @__PURE__ */ t("div", {
+					className: "datepicker__grid",
+					children: w.map((e, n) => e ? /* @__PURE__ */ t("button", {
+						type: "button",
+						disabled: T(e),
+						className: [
+							"datepicker__day",
+							E(e) && "datepicker__day--selected",
+							D(e) && "datepicker__day--today"
+						].filter(Boolean).join(" "),
+						onClick: () => k(e),
+						children: e.getDate()
+					}, n) : /* @__PURE__ */ t("span", {}, n))
+				})
+			]
+		})]
+	});
+}
+//#endregion
+//#region src/components/Rating.tsx
+function qe({ value: e, onChange: n, max: r = 5, readOnly: i = !1 }) {
+	let [a, o] = d(null), s = !i && !!n, c = a ?? e;
+	return /* @__PURE__ */ t("div", {
+		className: `rating${s ? "" : " rating--readonly"}`,
+		role: s ? "radiogroup" : "img",
+		"aria-label": `${e} out of ${r} stars`,
+		onMouseLeave: () => o(null),
+		children: Array.from({ length: r }, (e, t) => t + 1).map((r) => /* @__PURE__ */ t("span", {
+			className: `rating__star${r <= c ? " rating__star--filled" : ""}`,
+			onMouseEnter: () => s && o(r),
+			onClick: () => s && n?.(r),
+			role: s ? "radio" : void 0,
+			"aria-checked": s ? r === e : void 0,
+			"aria-hidden": !s || void 0,
+			children: /* @__PURE__ */ t(y, {
+				name: "star",
+				size: 20,
+				filled: r <= c
+			})
+		}, r))
+	});
+}
+//#endregion
+//#region src/components/List.tsx
+function Je({ items: e, bordered: n = !0 }) {
+	return /* @__PURE__ */ t("ul", {
+		className: `nl-list${n ? " nl-list--bordered" : ""}`,
+		children: e.map((e) => /* @__PURE__ */ t("li", {
+			className: `nl-list__item${e.onClick ? " nl-list__item--clickable" : ""}`,
+			onClick: e.onClick,
+			children: e.content
+		}, e.id))
+	});
+}
+//#endregion
+//#region src/components/Timeline.tsx
+function Ye({ items: e }) {
+	return /* @__PURE__ */ t("div", {
+		className: "timeline",
+		children: e.map((r, i) => /* @__PURE__ */ n("div", {
+			className: "timeline__item",
+			children: [/* @__PURE__ */ n("div", {
+				className: "timeline__rail",
+				children: [/* @__PURE__ */ t("span", { className: `timeline__dot${r.tone ? ` timeline__dot--${r.tone}` : ""}` }), i < e.length - 1 && /* @__PURE__ */ t("span", { className: "timeline__line" })]
+			}), /* @__PURE__ */ n("div", {
+				className: "timeline__content",
+				children: [/* @__PURE__ */ n("div", {
+					className: "timeline__header",
+					children: [/* @__PURE__ */ t("span", {
+						className: "timeline__title",
+						children: r.title
+					}), r.timestamp && /* @__PURE__ */ t("span", {
+						className: "timeline__timestamp",
+						children: r.timestamp
+					})]
+				}), r.description && /* @__PURE__ */ t("div", {
+					className: "timeline__description",
+					children: r.description
+				})]
+			})]
+		}, r.id))
+	});
+}
+//#endregion
+//#region src/components/AvatarGroup.tsx
+function Xe({ avatars: e, max: r = 4, size: i = 32 }) {
+	let a = e.slice(0, r), o = e.length - a.length;
+	return /* @__PURE__ */ n("div", {
+		className: "avatar-group",
+		children: [a.map((e, n) => /* @__PURE__ */ t("div", {
+			className: "avatar-group__item",
+			style: { zIndex: a.length - n },
+			children: /* @__PURE__ */ t(H, {
+				...e,
+				size: e.size ?? i
+			})
+		}, n)), o > 0 && /* @__PURE__ */ n("div", {
+			className: "avatar-group__item avatar-group__overflow",
+			style: {
+				width: i,
+				height: i,
+				fontSize: Math.round(i * .35)
+			},
+			children: ["+", o]
+		})]
+	});
+}
+//#endregion
+//#region src/components/CodeBlock.tsx
+function Ze({ code: e, language: r, copyable: i = !0 }) {
+	return /* @__PURE__ */ n("div", {
+		className: "code-block",
+		children: [(r || i) && /* @__PURE__ */ n("div", {
+			className: "code-block__header",
+			children: [r && /* @__PURE__ */ t("span", {
+				className: "code-block__lang",
+				children: r
+			}), i && /* @__PURE__ */ t(W, { text: e })]
+		}), /* @__PURE__ */ t("pre", {
+			className: "code-block__body",
+			children: /* @__PURE__ */ t("code", { children: e })
+		})]
+	});
+}
+//#endregion
+//#region src/components/Kbd.tsx
+function Qe({ children: e }) {
+	return /* @__PURE__ */ t("kbd", {
+		className: "kbd",
+		children: e
+	});
+}
+//#endregion
+//#region src/components/Tree.tsx
+function J({ node: e, expanded: r, toggle: i, onSelect: a, selectedId: o }) {
+	let s = !!e.children?.length, c = r.has(e.id);
+	return /* @__PURE__ */ n("li", {
+		className: "tree__item",
+		children: [/* @__PURE__ */ n("div", {
+			className: `tree__row${e.id === o ? " tree__row--selected" : ""}`,
+			onClick: () => {
+				s && i(e.id), a?.(e.id);
+			},
+			children: [s ? /* @__PURE__ */ t("span", {
+				className: `tree__chevron${c ? " tree__chevron--open" : ""}`,
+				"aria-hidden": "true"
+			}) : /* @__PURE__ */ t("span", {
+				className: "tree__chevron tree__chevron--leaf",
+				"aria-hidden": "true"
+			}), /* @__PURE__ */ t("span", {
+				className: "tree__label",
+				children: e.label
+			})]
+		}), s && c && /* @__PURE__ */ t("ul", {
+			className: "tree__children",
+			children: e.children.map((e) => /* @__PURE__ */ t(J, {
+				node: e,
+				expanded: r,
+				toggle: i,
+				onSelect: a,
+				selectedId: o
+			}, e.id))
+		})]
+	});
+}
+function $e({ nodes: e, defaultExpandedIds: n = [], onSelect: r, selectedId: i }) {
+	let [a, o] = d(new Set(n)), s = (e) => {
+		o((t) => {
+			let n = new Set(t);
+			return n.has(e) ? n.delete(e) : n.add(e), n;
+		});
+	};
+	return /* @__PURE__ */ t("ul", {
+		className: "tree",
+		role: "tree",
+		children: e.map((e) => /* @__PURE__ */ t(J, {
+			node: e,
+			expanded: a,
+			toggle: s,
+			onSelect: r,
+			selectedId: i
+		}, e.id))
+	});
+}
+//#endregion
+//#region src/components/Navbar.tsx
+function et({ brand: e, children: r, sticky: i = !1 }) {
+	return /* @__PURE__ */ n("header", {
+		className: `navbar${i ? " navbar--sticky" : ""}`,
+		children: [e && /* @__PURE__ */ t("div", {
+			className: "navbar__brand",
+			children: e
+		}), /* @__PURE__ */ t("div", {
+			className: "navbar__actions",
+			children: r
+		})]
+	});
+}
+//#endregion
+//#region src/components/Sidebar.tsx
+function tt({ items: e, activeId: r, collapsed: i = !1, header: a }) {
+	return /* @__PURE__ */ n("nav", {
+		className: `sidebar${i ? " sidebar--collapsed" : ""}`,
+		children: [a && /* @__PURE__ */ t("div", {
+			className: "sidebar__header",
+			children: a
+		}), /* @__PURE__ */ t("ul", {
+			className: "sidebar__list",
+			children: e.map((e) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ n("button", {
+				type: "button",
+				className: `sidebar__item${e.id === r ? " sidebar__item--active" : ""}`,
+				onClick: e.onClick,
+				title: i && typeof e.label == "string" ? e.label : void 0,
+				children: [e.icon && /* @__PURE__ */ t("span", {
+					className: "sidebar__icon",
+					children: e.icon
+				}), !i && /* @__PURE__ */ t("span", {
+					className: "sidebar__label",
+					children: e.label
+				})]
+			}) }, e.id))
+		})]
+	});
+}
+//#endregion
+//#region src/components/ButtonGroup.tsx
+function nt({ children: e }) {
+	return /* @__PURE__ */ t("div", {
+		className: "button-group",
+		children: e
+	});
+}
+//#endregion
+//#region src/components/ColorPicker.tsx
+var rt = [
+	"#8FB4F5",
+	"#7FD8C9",
+	"#C9A8F0",
+	"#F5C88F",
+	"#F19A9A",
+	"#8FCB9E"
+];
+function it({ value: e, onChange: r, swatches: i = rt, label: a = "Color" }) {
+	return /* @__PURE__ */ n("div", {
+		className: "color-picker",
+		role: "group",
+		"aria-label": a,
+		children: [i.map((n) => /* @__PURE__ */ t("button", {
+			type: "button",
+			className: `color-picker__swatch${n.toLowerCase() === e.toLowerCase() ? " color-picker__swatch--selected" : ""}`,
+			style: { background: n },
+			"aria-label": n,
+			"aria-pressed": n.toLowerCase() === e.toLowerCase(),
+			onClick: () => r(n)
+		}, n)), /* @__PURE__ */ t("label", {
+			className: "color-picker__custom",
+			children: /* @__PURE__ */ t("input", {
+				type: "color",
+				value: e,
+				onChange: (e) => r(e.target.value),
+				"aria-label": "Custom color"
+			})
+		})]
+	});
+}
+//#endregion
+//#region src/components/PasswordInput.tsx
+function at({ label: e, value: r, onChange: i, placeholder: a, disabled: o = !1, error: s = !1, hint: l, id: u, autoComplete: f = "current-password" }) {
+	let [p, m] = d(!1), h = c(), g = u ?? h;
+	return /* @__PURE__ */ n("div", {
+		className: `field${s ? " field--error" : ""}`,
+		children: [
+			e && /* @__PURE__ */ t("label", {
+				className: "field__label",
+				htmlFor: g,
+				children: e
+			}),
+			/* @__PURE__ */ n("div", {
+				className: "password-input",
+				children: [/* @__PURE__ */ t("input", {
+					id: g,
+					className: "field__input password-input__field",
+					type: p ? "text" : "password",
+					value: r,
+					onChange: (e) => i(e.target.value),
+					placeholder: a,
+					disabled: o,
+					autoComplete: f,
+					"aria-invalid": s || void 0
+				}), /* @__PURE__ */ t("button", {
+					type: "button",
+					className: "password-input__toggle",
+					"aria-label": p ? "Hide password" : "Show password",
+					disabled: o,
+					onClick: () => m((e) => !e),
+					children: /* @__PURE__ */ t(y, {
+						name: p ? "eye-off" : "eye",
+						size: 16
+					})
+				})]
+			}),
+			l && /* @__PURE__ */ t("span", {
+				className: "field__hint",
+				children: l
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/OTPInput.tsx
+function ot({ length: e = 6, value: n, onChange: r, disabled: i = !1, label: a = "Verification code" }) {
+	let o = u([]), s = Array.from({ length: e }, (e, t) => n[t] ?? ""), c = (t, n) => {
+		let i = s.slice();
+		i[t] = n, r(i.join("").slice(0, e));
+	}, l = (t, n) => {
+		let r = n.slice(-1);
+		c(t, r), r && t < e - 1 && o.current[t + 1]?.focus();
+	}, d = (e, t) => {
+		t.key === "Backspace" && !s[e] && e > 0 && o.current[e - 1]?.focus();
+	}, f = (t) => {
+		t.preventDefault();
+		let n = t.clipboardData.getData("text").trim().slice(0, e);
+		r(n), o.current[Math.min(n.length, e - 1)]?.focus();
+	};
+	return /* @__PURE__ */ t("div", {
+		className: "otp-input",
+		role: "group",
+		"aria-label": a,
+		children: s.map((n, r) => /* @__PURE__ */ t("input", {
+			ref: (e) => {
+				o.current[r] = e;
+			},
+			className: "otp-input__box",
+			value: n,
+			onChange: (e) => l(r, e.target.value),
+			onKeyDown: (e) => d(r, e),
+			onPaste: f,
+			disabled: i,
+			inputMode: "text",
+			maxLength: 1,
+			"aria-label": `Digit ${r + 1} of ${e}`
+		}, r))
+	});
+}
+//#endregion
+//#region src/components/LoadingOverlay.tsx
+function st({ active: e, children: r, label: i = "Loading" }) {
+	return /* @__PURE__ */ n("div", {
+		className: "loading-overlay",
+		children: [r, e && /* @__PURE__ */ t("div", {
+			className: "loading-overlay__veil",
+			role: "status",
+			"aria-label": i,
+			children: /* @__PURE__ */ t(U, {})
+		})]
+	});
+}
+//#endregion
+//#region src/components/ErrorBoundary.tsx
+var ct = class extends r {
+	state = { error: null };
+	static getDerivedStateFromError(e) {
+		return { error: e };
+	}
+	componentDidCatch(e, t) {
+		this.props.onError?.(e, t);
+	}
+	reset = () => this.setState({ error: null });
+	render() {
+		let { error: e } = this.state;
+		return e ? this.props.fallback ? this.props.fallback(e, this.reset) : /* @__PURE__ */ n(K, {
+			tone: "danger",
+			title: "Something went wrong",
+			children: [/* @__PURE__ */ t("div", {
+				className: "error-boundary__message",
+				children: e.message
+			}), /* @__PURE__ */ t("div", {
+				className: "error-boundary__actions",
+				children: /* @__PURE__ */ t(A, {
+					variant: "secondary",
+					size: "sm",
+					onClick: this.reset,
+					children: "Try again"
+				})
+			})]
+		}) : this.props.children;
+	}
+};
+//#endregion
+//#region src/components/Carousel.tsx
+function lt({ items: r, autoPlay: i = !1, interval: a = 4e3 }) {
+	let [o, c] = d(0);
+	if (s(() => {
+		if (!i || r.length <= 1) return;
+		let e = setInterval(() => c((e) => (e + 1) % r.length), a);
+		return () => clearInterval(e);
+	}, [
+		i,
+		a,
+		r.length
+	]), !r.length) return null;
+	let l = (e) => c((t) => (t + e + r.length) % r.length);
+	return /* @__PURE__ */ n("div", {
+		className: "carousel",
+		children: [/* @__PURE__ */ n("div", {
+			className: "carousel__viewport",
+			children: [/* @__PURE__ */ t("div", {
+				className: "carousel__slide",
+				children: r[o]
+			}, o), r.length > 1 && /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t("button", {
+				type: "button",
+				className: "carousel__nav carousel__nav--prev",
+				"aria-label": "Previous slide",
+				onClick: () => l(-1),
+				children: /* @__PURE__ */ t(y, {
+					name: "chevron-left",
+					size: 18
+				})
+			}), /* @__PURE__ */ t("button", {
+				type: "button",
+				className: "carousel__nav carousel__nav--next",
+				"aria-label": "Next slide",
+				onClick: () => l(1),
+				children: /* @__PURE__ */ t(y, {
+					name: "chevron-right",
+					size: 18
+				})
+			})] })]
+		}), r.length > 1 && /* @__PURE__ */ t("div", {
+			className: "carousel__dots",
+			role: "tablist",
+			children: r.map((e, n) => /* @__PURE__ */ t("button", {
+				type: "button",
+				role: "tab",
+				"aria-selected": n === o,
+				"aria-label": `Go to slide ${n + 1}`,
+				className: `carousel__dot${n === o ? " carousel__dot--active" : ""}`,
+				onClick: () => c(n)
+			}, n))
+		})]
+	});
+}
+//#endregion
+//#region src/components/Portal.tsx
+function ut({ children: e }) {
+	return typeof document > "u" ? null : f(e, document.body);
+}
+//#endregion
+//#region src/hooks/useClickOutside.ts
+function dt(e, t, n = !0) {
+	s(() => {
+		if (!n) return;
+		let r = (n) => {
+			e.current && !e.current.contains(n.target) && t();
+		}, i = (e) => {
+			e.key === "Escape" && t();
+		};
+		return document.addEventListener("mousedown", r), document.addEventListener("keydown", i), () => {
+			document.removeEventListener("mousedown", r), document.removeEventListener("keydown", i);
+		};
+	}, [
+		e,
+		t,
+		n
+	]);
+}
+//#endregion
+//#region src/chartTheme.ts
+var ft = [
+	"#8FB4F5",
+	"#7FD8C9",
+	"#C9A8F0",
+	"#F5C88F",
+	"#F19A9A",
+	"#A9B4F0",
+	"#8FCBEE",
+	"#F5AFD1",
+	"#B9DE9E"
+], Y = {
+	size: 11,
+	family: "'IBM Plex Mono', monospace"
+}, X = {
+	gridColor: "#F1F2F5",
+	axisColor: "#9CA3AF",
+	tooltip: {
+		backgroundColor: "#FFFFFF",
+		titleColor: "#0B0D12",
+		bodyColor: "#4B5563",
+		borderColor: "#E7E9EE"
+	}
+};
+function Z() {
+	if (typeof document > "u") return X;
+	let e = getComputedStyle(document.documentElement), t = (t, n) => e.getPropertyValue(t).trim() || n;
+	return {
+		gridColor: t("--neutral-100", X.gridColor),
+		axisColor: t("--neutral-400", X.axisColor),
+		tooltip: {
+			backgroundColor: t("--neutral-0", X.tooltip.backgroundColor),
+			titleColor: t("--neutral-1000", X.tooltip.titleColor),
+			bodyColor: t("--neutral-600", X.tooltip.bodyColor),
+			borderColor: t("--card-border", X.tooltip.borderColor)
+		}
+	};
+}
+var pt = Z().axisColor, mt = Z().gridColor, ht = {
+	...Z().tooltip,
+	borderWidth: 1,
+	padding: 8,
+	cornerRadius: 8,
+	titleFont: {
+		size: 12,
+		weight: 600,
+		family: "'Space Grotesk', sans-serif"
+	},
+	bodyFont: {
+		size: 12,
+		family: "'IBM Plex Mono', monospace"
+	}
+};
+function Q() {
+	return {
+		...Z().tooltip,
+		borderWidth: 1,
+		padding: 8,
+		cornerRadius: 8,
+		titleFont: {
+			size: 12,
+			weight: 600,
+			family: "'Space Grotesk', sans-serif"
+		},
+		bodyFont: {
+			size: 12,
+			family: "'IBM Plex Mono', monospace"
+		}
+	};
+}
+var $ = {
+	boxWidth: 10,
+	font: {
+		size: 11,
+		family: "'IBM Plex Mono', monospace"
+	}
+};
+function gt(e) {
+	if (typeof window > "u") return () => {};
+	let t = window.matchMedia("(prefers-color-scheme: dark)");
+	t.addEventListener("change", e);
+	let n = new MutationObserver(e);
+	return n.observe(document.documentElement, {
+		attributes: !0,
+		attributeFilter: ["data-theme"]
+	}), () => {
+		t.removeEventListener("change", e), n.disconnect();
+	};
+}
+function _t(e, { rotateXTicks: t = !1, maxTicks: n, longLabels: r = !1 } = {}) {
+	let { gridColor: i, axisColor: a } = Z();
+	return {
+		responsive: !0,
+		maintainAspectRatio: !1,
+		layout: { padding: { bottom: t ? 8 : 0 } },
+		animation: {
+			duration: 500,
+			easing: "easeOutQuad"
+		},
+		interaction: {
+			mode: "index",
+			intersect: !1
+		},
+		plugins: {
+			legend: {
+				position: "bottom",
+				labels: $
+			},
+			tooltip: Q()
+		},
+		scales: {
+			x: {
+				ticks: {
+					font: Y,
+					color: a,
+					autoSkip: !0,
+					...r ? {
+						maxRotation: 90,
+						minRotation: 0
+					} : t ? {
+						maxRotation: 35,
+						minRotation: 35
+					} : {},
+					...n ? { maxTicksLimit: n } : {}
+				},
+				grid: { color: i }
+			},
+			y: {
+				position: "left",
+				beginAtZero: !0,
+				ticks: {
+					font: Y,
+					color: a
+				},
+				grid: { color: i }
+			},
+			y1: {
+				position: "right",
+				min: 0,
+				max: 100,
+				ticks: {
+					font: Y,
+					color: a,
+					callback: (t) => `${t}${e}`
+				},
+				grid: { drawOnChartArea: !1 }
+			}
+		}
+	};
+}
+function vt({ cutout: e = "65%", showLegend: t = !0 } = {}) {
+	return {
+		responsive: !0,
+		maintainAspectRatio: !1,
+		cutout: e,
+		animation: {
+			duration: 500,
+			easing: "easeOutQuad"
+		},
+		plugins: {
+			legend: t ? {
+				position: "bottom",
+				labels: $
+			} : { display: !1 },
+			tooltip: Q()
+		}
+	};
+}
+function yt({ maxTicks: e, beginAtZero: t = !0 } = {}) {
+	let { gridColor: n, axisColor: r } = Z();
+	return {
+		indexAxis: "y",
+		responsive: !0,
+		maintainAspectRatio: !1,
+		animation: {
+			duration: 500,
+			easing: "easeOutQuad"
+		},
+		plugins: {
+			legend: { display: !1 },
+			tooltip: Q()
+		},
+		scales: {
+			x: {
+				beginAtZero: t,
+				ticks: {
+					font: Y,
+					color: r,
+					...e ? { maxTicksLimit: e } : {}
+				},
+				grid: { color: n }
+			},
+			y: {
+				ticks: {
+					font: Y,
+					color: r
+				},
+				grid: { display: !1 }
+			}
+		}
+	};
+}
+function bt({ maxTicks: e, beginAtZero: t = !0, unit: n = "" } = {}) {
+	let { gridColor: r, axisColor: i } = Z();
+	return {
+		responsive: !0,
+		maintainAspectRatio: !1,
+		animation: {
+			duration: 500,
+			easing: "easeOutQuad"
+		},
+		interaction: {
+			mode: "index",
+			intersect: !1
+		},
+		plugins: {
+			legend: { display: !1 },
+			tooltip: Q()
+		},
+		scales: {
+			x: {
+				ticks: {
+					font: Y,
+					color: i,
+					autoSkip: !0,
+					...e ? { maxTicksLimit: e } : {}
+				},
+				grid: { color: r }
+			},
+			y: {
+				beginAtZero: t,
+				ticks: {
+					font: Y,
+					color: i,
+					callback: (e) => `${e}${n}`
+				},
+				grid: { color: r }
+			}
+		}
+	};
+}
+function xt({ maxTicks: e, rotateXTicks: t = !1 } = {}) {
+	let { gridColor: n, axisColor: r } = Z();
+	return {
+		responsive: !0,
+		maintainAspectRatio: !1,
+		animation: {
+			duration: 500,
+			easing: "easeOutQuad"
+		},
+		interaction: {
+			mode: "index",
+			intersect: !1
+		},
+		plugins: {
+			legend: {
+				position: "bottom",
+				labels: $
+			},
+			tooltip: Q()
+		},
+		scales: {
+			x: {
+				stacked: !0,
+				ticks: {
+					font: Y,
+					color: r,
+					autoSkip: !0,
+					...t ? {
+						maxRotation: 35,
+						minRotation: 35
+					} : {},
+					...e ? { maxTicksLimit: e } : {}
+				},
+				grid: { color: n }
+			},
+			y: {
+				stacked: !0,
+				beginAtZero: !0,
+				ticks: {
+					font: Y,
+					color: r
+				},
+				grid: { color: n }
+			}
+		}
+	};
+}
+function St() {
+	let { gridColor: e, axisColor: t } = Z();
+	return {
+		responsive: !0,
+		maintainAspectRatio: !1,
+		animation: {
+			duration: 500,
+			easing: "easeOutQuad"
+		},
+		plugins: {
+			legend: {
+				position: "bottom",
+				labels: $
+			},
+			tooltip: Q()
+		},
+		scales: { r: {
+			angleLines: { color: e },
+			grid: { color: e },
+			pointLabels: {
+				font: Y,
+				color: t
+			},
+			ticks: {
+				font: Y,
+				color: t,
+				backdropColor: "transparent"
+			}
+		} }
+	};
+}
+function Ct(e, t, n) {
+	return e.map((r, i) => {
+		let a = Math.max(0, i - n + 1), o = e.slice(a, i + 1).filter((e) => e[t] != null);
+		if (!o.length) return null;
+		let s = o.reduce((e, n) => e + n[t], 0) / o.length;
+		return Number(s.toFixed(1));
+	});
+}
+//#endregion
+//#region src/chartSetup.ts
+var wt = !1;
+function Tt() {
+	wt || (wt = !0, p.register(...m, h), p.defaults.set("plugins.datalabels", { display: !1 }));
+}
+//#endregion
+export { pt as AXIS_COLOR, Y as AXIS_TICK_FONT, me as Accordion, K as Alert, H as Avatar, Xe as AvatarGroup, j as Badge, se as Breadcrumbs, ve as BulletChart, A as Button, nt as ButtonGroup, fe as Card, lt as Carousel, x as ChartCard, ge as ChartLegend, z as Checkbox, Ze as CodeBlock, it as ColorPicker, ze as Combobox, ke as Container, W as CopyButton, Ke as DatePicker, O as DateRangePicker, Ee as DescriptionList, Ne as Divider, xe as Drawer, pe as EmptyState, ct as ErrorBoundary, Re as Fieldset, Ve as FileUpload, mt as GRID_COLOR, le as Gauge, Me as Grid, je as HStack, Oe as Heading, y as Icon, Ie as IconButton, b as InfoTooltip, M as Input, Qe as Kbd, Pe as Link, Je as List, st as LoadingOverlay, ie as Menu, _e as MiniBar, P as Modal, et as Navbar, Be as NumberStepper, ot as OTPInput, ft as PALETTE, oe as Pagination, at as PasswordInput, Se as Popover, ut as Portal, ce as ProgressBar, B as Radio, te as RadioGroup, qe as Rating, _ as ScoreCard, we as SearchInput, he as SegmentedControl, S as Select, tt as Sidebar, re as Skeleton, ye as Slider, g as Sparkline, U as Spinner, G as Stack, Te as StatusDot, be as Stepper, ee as Switch, ht as TOOLTIP_OPTS, N as Table, k as Tabs, Ce as TagInput, De as Text, ne as Textarea, Ye as Timeline, L as ToastProvider, Le as Tooltip, $e as Tree, Ae as VStack, bt as areaOptions, vt as donutOptions, _t as dualAxisOptions, Z as getChartColors, yt as horizontalBarOptions, Tt as installCharts, gt as onThemeChange, St as radarOptions, Ct as rollingAverage, xt as stackedBarOptions, dt as useClickOutside, R as useToast };
+
+//# sourceMappingURL=index.js.map