jpf-mobx 1.0.138 → 1.0.140

package/dist/controls/codeMirror/Editor/Editor.d.ts

@@ -0,0 +1,19 @@
+import { Element } from "../../../framework/element";
+import { Properties, IProperties } from "../../../framework/properties";
+import { ISubscribable } from "../../../framework/observable";
+export type mode = "json" | "html" | "css" | "less" | "javascript" | "typescript";
+export interface IEditorProperties extends IProperties {
+    mode: mode;
+    value?: string | ISubscribable<string>;
+}
+export declare class EditorElement extends Element<IEditorProperties> {
+    constructor(properties: IEditorProperties);
+    private editor;
+    build(): void;
+}
+export declare function createEditor(properties: IEditorProperties): EditorElement;
+export declare class EditorProperties extends Properties implements IEditorProperties {
+    constructor(properties: IEditorProperties);
+    mode: mode;
+    value?: string | ISubscribable<string>;
+}

package/dist/controls/codeMirror/Editor/Editor.js

@@ -0,0 +1,151 @@
+import { Element, registerElement } from "../../../framework/element";
+import { Properties, extendProperties } from "../../../framework/properties";
+import { isSubscribable, isObservableValue, unwrap } from "../../../framework/observable";
+import { EditorView, basicSetup } from "codemirror";
+import { EditorState } from "@codemirror/state";
+import { keymap } from "@codemirror/view";
+import { html } from "@codemirror/lang-html";
+import { json } from "@codemirror/lang-json";
+import { css } from "@codemirror/lang-css";
+import { indentWithTab } from "@codemirror/commands";
+import { foldAll } from "@codemirror/language";
+import { createButton } from "../../html/Button/Button";
+import { formatHtml, formatCss, formatJson, formatJavascript } from "../../../utilities/formatting/formatting";
+import { createDiv } from "../../html/Div/Div";
+export class EditorElement extends Element {
+    constructor(properties) {
+        super({
+            tagName: "div",
+            properties: extendProperties(properties, {
+                elementType: "CodeEditor",
+            }, {
+                attributes: {
+                    tabindex: 1
+                },
+                style: {
+                    display: "flex",
+                    flexDirection: "column",
+                    border: "1px solid #a3d0e4"
+                }
+            })
+        });
+    }
+    editor;
+    build() {
+        super.build();
+        const properties = this.properties;
+        const foldAllButton = createButton({
+            content: "Collapse all",
+            style: {
+                margin: "3px"
+            },
+            eventListeners: {
+                click: {
+                    listener: () => {
+                        foldAll(this.editor);
+                    }
+                }
+            }
+        });
+        const formatButton = createButton({
+            content: "Format",
+            style: {
+                margin: "3px"
+            },
+            eventListeners: {
+                click: {
+                    listener: () => {
+                        const code = this.editor.state.doc.toString();
+                        let formattedCode;
+                        switch (properties.mode) {
+                            case "html":
+                                formattedCode = formatHtml(code);
+                                break;
+                            case "css":
+                                formattedCode = formatCss(code);
+                                break;
+                            case "json":
+                                formattedCode = formatJson(code);
+                                break;
+                            case "javascript":
+                                formattedCode = formatJavascript(code);
+                                break;
+                            default:
+                                throw "Language not supported";
+                        }
+                        this.editor.dispatch({ changes: { from: 0, to: this.editor.state.doc.length, insert: formattedCode } });
+                    }
+                }
+            }
+        });
+        const saveButton = createButton({
+            content: "Save",
+            style: {
+                margin: "3px"
+            },
+            eventListeners: {
+                click: {
+                    listener: () => {
+                        if (isObservableValue(properties.value)) {
+                            properties.value.setValue(this.editor.state.doc.toString());
+                        }
+                    }
+                }
+            }
+        });
+        const buttons = createDiv({
+            style: {
+                display: "flex"
+            },
+            children: [
+                foldAllButton,
+                formatButton,
+                saveButton
+            ]
+        });
+        this.element.appendChild(buttons.render());
+        const extensions = [
+            basicSetup,
+            EditorView.lineWrapping,
+            keymap.of([indentWithTab])
+        ];
+        switch (properties.mode) {
+            case "html":
+                extensions.push(html());
+                break;
+            case "css":
+                extensions.push(css());
+                break;
+            case "json":
+                extensions.push(json());
+                break;
+            default:
+        }
+        this.editor = new EditorView({
+            state: EditorState.create({
+                extensions: extensions
+            }),
+            parent: this.element,
+        });
+        this.editor.dom.style.overflow = "auto";
+        this.editor.dispatch({ changes: { from: 0, to: this.editor.state.doc.length, insert: unwrap(properties.value) } });
+        if (isSubscribable(properties.value)) {
+            this.disposers.push(properties.value.subscribe((html) => {
+                this.editor.dispatch({ changes: { from: 0, to: this.editor.state.doc.length, insert: html } });
+            }));
+        }
+    }
+}
+export function createEditor(properties) {
+    return new EditorElement(properties);
+}
+export class EditorProperties extends Properties {
+    constructor(properties) {
+        super();
+        this.setProperties(this, properties);
+    }
+    mode;
+    value;
+}
+registerElement(EditorProperties.prototype.constructor, EditorElement);
+//# sourceMappingURL=Editor.js.map

