@proyecto-viviana/solidaria 0.1.3 → 0.2.0

package/src/table/createTableCell.ts

@@ -1,147 +0,0 @@
-/**
- * createTableCell - Provides accessibility for a table cell.
- * Based on @react-aria/table/useTableCell.
- */
-
-import { createMemo, createSignal, type Accessor } from 'solid-js';
-import type { JSX } from 'solid-js';
-import type { TableState, TableCollection } from '@proyecto-viviana/solid-stately';
-import type { AriaTableCellProps, TableCellAria } from './types';
-import { getTableData } from './createTable';
-
-/**
- * Creates accessibility props for a table cell.
- */
-export function createTableCell<T extends object>(
-  props: Accessor<AriaTableCellProps>,
-  state: Accessor<TableState<T, TableCollection<T>>>,
-  _ref: Accessor<HTMLTableCellElement | null>
-): TableCellAria {
-  const [isPressed, setIsPressed] = createSignal(false);
-
-  const isDisabled = createMemo(() => {
-    const s = state();
-    const p = props();
-    // Check if parent row is disabled
-    const node = p.node;
-    if (node.parentKey != null) {
-      return s.isDisabled(node.parentKey);
-    }
-    return false;
-  });
-
-  const isFocused = createMemo(() => {
-    const s = state();
-    const p = props();
-    return s.focusedKey === p.node.key;
-  });
-
-  // Handle click for cell actions
-  const onClick = () => {
-    const s = state();
-    const p = props();
-
-    if (isDisabled()) return;
-
-    // Get table metadata for actions
-    const tableData = getTableData(s);
-    const onCellAction = tableData?.actions.onCellAction;
-
-    // Call cell action handler
-    if (onCellAction) {
-      onCellAction(p.node.key);
-    }
-
-    if (p.onAction) {
-      p.onAction();
-    }
-  };
-
-  const onKeyDown = (e: KeyboardEvent) => {
-    const s = state();
-    const p = props();
-
-    if (isDisabled()) return;
-
-    // Enter triggers cell action
-    if (e.key === 'Enter') {
-      const tableData = getTableData(s);
-      const onCellAction = tableData?.actions.onCellAction;
-
-      if (onCellAction || p.onAction) {
-        e.preventDefault();
-
-        if (onCellAction) {
-          onCellAction(p.node.key);
-        }
-
-        if (p.onAction) {
-          p.onAction();
-        }
-      }
-    }
-  };
-
-  const onFocus = () => {
-    const s = state();
-    const p = props();
-    s.setFocusedKey(p.node.key);
-  };
-
-  const onPointerDown = () => {
-    setIsPressed(true);
-  };
-
-  const onPointerUp = () => {
-    setIsPressed(false);
-  };
-
-  const gridCellProps = createMemo(() => {
-    const s = state();
-    const p = props();
-    const node = p.node;
-    const tableData = getTableData(s);
-
-    // Determine the role based on node type
-    let role: string = 'gridcell';
-    if (node.type === 'rowheader') {
-      role = 'rowheader';
-    }
-
-    const baseProps: Record<string, unknown> = {
-      role,
-      id: tableData && node.parentKey != null
-        ? `${tableData.tableId}-${node.parentKey}-${node.key}`
-        : undefined,
-      'aria-disabled': isDisabled() || undefined,
-      tabIndex: isFocused() ? 0 : -1,
-      onClick,
-      onKeyDown,
-      onFocus,
-      onPointerDown,
-      onPointerUp,
-    };
-
-    // Add aria-colindex for virtualized tables
-    if (p.isVirtualized && node.column != null) {
-      baseProps['aria-colindex'] = node.column + 1; // 1-based
-    }
-
-    // Add colspan if present
-    if (node.colspan != null && node.colspan > 1) {
-      baseProps['aria-colspan'] = node.colspan;
-      baseProps.colSpan = node.colspan;
-    }
-
-    return baseProps as JSX.HTMLAttributes<HTMLTableCellElement>;
-  });
-
-  return {
-    get gridCellProps() {
-      return gridCellProps();
-    },
-    get isPressed() {
-      return isPressed();
-    },
-  };
-}

