@logicplanes/kaeso-ui 0.4.3 → 0.4.5

package/dist/components/kaeso.js

@@ -1,153 +1,154 @@
 "use client";
-import { t as e } from "../chunks/cn-Dj6sRgkF.js";
+import { t as e } from "../chunks/cn-BjnOAUrA.js";
 import { i as t, r as n } from "../chunks/context-BELWW79w.js";
-import { t as r } from "../chunks/icon-D7ja-_Yk.js";
-import { r as i } from "../chunks/tooltip-OcwO0VUT.js";
-import { a, o, s } from "../chunks/field-TviMvYa2.js";
-import { o as c } from "../chunks/input-2VJuj_M4.js";
-import { a as l } from "../chunks/radio-CDDFpdtL.js";
-import { r as u } from "../chunks/select-x4XVsdCI.js";
-import { t as d } from "../chunks/command-list-C2Y7V_lt.js";
-import { i as f, r as p } from "../chunks/picker-popover-BxyU1U9F.js";
-import { t as m } from "../chunks/badge-C2KtxCLB.js";
-import { a as h, c as g, d as _, f as v, i as y, l as b, n as x, o as S, r as C, s as w, t as T, u as E } from "../chunks/identity-BmhQ6BQ-.js";
+import { t as r } from "../chunks/icon-CBzOwqrX.js";
+import { r as i } from "../chunks/tooltip-Tkm-urbi.js";
+import { a, o, s } from "../chunks/field-D7m-yl-D.js";
+import { o as c } from "../chunks/input-Bo5-UZg2.js";
+import { a as l } from "../chunks/radio-C6GtzF_t.js";
+import { r as u } from "../chunks/select-BqjmQOqx.js";
+import { t as d } from "../chunks/command-list-CypqsC4T.js";
+import { i as f, r as p } from "../chunks/picker-popover-1FHb1LQG.js";
+import { t as m } from "../chunks/badge-C0GC3B9X.js";
+import { a as h, c as g, d as _, f as v, i as y, l as b, n as x, o as S, r as C, s as w, t as T, u as E } from "../chunks/identity-3Foi5F8w.js";
 import { EnvironmentSnippet as D, KAESO_MOMENTS_DEFAULT_VARIANTS as O, KAESO_MOMENTS_VARIANTS as k, SecretReveal as A, sdkSnippets as j } from "./kaeso/moments.js";
-import { KAESO_USAGE_BREAKDOWN_DEFAULT_VARIANTS as M, KAESO_USAGE_BREAKDOWN_VARIANTS as N, KAESO_USAGE_DEFAULT_VARIANTS as P, KAESO_USAGE_VARIANTS as ee, LimitMeter as F, UsageBreakdown as I } from "./kaeso/usage.js";
-import { ConversationView as L, KAESO_CONVERSATION_DEFAULT_VARIANTS as R, KAESO_CONVERSATION_VARIANTS as z } from "./kaeso/conversation.js";
-import { a as B, i as te, n as ne, r as re, t as ie } from "../chunks/rights-Cyp0Pzp-.js";
-import { Fragment as V, forwardRef as H, useId as ae, useMemo as oe, useState as U } from "react";
-import { jsx as W, jsxs as G } from "react/jsx-runtime";
-import { Tick02Icon as se } from "@hugeicons/core-free-icons";
-import { Radio as ce } from "@base-ui/react/radio";
-import { RadioGroup as K } from "@base-ui/react/radio-group";
+import { KAESO_USAGE_BREAKDOWN_DEFAULT_VARIANTS as M, KAESO_USAGE_BREAKDOWN_VARIANTS as N, KAESO_USAGE_DEFAULT_VARIANTS as P, KAESO_USAGE_VARIANTS as F, LimitMeter as I, UsageBreakdown as L } from "./kaeso/usage.js";
+import { ConversationView as R, KAESO_CONVERSATION_DEFAULT_VARIANTS as z, KAESO_CONVERSATION_VARIANTS as B } from "./kaeso/conversation.js";
+import { a as V, i as ee, n as te, r as ne, t as re } from "../chunks/rights-B68ocZuq.js";
+import { Fragment as ie, forwardRef as H, useId as ae, useMemo as U, useState as W } from "react";
+import { jsx as G, jsxs as K } from "react/jsx-runtime";
+import { Tick02Icon as oe } from "@hugeicons/core-free-icons";
+import { Radio as se } from "@base-ui/react/radio";
+import { RadioGroup as q } from "@base-ui/react/radio-group";
 //#region src/components/kaeso/role-picker.tsx
