@revolist/ui 4.0.1-rc → 4.0.2-rc

package/_chunks/request-trail-IdNiFvKH.js

@@ -0,0 +1,347 @@
+import { s as e } from "./preact.module-BBM36DnO.js";
+import { i as t, r as n, s as r, t as i } from "./hooks.module-CG3gN83z.js";
+import { t as a } from "./jsxRuntime.module-F6UFnpT-.js";
+import { SvgIcon as o } from "../icons/icon.js";
+import { N as s, O as c, m as l, n as u, o as d } from "./controls-DIum-E66.js";
+import { createControlId as f } from "../core/control-id.js";
+import { t as p } from "./chevron-down-GbplLa6s.js";
+import { PopoverController as m } from "../surfaces.js";
+import { RemoveButton as h } from "../buttons/remove-button.js";
+//#region src/ai/translations.ts
+var g = [
+	"Ask AI to change this view",
+	"Filter or sort your data…",
+	"Send",
+	"Stop",
+	"Enter to send · Shift+Enter for a new line",
+	"Suggested requests",
+	"AI view assistant",
+	"View steps",
+	"Clear all",
+	"Restore the starting view",
+	"Restore previous view",
+	"Reset view",
+	"The view changed manually. Start a new request to continue.",
+	"Remove request: {label}",
+	"{count} step",
+	"{count} steps",
+	"{count} applied request",
+	"{count} applied requests",
+	"{count} matching rows"
+];
+function _(e, t = {}, n = {}) {
+	return (t[e] ?? e).replace(/\{(\w+)\}/g, (e, t) => Object.hasOwn(n, t) ? String(n[t]) : e);
+}
+//#endregion
+//#region src/ai/translation-context.tsx
+var v = e({});
+function y({ translations: e, children: t }) {
+	return /* @__PURE__ */ a(v.Provider, {
+		value: e,
+		children: t
+	});
+}
+function b(e) {
+	let t = r(v), n = e ?? t;
+	return (e, t) => _(e, n, t);
+}
+//#endregion
+//#region ../../node_modules/.pnpm/@fortawesome+fontawesome-free@7.3.1/node_modules/@fortawesome/fontawesome-free/svgs/solid/arrow-up.svg?raw
+var x = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 384 512\"><!--! Font Awesome Free 7.3.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2026 Fonticons, Inc. --><path fill=\"currentColor\" d=\"M214.6 9.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 109.3 160 480c0 17.7 14.3 32 32 32s32-14.3 32-32l0-370.7 105.4 105.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z\"/></svg>", S = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 448 512\"><!--! Font Awesome Free 7.3.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2026 Fonticons, Inc. --><path fill=\"currentColor\" d=\"M64 32l320 0c35.3 0 64 28.7 64 64l0 320c0 35.3-28.7 64-64 64L64 480c-35.3 0-64-28.7-64-64L0 96C0 60.7 28.7 32 64 32z\"/></svg>";
+//#endregion
+//#region src/ai/components.tsx
+function C({ translations: e, value: t, onValueChange: n, onSubmit: r, onStop: o, busy: c = !1, disabled: u = !1, label: d = "Ask AI to change this view", placeholder: p = "Filter or sort your data…", submitLabel: m = "Send", stopLabel: h = "Stop", hint: g = "Enter to send · Shift+Enter for a new line", actions: _, footer: v, textareaProps: y }) {
+	let C = b(e), w = i(f("ai-prompt")), T = i(!1), E = `${w.current}-hint`, D = !!g && !t.length, O = c && !!o, k = () => {
+		!u && !c && t.trim() && r(t.trim());
+	};
+	return /* @__PURE__ */ a("form", {
+		class: "rv-ai-prompt",
+		"aria-busy": c || void 0,
+		onSubmit: (e) => {
+			e.preventDefault(), k();
+		},
+		children: [/* @__PURE__ */ a("label", {
+			for: w.current,
+			class: "rv-ai-prompt-label rv-visually-hidden",
+			children: C(d)
+		}), /* @__PURE__ */ a("div", {
+			class: "rv-ai-prompt-composer",
+			children: [
+				/* @__PURE__ */ a(s, {
+					rows: 2,
+					...y,
+					id: w.current,
+					"aria-describedby": D ? E : void 0,
+					value: t,
+					onValueChange: n,
+					placeholder: C(p),
+					disabled: u || c,
+					maxLength: 4e3,
+					onCompositionStart: () => {
+						T.current = !0;
+					},
+					onCompositionEnd: () => {
+						T.current = !1;
+					},
+					onKeyDown: (e) => {
+						e.key === "Enter" && !e.shiftKey && !e.isComposing && !T.current && e.keyCode !== 229 && (e.preventDefault(), k());
+					}
+				}),
+				v && /* @__PURE__ */ a("div", {
+					class: "rv-ai-prompt-footer",
+					children: v
+				}),
+				/* @__PURE__ */ a("div", {
+					class: "rv-ai-prompt-toolbar",
+					children: [/* @__PURE__ */ a("div", {
+						class: "rv-ai-prompt-tools",
+						children: [_, D && /* @__PURE__ */ a("span", {
+							id: E,
+							class: "rv-ai-prompt-hint",
+							children: C(g)
+						})]
+					}), /* @__PURE__ */ a(l, {
+						className: "rv-ai-prompt-submit",
+						type: O ? "button" : "submit",
+						label: C(O ? h : m),
+						icon: O ? S : x,
+						onClick: O ? (e) => {
+							e.preventDefault(), o?.();
+						} : void 0,
+						disabled: u || !O && !t.trim(),
+						busy: c && !O,
+						variant: "solid",
+						size: "compact"
+					})]
+				})
+			]
+		})]
+	});
+}
+function w({ translations: e, items: t, onSelect: n, disabled: r, label: i = "Suggested requests" }) {
+	let o = b(e);
+	return t.length ? /* @__PURE__ */ a("div", {
+		class: "rv-ai-suggestions",
+		role: "group",
+		"aria-label": o(i),
+		children: t.map((e, t) => /* @__PURE__ */ a(u, {
+			className: "rv-ai-suggestion",
+			size: "compact",
+			disabled: r,
+			onFocus: (e) => {
+				e.currentTarget.scrollIntoView({
+					block: "nearest",
+					inline: "nearest"
+				});
+			},
+			onClick: () => n(e),
+			children: e
+		}, `${t}:${e}`))
+	}) : null;
+}
+function T({ translations: e, phase: t, message: n }) {
+	let r = b(e);
+	return /* @__PURE__ */ a("div", {
+		class: "rv-ai-status",
+		"data-state": t,
+		role: "status",
+		"aria-live": "polite",
+		"aria-atomic": "true",
+		children: [(t === "understanding" || t === "applying") && /* @__PURE__ */ a("span", {
+			"aria-hidden": "true",
+			children: /* @__PURE__ */ a(c, { label: "" })
+		}), /* @__PURE__ */ a("span", { children: r(n) })]
+	});
+}
+function E({ translations: e, summary: t, matchedRows: n, countLabel: r, actions: i, children: o }) {
+	let s = b(e);
+	return /* @__PURE__ */ a("div", {
+		class: "rv-ai-result",
+		role: "status",
+		"aria-live": "polite",
+		children: [
+			/* @__PURE__ */ a("p", {
+				class: "rv-ai-result-summary",
+				children: t
+			}),
+			n !== void 0 && /* @__PURE__ */ a("p", {
+				class: "rv-ai-result-count",
+				children: r ? r(n) : s("{count} matching rows", { count: n.toLocaleString() })
+			}),
+			o,
+			i && /* @__PURE__ */ a("div", {
+				class: "rv-ai-result-actions",
+				children: i
+			})
+		]
+	});
+}
+function D({ translations: e = {}, label: t = "AI view assistant", children: n, footer: r, busy: i }) {
+	return /* @__PURE__ */ a(y, {
+		translations: e,
+		children: /* @__PURE__ */ a("section", {
+			class: "rv-ai-assistant",
+			"aria-label": ((t) => _(t, e))(t),
+			"aria-busy": i || void 0,
+			children: [n, r && /* @__PURE__ */ a("div", {
+				class: "rv-ai-assistant-footer",
+				children: r
+			})]
+		})
+	});
+}
+//#endregion
+//#region src/ai/request-trail.tsx
+function O({ translations: e, items: r, onRemove: s, onClear: c, onEmpty: l, disabled: g, removalsDisabled: _, label: v = "View steps", triggerLabel: y, clearLabel: x = "Clear all", clearDescription: S, removeLabel: C, countLabel: w, changedMessage: T }) {
+	let E = b(e), D = w ?? ((e) => E(e === 1 ? "{count} applied request" : "{count} applied requests", { count: e })), O = C ?? ((e) => E("Remove request: {label}", { label: e.label })), k = i(null), A = i(null), j = i(null), [M] = t(() => f("rv-ai-steps")), [N, P] = t(!1), F = r.length > 0;
+	n(() => {
+		if (F || P(!1), !N || !F || !k.current || !A.current || !j.current) return;
+		let e = j.current, t = new m(), n = !0;
+		return t.open({
+			anchor: A.current,
+			content: e,
+			appendTo: k.current,
+			onClose: () => {
+				n && P(!1);
+			}
+		}), e.focus({ preventScroll: !0 }), () => {
+			n = !1, t.destroy(), e.hidden = !0;
+		};
+	}, [N, F]);
+	let I = i();
+	if (n(() => {
+		let e = I.current;
+		if (!e) return;
+		if (g) {
+			e.sawBusy = !0;
+			return;
+		}
+		if (e.id ? r.some((t) => t.id === e.id) : r.length > 0) {
+			(e.sawBusy || e.id && _) && (I.current = void 0);
+			return;
+		}
+		I.current = void 0;
+		let t = e.button.ownerDocument.activeElement;
+		if (t !== e.button && t !== e.button.ownerDocument.body) return;
+		let n = k.current?.querySelectorAll(".rv-remove-button");
+		n?.length && N ? n[Math.min(e.index, n.length - 1)]?.focus() : r.length || l?.();
+	}, [
+		r,
+		l,
+		g,
+		_,
+		N
+	]), !F) return null;
+	let L = 0, R = r.reduce((e, t) => e + (t.count ?? 1), 0);
+	return /* @__PURE__ */ a("div", {
+		class: "rv-ai-request-trail",
+		role: "group",
+		"aria-label": E(v),
+		ref: k,
+		onFocusOut: (e) => {
+			e.relatedTarget instanceof Node && !e.currentTarget.contains(e.relatedTarget) && P(!1);
+		},
+		children: [/* @__PURE__ */ a(u, {
+			ref: A,
+			className: "rv-ai-trail-trigger",
+			variant: "ghost",
+			size: "compact",
+			disabled: g,
+			"aria-haspopup": "dialog",
+			"aria-expanded": N,
+			"aria-controls": M,
+			onClick: () => P((e) => !e),
+			children: [y ? y(R) : E(R === 1 ? "{count} step" : "{count} steps", { count: R }), /* @__PURE__ */ a(o, {
+				svg: p,
+				size: 10
+			})]
+		}), /* @__PURE__ */ a("div", {
+			ref: j,
+			id: M,
+			class: "rv-popover rv-ai-trail-popover",
+			role: "dialog",
+			"aria-label": E(v),
+			tabIndex: -1,
+			hidden: !N,
+			children: [
+				/* @__PURE__ */ a("div", {
+					class: "rv-ai-trail-header",
+					children: /* @__PURE__ */ a("span", {
+						class: "rv-ai-trail-label",
+						children: [E(v), /* @__PURE__ */ a(d, {
+							count: R,
+							label: D(R)
+						})]
+					})
+				}),
+				/* @__PURE__ */ a("ol", {
+					class: "rv-ai-trail-steps",
+					"aria-label": D(R),
+					children: r.map((e, t) => {
+						let n = L + 1;
+						return L += e.count ?? 1, /* @__PURE__ */ a("li", {
+							class: "rv-ai-step",
+							"data-current": t === r.length - 1 || void 0,
+							onFocusCapture: (e) => e.currentTarget.scrollIntoView({
+								block: "nearest",
+								inline: "nearest"
+							}),
+							children: /* @__PURE__ */ a("span", {
+								class: "rv-ai-step-chip",
+								children: [
+									/* @__PURE__ */ a("span", {
+										class: "rv-ai-step-number",
+										"aria-hidden": "true",
+										children: n === L ? n : `${n}–${L}`
+									}),
+									/* @__PURE__ */ a("span", {
+										class: "rv-ai-step-label",
+										title: e.label,
+										children: e.label
+									}),
+									/* @__PURE__ */ a(h, {
+										compact: !0,
+										disabled: g || _,
+										locale: {
+											title: O(e),
+											ariaLabel: O(e)
+										},
+										onClick: (n) => {
+											n.preventDefault(), I.current = {
+												button: n.currentTarget,
+												index: t,
+												id: e.id
+											}, s(e.id);
+										}
+									})
+								]
+							})
+						}, e.id);
+					})
+				}),
+				T && /* @__PURE__ */ a("p", {
+					class: "rv-ai-trail-message",
+					children: E(T)
+				}),
+				/* @__PURE__ */ a("div", {
+					class: "rv-ai-trail-footer",
+					children: /* @__PURE__ */ a(u, {
+						variant: "ghost",
+						size: "compact",
+						disabled: g,
+						title: S ? E(S) : void 0,
+						onClick: (e) => {
+							e.preventDefault(), I.current = {
+								button: e.currentTarget,
+								index: 0
+							}, c();
+						},
+						children: E(x)
+					})
+				})
+			]
+		})]
+	});
+}
+//#endregion
+export { E as a, g as c, C as i, _ as l, T as n, w as o, D as r, y as s, O as t };