@telia-ace/alliance-ui 1.0.17 → 1.1.0-next.0

package/components/chunk-CZPHL6EU.js

@@ -1,347 +0,0 @@
-import { spacing, borders, colors, motion, focus, breakpoints } from './chunk-5A2VXG2P.js';
-import { __decorateClass, define } from './chunk-AW7BCYX5.js';
-import { LitElement, css, unsafeCSS, html } from 'lit';
-import { property, state } from 'lit/decorators.js';
-import { repeat } from 'lit/directives/repeat.js';
-import '@teliads/components/dist/components/telia-label';
-import { chevronLeft, chevronRight } from '@teliads/components/icons';
-
-// src/components/alliance-paginator/utils.ts
-var DOTS = "...";
-var range = (start, end) => {
-  const length = end - start + 1;
-  return Array.from({ length }, (_, idx) => idx + start);
-};
-function getLastPage(pages) {
-  return pages[pages.length - 1];
-}
-function listPages(lastPage) {
-  return Array.from({ length: lastPage }, (_, i) => {
-    return pageToSelectValue(i + 1, lastPage);
-  });
-}
-function pageToSelectValue(page, lastPage) {
-  return `${page} / ${lastPage}`;
-}
-function selectValueToPage(selectValue) {
-  const value = selectValue.split("/")[0];
-  if (typeof value !== "string") {
-    throw new Error("Could not parse page value from select.");
-  }
-  return parseInt(value);
-}
-function getPagination({ itemCount, pageSize, siblingCount, currentPage }) {
-  const totalPageCount = Math.ceil(itemCount / pageSize);
-  const totalPageNumbers = siblingCount + 5;
-  if (totalPageNumbers >= totalPageCount) {
-    return range(1, totalPageCount);
-  }
-  const leftSiblingIndex = Math.max(currentPage - siblingCount, 1);
-  const rightSiblingIndex = Math.min(currentPage + siblingCount, totalPageCount);
-  const shouldShowLeftDots = leftSiblingIndex > 2;
-  const shouldShowRightDots = rightSiblingIndex < totalPageCount - 2;
-  const firstPageIndex = 1;
-  const lastPageIndex = totalPageCount;
-  if (!shouldShowLeftDots && shouldShowRightDots) {
-    const leftItemCount = 3 + 2 * siblingCount;
-    const leftRange = range(1, leftItemCount);
-    return [...leftRange, DOTS, totalPageCount];
-  }
-  if (shouldShowLeftDots && !shouldShowRightDots) {
-    const rightItemCount = 3 + 2 * siblingCount;
-    const rightRange = range(totalPageCount - rightItemCount + 1, totalPageCount);
-    return [firstPageIndex, DOTS, ...rightRange];
-  }
-  if (shouldShowLeftDots && shouldShowRightDots) {
-    const middleRange = range(leftSiblingIndex, rightSiblingIndex);
-    return [firstPageIndex, DOTS, ...middleRange, DOTS, lastPageIndex];
-  }
-  return range(1, totalPageCount);
-}
-
-// src/components/alliance-paginator/alliance-page-selector.ts
-var PageSelect = class extends LitElement {
-  constructor() {
-    super();
-    this.onChange = (e) => {
-      const nextPage = selectValueToPage(e.currentTarget.value);
-      const event = new CustomEvent("select-page", {
-        bubbles: true,
-        composed: true,
-        detail: { nextPage, previousPage: this.currentPage },
-        cancelable: true
-      });
-      this.dispatchEvent(event);
-    };
-    this.currentPage = 0;
-    this.lastPage = 0;
-  }
-  static {
-    this.styles = css`
-        :host select {
-            padding: ${unsafeCSS(spacing.spacing16)} ${unsafeCSS(spacing.spacing24)};
-            border-radius: ${unsafeCSS(borders.radiusFull)};
-            border: ${unsafeCSS(borders.widthXs)} solid ${unsafeCSS(colors.purple850)};
-            background-color: transparent;
-            color: ${unsafeCSS(colors.purple850)};
-            text-align: center;
-            align-items: center;
-            justify-content: center;
-            cursor: pointer;
-            display: inline-flex;
-            font-family: 'TeliaSans', Helvetica, Arial, 'Lucida Grande', sans-serif;
-            font-size: ${unsafeCSS(spacing.spacing16)};
-            line-height: ${unsafeCSS(spacing.spacing16)};
-            transition:
-                color ${unsafeCSS(motion.duration150)} ease,
-                background-color ${unsafeCSS(motion.duration150)} ease;
-
-            -webkit-appearance: none;
-            -moz-appearance: none;
-            appearance: none;
-            outline: none;
-        }
-
-        :host select:hover {
-            background-color: ${unsafeCSS(colors.purple850)};
-            color: ${unsafeCSS(colors.white)};
-        }
-
-        :host select:active {
-            background-color: ${unsafeCSS(colors.purple700)};
-        }
-
-        :host select option {
-            background-color: ${unsafeCSS(colors.white)};
-            color: ${unsafeCSS(colors.black)};
-            text-align: center;
-        }
-
-        :host select::-ms-expand {
-            display: none;
-        }
-
-        :host select:focus-visible {
-            outline: solid ${unsafeCSS(focus.focusBorderWidth)} ${unsafeCSS(focus.focusColor)};
-            outline-offset: ${unsafeCSS(spacing.spacing4)};
-        }
-    `;
-  }
-  render() {
-    return html`
-            <select
-                id="select"
-                @change=${this.onChange}
-                .value=${pageToSelectValue(this.currentPage, this.lastPage)}
-            >
-                ${repeat(
-      listPages(this.lastPage),
-      (page) => html`<option value="${page}">${page}</option>`
-    )}
-            </select>
-        `;
-  }
-};
-__decorateClass([
-  property({ type: Number, attribute: "current-page" })
-], PageSelect.prototype, "currentPage", 2);
-__decorateClass([
-  property({ type: Number, attribute: "last-page" })
-], PageSelect.prototype, "lastPage", 2);
-define("alliance-page-selector", PageSelect);
-
-// src/components/alliance-paginator/alliance-paginator.ts
-var Paginator = class extends LitElement {
-  constructor() {
-    super();
-    this.changePage = (nextPage) => {
-      if (nextPage === this.currentPage || // Next page is the same
-      nextPage < 1 || // Next page is 0
-      nextPage > this.pages[this.pages.length - 1]) {
-        return;
-      }
-      const event = new CustomEvent("change-page", {
-        bubbles: true,
-        composed: true,
-        detail: { nextPage, previousPage: this.currentPage },
-        cancelable: true
-      });
-      const defaultNotPrevented = this.dispatchEvent(event);
-      if (defaultNotPrevented) {
-        this.currentPage = nextPage;
-        this.pages = getPagination({
-          itemCount: this.itemCount,
-          pageSize: this.pageSize,
-          siblingCount: this.siblingCount,
-          currentPage: this.currentPage
-        });
-      }
-    };
-    this.next = () => {
-      this.changePage(this.currentPage + 1);
-    };
-    this.previous = () => {
-      this.changePage(this.currentPage - 1);
-    };
-    this.onPageSelect = (event) => this.changePage(event.detail.nextPage);
-    this.itemCount = 0;
-    this.pageSize = 50;
-    this.initialPage = 1;
-    this.siblingCount = 2;
-    this.currentPage = this.initialPage;
-    this.pages = [];
-  }
-  static {
-    this.styles = css`
-        :host {
-            display: flex;
-            flex-direction: row;
-            place-items: center;
-            gap: ${unsafeCSS(spacing.spacing8)};
-        }
-
-        :host telia-label {
-            display: none;
-        }
-
-        :host .telia-label {
-            color: ${unsafeCSS(colors.purple700)};
-        }
-
-        :host alliance-paginator-button[page] {
-            display: none;
-        }
-
-        span {
-            display: block;
-        }
-
-        @container (min-width: ${unsafeCSS(breakpoints.breakpointLg)}) {
-            :host telia-label,
-            :host alliance-paginator-button[page] {
-                display: block;
-            }
-
-            :host alliance-page-selector {
-                display: none;
-            }
-        }
-    `;
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    this.currentPage = this.initialPage;
-    this.pages = getPagination({
-      itemCount: this.itemCount,
-      pageSize: this.pageSize,
-      siblingCount: this.siblingCount,
-      currentPage: this.currentPage
-    });
-  }
-  attributeChangedCallback(name, _, value) {
-    super.attributeChangedCallback(name, _, value);
-    if (name === "initial-page") {
-      this.currentPage = this.initialPage;
-    }
-    this.pages = getPagination({
-      itemCount: this.itemCount,
-      pageSize: this.pageSize,
-      siblingCount: this.siblingCount,
-      currentPage: this.currentPage,
-      [name]: value
-    });
-  }
-  render() {
-    return html`
-            <alliance-paginator-button
-                @click=${this.previous}
-                ?disabled=${this.currentPage === 1}
-                icon="left"
-            ></alliance-paginator-button>
-
-            ${repeat(
-      this.pages,
-      (pageNumber) => pageNumber === "..." ? html`<telia-label>...</telia-label>` : html`<alliance-paginator-button
-                          page=${pageNumber}
-                          @click=${() => this.changePage(pageNumber)}
-                          ?selected=${this.currentPage === pageNumber}
-                      ></alliance-paginator-button>`
-    )}
-
-            <alliance-page-selector
-                current-page=${this.currentPage}
-                last-page=${getLastPage(this.pages)}
-                @select-page=${this.onPageSelect}
-            >
-            </alliance-page-selector>
-
-            <alliance-paginator-button
-                @click=${this.next}
-                ?disabled=${this.currentPage === getLastPage(this.pages)}
-                icon="right"
-            ></alliance-paginator-button>
-        `;
-  }
-};
-__decorateClass([
-  property({ type: Number, attribute: "item-count" })
-], Paginator.prototype, "itemCount", 2);
-__decorateClass([
-  property({ type: Number, attribute: "page-size" })
-], Paginator.prototype, "pageSize", 2);
-__decorateClass([
-  property({ type: Number, attribute: "initial-page" })
-], Paginator.prototype, "initialPage", 2);
-__decorateClass([
-  property({ type: Number, attribute: "sibling-count" })
-], Paginator.prototype, "siblingCount", 2);
-__decorateClass([
-  state()
-], Paginator.prototype, "currentPage", 2);
-__decorateClass([
-  state()
-], Paginator.prototype, "pages", 2);
-define("alliance-paginator", Paginator);
-var Icon = /* @__PURE__ */ ((Icon2) => {
-  Icon2["Left"] = "left";
-  Icon2["Right"] = "right";
-  return Icon2;
-})(Icon || {});
-var PaginatorButton = class extends LitElement {
-  constructor() {
-    super();
-    this.selected = false;
-    this.disabled = false;
-    this.clickable = true;
-  }
-  renderContent() {
-    if (this.icon === "left" /* Left */) {
-      return html`<telia-icon size="sm" svg="${chevronLeft.svg}" />`;
-    }
-    if (this.icon === "right" /* Right */) {
-      return html`<telia-icon size="sm" svg="${chevronRight.svg}" />`;
-    }
-    return html`<span>${this.page}</span>`;
-  }
-  render() {
-    return html`<telia-button ?disabled=${this.disabled} variant=${this.selected ? "primary" : "tertiary-purple"}>${this.renderContent()}</telia-button> `;
-  }
-};
-__decorateClass([
-  property({ type: Icon })
-], PaginatorButton.prototype, "icon", 2);
-__decorateClass([
-  property({ type: String })
-], PaginatorButton.prototype, "page", 2);
-__decorateClass([
-  property({ type: Boolean })
-], PaginatorButton.prototype, "selected", 2);
-__decorateClass([
-  property({ type: Boolean })
-], PaginatorButton.prototype, "disabled", 2);
-__decorateClass([
-  property({ type: Boolean })
-], PaginatorButton.prototype, "clickable", 2);
-define("alliance-paginator-button", PaginatorButton);
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-CZPHL6EU.js.map

