maru_design2 2.16.1 → 2.17.0

package/CHANGELOG.md

@@ -1,5 +1,39 @@
 # Changelog
 
+## [2.17.0](https://github.com/42maru-ai/maru-design2/compare/v2.16.3...v2.17.0) (2024-10-16)
+
+
+### Features
+
+* :children_crossing: Table - UPDATE static table height ([9c04957](https://github.com/42maru-ai/maru-design2/commit/9c04957099a8246e2f8be22041d8bceabf9598d4))
+* :sparkles: Icon - ADD hover color ([8afb7c0](https://github.com/42maru-ai/maru-design2/commit/8afb7c0186def7ce896363235201c1b732aa8891))
+* :sparkles: Table - UPDATE tableBodyMaxHeight to maxHeight ([dc69bdc](https://github.com/42maru-ai/maru-design2/commit/dc69bdca8077655f5fe8c52ddca67768dd1cd967))
+
+
+### Bug Fixes
+
+* :art: Table - UPDATE emptyContentHeight to emptyBodyHeight ([704e719](https://github.com/42maru-ai/maru-design2/commit/704e7193510d7072572e7cbad38fcd5115ae4ac2))
+* :bento: Icon - ADD new icons ([4789a35](https://github.com/42maru-ai/maru-design2/commit/4789a35887b10023f69d25f19c0c5729e38a8574))
+* :lipstick: Modal - UPDATE font style ([83644b2](https://github.com/42maru-ai/maru-design2/commit/83644b25acfed121aec48bd59198129f65ceca23))
+* :lipstick: Table - UPDATE font weight ([1c689b0](https://github.com/42maru-ai/maru-design2/commit/1c689b0c51292dd86a19392cda0683344fc4fb9d))
+* :lipstick: Table - UPDATE radius ([50651aa](https://github.com/42maru-ai/maru-design2/commit/50651aadbb2e3fba1005ca450a731880ea07a0ad))
+
+## [2.16.3](https://github.com/42maru-ai/maru-design2/compare/v2.16.2...v2.16.3) (2024-10-07)
+
+
+### Bug Fixes
+
+* :poop: Button - UPDATE storybook color(temp) ([7a9bfe9](https://github.com/42maru-ai/maru-design2/commit/7a9bfe9ef758841de719f090f1da3c9432ec5f1e))
+
+## [2.16.2](https://github.com/42maru-ai/maru-design2/compare/v2.16.1...v2.16.2) (2024-09-27)
+
+
+### Bug Fixes
+
+* :bento: Icon - UPDATE,ADD sort icons ([c9b14c0](https://github.com/42maru-ai/maru-design2/commit/c9b14c094b4425f9e74d373bf67eb3212a7dbfce))
+* :bug: Dropdown - UPDATE input type condition ([6dbf931](https://github.com/42maru-ai/maru-design2/commit/6dbf931fc35a1b5d8d1052ae15a7e196e0a18b11))
+* :children_crossing: Table - UPDATE sort icon ([7be523c](https://github.com/42maru-ai/maru-design2/commit/7be523c625aa69560dd8ea0d0093b6f6a6cbdbb8))
+
 ## [2.16.1](https://github.com/42maru-ai/maru-design2/compare/v2.16.0...v2.16.1) (2024-09-23)
 
 

package/dist/components/atoms/icon/Icon.d.ts

@@ -8,5 +8,9 @@ export interface IconProps {
      * primary, secondary, positive, warning, danger + rgb. (@v1 fill)
      */
     color?: string;
+    /**
+     * primary, secondary, positive, warning, danger + rgb. (@v1 fill)
+     */
+    hoverColor?: string;
 }
-export declare function Icon({ name, color }: IconProps): import("react/jsx-runtime").JSX.Element;
+export declare function Icon({ name, color, hoverColor, }: IconProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/atoms/icon/iconmap.d.ts

@@ -37,8 +37,10 @@ export declare const ICONS: {
     readonly AlertCircle_s1615: "AlertCircle_s1615";
     readonly AlertTriangleBg_s24: "AlertTriangleBg_s24";
     readonly AlertTriangle_s1615: "AlertTriangle_s1615";
+    readonly ArrowLeftCircleBg_s2415: "ArrowLeftCircleBg_s2415";
     readonly ArrowLeftCircle_s1812: "ArrowLeftCircle_s1812";
     readonly ArrowLeftCircle_s2415: "ArrowLeftCircle_s2415";
+    readonly ArrowRightCircleBg_s2415: "ArrowRightCircleBg_s2415";
     readonly ArrowRightCircle_s1812: "ArrowRightCircle_s1812";
     readonly ArrowRightCircle_s2415: "ArrowRightCircle_s2415";
     readonly ArrowRight_s1415: "ArrowRight_s1415";
@@ -84,6 +86,7 @@ export declare const ICONS: {
     readonly ClipboardCheck_s1615: "ClipboardCheck_s1615";
     readonly ClipboardPlus_s1615: "ClipboardPlus_s1615";
     readonly ClipboardPlus_s2015: "ClipboardPlus_s2015";
+    readonly ClipboardPlus_s2415: "ClipboardPlus_s2415";
     readonly Clipboard_s1615: "Clipboard_s1615";
     readonly CodeSnippet02_s2420: "CodeSnippet02_s2420";
     readonly Copy03_s1615: "Copy03_s1615";
@@ -99,22 +102,27 @@ export declare const ICONS: {
     readonly Database01_s1615: "Database01_s1615";
     readonly Database02_s1615: "Database02_s1615";
     readonly Database02_s2015: "Database02_s2015";
+    readonly Database02_s2415: "Database02_s2415";
     readonly Database02_s2420: "Database02_s2420";
     readonly Database03_s1615: "Database03_s1615";
+    readonly Database03_s2415: "Database03_s2415";
     readonly Database03_s2420: "Database03_s2420";
     readonly DatabasePlus_s1612: "DatabasePlus_s1612";
     readonly DatabasePlus_s1812: "DatabasePlus_s1812";
     readonly Dataflow01_s1615: "Dataflow01_s1615";
     readonly Dataflow01_s2015: "Dataflow01_s2015";
+    readonly Dataflow01_s2415: "Dataflow01_s2415";
     readonly Dataflow01_s2420: "Dataflow01_s2420";
     readonly Dataflow04_s1615: "Dataflow04_s1615";
     readonly Dotpoints01_s2420: "Dotpoints01_s2420";
     readonly DotsGrid_s1815: "DotsGrid_s1815";
     readonly DotsGrid_s2420: "DotsGrid_s2420";
+    readonly DotsGrid_s3220: "DotsGrid_s3220";
     readonly DotsVertical_s1815: "DotsVertical_s1815";
     readonly DotsVertical_s2415: "DotsVertical_s2415";
     readonly DownCircle_s1413: "DownCircle_s1413";
     readonly Down_s16: "Down_s16";
+    readonly Download01_s1313: "Download01_s1313";
     readonly Download01_s1413: "Download01_s1413";
     readonly Download01_s1613: "Download01_s1613";
     readonly Downstream_s14: "Downstream_s14";
@@ -129,6 +137,7 @@ export declare const ICONS: {
     readonly File02_s1615: "File02_s1615";
     readonly File06_s1615: "File06_s1615";
     readonly File06_s2420: "File06_s2420";
+    readonly FileCheck02_s14: "FileCheck02_s14";
     readonly FileCheck02_s1615: "FileCheck02_s1615";
     readonly FileCheck03_s1615: "FileCheck03_s1615";
     readonly FilePlus02_s1615: "FilePlus02_s1615";
@@ -138,16 +147,20 @@ export declare const ICONS: {
     readonly FileX02_s1615: "FileX02_s1615";
     readonly FileX02_s3220: "FileX02_s3220";
     readonly File_s1611: "File_s1611";
+    readonly File_s2415: "File_s2415";
     readonly File_s2420: "File_s2420";
     readonly File_s3020: "File_s3020";
     readonly FilterLines_s1815: "FilterLines_s1815";
     readonly FolderUpload_s1615: "FolderUpload_s1615";
+    readonly FolderUpload_s1815: "FolderUpload_s1815";
     readonly FolderUpload_s2420: "FolderUpload_s2420";
+    readonly Folder_s2415: "Folder_s2415";
     readonly Folder_s2420: "Folder_s2420";
     readonly Folder_s2820: "Folder_s2820";
     readonly Globe01_s1615: "Globe01_s1615";
     readonly Grabber_s1612: "Grabber_s1612";
     readonly GraduationHat01_s1615: "GraduationHat01_s1615";
+    readonly GraduationHat01_s2415: "GraduationHat01_s2415";
     readonly GraduationHat01_s2420: "GraduationHat01_s2420";
     readonly HomeOutline24_s24: "HomeOutline24_s24";
     readonly Information_s16: "Information_s16";
@@ -161,6 +174,7 @@ export declare const ICONS: {
     readonly Loading02_s4830: "Loading02_s4830";
     readonly Lock01_s1615: "Lock01_s1615";
     readonly LogOut01_s1615: "LogOut01_s1615";
+    readonly Menu_s2415: "Menu_s2415";
     readonly MessageCheck_s1615: "MessageCheck_s1615";
     readonly MessageNotification_s1615: "MessageNotification_s1615";
     readonly MessageText_s1615: "MessageText_s1615";
@@ -169,6 +183,7 @@ export declare const ICONS: {
     readonly Move_s1613: "Move_s1613";
     readonly Network03_s14: "Network03_s14";
     readonly Network03_s24: "Network03_s24";
+    readonly Network03_s2415: "Network03_s2415";
     readonly Network04_s14: "Network04_s14";
     readonly Network04_s24: "Network04_s24";
     readonly Pause_s1615: "Pause_s1615";
@@ -197,7 +212,9 @@ export declare const ICONS: {
     readonly Settings02_s2420: "Settings02_s2420";
     readonly Share03_s1215: "Share03_s1215";
     readonly Share03_s1613: "Share03_s1613";
-    readonly SortOutline_s18: "SortOutline_s18";
+    readonly SortDown_s0815: "SortDown_s0815";
+    readonly SortOutline_s1415: "SortOutline_s1415";
+    readonly SortUp_s0815: "SortUp_s0815";
     readonly State_s16: "State_s16";
     readonly State_s18: "State_s18";
     readonly StopCircle_s1413: "StopCircle_s1413";
@@ -217,6 +234,7 @@ export declare const ICONS: {
     readonly Upload01_s1613: "Upload01_s1613";
     readonly UserCircleBg_s2415: "UserCircleBg_s2415";
     readonly UserCircle_s1615: "UserCircle_s1615";
+    readonly UserCircle_s2415: "UserCircle_s2415";
     readonly UserCircle_s2420: "UserCircle_s2420";
     readonly UserPlus_s1615: "UserPlus_s1615";
     readonly UserPlus_s1812: "UserPlus_s1812";

package/dist/components/molecules/table/Table.d.ts

@@ -1,3 +1,3 @@
 import { TableProps } from './types';
 import './table.scss';
-export declare function Table({ rowIdKey, data, formats, sort, onSort, checkedIds, onCheck, filter, kebabMenu, binButton, onRowClick, selectedRow, highlightRows, className, id, tableBodyMaxHeight, noData, loading, emptyContentHeight, }: TableProps): import("react/jsx-runtime").JSX.Element;
+export declare function Table({ rowIdKey, data, formats, sort, onSort, checkedIds, onCheck, filter, kebabMenu, binButton, onRowClick, selectedRow, highlightRows, className, id, maxHeight, noData, loading, emptyBodyHeight, }: TableProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/molecules/table/body/TBody.d.ts

@@ -32,7 +32,7 @@ interface Props {
         isLoading: boolean;
         content?: React.ReactNode;
     };
-    emptyContentHeight?: number;
+    emptyBodyHeight?: number;
 }
-declare function TBody({ rowIdKey, formats, data, checkedIds, onCheck, hasActionCol, kebabMenu, binButton, onRowClick, selectedRow, highlightRows, noData, loading, emptyContentHeight, }: Props): import("react/jsx-runtime").JSX.Element;
+declare function TBody({ rowIdKey, formats, data, checkedIds, onCheck, hasActionCol, kebabMenu, binButton, onRowClick, selectedRow, highlightRows, noData, loading, emptyBodyHeight, }: Props): import("react/jsx-runtime").JSX.Element;
 export default TBody;

package/dist/components/molecules/table/body/TBodyEmptyContent.d.ts

@@ -9,7 +9,7 @@ interface Props {
         isLoading: boolean;
         content?: React.ReactNode;
     };
-    emptyContentHeight?: number;
+    emptyBodyHeight?: number;
 }
-declare function TBodyEmptyContent({ status, noData, loading, emptyContentHeight, }: Props): import("react/jsx-runtime").JSX.Element;
+declare function TBodyEmptyContent({ status, noData, loading, emptyBodyHeight, }: Props): import("react/jsx-runtime").JSX.Element;
 export default TBodyEmptyContent;

package/dist/components/molecules/table/header/SortableColumn.d.ts

@@ -1,8 +1,15 @@
 import { IColumnFormats, ISort } from '../types';
 interface Props {
     format: IColumnFormats;
-    currentSort?: ISort;
-    onSortClick: (columnName: string, sortable: boolean) => () => void;
+    sort?: ISort;
+    onSortClick: (columnName: string) => () => void;
 }
-declare function SortableColumn({ format, currentSort, onSortClick }: Props): import("react/jsx-runtime").JSX.Element;
+/**
+ * 정렬 아닌거 마우스오버하면 쌍방 화살표
+ * 내림차순 정렬이면 아래 화살표
+ * 오름차순 정렬이면 위 화살표
+ * 색깔은 언제나 b500 #5c5c5c
+ * @returns
+ */
+declare function SortableColumn({ format, sort, onSortClick }: Props): import("react/jsx-runtime").JSX.Element;
 export default SortableColumn;

package/dist/components/molecules/table/header/THead.d.ts

@@ -1,8 +1,9 @@
+import React from 'react';
 import { IColumnFormats, ISort } from '../types';
 interface Props {
     formats: IColumnFormats[];
-    currentSort?: ISort;
-    onSortClick: (columnName: string, sortable: boolean) => () => void;
+    sort?: ISort;
+    onSortClick: (columnName: string) => () => void;
     hasCheckbox?: boolean;
     allCheckbox: boolean;
     onAllCheck: (checked: boolean) => void;
@@ -11,6 +12,8 @@ interface Props {
         on: boolean;
         onReset: () => void;
     };
+    filterToggle: boolean;
+    setFilterToggle: React.Dispatch<React.SetStateAction<boolean>>;
 }
-declare function THead({ formats, currentSort, onSortClick, hasCheckbox, allCheckbox, onAllCheck, hasActionCol, filter, }: Props): import("react/jsx-runtime").JSX.Element;
+declare function THead({ formats, sort, onSortClick, hasCheckbox, allCheckbox, onAllCheck, hasActionCol, filter, filterToggle, setFilterToggle, }: Props): import("react/jsx-runtime").JSX.Element;
 export default THead;

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

@@ -82,9 +82,12 @@ export interface TableProps {
     className?: string;
     id?: string;
     /**
-     * body의 최대 높이
+     * 테이블의 최대 높이 px  (@v2_old tableBodyMaxHeight)
+     */
+    maxHeight?: number;
+    /**
+     * 테이블의 최소 너비 px
      */
-    tableBodyMaxHeight?: number;
     /**
      * 데이터가 없을때의 조건과 문구
      */
@@ -100,7 +103,7 @@ export interface TableProps {
         content?: React.ReactNode;
     };
     /**
-     * 데이터가 없거나 로딩일때 높이
+     * 데이터가 없거나 로딩일때 테이블 바디(1행) 높이
      */
-    emptyContentHeight?: number;
+    emptyBodyHeight?: number;
 }

package/dist/components/molecules/toast/Toast.d.ts

@@ -1,15 +1,29 @@
-import React from 'react';
 import { IToastDetailItem } from './types';
 import { TToastVariant } from '../../../enums/variant';
 export interface IToast {
     variant: TToastVariant;
     content: string;
-    description?: React.ReactNode;
+    title?: {
+        main: string;
+        sub?: string;
+    };
+    closeButton?: {
+        content: string;
+        onClick: () => void;
+    };
     details?: IToastDetailItem[];
     disableAutoOff?: boolean;
 }
 export interface ToastProps {
     id: string;
+    /**
+     * @param variant 'success', 'warning', 'danger'
+     * @param content 컴포넌트에 들어갈 한 줄짜리 내용(string)
+     * @param title {main: string, sub?: string}
+     * @param closeButton 닫기 버튼 커스텀 (default는 x 아이콘 버튼) {content: string, onClick: () => void}
+     * @param details details, summary 태그를 활용하여 노출할 내용 (legacy)
+     * @param disableAutoOff 자동 꺼짐 불가 여부(boolean)
+     */
     toast: IToast;
     drop: (id: string) => void;
     className?: string;

package/dist/components/molecules/toast/ToastStyle.d.ts

@@ -1,21 +1,18 @@
-import React from 'react';
 import { IToastDetailItem } from './types';
 import { TToastVariant } from '../../../enums/variant';
 import './toast.scss';
 export interface ToastStyleProps {
     variant: TToastVariant;
-    /**
-     * 컴포넌트에 들어갈 한 줄짜리 내용
-     */
     content: string;
-    /**
-     *  컴포넌트에 들어갈 커스텀 내용
-     */
-    description?: React.ReactNode;
-    /**
-     * details, summary 태그를 활용하여 노출할 내용
-     */
+    title?: {
+        main: string;
+        sub?: string;
+    };
+    closeButton?: {
+        content: string;
+        onClick: () => void;
+    };
     details?: IToastDetailItem[];
     onClose: () => void;
 }
-export declare function ToastStyle({ variant, content, description, details, onClose, }: ToastStyleProps): import("react/jsx-runtime").JSX.Element;
+export declare function ToastStyle({ variant, content, title, closeButton, details, onClose, }: ToastStyleProps): import("react/jsx-runtime").JSX.Element;