@burdenoff/fluidgrids-fe-sdk 2026.801.2 → 2026.801.4

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.
@@ -1,10 +1,10 @@
1
1
  import { Dialog as Dialog$1, DialogContent as DialogContent$1, DialogHeader as DialogHeader$1, DialogTitle as DialogTitle$1, DialogDescription as DialogDescription$1, Input as Input$1, DialogFooter } from './chunk-MRVS73S2.js';
2
2
  import { Badge as Badge$1, Button } from './chunk-DBOMRIP5.js';
3
- import { refetchStoreNodes, registerWorkflowNodeTypes, ensureNodeConfigsLoaded, onNodeTypesUpdate, NODE_TYPES, getNodeMetadata, AVAILABLE_NODES, useInsertNode, NODE_TYPE_DRAG_DATA_FORMAT, NODE_OPERATION_DRAG_DATA_FORMAT, useSaveWorkflow, STICKY_NOTE_TYPE, useNodeExecution, getNodeDetail, mergeStickyNotes, buildStickyNode, ConnectionSelector, nodeAccent, NODES_METADATA, isNodeConfigsInitialized, NODE_CONFIGS, NODES, NodePropertyPanel, resolveInputHandles } from './chunk-XBMHUJYN.js';
3
+ import { refetchStoreNodes, registerWorkflowNodeTypes, ensureNodeConfigsLoaded, onNodeTypesUpdate, NODE_TYPES, getNodeMetadata, AVAILABLE_NODES, useInsertNode, NODE_TYPE_DRAG_DATA_FORMAT, NODE_OPERATION_DRAG_DATA_FORMAT, useSaveWorkflow, STICKY_NOTE_TYPE, useNodeExecution, getNodeDetail, mergeStickyNotes, buildStickyNode, ConnectionSelector, nodeAccent, NODES_METADATA, isNodeConfigsInitialized, NODE_CONFIGS, NODES, NodePropertyPanel, resolveInputHandles } from './chunk-33QRAWG2.js';
4
4
  import { createGlobalStoreClient, setGlobalStoreClient, resetGlobalStoreClient, getGlobalStoreClient } from './chunk-BQXHJIER.js';
5
5
  import { BrowseWorkflowTemplatesDocument, InstallWorkflowNodeDocument, InstallPurchasedNodeDocument, GetMyNodeInstallationsDocument, BrowseWorkflowNodesDocument, UninstallWorkflowNodeDocument, CreateStoreOrderDocument } from './chunk-PNOA7CQV.js';
6
6
  import { useLazyWorkflowDefinition, useCreateWorkflow, useWorkflowVersions, useRestoreWorkflowVersion, useActivateWorkflow, useDeleteWorkflow, useDeactivateWorkflow } from './chunk-NMS2QUXG.js';
7
- import { useFlowStore } from './chunk-WSBRI47P.js';
7
+ import { useFlowStore } from './chunk-2KRMZXFF.js';
8
8
  import { SdkPermissionButton, FLUIDGRIDS_PERMISSIONS } from './chunk-UIY2HBWA.js';
9
9
  import { cn } from './chunk-3ZYUGTIT.js';
10
10
  import { throwIfResultError, NodeSchemaIntrospectionDocument, EventRegistrationsDocument, NodeUsageStatusDocument, RemoveNodeFromWorkflowsDocument } from './chunk-XEYNX7YJ.js';
