@qijenchen/design-system 0.1.0-beta.83 → 0.1.0-beta.85

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

@@ -0,0 +1,154 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { Trash2, Plus } from "lucide-react";
+import { Button } from "../Button/button.js";
+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) {
+  const registry = type && OPERATOR_REGISTRY[type] ? OPERATOR_REGISTRY[type] : OPERATOR_REGISTRY.string;
+  return registry.map((op) => ({ value: op.op, label: 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
+}) {
+  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" });
+  }
+  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 });
+  }
+  return /* @__PURE__ */ jsx("div", { className: "w-20 shrink-0", children: /* @__PURE__ */ jsx(
+    Select,
+    {
+      size: "sm",
+      options: CONJ_OPTIONS,
+      value: conjunction,
+      onChange: (v) => onChange(v),
+      minRows: 2,
+      "aria-label": "連接詞 — 同 group 共用"
+    }
+  ) });
+}
+function FilterRow({
+  index,
+  condition,
+  conjunction,
+  filterableColumns,
+  fieldOptions,
+  onChangeConjunction,
+  onChangeField,
+  onChangeOp,
+  onChangeValue,
+  onRemove
+}) {
+  const colInfo = filterableColumns.find((c) => c.id === condition.field);
+  const operatorOptions = getOperatorOptions(colInfo == null ? void 0 : colInfo.type);
+  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__ */ 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",
+          size: "sm",
+          options: fieldOptions,
+          value: condition.field,
+          onChange: onChangeField,
+          placeholder: "選擇欄位",
+          "aria-label": "篩選欄位"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Select,
+        {
+          className: hasValueCell ? "!w-[var(--data-table-filter-op-width)] flex-shrink-0" : "!flex-1 !min-w-0",
+          size: "sm",
+          options: operatorOptions,
+          value: condition.op,
+          onChange: onChangeOp,
+          disabled: !hasField,
+          placeholder: "運算子",
+          "aria-label": "篩選運算子"
+        }
+      ),
+      hasValueCell && /* @__PURE__ */ jsx(
+        FilterValuePicker,
+        {
+          shape: valueShape,
+          value: condition.value,
+          onChange: onChangeValue,
+          colInfo,
+          disabled: !hasField,
+          ariaLabel: colInfo ? `${colInfo.label} 篩選值` : "篩選值",
+          className: "!flex-1 !min-w-0"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx(Button, { variant: "text", size: "sm", iconOnly: true, startIcon: Trash2, "aria-label": "刪除", onClick: onRemove })
+  ] });
+}
+function GroupBlock({
+  index,
+  group,
+  rootConjunction,
+  filterableColumns,
+  fieldOptions,
+  onChangeRootConjunction,
+  onChangeGroupConjunction,
+  onChangeCondition,
+  onRemoveCondition,
+  onAddCondition,
+  onRemoveGroup
+}) {
+  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__ */ 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,
+        {
+          index: cIdx,
+          condition: cond,
+          conjunction: group.conjunction,
+          filterableColumns,
+          fieldOptions,
+          onChangeConjunction: onChangeGroupConjunction,
+          onChangeField: (v) => {
+            const newCol = filterableColumns.find((c) => c.id === v);
+            onChangeCondition(cond.id, { field: v, op: getDefaultOperator(newCol == null ? void 0 : newCol.type), value: "", datePrecision: datePrecisionOf(newCol) });
+          },
+          onChangeOp: (v) => onChangeCondition(cond.id, { op: v, value: "" }),
+          onChangeValue: (v) => onChangeCondition(cond.id, { value: v }),
+          onRemove: () => onRemoveCondition(cond.id)
+        },
+        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: "移除空群組" })
+      ] })
+    ] })
+  ] });
+}
+export {
+  FilterRow,
+  GroupBlock,
+  datePrecisionOf,
+  getDefaultOperator
+};
+//# sourceMappingURL=data-table-filter-group.js.map

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

