@coreui/angular
Version:
CoreUI Components Library for Angular
88 lines • 12.1 kB
JavaScript
import { booleanAttribute, computed, Directive, input } from '@angular/core';
import * as i0 from "@angular/core";
export class ButtonDirective {
constructor() {
/**
* Toggle the active state for the component. [docs]
* @type InputSignalWithTransform<boolean, unknown>
*/
this.active = input(false, { transform: booleanAttribute });
/**
* Sets the color context of the component to one of CoreUI’s themed colors. [docs]
* @type InputSignal<Colors>
*/
this.color = input('primary');
/**
* Toggle the disabled state for the component.
* @type InputSignalWithTransform<boolean, unknown>
*/
this.disabled = input(false, { transform: booleanAttribute });
/**
* Select the shape of the component.
* @type InputSignal<Shapes>
*/
this.shape = input();
/**
* Size the component small or large.
* @type InputSignal<'sm' | 'lg' | ''>
*/
this.size = input('');
/**
* Specifies the type of button. Always specify the type attribute for the `<button>` element.
* Different browsers may use different default types for the `<button>` element.
* @type InputSignal<ButtonType>
* @default 'button'
*/
this.type = input('button');
/**
* Set the button variant to an outlined button or a ghost button.
* @type InputSignal<'ghost' | 'outline' | undefined>
*/
this.variant = input();
this.hostClasses = computed(() => {
return {
btn: true,
[`btn-${this.color()}`]: !!this.color() && !this.variant(),
[`btn-${this.variant()}`]: !!this.variant() && !this.color(),
[`btn-${this.variant()}-${this.color()}`]: !!this.variant() && !!this.color(),
[`btn-${this.size()}`]: !!this.size(),
[`${this.shape()}`]: !!this.shape(),
active: this.active(),
disabled: this._disabled()
};
});
this._disabled = computed(() => this.disabled());
this.ariaDisabled = computed(() => {
return this._disabled() ? true : null;
});
this.attrDisabled = computed(() => {
return this._disabled() ? '' : null;
});
this.tabIndex = computed(() => {
return this._disabled() ? '-1' : null;
});
this.isActive = computed(() => {
return this.active() || null;
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.12", ngImport: i0, type: ButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.12", type: ButtonDirective, isStandalone: true, selector: "[cButton]", inputs: { active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()", "attr.aria-disabled": "ariaDisabled()", "attr.aria-pressed": "isActive()", "attr.disabled": "attrDisabled()", "attr.tabindex": "tabIndex()", "attr.type": "type()" }, classAttribute: "btn" }, exportAs: ["cButton"], ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.12", ngImport: i0, type: ButtonDirective, decorators: [{
type: Directive,
args: [{
selector: '[cButton]',
exportAs: 'cButton',
standalone: true,
host: {
class: 'btn',
'[class]': 'hostClasses()',
'[attr.aria-disabled]': 'ariaDisabled()',
'[attr.aria-pressed]': 'isActive()',
'[attr.disabled]': 'attrDisabled()',
'[attr.tabindex]': 'tabIndex()',
'[attr.type]': 'type()'
}
}]
}] });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnV0dG9uLmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NvcmV1aS1hbmd1bGFyL3NyYy9saWIvYnV0dG9uL2J1dHRvbi5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLGdCQUFnQixFQUFFLFFBQVEsRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUF5QyxNQUFNLGVBQWUsQ0FBQzs7QUFrQnBILE1BQU0sT0FBTyxlQUFlO0lBZDVCO1FBZUU7OztXQUdHO1FBQ00sV0FBTSxHQUErQyxLQUFLLENBQUMsS0FBSyxFQUFFLEVBQUUsU0FBUyxFQUFFLGdCQUFnQixFQUFFLENBQUMsQ0FBQztRQUU1Rzs7O1dBR0c7UUFDTSxVQUFLLEdBQXdCLEtBQUssQ0FBUyxTQUFTLENBQUMsQ0FBQztRQUUvRDs7O1dBR0c7UUFDTSxhQUFRLEdBQStDLEtBQUssQ0FBQyxLQUFLLEVBQUUsRUFBRSxTQUFTLEVBQUUsZ0JBQWdCLEVBQUUsQ0FBQyxDQUFDO1FBRTlHOzs7V0FHRztRQUNNLFVBQUssR0FBb0MsS0FBSyxFQUFVLENBQUM7UUFFbEU7OztXQUdHO1FBQ00sU0FBSSxHQUFrQyxLQUFLLENBQW1CLEVBQUUsQ0FBQyxDQUFDO1FBRTNFOzs7OztXQUtHO1FBQ00sU0FBSSxHQUE0QixLQUFLLENBQWEsUUFBUSxDQUFDLENBQUM7UUFFckU7OztXQUdHO1FBQ00sWUFBTyxHQUFpRCxLQUFLLEVBQXVCLENBQUM7UUFFckYsZ0JBQVcsR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFO1lBQ25DLE9BQU87Z0JBQ0wsR0FBRyxFQUFFLElBQUk7Z0JBQ1QsQ0FBQyxPQUFPLElBQUksQ0FBQyxLQUFLLEVBQUUsRUFBRSxDQUFDLEVBQUUsQ0FBQyxDQUFDLElBQUksQ0FBQyxLQUFLLEVBQUUsSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLEVBQUU7Z0JBQzFELENBQUMsT0FBTyxJQUFJLENBQUMsT0FBTyxFQUFFLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFLElBQUksQ0FBQyxJQUFJLENBQUMsS0FBSyxFQUFFO2dCQUM1RCxDQUFDLE9BQU8sSUFBSSxDQUFDLE9BQU8sRUFBRSxJQUFJLElBQUksQ0FBQyxLQUFLLEVBQUUsRUFBRSxDQUFDLEVBQUUsQ0FBQyxDQUFDLElBQUksQ0FBQyxPQUFPLEVBQUUsSUFBSSxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssRUFBRTtnQkFDN0UsQ0FBQyxPQUFPLElBQUksQ0FBQyxJQUFJLEVBQUUsRUFBRSxDQUFDLEVBQUUsQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLEVBQUU7Z0JBQ3JDLENBQUMsR0FBRyxJQUFJLENBQUMsS0FBSyxFQUFFLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUMsS0FBSyxFQUFFO2dCQUNuQyxNQUFNLEVBQUUsSUFBSSxDQUFDLE1BQU0sRUFBRTtnQkFDckIsUUFBUSxFQUFFLElBQUksQ0FBQyxTQUFTLEVBQUU7YUFDQSxDQUFDO1FBQy9CLENBQUMsQ0FBQyxDQUFDO1FBRU0sY0FBUyxHQUFHLFFBQVEsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxJQUFJLENBQUMsUUFBUSxFQUFFLENBQUMsQ0FBQztRQUU1QyxpQkFBWSxHQUFHLFFBQVEsQ0FBQyxHQUFHLEVBQUU7WUFDcEMsT0FBTyxJQUFJLENBQUMsU0FBUyxFQUFFLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDO1FBQ3hDLENBQUMsQ0FBQyxDQUFDO1FBRU0saUJBQVksR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFO1lBQ3BDLE9BQU8sSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQztRQUN0QyxDQUFDLENBQUMsQ0FBQztRQUVNLGFBQVEsR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFO1lBQ2hDLE9BQU8sSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQztRQUN4QyxDQUFDLENBQUMsQ0FBQztRQUVNLGFBQVEsR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFO1lBQ2hDLE9BQWdCLElBQUksQ0FBQyxNQUFNLEVBQUUsSUFBSSxJQUFJLENBQUM7UUFDeEMsQ0FBQyxDQUFDLENBQUM7S0FDSjsrR0EzRVksZUFBZTttR0FBZixlQUFlOzs0RkFBZixlQUFlO2tCQWQzQixTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxXQUFXO29CQUNyQixRQUFRLEVBQUUsU0FBUztvQkFDbkIsVUFBVSxFQUFFLElBQUk7b0JBQ2hCLElBQUksRUFBRTt3QkFDSixLQUFLLEVBQUUsS0FBSzt3QkFDWixTQUFTLEVBQUUsZUFBZTt3QkFDMUIsc0JBQXNCLEVBQUUsZ0JBQWdCO3dCQUN4QyxxQkFBcUIsRUFBRSxZQUFZO3dCQUNuQyxpQkFBaUIsRUFBRSxnQkFBZ0I7d0JBQ25DLGlCQUFpQixFQUFFLFlBQVk7d0JBQy9CLGFBQWEsRUFBRSxRQUFRO3FCQUN4QjtpQkFDRiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGJvb2xlYW5BdHRyaWJ1dGUsIGNvbXB1dGVkLCBEaXJlY3RpdmUsIGlucHV0LCBJbnB1dFNpZ25hbCwgSW5wdXRTaWduYWxXaXRoVHJhbnNmb3JtIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmltcG9ydCB7IEJ1dHRvblR5cGUsIENvbG9ycywgU2hhcGVzIH0gZnJvbSAnLi4vY29yZXVpLnR5cGVzJztcblxuQERpcmVjdGl2ZSh7XG4gIHNlbGVjdG9yOiAnW2NCdXR0b25dJyxcbiAgZXhwb3J0QXM6ICdjQnV0dG9uJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaG9zdDoge1xuICAgIGNsYXNzOiAnYnRuJyxcbiAgICAnW2NsYXNzXSc6ICdob3N0Q2xhc3NlcygpJyxcbiAgICAnW2F0dHIuYXJpYS1kaXNhYmxlZF0nOiAnYXJpYURpc2FibGVkKCknLFxuICAgICdbYXR0ci5hcmlhLXByZXNzZWRdJzogJ2lzQWN0aXZlKCknLFxuICAgICdbYXR0ci5kaXNhYmxlZF0nOiAnYXR0ckRpc2FibGVkKCknLFxuICAgICdbYXR0ci50YWJpbmRleF0nOiAndGFiSW5kZXgoKScsXG4gICAgJ1thdHRyLnR5cGVdJzogJ3R5cGUoKSdcbiAgfVxufSlcbmV4cG9ydCBjbGFzcyBCdXR0b25EaXJlY3RpdmUge1xuICAvKipcbiAgICogVG9nZ2xlIHRoZSBhY3RpdmUgc3RhdGUgZm9yIHRoZSBjb21wb25lbnQuIFtkb2NzXVxuICAgKiBAdHlwZSBJbnB1dFNpZ25hbFdpdGhUcmFuc2Zvcm08Ym9vbGVhbiwgdW5rbm93bj5cbiAgICovXG4gIHJlYWRvbmx5IGFjdGl2ZTogSW5wdXRTaWduYWxXaXRoVHJhbnNmb3JtPGJvb2xlYW4sIHVua25vd24+ID0gaW5wdXQoZmFsc2UsIHsgdHJhbnNmb3JtOiBib29sZWFuQXR0cmlidXRlIH0pO1xuXG4gIC8qKlxuICAgKiBTZXRzIHRoZSBjb2xvciBjb250ZXh0IG9mIHRoZSBjb21wb25lbnQgdG8gb25lIG9mIENvcmVVSeKAmXMgdGhlbWVkIGNvbG9ycy4gW2RvY3NdXG4gICAqIEB0eXBlIElucHV0U2lnbmFsPENvbG9ycz5cbiAgICovXG4gIHJlYWRvbmx5IGNvbG9yOiBJbnB1dFNpZ25hbDxDb2xvcnM+ID0gaW5wdXQ8Q29sb3JzPigncHJpbWFyeScpO1xuXG4gIC8qKlxuICAgKiBUb2dnbGUgdGhlIGRpc2FibGVkIHN0YXRlIGZvciB0aGUgY29tcG9uZW50LlxuICAgKiBAdHlwZSBJbnB1dFNpZ25hbFdpdGhUcmFuc2Zvcm08Ym9vbGVhbiwgdW5rbm93bj5cbiAgICovXG4gIHJlYWRvbmx5IGRpc2FibGVkOiBJbnB1dFNpZ25hbFdpdGhUcmFuc2Zvcm08Ym9vbGVhbiwgdW5rbm93bj4gPSBpbnB1dChmYWxzZSwgeyB0cmFuc2Zvcm06IGJvb2xlYW5BdHRyaWJ1dGUgfSk7XG5cbiAgLyoqXG4gICAqIFNlbGVjdCB0aGUgc2hhcGUgb2YgdGhlIGNvbXBvbmVudC5cbiAgICogQHR5cGUgSW5wdXRTaWduYWw8U2hhcGVzPlxuICAgKi9cbiAgcmVhZG9ubHkgc2hhcGU6IElucHV0U2lnbmFsPFNoYXBlcyB8IHVuZGVmaW5lZD4gPSBpbnB1dDxTaGFwZXM+KCk7XG5cbiAgLyoqXG4gICAqIFNpemUgdGhlIGNvbXBvbmVudCBzbWFsbCBvciBsYXJnZS5cbiAgICogQHR5cGUgSW5wdXRTaWduYWw8J3NtJyB8ICdsZycgfCAnJz5cbiAgICovXG4gIHJlYWRvbmx5IHNpemU6IElucHV0U2lnbmFsPCcnIHwgJ3NtJyB8ICdsZyc+ID0gaW5wdXQ8JycgfCAnc20nIHwgJ2xnJz4oJycpO1xuXG4gIC8qKlxuICAgKiBTcGVjaWZpZXMgdGhlIHR5cGUgb2YgYnV0dG9uLiBBbHdheXMgc3BlY2lmeSB0aGUgdHlwZSBhdHRyaWJ1dGUgZm9yIHRoZSBgPGJ1dHRvbj5gIGVsZW1lbnQuXG4gICAqIERpZmZlcmVudCBicm93c2VycyBtYXkgdXNlIGRpZmZlcmVudCBkZWZhdWx0IHR5cGVzIGZvciB0aGUgYDxidXR0b24+YCBlbGVtZW50LlxuICAgKiBAdHlwZSBJbnB1dFNpZ25hbDxCdXR0b25UeXBlPlxuICAgKiBAZGVmYXVsdCAnYnV0dG9uJ1xuICAgKi9cbiAgcmVhZG9ubHkgdHlwZTogSW5wdXRTaWduYWw8QnV0dG9uVHlwZT4gPSBpbnB1dDxCdXR0b25UeXBlPignYnV0dG9uJyk7XG5cbiAgLyoqXG4gICAqIFNldCB0aGUgYnV0dG9uIHZhcmlhbnQgdG8gYW4gb3V0bGluZWQgYnV0dG9uIG9yIGEgZ2hvc3QgYnV0dG9uLlxuICAgKiBAdHlwZSBJbnB1dFNpZ25hbDwnZ2hvc3QnIHwgJ291dGxpbmUnIHwgdW5kZWZpbmVkPlxuICAgKi9cbiAgcmVhZG9ubHkgdmFyaWFudDogSW5wdXRTaWduYWw8J2dob3N0JyB8ICdvdXRsaW5lJyB8IHVuZGVmaW5lZD4gPSBpbnB1dDwnZ2hvc3QnIHwgJ291dGxpbmUnPigpO1xuXG4gIHJlYWRvbmx5IGhvc3RDbGFzc2VzID0gY29tcHV0ZWQoKCkgPT4ge1xuICAgIHJldHVybiB7XG4gICAgICBidG46IHRydWUsXG4gICAgICBbYGJ0bi0ke3RoaXMuY29sb3IoKX1gXTogISF0aGlzLmNvbG9yKCkgJiYgIXRoaXMudmFyaWFudCgpLFxuICAgICAgW2BidG4tJHt0aGlzLnZhcmlhbnQoKX1gXTogISF0aGlzLnZhcmlhbnQoKSAmJiAhdGhpcy5jb2xvcigpLFxuICAgICAgW2BidG4tJHt0aGlzLnZhcmlhbnQoKX0tJHt0aGlzLmNvbG9yKCl9YF06ICEhdGhpcy52YXJpYW50KCkgJiYgISF0aGlzLmNvbG9yKCksXG4gICAgICBbYGJ0bi0ke3RoaXMuc2l6ZSgpfWBdOiAhIXRoaXMuc2l6ZSgpLFxuICAgICAgW2Ake3RoaXMuc2hhcGUoKX1gXTogISF0aGlzLnNoYXBlKCksXG4gICAgICBhY3RpdmU6IHRoaXMuYWN0aXZlKCksXG4gICAgICBkaXNhYmxlZDogdGhpcy5fZGlzYWJsZWQoKVxuICAgIH0gYXMgUmVjb3JkPHN0cmluZywgYm9vbGVhbj47XG4gIH0pO1xuXG4gIHJlYWRvbmx5IF9kaXNhYmxlZCA9IGNvbXB1dGVkKCgpID0+IHRoaXMuZGlzYWJsZWQoKSk7XG5cbiAgcmVhZG9ubHkgYXJpYURpc2FibGVkID0gY29tcHV0ZWQoKCkgPT4ge1xuICAgIHJldHVybiB0aGlzLl9kaXNhYmxlZCgpID8gdHJ1ZSA6IG51bGw7XG4gIH0pO1xuXG4gIHJlYWRvbmx5IGF0dHJEaXNhYmxlZCA9IGNvbXB1dGVkKCgpID0+IHtcbiAgICByZXR1cm4gdGhpcy5fZGlzYWJsZWQoKSA/ICcnIDogbnVsbDtcbiAgfSk7XG5cbiAgcmVhZG9ubHkgdGFiSW5kZXggPSBjb21wdXRlZCgoKSA9PiB7XG4gICAgcmV0dXJuIHRoaXMuX2Rpc2FibGVkKCkgPyAnLTEnIDogbnVsbDtcbiAgfSk7XG5cbiAgcmVhZG9ubHkgaXNBY3RpdmUgPSBjb21wdXRlZCgoKSA9PiB7XG4gICAgcmV0dXJuIDxib29sZWFuPnRoaXMuYWN0aXZlKCkgfHwgbnVsbDtcbiAgfSk7XG59XG4iXX0=