import { Component, ElementRef, HostBinding, Input, ViewChild } from '@angular/core';
import { ButtonComponent } from '@aztrix/components/button';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@aztrix/components/button";
import * as i3 from "@aztrix/icons";
export class AccountButtonComponent extends ButtonComponent {
    constructor() {
        super(...arguments);
        this.color = 'white';
        this.postIcon = 'arrow-right';
    }
    get hasContent() {
        const children = Array.from(this.content?.nativeElement?.children || []);
        const contentChildren = children.filter((el) => !el.attributes.getNamedItem('remove'));
        return !!contentChildren.length;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AccountButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: AccountButtonComponent, selector: "ax-account-button", inputs: { title: "title", hint: "hint", color: "color", postIcon: "postIcon" }, host: { properties: { "class": "this.color" } }, viewQueries: [{ propertyName: "content", first: true, predicate: [".content"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ax-button\n  class=\"button\"\n  [ngClass]=\"{outline: _outline}\"\n  [type]=\"type\"\n  [lowercase]=\"true\"\n  [url]=\"url\"\n  [ariaLabel]=\"ariaLabel\"\n  [target]=\"target\"\n>\n  <div class=\"pre\">\n    <ax-icon class=\"icon\" axContrast [name]=\"icon\"></ax-icon>\n  </div>\n  <div\n    class=\"button-content\"\n    #content\n    [ngClass]=\"{'has-icon': postIcon, 'has-hint': hint || hasContent}\"\n  >\n    <span remove class=\"title\" *ngIf=\"title || postIcon\" axContrast>{{ title }}</span>\n    <ax-icon remove *ngIf=\"postIcon\" class=\"icon\" axContrast [name]=\"postIcon\"></ax-icon>\n    <ng-content class=\"content\"></ng-content>\n    <div class=\"post\"><ng-content select=\".post\"></ng-content></div>\n    <div remove *ngIf=\"hint\" class=\"hint\">{{ hint }}</div>\n  </div>\n</ax-button>\n", styles: [":host .pre,:host .button-content{background-color:#fff;border-radius:.6rem}:host.primary .pre,:host.primary .button-content{background-color:var(--primary-color-500)}:host .button.outline .pre{background-color:transparent;border:1px solid currentColor}:host .button.outline .button-content{background-color:transparent;border:1px solid currentColor}:host ::ng-deep a.ax-button,:host ::ng-deep button.ax-button{display:grid;grid-template-columns:50px 1fr;grid-template-areas:\"button button\";align-items:flex-start;gap:.75rem;width:100%;min-width:0;height:auto;padding:0;white-space:unset;line-height:1.5}:host ::ng-deep a.ax-button:hover,:host ::ng-deep button.ax-button:hover{background-color:inherit}.pre{display:flex;align-items:center;justify-content:center;width:50px;height:50px}.button-content{display:grid;grid-template-columns:1fr max-content;grid-template-areas:\"title icon\";align-items:center;column-gap:.75rem;text-align:left;height:100%;padding:.8rem .75rem}.button-content.has-hint{grid-template-areas:\"title icon\" \"hint icon\"}.post,.icon{grid-area:icon;align-self:center;line-height:0}.hint{grid-area:hint;font-size:.875rem;line-height:1.31rem;white-space:normal;font-weight:400}.title{grid-area:title;line-height:1.5}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ButtonComponent, selector: "ax-button", inputs: ["url", "ariaLabel", "target"] }, { kind: "component", type: i3.IconComponent, selector: "ax-icon", inputs: ["name", "inline"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AccountButtonComponent, decorators: [{
            type: Component,
            args: [{ selector: 'ax-account-button', template: "<ax-button\n  class=\"button\"\n  [ngClass]=\"{outline: _outline}\"\n  [type]=\"type\"\n  [lowercase]=\"true\"\n  [url]=\"url\"\n  [ariaLabel]=\"ariaLabel\"\n  [target]=\"target\"\n>\n  <div class=\"pre\">\n    <ax-icon class=\"icon\" axContrast [name]=\"icon\"></ax-icon>\n  </div>\n  <div\n    class=\"button-content\"\n    #content\n    [ngClass]=\"{'has-icon': postIcon, 'has-hint': hint || hasContent}\"\n  >\n    <span remove class=\"title\" *ngIf=\"title || postIcon\" axContrast>{{ title }}</span>\n    <ax-icon remove *ngIf=\"postIcon\" class=\"icon\" axContrast [name]=\"postIcon\"></ax-icon>\n    <ng-content class=\"content\"></ng-content>\n    <div class=\"post\"><ng-content select=\".post\"></ng-content></div>\n    <div remove *ngIf=\"hint\" class=\"hint\">{{ hint }}</div>\n  </div>\n</ax-button>\n", styles: [":host .pre,:host .button-content{background-color:#fff;border-radius:.6rem}:host.primary .pre,:host.primary .button-content{background-color:var(--primary-color-500)}:host .button.outline .pre{background-color:transparent;border:1px solid currentColor}:host .button.outline .button-content{background-color:transparent;border:1px solid currentColor}:host ::ng-deep a.ax-button,:host ::ng-deep button.ax-button{display:grid;grid-template-columns:50px 1fr;grid-template-areas:\"button button\";align-items:flex-start;gap:.75rem;width:100%;min-width:0;height:auto;padding:0;white-space:unset;line-height:1.5}:host ::ng-deep a.ax-button:hover,:host ::ng-deep button.ax-button:hover{background-color:inherit}.pre{display:flex;align-items:center;justify-content:center;width:50px;height:50px}.button-content{display:grid;grid-template-columns:1fr max-content;grid-template-areas:\"title icon\";align-items:center;column-gap:.75rem;text-align:left;height:100%;padding:.8rem .75rem}.button-content.has-hint{grid-template-areas:\"title icon\" \"hint icon\"}.post,.icon{grid-area:icon;align-self:center;line-height:0}.hint{grid-area:hint;font-size:.875rem;line-height:1.31rem;white-space:normal;font-weight:400}.title{grid-area:title;line-height:1.5}\n"] }]
        }], propDecorators: { title: [{
                type: Input
            }], hint: [{
                type: Input
            }], color: [{
                type: HostBinding,
                args: ['class']
            }, {
                type: Input
            }], postIcon: [{
                type: Input
            }], content: [{
                type: ViewChild,
                args: ['.content']
            }] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWNjb3VudC1idXR0b24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21wb25lbnRzL2FjY291bnQvYWNjb3VudC1idXR0b24vYWNjb3VudC1idXR0b24uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21wb25lbnRzL2FjY291bnQvYWNjb3VudC1idXR0b24vYWNjb3VudC1idXR0b24uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFNBQVMsRUFBRSxVQUFVLEVBQUUsV0FBVyxFQUFFLEtBQUssRUFBRSxTQUFTLEVBQUMsTUFBTSxlQUFlLENBQUM7QUFDbkYsT0FBTyxFQUFDLGVBQWUsRUFBQyxNQUFNLDJCQUEyQixDQUFDOzs7OztBQU8xRCxNQUFNLE9BQU8sc0JBQXVCLFNBQVEsZUFBZTtJQUwzRDs7UUFRMEMsVUFBSyxHQUFHLE9BQU8sQ0FBQztRQUMvQyxhQUFRLEdBQUcsYUFBYSxDQUFDO0tBU25DO0lBTEMsSUFBSSxVQUFVO1FBQ1osTUFBTSxRQUFRLEdBQUcsS0FBSyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFLGFBQWEsRUFBRSxRQUFRLElBQUksRUFBRSxDQUFDLENBQUM7UUFDekUsTUFBTSxlQUFlLEdBQUcsUUFBUSxDQUFDLE1BQU0sQ0FBQyxDQUFDLEVBQUUsRUFBRSxFQUFFLENBQUMsQ0FBQyxFQUFFLENBQUMsVUFBVSxDQUFDLFlBQVksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDO1FBQ3ZGLE9BQU8sQ0FBQyxDQUFDLGVBQWUsQ0FBQyxNQUFNLENBQUM7SUFDbEMsQ0FBQzsrR0FaVSxzQkFBc0I7bUdBQXRCLHNCQUFzQixzVENSbkMsaXpCQXdCQTs7NEZEaEJhLHNCQUFzQjtrQkFMbEMsU0FBUzsrQkFDRSxtQkFBbUI7OEJBS3BCLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxJQUFJO3NCQUFaLEtBQUs7Z0JBQ2tDLEtBQUs7c0JBQTVDLFdBQVc7dUJBQUMsT0FBTzs7c0JBQUcsS0FBSztnQkFDbkIsUUFBUTtzQkFBaEIsS0FBSztnQkFFaUIsT0FBTztzQkFBN0IsU0FBUzt1QkFBQyxVQUFVIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtDb21wb25lbnQsIEVsZW1lbnRSZWYsIEhvc3RCaW5kaW5nLCBJbnB1dCwgVmlld0NoaWxkfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7QnV0dG9uQ29tcG9uZW50fSBmcm9tICdAYXp0cml4L2NvbXBvbmVudHMvYnV0dG9uJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnYXgtYWNjb3VudC1idXR0b24nLFxuICB0ZW1wbGF0ZVVybDogJy4vYWNjb3VudC1idXR0b24uY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9hY2NvdW50LWJ1dHRvbi5jb21wb25lbnQuc2NzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBBY2NvdW50QnV0dG9uQ29tcG9uZW50IGV4dGVuZHMgQnV0dG9uQ29tcG9uZW50IHtcbiAgQElucHV0KCkgdGl0bGU6IHN0cmluZztcbiAgQElucHV0KCkgaGludD86IHN0cmluZztcbiAgQEhvc3RCaW5kaW5nKCdjbGFzcycpIEBJbnB1dCgpIG92ZXJyaWRlIGNvbG9yID0gJ3doaXRlJztcbiAgQElucHV0KCkgcG9zdEljb24gPSAnYXJyb3ctcmlnaHQnO1xuXG4gIEBWaWV3Q2hpbGQoJy5jb250ZW50JykgY29udGVudDogRWxlbWVudFJlZjxIVE1MRGl2RWxlbWVudD47XG5cbiAgZ2V0IGhhc0NvbnRlbnQoKTogYm9vbGVhbiB7XG4gICAgY29uc3QgY2hpbGRyZW4gPSBBcnJheS5mcm9tKHRoaXMuY29udGVudD8ubmF0aXZlRWxlbWVudD8uY2hpbGRyZW4gfHwgW10pO1xuICAgIGNvbnN0IGNvbnRlbnRDaGlsZHJlbiA9IGNoaWxkcmVuLmZpbHRlcigoZWwpID0+ICFlbC5hdHRyaWJ1dGVzLmdldE5hbWVkSXRlbSgncmVtb3ZlJykpO1xuICAgIHJldHVybiAhIWNvbnRlbnRDaGlsZHJlbi5sZW5ndGg7XG4gIH1cbn1cbiIsIjxheC1idXR0b25cbiAgY2xhc3M9XCJidXR0b25cIlxuICBbbmdDbGFzc109XCJ7b3V0bGluZTogX291dGxpbmV9XCJcbiAgW3R5cGVdPVwidHlwZVwiXG4gIFtsb3dlcmNhc2VdPVwidHJ1ZVwiXG4gIFt1cmxdPVwidXJsXCJcbiAgW2FyaWFMYWJlbF09XCJhcmlhTGFiZWxcIlxuICBbdGFyZ2V0XT1cInRhcmdldFwiXG4+XG4gIDxkaXYgY2xhc3M9XCJwcmVcIj5cbiAgICA8YXgtaWNvbiBjbGFzcz1cImljb25cIiBheENvbnRyYXN0IFtuYW1lXT1cImljb25cIj48L2F4LWljb24+XG4gIDwvZGl2PlxuICA8ZGl2XG4gICAgY2xhc3M9XCJidXR0b24tY29udGVudFwiXG4gICAgI2NvbnRlbnRcbiAgICBbbmdDbGFzc109XCJ7J2hhcy1pY29uJzogcG9zdEljb24sICdoYXMtaGludCc6IGhpbnQgfHwgaGFzQ29udGVudH1cIlxuICA+XG4gICAgPHNwYW4gcmVtb3ZlIGNsYXNzPVwidGl0bGVcIiAqbmdJZj1cInRpdGxlIHx8IHBvc3RJY29uXCIgYXhDb250cmFzdD57eyB0aXRsZSB9fTwvc3Bhbj5cbiAgICA8YXgtaWNvbiByZW1vdmUgKm5nSWY9XCJwb3N0SWNvblwiIGNsYXNzPVwiaWNvblwiIGF4Q29udHJhc3QgW25hbWVdPVwicG9zdEljb25cIj48L2F4LWljb24+XG4gICAgPG5nLWNvbnRlbnQgY2xhc3M9XCJjb250ZW50XCI+PC9uZy1jb250ZW50PlxuICAgIDxkaXYgY2xhc3M9XCJwb3N0XCI+PG5nLWNvbnRlbnQgc2VsZWN0PVwiLnBvc3RcIj48L25nLWNvbnRlbnQ+PC9kaXY+XG4gICAgPGRpdiByZW1vdmUgKm5nSWY9XCJoaW50XCIgY2xhc3M9XCJoaW50XCI+e3sgaGludCB9fTwvZGl2PlxuICA8L2Rpdj5cbjwvYXgtYnV0dG9uPlxuIl19