@smartbit4all/ng-client 2.2.1 → 3.0.0

package/src/lib/smart-form/api/README.md

@@ -0,0 +1,226 @@
+## @
+
+### Building
+
+To install the required dependencies and to build the typescript sources run:
+```
+npm install
+npm run build
+```
+
+### publishing
+
+First build the package then run ```npm publish dist``` (don't forget to specify the `dist` folder!)
+
+### consuming
+
+Navigate to the folder of your consuming project and run one of next commands.
+
+_published:_
+
+```
+npm install @ --save
+```
+
+_without publishing (not recommended):_
+
+```
+npm install PATH_TO_GENERATED_PACKAGE/dist.tgz --save
+```
+
+_It's important to take the tgz file, otherwise you'll get trouble with links on windows_
+
+_using `npm link`:_
+
+In PATH_TO_GENERATED_PACKAGE/dist:
+```
+npm link
+```
+
+In your project:
+```
+npm link 
+```
+
+__Note for Windows users:__ The Angular CLI has troubles to use linked npm packages.
+Please refer to this issue https://github.com/angular/angular-cli/issues/8284 for a solution / workaround.
+Published packages are not effected by this issue.
+
+
+#### General usage
+
+In your Angular project:
+
+
+```
+// without configuring providers
+import { ApiModule } from '';
+import { HttpClientModule } from '@angular/common/http';
+
+@NgModule({
+    imports: [
+        ApiModule,
+        // make sure to import the HttpClientModule in the AppModule only,
+        // see https://github.com/angular/angular/issues/20575
+        HttpClientModule
+    ],
+    declarations: [ AppComponent ],
+    providers: [],
+    bootstrap: [ AppComponent ]
+})
+export class AppModule {}
+```
+
+```
+// configuring providers
+import { ApiModule, Configuration, ConfigurationParameters } from '';
+
+export function apiConfigFactory (): Configuration {
+  const params: ConfigurationParameters = {
+    // set configuration parameters here.
+  }
+  return new Configuration(params);
+}
+
+@NgModule({
+    imports: [ ApiModule.forRoot(apiConfigFactory) ],
+    declarations: [ AppComponent ],
+    providers: [],
+    bootstrap: [ AppComponent ]
+})
+export class AppModule {}
+```
+
+```
+// configuring providers with an authentication service that manages your access tokens
+import { ApiModule, Configuration } from '';
+
+@NgModule({
+    imports: [ ApiModule ],
+    declarations: [ AppComponent ],
+    providers: [
+      {
+        provide: Configuration,
+        useFactory: (authService: AuthService) => new Configuration(
+          {
+            basePath: environment.apiUrl,
+            accessToken: authService.getAccessToken.bind(authService)
+          }
+        ),
+        deps: [AuthService],
+        multi: false
+      }
+    ],
+    bootstrap: [ AppComponent ]
+})
+export class AppModule {}
+```
+
+```
+import { DefaultApi } from '';
+
+export class AppComponent {
+    constructor(private apiGateway: DefaultApi) { }
+}
+```
+
+Note: The ApiModule is restricted to being instantiated once app wide.
+This is to ensure that all services are treated as singletons.
+
+#### Using multiple OpenAPI files / APIs / ApiModules
+In order to use multiple `ApiModules` generated from different OpenAPI files,
+you can create an alias name when importing the modules
+in order to avoid naming conflicts:
+```
+import { ApiModule } from 'my-api-path';
+import { ApiModule as OtherApiModule } from 'my-other-api-path';
+import { HttpClientModule } from '@angular/common/http';
+
+@NgModule({
+  imports: [
+    ApiModule,
+    OtherApiModule,
+    // make sure to import the HttpClientModule in the AppModule only,
+    // see https://github.com/angular/angular/issues/20575
+    HttpClientModule
+  ]
+})
+export class AppModule {
+
+}
+```
+
+
+### Set service base path
+If different than the generated base path, during app bootstrap, you can provide the base path to your service.
+
+```
+import { BASE_PATH } from '';
+
+bootstrap(AppComponent, [
+    { provide: BASE_PATH, useValue: 'https://your-web-service.com' },
+]);
+```
+or
+
+```
+import { BASE_PATH } from '';
+
+@NgModule({
+    imports: [],
+    declarations: [ AppComponent ],
+    providers: [ provide: BASE_PATH, useValue: 'https://your-web-service.com' ],
+    bootstrap: [ AppComponent ]
+})
+export class AppModule {}
+```
+
+
+#### Using @angular/cli
+First extend your `src/environments/*.ts` files by adding the corresponding base path:
+
+```
+export const environment = {
+  production: false,
+  API_BASE_PATH: 'http://127.0.0.1:8080'
+};
+```
+
+In the src/app/app.module.ts:
+```
+import { BASE_PATH } from '';
+import { environment } from '../environments/environment';
+
+@NgModule({
+  declarations: [
+    AppComponent
+  ],
+  imports: [ ],
+  providers: [{ provide: BASE_PATH, useValue: environment.API_BASE_PATH }],
+  bootstrap: [ AppComponent ]
+})
+export class AppModule { }
+```
+
+### Customizing path parameter encoding
+
+Without further customization, only [path-parameters][parameter-locations-url] of [style][style-values-url] 'simple'
+and Dates for format 'date-time' are encoded correctly.
+
+Other styles (e.g. "matrix") are not that easy to encode
+and thus are best delegated to other libraries (e.g.: [@honoluluhenk/http-param-expander]).
+
+To implement your own parameter encoding (or call another library),
+pass an arrow-function or method-reference to the `encodeParam` property of the Configuration-object
+(see [General Usage](#general-usage) above).
+
+Example value for use in your Configuration-Provider:
+```typescript
+new Configuration({
+    encodeParam: (param: Param) => myFancyParamEncoder(param),
+})
+```
+
+[parameter-locations-url]: https://github.com/OAI/OpenAPI-Specification/blob/main/versions/3.1.0.md#parameter-locations
+[style-values-url]: https://github.com/OAI/OpenAPI-Specification/blob/main/versions/3.1.0.md#style-values
+[@honoluluhenk/http-param-expander]: https://www.npmjs.com/package/@honoluluhenk/http-param-expander

package/src/lib/smart-grid/README.md

@@ -0,0 +1,24 @@
+# SmartGrid
+
+This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 13.2.0.
+
+## Code scaffolding
+
+Run `ng generate component component-name --project smart-grid` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project smart-grid`.
+> Note: Don't forget to add `--project smart-grid` or else it will be added to the default project in your `angular.json` file. 
+
+## Build
+
+Run `ng build smart-grid` to build the project. The build artifacts will be stored in the `dist/` directory.
+
+## Publishing
+
+After building your library with `ng build smart-grid`, go to the dist folder `cd dist/smart-grid` and run `npm publish`.
+
+## Running unit tests
+
+Run `ng test smart-grid` to execute the unit tests via [Karma](https://karma-runner.github.io).
+
+## Further help
+
+To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.

package/src/lib/smart-grid/api/grid-api/README.md

@@ -0,0 +1,203 @@
+## @
+
+### Building
+
+To install the required dependencies and to build the typescript sources run:
+```
+npm install
+npm run build
+```
+
+### publishing
+
+First build the package then run ```npm publish dist``` (don't forget to specify the `dist` folder!)
+
+### consuming
+
+Navigate to the folder of your consuming project and run one of next commands.
+
+_published:_
+
+```
+npm install @ --save
+```
+
+_without publishing (not recommended):_
+
+```
+npm install PATH_TO_GENERATED_PACKAGE/dist.tgz --save
+```
+
+_It's important to take the tgz file, otherwise you'll get trouble with links on windows_
+
+_using `npm link`:_
+
+In PATH_TO_GENERATED_PACKAGE/dist:
+```
+npm link
+```
+
+In your project:
+```
+npm link 
+```
+
+__Note for Windows users:__ The Angular CLI has troubles to use linked npm packages.
+Please refer to this issue https://github.com/angular/angular-cli/issues/8284 for a solution / workaround.
+Published packages are not effected by this issue.
+
+
+#### General usage
+
+In your Angular project:
+
+
+```
+// without configuring providers
+import { ApiModule } from '';
+import { HttpClientModule } from '@angular/common/http';
+
+@NgModule({
+    imports: [
+        ApiModule,
+        // make sure to import the HttpClientModule in the AppModule only,
+        // see https://github.com/angular/angular/issues/20575
+        HttpClientModule
+    ],
+    declarations: [ AppComponent ],
+    providers: [],
+    bootstrap: [ AppComponent ]
+})
+export class AppModule {}
+```
+
+```
+// configuring providers
+import { ApiModule, Configuration, ConfigurationParameters } from '';
+
+export function apiConfigFactory (): Configuration {
+  const params: ConfigurationParameters = {
+    // set configuration parameters here.
+  }
+  return new Configuration(params);
+}
+
+@NgModule({
+    imports: [ ApiModule.forRoot(apiConfigFactory) ],
+    declarations: [ AppComponent ],
+    providers: [],
+    bootstrap: [ AppComponent ]
+})
+export class AppModule {}
+```
+
+```
+// configuring providers with an authentication service that manages your access tokens
+import { ApiModule, Configuration } from '';
+
+@NgModule({
+    imports: [ ApiModule ],
+    declarations: [ AppComponent ],
+    providers: [
+      {
+        provide: Configuration,
+        useFactory: (authService: AuthService) => new Configuration(
+          {
+            basePath: environment.apiUrl,
+            accessToken: authService.getAccessToken.bind(authService)
+          }
+        ),
+        deps: [AuthService],
+        multi: false
+      }
+    ],
+    bootstrap: [ AppComponent ]
+})
+export class AppModule {}
+```
+
+```
+import { DefaultApi } from '';
+
+export class AppComponent {
+    constructor(private apiGateway: DefaultApi) { }
+}
+```
+
+Note: The ApiModule is restricted to being instantiated once app wide.
+This is to ensure that all services are treated as singletons.
+
+#### Using multiple OpenAPI files / APIs / ApiModules
+In order to use multiple `ApiModules` generated from different OpenAPI files,
+you can create an alias name when importing the modules
+in order to avoid naming conflicts:
+```
+import { ApiModule } from 'my-api-path';
+import { ApiModule as OtherApiModule } from 'my-other-api-path';
+import { HttpClientModule } from '@angular/common/http';
+
+@NgModule({
+  imports: [
+    ApiModule,
+    OtherApiModule,
+    // make sure to import the HttpClientModule in the AppModule only,
+    // see https://github.com/angular/angular/issues/20575
+    HttpClientModule
+  ]
+})
+export class AppModule {
+
+}
+```
+
+
+### Set service base path
+If different than the generated base path, during app bootstrap, you can provide the base path to your service.
+
+```
+import { BASE_PATH } from '';
+
+bootstrap(AppComponent, [
+    { provide: BASE_PATH, useValue: 'https://your-web-service.com' },
+]);
+```
+or
+
+```
+import { BASE_PATH } from '';
+
+@NgModule({
+    imports: [],
+    declarations: [ AppComponent ],
+    providers: [ provide: BASE_PATH, useValue: 'https://your-web-service.com' ],
+    bootstrap: [ AppComponent ]
+})
+export class AppModule {}
+```
+
+
+#### Using @angular/cli
+First extend your `src/environments/*.ts` files by adding the corresponding base path:
+
+```
+export const environment = {
+  production: false,
+  API_BASE_PATH: 'http://127.0.0.1:8080'
+};
+```
+
+In the src/app/app.module.ts:
+```
+import { BASE_PATH } from '';
+import { environment } from '../environments/environment';
+
+@NgModule({
+  declarations: [
+    AppComponent
+  ],
+  imports: [ ],
+  providers: [{ provide: BASE_PATH, useValue: environment.API_BASE_PATH }],
+  bootstrap: [ AppComponent ]
+})
+export class AppModule { }
+```

package/src/lib/smart-icon/README.md

@@ -0,0 +1,116 @@
+# Smart Icon
+
+## How to use
+
+### Installation
+
+This package use **MatIcon** from Angular Material. To use this package please **install Angular Material** first.
+
+Go to your project, open the terminal and use the following command:
+
+    npm i @smartbit4all/icon
+
+Then import it in the AppModule:
+
+`app.module.ts:`
+
+    import { SmartIconModule, SmartIconService } from '@smartbit4all/icon';
+    ...
+    @NgModule({
+        declarations: [...]
+        imports: [
+            ...
+            SmartIconModule,
+        ],
+        providers: [
+            ...
+    	    SmartIconService,
+        ]
+        ...
+    })
+
+### Prerequisites
+
+In order to use custom icons with this package you have to do the following steps:
+
+Place the svg icons into a subfolder of the /assets
+
+`assets/customIcons/`
+
+-   customAddIcon.svg
+-   customUserIcon.svg
+
+Change the default colours in the svg to 'color'.
+
+`assets/customIcons/customAddIcon.svg`
+
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <path ... fill="color" stroke="color" />
+    </svg>
+
+Create an enum which contains all the icons and their paths.
+
+`src/app/icons/customIcon.ts`
+
+    export type CustomIcon = 'Add' | 'User';
+
+    export const CustomIcon = {
+        Add: 'customAddIcon' as CustomIcon,
+        User: 'customUserIcon' as CustomIcon
+    }
+
+Set up the icon sets in the environment.ts. The **property name of the object** (in this scenario _customIcons_) has to **match** with the name of the **folder that contains the svg files**. The value has to be the enum which contains the name of the svg files.
+
+`src/environments.ts`
+
+    import { CustomIcon } from 'src/app/icons/';
+
+    export const environment = {
+        ...
+        customIconSets: [{ customIcons: CustomIcon }],
+    };
+
+Provide the icon sets for the SmartIconService.
+
+`src/app/app.component.ts`
+
+    export class AppComponent {
+
+        constructor(private smartIconService: SmartIconService) {
+            this.smartIconService.iconSets(environment.customIconSets);
+        }
+
+    }
+
+### Usage
+
+`example.component.html`
+
+    <smart-icon
+        [icon]="'Add'"
+        [color]="'primary'"
+    ></smart-icon>
+
+Set the material styles for these:
+
+`custom-theme.scss`
+
+    .mat-icon.mat-primary {
+        stroke: blue;
+        color: blue;
+    }
+    .mat-icon.mat-accent {
+        stroke: red;
+        color: red;
+    }
+    ...
+
+---
+
+## Version logs
+
+## @smartbit4all/icon v1.0.0
+
+**Type: Feature**
+
+The `@smartbit4all/icon` has been published.

package/src/lib/smart-navbar/README.md

@@ -0,0 +1,119 @@
+# Smart Navbar
+
+## References
+
+These packages must be updated in case of a new version:
+
+-   There are no references yet
+
+---
+
+## How to use
+
+### Installation
+
+Go to your project, open the terminal and use the following command:
+
+    npm i @smartbit4all/navbar
+
+Then import it in the AppModule:
+
+`app.module.ts:`
+
+    import { SmartNavbarModule } from '@smartbit4all/navbar';
+    ...
+    @NgModule({
+        declarations: [...]
+        imports: [
+            ...
+            SmartNavbarModule,
+        ],
+        ...
+    })
+
+### Usage
+
+`example.component.html:`
+
+    <smart-navbar [smartNavbar]="exampleNavbar"></smart-navbar>
+
+`example.component.css:`
+
+    .navbar {
+        height: 250px;
+    }
+
+    ::ng-deep .navbarHeight {
+        background-color: transparent !important;
+    }
+
+`example.component.ts:`
+
+    export class ExampleComponent {
+        exampleNavbar: SmartNavbar;
+        user: ExampleUser;
+
+        constructor() {
+            this.exampleNavbar = {
+                icon: 'assets/icon.png',
+                searchBar: {
+                    placeholder: 'Search',
+                    quickFilterLabel: 'Quick filters',
+                    quickFilters: ['Quick filter 1'],
+                    searchCallback: this.onSearch.bind(this)
+                },
+                iconCallback: this.onHome.bind(this),
+                filterButtonLabel: 'Filters',
+                filterButtonCallback: this.onFilter.bind(this),
+                userSettings: {
+                    label: user.name,
+                    settings: [
+                        {
+                            label: 'Logout',
+                            icon: 'logout',
+                            position: SmartUserSettinsIconPosition.POST,
+                            callback: logout.bind(this)
+                        }
+                    ]
+                }
+            };
+        }
+
+        logout(): void {
+            ...
+        }
+    }
+
+You can put your custom component before input field. In this way the iconCallback wont be called.:
+
+    <smart-navbar [smartNavbar]="exampleNavbar">
+        <div titleComponent> Custom title </div>
+    </smart-navbar>
+
+You can put your custom component into the filter button:
+
+    <smart-navbar [smartNavbar]="exampleNavbar">
+        <div filterComponent> Custom title </div>
+    </smart-navbar>
+
+---
+
+## Version logs
+
+## @smartbit4all/form v1.0.5
+
+**Type: Feature**
+
+From now on the user drop-down menu can be used. The menu items can be parameterized with an icon, its position (FRONT or POST), label and a callback.
+
+## @smartbit4all/form v1.0.1
+
+**Type: Update**
+
+The package has been published.
+
+## @smartbit4all/navbar v0.0.3
+
+**Type: Feature**
+
+The basic smart navbar with its features.