package/dist/controls/codeMirror/Editor/Editor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Editor.js","sourceRoot":"","sources":["../../../../src/controls/codeMirror/Editor/Editor.ts"],"names":[],"mappings":"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"}

package/dist/controls/codeMirror/index.d.ts

@@ -0,0 +1 @@
+export * from "./Editor/Editor";

package/dist/controls/codeMirror/index.js

@@ -0,0 +1,2 @@
+export * from "./Editor/Editor";
+//# sourceMappingURL=index.js.map

package/dist/controls/codeMirror/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/controls/codeMirror/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC"}

package/dist/controls/custom/FileSelector/FileSelector.d.ts

@@ -0,0 +1,18 @@
+import { Properties, IProperties } from "../../../framework/properties";
+import { Element } from "../../../framework/element";
+import { IButtonProperties } from "../../html/Button/Button";
+import { IInputProperties } from "../../html/Input/Input";
+export interface IFileSelectorProperties extends IProperties {
+    button?: IButtonProperties;
+    inputFile: IInputProperties<FileList>;
+}
+export declare class FileSelectorElement extends Element<IFileSelectorProperties> {
+    constructor(properties: IFileSelectorProperties);
+    protected build(): void;
+}
+export declare function createFileSelector(properties: IFileSelectorProperties): FileSelectorElement;
+export declare class FileSelectorProperties extends Properties implements IFileSelectorProperties {
+    constructor(properties: IFileSelectorProperties);
+    button?: IButtonProperties;
+    inputFile: IInputProperties<FileList>;
+}

package/dist/controls/custom/FileSelector/FileSelector.js

@@ -0,0 +1,48 @@
+import { Properties, extendProperties } from "../../../framework/properties";
+import { Element, registerElement } from "../../../framework/element";
+import { createButton as buttonElement } from "../../html/Button/Button";
+import { createInput as inputElement } from "../../html/Input/Input";
+export class FileSelectorElement extends Element {
+    constructor(properties) {
+        super({
+            tagName: "div",
+            properties: extendProperties(properties, {}, {
+                elementType: "FileSelector"
+            })
+        });
+    }
+    build() {
+        super.build();
+        const properties = this.properties;
+        const inputProperties = properties.inputFile || {};
+        inputProperties.type = "file";
+        var fileInput = inputElement(inputProperties).render();
+        this.element.appendChild(fileInput);
+        if (properties.button) {
+            const button = buttonElement(extendProperties(properties.button, {
+                eventListeners: {
+                    click: {
+                        listener: () => {
+                            var mouseEvent = new MouseEvent("click");
+                            fileInput.dispatchEvent(mouseEvent);
+                        }
+                    }
+                }
+            })).render();
+            this.element.appendChild(button);
+        }
+    }
+}
+export function createFileSelector(properties) {
+    return new FileSelectorElement(properties);
+}
+export class FileSelectorProperties extends Properties {
+    constructor(properties) {
+        super();
+        this.setProperties(this, properties);
+    }
+    button;
+    inputFile;
+}
+registerElement(FileSelectorProperties.prototype.constructor, FileSelectorElement);
+//# sourceMappingURL=FileSelector.js.map

