59717beef46094d3721f669f5d5ebb75b1e5d1b5e2668614fd80a4f9787b74f1.json 9.7 KB

1
  1. {"ast":null,"code":"import * as i0 from '@angular/core';\nimport { Directive, Optional, Inject, Input, NgModule } from '@angular/core';\nimport { mixinDisabled, MatCommonModule } from '@angular/material/core';\nimport * as i1 from '@angular/cdk/a11y';\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { ANIMATION_MODULE_TYPE } from '@angular/platform-browser/animations';\nlet nextId = 0;\n// Boilerplate for applying mixins to MatBadge.\n/** @docs-private */\nconst _MatBadgeBase = /*#__PURE__*/mixinDisabled(class {});\nconst BADGE_CONTENT_CLASS = 'mat-badge-content';\n/** Directive to display a text badge. */\nlet MatBadge = /*#__PURE__*/(() => {\n class MatBadge extends _MatBadgeBase {\n /** The color of the badge. Can be `primary`, `accent`, or `warn`. */\n get color() {\n return this._color;\n }\n set color(value) {\n this._setColor(value);\n this._color = value;\n }\n /** Whether the badge should overlap its contents or not */\n get overlap() {\n return this._overlap;\n }\n set overlap(val) {\n this._overlap = coerceBooleanProperty(val);\n }\n /** The content for the badge */\n get content() {\n return this._content;\n }\n set content(newContent) {\n this._updateRenderedContent(newContent);\n }\n /** Message used to describe the decorated element via aria-describedby */\n get description() {\n return this._description;\n }\n set description(newDescription) {\n this._updateHostAriaDescription(newDescription);\n }\n /** Whether the badge is hidden. */\n get hidden() {\n return this._hidden;\n }\n set hidden(val) {\n this._hidden = coerceBooleanProperty(val);\n }\n constructor(_ngZone, _elementRef, _ariaDescriber, _renderer, _animationMode) {\n super();\n this._ngZone = _ngZone;\n this._elementRef = _elementRef;\n this._ariaDescriber = _ariaDescriber;\n this._renderer = _renderer;\n this._animationMode = _animationMode;\n this._color = 'primary';\n this._overlap = true;\n /**\n * Position the badge should reside.\n * Accepts any combination of 'above'|'below' and 'before'|'after'\n */\n this.position = 'above after';\n /** Size of the badge. Can be 'small', 'medium', or 'large'. */\n this.size = 'medium';\n /** Unique id for the badge */\n this._id = nextId++;\n /** Whether the OnInit lifecycle hook has run yet */\n this._isInitialized = false;\n if (typeof ngDevMode === 'undefined' || ngDevMode) {\n const nativeElement = _elementRef.nativeElement;\n if (nativeElement.nodeType !== nativeElement.ELEMENT_NODE) {\n throw Error('matBadge must be attached to an element node.');\n }\n }\n }\n /** Whether the badge is above the host or not */\n isAbove() {\n return this.position.indexOf('below') === -1;\n }\n /** Whether the badge is after the host or not */\n isAfter() {\n return this.position.indexOf('before') === -1;\n }\n /**\n * Gets the element into which the badge's content is being rendered. Undefined if the element\n * hasn't been created (e.g. if the badge doesn't have content).\n */\n getBadgeElement() {\n return this._badgeElement;\n }\n ngOnInit() {\n // We may have server-side rendered badge that we need to clear.\n // We need to do this in ngOnInit because the full content of the component\n // on which the badge is attached won't necessarily be in the DOM until this point.\n this._clearExistingBadges();\n if (this.content && !this._badgeElement) {\n this._badgeElement = this._createBadgeElement();\n this._updateRenderedContent(this.content);\n }\n this._isInitialized = true;\n }\n ngOnDestroy() {\n // ViewEngine only: when creating a badge through the Renderer, Angular remembers its index.\n // We have to destroy it ourselves, otherwise it'll be retained in memory.\n if (this._renderer.destroyNode) {\n this._renderer.destroyNode(this._badgeElement);\n }\n this._ariaDescriber.removeDescription(this._elementRef.nativeElement, this.description);\n }\n /** Creates the badge element */\n _createBadgeElement() {\n const badgeElement = this._renderer.createElement('span');\n const activeClass = 'mat-badge-active';\n badgeElement.setAttribute('id', `mat-badge-content-${this._id}`);\n // The badge is aria-hidden because we don't want it to appear in the page's navigation\n // flow. Instead, we use the badge to describe the decorated element with aria-describedby.\n badgeElement.setAttribute('aria-hidden', 'true');\n badgeElement.classList.add(BADGE_CONTENT_CLASS);\n if (this._animationMode === 'NoopAnimations') {\n badgeElement.classList.add('_mat-animation-noopable');\n }\n this._elementRef.nativeElement.appendChild(badgeElement);\n // animate in after insertion\n if (typeof requestAnimationFrame === 'function' && this._animationMode !== 'NoopAnimations') {\n this._ngZone.runOutsideAngular(() => {\n requestAnimationFrame(() => {\n badgeElement.classList.add(activeClass);\n });\n });\n } else {\n badgeElement.classList.add(activeClass);\n }\n return badgeElement;\n }\n /** Update the text content of the badge element in the DOM, creating the element if necessary. */\n _updateRenderedContent(newContent) {\n const newContentNormalized = `${newContent ?? ''}`.trim();\n // Don't create the badge element if the directive isn't initialized because we want to\n // append the badge element to the *end* of the host element's content for backwards\n // compatibility.\n if (this._isInitialized && newContentNormalized && !this._badgeElement) {\n this._badgeElement = this._createBadgeElement();\n }\n if (this._badgeElement) {\n this._badgeElement.textContent = newContentNormalized;\n }\n this._content = newContentNormalized;\n }\n /** Updates the host element's aria description via AriaDescriber. */\n _updateHostAriaDescription(newDescription) {\n this._ariaDescriber.removeDescription(this._elementRef.nativeElement, this.description);\n if (newDescription) {\n this._ariaDescriber.describe(this._elementRef.nativeElement, newDescription);\n }\n this._description = newDescription;\n }\n /** Adds css theme class given the color to the component host */\n _setColor(colorPalette) {\n const classList = this._elementRef.nativeElement.classList;\n classList.remove(`mat-badge-${this._color}`);\n if (colorPalette) {\n classList.add(`mat-badge-${colorPalette}`);\n }\n }\n /** Clears any existing badges that might be left over from server-side rendering. */\n _clearExistingBadges() {\n // Only check direct children of this host element in order to avoid deleting\n // any badges that might exist in descendant elements.\n const badges = this._elementRef.nativeElement.querySelectorAll(`:scope > .${BADGE_CONTENT_CLASS}`);\n for (const badgeElement of Array.from(badges)) {\n if (badgeElement !== this._badgeElement) {\n badgeElement.remove();\n }\n }\n }\n static #_ = this.ɵfac = function MatBadge_Factory(t) {\n return new (t || MatBadge)(i0.ɵɵdirectiveInject(i0.NgZone), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i1.AriaDescriber), i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(ANIMATION_MODULE_TYPE, 8));\n };\n static #_2 = this.ɵdir = /* @__PURE__ */i0.ɵɵdefineDirective({\n type: MatBadge,\n selectors: [[\"\", \"matBadge\", \"\"]],\n hostAttrs: [1, \"mat-badge\"],\n hostVars: 20,\n hostBindings: function MatBadge_HostBindings(rf, ctx) {\n if (rf & 2) {\n i0.ɵɵclassProp(\"mat-badge-overlap\", ctx.overlap)(\"mat-badge-above\", ctx.isAbove())(\"mat-badge-below\", !ctx.isAbove())(\"mat-badge-before\", !ctx.isAfter())(\"mat-badge-after\", ctx.isAfter())(\"mat-badge-small\", ctx.size === \"small\")(\"mat-badge-medium\", ctx.size === \"medium\")(\"mat-badge-large\", ctx.size === \"large\")(\"mat-badge-hidden\", ctx.hidden || !ctx.content)(\"mat-badge-disabled\", ctx.disabled);\n }\n },\n inputs: {\n disabled: [\"matBadgeDisabled\", \"disabled\"],\n color: [\"matBadgeColor\", \"color\"],\n overlap: [\"matBadgeOverlap\", \"overlap\"],\n position: [\"matBadgePosition\", \"position\"],\n content: [\"matBadge\", \"content\"],\n description: [\"matBadgeDescription\", \"description\"],\n size: [\"matBadgeSize\", \"size\"],\n hidden: [\"matBadgeHidden\", \"hidden\"]\n },\n features: [i0.ɵɵInheritDefinitionFeature]\n });\n }\n return MatBadge;\n})();\n/*#__PURE__*/(function () {\n (typeof ngDevMode === \"undefined\" || ngDevMode) && void 0;\n})();\nlet MatBadgeModule = /*#__PURE__*/(() => {\n class MatBadgeModule {\n static #_ = this.ɵfac = function MatBadgeModule_Factory(t) {\n return new (t || MatBadgeModule)();\n };\n static #_2 = this.ɵmod = /* @__PURE__ */i0.ɵɵdefineNgModule({\n type: MatBadgeModule\n });\n static #_3 = this.ɵinj = /* @__PURE__ */i0.ɵɵdefineInjector({\n imports: [A11yModule, MatCommonModule, MatCommonModule]\n });\n }\n return MatBadgeModule;\n})();\n/*#__PURE__*/(function () {\n (typeof ngDevMode === \"undefined\" || ngDevMode) && void 0;\n})();\n\n/**\n * Generated bundle index. Do not edit.\n */\n\nexport { MatBadge, MatBadgeModule };\n//# sourceMappingURL=badge.mjs.map","map":null,"metadata":{},"sourceType":"module","externalDependencies":[]}