treege 3.0.0-beta.11 → 3.0.0-beta.13

package/dist/editor/constants/defaultNode.d.ts

@@ -1,4 +1,4 @@
-export declare const defaultNode: {
+export declare const DEFAULT_NODE: {
     data: {
         type: string;
     };

package/dist/editor/constants/edgeTypes.d.ts

@@ -1,3 +1,3 @@
-export declare const edgeTypes: {
+export declare const EDGE_TYPES: {
     conditional: ({ id, target, sourceX, sourceY, targetX, targetY, sourcePosition, targetPosition, markerEnd, style, data, }: import('../features/TreegeEditor/edges/ConditionalEdge').ConditionalEdgeProps) => import("react/jsx-runtime").JSX.Element;
 };

package/dist/editor/constants/nodeSpacing.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Constants for node spacing and positioning in the flow editor
+ */
+/**
+ * Vertical spacing between nodes (in pixels)
+ * Used when creating nodes via handle click or AI generation
+ */
+export declare const VERTICAL_NODE_SPACING = 100;
+/**
+ * Horizontal offset when placing sibling nodes (in pixels)
+ */
+export declare const HORIZONTAL_NODE_OFFSET = 50;
+/**
+ * Horizontal spacing for AI-generated flows (in pixels)
+ */
+export declare const AI_HORIZONTAL_SPACING = 350;
+/**
+ * Position tolerance for detecting nodes at the same Y position (in pixels)
+ */
+export declare const POSITION_TOLERANCE = 20;

package/dist/editor/constants/nodeTypes.d.ts

@@ -1,4 +1,4 @@
-export declare const nodeTypes: {
+export declare const NODE_TYPES: {
     flow: ({ data, isConnectable, type, parentId, id }: import('../features/TreegeEditor/nodes/FlowNode').FlowNodeProps) => import("react/jsx-runtime").JSX.Element;
     group: ({ data }: import('../features/TreegeEditor/nodes/GroupNode').GroupNodeProps) => import("react/jsx-runtime").JSX.Element;
     input: ({ data, isConnectable, type, parentId, id }: import('../features/TreegeEditor/nodes/InputNode').InputNodeProps) => import("react/jsx-runtime").JSX.Element;

package/dist/editor/hooks/useFlowConnections.d.ts

@@ -8,6 +8,7 @@ declare const useFlowConnections: () => {
         source: string;
         target: string;
     }) => boolean;
+    onAddFromHandle: (sourceNodeId: string) => void;
     onConnect: OnConnect;
     onConnectEnd: OnConnectEnd;
     onEdgesDelete: OnEdgesDelete;

package/dist/editor.js

@@ -1,5 +1,5 @@
-import { T as o } from "./TreegeEditor-BCdlhdkk.js";
-import { T as m, u as s } from "./ThemeContext-BC-hvzzD.js";
+import { T as o } from "./TreegeEditor-DvCdZUeV.js";
+import { T as m, u as s } from "./ThemeContext-mnnnxuZU.js";
 export {
   m as ThemeProvider,
   o as TreegeEditor,

package/dist/main.js

@@ -1,6 +1,6 @@
-import { T as t } from "./TreegeEditor-BCdlhdkk.js";
-import { T as u, d as l, g as r, b as o, c as i, i as n, a as d, u as f } from "./ThemeContext-BC-hvzzD.js";
-import { c as D, d as I, e as T, f as m, g, h as F, D as c, i as x, j as N, k as S, l as b, m as v, n as R, o as h, p as w, q as C, r as z, s as A, v as H, w as k, T as E, b as G, J as P, K as y, t as U, x as V, y as j, z as q, A as B, C as J, F as K, G as L, I as M, E as O, H as Q, B as W, u as X, a as Y } from "./TreegeRenderer-BAvL4iDF.js";
+import { T as t } from "./TreegeEditor-DvCdZUeV.js";
+import { T as u, d as l, g as r, b as o, c as i, i as n, a as d, u as f } from "./ThemeContext-mnnnxuZU.js";
+import { c as D, d as I, e as T, f as m, g, h as F, D as c, i as x, j as N, k as S, l as b, m as v, n as R, o as h, p as w, q as C, r as z, s as A, v as H, w as k, T as E, b as G, J as P, K as y, t as U, x as V, y as j, z as q, A as B, C as J, F as K, G as L, I as M, E as O, H as Q, B as W, u as X, a as Y } from "./TreegeRenderer-DJaR2FqI.js";
 export {
   D as DefaultAddressInput,
   I as DefaultAutocompleteInput,

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultAddressInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultAddressInput: ({ node, value, setValue, error, label, placeholder, helperText }: InputRenderProps<"address">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultAddressInput: ({ node, value, setValue, error, label, placeholder, helperText, id, name }: InputRenderProps<"address">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultAddressInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultAutocompleteInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultAutocompleteInput: ({ node, value, setValue, error, label, placeholder, helperText }: InputRenderProps<"autocomplete">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultAutocompleteInput: ({ node, value, setValue, error, label, placeholder, helperText, id, }: InputRenderProps<"autocomplete">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultAutocompleteInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultCheckboxInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultCheckboxInput: ({ node, value, setValue, error, label, helperText }: InputRenderProps<"checkbox">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultCheckboxInput: ({ node, value, setValue, error, label, helperText, id, name }: InputRenderProps<"checkbox">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultCheckboxInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultDateInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultDateInput: ({ node, value, setValue, error, label, placeholder, helperText }: InputRenderProps<"date">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultDateInput: ({ node, value, setValue, error, label, placeholder, helperText, id, name }: InputRenderProps<"date">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultDateInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultDateRangeInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultDateRangeInput: ({ node, value, setValue, error, label, helperText }: InputRenderProps<"daterange">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultDateRangeInput: ({ node, value, setValue, error, label, helperText, id }: InputRenderProps<"daterange">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultDateRangeInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultFileInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultFileInput: ({ node, setValue, error, label, placeholder, helperText }: InputRenderProps<"file">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultFileInput: ({ node, setValue, error, label, placeholder, helperText, name, id }: InputRenderProps<"file">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultFileInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultHiddenInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultHiddenInput: ({ node, value }: InputRenderProps<"hidden">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultHiddenInput: ({ value, name, id }: InputRenderProps<"hidden">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultHiddenInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultHttpInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultHttpInput: ({ node, value, setValue, error, label, placeholder, helperText }: InputRenderProps<"http">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultHttpInput: ({ node, value, setValue, error, label, placeholder, helperText, id, name }: InputRenderProps<"http">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultHttpInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultNumberInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultNumberInput: ({ node, value, setValue, error, label, placeholder, helperText }: InputRenderProps<"number">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultNumberInput: ({ node, value, setValue, error, label, placeholder, helperText, name, id }: InputRenderProps<"number">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultNumberInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultPasswordInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultPasswordInput: ({ node, value, setValue, error, label, placeholder, helperText }: InputRenderProps<"password">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultPasswordInput: ({ node, value, setValue, error, label, placeholder, helperText, name, id }: InputRenderProps<"password">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultPasswordInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultRadioInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultRadioInput: ({ node, value, setValue, error, label, helperText }: InputRenderProps<"radio">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultRadioInput: ({ node, value, setValue, error, label, helperText, id, name }: InputRenderProps<"radio">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultRadioInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultSelectInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultSelectInput: ({ node, value, setValue, error, label, placeholder, helperText }: InputRenderProps<"select">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultSelectInput: ({ node, value, setValue, error, label, placeholder, helperText, name, id }: InputRenderProps<"select">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultSelectInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultSwitchInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultSwitchInput: ({ node, value, setValue, error, label, helperText }: InputRenderProps<"switch">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultSwitchInput: ({ node, value, setValue, error, label, helperText, name, id }: InputRenderProps<"switch">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultSwitchInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultTextAreaInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultTextAreaInput: ({ node, value, setValue, error, label, placeholder, helperText }: InputRenderProps<"textarea">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultTextAreaInput: ({ node, value, setValue, error, label, placeholder, helperText, name, id }: InputRenderProps<"textarea">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultTextAreaInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultTextInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultTextInput: ({ node, value, setValue, error, label, placeholder, helperText }: InputRenderProps<"text">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultTextInput: ({ node, value, setValue, error, label, placeholder, helperText, name, id }: InputRenderProps<"text">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultTextInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultTimeInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultTimeInput: ({ node, value, setValue, error, label, placeholder, helperText }: InputRenderProps<"time">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultTimeInput: ({ node, value, setValue, error, label, placeholder, helperText, name, id }: InputRenderProps<"time">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultTimeInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultTimeRangeInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultTimeRangeInput: ({ node, value, setValue, error, label, helperText }: InputRenderProps<"timerange">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultTimeRangeInput: ({ node, value, setValue, error, label, helperText, id, name }: InputRenderProps<"timerange">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultTimeRangeInput;

package/dist/renderer/types/renderer.d.ts

@@ -45,6 +45,15 @@ export type InputRenderProps<T extends InputType = InputType> = {
      * Current value of the input field (typed based on input type when T is specified)
      */
     value: InputValueTypeMap[T];
+    /**
+     * Unique field ID (nodeId)
+     */
+    id: string;
+    /**
+     * Field name (resolved using priority: name > label > nodeId)
+     * Use this for the name and id attributes of the input element
+     */
+    name: string;
     /**
      * Function to update the input value
      * @param value - The new value (typed based on input type when T is specified)

package/dist/renderer/utils/form.d.ts

@@ -20,7 +20,8 @@ export declare const checkFormFieldHasValue: (fieldName: string | undefined, for
 /**
  * Convert internal form values (keyed by nodeId) to external format (keyed by name)
  * When multiple nodes share the same name, later values overwrite earlier ones
- * example: convertFormValuesToNamedFormat({ id1: 'Alice', id2: 'Bob' }, [ { id: 'id1', data: { name: 'firstName' } }, { id: 'id2', data: { name: 'lastName' } } ])
- * returns { firstName: 'Alice', lastName: 'Bob' }
+ * Priority for key naming: name > label (en) > nodeId
+ * example: convertFormValuesToNamedFormat({ id1: 'Alice', id2: 'Bob' }, [ { id: 'id1', data: { name: 'firstName' } }, { id: 'id2', data: { label: { en: 'Last Name' } } } ])
+ * returns { firstName: 'Alice', 'Last Name': 'Bob' }
  */
 export declare const convertFormValuesToNamedFormat: (formValues: FormValues, nodes: Node<InputNodeData>[]) => Record<string, unknown>;

package/dist/renderer/utils/node.d.ts

@@ -6,9 +6,17 @@ import { InputNodeData, TreegeNodeData } from '../../shared/types/node';
  * @returns Array of input nodes only
  */
 export declare const getInputNodes: (nodes: Node<TreegeNodeData>[]) => Node<InputNodeData>[];
+/**
+ * Resolve the key name for an input node using priority: name > label (en) > nodeId
+ * This is the single source of truth for key resolution across the application
+ * @param node - The input node
+ * @returns The resolved key (name, label, or node ID)
+ */
+export declare const resolveNodeKey: (node: Node<InputNodeData>) => string;
 /**
  * Get the field name (DOM name attribute) for a given node ID
- * Uses node.data.name if available, otherwise falls back to nodeId
+ * Priority: name > label (en) > nodeId
+ * This must match the logic in convertFormValuesToNamedFormat for consistency
  * @param nodeId - The ID of the input node
  * @param nodes - Array of input nodes
  * @returns The field name to use in the DOM, or undefined if node not found

package/dist/renderer.js

@@ -1,5 +1,5 @@
-import { c as t, d as s, e as u, f as l, g as r, h as n, D as i, i as o, j as f, k as d, l as p, m as D, n as I, o as T, p as m, q as g, r as F, s as c, v, w as x, T as R, b as S, J as b, K as h, t as C, x as w, y as z, z as A, A as H, C as N, F as k, G as P, I as y, E, H as G, B as V, u as j, a as q } from "./TreegeRenderer-BAvL4iDF.js";
-import { T as J, g as K, u as U } from "./ThemeContext-BC-hvzzD.js";
+import { c as t, d as s, e as u, f as l, g as r, h as n, D as i, i as o, j as f, k as d, l as p, m as D, n as I, o as T, p as m, q as g, r as F, s as c, v, w as x, T as R, b as S, J as b, K as h, t as C, x as w, y as z, z as A, A as H, C as N, F as k, G as P, I as y, E, H as G, B as V, u as j, a as q } from "./TreegeRenderer-DJaR2FqI.js";
+import { T as J, g as K, u as U } from "./ThemeContext-mnnnxuZU.js";
 export {
   t as DefaultAddressInput,
   s as DefaultAutocompleteInput,

package/dist/shared/locales/ar.json.d.ts

@@ -148,6 +148,7 @@ declare const _default: {
       "multipleFiles": "ملفات متعددة",
       "multipleSelection": "اختيار متعدد",
       "name": "الاسم",
+      "nameDescription": "اسم حقل مخصص اختياري لتصدير النموذج. إذا كان فارغاً، سيتم استخدام التسمية كمفتاح.",
       "noParentFieldsAvailable": "لا توجد حقول أصلية متاحة",
       "objectMapping": "تعيين الكائن",
       "objectMappingDesc": "تعيين خصائص الكائن المصدر إلى بنية جديدة",

package/dist/shared/locales/de.json.d.ts

@@ -148,6 +148,7 @@ declare const _default: {
       "multipleFiles": "Mehrere Dateien",
       "multipleSelection": "Mehrfachauswahl",
       "name": "Name",
+      "nameDescription": "Optionaler benutzerdefinierter Feldname für den Formularexport. Falls leer, wird die Bezeichnung als Schlüssel verwendet.",
       "noParentFieldsAvailable": "Keine übergeordneten Felder verfügbar",
       "objectMapping": "Objektzuordnung",
       "objectMappingDesc": "Eigenschaften des Quellobjekts auf eine neue Struktur abbilden",

package/dist/shared/locales/en.json.d.ts

@@ -148,6 +148,7 @@ declare const _default: {
       "multipleFiles": "Multiple files",
       "multipleSelection": "Multiple selection",
       "name": "Name",
+      "nameDescription": "Optional custom field name for form export. If empty, the label will be used as the key.",
       "noParentFieldsAvailable": "No parent fields available",
       "objectMapping": "Object Mapping",
       "objectMappingDesc": "Map properties from the source object to a new structure",

package/dist/shared/locales/es.json.d.ts

@@ -148,6 +148,7 @@ declare const _default: {
       "multipleFiles": "Archivos múltiples",
       "multipleSelection": "Selección múltiple",
       "name": "Nombre",
+      "nameDescription": "Nombre de campo personalizado opcional para la exportación del formulario. Si está vacío, la etiqueta se usará como clave.",
       "noParentFieldsAvailable": "No hay campos principales disponibles",
       "objectMapping": "Mapeo de objetos",
       "objectMappingDesc": "Mapear las propiedades del objeto de origen a una nueva estructura",

package/dist/shared/locales/fr.json.d.ts

@@ -148,6 +148,7 @@ declare const _default: {
       "multipleFiles": "Fichiers multiples",
       "multipleSelection": "Sélection multiple",
       "name": "Nom",
+      "nameDescription": "Nom de champ personnalisé optionnel pour l'export du formulaire. Si vide, le libellé sera utilisé comme clé.",
       "noParentFieldsAvailable": "Aucun champ parent disponible",
       "objectMapping": "Mappage d'objet",
       "objectMappingDesc": "Mapper les propriétés de l'objet source vers une nouvelle structure",

package/dist/shared/locales/it.json.d.ts

@@ -148,6 +148,7 @@ declare const _default: {
       "multipleFiles": "File multipli",
       "multipleSelection": "Selezione multipla",
       "name": "Nome",
+      "nameDescription": "Nome campo personalizzato opzionale per l'esportazione del modulo. Se vuoto, l'etichetta verrà utilizzata come chiave.",
       "noParentFieldsAvailable": "Nessun campo genitore disponibile",
       "objectMapping": "Mappatura oggetto",
       "objectMappingDesc": "Mappa le proprietà dell'oggetto sorgente su una nuova struttura",

package/dist/shared/locales/pt.json.d.ts

@@ -148,6 +148,7 @@ declare const _default: {
       "multipleFiles": "Arquivos múltiplos",
       "multipleSelection": "Seleção múltipla",
       "name": "Nome",
+      "nameDescription": "Nome de campo personalizado opcional para exportação de formulário. Se vazio, o rótulo será usado como chave.",
       "noParentFieldsAvailable": "Nenhum campo pai disponível",
       "objectMapping": "Mapeamento de objeto",
       "objectMappingDesc": "Mapear as propriedades do objeto de origem para uma nova estrutura",

package/package.json

@@ -2,7 +2,7 @@
   "name": "treege",
   "description": "Powerful form generator",
   "license": "ISC",
-  "version": "3.0.0-beta.11",
+  "version": "3.0.0-beta.13",
   "type": "module",
   "types": "./dist/main.d.ts",
   "module": "./dist/main.js",
@@ -59,7 +59,7 @@
     "@radix-ui/react-tooltip": "^1.2.8",
     "@tanstack/react-form": "^1.23.5",
     "@uiw/react-textarea-code-editor": "^3.1.1",
-    "@xyflow/react": "^12.8.6",
+    "@xyflow/react": "12.9.2",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "cmdk": "^1.1.1",