package/dist/controls/custom/FileSelector/FileSelector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileSelector.js","sourceRoot":"","sources":["../../../../src/controls/custom/FileSelector/FileSelector.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAe,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAC1F,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,EAAqB,YAAY,IAAI,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAC5F,OAAO,EAAE,WAAW,IAAI,YAAY,EAAoB,MAAM,wBAAwB,CAAC;AAOvF,MAAM,OAAO,mBAAoB,SAAQ,OAAgC;IACrE,YAAY,UAAmC;QAC3C,KAAK,CACD;YACI,OAAO,EAAE,KAAK;YACd,UAAU,EAAE,gBAAgB,CACxB,UAAU,EACV,EAAE,EACF;gBACI,WAAW,EAAE,cAAc;aAC9B,CACJ;SACJ,CACJ,CAAC;IACN,CAAC;IAES,KAAK;QACX,KAAK,CAAC,KAAK,EAAE,CAAC;QAEd,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;QACnC,MAAM,eAAe,GAAG,UAAU,CAAC,SAAS,IAAI,EAAgC,CAAC;QACjF,eAAe,CAAC,IAAI,GAAG,MAAM,CAAC;QAE9B,IAAI,SAAS,GAAG,YAAY,CAAC,eAAe,CAAC,CAAC,MAAM,EAAE,CAAC;QAEvD,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC;QAEpC,IAAI,UAAU,CAAC,MAAM,EAAE,CAAC;YACpB,MAAM,MAAM,GAAG,aAAa,CACxB,gBAAgB,CACZ,UAAU,CAAC,MAAM,EACjB;gBACI,cAAc,EAAE;oBACZ,KAAK,EAAE;wBACH,QAAQ,EAAE,GAAG,EAAE;4BACX,IAAI,UAAU,GAAG,IAAI,UAAU,CAAC,OAAO,CAAC,CAAC;4BACzC,SAAS,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;wBACxC,CAAC;qBACJ;iBACJ;aACJ,CACJ,CACJ,CAAC,MAAM,EAAE,CAAC;YAEX,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;QACrC,CAAC;IACL,CAAC;CACJ;AAED,MAAM,UAAU,kBAAkB,CAAC,UAAmC;IAClE,OAAO,IAAI,mBAAmB,CAAC,UAAU,CAAC,CAAC;AAC/C,CAAC;AAED,MAAM,OAAO,sBAAuB,SAAQ,UAAU;IAClD,YAAY,UAAmC;QAC3C,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,UAAU,CAAC,CAAC;IACzC,CAAC;IACD,MAAM,CAAqB;IAC3B,SAAS,CAA6B;CACzC;AAED,eAAe,CACX,sBAAsB,CAAC,SAAS,CAAC,WAAW,EAC5C,mBAAmB,CACtB,CAAC"}

package/dist/controls/custom/LabeledControl/LabeledControl.d.ts

@@ -0,0 +1,15 @@
+import { Properties, IProperties } from "../../../framework/properties";
+import { Element, IElement } from "../../../framework/element";
+export interface ILabeledViewProperties extends IProperties {
+    labelProperties: IProperties;
+    element: IElement;
+}
+export declare class LabeledControlElement extends Element<ILabeledViewProperties> {
+    constructor(properties: ILabeledViewProperties);
+}
+export declare function createLabeledControl(properties: ILabeledViewProperties): LabeledControlElement;
+export declare class LabeledControlProperties extends Properties implements ILabeledViewProperties {
+    constructor(properties: ILabeledViewProperties);
+    labelProperties: Properties;
+    element: IElement;
+}

package/dist/controls/custom/LabeledControl/LabeledControl.js

@@ -0,0 +1,32 @@
+import { Properties, extendProperties } from "../../../framework/properties";
+import { Element, registerElement } from "../../../framework/element";
+import { createDiv as divElement } from "../../html/Div/Div";
+export class LabeledControlElement extends Element {
+    constructor(properties) {
+        super({
+            tagName: "div",
+            properties: extendProperties(properties, {
+                elementType: "LabeledControl",
+                classNames: ["jpf-labled-control"]
+            })
+        }, [
+            divElement(extendProperties(properties.labelProperties, {
+                elementType: "Label"
+            })),
+            properties.element
+        ]);
+    }
+}
+export function createLabeledControl(properties) {
+    return new LabeledControlElement(properties);
+}
+export class LabeledControlProperties extends Properties {
+    constructor(properties) {
+        super();
+        this.setProperties(this, properties);
+    }
+    labelProperties;
+    element;
+}
+registerElement(LabeledControlProperties, LabeledControlElement);
+//# sourceMappingURL=LabeledControl.js.map

