diff --git a/src/cg/03-ui-components.cg b/src/cg/03-ui-components.cg index 017ec1e..def3506 100644 --- a/src/cg/03-ui-components.cg +++ b/src/cg/03-ui-components.cg @@ -168,6 +168,8 @@ textInput = config \ ui.stateful { cursorX = ui.measureText textBeforeCursor; padding = 8; + _ = debug "focused" state.focused; + ui.clip { w = config.w, h = config.h, @@ -183,11 +185,11 @@ textInput = config \ ui.stateful { (state.focused | True \ ui.positioned { - x = 8 + cursorX - state.scrollOffset, - y = 8, - child = ui.rect { w = 2, h = 24, color = config.color } - } - | _ \ ui.rect { w = 0, h = 0, color = "transparent" }) + x = 8 + cursorX - state.scrollOffset, + y = 8, + child = ui.rect { w = 2, h = 24, color = config.color } + } + | _ \ empty) ] } } diff --git a/src/cg/06-inspector.cg b/src/cg/06-inspector.cg index 70c3d10..e825a77 100644 --- a/src/cg/06-inspector.cg +++ b/src/cg/06-inspector.cg @@ -27,7 +27,7 @@ inspector = config \ textInput { key = "palette-query" & (str i), initialValue = line, - initialFocus = False, + initialFocus = i == 0, color = "white", backgroundColor = "rgba(0,0,0,0.0)", w = contentWidth, diff --git a/src/runtime-compiled.ts b/src/runtime-compiled.ts index 0e3f777..6575027 100644 --- a/src/runtime-compiled.ts +++ b/src/runtime-compiled.ts @@ -43,9 +43,8 @@ export function runAppCompiled(app: App, canvas: HTMLCanvasElement, rt: any) { // Focus event to the new if (componentKey && componentInstances.has(componentKey)) { - handleComponentEvent(componentKey, { name: 'Focused' }); + handleComponentEvent(componentKey, { _tag: 'Focused' }); } - rerender(); } function handleComponentEvent(componentKey: string, event: any) { @@ -89,7 +88,7 @@ export function runAppCompiled(app: App, canvas: HTMLCanvasElement, rt: any) { instance.view = ui.view; } - if (ui.autoFocus && isNew) { + if (ui.autoFocus?._tag === 'True' && isNew) { setFocus(fullKey); } @@ -144,6 +143,13 @@ export function runAppCompiled(app: App, canvas: HTMLCanvasElement, rt: any) { const ui = valueToUI(uiValue); const expandedUI = expandStateful(ui, [], renderedKeys); + // clean up unrendered instances + for (const key of componentInstances.keys()) { + if (!renderedKeys.has(key)) { + componentInstances.delete(key); + } + } + if (focusedComponentKey && !renderedKeys.has(focusedComponentKey)) { focusedComponentKey = null; }