icon.directive.mjs 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
  1. import { Directive, Input } from '@angular/core';
  2. import { alreadyHasAThemeSuffix, getNameAndNamespace, isIconDefinition, warn, withSuffix } from '../utils';
  3. import * as i0 from "@angular/core";
  4. import * as i1 from "./icon.service";
  5. function checkMeta(prev, after) {
  6. return prev.type === after.type && prev.theme === after.theme && prev.twoToneColor === after.twoToneColor;
  7. }
  8. class IconDirective {
  9. constructor(_iconService, _elementRef, _renderer) {
  10. this._iconService = _iconService;
  11. this._elementRef = _elementRef;
  12. this._renderer = _renderer;
  13. }
  14. ngOnChanges(changes) {
  15. if (changes.type || changes.theme || changes.twoToneColor) {
  16. this._changeIcon();
  17. }
  18. }
  19. /**
  20. * Render a new icon in the current element. Remove the icon when `type` is falsy.
  21. */
  22. _changeIcon() {
  23. return new Promise(resolve => {
  24. if (!this.type) {
  25. this._clearSVGElement();
  26. resolve(null);
  27. return;
  28. }
  29. const beforeMeta = this._getSelfRenderMeta();
  30. this._iconService.getRenderedContent(this._parseIconType(this.type, this.theme), this.twoToneColor).subscribe(svg => {
  31. // avoid race condition
  32. // see https://github.com/ant-design/ant-design-icons/issues/315
  33. const afterMeta = this._getSelfRenderMeta();
  34. if (checkMeta(beforeMeta, afterMeta)) {
  35. this._setSVGElement(svg);
  36. resolve(svg);
  37. }
  38. else {
  39. resolve(null);
  40. }
  41. });
  42. });
  43. }
  44. _getSelfRenderMeta() {
  45. return {
  46. type: this.type,
  47. theme: this.theme,
  48. twoToneColor: this.twoToneColor
  49. };
  50. }
  51. /**
  52. * Parse a icon to the standard form, an `IconDefinition` or a string like 'account-book-fill` (with a theme suffixed).
  53. * If namespace is specified, ignore theme because it meaningless for users' icons.
  54. *
  55. * @param type
  56. * @param theme
  57. */
  58. _parseIconType(type, theme) {
  59. if (isIconDefinition(type)) {
  60. return type;
  61. }
  62. else {
  63. const [name, namespace] = getNameAndNamespace(type);
  64. if (namespace) {
  65. return type;
  66. }
  67. if (alreadyHasAThemeSuffix(name)) {
  68. if (!!theme) {
  69. warn(`'type' ${name} already gets a theme inside so 'theme' ${theme} would be ignored`);
  70. }
  71. return name;
  72. }
  73. else {
  74. return withSuffix(name, theme || this._iconService.defaultTheme);
  75. }
  76. }
  77. }
  78. _setSVGElement(svg) {
  79. this._clearSVGElement();
  80. this._renderer.appendChild(this._elementRef.nativeElement, svg);
  81. }
  82. _clearSVGElement() {
  83. const el = this._elementRef.nativeElement;
  84. const children = el.childNodes;
  85. const length = children.length;
  86. for (let i = length - 1; i >= 0; i--) {
  87. const child = children[i];
  88. if (child.tagName?.toLowerCase() === 'svg') {
  89. this._renderer.removeChild(el, child);
  90. }
  91. }
  92. }
  93. static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: IconDirective, deps: [{ token: i1.IconService }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
  94. static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: IconDirective, selector: "[antIcon]", inputs: { type: "type", theme: "theme", twoToneColor: "twoToneColor" }, usesOnChanges: true, ngImport: i0 }); }
  95. }
  96. export { IconDirective };
  97. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: IconDirective, decorators: [{
  98. type: Directive,
  99. args: [{
  100. selector: '[antIcon]'
  101. }]
  102. }], ctorParameters: function () { return [{ type: i1.IconService }, { type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { type: [{
  103. type: Input
  104. }], theme: [{
  105. type: Input
  106. }], twoToneColor: [{
  107. type: Input
  108. }] } });
  109. //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvY29tcG9uZW50L2ljb24uZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxTQUFTLEVBRVQsS0FBSyxFQUlOLE1BQU0sZUFBZSxDQUFDO0FBRXZCLE9BQU8sRUFBRSxzQkFBc0IsRUFBRSxtQkFBbUIsRUFBRSxnQkFBZ0IsRUFBRSxJQUFJLEVBQUUsVUFBVSxFQUFFLE1BQU0sVUFBVSxDQUFDOzs7QUFTM0csU0FBUyxTQUFTLENBQUMsSUFBZ0IsRUFBRSxLQUFpQjtJQUNwRCxPQUFPLElBQUksQ0FBQyxJQUFJLEtBQUssS0FBSyxDQUFDLElBQUksSUFBSSxJQUFJLENBQUMsS0FBSyxLQUFLLEtBQUssQ0FBQyxLQUFLLElBQUksSUFBSSxDQUFDLFlBQVksS0FBSyxLQUFLLENBQUMsWUFBWSxDQUFDO0FBQzVHLENBQUM7QUFFRCxNQUdhLGFBQWE7SUFNeEIsWUFBc0IsWUFBeUIsRUFBWSxXQUF1QixFQUFZLFNBQW9CO1FBQTVGLGlCQUFZLEdBQVosWUFBWSxDQUFhO1FBQVksZ0JBQVcsR0FBWCxXQUFXLENBQVk7UUFBWSxjQUFTLEdBQVQsU0FBUyxDQUFXO0lBQUcsQ0FBQztJQUV0SCxXQUFXLENBQUMsT0FBc0I7UUFDaEMsSUFBSSxPQUFPLENBQUMsSUFBSSxJQUFJLE9BQU8sQ0FBQyxLQUFLLElBQUksT0FBTyxDQUFDLFlBQVksRUFBRTtZQUN6RCxJQUFJLENBQUMsV0FBVyxFQUFFLENBQUM7U0FDcEI7SUFDSCxDQUFDO0lBRUQ7O09BRUc7SUFDTyxXQUFXO1FBQ25CLE9BQU8sSUFBSSxPQUFPLENBQW9CLE9BQU8sQ0FBQyxFQUFFO1lBQzlDLElBQUksQ0FBQyxJQUFJLENBQUMsSUFBSSxFQUFFO2dCQUNkLElBQUksQ0FBQyxnQkFBZ0IsRUFBRSxDQUFDO2dCQUN4QixPQUFPLENBQUMsSUFBSSxDQUFDLENB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QUk7c0JBQVosS0FBSztnQkFFRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gIERpcmVjdGl2ZSxcbiAgRWxlbWVudFJlZixcbiAgSW5wdXQsXG4gIE9uQ2hhbmdlcyxcbiAgUmVuZGVyZXIyLFxuICBTaW1wbGVDaGFuZ2VzXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgSWNvbkRlZmluaXRpb24sIFRoZW1lVHlwZSB9IGZyb20gJy4uL3R5cGVzJztcbmltcG9ydCB7IGFscmVhZHlIYXNBVGhlbWVTdWZmaXgsIGdldE5hbWVBbmROYW1lc3BhY2UsIGlzSWNvbkRlZmluaXRpb24sIHdhcm4sIHdpdGhTdWZmaXggfSBmcm9tICcuLi91dGlscyc7XG5pbXBvcnQgeyBJY29uU2VydmljZSB9IGZyb20gJy4vaWNvbi5zZXJ2aWNlJztcblxuaW50ZXJmYWNlIFJlbmRlck1ldGEge1xuICB0eXBlOiBzdHJpbmcgfCBJY29uRGVmaW5pdGlvbjtcbiAgdGhlbWU/OiBUaGVtZVR5cGU7XG4gIHR3b1RvbmVDb2xvcj86IHN0cmluZztcbn1cblxuZnVuY3Rpb24gY2hlY2tNZXRhKHByZXY6IFJlbmRlck1ldGEsIGFmdGVyOiBSZW5kZXJNZXRhKTogYm9vbGVhbiB7XG4gIHJldHVybiBwcmV2LnR5cGUgPT09IGFmdGVyLnR5cGUgJiYgcHJldi50aGVtZSA9PT0gYWZ0ZXIudGhlbWUgJiYgcHJldi50d29Ub25lQ29sb3IgPT09IGFmdGVyLnR3b1RvbmVDb2xvcjtcbn1cblxuQERpcmVjdGl2ZSh7XG4gIHNlbGVjdG9yOiAnW2FudEljb25dJ1xufSlcbmV4cG9ydCBjbGFzcyBJY29uRGlyZWN0aXZlIGltcGxlbWVudHMgT25DaGFuZ2VzIHtcbiAgQElucHV0KCkgdHlwZTogc3RyaW5nIHwgSWNvbkRlZmluaXRpb247XG5cbiAgQElucHV0KCkgdGhlbWU/OiBUaGVtZVR5cGU7XG4gIEBJbnB1dCgpIHR3b1RvbmVDb2xvcj86IHN0cmluZztcblxuICBjb25zdHJ1Y3Rvcihwcm90ZWN0ZWQgX2ljb25TZXJ2aWNlOiBJY29uU2VydmljZSwgcHJvdGVjdGVkIF9lbGVtZW50UmVmOiBFbGVtZW50UmVmLCBwcm90ZWN0ZWQgX3JlbmRlcmVyOiBSZW5kZXJlcjIpIHt9XG5cbiAgbmdPbkNoYW5nZXMoY2hhbmdlczogU2ltcGxlQ2hhbmdlcyk6IHZvaWQge1xuICAgIGlmIChjaGFuZ2VzLnR5cGUgfHwgY2hhbmdlcy50aGVtZSB8fCBjaGFuZ2VzLnR3b1RvbmVDb2xvcikge1xuICAgICAgdGhpcy5fY2hhbmdlSWNvbigpO1xuICAgIH1cbiAgfVxuXG4gIC8qKlxuICAgKiBSZW5kZXIgYSBuZXcgaWNvbiBpbiB0aGUgY3VycmVudCBlbGVtZW50LiBSZW1vdmUgdGhlIGljb24gd2hlbiBgdHlwZWAgaXMgZmFsc3kuXG4gICAqL1xuICBwcm90ZWN0ZWQgX2NoYW5nZUljb24oKTogUHJvbWlzZTxTVkdFbGVtZW50IHwgbnVsbD4ge1xuICAgIHJldHVybiBuZXcgUHJvbWlzZTxTVkdFbGVtZW50IHwgbnVsbD4ocmVzb2x2ZSA9PiB7XG4gICAgICBpZiAoIXRoaXMudHlwZSkge1xuICAgICAgICB0aGlzLl9jbGVhclNWR0VsZW1lbnQoKTtcbiAgICAgICAgcmVzb2x2ZShudWxsKTtcbiAgICAgICAgcmV0dXJuO1xuICAgICAgfSBcblxuICAgICAgY29uc3QgYmVmb3JlTWV0YSA9IHRoaXMuX2dldFNlbGZSZW5kZXJNZXRhKCk7XG4gICAgICB0aGlzLl9pY29uU2VydmljZS5nZXRSZW5kZXJlZENvbnRlbnQoXG4gICAgICAgIHRoaXMuX3BhcnNlSWNvblR5cGUodGhpcy50eXBlLCB0aGlzLnRoZW1lKSxcbiAgICAgICAgdGhpcy50d29Ub25lQ29sb3JcbiAgICAgICkuc3Vic2NyaWJlKHN2ZyA9PiB7XG4gICAgICAgIC8vIGF2b2lkIHJhY2UgY29uZGl0aW9uXG4gICAgICAgIC8vIHNlZSBodHRwczovL2dpdGh1Yi5jb20vYW50LWRlc2lnbi9hbnQtZGVzaWduLWljb25zL2lzc3Vlcy8zMTVcbiAgICAgICAgY29uc3QgYWZ0ZXJNZXRhID0gdGhpcy5fZ2V0U2VsZlJlbmRlck1ldGEoKVxuICAgICAgICBpZiAoY2hlY2tNZXRhKGJlZm9yZU1ldGEsIGFmdGVyTWV0YSkpIHtcbiAgICAgICAgICB0aGlzLl9zZXRTVkdFbGVtZW50KHN2Zyk7XG4gICAgICAgICAgcmVzb2x2ZShzdmcpO1xuICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgIHJlc29sdmUobnVsbCk7XG4gICAgICAgIH1cbiAgICAgIH0pO1xuICAgIH0pO1xuICB9XG5cbiAgcHJvdGVjdGVkIF9nZXRTZWxmUmVuZGVyTWV0YSgpOiBSZW5kZXJNZXRhIHtcbiAgICByZXR1cm4ge1xuICAgICAgdHlwZTogdGhpcy50eXBlLFxuICAgICAgdGhlbWU6IHRoaXMudGhlbWUsXG4gICAgICB0d29Ub25lQ29sb3I6IHRoaXMudHdvVG9uZUNvbG9yXG4gICAgfTtcbiAgfVxuXG4gIC8qKlxuICAgKiBQYXJzZSBhIGljb24gdG8gdGhlIHN0YW5kYXJkIGZvcm0sIGFuIGBJY29uRGVmaW5pdGlvbmAgb3IgYSBzdHJpbmcgbGlrZSAnYWNjb3VudC1ib29rLWZpbGxgICh3aXRoIGEgdGhlbWUgc3VmZml4ZWQpLlxuICAgKiBJZiBuYW1lc3BhY2UgaXMgc3BlY2lmaWVkLCBpZ25vcmUgdGhlbWUgYmVjYXVzZSBpdCBtZWFuaW5nbGVzcyBmb3IgdXNlcnMnIGljb25zLlxuICAgKlxuICAgKiBAcGFyYW0gdHlwZVxuICAgKiBAcGFyYW0gdGhlbWVcbiAgICovXG4gIHByb3RlY3RlZCBfcGFyc2VJY29uVHlwZSh0eXBlOiBzdHJpbmcgfCBJY29uRGVmaW5pdGlvbiwgdGhlbWU/OiBUaGVtZVR5cGUpOiBJY29uRGVmaW5pdGlvbiB8IHN0cmluZyB7XG4gICAgaWYgKGlzSWNvbkRlZmluaXRpb24odHlwZSkpIHtcbiAgICAgIHJldHVybiB0eXBlO1xuICAgIH0gZWxzZSB7XG4gICAgICBjb25zdCBbIG5hbWUsIG5hbWVzcGFjZSBdID0gZ2V0TmFtZUFuZE5hbWVzcGFjZSh0eXBlKTtcbiAgICAgIGlmIChuYW1lc3BhY2UpIHtcbiAgICAgICAgcmV0dXJuIHR5cGU7XG4gICAgICB9XG4gICAgICBpZiAoYWxyZWFkeUhhc0FUaGVtZVN1ZmZpeChuYW1lKSkge1xuICAgICAgICBpZiAoISF0aGVtZSkge1xuICAgICAgICAgIHdhcm4oYCd0eXBlJyAke25hbWV9IGFscmVhZHkgZ2V0cyBhIHRoZW1lIGluc2lkZSBzbyAndGhlbWUnICR7dGhlbWV9IHdvdWxkIGJlIGlnbm9yZWRgKTtcbiAgICAgICAgfVxuICAgICAgICByZXR1cm4gbmFtZTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIHJldHVybiB3aXRoU3VmZml4KG5hbWUsIHRoZW1lIHx8IHRoaXMuX2ljb25TZXJ2aWNlLmRlZmF1bHRUaGVtZSk7XG4gICAgICB9XG4gICAgfVxuICB9XG5cbiAgcHJvdGVjdGVkIF9zZXRTVkdFbGVtZW50KHN2ZzogU1ZHRWxlbWVudCk6IHZvaWQge1xuICAgIHRoaXMuX2NsZWFyU1ZHRWxlbWVudCgpO1xuICAgIHRoaXMuX3JlbmRlcmVyLmFwcGVuZENoaWxkKHRoaXMuX2VsZW1lbnRSZWYubmF0aXZlRWxlbWVudCwgc3ZnKTtcbiAgfVxuXG4gIHByb3RlY3RlZCBfY2xlYXJTVkdFbGVtZW50KCk6IHZvaWQge1xuICAgIGNvbnN0IGVsOiBIVE1MRWxlbWVudCA9IHRoaXMuX2VsZW1lbnRSZWYubmF0aXZlRWxlbWVudDtcbiAgICBjb25zdCBjaGlsZHJlbiA9IGVsLmNoaWxkTm9kZXM7XG4gICAgY29uc3QgbGVuZ3RoID0gY2hpbGRyZW4ubGVuZ3RoO1xuICAgIGZvciAobGV0IGkgPSBsZW5ndGggLSAxOyBpID49IDA7IGktLSkge1xuICAgICAgY29uc3QgY2hpbGQgPSBjaGlsZHJlblsgaSBdIGFzIGFueTtcbiAgICAgIGlmIChjaGlsZC50YWdOYW1lPy50b0xvd2VyQ2FzZSgpID09PSAnc3ZnJykge1xuICAgICAgICB0aGlzLl9yZW5kZXJlci5yZW1vdmVDaGlsZChlbCwgY2hpbGQpO1xuICAgICAgfVxuICAgIH1cbiAgfVxufVxuIl19