geonetwork-ui 2.8.0-dev.57b8934c5 → 2.8.0-dev.5b3b50fcc
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/geonetwork-ui.mjs +9 -9
- package/fesm2022/geonetwork-ui.mjs.map +1 -1
- package/index.d.ts.map +1 -1
- package/package.json +5 -5
- package/src/libs/ui/elements/src/lib/internal-link-card/internal-link-card.component.html +2 -1
- package/src/libs/ui/elements/src/lib/markdown-parser/markdown-parser.component.ts +1 -0
- package/src/libs/ui/layout/src/lib/block-list/block-list.component.html +1 -1
|
@@ -25511,7 +25511,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
25511
25511
|
}] } });
|
|
25512
25512
|
|
|
25513
25513
|
var name = "geonetwork-ui";
|
|
25514
|
-
var version = "2.8.0-dev.
|
|
25514
|
+
var version = "2.8.0-dev.5b3b50fcc";
|
|
25515
25515
|
var engines = {
|
|
25516
25516
|
node: ">=20"
|
|
25517
25517
|
};
|
|
@@ -25552,10 +25552,10 @@ var peerDependencies = {
|
|
|
25552
25552
|
var dependencies = {
|
|
25553
25553
|
"@biesbjerg/ngx-translate-extract-marker": "~1.0.0",
|
|
25554
25554
|
"@camptocamp/ogc-client": "1.3.1-dev.1d137ae",
|
|
25555
|
-
"@geospatial-sdk/core": "0.0.5-dev.
|
|
25556
|
-
"@geospatial-sdk/geocoding": "0.0.5-dev.
|
|
25557
|
-
"@geospatial-sdk/legend": "0.0.5-dev.
|
|
25558
|
-
"@geospatial-sdk/openlayers": "0.0.5-dev.
|
|
25555
|
+
"@geospatial-sdk/core": "0.0.5-dev.42",
|
|
25556
|
+
"@geospatial-sdk/geocoding": "0.0.5-dev.42",
|
|
25557
|
+
"@geospatial-sdk/legend": "0.0.5-dev.42",
|
|
25558
|
+
"@geospatial-sdk/openlayers": "0.0.5-dev.42",
|
|
25559
25559
|
"@ltd/j-toml": "~1.35.2",
|
|
25560
25560
|
"@messageformat/core": "^3.0.1",
|
|
25561
25561
|
"@ng-icons/core": "29.10.0",
|
|
@@ -31217,11 +31217,11 @@ class BlockListComponent {
|
|
|
31217
31217
|
this.goToPage(this.currentPage + 1);
|
|
31218
31218
|
}
|
|
31219
31219
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: BlockListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
31220
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: BlockListComponent, isStandalone: true, selector: "gn-ui-block-list", inputs: { containerClass: "containerClass", paginationContainerClass: "paginationContainerClass" }, outputs: { listChanges: "listChanges" }, host: { listeners: { "window:resize": "onResize()" } }, queries: [{ propertyName: "blocks", predicate: ["block"], read: ElementRef }], viewQueries: [{ propertyName: "blockContainer", first: true, predicate: ["blockContainer"], descendants: true }], ngImport: i0, template: "<div\n class=\"grid gap-4 w-full
|
|
31220
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: BlockListComponent, isStandalone: true, selector: "gn-ui-block-list", inputs: { containerClass: "containerClass", paginationContainerClass: "paginationContainerClass" }, outputs: { listChanges: "listChanges" }, host: { listeners: { "window:resize": "onResize()" } }, queries: [{ propertyName: "blocks", predicate: ["block"], read: ElementRef }], viewQueries: [{ propertyName: "blockContainer", first: true, predicate: ["blockContainer"], descendants: true }], ngImport: i0, template: "<div\n class=\"grid gap-4 w-full sm:grid-cols-2\"\n #blockContainer\n [ngClass]=\"[containerClass, 'size-' + subComponentSize]\"\n>\n <ng-content></ng-content>\n</div>\n<gn-ui-pagination-dots\n [containerClass]=\"'absolute ' + paginationContainerClass\"\n [listComponent]=\"this\"\n></gn-ui-pagination-dots>\n", styles: [":host .block-list-container ::ng-deep>*{flex-shrink:0}:host{position:relative}@media screen and (min-width: 769px){.size-L{grid-template-columns:repeat(1,minmax(0,1fr));grid-auto-rows:minmax(0,min-content)}.size-M{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(0,min-content)}.size-S{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:minmax(0,min-content)}.size-XS{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(0,min-content)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: PaginationDotsComponent, selector: "gn-ui-pagination-dots", inputs: ["listComponent", "containerClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
31221
31221
|
}
|
|
31222
31222
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: BlockListComponent, decorators: [{
|
|
31223
31223
|
type: Component,
|
|
31224
|
-
args: [{ selector: 'gn-ui-block-list', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, PaginationDotsComponent], template: "<div\n class=\"grid gap-4 w-full
|
|
31224
|
+
args: [{ selector: 'gn-ui-block-list', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, PaginationDotsComponent], template: "<div\n class=\"grid gap-4 w-full sm:grid-cols-2\"\n #blockContainer\n [ngClass]=\"[containerClass, 'size-' + subComponentSize]\"\n>\n <ng-content></ng-content>\n</div>\n<gn-ui-pagination-dots\n [containerClass]=\"'absolute ' + paginationContainerClass\"\n [listComponent]=\"this\"\n></gn-ui-pagination-dots>\n", styles: [":host .block-list-container ::ng-deep>*{flex-shrink:0}:host{position:relative}@media screen and (min-width: 769px){.size-L{grid-template-columns:repeat(1,minmax(0,1fr));grid-auto-rows:minmax(0,min-content)}.size-M{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(0,min-content)}.size-S{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:minmax(0,min-content)}.size-XS{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(0,min-content)}}\n"] }]
|
|
31225
31225
|
}], propDecorators: { containerClass: [{
|
|
31226
31226
|
type: Input
|
|
31227
31227
|
}], paginationContainerClass: [{
|
|
@@ -34737,7 +34737,7 @@ class InternalLinkCardComponent {
|
|
|
34737
34737
|
provideNgIconsConfig({
|
|
34738
34738
|
size: '1.2em',
|
|
34739
34739
|
}),
|
|
34740
|
-
], ngImport: i0, template: "<a\n [attr.href]=\"linkHref\"\n [target]=\"linkTarget\"\n class=\"record-card\"\n [ngClass]=\"cardClass\"\n>\n @if (shouldShowThumbnail) {\n <div class=\"record-card__thumbnail\">\n <gn-ui-thumbnail\n class=\"w-full h-full object-cover\"\n [thumbnailUrl]=\"record.overviews?.[0]?.url?.toString() || ''\"\n [fit]=\"'cover'\"\n ></gn-ui-thumbnail>\n </div>\n }\n <div class=\"grow pt-1\" [ngClass]=\"shouldShowThumbnail ? 'sm:w-0' : ''\">\n <div class=\"flex flex-col gap-2 h-full\">\n <h4\n class=\"record-card__title\"\n data-cy=\"recordTitle\"\n [title]=\"record.title\"\n >\n {{ record.title }}\n </h4>\n <div class=\"grow\">\n <gn-ui-markdown-parser\n data-cy=\"recordAbstract\"\n [textContent]=\"abstract\"\n [whitoutStyles]=\"true\"\n class=\"record-card__abstract\"\n [title]=\"abstract\"\n ></gn-ui-markdown-parser>\n </div>\n <div class=\"record-card__footer\">\n @if (record.ownerOrganization?.name) {\n <div\n data-cy=\"recordOrg\"\n class=\"grow flex flex-row gap-1 items-center text-primary-lighter\"\n [ngClass]=\"displayContactIconOnly ? 'justify-center' : ''\"\n >\n <ng-icon\n name=\"iconoirBank\"\n class=\"text-primary -translate-y-[0.5px] shrink-0\"\n [title]=\"record.ownerOrganization.name\"\n ></ng-icon>\n @if (!displayContactIconOnly) {\n <span\n data-cy=\"recordOrgName\"\n class=\"line-clamp-1\"\n [title]=\"record.ownerOrganization.name\"\n >{{ record.ownerOrganization.name }}</span\n >\n }\n </div>\n }\n <div class=\"record-card__footer__other\">\n <div\n class=\"xs:border-r last:border-r-0 flex grow gap-4 px-4 last:pr-0\"\n >\n <gn-ui-kind-badge\n [extraClass]=\"'text-[1.2em]'\"\n [styling]=\"'gray'\"\n [kind]=\"record?.kind\"\n [contentTemplate]=\"customTemplate\"\n class=\"pt-1\"\n >\n <ng-template #customTemplate></ng-template\n ></gn-ui-kind-badge>\n @if (metadataQualityDisplay) {\n <gn-ui-metadata-quality\n class=\"flex items-center min-w-[113px]\"\n [smaller]=\"true\"\n [metadata]=\"record\"\n [metadataQualityDisplay]=\"metadataQualityDisplay\"\n [popoverDisplay]=\"true\"\n ></gn-ui-metadata-quality>\n }\n </div>\n <div\n class=\"flex justify-center\"\n data-cy=\"recordFav\"\n [ngClass]=\"displayContactIconOnly ? 'px-1' : 'px-4'\"\n >\n <ng-container\n [ngTemplateOutlet]=\"favoriteTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: record }\"\n ></ng-container>\n </div>\n </div>\n </div>\n </div>\n </div>\n</a>\n", styles: [".record-card{@apply rounded-md bg-white hover:cursor-pointer hover:bg-slate-50 overflow-hidden items-stretch flex flex-row md:gap-0 justify-between py-3 pl-3 pr-5;}.record-card.size-L{@apply w-full md:h-[208px] gap-5;}.record-card.size-M{@apply max-w-[940px] md:h-[231px] gap-4;}.record-card.size-S{@apply max-w-[572px] md:h-[315px] gap-4;}.record-card.size-XS{@apply max-w-[280px] md:h-[315px] gap-4;}.record-card:hover .record-card__title{@apply text-primary;}.record-card__thumbnail{@apply border rounded-lg overflow-hidden shrink-0;}.size-L .record-card__thumbnail{@apply w-full w-[190px] h-[184px];}.size-M .record-card__thumbnail{@apply w-full w-[138px] h-[207px];}.record-card__title{@apply text-xl font-medium text-title leading-6;}.size-L .record-card__title{@apply line-clamp-2;}.size-M .record-card__title{@apply line-clamp-2 ml-2;}.size-S .record-card__title,.size-XS .record-card__title{@apply line-clamp-3 ml-2;}.record-card__abstract{@apply text-gray-900 overflow-hidden;}.size-L .record-card__abstract{@apply line-clamp-3;}.size-M .record-card__abstract{@apply line-clamp-3 ml-2;}.size-S .record-card__abstract,.size-XS .record-card__abstract{@apply line-clamp-4 ml-2;}.record-card__footer{@apply flex sm:flex-row flex-col flex-nowrap gap-3 justify-end items-center w-full border-t pt-1 overflow-hidden;}@media (max-width: 450px){.size-S .record-card__footer{@apply flex-col items-stretch;}}.size-XS .record-card__footer{@apply flex-col items-stretch gap-2;}.record-card__footer__other{@apply flex flex-col xs:flex-row flex-nowrap gap-3 xs:border-l first:border-l-0;}.record-card__footer__other>div{@apply py-1;}@media (max-width: 450px){.size-S .record-card__footer__other,.size-S .record-card__footer__other>div{@apply border-0 px-0 py-0;}}.size-XS .record-card__footer__other,.size-XS .record-card__footer__other>div{@apply border-0;}.size-XS .record-card__footer__other>div{@apply px-0 py-0;}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: MetadataQualityComponent, selector: "gn-ui-metadata-quality", inputs: ["metadata", "smaller", "metadataQualityDisplay", "popoverDisplay", "propsToValidate", "forceComputeScore"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: KindBadgeComponent, selector: "gn-ui-kind-badge", inputs: ["styling", "contentTemplate", "kind", "extraClass"] }, { kind: "component", type: MarkdownParserComponent, selector: "gn-ui-markdown-parser", inputs: ["textContent", "whitoutStyles"] }, { kind: "component", type: ThumbnailComponent, selector: "gn-ui-thumbnail", inputs: ["thumbnailUrl", "fit"], outputs: ["placeholderShown"] }] }); }
|
|
34740
|
+
], ngImport: i0, template: "<a\n [attr.href]=\"linkHref\"\n [target]=\"linkTarget\"\n class=\"record-card\"\n [ngClass]=\"cardClass\"\n>\n @if (shouldShowThumbnail) {\n <div class=\"record-card__thumbnail\">\n <gn-ui-thumbnail\n class=\"w-full h-full object-cover\"\n [thumbnailUrl]=\"record.overviews?.[0]?.url?.toString() || ''\"\n [fit]=\"'cover'\"\n ></gn-ui-thumbnail>\n </div>\n }\n <div class=\"grow pt-1\" [ngClass]=\"shouldShowThumbnail ? 'sm:w-0' : ''\">\n <div class=\"flex flex-col gap-2 h-full\">\n <h4\n class=\"record-card__title\"\n data-cy=\"recordTitle\"\n [title]=\"record.title\"\n >\n {{ record.title }}\n </h4>\n <!-- force max width here as long a-href urls within the markdown parser can cause layout issues -->\n <div class=\"grow max-w-[248px] sm:max-w-full\">\n <gn-ui-markdown-parser\n data-cy=\"recordAbstract\"\n [textContent]=\"abstract\"\n [whitoutStyles]=\"true\"\n class=\"record-card__abstract\"\n [title]=\"abstract\"\n ></gn-ui-markdown-parser>\n </div>\n <div class=\"record-card__footer\">\n @if (record.ownerOrganization?.name) {\n <div\n data-cy=\"recordOrg\"\n class=\"grow flex flex-row gap-1 items-center text-primary-lighter\"\n [ngClass]=\"displayContactIconOnly ? 'justify-center' : ''\"\n >\n <ng-icon\n name=\"iconoirBank\"\n class=\"text-primary -translate-y-[0.5px] shrink-0\"\n [title]=\"record.ownerOrganization.name\"\n ></ng-icon>\n @if (!displayContactIconOnly) {\n <span\n data-cy=\"recordOrgName\"\n class=\"line-clamp-1\"\n [title]=\"record.ownerOrganization.name\"\n >{{ record.ownerOrganization.name }}</span\n >\n }\n </div>\n }\n <div class=\"record-card__footer__other\">\n <div\n class=\"xs:border-r last:border-r-0 flex grow gap-4 px-4 last:pr-0\"\n >\n <gn-ui-kind-badge\n [extraClass]=\"'text-[1.2em]'\"\n [styling]=\"'gray'\"\n [kind]=\"record?.kind\"\n [contentTemplate]=\"customTemplate\"\n class=\"pt-1\"\n >\n <ng-template #customTemplate></ng-template\n ></gn-ui-kind-badge>\n @if (metadataQualityDisplay) {\n <gn-ui-metadata-quality\n class=\"flex items-center min-w-[113px]\"\n [smaller]=\"true\"\n [metadata]=\"record\"\n [metadataQualityDisplay]=\"metadataQualityDisplay\"\n [popoverDisplay]=\"true\"\n ></gn-ui-metadata-quality>\n }\n </div>\n <div\n class=\"flex justify-center\"\n data-cy=\"recordFav\"\n [ngClass]=\"displayContactIconOnly ? 'px-1' : 'px-4'\"\n >\n <ng-container\n [ngTemplateOutlet]=\"favoriteTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: record }\"\n ></ng-container>\n </div>\n </div>\n </div>\n </div>\n </div>\n</a>\n", styles: [".record-card{@apply rounded-md bg-white hover:cursor-pointer hover:bg-slate-50 overflow-hidden items-stretch flex flex-row md:gap-0 justify-between py-3 pl-3 pr-5;}.record-card.size-L{@apply w-full md:h-[208px] gap-5;}.record-card.size-M{@apply max-w-[940px] md:h-[231px] gap-4;}.record-card.size-S{@apply max-w-[572px] md:h-[315px] gap-4;}.record-card.size-XS{@apply max-w-[280px] md:h-[315px] gap-4;}.record-card:hover .record-card__title{@apply text-primary;}.record-card__thumbnail{@apply border rounded-lg overflow-hidden shrink-0;}.size-L .record-card__thumbnail{@apply w-full w-[190px] h-[184px];}.size-M .record-card__thumbnail{@apply w-full w-[138px] h-[207px];}.record-card__title{@apply text-xl font-medium text-title leading-6;}.size-L .record-card__title{@apply line-clamp-2;}.size-M .record-card__title{@apply line-clamp-2 ml-2;}.size-S .record-card__title,.size-XS .record-card__title{@apply line-clamp-3 ml-2;}.record-card__abstract{@apply text-gray-900 overflow-hidden;}.size-L .record-card__abstract{@apply line-clamp-3;}.size-M .record-card__abstract{@apply line-clamp-3 ml-2;}.size-S .record-card__abstract,.size-XS .record-card__abstract{@apply line-clamp-4 ml-2;}.record-card__footer{@apply flex sm:flex-row flex-col flex-nowrap gap-3 justify-end items-center w-full border-t pt-1 overflow-hidden;}@media (max-width: 450px){.size-S .record-card__footer{@apply flex-col items-stretch;}}.size-XS .record-card__footer{@apply flex-col items-stretch gap-2;}.record-card__footer__other{@apply flex flex-col xs:flex-row flex-nowrap gap-3 xs:border-l first:border-l-0;}.record-card__footer__other>div{@apply py-1;}@media (max-width: 450px){.size-S .record-card__footer__other,.size-S .record-card__footer__other>div{@apply border-0 px-0 py-0;}}.size-XS .record-card__footer__other,.size-XS .record-card__footer__other>div{@apply border-0;}.size-XS .record-card__footer__other>div{@apply px-0 py-0;}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: MetadataQualityComponent, selector: "gn-ui-metadata-quality", inputs: ["metadata", "smaller", "metadataQualityDisplay", "popoverDisplay", "propsToValidate", "forceComputeScore"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: KindBadgeComponent, selector: "gn-ui-kind-badge", inputs: ["styling", "contentTemplate", "kind", "extraClass"] }, { kind: "component", type: MarkdownParserComponent, selector: "gn-ui-markdown-parser", inputs: ["textContent", "whitoutStyles"] }, { kind: "component", type: ThumbnailComponent, selector: "gn-ui-thumbnail", inputs: ["thumbnailUrl", "fit"], outputs: ["placeholderShown"] }] }); }
|
|
34741
34741
|
}
|
|
34742
34742
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: InternalLinkCardComponent, decorators: [{
|
|
34743
34743
|
type: Component,
|
|
@@ -34757,7 +34757,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
34757
34757
|
provideNgIconsConfig({
|
|
34758
34758
|
size: '1.2em',
|
|
34759
34759
|
}),
|
|
34760
|
-
], template: "<a\n [attr.href]=\"linkHref\"\n [target]=\"linkTarget\"\n class=\"record-card\"\n [ngClass]=\"cardClass\"\n>\n @if (shouldShowThumbnail) {\n <div class=\"record-card__thumbnail\">\n <gn-ui-thumbnail\n class=\"w-full h-full object-cover\"\n [thumbnailUrl]=\"record.overviews?.[0]?.url?.toString() || ''\"\n [fit]=\"'cover'\"\n ></gn-ui-thumbnail>\n </div>\n }\n <div class=\"grow pt-1\" [ngClass]=\"shouldShowThumbnail ? 'sm:w-0' : ''\">\n <div class=\"flex flex-col gap-2 h-full\">\n <h4\n class=\"record-card__title\"\n data-cy=\"recordTitle\"\n [title]=\"record.title\"\n >\n {{ record.title }}\n </h4>\n <div class=\"grow\">\n <gn-ui-markdown-parser\n data-cy=\"recordAbstract\"\n [textContent]=\"abstract\"\n [whitoutStyles]=\"true\"\n class=\"record-card__abstract\"\n [title]=\"abstract\"\n ></gn-ui-markdown-parser>\n </div>\n <div class=\"record-card__footer\">\n @if (record.ownerOrganization?.name) {\n <div\n data-cy=\"recordOrg\"\n class=\"grow flex flex-row gap-1 items-center text-primary-lighter\"\n [ngClass]=\"displayContactIconOnly ? 'justify-center' : ''\"\n >\n <ng-icon\n name=\"iconoirBank\"\n class=\"text-primary -translate-y-[0.5px] shrink-0\"\n [title]=\"record.ownerOrganization.name\"\n ></ng-icon>\n @if (!displayContactIconOnly) {\n <span\n data-cy=\"recordOrgName\"\n class=\"line-clamp-1\"\n [title]=\"record.ownerOrganization.name\"\n >{{ record.ownerOrganization.name }}</span\n >\n }\n </div>\n }\n <div class=\"record-card__footer__other\">\n <div\n class=\"xs:border-r last:border-r-0 flex grow gap-4 px-4 last:pr-0\"\n >\n <gn-ui-kind-badge\n [extraClass]=\"'text-[1.2em]'\"\n [styling]=\"'gray'\"\n [kind]=\"record?.kind\"\n [contentTemplate]=\"customTemplate\"\n class=\"pt-1\"\n >\n <ng-template #customTemplate></ng-template\n ></gn-ui-kind-badge>\n @if (metadataQualityDisplay) {\n <gn-ui-metadata-quality\n class=\"flex items-center min-w-[113px]\"\n [smaller]=\"true\"\n [metadata]=\"record\"\n [metadataQualityDisplay]=\"metadataQualityDisplay\"\n [popoverDisplay]=\"true\"\n ></gn-ui-metadata-quality>\n }\n </div>\n <div\n class=\"flex justify-center\"\n data-cy=\"recordFav\"\n [ngClass]=\"displayContactIconOnly ? 'px-1' : 'px-4'\"\n >\n <ng-container\n [ngTemplateOutlet]=\"favoriteTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: record }\"\n ></ng-container>\n </div>\n </div>\n </div>\n </div>\n </div>\n</a>\n", styles: [".record-card{@apply rounded-md bg-white hover:cursor-pointer hover:bg-slate-50 overflow-hidden items-stretch flex flex-row md:gap-0 justify-between py-3 pl-3 pr-5;}.record-card.size-L{@apply w-full md:h-[208px] gap-5;}.record-card.size-M{@apply max-w-[940px] md:h-[231px] gap-4;}.record-card.size-S{@apply max-w-[572px] md:h-[315px] gap-4;}.record-card.size-XS{@apply max-w-[280px] md:h-[315px] gap-4;}.record-card:hover .record-card__title{@apply text-primary;}.record-card__thumbnail{@apply border rounded-lg overflow-hidden shrink-0;}.size-L .record-card__thumbnail{@apply w-full w-[190px] h-[184px];}.size-M .record-card__thumbnail{@apply w-full w-[138px] h-[207px];}.record-card__title{@apply text-xl font-medium text-title leading-6;}.size-L .record-card__title{@apply line-clamp-2;}.size-M .record-card__title{@apply line-clamp-2 ml-2;}.size-S .record-card__title,.size-XS .record-card__title{@apply line-clamp-3 ml-2;}.record-card__abstract{@apply text-gray-900 overflow-hidden;}.size-L .record-card__abstract{@apply line-clamp-3;}.size-M .record-card__abstract{@apply line-clamp-3 ml-2;}.size-S .record-card__abstract,.size-XS .record-card__abstract{@apply line-clamp-4 ml-2;}.record-card__footer{@apply flex sm:flex-row flex-col flex-nowrap gap-3 justify-end items-center w-full border-t pt-1 overflow-hidden;}@media (max-width: 450px){.size-S .record-card__footer{@apply flex-col items-stretch;}}.size-XS .record-card__footer{@apply flex-col items-stretch gap-2;}.record-card__footer__other{@apply flex flex-col xs:flex-row flex-nowrap gap-3 xs:border-l first:border-l-0;}.record-card__footer__other>div{@apply py-1;}@media (max-width: 450px){.size-S .record-card__footer__other,.size-S .record-card__footer__other>div{@apply border-0 px-0 py-0;}}.size-XS .record-card__footer__other,.size-XS .record-card__footer__other>div{@apply border-0;}.size-XS .record-card__footer__other>div{@apply px-0 py-0;}\n"] }]
|
|
34760
|
+
], template: "<a\n [attr.href]=\"linkHref\"\n [target]=\"linkTarget\"\n class=\"record-card\"\n [ngClass]=\"cardClass\"\n>\n @if (shouldShowThumbnail) {\n <div class=\"record-card__thumbnail\">\n <gn-ui-thumbnail\n class=\"w-full h-full object-cover\"\n [thumbnailUrl]=\"record.overviews?.[0]?.url?.toString() || ''\"\n [fit]=\"'cover'\"\n ></gn-ui-thumbnail>\n </div>\n }\n <div class=\"grow pt-1\" [ngClass]=\"shouldShowThumbnail ? 'sm:w-0' : ''\">\n <div class=\"flex flex-col gap-2 h-full\">\n <h4\n class=\"record-card__title\"\n data-cy=\"recordTitle\"\n [title]=\"record.title\"\n >\n {{ record.title }}\n </h4>\n <!-- force max width here as long a-href urls within the markdown parser can cause layout issues -->\n <div class=\"grow max-w-[248px] sm:max-w-full\">\n <gn-ui-markdown-parser\n data-cy=\"recordAbstract\"\n [textContent]=\"abstract\"\n [whitoutStyles]=\"true\"\n class=\"record-card__abstract\"\n [title]=\"abstract\"\n ></gn-ui-markdown-parser>\n </div>\n <div class=\"record-card__footer\">\n @if (record.ownerOrganization?.name) {\n <div\n data-cy=\"recordOrg\"\n class=\"grow flex flex-row gap-1 items-center text-primary-lighter\"\n [ngClass]=\"displayContactIconOnly ? 'justify-center' : ''\"\n >\n <ng-icon\n name=\"iconoirBank\"\n class=\"text-primary -translate-y-[0.5px] shrink-0\"\n [title]=\"record.ownerOrganization.name\"\n ></ng-icon>\n @if (!displayContactIconOnly) {\n <span\n data-cy=\"recordOrgName\"\n class=\"line-clamp-1\"\n [title]=\"record.ownerOrganization.name\"\n >{{ record.ownerOrganization.name }}</span\n >\n }\n </div>\n }\n <div class=\"record-card__footer__other\">\n <div\n class=\"xs:border-r last:border-r-0 flex grow gap-4 px-4 last:pr-0\"\n >\n <gn-ui-kind-badge\n [extraClass]=\"'text-[1.2em]'\"\n [styling]=\"'gray'\"\n [kind]=\"record?.kind\"\n [contentTemplate]=\"customTemplate\"\n class=\"pt-1\"\n >\n <ng-template #customTemplate></ng-template\n ></gn-ui-kind-badge>\n @if (metadataQualityDisplay) {\n <gn-ui-metadata-quality\n class=\"flex items-center min-w-[113px]\"\n [smaller]=\"true\"\n [metadata]=\"record\"\n [metadataQualityDisplay]=\"metadataQualityDisplay\"\n [popoverDisplay]=\"true\"\n ></gn-ui-metadata-quality>\n }\n </div>\n <div\n class=\"flex justify-center\"\n data-cy=\"recordFav\"\n [ngClass]=\"displayContactIconOnly ? 'px-1' : 'px-4'\"\n >\n <ng-container\n [ngTemplateOutlet]=\"favoriteTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: record }\"\n ></ng-container>\n </div>\n </div>\n </div>\n </div>\n </div>\n</a>\n", styles: [".record-card{@apply rounded-md bg-white hover:cursor-pointer hover:bg-slate-50 overflow-hidden items-stretch flex flex-row md:gap-0 justify-between py-3 pl-3 pr-5;}.record-card.size-L{@apply w-full md:h-[208px] gap-5;}.record-card.size-M{@apply max-w-[940px] md:h-[231px] gap-4;}.record-card.size-S{@apply max-w-[572px] md:h-[315px] gap-4;}.record-card.size-XS{@apply max-w-[280px] md:h-[315px] gap-4;}.record-card:hover .record-card__title{@apply text-primary;}.record-card__thumbnail{@apply border rounded-lg overflow-hidden shrink-0;}.size-L .record-card__thumbnail{@apply w-full w-[190px] h-[184px];}.size-M .record-card__thumbnail{@apply w-full w-[138px] h-[207px];}.record-card__title{@apply text-xl font-medium text-title leading-6;}.size-L .record-card__title{@apply line-clamp-2;}.size-M .record-card__title{@apply line-clamp-2 ml-2;}.size-S .record-card__title,.size-XS .record-card__title{@apply line-clamp-3 ml-2;}.record-card__abstract{@apply text-gray-900 overflow-hidden;}.size-L .record-card__abstract{@apply line-clamp-3;}.size-M .record-card__abstract{@apply line-clamp-3 ml-2;}.size-S .record-card__abstract,.size-XS .record-card__abstract{@apply line-clamp-4 ml-2;}.record-card__footer{@apply flex sm:flex-row flex-col flex-nowrap gap-3 justify-end items-center w-full border-t pt-1 overflow-hidden;}@media (max-width: 450px){.size-S .record-card__footer{@apply flex-col items-stretch;}}.size-XS .record-card__footer{@apply flex-col items-stretch gap-2;}.record-card__footer__other{@apply flex flex-col xs:flex-row flex-nowrap gap-3 xs:border-l first:border-l-0;}.record-card__footer__other>div{@apply py-1;}@media (max-width: 450px){.size-S .record-card__footer__other,.size-S .record-card__footer__other>div{@apply border-0 px-0 py-0;}}.size-XS .record-card__footer__other,.size-XS .record-card__footer__other>div{@apply border-0;}.size-XS .record-card__footer__other>div{@apply px-0 py-0;}\n"] }]
|
|
34761
34761
|
}], propDecorators: { record: [{
|
|
34762
34762
|
type: Input
|
|
34763
34763
|
}], linkTarget: [{
|