@proyecto-viviana/solid-stately 0.1.4 → 0.2.0

package/src/table/TableCollection.ts

@@ -1,388 +0,0 @@
-/**
- * TableCollection - A collection class for table data.
- * Based on @react-stately/table/TableCollection.
- */
-
-import type { Key } from '../collections/types';
-import type { GridNode, GridNodeType } from '../grid/types';
-import type {
-  TableCollection as ITableCollection,
-  TableCollectionOptions,
-  ColumnDefinition,
-  RowDefinition,
-} from './types';
-
-/**
- * Creates a table collection from column and row definitions.
- */
-export class TableCollection<T = unknown> implements ITableCollection<T> {
-  private _columns: GridNode<T>[] = [];
-  private _rows: GridNode<T>[] = [];
-  private _headerRows: GridNode<T>[] = [];
-  private _body: GridNode<T>;
-  private _head: GridNode<T> | undefined;
-  private _keyMap: Map<Key, GridNode<T>> = new Map();
-  private _rowHeaderColumnKeys: Set<Key>;
-  private _size: number = 0;
-
-  constructor(options: TableCollectionOptions<T>) {
-    const {
-      columns,
-      rows,
-      getKey,
-      getTextValue,
-      showSelectionCheckboxes = false,
-      rowHeaderColumnKeys,
-    } = options;
-
-    // Build columns
-    this._columns = this.buildColumns(columns, showSelectionCheckboxes);
-
-    // Determine row header column keys
-    this._rowHeaderColumnKeys = rowHeaderColumnKeys ?? this.getDefaultRowHeaderColumnKeys();
-
-    // Build header rows
-    this._headerRows = this.buildHeaderRows();
-
-    // Build head node
-    if (this._headerRows.length > 0) {
-      this._head = {
-        type: 'headerrow' as GridNodeType,
-        key: 'header',
-        index: 0,
-        level: 0,
-        hasChildNodes: true,
-        childNodes: this._headerRows,
-        value: null,
-        textValue: '',
-      };
-      this._keyMap.set('header', this._head);
-    }
-
-    // Build body rows
-    const bodyRows = this.buildRows(rows, getKey, getTextValue);
-    this._size = bodyRows.length;
-
-    // Build body node
-    this._body = {
-      type: 'item' as GridNodeType,
-      key: 'body',
-      index: this._headerRows.length,
-      level: 0,
-      hasChildNodes: true,
-      childNodes: bodyRows,
-      value: null,
-      textValue: '',
-    };
-    this._keyMap.set('body', this._body);
-
-    // Combine all rows
-    this._rows = [...this._headerRows, ...bodyRows];
-  }
-
-  private buildColumns(
-    columns: ColumnDefinition<T>[],
-    showSelectionCheckboxes: boolean
-  ): GridNode<T>[] {
-    const result: GridNode<T>[] = [];
-    let colIndex = 0;
-
-    // Add selection column if needed
-    if (showSelectionCheckboxes) {
-      const selectionColumn: GridNode<T> = {
-        type: 'column' as GridNodeType,
-        key: '__selection__',
-        index: colIndex,
-        column: 0,
-        level: 0,
-        hasChildNodes: false,
-        childNodes: [],
-        value: null,
-        textValue: 'Selection',
-      };
-      result.push(selectionColumn);
-      this._keyMap.set(selectionColumn.key, selectionColumn);
-      colIndex++;
-    }
-
-    // Build user columns
-    for (const col of columns) {
-      const node = this.buildColumnNode(col, colIndex);
-      result.push(node);
-      colIndex++;
-    }
-
-    return result;
-  }
-
-  private buildColumnNode(col: ColumnDefinition<T>, index: number): GridNode<T> {
-    const node: GridNode<T> = {
-      type: 'column' as GridNodeType,
-      key: col.key,
-      index,
-      column: index,
-      level: 0,
-      hasChildNodes: (col.children?.length ?? 0) > 0,
-      childNodes: [],
-      value: null,
-      textValue: col.textValue ?? col.name ?? String(col.key),
-    };
-
-    // Build child columns if present (for column groups)
-    if (col.children && col.children.length > 0) {
-      let childIndex = 0;
-      for (const child of col.children) {
-        const childNode = this.buildColumnNode(child, childIndex);
-        childNode.parentKey = col.key;
-        childNode.level = 1;
-        node.childNodes.push(childNode);
-        childIndex++;
-      }
-    }
-
-    this._keyMap.set(node.key, node);
-    return node;
-  }
-
-  private getDefaultRowHeaderColumnKeys(): Set<Key> {
-    // Default to first non-selection column as row header
-    for (const col of this._columns) {
-      if (col.key !== '__selection__') {
-        return new Set([col.key]);
-      }
-    }
-    return new Set();
-  }
-
-  private buildHeaderRows(): GridNode<T>[] {
-    if (this._columns.length === 0) {
-      return [];
-    }
-
-    // Build a single header row containing all columns
-    const headerCells: GridNode<T>[] = this._columns.map((col, index) => ({
-      type: 'column' as GridNodeType,
-      key: `header-${col.key}`,
-      index,
-      column: index,
-      level: 1,
-      hasChildNodes: false,
-      childNodes: [],
-      value: null,
-      textValue: col.textValue,
-      parentKey: 'headerrow-0',
-    }));
-
-    const headerRow: GridNode<T> = {
-      type: 'headerrow' as GridNodeType,
-      key: 'headerrow-0',
-      index: 0,
-      rowIndex: 0,
-      level: 0,
-      hasChildNodes: true,
-      childNodes: headerCells,
-      value: null,
-      textValue: '',
-    };
-
-    this._keyMap.set(headerRow.key, headerRow);
-    headerCells.forEach((cell) => this._keyMap.set(cell.key, cell));
-
-    return [headerRow];
-  }
-
-  private buildRows(
-    rows: RowDefinition<T>[] | T[],
-    getKey?: (item: T) => Key,
-    getTextValue?: (item: T, column: ColumnDefinition<T>) => string
-  ): GridNode<T>[] {
-    const result: GridNode<T>[] = [];
-    const rowIndexOffset = this._headerRows.length;
-
-    for (let i = 0; i < rows.length; i++) {
-      const row = rows[i];
-      const isRowDef = this.isRowDefinition(row);
-
-      const key = isRowDef ? row.key : getKey?.(row as T) ?? i;
-      const value = isRowDef ? row.value : (row as T);
-      const textValue = isRowDef ? row.textValue : undefined;
-
-      // Build cells for this row
-      const cells: GridNode<T>[] = this._columns.map((col, colIndex) => {
-        const cellKey = `${key}-${col.key}`;
-        const cellTextValue =
-          col.key === '__selection__'
-            ? 'Selection'
-            : getTextValue
-              ? getTextValue(value, { key: col.key } as ColumnDefinition<T>)
-              : String((value as Record<string, unknown>)?.[String(col.key)] ?? '');
-
-        const cell: GridNode<T> = {
-          type: this._rowHeaderColumnKeys.has(col.key)
-            ? ('rowheader' as GridNodeType)
-            : ('cell' as GridNodeType),
-          key: cellKey,
-          index: colIndex,
-          column: colIndex,
-          level: 1,
-          hasChildNodes: false,
-          childNodes: [],
-          value,
-          textValue: cellTextValue,
-          parentKey: key,
-        };
-
-        this._keyMap.set(cellKey, cell);
-        return cell;
-      });
-
-      const rowNode: GridNode<T> = {
-        type: 'item' as GridNodeType,
-        key,
-        index: i,
-        rowIndex: rowIndexOffset + i,
-        level: 0,
-        hasChildNodes: true,
-        childNodes: cells,
-        value,
-        textValue: textValue ?? cells.map((c) => c.textValue).join(' '),
-      };
-
-      this._keyMap.set(key, rowNode);
-      result.push(rowNode);
-    }
-
-    return result;
-  }
-
-  private isRowDefinition(row: unknown): row is RowDefinition<T> {
-    return (
-      typeof row === 'object' &&
-      row !== null &&
-      'key' in row &&
-      'value' in row
-    );
-  }
-
-  // Collection interface implementation
-  get size(): number {
-    return this._size;
-  }
-
-  get rows(): GridNode<T>[] {
-    return this._rows;
-  }
-
-  get columns(): GridNode<T>[] {
-    return this._columns;
-  }
-
-  get headerRows(): GridNode<T>[] {
-    return this._headerRows;
-  }
-
-  get head(): GridNode<T> | undefined {
-    return this._head;
-  }
-
-  get body(): GridNode<T> {
-    return this._body;
-  }
-
-  get rowCount(): number {
-    return this._rows.length;
-  }
-
-  get columnCount(): number {
-    return this._columns.length;
-  }
-
-  get rowHeaderColumnKeys(): Set<Key> {
-    return this._rowHeaderColumnKeys;
-  }
-
-  getKeys(): Iterable<Key> {
-    return this._keyMap.keys();
-  }
-
-  getItem(key: Key): GridNode<T> | null {
-    return this._keyMap.get(key) ?? null;
-  }
-
-  at(index: number): GridNode<T> | null {
-    const bodyRows = this._body.childNodes;
-    if (index < 0 || index >= bodyRows.length) {
-      return null;
-    }
-    return bodyRows[index];
-  }
-
-  getChildren(key: Key): Iterable<GridNode<T>> {
-    const node = this._keyMap.get(key);
-    return node?.childNodes ?? [];
-  }
-
-  getTextValue(key: Key): string {
-    const node = this._keyMap.get(key);
-    return node?.textValue ?? '';
-  }
-
-  getCell(rowKey: Key, columnKey: Key): GridNode<T> | null {
-    const cellKey = `${rowKey}-${columnKey}`;
-    return this._keyMap.get(cellKey) ?? null;
-  }
-
-  getFirstKey(): Key | null {
-    // Return first body row key
-    const bodyRows = this._body.childNodes;
-    return bodyRows.length > 0 ? bodyRows[0].key : null;
-  }
-
-  getLastKey(): Key | null {
-    // Return last body row key
-    const bodyRows = this._body.childNodes;
-    return bodyRows.length > 0 ? bodyRows[bodyRows.length - 1].key : null;
-  }
-
-  getKeyBefore(key: Key): Key | null {
-    const node = this._keyMap.get(key);
-    if (!node) return null;
-
-    // Find in body rows
-    const bodyRows = this._body.childNodes;
-    const index = bodyRows.findIndex((r) => r.key === key);
-    if (index > 0) {
-      return bodyRows[index - 1].key;
-    }
-    return null;
-  }
-
-  getKeyAfter(key: Key): Key | null {
-    const node = this._keyMap.get(key);
-    if (!node) return null;
-
-    // Find in body rows
-    const bodyRows = this._body.childNodes;
-    const index = bodyRows.findIndex((r) => r.key === key);
-    if (index >= 0 && index < bodyRows.length - 1) {
-      return bodyRows[index + 1].key;
-    }
-    return null;
-  }
-
-  *[Symbol.iterator](): Iterator<GridNode<T>> {
-    // Only iterate body rows, not header rows
-    for (const row of this._body.childNodes) {
-      yield row;
-    }
-  }
-}
-
-/**
- * Creates a table collection from options.
- */
-export function createTableCollection<T>(
-  options: TableCollectionOptions<T>
-): TableCollection<T> {
-  return new TableCollection(options);
-}

