@powerhousedao/design-system 5.1.0 → 5.2.0-dev.1

package/dist/src/connect/components/db-explorer/components/filter-bar.d.ts

@@ -0,0 +1,8 @@
+import type { ColumnInfo, FilterGroup } from "./table-view.js";
+export type FilterBarProps = {
+    readonly columns: ColumnInfo[];
+    readonly filters: FilterGroup | undefined;
+    readonly onFiltersChange: (filters: FilterGroup | undefined) => void;
+};
+export declare function FilterBar({ columns, filters, onFiltersChange, }: FilterBarProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=filter-bar.d.ts.map

package/dist/src/connect/components/db-explorer/components/filter-bar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"filter-bar.d.ts","sourceRoot":"","sources":["../../../../../../src/connect/components/db-explorer/components/filter-bar.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EACV,UAAU,EAEV,WAAW,EAEZ,MAAM,iBAAiB,CAAC;AAEzB,MAAM,MAAM,cAAc,GAAG;IAC3B,QAAQ,CAAC,OAAO,EAAE,UAAU,EAAE,CAAC;IAC/B,QAAQ,CAAC,OAAO,EAAE,WAAW,GAAG,SAAS,CAAC;IAC1C,QAAQ,CAAC,eAAe,EAAE,CAAC,OAAO,EAAE,WAAW,GAAG,SAAS,KAAK,IAAI,CAAC;CACtE,CAAC;AAqOF,wBAAgB,SAAS,CAAC,EACxB,OAAO,EACP,OAAO,EACP,eAAe,GAChB,EAAE,cAAc,2CA0IhB"}

package/dist/src/connect/components/db-explorer/components/filter-bar.js

@@ -0,0 +1,175 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon } from "@powerhousedao/design-system";
+import { useCallback, useMemo, useState } from "react";
+import { twMerge } from "tailwind-merge";
+import { ConnectSelect } from "../../select/select.js";
+function getAvailableOperators(column) {
+    const baseOperators = [
+        "=",
+        "!=",
+        ">",
+        "<",
+        ">=",
+        "<=",
+        "IS NULL",
+        "IS NOT NULL",
+    ];
+    const dataType = column.dataType.toLowerCase();
+    // Text types get LIKE and ILIKE
+    if (dataType.includes("varchar") ||
+        dataType.includes("text") ||
+        dataType.includes("char")) {
+        return [...baseOperators, "LIKE", "ILIKE"];
+    }
+    // Numeric types don't get LIKE/ILIKE
+    if (dataType.includes("int") ||
+        dataType.includes("decimal") ||
+        dataType.includes("numeric") ||
+        dataType.includes("real") ||
+        dataType.includes("double") ||
+        dataType.includes("float") ||
+        dataType.includes("bigint") ||
+        dataType.includes("smallint")) {
+        return baseOperators;
+    }
+    // Default: all operators except LIKE/ILIKE
+    return baseOperators;
+}
+function getInputType(column, operator) {
+    if (operator === "IS NULL" || operator === "IS NOT NULL") {
+        return "text"; // Will be hidden anyway
+    }
+    const dataType = column.dataType.toLowerCase();
+    if (dataType.includes("int") ||
+        dataType.includes("decimal") ||
+        dataType.includes("numeric") ||
+        dataType.includes("real") ||
+        dataType.includes("double") ||
+        dataType.includes("float") ||
+        dataType.includes("bigint") ||
+        dataType.includes("smallint")) {
+        return "number";
+    }
+    if (dataType.includes("timestamp") ||
+        dataType.includes("date") ||
+        dataType.includes("time")) {
+        return "datetime-local";
+    }
+    return "text";
+}
+function FilterClauseComponent({ clause, columns, onUpdate, onRemove, showConnector, connector, onConnectorChange, }) {
+    const column = columns.find((c) => c.name === clause.column);
+    const availableOperators = column
+        ? getAvailableOperators(column)
+        : ["=", "!="];
+    const inputType = column ? getInputType(column, clause.operator) : "text";
+    const showValueInput = clause.operator !== "IS NULL" && clause.operator !== "IS NOT NULL";
+    const columnItems = useMemo(() => columns.map((col) => ({
+        value: col.name,
+        displayValue: col.name,
+    })), [columns]);
+    const operatorItems = useMemo(() => availableOperators.map((op) => ({
+        value: op,
+        displayValue: op,
+    })), [availableOperators]);
+    const connectorItems = useMemo(() => [
+        { value: "AND", displayValue: "AND" },
+        { value: "OR", displayValue: "OR" },
+    ], []);
+    const handleColumnChange = useCallback((columnName) => {
+        const newColumn = columns.find((c) => c.name === columnName);
+        if (!newColumn)
+            return;
+        const newAvailableOperators = getAvailableOperators(newColumn);
+        const newOperator = newAvailableOperators.includes(clause.operator)
+            ? clause.operator
+            : newAvailableOperators[0];
+        onUpdate({
+            ...clause,
+            column: columnName,
+            operator: newOperator,
+            value: "",
+        });
+    }, [clause, columns, onUpdate]);
+    const handleOperatorChange = useCallback((operator) => {
+        onUpdate({
+            ...clause,
+            operator,
+            value: operator === "IS NULL" || operator === "IS NOT NULL"
+                ? ""
+                : clause.value,
+        });
+    }, [clause, onUpdate]);
+    const handleValueChange = useCallback((value) => {
+        onUpdate({
+            ...clause,
+            value,
+        });
+    }, [clause, onUpdate]);
+    return (_jsxs("div", { className: "flex items-center gap-2", children: [showConnector && (_jsx(ConnectSelect, { absolutePositionMenu: true, borderRadius: "4px", containerClassName: "min-w-[80px]", id: `connector-${clause.id}`, items: connectorItems, itemClassName: "px-2 py-1 text-xs", menuClassName: "px-2 py-1 text-xs min-w-[80px]", value: connector, onChange: onConnectorChange })), _jsx(ConnectSelect, { absolutePositionMenu: true, borderRadius: "4px", containerClassName: "min-w-[150px]", id: `column-${clause.id}`, items: columnItems, itemClassName: "px-2 py-1 text-xs", menuClassName: "px-2 py-1 text-xs min-w-[150px]", value: clause.column, onChange: handleColumnChange }), _jsx(ConnectSelect, { absolutePositionMenu: true, borderRadius: "4px", containerClassName: "min-w-[100px]", id: `operator-${clause.id}`, items: operatorItems, itemClassName: "px-2 py-1 text-xs", menuClassName: "px-2 py-1 text-xs min-w-[100px]", value: clause.operator, onChange: handleOperatorChange }), showValueInput && (_jsx("input", { className: "min-w-[150px] rounded border border-gray-300 bg-white px-2 py-1 text-xs text-gray-900", type: inputType, value: clause.value, onChange: (e) => handleValueChange(e.target.value) })), _jsx("button", { className: "flex items-center justify-center rounded p-1 text-gray-500 hover:bg-gray-200 hover:text-gray-700", onClick: onRemove, title: "Remove filter", type: "button", children: _jsx(Icon, { name: "Xmark", size: 14 }) })] }));
+}
+export function FilterBar({ columns, filters, onFiltersChange, }) {
+    const [isExpanded, setIsExpanded] = useState(false);
+    const handleAddFilter = useCallback(() => {
+        const newClause = {
+            id: `filter-${Date.now()}-${Math.random()}`,
+            column: columns[0]?.name ?? "",
+            operator: "=",
+            value: "",
+        };
+        if (!filters) {
+            onFiltersChange({
+                clauses: [newClause],
+                connectors: [],
+            });
+        }
+        else {
+            onFiltersChange({
+                clauses: [...filters.clauses, newClause],
+                connectors: [
+                    ...filters.connectors,
+                    filters.clauses.length > 0 ? "AND" : "AND",
+                ],
+            });
+        }
+        setIsExpanded(true);
+    }, [columns, filters, onFiltersChange]);
+    const handleUpdateClause = useCallback((index, clause) => {
+        if (!filters)
+            return;
+        const newClauses = [...filters.clauses];
+        newClauses[index] = clause;
+        onFiltersChange({
+            ...filters,
+            clauses: newClauses,
+        });
+    }, [filters, onFiltersChange]);
+    const handleRemoveClause = useCallback((index) => {
+        if (!filters)
+            return;
+        const newClauses = filters.clauses.filter((_, i) => i !== index);
+        const newConnectors = filters.connectors.filter((_, i) => i !== index - 1);
+        if (newClauses.length === 0) {
+            onFiltersChange(undefined);
+        }
+        else {
+            onFiltersChange({
+                clauses: newClauses,
+                connectors: newConnectors,
+            });
+        }
+    }, [filters, onFiltersChange]);
+    const handleConnectorChange = useCallback((index, connector) => {
+        if (!filters)
+            return;
+        const newConnectors = [...filters.connectors];
+        newConnectors[index] = connector;
+        onFiltersChange({
+            ...filters,
+            connectors: newConnectors,
+        });
+    }, [filters, onFiltersChange]);
+    const hasFilters = filters && filters.clauses.length > 0;
+    return (_jsxs("div", { className: "flex shrink-0 flex-col gap-2 rounded-lg border border-gray-300 bg-white p-2", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("button", { className: "flex items-center gap-1 text-xs text-gray-700 hover:text-gray-900", onClick: () => setIsExpanded(!isExpanded), type: "button", children: [_jsx(Icon, { className: twMerge("transition-transform", isExpanded && "rotate-90"), name: "ChevronDown", size: 12 }), _jsx("span", { children: "Filters" }), hasFilters && (_jsx("span", { className: "rounded bg-blue-100 px-1.5 py-0.5 text-xs text-blue-700", children: filters.clauses.length }))] }), _jsxs("button", { className: "flex items-center gap-1 rounded border border-gray-300 bg-white px-2 py-1 text-xs text-gray-700 hover:bg-gray-100", onClick: handleAddFilter, type: "button", children: [_jsx(Icon, { name: "Plus", size: 12 }), "Add Filter"] })] }), isExpanded && hasFilters && (_jsx("div", { className: "flex flex-col gap-2", children: filters.clauses.map((clause, index) => (_jsx(FilterClauseComponent, { clause: clause, columns: columns, connector: index > 0 ? (filters.connectors[index - 1] ?? "AND") : "AND", onConnectorChange: (connector) => handleConnectorChange(index - 1, connector), onRemove: () => handleRemoveClause(index), onUpdate: (updatedClause) => handleUpdateClause(index, updatedClause), showConnector: index > 0 }, clause.id))) }))] }));
+}
+//# sourceMappingURL=filter-bar.js.map

