circletone/esm2022/lib/components/atoms/button/button.component.mjs

import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
import { IconComponent } from '../icon/icon.component';
import { NgClass } from '@angular/common';
import * as i0 from "@angular/core";
export class ButtonComponent {
    constructor() {
        this.text = '';
        this.type = 'default';
        this.size = 'base';
        this.variant = 'default';
        this.icon = undefined;
    }
    getCssClasses() {
        const sizeAndTextClasses = this.getSizeAndTextClasses();
        const borderClasses = this.getBorderClasses();
        const backgroundClasses = this.getBackgroundClasses();
        const allClasses = { ...sizeAndTextClasses, ...borderClasses, ...backgroundClasses };
        return this.getClassesAsString(allClasses);
    }
    getBackgroundClasses() {
        return {
            'bg-primary hover:bg-primary-variation dark:bg-primary-dark': this.type === 'default' && this.variant === 'default',
            'bg-secondary hover:bg-primary dark:bg-secondary-dark': this.type === 'alternate' && this.variant === 'default',
            'bg-warning hover:bg-warning-variation': this.type === 'warning' && this.variant === 'default',
            'bg-error hover:bg-error-variation': this.type === 'error' && this.variant === 'default',
            'bg-success hover:bg-success-variation': this.type === 'success' && this.variant === 'default',
        };
    }
    getBorderClasses() {
        return {
            border: this.variant === 'outline',
            'border-primary dark:border-primary-dark': this.type === 'default' && this.variant === 'outline',
            'border-secondary dark:border-secondary-dark': this.type === 'alternate' && this.variant === 'outline',
            'border-warning': this.type === 'warning' && this.variant === 'outline',
            'border-error': this.type === 'error' && this.variant === 'outline',
            'border-success': this.type === 'success' && this.variant === 'outline',
        };
    }
    getSizeAndTextClasses() {
        return {
            'px-3 py-2': this.size === 'xs' || this.size === 'sm',
            'px-5 py-2.5': this.size === 'base' || this.size === 'lg',
            'px-6 py-3.5': this.size === 'xl',
            'text-xs': this.size === 'xs',
            'text-sm': this.size === 'sm' || this.size === 'base',
            'text-base': this.size === 'lg' || this.size === 'xl',
        };
    }
    getClassesAsString(classesObj) {
        return Object.entries(classesObj)
            .filter(([_, value]) => value)
            .map(([key, _]) => key)
            .join(' ');
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.1", type: ButtonComponent, isStandalone: true, selector: "ct-button", inputs: { text: "text", type: "type", size: "size", variant: "variant", icon: "icon" }, ngImport: i0, template: "<button class=\"flex flex-row items-center gap-1.5 rounded-md\" [ngClass]=\"getCssClasses()\">\n  @if (icon) {\n    <ct-icon class=\"flex\" [size]=\"size || 'base'\" [icon]=\"icon\" />\n  }\n  {{ text }}\n</button>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconComponent, selector: "ct-icon", inputs: ["icon", "iconClass", "fill", "strokeWidth", "strokeColor", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: ButtonComponent, decorators: [{
            type: Component,
            args: [{ selector: 'ct-button', standalone: true, imports: [NgClass, IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button class=\"flex flex-row items-center gap-1.5 rounded-md\" [ngClass]=\"getCssClasses()\">\n  @if (icon) {\n    <ct-icon class=\"flex\" [size]=\"size || 'base'\" [icon]=\"icon\" />\n  }\n  {{ text }}\n</button>\n" }]
        }], propDecorators: { text: [{
                type: Input,
                args: [{ required: true }]
            }], type: [{
                type: Input
            }], size: [{
                type: Input
            }], variant: [{
                type: Input
            }], icon: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnV0dG9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NpcmNsZXRvbmUvc3JjL2xpYi9jb21wb25lbnRzL2F0b21zL2J1dHRvbi9idXR0b24uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY2lyY2xldG9uZS9zcmMvbGliL2NvbXBvbmVudHMvYXRvbXMvYnV0dG9uL2J1dHRvbi5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMxRSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUM7QUFFdkQsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLGlCQUFpQixDQUFDOztBQVMxQyxNQUFNLE9BQU8sZUFBZTtJQVA1QjtRQVE2QixTQUFJLEdBQUcsRUFBRSxDQUFDO1FBQzVCLFNBQUksR0FBOEQsU0FBUyxDQUFDO1FBQzVFLFNBQUksR0FBYSxNQUFNLENBQUM7UUFDeEIsWUFBTyxHQUEwQixTQUFTLENBQUM7UUFDM0MsU0FBSSxHQUFZLFNBQVMsQ0FBQztLQW1EcEM7SUFqREMsYUFBYTtRQUNYLE1BQU0sa0JBQWtCLEdBQUcsSUFBSSxDQUFDLHFCQUFxQixFQUFFLENBQUM7UUFDeEQsTUFBTSxhQUFhLEdBQUcsSUFBSSxDQUFDLGdCQUFnQixFQUFFLENBQUM7UUFDOUMsTUFBTSxpQkFBaUIsR0FBRyxJQUFJLENBQUMsb0JBQW9CLEVBQUUsQ0FBQztRQUV0RCxNQUFNLFVBQVUsR0FBRyxFQUFFLEdBQUcsa0JBQWtCLEVBQUUsR0FBRyxhQUFhLEVBQUUsR0FBRyxpQkFBaUIsRUFBRSxDQUFDO1FBRXJGLE9BQU8sSUFBSSxDQUFDLGtCQUFrQixDQUFDLFVBQVUsQ0FBQyxDQUFDO0lBQzdDLENBQUM7SUFF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c0JBQVosS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBJY29uQ29tcG9uZW50IH0gZnJvbSAnLi4vaWNvbi9pY29uLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBTaXplVHlwZSB9IGZyb20gJy4uLy4uLy4uL21vZGVsL3NpemUudHlwZSc7XG5pbXBvcnQgeyBOZ0NsYXNzIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnY3QtYnV0dG9uJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW05nQ2xhc3MsIEljb25Db21wb25lbnRdLFxuICB0ZW1wbGF0ZVVybDogJy4vYnV0dG9uLmNvbXBvbmVudC5odG1sJyxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIEJ1dHRvbkNvbXBvbmVudCB7XG4gIEBJbnB1dCh7IHJlcXVpcmVkOiB0cnVlIH0pIHRleHQgPSAnJztcbiAgQElucHV0KCkgdHlwZTogJ2RlZmF1bHQnIHwgJ2FsdGVybmF0ZScgfCAnc3VjY2VzcycgfCAnd2FybmluZycgfCAnZXJyb3InID0gJ2RlZmF1bHQnO1xuICBASW5wdXQoKSBzaXplOiBTaXplVHlwZSA9ICdiYXNlJztcbiAgQElucHV0KCkgdmFyaWFudDogJ2RlZmF1bHQnIHwgJ291dGxpbmUnID0gJ2RlZmF1bHQnO1xuICBASW5wdXQoKSBpY29uPzogc3RyaW5nID0gdW5kZWZpbmVkO1xuXG4gIGdldENzc0NsYXNzZXMoKSB7XG4gICAgY29uc3Qgc2l6ZUFuZFRleHRDbGFzc2VzID0gdGhpcy5nZXRTaXplQW5kVGV4dENsYXNzZXMoKTtcbiAgICBjb25zdCBib3JkZXJDbGFzc2VzID0gdGhpcy5nZXRCb3JkZXJDbGFzc2VzKCk7XG4gICAgY29uc3QgYmFja2dyb3VuZENsYXNzZXMgPSB0aGlzLmdldEJhY2tncm91bmRDbGFzc2VzKCk7XG5cbiAgICBjb25zdCBhbGxDbGFzc2VzID0geyAuLi5zaXplQW5kVGV4dENsYXNzZXMsIC4uLmJvcmRlckNsYXNzZXMsIC4uLmJhY2tncm91bmRDbGFzc2VzIH07XG5cbiAgICByZXR1cm4gdGhpcy5nZXRDbGFzc2VzQXNTdHJpbmcoYWxsQ2xhc3Nlcyk7XG4gIH1cblxuICBwcml2YXRlIGdldEJhY2tncm91bmRDbGFzc2VzKCkge1xuICAgIHJldHVybiB7XG4gICAgICAnYmctcHJpbWFyeSBob3ZlcjpiZy1wcmltYXJ5LXZhcmlhdGlvbiBkYXJrOmJnLXByaW1hcnktZGFyayc6XG4gICAgICAgIHRoaXMudHlwZSA9PT0gJ2RlZmF1bHQnICYmIHRoaXMudmFyaWFudCA9PT0gJ2RlZmF1bHQnLFxuICAgICAgJ2JnLXNlY29uZGFyeSBob3ZlcjpiZy1wcmltYXJ5IGRhcms6Ymctc2Vjb25kYXJ5LWRhcmsnOiB0aGlzLnR5cGUgPT09ICdhbHRlcm5hdGUnICYmIHRoaXMudmFyaWFudCA9PT0gJ2RlZmF1bHQnLFxuICAgICAgJ2JnLXdhcm5pbmcgaG92ZXI6Ymctd2FybmluZy12YXJpYXRpb24nOiB0aGlzLnR5cGUgPT09ICd3YXJuaW5nJyAmJiB0aGlzLnZhcmlhbnQgPT09ICdkZWZhdWx0JyxcbiAgICAgICdiZy1lcnJvciBob3ZlcjpiZy1lcnJvci12YXJpYXRpb24nOiB0aGlzLnR5cGUgPT09ICdlcnJvcicgJiYgdGhpcy52YXJpYW50ID09PSAnZGVmYXVsdCcsXG4gICAgICAnYmctc3VjY2VzcyBob3ZlcjpiZy1zdWNjZXNzLXZhcmlhdGlvbic6IHRoaXMudHlwZSA9PT0gJ3N1Y2Nlc3MnICYmIHRoaXMudmFyaWFudCA9PT0gJ2RlZmF1bHQnLFxuICAgIH07XG4gIH1cblxuICBwcml2YXRlIGdldEJvcmRlckNsYXNzZXMoKSB7XG4gICAgcmV0dXJuIHtcbiAgICAgIGJvcmRlcjogdGhpcy52YXJpYW50ID09PSAnb3V0bGluZScsXG4gICAgICAnYm9yZGVyLXByaW1hcnkgZGFyazpib3JkZXItcHJpbWFyeS1kYXJrJzogdGhpcy50eXBlID09PSAnZGVmYXVsdCcgJiYgdGhpcy52YXJpYW50ID09PSAnb3V0bGluZScsXG4gICAgICAnYm9yZGVyLXNlY29uZGFyeSBkYXJrOmJvcmRlci1zZWNvbmRhcnktZGFyayc6IHRoaXMudHlwZSA9PT0gJ2FsdGVybmF0ZScgJiYgdGhpcy52YXJpYW50ID09PSAnb3V0bGluZScsXG4gICAgICAnYm9yZGVyLXdhcm5pbmcnOiB0aGlzLnR5cGUgPT09ICd3YXJuaW5nJyAmJiB0aGlzLnZhcmlhbnQgPT09ICdvdXRsaW5lJyxcbiAgICAgICdib3JkZXItZXJyb3InOiB0aGlzLnR5cGUgPT09ICdlcnJvcicgJiYgdGhpcy52YXJpYW50ID09PSAnb3V0bGluZScsXG4gICAgICAnYm9yZGVyLXN1Y2Nlc3MnOiB0aGlzLnR5cGUgPT09ICdzdWNjZXNzJyAmJiB0aGlzLnZhcmlhbnQgPT09ICdvdXRsaW5lJyxcbiAgICB9O1xuICB9XG5cbiAgcHJpdmF0ZSBnZXRTaXplQW5kVGV4dENsYXNzZXMoKSB7XG4gICAgcmV0dXJuIHtcbiAgICAgICdweC0zIHB5LTInOiB0aGlzLnNpemUgPT09ICd4cycgfHwgdGhpcy5zaXplID09PSAnc20nLFxuICAgICAgJ3B4LTUgcHktMi41JzogdGhpcy5zaXplID09PSAnYmFzZScgfHwgdGhpcy5zaXplID09PSAnbGcnLFxuICAgICAgJ3B4LTYgcHktMy41JzogdGhpcy5zaXplID09PSAneGwnLFxuICAgICAgJ3RleHQteHMnOiB0aGlzLnNpemUgPT09ICd4cycsXG4gICAgICAndGV4dC1zbSc6IHRoaXMuc2l6ZSA9PT0gJ3NtJyB8fCB0aGlzLnNpemUgPT09ICdiYXNlJyxcbiAgICAgICd0ZXh0LWJhc2UnOiB0aGlzLnNpemUgPT09ICdsZycgfHwgdGhpcy5zaXplID09PSAneGwnLFxuICAgIH07XG4gIH1cblxuICBwcml2YXRlIGdldENsYXNzZXNBc1N0cmluZyhjbGFzc2VzT2JqOiBvYmplY3QpIHtcbiAgICByZXR1cm4gT2JqZWN0LmVudHJpZXMoY2xhc3Nlc09iailcbiAgICAgIC5maWx0ZXIoKFtfLCB2YWx1ZV0pID0+IHZhbHVlKVxuICAgICAgLm1hcCgoW2tleSwgX10pID0+IGtleSlcbiAgICAgIC5qb2luKCcgJyk7XG4gIH1cbn1cbiIsIjxidXR0b24gY2xhc3M9XCJmbGV4IGZsZXgtcm93IGl0ZW1zLWNlbnRlciBnYXAtMS41IHJvdW5kZWQtbWRcIiBbbmdDbGFzc109XCJnZXRDc3NDbGFzc2VzKClcIj5cbiAgQGlmIChpY29uKSB7XG4gICAgPGN0LWljb24gY2xhc3M9XCJmbGV4XCIgW3NpemVdPVwic2l6ZSB8fCAnYmFzZSdcIiBbaWNvbl09XCJpY29uXCIgLz5cbiAgfVxuICB7eyB0ZXh0IH19XG48L2J1dHRvbj5cbiJdfQ==