jsl-ui 9.28.2 → 9.28.3

package/lib/components/stack-panel/SplitterComponent.d.ts

@@ -1,21 +1,21 @@
-import "./SplitterStyle.scss";
-import { IJSLComponent, IJSLVNode } from "jsl-render";
-import { EventHandler } from "../../interaction/eventhandler";
-export interface ISplitterComponentOptions {
-    minSizesInPX?: number[];
-    maxSizesInPX?: number[];
-    onResize?: EventHandler<void>;
-    onResizeDone?: EventHandler<ISplitterDoneArgs>;
-}
-export interface ISplitterDoneArgs {
-    size1InPX?: number;
-}
-export declare class SplitterComponent implements IJSLComponent {
-    private static listenerRegistered;
-    _is_splitter: boolean;
-    private options;
-    constructor(options?: ISplitterComponentOptions);
-    isEqual(node: IJSLComponent): boolean;
-    render(): IJSLVNode;
-    private registerListener;
-}
+import "./SplitterStyle.scss";
+import { IJSLComponent, IJSLVNode } from "jsl-render";
+import { EventHandler } from "../../interaction/eventhandler";
+export interface ISplitterComponentOptions {
+    minSizesInPX?: number[];
+    maxSizesInPX?: number[];
+    onResize?: EventHandler<void>;
+    onResizeDone?: EventHandler<ISplitterDoneArgs>;
+}
+export interface ISplitterDoneArgs {
+    size1InPX?: number;
+}
+export declare class SplitterComponent implements IJSLComponent {
+    private static listenerRegistered;
+    _is_splitter: boolean;
+    private options;
+    constructor(options?: ISplitterComponentOptions);
+    isEqual(node: IJSLComponent): boolean;
+    render(): IJSLVNode;
+    private registerListener;
+}

package/lib/components/stack-panel/SplitterComponent.js

