iss-ctrl 0.0.3 → 0.0.5

package/fesm2022/iss-ctrl-load-event.service-D_O5gUmg.mjs

@@ -0,0 +1,62 @@
+import { HttpClient } from '@angular/common/http';
+import * as i0 from '@angular/core';
+import { InjectionToken, inject, Injectable } from '@angular/core';
+import { map, EMPTY } from 'rxjs';
+import { n as PLACEHOLDER_REGEX } from './iss-ctrl-iss-ctrl-BhZGHw0A.mjs';
+import { ReplaceApiKeysService } from './iss-ctrl-replace-api-keys.service-DNns4c2U.mjs';
+
+const API_RESPONSE_MAPPER = new InjectionToken("Map backend response to required response interface.");
+
+function isValidEndpoint(api) {
+    if (api.includes("undefined") || api.includes("null")) {
+        return false;
+    }
+    return !api.match(PLACEHOLDER_REGEX)?.length && !["undefined", "null"].includes(api);
+}
+
+class IssHttp {
+    #http = inject(HttpClient);
+    #apiResponseMapper = inject(API_RESPONSE_MAPPER);
+    get(url) {
+        if (isValidEndpoint(url)) {
+            return this.#http.get(url).pipe(map((res) => this.#apiResponseMapper(res)));
+        }
+        return EMPTY;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: IssHttp, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: IssHttp, providedIn: "root" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: IssHttp, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: "root" }]
+        }] });
+
+const HOST = new InjectionToken("Backend Host to call");
+
+class LoadEventService {
+    #replaceApiKeysService = inject(ReplaceApiKeysService);
+    #host = inject(HOST);
+    getApi(args) {
+        let api;
+        if (args.action.config.fn) {
+            api = args.action.config.fn.execute(args);
+        }
+        else {
+            api = this.#replaceApiKeysService.execute(args);
+        }
+        return `${this.#host}${api}`;
+    }
+    fetchErrorHandler(args, err) {
+        console.error(err);
+        args.field.loading.set(false);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LoadEventService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LoadEventService, providedIn: "root" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LoadEventService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: "root" }]
+        }] });
+
+export { HOST as H, IssHttp as I, LoadEventService as L };
+//# sourceMappingURL=iss-ctrl-load-event.service-D_O5gUmg.mjs.map

package/fesm2022/iss-ctrl-load-event.service-D_O5gUmg.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"iss-ctrl-load-event.service-D_O5gUmg.mjs","sources":["../../../projects/iss/src/shared/tokens/api-response-mapper.token.ts","../../../projects/iss/src/shared/utilities/is-valid-api.util.ts","../../../projects/iss/src/shared/utilities/http.util.service.ts","../../../projects/iss/src/shared/tokens/host.token.ts","../../../projects/iss/src/events/load/load-event.service.ts"],"sourcesContent":["import {InjectionToken} from \"@angular/core\";\r\nimport {Dto} from \"../interfaces/dto.interface\";\r\n\r\nexport const API_RESPONSE_MAPPER: InjectionToken<(res: any) => Dto> = new InjectionToken(\"Map backend response to required response interface.\");\r\n","import {PLACEHOLDER_REGEX} from \"../constants/regex.const\";\r\n\r\nexport function isValidEndpoint(api: string): boolean {\r\n  if (api.includes(\"undefined\") || api.includes(\"null\")) {\r\n    return false;\r\n  }\r\n  return !api.match(PLACEHOLDER_REGEX)?.length && ![\"undefined\", \"null\"].includes(api);\r\n}\r\n","import {HttpClient} from \"@angular/common/http\";\r\nimport {inject, Injectable} from \"@angular/core\";\r\nimport {EMPTY, map, Observable} from \"rxjs\";\r\nimport {Dto} from \"../interfaces/dto.interface\";\r\nimport {API_RESPONSE_MAPPER} from \"../tokens/api-response-mapper.token\";\r\nimport {isValidEndpoint} from \"./is-valid-api.util\";\r\n\r\n@Injectable({providedIn: \"root\"})\r\nexport class IssHttp {\r\n  #http: HttpClient = inject(HttpClient);\r\n  #apiResponseMapper = inject(API_RESPONSE_MAPPER);\r\n\r\n  get<T>(url: string): Observable<Dto> {\r\n    if (isValidEndpoint(url)) {\r\n      return this.#http.get<T>(url).pipe(map((res: any): Dto => this.#apiResponseMapper(res)));\r\n    }\r\n    return EMPTY;\r\n  }\r\n}\r\n","import {InjectionToken} from \"@angular/core\";\r\n\r\nexport const HOST: InjectionToken<string> = new InjectionToken(\"Backend Host to call\");\r\n","import {inject, Injectable} from \"@angular/core\";\r\nimport {FieldEventArgument} from \"../../shared/interfaces/field.interface\";\r\nimport {HOST} from \"../../shared/tokens/host.token\";\r\nimport {ReplaceApiKeysService} from \"./replace-api-keys.service\";\r\n\r\n@Injectable({providedIn: \"root\"})\r\nexport class LoadEventService {\r\n  #replaceApiKeysService = inject(ReplaceApiKeysService);\r\n  #host: string = inject(HOST);\r\n\r\n  getApi(args: FieldEventArgument) {\r\n    let api;\r\n    if (args.action.config.fn) {\r\n      api = args.action.config.fn.execute(args);\r\n    } else {\r\n      api = this.#replaceApiKeysService.execute(args);\r\n    }\r\n\r\n    return `${this.#host}${api}`;\r\n  }\r\n\r\n  fetchErrorHandler(args: FieldEventArgument, err: any) {\r\n    console.error(err);\r\n    args.field.loading.set(false);\r\n  }\r\n}\r\n"],"names":[],"mappings":";;;;;;;AAGO,MAAM,mBAAmB,GAAsC,IAAI,cAAc,CAAC,sDAAsD,CAAC;;ACD1I,SAAU,eAAe,CAAC,GAAW,EAAA;AACzC,IAAA,IAAI,GAAG,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,GAAG,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;AACrD,QAAA,OAAO,KAAK;IACd;IACA,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC;AACtF;;MCCa,OAAO,CAAA;AAClB,IAAA,KAAK,GAAe,MAAM,CAAC,UAAU,CAAC;AACtC,IAAA,kBAAkB,GAAG,MAAM,CAAC,mBAAmB,CAAC;AAEhD,IAAA,GAAG,CAAI,GAAW,EAAA;AAChB,QAAA,IAAI,eAAe,CAAC,GAAG,CAAC,EAAE;YACxB,OAAO,IAAI,CAAC,KAAK,CAAC,GAAG,CAAI,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAQ,KAAU,IAAI,CAAC,kBAAkB,CAAC,GAAG,CAAC,CAAC,CAAC;QAC1F;AACA,QAAA,OAAO,KAAK;IACd;uGATW,OAAO,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;AAAP,IAAA,OAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,OAAO,cADK,MAAM,EAAA,CAAA;;2FAClB,OAAO,EAAA,UAAA,EAAA,CAAA;kBADnB,UAAU;mBAAC,EAAC,UAAU,EAAE,MAAM,EAAC;;;MCLnB,IAAI,GAA2B,IAAI,cAAc,CAAC,sBAAsB;;MCIxE,gBAAgB,CAAA;AAC3B,IAAA,sBAAsB,GAAG,MAAM,CAAC,qBAAqB,CAAC;AACtD,IAAA,KAAK,GAAW,MAAM,CAAC,IAAI,CAAC;AAE5B,IAAA,MAAM,CAAC,IAAwB,EAAA;AAC7B,QAAA,IAAI,GAAG;QACP,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE;AACzB,YAAA,GAAG,GAAG,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC;QAC3C;aAAO;YACL,GAAG,GAAG,IAAI,CAAC,sBAAsB,CAAC,OAAO,CAAC,IAAI,CAAC;QACjD;AAEA,QAAA,OAAO,GAAG,IAAI,CAAC,KAAK,CAAA,EAAG,GAAG,EAAE;IAC9B;IAEA,iBAAiB,CAAC,IAAwB,EAAE,GAAQ,EAAA;AAClD,QAAA,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC;QAClB,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC;IAC/B;uGAlBW,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;AAAhB,IAAA,OAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,gBAAgB,cADJ,MAAM,EAAA,CAAA;;2FAClB,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAD5B,UAAU;mBAAC,EAAC,UAAU,EAAE,MAAM,EAAC;;;;;"}

