@simplysm/solid 13.0.75 → 13.0.76

package/tests/components/data/sheet/hooks/useDataSheetSelection.spec.ts

@@ -0,0 +1,345 @@
+import { describe, it, expect } from "vitest";
+import { createRoot } from "solid-js";
+import { useDataSheetSelection } from "../../../../../src/components/data/sheet/hooks/useDataSheetSelection";
+import type { FlatItem } from "../../../../../src/components/data/sheet/types";
+
+interface TestItem {
+  id: string;
+  name: string;
+  selectable?: boolean;
+  disabledReason?: string;
+}
+
+const testItems: TestItem[] = [
+  { id: "a", name: "Item A" },
+  { id: "b", name: "Item B" },
+  { id: "c", name: "Item C", selectable: false, disabledReason: "Locked" },
+  { id: "d", name: "Item D" },
+];
+
+function createTestFlatItems(items: TestItem[]): FlatItem<TestItem>[] {
+  return items.map((item, index) => ({
+    item,
+    index,
+    row: index,
+    depth: 0,
+    hasChildren: false,
+  }));
+}
+
+describe("useDataSheetSelection", () => {
+  it("should initialize with empty selected items by default", () => {
+    createRoot(() => {
+      const result = useDataSheetSelection({}, () => createTestFlatItems(testItems));
+
+      expect(result.selection()).toEqual([]);
+    });
+  });
+
+  it("should initialize with provided selected items", () => {
+    createRoot(() => {
+      const selection = [testItems[0]];
+      const result = useDataSheetSelection(
+        { selection },
+        () => createTestFlatItems(testItems),
+      );
+
+      expect(result.selection()).toEqual(selection);
+    });
+  });
+
+  it("getItemSelectable should return true for selectable items", () => {
+    createRoot(() => {
+      const result = useDataSheetSelection({}, () => createTestFlatItems(testItems));
+
+      expect(result.getItemSelectable(testItems[0])).toBe(true);
+    });
+  });
+
+  it("getItemSelectable should return false when item is not selectable", () => {
+    createRoot(() => {
+      const itemSelectable = (item: TestItem) => item.selectable !== false;
+      const result = useDataSheetSelection(
+        { itemSelectable },
+        () => createTestFlatItems(testItems),
+      );
+
+      expect(result.getItemSelectable(testItems[2])).toBe(false);
+    });
+  });
+
+  it("getItemSelectable should return reason string when item is disabled", () => {
+    createRoot(() => {
+      const itemSelectable = (item: TestItem) => item.disabledReason != null && item.disabledReason !== "" ? item.disabledReason : true;
+      const result = useDataSheetSelection(
+        { itemSelectable },
+        () => createTestFlatItems(testItems),
+      );
+
+      expect(result.getItemSelectable(testItems[2])).toBe("Locked");
+    });
+  });
+
+  it("toggleSelect should add item in multiple mode", () => {
+    createRoot(() => {
+      const result = useDataSheetSelection(
+        { selectionMode: "multiple" },
+        () => createTestFlatItems(testItems),
+      );
+
+      result.toggleSelect(testItems[0]);
+
+      expect(result.selection()).toContain(testItems[0]);
+    });
+  });
+
+  it("toggleSelect should remove item in multiple mode", () => {
+    createRoot(() => {
+      const result = useDataSheetSelection(
+        { selectionMode: "multiple", selection: [testItems[0]] },
+        () => createTestFlatItems(testItems),
+      );
+
+      result.toggleSelect(testItems[0]);
+
+      expect(result.selection()).not.toContain(testItems[0]);
+    });
+  });
+
+  it("toggleSelect should replace selection in single mode", () => {
+    createRoot(() => {
+      const result = useDataSheetSelection(
+        { selectionMode: "single", selection: [testItems[0]] },
+        () => createTestFlatItems(testItems),
+      );
+
+      result.toggleSelect(testItems[1]);
+
+      expect(result.selection()).toEqual([testItems[1]]);
+    });
+  });
+
+  it("toggleSelect should deselect in single mode when toggling selected item", () => {
+    createRoot(() => {
+      const result = useDataSheetSelection(
+        { selectionMode: "single", selection: [testItems[0]] },
+        () => createTestFlatItems(testItems),
+      );
+
+      result.toggleSelect(testItems[0]);
+
+      expect(result.selection()).toEqual([]);
+    });
+  });
+
+  it("toggleSelect should not select non-selectable items", () => {
+    createRoot(() => {
+      const itemSelectable = (item: TestItem) => item.selectable !== false;
+      const result = useDataSheetSelection(
+        { itemSelectable },
+        () => createTestFlatItems(testItems),
+      );
+
+      result.toggleSelect(testItems[2]);
+
+      expect(result.selection()).not.toContain(testItems[2]);
+    });
+  });
+
+  it("toggleSelect should update lastClickAction to 'select' when selecting", () => {
+    createRoot(() => {
+      const result = useDataSheetSelection(
+        { selectionMode: "multiple" },
+        () => createTestFlatItems(testItems),
+      );
+
+      result.toggleSelect(testItems[0]);
+
+      expect(result.lastClickAction()).toBe("select");
+    });
+  });
+
+  it("toggleSelect should update lastClickAction to 'deselect' when deselecting", () => {
+    createRoot(() => {
+      const result = useDataSheetSelection(
+        { selectionMode: "multiple", selection: [testItems[0]] },
+        () => createTestFlatItems(testItems),
+      );
+
+      result.toggleSelect(testItems[0]);
+
+      expect(result.lastClickAction()).toBe("deselect");
+    });
+  });
+
+  it("toggleSelectAll should select all selectable items", () => {
+    createRoot(() => {
+      const itemSelectable = (item: TestItem) => item.selectable !== false;
+      const result = useDataSheetSelection(
+        { itemSelectable },
+        () => createTestFlatItems(testItems),
+      );
+
+      result.toggleSelectAll();
+
+      const selectableItems = testItems.filter((i) => i.selectable !== false);
+      expect(result.selection()).toEqual(selectableItems);
+    });
+  });
+
+  it("toggleSelectAll should deselect all items when all are selected", () => {
+    createRoot(() => {
+      const itemSelectable = (item: TestItem) => item.selectable !== false;
+      const selectableItems = testItems.filter((i) => i.selectable !== false);
+      const result = useDataSheetSelection(
+        { itemSelectable, selection: selectableItems },
+        () => createTestFlatItems(testItems),
+      );
+
+      result.toggleSelectAll();
+
+      expect(result.selection()).toEqual([]);
+    });
+  });
+
+  it("toggleSelectAll should only select selectable items", () => {
+    createRoot(() => {
+      const itemSelectable = (item: TestItem) => item.selectable !== false;
+      const result = useDataSheetSelection(
+        { itemSelectable },
+        () => createTestFlatItems(testItems),
+      );
+
+      result.toggleSelectAll();
+
+      expect(result.selection()).not.toContain(testItems[2]);
+    });
+  });
+
+  it("rangeSelect should do nothing if lastClickedRow is null", () => {
+    createRoot(() => {
+      const result = useDataSheetSelection(
+        { selectionMode: "multiple" },
+        () => createTestFlatItems(testItems),
+      );
+
+      result.rangeSelect(2);
+
+      expect(result.selection()).toEqual([]);
+    });
+  });
+
+  it("rangeSelect should select items in range when lastClickAction is 'select'", () => {
+    createRoot(() => {
+      const result = useDataSheetSelection(
+        { selectionMode: "multiple" },
+        () => createTestFlatItems(testItems),
+      );
+
+      result.setLastClickedRow(0);
+      result.setLastClickAction("select");
+      result.rangeSelect(2);
+
+      expect(result.selection().length).toBe(3);
+      expect(result.selection()).toContain(testItems[0]);
+      expect(result.selection()).toContain(testItems[1]);
+      expect(result.selection()).toContain(testItems[2]);
+    });
+  });
+
+  it("rangeSelect should select items in reverse range", () => {
+    createRoot(() => {
+      const result = useDataSheetSelection(
+        { selectionMode: "multiple" },
+        () => createTestFlatItems(testItems),
+      );
+
+      result.setLastClickedRow(2);
+      result.setLastClickAction("select");
+      result.rangeSelect(0);
+
+      expect(result.selection().length).toBe(3);
+      expect(result.selection()).toContain(testItems[0]);
+      expect(result.selection()).toContain(testItems[1]);
+      expect(result.selection()).toContain(testItems[2]);
+    });
+  });
+
+  it("rangeSelect should deselect items in range when lastClickAction is 'deselect'", () => {
+    createRoot(() => {
+      const result = useDataSheetSelection(
+        { selectionMode: "multiple", selection: testItems },
+        () => createTestFlatItems(testItems),
+      );
+
+      result.setLastClickedRow(0);
+      result.setLastClickAction("deselect");
+      result.rangeSelect(2);
+
+      expect(result.selection()).not.toContain(testItems[0]);
+      expect(result.selection()).not.toContain(testItems[1]);
+      expect(result.selection()).toContain(testItems[3]);
+    });
+  });
+
+  it("rangeSelect should only select selectable items in range", () => {
+    createRoot(() => {
+      const itemSelectable = (item: TestItem) => item.selectable !== false;
+      const result = useDataSheetSelection(
+        { selectionMode: "multiple", itemSelectable },
+        () => createTestFlatItems(testItems),
+      );
+
+      result.setLastClickedRow(0);
+      result.setLastClickAction("select");
+      result.rangeSelect(3);
+
+      expect(result.selection()).not.toContain(testItems[2]);
+      expect(result.selection()).toContain(testItems[0]);
+      expect(result.selection()).toContain(testItems[1]);
+      expect(result.selection()).toContain(testItems[3]);
+    });
+  });
+
+  it("should respect controlled mode with onChange callback", () => {
+    createRoot(() => {
+      let lastCalledWith: TestItem[] | null = null;
+      const onSelectionChange = (items: TestItem[]) => {
+        lastCalledWith = items;
+      };
+
+      const result = useDataSheetSelection(
+        { selectionMode: "multiple", onSelectionChange },
+        () => createTestFlatItems(testItems),
+      );
+
+      result.toggleSelect(testItems[0]);
+
+      expect(lastCalledWith).toEqual([testItems[0]]);
+    });
+  });
+
+  it("should track last clicked row", () => {
+    createRoot(() => {
+      const result = useDataSheetSelection(
+        { selectionMode: "multiple" },
+        () => createTestFlatItems(testItems),
+      );
+
+      result.setLastClickedRow(2);
+
+      expect(result.lastClickedRow()).toBe(2);
+    });
+  });
+
+  it("should default to 'select' action", () => {
+    createRoot(() => {
+      const result = useDataSheetSelection(
+        { selectionMode: "multiple" },
+        () => createTestFlatItems(testItems),
+      );
+
+      expect(result.lastClickAction()).toBe("select");
+    });
+  });
+});

