@1771technologies/lytenyte-pro 1.0.0-beta.12 → 1.0.0-beta.14

package/dist/tree-view/root.js

@@ -5,57 +5,59 @@ import { useCombinedRefs, useEvent } from "@1771technologies/lytenyte-react-hook
 import { getAllIds } from "./navigation/get-all-ids.js";
 import { getIdsBetweenNodes } from "./utils/get-ids-between-nodes.js";
 export const TreeRoot = forwardRef((p, forwarded) => {
-  const [panel, setPanel] = useState(null);
-  const [expansions, onExpansionChange] = useState({});
-  const [selection, setSelections] = useState(() => new Set());
-  const ref = useCombinedRefs(setPanel, forwarded);
-  const selectionPivotRef = useRef(null);
-  const allIds = useEvent((el) => {
-    if (p.getAllIds) return p.getAllIds(el);
-    return getAllIds(el);
-  });
-  const idsBetween = useEvent((left, right, panel) => {
-    if (p.getIdsBetweenNodes) return p.getIdsBetweenNodes(left, right, panel);
-    return getIdsBetweenNodes(left, right, panel);
-  });
-  const onFocusChange = useEvent((el) => {
-    p.onFocusChange?.(el);
-  });
-  const value = useMemo(() => {
-    return {
-      panel,
-      panelRef: ref,
-      selectionMode: p.selectMode ?? "single",
-      transitionEnterMs: p.transitionEnter ?? 0,
-      transitionExitMs: p.transitionExit ?? 0,
-      gridWrappedBranches: p.gridWrappedBranches ?? false,
-      expansions: p.expansions ?? expansions,
-      onExpansionChange: p.onExpansionChange ?? onExpansionChange,
-      selection: p.selection ?? selection,
-      onSelectionChange: p.onSelectionChange ?? setSelections,
-      selectionPivotRef,
-      expansionDefault: p.expansionDefault ?? false,
-      onFocusChange,
-      getAllIds: allIds,
-      getIdsBetweenNodes: idsBetween,
-    };
-  }, [
-    allIds,
-    expansions,
-    idsBetween,
-    onFocusChange,
-    p.expansionDefault,
-    p.expansions,
-    p.gridWrappedBranches,
-    p.onExpansionChange,
-    p.onSelectionChange,
-    p.selectMode,
-    p.selection,
-    p.transitionEnter,
-    p.transitionExit,
-    panel,
-    ref,
-    selection,
-  ]);
-  return _jsx(context.Provider, { value: value, children: p.children });
+    const [panel, setPanel] = useState(null);
+    const [expansions, onExpansionChange] = useState({});
+    const [selection, setSelections] = useState(() => new Set());
+    const ref = useCombinedRefs(setPanel, forwarded);
+    const selectionPivotRef = useRef(null);
+    const allIds = useEvent((el) => {
+        if (p.getAllIds)
+            return p.getAllIds(el);
+        return getAllIds(el);
+    });
+    const idsBetween = useEvent((left, right, panel) => {
+        if (p.getIdsBetweenNodes)
+            return p.getIdsBetweenNodes(left, right, panel);
+        return getIdsBetweenNodes(left, right, panel);
+    });
+    const onFocusChange = useEvent((el) => {
+        p.onFocusChange?.(el);
+    });
+    const value = useMemo(() => {
+        return {
+            panel,
+            panelRef: ref,
+            selectionMode: p.selectMode ?? "single",
+            transitionEnterMs: p.transitionEnter ?? 0,
+            transitionExitMs: p.transitionExit ?? 0,
+            gridWrappedBranches: p.gridWrappedBranches ?? false,
+            expansions: p.expansions ?? expansions,
+            onExpansionChange: p.onExpansionChange ?? onExpansionChange,
+            selection: p.selection ?? selection,
+            onSelectionChange: p.onSelectionChange ?? setSelections,
+            selectionPivotRef,
+            expansionDefault: p.expansionDefault ?? false,
+            onFocusChange,
+            getAllIds: allIds,
+            getIdsBetweenNodes: idsBetween,
+        };
+    }, [
+        allIds,
+        expansions,
+        idsBetween,
+        onFocusChange,
+        p.expansionDefault,
+        p.expansions,
+        p.gridWrappedBranches,
+        p.onExpansionChange,
+        p.onSelectionChange,
+        p.selectMode,
+        p.selection,
+        p.transitionEnter,
+        p.transitionExit,
+        panel,
+        ref,
+        selection,
+    ]);
+    return _jsx(context.Provider, { value: value, children: p.children });
 });