package/fesm2022/iss-ctrl-load-options-event.service-CylOcoz4.mjs

@@ -0,0 +1,51 @@
+import * as i0 from '@angular/core';
+import { inject, Injectable } from '@angular/core';
+import { L as LoadEventService, I as IssHttp, H as HOST } from './iss-ctrl-load-event.service-D_O5gUmg.mjs';
+import { m as getPropertyByPath } from './iss-ctrl-iss-ctrl-BhZGHw0A.mjs';
+
+class LoadOptionsEventService {
+    loadEvent = inject(LoadEventService);
+    #http = inject(IssHttp);
+    #host = inject(HOST);
+    fire(args) {
+        console.log(`${args.field.name} listens to ${args.action.trackedFieldName} =>` + "%c Load Event Fired", "color: green");
+        const api = this.loadEvent.getApi(args);
+        args.field.loading.set(true);
+        this.#http.get(api).subscribe({
+            next: (response) => {
+                args.field.response = response;
+                args.field.apiResponse.next(response.data);
+                if (args.action.config.afterFetchFn) {
+                    args.action.config.afterFetchFn?.execute(args);
+                }
+                else {
+                    args.field.options.set(args.field.response.data);
+                    if (args.action.config.setValueFromApiResponse) {
+                        args.control.setValue(getPropertyByPath(args.field.response, args.action.config.setValueFromApiResponse));
+                    }
+                    if (args.action.config.disableAfterFetching) {
+                        args.control.disable();
+                    }
+                }
+                args.field.loading.set(false);
+            },
+            error: (err) => {
+                // todo handle errors
+                this.loadEvent.fetchErrorHandler(args, err);
+            },
+        });
+        args.action.triggered = true;
+    }
+    revert(args) {
+        console.log(`${args.field.name} listens to ${args.action.trackedFieldName} =>` + "%c Load Event Reverted", "color: red");
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LoadOptionsEventService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LoadOptionsEventService, providedIn: "root" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LoadOptionsEventService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: "root" }]
+        }] });
+
+export { LoadOptionsEventService };
+//# sourceMappingURL=iss-ctrl-load-options-event.service-CylOcoz4.mjs.map

package/fesm2022/iss-ctrl-load-options-event.service-CylOcoz4.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"iss-ctrl-load-options-event.service-CylOcoz4.mjs","sources":["../../../projects/iss/src/events/load/load-options-event.service.ts"],"sourcesContent":["import {inject, Injectable} from \"@angular/core\";\r\nimport {Dto} from \"../../shared/interfaces/dto.interface\";\r\nimport {FieldEvent, FieldEventArgument} from \"../../shared/interfaces/field.interface\";\r\nimport {HOST} from \"../../shared/tokens/host.token\";\r\nimport {getPropertyByPath} from \"../../shared/utilities/get-property-by-path.util\";\r\nimport {IssHttp} from \"../../shared/utilities/http.util.service\";\r\nimport {LoadEventService} from \"./load-event.service\";\r\n\r\n@Injectable({providedIn: \"root\"})\r\nexport class LoadOptionsEventService implements FieldEvent {\r\n  loadEvent = inject(LoadEventService);\r\n  #http: IssHttp = inject(IssHttp);\r\n  #host: string = inject(HOST);\r\n\r\n  fire(args: FieldEventArgument) {\r\n    console.log(`${args.field.name} listens to ${args.action.trackedFieldName} =>` + \"%c Load Event Fired\", \"color: green\");\r\n    const api = this.loadEvent.getApi(args);\r\n\r\n    args.field.loading.set(true);\r\n    this.#http.get(api).subscribe({\r\n      next: (response: Dto) => {\r\n        args.field.response = response;\r\n        args.field.apiResponse.next(response.data);\r\n\r\n        if (args.action.config.afterFetchFn) {\r\n          args.action.config.afterFetchFn?.execute(args);\r\n        } else {\r\n          args.field.options.set(args.field.response.data);\r\n\r\n          if (args.action.config.setValueFromApiResponse) {\r\n            args.control.setValue(getPropertyByPath(args.field.response, args.action.config.setValueFromApiResponse));\r\n          }\r\n\r\n          if (args.action.config.disableAfterFetching) {\r\n            args.control.disable();\r\n          }\r\n        }\r\n        args.field.loading.set(false);\r\n      },\r\n      error: (err) => {\r\n        // todo handle errors\r\n        this.loadEvent.fetchErrorHandler(args, err);\r\n      },\r\n    });\r\n    args.action.triggered = true;\r\n  }\r\n\r\n  revert(args: FieldEventArgument) {\r\n    console.log(`${args.field.name} listens to ${args.action.trackedFieldName} =>` + \"%c Load Event Reverted\", \"color: red\");\r\n  }\r\n}\r\n"],"names":[],"mappings":";;;;;MASa,uBAAuB,CAAA;AAClC,IAAA,SAAS,GAAG,MAAM,CAAC,gBAAgB,CAAC;AACpC,IAAA,KAAK,GAAY,MAAM,CAAC,OAAO,CAAC;AAChC,IAAA,KAAK,GAAW,MAAM,CAAC,IAAI,CAAC;AAE5B,IAAA,IAAI,CAAC,IAAwB,EAAA;QAC3B,OAAO,CAAC,GAAG,CAAC,CAAA,EAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAA,YAAA,EAAe,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAA,GAAA,CAAK,GAAG,qBAAqB,EAAE,cAAc,CAAC;QACvH,MAAM,GAAG,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC;QAEvC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC;QAC5B,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,SAAS,CAAC;AAC5B,YAAA,IAAI,EAAE,CAAC,QAAa,KAAI;AACtB,gBAAA,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,QAAQ;gBAC9B,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;gBAE1C,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,YAAY,EAAE;oBACnC,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,YAAY,EAAE,OAAO,CAAC,IAAI,CAAC;gBAChD;qBAAO;AACL,oBAAA,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC;oBAEhD,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,uBAAuB,EAAE;wBAC9C,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,iBAAiB,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,uBAAuB,CAAC,CAAC;oBAC3G;oBAEA,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,oBAAoB,EAAE;AAC3C,wBAAA,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE;oBACxB;gBACF;gBACA,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC;YAC/B,CAAC;AACD,YAAA,KAAK,EAAE,CAAC,GAAG,KAAI;;gBAEb,IAAI,CAAC,SAAS,CAAC,iBAAiB,CAAC,IAAI,EAAE,GAAG,CAAC;YAC7C,CAAC;AACF,SAAA,CAAC;AACF,QAAA,IAAI,CAAC,MAAM,CAAC,SAAS,GAAG,IAAI;IAC9B;AAEA,IAAA,MAAM,CAAC,IAAwB,EAAA;QAC7B,OAAO,CAAC,GAAG,CAAC,CAAA,EAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAA,YAAA,EAAe,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAA,GAAA,CAAK,GAAG,wBAAwB,EAAE,YAAY,CAAC;IAC1H;uGAxCW,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;AAAvB,IAAA,OAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,uBAAuB,cADX,MAAM,EAAA,CAAA;;2FAClB,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBADnC,UAAU;mBAAC,EAAC,UAAU,EAAE,MAAM,EAAC;;;;;"}

