@pallasoft/ps-table-components 1.13.1 → 1.14.0

package/dist/components/ps-data-table.js

@@ -8,6 +8,7 @@ const ps_design_system_1 = require("@pallasoft/ps-design-system");
 const ps_input_components_1 = require("@pallasoft/ps-input-components");
 const ps_motion_components_1 = require("@pallasoft/ps-motion-components");
 const table_config_1 = require("../constants/table-config");
+const ps_table_column_size_service_1 = require("../services/ps-table-column-size-service");
 const ps_table_group_service_1 = require("../services/ps-table-group-service");
 const ps_table_query_service_1 = require("../services/ps-table-query-service");
 const ps_table_bulk_bar_1 = require("./ps-table-bulk-bar");
@@ -27,7 +28,10 @@ const densityClassNames = {
         head: 'px-5 py-3.5',
     },
 };
-const columnStyle = (column) => column.width || column.minWidth ? { minWidth: column.minWidth, width: column.width } : undefined;
+const columnStyle = (column) => ({
+    minWidth: ps_table_column_size_service_1.PsTableColumnSizeService.minWidthOf(column),
+    width: column.width,
+});
 const alignClassNames = {
     center: 'text-center',
     left: 'text-left',
@@ -184,7 +188,7 @@ const PsDataTable = ({ caption, className, columns, defaultSort, density = 'norm
                                                 ? grouping.renderGroupSummary(group.rows)
                                                 : undefined }), (0, jsx_runtime_1.jsx)(ps_motion_components_1.PsCollapse, { isOpen: isExpanded && !closingGroupKeys.includes(group.key), children: renderCardList(group.rows, null) })] }, `group-${group.key}`));
                             })
