@kouji-ui/core 0.1.1 → 0.1.3

package/src/table/grid-api.spec.ts

@@ -1,178 +0,0 @@
-import { Component, signal, ChangeDetectionStrategy } from '@angular/core';
-import { render } from '@testing-library/angular';
-import { describe, expect, it } from 'vitest';
-import { KjTable } from './table';
-import { kjColumn } from './column-helpers';
-
-interface User {
-  id: string;
-  name: string;
-  age: number;
-}
-
-@Component({
-  standalone: true,
-  imports: [KjTable],
-  changeDetection: ChangeDetectionStrategy.Eager,
-  template: `<table
-    [kjTable]="cols"
-    [kjTableData]="data()"
-    [kjGetRowId]="getId"
-    #t="kjTable"
-  ></table>`,
-})
-class Host {
-  protected readonly cols = [
-    kjColumn<User>({ accessorKey: 'name', header: 'Name' }),
-    kjColumn<User>({ accessorKey: 'age', header: 'Age', filterFn: 'equals' }),
-  ];
-  protected readonly data = signal<User[]>([
-    { id: '1', name: 'Alice', age: 30 },
-    { id: '2', name: 'Bob', age: 25 },
-    { id: '3', name: 'Carol', age: 40 },
-  ]);
-  protected readonly getId = (row: User) => row.id;
-}
-
-async function getDir() {
-  const r = await render(Host);
-  return r.fixture.debugElement.children[0].injector.get(KjTable<User>);
-}
-
-describe('KjGridApi (regrouped)', () => {
-  it('rows: count / displayedCount / filteredCount', async () => {
-    const { rows } = (await getDir()).gridApi;
-    expect(rows.count()).toBe(3);
-    expect(rows.displayedCount()).toBe(3);
-    expect(rows.filteredCount()).toBe(3);
-  });
-
-  it('selection: select/deselect/toggle/all/clear', async () => {
-    const { selection } = (await getDir()).gridApi;
-    expect(selection.has()).toBe(false);
-
-    selection.select('1');
-    expect(selection.has()).toBe(true);
-    expect(selection.ids()).toEqual(['1']);
-
-    selection.toggle('2');
-    expect([...selection.ids()].sort()).toEqual(['1', '2']);
-
-    selection.deselect('1');
-    expect(selection.ids()).toEqual(['2']);
-
-    selection.all();
-    expect([...selection.ids()].sort()).toEqual(['1', '2', '3']);
-
-    selection.clear();
-    expect(selection.has()).toBe(false);
-  });
-
-  it('sort: set / clear', async () => {
-    const { sort } = (await getDir()).gridApi;
-    sort.set([{ id: 'name', desc: true }]);
-    expect(sort.get()).toEqual([{ id: 'name', desc: true }]);
-    sort.clear();
-    expect(sort.get()).toEqual([]);
-  });
-
-  it('filter: column set/clear, global, clearAll', async () => {
-    const { filter, rows } = (await getDir()).gridApi;
-    filter.set('age', 30);
-    expect(filter.get('age')).toBe(30);
-    expect(rows.filteredCount()).toBe(1);
-    filter.clear('age');
-    expect(filter.get('age')).toBeUndefined();
-    expect(rows.filteredCount()).toBe(3);
-
-    filter.global.set('al');
-    expect(filter.global.get()).toBe('al');
-    filter.clearAll();
-    expect(filter.global.get()).toBe('');
-    expect(filter.all()).toEqual([]);
-  });
-
-  it('pagination: next/previous/first/last + setPageSize resets index', async () => {
-    const { pagination } = (await getDir()).gridApi;
-    pagination.setPageSize(1);
-    expect(pagination.pageCount()).toBe(3);
-    pagination.next();
-    expect(pagination.get().pageIndex).toBe(1);
-    pagination.last();
-    expect(pagination.get().pageIndex).toBe(2);
-    pagination.previous();
-    expect(pagination.get().pageIndex).toBe(1);
-    pagination.first();
-    expect(pagination.get().pageIndex).toBe(0);
-    pagination.setPageSize(2);
-    expect(pagination.get()).toEqual({ pageIndex: 0, pageSize: 2 });
-  });
-
-  it('density: get/set', async () => {
-    const { density } = (await getDir()).gridApi;
-    expect(density.get()).toBe('standard');
-    density.set('compact');
-    expect(density.get()).toBe('compact');
-  });
-
-  it('grouping: add / remove / set', async () => {
-    const { grouping } = (await getDir()).gridApi;
-    grouping.add('name');
-    expect(grouping.get()).toEqual(['name']);
-    grouping.add('name'); // no-op
-    expect(grouping.get()).toEqual(['name']);
-    grouping.remove('name');
-    expect(grouping.get()).toEqual([]);
-    grouping.set(['name', 'age']);
-    grouping.remove();
-    expect(grouping.get()).toEqual([]);
-  });
-});
-
-describe('KjColumnApi (regrouped)', () => {
-  it('visibility: setVisible / setManyVisible / isVisible', async () => {
-    const { visibility } = (await getDir()).columnApi;
-    expect(visibility.isVisible('name')).toBe(true);
-    visibility.setVisible('name', false);
-    expect(visibility.isVisible('name')).toBe(false);
-    visibility.setManyVisible(['name', 'age'], true);
-    expect(visibility.isVisible('name')).toBe(true);
-    expect(visibility.isVisible('age')).toBe(true);
-  });
-
-  it('pinning: pin / of', async () => {
-    const { pinning } = (await getDir()).columnApi;
-    expect(pinning.of('name')).toBeNull();
-    pinning.pin('name', 'left');
-    expect(pinning.of('name')).toBe('left');
-    pinning.pin('name', 'right');
-    expect(pinning.of('name')).toBe('right');
-    pinning.pin('name', null);
-    expect(pinning.of('name')).toBeNull();
-  });
-
-  it('order: move', async () => {
-    const { order } = (await getDir()).columnApi;
-    order.move('age', 0);
-    expect(order.get()[0]).toBe('age');
-  });
-
-  it('grouping (per-column): is / set', async () => {
-    const { grouping } = (await getDir()).columnApi;
-    grouping.set('name', true);
-    expect(grouping.is('name')).toBe(true);
-    grouping.set('name', false);
-    expect(grouping.is('name')).toBe(false);
-  });
-
-  it('reset() clears every column-level slice', async () => {
-    const colApi = (await getDir()).columnApi;
-    colApi.pinning.pin('name', 'left');
-    colApi.visibility.setVisible('age', false);
-    colApi.grouping.set('name', true);
-    colApi.reset();
-    expect(colApi.pinning.of('name')).toBeNull();
-    expect(colApi.visibility.isVisible('age')).toBe(true);
-    expect(colApi.grouping.is('name')).toBe(false);
-  });
-});

