@1771technologies/lytenyte-pro 1.0.12-dev.1 → 1.0.12-dev.2

package/dist/column-manager/use-columns-from-context.js

@@ -0,0 +1,23 @@
+import { useMemo } from "react";
+import { useBranchLookup } from "./branch-lookup-context.js";
+export function useColumnsFromContext(item) {
+    const lookup = useBranchLookup();
+    const columns = useMemo(() => {
+        if (item.kind === "branch") {
+            const allChildren = [];
+            const branch = lookup[item.data.idOccurrence];
+            const stack = [...branch.children.values()];
+            while (stack.length) {
+                const p = stack.pop();
+                if (p.kind === "branch") {
+                    stack.push(...p.children.values());
+                    continue;
+                }
+                allChildren.push(p.data);
+            }
+            return allChildren;
+        }
+        return [item.data];
+    }, [item, lookup]);
+    return columns;
+}

package/dist/column-manager/visibility-checkbox.d.ts

@@ -0,0 +1,9 @@
+import { type SlotComponent } from "@1771technologies/lytenyte-react-hooks";
+export interface VisibilityCheckbox {
+    readonly as?: SlotComponent<{
+        visible: boolean;
+        indeterminate: boolean;
+        toggle: (s?: boolean) => void;
+    }>;
+}
+export declare const VisibilityCheckbox: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & VisibilityCheckbox, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/column-manager/visibility-checkbox.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useSlot } from "@1771technologies/lytenyte-react-hooks";
+import { useColumnItemContext } from "./context.js";
+import { forwardRef, useCallback, useMemo } from "react";
+import { useGrid } from "../grid-provider/use-grid.js";
+import { useColumnsFromContext } from "./use-columns-from-context.js";
+export const VisibilityCheckbox = forwardRef(function VisibilityCheckbox({ as, ...props }, forwarded) {
+    const { item } = useColumnItemContext();
+    const grid = useGrid();
+    const base = grid.state.columnBase.useValue();
+    const columns = useColumnsFromContext(item);
+    const [isVisible, isIndeterminate] = useMemo(() => {
+        const allVisible = columns.every((c) => !(c.hide ?? base.hide));
+        const someVisible = columns.some((c) => !(c.hide ?? base.hide));
+        return [allVisible, !allVisible && someVisible];
+    }, [base.hide, columns]);
+    const toggle = useCallback((s) => {
+        const next = s ?? isVisible;
+        grid.api.columnUpdate(Object.fromEntries(columns.map((c) => [c.id, { hide: next }])));
+    }, [columns, grid.api, isVisible]);
+    const rendered = useSlot({
+        props: [props],
+        ref: forwarded,
+        slot: as ?? (_jsx("input", { type: "checkbox", checked: isVisible, "aria-label": "visibility toggle", onChange: () => {
+                toggle();
+            } })),
+        state: { visible: isVisible, indeterminate: isIndeterminate, toggle },
+    });
+    return rendered;
+});

package/dist/context.d.ts

@@ -0,0 +1,10 @@
+import type { Grid } from "./+types";
+import type { InternalAtoms } from "./state/+types";
+export interface GridRootContext {
+    readonly ref: (el: HTMLElement | SVGElement | null) => void;
+    readonly grid: Grid<any> & {
+        internal: InternalAtoms;
+    };
+}
+export declare const RootProvider: import("react").Provider<GridRootContext>;
+export declare const useGridRoot: () => GridRootContext;

package/dist/context.js

@@ -0,0 +1,4 @@
+import { createContext, useContext } from "react";
+const context = createContext(null);
+export const RootProvider = context.Provider;
+export const useGridRoot = () => useContext(context);

package/dist/filter-tree/branch.d.ts

@@ -0,0 +1,13 @@
+import type { TreeVirtualBranch } from "../tree-view/virtualized/make-virtual-tree";
+import type { FilterInFilterItem } from "../+types";
+import { type SlotComponent } from "@1771technologies/lytenyte-react-hooks";
+export interface FilterTreeBranch {
+    readonly item: TreeVirtualBranch<FilterInFilterItem>;
+    readonly label: SlotComponent;
+    readonly labelWrap?: SlotComponent;
+    readonly expander?: SlotComponent<{
+        expanded: boolean;
+        toggle: () => void;
+    }>;
+}
+export declare const Branch: import("react").ForwardRefExoticComponent<Omit<FilterTreeBranch & import("react").ClassAttributes<HTMLLIElement> & import("react").LiHTMLAttributes<HTMLLIElement>, "ref"> & import("react").RefAttributes<HTMLLIElement>>;