package/dist/src/connect/components/db-explorer/components/filter-bar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"filter-bar.js","sourceRoot":"","sources":["../../../../../../src/connect/components/db-explorer/components/filter-bar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,8BAA8B,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACzC,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAcvD,SAAS,qBAAqB,CAAC,MAAkB;IAC/C,MAAM,aAAa,GAAqB;QACtC,GAAG;QACH,IAAI;QACJ,GAAG;QACH,GAAG;QACH,IAAI;QACJ,IAAI;QACJ,SAAS;QACT,aAAa;KACd,CAAC;IAEF,MAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC;IAE/C,gCAAgC;IAChC,IACE,QAAQ,CAAC,QAAQ,CAAC,SAAS,CAAC;QAC5B,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC;QACzB,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,EACzB,CAAC;QACD,OAAO,CAAC,GAAG,aAAa,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC;IAC7C,CAAC;IAED,qCAAqC;IACrC,IACE,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC;QACxB,QAAQ,CAAC,QAAQ,CAAC,SAAS,CAAC;QAC5B,QAAQ,CAAC,QAAQ,CAAC,SAAS,CAAC;QAC5B,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC;QACzB,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC;QAC3B,QAAQ,CAAC,QAAQ,CAAC,OAAO,CAAC;QAC1B,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC;QAC3B,QAAQ,CAAC,QAAQ,CAAC,UAAU,CAAC,EAC7B,CAAC;QACD,OAAO,aAAa,CAAC;IACvB,CAAC;IAED,2CAA2C;IAC3C,OAAO,aAAa,CAAC;AACvB,CAAC;AAED,SAAS,YAAY,CACnB,MAAkB,EAClB,QAAwB;IAExB,IAAI,QAAQ,KAAK,SAAS,IAAI,QAAQ,KAAK,aAAa,EAAE,CAAC;QACzD,OAAO,MAAM,CAAC,CAAC,wBAAwB;IACzC,CAAC;IAED,MAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC;IAE/C,IACE,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC;QACxB,QAAQ,CAAC,QAAQ,CAAC,SAAS,CAAC;QAC5B,QAAQ,CAAC,QAAQ,CAAC,SAAS,CAAC;QAC5B,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC;QACzB,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC;QAC3B,QAAQ,CAAC,QAAQ,CAAC,OAAO,CAAC;QAC1B,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC;QAC3B,QAAQ,CAAC,QAAQ,CAAC,UAAU,CAAC,EAC7B,CAAC;QACD,OAAO,QAAQ,CAAC;IAClB,CAAC;IAED,IACE,QAAQ,CAAC,QAAQ,CAAC,WAAW,CAAC;QAC9B,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC;QACzB,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,EACzB,CAAC;QACD,OAAO,gBAAgB,CAAC;IAC1B,CAAC;IAED,OAAO,MAAM,CAAC;AAChB,CAAC;AAED,SAAS,qBAAqB,CAAC,EAC7B,MAAM,EACN,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,aAAa,EACb,SAAS,EACT,iBAAiB,GASlB;IACC,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,MAAM,CAAC,MAAM,CAAC,CAAC;IAC7D,MAAM,kBAAkB,GAAG,MAAM;QAC/B,CAAC,CAAC,qBAAqB,CAAC,MAAM,CAAC;QAC/B,CAAC,CAAE,CAAC,GAAG,EAAE,IAAI,CAAsB,CAAC;IACtC,MAAM,SAAS,GAAG,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC;IAC1E,MAAM,cAAc,GAClB,MAAM,CAAC,QAAQ,KAAK,SAAS,IAAI,MAAM,CAAC,QAAQ,KAAK,aAAa,CAAC;IAErE,MAAM,WAAW,GAAG,OAAO,CACzB,GAAmD,EAAE,CACnD,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;QACpB,KAAK,EAAE,GAAG,CAAC,IAAI;QACf,YAAY,EAAE,GAAG,CAAC,IAAI;KACvB,CAAC,CAAC,EACL,CAAC,OAAO,CAAC,CACV,CAAC;IAEF,MAAM,aAAa,GAAG,OAAO,CAC3B,GAA2D,EAAE,CAC3D,kBAAkB,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;QAC9B,KAAK,EAAE,EAAE;QACT,YAAY,EAAE,EAAE;KACjB,CAAC,CAAC,EACL,CAAC,kBAAkB,CAAC,CACrB,CAAC;IAEF,MAAM,cAAc,GAAG,OAAO,CAC5B,GAAyD,EAAE,CAAC;QAC1D,EAAE,KAAK,EAAE,KAAK,EAAE,YAAY,EAAE,KAAK,EAAE;QACrC,EAAE,KAAK,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE;KACpC,EACD,EAAE,CACH,CAAC;IAEF,MAAM,kBAAkB,GAAG,WAAW,CACpC,CAAC,UAAkB,EAAE,EAAE;QACrB,MAAM,SAAS,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,UAAU,CAAC,CAAC;QAC7D,IAAI,CAAC,SAAS;YAAE,OAAO;QAEvB,MAAM,qBAAqB,GAAG,qBAAqB,CAAC,SAAS,CAAC,CAAC;QAC/D,MAAM,WAAW,GAAG,qBAAqB,CAAC,QAAQ,CAAC,MAAM,CAAC,QAAQ,CAAC;YACjE,CAAC,CAAC,MAAM,CAAC,QAAQ;YACjB,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;QAE7B,QAAQ,CAAC;YACP,GAAG,MAAM;YACT,MAAM,EAAE,UAAU;YAClB,QAAQ,EAAE,WAAW;YACrB,KAAK,EAAE,EAAE;SACV,CAAC,CAAC;IACL,CAAC,EACD,CAAC,MAAM,EAAE,OAAO,EAAE,QAAQ,CAAC,CAC5B,CAAC;IAEF,MAAM,oBAAoB,GAAG,WAAW,CACtC,CAAC,QAAwB,EAAE,EAAE;QAC3B,QAAQ,CAAC;YACP,GAAG,MAAM;YACT,QAAQ;YACR,KAAK,EACH,QAAQ,KAAK,SAAS,IAAI,QAAQ,KAAK,aAAa;gBAClD,CAAC,CAAC,EAAE;gBACJ,CAAC,CAAC,MAAM,CAAC,KAAK;SACnB,CAAC,CAAC;IACL,CAAC,EACD,CAAC,MAAM,EAAE,QAAQ,CAAC,CACnB,CAAC;IAEF,MAAM,iBAAiB,GAAG,WAAW,CACnC,CAAC,KAAa,EAAE,EAAE;QAChB,QAAQ,CAAC;YACP,GAAG,MAAM;YACT,KAAK;SACN,CAAC,CAAC;IACL,CAAC,EACD,CAAC,MAAM,EAAE,QAAQ,CAAC,CACnB,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAC,yBAAyB,aACrC,aAAa,IAAI,CAChB,KAAC,aAAa,IACZ,oBAAoB,QACpB,YAAY,EAAC,KAAK,EAClB,kBAAkB,EAAC,cAAc,EACjC,EAAE,EAAE,aAAa,MAAM,CAAC,EAAE,EAAE,EAC5B,KAAK,EAAE,cAAc,EACrB,aAAa,EAAC,mBAAmB,EACjC,aAAa,EAAC,gCAAgC,EAC9C,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,iBAAiB,GAC3B,CACH,EACD,KAAC,aAAa,IACZ,oBAAoB,QACpB,YAAY,EAAC,KAAK,EAClB,kBAAkB,EAAC,eAAe,EAClC,EAAE,EAAE,UAAU,MAAM,CAAC,EAAE,EAAE,EACzB,KAAK,EAAE,WAAW,EAClB,aAAa,EAAC,mBAAmB,EACjC,aAAa,EAAC,iCAAiC,EAC/C,KAAK,EAAE,MAAM,CAAC,MAAM,EACpB,QAAQ,EAAE,kBAAkB,GAC5B,EACF,KAAC,aAAa,IACZ,oBAAoB,QACpB,YAAY,EAAC,KAAK,EAClB,kBAAkB,EAAC,eAAe,EAClC,EAAE,EAAE,YAAY,MAAM,CAAC,EAAE,EAAE,EAC3B,KAAK,EAAE,aAAa,EACpB,aAAa,EAAC,mBAAmB,EACjC,aAAa,EAAC,iCAAiC,EAC/C,KAAK,EAAE,MAAM,CAAC,QAAQ,EACtB,QAAQ,EAAE,oBAAoB,GAC9B,EACD,cAAc,IAAI,CACjB,gBACE,SAAS,EAAC,uFAAuF,EACjG,IAAI,EAAE,SAAS,EACf,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,iBAAiB,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,GAClD,CACH,EACD,iBACE,SAAS,EAAC,kGAAkG,EAC5G,OAAO,EAAE,QAAQ,EACjB,KAAK,EAAC,eAAe,EACrB,IAAI,EAAC,QAAQ,YAEb,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,EAAC,IAAI,EAAE,EAAE,GAAI,GACxB,IACL,CACP,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,SAAS,CAAC,EACxB,OAAO,EACP,OAAO,EACP,eAAe,GACA;IACf,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEpD,MAAM,eAAe,GAAG,WAAW,CAAC,GAAG,EAAE;QACvC,MAAM,SAAS,GAAiB;YAC9B,EAAE,EAAE,UAAU,IAAI,CAAC,GAAG,EAAE,IAAI,IAAI,CAAC,MAAM,EAAE,EAAE;YAC3C,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,IAAI,IAAI,EAAE;YAC9B,QAAQ,EAAE,GAAG;YACb,KAAK,EAAE,EAAE;SACV,CAAC;QAEF,IAAI,CAAC,OAAO,EAAE,CAAC;YACb,eAAe,CAAC;gBACd,OAAO,EAAE,CAAC,SAAS,CAAC;gBACpB,UAAU,EAAE,EAAE;aACf,CAAC,CAAC;QACL,CAAC;aAAM,CAAC;YACN,eAAe,CAAC;gBACd,OAAO,EAAE,CAAC,GAAG,OAAO,CAAC,OAAO,EAAE,SAAS,CAAC;gBACxC,UAAU,EAAE;oBACV,GAAG,OAAO,CAAC,UAAU;oBACrB,OAAO,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAE,KAAe;iBACtD;aACF,CAAC,CAAC;QACL,CAAC;QACD,aAAa,CAAC,IAAI,CAAC,CAAC;IACtB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,eAAe,CAAC,CAAC,CAAC;IAExC,MAAM,kBAAkB,GAAG,WAAW,CACpC,CAAC,KAAa,EAAE,MAAoB,EAAE,EAAE;QACtC,IAAI,CAAC,OAAO;YAAE,OAAO;QAErB,MAAM,UAAU,GAAG,CAAC,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC;QACxC,UAAU,CAAC,KAAK,CAAC,GAAG,MAAM,CAAC;QAE3B,eAAe,CAAC;YACd,GAAG,OAAO;YACV,OAAO,EAAE,UAAU;SACpB,CAAC,CAAC;IACL,CAAC,EACD,CAAC,OAAO,EAAE,eAAe,CAAC,CAC3B,CAAC;IAEF,MAAM,kBAAkB,GAAG,WAAW,CACpC,CAAC,KAAa,EAAE,EAAE;QAChB,IAAI,CAAC,OAAO;YAAE,OAAO;QAErB,MAAM,UAAU,GAAG,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,CAAC;QACjE,MAAM,aAAa,GAAG,OAAO,CAAC,UAAU,CAAC,MAAM,CAC7C,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,KAAK,GAAG,CAAC,CAC1B,CAAC;QAEF,IAAI,UAAU,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;YAC5B,eAAe,CAAC,SAAS,CAAC,CAAC;QAC7B,CAAC;aAAM,CAAC;YACN,eAAe,CAAC;gBACd,OAAO,EAAE,UAAU;gBACnB,UAAU,EAAE,aAAa;aAC1B,CAAC,CAAC;QACL,CAAC;IACH,CAAC,EACD,CAAC,OAAO,EAAE,eAAe,CAAC,CAC3B,CAAC;IAEF,MAAM,qBAAqB,GAAG,WAAW,CACvC,CAAC,KAAa,EAAE,SAAuB,EAAE,EAAE;QACzC,IAAI,CAAC,OAAO;YAAE,OAAO;QAErB,MAAM,aAAa,GAAG,CAAC,GAAG,OAAO,CAAC,UAAU,CAAC,CAAC;QAC9C,aAAa,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC;QAEjC,eAAe,CAAC;YACd,GAAG,OAAO;YACV,UAAU,EAAE,aAAa;SAC1B,CAAC,CAAC;IACL,CAAC,EACD,CAAC,OAAO,EAAE,eAAe,CAAC,CAC3B,CAAC;IAEF,MAAM,UAAU,GAAG,OAAO,IAAI,OAAO,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC;IAEzD,OAAO,CACL,eAAK,SAAS,EAAC,6EAA6E,aAC1F,eAAK,SAAS,EAAC,mCAAmC,aAChD,kBACE,SAAS,EAAC,mEAAmE,EAC7E,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,CAAC,UAAU,CAAC,EACzC,IAAI,EAAC,QAAQ,aAEb,KAAC,IAAI,IACH,SAAS,EAAE,OAAO,CAChB,sBAAsB,EACtB,UAAU,IAAI,WAAW,CAC1B,EACD,IAAI,EAAC,aAAa,EAClB,IAAI,EAAE,EAAE,GACR,EACF,qCAAoB,EACnB,UAAU,IAAI,CACb,eAAM,SAAS,EAAC,yDAAyD,YACtE,OAAO,CAAC,OAAO,CAAC,MAAM,GAClB,CACR,IACM,EACT,kBACE,SAAS,EAAC,mHAAmH,EAC7H,OAAO,EAAE,eAAe,EACxB,IAAI,EAAC,QAAQ,aAEb,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAE,EAAE,GAAI,kBAEvB,IACL,EAEL,UAAU,IAAI,UAAU,IAAI,CAC3B,cAAK,SAAS,EAAC,qBAAqB,YACjC,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,CACtC,KAAC,qBAAqB,IAEpB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,SAAS,EACP,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,GAAG,CAAC,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,EAE9D,iBAAiB,EAAE,CAAC,SAAS,EAAE,EAAE,CAC/B,qBAAqB,CAAC,KAAK,GAAG,CAAC,EAAE,SAAS,CAAC,EAE7C,QAAQ,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,KAAK,CAAC,EACzC,QAAQ,EAAE,CAAC,aAAa,EAAE,EAAE,CAC1B,kBAAkB,CAAC,KAAK,EAAE,aAAa,CAAC,EAE1C,aAAa,EAAE,KAAK,GAAG,CAAC,IAbnB,MAAM,CAAC,EAAE,CAcd,CACH,CAAC,GACE,CACP,IACG,CACP,CAAC;AACJ,CAAC"}

