use reflow to migrate from flow to typescript

scm-ui/ui-extensions/src/ExtensionPoint.tsx

@@ -0,0 +1,53 @@
+import * as React from 'react';
+import binder from './binder';
+
+type Props = {
+  name: string;
+  renderAll?: boolean;
+  props?: object;
+  children?: React.Node;
+};
+
+/**
+ * ExtensionPoint renders components which are bound to an extension point.
+ */
+class ExtensionPoint extends React.Component<Props> {
+  renderAll(name: string, props?: object) {
+    const extensions = binder.getExtensions(name, props);
+    return (
+      <>
+        {extensions.map((Component, index) => {
+          return <Component key={index} {...props} />;
+        })}
+      </>
+    );
+  }
+
+  renderSingle(name: string, props?: object) {
+    const Component = binder.getExtension(name, props);
+    if (!Component) {
+      return null;
+    }
+    return <Component {...props} />;
+  }
+
+  renderDefault() {
+    const { children } = this.props;
+    if (children) {
+      return <>{children}</>;
+    }
+    return null;
+  }
+
+  render() {
+    const { name, renderAll, props } = this.props;
+    if (!binder.hasExtension(name, props)) {
+      return this.renderDefault();
+    } else if (renderAll) {
+      return this.renderAll(name, props);
+    }
+    return this.renderSingle(name, props);
+  }
+}
+
+export default ExtensionPoint;