npm - @brunoalz/smartgesti-site-editor - Versions diffs - 1.0.0 → 1.2.0 - Mend

@brunoalz/smartgesti-site-editor 1.0.0 → 1.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (219) hide show

package/dist/editor/PageTabBar.js CHANGED Viewed

@@ -1,37 +1,61 @@
-import { jsxs as t, jsx as r } from "react/jsx-runtime";
-function g({
-  pages: i,
-  currentPageId: a,
-  onSelectPage: n,
-  onAddPage: d,
-  onRemovePage: l,
-  canRemovePage: s
+import { jsxs as t, jsx as r, Fragment as f } from "react/jsx-runtime";
+import { useState as $, useRef as M, useEffect as L, useMemo as c, useCallback as j } from "react";
+import { pluginRegistry as A } from "../engine/plugins/pluginRegistry.js";
+function R({
+  pages: n,
+  currentPageId: h,
+  onSelectPage: u,
+  onAddPage: k,
+  onRemovePage: v,
+  canRemovePage: y,
+  activePlugins: w,
+  onActivatePlugin: g,
+  onDeactivatePlugin: m
 }) {
-  return /* @__PURE__ */ t("div", { className: "flex items-center gap-2 border-b border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900 px-3 py-2", children: [
-    /* @__PURE__ */ r("div", { className: "text-xs font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider", children: "Módulos:" }),
-    /* @__PURE__ */ t("div", { className: "flex-1 flex items-center gap-2 overflow-x-auto scrollbar-thin scrollbar-thumb-gray-300 dark:scrollbar-thumb-gray-600", children: [
-      i.map((e) => {
-        const o = e.id === a;
+  const [l, o] = $(!1), d = M(null);
+  L(() => {
+    if (!l) return;
+    const e = (a) => {
+      d.current && !d.current.contains(a.target) && o(!1);
+    };
+    return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+  }, [l]);
+  const p = c(() => A.getAll(), []), N = c(
+    () => n.filter((e) => !e.pluginId),
+    [n]
+  ), x = c(
+    () => n.filter((e) => !!e.pluginId),
+    [n]
+  ), C = j(
+    (e, a) => {
+      a ? m(e) : g(e);
+    },
+    [g, m]
+  );
+  return /* @__PURE__ */ t("div", { className: "flex items-center border-b border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900 px-4 py-2.5", children: [
+    /* @__PURE__ */ t("div", { className: "flex-1 flex items-center gap-2 overflow-x-auto min-w-0 scrollbar-thin scrollbar-thumb-gray-300 dark:scrollbar-thumb-gray-600 pr-2", children: [
+      N.map((e) => {
+        const a = e.id === h;
         return /* @__PURE__ */ t(
           "div",
           {
             className: `
-                group relative flex items-center gap-2 px-3 py-1.5
-                rounded-md cursor-pointer transition-all duration-150 flex-shrink-0
-                ${o ? "bg-blue-500 text-white shadow-sm" : "bg-gray-100 dark:bg-gray-800 text-gray-700 dark:text-gray-300 hover:bg-gray-200 dark:hover:bg-gray-700"}
+                group relative flex items-center gap-2 px-4 py-2
+                rounded-lg cursor-pointer transition-all duration-150 flex-shrink-0
+                ${a ? "bg-blue-500 text-white shadow-md shadow-blue-500/25" : "bg-gray-100 dark:bg-gray-800 text-gray-700 dark:text-gray-300 hover:bg-gray-200 dark:hover:bg-gray-700"}
               `,
-            onClick: () => n(e.id),
-            title: `Módulo: ${e.name} (${e.slug})`,
+            onClick: () => u(e.id),
+            title: `${e.name} (/${e.slug})`,
             children: [
               /* @__PURE__ */ t(
                 "svg",
                 {
-                  width: "14",
-                  height: "14",
+                  width: "15",
+                  height: "15",
                   viewBox: "0 0 16 16",
                   fill: "none",
                   stroke: "currentColor",
-                  strokeWidth: "2",
+                  strokeWidth: "1.5",
                   strokeLinecap: "round",
                   strokeLinejoin: "round",
                   children: [
@@ -40,19 +64,19 @@ function g({
                   ]
                 }
               ),
-              /* @__PURE__ */ r("span", { className: "text-xs font-medium whitespace-nowrap", children: e.name }),
-              s(e.id) && /* @__PURE__ */ r(
+              /* @__PURE__ */ r("span", { className: "text-sm font-medium whitespace-nowrap", children: e.name }),
+              y(e.id) && /* @__PURE__ */ r(
                 "button",
                 {
-                  onClick: (h) => {
-                    h.stopPropagation(), l(e.id);
+                  onClick: (s) => {
+                    s.stopPropagation(), v(e.id);
                   },
                   className: `
-                    flex-shrink-0 w-4 h-4 rounded flex items-center justify-center
+                    flex-shrink-0 w-5 h-5 rounded flex items-center justify-center
                     transition-all duration-150
-                    ${o ? "opacity-70 hover:opacity-100 hover:bg-red-600" : "opacity-0 group-hover:opacity-70 hover:!opacity-100 hover:bg-red-500 hover:text-white"}
+                    ${a ? "opacity-60 hover:opacity-100 hover:bg-white/20" : "opacity-0 group-hover:opacity-60 hover:!opacity-100 hover:bg-red-500 hover:text-white"}
                   `,
-                  title: `Remover módulo ${e.name}`,
+                  title: `Remover ${e.name}`,
                   children: /* @__PURE__ */ r(
                     "svg",
                     {
@@ -73,25 +97,48 @@ function g({
           e.id
         );
       }),
+      x.length > 0 && /* @__PURE__ */ t(f, { children: [
+        /* @__PURE__ */ r("div", { className: "w-px h-6 bg-gray-200 dark:bg-gray-700 flex-shrink-0" }),
+        x.map((e) => {
+          const a = e.id === h;
+          return /* @__PURE__ */ t(
+            "div",
+            {
+              className: `
+                    flex items-center gap-2 px-4 py-2
+                    rounded-lg cursor-pointer transition-all duration-150 flex-shrink-0
+                    ${a ? "bg-purple-500 text-white shadow-md shadow-purple-500/25" : "bg-purple-50 dark:bg-purple-900/20 text-purple-700 dark:text-purple-300 hover:bg-purple-100 dark:hover:bg-purple-900/40"}
+                  `,
+              onClick: () => u(e.id),
+              title: `Plugin: ${e.name} (/${e.slug})`,
+              children: [
+                /* @__PURE__ */ r("span", { className: "text-sm flex-shrink-0", children: "🧩" }),
+                /* @__PURE__ */ r("span", { className: "text-sm font-medium whitespace-nowrap", children: e.name })
+              ]
+            },
+            e.id
+          );
+        })
+      ] })
+    ] }),
+    /* @__PURE__ */ t("div", { className: "flex-shrink-0 ml-3 relative", ref: d, children: [
       /* @__PURE__ */ t(
         "button",
         {
-          onClick: d,
+          onClick: () => o((e) => !e),
           className: `
-            flex items-center justify-center gap-1.5 px-3 py-1.5
-            text-xs font-medium text-gray-600 dark:text-gray-400
-            bg-gray-100 dark:bg-gray-800
-            hover:bg-blue-50 hover:text-blue-600 dark:hover:bg-blue-950 dark:hover:text-blue-400
-            border border-dashed border-gray-300 dark:border-gray-600
-            rounded-md transition-all duration-150 flex-shrink-0
+            flex items-center gap-2 px-4 py-2
+            text-sm font-medium rounded-lg transition-all duration-150
+            bg-blue-500 text-white hover:bg-blue-600
+            shadow-sm hover:shadow-md
           `,
-          title: "Adicionar novo módulo",
+          title: "Adicionar página ou ativar plugin",
           children: [
             /* @__PURE__ */ r(
               "svg",
               {
-                width: "14",
-                height: "14",
+                width: "16",
+                height: "16",
                 viewBox: "0 0 16 16",
                 fill: "none",
                 stroke: "currentColor",
@@ -100,14 +147,105 @@ function g({
                 children: /* @__PURE__ */ r("path", { d: "M8 3V13M3 8H13" })
               }
             ),
-            /* @__PURE__ */ r("span", { className: "whitespace-nowrap", children: "Novo Módulo" })
+            /* @__PURE__ */ r("span", { className: "whitespace-nowrap", children: "Adicionar" }),
+            /* @__PURE__ */ r(
+              "svg",
+              {
+                className: `w-3.5 h-3.5 transition-transform ${l ? "rotate-180" : ""}`,
+                fill: "none",
+                viewBox: "0 0 24 24",
+                stroke: "currentColor",
+                strokeWidth: 2,
+                children: /* @__PURE__ */ r("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M19 9l-7 7-7-7" })
+              }
+            )
           ]
         }
-      )
+      ),
+      l && /* @__PURE__ */ t("div", { className: "absolute top-full right-0 mt-2 w-72 bg-white dark:bg-gray-800 rounded-xl shadow-xl border border-gray-200 dark:border-gray-700 z-50 overflow-hidden", children: [
+        /* @__PURE__ */ t(
+          "button",
+          {
+            onClick: () => {
+              o(!1), k();
+            },
+            className: "w-full flex items-center gap-3 px-4 py-3 text-left hover:bg-gray-50 dark:hover:bg-gray-700/50 transition-colors",
+            children: [
+              /* @__PURE__ */ r("div", { className: "w-8 h-8 rounded-lg bg-blue-100 dark:bg-blue-900/30 flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ r(
+                "svg",
+                {
+                  width: "16",
+                  height: "16",
+                  viewBox: "0 0 16 16",
+                  fill: "none",
+                  stroke: "currentColor",
+                  strokeWidth: "2",
+                  strokeLinecap: "round",
+                  className: "text-blue-600 dark:text-blue-400",
+                  children: /* @__PURE__ */ r("path", { d: "M8 3V13M3 8H13" })
+                }
+              ) }),
+              /* @__PURE__ */ t("div", { children: [
+                /* @__PURE__ */ r("p", { className: "text-sm font-medium text-gray-800 dark:text-gray-200", children: "Nova Página" }),
+                /* @__PURE__ */ r("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: "Criar uma página em branco" })
+              ] })
+            ]
+          }
+        ),
+        p.length > 0 && /* @__PURE__ */ t(f, { children: [
+          /* @__PURE__ */ r("div", { className: "border-t border-gray-200 dark:border-gray-700" }),
+          /* @__PURE__ */ r("div", { className: "px-4 py-2", children: /* @__PURE__ */ r("p", { className: "text-xs font-semibold text-gray-400 dark:text-gray-500 uppercase tracking-wider", children: "Plugins" }) }),
+          p.map((e) => {
+            const { id: a, name: s, description: b } = e.manifest, i = w.includes(a);
+            return /* @__PURE__ */ t(
+              "div",
+              {
+                className: "flex items-center gap-3 px-4 py-3 hover:bg-gray-50 dark:hover:bg-gray-700/50 transition-colors",
+                children: [
+                  /* @__PURE__ */ r(
+                    "div",
+                    {
+                      className: `w-8 h-8 rounded-lg flex items-center justify-center flex-shrink-0 transition-colors ${i ? "bg-purple-100 dark:bg-purple-900/30" : "bg-gray-100 dark:bg-gray-800"}`,
+                      children: /* @__PURE__ */ r("span", { className: "text-base", children: "🧩" })
+                    }
+                  ),
+                  /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: [
+                    /* @__PURE__ */ r("p", { className: "text-sm font-medium text-gray-800 dark:text-gray-200", children: s }),
+                    b && /* @__PURE__ */ r("p", { className: "text-xs text-gray-500 dark:text-gray-400 truncate", children: b })
+                  ] }),
+                  /* @__PURE__ */ r(
+                    "button",
+                    {
+                      onClick: () => C(a, i),
+                      className: `
+                          relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors
+                          ${i ? "bg-purple-500" : "bg-gray-300 dark:bg-gray-600"}
+                        `,
+                      role: "switch",
+                      "aria-checked": i,
+                      "aria-label": `${i ? "Desativar" : "Ativar"} ${s}`,
+                      children: /* @__PURE__ */ r(
+                        "span",
+                        {
+                          className: `
+                            pointer-events-none inline-block h-5 w-5 rounded-full bg-white shadow transform transition-transform
+                            ${i ? "translate-x-5" : "translate-x-0"}
+                          `
+                        }
+                      )
+                    }
+                  )
+                ]
+              },
+              a
+            );
+          })
+        ] })
+      ] })
     ] })
   ] });
 }
 export {
-  g as PageTabBar
+  R as PageTabBar
 };
 //# sourceMappingURL=PageTabBar.js.map

package/dist/editor/PageTabBar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PageTabBar.js","sources":["../../src/editor/PageTabBar.tsx"],"sourcesContent":["/*\n PageTabBar - Barra de abas para navegação entre páginas\n * Componente inspirado em abas de browser para switching entre páginas do site\n /\n\nimport { SitePage } from \"@/engine/schema/siteDocument\";\n\nexport interface PageTabBarProps {\n pages: SitePage[];\n currentPageId: string;\n onSelectPage: (id: string) => void;\n onAddPage: () => void;\n onRemovePage: (id: string) => void;\n canRemovePage: (id: string) => boolean;\n}\n\nexport function PageTabBar({\n pages,\n currentPageId,\n onSelectPage,\n onAddPage,\n onRemovePage,\n canRemovePage,\n}: PageTabBarProps) {\n return (\n <div className=\"flex items-center gap-2 border-b border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900 px-3 py-2\">\n <div className=\"text-xs font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider\">\n Módulos:\n </div>\n\n {/ Container com scroll horizontal para módulos /}\n <div className=\"flex-1 flex items-center gap-2 overflow-x-auto scrollbar-thin scrollbar-thumb-gray-300 dark:scrollbar-thumb-gray-600\">\n {pages.map((page) => {\n const isActive = page.id === currentPageId;\n\n return (\n <div\n key={page.id}\n className={`\n group relative flex items-center gap-2 px-3 py-1.5\n rounded-md cursor-pointer transition-all duration-150 flex-shrink-0\n ${\n isActive\n ? \"bg-blue-500 text-white shadow-sm\"\n : \"bg-gray-100 dark:bg-gray-800 text-gray-700 dark:text-gray-300 hover:bg-gray-200 dark:hover:bg-gray-700\"\n }\n `}\n onClick={() => onSelectPage(page.id)}\n title={`Módulo: ${page.name} (${page.slug})`}\n >\n {/ Ícone de módulo /}\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <rect x=\"2\" y=\"2\" width=\"12\" height=\"12\" rx=\"2\" />\n <path d=\"M2 6h12M6 2v12\" />\n </svg>\n\n {/ Nome da página /}\n <span className=\"text-xs font-medium whitespace-nowrap\">\n {page.name}\n </span>\n\n {/ Botão de remover (apenas para páginas removíveis) /}\n {canRemovePage(page.id) && (\n <button\n onClick={(e) => {\n e.stopPropagation();\n onRemovePage(page.id);\n }}\n className={`\n flex-shrink-0 w-4 h-4 rounded flex items-center justify-center\n transition-all duration-150\n ${\n isActive\n ? \"opacity-70 hover:opacity-100 hover:bg-red-600\"\n : \"opacity-0 group-hover:opacity-70 hover:!opacity-100 hover:bg-red-500 hover:text-white\"\n }\n `}\n title={`Remover módulo ${page.name}`}\n >\n <svg\n width=\"10\"\n height=\"10\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n >\n <path d=\"M2 2L10 10M10 2L2 10\" />\n </svg>\n </button>\n )}\n </div>\n );\n })}\n\n {/ Botão de adicionar módulo */}\n <button\n onClick={onAddPage}\n className=\"\n flex items-center justify-center gap-1.5 px-3 py-1.5\n text-xs font-medium text-gray-600 dark:text-gray-400\n bg-gray-100 dark:bg-gray-800\n hover:bg-blue-50 hover:text-blue-600 dark:hover:bg-blue-950 dark:hover:text-blue-400\n border border-dashed border-gray-300 dark:border-gray-600\n rounded-md transition-all duration-150 flex-shrink-0\n \"\n title=\"Adicionar novo módulo\"\n >\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n >\n <path d=\"M8 3V13M3 8H13\" />\n </svg>\n <span className=\"whitespace-nowrap\">Novo Módulo</span>\n </button>\n </div>\n </div>\n );\n}\n"],"names":["PageTabBar","pages","currentPageId","onSelectPage","onAddPage","onRemovePage","canRemovePage","jsxs","jsx","page","isActive","e"],"mappings":";AAgBO,SAASA,EAAW;AAAA,EACzB,OAAAC;AAAA,EACA,eAAAC;AAAA,EACA,cAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,eAAAC;AACF,GAAoB;AAClB,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAU,6GACb,UAAA;AAAA,IAAA,gBAAAC,EAAC,OAAA,EAAI,WAAU,mFAAkF,UAAA,YAEjG;AAAA,IAGA,gBAAAD,EAAC,OAAA,EAAI,WAAU,wHACZ,UAAA;AAAA,MAAAN,EAAM,IAAI,CAACQ,MAAS;AACnB,cAAMC,IAAWD,EAAK,OAAOP;AAE7B,eACE,gBAAAK;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,WAAW;AAAA;AAAA;AAAA,kBAIPG,IACI,qCACA,wGACN;AAAA;AAAA,YAEF,SAAS,MAAMP,EAAaM,EAAK,EAAE;AAAA,YACnC,OAAO,WAAWA,EAAK,IAAI,KAAKA,EAAK,IAAI;AAAA,YAGzC,UAAA;AAAA,cAAA,gBAAAF;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,OAAM;AAAA,kBACN,QAAO;AAAA,kBACP,SAAQ;AAAA,kBACR,MAAK;AAAA,kBACL,QAAO;AAAA,kBACP,aAAY;AAAA,kBACZ,eAAc;AAAA,kBACd,gBAAe;AAAA,kBAEf,UAAA;AAAA,oBAAA,gBAAAC,EAAC,QAAA,EAAK,GAAE,KAAI,GAAE,KAAI,OAAM,MAAK,QAAO,MAAK,IAAG,IAAA,CAAI;AAAA,oBAChD,gBAAAA,EAAC,QAAA,EAAK,GAAE,iBAAA,CAAiB;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,cAI3B,gBAAAA,EAAC,QAAA,EAAK,WAAU,yCACb,YAAK,MACR;AAAA,cAGCF,EAAcG,EAAK,EAAE,KACpB,gBAAAD;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,SAAS,CAACG,MAAM;AACd,oBAAAA,EAAE,gBAAA,GACFN,EAAaI,EAAK,EAAE;AAAA,kBACtB;AAAA,kBACA,WAAW;AAAA;AAAA;AAAA,sBAIPC,IACI,kDACA,uFACN;AAAA;AAAA,kBAEF,OAAO,kBAAkBD,EAAK,IAAI;AAAA,kBAElC,UAAA,gBAAAD;AAAA,oBAAC;AAAA,oBAAA;AAAA,sBACC,OAAM;AAAA,sBACN,QAAO;AAAA,sBACP,SAAQ;AAAA,sBACR,MAAK;AAAA,sBACL,QAAO;AAAA,sBACP,aAAY;AAAA,sBACZ,eAAc;AAAA,sBAEd,UAAA,gBAAAA,EAAC,QAAA,EAAK,GAAE,uBAAA,CAAuB;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBACjC;AAAA,cAAA;AAAA,YACF;AAAA,UAAA;AAAA,UA9DGC,EAAK;AAAA,QAAA;AAAA,MAkEhB,CAAC;AAAA,MAGD,gBAAAF;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,SAASH;AAAA,UACT,WAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAQV,OAAM;AAAA,UAEN,UAAA;AAAA,YAAA,gBAAAI;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,OAAM;AAAA,gBACN,QAAO;AAAA,gBACP,SAAQ;AAAA,gBACR,MAAK;AAAA,gBACL,QAAO;AAAA,gBACP,aAAY;AAAA,gBACZ,eAAc;AAAA,gBAEd,UAAA,gBAAAA,EAAC,QAAA,EAAK,GAAE,iBAAA,CAAiB;AAAA,cAAA;AAAA,YAAA;AAAA,YAE3B,gBAAAA,EAAC,QAAA,EAAK,WAAU,qBAAoB,UAAA,cAAA,CAAW;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACjD,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;"}
1	+ {"version":3,"file":"PageTabBar.js","sources":["../../src/editor/PageTabBar.tsx"],"sourcesContent":["/*\n PageTabBar - Barra de abas para navegação entre páginas e ativação de plugins\n \n Layout expandido:\n * ┌─────────────────────────────────────────────────────────────────┐\n * │ [Home] [🧩 Blog] [🧩 Post] [+ Adicionar] │\n * └─────────────────────────────────────────────────────────────────┘\n \n O botão [+ Adicionar] abre um dropdown com:\n * - Nova Página (cria página em branco)\n * - Seção Plugins com toggles para ativar/desativar\n /\n\nimport { useState, useRef, useEffect, useMemo, useCallback } from \"react\";\nimport { SitePage } from \"@/engine/schema/siteDocument\";\nimport { pluginRegistry } from \"../engine\";\n\nexport interface PageTabBarProps {\n pages: SitePage[];\n currentPageId: string;\n onSelectPage: (id: string) => void;\n onAddPage: () => void;\n onRemovePage: (id: string) => void;\n canRemovePage: (id: string) => boolean;\n activePlugins: string[];\n onActivatePlugin: (pluginId: string) => void;\n onDeactivatePlugin: (pluginId: string) => void;\n}\n\nexport function PageTabBar({\n pages,\n currentPageId,\n onSelectPage,\n onAddPage,\n onRemovePage,\n canRemovePage,\n activePlugins,\n onActivatePlugin,\n onDeactivatePlugin,\n}: PageTabBarProps) {\n const [showMenu, setShowMenu] = useState(false);\n const menuRef = useRef<HTMLDivElement>(null);\n\n // Fechar dropdown ao clicar fora\n useEffect(() => {\n if (!showMenu) return;\n const handleClick = (e: MouseEvent) => {\n if (menuRef.current && !menuRef.current.contains(e.target as Node)) {\n setShowMenu(false);\n }\n };\n document.addEventListener(\"mousedown\", handleClick);\n return () => document.removeEventListener(\"mousedown\", handleClick);\n }, [showMenu]);\n\n const availablePlugins = useMemo(() => pluginRegistry.getAll(), []);\n\n // Separar páginas: regulares vs plugins\n const regularPages = useMemo(\n () => pages.filter((p) => !p.pluginId),\n [pages],\n );\n const pluginPages = useMemo(\n () => pages.filter((p) => !!p.pluginId),\n [pages],\n );\n\n const handleTogglePlugin = useCallback(\n (pluginId: string, isActive: boolean) => {\n if (isActive) {\n onDeactivatePlugin(pluginId);\n } else {\n onActivatePlugin(pluginId);\n }\n },\n [onActivatePlugin, onDeactivatePlugin],\n );\n\n return (\n <div className=\"flex items-center border-b border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900 px-4 py-2.5\">\n {/ ── Área scrollável: tabs de páginas ── /}\n <div className=\"flex-1 flex items-center gap-2 overflow-x-auto min-w-0 scrollbar-thin scrollbar-thumb-gray-300 dark:scrollbar-thumb-gray-600 pr-2\">\n {/ Páginas regulares /}\n {regularPages.map((page) => {\n const isActive = page.id === currentPageId;\n return (\n <div\n key={page.id}\n className={`\n group relative flex items-center gap-2 px-4 py-2\n rounded-lg cursor-pointer transition-all duration-150 flex-shrink-0\n ${\n isActive\n ? \"bg-blue-500 text-white shadow-md shadow-blue-500/25\"\n : \"bg-gray-100 dark:bg-gray-800 text-gray-700 dark:text-gray-300 hover:bg-gray-200 dark:hover:bg-gray-700\"\n }\n `}\n onClick={() => onSelectPage(page.id)}\n title={`${page.name} (/${page.slug})`}\n >\n <svg\n width=\"15\"\n height=\"15\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <rect x=\"2\" y=\"2\" width=\"12\" height=\"12\" rx=\"2\" />\n <path d=\"M2 6h12M6 2v12\" />\n </svg>\n <span className=\"text-sm font-medium whitespace-nowrap\">\n {page.name}\n </span>\n\n {/ Botão de remover (hover) /}\n {canRemovePage(page.id) && (\n <button\n onClick={(e) => {\n e.stopPropagation();\n onRemovePage(page.id);\n }}\n className={`\n flex-shrink-0 w-5 h-5 rounded flex items-center justify-center\n transition-all duration-150\n ${\n isActive\n ? \"opacity-60 hover:opacity-100 hover:bg-white/20\"\n : \"opacity-0 group-hover:opacity-60 hover:!opacity-100 hover:bg-red-500 hover:text-white\"\n }\n `}\n title={`Remover ${page.name}`}\n >\n <svg\n width=\"10\"\n height=\"10\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n >\n <path d=\"M2 2L10 10M10 2L2 10\" />\n </svg>\n </button>\n )}\n </div>\n );\n })}\n\n {/ Páginas de plugins ativos /}\n {pluginPages.length > 0 && (\n <>\n <div className=\"w-px h-6 bg-gray-200 dark:bg-gray-700 flex-shrink-0\" />\n {pluginPages.map((page) => {\n const isActive = page.id === currentPageId;\n return (\n <div\n key={page.id}\n className={`\n flex items-center gap-2 px-4 py-2\n rounded-lg cursor-pointer transition-all duration-150 flex-shrink-0\n ${\n isActive\n ? \"bg-purple-500 text-white shadow-md shadow-purple-500/25\"\n : \"bg-purple-50 dark:bg-purple-900/20 text-purple-700 dark:text-purple-300 hover:bg-purple-100 dark:hover:bg-purple-900/40\"\n }\n `}\n onClick={() => onSelectPage(page.id)}\n title={`Plugin: ${page.name} (/${page.slug})`}\n >\n <span className=\"text-sm flex-shrink-0\">🧩</span>\n <span className=\"text-sm font-medium whitespace-nowrap\">\n {page.name}\n </span>\n </div>\n );\n })}\n </>\n )}\n </div>\n\n {/ ── Botão \"+ Adicionar\" fixo no canto direito ── /}\n <div className=\"flex-shrink-0 ml-3 relative\" ref={menuRef}>\n <button\n onClick={() => setShowMenu((prev) => !prev)}\n className={`\n flex items-center gap-2 px-4 py-2\n text-sm font-medium rounded-lg transition-all duration-150\n bg-blue-500 text-white hover:bg-blue-600\n shadow-sm hover:shadow-md\n `}\n title=\"Adicionar página ou ativar plugin\"\n >\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n >\n <path d=\"M8 3V13M3 8H13\" />\n </svg>\n <span className=\"whitespace-nowrap\">Adicionar</span>\n <svg\n className={`w-3.5 h-3.5 transition-transform ${showMenu ? \"rotate-180\" : \"\"}`}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M19 9l-7 7-7-7\" />\n </svg>\n </button>\n\n {/ Dropdown /}\n {showMenu && (\n <div className=\"absolute top-full right-0 mt-2 w-72 bg-white dark:bg-gray-800 rounded-xl shadow-xl border border-gray-200 dark:border-gray-700 z-50 overflow-hidden\">\n {/ Nova Página /}\n <button\n onClick={() => {\n setShowMenu(false);\n onAddPage();\n }}\n className=\"w-full flex items-center gap-3 px-4 py-3 text-left hover:bg-gray-50 dark:hover:bg-gray-700/50 transition-colors\"\n >\n <div className=\"w-8 h-8 rounded-lg bg-blue-100 dark:bg-blue-900/30 flex items-center justify-center flex-shrink-0\">\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n className=\"text-blue-600 dark:text-blue-400\"\n >\n <path d=\"M8 3V13M3 8H13\" />\n </svg>\n </div>\n <div>\n <p className=\"text-sm font-medium text-gray-800 dark:text-gray-200\">\n Nova Página\n </p>\n <p className=\"text-xs text-gray-500 dark:text-gray-400\">\n Criar uma página em branco\n </p>\n </div>\n </button>\n\n {/ Plugins /}\n {availablePlugins.length > 0 && (\n <>\n <div className=\"border-t border-gray-200 dark:border-gray-700\" />\n <div className=\"px-4 py-2\">\n <p className=\"text-xs font-semibold text-gray-400 dark:text-gray-500 uppercase tracking-wider\">\n Plugins\n </p>\n </div>\n {availablePlugins.map((plugin) => {\n const { id, name, description } = plugin.manifest;\n const isActive = activePlugins.includes(id);\n\n return (\n <div\n key={id}\n className=\"flex items-center gap-3 px-4 py-3 hover:bg-gray-50 dark:hover:bg-gray-700/50 transition-colors\"\n >\n <div\n className={`w-8 h-8 rounded-lg flex items-center justify-center flex-shrink-0 transition-colors ${\n isActive\n ? \"bg-purple-100 dark:bg-purple-900/30\"\n : \"bg-gray-100 dark:bg-gray-800\"\n }`}\n >\n <span className=\"text-base\">🧩</span>\n </div>\n <div className=\"flex-1 min-w-0\">\n <p className=\"text-sm font-medium text-gray-800 dark:text-gray-200\">\n {name}\n </p>\n {description && (\n <p className=\"text-xs text-gray-500 dark:text-gray-400 truncate\">\n {description}\n </p>\n )}\n </div>\n {/ Toggle switch */}\n <button\n onClick={() => handleTogglePlugin(id, isActive)}\n className={`\n relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors\n ${\n isActive\n ? \"bg-purple-500\"\n : \"bg-gray-300 dark:bg-gray-600\"\n }\n `}\n role=\"switch\"\n aria-checked={isActive}\n aria-label={`${isActive ? \"Desativar\" : \"Ativar\"} ${name}`}\n >\n <span\n className={`\n pointer-events-none inline-block h-5 w-5 rounded-full bg-white shadow transform transition-transform\n ${isActive ? \"translate-x-5\" : \"translate-x-0\"}\n `}\n />\n </button>\n </div>\n );\n })}\n </>\n )}\n </div>\n )}\n </div>\n </div>\n );\n}\n"],"names":["PageTabBar","pages","currentPageId","onSelectPage","onAddPage","onRemovePage","canRemovePage","activePlugins","onActivatePlugin","onDeactivatePlugin","showMenu","setShowMenu","useState","menuRef","useRef","useEffect","handleClick","e","availablePlugins","useMemo","pluginRegistry","regularPages","p","pluginPages","handleTogglePlugin","useCallback","pluginId","isActive","jsxs","page","jsx","Fragment","prev","plugin","id","name","description"],"mappings":"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"}

package/dist/editor/PropertyEditor/BlockPropertyEditor.d.ts CHANGED Viewed

@@ -6,6 +6,8 @@ interface BlockPropertyEditorProps {
     currentPageId?: string;
     onUpdate: (updates: Record<string, any>) => void;
     uploadConfig?: UploadConfig;
+    /** When set, the matching property group opens and scrolls into view */
+    focusedGroup?: string | null;
 }
 /**
  * Componente principal do editor de propriedades

package/dist/editor/PropertyEditor/BlockPropertyEditor.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BlockPropertyEditor.d.ts","sourceRoot":"","sources":["../../../src/editor/PropertyEditor/BlockPropertyEditor.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAGH,OAAO,EAAE,KAAK,EAAE,YAAY,~~EAAoC~~,MAAM,cAAc,CAAC;~~AAIrF~~,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAEzD,UAAU,wBAAwB;IAChC,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IACjD,YAAY,CAAC,EAAE,YAAY,CAAC;~~CAC7B~~;AAED;;;GAGG;AACH,eAAO,MAAM,mBAAmB,~~gEA6H9B~~,CAAC"}
1	+ {"version":3,"file":"BlockPropertyEditor.d.ts","sourceRoot":"","sources":["../../../src/editor/PropertyEditor/BlockPropertyEditor.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAGH,OAAO,EAAE,KAAK,EAAE,YAAY,EAAsE,MAAM,cAAc,CAAC;AAKvH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAEzD,UAAU,wBAAwB;IAChC,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IACjD,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,wEAAwE;IACxE,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC9B;AAED;;;GAGG;AACH,eAAO,MAAM,mBAAmB,gEAyI9B,CAAC"}

package/dist/editor/PropertyEditor/BlockPropertyEditor.js CHANGED Viewed

@@ -1,68 +1,76 @@
-import { jsx as s, jsxs as h } from "react/jsx-runtime";
-import { memo as C, useMemo as y, useCallback as M } from "react";
-import { VariationSelector as B } from "./VariationSelector.js";
-import { BlockHeader as E } from "./BlockHeader.js";
-import { CollapsiblePropertyGroup as H } from "./CollapsiblePropertyGroup.js";
-import { componentRegistry as N } from "../../engine/registry/registry.js";
-const W = C(function({
+import { jsx as p, jsxs as g } from "react/jsx-runtime";
+import { memo as S, useMemo as l, useCallback as j } from "react";
+import { VariationSelector as M } from "./VariationSelector.js";
+import { BlockHeader as O } from "./BlockHeader.js";
+import { CollapsiblePropertyGroup as W } from "./CollapsiblePropertyGroup.js";
+import { evaluateShowWhen as B } from "../../engine/shared/showWhen.js";
+import { componentRegistry as E } from "../../engine/registry/registry.js";
+import { pluginRegistry as R } from "../../engine/plugins/pluginRegistry.js";
+const I = S(function({
   block: e,
-  onUpdate: i,
-  uploadConfig: x
+  document: i,
+  currentPageId: f,
+  onUpdate: n,
+  uploadConfig: x,
+  focusedGroup: v
 }) {
-  const r = y(() => e ? N.get(e.type) : null, [e]), d = y(() => {
-    if (!e || !r?.inspectorMeta) return {};
-    const t = e.props, o = r.defaultProps || {}, c = {};
-    for (const [p, n] of Object.entries(
-      r.inspectorMeta
+  const o = l(() => e ? E.get(e.type) : null, [e]), m = l(
+    () => ({ document: i, currentPageId: f }),
+    [i, f]
+  ), h = l(() => {
+    if (!e || !i) return /* @__PURE__ */ new Set();
+    const t = R.getEditorRestrictions(i, e.type);
+    return t?.lockedFields ? new Set(t.lockedFields) : /* @__PURE__ */ new Set();
+  }, [e, i]), y = l(() => {
+    if (!e || !o?.inspectorMeta) return {};
+    const t = e.props, r = o.defaultProps || {}, c = {};
+    for (const [a, s] of Object.entries(
+      o.inspectorMeta
     )) {
-      if (p === "logoHeight" && !t.logo)
+      if (s.showWhen && !B(s.showWhen, t, r, m))
         continue;
-      if (n.showWhen) {
-        const { field: u, equals: m, notEquals: f } = n.showWhen, g = t[u] ?? o[u];
-        if (m !== void 0 && g !== m || f !== void 0 && g === f)
-          continue;
-      }
-      const a = n.group || "Geral";
-      c[a] || (c[a] = []);
-      const l = t[p], P = n.inputType === "color" || n.inputType === "color-advanced", j = l === void 0 || P && l === "" ? o[p] : l;
-      c[a].push({
-        propName: p,
-        meta: n,
-        value: j
+      const d = s.group || "Geral";
+      c[d] || (c[d] = []);
+      const u = t[a], w = s.inputType === "color" || s.inputType === "color-advanced", C = u === void 0 || w && u === "" ? r[a] : u, F = h.has(a) ? { ...s, readOnly: !0 } : s;
+      c[d].push({
+        propName: a,
+        meta: F,
+        value: C
       });
     }
     return c;
-  }, [e, r]), v = M((t, o) => {
-    i(t === "logo" && (o === void 0 || o === "") ? { [t]: o, logoHeight: 70 } : { [t]: o });
-  }, [i]);
-  return e ? r ? /* @__PURE__ */ h("div", { className: "p-3 space-y-4", children: [
-    /* @__PURE__ */ s(
-      E,
+  }, [e, o, m, h]), P = j((t, r) => {
+    n(t === "logo" && (r === void 0 || r === "") ? { [t]: r, logoHeight: 70 } : { [t]: r });
+  }, [n]);
+  return e ? o ? /* @__PURE__ */ g("div", { className: "p-3 space-y-4", children: [
+    /* @__PURE__ */ p(
+      O,
       {
         type: e.type,
-        name: r.name,
-        description: r.description
+        name: o.name,
+        description: o.description
       }
     ),
-    r.variations && /* @__PURE__ */ s(B, { block: e, onUpdate: i }),
-    Object.keys(d).length === 0 ? /* @__PURE__ */ s("div", { className: "text-center text-gray-500 dark:text-gray-400 text-xs py-4", children: "Nenhuma propriedade configurável" }) : Object.entries(d).map(([t, o]) => /* @__PURE__ */ s(
-      H,
+    o.variations && /* @__PURE__ */ p(M, { block: e, onUpdate: n }),
+    Object.keys(y).length === 0 ? /* @__PURE__ */ p("div", { className: "text-center text-gray-500 dark:text-gray-400 text-xs py-4", children: "Nenhuma propriedade configurável" }) : Object.entries(y).map(([t, r]) => /* @__PURE__ */ p(
+      W,
       {
         groupName: t,
-        props: o,
-        onPropChange: v,
-        onMultiUpdate: i,
+        props: r,
+        onPropChange: P,
+        onMultiUpdate: n,
         allProps: e?.props,
-        uploadConfig: x
+        uploadConfig: x,
+        isFocused: t === v
       },
       t
     ))
-  ] }) : /* @__PURE__ */ h("div", { className: "p-4 text-center text-red-500 text-sm", children: [
+  ] }) : /* @__PURE__ */ g("div", { className: "p-4 text-center text-red-500 text-sm", children: [
     "Tipo de bloco desconhecido: ",
     e.type
-  ] }) : /* @__PURE__ */ s("div", { className: "p-4 text-center text-gray-500 dark:text-gray-400 text-sm", children: "Selecione um bloco para editar" });
+  ] }) : /* @__PURE__ */ p("div", { className: "p-4 text-center text-gray-500 dark:text-gray-400 text-sm", children: "Selecione um bloco para editar" });
 });
 export {
-  W as BlockPropertyEditor
+  I as BlockPropertyEditor
 };
 //# sourceMappingURL=BlockPropertyEditor.js.map

package/dist/editor/PropertyEditor/BlockPropertyEditor.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BlockPropertyEditor.js","sources":["../../../src/editor/PropertyEditor/BlockPropertyEditor.tsx"],"sourcesContent":["/*\n Block Property Editor - Refatorado\n * Editor dinâmico de propriedades baseado em inspectorMeta\n /\n\nimport { memo, useMemo, useCallback } from \"react\";\nimport { Block, SiteDocument, componentRegistry, InspectorMeta } from \"../../engine\";\nimport { VariationSelector } from \"./VariationSelector\";\nimport { BlockHeader } from \"./BlockHeader\";\nimport { CollapsiblePropertyGroup } from \"./CollapsiblePropertyGroup\";\nimport type { UploadConfig } from \"../LandingPageEditor\";\n\ninterface BlockPropertyEditorProps {\n block: Block \| null;\n document?: SiteDocument;\n currentPageId?: string;\n onUpdate: (updates: Record<string, any>) => void;\n uploadConfig?: UploadConfig;\n}\n\n/\n Componente principal do editor de propriedades\n * Memoizado para performance\n /\nexport const BlockPropertyEditor = memo(function BlockPropertyEditor({\n block,\n onUpdate,\n uploadConfig,\n}: BlockPropertyEditorProps) {\n // Obter definição do bloco do registry\n const blockDefinition = useMemo(() => {\n if (!block) return null;\n return componentRegistry.get(block.type);\n }, [block]);\n\n // Agrupar propriedades por grupo\n const groupedProps = useMemo(() => {\n if (!block \|\| !blockDefinition?.inspectorMeta) return {};\n\n const props = block.props as Record<string, any>;\n const defaultProps = (blockDefinition.defaultProps \|\| {}) as Record<string, any>;\n const groups: Record<\n string,\n Array<{ propName: string; meta: InspectorMeta; value: any }>\n > = {};\n\n for (const [propName, meta] of Object.entries(\n blockDefinition.inspectorMeta,\n )) {\n // ~~Lógica~~ condicional: só ~~mostrar logoHeight se houver logo~~\n if (~~propName === \"logoHeight\" && !props~~.~~logo~~) {\n ~~continue; // Pular este campo\n }\n\n // Lógica condicional genérica: showWhen\n~~ if (meta.showWhen~~) {\n const { field~~, ~~equals~~, ~~notEquals } = meta.showWhen;\n const fieldValue = props[field] ??~~ defaultProps~~[field];\n //~~ ~~Suporta equals (mostrar quando igual~~) ~~e notEquals (mostrar quando diferente~~)~~\n if~~ ~~(equals !== undefined && fieldValue !== equals)~~ {\n continue~~; // Pular se não for igual ao valor esperado\~~n }\n ~~if (notEquals !== undefined && fieldValue === notEquals) {\n continue; // Pular se for igual ao valor que deve ser evitado\n }\n~~ }\n\n const group = meta.group \|\| \"Geral\";\n if (!groups[group]) {\n groups[group] = [];\n }\n\n // Usar valor atual ou fallback para defaultProps\n const currentValue = props[propName];\n // Para campos de cor, também fazer fallback se o valor for string vazia\n const isColorInput = meta.inputType === \"color\" \|\| meta.inputType === \"color-advanced\";\n const shouldUseFallback = currentValue === undefined \|\| (isColorInput && currentValue === \"\");\n const value = shouldUseFallback ? defaultProps[propName] : currentValue;\n\n groups[group].push({\n propName,\n meta,\n value,\n });\n }\n\n return groups;\n }, [block, blockDefinition]);\n\n // IMPORTANTE: todos os hooks devem ser chamados ANTES de qualquer early return\n const handlePropChange = useCallback((propName: string, value: any) => {\n // Se remover o logo (definir como undefined), resetar logoHeight para padrão\n if (propName === \"logo\" && (value === undefined \|\| value === \"\")) {\n onUpdate({ [propName]: value, logoHeight: 70 });\n } else {\n onUpdate({ [propName]: value });\n }\n }, [onUpdate]);\n\n if (!block) {\n return (\n <div className=\"p-4 text-center text-gray-500 dark:text-gray-400 text-sm\">\n Selecione um bloco para editar\n </div>\n );\n }\n\n if (!blockDefinition) {\n return (\n <div className=\"p-4 text-center text-red-500 text-sm\">\n Tipo de bloco desconhecido: {block.type}\n </div>\n );\n }\n\n return (\n <div className=\"p-3 space-y-4\">\n {/ Header com ícone centralizado /}\n <BlockHeader\n type={block.type}\n name={blockDefinition.name}\n description={blockDefinition.description}\n />\n\n {/ Seletor de variações (Hero/Navbar) /}\n {blockDefinition.variations && (\n <VariationSelector block={block} onUpdate={onUpdate} />\n )}\n\n {/ Propriedades agrupadas com collapse */}\n {Object.keys(groupedProps).length === 0 ? (\n <div className=\"text-center text-gray-500 dark:text-gray-400 text-xs py-4\">\n Nenhuma propriedade configurável\n </div>\n ) : (\n Object.entries(groupedProps).map(([groupName, props]) => (\n <CollapsiblePropertyGroup\n key={groupName}\n groupName={groupName}\n props={props}\n onPropChange={handlePropChange}\n onMultiUpdate={onUpdate}\n allProps={block?.props as Record<string, any>}\n uploadConfig={uploadConfig}\n />\n ))\n )}\n </div>\n );\n});\n"],"names":["BlockPropertyEditor","memo","block","onUpdate","uploadConfig","blockDefinition","useMemo","componentRegistry","~~groupedProps~~","~~props~~","~~defaultProps~~","~~groups~~","~~propName~~","~~meta~~","~~field~~","~~equals~~","~~notEquals~~","~~fieldValue~~","group","currentValue","isColorInput","value","handlePropChange","useCallback","jsxs","jsx","BlockHeader","VariationSelector","groupName","CollapsiblePropertyGroup"],"mappings":"~~;;;;;;AAwBO~~,MAAMA,IAAsBC,EAAK,SAA6B;AAAA,EACnE,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AACF,GAA6B;AAE3B,QAAMC,IAAkBC,EAAQ,~~MACzBJ~~,~~IACEK~~,EAAkB,~~IAAIL~~,EAAM,IAAI,IADpB,MAElB,CAACA,CAAK,CAAC,~~GAGJM~~,~~IAAeF~~,EAAQ,MAAM;AACjC,QAAI,~~CAACJ~~,KAAS,~~CAACG~~,GAAiB,sBAAsB,CAAA;AAEtD,~~UAAMI~~,~~IAAQP~~,EAAM,~~OACdQ~~,~~IAAgBL~~,EAAgB,gBAAgB,CAAA,~~GAChDM~~,IAGF,CAAA;AAEJ,eAAW,CAACC,GAAUC,CAAI,KAAK,OAAO;AAAA,~~MACpCR~~,EAAgB;AAAA,IAAA,GACf;AAED,~~UAAIO~~,~~MAAa,gBAAgB,CAACH,EAAM;AACtC;AAIF,UAAII,~~EAAK,~~UAAU;AACjB~~,~~cAAM~~,~~EAAE~~,~~OAAAC,GAAO,QAAAC,GAAQ,WAAAC,EAAA,IAAcH,~~EAAK,~~UACpCI~~,~~IAAaR~~,~~EAAMK~~,~~CAAK,KAAKJ,EAAaI,CAAK~~;~~AAKrD,YAHIC,MAAW,UAAaE,MAAeF,KAGvCC,MAAc,UAAaC,MAAeD~~;~~AAC5C;AAAA~~,~~MAEJ;AAEA~~,~~YAAME~~,~~IAAQL,~~EAAK,SAAS;AAC5B,MAAKF,~~EAAOO~~,CAAK,~~MACfP~~,~~EAAOO~~,CAAK,IAAI,CAAA;AAIlB,YAAMC,~~IAAeV~~,EAAMG,CAAQ,~~GAE7BQ~~,~~IAAeP~~,EAAK,cAAc,WAAWA,EAAK,cAAc,~~kBAEhEQ~~,IADoBF,MAAiB,UAAcC,KAAgBD,MAAiB,~~KACxDT~~,EAAaE,CAAQ,IAAIO;~~AAE3D~~,~~MAAAR~~,~~EAAOO~~,CAAK,EAAE,KAAK;AAAA,QACjB,~~UAAAN~~;AAAA,QACA,~~MAAAC~~;AAAA,~~QACA~~,~~OAAAQ~~;AAAA,MAAA,CACD;AAAA,IACH;AAEA,~~WAAOV~~;AAAA,EACT,GAAG,~~CAACT~~,~~GAAOG~~,~~CAAe~~,CAAC,~~GAGrBiB~~,IAAmBC,EAAY,~~CAACX~~,~~GAAkBS~~,MAAe;AAErE,~~IACElB~~,~~EADES~~,MAAa,~~WAAWS~~,MAAU,UAAaA,MAAU,MAClD,EAAE,~~CAACT~~,CAAQ,~~GAAGS~~,GAAO,YAAY,OAEjC,EAAE,~~CAACT~~,CAAQ,~~GAAGS~~,GAFuB;AAAA,EAIlD,GAAG,~~CAAClB~~,CAAQ,CAAC;AAEb,~~SAAKD~~,~~IAQAG~~,IASH,~~gBAAAmB~~,EAAC,OAAA,EAAI,WAAU,iBAEb,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,~~MAAMxB~~,EAAM;AAAA,QACZ,~~MAAMG~~,EAAgB;AAAA,QACtB,aAAaA,EAAgB;AAAA,MAAA;AAAA,IAAA;AAAA,IAI9BA,EAAgB,cACf,~~gBAAAoB~~,EAACE,GAAA,EAAkB,~~OAAAzB~~,GAAc,~~UAAAC~~,GAAoB;AAAA,IAItD,OAAO,~~KAAKK~~,CAAY,EAAE,WAAW,IACpC,~~gBAAAiB~~,EAAC,SAAI,WAAU,6DAA4D,8CAE3E,IAEA,OAAO,~~QAAQjB~~,CAAY,EAAE,IAAI,CAAC,~~CAACoB~~,~~GAAWnB~~,CAAK,MACjD,~~gBAAAgB~~;AAAA,MAACI;AAAA,MAAA;AAAA,QAEC,WAAAD;AAAA,QACA,~~OAAAnB~~;AAAA,QACA,~~cAAca~~;AAAA,QACd,~~eAAenB~~;AAAA,QACf,~~UAAUD~~,GAAO;AAAA,QACjB,~~cAAAE~~;AAAA,MAAA;AAAA,~~MANKwB~~;AAAA,IAAA,~~CAQR~~;AAAA,EAAA,GAEL,~~IAtCE~~,gBAAAJ,EAAC,OAAA,EAAI,WAAU,wCAAuC,UAAA;AAAA,IAAA;AAAA,~~IACvBtB~~,EAAM;AAAA,EAAA,GACrC,IAVA,~~gBAAAuB~~,EAAC,OAAA,EAAI,WAAU,4DAA2D,UAAA,kCAE1E;~~AA8CN~~,CAAC;"}
1	+ {"version":3,"file":"BlockPropertyEditor.js","sources":["../../../src/editor/PropertyEditor/BlockPropertyEditor.tsx"],"sourcesContent":["/*\n Block Property Editor - Refatorado\n * Editor dinâmico de propriedades baseado em inspectorMeta\n /\n\nimport { memo, useMemo, useCallback } from \"react\";\nimport { Block, SiteDocument, componentRegistry, InspectorMeta, evaluateShowWhen, pluginRegistry } from \"../../engine\";\nimport type { ShowWhenContext } from \"../../engine\";\nimport { VariationSelector } from \"./VariationSelector\";\nimport { BlockHeader } from \"./BlockHeader\";\nimport { CollapsiblePropertyGroup } from \"./CollapsiblePropertyGroup\";\nimport type { UploadConfig } from \"../LandingPageEditor\";\n\ninterface BlockPropertyEditorProps {\n block: Block \| null;\n document?: SiteDocument;\n currentPageId?: string;\n onUpdate: (updates: Record<string, any>) => void;\n uploadConfig?: UploadConfig;\n /* When set, the matching property group opens and scrolls into view /\n focusedGroup?: string \| null;\n}\n\n/\n Componente principal do editor de propriedades\n * Memoizado para performance\n /\nexport const BlockPropertyEditor = memo(function BlockPropertyEditor({\n block,\n document,\n currentPageId,\n onUpdate,\n uploadConfig,\n focusedGroup,\n}: BlockPropertyEditorProps) {\n // Obter definição do bloco do registry\n const blockDefinition = useMemo(() => {\n if (!block) return null;\n return componentRegistry.get(block.type);\n }, [block]);\n\n // Contexto para cross-block showWhen\n const showWhenContext = useMemo<ShowWhenContext>(\n () => ({ document, currentPageId }),\n [document, currentPageId],\n );\n\n // Obter restrições de edição do plugin (se houver)\n const lockedFields = useMemo(() => {\n if (!block \|\| !document) return new Set<string>();\n const restriction = pluginRegistry.getEditorRestrictions(document, block.type);\n if (!restriction?.lockedFields) return new Set<string>();\n return new Set(restriction.lockedFields);\n }, [block, document]);\n\n // Agrupar propriedades por grupo\n const groupedProps = useMemo(() => {\n if (!block \|\| !blockDefinition?.inspectorMeta) return {};\n\n const props = block.props as Record<string, any>;\n const defaultProps = (blockDefinition.defaultProps \|\| {}) as Record<string, any>;\n const groups: Record<\n string,\n Array<{ propName: string; meta: InspectorMeta; value: any }>\n > = {};\n\n for (const [propName, meta] of Object.entries(\n blockDefinition.inspectorMeta,\n )) {\n // Visibilidade condicional via showWhen\n if (meta.showWhen) {\n if (!evaluateShowWhen(meta.showWhen, props, defaultProps, showWhenContext)) {\n continue;\n }\n }\n\n const group = meta.group \|\| \"Geral\";\n if (!groups[group]) {\n groups[group] = [];\n }\n\n // Usar valor atual ou fallback para defaultProps\n const currentValue = props[propName];\n // Para campos de cor, também fazer fallback se o valor for string vazia\n const isColorInput = meta.inputType === \"color\" \|\| meta.inputType === \"color-advanced\";\n const shouldUseFallback = currentValue === undefined \|\| (isColorInput && currentValue === \"\");\n const value = shouldUseFallback ? defaultProps[propName] : currentValue;\n\n // Aplicar readOnly de plugin restrictions\n const effectiveMeta = lockedFields.has(propName)\n ? { ...meta, readOnly: true }\n : meta;\n\n groups[group].push({\n propName,\n meta: effectiveMeta,\n value,\n });\n }\n\n return groups;\n }, [block, blockDefinition, showWhenContext, lockedFields]);\n\n // IMPORTANTE: todos os hooks devem ser chamados ANTES de qualquer early return\n const handlePropChange = useCallback((propName: string, value: any) => {\n // Se remover o logo (definir como undefined), resetar logoHeight para padrão\n if (propName === \"logo\" && (value === undefined \|\| value === \"\")) {\n onUpdate({ [propName]: value, logoHeight: 70 });\n } else {\n onUpdate({ [propName]: value });\n }\n }, [onUpdate]);\n\n if (!block) {\n return (\n <div className=\"p-4 text-center text-gray-500 dark:text-gray-400 text-sm\">\n Selecione um bloco para editar\n </div>\n );\n }\n\n if (!blockDefinition) {\n return (\n <div className=\"p-4 text-center text-red-500 text-sm\">\n Tipo de bloco desconhecido: {block.type}\n </div>\n );\n }\n\n return (\n <div className=\"p-3 space-y-4\">\n {/ Header com ícone centralizado /}\n <BlockHeader\n type={block.type}\n name={blockDefinition.name}\n description={blockDefinition.description}\n />\n\n {/ Seletor de variações (Hero/Navbar) /}\n {blockDefinition.variations && (\n <VariationSelector block={block} onUpdate={onUpdate} />\n )}\n\n {/ Propriedades agrupadas com collapse */}\n {Object.keys(groupedProps).length === 0 ? (\n <div className=\"text-center text-gray-500 dark:text-gray-400 text-xs py-4\">\n Nenhuma propriedade configurável\n </div>\n ) : (\n Object.entries(groupedProps).map(([groupName, props]) => (\n <CollapsiblePropertyGroup\n key={groupName}\n groupName={groupName}\n props={props}\n onPropChange={handlePropChange}\n onMultiUpdate={onUpdate}\n allProps={block?.props as Record<string, any>}\n uploadConfig={uploadConfig}\n isFocused={groupName === focusedGroup}\n />\n ))\n )}\n </div>\n );\n});\n"],"names":["BlockPropertyEditor","memo","block","document","currentPageId","onUpdate","uploadConfig","focusedGroup","blockDefinition","useMemo","componentRegistry","showWhenContext","lockedFields","restriction","pluginRegistry","groupedProps","props","defaultProps","groups","propName","meta","evaluateShowWhen","group","currentValue","isColorInput","value","effectiveMeta","handlePropChange","useCallback","jsxs","jsx","BlockHeader","VariationSelector","groupName","CollapsiblePropertyGroup"],"mappings":"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"}

package/dist/editor/PropertyEditor/CollapsiblePropertyGroup.d.ts CHANGED Viewed

@@ -14,6 +14,8 @@ interface CollapsiblePropertyGroupProps {
     allProps?: Record<string, any>;
     uploadConfig?: UploadConfig;
     defaultOpen?: boolean;
+    /** When true, opens the group and scrolls it into view */
+    isFocused?: boolean;
 }
 /**
  * Grupo de propriedades colapsável

package/dist/editor/PropertyEditor/CollapsiblePropertyGroup.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CollapsiblePropertyGroup.d.ts","sourceRoot":"","sources":["../../../src/editor/PropertyEditor/CollapsiblePropertyGroup.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAG7C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAEzD,UAAU,6BAA6B;IACrC,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,KAAK,CAAC;QACX,QAAQ,EAAE,MAAM,CAAC;QACjB,IAAI,EAAE,aAAa,CAAC;QACpB,KAAK,EAAE,GAAG,CAAC;KACZ,CAAC,CAAC;IACH,YAAY,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IACrD,qFAAqF;IACrF,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IACvD,oFAAoF;IACpF,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC/B,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAC;~~CACvB~~;AAED;;;GAGG;AACH,eAAO,MAAM,wBAAwB,~~qEAmEnC~~,CAAC"}
1	+ {"version":3,"file":"CollapsiblePropertyGroup.d.ts","sourceRoot":"","sources":["../../../src/editor/PropertyEditor/CollapsiblePropertyGroup.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAG7C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAEzD,UAAU,6BAA6B;IACrC,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,KAAK,CAAC;QACX,QAAQ,EAAE,MAAM,CAAC;QACjB,IAAI,EAAE,aAAa,CAAC;QACpB,KAAK,EAAE,GAAG,CAAC;KACZ,CAAC,CAAC;IACH,YAAY,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IACrD,qFAAqF;IACrF,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IACvD,oFAAoF;IACpF,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC/B,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,0DAA0D;IAC1D,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;GAGG;AACH,eAAO,MAAM,wBAAwB,qEA6FnC,CAAC"}