@pk-design/react-tailwind 1.7.2 → 1.8.0

package/dist/types/components/Button/Button.types.d.ts

@@ -99,6 +99,11 @@ export interface ButtonBaseProps {
      * @default false
      */
     noOutlineOnFocus?: boolean;
+    /**
+     * Indicates active toggle state (applies aria-pressed).
+     * @default false
+     */
+    active?: boolean;
     /**
      * Additional classNames merged with the computed classes.
      */

package/dist/types/components/CheckboxGroup/CheckboxGroup.types.d.ts

@@ -101,7 +101,15 @@ export interface CheckboxGroupProps<T = any> {
      */
     helperText?: ReactNode;
     /**
-     * Disable all checkboxes in the group.
+     * Disables all checkboxes in the group
      */
     disabled?: boolean;
+    /**
+     * Marks the field as required.
+     */
+    required?: boolean;
+    /**
+     * Custom aria-describedby attribute.
+     */
+    'aria-describedby'?: string;
 }

package/dist/types/components/DataList/DataList.d.ts

@@ -1,5 +1,5 @@
 import type { DataListProps } from './DataList.types';
-export declare function DataList<T extends Record<string, any> = Record<string, any>>({ items, columns, renderItem, searchable, searchQuery: externalSearchQuery, onSearchChange, searchFields, filterFields, selectedFilters: externalFilters, onFilterChange, sorting: externalSorting, onSortChange, swipeableActions, rowKey, selectable, selectedKeys, onSelectionChange, onItemClick, loading, emptyMessage, pagination, setPagination, containerClass, itemClass, }: DataListProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare function DataList<T extends Record<string, any> = Record<string, any>>({ items, columns, renderItem, searchable, searchQuery: externalSearchQuery, onSearchChange, searchFields, filterFields, selectedFilters: externalFilters, onFilterChange, sorting: externalSorting, onSortChange, swipeableActions, rowKey, selectable, selectedKeys, onSelectionChange, onItemClick, loading, emptyMessage, pagination, setPagination, paginationClass, paginationContainerClass, paginationProps, renderPagination, containerClass, itemClass, }: DataListProps<T>): import("react/jsx-runtime").JSX.Element;
 export declare namespace DataList {
     var displayName: string;
 }

package/dist/types/components/DataList/DataList.types.d.ts

@@ -74,6 +74,14 @@ export interface DataListProps<T = any> {
     pagination?: TPagination;
     /** Pagination setter */
     setPagination?: (pagination: Partial<TPagination>) => void;
+    /** Extra CSS classes for the pagination container wrapper */
+    paginationClass?: string;
+    /** Extra CSS classes for the pagination container wrapper (alias for paginationClass) */
+    paginationContainerClass?: string;
+    /** Additional props passed directly to the internal Pagination component */
+    paginationProps?: Record<string, any>;
+    /** Custom renderer function for pagination */
+    renderPagination?: (pagination: TPagination, setPagination?: (pagination: Partial<TPagination>) => void) => ReactNode;
     /** Outer container class */
     containerClass?: string;
     /** Item card wrapper class */

package/dist/types/components/DataTable/DataTable.d.ts

@@ -1,5 +1,5 @@
 import type { DataTableProps } from './DataTable.types';
-export declare function DataTable<T extends Record<string, any> = Record<string, any>>({ items, columns, sorting, onSort, loading, pagination, setPagination, emptyMessage, containerClass, wrapperClass, tableClass, headClass, footerRow, rowKey, onRowClick, rowClass, density, striped, layout, selectable, selectedRowKeys, defaultSelectedRowKeys, onSelectionChange, isRowSelectable, stickyHeader, stickyPagination, paginationContainerClass, }: DataTableProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare function DataTable<T extends Record<string, any> = Record<string, any>>({ items, columns, sorting, onSort, loading, pagination, setPagination, emptyMessage, containerClass, wrapperClass, tableClass, headClass, footerRow, rowKey, onRowClick, rowClass, density, striped, layout, selectable, selectedRowKeys, defaultSelectedRowKeys, onSelectionChange, isRowSelectable, stickyHeader, stickyPagination, rowHoverActions, renderRowHoverActions, rowHoverActionHeader, rowHoverActionMode, rowHoverActionClass, paginationClass, paginationContainerClass, paginationProps, renderPagination, }: DataTableProps<T>): import("react/jsx-runtime").JSX.Element;
 export declare namespace DataTable {
     var displayName: string;
 }

package/dist/types/components/DataTable/DataTable.types.d.ts

@@ -1,5 +1,6 @@
 import type { ReactNode } from 'react';
 import type { TPagination } from '../Pagination';
+import type { ButtonTheme, ButtonVariant } from '../Button';
 /**
  * Allowed column value data types.
  * Used only to influence sorting logic.
@@ -17,6 +18,29 @@ export type SortQuery = Record<string, Sorting>;
  * @default 'default'
  */
 export type DataTableDensity = 'compact' | 'default' | 'spacious';
+/**
+ * Single row hover action item definition.
+ */
+export interface DataTableRowAction<T = any> {
+    /** Unique action identifier */
+    id: string;
+    /** Display text or React node */
+    label?: ReactNode;
+    /** Icon rendered inside or before action button */
+    icon?: ReactNode;
+    /** Button color theme palette (@default "secondary") */
+    theme?: ButtonTheme;
+    /** Button visual variant style (@default "plain") */
+    variant?: ButtonVariant;
+    /** Action click callback handler */
+    onClick: (item: T, index: number, event: React.MouseEvent) => void;
+    /** Disables the action button */
+    disabled?: boolean | ((item: T) => boolean);
+    /** Tooltip or title text attribute */
+    title?: string;
+    /** Custom CSS classes for the action button */
+    className?: string;
+}
 /**
  * Column definition for DataTable.
  * @template T Shape of each data row
@@ -138,5 +162,27 @@ export interface DataTableProps<T = any> {
      * disabled and they're excluded from "select all".
      */
     isRowSelectable?: (item: T) => boolean;
+    /** Action definitions rendered on row hover */
+    rowHoverActions?: (item: T, index: number) => DataTableRowAction<T>[];
+    /** Custom renderer function for row hover actions */
+    renderRowHoverActions?: (item: T, index: number) => ReactNode;
+    /** Optional header title label for the row hover actions column (when rowHoverActionMode="inline") */
+    rowHoverActionHeader?: ReactNode;
+    /**
+     * Rendering mode for row hover actions.
+     * - **overlay** (default): Floating overlay positioned over the right side of the row on hover without adding extra table columns.
+     * - **inline**: Renders as a dedicated rightmost table column.
+     * @default "overlay"
+     */
+    rowHoverActionMode?: 'overlay' | 'inline';
+    /** Extra CSS classes applied to the row hover action container element */
+    rowHoverActionClass?: string;
+    /** Extra CSS classes applied to the pagination container wrapper */
+    paginationClass?: string;
+    /** Extra CSS classes applied to the pagination container wrapper (alias for paginationClass) */
     paginationContainerClass?: string;
+    /** Additional props passed directly to internal Pagination component */
+    paginationProps?: Record<string, any>;
+    /** Custom renderer function for pagination */
+    renderPagination?: (pagination: TPagination, setPagination?: (pagination: Partial<TPagination>) => void) => ReactNode;
 }

package/dist/types/components/Pagination/Pagination.types.d.ts

@@ -1,33 +1,30 @@
 export interface TPagination {
-    /**
-     * Defines current page number
-     */
-    page: number;
-    /**
-     * Defines page limit
-     */
-    limit: number;
-    /**
-     * Defines totol items in the list to be paginated.
-     */
+    /** Defines current page number */
+    page?: number;
+    /** Alias for page */
+    current?: number;
+    /** Defines page limit / page size */
+    limit?: number;
+    /** Alias for limit */
+    pageSize?: number;
+    /** Defines total items in the list to be paginated */
     total: number;
 }
-export type PaginationProps = TPagination & {
-    /**
-     * Pagination component classname
-     */
+export type PaginationProps = Partial<TPagination> & {
+    /** Total number of items */
+    total: number;
+    /** Pagination component classname */
     className?: string;
-    /**
-     * Handler for page change
-     * @param pagination Partial<TPagination>
-     * @returns void
-     */
+    /** Handler for page change */
     onChange: (pagination: Partial<TPagination>) => void;
-    /**
-     * Whether to show ellipsis for large page numbers
-     * @default true
-     */
+    /** Whether to show ellipsis for large page numbers (@default true) */
     ellipsis?: boolean;
+    /** Whether to force mobile UX layout (`Previous` `Page X of Y` `Next`) regardless of screen size */
+    isMobile?: boolean;
+    /** Whether to show summary text ("Showing X to Y of Z results") (@default true) */
+    showSummary?: boolean;
+    /** Whether to show page number navigation buttons (@default true) */
+    showPageNumbers?: boolean;
 };
 export type UsePaginationProps = {
     totalPages: number;

package/dist/types/components/RadioGroup/RadioGroup.types.d.ts

@@ -88,6 +88,14 @@ export interface RadioGroupProps {
      * Change handler called when selected value changes.
      */
     onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * Marks the field as required.
+     */
+    required?: boolean;
+    /**
+     * Custom aria-describedby attribute.
+     */
+    'aria-describedby'?: string;
     error?: string | null;
     showErrorMessage?: boolean;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pk-design/react-tailwind",
-  "version": "1.7.2",
+  "version": "1.8.0",
   "main": "dist/react-tailwind.cjs.js",
   "module": "dist/react-tailwind.es.js",
   "types": "dist/types/index.d.ts",