@@ -1,126 +1,124 @@
-import "./SplitterStyle.scss";
-var SplitterComponent = /** @class */ (function () {
-    function SplitterComponent(options) {
-        // tslint:disable-next-line: variable-name
-        this._is_splitter = true;
-        this.options = options !== null && options !== void 0 ? options : {};
-        if (this.options.minSizesInPX == null) {
-            this.options.minSizesInPX = [];
-        }
-        if (this.options.minSizesInPX[0] == null) {
-            this.options.minSizesInPX[0] = 0;
-        }
-        if (this.options.minSizesInPX[1] == null) {
-            this.options.minSizesInPX[1] = 0;
-        }
-        if (this.options.maxSizesInPX == null) {
-            this.options.maxSizesInPX = [];
-        }
-        if (!SplitterComponent.listenerRegistered) {
-            SplitterComponent.listenerRegistered = true;
-            this.registerListener();
-        }
-    }
-    SplitterComponent.prototype.isEqual = function (node) {
-        return this.__proto__ === node.__proto__;
-    };
-    SplitterComponent.prototype.render = function () {
-        return { tag: "div", attr: { class: "split-comp" } };
-    };
-    SplitterComponent.prototype.registerListener = function () {
-        var dragStartX = 0;
-        var draggedEl;
-        var elLeft;
-        var elRight;
-        var elLeftWidth;
-        var elRightWidth;
-        var isDown;
-        function mousemove(e) {
-            var _a;
-            if (!isDown) {
-                return;
-            }
-            e.preventDefault();
-            // e.stopPropagation();
-            // e.stopImmediatePropagation();
-            var x;
-            var orientation = draggedEl.parentElement.classList.contains("vstackpanel") ? "vertical" : "horizontal";
-            var component = draggedEl._component;
-            if (orientation === "horizontal") {
-                x = e.pageX != null ? e.pageX : e.touches[0].pageX;
-            }
-            else {
-                x = e.pageY != null ? e.pageY : e.touches[0].pageY;
-            }
-            var delta = dragStartX - x;
-            if ((elLeftWidth - delta) < component.options.minSizesInPX[0] ||
-                (elRightWidth + delta) < component.options.minSizesInPX[1]) {
-                return;
-            }
-            if ((elLeftWidth - delta) > component.options.maxSizesInPX[0] ||
-                (elRightWidth + delta) > component.options.maxSizesInPX[1]) {
-                return;
-            }
-            if (orientation === "horizontal") {
-                elLeft.style.width = (elLeftWidth - delta) + "px";
-                elRight.style.width = (elRightWidth + delta) + "px";
-            }
-            else {
-                elLeft.style.height = (elLeftWidth - delta) + "px";
-                elRight.style.height = (elRightWidth + delta) + "px";
-            }
-            (_a = component.options.onResize) === null || _a === void 0 ? void 0 : _a.notify();
-        }
-        function mouseup(e) {
-            var _a;
-            isDown = false;
-            // document.removeEventListener("mousemove", mousemove);
-            // document.removeEventListener("touchmove", mousemove);
-            document.removeEventListener("mouseup", mousedown);
-            document.removeEventListener("touchend", mousedown);
-            var component = draggedEl._component;
-            var area1 = draggedEl.previousElementSibling;
-            var args = {};
-            if (area1 != null) {
-                args.size1InPX = area1.getBoundingClientRect().width;
-            }
-            (_a = component.options.onResizeDone) === null || _a === void 0 ? void 0 : _a.notify(args);
-        }
-        function mousedown(e) {
-            if (e.target.classList.contains("split-comp")) {
-                isDown = true;
-                var orientation_1 = e.target.parentElement.classList.contains("vstackpanel") ? "vertical" : "horizontal";
-                if (orientation_1 === "horizontal") {
-                    dragStartX = e.pageX != null ? e.pageX : e.touches[0].pageX;
-                }
-                else {
-                    dragStartX = e.pageY != null ? e.pageY : e.touches[0].pageY;
-                }
-                draggedEl = e.target;
-                elLeft = draggedEl.previousElementSibling;
-                elRight = draggedEl.nextElementSibling;
-                if (elLeft != null && elRight != null) {
-                    if (orientation_1 === "horizontal") {
-                        elLeftWidth = elLeft.getBoundingClientRect().width;
-                        elRightWidth = elRight.getBoundingClientRect().width;
-                    }
-                    else {
-                        elLeftWidth = elLeft.getBoundingClientRect().height;
-                        elRightWidth = elRight.getBoundingClientRect().height;
-                    }
-                    document.body.addEventListener("mousemove", mousemove, { passive: false });
-                    document.body.addEventListener("touchmove", mousemove, { passive: false });
-                    document.body.addEventListener("mouseup", mouseup, false);
-                    document.body.addEventListener("touchend", mouseup, false);
-                }
-            }
-        }
-        document.addEventListener("mousedown", mousedown);
-        document.addEventListener("touchstart", mousedown);
-        document.removeEventListener("mousemove", mousemove);
-        document.removeEventListener("touchmove", mousemove);
-    };
-    SplitterComponent.listenerRegistered = false;
-    return SplitterComponent;
-}());
-export { SplitterComponent };
+import "./SplitterStyle.scss";
+export class SplitterComponent {
+    constructor(options) {
+        // tslint:disable-next-line: variable-name
+        this._is_splitter = true;
+        this.options = options !== null && options !== void 0 ? options : {};
+        if (this.options.minSizesInPX == null) {
+            this.options.minSizesInPX = [];
+        }
+        if (this.options.minSizesInPX[0] == null) {
+            this.options.minSizesInPX[0] = 0;
+        }
+        if (this.options.minSizesInPX[1] == null) {
+            this.options.minSizesInPX[1] = 0;
+        }
+        if (this.options.maxSizesInPX == null) {
+            this.options.maxSizesInPX = [];
+        }
+        if (!SplitterComponent.listenerRegistered) {
+            SplitterComponent.listenerRegistered = true;
+            this.registerListener();
+        }
+    }
+    isEqual(node) {
+        return this.__proto__ === node.__proto__;
+    }
+    render() {
+        return { tag: "div", attr: { class: "split-comp" } };
+    }
+    registerListener() {
+        let dragStartX = 0;
+        let draggedEl;
+        let elLeft;
+        let elRight;
+        let elLeftWidth;
+        let elRightWidth;
+        let isDown;
+        function mousemove(e) {
+            var _a;
+            if (!isDown) {
+                return;
+            }
+            e.preventDefault();
+            // e.stopPropagation();
+            // e.stopImmediatePropagation();
+            let x;
+            const orientation = draggedEl.parentElement.classList.contains("vstackpanel") ? "vertical" : "horizontal";
+            const component = draggedEl._component;
+            if (orientation === "horizontal") {
+                x = e.pageX != null ? e.pageX : e.touches[0].pageX;
+            }
+            else {
+                x = e.pageY != null ? e.pageY : e.touches[0].pageY;
+            }
+            const delta = dragStartX - x;
+            if ((elLeftWidth - delta) < component.options.minSizesInPX[0] ||
+                (elRightWidth + delta) < component.options.minSizesInPX[1]) {
+                return;
+            }
+            if ((elLeftWidth - delta) > component.options.maxSizesInPX[0] ||
+                (elRightWidth + delta) > component.options.maxSizesInPX[1]) {
+                return;
+            }
+            if (orientation === "horizontal") {
+                elLeft.style.width = (elLeftWidth - delta) + "px";
+                elRight.style.width = (elRightWidth + delta) + "px";
+            }
+            else {
+                elLeft.style.height = (elLeftWidth - delta) + "px";
+                elRight.style.height = (elRightWidth + delta) + "px";
+            }
+            (_a = component.options.onResize) === null || _a === void 0 ? void 0 : _a.notify();
+        }
+        function mouseup(e) {
+            var _a;
+            isDown = false;
+            // document.removeEventListener("mousemove", mousemove);
+            // document.removeEventListener("touchmove", mousemove);
+            document.removeEventListener("mouseup", mousedown);
+            document.removeEventListener("touchend", mousedown);
+            const component = draggedEl._component;
+            const area1 = draggedEl.previousElementSibling;
+            const args = {};
+            if (area1 != null) {
+                args.size1InPX = area1.getBoundingClientRect().width;
+            }
+            (_a = component.options.onResizeDone) === null || _a === void 0 ? void 0 : _a.notify(args);
+        }
+        function mousedown(e) {
+            if (e.target.classList.contains("split-comp")) {
+                isDown = true;
+                const orientation = e.target.parentElement.classList.contains("vstackpanel") ? "vertical" : "horizontal";
+                if (orientation === "horizontal") {
+                    dragStartX = e.pageX != null ? e.pageX : e.touches[0].pageX;
+                }
+                else {
+                    dragStartX = e.pageY != null ? e.pageY : e.touches[0].pageY;
+                }
+                draggedEl = e.target;
+                elLeft = draggedEl.previousElementSibling;
+                elRight = draggedEl.nextElementSibling;
+                if (elLeft != null && elRight != null) {
+                    if (orientation === "horizontal") {
+                        elLeftWidth = elLeft.getBoundingClientRect().width;
+                        elRightWidth = elRight.getBoundingClientRect().width;
+                    }
+                    else {
+                        elLeftWidth = elLeft.getBoundingClientRect().height;
+                        elRightWidth = elRight.getBoundingClientRect().height;
+                    }
+                    document.body.addEventListener("mousemove", mousemove, { passive: false });
+                    document.body.addEventListener("touchmove", mousemove, { passive: false });
+                    document.body.addEventListener("mouseup", mouseup, false);
+                    document.body.addEventListener("touchend", mouseup, false);
+                }
+            }
+        }
+        document.addEventListener("mousedown", mousedown);
+        document.addEventListener("touchstart", mousedown);
+        document.removeEventListener("mousemove", mousemove);
+        document.removeEventListener("touchmove", mousemove);
+    }
+}
+SplitterComponent.listenerRegistered = false;