@@ -0,0 +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":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"data-table-filter-panel.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/data-table-filter-panel.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAA;AAyBtD,OAAO,EACL,qBAAqB,EACrB,kBAAkB,EAElB,YAAY,EACZ,oBAAoB,EACpB,KAAK,WAAW,EAChB,KAAK,eAAe,EACpB,KAAK,WAAW,EAChB,KAAK,UAAU,EACf,KAAK,cAAc,EACnB,KAAK,gBAAgB,EACtB,MAAM,eAAe,CAAA;AAGtB,OAAO,EACL,qBAAqB,EACrB,kBAAkB,EAClB,YAAY,EACZ,oBAAoB,GACrB,CAAA;AACD,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,WAAW,EAAE,UAAU,EAAE,cAAc,EAAE,gBAAgB,EAAE,CAAA;AA6TvG,MAAM,WAAW,yBAAyB,CAAC,KAAK;IAC9C,yDAAyD;IACzD,IAAI,EAAE,MAAM,GAAG,QAAQ,CAAA;IACvB,0BAA0B;IAC1B,OAAO,EAAE,SAAS,CAAC,KAAK,EAAE,GAAG,CAAC,EAAE,CAAA;IAChC,gCAAgC;IAChC,KAAK,EAAE,UAAU,CAAA;IACjB,wBAAwB;IACxB,QAAQ,EAAE,CAAC,IAAI,EAAE,UAAU,KAAK,IAAI,CAAA;IACpC;;;;OAIG;IACH,YAAY,CAAC,EAAE,UAAU,CAAA;IACzB,oEAAoE;IACpE,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC9B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AA2PD,eAAO,MAAM,oBAAoB,EAAkD,CAAC,KAAK,EACvF,KAAK,EAAE,yBAAyB,CAAC,KAAK,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,CAAA;CAAE,KACnF,KAAK,CAAC,YAAY,CACtB"}
+{"version":3,"file":"data-table-filter-panel.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/data-table-filter-panel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAA;AAgBtD,OAAO,EACL,qBAAqB,EACrB,kBAAkB,EAElB,YAAY,EACZ,oBAAoB,EACpB,KAAK,WAAW,EAChB,KAAK,eAAe,EACpB,KAAK,WAAW,EAChB,KAAK,UAAU,EACf,KAAK,cAAc,EACnB,KAAK,gBAAgB,EACtB,MAAM,eAAe,CAAA;AAGtB,OAAO,EACL,qBAAqB,EACrB,kBAAkB,EAClB,YAAY,EACZ,oBAAoB,GACrB,CAAA;AACD,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,WAAW,EAAE,UAAU,EAAE,cAAc,EAAE,gBAAgB,EAAE,CAAA;AAsFvG,MAAM,WAAW,yBAAyB,CAAC,KAAK;IAC9C,yDAAyD;IACzD,IAAI,EAAE,MAAM,GAAG,QAAQ,CAAA;IACvB,0BAA0B;IAC1B,OAAO,EAAE,SAAS,CAAC,KAAK,EAAE,GAAG,CAAC,EAAE,CAAA;IAChC,gCAAgC;IAChC,KAAK,EAAE,UAAU,CAAA;IACjB,wBAAwB;IACxB,QAAQ,EAAE,CAAC,IAAI,EAAE,UAAU,KAAK,IAAI,CAAA;IACpC;;;;OAIG;IACH,YAAY,CAAC,EAAE,UAAU,CAAA;IACzB,oEAAoE;IACpE,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC9B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AA8PD,eAAO,MAAM,oBAAoB,EAAkD,CAAC,KAAK,EACvF,KAAK,EAAE,yBAAyB,CAAC,KAAK,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,CAAA;CAAE,KACnF,KAAK,CAAC,YAAY,CACtB"}

package/dist/components/DataTable/data-table-filter-panel.js

