gbs-add-block 0.0.35 → 0.0.36

package/README.md

@@ -1,4 +1,4 @@
-# GBS Building Blocks 2.0 (v0.0.35)
+# GBS Building Blocks 2.0 (v0.0.36)
 
 Latest and upgraded version of GBS building blocks with headless UI and removed dependencies.
 
@@ -6,10 +6,10 @@ Latest and upgraded version of GBS building blocks with headless UI and removed
 
 For detailed documentation on usage and props, Please visit: [Building Block Documentation v2.0](https://blackmax-designs.gitbook.io/building-block-v2.0)
 
-## What's New 🎉 (Ver 0.0.35)
+## What's New 🎉 (Ver 0.0.36)
 
-- Updated Form Renderer (Added Multi Select) with form builder
-- Updated Date Picker
+- Updated Form Renderer with form builder and AI support
+- Updated Grid
 
 ## Authors
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gbs-add-block",
-  "version": "0.0.35",
+  "version": "0.0.36",
   "description": "React Component Library",
   "files": [
     "index.js",

package/source/components/formrenderer/InputHandles.tsx

@@ -45,6 +45,7 @@ const InputHandles = ({
       {item?.label && (
         <label htmlFor={item.name} className="font-medium text-sm">
           {item.label}
+          {item.required && <span className="text-red-500">*</span>}
         </label>
       )}
       <Input

package/source/components/formrenderer/MultiHandles.tsx

@@ -40,6 +40,7 @@ export default function MultiHandles({
       {item?.label && (
         <label htmlFor={item.name} className="font-medium text-sm">
           {item.label}
+          {item.required && <span className="text-red-500">*</span>}
         </label>
       )}
       <MultiSelect

package/source/components/formrenderer/SelectHandles.tsx

@@ -116,6 +116,7 @@ export default function SelectHandles({
       {item?.label && (
         <label htmlFor={item.name} className="font-medium text-sm">
           {item.label}
+          {item.required && <span className="text-red-500">*</span>}
         </label>
       )}
       <Select

package/source/components/formrenderer/types.ts

@@ -1,4 +1,5 @@
 export type FormItem = {
+  id?: string;
   name?: string;
   component?: string;
   type?: string;
@@ -11,6 +12,7 @@ export type FormItem = {
   key?: string;
   dependency?: string;
   hasDependents?: boolean;
+  isReady?: boolean;
 };
 
 interface DependencyConfig {

package/source/components/grid/Grid.tsx

@@ -232,6 +232,8 @@ export const GridMemoised = forwardRef((props: GridProps, ref) => {
 
   // This will render template passed to Grid
   const renderCell = (rowData: any, column: any, rowIndex: number) => {
+    const cellValue = rowData[column.field];
+
     if (column.template) {
       return (
         <column.template
@@ -243,7 +245,18 @@ export const GridMemoised = forwardRef((props: GridProps, ref) => {
         />
       );
     }
-    return rowData[column.field];
+
+    if (column.tooltip) {
+      return (
+        <span title={cellValue?.toString()}>
+          {cellValue && cellValue.length > 10
+            ? `${cellValue.slice(0, 10)}...`
+            : cellValue}
+        </span>
+      );
+    }
+
+    return cellValue;
   };
 
   // *** Filter Handling Functions Starts Here

package/source/components/grid/RenderCell.tsx

@@ -0,0 +1,32 @@
+const renderCell = (
+  rowData: any,
+  column: any,
+  rowIndex: number,
+  currentPage: number,
+  pageSettings: any,
+  rowChange?: any
+) => {
+  const cellValue = rowData[column.field];
+
+  if (column.template) {
+    return (
+      <column.template
+        rowData={rowData}
+        rowIndex={rowIndex + currentPage * pageSettings.pageNumber}
+        rowChange={(changes: any) => {
+          if (rowChange) rowChange(changes);
+        }}
+      />
+    );
+  }
+
+  if (column.tooltip) {
+    return (
+      <span title={cellValue?.toString()}>
+        {column.tooltip ? cellValue.slice(0, 10) : cellValue}
+      </span>
+    );
+  }
+
+  return cellValue;
+};