@kushki/ng-suka
Version:
<p align="center"> <h1 align="center">Suka Components Angular</h1> <p align="center"> An Angular implementation of the Suka Design System </p> </p>
94 lines • 8.19 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
// tslint:disable: max-line-length
import { Component, Input, ElementRef, HostBinding, TemplateRef, ViewChild } from '@angular/core';
var Label = /** @class */ (function () {
function Label() {
/**
* Sets the unique ID. Defaults to `input-${total count of selects instantiated}`
*/
this.id = "input-" + Label.labelCounter++;
this.labelState = '';
this.skeleton = false;
this.invalid = false;
this.valid = false;
this.labelClass = true;
Label.labelCounter++;
}
/**
* @return {?}
*/
Label.prototype.ngAfterContentInit = /**
* @return {?}
*/
function () {
this.wrapper.nativeElement.querySelector('input,textarea,div').setAttribute('id', this.id);
};
/**
* @param {?} value
* @return {?}
*/
Label.prototype.isTemplate = /**
* @param {?} value
* @return {?}
*/
function (value) {
return value instanceof TemplateRef;
};
/**
* Used to build the id of the input item associated with the `Label`.
*/
Label.labelCounter = 0;
Label.decorators = [
{ type: Component, args: [{
selector: 'suka-label',
template: "\n <label\n [for]=\"id\"\n class=\"label\"\n [ngClass]=\"{\n 'skeleton': skeleton\n }\">\n <ng-content></ng-content>\n </label>\n <div *ngIf=\"!skeleton && helperText\" class=\"form__helper-text\">{{helperText}}</div>\n <div class=\"text-input__field-wrapper\" [attr.data-invalid]=\"(invalid ? true : null)\" #wrapper>\n <suka-icon *ngIf=\"invalid\" icon=\"alert-circle\" class=\"text-input__invalid-icon text-area__invalid-icon\"></suka-icon>\n <suka-icon *ngIf=\"valid\" icon=\"check\" class=\"text-input__valid-icon text-area__valid-icon\"></suka-icon>\n <ng-content select=\"input,textarea,div\"></ng-content>\n </div>\n <div *ngIf=\"invalid\" class=\"form-requirement\">\n <ng-container *ngIf=\"!isTemplate(invalidText)\">{{invalidText}}</ng-container>\n <ng-template *ngIf=\"isTemplate(invalidText)\" [ngTemplateOutlet]=\"invalidText\"></ng-template>\n </div>\n "
}] }
];
/** @nocollapse */
Label.ctorParameters = function () { return []; };
Label.propDecorators = {
id: [{ type: Input }],
labelState: [{ type: Input }],
skeleton: [{ type: Input }],
helperText: [{ type: Input }],
invalidText: [{ type: Input }],
invalid: [{ type: Input }],
valid: [{ type: Input }],
wrapper: [{ type: ViewChild, args: ['wrapper', { static: true },] }],
labelClass: [{ type: HostBinding, args: ['class.form-item',] }]
};
return Label;
}());
export { Label };
if (false) {
/**
* Used to build the id of the input item associated with the `Label`.
* @type {?}
*/
Label.labelCounter;
/**
* Sets the unique ID. Defaults to `input-${total count of selects instantiated}`
* @type {?}
*/
Label.prototype.id;
/** @type {?} */
Label.prototype.labelState;
/** @type {?} */
Label.prototype.skeleton;
/** @type {?} */
Label.prototype.helperText;
/** @type {?} */
Label.prototype.invalidText;
/** @type {?} */
Label.prototype.invalid;
/** @type {?} */
Label.prototype.valid;
/** @type {?} */
Label.prototype.wrapper;
/** @type {?} */
Label.prototype.labelClass;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGFiZWwuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGt1c2hraS9uZy1zdWthLyIsInNvdXJjZXMiOlsibGliL2lucHV0L2xhYmVsLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7OztBQUVBLE9BQU8sRUFDTCxTQUFTLEVBQ1QsS0FBSyxFQUVMLFVBQVUsRUFDVixXQUFXLEVBQ1gsV0FBVyxFQUNYLFNBQVMsRUFDVixNQUFNLGVBQWUsQ0FBQztBQUV2QjtJQTBDRTs7OztRQVZTLE9BQUUsR0FBRyxXQUFTLEtBQUssQ0FBQyxZQUFZLEVBQUksQ0FBQztRQUNyQyxlQUFVLEdBQXlDLEVBQUUsQ0FBQztRQUN0RCxhQUFRLEdBQUcsS0FBSyxDQUFDO1FBR2pCLFlBQU8sR0FBRyxLQUFLLENBQUM7UUFDaEIsVUFBSyxHQUFHLEtBQUssQ0FBQztRQUVTLGVBQVUsR0FBRyxJQUFJLENBQUM7UUFHaEQsS0FBSyxDQUFDLFlBQVksRUFBRSxDQUFDO0lBQ3ZCLENBQUM7Ozs7SUFFRCxrQ0FBa0I7OztJQUFsQjtRQUNFLElBQUksQ0FBQyxPQUFPLENBQUMsYUFBYSxDQUFDLGFBQWEsQ0FBQyxvQkFBb0IsQ0FBQyxDQUFDLFlBQVksQ0FBQyxJQUFJLEVBQUUsSUFBSSxDQUFDLEVBQUUsQ0FBQyxDQUFDO0lBQzdGLENBQUM7Ozs7O0lBRU0sMEJBQVU7Ozs7SUFBakIsVUFBa0IsS0FBSztRQUNyQixPQUFPLEtBQUssWUFBWSxXQUFXLENBQUM7SUFDdEMsQ0FBQzs7OztJQXhCTSxrQkFBWSxHQUFHLENBQUMsQ0FBQzs7Z0JBNUJ6QixTQUFTLFNBQUM7b0JBQ1QsUUFBUSxFQUFFLFlBQVk7b0JBQ3RCLFFBQVEsRUFBRSxxN0JBbUJUO2lCQUNGOzs7OztxQkFVRSxLQUFLOzZCQUNMLEtBQUs7MkJBQ0wsS0FBSzs2QkFDTCxLQUFLOzhCQUNMLEtBQUs7MEJBQ0wsS0FBSzt3QkFDTCxLQUFLOzBCQUNMLFNBQVMsU0FBQyxTQUFTLEVBQUUsRUFBRSxNQUFNLEVBQUUsSUFBSSxFQUFFOzZCQUNyQyxXQUFXLFNBQUMsaUJBQWlCOztJQWFoQyxZQUFDO0NBQUEsQUFyREQsSUFxREM7U0E3QlksS0FBSzs7Ozs7O0lBSWhCLG1CQUF3Qjs7Ozs7SUFJeEIsbUJBQThDOztJQUM5QywyQkFBK0Q7O0lBQy9ELHlCQUEwQjs7SUFDMUIsMkJBQTRCOztJQUM1Qiw0QkFBZ0Q7O0lBQ2hELHdCQUF5Qjs7SUFDekIsc0JBQXVCOztJQUN2Qix3QkFBNEU7O0lBQzVFLDJCQUFrRCIsInNvdXJjZXNDb250ZW50IjpbIi8vIHRzbGludDpkaXNhYmxlOiBtYXgtbGluZS1sZW5ndGhcblxuaW1wb3J0IHtcbiAgQ29tcG9uZW50LFxuICBJbnB1dCxcbiAgQWZ0ZXJDb250ZW50SW5pdCxcbiAgRWxlbWVudFJlZixcbiAgSG9zdEJpbmRpbmcsXG4gIFRlbXBsYXRlUmVmLFxuICBWaWV3Q2hpbGRcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3N1a2EtbGFiZWwnLFxuICB0ZW1wbGF0ZTogYFxuICAgIDxsYWJlbFxuICAgICAgW2Zvcl09XCJpZFwiXG4gICAgICBjbGFzcz1cImxhYmVsXCJcbiAgICAgIFtuZ0NsYXNzXT1cIntcbiAgICAgICAgJ3NrZWxldG9uJzogc2tlbGV0b25cbiAgICAgIH1cIj5cbiAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgICA8L2xhYmVsPlxuICAgIDxkaXYgKm5nSWY9XCIhc2tlbGV0b24gJiYgaGVscGVyVGV4dFwiIGNsYXNzPVwiZm9ybV9faGVscGVyLXRleHRcIj57e2hlbHBlclRleHR9fTwvZGl2PlxuICAgIDxkaXYgY2xhc3M9XCJ0ZXh0LWlucHV0X19maWVsZC13cmFwcGVyXCIgW2F0dHIuZGF0YS1pbnZhbGlkXT1cIihpbnZhbGlkID8gdHJ1ZSA6IG51bGwpXCIgI3dyYXBwZXI+XG4gICAgICA8c3VrYS1pY29uICpuZ0lmPVwiaW52YWxpZFwiIGljb249XCJhbGVydC1jaXJjbGVcIiBjbGFzcz1cInRleHQtaW5wdXRfX2ludmFsaWQtaWNvbiB0ZXh0LWFyZWFfX2ludmFsaWQtaWNvblwiPjwvc3VrYS1pY29uPlxuICAgICAgPHN1a2EtaWNvbiAqbmdJZj1cInZhbGlkXCIgaWNvbj1cImNoZWNrXCIgY2xhc3M9XCJ0ZXh0LWlucHV0X192YWxpZC1pY29uIHRleHQtYXJlYV9fdmFsaWQtaWNvblwiPjwvc3VrYS1pY29uPlxuICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiaW5wdXQsdGV4dGFyZWEsZGl2XCI+PC9uZy1jb250ZW50PlxuICAgIDwvZGl2PlxuICAgIDxkaXYgKm5nSWY9XCJpbnZhbGlkXCIgY2xhc3M9XCJmb3JtLXJlcXVpcmVtZW50XCI+XG4gICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiIWlzVGVtcGxhdGUoaW52YWxpZFRleHQpXCI+e3tpbnZhbGlkVGV4dH19PC9uZy1jb250YWluZXI+XG4gICAgICA8bmctdGVtcGxhdGUgKm5nSWY9XCJpc1RlbXBsYXRlKGludmFsaWRUZXh0KVwiIFtuZ1RlbXBsYXRlT3V0bGV0XT1cImludmFsaWRUZXh0XCI+PC9uZy10ZW1wbGF0ZT5cbiAgICA8L2Rpdj5cbiAgYFxufSlcbi8vIHRzbGludDpkaXNhYmxlLW5leHQtbGluZTogY29tcG9uZW50LWNsYXNzLXN1ZmZpeFxuZXhwb3J0IGNsYXNzIExhYmVsIGltcGxlbWVudHMgQWZ0ZXJDb250ZW50SW5pdCB7XG4gIC8qKlxuICAgKiBVc2VkIHRvIGJ1aWxkIHRoZSBpZCBvZiB0aGUgaW5wdXQgaXRlbSBhc3NvY2lhdGVkIHdpdGggdGhlIGBMYWJlbGAuXG4gICAqL1xuICBzdGF0aWMgbGFiZWxDb3VudGVyID0gMDtcbiAgLyoqXG4gICAqIFNldHMgdGhlIHVuaXF1ZSBJRC4gRGVmYXVsdHMgdG8gYGlucHV0LSR7dG90YWwgY291bnQgb2Ygc2VsZWN0cyBpbnN0YW50aWF0ZWR9YFxuICAgKi9cbiAgQElucHV0KCkgaWQgPSBgaW5wdXQtJHtMYWJlbC5sYWJlbENvdW50ZXIrK31gO1xuICBASW5wdXQoKSBsYWJlbFN0YXRlOiAnc3VjY2VzcycgfCAnd2FybmluZycgfCAnZXJyb3InIHwgJycgPSAnJztcbiAgQElucHV0KCkgc2tlbGV0b24gPSBmYWxzZTtcbiAgQElucHV0KCkgaGVscGVyVGV4dDogc3RyaW5nO1xuICBASW5wdXQoKSBpbnZhbGlkVGV4dDogc3RyaW5nIHwgVGVtcGxhdGVSZWY8YW55PjtcbiAgQElucHV0KCkgaW52YWxpZCA9IGZhbHNlO1xuICBASW5wdXQoKSB2YWxpZCA9IGZhbHNlO1xuICBAVmlld0NoaWxkKCd3cmFwcGVyJywgeyBzdGF0aWM6IHRydWUgfSkgd3JhcHBlcjogRWxlbWVudFJlZjxIVE1MRGl2RWxlbWVudD47XG4gIEBIb3N0QmluZGluZygnY2xhc3MuZm9ybS1pdGVtJykgbGFiZWxDbGFzcyA9IHRydWU7XG5cbiAgY29uc3RydWN0b3IoKSB7XG4gICAgTGFiZWwubGFiZWxDb3VudGVyKys7XG4gIH1cblxuICBuZ0FmdGVyQ29udGVudEluaXQoKSB7XG4gICAgdGhpcy53cmFwcGVyLm5hdGl2ZUVsZW1lbnQucXVlcnlTZWxlY3RvcignaW5wdXQsdGV4dGFyZWEsZGl2Jykuc2V0QXR0cmlidXRlKCdpZCcsIHRoaXMuaWQpO1xuICB9XG5cbiAgcHVibGljIGlzVGVtcGxhdGUodmFsdWUpIHtcbiAgICByZXR1cm4gdmFsdWUgaW5zdGFuY2VvZiBUZW1wbGF0ZVJlZjtcbiAgfVxufVxuIl19