Merge pull request #25 from Microsoft/misc-cleanup

Misc cleanup

Author: bengry

libs/core/src/lib/components/wrapper-component.ts

@@ -94,10 +94,11 @@ export abstract class ReactWrapperComponent<TProps extends {}> implements AfterV
   /**
    * Creates an instance of ReactWrapperComponent.
    * @param elementRef The host element.
-   * @param setHostDisplay Whether the host's `display` should be set to the root child node's `display`. defaults to `false`
+   * @param changeDetectorRef The change detector for the component.
+   * @param renderer The Angular renderer.
    */
   constructor(
-    public readonly elementRef: ElementRef,
+    public readonly elementRef: ElementRef<HTMLElement>,
     private readonly changeDetectorRef: ChangeDetectorRef,
     private readonly renderer: Renderer2,
     private readonly setHostDisplay: boolean = false
@@ -127,13 +128,14 @@ export abstract class ReactWrapperComponent<TProps extends {}> implements AfterV
   ngOnChanges(changes: SimpleChanges) {
     this._passAttributesAsProps();
 
-    this.detectChanges();
+    this.markForCheck();
   }
 
   /**
-   * Trigger change detection on the component.
+   * Mark the component as one that needed re-rendering on the React side,
+   * and mark for change detection on the Angular side.
    */
-  protected detectChanges() {
+  protected markForCheck() {
     if (isReactNode(this.reactNodeRef.nativeElement)) {
       this.reactNodeRef.nativeElement.setRenderPending();
     }

…/core/src/lib/declarations/known-keys.ts …ore/src/lib/declarations/known-keys.d.tslibs/core/src/lib/declarations/known-keys.ts renamed to libs/core/src/lib/declarations/known-keys.d.ts libs/core/src/lib/declarations/known-keys.ts renamed to libs/core/src/lib/declarations/known-keys.d.ts

@@ -4,4 +4,4 @@
 export * from './index-signature';
 export * from './known-keys';
 export * from './omit';
-export * from './StringMap';
+export * from './string-map';

libs/core/src/lib/declarations/public-api.d.ts

@@ -3,7 +3,6 @@
 
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
-import { Omit } from '../declarations/omit';
 import * as dom from '../utils/dom';
 
 const DEBUG = false;
@@ -12,14 +11,7 @@ export const CHILDREN_TO_APPEND_PROP = 'children-to-append';
 /**
  * Props that can be passed to `ReactContent` from users.
  */
-export type ReactContentProps = Omit<AllReactContentProps, typeof CHILDREN_TO_APPEND_PROP>;
-
-/**
- * @internal
- */
-export interface AllReactContentProps {
-  readonly [CHILDREN_TO_APPEND_PROP]: HTMLElement[];
-
+export interface ReactContentProps {
   /**
    * Experimental rendering mode.
    * Uses a similar approach to `router-outlet`, where the child elements are added to the parent, instead of this node, and this is hidden.
@@ -28,14 +20,34 @@ export interface AllReactContentProps {
   legacyRenderMode?: boolean;
 }
 
+/**
+ * Creates a new `ReactContent` element.
+ * @param children The children to append to the `ReactContent` element.
+ * @param additionalProps _Optional_. @see `ReactContentProps`
+ * @returns
+ */
+export function createReactContentElement(children: ReadonlyArray<HTMLElement>, additionalProps?: ReactContentProps) {
+  return React.createElement(ReactContent, {
+    ...additionalProps,
+    [CHILDREN_TO_APPEND_PROP]: children,
+  });
+}
+
+/**
+ * @internal
+ */
+export interface InternalReactContentProps extends ReactContentProps {
+  readonly [CHILDREN_TO_APPEND_PROP]: ReadonlyArray<HTMLElement>;
+}
+
 /**
  * Render any `HTMLElement`s (including Angular components) as a child of React components.
  * Supports two rendering modes:
  *  1. `legacy` - append `<react-content>` as the root, and nest the `children-to-append` underneath it.
  *  2. `new` (**default**) - append the `children-to-append` to the parent of this component, and hide the `<react-content>` element.
  *     (similar to how `router-outlet` behaves in Angular).
  */
-export class ReactContent extends React.PureComponent<AllReactContentProps> {
+export class ReactContent extends React.PureComponent<InternalReactContentProps> {
   componentDidMount() {
     const element = ReactDOM.findDOMNode(this);
     if (this.props[CHILDREN_TO_APPEND_PROP]) {