package/fesm2022/iss-ctrl-load-value-event.service-BRz28bIm.mjs

@@ -0,0 +1,52 @@
+import * as i0 from '@angular/core';
+import { inject, Injectable } from '@angular/core';
+import { m as getPropertyByPath } from './iss-ctrl-iss-ctrl-BhZGHw0A.mjs';
+import { L as LoadEventService, I as IssHttp } from './iss-ctrl-load-event.service-D_O5gUmg.mjs';
+
+class LoadValueEventService {
+    loadEvent = inject(LoadEventService);
+    #http = inject(IssHttp);
+    fire(args) {
+        console.log(`${args.field.name} listens to ${args.action.trackedFieldName} =>` + "%c Load Event Fired", "color: green");
+        const api = this.loadEvent.getApi(args);
+        args.field.loading.set(true);
+        this.#http.get(api).subscribe({
+            next: (response) => {
+                args.field.response = response;
+                args.field.apiResponse.next(response.data);
+                if (args.action.config.afterFetchFn) {
+                    args.action.config.afterFetchFn?.execute(args);
+                }
+                else {
+                    if (args.action?.config?.setValueFromApiResponse) {
+                        args.control.setValue(getPropertyByPath(args.field.response, args.action.config.setValueFromApiResponse));
+                    }
+                    else {
+                        args.control.setValue(args.field.response.data);
+                    }
+                    if (args.action.config.disableAfterFetching) {
+                        args.control.disable();
+                    }
+                }
+                args.field.loading.set(false);
+            },
+            error: (err) => {
+                // todo handle errors
+                this.loadEvent.fetchErrorHandler(args, err);
+            },
+        });
+        args.action.triggered = true;
+    }
+    revert(args) {
+        console.log(`${args.field.name} listens to ${args.action.trackedFieldName} =>` + "%c Load Event Reverted", "color: red");
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LoadValueEventService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LoadValueEventService, providedIn: "root" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LoadValueEventService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: "root" }]
+        }] });
+
+export { LoadValueEventService };
+//# sourceMappingURL=iss-ctrl-load-value-event.service-BRz28bIm.mjs.map

package/fesm2022/iss-ctrl-load-value-event.service-BRz28bIm.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"iss-ctrl-load-value-event.service-BRz28bIm.mjs","sources":["../../../projects/iss/src/events/load/load-value-event.service.ts"],"sourcesContent":["import {inject, Injectable} from \"@angular/core\";\r\nimport {Dto} from \"../../shared/interfaces/dto.interface\";\r\nimport {FieldEvent, FieldEventArgument} from \"../../shared/interfaces/field.interface\";\r\nimport {getPropertyByPath} from \"../../shared/utilities/get-property-by-path.util\";\r\nimport {IssHttp} from \"../../shared/utilities/http.util.service\";\r\nimport {LoadEventService} from \"./load-event.service\";\r\n\r\n@Injectable({providedIn: \"root\"})\r\nexport class LoadValueEventService implements FieldEvent {\r\n  loadEvent = inject(LoadEventService);\r\n  #http: IssHttp = inject(IssHttp);\r\n\r\n  fire(args: FieldEventArgument) {\r\n    console.log(`${args.field.name} listens to ${args.action.trackedFieldName} =>` + \"%c Load Event Fired\", \"color: green\");\r\n    const api = this.loadEvent.getApi(args);\r\n\r\n    args.field.loading.set(true);\r\n    this.#http.get(api).subscribe({\r\n      next: (response: Dto) => {\r\n        args.field.response = response;\r\n        args.field.apiResponse.next(response.data);\r\n\r\n        if (args.action.config.afterFetchFn) {\r\n          args.action.config.afterFetchFn?.execute(args);\r\n        } else {\r\n          if (args.action?.config?.setValueFromApiResponse) {\r\n            args.control.setValue(getPropertyByPath(args.field.response, args.action.config.setValueFromApiResponse));\r\n          } else {\r\n            args.control.setValue(args.field.response.data);\r\n          }\r\n\r\n          if (args.action.config.disableAfterFetching) {\r\n            args.control.disable();\r\n          }\r\n        }\r\n\r\n        args.field.loading.set(false);\r\n      },\r\n      error: (err) => {\r\n        // todo handle errors\r\n        this.loadEvent.fetchErrorHandler(args, err);\r\n      },\r\n    });\r\n    args.action.triggered = true;\r\n  }\r\n\r\n  revert(args: FieldEventArgument) {\r\n    console.log(`${args.field.name} listens to ${args.action.trackedFieldName} =>` + \"%c Load Event Reverted\", \"color: red\");\r\n  }\r\n}\r\n"],"names":[],"mappings":";;;;;MAQa,qBAAqB,CAAA;AAChC,IAAA,SAAS,GAAG,MAAM,CAAC,gBAAgB,CAAC;AACpC,IAAA,KAAK,GAAY,MAAM,CAAC,OAAO,CAAC;AAEhC,IAAA,IAAI,CAAC,IAAwB,EAAA;QAC3B,OAAO,CAAC,GAAG,CAAC,CAAA,EAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAA,YAAA,EAAe,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAA,GAAA,CAAK,GAAG,qBAAqB,EAAE,cAAc,CAAC;QACvH,MAAM,GAAG,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC;QAEvC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC;QAC5B,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,SAAS,CAAC;AAC5B,YAAA,IAAI,EAAE,CAAC,QAAa,KAAI;AACtB,gBAAA,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,QAAQ;gBAC9B,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;gBAE1C,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,YAAY,EAAE;oBACnC,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,YAAY,EAAE,OAAO,CAAC,IAAI,CAAC;gBAChD;qBAAO;oBACL,IAAI,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,uBAAuB,EAAE;wBAChD,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,iBAAiB,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,uBAAuB,CAAC,CAAC;oBAC3G;yBAAO;AACL,wBAAA,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC;oBACjD;oBAEA,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,oBAAoB,EAAE;AAC3C,wBAAA,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE;oBACxB;gBACF;gBAEA,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC;YAC/B,CAAC;AACD,YAAA,KAAK,EAAE,CAAC,GAAG,KAAI;;gBAEb,IAAI,CAAC,SAAS,CAAC,iBAAiB,CAAC,IAAI,EAAE,GAAG,CAAC;YAC7C,CAAC;AACF,SAAA,CAAC;AACF,QAAA,IAAI,CAAC,MAAM,CAAC,SAAS,GAAG,IAAI;IAC9B;AAEA,IAAA,MAAM,CAAC,IAAwB,EAAA;QAC7B,OAAO,CAAC,GAAG,CAAC,CAAA,EAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAA,YAAA,EAAe,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAA,GAAA,CAAK,GAAG,wBAAwB,EAAE,YAAY,CAAC;IAC1H;uGAxCW,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;AAArB,IAAA,OAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,qBAAqB,cADT,MAAM,EAAA,CAAA;;2FAClB,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBADjC,UAAU;mBAAC,EAAC,UAAU,EAAE,MAAM,EAAC;;;;;"}

package/fesm2022/iss-ctrl-mobile.wrapper-DOvO-cRi.mjs

