http-request-manager 0.0.20 → 4.1.3

package/README.md

@@ -1,273 +1,62 @@
-# Global Store Module
+# Request Manager Service Module
 
-The NGRX Store is the core part of the NGRX library. It is a state container that holds the application state and provides an observable stream of state changes.
+This library has 4 main services that simplify http requests, http request state and local storage states.
 
-A Component Store is a lightweight state management solution designed to be used at the component level. It's particularly useful when you have a component that doesn't need to communicate with the global store but still requires local state management. By using Component Store, you can encapsulate the state management within the component, making it easier to understand and maintain. It also provides a more concise and reactive approach to managing state within a component.
+1) [HttpRequestManager](./README/REQUEST_MANAGER_README.md) (service): This service provides http requests (CRUD operations)
+2) [HttpRequestStateManager](./README/REQUEST_STATE_MANAGER_README.md) (service): This service manages HTTP requests by maintaining state, eliminating the need to construct separate API calls for POST, PUT, and DELETE operations. It uses a GET request to retrieve an array of items and applies standard REST rules to update the state. When the state changes—either by adding a new record or modifying an existing one—the service automatically performs the appropriate POST, PUT, or DELETE requests without requiring explicit API calls.
+3) [LocalStorageManager](./README/LOCAL_STORAGE_MANAGER_README.md) (service):  Enables the storage of data object structures in either localStorage or sessionStorage, maintaining an updated state to reflect storage changes. This approach eliminates the need to manually serialize and deserialize data structures using JSON.stringify and JSON.parse, streamlining data handling. By synchronizing state with storage updates, the service ensures immediate availability of the current state without relying on timers, thereby preventing potential side effects associated with delayed storage operations.
+4) [DatabaseManagerService](./README/DATABASE_MANAGER_README.md) (beta): This extends the `Http-Request-State-Manager` with persistent storage using `DexieJS`, a minimalistic wrapper for IndexedDB (local browser DB). This service defines a table linked to HTTP requests, storing the retrieved data locally. Upon subsequent requests, the `Http-Request-State-Manager` checks the local database first; if the data is absent, it proceeds with the HTTP request. This approach reduces redundant HTTP requests, enhances application responsiveness, and enables offline functionality without requiring an internet connection.
+5) [Interceptors](./README/INTERCEPTORS_README.md): General interceptors that may be applied to the providers for requests.
+   This includes:
 
-## Installation of Component Store (NGRX Store)
+   - credentials - adds the { credentials: true } options for secure cookies to be persistent
+   - proxy-debugger for debugging api requests
+   - request-error for catching all requests the error with 400-500 status and presents a toast-message (snackbar) with the error
+   - request-header provides a few properties that are added to all requests
 
-    ng add @ngrx/component-store@latest
+     - 'Content-Type': 'application/json', // BE header for json type requests
+     - 'Accept-Language': this.language || 'en-CA', //language localization
+     - 'Current-Date': this.currentDate //todays date
+6) [Proxy-Config](./README/INTERCEPTORS_README.md) Support: This allows for proxies to be used when requests are made that are defined.
+7) Demos available for all the above that demonstrate all functionality
 
-## Installation of DixieJS Database
+    - import `HttpRequestManagerModule`
+    -  add the selector `<app-http-request-services-demo></app-http-request-services-demo>` to a template
+    - explore the many options - Top right menus toggles between the above services
 
-    npm install dexie
+## HttpServiceManager, HttpRequestStateManager and DatabaseManagerService Features:
 
-## Installation of Crypto-JS
+- Identical initialization in usage making it easy to migrate from one type to another
+- Unification of features for both `HttpServiceManager` and `HttpRequestStateManager`
+- DatabaseManagerService automatically extends `HttpRequestStateManager` service
 
-    npm install crypto-js
-    npm install --save @types/crypto-js
+### Options
 
-## Angular 15 or Greater
+- Supports CRUD operations
+- Rest and Query Param support
+- State Management (ComponentStore),
+- Recursive Pagination request caching
+- Local Database to manager data request states and requests (beta)
+- Streaming requests (AI)
+- Polling, Next Poll Countdown request %
+- Error Catching and Toast-Display on error
+- Request Retry
+- Pending Request States
+- Downloading File and Streaming Support
 
-Angular 15 and up do not create environment files. If you need to create one for storing a base API path, follow these steps:
+## LocalStorageManager Features
 
-    ng generate environments
+- Supports both local storage and session storage
+- Observable to maintain changes in storage
 
-Once your environment for your API is set, you need to proxy your requests. Create a `proxy.conf.json` file with the following entry:
+### Features:
 
-    {
-    "/api/*": {
-        "target": "https://me.ca/rest/wavecoders",
-        "secure": false,
-        "changeOrigin": true,
-        "pathRewrite": { "^/api": "" },
-        "logLevel": "debug"
-    }
-    }
+- Encryption
+- ExpiredIn
+- Updating, Deleting, Creating
+- Supports data objects (no JSON.stringify or JSON.parse)
 
-- The "/api/\*" describes what it will search for in your request to replace with the target URL (proxy), "target" is the target URL, and adjust the "pathRewrite" to match the search.
-  Then run your app with:
+# Advanced Topics
 
