@energycap/components 0.45.2-multi-select-component.20260305-1130 → 0.46.0

package/README.md

@@ -1,189 +1,189 @@
-# EnergyCAP Components
-A collection of common components used in EnergyCAP's Angular applications.
-
-## Install
-```bash
-npm install @energycap/components
-```
-
-## Usage
-Import library into the root ngModule of your application
-```js
-@import {ComponentsModule} from '@energycap/components'
-
-@NgModule({
-  imports: [
-    ComponentsModule
-  ]
-})
-export class AppModule {}
-```
-
----
-
-## Logo Assets Setup
-The AppBarComponent includes an app icon image with a default path of '/assets/images/icon.svg'. You can either copy the assets that come bundled with the library:
-```js
-// angular.json
-"build": {
-  // ...
-  "options": {
-    // ...
-    "assets": [
-      // ...
-      {
-        "glob": "**/*",
-        "input": "./node_modules/@energycap/components/src/assets/images",
-        "output": "./assets/images"
-      }
-    ]
-  }
-}
-```
-or customize the path by passing a value to the `[iconPath]` input on the `<ec-app-bar>` component.
-```html
-<ec-app-bar iconPath="path/to/my/icon.svg">
-```
-Note: This can also be a fully qualified URL like: https://cdn.freebiesupply.com/images/large/2x/apple-logo-transparent.png.
-
----
-## Logo Assets Setup
-The AppBarComponent includes an app icon image with a default path of '/assets/images/icon.svg'. You can either copy the assets that come bundled with the library:
-```js
-// angular.json
-"build": {
-  // ...
-  "options": {
-    // ...
-    "assets": [
-      // ...
-      {
-        "glob": "**/*",
-        "input": "./node_modules/@energycap/components/assets/images",
-        "output": "./assets/images"
-      }
-    ]
-  }
-}
-```
-or customize the path by passing a value to the `[iconPath]` input on the `<ec-app-bar>` component.
-```html
-<ec-app-bar iconPath="path/to/my/icon.svg">
-```
-Note: This can also be a fully qualified URL like: https://cdn.freebiesupply.com/images/large/2x/apple-logo-transparent.png.
----
-## Form Control Validation Messages Setup
-This library provides helpful validation messages for the components.  We have provided default messages which should be fine for most users, however they do require a bit of extra setup.
-
-The following is the recommended process for an Angular application:
-
-### 1. Update `angular.json`
-The validation messages are provided in a file called `en_US.json` that ships with this library.  The easiest way to make them available to your Angular application is to add the following to `angular.json`:
-
-```js
-// ...
-"build": {
-  // ...
-  "options": {
-    // ...
-    "assets": [
-      // ...
-      {
-        "glob": "**/*.json",
-        "input": "./node_modules/@energycap/components/src/assets/locales",
-        "output": "./assets/locales/"
-      }
-    ]
-  }
-}
-```
-
-### 2. Install an Http Loader
-There is already a peer dependency on [@ngx-translate], which is the mechanism we use to provide the validation messages, so our recommendation is to use their [http-loader].
-
-_Note: This library does not support translation to any language other than English at this time._
-
-```
-npm install @ngx-translate/http-loader --save
-```
-
-### 3. Update AppModule
-Update your `app.module.ts` to use the http-loader:
-
-```js
-import { HttpClient, provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
-import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
-import { TranslateHttpLoader } from '@ngx-translate/http-loader';
-//...
-export function HttpLoaderFactory(http: HttpClient) {
-  return new TranslateHttpLoader(http, "/assets/locales/");
-}
-
-@NgModule({
-  imports: [
-    TranslateModule.forRoot({
-      loader: {
-        provide: TranslateLoader,
-        useFactory: HttpLoaderFactory,
-        deps: [HttpClient]
-      }
-    })
-  ],
-  providers: [provideHttpClient(withInterceptorsFromDi())]
-```
-
-### 4. Update AppComponent
-Update your `app.component.ts`:
-
-```js
-import { TranslateService } from '@ngx-translate/core';
-
-constructor(private translate: TranslateService) {
-  translate.setDefaultLang('en_US');
-  translate.use('en_US');
-}
-```
-
-That's it!
-
----
-
-## Icons
-This library uses icons from @energycap/energycap-icons package, which is listed as a peer dependency. Refer to their [documentation](https://www.npmjs.com/package/@energycap/energycap-icons) for configuring the *webfont* implementation.
-
----
-
-## Unsupported Browsers
-This library does not support Internet Explorer. We've provided a helpful script that will mask the screen when a user attempts to use an
-application built with this library. To add this feature to your application, add the `unsupported-browser.js` script to the scripts array in the `angular.json` file.
-
-```js
-// ...
-"build": {
-  // ...
-  "options": {
-    // ...
-    "scripts": [
-      "./node_modules/@energycap/components/src/assets/scripts/unsupported-browser.js"
-    ]
-  }
-}
-```
-
----
-
-## More Info
-For a list of available components and their usage:
-1. Pull the [energycap-libs repo]
-2. Run:
-   ```
-   npm install
-   npm start
-   ```
-3. Navigate to http://localhost:4200/
-
-
-
-[@ngx-translate]: https://github.com/ngx-translate/core
-[http-loader]: https://github.com/ngx-translate/http-loader
+# EnergyCAP Components
+A collection of common components used in EnergyCAP's Angular applications.
+
+## Install
+```bash
+npm install @energycap/components
+```
+
+## Usage
+Import library into the root ngModule of your application
+```js
+@import {ComponentsModule} from '@energycap/components'
+
+@NgModule({
+  imports: [
+    ComponentsModule
+  ]
+})
+export class AppModule {}
+```
+
+---
+
+## Logo Assets Setup
+The AppBarComponent includes an app icon image with a default path of '/assets/images/icon.svg'. You can either copy the assets that come bundled with the library:
+```js
+// angular.json
+"build": {
+  // ...
+  "options": {
+    // ...
+    "assets": [
+      // ...
+      {
+        "glob": "**/*",
+        "input": "./node_modules/@energycap/components/src/assets/images",
+        "output": "./assets/images"
+      }
+    ]
+  }
+}
+```
+or customize the path by passing a value to the `[iconPath]` input on the `<ec-app-bar>` component.
+```html
+<ec-app-bar iconPath="path/to/my/icon.svg">
+```
+Note: This can also be a fully qualified URL like: https://cdn.freebiesupply.com/images/large/2x/apple-logo-transparent.png.
+
+---
+## Logo Assets Setup
+The AppBarComponent includes an app icon image with a default path of '/assets/images/icon.svg'. You can either copy the assets that come bundled with the library:
+```js
+// angular.json
+"build": {
+  // ...
+  "options": {
+    // ...
+    "assets": [
+      // ...
+      {
+        "glob": "**/*",
+        "input": "./node_modules/@energycap/components/assets/images",
+        "output": "./assets/images"
+      }
+    ]
+  }
+}
+```
+or customize the path by passing a value to the `[iconPath]` input on the `<ec-app-bar>` component.
+```html
+<ec-app-bar iconPath="path/to/my/icon.svg">
+```
+Note: This can also be a fully qualified URL like: https://cdn.freebiesupply.com/images/large/2x/apple-logo-transparent.png.
+---
+## Form Control Validation Messages Setup
+This library provides helpful validation messages for the components.  We have provided default messages which should be fine for most users, however they do require a bit of extra setup.
+
+The following is the recommended process for an Angular application:
+
+### 1. Update `angular.json`
+The validation messages are provided in a file called `en_US.json` that ships with this library.  The easiest way to make them available to your Angular application is to add the following to `angular.json`:
+
+```js
+// ...
+"build": {
+  // ...
+  "options": {
+    // ...
+    "assets": [
+      // ...
+      {
+        "glob": "**/*.json",
+        "input": "./node_modules/@energycap/components/src/assets/locales",
+        "output": "./assets/locales/"
+      }
+    ]
+  }
+}
+```
+
+### 2. Install an Http Loader
+There is already a peer dependency on [@ngx-translate], which is the mechanism we use to provide the validation messages, so our recommendation is to use their [http-loader].
+
+_Note: This library does not support translation to any language other than English at this time._
+
+```
+npm install @ngx-translate/http-loader --save
+```
+
+### 3. Update AppModule
+Update your `app.module.ts` to use the http-loader:
+
+```js
+import { HttpClient, provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
+import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
+import { TranslateHttpLoader } from '@ngx-translate/http-loader';
+//...
+export function HttpLoaderFactory(http: HttpClient) {
+  return new TranslateHttpLoader(http, "/assets/locales/");
+}
+
+@NgModule({
+  imports: [
+    TranslateModule.forRoot({
+      loader: {
+        provide: TranslateLoader,
+        useFactory: HttpLoaderFactory,
+        deps: [HttpClient]
+      }
+    })
+  ],
+  providers: [provideHttpClient(withInterceptorsFromDi())]
+```
+
+### 4. Update AppComponent
+Update your `app.component.ts`:
+
+```js
+import { TranslateService } from '@ngx-translate/core';
+
+constructor(private translate: TranslateService) {
+  translate.setDefaultLang('en_US');
+  translate.use('en_US');
+}
+```
+
+That's it!
+
+---
+
+## Icons
+This library uses icons from @energycap/energycap-icons package, which is listed as a peer dependency. Refer to their [documentation](https://www.npmjs.com/package/@energycap/energycap-icons) for configuring the *webfont* implementation.
+
+---
+
+## Unsupported Browsers
+This library does not support Internet Explorer. We've provided a helpful script that will mask the screen when a user attempts to use an
+application built with this library. To add this feature to your application, add the `unsupported-browser.js` script to the scripts array in the `angular.json` file.
+
+```js
+// ...
+"build": {
+  // ...
+  "options": {
+    // ...
+    "scripts": [
+      "./node_modules/@energycap/components/src/assets/scripts/unsupported-browser.js"
+    ]
+  }
+}
+```
+
+---
+
+## More Info
+For a list of available components and their usage:
+1. Pull the [energycap-libs repo]
+2. Run:
+   ```
+   npm install
+   npm start
+   ```
+3. Navigate to http://localhost:4200/
+
+
+
+[@ngx-translate]: https://github.com/ngx-translate/core
+[http-loader]: https://github.com/ngx-translate/http-loader
 [energycap-libs repo]: https://bitbucket.org/energycap/energycap-libs/src/master/