package/src/table/grid-api.ts

@@ -1,285 +0,0 @@
-import type { Signal } from '@angular/core';
-import type {
-  Column,
-  ColumnFiltersState,
-  ColumnOrderState,
-  ColumnPinningState,
-  ColumnSizingState,
-  ExpandedState,
-  GroupingState,
-  PaginationState,
-  Row,
-  RowData,
-  RowSelectionState,
-  SortingState,
-  Table,
-  VisibilityState,
-} from '@tanstack/angular-table';
-import type { KjFilterModel, KjGridFilterModel } from './filter-models';
-import type { KjTableDensity, KjTableState } from './table.types';
-
-/**
- * Operations grouped by aspect so callers can write code like
- * `api.pagination.next()` or `api.selection.toggle(id)` rather than a flat
- * verb soup. Inspired by AG-Grid's `GridApi`, but reorganised so each
- * concept (rows, selection, sort, filters, pagination, expansion,
- * grouping, density) gets its own namespace — methods inside drop the
- * noun suffix because the namespace already supplies it.
- */
-export interface KjGridApi<TData extends RowData = unknown> {
-  /** Reactive view of the full table state. Use inside `computed`/`effect`. */
-  readonly state: Signal<KjTableState>;
-
-  /** The underlying TanStack `Table<T>` instance. Escape hatch for advanced use. */
-  table(): Table<TData>;
-
-  /** Rows: source data + filtered/sorted/paginated derivatives. */
-  readonly rows: KjRowsApi<TData>;
-
-  /** Row selection — single, multi, bulk. */
-  readonly selection: KjSelectionApi<TData>;
-
-  /** Sort model + per-column toggle. */
-  readonly sort: KjSortApi;
-
-  /** Column filters + global search. */
-  readonly filter: KjFilterApi;
-
-  /** Pagination model + cursor navigation. */
-  readonly pagination: KjPaginationApi;
-
-  /** Row expansion model. */
-  readonly expansion: KjExpansionApi;
-
-  /** Grouping order. */
-  readonly grouping: KjGroupingApi;
-
-  /** Density preset. */
-  readonly density: KjDensityApi;
-
-  /** Merge a partial state. Unspecified slices are untouched. */
-  setState(partial: Partial<KjTableState>): void;
-
-  /** Reset every slice to the directive's defaults. */
-  resetState(): void;
-}
-
-/** Source + derived row models. */
-export interface KjRowsApi<TData> {
-  /** Source data array bound to the table (pre-filter, pre-sort). */
-  all(): readonly TData[];
-  /** RowModel after filtering, sorting, pagination, grouping. */
-  displayed(): Row<TData>[];
-  /** Total source rows. */
-  count(): number;
-  /** Rows surviving filters (before pagination clamps). */
-  filteredCount(): number;
-  /** Rows visible in the current page. */
-  displayedCount(): number;
-  /** Look up a TanStack row by id. */
-  get(id: string): Row<TData> | undefined;
-}
-
-/** Row selection ops. */
-export interface KjSelectionApi<TData> {
-  /** Current selection map. */
-  get(): RowSelectionState;
-  /** Replace the entire selection map. */
-  set(model: RowSelectionState): void;
-  /** Resolved row instances for the current selection (within filtered model). */
-  rows(): Row<TData>[];
-  /** Ids of selected rows. */
-  ids(): readonly string[];
-  /** True when at least one row is selected. */
-  has(): boolean;
-  /** Set a single row's selection. */
-  select(id: string, selected?: boolean): void;
-  /** Deselect a single row. */
-  deselect(id: string): void;
-  /** Toggle a single row's selection. */
-  toggle(id: string): void;
-  /** Select every row in the current filtered model. */
-  all(): void;
-  /** Clear all selection state. */
-  clear(): void;
-}
-
-/** Sort model + per-column toggle. */
-export interface KjSortApi {
-  /** Current sort entries. */
-  get(): SortingState;
-  /** Replace the sort model. */
-  set(sorting: SortingState): void;
-  /** Toggle a single column's sort direction (asc → desc → none). */
-  toggle(columnId: string, multi?: boolean): void;
-  /** Remove every sort entry. */
-  clear(): void;
-}
-
-/** Column filters + global search. */
-export interface KjFilterApi {
-  /** Read a single column's filter value. */
-  get(columnId: string): unknown;
-  /** Set or clear a column's filter (`undefined`/`null`/`''` clears). */
-  set(columnId: string, value: unknown): void;
-  /** Clear a single column's filter. */
-  clear(columnId: string): void;
-  /** All column filter entries. */
-  all(): ColumnFiltersState;
-  /** Replace every column filter at once. */
-  setAll(filters: ColumnFiltersState): void;
-  /** Global (cross-column) search string. */
-  readonly global: KjGlobalFilterApi;
-  /** Clear column filters AND global filter in one shot. */
-  clearAll(): void;
-
-  // ── Structured filter model (AG-Grid-compatible, for SSR) ──────────────
-
-  /**
-   * Read a single column's filter as a structured {@link KjFilterModel}.
-   * Returns `undefined` when the column has no filter or its value is a
-   * raw (non-model) primitive — call {@link KjFilterApi.get} for the
-   * legacy raw view.
-   */
-  getModelFor(columnId: string): KjFilterModel | undefined;
-  /** Apply a structured model to a single column. `null` clears. */
-  setModelFor(columnId: string, model: KjFilterModel | null | undefined): void;
-  /**
-   * Snapshot every column's filter as a `KjGridFilterModel`
-   * (`Record<columnId, KjFilterModel>`). Use to serialise filter state
-   * for server-side queries or persistence. Columns whose value is a
-   * raw primitive (no `filterType` discriminator) are omitted — pair
-   * with `all()` for the legacy bulk view.
-   */
-  getModel(): KjGridFilterModel;
-  /**
-   * Replace the entire grid-level filter model. Matches AG-Grid's
-   * `setFilterModel` contract: columns absent from `model` are cleared.
-   */
-  setModel(model: KjGridFilterModel | null): void;
-}
-
-export interface KjGlobalFilterApi {
-  get(): string;
-  set(value: string): void;
-  clear(): void;
-}
-
-/** Pagination model + cursor navigation. */
-export interface KjPaginationApi {
-  /** Current `{ pageIndex, pageSize }`. */
-  get(): PaginationState;
-  /** Replace pagination state. */
-  set(pagination: PaginationState): void;
-  /** Total pages for the current filtered model. */
-  pageCount(): number;
-  /** Jump to a 0-indexed page. Clamped to `[0, pageCount-1]`. */
-  setPageIndex(pageIndex: number): void;
-  /** Change rows per page. Resets to page 0 to keep the view coherent. */
-  setPageSize(pageSize: number): void;
-  /** Advance one page, no-op if already on the last page. */
-  next(): void;
-  /** Rewind one page, no-op if already on page 0. */
-  previous(): void;
-  /** Jump to page 0. */
-  first(): void;
-  /** Jump to the last page. */
-  last(): void;
-}
-
-/** Row expansion model. */
-export interface KjExpansionApi<_TData = unknown> {
-  /** Current expansion state. `true` = every row expanded. */
-  get(): ExpandedState;
-  /** Replace expansion state. */
-  set(expanded: ExpandedState): void;
-  /** Set a single row's expanded state. */
-  setRow(id: string, expanded: boolean): void;
-  /** Toggle a single row's expanded state. */
-  toggle(id: string): void;
-  /** Expand every row in the current filtered model. */
-  expandAll(): void;
-  /** Collapse every row. */
-  collapseAll(): void;
-}
-
-/** Grouping order. */
-export interface KjGroupingApi {
-  /** Current grouping (ordered column ids). */
-  get(): GroupingState;
-  /** Replace grouping. */
-  set(grouping: GroupingState): void;
-  /** Add a column to the grouping order (no-op if already grouped). */
-  add(columnId: string): void;
-  /** Remove a column from grouping. Omit `columnId` to clear all grouping. */
-  remove(columnId?: string): void;
-}
-
-/** Density preset. */
-export interface KjDensityApi {
-  get(): KjTableDensity;
-  set(density: KjTableDensity): void;
-}
-
-/**
- * Per-column operations + bulk column state. Mirrors `KjGridApi`'s shape
- * — each concept (visibility, sizing, pinning, order, grouping) is its
- * own namespace.
- */
-export interface KjColumnApi<TData extends RowData = unknown> {
-  /** Look up a column by id. */
-  get(columnId: string): Column<TData, unknown> | null;
-  /** Every column (leaf + group). */
-  all(): Column<TData, unknown>[];
-  /** Leaf columns only. */
-  leaves(): Column<TData, unknown>[];
-  /** Leaf columns currently visible. */
-  visibleLeaves(): Column<TData, unknown>[];
-
-  /** Column visibility ops. */
-  readonly visibility: KjColumnVisibilityApi;
-  /** Column width/sizing ops. */
-  readonly sizing: KjColumnSizingApi;
-  /** Column pinning ops. */
-  readonly pinning: KjColumnPinningApi;
-  /** Column order ops. */
-  readonly order: KjColumnOrderApi;
-  /** Per-column grouping toggle. */
-  readonly grouping: KjColumnGroupingApi;
-
-  /** Reset visibility, sizing, pinning, order, and grouping in one shot. */
-  reset(): void;
-}
-
-export interface KjColumnVisibilityApi {
-  get(): VisibilityState;
-  set(model: VisibilityState): void;
-  isVisible(columnId: string): boolean;
-  setVisible(columnId: string, visible: boolean): void;
-  setManyVisible(columnIds: readonly string[], visible: boolean): void;
-}
-
-export interface KjColumnSizingApi {
-  get(): ColumnSizingState;
-  set(model: ColumnSizingState): void;
-  width(columnId: string): number;
-  setWidth(columnId: string, width: number): void;
-}
-
-export interface KjColumnPinningApi {
-  get(): ColumnPinningState;
-  set(model: ColumnPinningState): void;
-  of(columnId: string): 'left' | 'right' | null;
-  pin(columnId: string, side: 'left' | 'right' | null): void;
-}
-
-export interface KjColumnOrderApi {
-  get(): ColumnOrderState;
-  set(order: ColumnOrderState): void;
-  move(columnId: string, toIndex: number): void;
-}
-
-export interface KjColumnGroupingApi {
-  is(columnId: string): boolean;
-  set(columnId: string, grouped: boolean): void;
-}