package/dist/src/connect/components/db-explorer/components/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./schema-tree-sidebar.js";
+export * from "./table-view.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/src/connect/components/db-explorer/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/connect/components/db-explorer/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC;AACzC,cAAc,iBAAiB,CAAC"}

package/dist/src/connect/components/db-explorer/components/index.js

@@ -0,0 +1,3 @@
+export * from "./schema-tree-sidebar.js";
+export * from "./table-view.js";
+//# sourceMappingURL=index.js.map

package/dist/src/connect/components/db-explorer/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/connect/components/db-explorer/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC;AACzC,cAAc,iBAAiB,CAAC"}

package/dist/src/connect/components/db-explorer/components/schema-tree-sidebar.d.ts

@@ -0,0 +1,15 @@
+import type { ColumnInfo } from "./table-view.js";
+export type TableInfo = {
+    readonly name: string;
+    readonly columns: ColumnInfo[];
+};
+export type SchemaTreeSidebarProps = {
+    readonly schema: string;
+    readonly tables: TableInfo[];
+    readonly selectedTable?: string;
+    readonly onSelectTable: (table: string) => void;
+    readonly onRefresh?: () => void | Promise<void>;
+    readonly loading?: boolean;
+};
+export declare function SchemaTreeSidebar({ schema, tables, selectedTable, onSelectTable, onRefresh, loading, }: SchemaTreeSidebarProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=schema-tree-sidebar.d.ts.map

package/dist/src/connect/components/db-explorer/components/schema-tree-sidebar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"schema-tree-sidebar.d.ts","sourceRoot":"","sources":["../../../../../../src/connect/components/db-explorer/components/schema-tree-sidebar.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAElD,MAAM,MAAM,SAAS,GAAG;IACtB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,OAAO,EAAE,UAAU,EAAE,CAAC;CAChC,CAAC;AAIF,MAAM,MAAM,sBAAsB,GAAG;IACnC,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,MAAM,EAAE,SAAS,EAAE,CAAC;IAC7B,QAAQ,CAAC,aAAa,CAAC,EAAE,MAAM,CAAC;IAChC,QAAQ,CAAC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAChD,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC;CAC5B,CAAC;AA+FF,wBAAgB,iBAAiB,CAAC,EAChC,MAAM,EACN,MAAM,EACN,aAAa,EACb,aAAa,EACb,SAAS,EACT,OAAO,GACR,EAAE,sBAAsB,2CAsFxB"}

package/dist/src/connect/components/db-explorer/components/schema-tree-sidebar.js

@@ -0,0 +1,47 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon } from "@powerhousedao/design-system";
+import { useState } from "react";
+import { twMerge } from "tailwind-merge";
+const INDENT_PX = 16;
+function TreeItem({ label, depth, expanded, selected, hasChildren, icon, onToggle, onClick, children, }) {
+    const handleChevronClick = (e) => {
+        e.stopPropagation();
+        onToggle?.();
+    };
+    return (_jsxs("div", { children: [_jsxs("div", { className: twMerge("flex cursor-pointer items-center gap-1 py-1 pr-2 text-sm hover:bg-gray-100", selected && "bg-blue-50"), style: { paddingLeft: depth * INDENT_PX + 4 }, onClick: onClick, children: [hasChildren ? (_jsx("button", { className: "flex h-4 w-4 shrink-0 items-center justify-center text-gray-500 hover:text-gray-700", onClick: handleChevronClick, type: "button", children: _jsx(Icon, { className: twMerge("transition-transform", expanded && "rotate-90"), name: "CaretRight", size: 12 }) })) : (_jsx("span", { className: "w-4 shrink-0" })), icon && _jsx("span", { className: "shrink-0 text-gray-500", children: icon }), _jsx("span", { className: "min-w-0 flex-1 truncate text-gray-700", children: label }), selected && (_jsx("span", { className: "ml-auto h-2 w-2 shrink-0 rounded-full bg-blue-500" }))] }), expanded && children] }));
+}
+function ColumnItem({ column, depth, }) {
+    const typeLabel = column.dataType.length > 10
+        ? column.dataType.slice(0, 10) + "…"
+        : column.dataType;
+    return (_jsxs("div", { className: "flex items-center gap-1 py-0.5 pr-2 text-xs text-gray-500", style: { paddingLeft: depth * INDENT_PX + 4 }, children: [_jsx("span", { className: "w-4 shrink-0" }), _jsx("span", { className: "truncate", children: column.name }), _jsxs("span", { className: "ml-auto shrink-0 text-gray-400", children: ["(", typeLabel, ")"] })] }));
+}
+export function SchemaTreeSidebar({ schema, tables, selectedTable, onSelectTable, onRefresh, loading, }) {
+    const [expandedNodes, setExpandedNodes] = useState({
+        [schema]: true,
+    });
+    const toggleNode = (nodeId) => {
+        setExpandedNodes((prev) => ({
+            ...prev,
+            [nodeId]: !prev[nodeId],
+        }));
+    };
+    const handleTableClick = (tableName) => {
+        onSelectTable(tableName);
+        setExpandedNodes((prev) => ({
+            ...prev,
+            [tableName]: !prev[tableName],
+        }));
+    };
+    const isSchemaExpanded = expandedNodes[schema] ?? false;
+    const handleRefreshClick = (e) => {
+        e.stopPropagation();
+        void onRefresh?.();
+    };
+    return (_jsx("div", { className: "flex flex-col overflow-auto pt-4 text-sm", children: _jsx(TreeItem, { depth: 0, expanded: isSchemaExpanded, hasChildren: tables.length > 0, icon: _jsx(Icon, { name: isSchemaExpanded ? "FolderOpen" : "FolderClose", size: 16 }), label: _jsxs("div", { className: "flex flex-1 items-center", children: [_jsx("span", { className: "truncate", children: schema }), onRefresh && (_jsx("button", { className: "ml-auto p-0.5 text-gray-400 hover:text-gray-600", onClick: handleRefreshClick, type: "button", disabled: loading, children: _jsx(Icon, { name: "Reload", size: 14, className: loading ? "animate-spin" : undefined }) }))] }), onClick: () => toggleNode(schema), onToggle: () => toggleNode(schema), children: tables.map((table) => {
+                const isTableExpanded = expandedNodes[table.name] ?? false;
+                const isSelected = selectedTable === table.name;
+                return (_jsx(TreeItem, { depth: 1, expanded: isTableExpanded, hasChildren: table.columns.length > 0, icon: _jsx(Icon, { name: "TreeViewSlash", size: 16 }), label: table.name, selected: isSelected, onClick: () => handleTableClick(table.name), onToggle: () => toggleNode(table.name), children: table.columns.map((col) => (_jsx(ColumnItem, { column: col, depth: 2 }, col.name))) }, table.name));
+            }) }) }));
+}
+//# sourceMappingURL=schema-tree-sidebar.js.map

