@proyecto-viviana/solid-stately 0.2.7 → 0.4.0

package/src/tree/TreeCollection.d.ts

@@ -5,36 +5,39 @@
  * A flattened view of tree nodes that respects expanded state.
  * Only visible nodes (root + expanded children) are included in iteration.
  */
-import type { Key } from '../collections/types';
-import type { TreeCollection as ITreeCollection, TreeNode, TreeItemData } from './types';
+import type { Key } from "../collections/types";
+import type { TreeCollection as ITreeCollection, TreeNode, TreeItemData } from "./types";
 /**
  * Creates a TreeCollection from hierarchical data.
  * The collection is flattened based on expanded keys.
  */
 export declare class TreeCollection<T> implements ITreeCollection<T> {
-    private keyMap;
-    private visibleKeys;
-    private _rows;
-    constructor(items: TreeItemData<T>[], expandedKeys: Set<Key>);
-    private buildCollection;
-    get size(): number;
-    get rows(): TreeNode<T>[];
-    get rowCount(): number;
-    getKeys(): Iterable<Key>;
-    getItem(key: Key): TreeNode<T> | null;
-    at(index: number): TreeNode<T> | null;
-    getKeyBefore(key: Key): Key | null;
-    getKeyAfter(key: Key): Key | null;
-    getFirstKey(): Key | null;
-    getLastKey(): Key | null;
-    getChildren(key: Key): Iterable<TreeNode<T>>;
-    getTextValue(key: Key): string;
-    getParentKey(key: Key): Key | null;
-    [Symbol.iterator](): Iterator<TreeNode<T>>;
+  private keyMap;
+  private visibleKeys;
+  private _rows;
+  constructor(items: TreeItemData<T>[], expandedKeys: Set<Key>);
+  private buildCollection;
+  get size(): number;
+  get rows(): TreeNode<T>[];
+  get rowCount(): number;
+  getKeys(): Iterable<Key>;
+  getItem(key: Key): TreeNode<T> | null;
+  at(index: number): TreeNode<T> | null;
+  getKeyBefore(key: Key): Key | null;
+  getKeyAfter(key: Key): Key | null;
+  getFirstKey(): Key | null;
+  getLastKey(): Key | null;
+  getChildren(key: Key): Iterable<TreeNode<T>>;
+  getTextValue(key: Key): string;
+  getParentKey(key: Key): Key | null;
+  [Symbol.iterator](): Iterator<TreeNode<T>>;
 }
 /**
  * Factory function to create a TreeCollection.
  * Useful for the collectionFactory pattern in TreeStateOptions.
  */
-export declare function createTreeCollection<T>(items: TreeItemData<T>[], expandedKeys: Set<Key>): TreeCollection<T>;
-//# sourceMappingURL=TreeCollection.d.ts.map
+export declare function createTreeCollection<T>(
+  items: TreeItemData<T>[],
+  expandedKeys: Set<Key>,
+): TreeCollection<T>;
+//# sourceMappingURL=TreeCollection.d.ts.map

package/src/tree/TreeCollection.ts

@@ -6,8 +6,16 @@
  * Only visible nodes (root + expanded children) are included in iteration.
  */
 
