@superad/ui 0.1.1

package/es/Table/react/editors/inline.mjs

@@ -0,0 +1,225 @@
+"use client";
+import { formatJson } from "../../core/cellValue.mjs";
+import { styles } from "../style.mjs";
+import { applyOverlayBox, createCopyButton, detach, keepSelectAllInEditor, markEditorInvalid, watchEditorValidity, watchOutsideCommit, writeBackOnCommit } from "./base.mjs";
+import { ValidateEnum } from "@visactor/vtable-editors";
+//#region src/Table/react/editors/inline.ts
+var JsonEditor = class {
+	constructor() {
+		this.kind = "inline";
+	}
+	onStart({ container, table, value, referencePosition }) {
+		this.table = table;
+		const host = document.createElement("div");
+		host.className = styles.editor;
+		const input = document.createElement("input");
+		input.type = "text";
+		input.value = formatJson(value);
+		input.className = styles.editorInput;
+		host.appendChild(input);
+		host.appendChild(createCopyButton(() => input.value, table));
+		container.appendChild(host);
+		applyOverlayBox(host, referencePosition.rect);
+		this.host = host;
+		this.element = input;
+		this.original = value;
+		this.displayed = input.value;
+		keepSelectAllInEditor(host);
+		watchEditorValidity(host, input);
+		this.unwatchOutside = watchOutsideCommit(host, () => this.table);
+		input.focus();
+		input.select();
+	}
+	setValue() {}
+	getValue() {
+		const raw = this.element?.value ?? "";
+		if (raw === this.displayed) return this.original;
+		if (raw === "") return "";
+		try {
+			return JSON.parse(raw);
+		} catch {
+			return raw;
+		}
+	}
+	/**
+	* 拦住提交：`getValue()` 对坏 JSON 返回的是那段**原文**（有意契约），直接落值会把对象换成
+	* 字符串。VTable 的 `completeEdit` 见到 `validateValue` 就按返回值决定 ——
+	* `'invalidate-not-exit'` = 不写值、也不关闭编辑器，用户可以接着改。
+	*/
+	validateValue() {
+		const raw = this.element?.value ?? "";
+		if (raw === this.displayed || raw === "") {
+			writeBackOnCommit(this);
+			return ValidateEnum.invalidateExit;
+		}
+		try {
+			JSON.parse(raw);
+			writeBackOnCommit(this);
+			return ValidateEnum.invalidateExit;
+		} catch {
+			markEditorInvalid(this.host);
+			return ValidateEnum.invalidateNotExit;
+		}
+	}
+	onEnd() {
+		this.unwatchOutside?.();
+		this.unwatchOutside = void 0;
+		detach(this.host);
+		this.host = void 0;
+		this.element = void 0;
+		this.original = void 0;
+		this.displayed = void 0;
+	}
+	isEditorElement(target) {
+		return Boolean(this.host?.contains(target));
+	}
+	adjustPosition(rect) {
+		if (this.host) applyOverlayBox(this.host, rect);
+	}
+};
+var TextEditor = class {
+	constructor(format) {
+		this.kind = "inline";
+		this.format = format;
+	}
+	onStart({ container, table, value, referencePosition }) {
+		this.table = table;
+		const host = document.createElement("div");
+		host.className = styles.editor;
+		const input = document.createElement("input");
+		input.type = "text";
+		input.value = this.format ? this.format(value) : value == null ? "" : String(value);
+		input.className = styles.editorInput;
+		host.appendChild(input);
+		host.appendChild(createCopyButton(() => input.value, table));
+		container.appendChild(host);
+		applyOverlayBox(host, referencePosition.rect);
+		this.host = host;
+		this.element = input;
+		this.original = value;
+		this.displayed = input.value;
+		keepSelectAllInEditor(host);
+		this.unwatchOutside = watchOutsideCommit(host, () => this.table);
+		input.focus();
+		input.select();
+	}
+	getValue() {
+		const raw = this.element?.value ?? "";
+		return raw === this.displayed ? this.original : raw;
+	}
+	/** 见 `writeBackOnCommit`：引擎在分组 + 树的嵌套行上会静默丢弃写入。 */
+	validateValue() {
+		writeBackOnCommit(this);
+		return ValidateEnum.invalidateExit;
+	}
+	setValue() {}
+	onEnd() {
+		this.unwatchOutside?.();
+		this.unwatchOutside = void 0;
+		detach(this.host);
+		this.host = void 0;
+		this.element = void 0;
+		this.original = void 0;
+		this.displayed = void 0;
+	}
+	isEditorElement(target) {
+		return Boolean(this.host?.contains(target));
+	}
+	adjustPosition(rect) {
+		if (this.host) applyOverlayBox(this.host, rect);
+	}
+};
+var NumberEditor = class {
+	constructor(options) {
+		this.kind = "inline";
+		this.max = options?.max;
+		this.min = options?.min;
+		this.prefix = options?.prefix;
+		this.suffix = options?.suffix;
+	}
+	onStart({ container, table, value, referencePosition }) {
+		this.table = table;
+		const host = document.createElement("div");
+		host.className = styles.editor;
+		if (this.prefix) {
+			const mark = document.createElement("span");
+			mark.className = styles.affix;
+			mark.textContent = this.prefix;
+			host.appendChild(mark);
+		}
+		const input = document.createElement("input");
+		input.type = "text";
+		input.inputMode = "decimal";
+		if (this.max != null) input.max = String(this.max);
+		if (this.min != null) input.min = String(this.min);
+		input.value = value == null || value === "" ? "" : String(value);
+		input.className = styles.editorInput;
+		host.appendChild(input);
+		if (this.suffix) {
+			const mark = document.createElement("span");
+			mark.className = styles.affix;
+			mark.textContent = this.suffix;
+			host.appendChild(mark);
+		}
+		host.appendChild(createCopyButton(() => input.value, table));
+		container.appendChild(host);
+		applyOverlayBox(host, referencePosition.rect);
+		this.host = host;
+		this.element = input;
+		this.original = value;
+		this.displayed = input.value;
+		keepSelectAllInEditor(host);
+		watchEditorValidity(host, input);
+		this.unwatchOutside = watchOutsideCommit(host, () => this.table);
+		input.focus();
+		input.select();
+	}
+	/**
+	* 拦住提交：`getValue()` 对读不出数字的输入返回的是那段**原文**（有意契约），直接落值会把
+	* 数字列从 `number` 静默改成 `string`。`'invalidate-not-exit'` = 不写值、也不关闭编辑器。
+	*/
+	validateValue() {
+		const raw = this.element?.value ?? "";
+		if (raw === this.displayed || raw === "") {
+			writeBackOnCommit(this);
+			return ValidateEnum.invalidateExit;
+		}
+		if (Number.isFinite(Number(raw.replaceAll(",", "")))) {
+			writeBackOnCommit(this);
+			return ValidateEnum.invalidateExit;
+		}
+		markEditorInvalid(this.host);
+		return ValidateEnum.invalidateNotExit;
+	}
+	setValue() {}
+	getValue() {
+		const raw = this.element?.value ?? "";
+		if (raw === this.displayed) return this.original ?? "";
+		if (raw === "") return "";
+		const numeric = Number(raw.replaceAll(",", ""));
+		if (Number.isFinite(numeric) === false) return raw;
+		let next = numeric;
+		if (this.max != null) next = Math.min(next, this.max);
+		if (this.min != null) next = Math.max(next, this.min);
+		return next;
+	}
+	onEnd() {
+		this.unwatchOutside?.();
+		this.unwatchOutside = void 0;
+		detach(this.host);
+		this.host = void 0;
+		this.element = void 0;
+		this.original = void 0;
+		this.displayed = void 0;
+	}
+	isEditorElement(target) {
+		return Boolean(this.host?.contains(target));
+	}
+	adjustPosition(rect) {
+		if (this.host) applyOverlayBox(this.host, rect);
+	}
+};
+//#endregion
+export { JsonEditor, NumberEditor, TextEditor };
+
+//# sourceMappingURL=inline.mjs.map