-  ng serve --proxy-config proxy.conf.json --port 8080
-
-Or set up an `npm start:local` command in your package.json.
-
-The Store Module is composed of three main components:
-
-- GlobalDataStore
-
-This is the main component to extend a class and provide options. It connects to all the following services.
-
-## Extended Services
-
-- DBStorageService (DixieJS)
-- ApiDataService (HTTP Request)
-- GlobalDataStorageService (Session/Local Storage)
-- EncryptionDecryptionService (Encryption/Decryption for GlobalDataStorageService)
-- UtilsService (Utility functions)
-- AppService (Unique Instance ID used for Encryption Services for GlobalDataStorageService)
-
-## How to Use GlobalDataStore
-
-1. Extend the Component or Service with `GlobalDataStore` and provide the DataModel:
-
-   export class DashboardComponent extends GlobalDataStore`<ClientBasicDetails>` implements OnInit {
-
-In the constructor, call super with a few options available:
-
-    constructor() {
-    super(
-        {
-            server:`/as/authorization.oauth2`,
-            endpoint: ['oidc', 'clients'],
-            retryTimes: 3,
-            polling: true,
-            retryNextIn: 30,
-            headers: { 'myheader': 'test }
-        },
-        DataType.ARRAY,
-        {
-        adapters: { incoming: ClientBasicDetails.adapt, outgoing: ClientBasicDetails.adapt },
-        database: { table: 'toolrental', expiresIn: '1min' }
-        }
-    );
-    }
-
-A) The first parameter is the API fetch process, with the following options:
-
-- server: `/as/authorization.oauth2` (STRING | REQUIRED)
-
-  Server param has been modified to accepts the following configurations:
-
-  adding `config` allows and Observable or an Object with key/values to be passed as a config setting that may be exhaustive. To define `server` or `endpoint` values from the config properties you simply add the key to the `server` and `endpoint` and they will be extracted.
-
-  ### Sample configurations:
-
-  #### Config_1 - this is an Object:
-
-  {
-  config: { apiService: 'http://apple.com', another: 'sample', endpoint: 'my/endpoint' },
-  server : 'apiService',
-  endpoint: 'endpoint',
-  }
-
-  #### Config_2 - configs is an Observable (Object) and endpoint is a STRING:
-
-  {
-  config: appConfigService.configSubject$,
-  server : 'apiService',
-  endpoint: 'auth/api/toolrental/v1/categories',
-  }
-- endpoint: `['oidc', 'clients']` (STRING|NUMBER)ARRAY | STRING | REQUIRED
-- polling: true (BOOLEAN| OPTIONAL)
-- retryTimes: 3 (NUMBER | OPTIONAL)
-- retryNextIn: 30 (NUMBER | OPTIONAL)
-- headers: { 'myheader': 'test } ( any | OPTIONAL)
-
-B) The second parameter is the Data type expected - ARRAY or OBJECT.
-
-C) The last parameter (optional) defines the shape of the data and the data's persistence:
-
-- adapters: You have `incoming` and `outgoing` adapters (refer to 'Adapter Data Model Pattern' section of this document).
-- database: This is the storage persistence for IndexDB:
-  - table: Name of the table for storage ('toolrental').
-  - expiresIn: Defines when the storage is stale and needs to fetch a new request ('1min').
-
-## Options for Super
-
-### API Request Options:
-
-- SERVER: Base URL for all requests server: `'/as/authorization.oauth2'`.
-- ENDPOINT: An array of path endpoints `['oidc', 'clients']`. QUERY-style requests can be provided as an Object `{ sort: true, client_id: 123 }` and will convert to ?sort=true&client_id:123.
-- POLLING: Poll the request every #seconds (polling: 5 for 5 seconds).
-- RETRYTIMES: Retry the request if it fails #times and then throw an error.
-- RETYRNEXTIN: The HTTP request will wait for #seconds before trying the request again (this only applies to failed requests).
-- HEADERS: All HTTP requests made through this instance will apply HEADERS to the request
-
-### DataType
-
-This refers to the expected response data type, which can be either ARRAY or OBJECT:
-
-- ARRAY: A dataset that may be an array of types or objects.
-- OBJECT: Object structure containing keys and values.
-
-### Input Data Model
-
-This is the model to shape the incoming data. You need to use a Model Adapter pattern to supply the correct type. If you provide no Incoming model, then the default will be whatever the data model currently is. Please refer to the 'Adapter Data Model Pattern' section.
-
-### Output Data Model
-
-This is the model to shape the outgoing (API) data. You need to use a Model Adapter pattern to supply the correct type. If you provide no Outgoing model, then the default will be whatever the data model currently is. Please refer to the 'Adapter Data Model Pattern' section.
-
-### Database Options
-
-If you do not provide the database options, no data storage (cache) will be applied. All requests will continually make requests when called.
-
-- TABLE: This is the Table you would like to create for the HTTP request to store the incoming data. If you need to access and perform your own queries on the data in the database, you can do so with this reference.
-- EXPIRESIN: This indicates when the database data is stale and a new request to replace the data in the database should be made.
-
-### Path Config
-
-server: is the general fixed path for the API.
-endpoint: is related to the endpoint that is used and added to the main server path. This is an ARRAY structure giving you the ability to add dynamic variables at any point for the request; the path is automatically constructed.
-
-Example:
-Using a proxy, the main endpoint is provided and replaced with this value if api is provided in the HTTP request path. This is great if you are switching between environments such as dev, QA, and prod environments.
-
-I) Next, the user wants to use the general server API path - `/as/authorization.oauth2`
-
-II) and then the endpoint that will be added - `['oidc', 'clients']`. This allows you to add dynamic properties.
-
-Here is what the setup would look like:
-
-    super({ server: '/as/authorization.oauth2', endpoint: ['oidc', 'clients'] });
-
-## Adapter Data Model Pattern
-
-    export interface SampleInterface {
-    id: number;
-    name: string;
-    }
-
-    export class Sample implements SampleInterface {
-    constructor(public id = 0, public name = '') {}
-
-    static adapt(item?: any): Sample {
-        // Model your incoming data
-        return new Sample(item?.id, item?.name);
-    }
-
-    static adaptApi(item?: any): any {
-        // Model your outgoing data
-        return {
-        id: item?.id,
-        name: item?.name,
-        };
-    }
-
-    static schema(): string {
-        const model = Object(new Sample()).keys;
-        return model.join();
-    }
-    }
-
-In the above example, the two areas of focus are the static `adapt` function and the `adaptApi` static function. The `adapt` function will shape the incoming data, adding missing properties and defaults. The `adaptApi` function will shape the outgoing data.
-
-The `schema` needs to be defined if you are using the database option. The schema will shape the database keys used for the lookups; it takes the current object's model and extracts the keys. Please note that keys MUST not contain any special characters other than \_, spaces are permitted.
-
-## HTTP Request Methods
-
-Providing no params will request types such as:
-
-- fetchRecords()
-- updateRecord()
-- createRecord()
-- deleteRecord()
-
-will create a request with the base path + endpoint defined.
-
-`this.fetchRecords()`
-
-Example: `https://thd.com/myapp/users/roles`
-
-You may provide additional paths to add to the current path structure (base path + endpoint) by providing an array of `(string|numbers)`. In this example, we have `this.client_id` which is a dynamic variable that changes.
-
-    this.fetchRecords([this.client_id])
-
-Example: `https://thd.com/myapp/users/roles/12`
-
-## GET REQUEST
-
-To GET data from an endpoint:
-
-    this.fetchRecords(params, headers)
-    - PARAMS: additional paths to be added - string[], this is added to nstance of class path
-    - HEADERS: The HTTP request made will apply HEADERS to the request - interceptors and HEADERS instance of class are also applied
-
-## POST REQUEST
-
-To CREATE the new record - the data represents the object to create:
-
-    this.createRecord(data, params, headers)
-    - PARAMS: additional paths to be added - string[], this is added to nstance of class path
-    - HEADERS: The HTTP request made will apply HEADERS to the request - interceptors and HEADERS instance of class are also applied
-
-## PUT REQUEST
-
-To UPDATE the existing record - the `data` represents the object to update, which should include the `ID` which will be used in the request:
-
-    this.updateRecord(data, params, headers)
-     - PARAMS: additional paths to be added - string[], this is added to nstance of class path
-     - HEADERS: The HTTP request made will apply HEADERS to the request - interceptors and HEADERS instance of class are also applied
-
-## DELETE REQUEST
-
-To DELETE the existing record - the data represents the object to update, which should include the ID which will be used in the request:
-
-    this.deleteRecord(data, params, headers)
-    - PARAMS: additional paths to be added - string[], this is added to nstance of class path
-    - HEADERS: The HTTP request made will apply HEADERS to the request - interceptors and HEADERS instance of class are also applied
-
-## Access to Data from API
-
-To get the data, it is available as `data$` from the extended class, as with the methods since it extends the current class.
-
-You should define a variable to use the `data$` from the extended class in your component or service like the following:
-
-    myData$ = this.data$ as Observable<ClientDetails[]>
-
-This defines the observable as this type.
-
-Then you can in your HTML reference this Observable
-
-`<div ngif="(myData$ | async) as data">{{ data.name }}</div>`
+1) [Module.forRoot()](./README/FORROOT_README%20copy.md) Module.forRoot() Configuration for Defaults
+2) [Adapter-Models](./README/ADAPTERS_README.md) Pattern - Strong Types

