import { h, Fragment } from "@stencil/core";
export class DgaMetric {
    constructor() {
        this.label = '';
        this.Style = 'small-chart';
        this.percentage = '0%';
        this.showFeaturedIcon = true;
        this.featuredIcon = (h("i", { class: "hgi-stroke hgi-trade-up", style: { fontSize: "24px" } })); // Default icon
        this.showChart = true;
        this.showInfo = true;
        this.showActions = true;
        this.showSecondaryAction = true;
        this.showMoreButton = true;
        this.changeProps = {
            type: '01',
            trend: 'positive',
        };
        this.onPrimaryAction = () => { };
        this.onSecondaryAction = () => { };
        this.onExpandAction = () => { };
        this.changeIcons = {
            '01': {
                positive: 'arrow-up-02',
                negative: 'arrow-down-02',
            },
            '02': {
                positive: 'trade-up',
                negative: 'trade-down',
            },
        };
    }
    render() {
        return (h("div", { key: '8008f802cce6417cb9ce19123ac10d0b8fba523b', class: `dga-metric`, "data-chart-size": this.Style }, h("div", { key: 'b7050c157516b2acf95c65546d0c5cdf0bf54998', class: "dga-metric__head" }, h("div", { key: '133215b06b3a1306bcd28590b9a59d8493dc6eda', class: "dga-metric__head-content" }, this.showFeaturedIcon && (h("div", { key: '361d0b849b1d19521b8f1b627b16f0125cd6454d', class: "featured-icon featured-icon--light-brand featured-icon--circle featured-icon--sm" }, this.featuredIcon)), this.label && h("span", { key: '202dde765f78ace4d6c1606fce92366c0c4ca142', class: "dga-metric__head-content-text" }, this.label)), this.showMoreButton && h("dga-button", { key: 'e627aa258dba2cb2b029aa2829380f78f472f6f2', variant: "subtle", iconOnly: true, leadIcon: true, leadIconType: "more-vertical", leadIconProps: {
                variant: "stroke",
                type: "rounded"
            }, onClick: this.onExpandAction })), h("div", { key: '35ca0b05c7382f634e5af2bafe9bfd7cc4e04cd2', class: "dga-metric__body" }, h("div", { key: '74e47c98cdac7039e7d5677a47d014808da8da6d', class: "dga-metric__content" }, h("h3", { key: '60eb2ca38b33949605a5eeadccbe3868fcbf695a', class: "dga-metric__content-percentage" }, this.percentage), this.showInfo && (h("div", { key: 'cfb59538871a986a38fbe41b7d367b4d38cac6ad', class: "dga-metric__content-change", "data-change-trend": this.changeProps.trend }, h("span", { key: 'a20c20933731c41393dd602e8d40b28e05c88b3a', class: "dga-metric__content-change-icon" }, h("dga-icon", { key: '7dda888b83bfc0eaf74e4082b8352558828158c0', icon: this.changeIcons[this.changeProps.type][this.changeProps.trend], type: 'rounded', variant: 'stroke', size: 24 })), h("span", { key: '1b3cb49b71d6ba78310181b468b3f4b33d529039', class: "dga-metric__content-change-value" }, Math.abs(100), "%"), h("span", { key: '9b703eee04f6538ea1adc987402692269f53ef07', class: "dga-metric__content-change-period" }, "vs last month")))), this.showChart && (h("div", { key: '4db3fc944c5fc494b4d511d24a4ba1f1f8e74065', class: "dga-metric__chart" }, h("dga-metric-chart", Object.assign({ key: 'c9c0f9999ca5a074649abe479fcaf4e82a403d56' }, this.chartProps, { size: this.Style === 'small-chart' ? 'sm' : 'lg' }))))), this.showActions && (h(Fragment, { key: '4245ea5595c012fc9241f925ef62dfbb0b44bdac' }, h("div", { key: '9eb5689c574a5e57c82462ac01fd26b741369126', class: "dga-metric__divider" }), h("div", { key: '524757dfe1369bc1bc1ca36e02c5b7f3f0c6c13e', class: "dga-metric__actions" }, this.showSecondaryAction && h("dga-button", { key: '9da60f8e8e524a02d9c692bcadbfa6681894de16', variant: "subtle", iconOnly: true, leadIcon: true, leadIconType: "settings-02", leadIconProps: {
                variant: "stroke",
                type: "rounded"
            }, onClick: this.onSecondaryAction }), h("dga-button", { key: '840efb0999d0aedd886a2c6ae4f0bb62395c7509', variant: "secondary-outline", class: "dga-metric__actions--primary", label: "View Report", onClick: this.onPrimaryAction }))))));
    }
    static get is() { return "dga-metric"; }
    static get originalStyleUrls() {
        return {
            "$": ["dga-metric.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["dga-metric.css"]
        };
    }
    static get properties() {
        return {
            "label": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "attribute": "label",
                "reflect": false,
                "defaultValue": "''"
            },
            "Style": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'small-chart' | 'large-chart'",
                    "resolved": "\"large-chart\" | \"small-chart\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "attribute": "style",
                "reflect": false,
                "defaultValue": "'small-chart'"
            },
            "percentage": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "attribute": "percentage",
                "reflect": false,
                "defaultValue": "'0%'"
            },
            "showFeaturedIcon": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "attribute": "show-featured-icon",
                "reflect": false,
                "defaultValue": "true"
            },
            "featuredIcon": {
                "type": "any",
                "mutable": false,
                "complexType": {
                    "original": "HTMLElement | any",
                    "resolved": "any",
                    "references": {
                        "HTMLElement": {
                            "location": "global",
                            "id": "global::HTMLElement"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "attribute": "featured-icon",
                "reflect": false,
                "defaultValue": "(<i class=\"hgi-stroke hgi-trade-up\" style={{ fontSize: \"24px\" }} />)"
            },
            "showChart": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "attribute": "show-chart",
                "reflect": false,
                "defaultValue": "true"
            },
            "showInfo": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "attribute": "show-info",
                "reflect": false,
                "defaultValue": "true"
            },
            "showActions": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "attribute": "show-actions",
                "reflect": false,
                "defaultValue": "true"
            },
            "showSecondaryAction": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "attribute": "show-secondary-action",
                "reflect": false,
                "defaultValue": "true"
            },
            "showMoreButton": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "attribute": "show-more-button",
                "reflect": false,
                "defaultValue": "true"
            },
            "changeProps": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "{\n    type: '01' | '02';\n    trend: 'positive' | 'negative';\n  }",
                    "resolved": "{ type: \"01\" | \"02\"; trend: \"negative\" | \"positive\"; }",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "defaultValue": "{\n      type: '01',\n      trend: 'positive',\n    }"
            },
            "chartProps": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "IChartProps",
                    "resolved": "IChartProps",
                    "references": {
                        "IChartProps": {
                            "location": "local",
                            "path": "/home/mamoud/Documents/temp/components/platform-code-cross-platform-storybook/packages/core/src/components/dga-metric/dga-metric.tsx",
                            "id": "src/components/dga-metric/dga-metric.tsx::IChartProps"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false
            },
            "trend": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "ITrend",
                    "resolved": "ITrend",
                    "references": {
                        "ITrend": {
                            "location": "local",
                            "path": "/home/mamoud/Documents/temp/components/platform-code-cross-platform-storybook/packages/core/src/components/dga-metric/dga-metric.tsx",
                            "id": "src/components/dga-metric/dga-metric.tsx::ITrend"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false
            },
            "onPrimaryAction": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "() => void",
                    "resolved": "() => void",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "defaultValue": "() => { }"
            },
            "onSecondaryAction": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "() => void",
                    "resolved": "() => void",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "defaultValue": "() => { }"
            },
            "onExpandAction": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "() => void",
                    "resolved": "() => void",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "defaultValue": "() => { }"
            }
        };
    }
}
//# sourceMappingURL=dga-metric.js.map
