@runlume/admin-ui 0.1.0 → 0.2.0

package/dist-package/components/editable-table.js

@@ -0,0 +1,212 @@
+import { cn as e } from "../lib/utils.js";
+import { Button as t } from "./ui/button.js";
+import { useUiTranslation as n } from "../lib/use-ui-translation.js";
+import { Input as r } from "./ui/input.js";
+import { NativeSelect as i } from "./ui/native-select.js";
+import { Switch as a } from "./ui/switch.js";
+import { Table as o, TableBody as s, TableCell as c, TableHead as l, TableHeader as u, TableRow as d } from "./ui/table.js";
+import { useEffect as f, useRef as p, useState as m } from "react";
+import { Check as h, Plus as g, SquarePen as _, Trash2 as v, X as y } from "lucide-react";
+import { Fragment as b, jsx as x, jsxs as S } from "react/jsx-runtime";
+//#region src/components/editable-table.tsx
+function C({ id: e, column: t, index: o, value: s, onChange: c }) {
+	let { t: l } = n(), u = l("editableTable.cellLabel", {
+		column: t.label,
+		index: o + 1
+	});
+	switch (t.type) {
+		case "select": return /* @__PURE__ */ S(i, {
+			id: e,
+			"aria-label": u,
+			value: s,
+			onChange: (e) => c(e.target.value),
+			children: [/* @__PURE__ */ x("option", {
+				value: "",
+				children: l("editableTable.emptyCell")
+			}), t.options?.map((e) => /* @__PURE__ */ x("option", {
+				value: e.value,
+				children: e.label
+			}, e.value))]
+		});
+		case "switch": return /* @__PURE__ */ x(a, {
+			id: e,
+			"aria-label": u,
+			checked: s === "true",
+			onCheckedChange: (e) => c(e ? "true" : "false")
+		});
+		case "date":
+		case "number": return /* @__PURE__ */ x(r, {
+			id: e,
+			type: t.type,
+			className: "h-9",
+			"aria-label": u,
+			placeholder: t.placeholder,
+			value: s,
+			onChange: (e) => c(e.target.value)
+		});
+		default: return /* @__PURE__ */ x(r, {
+			id: e,
+			className: "h-9",
+			"aria-label": u,
+			placeholder: t.placeholder,
+			value: s,
+			onChange: (e) => c(e.target.value)
+		});
+	}
+}
+function w({ column: t, value: r }) {
+	let { t: i } = n();
+	if (t.type === "switch") return /* @__PURE__ */ x("span", {
+		className: e("text-sm", r !== "true" && "text-muted-foreground"),
+		children: i(r === "true" ? "editableTable.on" : "editableTable.off")
+	});
+	let a = t.type === "select" ? t.options?.find((e) => e.value === r)?.label : r;
+	return /* @__PURE__ */ x("span", {
+		className: e(!a && "text-muted-foreground"),
+		children: a || i("editableTable.emptyCell")
+	});
+}
+function T({ columns: r, defaultRows: i = [], onChange: a, maxRows: T, stickyActions: E = !0, className: D }) {
+	let { t: O } = n(), [k, A] = m(() => i.map((e) => ({
+		...e,
+		editing: !1,
+		draft: e.values,
+		isNew: !1
+	}))), j = p(0), M = p(null);
+	f(() => {
+		if (!M.current) return;
+		let e = r[0], t = e ? document.getElementById(`${M.current}-${e.key}`) : null;
+		M.current = null, t instanceof HTMLInputElement && t.focus();
+	});
+	function N(e) {
+		A(e), a?.(e.map(({ id: e, values: t }) => ({
+			id: e,
+			values: t
+		})));
+	}
+	function P() {
+		j.current += 1;
+		let e = `new-${j.current}`;
+		M.current = e, N([...k, {
+			id: e,
+			values: {},
+			draft: {},
+			editing: !0,
+			isNew: !0
+		}]);
+	}
+	function F(e) {
+		N(k.map((t) => t.id === e ? {
+			...t,
+			editing: !0,
+			draft: t.values
+		} : t));
+	}
+	function I(e) {
+		N(k.map((t) => t.id === e ? {
+			...t,
+			editing: !1,
+			values: t.draft,
+			isNew: !1
+		} : t));
+	}
+	function L(e) {
+		if (k.find((t) => t.id === e)?.isNew) {
+			N(k.filter((t) => t.id !== e));
+			return;
+		}
+		N(k.map((t) => t.id === e ? {
+			...t,
+			editing: !1,
+			draft: t.values
+		} : t));
+	}
+	function R(e) {
+		N(k.filter((t) => t.id !== e));
+	}
+	function z(e, t, n) {
+		A((r) => r.map((r) => r.id === e ? {
+			...r,
+			draft: {
+				...r.draft,
+				[t]: n
+			}
+		} : r));
+	}
+	return /* @__PURE__ */ x("div", {
+		className: e("data-table flex flex-col overflow-hidden rounded-lg border border-table-border bg-card", "[&>[data-slot=table-container]]:overflow-x-auto", "[&_[data-slot=table-header]]:sticky [&_[data-slot=table-header]]:top-0 [&_[data-slot=table-header]]:z-10", T && "[&>[data-slot=table-container]]:max-h-(--editable-table-max-height)", D),
+		style: T ? { "--editable-table-max-height": `${T * 45 + 45}px` } : void 0,
+		children: /* @__PURE__ */ S(o, { children: [/* @__PURE__ */ x(u, { children: /* @__PURE__ */ S(d, { children: [r.map((e) => /* @__PURE__ */ x(l, { children: e.label }, e.key)), /* @__PURE__ */ x(l, {
+			className: e("w-px whitespace-nowrap text-left", E && "sticky right-0 z-10 border-l border-table-border bg-table-header"),
+			children: O("sample.columnActions")
+		})] }) }), /* @__PURE__ */ S(s, { children: [k.map((n, i) => /* @__PURE__ */ S(d, {
+			className: "group/row",
+			"data-editing": n.editing || void 0,
+			children: [r.map((e) => /* @__PURE__ */ x(c, {
+				className: "align-middle",
+				children: n.editing ? /* @__PURE__ */ x(C, {
+					id: `${n.id}-${e.key}`,
+					column: e,
+					index: i,
+					value: n.draft[e.key] ?? "",
+					onChange: (t) => z(n.id, e.key, t)
+				}) : /* @__PURE__ */ x(w, {
+					column: e,
+					value: n.values[e.key] ?? ""
+				})
+			}, e.key)), /* @__PURE__ */ x(c, {
+				className: e(E && "sticky right-0 z-10 border-l border-table-border bg-card group-hover/row:bg-table-hover"),
+				children: /* @__PURE__ */ x("div", {
+					className: "flex justify-start gap-2",
+					children: n.editing ? /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(t, {
+						type: "button",
+						size: "icon-sm",
+						onClick: () => I(n.id),
+						"aria-label": O("editableTable.saveRow", { index: i + 1 }),
+						title: O("save"),
+						children: /* @__PURE__ */ x(h, { "aria-hidden": "true" })
+					}), /* @__PURE__ */ x(t, {
+						type: "button",
+						size: "icon-sm",
+						variant: "outline",
+						onClick: () => L(n.id),
+						"aria-label": O("editableTable.cancelRow", { index: i + 1 }),
+						title: O("cancel"),
+						children: /* @__PURE__ */ x(y, { "aria-hidden": "true" })
+					})] }) : /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(t, {
+						type: "button",
+						size: "icon-sm",
+						variant: "outline",
+						onClick: () => F(n.id),
+						"aria-label": O("editableTable.editRow", { index: i + 1 }),
+						title: O("editableTable.edit"),
+						children: /* @__PURE__ */ x(_, { "aria-hidden": "true" })
+					}), /* @__PURE__ */ x(t, {
+						type: "button",
+						size: "icon-sm",
+						variant: "outline",
+						className: "border-danger/25 bg-danger-soft text-danger hover:border-danger/40 hover:bg-danger/12 hover:text-danger",
+						onClick: () => R(n.id),
+						"aria-label": O("editableTable.removeRow", { index: i + 1 }),
+						title: O("editableTable.remove"),
+						children: /* @__PURE__ */ x(v, { "aria-hidden": "true" })
+					})] })
+				})
+			})]
+		}, n.id)), /* @__PURE__ */ x(d, { children: /* @__PURE__ */ x(c, {
+			colSpan: r.length + 1,
+			className: "p-0",
+			children: /* @__PURE__ */ S("button", {
+				type: "button",
+				onClick: P,
+				className: "flex h-11 w-full items-center justify-center gap-2 text-sm text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
+				children: [/* @__PURE__ */ x(g, {
+					"aria-hidden": "true",
+					className: "size-4"
+				}), O("editableTable.addRow")]
+			})
+		}) })] })] })
+	});
+}
+//#endregion
+export { T as EditableTable };