package/dist/controls/custom/LabeledControl/LabeledControl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LabeledControl.js","sourceRoot":"","sources":["../../../../src/controls/custom/LabeledControl/LabeledControl.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAe,gBAAgB,EAAE,MAAM,+BAA+B,CAAA;AACzF,OAAO,EAAE,OAAO,EAAY,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAChF,OAAO,EAAE,SAAS,IAAI,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAO7D,MAAM,OAAO,qBAAsB,SAAQ,OAA+B;IACtE,YAAY,UAAkC;QAC1C,KAAK,CACD;YACI,OAAO,EAAE,KAAK;YACd,UAAU,EAAE,gBAAgB,CACxB,UAAU,EACV;gBACI,WAAW,EAAE,gBAAgB;gBAC7B,UAAU,EAAE,CAAC,oBAAoB,CAAC;aACrC,CACJ;SACJ,EACD;YACI,UAAU,CACN,gBAAgB,CACZ,UAAU,CAAC,eAAe,EAC1B;gBACI,WAAW,EAAE,OAAO;aACvB,CACJ,CACJ;YACD,UAAU,CAAC,OAAO;SACrB,CACJ,CAAC;IACN,CAAC;CACJ;AAED,MAAM,UAAU,oBAAoB,CAAC,UAAkC;IACnE,OAAO,IAAI,qBAAqB,CAAC,UAAU,CAAC,CAAC;AACjD,CAAC;AAED,MAAM,OAAO,wBAAyB,SAAQ,UAAU;IACpD,YAAY,UAAkC;QAC1C,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,UAAU,CAAC,CAAC;IACzC,CAAC;IACD,eAAe,CAAa;IAC5B,OAAO,CAAW;CACrB;AAED,eAAe,CACX,wBAAwB,EACxB,qBAAqB,CACxB,CAAA"}

package/dist/controls/custom/ListItem/ListItem.d.ts

@@ -0,0 +1,37 @@
+import { Element } from "../../../framework/element";
+import { Properties, IProperties } from "../../../framework/properties";
+import { ISubscribable } from "../../../framework/observable";
+export interface IListItemProperties extends IProperties {
+    id: number | string;
+    text?: string | ISubscribable<string> | Properties;
+    select?: () => void;
+    order?: number | string;
+}
+export interface IHierarchicalListItemProperties extends IListItemProperties {
+    parentId?: number | string;
+    expanded?: boolean;
+    items?: Array<IHierarchicalListItemProperties>;
+}
+export declare class ListItemElement extends Element<IListItemProperties> {
+    constructor(properties: IListItemProperties);
+    build(): void;
+    private setContent;
+}
+export declare function createListItem(properties: IListItemProperties): ListItemElement;
+export declare class ListItemProperties extends Properties implements IListItemProperties {
+    constructor(properties: IListItemProperties);
+    id: number | string;
+    text?: string | Properties;
+    select?: () => void;
+    order?: number | string;
+}
+export declare class HierarchicalListItemProperties extends Properties implements IHierarchicalListItemProperties {
+    constructor(properties: IHierarchicalListItemProperties);
+    id: number | string;
+    text?: string | Properties;
+    select?: () => void;
+    order?: number | string;
+    parentId?: number | string;
+    expanded?: boolean;
+    items?: Array<IHierarchicalListItemProperties>;
+}

package/dist/controls/custom/ListItem/ListItem.js