package/lib/components/stack-panel/StackPanelComponent.d.ts

@@ -1,20 +1,20 @@
-import "./StackPanelStyle.scss";
-import { IJSLComponent, IJSLVNode } from "jsl-render";
-export interface IStackPanelOptions {
-    orientation?: "horizontal" | "vertical";
-    valign?: "center" | "stretch" | "top" | "bottom" | "baseline";
-    class?: string;
-    style?: string;
-    responsive?: boolean;
-    flexForChildren?: boolean;
-    sizes?: Array<string | undefined>;
-    wrap?: boolean;
-}
-export declare class StackPanelComponent implements IJSLComponent {
-    private children;
-    private options;
-    constructor(children: Array<IJSLVNode | IJSLComponent>, options?: IStackPanelOptions);
-    isEqual(node: IJSLComponent): boolean;
-    render(): IJSLVNode;
-    private getSize;
-}
+import "./StackPanelStyle.scss";
+import { IJSLComponent, IJSLVNode } from "jsl-render";
+export interface IStackPanelOptions {
+    orientation?: "horizontal" | "vertical";
+    valign?: "center" | "stretch" | "top" | "bottom" | "baseline";
+    class?: string;
+    style?: string;
+    responsive?: boolean;
+    flexForChildren?: boolean;
+    sizes?: Array<string | undefined>;
+    wrap?: boolean;
+}
+export declare class StackPanelComponent implements IJSLComponent {
+    private children;
+    private options;
+    constructor(children: Array<IJSLVNode | IJSLComponent>, options?: IStackPanelOptions);
+    isEqual(node: IJSLComponent): boolean;
+    render(): IJSLVNode;
+    private getSize;
+}