package/dist-package/components/filter-presets.cjs

@@ -0,0 +1 @@
+const e=require("../lib/use-ui-translation.cjs"),t=require("../lib/presets.cjs"),n=require("./storage-box.cjs");let r=require("react/jsx-runtime");function i({storageId:i,value:a,onApply:o,summary:s}){let{t:c}=e.useUiTranslation();return(0,r.jsx)(n.StorageBox,{title:c(`presets`),storageId:`filter.${i}`,snapshot:a,onRestore:o,summary:s??(e=>t.describePresetValue(e))})}exports.FilterPresets=i;

package/dist-package/components/filter-presets.d.ts

@@ -0,0 +1,11 @@
+/**
+ * 筛选预设：储物箱在"筛选条件"场景的语义化封装，保持既有调用方 API 不变。
+ */
+export declare function FilterPresets<T>({ storageId, value, onApply, summary, }: {
+    storageId: string;
+    value: T;
+    onApply: (value: T) => void;
+    /** 列表里的摘要文案；不传时用通用格式化（键: 值 · 键: 值） */
+    summary?: (value: T) => string;
+}): import("react").JSX.Element;
+//# sourceMappingURL=filter-presets.d.ts.map

package/dist-package/components/filter-presets.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"filter-presets.d.ts","sourceRoot":"","sources":["../../src/components/filter-presets.tsx"],"names":[],"mappings":"AAIA;;GAEG;AACH,wBAAgB,aAAa,CAAC,CAAC,EAAE,EAC/B,SAAS,EACT,KAAK,EACL,OAAO,EACP,OAAO,GACR,EAAE;IACD,SAAS,EAAE,MAAM,CAAA;IACjB,KAAK,EAAE,CAAC,CAAA;IACR,OAAO,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAA;IAC3B,sCAAsC;IACtC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,MAAM,CAAA;CAC/B,+BAWA"}

