@g4rcez/components 0.0.1 → 0.0.2

package/src/components/table/group.tsx

@@ -1,123 +0,0 @@
-"use client";
-import { LayoutGroup, Reorder, useDragControls, useMotionValue } from "framer-motion";
-import Linq from "linq-arrays";
-import { GripVerticalIcon, GroupIcon, Trash2Icon } from "lucide-react";
-import React, { Fragment, useState } from "react";
-import { keys } from "sidekicker";
-import { Button } from "~/components/core/button";
-import { Dropdown } from "~/components/floating/dropdown";
-import { Select } from "~/components/form/select";
-import { uuid } from "~/lib/fns";
-import { Col, createOptionCols, TableConfiguration } from "./table-lib";
-
-export type GroupItem<T extends {}> = Col<T> & {
-    rows: T[];
-    index: number;
-    groupId: string;
-    groupName: string;
-    groupKey: keyof T;
-};
-
-type Props<T extends {}> = TableConfiguration<
-    T,
-    {
-        rows: T[];
-        groups: GroupItem<T>[];
-        setGroups: React.Dispatch<React.SetStateAction<GroupItem<T>[]>>;
-    }
->;
-
-const Item = ({ item, onPointerDown }: { item: GroupItem<any>; onPointerDown: any }) => {
-    const y = useMotionValue(0);
-    return (
-        <Reorder.Item
-            onPointerDown={onPointerDown}
-            id={item.groupId}
-            className="flex flex-row items-center gap-2"
-            key={item.groupId}
-            value={item}
-            style={{ y }}
-        >
-            <button className="cursor-grab">
-                <GripVerticalIcon size={14} />
-            </button>
-            <span>{item.groupName}</span>
-        </Reorder.Item>
-    );
-};
-
-export const Group = <T extends {}>(props: Props<T>) => {
-    const options = createOptionCols(props.cols);
-    const controls = useDragControls();
-    const [group, setGroup] = useState((props.groups[0]?.thead as string) || "");
-
-    const onChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
-        const select = e.target;
-        const key = select.value as keyof T;
-        const index = select.options.selectedIndex;
-        const label = select.options.item(index)?.label || "";
-        setGroup(label);
-        const groupBy = new Linq(props.rows).GroupBy(key);
-        const col = props.cols.find((x) => x.id === key)!;
-        props.setGroups(
-            keys(groupBy).map((groupName, index): GroupItem<T> => {
-                const rows = groupBy[groupName];
-                return { ...col, groupId: uuid(), groupKey: key, index, rows, groupName: groupName as string };
-            })
-        );
-    };
-
-    const onDelete = (e: React.MouseEvent<HTMLButtonElement>) => props.setGroups([]);
-
-    return (
-        <Fragment>
-            <Dropdown
-                arrow={false}
-                title="Groups"
-                trigger={
-                    <span className="flex items-center gap-1 proportional-nums">
-                        <GroupIcon size={14} />
-                        Groups{props.groups.length > 0 ? ` - ${group}(${props.groups.length})` : ""}
-                    </span>
-                }
-            >
-                <div className="flex flex-nowrap items-center">
-                    <Select value={group} title="Tipo de agrupamento" onChange={onChange} options={options} placeholder="Agrupar por..." />
-                    <Button className="mt-4" onClick={onDelete} theme="raw" data-id={group}>
-                        <Trash2Icon size={16} className="text-danger" />
-                    </Button>
-                </div>
-                {props.groups.length > 0 ? (
-                    <section className="my-4">
-                        <header>
-                            <h2 className="text-xl font-medium">Ordenar grupos</h2>
-                        </header>
-                        <LayoutGroup>
-                            <Reorder.Group
-                                axis="y"
-                                className="relative space-y-2"
-                                dragListener={false}
-                                dragControls={controls}
-                                drag
-                                layoutScroll
-                                onReorder={props.setGroups}
-                                values={props.groups}
-                            >
-                                {props.groups.map((item) => (
-                                    <Item
-                                        key={item.groupId}
-                                        item={item as any}
-                                        onPointerDown={(e: any) => {
-                                            controls.start(e);
-                                            props.setGroups([...props.groups]);
-                                        }}
-                                    />
-                                ))}
-                            </Reorder.Group>
-                        </LayoutGroup>
-                    </section>
-                ) : null}
-            </Dropdown>
-        </Fragment>
-    );
-};

