@mediusinc/mng-commons 0.9.2 → 0.9.6

package/lib/components/tableview/table/table.component.d.ts

@@ -48,7 +48,8 @@ export declare class MngTableComponent<T, S> implements OnInit, OnChanges, After
     captionTemplate?: TemplateRef<any>;
     columnActionTemplate?: TemplateRef<any>;
     useDataProvider: boolean;
-    useQueryParamsInitialized: boolean;
+    private useQueryParamsInitializedSubejct;
+    useQueryParamsInitialized$: Observable<boolean>;
     queryResult$?: Observable<MediusQueryResult<T>>;
     loading$?: Observable<boolean>;
     dataProviderInfiniteScrollItems: Array<T>;
@@ -58,7 +59,7 @@ export declare class MngTableComponent<T, S> implements OnInit, OnChanges, After
     offset: number;
     multiSortMeta: SortMeta[] | null;
     filterMetadata: {
-        [s: string]: FilterMetadata | FilterMetadata[];
+        [s: string]: FilterMetadata;
     };
     infiniteScroll: boolean;
     scrollHeight: 'flex' | null;
@@ -99,7 +100,9 @@ export declare class MngTableComponent<T, S> implements OnInit, OnChanges, After
     private loadTableWithDataProvider;
     private loadTableFromRouteUpdate;
     private updatePrimeSortAndFilter;
-    private getDefaultSortMeta;
+    private createFilterMeta;
+    private createSortMeta;
+    private initializeDataLoadingTriggers;
     static ɵfac: i0.ɵɵFactoryDeclaration<MngTableComponent<any, any>, [null, null, null, null, null, { optional: true; }]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<MngTableComponent<any, any>, "mng-table", never, { "descriptor": "descriptor"; "items": "items"; "queryResult": "queryResult"; "loading": "loading"; "dataProvider": "dataProvider"; "useQueryParams": "useQueryParams"; "selectionMode": "selectionMode"; "selectionEnabled": "selectionEnabled"; "actions": "actions"; "isColumnClickable": "isColumnClickable"; "viewContainerInit": "viewContainer"; "captionComponent": "captionComponent"; "columnActionComponent": "columnActionComponent"; "columnActionMinWidth": "columnActionMinWidth"; }, { "loadEventEmitter": "tableLoad"; "cellClickEventEmitter": "cellClick"; "selectionChangeEventEmitter": "selectionChange"; "captionCmpInstEventEmitter": "captionComponentInstance"; "columnActionCmpInstEventEmitter": "columnActionComponentInstance"; }, ["templates"], never>;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mediusinc/mng-commons",
-  "version": "0.9.2",
+  "version": "0.9.6",
   "peerDependencies": {
     "@angular/common": "^13.2.0",
     "@angular/core": "^13.2.0",
@@ -34,6 +34,5 @@
       "default": "./fesm2020/mediusinc-mng-commons.mjs"
     }
   },
