@api-client/ui 0.0.1

package/dist/lib/Random.js

@@ -0,0 +1,10 @@
+/* eslint-disable no-plusplus */
+export function randomString(length = 8) {
+    let text = '';
+    const pool = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+    for (let i = 0; i < length; i++) {
+        text += pool.charAt(Math.floor(Math.random() * pool.length));
+    }
+    return text;
+}
+//# sourceMappingURL=Random.js.map

package/dist/lib/Random.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Random.js","sourceRoot":"","sources":["../../src/lib/Random.ts"],"names":[],"mappings":"AAAA,gCAAgC;AAChC,MAAM,UAAU,YAAY,CAAC,SAAiB,CAAC;IAC7C,IAAI,IAAI,GAAG,EAAE,CAAC;IACd,MAAM,IAAI,GAAG,gEAAgE,CAAC;IAC9E,KAAI,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,EAAE,CAAC,EAAE,EAAE;QAC9B,IAAI,IAAI,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC;KAC9D;IACD,OAAO,IAAI,CAAC;AACd,CAAC","sourcesContent":["/* eslint-disable no-plusplus */\nexport function randomString(length: number = 8): string {\n  let text = '';\n  const pool = \"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789\";\n  for(let i = 0; i < length; i++) {\n    text += pool.charAt(Math.floor(Math.random() * pool.length));\n  }\n  return text;\n}\n"]}

package/dist/lib/ResizableElements.d.ts

@@ -0,0 +1,42 @@
+export declare type ResizableElementMode = 'north' | 'east' | 'south' | 'north';
+export interface ResizeEventDetail {
+    /**
+     * The resize direction
+     */
+    direction: string;
+    /**
+     * The width set on the element
+     */
+    width?: number;
+    /**
+     * The height set on the element
+     */
+    height?: number;
+}
+declare global {
+    interface HTMLElement {
+        resize: ResizableElementMode;
+    }
+    interface HTMLAttributes {
+        resize: DOMTokenList;
+    }
+    interface HTMLElementEventMap {
+        /**
+         * The event dispatched when the user resized the element in one of the directions defined
+         * in the `resize` attribute, but before the new styles has been applied to the element.
+         *
+         * You can cancel the event to prohibit changing the layout.
+         *
+         * This event can be canceled but it doesn't bubble.
+         */
+        beforeresize: CustomEvent<Readonly<ResizeEventDetail>>;
+        /**
+         * The event dispatched after the element has been resized by the user in one of the directions defined
+         * in the `resize` attribute. The new width or height has been applied to the element.
+         *
+         * This event does not bubble or can be canceled.
+         */
+        resized: CustomEvent<Readonly<ResizeEventDetail>>;
+    }
+}
+//# sourceMappingURL=ResizableElements.d.ts.map

package/dist/lib/ResizableElements.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResizableElements.d.ts","sourceRoot":"","sources":["../../src/lib/ResizableElements.ts"],"names":[],"mappings":"AAIA,MAAM,CAAC,OAAO,MAAM,oBAAoB,GAAG,OAAO,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,CAAC;AAEhF,MAAM,WAAW,iBAAiB;IAChC;;OAEG;IACH,SAAS,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAkBD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,WAAW;QACnB,MAAM,EAAE,oBAAoB,CAAC;KAC9B;IAED,UAAU,cAAc;QACtB,MAAM,EAAE,YAAY,CAAC;KACtB;IAED,UAAU,mBAAmB;QAC3B;;;;;;;WAOG;QACH,YAAY,EAAE,WAAW,CAAC,QAAQ,CAAC,iBAAiB,CAAC,CAAC,CAAC;QACvD;;;;;WAKG;QACH,OAAO,EAAE,WAAW,CAAC,QAAQ,CAAC,iBAAiB,CAAC,CAAC,CAAC;KACnD;CACF"}

package/dist/lib/ResizableElements.js

