@thangph2146/lexical-editor 0.0.5 → 0.0.7

package/dist/index.css

@@ -89,7 +89,7 @@
 .editor-tabs-trigger[data-state=active] {
   background-color: var(--background);
   color: var(--foreground);
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
 }
 .editor-tabs-list {
   display: flex;
@@ -174,12 +174,14 @@
 .editor-flex-row {
   flex-direction: row;
 }
+.editor-flex-column,
 .editor-flex-col {
   flex-direction: column;
 }
 .editor-flex-row-reverse {
   flex-direction: row-reverse;
 }
+.editor-flex-column-reverse,
 .editor-flex-col-reverse {
   flex-direction: column-reverse;
 }
@@ -209,13 +211,13 @@
   cursor: pointer;
 }
 .editor-flex-col-gap-2 {
-  display: flex;
-  flex-direction: column;
+  display: flex !important;
+  flex-direction: column !important;
   gap: 8px;
 }
 .editor-flex-col-gap-4 {
-  display: flex;
-  flex-direction: column;
+  display: flex !important;
+  flex-direction: column !important;
   gap: 16px;
 }
 .editor-flex-center-justify-py-8 {
@@ -370,13 +372,13 @@
   border-radius: 9999px;
 }
 .editor-shadow-sm {
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
 }
 .editor-shadow-md {
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
 }
 .editor-shadow-lg {
-  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
+  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
 }
 .editor-bg-background {
   background-color: var(--background);
@@ -718,7 +720,7 @@
 .editor-cursor-nwse-resize {
   cursor: nwse-resize;
 }
-.editor-text-muted-xs {
+.editor-text-xs-muted {
   font-size: 0.75rem;
   color: var(--muted-foreground, #64748b);
 }
@@ -870,7 +872,7 @@
 .editor-toolbar-item:hover:not(:disabled):not([data-state=on]):not([data-state=active]),
 .editor-toggle-group-item:hover:not(:disabled):not([data-state=on]):not([data-state=active]) {
   transform: translateY(-1px);
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
 }
 .editor-toolbar-item:active:not(:disabled),
 .editor-toggle-group-item:active:not(:disabled) {
@@ -916,7 +918,7 @@
 .editor-toggle-group-item[data-state=on]:hover,
 .editor-toggle-group-item[data-state=active]:hover {
   transform: translateY(-1px);
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
   background-color: color-mix(in srgb, var(--accent, #f1f5f9), black 10%);
   border-color: var(--accent, #f1f5f9);
 }
@@ -971,7 +973,7 @@
 }
 .editor-toolbar-select-trigger:hover:not(:disabled):not([data-state=on]):not([data-state=active]) {
   transform: translateY(-1px);
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
 }
 .editor-toolbar-select-trigger:active:not(:disabled) {
   transform: translateY(0) scale(0.98);
@@ -1023,10 +1025,11 @@
   position: relative;
   padding: 8px 16px;
   box-sizing: border-box;
+  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
 }
 .editor-btn:hover:not(:disabled):not([data-state=on]):not([data-state=active]) {
   transform: translateY(-1px);
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
 }
 .editor-btn:active:not(:disabled) {
   transform: translateY(0) scale(0.98);
@@ -1064,21 +1067,19 @@
   background-color: var(--primary);
   color: var(--primary-foreground);
   border-color: var(--primary);
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
 }
 .editor-btn--default:hover {
   background-color: color-mix(in srgb, var(--primary), black 10%);
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
 }
 .editor-btn--destructive {
   background-color: var(--destructive);
   color: var(--destructive-foreground);
   border-color: var(--destructive);
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
 }
 .editor-btn--destructive:hover {
   background-color: color-mix(in srgb, var(--destructive), black 10%);
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
 }
 .editor-btn--outline {
   border-color: var(--input);
@@ -1115,11 +1116,12 @@
   border: none;
   padding: 0;
   height: auto;
+  box-shadow: none !important;
 }
 .editor-btn--link:hover {
   text-decoration-line: underline;
   transform: none;
-  box-shadow: none;
+  box-shadow: none !important;
 }
 .editor-btn {
 }
@@ -1313,7 +1315,7 @@
   border: 1px solid var(--border);
   background-color: var(--background);
   padding: 20px;
-  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
+  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
   border-radius: calc(var(--radius, 8px) + 4px);
   outline: none;
   animation: editor-dialog-zoom-in 200ms cubic-bezier(0.4, 0, 0.2, 1) cubic-bezier(0.16, 1, 0.3, 1);
@@ -1340,8 +1342,8 @@
   box-shadow: 0 0 0 2px var(--ring), 0 0 0 4px var(--background, transparent);
 }
 .editor-dialog-header {
-  display: flex;
-  flex-direction: column;
+  display: flex !important;
+  flex-direction: column !important;
   gap: 4px;
   text-align: center;
 }
@@ -1363,8 +1365,8 @@
   margin: 0;
 }
 .editor-dialog-footer {
-  display: flex;
-  flex-direction: column;
+  display: flex !important;
+  flex-direction: column !important;
   flex-direction: column-reverse;
   gap: 8px;
 }
@@ -1381,7 +1383,7 @@
   border: 1px solid var(--border);
   background-color: var(--popover);
   color: var(--popover-foreground);
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
   padding: 16px;
   outline: none;
   animation: editor-popover-zoom-in 150ms cubic-bezier(0.4, 0, 0.2, 1);
@@ -1505,7 +1507,7 @@
 }
 .editor-toggle:hover:not(:disabled):not([data-state=on]):not([data-state=active]) {
   transform: translateY(-1px);
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
 }
 .editor-toggle:active:not(:disabled) {
   transform: translateY(0) scale(0.98);
@@ -1530,13 +1532,13 @@
 }
 .editor-toggle[data-state=on]:hover {
   transform: translateY(-1px);
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
   background-color: color-mix(in srgb, var(--accent, #f1f5f9), black 10%);
   border-color: var(--accent, #f1f5f9);
 }
 .editor-toggle--outline {
   border-color: var(--input);
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
 }
 .editor-toggle--outline:hover {
   background-color: color-mix(in srgb, var(--accent, #f1f5f9), black 5%);
@@ -1562,6 +1564,85 @@
   padding-left: 12px;
   padding-right: 12px;
 }
+.editor-number-input-container {
+  display: flex;
+  align-items: center;
+  border: 1px solid var(--border);
+  border-radius: var(--radius, 8px);
+  background-color: var(--background);
+  height: 44px;
+  transition: border-color 200ms cubic-bezier(0.4, 0, 0.2, 1);
+  padding: 2px;
+  gap: 2px;
+}
+.editor-number-input-container:focus-within {
+  border-color: var(--ring);
+}
+.editor-number-input-btn {
+  height: 100% !important;
+  width: 40px !important;
+  border-radius: var(--radius, 8px);
+  flex-shrink: 0;
+  color: var(--muted-foreground);
+  border: none !important;
+  box-shadow: none !important;
+}
+.editor-number-input-btn:hover:not(:disabled) {
+  background-color: var(--accent) !important;
+  color: var(--accent-foreground) !important;
+}
+.editor-number-input-btn:active:not(:disabled) {
+  background-color: var(--accent-muted) !important;
+}
+.editor-number-input-wrapper {
+  position: relative;
+  flex: 1;
+  display: flex;
+  align-items: center;
+  min-width: 0;
+  height: 100%;
+  border-radius: var(--radius, 8px);
+  overflow: hidden;
+}
+.editor-number-input-field {
+  border: none !important;
+  border-radius: 0 !important;
+  height: 100% !important;
+  text-align: center;
+  padding-right: 28px !important;
+  box-shadow: none !important;
+  background: transparent !important;
+}
+.editor-number-input-field:focus {
+  box-shadow: none !important;
+}
+.editor-number-input-field::-webkit-inner-spin-button,
+.editor-number-input-field::-webkit-outer-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+.editor-number-input-field {
+  -moz-appearance: textfield;
+}
+.editor-number-input-unit {
+  position: absolute;
+  right: 10px;
+  top: 50%;
+  transform: translateY(-50%);
+  font-size: 0.75rem;
+  color: var(--muted-foreground);
+  pointer-events: none;
+  font-family:
+    "JetBrains Mono",
+    ui-monospace,
+    SFMono-Regular,
+    Menlo,
+    Monaco,
+    Consolas,
+    "Liberation Mono",
+    "Courier New",
+    monospace;
+}
 .editor-toolbar {
   position: sticky;
   top: 0;
@@ -1570,9 +1651,9 @@
   align-items: center;
   flex-wrap: wrap;
   gap: 4px;
-  border-bottom: 1px solid var(--border);
-  border-top-left-radius: var(--radius, 8px);
-  border-top-right-radius: var(--radius, 8px);
+  border-bottom: 1px solid var(--border) !important;
+  border-top-left-radius: var(--radius, 8px) !important;
+  border-top-right-radius: var(--radius, 8px) !important;
   background-color: rgba(255, 255, 255, 0.8);
 }
 @supports (backdrop-filter: blur(4px)) {
@@ -1581,8 +1662,8 @@
   }
 }
 .editor-toolbar {
-  padding: 4px;
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  padding: 8px !important;
+  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
   width: 100%;
   overflow-x: visible;
   overflow-y: visible;
@@ -1592,13 +1673,13 @@
   display: flex;
   align-items: center;
   gap: 4px;
-  padding: 4px;
+  padding: 4px !important;
   border-radius: var(--radius, 8px);
 }
 .editor-toolbar-separator {
   height: 24px !important;
-  margin-left: 4px;
-  margin-right: 4px;
+  margin-left: 4px !important;
+  margin-right: 4px !important;
 }
 .editor-floating-toolbar {
   position: absolute;
@@ -1611,7 +1692,7 @@
   border: 1px solid var(--border);
   padding: 4px;
   opacity: 0;
-  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
+  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
   transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1), transform 200ms cubic-bezier(0.4, 0, 0.2, 1);
   will-change: transform;
   z-index: 50;
@@ -1643,7 +1724,7 @@
   border: 1px solid var(--border);
   padding: 4px;
   opacity: 0;
-  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
+  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
   transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1), transform 200ms cubic-bezier(0.4, 0, 0.2, 1);
   will-change: transform;
   z-index: 50;
@@ -1667,7 +1748,7 @@
   }
 }
 .editor-floating-text-format:hover {
-  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
+  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04) !important;
 }
 .editor-floating-text-format .editor-separator--vertical {
   height: 20px;
@@ -1719,6 +1800,9 @@
   background-color: transparent;
 }
 .editor-list-color-dialog {
+  display: flex !important;
+  flex-direction: column !important;
+  gap: 16px;
   padding: 8px 0;
   animation: editor-fade-in 300ms cubic-bezier(0.4, 0, 0.2, 1);
 }
@@ -1734,11 +1818,11 @@
   padding: 0 16px;
   background-color: var(--background);
   transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1);
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
 }
 .editor-list-color-trigger:hover:not(:disabled):not([data-state=on]):not([data-state=active]) {
   transform: translateY(-1px);
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
 }
 .editor-list-color-trigger:active:not(:disabled) {
   transform: translateY(0) scale(0.98);
@@ -1746,8 +1830,9 @@
   filter: brightness(0.95);
 }
 .editor-color-picker-content {
-  display: flex;
-  flex-direction: column;
+  display: flex !important;
+  flex-direction: column !important;
+  width: 380px;
   gap: 16px;
   padding: 16px;
 }
@@ -1792,7 +1877,7 @@
   border-radius: 9999px;
   border: 1px solid var(--border);
   background-color: var(--background);
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
   transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1), border-color 150ms cubic-bezier(0.4, 0, 0.2, 1);
 }
 .editor-slider-thumb:focus-visible:focus-visible {
@@ -1805,7 +1890,7 @@
   height: 32px;
   border-radius: calc(var(--radius, 8px) - 2px);
   border: 1px solid var(--border);
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
 }
 .editor-color-swatch--disabled {
   opacity: 0.5;
@@ -1865,8 +1950,8 @@
   animation: editor-fade-in 300ms cubic-bezier(0.4, 0, 0.2, 1);
 }
 .editor-table-dialog__group {
-  display: flex;
-  flex-direction: column;
+  display: flex !important;
+  flex-direction: column !important;
   gap: 8px;
 }
 .editor-table-dialog__checkbox-group {
@@ -1955,18 +2040,13 @@
 .editor-layout-dialog-grid {
   display: grid;
   grid-template-columns: repeat(1, minmax(0, 1fr));
-  gap: 12px;
+  gap: 16px;
 }
-@media (min-width: 768px) {
+@media (min-width: 480px) {
   .editor-layout-dialog-grid {
-    grid-template-columns: repeat(3, minmax(0, 1fr));
+    grid-template-columns: repeat(2, minmax(0, 1fr));
   }
 }
-.editor-layout-dialog-group {
-  display: flex;
-  flex-direction: column;
-  gap: 6px;
-}
 .editor-layout-color-trigger {
   height: 44px;
   width: 100%;
@@ -1980,7 +2060,7 @@
 }
 .editor-layout-color-trigger:hover:not(:disabled):hover:not(:disabled):not([data-state=on]):not([data-state=active]) {
   transform: translateY(-1px);
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
 }
 .editor-layout-color-trigger:hover:not(:disabled):active:not(:disabled) {
   transform: translateY(0) scale(0.98);
@@ -1999,7 +2079,7 @@
   z-index: 10;
   width: 200px;
   border-radius: var(--radius, 8px);
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
 }
 .editor-mentions-item {
   display: flex;
@@ -2078,7 +2158,7 @@
   background-color: var(--background);
   border-radius: var(--radius, 8px);
   border: 1px solid var(--border);
-  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
+  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
   transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1);
   will-change: transform;
 }
@@ -2119,15 +2199,15 @@
   border: 1px solid var(--border);
   background-color: var(--popover);
   color: var(--popover-foreground);
-  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
+  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
   overflow: hidden;
   visibility: visible;
   opacity: 1;
   max-height: 300px;
 }
 .editor-command {
-  display: flex;
-  flex-direction: column;
+  display: flex !important;
+  flex-direction: column !important;
   height: 100%;
   width: 100%;
   overflow: hidden;
@@ -2195,7 +2275,7 @@
   overflow: hidden;
   border-radius: var(--radius, 8px);
   border: 1px solid var(--border);
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
   outline: none;
 }
 .editor-context-menu:has(*) {
@@ -2286,7 +2366,7 @@
   font-size: 0.75rem;
   white-space: nowrap;
   border: 1px solid var(--border);
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
   z-index: 50;
   pointer-events: none;
 }