package/dist/filter-tree/branch.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { TreeBranch } from "../tree-view/branch/branch.js";
+import { useSlot } from "@1771technologies/lytenyte-react-hooks";
+import { FilterTreeItemContext } from "./context.js";
+import { useTreeItem } from "./hooks/use-tree-item.js";
+export const Branch = forwardRef(function Branch({ item, labelWrap, label, ...props }, forwarded) {
+    const value = useTreeItem(item);
+    const labelSlot = useSlot({
+        slot: labelWrap ?? _jsx("div", {}),
+        props: [
+            {
+                onClick: () => value.onCheckChange(),
+            },
+        ],
+    });
+    return (_jsx(FilterTreeItemContext.Provider, { value: value, children: _jsx(TreeBranch, { ...props, itemId: item.branch.data.id, ref: forwarded, ...item.attrs, onKeyDown: (ev) => {
+                if (ev.key === " ")
+                    value.onCheckChange();
+            }, label: label, labelWrap: labelSlot }) }));
+});

package/dist/filter-tree/context.d.ts

@@ -0,0 +1,27 @@
+import { type Dispatch, type SetStateAction } from "react";
+import type { TreeVirtualItem } from "../tree-view/virtualized/make-virtual-tree.js";
+import type { FilterIn, FilterInFilterItem } from "../+types.js";
+export interface TreeItemContextValue {
+    readonly item: TreeVirtualItem<FilterInFilterItem>;
+    readonly onCheckChange: (b?: boolean) => void;
+    readonly isChecked: boolean;
+    readonly isIndeterminate: boolean;
+}
+export declare const FilterTreeContext: import("react").Context<{
+    items: FilterInFilterItem[];
+    pivotMode: boolean;
+    columnId: string;
+    filter: FilterIn;
+    filterChange: Dispatch<SetStateAction<FilterIn>>;
+    applyChangesImmediately: boolean;
+}>;
+export declare const useTreeContext: () => {
+    items: FilterInFilterItem[];
+    pivotMode: boolean;
+    columnId: string;
+    filter: FilterIn;
+    filterChange: Dispatch<SetStateAction<FilterIn>>;
+    applyChangesImmediately: boolean;
+};
+export declare const FilterTreeItemContext: import("react").Context<TreeItemContextValue>;
+export declare const useTreeItemContext: () => TreeItemContextValue;

package/dist/filter-tree/context.js

@@ -0,0 +1,5 @@
+import { createContext, useContext } from "react";
+export const FilterTreeContext = createContext(null);
+export const useTreeContext = () => useContext(FilterTreeContext);
+export const FilterTreeItemContext = createContext(null);
+export const useTreeItemContext = () => useContext(FilterTreeItemContext);

package/dist/filter-tree/filter-tree.d.ts

@@ -0,0 +1,14 @@
+import { ForceSyncScrolling } from "../tree-view/virtualized/force-sync-scrolling.js";
+import { InclusionCheckbox } from "./inclusion-checkbox.js";
+import { Root } from "./root.js";
+import { useFilterTree } from "./hooks/use-filter-tree.js";
+export declare const FilterTree: {
+    Root: typeof Root;
+    Panel: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & import("react").RefAttributes<HTMLUListElement>>;
+    PassiveScroll: typeof ForceSyncScrolling;
+    Leaf: import("react").ForwardRefExoticComponent<Omit<import("./leaf.js").FilterTreeLeafProps & import("react").ClassAttributes<HTMLLIElement> & import("react").LiHTMLAttributes<HTMLLIElement>, "ref"> & import("react").RefAttributes<HTMLLIElement>>;
+    Branch: import("react").ForwardRefExoticComponent<Omit<import("./branch.js").FilterTreeBranch & import("react").ClassAttributes<HTMLLIElement> & import("react").LiHTMLAttributes<HTMLLIElement>, "ref"> & import("react").RefAttributes<HTMLLIElement>>;
+    Label: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & import("./label.js").LabelProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Checkbox: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & InclusionCheckbox, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    useFilterTree: typeof useFilterTree;
+};

