@ng-doc/ui-kit
Version:
<!-- PROJECT LOGO --> <br /> <div align="center"> <a href="https://github.com/ng-doc/ng-doc"> <img src="https://ng-doc.com/assets/images/ng-doc.svg?raw=true" alt="Logo" height="150px"> </a>
31 lines (27 loc) • 3.45 kB
JavaScript
import * as i0 from '@angular/core';
import { Component, ChangeDetectionStrategy, HostListener } from '@angular/core';
import { DIStateControl, injectHostControl } from 'di-controls';
class NgDocButtonToggleComponent extends DIStateControl {
constructor() {
super({
host: injectHostControl(),
});
}
clickEvent() {
this.updateModel(this.checked() ? null : this.value);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: NgDocButtonToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: NgDocButtonToggleComponent, isStandalone: true, selector: "[ng-doc-button-toggle]", host: { listeners: { "click": "clickEvent()" } }, usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{font-family:var(--ng-doc-font-family);font-variant:no-contextual;color:var(--ng-doc-text);line-height:var(--ng-doc-line-height);font-size:var(--ng-doc-font-size);font-weight:var(--ng-doc-font-weight);position:relative;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border-radius:calc(var(--ng-doc-base-gutter) / 2);border:1px solid var(--ng-doc-button-border-color, transparent);padding:var(--ng-doc-button-padding, calc(var(--ng-doc-base-gutter) / 2) var(--ng-doc-base-gutter));background:var(--ng-doc-button-background)}:host:hover{text-decoration:none;border:1px solid var(--ng-doc-button-hover-border-color, var(--ng-doc-base-3))}:host[aria-checked=true]{border:1px solid var(--ng-doc-button-hover-border-color, var(--ng-doc-base-3));background:var(--ng-doc-button-checked-background, var(--ng-doc-base-1));--ng-doc-text: var(--ng-doc-heading-color)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: NgDocButtonToggleComponent, decorators: [{
type: Component,
args: [{ selector: '[ng-doc-button-toggle]', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n", styles: [":host{font-family:var(--ng-doc-font-family);font-variant:no-contextual;color:var(--ng-doc-text);line-height:var(--ng-doc-line-height);font-size:var(--ng-doc-font-size);font-weight:var(--ng-doc-font-weight);position:relative;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border-radius:calc(var(--ng-doc-base-gutter) / 2);border:1px solid var(--ng-doc-button-border-color, transparent);padding:var(--ng-doc-button-padding, calc(var(--ng-doc-base-gutter) / 2) var(--ng-doc-base-gutter));background:var(--ng-doc-button-background)}:host:hover{text-decoration:none;border:1px solid var(--ng-doc-button-hover-border-color, var(--ng-doc-base-3))}:host[aria-checked=true]{border:1px solid var(--ng-doc-button-hover-border-color, var(--ng-doc-base-3));background:var(--ng-doc-button-checked-background, var(--ng-doc-base-1));--ng-doc-text: var(--ng-doc-heading-color)}\n"] }]
}], ctorParameters: () => [], propDecorators: { clickEvent: [{
type: HostListener,
args: ['click']
}] } });
/**
* Generated bundle index. Do not edit.
*/
export { NgDocButtonToggleComponent };
//# sourceMappingURL=ng-doc-ui-kit-components-button-toggle.mjs.map