@@ -0,0 +1,285 @@
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import * as React from "react";
+import { RotateCcw, X, Plus } from "lucide-react";
+import { cn } from "../../lib/utils.js";
+import { Button } from "../Button/button.js";
+import { SurfaceHeader, COMPACT_HEADER_SLOT, SurfaceBody } from "../../patterns/overlay-surface/overlay-surface.js";
+import { PopoverTitle, PopoverClose } from "../Popover/popover.js";
+import { ButtonDivider } from "../Button/button-group.js";
+import { getColumnId, getColumnMeta, getColumnLabel } from "./lib/column-meta.js";
+import { datePrecisionOf, getDefaultOperator, FilterRow, GroupBlock } from "./data-table-filter-group.js";
+import { isFilterTreeEqual } from "./filter-tree.js";
+import { createEmptyFilterTree, dataTableFilterMatch, evaluateTree, isFilterTreeActive } from "./filter-tree.js";
+let _idSeed = 0;
+const newId = () => `f${++_idSeed}-${Date.now().toString(36)}`;
+function extractColumns(columns) {
+  const out = [];
+  for (const col of columns) {
+    const id = getColumnId(col);
+    if (!id || id === "__select__") continue;
+    const meta = getColumnMeta(col);
+    const type = meta == null ? void 0 : meta.type;
+    if (!type) continue;
+    if ((meta == null ? void 0 : meta.filterable) === false) continue;
+    out.push({
+      id,
+      label: getColumnLabel(col, id),
+      type,
+      options: meta == null ? void 0 : meta.options,
+      people: meta == null ? void 0 : meta.people,
+      includeTime: meta == null ? void 0 : meta.includeTime
+    });
+  }
+  return out;
+}
+const newCondition = (firstCol) => ({
+  kind: "cond",
+  id: newId(),
+  field: (firstCol == null ? void 0 : firstCol.id) ?? "",
+  op: firstCol ? getDefaultOperator(firstCol.type) : "",
+  value: "",
+  datePrecision: datePrecisionOf(firstCol)
+});
+const newEmptyCondition = () => ({
+  kind: "cond",
+  id: newId(),
+  field: "",
+  op: "",
+  value: ""
+});
+const newGroup = (firstCol) => ({
+  kind: "group",
+  id: newId(),
+  conjunction: "or",
+  // group 內 default OR(對齊 ref 圖)
+  children: [newCondition(firstCol)]
+});
+const newEmptyGroup = () => ({
+  kind: "group",
+  id: newId(),
+  conjunction: "or",
+  children: [newEmptyCondition()]
+});
+function DataTableFilterPanelInner({
+  mode,
+  columns,
+  value,
+  onChange,
+  defaultValue,
+  prefilledColumnId,
+  onPrefillConsumed,
+  onClose,
+  className
+}, ref) {
+  const filterableColumns = React.useMemo(() => extractColumns(columns), [columns]);
+  const fieldOptions = React.useMemo(
+    () => filterableColumns.map((c) => ({ value: c.id, label: c.label })),
+    [filterableColumns]
+  );
+  const initialMountDoneRef = React.useRef(false);
+  React.useEffect(() => {
+    if (initialMountDoneRef.current) return;
+    initialMountDoneRef.current = true;
+    if (filterableColumns.length === 0) return;
+    if (value.children.length > 0) return;
+    if (value.mode === "flat") {
+      onChange({ ...value, children: [newEmptyCondition()] });
+    } else {
+      onChange({ ...value, children: [newEmptyGroup()] });
+    }
+  }, [filterableColumns.length]);
+  React.useEffect(() => {
+    if (!prefilledColumnId) return;
+    const colInfo = filterableColumns.find((c) => c.id === prefilledColumnId);
+    if (colInfo) {
+      const cond = {
+        kind: "cond",
+        id: newId(),
+        field: prefilledColumnId,
+        op: getDefaultOperator(colInfo.type),
+        value: "",
+        // 2026-07-14 deep-audit fix:補 datePrecision(原漏 → datetime(includeTime=true)欄
+        // prefill 掉到 undefined=day 精度忽略 ms;對齊初始 add / changeField 路徑的 datePrecisionOf)
+        datePrecision: datePrecisionOf(colInfo)
+      };
+      if (value.mode === "flat") {
+        onChange({ ...value, children: [...value.children, cond] });
+      } else {
+        if (value.children.length === 0) {
+          onChange({ ...value, children: [{ ...newGroup(colInfo), children: [cond] }] });
+        } else {
+          const updatedGroups = value.children.map(
+            (g, i) => i === 0 ? { ...g, children: [...g.children, cond] } : g
+          );
+          onChange({ ...value, children: updatedGroups });
+        }
+      }
+    }
+    onPrefillConsumed == null ? void 0 : onPrefillConsumed();
+  }, [prefilledColumnId]);
+  const flatTree = value.mode === "flat" ? value : null;
+  const updateFlatCondition = (id, patch) => {
+    if (!flatTree) return;
+    onChange({
+      ...flatTree,
+      children: flatTree.children.map((c) => c.id === id ? { ...c, ...patch } : c)
+    });
+  };
+  const removeFlatCondition = (id) => {
+    if (!flatTree) return;
+    onChange({ ...flatTree, children: flatTree.children.filter((c) => c.id !== id) });
+  };
+  const addFlatCondition = () => {
+    if (!flatTree) return;
+    onChange({ ...flatTree, children: [...flatTree.children, newEmptyCondition()] });
+  };
+  const setFlatConjunction = (conj) => {
+    if (!flatTree) return;
+    onChange({ ...flatTree, conjunction: conj });
+  };
+  const nestedTree = value.mode === "nested" ? value : null;
+  const updateGroup = (groupId, patch) => {
+    if (!nestedTree) return;
+    onChange({
+      ...nestedTree,
+      children: nestedTree.children.map((g) => g.id === groupId ? { ...g, ...patch } : g)
+    });
+  };
+  const updateGroupCondition = (groupId, condId, patch) => {
+    if (!nestedTree) return;
+    onChange({
+      ...nestedTree,
+      children: nestedTree.children.map(
+        (g) => g.id === groupId ? { ...g, children: g.children.map((c) => c.id === condId ? { ...c, ...patch } : c) } : g
+      )
+    });
+  };
+  const removeGroupCondition = (groupId, condId) => {
+    if (!nestedTree) return;
+    onChange({
+      ...nestedTree,
+      children: nestedTree.children.map(
+        (g) => g.id === groupId ? { ...g, children: g.children.filter((c) => c.id !== condId) } : g
+      )
+    });
+  };
+  const addConditionToGroup = (groupId) => {
+    if (!nestedTree) return;
+    onChange({
+      ...nestedTree,
+      children: nestedTree.children.map(
+        (g) => g.id === groupId ? { ...g, children: [...g.children, newEmptyCondition()] } : g
+      )
+    });
+  };
+  const removeGroup = (groupId) => {
+    if (!nestedTree) return;
+    onChange({ ...nestedTree, children: nestedTree.children.filter((g) => g.id !== groupId) });
+  };
+  const addGroup = () => {
+    if (!nestedTree) return;
+    onChange({ ...nestedTree, children: [...nestedTree.children, newEmptyGroup()] });
+  };
+  const setRootConjunction = (conj) => {
+    if (!nestedTree) return;
+    onChange({ ...nestedTree, conjunction: conj });
+  };
+  return (
+    // 寬度策略:desktop 680px;mobile 縮到 viewport 內留 32px 邊(避溢出 popover 切右半)。
+    // 對齊 Notion / Airtable 的 advanced filter 在 mobile 走 full-width 邊處理。
+    // **#8 fix(2026-05-04)**:popover width by mode(由 cell min-w 與 group nested chrome 反推)
+    //   flat:cell ConjunctionLabel(80) + gap-2(8) + FCG(field-min 160 + op-min 120 + value 200) +
+    //         gap-2(8) + trash(28) + 2×loose padding(32) = ~636 → 640px
+    //   nested:再加 group p-2 (16) + outer ConjunctionLabel (80) + outer gap (8) → ~740 → 760px
+    //   對齊 Airtable / Notion / Linear filter row 視覺密度 @benchmark-unverified(non-OSS)
+    // **K11 fix(2026-05-04)**:viewport-aware scroll chain invariant
+    //   parent PopoverContent 是 flex flex-col + max-h + overflow-hidden,
+    //   panel root 必 forward `flex flex-col h-full` 才能讓 SurfaceBody flex-1 min-h-0 overflow-y-auto 生效
+    //   無此 forward → 中間 wrapper 斷鏈 → body 不 scroll(ProfileCard 因為自身設 max-h flex-col 才繞過)
+    //   詳 overlay-surface.spec.md「viewport-aware scroll chain invariant」段
+    // K11 v2 fix(2026-05-04):flex item 預設 min-h:auto 讓 content 撐 height,h-full 失效。
+    // 必加 `min-h-0` 才能讓 panel 在 PopoverContent max-h cap 下正確 shrink + body scroll。
+    /* @__PURE__ */ jsxs("div", { ref, className: cn(
+      "flex flex-col h-full min-h-0",
+      mode === "nested" ? "w-[min(760px,calc(100vw-2rem))]" : "w-[min(640px,calc(100vw-2rem))]",
+      className
+    ), children: [
+      /* @__PURE__ */ jsxs(SurfaceHeader, { className: COMPACT_HEADER_SLOT, children: [
+        /* @__PURE__ */ jsx(PopoverTitle, { className: "flex-1", children: "篩選" }),
+        defaultValue && !isFilterTreeEqual(value, defaultValue) && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "text",
+              size: "sm",
+              iconOnly: true,
+              startIcon: RotateCcw,
+              "aria-label": "恢復預設",
+              onClick: () => onChange(defaultValue)
+            }
+          ),
+          onClose && /* @__PURE__ */ jsx(ButtonDivider, {})
+        ] }),
+        onClose && /* @__PURE__ */ jsx(PopoverClose, { asChild: true, children: /* @__PURE__ */ jsx(Button, { "data-dismiss": true, iconOnly: true, dismiss: true, size: "sm", startIcon: X, "aria-label": "關閉", onClick: onClose }) })
+      ] }),
+      /* @__PURE__ */ jsxs(SurfaceBody, { className: "flex flex-col gap-[var(--layout-space-tight)]", children: [
+        flatTree && flatTree.children.map((cond, idx) => /* @__PURE__ */ jsx(
+          FilterRow,
+          {
+            index: idx,
+            condition: cond,
+            conjunction: flatTree.conjunction,
+            filterableColumns,
+            fieldOptions,
+            onChangeConjunction: setFlatConjunction,
+            onChangeField: (v) => {
+              const newCol = filterableColumns.find((c) => c.id === v);
+              updateFlatCondition(cond.id, { field: v, op: getDefaultOperator(newCol == null ? void 0 : newCol.type), value: "", datePrecision: datePrecisionOf(newCol) });
+            },
+            onChangeOp: (v) => updateFlatCondition(cond.id, { op: v, value: "" }),
+            onChangeValue: (v) => updateFlatCondition(cond.id, { value: v }),
+            onRemove: () => removeFlatCondition(cond.id)
+          },
+          cond.id
+        )),
+        nestedTree && nestedTree.children.map((group, gIdx) => /* @__PURE__ */ jsx(
+          GroupBlock,
+          {
+            index: gIdx,
+            group,
+            rootConjunction: nestedTree.conjunction,
+            filterableColumns,
+            fieldOptions,
+            onChangeRootConjunction: setRootConjunction,
+            onChangeGroupConjunction: (c) => updateGroup(group.id, { conjunction: c }),
+            onChangeCondition: (condId, patch) => updateGroupCondition(group.id, condId, patch),
+            onRemoveCondition: (condId) => removeGroupCondition(group.id, condId),
+            onAddCondition: () => addConditionToGroup(group.id),
+            onRemoveGroup: () => removeGroup(group.id)
+          },
+          group.id
+        )),
+        /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "tertiary",
+            size: "sm",
+            startIcon: Plus,
+            onClick: mode === "flat" ? addFlatCondition : addGroup,
+            children: mode === "nested" ? "加入篩選器" : "加篩選"
+          }
+        ) })
+      ] })
+    ] })
+  );
+}
+const DataTableFilterPanel = React.forwardRef(DataTableFilterPanelInner);
+DataTableFilterPanel.displayName = "DataTableFilterPanel";
+export {
+  DataTableFilterPanel,
+  createEmptyFilterTree,
+  dataTableFilterMatch,
+  evaluateTree,
+  isFilterTreeActive
+};
+//# sourceMappingURL=data-table-filter-panel.js.map

