npm - @qijenchen/design-system - Versions diffs - 0.1.0-beta.95 → 0.1.0-beta.99 - Mend

@qijenchen/design-system 0.1.0-beta.95 → 0.1.0-beta.99

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (355) hide show

package/dist/components/DataTable/cell-registry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cell-registry.js","sources":["../../../src/components/DataTable/cell-registry.tsx"],"sourcesContent":["// @benchmark-unverified-blanket: file-level retraction per M22 (d) — claims herein not individually URL-cited; treat as unverified visual/usage rumor unless retrofit per-claim. Hook escape preserved.\n// code-quality-allow: file-size — Cell Registry 含 10 cell-type components(string/number/date/time/select/multiSelect/person/multiPerson/boolean/url)+ shared helpers,split-into-files 會破壞 type-keyed registry SSOT canonical\n// DataTable Cell Registry — type-keyed SSOT for cell rendering(Phase C 2026-05-05)\n//\n// 對齊 M17 SSOT consolidation + audit recommendation:\n// 原 `renderTypedValue` switch + `EditableCellContent` switch 兩條平行 type-switch 已 collapse\n// 為一張 type → cell component registry。每個 cell component 同時處理 view / edit mode,\n// 靠底層 Field control 的 `mode` prop 切換。\n//\n// 設計原則:\n// - 每個 cell component 接同一組 props(`CellComponentProps`)\n// - 用 `variant=\"naked\"` — DataTable cell-as-input substrate(Field chrome variant;bare 2026-07-09 退役)\n// - 消費 full Field 家族 primitive(無 stub)\n// - 不再用 `meta._editable` 私有 flag — `isEditable` 直接顯式入參(消除 M1 hack)\n//\n// World-class 對照(@benchmark-unverified):AG Grid cellRendererSelector / Material X-Grid\n// `valueGetter + renderCell` / Notion property type registry。\n\nimport * as React from 'react'\nimport type { ComponentType } from 'react'\nimport { Pencil } from 'lucide-react'\nimport { cn, lineClampClass } from '@/lib/utils'\nimport type { ColumnType } from './column-types'\nimport { Input as InputPublic } from '@/design-system/components/Input/input'\nimport { Textarea as TextareaPublic } from '@/design-system/components/Textarea/textarea'\nimport { NumberInput as NumberInputPublic } from '@/design-system/components/NumberInput/number-input'\nimport { Select as SelectPublic } from '@/design-system/components/Select/select'\nimport { Combobox as ComboboxPublic } from '@/design-system/components/Combobox/combobox'\nimport { DatePicker as DatePickerPublic } from '@/design-system/components/DatePicker/date-picker'\nimport { TimePicker as TimePickerPublic } from '@/design-system/components/TimePicker/time-picker'\nimport { PeoplePicker as PeoplePickerPublic } from '@/design-system/components/PeoplePicker/people-picker'\nimport { LinkInput as LinkInputPublic } from '@/design-system/components/LinkInput/link-input'\nimport { Checkbox as CheckboxPublic } from '@/design-system/components/Checkbox/checkbox'\nimport { Button } from '@/design-system/components/Button/button'\nimport type { PersonValue } from '@/design-system/components/PeoplePicker/person-display'\nimport { FieldSurfaceProvider, FieldSurfaceSizeProvider, FieldSurfaceEditableProvider } from '@/design-system/components/Field/field-context'\nimport { makeEditSettleKeyHandler } from '@/design-system/components/Field/field-edit-keys'\nimport type { WithFieldVariantInternal } from '@/design-system/components/Field/field-types'\n\n// ── @internal naked variant 通道(2026-07-14 API 策展 E,user 拍板「全部收窄」)──────────────\n// `naked` 已從公開 FieldVariant 拆出(field-types.ts `FieldVariantInternal`);本檔是唯一合法\n// naked 消費者(field-controls.spec.md「軸二 variant」明文)。以 `WithFieldVariantInternal`\n// 型別層 widen 各 Field control 的 `variant` prop — 純型別、零 runtime;元件內部 cva / resolver\n// 分支本就吃 FieldVariantInternal,widen 不引入 unsound 行為。\nconst Input = InputPublic as WithFieldVariantInternal<typeof InputPublic>\nconst Textarea = TextareaPublic as WithFieldVariantInternal<typeof TextareaPublic>\nconst NumberInput = NumberInputPublic as WithFieldVariantInternal<typeof NumberInputPublic>\nconst Select = SelectPublic as WithFieldVariantInternal<typeof SelectPublic>\nconst Combobox = ComboboxPublic as WithFieldVariantInternal<typeof ComboboxPublic>\nconst DatePicker = DatePickerPublic as WithFieldVariantInternal<typeof DatePickerPublic>\nconst TimePicker = TimePickerPublic as WithFieldVariantInternal<typeof TimePickerPublic>\nconst PeoplePicker = PeoplePickerPublic as WithFieldVariantInternal<typeof PeoplePickerPublic>\nconst LinkInput = LinkInputPublic as WithFieldVariantInternal<typeof LinkInputPublic>\nconst Checkbox = CheckboxPublic as WithFieldVariantInternal<typeof CheckboxPublic>\n\n// ── Types ────────────────────────────────────────────────────────────────────\n\nexport type CellMode = 'view' \| 'edit'\nexport type CellSize = 'sm' \| 'md' \| 'lg'\n\nexport interface CellComponentProps {\n // any-allow: free-form column value(consumer-defined,跨 type 共用 signature)\n value: any\n // any-allow: free-form consumer meta bag(prefix / options / formatOptions / locale / linkLabel 等)\n meta: Record<string, any>\n mode: CellMode\n size: CellSize\n /** 該 cell 的 accessible name(= 欄標題)。naked Field 控件在 cell 內無 FieldLabel,\n * 漏此名 → editor 成無名控件(axe aria-input-field-name / select-name)。由 renderCellContent\n * 從 columnDef.header 解析後注入。對齊 AG Grid / MUI X「editor aria-label = column headerName」。 /\n ariaLabel?: string\n autoRowHeight: boolean\n /* 該 cell 是否可編。replaces 舊 `meta._editable` 私有 flag(Phase C M1 hack 移除)。 /\n isEditable?: boolean\n /* Cell 進 edit mode → 提交新值(blur / Enter / option select 都觸發)— 提交後自動 exit edit。\n * 適用 single-shot commit:string / number / select(single)/ person(single)/ date / time / boolean / url。 /\n onCommit?: (next: unknown) => void\n /* Live commit — 提交新值但不 exit edit(popover 持續開)。\n * 適用 multi-select 類:multiSelect / multiPerson — user 連續勾選,直到點外面才關。\n * 對齊 Notion / Linear / Airtable canonical:multi-pick popover 不在每次 toggle 後關閉。 /\n onCommitLive?: (next: unknown) => void\n /* Esc 取消編輯,不 commit。 /\n onCancel?: () => void\n /* URL cell 專用:hover 顯示的 Pencil 鈕 → 進 edit mode(read mode 保留 link click 語意)。 /\n onRequestEdit?: () => void\n /* Per-keystroke draft propagation(2026-05-10 Phase 7 D.3 portal Field virtualizer unmount preserve draft):\n * Edit mode 內部 input onChange/onValueChange 每 keystroke 呼叫 onDraft,讓 lifted draft state(in\n * data-table.tsx)持有 user 編輯中字。Cell DOM unmount(virtualizer scroll out)時 draft 在\n * parent state 不丟;mount-back 時 portal Field value 從 draft 取,user 字保留。\n * 非 portal mode(inline edit)不傳此 prop,各 Cell 走原 uncontrolled defaultValue 路徑。 /\n onDraft?: (next: unknown) => void\n}\n\n// ── Helpers ──────────────────────────────────────────────────────────────────\n\n/* 鍵盤 commit / cancel — string / number cell edit mode 共用 /\nfunction makeKeyHandler(\n onCommit?: (v: unknown) => void,\n onCancel?: () => void,\n parseValue?: (raw: string) => unknown,\n) {\n // 消費 edit-in-place 鍵盤結算 SSOT(field-edit-keys.ts):IME guard + Enter/Esc dispatch 統一\n // (2026-07-09 抽出;原本 InlineEdit 漏 IME guard = bug,現同源)。value 讀取為 input-specific,留本地。\n return makeEditSettleKeyHandler({\n onCommit: (e) => {\n const raw = (e.target as HTMLInputElement).value\n onCommit?.(parseValue ? parseValue(raw) : raw)\n },\n onCancel: () => onCancel?.(),\n })\n}\n\nconst sizeForInput = (size: CellSize): CellSize => size\n\n// 2026-07-16 round16:cell「disabled」態廢除(世界級 grid 無 disabled cell — MUI X / AG Grid /\n// Handsontable 皆只有 editable/readonly;meta.disabled 全庫 0 消費)。cell view 態一律 mode=\"view\",\n// 鎖定用 `editable:(row)=>false` 閘(= isCellEditable 模型)。原 displayOrDisabled helper 已移除。\n\n// ── Cell Components ──────────────────────────────────────────────────────────\n\nfunction StringCell({ value, meta, mode, size, autoRowHeight, onCommit, onCancel, onDraft, ariaLabel }: CellComponentProps) {\n // 2026-05-14 I9 fix(per codex+Layer A 共識):meta.maxLines opt-in line-clamp。\n // view autoRow 用 Tailwind arbitrary line-clamp 支援 N rows;edit textarea field-sizing\n // 已 auto-grow to content,natural match clamp。\n // 2026-05-16 Round 5 audit Dim 27 fix:narrow type 取代 `as any` cast。\n const maxLines: number \| undefined = (meta as { maxLines?: number } \| undefined)?.maxLines\n const clampClass = autoRowHeight ? lineClampClass(maxLines) : undefined\n // string type canonical(2026-05-05 v2 user 校正:input space ≥ display space):\n // - autoRowHeight: Textarea(view + edit)— view wrap text 撐高 row,edit textarea\n // 多行輸入、`!h-full` 填 cell。對齊 Notion long-text cell canonical。\n // - fixed: Input(view + edit)— 單行 truncate view,單行 input edit;Field naked intrinsic\n // 高 = cell 高 = h-field-md,文字位置 view↔edit 完全一致。對齊 AG Grid / Material X-Grid。\n // - autoRowHeight 是 table 框架決定(consumer 不需 per-column 設 meta.wrap)。\n // - 互動(Textarea):Esc cancel / Cmd\|Ctrl+Enter commit / blur commit;Enter 保留換行\n // - 互動(Input):Esc cancel / Enter commit / blur commit\n const v = value != null ? String(value) : ''\n if (mode === 'view') {\n // size 必傳:DataTable cell 字級隨 size 變(sm/md text-body / lg text-body-lg),\n // 對齊 Field family size→font SSOT(field-wrapper.tsx:60-64)。漏傳 → fallback md → lg 表格\n // 字卡 14px 跟 Select/Date 等有傳 size 的 cell 不一致(2026-06-08 user 抓 frozen string 欄字偏小)。\n return autoRowHeight\n ? <Textarea variant=\"naked\" mode=\"view\" value={v} size={size} className={clampClass} aria-label={ariaLabel} />\n : <Input variant=\"naked\" mode=\"view\" value={v} size={size} aria-label={ariaLabel} />\n }\n if (autoRowHeight) {\n // 2026-05-14 I8 fix(per codex verdict + user 抓「edit cell shrink」):\n // 原 `wrapRows = value.length / 40` 字元估算不準(對應實際 column width 不同\n // → cell 進 edit shrink)。改 CSS `field-sizing: content`(Chrome 123+ / FF 122+ /\n // Safari 17+)讓 textarea 自動 grow to content,匹配 view wrap 真實高度。\n // Fallback rows 仍保留給舊 browser(rows attr 在 field-sizing 支援時被覆蓋)。\n const newlineRows = (v.match(/\\n/g) \|\| []).length + 1\n const wrapRows = Math.ceil(v.length / 40)\n const estimateRows = Math.min(10, Math.max(1, newlineRows, wrapRows))\n return (\n <Textarea\n autoFocus\n variant=\"naked\"\n aria-label={ariaLabel}\n size={sizeForInput(size)}\n rows={estimateRows}\n defaultValue={v}\n // any-allow: CSS `field-sizing` 屬性 Chrome 123+/FF 122+/Safari 17+ 支援但 TypeScript lib.dom\n // 尚未加 type;narrow 到 CSSProperties 仍需 cast,保留 single-site any 較 type aug 簡潔。\n style={{ fieldSizing: 'content' } as React.CSSProperties}\n onChange={(e) => onDraft?.((e.target as HTMLTextAreaElement).value)}\n onBlur={(e) => onCommit?.((e.target as HTMLTextAreaElement).value)}\n // 多行:走 edit-in-place 鍵盤結算 SSOT(IME guard + Esc + Cmd/Ctrl+Enter commit;\n // plain Enter=換行)。commitOnEnter:false → 純 Enter 不攔。\n onKeyDown={makeEditSettleKeyHandler({\n onCommit: (e) => onCommit?.((e.target as HTMLTextAreaElement).value),\n onCancel: () => onCancel?.(),\n commitOnEnter: false,\n })}\n />\n )\n }\n return (\n <Input\n autoFocus\n variant=\"naked\"\n aria-label={ariaLabel}\n size={sizeForInput(size)}\n defaultValue={v}\n onChange={(e) => onDraft?.(e.target.value)}\n onBlur={(e) => onCommit?.(e.target.value)}\n onKeyDown={makeKeyHandler(onCommit, onCancel)}\n />\n )\n}\n\nfunction NumberCell({ value, meta, mode, size, onCommit, onCancel, onDraft, ariaLabel }: CellComponentProps) {\n // currency 透過 columnType-aware prefix:type='currency' → 預設 '$'(可 override)\n const isCurrency = meta?.type === 'currency'\n const prefix = isCurrency ? (meta?.prefix ?? '$') : meta?.prefix\n // React #310 fix:useState 必在 view early-return 前無條件呼叫。同一 memo'd cell instance\n // 在 view↔edit 切換時被重用(render site 無 key={mode},data-table.tsx:1352),hook 數量不可變,\n // 否則 Rules of Hooks violation → React #310 crash。對齊 combobox/select hoist pattern。\n const initial = typeof value === 'number' ? value : null\n const [localValue, setLocalValue] = React.useState<number \| null>(initial)\n if (mode === 'view') {\n return (\n <NumberInput\n variant=\"naked\"\n mode=\"view\"\n aria-label={ariaLabel}\n value={value as number \| null}\n // size 必傳(同 StringCell)— currency/number cell 字級隨 DataTable size 變,對齊 Field SSOT。\n size={size}\n prefix={prefix}\n suffix={meta?.suffix}\n precision={meta?.precision}\n locale={meta?.locale}\n />\n )\n }\n // Edit mode value pre-fill canonical(2026-05-05):NumberInput edit 強制 controlled\n // (`value={value ?? ''}`)— 若 NumberCell 以 `defaultValue` 傳入,NumberInput value=undefined → ''\n // empty。對齊 cell-as-input「edit mode 自動帶入 view 值」(對齊 Notion / Airtable 共識),\n // 改用 local state controlled。User typing → setLocalValue;blur/Enter → onCommit(localValue)。\n // (initial + useState 已 hoist 到 view-return 前 — 見上方 React #310 fix。)\n return (\n <NumberInput\n autoFocus\n variant=\"naked\"\n aria-label={ariaLabel}\n size={sizeForInput(size)}\n value={localValue}\n onChange={(v) => { setLocalValue(v); onDraft?.(v) }}\n prefix={prefix}\n suffix={meta?.suffix}\n precision={meta?.precision}\n onBlur={() => onCommit?.(localValue)}\n // 單行:走 edit-in-place 鍵盤結算 SSOT(IME guard + Esc + Enter commit)。\n // commit localValue(controlled state,非 e.target.value)。\n onKeyDown={makeEditSettleKeyHandler({\n onCommit: () => onCommit?.(localValue),\n onCancel: () => onCancel?.(),\n })}\n />\n )\n}\n\n// Cell-as-input dismiss canonical(2026-05-05):defaultOpen=true 開始 → user click 外 popover 關\n// → 元件 fire onOpenChange(false) → cell call onCancel exit edit。否則 cell 卡 edit mode 不可 re-trigger\n// (對齊 Airtable / Notion canonical:click 外即關)。\nconst dismissOnClose = (onCancel?: () => void) => (open: boolean) => { if (!open) onCancel?.() }\n\n// Mode-keyed remount canonical(2026-05-05):view↔edit 切換時,因 React reconciliation 同 type 同\n// position 會重用 instance,導致 `useState(defaultOpen)` 只在首次 mount 跑(那時 mode='view'\n// defaultOpen 沒給→預設 false)。後續 mode='edit' 即使傳 defaultOpen=true 也無效。\n// Fix:`key={mode}` 強制 React unmount + remount,每次切 mode 都重跑 useState init。\n// 對齊 Notion / Airtable cell-as-input「view 跟 edit 是不同 mount cycle」語義。\n\nfunction DateCell({ value, meta, mode, size, onCommit, onCancel }: CellComponentProps) {\n if (mode === 'view') {\n return (\n <DatePicker\n key=\"view\"\n variant=\"naked\"\n mode=\"view\"\n value={value as string \| null}\n size={size}\n formatOptions={meta?.formatOptions}\n locale={meta?.locale}\n // 2026-07-08 user 拍板 A 案(推翻 2026-05-10/06-26 兩次拍板,per 6 家 benchmark 6/6 共識\n // Ant/MUI X/AG Grid/Atlaskit/Notion/Airtable:view 態零恆顯型別 icon;editable\n // affordance 統一 = hover outline(field.spec.md L4)。showDisplayEndIcon 不再傳\n //(prop 保留為 spreadsheet-flavored 消費端 opt-in 逃生門,見 field.spec.md L6)。\n />\n )\n }\n return (\n <DatePicker\n key=\"edit\"\n autoFocus\n variant=\"naked\"\n size={sizeForInput(size)}\n value={typeof value === 'string' ? value : null}\n showTime={meta?.includeTime === true}\n onChange={(v) => onCommit?.(v)}\n defaultOpen\n onOpenChange={dismissOnClose(onCancel)}\n />\n )\n}\n\nfunction TimeCell({ value, meta, mode, size, onCommit, onCancel }: CellComponentProps) {\n if (mode === 'view') {\n return (\n <TimePicker\n key=\"view\"\n variant=\"naked\"\n mode=\"view\"\n value={value as string \| null}\n size={size}\n formatOptions={meta?.formatOptions}\n locale={meta?.locale}\n // showDisplayEndIcon 不傳 — 2026-07-08 A 案:view 態零恆顯 icon(同 DateCell 註)\n />\n )\n }\n return (\n <TimePicker\n key=\"edit\"\n variant=\"naked\"\n size={sizeForInput(size)}\n value={typeof value === 'string' ? value : null}\n showSeconds={meta?.showSeconds === true}\n minuteStep={meta?.minuteStep}\n secondStep={meta?.secondStep}\n onChange={(v) => onCommit?.(v)}\n defaultOpen\n onOpenChange={dismissOnClose(onCancel)}\n />\n )\n}\n\nfunction SelectCell({ value, meta, mode, size, onCommit, onCancel }: CellComponentProps) {\n // View canonical(2026-05-05):cell IS variant,default plain text(no Tag pill 疊在 cell border 內)。\n // Consumer 可在 column meta.display='tag' opt-in 內容導向的 Tag 視覺(category 含色彩標籤等)。\n // 對齊 JTable / AG Grid「renderer/editor 視覺一致」canonical。\n const displayMode = (meta?.display as 'plain' \| 'tag' \| undefined) ?? 'plain'\n if (mode === 'view') {\n return (\n <Select\n key=\"view\"\n variant=\"naked\"\n mode=\"view\"\n value={value as string \| null}\n options={meta?.options ?? []}\n size={size}\n display={displayMode}\n // showDisplayEndIcon 不傳 — 2026-07-08 A 案:view 態零恆顯 icon(同 DateCell 註)\n selectedItemRenderer={meta?.selectedItemRenderer} // 2026-07-08 WM 戰役:status 類彩色 cell 顯示通道\n />\n )\n }\n return (\n <Select\n key=\"edit\"\n autoFocus\n variant=\"naked\"\n size={sizeForInput(size)}\n selectedItemRenderer={meta?.selectedItemRenderer}\n options={meta?.options ?? []}\n value={value as string \| null \| undefined}\n onChange={(v) => onCommit?.(v)}\n // B7(2026-05-05):cell 編輯時支援 inline search,沿用 Select.searchable 機制(對齊 cell-as-input\n // 「沿用既有輸入框互動」原則)。Default false,consumer 在 meta.searchable 開啟。\n searchable={meta?.searchable === true}\n display={displayMode}\n defaultOpen\n onOpenChange={dismissOnClose(onCancel)}\n />\n )\n}\n\nfunction MultiSelectCell({ value, meta, mode, size, autoRowHeight, onCommitLive, onCancel }: CellComponentProps) {\n const wrap = autoRowHeight && meta?.wrap === true\n if (mode === 'view') {\n return (\n <Combobox\n key=\"view\"\n variant=\"naked\"\n mode=\"view\"\n value={(value as string[] \| null) ?? []}\n options={meta?.options ?? []}\n wrap={wrap}\n size={size}\n // showDisplayEndIcon 不傳 — 2026-07-08 A 案:view 態零恆顯 icon(同 DateCell 註)\n />\n )\n }\n // Multi 用 onCommitLive(commit 但不 exit edit)— 每勾一項即時生效,popover 持續開\n // 直到點外面;onOpenChange(false) → onCancel exit edit。對齊 Notion / Linear / Airtable canonical。\n return (\n <Combobox\n key=\"edit\"\n variant=\"naked\"\n size={sizeForInput(size)}\n options={meta?.options ?? []}\n value={Array.isArray(value) ? (value as string[]) : []}\n onChange={(v) => onCommitLive?.(v)}\n defaultOpen\n onOpenChange={dismissOnClose(onCancel)}\n />\n )\n}\n\nfunction PersonCell({ value, mode, size, onCommit, onCancel, meta }: CellComponentProps) {\n if (mode === 'view') {\n // 2026-07-08 A 案:view 態零恆顯 icon(同 DateCell 註)\n return <PeoplePicker key=\"view\" variant=\"naked\" mode=\"view\" value={value as PersonValue \| null} size={size} />\n }\n return (\n <PeoplePicker\n key=\"edit\"\n variant=\"naked\"\n size={sizeForInput(size)}\n value={value as PersonValue \| null}\n people={meta?.people ?? []}\n // PeoplePicker onChange 永遠 emit array(API contract);single mode commit 取首位\n onChange={(next) => onCommit?.(next[0] ?? null)}\n defaultOpen\n onOpenChange={dismissOnClose(onCancel)}\n />\n )\n}\n\nfunction MultiPersonCell({ value, mode, size, onCommitLive, onCancel, meta }: CellComponentProps) {\n if (mode === 'view') {\n // 2026-07-08 A 案:view 態零恆顯 icon(同 DateCell 註)\n return <PeoplePicker key=\"view\" variant=\"naked\" mode=\"view\" value={(value as PersonValue[]) ?? []} size={size} />\n }\n // Multi 用 onCommitLive(commit 但不 exit edit)— 每勾一人即時生效,popover 持續開\n // 直到點外面;onOpenChange(false) → onCancel exit edit。對齊 multiSelect canonical。\n return (\n <PeoplePicker\n key=\"edit\"\n variant=\"naked\"\n size={sizeForInput(size)}\n value={Array.isArray(value) ? (value as PersonValue[]) : []}\n people={meta?.people ?? []}\n onChange={(next) => onCommitLive?.(next)}\n defaultOpen\n onOpenChange={dismissOnClose(onCancel)}\n />\n )\n}\n\nfunction BooleanCell({ value, mode, meta, size, isEditable, onCommit }: CellComponentProps) {\n // boolean 不分 read/edit mode — view 渲 mode='view' 純展示;editable 時直接 toggle Checkbox。\n // 不可編(!isEditable)→ 走 view branch,Checkbox mode=\"view\" 純展示不接 onCheckedChange。\n if (mode === 'view' && !isEditable) {\n // size 傳入 → boolean 值 icon(Check/X)@lg 縮放對齊其他 cell(對齊 editable 分支同 size 邏輯)\n return <Checkbox variant=\"naked\" size={size === 'lg' ? 'lg' : 'md'} mode=\"view\" checked={value === true} />\n }\n return (\n <Checkbox\n size={size === 'lg' ? 'lg' : 'md'}\n checked={value === true}\n onCheckedChange={(checked) => onCommit?.(checked === true)}\n aria-label={meta?.ariaLabel ?? '切換'}\n />\n )\n}\n\n/\n UrlCell(2026-07-14 docblock 對齊實作):\n * view branch = `<LinkInput mode=\"view\">`(URL parse / hostname\n * 顯示一致性 SSOT);editable 互動:hover 時右側出 Pencil 鈕 → 進 edit(保留 link click 語意)。\n * edit branch = plain `<Input variant=\"naked\">`(LinkInput edit 的 controlled value 衝突\n * revert,詳下方 edit branch 註解);URL 驗證 deferred 到 onCommit(consumer 端 validate)。\n /\nfunction UrlCell({ value, meta, mode, size, isEditable, onRequestEdit, onCommit, onCancel }: CellComponentProps) {\n if (mode === 'view') {\n // showDisplayEndIcon ← D path Phase 2(2026-05-08):Field naked wrapper 包 anchor,與 Input edit 同 chrome。\n // LinkInput 此 prop = wrapper-only(無 icon,field.spec.md L6 例外)→ A 案(2026-07-08)不撤;\n // 但修 I1:原無條件 true 違反「= isEditable」knob 等式(field-controls.spec.md cell 例外),改等式。\n const display = (\n <LinkInput variant=\"naked\" mode=\"view\" value={value as string \| null} label={meta?.linkLabel} size={size} showDisplayEndIcon={isEditable === true} />\n )\n // 不可編 URL 不顯 Pencil affordance(純 view 顯示連結,無編輯入口)\n if (!isEditable) return display\n // editable read mode:hover Pencil 鈕(對齊 spec 第十二段「url:read = 連結 + Pencil」)\n return (\n <span className=\"group/cell relative flex items-center w-full\"> {/ @naked-row-mode-allow: URL hover-Pencil 是 inline action 不是 value content,items-center 鎖 Pencil 對齊行高第一行(autoRow 跟 fixed 皆同視覺正確) /}\n <span className=\"flex-1 min-w-0\">{display}</span>\n <Button\n variant=\"tertiary\"\n size=\"xs\"\n iconOnly\n startIcon={Pencil}\n aria-label=\"編輯連結\"\n className={cn('ml-1 opacity-0 group-hover/cell:opacity-100 transition-opacity')}\n onClick={(e) => {\n e.stopPropagation()\n onRequestEdit?.()\n }}\n />\n </span>\n )\n }\n // edit mode value pre-fill canonical(2026-05-05):LinkInput edit `value` prop 強制 controlled\n // (line 113 `useState(value ?? '')`)+ `showLink = !editing && hasValidValue` 預設顯 link 不顯 input\n // → cell-as-input editing 場景需要 input 直接 focus 編輯。改用 plain `<Input>`(uncontrolled\n // `defaultValue` 正確 pre-fill,Input.tsx `value={value}` 是 undefined → uncontrolled 走 defaultValue)。\n // URL 驗證等 deferred 到 commit phase(consumer 可在 onCommit 時 validate)。\n return (\n <Input\n autoFocus\n variant=\"naked\"\n size={sizeForInput(size)}\n defaultValue={value != null ? String(value) : ''}\n onBlur={(e) => onCommit?.(e.target.value)}\n onKeyDown={makeKeyHandler(onCommit, onCancel)}\n />\n )\n}\n\n// ── Registry ────────────────────────────────────────────────────────────────\n//\n// type → cell component。新增 columnType 必同步註冊一條(否則 fallback 到 string)。\n\nexport const cellRegistry: Record<ColumnType, ComponentType<CellComponentProps>> = {\n string: StringCell,\n number: NumberCell,\n currency: NumberCell, // 共用 NumberCell — currency-ness 走 meta.type 判 prefix='$'\n date: DateCell,\n time: TimeCell,\n select: SelectCell,\n multiSelect: MultiSelectCell,\n person: PersonCell,\n multiPerson: MultiPersonCell,\n boolean: BooleanCell,\n url: UrlCell,\n}\n\n/* Resolve cell component by type;default = StringCell(consumer 沒設 type 的 fallback)。\n * 2026-05-12 Stream C Cluster B fix:wrap with FieldSurfaceProvider `surface='table-cell'`\n * 讓所有 Cell 內的 Field family controls 透過 `useFieldSurface()` 取得「我在 cell 裡」context,\n * 取代散落的 `variant === 'naked'` cell-detection heuristic + per-prop hardcoded padding。\n \n 2026-05-13 (a) perf fix(user 拍板 + codex V1 verdict + Layer A grep root cause):\n * 原 factory pattern 每次 call 在 function body 內宣告新 `CellWithSurface` FC closure → 每 scroll\n * × 每 visible cell 都 return 新 FC reference → React 認 component type 變,*整 subtree mount/\n unmount cascade*(Field + ItemPrefix/Suffix + Avatar / Tag / PersonDisplay)。\n Fix:每 ColumnType module-level 預建 wrapped FC + `React.memo`,resolve 走 cached map,\n * identity stable across scroll → memo 真生效 + subtree 不 mount/unmount。\n * Cite world-class:AG Grid「cell renderer per-type stable reference」/ MUI X DataGrid「memoized\n * subcomponents」/ Glide Data Grid「DOM virtualization 加解掛 = bottleneck」。 /\nconst cellWithSurfaceCache = new Map<ColumnType \| '_default_', ComponentType<CellComponentProps>>()\n\nfunction buildCellWithSurface(Inner: ComponentType<CellComponentProps>, key: string): ComponentType<CellComponentProps> {\n const CellWithSurface = React.memo(function CellWithSurface(props: CellComponentProps) {\n return (\n <FieldSurfaceProvider surface=\"table-cell\">\n {/ 2026-06-08:把 table-density size 經獨立 surface-size context 注給 child Field controls,\n 漏傳 size 的 cell 也自動繼承(根治「新 cell 漏傳 size」class);size primitive 不破壞 memo identity。/}\n <FieldSurfaceSizeProvider size={props.size}>\n {/ 2026-07-08 user 拍板:cell 可編輯訊號經獨立 boolean context 注給 child Field controls,\n 讓 useFieldEmptyDisplay 分流「可編輯 cell 空 view → 空白」vs「不可編輯 cell → '-'」。\n boolean primitive 不破壞 memo identity(同 size context)。 */}\n <FieldSurfaceEditableProvider isEditable={props.isEditable ?? false}>\n <Inner {...props} />\n </FieldSurfaceEditableProvider>\n </FieldSurfaceSizeProvider>\n </FieldSurfaceProvider>\n )\n })\n ;(CellWithSurface as { displayName?: string }).displayName = `CellWithSurface(${key})`\n return CellWithSurface as ComponentType<CellComponentProps>\n}\n\n// Pre-build per-type cached wrapped components(module-level,one-time init)\nfor (const type of Object.keys(cellRegistry) as ColumnType[]) {\n cellWithSurfaceCache.set(type, buildCellWithSurface(cellRegistry[type], type))\n}\ncellWithSurfaceCache.set('_default_', buildCellWithSurface(StringCell, 'StringCell-fallback'))\n\nexport function resolveCellComponent(type?: ColumnType): ComponentType<CellComponentProps> {\n return cellWithSurfaceCache.get(type ?? '_default_') ?? cellWithSurfaceCache.get('_default_')!\n}\n"],"names":["InputPublic","TextareaPublic","NumberInputPublic","SelectPublic","ComboboxPublic","DatePickerPublic","TimePickerPublic","PeoplePickerPublic","LinkInputPublic","CheckboxPublic","CellWithSurface"],"mappings":"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"}
1	+ {"version":3,"file":"cell-registry.js","sources":["../../../src/components/DataTable/cell-registry.tsx"],"sourcesContent":["// @benchmark-unverified-blanket: file-level retraction per M22 (d) — claims herein not individually URL-cited; treat as unverified visual/usage rumor unless retrofit per-claim. Hook escape preserved.\n// code-quality-allow: file-size — Cell Registry 含 10 cell-type components(string/number/date/time/select/multiSelect/person/multiPerson/boolean/url)+ shared helpers,split-into-files 會破壞 type-keyed registry SSOT canonical\n// DataTable Cell Registry — type-keyed SSOT for cell rendering(Phase C 2026-05-05)\n//\n// 對齊 M17 SSOT consolidation + audit recommendation:\n// 原 `renderTypedValue` switch + `EditableCellContent` switch 兩條平行 type-switch 已 collapse\n// 為一張 type → cell component registry。每個 cell component 同時處理 view / edit mode,\n// 靠底層 Field control 的 `mode` prop 切換。\n//\n// 設計原則:\n// - 每個 cell component 接同一組 props(`CellComponentProps`)\n// - 用 `variant=\"naked\"` — DataTable cell-as-input substrate(Field chrome variant;bare 2026-07-09 退役)\n// - 消費 full Field 家族 primitive(無 stub)\n// - 不再用 `meta._editable` 私有 flag — `isEditable` 直接顯式入參(消除 M1 hack)\n//\n// World-class 對照(@benchmark-unverified):AG Grid cellRendererSelector / Material X-Grid\n// `valueGetter + renderCell` / Notion property type registry。\n\nimport * as React from 'react'\nimport type { ComponentType } from 'react'\nimport { Pencil } from 'lucide-react'\nimport { cn, lineClampClass } from '@/lib/utils'\nimport type { ColumnType } from './column-types'\nimport { Input as InputPublic } from '@/design-system/components/Input/input'\nimport { Textarea as TextareaPublic } from '@/design-system/components/Textarea/textarea'\nimport { NumberInput as NumberInputPublic } from '@/design-system/components/NumberInput/number-input'\nimport { Select as SelectPublic } from '@/design-system/components/Select/select'\nimport { Combobox as ComboboxPublic } from '@/design-system/components/Combobox/combobox'\nimport { DatePicker as DatePickerPublic } from '@/design-system/components/DatePicker/date-picker'\nimport { TimePicker as TimePickerPublic } from '@/design-system/components/TimePicker/time-picker'\nimport { PeoplePicker as PeoplePickerPublic } from '@/design-system/components/PeoplePicker/people-picker'\nimport { LinkInput as LinkInputPublic } from '@/design-system/components/LinkInput/link-input'\nimport { Checkbox as CheckboxPublic } from '@/design-system/components/Checkbox/checkbox'\nimport { Button } from '@/design-system/components/Button/button'\nimport type { PersonValue } from '@/design-system/components/PeoplePicker/person-display'\nimport { FieldSurfaceProvider, FieldSurfaceSizeProvider, FieldSurfaceEditableProvider } from '@/design-system/components/Field/field-context'\nimport { makeEditSettleKeyHandler } from '@/design-system/components/Field/field-edit-keys'\nimport type { WithFieldVariantInternal } from '@/design-system/components/Field/field-types'\n\n// ── @internal naked variant 通道(2026-07-14 API 策展 E,user 拍板「全部收窄」)──────────────\n// `naked` 已從公開 FieldVariant 拆出(field-types.ts `FieldVariantInternal`);本檔是唯一合法\n// naked 消費者(field-controls.spec.md「軸二 variant」明文)。以 `WithFieldVariantInternal`\n// 型別層 widen 各 Field control 的 `variant` prop — 純型別、零 runtime;元件內部 cva / resolver\n// 分支本就吃 FieldVariantInternal,widen 不引入 unsound 行為。\nconst Input = InputPublic as WithFieldVariantInternal<typeof InputPublic>\nconst Textarea = TextareaPublic as WithFieldVariantInternal<typeof TextareaPublic>\nconst NumberInput = NumberInputPublic as WithFieldVariantInternal<typeof NumberInputPublic>\nconst Select = SelectPublic as WithFieldVariantInternal<typeof SelectPublic>\nconst Combobox = ComboboxPublic as WithFieldVariantInternal<typeof ComboboxPublic>\nconst DatePicker = DatePickerPublic as WithFieldVariantInternal<typeof DatePickerPublic>\nconst TimePicker = TimePickerPublic as WithFieldVariantInternal<typeof TimePickerPublic>\nconst PeoplePicker = PeoplePickerPublic as WithFieldVariantInternal<typeof PeoplePickerPublic>\nconst LinkInput = LinkInputPublic as WithFieldVariantInternal<typeof LinkInputPublic>\nconst Checkbox = CheckboxPublic as WithFieldVariantInternal<typeof CheckboxPublic>\n\n// ── Types ────────────────────────────────────────────────────────────────────\n\nexport type CellMode = 'view' \| 'edit'\nexport type CellSize = 'sm' \| 'md' \| 'lg'\n\nexport interface CellComponentProps {\n // any-allow: free-form column value(consumer-defined,跨 type 共用 signature)\n value: any\n // any-allow: free-form consumer meta bag(prefix / options / formatOptions / locale / linkLabel 等)\n meta: Record<string, any>\n mode: CellMode\n size: CellSize\n /** 該 cell 的 accessible name(= 欄標題)。naked Field 控件在 cell 內無 FieldLabel,\n * 漏此名 → editor 成無名控件(axe aria-input-field-name / select-name)。由 renderCellContent\n * 從 columnDef.header 解析後注入。對齊 AG Grid / MUI X「editor aria-label = column headerName」。 /\n ariaLabel?: string\n autoRowHeight: boolean\n /* 該 cell 是否可編。replaces 舊 `meta._editable` 私有 flag(Phase C M1 hack 移除)。 /\n isEditable?: boolean\n /* Cell 進 edit mode → 提交新值(blur / Enter / option select 都觸發)— 提交後自動 exit edit。\n * 適用 single-shot commit:string / number / select(single)/ person(single)/ date / time / boolean / url。 /\n onCommit?: (next: unknown) => void\n /* Live commit — 提交新值但不 exit edit(popover 持續開)。\n * 適用 multi-select 類:multiSelect / multiPerson — user 連續勾選,直到點外面才關。\n * 對齊 Notion / Linear / Airtable canonical:multi-pick popover 不在每次 toggle 後關閉。 /\n onCommitLive?: (next: unknown) => void\n /* Esc 取消編輯,不 commit。 /\n onCancel?: () => void\n /* URL cell 專用:hover 顯示的 Pencil 鈕 → 進 edit mode(read mode 保留 link click 語意)。 /\n onRequestEdit?: () => void\n /* Per-keystroke draft propagation(2026-05-10 Phase 7 D.3 portal Field virtualizer unmount preserve draft):\n * Edit mode 內部 input onChange/onValueChange 每 keystroke 呼叫 onDraft,讓 lifted draft state(in\n * data-table.tsx)持有 user 編輯中字。Cell DOM unmount(virtualizer scroll out)時 draft 在\n * parent state 不丟;mount-back 時 portal Field value 從 draft 取,user 字保留。\n * 非 portal mode(inline edit)不傳此 prop,各 Cell 走原 uncontrolled defaultValue 路徑。 /\n onDraft?: (next: unknown) => void\n}\n\n// ── Helpers ──────────────────────────────────────────────────────────────────\n\n/* 鍵盤 commit / cancel — string / number cell edit mode 共用 /\nfunction makeKeyHandler(\n onCommit?: (v: unknown) => void,\n onCancel?: () => void,\n parseValue?: (raw: string) => unknown,\n) {\n // 消費 edit-in-place 鍵盤結算 SSOT(field-edit-keys.ts):IME guard + Enter/Esc dispatch 統一\n // (2026-07-09 抽出;原本 InlineEdit 漏 IME guard = bug,現同源)。value 讀取為 input-specific,留本地。\n return makeEditSettleKeyHandler({\n onCommit: (e) => {\n const raw = (e.target as HTMLInputElement).value\n onCommit?.(parseValue ? parseValue(raw) : raw)\n },\n onCancel: () => onCancel?.(),\n })\n}\n\nconst sizeForInput = (size: CellSize): CellSize => size\n\n// 2026-07-16 round16:cell「disabled」態廢除(世界級 grid 無 disabled cell — MUI X / AG Grid /\n// Handsontable 皆只有 editable/readonly;meta.disabled 全庫 0 消費)。cell view 態一律 mode=\"view\",\n// 鎖定用 `editable:(row)=>false` 閘(= isCellEditable 模型)。原 displayOrDisabled helper 已移除。\n\n// ── Cell Components ──────────────────────────────────────────────────────────\n\nfunction StringCell({ value, meta, mode, size, autoRowHeight, onCommit, onCancel, onDraft, ariaLabel }: CellComponentProps) {\n // 2026-05-14 I9 fix(per codex+Layer A 共識):meta.maxLines opt-in line-clamp。\n // view autoRow 用 Tailwind arbitrary line-clamp 支援 N rows;edit textarea field-sizing\n // 已 auto-grow to content,natural match clamp。\n // 2026-05-16 Round 5 audit Dim 27 fix:narrow type 取代 `as any` cast。\n const maxLines: number \| undefined = (meta as { maxLines?: number } \| undefined)?.maxLines\n const clampClass = autoRowHeight ? lineClampClass(maxLines) : undefined\n // string type canonical(2026-05-05 v2 user 校正:input space ≥ display space):\n // - autoRowHeight: Textarea(view + edit)— view wrap text 撐高 row,edit textarea\n // 多行輸入、`!h-full` 填 cell。對齊 Notion long-text cell canonical。\n // - fixed: Input(view + edit)— 單行 truncate view,單行 input edit;Field naked intrinsic\n // 高 = cell 高 = h-field-md,文字位置 view↔edit 完全一致。對齊 AG Grid / Material X-Grid。\n // - autoRowHeight 是 table 框架決定(consumer 不需 per-column 設 meta.wrap)。\n // - 互動(Textarea):Esc cancel / Cmd\|Ctrl+Enter commit / blur commit;Enter 保留換行\n // - 互動(Input):Esc cancel / Enter commit / blur commit\n const v = value != null ? String(value) : ''\n if (mode === 'view') {\n // size 必傳:DataTable cell 字級隨 size 變(sm/md text-body / lg text-body-lg),\n // 對齊 Field family size→font SSOT(field-wrapper.tsx:60-64)。漏傳 → fallback md → lg 表格\n // 字卡 14px 跟 Select/Date 等有傳 size 的 cell 不一致(2026-06-08 user 抓 frozen string 欄字偏小)。\n return autoRowHeight\n ? <Textarea variant=\"naked\" mode=\"view\" value={v} size={size} className={clampClass} aria-label={ariaLabel} />\n : <Input variant=\"naked\" mode=\"view\" value={v} size={size} aria-label={ariaLabel} />\n }\n if (autoRowHeight) {\n // 2026-05-14 I8 fix(per codex verdict + user 抓「edit cell shrink」):\n // 原 `wrapRows = value.length / 40` 字元估算不準(對應實際 column width 不同\n // → cell 進 edit shrink)。改 CSS `field-sizing: content`(Chrome 123+ / FF 122+ /\n // Safari 17+)讓 textarea 自動 grow to content,匹配 view wrap 真實高度。\n // Fallback rows 仍保留給舊 browser(rows attr 在 field-sizing 支援時被覆蓋)。\n return (\n <Textarea\n autoFocus\n variant=\"naked\"\n aria-label={ariaLabel}\n size={sizeForInput(size)}\n // 2026-07-28:原本 field-sizing + rows 估算是本檔的呼叫端膠水,只有 cell 有、InlineEdit 沒有\n // → 兩者 edit 高度漂移。已提升為 Textarea `autoSize` 能力,兩個語境共用同一份實作。\n autoSize\n defaultValue={v}\n onChange={(e) => onDraft?.((e.target as HTMLTextAreaElement).value)}\n onBlur={(e) => onCommit?.((e.target as HTMLTextAreaElement).value)}\n // 多行:走 edit-in-place 鍵盤結算 SSOT(IME guard + Esc + Cmd/Ctrl+Enter commit;\n // plain Enter=換行)。commitOnEnter:false → 純 Enter 不攔。\n onKeyDown={makeEditSettleKeyHandler({\n onCommit: (e) => onCommit?.((e.target as HTMLTextAreaElement).value),\n onCancel: () => onCancel?.(),\n commitOnEnter: false,\n })}\n />\n )\n }\n return (\n <Input\n autoFocus\n variant=\"naked\"\n aria-label={ariaLabel}\n size={sizeForInput(size)}\n defaultValue={v}\n onChange={(e) => onDraft?.(e.target.value)}\n onBlur={(e) => onCommit?.(e.target.value)}\n onKeyDown={makeKeyHandler(onCommit, onCancel)}\n />\n )\n}\n\nfunction NumberCell({ value, meta, mode, size, onCommit, onCancel, onDraft, ariaLabel }: CellComponentProps) {\n // currency 透過 columnType-aware prefix:type='currency' → 預設 '$'(可 override)\n const isCurrency = meta?.type === 'currency'\n const prefix = isCurrency ? (meta?.prefix ?? '$') : meta?.prefix\n // React #310 fix:useState 必在 view early-return 前無條件呼叫。同一 memo'd cell instance\n // 在 view↔edit 切換時被重用(render site 無 key={mode},data-table.tsx:1352),hook 數量不可變,\n // 否則 Rules of Hooks violation → React #310 crash。對齊 combobox/select hoist pattern。\n const initial = typeof value === 'number' ? value : null\n const [localValue, setLocalValue] = React.useState<number \| null>(initial)\n if (mode === 'view') {\n return (\n <NumberInput\n variant=\"naked\"\n mode=\"view\"\n aria-label={ariaLabel}\n value={value as number \| null}\n // size 必傳(同 StringCell)— currency/number cell 字級隨 DataTable size 變,對齊 Field SSOT。\n size={size}\n prefix={prefix}\n suffix={meta?.suffix}\n precision={meta?.precision}\n locale={meta?.locale}\n />\n )\n }\n // Edit mode value pre-fill canonical(2026-05-05):NumberInput edit 強制 controlled\n // (`value={value ?? ''}`)— 若 NumberCell 以 `defaultValue` 傳入,NumberInput value=undefined → ''\n // empty。對齊 cell-as-input「edit mode 自動帶入 view 值」(對齊 Notion / Airtable 共識),\n // 改用 local state controlled。User typing → setLocalValue;blur/Enter → onCommit(localValue)。\n // (initial + useState 已 hoist 到 view-return 前 — 見上方 React #310 fix。)\n return (\n <NumberInput\n autoFocus\n variant=\"naked\"\n aria-label={ariaLabel}\n size={sizeForInput(size)}\n value={localValue}\n onChange={(v) => { setLocalValue(v); onDraft?.(v) }}\n prefix={prefix}\n suffix={meta?.suffix}\n precision={meta?.precision}\n onBlur={() => onCommit?.(localValue)}\n // 單行:走 edit-in-place 鍵盤結算 SSOT(IME guard + Esc + Enter commit)。\n // commit localValue(controlled state,非 e.target.value)。\n onKeyDown={makeEditSettleKeyHandler({\n onCommit: () => onCommit?.(localValue),\n onCancel: () => onCancel?.(),\n })}\n />\n )\n}\n\n// Cell-as-input dismiss canonical(2026-05-05):defaultOpen=true 開始 → user click 外 popover 關\n// → 元件 fire onOpenChange(false) → cell call onCancel exit edit。否則 cell 卡 edit mode 不可 re-trigger\n// (對齊 Airtable / Notion canonical:click 外即關)。\nconst dismissOnClose = (onCancel?: () => void) => (open: boolean) => { if (!open) onCancel?.() }\n\n// Mode-keyed remount canonical(2026-05-05):view↔edit 切換時,因 React reconciliation 同 type 同\n// position 會重用 instance,導致 `useState(defaultOpen)` 只在首次 mount 跑(那時 mode='view'\n// defaultOpen 沒給→預設 false)。後續 mode='edit' 即使傳 defaultOpen=true 也無效。\n// Fix:`key={mode}` 強制 React unmount + remount,每次切 mode 都重跑 useState init。\n// 對齊 Notion / Airtable cell-as-input「view 跟 edit 是不同 mount cycle」語義。\n\nfunction DateCell({ value, meta, mode, size, onCommit, onCancel }: CellComponentProps) {\n if (mode === 'view') {\n return (\n <DatePicker\n key=\"view\"\n variant=\"naked\"\n mode=\"view\"\n value={value as string \| null}\n size={size}\n formatOptions={meta?.formatOptions}\n locale={meta?.locale}\n // 2026-07-08 user 拍板 A 案(推翻 2026-05-10/06-26 兩次拍板,per 6 家 benchmark 6/6 共識\n // Ant/MUI X/AG Grid/Atlaskit/Notion/Airtable:view 態零恆顯型別 icon;editable\n // affordance 統一 = hover outline(field.spec.md L4)。showDisplayEndIcon 不再傳\n //(prop 保留為 spreadsheet-flavored 消費端 opt-in 逃生門,見 field.spec.md L6)。\n />\n )\n }\n return (\n <DatePicker\n key=\"edit\"\n autoFocus\n variant=\"naked\"\n size={sizeForInput(size)}\n value={typeof value === 'string' ? value : null}\n showTime={meta?.includeTime === true}\n onChange={(v) => onCommit?.(v)}\n defaultOpen\n onOpenChange={dismissOnClose(onCancel)}\n />\n )\n}\n\nfunction TimeCell({ value, meta, mode, size, onCommit, onCancel }: CellComponentProps) {\n if (mode === 'view') {\n return (\n <TimePicker\n key=\"view\"\n variant=\"naked\"\n mode=\"view\"\n value={value as string \| null}\n size={size}\n formatOptions={meta?.formatOptions}\n locale={meta?.locale}\n // showDisplayEndIcon 不傳 — 2026-07-08 A 案:view 態零恆顯 icon(同 DateCell 註)\n />\n )\n }\n return (\n <TimePicker\n key=\"edit\"\n variant=\"naked\"\n size={sizeForInput(size)}\n value={typeof value === 'string' ? value : null}\n showSeconds={meta?.showSeconds === true}\n minuteStep={meta?.minuteStep}\n secondStep={meta?.secondStep}\n onChange={(v) => onCommit?.(v)}\n defaultOpen\n onOpenChange={dismissOnClose(onCancel)}\n />\n )\n}\n\nfunction SelectCell({ value, meta, mode, size, onCommit, onCancel }: CellComponentProps) {\n // View canonical(2026-05-05):cell IS variant,default plain text(no Tag pill 疊在 cell border 內)。\n // Consumer 可在 column meta.display='tag' opt-in 內容導向的 Tag 視覺(category 含色彩標籤等)。\n // 對齊 JTable / AG Grid「renderer/editor 視覺一致」canonical。\n const displayMode = (meta?.display as 'plain' \| 'tag' \| undefined) ?? 'plain'\n if (mode === 'view') {\n return (\n <Select\n key=\"view\"\n variant=\"naked\"\n mode=\"view\"\n value={value as string \| null}\n options={meta?.options ?? []}\n size={size}\n display={displayMode}\n // showDisplayEndIcon 不傳 — 2026-07-08 A 案:view 態零恆顯 icon(同 DateCell 註)\n selectedItemRenderer={meta?.selectedItemRenderer} // 2026-07-08 WM 戰役:status 類彩色 cell 顯示通道\n />\n )\n }\n return (\n <Select\n key=\"edit\"\n autoFocus\n variant=\"naked\"\n size={sizeForInput(size)}\n selectedItemRenderer={meta?.selectedItemRenderer}\n options={meta?.options ?? []}\n value={value as string \| null \| undefined}\n onChange={(v) => onCommit?.(v)}\n // B7(2026-05-05):cell 編輯時支援 inline search,沿用 Select.searchable 機制(對齊 cell-as-input\n // 「沿用既有輸入框互動」原則)。Default false,consumer 在 meta.searchable 開啟。\n searchable={meta?.searchable === true}\n display={displayMode}\n defaultOpen\n onOpenChange={dismissOnClose(onCancel)}\n />\n )\n}\n\nfunction MultiSelectCell({ value, meta, mode, size, autoRowHeight, onCommitLive, onCancel }: CellComponentProps) {\n const wrap = autoRowHeight && meta?.wrap === true\n if (mode === 'view') {\n return (\n <Combobox\n key=\"view\"\n variant=\"naked\"\n mode=\"view\"\n value={(value as string[] \| null) ?? []}\n options={meta?.options ?? []}\n wrap={wrap}\n size={size}\n // showDisplayEndIcon 不傳 — 2026-07-08 A 案:view 態零恆顯 icon(同 DateCell 註)\n />\n )\n }\n // Multi 用 onCommitLive(commit 但不 exit edit)— 每勾一項即時生效,popover 持續開\n // 直到點外面;onOpenChange(false) → onCancel exit edit。對齊 Notion / Linear / Airtable canonical。\n return (\n <Combobox\n key=\"edit\"\n variant=\"naked\"\n size={sizeForInput(size)}\n options={meta?.options ?? []}\n value={Array.isArray(value) ? (value as string[]) : []}\n onChange={(v) => onCommitLive?.(v)}\n defaultOpen\n onOpenChange={dismissOnClose(onCancel)}\n />\n )\n}\n\nfunction PersonCell({ value, mode, size, onCommit, onCancel, meta }: CellComponentProps) {\n if (mode === 'view') {\n // 2026-07-08 A 案:view 態零恆顯 icon(同 DateCell 註)\n return <PeoplePicker key=\"view\" variant=\"naked\" mode=\"view\" value={value as PersonValue \| null} size={size} />\n }\n return (\n <PeoplePicker\n key=\"edit\"\n variant=\"naked\"\n size={sizeForInput(size)}\n value={value as PersonValue \| null}\n people={meta?.people ?? []}\n // PeoplePicker onChange 永遠 emit array(API contract);single mode commit 取首位\n onChange={(next) => onCommit?.(next[0] ?? null)}\n defaultOpen\n onOpenChange={dismissOnClose(onCancel)}\n />\n )\n}\n\nfunction MultiPersonCell({ value, mode, size, onCommitLive, onCancel, meta }: CellComponentProps) {\n if (mode === 'view') {\n // 2026-07-08 A 案:view 態零恆顯 icon(同 DateCell 註)\n return <PeoplePicker key=\"view\" variant=\"naked\" mode=\"view\" value={(value as PersonValue[]) ?? []} size={size} />\n }\n // Multi 用 onCommitLive(commit 但不 exit edit)— 每勾一人即時生效,popover 持續開\n // 直到點外面;onOpenChange(false) → onCancel exit edit。對齊 multiSelect canonical。\n return (\n <PeoplePicker\n key=\"edit\"\n variant=\"naked\"\n size={sizeForInput(size)}\n value={Array.isArray(value) ? (value as PersonValue[]) : []}\n people={meta?.people ?? []}\n onChange={(next) => onCommitLive?.(next)}\n defaultOpen\n onOpenChange={dismissOnClose(onCancel)}\n />\n )\n}\n\nfunction BooleanCell({ value, mode, meta, size, isEditable, onCommit }: CellComponentProps) {\n // boolean 不分 read/edit mode — view 渲 mode='view' 純展示;editable 時直接 toggle Checkbox。\n // 不可編(!isEditable)→ 走 view branch,Checkbox mode=\"view\" 純展示不接 onCheckedChange。\n if (mode === 'view' && !isEditable) {\n // size 傳入 → boolean 值 icon(Check/X)@lg 縮放對齊其他 cell(對齊 editable 分支同 size 邏輯)\n return <Checkbox variant=\"naked\" size={size === 'lg' ? 'lg' : 'md'} mode=\"view\" checked={value === true} />\n }\n return (\n <Checkbox\n size={size === 'lg' ? 'lg' : 'md'}\n checked={value === true}\n onCheckedChange={(checked) => onCommit?.(checked === true)}\n aria-label={meta?.ariaLabel ?? '切換'}\n />\n )\n}\n\n/\n UrlCell(2026-07-14 docblock 對齊實作):\n * view branch = `<LinkInput mode=\"view\">`(URL parse / hostname\n * 顯示一致性 SSOT);editable 互動:hover 時右側出 Pencil 鈕 → 進 edit(保留 link click 語意)。\n * edit branch = plain `<Input variant=\"naked\">`(LinkInput edit 的 controlled value 衝突\n * revert,詳下方 edit branch 註解);URL 驗證 deferred 到 onCommit(consumer 端 validate)。\n /\nfunction UrlCell({ value, meta, mode, size, isEditable, onRequestEdit, onCommit, onCancel }: CellComponentProps) {\n if (mode === 'view') {\n // showDisplayEndIcon ← D path Phase 2(2026-05-08):Field naked wrapper 包 anchor,與 Input edit 同 chrome。\n // LinkInput 此 prop = wrapper-only(無 icon,field.spec.md L6 例外)→ A 案(2026-07-08)不撤;\n // 但修 I1:原無條件 true 違反「= isEditable」knob 等式(field-controls.spec.md cell 例外),改等式。\n const display = (\n <LinkInput variant=\"naked\" mode=\"view\" value={value as string \| null} label={meta?.linkLabel} size={size} showDisplayEndIcon={isEditable === true} />\n )\n // 不可編 URL 不顯 Pencil affordance(純 view 顯示連結,無編輯入口)\n if (!isEditable) return display\n // editable read mode:hover Pencil 鈕(對齊 spec 第十二段「url:read = 連結 + Pencil」)\n return (\n <span className=\"group/cell relative flex items-center w-full\"> {/ @naked-row-mode-allow: URL hover-Pencil 是 inline action 不是 value content,items-center 鎖 Pencil 對齊行高第一行(autoRow 跟 fixed 皆同視覺正確) /}\n <span className=\"flex-1 min-w-0\">{display}</span>\n <Button\n variant=\"tertiary\"\n size=\"xs\"\n iconOnly\n startIcon={Pencil}\n aria-label=\"編輯連結\"\n className={cn('ml-1 opacity-0 group-hover/cell:opacity-100 transition-opacity')}\n onClick={(e) => {\n e.stopPropagation()\n onRequestEdit?.()\n }}\n />\n </span>\n )\n }\n // edit mode value pre-fill canonical(2026-05-05):LinkInput edit `value` prop 強制 controlled\n // (line 113 `useState(value ?? '')`)+ `showLink = !editing && hasValidValue` 預設顯 link 不顯 input\n // → cell-as-input editing 場景需要 input 直接 focus 編輯。改用 plain `<Input>`(uncontrolled\n // `defaultValue` 正確 pre-fill,Input.tsx `value={value}` 是 undefined → uncontrolled 走 defaultValue)。\n // URL 驗證等 deferred 到 commit phase(consumer 可在 onCommit 時 validate)。\n return (\n <Input\n autoFocus\n variant=\"naked\"\n size={sizeForInput(size)}\n defaultValue={value != null ? String(value) : ''}\n onBlur={(e) => onCommit?.(e.target.value)}\n onKeyDown={makeKeyHandler(onCommit, onCancel)}\n />\n )\n}\n\n// ── Registry ────────────────────────────────────────────────────────────────\n//\n// type → cell component。新增 columnType 必同步註冊一條(否則 fallback 到 string)。\n\nexport const cellRegistry: Record<ColumnType, ComponentType<CellComponentProps>> = {\n string: StringCell,\n number: NumberCell,\n currency: NumberCell, // 共用 NumberCell — currency-ness 走 meta.type 判 prefix='$'\n date: DateCell,\n time: TimeCell,\n select: SelectCell,\n multiSelect: MultiSelectCell,\n person: PersonCell,\n multiPerson: MultiPersonCell,\n boolean: BooleanCell,\n url: UrlCell,\n}\n\n/* Resolve cell component by type;default = StringCell(consumer 沒設 type 的 fallback)。\n * 2026-05-12 Stream C Cluster B fix:wrap with FieldSurfaceProvider `surface='table-cell'`\n * 讓所有 Cell 內的 Field family controls 透過 `useFieldSurface()` 取得「我在 cell 裡」context,\n * 取代散落的 `variant === 'naked'` cell-detection heuristic + per-prop hardcoded padding。\n \n 2026-05-13 (a) perf fix(user 拍板 + codex V1 verdict + Layer A grep root cause):\n * 原 factory pattern 每次 call 在 function body 內宣告新 `CellWithSurface` FC closure → 每 scroll\n * × 每 visible cell 都 return 新 FC reference → React 認 component type 變,*整 subtree mount/\n unmount cascade*(Field + ItemPrefix/Suffix + Avatar / Tag / PersonDisplay)。\n Fix:每 ColumnType module-level 預建 wrapped FC + `React.memo`,resolve 走 cached map,\n * identity stable across scroll → memo 真生效 + subtree 不 mount/unmount。\n * Cite world-class:AG Grid「cell renderer per-type stable reference」/ MUI X DataGrid「memoized\n * subcomponents」/ Glide Data Grid「DOM virtualization 加解掛 = bottleneck」。 /\nconst cellWithSurfaceCache = new Map<ColumnType \| '_default_', ComponentType<CellComponentProps>>()\n\nfunction buildCellWithSurface(Inner: ComponentType<CellComponentProps>, key: string): ComponentType<CellComponentProps> {\n const CellWithSurface = React.memo(function CellWithSurface(props: CellComponentProps) {\n return (\n <FieldSurfaceProvider surface=\"table-cell\">\n {/ 2026-06-08:把 table-density size 經獨立 surface-size context 注給 child Field controls,\n 漏傳 size 的 cell 也自動繼承(根治「新 cell 漏傳 size」class);size primitive 不破壞 memo identity。/}\n <FieldSurfaceSizeProvider size={props.size}>\n {/ 2026-07-08 user 拍板:cell 可編輯訊號經獨立 boolean context 注給 child Field controls,\n 讓 useFieldEmptyDisplay 分流「可編輯 cell 空 view → 空白」vs「不可編輯 cell → '-'」。\n boolean primitive 不破壞 memo identity(同 size context)。 */}\n <FieldSurfaceEditableProvider isEditable={props.isEditable ?? false}>\n <Inner {...props} />\n </FieldSurfaceEditableProvider>\n </FieldSurfaceSizeProvider>\n </FieldSurfaceProvider>\n )\n })\n ;(CellWithSurface as { displayName?: string }).displayName = `CellWithSurface(${key})`\n return CellWithSurface as ComponentType<CellComponentProps>\n}\n\n// Pre-build per-type cached wrapped components(module-level,one-time init)\nfor (const type of Object.keys(cellRegistry) as ColumnType[]) {\n cellWithSurfaceCache.set(type, buildCellWithSurface(cellRegistry[type], type))\n}\ncellWithSurfaceCache.set('_default_', buildCellWithSurface(StringCell, 'StringCell-fallback'))\n\nexport function resolveCellComponent(type?: ColumnType): ComponentType<CellComponentProps> {\n return cellWithSurfaceCache.get(type ?? '_default_') ?? cellWithSurfaceCache.get('_default_')!\n}\n"],"names":["InputPublic","TextareaPublic","NumberInputPublic","SelectPublic","ComboboxPublic","DatePickerPublic","TimePickerPublic","PeoplePickerPublic","LinkInputPublic","CheckboxPublic","CellWithSurface"],"mappings":"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"}

