@multiplatform.one/table 6.1.0 → 6.3.0

package/dist/cjs/components/DataTableFilterButton/index.native.js

@@ -0,0 +1,402 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var DataTableFilterButton_exports = {};
+__export(DataTableFilterButton_exports, {
+  DataTableFilterButton: () => DataTableFilterButton
+});
+module.exports = __toCommonJS(DataTableFilterButton_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("@phosphor-icons/react");
+var import_components = require("@multiplatform.one/components");
+var import_forms = require("@multiplatform.one/forms");
+var import_theme = require("@multiplatform.one/theme");
+var import_react2 = require("react");
+var import_tamagui = require("tamagui");
+var import_t = require("../../shared/t.native.js");
+var import_filterFields = require("../../utils/filterFields.native.js");
+var import_DataTableStateContext = require("../DataTable/DataTableStateContext.native.js");
+var import_FilterOperatorValueEditor = require("../FilterOperatorValueEditor/index.native.js");
+function FieldRow(param) {
+  var {
+    field,
+    highlighted,
+    onSelect
+  } = param;
+  var {
+    knobProps
+  } = (0, import_theme.useResolvedKnobs)();
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
+    role: "option",
+    "aria-selected": highlighted,
+    tabIndex: 0,
+    cursor: "pointer",
+    paddingHorizontal: "$2.5",
+    paddingVertical: "$2",
+    ...knobProps.borderRadius,
+    backgroundColor: highlighted ? "$color4" : "transparent",
+    hoverStyle: {
+      backgroundColor: "$color4"
+    },
+    pressStyle: {
+      backgroundColor: "$color5"
+    },
+    focusVisibleStyle: {
+      outlineColor: "$outlineColor",
+      outlineWidth: 2,
+      outlineStyle: "solid"
+    },
+    onPress: function onPress() {
+      return onSelect(field);
+    },
+    onKeyDown: function onKeyDown(e) {
+      if (e.key === "Enter" || e.key === " ") {
+        e.preventDefault();
+        onSelect(field);
+      }
+    },
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+      fontSize: "$3",
+      color: "$color12",
+      numberOfLines: 1,
+      children: field.label
+    })
+  });
+}
+function GroupHeader(param) {
+  var {
+    children
+  } = param;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+    fontSize: "$1",
+    fontWeight: "600",
+    color: "$color10",
+    textTransform: "uppercase",
+    letterSpacing: 0.5,
+    paddingHorizontal: "$2.5",
+    paddingTop: "$2",
+    paddingBottom: "$1",
+    children
+  });
+}
+function DataTableFilterButton() {
+  var _ref, _ref1, _ref2, _ref3;
+  var _ctx_computed, _ctx_filterUi, _ctx_state_filters, _ctx_state_columnFilters;
+  var ctx = (0, import_DataTableStateContext.useDataTableState)();
+  var {
+    knobProps
+  } = (0, import_theme.useResolvedKnobs)();
+  var viewportGtSm = (0, import_forms.useViewportGtSm)();
+  var BackCaretIcon = (0, import_components.useDirection)() === "rtl" ? import_react.CaretRightIcon : import_react.CaretLeftIcon;
+  var [open, setOpen] = (0, import_react2.useState)(false);
+  var [search, setSearch] = (0, import_react2.useState)("");
+  var [highlightedIndex, setHighlightedIndex] = (0, import_react2.useState)(0);
+  var [activeField, setActiveField] = (0, import_react2.useState)(null);
+  var [operator, setOperator] = (0, import_react2.useState)("contains");
+  var [value, setValue] = (0, import_react2.useState)("");
+  var [columnTarget, setColumnTarget] = (0, import_react2.useState)(null);
+  var advancedIdRef = (0, import_react2.useRef)(null);
+  var [editingExisting, setEditingExisting] = (0, import_react2.useState)(false);
+  var fields = (_ref = ctx === null || ctx === void 0 ? void 0 : (_ctx_computed = ctx.computed) === null || _ctx_computed === void 0 ? void 0 : _ctx_computed.filterFields) !== null && _ref !== void 0 ? _ref : [];
+  var table = ctx === null || ctx === void 0 ? void 0 : ctx.table;
+  var visibleColumnIds = (0, import_react2.useMemo)(function () {
+    if (!table) return /* @__PURE__ */new Set();
+    return new Set(table.getVisibleLeafColumns().map(function (c) {
+      return c.id;
+    }));
+  }, [table, open]);
+  var query = search.trim().toLowerCase();
+  var matching = (0, import_react2.useMemo)(function () {
+    return query ? fields.filter(function (f) {
+      return f.label.toLowerCase().includes(query) || f.id.toLowerCase().includes(query);
+    }) : fields;
+  }, [fields, query]);
+  var columnFields = (0, import_react2.useMemo)(function () {
+    return matching.filter(function (f) {
+      return visibleColumnIds.has(f.id);
+    });
+  }, [matching, visibleColumnIds]);
+  var moreFields = (0, import_react2.useMemo)(function () {
+    return matching.filter(function (f) {
+      return !visibleColumnIds.has(f.id);
+    });
+  }, [matching, visibleColumnIds]);
+  var flatList = (0, import_react2.useMemo)(function () {
+    return [...columnFields, ...moreFields];
+  }, [columnFields, moreFields]);
+  var resetEditor = (0, import_react2.useCallback)(function () {
+    setActiveField(null);
+    setColumnTarget(null);
+    setEditingExisting(false);
+    advancedIdRef.current = null;
+    setSearch("");
+    setHighlightedIndex(0);
+  }, []);
+  var commit = (0, import_react2.useCallback)(function (field, op, val) {
+    if (!ctx) return;
+    var noValue = (0, import_filterFields.operatorNeedsNoValue)(op);
+    var filterValue = {
+      operator: op,
+      value: noValue ? null : val
+    };
+    if (columnTarget) {
+      var _table_getColumn;
+      table === null || table === void 0 ? void 0 : (_table_getColumn = table.getColumn(columnTarget)) === null || _table_getColumn === void 0 ? void 0 : _table_getColumn.setFilterValue(filterValue);
+      return;
+    }
+    var meaningful = noValue || val !== "";
+    if (advancedIdRef.current) {
+      var _ctx_actions_updateFilter, _ctx_actions;
+      (_ctx_actions_updateFilter = (_ctx_actions = ctx.actions).updateFilter) === null || _ctx_actions_updateFilter === void 0 ? void 0 : _ctx_actions_updateFilter.call(_ctx_actions, advancedIdRef.current, {
+        columnId: field.id,
+        value: filterValue,
+        label: field.label
+      });
+    } else if (meaningful) {
+      var _ctx_actions_addFilter;
+      advancedIdRef.current = (_ctx_actions_addFilter = ctx.actions.addFilter({
+        columnId: field.id,
+        value: filterValue,
+        label: field.label
+      })) !== null && _ctx_actions_addFilter !== void 0 ? _ctx_actions_addFilter : null;
+    }
+  }, [ctx, columnTarget, table]);
+  var handleSelectField = (0, import_react2.useCallback)(function (field) {
+    setActiveField(field);
+    setOperator((0, import_filterFields.defaultOperatorForFilterType)(field.type));
+    setValue("");
+    setEditingExisting(false);
+    advancedIdRef.current = null;
+    setColumnTarget(null);
+  }, []);
+  var handleOperatorChange = (0, import_react2.useCallback)(function (op) {
+    setOperator(op);
+    if (activeField) commit(activeField, op, value);
+  }, [activeField, commit, value]);
+  var handleValueChange = (0, import_react2.useCallback)(function (val) {
+    setValue(val);
+    if (activeField) commit(activeField, operator, val);
+  }, [activeField, commit, operator]);
+  var handleOpenChange = (0, import_react2.useCallback)(function (next) {
+    setOpen(next);
+    if (next) return;
+    var id = advancedIdRef.current;
+    if (id && !(0, import_filterFields.operatorNeedsNoValue)(operator) && value === "") {
+      ctx === null || ctx === void 0 ? void 0 : ctx.actions.removeFilter(id);
+    }
+    resetEditor();
+  }, [ctx, operator, value, resetEditor]);
+  var handleRemoveCurrent = (0, import_react2.useCallback)(function () {
+    if (columnTarget) {
+      var _table_getColumn;
+      table === null || table === void 0 ? void 0 : (_table_getColumn = table.getColumn(columnTarget)) === null || _table_getColumn === void 0 ? void 0 : _table_getColumn.setFilterValue(void 0);
+    } else if (advancedIdRef.current) {
+      ctx === null || ctx === void 0 ? void 0 : ctx.actions.removeFilter(advancedIdRef.current);
+    }
+    advancedIdRef.current = null;
+    resetEditor();
+  }, [ctx, columnTarget, table, resetEditor]);
+  var editTarget = (_ref1 = ctx === null || ctx === void 0 ? void 0 : (_ctx_filterUi = ctx.filterUi) === null || _ctx_filterUi === void 0 ? void 0 : _ctx_filterUi.editTarget) !== null && _ref1 !== void 0 ? _ref1 : null;
+  (0, import_react2.useEffect)(function () {
+    var _ctx_filterUi2;
+    if (!editTarget || !ctx) return;
+    (_ctx_filterUi2 = ctx.filterUi) === null || _ctx_filterUi2 === void 0 ? void 0 : _ctx_filterUi2.requestEdit(null);
+    var openWith = function openWith2(field2, filterValue, target) {
+      var _filterValue_value;
+      setActiveField(field2);
+      setOperator(filterValue.operator);
+      setValue(String((_filterValue_value = filterValue.value) !== null && _filterValue_value !== void 0 ? _filterValue_value : ""));
+      setEditingExisting(true);
+      setColumnTarget(target.kind === "column" ? target.columnId : null);
+      advancedIdRef.current = target.kind === "advanced" ? target.filterId : null;
+      setOpen(true);
+    };
+    if (editTarget.kind === "advanced") {
+      var filter = ctx.state.filters.find(function (f) {
+        return f.id === editTarget.filterId;
+      });
+      var field = filter && fields.find(function (f) {
+        return f.id === filter.columnId;
+      });
+      if (filter && field) openWith(field, filter.value, editTarget);
+    } else if (editTarget.kind === "column") {
+      var columnFilter = ctx.state.columnFilters.find(function (cf) {
+        return cf.id === editTarget.columnId;
+      });
+      var field1 = fields.find(function (f) {
+        return f.id === editTarget.columnId;
+      });
+      if (field1 && columnFilter && (0, import_filterFields.isFilterValueShape)(columnFilter.value)) {
+        openWith(field1, columnFilter.value, editTarget);
+      }
+    } else {
+      resetEditor();
+      setOpen(true);
+    }
+  }, [editTarget, ctx, fields, resetEditor]);
+  var handleListKeyDown = (0, import_react2.useCallback)(function (e) {
+    if (e.key === "ArrowDown") {
+      e.preventDefault();
+      setHighlightedIndex(function (i) {
+        return Math.min(i + 1, flatList.length - 1);
+      });
+    } else if (e.key === "ArrowUp") {
+      e.preventDefault();
+      setHighlightedIndex(function (i) {
+        return Math.max(i - 1, 0);
+      });
+    } else if (e.key === "Enter") {
+      e.preventDefault();
+      var field = flatList[highlightedIndex];
+      if (field) handleSelectField(field);
+    } else if (e.key === "Escape") {
+      e.preventDefault();
+      handleOpenChange(false);
+    }
+  }, [flatList, highlightedIndex, handleSelectField, handleOpenChange]);
+  if (!ctx || fields.length === 0) return null;
+  var activeChipCount = ((_ref2 = (_ctx_state_filters = ctx.state.filters) === null || _ctx_state_filters === void 0 ? void 0 : _ctx_state_filters.length) !== null && _ref2 !== void 0 ? _ref2 : 0) + ((_ref3 = (_ctx_state_columnFilters = ctx.state.columnFilters) === null || _ctx_state_columnFilters === void 0 ? void 0 : _ctx_state_columnFilters.filter(function (cf) {
+    return (0, import_filterFields.isFilterValueShape)(cf.value);
+  }).length) !== null && _ref3 !== void 0 ? _ref3 : 0);
+  var sheetMode = !import_tamagui.isWeb || !viewportGtSm;
+  var trigger = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Button, {
+    size: "$3",
+    variant: "outlined",
+    "aria-label": (0, import_t.t)("Filter"),
+    icon: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.FunnelIcon, {
+      size: 14,
+      weight: activeChipCount > 0 ? "fill" : "regular"
+    }),
+    ...(sheetMode ? {
+      onPress: function onPress() {
+        return handleOpenChange(!open);
+      }
+    } : {}),
+    children: activeChipCount > 0 ? `${(0, import_t.t)("Filter")} (${activeChipCount})` : (0, import_t.t)("Filter")
+  });
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.FloatingPanel, {
+    open,
+    onOpenChange: handleOpenChange,
+    trigger,
+    fitContent: true,
+    scrollable: false,
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
+      minWidth: 280,
+      maxWidth: 360,
+      ...knobProps.gap,
+      children: activeField ?
+      // Stage 2 — operator/value editor (live commit, no Apply)
+      /* @__PURE__ */
+      (0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+        ...knobProps.gap,
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+          alignItems: "center",
+          gap: "$2",
+          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Button, {
+            size: "$2",
+            chromeless: true,
+            "aria-label": (0, import_t.t)("Back to field list"),
+            onPress: function onPress() {
+              resetEditor();
+            },
+            icon: /* @__PURE__ */(0, import_jsx_runtime.jsx)(BackCaretIcon, {
+              size: 14
+            })
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+            fontSize: knobProps.sizeToken,
+            fontWeight: "600",
+            color: "$color11",
+            flex: 1,
+            children: (0, import_t.t)("Filter: {{column}}", {
+              column: activeField.label
+            })
+          })]
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_FilterOperatorValueEditor.FilterOperatorValueEditor, {
+          fieldType: activeField.type,
+          operator,
+          value,
+          onOperatorChange: handleOperatorChange,
+          onValueChange: handleValueChange,
+          options: activeField.options
+        }), editingExisting && /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.XStack, {
+          justifyContent: "flex-end",
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Button, {
+            size: "$2",
+            variant: "outlined",
+            onPress: handleRemoveCurrent,
+            children: (0, import_t.t)("Remove filter")
+          })
+        })]
+      }) :
+      // Stage 1 — searchable field list, visible columns first
+      /* @__PURE__ */
+      (0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+        ...knobProps.gap,
+        onKeyDown: handleListKeyDown,
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.SearchInput, {
+          value: search,
+          onChange: function onChange(text) {
+            setSearch(text);
+            setHighlightedIndex(0);
+          },
+          debounceMs: 0,
+          placeholder: (0, import_t.t)("Search fields..."),
+          size: "$3",
+          compact: true,
+          "aria-label": (0, import_t.t)("Search fields")
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+          role: "list",
+          "aria-label": (0, import_t.t)("Filterable fields"),
+          maxHeight: 320,
+          overflow: "scroll",
+          children: [columnFields.length > 0 && /* @__PURE__ */(0, import_jsx_runtime.jsx)(GroupHeader, {
+            children: (0, import_t.t)("Columns")
+          }), columnFields.map(function (field) {
+            var _flatList_highlightedIndex;
+            return /* @__PURE__ */(0, import_jsx_runtime.jsx)(FieldRow, {
+              field,
+              highlighted: ((_flatList_highlightedIndex = flatList[highlightedIndex]) === null || _flatList_highlightedIndex === void 0 ? void 0 : _flatList_highlightedIndex.id) === field.id,
+              onSelect: handleSelectField
+            }, field.id);
+          }), moreFields.length > 0 && /* @__PURE__ */(0, import_jsx_runtime.jsx)(GroupHeader, {
+            children: (0, import_t.t)("More fields")
+          }), moreFields.map(function (field) {
+            var _flatList_highlightedIndex;
+            return /* @__PURE__ */(0, import_jsx_runtime.jsx)(FieldRow, {
+              field,
+              highlighted: ((_flatList_highlightedIndex = flatList[highlightedIndex]) === null || _flatList_highlightedIndex === void 0 ? void 0 : _flatList_highlightedIndex.id) === field.id,
+              onSelect: handleSelectField
+            }, field.id);
+          }), flatList.length === 0 && /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+            fontSize: "$2",
+            color: "$color10",
+            padding: "$2.5",
+            children: (0, import_t.t)("No fields match")
+          })]
+        })]
+      })
+    })
+  });
+}
+//# sourceMappingURL=index.native.js.map

