@xplortech/apollo-core 3.1.0 → 3.2.0

package/dist/collection/components/xpl-slideout/xpl-slideout.js

@@ -29,7 +29,7 @@ export class Slideout {
         this.handleScroll();
     }
     render() {
-        return (h(Host, { key: '0031856dad46059b22c544b17d9c3c486fad49ef', class: "xpl-slideout" }, this.backdrop && this.isOpen && (h("xpl-backdrop", { key: '476ebe60d3761a12edce8a70b79c5458a3a49b88', onClick: this.handleClose })), h("aside", { key: 'e093e4f88719d109e1b76e5843fa799adf77023a', class: `slideout slideout--${!this.isOpen && 'closed'}` }, h("header", { key: '861ce3bafb6f104cd088788e86d5dec891d34559', class: "header" }, h("div", { key: 'f4a9a82d62a118acf4847ae32f6699755103cdeb', class: "title" }, h("slot", { key: '142fabb21a5894d0e505b3555b1de49a3457f01a', name: "title" }), h("xpl-button", { key: 'b5424c903db35139aca7070a223c3e8ccad0286d', class: "close-button", "icon-only": true, size: "sm", variant: "tertiary", onClick: this.handleClose }, h("xpl-icon", { key: 'a7597b061ba78ec8877f4ca119ddfe4fb6f07057', icon: "xmark" }))), h("div", { key: 'fbd6496bcd1854cbbe584a62a27621cc6c730472', class: "subtitle" }, h("slot", { key: 'a9a059571945b74f064d1b4c6a672a7964ff20d7', name: "subtitle" })), h("div", { key: '575d405c99e6a0ded114d274832d7c9a119f8acd', class: "search" }, h("slot", { key: '6db25fde2a6decdfe2f280aae9f784b1e992d070', name: "search" }))), h("xpl-divider", { key: 'dd382afb3181fbad00b1efacd438842c23249978', tier: 0, class: "divider top" }), h("article", { key: 'a8832b326372ede5872d2004308f8dff30955e1a', class: "content", tabIndex: 0 }, h("slot", { key: 'e46c7df8ebc6caecbc82117dd7b5097377dcf163', name: "content" })), this.showFooter && (h("footer", { key: '41e237ffa63f9dfc50ca1792848f4087375edecc' }, h("xpl-divider", { key: '888ece8b783152856696cf792c1db7abedd393fa', tier: 0, class: "divider bottom" }), h("div", { key: '4ee6dcf7cb794ca32c3e0095b9d3ffdda2578870', class: "footer" }, h("slot", { key: '286ecc097c88e7b6655fb27f707cb6163e49374b', name: "tertiary" }), h("slot", { key: '9154a9de3de154cb8f228a00875d81b4c8d1899a', name: "secondary" }), h("slot", { key: 'c510b271b930b8419b8ed26e4a9ce444453f9330', name: "primary" })))))));
+        return (h(Host, { key: '6a677f3ef03392e8c17e96eb1a35244cc65249cc', class: "xpl-slideout" }, this.backdrop && this.isOpen && (h("xpl-backdrop", { key: '8e93a0fe45fdbf00f9b9d72a3b703f4ed91724b7', onClick: this.handleClose })), h("aside", { key: '451a572b79f74f614756c77b7aae9ece7e53a615', class: `slideout slideout--${!this.isOpen && 'closed'}` }, h("header", { key: '4e6f0d5c525ffe16f20a2d85d21e6c85d6213f1e', class: "header" }, h("div", { key: 'bf69e4a7e0be7b1ea763b5d17da90b31f122e7fe', class: "title" }, h("slot", { key: 'b5b3298d2f05a5e99dc2ba934c306c7167eeb861', name: "title" }), h("xpl-button", { key: 'da76c0538824d6d7cdce7385daf77c74fd3e6432', class: "close-button", "icon-only": true, variant: "tertiary", onClick: this.handleClose }, h("xpl-icon", { key: '02d4e1b6d191683f95c5fe9d93db6a8eb6260e32', icon: "xmark" }))), h("div", { key: 'daf09af3d4ec41943ca063fb0b0afddc6075e549', class: "subtitle" }, h("slot", { key: '755b4e4f6bfdcc7f94f0b2ed67526d7f97c77842', name: "subtitle" })), h("div", { key: '294b6650cdc4b15a8f5b9005a24304cccda91ddb', class: "search" }, h("slot", { key: '4b85802d14eb9ab528749727846637a0702ff2d1', name: "search" }))), h("xpl-divider", { key: '335792083b7072b6973e4b684062d6498d1cfc57', tier: 0, class: "divider top" }), h("article", { key: '3a0920577f4599b0ea9a3762ea066b0e8b9d932a', class: "content", tabIndex: 0 }, h("slot", { key: 'b085ef369c4d685ae0e6e518c28e95cd883d1e03', name: "content" })), this.showFooter && (h("footer", { key: '663e2392d8484bb4875dcb4b9411b8ae6b805087' }, h("xpl-divider", { key: '6d0d50a6cc038a19ed5465a9fe79854b2519e70b', tier: 0, class: "divider bottom" }), h("div", { key: '29e9eaea051247ff8e9be18af54f0d3959590759', class: "footer" }, h("slot", { key: '4e9d8e3a054a72fba8392afdefcdca63e8ce8068', name: "tertiary" }), h("slot", { key: '44b764a99064de792309995cdc53b4ca8a82f8da', name: "secondary" }), h("slot", { key: 'c96cedf9662bab571a8cab244c8fce6172691628', name: "primary" })))))));
     }
     static get is() { return "xpl-slideout"; }
     static get properties() {

package/dist/collection/components/xpl-tab-panel/xpl-tab-panel.js

@@ -9,10 +9,10 @@ export class TabPanel {
         const t = this.target ?? '';
         const panelId = tabPanelDomId(groupId, t);
         const labelledBy = tabTriggerId(groupId, t);
-        return (h(Host, { key: 'b92d723fe68be63d6438fab8ae8f93a06122c29a', "aria-labelledby": labelledBy, class: {
+        return (h(Host, { key: 'ab151f12048635eb5e47f4cbafcd6f04637f7dfd', "aria-labelledby": labelledBy, class: {
                 'xpl-tab-panel': true,
                 'xpl-tab-panel--selected': this.selected,
-            }, id: panelId, role: "tabpanel" }, h("slot", { key: 'e18aeb92b7082c0c2e809396570b43ac41c34f87' })));
+            }, id: panelId, role: "tabpanel" }, h("slot", { key: '81d82c0f3d8b019ec0abf6cbec34529b216b6533' })));
     }
     static get is() { return "xpl-tab-panel"; }
     static get properties() {

package/dist/collection/components/xpl-table/utils/move-row-dom.js

@@ -0,0 +1,50 @@
+export function getNearestTableBodyRowFromNode(node) {
+    const el = node instanceof HTMLElement ? node : null;
+    if (!el) {
+        return null;
+    }
+    const row = el.closest('xpl-table-row');
+    return row != null ? row : null;
+}
+export function getNextVisibleTableBodyRowAfter(element) {
+    const parent = element.parentElement;
+    if (!parent)
+        return null;
+    const siblings = Array.from(parent.children);
+    const idx = siblings.indexOf(element);
+    if (idx === -1)
+        return null;
+    for (let i = idx + 1; i < siblings.length; i += 1) {
+        const n = siblings[i];
+        if (n.tagName.toLowerCase() === 'xpl-table-row' && !n.hasAttribute('hidden')) {
+            return n;
+        }
+    }
+    return null;
+}
+export function moveRowInTableBody(body, draggedRow, dropTargetRow) {
+    if (draggedRow === dropTargetRow || draggedRow.parentElement !== body) {
+        return;
+    }
+    if (dropTargetRow.parentElement !== body) {
+        return;
+    }
+    const visible = Array.from(body.children).filter((c) => c.tagName.toLowerCase() === 'xpl-table-row' && !c.hasAttribute('hidden'));
+    const fromIndex = visible.indexOf(draggedRow);
+    const toIndex = visible.indexOf(dropTargetRow);
+    if (fromIndex === -1 || toIndex === -1 || fromIndex === toIndex) {
+        return;
+    }
+    if (fromIndex < toIndex) {
+        const nextVisible = getNextVisibleTableBodyRowAfter(dropTargetRow);
+        if (nextVisible) {
+            body.insertBefore(draggedRow, nextVisible);
+        }
+        else {
+            body.insertBefore(draggedRow, null);
+        }
+    }
+    else {
+        body.insertBefore(draggedRow, dropTargetRow);
+    }
+}

package/dist/collection/components/xpl-table/utils/table-internal.js

@@ -0,0 +1,57 @@
+export const XPL_TABLE_COLUMN_WIDTHS_CHANGE_EVENT = 'xplTableColumnWidthsChange';
+export const TABLE_HEADER_CELL_MIN_WIDTH_PX = 48;
+export const getGridColumnWidthFromHeaderCell = (cell) => {
+    if (cell.tagName.toLowerCase() !== 'xpl-table-header-cell') {
+        return 'auto';
+    }
+    const host = cell;
+    const fromProp = typeof host.columnWidth === 'string' ? host.columnWidth.trim() : '';
+    const fromAttr = cell.getAttribute('column-width')?.trim() ?? '';
+    const columnTrack = fromProp || fromAttr;
+    if (columnTrack.length > 0) {
+        return columnTrack;
+    }
+    const w = host.width;
+    if (typeof w === 'number' && Number.isFinite(w) && w > 0) {
+        return `${Math.max(TABLE_HEADER_CELL_MIN_WIDTH_PX, w)}px`;
+    }
+    const raw = cell.getAttribute('width');
+    if (raw === null || raw === '') {
+        return 'auto';
+    }
+    if (/^\s*\d+(\.\d+)?\s*$/.test(raw)) {
+        const n = Number.parseFloat(raw);
+        if (Number.isFinite(n) && n > 0) {
+            return `${Math.max(TABLE_HEADER_CELL_MIN_WIDTH_PX, n)}px`;
+        }
+        return 'auto';
+    }
+    return raw.trim();
+};
+export const SELECTION_MARK = 'data-xpl-selection-managed';
+export const ROW_REORDER_MARK = 'data-xpl-row-reorder-managed';
+export const getSortAffordanceIconName = (sortDirection) => {
+    if (sortDirection === 'asc')
+        return 'arrow-up';
+    return 'arrow-down';
+};
+export const cycleSortDirection = (current) => {
+    switch (current) {
+        case 'asc':
+            return 'desc';
+        case 'desc':
+            return null;
+        default:
+            return 'asc';
+    }
+};
+export const getIconType = (sortType) => {
+    switch (sortType) {
+        case 'asc':
+            return 'arrow-up';
+        case 'desc':
+            return 'arrow-down';
+        default:
+            return 'dash';
+    }
+};

package/dist/collection/components/xpl-table/xpl-table-body/xpl-table-body.js

@@ -1,7 +1,7 @@
 import { Host, h } from "@stencil/core";
 export class XplTableBody {
     render() {
-        return (h(Host, { key: '5a82de617cad4d37dace81ad6a636db1e3a944df', class: "xpl-table-body", role: "rowgroup" }, h("slot", { key: 'd141e2e041789142eb69c6b3453b25523e4ecf59' })));
+        return (h(Host, { key: 'e5934161758f0934269a09e4a1058f3fda919e9d', class: "xpl-table-body", role: "rowgroup" }, h("slot", { key: 'e042714dc35cbe4ecc83cff740f7a24de48feec1' })));
     }
     static get is() { return "xpl-table-body"; }
 }

package/dist/collection/components/xpl-table/xpl-table-cell/xpl-table-cell.js

@@ -0,0 +1,167 @@
+import { Host, h } from "@stencil/core";
+const CELL_MANAGED_DISABLED_ATTR = 'data-xpl-table-cell-managed-disabled';
+function isDisablableControl(el) {
+    if ('disabled' in el) {
+        return true;
+    }
+    switch (el.tagName) {
+        case 'BUTTON':
+        case 'INPUT':
+        case 'SELECT':
+        case 'TEXTAREA':
+        case 'FIELDSET':
+        case 'OPTGROUP':
+        case 'OPTION':
+            return true;
+        default:
+            return false;
+    }
+}
+export class XplTableCell {
+    constructor() {
+        this.align = 'left';
+        this.bold = false;
+        this.disabled = false;
+        this.underline = false;
+    }
+    onDisabledChange() {
+        this.propagateDisabledToSlotted();
+    }
+    componentDidLoad() {
+        this.propagateDisabledToSlotted();
+    }
+    propagateDisabledToSlotted() {
+        const setControlDisabled = (element) => {
+            if (!isDisablableControl(element)) {
+                return;
+            }
+            const control = element;
+            if (this.disabled) {
+                if (control.disabled) {
+                    return;
+                }
+                control.disabled = true;
+                control.setAttribute('disabled', '');
+                control.setAttribute(CELL_MANAGED_DISABLED_ATTR, '');
+                return;
+            }
+            if (!control.hasAttribute(CELL_MANAGED_DISABLED_ATTR)) {
+                return;
+            }
+            control.disabled = false;
+            control.removeAttribute('disabled');
+            control.removeAttribute(CELL_MANAGED_DISABLED_ATTR);
+        };
+        const walk = (parent) => {
+            Array.from(parent.children).forEach((child) => {
+                if (child.tagName === 'XPL-TABLE') {
+                    return;
+                }
+                setControlDisabled(child);
+                walk(child);
+            });
+        };
+        walk(this.el);
+    }
+    render() {
+        return (h(Host, { key: 'f4e7639b0cb35eda08fdbb13cf1e0ddcb380cb7a', role: "gridcell", class: {
+                'xpl-table-cell': true,
+                [`xpl-table-cell--align-${this.align}`]: true,
+                'xpl-table-cell--bold': this.bold,
+                'xpl-table-cell--underline': this.underline,
+                'xpl-table-cell--disabled': this.disabled,
+            } }, h("slot", { key: '16d9a63cb992b9bbeb56500b5d6537b824336b40' })));
+    }
+    static get is() { return "xpl-table-cell"; }
+    static get properties() {
+        return {
+            "align": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'left' | 'right' | 'center'",
+                    "resolved": "\"center\" | \"left\" | \"right\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Horizontal text alignment within the cell."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "align",
+                "defaultValue": "'left'"
+            },
+            "bold": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Renders cell text in bold (--xpl-font-weight-semibold)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "bold",
+                "defaultValue": "false"
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Whether the cell and its interactive children are disabled. Set automatically by xpl-table-row."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "disabled",
+                "defaultValue": "false"
+            },
+            "underline": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Adds an underline to cell text."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "underline",
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get elementRef() { return "el"; }
+    static get watchers() {
+        return [{
+                "propName": "disabled",
+                "methodName": "onDisabledChange"
+            }];
+    }
+}

package/dist/collection/components/xpl-table/xpl-table-footer/xpl-table-footer.js

@@ -1,7 +1,7 @@
 import { Host, h } from "@stencil/core";
 export class XplTableFooter {
     render() {
-        return (h(Host, { key: '7c0c20a91c48433b21a8a83094d614de532b317b', class: "xpl-table-footer", role: "rowgroup" }, h("slot", { key: 'aebc40fc1edc9ced7b2420303d3a38897c24939f' })));
+        return (h(Host, { key: '57872baa33166a8146bd0c9b3d7af1597e1fb41e', class: "xpl-table-footer", role: "rowgroup" }, h("slot", { key: '65def2bdfee1be95fa966f7f746dedc7176b91e6' })));
     }
     static get is() { return "xpl-table-footer"; }
 }

package/dist/collection/components/xpl-table/xpl-table-footer-cell/xpl-table-footer-cell.js

@@ -4,10 +4,10 @@ export class XplTableFooterCell {
         this.align = 'left';
     }
     render() {
-        return (h(Host, { key: '331e85728bbd31aa7cde4fe169874879518b92bd', class: {
+        return (h(Host, { key: '1434aa38de9894875e70b2a7b3c55479726727d5', class: {
                 'xpl-table-footer-cell': true,
                 [`xpl-table-footer-cell--align-${this.align}`]: true,
-            }, role: "gridcell" }, h("slot", { key: '29f074c9c81b9cf38bca0ef3eb92a54a408b2436' })));
+            }, role: "gridcell" }, h("slot", { key: 'e3bac594dbd5265f44c7bd620e1fccfc9248abf0' })));
     }
     static get is() { return "xpl-table-footer-cell"; }
     static get properties() {