package/src/components/table/index.tsx

@@ -1,207 +0,0 @@
-import { AnimatePresence, motion } from "framer-motion";
-import Linq from "linq-arrays";
-import React, { Fragment, HTMLAttributes, useMemo } from "react";
-import { TableBodyProps, TableVirtuoso } from "react-virtuoso";
-import { Is } from "sidekicker";
-import { useReducer } from "use-typed-reducer";
-import { OptionProps } from "~/components/form/select";
-import { path } from "~/lib/fns";
-import { FilterConfig } from "./filter";
-import { GroupItem } from "./group";
-import { Metadata } from "./metadata";
-import { multiSort, Sorter } from "./sort";
-import { CellPropsElement, Col, ColMatrix, createOptionCols, TableOperationProps } from "./table-lib";
-import { TableHeader } from "./thead";
-
-type InnerTableProps<T extends {}> = HTMLAttributes<HTMLTableElement> &
-    TableOperationProps<T> & {
-        loading?: boolean;
-        group?: GroupItem<T>;
-        groups?: GroupItem<T>[];
-        optionCols: OptionProps[];
-        index: number;
-        rows: T[];
-        cols: Col<T>[];
-        sorters?: Sorter<T>[];
-        showMetadata?: boolean;
-        filters?: FilterConfig<T>[];
-        setGroups: React.Dispatch<React.SetStateAction<GroupItem<T>[]>>;
-    };
-
-const TableBody = React.forwardRef((props: TableBodyProps, ref: any) => (
-    <tbody {...props} className={`divide-y divide-table-row ${props.className ?? ""}`} ref={ref}>
-        <AnimatePresence>{props.children}</AnimatePresence>
-    </tbody>
-));
-
-const VirtualTable = React.forwardRef((props: any, ref) => (
-    <table {...props} ref={ref as any} className={`table min-w-full divide-y divide-table-border table-auto text-left ${props.className ?? ""}`} />
-));
-
-const Thead = React.forwardRef((props: any, ref: any) => <thead {...props} className="bg-content-bg shadow-xs group:sticky top-0" ref={ref} />);
-
-const TRow = React.forwardRef((props: any, ref: any) => <tr {...props} ref={ref} className={`table-row ${props.className ?? ""}`} />);
-
-const components = {
-    TableHead: Thead as any,
-    Table: VirtualTable as any,
-    TableBody: TableBody as any,
-    TableRow: TRow as any,
-};
-
-const loadingArray = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
-
-const InnerTable = <T extends {}>({ filters, setCols, setFilters, sorters, cols, setSorters, ...props }: InnerTableProps<T>) => {
-    const rows = useMemo(() => {
-        if (props.loading) return loadingArray as any as T[];
-        const linq = new Linq(props.rows);
-        if (filters.length > 0) {
-            filters.forEach((x) => (x.value === "" || Number.isNaN(x.value) ? undefined : linq.Where(x.name, x.operation.symbol, x.value)));
-        }
-        if (sorters.length === 0) return linq.Select();
-        return multiSort(linq.Select(), sorters);
-    }, [props.rows, filters, sorters, props.loading]);
-
-    return (
-        <div className="group border border-table-border rounded-lg px-1 min-w-full">
-            <TableVirtuoso
-                data={rows}
-                totalCount={rows.length}
-                useWindowScroll
-                components={components}
-                fixedHeaderContent={() => (
-                    <TableHeader<T>
-                        sorters={sorters}
-                        setSorters={setSorters}
-                        filters={filters}
-                        setFilters={setFilters}
-                        headers={cols}
-                        setCols={setCols}
-                    />
-                )}
-                itemContent={(index, row) =>
-                    cols.map((col, colIndex) => {
-                        const matrix: ColMatrix = `${colIndex},${index}`;
-                        const value: any = path(row, col.id as any);
-                        const Component: React.FC<CellPropsElement<T, any>> = col.Element as any;
-                        return (
-                            <td
-                                {...col.cellProps}
-                                data-matrix={matrix}
-                                key={`accessor-${index}-${colIndex}`}
-                                className="px-2 h-14 border-none first:table-cell hidden md:table-cell"
-                            >
-                                {props.loading ? (
-                                    <div className="animate-pulse h-2 bg-table-border rounded" />
-                                ) : Component ? (
-                                    <Component row={row} matrix={matrix} col={col} rowIndex={index} value={value} />
-                                ) : (
-                                    <Fragment>{Is.nil(value) ? "" : value}</Fragment>
-                                )}
-                            </td>
-                        );
-                    })
-                }
-            />
-        </div>
-    );
-};
-
-export type TableProps<T extends {}> = Pick<InnerTableProps<T>, "cols" | "rows"> & {
-    name: string;
-} & Partial<TableOperationProps<T> & { reference: keyof T; loading: boolean }>;
-
-const dispatcherFun = <Prev extends any, T extends Prev | ((prev: Prev) => Prev)>(prev: Prev, setter: T) =>
-    typeof setter === "function" ? setter(prev) : setter;
-
-type DispatcherFun<T extends any> = T | ((prev: T) => T);
-
-export const Table = <T extends {}>(props: TableProps<T>) => {
-    const optionCols = useMemo(() => createOptionCols(props.cols), [props.cols]);
-    const [state, dispatch] = useReducer(
-        {
-            cols: props.cols as Col<T>[],
-            filters: (props.filters ?? []) as FilterConfig<T>[],
-            groups: (props.groups ?? []) as GroupItem<T>[],
-            sorters: (props.sorters ?? []) as Sorter<T>[],
-        },
-        (get) => {
-            const create =
-                <T extends any>(key: string) =>
-                (arg: T) => {
-                    const state = get.state();
-                    return { ...state, [key]: dispatcherFun(state[key as keyof typeof state], arg as any) };
-                };
-            return {
-                cols: create<DispatcherFun<Col<T>[]>>("cols"),
-                filters: create<DispatcherFun<FilterConfig<T>[]>>("filters"),
-                groups: create<DispatcherFun<GroupItem<T>[]>>("groups"),
-                sorters: create<DispatcherFun<Sorter<T>[]>>("sorters"),
-            };
-        },
-        {
-            interceptor: [
-                (state) => {
-                    props.set?.(state as any);
-                    return state;
-                },
-            ],
-        }
-    );
-
-    return (
-        <div className="relative min-w-full">
-            <Metadata
-                setCols={dispatch.cols}
-                rows={props.rows}
-                cols={state.cols}
-                filters={state.filters}
-                groups={state.groups}
-                options={optionCols}
-                setFilters={dispatch.filters}
-                setGroups={dispatch.groups}
-                setSorters={dispatch.sorters}
-                sorters={state.sorters}
-            />
-            {state.groups.length === 0 ? (
-                <InnerTable
-                    {...props}
-                    cols={state.cols}
-                    filters={state.filters}
-                    groups={state.groups}
-                    index={0}
-                    optionCols={optionCols}
-                    options={optionCols}
-                    setCols={dispatch.cols}
-                    setFilters={dispatch.filters}
-                    setGroups={dispatch.groups}
-                    setSorters={dispatch.sorters}
-                    sorters={state.sorters}
-                />
-            ) : (
-                <div className="flex flex-wrap gap-4">
-                    {state.groups.map((group, index) => (
-                        <motion.div className="min-w-full" key={`group-${group.groupId}`}>
-                            <InnerTable
-                                {...props}
-                                cols={state.cols}
-                                filters={state.filters}
-                                group={group}
-                                groups={state.groups}
-                                index={index}
-                                optionCols={optionCols}
-                                options={optionCols}
-                                rows={group.rows}
-                                setCols={dispatch.cols}
-                                setFilters={dispatch.filters}
-                                setGroups={dispatch.groups}
-                                setSorters={dispatch.sorters}
-                                sorters={state.sorters}
-                            />
-                        </motion.div>
-                    ))}
-                </div>
-            )}
-        </div>
-    );
-};

