@jackuait/blok 0.6.0-beta.0 → 0.6.0-beta.10

package/src/components/icons/index.ts

@@ -1,13 +1,13 @@
 // Cross/Close icon
 export const IconCross = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="m4.5 15 11-11m0 11L4.5 4" stroke="currentColor" stroke-linecap="round"/>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="m5 15 10-10m0 10L5 5" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
 `;
 
 // Bold icon
 export const IconBold = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
   <path
     d="M5.5 11h4.9231c.6528 0 1.2789-.3161 1.7405-.8787.4617-.56259.721-1.32565.721-2.1213 0-.79565-.2593-1.55871-.721-2.12132C11.702 5.31607 11.0759 5 10.4231 5H5.5v6Zm0 0h5.5385c.6528 0 1.2789.3161 1.7405.8787.4617.5626.721 1.3257.721 2.1213 0 .7956-.2593 1.5587-.721 2.1213-.4616.5626-1.0877.8787-1.7405.8787H5.5v-6Z"
     stroke="currentColor"
@@ -20,10 +20,11 @@ export const IconBold = `
 
 // Italic icon
 export const IconItalic = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
   <path
     d="M8.5 5h6m-10 12h6m1-12-4 12"
     stroke="currentColor"
+    stroke-width="1.25"
     stroke-linecap="round"
     stroke-linejoin="round"
   />
@@ -32,78 +33,70 @@ export const IconItalic = `
 
 // Link icon
 export const IconLink = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path
-    d="m9.98288 15.0959-.91628.9157c-.29867.3092-.65593.5559-1.05095.7255-.39502.1697-.81987.259-1.24978.2628-.4299.0037-.85625-.0782-1.25415-.241-.39791-.1628-.75941-.4032-1.06341-.7072-.304-.304-.54441-.6655-.70721-1.0634-.16279-.3979-.24471-.8243-.24098-1.2542.00374-.4299.09306-.8547.26274-1.2497.16969-.3951.41635-.7523.72558-1.051l.91499-.9163m8.24197.9156.9163-.9156c.6028-.60809.9402-1.43021.9383-2.28645-.0019-.85625-.3429-1.67688-.9483-2.28234-.6055-.60546-1.4261-.94643-2.2823-.9483-.8563-.00188-1.6784.3355-2.28652.9383l-.91628.91563M7.258 13.2413l4.5328-4.53278"
-    stroke="currentColor"
-    stroke-width=".784151"
-    stroke-linecap="round"
-    stroke-linejoin="round"
-  />
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M8.5 11.5a3.5 3.5 0 0 0 5 0l2-2a3.536 3.536 0 0 0-5-5l-1 1" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
+  <path d="M11.5 8.5a3.5 3.5 0 0 0-5 0l-2 2a3.536 3.536 0 0 0 5 5l1-1" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
 `;
 
 // Replace/Convert icon
 export const IconReplace = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path
-    d="M15.5 14.003h-3v-3.0004m-9-6.00078h3v3.0004m1.55478-3.80901A5.2170862 5.2170862 0 0 1 9.5 4.00014c1.1682.00058 2.3059.37321 3.2481 1.06388.9422.69067 1.64 1.66348 1.9923 2.77744.3523 1.11396.3407 2.31114-.033 3.41814-.3738 1.1069-1.0903 2.0661-2.0457 2.7384m-1.7165.8088c-.4703.1317-.9568.1967-1.4452.1931-1.16819-.0006-2.30585-.3733-3.24807-1.0639-.94222-.6907-1.64004-1.6635-1.99232-2.7775-.35229-1.1139-.34072-2.31114.03302-3.41808.37375-1.10694 1.09024-2.06608 2.04563-2.73841"
-    stroke="currentColor"
-    stroke-miterlimit="10"
-    stroke-linecap="round"
-  />
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M14.5 6.5l2-2-2-2" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
+  <path d="M16.5 4.5h-4a5 5 0 0 0-5 5v1" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
+  <path d="M5.5 13.5l-2 2 2 2" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
+  <path d="M3.5 15.5h4a5 5 0 0 0 5-5v-1" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
 `;
 
-// Menu icon
+// Menu icon (6-dot grip)
 export const IconMenu = `
