UNPKG

@carbon/icons-angular

Version:

Angular components for icons in digital and software products using the Carbon Design System

169 lines (166 loc) 9.98 kB
import { __decorate, __metadata } from 'tslib'; import { Input, Component, ElementRef, Directive, NgModule } from '@angular/core'; import { getAttributes } from '@carbon/icon-helpers'; var HttpComponent = /** @class */ (function () { function HttpComponent() { this.focusable = false; } __decorate([ Input(), __metadata("design:type", String) ], HttpComponent.prototype, "ariaLabel", void 0); __decorate([ Input(), __metadata("design:type", String) ], HttpComponent.prototype, "ariaLabelledby", void 0); __decorate([ Input(), __metadata("design:type", Boolean) ], HttpComponent.prototype, "ariaHidden", void 0); __decorate([ Input(), __metadata("design:type", String) ], HttpComponent.prototype, "title", void 0); __decorate([ Input(), __metadata("design:type", Boolean) ], HttpComponent.prototype, "focusable", void 0); __decorate([ Input(), __metadata("design:type", String) ], HttpComponent.prototype, "innerClass", void 0); __decorate([ Input(), __metadata("design:type", String) ], HttpComponent.prototype, "size", void 0); HttpComponent = __decorate([ Component({ selector: "ibm-icon-http", template: "\n <svg\n ibmIconHttp\n [size]=\"size\"\n [ariaLabel]=\"ariaLabel\"\n [ariaLabelledby]=\"ariaLabelledby\"\n [ariaHidden]=\"ariaHidden\"\n [title]=\"title\"\n [isFocusable]=\"focusable\"\n [attr.class]=\"innerClass\">\n </svg>\n " }) ], HttpComponent); return HttpComponent; }()); var HttpDirective = /** @class */ (function () { function HttpDirective(elementRef) { this.elementRef = elementRef; this.isFocusable = false; this.icons = { "32": { metadata: { "moduleName": "Http32", "filepath": "HTTP/32.js", "descriptor": { "elem": "svg", "attrs": { "xmlns": "http://www.w3.org/2000/svg", "viewBox": "0 0 32 32", "fill": "currentColor", "width": 32, "height": 32 }, "content": [{ "elem": "path", "attrs": { "d": "M30 11H25V21h2V18h3a2.0027 2.0027 0 002-2V13A2.0023 2.0023 0 0030 11zm-3 5V13h3l.001 3zM10 13L12 13 12 21 14 21 14 13 16 13 16 11 10 11 10 13zM23 11L17 11 17 13 19 13 19 21 21 21 21 13 23 13 23 11zM6 11L6 15 3 15 3 11 1 11 1 21 3 21 3 17 6 17 6 21 8 21 8 11 6 11z" } }], "name": "HTTP", "size": 32 }, "size": 32 }, svg: "<svg focusable=\"false\" preserveAspectRatio=\"xMidYMid meet\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" aria-hidden=\"true\"><path d=\"M30 11H25V21h2V18h3a2.0027 2.0027 0 002-2V13A2.0023 2.0023 0 0030 11zm-3 5V13h3l.001 3zM10 13L12 13 12 21 14 21 14 13 16 13 16 11 10 11 10 13zM23 11L17 11 17 13 19 13 19 21 21 21 21 13 23 13 23 11zM6 11L6 15 3 15 3 11 1 11 1 21 3 21 3 17 6 17 6 21 8 21 8 11 6 11z\"></path></svg>" }, "24": { metadata: { "moduleName": "Http24", "filepath": "HTTP/24.js", "descriptor": { "elem": "svg", "attrs": { "xmlns": "http://www.w3.org/2000/svg", "viewBox": "0 0 32 32", "fill": "currentColor", "width": 24, "height": 24 }, "content": [{ "elem": "path", "attrs": { "d": "M30 11H25V21h2V18h3a2.0027 2.0027 0 002-2V13A2.0023 2.0023 0 0030 11zm-3 5V13h3l.001 3zM10 13L12 13 12 21 14 21 14 13 16 13 16 11 10 11 10 13zM23 11L17 11 17 13 19 13 19 21 21 21 21 13 23 13 23 11zM6 11L6 15 3 15 3 11 1 11 1 21 3 21 3 17 6 17 6 21 8 21 8 11 6 11z" } }], "name": "HTTP", "size": 24 }, "size": 24 }, svg: "<svg focusable=\"false\" preserveAspectRatio=\"xMidYMid meet\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" width=\"24\" height=\"24\" viewBox=\"0 0 32 32\" aria-hidden=\"true\"><path d=\"M30 11H25V21h2V18h3a2.0027 2.0027 0 002-2V13A2.0023 2.0023 0 0030 11zm-3 5V13h3l.001 3zM10 13L12 13 12 21 14 21 14 13 16 13 16 11 10 11 10 13zM23 11L17 11 17 13 19 13 19 21 21 21 21 13 23 13 23 11zM6 11L6 15 3 15 3 11 1 11 1 21 3 21 3 17 6 17 6 21 8 21 8 11 6 11z\"></path></svg>" }, "20": { metadata: { "moduleName": "Http20", "filepath": "HTTP/20.js", "descriptor": { "elem": "svg", "attrs": { "xmlns": "http://www.w3.org/2000/svg", "viewBox": "0 0 32 32", "fill": "currentColor", "width": 20, "height": 20 }, "content": [{ "elem": "path", "attrs": { "d": "M30 11H25V21h2V18h3a2.0027 2.0027 0 002-2V13A2.0023 2.0023 0 0030 11zm-3 5V13h3l.001 3zM10 13L12 13 12 21 14 21 14 13 16 13 16 11 10 11 10 13zM23 11L17 11 17 13 19 13 19 21 21 21 21 13 23 13 23 11zM6 11L6 15 3 15 3 11 1 11 1 21 3 21 3 17 6 17 6 21 8 21 8 11 6 11z" } }], "name": "HTTP", "size": 20 }, "size": 20 }, svg: "<svg focusable=\"false\" preserveAspectRatio=\"xMidYMid meet\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" width=\"20\" height=\"20\" viewBox=\"0 0 32 32\" aria-hidden=\"true\"><path d=\"M30 11H25V21h2V18h3a2.0027 2.0027 0 002-2V13A2.0023 2.0023 0 0030 11zm-3 5V13h3l.001 3zM10 13L12 13 12 21 14 21 14 13 16 13 16 11 10 11 10 13zM23 11L17 11 17 13 19 13 19 21 21 21 21 13 23 13 23 11zM6 11L6 15 3 15 3 11 1 11 1 21 3 21 3 17 6 17 6 21 8 21 8 11 6 11z\"></path></svg>" }, "16": { metadata: { "moduleName": "Http16", "filepath": "HTTP/16.js", "descriptor": { "elem": "svg", "attrs": { "xmlns": "http://www.w3.org/2000/svg", "viewBox": "0 0 32 32", "fill": "currentColor", "width": 16, "height": 16 }, "content": [{ "elem": "path", "attrs": { "d": "M30 11H25V21h2V18h3a2.0027 2.0027 0 002-2V13A2.0023 2.0023 0 0030 11zm-3 5V13h3l.001 3zM10 13L12 13 12 21 14 21 14 13 16 13 16 11 10 11 10 13zM23 11L17 11 17 13 19 13 19 21 21 21 21 13 23 13 23 11zM6 11L6 15 3 15 3 11 1 11 1 21 3 21 3 17 6 17 6 21 8 21 8 11 6 11z" } }], "name": "HTTP", "size": 16 }, "size": 16 }, svg: "<svg focusable=\"false\" preserveAspectRatio=\"xMidYMid meet\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" width=\"16\" height=\"16\" viewBox=\"0 0 32 32\" aria-hidden=\"true\"><path d=\"M30 11H25V21h2V18h3a2.0027 2.0027 0 002-2V13A2.0023 2.0023 0 0030 11zm-3 5V13h3l.001 3zM10 13L12 13 12 21 14 21 14 13 16 13 16 11 10 11 10 13zM23 11L17 11 17 13 19 13 19 21 21 21 21 13 23 13 23 11zM6 11L6 15 3 15 3 11 1 11 1 21 3 21 3 17 6 17 6 21 8 21 8 11 6 11z\"></path></svg>" }, }; } HttpDirective_1 = HttpDirective; HttpDirective.prototype.ngAfterViewInit = function () { var svg = this.elementRef.nativeElement; svg.setAttribute("xmlns", "http://www.w3.org/2000/svg"); var icon = this.icons[this.size]; var domParser = new DOMParser(); var rawSVG = icon.svg; var svgElement = domParser.parseFromString(rawSVG, "image/svg+xml").documentElement; var node = svgElement.firstChild; while (node) { // importNode makes a clone of the node // this ensures we keep looping over the nodes in the parsed document svg.appendChild(svg.ownerDocument.importNode(node, true)); node = node.nextSibling; } var attributes = getAttributes({ width: icon.metadata.descriptor.attrs.height, height: icon.metadata.descriptor.attrs.height, viewBox: icon.metadata.descriptor.attrs.viewBox, title: this.title, "aria-label": this.ariaLabel, "aria-labelledby": this.ariaLabelledby, "aria-hidden": this.ariaHidden, focusable: this.isFocusable.toString() }); var attrKeys = Object.keys(attributes); for (var i = 0; i < attrKeys.length; i++) { var key = attrKeys[i]; var value = attributes[key]; if (key === "title") { continue; } if (value) { svg.setAttribute(key, value); } } if (attributes.title) { var title = document.createElement("title"); title.textContent = attributes.title; HttpDirective_1.titleIdCounter++; title.setAttribute("id", "http-" + HttpDirective_1.titleIdCounter); svg.appendChild(title); svg.setAttribute("aria-labelledby", "http-" + HttpDirective_1.titleIdCounter); } }; var HttpDirective_1; HttpDirective.titleIdCounter = 0; HttpDirective.ctorParameters = function () { return [ { type: ElementRef } ]; }; __decorate([ Input(), __metadata("design:type", String) ], HttpDirective.prototype, "ariaLabel", void 0); __decorate([ Input(), __metadata("design:type", String) ], HttpDirective.prototype, "ariaLabelledby", void 0); __decorate([ Input(), __metadata("design:type", Boolean) ], HttpDirective.prototype, "ariaHidden", void 0); __decorate([ Input(), __metadata("design:type", String) ], HttpDirective.prototype, "title", void 0); __decorate([ Input(), __metadata("design:type", Boolean) ], HttpDirective.prototype, "isFocusable", void 0); __decorate([ Input(), __metadata("design:type", String) ], HttpDirective.prototype, "size", void 0); HttpDirective = HttpDirective_1 = __decorate([ Directive({ selector: "[ibmIconHttp]" }), __metadata("design:paramtypes", [ElementRef]) ], HttpDirective); return HttpDirective; }()); var HttpModule = /** @class */ (function () { function HttpModule() { } HttpModule = __decorate([ NgModule({ declarations: [ HttpComponent, HttpDirective, ], exports: [ HttpComponent, HttpDirective, ] }) ], HttpModule); return HttpModule; }()); export { HttpComponent, HttpDirective, HttpModule };