package/src/components/table/metadata.tsx

@@ -1,55 +0,0 @@
-import { Filter } from "./filter";
-import { Group } from "./group";
-import { Sort } from "./sort";
-import { TableOperationProps, valueFromType } from "./table-lib";
-
-export const Metadata = <T extends {}>(props: TableOperationProps<T>) => (
-    <header className="min-w-full mb-1">
-        <div className="flex flex-wrap min-w-full items-center justify-between gap-x-4 gap-y-1">
-            <div className="flex w-fit items-centeend gap-4 whitespace-nowrap py-2">
-                <p>
-                    <Filter cols={props.cols} options={props.options} filters={props.filters} set={props.setFilters} />
-                </p>
-                <p>
-                    <Sort options={props.options} cols={props.cols} sorters={props.sorters} set={props.setSorters} />
-                </p>
-                <p>
-                    <Group rows={props.rows} groups={props.groups} setGroups={props.setGroups} options={props.options} cols={props.cols} />
-                </p>
-            </div>
-            <ul className="flex flex-wrap w-full flex-1 flex-grow flex-row items-center md:justify-end gap-4">
-                {props.filters.map((x) => (
-                    <li key={`filter-table-${x.id}`} className="flex gap-1 items-center rounded-xl border border-card-border px-4 py-0.5">
-                        <span>
-                            <span className="size-3 mr-2 aspect-square bg-primary inline-block rounded-full" aria-hidden="true" />
-                            {x.label} {x.operation.label.toLowerCase()}:
-                        </span>
-                        <div className="relative w-min min-w-[1ch]">
-                            <span aria-hidden="true" className="invisible whitespace-pre p-0">
-                                {x.value || " "}
-                            </span>
-                            <input
-                                type={x.type}
-                                value={x.value as string}
-                                className="absolute left-0 top-0 m-0 inline-block w-full bg-transparent p-0 placeholder-primary/70 outline-none [appearance:textfield] after:empty:text-primary/70 [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none"
-                                onChange={(e) => {
-                                    const value = valueFromType(e.target);
-                                    props.setFilters((prev) =>
-                                        prev.map((item) =>
-                                            x.id === item.id
-                                                ? {
-                                                      ...item,
-                                                      value,
-                                                  }
-                                                : item
-                                        )
-                                    );
-                                }}
-                            />
-                        </div>
-                    </li>
-                ))}
-            </ul>
-        </div>
-    </header>
-);