-<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path
-    d="M8 6c0-.55228.44772-1 1-1s1 .44772 1 1-.44772 1-1 1-1-.44772-1-1Zm0 6c0-.5523.44772-1 1-1s1 .4477 1 1-.44772 1-1 1-1-.4477-1-1Zm0 6c0-.5523.44772-1 1-1s1 .4477 1 1-.44772 1-1 1-1-.4477-1-1Zm6-12c0-.55228.4477-1 1-1s1 .44772 1 1-.4477 1-1 1-1-.44772-1-1Zm0 6c0-.5523.4477-1 1-1s1 .4477 1 1-.4477 1-1 1-1-.4477-1-1Zm0 6c0-.5523.4477-1 1-1s1 .4477 1 1-.4477 1-1 1-1-.4477-1-1Z"
-    fill="currentColor"
-  />
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="7.5" cy="5.5" r="1" fill="currentColor"/>
+  <circle cx="12.5" cy="5.5" r="1" fill="currentColor"/>
+  <circle cx="7.5" cy="10" r="1" fill="currentColor"/>
+  <circle cx="12.5" cy="10" r="1" fill="currentColor"/>
+  <circle cx="7.5" cy="14.5" r="1" fill="currentColor"/>
+  <circle cx="12.5" cy="14.5" r="1" fill="currentColor"/>
 </svg>
 `;
 
 // Plus/Add icon
 export const IconPlus = `
-<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M4.5 11.0711h14.1421m-7.071 7.071V4" stroke="currentColor" stroke-linecap="round"/>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M4.5 10h11M10 4.5v11" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
 `;
 
 // Chevron Left icon
 export const IconChevronLeft = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="m12.5 5-5 5 5 5" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="m12 5-5 5 5 5" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
 `;
 
 // Chevron Right icon
 export const IconChevronRight = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="m7.5 15 5-5-5-5" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="m8 5 5 5-5 5" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
 `;
 
 // Search icon
 export const IconSearch = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path
-    d="m17.5 17.5-5-5m1.6667-4.16667c0 .76605-.1509 1.52459-.4441 2.23237-.2931.7077-.7228 1.3507-1.2645 1.8924-.5417.5417-1.1847.9714-1.8924 1.2645-.70778.2932-1.46632.4441-2.23237.4441-.76604 0-1.52458-.1509-2.23232-.4441-.70773-.2931-1.35079-.7228-1.89247-1.2645-.54167-.5417-.97135-1.1847-1.2645-1.8924C2.65088 9.85792 2.5 9.09938 2.5 8.33333c0-1.54709.61458-3.03082 1.70854-4.12479C5.30251 3.11458 6.78624 2.5 8.33333 2.5c1.5471 0 3.03087.61458 4.12477 1.70854 1.094 1.09397 1.7086 2.5777 1.7086 4.12479Z"
-    stroke="currentColor"
-    stroke-linecap="round"
-    stroke-linejoin="round"
-  />
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="9" cy="9" r="4.5" stroke="currentColor" stroke-width="1.25"/>
+  <path d="m12.5 12.5 3.5 3.5" stroke="currentColor" stroke-width="1.25" stroke-linecap="round"/>
 </svg>
 `;
 
 // Heading 1 icon
 export const IconH1 = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
   <path
     d="M3.33334 10H10m-6.66666 5V5M10 15V5m4.1667 5 2.5-1.66667V15"
     stroke="currentColor"
+    stroke-width="1.25"
     stroke-linecap="round"
     stroke-linejoin="round"
   />
@@ -112,10 +105,11 @@ export const IconH1 = `
 
 // Heading 2 icon
 export const IconH2 = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
   <path
     d="M3.33334 10H10m-6.66666 5V5M10 15V5m7.5 10h-3.3333c0-3.3333 3.3333-2.5 3.3333-5 0-1.25-1.6667-2.08333-3.3333-.83333"
     stroke="currentColor"
+    stroke-width="1.25"
     stroke-linecap="round"
     stroke-linejoin="round"
   />
@@ -124,10 +118,11 @@ export const IconH2 = `
 
 // Heading 3 icon
 export const IconH3 = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
   <path
     d="M3.33334 10H10m-6.66666 5V5M10 15V5m4.5833 3.75C16 7.91667 17.5 8.75 17.5 10c0 .442-.1756.866-.4882 1.1785-.3125.3126-.7364.4882-1.1785.4882.4421 0 .866.1756 1.1785.4881.3126.3126.4882.7365.4882 1.1785 0 1.5-1.6667 2.5-3.3333 1.25"
     stroke="currentColor"
+    stroke-width="1.25"
     stroke-linecap="round"
     stroke-linejoin="round"
   />