package/dist/filter-tree/filter-tree.js

@@ -0,0 +1,18 @@
+import { TreePanel } from "../tree-view/panel/panel.js";
+import { ForceSyncScrolling } from "../tree-view/virtualized/force-sync-scrolling.js";
+import { Branch } from "./branch.js";
+import { InclusionCheckbox } from "./inclusion-checkbox.js";
+import { Label } from "./label.js";
+import { Leaf } from "./leaf.js";
+import { Root } from "./root.js";
+import { useFilterTree } from "./hooks/use-filter-tree.js";
+export const FilterTree = {
+    Root,
+    Panel: TreePanel,
+    PassiveScroll: ForceSyncScrolling,
+    Leaf: Leaf,
+    Branch: Branch,
+    Label: Label,
+    Checkbox: InclusionCheckbox,
+    useFilterTree,
+};

package/dist/filter-tree/hooks/use-filter-tree.d.ts

@@ -0,0 +1,38 @@
+import { type Dispatch, type JSX, type SetStateAction } from "react";
+import type { Column, FilterIn, FilterInFilterItem, Grid } from "../../+types";
+import type { PathRoot } from "@1771technologies/lytenyte-shared";
+import type { TreeVirtualItem } from "../../tree-view/virtualized/make-virtual-tree";
+export interface UseTreeFilterReturn<T> {
+    readonly rootProps: {
+        readonly fetchItems: () => void;
+        readonly loading: boolean;
+        readonly error: any;
+        readonly pivotMode: boolean;
+        readonly grid: Grid<T>;
+        readonly expansions: Record<string, boolean>;
+        readonly onExpansionChange: Dispatch<SetStateAction<Record<string, boolean>>>;
+        readonly treeRef: (el: HTMLElement | null) => void;
+        readonly getAllIds: () => Set<string>;
+        readonly getIdsBetweenNodes: (left: HTMLElement, right: HTMLElement) => string[];
+        readonly onFocusChange: (el: HTMLElement | null) => void;
+        readonly root: PathRoot<FilterInFilterItem>;
+        readonly columnId: string;
+        readonly items: FilterInFilterItem[];
+        readonly applyChangesImmediately: boolean;
+        readonly filterIn: FilterIn;
+        readonly filterInChange: Dispatch<SetStateAction<FilterIn>>;
+    };
+    readonly tree: TreeVirtualItem<FilterInFilterItem>[];
+    readonly spacer: JSX.Element;
+    readonly apply: () => void;
+    readonly reset: () => void;
+}
+export interface UseFilterTreeArgs<T> {
+    grid: Grid<T>;
+    column: Column<T>;
+    treeItemHeight?: number;
+    pivotMode?: boolean;
+    applyChangesImmediately?: boolean;
+    query?: string;
+}
+export declare function useFilterTree<T>({ grid, column, treeItemHeight, pivotMode, applyChangesImmediately, query, }: UseFilterTreeArgs<T>): UseTreeFilterReturn<T>;

package/dist/filter-tree/hooks/use-filter-tree.js

