@carbon/ai-chat-components 0.5.0 → 0.6.0-rc.0

package/es/components/reasoning-steps/src/cds-aichat-reasoning-step.js

@@ -0,0 +1,231 @@
+/**
+ * Copyright IBM Corp. 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { __decorate } from 'tslib';
+import { LitElement, html } from 'lit';
+import { classMap } from 'lit/directives/class-map.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
+import { property, state } from 'lit/decorators.js';
+import { iconLoader } from '@carbon/web-components/es/globals/internal/icon-loader.js';
+import ChevronRight16 from '@carbon/icons/es/chevron--right/16.js';
+import styles from './cds-aichat-reasoning-step.scss.js';
+import prefix from '../../../globals/settings.js';
+import { carbonElement } from '../../../globals/decorators/carbon-element.js';
+
+/*
+ *  Copyright IBM Corp. 2025
+ *
+ *  This source code is licensed under the Apache-2.0 license found in the
+ *  LICENSE file in the root directory of this source tree.
+ *
+ *  @license
+ */
+const baseClass = `${prefix}--reasoning-step`;
+let idCounter = 0;
+const generateId = (segment) => `${baseClass}-${segment}-${idCounter++}`;
+let CDSAIChatReasoningStep = class CDSAIChatReasoningStep extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.title = "";
+        this.open = false;
+        this.controlled = false;
+        this.hasBodyContent = false;
+        this.headerId = generateId("header");
+        this.contentId = generateId("content");
+    }
+    connectedCallback() {
+        if (!this.hasAttribute("role")) {
+            this.setAttribute("role", "listitem");
+        }
+        super.connectedCallback();
+        this.evaluateBodyContent();
+    }
+    firstUpdated() {
+        const slot = this.shadowRoot?.querySelector("slot:not([name])");
+        const nodes = slot?.assignedNodes({ flatten: true });
+        if (nodes) {
+            this.evaluateBodyContent(nodes);
+        }
+    }
+    get componentConstructor() {
+        return this.constructor;
+    }
+    getTriggerElement() {
+        if (!this.shadowRoot) {
+            return null;
+        }
+        return this.shadowRoot.querySelector(`.${baseClass}__trigger`);
+    }
+    get eventInit() {
+        return {
+            bubbles: true,
+            cancelable: true,
+            composed: true,
+        };
+    }
+    evaluateBodyContent(nodes) {
+        const nodesToInspect = nodes ?? Array.from(this.childNodes);
+        const hasContent = nodesToInspect.some((node) => this.isBodyNode(node));
+        if (hasContent !== this.hasBodyContent) {
+            this.hasBodyContent = hasContent;
+            if (!hasContent && this.open && !this.controlled) {
+                this.open = false;
+            }
+        }
+    }
+    isBodyNode(node) {
+        if (node.nodeType === Node.ELEMENT_NODE) {
+            const element = node;
+            const slotName = element.getAttribute("slot");
+            return !slotName;
+        }
+        if (node.nodeType === Node.TEXT_NODE) {
+            return Boolean(node.textContent?.trim());
+        }
+        return false;
+    }
+    handleBodySlotChange(event) {
+        const slot = event.target;
+        const nodes = slot.assignedNodes({ flatten: true });
+        this.evaluateBodyContent(nodes);
+    }
+    handleToggleRequest(nextState = !this.open) {
+        const detail = { open: nextState };
+        const init = { ...this.eventInit, detail };
+        const canToggle = this.dispatchEvent(new CustomEvent(this.componentConstructor.eventBeforeToggle, init));
+        if (!canToggle) {
+            return;
+        }
+        if (!this.controlled) {
+            this.open = nextState;
+        }
+        this.dispatchEvent(new CustomEvent(this.componentConstructor.eventToggle, init));
+    }
+    handleButtonClick() {
+        this.handleToggleRequest(!this.open);
+    }
+    handleButtonKeydown(event) {
+        if (!this.open) {
+            return;
+        }
+        if (event.key === "Escape" || event.key === "Esc") {
+            event.stopPropagation();
+            this.handleToggleRequest(false);
+        }
+    }
+    focus(options) {
+        const trigger = this.getTriggerElement();
+        if (trigger) {
+            trigger.focus(options);
+            return;
+        }
+        super.focus(options);
+    }
+    static get eventBeforeToggle() {
+        return `${prefix}-reasoning-step-beingtoggled`;
+    }
+    static get eventToggle() {
+        return `${prefix}-reasoning-step-toggled`;
+    }
+    renderInteractiveHeader() {
+        return html `
+      <button
+        id=${this.headerId}
+        type="button"
+        part="expando"
+        class="${baseClass}__trigger"
+        aria-expanded="${String(this.open)}"
+        aria-controls="${this.contentId}"
+        @click=${this.handleButtonClick}
+        @keydown=${this.handleButtonKeydown}
+      >
+        <span class="${baseClass}__icon" part="expando-icon" aria-hidden="true">
+          ${iconLoader(ChevronRight16)}
+        </span>
+        <div class="${baseClass}__title" part="title">
+          <slot name="title">${this.title}</slot>
+        </div>
+      </button>
+    `;
+    }
+    renderStaticHeader() {
+        return html `
+      <div class="${baseClass}__static" id=${this.headerId}>
+        <span class="${baseClass}__static-icon" aria-hidden="true"
+          >&mdash;</span
+        >
+        <div class="${baseClass}__title" part="title">
+          <slot name="title">${this.title}</slot>
+        </div>
+      </div>
+    `;
+    }
+    renderPanel() {
+        const isHidden = !this.hasBodyContent;
+        const panelClasses = classMap({
+            [`${baseClass}__panel`]: true,
+            [`${baseClass}__panel--hidden`]: isHidden,
+        });
+        return html `
+      <div
+        id=${this.contentId}
+        class=${panelClasses}
+        part="wrapper"
+        aria-hidden="${this.open && !isHidden ? "false" : "true"}"
+        role=${ifDefined(!isHidden ? "region" : undefined)}
+        aria-labelledby=${ifDefined(!isHidden ? this.headerId : undefined)}
+        ?hidden=${isHidden}
+      >
+        <div
+          class="${baseClass}__panel-body"
+          part="content"
+          data-visible="${this.open && !isHidden}"
+        >
+          <slot
+            @slotchange=${this.handleBodySlotChange}
+            ?hidden=${isHidden}
+          ></slot>
+        </div>
+      </div>
+    `;
+    }
+    render() {
+        const classes = classMap({
+            [baseClass]: true,
+            [`${baseClass}--open`]: this.open && this.hasBodyContent,
+            [`${baseClass}--static`]: !this.hasBodyContent,
+        });
+        return html `
+      <div class=${classes}>
+        ${this.hasBodyContent
+            ? this.renderInteractiveHeader()
+            : this.renderStaticHeader()}
+        ${this.renderPanel()}
+      </div>
+    `;
+    }
+};
+CDSAIChatReasoningStep.styles = styles;
+__decorate([
+    property({ type: String })
+], CDSAIChatReasoningStep.prototype, "title", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], CDSAIChatReasoningStep.prototype, "open", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], CDSAIChatReasoningStep.prototype, "controlled", void 0);
+__decorate([
+    state()
+], CDSAIChatReasoningStep.prototype, "hasBodyContent", void 0);
+CDSAIChatReasoningStep = __decorate([
+    carbonElement(`${prefix}-reasoning-step`)
+], CDSAIChatReasoningStep);
+var CDSAIChatReasoningStep$1 = CDSAIChatReasoningStep;
+
+export { CDSAIChatReasoningStep$1 as default };
+//# sourceMappingURL=cds-aichat-reasoning-step.js.map