package/src/table/createTableState.d.ts

@@ -1,12 +0,0 @@
-/**
- * Table state management for Table components.
- * Based on @react-stately/table/useTableState.
- */
-import { type Accessor } from 'solid-js';
-import type { TableState, TableStateOptions, TableCollection } from './types';
-/**
- * Creates state management for a table component.
- * Extends grid state with sorting and table-specific features.
- */
-export declare function createTableState<T extends object, C extends TableCollection<T> = TableCollection<T>>(options: Accessor<TableStateOptions<T, C>>): TableState<T, C>;
-//# sourceMappingURL=createTableState.d.ts.map

package/src/table/createTableState.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"createTableState.d.ts","sourceRoot":"","sources":["createTableState.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAc,KAAK,QAAQ,EAAE,MAAM,UAAU,CAAC;AAGrD,OAAO,KAAK,EACV,UAAU,EACV,iBAAiB,EACjB,eAAe,EAGhB,MAAM,SAAS,CAAC;AAOjB;;;GAGG;AACH,wBAAgB,gBAAgB,CAC9B,CAAC,SAAS,MAAM,EAChB,CAAC,SAAS,eAAe,CAAC,CAAC,CAAC,GAAG,eAAe,CAAC,CAAC,CAAC,EACjD,OAAO,EAAE,QAAQ,CAAC,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,EAAE,CAAC,CAAC,CAkG9D"}