@@ -2297,6 +2377,18 @@
 .editor-root-container.editor-root-container--shadow:focus-within {
   box-shadow: 0 0 0 1px var(--border, #d1d5db), 0 0 0 3px var(--ring, rgba(59, 130, 246, 0.5));
 }
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+@supports (color: color-mix(in lab, red, red)) {
+  *,
+  *::before,
+  *::after {
+    outline-color: color-mix(in oklab, var(--ring) 50%, transparent);
+  }
+}
 .lexical-editor-root {
   font-family:
     var(--font-inter),
@@ -2320,12 +2412,8 @@
   text-align: left !important;
   box-sizing: border-box !important;
 }
-.lexical-editor-root *,
-.lexical-editor-root *::before,
-.lexical-editor-root *::after {
-  box-sizing: border-box;
-}
 .lexical-editor-root p,
+.lexical-editor-root div,
 .lexical-editor-root ul,
 .lexical-editor-root ol,
 .lexical-editor-root li,
@@ -2854,7 +2942,7 @@
   position: relative;
   border-radius: var(--radius, 8px);
   tab-size: 2;
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
 }
 .lexical-editor-root .editor-code::before {
   content: attr(data-gutter);
@@ -2958,7 +3046,7 @@
 }
 .lexical-editor-root .editor-table .editor-table-cell-action-button:hover:not(:disabled):not([data-state=on]):not([data-state=active]) {
   transform: translateY(-1px);
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
 }
 .lexical-editor-root .editor-table .editor-table-cell-action-button:active:not(:disabled) {
   transform: translateY(0) scale(0.98);