package/tests/components/data/sheet/hooks/useDataSheetSorting.spec.ts

@@ -0,0 +1,279 @@
+import { describe, it, expect } from "vitest";
+import { createRoot, createSignal } from "solid-js";
+import { useDataSheetSorting } from "../../../../../src/components/data/sheet/hooks/useDataSheetSorting";
+import type { SortingDef } from "../../../../../src/components/data/sheet/types";
+
+interface TestItem {
+  id: number;
+  name: string;
+  age: number;
+}
+
+const testData: TestItem[] = [
+  { id: 1, name: "Alice", age: 30 },
+  { id: 2, name: "Bob", age: 25 },
+  { id: 3, name: "Charlie", age: 35 },
+];
+
+describe("useDataSheetSorting", () => {
+  it("initializes with empty sorts", () => {
+    createRoot(() => {
+      const [sorts, _setSorts] = createSignal<SortingDef[] | undefined>(undefined);
+      const [onSortsChange, _setOnSortsChange] = createSignal<((sorts: SortingDef[]) => void) | undefined>(
+        undefined,
+      );
+      const [items] = createSignal<TestItem[] | undefined>(testData);
+      const [autoSort] = createSignal<boolean | undefined>(true);
+
+      const { sorts: resultSorts } = useDataSheetSorting({
+        sorts,
+        onSortsChange,
+        items,
+        autoSort,
+      });
+
+      expect(resultSorts()).toEqual([]);
+    });
+  });
+
+  it("toggleSort adds ascending sort when no sort exists", () => {
+    createRoot(() => {
+      const [sorts, _setSorts] = createSignal<SortingDef[] | undefined>(undefined);
+      const [onSortsChange] = createSignal<((sorts: SortingDef[]) => void) | undefined>(undefined);
+      const [items] = createSignal<TestItem[] | undefined>(testData);
+      const [autoSort] = createSignal<boolean | undefined>(true);
+
+      const { toggleSort, sorts: resultSorts } = useDataSheetSorting({
+        sorts,
+        onSortsChange,
+        items,
+        autoSort,
+      });
+
+      toggleSort("name", false);
+
+      expect(resultSorts()).toEqual([{ key: "name", desc: false }]);
+    });
+  });
+
+  it("toggleSort cycles asc -> desc -> remove", () => {
+    createRoot(() => {
+      const [sorts, _setSorts] = createSignal<SortingDef[]>([]);
+      const [onSortsChange] = createSignal<((sorts: SortingDef[]) => void) | undefined>(undefined);
+      const [items] = createSignal<TestItem[] | undefined>(testData);
+      const [autoSort] = createSignal<boolean | undefined>(true);
+
+      const { toggleSort, sorts: resultSorts } = useDataSheetSorting({
+        sorts,
+        onSortsChange,
+        items,
+        autoSort,
+      });
+
+      // Step 1: none -> asc
+      toggleSort("name", false);
+      expect(resultSorts()).toEqual([{ key: "name", desc: false }]);
+
+      // Step 2: asc -> desc
+      toggleSort("name", false);
+      expect(resultSorts()).toEqual([{ key: "name", desc: true }]);
+
+      // Step 3: desc -> remove
+      toggleSort("name", false);
+      expect(resultSorts()).toEqual([]);
+    });
+  });
+
+  it("toggleSort in multiple mode preserves other sorts", () => {
+    createRoot(() => {
+      const [sorts, _setSorts] = createSignal<SortingDef[]>([{ key: "id", desc: false }]);
+      const [onSortsChange] = createSignal<((sorts: SortingDef[]) => void) | undefined>(undefined);
+      const [items] = createSignal<TestItem[] | undefined>(testData);
+      const [autoSort] = createSignal<boolean | undefined>(true);
+
+      const { toggleSort, sorts: resultSorts } = useDataSheetSorting({
+        sorts,
+        onSortsChange,
+        items,
+        autoSort,
+      });
+
+      // Add name sort in multiple mode
+      toggleSort("name", true);
+      expect(resultSorts()).toEqual([
+        { key: "id", desc: false },
+        { key: "name", desc: false },
+      ]);
+
+      // Toggle name to desc in multiple mode
+      toggleSort("name", true);
+      expect(resultSorts()).toEqual([
+        { key: "id", desc: false },
+        { key: "name", desc: true },
+      ]);
+
+      // Remove name in multiple mode
+      toggleSort("name", true);
+      expect(resultSorts()).toEqual([{ key: "id", desc: false }]);
+    });
+  });
+
+  it("sortIndex returns undefined for single sort", () => {
+    createRoot(() => {
+      const [sorts, _setSorts] = createSignal<SortingDef[]>([{ key: "name", desc: false }]);
+      const [onSortsChange] = createSignal<((sorts: SortingDef[]) => void) | undefined>(undefined);
+      const [items] = createSignal<TestItem[] | undefined>(testData);
+      const [autoSort] = createSignal<boolean | undefined>(true);
+
+      const { sortIndex } = useDataSheetSorting({
+        sorts,
+        onSortsChange,
+        items,
+        autoSort,
+      });
+
+      expect(sortIndex("name")).toBeUndefined();
+    });
+  });
+
+  it("sortIndex returns 1-based index for multi sort", () => {
+    createRoot(() => {
+      const [sorts, _setSorts] = createSignal<SortingDef[]>([
+        { key: "id", desc: false },
+        { key: "name", desc: false },
+        { key: "age", desc: false },
+      ]);
+      const [onSortsChange] = createSignal<((sorts: SortingDef[]) => void) | undefined>(undefined);
+      const [items] = createSignal<TestItem[] | undefined>(testData);
+      const [autoSort] = createSignal<boolean | undefined>(true);
+
+      const { sortIndex } = useDataSheetSorting({
+        sorts,
+        onSortsChange,
+        items,
+        autoSort,
+      });
+
+      expect(sortIndex("id")).toBe(1);
+      expect(sortIndex("name")).toBe(2);
+      expect(sortIndex("age")).toBe(3);
+      expect(sortIndex("nonexistent")).toBeUndefined();
+    });
+  });
+
+  it("sortedItems applies sorting when autoSort is true", () => {
+    createRoot(() => {
+      const [sorts, _setSorts] = createSignal<SortingDef[]>([{ key: "age", desc: false }]);
+      const [onSortsChange] = createSignal<((sorts: SortingDef[]) => void) | undefined>(undefined);
+      const [items] = createSignal<TestItem[] | undefined>(testData);
+      const [autoSort] = createSignal<boolean | undefined>(true);
+
+      const { sortedItems } = useDataSheetSorting({
+        sorts,
+        onSortsChange,
+        items,
+        autoSort,
+      });
+
+      // Should be sorted by age ascending: 25, 30, 35
+      const result = sortedItems();
+      expect(result[0].age).toBe(25);
+      expect(result[1].age).toBe(30);
+      expect(result[2].age).toBe(35);
+    });
+  });
+
+  it("sortedItems returns original items when autoSort is false", () => {
+    createRoot(() => {
+      const [sorts, _setSorts] = createSignal<SortingDef[]>([{ key: "age", desc: false }]);
+      const [onSortsChange] = createSignal<((sorts: SortingDef[]) => void) | undefined>(undefined);
+      const [items] = createSignal<TestItem[] | undefined>(testData);
+      const [autoSort] = createSignal<boolean | undefined>(false);
+
+      const { sortedItems } = useDataSheetSorting({
+        sorts,
+        onSortsChange,
+        items,
+        autoSort,
+      });
+
+      // Should return original order despite sort definition
+      const result = sortedItems();
+      expect(result).toEqual(testData);
+    });
+  });
+
+  it("sortedItems applies descending sort", () => {
+    createRoot(() => {
+      const [sorts, _setSorts] = createSignal<SortingDef[]>([{ key: "age", desc: true }]);
+      const [onSortsChange] = createSignal<((sorts: SortingDef[]) => void) | undefined>(undefined);
+      const [items] = createSignal<TestItem[] | undefined>(testData);
+      const [autoSort] = createSignal<boolean | undefined>(true);
+
+      const { sortedItems } = useDataSheetSorting({
+        sorts,
+        onSortsChange,
+        items,
+        autoSort,
+      });
+
+      // Should be sorted by age descending: 35, 30, 25
+      const result = sortedItems();
+      expect(result[0].age).toBe(35);
+      expect(result[1].age).toBe(30);
+      expect(result[2].age).toBe(25);
+    });
+  });
+
+  it("sortedItems applies multiple sorts in order", () => {
+    createRoot(() => {
+      const multiData: TestItem[] = [
+        { id: 1, name: "Alice", age: 30 },
+        { id: 2, name: "Bob", age: 25 },
+        { id: 3, name: "Alice", age: 25 },
+      ];
+
+      const [sorts, _setSorts] = createSignal<SortingDef[]>([
+        { key: "name", desc: false },
+        { key: "age", desc: false },
+      ]);
+      const [onSortsChange] = createSignal<((sorts: SortingDef[]) => void) | undefined>(undefined);
+      const [items] = createSignal<TestItem[] | undefined>(multiData);
+      const [autoSort] = createSignal<boolean | undefined>(true);
+
+      const { sortedItems } = useDataSheetSorting({
+        sorts,
+        onSortsChange,
+        items,
+        autoSort,
+      });
+
+      const result = sortedItems();
+      // Primary sort by name, secondary by age
+      // Alice(25), Alice(30), Bob(25)
+      expect(result[0].name).toBe("Alice");
+      expect(result[0].age).toBe(25);
+      expect(result[1].name).toBe("Alice");
+      expect(result[1].age).toBe(30);
+      expect(result[2].name).toBe("Bob");
+    });
+  });
+
+  it("handles undefined items", () => {
+    createRoot(() => {
+      const [sorts, _setSorts] = createSignal<SortingDef[] | undefined>(undefined);
+      const [onSortsChange] = createSignal<((sorts: SortingDef[]) => void) | undefined>(undefined);
+      const [items] = createSignal<TestItem[] | undefined>(undefined);
+      const [autoSort] = createSignal<boolean | undefined>(true);
+
+      const { sortedItems } = useDataSheetSorting({
+        sorts,
+        onSortsChange,
+        items,
+        autoSort,
+      });
+
+      expect(sortedItems()).toEqual([]);
+    });
+  });
+});