package/dist-package/components/filter-presets.js

@@ -0,0 +1,17 @@
+import { useUiTranslation as e } from "../lib/use-ui-translation.js";
+import { describePresetValue as t } from "../lib/presets.js";
+import { StorageBox as n } from "./storage-box.js";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/components/filter-presets.tsx
+function i({ storageId: i, value: a, onApply: o, summary: s }) {
+	let { t: c } = e();
+	return /* @__PURE__ */ r(n, {
+		title: c("presets"),
+		storageId: `filter.${i}`,
+		snapshot: a,
+		onRestore: o,
+		summary: s ?? ((e) => t(e))
+	});
+}
+//#endregion
+export { i as FilterPresets };

package/dist-package/components/fixed-bar.cjs

@@ -0,0 +1 @@
+const e=require("../lib/utils.cjs");let t=require("react/jsx-runtime");function n({children:n,hint:r,className:i}){return(0,t.jsxs)(`div`,{"data-slot":`fixed-bar`,className:e.cn(`sticky bottom-0 z-20 -mx-4 mt-6 flex flex-wrap items-center justify-between gap-3 border-t bg-background/95 px-4 py-3 backdrop-blur sm:-mx-6 sm:px-6`,i),children:[(0,t.jsx)(`span`,{className:`text-xs text-muted-foreground`,children:r}),(0,t.jsx)(`div`,{className:`flex flex-wrap items-center gap-2`,children:n})]})}exports.FixedBar=n;

package/dist-package/components/fixed-bar.d.ts

@@ -0,0 +1,11 @@
+import type { ReactNode } from 'react';
+/**
+ * 页面底部固定操作条。
+ * 长表单或详情页把保存、取消放在这里，滚动时始终可见。
+ */
+export declare function FixedBar({ children, hint, className, }: {
+    children: ReactNode;
+    hint?: ReactNode;
+    className?: string;
+}): import("react").JSX.Element;
+//# sourceMappingURL=fixed-bar.d.ts.map

package/dist-package/components/fixed-bar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fixed-bar.d.ts","sourceRoot":"","sources":["../../src/components/fixed-bar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGtC;;;GAGG;AACH,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,IAAI,EACJ,SAAS,GACV,EAAE;IACD,QAAQ,EAAE,SAAS,CAAA;IACnB,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,+BAaA"}

package/dist-package/components/fixed-bar.js

@@ -0,0 +1,18 @@
+import { cn as e } from "../lib/utils.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/components/fixed-bar.tsx
+function r({ children: r, hint: i, className: a }) {
+	return /* @__PURE__ */ n("div", {
+		"data-slot": "fixed-bar",
+		className: e("sticky bottom-0 z-20 -mx-4 mt-6 flex flex-wrap items-center justify-between gap-3 border-t bg-background/95 px-4 py-3 backdrop-blur sm:-mx-6 sm:px-6", a),
+		children: [/* @__PURE__ */ t("span", {
+			className: "text-xs text-muted-foreground",
+			children: i
+		}), /* @__PURE__ */ t("div", {
+			className: "flex flex-wrap items-center gap-2",
+			children: r
+		})]
+	});
+}
+//#endregion
+export { r as FixedBar };

package/dist-package/components/image-preview.cjs

