@coveord/plasma-mantine
Version:
A Plasma flavoured Mantine theme
80 lines (72 loc) • 2.01 kB
text/typescript
import {ReactNode} from 'react';
/**
* Context provided to header render functions
*/
export interface CollectionHeaderContext {
/** Column index */
index: number;
}
/**
* Context provided to cell render functions.
*
* Use `context.disabled` and `context.readOnly` to pass the collection's state to your form inputs:
* @example
* ```tsx
* cell: (item, index, context) => (
* <TextInput
* {...form.getInputProps(`items.${index}.name`)}
* disabled={context.disabled}
* readOnly={context.readOnly}
* />
* )
* ```
*/
// eslint-disable-next-line unused-imports/no-unused-vars
export interface CollectionCellContext<T = unknown> {
/** Whether the item can be removed */
removable?: boolean;
/** Whether the collection is draggable */
draggable?: boolean;
/**
* Whether the collection is disabled.
* Pass this to your form inputs: `disabled={context.disabled}`
*/
disabled?: boolean;
/**
* Whether the collection is read-only.
* Pass this to your form inputs: `readOnly={context.readOnly}`
*/
readOnly?: boolean;
/** Callback to remove the item */
onRemove?: () => void;
}
/**
* Column definition for Collection component
*/
export interface CollectionColumnDef<T = unknown> {
/**
* Column header content
* Can be a ReactNode or a function that receives header context
*/
header?: ReactNode | ((context: CollectionHeaderContext) => ReactNode);
/**
* Cell render function
* @param item The current item's data
* @param index The current item's index
* @param context Additional context for rendering
*/
cell: (item: T, index: number, context: CollectionCellContext<T>) => ReactNode;
/**
* Minimum column size
*/
minSize?: string | number;
/**
* Maximum column size
*/
maxSize?: string | number;
/**
* Unique identifier for the column
* Auto-generated if not provided
*/
id?: string;
}