package/dist/src/connect/components/db-explorer/components/schema-tree-sidebar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"schema-tree-sidebar.js","sourceRoot":"","sources":["../../../../../../src/connect/components/db-explorer/components/schema-tree-sidebar.tsx"],"names":[],"mappings":"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"}

package/dist/src/connect/components/db-explorer/components/schema-tree-sidebar.stories.d.ts

@@ -0,0 +1,12 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import { SchemaTreeSidebar } from "./schema-tree-sidebar.js";
+declare const meta: Meta<typeof SchemaTreeSidebar>;
+export default meta;
+type Story = StoryObj<typeof SchemaTreeSidebar>;
+export declare const Default: Story;
+export declare const WithSelectedTable: Story;
+export declare const EmptySchema: Story;
+export declare const ManyTables: Story;
+export declare const Interactive: Story;
+export declare const Loading: Story;
+//# sourceMappingURL=schema-tree-sidebar.stories.d.ts.map

package/dist/src/connect/components/db-explorer/components/schema-tree-sidebar.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"schema-tree-sidebar.stories.d.ts","sourceRoot":"","sources":["../../../../../../src/connect/components/db-explorer/components/schema-tree-sidebar.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAGvD,OAAO,EACL,iBAAiB,EAGlB,MAAM,0BAA0B,CAAC;AAElC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,iBAAiB,CAaxC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAwChD,eAAO,MAAM,OAAO,EAAE,KAOrB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAO/B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAMzB,CAAC;AAaF,eAAO,MAAM,UAAU,EAAE,KAMxB,CAAC;AAmBF,eAAO,MAAM,WAAW,EAAE,KAQzB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAQrB,CAAC"}