@@ -0,0 +1 @@
+const e=require("../lib/utils.cjs"),t=require("./ui/button.cjs"),n=require("../lib/use-ui-translation.cjs"),r=require("./ui/dialog.cjs");let i=require("react"),a=require("lucide-react"),o=require("react/jsx-runtime");function s({src:s,alt:c,images:l,children:u}){let{t:d}=n.useUiTranslation(),[f,p]=(0,i.useState)(!1),m=l?.length?l:[{src:s,alt:c}],[h,g]=(0,i.useState)(0),[_,v]=(0,i.useState)(1),[y,b]=(0,i.useState)({x:0,y:0}),x=(0,i.useRef)(null),S=m[Math.min(h,m.length-1)]??{src:s,alt:c};return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(`button`,{type:`button`,"aria-label":`${d(`imagePreview.open`)} ${c}`,className:`rounded-lg outline-none focus-visible:ring-2 focus-visible:ring-ring/40`,onClick:()=>p(!0),children:u??(0,o.jsx)(`img`,{src:s,alt:c,className:`max-h-32 rounded-lg border`})}),(0,o.jsx)(r.Dialog,{open:f,onOpenChange:e=>{p(e),e||(v(1),b({x:0,y:0}))},children:(0,o.jsxs)(r.DialogContent,{className:`h-[min(88dvh,56rem)] grid-rows-[1fr] overflow-hidden p-0 sm:max-w-[min(92vw,80rem)] [&_[data-slot=dialog-close]]:top-5 [&_[data-slot=dialog-close]]:right-5 [&_[data-slot=dialog-close]]:rounded-md [&_[data-slot=dialog-close]]:p-2`,children:[(0,o.jsx)(r.DialogTitle,{className:`sr-only`,children:S.alt}),(0,o.jsx)(r.DialogDescription,{className:`sr-only`,children:d(`imagePreview.hint`)}),(0,o.jsxs)(`div`,{className:`absolute top-4 left-1/2 z-10 flex -translate-x-1/2 items-center gap-1 rounded-xl border bg-background/90 p-1.5 shadow-sm backdrop-blur`,children:[(0,o.jsx)(t.Button,{type:`button`,variant:`outline`,size:`icon-sm`,"aria-label":d(`imagePreview.zoomOut`),disabled:_<=.5,onClick:()=>{v(e=>Math.max(.5,e-.25)),b({x:0,y:0})},children:(0,o.jsx)(a.Minus,{"aria-hidden":`true`})}),(0,o.jsxs)(`span`,{className:`w-12 text-center text-xs tabular-nums text-muted-foreground`,children:[Math.round(_*100),`%`]}),(0,o.jsx)(t.Button,{type:`button`,variant:`outline`,size:`icon-sm`,"aria-label":d(`imagePreview.zoomIn`),disabled:_>=3,onClick:()=>v(e=>Math.min(3,e+.25)),children:(0,o.jsx)(a.Plus,{"aria-hidden":`true`})}),(0,o.jsx)(t.Button,{type:`button`,variant:`outline`,size:`icon-sm`,"aria-label":d(`imagePreview.resetZoom`),onClick:()=>{v(1),b({x:0,y:0})},children:(0,o.jsx)(a.RotateCcw,{"aria-hidden":`true`})})]}),(0,o.jsx)(`div`,{className:`flex min-h-0 items-center justify-center overflow-hidden px-6 pt-20 pb-6`,children:(0,o.jsx)(`img`,{src:S.src,alt:S.alt,style:{scale:String(_),translate:`${y.x}px ${y.y}px`},draggable:!1,onPointerDown:e=>{_<=1||(e.currentTarget.setPointerCapture(e.pointerId),x.current={x:e.clientX,y:e.clientY,origin:y})},onPointerMove:e=>{x.current&&b({x:x.current.origin.x+(e.clientX-x.current.x),y:x.current.origin.y+(e.clientY-x.current.y)})},onPointerUp:()=>{x.current=null},onDoubleClick:()=>{v(e=>e===1?2:1),b({x:0,y:0})},className:e.cn(`h-full w-full select-none rounded-lg object-contain transition-transform`,_>1&&`cursor-grab active:cursor-grabbing`)})}),m.length>1&&(0,o.jsxs)(`div`,{className:`absolute inset-x-6 bottom-4 flex items-center justify-between gap-3 rounded-xl border bg-background/90 p-2 shadow-sm backdrop-blur`,children:[(0,o.jsx)(t.Button,{type:`button`,variant:`outline`,size:`sm`,disabled:h===0,onClick:()=>g(e=>Math.max(0,e-1)),children:d(`previous`)}),(0,o.jsx)(`span`,{className:`text-xs text-muted-foreground`,children:d(`imagePreview.position`,{current:h+1,total:m.length})}),(0,o.jsx)(t.Button,{type:`button`,variant:`outline`,size:`sm`,disabled:h>=m.length-1,onClick:()=>g(e=>Math.min(m.length-1,e+1)),children:d(`next`)})]}),(0,o.jsx)(`p`,{className:`sr-only`,children:(0,o.jsx)(a.Maximize2,{"aria-hidden":`true`})})]})})]})}exports.ImagePreview=s;

package/dist-package/components/image-preview.d.ts

@@ -0,0 +1,14 @@
+import { type ReactNode } from 'react';
+/** 图片预览：点击缩略图放大，Esc 关闭。 */
+export declare function ImagePreview({ src, alt, images, children, }: {
+    src: string;
+    alt: string;
+    /** 传入多张图时可在预览里左右切换；不传则只看 src。 */
+    images?: {
+        src: string;
+        alt: string;
+    }[];
+    /** 缩略图内容，默认直接渲染图片。 */
+    children?: ReactNode;
+}): import("react").JSX.Element;
+//# sourceMappingURL=image-preview.d.ts.map

package/dist-package/components/image-preview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-preview.d.ts","sourceRoot":"","sources":["../../src/components/image-preview.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAOxD,2BAA2B;AAC3B,wBAAgB,YAAY,CAAC,EAC3B,GAAG,EACH,GAAG,EACH,MAAM,EACN,QAAQ,GACT,EAAE;IACD,GAAG,EAAE,MAAM,CAAA;IACX,GAAG,EAAE,MAAM,CAAA;IACX,iCAAiC;IACjC,MAAM,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,EAAE,CAAA;IACvC,sBAAsB;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB,+BAuIA"}

package/dist-package/components/image-preview.js

