UNPKG

@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>

114 lines 8.84 kB
/** * @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++; /** * Set to `true` to display a loading label. */ this.skeleton = false; /** * Set to `true` to display the invalid state. */ this.invalid = false; /** * Set to `true` to display the valid state. */ 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 }], 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; /** * Set to `true` to display a loading label. * @type {?} */ Label.prototype.skeleton; /** * Sets the label helper text. * @type {?} */ Label.prototype.helperText; /** * Sets the invalid text to display when the label is invalid. * @type {?} */ Label.prototype.invalidText; /** * Set to `true` to display the invalid state. * @type {?} */ Label.prototype.invalid; /** * Set to `true` to display the valid state. * @type {?} */ Label.prototype.valid; /** @type {?} */ Label.prototype.wrapper; /** @type {?} */ Label.prototype.labelClass; } //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGFiZWwuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGt1c2hraS9uZy1zdWthLyIsInNvdXJjZXMiOlsibGliL2lucHV0L2xhYmVsLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7OztBQUVBLE9BQU8sRUFDTCxTQUFTLEVBQ1QsS0FBSyxFQUVMLFVBQVUsRUFDVixXQUFXLEVBQ1gsV0FBVyxFQUNYLFNBQVMsRUFDVixNQUFNLGVBQWUsQ0FBQztBQUV2QjtJQXVERTs7OztRQXhCUyxPQUFFLEdBQUcsV0FBUyxLQUFLLENBQUMsWUFBWSxFQUFJLENBQUM7Ozs7UUFJckMsYUFBUSxHQUFHLEtBQUssQ0FBQzs7OztRQVlqQixZQUFPLEdBQUcsS0FBSyxDQUFDOzs7O1FBSWhCLFVBQUssR0FBRyxLQUFLLENBQUM7UUFFUyxlQUFVLEdBQUcsSUFBSSxDQUFDO1FBR2hELEtBQUssQ0FBQyxZQUFZLEVBQUUsQ0FBQztJQUN2QixDQUFDOzs7O0lBRUQsa0NBQWtCOzs7SUFBbEI7UUFDRSxJQUFJLENBQUMsT0FBTyxDQUFDLGFBQWEsQ0FBQyxhQUFhLENBQUMsb0JBQW9CLENBQUMsQ0FBQyxZQUFZLENBQUMsSUFBSSxFQUFFLElBQUksQ0FBQyxFQUFFLENBQUMsQ0FBQztJQUM3RixDQUFDOzs7OztJQUVNLDBCQUFVOzs7O0lBQWpCLFVBQWtCLEtBQUs7UUFDckIsT0FBTyxLQUFLLFlBQVksV0FBVyxDQUFDO0lBQ3RDLENBQUM7Ozs7SUF0Q00sa0JBQVksR0FBRyxDQUFDLENBQUM7O2dCQTNCekIsU0FBUyxTQUFDO29CQUNULFFBQVEsRUFBRSxZQUFZO29CQUN0QixRQUFRLEVBQUUscTdCQW1CVDtpQkFDRjs7Ozs7cUJBU0UsS0FBSzsyQkFJTCxLQUFLOzZCQUlMLEtBQUs7OEJBSUwsS0FBSzswQkFJTCxLQUFLO3dCQUlMLEtBQUs7MEJBQ0wsU0FBUyxTQUFDLFNBQVMsRUFBRSxFQUFFLE1BQU0sRUFBRSxJQUFJLEVBQUU7NkJBQ3JDLFdBQVcsU0FBQyxpQkFBaUI7O0lBYWhDLFlBQUM7Q0FBQSxBQWxFRCxJQWtFQztTQTNDWSxLQUFLOzs7Ozs7SUFJaEIsbUJBQXdCOzs7OztJQUl4QixtQkFBOEM7Ozs7O0lBSTlDLHlCQUEwQjs7Ozs7SUFJMUIsMkJBQTRCOzs7OztJQUk1Qiw0QkFBZ0Q7Ozs7O0lBSWhELHdCQUF5Qjs7Ozs7SUFJekIsc0JBQXVCOztJQUN2Qix3QkFBNEU7O0lBQzVFLDJCQUFrRCIsInNvdXJjZXNDb250ZW50IjpbIi8vIHRzbGludDpkaXNhYmxlOiBtYXgtbGluZS1sZW5ndGhcblxuaW1wb3J0IHtcbiAgQ29tcG9uZW50LFxuICBJbnB1dCxcbiAgQWZ0ZXJDb250ZW50SW5pdCxcbiAgRWxlbWVudFJlZixcbiAgSG9zdEJpbmRpbmcsXG4gIFRlbXBsYXRlUmVmLFxuICBWaWV3Q2hpbGRcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3N1a2EtbGFiZWwnLFxuICB0ZW1wbGF0ZTogYFxuICAgIDxsYWJlbFxuICAgICAgW2Zvcl09XCJpZFwiXG4gICAgICBjbGFzcz1cImxhYmVsXCJcbiAgICAgIFtuZ0NsYXNzXT1cIntcbiAgICAgICAgJ3NrZWxldG9uJzogc2tlbGV0b25cbiAgICAgIH1cIj5cbiAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgICA8L2xhYmVsPlxuICAgIDxkaXYgKm5nSWY9XCIhc2tlbGV0b24gJiYgaGVscGVyVGV4dFwiIGNsYXNzPVwiZm9ybV9faGVscGVyLXRleHRcIj57e2hlbHBlclRleHR9fTwvZGl2PlxuICAgIDxkaXYgY2xhc3M9XCJ0ZXh0LWlucHV0X19maWVsZC13cmFwcGVyXCIgW2F0dHIuZGF0YS1pbnZhbGlkXT1cIihpbnZhbGlkID8gdHJ1ZSA6IG51bGwpXCIgI3dyYXBwZXI+XG4gICAgICA8c3VrYS1pY29uICpuZ0lmPVwiaW52YWxpZFwiIGljb249XCJhbGVydC1jaXJjbGVcIiBjbGFzcz1cInRleHQtaW5wdXRfX2ludmFsaWQtaWNvbiB0ZXh0LWFyZWFfX2ludmFsaWQtaWNvblwiPjwvc3VrYS1pY29uPlxuICAgICAgPHN1a2EtaWNvbiAqbmdJZj1cInZhbGlkXCIgaWNvbj1cImNoZWNrXCIgY2xhc3M9XCJ0ZXh0LWlucHV0X192YWxpZC1pY29uIHRleHQtYXJlYV9fdmFsaWQtaWNvblwiPjwvc3VrYS1pY29uPlxuICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiaW5wdXQsdGV4dGFyZWEsZGl2XCI+PC9uZy1jb250ZW50PlxuICAgIDwvZGl2PlxuICAgIDxkaXYgKm5nSWY9XCJpbnZhbGlkXCIgY2xhc3M9XCJmb3JtLXJlcXVpcmVtZW50XCI+XG4gICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiIWlzVGVtcGxhdGUoaW52YWxpZFRleHQpXCI+e3tpbnZhbGlkVGV4dH19PC9uZy1jb250YWluZXI+XG4gICAgICA8bmctdGVtcGxhdGUgKm5nSWY9XCJpc1RlbXBsYXRlKGludmFsaWRUZXh0KVwiIFtuZ1RlbXBsYXRlT3V0bGV0XT1cImludmFsaWRUZXh0XCI+PC9uZy10ZW1wbGF0ZT5cbiAgICA8L2Rpdj5cbiAgYFxufSlcbmV4cG9ydCBjbGFzcyBMYWJlbCBpbXBsZW1lbnRzIEFmdGVyQ29udGVudEluaXQge1xuICAvKipcbiAgICogVXNlZCB0byBidWlsZCB0aGUgaWQgb2YgdGhlIGlucHV0IGl0ZW0gYXNzb2NpYXRlZCB3aXRoIHRoZSBgTGFiZWxgLlxuICAgKi9cbiAgc3RhdGljIGxhYmVsQ291bnRlciA9IDA7XG4gIC8qKlxuICAgKiBTZXRzIHRoZSB1bmlxdWUgSUQuIERlZmF1bHRzIHRvIGBpbnB1dC0ke3RvdGFsIGNvdW50IG9mIHNlbGVjdHMgaW5zdGFudGlhdGVkfWBcbiAgICovXG4gIEBJbnB1dCgpIGlkID0gYGlucHV0LSR7TGFiZWwubGFiZWxDb3VudGVyKyt9YDtcbiAgLyoqXG4gICAqIFNldCB0byBgdHJ1ZWAgdG8gZGlzcGxheSBhIGxvYWRpbmcgbGFiZWwuXG4gICAqL1xuICBASW5wdXQoKSBza2VsZXRvbiA9IGZhbHNlO1xuICAvKipcbiAgICogU2V0cyB0aGUgbGFiZWwgaGVscGVyIHRleHQuXG4gICAqL1xuICBASW5wdXQoKSBoZWxwZXJUZXh0OiBzdHJpbmc7XG4gIC8qKlxuICAgKiBTZXRzIHRoZSBpbnZhbGlkIHRleHQgdG8gZGlzcGxheSB3aGVuIHRoZSBsYWJlbCBpcyBpbnZhbGlkLlxuICAgKi9cbiAgQElucHV0KCkgaW52YWxpZFRleHQ6IHN0cmluZyB8IFRlbXBsYXRlUmVmPGFueT47XG4gIC8qKlxuICAgKiBTZXQgdG8gYHRydWVgIHRvIGRpc3BsYXkgdGhlIGludmFsaWQgc3RhdGUuXG4gICAqL1xuICBASW5wdXQoKSBpbnZhbGlkID0gZmFsc2U7XG4gIC8qKlxuICAgKiBTZXQgdG8gYHRydWVgIHRvIGRpc3BsYXkgdGhlIHZhbGlkIHN0YXRlLlxuICAgKi9cbiAgQElucHV0KCkgdmFsaWQgPSBmYWxzZTtcbiAgQFZpZXdDaGlsZCgnd3JhcHBlcicsIHsgc3RhdGljOiB0cnVlIH0pIHdyYXBwZXI6IEVsZW1lbnRSZWY8SFRNTERpdkVsZW1lbnQ+O1xuICBASG9zdEJpbmRpbmcoJ2NsYXNzLmZvcm0taXRlbScpIGxhYmVsQ2xhc3MgPSB0cnVlO1xuXG4gIGNvbnN0cnVjdG9yKCkge1xuICAgIExhYmVsLmxhYmVsQ291bnRlcisrO1xuICB9XG5cbiAgbmdBZnRlckNvbnRlbnRJbml0KCkge1xuICAgIHRoaXMud3JhcHBlci5uYXRpdmVFbGVtZW50LnF1ZXJ5U2VsZWN0b3IoJ2lucHV0LHRleHRhcmVhLGRpdicpLnNldEF0dHJpYnV0ZSgnaWQnLCB0aGlzLmlkKTtcbiAgfVxuXG4gIHB1YmxpYyBpc1RlbXBsYXRlKHZhbHVlKSB7XG4gICAgcmV0dXJuIHZhbHVlIGluc3RhbmNlb2YgVGVtcGxhdGVSZWY7XG4gIH1cbn1cbiJdfQ==