package/esm2022/lib/http-request-manager.module.mjs

@@ -0,0 +1,145 @@
+import { HTTP_INTERCEPTORS } from '@angular/common/http';
+import { NgModule } from '@angular/core';
+import { WithCredentialsInterceptor, RequestHeadersInterceptor } from './interceptors';
+import { TranslateModule } from '@ngx-translate/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { MatAutocompleteModule } from '@angular/material/autocomplete';
+import { MatButtonModule } from '@angular/material/button';
+import { MatChipsModule } from '@angular/material/chips';
+import { MatDividerModule } from '@angular/material/divider';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatIconModule } from '@angular/material/icon';
+import { MatInputModule } from '@angular/material/input';
+import { MatProgressBarModule } from '@angular/material/progress-bar';
+import { MatSelectModule } from '@angular/material/select';
+import { MatSidenavModule } from '@angular/material/sidenav';
+import { MatSlideToggleModule } from '@angular/material/slide-toggle';
+import { MatMenuModule } from '@angular/material/menu';
+import { MatToolbarModule } from '@angular/material/toolbar';
+import { MatTableModule } from '@angular/material/table';
+import { MatButtonToggleModule } from '@angular/material/button-toggle';
+import { ProxyDebuggerInterceptor } from './interceptors/proxy-debugger.interceptor';
+import { ConfigOptions } from './models';
+import { CONFIG_SETTINGS_TOKEN } from './models/config-token.model';
+import { HTTPManagerService, LocalStorageManagerService } from './services';
+import { FileDownloaderModule } from './http-request-services-demo/request-manager-demo/file-downloader/file-download.module';
+import { ToastMessageModule } from 'toast-message-display';
+import { HttpRequestServicesDemoComponent } from '../public-api';
+import { LocalStorageDemoComponent } from './http-request-services-demo/local-storage-demo/local-storage-demo.component';
+import { RequestManagerDemoComponent } from './http-request-services-demo/request-manager-demo/request-manager-demo.component';
+import { RequestManagerStateDemoComponent } from './http-request-services-demo/request-manager-state-demo/request-manager-state-demo.component';
+import * as i0 from "@angular/core";
+import * as i1 from "@ngx-translate/core";
+export class HttpRequestManagerModule {
+    static forRoot(config = ConfigOptions.adapt()) {
+        return {
+            ngModule: HttpRequestManagerModule,
+            providers: [
+                { provide: CONFIG_SETTINGS_TOKEN, useValue: ConfigOptions.adapt(config) },
+                HTTPManagerService, LocalStorageManagerService //all services that need access to config
+            ],
+        };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HttpRequestManagerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: HttpRequestManagerModule, declarations: [HttpRequestServicesDemoComponent,
+            RequestManagerStateDemoComponent,
+            RequestManagerDemoComponent,
+            LocalStorageDemoComponent
+            // DatabaseDataDemoComponent,
+        ], imports: [CommonModule,
+            ToastMessageModule,
+            FormsModule,
+            ReactiveFormsModule,
+            MatButtonModule,
+            MatSelectModule,
+            MatChipsModule,
+            MatMenuModule,
+            MatIconModule,
+            MatTableModule,
+            MatToolbarModule,
+            MatButtonToggleModule,
+            MatAutocompleteModule,
+            MatProgressBarModule,
+            MatSlideToggleModule,
+            MatDividerModule,
+            MatFormFieldModule,
+            MatInputModule,
+            MatSlideToggleModule, i1.TranslateModule, MatSidenavModule,
+            FileDownloaderModule], exports: [HttpRequestServicesDemoComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HttpRequestManagerModule, providers: [
+            { provide: HTTP_INTERCEPTORS, useClass: WithCredentialsInterceptor, multi: true },
+            { provide: HTTP_INTERCEPTORS, useClass: RequestHeadersInterceptor, multi: true },
+            { provide: HTTP_INTERCEPTORS, useClass: ProxyDebuggerInterceptor, multi: true },
+            { provide: CONFIG_SETTINGS_TOKEN, useValue: ConfigOptions.adapt() },
+            HTTPManagerService, LocalStorageManagerService
+        ], imports: [CommonModule,
+            ToastMessageModule,
+            FormsModule,
+            ReactiveFormsModule,
+            MatButtonModule,
+            MatSelectModule,
+            MatChipsModule,
+            MatMenuModule,
+            MatIconModule,
+            MatTableModule,
+            MatToolbarModule,
+            MatButtonToggleModule,
+            MatAutocompleteModule,
+            MatProgressBarModule,
+            MatSlideToggleModule,
+            MatDividerModule,
+            MatFormFieldModule,
+            MatInputModule,
+            MatSlideToggleModule,
+            TranslateModule.forRoot(),
+            MatSidenavModule,
+            FileDownloaderModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HttpRequestManagerModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        ToastMessageModule,
+                        FormsModule,
+                        ReactiveFormsModule,
+                        MatButtonModule,
+                        MatSelectModule,
+                        MatChipsModule,
+                        MatMenuModule,
+                        MatIconModule,
+                        MatTableModule,
+                        MatToolbarModule,
+                        MatButtonToggleModule,
+                        MatAutocompleteModule,
+                        MatProgressBarModule,
+                        MatSlideToggleModule,
+                        MatDividerModule,
+                        MatFormFieldModule,
+                        MatInputModule,
+                        MatSlideToggleModule,
+                        TranslateModule.forRoot(),
+                        MatSidenavModule,
+                        FileDownloaderModule,
+                    ],
+                    declarations: [
+                        HttpRequestServicesDemoComponent,
+                        RequestManagerStateDemoComponent,
+                        RequestManagerDemoComponent,
+                        LocalStorageDemoComponent
+                        // DatabaseDataDemoComponent,
+                    ],
+                    exports: [
+                        HttpRequestServicesDemoComponent,
+                    ],
+                    providers: [
+                        { provide: HTTP_INTERCEPTORS, useClass: WithCredentialsInterceptor, multi: true },
+                        { provide: HTTP_INTERCEPTORS, useClass: RequestHeadersInterceptor, multi: true },
+                        { provide: HTTP_INTERCEPTORS, useClass: ProxyDebuggerInterceptor, multi: true },
+                        { provide: CONFIG_SETTINGS_TOKEN, useValue: ConfigOptions.adapt() },
+                        HTTPManagerService, LocalStorageManagerService
+                    ],
+                }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaHR0cC1yZXF1ZXN0LW1hbmFnZXIubW9kdWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvaHR0cC1yZXF1ZXN0LW1hbmFnZXIvc3JjL2xpYi9odHRwLXJlcXVlc3QtbWFuYWdlci5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFDekQsT0FBTyxFQUF1QixRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFFOUQsT0FBTyxFQUFFLDBCQUEwQixFQUFFLHlCQUF5QixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDdkYsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHFCQUFxQixDQUFDO0FBRXRELE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUUvQyxPQUFPLEVBQUUsV0FBVyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDbEUsT0FBTyxFQUFFLHFCQUFxQixFQUFFLE1BQU0sZ0NBQWdDLENBQUM7QUFDdkUsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLDBCQUEwQixDQUFDO0FBQzNELE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQztBQUN6RCxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUM3RCxPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQztBQUNsRSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUM7QUFDdkQsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBQ3pELE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxNQUFNLGdDQUFnQyxDQUFDO0FBQ3RFLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQztBQUMzRCxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSwy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LEtBQUssRUFBRSxFQUFFO3dCQUNuRSxrQkFBa0IsRUFBRSwwQkFBMEI7cUJBQy9DO2lCQUNGIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgSFRUUF9JTlRFUkNFUFRPUlMgfSBmcm9tICdAYW5ndWxhci9jb21tb24vaHR0cCc7XG5pbXBvcnQgeyBNb2R1bGVXaXRoUHJvdmlkZXJzLCBOZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5pbXBvcnQgeyBXaXRoQ3JlZGVudGlhbHNJbnRlcmNlcHRvciwgUmVxdWVzdEhlYWRlcnNJbnRlcmNlcHRvciB9IGZyb20gJy4vaW50ZXJjZXB0b3JzJztcbmltcG9ydCB7IFRyYW5zbGF0ZU1vZHVsZSB9IGZyb20gJ0BuZ3gtdHJhbnNsYXRlL2NvcmUnO1xuXG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuXG5pbXBvcnQgeyBGb3Jtc01vZHVsZSwgUmVhY3RpdmVGb3Jtc01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcbmltcG9ydCB7IE1hdEF1dG9jb21wbGV0ZU1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL2F1dG9jb21wbGV0ZSc7XG5pbXBvcnQgeyBNYXRCdXR0b25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9idXR0b24nO1xuaW1wb3J0IHsgTWF0Q2hpcHNNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9jaGlwcyc7XG5pbXBvcnQgeyBNYXREaXZpZGVyTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvZGl2aWRlcic7XG5pbXBvcnQgeyBNYXRGb3JtRmllbGRNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9mb3JtLWZpZWxkJztcbmltcG9ydCB7IE1hdEljb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9pY29uJztcbmltcG9ydCB7IE1hdElucHV0TW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvaW5wdXQnO1xuaW1wb3J0IHsgTWF0UHJvZ3Jlc3NCYXJNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9wcm9ncmVzcy1iYXInO1xuaW1wb3J0IHsgTWF0U2VsZWN0TW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvc2VsZWN0JztcbmltcG9ydCB7IE1hdFNpZGVuYXZNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9zaWRlbmF2JztcbmltcG9ydCB7IE1hdFNsaWRlVG9nZ2xlTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvc2xpZGUtdG9nZ2xlJztcbmltcG9ydCB7IE1hdE1lbnVNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9tZW51JztcbmltcG9ydCB7IE1hdFRvb2xiYXJNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC90b29sYmFyJztcbmltcG9ydCB7IE1hdFRhYmxlTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvdGFibGUnO1xuaW1wb3J0IHsgTWF0QnV0dG9uVG9nZ2xlTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvYnV0dG9uLXRvZ2dsZSc7XG5pbXBvcnQgeyBQcm94eURlYnVnZ2VySW50ZXJjZXB0b3IgfSBmcm9tICcuL2ludGVyY2VwdG9ycy9wcm94eS1kZWJ1Z2dlci5pbnRlcmNlcHRvcic7XG5cbmltcG9ydCB7IENvbmZpZ09wdGlvbnMgfSBmcm9tICcuL21vZGVscyc7XG5pbXBvcnQgeyBDT05GSUdfU0VUVElOR1NfVE9LRU4gfSBmcm9tICcuL21vZGVscy9jb25maWctdG9rZW4ubW9kZWwnO1xuaW1wb3J0IHsgSFRUUE1hbmFnZXJTZXJ2aWNlLCBMb2NhbFN0b3JhZ2VNYW5hZ2VyU2VydmljZSB9IGZyb20gJy4vc2VydmljZXMnO1xuXG5pbXBvcnQgeyBGaWxlRG93bmxvYWRlck1vZHVsZSB9IGZyb20gJy4vaHR0cC1yZXF1ZXN0LXNlcnZpY2VzLWRlbW8vcmVxdWVzdC1tYW5hZ2VyLWRlbW8vZmlsZS1kb3dubG9hZGVyL2ZpbGUtZG93bmxvYWQubW9kdWxlJztcblxuaW1wb3J0IHsgVG9hc3RNZXNzYWdlTW9kdWxlIH0gZnJvbSAndG9hc3QtbWVzc2FnZS1kaXNwbGF5JztcblxuaW1wb3J0IHsgSHR0cFJlcXVlc3RTZXJ2aWNlc0RlbW9Db21wb25lbnQgfSBmcm9tICcuLi9wdWJsaWMtYXBpJztcbmltcG9ydCB7IExvY2FsU3RvcmFnZURlbW9Db21wb25lbnQgfSBmcm9tICcuL2h0dHAtcmVxdWVzdC1zZXJ2aWNlcy1kZW1vL2xvY2FsLXN0b3JhZ2UtZGVtby9sb2NhbC1zdG9yYWdlLWRlbW8uY29tcG9uZW50JztcbmltcG9ydCB7IFJlcXVlc3RNYW5hZ2VyRGVtb0NvbXBvbmVudCB9IGZyb20gJy4vaHR0cC1yZXF1ZXN0LXNlcnZpY2VzLWRlbW8vcmVxdWVzdC1tYW5hZ2VyLWRlbW8vcmVxdWVzdC1tYW5hZ2VyLWRlbW8uY29tcG9uZW50JztcbmltcG9ydCB7IFJlcXVlc3RNYW5hZ2VyU3RhdGVEZW1vQ29tcG9uZW50IH0gZnJvbSAnLi9odHRwLXJlcXVlc3Qtc2VydmljZXMtZGVtby9yZXF1ZXN0LW1hbmFnZXItc3RhdGUtZGVtby9yZXF1ZXN0LW1hbmFnZXItc3RhdGUtZGVtby5jb21wb25lbnQnO1xuXG5ATmdNb2R1bGUoe1xuICBpbXBvcnRzOiBbXG4gICAgQ29tbW9uTW9kdWxlLFxuICAgIFRvYXN0TWVzc2FnZU1vZHVsZSxcbiAgICBGb3Jtc01vZHVsZSxcbiAgICBSZWFjdGl2ZUZvcm1zTW9kdWxlLFxuICAgIE1hdEJ1dHRvbk1vZHVsZSxcbiAgICBNYXRTZWxlY3RNb2R1bGUsXG4gICAgTWF0Q2hpcHNNb2R1bGUsXG4gICAgTWF0TWVudU1vZHVsZSxcbiAgICBNYXRJY29uTW9kdWxlLFxuICAgIE1hdFRhYmxlTW9kdWxlLFxuICAgIE1hdFRvb2xiYXJNb2R1bGUsXG4gICAgTWF0QnV0dG9uVG9nZ2xlTW9kdWxlLFxuICAgIE1hdEF1dG9jb21wbGV0ZU1vZHVsZSxcbiAgICBNYXRQcm9ncmVzc0Jhck1vZHVsZSxcbiAgICBNYXRTbGlkZVRvZ2dsZU1vZHVsZSxcbiAgICBNYXREaXZpZGVyTW9kdWxlLFxuICAgIE1hdEZvcm1GaWVsZE1vZHVsZSxcbiAgICBNYXRJbnB1dE1vZHVsZSxcbiAgICBNYXRTbGlkZVRvZ2dsZU1vZHVsZSxcbiAgICBUcmFuc2xhdGVNb2R1bGUuZm9yUm9vdCgpLFxuICAgIE1hdFNpZGVuYXZNb2R1bGUsXG4gICAgRmlsZURvd25sb2FkZXJNb2R1bGUsXG4gIF0sXG4gIGRlY2xhcmF0aW9uczogW1xuICAgIEh0dHBSZXF1ZXN0U2VydmljZXNEZW1vQ29tcG9uZW50LFxuICAgIFJlcXVlc3RNYW5hZ2VyU3RhdGVEZW1vQ29tcG9uZW50LFxuICAgIFJlcXVlc3RNYW5hZ2VyRGVtb0NvbXBvbmVudCxcbiAgICBMb2NhbFN0b3JhZ2VEZW1vQ29tcG9uZW50XG4gICAgLy8gRGF0YWJhc2VEYXRhRGVtb0NvbXBvbmVudCxcbiAgXSxcbiAgZXhwb3J0czogW1xuICAgIEh0dHBSZXF1ZXN0U2VydmljZXNEZW1vQ29tcG9uZW50LFxuICBdLFxuICBwcm92aWRlcnM6IFtcbiAgICB7IHByb3ZpZGU6IEhUVFBfSU5URVJDRVBUT1JTLCB1c2VDbGFzczogV2l0aENyZWRlbnRpYWxzSW50ZXJjZXB0b3IsIG11bHRpOiB0cnVlIH0sXG4gICAgeyBwcm92aWRlOiBIVFRQX0lOVEVSQ0VQVE9SUywgdXNlQ2xhc3M6IFJlcXVlc3RIZWFkZXJzSW50ZXJjZXB0b3IsIG11bHRpOiB0cnVlIH0sXG4gICAgeyBwcm92aWRlOiBIVFRQX0lOVEVSQ0VQVE9SUywgdXNlQ2xhc3M6IFByb3h5RGVidWdnZXJJbnRlcmNlcHRvciwgbXVsdGk6IHRydWUgfSxcbiAgICB7IHByb3ZpZGU6IENPTkZJR19TRVRUSU5HU19UT0tFTiwgdXNlVmFsdWU6IENvbmZpZ09wdGlvbnMuYWRhcHQoKSB9LFxuICAgIEhUVFBNYW5hZ2VyU2VydmljZSwgTG9jYWxTdG9yYWdlTWFuYWdlclNlcnZpY2VcbiAgXSxcbn0pXG5leHBvcnQgY2xhc3MgSHR0cFJlcXVlc3RNYW5hZ2VyTW9kdWxlIHtcblxuICBzdGF0aWMgZm9yUm9vdChjb25maWc6IENvbmZpZ09wdGlvbnMgPSBDb25maWdPcHRpb25zLmFkYXB0KCkpOiBNb2R1bGVXaXRoUHJvdmlkZXJzPEh0dHBSZXF1ZXN0TWFuYWdlck1vZHVsZT4ge1xuICAgIHJldHVybiB7XG4gICAgICBuZ01vZHVsZTogSHR0cFJlcXVlc3RNYW5hZ2VyTW9kdWxlLFxuICAgICAgcHJvdmlkZXJzOiBbXG4gICAgICAgIHsgcHJvdmlkZTogQ09ORklHX1NFVFRJTkdTX1RPS0VOLCB1c2VWYWx1ZTogQ29uZmlnT3B0aW9ucy5hZGFwdChjb25maWcpIH0sXG4gICAgICAgIEhUVFBNYW5hZ2VyU2VydmljZSwgTG9jYWxTdG9yYWdlTWFuYWdlclNlcnZpY2UgLy9hbGwgc2VydmljZXMgdGhhdCBuZWVkIGFjY2VzcyB0byBjb25maWdcbiAgICAgIF0sXG4gICAgfTtcbiAgICB9XG5cbn1cblxuXG4iXX0=

package/esm2022/lib/http-request-services-demo/http-request-services-demo.component.mjs

@@ -0,0 +1,41 @@
+import { Component, Inject } from '@angular/core';
+import { CONFIG_SETTINGS_TOKEN } from '../models/config-token.model';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "@angular/material/button";
+import * as i3 from "@angular/material/menu";
+import * as i4 from "@angular/material/toolbar";
+import * as i5 from "@angular/material/divider";
+import * as i6 from "./request-manager-state-demo/request-manager-state-demo.component";
+import * as i7 from "./request-manager-demo/request-manager-demo.component";
+import * as i8 from "./local-storage-demo/local-storage-demo.component";
+import * as i9 from "../models/config-options.model";
+export class HttpRequestServicesDemoComponent {
+    constructor(configOptions) {
+        this.configOptions = configOptions;
+        this.requestTypes = [
+            { name: "Http Service", value: 'http_service' },
+            { name: "Http State Service", value: 'http_state_service' },
+            { name: "Database Service", value: 'database_service', divider: true, disabled: true },
+            { name: "Local Storage Service", value: 'local_storage_service' },
+        ];
+        this.selectedService = this.requestTypes[0].value;
+    }
+    ngOnInit() {
+        if (this.configOptions)
+            this.injectionOptions = this.configOptions;
+    }
+    onSelected(type) {
+        this.selectedService = this.requestTypes[type].value;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HttpRequestServicesDemoComponent, deps: [{ token: CONFIG_SETTINGS_TOKEN }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HttpRequestServicesDemoComponent, selector: "app-http-request-services-demo", ngImport: i0, template: "<mat-toolbar  style=\"display:flex\">\n  <div>Global Data</div>\n  <div style=\"flex:1\"></div>\n  <button mat-stroked-button [matMenuTriggerFor]=\"menu\">Services</button>\n  <mat-menu #menu=\"matMenu\">\n    <ng-container *ngFor=\"let type of requestTypes; index as i\">\n      <div\n        *ngIf=\"type?.divider\"\n        style=\"margin-top: .5rem; margin-bottom: .5rem;\"\n      >\n        <mat-divider></mat-divider>\n      </div>\n      <button\n        mat-menu-item\n        (click)=\"onSelected(i)\"\n        [disabled]=\"type.disabled\"\n        >\n        {{ type.name }}\n      </button>\n    </ng-container>\n\n  </mat-menu>\n</mat-toolbar>\n\n<span [ngSwitch]=\"selectedService\">\n  <p *ngSwitchCase=\"'http_service'\">\n    <ng-container *ngTemplateOutlet=\"HTTP_OPTIONS\"></ng-container>\n    <app-request-manager-demo></app-request-manager-demo>\n  </p>\n  <p *ngSwitchCase=\"'http_state_service'\">\n    <ng-container *ngTemplateOutlet=\"HTTP_OPTIONS\"></ng-container>\n    <app-request-manager-state-demo></app-request-manager-state-demo>\n  </p>\n  <p *ngSwitchCase=\"'database_service'\">\n    <!-- <app-database-data-demo></app-database-data-demo> -->\n  </p>\n  <p *ngSwitchCase=\"'local_storage_service'\">\n    <ng-container *ngTemplateOutlet=\"LOCAL_OPTIONS\"></ng-container>\n    <app-local-storage-demo></app-local-storage-demo>\n  </p>\n  <p *ngSwitchDefault>\n    Other\n  </p>\n</span>\n\n<ng-template #HTTP_OPTIONS>\n  <ng-container *ngIf=\"injectionOptions?.httpRequestOptions\">\n    <div class=\"box\">\n      <h3 style=\"font-weight: bold;\">Injection Token Detected - HTTP Options</h3>\n      {{ injectionOptions?.httpRequestOptions| json }}\n    </div>\n  </ng-container>\n</ng-template>\n\n<ng-template #LOCAL_OPTIONS>\n  <ng-container class=\"box\" *ngIf=\"injectionOptions?.LocalStorageOptions\">\n    <div class=\"box\">\n      <h3 style=\"font-weight: bold;\">Injection Token Detected - LocalStorage Options</h3>\n      {{ injectionOptions?.LocalStorageOptions| json }}\n    </div>\n  </ng-container>\n</ng-template>\n\n\n", styles: [".box{padding:1rem;background-color:#f5f5f5;border:thin gray solid;margin-top:1rem}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i2.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i3.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i4.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i5.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i6.RequestManagerStateDemoComponent, selector: "app-request-manager-state-demo" }, { kind: "component", type: i7.RequestManagerDemoComponent, selector: "app-request-manager-demo" }, { kind: "component", type: i8.LocalStorageDemoComponent, selector: "app-local-storage-demo" }, { kind: "pipe", type: i1.JsonPipe, name: "json" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HttpRequestServicesDemoComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-http-request-services-demo', template: "<mat-toolbar  style=\"display:flex\">\n  <div>Global Data</div>\n  <div style=\"flex:1\"></div>\n  <button mat-stroked-button [matMenuTriggerFor]=\"menu\">Services</button>\n  <mat-menu #menu=\"matMenu\">\n    <ng-container *ngFor=\"let type of requestTypes; index as i\">\n      <div\n        *ngIf=\"type?.divider\"\n        style=\"margin-top: .5rem; margin-bottom: .5rem;\"\n      >\n        <mat-divider></mat-divider>\n      </div>\n      <button\n        mat-menu-item\n        (click)=\"onSelected(i)\"\n        [disabled]=\"type.disabled\"\n        >\n        {{ type.name }}\n      </button>\n    </ng-container>\n\n  </mat-menu>\n</mat-toolbar>\n\n<span [ngSwitch]=\"selectedService\">\n  <p *ngSwitchCase=\"'http_service'\">\n    <ng-container *ngTemplateOutlet=\"HTTP_OPTIONS\"></ng-container>\n    <app-request-manager-demo></app-request-manager-demo>\n  </p>\n  <p *ngSwitchCase=\"'http_state_service'\">\n    <ng-container *ngTemplateOutlet=\"HTTP_OPTIONS\"></ng-container>\n    <app-request-manager-state-demo></app-request-manager-state-demo>\n  </p>\n  <p *ngSwitchCase=\"'database_service'\">\n    <!-- <app-database-data-demo></app-database-data-demo> -->\n  </p>\n  <p *ngSwitchCase=\"'local_storage_service'\">\n    <ng-container *ngTemplateOutlet=\"LOCAL_OPTIONS\"></ng-container>\n    <app-local-storage-demo></app-local-storage-demo>\n  </p>\n  <p *ngSwitchDefault>\n    Other\n  </p>\n</span>\n\n<ng-template #HTTP_OPTIONS>\n  <ng-container *ngIf=\"injectionOptions?.httpRequestOptions\">\n    <div class=\"box\">\n      <h3 style=\"font-weight: bold;\">Injection Token Detected - HTTP Options</h3>\n      {{ injectionOptions?.httpRequestOptions| json }}\n    </div>\n  </ng-container>\n</ng-template>\n\n<ng-template #LOCAL_OPTIONS>\n  <ng-container class=\"box\" *ngIf=\"injectionOptions?.LocalStorageOptions\">\n    <div class=\"box\">\n      <h3 style=\"font-weight: bold;\">Injection Token Detected - LocalStorage Options</h3>\n      {{ injectionOptions?.LocalStorageOptions| json }}\n    </div>\n  </ng-container>\n</ng-template>\n\n\n", styles: [".box{padding:1rem;background-color:#f5f5f5;border:thin gray solid;margin-top:1rem}\n"] }]
+        }], ctorParameters: function () { return [{ type: i9.ConfigOptions, decorators: [{
+                    type: Inject,
+                    args: [CONFIG_SETTINGS_TOKEN]
+                }] }]; } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaHR0cC1yZXF1ZXN0LXNlcnZpY2VzLWRlbW8uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvaHR0cC1yZXF1ZXN0LW1hbmFnZXIvc3JjL2xpYi9odHRwLXJlcXVlc3Qtc2VydmljZXMtZGVtby9odHRwLXJlcXVlc3Qtc2VydmljZXMtZGVtby5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9odHRwLXJlcXVlc3QtbWFuYWdlci9zcmMvbGliL2h0dHAtcmVxdWVzdC1zZXJ2aWNlcy1kZW1vL2h0dHAtcmVxdWVzdC1zZXJ2aWNlcy1kZW1vLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFVLE1BQU0sZUFBZSxDQUFDO0FBRTFELE9BQU8sRUFBRSxxQkFBcUIsRUFBRSxNQUFNLDhCQUE4QixDQUFDOzs7Ozs7Ozs7OztBQVFyRSxNQUFNLE9BQU8sZ0NBQWdDO0lBYTNDLFlBQW1ELGFBQTZCO1FBQTdCLGtCQUFhLEdBQWIsYUFBYSxDQUFnQjtRQVhoRixpQkFBWSxHQUFHO1lBQ2IsRUFBRSxJQUFJLEVBQUUsY0FBYyxFQUFFLEtBQUssRUFBRSxjQUFjLEVBQUU7WUFDL0MsRUFBRSxJQUFJLEVBQUUsb0JBQW9CLEVBQUUsS0FBSyxFQUFFLG9CQUFvQixFQUFFO1lBQzNELEVBQUUsSUFBSSxFQUFFLGtCQUFrQixFQUFFLEtBQUssRUFBRSxrQkFBa0IsRUFBRSxPQUFPLEVBQUUsSUFBSSxFQUFFLFFBQVEsRUFBRSxJQUFJLEVBQUU7WUFDdEYsRUFBRSxJQUFJLEVBQUUsdUJBQXVCLEVBQUUsS0FBSyxFQUFFLHVCQUF1QixFQUFFO1NBQ2xFLENBQUE7UUFFRCxvQkFBZSxHQUFHLElBQUksQ0FBQyxZQUFZLENBQUMsQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFBO0lBSXdDLENBQUM7SUFFckYsUUFBUTtRQUNOLElBQUcsSUFBSSxDQUFDLGFBQWE7WUFBRSxJQUFJLENBQUMsZ0JBQWdCLEdBQUcsSUFBSSxDQUFDLGFBQWEsQ0FBQTtJQUNuRSxDQUFDO0lBRUQsVUFBVSxDQUFDLElBQVk7UUFDckIsSUFBSSxDQUFDLGVBQWUsR0FBRyxJQUFJLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxDQUFDLEtBQUssQ0FBQTtJQUN0RCxDQUFDOytHQXJCVSxnQ0FBZ0Msa0JBYXZCLHFCQUFxQjttR0FiOUIsZ0NBQWdDLHNFQ1Y3QyxzaEVBZ0VBOzs0RkR0RGEsZ0NBQWdDO2tCQUw1QyxTQUFTOytCQUNFLGdDQUFnQzs7MEJBaUI3QixNQUFNOzJCQUFDLHFCQUFxQiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5qZWN0LCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuaW1wb3J0IHsgQ09ORklHX1NFVFRJTkdTX1RPS0VOIH0gZnJvbSAnLi4vbW9kZWxzL2NvbmZpZy10b2tlbi5tb2RlbCc7XG5pbXBvcnQgeyBDb25maWdPcHRpb25zIH0gZnJvbSAnLi4vbW9kZWxzL2NvbmZpZy1vcHRpb25zLm1vZGVsJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnYXBwLWh0dHAtcmVxdWVzdC1zZXJ2aWNlcy1kZW1vJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2h0dHAtcmVxdWVzdC1zZXJ2aWNlcy1kZW1vLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vaHR0cC1yZXF1ZXN0LXNlcnZpY2VzLWRlbW8uY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBIdHRwUmVxdWVzdFNlcnZpY2VzRGVtb0NvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG5cbiAgcmVxdWVzdFR5cGVzID0gW1xuICAgIHsgbmFtZTogXCJIdHRwIFNlcnZpY2VcIiwgdmFsdWU6ICdodHRwX3NlcnZpY2UnIH0sXG4gICAgeyBuYW1lOiBcIkh0dHAgU3RhdGUgU2VydmljZVwiLCB2YWx1ZTogJ2h0dHBfc3RhdGVfc2VydmljZScgfSxcbiAgICB7IG5hbWU6IFwiRGF0YWJhc2UgU2VydmljZVwiLCB2YWx1ZTogJ2RhdGFiYXNlX3NlcnZpY2UnLCBkaXZpZGVyOiB0cnVlLCBkaXNhYmxlZDogdHJ1ZSB9LFxuICAgIHsgbmFtZTogXCJMb2NhbCBTdG9yYWdlIFNlcnZpY2VcIiwgdmFsdWU6ICdsb2NhbF9zdG9yYWdlX3NlcnZpY2UnIH0sXG4gIF1cblxuICBzZWxlY3RlZFNlcnZpY2UgPSB0aGlzLnJlcXVlc3RUeXBlc1swXS52YWx1ZVxuXG4gIGluamVjdGlvbk9wdGlvbnM/OiBDb25maWdPcHRpb25zXG5cbiAgY29uc3RydWN0b3IoQEluamVjdChDT05GSUdfU0VUVElOR1NfVE9LRU4pIHByaXZhdGUgY29uZmlnT3B0aW9ucz86IENvbmZpZ09wdGlvbnMpIHsgfVxuXG4gIG5nT25Jbml0KCkge1xuICAgIGlmKHRoaXMuY29uZmlnT3B0aW9ucykgdGhpcy5pbmplY3Rpb25PcHRpb25zID0gdGhpcy5jb25maWdPcHRpb25zXG4gIH1cblxuICBvblNlbGVjdGVkKHR5cGU6IG51bWJlcikge1xuICAgIHRoaXMuc2VsZWN0ZWRTZXJ2aWNlID0gdGhpcy5yZXF1ZXN0VHlwZXNbdHlwZV0udmFsdWVcbiAgfVxuXG59XG4iLCI8bWF0LXRvb2xiYXIgIHN0eWxlPVwiZGlzcGxheTpmbGV4XCI+XG4gIDxkaXY+R2xvYmFsIERhdGE8L2Rpdj5cbiAgPGRpdiBzdHlsZT1cImZsZXg6MVwiPjwvZGl2PlxuICA8YnV0dG9uIG1hdC1zdHJva2VkLWJ1dHRvbiBbbWF0TWVudVRyaWdnZXJGb3JdPVwibWVudVwiPlNlcnZpY2VzPC9idXR0b24+XG4gIDxtYXQtbWVudSAjbWVudT1cIm1hdE1lbnVcIj5cbiAgICA8bmctY29udGFpbmVyICpuZ0Zvcj1cImxldCB0eXBlIG9mIHJlcXVlc3RUeXBlczsgaW5kZXggYXMgaVwiPlxuICAgICAgPGRpdlxuICAgICAgICAqbmdJZj1cInR5cGU/LmRpdmlkZXJcIlxuICAgICAgICBzdHlsZT1cIm1hcmdpbi10b3A6IC41cmVtOyBtYXJnaW4tYm90dG9tOiAuNXJlbTtcIlxuICAgICAgPlxuICAgICAgICA8bWF0LWRpdmlkZXI+PC9tYXQtZGl2aWRlcj5cbiAgICAgIDwvZGl2PlxuICAgICAgPGJ1dHRvblxuICAgICAgICBtYXQtbWVudS1pdGVtXG4gICAgICAgIChjbGljayk9XCJvblNlbGVjdGVkKGkpXCJcbiAgICAgICAgW2Rpc2FibGVkXT1cInR5cGUuZGlzYWJsZWRcIlxuICAgICAgICA+XG4gICAgICAgIHt7IHR5cGUubmFtZSB9fVxuICAgICAgPC9idXR0b24+XG4gICAgPC9uZy1jb250YWluZXI+XG5cbiAgPC9tYXQtbWVudT5cbjwvbWF0LXRvb2xiYXI+XG5cbjxzcGFuIFtuZ1N3aXRjaF09XCJzZWxlY3RlZFNlcnZpY2VcIj5cbiAgPHAgKm5nU3dpdGNoQ2FzZT1cIidodHRwX3NlcnZpY2UnXCI+XG4gICAgPG5nLWNvbnRhaW5lciAqbmdUZW1wbGF0ZU91dGxldD1cIkhUVFBfT1BUSU9OU1wiPjwvbmctY29udGFpbmVyPlxuICAgIDxhcHAtcmVxdWVzdC1tYW5hZ2VyLWRlbW8+PC9hcHAtcmVxdWVzdC1tYW5hZ2VyLWRlbW8+XG4gIDwvcD5cbiAgPHAgKm5nU3dpdGNoQ2FzZT1cIidodHRwX3N0YXRlX3NlcnZpY2UnXCI+XG4gICAgPG5nLWNvbnRhaW5lciAqbmdUZW1wbGF0ZU91dGxldD1cIkhUVFBfT1BUSU9OU1wiPjwvbmctY29udGFpbmVyPlxuICAgIDxhcHAtcmVxdWVzdC1tYW5hZ2VyLXN0YXRlLWRlbW8+PC9hcHAtcmVxdWVzdC1tYW5hZ2VyLXN0YXRlLWRlbW8+XG4gIDwvcD5cbiAgPHAgKm5nU3dpdGNoQ2FzZT1cIidkYXRhYmFzZV9zZXJ2aWNlJ1wiPlxuICAgIDwhLS0gPGFwcC1kYXRhYmFzZS1kYXRhLWRlbW8+PC9hcHAtZGF0YWJhc2UtZGF0YS1kZW1vPiAtLT5cbiAgPC9wPlxuICA8cCAqbmdTd2l0Y2hDYXNlPVwiJ2xvY2FsX3N0b3JhZ2Vfc2VydmljZSdcIj5cbiAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiTE9DQUxfT1BUSU9OU1wiPjwvbmctY29udGFpbmVyPlxuICAgIDxhcHAtbG9jYWwtc3RvcmFnZS1kZW1vPjwvYXBwLWxvY2FsLXN0b3JhZ2UtZGVtbz5cbiAgPC9wPlxuICA8cCAqbmdTd2l0Y2hEZWZhdWx0PlxuICAgIE90aGVyXG4gIDwvcD5cbjwvc3Bhbj5cblxuPG5nLXRlbXBsYXRlICNIVFRQX09QVElPTlM+XG4gIDxuZy1jb250YWluZXIgKm5nSWY9XCJpbmplY3Rpb25PcHRpb25zPy5odHRwUmVxdWVzdE9wdGlvbnNcIj5cbiAgICA8ZGl2IGNsYXNzPVwiYm94XCI+XG4gICAgICA8aDMgc3R5bGU9XCJmb250LXdlaWdodDogYm9sZDtcIj5JbmplY3Rpb24gVG9rZW4gRGV0ZWN0ZWQgLSBIVFRQIE9wdGlvbnM8L2gzPlxuICAgICAge3sgaW5qZWN0aW9uT3B0aW9ucz8uaHR0cFJlcXVlc3RPcHRpb25zfCBqc29uIH19XG4gICAgPC9kaXY+XG4gIDwvbmctY29udGFpbmVyPlxuPC9uZy10ZW1wbGF0ZT5cblxuPG5nLXRlbXBsYXRlICNMT0NBTF9PUFRJT05TPlxuICA8bmctY29udGFpbmVyIGNsYXNzPVwiYm94XCIgKm5nSWY9XCJpbmplY3Rpb25PcHRpb25zPy5Mb2NhbFN0b3JhZ2VPcHRpb25zXCI+XG4gICAgPGRpdiBjbGFzcz1cImJveFwiPlxuICAgICAgPGgzIHN0eWxlPVwiZm9udC13ZWlnaHQ6IGJvbGQ7XCI+SW5qZWN0aW9uIFRva2VuIERldGVjdGVkIC0gTG9jYWxTdG9yYWdlIE9wdGlvbnM8L2gzPlxuICAgICAge3sgaW5qZWN0aW9uT3B0aW9ucz8uTG9jYWxTdG9yYWdlT3B0aW9uc3wganNvbiB9fVxuICAgIDwvZGl2PlxuICA8L25nLWNvbnRhaW5lcj5cbjwvbmctdGVtcGxhdGU+XG5cblxuIl19