FInaliza implementação de metodos na tradução reversa

exemplos/reverso/exemplo-metodos.css

@@ -33,12 +33,15 @@ div {
 
 a {
     backdrop-filter: hue-rotate(90deg);
+    transform: translateX(200px);
 }
 
 p {
     backdrop-filter: sepia(60%);
+    transform: translateY(50%);
 }
 
 div {
     backdrop-filter: saturate(5);
+    transform: translateZ(150);
 }

fontes/avaliador-sintatico/avaliador-sintatico-reverso.ts

@@ -747,6 +747,137 @@ export class AvaliadorSintaticoReverso implements AvaliadorSintaticoInterface {
                     lexema,
                     [valorSepia, quantificadorSepia]
                 );
+
+            case "translate":
+                this.consumir(tiposDeSimbolos.PARENTESE_ESQUERDO, "Esperado parêntese esquerdo após método 'translate'.");
+
+                const valorTranslacao1 = this.avancarEDevolverAnterior();
+
+                let quantificadorTranlacao1;
+                if (this.simbolos[this.atual].tipo === 'QUANTIFICADOR') {
+                    quantificadorTranlacao1 = this.avancarEDevolverAnterior();
+                } else {
+                    quantificadorTranlacao1 = null;
+                }
+
+                let valorTranslacao2;
+                let quantificadorTranlacao2;
+                if (this.simbolos[this.atual].tipo === 'VIRGULA') {
+                    this.consumir(tiposDeSimbolos.VIRGULA, "Esperado vírgula após primeiro argumento do método 'translate'.");
+                    valorTranslacao2 = this.avancarEDevolverAnterior();
+                    quantificadorTranlacao2 = this.avancarEDevolverAnterior();
+                } else {
+                    valorTranslacao2 = null;
+                    quantificadorTranlacao2 = null;
+                }
+
+                this.consumir(tiposDeSimbolos.PARENTESE_DIREITO, "Esperado parêntese direito após método 'translação'.");
+                return new SeletorValorReverso(
+                    lexema,
+                    [valorTranslacao1, quantificadorTranlacao1, valorTranslacao2, quantificadorTranlacao2]
+                );
+
+            case "translate-3d":
+                this.consumir(tiposDeSimbolos.PARENTESE_ESQUERDO, "Esperado parêntese esquerdo após método 'translate-3d'.");
+
+                const valorTranslacao3d1 = this.avancarEDevolverAnterior();
+
+                let quantificadorTranlacao3d1;
+                if (this.simbolos[this.atual].tipo === 'QUANTIFICADOR') {
+                    quantificadorTranlacao3d1 = this.avancarEDevolverAnterior();
+                } else {
+                    quantificadorTranlacao3d1 = null;
+                }
+
+                let valorTranslacao3d2;
+                let quantificadorTranlacao3d2;
+                if (this.simbolos[this.atual].tipo === 'VIRGULA') {
+                    this.consumir(tiposDeSimbolos.VIRGULA, "Esperado vírgula após primeiro argumento do método 'translate-3d'.");
+                    valorTranslacao3d2 = this.avancarEDevolverAnterior();
+                    if (this.simbolos[this.atual].tipo === 'QUANTIFICADOR') {
+                        quantificadorTranlacao3d2 = this.avancarEDevolverAnterior();
+                    } else {
+                        quantificadorTranlacao3d2 = null;
+                    }
+                } else {
+                    valorTranslacao3d2 = null;
+                    quantificadorTranlacao3d2 = null;
+                }
+
+                let valorTranslacao3d3;
+                let quantificadorTranlacao3d3;
+                if (this.simbolos[this.atual].tipo === 'VIRGULA') {
+                    this.consumir(tiposDeSimbolos.VIRGULA, "Esperado vírgula após primeiro argumento do método 'translate-3d'.");
+                    valorTranslacao3d3 = this.avancarEDevolverAnterior();
+                    if (this.simbolos[this.atual].tipo === 'QUANTIFICADOR') {
+                        quantificadorTranlacao3d3 = this.avancarEDevolverAnterior();
+                    } else {
+                        quantificadorTranlacao3d3 = null;
+                    }
+                } else {
+                    valorTranslacao3d3 = null;
+                    quantificadorTranlacao3d3 = null;
+                }
+
+                this.consumir(tiposDeSimbolos.PARENTESE_DIREITO, "Esperado parêntese direito após método 'translate-3d'.");
+                return new SeletorValorReverso(
+                    lexema,
+                    [valorTranslacao3d1, quantificadorTranlacao3d1, valorTranslacao3d2, quantificadorTranlacao3d2, valorTranslacao3d3, quantificadorTranlacao3d3]
+                );
+
+            case "translateX":
+                this.consumir(tiposDeSimbolos.PARENTESE_ESQUERDO, "Esperado parêntese esquerdo após método 'translateX'.");
+                const valorTranslaçaoX = this.avancarEDevolverAnterior();
+                let quantificadorTranslaçaoX;
+                if (this.simbolos[this.atual].tipo === 'QUANTIFICADOR') {
+                    quantificadorTranslaçaoX = this.avancarEDevolverAnterior();
+                } else {
+                    quantificadorTranslaçaoX = null;
+                }
+                this.consumir(tiposDeSimbolos.PARENTESE_DIREITO, "Esperado parêntese direito após método 'translateX'.");
+                return new SeletorValorReverso(
+                    lexema,
+                    [valorTranslaçaoX, quantificadorTranslaçaoX]
+                );
+
+            case "translateY":
+                this.consumir(tiposDeSimbolos.PARENTESE_ESQUERDO, "Esperado parêntese esquerdo após método 'translateY'.");
+                const valorTranslaçaoY = this.avancarEDevolverAnterior();
+                let quantificadorTranslaçaoY;
+                if (this.simbolos[this.atual].tipo === 'QUANTIFICADOR') {
+                    quantificadorTranslaçaoY = this.avancarEDevolverAnterior();
+                } else {
+                    quantificadorTranslaçaoY = null;
+                }
+                this.consumir(tiposDeSimbolos.PARENTESE_DIREITO, "Esperado parêntese direito após método 'translateY'.");
+                return new SeletorValorReverso(
+                    lexema,
+                    [valorTranslaçaoY, quantificadorTranslaçaoY]
+                );
+
+            case "translateZ":
+                this.consumir(tiposDeSimbolos.PARENTESE_ESQUERDO, "Esperado parêntese esquerdo após método 'translateZ'.");
+                const valorTranslaçaoZ = this.avancarEDevolverAnterior();
+                let quantificadorTranslaçaoZ;
+                if (this.simbolos[this.atual].tipo === 'QUANTIFICADOR') {
+                    quantificadorTranslaçaoZ = this.avancarEDevolverAnterior();
+                } else {
+                    quantificadorTranslaçaoZ = null;
+                }
+                this.consumir(tiposDeSimbolos.PARENTESE_DIREITO, "Esperado parêntese direito após método 'translateZ'.");
+                return new SeletorValorReverso(
+                    lexema,
+                    [valorTranslaçaoZ, quantificadorTranslaçaoZ]
+                );
+
+            // case "url":
+            //     this.consumir(tiposDeSimbolos.PARENTESE_ESQUERDO, "Esperado parêntese esquerdo após método 'url'.");
+            //     const url = this.validacaoUrl();
+            //     this.consumir(tiposDeSimbolos.PARENTESE_DIREITO, "Esperado parêntese direito após argumento do método url.");
+            //     return new SeletorValorReverso(
+            //         lexema,
+            //         [url]
+            //     );
         }
     }
 