package/src/components/table/sort.tsx

@@ -1,141 +0,0 @@
-"use client";
-import { ChevronDownIcon, ChevronUpIcon, PlusIcon, SortAscIcon, Trash2Icon } from "lucide-react";
-import React, { Fragment, useEffect, useState } from "react";
-import { Dropdown } from "~/components/floating/dropdown";
-import { OptionProps, Select } from "~/components/form/select";
-import { uuid } from "~/lib/fns";
-import { Label } from "~/types";
-import { Col, TableConfiguration, TableOperationProps } from "./table-lib";
-
-type Keyof<T extends {}> = keyof T extends infer R extends string ? R : never;
-
-enum Order {
-    Asc = "asc",
-    Desc = "desc",
-    Undefined = "undefined",
-}
-
-export type Sorter<T extends {}> = { value: Keyof<T>; type: Order; label: Label; id: string };
-
-const createSorterFn =
-    <T extends {}>(fields: Sorter<T>[]) =>
-    (a: any, b: any) =>
-        fields.reduce<number>((acc, x) => {
-            const reverse = x.type === "desc" ? -1 : 1;
-            const property = x.value;
-            const p = a[property] > b[property] ? reverse : a[property] < b[property] ? -reverse : 0;
-            return acc !== 0 ? acc : p;
-        }, 0);
-
-export const multiSort = <T extends {}>(array: T[], fields: Sorter<T>[]) => array.sort(createSorterFn(fields));
-
-const orders = {
-    asc: { label: "Ascending", value: Order.Asc },
-    desc: { label: "Descending", value: Order.Desc },
-} satisfies Omit<Record<Order, OptionProps>, Order.Undefined>;
-
-const orderOptions: OptionProps[] = [orders.asc, orders.desc];
-
-type Props<T extends {}> = TableConfiguration<
-    T,
-    {
-        cols: Col<T>[];
-        sorters: Sorter<T>[];
-        set: React.Dispatch<React.SetStateAction<Sorter<T>[]>>;
-    }
->;
-
-const createSorter = <T extends {}>(col: Col<T>, order: Order = Order.Asc): Sorter<T> => ({
-    id: uuid(),
-    type: order,
-    value: col.id as any,
-    label: orders[Order.Asc].label,
-});
-
-export const Sort = <T extends {}>(props: Props<T>) => {
-    const onAddSorter = () => {
-        const col = props.cols[0];
-        if (col) props.set((prev) => [...prev, createSorter(col)]);
-    };
-
-    const onSetSorter = (id: string) => (e: React.ChangeEvent<HTMLSelectElement>) => {
-        const value = e.target.value;
-        props.set((prev) => prev.map((x) => (x.id === id ? { ...x, value: value as Keyof<T> } : x)));
-    };
-
-    const onSortOrderType = (id: string) => (e: React.ChangeEvent<HTMLSelectElement>) => {
-        const type = e.target.value;
-        props.set((prev) => prev.map((x) => (x.id === id ? { ...x, type: type as Order } : x)));
-    };
-
-    const onDelete = (e: React.MouseEvent<HTMLButtonElement>) => {
-        const id = e.currentTarget.dataset.id || "";
-        props.set((prev) => prev.filter((x) => x.id !== id));
-    };
-
-    return (
-        <Fragment>
-            <Dropdown
-                arrow={false}
-                title="Order By"
-                trigger={
-                    <span className="flex items-center gap-1 proportional-nums text-foreground-description">
-                        <SortAscIcon size={14} />
-                        Order by {props.sorters.length === 0 ? "" : ` (${props.sorters.length})`}
-                    </span>
-                }
-            >
-                <ul className="mt-4 space-y-2">
-                    {props.sorters.map((sorter) => {
-                        return (
-                            <li key={`sorter-select-${sorter.id}`} className="flex flex-nowrap gap-3">
-                                <Select
-                                    onChange={onSetSorter(sorter.id)}
-                                    options={props.options}
-                                    placeholder="Selecione um campo..."
-                                    value={sorter.value as string}
-                                />
-                                <Select onChange={onSortOrderType(sorter.id)} value={sorter.type} options={orderOptions} placeholder="Operação..." />
-                                <button className="mt-4" data-id={sorter.id} onClick={onDelete}>
-                                    <Trash2Icon className="text-danger" size={14} />
-                                </button>
-                            </li>
-                        );
-                    })}
-                    <li>
-                        <button onClick={onAddSorter} className="text-primary flex items-center gap-1">
-                            <PlusIcon size={14} /> Adicionar ordenação
-                        </button>
-                    </li>
-                </ul>
-            </Dropdown>
-        </Fragment>
-    );
-};
-
-type SorterHeadProps<T extends {}> = Pick<TableOperationProps<T>, "sorters" | "setSorters"> & { col: Col<T> };
-
-export const SorterHead = <T extends {}>(props: SorterHeadProps<T>) => {
-    const sorter = props.sorters.find((sort) => sort.id === props.col.id);
-    const [status, setStatus] = useState(sorter ? sorter.type : Order.Undefined);
-
-    const onClick = () => setStatus((prev) => (prev === Order.Undefined ? Order.Asc : prev === Order.Asc ? Order.Desc : Order.Undefined));
-
-    useEffect(() => {
-        props.setSorters((prev) => {
-            if (status === Order.Undefined) return prev.filter((x) => (x.value as string) !== props.col.id);
-            const findIndex = prev.findIndex((p) => (p.value as string) === props.col.id);
-            if (findIndex === -1) return [...prev, createSorter(props.col, status)];
-            prev[findIndex] = createSorter(props.col, status);
-            return [...prev];
-        });
-    }, [status, props.col]);
-
-    return (
-        <button className="isolate flex items-center" onClick={onClick}>
-            {status === Order.Asc ? <ChevronDownIcon size={14} /> : null}
-            {status === Order.Desc ? <ChevronUpIcon size={14} /> : null}
-            {status === Order.Undefined ? <SortAscIcon size={14} /> : null}
-        </button>
-    );
-};