package/src/table/createTableColumnHeader.ts

@@ -1,115 +0,0 @@
-/**
- * createTableColumnHeader - Provides accessibility for a table column header.
- * Based on @react-aria/table/useTableColumnHeader.
- */
-
-import { createMemo, createSignal, type Accessor } from 'solid-js';
-import type { JSX } from 'solid-js';
-import type { TableState, TableCollection } from '@proyecto-viviana/solid-stately';
-import type { AriaTableColumnHeaderProps, TableColumnHeaderAria } from './types';
-import { getTableData } from './createTable';
-
-/**
- * Creates accessibility props for a table column header.
- */
-export function createTableColumnHeader<T extends object>(
-  props: Accessor<AriaTableColumnHeaderProps>,
-  state: Accessor<TableState<T, TableCollection<T>>>,
-  _ref: Accessor<HTMLTableCellElement | null>
-): TableColumnHeaderAria {
-  const [_isPressed, setIsPressed] = createSignal(false);
-
-  const isFocused = createMemo(() => {
-    const s = state();
-    const p = props();
-    return s.focusedKey === p.node.key;
-  });
-
-  // Handle click for sorting
-  const onClick = () => {
-    const s = state();
-    const p = props();
-
-    if (p.allowsSorting) {
-      s.sort(p.node.key);
-    }
-  };
-
-  const onKeyDown = (e: KeyboardEvent) => {
-    const p = props();
-    const s = state();
-
-    if (p.allowsSorting && (e.key === 'Enter' || e.key === ' ')) {
-      e.preventDefault();
-      s.sort(p.node.key);
-    }
-  };
-
-  const onFocus = () => {
-    const s = state();
-    const p = props();
-    s.setFocusedKey(p.node.key);
-  };
-
-  const onPointerDown = () => {
-    setIsPressed(true);
-  };
-
-  const onPointerUp = () => {
-    setIsPressed(false);
-  };
-
-  const columnHeaderProps = createMemo(() => {
-    const s = state();
-    const p = props();
-    const node = p.node;
-    const tableData = getTableData(s);
-
-    // Determine sort state
-    let ariaSort: 'none' | 'ascending' | 'descending' | undefined = undefined;
-    if (p.allowsSorting) {
-      const sortDescriptor = s.sortDescriptor;
-      if (sortDescriptor?.column === node.key) {
-        ariaSort = sortDescriptor.direction;
-      } else {
-        ariaSort = 'none';
-      }
-    }
-
-    const baseProps: Record<string, unknown> = {
-      role: 'columnheader',
-      id: tableData ? `${tableData.tableId}-${node.key}` : undefined,
-      'aria-sort': ariaSort,
-      tabIndex: isFocused() ? 0 : -1,
-      onFocus,
-    };
-
-    // Add click handler if sortable
-    if (p.allowsSorting) {
-      baseProps.onClick = onClick;
-      baseProps.onKeyDown = onKeyDown;
-      baseProps.onPointerDown = onPointerDown;
-      baseProps.onPointerUp = onPointerUp;
-      baseProps.style = { cursor: 'pointer' };
-    }
-
-    // Add aria-colindex for virtualized tables
-    if (p.isVirtualized && node.column != null) {
-      baseProps['aria-colindex'] = node.column + 1; // 1-based
-    }
-
-    // Add colspan if present
-    if (node.colspan != null && node.colspan > 1) {
-      baseProps['aria-colspan'] = node.colspan;
-      baseProps.colSpan = node.colspan;
-    }
-
-    return baseProps as JSX.HTMLAttributes<HTMLTableCellElement>;
-  });
-
-  return {
-    get columnHeaderProps() {
-      return columnHeaderProps();
-    },
-  };
-}

package/src/table/createTableHeaderRow.ts

