refactor(core): rename ngDirectiveDef to ɵdir (#33110)

Directive defs are not considered public API, so the property
that contains them should be prefixed with Angular's marker
for "private" ('ɵ') to discourage apps from relying on def
APIs directly.

This commit adds the prefix and shortens the name from
ngDirectiveDef to dir. This is because property names
cannot be minified by Uglify without turning on property
mangling (which most apps have turned off) and are thus
size-sensitive.

Note that the other "defs" (ngFactoryDef, etc) will be
prefixed and shortened in follow-up PRs, in an attempt to
limit how large and conflict-y this change is.

PR Close #33110

packages/core/src/core_render3_private_export.ts

@@ -222,7 +222,7 @@ export {
 export {
   NG_ELEMENT_ID as ɵNG_ELEMENT_ID,
   NG_COMP_DEF as ɵNG_COMP_DEF,
-  NG_DIRECTIVE_DEF as ɵNG_DIRECTIVE_DEF,
+  NG_DIR_DEF as ɵNG_DIR_DEF,
   NG_PIPE_DEF as ɵNG_PIPE_DEF,
   NG_MODULE_DEF as ɵNG_MODULE_DEF,
   NG_BASE_DEF as ɵNG_BASE_DEF

packages/core/src/render3/STORING_METADATA_IN_D.TS.md

@@ -13,7 +13,7 @@ Here is an abbreviated example of breakage of tree-shake-ability.
 })
 export class TooltipDirective {
   // ngtsc generates this:
-  static ngDirectiveDef = ɵɵdefineDirective(...);
+  static ɵdir = ɵɵdefineDirective(...);
 }
 
 @Component({
@@ -22,7 +22,7 @@ export class TooltipDirective {
 })
 class MyAppComponent {
   // ngtsc generates this:
-  static ngDirectiveDef = ɵɵdefineComponent({
+  static ɵdir = ɵɵdefineComponent({
     ...
     directives: [
       // BREAKS TREE-SHAKING!!!
@@ -41,7 +41,7 @@ class MyAppComponent {
 })
 class MyAppModule {
     // ngtsc generates this:
-  static ngDirectiveDef = ɵɵdefineNgModule(...);
+  static ɵdir = ɵɵdefineNgModule(...);
 }
 ```
 
@@ -52,6 +52,6 @@ We store the information in the `.d.ts` file like so.
 
 ```typescript
 class TooltipDirective {
-  static ngDirectiveDef: DirectiveDefWithMeta<TooltipDirective, '[tooltip]', '', {}, {}, []>
+  static ɵdir: DirectiveDefWithMeta<TooltipDirective, '[tooltip]', '', {}, {}, []>
 }
 ```

packages/core/src/render3/VIEW_DATA.md

@@ -172,7 +172,7 @@ class Child {
 })
 class Tooltip {
   @HostBinding('title') hostTitle = 'greeting';
-  static ngDirectiveDef = ɵɵdefineDirective({
+  static ɵdir = ɵɵdefineDirective({
     ...
     hostVars: 1
   });
@@ -206,8 +206,8 @@ The `EXPANDO` section needs additional information for information stored in `TV
 | 1     | 2                                   | Injector size. Number of values to skip to get to Host Bindings.
 | 2     | Child.ɵcmp.hostBindings   | The function to call. (Only when `hostVars` is not `0`)
 | 3     | Child.ɵcmp.hostVars       | Number of host bindings to process. (Only when `hostVars` is not `0`)
-| 4     | Tooltip.ngDirectiveDef.hostBindings | The function to call. (Only when `hostVars` is not `0`)
-| 5     | Tooltip.ngDirectiveDef.hostVars     | Number of host bindings to process. (Only when `hostVars` is not `0`)
+| 4     | Tooltip.ɵdir.hostBindings | The function to call. (Only when `hostVars` is not `0`)
+| 5     | Tooltip.ɵdir.hostVars     | Number of host bindings to process. (Only when `hostVars` is not `0`)
 
 The reason for this layout is to make the host binding update efficient using this pseudo code:
 ```typescript
@@ -245,9 +245,9 @@ The above code should execute as:
 | `Child.ɵcmp.hostBindings`   | invoke with =>     | `\* new Child() *\ 19`    | `\* <child> *\ 10`
 |                                       | `21`               | `\* new Tooltip() *\ 20`  | `\* <child> *\ 10`
 | `Child.ɵcmp.hostVars`       | `22`               | `\* new Tooltip() *\ 20`  | `\* <child> *\ 10`
-| `Tooltip.ngDirectiveDef.hostBindings` | invoke with =>     | `\* new Tooltip() *\ 20`  | `\* <child> *\ 10`
+| `Tooltip.ɵdir.hostBindings` | invoke with =>     | `\* new Tooltip() *\ 20`  | `\* <child> *\ 10`
 |                                       | `22`               | `21`                      | `\* <child> *\ 10`
-| `Tooltip.ngDirectiveDef.hostVars`     | `22`               | `21`                      | `\* <child> *\ 10`
+| `Tooltip.ɵdir.hostVars`     | `22`               | `21`                      | `\* <child> *\ 10`
 
 ## `EXPANDO` and Injection
 

packages/core/src/render3/context_discovery.ts

@@ -182,7 +182,7 @@ export function isComponentInstance(instance: any): boolean {
 }
 
 export function isDirectiveInstance(instance: any): boolean {
-  return instance && instance.constructor && instance.constructor.ngDirectiveDef;
+  return instance && instance.constructor && instance.constructor.ɵdir;
 }
 
 /**

packages/core/src/render3/definition.ts

@@ -16,7 +16,7 @@ import {initNgDevMode} from '../util/ng_dev_mode';
 import {stringify} from '../util/stringify';
 
 import {EMPTY_ARRAY, EMPTY_OBJ} from './empty';
-import {NG_BASE_DEF, NG_COMP_DEF, NG_DIRECTIVE_DEF, NG_FACTORY_DEF, NG_LOCALE_ID_DEF, NG_MODULE_DEF, NG_PIPE_DEF} from './fields';
+import {NG_BASE_DEF, NG_COMP_DEF, NG_DIR_DEF, NG_FACTORY_DEF, NG_LOCALE_ID_DEF, NG_MODULE_DEF, NG_PIPE_DEF} from './fields';
 import {ComponentDef, ComponentDefFeature, ComponentTemplate, ComponentType, ContentQueriesFunction, DirectiveDef, DirectiveDefFeature, DirectiveType, DirectiveTypesOrFactory, FactoryFn, HostBindingsFunction, PipeDef, PipeType, PipeTypesOrFactory, ViewQueriesFunction, ɵɵBaseDef} from './interfaces/definition';
 import {TAttributes} from './interfaces/node';
 // while SelectorFlags is unused here, it's required so that types don't get resolved lazily
@@ -593,7 +593,7 @@ export function ɵɵdefineBase<T>(baseDefinition: {
  * class MyDirective {
  *   // Generated by Angular Template Compiler
  *   // [Symbol] syntax will not be supported by TypeScript until v2.7
- *   static ngDirectiveDef = ɵɵdefineDirective({
+ *   static ɵdir = ɵɵdefineDirective({
  *     ...
  *   });
  * }
@@ -744,7 +744,7 @@ export function getComponentDef<T>(type: any): ComponentDef<T>|null {
 }
 
 export function getDirectiveDef<T>(type: any): DirectiveDef<T>|null {
-  return type[NG_DIRECTIVE_DEF] || null;
+  return type[NG_DIR_DEF] || null;
 }
 
 export function getPipeDef<T>(type: any): PipeDef<T>|null {

packages/core/src/render3/features/inherit_definition_feature.ts

@@ -15,7 +15,7 @@ import {isComponentDef} from '../interfaces/type_checks';
 import {ɵɵNgOnChangesFeature} from './ng_onchanges_feature';
 
 function getSuperType(type: Type<any>): Type<any>&
-    {ɵcmp?: ComponentDef<any>, ngDirectiveDef?: DirectiveDef<any>} {
+    {ɵcmp?: ComponentDef<any>, ɵdir?: DirectiveDef<any>} {
   return Object.getPrototypeOf(type.prototype).constructor;
 }
 
@@ -32,13 +32,13 @@ export function ɵɵInheritDefinitionFeature(definition: DirectiveDef<any>| Comp
     let superDef: DirectiveDef<any>|ComponentDef<any>|undefined = undefined;
     if (isComponentDef(definition)) {
       // Don't use getComponentDef/getDirectiveDef. This logic relies on inheritance.
-      superDef = superType.ɵcmp || superType.ngDirectiveDef;
+      superDef = superType.ɵcmp || superType.ɵdir;
     } else {
       if (superType.ɵcmp) {
         throw new Error('Directives cannot inherit Components');
       }
       // Don't use getComponentDef/getDirectiveDef. This logic relies on inheritance.
-      superDef = superType.ngDirectiveDef;
+      superDef = superType.ɵdir;
     }
 
     const baseDef = (superType as any).ngBaseDef;

packages/core/src/render3/fields.ts

@@ -9,7 +9,7 @@
 import {getClosureSafeProperty} from '../util/property';
 
 export const NG_COMP_DEF = getClosureSafeProperty({ɵcmp: getClosureSafeProperty});
-export const NG_DIRECTIVE_DEF = getClosureSafeProperty({ngDirectiveDef: getClosureSafeProperty});
+export const NG_DIR_DEF = getClosureSafeProperty({ɵdir: getClosureSafeProperty});
 export const NG_PIPE_DEF = getClosureSafeProperty({ngPipeDef: getClosureSafeProperty});
 export const NG_MODULE_DEF = getClosureSafeProperty({ngModuleDef: getClosureSafeProperty});
 export const NG_LOCALE_ID_DEF = getClosureSafeProperty({ngLocaleIdDef: getClosureSafeProperty});

packages/core/src/render3/instructions/di.ts

@@ -24,7 +24,7 @@ import {getLView, getPreviousOrParentTNode} from '../state';
  * class SomeDirective {
  *   constructor(directive: DirectiveA) {}
  *
- *   static ngDirectiveDef = ɵɵdefineDirective({
+ *   static ɵdir = ɵɵdefineDirective({
  *     type: SomeDirective,
  *     factory: () => new SomeDirective(ɵɵdirectiveInject(DirectiveA))
  *   });

packages/core/src/render3/interfaces/definition.ts

@@ -75,11 +75,11 @@ export const enum RenderFlags {
 export interface ComponentType<T> extends Type<T> { ɵcmp: never; }
 
 /**
- * A subclass of `Type` which has a static `ngDirectiveDef`:`DirectiveDef` field making it
+ * A subclass of `Type` which has a static `ɵdir`:`DirectiveDef` field making it
  * consumable for rendering.
  */
 export interface DirectiveType<T> extends Type<T> {
-  ngDirectiveDef: never;
+  ɵdir: never;
   ngFactoryDef: () => T;
 }
 

packages/core/src/render3/jit/directive.ts

@@ -18,7 +18,7 @@ import {ViewEncapsulation} from '../../metadata/view';
 import {initNgDevMode} from '../../util/ng_dev_mode';
 import {getBaseDef, getComponentDef, getDirectiveDef} from '../definition';
 import {EMPTY_ARRAY, EMPTY_OBJ} from '../empty';
-import {NG_BASE_DEF, NG_COMP_DEF, NG_DIRECTIVE_DEF, NG_FACTORY_DEF} from '../fields';
+import {NG_BASE_DEF, NG_COMP_DEF, NG_DIR_DEF, NG_FACTORY_DEF} from '../fields';
 import {ComponentType} from '../interfaces/definition';
 import {stringifyForError} from '../util/misc_utils';
 
@@ -119,7 +119,7 @@ function hasSelectorScope<T>(component: Type<T>): component is Type<T>&
 
 /**
  * Compile an Angular directive according to its decorator metadata, and patch the resulting
- * ngDirectiveDef onto the component type.
+ * directive def onto the component type.
  *
  * In the event that compilation is not immediate, `compileDirective` will return a `Promise` which
  * will resolve when compilation completes and the directive becomes usable.
@@ -129,7 +129,7 @@ export function compileDirective(type: Type<any>, directive: Directive | null):
 
   addDirectiveFactoryDef(type, directive || {});
 
-  Object.defineProperty(type, NG_DIRECTIVE_DEF, {
+  Object.defineProperty(type, NG_DIR_DEF, {
     get: () => {
       if (ngDirectiveDef === null) {
         // `directive` can be null in the case of abstract directives as a base class
@@ -148,7 +148,7 @@ export function compileDirective(type: Type<any>, directive: Directive | null):
 
 function getDirectiveMetadata(type: Type<any>, metadata: Directive) {
   const name = type && type.name;
-  const sourceMapUrl = `ng:///${name}/ngDirectiveDef.js`;
+  const sourceMapUrl = `ng:///${name}/ɵdir.js`;
   const compiler = getCompilerFacade();
   const facade = directiveMetadata(type as ComponentType<any>, metadata);
   facade.typeSourceSpan = compiler.createParseSourceSpan('Directive', name, sourceMapUrl);

packages/core/src/render3/jit/module.ts

@@ -16,7 +16,7 @@ import {ModuleWithProviders, NgModule, NgModuleDef, NgModuleTransitiveScopes} fr
 import {deepForEach, flatten} from '../../util/array_utils';
 import {assertDefined} from '../../util/assert';
 import {getComponentDef, getDirectiveDef, getNgModuleDef, getPipeDef} from '../definition';
-import {NG_COMP_DEF, NG_DIRECTIVE_DEF, NG_MODULE_DEF, NG_PIPE_DEF} from '../fields';
+import {NG_COMP_DEF, NG_DIR_DEF, NG_MODULE_DEF, NG_PIPE_DEF} from '../fields';
 import {ComponentDef} from '../interfaces/definition';
 import {NgModuleType} from '../ng_module_ref';
 import {maybeUnwrapFn, stringifyForError} from '../util/misc_utils';
@@ -388,7 +388,7 @@ function setScopeOnDeclaredComponents(moduleType: Type<any>, ngModule: NgModule)
       const componentDef = getComponentDef(component) !;
       patchComponentDefWithScope(componentDef, transitiveScopes);
     } else if (
-        !declaration.hasOwnProperty(NG_DIRECTIVE_DEF) && !declaration.hasOwnProperty(NG_PIPE_DEF)) {
+        !declaration.hasOwnProperty(NG_DIR_DEF) && !declaration.hasOwnProperty(NG_PIPE_DEF)) {
       // Set `ngSelectorScope` for future reference when the component compilation finishes.
       (declaration as Type<any>& {ngSelectorScope?: any}).ngSelectorScope = moduleType;
     }
@@ -455,7 +455,7 @@ export function transitiveScopesFor<T>(
     if (getPipeDef(declaredWithDefs)) {
       scopes.compilation.pipes.add(declared);
     } else {
-      // Either declared has a ɵcmp or ngDirectiveDef, or it's a component which hasn't
+      // Either declared has a ɵcmp or ɵdir, or it's a component which hasn't
       // had its template compiled yet. In either case, it gets added to the compilation's
       // directives.
       scopes.compilation.directives.add(declared);
@@ -487,7 +487,7 @@ export function transitiveScopesFor<T>(
     const exportedType = exported as Type<E>& {
       // Components, Directives, NgModules, and Pipes can all be exported.
       ɵcmp?: any;
-      ngDirectiveDef?: any;
+      ɵdir?: any;
       ngModuleDef?: NgModuleDef<E>;
       ngPipeDef?: any;
     };