@@ -0,0 +1,166 @@
+import { cn as e } from "../lib/utils.js";
+import { Button as t } from "./ui/button.js";
+import { useUiTranslation as n } from "../lib/use-ui-translation.js";
+import { Dialog as r, DialogContent as i, DialogDescription as a, DialogTitle as o } from "./ui/dialog.js";
+import { useRef as s, useState as c } from "react";
+import { Maximize2 as l, Minus as u, Plus as d, RotateCcw as f } from "lucide-react";
+import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
+//#region src/components/image-preview.tsx
+function g({ src: g, alt: _, images: v, children: y }) {
+	let { t: b } = n(), [x, S] = c(!1), C = v?.length ? v : [{
+		src: g,
+		alt: _
+	}], [w, T] = c(0), [E, D] = c(1), [O, k] = c({
+		x: 0,
+		y: 0
+	}), A = s(null), j = C[Math.min(w, C.length - 1)] ?? {
+		src: g,
+		alt: _
+	};
+	return /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m("button", {
+		type: "button",
+		"aria-label": `${b("imagePreview.open")} ${_}`,
+		className: "rounded-lg outline-none focus-visible:ring-2 focus-visible:ring-ring/40",
+		onClick: () => S(!0),
+		children: y ?? /* @__PURE__ */ m("img", {
+			src: g,
+			alt: _,
+			className: "max-h-32 rounded-lg border"
+		})
+	}), /* @__PURE__ */ m(r, {
+		open: x,
+		onOpenChange: (e) => {
+			S(e), e || (D(1), k({
+				x: 0,
+				y: 0
+			}));
+		},
+		children: /* @__PURE__ */ h(i, {
+			className: "h-[min(88dvh,56rem)] grid-rows-[1fr] overflow-hidden p-0 sm:max-w-[min(92vw,80rem)] [&_[data-slot=dialog-close]]:top-5 [&_[data-slot=dialog-close]]:right-5 [&_[data-slot=dialog-close]]:rounded-md [&_[data-slot=dialog-close]]:p-2",
+			children: [
+				/* @__PURE__ */ m(o, {
+					className: "sr-only",
+					children: j.alt
+				}),
+				/* @__PURE__ */ m(a, {
+					className: "sr-only",
+					children: b("imagePreview.hint")
+				}),
+				/* @__PURE__ */ h("div", {
+					className: "absolute top-4 left-1/2 z-10 flex -translate-x-1/2 items-center gap-1 rounded-xl border bg-background/90 p-1.5 shadow-sm backdrop-blur",
+					children: [
+						/* @__PURE__ */ m(t, {
+							type: "button",
+							variant: "outline",
+							size: "icon-sm",
+							"aria-label": b("imagePreview.zoomOut"),
+							disabled: E <= .5,
+							onClick: () => {
+								D((e) => Math.max(.5, e - .25)), k({
+									x: 0,
+									y: 0
+								});
+							},
+							children: /* @__PURE__ */ m(u, { "aria-hidden": "true" })
+						}),
+						/* @__PURE__ */ h("span", {
+							className: "w-12 text-center text-xs tabular-nums text-muted-foreground",
+							children: [Math.round(E * 100), "%"]
+						}),
+						/* @__PURE__ */ m(t, {
+							type: "button",
+							variant: "outline",
+							size: "icon-sm",
+							"aria-label": b("imagePreview.zoomIn"),
+							disabled: E >= 3,
+							onClick: () => D((e) => Math.min(3, e + .25)),
+							children: /* @__PURE__ */ m(d, { "aria-hidden": "true" })
+						}),
+						/* @__PURE__ */ m(t, {
+							type: "button",
+							variant: "outline",
+							size: "icon-sm",
+							"aria-label": b("imagePreview.resetZoom"),
+							onClick: () => {
+								D(1), k({
+									x: 0,
+									y: 0
+								});
+							},
+							children: /* @__PURE__ */ m(f, { "aria-hidden": "true" })
+						})
+					]
+				}),
+				/* @__PURE__ */ m("div", {
+					className: "flex min-h-0 items-center justify-center overflow-hidden px-6 pt-20 pb-6",
+					children: /* @__PURE__ */ m("img", {
+						src: j.src,
+						alt: j.alt,
+						style: {
+							scale: String(E),
+							translate: `${O.x}px ${O.y}px`
+						},
+						draggable: !1,
+						onPointerDown: (e) => {
+							E <= 1 || (e.currentTarget.setPointerCapture(e.pointerId), A.current = {
+								x: e.clientX,
+								y: e.clientY,
+								origin: O
+							});
+						},
+						onPointerMove: (e) => {
+							A.current && k({
+								x: A.current.origin.x + (e.clientX - A.current.x),
+								y: A.current.origin.y + (e.clientY - A.current.y)
+							});
+						},
+						onPointerUp: () => {
+							A.current = null;
+						},
+						onDoubleClick: () => {
+							D((e) => e === 1 ? 2 : 1), k({
+								x: 0,
+								y: 0
+							});
+						},
+						className: e("h-full w-full select-none rounded-lg object-contain transition-transform", E > 1 && "cursor-grab active:cursor-grabbing")
+					})
+				}),
+				C.length > 1 && /* @__PURE__ */ h("div", {
+					className: "absolute inset-x-6 bottom-4 flex items-center justify-between gap-3 rounded-xl border bg-background/90 p-2 shadow-sm backdrop-blur",
+					children: [
+						/* @__PURE__ */ m(t, {
+							type: "button",
+							variant: "outline",
+							size: "sm",
+							disabled: w === 0,
+							onClick: () => T((e) => Math.max(0, e - 1)),
+							children: b("previous")
+						}),
+						/* @__PURE__ */ m("span", {
+							className: "text-xs text-muted-foreground",
+							children: b("imagePreview.position", {
+								current: w + 1,
+								total: C.length
+							})
+						}),
+						/* @__PURE__ */ m(t, {
+							type: "button",
+							variant: "outline",
+							size: "sm",
+							disabled: w >= C.length - 1,
+							onClick: () => T((e) => Math.min(C.length - 1, e + 1)),
+							children: b("next")
+						})
+					]
+				}),
+				/* @__PURE__ */ m("p", {
+					className: "sr-only",
+					children: /* @__PURE__ */ m(l, { "aria-hidden": "true" })
+				})
+			]
+		})
+	})] });
+}
+//#endregion
+export { g as ImagePreview };