package/src/table/createTableState.ts

@@ -1,127 +0,0 @@
-/**
- * Table state management for Table components.
- * Based on @react-stately/table/useTableState.
- */
-
-import { createMemo, type Accessor } from 'solid-js';
-import { createGridState } from '../grid/createGridState';
-import type { Key } from '../collections/types';
-import type {
-  TableState,
-  TableStateOptions,
-  TableCollection,
-  SortDescriptor,
-  SortDirection,
-} from './types';
-
-const OPPOSITE_SORT_DIRECTION: Record<SortDirection, SortDirection> = {
-  ascending: 'descending',
-  descending: 'ascending',
-};
-
-/**
- * Creates state management for a table component.
- * Extends grid state with sorting and table-specific features.
- */
-export function createTableState<
-  T extends object,
-  C extends TableCollection<T> = TableCollection<T>,
->(options: Accessor<TableStateOptions<T, C>>): TableState<T, C> {
-  const getOptions = () => options();
-
-  // Create the underlying grid state
-  const gridState = createGridState<T, C>(() => ({
-    collection: getOptions().collection,
-    disabledKeys: getOptions().disabledKeys,
-    focusMode: getOptions().focusMode,
-    selectionMode: getOptions().selectionMode,
-    selectionBehavior: getOptions().selectionBehavior,
-    disallowEmptySelection: getOptions().disallowEmptySelection,
-    selectedKeys: getOptions().selectedKeys,
-    defaultSelectedKeys: getOptions().defaultSelectedKeys,
-    onSelectionChange: getOptions().onSelectionChange,
-  }));
-
-  // Memoized sort descriptor
-  const sortDescriptor = createMemo<SortDescriptor | null>(() => {
-    return getOptions().sortDescriptor ?? null;
-  });
-
-  // Show selection checkboxes
-  const showSelectionCheckboxes = createMemo(() => {
-    return getOptions().showSelectionCheckboxes ?? false;
-  });
-
-  // Sort function
-  const sort = (columnKey: Key, direction?: SortDirection) => {
-    const opts = getOptions();
-    const currentSort = opts.sortDescriptor;
-
-    // Determine direction
-    let newDirection: SortDirection;
-    if (direction) {
-      newDirection = direction;
-    } else if (currentSort?.column === columnKey) {
-      // Toggle direction if sorting same column
-      newDirection = OPPOSITE_SORT_DIRECTION[currentSort.direction];
-    } else {
-      // Default to ascending for new column
-      newDirection = 'ascending';
-    }
-
-    opts.onSortChange?.({
-      column: columnKey,
-      direction: newDirection,
-    });
-  };
-
-  return {
-    // Forward grid state properties
-    get collection() {
-      return getOptions().collection;
-    },
-    get disabledKeys() {
-      return gridState.disabledKeys;
-    },
-    get isKeyboardNavigationDisabled() {
-      return gridState.isKeyboardNavigationDisabled;
-    },
-    get focusedKey() {
-      return gridState.focusedKey;
-    },
-    get childFocusStrategy() {
-      return gridState.childFocusStrategy;
-    },
-    get isFocused() {
-      return gridState.isFocused;
-    },
-    get selectionMode() {
-      return gridState.selectionMode;
-    },
-    get selectedKeys() {
-      return gridState.selectedKeys;
-    },
-
-    // Grid state methods
-    isSelected: gridState.isSelected,
-    isDisabled: gridState.isDisabled,
-    setFocusedKey: gridState.setFocusedKey,
-    setFocused: gridState.setFocused,
-    toggleSelection: gridState.toggleSelection,
-    replaceSelection: gridState.replaceSelection,
-    extendSelection: gridState.extendSelection,
-    selectAll: gridState.selectAll,
-    clearSelection: gridState.clearSelection,
-    toggleSelectAll: gridState.toggleSelectAll,
-    setKeyboardNavigationDisabled: gridState.setKeyboardNavigationDisabled,
-
-    // Table-specific properties
-    get showSelectionCheckboxes() {
-      return showSelectionCheckboxes();
-    },
-    get sortDescriptor() {
-      return sortDescriptor();
-    },
-    sort,
-  };
-}