@@ -139,7 +134,8 @@ export const IconH4 = `
 <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
   <path
     d="M10 15V5M14.1667 8.33333V10.8333C14.1667 11.0543 14.2545 11.2663 14.4107 11.4226C14.567 11.5789 14.779 11.6667 15 11.6667H17.5M17.5 8.33333V15M3.33334 10H10M3.33334 15V5"
-    stroke="black"
+    stroke="currentColor"
+    stroke-width="1.25"
     stroke-linecap="round"
     stroke-linejoin="round"
   />
@@ -151,7 +147,8 @@ export const IconH5 = `
 <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
   <path
     d="M3.33334 10H10M3.33334 15V5M10 15V5M17.5 8.33333H14.1667V10.8333H15.25C16.5 10.8333 17.5 11.75 17.5 12.9167C17.5 14.0833 16.5 15 15.25 15C14.8333 15 14.5 14.9167 14.1667 14.75"
-    stroke="black"
+    stroke="currentColor"
+    stroke-width="1.25"
     stroke-linecap="round"
     stroke-linejoin="round"
   />
@@ -160,22 +157,24 @@ export const IconH5 = `
 
 // Heading 6 icon
 export const IconH6 = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
   <path
     d="M3.33334 10H10m-6.66666 5V5M10 15V5m4.1667 8.3333c0 .9205.7462 1.6667 1.6666 1.6667.9205 0 1.6667-.7462 1.6667-1.6667 0-.9204-.7462-1.6666-1.6667-1.6666-.9204 0-1.6666.7462-1.6666 1.6666Zm0 0c0-2.0833.8333-3.3333 2.5-4.99997"
     stroke="currentColor"
+    stroke-width="1.25"
     stroke-linecap="round"
     stroke-linejoin="round"
   />
 </svg>
 `;
 
-// Heading i)
+// Heading icon
 export const IconHeading = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
   <path
     d="M6.5 10h6.6667M6.5 15V5m6.6667 10V5"
     stroke="currentColor"
+    stroke-width="1.25"
     stroke-linecap="round"
     stroke-linejoin="round"
   />
@@ -184,10 +183,11 @@ export const IconHeading = `
 
 // Text/Paragraph icon
 export const IconText = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
   <path
     d="M14.5 7.28571V6h-9v1.28571M10 6v9m0 0H8.71429M10 15h1.2857"
     stroke="currentColor"
+    stroke-width="1.25"
     stroke-linecap="round"
     stroke-linejoin="round"
   />
@@ -196,25 +196,19 @@ export const IconText = `
 
 // Warning icon
 export const IconWarning = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path
-    d="M18.5667 18H1.5l8.5333-16 8.5334 16Z"
-    stroke="currentColor"
-    stroke-width="1.06667"
-    stroke-linecap="round"
-    stroke-linejoin="round"
-  />
-  <rect x="9.75" y="14.25" width=".5" height=".5" rx=".25" fill="currentColor" stroke="currentColor" stroke-width=".5"/>
-  <rect x="9.75" y="8.25" width=".5" height="4.5" rx=".25" fill="currentColor" stroke="currentColor" stroke-width=".5"/>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M10 4 3 16h14Z" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
+  <path d="M10 8.5v3.5m0 2v.01" stroke="currentColor" stroke-width="1.25" stroke-linecap="round"/>
 </svg>
 `;
 
 // Bulleted List icon
 export const IconListBulleted = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
   <path
     d="M8 5h9M8 10h9M8 15h9M4 5h.01M4 10h.01M4 15h.01"
     stroke="currentColor"
+    stroke-width="1.25"
     stroke-linecap="round"
     stroke-linejoin="round"
   />
@@ -223,17 +217,24 @@ export const IconListBulleted = `
 
 // Numbered List icon
 export const IconListNumbered = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M7.90873 4.60317h9.61907M4.70238 6.20635V3L3.5 4.20238m1.60317 7.61512H3.5l1.52702-2.37514c.02625-.03721.04486-.07925.05477-.12369.0099-.04444.01091-.09039.00295-.13523-.04569-.2068-.20922-.57233-.78315-.57233-.80159 0-.80159.71261-.80159.71261v.17795m0 7.92693h.80159c.21259 0 .41648-.0845.56681-.2348.15032-.1503.23477-.3542.23477-.5668 0-.2126-.08445-.4165-.23477-.5668-.15033-.1503-.35422-.2348-.56681-.2348h-.4008l1.20238-1.6032H3.5m4.40873-4.0079h9.61907m-9.61907 5.6111h9.61907" stroke="#000" stroke-width=".841667" stroke-linecap="round" stroke-linejoin="round"/>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M8 5h9M8 10h9M8 15h9M3.5 4.5l1-1v3M3.5 9.5a1 1 0 1 1 2 0c0 .75-2 1.25-2 2h2M3.5 13.5h1a.75.75 0 0 1 0 1.5.75.75 0 0 1 0 1.5h-1"
