How to use @glimmer/reference - 10 common examples

init() {
      this._super(...arguments);
      this[IS_DISPATCHING_ATTRS] = false;
      this[DIRTY_TAG] = createTag();
      this[BOUNDS] = null;

      if (DEBUG && this.renderer._destinedForDOM && this.tagName === '') {
        let eventNames = [];
        let eventDispatcher = getOwner(this).lookup('event_dispatcher:main');
        let events = (eventDispatcher && eventDispatcher._finalEvents) || {};

        // tslint:disable-next-line:forin
        for (let key in events) {
          let methodName = events[key];

          if (typeof this[methodName] === 'function') {
            eventNames.push(methodName);
          }
        }
        // If in a tagless component, assert that no event handlers are defined

// currently rendering roots, a new root was added and will
      // be processed by the existing _renderRoots invocation
      return;
    }

    // used to prevent calling _renderRoots again (see above)
    // while we are actively rendering roots
    this._isRenderingRoots = true;

    let completedWithoutError = false;
    try {
      this._renderRoots();
      completedWithoutError = true;
    } finally {
      if (!completedWithoutError) {
        this._lastRevision = CURRENT_TAG.value();
        if (this._env.inTransaction === true) {
          this._env.commit();
        }
      }
      this._isRenderingRoots = false;
    }
  }

// when processing non-initial reflush loops,
        // do not process more roots than needed
        if (i >= initialRootsLength && !shouldReflush) {
          continue;
        }

        root.options.alwaysRevalidate = shouldReflush;
        // track shouldReflush based on this roots render result
        shouldReflush = root.shouldReflush = runInTransaction(root, 'render');

        // globalShouldReflush should be `true` if *any* of
        // the roots need to reflush
        globalShouldReflush = globalShouldReflush || shouldReflush;
      }

      this._lastRevision = CURRENT_TAG.value();

      env.commit();
    } while (globalShouldReflush || roots.length > initialRootsLength);

    // remove any roots that were destroyed during this transaction
    while (removedRoots.length) {
      let root = removedRoots.pop();

      let rootIndex = roots.indexOf(root);
      roots.splice(rootIndex, 1);
    }

    if (this._roots.length === 0) {
      deregister(this);
    }
  }

static _renderComponent(name: string, cursor: Cursor, compilable: number, data: {}): ElementNode {
        let state = State(data);
        const artifact = artifacts(Application.context);
        const runtime = AotRuntime(Application.document as any, artifact, Application.resolver);
        let iterator = renderAot(runtime, compilable, cursor, state);
        // const treeBuilder = NewElementBuilder.forInitialRender(runtime.env, cursor);
        // let iterator = renderAotMain(runtime, state, treeBuilder, compilable);
        try {
            const result = renderSync(runtime.env, iterator);
            console.log(`Component ${name} Rendered`);
            let node = result.firstNode() as any;
            while (!node._nativeView) {
                node = node.nextSibling;
            }
            node.meta.component = new NativeComponentResult(name, result, state, runtime);
            return node as any;
        } catch (error) {
            console.log(`Error rendering component ${name}: ${error}`);

static _renderPage(name, containerElement, nextSibling, compilable, data = {}) {
        let state = State(data);
        const artifact = artifacts(Application.context);
        Application.aotRuntime = AotRuntime(Application.document, artifact, Application.resolver);
        const cursor = { element: containerElement ? containerElement : Application.rootFrame, nextSibling };
        let iterator = renderAot(Application.aotRuntime, compilable, cursor, state);
        try {
            const result = renderSync(Application.aotRuntime.env, iterator);
            console.log(`Page ${name} Rendered`);
            Application.result = result;
            Application._rendered = true;
            let node = result.firstNode();
            while (node && !node._nativeElement) {
                node = node.nextSibling;
            }
            // (node as PageElement).parentNode = containerElement;
            Application.currentPageNode = node;
            Application.currentPageNode.listViewItems = [];

static _renderComponent(name, cursor, compilable, data) {
        let state = State(data);
        const artifact = artifacts(Application.context);
        const runtime = AotRuntime(Application.document, artifact, Application.resolver);
        let iterator = renderAot(runtime, compilable, cursor, state);
        // const treeBuilder = NewElementBuilder.forInitialRender(runtime.env, cursor);
        // let iterator = renderAotMain(runtime, state, treeBuilder, compilable);
        try {
            const result = renderSync(runtime.env, iterator);
            console.log(`Component ${name} Rendered`);
            let node = result.firstNode();
            while (node && !node._nativeElement) {
                node = node.nextSibling;
            }
            const component = new NativeComponentResult(name, result, state, runtime);
            if (!Application.currentPageNode.listViewItems) {
                Application.currentPageNode.listViewItems = [];
            }

// pos[0] is the context (or `this`)
  // pos[1] is the action name or function
  // Anything else is an action argument.
  let [context, action, ...restArgs] = capturedArgs.references;

  // TODO: Is there a better way of doing this?
  let debugKey: string | undefined = (action as any).propertyKey;

  let target = named.has('target') ? named.get('target') : context;
  let processArgs = makeArgsProcessor(named.has('value') && named.get('value'), restArgs);

  let fn: Function;

  if (typeof action[INVOKE] === 'function') {
    fn = makeClosureAction(action, action, action[INVOKE], processArgs, debugKey);
  } else if (isConst(target) && isConst(action)) {
    fn = makeClosureAction(context.value(), target.value(), action.value(), processArgs, debugKey);
  } else {
    fn = makeDynamicClosureAction(context.value(), target, action, processArgs, debugKey);
  }

  fn[ACTION] = true;

  return new UnboundReference(fn);
}

untrack(() => {
          ret = this._getter!.call(obj, keyName);
        });
      }

      if (this._dependentKeys !== undefined) {
        let tag = combine(getChainTagsForKeys(obj, this._dependentKeys));

        upstreamTag = upstreamTag === undefined ? tag : combine([upstreamTag, tag]);
      }

      if (upstreamTag !== undefined) {
        update(propertyTag!, upstreamTag);
      }

      setLastRevisionFor(obj, keyName, tagValue(propertyTag));

      cache.set(keyName, ret);

      finishLazyChains(obj, keyName, ret);
    }

    consume(propertyTag!);

    // Add the tag of the returned value if it is an array, since arrays
    // should always cause updates if they are consumed and then changed
    if (Array.isArray(ret) || isEmberArray(ret)) {
      consume(tagForProperty(ret, '[]'));
    }

    return ret;
  }

get(obj: object, keyName: string): any {
    let ret: any;

    let propertyTag = tagForProperty(obj, keyName) as UpdatableTag;

    // We don't use the tag since CPs are not automatic, we just want to avoid
    // anything tracking while we get the altKey
    untrack(() => {
      ret = get(obj, this.altKey);
    });

    let lastRevision = getLastRevisionFor(obj, keyName);

    if (!validate(propertyTag, lastRevision)) {
      update(propertyTag, combine(getChainTagsForKey(obj, this.altKey)));
      setLastRevisionFor(obj, keyName, value(propertyTag));
      finishLazyChains(obj, keyName, ret);
    }

    consume(propertyTag);

    return ret;
  }

let value;

      // If the field has never been initialized, we should initialize it
      if (hasInitializer && !values.has(this)) {
        value = initializer.call(this);

        values.set(this, value);
      } else {
        value = values.get(this);
      }

      // Add the tag of the returned value if it is an array, since arrays
      // should always cause updates if they are consumed and then changed
      if (Array.isArray(value) || isEmberArray(value)) {
        update(propertyTag, tagForProperty(value, '[]'));
      }

      return value;
    },