@cds/core 5.6.4 → 6.0.0-beta.1

package/grid/cell/grid-cell.element.d.ts

@@ -0,0 +1,25 @@
+import { LitElement } from 'lit';
+/**
+ * Grid Cell
+ *
+ * ```typescript
+ * import '@cds/core/grid/register.js';
+ * ```
+ *
+ * @internal
+ * @element cds-grid-cell
+ * @cssprop --border-right
+ * @cssprop --border-left
+ * @cssprop --min-height
+ * @cssprop --min-width
+ * @cssprop --font-size
+ * @cssprop --justify-content
+ * @cssprop --padding-block
+ * @cssprop --padding-inline-start
+ * @cssprop --padding-inline-end
+ * @cssprop --color
+ */
+export declare class CdsGridCell extends LitElement {
+    static styles: import("lit").CSSResultGroup[];
+    render(): import("lit-html").TemplateResult<1>;
+}

package/grid/cell/grid-cell.element.js

@@ -0,0 +1,2 @@
+import{LitElement as s,html as e}from"lit";import{baseStyles as r}from"@cds/core/internal";import t from"./grid-cell.element.scss.js";class o extends s{render(){return e`<div class="private-host" focusable><slot></slot></div>`}}o.styles=[r,t];export{o as CdsGridCell};
+//# sourceMappingURL=grid-cell.element.js.map

package/grid/cell/grid-cell.element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-cell.element.js","sources":["../../../../src/grid/cell/grid-cell.element.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nimport { LitElement, html } from 'lit';\nimport { baseStyles } from '@cds/core/internal';\nimport styles from './grid-cell.element.scss';\n/**\n * Grid Cell\n *\n * ```typescript\n * import '@cds/core/grid/register.js';\n * ```\n *\n * @internal\n * @element cds-grid-cell\n * @cssprop --border-right\n * @cssprop --border-left\n * @cssprop --min-height\n * @cssprop --min-width\n * @cssprop --font-size\n * @cssprop --justify-content\n * @cssprop --padding-block\n * @cssprop --padding-inline-start\n * @cssprop --padding-inline-end\n * @cssprop --color\n */\nexport class CdsGridCell extends LitElement {\n    render() {\n        return html `\n      <div class=\"private-host\" focusable>\n        <slot></slot>\n      </div>\n    `;\n    }\n}\nCdsGridCell.styles = [baseStyles, styles];\n"],"names":["CdsGridCell","LitElement","render","html","styles","baseStyles"],"mappings":"sIA4BO,MAAMA,UAAoBC,EAC7BC,SACI,OAAOC,CAAK,2DAOpBH,EAAYI,OAAS,CAACC,EAAYD"}

package/grid/cell/grid-cell.element.scss.js

@@ -0,0 +1,2 @@
+import{css as t}from"lit";var o=t`:host{--border-right:var(--cell-border-width) solid var(--cds-alias-object-border-color, var(--cds-global-color-construction-200, #cbd4d8));--border-left:0;--min-width:var(--cds-alias-object-interaction-touch-target, 2.25rem);--font-size:var(--cds-global-typography-font-size-3, 0.8125rem);--justify-content:var(--cell-justify-content, start);--padding-block:var(--cds-global-space-3, 0.25rem);--padding-inline-start:var(--cds-global-space-6, 0.75rem);--padding-inline-end:var(--cds-global-space-6, 0.75rem);--color:var(--cds-global-typography-color-500, var(--cds-global-color-black, black));display:block;height:100%;outline:0!important;position:sticky}.private-host{justify-content:var(--justify-content);border-left:var(--border-left);background:var(--background);box-shadow:var(--box-shadow);border-right:var(--border-right);min-width:var(--min-width);font-size:var(--font-size);padding-inline-start:var(--padding-inline-start);padding-inline-end:var(--padding-inline-end);padding-block:var(--padding-block);color:var(--color);text-align:left;display:flex;gap:var(--cds-global-space-5,.5rem);line-height:1em;align-items:center;width:100%;height:100%;position:relative}:host([type=action]){--padding-block:0;--padding-inline-start:0;--padding-inline-end:0}:host([type=action]) .private-host{justify-content:center;min-width:var(--cds-global-space-11,2.25rem)}:host([highlight]) .private-host::after{display:block;position:absolute;inset:0;background:rgba(0,170,255,.2);content:"";pointer-events:none}[focusable]{outline-offset:calc(var(--cds-global-space-2,.125rem)*-1)!important}:host([type=action]:focus-within) [focusable]{outline:var(--cds-alias-object-interaction-outline,Highlight solid 2px)!important;outline-offset:calc(var(--cds-global-space-2,.125rem)*-1)!important}@media (-webkit-min-device-pixel-ratio:0){:host([type=action]:focus-within) [focusable]{outline:var(--cds-alias-object-interaction-outline-webkit,5px auto -webkit-focus-ring-color)!important}}:host([type=action]:focus-within) ::slotted([cds-button-action]),:host([type=action]:focus-within) ::slotted([cds-control]){--cds-alias-object-interaction-outline-webkit:none!important;--cds-alias-object-interaction-outline:none!important;outline:0}`;export{o as default};
+//# sourceMappingURL=grid-cell.element.scss.js.map

package/grid/cell/grid-cell.element.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-cell.element.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/grid/column/grid-column-position.controller.d.ts

@@ -0,0 +1,15 @@
+import { ReactiveControllerHost } from 'lit';
+export declare type GridColumnPosition = ReactiveControllerHost & HTMLElement & {
+    position: '' | 'sticky' | 'fixed';
+};
+export declare class GridColumnPositionController {
+    private host;
+    private styles;
+    private previousPosition;
+    private get hostGrid();
+    constructor(host: GridColumnPosition);
+    hostUpdated(): Promise<void>;
+    private calculateColumnPositionStyles;
+    private getPositionStyle;
+    private borderStyle;
+}

package/grid/column/grid-column-position.controller.js

@@ -0,0 +1,2 @@
+class t{constructor(t){this.host=t,this.previousPosition="",this.host.addController(this)}get hostGrid(){return this.host.parentElement}async hostUpdated(){await this.host.updateComplete,this.host.ariaColIndex&&this.host.position!==this.previousPosition&&(this.previousPosition=this.host.position,this.styles||(this.styles=document.createElement("style"),this.hostGrid.append(this.styles)),this.calculateColumnPositionStyles())}calculateColumnPositionStyles(){const t=this.hostGrid.getBoundingClientRect(),i=this.host.offsetLeft<t.width/2?"left":"right";this.styles.innerHTML=`${this.getPositionStyle(i,t)}\n${this.borderStyle(i)}`}getPositionStyle(t,i){const s=this.host.getBoundingClientRect(),o="fixed"===this.host.position?s.left-i.left-1+"px":"initial",e="fixed"===this.host.position?s.right-s.left-s.width+"px":"initial";return`\n    [__id='${this.hostGrid._id}'] [aria-colindex="${this.host.ariaColIndex}"] {\n      ${"left"===t?`left: ${o};`:""}\n      ${"right"===t?`right: ${e};`:""}\n      ${"sticky"===this.host.position?"left: 0px;":""}\n    }\n\n    [__id='${this.hostGrid._id}'] cds-grid-cell[aria-colindex="${this.host.ariaColIndex}"] {\n      z-index: 98;\n    }`}borderStyle(t){const i="left"===t&&this.host.nextElementSibling.position!==this.host.position,s="right"===t&&this.host.previousElementSibling.position!==this.host.position;return""!==this.host.position&&(i||s)?`\n      [__id='${this.hostGrid._id}'] cds-grid-cell[aria-colindex="${this.host.ariaColIndex}"] {\n        --border-${"left"===t?"right":"left"}: var(--cds-alias-object-border-width-100) solid var(--cds-alias-object-border-color);\n      }`:""}}export{t as GridColumnPositionController};
+//# sourceMappingURL=grid-column-position.controller.js.map