package/src/table/index.d.ts

@@ -1,8 +0,0 @@
-/**
- * Table state management module.
- * Provides state hooks for Table components.
- */
-export { createTableState } from './createTableState';
-export { TableCollection, createTableCollection } from './TableCollection';
-export type { TableState, TableStateOptions, TableCollection as ITableCollection, SortDescriptor, SortDirection, Sortable, ColumnDefinition, RowDefinition, TableCollectionOptions, } from './types';
-//# sourceMappingURL=index.d.ts.map

package/src/table/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,eAAe,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAC3E,YAAY,EACV,UAAU,EACV,iBAAiB,EACjB,eAAe,IAAI,gBAAgB,EACnC,cAAc,EACd,aAAa,EACb,QAAQ,EACR,gBAAgB,EAChB,aAAa,EACb,sBAAsB,GACvB,MAAM,SAAS,CAAC"}

package/src/table/index.ts

@@ -1,18 +0,0 @@
-/**
- * Table state management module.
- * Provides state hooks for Table components.
- */
-
-export { createTableState } from './createTableState';
-export { TableCollection, createTableCollection } from './TableCollection';
-export type {
-  TableState,
-  TableStateOptions,
-  TableCollection as ITableCollection,
-  SortDescriptor,
-  SortDirection,
-  Sortable,
-  ColumnDefinition,
-  RowDefinition,
-  TableCollectionOptions,
-} from './types';

