Function getDomRefs

packages/core/src/generators/angular/helpers/get-refs.ts:9–55

({
  json,
  options,
  withAttributePassing,
  rootRef,
}: {
  json: MitosisComponent;
  options: ToAngularOptions;
  withAttributePassing?: boolean;
  rootRef: string;
})

import { isAssignmentExpression } from '@babel/types';

export const getDomRefs = ({
  json,
  options,
  withAttributePassing,
  rootRef,
}: {
  json: MitosisComponent;
  options: ToAngularOptions;
  withAttributePassing?: boolean;
  rootRef: string;
}): Set<string> => {
  const domRefs = getRefs(json);

  const nativeElement = options.api === 'signals' ? `()?.nativeElement` : '?.nativeElement';

  if (withAttributePassing) {
    if (!domRefs.has(rootRef)) {
      domRefs.add(rootRef);
    }

    addCodeNgAfterViewInit(
      json,
      `
            const element: HTMLElement | null = this.${rootRef}${nativeElement};
            this.enableAttributePassing(element, "${dashCase(json.name)}");
            `,
    );
  }

  mapRefs(json, (refName, extra) => {
    const isDomRef = domRefs.has(refName);
    let additional = nativeElement;
    if (extra?.type === 'bindings' && options.api === 'signals') {
      // we don't need nativeElement and this. for bindings in signals
      return refName;
    } else if (extra?.type === 'hooks-deps-array' && options.api === 'signals') {
      // we don't need nativeElement for deps-array in hooks
      additional = '()';
    } else if (extra?.path.parentPath && isAssignmentExpression(extra?.path.parentPath.container)) {
      // we cannot use conditionals for assignments, it has to be checked before
      additional = options.api === 'signals' ? `()!.nativeElement` : '!.nativeElement';
    }
    return `this.${isDomRef ? '' : '_'}${refName}${isDomRef ? additional : ''}`;
  });

  return domRefs;
};