package/grid/column/grid-column-position.controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-column-position.controller.js","sources":["../../../../src/grid/column/grid-column-position.controller.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nexport class GridColumnPositionController {\n    constructor(host) {\n        this.host = host;\n        this.previousPosition = '';\n        this.host.addController(this);\n    }\n    get hostGrid() {\n        return this.host.parentElement;\n    }\n    async hostUpdated() {\n        await this.host.updateComplete;\n        if (this.host.ariaColIndex && this.host.position !== this.previousPosition) {\n            this.previousPosition = this.host.position;\n            if (!this.styles) {\n                this.styles = document.createElement('style');\n                this.hostGrid.append(this.styles);\n            }\n            this.calculateColumnPositionStyles();\n        }\n    }\n    calculateColumnPositionStyles() {\n        const gridPosition = this.hostGrid.getBoundingClientRect();\n        const side = this.host.offsetLeft < gridPosition.width / 2 ? 'left' : 'right';\n        this.styles.innerHTML = `${this.getPositionStyle(side, gridPosition)}\\n${this.borderStyle(side)}`;\n    }\n    getPositionStyle(side, gridPosition) {\n        const position = this.host.getBoundingClientRect();\n        const left = this.host.position === 'fixed' ? `${position.left - gridPosition.left - 1}px` : 'initial';\n        const right = this.host.position === 'fixed' ? `${position.right - position.left - position.width}px` : 'initial';\n        return `\n    [__id='${this.hostGrid._id}'] [aria-colindex=\"${this.host.ariaColIndex}\"] {\n      ${side === 'left' ? `left: ${left};` : ''}\n      ${side === 'right' ? `right: ${right};` : ''}\n      ${this.host.position === 'sticky' ? `left: 0px;` : ''}\n    }\n\n    [__id='${this.hostGrid._id}'] cds-grid-cell[aria-colindex=\"${this.host.ariaColIndex}\"] {\n      z-index: 98;\n    }`;\n    }\n    borderStyle(side) {\n        const lastofLeft = side === 'left' && this.host.nextElementSibling.position !== this.host.position;\n        const lastofRight = side === 'right' && this.host.previousElementSibling.position !== this.host.position;\n        if (this.host.position !== '' && (lastofLeft || lastofRight)) {\n            // todo: test last of position\n            return `\n      [__id='${this.hostGrid._id}'] cds-grid-cell[aria-colindex=\"${this.host.ariaColIndex}\"] {\n        --border-${side === 'left' ? 'right' : 'left'}: var(--cds-alias-object-border-width-100) solid var(--cds-alias-object-border-color);\n      }`;\n        }\n        else {\n            return '';\n        }\n    }\n}\n"],"names":["GridColumnPositionController","constructor","host","this","previousPosition","addController","hostGrid","parentElement","async","updateComplete","ariaColIndex","position","styles","document","createElement","append","calculateColumnPositionStyles","gridPosition","getBoundingClientRect","side","offsetLeft","width","innerHTML","getPositionStyle","borderStyle","left","right","_id","lastofLeft","nextElementSibling","lastofRight","previousElementSibling"],"mappings":"AAKO,MAAMA,EACTC,YAAYC,GACRC,KAAKD,KAAOA,EACZC,KAAKC,iBAAmB,GACxBD,KAAKD,KAAKG,cAAcF,MAExBG,eACA,OAAOH,KAAKD,KAAKK,cAErBC,0BACUL,KAAKD,KAAKO,eACZN,KAAKD,KAAKQ,cAAgBP,KAAKD,KAAKS,WAAaR,KAAKC,mBACtDD,KAAKC,iBAAmBD,KAAKD,KAAKS,SAC7BR,KAAKS,SACNT,KAAKS,OAASC,SAASC,cAAc,SACrCX,KAAKG,SAASS,OAAOZ,KAAKS,SAE9BT,KAAKa,iCAGbA,gCACI,MAAMC,EAAed,KAAKG,SAASY,wBAC7BC,EAAOhB,KAAKD,KAAKkB,WAAaH,EAAaI,MAAQ,EAAI,OAAS,QACtElB,KAAKS,OAAOU,UAAY,GAAGnB,KAAKoB,iBAAiBJ,EAAMF,OAAkBd,KAAKqB,YAAYL,KAE9FI,iBAAiBJ,EAAMF,GACnB,MAAMN,EAAWR,KAAKD,KAAKgB,wBACrBO,EAA8B,UAAvBtB,KAAKD,KAAKS,SAA0BA,EAASc,KAAOR,EAAaQ,KAAO,EAAvC,KAA+C,UACvFC,EAA+B,UAAvBvB,KAAKD,KAAKS,SAA0BA,EAASe,MAAQf,EAASc,KAAOd,EAASU,MAA7C,KAAyD,UACxG,MAAO,gBACFlB,KAAKG,SAASqB,yBAAyBxB,KAAKD,KAAKQ,2BAC7C,SAATS,EAAkB,SAASM,KAAU,aAC5B,UAATN,EAAmB,UAAUO,KAAW,aACjB,WAAvBvB,KAAKD,KAAKS,SAAwB,aAAe,2BAG5CR,KAAKG,SAASqB,sCAAsCxB,KAAKD,KAAKQ,8CAIvEc,YAAYL,GACR,MAAMS,EAAsB,SAATT,GAAmBhB,KAAKD,KAAK2B,mBAAmBlB,WAAaR,KAAKD,KAAKS,SACpFmB,EAAuB,UAATX,GAAoBhB,KAAKD,KAAK6B,uBAAuBpB,WAAaR,KAAKD,KAAKS,SAChG,MAA2B,KAAvBR,KAAKD,KAAKS,WAAoBiB,GAAcE,GAErC,kBACJ3B,KAAKG,SAASqB,sCAAsCxB,KAAKD,KAAKQ,sCACjD,SAATS,EAAkB,QAAU,wGAI5B"}

package/grid/column/grid-column-size.controller.d.ts

@@ -0,0 +1,18 @@
+import { ReactiveControllerHost } from 'lit';
+export declare type GridColumnSize = ReactiveControllerHost & HTMLElement & {
+    width: string;
+    type: string;
+};
+export declare class GridColumnSizeController {
+    private host;
+    private observers;
+    private get hostGrid();
+    private get hostRange();
+    constructor(host: GridColumnSize);
+    hostConnected(): Promise<void>;
+    hostUpdated(): Promise<void>;
+    hostDisconnected(): void;
+    private setActionWidth;
+    private updateSetColumnWidth;
+    private updateResizedColumnWidth;
+}

package/grid/column/grid-column-size.controller.js

@@ -0,0 +1,2 @@
+import{listenForAttributeListChange as t,onFirstInteraction as s,isNumericString as h}from"@cds/core/internal";class e{constructor(t){this.host=t,this.observers=[],this.host.addController(this)}get hostGrid(){return this.host.parentElement}get hostRange(){return this.host.shadowRoot?.querySelector("cds-internal-split-handle input")}async hostConnected(){this.setActionWidth(),this.hostGrid.shadowRoot?.addEventListener("slotchange",(()=>this.setActionWidth())),this.observers.push(t(this.host,["type"],(()=>this.setActionWidth()))),await this.host.updateComplete,await s(this.hostGrid),this.hostRange&&(this.hostRange.max=""+parseInt(getComputedStyle(this.hostGrid).width),this.hostRange.value=""+parseInt(getComputedStyle(this.host).width),this.hostRange.addEventListener("input",(t=>this.updateResizedColumnWidth(t.target.valueAsNumber))),this.hostRange.addEventListener("change",(t=>this.updateResizedColumnWidth(t.target.valueAsNumber))))}async hostUpdated(){await this.host.updateComplete,this.updateSetColumnWidth()}hostDisconnected(){this.observers.forEach((t=>t?.disconnect()))}setActionWidth(){if("action"===this.host.type||"action"===this.host.getAttribute("type")){this.host.width="36px";const t=Array.from(this.hostGrid.columns).indexOf(this.host);this.hostGrid.rows.forEach((s=>s.cells[t].setAttribute("type","action")))}}updateSetColumnWidth(){this.host.width&&void 0!==this.host.ariaColIndex&&(this.hostGrid.style.setProperty("--ch"+this.host.ariaColIndex,h(this.host.width)?this.host.width+"px":this.host.width),this.hostRange&&(this.hostRange.min=""+parseInt(this.host.width)??"",this.hostRange.value=this.host.width))}updateResizedColumnWidth(t){this.host.dispatchEvent(new CustomEvent("resizeChange",{detail:t,bubbles:!0}));const s=Math.max(h(this.host.width)||this.host.width?.includes("px")?parseInt(this.host.width):36,t);this.hostGrid.style.setProperty("--ch"+this.host.ariaColIndex,s+"px")}}export{e as GridColumnSizeController};
+//# sourceMappingURL=grid-column-size.controller.js.map

package/grid/column/grid-column-size.controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-column-size.controller.js","sources":["../../../../src/grid/column/grid-column-size.controller.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nimport { isNumericString, listenForAttributeListChange, onFirstInteraction } from '@cds/core/internal';\nexport class GridColumnSizeController {\n    constructor(host) {\n        this.host = host;\n        this.observers = [];\n        this.host.addController(this);\n    }\n    get hostGrid() {\n        return this.host.parentElement;\n    }\n    get hostRange() {\n        return this.host.shadowRoot?.querySelector('cds-internal-split-handle input');\n    }\n    async hostConnected() {\n        this.setActionWidth();\n        this.hostGrid.shadowRoot?.addEventListener('slotchange', () => this.setActionWidth());\n        this.observers.push(listenForAttributeListChange(this.host, ['type'], () => this.setActionWidth()));\n        await this.host.updateComplete;\n        await onFirstInteraction(this.hostGrid);\n        if (this.hostRange) {\n            this.hostRange.max = `${parseInt(getComputedStyle(this.hostGrid).width)}`;\n            this.hostRange.value = `${parseInt(getComputedStyle(this.host).width)}`;\n            this.hostRange.addEventListener('input', (e) => this.updateResizedColumnWidth(e.target.valueAsNumber));\n            this.hostRange.addEventListener('change', (e) => this.updateResizedColumnWidth(e.target.valueAsNumber));\n        }\n    }\n    async hostUpdated() {\n        await this.host.updateComplete;\n        this.updateSetColumnWidth();\n    }\n    hostDisconnected() {\n        this.observers.forEach(o => o?.disconnect());\n    }\n    setActionWidth() {\n        if (this.host.type === 'action' || this.host.getAttribute('type') === 'action') {\n            this.host.width = '36px';\n            const index = Array.from(this.hostGrid.columns).indexOf(this.host);\n            this.hostGrid.rows.forEach(r => r.cells[index].setAttribute('type', 'action'));\n        }\n    }\n    updateSetColumnWidth() {\n        if (this.host.width && this.host.ariaColIndex !== undefined) {\n            this.hostGrid.style.setProperty(`--ch${this.host.ariaColIndex}`, isNumericString(this.host.width) ? `${this.host.width}px` : this.host.width);\n            if (this.hostRange) {\n                this.hostRange.min = `${parseInt(this.host.width)}` ?? '';\n                this.hostRange.value = this.host.width;\n            }\n        }\n    }\n    updateResizedColumnWidth(width) {\n        this.host.dispatchEvent(new CustomEvent('resizeChange', { detail: width, bubbles: true }));\n        const updatedWidth = Math.max(isNumericString(this.host.width) || this.host.width?.includes('px') ? parseInt(this.host.width) : 36, width);\n        this.hostGrid.style.setProperty(`--ch${this.host.ariaColIndex}`, `${updatedWidth}px`);\n    }\n}\n"],"names":["GridColumnSizeController","constructor","host","this","observers","addController","hostGrid","parentElement","hostRange","shadowRoot","querySelector","async","setActionWidth","addEventListener","push","listenForAttributeListChange","updateComplete","onFirstInteraction","max","parseInt","getComputedStyle","width","value","e","updateResizedColumnWidth","target","valueAsNumber","updateSetColumnWidth","hostDisconnected","forEach","o","disconnect","type","getAttribute","index","Array","from","columns","indexOf","rows","r","cells","setAttribute","undefined","ariaColIndex","style","setProperty","isNumericString","min","dispatchEvent","CustomEvent","detail","bubbles","updatedWidth","Math","includes"],"mappings":"+GAMO,MAAMA,EACTC,YAAYC,GACRC,KAAKD,KAAOA,EACZC,KAAKC,UAAY,GACjBD,KAAKD,KAAKG,cAAcF,MAExBG,eACA,OAAOH,KAAKD,KAAKK,cAEjBC,gBACA,OAAOL,KAAKD,KAAKO,YAAYC,cAAc,mCAE/CC,sBACIR,KAAKS,iBACLT,KAAKG,SAASG,YAAYI,iBAAiB,cAAc,IAAMV,KAAKS,mBACpET,KAAKC,UAAUU,KAAKC,EAA6BZ,KAAKD,KAAM,CAAC,SAAS,IAAMC,KAAKS,0BAC3ET,KAAKD,KAAKc,qBACVC,EAAmBd,KAAKG,UAC1BH,KAAKK,YACLL,KAAKK,UAAUU,IAAM,GAAGC,SAASC,iBAAiBjB,KAAKG,UAAUe,OACjElB,KAAKK,UAAUc,MAAQ,GAAGH,SAASC,iBAAiBjB,KAAKD,MAAMmB,OAC/DlB,KAAKK,UAAUK,iBAAiB,SAAUU,GAAMpB,KAAKqB,yBAAyBD,EAAEE,OAAOC,iBACvFvB,KAAKK,UAAUK,iBAAiB,UAAWU,GAAMpB,KAAKqB,yBAAyBD,EAAEE,OAAOC,kBAGhGf,0BACUR,KAAKD,KAAKc,eAChBb,KAAKwB,uBAETC,mBACIzB,KAAKC,UAAUyB,SAAQC,GAAKA,GAAGC,eAEnCnB,iBACI,GAAuB,WAAnBT,KAAKD,KAAK8B,MAAwD,WAAnC7B,KAAKD,KAAK+B,aAAa,QAAsB,CAC5E9B,KAAKD,KAAKmB,MAAQ,OAClB,MAAMa,EAAQC,MAAMC,KAAKjC,KAAKG,SAAS+B,SAASC,QAAQnC,KAAKD,MAC7DC,KAAKG,SAASiC,KAAKV,SAAQW,GAAKA,EAAEC,MAAMP,GAAOQ,aAAa,OAAQ,aAG5Ef,uBACQxB,KAAKD,KAAKmB,YAAoCsB,IAA3BxC,KAAKD,KAAK0C,eAC7BzC,KAAKG,SAASuC,MAAMC,YAAY,OAAO3C,KAAKD,KAAK0C,aAAgBG,EAAgB5C,KAAKD,KAAKmB,OAAYlB,KAAKD,KAAKmB,MAAb,KAAyBlB,KAAKD,KAAKmB,OACnIlB,KAAKK,YACLL,KAAKK,UAAUwC,IAAM,GAAG7B,SAAShB,KAAKD,KAAKmB,QAAY,GACvDlB,KAAKK,UAAUc,MAAQnB,KAAKD,KAAKmB,QAI7CG,yBAAyBH,GACrBlB,KAAKD,KAAK+C,cAAc,IAAIC,YAAY,eAAgB,CAAEC,OAAQ9B,EAAO+B,SAAS,KAClF,MAAMC,EAAeC,KAAKpC,IAAI6B,EAAgB5C,KAAKD,KAAKmB,QAAUlB,KAAKD,KAAKmB,OAAOkC,SAAS,MAAQpC,SAAShB,KAAKD,KAAKmB,OAAS,GAAIA,GACpIlB,KAAKG,SAASuC,MAAMC,YAAY,OAAO3C,KAAKD,KAAK0C,aAAmBS,EAAH"}

package/grid/column/grid-column.element.d.ts

@@ -0,0 +1,53 @@
+import { LitElement } from 'lit';
+import { EventEmitter } from '@cds/core/internal';
+import { GridColumnSizeController } from './grid-column-size.controller.js';
+import { GridColumnPositionController } from './grid-column-position.controller.js';
+/**
+ * Grid Column
+ *
+ * ```typescript
+ * import '@cds/core/grid/register.js';
+ * ```
+ *
+ * @internal
+ * @element cds-grid-column
+ * @event resizeChange - notifies when column has been resized
+ * @cssprop --min-height
+ * @cssprop --min-width
+ * @cssprop --justify-content
+ * @cssprop --padding-block
+ * @cssprop --padding-inline-start
+ * @cssprop --padding-inline-end
+ */
+export declare class CdsGridColumn extends LitElement {
+    i18n: {
+        resizeColumn: string;
+        closeDetails: string;
+        noData: string;
+        rowDetailStart: string;
+        rowDetailEnd: string;
+        footerEnd: string;
+        action: string;
+        dropTarget: string;
+        pagination: {
+            label: string;
+            firstPage: string;
+            previousPage: string;
+            nextPage: string;
+            lastPage: string;
+            pageSize: string;
+            page: string;
+        };
+    };
+    width: string;
+    resizable: boolean;
+    type: '' | 'action';
+    position: '' | 'sticky' | 'fixed';
+    resizeChange: EventEmitter<number>;
+    protected gridColumnSizeController: GridColumnSizeController;
+    protected gridColumnPositionController: GridColumnPositionController;
+    private get grid();
+    static styles: import("lit").CSSResultGroup[];
+    render(): import("lit-html").TemplateResult<1>;
+    connectedCallback(): void;
+}

package/grid/column/grid-column.element.js

@@ -0,0 +1,2 @@
+import{__decorate as t}from"tslib";import{LitElement as e,html as i}from"lit";import{I18nService as o,baseStyles as r,i18n as s,property as n,event as l}from"@cds/core/internal";import{GridColumnSizeController as p}from"./grid-column-size.controller.js";import{GridColumnPositionController as a}from"./grid-column-position.controller.js";import d from"./grid-column.element.scss.js";class c extends e{constructor(){super(...arguments);this.i18n=o.keys.grid,this.resizable=!1,this.type="",this.position="",this.gridColumnSizeController=new p(this),this.gridColumnPositionController=new a(this)}get grid(){return this.parentElement}render(){return i`<div class="private-host" focusable><slot>${"action"===this.type?i`<span cds-layout="display:screen-reader-only">${this.i18n.action}</span>`:""}</slot>${this.resizable?i`<cds-internal-split-handle @cdsTouchStart="${()=>this.grid.scrollLock=!0}" @cdsTouchEnd="${()=>this.grid.scrollLock=!1}"><input type="range" step="10" .ariaLabel="${this.i18n.resizeColumn}" @change="${t=>this.resizeChange.emit(t.target.valueAsNumber)}"></cds-internal-split-handle>`:i`<cds-internal-split-handle readonly="readonly"></cds-internal-split-handle>`}<div class="line"></div></div>`}connectedCallback(){super.connectedCallback(),this.slot="columns"}}c.styles=[r,d],t([s()],c.prototype,"i18n",void 0),t([n({type:String})],c.prototype,"width",void 0),t([n({type:Boolean})],c.prototype,"resizable",void 0),t([n({type:String})],c.prototype,"type",void 0),t([n({type:String})],c.prototype,"position",void 0),t([l()],c.prototype,"resizeChange",void 0);export{c as CdsGridColumn};
+//# sourceMappingURL=grid-column.element.js.map

package/grid/column/grid-column.element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-column.element.js","sources":["../../../../src/grid/column/grid-column.element.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nimport { __decorate } from \"tslib\";\nimport { LitElement, html } from 'lit';\nimport { baseStyles, i18n, I18nService, property, event } from '@cds/core/internal';\nimport { GridColumnSizeController } from './grid-column-size.controller.js';\nimport { GridColumnPositionController } from './grid-column-position.controller.js';\nimport styles from './grid-column.element.scss';\n/**\n * Grid Column\n *\n * ```typescript\n * import '@cds/core/grid/register.js';\n * ```\n *\n * @internal\n * @element cds-grid-column\n * @event resizeChange - notifies when column has been resized\n * @cssprop --min-height\n * @cssprop --min-width\n * @cssprop --justify-content\n * @cssprop --padding-block\n * @cssprop --padding-inline-start\n * @cssprop --padding-inline-end\n */\nexport class CdsGridColumn extends LitElement {\n    constructor() {\n        super(...arguments);\n        this.i18n = I18nService.keys.grid;\n        this.resizable = false;\n        this.type = '';\n        this.position = '';\n        this.gridColumnSizeController = new GridColumnSizeController(this);\n        this.gridColumnPositionController = new GridColumnPositionController(this);\n    }\n    get grid() {\n        return this.parentElement;\n    }\n    render() {\n        return html `\n      <div class=\"private-host\" focusable>\n        <slot>\n          ${this.type === 'action'\n            ? html `<span cds-layout=\"display:screen-reader-only\">${this.i18n.action}</span>`\n            : ''}\n        </slot>\n        ${this.resizable\n            ? html `<cds-internal-split-handle\n              @cdsTouchStart=${() => (this.grid.scrollLock = true)}\n              @cdsTouchEnd=${() => (this.grid.scrollLock = false)}\n            >\n              <input\n                type=\"range\"\n                step=\"10\"\n                .ariaLabel=${this.i18n.resizeColumn}\n                @change=${(e) => this.resizeChange.emit(e.target.valueAsNumber)}\n              />\n            </cds-internal-split-handle>`\n            : html `<cds-internal-split-handle readonly></cds-internal-split-handle>`}\n        <div class=\"line\"></div>\n      </div>\n    `;\n    }\n    connectedCallback() {\n        super.connectedCallback();\n        this.slot = 'columns';\n    }\n}\nCdsGridColumn.styles = [baseStyles, styles];\n__decorate([\n    i18n()\n], CdsGridColumn.prototype, \"i18n\", void 0);\n__decorate([\n    property({ type: String })\n], CdsGridColumn.prototype, \"width\", void 0);\n__decorate([\n    property({ type: Boolean })\n], CdsGridColumn.prototype, \"resizable\", void 0);\n__decorate([\n    property({ type: String })\n], CdsGridColumn.prototype, \"type\", void 0);\n__decorate([\n    property({ type: String })\n], CdsGridColumn.prototype, \"position\", void 0);\n__decorate([\n    event()\n], CdsGridColumn.prototype, \"resizeChange\", void 0);\n"],"names":["CdsGridColumn","LitElement","constructor","super","this","i18n","I18nService","keys","grid","resizable","type","position","gridColumnSizeController","GridColumnSizeController","gridColumnPositionController","GridColumnPositionController","parentElement","render","html","action","scrollLock","resizeColumn","e","resizeChange","emit","target","valueAsNumber","connectedCallback","slot","styles","baseStyles","__decorate","prototype","property","String","Boolean","event"],"mappings":"+XA4BO,MAAMA,UAAsBC,EAC/BC,cACIC,oBACAC,KAAKC,KAAOC,EAAYC,KAAKC,KAC7BJ,KAAKK,WAAY,EACjBL,KAAKM,KAAO,GACZN,KAAKO,SAAW,GAChBP,KAAKQ,yBAA2B,IAAIC,EAAyBT,MAC7DA,KAAKU,6BAA+B,IAAIC,EAA6BX,MAErEI,WACA,OAAOJ,KAAKY,cAEhBC,SACI,OAAOC,CAAK,6CAGM,WAAdd,KAAKM,KACHQ,CAAK,iDAAiDd,KAAKC,KAAKc,gBAChE,YAEJf,KAAKK,UACDS,CAAK,8CACY,IAAOd,KAAKI,KAAKY,YAAa,oBAChC,IAAOhB,KAAKI,KAAKY,YAAa,gDAK9BhB,KAAKC,KAAKgB,0BACZC,GAAMlB,KAAKmB,aAAaC,KAAKF,EAAEG,OAAOC,+CAGnDR,CAAK,8GAKfS,oBACIxB,MAAMwB,oBACNvB,KAAKwB,KAAO,WAGpB5B,EAAc6B,OAAS,CAACC,EAAYD,GACpCE,EAAW,CACP1B,KACDL,EAAcgC,UAAW,YAAQ,GACpCD,EAAW,CACPE,EAAS,CAAEvB,KAAMwB,UAClBlC,EAAcgC,UAAW,aAAS,GACrCD,EAAW,CACPE,EAAS,CAAEvB,KAAMyB,WAClBnC,EAAcgC,UAAW,iBAAa,GACzCD,EAAW,CACPE,EAAS,CAAEvB,KAAMwB,UAClBlC,EAAcgC,UAAW,YAAQ,GACpCD,EAAW,CACPE,EAAS,CAAEvB,KAAMwB,UAClBlC,EAAcgC,UAAW,gBAAY,GACxCD,EAAW,CACPK,KACDpC,EAAcgC,UAAW,oBAAgB"}

package/grid/column/grid-column.element.scss.js

@@ -0,0 +1,2 @@
+import{css as t}from"lit";var a=t`:host{--min-height:var(--column-height, var(--cds-alias-object-interaction-touch-target, 2.25rem));--min-width:fit-content;--justify-content:var(--column-justify-content, start);--padding-block:var(--cds-global-space-3, 0.25rem);--padding-inline-start:var(--cds-global-space-6, 0.75rem);--padding-inline-end:var(--cds-global-space-8, 1.125rem);--background:var(--cds-alias-object-container-background-tint, var(--cds-global-color-construction-50, #f1f6f8));top:0;z-index:998;position:sticky;min-height:var(--min-height);min-width:var(--min-width);outline:0!important}.private-host{min-height:var(--min-height);justify-content:var(--justify-content);background:var(--background);padding-inline-start:var(--padding-inline-start);padding-inline-end:var(--padding-inline-end);padding-block:var(--padding-block);text-align:left;border:0;font-weight:500;color:var(--cds-global-typography-color-500,var(--cds-global-color-black,#000));white-space:nowrap;overflow:visible;text-overflow:ellipsis;font-size:var(--cds-global-typography-font-size-3,.8125rem);line-height:1em;margin:0;display:flex;gap:var(--cds-global-layout-space-sm,.75rem);align-items:center;height:100%;position:sticky!important;box-shadow:0 var(--cds-alias-object-border-width-100,.0625rem) 0 var(--cds-alias-object-border-color,var(--cds-global-color-construction-200,#cbd4d8))}:host([type=action]){--padding-block:0;--padding-inline-start:0;--padding-inline-end:0}:host([type=action]) .private-host{justify-content:center}::slotted([cds-button-action]),[cds-button-action]{--outline-offset:calc(var(--cds-global-space-3, 0.25rem) * -1)}:host([position=fixed]),:host([position=sticky]){z-index:999}::slotted([cds-button-action]),::slotted([cds-layout="align:right"]){margin-inline-start:auto}cds-internal-split-handle{--height:var(--cds-global-layout-space-lg, 1.5rem);--min-height:var(--cds-global-layout-space-lg, 1.5rem);--secondary-line-display:none;position:absolute;right:var(--cds-global-space-1,.0625rem)}:host([draggable-hidden]) cds-internal-split-handle{display:none}.line{top:var(--min-height);width:var(--cds-global-space-1,.0625rem);bottom:0;right:0;height:100vh;position:absolute}[_focused]+.line{right:0;border-right:var(--cds-global-space-2,.125rem) solid var(--cds-alias-object-interaction-background-highlight,var(--cds-global-color-blue-700,#0079ad))}:host([cds-draggable*=target]) .line{left:var(--cds-global-space-0,0);border-left:var(--cds-global-space-2,.125rem) solid var(--cds-alias-object-interaction-background-highlight,var(--cds-global-color-blue-700,#0079ad))}:host([cds-draggable*=active]) .private-host{box-shadow:0 var(--cds-alias-object-border-width-200,.125rem) 0 var(--cds-alias-object-interaction-background-highlight,var(--cds-global-color-blue-700,#0079ad))}[focusable]{outline-offset:calc(var(--cds-global-space-2,.125rem)*-1)!important}:host([type=action]:focus-within) [focusable]{outline:var(--cds-alias-object-interaction-outline,Highlight solid 2px)!important;outline-offset:calc(var(--cds-global-space-2,.125rem)*-1)!important}@media (-webkit-min-device-pixel-ratio:0){:host([type=action]:focus-within) [focusable]{outline:var(--cds-alias-object-interaction-outline-webkit,5px auto -webkit-focus-ring-color)!important}}:host([type=action]:focus-within) ::slotted([cds-button-action]),:host([type=action]:focus-within) ::slotted([cds-control]){--cds-alias-object-interaction-outline-webkit:none!important;--cds-alias-object-interaction-outline:none!important}`;export{a as default};
+//# sourceMappingURL=grid-column.element.scss.js.map

package/grid/column/grid-column.element.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-column.element.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/grid/detail/grid-detail.element.d.ts

@@ -0,0 +1,59 @@
+import { LitElement, PropertyValues } from 'lit';
+import { ClosableController, ResponsiveController } from '@cds/core/internal';
+/**
+ * Grid Detail
+ *
+ * ```typescript
+ * import '@cds/core/grid/register.js';
+ * ```
+ *
+ * @internal
+ * @element cds-grid-detail
+ * @event closeChange
+ * @csspart close
+ * @cssprop --width
+ * @cssprop --inset-inline-start
+ * @cssprop --inset-inline-end
+ * @cssprop --backdrop-background
+ */
+export declare class CdsGridDetail extends LitElement {
+    anchor: HTMLElement | string;
+    position: string;
+    i18n: {
+        resizeColumn: string;
+        closeDetails: string;
+        noData: string;
+        rowDetailStart: string;
+        rowDetailEnd: string;
+        footerEnd: string;
+        action: string;
+        dropTarget: string;
+        pagination: {
+            label: string;
+            firstPage: string;
+            previousPage: string;
+            nextPage: string;
+            lastPage: string;
+            pageSize: string;
+            page: string;
+        };
+    };
+    protected overlay: '' | 'full';
+    protected closableController: ClosableController<this>;
+    protected responsiveController: ResponsiveController<this>;
+    private observer;
+    private get grid();
+    get trigger(): HTMLElement;
+    static styles: import("lit").CSSResultGroup[];
+    private get closeButton();
+    private get triggerRow();
+    render(): import("lit-html").TemplateResult<1>;
+    connectedCallback(): void;
+    updated(props: PropertyValues): Promise<void>;
+    disconnectedCallback(): void;
+    private toggleAnchorHover;
+    private setAnchorPointer;
+    private setDetailWidthAlignment;
+    private alignToBottom;
+    private alignToSide;
+}

package/grid/detail/grid-detail.element.js

@@ -0,0 +1,2 @@
+import{__decorate as t}from"tslib";import{LitElement as e,html as i}from"lit";import{I18nService as o,ResponsiveController as r,renderAfter as s,listenForAttributeChange as n,propUpdated as l,baseStyles as h,property as a,i18n as d,state as c,layer as g,closable as p,ariaModal as u,ariaPopup as y,focusTrap as m,firstFocus as v,triggerable as w}from"@cds/core/internal";import b from"./grid-detail.element.scss.js";let C=class extends e{constructor(){super(...arguments);this.position="right",this.i18n=o.keys.grid,this.overlay="",this.responsiveController=new r(this,{element:this.parentElement})}get grid(){return this.parentElement}get trigger(){return"string"==typeof this.anchor?this.getRootNode().querySelector("#"+this.anchor):this.anchor}get closeButton(){return i`<cds-button-action @click="${()=>this.closableController.close()}" shape="times" aria-label="${this.i18n.closeDetails}" part="close"></cds-button-action>`}get triggerRow(){return this.trigger?.closest("cds-grid-row")}render(){return i`<div class="private-host" role="presentation"><div cds-layout="display:screen-reader-only">${this.i18n.rowDetailStart}</div><slot></slot><div cds-layout="display:screen-reader-only">${this.i18n.rowDetailEnd}</div></div><div class="caret" role="presentation"></div>`}connectedCallback(){super.connectedCallback(),this.slot="detail",s(this.closeButton,this),this.addEventListener("cdsResizeChange",(t=>this.overlay=t.detail.width>500?"":"full")),this.observer=n(this,"hidden",(async t=>{this.grid.scrollLock=!t,await this.updateComplete,this.setDetailWidthAlignment(),this.toggleAnchorHover()}))}async updated(t){super.updated(t),await this.updateComplete,l(this,t,"anchor")&&this.setAnchorPointer(t.get("anchor"))}disconnectedCallback(){super.disconnectedCallback(),this.observer?.disconnect(),this.triggerRow?.removeAttribute("_detail-row")}toggleAnchorHover(){this.hidden?this.triggerRow?.removeAttribute("_detail-row"):this.triggerRow?.setAttribute("_detail-row","")}setAnchorPointer(t){t?.closest&&t?.closest("cds-grid-row")?.removeAttribute("_detail-row"),this.toggleAnchorHover();const e=this.trigger?.getBoundingClientRect()?.top-this?.getBoundingClientRect().top-8;this.style.setProperty("--caret-top",e+"px")}setDetailWidthAlignment(){"bottom"===this.position&&this.alignToBottom();const t=Array.from(this.triggerRow?.cells??[]).find((t=>"rowheader"===t.role));t&&this.alignToSide(t)}alignToBottom(){const t=this.parentElement?.getBoundingClientRect(),e=this.triggerRow?.getBoundingClientRect();this.style.setProperty("--width","100%"),"bottom"===this.position&&e&&(this.style.top=e?.bottom-t.top-1+"px")}alignToSide(t){const e=this.parentElement?.getBoundingClientRect(),i=t.getBoundingClientRect();this.style.setProperty("--width","auto"),"left"===this.position||"rtl"===this.parentElement?.getAttribute("dir")?this.style.right=e.right-i.left+"px":this.style.left=i.right-e.left+"px"}};C.styles=[h,b],t([a({type:String})],C.prototype,"anchor",void 0),t([a({type:String})],C.prototype,"position",void 0),t([d()],C.prototype,"i18n",void 0),t([c({type:String,reflect:!0})],C.prototype,"overlay",void 0),C=t([g(),p(),u(),y(),m(),v(),w()],C);export{C as CdsGridDetail};
+//# sourceMappingURL=grid-detail.element.js.map

package/grid/detail/grid-detail.element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-detail.element.js","sources":["../../../../src/grid/detail/grid-detail.element.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nimport { __decorate } from \"tslib\";\nimport { html, LitElement } from 'lit';\nimport { baseStyles, i18n, I18nService, property, ResponsiveController, state, listenForAttributeChange, propUpdated, renderAfter, ariaModal, firstFocus, focusTrap, ariaPopup, layer, closable, triggerable, } from '@cds/core/internal';\nimport styles from './grid-detail.element.scss';\n/**\n * Grid Detail\n *\n * ```typescript\n * import '@cds/core/grid/register.js';\n * ```\n *\n * @internal\n * @element cds-grid-detail\n * @event closeChange\n * @csspart close\n * @cssprop --width\n * @cssprop --inset-inline-start\n * @cssprop --inset-inline-end\n * @cssprop --backdrop-background\n */\nlet CdsGridDetail = class CdsGridDetail extends LitElement {\n    constructor() {\n        super(...arguments);\n        this.position = 'right';\n        this.i18n = I18nService.keys.grid;\n        this.overlay = '';\n        this.responsiveController = new ResponsiveController(this, { element: this.parentElement });\n    }\n    get grid() {\n        return this.parentElement;\n    }\n    get trigger() {\n        return typeof this.anchor === 'string'\n            ? this.getRootNode().querySelector(`#${this.anchor}`)\n            : this.anchor;\n    }\n    get closeButton() {\n        // safari https://bugs.webkit.org/show_bug.cgi?id=174667\n        return html ` <cds-button-action\n      @click=${() => this.closableController.close()}\n      shape=\"times\"\n      aria-label=${this.i18n.closeDetails}\n      part=\"close\"\n    ></cds-button-action>`;\n    }\n    get triggerRow() {\n        return this.trigger?.closest('cds-grid-row');\n    }\n    render() {\n        return html `<div class=\"private-host\" role=\"presentation\">\n        <div cds-layout=\"display:screen-reader-only\">${this.i18n.rowDetailStart}</div>\n        <slot></slot>\n\n        <div cds-layout=\"display:screen-reader-only\">${this.i18n.rowDetailEnd}</div>\n      </div>\n      <div class=\"caret\" role=\"presentation\"></div>`;\n    }\n    connectedCallback() {\n        super.connectedCallback();\n        this.slot = 'detail';\n        renderAfter(this.closeButton, this);\n        this.addEventListener('cdsResizeChange', (e) => (this.overlay = e.detail.width > 500 ? '' : 'full'));\n        this.observer = listenForAttributeChange(this, 'hidden', async (hidden) => {\n            this.grid.scrollLock = !hidden;\n            await this.updateComplete;\n            this.setDetailWidthAlignment();\n            this.toggleAnchorHover();\n        });\n    }\n    async updated(props) {\n        super.updated(props);\n        await this.updateComplete;\n        if (propUpdated(this, props, 'anchor')) {\n            this.setAnchorPointer(props.get('anchor'));\n        }\n    }\n    disconnectedCallback() {\n        super.disconnectedCallback();\n        this.observer?.disconnect();\n        this.triggerRow?.removeAttribute('_detail-row');\n    }\n    toggleAnchorHover() {\n        if (this.hidden) {\n            this.triggerRow?.removeAttribute('_detail-row');\n        }\n        else {\n            this.triggerRow?.setAttribute('_detail-row', '');\n        }\n    }\n    setAnchorPointer(previousAnchor) {\n        if (previousAnchor?.closest) {\n            previousAnchor?.closest('cds-grid-row')?.removeAttribute('_detail-row');\n        }\n        this.toggleAnchorHover();\n        const top = this.trigger?.getBoundingClientRect()?.top - this?.getBoundingClientRect().top - 8;\n        this.style.setProperty('--caret-top', `${top}px`);\n    }\n    setDetailWidthAlignment() {\n        if (this.position === 'bottom') {\n            this.alignToBottom();\n        }\n        const rowheader = Array.from(this.triggerRow?.cells ?? []).find(c => c.role === 'rowheader');\n        if (rowheader) {\n            this.alignToSide(rowheader);\n        }\n    }\n    alignToBottom() {\n        const gridRect = this.parentElement?.getBoundingClientRect();\n        const rowRect = this.triggerRow?.getBoundingClientRect();\n        this.style.setProperty('--width', '100%');\n        if (this.position === 'bottom' && rowRect) {\n            this.style.top = `${rowRect?.bottom - gridRect.top - 1}px`;\n        }\n    }\n    alignToSide(rowheader) {\n        const gridRect = this.parentElement?.getBoundingClientRect();\n        const cellRect = rowheader.getBoundingClientRect();\n        this.style.setProperty('--width', 'auto');\n        if (this.position === 'left' || this.parentElement?.getAttribute('dir') === 'rtl') {\n            this.style.right = `${gridRect.right - cellRect.left}px`;\n        }\n        else {\n            this.style.left = `${cellRect.right - gridRect.left}px`;\n        }\n    }\n};\nCdsGridDetail.styles = [baseStyles, styles];\n__decorate([\n    property({ type: String })\n], CdsGridDetail.prototype, \"anchor\", void 0);\n__decorate([\n    property({ type: String })\n], CdsGridDetail.prototype, \"position\", void 0);\n__decorate([\n    i18n()\n], CdsGridDetail.prototype, \"i18n\", void 0);\n__decorate([\n    state({ type: String, reflect: true })\n], CdsGridDetail.prototype, \"overlay\", void 0);\nCdsGridDetail = __decorate([\n    layer(),\n    closable(),\n    ariaModal(),\n    ariaPopup(),\n    focusTrap(),\n    firstFocus(),\n    triggerable()\n], CdsGridDetail);\nexport { CdsGridDetail };\n"],"names":["CdsGridDetail","LitElement","constructor","super","this","position","i18n","I18nService","keys","grid","overlay","responsiveController","ResponsiveController","element","parentElement","trigger","anchor","getRootNode","querySelector","closeButton","html","closableController","close","closeDetails","triggerRow","closest","render","rowDetailStart","rowDetailEnd","connectedCallback","slot","renderAfter","addEventListener","e","detail","width","observer","listenForAttributeChange","async","hidden","scrollLock","updateComplete","setDetailWidthAlignment","toggleAnchorHover","props","updated","propUpdated","setAnchorPointer","get","disconnectedCallback","disconnect","removeAttribute","setAttribute","previousAnchor","top","getBoundingClientRect","style","setProperty","alignToBottom","rowheader","Array","from","cells","find","c","role","alignToSide","gridRect","rowRect","bottom","cellRect","getAttribute","right","left","styles","baseStyles","__decorate","property","type","String","prototype","state","reflect","layer","closable","ariaModal","ariaPopup","focusTrap","firstFocus","triggerable"],"mappings":"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"}