package/components/chunk-CZPHL6EU.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/alliance-paginator/alliance-page-selector.ts","../src/components/alliance-paginator/utils.ts","../src/components/alliance-paginator/alliance-paginator.ts","../src/voca/components/telia-label.ts","../src/components/alliance-paginator/alliance-paginator-button.ts"],"names":["LitElement","css","html","unsafeCSS","property","repeat","Icon"],"mappings":"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","sourcesContent":["import { LitElement, css, html, unsafeCSS } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { repeat } from 'lit/directives/repeat.js';\n\nimport { define } from '@/utils';\nimport '@/voca/components/telia-button';\nimport { borders, colors, focus, motion, spacing } from '@/voca/foundations';\n\nimport { listPages, pageToSelectValue, selectValueToPage } from './utils';\n\n/**\n * Event dispatched when selecting a page.\n *\n * Event: `change-page`\n *\n * Detail: Object containing the properties `nextPage` and `previousPage`.\n */\nexport type SelectPageEvent = CustomEvent<{ nextPage: number; previousPage: number }>;\n\nexport class PageSelect extends LitElement {\n    constructor() {\n        super();\n        this.currentPage = 0;\n        this.lastPage = 0;\n    }\n    static styles = css`\n        :host select {\n            padding: ${unsafeCSS(spacing.spacing16)} ${unsafeCSS(spacing.spacing24)};\n            border-radius: ${unsafeCSS(borders.radiusFull)};\n            border: ${unsafeCSS(borders.widthXs)} solid ${unsafeCSS(colors.purple850)};\n            background-color: transparent;\n            color: ${unsafeCSS(colors.purple850)};\n            text-align: center;\n            align-items: center;\n            justify-content: center;\n            cursor: pointer;\n            display: inline-flex;\n            font-family: 'TeliaSans', Helvetica, Arial, 'Lucida Grande', sans-serif;\n            font-size: ${unsafeCSS(spacing.spacing16)};\n            line-height: ${unsafeCSS(spacing.spacing16)};\n            transition:\n                color ${unsafeCSS(motion.duration150)} ease,\n                background-color ${unsafeCSS(motion.duration150)} ease;\n\n            -webkit-appearance: none;\n            -moz-appearance: none;\n            appearance: none;\n            outline: none;\n        }\n\n        :host select:hover {\n            background-color: ${unsafeCSS(colors.purple850)};\n            color: ${unsafeCSS(colors.white)};\n        }\n\n        :host select:active {\n            background-color: ${unsafeCSS(colors.purple700)};\n        }\n\n        :host select option {\n            background-color: ${unsafeCSS(colors.white)};\n            color: ${unsafeCSS(colors.black)};\n            text-align: center;\n        }\n\n        :host select::-ms-expand {\n            display: none;\n        }\n\n        :host select:focus-visible {\n            outline: solid ${unsafeCSS(focus.focusBorderWidth)} ${unsafeCSS(focus.focusColor)};\n            outline-offset: ${unsafeCSS(spacing.spacing4)};\n        }\n    `;\n\n    @property({ type: Number, attribute: 'current-page' })\n    declare currentPage: number;\n\n    @property({ type: Number, attribute: 'last-page' })\n    declare lastPage: number;\n\n    onChange = (\n        e: Event & {\n            currentTarget: HTMLSelectElement;\n        },\n    ) => {\n        const nextPage = selectValueToPage(e.currentTarget.value);\n\n        const event: SelectPageEvent = new CustomEvent('select-page', {\n            bubbles: true,\n            composed: true,\n            detail: { nextPage, previousPage: this.currentPage },\n            cancelable: true,\n        });\n        this.dispatchEvent(event);\n    };\n\n    render() {\n        return html`\n            <select\n                id=\"select\"\n                @change=${this.onChange}\n                .value=${pageToSelectValue(this.currentPage, this.lastPage)}\n            >\n                ${repeat(\n                    listPages(this.lastPage),\n                    (page) => html`<option value=\"${page}\">${page}</option>`,\n                )}\n            </select>\n        `;\n    }\n}\n\ndefine('alliance-page-selector', PageSelect);\n","/* \n  Pagination logic taken from https://www.freecodecamp.org/news/build-a-custom-pagination-component-in-react/\n*/\nconst DOTS = '...';\n\nconst range = (start: number, end: number) => {\n    const length = end - start + 1;\n    /*\n        Create an array of certain length and set the elements within it from\n      start value to end value.\n    */\n    return Array.from({ length }, (_, idx) => idx + start);\n};\n\ntype Args = {\n    itemCount: number;\n    pageSize: number;\n    siblingCount: number;\n    currentPage: number;\n};\n\nexport type Pages = (number | '...')[];\n\nexport function getLastPage(pages: Pages): number {\n    return pages[pages.length - 1] as number;\n}\n\nexport function listPages(lastPage: number): string[] {\n    return Array.from({ length: lastPage }, (_, i) => {\n        return pageToSelectValue(i + 1, lastPage);\n    });\n}\n\nexport function pageToSelectValue(page: number, lastPage: number): string {\n    return `${page} / ${lastPage}`;\n}\n\nexport function selectValueToPage(selectValue: string): number {\n    const value = selectValue.split('/')[0];\n\n    if (typeof value !== 'string') {\n        throw new Error('Could not parse page value from select.');\n    }\n\n    return parseInt(value);\n}\n\nexport function getPagination({ itemCount, pageSize, siblingCount, currentPage }: Args): Pages {\n    const totalPageCount = Math.ceil(itemCount / pageSize);\n\n    // Pages count is determined as siblingCount + firstPage + lastPage + currentPage + 2*DOTS\n    const totalPageNumbers = siblingCount + 5;\n\n    /*\n        Case 1:\n        If the number of pages is less than the page numbers we want to show in our\n        paginationComponent, we return the range [1..totalPageCount]\n      */\n    if (totalPageNumbers >= totalPageCount) {\n        return range(1, totalPageCount);\n    }\n\n    /*\n          Calculate left and right sibling index and make sure they are within range 1 and totalPageCount\n      */\n    const leftSiblingIndex = Math.max(currentPage - siblingCount, 1);\n    const rightSiblingIndex = Math.min(currentPage + siblingCount, totalPageCount);\n\n    /*\n        We do not show dots just when there is just one page number to be inserted between the extremes of sibling and the page limits i.e 1 and totalPageCount. Hence we are using leftSiblingIndex > 2 and rightSiblingIndex < totalPageCount - 2\n      */\n    const shouldShowLeftDots = leftSiblingIndex > 2;\n    const shouldShowRightDots = rightSiblingIndex < totalPageCount - 2;\n\n    const firstPageIndex = 1;\n    const lastPageIndex = totalPageCount;\n\n    /*\n          Case 2: No left dots to show, but rights dots to be shown\n      */\n    if (!shouldShowLeftDots && shouldShowRightDots) {\n        const leftItemCount = 3 + 2 * siblingCount;\n        const leftRange = range(1, leftItemCount);\n\n        return [...leftRange, DOTS, totalPageCount];\n    }\n\n    /*\n          Case 3: No right dots to show, but left dots to be shown\n      */\n    if (shouldShowLeftDots && !shouldShowRightDots) {\n        const rightItemCount = 3 + 2 * siblingCount;\n        const rightRange = range(totalPageCount - rightItemCount + 1, totalPageCount);\n        return [firstPageIndex, DOTS, ...rightRange];\n    }\n\n    /*\n          Case 4: Both left and right dots to be shown\n      */\n    if (shouldShowLeftDots && shouldShowRightDots) {\n        const middleRange = range(leftSiblingIndex, rightSiblingIndex);\n        return [firstPageIndex, DOTS, ...middleRange, DOTS, lastPageIndex];\n    }\n\n    return range(1, totalPageCount);\n}\n","import { LitElement, css, html, unsafeCSS } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { repeat } from 'lit/directives/repeat.js';\n\nimport { define } from '@/utils';\nimport '@/voca/components/telia-button';\nimport '@/voca/components/telia-label';\nimport { breakpoints, colors, spacing } from '@/voca/foundations';\n\nimport type { SelectPageEvent } from './alliance-page-selector';\nimport { type Pages, getLastPage, getPagination } from './utils';\n\n/**\n * Event dispatched when pressing a page button.\n *\n * Event: `change-page`\n *\n * Detail: Object containing the properties `nextPage` and `previousPage`.\n */\nexport type ChangePageEvent = CustomEvent<{ nextPage: number; previousPage: number }>;\n\nexport class Paginator extends LitElement {\n    constructor() {\n        super();\n        this.itemCount = 0;\n        this.pageSize = 50;\n        this.initialPage = 1;\n        this.siblingCount = 2;\n        this.currentPage = this.initialPage;\n        this.pages = [];\n    }\n    static styles = css`\n        :host {\n            display: flex;\n            flex-direction: row;\n            place-items: center;\n            gap: ${unsafeCSS(spacing.spacing8)};\n        }\n\n        :host telia-label {\n            display: none;\n        }\n\n        :host .telia-label {\n            color: ${unsafeCSS(colors.purple700)};\n        }\n\n        :host alliance-paginator-button[page] {\n            display: none;\n        }\n\n        span {\n            display: block;\n        }\n\n        @container (min-width: ${unsafeCSS(breakpoints.breakpointLg)}) {\n            :host telia-label,\n            :host alliance-paginator-button[page] {\n                display: block;\n            }\n\n            :host alliance-page-selector {\n                display: none;\n            }\n        }\n    `;\n\n    connectedCallback() {\n        super.connectedCallback();\n\n        this.currentPage = this.initialPage;\n        this.pages = getPagination({\n            itemCount: this.itemCount,\n            pageSize: this.pageSize,\n            siblingCount: this.siblingCount,\n            currentPage: this.currentPage,\n        });\n    }\n\n    attributeChangedCallback(name: string, _: string | null, value: string | null) {\n        super.attributeChangedCallback(name, _, value);\n\n        if (name === 'initial-page') {\n            this.currentPage = this.initialPage;\n        }\n\n        this.pages = getPagination({\n            itemCount: this.itemCount,\n            pageSize: this.pageSize,\n            siblingCount: this.siblingCount,\n            currentPage: this.currentPage,\n            [name]: value,\n        });\n    }\n\n    @property({ type: Number, attribute: 'item-count' })\n    declare itemCount: number;\n\n    @property({ type: Number, attribute: 'page-size' })\n    declare pageSize: number;\n\n    @property({ type: Number, attribute: 'initial-page' })\n    declare initialPage: number;\n\n    @property({ type: Number, attribute: 'sibling-count' })\n    declare siblingCount: number;\n\n    @state()\n    declare currentPage: number;\n\n    @state()\n    declare pages: Pages;\n\n    changePage = (nextPage: number) => {\n        if (\n            nextPage === this.currentPage || // Next page is the same\n            nextPage < 1 || // Next page is 0\n            nextPage > (this.pages[this.pages.length - 1] as number) // Next page is outside of available pages\n        ) {\n            return;\n        }\n\n        const event: ChangePageEvent = new CustomEvent('change-page', {\n            bubbles: true,\n            composed: true,\n            detail: { nextPage, previousPage: this.currentPage },\n            cancelable: true,\n        });\n        const defaultNotPrevented = this.dispatchEvent(event);\n\n        if (defaultNotPrevented) {\n            this.currentPage = nextPage;\n\n            this.pages = getPagination({\n                itemCount: this.itemCount,\n                pageSize: this.pageSize,\n                siblingCount: this.siblingCount,\n                currentPage: this.currentPage,\n            });\n        }\n    };\n\n    next = () => {\n        this.changePage(this.currentPage + 1);\n    };\n\n    previous = () => {\n        this.changePage(this.currentPage - 1);\n    };\n\n    onPageSelect = (event: SelectPageEvent) => this.changePage(event.detail.nextPage);\n\n    render() {\n        return html`\n            <alliance-paginator-button\n                @click=${this.previous}\n                ?disabled=${this.currentPage === 1}\n                icon=\"left\"\n            ></alliance-paginator-button>\n\n            ${repeat(this.pages, (pageNumber) =>\n                pageNumber === '...'\n                    ? html`<telia-label>...</telia-label>`\n                    : html`<alliance-paginator-button\n                          page=${pageNumber}\n                          @click=${() => this.changePage(pageNumber)}\n                          ?selected=${this.currentPage === pageNumber}\n                      ></alliance-paginator-button>`,\n            )}\n\n            <alliance-page-selector\n                current-page=${this.currentPage}\n                last-page=${getLastPage(this.pages)}\n                @select-page=${this.onPageSelect}\n            >\n            </alliance-page-selector>\n\n            <alliance-paginator-button\n                @click=${this.next}\n                ?disabled=${this.currentPage === getLastPage(this.pages)}\n                icon=\"right\"\n            ></alliance-paginator-button>\n        `;\n    }\n}\n\ndefine('alliance-paginator', Paginator);\n","// This file is generated - see scripts/map-voca-components.js\nimport '@teliads/components/dist/components/telia-label';\n","import { chevronLeft, chevronRight } from '@teliads/components/icons';\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\n\nimport { define } from '@/utils';\nimport '@/voca/components/telia-button';\nimport '@/voca/components/telia-icon';\n\nenum Icon {\n    Left = 'left',\n    Right = 'right',\n}\n\nexport class PaginatorButton extends LitElement {\n    constructor() {\n        super();\n        this.selected = false;\n        this.disabled = false;\n        this.clickable = true;\n    }\n    @property({ type: Icon })\n    declare icon?: Icon;\n\n    @property({ type: String })\n    declare page?: string;\n\n    @property({ type: Boolean })\n    declare selected: boolean;\n\n    @property({ type: Boolean })\n    declare disabled: boolean;\n\n    @property({ type: Boolean })\n    declare clickable: boolean;\n\n    private renderContent() {\n        if (this.icon === Icon.Left) {\n            return html`<telia-icon size=\"sm\" svg=\"${chevronLeft.svg}\" />`;\n        }\n\n        if (this.icon === Icon.Right) {\n            return html`<telia-icon size=\"sm\" svg=\"${chevronRight.svg}\" />`;\n        }\n\n        return html`<span>${this.page}</span>`;\n    }\n\n    render() {\n        /*\n            Ignore prettier on next line because Voca \n            uses textContent on the telia-button element\n            to detect whether or not it only contains an\n            icon - which does not take account for white space...\n            https://github.com/telia-company/design-system/issues/813\n        */\n        // prettier-ignore\n        return html`<telia-button ?disabled=${this.disabled} variant=${this.selected ? 'primary' : 'tertiary-purple'}>${this.renderContent()}</telia-button> `;\n    }\n}\n\ndefine('alliance-paginator-button', PaginatorButton);\n"]}