package/dist-package/components/layout-container.cjs

@@ -0,0 +1 @@
+const e=require("../lib/utils.cjs"),t=require("./ui/button.cjs"),n=require("../lib/use-ui-translation.cjs"),r=require("../lib/storage-key.cjs");let i=require("react"),a=require("lucide-react"),o=require("react/jsx-runtime");function s({children:s,aside:c,asideLabel:l,defaultCollapsed:u=!1,storageId:d,onWidthChange:f,className:p}){let{t:m}=n.useUiTranslation(),[h,g]=(0,i.useState)(u),[_,v]=(0,i.useState)(()=>{if(!d)return 288;let e=Number(localStorage.getItem(r.storageKey(`aside.${d}`)));return Number.isFinite(e)&&e>=200&&e<=560?e:288});(0,i.useEffect)(()=>{if(f?.(_),d)try{localStorage.setItem(r.storageKey(`aside.${d}`),String(_))}catch{}},[d,_,f]);let y=(0,i.useRef)(null),[b,x]=(0,i.useState)(!1);return(0,o.jsxs)(`div`,{"data-slot":`layout-container`,className:e.cn(`flex min-h-0 w-full gap-4`,p),children:[(0,o.jsx)(`div`,{className:`min-w-0 flex-1`,children:s}),c&&(0,o.jsxs)(`aside`,{"aria-label":l??m(`layoutContainer.aside`),style:{width:h?48:_},className:e.cn(`relative shrink-0 overflow-hidden border-l pl-4`,!b&&`transition-[width] duration-200`),children:[(0,o.jsx)(t.Button,{type:`button`,variant:`ghost`,size:`icon-sm`,"aria-expanded":!h,"aria-label":m(h?`layoutContainer.expand`:`layoutContainer.collapse`),onClick:()=>g(e=>!e),children:h?(0,o.jsx)(a.PanelLeftOpen,{"aria-hidden":`true`}):(0,o.jsx)(a.PanelLeftClose,{"aria-hidden":`true`})}),!h&&(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(`span`,{role:`separator`,"aria-orientation":`vertical`,"aria-label":m(`layoutContainer.resize`),"aria-valuenow":_,"aria-valuemin":200,"aria-valuemax":560,tabIndex:0,className:`absolute inset-y-0 left-0 w-1.5 cursor-col-resize hover:bg-primary/30`,onPointerDown:e=>{e.currentTarget.setPointerCapture(e.pointerId),y.current={x:e.clientX,width:_},x(!0)},onPointerMove:e=>{if(!y.current)return;let t=y.current.width-(e.clientX-y.current.x);v(Math.min(560,Math.max(200,t)))},onPointerUp:()=>{y.current=null,x(!1)},onDoubleClick:()=>v(288),onKeyDown:e=>{(e.key===`ArrowLeft`||e.key===`ArrowRight`)&&(e.preventDefault(),v(t=>Math.min(560,Math.max(200,t+(e.key===`ArrowRight`?16:-16)))))}}),(0,o.jsx)(`div`,{className:`mt-3 space-y-3 text-sm`,children:c}),(0,o.jsx)(a.GripVertical,{"aria-hidden":`true`,className:`sr-only`})]})]})]})}exports.LayoutContainer=s;

package/dist-package/components/layout-container.d.ts

@@ -0,0 +1,17 @@
+import { type ReactNode } from 'react';
+/**
+ * 布局容器：主内容 + 可折叠侧栏（三栏详情常用右侧详情面板）。
+ * 侧栏折叠状态只影响当前视图，不写入偏好。
+ */
+export declare function LayoutContainer({ children, aside, asideLabel, defaultCollapsed, storageId, onWidthChange, className, }: {
+    children: ReactNode;
+    aside?: ReactNode;
+    /** 侧栏的访问名称。 */
+    asideLabel?: string;
+    defaultCollapsed?: boolean;
+    /** 传入后把宽度保存在浏览器，并与业务共享当前宽度。 */
+    storageId?: string;
+    onWidthChange?: (width: number) => void;
+    className?: string;
+}): import("react").JSX.Element;
+//# sourceMappingURL=layout-container.d.ts.map

package/dist-package/components/layout-container.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout-container.d.ts","sourceRoot":"","sources":["../../src/components/layout-container.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAOnE;;;GAGG;AACH,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,KAAK,EACL,UAAU,EACV,gBAAwB,EACxB,SAAS,EACT,aAAa,EACb,SAAS,GACV,EAAE;IACD,QAAQ,EAAE,SAAS,CAAA;IACnB,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,eAAe;IACf,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,+BA6FA"}

package/dist-package/components/layout-container.js