package/grid/detail/grid-detail.element.scss.js

@@ -0,0 +1,2 @@
+import{css as o}from"lit";var a=o`:host{--width:75%;--inset-inline-start:auto;--inset-inline-end:0;--backdrop-background:none;width:var(--width);display:block;z-index:99;position:absolute;inset:0;inset-inline-start:var(--inset-inline-start);inset-inline-end:var(--inset-inline-end)}.private-host{background:var(--cds-alias-object-container-background,var(--cds-global-color-white,#fff));z-index:998;border:0;color:var(--cds-global-typography-color-500,var(--cds-global-color-black,#000));border-inline-start:var(--cds-alias-object-border-width-100,.0625rem) solid var(--cds-alias-object-border-color,var(--cds-global-color-construction-200,#cbd4d8));margin:0;display:block;width:100%;height:100%;padding:var(--cds-global-space-9,1.5rem);overflow-y:auto}:host([_overlay=full]){inset:0!important}:host([position=bottom]){--width:100%!important}:host([position=bottom]) .private-host{border-inline-start:0;border-block-start:var(--cds-alias-object-border-width-100,.0625rem) solid var(--cds-alias-object-border-color,var(--cds-global-color-construction-200,#cbd4d8))}:host([position=bottom]) .caret{display:none}::slotted([part=close]){position:absolute;top:var(--cds-global-space-7,1rem);inset-inline-end:var(--cds-global-space-7,1rem)}.caret{background:var(--cds-alias-object-container-background,var(--cds-global-color-white,#fff));width:var(--cds-global-space-4,.375rem);height:calc(var(--row-height) - var(--cds-global-space-2,.125rem));position:absolute;inset-inline-start:calc(var(--cds-global-space-3,.25rem)*-1);top:var(--caret-top);z-index:999}`;export{a as default};
+//# sourceMappingURL=grid-detail.element.scss.js.map