-import type { Key } from '../collections/types';
-import type { TreeCollection as ITreeCollection, TreeNode, TreeItemData } from './types';
+import type { Key } from "../collections/types";
+import type { TreeCollection as ITreeCollection, TreeNode, TreeItemData } from "./types";
+
+function getItemKey<T>(item: TreeItemData<T>): Key {
+  const key = item.key ?? item.id;
+  if (key == null) {
+    throw new Error("Tree items must define either a key or id.");
+  }
+  return key;
+}
 
 /**
  * Creates a TreeCollection from hierarchical data.
@@ -19,10 +27,7 @@ export class TreeCollection<T> implements ITreeCollection<T> {
   private firstKey: Key | null = null;
   private lastKey: Key | null = null;
 
-  constructor(
-    items: TreeItemData<T>[],
-    expandedKeys: Set<Key>
-  ) {
+  constructor(items: TreeItemData<T>[], expandedKeys: Set<Key>) {
     this.buildCollection(items, expandedKeys);
   }
 
@@ -34,25 +39,27 @@ export class TreeCollection<T> implements ITreeCollection<T> {
       item: TreeItemData<T>,
       level: number,
       parentKey: Key | null,
-      indexInParent: number
+      indexInParent: number,
     ): TreeNode<T> => {
-      const hasChildren = item.children && item.children.length > 0;
-      const isExpanded = hasChildren && expandedKeys.has(item.key);
+      const key = getItemKey(item);
+      const hasLoadedChildren = Boolean(item.children && item.children.length > 0);
+      const hasChildren = hasLoadedChildren || !!item.hasChildItems;
+      const isExpanded = hasChildren && expandedKeys.has(key);
 
       // Build child nodes first (even if not visible, for the map)
       const childNodes: TreeNode<T>[] = [];
-      if (hasChildren && item.children) {
+      if (hasLoadedChildren && item.children) {
         for (let i = 0; i < item.children.length; i++) {
-          const childNode = visit(item.children[i], level + 1, item.key, i);
+          const childNode = visit(item.children[i], level + 1, key, i);
           childNodes.push(childNode);
         }
       }
 
       const node: TreeNode<T> = {
-        type: 'item',
-        key: item.key,
-        value: item.value,
-        textValue: item.textValue || String(item.key),
+        type: "item",
+        key,
+        value: (item.value ?? item) as T,
+        textValue: item.textValue || String(key),
         level,
         index: indexInParent,
         parentKey,
@@ -64,7 +71,7 @@ export class TreeCollection<T> implements ITreeCollection<T> {
       };
 
       // Always add to keyMap (for getItem lookups)
-      this.keyMap.set(item.key, node);
+      this.keyMap.set(key, node);
 
       return node;
     };
@@ -136,7 +143,7 @@ export class TreeCollection<T> implements ITreeCollection<T> {
     while (previousKey != null) {
       const candidate = this.keyMap.get(previousKey);
       if (!candidate) break;
-      if (candidate.type !== 'content') {
+      if (candidate.type !== "content") {
         return candidate.key;
       }
       previousKey = candidate.prevKey ?? null;
@@ -150,7 +157,7 @@ export class TreeCollection<T> implements ITreeCollection<T> {
     while (nextKey != null) {
       const candidate = this.keyMap.get(nextKey);
       if (!candidate) break;
-      if (candidate.type !== 'content') {
+      if (candidate.type !== "content") {
         return candidate.key;
       }
       nextKey = candidate.nextKey ?? null;
@@ -161,7 +168,7 @@ export class TreeCollection<T> implements ITreeCollection<T> {
   getFirstKey(): Key | null {
     if (this.firstKey == null) return null;
     const candidate = this.keyMap.get(this.firstKey);
-    if (candidate?.type === 'content') {
+    if (candidate?.type === "content") {
       return this.getKeyAfter(candidate.key);
     }
     return this.firstKey;
@@ -170,7 +177,7 @@ export class TreeCollection<T> implements ITreeCollection<T> {
   getLastKey(): Key | null {
     if (this.lastKey == null) return null;
     const candidate = this.keyMap.get(this.lastKey);
-    if (candidate?.type === 'content') {
+    if (candidate?.type === "content") {
       return this.getKeyBefore(candidate.key);
     }
     return this.lastKey;
@@ -183,7 +190,7 @@ export class TreeCollection<T> implements ITreeCollection<T> {
 
   getTextValue(key: Key): string {
     const node = this.keyMap.get(key);
-    return node?.textValue ?? '';
+    return node?.textValue ?? "";
   }
 
   getParentKey(key: Key): Key | null {
@@ -202,7 +209,7 @@ export class TreeCollection<T> implements ITreeCollection<T> {
  */
 export function createTreeCollection<T>(
   items: TreeItemData<T>[],
-  expandedKeys: Set<Key>
+  expandedKeys: Set<Key>,
 ): TreeCollection<T> {
   return new TreeCollection(items, expandedKeys);
 }

package/src/tree/createTreeState.d.ts

@@ -4,11 +4,14 @@
  *
  * Manages expansion state, selection, and focus for hierarchical tree data.
  */
