imxc 0.6.9 → 0.6.11

package/dist/emitter.js

@@ -193,6 +193,24 @@ function emitFloat(val) {
         return trimmed;
     return trimmed.includes('.') ? `${trimmed}F` : `${trimmed}.0F`;
 }
+function emitStringItemsSource(itemsExpr, dynamicItems, prefix, counter, indent, lines) {
+    if (!dynamicItems) {
+        const itemsList = itemsExpr.split(',').map(s => s.trim()).filter(s => s.length > 0);
+        const itemsVar = `${prefix}_${counter}`;
+        lines.push(`${indent}const char* ${itemsVar}[] = {${itemsList.join(', ')}};`);
+        return { itemsArg: itemsVar, countExpr: `${itemsList.length}` };
+    }
+    const sourceVar = `${prefix}_src_${counter}`;
+    const itemsVar = `${prefix}_ptrs_${counter}`;
+    const itemVar = `${prefix}_item_${counter}`;
+    lines.push(`${indent}const auto& ${sourceVar} = ${itemsExpr};`);
+    lines.push(`${indent}std::vector<const char*> ${itemsVar};`);
+    lines.push(`${indent}${itemsVar}.reserve(${sourceVar}.size());`);
+    lines.push(`${indent}for (const auto& ${itemVar} : ${sourceVar}) {`);
+    lines.push(`${indent}${INDENT}${itemsVar}.push_back(${itemVar}.c_str());`);
+    lines.push(`${indent}}`);
+    return { itemsArg: `${itemsVar}.data()`, countExpr: `static_cast<int>(${itemsVar}.size())` };
+}
 function findDockLayout(nodes) {
     for (const node of nodes) {
         if (node.kind === 'dock_layout')
@@ -308,6 +326,7 @@ export function emitComponent(comp, imports, sourceFile, boundProps, boundPropsM
             // Named interface: include runtime + renderer, plus user header for the struct definition
             lines.push('#include <imx/runtime.h>');
             lines.push('#include <imx/renderer.h>');
+            lines.push('#include <vector>');
             lines.push(`#include "${comp.namedPropsType}.h"`);
             if (hasColorType) {
                 lines.push('#include <array>');
@@ -328,6 +347,7 @@ export function emitComponent(comp, imports, sourceFile, boundProps, boundPropsM
         else {
             // Component with inline props: include its own header instead of redeclaring struct
             lines.push(`#include "${comp.name}.gen.h"`);
+            lines.push('#include <vector>');
             if (hasColorType) {
                 lines.push('#include <array>');
             }
@@ -349,6 +369,7 @@ export function emitComponent(comp, imports, sourceFile, boundProps, boundPropsM
         // No props: standard headers
         lines.push('#include <imx/runtime.h>');
         lines.push('#include <imx/renderer.h>');
+        lines.push('#include <vector>');
         if (hasColorType) {
             lines.push('#include <array>');
         }
@@ -2283,18 +2304,16 @@ function emitDragInt(node, lines, indent) {
 function emitCombo(node, lines, indent) {
     emitLocComment(node.loc, 'Combo', lines, indent);
     const label = asCharPtr(node.label);
-    const itemsList = node.items.split(',').map(s => s.trim()).filter(s => s.length > 0);
-    const count = itemsList.length;
-    const varName = `combo_items_${comboCounter++}`;
+    const counter = comboCounter++;
     if (node.stateVar) {
         lines.push(`${indent}{`);
         const innerIndent = indent + INDENT;
         const styleVar = buildWidgetStyleVar(node.style, node.width, innerIndent, lines);
         const styleArg = styleVar ? `, ${styleVar}` : '';
-        lines.push(`${innerIndent}const char* ${varName}[] = {${itemsList.join(', ')}};`);
+        const { itemsArg, countExpr } = emitStringItemsSource(node.items, node.dynamicItems, 'combo_items', counter, innerIndent, lines);
         lines.push(`${innerIndent}int val = ${node.stateVar}.get();`);
         const changedVar = nextWidgetTemp('combo_changed');
-        const resultVar = emitBoolWidgetCall(`imx::renderer::combo(${label}, &val, ${varName}, ${count}${styleArg})`, node.item, lines, innerIndent, changedVar);
+        const resultVar = emitBoolWidgetCall(`imx::renderer::combo(${label}, &val, ${itemsArg}, ${countExpr}${styleArg})`, node.item, lines, innerIndent, changedVar);
         lines.push(`${innerIndent}if (${resultVar}) {`);
         lines.push(`${innerIndent}${INDENT}${node.stateVar}.set(val);`);
         lines.push(`${innerIndent}}`);
@@ -2305,8 +2324,8 @@ function emitCombo(node, lines, indent) {
         const innerIndent = indent + INDENT;
         const styleVar = buildWidgetStyleVar(node.style, node.width, innerIndent, lines);
         const styleArg = styleVar ? `, ${styleVar}` : '';
-        lines.push(`${innerIndent}const char* ${varName}[] = {${itemsList.join(', ')}};`);
-        emitBoolWidgetCall(`imx::renderer::combo(${label}, ${emitDirectBindPtr(node.valueExpr)}, ${varName}, ${count}${styleArg})`, node.item, lines, innerIndent);
+        const { itemsArg, countExpr } = emitStringItemsSource(node.items, node.dynamicItems, 'combo_items', counter, innerIndent, lines);
+        emitBoolWidgetCall(`imx::renderer::combo(${label}, ${emitDirectBindPtr(node.valueExpr)}, ${itemsArg}, ${countExpr}${styleArg})`, node.item, lines, innerIndent);
         lines.push(`${indent}}`);
     }
     else if (node.valueExpr !== undefined) {
@@ -2314,13 +2333,13 @@ function emitCombo(node, lines, indent) {
         const innerIndent = indent + INDENT;
         const styleVar = buildWidgetStyleVar(node.style, node.width, innerIndent, lines);
         const styleArg = styleVar ? `, ${styleVar}` : '';
-        lines.push(`${innerIndent}const char* ${varName}[] = {${itemsList.join(', ')}};`);
+        const { itemsArg, countExpr } = emitStringItemsSource(node.items, node.dynamicItems, 'combo_items', counter, innerIndent, lines);
         lines.push(`${innerIndent}int val = ${node.valueExpr};`);
         const changedVar = nextWidgetTemp('combo_changed');
-        const resultVar = emitBoolWidgetCall(`imx::renderer::combo(${label}, &val, ${varName}, ${count}${styleArg})`, node.item, lines, innerIndent, changedVar);
+        const resultVar = emitBoolWidgetCall(`imx::renderer::combo(${label}, &val, ${itemsArg}, ${countExpr}${styleArg})`, node.item, lines, innerIndent, changedVar);
         lines.push(`${innerIndent}if (${resultVar}) {`);
         if (node.onChangeExpr) {
-            lines.push(`${innerIndent}${INDENT}${node.onChangeExpr};`);
+            lines.push(`${innerIndent}${INDENT}${node.onChangeExpr}`);
         }
         lines.push(`${innerIndent}}`);
         lines.push(`${indent}}`);
@@ -2479,18 +2498,16 @@ function emitColorEdit3(node, lines, indent) {
 function emitListBox(node, lines, indent) {
     emitLocComment(node.loc, 'ListBox', lines, indent);
     const label = asCharPtr(node.label);
-    const itemsList = node.items.split(',').map(s => s.trim()).filter(s => s.length > 0);
-    const count = itemsList.length;
-    const varName = `listbox_items_${listBoxCounter++}`;
+    const counter = listBoxCounter++;
     if (node.stateVar) {
         lines.push(`${indent}{`);
         const innerIndent = indent + INDENT;
         const styleVar = buildWidgetStyleVar(node.style, node.width, innerIndent, lines);
         const styleArg = styleVar ? `, ${styleVar}` : '';
-        lines.push(`${innerIndent}const char* ${varName}[] = {${itemsList.join(', ')}};`);
+        const { itemsArg, countExpr } = emitStringItemsSource(node.items, node.dynamicItems, 'listbox_items', counter, innerIndent, lines);
         lines.push(`${innerIndent}int val = ${node.stateVar}.get();`);
         const changedVar = nextWidgetTemp('list_box_changed');
-        const resultVar = emitBoolWidgetCall(`imx::renderer::list_box(${label}, &val, ${varName}, ${count}${styleArg})`, node.item, lines, innerIndent, changedVar);
+        const resultVar = emitBoolWidgetCall(`imx::renderer::list_box(${label}, &val, ${itemsArg}, ${countExpr}${styleArg})`, node.item, lines, innerIndent, changedVar);
         lines.push(`${innerIndent}if (${resultVar}) {`);
         lines.push(`${innerIndent}${INDENT}${node.stateVar}.set(val);`);
         lines.push(`${innerIndent}}`);
@@ -2501,8 +2518,8 @@ function emitListBox(node, lines, indent) {
         const innerIndent = indent + INDENT;
         const styleVar = buildWidgetStyleVar(node.style, node.width, innerIndent, lines);
         const styleArg = styleVar ? `, ${styleVar}` : '';
-        lines.push(`${innerIndent}const char* ${varName}[] = {${itemsList.join(', ')}};`);
-        emitBoolWidgetCall(`imx::renderer::list_box(${label}, ${emitDirectBindPtr(node.valueExpr)}, ${varName}, ${count}${styleArg})`, node.item, lines, innerIndent);
+        const { itemsArg, countExpr } = emitStringItemsSource(node.items, node.dynamicItems, 'listbox_items', counter, innerIndent, lines);
+        emitBoolWidgetCall(`imx::renderer::list_box(${label}, ${emitDirectBindPtr(node.valueExpr)}, ${itemsArg}, ${countExpr}${styleArg})`, node.item, lines, innerIndent);
         lines.push(`${indent}}`);
     }
     else if (node.valueExpr !== undefined) {
@@ -2510,13 +2527,13 @@ function emitListBox(node, lines, indent) {
         const innerIndent = indent + INDENT;
         const styleVar = buildWidgetStyleVar(node.style, node.width, innerIndent, lines);
         const styleArg = styleVar ? `, ${styleVar}` : '';
-        lines.push(`${innerIndent}const char* ${varName}[] = {${itemsList.join(', ')}};`);
+        const { itemsArg, countExpr } = emitStringItemsSource(node.items, node.dynamicItems, 'listbox_items', counter, innerIndent, lines);
         lines.push(`${innerIndent}int val = ${node.valueExpr};`);
         const changedVar = nextWidgetTemp('list_box_changed');
-        const resultVar = emitBoolWidgetCall(`imx::renderer::list_box(${label}, &val, ${varName}, ${count}${styleArg})`, node.item, lines, innerIndent, changedVar);
+        const resultVar = emitBoolWidgetCall(`imx::renderer::list_box(${label}, &val, ${itemsArg}, ${countExpr}${styleArg})`, node.item, lines, innerIndent, changedVar);
         lines.push(`${innerIndent}if (${resultVar}) {`);
         if (node.onChangeExpr) {
-            lines.push(`${innerIndent}${INDENT}${node.onChangeExpr};`);
+            lines.push(`${innerIndent}${INDENT}${node.onChangeExpr}`);
         }
         lines.push(`${innerIndent}}`);
         lines.push(`${indent}}`);

package/dist/init.js

@@ -39,7 +39,7 @@ export function addToProject(projectDir) {
     console.log('    include(FetchContent)');
     console.log('    FetchContent_Declare(imx');
     console.log('        GIT_REPOSITORY https://github.com/bgocumlu/imx.git');
-    console.log('        GIT_TAG v0.6.9');
+    console.log('        GIT_TAG v0.6.11');
     console.log('    )');
     console.log('    FetchContent_MakeAvailable(imx)');
     console.log('    include(ImxCompile)');

package/dist/ir.d.ts

@@ -310,6 +310,7 @@ export interface IRCombo {
     onChangeExpr?: string;
     directBind?: boolean;
     items: string;
+    dynamicItems?: boolean;
     width?: string;
     style?: string;
     item?: IRItemInteraction;
@@ -359,6 +360,7 @@ export interface IRListBox {
     onChangeExpr?: string;
     directBind?: boolean;
     items: string;
+    dynamicItems?: boolean;
     width?: string;
     style?: string;
     item?: IRItemInteraction;

package/dist/lowering.d.ts

@@ -5,6 +5,7 @@ import type { IRComponent, IRStateSlot } from './ir.js';
 interface LoweringContext {
     stateVars: Map<string, IRStateSlot>;
     setterMap: Map<string, string>;
+    localAliases: Map<string, ts.Expression>;
     propsParam: string | null;
     propsFieldTypes: Map<string, string | 'callback'>;
     externalInterfaces?: Map<string, Map<string, string | 'callback'>>;

package/dist/lowering.js

@@ -62,6 +62,7 @@ export function lowerComponent(parsed, validation, externalInterfaces) {
     const ctx = {
         stateVars,
         setterMap,
+        localAliases: new Map(),
         propsParam,
         propsFieldTypes,
         externalInterfaces,
@@ -73,6 +74,7 @@ export function lowerComponent(parsed, validation, externalInterfaces) {
     // Find return statement and lower its JSX
     const body = [];
     if (func.body) {
+        collectLocalAliases(func.body, ctx);
         const returnStmt = func.body.statements.find(ts.isReturnStatement);
         if (returnStmt && returnStmt.expression) {
             lowerJsxExpression(returnStmt.expression, body, ctx);
@@ -87,6 +89,25 @@ export function lowerComponent(parsed, validation, externalInterfaces) {
         body,
     };
 }
+function collectLocalAliases(body, ctx) {
+    for (const stmt of body.statements) {
+        if (ts.isReturnStatement(stmt)) {
+            return;
+        }
+        if (!ts.isVariableStatement(stmt)) {
+            continue;
+        }
+        if ((stmt.declarationList.flags & ts.NodeFlags.Const) === 0) {
+            continue;
+        }
+        for (const decl of stmt.declarationList.declarations) {
+            if (!ts.isIdentifier(decl.name) || !decl.initializer) {
+                continue;
+            }
+            ctx.localAliases.set(decl.name.text, decl.initializer);
+        }
+    }
+}
 function normalizePropTypeText(typeText) {
     const trimmed = typeText.trim().replace(/\s*\|\s*undefined$/, '');
     if (trimmed === 'number')
@@ -209,6 +230,10 @@ export function exprToCpp(node, ctx) {
         if (ctx.stateVars.has(name)) {
             return `${name}.get()`;
         }
+        const alias = ctx.localAliases.get(name);
+        if (alias) {
+            return exprToCpp(alias, ctx);
+        }
         if (name === 'resetLayout') {
             return 'imx_reset_layout';
         }
@@ -1264,6 +1289,9 @@ function inferExprType(expr, ctx) {
         const slot = ctx.stateVars.get(expr.text);
         if (slot)
             return slot.type;
+        const alias = ctx.localAliases.get(expr.text);
+        if (alias)
+            return inferExprType(alias, ctx);
     }
     // Property access: props.name -> look up field type if available
     if (ts.isPropertyAccessExpression(expr)) {
@@ -1876,6 +1904,40 @@ function lowerValueOnChange(rawAttrs, ctx) {
     }
     return { stateVar, valueExpr, onChangeExpr, directBind };
 }
+function lowerIndexedValueOnChange(rawAttrs, ctx, valueName) {
+    let stateVar = '';
+    let valueExpr;
+    let onChangeExpr;
+    let directBind;
+    const valueRaw = rawAttrs.get('value');
+    if (valueRaw && ts.isIdentifier(valueRaw) && ctx.stateVars.has(valueRaw.text)) {
+        stateVar = valueRaw.text;
+    }
+    else if (valueRaw) {
+        valueExpr = exprToCpp(valueRaw, ctx);
+        const onChangeRaw = rawAttrs.get('onChange');
+        if (onChangeRaw) {
+            const { paramName, bodyCode } = lowerParameterizedCallback(onChangeRaw, ctx, valueName);
+            onChangeExpr = paramName === valueName
+                ? bodyCode
+                : `auto ${paramName} = ${valueName}; ${bodyCode}`;
+        }
+        else if (ts.isPropertyAccessExpression(valueRaw)) {
+            directBind = true;
+        }
+    }
+    return { stateVar, valueExpr, onChangeExpr, directBind };
+}
+function lowerItemsSource(attrs, rawAttrs, ctx) {
+    const itemsRaw = rawAttrs.get('items');
+    if (!itemsRaw) {
+        return { items: attrs['items'] ?? '' };
+    }
+    if (ts.isArrayLiteralExpression(itemsRaw)) {
+        return { items: exprToCpp(itemsRaw, ctx) };
+    }
+    return { items: exprToCpp(itemsRaw, ctx), dynamicItems: true };
+}
 function lowerSliderFloat(attrs, rawAttrs, body, ctx, loc) {
     const label = attrs['label'] ?? '""';
     const min = attrs['min'] ?? '0.0f';
@@ -1948,12 +2010,12 @@ function lowerDragInt(attrs, rawAttrs, body, ctx, loc) {
 }
 function lowerCombo(attrs, rawAttrs, body, ctx, loc) {
     const label = attrs['label'] ?? '""';
-    const items = attrs['items'] ?? '';
     const width = attrs['width'];
     const style = attrs['style'];
-    const { stateVar, valueExpr, onChangeExpr, directBind } = lowerValueOnChange(rawAttrs, ctx);
+    const { items, dynamicItems } = lowerItemsSource(attrs, rawAttrs, ctx);
+    const { stateVar, valueExpr, onChangeExpr, directBind } = lowerIndexedValueOnChange(rawAttrs, ctx, 'val');
     const item = lowerItemInteraction(attrs, rawAttrs, ctx);
-    body.push({ kind: 'combo', label, stateVar, valueExpr, onChangeExpr, directBind, items, width, style, item, loc });
+    body.push({ kind: 'combo', label, stateVar, valueExpr, onChangeExpr, directBind, items, dynamicItems, width, style, item, loc });
 }
 function lowerInputInt(attrs, rawAttrs, body, ctx, loc) {
     const label = attrs['label'] ?? '""';
@@ -2035,12 +2097,12 @@ function lowerColorEdit3(attrs, rawAttrs, body, ctx, loc) {
 }
 function lowerListBox(attrs, rawAttrs, body, ctx, loc) {
     const label = attrs['label'] ?? '""';
-    const items = attrs['items'] ?? '';
     const width = attrs['width'];
     const style = attrs['style'];
-    const { stateVar, valueExpr, onChangeExpr, directBind } = lowerValueOnChange(rawAttrs, ctx);
+    const { items, dynamicItems } = lowerItemsSource(attrs, rawAttrs, ctx);
+    const { stateVar, valueExpr, onChangeExpr, directBind } = lowerIndexedValueOnChange(rawAttrs, ctx, 'val');
     const item = lowerItemInteraction(attrs, rawAttrs, ctx);
-    body.push({ kind: 'list_box', label, stateVar, valueExpr, onChangeExpr, directBind, items, width, style, item, loc });
+    body.push({ kind: 'list_box', label, stateVar, valueExpr, onChangeExpr, directBind, items, dynamicItems, width, style, item, loc });
 }
 function lowerProgressBar(attrs, rawAttrs, body, ctx, loc) {
     const value = attrs['value'] ?? '0.0f';

package/dist/templates/custom.js

@@ -428,7 +428,7 @@ set(FETCHCONTENT_QUIET OFF)
 FetchContent_Declare(
     imx
     GIT_REPOSITORY https://github.com/bgocumlu/imx.git
-GIT_TAG v0.6.9
+GIT_TAG v0.6.11
     GIT_SHALLOW TRUE
     GIT_PROGRESS TRUE
 )

package/dist/templates/hotreload.js

@@ -313,7 +313,7 @@ set(FETCHCONTENT_QUIET OFF)
 FetchContent_Declare(
     imx
     GIT_REPOSITORY https://github.com/bgocumlu/imx.git
-GIT_TAG v0.6.9
+GIT_TAG v0.6.11
     GIT_SHALLOW TRUE
     GIT_PROGRESS TRUE
 )

package/dist/templates/index.js

@@ -402,7 +402,7 @@ set(FETCHCONTENT_QUIET OFF)
 FetchContent_Declare(
     imx
     GIT_REPOSITORY ${repoUrl}
-GIT_TAG v0.6.9
+GIT_TAG v0.6.11
     GIT_SHALLOW TRUE
     GIT_PROGRESS TRUE
 )

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "imxc",
-  "version": "0.6.9",
+  "version": "0.6.11",
   "description": "Compiler for IMX — compiles React-like .tsx to native Dear ImGui C++",
   "type": "module",
   "bin": {
@@ -15,7 +15,7 @@
     "test:watch": "vitest",
     "prepublishOnly": "npm run build"
   },
-  "keywords": ["imgui", "react", "tsx", "native", "gui", "compiler", "codegen"],
+  "keywords": ["imgui", "react", "tsx", "native", "gui", "compiler", "codegen"],
   "license": "MIT",
   "dependencies": {
     "typescript": "^5.8.0"