package/dist/cjs/components/DataTableFilterButton/index.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","DataTableFilterButton_exports","__export","DataTableFilterButton","module","exports","import_jsx_runtime","require","import_react","import_components","import_forms","import_theme","import_react2","import_tamagui","import_t","import_filterFields","import_DataTableStateContext","import_FilterOperatorValueEditor","FieldRow","param","field","highlighted","onSelect","knobProps","useResolvedKnobs","jsx","View","role","tabIndex","cursor","paddingHorizontal","paddingVertical","borderRadius","backgroundColor","hoverStyle","pressStyle","focusVisibleStyle","outlineColor","outlineWidth","outlineStyle","onPress","onKeyDown","e","key","preventDefault","children","Text","fontSize","color","numberOfLines","label","GroupHeader","fontWeight","textTransform","letterSpacing","paddingTop","paddingBottom","_ref","_ref1","_ref2","_ref3","_ctx_computed","_ctx_filterUi","_ctx_state_filters","_ctx_state_columnFilters","ctx","useDataTableState","viewportGtSm","useViewportGtSm","BackCaretIcon","useDirection","CaretRightIcon","CaretLeftIcon","open","setOpen","useState","search","setSearch","highlightedIndex","setHighlightedIndex","activeField","setActiveField","operator","setOperator","setValue","columnTarget","setColumnTarget","advancedIdRef","useRef","editingExisting","setEditingExisting","fields","computed","filterFields","table","visibleColumnIds","useMemo","Set","getVisibleLeafColumns","map","c","id","query","trim","toLowerCase","matching","filter","f","includes","columnFields","has","moreFields","flatList","resetEditor","useCallback","current","commit","op","val","noValue","operatorNeedsNoValue","filterValue","_table_getColumn","getColumn","setFilterValue","meaningful","_ctx_actions_updateFilter","_ctx_actions","actions","updateFilter","call","columnId","_ctx_actions_addFilter","addFilter","handleSelectField","defaultOperatorForFilterType","type","handleOperatorChange","handleValueChange","handleOpenChange","next","removeFilter","handleRemoveCurrent","editTarget","filterUi","useEffect","_ctx_filterUi2","requestEdit","openWith","openWith2","field2","target","_filterValue_value","String","kind","filterId","state","filters","find","columnFilter","columnFilters","cf","field1","isFilterValueShape","handleListKeyDown","i","Math","min","length","max","activeChipCount","sheetMode","isWeb","trigger","Button","size","variant","t","icon","FunnelIcon","weight","FloatingPanel","onOpenChange","fitContent","scrollable","YStack","minWidth","maxWidth","gap","jsxs","XStack","alignItems"],"sources":["../../../../src/components/DataTableFilterButton/index.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/DataTableFilterChips/index.cjs