@@ -0,0 +1,63 @@
+import { Element, getElement, registerElement } from "../../../framework/element";
+import { Properties, extendProperties } from "../../../framework/properties";
+import { isSubscribable, unwrap } from "../../../framework/observable";
+export class ListItemElement extends Element {
+    constructor(properties) {
+        super({
+            tagName: "div",
+            properties: extendProperties(properties, {
+                elementType: "ListItem"
+            })
+        });
+    }
+    build() {
+        super.build();
+        const properties = this.properties;
+        if (isSubscribable(properties.text)) {
+            this.setContent(unwrap(properties.text));
+            this.disposers.push(properties.text.subscribe((text) => {
+                this.setContent(text);
+            }));
+        }
+        else {
+            this.setContent(properties.text);
+        }
+    }
+    setContent(content) {
+        if (typeof content === "string") {
+            this.element.innerHTML = content;
+        }
+        else if (content instanceof Properties) {
+            this.setChildren(getElement(content));
+        }
+    }
+}
+export function createListItem(properties) {
+    return new ListItemElement(properties);
+}
+export class ListItemProperties extends Properties {
+    constructor(properties) {
+        super();
+        this.setProperties(this, properties);
+    }
+    id;
+    text;
+    select;
+    order;
+}
+registerElement(ListItemProperties.prototype.constructor, ListItemElement);
+export class HierarchicalListItemProperties extends Properties {
+    constructor(properties) {
+        super();
+        this.setProperties(this, properties);
+    }
+    id;
+    text;
+    select;
+    order;
+    parentId;
+    expanded;
+    items;
+}
+registerElement(HierarchicalListItemProperties, ListItemElement);
+//# sourceMappingURL=ListItem.js.map

package/dist/controls/custom/ListItem/ListItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItem.js","sourceRoot":"","sources":["../../../../src/controls/custom/ListItem/ListItem.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAClF,OAAO,EAAE,UAAU,EAAe,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAC1F,OAAO,EAAE,cAAc,EAAiB,MAAM,EAAE,MAAM,+BAA+B,CAAC;AAkBtF,MAAM,OAAO,eAAgB,SAAQ,OAA4B;IAC7D,YAAY,UAA+B;QACvC,KAAK,CACD;YACI,OAAO,EAAE,KAAK;YACd,UAAU,EAAE,gBAAgB,CACxB,UAAU,EACV;gBACI,WAAW,EAAE,UAAU;aAC1B,CACJ;SACJ,CACJ,CAAC;IACN,CAAC;IAED,KAAK;QACD,KAAK,CAAC,KAAK,EAAE,CAAC;QAEd,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;QAEnC,IAAI,cAAc,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;YAClC,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC;YACzC,IAAI,CAAC,SAAS,CAAC,IAAI,CACf,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,IAAI,EAAC,EAAE;gBAC5B,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;YAC5B,CAAC,CAAC,CACL,CAAC;QACN,CAAC;aAAM,CAAC;YACJ,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QACrC,CAAC;IACL,CAAC;IAEO,UAAU,CAAC,OAA4B;QAC3C,IAAI,OAAO,OAAO,KAAK,QAAQ,EAAE,CAAC;YAC9B,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,OAAO,CAAC;QACrC,CAAC;aAAM,IAAI,OAAO,YAAY,UAAU,EAAE,CAAC;YACvC,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC;QAC1C,CAAC;IACL,CAAC;CACJ;AAED,MAAM,UAAU,cAAc,CAAC,UAA+B;IAC1D,OAAO,IAAI,eAAe,CAAC,UAAU,CAAC,CAAC;AAC3C,CAAC;AAED,MAAM,OAAO,kBAAmB,SAAQ,UAAU;IAC9C,YAAY,UAA+B;QACvC,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,UAAU,CAAC,CAAC;IACzC,CAAC;IACD,EAAE,CAAkB;IACpB,IAAI,CAAuB;IAC3B,MAAM,CAAc;IACpB,KAAK,CAAmB;CAC3B;AAED,eAAe,CACX,kBAAkB,CAAC,SAAS,CAAC,WAAW,EACxC,eAAe,CAClB,CAAC;AAEF,MAAM,OAAO,8BAA+B,SAAQ,UAAU;IAC1D,YAAY,UAA2C;QACnD,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,UAAU,CAAC,CAAC;IACzC,CAAC;IACD,EAAE,CAAkB;IACpB,IAAI,CAAuB;IAC3B,MAAM,CAAc;IACpB,KAAK,CAAmB;IACxB,QAAQ,CAAmB;IAC3B,QAAQ,CAAW;IACnB,KAAK,CAA0C;CAClD;AAED,eAAe,CACX,8BAA8B,EAC9B,eAAe,CAClB,CAAA"}

package/dist/controls/custom/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./FileSelector/FileSelector";
+export * from "./LabeledControl/LabeledControl";
+export * from "./ListItem/ListItem";

package/dist/controls/custom/index.js

