@xplortech/apollo-core 2.7.0 → 2.7.1

package/dist/apollo-core/p-16742606.entry.js

@@ -1 +0,0 @@
-import{r as s,h as e,H as l}from"./p-C7bgJs6C.js";import{v as t}from"./p-Cqlsd6nf.js";const i=class{constructor(e){s(this,e),this.variant="default",this.id=t()}render(){let s="xpl-toggle-container";this.disabled&&(s+=" xpl-toggle-container--disabled");let t="xpl-toggle";return"small"===this.variant&&(t+=" xpl-toggle--small"),e(l,{key:"b501bb268b9fbc2756544b17481ae78ee3144960",class:s},(this.heading||this.description)&&e("label",{key:"34d2bb6e6c4538a863f333e8124fbde9ec2544cb",class:{"xpl-label":!0,"xpl-label--disabled":this.disabled},htmlFor:this.id},this.heading,this.description&&e("small",{key:"f9f5ff29d428e776566d0a12e62ab7efe311feb5",class:{"xpl-description":!0,"xpl-description--disabled":this.disabled}},this.description)),e("input",{key:"f9b1baf90d9336711ce1354a66770c7423551af8",class:t,type:"checkbox",checked:this.checked,disabled:this.disabled,id:this.id,name:this.name}),this.label&&e("label",{key:"49f803372904b5b87394a55c67f428401cd14379",htmlFor:this.id},this.label))}};export{i as xpl_toggle}

package/dist/apollo-core/p-3eb5eb7c.entry.js

@@ -1 +0,0 @@
-import{r as e,h as t,H as s}from"./p-C7bgJs6C.js";const a=class{constructor(t){e(this,t),this.disabled=!1,this.selected=!1,this.isDisabled=!1}componentWillLoad(){this.isDisabled=this.disabled}componentDidLoad(){this.updateRowCellsDisabledState()}componentDidUpdate(){this.updateRowCellsDisabledState()}updateRowCellsDisabledState(){this.hostElement.querySelectorAll("xpl-dynamic-table-cell").forEach((e=>{e.disabled=this.isDisabled}))}render(){return t(s,{key:"b1a117c4961d5a2f618510159b292184c2c1aed3",role:"row",class:`xpl-dynamic-table-row\n            ${this.isDisabled?"disabled":""}\n            ${this.selected?"selected":""}`,ref:e=>{this.hostElement=e}},t("slot",{key:"be0ef005b0ed337272e92d29dda61dcbe966c4ed"}))}};export{a as xpl_dynamic_table_row}

package/dist/apollo-core/p-4882f0bd.entry.js

@@ -1 +0,0 @@
-import{r as e,h as a,H as t,g as s}from"./p-C7bgJs6C.js";const c=class{constructor(a){e(this,a),this.selectedItemCount=0}componentDidLoad(){const e=this.el.querySelector('[slot="actions-right"]');null!==e&&(e.style.marginLeft="auto")}listenToSelectedItemCountChange(e){this.selectedItemCount=e.detail.length}render(){return a(t,{key:"eda1f57ef1a207b82f622f090dd30f21d60bbc61",class:{"xpl-toolbar":!0,dark:!0,hidden:0===this.selectedItemCount}},a("div",{key:"fe703bf7fb49ebe27f4eee7973ea1e24c5ed50a4",class:"toolbar"},a("p",{key:"d0d9cb84b4828688aabbabb3395ff3c18c4d2a78",class:"selected-item-count"},this.selectedItemCount," Selected"),a("div",{key:"c1259be179d245e4c18a3690f800eb493f491ba9",class:"actions"},a("slot",{key:"40000dda8efbfd0aa7175e0e5db1c1c9f4e7e89f",name:"actions-left"}),a("slot",{key:"255e21ebb1af8fde1bb76a1a1243eeadc4146d3d",name:"actions-right"}))))}get el(){return s(this)}};export{c as xpl_toolbar}

package/dist/apollo-core/p-64b34268.entry.js