@@ -0,0 +1,392 @@
+/* eslint-disable max-classes-per-file */
+/* eslint-disable no-inner-declarations */
+/* eslint-disable no-param-reassign */
+if (!('resize' in document.createElement('div'))) {
+    const configMap = new WeakMap();
+    /**
+     * The `width` or `height` of the activation area on the
+     * active resize corner.
+     */
+    const activeAreaSize = 8;
+    /**
+     * Since only one `resize` action can be performed per document
+     * this is a global flag indicating that a resize is triggered.
+     */
+    let resizing = false;
+    let resizeInfo;
+    /**
+     * Resets the originally set `position` CSS value on the element.
+     */
+    function resetPosition(elm, info) {
+        const { originalPosition } = info;
+        if (originalPosition) {
+            elm.style.position = originalPosition;
+        }
+    }
+    /**
+     * Sets the relative position on the element, when required.
+     */
+    function setPosition(elm, info) {
+        const originalPosition = elm.style.position;
+        info.originalPosition = originalPosition;
+        elm.style.position = 'relative';
+    }
+    /**
+     * Removes any existing event listeners added to the element related to the resize.
+     */
+    function cleanupResize(elm, info) {
+        resetPosition(elm, info);
+        if (info.mousedownHandler) {
+            elm.removeEventListener('mousedown', info.mousedownHandler);
+            info.mousedownHandler = undefined;
+        }
+        if (elm.shadowRoot) {
+            const activeRegions = Array.from(elm.shadowRoot.querySelectorAll('[data-resize-region]'));
+            activeRegions.forEach((node) => node.parentNode.removeChild(node));
+        }
+    }
+    function activeRegionMouseDownHandler(e) {
+        resizing = true;
+        e.preventDefault();
+        const node = e.target;
+        const src = node.offsetParent;
+        resizeInfo = {
+            resize: src,
+            drag: node,
+            rect: src.getClientRects()[0],
+        };
+    }
+    /**
+     * Adds the `shadowRoot` to the element, when missing.
+     * The activation regions are added to the shadow root of the
+     * element.
+     */
+    function applyShadowRoot(elm) {
+        if (!elm.shadowRoot) {
+            const root = elm.attachShadow({ mode: 'open' });
+            root.innerHTML = `<slot></slot>`;
+        }
+    }
+    /**
+     * @return The East or West drag region with common properties.
+     */
+    function createWestEstRegion() {
+        const region = document.createElement('div');
+        region.style.width = `${activeAreaSize}px`;
+        region.style.top = '0px';
+        region.style.bottom = '0px';
+        region.style.position = 'absolute';
+        return region;
+    }
+    /**
+     * Adds the mousedown event listener to the region, adds it into
+     * the shadow DOM, and updates the info object.
+     */
+    function activateRegion(elm, info, region) {
+        region.addEventListener('mousedown', activeRegionMouseDownHandler);
+        info.mousedownHandler = activeRegionMouseDownHandler;
+        if (customElements.get(elm.localName)) {
+            // custom elements can have its own logic related to the local DOM rendering.
+            // To be on the safe side (??) lets put the region in a timeout so the local DOM 
+            // is expected to be rendered
+            setTimeout(() => {
+                elm.shadowRoot.append(region);
+            });
+        }
+        else {
+            elm.shadowRoot.append(region);
+        }
+    }
+    /**
+     * Adds the East activation region.
+     */
+    function addEastRegion(elm, info) {
+        applyShadowRoot(elm);
+        const region = createWestEstRegion();
+        region.style.right = `-${activeAreaSize / 2}px`;
+        region.style.cursor = 'e-resize';
+        region.dataset.resizeRegion = 'east';
+        activateRegion(elm, info, region);
+    }
+    /**
+     * Adds the West activation region.
+     */
+    function addWestRegion(elm, info) {
+        applyShadowRoot(elm);
+        const region = createWestEstRegion();
+        region.style.left = `-${activeAreaSize / 2}px`;
+        region.style.cursor = 'w-resize';
+        region.dataset.resizeRegion = 'west';
+        activateRegion(elm, info, region);
+    }
+    /**
+     * @returns The North or South drag region with common properties.
+     */
+    function createNorthSouthRegion() {
+        const region = document.createElement('div');
+        region.style.height = `${activeAreaSize}px`;
+        region.style.right = '0px';
+        region.style.left = '0px';
+        region.style.position = 'absolute';
+        return region;
+    }
+    /**
+     * Adds the North activation region.
+     */
+    function addNorthRegion(elm, info) {
+        applyShadowRoot(elm);
+        const region = createNorthSouthRegion();
+        region.style.top = `-${activeAreaSize / 2}px`;
+        region.style.cursor = 'n-resize';
+        region.dataset.resizeRegion = 'north';
+        activateRegion(elm, info, region);
+    }
+    /**
+     * Adds the South activation region.
+     */
+    function addSouthRegion(elm, info) {
+        applyShadowRoot(elm);
+        const region = createNorthSouthRegion();
+        region.style.bottom = `-${activeAreaSize / 2}px`;
+        region.style.cursor = 's-resize';
+        region.dataset.resizeRegion = 'south';
+        activateRegion(elm, info, region);
+    }
+    function updateResize(elm) {
+        const info = configMap.get(elm);
+        cleanupResize(elm, info);
+        const { resizeList } = info;
+        if (!Array.isArray(resizeList) || !resizeList.length) {
+            return;
+        }
+        setPosition(elm, info);
+        if (resizeList.includes('east')) {
+            addEastRegion(elm, info);
+        }
+        if (resizeList.includes('west')) {
+            addWestRegion(elm, info);
+        }
+        if (resizeList.includes('north')) {
+            addNorthRegion(elm, info);
+        }
+        if (resizeList.includes('south')) {
+            addSouthRegion(elm, info);
+        }
+    }
+    /**
+     * Dispatches the beforeresize event on the target element.
+     *
+     * @returns Whether the event was cancelled.
+     */
+    function notifyBeforeResize(opts) {
+        const e = new CustomEvent('beforeresize', {
+            cancelable: true,
+            detail: Object.freeze(opts),
+        });
+        resizeInfo.resize.dispatchEvent(e);
+        return e.defaultPrevented;
+    }
+    /**
+     * Dispatches the resize event on the target element.
+     *
+     * @returns Whether the event was cancelled.
+     */
+    function notifyResize(opts) {
+        const e = new CustomEvent('resized', {
+            cancelable: true,
+            detail: Object.freeze(opts),
+        });
+        resizeInfo.resize.dispatchEvent(e);
+    }
+    /**
+     * Resizes the resize element on the West side
+     */
+    function resizeWest(pageX) {
+        const { left, width } = resizeInfo.rect;
+        const dx = pageX - left;
+        const newWidth = width - dx;
+        const info = { width: newWidth, direction: 'west' };
+        if (!notifyBeforeResize(info)) {
+            resizeInfo.resize.style.width = `${newWidth}px`;
+            notifyResize(info);
+            // resizeInfo!.resize.style.width = `${width}px`;
+        }
+    }
+    /**
+     * Resizes the resize element on the East side
+     */
+    function resizeEast(pageX) {
+        const { right, width } = resizeInfo.rect;
+        const dx = right - pageX;
+        const newWidth = width - dx;
+        const info = { width: newWidth, direction: 'east' };
+        if (!notifyBeforeResize(info)) {
+            resizeInfo.resize.style.width = `${newWidth}px`;
+            notifyResize(info);
+            // resizeInfo!.resize.style.width = `${width}px`;
+        }
+    }
+    /**
+     * Resizes the resize element on the North side
+     */
+    function resizeNorth(pageY) {
+        const { top, height } = resizeInfo.rect;
+        const dx = pageY - top;
+        const newHeight = height - dx;
+        const info = { height: newHeight, direction: 'north' };
+        if (!notifyBeforeResize(info)) {
+            resizeInfo.resize.style.height = `${newHeight}px`;
+            notifyResize(info);
+            // resizeInfo!.resize.style.height = `${height}px`;
+        }
+    }
+    /**
+     * Resizes the resize element on the North side
+     */
+    function resizeSouth(pageY) {
+        const { bottom, height } = resizeInfo.rect;
+        const dx = bottom - pageY;
+        const newHeight = height - dx;
+        const info = { height: newHeight, direction: 'south' };
+        if (!notifyBeforeResize(info)) {
+            resizeInfo.resize.style.height = `${newHeight}px`;
+            notifyResize(info);
+            // resizeInfo!.resize.style.height = `${height}px`;
+        }
+    }
+    function moveTarget(e) {
+        const { pageX, pageY } = e;
+        const { resizeRegion } = resizeInfo.drag.dataset;
+        switch (resizeRegion) {
+            case 'west':
+                resizeWest(pageX);
+                break;
+            case 'east':
+                resizeEast(pageX);
+                break;
+            case 'north':
+                resizeNorth(pageY);
+                break;
+            case 'south':
+                resizeSouth(pageY);
+                break;
+            default: // ...
+        }
+    }
+    // 1. add support for the `resize` attribute that is translated to a property.
+    // 2. when the property change run the logic that supports the resize of the element depending on the values.
+    // 
+    // Configuring the mutation observer
+    // 
+    /**
+     * Updates HTMLElement's `resize` property from it's current `resize` attribute value.
+     */
+    function updateHtmlElementResize(node) {
+        if (!node.hasAttribute('resize')) {
+            return;
+        }
+        const value = node.getAttribute('resize');
+        node.resize = value;
+    }
+    const traverseAllNodes = (parent, out = []) => {
+        if (parent.nodeType !== Node.ELEMENT_NODE) {
+            return out;
+        }
+        const typed = parent;
+        out.push(typed);
+        Array.from(typed.children).forEach((current) => {
+            // eslint-disable-next-line @typescript-eslint/no-unused-vars
+            traverseAllNodes(current, out);
+        });
+        if (typed.shadowRoot) {
+            typed.querySelectorAll('*').forEach((current) => {
+                if (current.nodeType !== Node.ELEMENT_NODE) {
+                    return;
+                }
+                traverseAllNodes(current, out);
+            });
+        }
+        return out;
+    };
+    const mutationConfig = {
+        attributes: true,
+        childList: true,
+        subtree: true,
+        attributeFilter: ['resize'],
+        // attributeOldValue: true, // to unregister previous listeners? Probably gonna keep a reference to this.
+    };
+    const mutationCallback = (mutationsList) => {
+        for (const mutation of mutationsList) {
+            if (mutation.type === 'attributes') {
+                const node = mutation.target;
+                updateHtmlElementResize(node);
+            }
+            else if (mutation.type === 'childList') {
+                const node = mutation.target;
+                const nodes = traverseAllNodes(node);
+                // const resizables = Array.from(node.querySelectorAll('[resize]')) as HTMLElement[];
+                nodes.forEach((item) => updateHtmlElementResize(item));
+            }
+        }
+    };
+    const mutationObserver = new MutationObserver(mutationCallback);
+    mutationObserver.observe(document.body, mutationConfig);
+    Object.defineProperty(HTMLElement.prototype, 'resize', {
+        get() {
+            const item = configMap.get(this);
+            if (item) {
+                return item.resize;
+            }
+            return undefined;
+        },
+        set(newValue) {
+            if (!configMap.has(this)) {
+                // @ts-ignore
+                configMap.set(this, { resize: '', resizeList: [] });
+            }
+            const item = configMap.get(this);
+            if (item.resize === newValue) {
+                // do not set a new value when it's already set.
+                return;
+            }
+            item.resize = newValue;
+            let listValue;
+            if (typeof newValue === 'string') {
+                listValue = newValue.split(' ').map((part) => part.trim().toLowerCase());
+            }
+            item.resizeList = listValue || [];
+            updateResize(this);
+        },
+        enumerable: true,
+        configurable: true,
+    });
+    // 
+    // Processing already existing nodes
+    // @todo: how to handle existing shadow DOM elements?
+    // 
+    const resizables = Array.from(document.body.querySelectorAll('[resize]'));
+    resizables.forEach((node) => updateHtmlElementResize(node));
+    // 
+    // Registers global mousemove and mouseup event listeners 
+    // to handle the resize. These listeners are inactive while
+    // the `resizing` flag is not set.
+    // 
+    function mousemoveHandler(e) {
+        if (!resizing) {
+            return;
+        }
+        moveTarget(e);
+    }
+    function mouseupHandler(e) {
+        if (!resizing) {
+            return;
+        }
+        resizing = false;
+        resizeInfo = undefined;
+        e.preventDefault();
+    }
+    document.body.addEventListener('mousemove', mousemoveHandler);
+    document.body.addEventListener('mouseup', mouseupHandler);
+}
+export {};
+//# sourceMappingURL=ResizableElements.js.map