package/dist/components/DataTable/data-table-filter-group.d.ts CHANGED Viewed

@@ -1,6 +1,7 @@
 import { type SelectOption } from '../../components/Select/select';
 import type { ColumnType } from './column-types';
 import type { Conjunction, FilterCondition, FilterGroup } from './filter-tree';
+import type { DataTableFilterPanelLabels } from './data-table-filter-labels';
 export interface FilterColumn {
     id: string;
     label: string;
@@ -19,7 +20,7 @@ export interface FilterColumn {
 }
 export declare function getDefaultOperator(type?: ColumnType): string;
 export declare const datePrecisionOf: (col: FilterColumn | undefined) => "day" | "ms" | undefined;
-export declare function FilterRow({ index, condition, conjunction, filterableColumns, fieldOptions, onChangeConjunction, onChangeField, onChangeOp, onChangeValue, onRemove, }: {
+export declare function FilterRow({ index, condition, conjunction, filterableColumns, fieldOptions, onChangeConjunction, onChangeField, onChangeOp, onChangeValue, onRemove, labels, }: {
     index: number;
     condition: FilterCondition;
     conjunction: Conjunction;
@@ -30,8 +31,9 @@ export declare function FilterRow({ index, condition, conjunction, filterableCol
     onChangeOp: (v: string) => void;
     onChangeValue: (v: unknown) => void;
     onRemove: () => void;
+    labels: DataTableFilterPanelLabels;
 }): import("react/jsx-runtime").JSX.Element;
-export declare function GroupBlock({ index, group, rootConjunction, filterableColumns, fieldOptions, onChangeRootConjunction, onChangeGroupConjunction, onChangeCondition, onRemoveCondition, onAddCondition, onRemoveGroup, }: {
+export declare function GroupBlock({ index, group, rootConjunction, filterableColumns, fieldOptions, onChangeRootConjunction, onChangeGroupConjunction, onChangeCondition, onRemoveCondition, onAddCondition, onRemoveGroup, canAddCondition, labels, }: {
     index: number;
     group: FilterGroup;
     rootConjunction: Conjunction;
@@ -43,5 +45,7 @@ export declare function GroupBlock({ index, group, rootConjunction, filterableCo
     onRemoveCondition: (condId: string) => void;
     onAddCondition: () => void;
     onRemoveGroup: () => void;
+    canAddCondition: boolean;
+    labels: DataTableFilterPanelLabels;
 }): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=data-table-filter-group.d.ts.map

package/dist/components/DataTable/data-table-filter-group.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"data-table-filter-group.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/data-table-filter-group.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAAU,KAAK,YAAY,EAAE,MAAM,0CAA0C,CAAA;AAEpF,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAQhD,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;~~AAK9E~~,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,UAAU,CAAA;IAChB,OAAO,CAAC,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IACjD,yFAAyF;IACzF,MAAM,CAAC,EAAE,KAAK,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,WAAW,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IAC1E,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB;~~AAOD~~,wBAAgB,kBAAkB,CAAC,IAAI,CAAC,EAAE,UAAU,GAAG,MAAM,CAE5D;AAID,eAAO,MAAM,eAAe,GAAI,KAAK,YAAY,GAAG,SAAS,KAAG,KAAK,GAAG,IAAI,GAAG,SACV,CAAA;~~AA0CrE~~,wBAAgB,SAAS,CAAC,EACxB,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,iBAAiB,EAAE,YAAY,EAC9D,mBAAmB,EAAE,aAAa,EAAE,UAAU,EAAE,aAAa,EAAE,QAAQ,~~GACxE~~,EAAE;IACD,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,EAAE,eAAe,CAAA;IAC1B,WAAW,EAAE,WAAW,CAAA;IACxB,iBAAiB,EAAE,YAAY,EAAE,CAAA;IACjC,YAAY,EAAE,YAAY,EAAE,CAAA;IAC5B,mBAAmB,EAAE,CAAC,CAAC,EAAE,WAAW,KAAK,IAAI,CAAA;IAC7C,aAAa,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,UAAU,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IAC/B,aAAa,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAA;IACnC,QAAQ,EAAE,MAAM,IAAI,CAAA;~~CACrB~~,~~2CAgEA~~;AAID,wBAAgB,UAAU,CAAC,EACzB,KAAK,EAAE,KAAK,EAAE,eAAe,EAAE,iBAAiB,EAAE,YAAY,EAC9D,uBAAuB,EAAE,wBAAwB,EACjD,iBAAiB,EAAE,iBAAiB,EAAE,cAAc,EAAE,aAAa,~~GACpE~~,EAAE;IACD,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,WAAW,CAAA;IAClB,eAAe,EAAE,WAAW,CAAA;IAC5B,iBAAiB,EAAE,YAAY,EAAE,CAAA;IACjC,YAAY,EAAE,YAAY,EAAE,CAAA;IAC5B,uBAAuB,EAAE,CAAC,CAAC,EAAE,WAAW,KAAK,IAAI,CAAA;IACjD,wBAAwB,EAAE,CAAC,CAAC,EAAE,WAAW,KAAK,IAAI,CAAA;IAClD,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,CAAC,eAAe,CAAC,KAAK,IAAI,CAAA;IAC5E,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IAC3C,cAAc,EAAE,MAAM,IAAI,CAAA;IAC1B,aAAa,EAAE,MAAM,IAAI,CAAA;~~CAC1B~~,~~2CAoCA~~"}
1	+ {"version":3,"file":"data-table-filter-group.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/data-table-filter-group.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAAU,KAAK,YAAY,EAAE,MAAM,0CAA0C,CAAA;AAEpF,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAQhD,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAE9E,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,4BAA4B,CAAA;AAI5E,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,UAAU,CAAA;IAChB,OAAO,CAAC,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IACjD,yFAAyF;IACzF,MAAM,CAAC,EAAE,KAAK,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,WAAW,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IAC1E,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB;AAUD,wBAAgB,kBAAkB,CAAC,IAAI,CAAC,EAAE,UAAU,GAAG,MAAM,CAE5D;AAID,eAAO,MAAM,eAAe,GAAI,KAAK,YAAY,GAAG,SAAS,KAAG,KAAK,GAAG,IAAI,GAAG,SACV,CAAA;AA6CrE,wBAAgB,SAAS,CAAC,EACxB,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,iBAAiB,EAAE,YAAY,EAC9D,mBAAmB,EAAE,aAAa,EAAE,UAAU,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,GAChF,EAAE;IACD,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,EAAE,eAAe,CAAA;IAC1B,WAAW,EAAE,WAAW,CAAA;IACxB,iBAAiB,EAAE,YAAY,EAAE,CAAA;IACjC,YAAY,EAAE,YAAY,EAAE,CAAA;IAC5B,mBAAmB,EAAE,CAAC,CAAC,EAAE,WAAW,KAAK,IAAI,CAAA;IAC7C,aAAa,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,UAAU,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IAC/B,aAAa,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAA;IACnC,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,MAAM,EAAE,0BAA0B,CAAA;CACnC,2CAiEA;AAID,wBAAgB,UAAU,CAAC,EACzB,KAAK,EAAE,KAAK,EAAE,eAAe,EAAE,iBAAiB,EAAE,YAAY,EAC9D,uBAAuB,EAAE,wBAAwB,EACjD,iBAAiB,EAAE,iBAAiB,EAAE,cAAc,EAAE,aAAa,EACnE,eAAe,EAAE,MAAM,GACxB,EAAE;IACD,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,WAAW,CAAA;IAClB,eAAe,EAAE,WAAW,CAAA;IAC5B,iBAAiB,EAAE,YAAY,EAAE,CAAA;IACjC,YAAY,EAAE,YAAY,EAAE,CAAA;IAC5B,uBAAuB,EAAE,CAAC,CAAC,EAAE,WAAW,KAAK,IAAI,CAAA;IACjD,wBAAwB,EAAE,CAAC,CAAC,EAAE,WAAW,KAAK,IAAI,CAAA;IAClD,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,CAAC,eAAe,CAAC,KAAK,IAAI,CAAA;IAC5E,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IAC3C,cAAc,EAAE,MAAM,IAAI,CAAA;IAC1B,aAAa,EAAE,MAAM,IAAI,CAAA;IACzB,eAAe,EAAE,OAAO,CAAA;IACxB,MAAM,EAAE,0BAA0B,CAAA;CACnC,2CAyCA"}

package/dist/components/DataTable/data-table-filter-group.js CHANGED Viewed

@@ -5,39 +5,39 @@ import { Select } from "../Select/select.js";
 import { FieldControlGroup } from "../FieldControlGroup/field-control-group.js";
 import { DEFAULT_OPERATOR, getOperatorSpec, getValueShape, OPERATOR_REGISTRY } from "./filter-operators.js";
 import { FilterValuePicker } from "./data-table-filter-value-picker.js";
-function getOperatorOptions(type) {
+function getOperatorOptions(type, operatorLabels) {
   const registry = type && OPERATOR_REGISTRY[type] ? OPERATOR_REGISTRY[type] : OPERATOR_REGISTRY.string;
-  return registry.map((op) => ({ value: op.op, label: op.label }));
+  return registry.map((op) => ({ value: op.op, label: operatorLabels[op.op] ?? op.label }));
 }
 function getDefaultOperator(type) {
   return type && DEFAULT_OPERATOR[type] || DEFAULT_OPERATOR.string;
 }
 const datePrecisionOf = (col) => (col == null ? void 0 : col.type) === "date" ? col.includeTime ? "ms" : "day" : void 0;
-const CONJ_OPTIONS = [
-  { value: "and", label: "And" },
-  { value: "or", label: "Or" }
-];
 function ConjunctionLabel({
   index,
   conjunction,
-  onChange
+  onChange,
+  labels
 }) {
   if (index === 0) {
-    return /* @__PURE__ */ jsx("div", { className: "w-20 shrink-0 text-body text-fg-muted px-[var(--field-px)] self-center", children: "Where" });
+    return /* @__PURE__ */ jsx("div", { className: "w-20 shrink-0 text-body text-fg-secondary px-[var(--field-px)] self-center", children: labels.where });
   }
   if (index >= 2) {
-    const label = conjunction === "and" ? "And" : "Or";
-    return /* @__PURE__ */ jsx("div", { className: "w-20 shrink-0 text-body text-fg-muted px-[var(--field-px)] self-center", children: label });
+    const label = conjunction === "and" ? labels.and : labels.or;
+    return /* @__PURE__ */ jsx("div", { className: "w-20 shrink-0 text-body text-fg-secondary px-[var(--field-px)] self-center", children: label });
   }
   return /* @__PURE__ */ jsx("div", { className: "w-20 shrink-0", children: /* @__PURE__ */ jsx(
     Select,
     {
       size: "sm",
-      options: CONJ_OPTIONS,
+      options: [
+        { value: "and", label: labels.and },
+        { value: "or", label: labels.or }
+      ],
       value: conjunction,
       onChange: (v) => onChange(v),
       minRows: 2,
-      "aria-label": "連接詞 — 同 group 共用"
+      "aria-label": labels.conjunctionAriaLabel
     }
   ) });
 }
@@ -51,27 +51,28 @@ function FilterRow({
   onChangeField,
   onChangeOp,
   onChangeValue,
-  onRemove
+  onRemove,
+  labels
 }) {
   const colInfo = filterableColumns.find((c) => c.id === condition.field);
-  const operatorOptions = getOperatorOptions(colInfo == null ? void 0 : colInfo.type);
+  const operatorOptions = getOperatorOptions(colInfo == null ? void 0 : colInfo.type, labels.operatorLabels);
   const hasField = !!condition.field;
   const opSpec = colInfo ? getOperatorSpec(colInfo.type, condition.op) : null;
   const valueShape = colInfo && opSpec ? getValueShape(opSpec, colInfo.type, colInfo.includeTime) : null;
   const hasValueCell = valueShape !== "none";
   return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-    /* @__PURE__ */ jsx(ConjunctionLabel, { index, conjunction, onChange: onChangeConjunction }),
+    /* @__PURE__ */ jsx(ConjunctionLabel, { index, conjunction, onChange: onChangeConjunction, labels }),
     /* @__PURE__ */ jsxs(FieldControlGroup, { block: true, className: "flex-1 min-w-0", children: [
       /* @__PURE__ */ jsx(
         Select,
         {
-          className: "!w-[var(--data-table-filter-field-width)] flex-shrink-0",
+          className: "!w-[var(--data-table-filter-field-width)] flex-shrink-0 [&_.text-fg-muted]:!text-fg-secondary",
           size: "sm",
           options: fieldOptions,
           value: condition.field,
           onChange: onChangeField,
-          placeholder: "選擇欄位",
-          "aria-label": "篩選欄位"
+          placeholder: labels.fieldPlaceholder,
+          "aria-label": labels.fieldAriaLabel
         }
       ),
       /* @__PURE__ */ jsx(
@@ -83,8 +84,8 @@ function FilterRow({
           value: condition.op,
           onChange: onChangeOp,
           disabled: !hasField,
-          placeholder: "運算子",
-          "aria-label": "篩選運算子"
+          placeholder: labels.operatorPlaceholder,
+          "aria-label": labels.operatorAriaLabel
         }
       ),
       hasValueCell && /* @__PURE__ */ jsx(
@@ -95,12 +96,13 @@ function FilterRow({
           onChange: onChangeValue,
           colInfo,
           disabled: !hasField,
-          ariaLabel: colInfo ? `${colInfo.label} 篩選值` : "篩選值",
+          ariaLabel: labels.filterValueAriaLabel(colInfo == null ? void 0 : colInfo.label),
+          labels,
           className: "!flex-1 !min-w-0"
         }
       )
     ] }),
-    /* @__PURE__ */ jsx(Button, { variant: "text", size: "sm", iconOnly: true, startIcon: Trash2, "aria-label": "刪除", onClick: onRemove })
+    /* @__PURE__ */ jsx(Button, { variant: "text", size: "sm", iconOnly: true, startIcon: Trash2, "aria-label": labels.deleteCondition, onClick: onRemove })
   ] });
 }
 function GroupBlock({
@@ -114,10 +116,12 @@ function GroupBlock({
   onChangeCondition,
   onRemoveCondition,
   onAddCondition,
-  onRemoveGroup
+  onRemoveGroup,
+  canAddCondition,
+  labels
 }) {
   return /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-2", children: [
-    /* @__PURE__ */ jsx("div", { className: "pt-2", children: /* @__PURE__ */ jsx(ConjunctionLabel, { index, conjunction: rootConjunction, onChange: onChangeRootConjunction }) }),
+    /* @__PURE__ */ jsx("div", { className: "pt-2", children: /* @__PURE__ */ jsx(ConjunctionLabel, { index, conjunction: rootConjunction, onChange: onChangeRootConjunction, labels }) }),
     /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0 rounded-md bg-muted p-2 flex flex-col gap-2", children: [
       group.children.map((cond, cIdx) => /* @__PURE__ */ jsx(
         FilterRow,
@@ -134,13 +138,14 @@ function GroupBlock({
           },
           onChangeOp: (v) => onChangeCondition(cond.id, { op: v, value: "" }),
           onChangeValue: (v) => onChangeCondition(cond.id, { value: v }),
-          onRemove: () => onRemoveCondition(cond.id)
+          onRemove: () => onRemoveCondition(cond.id),
+          labels
         },
         cond.id
       )),
       /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
-        /* @__PURE__ */ jsx(Button, { variant: "text", size: "sm", startIcon: Plus, onClick: onAddCondition, children: "加入巢狀篩選" }),
-        group.children.length === 0 && /* @__PURE__ */ jsx(Button, { variant: "text", size: "sm", startIcon: Trash2, danger: true, onClick: onRemoveGroup, children: "移除空群組" })
+        /* @__PURE__ */ jsx(Button, { variant: "text", size: "sm", startIcon: Plus, onClick: onAddCondition, disabled: !canAddCondition, children: labels.addNestedFilter }),
+        group.children.length === 0 && /* @__PURE__ */ jsx(Button, { variant: "text", size: "sm", startIcon: Trash2, danger: true, onClick: onRemoveGroup, children: labels.removeEmptyGroup })
       ] })
     ] })
   ] });

package/dist/components/DataTable/data-table-filter-group.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"data-table-filter-group.js","sources":["../../../src/components/DataTable/data-table-filter-group.tsx"],"sourcesContent":["// @benchmark-unverified-blanket: file-level retraction per M22 (d) — claims herein not individually URL-cited; treat as unverified visual/usage rumor unless retrofit per-claim. Hook escape preserved(2026-07-14 自 data-table-filter-panel.tsx 拆檔搬移,原檔級 escape 隨段落帶入)。\n// @internal — DS-internal 單元(filter row / nested-group renderer + 共用 column/operator\n// helpers;GroupBlock 為 nested-group renderer,FilterRow / ConjunctionLabel 為其 row 構件、\n// flat mode 共用。只被 data-table-filter-panel.tsx 消費);不隨 index.ts re-export 進 npm public surface。\n// ────────────────────────────── 消費的 SSOT ──────────────────────────────\n// - FieldControlGroup:field + op + value border-collapse 接合(field-control-group.spec.md;\n// FilterValuePicker 為 direct child,className forward 不開 wrapper div — 2026-05-04 #2 fix)\n// - Button(variant=\"text\" iconOnly)row meta trash / Select(size=\"sm\")conjunction・field・op\n// (data-table.spec.md「四、UI canonical」:trash = form-control row text Button;A6 conjunction)\n// - Width tokens:--data-table-filter-field-width / --data-table-filter-op-width(uiSize.css SSOT,\n// 2026-05-23 Phase A.4 Decision 2)\n// - Operator SSOT:./filter-operators.ts OPERATOR_REGISTRY(禁 hardcode op 字串)\n// - Group container 灰底 bg-muted:color.spec.md L651-654 靜態低重要 surface semantic(2026-05-09 Q3 A)\n// 設計規則:./filter-operators.spec.md + ./data-table.spec.md「進階篩選」段\n\nimport { Plus, Trash2 } from 'lucide-react'\nimport { Button } from '@/design-system/components/Button/button'\nimport { Select, type SelectOption } from '@/design-system/components/Select/select'\nimport { FieldControlGroup } from '@/design-system/components/FieldControlGroup/field-control-group'\nimport type { ColumnType } from './column-types'\nimport {\n OPERATOR_REGISTRY,\n DEFAULT_OPERATOR,\n getOperatorSpec,\n getValueShape,\n type ValueShape,\n} from './filter-operators'\nimport type { Conjunction, FilterCondition, FilterGroup } from './filter-tree'\nimport { FilterValuePicker } from './data-table-filter-value-picker'\n\n// ── Shared internal types + operator helpers(panel orchestration 也消費)────\n\nexport interface FilterColumn {\n id: string\n label: string\n type: ColumnType\n options?: Array<{ value: string; label: string }>\n /** People pool for person/multiPerson filter picker(對齊 cell-registry meta.people SSOT)/\n people?: Array<{ name: string; avatarUrl?: string; description?: string }>\n includeTime?: boolean\n}\n\nfunction getOperatorOptions(type?: ColumnType): SelectOption[] {\n const registry = type && OPERATOR_REGISTRY[type] ? OPERATOR_REGISTRY[type] : OPERATOR_REGISTRY.string\n return registry.map((op) => ({ value: op.op, label: op.label }))\n}\n\nexport function getDefaultOperator(type?: ColumnType): string {\n return (type && DEFAULT_OPERATOR[type]) \|\| DEFAULT_OPERATOR.string\n}\n\n// Q6(2026-07-04):date 欄位把比對精度寫進 condition(includeTime=true → ms,否則 day)。\n// 'time' 欄暫不寫(值非完整日期,truncate 語意不成立;見 filter-operators.spec v3 time 註)。\nexport const datePrecisionOf = (col: FilterColumn \| undefined): 'day' \| 'ms' \| undefined =>\n col?.type === 'date' ? (col.includeTime ? 'ms' : 'day') : undefined\n\n// ── ConjunctionLabel ───────────────────────────────────────────────────\n\nconst CONJ_OPTIONS: SelectOption[] = [\n { value: 'and', label: 'And' },\n { value: 'or', label: 'Or' },\n]\n\nfunction ConjunctionLabel({\n index, conjunction, onChange,\n}: { index: number; conjunction: Conjunction; onChange: (c: Conjunction) => void }) {\n // index === 0:首 row 顯示靜態「Where」label\n // index === 1:唯一可改的 AND/OR Select(連動整 group conjunction)\n // index ≥ 2:被連動的 row,read-only 顯示當前 conjunction 文字(同 Where 視覺,A6 canonical)\n // 對齊 Airtable / Notion / Linear 共識 @benchmark-unverified(non-OSS)\n // px-[var(--field-px)] 對齊 Field 內部 padding 12px(Q13)\n if (index === 0) {\n return <div className=\"w-20 shrink-0 text-body text-fg-muted px-[var(--field-px)] self-center\">Where</div>\n }\n if (index >= 2) {\n const label = conjunction === 'and' ? 'And' : 'Or'\n return <div className=\"w-20 shrink-0 text-body text-fg-muted px-[var(--field-px)] self-center\">{label}</div>\n }\n // index === 1:可切換的 AND/OR Select\n // minRows={2} — And/Or 2 選項,顯式縮 menu 高度避免 reserve 3 row 空白(Q5)\n return (\n <div className=\"w-20 shrink-0\">\n <Select\n size=\"sm\"\n options={CONJ_OPTIONS}\n value={conjunction}\n onChange={(v) => onChange(v as Conjunction)}\n minRows={2}\n aria-label=\"連接詞 — 同 group 共用\"\n />\n </div>\n )\n}\n\n// ── FilterRow(flat 用 + group 內共用) ──────────────────────────────\n\nexport function FilterRow({\n index, condition, conjunction, filterableColumns, fieldOptions,\n onChangeConjunction, onChangeField, onChangeOp, onChangeValue, onRemove,\n}: {\n index: number\n condition: FilterCondition\n conjunction: Conjunction\n filterableColumns: FilterColumn[]\n fieldOptions: SelectOption[]\n onChangeConjunction: (c: Conjunction) => void\n onChangeField: (v: string) => void\n onChangeOp: (v: string) => void\n onChangeValue: (v: unknown) => void\n onRemove: () => void\n}) {\n const colInfo = filterableColumns.find((c) => c.id === condition.field)\n const operatorOptions = getOperatorOptions(colInfo?.type)\n const hasField = !!condition.field\n const opSpec = colInfo ? getOperatorSpec(colInfo.type, condition.op) : null\n const valueShape: ValueShape \| null = colInfo && opSpec\n ? getValueShape(opSpec, colInfo.type, colInfo.includeTime)\n : null\n // op 'is_set' / 'is_not_set' 等 shape='none' → 無 value cell,op 自動 expand 填剩餘寬\n // 對齊 Notion / Airtable / Linear filter row 行為\n // 注意:valueShape=null(初始無 field 選)時仍 render value cell(disabled placeholder)— 只 'none' 才 fold\n const hasValueCell = valueShape !== 'none'\n\n // FieldControlGroup 接合 field + op + value 視覺(2026-05-04 E refactor + 多輪 fix):\n // - border collapse 取代 3 顆獨立 Select 並排,對齊 Airtable / Linear / Notion filter row idiom\n // - ConjunctionLabel + Trash 在 group 外層(meta actions,不屬 control 一體)\n // - #5 fix:row 內水平 gap = `gap-2` (8px),layoutSpace 規則 5 緊密相關\n // - #9 fix:cell 用 `min-w-[]`(field 160 / op 120),value flex-1 min-w-0,讓 long label 可撐寬\n // - #2 fix:FilterValuePicker 直接是 FieldControlGroup direct child(無 wrapper div),CSS variants 命中正確\n return (\n <div className=\"flex items-center gap-2\">\n <ConjunctionLabel index={index} conjunction={conjunction} onChange={onChangeConjunction} />\n {/ #9 fix(2026-05-04 v4):Field controls trigger `w-full` override 外 className,改用 Tailwind `!`\n important 強制 override(`!w-[160px]` / `!w-[120px]`),value 用 `!flex-1 !min-w-0`。\n Select 元件本身沒 destructure `style` prop 所以 inline style flex-basis 行不通,只能用 className。 /}\n <FieldControlGroup block className=\"flex-1 min-w-0\">\n {/ 2026-05-23 Phase A.4 Decision 2:`!w-[160px]` / `!w-[120px]` → tokens\n `--data-table-filter-field-width` / `--data-table-filter-op-width`(SSOT in uiSize.css)\n Behavior preserved 完好如初:flat + nested 同 width(token 是 design constant) /}\n <Select\n className=\"!w-[var(--data-table-filter-field-width)] flex-shrink-0\"\n size=\"sm\"\n options={fieldOptions}\n value={condition.field}\n onChange={onChangeField}\n placeholder=\"選擇欄位\"\n aria-label=\"篩選欄位\"\n />\n <Select\n className={hasValueCell ? '!w-[var(--data-table-filter-op-width)] flex-shrink-0' : '!flex-1 !min-w-0'}\n size=\"sm\"\n options={operatorOptions}\n value={condition.op}\n onChange={onChangeOp}\n disabled={!hasField}\n placeholder=\"運算子\"\n aria-label=\"篩選運算子\"\n />\n {hasValueCell && (\n <FilterValuePicker\n shape={valueShape}\n value={condition.value}\n onChange={onChangeValue}\n colInfo={colInfo}\n disabled={!hasField}\n ariaLabel={colInfo ? `${colInfo.label} 篩選值` : '篩選值'}\n className=\"!flex-1 !min-w-0\"\n />\n )}\n </FieldControlGroup>\n {/ Trash 用 text Button — filter row 是 form-control row,Field 同高對齊(28 md) /}\n <Button variant=\"text\" size=\"sm\" iconOnly startIcon={Trash2} aria-label=\"刪除\" onClick={onRemove} />\n </div>\n )\n}\n\n// ── GroupBlock(nested 用) ────────────────────────────────────────────\n\nexport function GroupBlock({\n index, group, rootConjunction, filterableColumns, fieldOptions,\n onChangeRootConjunction, onChangeGroupConjunction,\n onChangeCondition, onRemoveCondition, onAddCondition, onRemoveGroup,\n}: {\n index: number\n group: FilterGroup\n rootConjunction: Conjunction\n filterableColumns: FilterColumn[]\n fieldOptions: SelectOption[]\n onChangeRootConjunction: (c: Conjunction) => void\n onChangeGroupConjunction: (c: Conjunction) => void\n onChangeCondition: (condId: string, patch: Partial<FilterCondition>) => void\n onRemoveCondition: (condId: string) => void\n onAddCondition: () => void\n onRemoveGroup: () => void\n}) {\n return (\n <div className=\"flex items-start gap-2\">\n <div className=\"pt-2\">\n <ConjunctionLabel index={index} conjunction={rootConjunction} onChange={onChangeRootConjunction} />\n </div>\n {/ Group container 灰底 — `bg-muted`(`--muted` neutral-2,user 2026-05-09 拍板 Q3 A)。對齊 color.spec.md L651-654 「table header / tab / code block / skeleton」靜態低重要 surface semantic /}\n <div className=\"flex-1 min-w-0 rounded-md bg-muted p-2 flex flex-col gap-2\">\n {group.children.map((cond, cIdx) => (\n <FilterRow\n key={cond.id}\n index={cIdx}\n condition={cond}\n conjunction={group.conjunction}\n filterableColumns={filterableColumns}\n fieldOptions={fieldOptions}\n onChangeConjunction={onChangeGroupConjunction}\n onChangeField={(v) => {\n const newCol = filterableColumns.find((c) => c.id === v)\n onChangeCondition(cond.id, { field: v, op: getDefaultOperator(newCol?.type), value: '', datePrecision: datePrecisionOf(newCol) })\n }}\n onChangeOp={(v) => onChangeCondition(cond.id, { op: v, value: '' })}\n onChangeValue={(v) => onChangeCondition(cond.id, { value: v })}\n onRemove={() => onRemoveCondition(cond.id)}\n />\n ))}\n {/ Q9 — text variant 對齊 inline 派 + 視覺輕量 */}\n <div className=\"flex items-center justify-between\">\n <Button variant=\"text\" size=\"sm\" startIcon={Plus} onClick={onAddCondition}>加入巢狀篩選</Button>\n {group.children.length === 0 && (\n <Button variant=\"text\" size=\"sm\" startIcon={Trash2} danger onClick={onRemoveGroup}>移除空群組</Button>\n )}\n </div>\n </div>\n </div>\n )\n}\n"],"names":[],"mappings":";;;;;;;AA0CA,SAAS,mBAAmB,MAAmC;AAC7D,QAAM,WAAW,QAAQ,kBAAkB,IAAI,IAAI,kBAAkB,IAAI,IAAI,kBAAkB;AAC/F,SAAO,SAAS,IAAI,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI,OAAO,GAAG,MAAA,EAAQ;AACjE;AAEO,SAAS,mBAAmB,MAA2B;AAC5D,SAAQ,QAAQ,iBAAiB,IAAI,KAAM,iBAAiB;AAC9D;AAIO,MAAM,kBAAkB,CAAC,SAC9B,2BAAK,UAAS,SAAU,IAAI,cAAc,OAAO,QAAS;AAI5D,MAAM,eAA+B;AAAA,EACnC,EAAE,OAAO,OAAO,OAAO,MAAA;AAAA,EACvB,EAAE,OAAO,MAAM,OAAO,KAAA;AACxB;AAEA,SAAS,iBAAiB;AAAA,EACxB;AAAA,EAAO;AAAA,EAAa;AACtB,GAAoF;AAMlF,MAAI,UAAU,GAAG;AACf,WAAO,oBAAC,OAAA,EAAI,WAAU,0EAAyE,UAAA,SAAK;AAAA,EACtG;AACA,MAAI,SAAS,GAAG;AACd,UAAM,QAAQ,gBAAgB,QAAQ,QAAQ;AAC9C,WAAO,oBAAC,OAAA,EAAI,WAAU,0EAA0E,UAAA,OAAM;AAAA,EACxG;AAGA,SACE,oBAAC,OAAA,EAAI,WAAU,iBACb,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,SAAS;AAAA,MACT,OAAO;AAAA,MACP,UAAU,CAAC,MAAM,SAAS,CAAgB;AAAA,MAC1C,SAAS;AAAA,MACT,cAAW;AAAA,IAAA;AAAA,EAAA,GAEf;AAEJ;AAIO,SAAS,UAAU;AAAA,EACxB;AAAA,EAAO;AAAA,EAAW;AAAA,EAAa;AAAA,EAAmB;AAAA,EAClD;AAAA,EAAqB;AAAA,EAAe;AAAA,EAAY;AAAA,EAAe;AACjE,GAWG;AACD,QAAM,UAAU,kBAAkB,KAAK,CAAC,MAAM,EAAE,OAAO,UAAU,KAAK;AACtE,QAAM,kBAAkB,mBAAmB,mCAAS,IAAI;AACxD,QAAM,WAAW,CAAC,CAAC,UAAU;AAC7B,QAAM,SAAS,UAAU,gBAAgB,QAAQ,MAAM,UAAU,EAAE,IAAI;AACvE,QAAM,aAAgC,WAAW,SAC7C,cAAc,QAAQ,QAAQ,MAAM,QAAQ,WAAW,IACvD;AAIJ,QAAM,eAAe,eAAe;AAQpC,SACE,qBAAC,OAAA,EAAI,WAAU,2BACb,UAAA;AAAA,IAAA,oBAAC,kBAAA,EAAiB,OAAc,aAA0B,UAAU,qBAAqB;AAAA,IAIzF,qBAAC,mBAAA,EAAkB,OAAK,MAAC,WAAU,kBAIjC,UAAA;AAAA,MAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,MAAK;AAAA,UACL,SAAS;AAAA,UACT,OAAO,UAAU;AAAA,UACjB,UAAU;AAAA,UACV,aAAY;AAAA,UACZ,cAAW;AAAA,QAAA;AAAA,MAAA;AAAA,MAEb;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,eAAe,yDAAyD;AAAA,UACnF,MAAK;AAAA,UACL,SAAS;AAAA,UACT,OAAO,UAAU;AAAA,UACjB,UAAU;AAAA,UACV,UAAU,CAAC;AAAA,UACX,aAAY;AAAA,UACZ,cAAW;AAAA,QAAA;AAAA,MAAA;AAAA,MAEZ,gBACC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAO;AAAA,UACP,OAAO,UAAU;AAAA,UACjB,UAAU;AAAA,UACV;AAAA,UACA,UAAU,CAAC;AAAA,UACX,WAAW,UAAU,GAAG,QAAQ,KAAK,SAAS;AAAA,UAC9C,WAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IACZ,GAEJ;AAAA,IAEA,oBAAC,QAAA,EAAO,SAAQ,QAAO,MAAK,MAAK,UAAQ,MAAC,WAAW,QAAQ,cAAW,MAAK,SAAS,SAAA,CAAU;AAAA,EAAA,GAClG;AAEJ;AAIO,SAAS,WAAW;AAAA,EACzB;AAAA,EAAO;AAAA,EAAO;AAAA,EAAiB;AAAA,EAAmB;AAAA,EAClD;AAAA,EAAyB;AAAA,EACzB;AAAA,EAAmB;AAAA,EAAmB;AAAA,EAAgB;AACxD,GAYG;AACD,SACE,qBAAC,OAAA,EAAI,WAAU,0BACb,UAAA;AAAA,IAAA,oBAAC,OAAA,EAAI,WAAU,QACb,UAAA,oBAAC,kBAAA,EAAiB,OAAc,aAAa,iBAAiB,UAAU,wBAAA,CAAyB,EAAA,CACnG;AAAA,IAEA,qBAAC,OAAA,EAAI,WAAU,8DACZ,UAAA;AAAA,MAAA,MAAM,SAAS,IAAI,CAAC,MAAM,SACzB;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,OAAO;AAAA,UACP,WAAW;AAAA,UACX,aAAa,MAAM;AAAA,UACnB;AAAA,UACA;AAAA,UACA,qBAAqB;AAAA,UACrB,eAAe,CAAC,MAAM;AACpB,kBAAM,SAAS,kBAAkB,KAAK,CAAC,MAAM,EAAE,OAAO,CAAC;AACvD,8BAAkB,KAAK,IAAI,EAAE,OAAO,GAAG,IAAI,mBAAmB,iCAAQ,IAAI,GAAG,OAAO,IAAI,eAAe,gBAAgB,MAAM,GAAG;AAAA,UAClI;AAAA,UACA,YAAY,CAAC,MAAM,kBAAkB,KAAK,IAAI,EAAE,IAAI,GAAG,OAAO,IAAI;AAAA,UAClE,eAAe,CAAC,MAAM,kBAAkB,KAAK,IAAI,EAAE,OAAO,GAAG;AAAA,UAC7D,UAAU,MAAM,kBAAkB,KAAK,EAAE;AAAA,QAAA;AAAA,QAbpC,KAAK;AAAA,MAAA,CAeb;AAAA,MAED,qBAAC,OAAA,EAAI,WAAU,qCACb,UAAA;AAAA,QAAA,oBAAC,QAAA,EAAO,SAAQ,QAAO,MAAK,MAAK,WAAW,MAAM,SAAS,gBAAgB,UAAA,SAAA,CAAM;AAAA,QAChF,MAAM,SAAS,WAAW,KACzB,oBAAC,UAAO,SAAQ,QAAO,MAAK,MAAK,WAAW,QAAQ,QAAM,MAAC,SAAS,eAAe,UAAA,QAAA,CAAK;AAAA,MAAA,EAAA,CAE5F;AAAA,IAAA,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;"}
1	+ {"version":3,"file":"data-table-filter-group.js","sources":["../../../src/components/DataTable/data-table-filter-group.tsx"],"sourcesContent":["// @benchmark-unverified-blanket: file-level retraction per M22 (d) — claims herein not individually URL-cited; treat as unverified visual/usage rumor unless retrofit per-claim. Hook escape preserved(2026-07-14 自 data-table-filter-panel.tsx 拆檔搬移,原檔級 escape 隨段落帶入)。\n// @internal — DS-internal 單元(filter row / nested-group renderer + 共用 column/operator\n// helpers;GroupBlock 為 nested-group renderer,FilterRow / ConjunctionLabel 為其 row 構件、\n// flat mode 共用。只被 data-table-filter-panel.tsx 消費);不隨 index.ts re-export 進 npm public surface。\n// ────────────────────────────── 消費的 SSOT ──────────────────────────────\n// - FieldControlGroup:field + op + value border-collapse 接合(field-control-group.spec.md;\n// FilterValuePicker 為 direct child,className forward 不開 wrapper div — 2026-05-04 #2 fix)\n// - Button(variant=\"text\" iconOnly)row meta trash / Select(size=\"sm\")conjunction・field・op\n// (data-table.spec.md「四、UI canonical」:trash = form-control row text Button;A6 conjunction)\n// - Width tokens:--data-table-filter-field-width / --data-table-filter-op-width(uiSize.css SSOT,\n// 2026-05-23 Phase A.4 Decision 2)\n// - Operator SSOT:./filter-operators.ts OPERATOR_REGISTRY(禁 hardcode op 字串)\n// - Group container 灰底 bg-muted:color.spec.md L651-654 靜態低重要 surface semantic(2026-05-09 Q3 A)\n// 設計規則:./filter-operators.spec.md + ./data-table.spec.md「進階篩選」段\n\nimport { Plus, Trash2 } from 'lucide-react'\nimport { Button } from '@/design-system/components/Button/button'\nimport { Select, type SelectOption } from '@/design-system/components/Select/select'\nimport { FieldControlGroup } from '@/design-system/components/FieldControlGroup/field-control-group'\nimport type { ColumnType } from './column-types'\nimport {\n OPERATOR_REGISTRY,\n DEFAULT_OPERATOR,\n getOperatorSpec,\n getValueShape,\n type ValueShape,\n} from './filter-operators'\nimport type { Conjunction, FilterCondition, FilterGroup } from './filter-tree'\nimport { FilterValuePicker } from './data-table-filter-value-picker'\nimport type { DataTableFilterPanelLabels } from './data-table-filter-labels'\n\n// ── Shared internal types + operator helpers(panel orchestration 也消費)────\n\nexport interface FilterColumn {\n id: string\n label: string\n type: ColumnType\n options?: Array<{ value: string; label: string }>\n /** People pool for person/multiPerson filter picker(對齊 cell-registry meta.people SSOT)/\n people?: Array<{ name: string; avatarUrl?: string; description?: string }>\n includeTime?: boolean\n}\n\nfunction getOperatorOptions(\n type: ColumnType \| undefined,\n operatorLabels: DataTableFilterPanelLabels['operatorLabels'],\n): SelectOption[] {\n const registry = type && OPERATOR_REGISTRY[type] ? OPERATOR_REGISTRY[type] : OPERATOR_REGISTRY.string\n return registry.map((op) => ({ value: op.op, label: operatorLabels[op.op] ?? op.label }))\n}\n\nexport function getDefaultOperator(type?: ColumnType): string {\n return (type && DEFAULT_OPERATOR[type]) \|\| DEFAULT_OPERATOR.string\n}\n\n// Q6(2026-07-04):date 欄位把比對精度寫進 condition(includeTime=true → ms,否則 day)。\n// 'time' 欄暫不寫(值非完整日期,truncate 語意不成立;見 filter-operators.spec v3 time 註)。\nexport const datePrecisionOf = (col: FilterColumn \| undefined): 'day' \| 'ms' \| undefined =>\n col?.type === 'date' ? (col.includeTime ? 'ms' : 'day') : undefined\n\n// ── ConjunctionLabel ───────────────────────────────────────────────────\n\nfunction ConjunctionLabel({\n index, conjunction, onChange, labels,\n}: {\n index: number\n conjunction: Conjunction\n onChange: (c: Conjunction) => void\n labels: DataTableFilterPanelLabels\n}) {\n // index === 0:首 row 顯示靜態「Where」label\n // index === 1:唯一可改的 AND/OR Select(連動整 group conjunction)\n // index ≥ 2:被連動的 row,read-only 顯示當前 conjunction 文字(同 Where 視覺,A6 canonical)\n // 對齊 Airtable / Notion / Linear 共識 @benchmark-unverified(non-OSS)\n // px-[var(--field-px)] 對齊 Field 內部 padding 12px(Q13)\n if (index === 0) {\n return <div className=\"w-20 shrink-0 text-body text-fg-secondary px-[var(--field-px)] self-center\">{labels.where}</div>\n }\n if (index >= 2) {\n const label = conjunction === 'and' ? labels.and : labels.or\n return <div className=\"w-20 shrink-0 text-body text-fg-secondary px-[var(--field-px)] self-center\">{label}</div>\n }\n // index === 1:可切換的 AND/OR Select\n // minRows={2} — And/Or 2 選項,顯式縮 menu 高度避免 reserve 3 row 空白(Q5)\n return (\n <div className=\"w-20 shrink-0\">\n <Select\n size=\"sm\"\n options={[\n { value: 'and', label: labels.and },\n { value: 'or', label: labels.or },\n ]}\n value={conjunction}\n onChange={(v) => onChange(v as Conjunction)}\n minRows={2}\n aria-label={labels.conjunctionAriaLabel}\n />\n </div>\n )\n}\n\n// ── FilterRow(flat 用 + group 內共用) ──────────────────────────────\n\nexport function FilterRow({\n index, condition, conjunction, filterableColumns, fieldOptions,\n onChangeConjunction, onChangeField, onChangeOp, onChangeValue, onRemove, labels,\n}: {\n index: number\n condition: FilterCondition\n conjunction: Conjunction\n filterableColumns: FilterColumn[]\n fieldOptions: SelectOption[]\n onChangeConjunction: (c: Conjunction) => void\n onChangeField: (v: string) => void\n onChangeOp: (v: string) => void\n onChangeValue: (v: unknown) => void\n onRemove: () => void\n labels: DataTableFilterPanelLabels\n}) {\n const colInfo = filterableColumns.find((c) => c.id === condition.field)\n const operatorOptions = getOperatorOptions(colInfo?.type, labels.operatorLabels)\n const hasField = !!condition.field\n const opSpec = colInfo ? getOperatorSpec(colInfo.type, condition.op) : null\n const valueShape: ValueShape \| null = colInfo && opSpec\n ? getValueShape(opSpec, colInfo.type, colInfo.includeTime)\n : null\n // op 'is_set' / 'is_not_set' 等 shape='none' → 無 value cell,op 自動 expand 填剩餘寬\n // 對齊 Notion / Airtable / Linear filter row 行為\n // 注意:valueShape=null(初始無 field 選)時仍 render value cell(disabled placeholder)— 只 'none' 才 fold\n const hasValueCell = valueShape !== 'none'\n\n // FieldControlGroup 接合 field + op + value 視覺(2026-05-04 E refactor + 多輪 fix):\n // - border collapse 取代 3 顆獨立 Select 並排,對齊 Airtable / Linear / Notion filter row idiom\n // - ConjunctionLabel + Trash 在 group 外層(meta actions,不屬 control 一體)\n // - #5 fix:row 內水平 gap = `gap-2` (8px),layoutSpace 規則 5 緊密相關\n // - #9 fix:cell 用 `min-w-[]`(field 160 / op 120),value flex-1 min-w-0,讓 long label 可撐寬\n // - #2 fix:FilterValuePicker 直接是 FieldControlGroup direct child(無 wrapper div),CSS variants 命中正確\n return (\n <div className=\"flex items-center gap-2\">\n <ConjunctionLabel index={index} conjunction={conjunction} onChange={onChangeConjunction} labels={labels} />\n {/ #9 fix(2026-05-04 v4):Field controls trigger `w-full` override 外 className,改用 Tailwind `!`\n important 強制 override(`!w-[160px]` / `!w-[120px]`),value 用 `!flex-1 !min-w-0`。\n Select 元件本身沒 destructure `style` prop 所以 inline style flex-basis 行不通,只能用 className。 /}\n <FieldControlGroup block className=\"flex-1 min-w-0\">\n {/ 2026-05-23 Phase A.4 Decision 2:`!w-[160px]` / `!w-[120px]` → tokens\n `--data-table-filter-field-width` / `--data-table-filter-op-width`(SSOT in uiSize.css)\n Behavior preserved 完好如初:flat + nested 同 width(token 是 design constant) /}\n <Select\n className=\"!w-[var(--data-table-filter-field-width)] flex-shrink-0 [&_.text-fg-muted]:!text-fg-secondary\"\n size=\"sm\"\n options={fieldOptions}\n value={condition.field}\n onChange={onChangeField}\n placeholder={labels.fieldPlaceholder}\n aria-label={labels.fieldAriaLabel}\n />\n <Select\n className={hasValueCell ? '!w-[var(--data-table-filter-op-width)] flex-shrink-0' : '!flex-1 !min-w-0'}\n size=\"sm\"\n options={operatorOptions}\n value={condition.op}\n onChange={onChangeOp}\n disabled={!hasField}\n placeholder={labels.operatorPlaceholder}\n aria-label={labels.operatorAriaLabel}\n />\n {hasValueCell && (\n <FilterValuePicker\n shape={valueShape}\n value={condition.value}\n onChange={onChangeValue}\n colInfo={colInfo}\n disabled={!hasField}\n ariaLabel={labels.filterValueAriaLabel(colInfo?.label)}\n labels={labels}\n className=\"!flex-1 !min-w-0\"\n />\n )}\n </FieldControlGroup>\n {/ Trash 用 text Button — filter row 是 form-control row,Field 同高對齊(28 md) /}\n <Button variant=\"text\" size=\"sm\" iconOnly startIcon={Trash2} aria-label={labels.deleteCondition} onClick={onRemove} />\n </div>\n )\n}\n\n// ── GroupBlock(nested 用) ────────────────────────────────────────────\n\nexport function GroupBlock({\n index, group, rootConjunction, filterableColumns, fieldOptions,\n onChangeRootConjunction, onChangeGroupConjunction,\n onChangeCondition, onRemoveCondition, onAddCondition, onRemoveGroup,\n canAddCondition, labels,\n}: {\n index: number\n group: FilterGroup\n rootConjunction: Conjunction\n filterableColumns: FilterColumn[]\n fieldOptions: SelectOption[]\n onChangeRootConjunction: (c: Conjunction) => void\n onChangeGroupConjunction: (c: Conjunction) => void\n onChangeCondition: (condId: string, patch: Partial<FilterCondition>) => void\n onRemoveCondition: (condId: string) => void\n onAddCondition: () => void\n onRemoveGroup: () => void\n canAddCondition: boolean\n labels: DataTableFilterPanelLabels\n}) {\n return (\n <div className=\"flex items-start gap-2\">\n <div className=\"pt-2\">\n <ConjunctionLabel index={index} conjunction={rootConjunction} onChange={onChangeRootConjunction} labels={labels} />\n </div>\n {/ Group container 灰底 — `bg-muted`(`--muted` neutral-2,user 2026-05-09 拍板 Q3 A)。對齊 color.spec.md L651-654 「table header / tab / code block / skeleton」靜態低重要 surface semantic /}\n <div className=\"flex-1 min-w-0 rounded-md bg-muted p-2 flex flex-col gap-2\">\n {group.children.map((cond, cIdx) => (\n <FilterRow\n key={cond.id}\n index={cIdx}\n condition={cond}\n conjunction={group.conjunction}\n filterableColumns={filterableColumns}\n fieldOptions={fieldOptions}\n onChangeConjunction={onChangeGroupConjunction}\n onChangeField={(v) => {\n const newCol = filterableColumns.find((c) => c.id === v)\n onChangeCondition(cond.id, { field: v, op: getDefaultOperator(newCol?.type), value: '', datePrecision: datePrecisionOf(newCol) })\n }}\n onChangeOp={(v) => onChangeCondition(cond.id, { op: v, value: '' })}\n onChangeValue={(v) => onChangeCondition(cond.id, { value: v })}\n onRemove={() => onRemoveCondition(cond.id)}\n labels={labels}\n />\n ))}\n {/ Q9 — text variant 對齊 inline 派 + 視覺輕量 */}\n <div className=\"flex items-center justify-between\">\n <Button variant=\"text\" size=\"sm\" startIcon={Plus} onClick={onAddCondition} disabled={!canAddCondition}>\n {labels.addNestedFilter}\n </Button>\n {group.children.length === 0 && (\n <Button variant=\"text\" size=\"sm\" startIcon={Trash2} danger onClick={onRemoveGroup}>\n {labels.removeEmptyGroup}\n </Button>\n )}\n </div>\n </div>\n </div>\n )\n}\n"],"names":[],"mappings":"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"}

package/dist/components/DataTable/data-table-filter-labels.d.ts ADDED Viewed

@@ -0,0 +1,44 @@
+import type { DATE_RELATIVE_GROUPS, DATE_RELATIVE_OPTIONS } from './filter-operators';
+type RelativeDateGroupKey = (typeof DATE_RELATIVE_GROUPS)[number]['key'];
+type RelativeDateValue = (typeof DATE_RELATIVE_OPTIONS)[number]['value'];
+export interface DataTableFilterPanelLabels {
+    title: string;
+    resetToDefault: string;
+    close: string;
+    where: string;
+    and: string;
+    or: string;
+    conjunctionAriaLabel: string;
+    fieldPlaceholder: string;
+    fieldAriaLabel: string;
+    operatorPlaceholder: string;
+    operatorAriaLabel: string;
+    valuePlaceholder: string;
+    numberPlaceholder: string;
+    relativeDatePlaceholder: string;
+    singleSelectPlaceholder: string;
+    multiSelectPlaceholder: string;
+    multiSelectEmptyText: string;
+    peoplePlaceholder: string;
+    peopleSearchPlaceholder: string;
+    peopleSearchAriaLabel: string;
+    peopleEmptyText: string;
+    filterValueAriaLabel: (columnLabel?: string) => string;
+    deleteCondition: string;
+    addFilter: string;
+    addGroup: string;
+    addNestedFilter: string;
+    removeEmptyGroup: string;
+    /**
+     * Operator key → visible label override. Missing keys fall back to
+     * `OPERATOR_REGISTRY` labels, preserving the registry as the default SSOT.
+     */
+    operatorLabels: Partial<Record<string, string>>;
+    /** Relative-date group/value overrides; missing keys retain registry defaults. */
+    relativeDateGroupLabels: Partial<Record<RelativeDateGroupKey, string>>;
+    relativeDateOptionLabels: Partial<Record<RelativeDateValue, string>>;
+}
+export declare const DATA_TABLE_FILTER_PANEL_DEFAULT_LABELS: DataTableFilterPanelLabels;
+export declare function resolveDataTableFilterPanelLabels(overrides?: Partial<DataTableFilterPanelLabels>): DataTableFilterPanelLabels;
+export {};
+//# sourceMappingURL=data-table-filter-labels.d.ts.map

package/dist/components/DataTable/data-table-filter-labels.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"data-table-filter-labels.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/data-table-filter-labels.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,oBAAoB,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAA;AAErF,KAAK,oBAAoB,GAAG,CAAC,OAAO,oBAAoB,CAAC,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,CAAA;AACxE,KAAK,iBAAiB,GAAG,CAAC,OAAO,qBAAqB,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AAExE,MAAM,WAAW,0BAA0B;IACzC,KAAK,EAAE,MAAM,CAAA;IACb,cAAc,EAAE,MAAM,CAAA;IACtB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,GAAG,EAAE,MAAM,CAAA;IACX,EAAE,EAAE,MAAM,CAAA;IACV,oBAAoB,EAAE,MAAM,CAAA;IAC5B,gBAAgB,EAAE,MAAM,CAAA;IACxB,cAAc,EAAE,MAAM,CAAA;IACtB,mBAAmB,EAAE,MAAM,CAAA;IAC3B,iBAAiB,EAAE,MAAM,CAAA;IACzB,gBAAgB,EAAE,MAAM,CAAA;IACxB,iBAAiB,EAAE,MAAM,CAAA;IACzB,uBAAuB,EAAE,MAAM,CAAA;IAC/B,uBAAuB,EAAE,MAAM,CAAA;IAC/B,sBAAsB,EAAE,MAAM,CAAA;IAC9B,oBAAoB,EAAE,MAAM,CAAA;IAC5B,iBAAiB,EAAE,MAAM,CAAA;IACzB,uBAAuB,EAAE,MAAM,CAAA;IAC/B,qBAAqB,EAAE,MAAM,CAAA;IAC7B,eAAe,EAAE,MAAM,CAAA;IACvB,oBAAoB,EAAE,CAAC,WAAW,CAAC,EAAE,MAAM,KAAK,MAAM,CAAA;IACtD,eAAe,EAAE,MAAM,CAAA;IACvB,SAAS,EAAE,MAAM,CAAA;IACjB,QAAQ,EAAE,MAAM,CAAA;IAChB,eAAe,EAAE,MAAM,CAAA;IACvB,gBAAgB,EAAE,MAAM,CAAA;IACxB;;;OAGG;IACH,cAAc,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAA;IAC/C,kFAAkF;IAClF,uBAAuB,EAAE,OAAO,CAAC,MAAM,CAAC,oBAAoB,EAAE,MAAM,CAAC,CAAC,CAAA;IACtE,wBAAwB,EAAE,OAAO,CAAC,MAAM,CAAC,iBAAiB,EAAE,MAAM,CAAC,CAAC,CAAA;CACrE;AAGD,eAAO,MAAM,sCAAsC,EAAE,0BA+BpD,CAAA;AAED,wBAAgB,iCAAiC,CAC/C,SAAS,CAAC,EAAE,OAAO,CAAC,0BAA0B,CAAC,GAC9C,0BAA0B,CAiB5B"}

