refact: melhorias de código

skaduhs5232 · Jun 11, 2024 · c9a7d2d · c9a7d2d
1 parent d475aaa
commit c9a7d2d
Show file tree

Hide file tree

Showing 4 changed files with 54 additions and 7 deletions.
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -26,7 +26,7 @@
           "semi": false
         }
       ],
-      "no-console": "warn",
+      "no-console": "off",
       "camelcase": "warn",
       "@typescript-eslint/interface-name-prefix": "off",
       "@typescript-eslint/explicit-function-return-type": "off",

diff --git a/src/extensions/image/image.ts b/src/extensions/image/image.ts
@@ -237,7 +237,7 @@ export const Image = Node.create<ImageOptions>({
         key: new PluginKey('eventHandler'),
         props: {
           handleDOMEvents: {
-            drop: (view, event) => {
+            drop: (_view, event) => {
               const hasFiles = event.dataTransfer && event.dataTransfer.files && event.dataTransfer.files.length
 
               if (hasFiles) {

diff --git a/src/extensions/table/TableCellBalloon.ts b/src/extensions/table/TableCellBalloon.ts
@@ -16,7 +16,7 @@ export class TableCellBalloon {
     this.balloon = new Balloon(editor, {
       position: 'float'
     })
-    this.itenModal = new ItensModalCell(editor)
+    this.itenModal = new ItensModalCell(editor, this)
     this.balloon.setPanelContent(this.itenModal.render())
     editor.view.dom!.parentElement!.appendChild(this.balloon.getBalloon())
   }
@@ -61,17 +61,18 @@ export class ItensModalCell {
   private cellHeight: HTMLInputElement
   private cellWidth: HTMLInputElement
   selectedCell!: ResolvedPos
+  balloon: TableCellBalloon
 
-  constructor(editor: Editor) {
+  constructor(editor: Editor, balloon: TableCellBalloon) {
     this.editor = editor
     this.cellBorderStyles = document.createElement('select')
     this.cellBorderStyles.style.width = '80px'
     this.cellBorderStyles.className = 'ex-selectInput'
-
+    this.balloon = balloon
     const borderStyles = {
       'sem borda': 'none',
       // eslint-disable-next-line prettier/prettier
-          sólida: 'solid',
+      'sólida': 'solid',
       pontilhada: 'dotted',
       tracejada: 'dashed',
       dupla: 'double',
@@ -81,9 +82,12 @@ export class ItensModalCell {
       'alto relevo': 'outset'
     }
 
-    Object.entries(borderStyles).forEach(([name, value]) => {
+    Object.entries(borderStyles).forEach(([name, value], index) => {
       const option = document.createElement('option')
       option.value = value
+      if (index === 0) {
+        option.setAttribute('selected', 'selected')
+      }
       option.textContent = name
       this.cellBorderStyles.appendChild(option)
     })
@@ -123,15 +127,35 @@ export class ItensModalCell {
   updateBorderValue(attr: Attrs) {
     if (attr?.border) {
       const [width, style, color] = attr.border.split(' ')
+      this.cellBorderStyles.querySelectorAll('option').forEach(option => {
+        if (option.value == style) {
+          option.setAttribute('selected', 'selected')
+        } else {
+          option.removeAttribute('selected')
+        }
+      })
       this.cellBorderWidth.value = width
       this.cellBorderStyles.value = style
       this.cellBorderColor.value = color
+    } else {
+      this.cellBorderStyles.querySelectorAll('option').forEach(option => {
+        if (option.value == 'none') {
+          option.setAttribute('selected', 'selected')
+        } else {
+          option.removeAttribute('selected')
+        }
+      })
+      this.cellBorderWidth.value = ''
+      this.cellBorderStyles.value = 'none'
+      this.cellBorderColor.value = ''
     }
   }
 
   updateBackGroundValue(attr: Attrs) {
     if (attr?.background) {
       this.cellBackgroundColor.value = attr.background
+    } else {
+      this.cellBackgroundColor.value = ''
     }
   }
 
@@ -140,6 +164,9 @@ export class ItensModalCell {
       const style = attr.style
       this.cellHeight.value = style?.height?.replace('px', '')
       this.cellWidth.value = style?.width?.replace('px', '')
+    } else {
+      this.cellHeight.value = ''
+      this.cellWidth.value = ''
     }
   }
 
@@ -282,6 +309,7 @@ export class ItensModalCell {
     const botaoConfirma = createButton(this.editor, 'Salvar', () => {
       this.aplicarEstiloBorda()
       this.aplicarDimensoesTabela()
+      this.balloon.off()
     })
     botaoConfirma.className = 'ex-botaoSalvar'
     botaoConfirma.appendChild(iconConfirma)
@@ -294,6 +322,7 @@ export class ItensModalCell {
         background: '',
         border: ''
       })
+      this.balloon.off()
     })
     botaoCancela.className = 'ex-botaoCancela'
     botaoCancela.appendChild(iconCancela)

diff --git a/src/public/style.css b/src/public/style.css
@@ -9,6 +9,14 @@
   --color-cancel: #db3700;
   --color-base-text: #333;
   --color-focused-background: rgba(158,201,250,.3);
+  --ex-font-size-base: 13px;
+  --ex-line-height-base: 1.84615;
+  --ex-font-face: Helvetica,Arial,Tahoma,Verdana,Sans-Serif;
+  --ex-font-size-tiny: 0.7em;
+  --ex-font-size-small: 0.75em;
+  --ex-font-size-normal: 1em;
+  --ex-font-size-big: 1.4em;
+  --ex-font-size-large: 1.8em;
 }
 
 .ProseMirror {
@@ -34,6 +42,16 @@
   border: 1px hsl(0, 0%, 82.7%) solid;
 }
 
+.ex-reset-all {
+  border-collapse: collapse;
+  color: var(--color-base-text);
+  cursor: auto;
+  float: none;
+  font: normal normal normal var(--ex-font-size-base)/var(--ex-line-height-base) var(--ex-font-face);
+  text-align: left;
+  white-space: nowrap;
+}
+
 .tiptap {
   font-family: sans-serif, Arial, Verdana, "Trebuchet MS";
   color: #333 !important;