@seedgrid/fe-components 2026.3.2-9 → 2026.3.3-1

package/dist/others/SgPlayground.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SgPlayground.d.ts","sourceRoot":"","sources":["../../src/others/SgPlayground.tsx"],"names":[],"mappings":"AAiBA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,YAAY,GAAG,SAAS,CAAC;IACxC,MAAM,CAAC,EAAE,kBAAkB,CAAC;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACjC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,UAAU,GAAG,YAAY,GAAG,MAAM,CAAC;IAChD,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACtC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,aAAa,CAAC,EAAE,uBAAuB,EAAE,CAAC;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAC;AACnF,MAAM,MAAM,uBAAuB,GAAG;IACpC,aAAa,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,EAAE,OAAO,CAAC;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B,CAAC;AA0vBF,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,KAAK,EAAE,QAAQ,CAAC,iBAAiB,CAAC,2CA8YtE"}
+{"version":3,"file":"SgPlayground.d.ts","sourceRoot":"","sources":["../../src/others/SgPlayground.tsx"],"names":[],"mappings":"AAiBA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,YAAY,GAAG,SAAS,CAAC;IACxC,MAAM,CAAC,EAAE,kBAAkB,CAAC;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACjC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,UAAU,GAAG,YAAY,GAAG,MAAM,CAAC;IAChD,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACtC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,aAAa,CAAC,EAAE,uBAAuB,EAAE,CAAC;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAC;AACnF,MAAM,MAAM,uBAAuB,GAAG;IACpC,aAAa,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,EAAE,OAAO,CAAC;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B,CAAC;AAixBF,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,KAAK,EAAE,QAAQ,CAAC,iBAAiB,CAAC,2CAgbtE"}

package/dist/others/SgPlayground.js

@@ -15,9 +15,31 @@ const DEFAULT_SANDBOX_BASE_DEPENDENCIES = {
     "react-dom": "18.2.0"
 };
 const DEFAULT_SEEDGRID_RUNTIME_DEPENDENCIES = {
-    "react-hook-form": "^7.0.0",
-    "lucide-react": "^0.468.0"
+    "react-hook-form": "^7.0.0"
 };