fontes/avaliador-sintatico/avaliador-sintatico.ts

@@ -703,28 +703,28 @@ export class AvaliadorSintatico implements AvaliadorSintaticoInterface {
 
                 const valorTranslacao1 = this.avancarEDevolverAnterior();
 
-                let quantificadorTranlacao1;
+                let quantificadorTranslacao1;
                 if (this.simbolos[this.atual].tipo === 'QUANTIFICADOR') {
-                    quantificadorTranlacao1 = this.avancarEDevolverAnterior();
+                    quantificadorTranslacao1 = this.avancarEDevolverAnterior();
                 } else {
-                    quantificadorTranlacao1 = null;
+                    quantificadorTranslacao1 = null;
                 }
 
                 let valorTranslacao2;
-                let quantificadorTranlacao2;
+                let quantificadorTranslacao2;
                 if (this.simbolos[this.atual].tipo === 'VIRGULA') {
                     this.consumir(tiposDeSimbolos.VIRGULA, "Esperado vírgula após primeiro argumento do método 'translação'.");
                     valorTranslacao2 = this.avancarEDevolverAnterior();
-                    quantificadorTranlacao2 = this.avancarEDevolverAnterior();
+                    quantificadorTranslacao2 = this.avancarEDevolverAnterior();
                 } else {
                     valorTranslacao2 = null;
-                    quantificadorTranlacao2 = null;
+                    quantificadorTranslacao2 = null;
                 }
 
                 this.consumir(tiposDeSimbolos.PARENTESE_DIREITO, "Esperado parêntese direito após método 'translação'.");
                 return new SeletorValor(
                     lexema,
-                    [valorTranslacao1, quantificadorTranlacao1, valorTranslacao2, quantificadorTranlacao2]
+                    [valorTranslacao1, quantificadorTranslacao1, valorTranslacao2, quantificadorTranslacao2]
                 );
 
             case "translacao":

fontes/modificadores/dicionario/dicionario-reverso-modificadores.ts

@@ -397,6 +397,12 @@ import { RotateZ } from "../../valores/metodos/css/rotateZ";
 import { HueRotate } from "../../valores/metodos/css/hue-rotate";
 import { Saturate } from "../../valores/metodos/css/saturate";
 import { Sepia } from "../../valores/metodos/css/sepia";
+import { Translate3d } from "../../valores/metodos/css/translate3d";
+import { TranslateZ } from "../../valores/metodos/css/translateZ";
+import { TranslateX } from "../../valores/metodos/css/translateX";
+import { TranslateY } from "../../valores/metodos/css/translateY";
+import { Translate } from "../../valores/metodos/css/translate";
+import { Url } from "../../valores/metodos/css/url";
 
 export const DicionarioReversoModificadores: { [nomeCss: string]: any } = {
     "word-wrap": AgruparPalavra,
@@ -800,4 +806,10 @@ export const DicionarioReversoModificadores: { [nomeCss: string]: any } = {
     "skewX": SkewX,
     "skewY": SkewY,
     "steps": Steps,
+    // "translate": Translate,
+    "translate3d": Translate3d,
+    "translateX": TranslateX,
+    "translateY": TranslateY,
+    "translateZ": TranslateZ,
+    "url": Url,
 }

fontes/valores/metodos/css/translate.ts

@@ -0,0 +1,35 @@
+import { Simbolo } from "../../../lexador";
+import { MetodoCss } from "./metodo-css";
+
+export class Translate extends MetodoCss {
+    valor1: number;
+    quantificador1: string;
+    valor2: number;
+    quantificador2: string;
+    traducao: string;
+
+    constructor(valor1: Simbolo, quantificador1: Simbolo, valor2: Simbolo, quantificador2: Simbolo) {
+        super();
+        this.valor1 = Number(valor1.lexema);
+        this.quantificador1 = quantificador1 ? quantificador1.lexema : null;
+        this.valor2 = valor2 ? Number(valor2.lexema) : null;
+        this.quantificador2 = quantificador2 ? quantificador2.lexema : null;
+        this.traducao = 'translate';
+    }
+
+    paraTexto() {
+        if (!this.quantificador1 && !this.valor2 && !this.quantificador2) {
+            return `translacao(${this.valor1})`
+        }
+
+        if (!this.valor2 && !this.quantificador2) {
+            this.quantificador1 === 'graus' ? this.quantificador1 = 'deg' : null;
+            return `translacao(${this.valor1}${this.quantificador1})`
+        }
+
+        this.quantificador1 === 'graus' ? this.quantificador1 = 'deg' : null;
+        this.quantificador2 === 'graus' ? this.quantificador2 = 'deg' : null;
+
+        return `translacao(${this.valor1}${this.quantificador1}, ${this.valor2}${this.quantificador2})`
+    }
+}

fontes/valores/metodos/css/translate3d.ts

@@ -0,0 +1,55 @@
+import { Simbolo } from "../../../lexador";
+import { MetodoCss } from "./metodo-css";
+
+export class Translate3d extends MetodoCss {
+    valor1: number;
+    quantificador1: string;
+    valor2: number;
+    quantificador2: string;
+    valor3: number;
+    quantificador3: string;
+    traducao: string;
+
+    constructor(valor1: Simbolo, quantificador1: Simbolo, valor2: Simbolo, quantificador2: Simbolo, valor3: Simbolo, quantificador3: Simbolo) {
+        super();
+        this.valor1 = Number(valor1.lexema);
+        this.quantificador1 = quantificador1 ? quantificador1.lexema : null;
+        this.valor2 = valor2 ? Number(valor2.lexema) : null;
+        this.quantificador2 = quantificador2 ? quantificador2.lexema : null;
+        this.valor3 = valor3 ? Number(valor3.lexema) : null;
+        this.quantificador3 = quantificador3 ? quantificador3.lexema : null;
+        this.traducao = 'translate3d';
+    }
+
+    paraTexto() {
+        if (!this.quantificador1 && !this.valor2 && !this.quantificador2 && !this.valor3 && !this.quantificador3) {
+            return `translacao-3d(${this.valor1})`
+        }
+
+        if (!this.quantificador1 && this.quantificador2 && this.quantificador3) {
+            return `translacao-3d(${this.valor1}, ${this.valor2}${this.quantificador2}, ${this.valor3}${this.quantificador3})`
+        }
+
+        if (!this.quantificador2 && this.quantificador1 && this.quantificador3) {
+            return `translacao-3d(${this.valor1}${this.quantificador1}, ${this.valor2}, ${this.valor3}${this.quantificador3})`
+        }
+
+        if (!this.quantificador3 && this.quantificador2 && this.quantificador1) {
+            return `translacao-3d(${this.valor1}${this.quantificador1}, ${this.valor2}${this.quantificador2}, ${this.valor3})`
+        }
+
+        if (!this.quantificador1 && !this.quantificador2 && this.quantificador3) {
+            return `translacao-3d(${this.valor1}, ${this.valor2}, ${this.valor3}${this.quantificador3})`
+        }
+
+        if (!this.quantificador3 && this.quantificador2 && !this.quantificador1) {
+            return `translacao-3d(${this.valor1}, ${this.valor2}${this.quantificador2}, ${this.valor3})`
+        }
+
+        if (!this.quantificador3 && !this.quantificador2 && this.quantificador1) {
+            return `translacao-3d(${this.valor1}${this.quantificador1}, ${this.valor2}, ${this.valor3})`
+        }
+
+        return `translacao-3d(${this.valor1}${this.quantificador1}, ${this.valor2}${this.quantificador2}, ${this.valor3}${this.quantificador3})`
+    }
+}

fontes/valores/metodos/css/translateX.ts

@@ -0,0 +1,23 @@
+import { Simbolo } from "../../../lexador";
+import { MetodoCss } from "./metodo-css";
+
+export class TranslateX extends MetodoCss {
+    valor: number;
+    quantificador: string;
+    traducao: string;
+
+    constructor(valor: Simbolo, quantificador: Simbolo) {
+        super();
+        this.valor = Number(valor.lexema);
+        this.quantificador = quantificador ? quantificador.lexema : null;
+        this.traducao = 'translateX';
+    }
+
+    paraTexto() {
+        if (this.quantificador) {
+            return `translacao-horizontal(${this.valor}${this.quantificador})`
+        }
+
+        return `translacao-horizontal(${this.valor})`
+    }
+}

fontes/valores/metodos/css/translateY.ts

@@ -0,0 +1,23 @@
+import { Simbolo } from "../../../lexador";
+import { MetodoCss } from "./metodo-css";
+
+export class TranslateY extends MetodoCss {
+    valor: number;
+    quantificador: string;
+    traducao: string;
+
+    constructor(valor: Simbolo, quantificador: Simbolo) {
+        super();
+        this.valor = Number(valor.lexema);
+        this.quantificador = quantificador ? quantificador.lexema : null;
+        this.traducao = 'translateY';
+    }
+
+    paraTexto() {
+        if (this.quantificador) {
+            return `translacao-vertical(${this.valor}${this.quantificador})`
+        }
+
+        return `translacao-vertical(${this.valor})`
+    }
+}

fontes/valores/metodos/css/translateZ.ts

@@ -0,0 +1,23 @@
+import { Simbolo } from "../../../lexador";
+import { MetodoCss } from "./metodo-css";
+
+export class TranslateZ extends MetodoCss {
+    valor: number;
+    quantificador: string;
+    traducao: string;
+
+    constructor(valor: Simbolo, quantificador: Simbolo) {
+        super();
+        this.valor = Number(valor.lexema);
+        this.quantificador = quantificador ? quantificador.lexema : null;
+        this.traducao = 'translateZ';
+    }
+
+    paraTexto() {
+        if (this.quantificador) {
+            return `translacao-eixo-z(${this.valor}${this.quantificador})`
+        }
+
+        return `translacao-eixo-z(${this.valor})`
+    }
+}