tsense 0.2.0-next.0 → 0.2.0-next.3

package/dist/filters/filter-state.d.ts

@@ -11,6 +11,7 @@ export type FilterState = {
 };
 export declare function createInitialState(): FilterState;
 export declare function addRow(state: FilterState): FilterState;
+export declare function addRowWithField(state: FilterState, field: string): FilterState;
 export declare function removeRow(state: FilterState, index: number): FilterState;
 export declare function setRowField(state: FilterState, index: number, field: string): FilterState;
 export declare function setRowCondition(state: FilterState, index: number, condition: string): FilterState;

package/dist/filters/filter-state.js

@@ -11,11 +11,14 @@ const conditionToOperator = {
 };
 let nextRowId = 0;
 export function createInitialState() {
-    return { rows: [{ id: ++nextRowId }] };
+    return { rows: [] };
 }
 export function addRow(state) {
     return { rows: [...state.rows, { id: ++nextRowId }] };
 }
+export function addRowWithField(state, field) {
+    return { rows: [...state.rows, { id: ++nextRowId, field }] };
+}
 export function removeRow(state, index) {
     return { rows: state.rows.filter((_, i) => i !== index) };
 }
@@ -37,54 +40,63 @@ export function setRowValue(state, index, value) {
 export function clearState() {
     return { rows: [] };
 }
-export function applyPreset(state, descriptor, field, name) {
-    const column = descriptor.columns.find((c) => c.key === field);
-    const preset = column?.presets?.find((p) => p.name === name);
-    if (!preset)
-        return state;
-    const filterValue = preset.filter[field];
-    if (filterValue == null)
-        return state;
+function filterValueToRow(field, filterValue) {
+    if (filterValue == null) {
+        return null;
+    }
     if (Array.isArray(filterValue)) {
         return {
-            rows: [
-                ...state.rows,
-                { id: ++nextRowId, field, condition: "is_in", value: filterValue },
-            ],
+            id: ++nextRowId,
+            field,
+            condition: "is_in",
+            value: filterValue,
         };
     }
     if (typeof filterValue !== "object" || filterValue instanceof Date) {
         return {
-            rows: [
-                ...state.rows,
-                { id: ++nextRowId, field, condition: "equals", value: filterValue },
-            ],
+            id: ++nextRowId,
+            field,
+            condition: "equals",
+            value: filterValue,
         };
     }
-    const ops = filterValue;
-    const keys = Object.keys(ops);
+    const operators = filterValue;
+    const keys = Object.keys(operators);
     if (keys.includes("gte") && keys.includes("lte")) {
         return {
-            rows: [
-                ...state.rows,
-                {
-                    id: ++nextRowId,
-                    field,
-                    condition: "between",
-                    value: [ops.gte, ops.lte],
-                },
-            ],
+            id: ++nextRowId,
+            field,
+            condition: "between",
+            value: [operators.gte, operators.lte],
         };
     }
-    if (keys[0]) {
-        return {
-            rows: [
-                ...state.rows,
-                { id: ++nextRowId, field, condition: keys[0], value: ops[keys[0]] },
-            ],
-        };
+    if (!keys[0]) {
+        return null;
     }
-    return state;
+    return {
+        id: ++nextRowId,
+        field,
+        condition: keys[0],
+        value: operators[keys[0]],
+    };
+}
+export function applyPreset(state, descriptor, field, name) {
+    const column = descriptor.columns.find((c) => c.key === field);
+    const preset = column?.presets?.find((p) => p.name === name);
+    if (!preset) {
+        return state;
+    }
+    const rows = [];
+    for (const [key, value] of Object.entries(preset.filter)) {
+        const row = filterValueToRow(key, value);
+        if (row) {
+            rows.push(row);
+        }
+    }
+    if (!rows.length) {
+        return state;
+    }
+    return { rows };
 }
 export function conditionsFor(descriptor, field) {
     const column = descriptor.columns.find((c) => c.key === field);
@@ -98,8 +110,9 @@ export function columnFor(descriptor, field) {
     return column;
 }
 function isRowComplete(row) {
-    if (!row.field || !row.condition || row.value == null)
+    if (!row.field || !row.condition || row.value == null) {
         return false;
+    }
     if (row.condition === "between") {
         return (Array.isArray(row.value) && row.value[0] != null && row.value[1] != null);
     }
@@ -111,8 +124,9 @@ function isRowComplete(row) {
 export function buildResult(state) {
     const result = {};
     for (const row of state.rows) {
-        if (!isRowComplete(row))
+        if (!isRowComplete(row)) {
             continue;
+        }
         if (row.condition === "equals" || row.condition === "is_in") {
             result[row.field] = row.value;
             continue;
@@ -126,8 +140,9 @@ export function buildResult(state) {
             continue;
         }
         const operator = conditionToOperator[row.condition];
-        if (!operator)
+        if (!operator) {
             continue;
+        }
         const existing = result[row.field];
         if (typeof existing === "object" &&
             existing !== null &&

package/dist/filters/index.js

@@ -58,11 +58,23 @@ export function createFilterBuilder(collection, config, options) {
                 "not?": "string",
                 "notIn?": "string[]",
             });
+            const dateInput = "number | string | Date";
+            const dateOps = type.raw({
+                "not?": dateInput,
+                "gt?": dateInput,
+                "gte?": dateInput,
+                "lt?": dateInput,
+                "lte?": dateInput,
+                "notIn?": `(${dateInput})[]`,
+            });
             const fieldSchemas = {
                 number: type.raw("number").or(type.raw("number[]")).or(numberOps),
                 string: type.raw("string").or(type.raw("string[]")).or(stringOps),
                 boolean: type.raw("boolean"),
-                date: type.raw("number").or(type.raw("number[]")).or(numberOps),
+                date: type
+                    .raw(dateInput)
+                    .or(type.raw(`(${dateInput})[]`))
+                    .or(dateOps),
             };
             const descriptor = this.describe();
             const filterDef = {};

package/dist/filters/url.js

@@ -17,6 +17,11 @@ function coerceValue(raw, columnType) {
     }
     return raw;
 }
+function appendValues(params, key, values) {
+    for (const value of values) {
+        params.append(key, serializeValue(value));
+    }
+}
 export function serializeFilter(filter, descriptor) {
     const params = new URLSearchParams();
     const columnMap = new Map(descriptor.columns.map((c) => [c.key, c]));
@@ -26,12 +31,7 @@ export function serializeFilter(filter, descriptor) {
             continue;
         }
         if (Array.isArray(value)) {
-            if (value.length === 1) {
-                params.set(key, serializeValue(value[0]));
-            }
-            else if (value.length > 1) {
-                params.set(key, value.map((v) => serializeValue(v)).join(","));
-            }
+            appendValues(params, key, value);
             continue;
         }
         if (typeof value === "object" && !(value instanceof Date)) {
@@ -40,7 +40,7 @@ export function serializeFilter(filter, descriptor) {
                     continue;
                 }
                 if (Array.isArray(opValue)) {
-                    params.set(`${key}.${op}`, opValue.map((v) => serializeValue(v)).join(","));
+                    appendValues(params, `${key}.${op}`, opValue);
                 }
                 else {
                     params.set(`${key}.${op}`, serializeValue(opValue));
@@ -55,7 +55,13 @@ export function serializeFilter(filter, descriptor) {
 export function deserializeFilter(params, descriptor) {
     const result = {};
     const columnMap = new Map(descriptor.columns.map((c) => [c.key, c]));
-    for (const [paramKey, rawValue] of params.entries()) {
+    const visited = new Set();
+    for (const paramKey of params.keys()) {
+        if (visited.has(paramKey)) {
+            continue;
+        }
+        visited.add(paramKey);
+        const rawValues = params.getAll(paramKey);
         const dotIndex = paramKey.indexOf(".");
         if (dotIndex !== -1) {
             const field = paramKey.slice(0, dotIndex);
@@ -66,12 +72,10 @@ export function deserializeFilter(params, descriptor) {
             }
             const existing = (result[field] ?? {});
             if (ARRAY_OPERATORS.has(operator)) {
-                existing[operator] = rawValue
-                    .split(",")
-                    .map((v) => coerceValue(v, column.type));
+                existing[operator] = rawValues.map((value) => coerceValue(value, column.type));
             }
             else {
-                existing[operator] = coerceValue(rawValue, column.type);
+                existing[operator] = coerceValue(rawValues[0], column.type);
             }
             result[field] = existing;
             continue;
@@ -80,13 +84,11 @@ export function deserializeFilter(params, descriptor) {
         if (!column) {
             continue;
         }
-        if (rawValue.includes(",")) {
-            result[paramKey] = rawValue
-                .split(",")
-                .map((v) => coerceValue(v, column.type));
+        if (rawValues.length > 1) {
+            result[paramKey] = rawValues.map((value) => coerceValue(value, column.type));
         }
         else {
-            result[paramKey] = coerceValue(rawValue, column.type);
+            result[paramKey] = coerceValue(rawValues[0], column.type);
         }
     }
     return result;

package/dist/react/filter-builder/filter-builder-defaults.d.ts

@@ -0,0 +1,7 @@
+import type { AddButtonSlotProps, ConditionSelectSlotProps, FieldSelectSlotProps, PresetButtonSlotProps, RemoveButtonSlotProps, ValueInputSlotProps } from "./filter-builder-types.js";
+export declare function defaultFieldSelect({ columns, value, onChange }: FieldSelectSlotProps): import("react/jsx-runtime").JSX.Element;
+export declare function defaultConditionSelect({ conditions, value, onChange, disabled }: ConditionSelectSlotProps): import("react/jsx-runtime").JSX.Element;
+export declare function defaultValueInput({ column, condition, value, onChange }: ValueInputSlotProps): import("react/jsx-runtime").JSX.Element;
+export declare function defaultRemoveButton({ onClick }: RemoveButtonSlotProps): import("react/jsx-runtime").JSX.Element;
+export declare function defaultAddButton({ onClick }: AddButtonSlotProps): import("react/jsx-runtime").JSX.Element;
+export declare function defaultPresetButton({ preset, onClick }: PresetButtonSlotProps): import("react/jsx-runtime").JSX.Element;

package/dist/react/filter-builder/filter-builder-defaults.js

@@ -0,0 +1,86 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+function formatDateForInput(date) {
+    if (!(date instanceof Date)) {
+        return "";
+    }
+    return date.toISOString().slice(0, 10);
+}
+function parseDateInput(value) {
+    if (!value) {
+        return;
+    }
+    return new Date(value + "T00:00:00Z");
+}
+function parseNumberInput(value) {
+    if (!value) {
+        return;
+    }
+    return Number(value);
+}
+function parseBooleanInput(value) {
+    if (!value) {
+        return;
+    }
+    return value === "true";
+}
+function asTuple(value) {
+    if (Array.isArray(value)) {
+        return [value[0], value[1]];
+    }
+    return [undefined, undefined];
+}
+function renderSelectOptions(options, defaultValue) {
+    const allOptions = defaultValue
+        ? [{ key: "", label: defaultValue }, ...options]
+        : options;
+    return allOptions.map((option) => (_jsx("option", { value: option.key, children: option.label }, option.key)));
+}
+export function defaultFieldSelect({ columns, value, onChange, }) {
+    return (_jsx("select", { className: "rounded border px-2 py-1", value: value ?? "", onChange: (event) => onChange(event.target.value), children: renderSelectOptions(columns, "Column") }));
+}
+export function defaultConditionSelect({ conditions, value, onChange, disabled, }) {
+    return (_jsx("select", { className: "rounded border px-2 py-1", value: value ?? "", onChange: (event) => onChange(event.target.value), disabled: disabled, children: renderSelectOptions(conditions, "Condition") }));
+}
+export function defaultValueInput({ column, condition, value, onChange, }) {
+    if (condition === "between" && column.type === "date") {
+        const tuple = asTuple(value);
+        return (_jsxs("div", { className: "flex items-center gap-1", children: [_jsx("input", { className: "rounded border px-2 py-1", type: "date", value: formatDateForInput(tuple[0]), onChange: (event) => onChange([parseDateInput(event.target.value), tuple[1]]) }), _jsx("span", { className: "text-sm text-gray-500", children: "and" }), _jsx("input", { className: "rounded border px-2 py-1", type: "date", value: formatDateForInput(tuple[1]), onChange: (event) => onChange([tuple[0], parseDateInput(event.target.value)]) })] }));
+    }
+    if (condition === "between") {
+        const tuple = asTuple(value);
+        return (_jsxs("div", { className: "flex items-center gap-1", children: [_jsx("input", { className: "w-24 rounded border px-2 py-1", type: "number", value: String(tuple[0] ?? ""), onChange: (event) => onChange([parseNumberInput(event.target.value), tuple[1]]) }), _jsx("span", { className: "text-sm text-gray-500", children: "and" }), _jsx("input", { className: "w-24 rounded border px-2 py-1", type: "number", value: String(tuple[1] ?? ""), onChange: (event) => onChange([tuple[0], parseNumberInput(event.target.value)]) })] }));
+    }
+    if (column.values) {
+        const selected = Array.isArray(value) ? value : [];
+        return (_jsx("div", { className: "flex flex-wrap gap-2", children: column.values.map((option) => {
+                const checked = selected.includes(option.value);
+                return (_jsxs("label", { className: "flex cursor-pointer select-none items-center gap-1 text-sm", children: [_jsx("input", { type: "checkbox", checked: checked, onChange: () => onChange(checked
+                                ? selected.filter((item) => item !== option.value)
+                                : [...selected, option.value]) }), option.label] }, option.value));
+            }) }));
+    }
+    if (column.type === "date") {
+        return (_jsx("input", { className: "rounded border px-2 py-1", type: "date", value: formatDateForInput(value), onChange: (event) => onChange(parseDateInput(event.target.value)) }));
+    }
+    if (column.type === "number") {
+        return (_jsx("input", { className: "rounded border px-2 py-1", type: "number", value: String(value ?? ""), onChange: (event) => onChange(parseNumberInput(event.target.value)) }));
+    }
+    if (column.type === "boolean") {
+        const options = [
+            { key: "", label: "Value" },
+            { key: "true", label: "true" },
+            { key: "false", label: "false" },
+        ];
+        return (_jsx("select", { className: "rounded border px-2 py-1", value: value == null ? "" : String(value), onChange: (event) => onChange(parseBooleanInput(event.target.value)), children: renderSelectOptions(options) }));
+    }
+    return (_jsx("input", { className: "rounded border px-2 py-1", type: "text", value: typeof value === "string" ? value : "", onChange: (event) => onChange(event.target.value) }));
+}
+export function defaultRemoveButton({ onClick }) {
+    return (_jsx("button", { type: "button", className: "text-red-500 hover:text-red-700", onClick: onClick, children: "\u00D7" }));
+}
+export function defaultAddButton({ onClick }) {
+    return (_jsx("button", { type: "button", className: "text-blue-500 hover:text-blue-700", onClick: onClick, children: "+ Add filter" }));
+}
+export function defaultPresetButton({ preset, onClick, }) {
+    return (_jsx("button", { type: "button", className: "rounded bg-gray-100 px-2 py-1 text-sm hover:bg-gray-200", onClick: onClick, children: preset.name }));
+}

package/dist/react/filter-builder/filter-builder-types.d.ts

@@ -0,0 +1,58 @@
+import type { ReactNode } from "react";
+import type { FilterValue } from "../../filters/filter-state.js";
+import type { FilterDescriptor } from "../../filters/index.js";
+import type { FilterFor } from "../../types.js";
+export type FieldSelectSlotProps = {
+    columns: FilterDescriptor["columns"];
+    value: string | undefined;
+    onChange: (field: string) => void;
+};
+export type ConditionSelectSlotProps = {
+    conditions: FilterDescriptor["columns"][number]["conditions"];
+    value: string | undefined;
+    onChange: (condition: string) => void;
+    disabled: boolean;
+};
+export type ValueInputSlotProps = {
+    column: FilterDescriptor["columns"][number];
+    condition: string;
+    value: FilterValue;
+    onChange: (value: FilterValue) => void;
+};
+export type RemoveButtonSlotProps = {
+    onClick: () => void;
+};
+export type AddButtonSlotProps = {
+    onClick: () => void;
+};
+export type PresetButtonSlotProps = {
+    preset: {
+        field: string;
+        name: string;
+    };
+    onClick: () => void;
+};
+export type RowSlotProps = {
+    index: number;
+    fieldSelect: ReactNode;
+    conditionSelect: ReactNode;
+    valueInput: ReactNode | null;
+    removeButton: ReactNode;
+};
+export type RootSlotProps = {
+    rows: ReactNode;
+    addButton: ReactNode;
+    presets: ReactNode | null;
+};
+export type FilterBuilderProps<T> = {
+    descriptor: FilterDescriptor<T>;
+    onChange?: (filter: FilterFor<T>) => void;
+    renderRoot?: (props: RootSlotProps) => ReactNode;
+    renderRow?: (props: RowSlotProps) => ReactNode;
+    renderFieldSelect?: (props: FieldSelectSlotProps) => ReactNode;
+    renderConditionSelect?: (props: ConditionSelectSlotProps) => ReactNode;
+    renderValueInput?: (props: ValueInputSlotProps) => ReactNode;
+    renderAddButton?: (props: AddButtonSlotProps) => ReactNode;
+    renderRemoveButton?: (props: RemoveButtonSlotProps) => ReactNode;
+    renderPresetButton?: (props: PresetButtonSlotProps) => ReactNode;
+};

package/dist/react/filter-builder/filter-builder-types.js

@@ -0,0 +1 @@
+export {};

package/dist/react/filter-builder/filter-builder.d.ts

@@ -0,0 +1,3 @@
+import { type ReactNode } from "react";
+import type { FilterBuilderProps } from "./filter-builder-types.js";
+export declare function FilterBuilder<T>({ descriptor, onChange, renderRoot, renderRow, renderFieldSelect, renderConditionSelect, renderValueInput, renderAddButton, renderRemoveButton, renderPresetButton }: FilterBuilderProps<T>): ReactNode;

package/dist/react/filter-builder/filter-builder.js

@@ -0,0 +1,40 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment, useEffect, useRef } from "react";
+import { useFilterBuilder } from "../use-filter-builder.js";
+import { defaultAddButton, defaultConditionSelect, defaultFieldSelect, defaultPresetButton, defaultRemoveButton, defaultValueInput, } from "./filter-builder-defaults.js";
+export function FilterBuilder({ descriptor, onChange, renderRoot, renderRow, renderFieldSelect, renderConditionSelect, renderValueInput, renderAddButton, renderRemoveButton, renderPresetButton, }) {
+    const filters = useFilterBuilder(descriptor);
+    const onChangeRef = useRef(onChange);
+    onChangeRef.current = onChange;
+    useEffect(() => {
+        onChangeRef.current?.(filters.result);
+    }, [filters.result]);
+    const FieldSelect = renderFieldSelect ?? defaultFieldSelect;
+    const ConditionSelect = renderConditionSelect ?? defaultConditionSelect;
+    const ValueInput = renderValueInput ?? defaultValueInput;
+    const RemoveButton = renderRemoveButton ?? defaultRemoveButton;
+    const AddButton = renderAddButton ?? defaultAddButton;
+    const PresetButton = renderPresetButton ?? defaultPresetButton;
+    const rows = filters.rows.map((row, index) => {
+        const fieldSelect = (_jsx(FieldSelect, { columns: filters.columns, value: row.field, onChange: (field) => filters.setField(index, field) }));
+        const conditionSelect = (_jsx(ConditionSelect, { conditions: row.field ? filters.conditionsFor(row.field) : [], value: row.condition, onChange: (condition) => filters.setCondition(index, condition), disabled: !row.field }));
+        const valueInput = row.field && row.condition ? (_jsx(ValueInput, { column: filters.columnFor(row.field), condition: row.condition, value: row.value, onChange: (value) => filters.setValue(index, value) })) : null;
+        const removeButton = _jsx(RemoveButton, { onClick: () => filters.remove(index) });
+        if (renderRow) {
+            return (_jsx(Fragment, { children: renderRow({
+                    index,
+                    fieldSelect,
+                    conditionSelect,
+                    valueInput,
+                    removeButton,
+                }) }, row.id));
+        }
+        return (_jsxs("div", { className: "flex items-center gap-2", children: [fieldSelect, conditionSelect, valueInput, removeButton] }, row.id));
+    });
+    const addButton = _jsx(AddButton, { onClick: filters.add });
+    const presets = filters.presets.length > 0 ? (_jsx("div", { className: "flex flex-wrap gap-1 border-t pt-2", children: filters.presets.map((preset) => (_jsx(Fragment, { children: _jsx(PresetButton, { preset: preset, onClick: () => filters.applyPreset(preset.field, preset.name) }) }, `${preset.field}-${preset.name}`))) })) : null;
+    if (renderRoot) {
+        return _jsx(_Fragment, { children: renderRoot({ rows: _jsx(_Fragment, { children: rows }), addButton, presets }) });
+    }
+    return (_jsxs("div", { className: "flex flex-col gap-2", children: [rows, addButton, presets] }));
+}

package/dist/react/filter-builder.js

@@ -1,12 +1,7 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment, useEffect, useRef } from "react";
 import { useFilterBuilder } from "./use-filter-builder.js";
-function defaultFieldSelect({ columns, value, onChange, }) {
-    return (_jsxs("select", { className: "rounded border px-2 py-1", value: value ?? "", onChange: (e) => onChange(e.target.value), children: [_jsx("option", { value: "", children: "Column" }), columns.map((col) => (_jsx("option", { value: col.key, children: col.label }, col.key)))] }));
-}
-function defaultConditionSelect({ conditions, value, onChange, disabled, }) {
-    return (_jsxs("select", { className: "rounded border px-2 py-1", value: value ?? "", onChange: (e) => onChange(e.target.value), disabled: disabled, children: [_jsx("option", { value: "", children: "Condition" }), conditions.map((c) => (_jsx("option", { value: c.key, children: c.label }, c.key)))] }));
-}
+// ======== Helpers ========
 function formatDateForInput(date) {
     if (!(date instanceof Date))
         return "";
@@ -23,6 +18,18 @@ function asTuple(value) {
     }
     return [undefined, undefined];
 }
+function renderSelectOptions(options, defaultValue) {
+    const opts = defaultValue
+        ? [{ key: "", label: defaultValue }, ...options]
+        : options;
+    return opts.map((o) => (_jsx("option", { value: o.key, children: o.label }, o.key)));
+}
+function defaultFieldSelect({ columns, value, onChange, }) {
+    return (_jsx("select", { className: "rounded border px-2 py-1", value: value ?? "", onChange: (e) => onChange(e.target.value), children: renderSelectOptions(columns, "Column") }));
+}
+function defaultConditionSelect({ conditions, value, onChange, disabled, }) {
+    return (_jsx("select", { className: "rounded border px-2 py-1", value: value ?? "", onChange: (e) => onChange(e.target.value), disabled: disabled, children: renderSelectOptions(conditions, "Condition") }));
+}
 function defaultValueInput({ column, condition, value, onChange, }) {
     if (condition === "between" && column.type === "date") {
         const tuple = asTuple(value);
@@ -36,7 +43,7 @@ function defaultValueInput({ column, condition, value, onChange, }) {
         const selected = Array.isArray(value) ? value : [];
         return (_jsx("div", { className: "flex flex-wrap gap-2", children: column.values.map((v) => {
                 const checked = selected.includes(v.value);
-                return (_jsxs("label", { className: "flex items-center gap-1 text-sm", children: [_jsx("input", { type: "checkbox", checked: checked, onChange: () => onChange(checked
+                return (_jsxs("label", { className: "flex cursor-pointer select-none items-center gap-1 text-sm", children: [_jsx("input", { type: "checkbox", checked: checked, onChange: () => onChange(checked
                                 ? selected.filter((s) => s !== v.value)
                                 : [...selected, v.value]) }), v.label] }, v.value));
             }) }));
@@ -48,7 +55,12 @@ function defaultValueInput({ column, condition, value, onChange, }) {
         return (_jsx("input", { className: "rounded border px-2 py-1", type: "number", value: String(value ?? ""), onChange: (e) => onChange(Number(e.target.value)) }));
     }
     if (column.type === "boolean") {
-        return (_jsxs("select", { className: "rounded border px-2 py-1", value: value == null ? "" : String(value), onChange: (e) => onChange(e.target.value === "true"), children: [_jsx("option", { value: "", children: "Value" }), _jsx("option", { value: "true", children: "true" }), _jsx("option", { value: "false", children: "false" })] }));
+        const options = [
+            { key: "", label: "Value" },
+            { key: "true", label: "true" },
+            { key: "false", label: "false" },
+        ];
+        return (_jsx("select", { className: "rounded border px-2 py-1", value: value == null ? "" : String(value), onChange: (e) => onChange(e.target.value === "true"), children: renderSelectOptions(options) }));
     }
     return (_jsx("input", { className: "rounded border px-2 py-1", type: "text", value: typeof value === "string" ? value : "", onChange: (e) => onChange(e.target.value) }));
 }

package/dist/react/index.d.ts

@@ -1,4 +1,4 @@
-export { FilterBuilder } from "./filter-builder.js";
-export type { AddButtonSlotProps, ConditionSelectSlotProps, FieldSelectSlotProps, PresetButtonSlotProps, RemoveButtonSlotProps, RootSlotProps, RowSlotProps, ValueInputSlotProps, } from "./filter-builder.js";
+export { FilterBuilder } from "./filter-builder/filter-builder.js";
+export type { AddButtonSlotProps, ConditionSelectSlotProps, FieldSelectSlotProps, PresetButtonSlotProps, RemoveButtonSlotProps, RootSlotProps, RowSlotProps, ValueInputSlotProps, } from "./filter-builder/filter-builder-types.js";
 export type { FilterValue } from "../filters/filter-state.js";
 export { useFilterBuilder } from "./use-filter-builder.js";

package/dist/react/index.js

@@ -1,2 +1,2 @@
-export { FilterBuilder } from "./filter-builder.js";
+export { FilterBuilder } from "./filter-builder/filter-builder.js";
 export { useFilterBuilder } from "./use-filter-builder.js";

package/dist/react/use-filter-builder.d.ts

@@ -8,6 +8,7 @@ type UseFilterBuilderReturn = {
     columns: FilterDescriptor["columns"];
     rows: FilterRow[];
     add: () => void;
+    addWithField: (field: string) => void;
     remove: (index: number) => void;
     setField: (index: number, field: string) => void;
     setCondition: (index: number, condition: string) => void;

package/dist/react/use-filter-builder.js

@@ -1,5 +1,5 @@
 import { useMemo, useState } from "react";
-import { addRow, applyPreset as applyPresetState, buildResult, clearState, columnFor, conditionsFor, createInitialState, removeRow, setRowCondition, setRowField, setRowValue, } from "../filters/filter-state.js";
+import { addRow, addRowWithField, applyPreset as applyPresetState, buildResult, clearState, columnFor, conditionsFor, createInitialState, removeRow, setRowCondition, setRowField, setRowValue, } from "../filters/filter-state.js";
 export function useFilterBuilder(descriptor) {
     const [state, setState] = useState(createInitialState);
     const presets = useMemo(() => descriptor.columns.flatMap((col) => (col.presets ?? []).map((p) => ({ field: col.key, name: p.name }))), [descriptor]);
@@ -8,6 +8,7 @@ export function useFilterBuilder(descriptor) {
         columns: descriptor.columns,
         rows: state.rows,
         add: () => setState(addRow),
+        addWithField: (field) => setState((s) => addRowWithField(s, field)),
         remove: (index) => setState((s) => removeRow(s, index)),
         setField: (index, field) => setState((s) => setRowField(s, index, field)),
         setCondition: (index, condition) => setState((s) => setRowCondition(s, index, condition)),

package/dist/transformers/date.js

@@ -1,6 +1,14 @@
 export const DateTransformer = {
     match: (expr, domain) => expr === "Date" || domain === "Date",
     storageType: "int64",
-    serialize: (date) => date.getTime(),
+    serialize: (date) => {
+        if (typeof date === "number") {
+            return date;
+        }
+        if (typeof date === "string") {
+            return new Date(date).getTime();
+        }
+        return date.getTime();
+    },
     deserialize: (ts) => new Date(ts),
 };

package/dist/tsense.d.ts

@@ -76,17 +76,25 @@ export declare class TSense<T extends Type> {
     syncSchema(): Promise<void>;
     private buildObjectFilter;
     private buildFilter;
+    private validateFilterFields;
     private validateFields;
+    private buildFilterExpression;
+    private combineFilterExpressions;
     private buildSort;
     create(): Promise<this>;
     drop(): Promise<void>;
     get(id: string): Promise<T["infer"] | null>;
     delete(id: string): Promise<boolean>;
+    private deleteManyWithFilterBy;
     deleteMany(filter: FilterFor<T["infer"]>): Promise<DeleteResult>;
     update(id: string, data: Partial<T["infer"]>): Promise<T["infer"]>;
+    private updateManyWithFilterBy;
     updateMany(filter: FilterFor<T["infer"]>, data: Partial<T["infer"]>): Promise<UpdateResult>;
+    private searchWithFilterBy;
     search<const O extends SearchOptions<T["infer"]> = SearchOptionsPlain<T["infer"]>>(options: O): Promise<SearchResult<ProjectSearch<T["infer"], O>>>;
+    private searchListWithFilterBy;
     searchList(options: SearchListOptions<T["infer"]>): Promise<SearchListResult<T["infer"]>>;
+    private countWithFilterBy;
     count(filter?: FilterFor<T["infer"]>): Promise<number>;
     upsert(docs: T["infer"] | T["infer"][]): Promise<UpsertResult[]>;
     syncData(options?: SyncOptions): Promise<SyncResult>;

package/dist/tsense.js

@@ -72,6 +72,11 @@ export class TSense {
     }
     serializeDoc(doc) {
         const result = { ...doc };
+        for (const key of Object.keys(result)) {
+            if (result[key] == null) {
+                delete result[key];
+            }
+        }
         for (const [field, transformer] of this.fieldTransformers) {
             if (result[field] != null) {
                 result[field] = transformer.serialize(result[field]);
@@ -204,8 +209,14 @@ export class TSense {
                 const orParts = [];
                 for (const condition of rawValue) {
                     const inner = this.buildFilter(condition);
+                    if (!inner.length) {
+                        continue;
+                    }
                     orParts.push(`(${inner.join("&&")})`);
                 }
+                if (!orParts.length) {
+                    continue;
+                }
                 result.push(`(${orParts.join("||")})`);
                 continue;
             }
@@ -227,6 +238,28 @@ export class TSense {
         }
         return result;
     }
+    validateFilterFields(filter) {
+        if (!filter) {
+            return;
+        }
+        const fields = [];
+        for (const [key, value] of Object.entries(filter)) {
+            if (value == null) {
+                continue;
+            }
+            if (key === "OR") {
+                for (const condition of value) {
+                    this.validateFilterFields(condition);
+                }
+                continue;
+            }
+            fields.push(key);
+        }
+        if (!fields.length) {
+            return;
+        }
+        this.validateFields(fields);
+    }
     validateFields(fields) {
         const valid = new Set(this.fields.map((f) => f.name));
         for (const field of fields) {
@@ -235,6 +268,20 @@ export class TSense {
             }
         }
     }
+    buildFilterExpression(filter) {
+        this.validateFilterFields(filter);
+        const parts = this.buildFilter(filter);
+        if (!parts.length) {
+            return;
+        }
+        return `(${parts.join("&&")})`;
+    }
+    combineFilterExpressions(...filters) {
+        return filters
+            .map((filter) => this.buildFilterExpression(filter))
+            .filter((filter) => filter != null)
+            .join("&&");
+    }
     buildSort(options) {
         if (!options.sortBy)
             return;
@@ -292,9 +339,8 @@ export class TSense {
         });
         return data != null;
     }
-    async deleteMany(filter) {
+    async deleteManyWithFilterBy(filterBy) {
         await this.ensureSynced();
-        const filterBy = this.buildFilter(filter).join("&&");
         if (!filterBy) {
             throw new Error("FILTER_REQUIRED");
         }
@@ -305,6 +351,9 @@ export class TSense {
         });
         return { deleted: data.num_deleted };
     }
+    async deleteMany(filter) {
+        return await this.deleteManyWithFilterBy(this.combineFilterExpressions(filter));
+    }
     async update(id, data) {
         await this.ensureSynced();
         const serialized = this.serializeDoc(data);
@@ -315,9 +364,8 @@ export class TSense {
         });
         return this.deserializeDoc(updated);
     }
-    async updateMany(filter, data) {
+    async updateManyWithFilterBy(filterBy, data) {
         await this.ensureSynced();
-        const filterBy = this.buildFilter(filter).join("&&");
         if (!filterBy) {
             throw new Error("FILTER_REQUIRED");
         }
@@ -330,7 +378,10 @@ export class TSense {
         });
         return { updated: result.num_updated };
     }
-    async search(options) {
+    async updateMany(filter, data) {
+        return await this.updateManyWithFilterBy(this.combineFilterExpressions(filter), data);
+    }
+    async searchWithFilterBy(options, filterBy) {
         await this.ensureSynced();
         const queryByFields = options.queryBy ?? [
             this.options.defaultSearchField,
@@ -352,7 +403,6 @@ export class TSense {
         const sortBy = this.buildSort(options);
         if (sortBy)
             params.sort_by = sortBy;
-        const filterBy = this.buildFilter(options.filter).join("&&");
         if (filterBy)
             params.filter_by = filterBy;
         if (options.page != null)
@@ -418,17 +468,19 @@ export class TSense {
             scores,
         };
     }
-    async searchList(options) {
+    async search(options) {
+        return await this.searchWithFilterBy(options, this.combineFilterExpressions(options.filter));
+    }
+    async searchListWithFilterBy(options, filterBy) {
         const page = options.cursor ? Number(options.cursor) : 1;
         const limit = Math.min(options.limit ?? 20, 100);
-        const result = await this.search({
+        const result = await this.searchWithFilterBy({
             query: options.query,
             queryBy: options.queryBy,
-            filter: options.filter,
             sortBy: [options.sortBy],
             page,
             limit,
-        });
+        }, filterBy);
         const hasMore = page * limit < result.count;
         return {
             data: result.data,
@@ -436,9 +488,11 @@ export class TSense {
             total: result.count,
         };
     }
-    async count(filter) {
+    async searchList(options) {
+        return await this.searchListWithFilterBy(options, this.combineFilterExpressions(options.filter));
+    }
+    async countWithFilterBy(filterBy) {
         await this.ensureSynced();
-        const filterBy = this.buildFilter(filter).join("&&");
         if (!filterBy) {
             const { data } = await this.axios({
                 method: "GET",
@@ -459,6 +513,9 @@ export class TSense {
         });
         return data.found;
     }
+    async count(filter) {
+        return await this.countWithFilterBy(this.combineFilterExpressions(filter));
+    }
     async upsert(docs) {
         await this.ensureSynced();
         const items = Array.isArray(docs) ? docs : [docs];
@@ -538,17 +595,11 @@ export class TSense {
     }
     scoped(baseFilter) {
         return {
-            search: (options) => this.search({
-                ...options,
-                filter: { ...options.filter, ...baseFilter },
-            }),
-            searchList: (options) => this.searchList({
-                ...options,
-                filter: { ...options.filter, ...baseFilter },
-            }),
-            count: (filter) => this.count({ ...filter, ...baseFilter }),
-            deleteMany: (filter) => this.deleteMany({ ...filter, ...baseFilter }),
-            updateMany: (filter, data) => this.updateMany({ ...filter, ...baseFilter }, data),
+            search: (options) => this.searchWithFilterBy(options, this.combineFilterExpressions(baseFilter, options.filter)),
+            searchList: (options) => this.searchListWithFilterBy(options, this.combineFilterExpressions(baseFilter, options.filter)),
+            count: (filter) => this.countWithFilterBy(this.combineFilterExpressions(baseFilter, filter)),
+            deleteMany: (filter) => this.deleteManyWithFilterBy(this.combineFilterExpressions(baseFilter, filter)),
+            updateMany: (filter, data) => this.updateManyWithFilterBy(this.combineFilterExpressions(baseFilter, filter), data),
         };
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tsense",
-  "version": "0.2.0-next.0",
+  "version": "0.2.0-next.3",
   "private": false,
   "description": "Opinionated, fully typed typesense client",
   "keywords": [