@@ -1,40 +0,0 @@
-/**
- * createTableHeaderRow - Provides accessibility for a table header row.
- * Based on @react-aria/table/useTableHeaderRow.
- */
-
-import { createMemo, type Accessor } from 'solid-js';
-import type { JSX } from 'solid-js';
-import type { TableState, TableCollection } from '@proyecto-viviana/solid-stately';
-import type { AriaTableHeaderRowProps, TableHeaderRowAria } from './types';
-
-/**
- * Creates accessibility props for a table header row.
- */
-export function createTableHeaderRow<T extends object>(
-  props: Accessor<AriaTableHeaderRowProps>,
-  _state: Accessor<TableState<T, TableCollection<T>>>,
-  _ref: Accessor<HTMLTableRowElement | null>
-): TableHeaderRowAria {
-  const rowProps = createMemo(() => {
-    const p = props();
-    const node = p.node;
-
-    const baseProps: Record<string, unknown> = {
-      role: 'row',
-    };
-
-    // Add aria-rowindex for virtualized tables
-    if (p.isVirtualized && node.rowIndex != null) {
-      baseProps['aria-rowindex'] = node.rowIndex + 1; // 1-based
-    }
-
-    return baseProps as JSX.HTMLAttributes<HTMLTableRowElement>;
-  });
-
-  return {
-    get rowProps() {
-      return rowProps();
-    },
-  };
-}

package/src/table/createTableRow.ts

@@ -1,155 +0,0 @@
-/**
- * createTableRow - Provides accessibility for a table row.
- * Based on @react-aria/table/useTableRow.
- */
-
-import { createMemo, createSignal, type Accessor } from 'solid-js';
-import type { JSX } from 'solid-js';
-import type { TableState, TableCollection } from '@proyecto-viviana/solid-stately';
-import type { AriaTableRowProps, TableRowAria } from './types';
-import { getTableData } from './createTable';
-
-/**
- * Creates accessibility props for a table row.
- */
-export function createTableRow<T extends object>(
-  props: Accessor<AriaTableRowProps>,
-  state: Accessor<TableState<T, TableCollection<T>>>,
-  _ref: Accessor<HTMLTableRowElement | null>
-): TableRowAria {
-  const [isPressed, setIsPressed] = createSignal(false);
-
-  const isSelected = createMemo(() => {
-    const s = state();
-    const p = props();
-    return s.isSelected(p.node.key);
-  });
-
-  const isDisabled = createMemo(() => {
-    const s = state();
-    const p = props();
-    return s.isDisabled(p.node.key);
-  });
-
-  const isFocused = createMemo(() => {
-    const s = state();
-    const p = props();
-    return s.focusedKey === p.node.key;
-  });
-
-  // Handle click/press for selection
-  const onClick = (e: MouseEvent) => {
-    const s = state();
-    const p = props();
-
-    if (isDisabled()) return;
-
-    // Get table metadata for actions
-    const tableData = getTableData(s);
-    const onRowAction = tableData?.actions.onRowAction;
-
-    // Handle selection
-    if (s.selectionMode !== 'none') {
-      if (e.shiftKey && s.selectionMode === 'multiple') {
-        s.extendSelection(p.node.key);
-      } else if (e.ctrlKey || e.metaKey) {
-        s.toggleSelection(p.node.key);
-      } else {
-        // Replace selection
-        s.replaceSelection(p.node.key);
-      }
-    }
-
-    // Call action handler
-    if (onRowAction) {
-      onRowAction(p.node.key);
-    }
-
-    if (p.onAction) {
-      p.onAction();
-    }
-  };
-
-  const onKeyDown = (e: KeyboardEvent) => {
-    const s = state();
-    const p = props();
-
-    if (isDisabled()) return;
-
-    if (e.key === 'Enter' || e.key === ' ') {
-      e.preventDefault();
-
-      // Get table metadata for actions
-      const tableData = getTableData(s);
-      const onRowAction = tableData?.actions.onRowAction;
-
-      // Handle selection
-      if (s.selectionMode !== 'none') {
-        s.toggleSelection(p.node.key);
-      }
-
-      // Call action handler
-      if (onRowAction) {
-        onRowAction(p.node.key);
-      }
-
-      if (p.onAction) {
-        p.onAction();
-      }
-    }
-  };
-
-  const onFocus = () => {
-    const s = state();
-    const p = props();
-    s.setFocusedKey(p.node.key);
-  };
-
-  const onPointerDown = () => {
-    setIsPressed(true);
-  };
-
-  const onPointerUp = () => {
-    setIsPressed(false);
-  };
-
-  const rowProps = createMemo(() => {
-    const s = state();
-    const p = props();
-    const node = p.node;
-
-    const baseProps: Record<string, unknown> = {
-      role: 'row',
-      'aria-selected': s.selectionMode !== 'none' ? isSelected() : undefined,
-      'aria-disabled': isDisabled() || undefined,
-      tabIndex: isFocused() ? 0 : -1,
-      onClick,
-      onKeyDown,
-      onFocus,
-      onPointerDown,
-      onPointerUp,
-    };
-
-    // Add aria-rowindex for virtualized tables
-    if (p.isVirtualized && node.rowIndex != null) {
-      baseProps['aria-rowindex'] = node.rowIndex + 1; // 1-based
-    }
-
-    return baseProps as JSX.HTMLAttributes<HTMLTableRowElement>;
-  });
-
-  return {
-    get rowProps() {
-      return rowProps();
-    },
-    get isSelected() {
-      return isSelected();
-    },
-    get isDisabled() {
-      return isDisabled();
-    },
-    get isPressed() {
-      return isPressed();
-    },
-  };
-}