@@ -0,0 +1,70 @@
+import * as i0 from '@angular/core';
+import { Component } from '@angular/core';
+import * as i1 from '@angular/forms';
+import { ReactiveFormsModule } from '@angular/forms';
+import { MatLabel } from '@angular/material/form-field';
+import { W as WrapperBase, V as VIEW_PROVIDER, M as MobileControl } from './iss-ctrl-iss-ctrl-BhZGHw0A.mjs';
+import { V as ViewerBase } from './iss-ctrl-viewer.base-BCFfZsDG.mjs';
+
+class MobileViewer extends ViewerBase {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MobileViewer, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MobileViewer, isStandalone: true, selector: "iss-vwr-mobile", usesInheritance: true, ngImport: i0, template: `
+    <p>{{ field().value }}</p>
+  `, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MobileViewer, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "iss-vwr-mobile",
+                    standalone: true,
+                    template: `
+    <p>{{ field().value }}</p>
+  `,
+                }]
+        }] });
+
+class MobileWrapper extends WrapperBase {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MobileWrapper, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: MobileWrapper, isStandalone: true, selector: "iss-wrp-mobile", usesInheritance: true, ngImport: i0, template: `
+    @if (field.isVisible() && field.registered()) {
+      @if (!(field.config.hideLabel)) {
+        <mat-label>{{ field.label() }}</mat-label>
+      }
+
+      @if (field.mode() === "edit") {
+        <iss-ctrl-mobile [formControlName]="field.name" />
+      } @else {
+        <iss-vwr-mobile [field]="field" />
+      }
+    }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "component", type: MobileControl, selector: "iss-ctrl-mobile", inputs: ["preferredCountries"] }, { kind: "component", type: MobileViewer, selector: "iss-vwr-mobile" }], viewProviders: [VIEW_PROVIDER] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MobileWrapper, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "iss-wrp-mobile",
+                    viewProviders: [VIEW_PROVIDER],
+                    imports: [
+                        ReactiveFormsModule,
+                        MatLabel,
+                        MobileControl,
+                        MobileViewer
+                    ],
+                    template: `
+    @if (field.isVisible() && field.registered()) {
+      @if (!(field.config.hideLabel)) {
+        <mat-label>{{ field.label() }}</mat-label>
+      }
+
+      @if (field.mode() === "edit") {
+        <iss-ctrl-mobile [formControlName]="field.name" />
+      } @else {
+        <iss-vwr-mobile [field]="field" />
+      }
+    }
+  `
+                }]
+        }] });
+
+export { MobileWrapper };
+//# sourceMappingURL=iss-ctrl-mobile.wrapper-DOvO-cRi.mjs.map

package/fesm2022/iss-ctrl-mobile.wrapper-DOvO-cRi.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"iss-ctrl-mobile.wrapper-DOvO-cRi.mjs","sources":["../../../projects/iss/src/components/controls/mobile/mobile.viewer.ts","../../../projects/iss/src/components/controls/mobile/mobile.wrapper.ts"],"sourcesContent":["import {Component} from \"@angular/core\";\r\nimport {ViewerBase} from \"../base/viewer.base\";\r\n\r\n@Component({\r\n  selector: \"iss-vwr-mobile\",\r\n  standalone: true,\r\n  template: `\r\n    <p>{{ field().value }}</p>\r\n  `,\r\n})\r\nexport class MobileViewer extends ViewerBase {}\r\n","import {Component} from \"@angular/core\";\r\nimport {ReactiveFormsModule} from \"@angular/forms\";\r\nimport {MatLabel} from \"@angular/material/form-field\";\r\nimport {VIEW_PROVIDER} from \"../../../shared/constants/provider.const\";\r\nimport {WrapperBase} from \"../base/wrapper.base\";\r\nimport {MobileControl} from \"./mobile.control\";\r\nimport {MobileViewer} from \"./mobile.viewer\";\r\n\r\n@Component({\r\n  selector: \"iss-wrp-mobile\",\r\n  viewProviders: [VIEW_PROVIDER],\r\n  imports: [\r\n    ReactiveFormsModule,\r\n    MatLabel,\r\n    MobileControl,\r\n    MobileViewer\r\n  ],\r\n  template: `\r\n    @if (field.isVisible() && field.registered()) {\r\n      @if (!(field.config.hideLabel)) {\r\n        <mat-label>{{ field.label() }}</mat-label>\r\n      }\r\n\r\n      @if (field.mode() === \"edit\") {\r\n        <iss-ctrl-mobile [formControlName]=\"field.name\" />\r\n      } @else {\r\n        <iss-vwr-mobile [field]=\"field\" />\r\n      }\r\n    }\r\n  `\r\n})\r\nexport class MobileWrapper extends WrapperBase {}\r\n"],"names":[],"mappings":";;;;;;;;AAUM,MAAO,YAAa,SAAQ,UAAU,CAAA;uGAA/B,YAAY,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAZ,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAY,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAJb,CAAA;;AAET,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;2FAEU,YAAY,EAAA,UAAA,EAAA,CAAA;kBAPxB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,gBAAgB;AAC1B,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,QAAQ,EAAE,CAAA;;AAET,EAAA,CAAA;AACF,iBAAA;;;ACsBK,MAAO,aAAc,SAAQ,WAAW,CAAA;uGAAjC,aAAa,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAb,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,aAAa,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAdd,CAAA;;;;;;;;;;;;GAYT,EAAA,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAjBC,mBAAmB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,CAAA,iBAAA,EAAA,UAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACnB,QAAQ,EAAA,QAAA,EAAA,WAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACR,aAAa,4FACb,YAAY,EAAA,QAAA,EAAA,gBAAA,EAAA,CAAA,EAAA,aAAA,EALC,CAAC,aAAa,CAAC,EAAA,CAAA;;2FAqBnB,aAAa,EAAA,UAAA,EAAA,CAAA;kBAvBzB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,gBAAgB;oBAC1B,aAAa,EAAE,CAAC,aAAa,CAAC;AAC9B,oBAAA,OAAO,EAAE;wBACP,mBAAmB;wBACnB,QAAQ;wBACR,aAAa;wBACb;AACD,qBAAA;AACD,oBAAA,QAAQ,EAAE,CAAA;;;;;;;;;;;;AAYT,EAAA;AACF,iBAAA;;;;;"}

package/fesm2022/iss-ctrl-note.wrapper-BW6WOulk.mjs

@@ -0,0 +1,43 @@
+import * as i0 from '@angular/core';
+import { Component } from '@angular/core';
+import { ReactiveFormsModule } from '@angular/forms';
+import { MatLabel } from '@angular/material/form-field';
+import { W as WrapperBase, V as VIEW_PROVIDER } from './iss-ctrl-iss-ctrl-BhZGHw0A.mjs';
+
+class NoteWrapper extends WrapperBase {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: NoteWrapper, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: NoteWrapper, isStandalone: true, selector: "iss-wrp-note", usesInheritance: true, ngImport: i0, template: `
+    @if (field.isVisible() && field.registered()) {
+      @if (!(field.config.hideLabel)) {
+        <mat-label>{{ field.label() }}</mat-label>
+      }
+      <p>
+        {{ ctrlValueChange() }}
+      </p>
+    }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: MatLabel, selector: "mat-label" }], viewProviders: [VIEW_PROVIDER] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: NoteWrapper, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "iss-wrp-note",
+                    viewProviders: [VIEW_PROVIDER],
+                    imports: [
+                        ReactiveFormsModule,
+                        MatLabel
+                    ],
+                    template: `
+    @if (field.isVisible() && field.registered()) {
+      @if (!(field.config.hideLabel)) {
+        <mat-label>{{ field.label() }}</mat-label>
+      }
+      <p>
+        {{ ctrlValueChange() }}
+      </p>
+    }
+  `
+                }]
+        }] });
+
+export { NoteWrapper };
+//# sourceMappingURL=iss-ctrl-note.wrapper-BW6WOulk.mjs.map

package/fesm2022/iss-ctrl-note.wrapper-BW6WOulk.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"iss-ctrl-note.wrapper-BW6WOulk.mjs","sources":["../../../projects/iss/src/components/controls/note/note.wrapper.ts"],"sourcesContent":["import {Component} from \"@angular/core\";\r\nimport {ReactiveFormsModule} from \"@angular/forms\";\r\nimport {MatLabel} from \"@angular/material/form-field\";\r\nimport {VIEW_PROVIDER} from \"../../../shared/constants/provider.const\";\r\nimport {WrapperBase} from \"../base/wrapper.base\";\r\n\r\n@Component({\r\n  selector: \"iss-wrp-note\",\r\n  viewProviders: [VIEW_PROVIDER],\r\n  imports: [\r\n    ReactiveFormsModule,\r\n    MatLabel\r\n  ],\r\n  template: `\r\n    @if (field.isVisible() && field.registered()) {\r\n      @if (!(field.config.hideLabel)) {\r\n        <mat-label>{{ field.label() }}</mat-label>\r\n      }\r\n      <p>\r\n        {{ ctrlValueChange() }}\r\n      </p>\r\n    }\r\n  `\r\n})\r\nexport class NoteWrapper extends WrapperBase {}\r\n"],"names":[],"mappings":";;;;;;AAwBM,MAAO,WAAY,SAAQ,WAAW,CAAA;uGAA/B,WAAW,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAX,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,WAAW,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,cAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAXZ,CAAA;;;;;;;;;AAST,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAZC,mBAAmB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACnB,QAAQ,EAAA,QAAA,EAAA,WAAA,EAAA,CAAA,EAAA,aAAA,EAHK,CAAC,aAAa,CAAC,EAAA,CAAA;;2FAgBnB,WAAW,EAAA,UAAA,EAAA,CAAA;kBAlBvB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,cAAc;oBACxB,aAAa,EAAE,CAAC,aAAa,CAAC;AAC9B,oBAAA,OAAO,EAAE;wBACP,mBAAmB;wBACnB;AACD,qBAAA;AACD,oBAAA,QAAQ,EAAE,CAAA;;;;;;;;;AAST,EAAA;AACF,iBAAA;;;;;"}

package/fesm2022/iss-ctrl-plate-number.wrapper-B_NXePR_.mjs

@@ -0,0 +1,228 @@
+import * as i0 from '@angular/core';
+import { signal, effect, ChangeDetectionStrategy, Component } from '@angular/core';
+import * as i1 from '@angular/forms';
+import { ReactiveFormsModule } from '@angular/forms';
+import { MatLabel } from '@angular/material/form-field';
+import { P as PLATE_LETTERS, W as WrapperBase, V as VIEW_PROVIDER, g as PlateControl } from './iss-ctrl-iss-ctrl-BhZGHw0A.mjs';
+import { V as ViewerBase } from './iss-ctrl-viewer.base-BCFfZsDG.mjs';
+
+class PlateViewer extends ViewerBase {
+    numbersAr = signal(Array(4).fill(""), ...(ngDevMode ? [{ debugName: "numbersAr" }] : []));
+    numbersEn = signal(Array(4).fill(""), ...(ngDevMode ? [{ debugName: "numbersEn" }] : []));
+    lettersAr = signal(Array(3).fill(""), ...(ngDevMode ? [{ debugName: "lettersAr" }] : []));
+    lettersEn = signal(Array(3).fill(""), ...(ngDevMode ? [{ debugName: "lettersEn" }] : []));
+    effectRef = effect(() => {
+        const val = this.field().value;
+        if (val) {
+            const parts = val.split("-");
+            const letters = parts[0]?.split("") || [];
+            const numbers = parts[1]?.split("") || [];
+            // Initialize letters
+            const lAr = [];
+            const lEn = [];
+            for (let i = 0; i < 3; i++) {
+                const char = letters[i] || "";
+                if (char) {
+                    const plateLetter = PLATE_LETTERS.find(l => l.value === char || l.label.en === char || l.label.ar === char);
+                    if (plateLetter) {
+                        lAr.push(plateLetter.label.ar);
+                        lEn.push(plateLetter.label.en);
+                    }
+                    else {
+                        lAr.push("");
+                        lEn.push("");
+                    }
+                }
+                else {
+                    lAr.push("");
+                    lEn.push("");
+                }
+            }
+            this.lettersAr.set(lAr);
+            this.lettersEn.set(lEn);
+            // Initialize numbers
+            const nAr = [];
+            const nEn = [];
+            for (let i = 0; i < 4; i++) {
+                const char = numbers[i] || "";
+                if (char) {
+                    nAr.push(this.convertDigit(char, "ar"));
+                    nEn.push(this.convertDigit(char, "en"));
+                }
+                else {
+                    nAr.push("");
+                    nEn.push("");
+                }
+            }
+            this.numbersAr.set(nAr);
+            this.numbersEn.set(nEn);
+        }
+    }, ...(ngDevMode ? [{ debugName: "effectRef" }] : []));
+    convertDigit(digit, toLang) {
+        const arDigits = ["٠", "١", "٢", "٣", "٤", "٥", "٦", "٧", "٨", "٩"];
+        const enDigits = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"];
+        if (toLang === "ar") {
+            const index = enDigits.indexOf(digit);
+            return index !== -1 ? arDigits[index] : digit;
+        }
+        else {
+            const index = arDigits.indexOf(digit);
+            return index !== -1 ? enDigits[index] : digit;
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: PlateViewer, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: PlateViewer, isStandalone: true, selector: "iss-vwr-plate", usesInheritance: true, ngImport: i0, template: `
+    <div class="plate-container">
+      <div class="section numbers-section">
+        <div class="digit-row">
+          @for (numAr of numbersAr(); track numAr) {
+            <span>{{ numAr }}</span>
+          }
+        </div>
+        <div class="digit-row">
+          @for (numEn of numbersEn(); track numEn) {
+            <span>{{ numEn }}</span>
+          }
+        </div>
+      </div>
+
+      <div class="section emblem-section">
+        <svg class="emblem-svg" viewBox="0 0 17 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <path
+            fill-rule="evenodd"
+            clip-rule="evenodd"
+            d="M10.8072 16.8744C11.4633 16.178 11.3244 15.3914 10.7996 15.3825C10.9872 15.9606 10.5562 16.3344 10.3922 16.5266C9.97894 16.1712 9.55086 15.7761 9.10778 15.3694C11.2695 13.5812 13.6354 11.995 16.7263 11.9452C13.3983 10.7499 10.7417 12.7815 8.4925 14.8084C6.24308 12.7815 3.58672 10.7499 0.257812 11.9452C3.34944 11.995 5.71507 13.581 7.87722 15.3694C7.43329 15.7761 7.00564 16.1712 6.59172 16.5266C6.42902 16.3344 5.99777 15.9606 6.18435 15.3825C5.65992 15.3914 5.52089 16.178 6.17758 16.8744C5.91495 17.0931 5.48962 17.4631 5.15113 17.5518C4.89082 17.6199 4.68185 17.4846 4.63473 17.2026C4.53542 16.6069 3.61271 16.6959 3.72554 17.5372C3.82907 18.3044 4.76066 18.6391 5.55892 18.2837C5.87565 18.1424 6.3107 17.7413 6.66778 17.45C6.83111 17.641 7.26215 18.0145 7.07494 18.5935C7.59979 18.5838 7.7384 17.798 7.08234 17.1005C7.54845 16.7028 8.01625 16.2927 8.4925 15.887C8.96833 16.2925 9.43634 16.7028 9.90288 17.1005C9.24639 17.798 9.385 18.5838 9.91006 18.5935C9.72285 18.0145 10.1539 17.6414 10.3168 17.45C10.6745 17.7413 11.1091 18.1424 11.4263 18.2837C12.2246 18.6391 13.1555 18.3044 13.259 17.5372C13.3719 16.6959 12.4496 16.6069 12.3494 17.2026C12.3023 17.4846 12.094 17.6196 11.8332 17.5518C11.4948 17.4631 11.0696 17.0931 10.8072 16.8744ZM6.72504 5.72093C6.22365 7.04637 6.19597 8.53894 6.9169 10.1805C6.80195 8.47576 7.17594 7.06771 7.8713 6.0066L8.01815 7.46832H7.84679L8.01815 9.17958H7.84679L8.01815 10.8904H7.84679L8.01794 12.5991L7.53366 13.0819H8.4925H9.45156L8.96685 12.5991L9.13842 10.8904H8.96685L9.13842 9.17958H8.96685L9.13842 7.46832H8.96685L9.11391 6.0066C9.80906 7.06771 10.1833 8.47682 10.0683 10.1805C10.7886 8.53894 10.7616 7.047 10.2602 5.72093C11.1115 6.72478 11.7701 7.89851 12.0661 9.36572C12.3733 7.50466 11.848 5.98568 10.8852 4.8071C11.8174 5.47943 12.6184 6.33157 13.1785 7.48396C13.048 5.72072 12.1559 4.57742 10.927 3.75824C11.989 4.1054 12.8561 4.68645 13.6343 5.71798C13.1139 3.8884 11.9801 3.15564 10.575 2.74362C11.5332 2.67368 12.4386 2.78165 13.3347 3.33988C12.3621 2.02839 11.0565 1.81055 9.73257 1.95634C10.2893 1.67279 10.9158 1.53101 11.5888 1.63137C10.8302 1.07187 9.81836 1.01651 8.95227 1.48812L8.4925 0.328125L8.0321 1.48749C7.1658 1.01651 6.15476 1.07166 5.39623 1.63137C6.06877 1.53122 6.69483 1.67279 7.25179 1.95634C5.92826 1.81055 4.62311 2.0286 3.6499 3.33988C4.54662 2.78165 5.45137 2.67368 6.41001 2.74362C5.00534 3.15564 3.87112 3.8884 3.35113 5.71798C4.12868 4.68666 4.99625 4.1054 6.05842 3.75824C4.8287 4.57721 3.93704 5.72072 3.80625 7.48396C4.36618 6.33157 5.16782 5.47943 6.09962 4.8071C5.13676 5.98568 4.61149 7.50466 4.91871 9.36572C5.21494 7.89851 5.87354 6.72478 6.72504 5.72093Z"
+            fill="#1D252D"
+          />
+        </svg>
+      </div>
+
+      <div class="section letters-section">
+        <div class="arabic-row" dir="rtl">
+          @for (lAr of lettersAr(); track lAr) {
+            <span>{{ lAr }}</span>
+          }
+        </div>
+        <div class="english-row" dir="rtl">
+          @for (lEn of lettersEn(); track lEn) {
+            <span>{{ lEn }}</span>
+          }
+        </div>
+      </div>
+
+      <div class="ksa-strip">
+        <svg class="mini-emblem" viewBox="0 0 17 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <path
+            fill-rule="evenodd" clip-rule="evenodd"
+            d="M10.8072 16.8744C11.4633 16.178 11.3244 15.3914 10.7996 15.3825C10.9872 15.9606 10.5562 16.3344 10.3922 16.5266C9.97894 16.1712 9.55086 15.7761 9.10778 15.3694C11.2695 13.5812 13.6354 11.995 16.7263 11.9452C13.3983 10.7499 10.7417 12.7815 8.4925 14.8084C6.24308 12.7815 3.58672 10.7499 0.257812 11.9452C3.34944 11.995 5.71507 13.581 7.87722 15.3694C7.43329 15.7761 7.00564 16.1712 6.59172 16.5266C6.42902 16.3344 5.99777 15.9606 6.18435 15.3825C5.65992 15.3914 5.52089 16.178 6.17758 16.8744C5.91495 17.0931 5.48962 17.4631 5.15113 17.5518C4.89082 17.6199 4.68185 17.4846 4.63473 17.2026C4.53542 16.6069 3.61271 16.6959 3.72554 17.5372C3.82907 18.3044 4.76066 18.6391 5.55892 18.2837C5.87565 18.1424 6.3107 17.7413 6.66778 17.45C6.83111 17.641 7.26215 18.0145 7.07494 18.5935C7.59979 18.5838 7.7384 17.798 7.08234 17.1005C7.54845 16.7028 8.01625 16.2927 8.4925 15.887C8.96833 16.2925 9.43634 16.7028 9.90288 17.1005C9.24639 17.798 9.385 18.5838 9.91006 18.5935C9.72285 18.0145 10.1539 17.6414 10.3168 17.45C10.6745 17.7413 11.1091 18.1424 11.4263 18.2837C12.2246 18.6391 13.1555 18.3044 13.259 17.5372C13.3719 16.6959 12.4496 16.6069 12.3494 17.2026C12.3023 17.4846 12.094 17.6196 11.8332 17.5518C11.4948 17.4631 11.0696 17.0931 10.8072 16.8744ZM6.72504 5.72093C6.22365 7.04637 6.19597 8.53894 6.9169 10.1805C6.80195 8.47576 7.17594 7.06771 7.8713 6.0066L8.01815 7.46832H7.84679L8.01815 9.17958H7.84679L8.01815 10.8904H7.84679L8.01794 12.5991L7.53366 13.0819H8.4925H9.45156L8.96685 12.5991L9.13842 10.8904H8.96685L9.13842 9.17958H8.96685L9.13842 7.46832H8.96685L9.11391 6.0066C9.80906 7.06771 10.1833 8.47682 10.0683 10.1805C10.7886 8.53894 10.7616 7.047 10.2602 5.72093C11.1115 6.72478 11.7701 7.89851 12.0661 9.36572C12.3733 7.50466 11.848 5.98568 10.8852 4.8071C11.8174 5.47943 12.6184 6.33157 13.1785 7.48396C13.048 5.72072 12.1559 4.57742 10.927 3.75824C11.989 4.1054 12.8561 4.68645 13.6343 5.71798C13.1139 3.8884 11.9801 3.15564 10.575 2.74362C11.5332 2.67368 12.4386 2.78165 13.3347 3.33988C12.3621 2.02839 11.0565 1.81055 9.73257 1.95634C10.2893 1.67279 10.9158 1.53101 11.5888 1.63137C10.8302 1.07187 9.81836 1.01651 8.95227 1.48812L8.4925 0.328125L8.0321 1.48749C7.1658 1.01651 6.15476 1.07166 5.39623 1.63137C6.06877 1.53122 6.69483 1.67279 7.25179 1.95634C5.92826 1.81055 4.62311 2.0286 3.6499 3.33988C4.54662 2.78165 5.45137 2.67368 6.41001 2.74362C5.00534 3.15564 3.87112 3.8884 3.35113 5.71798C4.12868 4.68666 4.99625 4.1054 6.05842 3.75824C4.8287 4.57721 3.93704 5.72072 3.80625 7.48396C4.36618 6.33157 5.16782 5.47943 6.09962 4.8071C5.13676 5.98568 4.61149 7.50466 4.91871 9.36572C5.21494 7.89851 5.87354 6.72478 6.72504 5.72093Z"
+            fill="#1D252D"
+          />
+        </svg>
+        <span class="ksa-text">KSA</span>
+      </div>
+    </div>
+  `, isInline: true, styles: [".plate-container{width:600px;height:130px;border:4px solid #1D252D;border-radius:10px;background:#fff;display:flex;box-shadow:0 4px 10px #0003;overflow:hidden;position:relative}.section{display:flex;flex-direction:column;justify-content:center;align-items:center}.numbers-section{flex:2;padding:0 10px}.digit-row{display:flex;justify-content:space-between;width:80%;font-size:38px;line-height:1;color:#1d252d;margin:2px 0}.emblem-section{flex:1.2;padding:10px}.emblem-svg{width:100%;height:100%;max-height:90px}.letters-section{flex:1.8;border-right:2px solid #1D252D;padding:0 10px}.arabic-row{font-family:Noto Sans Arabic,sans-serif;font-size:32px;display:flex;justify-content:space-around;width:100%;margin-bottom:5px;color:#1d252d}.english-row{font-size:38px;display:flex;justify-content:space-around;width:100%;color:#1d252d}.ksa-strip{width:50px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:10px 0;background-color:#fff}.mini-emblem{width:25px;height:auto}.ksa-text{writing-mode:vertical-rl;text-orientation:upright;font-weight:900;font-size:16px;letter-spacing:2px;color:#1d252d;margin-top:auto;margin-bottom:5px}.plate-input{background:transparent;border:none;text-align:center;font-family:inherit;font-size:inherit;font-weight:700;color:#1d252d;width:100%;padding:0;margin:0;outline:none}.plate-input:focus{border-bottom:2px solid #1D252D}.digit-row,.arabic-row,.english-row{display:flex;justify-content:space-between;width:100%}.number-input,.letter-input{flex:1}.plate-input::placeholder{color:#ccc;opacity:1}.input-wrapper{position:relative;display:flex;flex-direction:column;align-items:center;flex:1}.error-tooltip{position:absolute;bottom:-15px;font-size:10px;color:red;white-space:nowrap}.plate-input.invalid{color:red}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: PlateViewer, decorators: [{
+            type: Component,
+            args: [{ selector: "iss-vwr-plate", imports: [], template: `
+    <div class="plate-container">
+      <div class="section numbers-section">
+        <div class="digit-row">
+          @for (numAr of numbersAr(); track numAr) {
+            <span>{{ numAr }}</span>
+          }
+        </div>
+        <div class="digit-row">
+          @for (numEn of numbersEn(); track numEn) {
+            <span>{{ numEn }}</span>
+          }
+        </div>
+      </div>
+
+      <div class="section emblem-section">
+        <svg class="emblem-svg" viewBox="0 0 17 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <path
+            fill-rule="evenodd"
+            clip-rule="evenodd"
+            d="M10.8072 16.8744C11.4633 16.178 11.3244 15.3914 10.7996 15.3825C10.9872 15.9606 10.5562 16.3344 10.3922 16.5266C9.97894 16.1712 9.55086 15.7761 9.10778 15.3694C11.2695 13.5812 13.6354 11.995 16.7263 11.9452C13.3983 10.7499 10.7417 12.7815 8.4925 14.8084C6.24308 12.7815 3.58672 10.7499 0.257812 11.9452C3.34944 11.995 5.71507 13.581 7.87722 15.3694C7.43329 15.7761 7.00564 16.1712 6.59172 16.5266C6.42902 16.3344 5.99777 15.9606 6.18435 15.3825C5.65992 15.3914 5.52089 16.178 6.17758 16.8744C5.91495 17.0931 5.48962 17.4631 5.15113 17.5518C4.89082 17.6199 4.68185 17.4846 4.63473 17.2026C4.53542 16.6069 3.61271 16.6959 3.72554 17.5372C3.82907 18.3044 4.76066 18.6391 5.55892 18.2837C5.87565 18.1424 6.3107 17.7413 6.66778 17.45C6.83111 17.641 7.26215 18.0145 7.07494 18.5935C7.59979 18.5838 7.7384 17.798 7.08234 17.1005C7.54845 16.7028 8.01625 16.2927 8.4925 15.887C8.96833 16.2925 9.43634 16.7028 9.90288 17.1005C9.24639 17.798 9.385 18.5838 9.91006 18.5935C9.72285 18.0145 10.1539 17.6414 10.3168 17.45C10.6745 17.7413 11.1091 18.1424 11.4263 18.2837C12.2246 18.6391 13.1555 18.3044 13.259 17.5372C13.3719 16.6959 12.4496 16.6069 12.3494 17.2026C12.3023 17.4846 12.094 17.6196 11.8332 17.5518C11.4948 17.4631 11.0696 17.0931 10.8072 16.8744ZM6.72504 5.72093C6.22365 7.04637 6.19597 8.53894 6.9169 10.1805C6.80195 8.47576 7.17594 7.06771 7.8713 6.0066L8.01815 7.46832H7.84679L8.01815 9.17958H7.84679L8.01815 10.8904H7.84679L8.01794 12.5991L7.53366 13.0819H8.4925H9.45156L8.96685 12.5991L9.13842 10.8904H8.96685L9.13842 9.17958H8.96685L9.13842 7.46832H8.96685L9.11391 6.0066C9.80906 7.06771 10.1833 8.47682 10.0683 10.1805C10.7886 8.53894 10.7616 7.047 10.2602 5.72093C11.1115 6.72478 11.7701 7.89851 12.0661 9.36572C12.3733 7.50466 11.848 5.98568 10.8852 4.8071C11.8174 5.47943 12.6184 6.33157 13.1785 7.48396C13.048 5.72072 12.1559 4.57742 10.927 3.75824C11.989 4.1054 12.8561 4.68645 13.6343 5.71798C13.1139 3.8884 11.9801 3.15564 10.575 2.74362C11.5332 2.67368 12.4386 2.78165 13.3347 3.33988C12.3621 2.02839 11.0565 1.81055 9.73257 1.95634C10.2893 1.67279 10.9158 1.53101 11.5888 1.63137C10.8302 1.07187 9.81836 1.01651 8.95227 1.48812L8.4925 0.328125L8.0321 1.48749C7.1658 1.01651 6.15476 1.07166 5.39623 1.63137C6.06877 1.53122 6.69483 1.67279 7.25179 1.95634C5.92826 1.81055 4.62311 2.0286 3.6499 3.33988C4.54662 2.78165 5.45137 2.67368 6.41001 2.74362C5.00534 3.15564 3.87112 3.8884 3.35113 5.71798C4.12868 4.68666 4.99625 4.1054 6.05842 3.75824C4.8287 4.57721 3.93704 5.72072 3.80625 7.48396C4.36618 6.33157 5.16782 5.47943 6.09962 4.8071C5.13676 5.98568 4.61149 7.50466 4.91871 9.36572C5.21494 7.89851 5.87354 6.72478 6.72504 5.72093Z"
+            fill="#1D252D"
+          />
+        </svg>
+      </div>
+
+      <div class="section letters-section">
+        <div class="arabic-row" dir="rtl">
+          @for (lAr of lettersAr(); track lAr) {
+            <span>{{ lAr }}</span>
+          }
+        </div>
+        <div class="english-row" dir="rtl">
+          @for (lEn of lettersEn(); track lEn) {
+            <span>{{ lEn }}</span>
+          }
+        </div>
+      </div>
+
+      <div class="ksa-strip">
+        <svg class="mini-emblem" viewBox="0 0 17 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <path
+            fill-rule="evenodd" clip-rule="evenodd"
+            d="M10.8072 16.8744C11.4633 16.178 11.3244 15.3914 10.7996 15.3825C10.9872 15.9606 10.5562 16.3344 10.3922 16.5266C9.97894 16.1712 9.55086 15.7761 9.10778 15.3694C11.2695 13.5812 13.6354 11.995 16.7263 11.9452C13.3983 10.7499 10.7417 12.7815 8.4925 14.8084C6.24308 12.7815 3.58672 10.7499 0.257812 11.9452C3.34944 11.995 5.71507 13.581 7.87722 15.3694C7.43329 15.7761 7.00564 16.1712 6.59172 16.5266C6.42902 16.3344 5.99777 15.9606 6.18435 15.3825C5.65992 15.3914 5.52089 16.178 6.17758 16.8744C5.91495 17.0931 5.48962 17.4631 5.15113 17.5518C4.89082 17.6199 4.68185 17.4846 4.63473 17.2026C4.53542 16.6069 3.61271 16.6959 3.72554 17.5372C3.82907 18.3044 4.76066 18.6391 5.55892 18.2837C5.87565 18.1424 6.3107 17.7413 6.66778 17.45C6.83111 17.641 7.26215 18.0145 7.07494 18.5935C7.59979 18.5838 7.7384 17.798 7.08234 17.1005C7.54845 16.7028 8.01625 16.2927 8.4925 15.887C8.96833 16.2925 9.43634 16.7028 9.90288 17.1005C9.24639 17.798 9.385 18.5838 9.91006 18.5935C9.72285 18.0145 10.1539 17.6414 10.3168 17.45C10.6745 17.7413 11.1091 18.1424 11.4263 18.2837C12.2246 18.6391 13.1555 18.3044 13.259 17.5372C13.3719 16.6959 12.4496 16.6069 12.3494 17.2026C12.3023 17.4846 12.094 17.6196 11.8332 17.5518C11.4948 17.4631 11.0696 17.0931 10.8072 16.8744ZM6.72504 5.72093C6.22365 7.04637 6.19597 8.53894 6.9169 10.1805C6.80195 8.47576 7.17594 7.06771 7.8713 6.0066L8.01815 7.46832H7.84679L8.01815 9.17958H7.84679L8.01815 10.8904H7.84679L8.01794 12.5991L7.53366 13.0819H8.4925H9.45156L8.96685 12.5991L9.13842 10.8904H8.96685L9.13842 9.17958H8.96685L9.13842 7.46832H8.96685L9.11391 6.0066C9.80906 7.06771 10.1833 8.47682 10.0683 10.1805C10.7886 8.53894 10.7616 7.047 10.2602 5.72093C11.1115 6.72478 11.7701 7.89851 12.0661 9.36572C12.3733 7.50466 11.848 5.98568 10.8852 4.8071C11.8174 5.47943 12.6184 6.33157 13.1785 7.48396C13.048 5.72072 12.1559 4.57742 10.927 3.75824C11.989 4.1054 12.8561 4.68645 13.6343 5.71798C13.1139 3.8884 11.9801 3.15564 10.575 2.74362C11.5332 2.67368 12.4386 2.78165 13.3347 3.33988C12.3621 2.02839 11.0565 1.81055 9.73257 1.95634C10.2893 1.67279 10.9158 1.53101 11.5888 1.63137C10.8302 1.07187 9.81836 1.01651 8.95227 1.48812L8.4925 0.328125L8.0321 1.48749C7.1658 1.01651 6.15476 1.07166 5.39623 1.63137C6.06877 1.53122 6.69483 1.67279 7.25179 1.95634C5.92826 1.81055 4.62311 2.0286 3.6499 3.33988C4.54662 2.78165 5.45137 2.67368 6.41001 2.74362C5.00534 3.15564 3.87112 3.8884 3.35113 5.71798C4.12868 4.68666 4.99625 4.1054 6.05842 3.75824C4.8287 4.57721 3.93704 5.72072 3.80625 7.48396C4.36618 6.33157 5.16782 5.47943 6.09962 4.8071C5.13676 5.98568 4.61149 7.50466 4.91871 9.36572C5.21494 7.89851 5.87354 6.72478 6.72504 5.72093Z"
+            fill="#1D252D"
+          />
+        </svg>
+        <span class="ksa-text">KSA</span>
+      </div>
+    </div>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".plate-container{width:600px;height:130px;border:4px solid #1D252D;border-radius:10px;background:#fff;display:flex;box-shadow:0 4px 10px #0003;overflow:hidden;position:relative}.section{display:flex;flex-direction:column;justify-content:center;align-items:center}.numbers-section{flex:2;padding:0 10px}.digit-row{display:flex;justify-content:space-between;width:80%;font-size:38px;line-height:1;color:#1d252d;margin:2px 0}.emblem-section{flex:1.2;padding:10px}.emblem-svg{width:100%;height:100%;max-height:90px}.letters-section{flex:1.8;border-right:2px solid #1D252D;padding:0 10px}.arabic-row{font-family:Noto Sans Arabic,sans-serif;font-size:32px;display:flex;justify-content:space-around;width:100%;margin-bottom:5px;color:#1d252d}.english-row{font-size:38px;display:flex;justify-content:space-around;width:100%;color:#1d252d}.ksa-strip{width:50px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:10px 0;background-color:#fff}.mini-emblem{width:25px;height:auto}.ksa-text{writing-mode:vertical-rl;text-orientation:upright;font-weight:900;font-size:16px;letter-spacing:2px;color:#1d252d;margin-top:auto;margin-bottom:5px}.plate-input{background:transparent;border:none;text-align:center;font-family:inherit;font-size:inherit;font-weight:700;color:#1d252d;width:100%;padding:0;margin:0;outline:none}.plate-input:focus{border-bottom:2px solid #1D252D}.digit-row,.arabic-row,.english-row{display:flex;justify-content:space-between;width:100%}.number-input,.letter-input{flex:1}.plate-input::placeholder{color:#ccc;opacity:1}.input-wrapper{position:relative;display:flex;flex-direction:column;align-items:center;flex:1}.error-tooltip{position:absolute;bottom:-15px;font-size:10px;color:red;white-space:nowrap}.plate-input.invalid{color:red}\n"] }]
+        }] });
+
+class PlateNumberWrapper extends WrapperBase {
+    updateField($event) {
+        this.field.ctrlJsonValue.set($event);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: PlateNumberWrapper, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: PlateNumberWrapper, isStandalone: true, selector: "iss-wrp-plate-number", usesInheritance: true, ngImport: i0, template: `
+    @if (field.isVisible() && field.registered()) {
+      @if (!(field.config.hideLabel)) {
+        <mat-label>{{ field.label() }}</mat-label>
+      }
+
+      @if (field.mode() === "edit") {
+        <iss-ctrl-plate-number [formControlName]="field.name" (onChange)="updateField($event)" />
+      } @else {
+        <iss-vwr-plate [field]="field" />
+      }
+    }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: PlateControl, selector: "iss-ctrl-plate-number" }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "component", type: PlateViewer, selector: "iss-vwr-plate" }], viewProviders: [VIEW_PROVIDER] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: PlateNumberWrapper, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "iss-wrp-plate-number",
+                    viewProviders: [VIEW_PROVIDER],
+                    imports: [
+                        ReactiveFormsModule,
+                        PlateControl,
+                        MatLabel,
+                        PlateViewer
+                    ],
+                    template: `
+    @if (field.isVisible() && field.registered()) {
+      @if (!(field.config.hideLabel)) {
+        <mat-label>{{ field.label() }}</mat-label>
+      }
+
+      @if (field.mode() === "edit") {
+        <iss-ctrl-plate-number [formControlName]="field.name" (onChange)="updateField($event)" />
+      } @else {
+        <iss-vwr-plate [field]="field" />
+      }
+    }
+  `
+                }]
+        }] });
+
+export { PlateNumberWrapper };
+//# sourceMappingURL=iss-ctrl-plate-number.wrapper-B_NXePR_.mjs.map