diff --git a/packages/@ember/-internals/glimmer/lib/component-managers/curly.ts b/packages/@ember/-internals/glimmer/lib/component-managers/curly.ts index 23d004c28f5..ab88e8ea278 100644 --- a/packages/@ember/-internals/glimmer/lib/component-managers/curly.ts +++ b/packages/@ember/-internals/glimmer/lib/component-managers/curly.ts @@ -28,7 +28,7 @@ import type { import type { Reference } from '@glimmer/reference'; import { childRefFor, createComputeRef, createPrimitiveRef, valueForRef } from '@glimmer/reference'; import { reifyPositional } from '@glimmer/runtime'; -import { EMPTY_ARRAY, unwrapTemplate } from '@glimmer/util'; +import { unwrapTemplate } from '@glimmer/utils'; import { beginTrackFrame, beginUntrackFrame, @@ -54,6 +54,7 @@ import { processComponentArgs } from '../utils/process-args'; export const ARGS = enumerableSymbol('ARGS'); export const HAS_BLOCK = enumerableSymbol('HAS_BLOCK'); +const EMPTY_ARRAY = []; export const DIRTY_TAG = Symbol('DIRTY_TAG'); export const IS_DISPATCHING_ATTRS = Symbol('IS_DISPATCHING_ATTRS'); diff --git a/packages/@ember/-internals/glimmer/lib/component-managers/mount.ts b/packages/@ember/-internals/glimmer/lib/component-managers/mount.ts index 068d30c8fbf..e0d7e9dd9d5 100644 --- a/packages/@ember/-internals/glimmer/lib/component-managers/mount.ts +++ b/packages/@ember/-internals/glimmer/lib/component-managers/mount.ts @@ -21,7 +21,7 @@ import type { Nullable } from '@ember/-internals/utility-types'; import { capabilityFlagsFrom } from '@glimmer/manager'; import type { Reference } from '@glimmer/reference'; import { createConstRef, valueForRef } from '@glimmer/reference'; -import { unwrapTemplate } from '@glimmer/util'; +import { unwrapTemplate } from '@glimmer/utils'; import type RuntimeResolver from '../resolver'; interface EngineState { diff --git a/packages/@ember/-internals/glimmer/lib/component-managers/outlet.ts b/packages/@ember/-internals/glimmer/lib/component-managers/outlet.ts index 4503ffcb43d..21912b6dda7 100644 --- a/packages/@ember/-internals/glimmer/lib/component-managers/outlet.ts +++ b/packages/@ember/-internals/glimmer/lib/component-managers/outlet.ts @@ -21,7 +21,7 @@ import { capabilityFlagsFrom } from '@glimmer/manager'; import type { Reference } from '@glimmer/reference'; import { createConstRef, valueForRef } from '@glimmer/reference'; import { EMPTY_ARGS } from '@glimmer/runtime'; -import { unwrapTemplate } from '@glimmer/util'; +import { unwrapTemplate } from '@glimmer/utils'; import type { DynamicScope } from '../renderer'; import type { OutletState } from '../utils/outlet'; diff --git a/packages/@ember/-internals/glimmer/lib/helpers/internal-helper.ts b/packages/@ember/-internals/glimmer/lib/helpers/internal-helper.ts index f474a052e6e..a49f497c7fa 100644 --- a/packages/@ember/-internals/glimmer/lib/helpers/internal-helper.ts +++ b/packages/@ember/-internals/glimmer/lib/helpers/internal-helper.ts @@ -1,7 +1,10 @@ import type { InternalOwner } from '@ember/-internals/owner'; import type { Helper, HelperDefinitionState } from '@glimmer/interfaces'; -import { setInternalHelperManager } from '@glimmer/manager'; +// import { setInternalHelperManager } from '@glimmer/manager'; export function internalHelper(helper: Helper): HelperDefinitionState { - return setInternalHelperManager(helper, {}); + return function () { + console.log('internal helper', this, [...arguments]); + return helper(...arguments); + } } diff --git a/packages/@ember/-internals/glimmer/lib/renderer.ts b/packages/@ember/-internals/glimmer/lib/renderer.ts index 1c9c0e44469..52736ac67fb 100644 --- a/packages/@ember/-internals/glimmer/lib/renderer.ts +++ b/packages/@ember/-internals/glimmer/lib/renderer.ts @@ -4,6 +4,7 @@ import type { InternalOwner } from '@ember/-internals/owner'; import { getOwner } from '@ember/-internals/owner'; import { guidFor } from '@ember/-internals/utils'; import { getViewElement, getViewId } from '@ember/-internals/views'; +import { renderComponent, runDestructors } from '@lifeart/gxt'; import { assert } from '@ember/debug'; import { _backburner, _getCurrentRunLoop } from '@ember/runloop'; import { destroy } from '@glimmer/destroyable'; @@ -31,14 +32,14 @@ import { createConstRef, UNDEFINED_REFERENCE, valueForRef } from '@glimmer/refer import type { CurriedValue } from '@glimmer/runtime'; import { clientBuilder, - curry, + // curry, DOMChanges, DOMTreeConstruction, inTransaction, renderMain, runtimeContext, } from '@glimmer/runtime'; -import { unwrapTemplate } from '@glimmer/util'; +import { unwrapTemplate } from '@glimmer/utils'; import { CURRENT_TAG, validateTag, valueForTag } from '@glimmer/validator'; import type { SimpleDocument, SimpleElement, SimpleNode } from '@simple-dom/interface'; import RSVP from 'rsvp'; @@ -64,6 +65,23 @@ export interface View { [BOUNDS]: Bounds | null; } +function curry( + type: T, + spec: object | string | any, + owner: any, + args: any | null, + resolved = false +) { + console.log('curry'); + return { + type, + spec, + owner, + args, + resolved, + }; +} + export class DynamicScope implements GlimmerDynamicScope { constructor(public view: View | null, public outletState: Reference) {} @@ -129,13 +147,13 @@ class RootState { constructor( public root: Component | OutletView, public runtime: RuntimeContext, - context: CompileTimeCompilationContext, + _context: CompileTimeCompilationContext, owner: InternalOwner, template: Template, self: Reference, parentElement: SimpleElement, - dynamicScope: DynamicScope, - builder: IBuilder + _dynamicScope: DynamicScope, + _builder: IBuilder ) { assert( `You cannot render \`${valueForRef(self)}\` without a template.`, @@ -146,23 +164,16 @@ class RootState { this.result = undefined; this.destroyed = false; - this.render = errorLoopTransaction(() => { - let layout = unwrapTemplate(template).asLayout(); - - let iterator = renderMain( - runtime, - context, - owner, - self, - builder(runtime.env, { element: parentElement, nextSibling: null }), - layout, - dynamicScope - ); - - let result = (this.result = iterator.sync()); + // console.log(layout); - // override .render function after initial render - this.render = errorLoopTransaction(() => result.rerender({ alwaysRevalidate: false })); + this.render = errorLoopTransaction(() => { + let layout = unwrapTemplate(template).asLayout().compile(); + const layoutInstance = new layout(this); + // @ts-expect-error fine + this.result = renderComponent(layoutInstance, parentElement, owner); + this.render = errorLoopTransaction(() => { + // fine + }); }); } @@ -195,7 +206,11 @@ class RootState { */ - inTransaction(env, () => destroy(result!)); + inTransaction(env, () => { + // @ts-expect-error foo-bar + runDestructors(result.ctx); + destroy(result!); + }); } } } @@ -370,6 +385,7 @@ export class Renderer { // renderer HOOKS appendOutletView(view: OutletView, target: SimpleElement): void { + console.log('appendOutletView', view, target); let definition = createRootOutlet(view); this._appendDefinition( view, diff --git a/packages/@ember/-internals/glimmer/lib/templates/empty.ts b/packages/@ember/-internals/glimmer/lib/templates/empty.ts index f5665d5f8b0..38d472ce04e 100644 --- a/packages/@ember/-internals/glimmer/lib/templates/empty.ts +++ b/packages/@ember/-internals/glimmer/lib/templates/empty.ts @@ -1,5 +1,4 @@ -import { precompileTemplate } from '@ember/template-compilation'; -export default precompileTemplate('', { - moduleName: 'packages/@ember/-internals/glimmer/lib/templates/empty.hbs', - strictMode: true, -}); +import { hbs } from '@lifeart/gxt'; +export default function emptyTemplate() { + return hbs``; +}; diff --git a/packages/@ember/-internals/glimmer/lib/templates/input.ts b/packages/@ember/-internals/glimmer/lib/templates/input.ts index 295bb8d2a69..31058629491 100644 --- a/packages/@ember/-internals/glimmer/lib/templates/input.ts +++ b/packages/@ember/-internals/glimmer/lib/templates/input.ts @@ -1,7 +1,6 @@ -import { precompileTemplate } from '@ember/template-compilation'; -import { on } from '@ember/modifier'; -export default precompileTemplate( - ``, - { - moduleName: 'packages/@ember/-internals/glimmer/lib/templates/input.hbs', - strictMode: true, - scope() { - return { on }; - }, - } -); +/>`; +} diff --git a/packages/@ember/-internals/glimmer/lib/templates/link-to.ts b/packages/@ember/-internals/glimmer/lib/templates/link-to.ts index 811ef33d63b..f34d6ad862a 100644 --- a/packages/@ember/-internals/glimmer/lib/templates/link-to.ts +++ b/packages/@ember/-internals/glimmer/lib/templates/link-to.ts @@ -1,30 +1,21 @@ -import { precompileTemplate } from '@ember/template-compilation'; -import { on } from '@ember/modifier'; +import { hbs } from '@lifeart/gxt'; -export default precompileTemplate( - `{{yield}}`, - { - moduleName: 'packages/@ember/-internals/glimmer/lib/templates/link-to.hbs', - strictMode: true, - scope() { - return { on }; - }, - } -); + {{on 'click' this.click}} >{{yield}}`; +} diff --git a/packages/@ember/-internals/glimmer/lib/templates/outlet-helper-component.gts b/packages/@ember/-internals/glimmer/lib/templates/outlet-helper-component.gts new file mode 100644 index 00000000000..70bad9c775f --- /dev/null +++ b/packages/@ember/-internals/glimmer/lib/templates/outlet-helper-component.gts @@ -0,0 +1,64 @@ +import { Component } from '@lifeart/gxt'; + +interface State { + outlets: { + main: State | undefined, + }, + render: { + template(): () => unknown, + controller: unknown, + name: string, + } +} + +export default class OutletHelper extends Component { + get state() { + return this.args.state().outlets.main || this.args.state(); + } + get nextState() { + return () => { + return this.hasNext; + } + } + get hasNext() { + return this.state.outlets.main; + } + get canRender() { + return !!this?.state?.render; + } + get MyComponent() { + + const state = this.state; + const render = state.render; + const tpl = render.template(); + const args = { + get model() { + return render.model; + } + } + if (tpl.instance) { + return tpl.instance.template; + } + render.controller['args'] = args; + const tplComponentInstance = new tpl(args); + tplComponentInstance.template = tplComponentInstance.template.bind(render.controller); + // we need to provide stable refs here to avoid re-renders + tpl.instance = tplComponentInstance; + return tplComponentInstance.template; + } + get model() { + const state = this.state; + const render = state.render; + return render.model; + } + +} diff --git a/packages/@ember/-internals/glimmer/lib/templates/outlet.ts b/packages/@ember/-internals/glimmer/lib/templates/outlet.ts index 803be28628f..bd96fc3fc94 100644 --- a/packages/@ember/-internals/glimmer/lib/templates/outlet.ts +++ b/packages/@ember/-internals/glimmer/lib/templates/outlet.ts @@ -1,10 +1,15 @@ import { precompileTemplate } from '@ember/template-compilation'; +import { hbs } from '@lifeart/gxt'; import { outletHelper } from '../syntax/outlet'; +import Outlet from './outlet-helper-component'; -export default precompileTemplate(`{{component (outletHelper)}}`, { - moduleName: 'packages/@ember/-internals/glimmer/lib/templates/outlet.hbs', - strictMode: true, - scope() { - return { outletHelper }; - }, -}); +export default (owner) => { + console.log('outlet factory', owner); + + return function(args) { + console.log('outlet', this, owner, ...arguments); + return hbs`{{#let (component Outlet state=(args.state)) as |Outlet|}} +
[main outlet template]
+ {{/let}}`; + } +} diff --git a/packages/@ember/-internals/glimmer/lib/templates/root.ts b/packages/@ember/-internals/glimmer/lib/templates/root.ts index bb4736d9214..e7981edcdc4 100644 --- a/packages/@ember/-internals/glimmer/lib/templates/root.ts +++ b/packages/@ember/-internals/glimmer/lib/templates/root.ts @@ -1,5 +1,22 @@ -import { precompileTemplate } from '@ember/template-compilation'; -export default precompileTemplate(`{{component this}}`, { - moduleName: 'packages/@ember/-internals/glimmer/lib/templates/root.hbs', - strictMode: true, -}); +import { hbs, $_fin } from '@lifeart/gxt'; +export default function(owner) { + console.log('root-template init', owner); + return function(rootState) { + // console.log('root-template - render', [this], [...arguments]); + // temp1.root.template + // console.log(...arguments); + // return function() { + // console.log(...arguments); + // return $_fin([...rootState.root.template()], this); + // } + // debugger; + const state = rootState.root.ref; + console.log('rootState', state); + return hbs` + {{log 'root-template-create' this rootState}} + {{#let (component rootState.root.template state=state root=true) as |Layout|}} + + {{/let}} + `; + } +} diff --git a/packages/@ember/-internals/glimmer/lib/templates/textarea.ts b/packages/@ember/-internals/glimmer/lib/templates/textarea.ts index 1b4bdfc2d9b..b51ccb74dfb 100644 --- a/packages/@ember/-internals/glimmer/lib/templates/textarea.ts +++ b/packages/@ember/-internals/glimmer/lib/templates/textarea.ts @@ -1,8 +1,7 @@ -import { precompileTemplate } from '@ember/template-compilation'; -import { on } from '@ember/modifier'; +import { hbs } from '@lifeart/gxt'; -export default precompileTemplate( - `