package/grid/detail/grid-detail.element.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-detail.element.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/grid/footer/grid-footer.element.d.ts

@@ -0,0 +1,36 @@
+import { LitElement } from 'lit';
+/**
+ * Grid Footer
+ *
+ * ```typescript
+ * import '@cds/core/grid/register.js';
+ * ```
+ *
+ * @internal
+ * @element cds-grid-footer
+ * @cssprop --min-height
+ */
+export declare class CdsGridFooter extends LitElement {
+    i18n: {
+        resizeColumn: string;
+        closeDetails: string;
+        noData: string;
+        rowDetailStart: string;
+        rowDetailEnd: string;
+        footerEnd: string;
+        action: string;
+        dropTarget: string;
+        pagination: {
+            label: string;
+            firstPage: string;
+            previousPage: string;
+            nextPage: string;
+            lastPage: string;
+            pageSize: string;
+            page: string;
+        };
+    };
+    static styles: import("lit").CSSResultGroup[];
+    render(): import("lit-html").TemplateResult<1>;
+    connectedCallback(): void;
+}

package/grid/footer/grid-footer.element.js

@@ -0,0 +1,2 @@
+import{__decorate as t}from"tslib";import{LitElement as o,html as r}from"lit";import{I18nService as e,baseStyles as s,i18n as i}from"@cds/core/internal";import l from"./grid-footer.element.scss.js";class n extends o{constructor(){super(...arguments);this.i18n=e.keys.grid}render(){return r`<div class="private-host"><slot><div cds-layout="display:screen-reader-only">${this.i18n.footerEnd}</div></slot></div>`}connectedCallback(){super.connectedCallback(),this.slot="footer"}}n.styles=[s,l],t([i()],n.prototype,"i18n",void 0);export{n as CdsGridFooter};
+//# sourceMappingURL=grid-footer.element.js.map