package/dist/components/DataTable/data-table-filter-labels.js ADDED Viewed

@@ -0,0 +1,55 @@
+const DATA_TABLE_FILTER_PANEL_DEFAULT_LABELS = {
+  title: "篩選",
+  resetToDefault: "恢復預設",
+  close: "關閉",
+  where: "Where",
+  and: "And",
+  or: "Or",
+  conjunctionAriaLabel: "連接詞 — 同 group 共用",
+  fieldPlaceholder: "選擇欄位",
+  fieldAriaLabel: "篩選欄位",
+  operatorPlaceholder: "運算子",
+  operatorAriaLabel: "篩選運算子",
+  valuePlaceholder: "輸入值…",
+  numberPlaceholder: "輸入數字…",
+  relativeDatePlaceholder: "選擇相對日期",
+  singleSelectPlaceholder: "選擇值",
+  multiSelectPlaceholder: "選擇值…",
+  multiSelectEmptyText: "沒有符合的值",
+  peoplePlaceholder: "選擇人員",
+  peopleSearchPlaceholder: "搜尋人員…",
+  peopleSearchAriaLabel: "搜尋篩選人員",
+  peopleEmptyText: "沒有符合的人員",
+  filterValueAriaLabel: (columnLabel) => columnLabel ? `${columnLabel} 篩選值` : "篩選值",
+  deleteCondition: "刪除",
+  addFilter: "加篩選",
+  addGroup: "加入篩選器",
+  addNestedFilter: "加入巢狀篩選",
+  removeEmptyGroup: "移除空群組",
+  operatorLabels: {},
+  relativeDateGroupLabels: {},
+  relativeDateOptionLabels: {}
+};
+function resolveDataTableFilterPanelLabels(overrides) {
+  return {
+    ...DATA_TABLE_FILTER_PANEL_DEFAULT_LABELS,
+    ...overrides,
+    operatorLabels: {
+      ...DATA_TABLE_FILTER_PANEL_DEFAULT_LABELS.operatorLabels,
+      ...overrides == null ? void 0 : overrides.operatorLabels
+    },
+    relativeDateGroupLabels: {
+      ...DATA_TABLE_FILTER_PANEL_DEFAULT_LABELS.relativeDateGroupLabels,
+      ...overrides == null ? void 0 : overrides.relativeDateGroupLabels
+    },
+    relativeDateOptionLabels: {
+      ...DATA_TABLE_FILTER_PANEL_DEFAULT_LABELS.relativeDateOptionLabels,
+      ...overrides == null ? void 0 : overrides.relativeDateOptionLabels
+    }
+  };
+}
+export {
+  DATA_TABLE_FILTER_PANEL_DEFAULT_LABELS,
+  resolveDataTableFilterPanelLabels
+};
+//# sourceMappingURL=data-table-filter-labels.js.map