@@ -0,0 +1,101 @@
+import { useEffect, useMemo, useState } from "react";
+import { useVirtualizedTree } from "../../tree-view/virtualized/use-virtualized-tree.js";
+import { useEvent } from "@1771technologies/lytenyte-react-hooks";
+export function useFilterTree({ grid, column, treeItemHeight = 24, pivotMode, applyChangesImmediately = false, query, }) {
+    const [items, setItems] = useState([]);
+    const [expansions, onExpansionChange] = useState({});
+    const [loading, setLoading] = useState(false);
+    const [error, setError] = useState();
+    const rds = grid.state.rowDataSource.useValue();
+    const filterModel = grid.state.filterInModel.useValue();
+    const pivotModel = grid.state.columnPivotModel.useValue().filtersIn;
+    const currentPivotMode = grid.state.columnPivotMode.useValue();
+    const model = (pivotMode ?? currentPivotMode) ? pivotModel : filterModel;
+    const existingFilter = useMemo(() => {
+        const filter = model[column.id];
+        return filter ?? { kind: "in", operator: "not_in", value: new Set() };
+    }, [column.id, model]);
+    const [changes, setChanges] = useState(() => existingFilter);
+    // Keep in sync with any external changes.
+    useEffect(() => {
+        setChanges(existingFilter);
+    }, [existingFilter]);
+    const fetchItems = useEvent(() => {
+        const items = rds.inFilterItems(column);
+        if ("then" in items) {
+            setLoading(true);
+            items
+                .then((res) => {
+                setItems(res);
+                setError(null);
+            })
+                .catch((error) => setError(error))
+                .finally(() => setLoading(false));
+        }
+        else {
+            setItems(items);
+            setError(null);
+            setLoading(false);
+        }
+    });
+    useEffect(() => {
+        fetchItems();
+    }, [column, fetchItems, rds]);
+    const filteredItems = useMemo(() => {
+        if (!query)
+            return items;
+        return items.filter((c) => c.label.toLowerCase().includes(query.toLowerCase()));
+    }, [items, query]);
+    const itemsWithSelectAll = useMemo(() => {
+        return [{ id: "__LNG__SELECT_ALL", label: "(Select All)", value: "" }, ...filteredItems];
+    }, [filteredItems]);
+    const virt = useVirtualizedTree({
+        itemHeight: treeItemHeight,
+        paths: itemsWithSelectAll,
+        expansions,
+        expansionDefault: true,
+        nonAdjacentPathTrees: false,
+    });
+    const apply = useEvent(() => {
+        if (applyChangesImmediately)
+            return;
+        if (pivotMode) {
+            grid.state.columnPivotModel.set((prev) => {
+                return {
+                    ...prev,
+                    filtersIn: { ...prev.filtersIn, [column.id]: changes },
+                };
+            });
+        }
+        else {
+            grid.state.filterInModel.set((prev) => ({ ...prev, [column.id]: changes }));
+        }
+    });
+    const reset = useEvent(() => {
+        if (applyChangesImmediately)
+            return;
+        setChanges(existingFilter);
+    });
+    return {
+        rootProps: {
+            fetchItems,
+            items,
+            grid,
+            columnId: column.id,
+            expansions,
+            pivotMode: pivotMode ?? currentPivotMode,
+            onExpansionChange,
+            treeRef: virt.ref,
+            loading,
+            error,
+            filterIn: changes,
+            filterInChange: setChanges,
+            applyChangesImmediately,
+            ...virt.rootProps,
+        },
+        spacer: virt.spacer,
+        tree: virt.virtualTree,
+        apply,
+        reset,
+    };
+}

package/dist/filter-tree/hooks/use-tree-item.d.ts

@@ -0,0 +1,8 @@
+import type { FilterInFilterItem } from "../../+types.js";
+import type { TreeVirtualItem } from "../../tree-view/virtualized/make-virtual-tree.js";
+export declare function useTreeItem(item: TreeVirtualItem<FilterInFilterItem>): {
+    onCheckChange: (b?: boolean) => void;
+    isChecked: boolean;
+    isIndeterminate: boolean;
+    item: TreeVirtualItem<FilterInFilterItem>;
+};

package/dist/filter-tree/hooks/use-tree-item.js