package/grid/footer/grid-footer.element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-footer.element.js","sources":["../../../../src/grid/footer/grid-footer.element.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nimport { __decorate } from \"tslib\";\nimport { LitElement, html } from 'lit';\nimport { baseStyles, i18n, I18nService } from '@cds/core/internal';\nimport styles from './grid-footer.element.scss';\n/**\n * Grid Footer\n *\n * ```typescript\n * import '@cds/core/grid/register.js';\n * ```\n *\n * @internal\n * @element cds-grid-footer\n * @cssprop --min-height\n */\nexport class CdsGridFooter extends LitElement {\n    constructor() {\n        super(...arguments);\n        this.i18n = I18nService.keys.grid;\n    }\n    render() {\n        return html `\n      <div class=\"private-host\">\n        <slot>\n          <div cds-layout=\"display:screen-reader-only\">${this.i18n.footerEnd}</div>\n        </slot>\n      </div>\n    `;\n    }\n    connectedCallback() {\n        super.connectedCallback();\n        this.slot = 'footer';\n    }\n}\nCdsGridFooter.styles = [baseStyles, styles];\n__decorate([\n    i18n()\n], CdsGridFooter.prototype, \"i18n\", void 0);\n"],"names":["CdsGridFooter","LitElement","constructor","super","this","i18n","I18nService","keys","grid","render","html","footerEnd","connectedCallback","slot","styles","baseStyles","__decorate","prototype"],"mappings":"sMAoBO,MAAMA,UAAsBC,EAC/BC,cACIC,oBACAC,KAAKC,KAAOC,EAAYC,KAAKC,KAEjCC,SACI,OAAOC,CAAK,gFAGqCN,KAAKC,KAAKM,+BAK/DC,oBACIT,MAAMS,oBACNR,KAAKS,KAAO,UAGpBb,EAAcc,OAAS,CAACC,EAAYD,GACpCE,EAAW,CACPX,KACDL,EAAciB,UAAW,YAAQ"}