package/dist/components/DataTable/data-table-filter-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-table-filter-panel.js","sources":["../../../src/components/DataTable/data-table-filter-panel.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// same-row-mixed-allow: header chrome corner buttons(close)跟 row inline actions(trash)不在同 row\nimport * as React from 'react'\nimport { Plus, X as XIcon, RotateCcw } from 'lucide-react'\nimport type { ColumnDef } from '@tanstack/react-table'\nimport { cn } from '@/lib/utils'\nimport { Button } from '@/design-system/components/Button/button'\nimport type { SelectOption } from '@/design-system/components/Select/select'\nimport { SurfaceHeader, SurfaceBody, COMPACT_HEADER_SLOT } from '@/design-system/patterns/overlay-surface/overlay-surface'\nimport { PopoverTitle, PopoverClose } from '@/design-system/components/Popover/popover'\nimport { ButtonDivider } from '@/design-system/components/Button/button-group'\nimport type { ColumnType } from './column-types'\nimport { getColumnId, getColumnLabel, getColumnMeta } from './lib/column-meta'\nimport {\n  FilterRow,\n  GroupBlock,\n  getDefaultOperator,\n  datePrecisionOf,\n  type FilterColumn,\n} from './data-table-filter-group'\nimport {\n  createEmptyFilterTree,\n  isFilterTreeActive,\n  isFilterTreeEqual,\n  evaluateTree,\n  dataTableFilterMatch,\n  type Conjunction,\n  type FilterCondition,\n  type FilterGroup,\n  type FilterTree,\n  type FilterTreeFlat,\n  type FilterTreeNested,\n} from './filter-tree'\n\n// Re-export public API from filter-tree(consumer 既有 import path 不變)\nexport {\n  createEmptyFilterTree,\n  isFilterTreeActive,\n  evaluateTree,\n  dataTableFilterMatch,\n}\nexport type { Conjunction, FilterCondition, FilterGroup, FilterTree, FilterTreeFlat, FilterTreeNested }\n\n/**\n * DataTableFilterPanel — ClickUp-style 進階篩選 panel\n *\n * 對齊 ClickUp / Airtable / Notion / Coda / Linear advanced-filter 派 —\n * parenthesized boolean expression builder。\n *\n * 兩種 mode 由 consumer 拍板:\n * - `flat`:root 下只能裝 condition,無 group\n * - `nested`:root 下裝 1+ group(灰底框),每個 group 內裝 1+ condition,**剛好 1 層**\n *\n * Source-of-truth:\n * - Operator definitions:`./filter-operators.ts` `OPERATOR_REGISTRY`(SSOT,禁 hardcode op 字串)\n * - Filter state:**FilterTree**(本檔自管;搭配 TanStack `globalFilter` 求值)\n * - Row / nested-group renderer:`./data-table-filter-group.tsx`;value picker:\n *   `./data-table-filter-value-picker.tsx`(皆 @internal — 2026-07-14 file-size 拆檔,\n *   本檔只留 orchestration:columns 抽取 / FilterTree mutators / panel chrome)\n *\n * 詳:`./filter-operators.spec.md`\n */\n\n// ── Internal — id seed ──────────────────────────────────────────────────\n\nlet _idSeed = 0\nconst newId = () => `f${++_idSeed}-${Date.now().toString(36)}`\n\n// ── Helpers — column extraction + condition factories ──────────────────\n// (FilterColumn type + operator helpers 住 ./data-table-filter-group.tsx)\n\nfunction extractColumns<TData>(columns: ColumnDef<TData, any>[]): FilterColumn[] {\n  const out: FilterColumn[] = []\n  for (const col of columns) {\n    const id = getColumnId(col)\n    if (!id || id === '__select__') continue\n    const meta = getColumnMeta(col)\n    const type: ColumnType | undefined = meta?.type\n    if (!type) continue\n    if (meta?.filterable === false) continue\n    out.push({\n      id,\n      label: getColumnLabel(col, id),\n      type,\n      options: meta?.options,\n      people: meta?.people,\n      includeTime: meta?.includeTime,\n    })\n  }\n  return out\n}\n\nconst newCondition = (firstCol: FilterColumn | undefined): FilterCondition => ({\n  kind: 'cond',\n  id: newId(),\n  field: firstCol?.id ?? '',\n  op: firstCol ? getDefaultOperator(firstCol.type) : '',\n  value: '',\n  datePrecision: datePrecisionOf(firstCol),\n})\n\n// **G fix(2026-05-04)**:initial-mount 用 — field 不預選,user 自選後 op/value 才 enable\n//   Disabled state(field='')→ op + value 在 FilterRow 內走 `disabled={!hasField}` 自動連動\nconst newEmptyCondition = (): FilterCondition => ({\n  kind: 'cond',\n  id: newId(),\n  field: '',\n  op: '',\n  value: '',\n})\n\nconst newGroup = (firstCol: FilterColumn | undefined): FilterGroup => ({\n  kind: 'group',\n  id: newId(),\n  conjunction: 'or',                                // group 內 default OR(對齊 ref 圖)\n  children: [newCondition(firstCol)],\n})\n\nconst newEmptyGroup = (): FilterGroup => ({\n  kind: 'group',\n  id: newId(),\n  conjunction: 'or',\n  children: [newEmptyCondition()],\n})\n\n// ── Component Props ─────────────────────────────────────────────────────\n\nexport interface DataTableFilterPanelProps<TData> {\n  /** flat(無 group)or nested(1-level group)— consumer 拍板 */\n  mode: 'flat' | 'nested'\n  /** 可被 filter 的 columns */\n  columns: ColumnDef<TData, any>[]\n  /** 當前 FilterTree(controlled) */\n  value: FilterTree\n  /** state 變更 callback */\n  onChange: (next: FilterTree) => void\n  /**\n   * 管理員 set-as-default 的 baseline(refresh icon 顯示判定用)。\n   * 當 `value` ≠ `defaultValue`(deep equal)→ panel header 顯示 refresh icon,\n   * click → reset 回 defaultValue。對齊 sort 邏輯(相同 modified-from-default UX)。\n   */\n  defaultValue?: FilterTree\n  /** Cell ⌄ menu「Filter by this」帶入的 column id(自動 add 一條 condition) */\n  prefilledColumnId?: string\n  onPrefillConsumed?: () => void\n  onClose?: () => void\n  className?: string\n}\n\n// ── Main Component ──────────────────────────────────────────────────────\n\n// 內部 fn — generic + ref 轉發。export 走 cast(對齊 DataTable 同 pattern)\nfunction DataTableFilterPanelInner<TData>({\n  mode,\n  columns,\n  value,\n  onChange,\n  defaultValue,\n  prefilledColumnId,\n  onPrefillConsumed,\n  onClose,\n  className,\n}: DataTableFilterPanelProps<TData>, ref: React.ForwardedRef<HTMLDivElement>): React.ReactElement {\n  const filterableColumns = React.useMemo(() => extractColumns(columns), [columns])\n  const fieldOptions: SelectOption[] = React.useMemo(\n    () => filterableColumns.map((c) => ({ value: c.id, label: c.label })),\n    [filterableColumns],\n  )\n  // K13 後 firstCol 不再被 add* 消費(改用 newEmpty*),這裡只留 prefill effect 用(已直接讀 prefilledColumnId)。\n\n  // **G fix(2026-05-04 v2)**:initial-mount 預設 1 empty row(field 未選 → op+value 自動 disabled)\n  //   useRef gate → 只 mount 一次;user 後續手動刪光 → 不 re-add → 維持「全清 = empty CTA only」UX\n  //   Two states clearly separated:\n  //     (a) Initial mount with empty value → auto-add 1 empty row(讓 user 看到 row shape,不必先點 CTA)\n  //     (b) User explicitly deletes all → empty CTA only(無 row,respect user intent)\n  const initialMountDoneRef = React.useRef(false)\n  React.useEffect(() => {\n    if (initialMountDoneRef.current) return\n    initialMountDoneRef.current = true\n    if (filterableColumns.length === 0) return\n    if (value.children.length > 0) return\n    if (value.mode === 'flat') {\n      onChange({ ...value, children: [newEmptyCondition()] } as FilterTreeFlat)\n    } else {\n      onChange({ ...value, children: [newEmptyGroup()] } as FilterTreeNested)\n    }\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [filterableColumns.length])\n\n  // Prefill from cell ⌄ menu「Filter by this」\n  React.useEffect(() => {\n    if (!prefilledColumnId) return\n    const colInfo = filterableColumns.find((c) => c.id === prefilledColumnId)\n    if (colInfo) {\n      const cond: FilterCondition = {\n        kind: 'cond',\n        id: newId(),\n        field: prefilledColumnId,\n        op: getDefaultOperator(colInfo.type),\n        value: '',\n        // 2026-07-14 deep-audit fix:補 datePrecision(原漏 → datetime(includeTime=true)欄\n        // prefill 掉到 undefined=day 精度忽略 ms;對齊初始 add / changeField 路徑的 datePrecisionOf)\n        datePrecision: datePrecisionOf(colInfo),\n      }\n      if (value.mode === 'flat') {\n        onChange({ ...value, children: [...value.children, cond] })\n      } else {\n        // nested mode:add 到第 1 個 group(若無則新建)\n        if (value.children.length === 0) {\n          onChange({ ...value, children: [{ ...newGroup(colInfo), children: [cond] }] })\n        } else {\n          const updatedGroups = value.children.map((g, i) =>\n            i === 0 ? { ...g, children: [...g.children, cond] } : g\n          )\n          onChange({ ...value, children: updatedGroups })\n        }\n      }\n    }\n    onPrefillConsumed?.()\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [prefilledColumnId])\n\n  // ── flat-mode mutators ──\n  const flatTree = value.mode === 'flat' ? value : null\n  const updateFlatCondition = (id: string, patch: Partial<FilterCondition>) => {\n    if (!flatTree) return\n    onChange({\n      ...flatTree,\n      children: flatTree.children.map((c) => (c.id === id ? { ...c, ...patch } : c)),\n    })\n  }\n  const removeFlatCondition = (id: string) => {\n    if (!flatTree) return\n    onChange({ ...flatTree, children: flatTree.children.filter((c) => c.id !== id) })\n  }\n  const addFlatCondition = () => {\n    if (!flatTree) return\n    // K13 fix(2026-05-04):加篩選 → empty row(field 未選 → op+value disabled)\n    //   World-class:Notion / Coda / ClickUp 不 auto-select;對齊 initial mount canonical\n    onChange({ ...flatTree, children: [...flatTree.children, newEmptyCondition()] })\n  }\n  const setFlatConjunction = (conj: Conjunction) => {\n    if (!flatTree) return\n    onChange({ ...flatTree, conjunction: conj })\n  }\n\n  // ── nested-mode mutators ──\n  const nestedTree = value.mode === 'nested' ? value : null\n  const updateGroup = (groupId: string, patch: Partial<FilterGroup>) => {\n    if (!nestedTree) return\n    onChange({\n      ...nestedTree,\n      children: nestedTree.children.map((g) => (g.id === groupId ? { ...g, ...patch } : g)),\n    })\n  }\n  const updateGroupCondition = (groupId: string, condId: string, patch: Partial<FilterCondition>) => {\n    if (!nestedTree) return\n    onChange({\n      ...nestedTree,\n      children: nestedTree.children.map((g) =>\n        g.id === groupId\n          ? { ...g, children: g.children.map((c) => (c.id === condId ? { ...c, ...patch } : c)) }\n          : g\n      ),\n    })\n  }\n  const removeGroupCondition = (groupId: string, condId: string) => {\n    if (!nestedTree) return\n    onChange({\n      ...nestedTree,\n      children: nestedTree.children.map((g) =>\n        g.id === groupId ? { ...g, children: g.children.filter((c) => c.id !== condId) } : g\n      ),\n    })\n  }\n  // K13 fix(2026-05-04):同 addFlatCondition,巢狀內加條件也 empty row\n  const addConditionToGroup = (groupId: string) => {\n    if (!nestedTree) return\n    onChange({\n      ...nestedTree,\n      children: nestedTree.children.map((g) =>\n        g.id === groupId ? { ...g, children: [...g.children, newEmptyCondition()] } : g\n      ),\n    })\n  }\n  const removeGroup = (groupId: string) => {\n    if (!nestedTree) return\n    onChange({ ...nestedTree, children: nestedTree.children.filter((g) => g.id !== groupId) })\n  }\n  const addGroup = () => {\n    if (!nestedTree) return\n    // K13:加群組也用 empty group\n    onChange({ ...nestedTree, children: [...nestedTree.children, newEmptyGroup()] })\n  }\n  const setRootConjunction = (conj: Conjunction) => {\n    if (!nestedTree) return\n    onChange({ ...nestedTree, conjunction: conj })\n  }\n\n  return (\n    // 寬度策略:desktop 680px;mobile 縮到 viewport 內留 32px 邊(避溢出 popover 切右半)。\n    // 對齊 Notion / Airtable 的 advanced filter 在 mobile 走 full-width 邊處理。\n    // **#8 fix(2026-05-04)**:popover width by mode(由 cell min-w 與 group nested chrome 反推)\n    //   flat:cell ConjunctionLabel(80) + gap-2(8) + FCG(field-min 160 + op-min 120 + value 200) +\n    //         gap-2(8) + trash(28) + 2×loose padding(32) = ~636 → 640px\n    //   nested:再加 group p-2 (16) + outer ConjunctionLabel (80) + outer gap (8) → ~740 → 760px\n    //   對齊 Airtable / Notion / Linear filter row 視覺密度 @benchmark-unverified(non-OSS)\n    // **K11 fix(2026-05-04)**:viewport-aware scroll chain invariant\n    //   parent PopoverContent 是 flex flex-col + max-h + overflow-hidden,\n    //   panel root 必 forward `flex flex-col h-full` 才能讓 SurfaceBody flex-1 min-h-0 overflow-y-auto 生效\n    //   無此 forward → 中間 wrapper 斷鏈 → body 不 scroll(ProfileCard 因為自身設 max-h flex-col 才繞過)\n    //   詳 overlay-surface.spec.md「viewport-aware scroll chain invariant」段\n    // K11 v2 fix(2026-05-04):flex item 預設 min-h:auto 讓 content 撐 height,h-full 失效。\n    // 必加 `min-h-0` 才能讓 panel 在 PopoverContent max-h cap 下正確 shrink + body scroll。\n    <div ref={ref} className={cn(\n      'flex flex-col h-full min-h-0',\n      mode === 'nested'\n        ? 'w-[min(760px,calc(100vw-2rem))]'\n        : 'w-[min(640px,calc(100vw-2rem))]',\n      className,\n    )}>\n      {/* Popover 派輕量 chrome — slot 走 COMPACT_HEADER_SLOT(=21,衍生自 PopoverTitle text-body line-box),header 自然 ~45px */}\n      <SurfaceHeader className={COMPACT_HEADER_SLOT}>\n        <PopoverTitle className=\"flex-1\">篩選</PopoverTitle>\n        {/* Refresh icon — 只在 value ≠ defaultValue 時顯示(對齊 sort modified-from-default UX)\n            含 ButtonDivider 對齊「欄位顯示」+「排序」chrome corner action canonical(2026-05-04) */}\n        {defaultValue && !isFilterTreeEqual(value, defaultValue) && (\n          <>\n            <Button\n              variant=\"text\" size=\"sm\" iconOnly startIcon={RotateCcw}\n              aria-label=\"恢復預設\"\n              onClick={() => onChange(defaultValue)}\n            />\n            {onClose && <ButtonDivider />}\n          </>\n        )}\n        {onClose && (\n          <PopoverClose asChild>\n            <Button data-dismiss iconOnly dismiss size=\"sm\" startIcon={XIcon} aria-label=\"關閉\" onClick={onClose} />\n          </PopoverClose>\n        )}\n      </SurfaceHeader>\n\n      {/* Body — flat / nested 條件;空條件 → 直接顯 + 加篩選 CTA(對齊 Notion / Airtable / Linear inline 派,\n          無條件時不需要 Empty 元件大區塊,單顆 CTA 引導即可。SurfaceFooter 整層拔除,\n          + Add filter / + 加篩選器 inline 緊貼最後一條 row,讓 user 感受到「條件」與「加入」屬同一語境)*/}\n      <SurfaceBody className=\"flex flex-col gap-[var(--layout-space-tight)]\">\n        {flatTree && flatTree.children.map((cond, idx) => (\n          <FilterRow\n            key={cond.id}\n            index={idx}\n            condition={cond}\n            conjunction={flatTree.conjunction}\n            filterableColumns={filterableColumns}\n            fieldOptions={fieldOptions}\n            onChangeConjunction={setFlatConjunction}\n            onChangeField={(v) => {\n              const newCol = filterableColumns.find((c) => c.id === v)\n              updateFlatCondition(cond.id, { field: v, op: getDefaultOperator(newCol?.type), value: '', datePrecision: datePrecisionOf(newCol) })\n            }}\n            onChangeOp={(v) => updateFlatCondition(cond.id, { op: v, value: '' })}\n            onChangeValue={(v) => updateFlatCondition(cond.id, { value: v })}\n            onRemove={() => removeFlatCondition(cond.id)}\n          />\n        ))}\n\n        {nestedTree && nestedTree.children.map((group, gIdx) => (\n          <GroupBlock\n            key={group.id}\n            index={gIdx}\n            group={group}\n            rootConjunction={nestedTree.conjunction}\n            filterableColumns={filterableColumns}\n            fieldOptions={fieldOptions}\n            onChangeRootConjunction={setRootConjunction}\n            onChangeGroupConjunction={(c) => updateGroup(group.id, { conjunction: c })}\n            onChangeCondition={(condId, patch) => updateGroupCondition(group.id, condId, patch)}\n            onRemoveCondition={(condId) => removeGroupCondition(group.id, condId)}\n            onAddCondition={() => addConditionToGroup(group.id)}\n            onRemoveGroup={() => removeGroup(group.id)}\n          />\n        ))}\n\n        {/* Inline CTA(2026-05-04 A1)— root-level「加篩選」用 tertiary(視覺輕量但有邊界,\n            符合 root-CTA 視覺重量);nested 內「加入巢狀篩選」走 text variant(更輕,在 group 內 inline)\n            不放 SurfaceFooter:條件與「加入」屬同一語義群,中間插 footer 切斷敘事 */}\n        <div>\n          <Button\n            variant=\"tertiary\" size=\"sm\" startIcon={Plus}\n            onClick={mode === 'flat' ? addFlatCondition : addGroup}\n          >\n            {mode === 'nested' ? '加入篩選器' : '加篩選'}\n          </Button>\n        </div>\n      </SurfaceBody>\n    </div>\n  )\n}\n\n// Generic + ref forward 套 cast 的 idiom — 對齊 DataTable(同檔家)。\n// React.forwardRef 對 generic component 會丟掉 type param,改 cast 成 generic-preserving signature。\nexport const DataTableFilterPanel = React.forwardRef(DataTableFilterPanelInner) as <TData>(\n  props: DataTableFilterPanelProps<TData> & { ref?: React.ForwardedRef<HTMLDivElement> }\n) => React.ReactElement\n;(DataTableFilterPanel as { displayName?: string }).displayName = 'DataTableFilterPanel'\n"],"names":["XIcon"],"mappings":"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"}

