cleanplate 0.3.24 → 0.3.27

package/docs/Table.md

@@ -6,10 +6,11 @@ Purpose: Displays structured data in a table with configurable columns, optional
 
 | Prop | Type | Required | Default | Description |
 | --- | --- | --- | --- | --- |
-| columns | TableColumn[] | yes | — | Column definitions (id, title, textAlign?, widthPercentage?, customRender?). |
+| columns | TableColumn[] | yes | — | Column definitions (id, title, textAlign?, verticalAlign?, widthPercentage?, customRender?). |
 | data | TableRow[] | yes | — | Array of row objects; keys should match column `id`s. |
 | variant | "default" \| "compact" | no | "default" | Visual variant. |
 | margin | string \| SpacingOption[] | no | "0" | Margin spacing. Suffix or array of spacing suffixes; component adds `m-` prefix. |
+| padding | string \| SpacingOption[] | no | "4" | Root padding. Suffix or array of spacing suffixes; component adds `p-` prefix. |
 | className | string | no | "" | Additional class names for the root element. |
 | onRowClick | (rowData: TableRow) => void | no | — | Called when a row is clicked; receives the row object. |
 | totalItems | number | no | 0 | Total item count for built-in Pagination; 0 or omitted hides pagination. |
@@ -20,6 +21,7 @@ Purpose: Displays structured data in a table with configurable columns, optional
 | onPageChange | (page, rowsPerPage) => void | no | — | Called when page changes; receives (page, rowsPerPage). |
 | onRowsPerPageChange | (rowsPerPage: number) => void | no | — | Called when rows per page changes. |
 | hidePagination | boolean | no | false | If true, hides the built-in pagination bar even when totalItems > 0. |
+| cellVerticalAlign | "top" \| "middle" \| "bottom" | no | "top" | Default vertical alignment for header and body cells. |
 | mobileColumns | TableMobileColumns \| null | no | null | When set and viewport < 768px, rows render as MediaObjects; keys map row keys to title, description, media. |
 
 ## Types
@@ -39,11 +41,21 @@ type TableVariant = "default" | "compact";
 type TableMargin = string | SpacingOption[];
 ```
 
+### TablePadding
+```typescript
+type TablePadding = string | SpacingOption[];
+```
+
 ### TableColumnTextAlign
 ```typescript
 type TableColumnTextAlign = "left" | "center" | "right";
 ```
 
+### TableColumnVerticalAlign
+```typescript
+type TableColumnVerticalAlign = "top" | "middle" | "bottom";
+```
+
 ### TableRow
 ```typescript
 type TableRow = Record<string, unknown>;
@@ -55,6 +67,7 @@ interface TableColumn {
   id: string;
   title: string;
   textAlign?: TableColumnTextAlign;
+  verticalAlign?: TableColumnVerticalAlign;
   customRender?: (rowData: TableRow, column: TableColumn) => React.ReactNode;
   widthPercentage?: string;
 }
@@ -93,6 +106,7 @@ interface TableMobileColumns
 interface TableProps {
   variant?: TableVariant;
   margin?: TableMargin;
+  padding?: TablePadding;
   className?: string;
   columns: TableColumn[];
   data: TableRow[];
@@ -105,6 +119,7 @@ interface TableProps {
   onPageChange?: (page: number, rowsPerPage: number) => void;
   onRowsPerPageChange?: (rowsPerPage: number) => void;
   hidePagination?: boolean;
+  cellVerticalAlign?: TableColumnVerticalAlign;
   mobileColumns?: TableMobileColumns | null;
 }
 ```
@@ -203,8 +218,9 @@ const columns = [
 - **Required:** `columns` and `data` are required. Each column must have `id` and `title`; row keys should match `id` for default cell display.
 - **Pagination:** Built-in Pagination is shown when `totalItems` > 0 and `hidePagination` is false. Pass `onPageChange` and optionally `onRowsPerPageChange`; keep `currentPage` and `rowsPerPage` in parent state.
 - **Mobile:** When viewport width < 768px and `mobileColumns` is set, each row renders as a `MediaObject`. Map row keys to `title`, `subtitle`, `description`, `meta`, and media fields (`mediaAvatar`, `mediaAvatarCodeText`, `mediaIcon`, `mediaImage`), or use resolvers / `action` for custom per-row UI. Static MediaObject props (`descriptionLineClamp`, `margin`, `padding`, etc.) pass through unchanged.
+- **Column alignment:** `textAlign` controls horizontal alignment per column. `cellVerticalAlign` sets the table default for vertical alignment; override per column with `verticalAlign` on `TableColumn`.
 - **customRender:** Receives `(rowData, column)` and returns a React node; use for badges, buttons, or any custom cell content.
-- **Spacing:** `margin` uses the suffix API; the component adds the `m-` prefix via `getSpacingClass`.
+- **Spacing:** `margin` and `padding` use the suffix API; the component adds the `m-` and `p-` prefixes via `getSpacingClass`.
 
 ## Related Components / Links
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cleanplate",
-  "version": "0.3.24",
+  "version": "0.3.27",
   "description": "CleanPlate - A Headless React UI Framework",
   "files": [
     "dist",