@@ -0,0 +1,4 @@
+export * from "./FileSelector/FileSelector";
+export * from "./LabeledControl/LabeledControl";
+export * from "./ListItem/ListItem";
+//# sourceMappingURL=index.js.map

package/dist/controls/custom/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/controls/custom/index.ts"],"names":[],"mappings":"AAAA,cAAc,6BAA6B,CAAC;AAC5C,cAAc,iCAAiC,CAAC;AAChD,cAAc,qBAAqB,CAAC"}

package/dist/controls/html/Button/Button.d.ts

@@ -0,0 +1,16 @@
+import { Properties, IProperties } from "../../../framework/properties";
+import { Element } from "../../../framework/element";
+import { ISubscribable } from "../../../framework/observable";
+export interface IButtonProperties extends IProperties {
+    content?: string | Properties | ISubscribable<string | Properties>;
+}
+export declare class ButtonElement extends Element<IButtonProperties> {
+    constructor(properties: IButtonProperties);
+    build(): void;
+    private buildContent;
+}
+export declare function createButton(properties: IButtonProperties): ButtonElement;
+export declare class ButtonProperties extends Properties implements IButtonProperties {
+    constructor(properties: IButtonProperties);
+    content?: string | Properties | ISubscribable<string | Properties>;
+}

package/dist/controls/html/Button/Button.js

@@ -0,0 +1,48 @@
+import { Properties, extendProperties } from "../../../framework/properties";
+import { Element, getElement, registerElement } from "../../../framework/element";
+import { isSubscribable, unwrap } from "../../../framework/observable";
+export class ButtonElement extends Element {
+    constructor(properties) {
+        super({
+            tagName: "button",
+            properties: extendProperties(properties, {
+                elementType: "Button"
+            })
+        });
+    }
+    build() {
+        super.build();
+        const properties = this.properties;
+        if (properties.content) {
+            this.buildContent(unwrap(properties.content));
+            if (isSubscribable(properties.content)) {
+                this.disposers.push(properties.content.subscribe((content) => {
+                    this.buildContent(content);
+                }));
+            }
+        }
+    }
+    buildContent(content) {
+        if (content == null || content === undefined) {
+            this.element.innerText = null;
+        }
+        else if (typeof content === "string") {
+            this.element.innerText = content;
+        }
+        else if (content instanceof Properties) {
+            this.setChildren(getElement(content));
+        }
+    }
+}
+export function createButton(properties) {
+    return new ButtonElement(properties);
+}
+export class ButtonProperties extends Properties {
+    constructor(properties) {
+        super();
+        this.setProperties(this, properties);
+    }
+    content;
+}
+registerElement(ButtonProperties.prototype.constructor, ButtonElement);
+//# sourceMappingURL=Button.js.map

package/dist/controls/html/Button/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../../src/controls/html/Button/Button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAe,gBAAgB,EAAE,MAAM,+BAA+B,CAAA;AACzF,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAClF,OAAO,EAAiB,cAAc,EAAE,MAAM,EAAE,MAAM,+BAA+B,CAAC;AAMtF,MAAM,OAAO,aAAc,SAAQ,OAA0B;IACzD,YAAY,UAA6B;QACrC,KAAK,CACD;YACI,OAAO,EAAE,QAAQ;YACjB,UAAU,EAAE,gBAAgB,CACxB,UAAU,EACV;gBACI,WAAW,EAAE,QAAQ;aACxB,CACJ;SACJ,CACJ,CAAC;IACN,CAAC;IAED,KAAK;QACD,KAAK,CAAC,KAAK,EAAE,CAAC;QAEd,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;QACnC,IAAI,UAAU,CAAC,OAAO,EAAE,CAAC;YACrB,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC;YAE9C,IAAI,cAAc,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE,CAAC;gBACrC,IAAI,CAAC,SAAS,CAAC,IAAI,CACf,UAAU,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,OAAO,EAAC,EAAE;oBAC/B,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;gBACpC,CAAC,CAAC,CASL,CAAC;YACN,CAAC;QACL,CAAC;IACL,CAAC;IAEO,YAAY,CAAC,OAA4B;QAC7C,IAAI,OAAO,IAAI,IAAI,IAAI,OAAO,KAAK,SAAS,EAAE,CAAC;YAC3C,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC;QAClC,CAAC;aACI,IAAI,OAAO,OAAO,KAAK,QAAQ,EAAE,CAAC;YACnC,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,OAAO,CAAC;QACrC,CAAC;aACI,IAAI,OAAO,YAAY,UAAU,EAAE,CAAC;YACrC,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,OAAqB,CAAC,CAAC,CAAC;QACxD,CAAC;IACL,CAAC;CACJ;AAED,MAAM,UAAU,YAAY,CAAC,UAA6B;IACtD,OAAO,IAAI,aAAa,CAAC,UAAU,CAAC,CAAC;AACzC,CAAC;AAED,MAAM,OAAO,gBAAiB,SAAQ,UAAU;IAC5C,YAAY,UAA6B;QACrC,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,UAAU,CAAC,CAAC;IACzC,CAAC;IACD,OAAO,CAA4D;CACtE;AAED,eAAe,CACX,gBAAgB,CAAC,SAAS,CAAC,WAAW,EACtC,aAAa,CAChB,CAAC"}