@@ -1 +0,0 @@
-import{r as s,h as t,H as i}from"./p-C7bgJs6C.js";const e=class{constructor(t){s(this,t),this.xs=6,this.sm=6,this.md=6,this.lg=6}render(){let s="xpl-grid-item";return s+=` xpl-grid-item-xs-${this.xs}`,s+=` xpl-grid-item-sm-${this.sm}`,s+=` xpl-grid-item-md-${this.md}`,s+=` xpl-grid-item-lg-${this.lg}`,t(i,{key:"bb28d83b6fd6ee92390ffcb5a505f5084f5624b9",class:s},t("slot",{key:"db3cf487db67044879425c830a14a44e06d19414"}))}};export{e as xpl_grid_item}

package/dist/apollo-core/p-71b75f36.entry.js

@@ -1 +0,0 @@
-import{r as a,h as c,H as e,g as d}from"./p-C7bgJs6C.js";const s=class{constructor(c){a(this,c)}componentDidLoad(){if(this.link){const a=this.el.getElementsByTagName("a")[0]||this.el.getElementsByTagName("button")[0],c=document.createTextNode(this.name),e=document.createElement("span");e.appendChild(c),a.setAttribute("class","xpl-large-card__anchor"),a.appendChild(e)}}render(){const a="graph-content",d=this.el.querySelector(`[slot="${a}"]`);return c(e,{key:"886078965cb1ca87fd9c4f45a8b06f089a4b2e04",role:"group",class:"xpl-large-card "+(this.link?"xpl-large-card__link":""),tabindex:"0"},c("dt",{key:"1c2006c9167b2d46262b222ace3c5e9135863783",class:"xpl-large-card__header"},c("header",{key:"21ba4629c7e3d0d9dff98f9dde2ac4bc9f1f494e"},c("slot",{key:"d50991dc4fcca6c56c04c7cc9a401f0894035aa2",name:"title"},this.name),this.link&&c("span",{key:"35b1b15786c1674f6d1797ec3b04da81b27d5d3a",class:"xpl-data-card__header-arrow"},c("xpl-icon",{key:"f52a7a39b3d044341296d88adb9d2bc07cdec9ab",icon:"chevron-right",size:16}))),this.description&&c("div",{key:"bac9d6cec27272d277c991c81e651714603066a2",class:"xpl-large-card__description"},this.description)),c("dd",{key:"9da3ca8ec575a6755f1f47065299ec3ab3e5169b",class:"xpl-large-card__body"},d&&c("slot",{key:"022da3c1e07c264441c58f7d42d6edca109a504d",name:a})))}get el(){return d(this)}};export{s as xpl_large_card}

package/dist/apollo-core/p-84254a24.entry.js

@@ -1 +0,0 @@
-import{r as e,h as t,H as s,g as a}from"./p-C7bgJs6C.js";const i=class{constructor(t){e(this,t),this.disabled=!1}componentDidLoad(){this.updateSlottedComponentsWhenDisabled()}componentDidUpdate(){this.updateSlottedComponentsWhenDisabled()}updateSlottedComponentsWhenDisabled(){this.hostElement.querySelectorAll("*").forEach((e=>{"disabled"in e&&(e.disabled=this.disabled)}))}render(){const e=Array.from(this.el.parentElement.children).indexOf(this.el)+1;return t(s,{key:"924f54186ae2eb07bb4fab65eed7815f60be3a95",role:"gridcell","aria-colindex":e,class:"xpl-dynamic-table-cell",ref:e=>{this.hostElement=e}},t("slot",{key:"a18ef630d9f7f4c8b4079f2d83afe6b28700fb90"}))}get el(){return a(this)}};export{i as xpl_dynamic_table_cell}

package/dist/apollo-core/p-9f2a0321.entry.js