package/es/Table/react/editors/inline.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"inline.mjs","names":[],"sources":["../../../../src/Table/react/editors/inline.ts"],"sourcesContent":["'use client';\n\nimport {\n  type EditContext,\n  type IEditor,\n  type RectProps,\n  ValidateEnum,\n} from '@visactor/vtable-editors';\n\nimport { formatJson } from '../../core/cellValue';\nimport { styles } from '../style';\nimport {\n  applyOverlayBox,\n  createCopyButton,\n  detach,\n  keepSelectAllInEditor,\n  markEditorInvalid,\n  type TableEditor,\n  watchEditorValidity,\n  watchOutsideCommit,\n  writeBackOnCommit,\n} from './base';\n\nexport class JsonEditor implements IEditor<unknown>, TableEditor {\n  kind = 'inline' as const;\n  private host?: HTMLDivElement;\n  /** 提交补写要用（见 writeBackOnCommit）。 */\n  table?: unknown;\n  private element?: HTMLInputElement;\n  private original?: unknown;\n  private displayed?: string;\n  private unwatchOutside?: () => void;\n\n  onStart({ container, table, value, referencePosition }: EditContext<unknown>) {\n    this.table = table;\n    const host = document.createElement('div');\n    host.className = styles.editor;\n\n    const input = document.createElement('input');\n    input.type = 'text';\n    input.value = formatJson(value);\n    input.className = styles.editorInput;\n    host.appendChild(input);\n    host.appendChild(createCopyButton(() => input.value, table));\n\n    // 先进容器再定位：`applyOverlayBox` 的水平夹取要读 `parentElement.clientWidth`，\n    // 挂载前调用等于放弃夹取，浮层在最右列会探出表格。\n    container.appendChild(host);\n    applyOverlayBox(host, referencePosition.rect);\n    this.host = host;\n    this.element = input;\n    this.original = value;\n    this.displayed = input.value;\n    keepSelectAllInEditor(host);\n    watchEditorValidity(host, input);\n    this.unwatchOutside = watchOutsideCommit(host, () => this.table);\n    input.focus();\n    input.select();\n  }\n\n  setValue(): void {}\n\n  getValue() {\n    const raw = this.element?.value ?? '';\n    // 没动过就原样退回：否则「打开又提交」会把字符串 `'123'` 解析成数字、`null` 变成 `''`。\n    if (raw === this.displayed) return this.original;\n    if (raw === '') return '';\n    try {\n      return JSON.parse(raw);\n    } catch {\n      return raw;\n    }\n  }\n\n  /**\n   * 拦住提交：`getValue()` 对坏 JSON 返回的是那段**原文**（有意契约），直接落值会把对象换成\n   * 字符串。VTable 的 `completeEdit` 见到 `validateValue` 就按返回值决定 ——\n   * `'invalidate-not-exit'` = 不写值、也不关闭编辑器，用户可以接着改。\n   */\n  validateValue() {\n    const raw = this.element?.value ?? '';\n    if (raw === this.displayed || raw === '') {\n      writeBackOnCommit(this);\n      return ValidateEnum.invalidateExit;\n    }\n\n    try {\n      JSON.parse(raw);\n      writeBackOnCommit(this);\n      return ValidateEnum.invalidateExit;\n    } catch {\n      markEditorInvalid(this.host);\n      return ValidateEnum.invalidateNotExit;\n    }\n  }\n\n  onEnd() {\n    this.unwatchOutside?.();\n    this.unwatchOutside = undefined;\n    detach(this.host);\n    this.host = undefined;\n    this.element = undefined;\n    this.original = undefined;\n    this.displayed = undefined;\n  }\n\n  isEditorElement(target: HTMLElement) {\n    return Boolean(this.host?.contains(target));\n  }\n\n  adjustPosition(rect: RectProps) {\n    if (this.host) applyOverlayBox(this.host, rect);\n  }\n}\n\nexport class TextEditor implements IEditor<unknown>, TableEditor {\n  kind = 'inline' as const;\n  private host?: HTMLDivElement;\n  /** 提交补写要用（见 writeBackOnCommit）。 */\n  table?: unknown;\n  private element?: HTMLInputElement;\n  private format?: (value: unknown) => string;\n  private original?: unknown;\n  private displayed?: string;\n  private unwatchOutside?: () => void;\n\n  constructor(format?: (value: unknown) => string) {\n    this.format = format;\n  }\n\n  onStart({ container, table, value, referencePosition }: EditContext<unknown>) {\n    this.table = table;\n    const host = document.createElement('div');\n    host.className = styles.editor;\n\n    const input = document.createElement('input');\n    input.type = 'text';\n    input.value = this.format ? this.format(value) : value == null ? '' : String(value);\n    input.className = styles.editorInput;\n    host.appendChild(input);\n    host.appendChild(createCopyButton(() => input.value, table));\n\n    // 先进容器再定位，见 JsonEditor 里的同一处注释。\n    container.appendChild(host);\n    applyOverlayBox(host, referencePosition.rect);\n    this.host = host;\n    this.element = input;\n    this.original = value;\n    this.displayed = input.value;\n    keepSelectAllInEditor(host);\n    this.unwatchOutside = watchOutsideCommit(host, () => this.table);\n    input.focus();\n    input.select();\n  }\n\n  getValue() {\n    const raw = this.element?.value ?? '';\n    // `format` 只负责显示。没改过就退回原值，否则一次无改动的提交就把格式化后的文本写回单元格。\n    return raw === this.displayed ? this.original : raw;\n  }\n\n  /** 见 `writeBackOnCommit`：引擎在分组 + 树的嵌套行上会静默丢弃写入。 */\n  validateValue() {\n    writeBackOnCommit(this);\n    return ValidateEnum.invalidateExit;\n  }\n\n  setValue(): void {}\n\n  onEnd() {\n    this.unwatchOutside?.();\n    this.unwatchOutside = undefined;\n    detach(this.host);\n    this.host = undefined;\n    this.element = undefined;\n    this.original = undefined;\n    this.displayed = undefined;\n  }\n\n  isEditorElement(target: HTMLElement) {\n    return Boolean(this.host?.contains(target));\n  }\n\n  adjustPosition(rect: RectProps) {\n    if (this.host) applyOverlayBox(this.host, rect);\n  }\n}\n\nexport class NumberEditor implements IEditor<number | string>, TableEditor {\n  kind = 'inline' as const;\n  private host?: HTMLDivElement;\n  /** 提交补写要用（见 writeBackOnCommit）。 */\n  table?: unknown;\n  private element?: HTMLInputElement;\n  private max?: number;\n  private min?: number;\n  private prefix?: string;\n  private suffix?: string;\n  private original?: number | string;\n  private displayed?: string;\n  private unwatchOutside?: () => void;\n\n  constructor(options?: { max?: number; min?: number; prefix?: string; suffix?: string }) {\n    this.max = options?.max;\n    this.min = options?.min;\n    this.prefix = options?.prefix;\n    this.suffix = options?.suffix;\n  }\n\n  onStart({ container, table, value, referencePosition }: EditContext<number | string>) {\n    this.table = table;\n    const host = document.createElement('div');\n    host.className = styles.editor;\n\n    if (this.prefix) {\n      const mark = document.createElement('span');\n      mark.className = styles.affix;\n      mark.textContent = this.prefix;\n      host.appendChild(mark);\n    }\n\n    const input = document.createElement('input');\n    input.type = 'text';\n    input.inputMode = 'decimal';\n    if (this.max != null) input.max = String(this.max);\n    if (this.min != null) input.min = String(this.min);\n    input.value = value == null || value === '' ? '' : String(value);\n    input.className = styles.editorInput;\n    host.appendChild(input);\n\n    if (this.suffix) {\n      const mark = document.createElement('span');\n      mark.className = styles.affix;\n      mark.textContent = this.suffix;\n      host.appendChild(mark);\n    }\n\n    host.appendChild(createCopyButton(() => input.value, table));\n\n    // 先进容器再定位，见 JsonEditor 里的同一处注释。\n    container.appendChild(host);\n    applyOverlayBox(host, referencePosition.rect);\n    this.host = host;\n    this.element = input;\n    this.original = value;\n    this.displayed = input.value;\n    keepSelectAllInEditor(host);\n    watchEditorValidity(host, input);\n    this.unwatchOutside = watchOutsideCommit(host, () => this.table);\n    input.focus();\n    input.select();\n  }\n\n  /**\n   * 拦住提交：`getValue()` 对读不出数字的输入返回的是那段**原文**（有意契约），直接落值会把\n   * 数字列从 `number` 静默改成 `string`。`'invalidate-not-exit'` = 不写值、也不关闭编辑器。\n   */\n  validateValue() {\n    const raw = this.element?.value ?? '';\n    if (raw === this.displayed || raw === '') {\n      writeBackOnCommit(this);\n      return ValidateEnum.invalidateExit;\n    }\n    if (Number.isFinite(Number(raw.replaceAll(',', '')))) {\n      writeBackOnCommit(this);\n      return ValidateEnum.invalidateExit;\n    }\n\n    markEditorInvalid(this.host);\n    return ValidateEnum.invalidateNotExit;\n  }\n\n  setValue(): void {}\n\n  getValue(): number | string {\n    const raw = this.element?.value ?? '';\n    // 没动过就原样退回，别把字符串型的数字值改成 number，也别替用户改写越界的历史数据。\n    if (raw === this.displayed) return this.original ?? '';\n    if (raw === '') return '';\n    const numeric = Number(raw.replaceAll(',', ''));\n    if (Number.isFinite(numeric) === false) return raw;\n\n    let next = numeric;\n    if (this.max != null) next = Math.min(next, this.max);\n    if (this.min != null) next = Math.max(next, this.min);\n\n    return next;\n  }\n\n  onEnd() {\n    this.unwatchOutside?.();\n    this.unwatchOutside = undefined;\n    detach(this.host);\n    this.host = undefined;\n    this.element = undefined;\n    this.original = undefined;\n    this.displayed = undefined;\n  }\n\n  isEditorElement(target: HTMLElement) {\n    return Boolean(this.host?.contains(target));\n  }\n\n  adjustPosition(rect: RectProps) {\n    if (this.host) applyOverlayBox(this.host, rect);\n  }\n}\n"],"mappings":"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"}

