npm - @aiconomy/aico-components - Versions diffs - 0.0.149 → 0.0.154 - Mend

@aiconomy/aico-components 0.0.149 → 0.0.154

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.

Files changed (30) hide show

package/dist/cjs/aico-components.cjs.js CHANGED Viewed

@@ -17,7 +17,7 @@ const patchBrowser = () => {
 };
 patchBrowser().then(options => {
-  return index.bootstrapLazy([["aico-asking-list-content.cjs",[[6,"aico-asking-list-content"]]],["aico-collection-content.cjs",[[6,"aico-collection-content"]]],["aico-album-content_26.cjs",[[2,"aico-fetch-article-detail",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"locale":[1],"hideDateAndAuthor":[4,"hide-date-and-author"],"hideCategoryAndTags":[4,"hide-category-and-tags"],"articleId":[1,"article-id"],"articleUrlHandle":[1,"article-url-handle"],"article":[32]}],[2,"aico-news-list",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"newsChannels":[1,"news-channels"],"newsSellerIds":[1,"news-seller-ids"],"newsBrandIds":[1,"news-brand-ids"],"newsLanguageLocales":[1,"news-language-locales"],"pageSize":[2,"page-size"],"nextButtonText":[1,"next-button-text"],"previousButtonText":[1,"previous-button-text"],"locale":[1],"highlightSpecialArticles":[4,"highlight-special-articles"],"newsResponse":[32],"pageNumber":[32],"newsChannelsArr":[32],"newsSellerIdsArr":[32],"newsBrandIdsArr":[32],"newsLanguageLocalesArr":[32]}],[2,"aico-special-news-carousel",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"newsChannels":[1,"news-channels"],"newsSellerIds":[1,"news-seller-ids"],"newsBrandIds":[1,"news-brand-ids"],"newsLanguageLocales":[1,"news-language-locales"],"numberOfArticles":[2,"number-of-articles"],"locale":[1],"newsResponse":[32],"newsChannelsArr":[32],"newsSellerIdsArr":[32],"newsBrandIdsArr":[32],"newsLanguageLocalesArr":[32]}],[2,"aico-article-detail",{"article":[16],"locale":[1],"hideDateAndAuthor":[4,"hide-date-and-author"],"hideCategoryAndTags":[4,"hide-category-and-tags"]}],[2,"aico-news-list-item",{"article":[16],"articleIndex":[2,"article-index"],"highlightSpecialArticle":[4,"highlight-special-article"],"locale":[1]}],[2,"aico-bullet-content",{"content":[16],"locale":[1]}],[2,"aico-carousel-content",{"content":[16],"hasArrows":[4,"has-arrows"],"locale":[1]}],[2,"aico-content-card-content",{"content":[16],"locale":[1]}],[2,"aico-heading-content",{"content":[16],"locale":[1]}],[2,"aico-table-content",{"content":[16],"locale":[1]}],[2,"aico-text-content",{"content":[16],"locale":[1]}],[2,"aico-upload-content",{"content":[16],"locale":[1]}],[2,"aico-video-content",{"content":[16],"locale":[1]}],[2,"aico-album-content",{"content":[16]}],[2,"aico-asking-content",{"content":[16],"locale":[1]}],[2,"aico-block-quote-content",{"content":[16],"locale":[1]}],[2,"aico-divider-content",{"content":[16],"locale":[1]}],[2,"aico-document-content",{"content":[16],"locale":[1]}],[2,"aico-faq-content",{"content":[16],"locale":[1]}],[2,"aico-html-content",{"content":[16],"locale":[1]}],[2,"aico-link-content",{"content":[16],"locale":[1]}],[2,"aico-news-content",{"content":[16]}],[2,"aico-page-content",{"content":[16],"locale":[1]}],[2,"aico-testimonial-content",{"content":[16]}],[2,"aico-title-content",{"content":[16],"locale":[1]}],[2,"aico-no-content"]]]], options);
+  return index.bootstrapLazy([["aico-asking-list-content.cjs",[[6,"aico-asking-list-content"]]],["aico-collection-content.cjs",[[6,"aico-collection-content"]]],["aico-album-content_26.cjs",[[2,"aico-fetch-article-detail",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"locale":[1],"hideDateAndAuthor":[4,"hide-date-and-author"],"hideCategoryAndTags":[4,"hide-category-and-tags"],"articleId":[1,"article-id"],"articleUrlHandle":[1,"article-url-handle"],"article":[32]}],[2,"aico-news-list",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"newsChannels":[1,"news-channels"],"newsSellerIds":[1,"news-seller-ids"],"newsBrandIds":[1,"news-brand-ids"],"newsLanguageLocales":[1,"news-language-locales"],"pageSize":[2,"page-size"],"nextButtonText":[1,"next-button-text"],"previousButtonText":[1,"previous-button-text"],"locale":[1],"highlightTopArticles":[4,"highlight-top-articles"],"newsResponse":[32],"pageNumber":[32],"newsChannelsArr":[32],"newsSellerIdsArr":[32],"newsBrandIdsArr":[32],"newsLanguageLocalesArr":[32]}],[2,"aico-special-news-carousel",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"newsChannels":[1,"news-channels"],"newsSellerIds":[1,"news-seller-ids"],"newsBrandIds":[1,"news-brand-ids"],"newsLanguageLocales":[1,"news-language-locales"],"numberOfArticles":[2,"number-of-articles"],"locale":[1],"newsResponse":[32],"newsChannelsArr":[32],"newsSellerIdsArr":[32],"newsBrandIdsArr":[32],"newsLanguageLocalesArr":[32]}],[2,"aico-article-detail",{"article":[16],"locale":[1],"hideDateAndAuthor":[4,"hide-date-and-author"],"hideCategoryAndTags":[4,"hide-category-and-tags"]}],[2,"aico-news-list-item",{"article":[16],"articleIndex":[2,"article-index"],"highlightTopArticle":[4,"highlight-top-article"],"locale":[1]}],[2,"aico-bullet-content",{"content":[16],"locale":[1]}],[2,"aico-carousel-content",{"content":[16],"hasArrows":[4,"has-arrows"],"locale":[1]}],[2,"aico-content-card-content",{"content":[16],"locale":[1]}],[2,"aico-heading-content",{"content":[16],"locale":[1]}],[2,"aico-table-content",{"content":[16],"locale":[1]}],[2,"aico-text-content",{"content":[16],"locale":[1]}],[2,"aico-upload-content",{"content":[16],"locale":[1]}],[2,"aico-video-content",{"content":[16],"locale":[1]}],[2,"aico-album-content",{"content":[16]}],[2,"aico-asking-content",{"content":[16],"locale":[1]}],[2,"aico-block-quote-content",{"content":[16],"locale":[1]}],[2,"aico-divider-content",{"content":[16],"locale":[1]}],[2,"aico-document-content",{"content":[16],"locale":[1]}],[2,"aico-faq-content",{"content":[16],"locale":[1]}],[2,"aico-html-content",{"content":[16],"locale":[1]}],[2,"aico-link-content",{"content":[16],"locale":[1]}],[2,"aico-news-content",{"content":[16]}],[2,"aico-page-content",{"content":[16],"locale":[1]}],[2,"aico-testimonial-content",{"content":[16]}],[2,"aico-title-content",{"content":[16],"locale":[1]}],[2,"aico-no-content"]]]], options);
 });
 exports.setNonce = index.setNonce;

package/dist/cjs/loader.cjs.js CHANGED Viewed

@@ -6,7 +6,7 @@ const index = require('./index-e52034b7.js');
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return undefined;
-  return index.bootstrapLazy([["aico-asking-list-content.cjs",[[6,"aico-asking-list-content"]]],["aico-collection-content.cjs",[[6,"aico-collection-content"]]],["aico-album-content_26.cjs",[[2,"aico-fetch-article-detail",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"locale":[1],"hideDateAndAuthor":[4,"hide-date-and-author"],"hideCategoryAndTags":[4,"hide-category-and-tags"],"articleId":[1,"article-id"],"articleUrlHandle":[1,"article-url-handle"],"article":[32]}],[2,"aico-news-list",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"newsChannels":[1,"news-channels"],"newsSellerIds":[1,"news-seller-ids"],"newsBrandIds":[1,"news-brand-ids"],"newsLanguageLocales":[1,"news-language-locales"],"pageSize":[2,"page-size"],"nextButtonText":[1,"next-button-text"],"previousButtonText":[1,"previous-button-text"],"locale":[1],"highlightSpecialArticles":[4,"highlight-special-articles"],"newsResponse":[32],"pageNumber":[32],"newsChannelsArr":[32],"newsSellerIdsArr":[32],"newsBrandIdsArr":[32],"newsLanguageLocalesArr":[32]}],[2,"aico-special-news-carousel",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"newsChannels":[1,"news-channels"],"newsSellerIds":[1,"news-seller-ids"],"newsBrandIds":[1,"news-brand-ids"],"newsLanguageLocales":[1,"news-language-locales"],"numberOfArticles":[2,"number-of-articles"],"locale":[1],"newsResponse":[32],"newsChannelsArr":[32],"newsSellerIdsArr":[32],"newsBrandIdsArr":[32],"newsLanguageLocalesArr":[32]}],[2,"aico-article-detail",{"article":[16],"locale":[1],"hideDateAndAuthor":[4,"hide-date-and-author"],"hideCategoryAndTags":[4,"hide-category-and-tags"]}],[2,"aico-news-list-item",{"article":[16],"articleIndex":[2,"article-index"],"highlightSpecialArticle":[4,"highlight-special-article"],"locale":[1]}],[2,"aico-bullet-content",{"content":[16],"locale":[1]}],[2,"aico-carousel-content",{"content":[16],"hasArrows":[4,"has-arrows"],"locale":[1]}],[2,"aico-content-card-content",{"content":[16],"locale":[1]}],[2,"aico-heading-content",{"content":[16],"locale":[1]}],[2,"aico-table-content",{"content":[16],"locale":[1]}],[2,"aico-text-content",{"content":[16],"locale":[1]}],[2,"aico-upload-content",{"content":[16],"locale":[1]}],[2,"aico-video-content",{"content":[16],"locale":[1]}],[2,"aico-album-content",{"content":[16]}],[2,"aico-asking-content",{"content":[16],"locale":[1]}],[2,"aico-block-quote-content",{"content":[16],"locale":[1]}],[2,"aico-divider-content",{"content":[16],"locale":[1]}],[2,"aico-document-content",{"content":[16],"locale":[1]}],[2,"aico-faq-content",{"content":[16],"locale":[1]}],[2,"aico-html-content",{"content":[16],"locale":[1]}],[2,"aico-link-content",{"content":[16],"locale":[1]}],[2,"aico-news-content",{"content":[16]}],[2,"aico-page-content",{"content":[16],"locale":[1]}],[2,"aico-testimonial-content",{"content":[16]}],[2,"aico-title-content",{"content":[16],"locale":[1]}],[2,"aico-no-content"]]]], options);
+  return index.bootstrapLazy([["aico-asking-list-content.cjs",[[6,"aico-asking-list-content"]]],["aico-collection-content.cjs",[[6,"aico-collection-content"]]],["aico-album-content_26.cjs",[[2,"aico-fetch-article-detail",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"locale":[1],"hideDateAndAuthor":[4,"hide-date-and-author"],"hideCategoryAndTags":[4,"hide-category-and-tags"],"articleId":[1,"article-id"],"articleUrlHandle":[1,"article-url-handle"],"article":[32]}],[2,"aico-news-list",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"newsChannels":[1,"news-channels"],"newsSellerIds":[1,"news-seller-ids"],"newsBrandIds":[1,"news-brand-ids"],"newsLanguageLocales":[1,"news-language-locales"],"pageSize":[2,"page-size"],"nextButtonText":[1,"next-button-text"],"previousButtonText":[1,"previous-button-text"],"locale":[1],"highlightTopArticles":[4,"highlight-top-articles"],"newsResponse":[32],"pageNumber":[32],"newsChannelsArr":[32],"newsSellerIdsArr":[32],"newsBrandIdsArr":[32],"newsLanguageLocalesArr":[32]}],[2,"aico-special-news-carousel",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"newsChannels":[1,"news-channels"],"newsSellerIds":[1,"news-seller-ids"],"newsBrandIds":[1,"news-brand-ids"],"newsLanguageLocales":[1,"news-language-locales"],"numberOfArticles":[2,"number-of-articles"],"locale":[1],"newsResponse":[32],"newsChannelsArr":[32],"newsSellerIdsArr":[32],"newsBrandIdsArr":[32],"newsLanguageLocalesArr":[32]}],[2,"aico-article-detail",{"article":[16],"locale":[1],"hideDateAndAuthor":[4,"hide-date-and-author"],"hideCategoryAndTags":[4,"hide-category-and-tags"]}],[2,"aico-news-list-item",{"article":[16],"articleIndex":[2,"article-index"],"highlightTopArticle":[4,"highlight-top-article"],"locale":[1]}],[2,"aico-bullet-content",{"content":[16],"locale":[1]}],[2,"aico-carousel-content",{"content":[16],"hasArrows":[4,"has-arrows"],"locale":[1]}],[2,"aico-content-card-content",{"content":[16],"locale":[1]}],[2,"aico-heading-content",{"content":[16],"locale":[1]}],[2,"aico-table-content",{"content":[16],"locale":[1]}],[2,"aico-text-content",{"content":[16],"locale":[1]}],[2,"aico-upload-content",{"content":[16],"locale":[1]}],[2,"aico-video-content",{"content":[16],"locale":[1]}],[2,"aico-album-content",{"content":[16]}],[2,"aico-asking-content",{"content":[16],"locale":[1]}],[2,"aico-block-quote-content",{"content":[16],"locale":[1]}],[2,"aico-divider-content",{"content":[16],"locale":[1]}],[2,"aico-document-content",{"content":[16],"locale":[1]}],[2,"aico-faq-content",{"content":[16],"locale":[1]}],[2,"aico-html-content",{"content":[16],"locale":[1]}],[2,"aico-link-content",{"content":[16],"locale":[1]}],[2,"aico-news-content",{"content":[16]}],[2,"aico-page-content",{"content":[16],"locale":[1]}],[2,"aico-testimonial-content",{"content":[16]}],[2,"aico-title-content",{"content":[16],"locale":[1]}],[2,"aico-no-content"]]]], options);
 };
 exports.setNonce = index.setNonce;