@@ -1 +0,0 @@
-import{r as t,c as s,h as c,H as i}from"./p-C7bgJs6C.js";const e=class{constructor(c){t(this,c),this.clickPrimary=s(this,"clickPrimary",7),this.clickSecondary=s(this,"clickSecondary",7),this.clickTertiary=s(this,"clickTertiary",7),this.onPrimary=()=>this.clickPrimary.emit(),this.onSecondary=()=>this.clickSecondary.emit(),this.onTertiary=()=>this.clickTertiary.emit()}render(){return c(i,{key:"e27ee4f9278fe24ab710504fc5a83b4b92b74607",class:"xpl-button-row"},c("div",{key:"e7ea1f3ef4dd52fd3026e47679f1e2663f315a98",class:"xpl-button-row-inner"},c("div",{key:"da4ccf63f6f00d83f829fb7cf1e2d20c76cffa33",class:"xpl-button-row__left"},this.secondary&&c("xpl-button",{key:"cb3d7caeba1d66f0f752e19b33a31d627bc26911",variant:"secondary",type:"button",onClick:this.onSecondary},this.secondary)),c("div",{key:"c7342cf52d016482c2ab8e33ecd8c3616061c107",class:"xpl-button-row__right"},this.tertiary&&c("xpl-button",{key:"1ed372cc087ef1a0c650282f90aa0117b35745bc",variant:"subtle",type:"button",onClick:this.onTertiary},this.tertiary),this.secondary&&c("xpl-button",{key:"56d88d07742c5e2900831f3a1ecf026d05299632",variant:"secondary",type:"button",onClick:this.onSecondary},this.secondary),this.primary&&c("xpl-button",{key:"5bd13162e70b4fc59996b62f507cfc2d4e7418d7",class:"xpl-button-row__primary",onClick:this.onPrimary},this.primary))))}};export{e as xpl_button_row}

package/dist/apollo-core/p-cde83ab0.entry.js

@@ -1 +0,0 @@
-import{r as s,h as t,H as r,g as i}from"./p-C7bgJs6C.js";const e=class{constructor(t){s(this,t)}componentDidLoad(){const s=Array.from(this.container.querySelectorAll(".xpl-grid-item"));let t=0,r=0,i=0,e=0;s.forEach((s=>{t+=+s.getAttribute("lg")||6,r+=+s.getAttribute("md")||6,i+=+s.getAttribute("sm")||6,e+=+s.getAttribute("xs")||6,t%6==0&&s.classList.add("xpl-grid-item-lg-last"),r%6==0&&s.classList.add("xpl-grid-item-md-last"),i%6==0&&s.classList.add("xpl-grid-item-sm-last"),e%6==0&&s.classList.add("xpl-grid-item-xs-last")}))}render(){return t(r,{key:"0036b594c89e75a9b302e7a7d9c99d4703a8b729",class:"xpl-grid"})}get container(){return i(this)}};export{e as xpl_grid}

package/dist/apollo-core/p-e7363036.entry.js

@@ -1 +0,0 @@
-import{r as a,c as e,h as d,H as c}from"./p-C7bgJs6C.js";const b=class{constructor(d){a(this,d),this.navWidth=e(this,"navWidth",7),this.width="default"}navWidthHandler(){this.navWidth.emit(this.width)}connectedCallback(){this.navWidthHandler()}componentDidUpdate(){this.navWidthHandler()}render(){return d(c,{key:"12ad41e2631d3cbab84b0bf536ffaf4fc31e7f8b",class:`xpl-main-nav xpl-main-nav--${this.width}`,"aria-label":"Sidebar"},d("nav",{key:"54c0fcc49ddda8846279b8efc4afe0244e054211"},d("header",{key:"a1803d0c15541eb7d8b84d17d6e8c5613472dd7e","aria-label":"Sidebar Header"},d("slot",{key:"cee7321f97dc59f7d7e844ecd8fab6ba656b92e9",name:"logo"}),d("slot",{key:"f33cd91b4ad2e7dad79f89401477c7c2cc7636aa",name:"brand-name"})),d("div",{key:"d7951aa7282d7be3107b15196679f2e55c76d847",class:"xpl-main-nav__main_section"},d("slot",{key:"716d5be941f65ce57c2a9f12e4eeaedef83c0dd0",name:"navigation"})),d("footer",{key:"880b9fb98c5d0d2b4133cacb73a7c339590bf8bb",class:"xpl-main-nav__footer","aria-label":"Sidebar Footer"},d("slot",{key:"005c2efc4a3490e50a2b692d0e9dc7e2ce76d938",name:"footer"}))))}};export{b as xpl_main_nav}

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

@@ -1,50 +0,0 @@
-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