+// lucide-react is a heavy peer dep (~1400 icons). For non-full presets we shim it with
+// a generic SVG placeholder to avoid OOM in the browser bundler.
+const SANDPACK_LUCIDE_REACT_SHIM_INDEX_JS = `const React = require("react");
+const Icon = function(props) {
+  return React.createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: props.size || props.width || 16,
+    height: props.size || props.height || 16,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: props.color || "currentColor",
+    strokeWidth: props.strokeWidth || 2,
+    className: props.className
+  });
+};
+const proxy = new Proxy({}, {
+  get: function(_, key) {
+    if (key === "__esModule") return true;
+    return Icon;
+  }
+});
+module.exports = proxy;
+`;
 const DEFAULT_SEEDGRID_EDITOR_DEPENDENCIES = {
     "@tiptap/core": "^2.9.1",
     "@tiptap/react": "^2.9.1",
@@ -785,11 +807,28 @@ export default function SgPlayground(props) {
     const shouldShimSandpackReact = includeSeedgridDependency && !includeSandpackReactDependency;
     const shouldShimTiptap = includeSeedgridDependency && !includeEditorDependencies;
     const shouldIncludeNodePolyfills = includeEditorDependencies;
+    // Shim lucide-react for all non-full presets to avoid OOM from bundling ~1400 icon components.
+    // Full preset gets the real package so icons render correctly.
+    const shouldShimLucide = includeSeedgridDependency && resolvedPreset !== "full" && !requestedDepKeys.includes("lucide-react");
     const files = {
         "/App.tsx": { code: appTsx, active: true },
         "/styles.css": { code: sandpackStylesCss || buildSandpackStylesCss({}, effectivePreviewPadding) }
     };
     if (includeSeedgridDependency) {
+        // Override @seedgrid/fe-components package.json to point at the pre-compiled sandbox bundle
+        // (dist/sandbox.cjs) instead of the tsc barrel file (dist/index.js).
+        // This makes the Sandpack bundler fetch and process ONE file instead of 200+ individual files,
+        // which dramatically reduces memory usage and eliminates "loading everything" on every run.
+        // Requires @seedgrid/fe-components to be built with: pnpm run build:sandbox
+        files["/node_modules/@seedgrid/fe-components/package.json"] = {
+            code: JSON.stringify({
+                name: "@seedgrid/fe-components",
+                version: "0.0.0-sandbox",
+                main: "dist/sandbox.cjs",
+                exports: { ".": { require: "./dist/sandbox.cjs", default: "./dist/sandbox.cjs" } }
+            }),
+            hidden: true
+        };
         // Compatibility shim for legacy @seedgrid/fe-components builds that still import "qrcode" (node-only path).
         files["/node_modules/qrcode/index.js"] = { code: SANDPACK_QRCODE_SHIM_INDEX_JS, hidden: true };
         // Sandpack runtime can evaluate JSON files as plain JS modules.
@@ -839,12 +878,12 @@ export default function SgPlayground(props) {
             code: SANDPACK_SEEDGRID_TEXT_EDITOR_SHIM_INDEX_JS,
             hidden: true
         };
-        files["/node_modules/@seedgrid/fe-components/dist/inputs/SgTextEditor"] = {
+        files["/node_modules/@seedgrid/fe-components/dist/inputs/SgTextEditor.mjs"] = {
             code: SANDPACK_SEEDGRID_TEXT_EDITOR_SHIM_INDEX_JS,
             hidden: true
         };
-        files["/node_modules/@seedgrid/fe-components/dist/inputs/SgTextEditor.mjs"] = {
-            code: SANDPACK_SEEDGRID_TEXT_EDITOR_SHIM_INDEX_JS,
+        files["/node_modules/@tiptap/react/package.json"] = {
+            code: JSON.stringify({ name: "@tiptap/react", version: "0.0.0-shim", main: "index.js", module: "index.mjs" }),
             hidden: true
         };
         files["/node_modules/@tiptap/react/index.js"] = {
@@ -856,6 +895,10 @@ export default function SgPlayground(props) {
             hidden: true
         };
         for (const packageName of TIPTAP_SHIM_PACKAGES) {
+            files[`/node_modules/${packageName}/package.json`] = {
+                code: JSON.stringify({ name: packageName, version: "0.0.0-shim", main: "index.js", module: "index.mjs" }),
+                hidden: true
+            };
             files[`/node_modules/${packageName}/index.js`] = {
                 code: SANDPACK_TIPTAP_EXTENSION_SHIM_INDEX_JS,
                 hidden: true
@@ -866,9 +909,20 @@ export default function SgPlayground(props) {
             };
         }
     }
+    if (shouldShimLucide) {
+        files["/node_modules/lucide-react/package.json"] = {
+            code: JSON.stringify({ name: "lucide-react", version: "0.0.0-shim", main: "index.js" }),
+            hidden: true
+        };
+        files["/node_modules/lucide-react/index.js"] = {
+            code: SANDPACK_LUCIDE_REACT_SHIM_INDEX_JS,
+            hidden: true
+        };
+    }
     const deps = {
         ...DEFAULT_SANDBOX_BASE_DEPENDENCIES,
         ...(includeSeedgridDependency ? DEFAULT_SEEDGRID_RUNTIME_DEPENDENCIES : {}),
+        ...(includeSeedgridDependency && !shouldShimLucide ? { "lucide-react": "^0.468.0" } : {}),
         ...(includeEditorDependencies ? DEFAULT_SEEDGRID_EDITOR_DEPENDENCIES : {}),
         ...(includeSandpackReactDependency ? DEFAULT_SANDBOX_HOST_DEPENDENCIES : {}),
         ...(shouldIncludeNodePolyfills ? DEFAULT_SANDPACK_POLYFILLS : {}),
@@ -897,8 +951,8 @@ export default function SgPlayground(props) {
         bundlerTimeout: resolvedBundlerTimeoutMs,
         activeFile: "/App.tsx",
         visibleFiles: ["/App.tsx"],
-        externalResources: SANDPACK_EXTERNAL_RESOURCES
-    }), [resolvedBundlerTimeoutMs, resolvedBundlerURL]);
+        externalResources: includeSeedgridDependency ? SANDPACK_EXTERNAL_RESOURCES : []
+    }), [includeSeedgridDependency, resolvedBundlerTimeoutMs, resolvedBundlerURL]);
     const content = interactive ? (_jsx("div", { className: cn(withCard ? "" : "rounded-lg border border-border", withCard ? undefined : className), children: _jsxs(SandpackProvider, { template: "react-ts", files: files, customSetup: sandpackCustomSetup, options: sandpackOptions, children: [_jsx("style", { children: SANDPACK_HOST_STYLES_CSS }), _jsxs("div", { className: "flex items-center justify-between border-b border-border px-3 py-2", children: [_jsxs("div", { className: "flex items-center gap-2", children: [withCard ? null : _jsx("span", { className: "text-sm font-medium", children: title ?? "Example" }), _jsx("span", { className: "text-xs text-muted-foreground", children: codeContract === "renderBody" ? "editable snippet" : "editable App.tsx" })] }), _jsxs("div", { className: "flex items-center gap-2", children: [expandable ? (_jsx(SgButton, { appearance: "outline", size: "sm", onClick: () => setIsExpanded((prev) => !prev), children: isExpanded ? "Reduzir" : "Expandir" })) : null, _jsx(RunButton, { onRun: () => setActivePanel("preview") })] })] }), _jsxs("div", { className: "flex md:hidden border-b border-border", children: [_jsx("button", { type: "button", className: cn("flex-1 py-2 text-sm font-medium border-b-2 -mb-px transition-colors", activePanel === "code"
                                 ? "border-primary text-foreground"
                                 : "border-transparent text-muted-foreground hover:text-foreground"), onClick: () => setActivePanel("code"), children: "C\u00F3digo" }), _jsx("button", { type: "button", className: cn("flex-1 py-2 text-sm font-medium border-b-2 -mb-px transition-colors", activePanel === "preview"