package/src/table/createTableRowGroup.ts

@@ -1,32 +0,0 @@
-/**
- * createTableRowGroup - Provides accessibility for a table row group.
- * Based on @react-aria/grid/useTableRowGroup.
- */
-
-import { createMemo, type Accessor } from 'solid-js';
-import type { JSX } from 'solid-js';
-import type { AriaTableRowGroupProps, TableRowGroupAria } from './types';
-
-/**
- * Creates accessibility props for a table row group (thead, tbody, tfoot).
- */
-export function createTableRowGroup(
-  props: Accessor<AriaTableRowGroupProps>
-): TableRowGroupAria {
-  const rowGroupProps = createMemo(() => {
-    // Access props for reactivity tracking, even though not currently used
-    void props();
-
-    const baseProps: Record<string, unknown> = {
-      role: 'rowgroup',
-    };
-
-    return baseProps as JSX.HTMLAttributes<HTMLTableSectionElement>;
-  });
-
-  return {
-    get rowGroupProps() {
-      return rowGroupProps();
-    },
-  };
-}

package/src/table/createTableSelectAllCheckbox.ts

@@ -1,73 +0,0 @@
-/**
- * createTableSelectAllCheckbox - Provides accessibility for a table select-all checkbox.
- * Based on @react-aria/table/useTableSelectAllCheckbox.
- */
-
-import { createMemo, type Accessor } from 'solid-js';
-import type { JSX } from 'solid-js';
-import type { TableState, TableCollection } from '@proyecto-viviana/solid-stately';
-import type { TableSelectAllCheckboxAria } from './types';
-
-/**
- * Creates accessibility props for a table select-all checkbox.
- */
-export function createTableSelectAllCheckbox<T extends object>(
-  state: Accessor<TableState<T, TableCollection<T>>>
-): TableSelectAllCheckboxAria {
-  const isSelectAll = createMemo(() => {
-    const s = state();
-    return s.selectedKeys === 'all';
-  });
-
-  const isEmpty = createMemo(() => {
-    const s = state();
-    return s.collection.size === 0;
-  });
-
-  const isIndeterminate = createMemo(() => {
-    const s = state();
-    const selectedKeys = s.selectedKeys;
-    if (selectedKeys === 'all') return false;
-    if (selectedKeys.size === 0) return false;
-    return selectedKeys.size < s.collection.size;
-  });
-
-  const isDisabled = createMemo(() => {
-    const s = state();
-    return s.selectionMode !== 'multiple' || isEmpty();
-  });
-
-  const onChange = () => {
-    const s = state();
-    if (!isDisabled()) {
-      s.toggleSelectAll();
-    }
-  };
-
-  const checkboxProps = createMemo(() => {
-    const s = state();
-
-    const baseProps: Record<string, unknown> = {
-      type: 'checkbox',
-      checked: isSelectAll(),
-      disabled: isDisabled(),
-      onChange,
-      'aria-label': s.selectionMode === 'single' ? 'Select' : 'Select all',
-    };
-
-    // Handle indeterminate state
-    // Note: indeterminate is not a standard HTML attribute, it must be set via JavaScript
-    // The component using this should handle this separately
-    if (isIndeterminate()) {
-      baseProps['data-indeterminate'] = 'true';
-    }
-
-    return baseProps as JSX.InputHTMLAttributes<HTMLInputElement>;
-  });
-
-  return {
-    get checkboxProps() {
-      return checkboxProps();
-    },
-  };
-}