-  "sideEffects": false,
-  "readme": "# Angular Commons\n\nCommons knjižnica za izgradnjo uporabniškega vmesnika na ogrodju Angular.\n\n## Predhodne zahteve\n\n- Node.js (LTS v14) in npm\n- pnpm package manager (https://pnpm.io/), ki optimizira delovanje privzetega npm.\n- Zahtevane skupne odvisnosti (peer dependencies)\n  - Angular (moduli `@angular/core`, `@angular/common`, `@angular/forms`, `@angular/router`) verzije `^13.1.0`\n  - Ngx Formly (modul `@ngx-formly/core`) verzije `^6.0.0-next.6`\n  - Ngx Translate (module `@ngx-translate/core`) verzije `^14.0.0`\n  - PrimeNG (modul `primeng`) verzije `^13.0.0`\n\n## Namestitev\n\n```bash\npnpm i @mediusinc/mng-commons\n```\n\n## Lokalizacija (i18n)\n\nModul `ngx-translate` se konfigurira na končnem projektu in je na končnem projektu potrebno določiti način za load prevodov.\nPrimer konfiguracije za multi-module HTTP loader:\n\n- HTTP loader factory:\n```ts\nexport function i18nHttpLoaderFactory(http: HttpClient) {\n    return new MultiTranslateHttpLoader(http, [\n        {prefix: './assets/i18n/mng/', suffix: '.json'},\n        {prefix: './assets/i18n/', suffix: '.json'}\n    ]);\n}\n```\n\n- Konfiguracija v `AppModule`:\n```ts\nTranslateModule.forRoot({\n    loader: {\n        provide: TranslateLoader,\n        useFactory: i18nHttpLoaderFactory,\n        deps: [HttpClient]\n    }\n})\n```\n\n- Definicijo jezikov podamo preko konfiguracije `MngCommonsModule`:\n```ts\nMngCommonsModule.forRoot({\n  languages: ['en', 'sl']\n})\n```\n\nKnjižnica pakira tudi osnovne prevode, ki so del modula. Za vključitev na zgornji način je potrebno dodati naslednjo konfiguracijo v `angular.json` med `assets` nastavitve:\n```json\n{\n  \"glob\": \"**/*\",\n  \"input\": \"./node_modules/@mediusinc/mng-commons/assets/i18n\",\n  \"output\": \"/assets/i18n/mng\"\n}\n```\n\n## Tema\n\nOpcijsko se vključi tudi tema MNG Commons, ki ima dve svetlo in temno varianto.\nZa vključitev se v stile na končnem projektu doda import v `style.scss`:\n\n```scss\n# Za svetlo temo:\n@import '~../node_modules/@mediusinc/mng-commons/scss/mng-commons-light';\n\n# Za temno temo:\n@import '~../node_modules/@mediusinc/mng-commons/scss/mng-commons-dark';\n```\n\n~~~~\nPrimarno se uporablja svetla tema!\n~~~~\n\nPri uporabi temne teme je potrebno dodatno nastaviti tudi `colorMode` v modulu:\n```ts\nMngCommonsModule.forRoot({\n  app: {\n    colorScheme: 'dark'\n  }\n});\n```\n\nTema za svoje delovanje uporablja primeNG stile (za posamezne komponente) in PrimeFlex kot pomožno CSS knjižnico.\nDodatno se lahko na končnem projektu lahko uporabi še ikone PrimeIcons.\nGlede ne preference se opcijsko dodajo naslednji importi (**pred importom MNG commons teme!**):\n\n```scss\n@import '~../node_modules/primeng/resources/primeng.min.css';\n@import '~../node_modules/primeflex/primeflex.scss';\n@import '~../node_modules/primeicons/primeicons.css';\n```\n\nPri prvem importu ni potrebno namestiti dodatnih odvisnosti (je že vključeno z primeng), za drugi dve pa je potrebno namestiti:\n```bash\npnpm i primeflex\npnpm i primeicons\n```\n\nDodajanje MNG Commons slik v `assets` na končnem projektu se uredi z konfiguracijo v `assets` segmentu znotraj `angular.json`, kjer se doda:\n\n```json\n{\n  \"glob\": \"**/*\",\n  \"input\": \"./node_modules/@mediusinc/mng-commons/assets/images\",\n  \"output\": \"/assets/images/mng\"\n}\n```\n\n## Custom Formly validatorji\n\nValidatorje lahko dodajamo samostojno na polja, ali pa na skupine polj.\n\nDodajanje se v obeh primerih razlikuje.\n- validator na polje lahko dodamo preko polja, kjer mu podamo ime, funkcijo in sporočilo za validacijo.\n```typescript\nserviceChannelsTableviewDescriptor.addField('cost.code')\n            .withValidator('codeValidator', control => control.value, (err, field) => 'error message');\n```\n- validator na skupine lahko dodamo preko\n```typescript\nserviceChannelsTableviewDescriptor.createFieldGroup('Service cost', 'ServiceChannelDto.fieldGroups.serviceCost')\n            .withValidator('serviceCostAllOrNoneFieldsRequired', this.serviceCostAllOrNoneFieldsRequired);\n```\n\nKo dodajamo na grupe, moramo registrirati tudi globalno sporočilo za validacijo v `formly-translate.extension.ts`, kjer mora biti ime sporočila za validacijo enako kot napaka, ki jo nastavljamo v samem validatorju.\n```typescript\nexport function formlyConfigProvider(translate: TranslateService): ConfigOption {\n    return {\n        validationMessages: [\n            { name: 'required', message: getRequiredValidationMessage(translate)},\n            ...\n                // naše sporočilo, ki se imenuje serviceCostAllOrNoneFieldsRequired\n            { name: 'serviceCostAllOrNoneFieldsRequired', message: serviceCostAllOrNoneFieldsRequiredValidatorMessage(translate)}\n        ],\n        extras: { lazyRender: true },\n        wrappers: formlyWrappersConfig,\n        types: formlyTypesConfig\n    };\n}\n\nexport function serviceCostAllOrNoneFieldsRequired(control: AbstractControl): boolean {\n    const { code, value, description } = control.value.cost;\n    const costControl = control.get('cost');\n\n    // tu vmes je še druga koda\n    \n    // nastavimo enako napako, kot je ime sporočila\n    costControl.get('code').setErrors({serviceCostAllOrNoneFieldsRequired: true});\n    costControl.get('value').setErrors({serviceCostAllOrNoneFieldsRequired: true});\n    costControl.get('description').setErrors({serviceCostAllOrNoneFieldsRequired: true});\n\n    return false;\n}\n```\n"
+  "sideEffects": false
 }

package/scss/mng-overrides/_mixins.scss

@@ -1,3 +1,5 @@
+@import 'variables';
+
 @mixin scaledHeight($val, $scale) {
     height: $val * $scale;
 }

package/scss/theme/default/_mng-variables-theme-dark.scss

@@ -1,4 +1,4 @@
-@import 'mng-variables';
+@import '../../mng-overrides/variables';
 
 $primaryColor: #0f8bfd;
 $primaryLightColor: scale-color($primaryColor, $lightness: 60%) !default;

package/scss/theme/default/_mng-variables-theme-light.scss

@@ -1,4 +1,4 @@
-@import 'mng-variables';
+@import '../../mng-overrides/variables';
 
 $primaryColor: #397289 !default;
 $primaryLightColor: scale-color($primaryColor, $lightness: 60%) !default;

package/version-info.json

@@ -1,10 +1,10 @@
 {
     "name": "@mediusinc/mng-commons",
-    "version": "0.9.2",
-    "tag": "v0.9.2",
+    "version": "0.9.6",
+    "tag": "v0.9.6",
     "distance": 0,
-    "hash": "gc8dbf45",
+    "hash": "68fac8b0",
     "dirty": false,
-    "semver": "0.9.2",
-    "raw": "v0.9.2-gc8dbf45"
+    "semver": "0.9.6",
+    "raw": "v0.9.6-68fac8b0"
 }