package/es/components/reasoning-steps/src/cds-aichat-reasoning-step.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cds-aichat-reasoning-step.js","sources":["../../../../src/components/reasoning-steps/src/cds-aichat-reasoning-step.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}

package/es/components/reasoning-steps/src/cds-aichat-reasoning-step.scss.js

@@ -0,0 +1,13 @@
+/**
+ * Copyright IBM Corp. 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { css } from 'lit';
+
+var styles = css([":host{background-color:transparent;border:0;border-radius:0;color:var(--cds-text-helper,#6f6f6f);display:block}:host([hidden]){display:none}.cds-aichat--reasoning-step{inline-size:100%}.cds-aichat--reasoning-step__trigger{align-items:center;background:transparent;border:0;color:var(--cds-text-helper,#6f6f6f);cursor:pointer;display:flex;font:inherit;gap:.25rem;inline-size:100%;padding:0;text-align:start}.cds-aichat--reasoning-step__trigger:focus-visible{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:2px}.cds-aichat--reasoning-step__icon{align-items:center;block-size:1rem;display:inline-flex;inline-size:1rem;justify-content:center;transition:transform .24s cubic-bezier(.2,0,.38,.9)}.cds-aichat--reasoning-step__icon svg{fill:currentColor;block-size:100%;inline-size:100%}:host([open]) .cds-aichat--reasoning-step__icon{transform:rotate(90deg)}.cds-aichat--reasoning-step__title{color:var(--cds-text-helper,#6f6f6f);flex:1;font-size:var(--cds-heading-01-font-size,.875rem);font-weight:var(--cds-heading-01-font-weight,600);letter-spacing:var(--cds-heading-01-letter-spacing,.16px);line-height:var(--cds-heading-01-line-height,1.42857)}.cds-aichat--reasoning-step__static{align-items:center;display:flex;gap:.25rem}.cds-aichat--reasoning-step__static-icon{align-items:center;block-size:1rem;display:inline-flex;inline-size:1rem;justify-content:center}.cds-aichat--reasoning-step__static-icon svg{fill:currentColor;block-size:100%;inline-size:100%}.cds-aichat--reasoning-step__panel{display:grid;grid-template-rows:0fr;opacity:0;padding-block-end:0;padding-block-start:0;padding-inline:1.25rem;pointer-events:none;transition:grid-template-rows .11s cubic-bezier(0,0,.38,.9),opacity .11s cubic-bezier(0,0,.38,.9),padding-block-end .11s cubic-bezier(0,0,.38,.9)}.cds-aichat--reasoning-step__panel[hidden]{display:none}:host([open]) .cds-aichat--reasoning-step__panel{grid-template-rows:1fr;opacity:1;padding-block-end:.25rem;padding-block-start:.125rem;pointer-events:auto}.cds-aichat--reasoning-step__panel-body{min-block-size:0;overflow:hidden}"]);
+
+export { styles as default };
+//# sourceMappingURL=cds-aichat-reasoning-step.scss.js.map

package/es/components/reasoning-steps/src/cds-aichat-reasoning-step.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cds-aichat-reasoning-step.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;"}

package/es/components/reasoning-steps/src/cds-aichat-reasoning-steps.d.ts

@@ -0,0 +1,13 @@
+import { LitElement } from "lit";
+declare class CDSAIChatReasoningSteps extends LitElement {
+    static styles: any;
+    open: boolean;
+    controlled: boolean;
+    connectedCallback(): void;
+    updated(changedProperties: Map<PropertyKey, unknown>): void;
+    get steps(): NodeListOf<HTMLElement>;
+    propagateControlled(): void;
+    markLastVisibleStep(): void;
+    render(): import("lit-html").TemplateResult<1>;
+}
+export default CDSAIChatReasoningSteps;

package/es/components/reasoning-steps/src/cds-aichat-reasoning-steps.js

@@ -0,0 +1,96 @@
+/**
+ * Copyright IBM Corp. 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { __decorate } from 'tslib';
+import { LitElement, html } from 'lit';
+import { property } from 'lit/decorators.js';
+import styles from './cds-aichat-reasoning-steps.scss.js';
+import prefix from '../../../globals/settings.js';
+import { carbonElement } from '../../../globals/decorators/carbon-element.js';
+
+/*
+ *  Copyright IBM Corp. 2025
+ *
+ *  This source code is licensed under the Apache-2.0 license found in the
+ *  LICENSE file in the root directory of this source tree.
+ *
+ *  @license
+ */
+const baseClass = `${prefix}--reasoning-steps`;
+const stepSelector = `${prefix}-reasoning-step`;
+let CDSAIChatReasoningSteps = class CDSAIChatReasoningSteps extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.open = false;
+        this.controlled = false;
+    }
+    connectedCallback() {
+        if (!this.hasAttribute("role")) {
+            this.setAttribute("role", "list");
+        }
+        super.connectedCallback();
+    }
+    updated(changedProperties) {
+        if (changedProperties.has("controlled")) {
+            this.propagateControlled();
+        }
+        this.markLastVisibleStep();
+    }
+    get steps() {
+        return this.querySelectorAll(stepSelector);
+    }
+    propagateControlled() {
+        this.steps.forEach((step) => {
+            if (this.controlled) {
+                step.setAttribute("data-parent-controlled", "");
+                step.setAttribute("controlled", "");
+            }
+            else if (step.hasAttribute("data-parent-controlled")) {
+                step.removeAttribute("data-parent-controlled");
+                step.removeAttribute("controlled");
+            }
+        });
+    }
+    markLastVisibleStep() {
+        const steps = Array.from(this.steps);
+        steps.forEach((step) => {
+            step.removeAttribute("data-last-item");
+        });
+        const lastVisible = steps.reverse().find((step) => !step.hidden);
+        if (lastVisible) {
+            lastVisible.setAttribute("data-last-item", "");
+        }
+    }
+    render() {
+        return html `
+      <div class=${baseClass}>
+        <div
+          class="${baseClass}__wrapper"
+          aria-hidden=${this.open ? "false" : "true"}
+        >
+          <div class="${baseClass}__body">
+            <slot></slot>
+          </div>
+        </div>
+      </div>
+    `;
+    }
+};
+CDSAIChatReasoningSteps.styles = styles;
+__decorate([
+    property({ type: Boolean, reflect: true })
+], CDSAIChatReasoningSteps.prototype, "open", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], CDSAIChatReasoningSteps.prototype, "controlled", void 0);
+CDSAIChatReasoningSteps = __decorate([
+    carbonElement(`${prefix}-reasoning-steps`)
+], CDSAIChatReasoningSteps);
+var CDSAIChatReasoningSteps$1 = CDSAIChatReasoningSteps;
+
+export { CDSAIChatReasoningSteps$1 as default };
+//# sourceMappingURL=cds-aichat-reasoning-steps.js.map

