@iapps/ng-dhis2-ui 1.0.5 → 1.0.8

package/README.md

@@ -1,7 +1,64 @@
 # ng-dhis2-ui
 
-This library was generated with [Nx](https://nx.dev).
+An angular wrapper library that provide access to the react based DHIS2 UI components in angular applications running in DHIS2 platform
 
-## Running unit tests
+## Library installation
 
-Run `nx test ng-dhis2-ui` to execute the unit tests.
+`npm install @iapps/ng-dhis2-ui`
+
+This library wraps most of react based DHIS2 libraries. Following packages should be installed
+
+<!-- TODO: List of dependencies -->
+
+For HTTP request, the library has used [NgxDhis2HttpClient](https://www.npmjs.com/package/@iapps/ngx-dhis2-http-client). Please follow the instructions on how to install and configure
+
+**NOTE**: Under the hood the library uses react library, hence you will need to modify some your `tsconfig.json` under compilerOptions with the following
+
+```javascript
+  ........
+  "compilerOptions": {
+    "rootDir": ".",
+    "sourceMap": true,
+    "declaration": false,
+    "moduleResolution": "node",
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "importHelpers": true,
+    "target": "es2015",
+    "module": "esnext",
+    "jsx": "react",
+    "esModuleInterop": true,
+    "lib": ["es2020", "dom"],
+    "skipLibCheck": true,
+    "skipDefaultLibCheck": true,
+    "baseUrl": ".",
+    "paths": {
+      "@iapps/ng-dhis2-ui": ["ng-dhis2-ui/src/index.ts"]
+    }
+  },
+  ......
+```
+
+## Local development
+
+If you want to collaborate to the codebase, to run the codebase locally;
+
+1. Clone the source code
+
+`git clone https://github.com/udsm-dhis2-lab/ng-dhis2-ui.git`
+
+2. Install all needed dependencies
+
+`npm install` or `yarn install`
+
+**NOTE**: Sometimes npm installation may failed due to mismatch in resolving package version dependencies. If you are using npm then run `npm install --legacy-peer-deps` to ensure all packages regardless of unmatched dependencies are getting installed. This may however break the code if the packages dependencies are incompatible
+
+3. You will be required to set up a proxy config file named `proxy-config.json`. You can simply copy `proxy-config.example.json` and modify your access credentials to DHIS2 instances to run the demo application.
+
+4. To run the demo app, in order to view and test the components `nx serve demo`
+
+## Deployment
+
+- To build, run `npm run build:dhis2-ui`
+- To pack, run `npm run pack:dhis2-ui`
+- To publish to npm, run`npm run publish:dhis2-ui`. But you will be required to have access to `@iapps` npm namespace and have already logged in under your terminal. Run `npm login` to login with your terminal

package/fesm2022/iapps-ng-dhis2-ui.mjs

@@ -160,11 +160,11 @@ TransferOption.propTypes = {
 const sharedComponents = [];
 
 class SharedDhis2UiModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: SharedDhis2UiModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.2.4", ngImport: i0, type: SharedDhis2UiModule, imports: [CommonModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: SharedDhis2UiModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: SharedDhis2UiModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.7", ngImport: i0, type: SharedDhis2UiModule, imports: [CommonModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: SharedDhis2UiModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: SharedDhis2UiModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: SharedDhis2UiModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule],
@@ -1151,8 +1151,7 @@ class ReactWrapperComponent {
         this.render();
     }
     ngOnChanges() {
-        if (this.elementRef)
-            this.render();
+        // if (this.elementRef) this.render();
     }
     ngOnDestroy() {
         this.reactDomRoot?.unmount();
@@ -1160,25 +1159,27 @@ class ReactWrapperComponent {
     render() {
         if (!this.component) {
             console.warn('React component must be supplied');
-            return;
-        }
-        if (!this.reactDomRoot)
-            return;
-        const jsxContent = this.content?.nativeElement?.outerHTML
-            ? parse(this.content?.nativeElement?.outerHTML)
-            : undefined;
-        this.reactDomRoot.render(React.createElement(this.component, { ...this.props },
-            " ",
-            jsxContent || '',
-            " "));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ReactWrapperComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.4", type: ReactWrapperComponent, selector: "ng-dhis2-ui-wrapper", inputs: { props: "props", component: "component" }, queries: [{ propertyName: "content", first: true, predicate: ["ngDhis2UiContent"], descendants: true }], usesOnChanges: true, ngImport: i0 }); }
+        }
+        else {
+            if (!this.reactDomRoot)
+                return;
+            const jsxContent = this.content?.nativeElement?.outerHTML
+                ? parse(this.content?.nativeElement?.outerHTML)
+                : undefined;
+            this.reactDomRoot.render(React.createElement(this.component, { ...this.props },
+                " ",
+                jsxContent || '',
+                " "));
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ReactWrapperComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: ReactWrapperComponent, isStandalone: false, selector: "ng-dhis2-ui-wrapper", inputs: { props: "props", component: "component" }, queries: [{ propertyName: "content", first: true, predicate: ["ngDhis2UiContent"], descendants: true }], usesOnChanges: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ReactWrapperComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ReactWrapperComponent, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ng-dhis2-ui-wrapper',
+                    standalone: false
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { props: [{
                 type: Input
@@ -1190,11 +1191,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
             }] } });
 
 class ReactWrapperModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ReactWrapperModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.2.4", ngImport: i0, type: ReactWrapperModule, declarations: [ReactWrapperComponent], imports: [CommonModule], exports: [ReactWrapperComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ReactWrapperModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ReactWrapperModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.7", ngImport: i0, type: ReactWrapperModule, declarations: [ReactWrapperComponent], imports: [CommonModule], exports: [ReactWrapperComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ReactWrapperModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ReactWrapperModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ReactWrapperModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule],
@@ -1223,23 +1224,24 @@ class HeaderBarComponent extends ReactWrapperComponent {
             : () => React__default.createElement("div", null, "Something went wrong");
         this.render();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: HeaderBarComponent, deps: [{ token: i0.ElementRef }, { token: i1.NgxDhis2HttpClientService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: HeaderBarComponent, selector: "ng-dhis2-ui-header-bar", usesInheritance: true, ngImport: i0, template: `<ng-container></ng-container>`, isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: HeaderBarComponent, deps: [{ token: i0.ElementRef }, { token: i1.NgxDhis2HttpClientService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.7", type: HeaderBarComponent, isStandalone: false, selector: "ng-dhis2-ui-header-bar", usesInheritance: true, ngImport: i0, template: `<ng-container></ng-container>`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: HeaderBarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: HeaderBarComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ng-dhis2-ui-header-bar',
                     template: `<ng-container></ng-container>`,
+                    standalone: false
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.NgxDhis2HttpClientService }] });
 
 class HeaderBarModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: HeaderBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.2.4", ngImport: i0, type: HeaderBarModule, declarations: [HeaderBarComponent], imports: [CommonModule, SharedDhis2UiModule], exports: [HeaderBarComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: HeaderBarModule, imports: [CommonModule, SharedDhis2UiModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: HeaderBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.7", ngImport: i0, type: HeaderBarModule, declarations: [HeaderBarComponent], imports: [CommonModule, SharedDhis2UiModule], exports: [HeaderBarComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: HeaderBarModule, imports: [CommonModule, SharedDhis2UiModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: HeaderBarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: HeaderBarModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, SharedDhis2UiModule],
@@ -1279,14 +1281,15 @@ class ButtonComponent extends ReactWrapperComponent {
     onButtonClick(event) {
         this.buttonClick.emit(event);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ButtonComponent, selector: "ng-dhis2-ui-button", inputs: { label: "label", primary: "primary", secondary: "secondary", destructive: "destructive", disabled: "disabled", small: "small", large: "large" }, outputs: { buttonClick: "buttonClick" }, usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.7", type: ButtonComponent, isStandalone: false, selector: "ng-dhis2-ui-button", inputs: { label: "label", primary: "primary", secondary: "secondary", destructive: "destructive", disabled: "disabled", small: "small", large: "large" }, outputs: { buttonClick: "buttonClick" }, usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ButtonComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ng-dhis2-ui-button',
                     template: '<ng-content></ng-content>',
+                    standalone: false
                 }]
         }], propDecorators: { label: [{
                 type: Input
@@ -1307,11 +1310,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
             }] } });
 
 class ButtonModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.2.4", ngImport: i0, type: ButtonModule, declarations: [ButtonComponent], imports: [CommonModule, SharedDhis2UiModule], exports: [ButtonComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ButtonModule, imports: [CommonModule, SharedDhis2UiModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.7", ngImport: i0, type: ButtonModule, declarations: [ButtonComponent], imports: [CommonModule, SharedDhis2UiModule], exports: [ButtonComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ButtonModule, imports: [CommonModule, SharedDhis2UiModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ButtonModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ButtonModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ButtonComponent],
@@ -1518,7 +1521,8 @@ const dimensionIsValid = (dimension, { requireItems } = {}) => {
     if (!requiredProps.every((prop) => prop.isValid(dimension[prop.name]))) {
         return false;
     }
-    if (requireItems === true && dimensionIsEmpty(dimension)) {
+    if (requireItems === true &&
+        dimensionIsEmpty(dimension)) {
         return false;
     }
     return true;
@@ -2298,12 +2302,12 @@ class PeriodSelectorModalComponent extends ReactWrapperComponent {
     onConfirm(selectedItems) {
         this.confirm.emit(selectedItems);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: PeriodSelectorModalComponent, deps: [{ token: i0.ElementRef }, { token: i1.NgxDhis2HttpClientService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: PeriodSelectorModalComponent, selector: "ng-dhis2-ui-period-selector-modal", inputs: { selectedPeriods: "selectedPeriods" }, outputs: { cancel: "cancel", confirm: "confirm" }, usesInheritance: true, ngImport: i0, template: `<ng-container></ng-container>`, isInline: true, styles: ["::ng-deep .layer{z-index:2!important}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: PeriodSelectorModalComponent, deps: [{ token: i0.ElementRef }, { token: i1.NgxDhis2HttpClientService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.7", type: PeriodSelectorModalComponent, isStandalone: false, selector: "ng-dhis2-ui-period-selector-modal", inputs: { selectedPeriods: "selectedPeriods" }, outputs: { cancel: "cancel", confirm: "confirm" }, usesInheritance: true, ngImport: i0, template: `<ng-container></ng-container>`, isInline: true, styles: ["::ng-deep .layer{z-index:2!important}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: PeriodSelectorModalComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: PeriodSelectorModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ng-dhis2-ui-period-selector-modal', template: `<ng-container></ng-container>`, styles: ["::ng-deep .layer{z-index:2!important}\n"] }]
+            args: [{ selector: 'ng-dhis2-ui-period-selector-modal', template: `<ng-container></ng-container>`, standalone: false, styles: ["::ng-deep .layer{z-index:2!important}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.NgxDhis2HttpClientService }], propDecorators: { selectedPeriods: [{
                 type: Input
             }], cancel: [{
@@ -2313,9 +2317,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
             }] } });
 
 class PeriodSelectorComponent extends ReactWrapperComponent {
-    constructor(elementRef, httpClient) {
+    constructor(elementRef, httpClient, ngZone) {
         super(elementRef);
         this.httpClient = httpClient;
+        this.ngZone = ngZone;
         this.selectedPeriods = [];
         this.selectPeriods = new EventEmitter();
         this.props = {
@@ -2349,30 +2354,32 @@ class PeriodSelectorComponent extends ReactWrapperComponent {
         this.reactDomRoot = ReactDOM.createRoot(this.elementRef.nativeElement);
         const systemInfo = await firstValueFrom(this.httpClient.systemInfo());
         const excludedPeriodTypes = this.getExcludedPeriodTypes(systemInfo);
-        this.component = () => (React__default.createElement(DataProvider, null, React__default.createElement(PeriodDimension, { selectedPeriods: this.selectedPeriods, onSelect: (selectionEvent) => this.onSelectItems(selectionEvent), excludedPeriodTypes: excludedPeriodTypes, systemInfo: systemInfo })));
+        this.component = () => (React__default.createElement(DataProvider, null, React__default.createElement(PeriodDimension, { selectedPeriods: this.selectedPeriods, onSelect: (selectionEvent) => this.ngZone.run(() => {
+                this.onSelectItems(selectionEvent);
+            }), excludedPeriodTypes: excludedPeriodTypes, systemInfo: systemInfo })));
         this.render();
     }
     onSelectItems(selectionEvent) {
         this.selectPeriods.emit(selectionEvent.items);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: PeriodSelectorComponent, deps: [{ token: i0.ElementRef }, { token: i1.NgxDhis2HttpClientService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: PeriodSelectorComponent, selector: "ng-dhis2-ui-period-selector", inputs: { selectedPeriods: "selectedPeriods" }, outputs: { selectPeriods: "selectPeriods" }, usesInheritance: true, ngImport: i0, template: `<ng-container></ng-container>`, isInline: true, styles: ["::ng-deep .content-container{z-index:0!important}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: PeriodSelectorComponent, deps: [{ token: i0.ElementRef }, { token: i1.NgxDhis2HttpClientService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.7", type: PeriodSelectorComponent, isStandalone: false, selector: "ng-dhis2-ui-period-selector", inputs: { selectedPeriods: "selectedPeriods" }, outputs: { selectPeriods: "selectPeriods" }, usesInheritance: true, ngImport: i0, template: `<ng-container></ng-container>`, isInline: true, styles: ["::ng-deep .content-container{z-index:0!important}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: PeriodSelectorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: PeriodSelectorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ng-dhis2-ui-period-selector', template: `<ng-container></ng-container>`, styles: ["::ng-deep .content-container{z-index:0!important}\n"] }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.NgxDhis2HttpClientService }], propDecorators: { selectedPeriods: [{
+            args: [{ selector: 'ng-dhis2-ui-period-selector', template: `<ng-container></ng-container>`, standalone: false, styles: ["::ng-deep .content-container{z-index:0!important}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.NgxDhis2HttpClientService }, { type: i0.NgZone }], propDecorators: { selectedPeriods: [{
                 type: Input
             }], selectPeriods: [{
                 type: Output
             }] } });
 
 class PeriodSelectorModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: PeriodSelectorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.2.4", ngImport: i0, type: PeriodSelectorModule, declarations: [PeriodSelectorComponent, PeriodSelectorModalComponent], imports: [CommonModule, SharedDhis2UiModule], exports: [PeriodSelectorComponent, PeriodSelectorModalComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: PeriodSelectorModule, imports: [CommonModule, SharedDhis2UiModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: PeriodSelectorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.7", ngImport: i0, type: PeriodSelectorModule, declarations: [PeriodSelectorComponent, PeriodSelectorModalComponent], imports: [CommonModule, SharedDhis2UiModule], exports: [PeriodSelectorComponent, PeriodSelectorModalComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: PeriodSelectorModule, imports: [CommonModule, SharedDhis2UiModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: PeriodSelectorModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: PeriodSelectorModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, SharedDhis2UiModule],
@@ -2523,12 +2530,13 @@ const DYNAMIC_ORG_UNITS = [
     USER_ORG_UNIT_CHILDREN,
     USER_ORG_UNIT_GRANDCHILDREN,
 ];
-const OrgUnitDimension = ({ roots, selected, onSelect, hideGroupSelect, hideLevelSelect, hideUserOrgUnits, warning, orgUnitGroupPromise, orgUnitLevelPromise, }) => {
+const OrgUnitDimension = ({ roots, selected, onSelect, hideGroupSelect, hideLevelSelect, hideUserOrgUnits, allowSingleSelection, warning, orgUnitGroupPromise, orgUnitLevelPromise, }) => {
     const [ouLevels, setOuLevels] = useState([]);
     const [ouGroups, setOuGroups] = useState([]);
     const [selectedItems, setSelectedItems] = useState(selected);
     const dataEngine = useDataEngine();
     const onSelectItems = (selectedItem) => {
+        console.log('WE ARE SELECTING HERE', selectedItem);
         const { id, checked, displayName, path } = selectedItem;
         let result = [...selectedItems];
         if (checked && DYNAMIC_ORG_UNITS.includes(id)) {
@@ -2707,11 +2715,13 @@ OrgUnitDimension.defaultProps = {
     hideGroupSelect: false,
     hideLevelSelect: false,
     hideUserOrgUnits: false,
+    allowSingleSelection: false,
 };
 OrgUnitDimension.propTypes = {
     hideGroupSelect: PropTypes.bool,
     hideLevelSelect: PropTypes.bool,
     hideUserOrgUnits: PropTypes.bool,
+    allowSingleSelection: PropTypes.bool,
     roots: PropTypes.arrayOf(PropTypes.string),
     selected: PropTypes.arrayOf(PropTypes.shape({
         id: PropTypes.string.isRequired,
@@ -2745,9 +2755,10 @@ class OrganisationUnitSelectionConfig {
 // license that can be found in the LICENSE file.
 
 class OrganisationUnitSelectorComponent extends ReactWrapperComponent {
-    constructor(elementRef, httpClient) {
+    constructor(elementRef, httpClient, ngZone) {
         super(elementRef);
         this.httpClient = httpClient;
+        this.ngZone = ngZone;
         this.selectedOrgUnits = [];
         this.orgUnitSelectionConfig = new OrganisationUnitSelectionConfig();
         this.selectOrgUnits = new EventEmitter();
@@ -2763,7 +2774,9 @@ class OrganisationUnitSelectorComponent extends ReactWrapperComponent {
         this.reactDomRoot = ReactDOM.createRoot(this.elementRef.nativeElement);
         const rootOrgUnits = await this.getRootOrgUnits();
         const config = await this.getAppConfig();
-        this.component = () => (React__default.createElement(Provider, { config: config }, React__default.createElement(OrgUnitDimension, { selected: this.selectedOrgUnits, hideGroupSelect: this.orgUnitSelectionConfig.hideGroupSelect, hideLevelSelect: this.orgUnitSelectionConfig.hideLevelSelect, hideUserOrgUnits: this.orgUnitSelectionConfig.hideUserOrgUnits, onSelect: (selectionEvent) => this.onSelectItems(selectionEvent), orgUnitGroupPromise: this.getOrgUnitGroups(), orgUnitLevelPromise: this.getOrgUnitLevels(), roots: rootOrgUnits })));
+        this.component = () => (React__default.createElement(Provider, { config: config, plugin: false, parentAlertsAdd: undefined, showAlertsInPlugin: false }, React__default.createElement(OrgUnitDimension, { selected: this.selectedOrgUnits, hideGroupSelect: this.orgUnitSelectionConfig.hideGroupSelect, hideLevelSelect: this.orgUnitSelectionConfig.hideLevelSelect, hideUserOrgUnits: this.orgUnitSelectionConfig.hideUserOrgUnits, onSelect: (selectionEvent) => this.ngZone.run(() => {
+                this.onSelectItems(selectionEvent);
+            }), orgUnitGroupPromise: this.getOrgUnitGroups(), orgUnitLevelPromise: this.getOrgUnitLevels(), roots: rootOrgUnits })));
         this.render();
     }
     async getAppConfig() {
@@ -2804,16 +2817,17 @@ class OrganisationUnitSelectorComponent extends ReactWrapperComponent {
     onSelectItems(selectionEvent) {
         this.selectOrgUnits.emit(selectionEvent.items);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: OrganisationUnitSelectorComponent, deps: [{ token: i0.ElementRef }, { token: i1.NgxDhis2HttpClientService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: OrganisationUnitSelectorComponent, selector: "ng-dhis2-ui-org-unit-selector", inputs: { selectedOrgUnits: "selectedOrgUnits", orgUnitSelectionConfig: "orgUnitSelectionConfig" }, outputs: { selectOrgUnits: "selectOrgUnits" }, usesInheritance: true, ngImport: i0, template: '<ng-container><ng-container>', isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: OrganisationUnitSelectorComponent, deps: [{ token: i0.ElementRef }, { token: i1.NgxDhis2HttpClientService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.7", type: OrganisationUnitSelectorComponent, isStandalone: false, selector: "ng-dhis2-ui-org-unit-selector", inputs: { selectedOrgUnits: "selectedOrgUnits", orgUnitSelectionConfig: "orgUnitSelectionConfig" }, outputs: { selectOrgUnits: "selectOrgUnits" }, usesInheritance: true, ngImport: i0, template: '<ng-container><ng-container>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: OrganisationUnitSelectorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: OrganisationUnitSelectorComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ng-dhis2-ui-org-unit-selector',
                     template: '<ng-container><ng-container>',
+                    standalone: false,
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.NgxDhis2HttpClientService }], propDecorators: { selectedOrgUnits: [{
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.NgxDhis2HttpClientService }, { type: i0.NgZone }], propDecorators: { selectedOrgUnits: [{
                 type: Input
             }], orgUnitSelectionConfig: [{
                 type: Input
@@ -2844,7 +2858,7 @@ class OrganisationUnitSelectorModalComponent extends ReactWrapperComponent {
         const config = await this.getAppConfig();
         this.component = () => {
             const [selected, setSelected] = useState(this.selectedOrgUnits);
-            return (React__default.createElement(Provider, { config: config }, React__default.createElement(Modal$1, { position: "middle", large: true },
+            return (React__default.createElement(Provider, { config: config, plugin: false, parentAlertsAdd: undefined, showAlertsInPlugin: false }, React__default.createElement(Modal$1, { position: "middle", large: true },
                 React__default.createElement(ModalTitle$1, null, "Organisation unit"),
                 React__default.createElement(ModalContent$1, null,
                     React__default.createElement(OrgUnitDimension, { selected: selected, hideGroupSelect: this.orgUnitSelectionConfig.hideGroupSelect, hideLevelSelect: this.orgUnitSelectionConfig.hideLevelSelect, hideUserOrgUnits: this.orgUnitSelectionConfig.hideUserOrgUnits, onSelect: (selectionEvent) => {
@@ -2905,12 +2919,12 @@ class OrganisationUnitSelectorModalComponent extends ReactWrapperComponent {
     onSelectItems(selectionEvent) {
         this.selectOrgUnits.emit(selectionEvent.items);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: OrganisationUnitSelectorModalComponent, deps: [{ token: i0.ElementRef }, { token: i1.NgxDhis2HttpClientService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: OrganisationUnitSelectorModalComponent, selector: "ng-dhis2-ui-org-unit-selector-modal", inputs: { selectedOrgUnits: "selectedOrgUnits", orgUnitSelectionConfig: "orgUnitSelectionConfig" }, outputs: { selectOrgUnits: "selectOrgUnits", cancel: "cancel", confirm: "confirm" }, usesInheritance: true, ngImport: i0, template: '<ng-container><ng-container>', isInline: true, styles: ["::ng-deep .layer{z-index:2!important}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: OrganisationUnitSelectorModalComponent, deps: [{ token: i0.ElementRef }, { token: i1.NgxDhis2HttpClientService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.7", type: OrganisationUnitSelectorModalComponent, isStandalone: false, selector: "ng-dhis2-ui-org-unit-selector-modal", inputs: { selectedOrgUnits: "selectedOrgUnits", orgUnitSelectionConfig: "orgUnitSelectionConfig" }, outputs: { selectOrgUnits: "selectOrgUnits", cancel: "cancel", confirm: "confirm" }, usesInheritance: true, ngImport: i0, template: '<ng-container><ng-container>', isInline: true, styles: ["::ng-deep .layer{z-index:2!important}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: OrganisationUnitSelectorModalComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: OrganisationUnitSelectorModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ng-dhis2-ui-org-unit-selector-modal', template: '<ng-container><ng-container>', styles: ["::ng-deep .layer{z-index:2!important}\n"] }]
+            args: [{ selector: 'ng-dhis2-ui-org-unit-selector-modal', template: '<ng-container><ng-container>', standalone: false, styles: ["::ng-deep .layer{z-index:2!important}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.NgxDhis2HttpClientService }], propDecorators: { selectedOrgUnits: [{
                 type: Input
             }], orgUnitSelectionConfig: [{
@@ -2924,13 +2938,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
             }] } });
 
 class OrganisationUnitSelectorModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: OrganisationUnitSelectorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.2.4", ngImport: i0, type: OrganisationUnitSelectorModule, declarations: [OrganisationUnitSelectorComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: OrganisationUnitSelectorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.7", ngImport: i0, type: OrganisationUnitSelectorModule, declarations: [OrganisationUnitSelectorComponent,
             OrganisationUnitSelectorModalComponent], imports: [CommonModule, SharedDhis2UiModule], exports: [OrganisationUnitSelectorComponent,
             OrganisationUnitSelectorModalComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: OrganisationUnitSelectorModule, imports: [CommonModule, SharedDhis2UiModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: OrganisationUnitSelectorModule, imports: [CommonModule, SharedDhis2UiModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: OrganisationUnitSelectorModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: OrganisationUnitSelectorModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, SharedDhis2UiModule],
@@ -2953,5 +2967,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { ButtonComponent, ButtonModule, HeaderBarComponent, HeaderBarModule, OrganisationUnitSelectorComponent, OrganisationUnitSelectorModalComponent, OrganisationUnitSelectorModule, PeriodSelectorComponent, PeriodSelectorModalComponent, PeriodSelectorModule, ReactWrapperComponent, ReactWrapperModule };
+export { ButtonComponent, ButtonModule, HeaderBarComponent, HeaderBarModule, OrganisationUnitSelectionConfig, OrganisationUnitSelectorComponent, OrganisationUnitSelectorModalComponent, OrganisationUnitSelectorModule, PeriodSelectorComponent, PeriodSelectorModalComponent, PeriodSelectorModule, ReactWrapperComponent, ReactWrapperModule };
 //# sourceMappingURL=iapps-ng-dhis2-ui.mjs.map