@wular/coder 0.4.8 → 0.4.9

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/app/dash/[org]/usage/{custom-range.471edcb853889c2e.js → custom-range.2d55812ec086b540.js}

@@ -1,29 +1,26 @@
 "use client";
-import { iDown } from "../../../../comps/ui/icons.868385119bf2de28.js";
+import { iDown } from "../../../../comps/ui/icons.a34176f37808cd66.js";
 import { useRouter } from "../../../../../../../../../node_modules/@wular/pnext/src/api/client-navigation.ts";
 import { linkOf, withSearch } from "../../../../comps/nav/to.a2c840c09bd4bf4a.js";
 import { Icon } from "../../../../comps/ui/icon.0874ca2f58f7db14.js";
-import { useId } from "../../../../../../../../../node_modules/preact/hooks/dist/hooks.mjs";
-import { jsx as _jsx, jsxs as _jsxs } from "../../../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
+import { Button } from "../../../../comps/ui/button.983daea9e687fc5d.js";
+import { Field } from "../../../../comps/ui/field.75588c33b72824a7.js";
+import { Menu } from "../../../../comps/ui/menu.a41edd5cde1c90cf.js";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "../../../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
 /** Custom from and to dates; applying them moves the page to that range. */
 export function CustomRange({ page, from, to, today, on }) {
 	const nav = useRouter();
-	const id = useId();
-	return /* @__PURE__ */ _jsxs("span", {
-		class: on ? "menu custom on" : "menu custom",
-		children: [/* @__PURE__ */ _jsxs("button", {
-			popovertarget: id,
-			type: "button",
-			children: ["Custom", /* @__PURE__ */ _jsx(Icon, { d: iDown })]
-		}), /* @__PURE__ */ _jsxs("form", {
-			id,
-			class: "pop date-pop",
-			popover: "auto",
+	return /* @__PURE__ */ _jsx(Menu, {
+		class: on ? "custom on" : "custom",
+		align: "left",
+		summary: /* @__PURE__ */ _jsxs(_Fragment, { children: ["Custom", /* @__PURE__ */ _jsx(Icon, { d: iDown })] }),
+		children: /* @__PURE__ */ _jsxs("form", {
+			class: "date-pop",
 			onSubmit: (event) => {
 				event.preventDefault();
 				const values = new FormData(event.currentTarget);
 				const [start, end] = [String(values.get("from")), String(values.get("to"))].sort();
-				event.currentTarget.hidePopover();
+				event.currentTarget.closest("[popover]")?.hidePopover();
 				nav.push(page.href, {
 					params: linkOf(page).params,
 					search: withSearch(page.search, {
@@ -34,31 +31,33 @@ export function CustomRange({ page, from, to, today, on }) {
 				});
 			},
 			children: [
-				/* @__PURE__ */ _jsxs("label", {
-					class: "field",
-					children: [/* @__PURE__ */ _jsx("span", { children: "From" }), /* @__PURE__ */ _jsx("input", {
+				/* @__PURE__ */ _jsx(Field, {
+					label: "From",
+					children: /* @__PURE__ */ _jsx("input", {
 						type: "date",
 						name: "from",
 						defaultValue: from,
 						max: today,
 						required: true
-					})]
+					})
 				}),
-				/* @__PURE__ */ _jsxs("label", {
-					class: "field",
-					children: [/* @__PURE__ */ _jsx("span", { children: "To" }), /* @__PURE__ */ _jsx("input", {
+				/* @__PURE__ */ _jsx(Field, {
+					label: "To",
+					children: /* @__PURE__ */ _jsx("input", {
 						type: "date",
 						name: "to",
 						defaultValue: to,
 						max: today,
 						required: true
-					})]
+					})
 				}),
-				/* @__PURE__ */ _jsx("button", {
-					class: "btn sm",
+				/* @__PURE__ */ _jsx(Button, {
+					type: "submit",
+					size: "sm",
+					"data-keep": true,
 					children: "Apply"
 				})
 			]
-		})]
+		})
 	});
 }

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/app/dash/[org]/usage/{day-chart.d40438efa74b0596.js → day-chart.08d378cca93d3ab1.js}

@@ -1,5 +1,5 @@
 import "./day-chart.4b3dbef8704de0e0.css.pnext-asset.js";
-import { Empty } from "../../../../comps/ui/card.6227f43fc0ae4bd1.js";
+import { Empty } from "../../../../comps/ui/card.c08471eaa0bc1cec.js";
 import { formatMetric } from "./metric.ada350d2b7449b39.js";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "../../../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
 const OTHER = {

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/app/dash/[org]/usage/{loading.5b28c7d8f3a473a3.js → loading.7aed78a276b08a4f.js}

@@ -2,9 +2,9 @@ import "./@/comps/ui/segmented.41728247cda62f82.css.pnext-asset.js";
 import "./@/app/dash/[org]/usage/range-bar.85d30ec5f022f124.css.pnext-asset.js";
 import "./usage.775df2f43187c487.css.pnext-asset.js";
 import { HEADS } from "../../../../comps/frame/heads.20414ddcb2d08bcd.js";
-import { LoadingRange } from "./range-bar.884e58b044238e98.js";
-import { Loading } from "../../../../comps/ui/card.6227f43fc0ae4bd1.js";
-import { Page, PageHead } from "../../../../comps/frame/page-head.e5d2185c1cdac740.js";
+import { LoadingRange } from "./range-bar.b1296c2378128472.js";
+import { Loading } from "../../../../comps/ui/card.c08471eaa0bc1cec.js";
+import { Page, PageHead } from "../../../../comps/frame/page-head.bd54e52ac4a7a89c.js";
 import { jsx as _jsx, jsxs as _jsxs } from "../../../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
 export default function UsageLoading() {
 	return /* @__PURE__ */ _jsxs(Page, { children: [

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/app/dash/[org]/usage/{page.69adbf6cde427292.js → page.fed9345ebac3e1b3.js}

@@ -4,14 +4,14 @@ import "./usage.775df2f43187c487.css.pnext-asset.js";
 import { formatCompact, formatCount, formatDuration, zoneOf } from "../../../../utils/format.6a7d1beaf4d09d9c.js";
 import { daysIn, rangeFor } from "../../../../utils/range.f73ba9cac0a60af1.js";
 import { load, orgOf } from "../../../../api/load.4f942c7f68b2e273.js";
-import { Card } from "../../../../comps/ui/card.6227f43fc0ae4bd1.js";
-import { Page, PageHead } from "../../../../comps/frame/page-head.e5d2185c1cdac740.js";
+import { Card } from "../../../../comps/ui/card.c08471eaa0bc1cec.js";
+import { Page, PageHead } from "../../../../comps/frame/page-head.bd54e52ac4a7a89c.js";
 import { Stat, Stats } from "./stats.de820599cf126120.js";
-import { Settle } from "../../../../comps/frame/stream.2fea238dc4f4f9a4.js";
+import { Settle } from "../../../../comps/frame/stream.1cc355a530dcc5e3.js";
 import { HEADS } from "../../../../comps/frame/heads.20414ddcb2d08bcd.js";
-import { TopAgents } from "./top-agents.b00f571862b5b608.js";
-import { DayChart } from "./day-chart.d40438efa74b0596.js";
-import { RangeBar } from "./range-bar.884e58b044238e98.js";
+import { TopAgents } from "./top-agents.e215d44e00192271.js";
+import { DayChart } from "./day-chart.08d378cca93d3ab1.js";
+import { RangeBar } from "./range-bar.b1296c2378128472.js";
 import { METRIC_LABEL } from "./metric.ada350d2b7449b39.js";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "../../../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
 const SORT_METRIC = {

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/app/dash/[org]/usage/range-bar.b1296c2378128472.js

@@ -0,0 +1,57 @@
+import "./range-bar.476c059123ef6c23.css.pnext-asset.js";
+import { PRESETS, dayOf } from "../../../../utils/range.f73ba9cac0a60af1.js";
+import { CustomRange } from "./custom-range.2d55812ec086b540.js";
+import { linkOf, withSearch } from "../../../../comps/nav/to.a2c840c09bd4bf4a.js";
+import { iDown } from "../../../../comps/ui/icons.a34176f37808cd66.js";
+import { Icon } from "../../../../comps/ui/icon.0874ca2f58f7db14.js";
+import { BLANK } from "../../../../comps/frame/loading-card.0c6ac62ff3ccf38a.js";
+import { LoadingMenu } from "../../../../comps/ui/menu-items.a8e580a0c90631ff.js";
+import { Segmented } from "../../../../comps/ui/segmented.a08dc08338d080e9.js";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "../../../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
+const OPTIONS = Object.entries(PRESETS).map(([key, preset]) => [key, preset.short]);
+/** Presets and a custom span, for the usage pages. */
+export function RangeBar({ range, to, tz }) {
+	const today = dayOf(Date.now(), tz);
+	return /* @__PURE__ */ _jsxs("div", {
+		class: "range-line",
+		children: [/* @__PURE__ */ _jsx(Segmented, {
+			label: "Range",
+			options: OPTIONS,
+			value: range.key,
+			link: (key) => ({
+				...linkOf(to),
+				search: withSearch(to.search, { range: key }),
+				scroll: false
+			}),
+			children: /* @__PURE__ */ _jsx(CustomRange, {
+				page: to,
+				from: range.from ?? dayOf(range.since, tz),
+				to: range.to ?? today,
+				today,
+				on: range.key === "custom"
+			})
+		}), /* @__PURE__ */ _jsx("span", {
+			class: "muted",
+			children: range.label
+		})]
+	});
+}
+/** A usage range bar before its page arrives; the range it shows comes with the page. */
+export function LoadingRange() {
+	return /* @__PURE__ */ _jsxs("div", {
+		class: "range-line",
+		"aria-hidden": "true",
+		children: [/* @__PURE__ */ _jsx(Segmented, {
+			label: "Range",
+			options: OPTIONS,
+			value: "",
+			children: /* @__PURE__ */ _jsx(LoadingMenu, {
+				class: "custom",
+				summary: /* @__PURE__ */ _jsxs(_Fragment, { children: ["Custom", /* @__PURE__ */ _jsx(Icon, { d: iDown })] })
+			})
+		}), /* @__PURE__ */ _jsx("span", {
+			class: "muted",
+			children: BLANK
+		})]
+	});
+}

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/app/dash/[org]/usage/{top-agents.b00f571862b5b608.js → top-agents.e215d44e00192271.js}

@@ -1,8 +1,8 @@
 import "./top-agents.20a1d4451784792b.css.pnext-asset.js";
-import { iDown, iUp } from "../../../../comps/ui/icons.868385119bf2de28.js";
+import { iDown, iUp } from "../../../../comps/ui/icons.a34176f37808cd66.js";
 import { Link } from "../../../../../../../../../node_modules/@wular/pnext/src/api/link.tsx";
 import { withSearch } from "../../../../comps/nav/to.a2c840c09bd4bf4a.js";
-import { Card, Empty } from "../../../../comps/ui/card.6227f43fc0ae4bd1.js";
+import { Card, Empty } from "../../../../comps/ui/card.c08471eaa0bc1cec.js";
 import { Icon } from "../../../../comps/ui/icon.0874ca2f58f7db14.js";
 import { formatMetric } from "./metric.ada350d2b7449b39.js";
 import { jsx as _jsx, jsxs as _jsxs } from "../../../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/app/{layout.ab6f86cc5b8b2dab.js → layout.b7e3af142b17941b.js}

@@ -1,4 +1,4 @@
-import "./globals.76731787d2a1aa3b.css.pnext-asset.js";
+import "./globals.dccea8b03fa4b6d2.css.pnext-asset.js";
 import "./responsive.82549d958fae8f00.css.pnext-asset.js";
 import { Zone } from "./zone.dbc84f981415d8f7.js";
 import { jsx as _jsx, jsxs as _jsxs } from "../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/app/login/{page.088b41424cd6cf3c.js → page.226544940a39fd3a.js}

@@ -1,6 +1,7 @@
-import "./page.57e5198339e9ca28.css.pnext-asset.js";
+import "./page.586a41a7ab9988e0.css.pnext-asset.js";
 import { redirect } from "../../../../../../../node_modules/@wular/pnext/src/api/navigation.ts";
 import { AuthPanel } from "../../comps/frame/auth-panel.5712a8d190b003b4.js";
+import { Button } from "../../comps/ui/button.983daea9e687fc5d.js";
 import { safeReturnPath } from "../../../auth/sign-in.661b3a4139af5bd7.js";
 import { load } from "../../api/load.4f942c7f68b2e273.js";
 import { jsx as _jsx, jsxs as _jsxs } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
@@ -28,8 +29,9 @@ function LoginPage({ signIn, error }) {
 		lead: "Coder signs you in with your Wular Auth account.",
 		children: [/* @__PURE__ */ _jsx("div", {
 			class: "provider-grid",
-			children: /* @__PURE__ */ _jsxs("a", {
-				class: "btn outline provider",
+			children: /* @__PURE__ */ _jsxs(Button, {
+				variant: "outline",
+				class: "provider",
 				href: signIn,
 				children: [WULAR_LOGO, /* @__PURE__ */ _jsx("span", { children: "Sign in with Wular Auth" })]
 			})

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/comps/frame/{drawer.0e2e3636f33049f5.js → drawer.8287e5a02144e4f1.js}

@@ -1,9 +1,9 @@
 "use client";
-import "./drawer.e8201d78154045bc.css.pnext-asset.js";
+import "./drawer.0b0220d1edabce29.css.pnext-asset.js";
 import { useEffect, useState } from "../../../../../../../node_modules/preact/hooks/dist/hooks.mjs";
 import { usePathname } from "../../../../../../../node_modules/@wular/pnext/src/api/client-navigation.ts";
-import { iMenu } from "../ui/icons.868385119bf2de28.js";
-import { Icon } from "../ui/icon.0874ca2f58f7db14.js";
+import { iMenu } from "../ui/icons.a34176f37808cd66.js";
+import { IconButton } from "../ui/button.983daea9e687fc5d.js";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
 /** The phone layout's navigation drawer: its button and the scrim behind it; Escape or a new page closes it. */
 export function Drawer() {
@@ -19,12 +19,11 @@ export function Drawer() {
 		addEventListener("keydown", onKey);
 		return () => removeEventListener("keydown", onKey);
 	}, [open]);
-	return /* @__PURE__ */ _jsxs(_Fragment, { children: [/* @__PURE__ */ _jsx("button", {
-		type: "button",
-		class: "icon-btn only-m",
-		"aria-label": "Open navigation",
-		onClick: () => setOpen(!open),
-		children: /* @__PURE__ */ _jsx(Icon, { d: iMenu })
+	return /* @__PURE__ */ _jsxs(_Fragment, { children: [/* @__PURE__ */ _jsx(IconButton, {
+		icon: iMenu,
+		label: "Open navigation",
+		class: "only-m",
+		onClick: () => setOpen(!open)
 	}), /* @__PURE__ */ _jsx("div", {
 		class: "scrim",
 		onClick: () => setOpen(false)

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/comps/frame/{foreign-link.fe46528a6a66c0f4.js → foreign-link.86f0cc228353da6e.js}

@@ -1,6 +1,7 @@
 "use client";
-import { iAlert } from "../ui/icons.868385119bf2de28.js";
-import { Modal } from "../ui/modal.92432959e3a3e2c0.js";
+import { iAlert } from "../ui/icons.a34176f37808cd66.js";
+import { Button } from "../ui/button.983daea9e687fc5d.js";
+import { Modal } from "../ui/modal.b5f74ebf59590fa6.js";
 import { jsx as _jsx } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
 /** Opened from a link of a workspace this account is not in: says so, and offers signing in as another account. */
 export function ForeignLink({ link }) {
@@ -14,8 +15,7 @@ export function ForeignLink({ link }) {
 		title: "Not in this workspace",
 		icon: iAlert,
 		cancel: "Stay here",
-		actions: /* @__PURE__ */ _jsx("a", {
-			class: "btn",
+		actions: /* @__PURE__ */ _jsx(Button, {
 			href: again,
 			children: "Sign in with another account"
 		}),

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/comps/frame/loading-card.0c6ac62ff3ccf38a.js

@@ -0,0 +1,40 @@
+import { Button } from "../ui/button.983daea9e687fc5d.js";
+import { Card, Loading } from "../ui/card.c08471eaa0bc1cec.js";
+import { LoadingFilter } from "../ui/filter.1983b85dd0679af6.js";
+import { Select } from "../ui/select.36c6f21ce6aa720f.js";
+import { Search, Toolbar } from "../ui/toolbar.9621ef221a896a8e.js";
+import { jsx as _jsx, jsxs as _jsxs } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
+export const BLANK = "\xA0";
+/** `Loading` inside the box its data fills, titled as that box. */
+export function LoadingCard({ title, label, h }) {
+	return /* @__PURE__ */ _jsx(Card, {
+		title,
+		children: /* @__PURE__ */ _jsx(Loading, {
+			label,
+			h
+		})
+	});
+}
+/** A list's toolbar while the list loads: the same title and controls, inert until the list is live. */
+export function LoadingToolbar({ head, search, selects = [], more, action }) {
+	return /* @__PURE__ */ _jsxs(Toolbar, {
+		head,
+		action: action ? /* @__PURE__ */ _jsx(Button, {
+			disabled: true,
+			leftIcon: action.icon,
+			children: action.label
+		}) : undefined,
+		children: [
+			/* @__PURE__ */ _jsx(Search, {
+				label: search,
+				disabled: true
+			}),
+			selects.map((label) => /* @__PURE__ */ _jsx(Select, {
+				label,
+				options: [["", label]],
+				disabled: true
+			}, label)),
+			more ? /* @__PURE__ */ _jsx(LoadingFilter, {}) : null
+		]
+	});
+}

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/comps/frame/{page-head.e5d2185c1cdac740.js → page-head.bd54e52ac4a7a89c.js}

@@ -1,10 +1,11 @@
 import "./page-head.364ec93a8e7857b3.css.pnext-asset.js";
-import { iLeft } from "../ui/icons.868385119bf2de28.js";
+import { iLeft } from "../ui/icons.a34176f37808cd66.js";
 import { Link } from "../../../../../../../node_modules/@wular/pnext/src/api/link.tsx";
 import { linkOf } from "../nav/to.a2c840c09bd4bf4a.js";
 import { HEADS } from "./heads.20414ddcb2d08bcd.js";
 import { Icon } from "../ui/icon.0874ca2f58f7db14.js";
 import { Sentinel } from "../ui/sentinel.17cffebfc3103b9f.js";
+import { BLANK } from "./loading-card.0c6ac62ff3ccf38a.js";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
 export function Page({ narrow, children }) {
 	return /* @__PURE__ */ _jsx("div", {
@@ -41,6 +42,12 @@ export function Back({ label, back, named, ...to }) {
 		children: [/* @__PURE__ */ _jsx(Icon, { d: iLeft }), /* @__PURE__ */ _jsx("span", { children: name })]
 	});
 }
+/** A `Back` before its page arrives: the arrow, inert. */
+export const LoadingBack = () => /* @__PURE__ */ _jsxs("span", {
+	class: "back",
+	"aria-hidden": "true",
+	children: [/* @__PURE__ */ _jsx(Icon, { d: iLeft }), BLANK]
+});
 /** The page title row with its meta and actions, and one muted lead line; it sticks under the top bar and turns compact there. */
 export function PageHead({ title, lead, actions, meta, back }) {
 	return /* @__PURE__ */ _jsxs(_Fragment, { children: [/* @__PURE__ */ _jsx(Sentinel, {}), /* @__PURE__ */ _jsxs("header", {

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/comps/frame/{stream.2fea238dc4f4f9a4.js → stream.1cc355a530dcc5e3.js}

@@ -1,6 +1,6 @@
 import { Suspense } from "../../../../../../../node_modules/preact/compat/dist/compat.mjs";
 import { signedOut } from "../../api/load.4f942c7f68b2e273.js";
-import { Card } from "../ui/card.6227f43fc0ae4bd1.js";
+import { Card } from "../ui/card.c08471eaa0bc1cec.js";
 import { reasonText } from "../../utils/format.6a7d1beaf4d09d9c.js";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
 /** A section that waits for `load`, under the route's loading frame; a failure stays inside it. */

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/comps/frame/{task-toasts.4282affa47415a36.js → task-toasts.63f673632770924d.js}

@@ -1,12 +1,12 @@
 "use client";
-import "./@/comps/ui/toast.a4c3e977997216cf.css.pnext-asset.js";
+import "./task-toasts.d13d9f628e530552.css.pnext-asset.js";
 import { useEffect, useRef, useState } from "../../../../../../../node_modules/preact/hooks/dist/hooks.mjs";
 import { serverEvents } from "../../../../client/index.8e150ef2bc6a5f4e.js";
 import { client } from "../../utils/client.d25e6dcc6704eb60.js";
 import { Link } from "../../../../../../../node_modules/@wular/pnext/src/api/link.tsx";
 import { usePathname, useRouter } from "../../../../../../../node_modules/@wular/pnext/src/api/client-navigation.ts";
 import { Status, STATUS_LABEL } from "../../app/dash/[org]/tasks/list/status.16190fdd5fd7daad.js";
-import { useOrg } from "../nav/org.813dc34bd23a336f.js";
+import { useOrg } from "../nav/org.4d84ad0ac340fbe2.js";
 import { jsx as _jsx, jsxs as _jsxs } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
 const WATCHED = "coder:watched";
 export const NOTIFY = "coder:notify";

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/comps/frame/{theme-choices.ef190ef1cd197199.js → theme-choices.5f59814a635caeec.js}

@@ -1,8 +1,8 @@
 "use client";
 import { useState } from "../../../../../../../node_modules/preact/hooks/dist/hooks.mjs";
-import { iCheck, iMonitor, iMoon, iSun } from "../ui/icons.868385119bf2de28.js";
-import { Icon } from "../ui/icon.0874ca2f58f7db14.js";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
+import { iMonitor, iMoon, iSun } from "../ui/icons.a34176f37808cd66.js";
+import { MenuRadio } from "../ui/menu-items.a8e580a0c90631ff.js";
+import { jsx as _jsx, Fragment as _Fragment } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
 const YEAR = 60 * 60 * 24 * 365;
 const THEMES = [
 	[
@@ -31,19 +31,10 @@ export function ThemeChoices({ theme: initial }) {
 		document.cookie = `theme=${value}; path=/; max-age=${YEAR}; samesite=lax`;
 		setTheme(value);
 	};
-	return /* @__PURE__ */ _jsx(_Fragment, { children: THEMES.map(([value, label, icon]) => /* @__PURE__ */ _jsxs("button", {
-		type: "button",
-		class: "pop-item",
-		role: "menuitemradio",
-		"aria-checked": theme === value,
-		onClick: () => pick(value),
-		children: [
-			/* @__PURE__ */ _jsx(Icon, { d: icon }),
-			/* @__PURE__ */ _jsx("span", {
-				class: "grow",
-				children: label
-			}),
-			/* @__PURE__ */ _jsx(Icon, { d: iCheck })
-		]
+	return /* @__PURE__ */ _jsx(_Fragment, { children: THEMES.map(([value, label, icon]) => /* @__PURE__ */ _jsx(MenuRadio, {
+		on: theme === value,
+		onPick: () => pick(value),
+		icon,
+		children: label
 	}, value)) });
 }

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/comps/nav/{back.af528135d7e33d6d.js → back.5681714d0cf45454.js}

@@ -1,12 +1,12 @@
 "use client";
 import { useEffect } from "../../../../../../../node_modules/preact/hooks/dist/hooks.mjs";
-import { Link } from "../../../../../../../node_modules/@wular/pnext/src/api/link.tsx";
-import { Back } from "../frame/page-head.e5d2185c1cdac740.js";
-import { useOrg } from "./org.813dc34bd23a336f.js";
+import { Back } from "../frame/page-head.bd54e52ac4a7a89c.js";
+import { LinkButton } from "../ui/button.983daea9e687fc5d.js";
+import { useOrg } from "./org.4d84ad0ac340fbe2.js";
 import { BACK_COOKIE, rememberedBack } from "./back-cookie.942c0904e944d8d6.js";
 import { jsx as _jsx } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
 /** Settings' credentials tab; it links back to this page, named `label` where its section name is not enough. */
-export function CredentialsLink({ class: cls, label, children }) {
+export function CredentialsLink({ label, children, ...look }) {
 	const remember = () => {
 		const value = encodeURIComponent(JSON.stringify({
 			path: location.pathname,
@@ -14,8 +14,8 @@ export function CredentialsLink({ class: cls, label, children }) {
 		}));
 		document.cookie = `${BACK_COOKIE}=${value}; path=/dash; max-age=600; samesite=lax`;
 	};
-	return /* @__PURE__ */ _jsx(Link, {
-		class: cls,
+	return /* @__PURE__ */ _jsx(LinkButton, {
+		...look,
 		href: "/dash/[org]/settings/[tab]",
 		params: {
 			org: useOrg(),

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/comps/nav/{org.813dc34bd23a336f.js → org.4d84ad0ac340fbe2.js}

@@ -1,7 +1,7 @@
 "use client";
 import { Link } from "../../../../../../../node_modules/@wular/pnext/src/api/link.tsx";
 import { useParams } from "../../../../../../../node_modules/@wular/pnext/src/api/client-navigation.ts";
-import { Back } from "../frame/page-head.e5d2185c1cdac740.js";
+import { Back } from "../frame/page-head.bd54e52ac4a7a89c.js";
 import { linkOf } from "./to.a2c840c09bd4bf4a.js";
 import { jsx as _jsx } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
 /** The organization in the address, `/dash/<org>/…`. */

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/comps/nav/{side-toggle.bafcb4b273b1c4d0.js → side-toggle.249400957d6a7527.js}

@@ -1,7 +1,7 @@
 "use client";
 import { useEffect, useState } from "../../../../../../../node_modules/preact/hooks/dist/hooks.mjs";
-import { iLeft, iRight } from "../ui/icons.868385119bf2de28.js";
-import { Icon } from "../ui/icon.0874ca2f58f7db14.js";
+import { iLeft, iRight } from "../ui/icons.a34176f37808cd66.js";
+import { IconButton } from "../ui/button.983daea9e687fc5d.js";
 import { jsx as _jsx } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
 const COOKIE = "side";
 /** Collapses the sidebar to its icons; a click is saved in a cookie so the next page renders that way at once. */
@@ -25,12 +25,12 @@ export function SideToggle({ collapsed: initial }) {
 		document.querySelector(".app")?.classList.toggle("side-min", next);
 		document.cookie = `${COOKIE}=${next ? "min" : "max"}; path=/; max-age=31536000; samesite=lax`;
 	};
-	return /* @__PURE__ */ _jsx("button", {
-		type: "button",
-		class: "icon-btn side-toggle",
-		"aria-label": collapsed ? "Expand sidebar" : "Collapse sidebar",
-		"data-tip": collapsed ? "Expand sidebar" : "Collapse sidebar",
-		onClick: toggle,
-		children: /* @__PURE__ */ _jsx(Icon, { d: collapsed ? iRight : iLeft })
+	const label = collapsed ? "Expand sidebar" : "Collapse sidebar";
+	return /* @__PURE__ */ _jsx(IconButton, {
+		icon: collapsed ? iRight : iLeft,
+		label,
+		tip: label,
+		class: "side-toggle",
+		onClick: toggle
 	});
 }

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/comps/ui/badge.0851f234f300c694.js

@@ -0,0 +1,83 @@
+import "./badge.0cb1513f8b077560.css.pnext-asset.js";
+import { MoreList } from "./menu.a41edd5cde1c90cf.js";
+import { jsx as _jsx, jsxs as _jsxs } from "../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
+/** From this many chips on, the first few show and +n opens every one. */
+export const COLLAPSE_FROM = 5;
+export const COLLAPSED = 3;
+/** A tag; with `onClick` a button, with `href` a link, `external` in a new tab. */
+export function Badge({ tone, title, onClick, href, external, class: cls, children }) {
+	const className = [
+		"badge",
+		tone,
+		cls
+	].filter(Boolean).join(" ");
+	if (href) return /* @__PURE__ */ _jsx("a", {
+		class: className,
+		href,
+		title,
+		...external ? {
+			target: "_blank",
+			rel: "noopener noreferrer"
+		} : {},
+		children
+	});
+	if (onClick) return /* @__PURE__ */ _jsx("button", {
+		type: "button",
+		class: className,
+		title,
+		onClick,
+		children
+	});
+	return /* @__PURE__ */ _jsx("span", {
+		class: className,
+		title,
+		children
+	});
+}
+/** A small tag in a row of them; with `onClick` a button, `aria-pressed` for a toggle. */
+export function Chip({ onClick, children, ...rest }) {
+	return onClick ? /* @__PURE__ */ _jsx("button", {
+		...rest,
+		type: "button",
+		class: "chip",
+		onClick,
+		children
+	}) : /* @__PURE__ */ _jsx("span", {
+		class: "chip",
+		children
+	});
+}
+/** A row of chips; `values` shows text, fewer past `COLLAPSE_FROM`, or `children` holds ready ones. */
+export function Chips({ values, label, children }) {
+	if (children) return /* @__PURE__ */ _jsx("span", {
+		class: "chips",
+		role: "group",
+		"aria-label": label,
+		children
+	});
+	const all = (values ?? []).filter((value) => Boolean(value));
+	if (!all.length) return /* @__PURE__ */ _jsx("span", {
+		class: "muted",
+		children: "None"
+	});
+	const chip = (value) => /* @__PURE__ */ _jsx(Chip, { children: value }, value);
+	const collapsed = all.length >= COLLAPSE_FROM;
+	return /* @__PURE__ */ _jsxs("span", {
+		class: "chips",
+		children: [(collapsed ? all.slice(0, COLLAPSED) : all).map(chip), collapsed ? /* @__PURE__ */ _jsx(MoreList, {
+			label: `+${all.length - COLLAPSED}`,
+			children: /* @__PURE__ */ _jsx("span", {
+				class: "chips",
+				children: all.map(chip)
+			})
+		}) : null]
+	});
+}
+/** A record's id: secondary, never a page's or row's label; the line it sits on clips it when space runs out. */
+export function Id({ value, title }) {
+	return /* @__PURE__ */ _jsx("span", {
+		class: "id",
+		title: title ?? value,
+		children: value
+	});
+}