@@ -1,58 +0,0 @@
-export const XPL_TABLE_COLUMN_WIDTHS_CHANGE_EVENT = 'xplTableColumnWidthsChange';
-export const TABLE_HEADER_CELL_MIN_WIDTH_PX = 48;
-export const getGridColumnWidthFromHeaderCell = (cell) => {
-    var _a, _b;
-    if (cell.tagName.toLowerCase() !== 'xpl-table-header-cell') {
-        return 'auto';
-    }
-    const host = cell;
-    const fromProp = typeof host.columnWidth === 'string' ? host.columnWidth.trim() : '';
-    const fromAttr = (_b = (_a = cell.getAttribute('column-width')) === null || _a === void 0 ? void 0 : _a.trim()) !== null && _b !== void 0 ? _b : '';
-    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 +0,0 @@
-import { Host, h } from "@stencil/core";
-export class XplTableBody {
-    render() {
-        return (h(Host, { key: '7320d9e105bbd49c3ce38b8c199b965a3863440c', role: "rowgroup", class: "xpl-table-body" }, h("slot", { key: '3df8f5a49bca0c8b50126cb41e59e1209e57fc6b' })));
-    }
-    static get is() { return "xpl-table-body"; }
-}

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

@@ -1,155 +0,0 @@
-import { Host, h } from "@stencil/core";
-function isDisablableControl(el) {
-    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;
-            control.disabled = this.disabled;
-            if (this.disabled) {
-                control.setAttribute('disabled', '');
-            }
-            else {
-                control.removeAttribute('disabled');
-            }
-        };
-        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: '91700fc89eff07fc5c54474c12e3a02eb602c6c3', 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: '5e956de9f694db16d9f5ea89bda1ff05a15e9efa' })));
-    }
-    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 +0,0 @@
-import { Host, h } from "@stencil/core";
-export class XplTableFooter {
-    render() {
-        return (h(Host, { key: '891052963f727f283783138363c9a925cb59140b', role: "rowgroup", class: "xpl-table-footer" }, h("slot", { key: 'df01f64a46ecd29380df26e053c2a6c246a22556' })));
-    }
-    static get is() { return "xpl-table-footer"; }
-}

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

@@ -1,37 +0,0 @@
-import { Host, h } from "@stencil/core";
-export class XplTableFooterCell {
-    constructor() {
-        this.align = 'left';
-    }
-    render() {
-        return (h(Host, { key: '452cb6ac0333ca57329341404343c290c63fc508', role: "gridcell", class: {
-                'xpl-table-footer-cell': true,
-                [`xpl-table-footer-cell--align-${this.align}`]: true,
-            } }, h("slot", { key: 'db6d5848f2aa009437317b9e71a47f0ca9245161' })));
-    }
-    static get is() { return "xpl-table-footer-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'"
-            }
-        };
-    }
-}

package/dist/collection/components/xpl-table/xpl-table-header/table-header.stories.js

