Generate React output target on build (#84)

manifoldco · Apr 9, 2020 · 4db1dd8 · 4db1dd8
1 parent ad20dd4
commit 4db1dd8
Show file tree

Hide file tree

Showing 5 changed files with 79 additions and 64 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -51,6 +51,7 @@
   "devDependencies": {
     "@manifoldco/eslint-plugin-stencil": "^0.4.1",
     "@stencil/core": "^1.8.4",
+    "@stencil/react-output-target": "0.0.4",
     "@types/jest": "24.0.25",
     "@types/node": "^13.7.0",
     "@types/puppeteer": "1.20.3",

diff --git a/src/components.d.ts b/src/components.d.ts
@@ -4,71 +4,63 @@
  * This is an autogenerated file created by the Stencil compiler.
  * It contains typing information for all components that exist in this project.
  */
-
-
-import { HTMLStencilElement, JSXBase } from '@stencil/core/internal';
-import {
-  Connection,
-} from './components/manifold-init/manifold-init';
-
+import { HTMLStencilElement, JSXBase } from "@stencil/core/internal";
+import { Connection, } from "./components/manifold-init/manifold-init";
 export namespace Components {
-  interface ConnectedButton {}
-  interface ManifoldInit {
-    'authToken'?: string;
-    'authType'?: 'manual' | 'oauth';
-    'clientId'?: string;
-    'env'?: 'local' | 'stage' | 'prod';
-    'initialize': (options: { element: HTMLElement; componentVersion: string; version: number; }) => Promise<Connection>;
-  }
+    interface ConnectedButton {
+    }
+    interface ManifoldInit {
+        "authToken"?: string;
+        "authType"?: "manual" | "oauth";
+        "clientId"?: string;
+        "env"?: "local" | "stage" | "prod";
+        "initialize": (options: {
+            element: HTMLElement;
+            componentVersion: string;
+            version: number;
+        }) => Promise<Connection>;
+    }
 }
-
 declare global {
-
-
-  interface HTMLConnectedButtonElement extends Components.ConnectedButton, HTMLStencilElement {}
-  var HTMLConnectedButtonElement: {
-    prototype: HTMLConnectedButtonElement;
-    new (): HTMLConnectedButtonElement;
-  };
-
-  interface HTMLManifoldInitElement extends Components.ManifoldInit, HTMLStencilElement {}
-  var HTMLManifoldInitElement: {
-    prototype: HTMLManifoldInitElement;
-    new (): HTMLManifoldInitElement;
-  };
-  interface HTMLElementTagNameMap {
-    'connected-button': HTMLConnectedButtonElement;
-    'manifold-init': HTMLManifoldInitElement;
-  }
+    interface HTMLConnectedButtonElement extends Components.ConnectedButton, HTMLStencilElement {
+    }
+    var HTMLConnectedButtonElement: {
+        prototype: HTMLConnectedButtonElement;
+        new (): HTMLConnectedButtonElement;
+    };
+    interface HTMLManifoldInitElement extends Components.ManifoldInit, HTMLStencilElement {
+    }
+    var HTMLManifoldInitElement: {
+        prototype: HTMLManifoldInitElement;
+        new (): HTMLManifoldInitElement;
+    };
+    interface HTMLElementTagNameMap {
+        "connected-button": HTMLConnectedButtonElement;
+        "manifold-init": HTMLManifoldInitElement;
+    }
 }
-
 declare namespace LocalJSX {
-  interface ConnectedButton {}
-  interface ManifoldInit {
-    'authToken'?: string;
-    'authType'?: 'manual' | 'oauth';
-    'clientId'?: string;
-    'env'?: 'local' | 'stage' | 'prod';
-    'onManifold-auth-token-clear'?: (event: CustomEvent<any>) => void;
-    'onManifold-auth-token-receive'?: (event: CustomEvent<string>) => void;
-  }
-
-  interface IntrinsicElements {
-    'connected-button': ConnectedButton;
-    'manifold-init': ManifoldInit;
-  }
+    interface ConnectedButton {
+    }
+    interface ManifoldInit {
+        "authToken"?: string;
+        "authType"?: "manual" | "oauth";
+        "clientId"?: string;
+        "env"?: "local" | "stage" | "prod";
+        "onManifold-auth-token-clear"?: (event: CustomEvent<any>) => void;
+        "onManifold-auth-token-receive"?: (event: CustomEvent<string>) => void;
+    }
+    interface IntrinsicElements {
+        "connected-button": ConnectedButton;
+        "manifold-init": ManifoldInit;
+    }
 }
-
 export { LocalJSX as JSX };
-
-
 declare module "@stencil/core" {
-  export namespace JSX {
-    interface IntrinsicElements {
-      'connected-button': LocalJSX.ConnectedButton & JSXBase.HTMLAttributes<HTMLConnectedButtonElement>;
-      'manifold-init': LocalJSX.ManifoldInit & JSXBase.HTMLAttributes<HTMLManifoldInitElement>;
+    export namespace JSX {
+        interface IntrinsicElements {
+            "connected-button": LocalJSX.ConnectedButton & JSXBase.HTMLAttributes<HTMLConnectedButtonElement>;
+            "manifold-init": LocalJSX.ManifoldInit & JSXBase.HTMLAttributes<HTMLManifoldInitElement>;
+        }
     }
-  }
 }
-
-
diff --git a/src/components/manifold-init/readme.md b/src/components/manifold-init/readme.md
@@ -7,12 +7,20 @@
 
 ## Properties
 
-| Property    | Attribute    | Description | Type                  | Default     |
-| ----------- | ------------ | ----------- | --------------------- | ----------- |
-| `authToken` | `auth-token` |             | `string`              | `undefined` |
-| `authType`  | `auth-type`  |             | `"manual" \| "oauth"` | `'oauth'`   |
-| `clientId`  | `client-id`  |             | `string`              | `undefined` |
-| `env`       | `env`        |             | `"prod" \| "stage"`   | `'prod'`    |
+| Property    | Attribute    | Description | Type                           | Default     |
+| ----------- | ------------ | ----------- | ------------------------------ | ----------- |
+| `authToken` | `auth-token` |             | `string`                       | `undefined` |
+| `authType`  | `auth-type`  |             | `"manual" \| "oauth"`          | `'oauth'`   |
+| `clientId`  | `client-id`  |             | `string`                       | `undefined` |
+| `env`       | `env`        |             | `"local" \| "prod" \| "stage"` | `'prod'`    |
+
+
+## Events
+
+| Event                         | Description | Type                  |
+| ----------------------------- | ----------- | --------------------- |
+| `manifold-auth-token-clear`   |             | `CustomEvent<any>`    |
+| `manifold-auth-token-receive` |             | `CustomEvent<string>` |
 
 
 ## Methods

diff --git a/stencil.config.ts b/stencil.config.ts
@@ -1,12 +1,20 @@
 import fs from 'fs';
 import replace from 'rollup-plugin-replace';
 import { Config } from '@stencil/core';
+import { reactOutputTarget } from '@stencil/react-output-target';
 
 const pkgManifest = JSON.parse(fs.readFileSync('package.json', 'utf8'));
 
 export const config: Config = {
   namespace: 'manifold-init',
   outputTargets: [
+    reactOutputTarget({
+      componentCorePackage: '@manifoldco/manifold-init',
+      proxiesFile: 'dist/react/components.ts',
+    }),
+    {
+      type: 'dist',
+    },
     {
       type: 'dist',
       esmLoaderPath: '../loader',