@aiconomy/aico-components 0.0.53 → 0.0.78

package/dist/cjs/loader.cjs.js

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-75c0e002.js');
+const index = require('./index-e52034b7.js');
 
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return undefined;
-  return index.bootstrapLazy([["aico-fetch-article-detail.cjs",[[2,"aico-fetch-article-detail",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"articleId":[1,"article-id"],"article":[32]}]]],["aico-news-list.cjs",[[2,"aico-news-list",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"nextButtonText":[1,"next-button-text"],"previousButtonText":[1,"previous-button-text"],"newsResponse":[32],"pageNumber":[32]}]]],["aico-asking-list-content.cjs",[[6,"aico-asking-list-content"]]],["aico-collection-content.cjs",[[6,"aico-collection-content"]]],["aico-special-news-carousel.cjs",[[2,"aico-special-news-carousel",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"numberOfArticles":[2,"number-of-articles"],"newsResponse":[32]}]]],["bootstrap-slick-test.cjs",[[2,"bootstrap-slick-test"]]],["aico-no-content_2.cjs",[[2,"aico-title-content",{"content":[16]}],[2,"aico-no-content"]]],["aico-album-content_19.cjs",[[2,"aico-bullet-content",{"content":[16]}],[2,"aico-carousel-content",{"content":[16],"hasArrows":[4,"has-arrows"]}],[2,"aico-content-card-content",{"content":[16]}],[2,"aico-heading-content",{"content":[16]}],[2,"aico-table-content",{"content":[16]}],[2,"aico-text-content",{"content":[16]}],[2,"aico-upload-content",{"content":[16]}],[2,"aico-video-content",{"content":[16]}],[2,"aico-html-content",{"content":[16]}],[2,"aico-album-content",{"content":[16]}],[2,"aico-asking-content",{"content":[16]}],[2,"aico-block-quote-content",{"content":[16]}],[2,"aico-divider-content",{"content":[16]}],[2,"aico-document-content",{"content":[16]}],[2,"aico-faq-content",{"content":[16]}],[2,"aico-link-content",{"content":[16]}],[2,"aico-news-content",{"content":[16]}],[2,"aico-page-content",{"content":[16]}],[2,"aico-testimonial-content",{"content":[16]}]]],["aico-article-detail.cjs",[[2,"aico-article-detail",{"article":[16]}]]],["aico-news-list-item.cjs",[[2,"aico-news-list-item",{"article":[16]}]]]], options);
+  return index.bootstrapLazy([["aico-fetch-article-detail.cjs",[[2,"aico-fetch-article-detail",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"locale":[1],"articleId":[1,"article-id"],"articleUrlHandle":[1,"article-url-handle"],"article":[32]}]]],["aico-news-list.cjs",[[2,"aico-news-list",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"newsChannels":[16],"nextButtonText":[1,"next-button-text"],"previousButtonText":[1,"previous-button-text"],"newsResponse":[32],"pageNumber":[32]}]]],["aico-asking-list-content.cjs",[[6,"aico-asking-list-content"]]],["aico-collection-content.cjs",[[6,"aico-collection-content"]]],["aico-special-news-carousel.cjs",[[2,"aico-special-news-carousel",{"aicoUrl":[1,"aico-url"],"aicoBearerToken":[1,"aico-bearer-token"],"newsChannels":[16],"numberOfArticles":[2,"number-of-articles"],"newsResponse":[32]}]]],["aico-no-content_2.cjs",[[2,"aico-title-content",{"content":[16],"locale":[1]}],[2,"aico-no-content"]]],["aico-album-content_19.cjs",[[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]}]]],["aico-article-detail.cjs",[[2,"aico-article-detail",{"article":[16],"locale":[1]}]]],["aico-news-list-item.cjs",[[2,"aico-news-list-item",{"article":[16]}]]]], options);
 };
 
 exports.setNonce = index.setNonce;

package/dist/cjs/{utils-406a9df3.js → utils-c1b7a052.js}

@@ -13,26 +13,32 @@ const getAuthenticatedRequest = (api, route, query, signal) => {
     });
 };
 
