import { p as proxyCustomElement, H, h } from './p-604af0ee.js';
import { d as defineCustomElement$2 } from './p-1b62d0ae.js';
import { d as defineCustomElement$1 } from './p-888b8e69.js';

var __rest = (undefined && undefined.__rest) || function (s, e) {
    var t = {};
    for (var p in s)
        if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
            t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
const DgaDataTableUpdated = /*@__PURE__*/ proxyCustomElement(class DgaDataTableUpdated extends H {
    constructor() {
        super();
        this.__registerHost();
        this.data = [
            {
                selected: true,
            },
            {
                selected: true,
            },
        ];
        this.rowDivider = true;
        this.showSelectCheckBox = true;
        this.alternate = true;
        this.cells = [
            {
                propertyName: 'test',
                isFilter: false,
                isSort: false,
                title: 'Test',
                type: 'propertyName',
                colSpan: 1,
            },
            {
                propertyName: 'test',
                isFilter: false,
                isSort: false,
                title: 'Test',
                type: 'propertyName',
                colSpan: 1,
            },
        ];
        this.contained = true;
        this.sortedData = [];
        this.direction = false;
        this.sortData = (sortType = 'up', sortingProperty, index) => {
            if (sortType === 'up') {
                const clonedData = [...this.data.sort((a, b) => (b[sortingProperty] > a[sortingProperty] ? 1 : a[sortingProperty] > b[sortingProperty] ? -1 : 0))];
                this.sortedData = clonedData;
            }
            else if (sortType === 'down') {
                const clonedData = [...this.data.sort((a, b) => (a[sortingProperty] > b[sortingProperty] ? 1 : b[sortingProperty] > a[sortingProperty] ? -1 : 0))];
                this.sortedData = clonedData;
            }
            this.cells[index].sort = sortType == 'down' ? 'up' : 'down';
        };
        this.handleSelectedRowChanges = (checked, index) => {
            const cloneData = [...this.data];
            cloneData[index].selected = checked;
            this.sortedData = cloneData;
            if (this.getSelectedRows) {
                this.getSelectedRows({
                    selectedRows: cloneData.filter(item => item.selected),
                    currentSelectedRow: cloneData[index],
                    currentSelectedRowIndex: index,
                });
            }
        };
        this.selectAll = (checked) => {
            const cloneData = [...this.data];
            cloneData.forEach(item => (item.selected = checked));
            this.sortedData = cloneData;
            if (this.getSelectedRows) {
                this.getSelectedRows({
                    selectedRows: cloneData,
                });
            }
        };
    }
    componentDidLoad() {
        if (document.dir) {
            if (document.dir === 'rtl')
                this.direction = true;
            else
                this.direction = false;
        }
        else if (document.documentElement.lang) {
            if (document.documentElement.lang === 'ar')
                this.direction = true;
            else
                this.direction = false;
        }
        else
            this.direction = false;
    }
    componentDidUpdate() {
        const cloneData = [
            ...this.data.map(item => {
                item.selected = false;
                return item;
            }),
        ];
        this.sortedData = cloneData;
    }
    //     @Prop() onColor: boolean;
    //     @Prop() size: "sm" | "md" | "lg";
    //     @Prop() items: {
    //         label: React.ReactNode;
    //         content: React.ReactNode;
    //     }[] = [
    //         {
    //             label:"test label",
    //             content:"test content"
    //         },
    //         {
    //             label:"test label",
    //             content:"test content"
    //         },
    //         {
    //             label:"test label",
    //             content:"test content"
    //         }
    //     ];
    //     @State() selected: number = 0;
    //     private handleSelect = (index: number) => {
    //         this.selected = index;
    //     };
    render() {
        return (h("div", { key: '107004bda04af910ca676793f70d54bb0815e68e', class: `table-wrapper ${this.contained ? 'table-contained' : ''}` }, h("table", { key: '49fad2c1d8b354069f52880a2be393e05e6387e0', class: ` azm-table ${this.contained ? 'table-contained' : ''}`, style: { direction: this.direction ? 'rtl' : 'ltr' } }, h("thead", { key: '2a088a496c8d85fa26a9ba8ee6f8b938b661e113' }, h("tr", { key: '86cec9cdeb92ddf2dc2d2d7a037387d6849cf788', class: `${this.rowDivider ? 'row-divider' : ''}` }, this.showSelectCheckBox && (h("th", { key: '25cfaad2b3b0c6f7dcf49314be4d3780cb0ea51f', style: { width: '20px' } }, h("dga-checkbox", { key: '9e574d2ccac71b8aac46f9e6ee83eee7c542e0aa', showBorderOnFocusAndFocusOute: false, value: 'true', onChange: (event) => this.selectAll(event.target.checked) }))), this.cells.map((_a, index) => {
            var { sort, isSort, propertyName, type } = _a, header = __rest(_a, ["sort", "isSort", "propertyName", "type"]);
            return (h("th", { key: index }, h("span", null, h("span", { class: "text" }, header.title), h("span", { class: "icon-wrapper" }, isSort && sort == 'up' && type == 'propertyName' && (h("button", { class: "btn btn--sort btn--icon btn--md", onClick: () => this.sortData('up', propertyName, index) }, h("dga-icon", { icon: "SortByUp02Icon" }))), isSort && (!sort || sort == 'down') && type == 'propertyName' && (h("button", { class: "btn btn--sort btn--icon btn--md", onClick: () => this.sortData('down', propertyName, index) }, h("dga-icon", { icon: "SortByDown02Icon" }))), header.isFilter && (h("button", { class: "btn btn--sort btn--icon btn--md ", onClick: () => this.pressOnFilter && this.pressOnFilter(propertyName) }, h("dga-icon", { icon: "FilterIcon" })))))));
        }))), h("tbody", { key: '801fac253d5abbfd1d914a53b665fa114522df43' }, this.sortedData.map((row, rowIndex) => (h("tr", { class: `${this.rowDivider ? 'row-divider' : ''} ${this.alternate ? 'alternate' : ''} ${row.selected ? 'row-selected' : ''} `, key: rowIndex }, this.showSelectCheckBox && (h("td", null, h("dga-checkbox", { name: rowIndex + 'checkboxSelection', value: row.selected, id: rowIndex + 'checkboxSelection', showBorderOnFocusAndFocusOute: false, onChange: event => this.handleSelectedRowChanges(event.target.checked, rowIndex), checked: row.selected }))), this.cells.map((_a, cellIndex) => {
            var { El } = _a, cell = __rest(_a, ["El"]);
            return (h("td", { key: cellIndex, colSpan: cell.colSpan ? cell.colSpan : 1 }, cell.type === "element" && El ? (h(El, Object.assign({}, row))) : (row[cell.propertyName])));
        }))))))));
    }
}, [0, "dga-data-table-updated", {
        "columns": [16],
        "data": [8],
        "rowDivider": [4, "row-divider"],
        "showSelectCheckBox": [4, "show-select-check-box"],
        "alternate": [4],
        "cells": [16],
        "contained": [4],
        "getSelectedRows": [8, "get-selected-rows"],
        "pressOnFilter": [8, "press-on-filter"],
        "sortedData": [32],
        "direction": [32]
    }]);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["dga-data-table-updated", "dga-checkbox", "dga-icon"];
    components.forEach(tagName => { switch (tagName) {
        case "dga-data-table-updated":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, DgaDataTableUpdated);
            }
            break;
        case "dga-checkbox":
            if (!customElements.get(tagName)) {
                defineCustomElement$2();
            }
            break;
        case "dga-icon":
            if (!customElements.get(tagName)) {
                defineCustomElement$1();
            }
            break;
    } });
}

export { DgaDataTableUpdated as D, defineCustomElement as d };

//# sourceMappingURL=p-89e58464.js.map