package/dist/src/connect/components/db-explorer/components/schema-tree-sidebar.stories.js

@@ -0,0 +1,119 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { fn } from "@storybook/test";
+import { useState } from "react";
+import { SchemaTreeSidebar, } from "./schema-tree-sidebar.js";
+const meta = {
+    title: "Connect/Components/DBExplorer/SchemaTreeSidebar",
+    component: SchemaTreeSidebar,
+    parameters: {
+        layout: "padded",
+    },
+    decorators: [
+        (Story) => (_jsx("div", { className: "w-64 border border-gray-200 bg-white", children: _jsx(Story, {}) })),
+    ],
+};
+export default meta;
+const mockTables = [
+    {
+        name: "users",
+        columns: [
+            { name: "id", dataType: "int4", isNullable: false },
+            { name: "name", dataType: "varchar", isNullable: false },
+            { name: "email", dataType: "varchar", isNullable: false },
+            { name: "created_at", dataType: "timestamp", isNullable: true },
+        ],
+    },
+    {
+        name: "posts",
+        columns: [
+            { name: "id", dataType: "int4", isNullable: false },
+            { name: "title", dataType: "varchar", isNullable: false },
+            { name: "content", dataType: "text", isNullable: true },
+            { name: "author_id", dataType: "int4", isNullable: false },
+            { name: "published_at", dataType: "timestamp", isNullable: true },
+        ],
+    },
+    {
+        name: "comments",
+        columns: [
+            { name: "id", dataType: "int4", isNullable: false },
+            { name: "post_id", dataType: "int4", isNullable: false },
+            { name: "user_id", dataType: "int4", isNullable: false },
+            { name: "body", dataType: "text", isNullable: false },
+        ],
+    },
+    {
+        name: "tags",
+        columns: [
+            { name: "id", dataType: "int4", isNullable: false },
+            { name: "name", dataType: "varchar", isNullable: false },
+        ],
+    },
+];
+export const Default = {
+    args: {
+        schema: "public",
+        tables: mockTables,
+        onSelectTable: fn(),
+        onRefresh: fn(),
+    },
+};
+export const WithSelectedTable = {
+    args: {
+        schema: "public",
+        tables: mockTables,
+        selectedTable: "users",
+        onSelectTable: fn(),
+    },
+};
+export const EmptySchema = {
+    args: {
+        schema: "public",
+        tables: [],
+        onSelectTable: fn(),
+    },
+};
+const manyTables = mockTables.concat([
+    { name: "categories", columns: [] },
+    { name: "products", columns: [] },
+    { name: "orders", columns: [] },
+    { name: "order_items", columns: [] },
+    { name: "payments", columns: [] },
+    { name: "reviews", columns: [] },
+    { name: "sessions", columns: [] },
+    { name: "logs", columns: [] },
+]);
+export const ManyTables = {
+    args: {
+        schema: "public",
+        tables: manyTables,
+        onSelectTable: fn(),
+    },
+};
+function InteractiveWrapper(args) {
+    const [selectedTable, setSelectedTable] = useState();
+    const handleSelectTable = (table) => {
+        setSelectedTable(table);
+        args.onSelectTable(table);
+    };
+    return (_jsx(SchemaTreeSidebar, { ...args, selectedTable: selectedTable, onSelectTable: handleSelectTable }));
+}
+export const Interactive = {
+    render: InteractiveWrapper,
+    args: {
+        schema: "public",
+        tables: mockTables,
+        onSelectTable: fn(),
+        onRefresh: fn(),
+    },
+};
+export const Loading = {
+    args: {
+        schema: "public",
+        tables: mockTables,
+        onSelectTable: fn(),
+        onRefresh: fn(),
+        loading: true,
+    },
+};
+//# sourceMappingURL=schema-tree-sidebar.stories.js.map

