@whydrf/nava-icon-angular 1.1.2 → 1.4.0

package/README.md

@@ -1,8 +1,10 @@
-<p align="center">
-  <img src="https://raw.githubusercontent.com/whydrf/nava-icon/main/docs/public/favicon.svg" width="60" alt="Nava Icons">
-</p>
 
 <h1 align="center">@whydrf/nava-icon-angular</h1>
+<p align="center">
+  <a href="https://vahidghadiri.github.io/Nava-icon/">
+    Live Documentation
+  </a>
+</p>
 
 <p align="center">
   950+ beautiful, tree-shakeable SVG icons for Angular 17+.
@@ -53,7 +55,7 @@ import { HomeIconComponent, SearchIconComponent, SettingsIconComponent } from '@
 export class NavigationComponent {}
 ```
 
-That's it — no `NavaIconsModule`, no global registration. The component's selector is the kebab-case version of the icon name (e.g., `HomeIconComponent` → `<home-icon>`).
+That's it — no `NavaIconsModule`, no global registration. The component's selector is the kebab-case version of the icon name (e.g., `HomeIconComponent` → `<home-icon>`). For setting default inputs across your app, see [Global Configuration](#global-configuration).
 
 ## How Tree Shaking Works
 
@@ -207,6 +209,52 @@ Icons include built-in accessibility features:
 <home-icon />
 ```
 
+## Global Configuration
+
+Instead of passing the same inputs to every icon, provide a global configuration using Angular's Dependency Injection. All `IconComponent` and static icon components will inherit these values.
+
+```typescript
+// app.config.ts
+import { ApplicationConfig } from '@angular/core'
+import { NAVA_ICON_CONFIG } from '@whydrf/nava-icon-angular'
+
+export const appConfig: ApplicationConfig = {
+  providers: [
+    {
+      provide: NAVA_ICON_CONFIG,
+      useValue: { size: 20, color: 'gray', strokeWidth: 1.5 },
+    },
+  ],
+}
+```
+
+Or in a module-based app:
+
+```typescript
+// app.module.ts
+import { NgModule } from '@angular/core'
+import { NAVA_ICON_CONFIG } from '@whydrf/nava-icon-angular'
+
+@NgModule({
+  providers: [
+    {
+      provide: NAVA_ICON_CONFIG,
+      useValue: { size: 20, color: 'gray', strokeWidth: 1.5 },
+    },
+  ],
+})
+export class AppModule {}
+```
+
+Now every icon inherits the defaults:
+
+```html
+<home-icon />              <!-- size=20, color="gray", strokeWidth=1.5 -->
+<search-icon [size]="24" /> <!-- size=24 overrides — rest inherited -->
+```
+
+**Inputs always override global configuration.** If you pass `[size]="32"` to an icon, that takes priority over the injected `size`.
+
 ## Server-Side Rendering
 
 Nava Icons works with Angular SSR and hydration out of the box. Icons are rendered as regular HTML/SNG elements — no client-side JavaScript required to display them.

package/dist/chunk-6LC2NS7W.js

@@ -0,0 +1,7 @@
+// src/config.ts
+import { InjectionToken } from "@angular/core";
+var NAVA_ICON_CONFIG = new InjectionToken("NAVA_ICON_CONFIG");
+
+export {
+  NAVA_ICON_CONFIG
+};

package/dist/config.cjs

@@ -0,0 +1,31 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/config.ts
+var config_exports = {};
+__export(config_exports, {
+  NAVA_ICON_CONFIG: () => NAVA_ICON_CONFIG
+});
+module.exports = __toCommonJS(config_exports);
+var import_core = require("@angular/core");
+var NAVA_ICON_CONFIG = new import_core.InjectionToken("NAVA_ICON_CONFIG");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  NAVA_ICON_CONFIG
+});

package/dist/config.d.cts

@@ -0,0 +1,6 @@
+import { InjectionToken } from '@angular/core';
+import { NavaIconConfig } from '@whydrf/nava-icon-core';
+
+declare const NAVA_ICON_CONFIG: InjectionToken<NavaIconConfig>;
+
+export { NAVA_ICON_CONFIG };

package/dist/config.d.ts

@@ -0,0 +1,6 @@
+import { InjectionToken } from '@angular/core';
+import { NavaIconConfig } from '@whydrf/nava-icon-core';
+
+declare const NAVA_ICON_CONFIG: InjectionToken<NavaIconConfig>;
+
+export { NAVA_ICON_CONFIG };

package/dist/config.js

@@ -0,0 +1,7 @@
+import {
+  NAVA_ICON_CONFIG
+} from "./chunk-6LC2NS7W.js";
+import "./chunk-GGIGU7GU.js";
+export {
+  NAVA_ICON_CONFIG
+};