package/lib/components/stack-panel/StackPanelComponent.js

@@ -1,64 +1,50 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import "./StackPanelStyle.scss";
-var StackPanelComponent = /** @class */ (function () {
-    function StackPanelComponent(children, options) {
-        this.children = children;
-        this.options = __assign({ orientation: "horizontal", valign: "stretch" }, options);
-    }
-    StackPanelComponent.prototype.isEqual = function (node) {
-        return this.__proto__ === node.__proto__;
-    };
-    StackPanelComponent.prototype.render = function () {
-        var _this = this;
-        var c = this.options.orientation === "horizontal" ? "stackpanel-comp hstackpanel" : "stackpanel-comp vstackpanel";
-        if (this.options.responsive) {
-            c += " responsive";
-        }
-        if (this.options.wrap) {
-            c += " wrap";
-        }
-        if (this.options.class) {
-            c += " " + this.options.class;
-        }
-        var va = this.options.valign;
-        var s = "align-items:" + (va === "top" ? "flex-start" : (va === "bottom" ? "flex-end" : va));
-        if (this.options.style) {
-            s += ";" + this.options.style;
-        }
-        return {
-            tag: "div", attr: { class: c, style: s },
-            children: this.children.map(function (x, idx) { return x != null && x._is_splitter === true ? x : ({
-                tag: "div",
-                attr: { style: _this.getSize(idx) + (_this.options.flexForChildren ? ";display:flex" : "") },
-                children: [x]
-            }); })
-        };
-    };
-    StackPanelComponent.prototype.getSize = function (idx) {
-        if (this.options.sizes != null && this.options.sizes[idx] != null) {
-            var s = this.options.sizes[idx];
-            if (s === "*") {
-                return undefined;
-            }
-            if (this.options.orientation === "vertical") {
-                return "height: " + s;
-            }
-            else {
-                return "width:" + s;
-            }
-        }
-        return "flex-grow:1;";
-    };
-    return StackPanelComponent;
-}());
-export { StackPanelComponent };
+import "./StackPanelStyle.scss";
+export class StackPanelComponent {
+    constructor(children, options) {
+        this.children = children;
+        this.options = { ...{ orientation: "horizontal", valign: "stretch" }, ...options };
+    }
+    isEqual(node) {
+        return this.__proto__ === node.__proto__;
+    }
+    render() {
+        let c = this.options.orientation === "horizontal" ? "stackpanel-comp hstackpanel" : "stackpanel-comp vstackpanel";
+        if (this.options.responsive) {
+            c += " responsive";
+        }
+        if (this.options.wrap) {
+            c += " wrap";
+        }
+        if (this.options.class) {
+            c += " " + this.options.class;
+        }
+        const va = this.options.valign;
+        let s = "align-items:" + (va === "top" ? "flex-start" : (va === "bottom" ? "flex-end" : va));
+        if (this.options.style) {
+            s += ";" + this.options.style;
+        }
+        return {
+            tag: "div", attr: { class: c, style: s },
+            children: this.children.map((x, idx) => x != null && x._is_splitter === true ? x : ({
+                tag: "div",
+                attr: { style: this.getSize(idx) + (this.options.flexForChildren ? ";display:flex" : "") },
+                children: [x]
+            }))
+        };
+    }
+    getSize(idx) {
+        if (this.options.sizes != null && this.options.sizes[idx] != null) {
+            const s = this.options.sizes[idx];
+            if (s === "*") {
+                return undefined;
+            }
+            if (this.options.orientation === "vertical") {
+                return "height: " + s;
+            }
+            else {
+                return "width:" + s;
+            }
+        }
+        return "flex-grow:1;";
+    }
+}