package/dist/tree-view/utils/get-focusable-nodes.js

@@ -1,7 +1,5 @@
 import { getFocusables, isHTMLElement } from "@1771technologies/lytenyte-dom-utils";
 export function getFocusableNodes(panel) {
-  const focusNodes = getFocusables(panel).filter(
-    (c) => isHTMLElement(c) && c.getAttribute("data-ln-tree-node") === "true",
-  );
-  return focusNodes;
+    const focusNodes = getFocusables(panel).filter((c) => isHTMLElement(c) && c.getAttribute("data-ln-tree-node") === "true");
+    return focusNodes;
 }

package/dist/tree-view/utils/get-focused-node.js

@@ -1,14 +1,14 @@
 import { isLastTraversableNode } from "@1771technologies/lytenyte-dom-utils";
 export function getFocusedNode() {
-  if (!document.activeElement) return null;
-  let current = document.activeElement;
-  while (
-    current &&
-    !isLastTraversableNode(current) &&
-    current.getAttribute("data-ln-tree-node") !== "true"
-  ) {
-    current = current.parentElement;
-  }
-  if (current?.getAttribute("data-ln-tree-node")) return current;
-  return null;
+    if (!document.activeElement)
+        return null;
+    let current = document.activeElement;
+    while (current &&
+        !isLastTraversableNode(current) &&
+        current.getAttribute("data-ln-tree-node") !== "true") {
+        current = current.parentElement;
+    }
+    if (current?.getAttribute("data-ln-tree-node"))
+        return current;
+    return null;
 }

package/dist/tree-view/utils/get-ids-between-nodes.d.ts

@@ -1,5 +1 @@
-export declare function getIdsBetweenNodes(
-  start: HTMLElement,
-  end: HTMLElement,
-  panel: HTMLElement,
-): string[];
+export declare function getIdsBetweenNodes(start: HTMLElement, end: HTMLElement, panel: HTMLElement): string[];

package/dist/tree-view/utils/get-ids-between-nodes.js

@@ -1,14 +1,15 @@
 import { getFocusableNodes } from "./get-focusable-nodes.js";
 import { getTreeNodeId } from "./get-tree-node-id.js";
 export function getIdsBetweenNodes(start, end, panel) {
-  const focusables = getFocusableNodes(panel);
-  let startIndex = focusables.indexOf(start);
-  let endIndex = focusables.indexOf(end);
-  if (startIndex == -1 || endIndex == -1) return [];
-  [startIndex, endIndex] = [Math.min(startIndex, endIndex), Math.max(startIndex, endIndex)];
-  const ids = [];
-  for (let i = startIndex; i <= endIndex; i++) {
-    ids.push(getTreeNodeId(focusables[i]));
-  }
-  return ids;
+    const focusables = getFocusableNodes(panel);
+    let startIndex = focusables.indexOf(start);
+    let endIndex = focusables.indexOf(end);
+    if (startIndex == -1 || endIndex == -1)
+        return [];
+    [startIndex, endIndex] = [Math.min(startIndex, endIndex), Math.max(startIndex, endIndex)];
+    const ids = [];
+    for (let i = startIndex; i <= endIndex; i++) {
+        ids.push(getTreeNodeId(focusables[i]));
+    }
+    return ids;
 }

package/dist/tree-view/utils/get-panel.js

@@ -1,7 +1,7 @@
 export function getPanel(el) {
-  let current = el;
-  while (current && !current.getAttribute("data-ln-tree-panel")) {
-    current = current.parentElement;
-  }
-  return current;
+    let current = el;
+    while (current && !current.getAttribute("data-ln-tree-panel")) {
+        current = current.parentElement;
+    }
+    return current;
 }

package/dist/tree-view/utils/get-parent-node.js