-import { type Accessor } from 'solid-js';
-import type { TreeState, TreeStateOptions, TreeCollection } from './types';
+import { type Accessor } from "solid-js";
+import type { TreeState, TreeStateOptions, TreeCollection } from "./types";
 /**
  * Creates state management for a tree component.
  * Handles expansion, selection, focus management, and keyboard navigation state.
  */
-export declare function createTreeState<T extends object, C extends TreeCollection<T> = TreeCollection<T>>(options: Accessor<TreeStateOptions<T, C>>): TreeState<T, C>;
-//# sourceMappingURL=createTreeState.d.ts.map
+export declare function createTreeState<
+  T extends object,
+  C extends TreeCollection<T> = TreeCollection<T>,
+>(options: Accessor<TreeStateOptions<T, C>>): TreeState<T, C>;
+//# sourceMappingURL=createTreeState.d.ts.map

package/src/tree/createTreeState.ts

@@ -5,21 +5,16 @@
  * Manages expansion state, selection, and focus for hierarchical tree data.
  */
 
-import { createSignal, createEffect, createMemo, on, type Accessor } from 'solid-js';
-import type {
-  TreeState,
-  TreeStateOptions,
-  TreeCollection,
-  TreeNode,
-} from './types';
-import type { Key, FocusStrategy } from '../collections/types';
+import { createSignal, createEffect, createMemo, on, type Accessor } from "solid-js";
+import type { TreeState, TreeStateOptions, TreeCollection } from "./types";
+import type { Key, FocusStrategy, Selection, SelectionBehavior } from "../collections/types";
 
 /**
  * Creates state management for a tree component.
  * Handles expansion, selection, focus management, and keyboard navigation state.
  */
 export function createTreeState<T extends object, C extends TreeCollection<T> = TreeCollection<T>>(
-  options: Accessor<TreeStateOptions<T, C>>
+  options: Accessor<TreeStateOptions<T, C>>,
 ): TreeState<T, C> {
   const getOptions = () => options();
 
@@ -31,7 +26,7 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
 
   // Expansion state (uncontrolled)
   const [internalExpandedKeys, setInternalExpandedKeys] = createSignal<Set<Key>>(
-    getInitialExpandedKeys(getOptions().defaultExpandedKeys)
+    getInitialExpandedKeys(getOptions().defaultExpandedKeys),
   );
 
   // Computed expanded keys (controlled or uncontrolled)
@@ -56,8 +51,8 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
   const [isKeyboardNavigationDisabled, setKeyboardNavigationDisabled] = createSignal(false);
 
   // Selection state
-  const [internalSelectedKeys, setInternalSelectedKeys] = createSignal<'all' | Set<Key>>(
-    getInitialSelection(getOptions().defaultSelectedKeys)
+  const [internalSelectedKeys, setInternalSelectedKeys] = createSignal<"all" | Set<Key>>(
+    getInitialSelection(getOptions().defaultSelectedKeys),
   );
   const [anchorKey, setAnchorKey] = createSignal<Key | null>(null);
 
@@ -70,13 +65,30 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
     return internalSelectedKeys();
   });
 
-  const selectionMode = createMemo(() => getOptions().selectionMode ?? 'none');
-  const selectionBehavior = createMemo(() => getOptions().selectionBehavior ?? 'toggle');
+  const selectionMode = createMemo(() => getOptions().selectionMode ?? "none");
+  const selectionBehaviorProp = (): SelectionBehavior => getOptions().selectionBehavior ?? "toggle";
+  const [selectionBehaviorState, setSelectionBehaviorState] =
+    createSignal<SelectionBehavior>(selectionBehaviorProp());
+  const selectionBehavior = createMemo(() => selectionBehaviorState());
   const disallowEmptySelection = createMemo(() => getOptions().disallowEmptySelection ?? false);
-  const disabledBehavior = createMemo(() => getOptions().disabledBehavior ?? 'all');
+  const disabledBehavior = createMemo(() => getOptions().disabledBehavior ?? "all");
+
+  createEffect(on(selectionBehaviorProp, (behavior) => setSelectionBehaviorState(behavior)));
+
+  createEffect(() => {
+    const keys = selectedKeys();
+    if (
+      selectionBehaviorProp() === "replace" &&
+      selectionBehaviorState() === "toggle" &&
+      keys !== "all" &&
+      keys.size === 0
+    ) {
+      setSelectionBehaviorState("replace");
+    }
+  });
 
   // Set focused key