package/dist/src/connect/components/db-explorer/components/schema-tree-sidebar.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"schema-tree-sidebar.stories.js","sourceRoot":"","sources":["../../../../../../src/connect/components/db-explorer/components/schema-tree-sidebar.stories.tsx"],"names":[],"mappings":"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"}

package/dist/src/connect/components/db-explorer/components/table-view.d.ts

@@ -0,0 +1,39 @@
+export type ColumnInfo = {
+    readonly name: string;
+    readonly dataType: string;
+    readonly isNullable: boolean;
+};
+export type SortDirection = "asc" | "desc";
+export type SortOptions = {
+    readonly column: string;
+    readonly direction: SortDirection;
+};
+export type FilterOperator = "=" | "!=" | ">" | "<" | ">=" | "<=" | "LIKE" | "ILIKE" | "IS NULL" | "IS NOT NULL";
+export type FilterClause = {
+    readonly id: string;
+    readonly column: string;
+    readonly operator: FilterOperator;
+    readonly value: string;
+};
+export type FilterGroup = {
+    readonly clauses: FilterClause[];
+    readonly connectors: ("AND" | "OR")[];
+};
+export type PaginationState = {
+    readonly offset: number;
+    readonly limit: number;
+    readonly total: number | null;
+};
+export type TableViewProps = {
+    readonly columns: ColumnInfo[];
+    readonly rows: Record<string, unknown>[];
+    readonly pagination: PaginationState;
+    readonly onPageChange: (offset: number) => void;
+    readonly onSort?: (sort: SortOptions) => void;
+    readonly currentSort?: SortOptions;
+    readonly loading?: boolean;
+    readonly filters?: FilterGroup;
+    readonly onFiltersChange?: (filters: FilterGroup | undefined) => void;
+};
+export declare function TableView({ columns, rows, pagination, onPageChange, onSort, currentSort, loading, filters, onFiltersChange, }: TableViewProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=table-view.d.ts.map

package/dist/src/connect/components/db-explorer/components/table-view.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-view.d.ts","sourceRoot":"","sources":["../../../../../../src/connect/components/db-explorer/components/table-view.tsx"],"names":[],"mappings":"AAKA,MAAM,MAAM,UAAU,GAAG;IACvB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAC;CAC9B,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,KAAK,GAAG,MAAM,CAAC;AAE3C,MAAM,MAAM,WAAW,GAAG;IACxB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,SAAS,EAAE,aAAa,CAAC;CACnC,CAAC;AAEF,MAAM,MAAM,cAAc,GACtB,GAAG,GACH,IAAI,GACJ,GAAG,GACH,GAAG,GACH,IAAI,GACJ,IAAI,GACJ,MAAM,GACN,OAAO,GACP,SAAS,GACT,aAAa,CAAC;AAElB,MAAM,MAAM,YAAY,GAAG;IACzB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAClC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IACxB,QAAQ,CAAC,OAAO,EAAE,YAAY,EAAE,CAAC;IACjC,QAAQ,CAAC,UAAU,EAAE,CAAC,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC;CACvC,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CAC/B,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,QAAQ,CAAC,OAAO,EAAE,UAAU,EAAE,CAAC;IAC/B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAC;IACzC,QAAQ,CAAC,UAAU,EAAE,eAAe,CAAC;IACrC,QAAQ,CAAC,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IAC9C,QAAQ,CAAC,WAAW,CAAC,EAAE,WAAW,CAAC;IACnC,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,OAAO,CAAC,EAAE,WAAW,CAAC;IAC/B,QAAQ,CAAC,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,GAAG,SAAS,KAAK,IAAI,CAAC;CACvE,CAAC;AAmEF,wBAAgB,SAAS,CAAC,EACxB,OAAO,EACP,IAAI,EACJ,UAAU,EACV,YAAY,EACZ,MAAM,EACN,WAAW,EACX,OAAe,EACf,OAAO,EACP,eAAe,GAChB,EAAE,cAAc,2CA4QhB"}

package/dist/src/connect/components/db-explorer/components/table-view.js

@@ -0,0 +1,122 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon } from "@powerhousedao/design-system";
+import { useState } from "react";
+import { twMerge } from "tailwind-merge";
+import { FilterBar } from "./filter-bar.js";
+function formatCellValue(value) {
+    if (value === null)
+        return "NULL";
+    if (value === undefined)
+        return "";
+    if (typeof value === "object")
+        return JSON.stringify(value);
+    if (typeof value === "function")
+        return "[function]";
+    if (typeof value === "symbol")
+        return value.toString();
+    return String(value);
+}
+function escapeCsvValue(value) {
+    // If the value contains comma, newline, or double quote, wrap it in quotes and escape quotes
+    if (value.includes(",") || value.includes("\n") || value.includes('"')) {
+        return `"${value.replace(/"/g, '""')}"`;
+    }
+    return value;
+}
+function rowToCsv(row, columns) {
+    return columns
+        .map((column) => {
+        const value = formatCellValue(row[column.name]);
+        return escapeCsvValue(value);
+    })
+        .join(",");
+}
+function rowsToCsv(rows, columns) {
+    const header = columns.map((col) => escapeCsvValue(col.name)).join(",");
+    const dataRows = rows.map((row) => rowToCsv(row, columns));
+    return [header, ...dataRows].join("\n");
+}
+async function copyToClipboard(text) {
+    await navigator.clipboard.writeText(text);
+}
+function SortIcon({ direction, active, }) {
+    if (!active) {
+        return (_jsx(Icon, { className: "opacity-0 group-hover:opacity-50", name: "CaretSort", size: 12 }));
+    }
+    return (_jsx(Icon, { className: direction === "asc" ? "rotate-180" : undefined, name: "TriangleDown", size: 12 }));
+}
+export function TableView({ columns, rows, pagination, onPageChange, onSort, currentSort, loading = false, filters, onFiltersChange, }) {
+    const { offset, limit, total } = pagination;
+    const currentPage = Math.floor(offset / limit);
+    const totalPages = total !== null ? Math.ceil(total / limit) : 0;
+    const startItem = total === 0 ? 0 : offset + 1;
+    const endItem = total !== null ? Math.min(offset + limit, total) : offset + rows.length;
+    const goToPage = (page) => {
+        onPageChange(page * limit);
+    };
+    const handleSort = (columnName) => {
+        if (!onSort)
+            return;
+        const newDirection = currentSort?.column === columnName && currentSort.direction === "asc"
+            ? "desc"
+            : "asc";
+        onSort({ column: columnName, direction: newDirection });
+    };
+    const getVisiblePages = () => {
+        const maxVisible = 3;
+        if (totalPages <= maxVisible) {
+            return Array.from({ length: totalPages }, (_, i) => i);
+        }
+        const start = Math.max(0, Math.min(currentPage - 1, totalPages - maxVisible));
+        const end = Math.min(totalPages - 1, start + maxVisible - 1);
+        const pages = [];
+        for (let i = start; i <= end; i++) {
+            pages.push(i);
+        }
+        return pages;
+    };
+    const visiblePages = getVisiblePages();
+    const [copying, setCopying] = useState(false);
+    const [copiedRowIndex, setCopiedRowIndex] = useState(null);
+    const handleCopyAll = async () => {
+        if (rows.length === 0)
+            return;
+        setCopying(true);
+        try {
+            const csv = rowsToCsv(rows, columns);
+            await copyToClipboard(csv);
+            setTimeout(() => setCopying(false), 1000);
+        }
+        catch (err) {
+            console.error("Failed to copy to clipboard:", err);
+            setCopying(false);
+        }
+    };
+    const handleCopyRow = async (rowIndex) => {
+        if (rowIndex < 0 || rowIndex >= rows.length)
+            return;
+        setCopiedRowIndex(rowIndex);
+        try {
+            const csv = rowToCsv(rows[rowIndex], columns);
+            await copyToClipboard(csv);
+            setTimeout(() => setCopiedRowIndex(null), 1000);
+        }
+        catch (err) {
+            console.error("Failed to copy to clipboard:", err);
+            setCopiedRowIndex(null);
+        }
+    };
+    return (_jsxs("div", { className: "flex h-full flex-col gap-2", children: [onFiltersChange && (_jsx(FilterBar, { columns: columns, filters: filters, onFiltersChange: onFiltersChange })), _jsxs("div", { className: "flex shrink-0 items-center justify-between text-sm", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-gray-600", children: loading
+                                    ? "Loading..."
+                                    : total !== null
+                                        ? `Showing ${startItem.toLocaleString()}-${endItem.toLocaleString()} of ${total.toLocaleString()}`
+                                        : `Showing ${rows.length.toLocaleString()} rows` }), rows.length > 0 && (_jsxs("button", { className: "flex items-center gap-1 rounded border border-gray-300 bg-white px-2 py-1 text-xs text-gray-700 hover:bg-gray-100 disabled:cursor-not-allowed disabled:opacity-50", disabled: loading || copying, onClick: handleCopyAll, title: "Copy all rows as CSV", type: "button", children: [_jsx(Icon, { name: copying ? "Check" : "Copy", size: 14 }), copying ? "Copied!" : "Copy All"] }))] }), total !== null && total > limit && (_jsxs("div", { className: "flex gap-1", children: [_jsx("button", { className: "rounded border border-gray-300 bg-white px-2 py-1 text-xs text-gray-700 hover:bg-gray-100 disabled:cursor-not-allowed disabled:opacity-50", disabled: currentPage === 0, onClick: () => goToPage(0), type: "button", children: "First" }), _jsx("button", { className: "rounded border border-gray-300 bg-white px-2 py-1 text-xs text-gray-700 hover:bg-gray-100 disabled:cursor-not-allowed disabled:opacity-50", disabled: currentPage === 0, onClick: () => goToPage(currentPage - 1), type: "button", children: _jsx(Icon, { className: "rotate-90", name: "ChevronDown", size: 14 }) }), visiblePages[0] > 0 && (_jsx("span", { className: "flex items-center px-1 text-xs text-gray-500", children: "..." })), visiblePages.map((page) => (_jsx("button", { className: twMerge("min-w-8 rounded border px-2 py-1 text-xs", page === currentPage
+                                    ? "border-blue-500 bg-blue-50 text-blue-700"
+                                    : "border-gray-300 bg-white text-gray-700 hover:bg-gray-100"), onClick: () => goToPage(page), type: "button", children: page + 1 }, page))), visiblePages[visiblePages.length - 1] < totalPages - 1 && (_jsx("span", { className: "flex items-center px-1 text-xs text-gray-500", children: "..." })), _jsx("button", { className: "rounded border border-gray-300 bg-white px-2 py-1 text-xs text-gray-700 hover:bg-gray-100 disabled:cursor-not-allowed disabled:opacity-50", disabled: currentPage >= totalPages - 1, onClick: () => goToPage(currentPage + 1), type: "button", children: _jsx(Icon, { className: "-rotate-90", name: "ChevronDown", size: 14 }) }), _jsx("button", { className: "rounded border border-gray-300 bg-white px-2 py-1 text-xs text-gray-700 hover:bg-gray-100 disabled:cursor-not-allowed disabled:opacity-50", disabled: currentPage >= totalPages - 1, onClick: () => goToPage(totalPages - 1), type: "button", children: "Last" })] }))] }), _jsx("div", { className: twMerge("max-h-full overflow-auto rounded-lg border border-gray-300 transition-opacity", loading && "pointer-events-none opacity-50"), children: _jsxs("table", { className: "w-full border-collapse", children: [_jsx("thead", { className: "sticky top-0 bg-gray-100", children: _jsxs("tr", { children: [_jsx("th", { className: "w-12 px-2 py-2 text-center text-xs font-medium text-gray-600", children: _jsx("span", { className: "sr-only", children: "Copy" }) }), columns.map((column, index) => {
+                                        const isActive = currentSort?.column === column.name;
+                                        const sortDirection = isActive ? currentSort.direction : "asc";
+                                        return (_jsx("th", { className: twMerge("group px-3 py-2 text-left text-xs font-medium text-gray-600", index > 0 && "border-l border-gray-300", onSort &&
+                                                "cursor-pointer hover:bg-gray-200 hover:text-gray-900"), onClick: () => onSort && handleSort(column.name), children: _jsxs("div", { className: "flex items-center gap-1", children: [_jsx("span", { className: "truncate", children: column.name }), onSort && (_jsx(SortIcon, { active: isActive, direction: sortDirection }))] }) }, column.name));
+                                    })] }) }), _jsx("tbody", { children: rows.length === 0 ? (_jsx("tr", { children: _jsx("td", { className: "px-3 py-8 text-center text-sm text-gray-500", colSpan: columns.length + 1, children: "No data" }) })) : (rows.map((row, rowIndex) => (_jsxs("tr", { className: "odd:bg-white even:bg-gray-50 hover:bg-blue-50", children: [_jsx("td", { className: "px-2 py-2 text-center", children: _jsx("button", { className: "flex items-center justify-center rounded p-1 text-gray-500 hover:bg-gray-200 hover:text-gray-700", onClick: () => void handleCopyRow(rowIndex), title: "Copy row as CSV", type: "button", children: _jsx(Icon, { name: copiedRowIndex === rowIndex ? "Check" : "Copy", size: 14 }) }) }), columns.map((column, colIndex) => (_jsx("td", { className: twMerge("px-3 py-2 text-xs text-gray-900", colIndex > 0 && "border-l border-gray-300"), children: _jsx("span", { className: twMerge("block truncate", row[column.name] === null && "italic text-gray-400"), title: formatCellValue(row[column.name]), children: formatCellValue(row[column.name]) }) }, column.name)))] }, rowIndex)))) })] }) })] }));
+}
+//# sourceMappingURL=table-view.js.map