package/components/chunk-IFHLWFVT.js

@@ -1,133 +0,0 @@
-import { layers, borders, colors, shadows, spacing } from './chunk-5A2VXG2P.js';
-import { __decorateClass, define } from './chunk-AW7BCYX5.js';
-import { autoPlacement, computePosition, autoUpdate } from '@floating-ui/dom';
-import { LitElement, css, unsafeCSS, html } from 'lit';
-import { property } from 'lit/decorators.js';
-import '@teliads/components/dist/components/telia-skeleton';
-
-// src/components/alliance-pop-over/alliance-pop-over.ts
-var PopOver = class extends LitElement {
-  constructor() {
-    super(...arguments);
-    this.onWindowClick = (event) => {
-      const { target, clientX, clientY } = event;
-      if (!this.cursor) {
-        this.cursor = { x: clientX, y: clientY };
-        return;
-      }
-      if (!target || target === this || this.contains(target)) {
-        return;
-      }
-      if (this.anchorElement && (target === this.anchorElement || this.anchorElement.contains(target))) {
-        return;
-      }
-      this.remove();
-    };
-    this.position = () => {
-      const middleware = [];
-      if (!this.placement) {
-        middleware.push(autoPlacement());
-      }
-      computePosition(this.reference(), this, {
-        middleware,
-        placement: this.placement
-      }).then(({ x, y }) => {
-        Object.assign(this.style, {
-          left: `${x}px`,
-          top: `${y}px`
-        });
-      });
-    };
-    this.reference = () => {
-      if (!this.anchorElement && !this.cursor) {
-        return virtual({ x: 0, y: 0 });
-      }
-      return this.anchorElement || virtual(this.cursor);
-    };
-  }
-  static {
-    this.styles = css`
-        :host {
-            display: block;
-            width: max-content;
-            position: absolute;
-            top: 0;
-            left: 0;
-
-            z-index: ${unsafeCSS(Number(layers.modal) * 2)};
-            border: ${unsafeCSS(borders.widthXs)};
-            border-radius: ${unsafeCSS(borders.radiusSm)};
-            background-color: ${unsafeCSS(colors.white)};
-            box-shadow: ${unsafeCSS(shadows.md)};
-        }
-
-        :host([loading]) {
-            display: flex;
-            flex-direction: column;
-            padding: ${unsafeCSS(spacing.spacing12)};
-            gap: ${unsafeCSS(spacing.spacing12)};
-        }
-
-        :host([loading]) telia-skeleton {
-            height: ${unsafeCSS(spacing.spacing12)};
-            width: ${unsafeCSS(spacing.spacing128)};
-        }
-    `;
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    const anchorElement = document.getElementById(this.anchor);
-    if (anchorElement) {
-      this.anchorElement = anchorElement;
-    }
-    window.addEventListener("click", this.onWindowClick);
-    const cleanup = autoUpdate(this.reference(), this, this.position);
-    this.cleanup = () => {
-      window.removeEventListener("click", this.onWindowClick);
-      cleanup();
-    };
-  }
-  disconnectedCallback() {
-    this.dispatchEvent(new CustomEvent("close"));
-    this.cleanup();
-    super.disconnectedCallback();
-  }
-  render() {
-    if (this.loading) {
-      return html`
-                <telia-skeleton round> </telia-skeleton>
-                <telia-skeleton round> </telia-skeleton>
-                <telia-skeleton round> </telia-skeleton>
-                <telia-skeleton round> </telia-skeleton>
-                <telia-skeleton round> </telia-skeleton>
-            `;
-    }
-    return html` <slot> </slot> `;
-  }
-};
-__decorateClass([
-  property({ type: String })
-], PopOver.prototype, "anchor", 2);
-__decorateClass([
-  property({ type: String, attribute: true, reflect: true })
-], PopOver.prototype, "placement", 2);
-__decorateClass([
-  property({ type: Boolean, attribute: true, reflect: true })
-], PopOver.prototype, "loading", 2);
-define("alliance-pop-over", PopOver);
-function virtual({ x, y }) {
-  return {
-    getBoundingClientRect: () => ({
-      width: 0,
-      height: 0,
-      x,
-      y,
-      top: y,
-      left: x,
-      right: x,
-      bottom: y
-    })
-  };
-}
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-IFHLWFVT.js.map

