fix: hardcoded iconhref in icon component

italia · May 15, 2023 · dff8a25 · dff8a25
1 parent bb3f03b
commit dff8a25
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 2 deletions.
diff --git a/projects/design-angular-kit/src/lib/components/utils/icon/icon.component.ts b/projects/design-angular-kit/src/lib/components/utils/icon/icon.component.ts
@@ -1,6 +1,7 @@
-import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
+import { ChangeDetectionStrategy, Component, Inject, Input } from '@angular/core';
 import { IconColor, IconName, IconSize } from '../../../interfaces/icon';
 import { BooleanInput, isTrueBooleanInput } from '../../../utils/boolean-input';
+import { DESIGN_ANGULAR_KIT_CONFIG, DesignAngularKitConfig } from '../../../design-angular-kit-config';
 
 @Component({
   selector: 'it-icon[name]',
@@ -38,7 +39,7 @@ export class IconComponent {
    * Return the icon href
    */
   get iconHref(): string {
-    return `./bootstrap-italia/dist/svg/sprites.svg#it-${this.name}`;
+    return `${this.config.iconHref}#it-${this.name}`;
   }
 
   /**
@@ -61,4 +62,8 @@ export class IconComponent {
     return iconClass;
   }
 
+  constructor(
+    @Inject(DESIGN_ANGULAR_KIT_CONFIG) private readonly config: DesignAngularKitConfig
+  ) {
+  }
 }
diff --git a/src/app/icon/icon-index/icon-index.component.html b/src/app/icon/icon-index/icon-index.component.html
@@ -7,6 +7,11 @@ <h1 class="bd-title">Icone</h1>
   </it-tab-item>
   <it-tab-item label="API" class="pt-3">
     <h3>IconComponent</h3>
+
+    <p>E' possibile configurare il path <strong>href</strong> del componente attraverso la configurazione iniziale della libreria.</p>
+
+    <it-source-display [typescript]="hrefLibraryConfig"></it-source-display>
+
     <it-api-parameters [component]="component"></it-api-parameters>
   </it-tab-item>
 </it-tab-container>
diff --git a/src/app/icon/icon-index/icon-index.component.ts b/src/app/icon/icon-index/icon-index.component.ts
@@ -9,6 +9,23 @@ export class IconIndexComponent {
 
   component: any;
 
+  readonly hrefLibraryConfig = "import {DesignAngularKitModule, DesignAngularKitInit} from 'design-angular-kit';\n" +
+    "  \n" +
+    "  const initConfig: DesignAngularKitInit = {\n" +
+    "    /**\n" +
+    "     * The initial path in the `href` attribute in the `IconComponent` component\n" +
+    "     * @default './bootstrap-italia/dist/svg/sprites.svg'\n" +
+    "     */\n" +
+    "    iconHref: 'my-path/svg/sprites.svg',\n" +
+    "  };\n" +
+    "  \n" +
+    "  @NgModule({\n" +
+    "    imports: [\n" +
+    "      ...\n" +
+    "      DesignAngularKitModule.forRoot(initConfig)\n" +
+    "    ]\n" +
+    "  })";
+
   constructor() {
     this.component = (<any>Documentation).components.find(component => component.name === 'IconComponent');
   }