package/es/Table/react/editors/picker.mjs

@@ -0,0 +1,368 @@
+"use client";
+import { matchesQuery, parseAddress, resolveUser, toDate, toValueList } from "../../core/cellValue.mjs";
+import { dayjsLocaleFor, readTableI18n, tableText } from "../../core/tableI18n.mjs";
+import { styles } from "../style.mjs";
+import { ListPickerEditor, ReactEditor, placePicker } from "./base.mjs";
+import { Chip, UserAvatar } from "../overlayChips.mjs";
+import { DatePicker, Input } from "antd";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import dayjs from "dayjs";
+import "dayjs/locale/en.js";
+import "dayjs/locale/zh-cn.js";
+//#region src/Table/react/editors/picker.tsx
+const applyEditorDayjsLocale = (table) => {
+	dayjs.locale(dayjsLocaleFor(readTableI18n(table).locale));
+};
+var DateTimeEditor = class extends ReactEditor {
+	constructor(withTime = true) {
+		super();
+		this.kind = "picker";
+		this.withTime = withTime;
+	}
+	onStart({ container, value, referencePosition, endEdit, table }) {
+		this.table = table;
+		applyEditorDayjsLocale(table);
+		this.ended = false;
+		this.cancelled = false;
+		this.endEdit = endEdit;
+		this.original = value;
+		this.current = value == null ? "" : String(value);
+		this.attach(container, referencePosition.rect);
+		const parsed = toDate(value);
+		this.paint(/* @__PURE__ */ jsx(DatePicker, {
+			allowClear: true,
+			autoFocus: true,
+			defaultOpen: true,
+			defaultValue: parsed ? dayjs(parsed) : null,
+			format: this.withTime ? "YYYY-MM-DD HH:mm" : "YYYY-MM-DD",
+			placeholder: tableText(this.table, "pickDate"),
+			showNow: this.withTime,
+			showTime: this.withTime ? { format: "HH:mm" } : false,
+			size: "middle",
+			variant: "borderless",
+			onChange: (next) => {
+				this.current = next ? next.format(this.withTime ? "YYYY-MM-DDTHH:mm:ss" : "YYYY-MM-DD") : "";
+			},
+			onKeyDown: (event) => {
+				if (event.key === "Escape") {
+					event.preventDefault();
+					event.stopPropagation();
+					this.cancelled = true;
+					this.finish();
+				}
+			},
+			onOpenChange: (open) => {
+				if (!open) this.finish();
+			}
+		}));
+	}
+};
+/**
+* 日期范围（「计划排期」这类起止列）。值是一条 `[起, 止]` 数组，两端按 `format` 落成字符串
+* —— 与 `DateTimeEditor` 的落值口径一致（`format` 就是列上的 `format` prop）。
+*/
+var DateRangeEditor = class extends ReactEditor {
+	constructor(format = "YYYY-MM-DD") {
+		super();
+		this.kind = "picker";
+		this.format = format;
+	}
+	onStart({ container, value, referencePosition, endEdit, table }) {
+		this.table = table;
+		applyEditorDayjsLocale(table);
+		this.ended = false;
+		this.cancelled = false;
+		this.endEdit = endEdit;
+		this.original = value;
+		this.current = value == null ? [] : [...value];
+		this.attach(container, referencePosition.rect);
+		const [start, end] = toValueList(value);
+		this.paint(/* @__PURE__ */ jsx(DatePicker.RangePicker, {
+			allowClear: true,
+			autoFocus: true,
+			defaultOpen: true,
+			defaultValue: [start ? dayjs(toDate(start)) : null, end ? dayjs(toDate(end)) : null],
+			format: this.format,
+			placeholder: [tableText(this.table, "startDate"), tableText(this.table, "endDate")],
+			size: "middle",
+			variant: "borderless",
+			onChange: (next) => {
+				this.current = next && next[0] && next[1] ? [next[0].format(this.format), next[1].format(this.format)] : [];
+			},
+			onKeyDown: (event) => {
+				if (event.key === "Escape") {
+					event.preventDefault();
+					event.stopPropagation();
+					this.cancelled = true;
+					this.finish();
+				}
+			},
+			onOpenChange: (open) => {
+				if (!open) this.finish();
+			}
+		}));
+	}
+};
+var OptionEditor = class extends ListPickerEditor {
+	constructor(options, multiple = false) {
+		super(multiple);
+		this.options = options;
+	}
+	candidates() {
+		return this.options;
+	}
+	fromValue(value) {
+		return toValueList(value).map(String).map((entry) => this.optionFor(entry));
+	}
+	keyOf(item) {
+		return item.value;
+	}
+	matches(item, query) {
+		return matchesQuery(query, item.label, item.value);
+	}
+	renderRow(item) {
+		return /* @__PURE__ */ jsx(Chip, { option: item });
+	}
+	publish(items) {
+		const values = items.map((item) => item.value);
+		return this.multiple ? values : values[0] ?? "";
+	}
+	/** A value with no matching option still round-trips, as a label-less chip. */
+	optionFor(value) {
+		return this.options.find((item) => item.value === value) ?? {
+			label: value,
+			value
+		};
+	}
+};
+/**
+* 候选列表里的一行：**antd `Avatar` + 姓名 + 说明**（两行）。
+*
+* 头像是圆的、有图走图、没图回退首字 —— 这几件事 antd 的 `Avatar` 全都自带，不再手搓
+* `img` / `span` 两套分支。底色仍来自 `toneFor`，与单元格 chip、canvas painter 同源。
+*/
+const userRow = (user) => /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(UserAvatar, {
+	size: 24,
+	user
+}), /* @__PURE__ */ jsxs("span", {
+	className: styles.pickerRowMain,
+	children: [/* @__PURE__ */ jsx("span", {
+		className: styles.pickerRowName,
+		children: user.name
+	}), user.description ? /* @__PURE__ */ jsx("span", {
+		className: styles.pickerRowDescription,
+		children: user.description
+	}) : null]
+})] });
+var UserEditor = class extends ListPickerEditor {
+	constructor(users = [], multiple = false) {
+		super(multiple);
+		this.users = users;
+	}
+	/** Falls back to the current selection so a record still resolves its own people. */
+	candidates() {
+		return this.users.length > 0 ? this.users : this.selected;
+	}
+	fromValue(value) {
+		return toValueList(value).map(resolveUser);
+	}
+	keyOf(item) {
+		return item.name;
+	}
+	matches(item, query) {
+		return matchesQuery(query, item.name);
+	}
+	searchPlaceholder() {
+		return tableText(this.table, "searchPeople");
+	}
+	/**
+	* 候选行是「圆头像 + 姓名 + 说明」两行 —— 参考飞书的人员选择面板：列表要能一眼区分同名的人
+	* （部门 / 公司写在第二行），而单元格里只放姓名。
+	*/
+	renderRow(item) {
+		return userRow(item);
+	}
+	publish(items) {
+		return this.multiple ? items : items[0] ?? "";
+	}
+};
+var ArrayEditor = class extends ReactEditor {
+	constructor(..._args) {
+		super(..._args);
+		this.kind = "picker";
+		this.items = [];
+		this.draft = "";
+	}
+	onStart({ container, value, referencePosition, endEdit, table }) {
+		this.table = table;
+		this.ended = false;
+		this.cancelled = false;
+		this.endEdit = endEdit;
+		this.original = value;
+		this.items = toValueList(value).map(String).filter(Boolean);
+		this.draft = "";
+		this.current = value;
+		this.attach(container, referencePosition.rect, styles.picker);
+		this.place(referencePosition.rect);
+		this.paint(this.panel());
+	}
+	adjustPosition(rect) {
+		this.place(rect);
+	}
+	/**
+	* 点面板外要先收草稿：document 上的捕获 pointerdown 早于输入框的 `blur`，等 blur 里那次
+	* `commitDraft` 时编辑器已经结束（`paint` 成空操作），用户打的那一项无提示消失。
+	*/
+	beforeFinish() {
+		this.commitDraft();
+	}
+	isEditorElement(target) {
+		return Boolean(this.mount?.contains(target));
+	}
+	place(rect) {
+		if (this.mount) placePicker(this.mount, rect, 180, this.tableTop());
+	}
+	commitDraft() {
+		const next = this.draft.trim();
+		if (!next || this.items.includes(next)) return;
+		this.items = [...this.items, next];
+		this.draft = "";
+		this.current = this.items;
+		this.paint(this.panel());
+	}
+	remove(item) {
+		this.items = this.items.filter((value) => value !== item);
+		this.current = this.items;
+		this.paint(this.panel());
+	}
+	panel() {
+		return /* @__PURE__ */ jsxs(Fragment, { children: [this.items.map((item) => /* @__PURE__ */ jsxs("button", {
+			className: styles.pickerItem,
+			type: "button",
+			onClick: () => this.remove(item),
+			children: [/* @__PURE__ */ jsx("span", {
+				className: styles.softChip,
+				children: item
+			}), /* @__PURE__ */ jsx("span", {
+				className: styles.check,
+				children: "×"
+			})]
+		}, item)), /* @__PURE__ */ jsx(Input, {
+			autoFocus: true,
+			placeholder: tableText(this.table, "addByEnter"),
+			size: "middle",
+			value: this.draft,
+			onBlur: () => this.commitDraft(),
+			onChange: (event) => {
+				this.draft = event.target.value;
+				this.paint(this.panel());
+			},
+			onKeyDown: (event) => {
+				if (event.key === "Enter") {
+					event.preventDefault();
+					event.stopPropagation();
+					this.commitDraft();
+					return;
+				}
+				if (event.key === "Escape") {
+					event.preventDefault();
+					event.stopPropagation();
+					this.cancelled = true;
+					this.finish();
+				}
+			}
+		})] });
+	}
+};
+var AddressEditor = class extends ReactEditor {
+	constructor(..._args2) {
+		super(..._args2);
+		this.kind = "picker";
+	}
+	onStart({ container, value, referencePosition, endEdit, table }) {
+		this.table = table;
+		this.ended = false;
+		this.cancelled = false;
+		this.endEdit = endEdit;
+		this.original = value;
+		this.current = { ...parseAddress(value) };
+		this.attach(container, referencePosition.rect, styles.addressForm);
+		this.place(referencePosition.rect);
+		this.paint(this.panel());
+	}
+	getValue() {
+		if (this.cancelled) return this.original;
+		const next = {};
+		[
+			"street",
+			"street2",
+			"city",
+			"state",
+			"country",
+			"postcode"
+		].forEach((key) => {
+			const part = String(this.current[key] ?? "").trim();
+			if (part) next[key] = part;
+		});
+		return next;
+	}
+	adjustPosition(rect) {
+		this.place(rect);
+	}
+	place(rect) {
+		if (this.mount) placePicker(this.mount, rect, 280, this.tableTop());
+	}
+	setField(key, next) {
+		this.current = {
+			...this.current,
+			[key]: next
+		};
+		this.paint(this.panel());
+	}
+	field(key, label, autoFocus = false) {
+		const address = this.current;
+		return /* @__PURE__ */ jsxs("label", {
+			className: styles.addressField,
+			children: [/* @__PURE__ */ jsx("span", {
+				className: styles.addressLabel,
+				children: label
+			}), /* @__PURE__ */ jsx(Input, {
+				autoFocus,
+				size: "middle",
+				value: address[key] ?? "",
+				onChange: (event) => this.setField(key, event.target.value),
+				onKeyDown: (event) => {
+					if (event.key === "Enter") {
+						event.preventDefault();
+						event.stopPropagation();
+						this.finish();
+					}
+					if (event.key === "Escape") {
+						event.preventDefault();
+						event.stopPropagation();
+						this.cancelled = true;
+						this.finish();
+					}
+				}
+			})]
+		});
+	}
+	panel() {
+		return /* @__PURE__ */ jsxs(Fragment, { children: [
+			this.field("street", tableText(this.table, "address.street"), true),
+			this.field("street2", tableText(this.table, "address.street2")),
+			/* @__PURE__ */ jsxs("div", {
+				className: styles.addressRow,
+				children: [this.field("city", tableText(this.table, "address.city")), this.field("state", tableText(this.table, "address.state"))]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: styles.addressRow,
+				children: [this.field("postcode", tableText(this.table, "address.postcode")), this.field("country", tableText(this.table, "address.country"))]
+			})
+		] });
+	}
+};
+//#endregion
+export { AddressEditor, ArrayEditor, DateRangeEditor, DateTimeEditor, OptionEditor, UserEditor };
+
+//# sourceMappingURL=picker.mjs.map