@@ -0,0 +1,85 @@
+import { cn as e } from "../lib/utils.js";
+import { Button as t } from "./ui/button.js";
+import { useUiTranslation as n } from "../lib/use-ui-translation.js";
+import { storageKey as r } from "../lib/storage-key.js";
+import { useEffect as i, useRef as a, useState as o } from "react";
+import { GripVertical as s, PanelLeftClose as c, PanelLeftOpen as l } from "lucide-react";
+import { Fragment as u, jsx as d, jsxs as f } from "react/jsx-runtime";
+//#region src/components/layout-container.tsx
+function p({ children: p, aside: m, asideLabel: h, defaultCollapsed: g = !1, storageId: _, onWidthChange: v, className: y }) {
+	let { t: b } = n(), [x, S] = o(g), [C, w] = o(() => {
+		if (!_) return 288;
+		let e = Number(localStorage.getItem(r(`aside.${_}`)));
+		return Number.isFinite(e) && e >= 200 && e <= 560 ? e : 288;
+	});
+	i(() => {
+		if (v?.(C), _) try {
+			localStorage.setItem(r(`aside.${_}`), String(C));
+		} catch {}
+	}, [
+		_,
+		C,
+		v
+	]);
+	let T = a(null), [E, D] = o(!1);
+	return /* @__PURE__ */ f("div", {
+		"data-slot": "layout-container",
+		className: e("flex min-h-0 w-full gap-4", y),
+		children: [/* @__PURE__ */ d("div", {
+			className: "min-w-0 flex-1",
+			children: p
+		}), m && /* @__PURE__ */ f("aside", {
+			"aria-label": h ?? b("layoutContainer.aside"),
+			style: { width: x ? 48 : C },
+			className: e("relative shrink-0 overflow-hidden border-l pl-4", !E && "transition-[width] duration-200"),
+			children: [/* @__PURE__ */ d(t, {
+				type: "button",
+				variant: "ghost",
+				size: "icon-sm",
+				"aria-expanded": !x,
+				"aria-label": b(x ? "layoutContainer.expand" : "layoutContainer.collapse"),
+				onClick: () => S((e) => !e),
+				children: d(x ? l : c, { "aria-hidden": "true" })
+			}), !x && /* @__PURE__ */ f(u, { children: [
+				/* @__PURE__ */ d("span", {
+					role: "separator",
+					"aria-orientation": "vertical",
+					"aria-label": b("layoutContainer.resize"),
+					"aria-valuenow": C,
+					"aria-valuemin": 200,
+					"aria-valuemax": 560,
+					tabIndex: 0,
+					className: "absolute inset-y-0 left-0 w-1.5 cursor-col-resize hover:bg-primary/30",
+					onPointerDown: (e) => {
+						e.currentTarget.setPointerCapture(e.pointerId), T.current = {
+							x: e.clientX,
+							width: C
+						}, D(!0);
+					},
+					onPointerMove: (e) => {
+						if (!T.current) return;
+						let t = T.current.width - (e.clientX - T.current.x);
+						w(Math.min(560, Math.max(200, t)));
+					},
+					onPointerUp: () => {
+						T.current = null, D(!1);
+					},
+					onDoubleClick: () => w(288),
+					onKeyDown: (e) => {
+						(e.key === "ArrowLeft" || e.key === "ArrowRight") && (e.preventDefault(), w((t) => Math.min(560, Math.max(200, t + (e.key === "ArrowRight" ? 16 : -16)))));
+					}
+				}),
+				/* @__PURE__ */ d("div", {
+					className: "mt-3 space-y-3 text-sm",
+					children: m
+				}),
+				/* @__PURE__ */ d(s, {
+					"aria-hidden": "true",
+					className: "sr-only"
+				})
+			] })]
+		})]
+	});
+}
+//#endregion
+export { p as LayoutContainer };

package/dist-package/components/mention.cjs