package/src/table/index.ts

@@ -1,73 +0,0 @@
-export { KjTable, KJ_TABLE } from './table';
-export { KjTableHeader, type KjSortDirection } from './table-header';
-export { KjTableRow } from './table-row';
-export { KjTableCell } from './table-cell';
-export { KjTableKeyboardNav } from './table-keyboard';
-export { KjTableFilterOutlet } from './table-filter-outlet';
-export { kjColumn, kjColumnGroup } from './column-helpers';
-export { kjTableResource } from './table-resource';
-export type {
-  KjGridApi,
-  KjColumnApi,
-  KjRowsApi,
-  KjSelectionApi,
-  KjSortApi,
-  KjFilterApi,
-  KjGlobalFilterApi,
-  KjPaginationApi,
-  KjExpansionApi,
-  KjGroupingApi,
-  KjDensityApi,
-  KjColumnVisibilityApi,
-  KjColumnSizingApi,
-  KjColumnPinningApi,
-  KjColumnOrderApi,
-  KjColumnGroupingApi,
-} from './grid-api';
-export {
-  provideKjFilterParams,
-  injectKjFilterParams,
-  type KjFilterParams,
-  type KjFilterRenderer,
-} from './filter-params';
-export {
-  isKjFilterModel,
-  type KjFilterModel,
-  type KjGridFilterModel,
-  type KjTextFilterModel,
-  type KjTextFilterType,
-  type KjNumberFilterModel,
-  type KjNumberFilterType,
-  type KjDateFilterModel,
-  type KjDateFilterType,
-  type KjSetFilterModel,
-  type KjMultiConditionFilterModel,
-} from './filter-models';
-export {
-  kjTextFilterFn,
-  kjNumberFilterFn,
-  kjDateFilterFn,
-  kjSetFilterFn,
-  kjMultiFilterFn,
-} from './filter-fns';
-export {
-  KJ_TABLE_STORAGE,
-  inMemoryAdapter,
-  localStorageAdapter,
-  sessionStorageAdapter,
-  provideKjTableStorage,
-  type KjStorageAdapter,
-} from './table-storage';
-export type {
-  KjColumnType,
-  KjColumnPin,
-  KjAggregationKind,
-  KjAggregationFn,
-  KjAggregation,
-  KjEditorRef,
-  KjFilterUiRef,
-  KjColumnMeta,
-  KjColumnDef,
-  KjTableState,
-  KjResourceResult,
-} from './table.types';