@@ -2432,10 +2432,15 @@ function StoreCategoryList({
2432
2432
  searchTerm,
2433
2433
  onSearchChange,
2434
2434
  onSelectCategory,
2435
- onSelectNode
2435
+ onSelectNode,
2436
+ autoFocusSearch = false
2436
2437
  }) {
2437
2438
  const isSearching = searchTerm.trim().length > 0;
2438
2439
  const [showDeprecated, setShowDeprecated] = useState(false);
2440
+ const searchRef = useRef(null);
2441
+ useEffect(() => {
2442
+ if (autoFocusSearch) searchRef.current?.focus();
2443
+ }, [autoFocusSearch]);
2439
2444
  const { products, loading, hasMore, fetchMore } = useStoreNodes({
2440
2445
  filter: {
2441
2446
  type: "NODE",
@@ -2459,6 +2464,7 @@ function StoreCategoryList({
2459
2464
  /* @__PURE__ */ jsx(
2460
2465
  Input$1,
2461
2466
  {
2467
+ ref: searchRef,
2462
2468
  value: searchTerm,
2463
2469
  onChange: (e) => {
2464
2470
  onSearchChange(e.target.value);
@@ -3476,6 +3482,7 @@ function StoreBrowsePanel() {
3476
3482
  const [view, setView] = useState({ type: "categories" });
3477
3483
  const [globalSearch, setGlobalSearch] = useState("");
3478
3484
  const [, setNodesReady] = useState(isNodeConfigsInitialized);
3485
+ const attachArmed = useFlowStore((s) => !!s.workflow.pendingConnection);
3479
3486
  useEffect(() => {
3480
3487
  void ensureNodeConfigsLoaded().then(() => setNodesReady(true));
3481
3488
  }, []);
@@ -3512,7 +3519,8 @@ function StoreBrowsePanel() {
3512
3519
  searchTerm: globalSearch,
3513
3520
  onSearchChange: setGlobalSearch,
3514
3521
  onSelectCategory: openCategory,
3515
- onSelectNode: openNodeDetail
3522
+ onSelectNode: openNodeDetail,
3523
+ autoFocusSearch: attachArmed
3516
3524
  }
3517
3525
  ),
3518
3526
  view.type === "category-nodes" && /* @__PURE__ */ jsx(
@@ -4203,7 +4211,7 @@ function DesktopSidebarFragment({
4203
4211
  if (nodes) {
4204
4212
  const requiredNodeTypes = [];
4205
4213
  try {
4206
- const { NODE_CONFIGS: NODE_CONFIGS3, ensureNodeConfigsLoaded: ensureNodeConfigsLoaded2 } = await import('./blocks-QKAWYAOT.js');
4214
+ const { NODE_CONFIGS: NODE_CONFIGS3, ensureNodeConfigsLoaded: ensureNodeConfigsLoaded2 } = await import('./blocks-HIWIS6OD.js');
4207
4215
  await ensureNodeConfigsLoaded2().catch(() => {
4208
4216
  });
4209
4217
  const workflowNodeTypes = [
@@ -13495,31 +13503,46 @@ var PANEL_WIDTH = 380;
13495
13503
  var PANEL_EST_HEIGHT = 480;
13496
13504
  var MAPPER_WIDTH = 260;
13497
13505
  var VIEWPORT_MARGIN = 12;
13498
- function clampToViewport(pos) {
13499
- const maxX = window.innerWidth - PANEL_WIDTH - VIEWPORT_MARGIN;
13500
- const maxY = window.innerHeight - PANEL_EST_HEIGHT - VIEWPORT_MARGIN;
13506
+ var NODE_GAP = 14;
13507
+ function useNodeScreenRect(nodeId) {
13508
+ const { flowToScreenPosition } = useReactFlow();
13509
+ const raw = useStore((s) => {
13510
+ const n = s.nodeLookup.get(nodeId);
13511
+ if (!n) return null;
13512
+ const p = n.internals?.positionAbsolute ?? n.position;
13513
+ return {
13514
+ x: p.x,
13515
+ y: p.y,
13516
+ w: n.measured?.width ?? n.width ?? 288,
13517
+ h: n.measured?.height ?? n.height ?? 120,
13518
+ // Selecting the transform forces a re-render on pan/zoom.
13519
+ tx: s.transform[0],
13520
+ ty: s.transform[1],
13521
+ z: s.transform[2]
13522
+ };
13523
+ }, shallow);
13524
+ if (!raw) return null;
13525
+ const tl = flowToScreenPosition({ x: raw.x, y: raw.y });
13526
+ const br = flowToScreenPosition({ x: raw.x + raw.w, y: raw.y + raw.h });
13501
13527
  return {
13502
- x: Math.min(
13503
- Math.max(VIEWPORT_MARGIN, pos.x),
13504
- Math.max(VIEWPORT_MARGIN, maxX)
13505
- ),
13506
- y: Math.min(
13507
- Math.max(VIEWPORT_MARGIN, pos.y),
13508
- Math.max(VIEWPORT_MARGIN, maxY)
13509
- )
13528
+ left: tl.x,
13529
+ top: tl.y,
13530
+ right: br.x,
13531
+ bottom: br.y,
13532
+ cy: (tl.y + br.y) / 2
13510
13533
  };
13511
13534
  }
13535
+ var clamp = (v, lo, hi) => Math.min(Math.max(v, lo), Math.max(lo, hi));
13512
13536
  function QuickConfigPanel() {
13513
13537
  const quickConfig = useFlowStore((s) => s.workflow.quickConfig);
13514
13538
  if (!quickConfig) return null;
13515
13539
  return (
13516
- // Remount per node so panel position/flyout state reset naturally.
13540
+ // Remount per node so panel-local state (mapper open) resets naturally.
13517
13541
  /* @__PURE__ */ jsx(
13518
13542
  QuickConfigPanelInner,
13519
13543
  {
13520
13544
  nodeId: quickConfig.nodeId,
13521
- type: quickConfig.type,
13522
- anchor: quickConfig.anchor
13545
+ type: quickConfig.type
13523
13546
  },
13524
13547
  quickConfig.nodeId
13525
13548
  )
@@ -13527,8 +13550,7 @@ function QuickConfigPanel() {
13527
13550
  }
13528
13551
  function QuickConfigPanelInner({
13529
13552
  nodeId,
13530
- type,
13531
- anchor
13553
+ type
13532
13554
  }) {
13533
13555
  const close = useFlowStore((s) => s.actions.quickConfig.close);
13534
13556
  const openNdv = useFlowStore((s) => s.actions.ndv.open);
@@ -13541,45 +13563,62 @@ function QuickConfigPanelInner({
13541
13563
  setSelectedSource,
13542
13564
  inputFields
13543
13565
  } = config;
13544
- const [pos, setPos] = useState(
13545
- () => clampToViewport(
13546
- anchor ?? {
13547
- x: window.innerWidth / 2 - PANEL_WIDTH / 2,
13548
- y: window.innerHeight / 4
13549
- }
13550
- )
13551
- );
13552
13566
  const [showMapper, setShowMapper] = useState(false);
13553
- const dragStateRef = useRef(null);
13554
- const handleHeaderPointerDown = useCallback(
13555
- (e) => {
13556
- if (e.target.closest("button")) return;
13557
- dragStateRef.current = {
13558
- startX: e.clientX,
13559
- startY: e.clientY,
13560
- baseX: pos.x,
13561
- baseY: pos.y
13562
- };
13563
- const onMove = (ev) => {
13564
- const s = dragStateRef.current;
13565
- if (!s) return;
13566
- setPos(
13567
- clampToViewport({
13568
- x: s.baseX + (ev.clientX - s.startX),
13569
- y: s.baseY + (ev.clientY - s.startY)
13570
- })
13571
- );
13572
- };
13573
- const onUp = () => {
13574
- dragStateRef.current = null;
13575
- window.removeEventListener("pointermove", onMove);
13576
- window.removeEventListener("pointerup", onUp);
13567
+ const nodeRect = useNodeScreenRect(nodeId);
13568
+ const cardRef = useRef(null);
13569
+ const [panelH, setPanelH] = useState(PANEL_EST_HEIGHT);
13570
+ useLayoutEffect(() => {
13571
+ const el = cardRef.current;
13572
+ if (!el) return;
13573
+ const measure = () => setPanelH(el.offsetHeight);
13574
+ measure();
13575
+ const ro = new ResizeObserver(measure);
13576
+ ro.observe(el);
13577
+ return () => ro.disconnect();
13578
+ }, []);
13579
+ const placement = useMemo(() => {
13580
+ if (!nodeRect) {
13581
+ return {
13582
+ side: "right",
13583
+ left: window.innerWidth / 2 - PANEL_WIDTH / 2,
13584
+ top: window.innerHeight / 4,
13585
+ connectorLeft: 0,
13586
+ connectorWidth: 0,
13587
+ connectorTop: 0,
13588
+ hasConnector: false
13577
13589
  };
13578
- window.addEventListener("pointermove", onMove);
13579
- window.addEventListener("pointerup", onUp);
13580
- },
13581
- [pos.x, pos.y]
13582
- );
13590
+ }
13591
+ const need = PANEL_WIDTH + NODE_GAP + VIEWPORT_MARGIN;
13592
+ const spaceRight = window.innerWidth - nodeRect.right;
13593
+ const spaceLeft = nodeRect.left;
13594
+ const side = spaceRight >= need ? "right" : spaceLeft >= need ? "left" : spaceRight >= spaceLeft ? "right" : "left";
13595
+ const rawLeft = side === "right" ? nodeRect.right + NODE_GAP : nodeRect.left - NODE_GAP - PANEL_WIDTH;
13596
+ const left = clamp(
13597
+ rawLeft,
13598
+ VIEWPORT_MARGIN,
13599
+ window.innerWidth - PANEL_WIDTH - VIEWPORT_MARGIN
13600
+ );
13601
+ const top = clamp(
13602
+ nodeRect.cy - panelH / 2,
13603
+ VIEWPORT_MARGIN,
13604
+ window.innerHeight - panelH - VIEWPORT_MARGIN
13605
+ );
13606
+ const connectorTop = clamp(nodeRect.cy, top + 6, top + panelH - 6);
13607
+ const connectorLeft = side === "right" ? nodeRect.right : left + PANEL_WIDTH;
13608
+ const connectorWidth = Math.max(
13609
+ 0,
13610
+ side === "right" ? left - nodeRect.right : nodeRect.left - (left + PANEL_WIDTH)
13611
+ );
13612
+ return {
13613
+ side,
13614
+ left,
13615
+ top,
13616
+ connectorLeft,
13617
+ connectorWidth,
13618
+ connectorTop,
13619
+ hasConnector: connectorWidth > 1
13620
+ };
13621
+ }, [nodeRect, panelH]);
13583
13622
  useEffect(() => {
13584
13623
  const onKey = (e) => {
13585
13624
  if (e.key === "Escape") close();
@@ -13597,148 +13636,170 @@ function QuickConfigPanelInner({
13597
13636
  const expandToNdv = () => {
13598
13637
  openNdv({ nodeId, type });
13599
13638
  };
13600
- return /* @__PURE__ */ jsxs(
13601
- "div",
13602
- {
13603
- className: "fixed",
13604
- style: { left: pos.x, top: pos.y, zIndex: 300, width: PANEL_WIDTH },
13605
- "data-testid": "quick-config-panel",
13606
- children: [
13607
- showMapper && /* @__PURE__ */ jsxs(
13608
- "div",
13609
- {
13610
- className: "absolute overflow-hidden rounded-xl border border-border bg-card shadow-xl",
13611
- style: {
13612
- right: "100%",
13613
- marginRight: 10,
13614
- top: 0,
13615
- width: MAPPER_WIDTH,
13616
- maxHeight: "min(60vh, 480px)",
13617
- display: "flex",
13618
- flexDirection: "column"
13619
- },
13620
- "data-testid": "quick-config-mapper",
13621
- children: [
13622
- /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-2 border-b border-border px-3 py-2", children: [
13639
+ const mapperStyle = placement.side === "right" ? { left: "100%", marginLeft: 10, top: 0 } : { right: "100%", marginRight: 10, top: 0 };
13640
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
13641
+ placement.hasConnector && /* @__PURE__ */ jsx(
13642
+ "div",
13643
+ {
13644
+ "aria-hidden": true,
13645
+ className: "pointer-events-none fixed",
13646
+ style: {
13647
+ left: placement.connectorLeft,
13648
+ top: placement.connectorTop - 1,
13649
+ width: placement.connectorWidth,
13650
+ height: 2,
13651
+ background: accent,
13652
+ opacity: 0.55,
13653
+ zIndex: 299
13654
+ }
13655
+ }
13656
+ ),
13657
+ /* @__PURE__ */ jsxs(
13658
+ "div",
13659
+ {
13660
+ className: "fixed",
13661
+ style: {
13662
+ left: placement.left,
13663
+ top: placement.top,
13664
+ zIndex: 300,
13665
+ width: PANEL_WIDTH
13666
+ },
13667
+ "data-testid": "quick-config-panel",
13668
+ children: [
13669
+ showMapper && /* @__PURE__ */ jsxs(
13670
+ "div",
13671
+ {
13672
+ className: "absolute overflow-hidden rounded-xl border border-border bg-card shadow-xl",
13673
+ style: {
13674
+ ...mapperStyle,
13675
+ width: MAPPER_WIDTH,
13676
+ maxHeight: "min(60vh, 480px)",
13677
+ display: "flex",
13678
+ flexDirection: "column"
13679
+ },
13680
+ "data-testid": "quick-config-mapper",
13681
+ children: [
13682
+ /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-2 border-b border-border px-3 py-2", children: [
13683
+ /* @__PURE__ */ jsx(
13684
+ Icon,
13685
+ {
13686
+ icon: "mdi:tray-arrow-down",
13687
+ className: "size-3.5 text-muted-foreground"
13688
+ }
13689
+ ),
13690
+ /* @__PURE__ */ jsx("span", { className: "text-[11px] font-semibold uppercase tracking-[0.12em] text-muted-foreground", children: "Input" }),
13691
+ sourceIds.length > 0 && /* @__PURE__ */ jsx(
13692
+ "select",
13693
+ {
13694
+ className: "ml-auto max-w-[55%] truncate rounded-md border border-input bg-background px-1.5 py-0.5 text-[11px] text-foreground outline-none focus:border-primary",
13695
+ value: selectedSource ?? "",
13696
+ onChange: (e) => setSelectedSource(e.target.value),
13697
+ "data-testid": "qc-source-selector",
13698
+ children: sourceIds.map((sid) => {
13699
+ const sn = nodes.find((n) => n.id === sid);
13700
+ return /* @__PURE__ */ jsx("option", { value: sid, children: nodeTitle(sn) }, sid);
13701
+ })
13702
+ }
13703
+ )
13704
+ ] }),
13705
+ /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-auto px-2 py-2", children: inputFields.length > 0 ? /* @__PURE__ */ jsx(FieldTree, { fields: inputFields, draggable: true }) : /* @__PURE__ */ jsx("p", { className: "px-2 py-4 text-center text-xs text-muted-foreground", children: sourceIds.length === 0 ? "Connect an upstream node to map its fields." : "The selected source has no declared output fields." }) }),
13706
+ /* @__PURE__ */ jsx("p", { className: "shrink-0 border-t border-border px-3 py-1.5 text-[10px] leading-snug text-muted-foreground", children: "Drag a field onto a parameter to map it." })
13707
+ ]
13708
+ }
13709
+ ),
13710
+ /* @__PURE__ */ jsxs(
13711
+ "div",
13712
+ {
13713
+ ref: cardRef,
13714
+ className: "flex flex-col overflow-hidden rounded-xl border border-border bg-card shadow-2xl animate-in fade-in zoom-in-95 duration-150",
13715
+ style: {
13716
+ maxHeight: "min(70vh, 560px)",
13717
+ borderTop: `3px solid ${accent}`
13718
+ },
13719
+ children: [
13720
+ /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-2.5 border-b border-border px-3 py-2.5 select-none", children: [
13721
+ /* @__PURE__ */ jsx(
13722
+ "div",
13723
+ {
13724
+ className: "flex size-7 shrink-0 items-center justify-center rounded-lg",
13725
+ style: {
13726
+ backgroundColor: `color-mix(in srgb, ${accent} 13%, transparent)`,
13727
+ color: accent,
13728
+ border: `1px solid color-mix(in srgb, ${accent} 26%, transparent)`
13729
+ },
13730
+ children: /* @__PURE__ */ jsx(Icon, { icon: meta.icon, className: "size-4" })
13731
+ }
13732
+ ),
13733
+ /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
13734
+ /* @__PURE__ */ jsx("p", { className: "truncate text-sm font-semibold leading-tight text-foreground", children: nodeTitle(node) }),
13735
+ subtitle && /* @__PURE__ */ jsx("p", { className: "truncate font-mono text-[11px] leading-tight text-muted-foreground", children: subtitle })
13736
+ ] }),
13737
+ /* @__PURE__ */ jsx(
13738
+ "button",
13739
+ {
13740
+ type: "button",
13741
+ title: showMapper ? "Hide input data" : "Map data from input",
13742
+ "aria-label": "Toggle input mapper",
13743
+ onClick: () => setShowMapper((v) => !v),
13744
+ className: `rounded-md p-1.5 transition-colors hover:bg-muted ${showMapper ? "text-primary" : "text-muted-foreground"} hover:text-foreground`,
13745
+ "data-testid": "qc-toggle-mapper",
13746
+ children: /* @__PURE__ */ jsx(Icon, { icon: "mdi:tray-arrow-down", className: "size-4" })
13747
+ }
13748
+ ),
13749
+ /* @__PURE__ */ jsx(
13750
+ "button",
13751
+ {
13752
+ type: "button",
13753
+ title: "Open full editor",
13754
+ "aria-label": "Open full editor",
13755
+ onClick: expandToNdv,
13756
+ className: "rounded-md p-1.5 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground",
13757
+ "data-testid": "qc-expand",
13758
+ children: /* @__PURE__ */ jsx(Icon, { icon: "mdi:arrow-expand", className: "size-4" })
13759
+ }
13760
+ ),
13761
+ /* @__PURE__ */ jsx(
13762
+ "button",
13763
+ {
13764
+ type: "button",
13765
+ title: "Close",
13766
+ "aria-label": "Close",
13767
+ onClick: close,
13768
+ className: "rounded-md p-1.5 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground",
13769
+ "data-testid": "qc-close",
13770
+ children: /* @__PURE__ */ jsx(Icon, { icon: "mdi:close", className: "size-4" })
13771
+ }
13772
+ )
13773
+ ] }),
13623
13774
  /* @__PURE__ */ jsx(
13624
- Icon,
13625
- {
13626
- icon: "mdi:tray-arrow-down",
13627
- className: "size-3.5 text-muted-foreground"
13628
- }
13629
- ),
13630
- /* @__PURE__ */ jsx("span", { className: "text-[11px] font-semibold uppercase tracking-[0.12em] text-muted-foreground", children: "Input" }),
13631
- sourceIds.length > 0 && /* @__PURE__ */ jsx(
13632
- "select",
13775
+ "div",
13633
13776
  {
13634
- className: "ml-auto max-w-[55%] truncate rounded-md border border-input bg-background px-1.5 py-0.5 text-[11px] text-foreground outline-none focus:border-primary",
13635
- value: selectedSource ?? "",
13636
- onChange: (e) => setSelectedSource(e.target.value),
13637
- "data-testid": "qc-source-selector",
13638
- children: sourceIds.map((sid) => {
13639
- const sn = nodes.find((n) => n.id === sid);
13640
- return /* @__PURE__ */ jsx("option", { value: sid, children: nodeTitle(sn) }, sid);
13641
- })
13642
- }
13643
- )
13644
- ] }),
13645
- /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-auto px-2 py-2", children: inputFields.length > 0 ? /* @__PURE__ */ jsx(FieldTree, { fields: inputFields, draggable: true }) : /* @__PURE__ */ jsx("p", { className: "px-2 py-4 text-center text-xs text-muted-foreground", children: sourceIds.length === 0 ? "Connect an upstream node to map its fields." : "The selected source has no declared output fields." }) }),
13646
- /* @__PURE__ */ jsx("p", { className: "shrink-0 border-t border-border px-3 py-1.5 text-[10px] leading-snug text-muted-foreground", children: "Drag a field onto a parameter to map it." })
13647
- ]
13648
- }
13649
- ),
13650
- /* @__PURE__ */ jsxs(
13651
- "div",
13652
- {
13653
- className: "flex flex-col overflow-hidden rounded-xl border border-border bg-card shadow-2xl animate-in fade-in zoom-in-95 duration-150",
13654
- style: {
13655
- maxHeight: "min(70vh, 560px)",
13656
- borderTop: `3px solid ${accent}`
13657
- },
13658
- children: [
13659
- /* @__PURE__ */ jsxs(
13660
- "div",
13661
- {
13662
- className: "flex shrink-0 cursor-move items-center gap-2.5 border-b border-border px-3 py-2.5 select-none",
13663
- onPointerDown: handleHeaderPointerDown,
13664
- children: [
13665
- /* @__PURE__ */ jsx(
13666
- "div",
13667
- {
13668
- className: "flex size-7 shrink-0 items-center justify-center rounded-lg",
13669
- style: {
13670
- backgroundColor: `color-mix(in srgb, ${accent} 13%, transparent)`,
13671
- color: accent,
13672
- border: `1px solid color-mix(in srgb, ${accent} 26%, transparent)`
13673
- },
13674
- children: /* @__PURE__ */ jsx(Icon, { icon: meta.icon, className: "size-4" })
13777
+ className: "min-h-0 flex-1 space-y-4 overflow-auto p-3",
13778
+ "data-testid": "qc-params",
13779
+ onFocusCapture: (e) => {
13780
+ const tag = e.target.tagName;
13781
+ if (sourceIds.length > 0 && (tag === "INPUT" || tag === "SELECT" || tag === "TEXTAREA")) {
13782
+ setShowMapper(true);
13675
13783
  }
13676
- ),
13677
- /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
13678
- /* @__PURE__ */ jsx("p", { className: "truncate text-sm font-semibold leading-tight text-foreground", children: nodeTitle(node) }),
13679
- subtitle && /* @__PURE__ */ jsx("p", { className: "truncate font-mono text-[11px] leading-tight text-muted-foreground", children: subtitle })
13680
- ] }),
13681
- /* @__PURE__ */ jsx(
13682
- "button",
13683
- {
13684
- type: "button",
13685
- title: showMapper ? "Hide input data" : "Map data from input",
13686
- "aria-label": "Toggle input mapper",
13687
- onClick: () => setShowMapper((v) => !v),
13688
- className: `rounded-md p-1.5 transition-colors hover:bg-muted ${showMapper ? "text-primary" : "text-muted-foreground"} hover:text-foreground`,
13689
- "data-testid": "qc-toggle-mapper",
13690
- children: /* @__PURE__ */ jsx(Icon, { icon: "mdi:tray-arrow-down", className: "size-4" })
13691
- }
13692
- ),
13693
- /* @__PURE__ */ jsx(
13694
- "button",
13695
- {
13696
- type: "button",
13697
- title: "Open full editor",
13698
- "aria-label": "Open full editor",
13699
- onClick: expandToNdv,
13700
- className: "rounded-md p-1.5 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground",
13701
- "data-testid": "qc-expand",
13702
- children: /* @__PURE__ */ jsx(Icon, { icon: "mdi:arrow-expand", className: "size-4" })
13703
- }
13704
- ),
13705
- /* @__PURE__ */ jsx(
13706
- "button",
13784
+ },
13785
+ children: /* @__PURE__ */ jsx(
13786
+ NodeParamsForm,
13707
13787
  {
13708
- type: "button",
13709
- title: "Close",
13710
- "aria-label": "Close",
13711
- onClick: close,
13712
- className: "rounded-md p-1.5 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground",
13713
- "data-testid": "qc-close",
13714
- children: /* @__PURE__ */ jsx(Icon, { icon: "mdi:close", className: "size-4" })
13788
+ config,
13789
+ nodeType: node.type,
13790
+ testIdPrefix: "qc"
13715
13791
  }
13716
13792
  )
13717
- ]
13718
- }
13719
- ),
13720
- /* @__PURE__ */ jsx(
13721
- "div",
13722
- {
13723
- className: "min-h-0 flex-1 space-y-4 overflow-auto p-3",
13724
- "data-testid": "qc-params",
13725
- children: /* @__PURE__ */ jsx(
13726
- NodeParamsForm,
13727
- {
13728
- config,
13729
- nodeType: node.type,
13730
- testIdPrefix: "qc"
13731
- }
13732
- )
13733
- }
13734
- ),
13735
- /* @__PURE__ */ jsx("p", { className: "shrink-0 border-t border-border px-3 py-1.5 text-[10px] leading-snug text-muted-foreground", children: "Changes apply instantly \xB7 double-click the node for the full editor" })
13736
- ]
13737
- }
13738
- )
13739
- ]
13740
- }
13741
- );
13793
+ }
13794
+ ),
13795
+ /* @__PURE__ */ jsx("p", { className: "shrink-0 border-t border-border px-3 py-1.5 text-[10px] leading-snug text-muted-foreground", children: "Changes apply instantly \xB7 double-click the node for the full editor" })
13796
+ ]
13797
+ }
13798
+ )
13799
+ ]
13800
+ }
13801
+ )
13802
+ ] });
13742
13803
  }
13743
13804
  var STATUS_STYLES = {
13744
13805
  DRAFT: { label: "Draft", variant: "secondary" },
@@ -14761,7 +14822,7 @@ function WorkflowItem({
14761
14822
  };
14762
14823
  const requiredNodeTypes = [];
14763
14824
  try {
14764
- const { NODE_CONFIGS: NODE_CONFIGS3, ensureNodeConfigsLoaded: ensureNodeConfigsLoaded2 } = await import('./blocks-QKAWYAOT.js');
14825
+ const { NODE_CONFIGS: NODE_CONFIGS3, ensureNodeConfigsLoaded: ensureNodeConfigsLoaded2 } = await import('./blocks-HIWIS6OD.js');
14765
14826
  await ensureNodeConfigsLoaded2().catch(() => {
14766
14827
  });
14767
14828
  const workflowNodeTypes = [
@@ -15059,5 +15120,5 @@ function WorkflowBuilder() {
15059
15120
  }
15060
15121
 
15061
15122
  export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, FlowBuilderPage, FluidGridsProvider, TemplateCard, WorkflowBuilder, useFluidGridsContext, useImportWorkflowTemplate, useWorkflowTemplates };
15062
- //# sourceMappingURL=chunk-KOXWDM2E.js.map
15063
- //# sourceMappingURL=chunk-KOXWDM2E.js.map
15123
+ //# sourceMappingURL=chunk-6I77TPCY.js.map
15124
+ //# sourceMappingURL=chunk-6I77TPCY.js.map