@croquiscom/pds 8.30.0 → 8.31.0

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @croquiscom/pds
 
+## 8.31.0
+
+### Minor Changes
+
+- bbb57f6: DataTable rowColor option 추가
+- fa4af8c: Display typography 추가
+
+## 8.30.1
+
+### Patch Changes
+
+- 9ddca85: fix: 테이블 렌더링 버그 수정
+
 ## 8.30.0
 
 ### Minor Changes

package/README.md

@@ -135,7 +135,7 @@ yarn storybook
 Github Action을 통해 자동으로 배포하고 있습니다.
 
 changeset 파일을 포함한 PR이 main에 머지되면, Github Action 워크플로우가 동작되며, 버전 배포를 위한 Version Packages PR이 생성됩니다.
-해당 PR을 머지하게 되면 Github Action의 워크플로우가 동작되며 패키지가 배포됩니다.
+해당 PR은 셀프로 Approve 후 머지하게 되면 Github Action의 워크플로우가 동작되며 패키지가 배포됩니다.
 
 #### Github Action을 통한 배포가 불가능할 경우
 

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

@@ -86,6 +86,17 @@ export interface DataTableProps<DataType> {
      * @default true
      */
     cellHoverStyle?: boolean;
+    /**
+     * 테이블 로우 disabled 스타일 사용 유무
+     *   - column cellAttributes 스타일 커스텀시 로우 전체 disabled 스타일을 제한할 수 있습니다.
+     * @default true
+     */
+    cellDisabledStyle?: boolean;
+    /**
+     * Row 배경색을 지정하는 함수 혹은 컬러값을 전달합니다.
+     * hover는 auto code 정책을 따릅니다.
+     */
+    rowColor?: (row: DataType, index: number) => string | string;
     /**
      * Sort 이벤트, 대상 Column 아이디를 전달합니다.
      */

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

@@ -28,3 +28,5 @@ export declare const BeforehandSelectionByFunction: Story;
 export declare const Sort: Story;
 export declare const WithPagination: Story;
 export declare const Disabled: Story;
+export declare const CustomRowColor: Story;
+export declare const DisabledCellOff: Story;

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

@@ -1,11 +1,12 @@
 import React from 'react';
 import { DataTableProps } from './DataTable';
-import { SelectRowAction, DataTableRowsType } from './types';
-interface DataTableRowsProps<DataType> extends Pick<DataTableProps<DataType>, 'columns' | 'rows' | 'noDataText' | 'loading' | 'selectableRows' | 'clickableRows' | 'cellHoverStyle' | 'resize'> {
+import { SelectRowAction, DataTableRowsType, DataTableRowType } from './types';
+interface DataTableRowsProps<DataType> extends Pick<DataTableProps<DataType>, 'columns' | 'rows' | 'noDataText' | 'loading' | 'selectableRows' | 'clickableRows' | 'cellHoverStyle' | 'cellDisabledStyle' | 'resize'> {
     tableContainerAttribute: number;
     allSelected?: boolean;
     selectedRows?: DataTableRowsType<DataType>;
+    rowColor?: (row: DataTableRowType<DataType>, index: number) => string | string;
     onSelectedRow?: (action: SelectRowAction<DataType>) => void;
 }
-export declare const DataTableRows: <DataType extends object = any>({ columns, rows, loading, selectableRows, clickableRows, selectedRows, noDataText, cellHoverStyle, tableContainerAttribute, resize, onSelectedRow, }: DataTableRowsProps<DataType>) => React.JSX.Element;
+export declare const DataTableRows: <DataType extends object = any>({ columns, rows, loading, selectableRows, clickableRows, selectedRows, noDataText, cellHoverStyle, cellDisabledStyle, tableContainerAttribute, resize, onSelectedRow, rowColor, }: DataTableRowsProps<DataType>) => React.JSX.Element;
 export {};

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

@@ -10,6 +10,9 @@ interface TableCellProps extends TdHTMLAttributes<HTMLTableCellElement> {
     resize?: boolean;
     colSpan?: number;
     isRowLast?: boolean;
+    cellDisabledStyle?: boolean;
+    clickable?: boolean;
+    selectable?: boolean;
     isColumnLast?: boolean;
 }
 export declare const TableCell: React.ForwardRefExoticComponent<TableCellProps & React.RefAttributes<HTMLTableCellElement>>;

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

@@ -12,6 +12,7 @@ interface TableColProps extends ThHTMLAttributes<HTMLTableCellElement> {
     resize?: boolean;
     align?: ColumnAlign;
     sortProps?: TableSortIndicatorProps;
+    showRightBorder?: boolean;
     onClick?: () => void;
 }
 export declare const TableCol: React.ForwardRefExoticComponent<TableColProps & React.RefAttributes<HTMLTableCellElement>>;

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

@@ -6,6 +6,7 @@ interface TableRowProps extends TableHTMLAttributes<HTMLTableRowElement> {
     clickable?: boolean;
     selectable?: boolean;
     disabled?: boolean;
+    rowColor?: string;
 }
 export declare const TableRow: React.ForwardRefExoticComponent<TableRowProps & React.RefAttributes<HTMLTableRowElement>>;
 export {};

package/dist/foundation/typography.d.ts

@@ -1,4 +1,4 @@
-type TypographyUsageWithSize = 'Heading_24' | 'Heading_20' | 'Heading_18' | 'Heading_17' | 'Heading_15' | 'Body_14' | 'Body_13' | 'Body_12' | 'Caption_11' | 'Caption_10';
+type TypographyUsageWithSize = 'Display_46' | 'Display_40' | 'Display_36' | 'Heading_24' | 'Heading_20' | 'Heading_18' | 'Heading_17' | 'Heading_15' | 'Body_14' | 'Body_13' | 'Body_12' | 'Caption_11' | 'Caption_10';
 type TypographyWeight = 'Bold' | 'SemiBold' | 'Medium' | 'Regular';
 export type Typography = `${TypographyUsageWithSize}_${TypographyWeight}`;
 export declare const text_styles: Record<Typography, string>;