-  const setFocusedKey = (key: Key | null, strategy: FocusStrategy = 'first') => {
+  const setFocusedKey = (key: Key | null, strategy: FocusStrategy = "first") => {
     setFocusedKeyInternal(key);
     setChildFocusStrategy(strategy);
   };
@@ -132,25 +144,25 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
       }
 
       cachedCollection = coll;
-    })
+    }),
   );
 
   // Selection methods
   const isSelected = (key: Key): boolean => {
     const keys = selectedKeys();
-    if (keys === 'all') return true;
+    if (keys === "all") return true;
     return keys.has(key);
   };
 
   const isDisabled = (key: Key): boolean => {
-    return disabledKeys().has(key);
+    return disabledKeys().has(key) || collection().getItem(key)?.isDisabled === true;
   };
 
   const isExpanded = (key: Key): boolean => {
     return expandedKeys().has(key);
   };
 
-  const updateSelection = (newSelection: 'all' | Set<Key>) => {
+  const updateSelection = (newSelection: "all" | Set<Key>) => {
     const opts = getOptions();
 
     // Controlled mode
@@ -162,8 +174,8 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
     // Uncontrolled mode
     const current = internalSelectedKeys();
     const isDifferent =
-      current === 'all' ||
-      newSelection === 'all' ||
+      current === "all" ||
+      newSelection === "all" ||
       current.size !== (newSelection as Set<Key>).size ||
       ![...current].every((k) => (newSelection as Set<Key>).has(k));
 
@@ -174,12 +186,14 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
   };
 
   const toggleSelection = (key: Key) => {
-    if (isDisabled(key) && disabledBehavior() === 'all') return;
-    if (selectionMode() === 'none') return;
+    // Disabled keys are never selectable, regardless of disabledBehavior
+    // (mirrors SelectionManager.canSelectItem, which ignores disabledBehavior).
+    if (isDisabled(key)) return;
+    if (selectionMode() === "none") return;
 
     const current = selectedKeys();
 
-    if (selectionMode() === 'single') {
+    if (selectionMode() === "single") {
       if (isSelected(key) && !disallowEmptySelection()) {
         updateSelection(new Set());
       } else {
@@ -189,7 +203,7 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
     }
 
     // Multiple selection
-    if (current === 'all') {
+    if (current === "all") {
       // Can't toggle when all selected without knowing all keys
       return;
     }
@@ -208,16 +222,20 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
   };
 
   const replaceSelection = (key: Key) => {
-    if (isDisabled(key) && disabledBehavior() === 'all') return;
-    if (selectionMode() === 'none') return;
+    if (isDisabled(key)) return;
+    if (selectionMode() === "none") return;
 
     updateSelection(new Set([key]));
     setAnchorKey(key);
   };
 
+  const setSelectedKeys = (keys: Selection | Iterable<Key>) => {
+    updateSelection(normalizeSelection(keys));
+  };
+
   const extendSelection = (toKey: Key) => {
-    if (isDisabled(toKey) && disabledBehavior() === 'all') return;
-    if (selectionMode() !== 'multiple') {
+    if (isDisabled(toKey)) return;
+    if (selectionMode() !== "multiple") {
       replaceSelection(toKey);
       return;
     }
@@ -229,7 +247,7 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
     }
 
     const coll = collection();
-    const rows = coll.rows.filter((r) => r.type === 'item');
+    const rows = coll.rows.filter((r) => r.type === "item");
     const keys = rows.map((r) => r.key);
     const anchorIndex = keys.indexOf(anchor);
     const toIndex = keys.indexOf(toKey);
@@ -247,8 +265,8 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
   };
 
   const selectAll = () => {
-    if (selectionMode() !== 'multiple') return;
-    updateSelection('all');
+    if (selectionMode() !== "multiple") return;
+    updateSelection("all");
   };
 
   const clearSelection = () => {
@@ -257,9 +275,9 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
   };
 
   const toggleSelectAll = () => {
-    if (selectionMode() !== 'multiple') return;
+    if (selectionMode() !== "multiple") return;
 
-    if (selectedKeys() === 'all') {
+    if (selectedKeys() === "all") {
       clearSelection();
     } else {
       selectAll();
@@ -284,7 +302,7 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
   const toggleKey = (key: Key) => {
     const node = collection().getItem(key);
     if (!node || !node.isExpandable) return;
-    if (isDisabled(key) && disabledBehavior() === 'all') return;
+    if (isDisabled(key) && disabledBehavior() === "all") return;
 
     const current = expandedKeys();
     const newKeys = new Set(current);
@@ -301,7 +319,7 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
   const expandKey = (key: Key) => {
     const node = collection().getItem(key);
     if (!node || !node.isExpandable) return;
-    if (isDisabled(key) && disabledBehavior() === 'all') return;
+    if (isDisabled(key) && disabledBehavior() === "all") return;
 
     const current = expandedKeys();
     if (current.has(key)) return;
@@ -314,7 +332,7 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
   const collapseKey = (key: Key) => {
     const node = collection().getItem(key);
     if (!node || !node.isExpandable) return;
-    if (isDisabled(key) && disabledBehavior() === 'all') return;
+    if (isDisabled(key) && disabledBehavior() === "all") return;
 
     const current = expandedKeys();
     if (!current.has(key)) return;
@@ -335,6 +353,9 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
     get disabledKeys() {
       return disabledKeys();
     },
+    get disabledBehavior() {
+      return disabledBehavior();
+    },
     get expandedKeys() {
       return expandedKeys();
     },
@@ -353,6 +374,12 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
     get selectionMode() {
       return selectionMode();
     },
+    get selectionBehavior() {
+      return selectionBehavior();
+    },
+    get disallowEmptySelection() {
+      return disallowEmptySelection();
+    },
     get selectedKeys() {
       return selectedKeys();
     },
@@ -363,6 +390,8 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
     setFocused: setIsFocused,
     toggleSelection,
     replaceSelection,
+    setSelectedKeys,
+    setSelectionBehavior: setSelectionBehaviorState,
     extendSelection,
     selectAll,
     clearSelection,
@@ -376,13 +405,13 @@ export function createTreeState<T extends object, C extends TreeCollection<T> =
 }
 
 // Helper functions
-function getInitialSelection(defaultKeys?: 'all' | Iterable<Key>): 'all' | Set<Key> {
+function getInitialSelection(defaultKeys?: "all" | Iterable<Key>): "all" | Set<Key> {
   if (defaultKeys === undefined) return new Set();
   return normalizeSelection(defaultKeys);
 }
 
-function normalizeSelection(keys: 'all' | Iterable<Key>): 'all' | Set<Key> {
-  if (keys === 'all') return 'all';
+function normalizeSelection(keys: "all" | Iterable<Key>): "all" | Set<Key> {
+  if (keys === "all") return "all";
   return new Set(keys);
 }
 

package/src/tree/index.d.ts

@@ -1,7 +1,13 @@
 /**
  * Tree state management exports.
  */
-export { createTreeState } from './createTreeState';
-export { TreeCollection, createTreeCollection } from './TreeCollection';
-export type { TreeState, TreeStateOptions, TreeCollection as TreeCollectionInterface, TreeNode, TreeItemData, } from './types';
-//# sourceMappingURL=index.d.ts.map
+export { createTreeState } from "./createTreeState";
+export { TreeCollection, createTreeCollection } from "./TreeCollection";
+export type {
+  TreeState,
+  TreeStateOptions,
+  TreeCollection as TreeCollectionInterface,
+  TreeNode,
+  TreeItemData,
+} from "./types";
+//# sourceMappingURL=index.d.ts.map

package/src/tree/index.ts

@@ -2,12 +2,12 @@
  * Tree state management exports.
  */
 
-export { createTreeState } from './createTreeState';
-export { TreeCollection, createTreeCollection } from './TreeCollection';
+export { createTreeState } from "./createTreeState";
+export { TreeCollection, createTreeCollection } from "./TreeCollection";
 export type {
   TreeState,
   TreeStateOptions,
   TreeCollection as TreeCollectionInterface,
   TreeNode,
   TreeItemData,
-} from './types';
+} from "./types";