@@ -0,0 +1,116 @@
+import { useCallback, useMemo } from "react";
+import { useGrid } from "../../grid-provider/use-grid.js";
+import { useTreeContext } from "../context.js";
+function isSelectAll(item) {
+    return item.kind === "leaf" && item.leaf.data.id === "__LNG__SELECT_ALL";
+}
+export function useTreeItem(item) {
+    const { filter, filterChange, pivotMode, columnId, items, applyChangesImmediately } = useTreeContext();
+    const grid = useGrid();
+    const itemValues = useMemo(() => {
+        if (item.kind === "leaf")
+            return [item.leaf.data.value];
+        const leafItems = [];
+        const stack = [...item.children.values()];
+        while (stack.length) {
+            const c = stack.pop();
+            if (c.kind === "leaf")
+                leafItems.push(c.leaf.data.value);
+            else
+                stack.push(...c.children.values());
+        }
+        return leafItems;
+    }, [item]);
+    const isChecked = useMemo(() => {
+        if (filter.operator === "in") {
+            if (isSelectAll(item)) {
+                return items.every((c) => filter.value.has(c.value));
+            }
+            return itemValues.every((c) => filter.value.has(c));
+        }
+        else {
+            if (isSelectAll(item)) {
+                return filter.value.size === 0;
+            }
+            return itemValues.every((c) => !filter.value.has(c));
+        }
+    }, [filter.operator, filter.value, item, itemValues, items]);
+    const isIndeterminate = useMemo(() => {
+        if (filter.operator === "in") {
+            if (isSelectAll(item)) {
+                return !isChecked && items.some((c) => filter.value.has(c));
+            }
+            return !isChecked && itemValues.some((c) => filter.value.has(c));
+        }
+        else {
+            if (isSelectAll(item)) {
+                return (!isChecked && filter.value.size > 0 && items.some((c) => !filter.value.has(c)));
+            }
+            return !isChecked && itemValues.some((c) => !filter.value.has(c));
+        }
+    }, [item, isChecked, itemValues, filter, items]);
+    const onCheckChange = useCallback((b) => {
+        const checked = b ?? !isChecked;
+        let nextValue;
+        const operator = filter.operator;
+        if (isSelectAll(item)) {
+            if (operator === "in") {
+                nextValue = checked ? new Set(items.map((c) => c.value)) : new Set();
+            }
+            else {
+                nextValue = checked ? new Set() : new Set(items.map((c) => c.value));
+            }
+        }
+        else {
+            nextValue = new Set(filter.value);
+            if (operator === "in") {
+                if (checked)
+                    itemValues.forEach((c) => nextValue.add(c));
+                else
+                    itemValues.forEach((c) => nextValue.delete(c));
+            }
+            else {
+                if (checked)
+                    itemValues.forEach((c) => nextValue.delete(c));
+                else
+                    itemValues.forEach((c) => nextValue.add(c));
+            }
+        }
+        if (!applyChangesImmediately) {
+            filterChange({ kind: "in", operator, value: nextValue });
+        }
+        else {
+            if (pivotMode) {
+                grid.state.columnPivotModel.set((prev) => {
+                    return {
+                        ...prev,
+                        filtersIn: {
+                            ...prev.filtersIn,
+                            [columnId]: { kind: "in", operator, value: nextValue },
+                        },
+                    };
+                });
+            }
+            else {
+                grid.state.filterInModel.set((prev) => ({
+                    ...prev,
+                    [columnId]: { kind: "in", operator, value: nextValue },
+                }));
+            }
+        }
+    }, [
+        isChecked,
+        item,
+        itemValues,
+        filter.operator,
+        filter.value,
+        applyChangesImmediately,
+        items,
+        filterChange,
+        pivotMode,
+        grid.state.columnPivotModel,
+        grid.state.filterInModel,
+        columnId,
+    ]);
+    return useMemo(() => ({ onCheckChange, isChecked, isIndeterminate, item }), [isChecked, isIndeterminate, item, onCheckChange]);
+}

package/dist/filter-tree/inclusion-checkbox.d.ts

@@ -0,0 +1,9 @@
+import { type SlotComponent } from "@1771technologies/lytenyte-react-hooks";
+export interface InclusionCheckbox {
+    readonly as?: SlotComponent<{
+        checked: boolean;
+        indeterminate: boolean;
+        toggle: (s?: boolean) => void;
+    }>;
+}
+export declare const InclusionCheckbox: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & InclusionCheckbox, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/filter-tree/inclusion-checkbox.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useSlot } from "@1771technologies/lytenyte-react-hooks";
+import { forwardRef } from "react";
+import { useTreeItemContext } from "./context.js";
+export const InclusionCheckbox = forwardRef(function InclusionCheckbox({ as, ...props }, forwarded) {
+    const { isChecked, onCheckChange, isIndeterminate } = useTreeItemContext();
+    const rendered = useSlot({
+        props: [props],
+        ref: forwarded,
+        state: { checked: isChecked, toggle: onCheckChange, indeterminate: isIndeterminate },
+        slot: as ?? (_jsx("input", { type: "checkbox", checked: isChecked, "aria-label": "visibility toggle", onChange: () => onCheckChange() })),
+    });
+    return rendered;
+});