package/dist/collection/components/aico-news-list/aico-news-list.js CHANGED Viewed

@@ -18,7 +18,7 @@ export class AicoNewsList {
         this.nextButtonText = 'Next';
         this.previousButtonText = 'Previous';
         this.locale = 'de';
-        this.highlightSpecialArticles = false;
+        this.highlightTopArticles = false;
     }
     connectedCallback() {
         this.newsListFetchController = new AbortController();
@@ -42,11 +42,11 @@ export class AicoNewsList {
     render() {
         var _a, _b, _c;
         return (h(Host, null, h("div", { class: "newslist-grid-container mb-4" }, (_a = this.newsResponse) === null || _a === void 0 ? void 0 : _a.data.map((article, articleIndex) => {
-            return (h("div", { class: `col ${this.highlightSpecialArticles && article.attributes.isSpecialArticle ? 'row-span-2 col-span-md-2' : ''}` }, h("aico-news-list-item", { article: article, articleIndex: articleIndex, onArticleClick: e => {
+            return (h("div", { class: `col ${this.highlightTopArticles && article.attributes.isTopNews ? 'row-span-2 col-span-md-2' : ''}` }, h("aico-news-list-item", { article: article, articleIndex: articleIndex, onArticleClick: e => {
                     var _a;
                     (_a = this.articleClick) === null || _a === void 0 ? void 0 : _a.emit(e.detail);
                     e.stopPropagation();
-                }, locale: this.locale })));
+                }, locale: this.locale, highlightTopArticle: this.highlightTopArticles })));
         })), h("nav", { class: "w-100", "aria-label": "News navigation" }, h("ul", { class: "pagination justify-content-center" }, h("li", { class: `page-item page-link user-select-none d-flex align-items-center ${!((_b = this.newsResponse) === null || _b === void 0 ? void 0 : _b.links.prev) ? 'disabled' : ''}`, style: { cursor: 'pointer' }, onClick: () => {
                 if (this.pageNumber > 1) {
                     this.pageNumber -= 1;
@@ -284,7 +284,7 @@ export class AicoNewsList {
                 "reflect": false,
                 "defaultValue": "'de'"
             },
-            "highlightSpecialArticles": {
+            "highlightTopArticles": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -296,9 +296,9 @@ export class AicoNewsList {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Determines if the special articles are highlighted by taking more space."
+                    "text": "Determines if the top articles are highlighted by taking more space."
                 },
-                "attribute": "highlight-special-articles",
+                "attribute": "highlight-top-articles",
                 "reflect": false,
                 "defaultValue": "false"
             }

package/dist/collection/components/aico-news-list/aico-news-list.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"aico-news-list.js","sourceRoot":"","sources":["../../../src/components/aico-news-list/aico-news-list.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, EventEmitter, Host, Prop, State, h } from '@stencil/core';\nimport { fetchNewsArticles, splitByComma } from '../../utils/utils';\nimport { NewsResponse } from '../../model/NewsResponse';\nimport { AicoApiRequestInfo } from '../../model/AicoApiRequestInfo';\nimport { Article } from '../../model/Article';\n\n@Component({\n tag: 'aico-news-list',\n styleUrl: 'aico-news-list.css',\n scoped: true,\n})\nexport class AicoNewsList {\n @State() newsResponse?: NewsResponse;\n\n @State() pageNumber = 1;\n\n @State() newsChannelsArr: string[] = [];\n\n @State() newsSellerIdsArr: string[] = [];\n\n @State() newsBrandIdsArr: string[] = [];\n\n @State() newsLanguageLocalesArr: string[] = [];\n\n /*\n The url of the Aico Api that will be used to retrieve the article.\n /\n @Prop() aicoUrl!: string;\n\n /\n The token used to authenticate against he Aico Api.\n /\n @Prop() aicoBearerToken!: string;\n\n /\n Channel names as a comma separated list used to filter the results.\n /\n @Prop() newsChannels: string = '';\n\n /\n Seller ids as a comma separated list used to filter the results.\n /\n @Prop() newsSellerIds: string = '';\n\n /\n Brand ids as a comma separated list used to filter the results.\n /\n @Prop() newsBrandIds: string = '';\n\n /\n Language locales as a comma separated list used to filter the results.\n /\n @Prop() newsLanguageLocales: string = '';\n\n /\n The page size. Prefer this number to be even.\n /\n @Prop() pageSize: number = 16;\n\n /\n The text used by the next button in the pagination component.\n /\n @Prop() nextButtonText: string = 'Next';\n\n /\n The text used by the previous button in the pagination component.\n /\n @Prop() previousButtonText: string = 'Previous';\n\n /\n The article translation that will be used to render the content.\n \n If the locale specified is not present in the article's translations, most content will not be shown.\n /\n @Prop() locale: string = 'de';\n\n /\n Event emitted when a user clicks an article.\n \n The handler receives the entire Article entity.\n /\n @Event() articleClick?: EventEmitter<Article>;\n\n /\n Determines if the special articles are highlighted by taking more space.\n */\n @Prop() highlightSpecialArticles: boolean = false;\n\n private api?: AicoApiRequestInfo;\n private newsListFetchController?: AbortController;\n\n connectedCallback() {\n this.newsListFetchController = new AbortController();\n this.pageNumber = 1;\n\n this.api = { baseApi: this.aicoUrl, bearerToken: this.aicoBearerToken };\n\n this.newsChannelsArr = splitByComma(this.newsChannels);\n this.newsSellerIdsArr = splitByComma(this.newsSellerIds);\n this.newsBrandIdsArr = splitByComma(this.newsBrandIds);\n this.newsLanguageLocalesArr = splitByComma(this.newsLanguageLocales);\n }\n\n disconnectedCallback() {\n this.newsListFetchController!.abort('disconnected');\n }\n\n async componentWillLoad(): Promise<void> {\n this.newsResponse = await fetchNewsArticles(\n this.api!,\n this.pageNumber,\n this.pageSize,\n this.newsListFetchController!.signal,\n this.newsChannelsArr,\n this.newsSellerIdsArr,\n this.newsBrandIdsArr,\n this.newsLanguageLocalesArr,\n );\n }\n\n async componentWillUpdate(): Promise<void> {\n this.newsListFetchController = new AbortController();\n this.newsResponse = await fetchNewsArticles(\n this.api!,\n this.pageNumber,\n this.pageSize,\n this.newsListFetchController.signal,\n this.newsChannelsArr,\n this.newsSellerIdsArr,\n this.newsBrandIdsArr,\n this.newsLanguageLocalesArr,\n );\n }\n\n render() {\n return (\n <Host>\n <div class=\"newslist-grid-container mb-4\">\n {this.newsResponse?.data.map((article, articleIndex) => {\n return (\n <div class={`col ${this.highlightSpecialArticles && article.attributes.isSpecialArticle ? 'row-span-2 col-span-md-2' : ''}`}>\n <aico-news-list-item\n article={article}\n articleIndex={articleIndex}\n onArticleClick={e => {\n this.articleClick?.emit(e.detail);\n e.stopPropagation();\n }}\n locale={this.locale}\n />\n </div>\n );\n })}\n </div>\n <nav class=\"w-100\" aria-label=\"News navigation\">\n <ul class=\"pagination justify-content-center\">\n <li\n class={`page-item page-link user-select-none d-flex align-items-center ${!this.newsResponse?.links.prev ? 'disabled' : ''}`}\n style={{ cursor: 'pointer' }}\n onClick={() => {\n if (this.pageNumber > 1) {\n this.pageNumber -= 1;\n }\n\n return false;\n }}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" class=\"bi bi-chevron-left me-1 fs-4\" style={{ width: '1em', height: '1em' }} viewBox=\"0 0 16 16\">\n <path fill-rule=\"evenodd\" d=\"M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0\" />\n </svg>\n {this.previousButtonText}\n </li>\n {this.getViewablePages().map(page => (\n <li\n class={`page-item page-link user-select-none ${page === '...' ? 'disabled' : Number(page) === this.pageNumber ? 'active' : ''}`}\n style={{ cursor: 'pointer' }}\n onClick={() => {\n if (page !== '...') {\n this.pageNumber = Number(page);\n }\n return false;\n }}\n >\n {page}\n </li>\n ))}\n <li\n class={`page-item page-link user-select-none d-flex align-items-center ${!this.newsResponse?.links.next ? 'disabled' : ''}`}\n style={{ cursor: 'pointer' }}\n onClick={() => {\n if (this.newsResponse?.meta.page.lastPage && this.pageNumber < this.newsResponse?.meta.page.lastPage) {\n this.pageNumber += 1;\n }\n }}\n >\n {this.nextButtonText}\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" class=\"bi bi-chevron-right ms-1 fs-4\" style={{ width: '1em', height: '1em' }} viewBox=\"0 0 16 16\">\n <path fill-rule=\"evenodd\" d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708\" />\n </svg>\n </li>\n </ul>\n </nav>\n </Host>\n );\n }\n\n private getViewablePages(lookAhead: number = 2) {\n const pages: string[] = [];\n if (this.pageNumber - lookAhead >= 2) {\n pages.push('1');\n }\n\n if (this.pageNumber - lookAhead > 2) {\n pages.push('...');\n }\n\n for (let i = this.pageNumber - lookAhead; i < this.pageNumber; i += 1) {\n if (i >= 1) {\n pages.push(`${i}`);\n }\n }\n\n pages.push(`${this.pageNumber}`);\n for (let i = this.pageNumber + 1; i <= this.pageNumber + lookAhead; i += 1) {\n if (i <= (this.newsResponse?.meta.page.lastPage ?? 0)) {\n pages.push(`${i}`);\n }\n }\n\n if (this.pageNumber + lookAhead < (this.newsResponse?.meta.page.lastPage ?? 0) - 1) {\n pages.push('...');\n }\n\n if (this.pageNumber + lookAhead <= (this.newsResponse?.meta.page.lastPage ?? 0) - 1) {\n pages.push(`${this.newsResponse?.meta.page.lastPage}`);\n }\n\n return pages;\n }\n}\n"]}
1	+ {"version":3,"file":"aico-news-list.js","sourceRoot":"","sources":["../../../src/components/aico-news-list/aico-news-list.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, EventEmitter, Host, Prop, State, h } from '@stencil/core';\nimport { fetchNewsArticles, splitByComma } from '../../utils/utils';\nimport { NewsResponse } from '../../model/NewsResponse';\nimport { AicoApiRequestInfo } from '../../model/AicoApiRequestInfo';\nimport { Article } from '../../model/Article';\n\n@Component({\n tag: 'aico-news-list',\n styleUrl: 'aico-news-list.css',\n scoped: true,\n})\nexport class AicoNewsList {\n @State() newsResponse?: NewsResponse;\n\n @State() pageNumber = 1;\n\n @State() newsChannelsArr: string[] = [];\n\n @State() newsSellerIdsArr: string[] = [];\n\n @State() newsBrandIdsArr: string[] = [];\n\n @State() newsLanguageLocalesArr: string[] = [];\n\n /*\n The url of the Aico Api that will be used to retrieve the article.\n /\n @Prop() aicoUrl!: string;\n\n /\n The token used to authenticate against he Aico Api.\n /\n @Prop() aicoBearerToken!: string;\n\n /\n Channel names as a comma separated list used to filter the results.\n /\n @Prop() newsChannels: string = '';\n\n /\n Seller ids as a comma separated list used to filter the results.\n /\n @Prop() newsSellerIds: string = '';\n\n /\n Brand ids as a comma separated list used to filter the results.\n /\n @Prop() newsBrandIds: string = '';\n\n /\n Language locales as a comma separated list used to filter the results.\n /\n @Prop() newsLanguageLocales: string = '';\n\n /\n The page size. Prefer this number to be even.\n /\n @Prop() pageSize: number = 16;\n\n /\n The text used by the next button in the pagination component.\n /\n @Prop() nextButtonText: string = 'Next';\n\n /\n The text used by the previous button in the pagination component.\n /\n @Prop() previousButtonText: string = 'Previous';\n\n /\n The article translation that will be used to render the content.\n \n If the locale specified is not present in the article's translations, most content will not be shown.\n /\n @Prop() locale: string = 'de';\n\n /\n Event emitted when a user clicks an article.\n \n The handler receives the entire Article entity.\n /\n @Event() articleClick?: EventEmitter<Article>;\n\n /\n Determines if the top articles are highlighted by taking more space.\n */\n @Prop() highlightTopArticles: boolean = false;\n\n private api?: AicoApiRequestInfo;\n private newsListFetchController?: AbortController;\n\n connectedCallback() {\n this.newsListFetchController = new AbortController();\n this.pageNumber = 1;\n\n this.api = { baseApi: this.aicoUrl, bearerToken: this.aicoBearerToken };\n\n this.newsChannelsArr = splitByComma(this.newsChannels);\n this.newsSellerIdsArr = splitByComma(this.newsSellerIds);\n this.newsBrandIdsArr = splitByComma(this.newsBrandIds);\n this.newsLanguageLocalesArr = splitByComma(this.newsLanguageLocales);\n }\n\n disconnectedCallback() {\n this.newsListFetchController!.abort('disconnected');\n }\n\n async componentWillLoad(): Promise<void> {\n this.newsResponse = await fetchNewsArticles(\n this.api!,\n this.pageNumber,\n this.pageSize,\n this.newsListFetchController!.signal,\n this.newsChannelsArr,\n this.newsSellerIdsArr,\n this.newsBrandIdsArr,\n this.newsLanguageLocalesArr,\n );\n }\n\n async componentWillUpdate(): Promise<void> {\n this.newsListFetchController = new AbortController();\n this.newsResponse = await fetchNewsArticles(\n this.api!,\n this.pageNumber,\n this.pageSize,\n this.newsListFetchController.signal,\n this.newsChannelsArr,\n this.newsSellerIdsArr,\n this.newsBrandIdsArr,\n this.newsLanguageLocalesArr,\n );\n }\n\n render() {\n return (\n <Host>\n <div class=\"newslist-grid-container mb-4\">\n {this.newsResponse?.data.map((article, articleIndex) => {\n return (\n <div class={`col ${this.highlightTopArticles && article.attributes.isTopNews ? 'row-span-2 col-span-md-2' : ''}`}>\n <aico-news-list-item\n article={article}\n articleIndex={articleIndex}\n onArticleClick={e => {\n this.articleClick?.emit(e.detail);\n e.stopPropagation();\n }}\n locale={this.locale}\n highlightTopArticle={this.highlightTopArticles}\n />\n </div>\n );\n })}\n </div>\n <nav class=\"w-100\" aria-label=\"News navigation\">\n <ul class=\"pagination justify-content-center\">\n <li\n class={`page-item page-link user-select-none d-flex align-items-center ${!this.newsResponse?.links.prev ? 'disabled' : ''}`}\n style={{ cursor: 'pointer' }}\n onClick={() => {\n if (this.pageNumber > 1) {\n this.pageNumber -= 1;\n }\n\n return false;\n }}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" class=\"bi bi-chevron-left me-1 fs-4\" style={{ width: '1em', height: '1em' }} viewBox=\"0 0 16 16\">\n <path fill-rule=\"evenodd\" d=\"M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0\" />\n </svg>\n {this.previousButtonText}\n </li>\n {this.getViewablePages().map(page => (\n <li\n class={`page-item page-link user-select-none ${page === '...' ? 'disabled' : Number(page) === this.pageNumber ? 'active' : ''}`}\n style={{ cursor: 'pointer' }}\n onClick={() => {\n if (page !== '...') {\n this.pageNumber = Number(page);\n }\n return false;\n }}\n >\n {page}\n </li>\n ))}\n <li\n class={`page-item page-link user-select-none d-flex align-items-center ${!this.newsResponse?.links.next ? 'disabled' : ''}`}\n style={{ cursor: 'pointer' }}\n onClick={() => {\n if (this.newsResponse?.meta.page.lastPage && this.pageNumber < this.newsResponse?.meta.page.lastPage) {\n this.pageNumber += 1;\n }\n }}\n >\n {this.nextButtonText}\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" class=\"bi bi-chevron-right ms-1 fs-4\" style={{ width: '1em', height: '1em' }} viewBox=\"0 0 16 16\">\n <path fill-rule=\"evenodd\" d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708\" />\n </svg>\n </li>\n </ul>\n </nav>\n </Host>\n );\n }\n\n private getViewablePages(lookAhead: number = 2) {\n const pages: string[] = [];\n if (this.pageNumber - lookAhead >= 2) {\n pages.push('1');\n }\n\n if (this.pageNumber - lookAhead > 2) {\n pages.push('...');\n }\n\n for (let i = this.pageNumber - lookAhead; i < this.pageNumber; i += 1) {\n if (i >= 1) {\n pages.push(`${i}`);\n }\n }\n\n pages.push(`${this.pageNumber}`);\n for (let i = this.pageNumber + 1; i <= this.pageNumber + lookAhead; i += 1) {\n if (i <= (this.newsResponse?.meta.page.lastPage ?? 0)) {\n pages.push(`${i}`);\n }\n }\n\n if (this.pageNumber + lookAhead < (this.newsResponse?.meta.page.lastPage ?? 0) - 1) {\n pages.push('...');\n }\n\n if (this.pageNumber + lookAhead <= (this.newsResponse?.meta.page.lastPage ?? 0) - 1) {\n pages.push(`${this.newsResponse?.meta.page.lastPage}`);\n }\n\n return pages;\n }\n}\n"]}

package/dist/collection/components/aico-news-list-item/aico-news-list-item.js CHANGED Viewed

@@ -3,16 +3,16 @@ export class AicoNewsListItem {
     constructor() {
         this.article = undefined;
         this.articleIndex = 0;
-        this.highlightSpecialArticle = false;
+        this.highlightTopArticle = false;
         this.locale = 'de';
     }
     render() {
         var _a, _b, _c, _d, _e, _f, _g;
         const translation = this.article.attributes.translations.find(t => t.locale === this.locale);
-        return (h("div", { class: `card h-100 pe-auto ${this.highlightSpecialArticle && this.article.attributes.isSpecialArticle ? 'd-flex flex-column' : ''}`, style: { cursor: 'pointer' }, onClick: () => {
+        return (h("div", { class: `card h-100 pe-auto ${this.highlightTopArticle && this.article.attributes.isTopNews ? 'd-flex flex-column top-article' : ''}`, style: { cursor: 'pointer' }, onClick: () => {
                 var _a;
                 (_a = this.articleClick) === null || _a === void 0 ? void 0 : _a.emit(this.article);
-            } }, h("div", { class: `ratio ratio-16x9 overflow-hidden ${this.highlightSpecialArticle && this.article.attributes.isSpecialArticle ? 'flex-grow-1' : ''}` }, h("img", { class: "object-fit-cover", style: { 'min-height': '15rem' }, alt: "Article image", src: (_e = (_d = (_c = (_b = (_a = translation === null || translation === void 0 ? void 0 : translation.image) !== null && _a !== void 0 ? _a : translation === null || translation === void 0 ? void 0 : translation.optimizedListImage) !== null && _b !== void 0 ? _b : translation === null || translation === void 0 ? void 0 : translation.optimizedImage) !== null && _c !== void 0 ? _c : this.article.attributes.image) !== null && _d !== void 0 ? _d : this.article.attributes.optimizedListImage) !== null && _e !== void 0 ? _e : this.article.attributes.optimizedImage }), h("div", { class: "card-img-overlay d-flex justify-content-end" })), h("div", { class: `card-body ${this.highlightSpecialArticle && this.article.attributes.isSpecialArticle ? 'flex-grow-0' : ''}` }, h("h5", { class: "card-title" }, (_f = translation === null || translation === void 0 ? void 0 : translation.name) !== null && _f !== void 0 ? _f : this.article.attributes.name), h("p", { class: "card-text" }, (_g = translation === null || translation === void 0 ? void 0 : translation.excerpt) !== null && _g !== void 0 ? _g : this.article.attributes.excerpt))));
+            } }, h("div", { class: `ratio ratio-16x9 overflow-hidden ${this.highlightTopArticle && this.article.attributes.isTopNews ? 'flex-grow-1' : ''}` }, h("img", { class: "object-fit-cover", style: { 'min-height': '15rem' }, alt: "Article image", src: (_e = (_d = (_c = (_b = (_a = translation === null || translation === void 0 ? void 0 : translation.image) !== null && _a !== void 0 ? _a : translation === null || translation === void 0 ? void 0 : translation.optimizedListImage) !== null && _b !== void 0 ? _b : translation === null || translation === void 0 ? void 0 : translation.optimizedImage) !== null && _c !== void 0 ? _c : this.article.attributes.image) !== null && _d !== void 0 ? _d : this.article.attributes.optimizedListImage) !== null && _e !== void 0 ? _e : this.article.attributes.optimizedImage }), h("div", { class: "card-img-overlay d-flex justify-content-end" })), h("div", { class: `card-body ${this.highlightTopArticle && this.article.attributes.isTopNews ? 'flex-grow-0' : ''}` }, h("h5", { class: "card-title" }, (_f = translation === null || translation === void 0 ? void 0 : translation.name) !== null && _f !== void 0 ? _f : this.article.attributes.name), h("p", { class: "card-text" }, (_g = translation === null || translation === void 0 ? void 0 : translation.excerpt) !== null && _g !== void 0 ? _g : this.article.attributes.excerpt))));
     }
     static get is() { return "aico-news-list-item"; }
     static get encapsulation() { return "scoped"; }
@@ -67,7 +67,7 @@ export class AicoNewsListItem {
                 "reflect": false,
                 "defaultValue": "0"
             },
-            "highlightSpecialArticle": {
+            "highlightTopArticle": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -81,7 +81,7 @@ export class AicoNewsListItem {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "highlight-special-article",
+                "attribute": "highlight-top-article",
                 "reflect": false,
                 "defaultValue": "false"
             },

package/dist/collection/components/aico-news-list-item/aico-news-list-item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"aico-news-list-item.js","sourceRoot":"","sources":["../../../src/components/aico-news-list-item/aico-news-list-item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAgB,CAAC,EAAE,MAAM,eAAe,CAAC;AAQxE,MAAM,OAAO,gBAAgB;;;4BAEI,CAAC;~~uCACW~~,KAAK;~~sBAQvB~~,IAAI;;IAE7B,MAAM;;QACJ,MAAM,WAAW,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,KAAK,IAAI,CAAC,MAAM,CAAC,CAAC;QAC7F,OAAO,CACL,WACE,KAAK,EAAE,sBAAsB,IAAI,CAAC,~~uBAAuB~~,IAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,~~gBAAgB~~,CAAC,CAAC,CAAC,~~oBAAoB~~,CAAC,CAAC,CAAC,EAAE,EAAE,~~EACnI~~,KAAK,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,EAC5B,OAAO,EAAE,GAAG,EAAE;;gBACZ,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACxC,CAAC;YAED,WAAK,KAAK,EAAE,oCAAoC,IAAI,CAAC,~~uBAAuB~~,IAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,~~gBAAgB~~,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,EAAE;~~gBAC7I~~,WACE,KAAK,EAAC,kBAAkB,EACxB,KAAK,EAAE,EAAE,YAAY,EAAE,OAAO,EAAE,EAChC,GAAG,EAAC,eAAe,EACnB,GAAG,EACD,MAAA,MAAA,MAAA,MAAA,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,KAAK,mCAClB,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,kBAAkB,mCAC/B,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,mCAC3B,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,mCAC7B,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,kBAAkB,mCAC1C,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,cAAc,GAExC;gBACF,WAAK,KAAK,EAAC,6CAA6C,GAA0C,CAC9F;YACN,WAAK,KAAK,EAAE,aAAa,IAAI,CAAC,~~uBAAuB~~,IAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,~~gBAAgB~~,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,EAAE;~~gBACtH~~,UAAI,KAAK,EAAC,YAAY,IAAE,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,IAAI,mCAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAM;gBAC/E,SAAG,KAAK,EAAC,WAAW,IAAE,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,OAAO,mCAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,OAAO,CAAK,CAC9E,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, Event, EventEmitter, h } from '@stencil/core';\nimport { Article } from '../../model/Article';\n\n@Component({\n tag: 'aico-news-list-item',\n styleUrl: 'aico-news-list-item.css',\n scoped: true,\n})\nexport class AicoNewsListItem {\n @Prop() article!: Article;\n @Prop() articleIndex: number = 0;\n @Prop() ~~highlightSpecialArticle~~: boolean = false;\n @Event() articleClick?: EventEmitter<Article>;\n\n /*\n The article translation that will be used to render the content.\n \n If the locale specified is not present in the article's translations, most content will not be shown.\n /\n @Prop() locale: string = 'de';\n\n render() {\n const translation = this.article.attributes.translations.find(t => t.locale === this.locale);\n return (\n <div\n class={`card h-100 pe-auto ${this.~~highlightSpecialArticle~~ && this.article.attributes.~~isSpecialArticle~~ ? 'd-flex flex-column' : ''}`}\n style={{ cursor: 'pointer' }}\n onClick={() => {\n this.articleClick?.emit(this.article);\n }}\n >\n <div class={`ratio ratio-16x9 overflow-hidden ${this.~~highlightSpecialArticle~~ && this.article.attributes.~~isSpecialArticle~~ ? 'flex-grow-1' : ''}`}>\n <img\n class=\"object-fit-cover\"\n style={{ 'min-height': '15rem' }}\n alt=\"Article image\"\n src={\n translation?.image ??\n translation?.optimizedListImage ??\n translation?.optimizedImage ??\n this.article.attributes.image ??\n this.article.attributes.optimizedListImage ??\n this.article.attributes.optimizedImage\n }\n />\n <div class=\"card-img-overlay d-flex justify-content-end\">{/TODO: set the date top-right?*/}</div>\n </div>\n <div class={`card-body ${this.~~highlightSpecialArticle~~ && this.article.attributes.~~isSpecialArticle~~ ? 'flex-grow-0' : ''}`}>\n <h5 class=\"card-title\">{translation?.name ?? this.article.attributes.name}</h5>\n <p class=\"card-text\">{translation?.excerpt ?? this.article.attributes.excerpt}</p>\n </div>\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"aico-news-list-item.js","sourceRoot":"","sources":["../../../src/components/aico-news-list-item/aico-news-list-item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAgB,CAAC,EAAE,MAAM,eAAe,CAAC;AAQxE,MAAM,OAAO,gBAAgB;;;4BAEI,CAAC;mCACO,KAAK;sBAQnB,IAAI;;IAE7B,MAAM;;QACJ,MAAM,WAAW,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,KAAK,IAAI,CAAC,MAAM,CAAC,CAAC;QAC7F,OAAO,CACL,WACE,KAAK,EAAE,sBAAsB,IAAI,CAAC,mBAAmB,IAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC,gCAAgC,CAAC,CAAC,CAAC,EAAE,EAAE,EACpI,KAAK,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,EAC5B,OAAO,EAAE,GAAG,EAAE;;gBACZ,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACxC,CAAC;YAED,WAAK,KAAK,EAAE,oCAAoC,IAAI,CAAC,mBAAmB,IAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,EAAE;gBAClI,WACE,KAAK,EAAC,kBAAkB,EACxB,KAAK,EAAE,EAAE,YAAY,EAAE,OAAO,EAAE,EAChC,GAAG,EAAC,eAAe,EACnB,GAAG,EACD,MAAA,MAAA,MAAA,MAAA,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,KAAK,mCAClB,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,kBAAkB,mCAC/B,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,mCAC3B,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,mCAC7B,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,kBAAkB,mCAC1C,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,cAAc,GAExC;gBACF,WAAK,KAAK,EAAC,6CAA6C,GAA0C,CAC9F;YACN,WAAK,KAAK,EAAE,aAAa,IAAI,CAAC,mBAAmB,IAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,EAAE;gBAC3G,UAAI,KAAK,EAAC,YAAY,IAAE,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,IAAI,mCAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAM;gBAC/E,SAAG,KAAK,EAAC,WAAW,IAAE,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,OAAO,mCAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,OAAO,CAAK,CAC9E,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, Event, EventEmitter, h } from '@stencil/core';\nimport { Article } from '../../model/Article';\n\n@Component({\n tag: 'aico-news-list-item',\n styleUrl: 'aico-news-list-item.css',\n scoped: true,\n})\nexport class AicoNewsListItem {\n @Prop() article!: Article;\n @Prop() articleIndex: number = 0;\n @Prop() highlightTopArticle: boolean = false;\n @Event() articleClick?: EventEmitter<Article>;\n\n /*\n The article translation that will be used to render the content.\n \n If the locale specified is not present in the article's translations, most content will not be shown.\n /\n @Prop() locale: string = 'de';\n\n render() {\n const translation = this.article.attributes.translations.find(t => t.locale === this.locale);\n return (\n <div\n class={`card h-100 pe-auto ${this.highlightTopArticle && this.article.attributes.isTopNews ? 'd-flex flex-column top-article' : ''}`}\n style={{ cursor: 'pointer' }}\n onClick={() => {\n this.articleClick?.emit(this.article);\n }}\n >\n <div class={`ratio ratio-16x9 overflow-hidden ${this.highlightTopArticle && this.article.attributes.isTopNews ? 'flex-grow-1' : ''}`}>\n <img\n class=\"object-fit-cover\"\n style={{ 'min-height': '15rem' }}\n alt=\"Article image\"\n src={\n translation?.image ??\n translation?.optimizedListImage ??\n translation?.optimizedImage ??\n this.article.attributes.image ??\n this.article.attributes.optimizedListImage ??\n this.article.attributes.optimizedImage\n }\n />\n <div class=\"card-img-overlay d-flex justify-content-end\">{/TODO: set the date top-right?*/}</div>\n </div>\n <div class={`card-body ${this.highlightTopArticle && this.article.attributes.isTopNews ? 'flex-grow-0' : ''}`}>\n <h5 class=\"card-title\">{translation?.name ?? this.article.attributes.name}</h5>\n <p class=\"card-text\">{translation?.excerpt ?? this.article.attributes.excerpt}</p>\n </div>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/aico-news-list-item/aico-news-list-item.stories.js CHANGED Viewed

@@ -17,6 +17,7 @@ const x = {
         newsTags: [],
         isActive: true,
         isSpecialArticle: false,
+        isTopNews: false,
         focusXCoordinate: 172,
         focusYCoordinate: 51,
         focusXPercentage: 50.962962962963,

package/dist/collection/components/aico-news-list-item/aico-news-list-item.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"aico-news-list-item.stories.js","sourceRoot":"","sources":["../../../src/components/aico-news-list-item/aico-news-list-item.stories.ts"],"names":[],"mappings":"AAIA,MAAM,IAAI,GAA+B;IACvC,SAAS,EAAE,qBAAqB;CACjC,CAAC;AAEF,eAAe,IAAI,CAAC;AAKpB,MAAM,CAAC,GAAW,CAAC,CAAC;AAEpB,MAAM,CAAC,GAAY;IACjB,EAAE,EAAE,MAAM;IACV,IAAI,EAAE,MAAM;IACZ,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;IACtB,UAAU,EAAE;QACV,SAAS,EAAE,IAAI,IAAI,EAAE;QACrB,SAAS,EAAE,IAAI,IAAI,EAAE;QACrB,SAAS,EAAE,YAAY;QACvB,SAAS,EAAE,0CAA0C;QACrD,WAAW,EAAE,IAAI,IAAI,EAAE;QACvB,MAAM,EAAE,KAAK;QACb,QAAQ,EAAE,EAAE;QACZ,QAAQ,EAAE,IAAI;QACd,gBAAgB,EAAE,KAAK;QACvB,gBAAgB,EAAE,GAAG;QACrB,gBAAgB,EAAE,EAAE;QACpB,gBAAgB,EAAE,eAAe;QACjC,gBAAgB,EAAE,IAAI;QACtB,sBAAsB,EAAE,GAAG;QAC3B,sBAAsB,EAAE,EAAE;QAC1B,sBAAsB,EAAE,eAAe;QACvC,sBAAsB,EAAE,IAAI;QAC5B,cAAc,EAAE;YACd,EAAE,EAAE,IAAI;YACR,SAAS,EAAE,IAAI,IAAI,EAAE;YACrB,SAAS,EAAE,IAAI,IAAI,EAAE;YACrB,IAAI,EAAE,iBAAiB;YACvB,IAAI,EAAE,EAAE;SACT;QACD,YAAY,EAAE;YACZ,EAAE,EAAE,IAAI;YACR,SAAS,EAAE,IAAI,IAAI,EAAE;YACrB,SAAS,EAAE,IAAI,IAAI,EAAE;YACrB,YAAY,EAAE,EAAE;YAChB,QAAQ,EAAE,KAAK;YACf,aAAa,EAAE,CAAC;SACjB;QACD,WAAW,EAAE,IAAI;QACjB,SAAS,EAAE,IAAI;QACf,WAAW,EAAE,KAAK;QAClB,WAAW,EAAE,EAAE;QACf,MAAM,EAAE,EAAE;QACV,YAAY,EAAE,EAAE;QAChB,IAAI,EAAE,0CAA0C;QAChD,WAAW,EAAE,EAAE;QACf,OAAO,EAAE,0DAA0D;QACnE,KAAK,EAAE,mFAAmF;QAC1F,cAAc,EAAE,6FAA6F;QAC7G,kBAAkB,EAAE,kGAAkG;KACvH;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE;QACJ,OAAO,EAAE,CAAC;QACV,YAAY,EAAE,CAAC;KAChB;CACF,CAAC","sourcesContent":["import type { Meta, StoryObj } from '@storybook/web-components';\nimport type { Article } from '../../model/Article';\nimport { JSX } from '../../components';\n\nconst meta: Meta<JSX.AicoNewsListItem> = {\n component: 'aico-news-list-item',\n};\n\nexport default meta;\n\ntype Story = StoryObj;\n\n\nconst y: number = 0;\n\nconst x: Article = {\n id: '1234',\n type: 'type',\n links: { self: 'foo' },\n attributes: {\n createdAt: new Date(),\n updatedAt: new Date(),\n pageTitle: 'Page title',\n urlHandle: 'die-fcz-frauen-sind-in-zypern-angekommen',\n publishDate: new Date(),\n author: 'lfr',\n newsTags: [],\n isActive: true,\n isSpecialArticle: false,\n focusXCoordinate: 172,\n focusYCoordinate: 51,\n focusXPercentage: 50.962962962963,\n focusYPercentage: 20.4,\n mobileFocusXCoordinate: 168,\n mobileFocusYCoordinate: 32,\n mobileFocusXPercentage: 49.777777777778,\n mobileFocusYPercentage: 12.8,\n contentBuilder: {\n id: 1234,\n createdAt: new Date(),\n updatedAt: new Date(),\n name: 'Content builder',\n rows: [],\n },\n newsCategory: {\n id: 1234,\n createdAt: new Date(),\n updatedAt: new Date(),\n translations: [],\n isActive: false,\n sortingNumber: 1,\n },\n isFullWidth: true,\n showInApp: true,\n isPermanent: false,\n soccerTeams: [],\n brands: [],\n translations: [],\n name: 'Die FCZ Frauen sind in Zypern angekommen',\n description: '',\n excerpt: 'Acht Tage langes Trainingslager auf der Mittelmeerinsel.',\n image: 'https://aicofcz.s3.eu-central-1.amazonaws.com/images/65a19b107d897_IMG_0147-2.jpg',\n optimizedImage: 'https://aicofcz.s3.eu-central-1.amazonaws.com/images/optimized_65a19b107d897_IMG_0147-2.jpg',\n optimizedListImage: 'https://aicofcz.s3.eu-central-1.amazonaws.com/images/optimized_list_65a19b107d897_IMG_0147-2.jpg',\n },\n};\n\nexport const Example: Story = {\n args: {\n article: x,\n articleIndex: y\n },\n};\n"]}
1	+ {"version":3,"file":"aico-news-list-item.stories.js","sourceRoot":"","sources":["../../../src/components/aico-news-list-item/aico-news-list-item.stories.ts"],"names":[],"mappings":"AAIA,MAAM,IAAI,GAA+B;IACvC,SAAS,EAAE,qBAAqB;CACjC,CAAC;AAEF,eAAe,IAAI,CAAC;AAKpB,MAAM,CAAC,GAAW,CAAC,CAAC;AAEpB,MAAM,CAAC,GAAY;IACjB,EAAE,EAAE,MAAM;IACV,IAAI,EAAE,MAAM;IACZ,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;IACtB,UAAU,EAAE;QACV,SAAS,EAAE,IAAI,IAAI,EAAE;QACrB,SAAS,EAAE,IAAI,IAAI,EAAE;QACrB,SAAS,EAAE,YAAY;QACvB,SAAS,EAAE,0CAA0C;QACrD,WAAW,EAAE,IAAI,IAAI,EAAE;QACvB,MAAM,EAAE,KAAK;QACb,QAAQ,EAAE,EAAE;QACZ,QAAQ,EAAE,IAAI;QACd,gBAAgB,EAAE,KAAK;QACvB,SAAS,EAAE,KAAK;QAChB,gBAAgB,EAAE,GAAG;QACrB,gBAAgB,EAAE,EAAE;QACpB,gBAAgB,EAAE,eAAe;QACjC,gBAAgB,EAAE,IAAI;QACtB,sBAAsB,EAAE,GAAG;QAC3B,sBAAsB,EAAE,EAAE;QAC1B,sBAAsB,EAAE,eAAe;QACvC,sBAAsB,EAAE,IAAI;QAC5B,cAAc,EAAE;YACd,EAAE,EAAE,IAAI;YACR,SAAS,EAAE,IAAI,IAAI,EAAE;YACrB,SAAS,EAAE,IAAI,IAAI,EAAE;YACrB,IAAI,EAAE,iBAAiB;YACvB,IAAI,EAAE,EAAE;SACT;QACD,YAAY,EAAE;YACZ,EAAE,EAAE,IAAI;YACR,SAAS,EAAE,IAAI,IAAI,EAAE;YACrB,SAAS,EAAE,IAAI,IAAI,EAAE;YACrB,YAAY,EAAE,EAAE;YAChB,QAAQ,EAAE,KAAK;YACf,aAAa,EAAE,CAAC;SACjB;QACD,WAAW,EAAE,IAAI;QACjB,SAAS,EAAE,IAAI;QACf,WAAW,EAAE,KAAK;QAClB,WAAW,EAAE,EAAE;QACf,MAAM,EAAE,EAAE;QACV,YAAY,EAAE,EAAE;QAChB,IAAI,EAAE,0CAA0C;QAChD,WAAW,EAAE,EAAE;QACf,OAAO,EAAE,0DAA0D;QACnE,KAAK,EAAE,mFAAmF;QAC1F,cAAc,EAAE,6FAA6F;QAC7G,kBAAkB,EAAE,kGAAkG;KACvH;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE;QACJ,OAAO,EAAE,CAAC;QACV,YAAY,EAAE,CAAC;KAChB;CACF,CAAC","sourcesContent":["import type { Meta, StoryObj } from '@storybook/web-components';\nimport type { Article } from '../../model/Article';\nimport { JSX } from '../../components';\n\nconst meta: Meta<JSX.AicoNewsListItem> = {\n component: 'aico-news-list-item',\n};\n\nexport default meta;\n\ntype Story = StoryObj;\n\n\nconst y: number = 0;\n\nconst x: Article = {\n id: '1234',\n type: 'type',\n links: { self: 'foo' },\n attributes: {\n createdAt: new Date(),\n updatedAt: new Date(),\n pageTitle: 'Page title',\n urlHandle: 'die-fcz-frauen-sind-in-zypern-angekommen',\n publishDate: new Date(),\n author: 'lfr',\n newsTags: [],\n isActive: true,\n isSpecialArticle: false,\n isTopNews: false,\n focusXCoordinate: 172,\n focusYCoordinate: 51,\n focusXPercentage: 50.962962962963,\n focusYPercentage: 20.4,\n mobileFocusXCoordinate: 168,\n mobileFocusYCoordinate: 32,\n mobileFocusXPercentage: 49.777777777778,\n mobileFocusYPercentage: 12.8,\n contentBuilder: {\n id: 1234,\n createdAt: new Date(),\n updatedAt: new Date(),\n name: 'Content builder',\n rows: [],\n },\n newsCategory: {\n id: 1234,\n createdAt: new Date(),\n updatedAt: new Date(),\n translations: [],\n isActive: false,\n sortingNumber: 1,\n },\n isFullWidth: true,\n showInApp: true,\n isPermanent: false,\n soccerTeams: [],\n brands: [],\n translations: [],\n name: 'Die FCZ Frauen sind in Zypern angekommen',\n description: '',\n excerpt: 'Acht Tage langes Trainingslager auf der Mittelmeerinsel.',\n image: 'https://aicofcz.s3.eu-central-1.amazonaws.com/images/65a19b107d897_IMG_0147-2.jpg',\n optimizedImage: 'https://aicofcz.s3.eu-central-1.amazonaws.com/images/optimized_65a19b107d897_IMG_0147-2.jpg',\n optimizedListImage: 'https://aicofcz.s3.eu-central-1.amazonaws.com/images/optimized_list_65a19b107d897_IMG_0147-2.jpg',\n },\n};\n\nexport const Example: Story = {\n args: {\n article: x,\n articleIndex: y\n },\n};\n"]}

package/dist/collection/model/Article.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Article.js","sourceRoot":"","sources":["../../src/model/Article.ts"],"names":[],"mappings":"","sourcesContent":["import { Entity } from './Entity';\nimport { NewsCategory } from './NewsCategory';\nimport { NewsTag } from './NewsTag';\nimport { ContentType } from './article/ContentType';\n\nexport type ArticleTranslation = Entity & {\n locale: string;\n name: string;\n description: string;\n excerpt: string;\n image?: string;\n optimizedImage?: string;\n portraitImage?: string;\n optimizedPortraitImage?: string;\n optimizedListImage?: string;\n shouldShowTranslation: boolean;\n};\n\nexport type ArticleContentTranslation = Entity & {\n locale: string;\n text: string;\n};\n\nexport type ArticleContent = Entity & {\n sort?: number;\n containerOrder?: number;\n type?: ContentType;\n contentData: object;\n};\n\nexport type ArticleContentBuilderColumn = Entity & {\n contentContainer: Entity & {\n isSplit?: object;\n contents: ArticleContent[];\n };\n};\n\nexport type ArticleContentBuilderRow = Entity & {\n defaultTextColor?: string;\n promptText?: string;\n order: number;\n isFullWidth: boolean;\n hasBackground: boolean;\n isOnPrompt: boolean;\n shouldMinimizeColumnSpacing: boolean;\n backgroundColor?: string;\n backgroundType?: string;\n backgroundImage?: string;\n backgroundGradientFrom?: string;\n backgroundGradientTo?: string;\n columns: ArticleContentBuilderColumn[];\n};\n\nexport type ArticleContetBuilder = Entity & {\n name: string;\n rows: ArticleContentBuilderRow[];\n};\n\nexport type ArticleAttributes = {\n createdAt: Date;\n updatedAt: Date;\n publishDate: Date;\n endDatePermanentNews?: Date;\n\n newsCategory?: NewsCategory;\n newsCategories?: NewsCategory[];\n newsTags: NewsTag[];\n soccerTeams: object[];\n brands: object[];\n album?: object;\n match?: object;\n\n // content\n pageTitle: string;\n metaDescription?: string;\n urlHandle: string;\n author: string;\n contentBuilder: ArticleContetBuilder;\n\n // flags\n isActive: boolean;\n isSpecialArticle: boolean;\n isFullWidth: boolean;\n showInApp: boolean;\n isPermanent: boolean;\n translations: ArticleTranslation[];\n name: string;\n description: string;\n excerpt: string;\n\n // visuals\n headlineImage?: string;\n videoUrl?: string;\n image?: string;\n optimizedImage?: string;\n portraitImage?: string;\n optimizedPortraitImage?: string;\n optimizedListImage?: string;\n\n // coordinates\n focusXCoordinate?: number;\n focusYCoordinate?: number;\n focusXPercentage?: number;\n focusYPercentage?: number;\n mobileFocusXCoordinate?: number;\n mobileFocusYCoordinate?: number;\n mobileFocusXPercentage?: number;\n mobileFocusYPercentage?: number;\n headlineImageFocusXCoordinate?: number;\n headlineImageFocusYCoordinate?: number;\n headlineImageFocusXPercentage?: number;\n headlineImageFocusYPercentage?: number;\n};\n\nexport type Article = {\n id: string;\n type: string;\n links: {\n self: string;\n };\n attributes: ArticleAttributes;\n};\n"]}
1	+ {"version":3,"file":"Article.js","sourceRoot":"","sources":["../../src/model/Article.ts"],"names":[],"mappings":"","sourcesContent":["import { Entity } from './Entity';\nimport { NewsCategory } from './NewsCategory';\nimport { NewsTag } from './NewsTag';\nimport { ContentType } from './article/ContentType';\n\nexport type ArticleTranslation = Entity & {\n locale: string;\n name: string;\n description: string;\n excerpt: string;\n image?: string;\n optimizedImage?: string;\n portraitImage?: string;\n optimizedPortraitImage?: string;\n optimizedListImage?: string;\n shouldShowTranslation: boolean;\n};\n\nexport type ArticleContentTranslation = Entity & {\n locale: string;\n text: string;\n};\n\nexport type ArticleContent = Entity & {\n sort?: number;\n containerOrder?: number;\n type?: ContentType;\n contentData: object;\n};\n\nexport type ArticleContentBuilderColumn = Entity & {\n contentContainer: Entity & {\n isSplit?: object;\n contents: ArticleContent[];\n };\n};\n\nexport type ArticleContentBuilderRow = Entity & {\n defaultTextColor?: string;\n promptText?: string;\n order: number;\n isFullWidth: boolean;\n hasBackground: boolean;\n isOnPrompt: boolean;\n shouldMinimizeColumnSpacing: boolean;\n backgroundColor?: string;\n backgroundType?: string;\n backgroundImage?: string;\n backgroundGradientFrom?: string;\n backgroundGradientTo?: string;\n columns: ArticleContentBuilderColumn[];\n};\n\nexport type ArticleContetBuilder = Entity & {\n name: string;\n rows: ArticleContentBuilderRow[];\n};\n\nexport type ArticleAttributes = {\n createdAt: Date;\n updatedAt: Date;\n publishDate: Date;\n endDatePermanentNews?: Date;\n\n newsCategory?: NewsCategory;\n newsCategories?: NewsCategory[];\n newsTags: NewsTag[];\n soccerTeams: object[];\n brands: object[];\n album?: object;\n match?: object;\n\n // content\n pageTitle: string;\n metaDescription?: string;\n urlHandle: string;\n author: string;\n contentBuilder: ArticleContetBuilder;\n\n // flags\n isActive: boolean;\n isSpecialArticle: boolean;\n isTopNews: boolean;\n isFullWidth: boolean;\n showInApp: boolean;\n isPermanent: boolean;\n translations: ArticleTranslation[];\n name: string;\n description: string;\n excerpt: string;\n\n // visuals\n headlineImage?: string;\n videoUrl?: string;\n image?: string;\n optimizedImage?: string;\n portraitImage?: string;\n optimizedPortraitImage?: string;\n optimizedListImage?: string;\n\n // coordinates\n focusXCoordinate?: number;\n focusYCoordinate?: number;\n focusXPercentage?: number;\n focusYPercentage?: number;\n mobileFocusXCoordinate?: number;\n mobileFocusYCoordinate?: number;\n mobileFocusXPercentage?: number;\n mobileFocusYPercentage?: number;\n headlineImageFocusXCoordinate?: number;\n headlineImageFocusYCoordinate?: number;\n headlineImageFocusXPercentage?: number;\n headlineImageFocusYPercentage?: number;\n};\n\nexport type Article = {\n id: string;\n type: string;\n links: {\n self: string;\n };\n attributes: ArticleAttributes;\n};\n"]}

package/dist/components/aico-news-list-item2.js CHANGED Viewed

@@ -9,22 +9,22 @@ const AicoNewsListItem = /*@__PURE__*/ proxyCustomElement(class AicoNewsListItem
         this.articleClick = createEvent(this, "articleClick", 7);
         this.article = undefined;
         this.articleIndex = 0;
-        this.highlightSpecialArticle = false;
+        this.highlightTopArticle = false;
         this.locale = 'de';
     }
     render() {
         var _a, _b, _c, _d, _e, _f, _g;
         const translation = this.article.attributes.translations.find(t => t.locale === this.locale);
-        return (h("div", { class: `card h-100 pe-auto ${this.highlightSpecialArticle && this.article.attributes.isSpecialArticle ? 'd-flex flex-column' : ''}`, style: { cursor: 'pointer' }, onClick: () => {
+        return (h("div", { class: `card h-100 pe-auto ${this.highlightTopArticle && this.article.attributes.isTopNews ? 'd-flex flex-column top-article' : ''}`, style: { cursor: 'pointer' }, onClick: () => {
                 var _a;
                 (_a = this.articleClick) === null || _a === void 0 ? void 0 : _a.emit(this.article);
-            } }, h("div", { class: `ratio ratio-16x9 overflow-hidden ${this.highlightSpecialArticle && this.article.attributes.isSpecialArticle ? 'flex-grow-1' : ''}` }, h("img", { class: "object-fit-cover", style: { 'min-height': '15rem' }, alt: "Article image", src: (_e = (_d = (_c = (_b = (_a = translation === null || translation === void 0 ? void 0 : translation.image) !== null && _a !== void 0 ? _a : translation === null || translation === void 0 ? void 0 : translation.optimizedListImage) !== null && _b !== void 0 ? _b : translation === null || translation === void 0 ? void 0 : translation.optimizedImage) !== null && _c !== void 0 ? _c : this.article.attributes.image) !== null && _d !== void 0 ? _d : this.article.attributes.optimizedListImage) !== null && _e !== void 0 ? _e : this.article.attributes.optimizedImage }), h("div", { class: "card-img-overlay d-flex justify-content-end" })), h("div", { class: `card-body ${this.highlightSpecialArticle && this.article.attributes.isSpecialArticle ? 'flex-grow-0' : ''}` }, h("h5", { class: "card-title" }, (_f = translation === null || translation === void 0 ? void 0 : translation.name) !== null && _f !== void 0 ? _f : this.article.attributes.name), h("p", { class: "card-text" }, (_g = translation === null || translation === void 0 ? void 0 : translation.excerpt) !== null && _g !== void 0 ? _g : this.article.attributes.excerpt))));
+            } }, h("div", { class: `ratio ratio-16x9 overflow-hidden ${this.highlightTopArticle && this.article.attributes.isTopNews ? 'flex-grow-1' : ''}` }, h("img", { class: "object-fit-cover", style: { 'min-height': '15rem' }, alt: "Article image", src: (_e = (_d = (_c = (_b = (_a = translation === null || translation === void 0 ? void 0 : translation.image) !== null && _a !== void 0 ? _a : translation === null || translation === void 0 ? void 0 : translation.optimizedListImage) !== null && _b !== void 0 ? _b : translation === null || translation === void 0 ? void 0 : translation.optimizedImage) !== null && _c !== void 0 ? _c : this.article.attributes.image) !== null && _d !== void 0 ? _d : this.article.attributes.optimizedListImage) !== null && _e !== void 0 ? _e : this.article.attributes.optimizedImage }), h("div", { class: "card-img-overlay d-flex justify-content-end" })), h("div", { class: `card-body ${this.highlightTopArticle && this.article.attributes.isTopNews ? 'flex-grow-0' : ''}` }, h("h5", { class: "card-title" }, (_f = translation === null || translation === void 0 ? void 0 : translation.name) !== null && _f !== void 0 ? _f : this.article.attributes.name), h("p", { class: "card-text" }, (_g = translation === null || translation === void 0 ? void 0 : translation.excerpt) !== null && _g !== void 0 ? _g : this.article.attributes.excerpt))));
     }
     static get style() { return aicoNewsListItemCss; }
 }, [2, "aico-news-list-item", {
         "article": [16],
         "articleIndex": [2, "article-index"],
-        "highlightSpecialArticle": [4, "highlight-special-article"],
+        "highlightTopArticle": [4, "highlight-top-article"],
         "locale": [1]
     }]);
 function defineCustomElement() {

package/dist/components/aico-news-list-item2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"aico-news-list-item2.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,2xwTAA2xwT;;MCQ1ywT,gBAAgB;;;;;;4BAEI,CAAC;~~uCACW~~,KAAK;~~sBAQvB~~,IAAI;;IAE7B,MAAM;;QACJ,MAAM,WAAW,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,KAAK,IAAI,CAAC,MAAM,CAAC,CAAC;QAC7F,QACE,WACE,KAAK,EAAE,sBAAsB,IAAI,CAAC,~~uBAAuB~~,IAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,~~gBAAgB~~,GAAG,~~oBAAoB~~,GAAG,EAAE,EAAE,~~EACnI~~,KAAK,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,EAC5B,OAAO,EAAE;;gBACP,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;aACvC,IAED,WAAK,KAAK,EAAE,oCAAoC,IAAI,CAAC,~~uBAAuB~~,IAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,~~gBAAgB~~,GAAG,aAAa,GAAG,EAAE,EAAE,~~IAC7I~~,WACE,KAAK,EAAC,kBAAkB,EACxB,KAAK,EAAE,EAAE,YAAY,EAAE,OAAO,EAAE,EAChC,GAAG,EAAC,eAAe,EACnB,GAAG,EACD,MAAA,MAAA,MAAA,MAAA,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,KAAK,mCAClB,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,kBAAkB,mCAC/B,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,mCAC3B,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,mCAC7B,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,kBAAkB,mCAC1C,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,cAAc,GAExC,EACF,WAAK,KAAK,EAAC,6CAA6C,GAA0C,CAC9F,EACN,WAAK,KAAK,EAAE,aAAa,IAAI,CAAC,~~uBAAuB~~,IAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,~~gBAAgB~~,GAAG,aAAa,GAAG,EAAE,EAAE,~~IACtH~~,UAAI,KAAK,EAAC,YAAY,IAAE,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,IAAI,mCAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAM,EAC/E,SAAG,KAAK,EAAC,WAAW,IAAE,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,OAAO,mCAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,OAAO,CAAK,CAC9E,CACF,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/aico-news-list-item/aico-news-list-item.css?tag=aico-news-list-item&encapsulation=scoped","src/components/aico-news-list-item/aico-news-list-item.tsx"],"sourcesContent":["@import '../../../node_modules/bootstrap/dist/css/bootstrap.css';\n\n:host,\n:host::before,\n:host::after {\n box-sizing: border-box;\n}\n\n:host {\n font-family: var(--bs-body-font-family);\n font-size: var(--bs-body-font-size);\n font-weight: var(--bs-body-font-weight);\n line-height: var(--bs-body-line-height);\n color: var(--bs-body-color);\n text-align: var(--bs-body-text-align);\n -webkit-text-size-adjust: 100%;\n}\n","import { Component, Prop, Event, EventEmitter, h } from '@stencil/core';\nimport { Article } from '../../model/Article';\n\n@Component({\n tag: 'aico-news-list-item',\n styleUrl: 'aico-news-list-item.css',\n scoped: true,\n})\nexport class AicoNewsListItem {\n @Prop() article!: Article;\n @Prop() articleIndex: number = 0;\n @Prop() ~~highlightSpecialArticle~~: boolean = false;\n @Event() articleClick?: EventEmitter<Article>;\n\n /*\n The article translation that will be used to render the content.\n \n If the locale specified is not present in the article's translations, most content will not be shown.\n /\n @Prop() locale: string = 'de';\n\n render() {\n const translation = this.article.attributes.translations.find(t => t.locale === this.locale);\n return (\n <div\n class={`card h-100 pe-auto ${this.~~highlightSpecialArticle~~ && this.article.attributes.~~isSpecialArticle~~ ? 'd-flex flex-column' : ''}`}\n style={{ cursor: 'pointer' }}\n onClick={() => {\n this.articleClick?.emit(this.article);\n }}\n >\n <div class={`ratio ratio-16x9 overflow-hidden ${this.~~highlightSpecialArticle~~ && this.article.attributes.~~isSpecialArticle~~ ? 'flex-grow-1' : ''}`}>\n <img\n class=\"object-fit-cover\"\n style={{ 'min-height': '15rem' }}\n alt=\"Article image\"\n src={\n translation?.image ??\n translation?.optimizedListImage ??\n translation?.optimizedImage ??\n this.article.attributes.image ??\n this.article.attributes.optimizedListImage ??\n this.article.attributes.optimizedImage\n }\n />\n <div class=\"card-img-overlay d-flex justify-content-end\">{/TODO: set the date top-right?*/}</div>\n </div>\n <div class={`card-body ${this.~~highlightSpecialArticle~~ && this.article.attributes.~~isSpecialArticle~~ ? 'flex-grow-0' : ''}`}>\n <h5 class=\"card-title\">{translation?.name ?? this.article.attributes.name}</h5>\n <p class=\"card-text\">{translation?.excerpt ?? this.article.attributes.excerpt}</p>\n </div>\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"aico-news-list-item2.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,2xwTAA2xwT;;MCQ1ywT,gBAAgB;;;;;;4BAEI,CAAC;mCACO,KAAK;sBAQnB,IAAI;;IAE7B,MAAM;;QACJ,MAAM,WAAW,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,KAAK,IAAI,CAAC,MAAM,CAAC,CAAC;QAC7F,QACE,WACE,KAAK,EAAE,sBAAsB,IAAI,CAAC,mBAAmB,IAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,SAAS,GAAG,gCAAgC,GAAG,EAAE,EAAE,EACpI,KAAK,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,EAC5B,OAAO,EAAE;;gBACP,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;aACvC,IAED,WAAK,KAAK,EAAE,oCAAoC,IAAI,CAAC,mBAAmB,IAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,SAAS,GAAG,aAAa,GAAG,EAAE,EAAE,IAClI,WACE,KAAK,EAAC,kBAAkB,EACxB,KAAK,EAAE,EAAE,YAAY,EAAE,OAAO,EAAE,EAChC,GAAG,EAAC,eAAe,EACnB,GAAG,EACD,MAAA,MAAA,MAAA,MAAA,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,KAAK,mCAClB,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,kBAAkB,mCAC/B,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,mCAC3B,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,mCAC7B,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,kBAAkB,mCAC1C,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,cAAc,GAExC,EACF,WAAK,KAAK,EAAC,6CAA6C,GAA0C,CAC9F,EACN,WAAK,KAAK,EAAE,aAAa,IAAI,CAAC,mBAAmB,IAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,SAAS,GAAG,aAAa,GAAG,EAAE,EAAE,IAC3G,UAAI,KAAK,EAAC,YAAY,IAAE,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,IAAI,mCAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAM,EAC/E,SAAG,KAAK,EAAC,WAAW,IAAE,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,OAAO,mCAAI,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,OAAO,CAAK,CAC9E,CACF,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/aico-news-list-item/aico-news-list-item.css?tag=aico-news-list-item&encapsulation=scoped","src/components/aico-news-list-item/aico-news-list-item.tsx"],"sourcesContent":["@import '../../../node_modules/bootstrap/dist/css/bootstrap.css';\n\n:host,\n:host::before,\n:host::after {\n box-sizing: border-box;\n}\n\n:host {\n font-family: var(--bs-body-font-family);\n font-size: var(--bs-body-font-size);\n font-weight: var(--bs-body-font-weight);\n line-height: var(--bs-body-line-height);\n color: var(--bs-body-color);\n text-align: var(--bs-body-text-align);\n -webkit-text-size-adjust: 100%;\n}\n","import { Component, Prop, Event, EventEmitter, h } from '@stencil/core';\nimport { Article } from '../../model/Article';\n\n@Component({\n tag: 'aico-news-list-item',\n styleUrl: 'aico-news-list-item.css',\n scoped: true,\n})\nexport class AicoNewsListItem {\n @Prop() article!: Article;\n @Prop() articleIndex: number = 0;\n @Prop() highlightTopArticle: boolean = false;\n @Event() articleClick?: EventEmitter<Article>;\n\n /*\n The article translation that will be used to render the content.\n \n If the locale specified is not present in the article's translations, most content will not be shown.\n /\n @Prop() locale: string = 'de';\n\n render() {\n const translation = this.article.attributes.translations.find(t => t.locale === this.locale);\n return (\n <div\n class={`card h-100 pe-auto ${this.highlightTopArticle && this.article.attributes.isTopNews ? 'd-flex flex-column top-article' : ''}`}\n style={{ cursor: 'pointer' }}\n onClick={() => {\n this.articleClick?.emit(this.article);\n }}\n >\n <div class={`ratio ratio-16x9 overflow-hidden ${this.highlightTopArticle && this.article.attributes.isTopNews ? 'flex-grow-1' : ''}`}>\n <img\n class=\"object-fit-cover\"\n style={{ 'min-height': '15rem' }}\n alt=\"Article image\"\n src={\n translation?.image ??\n translation?.optimizedListImage ??\n translation?.optimizedImage ??\n this.article.attributes.image ??\n this.article.attributes.optimizedListImage ??\n this.article.attributes.optimizedImage\n }\n />\n <div class=\"card-img-overlay d-flex justify-content-end\">{/TODO: set the date top-right?*/}</div>\n </div>\n <div class={`card-body ${this.highlightTopArticle && this.article.attributes.isTopNews ? 'flex-grow-0' : ''}`}>\n <h5 class=\"card-title\">{translation?.name ?? this.article.attributes.name}</h5>\n <p class=\"card-text\">{translation?.excerpt ?? this.article.attributes.excerpt}</p>\n </div>\n </div>\n );\n }\n}\n"],"version":3}

package/dist/components/aico-news-list.js CHANGED Viewed

@@ -25,7 +25,7 @@ const AicoNewsList$1 = /*@__PURE__*/ proxyCustomElement(class AicoNewsList exten
         this.nextButtonText = 'Next';
         this.previousButtonText = 'Previous';
         this.locale = 'de';
-        this.highlightSpecialArticles = false;
+        this.highlightTopArticles = false;
     }
     connectedCallback() {
         this.newsListFetchController = new AbortController();
@@ -49,11 +49,11 @@ const AicoNewsList$1 = /*@__PURE__*/ proxyCustomElement(class AicoNewsList exten
     render() {
         var _a, _b, _c;
         return (h(Host, null, h("div", { class: "newslist-grid-container mb-4" }, (_a = this.newsResponse) === null || _a === void 0 ? void 0 : _a.data.map((article, articleIndex) => {
-            return (h("div", { class: `col ${this.highlightSpecialArticles && article.attributes.isSpecialArticle ? 'row-span-2 col-span-md-2' : ''}` }, h("aico-news-list-item", { article: article, articleIndex: articleIndex, onArticleClick: e => {
+            return (h("div", { class: `col ${this.highlightTopArticles && article.attributes.isTopNews ? 'row-span-2 col-span-md-2' : ''}` }, h("aico-news-list-item", { article: article, articleIndex: articleIndex, onArticleClick: e => {
                     var _a;
                     (_a = this.articleClick) === null || _a === void 0 ? void 0 : _a.emit(e.detail);
                     e.stopPropagation();
-                }, locale: this.locale })));
+                }, locale: this.locale, highlightTopArticle: this.highlightTopArticles })));
         })), h("nav", { class: "w-100", "aria-label": "News navigation" }, h("ul", { class: "pagination justify-content-center" }, h("li", { class: `page-item page-link user-select-none d-flex align-items-center ${!((_b = this.newsResponse) === null || _b === void 0 ? void 0 : _b.links.prev) ? 'disabled' : ''}`, style: { cursor: 'pointer' }, onClick: () => {
                 if (this.pageNumber > 1) {
                     this.pageNumber -= 1;
@@ -111,7 +111,7 @@ const AicoNewsList$1 = /*@__PURE__*/ proxyCustomElement(class AicoNewsList exten
         "nextButtonText": [1, "next-button-text"],
         "previousButtonText": [1, "previous-button-text"],
         "locale": [1],
-        "highlightSpecialArticles": [4, "highlight-special-articles"],
+        "highlightTopArticles": [4, "highlight-top-articles"],
         "newsResponse": [32],
         "pageNumber": [32],
         "newsChannelsArr": [32],

package/dist/components/aico-news-list.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"aico-news-list.js","mappings":"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","names":["AicoNewsList"],"sources":["src/components/aico-news-list/aico-news-list.css?tag=aico-news-list&encapsulation=scoped","src/components/aico-news-list/aico-news-list.tsx"],"sourcesContent":["@import '../../../node_modules/bootstrap/dist/css/bootstrap.css';\n\n:host,\n:host::before,\n:host::after {\n box-sizing: border-box;\n}\n\n:host {\n font-family: var(--bs-body-font-family);\n font-size: var(--bs-body-font-size);\n font-weight: var(--bs-body-font-weight);\n line-height: var(--bs-body-line-height);\n color: var(--bs-body-color);\n text-align: var(--bs-body-text-align);\n -webkit-text-size-adjust: 100%;\n}\n\n\n.newslist-grid-container {\n display: grid;\n grid-gap: 24px;\n grid-auto-flow: dense;\n \n}\n.row-span-2 {\n grid-row-end: span 2;\n}\n\n\n@media (min-width: 768px) {\n .newslist-grid-container {\n grid-template-columns: repeat(2, 1fr);\n }\n .col-span-md-2 {\n grid-column-end: span 2;\n }\n}\n\n@media (min-width: 992px) {\n .newslist-grid-container {\n grid-template-columns: repeat(4, 1fr);\n }\n}\n\n@media (max-width: 767px) {\n .newslist-grid-container {\n grid-auto-rows: 1fr;\n }\n}","import { Component, Event, EventEmitter, Host, Prop, State, h } from '@stencil/core';\nimport { fetchNewsArticles, splitByComma } from '../../utils/utils';\nimport { NewsResponse } from '../../model/NewsResponse';\nimport { AicoApiRequestInfo } from '../../model/AicoApiRequestInfo';\nimport { Article } from '../../model/Article';\n\n@Component({\n tag: 'aico-news-list',\n styleUrl: 'aico-news-list.css',\n scoped: true,\n})\nexport class AicoNewsList {\n @State() newsResponse?: NewsResponse;\n\n @State() pageNumber = 1;\n\n @State() newsChannelsArr: string[] = [];\n\n @State() newsSellerIdsArr: string[] = [];\n\n @State() newsBrandIdsArr: string[] = [];\n\n @State() newsLanguageLocalesArr: string[] = [];\n\n /*\n The url of the Aico Api that will be used to retrieve the article.\n /\n @Prop() aicoUrl!: string;\n\n /\n The token used to authenticate against he Aico Api.\n /\n @Prop() aicoBearerToken!: string;\n\n /\n Channel names as a comma separated list used to filter the results.\n /\n @Prop() newsChannels: string = '';\n\n /\n Seller ids as a comma separated list used to filter the results.\n /\n @Prop() newsSellerIds: string = '';\n\n /\n Brand ids as a comma separated list used to filter the results.\n /\n @Prop() newsBrandIds: string = '';\n\n /\n Language locales as a comma separated list used to filter the results.\n /\n @Prop() newsLanguageLocales: string = '';\n\n /\n The page size. Prefer this number to be even.\n /\n @Prop() pageSize: number = 16;\n\n /\n The text used by the next button in the pagination component.\n /\n @Prop() nextButtonText: string = 'Next';\n\n /\n The text used by the previous button in the pagination component.\n /\n @Prop() previousButtonText: string = 'Previous';\n\n /\n The article translation that will be used to render the content.\n \n If the locale specified is not present in the article's translations, most content will not be shown.\n /\n @Prop() locale: string = 'de';\n\n /\n Event emitted when a user clicks an article.\n \n The handler receives the entire Article entity.\n /\n @Event() articleClick?: EventEmitter<Article>;\n\n /\n Determines if the special articles are highlighted by taking more space.\n */\n @Prop() highlightSpecialArticles: boolean = false;\n\n private api?: AicoApiRequestInfo;\n private newsListFetchController?: AbortController;\n\n connectedCallback() {\n this.newsListFetchController = new AbortController();\n this.pageNumber = 1;\n\n this.api = { baseApi: this.aicoUrl, bearerToken: this.aicoBearerToken };\n\n this.newsChannelsArr = splitByComma(this.newsChannels);\n this.newsSellerIdsArr = splitByComma(this.newsSellerIds);\n this.newsBrandIdsArr = splitByComma(this.newsBrandIds);\n this.newsLanguageLocalesArr = splitByComma(this.newsLanguageLocales);\n }\n\n disconnectedCallback() {\n this.newsListFetchController!.abort('disconnected');\n }\n\n async componentWillLoad(): Promise<void> {\n this.newsResponse = await fetchNewsArticles(\n this.api!,\n this.pageNumber,\n this.pageSize,\n this.newsListFetchController!.signal,\n this.newsChannelsArr,\n this.newsSellerIdsArr,\n this.newsBrandIdsArr,\n this.newsLanguageLocalesArr,\n );\n }\n\n async componentWillUpdate(): Promise<void> {\n this.newsListFetchController = new AbortController();\n this.newsResponse = await fetchNewsArticles(\n this.api!,\n this.pageNumber,\n this.pageSize,\n this.newsListFetchController.signal,\n this.newsChannelsArr,\n this.newsSellerIdsArr,\n this.newsBrandIdsArr,\n this.newsLanguageLocalesArr,\n );\n }\n\n render() {\n return (\n <Host>\n <div class=\"newslist-grid-container mb-4\">\n {this.newsResponse?.data.map((article, articleIndex) => {\n return (\n <div class={`col ${this.highlightSpecialArticles && article.attributes.isSpecialArticle ? 'row-span-2 col-span-md-2' : ''}`}>\n <aico-news-list-item\n article={article}\n articleIndex={articleIndex}\n onArticleClick={e => {\n this.articleClick?.emit(e.detail);\n e.stopPropagation();\n }}\n locale={this.locale}\n />\n </div>\n );\n })}\n </div>\n <nav class=\"w-100\" aria-label=\"News navigation\">\n <ul class=\"pagination justify-content-center\">\n <li\n class={`page-item page-link user-select-none d-flex align-items-center ${!this.newsResponse?.links.prev ? 'disabled' : ''}`}\n style={{ cursor: 'pointer' }}\n onClick={() => {\n if (this.pageNumber > 1) {\n this.pageNumber -= 1;\n }\n\n return false;\n }}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" class=\"bi bi-chevron-left me-1 fs-4\" style={{ width: '1em', height: '1em' }} viewBox=\"0 0 16 16\">\n <path fill-rule=\"evenodd\" d=\"M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0\" />\n </svg>\n {this.previousButtonText}\n </li>\n {this.getViewablePages().map(page => (\n <li\n class={`page-item page-link user-select-none ${page === '...' ? 'disabled' : Number(page) === this.pageNumber ? 'active' : ''}`}\n style={{ cursor: 'pointer' }}\n onClick={() => {\n if (page !== '...') {\n this.pageNumber = Number(page);\n }\n return false;\n }}\n >\n {page}\n </li>\n ))}\n <li\n class={`page-item page-link user-select-none d-flex align-items-center ${!this.newsResponse?.links.next ? 'disabled' : ''}`}\n style={{ cursor: 'pointer' }}\n onClick={() => {\n if (this.newsResponse?.meta.page.lastPage && this.pageNumber < this.newsResponse?.meta.page.lastPage) {\n this.pageNumber += 1;\n }\n }}\n >\n {this.nextButtonText}\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" class=\"bi bi-chevron-right ms-1 fs-4\" style={{ width: '1em', height: '1em' }} viewBox=\"0 0 16 16\">\n <path fill-rule=\"evenodd\" d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708\" />\n </svg>\n </li>\n </ul>\n </nav>\n </Host>\n );\n }\n\n private getViewablePages(lookAhead: number = 2) {\n const pages: string[] = [];\n if (this.pageNumber - lookAhead >= 2) {\n pages.push('1');\n }\n\n if (this.pageNumber - lookAhead > 2) {\n pages.push('...');\n }\n\n for (let i = this.pageNumber - lookAhead; i < this.pageNumber; i += 1) {\n if (i >= 1) {\n pages.push(`${i}`);\n }\n }\n\n pages.push(`${this.pageNumber}`);\n for (let i = this.pageNumber + 1; i <= this.pageNumber + lookAhead; i += 1) {\n if (i <= (this.newsResponse?.meta.page.lastPage ?? 0)) {\n pages.push(`${i}`);\n }\n }\n\n if (this.pageNumber + lookAhead < (this.newsResponse?.meta.page.lastPage ?? 0) - 1) {\n pages.push('...');\n }\n\n if (this.pageNumber + lookAhead <= (this.newsResponse?.meta.page.lastPage ?? 0) - 1) {\n pages.push(`${this.newsResponse?.meta.page.lastPage}`);\n }\n\n return pages;\n }\n}\n"],"version":3}
1	+ {"file":"aico-news-list.js","mappings":"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","names":["AicoNewsList"],"sources":["src/components/aico-news-list/aico-news-list.css?tag=aico-news-list&encapsulation=scoped","src/components/aico-news-list/aico-news-list.tsx"],"sourcesContent":["@import '../../../node_modules/bootstrap/dist/css/bootstrap.css';\n\n:host,\n:host::before,\n:host::after {\n box-sizing: border-box;\n}\n\n:host {\n font-family: var(--bs-body-font-family);\n font-size: var(--bs-body-font-size);\n font-weight: var(--bs-body-font-weight);\n line-height: var(--bs-body-line-height);\n color: var(--bs-body-color);\n text-align: var(--bs-body-text-align);\n -webkit-text-size-adjust: 100%;\n}\n\n\n.newslist-grid-container {\n display: grid;\n grid-gap: 24px;\n grid-auto-flow: dense;\n \n}\n.row-span-2 {\n grid-row-end: span 2;\n}\n\n\n@media (min-width: 768px) {\n .newslist-grid-container {\n grid-template-columns: repeat(2, 1fr);\n }\n .col-span-md-2 {\n grid-column-end: span 2;\n }\n}\n\n@media (min-width: 992px) {\n .newslist-grid-container {\n grid-template-columns: repeat(4, 1fr);\n }\n}\n\n@media (max-width: 767px) {\n .newslist-grid-container {\n grid-auto-rows: 1fr;\n }\n}","import { Component, Event, EventEmitter, Host, Prop, State, h } from '@stencil/core';\nimport { fetchNewsArticles, splitByComma } from '../../utils/utils';\nimport { NewsResponse } from '../../model/NewsResponse';\nimport { AicoApiRequestInfo } from '../../model/AicoApiRequestInfo';\nimport { Article } from '../../model/Article';\n\n@Component({\n tag: 'aico-news-list',\n styleUrl: 'aico-news-list.css',\n scoped: true,\n})\nexport class AicoNewsList {\n @State() newsResponse?: NewsResponse;\n\n @State() pageNumber = 1;\n\n @State() newsChannelsArr: string[] = [];\n\n @State() newsSellerIdsArr: string[] = [];\n\n @State() newsBrandIdsArr: string[] = [];\n\n @State() newsLanguageLocalesArr: string[] = [];\n\n /*\n The url of the Aico Api that will be used to retrieve the article.\n /\n @Prop() aicoUrl!: string;\n\n /\n The token used to authenticate against he Aico Api.\n /\n @Prop() aicoBearerToken!: string;\n\n /\n Channel names as a comma separated list used to filter the results.\n /\n @Prop() newsChannels: string = '';\n\n /\n Seller ids as a comma separated list used to filter the results.\n /\n @Prop() newsSellerIds: string = '';\n\n /\n Brand ids as a comma separated list used to filter the results.\n /\n @Prop() newsBrandIds: string = '';\n\n /\n Language locales as a comma separated list used to filter the results.\n /\n @Prop() newsLanguageLocales: string = '';\n\n /\n The page size. Prefer this number to be even.\n /\n @Prop() pageSize: number = 16;\n\n /\n The text used by the next button in the pagination component.\n /\n @Prop() nextButtonText: string = 'Next';\n\n /\n The text used by the previous button in the pagination component.\n /\n @Prop() previousButtonText: string = 'Previous';\n\n /\n The article translation that will be used to render the content.\n \n If the locale specified is not present in the article's translations, most content will not be shown.\n /\n @Prop() locale: string = 'de';\n\n /\n Event emitted when a user clicks an article.\n \n The handler receives the entire Article entity.\n /\n @Event() articleClick?: EventEmitter<Article>;\n\n /\n Determines if the top articles are highlighted by taking more space.\n */\n @Prop() highlightTopArticles: boolean = false;\n\n private api?: AicoApiRequestInfo;\n private newsListFetchController?: AbortController;\n\n connectedCallback() {\n this.newsListFetchController = new AbortController();\n this.pageNumber = 1;\n\n this.api = { baseApi: this.aicoUrl, bearerToken: this.aicoBearerToken };\n\n this.newsChannelsArr = splitByComma(this.newsChannels);\n this.newsSellerIdsArr = splitByComma(this.newsSellerIds);\n this.newsBrandIdsArr = splitByComma(this.newsBrandIds);\n this.newsLanguageLocalesArr = splitByComma(this.newsLanguageLocales);\n }\n\n disconnectedCallback() {\n this.newsListFetchController!.abort('disconnected');\n }\n\n async componentWillLoad(): Promise<void> {\n this.newsResponse = await fetchNewsArticles(\n this.api!,\n this.pageNumber,\n this.pageSize,\n this.newsListFetchController!.signal,\n this.newsChannelsArr,\n this.newsSellerIdsArr,\n this.newsBrandIdsArr,\n this.newsLanguageLocalesArr,\n );\n }\n\n async componentWillUpdate(): Promise<void> {\n this.newsListFetchController = new AbortController();\n this.newsResponse = await fetchNewsArticles(\n this.api!,\n this.pageNumber,\n this.pageSize,\n this.newsListFetchController.signal,\n this.newsChannelsArr,\n this.newsSellerIdsArr,\n this.newsBrandIdsArr,\n this.newsLanguageLocalesArr,\n );\n }\n\n render() {\n return (\n <Host>\n <div class=\"newslist-grid-container mb-4\">\n {this.newsResponse?.data.map((article, articleIndex) => {\n return (\n <div class={`col ${this.highlightTopArticles && article.attributes.isTopNews ? 'row-span-2 col-span-md-2' : ''}`}>\n <aico-news-list-item\n article={article}\n articleIndex={articleIndex}\n onArticleClick={e => {\n this.articleClick?.emit(e.detail);\n e.stopPropagation();\n }}\n locale={this.locale}\n highlightTopArticle={this.highlightTopArticles}\n />\n </div>\n );\n })}\n </div>\n <nav class=\"w-100\" aria-label=\"News navigation\">\n <ul class=\"pagination justify-content-center\">\n <li\n class={`page-item page-link user-select-none d-flex align-items-center ${!this.newsResponse?.links.prev ? 'disabled' : ''}`}\n style={{ cursor: 'pointer' }}\n onClick={() => {\n if (this.pageNumber > 1) {\n this.pageNumber -= 1;\n }\n\n return false;\n }}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" class=\"bi bi-chevron-left me-1 fs-4\" style={{ width: '1em', height: '1em' }} viewBox=\"0 0 16 16\">\n <path fill-rule=\"evenodd\" d=\"M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0\" />\n </svg>\n {this.previousButtonText}\n </li>\n {this.getViewablePages().map(page => (\n <li\n class={`page-item page-link user-select-none ${page === '...' ? 'disabled' : Number(page) === this.pageNumber ? 'active' : ''}`}\n style={{ cursor: 'pointer' }}\n onClick={() => {\n if (page !== '...') {\n this.pageNumber = Number(page);\n }\n return false;\n }}\n >\n {page}\n </li>\n ))}\n <li\n class={`page-item page-link user-select-none d-flex align-items-center ${!this.newsResponse?.links.next ? 'disabled' : ''}`}\n style={{ cursor: 'pointer' }}\n onClick={() => {\n if (this.newsResponse?.meta.page.lastPage && this.pageNumber < this.newsResponse?.meta.page.lastPage) {\n this.pageNumber += 1;\n }\n }}\n >\n {this.nextButtonText}\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" class=\"bi bi-chevron-right ms-1 fs-4\" style={{ width: '1em', height: '1em' }} viewBox=\"0 0 16 16\">\n <path fill-rule=\"evenodd\" d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708\" />\n </svg>\n </li>\n </ul>\n </nav>\n </Host>\n );\n }\n\n private getViewablePages(lookAhead: number = 2) {\n const pages: string[] = [];\n if (this.pageNumber - lookAhead >= 2) {\n pages.push('1');\n }\n\n if (this.pageNumber - lookAhead > 2) {\n pages.push('...');\n }\n\n for (let i = this.pageNumber - lookAhead; i < this.pageNumber; i += 1) {\n if (i >= 1) {\n pages.push(`${i}`);\n }\n }\n\n pages.push(`${this.pageNumber}`);\n for (let i = this.pageNumber + 1; i <= this.pageNumber + lookAhead; i += 1) {\n if (i <= (this.newsResponse?.meta.page.lastPage ?? 0)) {\n pages.push(`${i}`);\n }\n }\n\n if (this.pageNumber + lookAhead < (this.newsResponse?.meta.page.lastPage ?? 0) - 1) {\n pages.push('...');\n }\n\n if (this.pageNumber + lookAhead <= (this.newsResponse?.meta.page.lastPage ?? 0) - 1) {\n pages.push(`${this.newsResponse?.meta.page.lastPage}`);\n }\n\n return pages;\n }\n}\n"],"version":3}

package/dist/esm/aico-album-content_26.entry.js CHANGED Viewed

@@ -20630,7 +20630,7 @@ const AicoNewsList = class {
         this.nextButtonText = 'Next';
         this.previousButtonText = 'Previous';
         this.locale = 'de';
-        this.highlightSpecialArticles = false;
+        this.highlightTopArticles = false;
     }
     connectedCallback() {
         this.newsListFetchController = new AbortController();
@@ -20654,11 +20654,11 @@ const AicoNewsList = class {
     render() {
         var _a, _b, _c;
         return (h(Host, null, h("div", { class: "newslist-grid-container mb-4" }, (_a = this.newsResponse) === null || _a === void 0 ? void 0 : _a.data.map((article, articleIndex) => {
-            return (h("div", { class: `col ${this.highlightSpecialArticles && article.attributes.isSpecialArticle ? 'row-span-2 col-span-md-2' : ''}` }, h("aico-news-list-item", { article: article, articleIndex: articleIndex, onArticleClick: e => {
+            return (h("div", { class: `col ${this.highlightTopArticles && article.attributes.isTopNews ? 'row-span-2 col-span-md-2' : ''}` }, h("aico-news-list-item", { article: article, articleIndex: articleIndex, onArticleClick: e => {
                     var _a;
                     (_a = this.articleClick) === null || _a === void 0 ? void 0 : _a.emit(e.detail);
                     e.stopPropagation();
-                }, locale: this.locale })));
+                }, locale: this.locale, highlightTopArticle: this.highlightTopArticles })));
         })), h("nav", { class: "w-100", "aria-label": "News navigation" }, h("ul", { class: "pagination justify-content-center" }, h("li", { class: `page-item page-link user-select-none d-flex align-items-center ${!((_b = this.newsResponse) === null || _b === void 0 ? void 0 : _b.links.prev) ? 'disabled' : ''}`, style: { cursor: 'pointer' }, onClick: () => {
                 if (this.pageNumber > 1) {
                     this.pageNumber -= 1;
@@ -20715,16 +20715,16 @@ const AicoNewsListItem = class {
         this.articleClick = createEvent(this, "articleClick", 7);
         this.article = undefined;
         this.articleIndex = 0;
-        this.highlightSpecialArticle = false;
+        this.highlightTopArticle = false;
         this.locale = 'de';
     }
     render() {
         var _a, _b, _c, _d, _e, _f, _g;
         const translation = this.article.attributes.translations.find(t => t.locale === this.locale);
-        return (h("div", { class: `card h-100 pe-auto ${this.highlightSpecialArticle && this.article.attributes.isSpecialArticle ? 'd-flex flex-column' : ''}`, style: { cursor: 'pointer' }, onClick: () => {
+        return (h("div", { class: `card h-100 pe-auto ${this.highlightTopArticle && this.article.attributes.isTopNews ? 'd-flex flex-column top-article' : ''}`, style: { cursor: 'pointer' }, onClick: () => {
                 var _a;
                 (_a = this.articleClick) === null || _a === void 0 ? void 0 : _a.emit(this.article);
-            } }, h("div", { class: `ratio ratio-16x9 overflow-hidden ${this.highlightSpecialArticle && this.article.attributes.isSpecialArticle ? 'flex-grow-1' : ''}` }, h("img", { class: "object-fit-cover", style: { 'min-height': '15rem' }, alt: "Article image", src: (_e = (_d = (_c = (_b = (_a = translation === null || translation === void 0 ? void 0 : translation.image) !== null && _a !== void 0 ? _a : translation === null || translation === void 0 ? void 0 : translation.optimizedListImage) !== null && _b !== void 0 ? _b : translation === null || translation === void 0 ? void 0 : translation.optimizedImage) !== null && _c !== void 0 ? _c : this.article.attributes.image) !== null && _d !== void 0 ? _d : this.article.attributes.optimizedListImage) !== null && _e !== void 0 ? _e : this.article.attributes.optimizedImage }), h("div", { class: "card-img-overlay d-flex justify-content-end" })), h("div", { class: `card-body ${this.highlightSpecialArticle && this.article.attributes.isSpecialArticle ? 'flex-grow-0' : ''}` }, h("h5", { class: "card-title" }, (_f = translation === null || translation === void 0 ? void 0 : translation.name) !== null && _f !== void 0 ? _f : this.article.attributes.name), h("p", { class: "card-text" }, (_g = translation === null || translation === void 0 ? void 0 : translation.excerpt) !== null && _g !== void 0 ? _g : this.article.attributes.excerpt))));
+            } }, h("div", { class: `ratio ratio-16x9 overflow-hidden ${this.highlightTopArticle && this.article.attributes.isTopNews ? 'flex-grow-1' : ''}` }, h("img", { class: "object-fit-cover", style: { 'min-height': '15rem' }, alt: "Article image", src: (_e = (_d = (_c = (_b = (_a = translation === null || translation === void 0 ? void 0 : translation.image) !== null && _a !== void 0 ? _a : translation === null || translation === void 0 ? void 0 : translation.optimizedListImage) !== null && _b !== void 0 ? _b : translation === null || translation === void 0 ? void 0 : translation.optimizedImage) !== null && _c !== void 0 ? _c : this.article.attributes.image) !== null && _d !== void 0 ? _d : this.article.attributes.optimizedListImage) !== null && _e !== void 0 ? _e : this.article.attributes.optimizedImage }), h("div", { class: "card-img-overlay d-flex justify-content-end" })), h("div", { class: `card-body ${this.highlightTopArticle && this.article.attributes.isTopNews ? 'flex-grow-0' : ''}` }, h("h5", { class: "card-title" }, (_f = translation === null || translation === void 0 ? void 0 : translation.name) !== null && _f !== void 0 ? _f : this.article.attributes.name), h("p", { class: "card-text" }, (_g = translation === null || translation === void 0 ? void 0 : translation.excerpt) !== null && _g !== void 0 ? _g : this.article.attributes.excerpt))));
     }
 };
 AicoNewsListItem.style = aicoNewsListItemCss;