@megha-ui/react 1.2.481 → 1.2.483

package/dist/components/grid/index.js

@@ -36,7 +36,7 @@ import { TbCopy, TbCopyOff } from "react-icons/tb";
 import { formatValue } from "../../services/commonService";
 const Grid = ({ columns, wrapperClass, updateGridColumns, data, height, sortable = true, paginate, rowsPerPageOptions = [10, 20, 50, 100], defaultRowsPerPage = 100, widthMode = "custom", bulkSelect = false, cellBorder = false, rowHeight = 38, onRowClick, rowCount = false, rowBorder = true, showMenu = false, search = false, defaultSearchOperation = "contains", gridBorder = false, isLoading = false, rowTopBorder, rowBottomBorder, rowLeftBorder, rowRightBorder, headerBackground = "var(--row-header-bg)", headerTopBorder = "none", headerBottomBorder = "none", SettingIcon, ExportIcon, ignoredExportItems = ["action", "actions"], borderColor = "#dbdfe9", updateColumns, showHideAvailable = false, columnSearchOutside = false, multiSorting = false, exportAvailable = false, exportableFileName = "", groupBy, updateGroupBy, rowKey = "id", hlBorderColor = "black", selectedRow, selectedRowStyle = {
     borderLeft: "0.5rem solid #d9d9d9",
-}, defaultSort, noKeyEvents = true, customOperation, hasCustomOperation, globalSearch, headerDropdownIndex, draggable = false, resizable = false, updateGridData, widthUnits, checkboxWrapper, ignoreHugContent = false, isSummarise = false, isHideDups = false, fullScreenAvailable = true, defaultGroupOpen, alternateRowColor = true, activeCalculateColor = "#2377BA", calculatetextColor = "#fff", actionsKey = "actions", saveAsNewView = false, handleSaveAsView, saveAsViewIcon, filterData, chipColor = "#ccc", withAscii = false, propSummariseKeys, SummariseIcon, summarizeColor = "black", isExpandable = false, expandedRow, extraRow, selectedCheckBox, setSelectedCheckbox, ignoreRowSelect, setOpenedRows, openedRows, getLoadingState, globalSearchOpen = false, updateFixedFilterValues = (fixedFilterValues) => {
+}, defaultSort, noKeyEvents = true, customOperation, hasCustomOperation, globalSearch, headerDropdownIndex, draggable = false, resizable = false, updateGridData, widthUnits, checkboxWrapper, ignoreHugContent = false, isSummarise = false, isHideDups = false, isMultipleChips = false, fullScreenAvailable = true, defaultGroupOpen, alternateRowColor = true, activeCalculateColor = "#2377BA", calculatetextColor = "#fff", actionsKey = "actions", saveAsNewView = false, handleSaveAsView, saveAsViewIcon, filterData, chipColor = "#ccc", withAscii = false, propSummariseKeys, SummariseIcon, summarizeColor = "black", isExpandable = false, expandedRow, extraRow, selectedCheckBox, setSelectedCheckbox, ignoreRowSelect, setOpenedRows, openedRows, getLoadingState, globalSearchOpen = false, updateFixedFilterValues = (fixedFilterValues) => {
     console.log("Update fixed filter values not implemented", fixedFilterValues);
 }, locale, formatOptions, exportOptions, 
 // Card wrapper props
@@ -126,11 +126,11 @@ withCard = false, cardClassName, cardHeader, title, headerLeft, headerRight, sub
             }, {});
             _columns = _columns.map((item) => {
                 var _a, _b;
-                return (Object.assign(Object.assign({}, item), { dataType: (_b = (_a = item.dataType) !== null && _a !== void 0 ? _a : columnData === null || columnData === void 0 ? void 0 : columnData[item.key]) !== null && _b !== void 0 ? _b : "string" }));
+                return (Object.assign(Object.assign({}, item), { isArrayString: isMultipleChips, dataType: (_b = (_a = item.dataType) !== null && _a !== void 0 ? _a : columnData === null || columnData === void 0 ? void 0 : columnData[item.key]) !== null && _b !== void 0 ? _b : "string" }));
             });
         }
         setGridColumns(_columns);
-    }, [columns, data]);
+    }, [columns, data, isMultipleChips]);
     useEffect(() => {
         if (globalSearchOpen) {
             setExpandedGI(true);

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

@@ -24,6 +24,7 @@ export interface Column {
         action: () => void;
     }>;
     renderer?: (item: any) => JSX.Element;
+    isArrayString?: boolean;
 }
 export interface DataRow {
     [key: string]: {
@@ -128,6 +129,7 @@ export interface OjasGridProps {
     }) => void;
     isSummarise?: boolean;
     isHideDups?: boolean;
+    isMultipleChips?: boolean;
     defaultGroupOpen?: boolean;
     alternateRowColor?: boolean;
     activeCalculateColor?: string;

package/dist/components/grid/utils/gridRow.js

@@ -131,7 +131,10 @@ const GridRow = ({ item, rowStyle, cellStyle, rowHeight, bulkSelect, selectedRow
                         .toString()
                         .split(">>")
                         .map((item) => `<div>${item}</div>`)
-                        .join("")}</div>`, children: cellData.value.toString().split(">>").length > 1 ? (_jsxs(_Fragment, { children: [_jsxs("span", { children: ["Multiple ", `(${cellData.value.toString().split(">>").length})`] }), _jsx(Tooltip, { className: "custom-tooltip", id: (_b = item.id.value.toString()) !== null && _b !== void 0 ? _b : colIndex.toString(), place: "top" })] })) : (_jsx("span", { children: cellData.value })) })) : cellData && Object.keys(cellData).includes("html") ? (cellData === null || cellData === void 0 ? void 0 : cellData.html) : cellData && Object.keys(cellData).includes("value") ? (formatValue(cellData === null || cellData === void 0 ? void 0 : cellData.value, (_c = column.dataType) !== null && _c !== void 0 ? _c : "string", locale, formatOptions)) : cellData ? (cellData) : ("");
+                        .join("")}</div>`, children: cellData.value.toString().split(">>").length > 1 ? (_jsx(_Fragment, { children: column.isArrayString ?
+                            _jsx("div", { className: "flex items-center", children: cellData.value.toString().split(">>").map(item => (_jsx("div", { className: "text-[var(--foreground)] rounded-lg bg-[var(--brand)]", children: item }))) })
+                            :
+                                _jsxs(_Fragment, { children: [_jsxs("span", { children: ["Multiple ", `(${cellData.value.toString().split(">>").length})`] }), _jsx(Tooltip, { className: "custom-tooltip", id: (_b = item.id.value.toString()) !== null && _b !== void 0 ? _b : colIndex.toString(), place: "top" })] }) })) : (_jsx("span", { children: cellData.value })) })) : cellData && Object.keys(cellData).includes("html") ? (cellData === null || cellData === void 0 ? void 0 : cellData.html) : cellData && Object.keys(cellData).includes("value") ? (formatValue(cellData === null || cellData === void 0 ? void 0 : cellData.value, (_c = column.dataType) !== null && _c !== void 0 ? _c : "string", locale, formatOptions)) : cellData ? (cellData) : ("");
                 const cellUrl = cellData === null || cellData === void 0 ? void 0 : cellData.url;
                 const isHidden = column.overflowHidden;
                 if (!column.hidden && !groupByKeys.includes(column.key)) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@megha-ui/react",
-  "version": "1.2.481",
+  "version": "1.2.483",
   "description": "A collection of reusable UI components for React applications, built with TypeScript.",
   "main": "./dist/index.js",
   "module": "./dist/index.js",