From bcdaa9c1d6104af93236fd3919899f741c1bd05d Mon Sep 17 00:00:00 2001
From: root <sathishselvag03@gmail.com>
Date: Mon, 9 Sep 2024 00:32:42 +0530
Subject: [PATCH 01/27] Fix issue #148: maxrows and maxcols added to config
 file

---
 example.html          |  6 ++++--
 src/styles/table.pcss |  7 +++++++
 src/table.js          | 49 +++++++++++++++++++++++++++++++++++++++++++
 3 files changed, 60 insertions(+), 2 deletions(-)

diff --git a/example.html b/example.html
index 29bf431..8984527 100644
--- a/example.html
+++ b/example.html
@@ -40,7 +40,7 @@
   <pre class="output"></pre>
 
   <script src="https://cdn.jsdelivr.net/npm/@editorjs/editorjs@latest"></script>
-  <script src="dist/table.js"></script>
+  <script src="./dist/table.umd.js"></script>
 
   <script>
 
@@ -51,7 +51,9 @@
           class: Table,
           inlineToolbar: true,
           config: {
-            withHeadings: true
+            withHeadings: true,
+            maxrows : 5,
+            maxcols :5
           }
         }
       },
diff --git a/src/styles/table.pcss b/src/styles/table.pcss
index b7694cf..e9ef74e 100644
--- a/src/styles/table.pcss
+++ b/src/styles/table.pcss
@@ -148,6 +148,13 @@
   }
 }
 
+.disabled {
+  pointer-events: none; /* Disable pointer events */
+  opacity: 0.5; /* Reduce opacity to visually indicate the disabled state */
+  border :none
+  /* Add any other styles to visually indicate the disabled state */
+}
+
 .tc-row {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(10px, 1fr));
