| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705 |
- /**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
- (function (global, factory) {
- typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common'), require('@angular/common/http'), require('@angular/core'), require('@angular/platform-browser'), require('rxjs'), require('rxjs/operators'), require('@angular/material/core'), require('@angular/cdk/coercion')) :
- typeof define === 'function' && define.amd ? define('@angular/material/icon', ['exports', '@angular/common', '@angular/common/http', '@angular/core', '@angular/platform-browser', 'rxjs', 'rxjs/operators', '@angular/material/core', '@angular/cdk/coercion'], factory) :
- (factory((global.ng = global.ng || {}, global.ng.material = global.ng.material || {}, global.ng.material.icon = {}),global.ng.common,global.ng.common.http,global.ng.core,global.ng.platformBrowser,global.rxjs,global.rxjs.operators,global.ng.material.core,global.ng.cdk.coercion));
- }(this, (function (exports,common,http,core,platformBrowser,rxjs,operators,core$1,coercion) { 'use strict';
- /*! *****************************************************************************
- Copyright (c) Microsoft Corporation. All rights reserved.
- Licensed under the Apache License, Version 2.0 (the "License"); you may not use
- this file except in compliance with the License. You may obtain a copy of the
- License at http://www.apache.org/licenses/LICENSE-2.0
- THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
- WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
- MERCHANTABLITY OR NON-INFRINGEMENT.
- See the Apache Version 2.0 License for specific language governing permissions
- and limitations under the License.
- ***************************************************************************** */
- /* global Reflect, Promise */
- var extendStatics = function(d, b) {
- extendStatics = Object.setPrototypeOf ||
- ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
- function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
- return extendStatics(d, b);
- };
- function __extends(d, b) {
- extendStatics(d, b);
- function __() { this.constructor = d; }
- d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
- }
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- /**
- * Returns an exception to be thrown in the case when attempting to
- * load an icon with a name that cannot be found.
- * \@docs-private
- * @param {?} iconName
- * @return {?}
- */
- function getMatIconNameNotFoundError(iconName) {
- return Error("Unable to find icon with the name \"" + iconName + "\"");
- }
- /**
- * Returns an exception to be thrown when the consumer attempts to use
- * `<mat-icon>` without including \@angular/common/http.
- * \@docs-private
- * @return {?}
- */
- function getMatIconNoHttpProviderError() {
- return Error('Could not find HttpClient provider for use with Angular Material icons. ' +
- 'Please include the HttpClientModule from @angular/common/http in your ' +
- 'app imports.');
- }
- /**
- * Returns an exception to be thrown when a URL couldn't be sanitized.
- * \@docs-private
- * @param {?} url URL that was attempted to be sanitized.
- * @return {?}
- */
- function getMatIconFailedToSanitizeUrlError(url) {
- return Error("The URL provided to MatIconRegistry was not trusted as a resource URL " +
- ("via Angular's DomSanitizer. Attempted URL was \"" + url + "\"."));
- }
- /**
- * Returns an exception to be thrown when a HTML string couldn't be sanitized.
- * \@docs-private
- * @param {?} literal HTML that was attempted to be sanitized.
- * @return {?}
- */
- function getMatIconFailedToSanitizeLiteralError(literal) {
- return Error("The literal provided to MatIconRegistry was not trusted as safe HTML by " +
- ("Angular's DomSanitizer. Attempted literal was \"" + literal + "\"."));
- }
- /**
- * Configuration for an icon, including the URL and possibly the cached SVG element.
- * \@docs-private
- */
- var /**
- * Configuration for an icon, including the URL and possibly the cached SVG element.
- * \@docs-private
- */
- SvgIconConfig = /** @class */ (function () {
- function SvgIconConfig(data) {
- // Note that we can't use `instanceof SVGElement` here,
- // because it'll break during server-side rendering.
- if (!!((/** @type {?} */ (data))).nodeName) {
- this.svgElement = (/** @type {?} */ (data));
- }
- else {
- this.url = (/** @type {?} */ (data));
- }
- }
- return SvgIconConfig;
- }());
- /**
- * Service to register and display icons used by the `<mat-icon>` component.
- * - Registers icon URLs by namespace and name.
- * - Registers icon set URLs by namespace.
- * - Registers aliases for CSS classes, for use with icon fonts.
- * - Loads icons from URLs and extracts individual icons from icon sets.
- */
- var MatIconRegistry = /** @class */ (function () {
- function MatIconRegistry(_httpClient, _sanitizer, document) {
- this._httpClient = _httpClient;
- this._sanitizer = _sanitizer;
- /**
- * URLs and cached SVG elements for individual icons. Keys are of the format "[namespace]:[icon]".
- */
- this._svgIconConfigs = new Map();
- /**
- * SvgIconConfig objects and cached SVG elements for icon sets, keyed by namespace.
- * Multiple icon sets can be registered under the same namespace.
- */
- this._iconSetConfigs = new Map();
- /**
- * Cache for icons loaded by direct URLs.
- */
- this._cachedIconsByUrl = new Map();
- /**
- * In-progress icon fetches. Used to coalesce multiple requests to the same URL.
- */
- this._inProgressUrlFetches = new Map();
- /**
- * Map from font identifiers to their CSS class names. Used for icon fonts.
- */
- this._fontCssClassesByAlias = new Map();
- /**
- * The CSS class to apply when an `<mat-icon>` component has no icon name, url, or font specified.
- * The default 'material-icons' value assumes that the material icon font has been loaded as
- * described at http://google.github.io/material-design-icons/#icon-font-for-the-web
- */
- this._defaultFontSetClass = 'material-icons';
- this._document = document;
- }
- /**
- * Registers an icon by URL in the default namespace.
- * @param iconName Name under which the icon should be registered.
- * @param url
- */
- /**
- * Registers an icon by URL in the default namespace.
- * @template THIS
- * @this {THIS}
- * @param {?} iconName Name under which the icon should be registered.
- * @param {?} url
- * @return {THIS}
- */
- MatIconRegistry.prototype.addSvgIcon = /**
- * Registers an icon by URL in the default namespace.
- * @template THIS
- * @this {THIS}
- * @param {?} iconName Name under which the icon should be registered.
- * @param {?} url
- * @return {THIS}
- */
- function (iconName, url) {
- return (/** @type {?} */ (this)).addSvgIconInNamespace('', iconName, url);
- };
- /**
- * Registers an icon using an HTML string in the default namespace.
- * @param iconName Name under which the icon should be registered.
- * @param literal SVG source of the icon.
- */
- /**
- * Registers an icon using an HTML string in the default namespace.
- * @template THIS
- * @this {THIS}
- * @param {?} iconName Name under which the icon should be registered.
- * @param {?} literal SVG source of the icon.
- * @return {THIS}
- */
- MatIconRegistry.prototype.addSvgIconLiteral = /**
- * Registers an icon using an HTML string in the default namespace.
- * @template THIS
- * @this {THIS}
- * @param {?} iconName Name under which the icon should be registered.
- * @param {?} literal SVG source of the icon.
- * @return {THIS}
- */
- function (iconName, literal) {
- return (/** @type {?} */ (this)).addSvgIconLiteralInNamespace('', iconName, literal);
- };
- /**
- * Registers an icon by URL in the specified namespace.
- * @param namespace Namespace in which the icon should be registered.
- * @param iconName Name under which the icon should be registered.
- * @param url
- */
- /**
- * Registers an icon by URL in the specified namespace.
- * @template THIS
- * @this {THIS}
- * @param {?} namespace Namespace in which the icon should be registered.
- * @param {?} iconName Name under which the icon should be registered.
- * @param {?} url
- * @return {THIS}
- */
- MatIconRegistry.prototype.addSvgIconInNamespace = /**
- * Registers an icon by URL in the specified namespace.
- * @template THIS
- * @this {THIS}
- * @param {?} namespace Namespace in which the icon should be registered.
- * @param {?} iconName Name under which the icon should be registered.
- * @param {?} url
- * @return {THIS}
- */
- function (namespace, iconName, url) {
- return (/** @type {?} */ (this))._addSvgIconConfig(namespace, iconName, new SvgIconConfig(url));
- };
- /**
- * Registers an icon using an HTML string in the specified namespace.
- * @param namespace Namespace in which the icon should be registered.
- * @param iconName Name under which the icon should be registered.
- * @param literal SVG source of the icon.
- */
- /**
- * Registers an icon using an HTML string in the specified namespace.
- * @template THIS
- * @this {THIS}
- * @param {?} namespace Namespace in which the icon should be registered.
- * @param {?} iconName Name under which the icon should be registered.
- * @param {?} literal SVG source of the icon.
- * @return {THIS}
- */
- MatIconRegistry.prototype.addSvgIconLiteralInNamespace = /**
- * Registers an icon using an HTML string in the specified namespace.
- * @template THIS
- * @this {THIS}
- * @param {?} namespace Namespace in which the icon should be registered.
- * @param {?} iconName Name under which the icon should be registered.
- * @param {?} literal SVG source of the icon.
- * @return {THIS}
- */
- function (namespace, iconName, literal) {
- /** @type {?} */
- var sanitizedLiteral = (/** @type {?} */ (this))._sanitizer.sanitize(core.SecurityContext.HTML, literal);
- if (!sanitizedLiteral) {
- throw getMatIconFailedToSanitizeLiteralError(literal);
- }
- /** @type {?} */
- var svgElement = (/** @type {?} */ (this))._createSvgElementForSingleIcon(sanitizedLiteral);
- return (/** @type {?} */ (this))._addSvgIconConfig(namespace, iconName, new SvgIconConfig(svgElement));
- };
- /**
- * Registers an icon set by URL in the default namespace.
- * @param url
- */
- /**
- * Registers an icon set by URL in the default namespace.
- * @template THIS
- * @this {THIS}
- * @param {?} url
- * @return {THIS}
- */
- MatIconRegistry.prototype.addSvgIconSet = /**
- * Registers an icon set by URL in the default namespace.
- * @template THIS
- * @this {THIS}
- * @param {?} url
- * @return {THIS}
- */
- function (url) {
- return (/** @type {?} */ (this)).addSvgIconSetInNamespace('', url);
- };
- /**
- * Registers an icon set using an HTML string in the default namespace.
- * @param literal SVG source of the icon set.
- */
- /**
- * Registers an icon set using an HTML string in the default namespace.
- * @template THIS
- * @this {THIS}
- * @param {?} literal SVG source of the icon set.
- * @return {THIS}
- */
- MatIconRegistry.prototype.addSvgIconSetLiteral = /**
- * Registers an icon set using an HTML string in the default namespace.
- * @template THIS
- * @this {THIS}
- * @param {?} literal SVG source of the icon set.
- * @return {THIS}
- */
- function (literal) {
- return (/** @type {?} */ (this)).addSvgIconSetLiteralInNamespace('', literal);
- };
- /**
- * Registers an icon set by URL in the specified namespace.
- * @param namespace Namespace in which to register the icon set.
- * @param url
- */
- /**
- * Registers an icon set by URL in the specified namespace.
- * @template THIS
- * @this {THIS}
- * @param {?} namespace Namespace in which to register the icon set.
- * @param {?} url
- * @return {THIS}
- */
- MatIconRegistry.prototype.addSvgIconSetInNamespace = /**
- * Registers an icon set by URL in the specified namespace.
- * @template THIS
- * @this {THIS}
- * @param {?} namespace Namespace in which to register the icon set.
- * @param {?} url
- * @return {THIS}
- */
- function (namespace, url) {
- return (/** @type {?} */ (this))._addSvgIconSetConfig(namespace, new SvgIconConfig(url));
- };
- /**
- * Registers an icon set using an HTML string in the specified namespace.
- * @param namespace Namespace in which to register the icon set.
- * @param literal SVG source of the icon set.
- */
- /**
- * Registers an icon set using an HTML string in the specified namespace.
- * @template THIS
- * @this {THIS}
- * @param {?} namespace Namespace in which to register the icon set.
- * @param {?} literal SVG source of the icon set.
- * @return {THIS}
- */
- MatIconRegistry.prototype.addSvgIconSetLiteralInNamespace = /**
- * Registers an icon set using an HTML string in the specified namespace.
- * @template THIS
- * @this {THIS}
- * @param {?} namespace Namespace in which to register the icon set.
- * @param {?} literal SVG source of the icon set.
- * @return {THIS}
- */
- function (namespace, literal) {
- /** @type {?} */
- var sanitizedLiteral = (/** @type {?} */ (this))._sanitizer.sanitize(core.SecurityContext.HTML, literal);
- if (!sanitizedLiteral) {
- throw getMatIconFailedToSanitizeLiteralError(literal);
- }
- /** @type {?} */
- var svgElement = (/** @type {?} */ (this))._svgElementFromString(sanitizedLiteral);
- return (/** @type {?} */ (this))._addSvgIconSetConfig(namespace, new SvgIconConfig(svgElement));
- };
- /**
- * Defines an alias for a CSS class name to be used for icon fonts. Creating an matIcon
- * component with the alias as the fontSet input will cause the class name to be applied
- * to the `<mat-icon>` element.
- *
- * @param alias Alias for the font.
- * @param className Class name override to be used instead of the alias.
- */
- /**
- * Defines an alias for a CSS class name to be used for icon fonts. Creating an matIcon
- * component with the alias as the fontSet input will cause the class name to be applied
- * to the `<mat-icon>` element.
- *
- * @template THIS
- * @this {THIS}
- * @param {?} alias Alias for the font.
- * @param {?=} className Class name override to be used instead of the alias.
- * @return {THIS}
- */
- MatIconRegistry.prototype.registerFontClassAlias = /**
- * Defines an alias for a CSS class name to be used for icon fonts. Creating an matIcon
- * component with the alias as the fontSet input will cause the class name to be applied
- * to the `<mat-icon>` element.
- *
- * @template THIS
- * @this {THIS}
- * @param {?} alias Alias for the font.
- * @param {?=} className Class name override to be used instead of the alias.
- * @return {THIS}
- */
- function (alias, className) {
- if (className === void 0) { className = alias; }
- (/** @type {?} */ (this))._fontCssClassesByAlias.set(alias, className);
- return (/** @type {?} */ (this));
- };
- /**
- * Returns the CSS class name associated with the alias by a previous call to
- * registerFontClassAlias. If no CSS class has been associated, returns the alias unmodified.
- */
- /**
- * Returns the CSS class name associated with the alias by a previous call to
- * registerFontClassAlias. If no CSS class has been associated, returns the alias unmodified.
- * @param {?} alias
- * @return {?}
- */
- MatIconRegistry.prototype.classNameForFontAlias = /**
- * Returns the CSS class name associated with the alias by a previous call to
- * registerFontClassAlias. If no CSS class has been associated, returns the alias unmodified.
- * @param {?} alias
- * @return {?}
- */
- function (alias) {
- return this._fontCssClassesByAlias.get(alias) || alias;
- };
- /**
- * Sets the CSS class name to be used for icon fonts when an `<mat-icon>` component does not
- * have a fontSet input value, and is not loading an icon by name or URL.
- *
- * @param className
- */
- /**
- * Sets the CSS class name to be used for icon fonts when an `<mat-icon>` component does not
- * have a fontSet input value, and is not loading an icon by name or URL.
- *
- * @template THIS
- * @this {THIS}
- * @param {?} className
- * @return {THIS}
- */
- MatIconRegistry.prototype.setDefaultFontSetClass = /**
- * Sets the CSS class name to be used for icon fonts when an `<mat-icon>` component does not
- * have a fontSet input value, and is not loading an icon by name or URL.
- *
- * @template THIS
- * @this {THIS}
- * @param {?} className
- * @return {THIS}
- */
- function (className) {
- (/** @type {?} */ (this))._defaultFontSetClass = className;
- return (/** @type {?} */ (this));
- };
- /**
- * Returns the CSS class name to be used for icon fonts when an `<mat-icon>` component does not
- * have a fontSet input value, and is not loading an icon by name or URL.
- */
- /**
- * Returns the CSS class name to be used for icon fonts when an `<mat-icon>` component does not
- * have a fontSet input value, and is not loading an icon by name or URL.
- * @return {?}
- */
- MatIconRegistry.prototype.getDefaultFontSetClass = /**
- * Returns the CSS class name to be used for icon fonts when an `<mat-icon>` component does not
- * have a fontSet input value, and is not loading an icon by name or URL.
- * @return {?}
- */
- function () {
- return this._defaultFontSetClass;
- };
- /**
- * Returns an Observable that produces the icon (as an `<svg>` DOM element) from the given URL.
- * The response from the URL may be cached so this will not always cause an HTTP request, but
- * the produced element will always be a new copy of the originally fetched icon. (That is,
- * it will not contain any modifications made to elements previously returned).
- *
- * @param safeUrl URL from which to fetch the SVG icon.
- */
- /**
- * Returns an Observable that produces the icon (as an `<svg>` DOM element) from the given URL.
- * The response from the URL may be cached so this will not always cause an HTTP request, but
- * the produced element will always be a new copy of the originally fetched icon. (That is,
- * it will not contain any modifications made to elements previously returned).
- *
- * @param {?} safeUrl URL from which to fetch the SVG icon.
- * @return {?}
- */
- MatIconRegistry.prototype.getSvgIconFromUrl = /**
- * Returns an Observable that produces the icon (as an `<svg>` DOM element) from the given URL.
- * The response from the URL may be cached so this will not always cause an HTTP request, but
- * the produced element will always be a new copy of the originally fetched icon. (That is,
- * it will not contain any modifications made to elements previously returned).
- *
- * @param {?} safeUrl URL from which to fetch the SVG icon.
- * @return {?}
- */
- function (safeUrl) {
- var _this = this;
- /** @type {?} */
- var url = this._sanitizer.sanitize(core.SecurityContext.RESOURCE_URL, safeUrl);
- if (!url) {
- throw getMatIconFailedToSanitizeUrlError(safeUrl);
- }
- /** @type {?} */
- var cachedIcon = this._cachedIconsByUrl.get(url);
- if (cachedIcon) {
- return rxjs.of(cloneSvg(cachedIcon));
- }
- return this._loadSvgIconFromConfig(new SvgIconConfig(safeUrl)).pipe(operators.tap((/**
- * @param {?} svg
- * @return {?}
- */
- function (svg) { return _this._cachedIconsByUrl.set((/** @type {?} */ (url)), svg); })), operators.map((/**
- * @param {?} svg
- * @return {?}
- */
- function (svg) { return cloneSvg(svg); })));
- };
- /**
- * Returns an Observable that produces the icon (as an `<svg>` DOM element) with the given name
- * and namespace. The icon must have been previously registered with addIcon or addIconSet;
- * if not, the Observable will throw an error.
- *
- * @param name Name of the icon to be retrieved.
- * @param namespace Namespace in which to look for the icon.
- */
- /**
- * Returns an Observable that produces the icon (as an `<svg>` DOM element) with the given name
- * and namespace. The icon must have been previously registered with addIcon or addIconSet;
- * if not, the Observable will throw an error.
- *
- * @param {?} name Name of the icon to be retrieved.
- * @param {?=} namespace Namespace in which to look for the icon.
- * @return {?}
- */
- MatIconRegistry.prototype.getNamedSvgIcon = /**
- * Returns an Observable that produces the icon (as an `<svg>` DOM element) with the given name
- * and namespace. The icon must have been previously registered with addIcon or addIconSet;
- * if not, the Observable will throw an error.
- *
- * @param {?} name Name of the icon to be retrieved.
- * @param {?=} namespace Namespace in which to look for the icon.
- * @return {?}
- */
- function (name, namespace) {
- if (namespace === void 0) { namespace = ''; }
- // Return (copy of) cached icon if possible.
- /** @type {?} */
- var key = iconKey(namespace, name);
- /** @type {?} */
- var config = this._svgIconConfigs.get(key);
- if (config) {
- return this._getSvgFromConfig(config);
- }
- // See if we have any icon sets registered for the namespace.
- /** @type {?} */
- var iconSetConfigs = this._iconSetConfigs.get(namespace);
- if (iconSetConfigs) {
- return this._getSvgFromIconSetConfigs(name, iconSetConfigs);
- }
- return rxjs.throwError(getMatIconNameNotFoundError(key));
- };
- /**
- * @return {?}
- */
- MatIconRegistry.prototype.ngOnDestroy = /**
- * @return {?}
- */
- function () {
- this._svgIconConfigs.clear();
- this._iconSetConfigs.clear();
- this._cachedIconsByUrl.clear();
- };
- /**
- * Returns the cached icon for a SvgIconConfig if available, or fetches it from its URL if not.
- */
- /**
- * Returns the cached icon for a SvgIconConfig if available, or fetches it from its URL if not.
- * @private
- * @param {?} config
- * @return {?}
- */
- MatIconRegistry.prototype._getSvgFromConfig = /**
- * Returns the cached icon for a SvgIconConfig if available, or fetches it from its URL if not.
- * @private
- * @param {?} config
- * @return {?}
- */
- function (config) {
- if (config.svgElement) {
- // We already have the SVG element for this icon, return a copy.
- return rxjs.of(cloneSvg(config.svgElement));
- }
- else {
- // Fetch the icon from the config's URL, cache it, and return a copy.
- return this._loadSvgIconFromConfig(config).pipe(operators.tap((/**
- * @param {?} svg
- * @return {?}
- */
- function (svg) { return config.svgElement = svg; })), operators.map((/**
- * @param {?} svg
- * @return {?}
- */
- function (svg) { return cloneSvg(svg); })));
- }
- };
- /**
- * Attempts to find an icon with the specified name in any of the SVG icon sets.
- * First searches the available cached icons for a nested element with a matching name, and
- * if found copies the element to a new `<svg>` element. If not found, fetches all icon sets
- * that have not been cached, and searches again after all fetches are completed.
- * The returned Observable produces the SVG element if possible, and throws
- * an error if no icon with the specified name can be found.
- */
- /**
- * Attempts to find an icon with the specified name in any of the SVG icon sets.
- * First searches the available cached icons for a nested element with a matching name, and
- * if found copies the element to a new `<svg>` element. If not found, fetches all icon sets
- * that have not been cached, and searches again after all fetches are completed.
- * The returned Observable produces the SVG element if possible, and throws
- * an error if no icon with the specified name can be found.
- * @private
- * @param {?} name
- * @param {?} iconSetConfigs
- * @return {?}
- */
- MatIconRegistry.prototype._getSvgFromIconSetConfigs = /**
- * Attempts to find an icon with the specified name in any of the SVG icon sets.
- * First searches the available cached icons for a nested element with a matching name, and
- * if found copies the element to a new `<svg>` element. If not found, fetches all icon sets
- * that have not been cached, and searches again after all fetches are completed.
- * The returned Observable produces the SVG element if possible, and throws
- * an error if no icon with the specified name can be found.
- * @private
- * @param {?} name
- * @param {?} iconSetConfigs
- * @return {?}
- */
- function (name, iconSetConfigs) {
- var _this = this;
- // For all the icon set SVG elements we've fetched, see if any contain an icon with the
- // requested name.
- /** @type {?} */
- var namedIcon = this._extractIconWithNameFromAnySet(name, iconSetConfigs);
- if (namedIcon) {
- // We could cache namedIcon in _svgIconConfigs, but since we have to make a copy every
- // time anyway, there's probably not much advantage compared to just always extracting
- // it from the icon set.
- return rxjs.of(namedIcon);
- }
- // Not found in any cached icon sets. If there are icon sets with URLs that we haven't
- // fetched, fetch them now and look for iconName in the results.
- /** @type {?} */
- var iconSetFetchRequests = iconSetConfigs
- .filter((/**
- * @param {?} iconSetConfig
- * @return {?}
- */
- function (iconSetConfig) { return !iconSetConfig.svgElement; }))
- .map((/**
- * @param {?} iconSetConfig
- * @return {?}
- */
- function (iconSetConfig) {
- return _this._loadSvgIconSetFromConfig(iconSetConfig).pipe(operators.catchError((/**
- * @param {?} err
- * @return {?}
- */
- function (err) {
- /** @type {?} */
- var url = _this._sanitizer.sanitize(core.SecurityContext.RESOURCE_URL, iconSetConfig.url);
- // Swallow errors fetching individual URLs so the
- // combined Observable won't necessarily fail.
- console.error("Loading icon set URL: " + url + " failed: " + err.message);
- return rxjs.of(null);
- })));
- }));
- // Fetch all the icon set URLs. When the requests complete, every IconSet should have a
- // cached SVG element (unless the request failed), and we can check again for the icon.
- return rxjs.forkJoin(iconSetFetchRequests).pipe(operators.map((/**
- * @return {?}
- */
- function () {
- /** @type {?} */
- var foundIcon = _this._extractIconWithNameFromAnySet(name, iconSetConfigs);
- if (!foundIcon) {
- throw getMatIconNameNotFoundError(name);
- }
- return foundIcon;
- })));
- };
- /**
- * Searches the cached SVG elements for the given icon sets for a nested icon element whose "id"
- * tag matches the specified name. If found, copies the nested element to a new SVG element and
- * returns it. Returns null if no matching element is found.
- */
- /**
- * Searches the cached SVG elements for the given icon sets for a nested icon element whose "id"
- * tag matches the specified name. If found, copies the nested element to a new SVG element and
- * returns it. Returns null if no matching element is found.
- * @private
- * @param {?} iconName
- * @param {?} iconSetConfigs
- * @return {?}
- */
- MatIconRegistry.prototype._extractIconWithNameFromAnySet = /**
- * Searches the cached SVG elements for the given icon sets for a nested icon element whose "id"
- * tag matches the specified name. If found, copies the nested element to a new SVG element and
- * returns it. Returns null if no matching element is found.
- * @private
- * @param {?} iconName
- * @param {?} iconSetConfigs
- * @return {?}
- */
- function (iconName, iconSetConfigs) {
- // Iterate backwards, so icon sets added later have precedence.
- for (var i = iconSetConfigs.length - 1; i >= 0; i--) {
- /** @type {?} */
- var config = iconSetConfigs[i];
- if (config.svgElement) {
- /** @type {?} */
- var foundIcon = this._extractSvgIconFromSet(config.svgElement, iconName);
- if (foundIcon) {
- return foundIcon;
- }
- }
- }
- return null;
- };
- /**
- * Loads the content of the icon URL specified in the SvgIconConfig and creates an SVG element
- * from it.
- */
- /**
- * Loads the content of the icon URL specified in the SvgIconConfig and creates an SVG element
- * from it.
- * @private
- * @param {?} config
- * @return {?}
- */
- MatIconRegistry.prototype._loadSvgIconFromConfig = /**
- * Loads the content of the icon URL specified in the SvgIconConfig and creates an SVG element
- * from it.
- * @private
- * @param {?} config
- * @return {?}
- */
- function (config) {
- var _this = this;
- return this._fetchUrl(config.url)
- .pipe(operators.map((/**
- * @param {?} svgText
- * @return {?}
- */
- function (svgText) { return _this._createSvgElementForSingleIcon(svgText); })));
- };
- /**
- * Loads the content of the icon set URL specified in the SvgIconConfig and creates an SVG element
- * from it.
- */
- /**
- * Loads the content of the icon set URL specified in the SvgIconConfig and creates an SVG element
- * from it.
- * @private
- * @param {?} config
- * @return {?}
- */
- MatIconRegistry.prototype._loadSvgIconSetFromConfig = /**
- * Loads the content of the icon set URL specified in the SvgIconConfig and creates an SVG element
- * from it.
- * @private
- * @param {?} config
- * @return {?}
- */
- function (config) {
- var _this = this;
- // If the SVG for this icon set has already been parsed, do nothing.
- if (config.svgElement) {
- return rxjs.of(config.svgElement);
- }
- return this._fetchUrl(config.url).pipe(operators.map((/**
- * @param {?} svgText
- * @return {?}
- */
- function (svgText) {
- // It is possible that the icon set was parsed and cached by an earlier request, so parsing
- // only needs to occur if the cache is yet unset.
- if (!config.svgElement) {
- config.svgElement = _this._svgElementFromString(svgText);
- }
- return config.svgElement;
- })));
- };
- /**
- * Creates a DOM element from the given SVG string, and adds default attributes.
- */
- /**
- * Creates a DOM element from the given SVG string, and adds default attributes.
- * @private
- * @param {?} responseText
- * @return {?}
- */
- MatIconRegistry.prototype._createSvgElementForSingleIcon = /**
- * Creates a DOM element from the given SVG string, and adds default attributes.
- * @private
- * @param {?} responseText
- * @return {?}
- */
- function (responseText) {
- /** @type {?} */
- var svg = this._svgElementFromString(responseText);
- this._setSvgAttributes(svg);
- return svg;
- };
- /**
- * Searches the cached element of the given SvgIconConfig for a nested icon element whose "id"
- * tag matches the specified name. If found, copies the nested element to a new SVG element and
- * returns it. Returns null if no matching element is found.
- */
- /**
- * Searches the cached element of the given SvgIconConfig for a nested icon element whose "id"
- * tag matches the specified name. If found, copies the nested element to a new SVG element and
- * returns it. Returns null if no matching element is found.
- * @private
- * @param {?} iconSet
- * @param {?} iconName
- * @return {?}
- */
- MatIconRegistry.prototype._extractSvgIconFromSet = /**
- * Searches the cached element of the given SvgIconConfig for a nested icon element whose "id"
- * tag matches the specified name. If found, copies the nested element to a new SVG element and
- * returns it. Returns null if no matching element is found.
- * @private
- * @param {?} iconSet
- * @param {?} iconName
- * @return {?}
- */
- function (iconSet, iconName) {
- // Use the `id="iconName"` syntax in order to escape special
- // characters in the ID (versus using the #iconName syntax).
- /** @type {?} */
- var iconSource = iconSet.querySelector("[id=\"" + iconName + "\"]");
- if (!iconSource) {
- return null;
- }
- // Clone the element and remove the ID to prevent multiple elements from being added
- // to the page with the same ID.
- /** @type {?} */
- var iconElement = (/** @type {?} */ (iconSource.cloneNode(true)));
- iconElement.removeAttribute('id');
- // If the icon node is itself an <svg> node, clone and return it directly. If not, set it as
- // the content of a new <svg> node.
- if (iconElement.nodeName.toLowerCase() === 'svg') {
- return this._setSvgAttributes((/** @type {?} */ (iconElement)));
- }
- // If the node is a <symbol>, it won't be rendered so we have to convert it into <svg>. Note
- // that the same could be achieved by referring to it via <use href="#id">, however the <use>
- // tag is problematic on Firefox, because it needs to include the current page path.
- if (iconElement.nodeName.toLowerCase() === 'symbol') {
- return this._setSvgAttributes(this._toSvgElement(iconElement));
- }
- // createElement('SVG') doesn't work as expected; the DOM ends up with
- // the correct nodes, but the SVG content doesn't render. Instead we
- // have to create an empty SVG node using innerHTML and append its content.
- // Elements created using DOMParser.parseFromString have the same problem.
- // http://stackoverflow.com/questions/23003278/svg-innerhtml-in-firefox-can-not-display
- /** @type {?} */
- var svg = this._svgElementFromString('<svg></svg>');
- // Clone the node so we don't remove it from the parent icon set element.
- svg.appendChild(iconElement);
- return this._setSvgAttributes(svg);
- };
- /**
- * Creates a DOM element from the given SVG string.
- */
- /**
- * Creates a DOM element from the given SVG string.
- * @private
- * @param {?} str
- * @return {?}
- */
- MatIconRegistry.prototype._svgElementFromString = /**
- * Creates a DOM element from the given SVG string.
- * @private
- * @param {?} str
- * @return {?}
- */
- function (str) {
- /** @type {?} */
- var div = this._document.createElement('DIV');
- div.innerHTML = str;
- /** @type {?} */
- var svg = (/** @type {?} */ (div.querySelector('svg')));
- if (!svg) {
- throw Error('<svg> tag not found');
- }
- return svg;
- };
- /**
- * Converts an element into an SVG node by cloning all of its children.
- */
- /**
- * Converts an element into an SVG node by cloning all of its children.
- * @private
- * @param {?} element
- * @return {?}
- */
- MatIconRegistry.prototype._toSvgElement = /**
- * Converts an element into an SVG node by cloning all of its children.
- * @private
- * @param {?} element
- * @return {?}
- */
- function (element) {
- /** @type {?} */
- var svg = this._svgElementFromString('<svg></svg>');
- for (var i = 0; i < element.childNodes.length; i++) {
- if (element.childNodes[i].nodeType === this._document.ELEMENT_NODE) {
- svg.appendChild(element.childNodes[i].cloneNode(true));
- }
- }
- return svg;
- };
- /**
- * Sets the default attributes for an SVG element to be used as an icon.
- */
- /**
- * Sets the default attributes for an SVG element to be used as an icon.
- * @private
- * @param {?} svg
- * @return {?}
- */
- MatIconRegistry.prototype._setSvgAttributes = /**
- * Sets the default attributes for an SVG element to be used as an icon.
- * @private
- * @param {?} svg
- * @return {?}
- */
- function (svg) {
- svg.setAttribute('fit', '');
- svg.setAttribute('height', '100%');
- svg.setAttribute('width', '100%');
- svg.setAttribute('preserveAspectRatio', 'xMidYMid meet');
- svg.setAttribute('focusable', 'false'); // Disable IE11 default behavior to make SVGs focusable.
- return svg;
- };
- /**
- * Returns an Observable which produces the string contents of the given URL. Results may be
- * cached, so future calls with the same URL may not cause another HTTP request.
- */
- /**
- * Returns an Observable which produces the string contents of the given URL. Results may be
- * cached, so future calls with the same URL may not cause another HTTP request.
- * @private
- * @param {?} safeUrl
- * @return {?}
- */
- MatIconRegistry.prototype._fetchUrl = /**
- * Returns an Observable which produces the string contents of the given URL. Results may be
- * cached, so future calls with the same URL may not cause another HTTP request.
- * @private
- * @param {?} safeUrl
- * @return {?}
- */
- function (safeUrl) {
- var _this = this;
- if (!this._httpClient) {
- throw getMatIconNoHttpProviderError();
- }
- if (safeUrl == null) {
- throw Error("Cannot fetch icon from URL \"" + safeUrl + "\".");
- }
- /** @type {?} */
- var url = this._sanitizer.sanitize(core.SecurityContext.RESOURCE_URL, safeUrl);
- if (!url) {
- throw getMatIconFailedToSanitizeUrlError(safeUrl);
- }
- // Store in-progress fetches to avoid sending a duplicate request for a URL when there is
- // already a request in progress for that URL. It's necessary to call share() on the
- // Observable returned by http.get() so that multiple subscribers don't cause multiple XHRs.
- /** @type {?} */
- var inProgressFetch = this._inProgressUrlFetches.get(url);
- if (inProgressFetch) {
- return inProgressFetch;
- }
- // TODO(jelbourn): for some reason, the `finalize` operator "loses" the generic type on the
- // Observable. Figure out why and fix it.
- /** @type {?} */
- var req = this._httpClient.get(url, { responseType: 'text' }).pipe(operators.finalize((/**
- * @return {?}
- */
- function () { return _this._inProgressUrlFetches.delete(url); })), operators.share());
- this._inProgressUrlFetches.set(url, req);
- return req;
- };
- /**
- * Registers an icon config by name in the specified namespace.
- * @param namespace Namespace in which to register the icon config.
- * @param iconName Name under which to register the config.
- * @param config Config to be registered.
- */
- /**
- * Registers an icon config by name in the specified namespace.
- * @private
- * @template THIS
- * @this {THIS}
- * @param {?} namespace Namespace in which to register the icon config.
- * @param {?} iconName Name under which to register the config.
- * @param {?} config Config to be registered.
- * @return {THIS}
- */
- MatIconRegistry.prototype._addSvgIconConfig = /**
- * Registers an icon config by name in the specified namespace.
- * @private
- * @template THIS
- * @this {THIS}
- * @param {?} namespace Namespace in which to register the icon config.
- * @param {?} iconName Name under which to register the config.
- * @param {?} config Config to be registered.
- * @return {THIS}
- */
- function (namespace, iconName, config) {
- (/** @type {?} */ (this))._svgIconConfigs.set(iconKey(namespace, iconName), config);
- return (/** @type {?} */ (this));
- };
- /**
- * Registers an icon set config in the specified namespace.
- * @param namespace Namespace in which to register the icon config.
- * @param config Config to be registered.
- */
- /**
- * Registers an icon set config in the specified namespace.
- * @private
- * @template THIS
- * @this {THIS}
- * @param {?} namespace Namespace in which to register the icon config.
- * @param {?} config Config to be registered.
- * @return {THIS}
- */
- MatIconRegistry.prototype._addSvgIconSetConfig = /**
- * Registers an icon set config in the specified namespace.
- * @private
- * @template THIS
- * @this {THIS}
- * @param {?} namespace Namespace in which to register the icon config.
- * @param {?} config Config to be registered.
- * @return {THIS}
- */
- function (namespace, config) {
- /** @type {?} */
- var configNamespace = (/** @type {?} */ (this))._iconSetConfigs.get(namespace);
- if (configNamespace) {
- configNamespace.push(config);
- }
- else {
- (/** @type {?} */ (this))._iconSetConfigs.set(namespace, [config]);
- }
- return (/** @type {?} */ (this));
- };
- MatIconRegistry.decorators = [
- { type: core.Injectable, args: [{ providedIn: 'root' },] },
- ];
- /** @nocollapse */
- MatIconRegistry.ctorParameters = function () { return [
- { type: http.HttpClient, decorators: [{ type: core.Optional }] },
- { type: platformBrowser.DomSanitizer },
- { type: undefined, decorators: [{ type: core.Optional }, { type: core.Inject, args: [common.DOCUMENT,] }] }
- ]; };
- /** @nocollapse */ MatIconRegistry.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function MatIconRegistry_Factory() { return new MatIconRegistry(core.ɵɵinject(http.HttpClient, 8), core.ɵɵinject(platformBrowser.DomSanitizer), core.ɵɵinject(common.DOCUMENT, 8)); }, token: MatIconRegistry, providedIn: "root" });
- return MatIconRegistry;
- }());
- /**
- * \@docs-private
- * @param {?} parentRegistry
- * @param {?} httpClient
- * @param {?} sanitizer
- * @param {?=} document
- * @return {?}
- */
- function ICON_REGISTRY_PROVIDER_FACTORY(parentRegistry, httpClient, sanitizer, document) {
- return parentRegistry || new MatIconRegistry(httpClient, sanitizer, document);
- }
- /**
- * \@docs-private
- * @type {?}
- */
- var ICON_REGISTRY_PROVIDER = {
- // If there is already an MatIconRegistry available, use that. Otherwise, provide a new one.
- provide: MatIconRegistry,
- deps: [
- [new core.Optional(), new core.SkipSelf(), MatIconRegistry],
- [new core.Optional(), http.HttpClient],
- platformBrowser.DomSanitizer,
- [new core.Optional(), (/** @type {?} */ (common.DOCUMENT))],
- ],
- useFactory: ICON_REGISTRY_PROVIDER_FACTORY,
- };
- /**
- * Clones an SVGElement while preserving type information.
- * @param {?} svg
- * @return {?}
- */
- function cloneSvg(svg) {
- return (/** @type {?} */ (svg.cloneNode(true)));
- }
- /**
- * Returns the cache key to use for an icon namespace and name.
- * @param {?} namespace
- * @param {?} name
- * @return {?}
- */
- function iconKey(namespace, name) {
- return namespace + ':' + name;
- }
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- // Boilerplate for applying mixins to MatIcon.
- /**
- * \@docs-private
- */
- var
- // Boilerplate for applying mixins to MatIcon.
- /**
- * \@docs-private
- */
- MatIconBase = /** @class */ (function () {
- function MatIconBase(_elementRef) {
- this._elementRef = _elementRef;
- }
- return MatIconBase;
- }());
- /** @type {?} */
- var _MatIconMixinBase = core$1.mixinColor(MatIconBase);
- /**
- * Injection token used to provide the current location to `MatIcon`.
- * Used to handle server-side rendering and to stub out during unit tests.
- * \@docs-private
- * @type {?}
- */
- var MAT_ICON_LOCATION = new core.InjectionToken('mat-icon-location', {
- providedIn: 'root',
- factory: MAT_ICON_LOCATION_FACTORY
- });
- /**
- * \@docs-private
- * @return {?}
- */
- function MAT_ICON_LOCATION_FACTORY() {
- /** @type {?} */
- var _document = core.inject(common.DOCUMENT);
- /** @type {?} */
- var _location = _document ? _document.location : null;
- return {
- // Note that this needs to be a function, rather than a property, because Angular
- // will only resolve it once, but we want the current path on each call.
- getPathname: (/**
- * @return {?}
- */
- function () { return _location ? (_location.pathname + _location.search) : ''; })
- };
- }
- /**
- * SVG attributes that accept a FuncIRI (e.g. `url(<something>)`).
- * @type {?}
- */
- var funcIriAttributes = [
- 'clip-path',
- 'color-profile',
- 'src',
- 'cursor',
- 'fill',
- 'filter',
- 'marker',
- 'marker-start',
- 'marker-mid',
- 'marker-end',
- 'mask',
- 'stroke'
- ];
- var ɵ0 = /**
- * @param {?} attr
- * @return {?}
- */
- function (attr) { return "[" + attr + "]"; };
- /**
- * Selector that can be used to find all elements that are using a `FuncIRI`.
- * @type {?}
- */
- var funcIriAttributeSelector = funcIriAttributes.map((ɵ0)).join(', ');
- /**
- * Regex that can be used to extract the id out of a FuncIRI.
- * @type {?}
- */
- var funcIriPattern = /^url\(['"]?#(.*?)['"]?\)$/;
- /**
- * Component to display an icon. It can be used in the following ways:
- *
- * - Specify the svgIcon input to load an SVG icon from a URL previously registered with the
- * addSvgIcon, addSvgIconInNamespace, addSvgIconSet, or addSvgIconSetInNamespace methods of
- * MatIconRegistry. If the svgIcon value contains a colon it is assumed to be in the format
- * "[namespace]:[name]", if not the value will be the name of an icon in the default namespace.
- * Examples:
- * `<mat-icon svgIcon="left-arrow"></mat-icon>
- * <mat-icon svgIcon="animals:cat"></mat-icon>`
- *
- * - Use a font ligature as an icon by putting the ligature text in the content of the `<mat-icon>`
- * component. By default the Material icons font is used as described at
- * http://google.github.io/material-design-icons/#icon-font-for-the-web. You can specify an
- * alternate font by setting the fontSet input to either the CSS class to apply to use the
- * desired font, or to an alias previously registered with MatIconRegistry.registerFontClassAlias.
- * Examples:
- * `<mat-icon>home</mat-icon>
- * <mat-icon fontSet="myfont">sun</mat-icon>`
- *
- * - Specify a font glyph to be included via CSS rules by setting the fontSet input to specify the
- * font, and the fontIcon input to specify the icon. Typically the fontIcon will specify a
- * CSS class which causes the glyph to be displayed via a :before selector, as in
- * https://fortawesome.github.io/Font-Awesome/examples/
- * Example:
- * `<mat-icon fontSet="fa" fontIcon="alarm"></mat-icon>`
- */
- var MatIcon = /** @class */ (function (_super) {
- __extends(MatIcon, _super);
- function MatIcon(elementRef, _iconRegistry, ariaHidden, _location) {
- var _this = _super.call(this, elementRef) || this;
- _this._iconRegistry = _iconRegistry;
- _this._location = _location;
- _this._inline = false;
- // If the user has not explicitly set aria-hidden, mark the icon as hidden, as this is
- // the right thing to do for the majority of icon use-cases.
- if (!ariaHidden) {
- elementRef.nativeElement.setAttribute('aria-hidden', 'true');
- }
- return _this;
- }
- Object.defineProperty(MatIcon.prototype, "inline", {
- /**
- * Whether the icon should be inlined, automatically sizing the icon to match the font size of
- * the element the icon is contained in.
- */
- get: /**
- * Whether the icon should be inlined, automatically sizing the icon to match the font size of
- * the element the icon is contained in.
- * @return {?}
- */
- function () {
- return this._inline;
- },
- set: /**
- * @param {?} inline
- * @return {?}
- */
- function (inline) {
- this._inline = coercion.coerceBooleanProperty(inline);
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(MatIcon.prototype, "fontSet", {
- /** Font set that the icon is a part of. */
- get: /**
- * Font set that the icon is a part of.
- * @return {?}
- */
- function () { return this._fontSet; },
- set: /**
- * @param {?} value
- * @return {?}
- */
- function (value) {
- this._fontSet = this._cleanupFontValue(value);
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(MatIcon.prototype, "fontIcon", {
- /** Name of an icon within a font set. */
- get: /**
- * Name of an icon within a font set.
- * @return {?}
- */
- function () { return this._fontIcon; },
- set: /**
- * @param {?} value
- * @return {?}
- */
- function (value) {
- this._fontIcon = this._cleanupFontValue(value);
- },
- enumerable: true,
- configurable: true
- });
- /**
- * Splits an svgIcon binding value into its icon set and icon name components.
- * Returns a 2-element array of [(icon set), (icon name)].
- * The separator for the two fields is ':'. If there is no separator, an empty
- * string is returned for the icon set and the entire value is returned for
- * the icon name. If the argument is falsy, returns an array of two empty strings.
- * Throws an error if the name contains two or more ':' separators.
- * Examples:
- * `'social:cake' -> ['social', 'cake']
- * 'penguin' -> ['', 'penguin']
- * null -> ['', '']
- * 'a:b:c' -> (throws Error)`
- */
- /**
- * Splits an svgIcon binding value into its icon set and icon name components.
- * Returns a 2-element array of [(icon set), (icon name)].
- * The separator for the two fields is ':'. If there is no separator, an empty
- * string is returned for the icon set and the entire value is returned for
- * the icon name. If the argument is falsy, returns an array of two empty strings.
- * Throws an error if the name contains two or more ':' separators.
- * Examples:
- * `'social:cake' -> ['social', 'cake']
- * 'penguin' -> ['', 'penguin']
- * null -> ['', '']
- * 'a:b:c' -> (throws Error)`
- * @private
- * @param {?} iconName
- * @return {?}
- */
- MatIcon.prototype._splitIconName = /**
- * Splits an svgIcon binding value into its icon set and icon name components.
- * Returns a 2-element array of [(icon set), (icon name)].
- * The separator for the two fields is ':'. If there is no separator, an empty
- * string is returned for the icon set and the entire value is returned for
- * the icon name. If the argument is falsy, returns an array of two empty strings.
- * Throws an error if the name contains two or more ':' separators.
- * Examples:
- * `'social:cake' -> ['social', 'cake']
- * 'penguin' -> ['', 'penguin']
- * null -> ['', '']
- * 'a:b:c' -> (throws Error)`
- * @private
- * @param {?} iconName
- * @return {?}
- */
- function (iconName) {
- if (!iconName) {
- return ['', ''];
- }
- /** @type {?} */
- var parts = iconName.split(':');
- switch (parts.length) {
- case 1: return ['', parts[0]]; // Use default namespace.
- case 2: return (/** @type {?} */ (parts));
- default: throw Error("Invalid icon name: \"" + iconName + "\"");
- }
- };
- /**
- * @param {?} changes
- * @return {?}
- */
- MatIcon.prototype.ngOnChanges = /**
- * @param {?} changes
- * @return {?}
- */
- function (changes) {
- var _this = this;
- // Only update the inline SVG icon if the inputs changed, to avoid unnecessary DOM operations.
- /** @type {?} */
- var svgIconChanges = changes['svgIcon'];
- if (svgIconChanges) {
- if (this.svgIcon) {
- var _a = this._splitIconName(this.svgIcon), namespace = _a[0], iconName = _a[1];
- this._iconRegistry.getNamedSvgIcon(iconName, namespace).pipe(operators.take(1)).subscribe((/**
- * @param {?} svg
- * @return {?}
- */
- function (svg) { return _this._setSvgElement(svg); }), (/**
- * @param {?} err
- * @return {?}
- */
- function (err) { return console.log("Error retrieving icon: " + err.message); }));
- }
- else if (svgIconChanges.previousValue) {
- this._clearSvgElement();
- }
- }
- if (this._usingFontIcon()) {
- this._updateFontIconClasses();
- }
- };
- /**
- * @return {?}
- */
- MatIcon.prototype.ngOnInit = /**
- * @return {?}
- */
- function () {
- // Update font classes because ngOnChanges won't be called if none of the inputs are present,
- // e.g. <mat-icon>arrow</mat-icon> In this case we need to add a CSS class for the default font.
- if (this._usingFontIcon()) {
- this._updateFontIconClasses();
- }
- };
- /**
- * @return {?}
- */
- MatIcon.prototype.ngAfterViewChecked = /**
- * @return {?}
- */
- function () {
- /** @type {?} */
- var cachedElements = this._elementsWithExternalReferences;
- if (cachedElements && this._location && cachedElements.size) {
- /** @type {?} */
- var newPath = this._location.getPathname();
- // We need to check whether the URL has changed on each change detection since
- // the browser doesn't have an API that will let us react on link clicks and
- // we can't depend on the Angular router. The references need to be updated,
- // because while most browsers don't care whether the URL is correct after
- // the first render, Safari will break if the user navigates to a different
- // page and the SVG isn't re-rendered.
- if (newPath !== this._previousPath) {
- this._previousPath = newPath;
- this._prependPathToReferences(newPath);
- }
- }
- };
- /**
- * @return {?}
- */
- MatIcon.prototype.ngOnDestroy = /**
- * @return {?}
- */
- function () {
- if (this._elementsWithExternalReferences) {
- this._elementsWithExternalReferences.clear();
- }
- };
- /**
- * @private
- * @return {?}
- */
- MatIcon.prototype._usingFontIcon = /**
- * @private
- * @return {?}
- */
- function () {
- return !this.svgIcon;
- };
- /**
- * @private
- * @param {?} svg
- * @return {?}
- */
- MatIcon.prototype._setSvgElement = /**
- * @private
- * @param {?} svg
- * @return {?}
- */
- function (svg) {
- this._clearSvgElement();
- // Workaround for IE11 and Edge ignoring `style` tags inside dynamically-created SVGs.
- // See: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/10898469/
- // Do this before inserting the element into the DOM, in order to avoid a style recalculation.
- /** @type {?} */
- var styleTags = (/** @type {?} */ (svg.querySelectorAll('style')));
- for (var i = 0; i < styleTags.length; i++) {
- styleTags[i].textContent += ' ';
- }
- // Note: we do this fix here, rather than the icon registry, because the
- // references have to point to the URL at the time that the icon was created.
- if (this._location) {
- /** @type {?} */
- var path = this._location.getPathname();
- this._previousPath = path;
- this._cacheChildrenWithExternalReferences(svg);
- this._prependPathToReferences(path);
- }
- this._elementRef.nativeElement.appendChild(svg);
- };
- /**
- * @private
- * @return {?}
- */
- MatIcon.prototype._clearSvgElement = /**
- * @private
- * @return {?}
- */
- function () {
- /** @type {?} */
- var layoutElement = this._elementRef.nativeElement;
- /** @type {?} */
- var childCount = layoutElement.childNodes.length;
- if (this._elementsWithExternalReferences) {
- this._elementsWithExternalReferences.clear();
- }
- // Remove existing non-element child nodes and SVGs, and add the new SVG element. Note that
- // we can't use innerHTML, because IE will throw if the element has a data binding.
- while (childCount--) {
- /** @type {?} */
- var child = layoutElement.childNodes[childCount];
- // 1 corresponds to Node.ELEMENT_NODE. We remove all non-element nodes in order to get rid
- // of any loose text nodes, as well as any SVG elements in order to remove any old icons.
- if (child.nodeType !== 1 || child.nodeName.toLowerCase() === 'svg') {
- layoutElement.removeChild(child);
- }
- }
- };
- /**
- * @private
- * @return {?}
- */
- MatIcon.prototype._updateFontIconClasses = /**
- * @private
- * @return {?}
- */
- function () {
- if (!this._usingFontIcon()) {
- return;
- }
- /** @type {?} */
- var elem = this._elementRef.nativeElement;
- /** @type {?} */
- var fontSetClass = this.fontSet ?
- this._iconRegistry.classNameForFontAlias(this.fontSet) :
- this._iconRegistry.getDefaultFontSetClass();
- if (fontSetClass != this._previousFontSetClass) {
- if (this._previousFontSetClass) {
- elem.classList.remove(this._previousFontSetClass);
- }
- if (fontSetClass) {
- elem.classList.add(fontSetClass);
- }
- this._previousFontSetClass = fontSetClass;
- }
- if (this.fontIcon != this._previousFontIconClass) {
- if (this._previousFontIconClass) {
- elem.classList.remove(this._previousFontIconClass);
- }
- if (this.fontIcon) {
- elem.classList.add(this.fontIcon);
- }
- this._previousFontIconClass = this.fontIcon;
- }
- };
- /**
- * Cleans up a value to be used as a fontIcon or fontSet.
- * Since the value ends up being assigned as a CSS class, we
- * have to trim the value and omit space-separated values.
- */
- /**
- * Cleans up a value to be used as a fontIcon or fontSet.
- * Since the value ends up being assigned as a CSS class, we
- * have to trim the value and omit space-separated values.
- * @private
- * @param {?} value
- * @return {?}
- */
- MatIcon.prototype._cleanupFontValue = /**
- * Cleans up a value to be used as a fontIcon or fontSet.
- * Since the value ends up being assigned as a CSS class, we
- * have to trim the value and omit space-separated values.
- * @private
- * @param {?} value
- * @return {?}
- */
- function (value) {
- return typeof value === 'string' ? value.trim().split(' ')[0] : value;
- };
- /**
- * Prepends the current path to all elements that have an attribute pointing to a `FuncIRI`
- * reference. This is required because WebKit browsers require references to be prefixed with
- * the current path, if the page has a `base` tag.
- */
- /**
- * Prepends the current path to all elements that have an attribute pointing to a `FuncIRI`
- * reference. This is required because WebKit browsers require references to be prefixed with
- * the current path, if the page has a `base` tag.
- * @private
- * @param {?} path
- * @return {?}
- */
- MatIcon.prototype._prependPathToReferences = /**
- * Prepends the current path to all elements that have an attribute pointing to a `FuncIRI`
- * reference. This is required because WebKit browsers require references to be prefixed with
- * the current path, if the page has a `base` tag.
- * @private
- * @param {?} path
- * @return {?}
- */
- function (path) {
- /** @type {?} */
- var elements = this._elementsWithExternalReferences;
- if (elements) {
- elements.forEach((/**
- * @param {?} attrs
- * @param {?} element
- * @return {?}
- */
- function (attrs, element) {
- attrs.forEach((/**
- * @param {?} attr
- * @return {?}
- */
- function (attr) {
- element.setAttribute(attr.name, "url('" + path + "#" + attr.value + "')");
- }));
- }));
- }
- };
- /**
- * Caches the children of an SVG element that have `url()`
- * references that we need to prefix with the current path.
- */
- /**
- * Caches the children of an SVG element that have `url()`
- * references that we need to prefix with the current path.
- * @private
- * @param {?} element
- * @return {?}
- */
- MatIcon.prototype._cacheChildrenWithExternalReferences = /**
- * Caches the children of an SVG element that have `url()`
- * references that we need to prefix with the current path.
- * @private
- * @param {?} element
- * @return {?}
- */
- function (element) {
- /** @type {?} */
- var elementsWithFuncIri = element.querySelectorAll(funcIriAttributeSelector);
- /** @type {?} */
- var elements = this._elementsWithExternalReferences =
- this._elementsWithExternalReferences || new Map();
- var _loop_1 = function (i) {
- funcIriAttributes.forEach((/**
- * @param {?} attr
- * @return {?}
- */
- function (attr) {
- /** @type {?} */
- var elementWithReference = elementsWithFuncIri[i];
- /** @type {?} */
- var value = elementWithReference.getAttribute(attr);
- /** @type {?} */
- var match = value ? value.match(funcIriPattern) : null;
- if (match) {
- /** @type {?} */
- var attributes = elements.get(elementWithReference);
- if (!attributes) {
- attributes = [];
- elements.set(elementWithReference, attributes);
- }
- (/** @type {?} */ (attributes)).push({ name: attr, value: match[1] });
- }
- }));
- };
- for (var i = 0; i < elementsWithFuncIri.length; i++) {
- _loop_1(i);
- }
- };
- MatIcon.decorators = [
- { type: core.Component, args: [{template: '<ng-content></ng-content>',
- selector: 'mat-icon',
- exportAs: 'matIcon',
- styles: [".mat-icon{background-repeat:no-repeat;display:inline-block;fill:currentColor;height:24px;width:24px}.mat-icon.mat-icon-inline{font-size:inherit;height:inherit;line-height:inherit;width:inherit}[dir=rtl] .mat-icon-rtl-mirror{transform:scale(-1,1)}.mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-prefix .mat-icon,.mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-suffix .mat-icon{display:block}.mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-prefix .mat-icon-button .mat-icon,.mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-suffix .mat-icon-button .mat-icon{margin:auto}"],
- inputs: ['color'],
- host: {
- 'role': 'img',
- 'class': 'mat-icon notranslate',
- '[class.mat-icon-inline]': 'inline',
- '[class.mat-icon-no-color]': 'color !== "primary" && color !== "accent" && color !== "warn"',
- },
- encapsulation: core.ViewEncapsulation.None,
- changeDetection: core.ChangeDetectionStrategy.OnPush,
- },] },
- ];
- /** @nocollapse */
- MatIcon.ctorParameters = function () { return [
- { type: core.ElementRef },
- { type: MatIconRegistry },
- { type: String, decorators: [{ type: core.Attribute, args: ['aria-hidden',] }] },
- { type: undefined, decorators: [{ type: core.Optional }, { type: core.Inject, args: [MAT_ICON_LOCATION,] }] }
- ]; };
- MatIcon.propDecorators = {
- inline: [{ type: core.Input }],
- svgIcon: [{ type: core.Input }],
- fontSet: [{ type: core.Input }],
- fontIcon: [{ type: core.Input }]
- };
- return MatIcon;
- }(_MatIconMixinBase));
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- var MatIconModule = /** @class */ (function () {
- function MatIconModule() {
- }
- MatIconModule.decorators = [
- { type: core.NgModule, args: [{
- imports: [core$1.MatCommonModule],
- exports: [MatIcon, core$1.MatCommonModule],
- declarations: [MatIcon],
- },] },
- ];
- return MatIconModule;
- }());
- exports.MatIconModule = MatIconModule;
- exports.MAT_ICON_LOCATION_FACTORY = MAT_ICON_LOCATION_FACTORY;
- exports.MAT_ICON_LOCATION = MAT_ICON_LOCATION;
- exports.MatIcon = MatIcon;
- exports.getMatIconNameNotFoundError = getMatIconNameNotFoundError;
- exports.getMatIconNoHttpProviderError = getMatIconNoHttpProviderError;
- exports.getMatIconFailedToSanitizeUrlError = getMatIconFailedToSanitizeUrlError;
- exports.getMatIconFailedToSanitizeLiteralError = getMatIconFailedToSanitizeLiteralError;
- exports.ICON_REGISTRY_PROVIDER_FACTORY = ICON_REGISTRY_PROVIDER_FACTORY;
- exports.MatIconRegistry = MatIconRegistry;
- exports.ICON_REGISTRY_PROVIDER = ICON_REGISTRY_PROVIDER;
- Object.defineProperty(exports, '__esModule', { value: true });
- })));
- //# sourceMappingURL=material-icon.umd.js.map
|