@@ -1,9 +1,10 @@
 import { isBranchNode } from "./is-branch-node.js";
 export function getParentNode(el) {
-  let current = el.parentElement;
-  while (current && !current.getAttribute("data-ln-tree-panel") && !isBranchNode(current)) {
-    current = current.parentElement;
-  }
-  if (current?.getAttribute("data-ln-tree-panel")) return null;
-  return current;
+    let current = el.parentElement;
+    while (current && !current.getAttribute("data-ln-tree-panel") && !isBranchNode(current)) {
+        current = current.parentElement;
+    }
+    if (current?.getAttribute("data-ln-tree-panel"))
+        return null;
+    return current;
 }

package/dist/tree-view/utils/get-sibling-branches.js

@@ -1,12 +1,14 @@
 import { isHTMLElement } from "@1771technologies/lytenyte-dom-utils";
 import { isBranchNode } from "./is-branch-node.js";
 export function getSiblingBranches(el) {
-  const children = el.parentElement?.children;
-  if (!children) return;
-  const branchSiblings = [];
-  for (let i = 0; i < children.length; i++) {
-    const node = children[i];
-    if (isHTMLElement(node) && isBranchNode(node)) branchSiblings.push(node);
-  }
-  return branchSiblings;
+    const children = el.parentElement?.children;
+    if (!children)
+        return;
+    const branchSiblings = [];
+    for (let i = 0; i < children.length; i++) {
+        const node = children[i];
+        if (isHTMLElement(node) && isBranchNode(node))
+            branchSiblings.push(node);
+    }
+    return branchSiblings;
 }

package/dist/tree-view/utils/get-tree-node-id.js

@@ -1,3 +1,3 @@
 export function getTreeNodeId(el) {
-  return el.getAttribute("data-ln-tree-id") ?? "";
+    return el.getAttribute("data-ln-tree-id") ?? "";
 }

package/dist/tree-view/utils/is-branch-node.js

@@ -1,3 +1,3 @@
 export function isBranchNode(el) {
-  return el.getAttribute("data-ln-tree-branch") === "true";
+    return el.getAttribute("data-ln-tree-branch") === "true";
 }

package/dist/tree-view/utils/is-leaf-node.js

@@ -1,3 +1,3 @@
 export function isLeafNode(el) {
-  return el.getAttribute("data-ln-tree-leaf") === "true";
+    return el.getAttribute("data-ln-tree-leaf") === "true";
 }

package/dist/tree-view/utils/is-tree-node-disabled.js

@@ -1,3 +1,3 @@
 export function isTreeNodeDisabled(el) {
-  return el.getAttribute("data-ln-tree-node-disabled") === "true";
+    return el.getAttribute("data-ln-tree-node-disabled") === "true";
 }

package/dist/tree-view/utils/select-node.d.ts

@@ -1,6 +1,2 @@
 import type { TreeViewRootContext } from "../context.js";
-export declare function selectNode(
-  node: HTMLElement | null | undefined,
-  ctx: TreeViewRootContext,
-  focus?: boolean,
-): void;
+export declare function selectNode(node: HTMLElement | null | undefined, ctx: TreeViewRootContext, focus?: boolean): void;

package/dist/tree-view/utils/select-node.js

@@ -1,12 +1,15 @@
 import { getTreeNodeId } from "./get-tree-node-id.js";
 import { isTreeNodeDisabled } from "./is-tree-node-disabled.js";
 export function selectNode(node, ctx, focus) {
-  if (!node || isTreeNodeDisabled(node)) return;
-  if (focus) node.focus();
-  const id = getTreeNodeId(node);
-  if (ctx.selection.has(id)) return;
-  ctx.selectionPivotRef.current = id;
-  const next = new Set(ctx.selection);
-  next.add(id);
-  ctx.onSelectionChange(next);
+    if (!node || isTreeNodeDisabled(node))
+        return;
+    if (focus)
+        node.focus();
+    const id = getTreeNodeId(node);
+    if (ctx.selection.has(id))
+        return;
+    ctx.selectionPivotRef.current = id;
+    const next = new Set(ctx.selection);
+    next.add(id);
+    ctx.onSelectionChange(next);
 }

