@taiga-ui/kit
Version:
Taiga UI Angular main components kit
119 lines (114 loc) • 6.39 kB
JavaScript
import { __extends, __decorate, __param } from 'tslib';
import { Optional, Self, Inject, ChangeDetectorRef, Input, HostBinding, ViewChild, Component, ChangeDetectionStrategy, forwardRef, NgModule } from '@angular/core';
import { NgControl } from '@angular/forms';
import { isNativeFocused, tuiDefaultProp, TUI_FOCUSABLE_ITEM_ACCESSOR, AbstractTuiNullableControl, TuiCheckedModule, TuiFocusableModule, TuiFocusedModule, TuiHoveredModule, TuiPressedModule, TuiFocusVisibleModule } from '@taiga-ui/cdk';
import { TUI_CHECKBOX_OPTIONS, TuiPrimitiveCheckboxModule } from '@taiga-ui/core';
import { CommonModule } from '@angular/common';
var TuiCheckboxComponent = /** @class */ (function (_super) {
__extends(TuiCheckboxComponent, _super);
function TuiCheckboxComponent(control, options, changeDetectorRef) {
var _this = _super.call(this, control, changeDetectorRef) || this;
_this.options = options;
_this.size = _this.options.size;
return _this;
}
TuiCheckboxComponent_1 = TuiCheckboxComponent;
Object.defineProperty(TuiCheckboxComponent.prototype, "nativeFocusableElement", {
get: function () {
return !this.focusableElement || this.computedDisabled
? null
: this.focusableElement.nativeElement;
},
enumerable: true,
configurable: true
});
Object.defineProperty(TuiCheckboxComponent.prototype, "focused", {
get: function () {
return isNativeFocused(this.nativeFocusableElement);
},
enumerable: true,
configurable: true
});
Object.defineProperty(TuiCheckboxComponent.prototype, "computedFocusable", {
get: function () {
return !this.computedDisabled && !this.readOnly && this.focusable;
},
enumerable: true,
configurable: true
});
TuiCheckboxComponent.prototype.onChecked = function (checked) {
this.updateValue(checked);
};
TuiCheckboxComponent.prototype.onFocused = function (focused) {
this.updateFocused(focused);
};
TuiCheckboxComponent.prototype.onHovered = function (hovered) {
this.updateHovered(hovered);
};
TuiCheckboxComponent.prototype.onPressed = function (pressed) {
this.updatePressed(pressed);
};
TuiCheckboxComponent.prototype.onFocusVisible = function (focusVisible) {
this.updateFocusVisible(focusVisible);
};
var TuiCheckboxComponent_1;
TuiCheckboxComponent.ctorParameters = function () { return [
{ type: NgControl, decorators: [{ type: Optional }, { type: Self }, { type: Inject, args: [NgControl,] }] },
{ type: undefined, decorators: [{ type: Inject, args: [TUI_CHECKBOX_OPTIONS,] }] },
{ type: ChangeDetectorRef, decorators: [{ type: Inject, args: [ChangeDetectorRef,] }] }
]; };
__decorate([
Input(),
HostBinding('attr.data-tui-host-size'),
tuiDefaultProp()
], TuiCheckboxComponent.prototype, "size", void 0);
__decorate([
ViewChild('focusableElement')
], TuiCheckboxComponent.prototype, "focusableElement", void 0);
TuiCheckboxComponent = TuiCheckboxComponent_1 = __decorate([
Component({
selector: 'tui-checkbox',
template: "<tui-primitive-checkbox\n [size]=\"size\"\n [disabled]=\"disabled\"\n [focused]=\"computedFocusVisible\"\n [hovered]=\"computedHovered\"\n [pressed]=\"computedPressed\"\n [invalid]=\"computedInvalid\"\n [value]=\"value\"\n></tui-primitive-checkbox>\n<input\n #focusableElement\n type=\"checkbox\"\n automation-id=\"tui-checkbox__native\"\n class=\"native\"\n [disabled]=\"disabled\"\n [id]=\"id\"\n [tuiChecked]=\"value\"\n [tuiFocusable]=\"computedFocusable\"\n (tuiFocusedChange)=\"onFocused($event)\"\n (tuiHoveredChange)=\"onHovered($event)\"\n (tuiPressedChange)=\"onPressed($event)\"\n (tuiCheckedChange)=\"onChecked($event)\"\n (tuiFocusVisibleChange)=\"onFocusVisible($event)\"\n/>\n",
changeDetection: ChangeDetectionStrategy.OnPush,
providers: [
{
provide: TUI_FOCUSABLE_ITEM_ACCESSOR,
useExisting: forwardRef(function () { return TuiCheckboxComponent_1; }),
},
],
styles: [":host{font:var(--tui-font-text-s);color:var(--tui-text-01);position:relative;display:block;flex-shrink:0}:host[data-tui-host-size='m']{width:16px;height:16px}:host[data-tui-host-size='l']{width:24px;height:24px}.native{padding:0;border:0;border-radius:inherit;background:0 0;font-size:inherit;line-height:inherit;font-weight:inherit;color:inherit;caret-color:currentColor;outline:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;word-break:keep-all;-webkit-text-fill-color:currentColor;position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer}.native:-webkit-autofill,.native:-webkit-autofill:focus,.native:-webkit-autofill:hover{border-radius:inherit;-webkit-text-fill-color:inherit!important;color:inherit!important;background-color:transparent!important;-webkit-box-shadow:0 0 0 1000px var(--tui-autofill) inset!important}:host._disabled .native,:host._readonly .native{pointer-events:none}"]
}),
__param(0, Optional()),
__param(0, Self()),
__param(0, Inject(NgControl)),
__param(1, Inject(TUI_CHECKBOX_OPTIONS)),
__param(2, Inject(ChangeDetectorRef))
], TuiCheckboxComponent);
return TuiCheckboxComponent;
}(AbstractTuiNullableControl));
var TuiCheckboxModule = /** @class */ (function () {
function TuiCheckboxModule() {
}
TuiCheckboxModule = __decorate([
NgModule({
imports: [
CommonModule,
TuiCheckedModule,
TuiFocusableModule,
TuiFocusedModule,
TuiHoveredModule,
TuiPressedModule,
TuiFocusVisibleModule,
TuiPrimitiveCheckboxModule,
],
declarations: [TuiCheckboxComponent],
exports: [TuiCheckboxComponent],
})
], TuiCheckboxModule);
return TuiCheckboxModule;
}());
/**
* Generated bundle index. Do not edit.
*/
export { TuiCheckboxComponent, TuiCheckboxModule };
//# sourceMappingURL=taiga-ui-kit-components-checkbox.js.map