awing-library 2.1.2-dev.71 → 2.1.2-dev.73

package/dist/esm/AWING/TableEditableCollapsible/interface.d.ts

@@ -24,7 +24,7 @@ export interface ColumnDefinition<T extends object> {
 }
 export type TableEditableProps<T> = {
     columnDefinitions: Array<ColumnDefinition<Partial<T>>>;
-    fieldDefinitions: Array<ColumnDefinition<Partial<T>>>;
+    fieldDefinitions?: Array<ColumnDefinition<Partial<T>>>;
     items: Array<Partial<T>>;
     onChange(newData: Array<Partial<T>>, dataValid: boolean, fieldName?: keyof T): void;
     getRowId?(obj: Partial<T>): number;
@@ -92,5 +92,8 @@ export interface TableRowEditableProps<T> {
 export interface TableCellEditableProps<T extends object> {
     cellDefinition: CellDefinition<T>;
     isContainer?: boolean;
+    isShowCollapsible?: boolean;
+    isCollapsed?: boolean;
     numOfRowSpan?: number;
+    onToggleCollapsible?: () => void;
 }

package/dist/esm/index.js

@@ -177625,7 +177625,10 @@ function TableCellEditable(props) {
   const {
     isContainer,
     cellDefinition,
-    numOfRowSpan
+    numOfRowSpan,
+    isShowCollapsible,
+    isCollapsed,
+    onToggleCollapsible
   } = props;
   const {
     TableCellProps,
@@ -177657,20 +177660,27 @@ function TableCellEditable(props) {
         children: renderDataInput()
       })
     }) : renderDataInput()
-  }) : jsxRuntimeExports.jsx(TableCell, Object.assign({
+  }) : jsxRuntimeExports.jsxs(TableCell, Object.assign({
     sx: {
       p: 1,
       border: error ? '2px solid #ED1D25' : '1px solid rgb(224, 224, 224)'
     },
     rowSpan: numOfRowSpan
   }, TableCellProps, {
-    children: isTooltip ? jsxRuntimeExports.jsx(StyleTooltip$1, {
+    children: [!!isShowCollapsible &&
+    // Hiển thị icon mở rộng, ở cột đầu tiên
+    jsxRuntimeExports.jsx(IconButton$1, {
+      "aria-label": "expand row",
+      size: "small",
+      onClick: onToggleCollapsible,
+      children: isCollapsed ? jsxRuntimeExports.jsx(KeyboardArrowDown, {}) : jsxRuntimeExports.jsx(KeyboardArrowRight, {})
+    }), isTooltip ? jsxRuntimeExports.jsx(StyleTooltip$1, {
       title: getTitleTooltip && getTitleTooltip(value) || '',
       placement: "top-start",
       children: jsxRuntimeExports.jsx(Stack, {
         children: renderDataInput()
       })
-    }) : renderDataInput()
+    }) : renderDataInput()]
   }));
 }
 
@@ -177777,6 +177787,9 @@ function TableRowEditable(props) {
             const numOfRowSpan = isMergeColumn ? convertItems.filter(c => c[fieldName] === row[fieldName]).length : 1;
             const error = ((_c = dataValidation === null || dataValidation === void 0 ? void 0 : dataValidation[rowIdx]) === null || _c === void 0 ? void 0 : _c[fieldName]) !== undefined && !((_d = dataValidation === null || dataValidation === void 0 ? void 0 : dataValidation[rowIdx]) === null || _d === void 0 ? void 0 : _d[fieldName]);
             return isDisplay && jsxRuntimeExports.jsx(TableCellEditable, {
+              isShowCollapsible: idx === 0,
+              isCollapsed: open,
+              onToggleCollapsible: () => setOpen(!open),
               cellDefinition: Object.assign(Object.assign({}, colDef.editFieldDefinition), {
                 row,
                 TableCellProps: colDef.TableCellProps,
@@ -178110,7 +178123,7 @@ function TableEditable(props) {
         var _a;
         return ((_a = x.editFieldDefinition) === null || _a === void 0 ? void 0 : _a.fieldName) === fieldName;
       })) === null || _a === void 0 ? void 0 : _a.editFieldDefinition;
-      let collapField = (_b = fieldDefinitions.find(x => {
+      let collapField = (_b = fieldDefinitions === null || fieldDefinitions === void 0 ? void 0 : fieldDefinitions.find(x => {
         var _a;
         return ((_a = x.editFieldDefinition) === null || _a === void 0 ? void 0 : _a.fieldName) === fieldName;
       })) === null || _b === void 0 ? void 0 : _b.editFieldDefinition;
@@ -178289,7 +178302,7 @@ function TableEditable(props) {
     children: [jsxRuntimeExports.jsxs(TableContainer, {
       component: Paper$1,
       sx: {
-        overflow: 'hidden'
+        // overflow: 'hidden',
       },
       children: [selected && onSelectedChange && selected.length > 0 && selectionActions && jsxRuntimeExports.jsx(TopBarActions, {
         selected: selected,

package/dist/index.d.ts

@@ -1826,7 +1826,7 @@ interface ColumnDefinition<T extends object> {
 }
 type TableEditableProps<T> = {
     columnDefinitions: Array<ColumnDefinition<Partial<T>>>;
-    fieldDefinitions: Array<ColumnDefinition<Partial<T>>>;
+    fieldDefinitions?: Array<ColumnDefinition<Partial<T>>>;
     items: Array<Partial<T>>;
     onChange(newData: Array<Partial<T>>, dataValid: boolean, fieldName?: keyof T): void;
     getRowId?(obj: Partial<T>): number;
@@ -1875,7 +1875,10 @@ interface TableEditableBodyProps<T> {
 interface TableCellEditableProps<T extends object> {
     cellDefinition: CellDefinition<T>;
     isContainer?: boolean;
+    isShowCollapsible?: boolean;
+    isCollapsed?: boolean;
     numOfRowSpan?: number;
+    onToggleCollapsible?: () => void;
 }
 
 declare function TableEditable<T>(props: TableEditableProps<T>): react_jsx_runtime.JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "awing-library",
-    "version": "2.1.2-dev.71",
+    "version": "2.1.2-dev.73",
     "main": "dist/esm/index.js",
     "module": "dist/esm/index.js",
     "types": "dist/index.d.ts",