-async function fetchNewsArticles(api, page, size, signal) {
+async function fetchNewsArticles(api, page, size, signal, newsChannels = []) {
     const queryParams = new URLSearchParams();
     queryParams.set('page[number]', String(page));
     queryParams.set('page[size]', String(size));
+    queryParams.set('sort', '-publishDate');
     queryParams.set('filter[isActive]', '1');
     queryParams.set('filter[excludeTag][]', 'Eisnull');
-    queryParams.set('sort', '-publishDate');
+    for (const newsChannel of newsChannels) {
+        queryParams.set('filter[channel][]', newsChannel);
+    }
     const request = getAuthenticatedRequest(api, 'news', queryParams, signal);
     const response = await fetch(request);
     return await response.json();
 }
-async function fetchSpecialNewsArticles(api, page, size, signal) {
+async function fetchSpecialNewsArticles(api, page, size, signal, newsChannels = []) {
     const queryParams = new URLSearchParams();
     queryParams.set('page[number]', String(page));
     queryParams.set('page[size]', String(size));
+    queryParams.set('sort', '-publishDate');
     queryParams.set('filter[isActive]', '1');
     queryParams.set('filter[isSpecialArticle]', '1');
     queryParams.set('filter[isLightVersion]', 'true');
     queryParams.set('filter[excludeTag][]', 'Eisnull');
-    queryParams.set('sort', '-publishDate');
+    for (const newsChannel of newsChannels) {
+        queryParams.set('filter[channel][]', newsChannel);
+    }
     const request = getAuthenticatedRequest(api, 'news', queryParams, signal);
     const response = await fetch(request);
     return await response.json();
@@ -43,6 +49,14 @@ async function fetchNewsArticle(api, articleId, signal) {
     const article = await response.json();
     return article.data;
 }
+async function fetchNewsArticleByHandle(api, urlHandle, signal) {
+    const queryParams = new URLSearchParams();
+    queryParams.set('filter[urlHandle]', urlHandle);
+    const request = getAuthenticatedRequest(api, 'news', queryParams, signal);
+    const response = await fetch(request);
+    const articles = await response.json();
+    return articles.data[0];
+}
 function getImageWidthPrc(pictureSize) {
     switch (pictureSize) {
         case 'extra-small':
@@ -82,6 +96,7 @@ function getClass(conditions) {
 }
 
 exports.fetchNewsArticle = fetchNewsArticle;
+exports.fetchNewsArticleByHandle = fetchNewsArticleByHandle;
 exports.fetchNewsArticles = fetchNewsArticles;
 exports.fetchSpecialNewsArticles = fetchSpecialNewsArticles;
 exports.getClass = getClass;
@@ -89,4 +104,4 @@ exports.getImageWidthPrc = getImageWidthPrc;
 exports.getYoutubeURL = getYoutubeURL;
 exports.strIsNullOrEmptyOrWhitespace = strIsNullOrEmptyOrWhitespace;
 
-//# sourceMappingURL=utils-406a9df3.js.map
+//# sourceMappingURL=utils-c1b7a052.js.map

package/dist/cjs/utils-c1b7a052.js.map

@@ -0,0 +1 @@
+{"file":"utils-c1b7a052.js","mappings":"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","names":[],"sources":["src/model/AicoApiRequestInfo.ts","src/utils/utils.ts"],"sourcesContent":["export type AicoApiRequestInfo = {\n  baseApi: string;\n  bearerToken: string;\n};\n\nexport const getAuthenticatedHeaders = (bearerToken: string): Headers => {\n  const headers = new Headers();\n  headers.append('Accept', 'application/vnd.api+json');\n  headers.append('Authorization', `Bearer ${bearerToken}`);\n  return headers;\n};\n\nexport const getAuthenticatedRequest = (api: AicoApiRequestInfo, route: string, query: URLSearchParams, signal?: AbortSignal): Request => {\n  return new Request(new URL(`${route}?${query.toString()}`, api.baseApi), {\n    headers: getAuthenticatedHeaders(api.bearerToken),\n    signal,\n  });\n};\n","import { Article } from '../components';\nimport { AicoApiRequestInfo, getAuthenticatedHeaders, getAuthenticatedRequest } from '../model/AicoApiRequestInfo';\nimport { NewsResponse } from '../model/NewsResponse';\n\nexport async function fetchNewsArticles(api: AicoApiRequestInfo, page: number, size: number, signal: AbortSignal, newsChannels: string[] = []): Promise<NewsResponse> {\n  const queryParams = new URLSearchParams();\n  queryParams.set('page[number]', String(page));\n  queryParams.set('page[size]', String(size));\n  queryParams.set('sort', '-publishDate');\n  queryParams.set('filter[isActive]', '1');\n  queryParams.set('filter[excludeTag][]', 'Eisnull');\n  for (const newsChannel of newsChannels) {\n    queryParams.set('filter[channel][]', newsChannel);\n  }\n\n  const request = getAuthenticatedRequest(api, 'news', queryParams, signal);\n  const response = await fetch(request);\n  return await response.json();\n}\n\nexport async function fetchSpecialNewsArticles(api: AicoApiRequestInfo, page: number, size: number, signal: AbortSignal, newsChannels: string[] = []): Promise<NewsResponse> {\n  const queryParams = new URLSearchParams();\n  queryParams.set('page[number]', String(page));\n  queryParams.set('page[size]', String(size));\n  queryParams.set('sort', '-publishDate');\n  queryParams.set('filter[isActive]', '1');\n  queryParams.set('filter[isSpecialArticle]', '1');\n  queryParams.set('filter[isLightVersion]', 'true');\n  queryParams.set('filter[excludeTag][]', 'Eisnull');\n  for (const newsChannel of newsChannels) {\n    queryParams.set('filter[channel][]', newsChannel);\n  }\n\n  const request = getAuthenticatedRequest(api, 'news', queryParams, signal);\n  const response = await fetch(request);\n  return await response.json();\n}\n\nexport async function fetchNewsArticle(api: AicoApiRequestInfo, articleId: string, signal: AbortSignal): Promise<Article> {\n  const request = getAuthenticatedRequest(api, `news/${articleId}`, new URLSearchParams(), signal);\n  const response = await fetch(request);\n  const article = await response.json();\n  return article.data;\n}\n\nexport async function fetchNewsArticleByHandle(api: AicoApiRequestInfo, urlHandle: string, signal: AbortSignal): Promise<Article> {\n  const queryParams = new URLSearchParams();\n  queryParams.set('filter[urlHandle]', urlHandle);\n\n  const request = getAuthenticatedRequest(api, 'news', queryParams, signal);\n  const response = await fetch(request);\n  const articles = await response.json();\n  return articles.data[0];\n}\n\nexport async function fetchArticle(url: string, bearerToken: string, signal: AbortSignal): Promise<Article> {\n  const request = new Request(new URL(url), {\n    headers: getAuthenticatedHeaders(bearerToken),\n    signal,\n  });\n  const response = await fetch(request);\n  return await response.json();\n}\n\nexport function getImageWidthPrc(pictureSize?: string): string {\n  switch (pictureSize) {\n    case 'extra-small':\n      return '28%';\n    case 'small':\n      return '40%';\n    case 'large':\n      return '80%';\n    case 'extra large': // TODO: has - or not?\n      return '100%';\n    default:\n      return '60%';\n  }\n}\n\nexport function getYoutubeURL(url: string): string | null {\n  const regExp = /.*(?:youtu.be\\/|v\\/|u\\/\\w\\/|embed\\/|watch\\?v=)([^#&?]*).*/;\n  const match = url.match(regExp);\n  if (match && match[1].length == 11) {\n    return `https://www.youtube.com/embed/${match[1]}`;\n  }\n\n  return null;\n}\n\nexport function strIsNullOrEmptyOrWhitespace(str?: string | null): boolean {\n  if (!str || str === ' ') {\n    return true;\n  }\n\n  return false;\n}\n\nexport function getClass(conditions: { [key: string]: boolean }): string {\n  const classes: string[] = [];\n  for (const kvp of Object.entries(conditions)) {\n    if (kvp[1]) {\n      classes.push(kvp[0]);\n    }\n  }\n\n  return classes.join(' ');\n}\n"],"version":3}

package/dist/collection/collection-manifest.json

@@ -5,7 +5,6 @@
     "components/aico-news-list/aico-news-list.js",
     "components/aico-news-list-item/aico-news-list-item.js",
     "components/aico-special-news-carousel/aico-special-news-carousel.js",
-    "components/bootstrap-slick-test/bootstrap-slick-test.js",
     "components/content/aico-album-content/aico-album-content.js",
     "components/content/aico-asking-content/aico-asking-content.js",
     "components/content/aico-asking-list-content/aico-asking-list-content.js",

package/dist/collection/components/aico-article-detail/aico-article-detail.js

@@ -4,6 +4,7 @@ export class AicoArticleDetail {
     constructor() {
         this.dateOptions = { day: 'numeric', month: 'long', year: 'numeric' };
         this.article = undefined;
+        this.locale = 'de';
     }
     render() {
         const articleDate = new Date(this.article.attributes.publishDate);
@@ -26,43 +27,43 @@ export class AicoArticleDetail {
             case ContentType.ALBUM:
                 return h("aico-album-content", { content: content });
             case ContentType.ASKING:
-                return h("aico-asking-content", { content: content });
+                return h("aico-asking-content", { content: content, locale: this.locale });
             case ContentType.BLOCK_QUOTE:
-                return h("aico-block-quote-content", { content: content });
+                return h("aico-block-quote-content", { content: content, locale: this.locale });
             case ContentType.BULLET:
-                return h("aico-bullet-content", { content: content });
+                return h("aico-bullet-content", { content: content, locale: this.locale });
             case ContentType.CAROUSEL:
-                return h("aico-carousel-content", { content: content });
+                return h("aico-carousel-content", { content: content, locale: this.locale });
             case ContentType.CONTENT_CARD:
-                return h("aico-content-card-content", { content: content });
+                return h("aico-content-card-content", { content: content, locale: this.locale });
             case ContentType.DIVIDER:
-                return h("aico-divider-content", { content: content });
+                return h("aico-divider-content", { content: content, locale: this.locale });
             case ContentType.DOCUMENT:
-                return h("aico-document-content", { content: content });
+                return h("aico-document-content", { content: content, locale: this.locale });
             case ContentType.FAQ:
-                return h("aico-faq-content", { content: content });
+                return h("aico-faq-content", { content: content, locale: this.locale });
             case ContentType.HEADING:
-                return h("aico-heading-content", { content: content });
+                return h("aico-heading-content", { content: content, locale: this.locale });
             case ContentType.HTML:
-                return h("aico-html-content", { content: content });
+                return h("aico-html-content", { content: content, locale: this.locale });
             case ContentType.LINK:
-                return h("aico-link-content", { content: content });
+                return h("aico-link-content", { content: content, locale: this.locale });
             case ContentType.NEWS:
                 return h("aico-news-content", { content: content });
             case ContentType.PAGE:
-                return h("aico-page-content", { content: content });
+                return h("aico-page-content", { content: content, locale: this.locale });
             case ContentType.TABLE:
-                return h("aico-table-content", { content: content });
+                return h("aico-table-content", { content: content, locale: this.locale });
             case ContentType.TESTIMONIAL:
                 return h("aico-testimonial-content", { content: content });
             case ContentType.TEXT:
-                return h("aico-text-content", { content: content });
+                return h("aico-text-content", { content: content, locale: this.locale });
             case ContentType.TITLE:
-                return h("aico-title-content", { content: content });
+                return h("aico-title-content", { content: content, locale: this.locale });
             case ContentType.UPLOAD:
-                return h("aico-upload-content", { content: content });
+                return h("aico-upload-content", { content: content, locale: this.locale });
             case ContentType.VIDEO:
-                return h("aico-video-content", { content: content });
+                return h("aico-video-content", { content: content, locale: this.locale });
             case ContentType.PRODUCT:
             case ContentType.AGENDA:
             case ContentType.LIST_ASKING:
@@ -110,6 +111,24 @@ export class AicoArticleDetail {
                     "tags": [],
                     "text": ""
                 }
+            },
+            "locale": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "locale",
+                "reflect": false,
+                "defaultValue": "'de'"
             }
         };
     }

package/dist/collection/components/aico-article-detail/aico-article-detail.js.map

@@ -1 +1 @@
-{"version":3,"file":"aico-article-detail.js","sourceRoot":"","sources":["../../../src/components/aico-article-detail/aico-article-detail.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\nimport { ContentType } from '../../model/article/ContentType';\nimport type { Article, ArticleContent, ArticleContentBuilderColumn, ArticleContentBuilderRow } from '../../model/Article';\nimport type { HtmlContent } from '../../model/article/content/HtmlContent';\nimport type { AlbumContent } from '../../model/article/content/AlbumContent';\nimport type { TitleContent } from '../../model/article/content/TitleContent';\nimport type { BlockQuoteContent } from '../../model/article/content/BlockQuoteContent';\nimport type { BulletContent } from '../../model/article/content/BulletContent';\nimport type { CardContent } from '../../model/article/content/CardContent';\nimport type { CarouselContent } from '../../model/article/content/CarouselContent';\nimport type { DividerContent } from '../../model/article/content/DividerContent';\nimport type { DocumentContent } from '../../model/article/content/DocumentContent';\nimport type { HeadingContent } from '../../model/article/content/HeadingContent';\nimport type { LinkContent } from '../../model/article/content/LinkContent';\nimport type { TableContent } from '../../model/article/content/TableContet';\nimport type { TestimonialContent } from '../../model/article/content/TestimonialContent';\nimport type { TextContent } from '../../model/article/content/TextContent';\nimport type { VideoContent } from '../../model/article/content/VideoContent';\nimport type { AskingContent } from '../../model/article/content/AskingContent';\nimport type { FaqContent } from '../../model/article/content/FaqContent';\nimport type { NewsContent } from '../../model/article/content/NewsContent';\nimport type { PageContent } from '../../model/article/content/PageContent';\nimport type { UploadContent } from '../../model/article/content/UploadContent';\n\n@Component({\n  tag: 'aico-article-detail',\n  styleUrl: 'aico-article-detail.css',\n  scoped: true,\n})\nexport class AicoArticleDetail {\n  @Prop() article!: Article;\n\n  private readonly dateOptions: Intl.DateTimeFormatOptions = { day: 'numeric', month: 'long', year: 'numeric' };\n\n  render() {\n    const articleDate = new Date(this.article.attributes.publishDate);\n    const content = this.article.attributes.contentBuilder.rows.sort((a, b) => a.order - b.order).map((row, index) => this.mapRowContent(row, index));\n    return (\n      <Host>\n        <figure>\n          <blockquote class=\"blockquote\">\n            <h2 class=\"text-uppercase\">{this.article.attributes.name}</h2>\n          </blockquote>\n          <figcaption class=\"blockquote-footer\">\n            {articleDate.toLocaleDateString('en-US', this.dateOptions)} by <cite title=\"Author\">{this.article.attributes.author}</cite>\n          </figcaption>\n        </figure>\n        <div class=\"content-wrapper\">{content}</div>\n      </Host>\n    );\n  }\n\n  private mapRowContent(row: ArticleContentBuilderRow, index: number) {\n    const rowContent = row.columns.map((column, columnIndex) => this.mapColumnContent(column, columnIndex));\n    return <div class={`content-row content-row-index-${index}`}>{rowContent}</div>;\n  }\n\n  private mapColumnContent(column: ArticleContentBuilderColumn, index: number) {\n    const columnContent = column.contentContainer.contents.sort((a, b) => (a.sort ?? 0) - (b.sort ?? 0)).map((content, contentIndex) => this.mapContent(content, contentIndex));\n    return <div class={`content-column content-column-index-${index}`}>{columnContent}</div>;\n  }\n\n  private mapContent(content: ArticleContent, index: number) {\n    return <div class={`content-data-wrapper content-data-wrapper-index-${index}`}>{this.mapContentData(content.type, content.contentData)}</div>;\n  }\n\n  private mapContentData(contentType: ContentType | undefined, content: object) {\n    switch (contentType) {\n      case ContentType.ALBUM:\n        return <aico-album-content content={content as AlbumContent} />;\n\n      case ContentType.ASKING:\n        return <aico-asking-content content={content as AskingContent} />;\n\n      case ContentType.BLOCK_QUOTE:\n        return <aico-block-quote-content content={content as BlockQuoteContent} />;\n\n      case ContentType.BULLET:\n        return <aico-bullet-content content={content as BulletContent} />;\n\n      case ContentType.CAROUSEL:\n        return <aico-carousel-content content={content as CarouselContent} />;\n\n      case ContentType.CONTENT_CARD:\n        return <aico-content-card-content content={content as CardContent} />;\n\n      case ContentType.DIVIDER:\n        return <aico-divider-content content={content as DividerContent} />;\n\n      case ContentType.DOCUMENT:\n        return <aico-document-content content={content as DocumentContent} />;\n\n      case ContentType.FAQ:\n        return <aico-faq-content content={content as FaqContent} />;\n\n      case ContentType.HEADING:\n        return <aico-heading-content content={content as HeadingContent} />;\n\n      case ContentType.HTML:\n        return <aico-html-content content={content as HtmlContent} />;\n\n      case ContentType.LINK:\n        return <aico-link-content content={content as LinkContent} />;\n\n      case ContentType.NEWS:\n        return <aico-news-content content={content as NewsContent} />;\n\n      case ContentType.PAGE:\n        return <aico-page-content content={content as PageContent} />;\n\n      case ContentType.TABLE:\n        return <aico-table-content content={content as TableContent} />;\n\n      case ContentType.TESTIMONIAL:\n        return <aico-testimonial-content content={content as TestimonialContent} />;\n\n      case ContentType.TEXT:\n        return <aico-text-content content={content as TextContent} />;\n\n      case ContentType.TITLE:\n        return <aico-title-content content={content as TitleContent} />;\n\n      case ContentType.UPLOAD:\n        return <aico-upload-content content={content as UploadContent} />;\n\n      case ContentType.VIDEO:\n        return <aico-video-content content={content as VideoContent} />;\n\n      case ContentType.PRODUCT:\n      case ContentType.AGENDA:\n      case ContentType.LIST_ASKING:\n      case ContentType.LIST_AGENDA:\n      case ContentType.CRM:\n      case ContentType.B2B:\n      case ContentType.FORM_BUILDER:\n      case ContentType.COURSE:\n      case ContentType.COLLECTION:\n      default:\n        return <div class=\"content-data content-data-not-handled\">Content type not handled.</div>;\n    }\n  }\n}\n"]}
+{"version":3,"file":"aico-article-detail.js","sourceRoot":"","sources":["../../../src/components/aico-article-detail/aico-article-detail.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\nimport { ContentType } from '../../model/article/ContentType';\nimport type { Article, ArticleContent, ArticleContentBuilderColumn, ArticleContentBuilderRow } from '../../model/Article';\nimport type { HtmlContent } from '../../model/article/content/HtmlContent';\nimport type { AlbumContent } from '../../model/article/content/AlbumContent';\nimport type { TitleContent } from '../../model/article/content/TitleContent';\nimport type { BlockQuoteContent } from '../../model/article/content/BlockQuoteContent';\nimport type { BulletContent } from '../../model/article/content/BulletContent';\nimport type { CardContent } from '../../model/article/content/CardContent';\nimport type { CarouselContent } from '../../model/article/content/CarouselContent';\nimport type { DividerContent } from '../../model/article/content/DividerContent';\nimport type { DocumentContent } from '../../model/article/content/DocumentContent';\nimport type { HeadingContent } from '../../model/article/content/HeadingContent';\nimport type { LinkContent } from '../../model/article/content/LinkContent';\nimport type { TableContent } from '../../model/article/content/TableContet';\nimport type { TestimonialContent } from '../../model/article/content/TestimonialContent';\nimport type { TextContent } from '../../model/article/content/TextContent';\nimport type { VideoContent } from '../../model/article/content/VideoContent';\nimport type { AskingContent } from '../../model/article/content/AskingContent';\nimport type { FaqContent } from '../../model/article/content/FaqContent';\nimport type { NewsContent } from '../../model/article/content/NewsContent';\nimport type { PageContent } from '../../model/article/content/PageContent';\nimport type { UploadContent } from '../../model/article/content/UploadContent';\n\n@Component({\n  tag: 'aico-article-detail',\n  styleUrl: 'aico-article-detail.css',\n  scoped: true,\n})\nexport class AicoArticleDetail {\n  @Prop() article!: Article;\n\n  @Prop() locale: string = 'de';\n\n  private readonly dateOptions: Intl.DateTimeFormatOptions = { day: 'numeric', month: 'long', year: 'numeric' };\n\n  render() {\n    const articleDate = new Date(this.article.attributes.publishDate);\n    const content = this.article.attributes.contentBuilder.rows.sort((a, b) => a.order - b.order).map((row, index) => this.mapRowContent(row, index));\n    return (\n      <Host>\n        <figure>\n          <blockquote class=\"blockquote\">\n            <h2 class=\"text-uppercase\">{this.article.attributes.name}</h2>\n          </blockquote>\n          <figcaption class=\"blockquote-footer\">\n            {articleDate.toLocaleDateString('en-US', this.dateOptions)} by <cite title=\"Author\">{this.article.attributes.author}</cite>\n          </figcaption>\n        </figure>\n        <div class=\"content-wrapper\">{content}</div>\n      </Host>\n    );\n  }\n\n  private mapRowContent(row: ArticleContentBuilderRow, index: number) {\n    const rowContent = row.columns.map((column, columnIndex) => this.mapColumnContent(column, columnIndex));\n    return <div class={`content-row content-row-index-${index}`}>{rowContent}</div>;\n  }\n\n  private mapColumnContent(column: ArticleContentBuilderColumn, index: number) {\n    const columnContent = column.contentContainer.contents.sort((a, b) => (a.sort ?? 0) - (b.sort ?? 0)).map((content, contentIndex) => this.mapContent(content, contentIndex));\n    return <div class={`content-column content-column-index-${index}`}>{columnContent}</div>;\n  }\n\n  private mapContent(content: ArticleContent, index: number) {\n    return <div class={`content-data-wrapper content-data-wrapper-index-${index}`}>{this.mapContentData(content.type, content.contentData)}</div>;\n  }\n\n  private mapContentData(contentType: ContentType | undefined, content: object) {\n    switch (contentType) {\n      case ContentType.ALBUM:\n        return <aico-album-content content={content as AlbumContent} />;\n\n      case ContentType.ASKING:\n        return <aico-asking-content content={content as AskingContent} locale={this.locale} />;\n\n      case ContentType.BLOCK_QUOTE:\n        return <aico-block-quote-content content={content as BlockQuoteContent} locale={this.locale} />;\n\n      case ContentType.BULLET:\n        return <aico-bullet-content content={content as BulletContent} locale={this.locale} />;\n\n      case ContentType.CAROUSEL:\n        return <aico-carousel-content content={content as CarouselContent} locale={this.locale} />;\n\n      case ContentType.CONTENT_CARD:\n        return <aico-content-card-content content={content as CardContent} locale={this.locale} />;\n\n      case ContentType.DIVIDER:\n        return <aico-divider-content content={content as DividerContent} locale={this.locale} />;\n\n      case ContentType.DOCUMENT:\n        return <aico-document-content content={content as DocumentContent} locale={this.locale} />;\n\n      case ContentType.FAQ:\n        return <aico-faq-content content={content as FaqContent} locale={this.locale} />;\n\n      case ContentType.HEADING:\n        return <aico-heading-content content={content as HeadingContent} locale={this.locale} />;\n\n      case ContentType.HTML:\n        return <aico-html-content content={content as HtmlContent} locale={this.locale} />;\n\n      case ContentType.LINK:\n        return <aico-link-content content={content as LinkContent} locale={this.locale} />;\n\n      case ContentType.NEWS:\n        return <aico-news-content content={content as NewsContent} />;\n\n      case ContentType.PAGE:\n        return <aico-page-content content={content as PageContent} locale={this.locale} />;\n\n      case ContentType.TABLE:\n        return <aico-table-content content={content as TableContent} locale={this.locale} />;\n\n      case ContentType.TESTIMONIAL:\n        return <aico-testimonial-content content={content as TestimonialContent} />;\n\n      case ContentType.TEXT:\n        return <aico-text-content content={content as TextContent} locale={this.locale} />;\n\n      case ContentType.TITLE:\n        return <aico-title-content content={content as TitleContent} locale={this.locale} />;\n\n      case ContentType.UPLOAD:\n        return <aico-upload-content content={content as UploadContent} locale={this.locale} />;\n\n      case ContentType.VIDEO:\n        return <aico-video-content content={content as VideoContent} locale={this.locale} />;\n\n      case ContentType.PRODUCT:\n      case ContentType.AGENDA:\n      case ContentType.LIST_ASKING:\n      case ContentType.LIST_AGENDA:\n      case ContentType.CRM:\n      case ContentType.B2B:\n      case ContentType.FORM_BUILDER:\n      case ContentType.COURSE:\n      case ContentType.COLLECTION:\n      default:\n        return <div class=\"content-data content-data-not-handled\">Content type not handled.</div>;\n    }\n  }\n}\n"]}

package/dist/collection/components/aico-fetch-article-detail/aico-fetch-article-detail.js

@@ -1,11 +1,13 @@
-import { Host, h } from "@stencil/core";
-import { fetchNewsArticle } from "../../utils/utils";
+import { h } from "@stencil/core";
+import { fetchNewsArticle, fetchNewsArticleByHandle } from "../../utils/utils";
 export class AicoFetchArticleDetail {
     constructor() {
         this.article = undefined;
         this.aicoUrl = undefined;
         this.aicoBearerToken = undefined;
+        this.locale = 'de';
         this.articleId = undefined;
+        this.articleUrlHandle = undefined;
     }
     connectedCallback() {
         this.articleFetchController = new AbortController();
@@ -15,10 +17,17 @@ export class AicoFetchArticleDetail {
         this.articleFetchController.abort('disconnected');
     }
     async componentWillLoad() {
+        if (!this.articleId && !this.articleUrlHandle) {
+            throw new Error('Either the article id or the url handle must be provided.');
+        }
+        if (this.articleUrlHandle) {
+            this.article = await fetchNewsArticleByHandle(this.api, this.articleUrlHandle, this.articleFetchController.signal);
+            return;
+        }
         this.article = await fetchNewsArticle(this.api, this.articleId, this.articleFetchController.signal);
     }
     render() {
-        return (h(Host, null, h("aico-article-detail", { article: this.article })));
+        return h("aico-article-detail", { article: this.article, locale: this.locale });
     }
     static get is() { return "aico-fetch-article-detail"; }
     static get encapsulation() { return "scoped"; }
@@ -68,7 +77,7 @@ export class AicoFetchArticleDetail {
                 "attribute": "aico-bearer-token",
                 "reflect": false
             },
-            "articleId": {
+            "locale": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -76,14 +85,49 @@ export class AicoFetchArticleDetail {
                     "resolved": "string",
                     "references": {}
                 },
-                "required": true,
+                "required": false,
                 "optional": false,
                 "docs": {
                     "tags": [],
                     "text": ""
                 },
+                "attribute": "locale",
+                "reflect": false,
+                "defaultValue": "'de'"
+            },
+            "articleId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The id will be used to fetch the article.\n\nIf both the {@link AicoFetchArticleDetail#articleId } and {@link AicoFetchArticleDetail#articleUrlHandle } are\nprovided, the latter will be used. If neither are provided, an error is thrown."
+                },
                 "attribute": "article-id",
                 "reflect": false
+            },
+            "articleUrlHandle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The url handle will be used to fetch the article.\n\nIf both the {@link AicoFetchArticleDetail#articleId } and {@link AicoFetchArticleDetail#articleUrlHandle } are\nprovided, the latter will be used. If neither are provided, an error is thrown."
+                },
+                "attribute": "article-url-handle",
+                "reflect": false
             }
         };
     }