package/src/components/table/table-lib.ts

@@ -1,130 +0,0 @@
-"use client";
-import React from "react";
-import { LocalStorage } from "storage-manager-js";
-import { useReducer } from "use-typed-reducer";
-import { OptionProps } from "~/components/form/select";
-import { isSsr } from "~/lib/fns";
-import { POJO, SetState } from "~/types";
-import { FilterConfig } from "./filter";
-import { GroupItem } from "./group";
-import { Sorter } from "./sort";
-
-export const getLabel = <T extends {}>(col: Col<T>) => col.headerLabel ?? col.thead ?? (col.id as string);
-
-export type TableConfiguration<T extends {}, M extends {} = {}> = M & {
-    cols: Col<T>[];
-    options: OptionProps[];
-};
-
-export const createOptionCols = <T extends {}>(cols: Col<T>[]): OptionProps[] =>
-    cols.map((opt) => ({
-        value: opt.id as string,
-        label: (opt.thead ?? opt.headerLabel ?? (opt.id as string)) as string,
-    }));
-
-export enum ColType {
-    Boolean = "boolean",
-    Number = "number",
-    Select = "select",
-    Text = "text",
-}
-
-export const valueFromType = (input: HTMLInputElement) => (input.type === "number" ? input.valueAsNumber : input.value);
-
-type THead = React.ReactElement | React.ReactNode;
-
-export type ColMatrix = `${number},${number}`;
-
-export type CellPropsElement<T extends {}, K extends keyof T> = {
-    row: T;
-    value: T[K];
-    rowIndex: number;
-    matrix: ColMatrix;
-    col: ColOptions<T, K> & { id: K; thead: THead };
-};
-
-type ColOptions<T extends {}, K extends keyof T> = Partial<{
-    cellProps: React.HTMLAttributes<HTMLTableCellElement>;
-    thProps: React.HTMLAttributes<HTMLTableCellElement>;
-    type: ColType;
-    headerLabel: string;
-    allowFilter: boolean;
-    Element: (props: CellPropsElement<T, K>) => React.ReactNode;
-}>;
-
-export type ColConstructor<T extends {}> = {
-    remove: <K extends keyof T>(id: K) => void;
-    add: <K extends keyof T>(id: K, thead: THead, props?: ColOptions<T, K>) => void;
-};
-
-const cols =
-    <T extends POJO>() =>
-    <K extends keyof T>(id: K, thead: THead, options: ColOptions<T, K>) => ({ ...options, id, thead });
-
-export type Col<T extends {}> = ReturnType<ReturnType<typeof cols<T>>>;
-
-type TableGetters<T extends POJO> = {
-    rows: T[];
-    cols: Col<T>[];
-    groups: GroupItem<T>[];
-    sorters: Sorter<T>[];
-    filters: FilterConfig<T>[];
-};
-
-type TableSetters<T extends POJO> = {
-    setCols: SetState<Col<T>[]>;
-    setSorters: SetState<Sorter<T>[]>;
-    setGroups: SetState<GroupItem<T>[]>;
-    setFilters: SetState<FilterConfig<T>[]>;
-};
-
-export type TableOperationProps<T extends {}> = TableConfiguration<
-    T,
-    TableSetters<T> &
-        TableGetters<T> & {
-            set?: (v: TableGetters<T>) => void;
-        }
->;
-
-export const createColumns = <T extends {}>(callback: (o: ColConstructor<T>) => void) => {
-    let items: Col<T>[] = [];
-    const add: ColConstructor<T>["add"] = (id, thead, options) => items.push({ ...options, id, thead } as any);
-    const remove: ColConstructor<T>["remove"] = (id) => (items = items.filter((x) => x.id !== id));
-    callback({ add, remove });
-    return items;
-};
-
-type TablePreferenceState<T extends POJO> = {
-    name: string;
-    cols: Col<T>[];
-    groups: GroupItem<T>[];
-    sorters: Sorter<T>[];
-    filters: FilterConfig<T>[];
-};
-
-const noop = {};
-
-export const useTablePreferences = <T extends POJO>(name: string, options: Partial<TableGetters<T>> = noop) => {
-    const init: TableGetters<T> | null = isSsr() ? null : (LocalStorage.get(`@unamed/table-${name}`) as TableGetters<T>) || null;
-    const [state, dispatch] = useReducer(
-        {
-            name,
-            groups: options.groups || init?.groups || [],
-            sorters: options.sorters || init?.sorters || [],
-            filters: options.filters || init?.filters || [],
-            cols: options.cols || init?.cols || [],
-        } as Omit<TableGetters<T>, "rows"> & { name: string },
-        (get) => {
-            const intercept = (partial: Partial<TablePreferenceState<T>>) => {
-                const prev = get.state();
-                const result = { ...prev, ...partial };
-                if (!isSsr()) LocalStorage.set(`@unamed/table-${prev.name}`, result);
-                return result;
-            };
-            return {
-                set: (getters: TableGetters<T>) => intercept(getters),
-            };
-        }
-    );
-    return { ...state, ...dispatch, name };
-};