package/grid/footer/grid-footer.element.scss.js

@@ -0,0 +1,2 @@
+import{css as o}from"lit";var a=o`:host{--min-height:var(--column-height, var(--cds-alias-object-interaction-touch-target, 2.25rem))}.private-host{min-height:var(--min-height);display:flex;align-items:center;padding:0 var(--cds-global-space-5,.5rem);border-top:var(--cds-alias-object-border-width-100,.0625rem) solid var(--cds-alias-object-border-color,var(--cds-global-color-construction-200,#cbd4d8));color:var(--cds-global-typography-color-500,var(--cds-global-color-black,#000));background:var(--cds-alias-object-container-background-tint,var(--cds-global-color-construction-50,#f1f6f8));font-size:var(--cds-global-typography-font-size-3,.8125rem);width:100%}::slotted(cds-grid-pagination),::slotted(cds-pagination){margin-left:auto}`;export{a as default};
+//# sourceMappingURL=grid-footer.element.scss.js.map

package/grid/footer/grid-footer.element.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-footer.element.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/grid/grid/grid-layout.controller.d.ts

@@ -0,0 +1,31 @@
+import { ReactiveControllerHost } from 'lit';
+export declare type Column = HTMLElement & {
+    width: string;
+    ariaColIndex: string;
+    type: string;
+};
+declare type Grid = HTMLElement & {
+    columns: NodeListOf<Column>;
+    columnLayout: 'fixed' | 'flex';
+    height?: string;
+};
+export declare class GridLayoutController {
+    private host;
+    private observers;
+    private _columns;
+    private get columns();
+    private get visibleColumns();
+    private get lastVisibleColumn();
+    constructor(host: ReactiveControllerHost & Grid);
+    hostConnected(): Promise<void>;
+    hostUpdated(): void;
+    hostDisconnected(): void;
+    private columnAddedOrRemoved;
+    private initializeColumnWidths;
+    private getLastColumnWidth;
+    private updateLayout;
+    private createColumnGrids;
+    private setColumnDividers;
+    private validateColumnLayout;
+}
+export {};

package/grid/grid/grid-layout.controller.js

@@ -0,0 +1,2 @@
+import{onChildListMutation as t,listenForAttributeListChange as s,isNumericString as i,notProductionEnvironment as e,LogService as h}from"@cds/core/internal";class o{constructor(t){this.host=t,this.observers=[],this.host.addController(this)}get columns(){return Array.from(this._columns??[])}get visibleColumns(){return this.columns.filter((t=>!t.hidden))}get lastVisibleColumn(){return this.visibleColumns["rtl"===this.host.getAttribute("dir")?0:this.visibleColumns.length-1]}async hostConnected(){await this.host.updateComplete,this.updateLayout(),this.host.addEventListener("resizeChange",(()=>this.initializeColumnWidths()),{once:!0,capture:!0}),this.observers.push(t(this.host,(async t=>{await this.host.updateComplete,t&&this.columnAddedOrRemoved(t)&&this.updateLayout()}))),this.observers.push(s(this.host,["hidden"],(()=>this.updateLayout())))}hostUpdated(){this.host.height&&this.host.style.setProperty("--body-height",i(this.host.height)?this.host.height+"px":this.host.height)}hostDisconnected(){this.observers.forEach((t=>t?.disconnect()))}columnAddedOrRemoved(t){return[...Array.from(t.removedNodes),...Array.from(t.addedNodes)].find((t=>"CDS-GRID-COLUMN"===t.tagName))}initializeColumnWidths(){"fixed"===this.host.columnLayout&&(this.visibleColumns.filter((t=>t.width)).forEach((t=>this.host.style.setProperty("--ch"+t.ariaColIndex,i(t.width)?t.width+"px":t.width))),this.visibleColumns.filter((t=>!t.width&&parseInt(t.ariaColIndex)!==this.columns.length)).forEach((t=>this.host.style.setProperty("--ch"+t.ariaColIndex,parseInt(getComputedStyle(t).width)+"px"))),this.host.style.setProperty("--ch"+this.lastVisibleColumn.ariaColIndex,`minmax(${this.getLastColumnWidth()??parseInt(getComputedStyle(this.lastVisibleColumn).width)+"px"}, 100%)`))}getLastColumnWidth(){return i(this.lastVisibleColumn.width)?this.lastVisibleColumn.width+"px":this.lastVisibleColumn.width?this.lastVisibleColumn.width:null}updateLayout(){this._columns=this.host.columns,this.validateColumnLayout(),this.createColumnGrids(),this.setColumnDividers()}createColumnGrids(){const t=this.columns.filter((t=>!t.hidden)).reduce(((t,s)=>{const e=i(s.width)?s.width+"px":s.width;return`${t} var(--ch${s.ariaColIndex}, ${e||"1fr"})`}),"");this.host.style.setProperty("--ch-grid",t)}setColumnDividers(){this.visibleColumns.forEach(((t,s)=>{t.removeAttribute("draggable-hidden"),"action"===t.type&&"action"===this.visibleColumns[s+1]?.type&&t.setAttribute("draggable-hidden","")})),this.lastVisibleColumn?.setAttribute("draggable-hidden","")}validateColumnLayout(){if(e()){const t=Array.from(this.host.rows[0]?.cells??[]).filter((t=>!t.hidden));this.visibleColumns.length!==t?.length&&0!==t?.length&&h.error(`Error: column mismatch, ${this.visibleColumns.length} visible column headers with ${t.length} visible cells`)}}}export{o as GridLayoutController};
+//# sourceMappingURL=grid-layout.controller.js.map