@@ -1,131 +0,0 @@
-export default {
-    title: 'Components/Dynamic Table/Table Header',
-    component: 'xpl-table-header',
-    parameters: {
-        docs: {
-            description: {
-                component: 'Compositional table header row. Put `xpl-table-header-cell` inside `xpl-table-header` → `xpl-table-row`. For sortable columns, set `sortable` (and optional `sort-key`) on label cells; parent `xpl-table` coordinates headers and emits `sortChanged`. Legacy `columns`/`data` + `isSortable`/`sortableColumns` is only for the deprecated built-in `<table>` API.',
-            },
-        },
-    },
-    argTypes: {
-        firstCellType: {
-            control: 'select',
-            options: ['label', 'checkbox', 'icon'],
-        },
-        firstCellLabel: {
-            control: 'text',
-        },
-        firstCellIcon: {
-            control: 'select',
-            options: ['chevron-down', 'chevron-up', 'heart', 'dollar-sign'],
-        },
-        firstCellWidth: {
-            control: 'number',
-        },
-        secondCellType: {
-            control: 'select',
-            options: ['label', 'checkbox', 'icon'],
-        },
-        secondCellLabel: {
-            control: 'text',
-        },
-        secondCellIcon: {
-            control: 'select',
-            options: ['chevron-down', 'chevron-up', 'heart', 'dollar-sign'],
-        },
-        secondCellWidth: {
-            control: 'number',
-        },
-        thirdCellType: {
-            control: 'select',
-            options: ['label', 'checkbox', 'icon'],
-        },
-        thirdCellLabel: {
-            control: 'text',
-        },
-        thirdCellIcon: {
-            control: 'select',
-            options: ['chevron-down', 'chevron-up', 'heart', 'dollar-sign'],
-        },
-        thirdCellWidth: {
-            control: 'number',
-        },
-    },
-    tags: ['beta'],
-};
-export const TableHeader = ({ firstCellType, firstCellLabel, firstCellIcon, firstCellWidth, secondCellType, secondCellLabel, secondCellIcon, secondCellWidth, thirdCellType, thirdCellLabel, thirdCellIcon, thirdCellWidth, }) => `
-    <xpl-table label="Table header demo">
-        <xpl-table-header>
-            <xpl-table-row>
-                <xpl-table-header-cell
-                    type="${firstCellType}"
-                    label="${firstCellLabel}"
-                    icon="${firstCellIcon}"
-                    width="${firstCellWidth}"
-                ></xpl-table-header-cell>
-                <xpl-table-header-cell
-                    type="${secondCellType}"
-                    label="${secondCellLabel}"
-                    icon="${secondCellIcon}"
-                    width="${secondCellWidth}"
-                ></xpl-table-header-cell>
-                <xpl-table-header-cell
-                    type="${thirdCellType}"
-                    label="${thirdCellLabel}"
-                    icon="${thirdCellIcon}"
-                    width="${thirdCellWidth}"
-                >
-                </xpl-table-header-cell>
-            </xpl-table-row>
-        </xpl-table-header>
-        <xpl-table-body></xpl-table-body>
-    </xpl-table>
-  `;
-TableHeader.args = {
-    firstCellType: 'label',
-    firstCellLabel: '',
-    firstCellIcon: 'heart',
-    firstCellWidth: 48,
-    secondCellType: 'icon',
-    secondCellLabel: 'Column Item 2',
-    secondCellIcon: 'heart',
-    secondCellWidth: 48,
-    thirdCellType: 'label',
-    thirdCellLabel: 'Column Item 3',
-    thirdCellIcon: 'heart',
-    thirdCellWidth: 208,
-};
-TableHeader.parameters = {
-    docs: {
-        description: {
-            story: 'This story only swaps cell types/labels. For sort affordances, use `xpl-table-header-cell` with `sortable` inside a full compositional table — see **Components → Table**.',
-        },
-    },
-    'web-component': {
-        render: TableHeader(TableHeader.args),
-    },
-    html: {
-        render: `
-            <div role="grid" class="xpl-table" aria-label="Table header demo" aria-colcount="3">
-                <div role="rowgroup">
-                    <div role="row">
-                        <div role="columnheader" aria-colindex="1" class="xpl-table-header-cell" width="48">
-                            <span></span>
-                        </div>
-                        <div role="columnheader" aria-colindex="2" class="xpl-table-header-cell" width="48">
-                            <i class="icon-heart" aria-hidden="true"></i>
-                        </div>
-                        <div role="columnheader" aria-colindex="3" class="xpl-table-header-cell" width="208">
-                            <span>Column Item 3</span>
-                        </div>
-                    </div>
-                </div>
-                <div role="rowgroup" class="xpl-table-body"></div>
-            </div>`,
-    },
-    design: {
-        type: 'figma',
-        url: 'https://www.figma.com/design/MjjYek73MFnHmVNdm45Sd1/Apollo-Web?node-id=14764-42036&p=f&t=xrSF2t7u1Brg2fnZ-11',
-    },
-};

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

@@ -1,7 +0,0 @@
-import { Host, h } from "@stencil/core";
-export class TableHeader {
-    render() {
-        return (h(Host, { key: '70eac99819cc3acbbfb54607fc657fb27bd26b4b', role: "rowgroup", class: "xpl-table-header" }, h("slot", { key: '9c46b25d247603f8c87a3994615bd45c617d9bb9' })));
-    }
-    static get is() { return "xpl-table-header"; }
-}

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

