@burdenoff/fluidgrids-fe-sdk 2026.825.2 → 2026.827.1

package/dist/{WorkflowBuilder-URMQZLQU.js → WorkflowBuilder-XFXFAMUE.js}

@@ -1,4 +1,4 @@
-export { WorkflowBuilder } from './chunk-DVPXNC2S.js';
+export { WorkflowBuilder } from './chunk-A54HLFJE.js';
 import './chunk-P5PKRQAO.js';
 import './chunk-OHGXRM6Z.js';
 import './chunk-BQXHJIER.js';
@@ -13,5 +13,5 @@ import './chunk-XQP33UJR.js';
 import './chunk-DBOMRIP5.js';
 import './chunk-3ZYUGTIT.js';
 import './chunk-7VNIEIR6.js';
-//# sourceMappingURL=WorkflowBuilder-URMQZLQU.js.map
-//# sourceMappingURL=WorkflowBuilder-URMQZLQU.js.map
+//# sourceMappingURL=WorkflowBuilder-XFXFAMUE.js.map
+//# sourceMappingURL=WorkflowBuilder-XFXFAMUE.js.map

package/dist/{WorkflowBuilder-URMQZLQU.js.map → WorkflowBuilder-XFXFAMUE.js.map}

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"WorkflowBuilder-URMQZLQU.js"}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"WorkflowBuilder-XFXFAMUE.js"}

package/dist/{chunk-DVPXNC2S.js → chunk-A54HLFJE.js}

@@ -11317,8 +11317,8 @@ function DesktopSidebarFragment({
     },
     [configTemplate, configContent, configNodeCheck, performImport]
   );