package/grid/grid/grid-layout.controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-layout.controller.js","sources":["../../../../src/grid/grid/grid-layout.controller.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nimport { isNumericString, listenForAttributeListChange, LogService, notProductionEnvironment, onChildListMutation, } from '@cds/core/internal';\nexport class GridLayoutController {\n    constructor(host) {\n        this.host = host;\n        this.observers = [];\n        this.host.addController(this);\n    }\n    get columns() {\n        return Array.from(this._columns ?? []);\n    }\n    get visibleColumns() {\n        return this.columns.filter(c => !c.hidden);\n    }\n    get lastVisibleColumn() {\n        return this.visibleColumns[this.host.getAttribute('dir') === 'rtl' ? 0 : this.visibleColumns.length - 1];\n    }\n    async hostConnected() {\n        await this.host.updateComplete;\n        this.updateLayout();\n        this.host.addEventListener('resizeChange', () => this.initializeColumnWidths(), { once: true, capture: true });\n        this.observers.push(onChildListMutation(this.host, async (mutation) => {\n            await this.host.updateComplete;\n            if (mutation && this.columnAddedOrRemoved(mutation)) {\n                this.updateLayout();\n            }\n        }));\n        this.observers.push(listenForAttributeListChange(this.host, ['hidden'], () => this.updateLayout()));\n    }\n    hostUpdated() {\n        if (this.host.height) {\n            this.host.style.setProperty('--body-height', isNumericString(this.host.height) ? `${this.host.height}px` : this.host.height);\n        }\n    }\n    hostDisconnected() {\n        this.observers.forEach(o => o?.disconnect());\n    }\n    columnAddedOrRemoved(mutation) {\n        return [...Array.from(mutation.removedNodes), ...Array.from(mutation.addedNodes)].find((i) => i.tagName === 'CDS-GRID-COLUMN');\n    }\n    initializeColumnWidths() {\n        if (this.host.columnLayout === 'fixed') {\n            this.visibleColumns\n                .filter(c => c.width)\n                .forEach(c => this.host.style.setProperty(`--ch${c.ariaColIndex}`, isNumericString(c.width) ? `${c.width}px` : c.width));\n            this.visibleColumns\n                .filter(c => !c.width && parseInt(c.ariaColIndex) !== this.columns.length)\n                .forEach(c => this.host.style.setProperty(`--ch${c.ariaColIndex}`, `${parseInt(getComputedStyle(c).width)}px`));\n            this.host.style.setProperty(`--ch${this.lastVisibleColumn.ariaColIndex}`, `minmax(${this.getLastColumnWidth() ?? `${parseInt(getComputedStyle(this.lastVisibleColumn).width)}px`}, 100%)`);\n        }\n    }\n    getLastColumnWidth() {\n        if (isNumericString(this.lastVisibleColumn.width)) {\n            return `${this.lastVisibleColumn.width}px`;\n        }\n        else {\n            return this.lastVisibleColumn.width ? this.lastVisibleColumn.width : null;\n        }\n    }\n    updateLayout() {\n        this._columns = this.host.columns; // create copy per update to prevent multiple DOM queries from @query getters\n        this.validateColumnLayout();\n        this.createColumnGrids();\n        this.setColumnDividers();\n    }\n    createColumnGrids() {\n        const colWidths = this.columns\n            .filter(c => !c.hidden)\n            .reduce((p, c) => {\n            const width = isNumericString(c.width) ? `${c.width}px` : c.width;\n            return `${p} ${`var(--ch${c.ariaColIndex}, ${width ? width : '1fr'})`}`;\n        }, '');\n        this.host.style.setProperty('--ch-grid', colWidths);\n    }\n    setColumnDividers() {\n        this.visibleColumns.forEach((c, i) => {\n            c.removeAttribute('draggable-hidden');\n            if (c.type === 'action' && this.visibleColumns[i + 1]?.type === 'action') {\n                c.setAttribute('draggable-hidden', '');\n            }\n        });\n        this.lastVisibleColumn?.setAttribute('draggable-hidden', '');\n    }\n    validateColumnLayout() {\n        if (notProductionEnvironment()) {\n            const visibleCells = Array.from(this.host.rows[0]?.cells ?? []).filter((c) => !c.hidden);\n            if (this.visibleColumns.length !== visibleCells?.length && visibleCells?.length !== 0) {\n                LogService.error(`Error: column mismatch, ${this.visibleColumns.length} visible column headers with ${visibleCells.length} visible cells`);\n            }\n        }\n    }\n}\n"],"names":["GridLayoutController","constructor","host","this","observers","addController","columns","Array","from","_columns","visibleColumns","filter","c","hidden","lastVisibleColumn","getAttribute","length","async","updateComplete","updateLayout","addEventListener","initializeColumnWidths","once","capture","push","onChildListMutation","mutation","columnAddedOrRemoved","listenForAttributeListChange","hostUpdated","height","style","setProperty","isNumericString","hostDisconnected","forEach","o","disconnect","removedNodes","addedNodes","find","i","tagName","columnLayout","width","ariaColIndex","parseInt","getComputedStyle","getLastColumnWidth","validateColumnLayout","createColumnGrids","setColumnDividers","colWidths","reduce","p","removeAttribute","type","setAttribute","notProductionEnvironment","visibleCells","rows","cells","LogService","error"],"mappings":"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"}

package/grid/grid/grid.element.d.ts

@@ -0,0 +1,73 @@
+import { LitElement } from 'lit';
+import { AriaGridController } from '@cds/core/internal';
+import { CdsGridRow } from '../row/grid-row.element.js';
+import { CdsGridCell } from '../cell/grid-cell.element.js';
+import { CdsGridColumn } from '../column/grid-column.element.js';
+import { GridLayoutController } from './grid-layout.controller.js';
+import { CdsGridPlaceholder } from '../placeholder/grid-placeholder.element.js';
+/**
+ * Grid
+ *
+ * ```typescript
+ * import '@cds/core/grid/register.js';
+ * ```
+ *
+ * @internal
+ * @element cds-grid
+ * @event rangeSelectionChange
+ * @cssprop --background
+ * @cssprop --body-height
+ * @cssprop --scrollbar-background
+ * @cssprop --scrollbar-thumb-background
+ * @cssprop --column-height
+ * @cssprop --row-height
+ * @cssprop --scroll-padding-top
+ * @cssprop --row-content-visibility
+ * @cssprop --column-text-align
+ * @cssprop --cell-text-algin
+ */
+export declare class CdsGrid extends LitElement {
+    i18n: {
+        resizeColumn: string;
+        closeDetails: string;
+        noData: string;
+        rowDetailStart: string;
+        rowDetailEnd: string;
+        footerEnd: string;
+        action: string;
+        dropTarget: string;
+        pagination: {
+            label: string;
+            firstPage: string;
+            previousPage: string;
+            nextPage: string;
+            lastPage: string;
+            pageSize: string;
+            page: string;
+        };
+    };
+    columnLayout: 'fixed' | 'flex';
+    height: string;
+    border: 'row' | 'cell' | 'column' | 'none' | 'stripe';
+    selectable: 'multi' | 'single' | null;
+    rangeSelection: boolean;
+    scrollLock: boolean;
+    protected _id: string;
+    protected ariaGridController: AriaGridController<this>;
+    protected gridLayoutController: GridLayoutController;
+    static styles: import("lit").CSSResultGroup[];
+    readonly columnRowGroup: HTMLElement;
+    readonly columnRow: HTMLElement;
+    readonly columns: NodeListOf<CdsGridColumn>;
+    readonly rowGroup: HTMLElement;
+    readonly rows: NodeListOf<CdsGridRow>;
+    readonly cells: NodeListOf<CdsGridCell>;
+    readonly footerRowGroup: HTMLElement;
+    readonly footerRow: HTMLElement;
+    readonly footerCells: NodeListOf<HTMLElement>;
+    readonly placeholder: CdsGridPlaceholder;
+    readonly keyNavGrid: HTMLElement;
+    get placeholderCell(): HTMLElement;
+    readonly grid: this;
+    render(): import("lit-html").TemplateResult<1>;
+}

package/grid/grid/grid.element.js

@@ -0,0 +1,2 @@
+import{__decorate as o}from"tslib";import{LitElement as r,html as t}from"lit";import{query as e}from"lit/decorators/query.js";import{queryAll as i}from"lit/decorators/query-all.js";import{I18nService as l,createId as d,baseStyles as s,i18n as p,property as c,state as a,querySlotAll as n,querySlot as y,ariaGrid as g,ariaMultiSelectable as u,keyNavigationGrid as v,gridRangeSelection as m,scrollableVisibility as h,draggableList as w}from"@cds/core/internal";import{GridLayoutController as f}from"./grid-layout.controller.js";import b from"./grid.element.scss.js";let S=class extends r{constructor(){super(...arguments);this.i18n=l.keys.grid,this.columnLayout="fixed",this.border="row",this.rangeSelection=!0,this.scrollLock=!1,this._id=d(),this.gridLayoutController=new f(this),this.grid=this}get placeholderCell(){return this.placeholder?.gridCell}render(){return t`<div role="presentation" class="private-host"><div role="presentation" class="scroll-container"><div class="column-row-group"><div class="column-row"><slot name="columns" @slotchange="${()=>this.ariaGridController.update()}"><cds-grid-column draggable-hidden><span cds-layout="display:screen-reader-only">${this.i18n.noData}</span></cds-grid-column></slot></div></div><div class="body-row-group"><slot @slotchange="${()=>this.ariaGridController.update()}"><cds-grid-placeholder></cds-grid-placeholder></slot></div></div><div class="footer-row-group"><div class="footer-row"><div class="footer-grid-cell"><slot name="footer"></slot></div></div></div><slot name="detail"></slot></div>`}};S.styles=[s,b],o([p()],S.prototype,"i18n",void 0),o([c({type:String})],S.prototype,"columnLayout",void 0),o([c({type:String})],S.prototype,"height",void 0),o([c({type:String})],S.prototype,"border",void 0),o([c({type:String})],S.prototype,"selectable",void 0),o([c({type:Boolean})],S.prototype,"rangeSelection",void 0),o([c({type:Boolean})],S.prototype,"scrollLock",void 0),o([a({type:String,reflect:!0})],S.prototype,"_id",void 0),o([e(".column-row-group",!0)],S.prototype,"columnRowGroup",void 0),o([e(".column-row",!0)],S.prototype,"columnRow",void 0),o([n("cds-grid-column")],S.prototype,"columns",void 0),o([e(".body-row-group",!0)],S.prototype,"rowGroup",void 0),o([n("cds-grid-row")],S.prototype,"rows",void 0),o([n("cds-grid-cell")],S.prototype,"cells",void 0),o([e(".footer-row-group",!0)],S.prototype,"footerRowGroup",void 0),o([e(".footer-row",!0)],S.prototype,"footerRow",void 0),o([i(".footer-grid-cell")],S.prototype,"footerCells",void 0),o([y("cds-grid-placeholder")],S.prototype,"placeholder",void 0),o([e(".scroll-container",!0)],S.prototype,"keyNavGrid",void 0),S=o([g(),u(),v(),m(),h(),w({layout:"horizontal",item:"cds-grid-column",manageFocus:!1}),w({layout:"vertical",item:"cds-grid-row",dropZone:"cds-grid-placeholder",manageFocus:!1})],S);export{S as CdsGrid};
+//# sourceMappingURL=grid.element.js.map

package/grid/grid/grid.element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid.element.js","sources":["../../../../src/grid/grid/grid.element.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nimport { __decorate } from \"tslib\";\nimport { LitElement, html } from 'lit';\nimport { query } from 'lit/decorators/query.js';\nimport { queryAll } from 'lit/decorators/query-all.js';\nimport { baseStyles, createId, state, property, querySlotAll, i18n, I18nService, querySlot, scrollableVisibility, ariaMultiSelectable, ariaGrid, gridRangeSelection, keyNavigationGrid, draggableList, } from '@cds/core/internal';\nimport { GridLayoutController } from './grid-layout.controller.js';\nimport styles from './grid.element.scss';\n/**\n * Grid\n *\n * ```typescript\n * import '@cds/core/grid/register.js';\n * ```\n *\n * @internal\n * @element cds-grid\n * @event rangeSelectionChange\n * @cssprop --background\n * @cssprop --body-height\n * @cssprop --scrollbar-background\n * @cssprop --scrollbar-thumb-background\n * @cssprop --column-height\n * @cssprop --row-height\n * @cssprop --scroll-padding-top\n * @cssprop --row-content-visibility\n * @cssprop --column-text-align\n * @cssprop --cell-text-algin\n */\nlet CdsGrid = class CdsGrid extends LitElement {\n    constructor() {\n        super(...arguments);\n        this.i18n = I18nService.keys.grid;\n        this.columnLayout = 'fixed';\n        this.border = 'row';\n        this.rangeSelection = true;\n        this.scrollLock = false;\n        this._id = createId();\n        this.gridLayoutController = new GridLayoutController(this);\n        this.grid = this;\n    }\n    get placeholderCell() {\n        return this.placeholder?.gridCell;\n    }\n    render() {\n        return html `\n      <div role=\"presentation\" class=\"private-host\">\n        <div role=\"presentation\" class=\"scroll-container\">\n          <div class=\"column-row-group\">\n            <div class=\"column-row\">\n              <slot name=\"columns\" @slotchange=${() => this.ariaGridController.update()}>\n                <cds-grid-column draggable-hidden>\n                  <span cds-layout=\"display:screen-reader-only\">${this.i18n.noData}</span>\n                </cds-grid-column>\n              </slot>\n            </div>\n          </div>\n          <div class=\"body-row-group\">\n            <slot @slotchange=${() => this.ariaGridController.update()}>\n              <cds-grid-placeholder></cds-grid-placeholder>\n            </slot>\n          </div>\n        </div>\n        <div class=\"footer-row-group\">\n          <div class=\"footer-row\">\n            <div class=\"footer-grid-cell\">\n              <slot name=\"footer\"></slot>\n            </div>\n          </div>\n        </div>\n        <slot name=\"detail\"></slot>\n      </div>\n    `;\n    }\n};\nCdsGrid.styles = [baseStyles, styles];\n__decorate([\n    i18n()\n], CdsGrid.prototype, \"i18n\", void 0);\n__decorate([\n    property({ type: String })\n], CdsGrid.prototype, \"columnLayout\", void 0);\n__decorate([\n    property({ type: String })\n], CdsGrid.prototype, \"height\", void 0);\n__decorate([\n    property({ type: String })\n], CdsGrid.prototype, \"border\", void 0);\n__decorate([\n    property({ type: String })\n], CdsGrid.prototype, \"selectable\", void 0);\n__decorate([\n    property({ type: Boolean })\n], CdsGrid.prototype, \"rangeSelection\", void 0);\n__decorate([\n    property({ type: Boolean })\n], CdsGrid.prototype, \"scrollLock\", void 0);\n__decorate([\n    state({ type: String, reflect: true })\n], CdsGrid.prototype, \"_id\", void 0);\n__decorate([\n    query('.column-row-group', true)\n], CdsGrid.prototype, \"columnRowGroup\", void 0);\n__decorate([\n    query('.column-row', true)\n], CdsGrid.prototype, \"columnRow\", void 0);\n__decorate([\n    querySlotAll('cds-grid-column')\n], CdsGrid.prototype, \"columns\", void 0);\n__decorate([\n    query('.body-row-group', true)\n], CdsGrid.prototype, \"rowGroup\", void 0);\n__decorate([\n    querySlotAll('cds-grid-row')\n], CdsGrid.prototype, \"rows\", void 0);\n__decorate([\n    querySlotAll('cds-grid-cell')\n], CdsGrid.prototype, \"cells\", void 0);\n__decorate([\n    query('.footer-row-group', true)\n], CdsGrid.prototype, \"footerRowGroup\", void 0);\n__decorate([\n    query('.footer-row', true)\n], CdsGrid.prototype, \"footerRow\", void 0);\n__decorate([\n    queryAll('.footer-grid-cell')\n], CdsGrid.prototype, \"footerCells\", void 0);\n__decorate([\n    querySlot('cds-grid-placeholder')\n], CdsGrid.prototype, \"placeholder\", void 0);\n__decorate([\n    query('.scroll-container', true)\n], CdsGrid.prototype, \"keyNavGrid\", void 0);\nCdsGrid = __decorate([\n    ariaGrid(),\n    ariaMultiSelectable(),\n    keyNavigationGrid(),\n    gridRangeSelection(),\n    scrollableVisibility(),\n    draggableList({\n        layout: 'horizontal',\n        item: 'cds-grid-column',\n        manageFocus: false,\n    }),\n    draggableList({\n        layout: 'vertical',\n        item: 'cds-grid-row',\n        dropZone: 'cds-grid-placeholder',\n        manageFocus: false,\n    })\n], CdsGrid);\nexport { CdsGrid };\n"],"names":["CdsGrid","LitElement","constructor","super","this","i18n","I18nService","keys","grid","columnLayout","border","rangeSelection","scrollLock","_id","createId","gridLayoutController","GridLayoutController","placeholderCell","placeholder","gridCell","render","html","ariaGridController","update","noData","styles","baseStyles","__decorate","prototype","property","type","String","Boolean","state","reflect","query","querySlotAll","queryAll","querySlot","ariaGrid","ariaMultiSelectable","keyNavigationGrid","gridRangeSelection","scrollableVisibility","draggableList","layout","item","manageFocus","dropZone"],"mappings":"ojBAiCG,IAACA,EAAU,cAAsBC,EAChCC,cACIC,oBACAC,KAAKC,KAAOC,EAAYC,KAAKC,KAC7BJ,KAAKK,aAAe,QACpBL,KAAKM,OAAS,MACdN,KAAKO,gBAAiB,EACtBP,KAAKQ,YAAa,EAClBR,KAAKS,IAAMC,IACXV,KAAKW,qBAAuB,IAAIC,EAAqBZ,MACrDA,KAAKI,KAAOJ,KAEZa,sBACA,OAAOb,KAAKc,aAAaC,SAE7BC,SACI,OAAOC,CAAK,2LAK6B,IAAMjB,KAAKkB,mBAAmBC,6FAEbnB,KAAKC,KAAKmB,oGAM5C,IAAMpB,KAAKkB,mBAAmBC,iPAiB9DvB,EAAQyB,OAAS,CAACC,EAAYD,GAC9BE,EAAW,CACPtB,KACDL,EAAQ4B,UAAW,YAAQ,GAC9BD,EAAW,CACPE,EAAS,CAAEC,KAAMC,UAClB/B,EAAQ4B,UAAW,oBAAgB,GACtCD,EAAW,CACPE,EAAS,CAAEC,KAAMC,UAClB/B,EAAQ4B,UAAW,cAAU,GAChCD,EAAW,CACPE,EAAS,CAAEC,KAAMC,UAClB/B,EAAQ4B,UAAW,cAAU,GAChCD,EAAW,CACPE,EAAS,CAAEC,KAAMC,UAClB/B,EAAQ4B,UAAW,kBAAc,GACpCD,EAAW,CACPE,EAAS,CAAEC,KAAME,WAClBhC,EAAQ4B,UAAW,sBAAkB,GACxCD,EAAW,CACPE,EAAS,CAAEC,KAAME,WAClBhC,EAAQ4B,UAAW,kBAAc,GACpCD,EAAW,CACPM,EAAM,CAAEH,KAAMC,OAAQG,SAAS,KAChClC,EAAQ4B,UAAW,WAAO,GAC7BD,EAAW,CACPQ,EAAM,qBAAqB,IAC5BnC,EAAQ4B,UAAW,sBAAkB,GACxCD,EAAW,CACPQ,EAAM,eAAe,IACtBnC,EAAQ4B,UAAW,iBAAa,GACnCD,EAAW,CACPS,EAAa,oBACdpC,EAAQ4B,UAAW,eAAW,GACjCD,EAAW,CACPQ,EAAM,mBAAmB,IAC1BnC,EAAQ4B,UAAW,gBAAY,GAClCD,EAAW,CACPS,EAAa,iBACdpC,EAAQ4B,UAAW,YAAQ,GAC9BD,EAAW,CACPS,EAAa,kBACdpC,EAAQ4B,UAAW,aAAS,GAC/BD,EAAW,CACPQ,EAAM,qBAAqB,IAC5BnC,EAAQ4B,UAAW,sBAAkB,GACxCD,EAAW,CACPQ,EAAM,eAAe,IACtBnC,EAAQ4B,UAAW,iBAAa,GACnCD,EAAW,CACPU,EAAS,sBACVrC,EAAQ4B,UAAW,mBAAe,GACrCD,EAAW,CACPW,EAAU,yBACXtC,EAAQ4B,UAAW,mBAAe,GACrCD,EAAW,CACPQ,EAAM,qBAAqB,IAC5BnC,EAAQ4B,UAAW,kBAAc,GACpC5B,EAAU2B,EAAW,CACjBY,IACAC,IACAC,IACAC,IACAC,IACAC,EAAc,CACVC,OAAQ,aACRC,KAAM,kBACNC,aAAa,IAEjBH,EAAc,CACVC,OAAQ,WACRC,KAAM,eACNE,SAAU,uBACVD,aAAa,KAElB/C"}

package/grid/grid/grid.element.scss.js

@@ -0,0 +1,2 @@
+import{css as o}from"lit";var r=o`@keyframes fadein{0%{opacity:0}to{opacity:1}}[hidden]{display:none!important}:host{--background:var(--cds-alias-object-container-background, var(--cds-global-color-white, white));--body-height:auto;--body-min-height:auto;--scrollbar-background:var(--background);--scrollbar-thumb-background:var(--cds-alias-object-border-color, var(--cds-global-color-construction-200, #cbd4d8));--column-height:var(--cds-alias-object-interaction-touch-target, 2.25rem);--row-height:var(--cds-alias-object-interaction-touch-target, 2.25rem);--scroll-padding-top:var(--column-height);--row-content-visibility:auto;--column-text-align:left;--cell-text-algin:left;width:100%;display:block;position:relative}:host([range-selection]){user-select:none}:host([border*=cell]) ::slotted(cds-grid-row),:host([border*=column]) ::slotted(cds-grid-row){--cell-border-width:var(--cds-alias-object-border-width-100, 0.0625rem)}:host([border*=column]) ::slotted(cds-grid-row){--border-top:0;--border-bottom:0}:host([border*=none]) ::slotted(cds-grid-row),:host([border*=stripe]) ::slotted(cds-grid-row){--border-top:0;--border-bottom:0}::slotted(cds-grid-row:first-of-type){--border-top:0}::slotted(cds-grid-row:last-of-type){--border-bottom:var(--cds-alias-object-border-width-100, 0.0625rem) solid var(--cds-alias-object-border-color, var(--cds-global-color-construction-200, #cbd4d8))}:host([border*=stripe]) ::slotted(cds-grid-row:nth-child(even)){--background:var(--cds-alias-object-container-background-tint, var(--cds-global-color-construction-50, #f1f6f8))}:host([column-align*=center]){--column-justify-content:center;--cell-justify-content:center}:host([column-align*=right]){--column-justify-content:flex-end;--cell-justify-content:flex-end}:host([cds-theme=compact]){--cds-alias-object-interaction-touch-target:calc(var(--cds-global-space-9, 1.5rem) + var(--cds-global-space-3, 0.25rem))}.private-host{border:var(--cds-alias-object-border-width-100,.0625rem) solid var(--cds-alias-object-border-color,var(--cds-global-color-construction-200,#cbd4d8));border-radius:var(--cds-alias-object-border-radius-100,.25rem);background:var(--background);position:relative}.scroll-container{overflow:auto;height:var(--body-height,100%);min-height:var(--body-min-height,auto);width:100%;display:flex;flex-direction:column;scroll-padding-top:var(--scroll-padding-top);background:var(--cds-alias-object-container-background-tint,var(--cds-global-color-construction-50,#f1f6f8))}:host([scroll-lock]) .scroll-container{overflow:hidden}.body-row-group{display:flex;flex-direction:column;flex:1 1 0%;min-width:fit-content;margin-top:var(--cds-global-space-2,.125rem);background:var(--background)}.body-row-group:first-child,.column-row-group:first-child{display:contents}.column-row{display:grid;top:0;position:sticky;z-index:99;min-width:fit-content;grid-template-columns:var(--ch-grid);background:var(--cds-alias-object-container-background-tint,var(--cds-global-color-construction-50,#f1f6f8));box-shadow:0 var(--cds-alias-object-border-width-100,.0625rem) 0 var(--cds-alias-object-border-color,var(--cds-global-color-construction-200,#cbd4d8))}.footer{background:var(--background)}::slotted(cds-grid-row:not([cds-draggable=target]):first-of-type){--box-shadow:var(--cds-alias-object-border-width-100, 0.0625rem) solid transparent}::-webkit-scrollbar{width:var(--cds-global-space-5,.5rem);height:var(--cds-global-space-5,.5rem);background:0 0}::-webkit-scrollbar-track{margin-top:var(--cds-alias-object-interaction-touch-target,2.25rem);box-shadow:inset 0 0 var(--cds-global-space-6,.75rem) var(--scrollbar-background)}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb-background);border-radius:var(--cds-global-space-5,.5rem);border:var(--cds-global-space-2,.125rem) solid var(--scrollbar-background)}::-webkit-scrollbar-corner{background:0 0}`;export{r as default};
+//# sourceMappingURL=grid.element.scss.js.map

package/grid/grid/grid.element.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid.element.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/grid/index.d.ts

@@ -0,0 +1,8 @@
+export * from './cell/grid-cell.element.js';
+export * from './column/grid-column.element.js';
+export * from './detail/grid-detail.element.js';
+export * from './footer/grid-footer.element.js';
+export * from './pagination/grid-pagination.element.js';
+export * from './placeholder/grid-placeholder.element.js';
+export * from './row/grid-row.element.js';
+export * from './grid/grid.element.js';

package/grid/index.js

@@ -0,0 +1,2 @@
+export{CdsGridCell}from"./cell/grid-cell.element.js";export{CdsGridColumn}from"./column/grid-column.element.js";export{CdsGridDetail}from"./detail/grid-detail.element.js";export{CdsGridFooter}from"./footer/grid-footer.element.js";export{CdsGridPagination}from"./pagination/grid-pagination.element.js";export{CdsGridPlaceholder}from"./placeholder/grid-placeholder.element.js";export{CdsGridRow}from"./row/grid-row.element.js";export{CdsGrid}from"./grid/grid.element.js";
+//# sourceMappingURL=index.js.map

package/grid/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}