@@ -0,0 +1 @@
+const e=require("../lib/utils.cjs"),t=require("../lib/use-ui-translation.cjs");let n=require("react"),r=require("react/jsx-runtime"),i=require("pinyin-pro");var a=4,o=112;function s({value:s,onValueChange:c,options:l,trigger:u=`@`,label:d,placeholder:f,className:p}){let{t:m}=t.useUiTranslation(),h=(0,n.useRef)(null),[g,_]=(0,n.useState)(),[v,y]=(0,n.useState)(0),[b,x]=(0,n.useState)(`bottom`),S=l.filter(e=>g!==void 0&&(e.label.toLowerCase().includes(g.toLowerCase())||((0,i.match)(e.label,g,{continuous:!0})?.length??0)>0)),C=g!==void 0&&S.length>0;function w(){let e=window.getSelection();if(!e?.rangeCount)return;let t=e.anchorNode;if(!t||t.nodeType!==Node.TEXT_NODE)return;let n=(t.textContent??``).slice(0,e.anchorOffset),r=n.lastIndexOf(u);if(!(r<0||n.slice(r+u.length).includes(` `)))return n.slice(r+u.length)}function T(){c(h.current?.textContent??``),_(w()),y(0)}function E(){let e=h.current?.getBoundingClientRect();if(!e)return;let t=window.innerHeight-e.bottom-a,n=e.top-a;x(t<o&&n>t?`top`:`bottom`)}function D(e){let t=window.getSelection(),n=t?.anchorNode;if(!t||!n||n.nodeType!==Node.TEXT_NODE)return;let r=n.textContent??``,i=t.anchorOffset,a=r.slice(0,i).lastIndexOf(u);if(a<0)return;let o=document.createRange();o.setStart(n,a),o.setEnd(n,i),o.deleteContents();let s=document.createElement(`span`);s.dataset.mention=e.value,s.contentEditable=`false`,s.className=`mention-tag`,s.textContent=`${u}${e.label}`;let c=document.createTextNode(`\xA0`);o.insertNode(c),o.insertNode(s);let l=document.createRange();l.setStart(c,c.length),l.collapse(!0),t.removeAllRanges(),t.addRange(l),_(void 0),window.requestAnimationFrame(()=>{T(),h.current?.focus()})}function O(e){if(e.key===`Backspace`&&!C){let t=window.getSelection();if(t?.isCollapsed&&t.anchorNode){let n=t.anchorNode.previousSibling;if(n instanceof HTMLElement&&n.dataset.mention){e.preventDefault(),n.remove(),T();return}if(t.anchorOffset===0&&t.anchorNode.parentElement?.dataset.mention){e.preventDefault(),t.anchorNode.parentElement.remove(),T();return}}}if(C){if(e.key===`ArrowDown`)e.preventDefault(),y((v+1)%S.length);else if(e.key===`ArrowUp`)e.preventDefault(),y((v-1+S.length)%S.length);else if(e.key===`Enter`){e.preventDefault();let t=S[v];t&&D(t)}else e.key===`Escape`&&_(void 0)}}return(0,n.useEffect)(()=>{if(C)return E(),window.addEventListener(`resize`,E),window.addEventListener(`scroll`,E,!0),()=>{window.removeEventListener(`resize`,E),window.removeEventListener(`scroll`,E,!0)}},[C]),(0,r.jsxs)(`div`,{"data-slot":`mention`,className:e.cn(`relative`,p),children:[(0,r.jsx)(`div`,{ref:h,role:`textbox`,"aria-multiline":`true`,"aria-label":d,contentEditable:!0,suppressContentEditableWarning:!0,"data-placeholder":f??m(`mention.placeholder`,{trigger:u}),className:`mention-editor min-h-20 w-full rounded-lg border border-input bg-card px-3.5 py-2 text-sm outline-none focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/20`,onInput:T,onKeyDown:O,onBlur:()=>_(void 0),onPaste:e=>{e.preventDefault();let t=e.clipboardData.getData(`text/plain`);document.execCommand(`insertText`,!1,t)}}),C&&(0,r.jsx)(`ul`,{role:`listbox`,"aria-label":m(`mention.title`),className:e.cn(`absolute z-30 max-h-48 w-64 overflow-y-auto rounded-lg border bg-popover p-1 shadow-md`,b===`top`?`bottom-full mb-1`:`top-full mt-1`),children:S.map((t,n)=>(0,r.jsx)(`li`,{children:(0,r.jsx)(`button`,{type:`button`,role:`option`,"aria-selected":n===v,className:e.cn(`flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-left text-sm`,n===v&&`bg-accent text-accent-foreground`),onMouseEnter:()=>y(n),onMouseDown:e=>e.preventDefault(),onClick:()=>D(t),children:(0,r.jsxs)(`span`,{className:`min-w-0 flex-1 truncate`,children:[(0,r.jsx)(`span`,{className:`block`,children:t.label}),t.description&&(0,r.jsx)(`span`,{className:`block truncate text-xs text-muted-foreground`,children:t.description})]})})},t.value))}),(0,r.jsx)(`span`,{className:`sr-only`,children:s})]})}exports.Mention=s;

package/dist-package/components/mention.d.ts

@@ -0,0 +1,20 @@
+export type MentionOption = {
+    value: string;
+    label: string;
+    description?: string;
+};
+/**
+ * 提及输入：输入触发字符（默认 `@`）后弹出候选，
+ * 采纳后插入**内联标签**（不是纯文本），↑/↓ 选择、Enter 采纳、Esc 关闭。
+ * 用 contentEditable 承载，`value` 仍然是可以直接提交的纯文本。
+ */
+export declare function Mention({ value, onValueChange, options, trigger, label, placeholder, className, }: {
+    value: string;
+    onValueChange: (value: string) => void;
+    options: MentionOption[];
+    trigger?: string;
+    label: string;
+    placeholder?: string;
+    className?: string;
+}): import("react").JSX.Element;
+//# sourceMappingURL=mention.d.ts.map

package/dist-package/components/mention.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mention.d.ts","sourceRoot":"","sources":["../../src/components/mention.tsx"],"names":[],"mappings":"AAKA,MAAM,MAAM,aAAa,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,WAAW,CAAC,EAAE,MAAM,CAAA;CAAE,CAAA;AAOlF;;;;GAIG;AACH,wBAAgB,OAAO,CAAC,EACtB,KAAK,EACL,aAAa,EACb,OAAO,EACP,OAAa,EACb,KAAK,EACL,WAAW,EACX,SAAS,GACV,EAAE;IACD,KAAK,EAAE,MAAM,CAAA;IACb,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACtC,OAAO,EAAE,aAAa,EAAE,CAAA;IACxB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,+BAwLA"}