package/dist/tree-view/utils/toggle-all-selections.js

@@ -1,7 +1,9 @@
 import { getAllIds } from "../navigation/get-all-ids.js";
 export function toggleAllSelections(ctx) {
-  const allIds = getAllIds(ctx.panel);
-  const selection = ctx.selection;
-  if (allIds.isSubsetOf(selection)) ctx.onSelectionChange(new Set());
-  else ctx.onSelectionChange(allIds);
+    const allIds = getAllIds(ctx.panel);
+    const selection = ctx.selection;
+    if (allIds.isSubsetOf(selection))
+        ctx.onSelectionChange(new Set());
+    else
+        ctx.onSelectionChange(allIds);
 }

package/dist/tree-view/utils/toggle-selection.js

@@ -1,18 +1,21 @@
 import { getTreeNodeId } from "./get-tree-node-id.js";
 export function toggleSelection(el, ctx) {
-  const id = getTreeNodeId(el);
-  if (ctx.selectionMode === "single") {
-    if (ctx.selection.has(id)) ctx.onSelectionChange(new Set());
-    else ctx.onSelectionChange(new Set([id]));
-    return;
-  }
-  const next = new Set(ctx.selection);
-  if (next.has(id)) {
-    next.delete(id);
-    ctx.selectionPivotRef.current = null;
-  } else {
-    next.add(id);
-    ctx.selectionPivotRef.current = id;
-  }
-  ctx.onSelectionChange(next);
+    const id = getTreeNodeId(el);
+    if (ctx.selectionMode === "single") {
+        if (ctx.selection.has(id))
+            ctx.onSelectionChange(new Set());
+        else
+            ctx.onSelectionChange(new Set([id]));
+        return;
+    }
+    const next = new Set(ctx.selection);
+    if (next.has(id)) {
+        next.delete(id);
+        ctx.selectionPivotRef.current = null;
+    }
+    else {
+        next.add(id);
+        ctx.selectionPivotRef.current = id;
+    }
+    ctx.onSelectionChange(next);
 }

package/dist/tree-view/virtualized/force-sync-scrolling.d.ts

@@ -1,4 +1,2 @@
 import { type PropsWithChildren } from "react";
-export declare function ForceSyncScrolling(
-  props: PropsWithChildren,
-): import("react/jsx-runtime").JSX.Element;
+export declare function ForceSyncScrolling(props: PropsWithChildren): import("react/jsx-runtime").JSX.Element;

package/dist/tree-view/virtualized/force-sync-scrolling.js

@@ -2,28 +2,22 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
 import { useTreeRoot } from "../context.js";
 export function ForceSyncScrolling(props) {
-  const [scroll, setScroll] = useState(0);
-  const ctx = useTreeRoot();
-  useEffect(() => {
-    if (!ctx.panel) return;
-    const controller = new AbortController();
-    ctx.panel.addEventListener(
-      "scroll",
-      () => {
-        setScroll(Math.max(0, ctx.panel.scrollTop));
-      },
-      { signal: controller.signal },
-    );
-    return () => controller.abort();
-  }, [ctx.panel]);
-  return _jsx("div", {
-    style: {
-      position: "sticky",
-      top: 0,
-      height: 0,
-      width: "100%",
-      transform: `translate3d(0px, -${scroll}px, 0px)`,
-    },
-    children: props.children,
-  });
+    const [scroll, setScroll] = useState(0);
+    const ctx = useTreeRoot();
+    useEffect(() => {
+        if (!ctx.panel)
+            return;
+        const controller = new AbortController();
+        ctx.panel.addEventListener("scroll", () => {
+            setScroll(Math.max(0, ctx.panel.scrollTop));
+        }, { signal: controller.signal });
+        return () => controller.abort();
+    }, [ctx.panel]);
+    return (_jsx("div", { style: {
+            position: "sticky",
+            top: 0,
+            height: 0,
+            width: "100%",
+            transform: `translate3d(0px, -${scroll}px, 0px)`,
+        }, children: props.children }));
 }

package/dist/tree-view/virtualized/get-virtual-tree-paths.d.ts