-  return /* @__PURE__ */ jsxs("div", { className: "relative max-w-sm w-fit flex shrink-0 divide-x divide-card-foreground/10 rounded-xl overflow-hidden border border-card-foreground/10", children: [
-    activePanel !== "none" && /* @__PURE__ */ jsx("div", { className: "min-w-xs grow bg-card", children: /* @__PURE__ */ jsx(SwitchSidebarPanel, { active: activePanel }) }),
+  return /* @__PURE__ */ jsxs("div", { className: "relative w-fit flex shrink-0 divide-x divide-card-foreground/10 rounded-xl border border-card-foreground/10 md:overflow-hidden md:max-w-sm", children: [
+    activePanel !== "none" && /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 right-full z-20 w-[78vw] overflow-hidden rounded-l-xl border-y border-l border-card-foreground/10 bg-card md:static md:z-auto md:w-auto md:grow md:min-w-xs md:rounded-none md:border-0", children: /* @__PURE__ */ jsx(SwitchSidebarPanel, { active: activePanel }) }),
     /* @__PURE__ */ jsx("div", { className: "shrink-0 bg-card p-1.5", children: /* @__PURE__ */ jsxs("div", { className: "h-full flex flex-col gap-2", children: [
       /* @__PURE__ */ jsx(
         SidebarButtonItem,
@@ -21310,6 +21310,17 @@ function NodeParamsForm({
     })
   ] });
 }
+function useMediaQuery(query) {
+  const [matches, setMatches] = React.useState(false);
+  React.useEffect(() => {
+    const mql = window.matchMedia(query);
+    const onChange = (e) => setMatches(e.matches);
+    setMatches(mql.matches);
+    mql.addEventListener("change", onChange);
+    return () => mql.removeEventListener("change", onChange);
+  }, [query]);
+  return matches;
+}
 var SECTION_LABEL3 = "text-[11px] font-semibold uppercase tracking-[0.12em] text-muted-foreground";
 function NodeDetailView() {
   const tr = useTr();
@@ -21332,6 +21343,8 @@ function NodeDetailView() {
   } = config2;
   const [tab, setTab] = useState("parameters");
   const [outputView, setOutputView] = useState("schema");
+  const threePaneLayout = useMediaQuery("(min-width: 1024px)");
+  const [pane, setPane] = useState("parameters");
   const panesRef = useRef(null);
   const dragCleanupRef = useRef(null);
   const [leftPct, setLeftPct] = useState(30);
@@ -21357,7 +21370,10 @@ function NodeDetailView() {
   };
   useEffect(() => () => dragCleanupRef.current?.(), []);
   useEffect(() => {
-    if (open) setTab("parameters");
+    if (open) {
+      setTab("parameters");
+      setPane("parameters");
+    }
   }, [open, ndv?.nodeId]);
   const openClassicPanel = () => {
     if (!ndv) return;
@@ -21414,12 +21430,51 @@ function NodeDetailView() {
             }
           )
         ] }),
+        !threePaneLayout && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "flex shrink-0 items-center gap-4 border-b border-border px-4",
+            "data-testid": "ndv-pane-switcher",
+            children: [
+              /* @__PURE__ */ jsx(
+                TabButton,
+                {
+                  active: pane === "input",
+                  onClick: () => setPane("input"),
+                  children: tr("fluidgrids.builder.nodeDetailView.inputSection", "Input")
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                TabButton,
+                {
+                  active: pane === "parameters",
+                  onClick: () => setPane("parameters"),
+                  children: tr(
+                    "fluidgrids.builder.nodeDetailView.tabParameters",
+                    "Parameters"
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                TabButton,
+                {
+                  active: pane === "output",
+                  onClick: () => setPane("output"),
+                  children: tr("fluidgrids.builder.nodeDetailView.outputSection", "Output")
+                }
+              )
+            ]
+          }
+        ),
         /* @__PURE__ */ jsxs("div", { ref: panesRef, className: "flex min-h-0 flex-1", children: [
           /* @__PURE__ */ jsxs(
             "section",
             {
-              style: { width: `${leftPct}%` },
-              className: "flex min-h-0 min-w-[180px] flex-col bg-card/40",
+              style: threePaneLayout ? { width: `${leftPct}%` } : void 0,
+              className: cn(
+                "flex min-h-0 flex-col bg-card/40",
+                threePaneLayout ? "min-w-[180px]" : pane === "input" ? "w-full flex-1" : "hidden"
+              ),
               children: [
                 /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-4 py-2.5", children: [
                   /* @__PURE__ */ jsx("span", { className: SECTION_LABEL3, children: tr("fluidgrids.builder.nodeDetailView.inputSection", "Input") }),
@@ -21464,57 +21519,69 @@ function NodeDetailView() {
               ]
             }
           ),
-          /* @__PURE__ */ jsx(ResizeHandle, { onStart: startDrag("left") }),
-          /* @__PURE__ */ jsxs("section", { className: "flex min-h-0 min-w-[280px] flex-1 flex-col", children: [
-            /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-4 border-b border-border px-4", children: [
-              /* @__PURE__ */ jsx(
-                TabButton,
-                {
-                  active: tab === "parameters",
-                  onClick: () => setTab("parameters"),
-                  children: tr(
-                    "fluidgrids.builder.nodeDetailView.tabParameters",
-                    "Parameters"
-                  )
-                }
+          threePaneLayout && /* @__PURE__ */ jsx(ResizeHandle, { onStart: startDrag("left") }),
+          /* @__PURE__ */ jsxs(
+            "section",
+            {
+              className: cn(
+                "flex min-h-0 flex-1 flex-col",
+                threePaneLayout ? "min-w-[280px]" : pane === "parameters" ? "w-full" : "hidden"
               ),
-              /* @__PURE__ */ jsx(
-                TabButton,
-                {
-                  active: tab === "settings",
-                  onClick: () => setTab("settings"),
-                  children: tr(
-                    "fluidgrids.builder.nodeDetailView.tabSettings",
-                    "Settings"
+              children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-4 border-b border-border px-4", children: [
+                  /* @__PURE__ */ jsx(
+                    TabButton,
+                    {
+                      active: tab === "parameters",
+                      onClick: () => setTab("parameters"),
+                      children: tr(
+                        "fluidgrids.builder.nodeDetailView.tabParameters",
+                        "Parameters"
+                      )
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    TabButton,
+                    {
+                      active: tab === "settings",
+                      onClick: () => setTab("settings"),
+                      children: tr(
+                        "fluidgrids.builder.nodeDetailView.tabSettings",
+                        "Settings"
+                      )
+                    }
                   )
-                }
-              )
-            ] }),
-            tab === "parameters" ? /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: "min-h-0 flex-1 space-y-4 overflow-auto p-4",
-                "data-testid": "ndv-params",
-                children: /* @__PURE__ */ jsx(
-                  NodeParamsForm,
+                ] }),
+                tab === "parameters" ? /* @__PURE__ */ jsx(
+                  "div",
                   {
-                    config: config2,
-                    nodeType: node?.type,
-                    testIdPrefix: "ndv"
+                    className: "min-h-0 flex-1 space-y-4 overflow-auto p-4",
+                    "data-testid": "ndv-params",
+                    children: /* @__PURE__ */ jsx(
+                      NodeParamsForm,
+                      {
+                        config: config2,
+                        nodeType: node?.type,
+                        testIdPrefix: "ndv"
+                      }
+                    )
                   }
-                )
-              }
-            ) : /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-auto p-4 text-xs text-muted-foreground", children: tr(
-              "fluidgrids.builder.nodeDetailView.noSettings",
-              "No additional settings for this node."
-            ) })
-          ] }),
-          /* @__PURE__ */ jsx(ResizeHandle, { onStart: startDrag("right") }),
+                ) : /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-auto p-4 text-xs text-muted-foreground", children: tr(
+                  "fluidgrids.builder.nodeDetailView.noSettings",
+                  "No additional settings for this node."
+                ) })
+              ]
+            }
+          ),
+          threePaneLayout && /* @__PURE__ */ jsx(ResizeHandle, { onStart: startDrag("right") }),
           /* @__PURE__ */ jsxs(
             "section",
             {
-              style: { width: `${rightPct}%` },
-              className: "flex min-h-0 min-w-[180px] flex-col bg-card/40",
+              style: threePaneLayout ? { width: `${rightPct}%` } : void 0,
+              className: cn(
+                "flex min-h-0 flex-col bg-card/40",
+                threePaneLayout ? "min-w-[180px]" : pane === "output" ? "w-full flex-1" : "hidden"
+              ),
               children: [
                 /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-4 py-2.5", children: [
                   /* @__PURE__ */ jsx("span", { className: SECTION_LABEL3, children: tr(
@@ -22798,14 +22865,16 @@ var FlowBuilder = ({ readOnly = false }) => {
     ]
   );
   return /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-full w-full overflow-hidden", children: [
-    !isReadOnly && /* @__PURE__ */ jsxs(Card, { className: "h-14 shrink-0 border-0 from-primary/40 p-2 to-transparent rounded-t-xl rounded-b-none bg-gradient-to-l backdrop-blur-sm mt-2 mx-4 items-center flex justify-between border border-card-foreground/10 border-b-0", children: [
-      /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center gap-2", children: [
+    !isReadOnly && // min-h-14 (not h-14) so the title row may wrap onto a second line on
+    // phones instead of pushing the actions menu off-screen.
+    /* @__PURE__ */ jsxs(Card, { className: "min-h-14 shrink-0 border-0 from-primary/40 p-2 to-transparent rounded-t-xl rounded-b-none bg-gradient-to-l backdrop-blur-sm mt-2 mx-4 items-center flex gap-2 justify-between border border-card-foreground/10 border-b-0", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-wrap items-center gap-2", children: [
         /* @__PURE__ */ jsx(
           Button,
           {
             variant: "ghost",
             size: "icon",
-            className: "text-primary-foreground font-bold",
+            className: "shrink-0 text-primary-foreground font-bold",
             onClick: () => {
               navigate("../list");
             },
@@ -22853,7 +22922,7 @@ var FlowBuilder = ({ readOnly = false }) => {
               type: "button",
               "data-tour": "fluidgrids-builder-workflow-name",
               title: `${workflowName || name || "Untitled Workflow"} \u2014 click to rename`,
-              className: "-mx-1 min-w-[15rem] max-w-[38vw] cursor-text truncate rounded px-1 text-left font-bold text-card-foreground transition-colors hover:bg-card-foreground/10",
+              className: "-mx-1 min-w-0 flex-1 basis-40 cursor-text truncate rounded px-1 text-left font-bold text-card-foreground transition-colors hover:bg-card-foreground/10 sm:min-w-[15rem] sm:max-w-[38vw] sm:flex-none sm:basis-auto",
               onClick: () => setIsEditingName(true),
               children: workflowName || name || tr(
                 "fluidgrids.builder.flowBuilder.untitledWorkflow",
@@ -22865,7 +22934,7 @@ var FlowBuilder = ({ readOnly = false }) => {
         /* @__PURE__ */ jsx(
           Input,
           {
-            className: "text-card-foreground font-bold ml-2",
+            className: "text-card-foreground font-bold ml-2 min-w-0 flex-1 basis-32 sm:w-52 sm:flex-none sm:basis-auto",
             type: "text",
             placeholder: tr(
               "fluidgrids.builder.flowBuilder.versionAliasPlaceholder",
@@ -22880,12 +22949,12 @@ var FlowBuilder = ({ readOnly = false }) => {
           {
             entityType: "FLUIDGRIDS_WORKFLOW",
             entityId: id,
-            className: "ml-2"
+            className: "ml-2 shrink-0"
           }
         )
       ] }),
       name !== "" && /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsxs("div", { className: "hidden lg:inline-flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxs("div", { className: "hidden shrink-0 lg:inline-flex items-center gap-2", children: [
           /* @__PURE__ */ jsx(VersionHistoryPanel, {}),
           /* @__PURE__ */ jsx(SaveFlowButton, {}),
           /* @__PURE__ */ jsx(ActivateWorkflowButton, {}),
@@ -22897,7 +22966,7 @@ var FlowBuilder = ({ readOnly = false }) => {
             }
           )
         ] }),
-        /* @__PURE__ */ jsx("div", { className: "lg:hidden", children: /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+        /* @__PURE__ */ jsx("div", { className: "shrink-0 lg:hidden", children: /* @__PURE__ */ jsxs(DropdownMenu, { children: [
           /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
             Button,
             {
@@ -22947,7 +23016,7 @@ var FlowBuilder = ({ readOnly = false }) => {
           el._ro = ro;
         },
         "data-tour": "fluidgrids-builder-canvas",
-        className: "relative w-full flex-1 rounded-b-xl border border-card-foreground/10 border-t-0 overflow-hidden ml-4 mb-1",
+        className: "relative flex-1 rounded-b-xl border border-card-foreground/10 border-t-0 overflow-hidden mx-4 mb-1",
         children: [
           /* @__PURE__ */ jsx(CanvasControls, {}),
           /* @__PURE__ */ jsx(
@@ -23092,8 +23161,8 @@ var FlowBuilderPage = ({
   }
   return /* @__PURE__ */ jsxs(ReactFlowProvider, { children: [
     /* @__PURE__ */ jsx(IntegrationReturnHandler, {}),
-    /* @__PURE__ */ jsx("div", { className: "flex flex-col h-full", children: /* @__PURE__ */ jsxs("div", { className: "flex grow min-h-0 divide-x divide-card-foreground/10", children: [
-      /* @__PURE__ */ jsx("div", { className: "grow bg-card md:bg-transparent", children: /* @__PURE__ */ jsx(FlowBuilder, { readOnly: isReadOnly }) }),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-col h-full", children: /* @__PURE__ */ jsxs("div", { className: "relative flex grow min-h-0 divide-x divide-card-foreground/10", children: [
+      /* @__PURE__ */ jsx("div", { className: "grow min-w-0 bg-card md:bg-transparent", children: /* @__PURE__ */ jsx(FlowBuilder, { readOnly: isReadOnly }) }),
       !isReadOnly && /* @__PURE__ */ jsx(SidebarModule, {})
     ] }) })
   ] });
@@ -23480,5 +23549,5 @@ function WorkflowBuilder() {
 }
 
 export { Card2 as Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ConnectionFormDialog, ConnectionSelector, EntityTagPicker, FlowBuilderPage, FluidGridsProvider, ProviderPicker, SchemaConnectionForm, ScopePicker, TemplateCard, WorkflowBuilder, listCustomBlocks, refetchStoreNodes, registerCustomBlock, resolveUiSpec, stripSubmitActions, useConnection, useConnectionDialog, useConnections, useConnectionsByProvider, useCreateConnection, useFluidGridsContext, useImportWorkflowTemplate, useInitiateOAuth, useNodeExecution, useProviderByKey, useProviderCatalog, useProviders, useWorkflowTemplates };
-//# sourceMappingURL=chunk-DVPXNC2S.js.map
-//# sourceMappingURL=chunk-DVPXNC2S.js.map
+//# sourceMappingURL=chunk-A54HLFJE.js.map
+//# sourceMappingURL=chunk-A54HLFJE.js.map