-                            : renderCardList(visibleRows, visibleRows.length === 0 && isQueried ? ((0, jsx_runtime_1.jsxs)("div", { className: 'px-4 py-10 text-center', children: [(0, jsx_runtime_1.jsx)("p", { className: 'text-sm font-semibold text-ink', children: table_config_1.PsTableConfig.noMatchesTitle }), (0, jsx_runtime_1.jsx)("button", { className: 'ps-focus-ring mt-2 rounded-full px-3 py-1.5 text-sm font-semibold text-primary', onClick: clearFilters, type: 'button', children: "Clear search and filters" })] })) : null) })) : null, (0, jsx_runtime_1.jsx)("div", { className: ps_design_system_1.PallasoftClassNameService.merge('ps-scrollbar overflow-x-auto', mobileLayout === 'cards' ? 'hidden sm:block' : ''), children: (0, jsx_runtime_1.jsxs)("table", { className: ps_design_system_1.PallasoftClassNameService.merge('w-full border-collapse text-left', layout === 'fixed' ? 'table-fixed' : ''), children: [caption ? (0, jsx_runtime_1.jsx)("caption", { className: 'sr-only', children: caption }) : null, (0, jsx_runtime_1.jsx)("thead", { className: 'bg-mist/70 text-[0.68rem] font-semibold uppercase tracking-[0.18em] text-ink/45', children: (0, jsx_runtime_1.jsxs)("tr", { children: [isSelectable ? ((0, jsx_runtime_1.jsx)("th", { className: 'w-10 pl-4 pr-0', scope: 'col', children: (0, jsx_runtime_1.jsx)(ps_input_components_1.PsCheckbox, { isIndeterminate: !isPageSelected && pageIds.some((rowId) => selectedIds.includes(rowId)), isSelected: isPageSelected, label: 'Select all rows on this page', onChange: togglePage }) })) : null, visibleColumns.map((column) => {
+                            : renderCardList(visibleRows, visibleRows.length === 0 && isQueried ? ((0, jsx_runtime_1.jsxs)("div", { className: 'px-4 py-10 text-center', children: [(0, jsx_runtime_1.jsx)("p", { className: 'text-sm font-semibold text-ink', children: table_config_1.PsTableConfig.noMatchesTitle }), (0, jsx_runtime_1.jsx)("button", { className: 'ps-focus-ring mt-2 rounded-full px-3 py-1.5 text-sm font-semibold text-primary', onClick: clearFilters, type: 'button', children: "Clear search and filters" })] })) : null) })) : null, (0, jsx_runtime_1.jsx)("div", { className: ps_design_system_1.PallasoftClassNameService.merge('ps-scrollbar overflow-x-auto', mobileLayout === 'cards' ? 'hidden sm:block' : ''), children: (0, jsx_runtime_1.jsxs)("table", { className: ps_design_system_1.PallasoftClassNameService.merge('w-full min-w-max border-collapse text-left', layout === 'fixed' ? 'table-fixed' : ''), children: [caption ? (0, jsx_runtime_1.jsx)("caption", { className: 'sr-only', children: caption }) : null, (0, jsx_runtime_1.jsx)("thead", { className: 'bg-mist/70 text-[0.68rem] font-semibold uppercase tracking-[0.18em] text-ink/45', children: (0, jsx_runtime_1.jsxs)("tr", { children: [isSelectable ? ((0, jsx_runtime_1.jsx)("th", { className: 'w-10 pl-4 pr-0', scope: 'col', children: (0, jsx_runtime_1.jsx)(ps_input_components_1.PsCheckbox, { isIndeterminate: !isPageSelected && pageIds.some((rowId) => selectedIds.includes(rowId)), isSelected: isPageSelected, label: 'Select all rows on this page', onChange: togglePage }) })) : null, visibleColumns.map((column) => {
                                                 const align = column.align !== null && column.align !== undefined ? column.align : 'left';
                                                 const isSorted = sort !== null && sort.columnId === column.id;
                                                 return ((0, jsx_runtime_1.jsx)("th", { "aria-sort": isSorted

package/dist/components/ps-table-column-picker.js

@@ -10,7 +10,7 @@ const react_aria_components_1 = require("react-aria-components");
 const PsTableColumnPicker = ({ columns, hiddenColumnIds, onChange, }) => {
     const zIndex = (0, ps_core_components_1.usePsLayerZIndex)(ps_design_system_1.PallasoftZIndex.Dropdown);
     const visibleCount = columns.filter((column) => !hiddenColumnIds.includes(column.id)).length;
-    return ((0, jsx_runtime_1.jsxs)(react_aria_components_1.DialogTrigger, { children: [(0, jsx_runtime_1.jsxs)(react_aria_components_1.Button, { className: 'ps-input-control ps-focus-ring ps-control ps-control-padding inline-flex w-auto min-w-11 items-center justify-center gap-2 rounded-ps-control text-sm font-semibold text-ink outline-none transition-colors hover:border-primary/40', children: [(0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { "aria-hidden": 'true', className: 'block h-4 w-4 sm:hidden', iconKey: ps_icons_1.PsIconKey.Columns }), (0, jsx_runtime_1.jsx)("span", { className: 'sr-only sm:not-sr-only', children: "Columns" }), (0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { "aria-hidden": 'true', className: 'hidden h-4 w-4 sm:block', iconKey: ps_icons_1.PsIconKey.Chevron })] }), (0, jsx_runtime_1.jsx)(react_aria_components_1.Popover, { className: 'ps-floating-panel w-60 outline-none', offset: 6, placement: 'bottom end', style: { zIndex }, children: (0, jsx_runtime_1.jsx)(react_aria_components_1.Dialog, { "aria-label": 'Columns', className: 'flex flex-col gap-0.5 p-1.5 outline-none', children: (0, jsx_runtime_1.jsx)(ps_core_components_1.PsLayer, { zIndex: zIndex, children: columns.map((column) => {
+    return ((0, jsx_runtime_1.jsxs)(react_aria_components_1.DialogTrigger, { children: [(0, jsx_runtime_1.jsxs)(react_aria_components_1.Button, { className: 'ps-input-control ps-control-trigger ps-focus-ring ps-control ps-control-padding inline-flex min-w-11 items-center justify-center gap-2 rounded-ps-control text-sm font-semibold text-ink outline-none transition-colors hover:border-primary/40', children: [(0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { "aria-hidden": 'true', className: 'block h-4 w-4 sm:hidden', iconKey: ps_icons_1.PsIconKey.Columns }), (0, jsx_runtime_1.jsx)("span", { className: 'sr-only sm:not-sr-only', children: "Columns" }), (0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { "aria-hidden": 'true', className: 'hidden h-4 w-4 sm:block', iconKey: ps_icons_1.PsIconKey.Chevron })] }), (0, jsx_runtime_1.jsx)(react_aria_components_1.Popover, { className: 'ps-floating-panel w-60 outline-none', offset: 6, placement: 'bottom end', style: { zIndex }, children: (0, jsx_runtime_1.jsx)(react_aria_components_1.Dialog, { "aria-label": 'Columns', className: 'flex flex-col gap-0.5 p-1.5 outline-none', children: (0, jsx_runtime_1.jsx)(ps_core_components_1.PsLayer, { zIndex: zIndex, children: columns.map((column) => {
                             const isVisible = !hiddenColumnIds.includes(column.id);
                             return ((0, jsx_runtime_1.jsx)(ps_input_components_1.PsCheckbox, { className: 'ps-floating-option w-full', isDisabled: isVisible && visibleCount <= 1, isSelected: isVisible, label: column.label, onChange: () => onChange(isVisible
                                     ? [...hiddenColumnIds, column.id]

package/dist/components/ps-table-toolbar.js

@@ -8,7 +8,7 @@ const ps_icons_1 = require("@pallasoft/ps-icons");
 const react_aria_components_1 = require("react-aria-components");
 const ps_table_query_service_1 = require("../services/ps-table-query-service");
 const ps_table_filter_field_1 = require("./ps-table-filter-field");
-const toolbarButtonClassName = 'ps-input-control ps-focus-ring ps-control ps-control-padding inline-flex w-auto min-w-11 items-center justify-center gap-2 rounded-ps-control text-sm font-semibold text-ink outline-none transition-colors hover:border-primary/40';
+const toolbarButtonClassName = 'ps-input-control ps-control-trigger ps-focus-ring ps-control ps-control-padding inline-flex min-w-11 items-center justify-center gap-2 rounded-ps-control text-sm font-semibold text-ink outline-none transition-colors hover:border-primary/40';
 const PsTableToolbar = ({ actions, columns, filters, isSearchable, onClearFilters, onFilterChange, onSearchChange, rows, search, searchPlaceholder, }) => {
     const filterableColumns = columns.filter((column) => column.filter);
     const zIndex = (0, ps_core_components_1.usePsLayerZIndex)(ps_design_system_1.PallasoftZIndex.Dropdown);

package/dist/constants/table-column-size.d.ts

@@ -0,0 +1,11 @@
+export declare const PsTableColumnSize: {
+    readonly amount: "amount";
+    readonly compact: "compact";
+    readonly date: "date";
+    readonly identifier: "identifier";
+    readonly status: "status";
+    readonly text: "text";
+    readonly wide: "wide";
+};
+export type PsTableColumnSize = (typeof PsTableColumnSize)[keyof typeof PsTableColumnSize];
+export declare const PsTableColumnWidths: Record<PsTableColumnSize, string>;

package/dist/constants/table-column-size.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PsTableColumnWidths = exports.PsTableColumnSize = void 0;
+exports.PsTableColumnSize = {
+    amount: 'amount',
+    compact: 'compact',
+    date: 'date',
+    identifier: 'identifier',
+    status: 'status',
+    text: 'text',
+    wide: 'wide',
+};
+exports.PsTableColumnWidths = {
+    amount: '8.5rem',
+    compact: '6rem',
+    date: '7.5rem',
+    identifier: '9rem',
+    status: '8rem',
+    text: '12rem',
+    wide: '18rem',
+};

package/dist/esm/components/ps-data-table.js

@@ -5,6 +5,7 @@ import { PallasoftClassNameService } from '@pallasoft/ps-design-system';
 import { PsCheckbox } from '@pallasoft/ps-input-components';
 import { PsCollapse } from '@pallasoft/ps-motion-components';
 import { PsTableConfig } from '../constants/table-config';
+import { PsTableColumnSizeService } from '../services/ps-table-column-size-service';
 import { PsTableGroupService } from '../services/ps-table-group-service';
 import { PsTableQueryService } from '../services/ps-table-query-service';
 import { PsTableBulkBar } from './ps-table-bulk-bar';
@@ -24,7 +25,10 @@ const densityClassNames = {
         head: 'px-5 py-3.5',
     },
 };
-const columnStyle = (column) => column.width || column.minWidth ? { minWidth: column.minWidth, width: column.width } : undefined;
+const columnStyle = (column) => ({
+    minWidth: PsTableColumnSizeService.minWidthOf(column),
+    width: column.width,
+});
 const alignClassNames = {
     center: 'text-center',
     left: 'text-left',
@@ -181,7 +185,7 @@ export const PsDataTable = ({ caption, className, columns, defaultSort, density
                                                 ? grouping.renderGroupSummary(group.rows)
                                                 : undefined }), _jsx(PsCollapse, { isOpen: isExpanded && !closingGroupKeys.includes(group.key), children: renderCardList(group.rows, null) })] }, `group-${group.key}`));
                             })
-                            : renderCardList(visibleRows, visibleRows.length === 0 && isQueried ? (_jsxs("div", { className: 'px-4 py-10 text-center', children: [_jsx("p", { className: 'text-sm font-semibold text-ink', children: PsTableConfig.noMatchesTitle }), _jsx("button", { className: 'ps-focus-ring mt-2 rounded-full px-3 py-1.5 text-sm font-semibold text-primary', onClick: clearFilters, type: 'button', children: "Clear search and filters" })] })) : null) })) : null, _jsx("div", { className: PallasoftClassNameService.merge('ps-scrollbar overflow-x-auto', mobileLayout === 'cards' ? 'hidden sm:block' : ''), children: _jsxs("table", { className: PallasoftClassNameService.merge('w-full border-collapse text-left', layout === 'fixed' ? 'table-fixed' : ''), children: [caption ? _jsx("caption", { className: 'sr-only', children: caption }) : null, _jsx("thead", { className: 'bg-mist/70 text-[0.68rem] font-semibold uppercase tracking-[0.18em] text-ink/45', children: _jsxs("tr", { children: [isSelectable ? (_jsx("th", { className: 'w-10 pl-4 pr-0', scope: 'col', children: _jsx(PsCheckbox, { isIndeterminate: !isPageSelected && pageIds.some((rowId) => selectedIds.includes(rowId)), isSelected: isPageSelected, label: 'Select all rows on this page', onChange: togglePage }) })) : null, visibleColumns.map((column) => {
+                            : renderCardList(visibleRows, visibleRows.length === 0 && isQueried ? (_jsxs("div", { className: 'px-4 py-10 text-center', children: [_jsx("p", { className: 'text-sm font-semibold text-ink', children: PsTableConfig.noMatchesTitle }), _jsx("button", { className: 'ps-focus-ring mt-2 rounded-full px-3 py-1.5 text-sm font-semibold text-primary', onClick: clearFilters, type: 'button', children: "Clear search and filters" })] })) : null) })) : null, _jsx("div", { className: PallasoftClassNameService.merge('ps-scrollbar overflow-x-auto', mobileLayout === 'cards' ? 'hidden sm:block' : ''), children: _jsxs("table", { className: PallasoftClassNameService.merge('w-full min-w-max border-collapse text-left', layout === 'fixed' ? 'table-fixed' : ''), children: [caption ? _jsx("caption", { className: 'sr-only', children: caption }) : null, _jsx("thead", { className: 'bg-mist/70 text-[0.68rem] font-semibold uppercase tracking-[0.18em] text-ink/45', children: _jsxs("tr", { children: [isSelectable ? (_jsx("th", { className: 'w-10 pl-4 pr-0', scope: 'col', children: _jsx(PsCheckbox, { isIndeterminate: !isPageSelected && pageIds.some((rowId) => selectedIds.includes(rowId)), isSelected: isPageSelected, label: 'Select all rows on this page', onChange: togglePage }) })) : null, visibleColumns.map((column) => {
                                                 const align = column.align !== null && column.align !== undefined ? column.align : 'left';
                                                 const isSorted = sort !== null && sort.columnId === column.id;
                                                 return (_jsx("th", { "aria-sort": isSorted

package/dist/esm/components/ps-table-column-picker.js

@@ -7,7 +7,7 @@ import { Button, Dialog, DialogTrigger, Popover } from 'react-aria-components';
 export const PsTableColumnPicker = ({ columns, hiddenColumnIds, onChange, }) => {
     const zIndex = usePsLayerZIndex(PallasoftZIndex.Dropdown);
     const visibleCount = columns.filter((column) => !hiddenColumnIds.includes(column.id)).length;
-    return (_jsxs(DialogTrigger, { children: [_jsxs(Button, { className: 'ps-input-control ps-focus-ring ps-control ps-control-padding inline-flex w-auto min-w-11 items-center justify-center gap-2 rounded-ps-control text-sm font-semibold text-ink outline-none transition-colors hover:border-primary/40', children: [_jsx(PsIcon, { "aria-hidden": 'true', className: 'block h-4 w-4 sm:hidden', iconKey: PsIconKey.Columns }), _jsx("span", { className: 'sr-only sm:not-sr-only', children: "Columns" }), _jsx(PsIcon, { "aria-hidden": 'true', className: 'hidden h-4 w-4 sm:block', iconKey: PsIconKey.Chevron })] }), _jsx(Popover, { className: 'ps-floating-panel w-60 outline-none', offset: 6, placement: 'bottom end', style: { zIndex }, children: _jsx(Dialog, { "aria-label": 'Columns', className: 'flex flex-col gap-0.5 p-1.5 outline-none', children: _jsx(PsLayer, { zIndex: zIndex, children: columns.map((column) => {
+    return (_jsxs(DialogTrigger, { children: [_jsxs(Button, { className: 'ps-input-control ps-control-trigger ps-focus-ring ps-control ps-control-padding inline-flex min-w-11 items-center justify-center gap-2 rounded-ps-control text-sm font-semibold text-ink outline-none transition-colors hover:border-primary/40', children: [_jsx(PsIcon, { "aria-hidden": 'true', className: 'block h-4 w-4 sm:hidden', iconKey: PsIconKey.Columns }), _jsx("span", { className: 'sr-only sm:not-sr-only', children: "Columns" }), _jsx(PsIcon, { "aria-hidden": 'true', className: 'hidden h-4 w-4 sm:block', iconKey: PsIconKey.Chevron })] }), _jsx(Popover, { className: 'ps-floating-panel w-60 outline-none', offset: 6, placement: 'bottom end', style: { zIndex }, children: _jsx(Dialog, { "aria-label": 'Columns', className: 'flex flex-col gap-0.5 p-1.5 outline-none', children: _jsx(PsLayer, { zIndex: zIndex, children: columns.map((column) => {
                             const isVisible = !hiddenColumnIds.includes(column.id);
                             return (_jsx(PsCheckbox, { className: 'ps-floating-option w-full', isDisabled: isVisible && visibleCount <= 1, isSelected: isVisible, label: column.label, onChange: () => onChange(isVisible
                                     ? [...hiddenColumnIds, column.id]

package/dist/esm/components/ps-table-toolbar.js

@@ -5,7 +5,7 @@ import { PsIcon, PsIconKey } from '@pallasoft/ps-icons';
 import { Button, Dialog, DialogTrigger, Popover } from 'react-aria-components';
 import { PsTableQueryService } from '../services/ps-table-query-service';
 import { PsTableFilterField } from './ps-table-filter-field';
-const toolbarButtonClassName = 'ps-input-control ps-focus-ring ps-control ps-control-padding inline-flex w-auto min-w-11 items-center justify-center gap-2 rounded-ps-control text-sm font-semibold text-ink outline-none transition-colors hover:border-primary/40';
+const toolbarButtonClassName = 'ps-input-control ps-control-trigger ps-focus-ring ps-control ps-control-padding inline-flex min-w-11 items-center justify-center gap-2 rounded-ps-control text-sm font-semibold text-ink outline-none transition-colors hover:border-primary/40';
 export const PsTableToolbar = ({ actions, columns, filters, isSearchable, onClearFilters, onFilterChange, onSearchChange, rows, search, searchPlaceholder, }) => {
     const filterableColumns = columns.filter((column) => column.filter);
     const zIndex = usePsLayerZIndex(PallasoftZIndex.Dropdown);

package/dist/esm/constants/table-column-size.js

@@ -0,0 +1,18 @@
+export const PsTableColumnSize = {
+    amount: 'amount',
+    compact: 'compact',
+    date: 'date',
+    identifier: 'identifier',
+    status: 'status',
+    text: 'text',
+    wide: 'wide',
+};
+export const PsTableColumnWidths = {
+    amount: '8.5rem',
+    compact: '6rem',
+    date: '7.5rem',
+    identifier: '9rem',
+    status: '8rem',
+    text: '12rem',
+    wide: '18rem',
+};

package/dist/esm/index.js

@@ -2,6 +2,7 @@ export * from './components/ps-data-table';
 export * from './components/ps-table-group-header';
 export * from './components/ps-table-pagination';
 export * from './constants/table-card-role';
+export * from './constants/table-column-size';
 export * from './constants/table-filter-kind';
 export * from './interfaces/table-column';
 export * from './interfaces/table-column-filter';
@@ -12,6 +13,7 @@ export * from './interfaces/table-query';
 export * from './interfaces/table-row-action';
 export * from './interfaces/table-row-group';
 export * from './interfaces/table-sort';
+export * from './services/ps-table-column-size-service';
 export * from './services/ps-table-group-service';
 export * from './services/ps-table-query-service';
 export * from './services/ps-table-search-service';

package/dist/esm/services/ps-table-column-size-service.js

@@ -0,0 +1,17 @@
+import { PsTableColumnSize, PsTableColumnWidths } from '../constants/table-column-size';
+export class PsTableColumnSizeService {
+    static sizeOf(column) {
+        if (column.size !== undefined)
+            return column.size;
+        if (column.align === 'right')
+            return PsTableColumnSize.amount;
+        if (column.align === 'center')
+            return PsTableColumnSize.status;
+        return PsTableColumnSize.text;
+    }
+    static minWidthOf(column) {
+        if (column.minWidth !== undefined)
+            return column.minWidth;
+        return PsTableColumnWidths[PsTableColumnSizeService.sizeOf(column)];
+    }
+}

package/dist/index.d.ts

@@ -2,6 +2,7 @@ export * from './components/ps-data-table';
 export * from './components/ps-table-group-header';
 export * from './components/ps-table-pagination';
 export * from './constants/table-card-role';
+export * from './constants/table-column-size';
 export * from './constants/table-filter-kind';
 export * from './interfaces/table-column';
 export * from './interfaces/table-column-filter';
@@ -12,6 +13,7 @@ export * from './interfaces/table-query';
 export * from './interfaces/table-row-action';
 export * from './interfaces/table-row-group';
 export * from './interfaces/table-sort';
+export * from './services/ps-table-column-size-service';
 export * from './services/ps-table-group-service';
 export * from './services/ps-table-query-service';
 export * from './services/ps-table-search-service';

package/dist/index.js

@@ -18,6 +18,7 @@ __exportStar(require("./components/ps-data-table"), exports);
 __exportStar(require("./components/ps-table-group-header"), exports);
 __exportStar(require("./components/ps-table-pagination"), exports);
 __exportStar(require("./constants/table-card-role"), exports);
+__exportStar(require("./constants/table-column-size"), exports);
 __exportStar(require("./constants/table-filter-kind"), exports);
 __exportStar(require("./interfaces/table-column"), exports);
 __exportStar(require("./interfaces/table-column-filter"), exports);
@@ -28,6 +29,7 @@ __exportStar(require("./interfaces/table-query"), exports);
 __exportStar(require("./interfaces/table-row-action"), exports);
 __exportStar(require("./interfaces/table-row-group"), exports);
 __exportStar(require("./interfaces/table-sort"), exports);
+__exportStar(require("./services/ps-table-column-size-service"), exports);
 __exportStar(require("./services/ps-table-group-service"), exports);
 __exportStar(require("./services/ps-table-query-service"), exports);
 __exportStar(require("./services/ps-table-search-service"), exports);

package/dist/interfaces/table-column.d.ts

@@ -1,5 +1,6 @@
 import type { ReactNode } from 'react';
 import type { PsTableCardRole } from '../constants/table-card-role';
+import type { PsTableColumnSize } from '../constants/table-column-size';
 import type { PsTableColumnFilter } from './table-column-filter';
 export interface PsTableColumn<RowData> {
     align?: 'center' | 'left' | 'right';
@@ -13,6 +14,7 @@ export interface PsTableColumn<RowData> {
     label: string;
     minWidth?: string;
     render: (row: RowData) => ReactNode;
+    size?: PsTableColumnSize;
     sortValue?: (row: RowData) => string | number | null;
     width?: string;
     wrap?: boolean;

package/dist/services/ps-table-column-size-service.d.ts

@@ -0,0 +1,6 @@
+import { PsTableColumnSize } from '../constants/table-column-size';
+import type { PsTableColumn } from '../interfaces/table-column';
+export declare class PsTableColumnSizeService {
+    static sizeOf<RowData>(column: PsTableColumn<RowData>): PsTableColumnSize;
+    static minWidthOf<RowData>(column: PsTableColumn<RowData>): string;
+}

package/dist/services/ps-table-column-size-service.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PsTableColumnSizeService = void 0;
+const table_column_size_1 = require("../constants/table-column-size");
+class PsTableColumnSizeService {
+    static sizeOf(column) {
+        if (column.size !== undefined)
+            return column.size;
+        if (column.align === 'right')
+            return table_column_size_1.PsTableColumnSize.amount;
+        if (column.align === 'center')
+            return table_column_size_1.PsTableColumnSize.status;
+        return table_column_size_1.PsTableColumnSize.text;
+    }
+    static minWidthOf(column) {
+        if (column.minWidth !== undefined)
+            return column.minWidth;
+        return table_column_size_1.PsTableColumnWidths[PsTableColumnSizeService.sizeOf(column)];
+    }
+}
+exports.PsTableColumnSizeService = PsTableColumnSizeService;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@pallasoft/ps-table-components",
-	"version": "1.13.1",
+	"version": "1.14.0",
 	"private": false,
 	"main": "./dist/index.js",
 	"module": "./dist/esm/index.js",