package/lib/components/tabs/TabsComponent.d.ts

@@ -1,40 +1,40 @@
-import "./TabsStyle.scss";
-import { IJSLComponent, IJSLVNode, JSLRender } from "jsl-render";
-export interface ITabItemOption {
-    id?: string;
-    header: IJSLVNode | string | IJSLComponent;
-    enabled?: boolean;
-    content?: IJSLVNode | string | IJSLComponent;
-    onCreate?: () => IJSLVNode | string | IJSLComponent;
-    canClose?: boolean;
-    onClosing?: () => boolean;
-}
-export interface ITabOptions {
-    tabs?: ITabItemOption[];
-    contentClass?: string;
-    class?: string;
-    style?: string;
-    selectedIndex?: number;
-    onSelect?: (index?: number) => boolean | void;
-    maxHeight?: string;
-    preserveContent?: boolean;
-}
-export declare class TabsComponent implements IJSLComponent {
-    private options?;
-    State: {
-        selectedIndex: any;
-    };
-    private renderer;
-    constructor(options?: ITabOptions);
-    getActiveTabIndex(): number;
-    render(): IJSLVNode;
-    AddTab(tabItem: ITabItemOption): number;
-    EnableAll(): void;
-    DisableAll(): void;
-    GetByID(id: string): ITabItemOption;
-    closeTabIndex(index: number, raiseSelectEvent?: boolean): boolean;
-    onInit(renderer: JSLRender): void;
-    SetSelectedTab(index: number): void;
-    private toNode;
-    private checkForDuplicateIds;
-}
+import "./TabsStyle.scss";
+import { IJSLComponent, IJSLVNode, JSLRender } from "jsl-render";
+export interface ITabItemOption {
+    id?: string;
+    header: IJSLVNode | string | IJSLComponent;
+    enabled?: boolean;
+    content?: IJSLVNode | string | IJSLComponent;
+    onCreate?: () => IJSLVNode | string | IJSLComponent;
+    canClose?: boolean;
+    onClosing?: () => boolean;
+}
+export interface ITabOptions {
+    tabs?: ITabItemOption[];
+    contentClass?: string;
+    class?: string;
+    style?: string;
+    selectedIndex?: number;
+    onSelect?: (index?: number) => boolean | void;
+    maxHeight?: string;
+    preserveContent?: boolean;
+}
+export declare class TabsComponent implements IJSLComponent {
+    private options?;
+    State: {
+        selectedIndex: any;
+    };
+    private renderer;
+    constructor(options?: ITabOptions);
+    getActiveTabIndex(): number;
+    render(): IJSLVNode;
+    AddTab(tabItem: ITabItemOption): number;
+    EnableAll(): void;
+    DisableAll(): void;
+    GetByID(id: string): ITabItemOption;
+    closeTabIndex(index: number, raiseSelectEvent?: boolean): boolean;
+    onInit(renderer: JSLRender): void;
+    SetSelectedTab(index: number): void;
+    private toNode;
+    private checkForDuplicateIds;
+}