package/es/components/reasoning-steps/src/cds-aichat-reasoning-steps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cds-aichat-reasoning-steps.js","sources":["../../../../src/components/reasoning-steps/src/cds-aichat-reasoning-steps.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;;;;;;AAAA;;;;;;;AAOG;AAUH,MAAM,SAAS,GAAG,CAAA,EAAG,MAAM,mBAAmB;AAC9C,MAAM,YAAY,GAAG,CAAA,EAAG,MAAM,iBAAiB;AAG/C,IAAM,uBAAuB,GAA7B,MAAM,uBAAwB,SAAQ,UAAU,CAAA;AAAhD,IAAA,WAAA,GAAA;;QAIE,IAAA,CAAA,IAAI,GAAG,KAAK;QAGZ,IAAA,CAAA,UAAU,GAAG,KAAK;IA8DpB;IA5DE,iBAAiB,GAAA;QACf,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE;AAC9B,YAAA,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC;QACnC;QAEA,KAAK,CAAC,iBAAiB,EAAE;IAC3B;AAEA,IAAA,OAAO,CAAC,iBAA4C,EAAA;AAClD,QAAA,IAAI,iBAAiB,CAAC,GAAG,CAAC,YAAY,CAAC,EAAE;YACvC,IAAI,CAAC,mBAAmB,EAAE;QAC5B;QAEA,IAAI,CAAC,mBAAmB,EAAE;IAC5B;AAEA,IAAA,IAAI,KAAK,GAAA;AACP,QAAA,OAAO,IAAI,CAAC,gBAAgB,CAAC,YAAY,CAAC;IAC5C;IAEA,mBAAmB,GAAA;QACjB,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;AAC1B,YAAA,IAAI,IAAI,CAAC,UAAU,EAAE;AACnB,gBAAA,IAAI,CAAC,YAAY,CAAC,wBAAwB,EAAE,EAAE,CAAC;AAC/C,gBAAA,IAAI,CAAC,YAAY,CAAC,YAAY,EAAE,EAAE,CAAC;YACrC;AAAO,iBAAA,IAAI,IAAI,CAAC,YAAY,CAAC,wBAAwB,CAAC,EAAE;AACtD,gBAAA,IAAI,CAAC,eAAe,CAAC,wBAAwB,CAAC;AAC9C,gBAAA,IAAI,CAAC,eAAe,CAAC,YAAY,CAAC;YACpC;AACF,QAAA,CAAC,CAAC;IACJ;IAEA,mBAAmB,GAAA;QACjB,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;AAEpC,QAAA,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;AACrB,YAAA,IAAI,CAAC,eAAe,CAAC,gBAAgB,CAAC;AACxC,QAAA,CAAC,CAAC;AAEF,QAAA,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC;QAEhE,IAAI,WAAW,EAAE;AACf,YAAA,WAAW,CAAC,YAAY,CAAC,gBAAgB,EAAE,EAAE,CAAC;QAChD;IACF;IAEA,MAAM,GAAA;AACJ,QAAA,OAAO,IAAI,CAAA;mBACI,SAAS,CAAA;;mBAET,SAAS,CAAA;wBACJ,IAAI,CAAC,IAAI,GAAG,OAAO,GAAG,MAAM;;wBAE5B,SAAS,CAAA;;;;;KAK5B;IACH;;AAnEO,uBAAA,CAAA,MAAM,GAAG,MAAH;AAGb,UAAA,CAAA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAC7B,CAAA,EAAA,uBAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAGb,UAAA,CAAA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AACvB,CAAA,EAAA,uBAAA,CAAA,SAAA,EAAA,YAAA,EAAA,MAAA,CAAA;AAPf,uBAAuB,GAAA,UAAA,CAAA;AAD5B,IAAA,aAAa,CAAC,CAAA,EAAG,MAAM,CAAA,gBAAA,CAAkB;AACpC,CAAA,EAAA,uBAAuB,CAqE5B;AAED,gCAAe,uBAAuB;;;;"}

