@croquiscom/pds 12.7.0 → 12.8.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @croquiscom/pds
 
+## 12.8.0
+
+### Minor Changes
+
+- e21f07d: Table Body Cell, Max Height, Truncate Text, Huge Contents 추가
+
 ## 12.7.0
 
 ### Minor Changes

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

@@ -18,6 +18,7 @@ export interface DataTableProps<DataType> {
      *  - x: 가로 스크롤을 설정하고 스크롤 영역의 너비를 지정합니다.
      *  - y: 세로 스크롤을 설정하고 스크롤 영역의 높이를 지정합니다.
      *  - x 사용시 table-layout이 fixed 처리됩니다.(기본 auto)
+     *  - y 기본값은 600px입니다.
      */
     scroll?: Scroll;
     /**

package/dist/components/table/DataTable.test.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { DataType } from './storybook-helper';
+import { DataTable } from './DataTable';
+declare const meta: Meta<typeof DataTable<DataType>>;
+export default meta;
+type Story = StoryObj<typeof DataTable<DataType>>;
+export declare const Scroll: Story;

package/dist/components/table/TableCell.d.ts

@@ -1,5 +1,5 @@
 import React, { TdHTMLAttributes } from 'react';
-import { ColumnAlign } from '../table/types';
+import { CellSize, ColumnAlign } from '../table/types';
 interface TableCellProps extends TdHTMLAttributes<HTMLTableCellElement> {
     id?: string;
     fixed?: boolean;
@@ -14,6 +14,12 @@ interface TableCellProps extends TdHTMLAttributes<HTMLTableCellElement> {
     clickable?: boolean;
     selectable?: boolean;
     isColumnLast?: boolean;
+    /** @default medium */
+    size?: CellSize;
+    /** @default true */
+    isTruncate?: boolean;
+    /** @default true */
+    isHugeContents?: boolean;
 }
 export declare const TableCell: React.ForwardRefExoticComponent<TableCellProps & React.RefAttributes<HTMLTableCellElement>>;
 export {};

package/dist/components/table/TableCell.stories.d.ts

@@ -5,3 +5,6 @@ export default meta;
 type Story = StoryObj<typeof TableCell>;
 export declare const Base: Story;
 export declare const Valign: Story;
+export declare const Size: Story;
+export declare const TruncateText: Story;
+export declare const HugeContents: Story;

package/dist/components/table/TableCell.test.stories.d.ts

@@ -4,3 +4,6 @@ declare const meta: Meta<typeof TableCell>;
 export default meta;
 type Story = StoryObj<typeof TableCell>;
 export declare const Valign: Story;
+export declare const Size: Story;
+export declare const TruncateText: Story;
+export declare const HugeContents: Story;

package/dist/components/table/styles.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { ColumnAlign } from './types';
+import { CellSize, ColumnAlign } from './types';
 export declare const StyledTableCol: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements>;
@@ -12,3 +12,4 @@ export declare const StyledTableCol: import("@emotion/styled").StyledComponent<{
     resize?: boolean;
     align?: ColumnAlign;
 }, import("react").DetailedHTMLProps<import("react").ThHTMLAttributes<HTMLTableHeaderCellElement>, HTMLTableHeaderCellElement>, {}>;
+export declare const cell_size_css: Record<CellSize, string>;

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

@@ -20,6 +20,7 @@ export type CellProps<DataType> = ({ row, value, index, rows, }: {
     index: number;
     rows: DataTableRowsType<DataType>;
 }) => ReactNode;
+export type CellSize = 'small' | 'medium' | 'large';
 export type DataTableColumnBase = {
     /**
      * 테이블 컬럼 텍스트