package/tests/components/disclosure/Collapse.spec.tsx

@@ -37,24 +37,6 @@ describe("Collapse", () => {
         ?.firstElementChild as HTMLElement;
       expect(contentDiv.style.visibility).toBe("hidden");
     });
-
-    it("renders correctly with no children", () => {
-      const { container } = render(() => <Collapse open={false} />);
-      expect(container.firstChild).toBeTruthy();
-    });
-
-    it("merges custom classes", () => {
-      const { container } = render(() => (
-        // eslint-disable-next-line tailwindcss/no-custom-classname
-        <Collapse open={true} class="my-test-class">
-          Content
-        </Collapse>
-      ));
-      expect(container.querySelector(".my-test-class")).toBeTruthy();
-      // overflow: hidden is applied as inline style
-      const rootDiv = container.querySelector("[data-collapse]") as HTMLElement;
-      expect(rootDiv.style.overflow).toBe("hidden");
-    });
   });
 
   describe("margin-top calculation", () => {
@@ -90,12 +72,6 @@ describe("Collapse", () => {
   });
 
   describe("initial render and transition", () => {
-    it("applies transition class after mount", () => {
-      const { container } = render(() => <Collapse open={false}>Content</Collapse>);
-      const contentDiv = container.querySelector("[data-collapse]")?.firstElementChild;
-      expect(contentDiv?.classList.contains("transition-[margin-top]")).toBeTruthy();
-    });
-
     it("retains transition class and updates margin-top on open state change", async () => {
       const [open, setOpen] = createSignal(false);
       const { container } = render(() => (