@@ -0,0 +1,120 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var DataTableFilterChips_exports = {};
+__export(DataTableFilterChips_exports, {
+  DataTableFilterChips: () => DataTableFilterChips
+});
+module.exports = __toCommonJS(DataTableFilterChips_exports);
+var import_forms = require("@multiplatform.one/forms");
+var import_forms2 = require("@multiplatform.one/forms");
+var import_theme = require("@multiplatform.one/theme");
+var import_react = require("react");
+var import_tamagui = require("tamagui");
+var import_t = require("../../shared/t.cjs");
+var import_filterFields = require("../../utils/filterFields.cjs");
+var import_DataTableStateContext = require("../DataTable/DataTableStateContext.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+function DataTableFilterChips() {
+  const ctx = (0, import_DataTableStateContext.useDataTableState)();
+  const {
+    knobProps
+  } = (0, import_theme.useResolvedKnobs)();
+  const fields = ctx?.computed?.filterFields ?? [];
+  const fieldFor = (0, import_react.useCallback)(id => fields.find(f => f.id === id), [fields]);
+  const chips = (0, import_react.useMemo)(() => {
+    if (!ctx) return [];
+    const items = [];
+    for (const filter of ctx.state.filters ?? []) {
+      const field = fieldFor(filter.columnId);
+      const label = (0, import_filterFields.getFilterChipLabel)(field?.label ?? filter.label ?? filter.columnId, filter.value, field?.options);
+      items.push({
+        key: `advanced-${filter.id}`,
+        label,
+        target: {
+          kind: "advanced",
+          filterId: filter.id
+        },
+        onRemove: () => ctx.actions.removeFilter(filter.id)
+      });
+    }
+    for (const columnFilter of ctx.state.columnFilters ?? []) {
+      if (!(0, import_filterFields.isFilterValueShape)(columnFilter.value)) continue;
+      const field = fieldFor(columnFilter.id);
+      const label = (0, import_filterFields.getFilterChipLabel)(field?.label ?? columnFilter.id, columnFilter.value, field?.options);
+      items.push({
+        key: `column-${columnFilter.id}`,
+        label,
+        target: {
+          kind: "column",
+          columnId: columnFilter.id
+        },
+        onRemove: () => ctx.table.getColumn(columnFilter.id)?.setFilterValue(void 0)
+      });
+    }
+    return items;
+  }, [ctx, ctx?.state.filters, ctx?.state.columnFilters, fieldFor]);
+  const handleClearAll = (0, import_react.useCallback)(() => {
+    if (!ctx) return;
+    ctx.actions.setFilters([]);
+    ctx.table.setColumnFilters(prev => prev.filter(cf => !(0, import_filterFields.isFilterValueShape)(cf.value)));
+  }, [ctx]);
+  if (!ctx || chips.length === 0) return null;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+    flexWrap: "wrap",
+    alignItems: "center",
+    gap: "$2",
+    paddingVertical: "$1.5",
+    "aria-label": (0, import_t.t)("Active filters"),
+    children: [chips.map(chip => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
+      role: "button",
+      tabIndex: 0,
+      "aria-label": (0, import_t.t)("Edit filter {{label}}", {
+        label: chip.label
+      }),
+      cursor: "pointer",
+      ...knobProps.borderRadius,
+      focusVisibleStyle: {
+        outlineColor: "$outlineColor",
+        outlineWidth: 2,
+        outlineStyle: "solid"
+      },
+      onPress: () => ctx.filterUi?.requestEdit(chip.target),
+      onKeyDown: e => {
+        if (e.key === "Enter" || e.key === " ") {
+          e.preventDefault();
+          ctx.filterUi?.requestEdit(chip.target);
+        }
+      },
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms2.Chip, {
+        color: "blue",
+        onDismiss: chip.onRemove,
+        children: chip.label
+      })
+    }, chip.key)), chips.length >= 2 && /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Button, {
+      size: "$2",
+      chromeless: true,
+      onPress: handleClearAll,
+      children: (0, import_t.t)("Clear all")
+    })]
+  });
+}