package/es/components/reasoning-steps/src/cds-aichat-reasoning-steps.scss.js

@@ -0,0 +1,13 @@
+/**
+ * Copyright IBM Corp. 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { css } from 'lit';
+
+var styles = css([":host{display:block;inline-size:100%}.cds-aichat--reasoning-steps__wrapper{display:grid;grid-template-rows:0fr;opacity:0;overflow:hidden;padding-inline-start:0;pointer-events:none;transition:grid-template-rows .11s cubic-bezier(0,0,.38,.9),padding-inline-start .11s cubic-bezier(0,0,.38,.9),opacity .11s cubic-bezier(0,0,.38,.9)}@media screen and (prefers-reduced-motion:reduce){.cds-aichat--reasoning-steps__wrapper{transition:none}}:host([open]) .cds-aichat--reasoning-steps__wrapper{border-inline-start:1px solid var(--cds-border-subtle-02,#e0e0e0);grid-template-rows:1fr;opacity:1;overflow:visible;padding-inline-start:.25rem;pointer-events:auto}.cds-aichat--reasoning-steps__body{display:flex;flex-direction:column;gap:.5rem;min-block-size:0;overflow:hidden;padding-inline-start:.5rem}"]);
+
+export { styles as default };
+//# sourceMappingURL=cds-aichat-reasoning-steps.scss.js.map

package/es/components/reasoning-steps/src/cds-aichat-reasoning-steps.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cds-aichat-reasoning-steps.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;"}

package/es/components/table/index.d.ts

@@ -0,0 +1,3 @@
+import "./src/cds-aichat-table.js";
+export { default, TABLE_COMPONENT_TAG_NAME } from "./src/cds-aichat-table.js";
+export type { TableItemCell, TableItemRow } from "./src/types.js";

package/es/components/table/index.js

@@ -0,0 +1,9 @@
+/**
+ * Copyright IBM Corp. 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+export { TABLE_COMPONENT_TAG_NAME, default } from './src/cds-aichat-table.js';
+//# sourceMappingURL=index.js.map

package/es/components/table/index.js.map

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

package/es/components/table/src/cds-aichat-table.d.ts

@@ -0,0 +1,262 @@
+import { type CDSTableRow } from "@carbon/web-components";
+import { TemplateResult, LitElement, PropertyValues } from "lit";
+export interface TableCellContent {
+    text: string;
+    template?: TemplateResult | null;
+}
+export interface TableRowContent {
+    cells: TableCellContent[];
+}
+interface PageChangeEvent extends Event {
+    detail: {
+        page: number;
+        pageSize: number;
+    };
+}
+interface FilterEvent extends Event {
+    detail: {
+        unfilteredRows: CDSTableRow[];
+    };
+}
+interface TableRowWithIDs extends TableRowContent {
+    id: string;
+}
+declare const TABLE_COMPONENT_TAG_NAME = "cds-aichat-table";
+/**
+ * Class functionality for the Table custom element.
+ */
+declare class TableElement extends LitElement {
+    /**
+     * The optional table title.
+     */
+    tableTitle?: string;
+    /**
+     * The optional table description.
+     */
+    tableDescription?: string;
+    /**
+     * The array of cells for the header.
+     */
+    headers: TableCellContent[];
+    /**
+     * The array of rows. Each row includes an array of cells.
+     */
+    rows: TableRowContent[];
+    /**
+     * Whether or not the table content is loading. If it is then a skeleton state should be shown instead.
+     */
+    loading: boolean;
+    /**
+     * The text used for the filter placeholder.
+     */
+    filterPlaceholderText: string;
+    /**
+     * The text used for the pagination's previous button tooltip.
+     */
+    previousPageText: string;
+    /**
+     * The text used for the pagination's next button tooltip.
+     */
+    nextPageText: string;
+    /**
+     * The text used for the pagination's item pre page text.
+     */
+    itemsPerPageText: string;
+    /**
+     * The locale. Used by the carbon table component to change the collator for sorting.
+     */
+    locale: string;
+    /**
+     * The calculated default page size based on component width.
+     * 10 for width > PAGE_SIZE_WIDTH_THRESHOLD, 5 for width <= PAGE_SIZE_WIDTH_THRESHOLD.
+     */
+    private _defaultPageSize;
+    get defaultPageSize(): number;
+    set defaultPageSize(value: number);
+    /**
+     * The function used to get the supplemental text for the pagination component.
+     */
+    getPaginationSupplementalText?: ({ count }: {
+        count: number;
+    }) => string;
+    /**
+     * The function used to get the status text for the pagination component.
+     */
+    getPaginationStatusText?: ({ start, end, count, }: {
+        start: number;
+        end: number;
+        count: number;
+    }) => string;
+    /**
+     * If the table is valid or not.
+     */
+    protected _isValid: boolean;
+    /**
+     * The current page of the table we're on.
+     */
+    _currentPageNumber: number;
+    /**
+     * How many rows are on each page of the table.
+     */
+    _currentPageSize: number;
+    /**
+     * Whether or not the number of rows per page was changed with the pagination component. If the user used the
+     * pagination controls to show all rows, the pagination component would normally hide itself because the number of is
+     * no longer greater than the page size. However the pagination component needs to persist in this case, since the
+     * user may want to change the page size again. This is used to keep track of whether the pagination controls were
+     * used to change page size, and if they have, it forces pagination component to persist.
+     */
+    _rowsPerPageChanged: boolean;
+    /**
+     * The rows that have not been filtered out.
+     */
+    _filterVisibleRowIDs: Set<string>;
+    /**
+     * All of the rows for the table with IDs.
+     */
+    _rowsWithIDs: TableRowWithIDs[];
+    /**
+     * Whether or not the table should be able to be filtered.
+     */
+    _allowFiltering: boolean;
+    static styles: any;
+    private tableRuntime;
+    private tableRuntimePromise;
+    connectedCallback(): void;
+    /**
+     * Called after the element's DOM has been updated for the first time.
+     * Initializes the table page size.
+     *
+     * @param _changedProperties - Map of properties that changed during the update
+     */
+    protected firstUpdated(_changedProperties: PropertyValues): Promise<void>;
+    /**
+     * Updates the CSS custom property `--cds-chat-table-width` based on the parent element's width.
+     * Also calculates the default page size on first run based on the measured width.
+     * This method is called once during component initialization.
+     *
+     * @private
+     */
+    private _updateDefaultPageSize;
+    /**
+     * Called before the element updates to prepare state changes.
+     * Handles validation and re-initialization of table data when headers or rows change.
+     *
+     * @param changedProperties - Map of properties that changed during the update
+     * @protected
+     */
+    protected willUpdate(changedProperties: PropertyValues<this>): void;
+    /**
+     * Validates the table structure by checking if all rows have the same number of cells as the header.
+     * Sets the internal `_isValid` state to false if any row has a mismatched cell count.
+     *
+     * A valid table requires:
+     * - All rows must have the same number of cells as there are headers
+     * - No rows can have more or fewer cells than the column count
+     *
+     * @private
+     */
+    private _calcIsTableValid;
+    /**
+     * Initializes internal arrays used for table functionality.
+     * Creates a new array of rows with unique IDs and initializes the filter visibility tracking.
+     *
+     * This method:
+     * 1. Resets the `_rowsWithIDs` array and `_filterVisibleRowIDs` set
+     * 2. Assigns string-based IDs to each row for tracking purposes
+     * 3. Marks all rows as initially visible (not filtered out)
+     *
+     * @private
+     */
+    private _initializeRowsArrays;
+    /**
+     * Configures the table's page size and filtering behavior.
+     * Determines whether filtering/searching should be enabled based on the number of rows
+     * relative to the current page size.
+     *
+     * Filtering is enabled when there are more rows than can fit on a single page,
+     * allowing users to search and paginate through large datasets.
+     *
+     * @private
+     */
+    private _setPageSize;
+    private ensureTableRuntime;
+    /**
+     * Handles pagination events from the Carbon pagination component.
+     * Updates the visible rows when the user navigates to a different page.
+     *
+     * Note: This event sometimes fires twice due to a Carbon framework quirk,
+     * but since the page/size values are identical, it doesn't affect functionality.
+     *
+     * @param event - The page change event containing the new page number and size
+     * @public
+     */
+    _handlePageChangeEvent: (event: PageChangeEvent) => void;
+    /**
+     * Handles page size change events from the pagination component.
+     * Updates the current page size and recalculates visible rows.
+     * Marks that the page size has been manually changed by the user.
+     *
+     * @param event - The page size change event containing the new page size
+     * @public
+     */
+    _handlePageSizeChangeEvent: (event: PageChangeEvent) => void;
+    /**
+     * Handles filter and sort events from the Carbon table component.
+     * Updates the set of visible rows based on filtering/sorting results and resets to the first page.
+     *
+     * This event is triggered by:
+     * - Column sorting (clicking on sortable column headers)
+     * - Table filtering (using the search bar)
+     *
+     * @param event - The filter event containing the array of unfiltered rows
+     * @public
+     */
+    _handleFilterEvent: (event: FilterEvent) => void;
+    /**
+     * Controls which table rows are visible based on pagination and filtering.
+     * Uses CSS display properties to show/hide rows rather than DOM manipulation.
+     *
+     * This approach is necessary because Carbon's table component handles its own
+     * sorting and we need to preserve the DOM order it creates. The method:
+     * 1. Hides all rows initially
+     * 2. Filters to only rows that haven't been filtered out
+     * 3. Shows only the rows that belong to the current page
+     *
+     * @param page - The page number to display (1-based)
+     * @param pageSize - Number of rows per page
+     * @private
+     */
+    private _updateVisibleRows;
+    /**
+     * Handles the table download functionality by exporting all table data as a CSV file.
+     *
+     * This custom implementation is necessary because Carbon's default download feature:
+     * - Only exports selected rows (we want all data)
+     * - Only exports as JSON (we want CSV format)
+     * - Doesn't include all the data we need
+     *
+     * The method dynamically imports the CSV stringify library to avoid bundle bloat,
+     * creates a data URL to comply with CSP policies, and triggers a download.
+     *
+     * @public
+     */
+    _handleDownload(): Promise<void>;
+    /**
+     * Renders the table component based on current state and data.
+     *
+     * The render logic follows this priority:
+     * 1. Shows skeleton loading state if `loading` is true
+     * 2. Shows table with pagination if there are more rows than the page size OR pagination was used
+     * 3. Shows table only if all rows fit on one page
+     *
+     * The method also applies the appropriate Carbon theme class (cds--g90 for dark, cds--white for light)
+     * to ensure proper styling based on the `dark` property.
+     *
+     * @returns The lit-html template for the table component
+     * @public
+     */
+    render(): TemplateResult<1>;
+}
+export { TableElement, TABLE_COMPONENT_TAG_NAME };
+export default TableElement;