package/dist/components/DataTable/data-table-filter-value-picker.d.ts

@@ -0,0 +1,29 @@
+import { type ValueShape } from './filter-operators';
+export interface FilterValuePickerColInfo {
+    id: string;
+    label: string;
+    options?: Array<{
+        value: string;
+        label: string;
+    }>;
+    /** Person pool — person/multiPerson filter picker 用(2026-05-07 升級,SSOT 對齊 cell-registry) */
+    people?: Array<{
+        name: string;
+        avatarUrl?: string;
+        description?: string;
+    }>;
+}
+export interface FilterValuePickerProps {
+    shape: ValueShape | null;
+    value: unknown;
+    onChange: (v: unknown) => void;
+    colInfo?: FilterValuePickerColInfo;
+    disabled?: boolean;
+    /** 用 column.label 組「{label} 篩選值」(panel 每 row 不顯式 label,a11y 必填) */
+    ariaLabel?: string;
+    /** Forward 給內部 Field control 的 className(2026-05-04 #2 fix)
+     *  避免外層包 wrapper div 破壞 FieldControlGroup CSS variants(rounded radii / margin overlap) */
+    className?: string;
+}
+export declare function FilterValuePicker({ shape, value, onChange, colInfo, disabled, ariaLabel, className, }: FilterValuePickerProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=data-table-filter-value-picker.d.ts.map

package/dist/components/DataTable/data-table-filter-value-picker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-table-filter-value-picker.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/data-table-filter-value-picker.tsx"],"names":[],"mappings":"AAoBA,OAAO,EAGL,KAAK,UAAU,EAChB,MAAM,oBAAoB,CAAA;AAS3B,MAAM,WAAW,wBAAwB;IACvC,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IACjD,4FAA4F;IAC5F,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;CAC3E;AAED,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE,UAAU,GAAG,IAAI,CAAA;IACxB,KAAK,EAAE,OAAO,CAAA;IACd,QAAQ,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAA;IAC9B,OAAO,CAAC,EAAE,wBAAwB,CAAA;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,mEAAmE;IACnE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;8FAC0F;IAC1F,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,KAAK,EACL,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,SAAS,EACT,SAAS,GACV,EAAE,sBAAsB,kDA8KxB"}