package/components/chunk-IFHLWFVT.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/alliance-pop-over/alliance-pop-over.ts","../src/voca/components/telia-skeleton.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n    type Middleware,\n    type Placement,\n    autoPlacement,\n    autoUpdate,\n    computePosition,\n} from '@floating-ui/dom';\nimport { LitElement, css, html, unsafeCSS } from 'lit';\nimport { property } from 'lit/decorators.js';\n\nimport { define } from '@/utils';\nimport '@/voca/components/telia-skeleton';\nimport { borders, colors, layers, shadows, spacing } from '@/voca/foundations';\n\nexport class PopOver extends LitElement {\n    static styles = css`\n        :host {\n            display: block;\n            width: max-content;\n            position: absolute;\n            top: 0;\n            left: 0;\n\n            z-index: ${unsafeCSS(Number(layers.modal) * 2)};\n            border: ${unsafeCSS(borders.widthXs)};\n            border-radius: ${unsafeCSS(borders.radiusSm)};\n            background-color: ${unsafeCSS(colors.white)};\n            box-shadow: ${unsafeCSS(shadows.md)};\n        }\n\n        :host([loading]) {\n            display: flex;\n            flex-direction: column;\n            padding: ${unsafeCSS(spacing.spacing12)};\n            gap: ${unsafeCSS(spacing.spacing12)};\n        }\n\n        :host([loading]) telia-skeleton {\n            height: ${unsafeCSS(spacing.spacing12)};\n            width: ${unsafeCSS(spacing.spacing128)};\n        }\n    `;\n\n    @property({ type: String })\n    declare anchor: string;\n\n    @property({ type: String, attribute: true, reflect: true })\n    declare placement?: Placement;\n\n    @property({ type: Boolean, attribute: true, reflect: true })\n    declare loading: boolean;\n\n    connectedCallback() {\n        super.connectedCallback();\n\n        const anchorElement = document.getElementById(this.anchor);\n        if (anchorElement) {\n            this.anchorElement = anchorElement;\n        }\n\n        window.addEventListener('click', this.onWindowClick);\n\n        const cleanup = autoUpdate(this.reference(), this, this.position);\n        this.cleanup = () => {\n            window.removeEventListener('click', this.onWindowClick);\n            cleanup();\n        };\n    }\n\n    disconnectedCallback() {\n        this.dispatchEvent(new CustomEvent('close'));\n        this.cleanup();\n        super.disconnectedCallback();\n    }\n\n    private declare cleanup: () => void;\n    private declare anchorElement: HTMLElement;\n    private declare cursor: { x: number; y: number };\n\n    private onWindowClick = (event: MouseEvent) => {\n        const { target, clientX, clientY } = event;\n\n        // First click, only store cursor position\n        if (!this.cursor) {\n            this.cursor = { x: clientX, y: clientY };\n            return;\n        }\n\n        // Click target is part of popup\n        if (!target || target === this || this.contains(target as Node)) {\n            return;\n        }\n\n        // Click target is part of anchor element\n        if (\n            this.anchorElement &&\n            (target === this.anchorElement || this.anchorElement.contains(target as Node))\n        ) {\n            return;\n        }\n\n        this.remove();\n    };\n\n    private position = () => {\n        const middleware: Middleware[] = [];\n\n        if (!this.placement) {\n            middleware.push(autoPlacement());\n        }\n\n        computePosition(this.reference(), this, {\n            middleware,\n            placement: this.placement,\n        }).then(({ x, y }) => {\n            Object.assign(this.style, {\n                left: `${x}px`,\n                top: `${y}px`,\n            });\n        });\n    };\n\n    private reference = () => {\n        if (!this.anchorElement && !this.cursor) {\n            return virtual({ x: 0, y: 0 });\n        }\n\n        return this.anchorElement || virtual(this.cursor);\n    };\n\n    render() {\n        if (this.loading) {\n            return html`\n                <telia-skeleton round> </telia-skeleton>\n                <telia-skeleton round> </telia-skeleton>\n                <telia-skeleton round> </telia-skeleton>\n                <telia-skeleton round> </telia-skeleton>\n                <telia-skeleton round> </telia-skeleton>\n            `;\n        }\n\n        return html` <slot> </slot> `;\n    }\n}\n\ndefine('alliance-pop-over', PopOver);\n\nfunction virtual({ x, y }: { x: number; y: number }) {\n    return {\n        getBoundingClientRect: () => ({\n            width: 0,\n            height: 0,\n            x: x,\n            y: y,\n            top: y,\n            left: x,\n            right: x,\n            bottom: y,\n        }),\n    };\n}\n","// This file is generated - see scripts/map-voca-components.js\nimport '@teliads/components/dist/components/telia-skeleton';\n"]}

package/components/chunk-JQ76TOQT.js

@@ -1,4 +0,0 @@
-import '@teliads/components/dist/components/telia-button';
-import '@teliads/components/dist/components/telia-icon';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-JQ76TOQT.js.map

package/components/chunk-JQ76TOQT.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/voca/components/telia-button.ts","../src/voca/components/telia-icon.ts"],"names":[],"mappings":";AACA,OAAO;;;ACAP,OAAO","sourcesContent":["// This file is generated - see scripts/map-voca-components.js\nimport '@teliads/components/dist/components/telia-button';\n","// This file is generated - see scripts/map-voca-components.js\nimport '@teliads/components/dist/components/telia-icon';\n"]}

package/components/chunk-MA6NFT5S.js

@@ -1,121 +0,0 @@
-import { spacing, borders, colors, motion, focus } from './chunk-5A2VXG2P.js';
-import { define, __decorateClass } from './chunk-AW7BCYX5.js';
-import { LitElement, css, html, unsafeCSS } from 'lit';
-import { property } from 'lit/decorators.js';
-
-var Table = class extends LitElement {
-  static {
-    this.styles = css`
-        :host {
-            display: table;
-            border-collapse: collapse;
-            width: 100%;
-        }
-    `;
-  }
-  render() {
-    return html` <alliance-tb>
-            <slot></slot>
-        </alliance-tb>`;
-  }
-};
-define("alliance-table", Table);
-var TableBody = class extends LitElement {
-  static {
-    this.styles = css`
-        :host {
-            display: table-row-group;
-            vertical-align: middle;
-            border-color: inherit;
-        }
-    `;
-  }
-  render() {
-    return html`<slot></slot>`;
-  }
-};
-define("alliance-tb", TableBody);
-var TableData = class extends LitElement {
-  static {
-    this.styles = css`
-        :host {
-            display: table-cell;
-            vertical-align: inherit;
-            padding: ${unsafeCSS(spacing.spacing24)};
-        }
-    `;
-  }
-  render() {
-    return html` <slot></slot> `;
-  }
-};
-define("alliance-td", TableData);
-var TableHead = class extends LitElement {
-  constructor() {
-    super();
-    this.label = "";
-  }
-  static {
-    this.styles = css`
-        :host {
-            display: table-cell;
-            padding: ${unsafeCSS(spacing.spacing24)};
-        }
-    `;
-  }
-  render() {
-    return html`<telia-heading tag="h4" variant="title-100">${this.label}</telia-heading>`;
-  }
-};
-__decorateClass([
-  property({ type: String })
-], TableHead.prototype, "label", 2);
-define("alliance-th", TableHead);
-var TableRow = class extends LitElement {
-  constructor() {
-    super();
-    this.clickable = false;
-  }
-  static {
-    this.styles = css`
-        :host {
-            display: table-row;
-            border-bottom: ${unsafeCSS(borders.widthXs)} solid ${unsafeCSS(colors.gray200)};
-        }
-    `;
-  }
-  render() {
-    return html`
-            ${this.clickable ? clickableStyling : ""}
-            <slot></slot>
-        `;
-  }
-};
-__decorateClass([
-  property({ type: Boolean })
-], TableRow.prototype, "clickable", 2);
-var clickableStyling = html`<style>
-    :host {
-        background-color: transparent;
-        transition: background-color ${unsafeCSS(motion.duration150)} ${unsafeCSS(motion.easeIn)};
-        cursor: pointer;
-    }
-
-    :host(:hover),
-    :host(:focus-visible),
-    :host(:focus) {
-        background-color: ${unsafeCSS(colors.gray200)};
-    }
-
-    :host(:active) {
-        background-color: ${unsafeCSS(colors.gray300)};
-    }
-
-    :host(:focus-visible) {
-        outline: solid ${unsafeCSS(focus.focusBorderWidth)} ${unsafeCSS(focus.focusColor)};
-        outline-offset: ${unsafeCSS(spacing.spacing4)};
-    }
-</style>`;
-define("alliance-tr", TableRow);
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-MA6NFT5S.js.map