package/dist/components/DataTable/data-table-filter-labels.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"data-table-filter-labels.js","sources":["../../../src/components/DataTable/data-table-filter-labels.ts"],"sourcesContent":["// @internal — DataTableFilterPanel chrome/operator/value-picker labels shared by\n// panel orchestration, row/group rendering, and value-picker dispatch.\n\nimport type { DATE_RELATIVE_GROUPS, DATE_RELATIVE_OPTIONS } from './filter-operators'\n\ntype RelativeDateGroupKey = (typeof DATE_RELATIVE_GROUPS)[number]['key']\ntype RelativeDateValue = (typeof DATE_RELATIVE_OPTIONS)[number]['value']\n\nexport interface DataTableFilterPanelLabels {\n title: string\n resetToDefault: string\n close: string\n where: string\n and: string\n or: string\n conjunctionAriaLabel: string\n fieldPlaceholder: string\n fieldAriaLabel: string\n operatorPlaceholder: string\n operatorAriaLabel: string\n valuePlaceholder: string\n numberPlaceholder: string\n relativeDatePlaceholder: string\n singleSelectPlaceholder: string\n multiSelectPlaceholder: string\n multiSelectEmptyText: string\n peoplePlaceholder: string\n peopleSearchPlaceholder: string\n peopleSearchAriaLabel: string\n peopleEmptyText: string\n filterValueAriaLabel: (columnLabel?: string) => string\n deleteCondition: string\n addFilter: string\n addGroup: string\n addNestedFilter: string\n removeEmptyGroup: string\n /**\n * Operator key → visible label override. Missing keys fall back to\n * `OPERATOR_REGISTRY` labels, preserving the registry as the default SSOT.\n */\n operatorLabels: Partial<Record<string, string>>\n /** Relative-date group/value overrides; missing keys retain registry defaults. */\n relativeDateGroupLabels: Partial<Record<RelativeDateGroupKey, string>>\n relativeDateOptionLabels: Partial<Record<RelativeDateValue, string>>\n}\n\n// code-quality-allow: dead-export — public i18n defaults, re-exported by panel.\nexport const DATA_TABLE_FILTER_PANEL_DEFAULT_LABELS: DataTableFilterPanelLabels = {\n title: '篩選',\n resetToDefault: '恢復預設',\n close: '關閉',\n where: 'Where',\n and: 'And',\n or: 'Or',\n conjunctionAriaLabel: '連接詞 — 同 group 共用',\n fieldPlaceholder: '選擇欄位',\n fieldAriaLabel: '篩選欄位',\n operatorPlaceholder: '運算子',\n operatorAriaLabel: '篩選運算子',\n valuePlaceholder: '輸入值…',\n numberPlaceholder: '輸入數字…',\n relativeDatePlaceholder: '選擇相對日期',\n singleSelectPlaceholder: '選擇值',\n multiSelectPlaceholder: '選擇值…',\n multiSelectEmptyText: '沒有符合的值',\n peoplePlaceholder: '選擇人員',\n peopleSearchPlaceholder: '搜尋人員…',\n peopleSearchAriaLabel: '搜尋篩選人員',\n peopleEmptyText: '沒有符合的人員',\n filterValueAriaLabel: (columnLabel) => columnLabel ? `${columnLabel} 篩選值` : '篩選值',\n deleteCondition: '刪除',\n addFilter: '加篩選',\n addGroup: '加入篩選器',\n addNestedFilter: '加入巢狀篩選',\n removeEmptyGroup: '移除空群組',\n operatorLabels: {},\n relativeDateGroupLabels: {},\n relativeDateOptionLabels: {},\n}\n\nexport function resolveDataTableFilterPanelLabels(\n overrides?: Partial<DataTableFilterPanelLabels>,\n): DataTableFilterPanelLabels {\n return {\n ...DATA_TABLE_FILTER_PANEL_DEFAULT_LABELS,\n ...overrides,\n operatorLabels: {\n ...DATA_TABLE_FILTER_PANEL_DEFAULT_LABELS.operatorLabels,\n ...overrides?.operatorLabels,\n },\n relativeDateGroupLabels: {\n ...DATA_TABLE_FILTER_PANEL_DEFAULT_LABELS.relativeDateGroupLabels,\n ...overrides?.relativeDateGroupLabels,\n },\n relativeDateOptionLabels: {\n ...DATA_TABLE_FILTER_PANEL_DEFAULT_LABELS.relativeDateOptionLabels,\n ...overrides?.relativeDateOptionLabels,\n },\n }\n}\n"],"names":[],"mappings":"AA+CO,MAAM,yCAAqE;AAAA,EAChF,OAAO;AAAA,EACP,gBAAgB;AAAA,EAChB,OAAO;AAAA,EACP,OAAO;AAAA,EACP,KAAK;AAAA,EACL,IAAI;AAAA,EACJ,sBAAsB;AAAA,EACtB,kBAAkB;AAAA,EAClB,gBAAgB;AAAA,EAChB,qBAAqB;AAAA,EACrB,mBAAmB;AAAA,EACnB,kBAAkB;AAAA,EAClB,mBAAmB;AAAA,EACnB,yBAAyB;AAAA,EACzB,yBAAyB;AAAA,EACzB,wBAAwB;AAAA,EACxB,sBAAsB;AAAA,EACtB,mBAAmB;AAAA,EACnB,yBAAyB;AAAA,EACzB,uBAAuB;AAAA,EACvB,iBAAiB;AAAA,EACjB,sBAAsB,CAAC,gBAAgB,cAAc,GAAG,WAAW,SAAS;AAAA,EAC5E,iBAAiB;AAAA,EACjB,WAAW;AAAA,EACX,UAAU;AAAA,EACV,iBAAiB;AAAA,EACjB,kBAAkB;AAAA,EAClB,gBAAgB,CAAA;AAAA,EAChB,yBAAyB,CAAA;AAAA,EACzB,0BAA0B,CAAA;AAC5B;AAEO,SAAS,kCACd,WAC4B;AAC5B,SAAO;AAAA,IACL,GAAG;AAAA,IACH,GAAG;AAAA,IACH,gBAAgB;AAAA,MACd,GAAG,uCAAuC;AAAA,MAC1C,GAAG,uCAAW;AAAA,IAAA;AAAA,IAEhB,yBAAyB;AAAA,MACvB,GAAG,uCAAuC;AAAA,MAC1C,GAAG,uCAAW;AAAA,IAAA;AAAA,IAEhB,0BAA0B;AAAA,MACxB,GAAG,uCAAuC;AAAA,MAC1C,GAAG,uCAAW;AAAA,IAAA;AAAA,EAChB;AAEJ;"}