package/dist/controls/html/Div/Div.d.ts

@@ -0,0 +1,14 @@
+import { Element, IElement } from "../../../framework/element";
+import { IProperties, Properties } from "../../../framework/properties";
+import { ISubscribable } from "../../../framework/observable";
+export interface IDivProperties extends IProperties {
+    children?: Array<IElement> | ISubscribable<Array<IElement>>;
+}
+export declare class DivElement extends Element<IDivProperties> {
+    constructor(properties: IDivProperties);
+}
+export declare function createDiv(properties: IDivProperties): DivElement;
+export declare class DivProperties extends Properties implements IDivProperties {
+    constructor(properties: IDivProperties);
+    children?: Array<IElement> | ISubscribable<Array<IElement>>;
+}

package/dist/controls/html/Div/Div.js

@@ -0,0 +1,24 @@
+import { Element, registerElement } from "../../../framework/element";
+import { extendProperties, Properties } from "../../../framework/properties";
+export class DivElement extends Element {
+    constructor(properties) {
+        super({
+            tagName: "div",
+            properties: extendProperties(properties, {
+                elementType: "Div"
+            })
+        }, properties.children);
+    }
+}
+export function createDiv(properties) {
+    return new DivElement(properties);
+}
+export class DivProperties extends Properties {
+    constructor(properties) {
+        super();
+        this.setProperties(this, properties);
+    }
+    children;
+}
+registerElement(DivProperties.prototype.constructor, DivElement);
+//# sourceMappingURL=Div.js.map

package/dist/controls/html/Div/Div.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Div.js","sourceRoot":"","sources":["../../../../src/controls/html/Div/Div.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAY,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAChF,OAAO,EAAe,gBAAgB,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAC;AAM1F,MAAM,OAAO,UAAW,SAAQ,OAAuB;IACnD,YAAY,UAA0B;QAClC,KAAK,CACD;YACI,OAAO,EAAE,KAAK;YACd,UAAU,EAAE,gBAAgB,CACxB,UAAU,EACV;gBACI,WAAW,EAAE,KAAK;aACrB,CACJ;SACJ,EACD,UAAU,CAAC,QAAQ,CACtB,CAAC;IACN,CAAC;CACJ;AAED,MAAM,UAAU,SAAS,CAAC,UAA0B;IAChD,OAAO,IAAI,UAAU,CAAC,UAAU,CAAC,CAAC;AACtC,CAAC;AAED,MAAM,OAAO,aAAc,SAAQ,UAAU;IACzC,YAAY,UAA0B;QAClC,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,UAAU,CAAC,CAAC;IACzC,CAAC;IACD,QAAQ,CAAoD;CAC/D;AAED,eAAe,CACX,aAAa,CAAC,SAAS,CAAC,WAAW,EACnC,UAAU,CACb,CAAA"}

package/dist/controls/html/Image/Image.d.ts

@@ -0,0 +1,16 @@
+import { Element } from "../../../framework/element";
+import { Properties, IProperties } from "../../../framework/properties";
+import { ISubscribable } from "../../../framework/observable";
+export interface IImageProperties extends IProperties {
+    src: string | ISubscribable<string>;
+    alt: string | ISubscribable<string>;
+}
+export declare class ImageElement extends Element<IImageProperties> {
+    constructor(properties: IImageProperties);
+}
+export declare function createImage(properties: IImageProperties): ImageElement;
+export declare class ImageProperties extends Properties implements IImageProperties {
+    constructor(properties: IImageProperties);
+    src: string | ISubscribable<string>;
+    alt: string | ISubscribable<string>;
+}