package/dist/collection/components/aico-fetch-article-detail/aico-fetch-article-detail.js.map

@@ -1 +1 @@
-{"version":3,"file":"aico-fetch-article-detail.js","sourceRoot":"","sources":["../../../src/components/aico-fetch-article-detail/aico-fetch-article-detail.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AASrD,MAAM,OAAO,sBAAsB;;;;;;;IAYjC,iBAAiB;QACf,IAAI,CAAC,sBAAsB,GAAG,IAAI,eAAe,EAAE,CAAC;QACpD,IAAI,CAAC,GAAG,GAAG,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,WAAW,EAAE,IAAI,CAAC,eAAe,EAAE,CAAC;IAC1E,CAAC;IAED,oBAAoB;QAClB,IAAI,CAAC,sBAAuB,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC;IACrD,CAAC;IAED,KAAK,CAAC,iBAAiB;QACrB,IAAI,CAAC,OAAO,GAAG,MAAM,gBAAgB,CAAC,IAAI,CAAC,GAAI,EAAE,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,sBAAuB,CAAC,MAAM,CAAC,CAAC;IACxG,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,2BAAqB,OAAO,EAAE,IAAI,CAAC,OAAO,GAAI,CACzC,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, State, h } from '@stencil/core';\nimport { fetchNewsArticle } from '../../utils/utils';\nimport { Article } from '../../model/Article';\nimport { AicoApiRequestInfo } from '../../model/AicoApiRequestInfo';\n\n@Component({\n  tag: 'aico-fetch-article-detail',\n  styleUrl: 'aico-fetch-article-detail.css',\n  scoped: true,\n})\nexport class AicoFetchArticleDetail {\n  @State() article!: Article;\n\n  @Prop() aicoUrl!: string;\n\n  @Prop() aicoBearerToken!: string;\n\n  @Prop() articleId!: string;\n\n  private api?: AicoApiRequestInfo;\n  private articleFetchController?: AbortController;\n\n  connectedCallback() {\n    this.articleFetchController = new AbortController();\n    this.api = { baseApi: this.aicoUrl, bearerToken: this.aicoBearerToken };\n  }\n\n  disconnectedCallback() {\n    this.articleFetchController!.abort('disconnected');\n  }\n\n  async componentWillLoad(): Promise<void> {\n    this.article = await fetchNewsArticle(this.api!, this.articleId, this.articleFetchController!.signal);\n  }\n\n  render() {\n    return (\n      <Host>\n        <aico-article-detail article={this.article} />\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"aico-fetch-article-detail.js","sourceRoot":"","sources":["../../../src/components/aico-fetch-article-detail/aico-fetch-article-detail.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAC1D,OAAO,EAAE,gBAAgB,EAAE,wBAAwB,EAAE,MAAM,mBAAmB,CAAC;AAS/E,MAAM,OAAO,sBAAsB;;;;;sBAOR,IAAI;;;;IAqB7B,iBAAiB;QACf,IAAI,CAAC,sBAAsB,GAAG,IAAI,eAAe,EAAE,CAAC;QACpD,IAAI,CAAC,GAAG,GAAG,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,WAAW,EAAE,IAAI,CAAC,eAAe,EAAE,CAAC;IAC1E,CAAC;IAED,oBAAoB;QAClB,IAAI,CAAC,sBAAuB,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC;IACrD,CAAC;IAED,KAAK,CAAC,iBAAiB;QACrB,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,gBAAgB,EAAE;YAC7C,MAAM,IAAI,KAAK,CAAC,2DAA2D,CAAC,CAAC;SAC9E;QAED,IAAI,IAAI,CAAC,gBAAgB,EAAE;YACzB,IAAI,CAAC,OAAO,GAAG,MAAM,wBAAwB,CAAC,IAAI,CAAC,GAAI,EAAE,IAAI,CAAC,gBAAgB,EAAE,IAAI,CAAC,sBAAuB,CAAC,MAAM,CAAC,CAAC;YACrH,OAAO;SACR;QAED,IAAI,CAAC,OAAO,GAAG,MAAM,gBAAgB,CAAC,IAAI,CAAC,GAAI,EAAE,IAAI,CAAC,SAAU,EAAE,IAAI,CAAC,sBAAuB,CAAC,MAAM,CAAC,CAAC;IACzG,CAAC;IAED,MAAM;QACJ,OAAO,2BAAqB,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,GAAI,CAAC;IAC7E,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, State, h } from '@stencil/core';\nimport { fetchNewsArticle, fetchNewsArticleByHandle } from '../../utils/utils';\nimport { Article } from '../../model/Article';\nimport { AicoApiRequestInfo } from '../../model/AicoApiRequestInfo';\n\n@Component({\n  tag: 'aico-fetch-article-detail',\n  styleUrl: 'aico-fetch-article-detail.css',\n  scoped: true,\n})\nexport class AicoFetchArticleDetail {\n  @State() article!: Article;\n\n  @Prop() aicoUrl!: string;\n\n  @Prop() aicoBearerToken!: string;\n\n  @Prop() locale: string = 'de';\n\n  /**\n   * The id will be used to fetch the article.\n   *\n   * If both the {@link AicoFetchArticleDetail#articleId} and {@link AicoFetchArticleDetail#articleUrlHandle} are\n   * provided, the latter will be used. If neither are provided, an error is thrown.\n   */\n  @Prop() articleId?: string;\n\n  /**\n   * The url handle will be used to fetch the article.\n   *\n   * If both the {@link AicoFetchArticleDetail#articleId} and {@link AicoFetchArticleDetail#articleUrlHandle} are\n   * provided, the latter will be used. If neither are provided, an error is thrown.\n   */\n  @Prop() articleUrlHandle?: string;\n\n  private api?: AicoApiRequestInfo;\n  private articleFetchController?: AbortController;\n\n  connectedCallback() {\n    this.articleFetchController = new AbortController();\n    this.api = { baseApi: this.aicoUrl, bearerToken: this.aicoBearerToken };\n  }\n\n  disconnectedCallback() {\n    this.articleFetchController!.abort('disconnected');\n  }\n\n  async componentWillLoad(): Promise<void> {\n    if (!this.articleId && !this.articleUrlHandle) {\n      throw new Error('Either the article id or the url handle must be provided.');\n    }\n\n    if (this.articleUrlHandle) {\n      this.article = await fetchNewsArticleByHandle(this.api!, this.articleUrlHandle, this.articleFetchController!.signal);\n      return;\n    }\n\n    this.article = await fetchNewsArticle(this.api!, this.articleId!, this.articleFetchController!.signal);\n  }\n\n  render() {\n    return <aico-article-detail article={this.article} locale={this.locale} />;\n  }\n}\n"]}

package/dist/collection/components/aico-fetch-article-detail/aico-fetch-article-detail.stories.js

@@ -1,5 +1,11 @@
 const meta = {
     component: 'aico-fetch-article-detail',
+    argTypes: {
+        aicoUrl: { type: 'string', description: 'The Aico api url.' },
+        aicoBearerToken: { type: 'string', description: 'The Aico api access token.' },
+        articleId: { type: 'string' },
+        articleUrlHandle: { type: 'string' },
+    },
 };
 export default meta;
 export const Kj = {

package/dist/collection/components/aico-fetch-article-detail/aico-fetch-article-detail.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"aico-fetch-article-detail.stories.js","sourceRoot":"","sources":["../../../src/components/aico-fetch-article-detail/aico-fetch-article-detail.stories.ts"],"names":[],"mappings":"AAGA,MAAM,IAAI,GAAqC;IAC7C,SAAS,EAAE,2BAA2B;CACvC,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,EAAE,GAAU;IACvB,IAAI,EAAE;QACJ,OAAO,EAAE,0CAA0C;QACnD,eAAe,EAAE,kDAAkD;QACnE,SAAS,EAAE,IAAI;KAChB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,GAAG,GAAU;IACxB,IAAI,EAAE;QACJ,OAAO,EAAE,sCAAsC;QAC/C,eAAe,EAAE,0CAA0C;QAC3D,SAAS,EAAE,OAAO;KACnB;CACF,CAAC","sourcesContent":["import type { Meta, StoryObj } from '@storybook/web-components';\nimport { JSX } from '../../components';\n\nconst meta: Meta<JSX.AicoFetchArticleDetail> = {\n  component: 'aico-fetch-article-detail',\n};\n\nexport default meta;\n\ntype Story = StoryObj;\n\nexport const Kj: Story = {\n  args: {\n    aicoUrl: 'https://kj-acceptance.aico.swiss/api/v1/',\n    aicoBearerToken: 'Sq4WkveRPJ64SHR9zqZW8oLjIDjnlBg0gXHSuIMweb966802',\n    articleId: '32',\n  },\n};\n\nexport const Fcz: Story = {\n  args: {\n    aicoUrl: 'https://app.aico.swiss/19838/api/v1/',\n    aicoBearerToken: 'B3NXuTbnCeppJl9NHu27Kjs7Hm3EOKSGCkR6CVwO',\n    articleId: '44239',\n  },\n};\n"]}
+{"version":3,"file":"aico-fetch-article-detail.stories.js","sourceRoot":"","sources":["../../../src/components/aico-fetch-article-detail/aico-fetch-article-detail.stories.ts"],"names":[],"mappings":"AAGA,MAAM,IAAI,GAAqC;IAC7C,SAAS,EAAE,2BAA2B;IACtC,QAAQ,EAAE;QACR,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,mBAAmB,EAAE;QAC7D,eAAe,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,4BAA4B,EAAE;QAC9E,SAAS,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;QAC7B,gBAAgB,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;KACrC;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,EAAE,GAAU;IACvB,IAAI,EAAE;QACJ,OAAO,EAAE,0CAA0C;QACnD,eAAe,EAAE,kDAAkD;QACnE,SAAS,EAAE,IAAI;KAChB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,GAAG,GAAU;IACxB,IAAI,EAAE;QACJ,OAAO,EAAE,sCAAsC;QAC/C,eAAe,EAAE,0CAA0C;QAC3D,SAAS,EAAE,OAAO;KACnB;CACF,CAAC","sourcesContent":["import type { Meta, StoryObj } from '@storybook/web-components';\nimport { JSX } from '../../components';\n\nconst meta: Meta<JSX.AicoFetchArticleDetail> = {\n  component: 'aico-fetch-article-detail',\n  argTypes: {\n    aicoUrl: { type: 'string', description: 'The Aico api url.' },\n    aicoBearerToken: { type: 'string', description: 'The Aico api access token.' },\n    articleId: { type: 'string' },\n    articleUrlHandle: { type: 'string' },\n  },\n};\n\nexport default meta;\n\ntype Story = StoryObj;\n\nexport const Kj: Story = {\n  args: {\n    aicoUrl: 'https://kj-acceptance.aico.swiss/api/v1/',\n    aicoBearerToken: 'Sq4WkveRPJ64SHR9zqZW8oLjIDjnlBg0gXHSuIMweb966802',\n    articleId: '32',\n  },\n};\n\nexport const Fcz: Story = {\n  args: {\n    aicoUrl: 'https://app.aico.swiss/19838/api/v1/',\n    aicoBearerToken: 'B3NXuTbnCeppJl9NHu27Kjs7Hm3EOKSGCkR6CVwO',\n    articleId: '44239',\n  },\n};\n"]}

package/dist/collection/components/aico-news-list/aico-news-list.css

@@ -1,113 +0,0 @@
-/* :host { */
-/*   display: block; */
-/* } */
-/**/
-/* .grid-wrapper { */
-/*   display: grid; */
-/*   height: 100%; */
-/*   width: 100%; */
-/*   justify-items: center; */
-/*   align-items: stretch; */
-/*   grid-template-columns: repeat(4, minmax(auto, 1fr)); */
-/*   grid-auto-rows: minmax(0, 1fr); */
-/*   grid-gap: 10px; */
-/* } */
-/**/
-/* .navigation-wrapper { */
-/*   display: flex; */
-/*   justify-content: space-around; */
-/*   justify-items: center; */
-/*   align-content: center; */
-/* } */
-/**/
-/* .navigation-button { */
-/*   display: inline-block; */
-/*   outline: none; */
-/*   cursor: pointer; */
-/*   font-size: 14px; */
-/*   padding: 0 12px; */
-/*   line-height: 20px; */
-/*   height: 30px; */
-/*   max-height: 30px; */
-/*   background: none; */
-/*   font-weight: 700; */
-/*   border: 0; */
-/*   border-radius: 0; */
-/*   color: #9ca3af; */
-/*   transition-timing-function: ease-in-out; */
-/*   transition-property: background; */
-/*   transition-duration: 150ms; */
-/*   box-shadow: none; */
-/*   &:enabled &:hover { */
-/*     color: #374151; */
-/*   } */
-/* } */
-/**/
-/* .navigation-pages { */
-/*   display: inline-flex; */
-/*   list-style-type: none; */
-/*   margin: 0; */
-/*   padding: 0; */
-/*   margin-left: -1px; */
-/*   font-size: 14px; */
-/*   line-height: 20px; */
-/* } */
-/**/
-/* .navigation-pages > li { */
-/*   display: flex; */
-/*   padding-left: 12px; */
-/*   padding-right: 12px; */
-/*   justify-content: center; */
-/*   align-items: center; */
-/*   border-width: 1px; */
-/*   border-color: #d1d5db; */
-/*   border-radius: 8px; */
-/*   height: 2rem; */
-/*   line-height: 1.25; */
-/*   color: #6b7280; */
-/*   background-color: #ffffff; */
-/* } */
-/**/
-/* .navigation-pages > li.page-number { */
-/*   cursor: pointer; */
-/*   &:hover { */
-/*     color: #374151; */
-/*     background-color: #f3f4f6; */
-/*   } */
-/* } */
-/**/
-/* .navigation-pages > li.page-selected { */
-/*   display: flex; */
-/*   padding-left: 12px; */
-/*   padding-right: 12px; */
-/*   justify-content: center; */
-/*   align-items: center; */
-/*   border-width: 1px; */
-/*   border-color: #d1d5db; */
-/*   border-radius: 8px; */
-/*   height: 2rem; */
-/*   color: #2563eb; */
-/*   background-color: #eff6ff; */
-/**/
-/*   &:hover { */
-/*     color: #1d4ed8; */
-/*     background-color: #dbeafe; */
-/*   } */
-/* } */
-/**/
-/* /* Tablet */ */
-/* @media only screen and (min-width: 768px) and (max-width: 1023px) { */
-/*   .grid-wrapper { */
-/*     grid-template-columns: repeat(2, minmax(auto, 1fr)); */
-/*   } */
-/* } */
-/**/
-/* /* Mobile */ */
-/* @media only screen and (max-width: 767px) { */
-/*   .grid-wrapper { */
-/*     grid-template-columns: minmax(auto, 1fr); */
-/*   } */
-/*   .navigation-pages { */
-/*     display: none; */
-/*   } */
-/* } */

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

@@ -7,6 +7,7 @@ export class AicoNewsList {
         this.pageNumber = 1;
         this.aicoUrl = undefined;
         this.aicoBearerToken = undefined;
+        this.newsChannels = [];
         this.nextButtonText = 'Next';
         this.previousButtonText = 'Previous';
     }
@@ -19,17 +20,17 @@ export class AicoNewsList {
         this.newsListFetchController.abort('disconnected');
     }
     async componentWillLoad() {
-        this.newsResponse = await fetchNewsArticles(this.api, this.pageNumber, this.pageSize, this.newsListFetchController.signal);
+        this.newsResponse = await fetchNewsArticles(this.api, this.pageNumber, this.pageSize, this.newsListFetchController.signal, this.newsChannels);
     }
     async componentWillUpdate() {
         this.newsListFetchController = new AbortController();
-        this.newsResponse = await fetchNewsArticles(this.api, this.pageNumber, this.pageSize, this.newsListFetchController.signal);
+        this.newsResponse = await fetchNewsArticles(this.api, this.pageNumber, this.pageSize, this.newsListFetchController.signal, this.newsChannels);
     }
     render() {
         var _a, _b, _c;
-        return (h(Host, null, h("div", { class: "axaxa row row-cols-1 row-cols-sm-2 row-cols-lg-4 g-4 mb-4" }, (_a = this.newsResponse) === null || _a === void 0 ? void 0 : _a.data.map(article => (h("div", { class: "col" }, h("aico-news-list-item", { article: article, onArticleClicked: e => {
+        return (h(Host, null, h("div", { class: "row row-cols-1 row-cols-sm-2 row-cols-lg-4 g-4 mb-4" }, (_a = this.newsResponse) === null || _a === void 0 ? void 0 : _a.data.map(article => (h("div", { class: "col" }, h("aico-news-list-item", { article: article, onArticleClick: e => {
                 var _a;
-                (_a = this.articleClicked) === null || _a === void 0 ? void 0 : _a.emit(e.detail);
+                (_a = this.articleClick) === null || _a === void 0 ? void 0 : _a.emit(e.detail);
             } }))))), 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;
@@ -123,6 +124,22 @@ export class AicoNewsList {
                 "attribute": "aico-bearer-token",
                 "reflect": false
             },
+            "newsChannels": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "defaultValue": "[]"
+            },
             "nextButtonText": {
                 "type": "string",
                 "mutable": false,
@@ -169,8 +186,8 @@ export class AicoNewsList {
     }
     static get events() {
         return [{
-                "method": "articleClicked",
-                "name": "articleClicked",
+                "method": "articleClick",
+                "name": "articleClick",
                 "bubbles": true,
                 "cancelable": true,
                 "composed": true,