@wavelengthusaf/web-components 1.18.0 → 1.19.0

package/dist/cjs/index.d.cts

@@ -1388,20 +1388,43 @@ declare class WavelengthNavBar extends HTMLElement {
     private renderTabs;
 }
 
-interface ChildDataTableData {
-    id: string;
-    [key: string]: any;
-    dropdown?: HTMLElement | string | any;
-}
-
 interface ChildDataTableColumn {
+    /** The unique key that maps to a property in the Data object. */
     key: string;
+    /** The human-readable text displayed in the table header. */
     title: string;
-    renderCell?: (item: ChildDataTableData) => string;
-    cellLocation?: "bottom" | "top" | "relative";
+    /** * Optional custom render function.
+     * Now supports returning strings (rendered as text), HTMLElements, or React Nodes.
+     */
+    renderCell?: (item: any) => string | HTMLElement | any;
+    /** * Controls the layout position of the cell within the row.
+     * @default "relative"
+     */
+    cellLocation?: "top" | "bottom" | "relative";
+    /** * Whether or not the column is sortable.
+     * @default true
+     */
     sort?: boolean;
 }
 
+interface ChildDataTableData {
+    /** * A required unique identifier for the row.
+     * Used internally for event delegation and tracking dropdown state.
+     */
+    id: number | string;
+    /**
+     * Optional content for an expandable dropdown row.
+     * Can be a plain string, a native DOM element, or a React component.
+     */
+    dropdown?: string | HTMLElement | any;
+    /**
+     * Index signature: Allows the object to contain any number of dynamic
+     * properties (e.g., mission, status, launchDate) that map to your column keys.
+     */
+    [key: string]: any;
+}
+
+type DropdownArrowLocation = "left" | "right" | "bottom";
 declare class ChildDataTable extends HTMLElement {
     static get observedAttributes(): string[];
     private _columns;
@@ -1409,23 +1432,37 @@ declare class ChildDataTable extends HTMLElement {
     private _sortOrder;
     private _sortKey;
     private _dropdownArrowLocation;
+    private _expanded;
     private _sortIcon;
     private _dropdownButtonIcon;
+    private _externalSort;
     private shadow;
     constructor();
     connectedCallback(): void;
-    attributeChangedCallback(name: string, oldValue: any, newValue: any): void;
-    renderColumns(newValue: string | ChildDataTableColumn[]): void;
-    renderRows(newValue: any): void;
+    attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
+    private normalizeColumns;
+    private renderHeader;
+    private buildHeaderContent;
+    private createHeaderCell;
+    private shouldRenderSort;
+    private createSortButton;
+    private createSpacerCell;
+    renderRows(newValue: string | ChildDataTableData[]): void;
+    private buildRow;
+    private createDataCell;
+    private createDropdownButtonCell;
+    private createDropdownContentRow;
     handleDropdownClick(): void;
     handleSortClick(): void;
     handleActionClick(): void;
     handleSort(sortKey: keyof ChildDataTableData): void;
-    set setColumns(columns: ChildDataTableColumn[]);
-    set setData(data: ChildDataTableData[]);
-    set setDropdownArrowLocation(location: typeof this._dropdownArrowLocation);
-    set setSortIcon(icon: typeof this._sortIcon);
-    set setDropdownButtonIcon(icon: typeof this._sortIcon);
+    set setColumns(columns: string | ChildDataTableColumn[]);
+    set setData(data: string | ChildDataTableData[]);
+    set setDropdownArrowLocation(location: DropdownArrowLocation);
+    set setExpanded(value: string | boolean);
+    set setSortIcon(icon: string | HTMLElement);
+    set setDropdownButtonIcon(icon: string | HTMLElement);
+    set setExternalSort(value: string | boolean);
 }
 
 interface CheckboxElements {

package/dist/esm/index.d.ts

@@ -1388,20 +1388,43 @@ declare class WavelengthNavBar extends HTMLElement {
     private renderTabs;
 }
 
-interface ChildDataTableData {
-    id: string;
-    [key: string]: any;
-    dropdown?: HTMLElement | string | any;
-}
-
 interface ChildDataTableColumn {
+    /** The unique key that maps to a property in the Data object. */
     key: string;
+    /** The human-readable text displayed in the table header. */
     title: string;
-    renderCell?: (item: ChildDataTableData) => string;
-    cellLocation?: "bottom" | "top" | "relative";
+    /** * Optional custom render function.
+     * Now supports returning strings (rendered as text), HTMLElements, or React Nodes.
+     */
+    renderCell?: (item: any) => string | HTMLElement | any;
+    /** * Controls the layout position of the cell within the row.
+     * @default "relative"
+     */
+    cellLocation?: "top" | "bottom" | "relative";
+    /** * Whether or not the column is sortable.
+     * @default true
+     */
     sort?: boolean;
 }
 
+interface ChildDataTableData {
+    /** * A required unique identifier for the row.
+     * Used internally for event delegation and tracking dropdown state.
+     */
+    id: number | string;
+    /**
+     * Optional content for an expandable dropdown row.
+     * Can be a plain string, a native DOM element, or a React component.
+     */
+    dropdown?: string | HTMLElement | any;
+    /**
+     * Index signature: Allows the object to contain any number of dynamic
+     * properties (e.g., mission, status, launchDate) that map to your column keys.
+     */
+    [key: string]: any;
+}
+
+type DropdownArrowLocation = "left" | "right" | "bottom";
 declare class ChildDataTable extends HTMLElement {
     static get observedAttributes(): string[];
     private _columns;
@@ -1409,23 +1432,37 @@ declare class ChildDataTable extends HTMLElement {
     private _sortOrder;
     private _sortKey;
     private _dropdownArrowLocation;
+    private _expanded;
     private _sortIcon;
     private _dropdownButtonIcon;
+    private _externalSort;
     private shadow;
     constructor();
     connectedCallback(): void;
-    attributeChangedCallback(name: string, oldValue: any, newValue: any): void;
-    renderColumns(newValue: string | ChildDataTableColumn[]): void;
-    renderRows(newValue: any): void;
+    attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
+    private normalizeColumns;
+    private renderHeader;
+    private buildHeaderContent;
+    private createHeaderCell;
+    private shouldRenderSort;
+    private createSortButton;
+    private createSpacerCell;
+    renderRows(newValue: string | ChildDataTableData[]): void;
+    private buildRow;
+    private createDataCell;
+    private createDropdownButtonCell;
+    private createDropdownContentRow;
     handleDropdownClick(): void;
     handleSortClick(): void;
     handleActionClick(): void;
     handleSort(sortKey: keyof ChildDataTableData): void;
-    set setColumns(columns: ChildDataTableColumn[]);
-    set setData(data: ChildDataTableData[]);
-    set setDropdownArrowLocation(location: typeof this._dropdownArrowLocation);
-    set setSortIcon(icon: typeof this._sortIcon);
-    set setDropdownButtonIcon(icon: typeof this._sortIcon);
+    set setColumns(columns: string | ChildDataTableColumn[]);
+    set setData(data: string | ChildDataTableData[]);
+    set setDropdownArrowLocation(location: DropdownArrowLocation);
+    set setExpanded(value: string | boolean);
+    set setSortIcon(icon: string | HTMLElement);
+    set setDropdownButtonIcon(icon: string | HTMLElement);
+    set setExternalSort(value: string | boolean);
 }
 
 interface CheckboxElements {