analytica-frontend-lib/dist/chunk-FTQMDLZ5.mjs

Repositório público dos componentes utilizados nas plataformas da Analytica Ensino

import {
  useMobile
} from "./chunk-GKY77WVA.mjs";
import {
  TextArea_default
} from "./chunk-LI2FS7M2.mjs";
import {
  MenuContent,
  MenuItem,
  Menu_default
} from "./chunk-WI3GQX74.mjs";
import {
  Input_default
} from "./chunk-EXVVHZOO.mjs";
import {
  Modal_default
} from "./chunk-TNLGS7SB.mjs";
import {
  Button_default
} from "./chunk-LAYB7IKW.mjs";
import {
  Text_default
} from "./chunk-IMCIR6TJ.mjs";

// src/components/RichEditor/components/utils.ts
function processLatexInHtml(html) {
  if (!html) return html;
  const latexPattern = /\$([^$]+?)\$/g;
  return html.replaceAll(latexPattern, (_match, latex) => {
    const escapedLatex = latex.replaceAll('"', """);
    return `<span data-type="math-inline" data-latex="${escapedLatex}"></span>`;
  });
}
function unprocessLatexInHtml(html) {
  if (!html) return html;
  const mathSpanPattern = /<span[^>]*data-type="math-inline"[^>]*data-latex="([^"]*)"[^>]*><\/span>/g;
  return html.replaceAll(mathSpanPattern, (_match, latex) => {
    const unescapedLatex = latex.replaceAll("&quot;", '"');
    return `$${unescapedLatex}$`;
  });
}

// src/components/RichEditor/components/FormulaDialog.tsx
import { useState, useEffect } from "react";
import { SparkleIcon } from "@phosphor-icons/react/dist/csr/Sparkle";
import katex from "katex";
import "katex/dist/katex.min.css";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
var formulas = {
  matematica: [
    {
      label: "Teorema de Pit\xE1goras",
      latex: "a^2 + b^2 = c^2",
      preview: "a\xB2 + b\xB2 = c\xB2"
    },
    {
      label: "Equa\xE7\xE3o de 2\xBA grau",
      latex: String.raw`x = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}`,
      preview: "x = (-b \xB1 \u221A(b\xB2 - 4ac)) / 2a"
    },
    {
      label: "\xC1rea do c\xEDrculo",
      latex: String.raw`A = \pi r^2`,
      preview: "A = \u03C0r\xB2"
    },
    {
      label: "\xC1rea do tri\xE2ngulo",
      latex: String.raw`A = \frac{b \cdot h}{2}`,
      preview: "A = (b \xB7 h) / 2"
    },
    {
      label: "Volume do cilindro",
      latex: String.raw`V = \pi r^2 h`,
      preview: "V = \u03C0r\xB2h"
    },
    {
      label: "Volume da esfera",
      latex: String.raw`V = \frac{4}{3} \pi r^3`,
      preview: "V = (4/3)\u03C0r\xB3"
    }
  ],
  fisica: [
    {
      label: "Velocidade m\xE9dia",
      latex: String.raw`v = \frac{\Delta s}{\Delta t}`,
      preview: "v = \u0394s / \u0394t"
    },
    {
      label: "Acelera\xE7\xE3o",
      latex: String.raw`a = \frac{\Delta v}{\Delta t}`,
      preview: "a = \u0394v / \u0394t"
    },
    {
      label: "For\xE7a (2\xAA Lei de Newton)",
      latex: String.raw`F = m \cdot a`,
      preview: "F = m \xB7 a"
    },
    {
      label: "Energia cin\xE9tica",
      latex: String.raw`E_c = \frac{1}{2} m v^2`,
      preview: "Ec = \xBDmv\xB2"
    },
    {
      label: "Energia potencial",
      latex: String.raw`E_p = m \cdot g \cdot h`,
      preview: "Ep = m \xB7 g \xB7 h"
    },
    {
      label: "Lei da Gravita\xE7\xE3o",
      latex: String.raw`F = G \frac{m_1 m_2}{r^2}`,
      preview: "F = G(m\u2081m\u2082)/r\xB2"
    }
  ],
  quimica: [
    {
      label: "Concentra\xE7\xE3o molar",
      latex: String.raw`C = \frac{n}{V}`,
      preview: "C = n / V"
    },
    {
      label: "Densidade",
      latex: String.raw`\rho = \frac{m}{V}`,
      preview: "\u03C1 = m / V"
    },
    {
      label: "pH",
      latex: String.raw`pH = -\log[H^+]`,
      preview: "pH = -log[H\u207A]"
    },
    { label: "Lei dos gases ideais", latex: "PV = nRT", preview: "PV = nRT" },
    {
      label: "Equa\xE7\xE3o de Arrhenius",
      latex: String.raw`k = A e^{-\frac{E_a}{RT}}`,
      preview: "k = Ae^(-Ea/RT)"
    },
    {
      label: "N\xFAmero de mols",
      latex: String.raw`n = \frac{m}{M}`,
      preview: "n = m / M"
    }
  ],
  simbolos: [
    { label: "Alfa", latex: String.raw`\alpha`, preview: "\u03B1" },
    { label: "Beta", latex: String.raw`\beta`, preview: "\u03B2" },
    { label: "Gama", latex: String.raw`\gamma`, preview: "\u03B3" },
    { label: "Delta", latex: String.raw`\Delta`, preview: "\u0394" },
    { label: "Pi", latex: String.raw`\pi`, preview: "\u03C0" },
    { label: "Sigma", latex: String.raw`\sigma`, preview: "\u03C3" },
    { label: "Omega", latex: String.raw`\omega`, preview: "\u03C9" },
    { label: "Infinito", latex: String.raw`\infty`, preview: "\u221E" },
    { label: "Somat\xF3rio", latex: String.raw`\sum`, preview: "\u03A3" },
    { label: "Integral", latex: String.raw`\int`, preview: "\u222B" },
    { label: "Raiz quadrada", latex: String.raw`\sqrt{}`, preview: "\u221A" },
    { label: "Fra\xE7\xE3o", latex: String.raw`\frac{}{}`, preview: "a/b" }
  ]
};
var categoryLabels = {
  matematica: "Matem\xE1tica",
  fisica: "F\xEDsica",
  quimica: "Qu\xEDmica",
  simbolos: "S\xEDmbolos"
};
function FormulaDialog({
  open,
  onClose,
  onInsert,
  onGenerateWithAI
}) {
  const { isTablet } = useMobile();
  const [category, setCategory] = useState("matematica");
  const [latex, setLatex] = useState("");
  const [preview, setPreview] = useState("");
  const [error, setError] = useState("");
  const [aiDescription, setAiDescription] = useState("");
  const [isGeneratingAI, setIsGeneratingAI] = useState(false);
  const [aiError, setAiError] = useState("");
  useEffect(() => {
    if (!latex.trim()) {
      setPreview("");
      setError("");
      return;
    }
    try {
      const rendered = katex.renderToString(latex, {
        throwOnError: true,
        displayMode: false
      });
      setPreview(rendered);
      setError("");
    } catch {
      setError("F\xF3rmula inv\xE1lida");
      setPreview("");
    }
  }, [latex]);
  const handleInsert = () => {
    if (!latex.trim() || error) return;
    onInsert(latex);
    resetState();
  };
  const handleClose = () => {
    resetState();
    onClose();
  };
  const resetState = () => {
    setLatex("");
    setError("");
    setPreview("");
    setAiDescription("");
    setAiError("");
    setCategory("matematica");
  };
  const handleGenerateWithAI = async () => {
    if (!onGenerateWithAI || !aiDescription.trim()) return;
    setIsGeneratingAI(true);
    setAiError("");
    try {
      const generatedLatex = await onGenerateWithAI(aiDescription.trim());
      setLatex(generatedLatex);
    } catch (err) {
      setAiError(
        err instanceof Error ? err.message : "Erro ao gerar f\xF3rmula com IA"
      );
    } finally {
      setIsGeneratingAI(false);
    }
  };
  const selectFormula = (formula) => {
    setLatex(formula.latex);
  };
  const renderPreview = () => {
    if (error) {
      return /* @__PURE__ */ jsx("p", { className: "text-sm text-error-600", children: error });
    }
    if (preview) {
      return /* @__PURE__ */ jsx(
        "span",
        {
          dangerouslySetInnerHTML: { __html: preview },
          className: "text-lg"
        }
      );
    }
    return /* @__PURE__ */ jsx("p", { className: "text-sm text-text-300 text-center", children: "Selecione uma f\xF3rmula ou s\xEDmbolo, insira o c\xF3digo LaTeX, ou crie sua f\xF3rmula com a IA e ela aparecer\xE1 aqui." });
  };
  return /* @__PURE__ */ jsx(
    Modal_default,
    {
      isOpen: open,
      onClose: handleClose,
      title: "Inserir f\xF3rmula",
      size: "xl",
      className: isTablet ? "max-w-[90vw] max-h-[90vh] overflow-y-auto" : "",
      footer: /* @__PURE__ */ jsxs(Fragment, { children: [
        /* @__PURE__ */ jsx(
          Button_default,
          {
            variant: "outline",
            size: isTablet ? "extra-small" : "medium",
            onClick: handleClose,
            children: "Cancelar"
          }
        ),
        /* @__PURE__ */ jsx(
          Button_default,
          {
            variant: "solid",
            action: "primary",
            size: isTablet ? "extra-small" : "medium",
            onClick: handleInsert,
            disabled: !latex.trim() || !!error,
            children: "Inserir f\xF3rmula"
          }
        )
      ] }),
      children: /* @__PURE__ */ jsxs("div", { className: isTablet ? "flex flex-col gap-6" : "flex gap-6", children: [
        /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
          /* @__PURE__ */ jsx(Text_default, { size: "sm", weight: "bold", className: "text-text-900 mb-4", children: "F\xF3rmulas e s\xEDmbolos mais usados" }),
          /* @__PURE__ */ jsx(
            Menu_default,
            {
              defaultValue: "matematica",
              value: category,
              onValueChange: (value) => setCategory(value),
              variant: "menu2",
              className: "mb-4",
              children: /* @__PURE__ */ jsx(MenuContent, { variant: "menu2", children: Object.entries(categoryLabels).map(([key, label]) => /* @__PURE__ */ jsx(MenuItem, { value: key, variant: "menu2", children: label }, key)) })
            }
          ),
          /* @__PURE__ */ jsx(
            "div",
            {
              className: `grid ${isTablet ? "grid-cols-1" : "grid-cols-2 max-h-[300px] overflow-y-auto pr-2"} gap-3`,
              children: formulas[category].map((formula) => /* @__PURE__ */ jsxs(
                Button_default,
                {
                  type: "button",
                  onClick: () => selectFormula(formula),
                  className: `bg-transparent flex flex-col items-start p-3 text-left border rounded-lg hover:border-primary-400 hover:bg-primary-50 transition-colors ${latex === formula.latex ? "border-primary-500" : "border-border-200"}`,
                  children: [
                    /* @__PURE__ */ jsx(Text_default, { weight: "medium", className: "text-sm text-text-900 mb-1", children: formula.label }),
                    /* @__PURE__ */ jsx(Text_default, { size: "xs", className: "text-text-500 font-mono", children: formula.preview })
                  ]
                },
                formula.label
              ))
            }
          )
        ] }),
        /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
          /* @__PURE__ */ jsx(Text_default, { size: "sm", weight: "bold", className: "text-text-900 mb-4", children: "Crie sua f\xF3rmula" }),
          /* @__PURE__ */ jsxs("div", { className: "mb-4", children: [
            /* @__PURE__ */ jsx(Text_default, { weight: "medium", className: "text-xs text-text-600 mb-2", children: "F\xF3rmula gerada" }),
            /* @__PURE__ */ jsx("div", { className: "min-h-[80px] border border-border-200 rounded-lg px-4 py-3 bg-background-50 flex items-center justify-center", children: renderPreview() })
          ] }),
          /* @__PURE__ */ jsxs("div", { className: "mb-4", children: [
            /* @__PURE__ */ jsx(Text_default, { weight: "medium", className: "text-xs text-text-600 mb-2 block", children: "Digite o c\xF3digo LaTeX" }),
            /* @__PURE__ */ jsx(
              Input_default,
              {
                type: "text",
                value: latex,
                onChange: (e) => setLatex(e.target.value),
                placeholder: String.raw`Ex: \sqrt{x^2 + y^2} ou \frac{a}{b}`
              }
            ),
            /* @__PURE__ */ jsxs(Text_default, { className: "text-xs text-text-400 mt-1", children: [
              "Use sintaxe LaTeX:",
              " ",
              String.raw`\sqrt{}, \frac{}{}, ^{}, _{}, \pi, \alpha`,
              ", etc."
            ] })
          ] }),
          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 my-4", children: [
            /* @__PURE__ */ jsx("div", { className: "flex-1 h-px bg-border-200" }),
            /* @__PURE__ */ jsx("span", { className: "text-xs text-text-400", children: "Ou" }),
            /* @__PURE__ */ jsx("div", { className: "flex-1 h-px bg-border-200" })
          ] }),
          /* @__PURE__ */ jsxs("div", { className: "mb-4", children: [
            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 mb-2", children: [
              /* @__PURE__ */ jsx(SparkleIcon, { size: 14, className: "text-primary-600" }),
              /* @__PURE__ */ jsx(Text_default, { className: "text-xs font-medium text-text-600", children: "Descreva o que deseja criar com IA" })
            ] }),
            /* @__PURE__ */ jsx(
              TextArea_default,
              {
                value: aiDescription,
                onChange: (e) => setAiDescription(e.target.value),
                placeholder: "Ex: \xE1rea do c\xEDrculo, bhaskara, velocidade m\xE9dia...",
                rows: 2,
                disabled: isGeneratingAI
              }
            ),
            /* @__PURE__ */ jsx(Text_default, { size: "xs", className: "text-text-400 mt-1", children: onGenerateWithAI ? "Descreva em linguagem natural e a IA gerar\xE1 o LaTeX correspondente." : "Funcionalidade de IA n\xE3o dispon\xEDvel." }),
            aiError && /* @__PURE__ */ jsx(Text_default, { size: "xs", className: "text-error-600 mt-1", children: aiError }),
            /* @__PURE__ */ jsxs(
              Button_default,
              {
                variant: "outline",
                size: "small",
                disabled: !onGenerateWithAI || !aiDescription.trim() || isGeneratingAI,
                onClick: handleGenerateWithAI,
                className: "mt-2 ml-auto flex items-center gap-1",
                children: [
                  /* @__PURE__ */ jsx(SparkleIcon, { size: 14 }),
                  isGeneratingAI ? "Gerando..." : "Gerar f\xF3rmula"
                ]
              }
            )
          ] })
        ] })
      ] })
    }
  );
}

export {
  processLatexInHtml,
  unprocessLatexInHtml,
  FormulaDialog
};
//# sourceMappingURL=chunk-FTQMDLZ5.mjs.map