package/src/table/table-cell.spec.ts

@@ -1,43 +0,0 @@
-import { Component, signal, ChangeDetectionStrategy } from '@angular/core';
-import { render } from '@testing-library/angular';
-import { describe, expect, it } from 'vitest';
-import { KjTable } from './table';
-import { KjTableRow } from './table-row';
-import { KjTableCell } from './table-cell';
-import { kjColumn } from './column-helpers';
-
-interface Row {
-  name: string;
-}
-
-@Component({
-  standalone: true,
-  imports: [KjTable, KjTableRow, KjTableCell],
-  changeDetection: ChangeDetectionStrategy.Eager,
-  template: `
-    <table [kjTable]="cols" [kjTableData]="data()" #t="kjTable">
-      <tbody>
-        @for (r of t.table().getRowModel().rows; track r.id) {
-          <tr kjTableRow [kjRow]="r">
-            @for (c of r.getVisibleCells(); track c.id) {
-              <td kjTableCell [kjCell]="c">{{ c.getValue() }}</td>
-            }
-          </tr>
-        }
-      </tbody>
-    </table>
-  `,
-})
-class Host {
-  protected readonly cols = [kjColumn<Row>({ accessorKey: 'name', header: 'Name' })];
-  protected readonly data = signal<Row[]>([{ name: 'A' }]);
-}
-
-describe('KjTableCell', () => {
-  it('sets role="gridcell" and aria-colindex', async () => {
-    const { container } = await render(Host);
-    const td = container.querySelector('tbody td') as HTMLElement;
-    expect(td.getAttribute('role')).toBe('gridcell');
-    expect(td.getAttribute('aria-colindex')).toBe('1');
-  });
-});