@@ -1,105 +0,0 @@
-function renderHeaderCell(args) {
-    var _a, _b, _c, _d, _e;
-    const type = String((_a = args.type) !== null && _a !== void 0 ? _a : 'label');
-    const label = String((_b = args.label) !== null && _b !== void 0 ? _b : '');
-    const icon = String((_c = args.icon) !== null && _c !== void 0 ? _c : '');
-    const align = String((_d = args.align) !== null && _d !== void 0 ? _d : 'left');
-    const checked = Boolean(args.checked);
-    const indeterminate = Boolean(args.indeterminate);
-    const checkboxAriaLabel = String((_e = args.checkboxAriaLabel) !== null && _e !== void 0 ? _e : '');
-    let attrs = `type="${type}" align="${align}"`;
-    if (label)
-        attrs += ` label="${label}"`;
-    if (type === 'icon')
-        attrs += ` icon="${icon}"`;
-    if (type === 'checkbox') {
-        if (checked)
-            attrs += ' checked';
-        if (indeterminate)
-            attrs += ' indeterminate';
-        if (checkboxAriaLabel)
-            attrs += ` checkbox-aria-label="${checkboxAriaLabel}"`;
-    }
-    return `<xpl-table-header-cell ${attrs}></xpl-table-header-cell>`;
-}
-export default {
-    title: 'Components/Dynamic Table/Table Header Cell',
-    component: 'xpl-table-header-cell',
-    parameters: {
-        docs: {
-            description: {
-                component: 'Column header cell for compositional tables. Set `width` (px, min 48) or `column-width` (any CSS grid track, e.g. `1fr`); parent `xpl-table` builds `grid-template-columns` (`--column-widths`). For sorting, set `sortable` (+ optional `sort-key`) on `type="label"` cells; the parent table listens for `headerSortChange` and emits `sortChanged` (it does not reorder body rows — your app or a demo script does).',
-            },
-        },
-    },
-    argTypes: {
-        type: {
-            control: 'select',
-            options: ['label', 'checkbox', 'icon', 'empty'],
-        },
-        label: {
-            control: 'text',
-        },
-        icon: {
-            control: 'select',
-            options: ['chevron-down', 'chevron-up', 'heart', 'dollar-sign'],
-        },
-        align: {
-            control: 'select',
-            options: ['left', 'center', 'right'],
-        },
-        checked: { control: 'boolean' },
-        indeterminate: { control: 'boolean' },
-        checkboxAriaLabel: { control: 'text' },
-    },
-    tags: ['beta'],
-};
-export const TableHeaderCell = (args) => renderHeaderCell(args);
-TableHeaderCell.args = {
-    type: 'label',
-    label: 'Column Item',
-    icon: 'chevron-down',
-    align: 'left',
-    checked: false,
-    indeterminate: false,
-    checkboxAriaLabel: '',
-};
-TableHeaderCell.parameters = {
-    'web-component': {
-        render: (args) => renderHeaderCell(args),
-    },
-    html: {
-        render: (args) => {
-            var _a, _b, _c, _d;
-            const type = String((_a = args.type) !== null && _a !== void 0 ? _a : 'label');
-            const label = String((_b = args.label) !== null && _b !== void 0 ? _b : '');
-            const icon = String((_c = args.icon) !== null && _c !== void 0 ? _c : '');
-            const align = String((_d = args.align) !== null && _d !== void 0 ? _d : 'left');
-            const checked = Boolean(args.checked);
-            const indeterminate = Boolean(args.indeterminate);
-            const inner = () => {
-                switch (type) {
-                    case 'label':
-                        return `<span>${label}</span>`;
-                    case 'checkbox':
-                        return `<input type="checkbox" class="xpl-checkbox"${checked ? ' checked' : ''}${indeterminate ? ' data-indeterminate="true"' : ''} />`;
-                    case 'icon':
-                        return `<xpl-icon icon="${icon}"></xpl-icon>`;
-                    case 'empty':
-                        return '';
-                    default:
-                        return '';
-                }
-            };
-            return `
-                <div role="columnheader" class="xpl-table-header-cell" style="text-align: ${align};">
-                    ${inner()}
-                </div>
-            `;
-        },
-    },
-    design: {
-        type: 'figma',
-        url: 'https://www.figma.com/design/MjjYek73MFnHmVNdm45Sd1/Apollo-Web?node-id=14764-42036&p=f&t=xrSF2t7u1Brg2fnZ-11',
-    },
-};