@rebasepro/ui 0.6.0 → 0.7.0

package/dist/src/index.css

@@ -65,51 +65,51 @@
 }
 
 .typography-h1 {
-    @apply text-6xl font-headers font-light tracking-tight;
+    @apply text-4xl font-headers font-semibold tracking-tight;
 }
 
 .typography-h2 {
-    @apply text-5xl font-headers font-light tracking-tight;
+    @apply text-3xl font-headers font-semibold tracking-tight;
 }
 
 .typography-h3 {
-    @apply text-4xl font-headers font-normal tracking-tight;
+    @apply text-2xl font-headers font-semibold tracking-tight;
 }
 
 .typography-h4 {
-    @apply text-3xl font-headers font-normal tracking-tight;
+    @apply text-xl font-headers font-semibold tracking-[-0.01em];
 }
 
 .typography-h5 {
-    @apply text-2xl font-headers font-normal;
+    @apply text-lg font-headers font-semibold tracking-[-0.01em];
 }
 
 .typography-h6 {
-    @apply text-xl font-headers font-normal;
+    @apply text-base font-headers font-semibold tracking-[-0.01em];
 }
 
 .typography-subtitle1 {
-    @apply text-lg font-headers font-medium;
+    @apply text-sm font-headers font-semibold tracking-[-0.01em];
 }
 
 .typography-subtitle2 {
-    @apply text-base font-headers font-medium;
+    @apply text-sm font-headers font-medium;
 }
 
 .typography-body1 {
-    @apply text-base;
+    @apply text-sm;
 }
 
 .typography-body2 {
-    @apply text-sm;
+    @apply text-xs;
 }
 
 .typography-caption {
-    @apply text-xs;
+    @apply text-[11px] leading-[1.4];
 }
 
 .typography-label {
-    @apply text-sm font-medium;
+    @apply text-xs font-medium tracking-wide;
 }
 
 .typography-inherit {
@@ -117,7 +117,7 @@
 }
 
 .typography-button {
-    @apply text-sm font-semibold;
+    @apply text-sm font-semibold tracking-wide;
 }
 
 :focus-visible {

package/dist/styles.d.ts

@@ -1,12 +1,12 @@
 export declare const focusedDisabled = "focus-visible:ring-0 focus-visible:ring-offset-0";
 export declare const focusedInvisibleMixin = "focus:bg-opacity-70 focus:bg-surface-accent-100 focus:dark:bg-surface-900 focus:dark:bg-opacity-60 focus:bg-surface-accent-100/70 dark:focus:bg-surface-900/60";
-export declare const focusedClasses = "z-30 outline-hidden outline-none ring-2 ring-primary ring-opacity-75 ring-primary/75 ring-offset-0 ring-offset-transparent ";
-export declare const fieldBackgroundMixin = "bg-opacity-50 bg-surface-accent-200 bg-surface-accent-200/50 dark:bg-surface-900 dark:bg-opacity-100 dark:bg-surface-900/100";
-export declare const fieldBackgroundInvisibleMixin = "bg-opacity-0 bg-surface-accent-100 dark:bg-surface-900 dark:bg-opacity-0 bg-surface-accent-200/0 dark:bg-surface-900/0";
-export declare const fieldBackgroundDisabledMixin = "dark:bg-surface-900 bg-opacity-50 dark:bg-opacity-90 bg-surface-accent-200/50 dark:bg-surface-900/90";
-export declare const fieldBackgroundHoverMixin = "hover:bg-opacity-70 dark:hover:bg-surface-700 dark:hover:bg-opacity-40 hover:bg-surface-accent-200/70 hover:dark:bg-surface-700/40";
-export declare const defaultBorderMixin = "border-surface-200/60 dark:border-surface-700/60 ";
-export declare const paperMixin = "bg-white rounded-md dark:bg-surface-800 border border-surface-200/60 dark:border-surface-700/60";
-export declare const cardMixin = "bg-white dark:bg-surface-900 rounded-md border border-surface-200/60 dark:border-surface-700/60 m-1 -p-1";
-export declare const cardClickableMixin = "hover:bg-surface-accent-100 dark:hover:bg-surface-800 hover:ring-1 hover:ring-primary/50 hover:shadow-sm cursor-pointer hover:bg-primary/10 dark:hover:bg-primary/10 transition-all duration-150";
+export declare const focusedClasses = "z-30 outline-hidden outline-none ring-2 ring-primary ring-opacity-50 ring-primary/50 ring-offset-0 ring-offset-transparent ";
+export declare const fieldBackgroundMixin = "bg-surface-accent-200/50 dark:bg-black/30";
+export declare const fieldBackgroundInvisibleMixin = "bg-surface-accent-200/0 dark:bg-black/0";
+export declare const fieldBackgroundDisabledMixin = "bg-surface-accent-200/50 dark:bg-black/20";
+export declare const fieldBackgroundHoverMixin = "hover:bg-surface-accent-200/70 hover:dark:bg-black/50";
+export declare const defaultBorderMixin = "border-surface-200 dark:border-surface-700/60 ";
+export declare const paperMixin = "bg-white rounded-lg dark:bg-surface-900 border border-surface-200 dark:border-surface-700";
+export declare const cardMixin = "bg-white dark:bg-surface-900 rounded-lg border border-surface-200 dark:border-surface-700";
+export declare const cardClickableMixin = "hover:bg-primary/5 dark:hover:bg-primary/5 cursor-pointer transition-colors duration-150";
 export declare const cardSelectedMixin = "bg-primary-bg/30 dark:bg-primary-bg/10 ring-1 ring-primary/75";

package/dist/views/CardView.d.ts

@@ -0,0 +1,32 @@
+import React from "react";
+import { CollectionSize } from "./ListView";
+export type CardViewProps<T> = {
+    data: T[];
+    dataLoading?: boolean;
+    noMoreToLoad?: boolean;
+    dataLoadingError?: Error;
+    itemCount?: number;
+    setItemCount?: (itemCount: number) => void;
+    pageSize?: number;
+    paginationEnabled?: boolean;
+    onItemClick?: (item: T) => void;
+    selectedIds?: Set<string | number>;
+    highlightedIds?: Set<string | number>;
+    selectionEnabled?: boolean;
+    onSelectionChange?: (item: T, selected: boolean) => void;
+    onScroll?: (props: {
+        scrollDirection: "forward" | "backward";
+        scrollOffset: number;
+        scrollUpdateWasRequested: boolean;
+    }) => void;
+    initialScroll?: number;
+    size?: CollectionSize;
+    renderCard: (item: T, extra: {
+        selected: boolean;
+        highlighted: boolean;
+        onSelectionChange: (selected: boolean) => void;
+        onClick: (e: React.MouseEvent) => void;
+    }) => React.ReactNode;
+    emptyComponent?: React.ReactNode;
+};
+export declare function CardView<T>({ data, dataLoading, noMoreToLoad, dataLoadingError, itemCount, setItemCount, pageSize, paginationEnabled, onItemClick, selectedIds, highlightedIds, selectionEnabled, onSelectionChange, onScroll, initialScroll, size, renderCard, emptyComponent }: CardViewProps<T>): React.JSX.Element;

package/dist/views/CollectionView/CollectionCardView.d.ts

@@ -0,0 +1,30 @@
+import React from "react";
+import type { CollectionPropertyConfig, CollectionDataController, CellRendererOverride, CollectionViewSize, CollectionSelectionController } from "./CollectionViewTypes";
+/**
+ * Props for the {@link CollectionCardView} component.
+ * @group Collection View
+ */
+export type CollectionCardViewProps<T = Record<string, unknown>> = {
+    dataController: CollectionDataController<T>;
+    properties: Record<string, CollectionPropertyConfig>;
+    propertiesOrder?: string[];
+    idProperty?: string;
+    titleProperty?: string;
+    onRowClick?: (row: T) => void;
+    cellRenderer?: CellRendererOverride<T>;
+    size?: CollectionViewSize;
+    selectionEnabled?: boolean;
+    selectionController?: CollectionSelectionController<T>;
+    highlightedItems?: T[];
+    emptyComponent?: React.ReactNode;
+    className?: string;
+};
+/**
+ * Headless card grid view that wraps {@link CardView}.
+ *
+ * Renders each item as a card with an optional image, title,
+ * preview properties, and selection support.
+ *
+ * @group Collection View
+ */
+export declare function CollectionCardView<T extends Record<string, unknown> = Record<string, unknown>>({ dataController, properties, propertiesOrder, idProperty, titleProperty, onRowClick, cellRenderer, size, selectionEnabled, selectionController, highlightedItems, emptyComponent, className, }: CollectionCardViewProps<T>): React.JSX.Element;

package/dist/views/CollectionView/CollectionKanbanView.d.ts

@@ -0,0 +1,31 @@
+import React from "react";
+import type { CollectionPropertyConfig, CollectionDataController, CellRendererOverride, CollectionSelectionController } from "./CollectionViewTypes";
+/**
+ * Props for the {@link CollectionKanbanView} component.
+ * @group Collection View
+ */
+export type CollectionKanbanViewProps<T = Record<string, unknown>> = {
+    dataController: CollectionDataController<T>;
+    properties: Record<string, CollectionPropertyConfig>;
+    propertiesOrder?: string[];
+    idProperty?: string;
+    titleProperty?: string;
+    kanbanProperty: string;
+    onRowClick?: (row: T) => void;
+    cellRenderer?: CellRendererOverride<T>;
+    selectionEnabled?: boolean;
+    selectionController?: CollectionSelectionController<T>;
+    highlightedItems?: T[];
+    emptyComponent?: React.ReactNode;
+    onRowCreate?: (defaults?: Record<string, unknown>) => void;
+    className?: string;
+};
+/**
+ * Headless kanban view that wraps {@link KanbanView}.
+ *
+ * Groups data by a kanban property's enum values into columns.
+ * Each card displays a title and 1–2 preview properties.
+ *
+ * @group Collection View
+ */
+export declare function CollectionKanbanView<T extends Record<string, unknown> = Record<string, unknown>>({ dataController, properties, propertiesOrder, idProperty, titleProperty, kanbanProperty, onRowClick, cellRenderer, emptyComponent, onRowCreate, className, }: CollectionKanbanViewProps<T>): React.JSX.Element;

package/dist/views/CollectionView/CollectionListView.d.ts

@@ -0,0 +1,30 @@
+import React from "react";
+import type { CollectionPropertyConfig, CollectionDataController, CellRendererOverride, CollectionViewSize, CollectionSelectionController } from "./CollectionViewTypes";
+/**
+ * Props for the {@link CollectionListView} component.
+ * @group Collection View
+ */
+export type CollectionListViewProps<T = Record<string, unknown>> = {
+    dataController: CollectionDataController<T>;
+    properties: Record<string, CollectionPropertyConfig>;
+    propertiesOrder?: string[];
+    idProperty?: string;
+    titleProperty?: string;
+    onRowClick?: (row: T) => void;
+    cellRenderer?: CellRendererOverride<T>;
+    size?: CollectionViewSize;
+    selectionEnabled?: boolean;
+    selectionController?: CollectionSelectionController<T>;
+    highlightedItems?: T[];
+    emptyComponent?: React.ReactNode;
+    className?: string;
+};
+/**
+ * Headless list view that wraps {@link ListView}.
+ *
+ * Each row displays a title (bold), subtitle with 1–2 secondary property values,
+ * and optional selection support.
+ *
+ * @group Collection View
+ */
+export declare function CollectionListView<T extends Record<string, unknown> = Record<string, unknown>>({ dataController, properties, propertiesOrder, idProperty, titleProperty, onRowClick, cellRenderer, size, selectionEnabled, selectionController, highlightedItems, emptyComponent, className, }: CollectionListViewProps<T>): React.JSX.Element;

package/dist/views/CollectionView/CollectionTableView.d.ts

@@ -0,0 +1,37 @@
+import React from "react";
+import type { CollectionPropertyConfig, CollectionDataController, CellRendererOverride, CollectionViewSize, CollectionSelectionController } from "./CollectionViewTypes";
+/**
+ * Props for the {@link CollectionTableView} component.
+ * @group Collection View
+ */
+export type CollectionTableViewProps<T = Record<string, unknown>> = {
+    dataController: CollectionDataController<T>;
+    properties: Record<string, CollectionPropertyConfig>;
+    propertiesOrder?: string[];
+    displayedColumnIds?: string[];
+    idProperty?: string;
+    titleProperty?: string;
+    onRowClick?: (row: T) => void;
+    cellRenderer?: CellRendererOverride<T>;
+    size?: CollectionViewSize;
+    selectionEnabled?: boolean;
+    selectionController?: CollectionSelectionController<T>;
+    highlightedItems?: T[];
+    emptyComponent?: React.ReactNode;
+    hoverRow?: boolean;
+    className?: string;
+    onColumnResize?: (params: {
+        key: string;
+        width: number;
+    }) => void;
+    onColumnsOrderChange?: (keys: string[]) => void;
+};
+/**
+ * Headless table view that wraps {@link VirtualTable}.
+ *
+ * Converts property configurations into virtual table columns and wires up
+ * sorting, pagination, and cell rendering without coupling to any data layer.
+ *
+ * @group Collection View
+ */
+export declare function CollectionTableView<T extends Record<string, unknown> = Record<string, unknown>>({ dataController, properties, propertiesOrder, displayedColumnIds, onRowClick, cellRenderer, size, emptyComponent, hoverRow, className, onColumnResize, onColumnsOrderChange, }: CollectionTableViewProps<T>): React.JSX.Element;

package/dist/views/CollectionView/CollectionView.d.ts

@@ -0,0 +1,121 @@
+import React from "react";
+import type { CollectionViewMode, CollectionViewSize, CollectionPropertyConfig, CollectionDataController, CellRendererOverride, CollectionSelectionController, KanbanPropertyOption } from "./CollectionViewTypes";
+/**
+ * Props for the headless {@link CollectionView} component.
+ *
+ * This component is data-agnostic — it renders collection data based on
+ * property configurations and callbacks, with ZERO coupling to any entity
+ * or data layer.
+ *
+ * @group Collection View
+ */
+export interface CollectionViewProps<T = Record<string, unknown>> {
+    /**
+     * Data controller providing rows, loading state, pagination,
+     * filter/sort/search state and setters.
+     */
+    dataController: CollectionDataController<T>;
+    /**
+     * Property definitions keyed by property key.
+     * Drives column rendering, cell formatting, and filter UI.
+     */
+    properties: Record<string, CollectionPropertyConfig>;
+    /**
+     * Display order of properties. If omitted, uses Object.keys(properties).
+     */
+    propertiesOrder?: string[];
+    /**
+     * Subset of property keys to actually display as columns.
+     * If omitted, all non-hidden properties are shown.
+     */
+    displayedColumnIds?: string[];
+    /** Property key used as row identifier. Default: "id" */
+    idProperty?: string;
+    /** Property key used as the display title in card/list views */
+    titleProperty?: string;
+    /** Title displayed above the collection. `false` to hide. */
+    title?: string | false;
+    /** Controlled view mode. If omitted, internal state is used. */
+    viewMode?: CollectionViewMode;
+    /** Default view mode when uncontrolled. Default: "list" */
+    defaultViewMode?: CollectionViewMode;
+    /** Which view modes are available in the toggle */
+    enabledViews?: CollectionViewMode[];
+    /** Callback when view mode changes */
+    onViewModeChange?: (mode: CollectionViewMode) => void;
+    /** Controlled size. If omitted, internal state is used. */
+    size?: CollectionViewSize;
+    /** Default size. Default: "m" */
+    defaultSize?: CollectionViewSize;
+    /** Callback when size changes */
+    onSizeChange?: (size: CollectionViewSize) => void;
+    /** Property key for kanban column grouping */
+    kanbanProperty?: string;
+    /** Available kanban property options (shown in view toggle) */
+    kanbanPropertyOptions?: KanbanPropertyOption[];
+    /** Callback when kanban column property changes */
+    onKanbanPropertyChange?: (property: string) => void;
+    /** Called when a row is clicked */
+    onRowClick?: (row: T) => void;
+    /** Called when the "create" button is clicked */
+    onRowCreate?: (defaults?: Record<string, unknown>) => void;
+    /** Whether creation is allowed (shows the + button) */
+    canCreate?: boolean;
+    /** Enable row selection checkboxes */
+    selectionEnabled?: boolean;
+    /** Selection controller */
+    selectionController?: CollectionSelectionController<T>;
+    /** Highlighted items (e.g. recently clicked) */
+    highlightedItems?: T[];
+    /** Callback for bulk delete */
+    onMultipleDelete?: (rows: T[]) => void;
+    /**
+     * Custom cell renderer override. Return undefined to use default.
+     * This is how the connected wrapper injects PropertyPreview.
+     */
+    cellRenderer?: CellRendererOverride<T>;
+    /** Custom empty state component */
+    emptyComponent?: React.ReactNode;
+    /** Actions rendered at the start (left) of the toolbar */
+    toolbarActionsStart?: React.ReactNode;
+    /** Actions rendered at the end (right) of the toolbar */
+    toolbarActionsEnd?: React.ReactNode;
+    /** Hide the built-in toolbar entirely */
+    hideToolbar?: boolean;
+    /** Enable row hover highlight in table view */
+    hoverRow?: boolean;
+    /** Callback when table columns are resized */
+    onColumnResize?: (params: {
+        key: string;
+        width: number;
+    }) => void;
+    /** Callback when table columns are reordered */
+    onColumnsOrderChange?: (keys: string[]) => void;
+    /** CSS class for the outer container */
+    className?: string;
+}
+/**
+ * A data-agnostic collection view component that orchestrates table, card,
+ * list, and kanban views — driven entirely by props.
+ *
+ * Zero imports from any entity or data layer. This component lives in
+ * `@rebasepro/ui` and can be used with any data source.
+ *
+ * @example
+ * ```tsx
+ * import { CollectionView } from "@rebasepro/ui";
+ *
+ * <CollectionView
+ *     dataController={{ data: myRows, loading: false, noMoreToLoad: true }}
+ *     properties={{
+ *         name: { type: "string", name: "Name" },
+ *         email: { type: "string", name: "Email" },
+ *     }}
+ *     title="Contacts"
+ *     onRowClick={(row) => openDetail(row.id)}
+ * />
+ * ```
+ *
+ * @group Collection View
+ */
+export declare function CollectionView<T extends Record<string, unknown> = Record<string, unknown>>({ dataController, properties, propertiesOrder, displayedColumnIds, idProperty, titleProperty, title, viewMode: viewModeProp, defaultViewMode, enabledViews, onViewModeChange: onViewModeChangeProp, size: sizeProp, defaultSize, onSizeChange: onSizeChangeProp, kanbanProperty: kanbanPropertyProp, kanbanPropertyOptions, onKanbanPropertyChange: onKanbanPropertyChangeProp, onRowClick, onRowCreate, canCreate, selectionEnabled, selectionController, highlightedItems, onMultipleDelete, cellRenderer, emptyComponent, toolbarActionsStart, toolbarActionsEnd, hideToolbar, hoverRow, onColumnResize, onColumnsOrderChange, className }: CollectionViewProps<T>): React.JSX.Element;

package/dist/views/CollectionView/CollectionViewToolbar.d.ts

@@ -0,0 +1,31 @@
+import React from "react";
+import type { CollectionViewMode, CollectionViewSize, KanbanPropertyOption } from "./CollectionViewTypes";
+/**
+ * Props for the {@link CollectionViewToolbar} component.
+ * @group Collection View
+ */
+export type CollectionViewToolbarProps = {
+    viewMode: CollectionViewMode;
+    onViewModeChange?: (mode: CollectionViewMode) => void;
+    enabledViews?: CollectionViewMode[];
+    size?: CollectionViewSize;
+    onSizeChange?: (size: CollectionViewSize) => void;
+    searchString?: string;
+    onSearchChange?: (search?: string) => void;
+    loading?: boolean;
+    actionsStart?: React.ReactNode;
+    actionsEnd?: React.ReactNode;
+    compact?: boolean;
+    kanbanPropertyOptions?: KanbanPropertyOption[];
+    selectedKanbanProperty?: string;
+    onKanbanPropertyChange?: (property: string) => void;
+};
+/**
+ * Toolbar for the headless CollectionView.
+ *
+ * Renders a search bar, view mode toggle (popover with toggle button group),
+ * optional size selector, optional kanban property selector, and action slots.
+ *
+ * @group Collection View
+ */
+export declare function CollectionViewToolbar({ viewMode, onViewModeChange, enabledViews, size, onSizeChange, searchString, onSearchChange, loading, actionsStart, actionsEnd, compact, kanbanPropertyOptions, selectedKanbanProperty, onKanbanPropertyChange, }: CollectionViewToolbarProps): React.JSX.Element;

package/dist/views/CollectionView/CollectionViewTypes.d.ts

@@ -0,0 +1,106 @@
+import React from "react";
+/** Supported view modes */
+export type CollectionViewMode = "table" | "cards" | "kanban" | "list";
+/** Supported collection sizes */
+export type CollectionViewSize = "xs" | "s" | "m" | "l" | "xl";
+/**
+ * Enum value configuration.
+ * Simple form: string label
+ * Extended form: object with label + optional color + disabled
+ */
+export type CollectionEnumValueConfig = string | {
+    label: string;
+    color?: string;
+    disabled?: boolean;
+};
+/**
+ * A data-agnostic property definition for rendering columns/cells.
+ * This is a UI-only type — it describes HOW to render, not WHERE data lives.
+ *
+ * This shape is deliberately compatible with Rebase's Property type,
+ * so the connected wrapper can pass properties with minimal mapping.
+ */
+export interface CollectionPropertyConfig {
+    /** Property data type — determines how cells are rendered */
+    type: "string" | "number" | "boolean" | "date" | "array" | "map" | "reference" | "relation" | "geopoint";
+    /** Display name shown in column headers and card labels */
+    name: string;
+    /** Optional description, shown as tooltip on column header */
+    description?: string;
+    /** Column width in pixels */
+    columnWidth?: number;
+    /** If true, this property is not shown in collection views */
+    hideFromCollection?: boolean;
+    /** Map of value → label/config for enum properties */
+    enum?: Record<string, CollectionEnumValueConfig> | Map<string | number, CollectionEnumValueConfig>;
+    multiline?: boolean;
+    previewAsTag?: boolean;
+    url?: boolean | string;
+    markdown?: boolean;
+    storage?: boolean;
+    email?: boolean;
+    of?: CollectionPropertyConfig;
+    properties?: Record<string, CollectionPropertyConfig>;
+    propertiesOrder?: string[];
+    mode?: "date" | "date_time";
+    /** Custom preview component for this property */
+    Preview?: React.ComponentType<CellRendererProps>;
+}
+/**
+ * Data controller interface — the headless view reads data and state through this.
+ * Consumer apps can build their own implementation.
+ */
+export interface CollectionDataController<T = Record<string, unknown>> {
+    data: T[];
+    loading: boolean;
+    noMoreToLoad: boolean;
+    error?: Error;
+    filterValues?: Record<string, [string, unknown]>;
+    setFilterValues?: (values: Record<string, [string, unknown]> | undefined) => void;
+    sortBy?: [string, "asc" | "desc"];
+    setSortBy?: (sort?: [string, "asc" | "desc"]) => void;
+    searchString?: string;
+    setSearchString?: (search?: string) => void;
+    clearFilter?: () => void;
+    initialScroll?: number;
+    onScroll?: (props: {
+        scrollDirection: "forward" | "backward";
+        scrollOffset: number;
+        scrollUpdateWasRequested: boolean;
+    }) => void;
+    paginationEnabled?: boolean;
+    pageSize?: number;
+    itemCount?: number;
+    setItemCount?: (count: number) => void;
+}
+/**
+ * Props passed to cell renderers.
+ */
+export interface CellRendererProps<T = Record<string, unknown>> {
+    row: T;
+    propertyKey: string;
+    property: CollectionPropertyConfig;
+    value: unknown;
+    size?: "small" | "medium" | "large" | "tiny";
+    width?: number;
+    height?: number;
+}
+/**
+ * Custom cell renderer function type.
+ * Return undefined to fall through to the default renderer.
+ */
+export type CellRendererOverride<T = Record<string, unknown>> = (props: CellRendererProps<T>) => React.ReactNode | undefined;
+/**
+ * Selection controller for the headless view.
+ */
+export interface CollectionSelectionController<T = Record<string, unknown>> {
+    selectedItems: T[];
+    setSelectedItems: React.Dispatch<React.SetStateAction<T[]>>;
+}
+/**
+ * Kanban property option for the view mode toggle.
+ */
+export interface KanbanPropertyOption {
+    key: string;
+    label: string;
+}

package/dist/views/CollectionView/DefaultCellRenderer.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import type { CellRendererProps } from "./CollectionViewTypes";
+/**
+ * Default cell renderer for the headless CollectionView.
+ * Handles all built-in property types without depending on any Rebase core types.
+ *
+ * @group Preview components
+ */
+export declare function DefaultCellRenderer({ row, propertyKey, property, value, size, width, height }: CellRendererProps): React.JSX.Element;

package/dist/views/CollectionView/index.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Headless Collection View components.
+ *
+ * Data-agnostic collection rendering — table, card, list, and kanban views
+ * driven entirely by property configurations and callbacks.
+ *
+ * Zero imports from any entity or data layer.
+ *
+ * @module CollectionView
+ */
+export type { CollectionViewMode, CollectionViewSize, CollectionEnumValueConfig, CollectionPropertyConfig, CollectionDataController, CellRendererProps, CellRendererOverride, CollectionSelectionController, KanbanPropertyOption } from "./CollectionViewTypes";
+export { CollectionView } from "./CollectionView";
+export type { CollectionViewProps } from "./CollectionView";
+export { CollectionViewToolbar } from "./CollectionViewToolbar";
+export type { CollectionViewToolbarProps } from "./CollectionViewToolbar";
+export { CollectionTableView } from "./CollectionTableView";
+export type { CollectionTableViewProps } from "./CollectionTableView";
+export { CollectionCardView } from "./CollectionCardView";
+export type { CollectionCardViewProps } from "./CollectionCardView";
+export { CollectionListView } from "./CollectionListView";
+export type { CollectionListViewProps } from "./CollectionListView";
+export { CollectionKanbanView } from "./CollectionKanbanView";
+export type { CollectionKanbanViewProps } from "./CollectionKanbanView";
+export { DefaultCellRenderer } from "./DefaultCellRenderer";

package/dist/views/CollectionView/utils.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Traverse an object by dot-separated path.
+ * Returns `undefined` if any segment is missing.
+ */
+export declare function getValueInPath(obj: Record<string, unknown> | undefined, path: string): unknown;

package/dist/views/Kanban/Board.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { BoardProps } from "./board_types";
+export declare function Board<T, COLUMN extends string>({ data, columns: columnsProp, columnLabels, columnColors, className, assignColumn, allowColumnReorder, onColumnReorder, onItemsReorder, ItemComponent, columnLoadingState, onLoadMoreColumn, onAddItemToColumn, AddColumnComponent }: BoardProps<T, COLUMN>): React.JSX.Element;

package/dist/views/Kanban/BoardColumn.d.ts

@@ -0,0 +1,20 @@
+import React from "react";
+import { BoardItem, BoardItemViewProps } from "./board_types";
+export interface BoardColumnProps<T> {
+    id: string;
+    title: string;
+    items: BoardItem<T>[];
+    index: number;
+    ItemComponent: React.ComponentType<BoardItemViewProps<T>>;
+    isDragging: boolean;
+    isDragOverColumn: boolean;
+    allowReorder?: boolean;
+    loading?: boolean;
+    hasMore?: boolean;
+    onLoadMore?: () => void;
+    onAddItem?: () => void;
+    totalCount?: number;
+    color?: any;
+    style?: React.CSSProperties;
+}
+export declare const BoardColumn: <T>(props: BoardColumnProps<T>) => React.ReactElement;

package/dist/views/Kanban/BoardColumnTitle.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+export interface BoardColumnTitleProps {
+    children: React.ReactNode;
+    className?: string;
+    "aria-label"?: string;
+    color?: any;
+}
+export declare function BoardColumnTitle({ children, className, color, ...props }: BoardColumnTitleProps): React.JSX.Element;

package/dist/views/Kanban/BoardSortableList.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+import { BoardItem, BoardItemViewProps } from "./board_types";
+interface BoardSortableListProps<T> {
+    columnId: string;
+    items: BoardItem<T>[];
+    ItemComponent: React.ComponentType<BoardItemViewProps<T>>;
+    isDragging: boolean;
+    isDragOverColumn: boolean;
+    loading?: boolean;
+    hasMore?: boolean;
+    onLoadMore?: () => void;
+}
+export declare function BoardSortableList<T>({ columnId, items, ItemComponent, isDragging, isDragOverColumn, loading, hasMore, onLoadMore }: BoardSortableListProps<T>): React.JSX.Element;
+export {};