geonetwork-ui 2.4.0-dev.58b3c2e5 → 2.4.0-dev.5cc37149

package/fesm2022/geonetwork-ui.mjs

@@ -2176,6 +2176,7 @@ const mapKeywords = (thesauri, language) => {
             keywords.push({
                 label: selectTranslatedValue(keyword, language),
                 type: getKeywordTypeFromKeywordTypeCode(rawThesaurus.theme),
+                ...(keyword.link && { key: keyword.link }),
                 ...(thesaurus && { thesaurus }),
             });
         }
@@ -33967,37 +33968,54 @@ const GN_UI_VERSION = new InjectionToken('gnUiVersion');
 
 const WEB_COMPONENT_EMBEDDER_URL = new InjectionToken('webComponentEmbedderUrl');
 class DataViewPermalinkComponent {
+    set viewType(value) {
+        this.viewType$.next(value);
+    }
     constructor(config, wcEmbedderBaseUrl, version, facade) {
         this.config = config;
         this.wcEmbedderBaseUrl = wcEmbedderBaseUrl;
         this.version = version;
         this.facade = facade;
+        this.viewType$ = new BehaviorSubject('map');
         this.permalinkUrl$ = combineLatest([
+            this.viewType$,
             this.facade.chartConfig$,
             this.facade.metadata$,
-        ]).pipe(map$2(([config, metadata]) => {
-            if (config) {
-                const { aggregation, xProperty, yProperty, chartType } = config;
-                const url = new URL(`${this.wcEmbedderBaseUrl}`, window.location.origin);
-                url.searchParams.set('v', `${this.version}`);
-                url.searchParams.append('e', `gn-dataset-view-chart`);
-                url.searchParams.append('a', `api-url=${this.config.basePath}`);
-                url.searchParams.append('a', `dataset-id=${metadata.uniqueIdentifier}`);
-                url.searchParams.append('a', `primary-color=#0f4395`);
-                url.searchParams.append('a', `secondary-color=#8bc832`);
-                url.searchParams.append('a', `main-color=#555`);
-                url.searchParams.append('a', `background-color=#fdfbff`);
-                url.searchParams.append('a', `aggregation=${aggregation}`);
-                url.searchParams.append('a', `x-property=${xProperty}`);
-                url.searchParams.append('a', `y-property=${yProperty}`);
-                url.searchParams.append('a', `chart-type=${chartType}`);
-                return url.toString();
+        ]).pipe(map$2(([viewType, config, metadata]) => {
+            const url = new URL(`${this.wcEmbedderBaseUrl}`, window.location.origin);
+            url.searchParams.set('v', `${this.version}`);
+            if (viewType === 'chart') {
+                if (config) {
+                    const { aggregation, xProperty, yProperty, chartType } = config;
+                    url.searchParams.append('e', `gn-dataset-view-chart`);
+                    url.searchParams.append('a', `aggregation=${aggregation}`);
+                    url.searchParams.append('a', `x-property=${xProperty}`);
+                    url.searchParams.append('a', `y-property=${yProperty}`);
+                    url.searchParams.append('a', `chart-type=${chartType}`);
+                }
+                else {
+                    return '';
+                }
             }
-            return '';
+            else if (viewType === 'table') {
+                // table
+                url.searchParams.append('e', `gn-dataset-view-table`);
+            }
+            else {
+                // map
+                url.searchParams.append('e', `gn-dataset-view-map`);
+            }
+            url.searchParams.append('a', `api-url=${this.config.basePath}`);
+            url.searchParams.append('a', `dataset-id=${metadata.uniqueIdentifier}`);
+            url.searchParams.append('a', `primary-color=#0f4395`);
+            url.searchParams.append('a', `secondary-color=#8bc832`);
+            url.searchParams.append('a', `main-color=#555`);
+            url.searchParams.append('a', `background-color=#fdfbff`);
+            return url.toString();
         }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataViewPermalinkComponent, deps: [{ token: Configuration }, { token: WEB_COMPONENT_EMBEDDER_URL, optional: true }, { token: GN_UI_VERSION }, { token: MdViewFacade }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DataViewPermalinkComponent, selector: "gn-ui-data-view-permalink", ngImport: i0, template: "<gn-ui-copy-text-button\n  *ngIf=\"wcEmbedderBaseUrl\"\n  [text]=\"permalinkUrl$ | async\"\n  [tooltipText]=\"'tooltip.url.copy' | translate\"\n></gn-ui-copy-text-button>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CopyTextButtonComponent, selector: "gn-ui-copy-text-button", inputs: ["text", "tooltipText", "displayText", "rows"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DataViewPermalinkComponent, selector: "gn-ui-data-view-permalink", inputs: { viewType: "viewType" }, ngImport: i0, template: "<gn-ui-copy-text-button\n  *ngIf=\"wcEmbedderBaseUrl\"\n  [text]=\"permalinkUrl$ | async\"\n  [tooltipText]=\"'tooltip.url.copy' | translate\"\n></gn-ui-copy-text-button>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CopyTextButtonComponent, selector: "gn-ui-copy-text-button", inputs: ["text", "tooltipText", "displayText", "rows"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataViewPermalinkComponent, decorators: [{
             type: Component,
@@ -34013,37 +34031,71 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 }] }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [GN_UI_VERSION]
-                }] }, { type: MdViewFacade }]; } });
+                }] }, { type: MdViewFacade }]; }, propDecorators: { viewType: [{
+                type: Input
+            }] } });
 
 class DataViewWebComponentComponent {
+    set viewType(value) {
+        this.viewType$.next(value);
+    }
     constructor(config, version, facade) {
         this.config = config;
         this.version = version;
         this.facade = facade;
-        this.webComponentHtml$ = combineLatest(this.facade.chartConfig$, this.facade.metadata$).pipe(map$2(([config, metadata]) => {
-            if (config) {
-                const { aggregation, xProperty, yProperty, chartType } = config;
+        this.viewType$ = new BehaviorSubject('map');
+        this.webComponentHtml$ = combineLatest(this.viewType$, this.facade.chartConfig$, this.facade.metadata$).pipe(map$2(([viewType, config, metadata]) => {
+            if (viewType === 'chart') {
+                if (config) {
+                    const { aggregation, xProperty, yProperty, chartType } = config;
+                    return `<script src="https://cdn.jsdelivr.net/gh/geonetwork/geonetwork-ui@wc-dist-${this.version}/gn-wc.js"></script>
+  <gn-dataset-view-chart
+          api-url="${new URL(this.config.basePath, window.location.origin).toString()}"
+          dataset-id="${metadata.uniqueIdentifier}"
+          aggregation="${aggregation}"
+          x-property="${xProperty}"
+          y-property="${yProperty}"
+          chart-type="${chartType}"
+          primary-color="#0f4395"
+          secondary-color="#8bc832"
+          main-color="#555"
+          background-color="#fdfbff"
+          main-font="'Inter', sans-serif"
+          title-font="'DM Serif Display', serif"
+  ></gn-dataset-view-chart>`;
+                }
+                return '';
+            }
+            else if (viewType === 'table') {
+                return `<script src="https://cdn.jsdelivr.net/gh/geonetwork/geonetwork-ui@wc-dist-${this.version}/gn-wc.js"></script>
+  <gn-dataset-view-table
+          api-url="${new URL(this.config.basePath, window.location.origin).toString()}"
+          dataset-id="${metadata.uniqueIdentifier}"
+          primary-color="#0f4395"
+          secondary-color="#8bc832"
+          main-color="#555"
+          background-color="#fdfbff"
+          main-font="'Inter', sans-serif"
+          title-font="'DM Serif Display', serif"
+  ></gn-dataset-view-table>`;
+            }
+            else {
                 return `<script src="https://cdn.jsdelivr.net/gh/geonetwork/geonetwork-ui@wc-dist-${this.version}/gn-wc.js"></script>
-<gn-dataset-view-chart
+<gn-dataset-view-map
         api-url="${new URL(this.config.basePath, window.location.origin).toString()}"
         dataset-id="${metadata.uniqueIdentifier}"
-        aggregation="${aggregation}"
-        x-property="${xProperty}"
-        y-property="${yProperty}"
-        chart-type="${chartType}"
         primary-color="#0f4395"
         secondary-color="#8bc832"
         main-color="#555"
         background-color="#fdfbff"
         main-font="'Inter', sans-serif"
         title-font="'DM Serif Display', serif"
-></gn-dataset-view-chart>`;
+></gn-dataset-view-map>`;
             }
-            return '';
         }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataViewWebComponentComponent, deps: [{ token: Configuration }, { token: GN_UI_VERSION }, { token: MdViewFacade }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DataViewWebComponentComponent, selector: "gn-ui-data-view-web-component", ngImport: i0, template: "<gn-ui-copy-text-button\n  [text]=\"webComponentHtml$ | async\"\n  [rows]=\"3\"\n  [tooltipText]=\"'tooltip.html.copy' | translate\"\n></gn-ui-copy-text-button>\n", styles: [""], dependencies: [{ kind: "component", type: CopyTextButtonComponent, selector: "gn-ui-copy-text-button", inputs: ["text", "tooltipText", "displayText", "rows"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DataViewWebComponentComponent, selector: "gn-ui-data-view-web-component", inputs: { viewType: "viewType" }, ngImport: i0, template: "<gn-ui-copy-text-button\n  [text]=\"webComponentHtml$ | async\"\n  [rows]=\"3\"\n  [tooltipText]=\"'tooltip.html.copy' | translate\"\n></gn-ui-copy-text-button>\n", styles: [""], dependencies: [{ kind: "component", type: CopyTextButtonComponent, selector: "gn-ui-copy-text-button", inputs: ["text", "tooltipText", "displayText", "rows"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataViewWebComponentComponent, decorators: [{
             type: Component,
@@ -34054,24 +34106,34 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 }] }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [GN_UI_VERSION]
-                }] }, { type: MdViewFacade }]; } });
+                }] }, { type: MdViewFacade }]; }, propDecorators: { viewType: [{
+                type: Input
+            }] } });
 
 class DataViewShareComponent {
+    set viewType(value) {
+        this._viewType = value;
+    }
+    get viewType() {
+        return this._viewType;
+    }
     constructor(wcEmbedderBaseUrl) {
         this.wcEmbedderBaseUrl = wcEmbedderBaseUrl;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataViewShareComponent, deps: [{ token: WEB_COMPONENT_EMBEDDER_URL, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DataViewShareComponent, selector: "gn-ui-data-view-share", ngImport: i0, template: "<div class=\"container-lg px-5 my-1 lg:mx-auto\">\n  <mat-tab-group\n    [selectedIndex]=\"0\"\n    animationDuration=\"0ms\"\n    mat-stretch-tabs=\"false\"\n    mat-align-tabs=\"start\"\n    [disableRipple]=\"!wcEmbedderBaseUrl\"\n  >\n    <mat-tab *ngIf=\"wcEmbedderBaseUrl\">\n      <ng-template mat-tab-label>\n        <span class=\"tab-header-label-gray\" translate>share.tab.permalink</span>\n      </ng-template>\n      <gn-ui-data-view-permalink></gn-ui-data-view-permalink>\n    </mat-tab>\n    <mat-tab>\n      <ng-template mat-tab-label>\n        <span\n          [class]=\"\n            wcEmbedderBaseUrl\n              ? 'tab-header-label-gray'\n              : 'single-tab-header-label-gray'\n          \"\n          translate\n          >share.tab.webComponent</span\n        >\n      </ng-template>\n      <gn-ui-data-view-web-component></gn-ui-data-view-web-component>\n    </mat-tab>\n  </mat-tab-group>\n</div>\n", styles: ["::ng-deep .mat-mdc-tab.mdc-tab.mdc-tab--active .tab-header-label-gray{opacity:100%;font-weight:700}.tab-header-label-gray{@apply text-sm text-gray-700 opacity-75 hover:text-gray-900;}.single-tab-header-label-gray{@apply text-sm text-gray-900;}\n"], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$5.MatTabLabel, selector: "[mat-tab-label], [matTabLabel]" }, { kind: "component", type: i2$5.MatTab, selector: "mat-tab", inputs: ["disabled"], exportAs: ["matTab"] }, { kind: "component", type: i2$5.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple", "fitInkBarToContent", "mat-stretch-tabs"], exportAs: ["matTabGroup"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: DataViewPermalinkComponent, selector: "gn-ui-data-view-permalink" }, { kind: "component", type: DataViewWebComponentComponent, selector: "gn-ui-data-view-web-component" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DataViewShareComponent, selector: "gn-ui-data-view-share", inputs: { viewType: "viewType" }, ngImport: i0, template: "<div class=\"container-lg px-5 my-1 lg:mx-auto\">\n  <mat-tab-group\n    [selectedIndex]=\"0\"\n    animationDuration=\"0ms\"\n    mat-stretch-tabs=\"false\"\n    mat-align-tabs=\"start\"\n    [disableRipple]=\"!wcEmbedderBaseUrl\"\n  >\n    <mat-tab *ngIf=\"wcEmbedderBaseUrl\">\n      <ng-template mat-tab-label>\n        <span class=\"tab-header-label-gray\" translate>share.tab.permalink</span>\n      </ng-template>\n      <gn-ui-data-view-permalink\n        [viewType]=\"viewType\"\n      ></gn-ui-data-view-permalink>\n    </mat-tab>\n    <mat-tab>\n      <ng-template mat-tab-label>\n        <span\n          [class]=\"\n            wcEmbedderBaseUrl\n              ? 'tab-header-label-gray'\n              : 'single-tab-header-label-gray'\n          \"\n          translate\n          >share.tab.webComponent</span\n        >\n      </ng-template>\n      <gn-ui-data-view-web-component\n        [viewType]=\"viewType\"\n      ></gn-ui-data-view-web-component>\n    </mat-tab>\n  </mat-tab-group>\n</div>\n", styles: ["::ng-deep .mat-mdc-tab.mdc-tab.mdc-tab--active .tab-header-label-gray{opacity:100%;font-weight:700}.tab-header-label-gray{@apply text-sm text-gray-700 opacity-75 hover:text-gray-900;}.single-tab-header-label-gray{@apply text-sm text-gray-900;}\n"], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$5.MatTabLabel, selector: "[mat-tab-label], [matTabLabel]" }, { kind: "component", type: i2$5.MatTab, selector: "mat-tab", inputs: ["disabled"], exportAs: ["matTab"] }, { kind: "component", type: i2$5.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple", "fitInkBarToContent", "mat-stretch-tabs"], exportAs: ["matTabGroup"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: DataViewPermalinkComponent, selector: "gn-ui-data-view-permalink", inputs: ["viewType"] }, { kind: "component", type: DataViewWebComponentComponent, selector: "gn-ui-data-view-web-component", inputs: ["viewType"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataViewShareComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-data-view-share', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"container-lg px-5 my-1 lg:mx-auto\">\n  <mat-tab-group\n    [selectedIndex]=\"0\"\n    animationDuration=\"0ms\"\n    mat-stretch-tabs=\"false\"\n    mat-align-tabs=\"start\"\n    [disableRipple]=\"!wcEmbedderBaseUrl\"\n  >\n    <mat-tab *ngIf=\"wcEmbedderBaseUrl\">\n      <ng-template mat-tab-label>\n        <span class=\"tab-header-label-gray\" translate>share.tab.permalink</span>\n      </ng-template>\n      <gn-ui-data-view-permalink></gn-ui-data-view-permalink>\n    </mat-tab>\n    <mat-tab>\n      <ng-template mat-tab-label>\n        <span\n          [class]=\"\n            wcEmbedderBaseUrl\n              ? 'tab-header-label-gray'\n              : 'single-tab-header-label-gray'\n          \"\n          translate\n          >share.tab.webComponent</span\n        >\n      </ng-template>\n      <gn-ui-data-view-web-component></gn-ui-data-view-web-component>\n    </mat-tab>\n  </mat-tab-group>\n</div>\n", styles: ["::ng-deep .mat-mdc-tab.mdc-tab.mdc-tab--active .tab-header-label-gray{opacity:100%;font-weight:700}.tab-header-label-gray{@apply text-sm text-gray-700 opacity-75 hover:text-gray-900;}.single-tab-header-label-gray{@apply text-sm text-gray-900;}\n"] }]
+            args: [{ selector: 'gn-ui-data-view-share', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"container-lg px-5 my-1 lg:mx-auto\">\n  <mat-tab-group\n    [selectedIndex]=\"0\"\n    animationDuration=\"0ms\"\n    mat-stretch-tabs=\"false\"\n    mat-align-tabs=\"start\"\n    [disableRipple]=\"!wcEmbedderBaseUrl\"\n  >\n    <mat-tab *ngIf=\"wcEmbedderBaseUrl\">\n      <ng-template mat-tab-label>\n        <span class=\"tab-header-label-gray\" translate>share.tab.permalink</span>\n      </ng-template>\n      <gn-ui-data-view-permalink\n        [viewType]=\"viewType\"\n      ></gn-ui-data-view-permalink>\n    </mat-tab>\n    <mat-tab>\n      <ng-template mat-tab-label>\n        <span\n          [class]=\"\n            wcEmbedderBaseUrl\n              ? 'tab-header-label-gray'\n              : 'single-tab-header-label-gray'\n          \"\n          translate\n          >share.tab.webComponent</span\n        >\n      </ng-template>\n      <gn-ui-data-view-web-component\n        [viewType]=\"viewType\"\n      ></gn-ui-data-view-web-component>\n    </mat-tab>\n  </mat-tab-group>\n</div>\n", styles: ["::ng-deep .mat-mdc-tab.mdc-tab.mdc-tab--active .tab-header-label-gray{opacity:100%;font-weight:700}.tab-header-label-gray{@apply text-sm text-gray-700 opacity-75 hover:text-gray-900;}.single-tab-header-label-gray{@apply text-sm text-gray-900;}\n"] }]
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Optional
                 }, {
                     type: Inject,
                     args: [WEB_COMPONENT_EMBEDDER_URL]
-                }] }]; } });
+                }] }]; }, propDecorators: { viewType: [{
+                type: Input
+            }] } });
 
 class FeatureRecordModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FeatureRecordModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }