@aquera/nile-elements 0.1.69 → 0.1.70-beta-1.0

package/dist/src/nile-table-header-item/nile-table-header-item.d.ts

@@ -4,7 +4,7 @@
  * This source code is licensed under the BSD-3-Clause license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import { CSSResultArray, TemplateResult, PropertyValues } from 'lit';
+import { CSSResultArray, TemplateResult } from 'lit';
 import NileElement from '../internal/nile-element';
 /**
  * Nile icon component.
@@ -28,7 +28,6 @@ export declare class NileTableHeaderItem extends NileElement {
     /** Enables the resize functionality. */
     resizable: boolean;
     sorting_ct: number;
-    protected updated(changedProperties: PropertyValues): void;
     /**
      * Render method
      * @slot This is a slot test

package/dist/src/nile-table-header-item/nile-table-header-item.js

@@ -10,7 +10,7 @@ import { customElement, state, property } from 'lit/decorators.js';
 import { styles } from './nile-table-header-item.css';
 import NileElement from '../internal/nile-element';
 import { HasSlotController } from '../internal/slot';
-import { createResizeHandler, resetAllColumnWidths } from '../internal/resizable-table-helper';
+import { createResizeHandler } from '../internal/resizable-table-helper';
 /**
  * Nile icon component.
  *
@@ -41,17 +41,6 @@ let NileTableHeaderItem = class NileTableHeaderItem extends NileElement {
     }
     /* #endregion */
     /* #region Methods */
-    updated(changedProperties) {
-        super.updated(changedProperties);
-        if (changedProperties.has('resizable')) {
-            if (!this.resizable) {
-                const tableBody = this.closest('nile-table-body');
-                if (tableBody) {
-                    resetAllColumnWidths(tableBody);
-                }
-            }
-        }
-    }
     /**
      * Render method
      * @slot This is a slot test

package/dist/src/nile-table-header-item/nile-table-header-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-table-header-item.js","sourceRoot":"","sources":["../../../src/nile-table-header-item/nile-table-header-item.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  LitElement,\n  html,\n  CSSResultArray,\n  TemplateResult,\n  PropertyValues,\n} from 'lit';\nimport { customElement, state, property } from 'lit/decorators.js';\nimport { styles } from './nile-table-header-item.css';\nimport NileElement from '../internal/nile-element';\nimport { HasSlotController } from '../internal/slot';\nimport { createResizeHandler, resetAllColumnWidths } from '../internal/resizable-table-helper';\n\n/**\n * Nile icon component.\n *\n * @tag nile-table-header-item\n *\n */\n@customElement('nile-table-header-item')\nexport class NileTableHeaderItem extends NileElement {\n  private readonly hasSlotController = new HasSlotController(this, '[default]');\n  /**\n   * The styles for TableHeaderItem\n   * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n   */\n  public static get styles(): CSSResultArray {\n    return [styles];\n  }\n\n  /** Enables the sort functionality. */\n  @property({ type: Boolean, reflect: true }) havesort = false;\n\n  /** Enables the sort functionality. */\n  @property({ type: Boolean, reflect: true }) havefilter = false;\n\n  /** Places the icon . */\n  @property({ type: String, reflect: true, attribute: 'icon-name' }) iconName =\n    '';\n\n  /** Enables the resize functionality. */\n  @property({ type: Boolean, reflect: true }) resizable = false;\n\n  @state() sorting_ct = 0;\n\n  /* #endregion */\n\n  /* #region Methods */\n\n  protected updated(changedProperties: PropertyValues) {\n    super.updated(changedProperties);\n    \n    if (changedProperties.has('resizable')) {\n      if (!this.resizable) {\n        const tableBody = this.closest('nile-table-body');\n        if (tableBody) {\n          resetAllColumnWidths(tableBody);\n        }\n      }\n    }\n  }\n\n  /**\n   * Render method\n   * @slot This is a slot test\n   */\n  private handleSort(e: any) {\n    this.sorting_ct++;\n    let curr_sort_string = this.hasSlotController.host.innerHTML;\n    const order = ['normal', 'asc', 'des'];\n    this.emit('nile-click-sort', {\n      value: { curr_sort_string, order: order[this.sorting_ct % 3] },\n    });\n  }\n\n  private handleSearch(e: any) {\n    this.emit('nile-search', { value: e.detail.value });\n  }\n\n  private handleResizeStart = createResizeHandler(this, 50);\n\n  public render(): TemplateResult {\n    return html`\n      <div class=\"header__item__wrapper\" part=\"nile__table-header-cell\">\n        <div class=\"headers\">\n          <slot> </slot>\n          ${this.havesort && this.sorting_ct % 3 === 0\n            ? html`<nile-icon\n                name=\"sortdown\"\n                size=\"16\"\n                @click=${this.handleSort}\n                class=\"hover__arrow\"\n              ></nile-icon>`\n            : null}\n          ${this.havesort && this.sorting_ct % 3 === 1\n            ? html`<nile-icon\n                name=\"sortdown\"\n                size=\"16\"\n                @click=${this.handleSort}\n              ></nile-icon>`\n            : null}\n          ${this.havesort && this.sorting_ct % 3 === 2\n            ? html`<nile-icon\n                name=\"sortup\"\n                size=\"16\"\n                @click=${this.handleSort}\n              ></nile-icon>`\n            : null}\n          ${this.iconName\n            ? html` <nile-icon name=\"${this.iconName}\" size=\"16\"></nile-icon>`\n            : html``}\n          ${this.havefilter\n            ? html` <nile-popover title=\"Filter\" placement=\"bottom\">\n                <nile-icon name=\"filter\" size=\"16\" slot=\"anchor\"></nile-icon>\n                <nile-input\n                  placeholder=\"Search\"\n                  @nile-input=${this.handleSearch}\n                  part=\"filter__search\"\n                ></nile-input>\n                <slot name=\"filter__content\" part=\"filter__content\"></slot>\n              </nile-popover>`\n            : html``}\n        </div>\n        ${this.resizable \n          ? html`<div class=\"resizer\" @mousedown=${this.handleResizeStart}></div>`\n          : null}\n      </div>`;\n  }\n}\n\nexport default NileTableHeaderItem;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-table-header-item': NileTableHeaderItem;\n  }\n}\n"]}
+{"version":3,"file":"nile-table-header-item.js","sourceRoot":"","sources":["../../../src/nile-table-header-item/nile-table-header-item.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  LitElement,\n  html,\n  CSSResultArray,\n  TemplateResult,\n} from 'lit';\nimport { customElement, state, property } from 'lit/decorators.js';\nimport { styles } from './nile-table-header-item.css';\nimport NileElement from '../internal/nile-element';\nimport { HasSlotController } from '../internal/slot';\nimport { createResizeHandler } from '../internal/resizable-table-helper';\n\n/**\n * Nile icon component.\n *\n * @tag nile-table-header-item\n *\n */\n@customElement('nile-table-header-item')\nexport class NileTableHeaderItem extends NileElement {\n  private readonly hasSlotController = new HasSlotController(this, '[default]');\n  /**\n   * The styles for TableHeaderItem\n   * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n   */\n  public static get styles(): CSSResultArray {\n    return [styles];\n  }\n\n  /** Enables the sort functionality. */\n  @property({ type: Boolean, reflect: true }) havesort = false;\n\n  /** Enables the sort functionality. */\n  @property({ type: Boolean, reflect: true }) havefilter = false;\n\n  /** Places the icon . */\n  @property({ type: String, reflect: true, attribute: 'icon-name' }) iconName =\n    '';\n\n  /** Enables the resize functionality. */\n  @property({ type: Boolean, reflect: true }) resizable = false;\n\n  @state() sorting_ct = 0;\n\n  /* #endregion */\n\n  /* #region Methods */\n\n  /**\n   * Render method\n   * @slot This is a slot test\n   */\n  private handleSort(e: any) {\n    this.sorting_ct++;\n    let curr_sort_string = this.hasSlotController.host.innerHTML;\n    const order = ['normal', 'asc', 'des'];\n    this.emit('nile-click-sort', {\n      value: { curr_sort_string, order: order[this.sorting_ct % 3] },\n    });\n  }\n\n  private handleSearch(e: any) {\n    this.emit('nile-search', { value: e.detail.value });\n  }\n\n  private handleResizeStart = createResizeHandler(this, 50);\n\n  public render(): TemplateResult {\n    return html`\n      <div class=\"header__item__wrapper\" part=\"nile__table-header-cell\">\n        <div class=\"headers\">\n          <slot> </slot>\n          ${this.havesort && this.sorting_ct % 3 === 0\n            ? html`<nile-icon\n                name=\"sortdown\"\n                size=\"16\"\n                @click=${this.handleSort}\n                class=\"hover__arrow\"\n              ></nile-icon>`\n            : null}\n          ${this.havesort && this.sorting_ct % 3 === 1\n            ? html`<nile-icon\n                name=\"sortdown\"\n                size=\"16\"\n                @click=${this.handleSort}\n              ></nile-icon>`\n            : null}\n          ${this.havesort && this.sorting_ct % 3 === 2\n            ? html`<nile-icon\n                name=\"sortup\"\n                size=\"16\"\n                @click=${this.handleSort}\n              ></nile-icon>`\n            : null}\n          ${this.iconName\n            ? html` <nile-icon name=\"${this.iconName}\" size=\"16\"></nile-icon>`\n            : html``}\n          ${this.havefilter\n            ? html` <nile-popover title=\"Filter\" placement=\"bottom\">\n                <nile-icon name=\"filter\" size=\"16\" slot=\"anchor\"></nile-icon>\n                <nile-input\n                  placeholder=\"Search\"\n                  @nile-input=${this.handleSearch}\n                  part=\"filter__search\"\n                ></nile-input>\n                <slot name=\"filter__content\" part=\"filter__content\"></slot>\n              </nile-popover>`\n            : html``}\n        </div>\n        ${this.resizable \n          ? html`<div class=\"resizer\" @mousedown=${this.handleResizeStart}></div>`\n          : null}\n      </div>`;\n  }\n}\n\nexport default NileTableHeaderItem;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-table-header-item': NileTableHeaderItem;\n  }\n}\n"]}

package/dist/src/nile-table-row/TableRowExpandableHelper.d.ts

@@ -0,0 +1,9 @@
+import type NileElement from '../internal/nile-element';
+/**
+ * Helper class to manage expandable content functionality for nile-table-row component
+ */
+export declare class TableRowExpandableHelper {
+    private component;
+    constructor(component: NileElement);
+    renderExpandableContent(): any;
+}

package/dist/src/nile-table-row/TableRowExpandableHelper.js

@@ -0,0 +1,26 @@
+import { html } from 'lit';
+/**
+ * Helper class to manage expandable content functionality for nile-table-row component
+ */
+export class TableRowExpandableHelper {
+    constructor(component) {
+        this.component = component;
+    }
+    renderExpandableContent() {
+        const component = this.component;
+        return html `
+      <div class="expandable-content">
+        <nile-table-row-expandable
+					expandable
+				>
+					<slot name="expandableIcon">
+						
+					</slot>
+					<slot></slot>
+					<slot name="expanded"></slot>
+				</nile-table-row-expandable>
+      </div>
+    `;
+    }
+}
+//# sourceMappingURL=TableRowExpandableHelper.js.map

package/dist/src/nile-table-row/TableRowExpandableHelper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableRowExpandableHelper.js","sourceRoot":"","sources":["../../../src/nile-table-row/TableRowExpandableHelper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAG3B;;GAEG;AACH,MAAM,OAAO,wBAAwB;IAGpC,YAAY,SAAsB;QACjC,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;IAC5B,CAAC;IAED,uBAAuB;QACtB,MAAM,SAAS,GAAG,IAAI,CAAC,SAAgB,CAAC;QAExC,OAAO,IAAI,CAAA;;;;;;;;;;;;KAYR,CAAC;IACL,CAAC;CACD","sourcesContent":["import { html } from 'lit';\nimport type NileElement from '../internal/nile-element';\n\n/**\n * Helper class to manage expandable content functionality for nile-table-row component\n */\nexport class TableRowExpandableHelper {\n\tprivate component: NileElement;\n\n\tconstructor(component: NileElement) {\n\t\tthis.component = component;\n\t}\n\n\trenderExpandableContent(): any {\n\t\tconst component = this.component as any;\n\n\t\treturn html`\n      <div class=\"expandable-content\">\n        <nile-table-row-expandable\n\t\t\t\t\texpandable\n\t\t\t\t>\n\t\t\t\t\t<slot name=\"expandableIcon\">\n\t\t\t\t\t\t\n\t\t\t\t\t</slot>\n\t\t\t\t\t<slot></slot>\n\t\t\t\t\t<slot name=\"expanded\"></slot>\n\t\t\t\t</nile-table-row-expandable>\n      </div>\n    `;\n\t}\n}"]}

package/dist/src/nile-table-row/helper.ts.d.ts

@@ -0,0 +1,37 @@
+/**
+ * Copyright Aquera Inc 2025
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { CSSResultArray, TemplateResult } from 'lit';
+import NileElement from '../internal/nile-element';
+/**
+ *nile-table-row component.
+ *
+ * @tag nile-table-row
+ *
+ */
+export declare class NileTableRowExpandable extends NileElement {
+    /**
+     * The styles for TableRow
+     * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
+     */
+    static get styles(): CSSResultArray;
+    /**
+     * Render method
+     * @slot This is a slot test
+     */
+    expandable: boolean;
+    expanded: boolean;
+    private _expandedSlot;
+    private toggleExpand;
+    private handleSortingAlter;
+    render(): TemplateResult;
+}
+export default NileTableRowExpandable;
+declare global {
+    interface HTMLElementTagNameMap {
+        'nile-table-row-expandable-sdf': NileTableRowExpandable;
+    }
+}

package/dist/src/nile-table-row/helper.ts.js

@@ -0,0 +1,105 @@
+/**
+ * Copyright Aquera Inc 2025
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { __decorate } from "tslib";
+import { html, } from 'lit';
+import { customElement, query, property } from 'lit/decorators.js';
+import { styles } from './nile-table-row.css';
+import NileElement from '../internal/nile-element';
+/**
+ *nile-table-row component.
+ *
+ * @tag nile-table-row
+ *
+ */
+let NileTableRowExpandable = class NileTableRowExpandable extends NileElement {
+    constructor() {
+        super(...arguments);
+        /* #endregion */
+        /* #region Methods */
+        /**
+         * Render method
+         * @slot This is a slot test
+         */
+        this.expandable = false;
+        this.expanded = false;
+        /* #endregion */
+    }
+    /**
+     * The styles for TableRow
+     * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
+     */
+    static get styles() {
+        return [styles];
+    }
+    toggleExpand(e) {
+        this.expanded = !this.expanded;
+        this.dispatchEvent(new CustomEvent('nile-change', {
+            detail: { expanded: this.expanded },
+            bubbles: true,
+            composed: true,
+        }));
+    }
+    handleSortingAlter(event) {
+        const header_items = [
+            ...this.querySelectorAll('nile-table-header-item'),
+        ];
+        for (let i = 0; i < header_items.length; i++) {
+            const header = header_items[i];
+            const haveIcon = header.textContent == event.detail.value.curr_sort_string;
+            if (!haveIcon) {
+                header.sorting_ct = 0;
+            }
+        }
+    }
+    render() {
+        return html `
+        <div part="row-container" class="row-container">
+          <div
+            part="nile-row"
+            class="row ${this.expandable ? 'expandable' : ''} ${this.expanded ? 'expanded' : ''}"
+            @nile-click-sort="${this.handleSortingAlter}"
+          >
+            ${this.expandable
+            ? html `
+              <slot name="expandableIcon">
+                <nile-icon
+                  class="expand-icon"
+                   name="${this.expanded ? 'chevron-up' : 'chevron-down'}"
+                  @click=${this.toggleExpand}
+                  role="button"
+                  size="10"
+                  aria-label="${this.expanded ? 'Collapse row' : 'Expand row'}">
+                </nile-icon> </slot>`
+            : null}
+            <slot></slot>
+          </div>
+  
+          ${this.expandable && this.expanded
+            ? html `
+                <div class="expanded-content">
+                  <slot name="expanded"></slot>
+                </div>`
+            : null}
+        </div>
+      `;
+    }
+};
+__decorate([
+    property({ type: Boolean, reflect: true })
+], NileTableRowExpandable.prototype, "expandable", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], NileTableRowExpandable.prototype, "expanded", void 0);
+__decorate([
+    query('slot[name="expanded"]')
+], NileTableRowExpandable.prototype, "_expandedSlot", void 0);
+NileTableRowExpandable = __decorate([
+    customElement('nile-table-row-expandable')
+], NileTableRowExpandable);
+export { NileTableRowExpandable };
+export default NileTableRowExpandable;
+//# sourceMappingURL=helper.ts.js.map

package/dist/src/nile-table-row/helper.ts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helper.ts.js","sourceRoot":"","sources":["../../../src/nile-table-row/helper.ts.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAEN,IAAI,GAGJ,MAAM,KAAK,CAAC;AACb,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,WAAW,MAAM,0BAA0B,CAAC;AAEnD;;;;;GAKG;AAEI,IAAM,sBAAsB,GAA5B,MAAM,sBAAuB,SAAQ,WAAW;IAAhD;;QASN,gBAAgB;QAEhB,qBAAqB;QAErB;;;WAGG;QAEyC,eAAU,GAAG,KAAK,CAAC;QACnB,aAAQ,GAAG,KAAK,CAAC;QA6D7D,gBAAgB;IACjB,CAAC;IAhFA;;;OAGG;IACI,MAAM,KAAK,MAAM;QACvB,OAAO,CAAC,MAAM,CAAC,CAAC;IACjB,CAAC;IAkBO,YAAY,CAAC,CAAa;QACjC,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QAC/B,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,aAAa,EAAE;YACjD,MAAM,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE;YACnC,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;SACd,CAAC,CAAC,CAAC;IACL,CAAC;IAGO,kBAAkB,CAAC,KAAkB;QAC5C,MAAM,YAAY,GAAQ;YACzB,GAAG,IAAI,CAAC,gBAAgB,CAAC,wBAAwB,CAAC;SAClD,CAAC;QACF,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,YAAY,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;YAC9C,MAAM,MAAM,GAAG,YAAY,CAAC,CAAC,CAAC,CAAC;YAC/B,MAAM,QAAQ,GAAG,MAAM,CAAC,WAAW,IAAI,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,gBAAgB,CAAC;YAC3E,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACf,MAAM,CAAC,UAAU,GAAG,CAAC,CAAC;YACvB,CAAC;QACF,CAAC;IACF,CAAC;IAEM,MAAM;QACZ,OAAO,IAAI,CAAA;;;;yBAIY,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE;gCAC/D,IAAI,CAAC,kBAAkB;;cAEzC,IAAI,CAAC,UAAU;YACzB,CAAC,CAAC,IAAI,CAAA;;;;2BAIiB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,cAAc;2BAC7C,IAAI,CAAC,YAAY;;;gCAGZ,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,YAAY;qCACxC;YACjC,CAAC,CAAC,IAAI;;;;YAIE,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,QAAQ;YACxC,CAAC,CAAC,IAAI,CAAA;;;uBAGa;YACnB,CAAC,CAAC,IAAI;;OAEH,CAAC;IACP,CAAC;CAED,CAAA;AA/D4C;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0DAAoB;AACnB;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wDAAkB;AAGrD;IADP,KAAK,CAAC,uBAAuB,CAAC;6DACS;AAtB5B,sBAAsB;IADlC,aAAa,CAAC,2BAA2B,CAAC;GAC9B,sBAAsB,CAiFlC;;AACD,eAAe,sBAAsB,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2025\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n\tLitElement,\n\thtml,\n\tCSSResultArray,\n\tTemplateResult,\n} from 'lit';\nimport { customElement, query, property } from 'lit/decorators.js';\nimport { styles } from './nile-table-row.css';\nimport NileElement from '../internal/nile-element';\n\n/**\n *nile-table-row component.\n *\n * @tag nile-table-row\n *\n */\n@customElement('nile-table-row-expandable')\nexport class NileTableRowExpandable extends NileElement {\n\t/**\n\t * The styles for TableRow\n\t * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n\t */\n\tpublic static get styles(): CSSResultArray {\n\t\treturn [styles];\n\t}\n\n\t/* #endregion */\n\n\t/* #region Methods */\n\n\t/**\n\t * Render method\n\t * @slot This is a slot test\n\t */\n\n\t@property({ type: Boolean, reflect: true }) expandable = false;\n\t@property({ type: Boolean, reflect: true }) expanded = false;\n\n\t@query('slot[name=\"expanded\"]')\n\tprivate _expandedSlot!: HTMLSlotElement;\n\n\n\tprivate toggleExpand(e: MouseEvent): void {\n\t\tthis.expanded = !this.expanded;\n\t\tthis.dispatchEvent(new CustomEvent('nile-change', {\n\t\t\tdetail: { expanded: this.expanded },\n\t\t\tbubbles: true,\n\t\t\tcomposed: true,\n\t\t}));\n\t}\n\n\n\tprivate handleSortingAlter(event: CustomEvent) {\n\t\tconst header_items: any = [\n\t\t\t...this.querySelectorAll('nile-table-header-item'),\n\t\t];\n\t\tfor (let i = 0; i < header_items.length; i++) {\n\t\t\tconst header = header_items[i];\n\t\t\tconst haveIcon = header.textContent == event.detail.value.curr_sort_string;\n\t\t\tif (!haveIcon) {\n\t\t\t\theader.sorting_ct = 0;\n\t\t\t}\n\t\t}\n\t}\n\n\tpublic render(): TemplateResult {\n\t\treturn html`\n        <div part=\"row-container\" class=\"row-container\">\n          <div\n            part=\"nile-row\"\n            class=\"row ${this.expandable ? 'expandable' : ''} ${this.expanded ? 'expanded' : ''}\"\n            @nile-click-sort=\"${this.handleSortingAlter}\"\n          >\n            ${this.expandable\n\t\t\t\t? html`\n              <slot name=\"expandableIcon\">\n                <nile-icon\n                  class=\"expand-icon\"\n                   name=\"${this.expanded ? 'chevron-up' : 'chevron-down'}\"\n                  @click=${this.toggleExpand}\n                  role=\"button\"\n                  size=\"10\"\n                  aria-label=\"${this.expanded ? 'Collapse row' : 'Expand row'}\">\n                </nile-icon> </slot>`\n\t\t\t\t: null}\n            <slot></slot>\n          </div>\n  \n          ${this.expandable && this.expanded\n\t\t\t\t? html`\n                <div class=\"expanded-content\">\n                  <slot name=\"expanded\"></slot>\n                </div>`\n\t\t\t\t: null}\n        </div>\n      `;\n\t}\n\t/* #endregion */\n}\nexport default NileTableRowExpandable;\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'nile-table-row-expandable-sdf': NileTableRowExpandable;\n\t}\n}\n"]}

package/dist/src/nile-table-row/nile-table-row-expandable.d.ts

@@ -0,0 +1,37 @@
+/**
+ * Copyright Aquera Inc 2025
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { CSSResultArray, TemplateResult } from 'lit';
+import NileElement from '../internal/nile-element';
+/**
+ *nile-table-row component.
+ *
+ * @tag nile-table-row
+ *
+ */
+export declare class NileTableRowExpandable extends NileElement {
+    /**
+     * The styles for TableRow
+     * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
+     */
+    static get styles(): CSSResultArray;
+    /**
+     * Render method
+     * @slot This is a slot test
+     */
+    expandable: boolean;
+    expanded: boolean;
+    private _expandedSlot;
+    private toggleExpand;
+    private handleSortingAlter;
+    render(): TemplateResult;
+}
+export default NileTableRowExpandable;
+declare global {
+    interface HTMLElementTagNameMap {
+        'nile-table-row-expandable-sdf': NileTableRowExpandable;
+    }
+}

package/dist/src/nile-table-row/nile-table-row-expandable.js

@@ -0,0 +1,105 @@
+/**
+ * Copyright Aquera Inc 2025
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { __decorate } from "tslib";
+import { html, } from 'lit';
+import { customElement, query, property } from 'lit/decorators.js';
+import { styles } from './nile-table-row.css';
+import NileElement from '../internal/nile-element';
+/**
+ *nile-table-row component.
+ *
+ * @tag nile-table-row
+ *
+ */
+let NileTableRowExpandable = class NileTableRowExpandable extends NileElement {
+    constructor() {
+        super(...arguments);
+        /* #endregion */
+        /* #region Methods */
+        /**
+         * Render method
+         * @slot This is a slot test
+         */
+        this.expandable = false;
+        this.expanded = false;
+        /* #endregion */
+    }
+    /**
+     * The styles for TableRow
+     * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
+     */
+    static get styles() {
+        return [styles];
+    }
+    toggleExpand(e) {
+        this.expanded = !this.expanded;
+        this.dispatchEvent(new CustomEvent('nile-change', {
+            detail: { expanded: this.expanded },
+            bubbles: true,
+            composed: true,
+        }));
+    }
+    handleSortingAlter(event) {
+        const header_items = [
+            ...this.querySelectorAll('nile-table-header-item'),
+        ];
+        for (let i = 0; i < header_items.length; i++) {
+            const header = header_items[i];
+            const haveIcon = header.textContent == event.detail.value.curr_sort_string;
+            if (!haveIcon) {
+                header.sorting_ct = 0;
+            }
+        }
+    }
+    render() {
+        return html `
+        <div part="row-container" class="row-container">
+          <div
+            part="nile-row"
+            class="row ${this.expandable ? 'expandable' : ''} ${this.expanded ? 'expanded' : ''}"
+            @nile-click-sort="${this.handleSortingAlter}"
+          >
+            ${this.expandable
+            ? html `
+              <slot name="expandableIcon">
+                <nile-icon
+                  class="expand-icon"
+                   name="${this.expanded ? 'chevron-up' : 'chevron-down'}"
+                  @click=${this.toggleExpand}
+                  role="button"
+                  size="10"
+                  aria-label="${this.expanded ? 'Collapse row' : 'Expand row'}">
+                </nile-icon> </slot>`
+            : null}
+            <slot></slot>
+          </div>
+  
+          ${this.expandable && this.expanded
+            ? html `
+                <div class="expanded-content">
+                  <slot name="expanded"></slot>
+                </div>`
+            : null}
+        </div>
+      `;
+    }
+};
+__decorate([
+    property({ type: Boolean, reflect: true })
+], NileTableRowExpandable.prototype, "expandable", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], NileTableRowExpandable.prototype, "expanded", void 0);
+__decorate([
+    query('slot[name="expanded"]')
+], NileTableRowExpandable.prototype, "_expandedSlot", void 0);
+NileTableRowExpandable = __decorate([
+    customElement('nile-table-row-expandable')
+], NileTableRowExpandable);
+export { NileTableRowExpandable };
+export default NileTableRowExpandable;
+//# sourceMappingURL=nile-table-row-expandable.js.map

package/dist/src/nile-table-row/nile-table-row-expandable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-table-row-expandable.js","sourceRoot":"","sources":["../../../src/nile-table-row/nile-table-row-expandable.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAEN,IAAI,GAGJ,MAAM,KAAK,CAAC;AACb,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,WAAW,MAAM,0BAA0B,CAAC;AAEnD;;;;;GAKG;AAEI,IAAM,sBAAsB,GAA5B,MAAM,sBAAuB,SAAQ,WAAW;IAAhD;;QASN,gBAAgB;QAEhB,qBAAqB;QAErB;;;WAGG;QAEyC,eAAU,GAAG,KAAK,CAAC;QACnB,aAAQ,GAAG,KAAK,CAAC;QA6D7D,gBAAgB;IACjB,CAAC;IAhFA;;;OAGG;IACI,MAAM,KAAK,MAAM;QACvB,OAAO,CAAC,MAAM,CAAC,CAAC;IACjB,CAAC;IAkBO,YAAY,CAAC,CAAa;QACjC,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QAC/B,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,aAAa,EAAE;YACjD,MAAM,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE;YACnC,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;SACd,CAAC,CAAC,CAAC;IACL,CAAC;IAGO,kBAAkB,CAAC,KAAkB;QAC5C,MAAM,YAAY,GAAQ;YACzB,GAAG,IAAI,CAAC,gBAAgB,CAAC,wBAAwB,CAAC;SAClD,CAAC;QACF,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,YAAY,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;YAC9C,MAAM,MAAM,GAAG,YAAY,CAAC,CAAC,CAAC,CAAC;YAC/B,MAAM,QAAQ,GAAG,MAAM,CAAC,WAAW,IAAI,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,gBAAgB,CAAC;YAC3E,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACf,MAAM,CAAC,UAAU,GAAG,CAAC,CAAC;YACvB,CAAC;QACF,CAAC;IACF,CAAC;IAEM,MAAM;QACZ,OAAO,IAAI,CAAA;;;;yBAIY,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE;gCAC/D,IAAI,CAAC,kBAAkB;;cAEzC,IAAI,CAAC,UAAU;YACzB,CAAC,CAAC,IAAI,CAAA;;;;2BAIiB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,cAAc;2BAC7C,IAAI,CAAC,YAAY;;;gCAGZ,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,YAAY;qCACxC;YACjC,CAAC,CAAC,IAAI;;;;YAIE,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,QAAQ;YACxC,CAAC,CAAC,IAAI,CAAA;;;uBAGa;YACnB,CAAC,CAAC,IAAI;;OAEH,CAAC;IACP,CAAC;CAED,CAAA;AA/D4C;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0DAAoB;AACnB;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wDAAkB;AAGrD;IADP,KAAK,CAAC,uBAAuB,CAAC;6DACS;AAtB5B,sBAAsB;IADlC,aAAa,CAAC,2BAA2B,CAAC;GAC9B,sBAAsB,CAiFlC;;AACD,eAAe,sBAAsB,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2025\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n\tLitElement,\n\thtml,\n\tCSSResultArray,\n\tTemplateResult,\n} from 'lit';\nimport { customElement, query, property } from 'lit/decorators.js';\nimport { styles } from './nile-table-row.css';\nimport NileElement from '../internal/nile-element';\n\n/**\n *nile-table-row component.\n *\n * @tag nile-table-row\n *\n */\n@customElement('nile-table-row-expandable')\nexport class NileTableRowExpandable extends NileElement {\n\t/**\n\t * The styles for TableRow\n\t * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n\t */\n\tpublic static get styles(): CSSResultArray {\n\t\treturn [styles];\n\t}\n\n\t/* #endregion */\n\n\t/* #region Methods */\n\n\t/**\n\t * Render method\n\t * @slot This is a slot test\n\t */\n\n\t@property({ type: Boolean, reflect: true }) expandable = false;\n\t@property({ type: Boolean, reflect: true }) expanded = false;\n\n\t@query('slot[name=\"expanded\"]')\n\tprivate _expandedSlot!: HTMLSlotElement;\n\n\n\tprivate toggleExpand(e: MouseEvent): void {\n\t\tthis.expanded = !this.expanded;\n\t\tthis.dispatchEvent(new CustomEvent('nile-change', {\n\t\t\tdetail: { expanded: this.expanded },\n\t\t\tbubbles: true,\n\t\t\tcomposed: true,\n\t\t}));\n\t}\n\n\n\tprivate handleSortingAlter(event: CustomEvent) {\n\t\tconst header_items: any = [\n\t\t\t...this.querySelectorAll('nile-table-header-item'),\n\t\t];\n\t\tfor (let i = 0; i < header_items.length; i++) {\n\t\t\tconst header = header_items[i];\n\t\t\tconst haveIcon = header.textContent == event.detail.value.curr_sort_string;\n\t\t\tif (!haveIcon) {\n\t\t\t\theader.sorting_ct = 0;\n\t\t\t}\n\t\t}\n\t}\n\n\tpublic render(): TemplateResult {\n\t\treturn html`\n        <div part=\"row-container\" class=\"row-container\">\n          <div\n            part=\"nile-row\"\n            class=\"row ${this.expandable ? 'expandable' : ''} ${this.expanded ? 'expanded' : ''}\"\n            @nile-click-sort=\"${this.handleSortingAlter}\"\n          >\n            ${this.expandable\n\t\t\t\t? html`\n              <slot name=\"expandableIcon\">\n                <nile-icon\n                  class=\"expand-icon\"\n                   name=\"${this.expanded ? 'chevron-up' : 'chevron-down'}\"\n                  @click=${this.toggleExpand}\n                  role=\"button\"\n                  size=\"10\"\n                  aria-label=\"${this.expanded ? 'Collapse row' : 'Expand row'}\">\n                </nile-icon> </slot>`\n\t\t\t\t: null}\n            <slot></slot>\n          </div>\n  \n          ${this.expandable && this.expanded\n\t\t\t\t? html`\n                <div class=\"expanded-content\">\n                  <slot name=\"expanded\"></slot>\n                </div>`\n\t\t\t\t: null}\n        </div>\n      `;\n\t}\n\t/* #endregion */\n}\nexport default NileTableRowExpandable;\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'nile-table-row-expandable-sdf': NileTableRowExpandable;\n\t}\n}\n"]}

package/dist/src/nile-table-row/nile-table-row.css.js

@@ -25,6 +25,53 @@ export const styles = css `
   nile-table-row > slot::slotted(nile-table-cell-item:first-child) {
     color: red;
   }
+
+.row-container {
+  /* display: flex; */
+  /* flex-direction: column; */
+  /* overflow: hidden; */
+  /* contain: layout style; */
+}
+
+.row {
+  cursor: default;
+  position: relative;       
+  display: flex;
+  align-items: center;
+}
+
+.row.expandable {
+  border-bottom: 1px solid var(--nile-table-row-border-color);
+  /* overflow: hidden; */
+  /* contain: layout style; */
+}
+
+.expanded-content {
+  transition: max-height 0.3s ease;
+}
+
+.row.expandable {
+  margin-right: 4px;
+}
+ 
+.row ::slotted(nile-table-cell-item),
+.row ::slotted(nile-table-header-item) {
+  width: 100%;
+  box-sizing: border-box; 
+}
+
+.row ::slotted([slot="expandable-icon"]), slot[name="expandable-icon"] > nile-icon {
+  cursor: pointer;
+  position: absolute;
+  left: 0.40em;            
+  top: 50%;
+  transform: translateY(-50%);
+  cursor: pointer;
+  font-size: 1em;
+  line-height: 1;
+  user-select: none;
+  z-index: 2;
+}
 `;
 export default [styles];
 //# sourceMappingURL=nile-table-row.css.js.map

package/dist/src/nile-table-row/nile-table-row.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-table-row.css.js","sourceRoot":"","sources":["../../../src/nile-table-row/nile-table-row.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;CAiBxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit';\n\n/**\n * TableRow CSS\n */\nexport const styles = css`\n  :host {\n    display: table-row;\n    width: 100%;\n    height: 100%;\n    height: max-content;\n    --nile-header-background: var(--nile-table-header-background-color);\n    border-bottom: 1px solid var(--nile-table-row-border-color);\n  }\n\n  slot::slotted(nile-table-header-item) {\n    background-color: var(--nile-header-background);\n  }\n\n  nile-table-row > slot::slotted(nile-table-cell-item:first-child) {\n    color: red;\n  }\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-table-row.css.js","sourceRoot":"","sources":["../../../src/nile-table-row/nile-table-row.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgExB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit';\n\n/**\n * TableRow CSS\n */\nexport const styles = css`\n  :host {\n    display: table-row;\n    width: 100%;\n    height: 100%;\n    height: max-content;\n    --nile-header-background: var(--nile-table-header-background-color);\n    border-bottom: 1px solid var(--nile-table-row-border-color);\n  }\n\n  slot::slotted(nile-table-header-item) {\n    background-color: var(--nile-header-background);\n  }\n\n  nile-table-row > slot::slotted(nile-table-cell-item:first-child) {\n    color: red;\n  }\n\n.row-container {\n  /* display: flex; */\n  /* flex-direction: column; */\n  /* overflow: hidden; */\n  /* contain: layout style; */\n}\n\n.row {\n  cursor: default;\n  position: relative;       \n  display: flex;\n  align-items: center;\n}\n\n.row.expandable {\n  border-bottom: 1px solid var(--nile-table-row-border-color);\n  /* overflow: hidden; */\n  /* contain: layout style; */\n}\n\n.expanded-content {\n  transition: max-height 0.3s ease;\n}\n\n.row.expandable {\n  margin-right: 4px;\n}\n \n.row ::slotted(nile-table-cell-item),\n.row ::slotted(nile-table-header-item) {\n  width: 100%;\n  box-sizing: border-box; \n}\n\n.row ::slotted([slot=\"expandable-icon\"]), slot[name=\"expandable-icon\"] > nile-icon {\n  cursor: pointer;\n  position: absolute;\n  left: 0.40em;            \n  top: 50%;\n  transform: translateY(-50%);\n  cursor: pointer;\n  font-size: 1em;\n  line-height: 1;\n  user-select: none;\n  z-index: 2;\n}\n`;\n\nexport default [styles];\n"]}

package/dist/src/nile-table-row/nile-table-row.d.ts

@@ -4,7 +4,7 @@
  * This source code is licensed under the BSD-3-Clause license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import { CSSResultArray, TemplateResult } from 'lit';
+import { CSSResultArray, TemplateResult, PropertyValues } from 'lit';
 import NileElement from '../internal/nile-element';
 /**
  *nile-table-row component.
@@ -18,11 +18,20 @@ export declare class NileTableRow extends NileElement {
      * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
      */
     static get styles(): CSSResultArray;
+    expandable: boolean;
+    expanded: boolean;
+    private _expandedSlot;
+    private _iconSlot;
+    private tableBodyHasExpandable;
+    private _fallbackIcon?;
+    private toggleExpand;
     /**
      * Render method
      * @slot This is a slot test
      */
+    protected firstUpdated(): void;
     private handleSortingAlter;
+    protected updated(changedProperties: PropertyValues): void;
     render(): TemplateResult;
 }
 export default NileTableRow;