package/dist/filter-tree/label.d.ts

@@ -0,0 +1,5 @@
+import { type SlotComponent } from "@1771technologies/lytenyte-react-hooks";
+export interface LabelProps {
+    readonly as?: SlotComponent;
+}
+export declare const Label: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & LabelProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/filter-tree/label.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useSlot } from "@1771technologies/lytenyte-react-hooks";
+import { forwardRef, useMemo } from "react";
+import { useTreeItemContext } from "./context.js";
+export const Label = forwardRef(function Label({ as, ...props }, forwarded) {
+    const { item } = useTreeItemContext();
+    const label = useMemo(() => {
+        if (item.kind == "branch")
+            return item.branch.id.split("#").at(-1);
+        return item.leaf.data.label ?? item.leaf.data.id;
+    }, [item]);
+    const rendered = useSlot({
+        props: [{ children: label }, props],
+        ref: forwarded,
+        slot: as ?? _jsx("div", {}),
+    });
+    return rendered;
+});

package/dist/filter-tree/leaf.d.ts

@@ -0,0 +1,6 @@
+import type { TreeVirtualLeaf } from "../tree-view/virtualized/make-virtual-tree";
+import type { FilterInFilterItem } from "../+types";
+export interface FilterTreeLeafProps {
+    readonly item: TreeVirtualLeaf<FilterInFilterItem>;
+}
+export declare const Leaf: import("react").ForwardRefExoticComponent<Omit<FilterTreeLeafProps & import("react").ClassAttributes<HTMLLIElement> & import("react").LiHTMLAttributes<HTMLLIElement>, "ref"> & import("react").RefAttributes<HTMLLIElement>>;

package/dist/filter-tree/leaf.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { TreeLeaf } from "../tree-view/leaf.js";
+import { FilterTreeItemContext } from "./context.js";
+import { useTreeItem } from "./hooks/use-tree-item.js";
+export const Leaf = forwardRef(function Leaf({ item, ...props }, forwarded) {
+    const value = useTreeItem(item);
+    return (_jsx(FilterTreeItemContext.Provider, { value: value, children: _jsx(TreeLeaf, { ...props, itemId: item.leaf.data.id, ref: forwarded, ...item.attrs, style: { ...props.style, ...item.attrs.style }, onClick: () => value.onCheckChange(), onKeyDown: (ev) => {
+                if (ev.key === " ") {
+                    ev.preventDefault();
+                    value.onCheckChange();
+                }
+            } }) }));
+});

package/dist/filter-tree/root.d.ts

@@ -0,0 +1,13 @@
+import { type PropsWithChildren } from "react";
+import type { Grid } from "../+types";
+import type { UseTreeFilterReturn } from "./hooks/use-filter-tree";
+import { type SlotComponent } from "@1771technologies/lytenyte-react-hooks";
+export type FilterTreeRootProps<T> = UseTreeFilterReturn<T>["rootProps"] & {
+    readonly grid: Grid<T>;
+    readonly loadingAs?: SlotComponent;
+    readonly errorAs?: SlotComponent<{
+        error: any;
+        refetch: () => void;
+    }>;
+};
+export declare function Root<T>({ grid, treeRef, filterIn, pivotMode, columnId, children, error, loading, errorAs, loadingAs, fetchItems, items, applyChangesImmediately, filterInChange, ...rootProps }: PropsWithChildren<FilterTreeRootProps<T>>): import("react/jsx-runtime").JSX.Element;

