@authing/native-js-ui-components 3.0.0-rc.2 → 3.0.0-rc.4

package/package.json

@@ -1,12 +1,11 @@
 {
   "name": "@authing/native-js-ui-components",
-  "version": "3.0.0-rc.2",
-  "framework": "Native",
+  "version": "3.0.0-rc.4",
   "private": false,
   "main": "lib/index.min.js",
   "typings": "lib/index.d.ts",
   "dependencies": {
-    "@authing/react-ui-components": "3.0.0-rc.0",
+    "@authing/react-ui-components": "^3.0.0-rc.4",
     "react": "16.14.0",
     "react-dom": "16.14.0"
   },
@@ -167,5 +166,5 @@
     "webpack-manifest-plugin": "2.2.0",
     "workbox-webpack-plugin": "5.1.4"
   },
-  "gitHead": "38168128397d6ea8bfa26f395532a493596a535d"
+  "gitHead": "6508c48dd4103ec5bd88aad52df3324cb4c93b66"
 }

package/src/App.tsx

@@ -1,13 +1,18 @@
 import React, { useEffect } from "react";
 import "./App.css";
-import { Guard, GuardMode } from "./components";
+import { AuthingGuard, GuardMode } from "./components";
 
 function App() {
   useEffect(() => {
-    const guard = new Guard("6191cf610f772aa56dc70637", {
-      target: ".App",
-      mode: GuardMode.Modal,
-    });
+    const guard = new AuthingGuard(
+      "6191cf610f772aa56dc70637",
+      {
+        target: ".App",
+        appHost: "https://core.dev2.authing-inc.co/",
+        mode: GuardMode.Modal,
+      },
+      "6194a41abf23c1d5268b362a"
+    );
 
     // @ts-ignore
     window.guard = guard;

package/src/components/AuthingGuard/index.tsx

@@ -40,18 +40,11 @@ export {
 };
 
 export type EventListeners = {
-  [key in keyof GuardEventsHandlerKebab]: Exclude<
-    Required<GuardEventsHandlerKebab>[key],
-    undefined
-  >[];
+  [key in keyof GuardEventsHandlerKebab]: Exclude<Required<GuardEventsHandlerKebab>[key], undefined>[];
 };
 
 export class AuthingGuard {
-  constructor(
-    private appId: string,
-    private config?: UserConfig,
-    private tenantId?: string
-  ) {
+  constructor(private appId: string, private config?: UserConfig, private tenantId?: string) {
     this.render();
   }
 
@@ -78,19 +71,14 @@ export class AuthingGuard {
 
   private visible = this.config?.mode === GuardMode.Modal ? false : true;
 
-  private eventListeners = Object.values(GuardEventsCamelToKebabMap).reduce(
-    (acc, evtName) => {
-      return Object.assign({}, acc, {
-        [evtName]: [],
-      });
-    },
-    {} as EventListeners
-  );
+  private eventListeners = Object.values(GuardEventsCamelToKebabMap).reduce((acc, evtName) => {
+    return Object.assign({}, acc, {
+      [evtName]: [],
+    });
+  }, {} as EventListeners);
 
   private render(cb?: () => void) {
-    const evts: GuardEventsHandler = Object.entries(
-      GuardEventsCamelToKebabMap
-    ).reduce((acc, [reactEvt, nativeEvt]) => {
+    const evts: GuardEventsHandler = Object.entries(GuardEventsCamelToKebabMap).reduce((acc, [reactEvt, nativeEvt]) => {
       return Object.assign({}, acc, {
         [reactEvt]: (...rest: any) => {
           if (nativeEvt === "close") {
@@ -123,10 +111,7 @@ export class AuthingGuard {
     );
   }
 
-  on<T extends keyof GuardEventsHandlerKebab>(
-    evt: T,
-    handler: Exclude<GuardEventsHandlerKebab[T], undefined>
-  ) {
+  on<T extends keyof GuardEventsHandlerKebab>(evt: T, handler: Exclude<GuardEventsHandlerKebab[T], undefined>) {
     this.eventListeners[evt]!.push(handler as any);
   }
 

package/src/components/index.ts

@@ -1,8 +1 @@
-// export * from "./Guard";
-import { Guard } from "./Guard";
-import { GuardConfig, GuardLocalConfig } from "@authing/react-ui-components/components";
-export * from "./AuthingGuard";
-
-export { Guard };  
-export type { GuardConfig, GuardLocalConfig };
-
+export * from './AuthingGuard'

package/src/components/Guard/index.tsx

@@ -1,143 +0,0 @@
-import React from "react";
-import ReactDOM from "react-dom";
-import { Guard as ReactAuthingGuard } from "@authing/react-ui-components";
-import {
-  User,
-  GuardMode,
-  GuardScenes,
-  LoginMethods,
-  getAuthClient,
-  CommonMessage,
-  initAuthClient,
-  RegisterMethods,
-  GuardEventsHandler,
-  AuthenticationClient,
-  GuardEventsHandlerKebab,
-  GuardEventsCamelToKebabMap,
-  AuthenticationClientOptions,
-} from "@authing/react-ui-components";
-import "@authing/react-ui-components/lib/index.min.css";
-import {
-  GuardComponentConifg,
-  GuardLocalConfig,
-} from "@authing/react-ui-components/components/Guard/config";
-import { GuardEvents } from "@authing/react-ui-components/components/Guard/event";
-
-export type {
-  User,
-  CommonMessage,
-  GuardEventsHandler,
-  AuthenticationClient,
-  GuardEventsHandlerKebab,
-  AuthenticationClientOptions,
-};
-
-export {
-  GuardMode,
-  GuardScenes,
-  LoginMethods,
-  getAuthClient,
-  initAuthClient,
-  RegisterMethods,
-  GuardEventsCamelToKebabMap,
-};
-
-export type EventListeners = {
-  [key in keyof GuardEventsHandlerKebab]: Exclude<
-    Required<GuardEventsHandlerKebab>[key],
-    undefined
-  >[];
-};
-
-export class Guard {
-  constructor(
-    private appId: string,
-    private config?: Partial<GuardLocalConfig>
-  ) {
-    this.render();
-  }
-
-  static getGuardContainer(selector?: string | HTMLElement) {
-    const defaultId = "authing_guard_container";
-
-    if (!selector) {
-      let container = document.querySelector(`#${defaultId}`);
-      if (!container) {
-        container = document.createElement("div");
-        container.id = defaultId;
-        document.body.appendChild(container);
-      }
-
-      return container;
-    }
-
-    if (typeof selector === "string") {
-      return document.querySelector(selector);
-    }
-
-    return selector;
-  }
-
-  private visible = this.config?.mode === GuardMode.Modal ? false : true;
-
-  private eventListeners = Object.values(GuardEventsCamelToKebabMap).reduce(
-    (acc, evtName) => {
-      return Object.assign({}, acc, {
-        [evtName]: [],
-      });
-    },
-    {} as EventListeners
-  );
-
-  private render(cb?: () => void) {
-    const evts: GuardEventsHandler = Object.entries(
-      GuardEventsCamelToKebabMap
-    ).reduce((acc, [reactEvt, nativeEvt]) => {
-      return Object.assign({}, acc, {
-        [reactEvt]: (...rest: any) => {
-          if (nativeEvt === "close") {
-            this.hide();
-          }
-
-          // TODO 返回最后一个执行函数的值，实际应该只让监听一次
-          return (
-            this.eventListeners[nativeEvt]
-              // @ts-ignore
-              .map((item: any) => {
-                return item(...rest);
-              })
-              .slice(-1)[0] ?? true
-          );
-        },
-      });
-    }, {} as GuardEventsHandler);
-
-    return ReactDOM.render(
-      <ReactAuthingGuard
-        {...(evts as GuardEvents)}
-        appId={this.appId}
-        config={this.config as GuardComponentConifg}
-        visible={this.visible}
-      />,
-      Guard.getGuardContainer(this.config?.target),
-      cb
-    );
-  }
-
-  on<T extends keyof GuardEventsHandlerKebab>(
-    evt: T,
-    handler: Exclude<GuardEventsHandlerKebab[T], undefined>
-  ) {
-    this.eventListeners[evt]!.push(handler as any);
-  }
-
-  show() {
-    this.visible = true;
-    this.render();
-  }
-
-  hide() {
-    this.visible = false;
-    this.render();
-  }
-}