+    stroke="currentColor"
+    stroke-width="1.25"
+    stroke-linecap="round"
+    stroke-linejoin="round"
+  />
 </svg>
 `;
 
 // Checklist icon
 export const IconListChecklist = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
   <path
     d="M10 5h7M10 10h7M10 15h7M3 5l1 1 2-2M3 10l1 1 2-2M3 15l1 1 2-2"
     stroke="currentColor"
+    stroke-width="1.25"
     stroke-linecap="round"
     stroke-linejoin="round"
   />
@@ -242,72 +243,92 @@ export const IconListChecklist = `
 
 // Table icon
 export const IconTable = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M3 4h14a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1Z" stroke="currentColor" stroke-width="1.25"/>
-  <path d="M2 8h16M2 12h16M7 4v12M13 4v12" stroke="currentColor" stroke-width="1.25"/>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect x="3" y="4" width="14" height="12" rx="1.5" stroke="currentColor" stroke-width="1.25"/>
+  <path d="M3 8h14M3 12h14M7.5 4v12M12.5 4v12" stroke="currentColor" stroke-width="1.25"/>
+</svg>
+`;
+
+// Table with highlighted top row (header row)
+export const IconHeaderRow = `
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M4.5 4h11A1.5 1.5 0 0 1 17 5.5V8H3V5.5A1.5 1.5 0 0 1 4.5 4Z" fill="currentColor"/>
+  <rect x="3" y="4" width="14" height="12" rx="1.5" stroke="currentColor" stroke-width="1.25"/>
+  <path d="M3 8h14M3 12h14M7.5 4v12M12.5 4v12" stroke="currentColor" stroke-width="1.25"/>
+</svg>
+`;
+
+// Table with highlighted left column (header column)
+export const IconHeaderColumn = `
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M4.5 4H7.5v12H4.5A1.5 1.5 0 0 1 3 14.5v-9A1.5 1.5 0 0 1 4.5 4Z" fill="currentColor"/>
+  <rect x="3" y="4" width="14" height="12" rx="1.5" stroke="currentColor" stroke-width="1.25"/>
+  <path d="M3 8h14M3 12h14M7.5 4v12M12.5 4v12" stroke="currentColor" stroke-width="1.25"/>
 </svg>
 `;
 
 // Insert row above icon
 export const IconInsertAbove = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M10 3v6m-3-3h6M4 13h12" stroke="currentColor" stroke-width="1.25" stroke-linecap="round"/>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M10 4l-3 3m3-3l3 3M10 4v7M5 16h10" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
 `;
 
 // Insert row below icon
 export const IconInsertBelow = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M10 17v-6m-3 3h6M4 7h12" stroke="currentColor" stroke-width="1.25" stroke-linecap="round"/>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M10 16l-3-3m3 3l3-3M10 16V9M5 4h10" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
 `;
 
 // Insert column left icon
 export const IconInsertLeft = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M3 10h6M6 7v6M13 4v12" stroke="currentColor" stroke-width="1.25" stroke-linecap="round"/>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M4 10l3-3M4 10l3 3M4 10h7M16 5v10" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
 `;
 
 // Insert column right icon
 export const IconInsertRight = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M17 10h-6m3-3v6M7 4v12" stroke="currentColor" stroke-width="1.25" stroke-linecap="round"/>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M16 10l-3-3m3 3l-3 3M16 10H9M4 5v10" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
 `;
 
 // Move up icon
 export const IconMoveUp = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M10 16V4m0 0-4 4m4-4 4 4" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M10 16V4m0 0-3 3m3-3 3 3" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
 `;
 
 // Move down icon
 export const IconMoveDown = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M10 4v12m0 0 4-4m-4 4-4-4" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M10 4v12m0 0 3-3m-3 3-3-3" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
 `;
 
 // Move left icon
 export const IconMoveLeft = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M16 10H4m0 0 4-4M4 10l4 4" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M16 10H4m0 0 3-3M4 10l3 3" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
 `;
 
 // Move right icon
 export const IconMoveRight = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M4 10h12m0 0-4-4m4 4-4 4" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M4 10h12m0 0-3-3m3 3-3 3" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
 `;
 
 // Trash/Delete icon
 export const IconTrash = `
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M5 6h10m-1 0v9a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1V6m2 0V5a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v1" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M4.5 6.5h11" stroke="currentColor" stroke-width="1.25" stroke-linecap="round"/>
+  <path d="M8 6.5V5a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v1.5" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
+  <path d="M6.5 6.5l.5 8.5a1 1 0 0 0 1 1h4a1 1 0 0 0 1-1l.5-8.5" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
+  <path d="M8.5 9.5v3.5M11.5 9.5v3.5" stroke="currentColor" stroke-width="1.25" stroke-linecap="round"/>
 </svg>
 `;
-

package/src/components/modules/api/blocks.ts

@@ -1,6 +1,7 @@
 import type { BlockToolData, OutputBlockData, OutputData, ToolConfig } from '../../../../types';
 import type { BlockAPI as BlockAPIInterface, Blocks } from '../../../../types/api';
 import type { BlockTuneData } from '../../../../types/block-tunes/block-tune-data';
+import { isInsideTableCell, isRestrictedInTableCell } from '../../../tools/table/table-restrictions';
 import { Module } from '../../__module';
 import { Block } from '../../block';
 import { BlockAPI } from '../../block/api';
@@ -37,6 +38,7 @@ export class BlocksAPI extends Module {
       update: this.update,
       composeBlockData: this.composeBlockData,
       convert: this.convert,
+      setBlockParent: (blockId: string, parentId: string | null): void => this.setBlockParent(blockId, parentId),
       stopBlockMutationWatching: (index: number): void => this.stopBlockMutationWatching(index),
       splitBlock: this.splitBlock,
     };
@@ -114,7 +116,7 @@ export class BlocksAPI extends Module {
     const block = this.Blok.BlockManager.getBlock(element);
 
     if (block === undefined) {
-      logLabeled(`There is no block corresponding to element <${element.tagName.toLowerCase()}>`, 'warn');
+      logLabeled(`There is no block corresponding to element <${element.tagName?.toLowerCase() ?? 'unknown'}>`, 'warn');
 
       return;
     }
@@ -242,7 +244,21 @@ export class BlocksAPI extends Module {
     replace?: boolean,
     id?: string
   ): BlockAPIInterface => {
-    const tool = type ?? (this.config.defaultBlock);
+    const defaultTool = type ?? (this.config.defaultBlock);
+    const tool = (() => {
+      if (!defaultTool) {
+        return defaultTool;
+      }
+
+      const targetIndex = index ?? this.Blok.BlockManager.currentBlockIndex;
+      const targetBlock = this.Blok.BlockManager.getBlockByIndex(targetIndex);
+
+      if (targetBlock !== undefined && isInsideTableCell(targetBlock) && isRestrictedInTableCell(defaultTool)) {
+        return 'paragraph';
+      }
+
+      return defaultTool;
+    })();
 
     const insertedBlock = this.Blok.BlockManager.insert({
       id,
@@ -361,6 +377,23 @@ export class BlocksAPI extends Module {
     return blocksToInsert.map((block) => new BlockAPI(block));
   };
 
+  /**
+   * Sets the parent of a block, updating both the block's parentId and the parent's contentIds.
+   * @param blockId - id of the block to reparent
+   * @param parentId - id of the new parent block, or null for root level
+   */
+  private setBlockParent(blockId: string, parentId: string | null): void {
+    const block = this.Blok.BlockManager.getBlockById(blockId);
+
+    if (block === undefined) {
+      logLabeled('There is no block with id `' + blockId + '`', 'warn');
+
+      return;
+    }
+
+    this.Blok.BlockManager.setBlockParent(block, parentId);
+  }
+
   /**
    * Stops mutation watching on a block at the specified index.
    * This is used to prevent spurious block-changed events during block replacement.

package/src/components/modules/api/history.ts

@@ -0,0 +1,64 @@
+/**
+ * @module HistoryAPI
+ * @copyright <CodeX> 2018
+ *
+ * Provides public methods for undo/redo operations
+ */
+import type { History } from '../../../../types/api';
+import { Module } from '../../__module';
+
+/**
+ * @class HistoryAPI
+ */
+export class HistoryAPI extends Module {
+  /**
+   * Available methods
+   * @returns {History}
+   */
+  public get methods(): History {
+    return {
+      undo: (): void => this.undo(),
+      redo: (): void => this.redo(),
+      canUndo: (): boolean => this.canUndo(),
+      canRedo: (): boolean => this.canRedo(),
+      clear: (): void => this.clear(),
+    };
+  }
+
+  /**
+   * Undo the last operation
+   */
+  public undo(): void {
+    this.Blok.YjsManager.undo();
+  }
+
+  /**
+   * Redo the last undone operation
+   */
+  public redo(): void {
+    this.Blok.YjsManager.redo();
+  }
+
+  /**
+   * Check if undo is available
+   * @returns {boolean} true if undo is available
+   */
+  public canUndo(): boolean {
+    return this.Blok.YjsManager.canUndo();
+  }
+
+  /**
+   * Check if redo is available
+   * @returns {boolean} true if redo is available
+   */
+  public canRedo(): boolean {
+    return this.Blok.YjsManager.canRedo();
+  }
+
+  /**
+   * Clear all history
+   */
+  public clear(): void {
+    this.Blok.YjsManager.clear();
+  }
+}

package/src/components/modules/api/index.ts

@@ -21,6 +21,7 @@ export class API extends Module {
       caret: this.Blok.CaretAPI.methods,
       tools: this.Blok.ToolsAPI.methods,
       events: this.Blok.EventsAPI.methods,
+      history: this.Blok.HistoryAPI.methods,
       listeners: this.Blok.ListenersAPI.methods,
       notifier: this.Blok.NotifierAPI.methods,
       sanitizer: this.Blok.SanitizerAPI.methods,
@@ -33,6 +34,7 @@ export class API extends Module {
       i18n: this.Blok.I18nAPI.methods,
       readOnly: this.Blok.ReadOnlyAPI.methods,
       ui: this.Blok.UiAPI.methods,
+      rectangleSelection: this.Blok.RectangleSelection,
     };
   }
 }

package/src/components/modules/api/readonly.ts

@@ -12,9 +12,10 @@ export class ReadOnlyAPI extends Module {
   public get methods(): ReadOnly {
     const getIsEnabled = (): boolean => this.isEnabled;
 
-     
+
     return {
       toggle: (state): Promise<boolean> => this.toggle(state),
+      set: (state): Promise<boolean> => this.set(state),
       get isEnabled(): boolean {
         return getIsEnabled();
       },
@@ -30,6 +31,15 @@ export class ReadOnlyAPI extends Module {
     return this.Blok.ReadOnly.toggle(state);
   }
 
+  /**
+   * Set read-only mode to the specified boolean state
+   * @param {boolean} state - read-only state to set
+   * @returns {Promise<boolean>} the new read-only state
+   */
+  public set(state: boolean): Promise<boolean> {
+    return this.Blok.ReadOnly.set(state);
+  }
+
   /**
    * Returns current read-only state
    */

package/src/components/modules/blockEvents/composers/markdownShortcuts.ts

@@ -153,7 +153,18 @@ export class MarkdownShortcuts extends BlockEventComposer {
     const { BlockManager, Tools } = this.Blok;
     const currentBlock = BlockManager.currentBlock;
 
-    if (!currentBlock?.tool.isDefault) {
+    if (!currentBlock) {
+      return false;
+    }
+
+    // Check if inside table cell
+    const isInsideTableCell = currentBlock.holder.closest('[data-blok-table-cell-blocks]') !== null;
+
+    if (isInsideTableCell) {
+      return false; // Don't convert to header
+    }
+
+    if (!currentBlock.tool.isDefault) {
       return false;
     }
 

package/src/components/modules/blockManager/blockManager.ts

@@ -7,6 +7,7 @@
 import type { BlockToolData, OutputBlockData, PasteEvent } from '../../../../types';
 import type { BlockTuneData } from '../../../../types/block-tunes/block-tune-data';
 import type { BlockMutationEventMap, BlockMutationType } from '../../../../types/events/block';
+import { BlockAddedMutationType } from '../../../../types/events/block/BlockAdded';
 import { BlockChangedMutationType } from '../../../../types/events/block/BlockChanged';
 import { BlockRemovedMutationType } from '../../../../types/events/block/BlockRemoved';
 import { Module } from '../../__module';
@@ -307,6 +308,12 @@ export class BlockManager extends Module {
         replaceBlock: (index, newBlock) => {
           this.blocksStore.replace(index, newBlock);
         },
+        onBlockRemoved: (block, index) => {
+          this.blockDidMutated(BlockRemovedMutationType, block, { index });
+        },
+        onBlockAdded: (block, index) => {
+          this.blockDidMutated(BlockAddedMutationType, block, { index });
+        },
       },
       this.blocksStore
     );