package/dist/filter-tree/root.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { GridProvider } from "../grid-provider/provider.js";
+import { TreeRoot } from "../tree-view/root.js";
+import { FilterTreeContext } from "./context.js";
+import { useSlot } from "@1771technologies/lytenyte-react-hooks";
+export function Root({ grid, treeRef, filterIn, pivotMode, columnId, children, error, loading, errorAs, loadingAs, fetchItems, items, applyChangesImmediately, filterInChange, ...rootProps }) {
+    const value = useMemo(() => {
+        return {
+            filter: filterIn,
+            filterChange: filterInChange,
+            pivotMode,
+            columnId,
+            items,
+            applyChangesImmediately,
+        };
+    }, [applyChangesImmediately, columnId, filterIn, filterInChange, items, pivotMode]);
+    const loadingSlot = useSlot({
+        slot: loadingAs ?? _jsx("div", { children: "Loading..." }),
+    });
+    const errorSlot = useSlot({
+        slot: errorAs ?? _jsx("div", { children: "Error Occurred Fetching" }),
+        state: { error, refetch: fetchItems },
+    });
+    if (loading)
+        return loadingSlot;
+    if (error)
+        return errorSlot;
+    return (_jsx(GridProvider, { value: grid, children: _jsx(FilterTreeContext.Provider, { value: value, children: _jsx(TreeRoot, { selectMode: "none", transitionEnter: 0, transitionExit: 0, expansionDefault: true, ref: treeRef, ...rootProps, children: children }) }) }));
+}

package/dist/grid-box/+types.d.ts

@@ -0,0 +1,15 @@
+import type { DropEventParams } from "../+types.js";
+export interface GridBoxItem<T = any> {
+    readonly id: string;
+    readonly label: string;
+    readonly data: T;
+    readonly dragData: Record<string, any>;
+    readonly draggable: boolean;
+    readonly dragPlaceholder?: (el: HTMLElement) => HTMLElement;
+    readonly onDrop: (p: DropEventParams) => void;
+    readonly onAction: (el: HTMLElement) => void;
+    readonly onDelete: (el: HTMLElement) => void;
+    readonly index: number;
+    readonly source: string;
+    readonly active?: boolean;
+}

package/dist/grid-box/+types.js

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

package/dist/grid-box/context.d.ts

@@ -0,0 +1,9 @@
+import type { DropEventParams } from "../+types.js";
+interface GridBoxContextValue {
+    readonly accepted: string[];
+    readonly orientation: "horizontal" | "vertical";
+    readonly onRootDrop: (p: DropEventParams) => void;
+}
+export declare const GridBoxContext: import("react").Context<GridBoxContextValue>;
+export declare const useGridBoxContext: () => GridBoxContextValue;
+export {};

package/dist/grid-box/context.js

@@ -0,0 +1,3 @@
+import { createContext, useContext } from "react";
+export const GridBoxContext = createContext({});
+export const useGridBoxContext = () => useContext(GridBoxContext);

package/dist/grid-box/grid-box.d.ts

@@ -0,0 +1,12 @@
+import { GridBoxRoot } from "./root.js";
+import { useAggregationBoxItems } from "./use-aggregation-box-items.js";
+import { useColumnBoxItems } from "./use-column-box-items.js";
+import { useRowGroupBoxItems } from "./use-row-group-box-items.js";
+export declare const GridBox: {
+    Root: typeof GridBoxRoot;
+    Panel: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "onDrop">, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Item: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & import("./item.js").GridBoxItemProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    useColumnBoxItems: typeof useColumnBoxItems;
+    useRowGroupBoxItems: typeof useRowGroupBoxItems;
+    useAggregationBoxItems: typeof useAggregationBoxItems;
+};

package/dist/grid-box/grid-box.js

@@ -0,0 +1,14 @@
+import { BoxItem } from "./item.js";
+import { GridBoxPanel } from "./panel.js";
+import { GridBoxRoot } from "./root.js";
+import { useAggregationBoxItems } from "./use-aggregation-box-items.js";
+import { useColumnBoxItems } from "./use-column-box-items.js";
+import { useRowGroupBoxItems } from "./use-row-group-box-items.js";
+export const GridBox = {
+    Root: GridBoxRoot,
+    Panel: GridBoxPanel,
+    Item: BoxItem,
+    useColumnBoxItems,
+    useRowGroupBoxItems,
+    useAggregationBoxItems,
+};