package/dist/controls/html/Image/Image.js

@@ -0,0 +1,30 @@
+import { Element, registerElement } from "../../../framework/element";
+import { Properties, extendProperties } from "../../../framework/properties";
+export class ImageElement extends Element {
+    constructor(properties) {
+        super({
+            tagName: "img",
+            properties: extendProperties(properties, {
+                elementType: "Image",
+            }, {
+                attributes: {
+                    src: properties.src,
+                    alt: properties.alt
+                }
+            })
+        });
+    }
+}
+export function createImage(properties) {
+    return new ImageElement(properties);
+}
+export class ImageProperties extends Properties {
+    constructor(properties) {
+        super();
+        this.setProperties(this, properties);
+    }
+    src;
+    alt;
+}
+registerElement(ImageProperties.prototype.constructor, ImageElement);
+//# sourceMappingURL=Image.js.map

package/dist/controls/html/Image/Image.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Image.js","sourceRoot":"","sources":["../../../../src/controls/html/Image/Image.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,EAAE,UAAU,EAAe,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAQ1F,MAAM,OAAO,YAAa,SAAQ,OAAyB;IACvD,YAAY,UAA4B;QACpC,KAAK,CACD;YACI,OAAO,EAAE,KAAK;YACd,UAAU,EAAE,gBAAgB,CACxB,UAAU,EACV;gBACI,WAAW,EAAE,OAAO;aACvB,EACD;gBACI,UAAU,EAAE;oBACR,GAAG,EAAE,UAAU,CAAC,GAAG;oBACnB,GAAG,EAAE,UAAU,CAAC,GAAG;iBACtB;aACJ,CACJ;SACJ,CACJ,CAAC;IACN,CAAC;CACJ;AAED,MAAM,UAAU,WAAW,CAAC,UAA4B;IACpD,OAAO,IAAI,YAAY,CAAC,UAAU,CAAC,CAAC;AACxC,CAAC;AAED,MAAM,OAAO,eAAgB,SAAQ,UAAU;IAC3C,YAAY,UAA4B;QACpC,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,UAAU,CAAC,CAAC;IACzC,CAAC;IACD,GAAG,CAAiC;IACpC,GAAG,CAAiC;CACvC;AAED,eAAe,CACX,eAAe,CAAC,SAAS,CAAC,WAAW,EACrC,YAAY,CACf,CAAC"}

package/dist/controls/html/Input/Input.d.ts

@@ -0,0 +1,34 @@
+import { Element } from "../../../framework/element";
+import { Properties, IProperties } from "../../../framework/properties";
+import { ISubscribable } from "../../../framework/observable";
+export type InputType = "text" | "checkbox" | "file" | "integer" | "float" | "range" | "radio";
+export declare enum ValueUpdateModeEnum {
+    OnChange = 1,
+    OnInput = 2
+}
+export interface IInputProperties<TValue> extends IProperties {
+    value?: TValue | ISubscribable<TValue>;
+    inputValidator?: (event: Event, inputViewModel: IInputProperties<TValue>, value: string) => Promise<boolean>;
+    placeholder?: string | ISubscribable<string>;
+    valueUpdateMode?: ValueUpdateModeEnum;
+    min?: number;
+    max?: number;
+    step?: number;
+    type?: InputType;
+}
+export declare class InputElement<TValue> extends Element<IInputProperties<TValue>> {
+    constructor(properties: IInputProperties<TValue>);
+    protected build(): void;
+}
+export declare function createInput<TValue>(properties: IInputProperties<TValue>): InputElement<TValue>;
+export declare class InputProperties<TValue> extends Properties implements IInputProperties<TValue> {
+    constructor(properties: IInputProperties<TValue>);
+    value?: TValue | ISubscribable<TValue>;
+    inputValidator?: (event: Event, inputViewModel: InputProperties<TValue>, value: string) => Promise<boolean>;
+    placeholder?: string | ISubscribable<string>;
+    valueUpdateMode?: ValueUpdateModeEnum;
+    min?: number;
+    max?: number;
+    step?: number;
+    type?: InputType;
+}