-var q = { appearance: {
+var J = { appearance: {
 	list: { classes: "flex flex-col gap-16" },
 	select: { classes: "" }
-} }, le = { appearance: "list" }, J = /* @__PURE__ */ H(function({ roles: n, value: r, onValueChange: a, appearance: o = "list", disabled: s, name: c, label: d, "aria-label": f, fullWidth: p, size: m = "md", className: h }, g) {
-	let _ = t(), v = ae(), y = _("rolePicker.builtInRoles", "Built-in roles"), b = _("rolePicker.customRoles", "Custom roles"), x = n.some((e) => e.custom);
-	if (o === "select") return /* @__PURE__ */ W("div", {
-		ref: g,
-		className: e("min-w-0", p && "w-full", h),
-		children: /* @__PURE__ */ W(u, {
-			...d ? { label: d } : {},
-			...f ? { "aria-label": f } : {},
-			...c ? { name: c } : {},
-			...s === void 0 ? {} : { disabled: s },
-			...p ? { fullWidth: p } : {},
-			size: m,
+} }, ce = { appearance: "list" }, Y = /* @__PURE__ */ H(function({ roles: n, value: r, onValueChange: i, appearance: a = "list", disabled: o, name: s, label: c, "aria-label": d, fullWidth: f, size: p = "md", className: m }, h) {
+	let g = t(), _ = ae(), v = g("rolePicker.builtInRoles", "Built-in roles"), y = g("rolePicker.customRoles", "Custom roles"), b = n.some((e) => e.custom);
+	if (a === "select") return /* @__PURE__ */ G("div", {
+		ref: h,
+		className: e("min-w-0", f && "w-full", m),
+		children: /* @__PURE__ */ G(u, {
+			...c ? { label: c } : {},
+			...d ? { "aria-label": d } : {},
+			...s ? { name: s } : {},
+			...o === void 0 ? {} : { disabled: o },
+			...f ? { fullWidth: f } : {},
+			size: p,
 			value: r ?? null,
-			...a ? { onValueChange: a } : {},
+			...i ? { onValueChange: i } : {},
 			options: [...n.filter((e) => !e.custom), ...n.filter((e) => e.custom)].map((e) => ({
 				value: e.value,
 				label: e.label,
 				textValue: e.label,
 				description: e.disabled && e.disabledReason ? e.disabledReason : e.description,
-				...x ? { group: e.custom ? b : y } : {},
+				...b ? { group: e.custom ? y : v } : {},
 				...e.disabled ? { disabled: !0 } : {}
 			}))
 		})
 	});
-	let S = x ? [{
-		caption: y,
+	let x = b ? [{
+		caption: v,
 		items: n.filter((e) => !e.custom)
 	}, {
-		caption: b,
+		caption: y,
 		items: n.filter((e) => e.custom)
 	}] : [{
 		caption: void 0,
 		items: n
 	}];
-	return /* @__PURE__ */ W(K, {
-		ref: g,
+	return /* @__PURE__ */ G(q, {
+		ref: h,
 		...r == null ? {} : { value: r },
-		...a ? { onValueChange: (e) => a(String(e)) } : {},
-		...s === void 0 ? {} : { disabled: s },
-		...c ? { name: c } : {},
-		"aria-label": f ?? d ?? _("rolePicker.role", "Role"),
-		className: e(q.appearance.list.classes, h),
-		children: S.filter((e) => e.items.length > 0).map((t, n) => /* @__PURE__ */ W(V, { children: /* @__PURE__ */ G("div", {
+		...i ? { onValueChange: (e) => i(String(e)) } : {},
+		...o === void 0 ? {} : { disabled: o },
+		...s ? { name: s } : {},
+		"aria-label": d ?? c ?? g("rolePicker.role", "Role"),
+		className: e(J.appearance.list.classes, m),
+		children: x.filter((e) => e.items.length > 0).map((t, n) => /* @__PURE__ */ G(ie, { children: /* @__PURE__ */ K("div", {
 			className: "flex flex-col gap-8",
-			children: [t.caption && /* @__PURE__ */ W("span", {
-				className: "px-4 text-caption font-medium text-fg-secondary",
+			children: [t.caption && /* @__PURE__ */ G("span", {
+				className: "text-caption font-medium text-fg-secondary",
 				children: t.caption
-			}), /* @__PURE__ */ W("div", {
+			}), /* @__PURE__ */ G("div", {
 				className: "flex flex-col overflow-hidden rounded-group bg-raised shadow-xs",
 				children: t.items.map((t, r) => {
-					let a = `${v}-${n}-${r}`, o = s || t.disabled, c = /* @__PURE__ */ G("label", {
-						htmlFor: a,
-						className: e("flex min-h-56 cursor-pointer items-center gap-16 px-16 py-12 transition-control hover:bg-fill-1 not-first:hairline-t", o && "cursor-not-allowed hover:bg-transparent"),
-						children: [/* @__PURE__ */ G("span", {
+					let i = `${_}-${n}-${r}`, a = o || t.disabled;
+					return /* @__PURE__ */ K("label", {
+						htmlFor: i,
+						"data-choice-row": "",
+						...t["data-force"] ? { "data-force": t["data-force"] } : {},
+						className: e("flex min-h-56 cursor-pointer items-center gap-16 px-20 py-12 transition-control not-first:hairline-t", a ? "cursor-not-allowed" : "hover:bg-raised-hover active:bg-raised-pressed focus-ring-card-row-within"),
+						children: [/* @__PURE__ */ K("span", {
 							className: "flex min-w-0 flex-1 flex-col gap-2",
 							children: [
-								/* @__PURE__ */ G("span", {
+								/* @__PURE__ */ K("span", {
 									className: "flex min-w-0 items-baseline gap-8",
-									children: [/* @__PURE__ */ W("span", {
-										id: `${a}-name`,
-										className: e("min-w-0 wrap-break-word text-body font-medium", o ? "text-fg-disabled" : "text-fg"),
+									children: [/* @__PURE__ */ G("span", {
+										id: `${i}-name`,
+										className: e("min-w-0 wrap-break-word text-body-lg font-medium", a ? "text-fg-disabled" : "text-fg"),
 										children: t.label
-									}), t.hint && /* @__PURE__ */ W("span", {
-										className: "ml-auto shrink-0 text-small text-fg-tertiary tabular",
+									}), t.hint && /* @__PURE__ */ G("span", {
+										className: e("ml-auto shrink-0 text-small tabular", a ? "text-fg-disabled" : "text-fg-tertiary"),
 										children: t.hint
 									})]
 								}),
-								t.description && /* @__PURE__ */ W("span", {
-									id: `${a}-desc`,
-									className: e("text-small text-pretty", o ? "text-fg-tertiary" : "text-fg-secondary"),
+								t.description && /* @__PURE__ */ G("span", {
+									id: `${i}-desc`,
+									className: e("text-small text-pretty", a ? "text-fg-disabled" : "text-fg-secondary"),
 									children: t.description
 								}),
-								t.disabled && t.disabledReason && /* @__PURE__ */ W("span", {
-									className: "text-caption text-fg-tertiary",
+								t.disabled && t.disabledReason && /* @__PURE__ */ G("span", {
+									id: `${i}-reason`,
+									className: "text-small text-pretty text-fg-secondary",
 									children: t.disabledReason
 								})
 							]
-						}), /* @__PURE__ */ W(l, {
-							id: a,
+						}), /* @__PURE__ */ G(l, {
+							id: i,
 							value: t.value,
 							...t.disabled ? { disabled: !0 } : {},
-							"aria-labelledby": `${a}-name`,
-							...t.description ? { "aria-describedby": `${a}-desc` } : {}
+							...t["data-force"] ? { "data-force": t["data-force"] } : {},
+							"aria-labelledby": `${i}-name`,
+							...t.description || t.disabled && t.disabledReason ? { "aria-describedby": [t.description && `${i}-desc`, t.disabled && t.disabledReason && `${i}-reason`].filter(Boolean).join(" ") } : {}
 						})]
-					});
-					return t.disabled && t.disabledReason ? /* @__PURE__ */ W(i, {
-						content: t.disabledReason,
-						children: c
-					}, t.value) : /* @__PURE__ */ W(V, { children: c }, t.value);
+					}, t.value);
 				})
 			})]
 		}) }, t.caption ?? "all"))
 	});
 });
-process.env.NODE_ENV !== "production" && (J.displayName = "RolePicker");
+process.env.NODE_ENV !== "production" && (Y.displayName = "RolePicker");
 //#endregion
 //#region src/components/kaeso/effective-access.tsx
-var Y = { layout: { rows: { classes: "flex flex-col @auth:grid @auth:grid-cols-term @auth:gap-x-16" } } }, ue = { layout: "rows" }, X = /* @__PURE__ */ H(function({ groups: n, sources: r, action: a, "aria-label": o, className: s }, c) {
+var X = { layout: { rows: { classes: "flex flex-col @auth:grid @auth:grid-cols-term @auth:gap-x-16" } } }, le = { layout: "rows" }, Z = /* @__PURE__ */ H(function({ groups: n, sources: r, action: a, "aria-label": o, className: s }, c) {
 	let l = t(), u = n.filter((e) => !e.rights.some((e) => e.granted));
-	return /* @__PURE__ */ G("div", {
+	return /* @__PURE__ */ K("div", {
 		ref: c,
 		role: "group",
 		"aria-label": o ?? l("effectiveAccess.access", "Access"),
 		className: e("@container flex min-w-0 flex-col gap-12", s),
 		children: [
-			!!r?.length && /* @__PURE__ */ G("span", {
+			!!r?.length && /* @__PURE__ */ K("span", {
 				className: "flex flex-wrap items-center gap-4",
-				children: [/* @__PURE__ */ W("span", {
+				children: [/* @__PURE__ */ G("span", {
 					className: "mr-4 text-small text-fg-secondary",
 					children: l("effectiveAccess.from", "From")
-				}), r.map((e) => e.detail ? /* @__PURE__ */ W(i, {
+				}), r.map((e) => e.detail ? /* @__PURE__ */ G(i, {
 					content: e.detail,
-					children: /* @__PURE__ */ W(m, {
+					children: /* @__PURE__ */ G(m, {
 						tabIndex: 0,
-						className: "focus-ring",
+						className: "cursor-help underline decoration-dotted underline-offset-2 focus-ring",
 						children: e.label
 					})
-				}, e.label) : /* @__PURE__ */ W(m, { children: e.label }, e.label))]
+				}, e.label) : /* @__PURE__ */ G(m, { children: e.label }, e.label))]
 			}),
-			/* @__PURE__ */ G("dl", {
-				className: Y.layout.rows.classes,
+			/* @__PURE__ */ K("dl", {
+				className: X.layout.rows.classes,
 				children: [n.filter((e) => e.rights.some((e) => e.granted)).map((e) => {
 					let t = e.rights.filter((e) => e.granted), n = t.length === e.rights.length ? l("effectiveAccess.everyRight", "Every right") : t.map((e) => e.label ?? e.code).join(l("effectiveAccess.listSeparator", ", "));
-					return /* @__PURE__ */ W(de, {
+					return /* @__PURE__ */ G(ue, {
 						term: e.label,
 						count: l("effectiveAccess.grantedOfTotal", "{granted} of {total}", {
 							granted: t.length,
@@ -155,33 +156,33 @@ var Y = { layout: { rows: { classes: "flex flex-col @auth:grid @auth:grid-cols-t
 						}),
 						children: n
 					}, e.label);
-				}), u.length > 0 && /* @__PURE__ */ W(de, {
-					term: u.length === n.length ? l("effectiveAccess.noRights", "No rights") : l("effectiveAccess.noRightsIn", "No rights in"),
+				}), u.length > 0 && /* @__PURE__ */ G(ue, {
+					term: l("effectiveAccess.noRights", "No rights"),
 					quiet: !0,
 					children: u.map((e) => e.label).join(l("effectiveAccess.listSeparator", ", "))
 				})]
 			}),
-			a && /* @__PURE__ */ W("div", {
+			a && /* @__PURE__ */ G("div", {
 				className: "flex",
 				children: a
 			})
 		]
 	});
 });
-process.env.NODE_ENV !== "production" && (X.displayName = "EffectiveAccess");
-function de({ term: t, count: n, quiet: r, children: i }) {
-	return /* @__PURE__ */ G("div", {
+process.env.NODE_ENV !== "production" && (Z.displayName = "EffectiveAccess");
+function ue({ term: t, count: n, quiet: r, children: i }) {
+	return /* @__PURE__ */ K("div", {
 		className: "flex min-h-40 flex-col gap-2 py-8 not-first:hairline-t @auth:col-span-2 @auth:grid @auth:grid-cols-subgrid @auth:items-baseline @auth:gap-16",
-		children: [/* @__PURE__ */ W("dt", {
+		children: [/* @__PURE__ */ G("dt", {
 			className: e("shrink-0 text-small font-medium @auth:min-w-140", r ? "text-fg-secondary" : "text-fg"),
 			children: t
-		}), /* @__PURE__ */ G("dd", {
+		}), /* @__PURE__ */ K("dd", {
 			className: "flex min-w-0 flex-1 items-baseline gap-12",
-			children: [/* @__PURE__ */ W("span", {
-				className: e("min-w-0 flex-1 text-small text-pretty", r ? "text-fg-tertiary" : "text-fg-secondary"),
+			children: [/* @__PURE__ */ G("span", {
+				className: "min-w-0 flex-1 text-small text-pretty text-fg-secondary",
 				children: i
-			}), n && /* @__PURE__ */ W("span", {
-				className: "shrink-0 text-small text-fg-tertiary tabular",
+			}), n && /* @__PURE__ */ G("span", {
+				className: "shrink-0 text-small text-fg-secondary tabular",
 				children: n
 			})]
 		})]
@@ -189,81 +190,84 @@ function de({ term: t, count: n, quiet: r, children: i }) {
 }
 //#endregion
 //#region src/components/kaeso/provider-picker.tsx
-var fe = { appearance: {
+var de = { appearance: {
 	list: { classes: "" },
 	select: { classes: "" },
 	grid: { classes: "" }
-} }, pe = { appearance: "list" }, Z = "", me = 9;
-function he({ providers: r, value: i, onValueChange: a, onChoose: o, autoFocus: s, label: l, className: u }) {
-	let d = t(), f = n(), [p, m] = U(""), h = p.trim().toLowerCase(), _ = (e) => v(e.id, e.name), y = (e, t) => _(e).localeCompare(_(t), f, { sensitivity: "base" }), b = r.filter((e) => !h || [
+} }, fe = { appearance: "list" }, Q = "", pe = 9;
+function me({ providers: r, disabled: i, value: a, onValueChange: o, onChoose: s, autoFocus: l, label: u, className: d }) {
+	let f = t(), p = n(), [m, h] = W(""), _ = m.trim().toLowerCase(), y = (e) => v(e.id, e.name), b = (e, t) => y(e).localeCompare(y(t), p, { sensitivity: "base" }), x = r.filter((e) => !_ || [
 		e.id,
-		_(e),
+		y(e),
 		...e.keywords ?? []
-	].some((e) => e.toLowerCase().includes(h))), x = b.filter((e) => e.connected).sort(y), S = b.filter((e) => !e.connected).sort(y), C = x.length && S.length ? [{
+	].some((e) => e.toLowerCase().includes(_))), S = x.filter((e) => e.connected).sort(b), C = x.filter((e) => !e.connected).sort(b), w = S.length && C.length ? [{
 		id: "connected",
-		label: d("providerPicker.connected", "Connected"),
-		items: x
+		label: f("providerPicker.connected", "Connected"),
+		items: S
 	}, {
 		id: "other",
-		label: d("providerPicker.other", "Other providers"),
-		items: S
+		label: f("providerPicker.other", "Other providers"),
+		items: C
 	}] : [{
 		id: "providers",
 		label: void 0,
-		items: [...x, ...S]
-	}], w = r.length > me;
-	return /* @__PURE__ */ G("div", {
-		className: e("flex min-w-0 flex-col gap-16", u),
-		children: [w && /* @__PURE__ */ W(c, {
-			"aria-label": d("providerPicker.search", "Search providers"),
-			placeholder: d("providerPicker.search", "Search providers"),
-			value: p,
-			onChange: (e) => m(e.target.value),
-			...s ? { autoFocus: !0 } : {}
-		}), b.length === 0 ? /* @__PURE__ */ W("p", {
+		items: [...S, ...C]
+	}], T = r.length > pe;
+	return /* @__PURE__ */ K("div", {
+		className: e("flex min-w-0 flex-col gap-16", d),
+		children: [T && /* @__PURE__ */ G(c, {
+			"aria-label": f("providerPicker.search", "Search providers"),
+			placeholder: f("providerPicker.search", "Search providers"),
+			...i ? { disabled: !0 } : {},
+			value: m,
+			onChange: (e) => h(e.target.value),
+			...l ? { autoFocus: !0 } : {}
+		}), x.length === 0 ? /* @__PURE__ */ G("p", {
 			className: "py-24 text-center text-body text-fg-secondary",
-			children: d("providerPicker.noMatch", "No providers match")
-		}) : /* @__PURE__ */ W(K, {
-			"aria-label": l,
-			value: i ?? null,
-			onValueChange: (e) => a?.(e ? String(e) : null),
+			children: f("providerPicker.noMatch", "No providers match")
+		}) : /* @__PURE__ */ G(q, {
+			"aria-label": u,
+			value: a ?? null,
+			...i ? { disabled: !0 } : {},
+			onValueChange: (e) => o?.(e ? String(e) : null),
 			className: "flex flex-col gap-20",
-			children: C.map((t, n) => /* @__PURE__ */ G("div", {
+			children: w.map((t, n) => /* @__PURE__ */ K("div", {
 				...t.label ? {
 					role: "group",
 					"aria-label": t.label
 				} : {},
 				className: "flex flex-col gap-8",
-				children: [t.label && /* @__PURE__ */ G("div", {
+				children: [t.label && /* @__PURE__ */ K("div", {
 					"aria-hidden": !0,
 					className: "flex items-center justify-between text-caption font-medium text-fg-secondary",
-					children: [/* @__PURE__ */ W("span", { children: t.label }), /* @__PURE__ */ W("span", {
+					children: [/* @__PURE__ */ G("span", { children: t.label }), /* @__PURE__ */ G("span", {
 						className: "font-regular text-fg-tertiary tabular",
 						children: t.items.length
 					})]
-				}), /* @__PURE__ */ W("div", {
+				}), /* @__PURE__ */ G("div", {
 					className: "grid grid-cols-2 gap-8 sm:grid-cols-3",
-					children: t.items.map((t, r) => /* @__PURE__ */ G(ce.Root, {
+					children: t.items.map((t, r) => /* @__PURE__ */ K(se.Root, {
 						value: t.id,
 						...t.disabled ? { disabled: !0 } : {},
-						...s && !w && n === 0 && r === 0 && !i ? { autoFocus: !0 } : {},
-						onClick: () => o?.(t.id),
-						className: e("group/tile flex min-h-64 min-w-0 cursor-pointer items-center gap-10 rounded-group bg-raised px-10 py-12 sm:gap-12 sm:px-12 text-left shadow-control transition-control focus-ring", "hover:shadow-control-hover data-checked:ring-step data-checked:bg-fill-1 data-disabled:cursor-not-allowed data-disabled:opacity-50"),
-						children: [/* @__PURE__ */ W("span", {
+						...t["data-force"] ? { "data-force": t["data-force"] } : {},
+						...l && !T && n === 0 && r === 0 && !a ? { autoFocus: !0 } : {},
+						onClick: () => !i && !t.disabled && s?.(t.id),
+						className: e("group/tile flex min-h-64 min-w-0 cursor-pointer items-center gap-10 rounded-group bg-raised px-10 py-12 sm:gap-12 sm:px-12 text-left shadow-control transition-control focus-ring forced-checked", "hover:not-data-checked:bg-raised-hover hover:not-data-checked:shadow-control-hover active:bg-raised-pressed", "data-checked:bg-item-hover data-checked:ring-step data-disabled:cursor-not-allowed data-disabled:opacity-40"),
+						children: [/* @__PURE__ */ G("span", {
 							"aria-hidden": !0,
 							className: "flex",
-							children: /* @__PURE__ */ W(g, {
+							children: /* @__PURE__ */ G(g, {
 								provider: t.id,
 								name: t.name,
 								size: "lg"
 							})
-						}), /* @__PURE__ */ G("span", {
+						}), /* @__PURE__ */ K("span", {
 							className: "flex min-w-0 flex-1 flex-col",
-							children: [/* @__PURE__ */ W("span", {
+							children: [/* @__PURE__ */ G("span", {
 								className: "truncate text-body font-medium text-fg",
-								children: _(t)
-							}), t.hint !== void 0 && /* @__PURE__ */ W("span", {
-								className: "truncate text-small text-fg-secondary",
+								children: y(t)
+							}), t.hint !== void 0 && /* @__PURE__ */ G("span", {
+								className: "line-clamp-2 text-small text-pretty text-fg-secondary",
 								children: t.hint
 							})]
 						})]
@@ -273,17 +277,17 @@ function he({ providers: r, value: i, onValueChange: a, onChoose: o, autoFocus:
 		})]
 	});
 }
-function ge(e, r) {
+function he(e, r) {
 	let i = t(), a = n();
-	return oe(() => {
+	return U(() => {
 		let t = (e) => v(e.id, e.name), n = (e, n) => t(e).localeCompare(t(n), a, { sensitivity: "base" }), o = (e) => ({
 			value: e.id,
 			label: t(e),
 			keywords: [e.id, ...e.keywords ?? []],
-			leading: /* @__PURE__ */ W("span", {
+			leading: /* @__PURE__ */ G("span", {
 				"aria-hidden": !0,
 				className: "flex",
-				children: /* @__PURE__ */ W(g, {
+				children: /* @__PURE__ */ G(g, {
 					provider: e.id,
 					name: e.name
 				})
@@ -294,7 +298,7 @@ function ge(e, r) {
 		return r && l.push({
 			id: "all",
 			items: [{
-				value: Z,
+				value: Q,
 				label: r
 			}]
 		}), s.length && c.length ? (l.push({
@@ -318,16 +322,23 @@ function ge(e, r) {
 		a
 	]);
 }
-var Q = /* @__PURE__ */ H(function(e, n) {
-	let { providers: r, value: i, onValueChange: c, onChoose: l, appearance: u = "list", allLabel: m, placeholder: h, size: _ = "md", disabled: y, autoFocus: b, "aria-label": x, className: S, "data-force": C, label: w, description: T, error: E, optional: D, required: O, layout: k } = e, A = t(), j = a(), M = o(e), [N, P] = U(!1), ee = ge(r, u === "select" ? m : void 0), F = x ?? (typeof w == "string" ? w : A("providerPicker.providers", "Providers")), I = h ?? A("providerPicker.search", "Search providers"), L = A("providerPicker.noMatch", "No providers match"), R = (e) => /* @__PURE__ */ W(d, {
-		groups: ee,
-		"aria-label": F,
-		value: i ?? (m ? Z : null),
+var ge = /* @__PURE__ */ H(function(e, n) {
+	let { providers: r, value: i, onValueChange: c, onChoose: l, appearance: u = "list", allLabel: m, placeholder: h, size: _ = "md", disabled: y, autoFocus: b, "aria-label": x, className: S, "data-force": C, label: w, description: T, error: E, optional: D, required: O, layout: k } = e, A = t(), j = a(), M = o(e), [N, P] = W(!1), F = he(U(() => y && u === "list" ? r.map((e) => ({
+		...e,
+		disabled: !0
+	})) : r, [
+		r,
+		y,
+		u
+	]), u === "select" ? m : void 0), I = x ?? (typeof w == "string" ? w : A("providerPicker.providers", "Providers")), L = h ?? A("providerPicker.search", "Search providers"), R = A("providerPicker.noMatch", "No providers match"), z = (e) => /* @__PURE__ */ G(d, {
+		groups: F,
+		"aria-label": I,
+		value: i ?? (m ? Q : null),
 		onSelect: (e) => {
-			c?.(e === Z ? null : e), P(!1);
+			c?.(e === Q ? null : e), P(!1);
 		},
-		placeholder: I,
-		emptyText: L,
+		placeholder: L,
+		emptyText: R,
 		...e ? { height: e } : {},
 		...b || u === "select" ? { autoFocus: !0 } : {},
 		...e && C ? { "data-force": C } : {},
@@ -335,13 +346,14 @@ var Q = /* @__PURE__ */ H(function(e, n) {
 		...e ? { ref: n } : {}
 	});
 	if (u === "grid") {
-		let e = /* @__PURE__ */ W(he, {
+		let e = /* @__PURE__ */ G(me, {
 			providers: r,
+			disabled: y,
 			value: i,
 			onValueChange: c,
 			onChoose: l,
 			autoFocus: b,
-			label: F,
+			label: I,
 			className: w || T || E ? void 0 : S
 		});
 		return j ? e : s({
@@ -357,7 +369,7 @@ var Q = /* @__PURE__ */ H(function(e, n) {
 		}, e);
 	}
 	if (u === "list") {
-		let e = R("inline");
+		let e = z("inline");
 		return j ? e : s({
 			label: w,
 			description: T,
@@ -370,12 +382,12 @@ var Q = /* @__PURE__ */ H(function(e, n) {
 			className: S
 		}, e);
 	}
-	let z = r.find((e) => e.id === i), B = /* @__PURE__ */ W(p, {
-		title: F,
+	let B = r.find((e) => e.id === i), V = /* @__PURE__ */ G(p, {
+		title: I,
 		width: "sm",
 		open: N,
 		onOpenChange: P,
-		trigger: /* @__PURE__ */ W(f, {
+		trigger: /* @__PURE__ */ G(f, {
 			ref: n,
 			size: _ === "sm" ? "sm" : "md",
 			...M.controlProps,
@@ -384,24 +396,24 @@ var Q = /* @__PURE__ */ H(function(e, n) {
 			...C ? { "data-force": C } : {},
 			placeholder: h ?? A("providerPicker.choose", "Choose a provider"),
 			...!(w || T || E) && S ? { className: S } : {},
-			children: z ? /* @__PURE__ */ G("span", {
+			children: B ? /* @__PURE__ */ K("span", {
 				className: "flex min-w-0 items-center gap-8",
-				children: [/* @__PURE__ */ W("span", {
+				children: [/* @__PURE__ */ G("span", {
 					"aria-hidden": !0,
 					className: "flex",
-					children: /* @__PURE__ */ W(g, {
-						provider: z.id,
-						name: z.name
+					children: /* @__PURE__ */ G(g, {
+						provider: B.id,
+						name: B.name
 					})
-				}), /* @__PURE__ */ W("span", {
+				}), /* @__PURE__ */ G("span", {
 					className: "truncate",
-					children: v(z.id, z.name)
+					children: v(B.id, B.name)
 				})]
 			}) : m
 		}),
-		children: R()
+		children: z()
 	});
-	return j ? B : s({
+	return j ? V : s({
 		label: w,
 		description: T,
 		error: E,
@@ -411,36 +423,36 @@ var Q = /* @__PURE__ */ H(function(e, n) {
 		id: M.wrapId,
 		disabled: y,
 		className: S
-	}, B);
+	}, V);
 });
-process.env.NODE_ENV !== "production" && (Q.displayName = "ProviderPicker");
+process.env.NODE_ENV !== "production" && (ge.displayName = "ProviderPicker");
 //#endregion
 //#region src/components/kaeso/grant-summary.tsx
 var _e = {}, ve = {}, ye = /* @__PURE__ */ H(function({ items: t, footer: n, action: i, "aria-label": a, className: o }, s) {
-	return /* @__PURE__ */ G("div", {
+	return /* @__PURE__ */ K("div", {
 		ref: s,
-		className: e("flex flex-col gap-16 rounded-group bg-raised p-16 shadow-xs", o),
-		children: [/* @__PURE__ */ W("ul", {
+		className: e("flex flex-col gap-16 rounded-group bg-raised p-20 shadow-xs", o),
+		children: [/* @__PURE__ */ G("ul", {
 			"aria-label": a,
 			className: "flex flex-col gap-10",
-			children: t.map((e, t) => /* @__PURE__ */ G("li", {
+			children: t.map((e, t) => /* @__PURE__ */ K("li", {
 				className: "flex items-start gap-10 text-body text-fg",
-				children: [/* @__PURE__ */ W(r, {
-					icon: se,
+				children: [/* @__PURE__ */ G(r, {
+					icon: oe,
 					size: "sm",
 					className: "mt-2 text-success-text"
-				}), /* @__PURE__ */ W("span", {
+				}), /* @__PURE__ */ G("span", {
 					className: "min-w-0 text-pretty",
 					children: e
 				})]
 			}, t))
-		}), (n || i) && /* @__PURE__ */ G("div", {
+		}), (n || i) && /* @__PURE__ */ K("div", {
 			className: "flex items-center justify-between gap-12 pt-12 hairline-t",
-			children: [/* @__PURE__ */ W("p", {
-				className: "min-w-0 text-small text-fg-tertiary text-pretty",
+			children: [n && /* @__PURE__ */ G("p", {
+				className: "min-w-0 text-small text-fg-secondary text-pretty",
 				children: n
-			}), i && /* @__PURE__ */ W("div", {
-				className: "shrink-0",
+			}), i && /* @__PURE__ */ G("div", {
+				className: "ml-auto shrink-0",
 				children: i
 			})]
 		})]
@@ -453,30 +465,31 @@ var be = {}, xe = {}, Se = {
 	claude: "m4.7144 15.9555 4.7174-2.6471.079-.2307-.079-.1275h-.2307l-.7893-.0486-2.6956-.0729-2.3375-.0971-2.2646-.1214-.5707-.1215-.5343-.7042.0546-.3522.4797-.3218.686.0608 1.5179.1032 2.2767.1578 1.6514.0972 2.4468.255h.3886l.0546-.1579-.1336-.0971-.1032-.0972L6.973 9.8356l-2.55-1.6879-1.3356-.9714-.7225-.4918-.3643-.4614-.1578-1.0078.6557-.7225.8803.0607.2246.0607.8925.686 1.9064 1.4754 2.4893 1.8336.3643.3035.1457-.1032.0182-.0728-.164-.2733-1.3539-2.4467-1.445-2.4893-.6435-1.032-.17-.6194c-.0607-.255-.1032-.4674-.1032-.7285L6.287.1335 6.6997 0l.9957.1336.419.3642.6192 1.4147 1.0018 2.2282 1.5543 3.0296.4553.8985.2429.8318.091.255h.1579v-.1457l.1275-1.706.2368-2.0947.2307-2.6957.0789-.7589.3764-.9107.7468-.4918.5828.2793.4797.686-.0668.4433-.2853 1.8517-.5586 2.9021-.3643 1.9429h.2125l.2429-.2429.9835-1.3053 1.6514-2.0643.7286-.8196.85-.9046.5464-.4311h1.0321l.759 1.1293-.34 1.1657-1.0625 1.3478-.8804 1.1414-1.2628 1.7-.7893 1.36.0729.1093.1882-.0183 2.8535-.607 1.5421-.2794 1.8396-.3157.8318.3886.091.3946-.3278.8075-1.967.4857-2.3072.4614-3.4364.8136-.0425.0304.0486.0607 1.5482.1457.6618.0364h1.621l3.0175.2247.7892.522.4736.6376-.079.4857-1.2142.6193-1.6393-.3886-3.825-.9107-1.3113-.3279h-.1822v.1093l1.0929 1.0686 2.0035 1.8092 2.5075 2.3314.1275.5768-.3218.4554-.34-.0486-2.2039-1.6575-.85-.7468-1.9246-1.621h-.1275v.17l.4432.6496 2.3436 3.5214.1214 1.0807-.17.3521-.6071.2125-.6679-.1214-1.3721-1.9246L14.38 17.959l-1.1414-1.9428-.1397.079-.674 7.2552-.3156.3703-.7286.2793-.6071-.4614-.3218-.7468.3218-1.4753.3886-1.9246.3157-1.53.2853-1.9004.17-.6314-.0121-.0425-.1397.0182-1.4328 1.9672-2.1796 2.9446-1.7243 1.8456-.4128.164-.7164-.3704.0667-.6618.4008-.5889 2.386-3.0357 1.4389-1.882.929-1.0868-.0062-.1579h-.0546l-6.3385 4.1164-1.1293.1457-.4857-.4554.0608-.7467.2307-.2429 1.9064-1.3114Z",
 	cursor: "M11.503.131 1.891 5.678a.84.84 0 0 0-.42.726v11.188c0 .3.162.575.42.724l9.609 5.55a1 1 0 0 0 .998 0l9.61-5.55a.84.84 0 0 0 .42-.724V6.404a.84.84 0 0 0-.42-.726L12.497.131a1.01 1.01 0 0 0-.996 0M2.657 6.338h18.55c.263 0 .43.287.297.515L12.23 22.918c-.062.107-.229.064-.229-.06V12.335a.59.59 0 0 0-.295-.51l-9.11-5.257c-.109-.063-.064-.23.061-.23",
 	"github-copilot": "M23.922 16.997C23.061 18.492 18.063 22.02 12 22.02 5.937 22.02.939 18.492.078 16.997A.641.641 0 0 1 0 16.741v-2.869a.883.883 0 0 1 .053-.22c.372-.935 1.347-2.292 2.605-2.656.167-.429.414-1.055.644-1.517a10.098 10.098 0 0 1-.052-1.086c0-1.331.282-2.499 1.132-3.368.397-.406.89-.717 1.474-.952C7.255 2.937 9.248 1.98 11.978 1.98c2.731 0 4.767.957 6.166 2.093.584.235 1.077.546 1.474.952.85.869 1.132 2.037 1.132 3.368 0 .368-.014.733-.052 1.086.23.462.477 1.088.644 1.517 1.258.364 2.233 1.721 2.605 2.656a.841.841 0 0 1 .053.22v2.869a.641.641 0 0 1-.078.256Zm-11.75-5.992h-.344a4.359 4.359 0 0 1-.355.508c-.77.947-1.918 1.492-3.508 1.492-1.725 0-2.989-.359-3.782-1.259a2.137 2.137 0 0 1-.085-.104L4 11.746v6.585c1.435.779 4.514 2.179 8 2.179 3.486 0 6.565-1.4 8-2.179v-6.585l-.098-.104s-.033.045-.085.104c-.793.9-2.057 1.259-3.782 1.259-1.59 0-2.738-.545-3.508-1.492a4.359 4.359 0 0 1-.355-.508Zm2.328 3.25c.549 0 1 .451 1 1v2c0 .549-.451 1-1 1-.549 0-1-.451-1-1v-2c0-.549.451-1 1-1Zm-5 0c.549 0 1 .451 1 1v2c0 .549-.451 1-1 1-.549 0-1-.451-1-1v-2c0-.549.451-1 1-1Zm3.313-6.185c.136 1.057.403 1.913.878 2.497.442.544 1.134.938 2.344.938 1.573 0 2.292-.337 2.657-.751.384-.435.558-1.15.558-2.361 0-1.14-.243-1.847-.705-2.319-.477-.488-1.319-.862-2.824-1.025-1.487-.161-2.192.138-2.533.529-.269.307-.437.808-.438 1.578v.021c0 .265.021.562.063.893Zm-1.626 0c.042-.331.063-.628.063-.894v-.02c-.001-.77-.169-1.271-.438-1.578-.341-.391-1.046-.69-2.533-.529-1.505.163-2.347.537-2.824 1.025-.462.472-.705 1.179-.705 2.319 0 1.211.175 1.926.558 2.361.365.414 1.084.751 2.657.751 1.21 0 1.902-.394 2.344-.938.475-.584.742-1.44.878-2.497Z"
-}, $ = /* @__PURE__ */ H(function({ client: t, "aria-label": n, onClick: r, className: a }, o) {
-	return /* @__PURE__ */ W(i, {
+}, $ = /* @__PURE__ */ H(function({ client: t, "aria-label": n, onClick: r, className: a, "data-force": o }, s) {
+	return /* @__PURE__ */ G(i, {
 		content: n,
-		children: /* @__PURE__ */ W("button", {
-			ref: o,
+		children: /* @__PURE__ */ G("button", {
+			ref: s,
 			type: "button",
 			"aria-label": n,
 			"data-client": t,
+			...o ? { "data-force": o } : {},
 			onClick: r,
-			className: e("inline-flex size-32 shrink-0 items-center justify-center rounded-org text-fg material-secondary transition-control focus-ring", a),
-			children: /* @__PURE__ */ W("svg", {
+			className: e("relative inline-flex size-32 shrink-0 items-center justify-center rounded-pill text-fg material-secondary transition-control focus-ring tap-target", a),
+			children: /* @__PURE__ */ G("svg", {
 				viewBox: "0 0 24 24",
 				fill: "currentColor",
 				fillRule: "evenodd",
 				"aria-hidden": !0,
 				focusable: "false",
 				className: "size-16",
-				children: /* @__PURE__ */ W("path", { d: Se[t] })
+				children: /* @__PURE__ */ G("path", { d: Se[t] })
 			})
 		})
 	});
 });
 process.env.NODE_ENV !== "production" && ($.displayName = "ClientButton");
 //#endregion
-export { Se as CLIENT_MARKS, T as CapabilityIcons, $ as ClientButton, L as ConversationView, X as EffectiveAccess, D as EnvironmentSnippet, ye as GrantSummary, xe as KAESO_CLIENT_BUTTON_DEFAULT_VARIANTS, be as KAESO_CLIENT_BUTTON_VARIANTS, R as KAESO_CONVERSATION_DEFAULT_VARIANTS, z as KAESO_CONVERSATION_VARIANTS, ue as KAESO_EFFECTIVE_ACCESS_DEFAULT_VARIANTS, Y as KAESO_EFFECTIVE_ACCESS_VARIANTS, ve as KAESO_GRANT_SUMMARY_DEFAULT_VARIANTS, _e as KAESO_GRANT_SUMMARY_VARIANTS, x as KAESO_IDENTITY_DEFAULT_VARIANTS, C as KAESO_IDENTITY_VARIANTS, y as KAESO_KEY_DISPLAY_DEFAULT_VARIANTS, h as KAESO_KEY_DISPLAY_VARIANTS, O as KAESO_MOMENTS_DEFAULT_VARIANTS, k as KAESO_MOMENTS_VARIANTS, pe as KAESO_PROVIDER_PICKER_DEFAULT_VARIANTS, fe as KAESO_PROVIDER_PICKER_VARIANTS, ie as KAESO_RIGHTS_MATRIX_DEFAULT_VARIANTS, ne as KAESO_RIGHTS_MATRIX_VARIANTS, le as KAESO_ROLE_PICKER_DEFAULT_VARIANTS, q as KAESO_ROLE_PICKER_VARIANTS, M as KAESO_USAGE_BREAKDOWN_DEFAULT_VARIANTS, N as KAESO_USAGE_BREAKDOWN_VARIANTS, P as KAESO_USAGE_DEFAULT_VARIANTS, ee as KAESO_USAGE_VARIANTS, S as KeyDisplay, F as LimitMeter, w as ModelLabel, g as ProviderBadge, b as ProviderCard, Q as ProviderPicker, E as RequestTimeline, re as RightsMatrix, J as RolePicker, A as SecretReveal, _ as StatusCode, I as UsageBreakdown, te as groupCascade, v as providerName, B as rightsCascade, j as sdkSnippets, ge as useProviderGroups };
+export { Se as CLIENT_MARKS, T as CapabilityIcons, $ as ClientButton, R as ConversationView, Z as EffectiveAccess, D as EnvironmentSnippet, ye as GrantSummary, xe as KAESO_CLIENT_BUTTON_DEFAULT_VARIANTS, be as KAESO_CLIENT_BUTTON_VARIANTS, z as KAESO_CONVERSATION_DEFAULT_VARIANTS, B as KAESO_CONVERSATION_VARIANTS, le as KAESO_EFFECTIVE_ACCESS_DEFAULT_VARIANTS, X as KAESO_EFFECTIVE_ACCESS_VARIANTS, ve as KAESO_GRANT_SUMMARY_DEFAULT_VARIANTS, _e as KAESO_GRANT_SUMMARY_VARIANTS, x as KAESO_IDENTITY_DEFAULT_VARIANTS, C as KAESO_IDENTITY_VARIANTS, y as KAESO_KEY_DISPLAY_DEFAULT_VARIANTS, h as KAESO_KEY_DISPLAY_VARIANTS, O as KAESO_MOMENTS_DEFAULT_VARIANTS, k as KAESO_MOMENTS_VARIANTS, fe as KAESO_PROVIDER_PICKER_DEFAULT_VARIANTS, de as KAESO_PROVIDER_PICKER_VARIANTS, re as KAESO_RIGHTS_MATRIX_DEFAULT_VARIANTS, te as KAESO_RIGHTS_MATRIX_VARIANTS, ce as KAESO_ROLE_PICKER_DEFAULT_VARIANTS, J as KAESO_ROLE_PICKER_VARIANTS, M as KAESO_USAGE_BREAKDOWN_DEFAULT_VARIANTS, N as KAESO_USAGE_BREAKDOWN_VARIANTS, P as KAESO_USAGE_DEFAULT_VARIANTS, F as KAESO_USAGE_VARIANTS, S as KeyDisplay, I as LimitMeter, w as ModelLabel, g as ProviderBadge, b as ProviderCard, ge as ProviderPicker, E as RequestTimeline, ne as RightsMatrix, Y as RolePicker, A as SecretReveal, _ as StatusCode, L as UsageBreakdown, ee as groupCascade, v as providerName, V as rightsCascade, j as sdkSnippets, he as useProviderGroups };
 
 //# sourceMappingURL=kaeso.js.map