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

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

@@ -2,115 +2,108 @@ 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";
+  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());
+  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));
         }
-        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 {
+        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));
         }
-        else {
-            if (isSelectAll(item)) {
-                return filter.value.size === 0;
-            }
-            return itemValues.every((c) => !filter.value.has(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 },
+          }));
         }
-    }, [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]);
+      }
+    },
+    [
+      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

@@ -1,9 +1,17 @@
 import { type SlotComponent } from "@1771technologies/lytenyte-react-hooks";
 export interface InclusionCheckbox {
-    readonly as?: SlotComponent<{
-        checked: boolean;
-        indeterminate: boolean;
-        toggle: (s?: boolean) => void;
-    }>;
+  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>>;
+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

@@ -2,13 +2,23 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useSlot } from "@1771technologies/lytenyte-react-hooks";
 import { forwardRef } from "react";
 import { useTreeItemContext } from "./context";
-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;
+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

@@ -1,5 +1,13 @@
 import { type SlotComponent } from "@1771technologies/lytenyte-react-hooks";
 export interface LabelProps {
-    readonly as?: SlotComponent;
+  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>>;
+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

@@ -3,16 +3,15 @@ import { useSlot } from "@1771technologies/lytenyte-react-hooks";
 import { forwardRef, useMemo } from "react";
 import { useTreeItemContext } from "./context";
 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;
+  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

@@ -1,6 +1,14 @@
 import type { TreeVirtualLeaf } from "../tree-view/virtualized/make-virtual-tree";
 import type { FilterInFilterItem } from "../+types";
 export interface FilterTreeLeafProps {
-    readonly item: TreeVirtualLeaf<FilterInFilterItem>;
+  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>>;
+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

@@ -4,9 +4,19 @@ import { TreeLeaf } from "../tree-view/leaf";
 import { FilterTreeItemContext } from "./context";
 import { useTreeItem } from "./hooks/use-tree-item";
 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 === " ")
-                    value.onCheckChange();
-            } }) }));
+  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 === " ") value.onCheckChange();
+      },
+    }),
+  });
 });

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

@@ -3,11 +3,27 @@ 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;
-    }>;
+  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;
+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

@@ -4,27 +4,55 @@ import { GridProvider } from "../grid-provider/provider";
 import { TreeRoot } from "../tree-view/root";
 import { FilterTreeContext } from "./context";
 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 }) }) }));
+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

@@ -1,15 +1,15 @@
 import type { ReactNode } from "react";
 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?: () => ReactNode;
-    readonly onDrop: (p: DropEventParams) => void;
-    readonly onAction: (el: HTMLElement) => void;
-    readonly onDelete: (el: HTMLElement) => void;
-    readonly index: number;
-    readonly source: string;
+  readonly id: string;
+  readonly label: string;
+  readonly data: T;
+  readonly dragData: Record<string, any>;
+  readonly draggable: boolean;
+  readonly dragPlaceholder?: () => ReactNode;
+  readonly onDrop: (p: DropEventParams) => void;
+  readonly onAction: (el: HTMLElement) => void;
+  readonly onDelete: (el: HTMLElement) => void;
+  readonly index: number;
+  readonly source: string;
 }

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

@@ -1,8 +1,8 @@
 import type { DropEventParams } from "../+types.js";
 interface GridBoxContextValue {
-    readonly accepted: string[];
-    readonly orientation: "horizontal" | "vertical";
-    readonly onRootDrop: (p: DropEventParams) => void;
+  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;

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

@@ -3,10 +3,30 @@ import { useAggregationBoxItems } from "./use-aggregation-box-items";
 import { useColumnBoxItems } from "./use-column-box-items";
 import { useRowGroupBoxItems } from "./use-row-group-box-items";
 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").GridBoxItemProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    useColumnBoxItems: typeof useColumnBoxItems;
-    useRowGroupBoxItems: typeof useRowGroupBoxItems;
-    useAggregationBoxItems: typeof useAggregationBoxItems;
+  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").GridBoxItemProps,
+      "ref"
+    > &
+      import("react").RefAttributes<HTMLDivElement>
+  >;
+  useColumnBoxItems: typeof useColumnBoxItems;
+  useRowGroupBoxItems: typeof useRowGroupBoxItems;
+  useAggregationBoxItems: typeof useAggregationBoxItems;
 };

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

@@ -5,10 +5,10 @@ import { useAggregationBoxItems } from "./use-aggregation-box-items";
 import { useColumnBoxItems } from "./use-column-box-items";
 import { useRowGroupBoxItems } from "./use-row-group-box-items";
 export const GridBox = {
-    Root: GridBoxRoot,
-    Panel: GridBoxPanel,
-    Item: BoxItem,
-    useColumnBoxItems,
-    useRowGroupBoxItems,
-    useAggregationBoxItems,
+  Root: GridBoxRoot,
+  Panel: GridBoxPanel,
+  Item: BoxItem,
+  useColumnBoxItems,
+  useRowGroupBoxItems,
+  useAggregationBoxItems,
 };

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

@@ -2,9 +2,17 @@ import { type CSSProperties } from "react";
 import type { GridBoxItem } from "./+types";
 import { type SlotComponent } from "@1771technologies/lytenyte-react-hooks";
 export interface GridBoxItemProps {
-    readonly item: GridBoxItem;
-    readonly itemAs?: SlotComponent;
-    readonly itemClassName?: string;
-    readonly itemStyle?: CSSProperties;
+  readonly item: GridBoxItem;
+  readonly itemAs?: SlotComponent;
+  readonly itemClassName?: string;
+  readonly itemStyle?: CSSProperties;
 }
-export declare const BoxItem: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & GridBoxItemProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const BoxItem: import("react").ForwardRefExoticComponent<
+  Omit<
+    import("react").ClassAttributes<HTMLDivElement> &
+      import("react").HTMLAttributes<HTMLDivElement> &
+      GridBoxItemProps,
+    "ref"
+  > &
+    import("react").RefAttributes<HTMLDivElement>
+>;