package/dist/components/DataTable/data-table-filter-panel.d.ts CHANGED Viewed

@@ -1,8 +1,11 @@
 import * as React from 'react';
 import type { ColumnDef } from '@tanstack/react-table';
 import { createEmptyFilterTree, isFilterTreeActive, evaluateTree, dataTableFilterMatch, type Conjunction, type FilterCondition, type FilterGroup, type FilterTree, type FilterTreeFlat, type FilterTreeNested } from './filter-tree';
+import { DATA_TABLE_FILTER_PANEL_DEFAULT_LABELS, type DataTableFilterPanelLabels } from './data-table-filter-labels';
 export { createEmptyFilterTree, isFilterTreeActive, evaluateTree, dataTableFilterMatch, };
 export type { Conjunction, FilterCondition, FilterGroup, FilterTree, FilterTreeFlat, FilterTreeNested };
+export { DATA_TABLE_FILTER_PANEL_DEFAULT_LABELS };
+export type { DataTableFilterPanelLabels };
 export interface DataTableFilterPanelProps<TData> {
     /** 可被 filter 的 columns */
     columns: ColumnDef<TData, any>[];
@@ -19,6 +22,14 @@ export interface DataTableFilterPanelProps<TData> {
     /** Cell ⌄ menu「Filter by this」帶入的 column id(自動 add 一條 condition) */
     prefilledColumnId?: string;
     onPrefillConsumed?: () => void;
+    /**
+     * Condition leaf 上限(flat children 或 nested 所有 group.children 的總和)。
+     * 預設不限。到上限後所有 add 路徑與 prefill 都 fail closed；controlled value
+     * 已超過上限時保留原資料、不裁切，只停用後續新增。
+     */
+    maxConditions?: number;
+    /** Panel chrome/operator/value-picker labels. Nested maps are deep-merged with defaults. */
+    labels?: Partial<DataTableFilterPanelLabels>;
     onClose?: () => void;
     className?: string;
 }