@postnord/pn-marketweb-components 4.2.2 → 4.2.3

package/collection/components/cards/pn-versa-card/pn-versa-card.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pn-versa-card.stories.js","sourceRoot":"","sources":["../../../../src/components/cards/pn-versa-card/pn-versa-card.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import { arrow_right } from 'pn-design-assets/pn-assets/icons';\n\nimport {\n    createComponent,\n    createDocumentation,\n} from '@/globals/documentation/story';\nimport type {\n    Meta,\n    StoryObj,\n} from '@storybook/web-components';\n\nimport docs from './pn-versa-card-docs.json';\n\ntype VersaSize = 'default' | 'halfwidth' | 'onethirdwidth' | 'onequarterwidth';\ntype CardColor = 'white' | 'blue25' | 'business' | 'blue50' | 'blue400' | 'blue900' | 'coral25' | 'coral50' | 'green25' | 'green50' | 'none';\n\ntype VersaCardStoryArgs = Omit<Partial<HTMLPnVersaCardElement>, 'theme'> & {\n    /**\n     * Wrapper-only sizing (because SCSS targets `.halfwidth .pn-versa-card-hasBg { ... }`)\n     */\n    size?: VersaSize;\n\n    /** RTE slot content (simulates CMS output) */\n    rteHtml?: string;\n\n    /** CTA slot content (simulates CMS output) */\n    ctaHtml?: string;\n\n    /** Story-only attribute mapped to data-card-color */\n    cardColor?: CardColor;\n\n    imageSrc?: string;\n    imageAlt?: string;\n};\n\nconst { argTypes, textContent } = createDocumentation(docs);\n\nconst meta: Meta<VersaCardStoryArgs> = {\n    title: 'Components/Cards/Versa card',\n    parameters: {\n        docs: { description: { story: textContent } },\n    },\n    args: {\n        // Wrapper sizing\n        size: 'onequarterwidth',\n\n        // Content props\n        label: 'Example label',\n        heading: 'Example heading',\n        headingLevel: 'h3',\n        preamble: 'Example preamble',\n        imageSrc: 'https://www.postnord.se/siteassets/vi-tar-saker-framat---kampanjsida/paketbox3.jpg',\n        imageAlt: 'Versa card image',\n\n        // Slot content (optional)\n        rteHtml: '<p>Lorem ipsum dolor sit amet, <a href=\"#\">consectetur</a> adipiscing elit.</p>',\n        ctaHtml: `<pn-button class=\"pn-button\" appearance=\"light\" target=\"_blank\" href=\"google.com\"> Read More </pn-button> <a class=\"versa-card-cta-link-animated\"> Läs mer här <pn-icon icon='${arrow_right}' > </pn-icon> `,\n\n        // Modifier props (Stencil @Prop)        \n        hasImageCover: false,\n        imageGrow: false,\n        horizontal: false,\n        imgAlignment: 'left',\n        roundImage: false,\n        center: false,\n        alignMiddle: false,\n        cardColor: 'white',\n        opacity: 85,\n    },\n    argTypes: {\n        ...argTypes,\n\n        // Slots\n        rteHtml: { control: 'text', description: 'Injected into slot=\"rte\".' },\n        ctaHtml: { control: 'text', description: 'Injected into slot=\"cta\".' },\n        imageSrc: { control: 'text', description: 'Image URL for the image slot.' },\n        imageAlt: { control: 'text', description: 'Alt text for the image slot.' },\n\n        // Wrapper sizing\n        size: {\n            control: 'radio',\n            options: ['default', 'halfwidth', 'onethirdwidth', 'onequarterwidth'],\n            description:\n                'Adds a parent wrapper class for `.halfwidth` / `.onequarterwidth` selectors in SCSS.',\n        },\n\n        // Story-only data attribute\n        cardColor: {\n            control: { type: 'select' },\n            options: [\n                'none',\n                'white',\n                'blue25',\n                'blue50',\n                'blue400',\n                'blue900',\n                'coral25',\n                'coral50',\n                'green25',\n                'green50',\n            ],\n            description: 'Sets the data-card-color attribute on pn-versa-card.',\n        },\n\n        opacity: {\n            control: { type: 'range', min: 0, max: 100, step: 5 },\n        },\n        imgAlignment: {\n            control: 'select',\n            options: ['left', 'right'],\n            description: 'Sets the image to the right side of the card.',\n        },\n        roundImage: {\n            control: 'boolean',\n            description: 'Adds rounded image styling to the card.',\n        },\n\n        headingLevel: {\n            control: 'select',\n            options: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'],\n            description: 'Sets the heading level for the card heading.',\n        },\n        transparentBackground: {\n            control: 'boolean',\n            description: 'If true, applies reduced opacity to the card background to allow content behind the card to show through.',\n        },\n    },\n};\n\nexport default meta;\ntype Story = StoryObj<VersaCardStoryArgs>;\n\nfunction buildCard(args: VersaCardStoryArgs) {\n    const {\n        rteHtml,\n        ctaHtml,\n        size: _size,\n        cardColor,\n        ...componentArgs\n    } = args;\n\n    const { imageSrc,\n        imageAlt, } = args;\n\n    const el = createComponent('pn-versa-card', componentArgs) as HTMLElement;\n\n    if (cardColor) {\n        if (cardColor === 'none') {\n            el.setAttribute('data-card-color', '');\n        } else {\n            el.setAttribute('data-card-color', cardColor);\n        }\n    }\n\n    if (rteHtml?.trim()) {\n        const rte = document.createElement('div');\n        rte.slot = 'rte';\n        rte.innerHTML = rteHtml;\n        el.appendChild(rte);\n    }\n\n    if (ctaHtml?.trim()) {\n        const cta = document.createElement('div');\n        cta.slot = 'cta';\n        cta.innerHTML = ctaHtml;\n        el.appendChild(cta);\n    }\n\n    if (imageSrc) {\n        const media = document.createElement('div');\n        media.slot = 'image';\n\n        const picture = document.createElement('picture');\n        const img = document.createElement('img');\n        img.src = imageSrc;\n\n        if (imageAlt) {\n            img.alt = imageAlt;\n        }\n\n        picture.appendChild(img);\n        media.appendChild(picture);\n        el.appendChild(media);\n    }\n\n    return el;\n}\n\n/**\n * One card, constrained by wrapper class, and centered on the page.\n */\nfunction renderCenteredQuarter(args: VersaCardStoryArgs) {\n    const wrapper = document.createElement('div');\n\n    if (args.size && args.size !== 'default') {\n        wrapper.className = args.size;\n    }\n\n    wrapper.style.marginInline = 'auto';\n    wrapper.style.display = 'block';\n    wrapper.style.maxWidth = '420px';\n\n    wrapper.appendChild(buildCard(args));\n    return wrapper;\n}\n\nfunction renderCenteredRow(\n    items: VersaCardStoryArgs[],\n    size: VersaSize,\n    columns: number,\n) {\n    const wrapper = document.createElement('div');\n\n    if (size !== 'default') {\n        wrapper.className = size;\n    }\n\n    wrapper.style.display = 'flex';\n    wrapper.style.justifyContent = 'center';\n    wrapper.style.width = '100%';\n    wrapper.style.height = '100%';\n\n    const row = document.createElement('div');\n    row.style.display = 'flex';\n    row.style.gap = '24px';\n    row.style.alignItems = 'stretch';\n    row.style.height = '100%';\n\n    items.forEach((item) => {\n        const col = document.createElement('div');\n        col.style.flex = `0 1 ${100 / columns}%`;\n        col.style.display = 'flex';\n\n        const card = buildCard(item);\n        card.style.flex = '1';\n\n        col.appendChild(card);\n        row.appendChild(col);\n    });\n\n    wrapper.appendChild(row);\n    return wrapper;\n}\n\n/* -----------------------------\n   Stories\n--------------------------------*/\n\nexport const OneCardCenteredQuarterPlayGround: Story = {\n    name: 'Playground (all controls enabled, for testing purposes)',\n    render: (args) =>\n        renderCenteredRow(\n            [\n                {\n                    ...args,\n                    rteHtml: '<p>Lorem ipsum dolor sit amet, <a href=\"#\">consectetur</a> adipiscing elit. ipsum sodales tincidunt tincidunt nec nisi. Sed ante mauris, tempus sit amet dictum a, ornare tincidunt ex.</p> <blockquote> This is a blockquote example.This is a blockquote example.This is a blockquote example.This is a blockquote example. </blockquote>',\n                },\n            ],\n            'onethirdwidth',\n            1,\n        ),\n    parameters: {\n        controls: {\n            exclude: [],\n        },\n    },\n};\n\nexport const OneCardCenteredQuarterDefault: Story = {\n    name: 'Background, Image, Label, Heading, Preamble, RTE, CTA)',\n    render: (args) => renderCenteredQuarter(args),\n    args: {\n        label: 'Test',\n        heading: 'Heading',\n        preamble: 'Here goes the preamble for this block',\n        rteHtml:\n            '<p>Lorem ipsum dolor sit amet, <a href=\"#\">consectetur</a> adipiscing elit. ipsum sodales tincidunt tincidunt nec nisi. Sed ante mauris, tempus sit amet dictum a, ornare tincidunt ex.</p>',\n        ctaHtml: `<pn-button class=\"btn btn-secondary\">Click me</pn-button>`,\n        cardColor: 'blue25',\n    },\n    parameters: {\n        controls: {\n            include: ['hasBg', 'label', 'heading', 'headingLevel', 'preamble', 'imageSrc', 'cardColor'],\n        },\n    },\n};\n\nexport const OneCardRoundedImage: Story = {\n    name: 'RoundedImage, Label, Heading, Preamble, RTE, CTA, Alignment)',\n    render: (args) => renderCenteredQuarter(args),\n    args: {\n        roundImage: true,\n        center: false,\n        label: 'Test',\n        heading: 'Heading',\n        preamble: 'Here goes the preamble for this block',\n        rteHtml:\n            '<p>Lorem ipsum dolor sit amet, <a href=\"#\">consectetur</a> adipiscing elit. ipsum sodales tincidunt tincidunt nec nisi. Sed ante mauris, tempus sit amet dictum a, ornare tincidunt ex.</p>',\n    },\n    parameters: {\n        controls: {\n            include: ['label', 'heading', 'preamble', 'imageSrc', 'center', 'hasBg', 'cardColor', 'headingLevel'],\n        },\n    },\n};\n\n\nexport const OneCardCenteredQuarterImageCoverText: Story = {\n    name: 'Background, Image, Label, Heading, Preamble, RTE, CTA)',\n    render: (args) => renderCenteredQuarter(args),\n    args: {\n        hasImageCover: true,\n        label: 'Test',\n        heading: 'Heading',\n        preamble: 'Here goes the preamble for this block',\n        rteHtml:\n            '<p>Lorem ipsum dolor sit amet, <a href=\"#\">consectetur</a> adipiscing elit. ipsum sodales tincidunt tincidunt nec nisi. Sed ante mauris, tempus sit amet dictum a, ornare tincidunt ex.</p>',\n        ctaHtml: `<pn-button class=\"btn btn-secondary\">Click me</pn-button> <a target=\"_blank\" href=\"google.com\" class= \"versa-card-cta-link-animated\" > Read More<pn- icon icon='${arrow_right}' > </pn-icon></a > `,\n        cardColor: 'blue25',\n    },\n    parameters: {\n        controls: {\n            include: ['hasBg', 'label', 'heading', 'preamble', 'imageSrc', 'opacity', 'cardColor', 'center'],\n        },\n    },\n};\n\nexport const ThreeCardsCenteredQuarter: Story = {\n    name: 'Three cards, centered, with background and image (for layout testing)',\n    parameters: {\n        controls: {\n            include: ['imageSrc'],\n        },\n    },\n    render: (args) =>\n        renderCenteredRow(\n            [\n                {\n                    ...args,\n\n                    cardColor: 'blue25',\n                    label: 'Card 1',\n                    rteHtml:\n                        '<p>Lorem ipsum dolor sit amet, <a href=\"#\">consectetur</a> adipiscing elit. ipsum sodales tincidunt tincidunt nec nisi. Sed ante mauris, tempus sit amet dictum a, ornare tincidunt ex.</p>',\n                },\n                {\n                    ...args,\n                    label: 'Card 2',\n                    heading: 'I am a card with no modifier',\n\n                },\n                {\n                    ...args,\n                    hasImageCover: true,\n                    preamble: '',\n                    heading: '',\n                    label: '',\n                    rteHtml: '',\n                    ctaHtml: '',\n                },\n            ],\n            'onethirdwidth',\n            3,\n        ),\n};\n\nexport const OneCardCenteredQuarterDefaultHorizontal: Story = {\n    name: 'Horizontal Background, Image, Label, Heading, Preamble, RTE, CTA)',\n    parameters: {\n        controls: {\n            include: ['hasBg', 'label', 'heading', 'preamble', 'imageSrc', 'imgAlignment', 'roundImage', 'cardColor'],\n        },\n    },\n    render: (args) =>\n        renderCenteredRow(\n            [\n                {\n                    ...args,\n                    horizontal: true,\n                    rteHtml:\n                        '<p>Lorem ipsum dolor sit amet, <a href=\"#\">consectetur</a> adipiscing elit. ipsum sodales tincidunt tincidunt nec nisi. Sed ante mauris, tempus sit amet dictum a, ornare tincidunt ex.</p>',\n                    ctaHtml: `<pn-button class=\"btn btn-primary\">Click me</pn-button> <a target=\"_blank\" href=\"google.com\" class=\"\"> Read More <pn-icon icon='${arrow_right}' > </pn-icon></a>`,\n                },\n            ],\n            'halfwidth',\n            1,\n        ),\n};\n\n\nexport const OneCardCenteredQuarterTransparentBackground: Story = {\n    name: 'Horizontal Transparent Background (Image, Label, Heading, Preamble, RTE, CTA)',\n    parameters: {\n        controls: {\n            include: [\n                'hasBg',\n                'transparentBackground',\n                'label',\n                'heading',\n                'preamble',\n                'imageSrc',\n                'imageAlt',\n                'imgAlignment',\n                'roundImage',\n                'cardColor',\n            ],\n        },\n    },\n    render: (args) => {\n        const wrapper = document.createElement('div');\n\n        wrapper.style.background = 'linear-gradient(135deg, #fff 0%, #000 100%)';\n        wrapper.style.padding = '64px 0';\n\n        const row = renderCenteredRow(\n            [\n                {\n                    ...args,\n                    horizontal: true,\n                    rteHtml: `\n                        <p>This card demonstrates a <strong>10% transparent background</strong>.\n                        The gradient behind the card should be visible through the background.</p>\n                    `,\n                    ctaHtml: `\n                        <pn-button class=\"btn btn-primary\">Click me</pn-button>\n                        <a target=\"_blank\" href=\"https://google.com\">\n                            Read More <pn-icon icon='${arrow_right}'></pn-icon>\n                        </a>\n                    `,\n                },\n            ],\n            'halfwidth',\n            1,\n        );\n\n        wrapper.appendChild(row);\n\n        return wrapper;\n    },\n\n    args: {\n        transparentBackground: true,\n        label: 'Story demo',\n        heading: 'Transparent background card',\n        preamble: 'The card background is slightly transparent while content remains opaque.',\n        imgAlignment: 'left',\n        roundImage: false,\n        cardColor: 'white',\n    },\n};"]}

package/collection/components/charts/pn-chart/pn-chart.js

@@ -42,7 +42,7 @@ export class PnChart {
         this.myChart = new Chart(this.myChartCtxRef, chartCfg(this.dataChartType, this.data, this.numberOfSetsGreaterThanOne));
     }
     render() {
-        return (h(Host, { key: '9f6a915eca5ae80c2a9480976f08c81e5b70d824' }, h("div", { key: 'a0652b45298fdd319abcb79a80edab1146778685', class: "chart-wrapper" }, h("canvas", { key: '5f14dfdfdd2fef79261be72fc58efc02c3bfa7b5', id: "chart-canvas", class: "pnChart" }))));
+        return (h(Host, { key: '9f34e03c80c36bbe89f2407290a4d343164ac71f' }, h("div", { key: '7f61a11f9685fdacf6e984f8d4d4a907a17f4a43', class: "chart-wrapper" }, h("canvas", { key: '1483c145b02848fb2bd5e06efd9261eede6eafb0', id: "chart-canvas", class: "pnChart" }))));
     }
     static get is() { return "pn-chart"; }
     static get originalStyleUrls() {

package/collection/components/charts/pn-charts-card/pn-charts-card.js

@@ -19,9 +19,9 @@ export class PnChartsCard {
         return null;
     };
     render() {
-        return (h(Host, { key: '6f733408b55d43315de16b39f2ca0cb48cad1a10' }, h("slot", { key: '47962ca07bd4ab85bf72ee27f3e56d96fd02936d', name: "clickable-block-wrapper" }), h("div", { key: '96e09155b42f594c6866262b81b68c07c5b194ca', class: "pn-charts-card__wrapper" }, this.header &&
-            (h("div", { key: 'c578bbaacd00e4963b2678b2e01b70c5033ab573', class: "pn-charts-card__heading__wrapper pn-charts-card__heading__wrapper--vertical" }, h("h2", { key: '1efbdcebf15c7af69b72219e5cd21b26873d8c69', class: "pn-charts-card__heading" }, this.header), h("div", { key: '0591981bd49e82a510aeda2b986e3711672a997e', class: "pn-charts-card__heading__highlight" }, this.highlight))), h("div", { key: 'e35bde7b730cb7a41eb1d7eff4454010bdb666ae', class: "pn-charts-card__content__wrapper" }, h("slot", { key: '908090196e4f205b347fc13309b3dd06b1de168c', name: "chart" }), h("div", { key: 'd546186e8244af382ac220514aa7edf5eecb033a', class: "pn-charts-card__text__container" }, this.header &&
-            (h("div", { key: '123ff886ddad4911522385a01f43db2787928cc9', class: "pn-charts-card__heading__wrapper pn-charts-card__heading__wrapper--horizontal" }, h("h2", { key: '5f02a104d719cfc5c785c2ce40ee389c4e8c3a66', class: "pn-charts-card__heading pn-charts-card__heading" }, this.header), h("div", { key: '050bc7518f8e0afcefcedfbe529286b778650cb8', class: "pn-charts-card__heading__highlight" }, this.highlight))), h("span", { key: 'dd21c533f436b8c3b3755a3de80fa759800f122e', class: "pn-charts-card__preamble" }, this.preamble), h("div", { key: '2442b29c8f74de7001698d6fb431420b53e3345d', class: "pn-charts-card__text__wrapper" }, h("div", { key: '9f98181d22c1e2448d5af89e79904b459b059af6', class: "pn-charts-card__source" }, h("label", { key: '9634730f55c11cca03ec1505dcd5977b70e72e74' }, this.label), this.source ? h("p", { class: "pn-chart-card__text__heading" }, this.source) : null, this.showCtaLinkText())))))));
+        return (h(Host, { key: '932e9396a6f2d92296f7d3891d30c8b239f7c505' }, h("slot", { key: 'f7b2cee3fbb752529007d357977367b75d7d92dc', name: "clickable-block-wrapper" }), h("div", { key: '4e41ef800cd83f9655498dc003cc475adf94be74', class: "pn-charts-card__wrapper" }, this.header &&
+            (h("div", { key: '887b87722b03a88b437e1fb8f08cd5b96a22d801', class: "pn-charts-card__heading__wrapper pn-charts-card__heading__wrapper--vertical" }, h("h2", { key: '7e42eed995b18e6e35420bc7164e2292c0ad8bad', class: "pn-charts-card__heading" }, this.header), h("div", { key: '2e5d4bfc48f85dca46a8a686ecc74c53fbea7f43', class: "pn-charts-card__heading__highlight" }, this.highlight))), h("div", { key: 'e6afaecfbff9546b65f23d063d78d2bd85fa577c', class: "pn-charts-card__content__wrapper" }, h("slot", { key: '9f648bbfba9338cadbdabf6045a4ed19a0575a99', name: "chart" }), h("div", { key: 'df43a6c84b8d990ac7ce92daea524c93427684ad', class: "pn-charts-card__text__container" }, this.header &&
+            (h("div", { key: 'fad6bbcd1d3588f580f55aeb0852acd8522e696e', class: "pn-charts-card__heading__wrapper pn-charts-card__heading__wrapper--horizontal" }, h("h2", { key: 'db90f01327a55f0acffaeb11be0839b348dc3854', class: "pn-charts-card__heading pn-charts-card__heading" }, this.header), h("div", { key: 'e08e7589c11ed25b8d0b2986e2e940a24d4f911e', class: "pn-charts-card__heading__highlight" }, this.highlight))), h("span", { key: '75d76421250f366755f17f0e42217d88fb6155fd', class: "pn-charts-card__preamble" }, this.preamble), h("div", { key: 'b54eea882f8f9d8b3934dda3fdcae18d76f938ce', class: "pn-charts-card__text__wrapper" }, h("div", { key: '5696594a4b9eec838d7bedfc515e11f2d95b3268', class: "pn-charts-card__source" }, h("label", { key: '1364ed359aa0bc1ab99d06a560cb3d03e3a0fede' }, this.label), this.source ? h("p", { class: "pn-chart-card__text__heading" }, this.source) : null, this.showCtaLinkText())))))));
     }
     static get is() { return "pn-charts-card"; }
     static get originalStyleUrls() {

package/collection/components/cta/pn-cta-block/pn-cta-block.js

@@ -13,8 +13,8 @@ export class PnCtaBlock {
     render() {
         const hasImage = this.hostElement.querySelector('[slot="illustration"]');
         const hasButtons = this.hostElement.querySelector('[slot="cta-buttons"]');
-        return (h(Host, { key: 'cd97d60c2c61e127f2e4deacab39fb7f773694ea' }, h("div", { key: 'b01ea2ef995dae9d741d1da0f5119ab612ade54a', "pn-background-color": this.pnBackgroundColor, class: `cta-block ${this.isLarge ? 'cta-block--large' : ''}  ${this.isCentered ? 'cta-block--center' : ''}  ${(this.isSmall ? 'cta-block--small' : '')} ${this.contentTop ? 'cta-block--content-top' : ''}` }, (hasImage ?
-            h("div", { class: "cta-block__image-wrapper" }, h("slot", { name: "illustration" })) : null), h("div", { key: '2b94493d618cabd0205e5cecfd105cec3a695528', class: "cta-block__content" }, (this.heading) ? h("h2", { class: "cta-block__heading" }, this.heading) : null, (this.bodyText) ? h("p", { class: "cta-block__text" }, this.bodyText) : null), (hasButtons ?
+        return (h(Host, { key: '8b2108e0a03e9545be40625634ab9557d868b812' }, h("div", { key: '53a19992a4c642703476963faa81dae31783f3e7', "pn-background-color": this.pnBackgroundColor, class: `cta-block ${this.isLarge ? 'cta-block--large' : ''}  ${this.isCentered ? 'cta-block--center' : ''}  ${(this.isSmall ? 'cta-block--small' : '')} ${this.contentTop ? 'cta-block--content-top' : ''}` }, (hasImage ?
+            h("div", { class: "cta-block__image-wrapper" }, h("slot", { name: "illustration" })) : null), h("div", { key: '6dbd1b2f7318308ed374582ca50638453a834b73', class: "cta-block__content" }, (this.heading) ? h("h2", { class: "cta-block__heading" }, this.heading) : null, (this.bodyText) ? h("p", { class: "cta-block__text" }, this.bodyText) : null), (hasButtons ?
             h("div", { class: "cta-block__action" }, h("slot", { name: "cta-buttons" })) : null))));
     }
     static get is() { return "pn-cta-block"; }

package/collection/components/cta/pn-parcel-tracker/pn-parcel-tracker.js

@@ -15,7 +15,7 @@ export class PnSpotlight {
         this.currentWidth = event.target.innerWidth;
     }
     render() {
-        return (h(Host, { key: '1175ee79bdd43c697cff71530375a02bc7608382' }, h("div", { key: '7d5059b7384060cf1937c45341b01998ec1220d7', class: "pn-parcel-tracker__container" }, h("form", { key: '3a416b4c483e99a953c715e16f3f3ea83591570a', method: "GET", action: this.formActionUrl }, h("h3", { key: '832541b313250e8960f93298f5c6e90e5af405c8', class: "pn-parcel-tracker__container__heading" }, this.heading), h("pn-marketweb-input", { key: '73b2290a2ec9427faf6110ef97a2df0f5c7bd51f', name: this.inputName, placeholder: this.placeholder }), h("pn-button", { key: '1f99b01aba200dc0e863058d9df9ff3bd015f959', type: "submit", icon: search, tooltip: this.currentWidth < 412 ? this.buttonLabel : null }, this.currentWidth >= 412 && this.buttonLabel)))));
+        return (h(Host, { key: '9e19eb36a77777d651f61085a8552f9aa8310b79' }, h("div", { key: '73ef3e4cda0a382e79270e2c43f4ddaa8bcd4414', class: "pn-parcel-tracker__container" }, h("form", { key: '66349ff229bb9d7cca1982a72a1fa300166d1631', method: "GET", action: this.formActionUrl }, h("h3", { key: 'eabf93412d1df20d5cc99a74e30337378d43b37a', class: "pn-parcel-tracker__container__heading" }, this.heading), h("pn-marketweb-input", { key: 'e8dab573ff27b488160181f803fe97207e0ab330', name: this.inputName, placeholder: this.placeholder }), h("pn-button", { key: '43c41a32db482f094659fe055d22b143d8af0e17', type: "submit", icon: search, tooltip: this.currentWidth < 412 ? this.buttonLabel : null }, this.currentWidth >= 412 && this.buttonLabel)))));
     }
     static get is() { return "pn-parcel-tracker"; }
     static get originalStyleUrls() {

package/collection/components/cta/pn-quick-cta/pn-quick-cta.js

@@ -6,7 +6,7 @@ export class PnQuickCta {
     }
     hostElement;
     render() {
-        return (h(Host, { key: 'ab5954c7894705ca1d6faeb541b63ef9a28ce39e' }, h("div", { key: '2fe82eb368e7c6f13a1e541e54f4f2679b99ed20', class: "quick-cta__content" }, this.heading && h("h2", { key: '7f766e4fb92eaa1e9ecc5ae90ec850dd80348585', class: "quick-cta__content__heading" }, this.heading), h("p", { key: '1ac42d8d5d8c4995d5122b1f1fa68b42915b18b9', class: "quick-cta__content__preamble" }, this.preamble), h("slot", { key: '85be5b2684e761d02886325cd7b3b55a01dbacb4', name: "quick-cta-cta" }))));
+        return (h(Host, { key: '0bcb4363f2719183b49ddbe16a2b4a4f73cb1833' }, h("div", { key: 'd0cad8249fb1f6f2bcfc42f5996f7749ef8eb829', class: "quick-cta__content" }, this.heading && h("h2", { key: 'a48140c8941a10038bda1da2895a85e74815ac99', class: "quick-cta__content__heading" }, this.heading), h("p", { key: '406a9a8ce995e35e09df5a4514a5ee10507cd537', class: "quick-cta__content__preamble" }, this.preamble), h("slot", { key: '075922f329090b5ca955bae2112c4197ae08135a', name: "quick-cta-cta" }))));
     }
     static get is() { return "pn-quick-cta"; }
     static get originalStyleUrls() {

package/collection/components/cta/pn-share/pn-share-item.js

@@ -6,7 +6,7 @@ export class PnShareItem {
     }
     hostElement;
     render() {
-        return (h(Host, { key: '91e29d95c93de36f6874abf2122f38d931d539f1' }, h("div", { key: 'ee1a46c97cdda226d697983e9a05c03d205c0997', class: "pn-share-item__container" }, h("a", { key: 'dd417980b984ec45a783f73fd0f3353010e9efe4', href: `${this.link}` }, h("slot", { key: 'c84b5b9f86a2a707eaa65f80dd5f02ca65c3b512', name: "icon" }), " ", this.text))));
+        return (h(Host, { key: '4e1cea876f61c710df92104b45e50ba66cf0b623' }, h("div", { key: '0e6aed22f766bcb4f1f6eb84f36e3d4ba440e37a', class: "pn-share-item__container" }, h("a", { key: '563a048cf8a4b6050bf3db2a6621ae0743b298eb', href: `${this.link}` }, h("slot", { key: 'e5376f9ccd073b93adb746c88631f574185a6854', name: "icon" }), " ", this.text))));
     }
     static get is() { return "pn-share-item"; }
     static get originalStyleUrls() {

package/collection/components/cta/pn-share/pn-share.js

@@ -27,7 +27,7 @@ export class PnShare {
         this.setTranslations();
     }
     render() {
-        return (h(Host, { key: '64fc418773ad1694c97c3cead91687668d4d0a7d' }, h("div", { key: 'dedd71bce2dae6d868ea070c85fbb086f72d9ec8', class: "pn-share__container" }, h("h3", { key: 'a442ce3dcd201e1b9a1079ffc39b140b70e32f78', class: "pn-share__heading" }, this.i18n.sharelabel, ":"), h("div", { key: '88042477f52053ef2a839ad5b24d11c939a1ff06', class: "pn-share__items" }, SHARE_URLS.map(platform => {
+        return (h(Host, { key: '87c86e64bc6e31b8ecb1f172005dc1fa2b2a821a' }, h("div", { key: 'b0ae9877a73c5b2a67a6fc03e91cae21062df823', class: "pn-share__container" }, h("h3", { key: 'b410f35c7a3e20951b6795c886e755d4c9cc6337', class: "pn-share__heading" }, this.i18n.sharelabel, ":"), h("div", { key: 'e5b84fdc21fb4fcd5de996f55ef2b689d3385f80', class: "pn-share__items" }, SHARE_URLS.map(platform => {
             return (h("pn-share-item", { link: `${platform.url}${this.link}`, text: platform.text }, h("pn-icon", { slot: "icon", icon: platform.platform })));
         })))));
     }

package/collection/components/cta/pn-spotlight/pn-spotlight.js

@@ -12,7 +12,7 @@ export class PnSpotlight {
         this.addDynamic = classNames({ 'cta--dynamic': this.isDynamic });
     }
     render() {
-        return (h(Host, { key: 'b1d831c63742021f8f180473beb71b44b1665447' }, h("div", { key: '8abd3c2d5cd4e17675124cbabc971420e6be2960', class: "pn-spotlight__container" }, h("slot", { key: '456fc111a6dbd235c087c6991bf517189cc08033', name: "mobile-heading" }), h("div", { key: '84ee92f9b62e61981149c298fa20708b09e6ffa4', class: `pn-spotlight__container__wrapper ${this.addDynamic}` }, h("div", { key: '00e67b61996c7c9265652d7ff6d0cc29aaa3a685', class: "pn-spotlight__container__wrapper__content" }, h("div", { key: 'c417b1c80cd9518f9eb2620f1211d972f4da5c24', class: "pn-spotlight__container__wrapper__content__ball" }), h("slot", { key: '48817e2a5cb6d5c485be0485f4364fe9bef33742', name: "content" }))))));
+        return (h(Host, { key: 'ec938ca8e73e29c04d713fff497da4d57bd25de2' }, h("div", { key: '8ca6ff6b0027bed2c5c369e127c474a1cb0246e8', class: "pn-spotlight__container" }, h("slot", { key: 'efc788918cc0d68450f77484ed5c6379a8243b6a', name: "mobile-heading" }), h("div", { key: 'accea01d45fce0d3685430eee037e17a3c1786bd', class: `pn-spotlight__container__wrapper ${this.addDynamic}` }, h("div", { key: '1fd54fb9bdab12397824b92dbb307227a4f0f120', class: "pn-spotlight__container__wrapper__content" }, h("div", { key: '36331f2de4f9be557e70660353356c5a629f0776', class: "pn-spotlight__container__wrapper__content__ball" }), h("slot", { key: '3e56d7906daa1af24db9be615975c33b53d82968', name: "content" }))))));
     }
     static get is() { return "pn-spotlight"; }
     static get originalStyleUrls() {

package/collection/components/data-visualization/pn-stats-info/pn-stats-info-data/pn-stats-info-data.js

@@ -34,7 +34,7 @@ export class PnStatsInfoData {
         }
     }
     render() {
-        return (h(Host, { key: '76ba8987c10c1134632d1d14e835e2d151e40d7d' }, h("div", { key: 'cfca356710ab65efc3332390b9ff2c9d6e90543f', class: "pn-stats-info-data__container" }, h("div", { key: 'fca178d07e51036cb8b63e064686572588069304', class: "pn-stats-info-data__container__content" }, h("div", { key: '2bd549f1408aec0487e7cb7e0498141685e2d18c', class: "pn-stats-info-data__container__content__data", id: `pn-stats-info-data-${this.compId}-${this.index}` }), this.unit && h("div", { key: '1c8913969b0eed7e98e6045c7b6320d6a6391517', class: "pn-stats-info-data__container__content__unit" }, this.unit)), h("div", { key: 'e7c7f90a4661fbe22600946d8343e1d98e5cfaec', class: "pn-stats-info-data__container__content__preamble" }, this.preamble))));
+        return (h(Host, { key: 'a1341a3318a51adb8a170b773f9109110bca65c6' }, h("div", { key: 'e7c94b94b3cf2b1c7fd4c05f953ca537ec17153c', class: "pn-stats-info-data__container" }, h("div", { key: '391ad615fa5930728fb3a7baece08d3636c90820', class: "pn-stats-info-data__container__content" }, h("div", { key: 'a54130470a7c195f2789c440167022d9eafbee42', class: "pn-stats-info-data__container__content__data", id: `pn-stats-info-data-${this.compId}-${this.index}` }), this.unit && h("div", { key: '0aa67825205280a82b65f8f650203bcbe9318ded', class: "pn-stats-info-data__container__content__unit" }, this.unit)), h("div", { key: '14bd4ef96a6d6be6591dbcb314c395a016e9ad9c', class: "pn-stats-info-data__container__content__preamble" }, this.preamble))));
     }
     componentDidRender() {
         const observer = new IntersectionObserver(entries => inViewport(entries, 'is-inViewport', this.inViewPortCallback));

package/collection/components/data-visualization/pn-stats-info/pn-stats-info.js

@@ -12,7 +12,7 @@ export class PnStatsInfo {
             this.myParsedArray = JSON.parse(newValue);
     }
     render() {
-        return (h(Host, { key: '4040f13125e6100df1801a6545f681050617409a' }, h("div", { key: '51ca98b16eac1402169c0045a3b8e93f530013c5', class: "pn-stats-info__container" }, h("div", { key: 'c441538ce4df1ca3eb1d1893e4977bc3db2399f5', class: "pn-stats-info__container__map", style: { backgroundImage: `url(${this.backgroundUrl})` } }), h("div", { key: '78445b4b79e02216ab51987b9161784549d256bf', class: "pn-stats-info-image-container" }, h("slot", { key: '28368b7e52b6ccf527b7adf4e9d8f3a5d49c6b39', name: "illustration" })), h("div", { key: '2b49c7774f9859db711fb0c064183e9d3be4585d', class: "pn-stats-info__container__content", style: { backgroundImage: `url(${this.backgroundUrl})` } }, this.heading && h("h3", { key: '53d122a0f95dabd687dc71a494872651bab5652f', class: "pn-stats-info__container__content__heading" }, this.heading), h("div", { key: '79557faeb6e29b21d69cf08809faa3bb6d2e18ef', class: "pn-stats-info__container__content__data" }, this.myParsedArray &&
+        return (h(Host, { key: 'c0e816e4c281e81f243b88a2ccc7cb3f82e6d2a2' }, h("div", { key: '666152f5223cde318b12d55b4175b7622be3cb23', class: "pn-stats-info__container" }, h("div", { key: '29a902e1b93a94f9428fdf341eaba640177d4f14', class: "pn-stats-info__container__map", style: { backgroundImage: `url(${this.backgroundUrl})` } }), h("div", { key: 'b25c11b6e98bc2b36ea9859fa63903b0b3df18aa', class: "pn-stats-info-image-container" }, h("slot", { key: '368b94a4c51905e322b47d3ab064021005470d82', name: "illustration" })), h("div", { key: 'cea4df0e76ca50601b32f94a9ca3a3beb2bd8b09', class: "pn-stats-info__container__content", style: { backgroundImage: `url(${this.backgroundUrl})` } }, this.heading && h("h3", { key: '1e58ffbdfe93b320aee779751f05d49f9d2d1064', class: "pn-stats-info__container__content__heading" }, this.heading), h("div", { key: 'dbc3c69b74be499f991159ebcd5eeb515a54f509', class: "pn-stats-info__container__content__data" }, this.myParsedArray &&
             this.myParsedArray.map((stats, index) => {
                 return (h("pn-stats-info-data", { index: index, startValue: stats.startValue, data: stats.data, unit: stats.unit, preamble: stats.preamble, duration: stats.duration, format: stats.format, formatStyle: stats.formatStyle }));
             }))))));

package/collection/components/input/pn-address-autofill/pn-address-autofill.js

@@ -242,7 +242,7 @@ export class PnAddressAutofill {
         return str1;
     }
     render() {
-        return (h(Host, { key: '6e09c78bcd1117bbcdbcec1fc65444772636036d', class: "pn-address-autofill" }, this._postalCodeProps?.postalCodeCityLabel ? (h("div", { class: "label-container" }, h("label", null, `${this._postalCodeProps.postalCodeCityLabel + ' ' + this.postalCodeRequiredLabel}`))) : null, h("div", { key: '8f5a0760096e3618436b7554a6a5c89c1b0bab0a', class: "input-container-row" }, h("pn-input", { key: '2490a7c926f9c693cf67dabbd60e56297aee44aa', type: "number", name: this._postalCodeProps?.postalCodeInputName, required: this._postalCodeProps?.postalCodeInputRequired, placeholder: this._postalCodeProps?.postalCodeInputPlaceholder, ref: el => (this.pnInputPostalCode = el), autocomplete: "off", helpertext: this._postalCodeProps?.postalCodeInputHelpertext }), h("pn-input", { key: '49bc2fdedb78d9ce11c973bd0d2ab127603ab148', type: "text", name: this._cityProps?.cityInputName, disabled: true, value: this.city, placeholder: this._cityProps?.cityInputPlaceholder, autocomplete: "off", helpertext: this._cityProps?.cityInputHelpertext })), this._streetAddressProps?.streetAddressNumberLabel ? (h("div", { class: "label-container" }, h("label", null, `${this._streetAddressProps.streetAddressNumberLabel + ' ' + this.streetRequiredLabel}`))) : null, h("div", { key: 'fed64c4457c27593bf6a22dea066f029fcd4a53d', class: "input-container-row" }, h("pn-input", { key: '7d7667465f4cad869cf8274158611aa32b7a8975', type: "text", name: this._streetAddressProps?.streetAddressInputName, required: this._streetAddressProps?.streetAddressInputRequired, value: this.streetAddress, placeholder: this._streetAddressProps?.streetAddressInputPlaceholder, ref: el => (this.pnInputStreetAddress = el), autocomplete: "off", helpertext: this._streetAddressProps?.streetAddressInputHelpertext, disabled: this.isLoading }), h("pn-input", { key: '8bc6498685c92de3e53034dcf4fe7078e171e41f', type: "text", name: this._streetNumberProps?.streetNumberInputName, required: this._streetNumberProps?.streetNumberInputRequired, value: this.streetNumber, placeholder: this._streetNumberProps?.streetNumberInputPlaceholder, ref: el => (this.pnInputStreetNumber = el), autocomplete: "off", helpertext: this._streetNumberProps?.streetNumberInputHelpertext, disabled: this.isLoading })), (!this.validAddress && this.streetAddressInputField.value && this.streetNumberInputField.value) ? (h("div", { class: "toast-container" }, h("pn-toast", { text: this.addressNotFoundError ?? this.translation.addressNotFound, appearance: "warning", icon: alert_exclamation_circle }))) : null));
+        return (h(Host, { key: '43ca8acceb3c02a3a12a6c4da9ae4e4b12853709', class: "pn-address-autofill" }, this._postalCodeProps?.postalCodeCityLabel ? (h("div", { class: "label-container" }, h("label", null, `${this._postalCodeProps.postalCodeCityLabel + ' ' + this.postalCodeRequiredLabel}`))) : null, h("div", { key: '4c61dd29dc1b53a71ab04f79a405bda5323764ab', class: "input-container-row" }, h("pn-input", { key: 'fd0baf1681bc21da522310f1233e693aa3f490cf', type: "number", name: this._postalCodeProps?.postalCodeInputName, required: this._postalCodeProps?.postalCodeInputRequired, placeholder: this._postalCodeProps?.postalCodeInputPlaceholder, ref: el => (this.pnInputPostalCode = el), autocomplete: "off", helpertext: this._postalCodeProps?.postalCodeInputHelpertext }), h("pn-input", { key: 'daa23faa30b9b48969b3f58e09ef6fe29a1f666d', type: "text", name: this._cityProps?.cityInputName, disabled: true, value: this.city, placeholder: this._cityProps?.cityInputPlaceholder, autocomplete: "off", helpertext: this._cityProps?.cityInputHelpertext })), this._streetAddressProps?.streetAddressNumberLabel ? (h("div", { class: "label-container" }, h("label", null, `${this._streetAddressProps.streetAddressNumberLabel + ' ' + this.streetRequiredLabel}`))) : null, h("div", { key: 'da8ef7b1eeca53ccbb926260acd2df79b395ee64', class: "input-container-row" }, h("pn-input", { key: 'cfd025d69b0901885da50d5dd7a763171ff96318', type: "text", name: this._streetAddressProps?.streetAddressInputName, required: this._streetAddressProps?.streetAddressInputRequired, value: this.streetAddress, placeholder: this._streetAddressProps?.streetAddressInputPlaceholder, ref: el => (this.pnInputStreetAddress = el), autocomplete: "off", helpertext: this._streetAddressProps?.streetAddressInputHelpertext, disabled: this.isLoading }), h("pn-input", { key: 'f9da42b0af3c7726686393ce1f161ac30d93a8b3', type: "text", name: this._streetNumberProps?.streetNumberInputName, required: this._streetNumberProps?.streetNumberInputRequired, value: this.streetNumber, placeholder: this._streetNumberProps?.streetNumberInputPlaceholder, ref: el => (this.pnInputStreetNumber = el), autocomplete: "off", helpertext: this._streetNumberProps?.streetNumberInputHelpertext, disabled: this.isLoading })), (!this.validAddress && this.streetAddressInputField.value && this.streetNumberInputField.value) ? (h("div", { class: "toast-container" }, h("pn-toast", { text: this.addressNotFoundError ?? this.translation.addressNotFound, appearance: "warning", icon: alert_exclamation_circle }))) : null));
     }
     static get is() { return "pn-address-autofill"; }
     static get originalStyleUrls() {

package/collection/components/input/pn-bonus-progressbar/pn-bonus-progressbar-level.js

@@ -26,7 +26,7 @@ export class PnBonusProgressbarLevel {
         return `${this.value.toLocaleString('sv-SE', { maximumFractionDigits: 0 })} ${this.currency}`;
     }
     render() {
-        return (h(Host, { key: '17dea66cc0b3d8ba52533a05d1879ad441dadc39', style: { left: `${this.visualpercentage}%` } }, h("div", { key: '8037ab85d591c3fef10b6c54767be99e3acdc512', class: "progressbar-level-percentage" }, this.bonuspercentage), h("div", { key: 'fe23e4451775abe17c0c0b3dab1ba4ed66225b53', class: "progressbar-level-value" }, this.formatValue())));
+        return (h(Host, { key: '00b80f6a445e99d2ba395fcef54e4138c4485d53', style: { left: `${this.visualpercentage}%` } }, h("div", { key: '4a04a5b11d281fb92b94ea0dfb423df01a59b1f4', class: "progressbar-level-percentage" }, this.bonuspercentage), h("div", { key: 'de57ec39c15545fb1e854f9c2a9540c49885676e', class: "progressbar-level-value" }, this.formatValue())));
     }
     static get is() { return "pn-bonus-progressbar-level"; }
     static get originalStyleUrls() {

package/collection/components/input/pn-bonus-progressbar/pn-bonus-progressbar.js

@@ -78,7 +78,7 @@ export class PnBonusProgressbar {
         }
     }
     render() {
-        return (h(Host, { key: '89103fc6287e71d9ac12c7bcbb284959c0ea64bd' }, h("div", { key: '9a0b60180dc43681d5f5e1b7376435afb583765e', class: "bonusprogressbar-top" }, this.icon ? (h("div", { class: "bonusprogressbar-top-icon" }, h("pn-icon", { icon: this.icon, small: "false", color: this.iconColor() }))) : ({}), h("div", { key: '97f7f703387b719ab11ca555e5f46de0a38b0dcf', class: "bonusprogressbar-top-heading" }, h("h4", { key: '8127659ee7221eec13123fd0e07c1871a132fdf9', class: "bonusprogressbar-top-headline" }, this.heading, " ", h("strong", { key: '5883c56d6aa717e654634e4232e768e76b5f8236', class: "bonusprogressbar-top-percentage" }, this.bonuspercentage)), this.sumtext ? h("div", { class: "bonusprogressbar-sumtext" }, this.sumtext) : null)), h("div", { key: '9ca7943f007cfb8bf63c1c64032140ae158bed85', class: "bonusprogressbar-wrapper" }, h("progress", { key: 'db618cbeb83e9e6459c2db90da1806952b2b98b3', class: "bonusprogressbar-progress", value: this.progresspercentage, max: "100" }), h("slot", { key: '6954cfff8a350a37528f0529d1158b79b9abe499' }))));
+        return (h(Host, { key: '0c2800a5ff59a29a2932257f625a86ec8217ab78' }, h("div", { key: 'd53c24cd81f61b5b71e8065b423108e70b37228e', class: "bonusprogressbar-top" }, this.icon ? (h("div", { class: "bonusprogressbar-top-icon" }, h("pn-icon", { icon: this.icon, small: "false", color: this.iconColor() }))) : ({}), h("div", { key: '4bf2dd629ee729f680f75e0bdb25d60ab29463cb', class: "bonusprogressbar-top-heading" }, h("h4", { key: 'c23baca714b75a70374c164c4af5fee0ac3df1a8', class: "bonusprogressbar-top-headline" }, this.heading, " ", h("strong", { key: 'aecfe379324384f06b23c648de1f902a6f233f62', class: "bonusprogressbar-top-percentage" }, this.bonuspercentage)), this.sumtext ? h("div", { class: "bonusprogressbar-sumtext" }, this.sumtext) : null)), h("div", { key: 'c4186c08abbf122d0895f030a836b5adbd4b4a6c', class: "bonusprogressbar-wrapper" }, h("progress", { key: '043df984daf3c135d4248c67e62d83ee4e1ea978', class: "bonusprogressbar-progress", value: this.progresspercentage, max: "100" }), h("slot", { key: 'adc85d4228cbbc28aa2846b78f753660cd7e366a' }))));
     }
     static get is() { return "pn-bonus-progressbar"; }
     static get originalStyleUrls() {

package/collection/components/input/pn-choice-button/pn-choice-button.js

@@ -26,7 +26,7 @@ export class PnChoiceButton {
         }
     }
     render() {
-        return (h(Host, { key: 'ee8c0f187d6ef73fb0686269fef381f272ae0d7e' }, h("input", { key: '3849a4c37e9182114136854f445fbf0af6852c9c', type: this.type, id: this.choiceid, value: this.value, name: this.name || this.choiceid, disabled: this.disabled, checked: this.checked }), h("label", { key: '5aab99882ff06ac9d8583e6d0c7034cc611a0d0f', htmlFor: this.choiceid, class: "pn-choice-button" }, h("slot", { key: 'f42d62b727b8c570712cf95d0d20f96dd5707de6' }))));
+        return (h(Host, { key: 'a1a97f024a1817a0833541650309056b8d4765ea' }, h("input", { key: '028965fc99719face3b99d28e64915a089f5f6f9', type: this.type, id: this.choiceid, value: this.value, name: this.name || this.choiceid, disabled: this.disabled, checked: this.checked }), h("label", { key: '372c83ee394b81b038300bdc19f8cccd15f14e48', htmlFor: this.choiceid, class: "pn-choice-button" }, h("slot", { key: '92fd81e2908be7d4eebc81c5c3676340bb596cee' }))));
     }
     static get is() { return "pn-choice-button"; }
     static get originalStyleUrls() {

package/collection/components/input/pn-date-and-time/pn-date-and-time.js

@@ -142,7 +142,7 @@ export class PnDateAndTime {
         });
     }
     render() {
-        return (h(Host, { key: 'f1be759de557ea60e4c12f708e91632ec1f0bf90' }, h("div", { key: '709ee33d526aab6fd3b3aed63d185687eca9854b', class: "date-and-time-group" }, this.dateAndTimeLabel ? (h("div", { class: "date-and-time-row" }, h("label", null, this.dateAndTimeLabel))) : null, h("div", { key: 'ad997d2dd694e93844aed03e837790291651199b', class: "date-and-time-row" }, h("pn-date-picker", { key: 'e12a0e6951f48b1c2b6a031448bdcb593101eb3b', ref: el => (this.pnDatePicker = el), range: "false", "disable-weekends": this.disableWeekends, "min-date": this.firstValidDateString, "max-date": this.lastValidDateString, language: this.language, placeholder: this.datePlaceholder, "disabled-dates": this.disabledDates })), this.dateHelperText ? h("small", { class: "date-and-time-row helper-text" }, this.dateHelperText) : null), h("div", { key: '8f808ff0023f395811b39e13764b1a1ff38c05bb', class: "date-and-time-group" }, h("div", { key: 'd3736f13abc974023db9a6aab202f8359441f47a', class: "date-and-time-row" }, h("pn-select", { key: '9e5cf94ed805415387f99e4e5da82fa02d8fd885', ref: el => (this.pnTimeFromHourDropdown = el), name: "date-and-time-from-hour", class: "date-and-time-dropdown--time", invalid: this.invalidTimespan }, this.hourArr?.map((hour, index) => h("option", { label: hour, value: hour, selected: index === 0 }, hour))), h("pn-select", { key: '3a3e9751cae061bcb787a7a08267a98cca54cf0f', ref: el => (this.pnTimeFromMinuteDropdown = el), name: "date-and-time-from-minute", class: "date-and-time-dropdown--time", invalid: this.invalidTimespan }, this.minuteArr?.map((minute, index) => h("option", { label: minute, value: minute, selected: index === 0 }, minute))), h("div", { key: '5dcd5f72bf5c7f60f264a956565fab3604fe89b0', class: "time-separator" }, h("span", { key: '812361dbb911f67eda1491cc51dceabded0ed839' }, "-")), h("pn-select", { key: 'ddf1b5fc4cf7ac47d9d748488d0676b81aaf43cb', ref: el => (this.pnTimeToHourDropdown = el), name: "date-and-time-to-hour", class: "date-and-time-dropdown--time", invalid: this.invalidTimespan }, this.hourArr?.map((hour, index) => h("option", { label: hour, value: hour, selected: index === this.hourArr.length - 1 }, hour))), h("pn-select", { key: 'aa8e5c80f06343c13bc5f3b838f3d424e676778d', ref: el => (this.pnTimeToMinuteDropdown = el), name: "date-and-time-to-minute", class: "date-and-time-dropdown--time", invalid: this.invalidTimespan }, this.minuteArr?.map((minute, index) => h("option", { label: minute, value: minute, selected: index === this.minuteArr.length - 1 }, minute)))), this.timeHelperText ? h("small", { class: "date-and-time-row helper-text" }, this.timeHelperText) : null, this.invalidTimespan && this.errorMessage ? (h("small", { class: "date-and-time-row error-message" }, h("pn-icon", { icon: alert_info_circle, small: "false", color: "warning" }), this.errorMessage)) : null)));
+        return (h(Host, { key: '60e68e04200db9303ef2e84dc046a6c92844487f' }, h("div", { key: '8857c3a3232caa6b701f30b0f13d02dc2c739e54', class: "date-and-time-group" }, this.dateAndTimeLabel ? (h("div", { class: "date-and-time-row" }, h("label", null, this.dateAndTimeLabel))) : null, h("div", { key: '82e9e3a55361697b37275a0b4e31f5b09bd5eb43', class: "date-and-time-row" }, h("pn-date-picker", { key: 'efdd2e74f7eb8064073b9ab8d5a101edfa811a29', ref: el => (this.pnDatePicker = el), range: "false", "disable-weekends": this.disableWeekends, "min-date": this.firstValidDateString, "max-date": this.lastValidDateString, language: this.language, placeholder: this.datePlaceholder, "disabled-dates": this.disabledDates })), this.dateHelperText ? h("small", { class: "date-and-time-row helper-text" }, this.dateHelperText) : null), h("div", { key: 'bb00ae7e49da0175ea099d81c8755f35ec14ff77', class: "date-and-time-group" }, h("div", { key: '520fd0a41f9acb0e787632490390d6b611ef39be', class: "date-and-time-row" }, h("pn-select", { key: 'c220a53c6135045a4abdc1926873b5cbb6244884', ref: el => (this.pnTimeFromHourDropdown = el), name: "date-and-time-from-hour", class: "date-and-time-dropdown--time", invalid: this.invalidTimespan }, this.hourArr?.map((hour, index) => h("option", { label: hour, value: hour, selected: index === 0 }, hour))), h("pn-select", { key: 'a7b33b9a750700b9817128a9c1adfebab794a6a3', ref: el => (this.pnTimeFromMinuteDropdown = el), name: "date-and-time-from-minute", class: "date-and-time-dropdown--time", invalid: this.invalidTimespan }, this.minuteArr?.map((minute, index) => h("option", { label: minute, value: minute, selected: index === 0 }, minute))), h("div", { key: 'd029032c9a94be5cfb576e043ebda297839b3c96', class: "time-separator" }, h("span", { key: '8d53aee1b0e9f17708cba86ab0f2a557b81964ad' }, "-")), h("pn-select", { key: 'faedc85315a18f59f965377ff03eb5ba77416c7a', ref: el => (this.pnTimeToHourDropdown = el), name: "date-and-time-to-hour", class: "date-and-time-dropdown--time", invalid: this.invalidTimespan }, this.hourArr?.map((hour, index) => h("option", { label: hour, value: hour, selected: index === this.hourArr.length - 1 }, hour))), h("pn-select", { key: 'b747f94f3adf68590ec32c17afc8ac2dfd8a2266', ref: el => (this.pnTimeToMinuteDropdown = el), name: "date-and-time-to-minute", class: "date-and-time-dropdown--time", invalid: this.invalidTimespan }, this.minuteArr?.map((minute, index) => h("option", { label: minute, value: minute, selected: index === this.minuteArr.length - 1 }, minute)))), this.timeHelperText ? h("small", { class: "date-and-time-row helper-text" }, this.timeHelperText) : null, this.invalidTimespan && this.errorMessage ? (h("small", { class: "date-and-time-row error-message" }, h("pn-icon", { icon: alert_info_circle, small: "false", color: "warning" }), this.errorMessage)) : null)));
     }
     static get is() { return "pn-date-and-time"; }
     static get originalStyleUrls() {

package/collection/components/input/pn-dropdown-choice-adds-row/pn-dropdown-choice-adds-row.js

@@ -337,7 +337,7 @@ export class pnDropdownChoiceAddsRow {
         return true;
     }
     render() {
-        return (h(Host, { key: '3fd20ecf670fbb530781ee6bd208f87e0052f86c' }, h("div", { key: 'c2c58f0be32f0f6aa5fe40fe10af299bdedaa5a3', class: "dropdown-choice-form-row" }, h("pn-select", { key: '862607e111b1d96fa7f56d95eb74d0cda5705903', ref: el => (this.pnRowSelectDropdown = el), name: this.addRowDropdownName, label: this.addRowDropdownLabel, class: "pn-row-select-dropdown", language: this.languageCode }, h("option", { key: '29ac6dcfd181311f85940095a76f07a045c86451', value: "", selected: true, disabled: true }, this.addRowDropdownPlaceholder), this.rowSelectDropdownArr?.map((value) => h("option", { label: value, value: value }, value)))), h("div", { key: 'a26be8b9a3a494b5b0ce9a2f2be1a8547e2ecd34', class: "dropdown-choice-form-row" }, h("div", { key: '9711abd61165826d014a367237376e766c28d489', class: "pn-dropdown-choice-table" }, h("div", { key: 'e6f8535e285ca3339397a4f50a7bf4afb70c7b58', ref: el => (this.tableHead = el) }, this.nextRowIndex === 0 ? null : (h("div", { class: "table-header" }, h("div", { class: "table-header-name" }, h("label", null, this.rowNameLabel)), h("div", { class: "table-header-dropdown" }, h("label", null, this.rowDropdownLabel)), h("div", { class: "table-header-input" }, h("label", null, this.rowInputLabel)), h("div", { class: "table-header-delete" })))), h("div", { key: '74fb53a9fc9cccc1b0eb44cdc7c0f3ee00b65e8b', ref: el => (this.tableBody = el), class: "pn-dropdown-choice-table-slot" }, h("slot", { key: '6afd971f6fbf9a62a54680ddf4f3999e9e6daff5' }))))));
+        return (h(Host, { key: '5a70a7d4f1f6a105a287df79562de1e00b276b15' }, h("div", { key: '47d5b7bd549f8e472e131221c9d4fc9ca0308ddc', class: "dropdown-choice-form-row" }, h("pn-select", { key: '7216476d425fb3a07544d2ea95fd71e1452094e3', ref: el => (this.pnRowSelectDropdown = el), name: this.addRowDropdownName, label: this.addRowDropdownLabel, class: "pn-row-select-dropdown", language: this.languageCode }, h("option", { key: 'a974d00186fbf37995a8580abcf1f78052bf5ea0', value: "", selected: true, disabled: true }, this.addRowDropdownPlaceholder), this.rowSelectDropdownArr?.map((value) => h("option", { label: value, value: value }, value)))), h("div", { key: 'dd06952618e12452caf8ad397166b6e60e76666d', class: "dropdown-choice-form-row" }, h("div", { key: '1663d80435cd4fa841d695a13778a8c4ed234e66', class: "pn-dropdown-choice-table" }, h("div", { key: 'c7417986ac520adf4b4ffd9ef0e4961a1aa33bb2', ref: el => (this.tableHead = el) }, this.nextRowIndex === 0 ? null : (h("div", { class: "table-header" }, h("div", { class: "table-header-name" }, h("label", null, this.rowNameLabel)), h("div", { class: "table-header-dropdown" }, h("label", null, this.rowDropdownLabel)), h("div", { class: "table-header-input" }, h("label", null, this.rowInputLabel)), h("div", { class: "table-header-delete" })))), h("div", { key: 'db9da456d23c77da5b26adf12b738b673f80c65b', ref: el => (this.tableBody = el), class: "pn-dropdown-choice-table-slot" }, h("slot", { key: 'd98c88973072f92b95f28a89b24b87ea2028fc69' }))))));
     }
     static get is() { return "pn-dropdown-choice-adds-row"; }
     static get originalStyleUrls() {

package/collection/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows-row.js

@@ -163,7 +163,7 @@ export class PnDropdownWithMultiInputRowsRow {
         this.deleteRowEvent.emit(this._predefinedValue.id);
     }
     render() {
-        return (h(Host, { key: '4925aca4d5b55256deda95cdeef466ecad054a51' }, h("div", { key: '6162a985244fd8fd93fd5cd268c8b21e9d133942', class: "input-element-row" }, h("div", { key: 'aaad2fac34e4151a8c9b30080105d14a44941357', class: "input-container" }, h("pn-input", { key: 'b504279f4ba8a730021ed4debd0be6b42afbb8d7', ref: el => (this.pnFirstInputField = el), type: "number", placeholder: this.firstInputPlaceholder, value: this.firstInputValue, min: "1" }), this.showFirstInputLowError || this.showFirstInputHighError || this.showFirstInputWarning ? (h("div", { class: "input-element-message-container" }, this.showFirstInputLowError ? (h("div", { class: "input-element-message-container__error" }, h("small", null, this.firstInputLowErrorText))) : null, this.showFirstInputHighError ? (h("div", { class: "input-element-message-container__error" }, h("small", null, this.firstInputHighErrorText))) : null, this.showFirstInputWarning ? (h("div", { class: "input-element-message-container__warning" }, h("small", null, this.firstInputWarningText))) : null)) : null), h("div", { key: 'b3d182742c6c5344d7d57a507026bf918a6d2e05', class: "input-container" }, h("pn-input", { key: 'e8fd472708d96bedd538c09e9b6ed7ccd7ae098e', ref: el => (this.pnSecondInputField = el), type: "number", placeholder: this.secondInputPlaceholder, value: this.secondInputValue, min: "1" }), this.showSecondInputLowError || this.showSecondInputHighError || this.showSecondInputWarning ? (h("div", { class: "input-element-message-container" }, this.showSecondInputLowError ? (h("div", { class: "input-element-message-container__error" }, h("small", null, this.secondInputLowErrorText))) : null, this.showSecondInputHighError ? (h("div", { class: "input-element-message-container__error" }, h("small", null, this.secondInputHighErrorText))) : null, this.showSecondInputWarning ? (h("div", { class: "input-element-message-container__warning" }, h("small", null, this.secondInputWarningText))) : null)) : null), h("div", { key: '8da4638217aee0b48cfe8bc9371bc588dfc3ac0d', class: "input-container" }, h("pn-date-picker", { key: '0d9c861a7a122c767c991a8400fb044ad134a2bc', ref: el => (this.pnDatePicker = el), range: "false", "disable-weekends": true, "disabled-dates": this.disabledDates, "min-date": this.firstValidDate, "max-date": this.lastValidDate, language: this.languageCode, placeholder: this.datePlaceholder, start: this.dateValue?.length ? this.dateValue : null })), this.rowIndex >= this.minRowCount ? (h("div", { class: "delete-button-container" }, h("pn-button", { ref: el => (this.pnDeleteRowButton = el), small: "true", icon: minus, appearance: "warning", index: this.rowIndex, onClick: () => {
+        return (h(Host, { key: '6807110e253e2435958c132d668a249af140c6e7' }, h("div", { key: 'bb307f8b275ac03cfbe785cde15a61d29e1a193c', class: "input-element-row" }, h("div", { key: 'cdc4e84746ff36b099bb1ef0d3989322de3bc8e4', class: "input-container" }, h("pn-input", { key: '296be69efd2fc3ca0797913249f68e67e24d86c2', ref: el => (this.pnFirstInputField = el), type: "number", placeholder: this.firstInputPlaceholder, value: this.firstInputValue, min: "1" }), this.showFirstInputLowError || this.showFirstInputHighError || this.showFirstInputWarning ? (h("div", { class: "input-element-message-container" }, this.showFirstInputLowError ? (h("div", { class: "input-element-message-container__error" }, h("small", null, this.firstInputLowErrorText))) : null, this.showFirstInputHighError ? (h("div", { class: "input-element-message-container__error" }, h("small", null, this.firstInputHighErrorText))) : null, this.showFirstInputWarning ? (h("div", { class: "input-element-message-container__warning" }, h("small", null, this.firstInputWarningText))) : null)) : null), h("div", { key: '2834f8fb76abb28e7a560276334bd9c20fb59a1f', class: "input-container" }, h("pn-input", { key: 'cc5f59a061a001c1659d8a3734452ba20bf6213a', ref: el => (this.pnSecondInputField = el), type: "number", placeholder: this.secondInputPlaceholder, value: this.secondInputValue, min: "1" }), this.showSecondInputLowError || this.showSecondInputHighError || this.showSecondInputWarning ? (h("div", { class: "input-element-message-container" }, this.showSecondInputLowError ? (h("div", { class: "input-element-message-container__error" }, h("small", null, this.secondInputLowErrorText))) : null, this.showSecondInputHighError ? (h("div", { class: "input-element-message-container__error" }, h("small", null, this.secondInputHighErrorText))) : null, this.showSecondInputWarning ? (h("div", { class: "input-element-message-container__warning" }, h("small", null, this.secondInputWarningText))) : null)) : null), h("div", { key: '96888441a54b2e46d8f94d4db50f892d0bd88d8e', class: "input-container" }, h("pn-date-picker", { key: 'e18063b05aa1e6029f6ff8976394fc49afb361ab', ref: el => (this.pnDatePicker = el), range: "false", "disable-weekends": true, "disabled-dates": this.disabledDates, "min-date": this.firstValidDate, "max-date": this.lastValidDate, language: this.languageCode, placeholder: this.datePlaceholder, start: this.dateValue?.length ? this.dateValue : null })), this.rowIndex >= this.minRowCount ? (h("div", { class: "delete-button-container" }, h("pn-button", { ref: el => (this.pnDeleteRowButton = el), small: "true", icon: minus, appearance: "warning", index: this.rowIndex, onClick: () => {
                 this.deleteRow();
             } }, "Delete"))) : null)));
     }

package/collection/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows.js

@@ -295,9 +295,9 @@ export class PnDropdownWithMultiInputRows {
         }
     }
     render() {
-        return (h(Host, { key: 'd9992e503344eb152be393b957716e25bd89171a', class: "dropdown-with-multi-input-element" }, h("div", { key: '1fcee1e584d6f0687ad54f968750129e2ee87855', class: "dropdown-with-multi-input-element__row" }, h("div", { key: 'de06f80ae79b4a3f7dbd90a7c8fc984e431ad5e3', class: "dropdown-with-multi-input-element__dropdown" }, h("pn-select", { key: 'ff1d4ae35266f01206f9100d3eb48193f75c5f3a', ref: el => (this.pnFirstDropdown = el), onChange: debounce(this.handleFirstDropdown.bind(this), 500), class: "pn-row-select-dropdown dropDown1-dropdown", label: this.firstDropdownLabel, language: this.languageCode }, h("option", { key: '515bb0593a47aec2763f73798725bbf20db64b8c', value: "", disabled: true, selected: true }, this.i18n.dropdownPlaceholder), this.dropdownDataRoot?.map((item) => (h("option", { value: item.value }, item.label)))), this.firstDropdownHelperText?.length ? h("small", null, this.firstDropdownHelperText) : null)), h("div", { key: 'ddc383429253a9338d95542a73caf42d5d67ccd0', class: "dropdown-with-multi-input-element__row" }, h("div", { key: 'ae2087bfa6efb48882fbfcfd7fabfaa2e4aa195d', class: "dropdown-with-multi-input-element__dropdown" }, h("pn-select", { key: 'e4c79dde30b1c21ccd6265b72bdc8769b6f167de', ref: el => (this.pnSecondDropdown = el), onChange: debounce(this.handleSecondDropdown.bind(this), 500), class: "pn-row-select-dropdown dropDown2-dropdown", label: this.secondDropdownLabel, language: this.languageCode }, h("option", { key: '9384dc96252920c25606ab2db38c25c65340cd23', value: "", disabled: true, selected: true }, this.i18n.dropdownPlaceholder), this.secondDropdownArr?.map((item) => (h("option", { value: item }, item)))), this.secondDropdownHelperText?.length ? h("small", null, this.secondDropdownHelperText) : null)), this.showDeleteConfirm ? (h("div", { class: "dropdown-with-multi-input-element__delete" }, h("p", null, this.deleteMultipleRowsWarningText), h("pn-button", { ref: el => (this.pnConfirmDeleteButton = el), small: "true", appearance: "warning", onClick: this.deleteExcessRows.bind(this) }, this.confirmDeleteButtonText), h("pn-button", { ref: el => (this.pnAbortDeleteButton = el), small: "true", appearance: "light", onClick: this.abortDeleteRows.bind(this) }, this.abortDeleteButtonText))) : null, h("div", { key: 'e2a18a378964fc9e31f534a2d9432e002c674a48', class: "dropdown-with-multi-input-element__label-row" }, h("div", { key: '9fce1185add5a750898aa75057263ea93ee050a7', class: "dropdown-with-multi-input-element__label" }, h("label", { key: '4b33a863f16cf020282da9d7bad7dcd81a941e74' }, this.firstInputLabel)), h("div", { key: 'a28e0b57e3cc5c7cd3b5693b432665d684df1c7b', class: "dropdown-with-multi-input-element__label" }, h("label", { key: 'ed4580f6a1d0eb793c00e03078a0f9acc80ce3c8' }, this.secondInputLabel)), h("div", { key: 'a20a403e978d9ef0c8e63e6df3048f8d16c9a917', class: "dropdown-with-multi-input-element__label" }, h("label", { key: '2be0daa6b5ef9cbef7af2ee2b2c23f537de8ec8d' }, this.dateLabel))), this.rowData?.map((data, i) => {
+        return (h(Host, { key: 'a36c4aaa149ea44a8fe2a5ba317da7ac573d74a9', class: "dropdown-with-multi-input-element" }, h("div", { key: 'f0db29797e6cae79982185f5739bb94a14edf08e', class: "dropdown-with-multi-input-element__row" }, h("div", { key: 'a4378d62e4066b8eca52641dfdb946b6a8836a69', class: "dropdown-with-multi-input-element__dropdown" }, h("pn-select", { key: 'f030749e5dd3d867061d484e92387bb2088fadbb', ref: el => (this.pnFirstDropdown = el), onChange: debounce(this.handleFirstDropdown.bind(this), 500), class: "pn-row-select-dropdown dropDown1-dropdown", label: this.firstDropdownLabel, language: this.languageCode }, h("option", { key: 'c96e514377fe340c9ce40006af64c2e6f9c09734', value: "", disabled: true, selected: true }, this.i18n.dropdownPlaceholder), this.dropdownDataRoot?.map((item) => (h("option", { value: item.value }, item.label)))), this.firstDropdownHelperText?.length ? h("small", null, this.firstDropdownHelperText) : null)), h("div", { key: 'bd14511d43ac708adf22bcc525ae4d001568a529', class: "dropdown-with-multi-input-element__row" }, h("div", { key: '25a682c29e11d27a10b8e5072f252e740c9c0859', class: "dropdown-with-multi-input-element__dropdown" }, h("pn-select", { key: 'ae6b8bfea4668fd3c4873c4c627afee05ac647c6', ref: el => (this.pnSecondDropdown = el), onChange: debounce(this.handleSecondDropdown.bind(this), 500), class: "pn-row-select-dropdown dropDown2-dropdown", label: this.secondDropdownLabel, language: this.languageCode }, h("option", { key: '198778933f0ed26709a99dbe409d3a2a49884ab9', value: "", disabled: true, selected: true }, this.i18n.dropdownPlaceholder), this.secondDropdownArr?.map((item) => (h("option", { value: item }, item)))), this.secondDropdownHelperText?.length ? h("small", null, this.secondDropdownHelperText) : null)), this.showDeleteConfirm ? (h("div", { class: "dropdown-with-multi-input-element__delete" }, h("p", null, this.deleteMultipleRowsWarningText), h("pn-button", { ref: el => (this.pnConfirmDeleteButton = el), small: "true", appearance: "warning", onClick: this.deleteExcessRows.bind(this) }, this.confirmDeleteButtonText), h("pn-button", { ref: el => (this.pnAbortDeleteButton = el), small: "true", appearance: "light", onClick: this.abortDeleteRows.bind(this) }, this.abortDeleteButtonText))) : null, h("div", { key: '408ce54d7f35a8c32f681bfccd999223c1319048', class: "dropdown-with-multi-input-element__label-row" }, h("div", { key: '77e0d10422301c5d392c462c327a84402f1c301d', class: "dropdown-with-multi-input-element__label" }, h("label", { key: '1136e30608e99d5bfdf0c661da2055df7d5d0f49' }, this.firstInputLabel)), h("div", { key: 'f2c97b957c1e158521aacd2abb1f9218a91733a0', class: "dropdown-with-multi-input-element__label" }, h("label", { key: 'e9a3c4822837ceca87093989a5d9888ac3c5f1c8' }, this.secondInputLabel)), h("div", { key: 'df04f7c65236f0a08e1119d3ab7b5283ff792799', class: "dropdown-with-multi-input-element__label" }, h("label", { key: 'a59ae55157f5ae993abe02e1d70580c81c8b7e15' }, this.dateLabel))), this.rowData?.map((data, i) => {
             return (h("div", { class: 'dropdown-with-multi-input-element__row generated-row-' + i, id: 'generated-row-' + i }, h("pn-dropdown-with-multi-input-rows-row", { "language-code": this.languageCode, "first-input-placeholder": this.firstInputPlaceholder, "first-input-min": this.firstInputMin, "first-input-max": this.firstInputMax, "first-input-warning": this.firstInputWarning, "first-input-warning-text": this.firstInputWarningText, "first-input-low-error-text": this.firstInputLowErrorText, "first-input-high-error-text": this.firstInputHighErrorText, "second-input-placeholder": this.secondInputPlaceholder, "second-input-min": this.secondInputMin, "second-input-max": this.secondInputMax, "second-input-warning": this.secondInputWarning, "second-input-warning-text": this.secondInputWarningText, "second-input-low-error-text": this.secondInputLowErrorText, "second-input-high-error-text": this.secondInputHighErrorText, datePlaceholder: this.datePlaceholder, firstValidDate: this.firstValidDateString, lastValidDate: this.lastValidDateString, "predefined-value": JSON.stringify(data), "min-row-count": this.minRowCount, "row-index": i, "disabled-dates": this.disabledDates })));
-        }), h("div", { key: 'ac42ac72b4f63b207fd099406c4af82b7659f1e2', class: "dropdown-with-multi-input-element__row sum-row" }, h("pn-input", { key: '966ce0ab3d9a40607898ea1121e17c9ab0a9f569', disabled: true, ref: el => (this.pnSumField = el), type: "number", value: this.rowSum, label: this.sumFieldLabel }), h("pn-button", { key: 'b526f744b87020adfe852bbc68dd4ccc80cb17b8', tooltip: this.addRowText ? this.addRowText : null, "left-icon": "true", arialabel: "Add", icon: plus, appearance: "light", variant: "borderless", class: "connected-dropdown__button-right", onClick: () => {
+        }), h("div", { key: 'dbf0c28a2893081884009177ce4c4d382e598906', class: "dropdown-with-multi-input-element__row sum-row" }, h("pn-input", { key: '7518ff5a32236320c710618db2a2f32c5c74c5f7', disabled: true, ref: el => (this.pnSumField = el), type: "number", value: this.rowSum, label: this.sumFieldLabel }), h("pn-button", { key: '00b8be5ea7f5753676db44b9f1eb0bb06769b6a2', tooltip: this.addRowText ? this.addRowText : null, "left-icon": "true", arialabel: "Add", icon: plus, appearance: "light", variant: "borderless", class: "connected-dropdown__button-right", onClick: () => {
                 this.addRow(this.generateUniqueId());
             } }, this.addRowText)), this.elementHelperText?.length ? h("div", { class: "dropdown-with-multi-input-element__row" }, this.elementHelperText) : null));
     }

package/collection/components/input/pn-filter-checkbox/pn-filter-checkbox.js

@@ -54,7 +54,7 @@ export class PnFilterCheckbox {
     }
     render() {
         this.renderInputOutsideShadowRoot();
-        return (h(Host, { key: '1a101cf9d9e27cdefb8221945f24b83ba50d626b', checked: this.checked, id: this.checkboxid }, h("input", { key: 'cc4cf39da22f13e9069639aec4e21d457a4ccf99', type: "checkbox", id: this.checkboxid, value: this.value, name: this.name || this.checkboxid, disabled: this.disabled, checked: this.checked }), h("label", { key: '50a5122f4979a1c5eae5402df7da7139543847e4', htmlFor: this.checkboxid, class: "pn-checkbox" }, h("svg", { key: '1e4708a6c2d4b58da98c15f80eef72127cb8d08b', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none" }, h("polyline", { key: '69894e88ad14a79b1ada504b15a96643b9c4a310', class: "checkmark-path", points: "4,12 9,17 20,6", "stroke-width": "3" }), h("polyline", { key: '1ff0d988a320a19fdecdeadaed68f69cd58f4334', class: "indeterminate-path", points: "4,12 20,12", "stroke-width": "3" })))));
+        return (h(Host, { key: '6afb96d0039c6b469a1e0fcb1984130e5d07f6b2', checked: this.checked, id: this.checkboxid }, h("input", { key: '13cb1d151426ba8798e8dbc1ab3ba070df9f5f9c', type: "checkbox", id: this.checkboxid, value: this.value, name: this.name || this.checkboxid, disabled: this.disabled, checked: this.checked }), h("label", { key: '704d25d4ef31eceb09ec5961a4da7118b431587b', htmlFor: this.checkboxid, class: "pn-checkbox" }, h("svg", { key: '730506f1a3b0f2220017eb51093fba5b352e5809', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none" }, h("polyline", { key: '138a8f0bcfc1f4b6ddb938a653ca4821e125a296', class: "checkmark-path", points: "4,12 9,17 20,6", "stroke-width": "3" }), h("polyline", { key: '08f0433c4f7a21040d4905b81c05f27e0ebd0542', class: "indeterminate-path", points: "4,12 20,12", "stroke-width": "3" })))));
     }
     static get is() { return "pn-filter-checkbox"; }
     static get encapsulation() { return "shadow"; }

package/collection/components/input/pn-marketweb-input/pn-marketweb-input.js

@@ -53,7 +53,7 @@ export class PnMarketwebInput {
         return classNames;
     }
     render() {
-        return (h(Host, { key: '4f7f8f34c1ee53c4afb001753391d4c157e1478b', class: this.getClassNames() }, (this.label || this.maxlength) && (h("div", { key: '47d1c694771fc809834c83b1862479fd8a9e9d8d', class: "label-container" }, this.label && h("label", { key: '0fc212d7f191e9a14fbfc125c5f6f8170f89fa9a', htmlFor: this.inputid }, this.label), parseInt(this.maxlength) > 0 && (h("label", { key: 'b80c0e7c3a0303ab9f86c0a29869d65e0db2bc60', class: "char-count", htmlFor: this.inputid }, `${this.value.length}/${this.maxlength}`)))), h("div", { key: 'ff9cc8c88c7bd113bae6e70973705fd3e79720e1', class: "input-container" }, h("input", { key: '9d7032bf457b824ab3e8e9e4a26f5676f10fd75f', type: this.getInputType(), value: this.value, id: this.inputid, name: this.name, placeholder: this.placeholder, disabled: this.disabled, required: this.required, autocomplete: this.autocomplete, onInput: e => this.setVal(e), maxlength: this.maxlength ? this.maxlength : null, min: this.min ? this.min : null, max: this.max ? this.max : null, step: this.step ? this.step : null, pattern: this.pattern ? this.pattern : null }), h("svg", { key: '32edd92bb708da7494c80e21163321c976753506', class: "pn-input-checkmark", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none" }, h("polyline", { key: 'c7a4e9e801dd98d2f392954ce1f4cf38f4be59d0', class: "checkmark-path", points: "4,12 9,17 20,6", "stroke-width": "3" })), this.type === 'password' && !this.disabled && h("button", { key: '1afd953b2b8f429ef82978649382c969b47b3c52', onClick: () => this.toggleTextVisibility() }, "Show")), this.getTextMessage() && (h("small", { key: '8e10536b12bf476a98e54202c5302c8816d28f74' }, this.error && h("pn-icon", { key: 'a86e347e28f92a4b8437e964fbf9d3784dcdf158', icon: alert_exclamation_circle, small: true, color: "warning" }), this.getTextMessage()))));
+        return (h(Host, { key: 'd53d34768ce8cac2294dde02d5bd9fdf60548508', class: this.getClassNames() }, (this.label || this.maxlength) && (h("div", { key: '000eb02be394dd255a428ddaeca5cda08fec17d2', class: "label-container" }, this.label && h("label", { key: '4754455bb69d68064707c1223f41e47f3e3860bd', htmlFor: this.inputid }, this.label), parseInt(this.maxlength) > 0 && (h("label", { key: '49121d10d9d303fe632b3a8e837b988d16c4a6c4', class: "char-count", htmlFor: this.inputid }, `${this.value.length}/${this.maxlength}`)))), h("div", { key: '0132c366e62de325ee8d624e1732d5338a80099d', class: "input-container" }, h("input", { key: '4b55002c92fd8f1e28286a6a63b8fba5e2c8e97c', type: this.getInputType(), value: this.value, id: this.inputid, name: this.name, placeholder: this.placeholder, disabled: this.disabled, required: this.required, autocomplete: this.autocomplete, onInput: e => this.setVal(e), maxlength: this.maxlength ? this.maxlength : null, min: this.min ? this.min : null, max: this.max ? this.max : null, step: this.step ? this.step : null, pattern: this.pattern ? this.pattern : null }), h("svg", { key: '9b232b0b110584f2d45858a09101a852387cb1ab', class: "pn-input-checkmark", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none" }, h("polyline", { key: 'bdba76200d58e859fa22613f88bff66934f69290', class: "checkmark-path", points: "4,12 9,17 20,6", "stroke-width": "3" })), this.type === 'password' && !this.disabled && h("button", { key: '75d4504bb40c624abe4fbc40c1e1bda486caa425', onClick: () => this.toggleTextVisibility() }, "Show")), this.getTextMessage() && (h("small", { key: '554324fcf8463e75e525ed8c48e1b6a434e69214' }, this.error && h("pn-icon", { key: 'c06d11b0517d69c763d58a2bf074e73aafb63d47', icon: alert_exclamation_circle, small: true, color: "warning" }), this.getTextMessage()))));
     }
     static get is() { return "pn-marketweb-input"; }
     static get originalStyleUrls() {

package/collection/components/input/pn-marketweb-search/pn-marketweb-search.js

@@ -80,7 +80,7 @@ export class PnMarketwebSearch {
         });
     }
     render() {
-        return (h(Host, { key: 'bd91a32439d948f4362fd667a2a897e00b480a5b' }, h("div", { key: 'dd45a9899d15079c13c060e4cfd75c60730ac922', class: `input-container ${this.getClassNames()}`, "data-haslist": (this.list !== null) + '' }, h("input", { key: '0e283a03de256f134b2d8936fdf2a4d2dd206f2c', type: "search", value: this.value, id: this.inputid, name: this.name, placeholder: this.placeholder, disabled: this.disabled, autocomplete: this.autocomplete, list: this.list, onKeyDown: e => this.emitSearch(e), onInput: e => this.setVal(e) }), h("div", { key: '1eff04ef905ee36aa2e7d7976e522a8bc114681b', class: "button-container" }, (this.button === 'none' || this.button === 'icon-inline') && (h("button", { key: '46f1d1b36518d0b7cc5430efa9167b626d7c80eb', class: "search", tabindex: this.button === 'icon-inline' ? '0' : '-1', onClick: e => this.emitSearch(e), "aria-label": "search", title: "search" }, h("pn-icon", { key: 'ba9cb2a21f9561d79ab779058acaf83f0be7da7a', icon: search, color: "blue700" }))), this.button !== 'icon-inline' && (h("button", { key: '5b537c0cb6227ad2f3fb1d7227c698436510a5b9', class: "clear", "aria-label": "clear", title: "clear search field", tabindex: this.value && (!this.loading || this.button !== 'none') ? '0' : '-1', onClick: (e) => this.clearInput(e) }, h("pn-icon", { key: '70873e93689282f189e65b68a9fa980ad6f9158b', icon: close_small, color: "blue700" }))), this.button === 'none' || (this.button === 'icon-inline' && h("pn-spinner", { key: '6fe9c471b0b67f785e3e5a98ab79c93dacd32d80' })))), this.button !== 'none' && this.button !== 'icon-inline' && (h("pn-button", { key: 'a3671a3fbca963021a75540284144d1cea41c8ab', onClick: e => this.emitSearch(e), loading: this.loading, icon: search, appearance: this.light ? 'light' : 'dark', tooltip: this.button === 'icon' ? this.label : null }, this.label)), this.list && (h("datalist", { key: '7e0bfeda8401c388ebeb3e0e185b52e09636ac8d', id: this.list }, this.listSuggestion.map(item => {
+        return (h(Host, { key: 'cc98c9ba68e33ec9829c96b8d7e3f41e4f12a75e' }, h("div", { key: 'b8eabcb55c9b333f5e31d916cbb8c88c143677c7', class: `input-container ${this.getClassNames()}`, "data-haslist": (this.list !== null) + '' }, h("input", { key: 'dc0e2947af117a1eb630a471efdbf1d71410a942', type: "search", value: this.value, id: this.inputid, name: this.name, placeholder: this.placeholder, disabled: this.disabled, autocomplete: this.autocomplete, list: this.list, onKeyDown: e => this.emitSearch(e), onInput: e => this.setVal(e) }), h("div", { key: 'f9c68a3ec4645e23829abe057ff5a4f1966b317e', class: "button-container" }, (this.button === 'none' || this.button === 'icon-inline') && (h("button", { key: '2ac302a7c2715a653125b4d59fe7ebaa8990afa6', class: "search", tabindex: this.button === 'icon-inline' ? '0' : '-1', onClick: e => this.emitSearch(e), "aria-label": "search", title: "search" }, h("pn-icon", { key: 'd7ff3ffc58c66f914bae81c6b1585602308bdf43', icon: search, color: "blue700" }))), this.button !== 'icon-inline' && (h("button", { key: '10f3f63221a43eb978a3ce50399f063497aea459', class: "clear", "aria-label": "clear", title: "clear search field", tabindex: this.value && (!this.loading || this.button !== 'none') ? '0' : '-1', onClick: (e) => this.clearInput(e) }, h("pn-icon", { key: '2479c191019b8ce64032085db4ae0b1d2f86120d', icon: close_small, color: "blue700" }))), this.button === 'none' || (this.button === 'icon-inline' && h("pn-spinner", { key: '6618a5eb4aee10b29a5cef7b03bf49a282e2a7d4' })))), this.button !== 'none' && this.button !== 'icon-inline' && (h("pn-button", { key: '9ac13f86ecc3819f98f115bc19250a3a951b3bd2', onClick: e => this.emitSearch(e), loading: this.loading, icon: search, appearance: this.light ? 'light' : 'dark', tooltip: this.button === 'icon' ? this.label : null }, this.label)), this.list && (h("datalist", { key: '6bdf261a540f9502679549d38ebd38a601290583', id: this.list }, this.listSuggestion.map(item => {
             return h("option", null, item);
         })))));
     }

package/collection/components/input/pn-multi-row-connected-dropdown/pn-multi-row-connected-dropdown-row.js

@@ -384,7 +384,7 @@ export class PnMultiRowConnectedDropdownRow {
         return active ? 'connected-dropdown__button active' : 'connected-dropdown__button';
     }
     render() {
-        return (h(Host, { key: '3be033df5e2edc072e18e40c6a6d37f3819b24a7' }, h("div", { key: '6602ef69148d4ef7039535da7dd53577eb719b25', ref: el => (this.pnConnectedDropdownSlotElement = el), class: "connected-dropdown-slot-element" }, h("div", { key: 'ed1e95a309aec8aaf19436f6a49f42a82c023bc4', class: "connected-dropdown-parent-element connected-dropdown" }, h("div", { key: 'a89291b971da7187d42b460daea34df929711db1', class: "connected-dropdown__row__no-margin" }, h("label", { key: '856d9c8b242b8c370a9cbd34d3d0990c8d8db421' }, this.label)), h("div", { key: '5f53d80b080791a863597025e7188519673a53c3', class: "connected-dropdown__row button-row" }, h("div", { key: 'a598274d0e043aca1c89be26a230db668c20546b', class: "connected-dropdown__button-container option-buttons" }, this.buttonsArray?.map(item => (h("button", { class: `${this.setActive(item.selected)}`, id: this.generateUniqueId(), onClick: this.handleOptionButtonClick.bind(this) }, item.value)))), h("div", { key: '8ae7a14c1769d89506fa62e51b86b59b10189a5e', class: "connected-dropdown__button-container delete-button" }, this.index > 0 ? (h("pn-button", { ref: el => (this.pnDeleteRowButton = el), small: "true", icon: minus, appearance: "warning", index: this.index }, "Delete")) : null)), h("div", { key: '72c10a8a182e840a8032385ce27aae68ac84833d', class: "connected-dropdown__row input-row" }, h("pn-select", { key: '3e29caeb46483b04ddf3ac5fb28949bb770a3e04', ref: el => (this.pnFirstDropdown = el), class: "pn-row-select-dropdown dropDown1-dropdown", label: this.firstDropdownLabel, language: this.languageCode }, h("option", { key: 'eb528f92d2117c7ef3e2f8ee7e4efd397da58259', value: "", selected: true, disabled: true }, this.firstDropdownPlaceholder), this.firstDropdownArr?.map((item) => (h("option", { value: item.value, selected: item.selected }, item.label)))), h("pn-select", { key: 'e37abf8454e0908717b123d542cc7f5066f9a73e', ref: el => (this.pnSecondDropdown = el), class: "pn-row-select-dropdown dropDown2-dropdown", label: this.secondDropdownLabel, language: this.languageCode }, h("option", { key: '7d0d552bc1383afbf577d39e929e8422ac03c085', value: "", selected: true, disabled: true }, this.secondDropdownPlaceholder), this.secondDropdownArr?.map((item) => (h("option", { value: item.value, selected: item.selected }, item.label)))), h("pn-input", { key: 'afd24254729348dcbb75ae98259f973319196da5', ref: el => (this.pnInputField = el), class: "input-amount", type: "number", placeholder: "0", label: this.inputFieldLabel, value: this.inputFieldValue, min: this.minAmount }), this.allowMultipleDates ? (h("pn-button", { ref: el => (this.pnShowDateRangeFiledButton = el), class: "connected-dropdown__toggle-date-button", small: "true", appearance: "light" }, this.dateButtonText)) : (h("div", { class: "connected-dropdown__date-container" }, h("pn-date-picker", { ref: el => (this.pnSingleDatePicker = el), range: "false", "label-from": this.dateButtonText, "disable-weekends": true, "disabled-dates": this.disabledDates, "min-date": this.firstValidDateString, language: this.languageCode, placeholder: this.datePlaceholder, class: "connected-dropdown__date-picker", start: this.dateValue?.length ? this.dateValue : null })))), this.allowMultipleDates ? (h("div", { ref: el => (this.pnDateRangeContainer = el), class: "connected-dropdown__date-container", style: { display: 'none' } }, this.multiDateHelperText ? (h("div", { class: "connected-dropdown__row" }, h("p", null, this.multiDateHelperText))) : null, h("div", { class: "connected-dropdown__multi-date-row" }, h("div", { class: "connected-dropdown__date-container" }, h("pn-date-picker", { ref: el => (this.pnStartDate = el), "label-from": this.startDateLabel, range: "false", "disable-weekends": true, "disabled-dates": this.disabledDates, class: "connected-dropdown__date-picker", "min-date": this.firstValidDateString, "max-date": this.lastValidDateString, language: this.languageCode, placeholder: this.datePlaceholder })), h("div", { class: "connected-dropdown__date-container" }, h("pn-date-picker", { ref: el => (this.pnEndDate = el), "label-from": this.endDateLabel, range: "false", "disable-weekends": true, "disabled-dates": this.disabledDates, class: "connected-dropdown__date-picker", "min-date": this.firstValidDateString, "max-date": this.lastValidDateString, language: this.languageCode, placeholder: this.datePlaceholder }))), h("div", { ref: el => (this.pnDaysRow = el), class: "connected-dropdown__multi-date-row" }, this.daysArr?.map((day) => (h("div", { class: "connected-dropdown__checkbox" }, h("pn-filter-checkbox", { checkboxid: 'day-' + day.value, name: '__' + day.label, value: day.value, checked: day.selected }), h("label", { htmlFor: 'day-' + day.value }, day.label))))), h("div", { class: "connected-dropdown__row" }, h("pn-button", { ref: el => (this.pnGenerateDatesButton = el), small: "true" }, this.generateDatesButtonText)), h("div", { ref: el => (this.pnGeneratedDatesSlot = el), class: "connected-dropdown__date-slot" }, this.generatedDatesArr?.map((date, i) => (h("div", { class: "connected-dropdown__row generated-date-row" }, h("p", null, date), h("pn-button", { index: i, small: "true", icon: minus, appearance: "warning", id: 'delete-date-' + i, onClick: this.deleteGeneratedDateRow.bind(this, i) }, date)))), !this.generatedDatesArr?.length ? h("p", null, this.noDatesText) : null), h("div", { class: "connected-dropdown__row" }, h("pn-button", { ref: el => (this.pnSaveGeneratedDatesButton = el), class: "connected-dropdown__button-right", small: "true" }, this.saveDateButtonText)))) : null))));
+        return (h(Host, { key: '0b153d46f1b7a22b5c57b6f7052f4dfd8bd007f9' }, h("div", { key: '34acbc01a25bc614a1b3b6afcda9cee5a3b8db45', ref: el => (this.pnConnectedDropdownSlotElement = el), class: "connected-dropdown-slot-element" }, h("div", { key: 'f6400bf9276c6cb954140e21f8fd860ffdc56d61', class: "connected-dropdown-parent-element connected-dropdown" }, h("div", { key: '81c12c13d5990e53b6508477475692ada070af8e', class: "connected-dropdown__row__no-margin" }, h("label", { key: '8f9f11bca997d1cec353d608f1636fcb908a5307' }, this.label)), h("div", { key: '6f5659889a7e0ded8f8666094ce1f9af62f414a8', class: "connected-dropdown__row button-row" }, h("div", { key: '8adb6c2363477e36fa818481869142547818999c', class: "connected-dropdown__button-container option-buttons" }, this.buttonsArray?.map(item => (h("button", { class: `${this.setActive(item.selected)}`, id: this.generateUniqueId(), onClick: this.handleOptionButtonClick.bind(this) }, item.value)))), h("div", { key: '1802e68e75ab0bbe59324e758a22e15470634023', class: "connected-dropdown__button-container delete-button" }, this.index > 0 ? (h("pn-button", { ref: el => (this.pnDeleteRowButton = el), small: "true", icon: minus, appearance: "warning", index: this.index }, "Delete")) : null)), h("div", { key: 'dd35b8e6d657e4a7a2d8156a01c53cfb7bce053f', class: "connected-dropdown__row input-row" }, h("pn-select", { key: 'a4086f4b9fcff516692c98c96fea963bce517b5b', ref: el => (this.pnFirstDropdown = el), class: "pn-row-select-dropdown dropDown1-dropdown", label: this.firstDropdownLabel, language: this.languageCode }, h("option", { key: '3a063ba06c90ac19809358c0dde6216b8bc11d25', value: "", selected: true, disabled: true }, this.firstDropdownPlaceholder), this.firstDropdownArr?.map((item) => (h("option", { value: item.value, selected: item.selected }, item.label)))), h("pn-select", { key: 'a2d3408fee103aadf6bbfdd8f24ace9dbb05af82', ref: el => (this.pnSecondDropdown = el), class: "pn-row-select-dropdown dropDown2-dropdown", label: this.secondDropdownLabel, language: this.languageCode }, h("option", { key: '90fd6aced7ee6a573cd32ebc8443c7e6b1f0e1a8', value: "", selected: true, disabled: true }, this.secondDropdownPlaceholder), this.secondDropdownArr?.map((item) => (h("option", { value: item.value, selected: item.selected }, item.label)))), h("pn-input", { key: 'c4553fcd91aa1a587d66ed64ef9a2c5a3ec3d130', ref: el => (this.pnInputField = el), class: "input-amount", type: "number", placeholder: "0", label: this.inputFieldLabel, value: this.inputFieldValue, min: this.minAmount }), this.allowMultipleDates ? (h("pn-button", { ref: el => (this.pnShowDateRangeFiledButton = el), class: "connected-dropdown__toggle-date-button", small: "true", appearance: "light" }, this.dateButtonText)) : (h("div", { class: "connected-dropdown__date-container" }, h("pn-date-picker", { ref: el => (this.pnSingleDatePicker = el), range: "false", "label-from": this.dateButtonText, "disable-weekends": true, "disabled-dates": this.disabledDates, "min-date": this.firstValidDateString, language: this.languageCode, placeholder: this.datePlaceholder, class: "connected-dropdown__date-picker", start: this.dateValue?.length ? this.dateValue : null })))), this.allowMultipleDates ? (h("div", { ref: el => (this.pnDateRangeContainer = el), class: "connected-dropdown__date-container", style: { display: 'none' } }, this.multiDateHelperText ? (h("div", { class: "connected-dropdown__row" }, h("p", null, this.multiDateHelperText))) : null, h("div", { class: "connected-dropdown__multi-date-row" }, h("div", { class: "connected-dropdown__date-container" }, h("pn-date-picker", { ref: el => (this.pnStartDate = el), "label-from": this.startDateLabel, range: "false", "disable-weekends": true, "disabled-dates": this.disabledDates, class: "connected-dropdown__date-picker", "min-date": this.firstValidDateString, "max-date": this.lastValidDateString, language: this.languageCode, placeholder: this.datePlaceholder })), h("div", { class: "connected-dropdown__date-container" }, h("pn-date-picker", { ref: el => (this.pnEndDate = el), "label-from": this.endDateLabel, range: "false", "disable-weekends": true, "disabled-dates": this.disabledDates, class: "connected-dropdown__date-picker", "min-date": this.firstValidDateString, "max-date": this.lastValidDateString, language: this.languageCode, placeholder: this.datePlaceholder }))), h("div", { ref: el => (this.pnDaysRow = el), class: "connected-dropdown__multi-date-row" }, this.daysArr?.map((day) => (h("div", { class: "connected-dropdown__checkbox" }, h("pn-filter-checkbox", { checkboxid: 'day-' + day.value, name: '__' + day.label, value: day.value, checked: day.selected }), h("label", { htmlFor: 'day-' + day.value }, day.label))))), h("div", { class: "connected-dropdown__row" }, h("pn-button", { ref: el => (this.pnGenerateDatesButton = el), small: "true" }, this.generateDatesButtonText)), h("div", { ref: el => (this.pnGeneratedDatesSlot = el), class: "connected-dropdown__date-slot" }, this.generatedDatesArr?.map((date, i) => (h("div", { class: "connected-dropdown__row generated-date-row" }, h("p", null, date), h("pn-button", { index: i, small: "true", icon: minus, appearance: "warning", id: 'delete-date-' + i, onClick: this.deleteGeneratedDateRow.bind(this, i) }, date)))), !this.generatedDatesArr?.length ? h("p", null, this.noDatesText) : null), h("div", { class: "connected-dropdown__row" }, h("pn-button", { ref: el => (this.pnSaveGeneratedDatesButton = el), class: "connected-dropdown__button-right", small: "true" }, this.saveDateButtonText)))) : null))));
     }
     static get is() { return "pn-multi-row-connected-dropdown-row"; }
     static get originalStyleUrls() {

package/collection/components/input/pn-multi-row-connected-dropdown/pn-multi-row-connected-dropdown.js

@@ -197,7 +197,7 @@ export class PnMultiRowConnectedDropdown {
         }
     }
     render() {
-        return (h(Host, { key: '301a4cc1ef3e54bd28919b871ae8af510d8a0f49' }, this.rowData?.map((data, i) => {
+        return (h(Host, { key: '26e104f923a285295e8a5d8a15d845b3e9c559d6' }, this.rowData?.map((data, i) => {
             return (h("div", { class: 'generated-row-' + i, id: 'generated-row-connected-dropdown-' + i }, h("pn-multi-row-connected-dropdown-row", { "dropdown-data": this.dropdownData, "language-code": this.languageCode, label: this.label, "first-dropdown-label": this.firstDropdownLabel, "second-dropdown-label": this.secondDropdownLabel, "dropdown-placeholder": this.dropdownPlaceholder, "add-row-text": this.addRowText, "input-field-label": this.inputFieldLabel, "input-field-placeholder": this.inputFieldPlaceholder, "disabled-dates": this.disabledDates, "date-button-text": this.dateButtonText, "date-placeholder": this.datePlaceholder, "date-days-from-today": this.dateDaysFromToday, "allow-multiple-dates": this.allowMultipleDates, "start-date-label": this.startDateLabel, "end-date-label": this.endDateLabel, "multi-date-helper-text": this.multiDateHelperText, "generate-dates-button-text": this.generateDatesButtonText, "save-date-button-text": this.saveDateButtonText, "no-dates-text": this.noDatesText, index: i, "predefined-value": JSON.stringify(data), "years-to-add-to-end-date": this.yearsToAddToEndDate, "min-amount": this.minAmount, "error-message-empty": this.errorMessageEmpty, "error-message-min-amount": this.errorMessageMinAmount, "min-warning-amount": this.minWarningAmount, "warning-message-min-amount": this.warningMessageMinAmount })));
         }), this.allowMultipleRows ? (h("div", { class: "connected-dropdown__row" }, h("pn-button", { tooltip: this.addRowText ? this.addRowText : null, "left-icon": "true", arialabel: "Add", icon: plus, appearance: "light", variant: "borderless", class: "connected-dropdown__button-right", onClick: () => {
                 this.addRow();

package/collection/components/input/pn-multiple-input/pn-multiple-input.js

@@ -86,11 +86,11 @@ export class PnMultipleInput {
         }
     }
     render() {
-        return (h(Host, { key: '48f736322a59808e988448547708d373a68c3d9b' }, h("div", { key: 'b60bceaf70fed78ec61031965a905d0d400c93c2', ref: el => (this.pnSlotElement = el), class: "multiple-input-slot" }, this.rowData?.map((data, i) => {
+        return (h(Host, { key: 'c19a4c61c107632a3e97217c18ee4c2076ae077e' }, h("div", { key: '71fb803627c006e137db1f6be32fb26ab144c876', ref: el => (this.pnSlotElement = el), class: "multiple-input-slot" }, this.rowData?.map((data, i) => {
             return (h("div", { class: "multiple-input-generated-row" }, h("pn-marketweb-input", { label: this.label, type: "text", placeholder: this.placeholder, value: data.input, id: data.id }), i > 0 ? (h("pn-button", { arialabel: "Delete", icon: minus, appearance: "warning", onClick: () => {
                     this.deleteRow(i);
                 }, index: i, id: data.id }, "Delete")) : null));
-        })), h("dvi", { key: 'd9c2836ea448178184bf973221d911b27508ba1f', class: "multiple-input-row" }, h("pn-button", { key: '68681203a60d754fbbf4f4e27469b43928fa0d7e', tooltip: this.addRowButtonText ? this.addRowButtonText : null, "left-icon": "true", arialabel: "Add", icon: plus, appearance: "light", variant: "borderless", class: "connected-dropdown__button-right", onClick: () => {
+        })), h("dvi", { key: 'dc7c599822a8e8c39064ecc2ff76cea767ef757f', class: "multiple-input-row" }, h("pn-button", { key: '9289b646075f389d935f8a8be3f2490d0e102005', tooltip: this.addRowButtonText ? this.addRowButtonText : null, "left-icon": "true", arialabel: "Add", icon: plus, appearance: "light", variant: "borderless", class: "connected-dropdown__button-right", onClick: () => {
                 this.addRow();
             } }, this.addRowButtonText))));
     }

package/collection/components/layout-components/pn-marketweb-siteheader/pn-marketweb-siteheader-login-button.js

@@ -16,7 +16,7 @@ export class PnMarketwebSiteheaderLoginButton {
         return navigationUrl;
     }
     render() {
-        return (h(Host, { key: 'b8eddfc6326e8d5b0f3079294b60070cb76fe879' }, h("pn-button", { key: 'f4df113cc7b792da3f03dfb8f594472d14575891', href: this.nagivateToLoginUrl() }, this.label)));
+        return (h(Host, { key: '9851d49c77b44d630cddd1bbb32bbb9a8d79a99f' }, h("pn-button", { key: '48e7f40c6633213f5ba1ae5a56d93addc668ea75', href: this.nagivateToLoginUrl() }, this.label)));
     }
     static get is() { return "pn-marketweb-siteheader-login-button"; }
     static get originalStyleUrls() {

package/collection/components/layout-components/pn-marketweb-siteheader/pn-marketweb-siteheader-login-mypage-button.js

@@ -6,7 +6,7 @@ export class PnMarketwebSiteheaderLoginMypageButton {
     }
     hostElement;
     render() {
-        return (h(Host, { key: '5d4f6fda2eb4419e2b5b6cfa18a567afecc6be07' }, h("pn-button", { key: '5fd285823e3eab3d734aa362cc5179ddaf1de1f3', href: this.myPageUrl }, this.label)));
+        return (h(Host, { key: '35dc38e3b181c223a3b5325e8ad4408b078cf9c9' }, h("pn-button", { key: 'daeeac6b7da9a0ad3424cefe30614c83f638ac66', href: this.myPageUrl }, this.label)));
     }
     static get is() { return "pn-marketweb-siteheader-login-mypage-button"; }
     static get originalStyleUrls() {

package/collection/components/layout-components/pn-marketweb-siteheader/pn-marketweb-siteheader-unified-login.js

@@ -8,7 +8,7 @@ export class PnMarketwebSiteheaderUnifiedLogin {
     }
     hostElement;
     render() {
-        return (h(Host, { key: '8af0af70c9b1a87013fe09558c9a2fb3221f3bbd' }, h("pn-marketweb-siteheader-login-button", { key: 'bcf02e127c2dd8c5f3b05c781f601eb04091196c', label: this.logInLabel, useMarketwebLogin: this.useMarketwebLogin, environment: this.environment })));
+        return (h(Host, { key: '65898e3d509175fe0f2c46c12264ef303a501c75' }, h("pn-marketweb-siteheader-login-button", { key: '71a6a0d4d14ae0ec70b58bdaae9aeb0f22c070c7', label: this.logInLabel, useMarketwebLogin: this.useMarketwebLogin, environment: this.environment })));
     }
     static get is() { return "pn-marketweb-siteheader-unified-login"; }
     static get originalStyleUrls() {