mkarkowski/nope
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

v1.1.0 - adding ui types

Browse Source
This commit is contained in:
Martin Karkowski 2022-06-24 07:45:01 +02:00
parent ab6085a7e3
commit d67e1de191
22 changed files with 2055 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
CHANGELOG.md
View File

@ -89,4 +89,13 @@ Inital commit, which is working with the browser
# 1.0.36
- Fixes:
- Small fixes in the imports of some items in `module.BaseModule.injectable`; `module.GenericWrapper.injectable`; `helpers.descriptors` to make shure, the `nope.d.ts` for the browser is compiled.
- Small fixes in the imports of some items in `module.BaseModule.injectable`; `module.GenericWrapper.injectable`; `helpers.descriptors` to make shure, the `nope.d.ts` for the browser is compiled.
# 1.1.0
- Added:
- Added gui defintion files in `types.ui` containing:
- rendering callback options
- base layout based helpers,
- provided libraries
- Added dev-depencies for libraries.
- added `ui.loader` a backend component to readin the ui.

2
contribute/VERSION
View File

@ -1 +1 @@
1.0.36
1.1.00

27
lib/loader/nopePackageLoader.ts
View File

@ -15,7 +15,7 @@ import { DISPATCHER_INSTANCE } from "../symbols/identifiers";
import { INopeDispatcher } from "../types/nope/nopeDispatcher.interface";
import { INopeModule } from "../types/nope/nopeModule.interface";
import {
IDescriptor,
IClassDescriptor,
INopeActivationHanlder,
IPackageDescription,
} from "../types/nope/nopePackage.interface";
@ -104,9 +104,12 @@ export class NopePackageLoader implements INopePackageLoader {
return _element;
}
public availableElements: IDescriptor[];
public availableElements: IClassDescriptor[];
protected _compareElements(_a: IDescriptor, _b: IDescriptor): boolean {
protected _compareElements(
_a: IClassDescriptor,
_b: IClassDescriptor
): boolean {
if (
_a.options &&
_a.options.addition &&
@ -125,11 +128,11 @@ export class NopePackageLoader implements INopePackageLoader {
* Internal Method to Test, whether an Element exists or not.
*
* @protected
* @param {IDescriptor} _item
* @param {IClassDescriptor} _item
* @return {*} {boolean}
* @memberof NopePackageLoader
*/
protected _hasElement(_item: IDescriptor): boolean {
protected _hasElement(_item: IClassDescriptor): boolean {
for (const _element of this.availableElements) {
try {
if (Array.isArray(_element.selector)) {
@ -171,11 +174,11 @@ export class NopePackageLoader implements INopePackageLoader {
/**
* Method to add an Element to the Build
*
* @param {IDescriptor[]} _elements Definition containing the Elements that should be added
* @param {IClassDescriptor[]} _elements Definition containing the Elements that should be added
* @memberof NopePackageLoader
*/
public async addDescription(
_elements: IDescriptor[],
_elements: IClassDescriptor[],
_instance: NopePackageLoader | null = null
): Promise<void> {
if (_instance === null) {
@ -207,12 +210,12 @@ export class NopePackageLoader implements INopePackageLoader {
* Internal Helper Function to Merge an external Builder for creating Tasks.
*
* @protected
* @param {IDescriptor} _element
* @param {IClassDescriptor} _element
* @param {NopePackageLoader} _instance
* @memberof NopePackageLoader
*/
protected _linkExternalBuilder(
_element: IDescriptor,
_element: IClassDescriptor,
_instance: NopePackageLoader
): void {
// Bind Factory
@ -248,10 +251,10 @@ export class NopePackageLoader implements INopePackageLoader {
* Internal Funcitont to add an Description.
*
* @protected
* @param {IDescriptor} _element
* @param {IClassDescriptor} _element
* @memberof NopePackageLoader
*/
protected _addElement(_element: IDescriptor): void {
protected _addElement(_element: IClassDescriptor): void {
if (_element) {
const _this = this;
@ -499,7 +502,7 @@ export class NopePackageLoader implements INopePackageLoader {
this.container.bind("global.config").toConstantValue(_globalConfig);
this.availableElements = new Array<IDescriptor>();
this.availableElements = new Array<IClassDescriptor>();
}
constructor() {

3
lib/types/index.ts
View File

@ -5,6 +5,7 @@
*/
import * as nope from "./nope/index";
import * as ui from "./ui/index";
export * from "./nope/index";
export * from "./IJSONSchema";
export { nope };
export { nope, ui };

50
lib/types/nope/nopeModule.interface.ts
View File

@ -1,11 +1,10 @@
/**
* @author Martin Karkowski
* @email m.karkowski@zema.de
* @create date 2020-10-12 17:38:15
* @modify date 2020-12-30 10:20:03
* @desc Defintion of a generic Module.
*/
import { TRenderConfigureServicePage } from "../ui";
import { ICallOptions } from "./nopeCommunication.interface";
import { INopeDescriptor } from "./nopeDescriptor.interface";
import { INopeObservable } from "./nopeObservable.interface";
@ -39,7 +38,7 @@ export interface INopeModuleDescription {
* Name of the Module. The name of the module must be written in lowercase.
*
* @type {string}
* @memberof IBaseModule
* @memberof INopeModuleDescription
*/
identifier: string;
@ -47,7 +46,7 @@ export interface INopeModuleDescription {
* Type of the Module
*
* @type {string}
* @memberof INopeModule
* @memberof INopeModuleDescription
*/
readonly type: string;
@ -58,7 +57,7 @@ export interface INopeModuleDescription {
* will be offered in the Network, provide a meaning full documentation
*
* @type {string}
* @memberof IBaseModule
* @memberof INopeModuleDescription
*/
description: string;
@ -66,7 +65,7 @@ export interface INopeModuleDescription {
* The Author of the Module
*
* @type {IAuthor}
* @memberof IBaseModule
* @memberof INopeModuleDescription
*/
author: IAuthor;
@ -74,10 +73,18 @@ export interface INopeModuleDescription {
* Description of the provided Version of the Module.
*
* @type {IVersion}
* @memberof IBaseModule
* @memberof INopeModuleDescription
*/
version: IVersion;
/**
* Contains the provided functions.
*
* > **key** = `id` of the function
*
* @type {{ [index: string]: IFunctionOptions }}
* @memberof INopeModuleDescription
*/
readonly functions: { [index: string]: IFunctionOptions };
readonly events: { [index: string]: IEventOptions };
@ -127,10 +134,9 @@ export interface INopeModule extends INopeModuleDescription {
* Function to Register a Property. If called for an existing Property, the Data will be
* updated.
*
* @template T
* @template K
* @template S
* @template G
* @template T Internal Type
* @template S Setter Type
* @template G Getter Type
* @param {string} name Name of the Property.
* @param {INopeObservable<T, S, G>} observable The Observable.
* @param {IEventOptions} options The Options which are used during registering the Observable.
@ -147,7 +153,7 @@ export interface INopeModule extends INopeModuleDescription {
* Function used to unregister a Property
*
* @param {string} name Name of the Property.
* @return {*} {Promise<void>}
* @return {Promise<void>}
* @memberof IBaseModule
*/
unregisterProperty(name: string): Promise<void>;
@ -156,7 +162,7 @@ export interface INopeModule extends INopeModuleDescription {
* Function to list the available Functions of the module. This will hold all available functions
* (dynamic and static functions).
*
* @return {*} {Promise<Array<{ name: string, schema: IDescriptor, options: IFunctionOptions }>>}
* @return {Promise<Array<{ name: string, schema: IDescriptor, options: IFunctionOptions }>>}
* @memberof IBaseModule
*/
listFunctions(): Promise<
@ -166,7 +172,7 @@ export interface INopeModule extends INopeModuleDescription {
/**
* Function used to get an List of all registered Properties.
*
* @return {*} {Promise<Array<{ name: string, schema: IDescriptor, options: IEventOptions }>>}
* @return {Promise<Array<{ name: string, schema: IDescriptor, options: IEventOptions }>>}
* @memberof IBaseModule
*/
listProperties(): Promise<
@ -176,7 +182,7 @@ export interface INopeModule extends INopeModuleDescription {
/**
* Function used to initialze the Module.
*
* @return {*} {Promise<void>}
* @return {Promise<void>}
* @memberof IBaseModule
*/
init(...args): Promise<void>;
@ -184,7 +190,7 @@ export interface INopeModule extends INopeModuleDescription {
/**
* Function used to Dispose the Module.
*
* @return {*} {Promise<void>}
* @return {Promise<void>}
* @memberof IBaseModule
*/
dispose(): Promise<void>;
@ -192,7 +198,7 @@ export interface INopeModule extends INopeModuleDescription {
/**
* Function used to derive a parsable Description of the Module.
*
* @return {*} {INopeModuleDescription}
* @return {INopeModuleDescription}
* @memberof INopeModule
*/
toDescription(): INopeModuleDescription;
@ -231,7 +237,6 @@ export interface IGenericNopeModule extends INopeModule {
*
* @export
* @interface IEventOptions
* @template K
*/
export interface IEventOptions {
/**
@ -272,7 +277,7 @@ export interface IEventOptions {
* @export
* @interface IFunctionOptions
*/
export interface IFunctionOptions extends Partial<ICallOptions> {
export interface IFunctionOptions<T = any> extends Partial<ICallOptions> {
/**
* Instead of generating a uuid an id could be provided
*
@ -289,6 +294,13 @@ export interface IFunctionOptions extends Partial<ICallOptions> {
*/
schema: INopeDescriptor;
/**
* The ui definition of the service.
*/
ui?: {
serviceConfiguration?: TRenderConfigureServicePage<T>;
};
/**
* Flag, to indicate, that the Item is dynamic.
*

15
lib/types/nope/nopePackage.interface.ts
View File

@ -1,9 +1,10 @@
import { interfaces } from "inversify";
import { TCreatorPage, TRenderInstancePage } from "../ui";
import { IInstanceCreationMsg } from "./nopeCommunication.interface";
import { IValidPromise } from "./nopeDispatcher.interface";
import { IFunctionOptions } from "./nopeModule.interface";
import { IFunctionOptions, INopeModule } from "./nopeModule.interface";
export interface IDescriptor {
export interface IClassDescriptor<T extends INopeModule = INopeModule> {
/**
* Identifier for a Single Element
*
@ -44,7 +45,7 @@ export interface IDescriptor {
name: "whenTargetTagged" | "whenTargetNamed" | "onActivation";
args: any[];
};
factoryCallback?: (context: interfaces.Context) => (...args) => any;
factoryCallback?: (context: interfaces.Context) => (...args) => T;
};
/**
@ -70,15 +71,19 @@ export interface IPackageDescription<
/**
* Element containing the classes of the module.
*
* @type {Array<IDescriptor>}
* @type {Array<IClassDescriptor>}
* @memberof IPackageDescription
*/
providedClasses: Array<{
description: IDescriptor;
description: IClassDescriptor;
settings: {
allowInstanceGeneration?: boolean;
maxAmountOfInstance?: number;
};
ui?: {
creator: TCreatorPage;
config: TRenderInstancePage;
};
}>;
/**

6
lib/types/nope/nopePackageLoader.interface.ts
View File

@ -1,7 +1,7 @@
import { Container } from "inversify";
import { INopeDispatcher } from "./nopeDispatcher.interface";
import {
IDescriptor,
IClassDescriptor,
INopeActivationHanlder,
IPackageDescription,
} from "./nopePackage.interface";
@ -30,11 +30,11 @@ export interface INopePackageLoader {
/**
* Add a Description
*
* @param {Array<IDescriptor>} the Descriptions as Array.
* @param {Array<IClassDescriptor>} the Descriptions as Array.
* @return {*} {Promise<void>}
* @memberof INopePackageLoader
*/
addDescription(element: Array<IDescriptor>): Promise<void>;
addDescription(element: Array<IClassDescriptor>): Promise<void>;
/**
* Function to add Activation Handlers.

91
lib/types/ui/editor/IEdges.ts Normal file
View File

@ -0,0 +1,91 @@
/**
* @author Martin Karkowski
* @email m.karkowski@zema.de
*/
export type EDGE_TYPE_INFO_CONSUME_DATA = "info:consume:data";
export type EDGE_TYPE_INFO_CONSUME_EVENT = "info:consume:event";
export type EDGE_TYPE_INFO_CONSUME_PATH = "info:consume:path";
export type EDGE_TYPE_INFO_IS_SUB_INFO = "info:is-child";
export type EDGE_TYPE_LOGIC_AVOIDS = "logic:avoid";
export type EDGE_TYPE_LOGIC_CONSUME_TOKEN = "logic:token:consume";
export type EDGE_TYPE_LOGIC_PRODUCE_TOKEN = "logic:token:produce";
export type EDGE_TYPE_LOGIC_RELEASES = "logic:release";
export type EDGE_TYPE_LOGIC_REMOVE_RELEASES = "logic:lock";
export type EDGE_TYPE_LOGIC_REQUIRES = "logic:require";
export type EDGE_TYPE_LOGIC_TRIGGERS = "logic:trigger";
export type EDGE_TYPE_PLANNER_AVOIDS = "logic:planner:avoids";
export type EDGE_TYPE_PLANNER_LEADS_TO = "logic:planner:leads-to";
export type EDGE_TYPE_PLANNER_RELEASES = "logic:planner:releases";
export type EDGE_TYPE_PLANNER_REQUIRES = "logic:planner:requires";
export type VALID_EDGES =
| EDGE_TYPE_INFO_CONSUME_DATA
| EDGE_TYPE_INFO_CONSUME_EVENT
| EDGE_TYPE_INFO_CONSUME_PATH
| EDGE_TYPE_INFO_IS_SUB_INFO
| EDGE_TYPE_LOGIC_AVOIDS
| EDGE_TYPE_LOGIC_CONSUME_TOKEN
| EDGE_TYPE_LOGIC_PRODUCE_TOKEN
| EDGE_TYPE_LOGIC_RELEASES
| EDGE_TYPE_LOGIC_REMOVE_RELEASES
| EDGE_TYPE_LOGIC_REQUIRES
| EDGE_TYPE_LOGIC_TRIGGERS
| EDGE_TYPE_PLANNER_AVOIDS
| EDGE_TYPE_PLANNER_LEADS_TO
| EDGE_TYPE_PLANNER_RELEASES
| EDGE_TYPE_PLANNER_REQUIRES;
export const EDGE_TYPE_INFO_CONSUME_DATA: EDGE_TYPE_INFO_CONSUME_DATA =
"info:consume:data";
export const EDGE_TYPE_INFO_CONSUME_EVENT: EDGE_TYPE_INFO_CONSUME_EVENT =
"info:consume:event";
export const EDGE_TYPE_INFO_CONSUME_PATH: EDGE_TYPE_INFO_CONSUME_PATH =
"info:consume:path";
export const EDGE_TYPE_INFO_IS_SUB_INFO: EDGE_TYPE_INFO_IS_SUB_INFO =
"info:is-child";
export const EDGE_TYPE_LOGIC_AVOIDS: EDGE_TYPE_LOGIC_AVOIDS = "logic:avoid";
export const EDGE_TYPE_LOGIC_CONSUME_TOKEN: EDGE_TYPE_LOGIC_CONSUME_TOKEN =
"logic:token:consume";
export const EDGE_TYPE_LOGIC_PRODUCE_TOKEN: EDGE_TYPE_LOGIC_PRODUCE_TOKEN =
"logic:token:produce";
export const EDGE_TYPE_LOGIC_RELEASES: EDGE_TYPE_LOGIC_RELEASES =
"logic:release";
export const EDGE_TYPE_LOGIC_REMOVE_RELEASES: EDGE_TYPE_LOGIC_REMOVE_RELEASES =
"logic:lock";
export const EDGE_TYPE_LOGIC_REQUIRES: EDGE_TYPE_LOGIC_REQUIRES =
"logic:require";
export const EDGE_TYPE_LOGIC_TRIGGERS: EDGE_TYPE_LOGIC_TRIGGERS =
"logic:trigger";
export const EDGE_TYPE_PLANNER_AVOIDS: EDGE_TYPE_PLANNER_AVOIDS =
"logic:planner:avoids";
export const EDGE_TYPE_PLANNER_LEADS_TO: EDGE_TYPE_PLANNER_LEADS_TO =
"logic:planner:leads-to";
export const EDGE_TYPE_PLANNER_RELEASES: EDGE_TYPE_PLANNER_RELEASES =
"logic:planner:releases";
export const EDGE_TYPE_PLANNER_REQUIRES: EDGE_TYPE_PLANNER_REQUIRES =
"logic:planner:requires";
export const VALID_EDGES: Array<VALID_EDGES> = [
EDGE_TYPE_INFO_CONSUME_DATA,
EDGE_TYPE_INFO_CONSUME_EVENT,
EDGE_TYPE_INFO_CONSUME_PATH,
EDGE_TYPE_INFO_IS_SUB_INFO,
EDGE_TYPE_LOGIC_AVOIDS,
EDGE_TYPE_LOGIC_CONSUME_TOKEN,
EDGE_TYPE_LOGIC_PRODUCE_TOKEN,
EDGE_TYPE_LOGIC_RELEASES,
EDGE_TYPE_LOGIC_REMOVE_RELEASES,
EDGE_TYPE_LOGIC_REQUIRES,
EDGE_TYPE_LOGIC_TRIGGERS,
EDGE_TYPE_PLANNER_AVOIDS,
EDGE_TYPE_PLANNER_LEADS_TO,
EDGE_TYPE_PLANNER_RELEASES,
EDGE_TYPE_PLANNER_REQUIRES,
];
export interface IBaseEdge {
from: string;
to: string;
category: VALID_EDGES;
}
export interface PE extends Partial<IBaseEdge> {}

37
lib/types/ui/editor/IEditPage.ts Normal file
View File

@ -0,0 +1,37 @@
import { TRenderFunctionResult } from "../layout.interface";
import { IPort } from "./INodes";
export interface IEditPage<T = any> extends TRenderFunctionResult {
/**
* Function, which must return the current data.
*
* @author M.Karkowski
* @return {boolean}
* @memberof IEditPage
*/
getData(): T;
/**
* Function which must return true, if the Entered-
* Data is valid. Otherwise the Update will be refused
*
* @author M.Karkowski
* @return {boolean}
* @memberof IEditPage
*/
isValid(): boolean;
/**
* Element showing the type of the edit panel.
*/
type: "node" | "edge";
/**
* Function to store the changed Edge data.
* @param options adapted Edge Options.
*/
getPorts(): {
inputs: IPort[];
outputs: IPort[];
};
}

0
lib/types/ui/editor/INetwork.ts Normal file
View File

109
lib/types/ui/editor/INodes.ts Normal file
View File

@ -0,0 +1,109 @@
/**
* @author Martin Karkowski
* @email m.karkowski@zema.de
* @desc [description]
*/
export type PORT_AVOID_TOKEN = "flow.input.avoid";
export type PORT_CONSUME_TOKEN = "flow.input.consume";
export type PORT_DATA = "dataPort";
export type PORT_EVENT = "eventPort";
export type PORT_LOGIC_FLOW = "logicFlowPort";
export type PORT_PLACE = "flow.place";
export type PORT_PRODUCE_TOKEN = "flow.output.produce";
export type PORT_REQUIRE_TOKEN = "flow.input.require";
export type VALID_PORTS =
| PORT_AVOID_TOKEN
| PORT_CONSUME_TOKEN
| PORT_DATA
| PORT_EVENT
| PORT_LOGIC_FLOW
| PORT_PLACE
| PORT_PRODUCE_TOKEN
| PORT_REQUIRE_TOKEN;
export type NODE_TYPE_COMPOSED = "node:composed";
export type NODE_TYPE_CONSTANT = "data:constant";
export type NODE_TYPE_DATA_TO_TOKEN = "logic:data-to-token";
export type NODE_TYPE_FLOW_OPERATION = "logic:flow";
export type NODE_TYPE_PLACE = "logic:place";
export type NODE_TYPE_TOKEN_TO_DATA = "logic:token-to-data";
export type NODE_TYPE_TRANSITION = "logic:transition";
export type NODE_TYPE_VAR = "data:constant";
export type VALID_NODES =
| NODE_TYPE_COMPOSED
| NODE_TYPE_CONSTANT
| NODE_TYPE_DATA_TO_TOKEN
| NODE_TYPE_FLOW_OPERATION
| NODE_TYPE_PLACE
| NODE_TYPE_TOKEN_TO_DATA
| NODE_TYPE_TRANSITION
| NODE_TYPE_VAR
| VALID_PORTS;
export const PORT_AVOID_TOKEN: PORT_AVOID_TOKEN = "flow.input.avoid";
export const PORT_CONSUME_TOKEN: PORT_CONSUME_TOKEN = "flow.input.consume";
export const PORT_DATA: PORT_DATA = "dataPort";
export const PORT_EVENT: PORT_EVENT = "eventPort";
export const PORT_LOGIC_FLOW: PORT_LOGIC_FLOW = "logicFlowPort";
export const PORT_PLACE: PORT_PLACE = "flow.place";
export const PORT_PRODUCE_TOKEN: PORT_PRODUCE_TOKEN = "flow.output.produce";
export const PORT_REQUIRE_TOKEN: PORT_REQUIRE_TOKEN = "flow.input.require";
export const VALID_PORTS: Array<VALID_PORTS> = [
PORT_AVOID_TOKEN,
PORT_CONSUME_TOKEN,
PORT_DATA,
PORT_EVENT,
PORT_LOGIC_FLOW,
PORT_PLACE,
PORT_PRODUCE_TOKEN,
PORT_REQUIRE_TOKEN,
];
export const NODE_TYPE_COMPOSED: NODE_TYPE_COMPOSED = "node:composed";
export const NODE_TYPE_CONSTANT: NODE_TYPE_CONSTANT = "data:constant";
export const NODE_TYPE_DATA_TO_TOKEN: NODE_TYPE_DATA_TO_TOKEN =
"logic:data-to-token";
export const NODE_TYPE_FLOW_OPERATION: NODE_TYPE_FLOW_OPERATION = "logic:flow";
export const NODE_TYPE_PLACE: NODE_TYPE_PLACE = "logic:place";
export const NODE_TYPE_TOKEN_TO_DATA: NODE_TYPE_TOKEN_TO_DATA =
"logic:token-to-data";
export const NODE_TYPE_TRANSITION: NODE_TYPE_TRANSITION = "logic:transition";
export const NODE_TYPE_VAR: NODE_TYPE_VAR = "data:constant";
export const VALID_NODES: Array<VALID_NODES> = [
NODE_TYPE_COMPOSED,
NODE_TYPE_CONSTANT,
NODE_TYPE_DATA_TO_TOKEN,
NODE_TYPE_FLOW_OPERATION,
NODE_TYPE_PLACE,
NODE_TYPE_TOKEN_TO_DATA,
NODE_TYPE_TRANSITION,
NODE_TYPE_VAR,
];
VALID_PORTS.map((id) => VALID_NODES.push(id));
/**
* Information of a base node in a graph.
*/
export interface IBaseNode {
key: string;
location: { x: number; y: number };
category: VALID_NODES;
size: {
width: number;
height: number;
};
}
export interface IPort {
label: string;
portId: string;
type: VALID_PORTS;
allowMultipleInputs?: true;
portColor?: string;
}
export interface PN extends Partial<IBaseNode> {}

18
lib/types/ui/editor/index.ts Normal file
View File

@ -0,0 +1,18 @@
/**
* @module editorUi
* @author Martin Karkowski
* @email m.karkowski@zema.de
*/
export * from "./IEdges";
export * from "./IEditPage";
export * from "./IEdges";
// export * from "./INetwork";
export * from "./INodes";
export * from "./render.callbacks";
import * as nodes from "./INodes";
import * as edges from "./IEdges";
import * as callbacks from "./render.callbacks";
export { nodes, edges, callbacks };

11
lib/types/ui/editor/render.callbacks.ts Normal file
View File

@ -0,0 +1,11 @@
import { IRenderData } from "../helpers.interface";
import { IEditPage } from "./IEditPage";
import { PN } from "./INodes";
/** Helper to configurate a service */
export type TRenderConfigureServicePage<T extends PN> = (
div: HTMLDivElement,
options: IRenderData & {
input: T;
}
) => IEditPage;

393
lib/types/ui/helpers.interface.ts Normal file
View File

@ -0,0 +1,393 @@
/**
* @author Martin Karkowski
* @email m.karkowski@zema.de
*/
import { ILogger } from "js-logger";
import { IJsonSchema } from "../IJSONSchema";
import { INopeDispatcher, INopeObservable } from "../nope/index";
import * as nope from "../../index.browser";
import * as plotly from "plotly.js";
import * as go from "gojs";
import {
IPanel,
IPossiblePanels,
IMinProvidedDataSet,
IRadioMenuItemDescription,
} from "./layout.interface";
export type TSettingsObject = { [index: string]: string | number | boolean };
/** Descripting a session, which the ui has established. */
export type TSession = {
name: string;
uri: string;
port: number;
connection: "mqtt" | "io-client";
forwardData: boolean;
required: boolean;
};
/** A Schema to receive an object from the url (use the query pattern) */
export type TSimpleSchema = {
[index: string]:
| "number"
| "integer"
| "string"
| "boolean"
| {
parse: (data: string) => any;
validate: (data: string) => boolean;
};
};
/**
* Type containing the external libraries.
*/
export type TLibraries = {
/**
* The Nope Library. It contains only the Browser build.
*
* @type {typeof nope}
*/
nope: typeof nope;
/**
* Built on top of d3.js and stack.gl, Plotly.js is a high-level, declarative charting library. plotly.js ships with over 40 chart types, including 3D charts,
* statistical graphs, and SVG maps. plotly.js is free and open source and you can view the source, report issues or contribute on GitHub.
*
* For Tutorials and more checkout: https://plotly.com/javascript/
*/
plotly: typeof plotly;
/**
* Out of the box w2ui is an all-in-one solution. It contains common UI widgets: Grid, Forms, Toolbars, Layout, Sidebar, Tabs, Popup and various field controls.
* You do not need to put together a collection of mismatched plugins to accomplish your goals.
*
* Contains the original w2ui Library. https://w2ui.com/web/
*/
w2ui: any;
/**
* jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling,
* animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. With a combination of versatility and extensibility,
* jQuery has changed the way that millions of people write JavaScript.
*
* Contains jQuery. See: https://jquery.com/
*/
jQuery: any;
/**
* Contains a library for a dynamic JSON-Editor. This contains a tree-view, with edit options.
*
* For more details checkout: https://github.com/josdejong/jsoneditor
*/
jsoneditor: any;
/**
* GoJS is a JavaScript library that lets you easily create interactive diagrams in modern web browsers. GoJS supports graphical templates and data-binding
* of graphical object properties to model data. You only need to save and restore the model, consisting of simple JavaScript objects holding whatever properties
* your app needs. Many predefined tools and commands implement the standard behaviors that most diagrams need. Customization of appearance and behavior is
* mostly a matter of setting properties.
*
* For more details checkout: https://gojs.net/latest/
*/
gojs: typeof go;
};
export type TcreateLayoutOptions = {
/**
* Id of the Layout
*/
id: string;
/**
* ID of the div. given via `<div id="blabla" #blabla></div>`
*/
divId: string;
/**
* Function which is called during resizing.
*
* Receives the `event` and the `panels` (containg all panels of the layout)
*/
onResizeCallback?: (event: any, panels?: IPossiblePanels) => void;
/**
* The width, that should be set e.g. `100%` or `100px`
*/
width?: string | number;
/**
* The height, that should be set e.g. `100%` or `100px`
*/
height?: string | number;
/**
* To define.
*
* @type {*}
*/
colors?: any;
};
/** Helper for the provided data: */
export interface IRenderData {
helpers: {
data: {
/*
* Function to set a data element. usally stores the data in key <-> value combination.
* Make shure we are able to parse the data (for instance to json), before using this function.
*
* @param {string} key The key to store the value.
* @param {*} value The data that should be stored.
* @return {Promise<boolean>}
* @memberof IDataInterface
*/
setData(key: string, value: any): Promise<boolean>;
/**
* Helper to get the a value from the store, which is related to the key. If the data isn't present,
* the store **must** store the provided `defaultValue`. Afterwards it **must** return the provided
* `defaultValue`
*
* @template T expected type. Is defined by the `defaultValue`
* @param {string} key The key, under which the data is expected.
* @param {T} defaultValue The default value, which should be used if the data isnt present.
* @return {Promise<T>} The extracted data / `defaultValue`
* @memberof IDataInterface
*/
getData<T>(key: string, defaultValue: T): Promise<T>;
};
connection: {
/**
* Flag showing whether the Service is connected to a backend or not
*
* @type {INopeObservable<boolean>}
* @memberof INoPEConnectService
*/
sessionsConnected: INopeObservable<boolean>;
/**
* Flag, to define, whether a external connection is required to
* set the {@link INoPEConnectService.sessionsConnected} to true.
*
* @type {boolean}
* @memberof INoPEConnectService
*/
noExternalConnectionRequired: boolean;
/**
* Helper Function to establish a connection to a backend. If called, to url is changed to the `pages/connect` and after a sucessfull connection, the original url is loaded **again**.
*
* >Use with care, if you get problems reloading the side again.
* @param options
* @returns
*/
connect(options?: {
delay: number; // Delay, after which the page is reloaded.
}): Promise<boolean>;
};
file: {
/**
* Helper to upload data to the browser. (Opens a Popup)
*
* > The data is only available in the Browser.
*/
upload: (options: {
/**
* Title of the upload form
*/
title: string;
width?: number;
height?: number;
/**
* Callback which is called after the data has been received.
*
* @param error Error, during uploading
* @param data The data formated as **string**
*/
callback(error: any, data: string): void;
}) => void;
/**
* Downloads some content as file.
*
*/
download: (
content: string,
fileName?: string,
option?: {
/**
* Automatically provide Unicode text encoding hints
* @default false
*/
autoBom: boolean;
}
) => void;
};
info: {
hostname: string;
/**
* Returns the available layers.
*
* @author M.Karkowski
* @readonly
* @type {(Array<TSession & { connected: boolean }>)}
* @memberof NoPEService
*/
readonly layers: Array<TSession & { connected: boolean }>;
/**
* Adds an communication Layer.
*
* @param {TSession} _session The Parameters for the Session.
* @memberof NoPEService
*/
addCommunicationLayer(_session: TSession): void;
/**
* Disconnects the Layer.
* @param session The Session Parameters to use.
*/
removeCommunicationLayer(session: TSession): void;
};
url: {
/**
* Helper to get an Object from a schema. The Schema must be from type Object and is only allowed to have
* types "number", "boolean", "integer", "string". If a different type is used an error is thrown.
* @param schema The JSON-Schema
* @returns
*/
getObjectFromQueryWithSchema(
schema: IJsonSchema
): Promise<{ [index: string]: any } | false>;
/**
* Extract the data based on some query parameters. The Parameters to use are provided in the schema object.
* @param simpleSchema
* @returns
*/
getObjectFromQuery(
simpleSchema: TSimpleSchema
): Promise<{ [index: string]: any } | false>;
/**
* Generates a link with Query Parameters.
* @param object
* @returns
*/
generateLinkWithQueryParams(
...objects: TSettingsObject[]
): Promise<string>;
};
layout: {
/**
* Helper to create a W2UI Layout
*
* @param {IPanel[]} panelConfig
* @param {TcreateLayoutOptions} options
* @param {...any[]} args
* @return {*}
*/
createLayout(
panelConfig: IPanel[],
options: TcreateLayoutOptions,
...args: any[]
): {
layout: {
layout: any;
element: any;
destroy: () => void;
};
panels: IPossiblePanels;
};
toolbar: {
/**
* Helper function, to generate a Radio Menu Entry for a Toolbar.
*
* @export
* @template D The desired callback Data.
* @template T The desired data of the item.
* @param options The Options to define the radio-menu. Must contain items and a onSelect callback.
* @return {*}
*/
generateRadioMenuEntry<
D extends IMinProvidedDataSet = IMinProvidedDataSet,
T extends IRadioMenuItemDescription = IRadioMenuItemDescription
>(options: {
/**
* The Toolbar Entries.
*
* @type {T[]}
*/
items: T[];
/**
* The Id of the already selected radio-element
*
* @type {string}
*/
selected?: string;
/**
* Callback, that should be called on selecting a radio-box item.
*
*/
onSelect: (data: D, item: T) => void;
}): void;
/**
* Helper to render a Select Toobar.
*
* @template D
* @template T
* @param options
*/
generateSelectMenuEntry<
D extends IMinProvidedDataSet,
T extends IRadioMenuItemDescription
>(options: {
/**
* The Items which can be selected
*/
items: (T | string)[];
/**
* The Selected Item
*/
selected?: string;
/**
* The Text to Show
*/
text: string;
onSelect: (data: D, selection: { [index: string]: boolean }) => void;
}): void;
};
};
};
logger: ILogger;
dispatcher: INopeDispatcher;
libraries: TLibraries;
}
/** Helper used, to render the instance details */
// export type TRenderInstancePage<T extends nope.IGenericNopeModule> = (
// div: HTMLDivElement,
// options: TRenderData & {
// input: T;
// }
// ) => TRenderFunctionResult;
// /** Helper to configurate a service */
// export type TRenderConfigureServicePage<T> = (
// div: HTMLDivElement,
// options: TRenderData & {
// input: T;
// }
// ) => IEditPage;
// /** UI to define an instance. */
// export type TCreatorPage<T extends nope.IGenericNopeModule> = (
// div: HTMLDivElement,
// options: TRenderData & {
// createInstance: T;
// }
// ) => IEditPage;
// export type TRenderEditPage<T> = (
// div: HTMLDivElement,
// options: TRenderData & {
// input: T;
// }
// ) => IEditPage;

13
lib/types/ui/index.ts Normal file
View File

@ -0,0 +1,13 @@
/**
* @module ui
* @author Martin Karkowski
* @email m.karkowski@zema.de
*/
import * as editor from "./editor/index";
import * as layout from "./layout.interface";
export { TCreatorPage, TRenderInstancePage } from "./render.callbacks";
export { TRenderConfigureServicePage } from "./editor/index";
export { editor, layout };

1145
lib/types/ui/layout.interface.ts Normal file
View File

File diff suppressed because it is too large Load Diff

34
lib/types/ui/render.callbacks.ts Normal file
View File

@ -0,0 +1,34 @@
/**
* @author Martin Karkowski
* @email m.karkowski@zema.de
*/
import { IGenericNopeModule } from "../nope";
import { IRenderData } from "./helpers.interface";
import { TRenderFunctionResult } from "./layout.interface";
/** Helper used, to render the instance details */
export type TRenderInstancePage<
T extends IGenericNopeModule = IGenericNopeModule
> = (
/** The DIV Element */
div: HTMLDivElement,
/** The Provided Options used by the function to create the ui */
options: IRenderData & {
/** The Instance to Render. */
input: T;
}
) => TRenderFunctionResult;
/** UI to define an instance. */
export type TCreatorPage<T extends IGenericNopeModule = IGenericNopeModule> = (
/** The DIV Element */
div: HTMLDivElement,
/** The Provided Options used by the function to create the ui */
options: IRenderData & {
/** Name of the Constructor */
ctorName: string;
/** The callback to create the instance. */
createInstance: (...args) => Promise<T>;
}
) => void;

23
lib/ui/helpers.ts Normal file
View File

@ -0,0 +1,23 @@
/**
* @author Martin Karkowski
* @email m.karkowski@zema.de
*/
import { stringifyWithFunctions } from "../helpers/index.browser";
import { IGenericNopeModule, INopeModule } from "../module";
import { TRenderInstancePage } from "../types/ui";
/**
* Converts the convertInstanceRenderPage to a string, which could be
* store or something similar.
*
* @export
* @template I The Instance Type
* @param {(TRenderInstancePage<I & IGenericNopeModule>)} callback The callback to stringify.
* @return {string} The parsed String.
*/
export function convertInstanceRenderPage<I extends INopeModule>(
callback: TRenderInstancePage<I & IGenericNopeModule>
): string {
return stringifyWithFunctions(callback);
}

116
package-lock.json generated
View File

@ -1,12 +1,12 @@
{
"name": "nope",
"version": "1.0.24",
"version": "1.0.35",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "nope",
"version": "1.0.24",
"version": "1.0.35",
"license": "MIT",
"dependencies": {
"argparse": "^2.0.1",
@ -40,10 +40,12 @@
"nope-js": "bin/nope"
},
"devDependencies": {
"@angular/core": "^14.0.3",
"@types/async": "^3.2.12",
"@types/chai": "^4.3.0",
"@types/lodash": "^4.14.178",
"@types/node": "^17.0.9",
"@types/plotly.js": "^1.54.22",
"@types/socket.io": "^3.0.1",
"@types/socket.io-client": "^1.4.36",
"chai": "^4.3.4",
@ -53,6 +55,7 @@
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-import": "^2.25.4",
"eslint-plugin-prettier": "^4.0.0",
"gojs": "^2.2.11",
"mocha": "^9.1.3",
"npm-check-updates": "^12.1.0",
"onchange": "^7.1.0",
@ -65,6 +68,22 @@
"webpack-cli": "^4.8.0"
}
},
"node_modules/@angular/core": {
"version": "14.0.3",
"resolved": "https://registry.npmjs.org/@angular/core/-/core-14.0.3.tgz",
"integrity": "sha512-Z71BrEIJuMGm/BdK9Lh8IJwADQqA8qPeUVppCs67CABZdwA3sK0kC+iobauWXcweXU30BdQYc7HyZe2x7rcdmQ==",
"dev": true,
"dependencies": {
"tslib": "^2.3.0"
},
"engines": {
"node": "^14.15.0 || >=16.10.0"
},
"peerDependencies": {
"rxjs": "^6.5.3 || ^7.4.0",
"zone.js": "~0.11.4"
}
},
"node_modules/@babel/runtime": {
"version": "7.16.7",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.16.7.tgz",
@ -438,6 +457,12 @@
"resolved": "https://registry.npmjs.org/@types/cors/-/cors-2.8.12.tgz",
"integrity": "sha512-vt+kDhq/M2ayberEtJcIN/hxXy1Pk+59g2FV/ZQceeaTyCtCucjL2Q7FXlFjtWn4n15KCr1NE2lNNFhp0lEThw=="
},
"node_modules/@types/d3": {
"version": "3.5.47",
"resolved": "https://registry.npmjs.org/@types/d3/-/d3-3.5.47.tgz",
"integrity": "sha512-VkWIQoZXLFdcBGe5pdBKJmTU3fmpXvo/KV6ixvTzOMl1yJ2hbTXpfvsziag0kcaerPDwas2T0vxojwQG3YwivQ==",
"dev": true
},
"node_modules/@types/detect-indent": {
"version": "0.1.30",
"resolved": "https://registry.npmjs.org/@types/detect-indent/-/detect-indent-0.1.30.tgz",
@ -488,6 +513,15 @@
"resolved": "https://registry.npmjs.org/@types/node/-/node-17.0.9.tgz",
"integrity": "sha512-5dNBXu/FOER+EXnyah7rn8xlNrfMOQb/qXnw4NQgLkCygKBKhdmF/CA5oXVOKZLBEahw8s2WP9LxIcN/oDDRgQ=="
},
"node_modules/@types/plotly.js": {
"version": "1.54.22",
"resolved": "https://registry.npmjs.org/@types/plotly.js/-/plotly.js-1.54.22.tgz",
"integrity": "sha512-/xL9++eA7VnIIZqNQOw6sZ7DtEmfoHj5rAD2CjU2LCOqem/BxTA1KlpdUWEHOiou6za4HKnM+Nvho3jTBPYJ/w==",
"dev": true,
"dependencies": {
"@types/d3": "^3"
}
},
"node_modules/@types/socket.io": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/@types/socket.io/-/socket.io-3.0.2.tgz",
@ -4070,6 +4104,12 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/gojs": {
"version": "2.2.11",
"resolved": "https://registry.npmjs.org/gojs/-/gojs-2.2.11.tgz",
"integrity": "sha512-Zb6VucKWQhPlZCGUvuQFUb7X+VAfcapxYpAhta4Yq+ACwOpcNIL9ewjiACfW3nz2bkKK2qbahJBdzVwnKBsvZg==",
"dev": true
},
"node_modules/got": {
"version": "9.6.0",
"resolved": "https://registry.npmjs.org/got/-/got-9.6.0.tgz",
@ -15398,11 +15438,6 @@
"tslib": "^2.1.0"
}
},
"node_modules/rxjs/node_modules/tslib": {
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.1.tgz",
"integrity": "sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw=="
},
"node_modules/safe-buffer": {
"version": "5.2.1",
"resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
@ -16797,6 +16832,11 @@
"integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==",
"dev": true
},
"node_modules/tslib": {
"version": "2.4.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.0.tgz",
"integrity": "sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ=="
},
"node_modules/type-check": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
@ -18249,9 +18289,28 @@
"funding": {
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/zone.js": {
"version": "0.11.6",
"resolved": "https://registry.npmjs.org/zone.js/-/zone.js-0.11.6.tgz",
"integrity": "sha512-umJqFtKyZlPli669gB1gOrRE9hxUUGkZr7mo878z+NEBJZZixJkKeVYfnoLa7g25SseUDc92OZrMKKHySyJrFg==",
"dev": true,
"peer": true,
"dependencies": {
"tslib": "^2.3.0"
}
}
},
"dependencies": {
"@angular/core": {
"version": "14.0.3",
"resolved": "https://registry.npmjs.org/@angular/core/-/core-14.0.3.tgz",
"integrity": "sha512-Z71BrEIJuMGm/BdK9Lh8IJwADQqA8qPeUVppCs67CABZdwA3sK0kC+iobauWXcweXU30BdQYc7HyZe2x7rcdmQ==",
"dev": true,
"requires": {
"tslib": "^2.3.0"
}
},
"@babel/runtime": {
"version": "7.16.7",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.16.7.tgz",
@ -18560,6 +18619,12 @@
"resolved": "https://registry.npmjs.org/@types/cors/-/cors-2.8.12.tgz",
"integrity": "sha512-vt+kDhq/M2ayberEtJcIN/hxXy1Pk+59g2FV/ZQceeaTyCtCucjL2Q7FXlFjtWn4n15KCr1NE2lNNFhp0lEThw=="
},
"@types/d3": {
"version": "3.5.47",
"resolved": "https://registry.npmjs.org/@types/d3/-/d3-3.5.47.tgz",
"integrity": "sha512-VkWIQoZXLFdcBGe5pdBKJmTU3fmpXvo/KV6ixvTzOMl1yJ2hbTXpfvsziag0kcaerPDwas2T0vxojwQG3YwivQ==",
"dev": true
},
"@types/detect-indent": {
"version": "0.1.30",
"resolved": "https://registry.npmjs.org/@types/detect-indent/-/detect-indent-0.1.30.tgz",
@ -18610,6 +18675,15 @@
"resolved": "https://registry.npmjs.org/@types/node/-/node-17.0.9.tgz",
"integrity": "sha512-5dNBXu/FOER+EXnyah7rn8xlNrfMOQb/qXnw4NQgLkCygKBKhdmF/CA5oXVOKZLBEahw8s2WP9LxIcN/oDDRgQ=="
},
"@types/plotly.js": {
"version": "1.54.22",
"resolved": "https://registry.npmjs.org/@types/plotly.js/-/plotly.js-1.54.22.tgz",
"integrity": "sha512-/xL9++eA7VnIIZqNQOw6sZ7DtEmfoHj5rAD2CjU2LCOqem/BxTA1KlpdUWEHOiou6za4HKnM+Nvho3jTBPYJ/w==",
"dev": true,
"requires": {
"@types/d3": "^3"
}
},
"@types/socket.io": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/@types/socket.io/-/socket.io-3.0.2.tgz",
@ -21519,6 +21593,12 @@
"slash": "^3.0.0"
}
},
"gojs": {
"version": "2.2.11",
"resolved": "https://registry.npmjs.org/gojs/-/gojs-2.2.11.tgz",
"integrity": "sha512-Zb6VucKWQhPlZCGUvuQFUb7X+VAfcapxYpAhta4Yq+ACwOpcNIL9ewjiACfW3nz2bkKK2qbahJBdzVwnKBsvZg==",
"dev": true
},
"got": {
"version": "9.6.0",
"resolved": "https://registry.npmjs.org/got/-/got-9.6.0.tgz",
@ -30064,13 +30144,6 @@
"integrity": "sha512-KExVEeZWxMZnZhUZtsJcFwz8IvPvgu4G2Z2QyqjZQzUGr32KDYuSxrEYO4w3tFFNbfLozcrKUTvTPi+E9ywJkQ==",
"requires": {
"tslib": "^2.1.0"
},
"dependencies": {
"tslib": {
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.1.tgz",
"integrity": "sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw=="
}
}
},
"safe-buffer": {
@ -31198,6 +31271,11 @@
}
}
},
"tslib": {
"version": "2.4.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.0.tgz",
"integrity": "sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ=="
},
"type-check": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
@ -32360,6 +32438,16 @@
"resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz",
"integrity": "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==",
"dev": true
},
"zone.js": {
"version": "0.11.6",
"resolved": "https://registry.npmjs.org/zone.js/-/zone.js-0.11.6.tgz",
"integrity": "sha512-umJqFtKyZlPli669gB1gOrRE9hxUUGkZr7mo878z+NEBJZZixJkKeVYfnoLa7g25SseUDc92OZrMKKHySyJrFg==",
"dev": true,
"peer": true,
"requires": {
"tslib": "^2.3.0"
}
}
}
}

4
package.json
View File

@ -1,6 +1,6 @@
{
"name": "nope",
"version": "1.0.35",
"version": "1.1.00",
"description": "NoPE Runtime for Nodejs. For Browser-Support please use nope-browser",
"files": [
"dist-nodejs/**/*",
@ -71,6 +71,7 @@
"@types/chai": "^4.3.0",
"@types/lodash": "^4.14.178",
"@types/node": "^17.0.9",
"@types/plotly.js": "^1.54.22",
"@types/socket.io": "^3.0.1",
"@types/socket.io-client": "^1.4.36",
"chai": "^4.3.4",
@ -80,6 +81,7 @@
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-import": "^2.25.4",
"eslint-plugin-prettier": "^4.0.0",
"gojs": "^2.2.11",
"mocha": "^9.1.3",
"npm-check-updates": "^12.1.0",
"onchange": "^7.1.0",

3
tsconfig.browser.json
View File

@ -2,7 +2,8 @@
"compilerOptions": {
"target": "ES2019",
"lib": [
"esnext"
"esnext",
"dom"
],
"allowJs": true,
"allowUnusedLabels": true,

3
tsconfig.json
View File

@ -2,7 +2,8 @@
"compilerOptions": {
"target": "ES2019",
"lib": [
"esnext"
"esnext",
"dom"
],
"allowJs": true,
"allowUnusedLabels": true,