package/src/table/table-cell.ts

@@ -1,38 +0,0 @@
-import { Directive, ElementRef, computed, inject, input } from '@angular/core';
-import type { RowData, Table } from '@tanstack/angular-table';
-
-type Cell<T> = ReturnType<Table<T>['getRowModel']>['rows'][number]['getVisibleCells'] extends () => infer R
-  ? R extends Array<infer C> ? C : never : never;
-
-@Directive({
-  selector: '[kjTableCell]',
-  standalone: true,
-  host: {
-    'role': 'gridcell',
-    '[attr.aria-colindex]': 'ariaColIndex()',
-    '[attr.data-pin]': 'pin()',
-  },
-})
-export class KjTableCell<TData extends RowData = unknown> {
-  /** TanStack cell instance — pass from row.getVisibleCells(). */
-  kjCell = input.required<Cell<TData>>();
-
-  private readonly elementRef: ElementRef<HTMLElement> = inject(ElementRef);
-
-  /** Public host element handle — used by `KjTableKeyboardNav` to focus cells. */
-  get hostElement(): HTMLElement {
-    return this.elementRef.nativeElement;
-  }
-
-  /** 1-based ARIA index for the column. */
-  readonly ariaColIndex = computed(() => {
-    const cell = this.kjCell() as { column?: { getIndex?: () => number } };
-    const idx = cell.column?.getIndex?.();
-    return idx != null ? idx + 1 : null;
-  });
-
-  readonly pin = computed(() => {
-    const cell = this.kjCell() as { column?: { getIsPinned?: () => unknown } };
-    return cell.column?.getIsPinned?.() ?? null;
-  });
-}