diff --git a/src/table.js b/src/table.js
index ea3e00c..8c30fad 100644
--- a/src/table.js
+++ b/src/table.js
@@ -184,6 +184,9 @@ export default class Table {
         {
           label: this.api.i18n.t('Add column to left'),
           icon: IconDirectionLeftDown,
+          hideIf: () => {
+            return  this.numberOfColumns === this.config.maxcols
+          },
           onClick: () => {
             this.addColumn(this.selectedColumn, true);
             this.hideToolboxes();
@@ -192,6 +195,10 @@ export default class Table {
         {
           label: this.api.i18n.t('Add column to right'),
           icon: IconDirectionRightDown,
+          hideIf: () => {
+            return  this.numberOfColumns === this.config.maxcols
+          }
+          ,
           onClick: () => {
             this.addColumn(this.selectedColumn + 1, true);
             this.hideToolboxes();
@@ -233,6 +240,9 @@ export default class Table {
         {
           label: this.api.i18n.t('Add row above'),
           icon: IconDirectionUpRight,
+          hideIf: () => {
+            return  this.numberOfRows === this.config.maxrows
+          },
           onClick: () => {
             this.addRow(this.selectedRow, true);
             this.hideToolboxes();
@@ -241,6 +251,9 @@ export default class Table {
         {
           label: this.api.i18n.t('Add row below'),
           icon: IconDirectionDownRight,
+          hideIf: () => {
+            return  this.numberOfRows === this.config.maxrows
+          },
           onClick: () => {
             this.addRow(this.selectedRow + 1, true);
             this.hideToolboxes();
@@ -349,6 +362,10 @@ export default class Table {
   addColumn(columnIndex = -1, setFocus = false) {
     let numberOfColumns = this.numberOfColumns;
 
+    if ((this.config && this.config.maxcols && this.numberOfColumns) >= ((this.config.maxcols))) {
+        return;
+    }
+
     /**
      * Iterate all rows and add a new cell to them for creating a column
      */
@@ -376,7 +393,15 @@ export default class Table {
       }
     }
 
+    const addColButton = this.wrapper.querySelector(`.${CSS.addColumn}`);
+    if ((this.config?.maxcols && this.numberOfColumns > this.config.maxcols - 1) && (addColButton) ){
+      addColButton.disabled = true;
+      addColButton.classList.add(CSS.disabled); 
+      addColButton.textContent =''
+    }
     this.addHeadingAttrToFirstRow();
+      
+  
   };
 
   /**
@@ -401,6 +426,10 @@ export default class Table {
      */
     let numberOfColumns = this.numberOfColumns;
 
+    if ((this.config && this.config?.maxrows && this.numberOfRows) >= (this.config?.maxrows)) {
+      return;
+  }
+
     if (index > 0 && index <= this.numberOfRows) {
       let row = this.getRow(index);
 
@@ -421,6 +450,12 @@ export default class Table {
       $.focus(insertedRowFirstCell);
     }
 
+    const addRowButton = this.wrapper.querySelector(`.${CSS.addRow}`);
+    if (((this.config && this.config?.maxrows && this.numberOfRows) > (this.config?.maxrows-1)) && (addRowButton))   {
+      addRowButton.disabled = true;
+      addRowButton.classList.add(CSS.disabled); 
+      addRowButton.textContent =''
+    }
     return insertedRow;
   };
 
@@ -439,6 +474,14 @@ export default class Table {
 
       cell.remove();
     }
+    const addColButton = this.wrapper.querySelector(`.${CSS.addColumn}`);
+    if (addColButton) {
+      addColButton.innerHTML = IconPlus;
+      addColButton.disabled = false;
+      addColButton.classList.remove(CSS.disabled); 
+      
+    }
+
   }
 
   /**
@@ -448,6 +491,12 @@ export default class Table {
    */
   deleteRow(index) {
     this.getRow(index).remove();
+    const addRowButton = this.wrapper.querySelector(`.${CSS.addRow}`);
+    if (addRowButton) {
+      addRowButton.innerHTML = IconPlus;
+      addRowButton.disabled = false;
+      addRowButton.classList.remove(CSS.disabled); 
+    }
 
     this.addHeadingAttrToFirstRow();
   }

From 0d5ca893fb7ff8d7f7468f321dacda00af9ccafb Mon Sep 17 00:00:00 2001
From: SATHISH S <81795912+SATHISHS03@users.noreply.github.com>
Date: Mon, 9 Sep 2024 00:45:56 +0530
Subject: [PATCH 02/27] Update table.pcss

---
 src/styles/table.pcss | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/src/styles/table.pcss b/src/styles/table.pcss
index e9ef74e..4f52d4f 100644
--- a/src/styles/table.pcss
+++ b/src/styles/table.pcss
@@ -149,10 +149,9 @@
 }
 
 .disabled {
-  pointer-events: none; /* Disable pointer events */
-  opacity: 0.5; /* Reduce opacity to visually indicate the disabled state */
-  border :none
-  /* Add any other styles to visually indicate the disabled state */
+  pointer-events: none; 
+  opacity: 0.5; 
+  border :none;
 }
 
 .tc-row {

From 0f757d5de9f339d36a6f2dbe7d609ecee77a70dd Mon Sep 17 00:00:00 2001
From: SATHISH S <81795912+SATHISHS03@users.noreply.github.com>
Date: Tue, 10 Sep 2024 13:45:38 +0530
Subject: [PATCH 03/27] Update src/table.js

Co-authored-by: e11sy <130844513+e11sy@users.noreply.github.com>
---
 src/table.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/table.js b/src/table.js
index 8c30fad..d9fb686 100644
--- a/src/table.js
+++ b/src/table.js
@@ -451,7 +451,7 @@ export default class Table {
     }
 
     const addRowButton = this.wrapper.querySelector(`.${CSS.addRow}`);
-    if (((this.config && this.config?.maxrows && this.numberOfRows) > (this.config?.maxrows-1)) && (addRowButton))   {
+    if ((this.config && this.config?.maxrows) && (this.numberOfRows >= this.config?.maxrows) && (addRowButton))   {
       addRowButton.disabled = true;
       addRowButton.classList.add(CSS.disabled); 
       addRowButton.textContent =''

From 794b7f2ac7eabf6fd6868abe970805f37eb8260c Mon Sep 17 00:00:00 2001
From: SATHISH S <81795912+SATHISHS03@users.noreply.github.com>
Date: Tue, 10 Sep 2024 13:45:48 +0530
Subject: [PATCH 04/27] Update src/table.js

Co-authored-by: e11sy <130844513+e11sy@users.noreply.github.com>
---
 src/table.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/table.js b/src/table.js
index d9fb686..e034aba 100644
--- a/src/table.js
+++ b/src/table.js
@@ -362,7 +362,7 @@ export default class Table {
   addColumn(columnIndex = -1, setFocus = false) {
     let numberOfColumns = this.numberOfColumns;
 
-    if ((this.config && this.config.maxcols && this.numberOfColumns) >= ((this.config.maxcols))) {
+    if ((this.config && this.config.maxcols) && (this.numberOfColumns >= this.config.maxcols)) {
         return;
     }
 

From 8870e7023f03081350c942bdc590b6c0b47149a5 Mon Sep 17 00:00:00 2001
From: root <sathishselvag03@gmail.com>
Date: Tue, 10 Sep 2024 14:14:17 +0530
Subject: [PATCH 05/27] added comment

---
 example.html => index.html |  0
 src/styles/table.pcss      |  5 +++++
 src/table.js               | 29 +++++++++++++++++------------
 vite.config.js             | 15 +++++++++++----
 4 files changed, 33 insertions(+), 16 deletions(-)
 rename example.html => index.html (100%)

diff --git a/example.html b/index.html
similarity index 100%
rename from example.html
rename to index.html
diff --git a/src/styles/table.pcss b/src/styles/table.pcss
index 4f52d4f..fb37885 100644
--- a/src/styles/table.pcss
+++ b/src/styles/table.pcss
@@ -95,6 +95,11 @@
     display: none;
   }
 }
+.disabled {
+  pointer-events: none; 
+  opacity: 0; 
+  border :none;
+}
 
 .tc-add-column {
   padding: 4px 0;
diff --git a/src/table.js b/src/table.js
index e034aba..095a1a1 100644
--- a/src/table.js
+++ b/src/table.js
@@ -361,10 +361,13 @@ export default class Table {
    */
   addColumn(columnIndex = -1, setFocus = false) {
     let numberOfColumns = this.numberOfColumns;
-
+     /**
+      * Check if the number of columns has reached the maximum allowed columns specified in the configuration,
+      * and if so, exit the function to prevent adding more columns beyond the limit.
+      */
     if ((this.config && this.config.maxcols) && (this.numberOfColumns >= this.config.maxcols)) {
-        return;
-    }
+      return;
+  }
 
     /**
      * Iterate all rows and add a new cell to them for creating a column
@@ -396,7 +399,7 @@ export default class Table {
     const addColButton = this.wrapper.querySelector(`.${CSS.addColumn}`);
     if ((this.config?.maxcols && this.numberOfColumns > this.config.maxcols - 1) && (addColButton) ){
       addColButton.disabled = true;
-      addColButton.classList.add(CSS.disabled); 
+      addColButton.classList.add("disabled"); 
       addColButton.textContent =''
     }
     this.addHeadingAttrToFirstRow();
@@ -425,10 +428,13 @@ export default class Table {
      * It is necessary that the first line is filled in correctly
      */
     let numberOfColumns = this.numberOfColumns;
-
-    if ((this.config && this.config?.maxrows && this.numberOfRows) >= (this.config?.maxrows)) {
-      return;
-  }
+     /**
+      * Check if the number of rows has reached the maximum allowed rows specified in the configuration,
+      * and if so, exit the function to prevent adding more columns beyond the limit.
+      */  
+    if ((this.config && this.config?.maxrows) && (this.numberOfRows >= this.config?.maxrows) && (addRowButton))   {
+          return ;
+        }
 
     if (index > 0 && index <= this.numberOfRows) {
       let row = this.getRow(index);
@@ -453,7 +459,7 @@ export default class Table {
     const addRowButton = this.wrapper.querySelector(`.${CSS.addRow}`);
     if ((this.config && this.config?.maxrows) && (this.numberOfRows >= this.config?.maxrows) && (addRowButton))   {
       addRowButton.disabled = true;
-      addRowButton.classList.add(CSS.disabled); 
+      addRowButton.classList.add("disabled"); 
       addRowButton.textContent =''
     }
     return insertedRow;
@@ -478,10 +484,9 @@ export default class Table {
     if (addColButton) {
       addColButton.innerHTML = IconPlus;
       addColButton.disabled = false;
-      addColButton.classList.remove(CSS.disabled); 
+      addColButton.classList.remove("disabled"); 
       
     }
-
   }
 
   /**
@@ -495,7 +500,7 @@ export default class Table {
     if (addRowButton) {
       addRowButton.innerHTML = IconPlus;
       addRowButton.disabled = false;
-      addRowButton.classList.remove(CSS.disabled); 
+      addRowButton.classList.remove("disabled"); 
     }
 
     this.addHeadingAttrToFirstRow();
diff --git a/vite.config.js b/vite.config.js
index 5de0928..5ddcd7b 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -19,9 +19,16 @@ export default {
     NODE_ENV: JSON.stringify(NODE_ENV),
     VERSION: JSON.stringify(VERSION),
   },
-
+  server: {
+    open: true, 
+    watch: {
+      usePolling: true, 
+    },
+  },
   plugins: [
-    cssInjectedByJsPlugin({useStrictCSP: true}),
-    dts({tsconfigPath: './tsconfig.json'})
-  ]
+    cssInjectedByJsPlugin({ useStrictCSP: true }),
+    dts({ tsconfigPath: './tsconfig.json' })
+  ],
+  
+  
 };

From 514e1f200136905b242ef419a06d1b1a1d9e421f Mon Sep 17 00:00:00 2001
From: SATHISH S <81795912+SATHISHS03@users.noreply.github.com>
Date: Tue, 10 Sep 2024 20:03:38 +0530
Subject: [PATCH 06/27] Update src/table.js

Co-authored-by: e11sy <130844513+e11sy@users.noreply.github.com>
---
 src/table.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/table.js b/src/table.js
index 095a1a1..f309a91 100644
--- a/src/table.js
+++ b/src/table.js
@@ -197,8 +197,7 @@ export default class Table {
           icon: IconDirectionRightDown,
           hideIf: () => {
             return  this.numberOfColumns === this.config.maxcols
-          }
-          ,
+          },
           onClick: () => {
             this.addColumn(this.selectedColumn + 1, true);
             this.hideToolboxes();

From af7c846ac96b2b82eb5b87de6ca1c6a958def5ef Mon Sep 17 00:00:00 2001
From: SATHISH S <sathishselvag03@gmail.com>
Date: Sat, 14 Sep 2024 17:59:08 +0530
Subject: [PATCH 07/27] Removed the tc-add-row , on maxrow

---
 src/table.js | 23 +++++++++++++----------
 1 file changed, 13 insertions(+), 10 deletions(-)

diff --git a/src/table.js b/src/table.js
index f309a91..213340b 100644
--- a/src/table.js
+++ b/src/table.js
@@ -455,11 +455,10 @@ export default class Table {
       $.focus(insertedRowFirstCell);
     }
 
-    const addRowButton = this.wrapper.querySelector(`.${CSS.addRow}`);
+    let addRowButton = this.wrapper.querySelector(`.${CSS.addRow}`);
     if ((this.config && this.config?.maxrows) && (this.numberOfRows >= this.config?.maxrows) && (addRowButton))   {
-      addRowButton.disabled = true;
-      addRowButton.classList.add("disabled"); 
-      addRowButton.textContent =''
+      addRowButton.remove();
+      
     }
     return insertedRow;
   };
@@ -495,12 +494,16 @@ export default class Table {
    */
   deleteRow(index) {
     this.getRow(index).remove();
-    const addRowButton = this.wrapper.querySelector(`.${CSS.addRow}`);
-    if (addRowButton) {
-      addRowButton.innerHTML = IconPlus;
-      addRowButton.disabled = false;
-      addRowButton.classList.remove("disabled"); 
-    }
+    const RowButton = $.make('div', CSS.addRow, {
+      innerHTML: IconPlus
+    })
+      if((!this.wrapper.querySelector(`.${CSS.addRow}`)) &&(!this.wrapper.querySelector(`.${CSS.addColumn}`))){
+        $.insertAfter(RowButton,this.wrapper.querySelector(`.${CSS.table}`))
+      }
+      else if (!this.wrapper.querySelector(`.${CSS.addRow}`)) {
+      $.insertAfter(RowButton,this.wrapper.querySelector(`.${CSS.addColumn}`))
+      }
+  
 
     this.addHeadingAttrToFirstRow();
   }

From 648aa09c20ce95124d63f49a41961c9921168c74 Mon Sep 17 00:00:00 2001
From: SATHISH S <sathishselvag03@gmail.com>
Date: Sat, 14 Sep 2024 21:39:43 +0530
Subject: [PATCH 08/27] removed unwanted margins

---
 src/styles/table.pcss | 11 -----------
 src/table.js          | 39 +++++++++++++++++++++++++--------------
 2 files changed, 25 insertions(+), 25 deletions(-)

diff --git a/src/styles/table.pcss b/src/styles/table.pcss
index fb37885..b7694cf 100644
--- a/src/styles/table.pcss
+++ b/src/styles/table.pcss
@@ -95,11 +95,6 @@
     display: none;
   }
 }
-.disabled {
-  pointer-events: none; 
-  opacity: 0; 
-  border :none;
-}
 
 .tc-add-column {
   padding: 4px 0;
@@ -153,12 +148,6 @@
   }
 }
 
-.disabled {
-  pointer-events: none; 
-  opacity: 0.5; 
-  border :none;
-}
-
 .tc-row {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(10px, 1fr));
diff --git a/src/table.js b/src/table.js
index 213340b..3d35405 100644
--- a/src/table.js
+++ b/src/table.js
@@ -394,16 +394,17 @@ export default class Table {
         }
       }
     }
-
+    
     const addColButton = this.wrapper.querySelector(`.${CSS.addColumn}`);
-    if ((this.config?.maxcols && this.numberOfColumns > this.config.maxcols - 1) && (addColButton) ){
-      addColButton.disabled = true;
-      addColButton.classList.add("disabled"); 
-      addColButton.textContent =''
+    
+    if (this.config?.maxcols && this.numberOfColumns >= this.config.maxcols && addColButton) {
+      if(addColButton){
+        addColButton.remove(); 
+      }
+      this.wrapper.style.setProperty('grid-template-columns', 'calc(100% - var(--cell-size))');
     }
-    this.addHeadingAttrToFirstRow();
-      
   
+    this.addHeadingAttrToFirstRow();
   };
 
   /**
@@ -455,7 +456,7 @@ export default class Table {
       $.focus(insertedRowFirstCell);
     }
 
-    let addRowButton = this.wrapper.querySelector(`.${CSS.addRow}`);
+    const addRowButton = this.wrapper.querySelector(`.${CSS.addRow}`);
     if ((this.config && this.config?.maxrows) && (this.numberOfRows >= this.config?.maxrows) && (addRowButton))   {
       addRowButton.remove();
       
@@ -478,12 +479,18 @@ export default class Table {
 
       cell.remove();
     }
-    const addColButton = this.wrapper.querySelector(`.${CSS.addColumn}`);
-    if (addColButton) {
-      addColButton.innerHTML = IconPlus;
-      addColButton.disabled = false;
-      addColButton.classList.remove("disabled"); 
-      
+    /**  
+     * To add addcolumn , when it is lesser than maxcol
+     */
+    const addColumnButton = $.make('div', CSS.addColumn, {
+      innerHTML: IconPlus
+    })
+    const table = this.wrapper.querySelector(`.tc-table`)
+    if (!this.wrapper.querySelector(`.${CSS.addColumn}`)) {
+      this.wrapper.style.setProperty('grid-template-columns', 'calc(100% - var(--cell-size)) var(--cell-size)');
+      if(addColumnButton){
+        $.insertAfter(addColumnButton,table)      
+      }
     }
   }
 
@@ -494,6 +501,10 @@ export default class Table {
    */
   deleteRow(index) {
     this.getRow(index).remove();
+     /** 
+      * To add addrow , when it is lesser than maxrow
+      */ 
+
     const RowButton = $.make('div', CSS.addRow, {
       innerHTML: IconPlus
     })

From ffb83826f7e6811d209bc53a19233edcc6aa16f8 Mon Sep 17 00:00:00 2001
From: SATHISH S <sathishselvag03@gmail.com>
Date: Mon, 23 Sep 2024 21:50:44 +0530
Subject: [PATCH 09/27] merging the solution from the branch

---
 src/styles/table.pcss |  2 +-
 src/table.js          | 54 +++++++++++++------------------------------
 2 files changed, 17 insertions(+), 39 deletions(-)

diff --git a/src/styles/table.pcss b/src/styles/table.pcss
index b7694cf..6c01bdd 100644
--- a/src/styles/table.pcss
+++ b/src/styles/table.pcss
@@ -190,4 +190,4 @@
 
 .tc-wrap--readonly .tc-row::after {
   display: none;
-}
+}
\ No newline at end of file
diff --git a/src/table.js b/src/table.js
index 3d35405..ea9fd96 100644
--- a/src/table.js
+++ b/src/table.js
@@ -197,7 +197,8 @@ export default class Table {
           icon: IconDirectionRightDown,
           hideIf: () => {
             return  this.numberOfColumns === this.config.maxcols
-          },
+          }
+          ,
           onClick: () => {
             this.addColumn(this.selectedColumn + 1, true);
             this.hideToolboxes();
@@ -394,17 +395,14 @@ export default class Table {
         }
       }
     }
-    
+
     const addColButton = this.wrapper.querySelector(`.${CSS.addColumn}`);
-    
-    if (this.config?.maxcols && this.numberOfColumns >= this.config.maxcols && addColButton) {
-      if(addColButton){
-        addColButton.remove(); 
-      }
-      this.wrapper.style.setProperty('grid-template-columns', 'calc(100% - var(--cell-size))');
+    if ((this.config?.maxcols && this.numberOfColumns > this.config.maxcols - 1) && (addColButton) ){
+      addColButton.style.visibility ="hidden"
     }
-  
     this.addHeadingAttrToFirstRow();
+      
+  
   };
 
   /**
@@ -458,8 +456,7 @@ export default class Table {
 
     const addRowButton = this.wrapper.querySelector(`.${CSS.addRow}`);
     if ((this.config && this.config?.maxrows) && (this.numberOfRows >= this.config?.maxrows) && (addRowButton))   {
-      addRowButton.remove();
-      
+      addRowButton.style.display = "none"
     }
     return insertedRow;
   };
@@ -479,18 +476,9 @@ export default class Table {
 
       cell.remove();
     }
-    /**  
-     * To add addcolumn , when it is lesser than maxcol
-     */
-    const addColumnButton = $.make('div', CSS.addColumn, {
-      innerHTML: IconPlus
-    })
-    const table = this.wrapper.querySelector(`.tc-table`)
-    if (!this.wrapper.querySelector(`.${CSS.addColumn}`)) {
-      this.wrapper.style.setProperty('grid-template-columns', 'calc(100% - var(--cell-size)) var(--cell-size)');
-      if(addColumnButton){
-        $.insertAfter(addColumnButton,table)      
-      }
+    const addColButton = this.wrapper.querySelector(`.${CSS.addColumn}`);
+    if (addColButton) {
+      addColButton.style.visibility = "visible"
     }
   }
 
@@ -501,20 +489,10 @@ export default class Table {
    */
   deleteRow(index) {
     this.getRow(index).remove();
-     /** 
-      * To add addrow , when it is lesser than maxrow
-      */ 
-
-    const RowButton = $.make('div', CSS.addRow, {
-      innerHTML: IconPlus
-    })
-      if((!this.wrapper.querySelector(`.${CSS.addRow}`)) &&(!this.wrapper.querySelector(`.${CSS.addColumn}`))){
-        $.insertAfter(RowButton,this.wrapper.querySelector(`.${CSS.table}`))
-      }
-      else if (!this.wrapper.querySelector(`.${CSS.addRow}`)) {
-      $.insertAfter(RowButton,this.wrapper.querySelector(`.${CSS.addColumn}`))
-      }
-  
+    const addRowButton = this.wrapper.querySelector(`.${CSS.addRow}`);
+    if (addRowButton) {
+      addRowButton.style.display ="flex"
+    }
 
     this.addHeadingAttrToFirstRow();
   }
@@ -1031,4 +1009,4 @@ export default class Table {
   destroy() {
     document.removeEventListener('click', this.documentClicked);
   }
-}
+}
\ No newline at end of file

From ffe7844af094837f54e1b9708d3abb58fb4f3a65 Mon Sep 17 00:00:00 2001
From: SATHISH S <sathishselvag03@gmail.com>
Date: Tue, 24 Sep 2024 13:48:00 +0530
Subject: [PATCH 10/27] code refactoring

---
 src/styles/table.pcss |  7 +++++++
 src/table.js          | 12 +++++++-----
 2 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/src/styles/table.pcss b/src/styles/table.pcss
index 6c01bdd..bf9504f 100644
--- a/src/styles/table.pcss
+++ b/src/styles/table.pcss
@@ -100,6 +100,9 @@
   padding: 4px 0;
   justify-content: center;
   border-top: 1px solid var(--color-border);
+  &--disabled{
+    visibility:hidden;
+  }
 
   @media print {
     display: none;
@@ -111,6 +114,9 @@
   align-items: center;
   padding-left: 4px;
   position: relative;
+  &--disabled{
+    display : none;
+  }
 
   &::before {
     content: "";
@@ -145,6 +151,7 @@
       transition: 0.1s;
       background-color: var(--color-background);
     }
+
   }
 }
 
diff --git a/src/table.js b/src/table.js
index ea9fd96..33a4282 100644
--- a/src/table.js
+++ b/src/table.js
@@ -21,7 +21,9 @@ const CSS = {
   cell: 'tc-cell',
   cellSelected: 'tc-cell--selected',
   addRow: 'tc-add-row',
-  addColumn: 'tc-add-column'
+  addColumn: 'tc-add-column',
+  disabledCol : 'tc-add-column--disabled',
+  disabledRow : 'tc-add-row--disabled',
 };
 
 /**
@@ -398,7 +400,7 @@ export default class Table {
 
     const addColButton = this.wrapper.querySelector(`.${CSS.addColumn}`);
     if ((this.config?.maxcols && this.numberOfColumns > this.config.maxcols - 1) && (addColButton) ){
-      addColButton.style.visibility ="hidden"
+      addColButton.classList.add(CSS.disabledCol);
     }
     this.addHeadingAttrToFirstRow();
       
@@ -456,7 +458,7 @@ export default class Table {
 
     const addRowButton = this.wrapper.querySelector(`.${CSS.addRow}`);
     if ((this.config && this.config?.maxrows) && (this.numberOfRows >= this.config?.maxrows) && (addRowButton))   {
-      addRowButton.style.display = "none"
+      addRowButton.classList.add(CSS.disabledRow);
     }
     return insertedRow;
   };
@@ -478,7 +480,7 @@ export default class Table {
     }
     const addColButton = this.wrapper.querySelector(`.${CSS.addColumn}`);
     if (addColButton) {
-      addColButton.style.visibility = "visible"
+    addColButton.classList.remove(CSS.disabledCol);
     }
   }
 
@@ -491,7 +493,7 @@ export default class Table {
     this.getRow(index).remove();
     const addRowButton = this.wrapper.querySelector(`.${CSS.addRow}`);
     if (addRowButton) {
-      addRowButton.style.display ="flex"
+      addRowButton.classList.remove(CSS.disabledRow);
     }
 
     this.addHeadingAttrToFirstRow();

From 753087eba147e2309908e2000f689e67b71fe09d Mon Sep 17 00:00:00 2001
From: SATHISH S <sathishselvag03@gmail.com>
Date: Tue, 24 Sep 2024 13:56:58 +0530
Subject: [PATCH 11/27] code refactoring

---
 src/styles/table.pcss | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/styles/table.pcss b/src/styles/table.pcss
index bf9504f..fff1886 100644
--- a/src/styles/table.pcss
+++ b/src/styles/table.pcss
@@ -101,7 +101,7 @@
   justify-content: center;
   border-top: 1px solid var(--color-border);
   &--disabled{
-    visibility:hidden;
+    visibility: hidden;
   }
 
   @media print {
@@ -151,7 +151,6 @@
       transition: 0.1s;
       background-color: var(--color-background);
     }
-
   }
 }
 

From e4b7be6304194eb35595cdd767cbfa7d0be89718 Mon Sep 17 00:00:00 2001
From: SATHISH S <81795912+SATHISHS03@users.noreply.github.com>
Date: Tue, 24 Sep 2024 20:53:03 +0530
Subject: [PATCH 12/27] Update index.html

Co-authored-by: e11sy <130844513+e11sy@users.noreply.github.com>
---
 index.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/index.html b/index.html
index 8984527..dfa2c87 100644
--- a/index.html
+++ b/index.html
@@ -52,8 +52,8 @@
           inlineToolbar: true,
           config: {
             withHeadings: true,
-            maxrows : 5,
-            maxcols :5
+            maxrows: 5,
+            maxcols: 5
           }
         }
       },

From 0df776d5d71c41462d3c1c41b65c575f1e93bebe Mon Sep 17 00:00:00 2001
From: SATHISH S <81795912+SATHISHS03@users.noreply.github.com>
Date: Tue, 24 Sep 2024 20:53:17 +0530
Subject: [PATCH 13/27] Update src/styles/table.pcss

Co-authored-by: e11sy <130844513+e11sy@users.noreply.github.com>
---
 src/styles/table.pcss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/styles/table.pcss b/src/styles/table.pcss
index fff1886..dbd52ba 100644
--- a/src/styles/table.pcss
+++ b/src/styles/table.pcss
@@ -100,7 +100,7 @@
   padding: 4px 0;
   justify-content: center;
   border-top: 1px solid var(--color-border);
-  &--disabled{
+  &--disabled {
     visibility: hidden;
   }
 

From a6e0e36a533abfe13be16be63b5e951995f156bf Mon Sep 17 00:00:00 2001
From: SATHISH S <81795912+SATHISHS03@users.noreply.github.com>
Date: Tue, 24 Sep 2024 20:53:31 +0530
Subject: [PATCH 14/27] Update src/table.js

Co-authored-by: e11sy <130844513+e11sy@users.noreply.github.com>
---
 src/table.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/table.js b/src/table.js
index 33a4282..17eecc6 100644
--- a/src/table.js
+++ b/src/table.js
@@ -457,7 +457,7 @@ export default class Table {
     }
 
     const addRowButton = this.wrapper.querySelector(`.${CSS.addRow}`);
-    if ((this.config && this.config?.maxrows) && (this.numberOfRows >= this.config?.maxrows) && (addRowButton))   {
+    if ((this.config && this.config.maxrows) && (this.numberOfRows >= this.config.maxrows) && (addRowButton)) {
       addRowButton.classList.add(CSS.disabledRow);
     }
     return insertedRow;

From c856fb067dd23eb9d05113f9f83b6e76813457ec Mon Sep 17 00:00:00 2001
From: SATHISH S <81795912+SATHISHS03@users.noreply.github.com>
Date: Tue, 24 Sep 2024 20:53:42 +0530
Subject: [PATCH 15/27] Update src/table.js

Co-authored-by: e11sy <130844513+e11sy@users.noreply.github.com>
---
 src/table.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/table.js b/src/table.js
index 17eecc6..09eb71a 100644
--- a/src/table.js
+++ b/src/table.js
@@ -254,7 +254,7 @@ export default class Table {
           label: this.api.i18n.t('Add row below'),
           icon: IconDirectionDownRight,
           hideIf: () => {
-            return  this.numberOfRows === this.config.maxrows
+            return this.numberOfRows === this.config.maxrows
           },
           onClick: () => {
             this.addRow(this.selectedRow + 1, true);

From c0cfbcf03d3d8a066514644c4a6e95cc95c60ec2 Mon Sep 17 00:00:00 2001
From: SATHISH S <81795912+SATHISHS03@users.noreply.github.com>
Date: Tue, 24 Sep 2024 20:53:52 +0530
Subject: [PATCH 16/27] Update src/table.js

Co-authored-by: e11sy <130844513+e11sy@users.noreply.github.com>
---
 src/table.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/table.js b/src/table.js
index 09eb71a..783368a 100644
--- a/src/table.js
+++ b/src/table.js
@@ -480,7 +480,7 @@ export default class Table {
     }
     const addColButton = this.wrapper.querySelector(`.${CSS.addColumn}`);
     if (addColButton) {
-    addColButton.classList.remove(CSS.disabledCol);
+      addColButton.classList.remove(CSS.disabledCol);
     }
   }
 

From 86b947085d9f43945ca6937641e20f414527c5d2 Mon Sep 17 00:00:00 2001
From: SATHISH S <81795912+SATHISHS03@users.noreply.github.com>
Date: Tue, 24 Sep 2024 20:54:08 +0530
Subject: [PATCH 17/27] Update src/table.js

Co-authored-by: e11sy <130844513+e11sy@users.noreply.github.com>
---
 src/table.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/table.js b/src/table.js
index 783368a..5695bdd 100644
--- a/src/table.js
+++ b/src/table.js
@@ -432,7 +432,7 @@ export default class Table {
       * Check if the number of rows has reached the maximum allowed rows specified in the configuration,
       * and if so, exit the function to prevent adding more columns beyond the limit.
       */  
-    if ((this.config && this.config?.maxrows) && (this.numberOfRows >= this.config?.maxrows) && (addRowButton))   {
+    if ((this.config && this.config.maxrows) && (this.numberOfRows >= this.config.maxrows) && (addRowButton)) {
           return ;
         }
 

From aa869280e54c7ca430e39e3e7d432414774dd163 Mon Sep 17 00:00:00 2001
From: SATHISH S <81795912+SATHISHS03@users.noreply.github.com>
Date: Tue, 24 Sep 2024 20:54:23 +0530
Subject: [PATCH 18/27] Update src/table.js

Co-authored-by: e11sy <130844513+e11sy@users.noreply.github.com>
---
 src/table.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/table.js b/src/table.js
index 5695bdd..c4f3274 100644
--- a/src/table.js
+++ b/src/table.js
@@ -243,7 +243,7 @@ export default class Table {
           label: this.api.i18n.t('Add row above'),
           icon: IconDirectionUpRight,
           hideIf: () => {
-            return  this.numberOfRows === this.config.maxrows
+            return this.numberOfRows === this.config.maxrows
           },
           onClick: () => {
             this.addRow(this.selectedRow, true);

From e389f20dde2f0708a7a1114a37e380de6ffc663a Mon Sep 17 00:00:00 2001
From: SATHISH S <81795912+SATHISHS03@users.noreply.github.com>
Date: Tue, 24 Sep 2024 20:54:42 +0530
Subject: [PATCH 19/27] Update src/table.js

Co-authored-by: e11sy <130844513+e11sy@users.noreply.github.com>
---
 src/table.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/table.js b/src/table.js
index c4f3274..b6d24c3 100644
--- a/src/table.js
+++ b/src/table.js
@@ -198,7 +198,7 @@ export default class Table {
           label: this.api.i18n.t('Add column to right'),
           icon: IconDirectionRightDown,
           hideIf: () => {
-            return  this.numberOfColumns === this.config.maxcols
+            return this.numberOfColumns === this.config.maxcols
           }
           ,
           onClick: () => {

From d135a27535405c54adce5d0f9b20b3c3dd02c3da Mon Sep 17 00:00:00 2001
From: SATHISH S <81795912+SATHISHS03@users.noreply.github.com>
Date: Tue, 24 Sep 2024 20:55:10 +0530
Subject: [PATCH 20/27] Update src/table.js

Co-authored-by: e11sy <130844513+e11sy@users.noreply.github.com>
---
 src/table.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/table.js b/src/table.js
index b6d24c3..91fe429 100644
--- a/src/table.js
+++ b/src/table.js
@@ -187,7 +187,7 @@ export default class Table {
           label: this.api.i18n.t('Add column to left'),
           icon: IconDirectionLeftDown,
           hideIf: () => {
-            return  this.numberOfColumns === this.config.maxcols
+            return this.numberOfColumns === this.config.maxcols
           },
           onClick: () => {
             this.addColumn(this.selectedColumn, true);

From 385b36f92596088e5243852504a9606275a57a8e Mon Sep 17 00:00:00 2001
From: SATHISH S <sathishselvag03@gmail.com>
Date: Tue, 24 Sep 2024 21:00:32 +0530
Subject: [PATCH 21/27] improved codestyle

---
 src/table.js   | 6 ++----
 vite.config.js | 2 --
 2 files changed, 2 insertions(+), 6 deletions(-)

diff --git a/src/table.js b/src/table.js
index 91fe429..525f2de 100644
--- a/src/table.js
+++ b/src/table.js
@@ -21,9 +21,9 @@ const CSS = {
   cell: 'tc-cell',
   cellSelected: 'tc-cell--selected',
   addRow: 'tc-add-row',
+  addRowDisabled: 'tc-add-row--disabled',
   addColumn: 'tc-add-column',
-  disabledCol : 'tc-add-column--disabled',
-  disabledRow : 'tc-add-row--disabled',
+  addColumnDisabled: 'tc-add-column--disabled',
 };
 
 /**
@@ -403,8 +403,6 @@ export default class Table {
       addColButton.classList.add(CSS.disabledCol);
     }
     this.addHeadingAttrToFirstRow();
-      
-  
   };
 
   /**
diff --git a/vite.config.js b/vite.config.js
index 5ddcd7b..b6f2a2e 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -29,6 +29,4 @@ export default {
     cssInjectedByJsPlugin({ useStrictCSP: true }),
     dts({ tsconfigPath: './tsconfig.json' })
   ],
-  
-  
 };

From 5ca4ed76ebb19649fd1a953f12e1676b61aabc4f Mon Sep 17 00:00:00 2001
From: SATHISH S <sathishselvag03@gmail.com>
Date: Tue, 24 Sep 2024 21:34:11 +0530
Subject: [PATCH 22/27] final changes

---
 src/table.js | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/table.js b/src/table.js
index 525f2de..cd603c0 100644
--- a/src/table.js
+++ b/src/table.js
@@ -400,7 +400,7 @@ export default class Table {
 
     const addColButton = this.wrapper.querySelector(`.${CSS.addColumn}`);
     if ((this.config?.maxcols && this.numberOfColumns > this.config.maxcols - 1) && (addColButton) ){
-      addColButton.classList.add(CSS.disabledCol);
+      addColButton.classList.add(CSS.addColumnDisabled);
     }
     this.addHeadingAttrToFirstRow();
   };
@@ -456,7 +456,7 @@ export default class Table {
 
     const addRowButton = this.wrapper.querySelector(`.${CSS.addRow}`);
     if ((this.config && this.config.maxrows) && (this.numberOfRows >= this.config.maxrows) && (addRowButton)) {
-      addRowButton.classList.add(CSS.disabledRow);
+      addRowButton.classList.add(CSS.addRowDisabled);
     }
     return insertedRow;
   };
@@ -478,7 +478,7 @@ export default class Table {
     }
     const addColButton = this.wrapper.querySelector(`.${CSS.addColumn}`);
     if (addColButton) {
-      addColButton.classList.remove(CSS.disabledCol);
+      addColButton.classList.remove(CSS.addColumnDisabled);
     }
   }
 
@@ -491,7 +491,7 @@ export default class Table {
     this.getRow(index).remove();
     const addRowButton = this.wrapper.querySelector(`.${CSS.addRow}`);
     if (addRowButton) {
-      addRowButton.classList.remove(CSS.disabledRow);
+      addRowButton.classList.remove(CSS.addRowDisabled);
     }
 
     this.addHeadingAttrToFirstRow();

From a36454ff5baa83625ca20754a92f79145d221dd7 Mon Sep 17 00:00:00 2001
From: SATHISH S <81795912+SATHISHS03@users.noreply.github.com>
Date: Wed, 25 Sep 2024 11:29:01 +0530
Subject: [PATCH 23/27] Update src/table.js

Co-authored-by: e11sy <130844513+e11sy@users.noreply.github.com>
---
 src/table.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/table.js b/src/table.js
index cd603c0..153a7b0 100644
--- a/src/table.js
+++ b/src/table.js
@@ -199,8 +199,7 @@ export default class Table {
           icon: IconDirectionRightDown,
           hideIf: () => {
             return this.numberOfColumns === this.config.maxcols
-          }
-          ,
+          },
           onClick: () => {
             this.addColumn(this.selectedColumn + 1, true);
             this.hideToolboxes();

From c3cc5b209dfa78cc55ca960cf0086b94865a1df4 Mon Sep 17 00:00:00 2001
From: SATHISH S <81795912+SATHISHS03@users.noreply.github.com>
Date: Wed, 25 Sep 2024 11:29:12 +0530
Subject: [PATCH 24/27] Update src/table.js

Co-authored-by: e11sy <130844513+e11sy@users.noreply.github.com>
---
 src/table.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/table.js b/src/table.js
index 153a7b0..0c0b135 100644
--- a/src/table.js
+++ b/src/table.js
@@ -430,8 +430,8 @@ export default class Table {
       * and if so, exit the function to prevent adding more columns beyond the limit.
       */  
     if ((this.config && this.config.maxrows) && (this.numberOfRows >= this.config.maxrows) && (addRowButton)) {
-          return ;
-        }
+      return;
+    }
 
     if (index > 0 && index <= this.numberOfRows) {
       let row = this.getRow(index);

From 21497224cf66d82a6d993c36ce0f4f7704d74c16 Mon Sep 17 00:00:00 2001
From: SATHISH S <sathishselvag03@gmail.com>
Date: Wed, 25 Sep 2024 11:34:03 +0530
Subject: [PATCH 25/27] camel-case

---
 index.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/index.html b/index.html
index dfa2c87..4bae983 100644
--- a/index.html
+++ b/index.html
@@ -52,8 +52,8 @@
           inlineToolbar: true,
           config: {
             withHeadings: true,
-            maxrows: 5,
-            maxcols: 5
+            maxRows: 5,
+            maxCols: 5
           }
         }
       },

From 6bb8d761b508c2fa05c65ed2b903e830d0c832d8 Mon Sep 17 00:00:00 2001
From: SATHISH S <sathishselvag03@gmail.com>
Date: Wed, 25 Sep 2024 11:38:39 +0530
Subject: [PATCH 26/27] removed redudant parentheses

---
 src/table.js | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/table.js b/src/table.js
index 0c0b135..7dc31fd 100644
--- a/src/table.js
+++ b/src/table.js
@@ -366,7 +366,7 @@ export default class Table {
       * Check if the number of columns has reached the maximum allowed columns specified in the configuration,
       * and if so, exit the function to prevent adding more columns beyond the limit.
       */
-    if ((this.config && this.config.maxcols) && (this.numberOfColumns >= this.config.maxcols)) {
+    if (this.config && this.config.maxcols && this.numberOfColumns >= this.config.maxcols) {
       return;
   }
 
@@ -398,7 +398,7 @@ export default class Table {
     }
 
     const addColButton = this.wrapper.querySelector(`.${CSS.addColumn}`);
-    if ((this.config?.maxcols && this.numberOfColumns > this.config.maxcols - 1) && (addColButton) ){
+    if (this.config?.maxcols && this.numberOfColumns > this.config.maxcols - 1 && addColButton ){
       addColButton.classList.add(CSS.addColumnDisabled);
     }
     this.addHeadingAttrToFirstRow();
@@ -429,7 +429,7 @@ export default class Table {
       * Check if the number of rows has reached the maximum allowed rows specified in the configuration,
       * and if so, exit the function to prevent adding more columns beyond the limit.
       */  
-    if ((this.config && this.config.maxrows) && (this.numberOfRows >= this.config.maxrows) && (addRowButton)) {
+    if (this.config && this.config.maxrows && this.numberOfRows >= this.config.maxrows && addRowButton) {
       return;
     }
 
@@ -454,7 +454,7 @@ export default class Table {
     }
 
     const addRowButton = this.wrapper.querySelector(`.${CSS.addRow}`);
-    if ((this.config && this.config.maxrows) && (this.numberOfRows >= this.config.maxrows) && (addRowButton)) {
+    if (this.config && this.config.maxrows && this.numberOfRows >= this.config.maxrows && addRowButton) {
       addRowButton.classList.add(CSS.addRowDisabled);
     }
     return insertedRow;

From b18ec91944de9df20ff88a6388a36d8041fe096e Mon Sep 17 00:00:00 2001
From: SATHISH S <sathishselvag03@gmail.com>
Date: Wed, 25 Sep 2024 11:47:56 +0530
Subject: [PATCH 27/27] updated the readme.md

---
 README.md | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index f564bb4..e1e42d6 100644
--- a/README.md
+++ b/README.md
@@ -47,6 +47,8 @@ var editor = EditorJS({
       config: {
         rows: 2,
         cols: 3,
+        maxRows: 5,
+        maxCols: 5,
       },
     },
   },
@@ -57,9 +59,11 @@ var editor = EditorJS({
 
 | Field              | Type     | Description          |
 | ------------------ | -------- | ---------------------------------------- |
-| `rows`             | `number` | initial number of rows. `2`  by default |
+| `rows`             | `number` | initial number of rows. `2` by default |
 | `cols`             | `number` | initial number of columns. `2` by default |
-| `withHeadings`             | `boolean` | toggle table headings. `false` by default |
+| `maxRows`          | `number` | maximum number of rows. `5` by params |
+| `maxCols`          | `number` | maximum number of columns. `5` by params |
+| `withHeadings`     | `boolean` | toggle table headings. `false` by default |
 
 ## Output data