@iapps/ng-dhis2-ui 1.3.7 → 1.3.8

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

@@ -3233,18 +3233,20 @@ const orgUnitFieldStyles$1 = {
     },
 };
 const OrgUnitFormField$1 = (props) => {
-    const { onSelectOrgUnit, label, required, selected, disabled, key } = props;
+    const { onSelectOrgUnit, label, required, selected, disabled, key, customOrgUnitRoots, multiple = false, selectedPaths, } = props;
     const d2 = window?.d2Web;
     const classes = useDynamicStyles$2(orgUnitFieldStyles$1);
     const config = useMemo(() => {
         return d2.systemInfo?.toInitObject();
     }, []);
     const rootOrgUnits = useMemo(() => {
-        return d2.currentUser?.organisationUnits || [];
-    }, []);
+        return (customOrgUnitRoots?.map((id) => ({ id: `/${id}`, path: `/${id}` })) ??
+            d2.currentUser?.organisationUnits ??
+            []);
+    }, [customOrgUnitRoots]);
     const getExpandedItems = () => {
         if (rootOrgUnits && rootOrgUnits.length === 1) {
-            return [`/${rootOrgUnits[0].id}`];
+            return [`${rootOrgUnits[0].path}`];
         }
         else if (rootOrgUnits?.length > 1) {
             return rootOrgUnits.map((root) => root.path);
@@ -3278,11 +3280,14 @@ const OrgUnitFormField$1 = (props) => {
         }
     }, []);
     const highlighted = useMemo(() => {
+        if (selectedPaths !== undefined) {
+            return selectedPaths;
+        }
         if (selectedOrgUnit) {
             return [selectedOrgUnit['path']];
         }
         return undefined;
-    }, [selectedOrgUnit]);
+    }, [selectedPaths, selectedOrgUnit]);
     const selectedOrgUnitLabel = useMemo(() => {
         if (selectedOrgUnit) {
             return [
@@ -3300,13 +3305,7 @@ const OrgUnitFormField$1 = (props) => {
         }
     };
     const handleCollapse = ({ path }) => {
-        const pathIndex = expanded?.indexOf(path);
-        if (pathIndex && pathIndex !== -1 && expanded) {
-            const updatedExpanded = pathIndex === 0
-                ? expanded.slice(1)
-                : [...expanded.slice(0, pathIndex), ...expanded.slice(pathIndex + 1)];
-            setExpanded(updatedExpanded);
-        }
+        setExpanded((previous) => previous?.filter((item) => item !== path));
     };
     const handleOrgUnitSearch = async (query) => {
         setSearchLoading(true);
@@ -3335,15 +3334,15 @@ const OrgUnitFormField$1 = (props) => {
                 return (React__default.createElement("div", { className: classes.orgUnitTreeLoader },
                     React__default.createElement(CircularLoader$1, { small: true })));
             }
-            return (ready && (React__default.createElement(OrganisationUnitTree, { key: `${key}-search`, roots: searchData?.map((orgUnit) => orgUnit.id) || [], singleSelection: true, expanded: expanded, handleExpand: handleExpand, handleCollapse: handleCollapse, selected: highlighted, onChange: (event) => {
+            return (ready && (React__default.createElement(OrganisationUnitTree, { key: `${key}-search`, roots: searchData?.map((orgUnit) => orgUnit.id) || [], singleSelection: !multiple, expanded: expanded, handleExpand: handleExpand, handleCollapse: handleCollapse, selected: highlighted, onChange: (event) => {
                     setSelectedOrgUnit(event);
-                    setShowOrgUnitTree(false);
+                    setShowOrgUnitTree(multiple);
                     onSelectOrgUnit(event);
                 } })));
         }
-        return (React__default.createElement(OrganisationUnitTree, { key: key, roots: rootOrgUnits?.map((orgUnit) => orgUnit.id) || [], singleSelection: true, expanded: expanded, handleExpand: handleExpand, handleCollapse: handleCollapse, selected: highlighted, onChange: (event) => {
+        return (React__default.createElement(OrganisationUnitTree, { key: key, roots: rootOrgUnits?.map((orgUnit) => orgUnit.id) || [], singleSelection: !multiple, expanded: expanded, handleExpand: handleExpand, handleCollapse: handleCollapse, selected: highlighted, onChange: (event) => {
                 setSelectedOrgUnit(event);
-                setShowOrgUnitTree(false);
+                setShowOrgUnitTree(multiple);
                 onSelectOrgUnit(event);
             } }));
     };
@@ -3355,7 +3354,7 @@ const OrgUnitFormField$1 = (props) => {
             label && (React__default.createElement("div", { className: classes.orgUnitFieldLabel },
                 React__default.createElement("span", null, label),
                 required ? (React__default.createElement("span", { className: classes.orgUnitFieldRequiredLabel }, "*")) : (React__default.createElement(React__default.Fragment, null)))),
-            !showOrgUnitTree ? (selectedOrgUnit ? (React__default.createElement(React__default.Fragment, null,
+            !multiple && !showOrgUnitTree ? (selectedOrgUnit ? (React__default.createElement(React__default.Fragment, null,
                 React__default.createElement(Tooltip, { content: selectedOrgUnitLabel },
                     React__default.createElement(Chip, { onRemove: () => {
                             setShowOrgUnitTree(true);
@@ -3367,19 +3366,17 @@ const OrgUnitFormField$1 = (props) => {
                     React__default.createElement(CircularLoader$1, { small: true }))) : (React__default.createElement("div", { className: classes.orgUnitTreeContainer, style: { maxHeight: '200px', overflowY: 'auto' } }, renderOrgUnitTree()))))))));
 };
 
-const OrgUnitSelector = ({ hide, setHide, selectedOrgUnit, setSelectedOrgUnit, setOrgUnitState, setTempOrgUnitState, tempOrgUnitState }) => (React__default.createElement(Modal$1, { hide: hide, position: "middle" },
-    React__default.createElement(ModalTitle$1, null, "Select organization unit"),
-    React__default.createElement(ModalContent$1, null,
-        React__default.createElement(OrgUnitFormField$1, { key: selectedOrgUnit, onSelectOrgUnit: (selectedOrgUnit) => {
-                setSelectedOrgUnit(selectedOrgUnit.displayName);
-                setTempOrgUnitState(selectedOrgUnit.id);
-                setHide(true);
-            } })),
-    React__default.createElement(ModalActions$1, null,
-        React__default.createElement(ButtonStrip$1, { end: true },
-            React__default.createElement(Button$1, { onClick: () => setHide(true), secondary: true }, "Close")))));
-
-const FilterToolbar = ({ orgUnit: { orgUnitLabel, selectedOrgUnit, setSelectedOrgUnit, setOrgUnitState, defaultOrgUnit, setHide, setTempOrgUnitState, tempOrgUnitState, SetOrgUnitModalVisible, handleOrgUnitFilter, prevSelectedOrgUnit, setPrevSelectedOrgUnit, }, dates: { startDateState, setStartDateState, endDateState, setEndDateState, setTempStartDateState, setTempEndDateState, tempStartDateState, tempEndDateState, showEnrollmentDates, handleStartDateFilter, handleEndDateFilter, }, filters: { visibleFilters, dateStates, inputValues, setInputValues, handleInputChange, handleInputChangeForSelectField, handleDateSelect, showAllFilters, setShowAllFilters, dataQueryFiltersState, setDataQueryFiltersState, handleAdditionalFilters, setDateStates, prevInputValues, setPrevInputValues, setTempDataQueryFiltersState, prevDateStates, setPrevDateStates, }, }) => {
+const FilterToolbar = ({ orgUnit: { customOrgUnitRoots, allowMultipleOrgUnits, chosenOrgUnits: chosenOrgUnitsProp, setChosenOrgUnits, orgUnitLabel, selectedOrgUnit, setSelectedOrgUnit, setOrgUnitState, defaultOrgUnit, setTempOrgUnitState, tempOrgUnitState, handleOrgUnitFilter, tempOrgUnitModeState, defaultOrgUnitMode, setTempOrgUnitModeState, handleOrgUnitModeReset, prevSelectedOrgUnit, setPrevSelectedOrgUnit, }, dates: { startDateState, setStartDateState, endDateState, setEndDateState, setTempStartDateState, setTempEndDateState, tempStartDateState, tempEndDateState, showEnrollmentDates, handleStartDateFilter, handleEndDateFilter, }, filters: { visibleFilters, dateStates, inputValues, setInputValues, handleInputChange, handleInputChangeForSelectField, handleDateSelect, showAllFilters, setShowAllFilters, dataQueryFiltersState, setDataQueryFiltersState, handleAdditionalFilters, setDateStates, prevInputValues, setPrevInputValues, setTempDataQueryFiltersState, prevDateStates, setPrevDateStates, }, }) => {
+    const chosenOrgUnits = chosenOrgUnitsProp;
+    const displayedOrgUnitNames = (prevSelectedOrgUnit || '').split(', ');
+    const orgUnitSelectionLabel = displayedOrgUnitNames.length > 2
+        ? `${displayedOrgUnitNames.slice(0, 2).join(', ')} .....`
+        : prevSelectedOrgUnit;
+    const updateChosenOrgUnits = (units) => {
+        setChosenOrgUnits(units);
+        setSelectedOrgUnit(units.map((unit) => unit.displayName).join(', '));
+        setTempOrgUnitState(units.map((unit) => unit.id).join(';'));
+    };
     const [isOpen, setIsOpen] = useState(false);
     const [isOpenOrgUnitDropdown, setIsOpenOrgUnitDropdown] = useState(false);
     const [openDropdownKey, setOpenDropdownKey] = useState(null);
@@ -3399,12 +3396,25 @@ const FilterToolbar = ({ orgUnit: { orgUnitLabel, selectedOrgUnit, setSelectedOr
                     flexWrap: 'wrap',
                 } },
                 React__default.createElement(DropdownButton, { name: "customDropdown", open: isOpenOrgUnitDropdown, onClick: () => setIsOpenOrgUnitDropdown(!isOpenOrgUnitDropdown), component: React__default.createElement("div", null,
-                        React__default.createElement(FlyoutMenu, null,
+                        React__default.createElement(FlyoutMenu, { maxWidth: "90vw" },
                             React__default.createElement("div", { style: { padding: '16px' } },
-                                React__default.createElement(InputField$1, { key: "location", placeholder: orgUnitLabel ? orgUnitLabel : 'Registering unit', value: selectedOrgUnit, onFocus: () => {
-                                        SetOrgUnitModalVisible(true);
-                                        setHide(false);
-                                    } }),
+                                isOpenOrgUnitDropdown && (React__default.createElement("div", { style: { width: '400px', maxWidth: '80vw' } },
+                                    React__default.createElement(OrgUnitFormField$1, { key: "registering-unit", customOrgUnitRoots: customOrgUnitRoots, multiple: allowMultipleOrgUnits, selectedPaths: chosenOrgUnits.map((unit) => unit.path), onSelectOrgUnit: (unit) => {
+                                            if (!allowMultipleOrgUnits) {
+                                                updateChosenOrgUnits([unit]);
+                                                return;
+                                            }
+                                            const paths = unit.selected;
+                                            const units = chosenOrgUnits.filter((chosen) => paths.includes(chosen.path));
+                                            if (paths.includes(unit.path) && !units.some((chosen) => chosen.id === unit.id)) {
+                                                units.push(unit);
+                                            }
+                                            updateChosenOrgUnits(units);
+                                        } }),
+                                    React__default.createElement("div", { role: "group", "aria-label": "Mode", style: { display: 'flex', alignItems: 'center', gap: '12px', margin: '8px 0 12px' } },
+                                        React__default.createElement("span", { style: { fontSize: '14px', fontWeight: 400 } }, "Mode:"),
+                                        React__default.createElement("div", { style: { flex: 1, minWidth: 0 } },
+                                            React__default.createElement(SingleSelectField, { selected: tempOrgUnitModeState, helpText: `If no mode is selected, the default mode will be ${defaultOrgUnitMode}.`, onChange: ({ selected }) => setTempOrgUnitModeState(selected) }, ['DESCENDANTS', 'SELECTED', 'CHILDREN'].map((mode) => (React__default.createElement(SingleSelectOption, { key: mode, label: mode, value: mode })))))))),
                                 React__default.createElement("div", { style: {
                                         paddingTop: '8px',
                                         display: 'flex',
@@ -3418,21 +3428,25 @@ const FilterToolbar = ({ orgUnit: { orgUnitLabel, selectedOrgUnit, setSelectedOr
                                             } }, "Update"),
                                         React__default.createElement(Button$1, { disabled: !selectedOrgUnit, onClick: () => {
                                                 setSelectedOrgUnit('');
+                                                setChosenOrgUnits([]);
                                                 setPrevSelectedOrgUnit('');
                                                 setOrgUnitState(defaultOrgUnit);
+                                                handleOrgUnitModeReset();
                                                 setTempOrgUnitState(defaultOrgUnit);
                                                 setIsOpenOrgUnitDropdown(false);
                                             } }, "Reset")))))) },
                     orgUnitLabel ? orgUnitLabel : 'Registering unit',
                     ' ',
-                    prevSelectedOrgUnit && ':',
-                    " ",
-                    prevSelectedOrgUnit,
+                    prevSelectedOrgUnit && (React__default.createElement("span", { title: prevSelectedOrgUnit },
+                        ": ",
+                        orgUnitSelectionLabel)),
                     prevSelectedOrgUnit && (React__default.createElement("span", { onClick: (event) => {
                             event.stopPropagation();
                             setSelectedOrgUnit('');
+                            setChosenOrgUnits([]);
                             setPrevSelectedOrgUnit('');
                             setOrgUnitState(defaultOrgUnit);
+                            handleOrgUnitModeReset();
                             setTempOrgUnitState(defaultOrgUnit);
                             setIsOpenOrgUnitDropdown(false);
                         }, style: { display: 'inline-flex', alignItems: 'center' } },
@@ -4840,6 +4854,7 @@ const fetchLineListDownloadRows = async ({ d2, metaData, programId, programStage
 class LineListTableComponent extends ReactWrapperModule {
     constructor() {
         super(...arguments);
+        this.allowMultipleOrgUnits = false;
         this.actionOptionOrientation = 'DROPDOWN';
         this.dataQueryFilters = [];
         this.hydrateForActionFiltering = true;
@@ -4874,6 +4889,10 @@ class LineListTableComponent extends ReactWrapperModule {
             const [triggerTokenState, setTriggerTokenState] = useState(this.triggerToken);
             const [programIdState, setProgramIdState] = useState(this.programId);
             const [isOptionSetNameVisibleState, setOptionSetNameVisible] = useState(this.isOptionSetNameVisible);
+            const [chosenOrgUnits, setChosenOrgUnits] = useState([]);
+            const defaultOrgUnitMode = (this.ouMode);
+            const [orgUnitModeState, setOrgUnitModeState] = useState(defaultOrgUnitMode);
+            const [tempOrgUnitModeState, setTempOrgUnitModeState] = useState(defaultOrgUnitMode);
             const [orgUnitState, setOrgUnitState] = useState(this.orgUnit);
             const [tempOrgUnitState, setTempOrgUnitState] = useState(this.orgUnit);
             const [programStageIdState, setProgramStageIdState] = useState(this.programStageId);
@@ -4892,7 +4911,6 @@ class LineListTableComponent extends ReactWrapperModule {
             const [orgUnitLabel, setOrgUnitLabel] = useState('');
             const [selectedOrgUnit, setSelectedOrgUnit] = useState('');
             const [prevSelectedOrgUnit, setPrevSelectedOrgUnit] = useState('');
-            const [hide, setHide] = useState(true);
             const [showAllFilters, setShowAllFilters] = useState(false);
             const visibleFilters = showAllFilters
                 ? filteredColumns ?? []
@@ -4907,7 +4925,6 @@ class LineListTableComponent extends ReactWrapperModule {
             const [selectable, setSelectable] = useState(this.allowRowsSelection);
             const [triggerRefetch, setTriggerRefetch] = useState(this.triggerRefetch);
             const [showActionButtons, setShowActionButtons] = useState(this.showActionButtons);
-            const [orgUnitModalVisible, setOrgUnitModalVisible] = useState(false);
             const [error, setError] = useState(null);
             const [prevInputValues, setPrevInputValues] = useState({});
             const d2 = window.d2Web;
@@ -4969,7 +4986,7 @@ class LineListTableComponent extends ReactWrapperModule {
                                 .setProgram(this.programId)
                                 .setProgramStage(this.programStageId)
                                 .setOrgUnit(orgUnitState)
-                                .setOuMode(this.ouMode)
+                                .setOuMode(orgUnitModeState)
                                 .setPagination(new Pager({
                                 pageSize: pager.pageSize,
                                 page: pager.page,
@@ -5031,7 +5048,7 @@ class LineListTableComponent extends ReactWrapperModule {
                                 .setProgram(this.programId)
                                 .setProgramStage(this.programStageId)
                                 .setOrgUnit(orgUnitState)
-                                .setOuMode(this.ouMode)
+                                .setOuMode(orgUnitModeState)
                                 .setStatus(this.enrollmentStatus)
                                 .setEventStatus(this.eventStatus?.status, this.eventStatus?.programStage)
                                 .setFilters(dataQueryFiltersState)
@@ -5099,6 +5116,7 @@ class LineListTableComponent extends ReactWrapperModule {
                 metaData,
                 programIdState,
                 orgUnitState,
+                orgUnitModeState,
                 programStageIdState,
                 attributeFiltersState,
                 startDateState,
@@ -5120,7 +5138,7 @@ class LineListTableComponent extends ReactWrapperModule {
                         programId: programIdState,
                         programStageId: programStageIdState,
                         orgUnit: orgUnitState,
-                        ouMode: this.ouMode,
+                        ouMode: orgUnitModeState,
                         startDate: startDateState,
                         endDate: endDateState,
                         dataQueryFilters: dataQueryFiltersState,
@@ -5271,7 +5289,16 @@ class LineListTableComponent extends ReactWrapperModule {
             const handleAdditionalFilters = () => setDataQueryFiltersState(tempDataQueryFiltersState);
             const handleStartDateFilter = () => setStartDateState(tempStartDateState);
             const handleEndDateFilter = () => setEndDateState(tempEndDateState);
-            const handleOrgUnitFilter = () => setOrgUnitState(tempOrgUnitState);
+            const handleOrgUnitFilter = () => {
+                setOrgUnitState(tempOrgUnitState);
+                setOrgUnitModeState(tempOrgUnitModeState);
+                setPager((previous) => new Pager({ ...previous, page: 1 }));
+            };
+            const handleOrgUnitModeReset = () => {
+                setOrgUnitModeState(defaultOrgUnitMode);
+                setTempOrgUnitModeState(defaultOrgUnitMode);
+                setPager((previous) => new Pager({ ...previous, page: 1 }));
+            };
             function getTextColorFromBackGround(hex) {
                 hex = hex.replace('#', '');
                 const r = parseInt(hex.substr(0, 2), 16);
@@ -5315,28 +5342,25 @@ class LineListTableComponent extends ReactWrapperModule {
                         value: 'Download',
                     }, downloadLoading
                         ? React__default.createElement(CircularLoader$1, { small: true })
-                        : 'Download')), orgUnitModalVisible &&
-                    React__default.createElement(OrgUnitSelector, {
-                        hide: hide,
-                        setHide: setHide,
-                        selectedOrgUnit: selectedOrgUnit,
-                        setSelectedOrgUnit: setSelectedOrgUnit,
-                        setOrgUnitState: setOrgUnitState,
-                        setTempOrgUnitState: setTempOrgUnitState,
-                        tempOrgUnitState: tempOrgUnitState,
-                    }), this.showFilters &&
+                        : 'Download')), this.showFilters &&
                     React__default.createElement(FilterToolbar, {
                         orgUnit: {
+                            allowMultipleOrgUnits: this.allowMultipleOrgUnits,
+                            chosenOrgUnits,
+                            setChosenOrgUnits,
+                            customOrgUnitRoots: this.customOrgUnitRoots,
                             orgUnitLabel,
                             selectedOrgUnit,
                             setSelectedOrgUnit,
                             setOrgUnitState,
                             defaultOrgUnit,
-                            setHide,
                             setTempOrgUnitState,
                             tempOrgUnitState,
-                            SetOrgUnitModalVisible: setOrgUnitModalVisible,
                             handleOrgUnitFilter,
+                            tempOrgUnitModeState,
+                            defaultOrgUnitMode,
+                            setTempOrgUnitModeState,
+                            handleOrgUnitModeReset,
                             prevSelectedOrgUnit,
                             setPrevSelectedOrgUnit,
                         },
@@ -5436,7 +5460,7 @@ class LineListTableComponent extends ReactWrapperModule {
         this.render();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: LineListTableComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.8", type: LineListTableComponent, isStandalone: false, selector: "ng-dhis2-ui-line-list", inputs: { triggerToken: "triggerToken", programId: "programId", orgUnit: "orgUnit", programStageId: "programStageId", actionOptions: "actionOptions", actionOptionOrientation: "actionOptionOrientation", attributeFilters: "attributeFilters", useOuModeWithOlderDHIS2Instance: "useOuModeWithOlderDHIS2Instance", startDate: "startDate", endDate: "endDate", dataQueryFilters: "dataQueryFilters", lineListRowActionFilterConfig: "lineListRowActionFilterConfig", hydrateForActionFiltering: "hydrateForActionFiltering", ouMode: "ouMode", isButtonLoading: "isButtonLoading", buttonFilter: "buttonFilter", filterRootOrgUnit: "filterRootOrgUnit", showFilters: "showFilters", isOptionSetNameVisible: "isOptionSetNameVisible", allowRowsSelection: "allowRowsSelection", enrollmentStatus: "enrollmentStatus", filterableColumnIds: "filterableColumnIds", triggerRefetch: "triggerRefetch", eventStatus: "eventStatus", showActionButtons: "showActionButtons", showEnrollmentDates: "showEnrollmentDates", showDownloadButton: "showDownloadButton", searcheableDataElements: "searcheableDataElements", columnNameSource: "columnNameSource", orgUnitAndDateColumnsPosition: "orgUnitAndDateColumnsPosition", customDisplayInReportsIds: "customDisplayInReportsIds", columnMetadataDisplayMode: "columnMetadataDisplayMode" }, outputs: { actionSelected: "actionSelected", rowsSelected: "rowsSelected" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: ["@charset \"UTF-8\";::ng-deep .line-list-root{width:100%;max-width:100%;min-width:0}::ng-deep .line-list-download-toolbar{position:sticky;left:0;z-index:2;display:flex;justify-content:flex-end;width:100%;max-width:100%;box-sizing:border-box;background:#fff}::ng-deep .line-list-table-scroll{width:100%;max-width:100%;overflow-x:auto}::ng-deep .custom-input{display:flex!important;gap:4px!important;align-items:center!important;border:1px solid #9fadba!important;border-radius:4px!important;margin:0;padding:0 0 0 8px;background-color:#fff!important}::ng-deep .custom-input div{margin:0!important}::ng-deep .custom-input label{font-size:12px;padding-right:0}::ng-deep .custom-input input{border:none!important;font-size:12px!important;display:flex;align-items:center;padding-left:4px;height:40px;outline:none!important;box-shadow:none!important}::ng-deep .custom-input input:focus{border:none!important;box-shadow:none!important}::ng-deep .custom-input [data-test=calendar-clear-button]{background-color:#f2f2f2!important;color:#870808!important;border-radius:6px!important;padding:4px 10px!important;font-size:0!important}::ng-deep .custom-input [data-test=calendar-clear-button]:before{content:\"\\2715\";font-size:14px;color:#870808}::ng-deep .custom-input [data-test=calendar-clear-button]:hover{background-color:#ddd}::ng-deep .calendar-input-wrapper{position:relative}::ng-deep .calendar-input-wrapper .custom-input{position:relative;width:100%;display:flex;align-items:center}::ng-deep .calendar-input-wrapper [data-test=calendar-clear-button]{right:8px;bottom:14px;margin:auto;display:flex;align-items:center;justify-content:center;width:16px;height:16px;font-size:0!important;background-color:#a0adba!important;border-radius:50%;padding:2px;cursor:pointer}::ng-deep .calendar-input-wrapper [data-test=calendar-clear-button]:before{content:\"\\2715\";font-size:10px;color:#f0f0f0}::ng-deep .calendar-input-wrapper input{padding-right:40px!important;height:40px;line-height:40px;box-sizing:border-box}::ng-deep .custom-input label{color:gray!important;opacity:1}::ng-deep .table-top-toolbar{background-color:var(--colors-grey100)!important;color:var(--colors-grey900)!important}::ng-deep .custom-select-input{display:flex!important;gap:4px!important;align-items:center!important;border:1px solid #9fadba!important;border-radius:4px!important;margin:0;padding:0 0 0 8px;background-color:#fff!important}::ng-deep .custom-select-input div{margin:0!important}::ng-deep .custom-select-input [data-test=dhis2-uiwidgets-singleselectfield-label]{font-size:12px;color:gray!important}::ng-deep .custom-select-input [data-test=dhis2-uicore-select-input]{border:none!important;font-size:12px!important;display:flex;align-items:center;padding-left:4px;height:40px;outline:none!important;box-shadow:none!important}::ng-deep .custom-select-input [data-test=dhis2-uicore-select-input]:focus-within{box-shadow:none!important}::ng-deep .custom-select-input input:focus{border:none!important;box-shadow:none!important}\n"], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.8", type: LineListTableComponent, isStandalone: false, selector: "ng-dhis2-ui-line-list", inputs: { triggerToken: "triggerToken", programId: "programId", orgUnit: "orgUnit", allowMultipleOrgUnits: "allowMultipleOrgUnits", customOrgUnitRoots: "customOrgUnitRoots", programStageId: "programStageId", actionOptions: "actionOptions", actionOptionOrientation: "actionOptionOrientation", attributeFilters: "attributeFilters", useOuModeWithOlderDHIS2Instance: "useOuModeWithOlderDHIS2Instance", startDate: "startDate", endDate: "endDate", dataQueryFilters: "dataQueryFilters", lineListRowActionFilterConfig: "lineListRowActionFilterConfig", hydrateForActionFiltering: "hydrateForActionFiltering", ouMode: "ouMode", isButtonLoading: "isButtonLoading", buttonFilter: "buttonFilter", filterRootOrgUnit: "filterRootOrgUnit", showFilters: "showFilters", isOptionSetNameVisible: "isOptionSetNameVisible", allowRowsSelection: "allowRowsSelection", enrollmentStatus: "enrollmentStatus", filterableColumnIds: "filterableColumnIds", triggerRefetch: "triggerRefetch", eventStatus: "eventStatus", showActionButtons: "showActionButtons", showEnrollmentDates: "showEnrollmentDates", showDownloadButton: "showDownloadButton", searcheableDataElements: "searcheableDataElements", columnNameSource: "columnNameSource", orgUnitAndDateColumnsPosition: "orgUnitAndDateColumnsPosition", customDisplayInReportsIds: "customDisplayInReportsIds", columnMetadataDisplayMode: "columnMetadataDisplayMode" }, outputs: { actionSelected: "actionSelected", rowsSelected: "rowsSelected" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: ["@charset \"UTF-8\";::ng-deep .line-list-root{width:100%;max-width:100%;min-width:0}::ng-deep .line-list-download-toolbar{position:sticky;left:0;z-index:2;display:flex;justify-content:flex-end;width:100%;max-width:100%;box-sizing:border-box;background:#fff}::ng-deep .line-list-table-scroll{width:100%;max-width:100%;overflow-x:auto}::ng-deep .custom-input{display:flex!important;gap:4px!important;align-items:center!important;border:1px solid #9fadba!important;border-radius:4px!important;margin:0;padding:0 0 0 8px;background-color:#fff!important}::ng-deep .custom-input div{margin:0!important}::ng-deep .custom-input label{font-size:12px;padding-right:0}::ng-deep .custom-input input{border:none!important;font-size:12px!important;display:flex;align-items:center;padding-left:4px;height:40px;outline:none!important;box-shadow:none!important}::ng-deep .custom-input input:focus{border:none!important;box-shadow:none!important}::ng-deep .custom-input [data-test=calendar-clear-button]{background-color:#f2f2f2!important;color:#870808!important;border-radius:6px!important;padding:4px 10px!important;font-size:0!important}::ng-deep .custom-input [data-test=calendar-clear-button]:before{content:\"\\2715\";font-size:14px;color:#870808}::ng-deep .custom-input [data-test=calendar-clear-button]:hover{background-color:#ddd}::ng-deep .calendar-input-wrapper{position:relative}::ng-deep .calendar-input-wrapper .custom-input{position:relative;width:100%;display:flex;align-items:center}::ng-deep .calendar-input-wrapper [data-test=calendar-clear-button]{right:8px;bottom:14px;margin:auto;display:flex;align-items:center;justify-content:center;width:16px;height:16px;font-size:0!important;background-color:#a0adba!important;border-radius:50%;padding:2px;cursor:pointer}::ng-deep .calendar-input-wrapper [data-test=calendar-clear-button]:before{content:\"\\2715\";font-size:10px;color:#f0f0f0}::ng-deep .calendar-input-wrapper input{padding-right:40px!important;height:40px;line-height:40px;box-sizing:border-box}::ng-deep .custom-input label{color:gray!important;opacity:1}::ng-deep .table-top-toolbar{background-color:var(--colors-grey100)!important;color:var(--colors-grey900)!important}::ng-deep .custom-select-input{display:flex!important;gap:4px!important;align-items:center!important;border:1px solid #9fadba!important;border-radius:4px!important;margin:0;padding:0 0 0 8px;background-color:#fff!important}::ng-deep .custom-select-input div{margin:0!important}::ng-deep .custom-select-input [data-test=dhis2-uiwidgets-singleselectfield-label]{font-size:12px;color:gray!important}::ng-deep .custom-select-input [data-test=dhis2-uicore-select-input]{border:none!important;font-size:12px!important;display:flex;align-items:center;padding-left:4px;height:40px;outline:none!important;box-shadow:none!important}::ng-deep .custom-select-input [data-test=dhis2-uicore-select-input]:focus-within{box-shadow:none!important}::ng-deep .custom-select-input input:focus{border:none!important;box-shadow:none!important}\n"], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: LineListTableComponent, decorators: [{
             type: Component,
@@ -5447,6 +5471,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
                 type: Input
             }], orgUnit: [{
                 type: Input
+            }], allowMultipleOrgUnits: [{
+                type: Input
+            }], customOrgUnitRoots: [{
+                type: Input
             }], programStageId: [{
                 type: Input
             }], actionOptions: [{