@protonradio/proton-ui 0.11.0-beta.20 → 0.11.0-beta.21

package/dist/index.d.ts

@@ -10,13 +10,18 @@ import { JSX as JSX_2 } from 'react/jsx-runtime';
 import { OverlayTriggerProps } from 'react-stately';
 import { OverlayTriggerState } from 'react-stately';
 import { PressEvent } from 'react-aria';
+import { ReactElement } from 'react';
 import { ReactNode } from 'react';
 import { RefAttributes } from 'react';
 import { RowProps } from '@react-stately/table';
 import { Section } from '@react-stately/table';
 import { Selection as Selection_2 } from 'react-stately';
 import { TableBodyProps as TableBodyProps_2 } from '@react-stately/table';
+import { TableCellProps as TableCellProps_2 } from './Collection/CompoundComponents';
+import { TableColumnData as TableColumnData_2 } from '../Table';
+import { TableColumnProps as TableColumnProps_2 } from './Collection/CompoundComponents';
 import { TableHeader } from '@react-stately/table';
+import { TableRowProps as TableRowProps_2 } from './Collection/CompoundComponents';
 import { TableStateProps } from 'react-stately';
 import { TooltipProps as TooltipProps_2 } from 'react-aria-components';
 import { TooltipTriggerComponentProps } from 'react-aria-components';
@@ -719,10 +724,11 @@ export declare function Table(props: TableProps_2): JSX_2.Element;
 /**
  * Base Table component that renders data in rows and columns using collections.
  *
- * Accessibility features are built-in:
- * - aria-label is automatically generated from table structure and content
- * - aria-describedby links to caption when provided
- * - Full ARIA table semantics with proper roles and indices
+ * - Built-in keyboard navigation for interactive rows.
+ * - Full ARIA table semantics with proper roles, labels, and indices.
+ *
+ * API:
+ *  - {@link TableProps}
  *
  * @example
  * ```tsx
@@ -738,53 +744,71 @@ export declare function Table(props: TableProps_2): JSX_2.Element;
  * </Table>
  * ```
  */
-export declare const Table2: (({ children, name, className }: TableProps) => JSX_2.Element) & {
+export declare const Table2: (({ children, name }: TableProps) => JSX_2.Element) & {
     /** Table header: {@link TableHeaderProps} */
-    Header: typeof TableHeader_2;
+    Header: ({ ...props }: TableHeaderProps) => any;
     /** Table column: {@link TableColumnProps} */
-    Column: typeof TableColumn;
+    Column: ({ ...props }: TableColumnProps_2) => any;
     /** Table body: {@link TableBodyProps} */
-    Body: typeof TableBody_2;
+    Body: ({ ...props }: TableBodyProps) => any;
     /** Table row: {@link TableRowProps} */
-    Row: typeof TableRow;
+    Row: ({ ...props }: TableRowProps_2) => any;
     /** Table cell: {@link TableCellProps} */
-    Cell: typeof TableCell;
+    Cell: ({ ...props }: TableCellProps_2) => any;
 };
 
 export declare const TableBody: <T = object>(props: ProtonTableBodyProps<T>) => JSX.Element;
 
-declare function TableBody_2({ children }: TableBodyProps): any;
-
 export declare interface TableBodyProps {
-    children: ReactNode;
+    children: TableRowElement | TableRowElement[];
 }
 
-declare function TableCell({ columnKey, children }: TableCellProps): any;
+declare const TableCell: ({ ...props }: TableCellProps) => any;
+
+export declare type TableCellData = {
+    columnKey: string | number;
+    value: ReactNode;
+};
+
+declare type TableCellElement = ReactElement<TableCellProps, typeof TableCell>;
 
 export declare interface TableCellProps {
     columnKey?: string;
     children: ReactNode;
 }
 
-declare function TableColumn({ id, children }: TableColumnProps): any;
+export declare type TableCollection = ReturnType<typeof useTableCollection>;
+
+declare const TableColumn: ({ ...props }: TableColumnProps) => any;
+
+export declare type TableColumnData = {
+    key: string | number;
+    header: ReactNode;
+    isHidden?: boolean;
+};
+
+declare type TableColumnElement = ReactElement<TableColumnProps, typeof TableColumn>;
 
 export declare interface TableColumnProps {
     id: string;
     children: ReactNode;
 }
 
-export { TableHeader }
+export declare type TableData = {
+    columns: TableColumnData[];
+    rows: TableRowData[];
+};
 
-declare function TableHeader_2({ children }: TableHeaderProps): any;
+export { TableHeader }
 
 export declare interface TableHeaderProps {
-    children: ReactNode;
+    children: TableColumnElement | TableColumnElement[];
+    isHidden?: boolean;
 }
 
 declare interface TableProps {
-    children: default_2.ReactNode;
+    children: [ReactElement<TableHeaderProps>, ReactElement<TableBodyProps>];
     name?: string;
-    className?: string;
 }
 
 declare interface TableProps_2 extends AriaTableProps, TableStateProps<object> {
@@ -793,11 +817,20 @@ declare interface TableProps_2 extends AriaTableProps, TableStateProps<object> {
     };
 }
 
-declare function TableRow({ key, children }: TableRowProps): any;
+declare const TableRow: ({ ...props }: TableRowProps) => any;
+
+export declare type TableRowData = {
+    key: string | number;
+    cells: TableCellData[];
+    onClick?: () => void;
+};
+
+declare type TableRowElement = ReactElement<TableRowProps, typeof TableRow>;
 
 export declare interface TableRowProps {
-    key?: string;
-    children: ReactNode;
+    key?: string | number;
+    children: TableCellElement | TableCellElement[];
+    onClick?: () => void;
 }
 
 /**
@@ -989,6 +1022,26 @@ export declare function usePopoverTrigger(props?: OverlayTriggerProps): {
     state: OverlayTriggerState;
 };
 
+/**
+ * Hook for managing table data structure and providing navigation methods
+ */
+export declare function useTableCollection(data: TableData): {
+    columns: TableColumnData_2[];
+    rows: TableRowData[];
+    size: number;
+    firstItem: TableRowData;
+    lastItem: TableRowData;
+    hasHeader: boolean;
+    isHeaderHidden: boolean;
+    hasVisibleHeader: boolean;
+    getTotalRowCount: number;
+    getRowAriaIndex: (rowIndex: number) => number;
+    getItemByKey: (key: string | number) => TableRowData | null;
+    getItemAfter: (key: string | number) => TableRowData | null;
+    getItemBefore: (key: string | number) => TableRowData | null;
+    getItemIndex: (key: string | number) => number;
+};
+
 export declare const useTheme: () => ThemeContextType;
 
 /**