package/dist/lib/ResizableElements.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResizableElements.js","sourceRoot":"","sources":["../../src/lib/ResizableElements.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable max-classes-per-file */\n/* eslint-disable no-inner-declarations */\n/* eslint-disable no-param-reassign */\n\nexport declare type ResizableElementMode = 'north' | 'east' | 'south' | 'north';\n\nexport interface ResizeEventDetail {\n  /**\n   * The resize direction\n   */\n  direction: string;\n  /**\n   * The width set on the element\n   */\n  width?: number;\n  /**\n   * The height set on the element\n   */\n  height?: number;\n}\n\ninterface ResizedInfo {\n  /**\n   * The element that is being resized\n   */\n  resize: HTMLElement;\n  /**\n   * The active area drag element.\n   */\n  drag: HTMLDivElement;\n  /**\n   * The initial resize element rectangle sizing\n   */\n  rect: DOMRect;\n}\n\n\ndeclare global {\n  interface HTMLElement {\n    resize: ResizableElementMode;\n  }\n\n  interface HTMLAttributes {\n    resize: DOMTokenList;\n  }\n\n  interface HTMLElementEventMap {\n    /**\n     * The event dispatched when the user resized the element in one of the directions defined \n     * in the `resize` attribute, but before the new styles has been applied to the element.\n     * \n     * You can cancel the event to prohibit changing the layout.\n     * \n     * This event can be canceled but it doesn't bubble.\n     */\n    beforeresize: CustomEvent<Readonly<ResizeEventDetail>>;\n    /**\n     * The event dispatched after the element has been resized by the user in one of the directions defined \n     * in the `resize` attribute. The new width or height has been applied to the element.\n     * \n     * This event does not bubble or can be canceled.\n     */\n    resized: CustomEvent<Readonly<ResizeEventDetail>>;\n  }\n}\n\ninterface ResizeConfigItem {\n  resize: ResizableElementMode;\n  resizeList: string[];\n  originalPosition?: string;\n  mousedownHandler?: (this: HTMLElement, ev: MouseEvent) => any;\n}\n\nif (!('resize' in document.createElement('div'))) {\n  const configMap = new WeakMap<HTMLElement, ResizeConfigItem>();\n  /** \n   * The `width` or `height` of the activation area on the \n   * active resize corner.\n   */\n  const activeAreaSize: number = 8;\n  /** \n   * Since only one `resize` action can be performed per document\n   * this is a global flag indicating that a resize is triggered.\n   */\n  let resizing = false;\n\n  let resizeInfo: ResizedInfo | undefined;\n\n  /**\n   * Resets the originally set `position` CSS value on the element.\n   */\n  function resetPosition(elm: HTMLElement, info: ResizeConfigItem): void {\n    const { originalPosition } = info;\n    if (originalPosition) {\n      elm.style.position = originalPosition;\n    }\n  }\n\n  /**\n   * Sets the relative position on the element, when required.\n   */\n  function setPosition(elm: HTMLElement, info: ResizeConfigItem): void {\n    const originalPosition = elm.style.position;\n    info.originalPosition = originalPosition;\n    elm.style.position = 'relative';\n  }\n\n  /**\n   * Removes any existing event listeners added to the element related to the resize.\n   */\n  function cleanupResize(elm: HTMLElement, info: ResizeConfigItem): void {\n    resetPosition(elm, info);\n    if (info.mousedownHandler) {\n      elm.removeEventListener('mousedown', info.mousedownHandler);\n      info.mousedownHandler = undefined;\n    }\n    if (elm.shadowRoot) {\n      const activeRegions = Array.from(elm.shadowRoot.querySelectorAll('[data-resize-region]'));\n      activeRegions.forEach((node) => node.parentNode!.removeChild(node));\n    }\n  }\n\n  function activeRegionMouseDownHandler(e: MouseEvent): void {\n    resizing = true;\n    e.preventDefault();\n    const node = e.target as HTMLDivElement;\n    const src = node.offsetParent as HTMLElement;\n    resizeInfo = {\n      resize: src,\n      drag: node,\n      rect: src.getClientRects()[0],\n    };\n  }\n\n  /**\n   * Adds the `shadowRoot` to the element, when missing.\n   * The activation regions are added to the shadow root of the \n   * element.\n   */\n  function applyShadowRoot(elm: HTMLElement): void {\n    if (!elm.shadowRoot) {\n      const root = elm.attachShadow({ mode: 'open' });\n      root.innerHTML = `<slot></slot>`;\n    }\n  }\n\n  /**\n   * @return The East or West drag region with common properties.\n   */\n  function createWestEstRegion(): HTMLDivElement {\n    const region = document.createElement('div');\n    region.style.width = `${activeAreaSize}px`;\n    region.style.top = '0px';\n    region.style.bottom = '0px';\n    region.style.position = 'absolute';\n    return region;\n  }\n\n  /**\n   * Adds the mousedown event listener to the region, adds it into\n   * the shadow DOM, and updates the info object.\n   */\n  function activateRegion(elm: HTMLElement, info: ResizeConfigItem, region: HTMLDivElement): void {\n    region.addEventListener('mousedown', activeRegionMouseDownHandler);\n    info.mousedownHandler = activeRegionMouseDownHandler;\n    if (customElements.get(elm.localName)) {\n      // custom elements can have its own logic related to the local DOM rendering.\n      // To be on the safe side (??) lets put the region in a timeout so the local DOM \n      // is expected to be rendered\n      setTimeout(() => {\n        elm.shadowRoot!.append(region);\n      });\n    } else {\n      elm.shadowRoot!.append(region);\n    }\n  }\n\n  /**\n   * Adds the East activation region.\n   */\n  function addEastRegion(elm: HTMLElement, info: ResizeConfigItem): void {\n    applyShadowRoot(elm);\n    const region = createWestEstRegion();\n    region.style.right = `-${activeAreaSize / 2}px`;\n    region.style.cursor = 'e-resize';\n    region.dataset.resizeRegion = 'east';\n    activateRegion(elm, info, region);\n  }\n\n  /**\n   * Adds the West activation region.\n   */\n  function addWestRegion(elm: HTMLElement, info: ResizeConfigItem): void {\n    applyShadowRoot(elm);\n    const region = createWestEstRegion();\n    region.style.left = `-${activeAreaSize / 2}px`;\n    region.style.cursor = 'w-resize';\n    region.dataset.resizeRegion = 'west';\n    activateRegion(elm, info, region);\n  }\n\n  /**\n   * @returns The North or South drag region with common properties.\n   */\n  function createNorthSouthRegion(): HTMLDivElement {\n    const region = document.createElement('div');\n    region.style.height = `${activeAreaSize}px`;\n    region.style.right = '0px';\n    region.style.left = '0px';\n    region.style.position = 'absolute';\n    return region;\n  }\n\n  /**\n   * Adds the North activation region.\n   */\n  function addNorthRegion(elm: HTMLElement, info: ResizeConfigItem): void {\n    applyShadowRoot(elm);\n    const region = createNorthSouthRegion();\n    region.style.top = `-${activeAreaSize / 2}px`;\n    region.style.cursor = 'n-resize';\n    region.dataset.resizeRegion = 'north';\n    activateRegion(elm, info, region);\n  }\n\n  /**\n   * Adds the South activation region.\n   */\n  function addSouthRegion(elm: HTMLElement, info: ResizeConfigItem): void {\n    applyShadowRoot(elm);\n    const region = createNorthSouthRegion();\n    region.style.bottom = `-${activeAreaSize / 2}px`;\n    region.style.cursor = 's-resize';\n    region.dataset.resizeRegion = 'south';\n    activateRegion(elm, info, region);\n  }\n\n  function updateResize(elm: HTMLElement): void {\n    const info = configMap.get(elm)!;\n    cleanupResize(elm, info);\n    const { resizeList } = info;\n    if (!Array.isArray(resizeList) || !resizeList.length) {\n      return;\n    }\n    setPosition(elm, info);\n    if (resizeList.includes('east')) {\n      addEastRegion(elm, info);\n    }\n    if (resizeList.includes('west')) {\n      addWestRegion(elm, info);\n    }\n    if (resizeList.includes('north')) {\n      addNorthRegion(elm, info);\n    }\n    if (resizeList.includes('south')) {\n      addSouthRegion(elm, info);\n    }\n  }\n\n  /**\n   * Dispatches the beforeresize event on the target element.\n   * \n   * @returns Whether the event was cancelled.\n   */\n  function notifyBeforeResize(opts: ResizeEventDetail): boolean {\n    const e = new CustomEvent('beforeresize', {\n      cancelable: true,\n      detail: Object.freeze(opts),\n    });\n    resizeInfo!.resize.dispatchEvent(e);\n    return e.defaultPrevented;\n  }\n\n  /**\n   * Dispatches the resize event on the target element.\n   * \n   * @returns Whether the event was cancelled.\n   */\n  function notifyResize(opts: ResizeEventDetail): void {\n    const e = new CustomEvent('resized', {\n      cancelable: true,\n      detail: Object.freeze(opts),\n    });\n    resizeInfo!.resize.dispatchEvent(e);\n  }\n\n  /**\n   * Resizes the resize element on the West side\n   */\n  function resizeWest(pageX: number): void {\n    const { left, width } = resizeInfo!.rect;\n    const dx = pageX - left;\n    const newWidth = width - dx;\n    const info: ResizeEventDetail = { width: newWidth, direction: 'west' };\n    if (!notifyBeforeResize(info)) {\n      resizeInfo!.resize.style.width = `${newWidth}px`;\n      notifyResize(info);\n      // resizeInfo!.resize.style.width = `${width}px`;\n    }\n  }\n\n  /**\n   * Resizes the resize element on the East side\n   */\n  function resizeEast(pageX: number): void {\n    const { right, width } = resizeInfo!.rect;\n    const dx = right - pageX;\n    const newWidth = width - dx;\n    const info: ResizeEventDetail = { width: newWidth, direction: 'east' };\n    if (!notifyBeforeResize(info)) {\n      resizeInfo!.resize.style.width = `${newWidth}px`;\n      notifyResize(info);\n      // resizeInfo!.resize.style.width = `${width}px`;\n    }\n  }\n\n  /**\n   * Resizes the resize element on the North side\n   */\n  function resizeNorth(pageY: number): void {\n    const { top, height } = resizeInfo!.rect;\n    const dx = pageY - top;\n    const newHeight = height - dx;\n    const info: ResizeEventDetail = { height: newHeight, direction: 'north' };\n    if (!notifyBeforeResize(info)) {\n      resizeInfo!.resize.style.height = `${newHeight}px`;\n      notifyResize(info);\n      // resizeInfo!.resize.style.height = `${height}px`;\n    }\n  }\n\n  /**\n   * Resizes the resize element on the North side\n   */\n  function resizeSouth(pageY: number): void {\n    const { bottom, height } = resizeInfo!.rect;\n    const dx = bottom - pageY;\n    const newHeight = height - dx;\n    const info: ResizeEventDetail = { height: newHeight, direction: 'south' };\n    if (!notifyBeforeResize(info)) {\n      resizeInfo!.resize.style.height = `${newHeight}px`;\n      notifyResize(info);\n      // resizeInfo!.resize.style.height = `${height}px`;\n    }\n  }\n\n  function moveTarget(e: MouseEvent): void {\n    const { pageX, pageY } = e;\n    const { resizeRegion } = resizeInfo!.drag.dataset;\n    switch (resizeRegion) {\n      case 'west': resizeWest(pageX); break;\n      case 'east': resizeEast(pageX); break;\n      case 'north': resizeNorth(pageY); break;\n      case 'south': resizeSouth(pageY); break;\n      default: // ...\n    }\n  }\n\n  // 1. add support for the `resize` attribute that is translated to a property.\n  // 2. when the property change run the logic that supports the resize of the element depending on the values.\n\n  // \n  // Configuring the mutation observer\n  // \n\n  /**\n   * Updates HTMLElement's `resize` property from it's current `resize` attribute value.\n   */\n  function updateHtmlElementResize(node: Element): void {\n    if (!node.hasAttribute('resize')) {\n      return;\n    }\n    const value = node.getAttribute('resize') as ResizableElementMode;\n    (node as HTMLElement).resize = value;\n  }\n\n  const traverseAllNodes = (parent: Node, out: Element[] = []): Element[] => {\n    if (parent.nodeType !== Node.ELEMENT_NODE) {\n      return out;\n    }\n    const typed = parent as Element;\n    out.push(typed);\n    Array.from(typed.children).forEach((current) => {\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      traverseAllNodes(current, out);\n    });\n    if (typed.shadowRoot) {\n      typed.querySelectorAll('*').forEach((current) => {\n        if (current.nodeType !== Node.ELEMENT_NODE) {\n          return;\n        }\n        traverseAllNodes(current, out);\n      });\n    }\n    return out;\n  };\n\n  const mutationConfig: MutationObserverInit = {\n    attributes: true,\n    childList: true,\n    subtree: true,\n    attributeFilter: ['resize'],\n    // attributeOldValue: true, // to unregister previous listeners? Probably gonna keep a reference to this.\n  };\n  const mutationCallback = (mutationsList: MutationRecord[]): void => {\n    for (const mutation of mutationsList) {\n      if (mutation.type === 'attributes') {\n        const node = mutation.target as HTMLElement;\n        updateHtmlElementResize(node);\n      } else if (mutation.type === 'childList') {\n        const node = mutation.target as HTMLElement;\n        const nodes = traverseAllNodes(node);\n        // const resizables = Array.from(node.querySelectorAll('[resize]')) as HTMLElement[];\n        nodes.forEach((item) => updateHtmlElementResize(item));\n      }\n    }\n  };\n  const mutationObserver = new MutationObserver(mutationCallback);\n  mutationObserver.observe(document.body, mutationConfig);\n\n  Object.defineProperty(HTMLElement.prototype, 'resize', {\n    get(): ResizableElementMode | undefined {\n      const item = configMap.get(this)!;\n      if (item) {\n        return item.resize;\n      }\n      return undefined;\n    },\n    set(newValue: ResizableElementMode | undefined) {\n      if (!configMap.has(this)) {\n        // @ts-ignore\n        configMap.set(this, { resize: '', resizeList: [] });\n      }\n      const item = configMap.get(this)!;\n      if (item.resize === newValue) {\n        // do not set a new value when it's already set.\n        return;\n      }\n      item.resize = newValue!;\n      let listValue;\n      if (typeof newValue === 'string') {\n        listValue = newValue.split(' ').map((part) => part.trim().toLowerCase());\n      }\n      item.resizeList = listValue || [];\n      updateResize(this);\n    },\n    enumerable: true,\n    configurable: true,\n  });\n\n  // \n  // Processing already existing nodes\n  // @todo: how to handle existing shadow DOM elements?\n  // \n\n  const resizables = Array.from(document.body.querySelectorAll('[resize]')) as HTMLElement[];\n  resizables.forEach((node) => updateHtmlElementResize(node));\n\n  // \n  // Registers global mousemove and mouseup event listeners \n  // to handle the resize. These listeners are inactive while\n  // the `resizing` flag is not set.\n  // \n\n  function mousemoveHandler(e: MouseEvent): void {\n    if (!resizing) {\n      return;\n    }\n    moveTarget(e);\n  }\n\n  function mouseupHandler(e: MouseEvent): void {\n    if (!resizing) {\n      return;\n    }\n    resizing = false;\n    resizeInfo = undefined;\n    e.preventDefault();\n  }\n\n  document.body.addEventListener('mousemove', mousemoveHandler);\n  document.body.addEventListener('mouseup', mouseupHandler);\n}\n"]}

package/dist/lib/SupportedPlatform.d.ts

@@ -0,0 +1,2 @@
+export default function supportedPlatform(): Promise<boolean>;
+//# sourceMappingURL=SupportedPlatform.d.ts.map

package/dist/lib/SupportedPlatform.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SupportedPlatform.d.ts","sourceRoot":"","sources":["../../src/lib/SupportedPlatform.ts"],"names":[],"mappings":"AAkBA,wBAA8B,iBAAiB,IAAI,OAAO,CAAC,OAAO,CAAC,CASlE"}

package/dist/lib/SupportedPlatform.js

@@ -0,0 +1,28 @@
+async function supportsModuleWorker() {
+    let supports = false;
+    const tester = {
+        get type() { supports = true; return 'module'; }
+    };
+    try {
+        // eslint-disable-next-line no-new
+        new Worker('blob://', tester);
+    }
+    catch (e) {
+        // ....
+    }
+    return supports;
+}
+function supportFileAccess() {
+    return 'showOpenFilePicker' in window;
+}
+export default async function supportedPlatform() {
+    const hasWorkerModule = await supportsModuleWorker();
+    if (!hasWorkerModule) {
+        return false;
+    }
+    if (!supportFileAccess()) {
+        return false;
+    }
+    return true;
+}
+//# sourceMappingURL=SupportedPlatform.js.map

package/dist/lib/SupportedPlatform.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SupportedPlatform.js","sourceRoot":"","sources":["../../src/lib/SupportedPlatform.ts"],"names":[],"mappings":"AAAA,KAAK,UAAU,oBAAoB;IACjC,IAAI,QAAQ,GAAG,KAAK,CAAC;IACrB,MAAM,MAAM,GAAG;QACb,IAAI,IAAI,KAAiB,QAAQ,GAAG,IAAI,CAAC,CAAC,OAAO,QAAQ,CAAA,CAAC,CAAC;KAC5D,CAAC;IACF,IAAI;QACF,kCAAkC;QAClC,IAAI,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;KAC/B;IAAC,OAAO,CAAC,EAAE;QACV,OAAO;KACR;IACD,OAAO,QAAQ,CAAC;AAClB,CAAC;AAED,SAAS,iBAAiB;IACxB,OAAO,oBAAoB,IAAI,MAAM,CAAC;AACxC,CAAC;AAED,MAAM,CAAC,OAAO,CAAC,KAAK,UAAU,iBAAiB;IAC7C,MAAM,eAAe,GAAG,MAAM,oBAAoB,EAAE,CAAC;IACrD,IAAI,CAAC,eAAe,EAAE;QACpB,OAAO,KAAK,CAAC;KACd;IACD,IAAI,CAAC,iBAAiB,EAAE,EAAE;QACxB,OAAO,KAAK,CAAC;KACd;IACD,OAAO,IAAI,CAAC;AACd,CAAC","sourcesContent":["async function supportsModuleWorker(): Promise<boolean> {\n  let supports = false;\n  const tester = {\n    get type(): WorkerType { supports = true; return 'module' }\n  };\n  try {\n    // eslint-disable-next-line no-new\n    new Worker('blob://', tester);\n  } catch (e) {\n    // ....\n  }\n  return supports;\n}\n\nfunction supportFileAccess(): boolean {\n  return 'showOpenFilePicker' in window;\n}\n\nexport default async function supportedPlatform(): Promise<boolean> {\n  const hasWorkerModule = await supportsModuleWorker();\n  if (!hasWorkerModule) {\n    return false;\n  }\n  if (!supportFileAccess()) {\n    return false;\n  }\n  return true;\n}\n"]}

package/dist/lib/chart/HttpHistoryChart.d.ts

@@ -0,0 +1,60 @@
+import { IHttpHistory } from '@api-client/core/build/browser.js';
+import { TemplateResult } from 'lit';
+declare const chartStyles: import("lit").CSSResult;
+export { chartStyles };
+declare const DaySeparatorKind = "Chart#DaySeparator";
+declare const EntryKind = "Chart#Entry";
+interface IDaySeparator {
+    kind: typeof DaySeparatorKind;
+    label: string;
+}
+interface IEntry {
+    kind: typeof EntryKind;
+    /**
+     * Request duration.
+     */
+    d: number;
+    /**
+     * Request size
+     */
+    res: number;
+    /**
+     * Response size
+     */
+    rps: number;
+    /**
+     * The log created time
+     */
+    t: number;
+}
+type DataEntry = IEntry | IDaySeparator;
+export declare class HttpHistoryChart {
+    protected data: IHttpHistory[][];
+    protected _topDuration: number;
+    protected _topRequestSize: number;
+    protected _topResponseSize: number;
+    /**
+     * The ordered from the oldest to the newest history data.
+     */
+    protected _values: DataEntry[];
+    /**
+     * @param data Sorted history data. Each array item is a group if requests made that day.
+     */
+    constructor(data: IHttpHistory[][]);
+    /**
+     * Normalizes the data, formats the labels and sets the `_values` array.
+     */
+    protected _analyze(): void;
+    /**
+     * Creates a plot for the request duration.
+     */
+    durationPlot(): TemplateResult;
+    private _durationRows;
+    private _durationChart;
+    private _durationColumns;
+    private _durationItem;
+    private _durationDaySeparatorItem;
+    private _durationEntryItem;
+    private _durationColumn;
+}
+//# sourceMappingURL=HttpHistoryChart.d.ts.map

package/dist/lib/chart/HttpHistoryChart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HttpHistoryChart.d.ts","sourceRoot":"","sources":["../../../src/lib/chart/HttpHistoryChart.ts"],"names":[],"mappings":"AACA,OAAO,EAAiB,YAAY,EAAa,MAAM,mCAAmC,CAAC;AAC3F,OAAO,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAMhD,QAAA,MAAM,WAAW,yBAgJhB,CAAC;AAEF,OAAO,EAAE,WAAW,EAAE,CAAC;AAEvB,QAAA,MAAM,gBAAgB,uBAAuB,CAAC;AAC9C,QAAA,MAAM,SAAS,gBAAgB,CAAC;AAEhC,UAAU,aAAa;IACrB,IAAI,EAAE,OAAO,gBAAgB,CAAC;IAC9B,KAAK,EAAE,MAAM,CAAC;CACf;AAED,UAAU,MAAM;IACd,IAAI,EAAE,OAAO,SAAS,CAAC;IACvB;;OAEG;IACH,CAAC,EAAE,MAAM,CAAC;IACV;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,CAAC,EAAE,MAAM,CAAC;CACX;AAED,KAAK,SAAS,GAAG,MAAM,GAAG,aAAa,CAAC;AAExC,qBAAa,gBAAgB;IAef,SAAS,CAAC,IAAI,EAAE,YAAY,EAAE,EAAE;IAd5C,SAAS,CAAC,YAAY,SAAK;IAE3B,SAAS,CAAC,eAAe,SAAK;IAE9B,SAAS,CAAC,gBAAgB,SAAK;IAE/B;;OAEG;IACH,SAAS,CAAC,OAAO,EAAE,SAAS,EAAE,CAAM;IAEpC;;OAEG;gBACmB,IAAI,EAAE,YAAY,EAAE,EAAE;IAI5C;;OAEG;IACH,SAAS,CAAC,QAAQ,IAAI,IAAI;IAiD1B;;OAEG;IACH,YAAY,IAAI,cAAc;IAW9B,OAAO,CAAC,aAAa;IAYrB,OAAO,CAAC,cAAc;IAOtB,OAAO,CAAC,gBAAgB;IAQxB,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,yBAAyB;IAQjC,OAAO,CAAC,kBAAkB;IAmB1B,OAAO,CAAC,eAAe;CAexB"}