@appkit/dek-plugin 0.9.0 → 0.11.0

package/dist/index.d.ts

@@ -1,6 +1,5 @@
-export type { DekPlugin, DekPluginBoardItem, DekPluginComponentItem, DekPluginConfig, DekPluginFactory, DekPluginSchema, DekPluginSchemaItem, DekPluginScreenItem, } from './lib/plugins';
+export type { DekPlugin, DekPluginBoardItem, DekPluginComponentItem, DekPluginConfig, DekPluginElementFactoryWithProps, DekPluginElementProps, DekPluginFactory, DekPluginSchema, DekPluginSchemaItem, DekPluginScreenItem, } from './lib/plugins';
 export type { DekRegistry, DekRegistryCollection, DekRegistryCollectionItem, DekRegistrySchema, DekRegistrySchemaItem, DekRegistrySchemaProps, DekRegistrySchemaPropsItem, } from './lib/registry';
 export type { DekApi, DekApiInfo, DekApiMessage, DekApiMessageType, DekApiPlugin, DekApiState, } from './lib/api';
-export { default as usePluginApi } from './lib/hooks/usePluginApi';
 export { default as usePluginState } from './lib/hooks/usePluginState';
 export declare function __debug(): void;

package/dist/index.es.js

@@ -1,3 +1,9 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
 import { useRef, useCallback, useEffect, useLayoutEffect, useState as useState$1 } from "react";
 globalThis && globalThis.__awaiter || function(thisArg, _arguments, P, generator) {
   function adopt(value) {
@@ -131,21 +137,21 @@ function parseJSON(value) {
 function extractErrorMessage(err) {
   return err instanceof Error ? err.message : JSON.stringify(err);
 }
-function setState(plugin, key, value) {
-  const localData = getStateRoot(plugin);
+function setState(integrationKey, key, value) {
+  const localData = getStateRoot(integrationKey);
   localData[key] = value;
   localStorage.setItem(
-    `api:${plugin.toLowerCase()}`,
+    `api:${integrationKey.toLowerCase()}`,
     JSON.stringify(localData)
   );
   window.dispatchEvent(new Event("local-storage"));
 }
-function getState(plugin, key) {
-  const localData = getStateRoot(plugin);
+function getState(integrationKey, key) {
+  const localData = getStateRoot(integrationKey);
   return localData[key];
 }
-function getStateRoot(plugin) {
-  const local = localStorage.getItem(`api:${plugin.toLowerCase()}`);
+function getStateRoot(integrationKey) {
+  const local = localStorage.getItem(`api:${integrationKey.toLowerCase()}`);
   return tryParseJson(local || "{}");
 }
 function tryParseJson(jsonString, defaultValue = {}) {
@@ -176,8 +182,83 @@ function isJsonString(str) {
   return true;
 }
 class Api {
+  constructor(integrationKey) {
+    __publicField(this, "integrationKey");
+    this.integrationKey = integrationKey;
+  }
+  get internal() {
+    return window.__dek_api;
+  }
   trace(message, ...data) {
-    console.log(`DEK-TRACE: ${message}`, ...data);
+    this.internal.trace(this.integrationKey, message, ...data);
+  }
+  warn(message, ...data) {
+    this.internal.warn(this.integrationKey, message, ...data);
+  }
+  error(message, ...data) {
+    this.internal.error(this.integrationKey, message, ...data);
+  }
+  messages() {
+    return this.internal.messages();
+  }
+  plugin(name) {
+    return this.internal.plugin(name);
+  }
+  get registry() {
+    return this.internal.registry;
+  }
+  get boardKey() {
+    return this.internal.boardKey;
+  }
+  get boards() {
+    return this.internal.boards;
+  }
+  get board() {
+    return this.internal.board;
+  }
+  get layout() {
+    return this.internal.layout;
+  }
+  get commandGroups() {
+    return this.internal.commandGroups;
+  }
+  navigate(path) {
+    this.internal.navigate(path);
+  }
+  get navigateParams() {
+    return this.internal.navigateParams;
+  }
+  navigateBack() {
+    this.internal.navigateBack();
+  }
+  open(boardKey) {
+    this.internal.open(boardKey);
+  }
+  get plugins() {
+    return this.internal.plugins;
+  }
+  get api() {
+    return this.plugin(this.integrationKey).api;
+  }
+  get state() {
+    return this.plugin(this.integrationKey).state;
+  }
+  get info() {
+    return this.plugin(this.integrationKey).info;
+  }
+  component(key, props) {
+    return this.plugin(this.integrationKey).component(key, props);
+  }
+  componentSchema(key) {
+    return this.plugin(this.integrationKey).componentSchema(key);
+  }
+  screen(path) {
+    return this.plugin(this.integrationKey).screen(path);
+  }
+}
+class ApiInternal {
+  trace(integrationKey, message, ...data) {
+    console.log(`DEK-TRACE[${integrationKey}]: ${message}`, ...data);
     this.globals.messages.push({
       type: "trace",
       body: message,
@@ -185,8 +266,8 @@ class Api {
       at: Date.now()
     });
   }
-  warn(message, ...data) {
-    console.warn(`DEK-WARN: ${message}`, ...data);
+  warn(integrationKey, message, ...data) {
+    console.warn(`DEK-WARN[${integrationKey}]: ${message}`, ...data);
     this.globals.messages.push({
       type: "error",
       body: message,
@@ -194,8 +275,8 @@ class Api {
       at: Date.now()
     });
   }
-  error(message, ...data) {
-    console.error(`DEK-ERROR: ${message}`, ...data);
+  error(integrationKey, message, ...data) {
+    console.error(`DEK-ERROR[${integrationKey}]: ${message}`, ...data);
     this.globals.messages.push({
       type: "error",
       body: message,
@@ -213,7 +294,7 @@ class Api {
     return this.globals.registry;
   }
   get boardKey() {
-    return this.globals.boardKey;
+    return this.globals.navigateParams.boardKey || "#error";
   }
   get boards() {
     return this.globals.boards;
@@ -232,6 +313,9 @@ class Api {
   navigate(path) {
     this.globals.setLocation(`/${this.boardKey}${path}`);
   }
+  get navigateParams() {
+    return this.globals.navigateParams;
+  }
   navigateBack() {
     history.back();
   }
@@ -290,7 +374,11 @@ class Api {
       if (!component) {
         return;
       }
-      return component.element({ ...props, plugin });
+      return component.element({
+        ...props,
+        plugin,
+        api: new Api(integrationKey)
+      });
     }
   }
   getComponentSchema(integrationKey, componentKey) {
@@ -315,7 +403,7 @@ class Api {
         if (!component) {
           return;
         }
-        return component.element({ plugin });
+        return component.element({ plugin, api: new Api(integrationKey) });
       }
     }
   }
@@ -329,18 +417,17 @@ class Api {
         if (!component) {
           return;
         }
-        return component.element({ plugin });
+        return component.element({ plugin, api: new Api(integrationKey) });
       }
     }
   }
 }
-const api = new Api();
+const api = new ApiInternal();
 window.__dek_api = api;
-function usePluginApi() {
-  return window.__dek_api;
-}
-function usePluginState(plugin, key, defaultValue) {
-  const state = useState(plugin);
+window.__dek_api_factory = (integrationKey) => new Api(integrationKey);
+function usePluginState(api2, key, defaultValue) {
+  const integrationKey = api2.integrationKey;
+  const state = useState(integrationKey);
   let value;
   if (state && state[key]) {
     value = state[key];
@@ -356,7 +443,7 @@ function usePluginState(plugin, key, defaultValue) {
       if (typeof newValue === "object") {
         newValue = JSON.stringify(newValue);
       }
-      setState(plugin, key, newValue);
+      setState(integrationKey, key, newValue);
     }
   ];
 }
@@ -364,6 +451,5 @@ function __debug() {
 }
 export {
   __debug,
-  usePluginApi,
   usePluginState
 };

package/dist/index.umd.js

@@ -1,7 +1,13 @@
 (function(global, factory) {
   typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react")) : typeof define === "function" && define.amd ? define(["exports", "react"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.index = {}, global.React));
 })(this, function(exports2, react) {
-  "use strict";
+  "use strict";var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+
   globalThis && globalThis.__awaiter || function(thisArg, _arguments, P, generator) {
     function adopt(value) {
       return value instanceof P ? value : new P(function(resolve) {
@@ -134,21 +140,21 @@
   function extractErrorMessage(err) {
     return err instanceof Error ? err.message : JSON.stringify(err);
   }
-  function setState(plugin, key, value) {
-    const localData = getStateRoot(plugin);
+  function setState(integrationKey, key, value) {
+    const localData = getStateRoot(integrationKey);
     localData[key] = value;
     localStorage.setItem(
-      `api:${plugin.toLowerCase()}`,
+      `api:${integrationKey.toLowerCase()}`,
       JSON.stringify(localData)
     );
     window.dispatchEvent(new Event("local-storage"));
   }
-  function getState(plugin, key) {
-    const localData = getStateRoot(plugin);
+  function getState(integrationKey, key) {
+    const localData = getStateRoot(integrationKey);
     return localData[key];
   }
-  function getStateRoot(plugin) {
-    const local = localStorage.getItem(`api:${plugin.toLowerCase()}`);
+  function getStateRoot(integrationKey) {
+    const local = localStorage.getItem(`api:${integrationKey.toLowerCase()}`);
     return tryParseJson(local || "{}");
   }
   function tryParseJson(jsonString, defaultValue = {}) {
@@ -179,8 +185,83 @@
     return true;
   }
   class Api {
+    constructor(integrationKey) {
+      __publicField(this, "integrationKey");
+      this.integrationKey = integrationKey;
+    }
+    get internal() {
+      return window.__dek_api;
+    }
     trace(message, ...data) {
-      console.log(`DEK-TRACE: ${message}`, ...data);
+      this.internal.trace(this.integrationKey, message, ...data);
+    }
+    warn(message, ...data) {
+      this.internal.warn(this.integrationKey, message, ...data);
+    }
+    error(message, ...data) {
+      this.internal.error(this.integrationKey, message, ...data);
+    }
+    messages() {
+      return this.internal.messages();
+    }
+    plugin(name) {
+      return this.internal.plugin(name);
+    }
+    get registry() {
+      return this.internal.registry;
+    }
+    get boardKey() {
+      return this.internal.boardKey;
+    }
+    get boards() {
+      return this.internal.boards;
+    }
+    get board() {
+      return this.internal.board;
+    }
+    get layout() {
+      return this.internal.layout;
+    }
+    get commandGroups() {
+      return this.internal.commandGroups;
+    }
+    navigate(path) {
+      this.internal.navigate(path);
+    }
+    get navigateParams() {
+      return this.internal.navigateParams;
+    }
+    navigateBack() {
+      this.internal.navigateBack();
+    }
+    open(boardKey) {
+      this.internal.open(boardKey);
+    }
+    get plugins() {
+      return this.internal.plugins;
+    }
+    get api() {
+      return this.plugin(this.integrationKey).api;
+    }
+    get state() {
+      return this.plugin(this.integrationKey).state;
+    }
+    get info() {
+      return this.plugin(this.integrationKey).info;
+    }
+    component(key, props) {
+      return this.plugin(this.integrationKey).component(key, props);
+    }
+    componentSchema(key) {
+      return this.plugin(this.integrationKey).componentSchema(key);
+    }
+    screen(path) {
+      return this.plugin(this.integrationKey).screen(path);
+    }
+  }
+  class ApiInternal {
+    trace(integrationKey, message, ...data) {
+      console.log(`DEK-TRACE[${integrationKey}]: ${message}`, ...data);
       this.globals.messages.push({
         type: "trace",
         body: message,
@@ -188,8 +269,8 @@
         at: Date.now()
       });
     }
-    warn(message, ...data) {
-      console.warn(`DEK-WARN: ${message}`, ...data);
+    warn(integrationKey, message, ...data) {
+      console.warn(`DEK-WARN[${integrationKey}]: ${message}`, ...data);
       this.globals.messages.push({
         type: "error",
         body: message,
@@ -197,8 +278,8 @@
         at: Date.now()
       });
     }
-    error(message, ...data) {
-      console.error(`DEK-ERROR: ${message}`, ...data);
+    error(integrationKey, message, ...data) {
+      console.error(`DEK-ERROR[${integrationKey}]: ${message}`, ...data);
       this.globals.messages.push({
         type: "error",
         body: message,
@@ -216,7 +297,7 @@
       return this.globals.registry;
     }
     get boardKey() {
-      return this.globals.boardKey;
+      return this.globals.navigateParams.boardKey || "#error";
     }
     get boards() {
       return this.globals.boards;
@@ -235,6 +316,9 @@
     navigate(path) {
       this.globals.setLocation(`/${this.boardKey}${path}`);
     }
+    get navigateParams() {
+      return this.globals.navigateParams;
+    }
     navigateBack() {
       history.back();
     }
@@ -293,7 +377,11 @@
         if (!component) {
           return;
         }
-        return component.element({ ...props, plugin });
+        return component.element({
+          ...props,
+          plugin,
+          api: new Api(integrationKey)
+        });
       }
     }
     getComponentSchema(integrationKey, componentKey) {
@@ -318,7 +406,7 @@
           if (!component) {
             return;
           }
-          return component.element({ plugin });
+          return component.element({ plugin, api: new Api(integrationKey) });
         }
       }
     }
@@ -332,18 +420,17 @@
           if (!component) {
             return;
           }
-          return component.element({ plugin });
+          return component.element({ plugin, api: new Api(integrationKey) });
         }
       }
     }
   }
-  const api = new Api();
+  const api = new ApiInternal();
   window.__dek_api = api;
-  function usePluginApi() {
-    return window.__dek_api;
-  }
-  function usePluginState(plugin, key, defaultValue) {
-    const state = useState(plugin);
+  window.__dek_api_factory = (integrationKey) => new Api(integrationKey);
+  function usePluginState(api2, key, defaultValue) {
+    const integrationKey = api2.integrationKey;
+    const state = useState(integrationKey);
     let value;
     if (state && state[key]) {
       value = state[key];
@@ -359,14 +446,13 @@
         if (typeof newValue === "object") {
           newValue = JSON.stringify(newValue);
         }
-        setState(plugin, key, newValue);
+        setState(integrationKey, key, newValue);
       }
     ];
   }
   function __debug() {
   }
   exports2.__debug = __debug;
-  exports2.usePluginApi = usePluginApi;
   exports2.usePluginState = usePluginState;
   Object.defineProperty(exports2, Symbol.toStringTag, { value: "Module" });
 });

package/dist/lib/api.d.ts

@@ -30,6 +30,24 @@ export type DekApiMessage = {
     data?: any[];
     at: number;
 };
+export type DekApiInternal = {
+    trace: (integrationKey: string, message: string, ...data: any[]) => void;
+    warn: (integrationKey: string, message: string, ...data: any[]) => void;
+    error: (integrationKey: string, message: string, ...data: any[]) => void;
+    messages: () => DekApiMessage[];
+    plugin: (name: string) => DekApiPlugin;
+    registry: DekRegistry;
+    boardKey: string;
+    boards: Record<string, any>;
+    board: any;
+    layout: string;
+    commandGroups: Record<string, any>;
+    navigate: (path: string) => void;
+    navigateParams: Record<string, string | undefined>;
+    navigateBack: () => void;
+    open: (boardKey: string) => void;
+    plugins: Record<string, DekApiPlugin>;
+};
 export type DekApi = {
     trace: (message: string, ...data: any[]) => void;
     warn: (message: string, ...data: any[]) => void;
@@ -43,11 +61,15 @@ export type DekApi = {
     layout: string;
     commandGroups: Record<string, any>;
     navigate: (path: string) => void;
+    navigateParams: Record<string, string | undefined>;
     navigateBack: () => void;
     open: (boardKey: string) => void;
     plugins: Record<string, DekApiPlugin>;
 };
 export declare class Api implements DekApi {
+    integrationKey: string;
+    constructor(integrationKey: string);
+    get internal(): DekApiInternal;
     trace(message: string, ...data: any[]): void;
     warn(message: string, ...data: any[]): void;
     error(message: string, ...data: any[]): void;
@@ -60,6 +82,31 @@ export declare class Api implements DekApi {
     get layout(): string;
     get commandGroups(): Record<string, any>;
     navigate(path: string): void;
+    get navigateParams(): Record<string, string | undefined>;
+    navigateBack(): void;
+    open(boardKey: string): void;
+    get plugins(): Record<string, DekApiPlugin>;
+    get api(): any;
+    get state(): DekApiState;
+    get info(): DekApiInfo;
+    component(key: string, props?: any): JSX.Element | undefined;
+    componentSchema(key: string): DekPluginSchema;
+    screen(path: string): JSX.Element | undefined;
+}
+export declare class ApiInternal implements DekApiInternal {
+    trace(integrationKey: string, message: string, ...data: any[]): void;
+    warn(integrationKey: string, message: string, ...data: any[]): void;
+    error(integrationKey: string, message: string, ...data: any[]): void;
+    messages(): DekApiMessage[];
+    plugin(name: string): DekApiPlugin;
+    get registry(): DekRegistry;
+    get boardKey(): string;
+    get boards(): Record<string, any>;
+    get board(): any;
+    get layout(): string;
+    get commandGroups(): Record<string, any>;
+    navigate(path: string): void;
+    get navigateParams(): Record<string, string | undefined>;
     navigateBack(): void;
     open(boardKey: string): void;
     private createPluginWrapper;
@@ -71,5 +118,5 @@ export declare class Api implements DekApi {
     private getScreen;
     private getBoard;
 }
-declare const api: Api;
+declare const api: ApiInternal;
 export default api;

package/dist/lib/hooks/usePluginState.d.ts

@@ -1,9 +1,10 @@
+import { DekApi } from '../api';
 import { DekApiStateType } from '../state';
 export type ApiSetStateAction = (value: DekApiStateType) => void;
-declare function usePluginState(plugin: string, key: string): [DekApiStateType | undefined, ApiSetStateAction];
-declare function usePluginState(plugin: string, key: string, defaultValue: string): [string, ApiSetStateAction];
-declare function usePluginState(plugin: string, key: string, defaultValue: number): [number, ApiSetStateAction];
-declare function usePluginState(plugin: string, key: string, defaultValue: boolean): [boolean, ApiSetStateAction];
-declare function usePluginState(plugin: string, key: string, defaultValue: Array<any>): [Array<any>, ApiSetStateAction];
-declare function usePluginState(plugin: string, key: string, defaultValue: Record<string, any>): [Record<string, any>, ApiSetStateAction];
+declare function usePluginState(api: DekApi, key: string): [DekApiStateType | undefined, ApiSetStateAction];
+declare function usePluginState(api: DekApi, key: string, defaultValue: string): [string, ApiSetStateAction];
+declare function usePluginState(api: DekApi, key: string, defaultValue: number): [number, ApiSetStateAction];
+declare function usePluginState(api: DekApi, key: string, defaultValue: boolean): [boolean, ApiSetStateAction];
+declare function usePluginState(api: DekApi, key: string, defaultValue: Array<any>): [Array<any>, ApiSetStateAction];
+declare function usePluginState(api: DekApi, key: string, defaultValue: Record<string, any>): [Record<string, any>, ApiSetStateAction];
 export default usePluginState;

package/dist/lib/plugins.d.ts

@@ -1,7 +1,10 @@
 /// <reference types="react" />
 import { DekApi } from './api';
-export type PluginElementFactoryWithProps = (props: any) => JSX.Element;
-export type PluginElementFactory = () => JSX.Element;
+export type DekPluginElementProps = Record<string, any> & {
+    plugin: DekPlugin;
+    api: DekApi;
+};
+export type DekPluginElementFactoryWithProps = (props: DekPluginElementProps) => JSX.Element;
 export type DekPluginSchemaItem = {
     type: string;
     title?: string;
@@ -11,16 +14,16 @@ export type DekPluginSchema = Record<string, DekPluginSchemaItem>;
 export type DekPluginComponentItem = {
     key: string;
     description?: string;
-    element: PluginElementFactoryWithProps;
+    element: DekPluginElementFactoryWithProps;
     schema?: DekPluginSchema;
 };
 export type DekPluginScreenItem = {
     path: string;
-    element: PluginElementFactoryWithProps;
+    element: DekPluginElementFactoryWithProps;
 };
 export type DekPluginBoardItem = {
     key: string;
-    element: PluginElementFactoryWithProps;
+    element: DekPluginElementFactoryWithProps;
 };
 export type DekPluginConfig = Record<string, string>;
 export type DekPlugin = {

package/dist/lib/state.d.ts

@@ -1,8 +1,8 @@
 export type DekApiStateType = string | number | boolean | Array<any> | Record<string, any>;
 export type DekApiStateItem = Record<string, DekApiStateType>;
 export type DekApiState = Record<string, DekApiStateItem>;
-export declare function setState(plugin: string, key: string, value: DekApiStateType): void;
-export declare function getState(plugin: string, key: string): DekApiStateType | undefined;
+export declare function setState(integrationKey: string, key: string, value: DekApiStateType): void;
+export declare function getState(integrationKey: string, key: string): DekApiStateType | undefined;
 export declare function tryParseJson(jsonString: string, defaultValue?: {}): object;
 export declare function useState(plugin: string): DekApiStateItem;
 export declare function isJsonString(str: any): boolean;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@appkit/dek-plugin",
   "private": false,
-  "version": "0.9.0",
+  "version": "0.11.0",
   "type": "module",
   "scripts": {
     "dev": "vite",

package/dist/lib/hooks/usePluginApi.d.ts

@@ -1,3 +0,0 @@
-import { DekApi } from '../api';
-declare function usePluginApi(): DekApi;
-export default usePluginApi;