package/src/table/createTableSelectionCheckbox.ts

@@ -1,59 +0,0 @@
-/**
- * createTableSelectionCheckbox - Provides accessibility for a table row selection checkbox.
- * Based on @react-aria/table/useTableSelectionCheckbox.
- */
-
-import { createMemo, type Accessor } from 'solid-js';
-import type { JSX } from 'solid-js';
-import { createId } from '@proyecto-viviana/solid-stately';
-import type { TableState, TableCollection } from '@proyecto-viviana/solid-stately';
-import type { AriaTableSelectionCheckboxProps, TableSelectionCheckboxAria } from './types';
-
-/**
- * Creates accessibility props for a table row selection checkbox.
- */
-export function createTableSelectionCheckbox<T extends object>(
-  props: Accessor<AriaTableSelectionCheckboxProps>,
-  state: Accessor<TableState<T, TableCollection<T>>>
-): TableSelectionCheckboxAria {
-  const checkboxId = createId();
-
-  const isSelected = createMemo(() => {
-    const s = state();
-    const p = props();
-    return s.isSelected(p.key);
-  });
-
-  const isDisabled = createMemo(() => {
-    const s = state();
-    const p = props();
-    return s.isDisabled(p.key);
-  });
-
-  const onChange = () => {
-    const s = state();
-    const p = props();
-    if (!isDisabled()) {
-      s.toggleSelection(p.key);
-    }
-  };
-
-  const checkboxProps = createMemo(() => {
-    const baseProps: Record<string, unknown> = {
-      id: checkboxId,
-      type: 'checkbox',
-      checked: isSelected(),
-      disabled: isDisabled(),
-      onChange,
-      'aria-label': 'Select',
-    };
-
-    return baseProps as JSX.InputHTMLAttributes<HTMLInputElement>;
-  });
-
-  return {
-    get checkboxProps() {
-      return checkboxProps();
-    },
-  };
-}

package/src/table/index.ts

@@ -1,30 +0,0 @@
-/**
- * Table accessibility primitives for Table components.
- * Based on @react-aria/table.
- */
-
-export { createTable, getTableData } from './createTable';
-export { createTableHeaderRow } from './createTableHeaderRow';
-export { createTableColumnHeader } from './createTableColumnHeader';
-export { createTableRow } from './createTableRow';
-export { createTableCell } from './createTableCell';
-export { createTableRowGroup } from './createTableRowGroup';
-export { createTableSelectionCheckbox } from './createTableSelectionCheckbox';
-export { createTableSelectAllCheckbox } from './createTableSelectAllCheckbox';
-export type {
-  AriaTableProps,
-  TableAria,
-  AriaTableHeaderRowProps,
-  TableHeaderRowAria,
-  AriaTableColumnHeaderProps,
-  TableColumnHeaderAria,
-  AriaTableRowProps,
-  TableRowAria,
-  AriaTableCellProps,
-  TableCellAria,
-  AriaTableRowGroupProps,
-  TableRowGroupAria,
-  AriaTableSelectionCheckboxProps,
-  TableSelectionCheckboxAria,
-  TableSelectAllCheckboxAria,
-} from './types';