@@ -1,4 +1,2 @@
 import type { PathBranch, PathLeaf, PathProvidedItem } from "@1771technologies/lytenyte-shared";
-export declare function buildVirtualTreePartial<T extends PathProvidedItem>(
-  items: (PathBranch<T> | PathLeaf<T>)[],
-): [string[], PathBranch<T> | PathLeaf<T>][];
+export declare function buildVirtualTreePartial<T extends PathProvidedItem>(items: (PathBranch<T> | PathLeaf<T>)[]): [string[], PathBranch<T> | PathLeaf<T>][];

package/dist/tree-view/virtualized/get-virtual-tree-paths.js

@@ -1,13 +1,14 @@
 export function buildVirtualTreePartial(items) {
-  const paths = items.map((c) => {
-    if (c.kind === "leaf") {
-      const parent = c.parent;
-      if (parent.kind === "root") return ["", c];
-      const path = parent.id.split("#");
-      return [path, c];
-    }
-    const path = c.id.split("#");
-    return [path, c];
-  });
-  return paths;
+    const paths = items.map((c) => {
+        if (c.kind === "leaf") {
+            const parent = c.parent;
+            if (parent.kind === "root")
+                return ["", c];
+            const path = parent.id.split("#");
+            return [path, c];
+        }
+        const path = c.id.split("#");
+        return [path, c];
+    });
+    return paths;
 }

package/dist/tree-view/virtualized/make-virtual-tree.d.ts

@@ -1,36 +1,31 @@
 import type { PathBranch, PathLeaf, PathProvidedItem } from "@1771technologies/lytenyte-shared";
 import type { CSSProperties } from "react";
 export interface TreeVirtualBranch<T extends PathProvidedItem> {
-  readonly kind: "branch";
-  readonly path: string;
-  readonly branch: PathBranch<T>;
-  readonly children: TreeVirtualItem<T>[];
-  readonly rowIndex: number;
-  readonly attrs: {
-    readonly style: CSSProperties;
-    "data-ln-row-index": number;
-    readonly "aria-posinset": number;
-    readonly "aria-setsize": number;
-  };
+    readonly kind: "branch";
+    readonly path: string;
+    readonly branch: PathBranch<T>;
+    readonly children: TreeVirtualItem<T>[];
+    readonly rowIndex: number;
+    readonly attrs: {
+        readonly style: CSSProperties;
+        "data-ln-row-index": number;
+        readonly "aria-posinset": number;
+        readonly "aria-setsize": number;
+    };
 }
 export interface TreeVirtualLeaf<T extends PathProvidedItem> {
-  readonly kind: "leaf";
-  readonly leaf: PathLeaf<T>;
-  readonly rowIndex: number;
-  readonly attrs: {
-    readonly style: CSSProperties;
-    "data-ln-row-index": number;
-    readonly "aria-posinset": number;
-    readonly "aria-setsize": number;
-  };
+    readonly kind: "leaf";
+    readonly leaf: PathLeaf<T>;
+    readonly rowIndex: number;
+    readonly attrs: {
+        readonly style: CSSProperties;
+        "data-ln-row-index": number;
+        readonly "aria-posinset": number;
+        readonly "aria-setsize": number;
+    };
 }
 export type TreeVirtualItem<T extends PathProvidedItem> = TreeVirtualBranch<T> | TreeVirtualLeaf<T>;
 type Path = string[];
 type PathEntry<T extends PathProvidedItem> = [Path | "", PathBranch<T> | PathLeaf<T>];
-export declare function makeVirtualTree<T extends PathProvidedItem>(
-  paths: PathEntry<T>[],
-  nodeToIndex: Map<PathBranch<T> | PathLeaf<T>, number>,
-  itemHeight: number,
-  nonAdjacentPathTrees: boolean,
-): TreeVirtualItem<T>[];
+export declare function makeVirtualTree<T extends PathProvidedItem>(paths: PathEntry<T>[], nodeToIndex: Map<PathBranch<T> | PathLeaf<T>, number>, itemHeight: number, nonAdjacentPathTrees: boolean): TreeVirtualItem<T>[];
 export {};