@1771technologies/lytenyte-pro 1.0.0-beta.34 → 1.0.0-beta.36

package/dist/cells/cell-default.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 export function CellDefault({ grid, column, row }) {
-    const r = grid.api.columnField(column, row);
-    if (row.data == null && row.loading) {
-        return _jsx("div", { children: "Loading..." });
-    }
-    return _jsx("div", { children: `${r ?? ""}` });
+  const r = grid.api.columnField(column, row);
+  if (row.data == null && row.loading) {
+    return _jsx("div", { children: "Loading..." });
+  }
+  return _jsx("div", { children: `${r ?? ""}` });
 }

package/dist/cells/cell-editor.d.ts

@@ -1,6 +1,8 @@
 import type { RowCellLayout } from "../+types";
 interface CellEditorParams<T> {
-    readonly cell: RowCellLayout<T>;
+  readonly cell: RowCellLayout<T>;
 }
-export declare function CellEditor<T>({ cell }: CellEditorParams<T>): import("react/jsx-runtime").JSX.Element;
+export declare function CellEditor<T>({
+  cell,
+}: CellEditorParams<T>): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/cells/cell-editor.js

@@ -5,99 +5,136 @@ import { useGridRoot } from "../context";
 import { editOnChange } from "../state/helpers/edit-on-change";
 import { handleNavigationKeys } from "@1771technologies/lytenyte-shared";
 export function CellEditor({ cell }) {
-    const [el, setEl] = useState(null);
-    const grid = useGridRoot().grid;
-    useEffect(() => {
-        if (!el)
-            return;
-        const focusFirst = () => {
-            const tabbables = getTabbables(el);
-            if (!el.contains(document.activeElement))
-                tabbables.at(0)?.focus();
-        };
-        const controller = new AbortController();
-        if (el.parentElement) {
-            el.parentElement.addEventListener("focus", () => {
-                focusFirst();
-            }, { signal: controller.signal });
+  const [el, setEl] = useState(null);
+  const grid = useGridRoot().grid;
+  useEffect(() => {
+    if (!el) return;
+    const focusFirst = () => {
+      const tabbables = getTabbables(el);
+      if (!el.contains(document.activeElement)) tabbables.at(0)?.focus();
+    };
+    const controller = new AbortController();
+    if (el.parentElement) {
+      el.parentElement.addEventListener(
+        "focus",
+        () => {
+          focusFirst();
+        },
+        { signal: controller.signal },
+      );
+    }
+    focusFirst();
+    return () => controller.abort();
+  }, [el]);
+  return _jsx("div", {
+    ref: setEl,
+    style: { width: "100%", height: "100%" },
+    onKeyDown: (e) => {
+      if (e.key === "Escape") {
+        const parent = el?.parentElement;
+        grid.api.editEnd(true);
+        setTimeout(() => {
+          parent?.focus();
+        }, 4);
+      }
+      if (e.key === "Enter") {
+        const ds = grid.state.rowDataStore;
+        // Don't move if the there are validation errors.
+        const editValidation = grid.internal.editValidation.get();
+        if (
+          typeof editValidation === "boolean"
+            ? editValidation === false
+            : Object.keys(editValidation).length >= 1
+        ) {
+          return;
         }
-        focusFirst();
-        return () => controller.abort();
-    }, [el]);
-    return (_jsx("div", { ref: setEl, style: { width: "100%", height: "100%" }, onKeyDown: (e) => {
-            if (e.key === "Escape") {
-                const parent = el?.parentElement;
-                grid.api.editEnd(true);
-                setTimeout(() => {
-                    parent?.focus();
-                }, 4);
-            }
-            if (e.key === "Enter") {
-                const ds = grid.state.rowDataStore;
-                // Don't move if the there are validation errors.
-                const editValidation = grid.internal.editValidation.get();
-                if (typeof editValidation === "boolean"
-                    ? editValidation === false
-                    : Object.keys(editValidation).length >= 1) {
-                    return;
-                }
-                handleNavigationKeys({
-                    ctrlKey: false,
-                    metaKey: false,
-                    key: "ArrowDown",
-                    preventDefault: () => { },
-                    stopPropagation: () => { },
-                }, {
-                    vp: grid.state.viewport.get(),
-                    rowCount: ds.rowCount.get(),
-                    topCount: ds.rowTopCount.get(),
-                    centerCount: ds.rowCenterCount.get(),
-                    columnCount: grid.state.columnMeta.get().columnsVisible.length,
-                    focusActive: grid.internal.focusActive,
-                    id: grid.state.gridId.get(),
-                    layout: grid.internal.layout.get(),
-                    rtl: grid.state.rtl.get(),
-                    scrollIntoView: grid.api.scrollIntoView,
-                });
-            }
-            e.stopPropagation();
-        }, children: _jsx(EditRenderer, { cell: cell }) }));
+        handleNavigationKeys(
+          {
+            ctrlKey: false,
+            metaKey: false,
+            key: "ArrowDown",
+            preventDefault: () => {},
+            stopPropagation: () => {},
+          },
+          {
+            vp: grid.state.viewport.get(),
+            rowCount: ds.rowCount.get(),
+            topCount: ds.rowTopCount.get(),
+            centerCount: ds.rowCenterCount.get(),
+            columnCount: grid.state.columnMeta.get().columnsVisible.length,
+            focusActive: grid.internal.focusActive,
+            id: grid.state.gridId.get(),
+            layout: grid.internal.layout.get(),
+            rtl: grid.state.rtl.get(),
+            scrollIntoView: grid.api.scrollIntoView,
+          },
+        );
+      }
+      e.stopPropagation();
+    },
+    children: _jsx(EditRenderer, { cell: cell }),
+  });
 }
 function EditRenderer({ cell }) {
-    const column = cell.column;
-    const ctx = useGridRoot();
-    const base = ctx.grid.state.columnBase.useValue();
-    const editFuncs = ctx.grid.state.editRenderers.useValue();
-    const editRenderer = column.editRenderer ?? base.editRenderer;
-    const activeData = ctx.grid.internal.editData.useValue();
-    const row = cell.row.get();
-    const value = ctx.grid.api.columnField(column, row.kind === "branch"
-        ? { kind: "branch", data: activeData, key: row.key }
-        : { kind: "leaf", data: activeData });
-    const onChange = useCallback((c) => {
-        editOnChange({
-            value: c,
-            activeData,
-            base,
-            column,
-            grid: ctx.grid,
-            row,
-            rowIndex: cell.rowIndex,
-        });
-    }, [activeData, base, cell.rowIndex, column, ctx.grid, row]);
-    if (!editRenderer) {
-        const type = column.type;
-        if (type === "number")
-            return (_jsx("input", { type: "number", value: value ?? "", onChange: (e) => (e.target.value ? onChange(Number.parseFloat(e.target.value)) : 0) }));
-        if (type === "date")
-            return _jsx("input", { type: "date", value: value ?? "", onChange: (e) => onChange(e.target.value) });
-        if (type === "datetime")
-            return (_jsx("input", { type: "datetime-local", value: value ?? "", onChange: (e) => onChange(e.target.value) }));
-        return _jsx("input", { value: value ?? "", onChange: (e) => onChange(e.target.value) });
-    }
-    const Renderer = typeof editRenderer === "string" ? editFuncs[editRenderer] : editRenderer;
-    const validation = ctx.grid.internal.editValidation.useValue();
-    if (!Renderer)
-        return null;
-    return (_jsx(Renderer, { column: column, grid: ctx.grid, onChange: onChange, row: cell.row.get(), rowIndex: cell.rowIndex, value: value, rowValidationState: validation }));
+  const column = cell.column;
+  const ctx = useGridRoot();
+  const base = ctx.grid.state.columnBase.useValue();
+  const editFuncs = ctx.grid.state.editRenderers.useValue();
+  const editRenderer = column.editRenderer ?? base.editRenderer;
+  const activeData = ctx.grid.internal.editData.useValue();
+  const row = cell.row.get();
+  const value = ctx.grid.api.columnField(
+    column,
+    row.kind === "branch"
+      ? { kind: "branch", data: activeData, key: row.key }
+      : { kind: "leaf", data: activeData },
+  );
+  const onChange = useCallback(
+    (c) => {
+      editOnChange({
+        value: c,
+        activeData,
+        base,
+        column,
+        grid: ctx.grid,
+        row,
+        rowIndex: cell.rowIndex,
+      });
+    },
+    [activeData, base, cell.rowIndex, column, ctx.grid, row],
+  );
+  if (!editRenderer) {
+    const type = column.type;
+    if (type === "number")
+      return _jsx("input", {
+        type: "number",
+        value: value ?? "",
+        onChange: (e) => (e.target.value ? onChange(Number.parseFloat(e.target.value)) : 0),
+      });
+    if (type === "date")
+      return _jsx("input", {
+        type: "date",
+        value: value ?? "",
+        onChange: (e) => onChange(e.target.value),
+      });
+    if (type === "datetime")
+      return _jsx("input", {
+        type: "datetime-local",
+        value: value ?? "",
+        onChange: (e) => onChange(e.target.value),
+      });
+    return _jsx("input", { value: value ?? "", onChange: (e) => onChange(e.target.value) });
+  }
+  const Renderer = typeof editRenderer === "string" ? editFuncs[editRenderer] : editRenderer;
+  const validation = ctx.grid.internal.editValidation.useValue();
+  if (!Renderer) return null;
+  return _jsx(Renderer, {
+    column: column,
+    grid: ctx.grid,
+    onChange: onChange,
+    row: cell.row.get(),
+    rowIndex: cell.rowIndex,
+    value: value,
+    rowValidationState: validation,
+  });
 }

package/dist/cells/cell.d.ts

@@ -1,7 +1,20 @@
 import { type ReactNode } from "react";
 import type { CellRendererFn, RowCellLayout } from "../+types";
 export interface CellProps {
-    readonly cell: RowCellLayout<any>;
-    readonly children?: ReactNode | CellRendererFn<any>;
+  readonly cell: RowCellLayout<any>;
+  readonly children?: ReactNode | CellRendererFn<any>;
 }
-export declare const Cell: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "children"> & CellProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const Cell: import("react").ForwardRefExoticComponent<
+  Omit<
+    Omit<
+      import("react").DetailedHTMLProps<
+        import("react").HTMLAttributes<HTMLDivElement>,
+        HTMLDivElement
+      >,
+      "children"
+    > &
+      CellProps,
+    "ref"
+  > &
+    import("react").RefAttributes<HTMLDivElement>
+>;

package/dist/cells/cell.js

@@ -7,32 +7,61 @@ import { CellDefault } from "./cell-default";
 import { CellEditor } from "./cell-editor";
 import { useRowMeta } from "../rows/row/context";
 const CellImpl = forwardRef(function Cell({ cell, children, ...props }, forwarded) {
-    const grid = useGridRoot().grid;
-    const cx = grid.state;
-    grid.internal.refreshKey.useValue();
-    const base = grid.state.columnBase.useValue();
-    const row = cell.row.useValue();
-    const renderers = cx.cellRenderers.useValue();
-    const providedRenderer = children ?? cell.column.cellRenderer ?? base.cellRenderer;
-    const Renderer = providedRenderer
-        ? typeof providedRenderer === "string"
-            ? (renderers[providedRenderer] ?? CellDefault)
-            : providedRenderer
-        : CellDefault;
-    const [isEditing, setIsEditing] = useState(false);
-    useEffect(() => {
-        return grid.internal.editActivePos.watch(() => {
-            const pos = grid.internal.editActivePos.get();
-            if (!pos)
-                return setIsEditing(false);
-            setIsEditing(pos.column === cell.column &&
-                pos.rowIndex >= cell.rowIndex &&
-                pos.rowIndex < cell.rowIndex + cell.rowSpan);
-        });
-    }, [cell.column, cell.rowIndex, cell.rowSpan, grid.internal.editActivePos]);
-    const rowMeta = useRowMeta();
-    if (!row)
-        return null;
-    return (_jsxs(CellReact, { ...props, ref: forwarded, cell: cell, isEditing: isEditing, viewportWidth: cx.viewportWidthInner.useValue(), detailHeight: grid.api.rowDetailRenderedHeight(row ?? ""), rtl: cx.rtl.useValue(), xPosition: cx.xPositions.useValue(), yPosition: cx.yPositions.useValue(), children: [isEditing && _jsx(CellEditor, { cell: cell }), !isEditing && (_jsx(_Fragment, { children: typeof Renderer === "function" ? (_jsx(Renderer, { column: cell.column, rowSelected: rowMeta.selected, rowIndeterminate: rowMeta.indeterminate, row: row, grid: grid, rowIndex: cell.rowIndex, colIndex: cell.colIndex, rowPin: cell.rowPin })) : (Renderer) }))] }));
+  const grid = useGridRoot().grid;
+  const cx = grid.state;
+  grid.internal.refreshKey.useValue();
+  const base = grid.state.columnBase.useValue();
+  const row = cell.row.useValue();
+  const renderers = cx.cellRenderers.useValue();
+  const providedRenderer = children ?? cell.column.cellRenderer ?? base.cellRenderer;
+  const Renderer = providedRenderer
+    ? typeof providedRenderer === "string"
+      ? (renderers[providedRenderer] ?? CellDefault)
+      : providedRenderer
+    : CellDefault;
+  const [isEditing, setIsEditing] = useState(false);
+  useEffect(() => {
+    return grid.internal.editActivePos.watch(() => {
+      const pos = grid.internal.editActivePos.get();
+      if (!pos) return setIsEditing(false);
+      setIsEditing(
+        pos.column === cell.column &&
+          pos.rowIndex >= cell.rowIndex &&
+          pos.rowIndex < cell.rowIndex + cell.rowSpan,
+      );
+    });
+  }, [cell.column, cell.rowIndex, cell.rowSpan, grid.internal.editActivePos]);
+  const rowMeta = useRowMeta();
+  if (!row) return null;
+  return _jsxs(CellReact, {
+    ...props,
+    ref: forwarded,
+    cell: cell,
+    isEditing: isEditing,
+    viewportWidth: cx.viewportWidthInner.useValue(),
+    detailHeight: grid.api.rowDetailRenderedHeight(row ?? ""),
+    rtl: cx.rtl.useValue(),
+    xPosition: cx.xPositions.useValue(),
+    yPosition: cx.yPositions.useValue(),
+    children: [
+      isEditing && _jsx(CellEditor, { cell: cell }),
+      !isEditing &&
+        _jsx(_Fragment, {
+          children:
+            typeof Renderer === "function"
+              ? _jsx(Renderer, {
+                  column: cell.column,
+                  rowSelected: rowMeta.selected,
+                  rowIndeterminate: rowMeta.indeterminate,
+                  row: row,
+                  grid: grid,
+                  rowIndex: cell.rowIndex,
+                  colIndex: cell.colIndex,
+                  rowPin: cell.rowPin,
+                })
+              : Renderer,
+        }),
+    ],
+  });
 });
 export const Cell = fastDeepMemo(CellImpl);

package/dist/column-manager/branch-lookup-context.d.ts

@@ -1,4 +1,6 @@
 import type { Column } from "../+types";
 import type { PathBranch } from "@1771technologies/lytenyte-shared";
-export declare const branchLookupContext: import("react").Context<Record<string, PathBranch<Column<any>>>>;
+export declare const branchLookupContext: import("react").Context<
+  Record<string, PathBranch<Column<any>>>
+>;
 export declare const useBranchLookup: () => Record<string, PathBranch<Column<any>>>;

package/dist/column-manager/branch.d.ts

@@ -3,13 +3,21 @@ import type { Column } from "../+types";
 import type { SlotComponent } from "@1771technologies/lytenyte-react-hooks";
 import type { PathBranch } from "@1771technologies/lytenyte-shared";
 export interface ColumnManagerBranchProps {
-    readonly item: PathBranch<Column<any>>;
-    readonly label: SlotComponent;
-    readonly expander?: SlotComponent<{
-        expanded: boolean;
-        toggle: () => void;
-    }>;
-    readonly labelWrapClassName?: string;
-    readonly labelWrapStyle?: CSSProperties;
+  readonly item: PathBranch<Column<any>>;
+  readonly label: SlotComponent;
+  readonly expander?: SlotComponent<{
+    expanded: boolean;
+    toggle: () => void;
+  }>;
+  readonly labelWrapClassName?: string;
+  readonly labelWrapStyle?: CSSProperties;
 }
-export declare const Branch: import("react").ForwardRefExoticComponent<Omit<ColumnManagerBranchProps & import("react").ClassAttributes<HTMLLIElement> & import("react").LiHTMLAttributes<HTMLLIElement>, "ref"> & import("react").RefAttributes<HTMLLIElement>>;
+export declare const Branch: import("react").ForwardRefExoticComponent<
+  Omit<
+    ColumnManagerBranchProps &
+      import("react").ClassAttributes<HTMLLIElement> &
+      import("react").LiHTMLAttributes<HTMLLIElement>,
+    "ref"
+  > &
+    import("react").RefAttributes<HTMLLIElement>
+>;

package/dist/column-manager/branch.js

@@ -5,50 +5,68 @@ import { ColumnItemContext } from "./context";
 import { dragState, DropWrap } from "@1771technologies/lytenyte-dragon";
 import { useGrid } from "../grid-provider/use-grid";
 import { useColumnsFromContext } from "./use-columns-from-context";
-export const Branch = forwardRef(function Branch({ item, label, labelWrapClassName, labelWrapStyle, ...props }, forwarded) {
-    const grid = useGrid();
-    const id = grid.state.gridId.useValue();
-    const accepted = `${id}/columns`;
-    const base = grid.state.columnBase.useValue();
-    const columns = useColumnsFromContext(item);
-    const isVisible = useMemo(() => {
-        const allVisible = columns.every((c) => !(c.hide ?? base.hide));
-        return allVisible;
-    }, [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]);
-    return (_jsx(ColumnItemContext, { value: useMemo(() => ({ item }), [item]), children: _jsx(TreeBranch, { ...props, itemId: item.data.idOccurrence, ref: forwarded, onKeyDown: (ev) => {
-                props.onKeyDown?.(ev);
-                if (ev.key === " ") {
-                    toggle();
-                    ev.preventDefault();
-                }
-            }, labelWrap: _jsx(DropWrap, { "data-ln-column-manager-branch": true, "data-ln-column-id": item.data.idOccurrence, accepted: [accepted], className: labelWrapClassName, style: labelWrapStyle, onEnter: (el) => {
-                    const data = dragState.data
-                        .get()
-                        ?.siteLocalData?.[accepted]?.at(-1);
-                    if (!data)
-                        return;
-                    const move = data.id;
-                    if (columns.some((c) => c.id === move))
-                        return;
-                    const allColumns = grid.state.columns.get();
-                    const moveIndex = allColumns.findIndex((c) => c.id === move);
-                    if (moveIndex === -1)
-                        return;
-                    const thisIndex = allColumns.findIndex((c) => c.id === columns[0].id);
-                    const isBefore = thisIndex > moveIndex;
-                    // Flipped since our source is the one moving
-                    if (!isBefore) {
-                        el.setAttribute("data-ln-is-before", "true");
-                    }
-                    else {
-                        el.setAttribute("data-ln-is-after", "true");
-                    }
-                }, onLeave: (el) => {
-                    el.removeAttribute("data-ln-is-before");
-                    el.removeAttribute("data-ln-is-after");
-                } }), label: label }) }));
+export const Branch = forwardRef(function Branch(
+  { item, label, labelWrapClassName, labelWrapStyle, ...props },
+  forwarded,
+) {
+  const grid = useGrid();
+  const id = grid.state.gridId.useValue();
+  const accepted = `${id}/columns`;
+  const base = grid.state.columnBase.useValue();
+  const columns = useColumnsFromContext(item);
+  const isVisible = useMemo(() => {
+    const allVisible = columns.every((c) => !(c.hide ?? base.hide));
+    return allVisible;
+  }, [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],
+  );
+  return _jsx(ColumnItemContext, {
+    value: useMemo(() => ({ item }), [item]),
+    children: _jsx(TreeBranch, {
+      ...props,
+      itemId: item.data.idOccurrence,
+      ref: forwarded,
+      onKeyDown: (ev) => {
+        props.onKeyDown?.(ev);
+        if (ev.key === " ") {
+          toggle();
+          ev.preventDefault();
+        }
+      },
+      labelWrap: _jsx(DropWrap, {
+        "data-ln-column-manager-branch": true,
+        "data-ln-column-id": item.data.idOccurrence,
+        accepted: [accepted],
+        className: labelWrapClassName,
+        style: labelWrapStyle,
+        onEnter: (el) => {
+          const data = dragState.data.get()?.siteLocalData?.[accepted]?.at(-1);
+          if (!data) return;
+          const move = data.id;
+          if (columns.some((c) => c.id === move)) return;
+          const allColumns = grid.state.columns.get();
+          const moveIndex = allColumns.findIndex((c) => c.id === move);
+          if (moveIndex === -1) return;
+          const thisIndex = allColumns.findIndex((c) => c.id === columns[0].id);
+          const isBefore = thisIndex > moveIndex;
+          // Flipped since our source is the one moving
+          if (!isBefore) {
+            el.setAttribute("data-ln-is-before", "true");
+          } else {
+            el.setAttribute("data-ln-is-after", "true");
+          }
+        },
+        onLeave: (el) => {
+          el.removeAttribute("data-ln-is-before");
+          el.removeAttribute("data-ln-is-after");
+        },
+      }),
+      label: label,
+    }),
+  });
 });

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

@@ -2,12 +2,61 @@ import { Root } from "./root";
 import { useColumnManager } from "./use-column-manager";
 import { VisibilityCheckbox } from "./visibility-checkbox";
 export declare const ColumnManager: {
-    Root: typeof Root;
-    Leaf: import("react").ForwardRefExoticComponent<Omit<import("./leaf").ColumnManagerLeafProps & 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").LabelProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    Branch: import("react").ForwardRefExoticComponent<Omit<import("./branch").ColumnManagerBranchProps & import("react").ClassAttributes<HTMLLIElement> & import("react").LiHTMLAttributes<HTMLLIElement>, "ref"> & import("react").RefAttributes<HTMLLIElement>>;
-    Panel: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & import("react").RefAttributes<HTMLUListElement>>;
-    MoveHandle: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & import("./move-handle").MoveHandleProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    VisibilityCheckbox: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & VisibilityCheckbox, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    useColumnManager: typeof useColumnManager;
+  Root: typeof Root;
+  Leaf: import("react").ForwardRefExoticComponent<
+    Omit<
+      import("./leaf").ColumnManagerLeafProps &
+        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").LabelProps,
+      "ref"
+    > &
+      import("react").RefAttributes<HTMLDivElement>
+  >;
+  Branch: import("react").ForwardRefExoticComponent<
+    Omit<
+      import("./branch").ColumnManagerBranchProps &
+        import("react").ClassAttributes<HTMLLIElement> &
+        import("react").LiHTMLAttributes<HTMLLIElement>,
+      "ref"
+    > &
+      import("react").RefAttributes<HTMLLIElement>
+  >;
+  Panel: import("react").ForwardRefExoticComponent<
+    Omit<
+      import("react").DetailedHTMLProps<
+        import("react").HTMLAttributes<HTMLUListElement>,
+        HTMLUListElement
+      >,
+      "ref"
+    > &
+      import("react").RefAttributes<HTMLUListElement>
+  >;
+  MoveHandle: import("react").ForwardRefExoticComponent<
+    Omit<
+      import("react").ClassAttributes<HTMLDivElement> &
+        import("react").HTMLAttributes<HTMLDivElement> &
+        import("./move-handle").MoveHandleProps,
+      "ref"
+    > &
+      import("react").RefAttributes<HTMLDivElement>
+  >;
+  VisibilityCheckbox: import("react").ForwardRefExoticComponent<
+    Omit<
+      import("react").ClassAttributes<HTMLDivElement> &
+        import("react").HTMLAttributes<HTMLDivElement> &
+        VisibilityCheckbox,
+      "ref"
+    > &
+      import("react").RefAttributes<HTMLDivElement>
+  >;
+  useColumnManager: typeof useColumnManager;
 };

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

@@ -7,12 +7,12 @@ import { Root } from "./root";
 import { useColumnManager } from "./use-column-manager";
 import { VisibilityCheckbox } from "./visibility-checkbox";
 export const ColumnManager = {
-    Root,
-    Leaf,
-    Label,
-    Branch,
-    Panel,
-    MoveHandle,
-    VisibilityCheckbox,
-    useColumnManager: useColumnManager,
+  Root,
+  Leaf,
+  Label,
+  Branch,
+  Panel,
+  MoveHandle,
+  VisibilityCheckbox,
+  useColumnManager: useColumnManager,
 };

package/dist/column-manager/context.d.ts

@@ -1,7 +1,7 @@
 import type { Column } from "../+types";
 import type { PathBranch, PathLeaf } from "@1771technologies/lytenyte-shared";
 export interface TreeItemContextValue {
-    readonly item: PathBranch<Column<any>> | PathLeaf<Column<any>>;
+  readonly item: PathBranch<Column<any>> | PathLeaf<Column<any>>;
 }
 export declare const ColumnItemContext: import("react").Context<TreeItemContextValue>;
 export declare const useColumnItemContext: () => TreeItemContextValue;