package/src/table/types.d.ts

@@ -1,139 +0,0 @@
-/**
- * Table state types for Table components.
- * Based on @react-stately/table and @react-types/table.
- */
-import type { Key } from '../collections/types';
-import type { GridState, GridCollection, GridNode } from '../grid/types';
-/**
- * Sort direction for table columns.
- */
-export type SortDirection = 'ascending' | 'descending';
-/**
- * Describes which column to sort by and in what direction.
- */
-export interface SortDescriptor {
-    /** The key of the column to sort by. */
-    column: Key;
-    /** The direction to sort by. */
-    direction: SortDirection;
-}
-/**
- * Interface for sortable components.
- */
-export interface Sortable {
-    /** The current sorted column and direction. */
-    sortDescriptor?: SortDescriptor;
-    /** Handler that is called when the sorted column or direction changes. */
-    onSortChange?: (descriptor: SortDescriptor) => void;
-}
-/**
- * A collection of table rows and columns.
- * Extends GridCollection with table-specific metadata.
- */
-export interface TableCollection<T = unknown> extends GridCollection<T> {
-    /** A list of header row nodes in the table. */
-    readonly headerRows: GridNode<T>[];
-    /** A list of column nodes in the table. */
-    readonly columns: GridNode<T>[];
-    /** A set of column keys that serve as the row header. */
-    readonly rowHeaderColumnKeys: Set<Key>;
-    /** The node that makes up the header of the table. */
-    readonly head?: GridNode<T>;
-    /** The node that makes up the body of the table. */
-    readonly body: GridNode<T>;
-}
-/**
- * State for a table component.
- * Extends GridState with table-specific functionality.
- */
-export interface TableState<T, C extends TableCollection<T> = TableCollection<T>> extends Omit<GridState<T, GridCollection<T>>, 'collection'> {
-    /** The table collection. */
-    readonly collection: C;
-    /** Whether the row selection checkboxes should be displayed. */
-    readonly showSelectionCheckboxes: boolean;
-    /** The current sorted column and direction. */
-    readonly sortDescriptor: SortDescriptor | null;
-    /** Sort by the given column and direction. */
-    sort(columnKey: Key, direction?: SortDirection): void;
-}
-/**
- * Options for creating table state.
- */
-export interface TableStateOptions<T, C extends TableCollection<T> = TableCollection<T>> extends Sortable {
-    /** The table collection. */
-    collection: C;
-    /** Keys of disabled rows. */
-    disabledKeys?: Iterable<Key>;
-    /** Focus mode: 'row' or 'cell'. */
-    focusMode?: 'row' | 'cell';
-    /** Selection mode. */
-    selectionMode?: 'none' | 'single' | 'multiple';
-    /** Selection behavior. */
-    selectionBehavior?: 'toggle' | 'replace';
-    /** Whether empty selection is disallowed. */
-    disallowEmptySelection?: boolean;
-    /** Currently selected keys (controlled). */
-    selectedKeys?: 'all' | Iterable<Key>;
-    /** Default selected keys (uncontrolled). */
-    defaultSelectedKeys?: 'all' | Iterable<Key>;
-    /** Handler for selection changes. */
-    onSelectionChange?: (keys: 'all' | Set<Key>) => void;
-    /** Whether the row selection checkboxes should be displayed. */
-    showSelectionCheckboxes?: boolean;
-}
-/**
- * Column definition for building table collections.
- */
-export interface ColumnDefinition<T = unknown> {
-    /** The key for the column. */
-    key: Key;
-    /** The display name or rendered content. */
-    name?: string;
-    /** Text value for accessibility. */
-    textValue?: string;
-    /** Whether this column is a row header. */
-    isRowHeader?: boolean;
-    /** Whether this column allows sorting. */
-    allowsSorting?: boolean;
-    /** Child columns (for column groups). */
-    children?: ColumnDefinition<T>[];
-    /** Width of the column. */
-    width?: number | string;
-    /** Minimum width of the column. */
-    minWidth?: number;
-    /** Maximum width of the column. */
-    maxWidth?: number;
-}
-/**
- * Row definition for building table collections.
- */
-export interface RowDefinition<T = unknown> {
-    /** The key for the row. */
-    key: Key;
-    /** The data value for the row. */
-    value: T;
-    /** Text value for accessibility/search. */
-    textValue?: string;
-    /** Whether this row has child rows (for tree tables). */
-    hasChildRows?: boolean;
-    /** Child rows (for tree tables). */
-    childRows?: RowDefinition<T>[];
-}
-/**
- * Options for building a table collection.
- */
-export interface TableCollectionOptions<T = unknown> {
-    /** Column definitions. */
-    columns: ColumnDefinition<T>[];
-    /** Row definitions or data items. */
-    rows: RowDefinition<T>[] | T[];
-    /** Function to get the key from a data item. */
-    getKey?: (item: T) => Key;
-    /** Function to get the text value from a data item. */
-    getTextValue?: (item: T, column: ColumnDefinition<T>) => string;
-    /** Whether to show selection checkboxes. */
-    showSelectionCheckboxes?: boolean;
-    /** Set of column keys that serve as row headers. */
-    rowHeaderColumnKeys?: Set<Key>;
-}
-//# sourceMappingURL=types.d.ts.map