package/es/Table/react/editors/picker.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"picker.mjs","names":[],"sources":["../../../../src/Table/react/editors/picker.tsx"],"sourcesContent":["'use client';\n\nimport 'dayjs/locale/en';\nimport 'dayjs/locale/zh-cn';\n\nimport type { EditContext, RectProps } from '@visactor/vtable-editors';\nimport { DatePicker, Input } from 'antd';\nimport dayjs, { type Dayjs } from 'dayjs';\nimport type { ReactNode } from 'react';\n\nimport { matchesQuery, parseAddress, resolveUser, toDate, toValueList } from '../../core/cellValue';\nimport { dayjsLocaleFor, readTableI18n, tableText } from '../../core/tableI18n';\nimport type { TableAddress, TableSelectOption, TableUser } from '../../type';\nimport { Chip, UserAvatar } from '../overlayChips';\nimport { styles } from '../style';\nimport { ListPickerEditor, placePicker, ReactEditor } from './base';\n\nconst applyEditorDayjsLocale = (table?: unknown) => {\n  dayjs.locale(dayjsLocaleFor(readTableI18n(table).locale));\n};\n\nexport class DateTimeEditor extends ReactEditor<string> {\n  kind = 'picker' as const;\n  private withTime: boolean;\n\n  constructor(withTime = true) {\n    super();\n    this.withTime = withTime;\n  }\n\n  onStart({ container, value, referencePosition, endEdit, table }: EditContext<string>) {\n    this.table = table;\n    applyEditorDayjsLocale(table);\n    this.ended = false;\n    // 编辑器实例按列复用，上一次以取消收尾时这里不清掉，下一次编辑会被 getValue 当成\n    // 取消而整份丢弃。\n    this.cancelled = false;\n    this.endEdit = endEdit;\n    this.original = value;\n    this.current = value == null ? '' : String(value);\n    this.attach(container, referencePosition.rect);\n    const parsed = toDate(value);\n    this.paint(\n      <DatePicker\n        allowClear\n        autoFocus\n        defaultOpen\n        defaultValue={parsed ? dayjs(parsed) : null}\n        format={this.withTime ? 'YYYY-MM-DD HH:mm' : 'YYYY-MM-DD'}\n        placeholder={tableText(this.table, 'pickDate')}\n        showNow={this.withTime}\n        showTime={this.withTime ? { format: 'HH:mm' } : false}\n        size=\"middle\"\n        variant=\"borderless\"\n        onChange={(next: Dayjs | null) => {\n          this.current = next\n            ? next.format(this.withTime ? 'YYYY-MM-DDTHH:mm:ss' : 'YYYY-MM-DD')\n            : '';\n        }}\n        onKeyDown={(event) => {\n          // 点面板外现在是提交，Escape 是唯一的取消手势。其它三个编辑器各自在 keydown 里\n          // 判 Escape，这里同样要接 —— antd 只负责关面板，不会设 cancelled。\n          if (event.key === 'Escape') {\n            event.preventDefault();\n            event.stopPropagation();\n            this.cancelled = true;\n            this.finish();\n          }\n        }}\n        onOpenChange={(open) => {\n          if (!open) this.finish();\n        }}\n      />,\n    );\n  }\n}\n\n/**\n * 日期范围（「计划排期」这类起止列）。值是一条 `[起, 止]` 数组，两端按 `format` 落成字符串\n * —— 与 `DateTimeEditor` 的落值口径一致（`format` 就是列上的 `format` prop）。\n */\nexport class DateRangeEditor extends ReactEditor<string[]> {\n  kind = 'picker' as const;\n  private format: string;\n\n  constructor(format = 'YYYY-MM-DD') {\n    super();\n    this.format = format;\n  }\n\n  onStart({ container, value, referencePosition, endEdit, table }: EditContext<string[]>) {\n    this.table = table;\n    applyEditorDayjsLocale(table);\n    this.ended = false;\n    this.cancelled = false;\n    this.endEdit = endEdit;\n    this.original = value;\n    this.current = value == null ? [] : [...value];\n    this.attach(container, referencePosition.rect);\n    const [start, end] = toValueList(value);\n\n    this.paint(\n      <DatePicker.RangePicker\n        allowClear\n        autoFocus\n        defaultOpen\n        defaultValue={[start ? dayjs(toDate(start)) : null, end ? dayjs(toDate(end)) : null]}\n        format={this.format}\n        placeholder={[tableText(this.table, 'startDate'), tableText(this.table, 'endDate')]}\n        size=\"middle\"\n        variant=\"borderless\"\n        onChange={(next) => {\n          // antd 把空范围给 `null`（清空按钮 / 面板外点掉）；只选了一端也给 null 的\n          // 完整数组形态在 v5 之后不存在，这里按 `next[0] && next[1]` 收成空数组。\n          this.current =\n            next && next[0] && next[1]\n              ? [next[0].format(this.format), next[1].format(this.format)]\n              : [];\n        }}\n        onKeyDown={(event) => {\n          // 与 DateTimeEditor 同一套：Escape 是唯一的取消手势。\n          if (event.key === 'Escape') {\n            event.preventDefault();\n            event.stopPropagation();\n            this.cancelled = true;\n            this.finish();\n          }\n        }}\n        onOpenChange={(open) => {\n          if (!open) this.finish();\n        }}\n      />,\n    );\n  }\n}\n\nexport class OptionEditor extends ListPickerEditor<TableSelectOption, string | string[]> {\n  private options: TableSelectOption[];\n\n  constructor(options: TableSelectOption[], multiple = false) {\n    super(multiple);\n    this.options = options;\n  }\n\n  protected candidates() {\n    return this.options;\n  }\n\n  protected fromValue(value: string | string[]) {\n    return toValueList(value)\n      .map(String)\n      .map((entry) => this.optionFor(entry));\n  }\n\n  protected keyOf(item: TableSelectOption) {\n    return item.value;\n  }\n\n  protected matches(item: TableSelectOption, query: string) {\n    return matchesQuery(query, item.label, item.value);\n  }\n\n  protected renderRow(item: TableSelectOption) {\n    return <Chip option={item} />;\n  }\n\n  protected publish(items: TableSelectOption[]) {\n    const values = items.map((item) => item.value);\n    return this.multiple ? values : (values[0] ?? '');\n  }\n\n  /** A value with no matching option still round-trips, as a label-less chip. */\n  private optionFor(value: string): TableSelectOption {\n    return this.options.find((item) => item.value === value) ?? { label: value, value };\n  }\n}\n\n/**\n * 候选列表里的一行：**antd `Avatar` + 姓名 + 说明**（两行）。\n *\n * 头像是圆的、有图走图、没图回退首字 —— 这几件事 antd 的 `Avatar` 全都自带，不再手搓\n * `img` / `span` 两套分支。底色仍来自 `toneFor`，与单元格 chip、canvas painter 同源。\n */\nconst userRow = (user: TableUser): ReactNode => (\n  <>\n    <UserAvatar size={24} user={user} />\n    <span className={styles.pickerRowMain}>\n      <span className={styles.pickerRowName}>{user.name}</span>\n      {user.description ? (\n        <span className={styles.pickerRowDescription}>{user.description}</span>\n      ) : null}\n    </span>\n  </>\n);\n\nexport class UserEditor extends ListPickerEditor<TableUser, string | TableUser | TableUser[]> {\n  private users: TableUser[];\n\n  constructor(users: TableUser[] = [], multiple = false) {\n    super(multiple);\n    this.users = users;\n  }\n\n  /** Falls back to the current selection so a record still resolves its own people. */\n  protected candidates() {\n    return this.users.length > 0 ? this.users : this.selected;\n  }\n\n  protected fromValue(value: string | TableUser | TableUser[]) {\n    return toValueList(value).map(resolveUser);\n  }\n\n  protected keyOf(item: TableUser) {\n    return item.name;\n  }\n\n  protected matches(item: TableUser, query: string) {\n    return matchesQuery(query, item.name);\n  }\n\n  protected searchPlaceholder() {\n    return tableText(this.table, 'searchPeople');\n  }\n\n  /**\n   * 候选行是「圆头像 + 姓名 + 说明」两行 —— 参考飞书的人员选择面板：列表要能一眼区分同名的人\n   * （部门 / 公司写在第二行），而单元格里只放姓名。\n   */\n  protected renderRow(item: TableUser) {\n    return userRow(item);\n  }\n\n  protected publish(items: TableUser[]) {\n    return this.multiple ? items : (items[0] ?? '');\n  }\n}\n\nexport class ArrayEditor extends ReactEditor<string | string[]> {\n  kind = 'picker' as const;\n  private items: string[] = [];\n  private draft = '';\n\n  onStart({ container, value, referencePosition, endEdit, table }: EditContext<string | string[]>) {\n    this.table = table;\n    this.ended = false;\n    this.cancelled = false;\n    this.endEdit = endEdit;\n    this.original = value;\n    this.items = toValueList(value).map(String).filter(Boolean);\n    this.draft = '';\n    // 原样保留使用方的值：`items` 是归一化后的数组，而记录里可能是 `'a@b.com'` 这样的字符串。\n    // 打开就提交（单击即开、点外面即提交）不该顺手把字段类型改掉 —— 只有真增删过才写数组，\n    // 见 `commitDraft` / `remove`。\n    this.current = value;\n    this.attach(container, referencePosition.rect, styles.picker);\n    this.place(referencePosition.rect);\n    this.paint(this.panel());\n  }\n\n  adjustPosition(rect: RectProps) {\n    this.place(rect);\n  }\n\n  /**\n   * 点面板外要先收草稿：document 上的捕获 pointerdown 早于输入框的 `blur`，等 blur 里那次\n   * `commitDraft` 时编辑器已经结束（`paint` 成空操作），用户打的那一项无提示消失。\n   */\n  protected beforeFinish() {\n    this.commitDraft();\n  }\n\n  isEditorElement(target: HTMLElement) {\n    return Boolean(this.mount?.contains(target));\n  }\n\n  private place(rect: RectProps) {\n    if (this.mount) placePicker(this.mount, rect, 180, this.tableTop());\n  }\n\n  private commitDraft() {\n    const next = this.draft.trim();\n    if (!next || this.items.includes(next)) return;\n    this.items = [...this.items, next];\n    this.draft = '';\n    this.current = this.items;\n    this.paint(this.panel());\n  }\n\n  private remove(item: string) {\n    this.items = this.items.filter((value) => value !== item);\n    this.current = this.items;\n    this.paint(this.panel());\n  }\n\n  private panel() {\n    return (\n      <>\n        {this.items.map((item) => (\n          <button\n            className={styles.pickerItem}\n            key={item}\n            type=\"button\"\n            onClick={() => this.remove(item)}\n          >\n            <span className={styles.softChip}>{item}</span>\n            <span className={styles.check}>×</span>\n          </button>\n        ))}\n        <Input\n          autoFocus\n          placeholder={tableText(this.table, 'addByEnter')}\n          size=\"middle\"\n          value={this.draft}\n          onBlur={() => this.commitDraft()}\n          onChange={(event) => {\n            this.draft = event.target.value;\n            this.paint(this.panel());\n          }}\n          onKeyDown={(event) => {\n            if (event.key === 'Enter') {\n              event.preventDefault();\n              event.stopPropagation();\n              this.commitDraft();\n              return;\n            }\n            if (event.key === 'Escape') {\n              event.preventDefault();\n              event.stopPropagation();\n              this.cancelled = true;\n              this.finish();\n            }\n          }}\n        />\n      </>\n    );\n  }\n}\n\nexport class AddressEditor extends ReactEditor<unknown> {\n  kind = 'picker' as const;\n\n  onStart({ container, value, referencePosition, endEdit, table }: EditContext<unknown>) {\n    this.table = table;\n    this.ended = false;\n    this.cancelled = false;\n    this.endEdit = endEdit;\n    // `original` is what the base class rolls back to, so it has to be the value the cell\n    // held. Storing the parsed address there turned a cancelled edit into a rewrite: a\n    // string cell came back as `{ street: … }`.\n    this.original = value;\n    this.current = { ...parseAddress(value) };\n    this.attach(container, referencePosition.rect, styles.addressForm);\n    this.place(referencePosition.rect);\n    this.paint(this.panel());\n  }\n\n  getValue() {\n    if (this.cancelled) return this.original;\n    const next: TableAddress = {};\n    (['street', 'street2', 'city', 'state', 'country', 'postcode'] as const).forEach((key) => {\n      const part = String((this.current as TableAddress)[key] ?? '').trim();\n      if (part) next[key] = part;\n    });\n    return next;\n  }\n\n  adjustPosition(rect: RectProps) {\n    this.place(rect);\n  }\n\n  private place(rect: RectProps) {\n    if (this.mount) placePicker(this.mount, rect, 280, this.tableTop());\n  }\n\n  private setField(key: keyof TableAddress, next: string) {\n    this.current = { ...(this.current as TableAddress), [key]: next };\n    this.paint(this.panel());\n  }\n\n  private field(key: keyof TableAddress, label: string, autoFocus = false) {\n    const address = this.current as TableAddress;\n    return (\n      <label className={styles.addressField}>\n        <span className={styles.addressLabel}>{label}</span>\n        <Input\n          autoFocus={autoFocus}\n          size=\"middle\"\n          value={address[key] ?? ''}\n          onChange={(event) => this.setField(key, event.target.value)}\n          onKeyDown={(event) => {\n            if (event.key === 'Enter') {\n              event.preventDefault();\n              event.stopPropagation();\n              this.finish();\n            }\n            if (event.key === 'Escape') {\n              event.preventDefault();\n              event.stopPropagation();\n              this.cancelled = true;\n              this.finish();\n            }\n          }}\n        />\n      </label>\n    );\n  }\n\n  private panel() {\n    return (\n      <>\n        {this.field('street', tableText(this.table, 'address.street'), true)}\n        {this.field('street2', tableText(this.table, 'address.street2'))}\n        <div className={styles.addressRow}>\n          {this.field('city', tableText(this.table, 'address.city'))}\n          {this.field('state', tableText(this.table, 'address.state'))}\n        </div>\n        <div className={styles.addressRow}>\n          {this.field('postcode', tableText(this.table, 'address.postcode'))}\n          {this.field('country', tableText(this.table, 'address.country'))}\n        </div>\n      </>\n    );\n  }\n}\n\n// dayjs 的 locale 是模块级状态，没有「只对我这棵子树生效」。打开日期编辑器时按表实例\n// 的 locale 切一次（见 `applyEditorDayjsLocale`），不再在 import 时写死 zh-cn。\n"],"mappings":";;;;;;;;;;;;AAiBA,MAAM,0BAA0B,UAAoB;CAClD,MAAM,OAAO,eAAe,cAAc,KAAK,CAAC,CAAC,MAAM,CAAC;AAC1D;AAEA,IAAa,iBAAb,cAAoC,YAAoB;CAItD,YAAY,WAAW,MAAM;EAC3B,MAAM;EAJD,KAAA,OAAA;EAKL,KAAK,WAAW;CAClB;CAEA,QAAQ,EAAE,WAAW,OAAO,mBAAmB,SAAS,SAA8B;EACpF,KAAK,QAAQ;EACb,uBAAuB,KAAK;EAC5B,KAAK,QAAQ;EAGb,KAAK,YAAY;EACjB,KAAK,UAAU;EACf,KAAK,WAAW;EAChB,KAAK,UAAU,SAAS,OAAO,KAAK,OAAO,KAAK;EAChD,KAAK,OAAO,WAAW,kBAAkB,IAAI;EAC7C,MAAM,SAAS,OAAO,KAAK;EAC3B,KAAK,MACH,oBAAC,YAAD;GACE,YAAA;GACA,WAAA;GACA,aAAA;GACA,cAAc,SAAS,MAAM,MAAM,IAAI;GACvC,QAAQ,KAAK,WAAW,qBAAqB;GAC7C,aAAa,UAAU,KAAK,OAAO,UAAU;GAC7C,SAAS,KAAK;GACd,UAAU,KAAK,WAAW,EAAE,QAAQ,QAAQ,IAAI;GAChD,MAAK;GACL,SAAQ;GACR,WAAW,SAAuB;IAChC,KAAK,UAAU,OACX,KAAK,OAAO,KAAK,WAAW,wBAAwB,YAAY,IAChE;GACN;GACA,YAAY,UAAU;IAGpB,IAAI,MAAM,QAAQ,UAAU;KAC1B,MAAM,eAAe;KACrB,MAAM,gBAAgB;KACtB,KAAK,YAAY;KACjB,KAAK,OAAO;IACd;GACF;GACA,eAAe,SAAS;IACtB,IAAI,CAAC,MAAM,KAAK,OAAO;GACzB;EACD,CAAA,CACH;CACF;AACF;;;;;AAMA,IAAa,kBAAb,cAAqC,YAAsB;CAIzD,YAAY,SAAS,cAAc;EACjC,MAAM;EAJD,KAAA,OAAA;EAKL,KAAK,SAAS;CAChB;CAEA,QAAQ,EAAE,WAAW,OAAO,mBAAmB,SAAS,SAAgC;EACtF,KAAK,QAAQ;EACb,uBAAuB,KAAK;EAC5B,KAAK,QAAQ;EACb,KAAK,YAAY;EACjB,KAAK,UAAU;EACf,KAAK,WAAW;EAChB,KAAK,UAAU,SAAS,OAAO,CAAC,IAAI,CAAC,GAAG,KAAK;EAC7C,KAAK,OAAO,WAAW,kBAAkB,IAAI;EAC7C,MAAM,CAAC,OAAO,OAAO,YAAY,KAAK;EAEtC,KAAK,MACH,oBAAC,WAAW,aAAZ;GACE,YAAA;GACA,WAAA;GACA,aAAA;GACA,cAAc,CAAC,QAAQ,MAAM,OAAO,KAAK,CAAC,IAAI,MAAM,MAAM,MAAM,OAAO,GAAG,CAAC,IAAI,IAAI;GACnF,QAAQ,KAAK;GACb,aAAa,CAAC,UAAU,KAAK,OAAO,WAAW,GAAG,UAAU,KAAK,OAAO,SAAS,CAAC;GAClF,MAAK;GACL,SAAQ;GACR,WAAW,SAAS;IAGlB,KAAK,UACH,QAAQ,KAAK,MAAM,KAAK,KACpB,CAAC,KAAK,EAAE,CAAC,OAAO,KAAK,MAAM,GAAG,KAAK,EAAE,CAAC,OAAO,KAAK,MAAM,CAAC,IACzD,CAAC;GACT;GACA,YAAY,UAAU;IAEpB,IAAI,MAAM,QAAQ,UAAU;KAC1B,MAAM,eAAe;KACrB,MAAM,gBAAgB;KACtB,KAAK,YAAY;KACjB,KAAK,OAAO;IACd;GACF;GACA,eAAe,SAAS;IACtB,IAAI,CAAC,MAAM,KAAK,OAAO;GACzB;EACD,CAAA,CACH;CACF;AACF;AAEA,IAAa,eAAb,cAAkC,iBAAuD;CAGvF,YAAY,SAA8B,WAAW,OAAO;EAC1D,MAAM,QAAQ;EACd,KAAK,UAAU;CACjB;CAEA,aAAuB;EACrB,OAAO,KAAK;CACd;CAEA,UAAoB,OAA0B;EAC5C,OAAO,YAAY,KAAK,CAAC,CACtB,IAAI,MAAM,CAAC,CACX,KAAK,UAAU,KAAK,UAAU,KAAK,CAAC;CACzC;CAEA,MAAgB,MAAyB;EACvC,OAAO,KAAK;CACd;CAEA,QAAkB,MAAyB,OAAe;EACxD,OAAO,aAAa,OAAO,KAAK,OAAO,KAAK,KAAK;CACnD;CAEA,UAAoB,MAAyB;EAC3C,OAAO,oBAAC,MAAD,EAAM,QAAQ,KAAO,CAAA;CAC9B;CAEA,QAAkB,OAA4B;EAC5C,MAAM,SAAS,MAAM,KAAK,SAAS,KAAK,KAAK;EAC7C,OAAO,KAAK,WAAW,SAAU,OAAO,MAAM;CAChD;;CAGA,UAAkB,OAAkC;EAClD,OAAO,KAAK,QAAQ,MAAM,SAAS,KAAK,UAAU,KAAK,KAAK;GAAE,OAAO;GAAO;EAAM;CACpF;AACF;;;;;;;AAQA,MAAM,WAAW,SACf,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,YAAD;CAAY,MAAM;CAAU;AAAO,CAAA,GACnC,qBAAC,QAAD;CAAM,WAAW,OAAO;CAAxB,UAAA,CACE,oBAAC,QAAD;EAAM,WAAW,OAAO;EAAgB,UAAA,KAAK;CAAW,CAAA,GACvD,KAAK,cACJ,oBAAC,QAAD;EAAM,WAAW,OAAO;EAAuB,UAAA,KAAK;CAAkB,CAAA,IACpE,IACA;AACN,CAAA,CAAA,EAAA,CAAA;AAGJ,IAAa,aAAb,cAAgC,iBAA8D;CAG5F,YAAY,QAAqB,CAAC,GAAG,WAAW,OAAO;EACrD,MAAM,QAAQ;EACd,KAAK,QAAQ;CACf;;CAGA,aAAuB;EACrB,OAAO,KAAK,MAAM,SAAS,IAAI,KAAK,QAAQ,KAAK;CACnD;CAEA,UAAoB,OAAyC;EAC3D,OAAO,YAAY,KAAK,CAAC,CAAC,IAAI,WAAW;CAC3C;CAEA,MAAgB,MAAiB;EAC/B,OAAO,KAAK;CACd;CAEA,QAAkB,MAAiB,OAAe;EAChD,OAAO,aAAa,OAAO,KAAK,IAAI;CACtC;CAEA,oBAA8B;EAC5B,OAAO,UAAU,KAAK,OAAO,cAAc;CAC7C;;;;;CAMA,UAAoB,MAAiB;EACnC,OAAO,QAAQ,IAAI;CACrB;CAEA,QAAkB,OAAoB;EACpC,OAAO,KAAK,WAAW,QAAS,MAAM,MAAM;CAC9C;AACF;AAEA,IAAa,cAAb,cAAiC,YAA+B;;;EACvD,KAAA,OAAA;EACmB,KAAA,QAAA,CAAC;EACX,KAAA,QAAA;;CAEhB,QAAQ,EAAE,WAAW,OAAO,mBAAmB,SAAS,SAAyC;EAC/F,KAAK,QAAQ;EACb,KAAK,QAAQ;EACb,KAAK,YAAY;EACjB,KAAK,UAAU;EACf,KAAK,WAAW;EAChB,KAAK,QAAQ,YAAY,KAAK,CAAC,CAAC,IAAI,MAAM,CAAC,CAAC,OAAO,OAAO;EAC1D,KAAK,QAAQ;EAIb,KAAK,UAAU;EACf,KAAK,OAAO,WAAW,kBAAkB,MAAM,OAAO,MAAM;EAC5D,KAAK,MAAM,kBAAkB,IAAI;EACjC,KAAK,MAAM,KAAK,MAAM,CAAC;CACzB;CAEA,eAAe,MAAiB;EAC9B,KAAK,MAAM,IAAI;CACjB;;;;;CAMA,eAAyB;EACvB,KAAK,YAAY;CACnB;CAEA,gBAAgB,QAAqB;EACnC,OAAO,QAAQ,KAAK,OAAO,SAAS,MAAM,CAAC;CAC7C;CAEA,MAAc,MAAiB;EAC7B,IAAI,KAAK,OAAO,YAAY,KAAK,OAAO,MAAM,KAAK,KAAK,SAAS,CAAC;CACpE;CAEA,cAAsB;EACpB,MAAM,OAAO,KAAK,MAAM,KAAK;EAC7B,IAAI,CAAC,QAAQ,KAAK,MAAM,SAAS,IAAI,GAAG;EACxC,KAAK,QAAQ,CAAC,GAAG,KAAK,OAAO,IAAI;EACjC,KAAK,QAAQ;EACb,KAAK,UAAU,KAAK;EACpB,KAAK,MAAM,KAAK,MAAM,CAAC;CACzB;CAEA,OAAe,MAAc;EAC3B,KAAK,QAAQ,KAAK,MAAM,QAAQ,UAAU,UAAU,IAAI;EACxD,KAAK,UAAU,KAAK;EACpB,KAAK,MAAM,KAAK,MAAM,CAAC;CACzB;CAEA,QAAgB;EACd,OACE,qBAAA,UAAA,EAAA,UAAA,CACG,KAAK,MAAM,KAAK,SACf,qBAAC,UAAD;GACE,WAAW,OAAO;GAElB,MAAK;GACL,eAAe,KAAK,OAAO,IAAI;GAJjC,UAAA,CAME,oBAAC,QAAD;IAAM,WAAW,OAAO;IAAW,UAAA;GAAW,CAAA,GAC9C,oBAAC,QAAD;IAAM,WAAW,OAAO;IAAO,UAAA;GAAO,CAAA,CAChC;EAND,GAAA,IAMC,CACT,GACD,oBAAC,OAAD;GACE,WAAA;GACA,aAAa,UAAU,KAAK,OAAO,YAAY;GAC/C,MAAK;GACL,OAAO,KAAK;GACZ,cAAc,KAAK,YAAY;GAC/B,WAAW,UAAU;IACnB,KAAK,QAAQ,MAAM,OAAO;IAC1B,KAAK,MAAM,KAAK,MAAM,CAAC;GACzB;GACA,YAAY,UAAU;IACpB,IAAI,MAAM,QAAQ,SAAS;KACzB,MAAM,eAAe;KACrB,MAAM,gBAAgB;KACtB,KAAK,YAAY;KACjB;IACF;IACA,IAAI,MAAM,QAAQ,UAAU;KAC1B,MAAM,eAAe;KACrB,MAAM,gBAAgB;KACtB,KAAK,YAAY;KACjB,KAAK,OAAO;IACd;GACF;EACD,CAAA,CACD,EAAA,CAAA;CAEN;AACF;AAEA,IAAa,gBAAb,cAAmC,YAAqB;;;EAC/C,KAAA,OAAA;;CAEP,QAAQ,EAAE,WAAW,OAAO,mBAAmB,SAAS,SAA+B;EACrF,KAAK,QAAQ;EACb,KAAK,QAAQ;EACb,KAAK,YAAY;EACjB,KAAK,UAAU;EAIf,KAAK,WAAW;EAChB,KAAK,UAAU,EAAE,GAAG,aAAa,KAAK,EAAE;EACxC,KAAK,OAAO,WAAW,kBAAkB,MAAM,OAAO,WAAW;EACjE,KAAK,MAAM,kBAAkB,IAAI;EACjC,KAAK,MAAM,KAAK,MAAM,CAAC;CACzB;CAEA,WAAW;EACT,IAAI,KAAK,WAAW,OAAO,KAAK;EAChC,MAAM,OAAqB,CAAC;EAC5B;GAAE;GAAU;GAAW;GAAQ;GAAS;GAAW;EAAU,CAAC,CAAW,SAAS,QAAQ;GACxF,MAAM,OAAO,OAAQ,KAAK,QAAyB,QAAQ,EAAE,CAAC,CAAC,KAAK;GACpE,IAAI,MAAM,KAAK,OAAO;EACxB,CAAC;EACD,OAAO;CACT;CAEA,eAAe,MAAiB;EAC9B,KAAK,MAAM,IAAI;CACjB;CAEA,MAAc,MAAiB;EAC7B,IAAI,KAAK,OAAO,YAAY,KAAK,OAAO,MAAM,KAAK,KAAK,SAAS,CAAC;CACpE;CAEA,SAAiB,KAAyB,MAAc;EACtD,KAAK,UAAU;GAAE,GAAI,KAAK;IAA2B,MAAM;EAAK;EAChE,KAAK,MAAM,KAAK,MAAM,CAAC;CACzB;CAEA,MAAc,KAAyB,OAAe,YAAY,OAAO;EACvE,MAAM,UAAU,KAAK;EACrB,OACE,qBAAC,SAAD;GAAO,WAAW,OAAO;GAAzB,UAAA,CACE,oBAAC,QAAD;IAAM,WAAW,OAAO;IAAe,UAAA;GAAY,CAAA,GACnD,oBAAC,OAAD;IACa;IACX,MAAK;IACL,OAAO,QAAQ,QAAQ;IACvB,WAAW,UAAU,KAAK,SAAS,KAAK,MAAM,OAAO,KAAK;IAC1D,YAAY,UAAU;KACpB,IAAI,MAAM,QAAQ,SAAS;MACzB,MAAM,eAAe;MACrB,MAAM,gBAAgB;MACtB,KAAK,OAAO;KACd;KACA,IAAI,MAAM,QAAQ,UAAU;MAC1B,MAAM,eAAe;MACrB,MAAM,gBAAgB;MACtB,KAAK,YAAY;MACjB,KAAK,OAAO;KACd;IACF;GACD,CAAA,CACI;;CAEX;CAEA,QAAgB;EACd,OACE,qBAAA,UAAA,EAAA,UAAA;GACG,KAAK,MAAM,UAAU,UAAU,KAAK,OAAO,gBAAgB,GAAG,IAAI;GAClE,KAAK,MAAM,WAAW,UAAU,KAAK,OAAO,iBAAiB,CAAC;GAC/D,qBAAC,OAAD;IAAK,WAAW,OAAO;IAAvB,UAAA,CACG,KAAK,MAAM,QAAQ,UAAU,KAAK,OAAO,cAAc,CAAC,GACxD,KAAK,MAAM,SAAS,UAAU,KAAK,OAAO,eAAe,CAAC,CACxD;;GACL,qBAAC,OAAD;IAAK,WAAW,OAAO;IAAvB,UAAA,CACG,KAAK,MAAM,YAAY,UAAU,KAAK,OAAO,kBAAkB,CAAC,GAChE,KAAK,MAAM,WAAW,UAAU,KAAK,OAAO,iBAAiB,CAAC,CAC5D;;EACL,EAAA,CAAA;CAEN;AACF"}