npm - @postnord/pn-marketweb-components - Versions diffs - 4.1.0 → 4.1.2 - Mend

@postnord/pn-marketweb-components 4.1.0 → 4.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1268) hide show

package/collection/components/widgets/pn-level-up/pn-level-up-modal/pn-level-up-modal.js CHANGED Viewed

@@ -12,9 +12,10 @@ export class PnLevelUpModal {
         this.expiresInMessage = undefined;
         this.system = undefined;
         this.qrAriaLabel = undefined;
-        this.openModalToggle = undefined;
+        this.openModalToggle = false;
         this.isLoading = true;
     }
+    modalToggle;
     _bankIDUrl;
     _levelupService;
     _levelUpModal;
@@ -34,7 +35,7 @@ export class PnLevelUpModal {
         });
     };
     updateOpen() {
-        if (this.open === 'open') {
+        if (this.open === true) {
             this.handleOpen();
             this.openModalToggle = true;
             if (this._levelUpModal) {
@@ -52,8 +53,12 @@ export class PnLevelUpModal {
         await this.updateBankIDUrl();
     };
     render() {
-        return (h(Host, { key: '0431f6d5caf8183d3e1c432a3ad663fa8648b1b4' }, h("pn-modal", { key: 'bb6f2be2f52908943154e99c02e7c3f7b9e648b6', ref: el => this._levelUpModal = el, open: this.openModalToggle, class: "level-up-phone-modal", "allow-overflow": 'true', label: this.headingText }, this.isLoading ?
-            (h("pn-spinner", { light: "false", size: "1.5" })) : (h("div", { class: "modal-content-container" }, h("div", { class: "modal-content-qr" }, h("pn-qr-code-generator", { url: this._bankIDUrl, "countdown-seconds": "30", "outdated-message": this.outdatedQRMessage, "expires-in-message": this.expiresInMessage, "update-code-every-second": true, "aria-label": this.qrAriaLabel })), h("div", { class: "modal-content-list" }, h("ol", null, this.instructionPhoneLineOne && h("li", null, this.instructionPhoneLineOne), this.instructionPhoneLineTwo && h("li", null, this.instructionPhoneLineTwo), this.instructionPhoneLineThree && h("li", null, this.instructionPhoneLineThree))))))));
+        return (h(Host, { key: 'f996683c88b86b1d0b64818f1fbe515130bc2f0f' }, h("pn-modal", { key: 'c4bc3f8043dcb432acc49c9042a5351292b6f2c9', ref: el => this._levelUpModal = el, open: this.open, class: "level-up-phone-modal", "allow-overflow": 'true', label: this.headingText, onModalToggle: (ev) => {
+                const detail = ev.detail;
+                const isOpen = typeof detail === 'boolean' ? detail : !!detail?.open;
+                this.openModalToggle = isOpen;
+            } }, this.isLoading ?
+            (h("pn-spinner", { light: "false", size: "1.5" })) : (h("div", { class: "modal-content-container" }, h("div", { class: "modal-content-qr" }, this.openModalToggle && (h("pn-qr-code-generator", { url: this._bankIDUrl, "countdown-seconds": "30", "outdated-message": this.outdatedQRMessage, "expires-in-message": this.expiresInMessage, "update-code-every-second": true, "aria-label": this.qrAriaLabel }))), h("div", { class: "modal-content-list" }, h("ol", null, this.instructionPhoneLineOne && h("li", null, this.instructionPhoneLineOne), this.instructionPhoneLineTwo && h("li", null, this.instructionPhoneLineTwo), this.instructionPhoneLineThree && h("li", null, this.instructionPhoneLineThree))))))));
     }
     static get is() { return "pn-level-up-modal"; }
     static get originalStyleUrls() {
@@ -69,11 +74,11 @@ export class PnLevelUpModal {
     static get properties() {
         return {
             "open": {
-                "type": "string",
+                "type": "boolean",
                 "mutable": false,
                 "complexType": {
-                    "original": "'open' | 'close'",
-                    "resolved": "\"close\" | \"open\"",
+                    "original": "boolean",
+                    "resolved": "boolean",
                     "references": {}
                 },
                 "required": false,
@@ -252,6 +257,24 @@ export class PnLevelUpModal {
             "isLoading": {}
         };
     }
+    static get events() {
+        return [{
+                "method": "modalToggle",
+                "name": "modalToggle",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                }
+            }];
+    }
     static get watchers() {
         return [{
                 "propName": "open",

package/collection/components/widgets/pn-level-up/pn-level-up-modal/pn-level-up-modal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pn-level-up-modal.js","sourceRoot":"","sources":["../../../../../src/components/widgets/pn-level-up/pn-level-up-modal/pn-level-up-modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;~~AAEvE~~,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAO1D,MAAM,OAAO,cAAc~~;;;;;;;;;;;;;yBAaa~~,IAAI;;~~IAElC~~,UAAU,CAAS;IACnB,eAAe,CAAmB;IAClC,aAAa,CAAc;IAEnC,iBAAiB;QACf,IAAI,CAAC,eAAe,GAAG,IAAI,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC3D,IAAI,CAAC,UAAU,EAAE,CAAC;IACpB,CAAC;IAEO,eAAe,GAAG,KAAK,IAAI,EAAE;QACnC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;QACtB,IAAI,YAAY,GAAG,MAAM,IAAI,CAAC,eAAe,CAAC,gBAAgB,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;QAClF,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;QACvB,IAAI,CAAC,UAAU,GAAG,YAAY,CAAC,GAAG,CAAC;QACnC,MAAM,IAAI,CAAC,eAAe,CAAC,iBAAiB,CAAC,YAAY,CAAC,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,EAAE;YAC1F,~~IAAG~~,QAAQ,CAAC,IAAI,KAAK,GAAG,EAAE,CAAC;~~gBACzB~~,IAAI,CAAC,eAAe,CAAC,cAAc,EAAE,CAAC;YACxC,CAAC;QACH,CAAC,CAAC,CAAC;IACL,CAAC,CAAA;IAGD,UAAU;QACR,IAAI,IAAI,CAAC,IAAI,KAAK,~~MAAM~~,EAAE,CAAC;~~YACzB~~,IAAI,CAAC,UAAU,EAAE,CAAC;YAClB,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;YAC5B,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC;gBACvB,IAAK,IAAI,CAAC,aAAqB,CAAC,IAAI,KAAK,IAAI,EAAE,CAAC;oBAC7C,IAAI,CAAC,aAAqB,CAAC,IAAI,GAAG,KAAK,CAAC;gBAC3C,CAAC;gBACA,IAAI,CAAC,aAAqB,CAAC,IAAI,GAAG,IAAI,CAAC;YAC1C,CAAC;QACH,CAAC;aACI,CAAC;YACJ,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;QAC/B,CAAC;IACH,CAAC;IAEO,UAAU,GAAG,KAAK,IAAI,EAAE;QAC9B,MAAM,IAAI,CAAC,eAAe,EAAE,CAAC;IAC/B,CAAC,CAAA;~~IAED~~,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,iEACE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,aAAa,GAAG,EAAiB,EACjD,IAAI,EAAE,IAAI,CAAC,~~eAAe~~,~~EAC1B~~,KAAK,EAAC,sBAAsB,oBACb,MAAM,EACrB,KAAK,EAAE,IAAI,CAAC,WAAW,~~IACtB~~,IAAI,CAAC,SAAS,CAAC,CAAC;gBACf,CAAC,kBAAY,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,KAAK,GAAc,CAAC,CAAC,CAAC,CAAC,CACrD,WAAK,KAAK,EAAC,yBAAyB;gBAClC,WAAK,KAAK,EAAC,kBAAkB~~;oBAC3B~~,4BACE,GAAG,EAAE,IAAI,CAAC,UAAU,uBACF,IAAI,sBACJ,IAAI,CAAC,iBAAiB,wBACpB,IAAI,CAAC,gBAAgB,8BACf,IAAI,gBAClB,IAAI,CAAC,WAAW,GACP,~~CACnB~~;gBACN,WAAK,KAAK,EAAC,oBAAoB;oBAC7B;wBACG,IAAI,CAAC,uBAAuB,IAAI,cAAK,IAAI,CAAC,uBAAuB,CAAM;wBACvE,IAAI,CAAC,uBAAuB,IAAI,cAAK,IAAI,CAAC,uBAAuB,CAAM;wBACvE,IAAI,CAAC,yBAAyB,IAAI,cAAK,IAAI,CAAC,yBAAyB,CAAM,CACzE,CACD,CACF,CACP,CACM,CACN,CACR,CAAC;IACJ,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["import { Component, Host, Prop, h, State, Watch } from '@stencil/core';\nimport { DeviceType } from '../types';\nimport { PnLevelUpService } from '../pn-level-up.service';\n\n@Component({\n tag: 'pn-level-up-modal',\n styleUrl: 'pn-level-up-modal.scss',\n})\n\nexport class PnLevelUpModal {\n @Prop({ reflect: true }) open: ~~'open' \| 'close'~~;\n @Prop() endpoint: string;\n @Prop() instructionPhoneLineOne: string;\n @Prop() instructionPhoneLineTwo: string;\n @Prop() instructionPhoneLineThree: string;\n @Prop() headingText: string;\n @Prop() outdatedQRMessage: string;\n @Prop() expiresInMessage: string;\n @Prop() system: DeviceType;\n @Prop() qrAriaLabel: string;\n\n @State() private openModalToggle: boolean;\n @State() private isLoading: boolean = true;\n\n private _bankIDUrl: string;\n private _levelupService: PnLevelUpService;\n private _levelUpModal: HTMLElement;\n \n componentWillLoad() { \n this._levelupService = new PnLevelUpService(this.endpoint);\n this.updateOpen();\n }\n\n private updateBankIDUrl = async () => {\n this.isLoading = true;\n let authResponse = await this._levelupService.levelupAuthorize(this.system, null);\n this.isLoading = false;\n this._bankIDUrl = authResponse.url;\n await this._levelupService.levelupTokenGrant(authResponse.id, '30', null).then((response) => {\n if(response.code === 200) {\n this._levelupService.newLevelupUser();\n }\n });\n }\n\n @Watch('open')\n updateOpen () {\n if (this.open === ~~'open'~~) {\n this.handleOpen();\n this.openModalToggle = true;\n if (this._levelUpModal) {\n if ((this._levelUpModal as any).open === true) {\n (this._levelUpModal as any).open = false;\n }\n (this._levelUpModal as any).open = true;\n }\n }\n else {\n this.openModalToggle = false;\n }\n }\n\n private handleOpen = async () => {\n await this.updateBankIDUrl();\n }\n\n render() {\n return (\n <Host>\n <pn-modal\n ref={el => this._levelUpModal = el as HTMLElement}\n open={this.~~openModalToggle~~}\n class=\"level-up-phone-modal\"\n allow-overflow='true'\n label={this.headingText}>\n {this.isLoading ?\n (<pn-spinner light=\"false\" size=\"1.5\"></pn-spinner>) : (\n <div class=\"modal-content-container\">\n <div class=\"modal-content-qr\">\n <pn-qr-code-generator\n url={this._bankIDUrl}\n countdown-seconds=\"30\"\n outdated-message={this.outdatedQRMessage}\n expires-in-message={this.expiresInMessage}\n update-code-every-second={true}\n aria-label={this.qrAriaLabel}>\n </pn-qr-code-generator>\n </div>\n <div class=\"modal-content-list\">\n <ol>\n {this.instructionPhoneLineOne && <li>{this.instructionPhoneLineOne}</li>}\n {this.instructionPhoneLineTwo && <li>{this.instructionPhoneLineTwo}</li>}\n {this.instructionPhoneLineThree && <li>{this.instructionPhoneLineThree}</li>}\n </ol>\n </div>\n </div>\n )}\n </pn-modal>\n </Host>\n );\n }\n}"]}
1	+ {"version":3,"file":"pn-level-up-modal.js","sourceRoot":"","sources":["../../../../../src/components/widgets/pn-level-up/pn-level-up-modal/pn-level-up-modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, h, State, Watch, Event, EventEmitter } from '@stencil/core';\nimport { DeviceType } from '../types';\nimport { PnLevelUpService } from '../pn-level-up.service';\n\n@Component({\n tag: 'pn-level-up-modal',\n styleUrl: 'pn-level-up-modal.scss',\n})\n\nexport class PnLevelUpModal {\n @Prop({ reflect: true }) open: boolean;\n @Prop() endpoint: string;\n @Prop() instructionPhoneLineOne: string;\n @Prop() instructionPhoneLineTwo: string;\n @Prop() instructionPhoneLineThree: string;\n @Prop() headingText: string;\n @Prop() outdatedQRMessage: string;\n @Prop() expiresInMessage: string;\n @Prop() system: DeviceType;\n @Prop() qrAriaLabel: string;\n\n @State() private openModalToggle: boolean = false;\n @State() private isLoading: boolean = true;\n @Event({ eventName: 'modalToggle', bubbles: true, composed: true }) modalToggle: EventEmitter<boolean>;\n\n private _bankIDUrl: string;\n private _levelupService: PnLevelUpService;\n private _levelUpModal: HTMLElement;\n\n componentWillLoad() {\n this._levelupService = new PnLevelUpService(this.endpoint);\n this.updateOpen();\n }\n\n private updateBankIDUrl = async () => {\n this.isLoading = true;\n let authResponse = await this._levelupService.levelupAuthorize(this.system, null);\n this.isLoading = false;\n this._bankIDUrl = authResponse.url;\n await this._levelupService.levelupTokenGrant(authResponse.id, '30', null).then((response) => {\n if (response.code === 200) {\n this._levelupService.newLevelupUser();\n }\n });\n }\n\n @Watch('open')\n updateOpen () {\n if (this.open === true) {\n this.handleOpen();\n this.openModalToggle = true;\n if (this._levelUpModal) {\n if ((this._levelUpModal as any).open === true) {\n (this._levelUpModal as any).open = false;\n }\n (this._levelUpModal as any).open = true;\n }\n }\n else {\n this.openModalToggle = false;\n }\n }\n\n private handleOpen = async () => {\n await this.updateBankIDUrl();\n }\n\n\n render() {\n return (\n <Host>\n <pn-modal\n ref={el => this._levelUpModal = el as HTMLElement}\n open={this.open}\n class=\"level-up-phone-modal\"\n allow-overflow='true'\n label={this.headingText}\n onModalToggle={(ev: CustomEvent<boolean \| { open: boolean }>) => {\n const detail = ev.detail as any;\n const isOpen = typeof detail === 'boolean' ? detail : !!detail?.open;\n this.openModalToggle = isOpen;\n }}>\n {this.isLoading ?\n (<pn-spinner light=\"false\" size=\"1.5\"></pn-spinner>) : (\n <div class=\"modal-content-container\">\n <div class=\"modal-content-qr\">\n {this.openModalToggle && (\n <pn-qr-code-generator\n url={this._bankIDUrl}\n countdown-seconds=\"30\"\n outdated-message={this.outdatedQRMessage}\n expires-in-message={this.expiresInMessage}\n update-code-every-second={true}\n aria-label={this.qrAriaLabel}>\n </pn-qr-code-generator>\n )}\n </div>\n <div class=\"modal-content-list\">\n <ol>\n {this.instructionPhoneLineOne && <li>{this.instructionPhoneLineOne}</li>}\n {this.instructionPhoneLineTwo && <li>{this.instructionPhoneLineTwo}</li>}\n {this.instructionPhoneLineThree && <li>{this.instructionPhoneLineThree}</li>}\n </ol>\n </div>\n </div>\n )}\n </pn-modal>\n </Host>\n );\n }\n}"]}

package/collection/components/widgets/pn-level-up/pn-level-up-modal/pn-level-up-modal.stories.js CHANGED Viewed

@@ -12,7 +12,7 @@ const meta = {
         }
     },
     args: {
-        open: 'open',
+        open: true,
         instructionPhoneLineOne: 'Open your BankID app',
         instructionPhoneLineTwo: 'Click on the QR button in the app',
         instructionPhoneLineThree: 'Scan the QR code',

package/collection/components/widgets/pn-level-up/pn-level-up-modal/pn-level-up-modal.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pn-level-up-modal.stories.js","sourceRoot":"","sources":["../../../../../src/components/widgets/pn-level-up/pn-level-up-modal/pn-level-up-modal.stories.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,mBAAmB,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;AACrF,OAAO,IAAI,MAAM,+BAA+B,CAAC;AAEjD,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,GAAG,mBAAmB,CAAC,IAAI,CAAC,CAAC;AAE5D,MAAM,IAAI,GAAoC;IAC5C,KAAK,EAAE,mCAAmC;IAC1C,UAAU,EAAE;QACV,OAAO,EAAE,EACR;QACD,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,KAAK,EAAE,WAAW;aACnB;SACF;KACF;IACD,IAAI,EAAE;QACN,IAAI,EAAE,~~MAAM~~;~~QACZ~~,uBAAuB,EAAE,sBAAsB;QAC/C,uBAAuB,EAAE,mCAAmC;QAC5D,yBAAyB,EAAE,kBAAkB;QAC7C,WAAW,EAAE,sBAAsB;QACnC,QAAQ,EAAE,qCAAqC;QAC/C,iBAAiB,EAAE,oBAAoB;QACvC,gBAAgB,EAAE,YAAY;KAC7B;IACD,QAAQ;CACT,CAAC;AAIF,eAAe,IAAI,CAAC;AAEpB,MAAM,CAAC,MAAM,YAAY,GAAU;IACjC,IAAI,EAAE,mBAAmB;IACzB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,eAAe,CAAC,mBAAmB,EAAE,IAAI,CAAC;CAC7D,CAAC","sourcesContent":["import type { Meta, StoryObj } from '@storybook/web-components';\n\nimport { createDocumentation, createComponent } from '@/globals/documentation/story';\nimport docs from './pn-level-up-modal-docs.json';\n\nconst { argTypes, textContent } = createDocumentation(docs);\n\nconst meta: Meta<HTMLPnLevelUpModalElement> = {\n title: 'Components/Widgets/Level up modal',\n parameters: {\n actions: {\n },\n docs: {\n description: {\n story: textContent\n }\n }\n },\n args: {\n open: ~~'open'~~,\n instructionPhoneLineOne: 'Open your BankID app',\n instructionPhoneLineTwo: 'Click on the QR button in the app',\n instructionPhoneLineThree: 'Scan the QR code',\n headingText: 'Level up with BankID',\n endpoint: 'https://se-integration.postnord.com',\n outdatedQRMessage: 'The QR has expired',\n expiresInMessage: 'Expires in'\n },\n argTypes,\n};\n\ntype Story = StoryObj<HTMLPnLevelUpModalElement>;\n\nexport default meta;\n\nexport const LevelUpModal: Story = {\n name: 'pn-level-up-modal',\n render: (args) => createComponent('pn-level-up-modal', args),\n};\n"]}
1	+ {"version":3,"file":"pn-level-up-modal.stories.js","sourceRoot":"","sources":["../../../../../src/components/widgets/pn-level-up/pn-level-up-modal/pn-level-up-modal.stories.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,mBAAmB,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;AACrF,OAAO,IAAI,MAAM,+BAA+B,CAAC;AAEjD,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,GAAG,mBAAmB,CAAC,IAAI,CAAC,CAAC;AAE5D,MAAM,IAAI,GAAoC;IAC5C,KAAK,EAAE,mCAAmC;IAC1C,UAAU,EAAE;QACV,OAAO,EAAE,EACR;QACD,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,KAAK,EAAE,WAAW;aACnB;SACF;KACF;IACD,IAAI,EAAE;QACN,IAAI,EAAE,IAAI;QACV,uBAAuB,EAAE,sBAAsB;QAC/C,uBAAuB,EAAE,mCAAmC;QAC5D,yBAAyB,EAAE,kBAAkB;QAC7C,WAAW,EAAE,sBAAsB;QACnC,QAAQ,EAAE,qCAAqC;QAC/C,iBAAiB,EAAE,oBAAoB;QACvC,gBAAgB,EAAE,YAAY;KAC7B;IACD,QAAQ;CACT,CAAC;AAIF,eAAe,IAAI,CAAC;AAEpB,MAAM,CAAC,MAAM,YAAY,GAAU;IACjC,IAAI,EAAE,mBAAmB;IACzB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,eAAe,CAAC,mBAAmB,EAAE,IAAI,CAAC;CAC7D,CAAC","sourcesContent":["import type { Meta, StoryObj } from '@storybook/web-components';\n\nimport { createDocumentation, createComponent } from '@/globals/documentation/story';\nimport docs from './pn-level-up-modal-docs.json';\n\nconst { argTypes, textContent } = createDocumentation(docs);\n\nconst meta: Meta<HTMLPnLevelUpModalElement> = {\n title: 'Components/Widgets/Level up modal',\n parameters: {\n actions: {\n },\n docs: {\n description: {\n story: textContent\n }\n }\n },\n args: {\n open: true,\n instructionPhoneLineOne: 'Open your BankID app',\n instructionPhoneLineTwo: 'Click on the QR button in the app',\n instructionPhoneLineThree: 'Scan the QR code',\n headingText: 'Level up with BankID',\n endpoint: 'https://se-integration.postnord.com',\n outdatedQRMessage: 'The QR has expired',\n expiresInMessage: 'Expires in'\n },\n argTypes,\n};\n\ntype Story = StoryObj<HTMLPnLevelUpModalElement>;\n\nexport default meta;\n\nexport const LevelUpModal: Story = {\n name: 'pn-level-up-modal',\n render: (args) => createComponent('pn-level-up-modal', args),\n};\n"]}

package/collection/components/widgets/pn-level-up/pn-level-up.js CHANGED Viewed

@@ -28,6 +28,7 @@ export class PnLevelUp {
         this.isRecentLeveledUp = false;
         this.errorMessage = undefined;
     }
+    showModal = false;
     _android = 'android';
     _ios = 'ios';
     _web = 'web';
@@ -35,6 +36,7 @@ export class PnLevelUp {
     _system;
     _levelupService;
     _storage = new LocalStorageService();
+    modal;
     componentWillLoad() {
         if (!this.isLeveledUp) {
             this.checkRecentLevelUp();
@@ -69,12 +71,12 @@ export class PnLevelUp {
         });
     };
     openModal() {
-        let levelUpModal = document.getElementsByTagName('pn-level-up-modal')[0];
-        let openAttributeValue = levelUpModal.getAttribute('open');
-        if (openAttributeValue === 'open') {
-            levelUpModal.setAttribute('open', 'close');
+        if (this.showModal) {
+            this.modal.setAttribute('open', 'false');
+            this.showModal = false;
         }
-        levelUpModal.setAttribute('open', 'open');
+        this.modal.setAttribute('open', 'true');
+        this.showModal = true;
     }
     renderWebButtonOptions() {
         return (h("div", { class: "cta", role: "group" }, this.webModalContinueOtherDeviceLabel &&
@@ -115,9 +117,9 @@ export class PnLevelUp {
     }
     render() {
         const headingId = 'pn-level-up-heading';
-        return (h(Host, { key: 'f48ec4a1e559a8967176b29c1229f0e9db250ee0' }, this.isLeveledUp || this.isRecentLeveledUp
+        return (h(Host, { key: '0c6b3d3b8f1035d811582b8fa42fe1bfa7d24ea3' }, this.isLeveledUp || this.isRecentLeveledUp
             ? (this.presentResult())
-            : (h("div", { class: "pn-level-up", role: "region", "aria-labelledby": this.heading ? headingId : undefined }, h("div", { class: "content" }, this.heading && (h(HeadingTag, { id: headingId, level: this.headingLevel, cssClass: "heading" }, this.heading)), this.preamble && (h("div", { class: "preamble" }, this.preamble)), this.hasButtonTexts && this._system === this._web && this.renderWebButtonOptions(), this.hasButtonTexts && this._system !== this._web && this.renderMobileButtonOptions()), h("div", { class: "image-container", "aria-hidden": !this.imageAltText }, this.imageUrl && h("img", { class: "image graphics", src: this.imageUrl, alt: this.imageAltText || '', loading: "lazy" })))), this.errorMessage && h("pn-toast", { key: 'a6f9a66b2a8d9007a8aed5e7f07a34f19f3c31b5', text: this.errorMessage, appearance: 'warning' }), h("pn-level-up-modal", { key: '73cafdd318db53a36a048b6b237234c443466a91', open: 'close', endpoint: this.endpoint, "instruction-phone-line-one": this.modalInstructionPhoneLineOne, "instruction-phone-line-two": this.modalInstructionPhoneLineTwo, "instruction-phone-line-three": this.modalInstructionPhoneLineThree, "heading-text": this.modalHeadingText, "outdated-q-r-message": this.modalOutdatedQRMessage, "expires-in-message": this.modalExpiresInMessage, "qr-aria-label": this.qrAriaLabel, system: this._android })));
+            : (h("div", { class: "pn-level-up", role: "region", "aria-labelledby": this.heading ? headingId : undefined }, h("div", { class: "content" }, this.heading && (h(HeadingTag, { id: headingId, level: this.headingLevel, cssClass: "heading" }, this.heading)), this.preamble && (h("div", { class: "preamble" }, this.preamble)), this.hasButtonTexts && this._system === this._web && this.renderWebButtonOptions(), this.hasButtonTexts && this._system !== this._web && this.renderMobileButtonOptions()), h("div", { class: "image-container", "aria-hidden": !this.imageAltText }, this.imageUrl && h("img", { class: "image graphics", src: this.imageUrl, alt: this.imageAltText || '', loading: "lazy" })))), this.errorMessage && h("pn-toast", { key: '0dc87efccbedaf752f62c7abcf4d6261f268d467', text: this.errorMessage, appearance: 'warning' }), h("pn-level-up-modal", { key: '2a7d8f973cee89c27a22f21da209a1927e5ee0e5', ref: el => this.modal = el, open: false, endpoint: this.endpoint, "instruction-phone-line-one": this.modalInstructionPhoneLineOne, "instruction-phone-line-two": this.modalInstructionPhoneLineTwo, "instruction-phone-line-three": this.modalInstructionPhoneLineThree, "heading-text": this.modalHeadingText, "outdated-q-r-message": this.modalOutdatedQRMessage, "expires-in-message": this.modalExpiresInMessage, "qr-aria-label": this.qrAriaLabel, system: this._android })));
     }
     static get is() { return "pn-level-up"; }
     static get originalStyleUrls() {

package/collection/components/widgets/pn-level-up/pn-level-up.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pn-level-up.js","sourceRoot":"","sources":["../../../../src/components/widgets/pn-level-up/pn-level-up.tsx"],"names":[],"mappings":"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","sourcesContent":["import { HeadingLevel } from '@/components';\nimport { HeadingTag } from '@/globals/HeadingTag';\nimport { Component, Host, Prop, h, State } from '@stencil/core';\nimport { bankid } from 'pn-design-assets/pn-assets/icons.js';\nimport { DeviceType } from './types';\nimport { PnLevelUpService } from './pn-level-up.service';\nimport { LocalStorageService } from '@/globals/LocalStorageService';\n\n@Component({\n tag: 'pn-level-up',\n styleUrl: 'pn-level-up.scss'\n})\nexport class PnLevelUp {\n @Prop() heading?: string;\n @Prop() headingLevel: HeadingLevel = 'h2';\n @Prop() preamble?: string;\n @Prop() imageUrl?: string;\n @Prop() imageAltText?: string;\n @Prop() endpoint: string;\n @Prop() webModalContinueOtherDeviceLabel: string;\n @Prop() webModalContinueThisDeviceLabel: string;\n @Prop() mobileModalContinueThisDeviceLabel: string;\n @Prop() mobileModalContinueOtherDeviceLabel: string;\n @Prop() modalInstructionPhoneLineOne: string;\n @Prop() modalInstructionPhoneLineTwo: string;\n @Prop() modalInstructionPhoneLineThree: string;\n @Prop() modalHeadingText: string;\n @Prop() modalOutdatedQRMessage: string;\n @Prop() modalExpiresInMessage: string;\n @Prop() qrAriaLabel: string;\n @Prop() leveledupMessage: string;\n @Prop() isLeveledUp: boolean = false;\n\n @State() private isLoading: boolean = false;\n @State() private isRecentLeveledUp: boolean = false;\n @State() private errorMessage: string;\n\n private readonly _android: DeviceType = 'android';\n private readonly _ios: DeviceType = 'ios';\n private readonly _web: DeviceType = 'web';\n private readonly levelupLocalStorageKey = 'levelup';\n\n private _system: DeviceType;\n private _levelupService: PnLevelUpService;\n private _storage: LocalStorageService = new LocalStorageService();\n\n componentWillLoad() {\n if (!this.isLeveledUp) {\n this.checkRecentLevelUp();\n }\n\n this._levelupService = new PnLevelUpService(this.endpoint);\n this._system = this.getDeviceType();\n }\n\n getDeviceType(): DeviceType {\n const userAgent = navigator.userAgent;\n \n if (/android/i.test(userAgent)) {\n return this._android;\n }\n \n if (/iPad\|iPhone\|iPod/.test(userAgent) && !(window as any).MSStream) {\n return this._ios;\n }\n \n return this._web;\n }\n\n private openLocalApp = async () => {\n this.isLoading = true;\n let authResponse = await this._levelupService.levelupAuthorize(this._system, null)\n window.location.href = authResponse.url;\n this.isLoading = false;\n await this._levelupService.levelupTokenGrant(authResponse.id, '30', null).then((response) => {\n if (response.code === 200) {\n this._levelupService.newLevelupUser();\n this.isRecentLeveledUp = true;\n this.errorMessage = null;\n }\n else {\n this.errorMessage = response.customMessage;\n }\n });\n }\n\n private openModal() {\n let levelUpModal = document.getElementsByTagName('pn-level-up-modal')[0];\n let openAttributeValue = levelUpModal.getAttribute('open');\n\n if (openAttributeValue === 'open') {\n levelUpModal.setAttribute('open', 'close');\n }\n\n levelUpModal.setAttribute('open', 'open');\n }\n\n private renderWebButtonOptions() {\n return ( \n <div class=\"cta\" role=\"group\">\n {this.webModalContinueOtherDeviceLabel &&\n <pn-button\n icon={bankid}\n left-icon='true'\n appearance='default'\n label={this.webModalContinueOtherDeviceLabel}\n onClick={() => this.openModal()}>\n </pn-button>}\n {this.webModalContinueThisDeviceLabel &&\n <pn-button\n icon={bankid}\n left-icon='true'\n appearance='light'\n variant='outlined'\n label={this.webModalContinueThisDeviceLabel}\n onClick={() => this.openLocalApp()}\n loading={this.isLoading}>\n </pn-button>}\n </div>);\n }\n\n private renderMobileButtonOptions() {\n return (\n <div class=\"cta\" role=\"group\">\n {this.mobileModalContinueThisDeviceLabel &&\n <pn-button\n icon={bankid}\n left-icon='true'\n appearance='default'\n label={this.mobileModalContinueThisDeviceLabel}\n onClick={() => this.openLocalApp()}\n loading={this.isLoading}>\n </pn-button>}\n {this.mobileModalContinueOtherDeviceLabel &&\n <pn-button\n icon={bankid}\n left-icon='true'\n appearance='light'\n variant='outlined'\n label={this.mobileModalContinueOtherDeviceLabel}\n onClick={() => this.openModal()}>\n </pn-button>}\n </div>);\n }\n\n private presentResult() {\n if (this.isLeveledUp) {\n return null;\n }\n\n return (<pn-toast text={this.leveledupMessage} appearance='success'></pn-toast>);\n }\n\n private checkRecentLevelUp() {\n let levelupStorage = this._storage.get(this.levelupLocalStorageKey);\n if (levelupStorage === null) {\n this.isRecentLeveledUp = false;\n }\n else if (levelupStorage.expire > Date.now()) {\n this.isRecentLeveledUp = true;\n }\n else {\n this._storage.remove(this.levelupLocalStorageKey);\n this.isRecentLeveledUp = false;\n }\n }\n\n private get hasButtonTexts(): boolean {\n if (this._system === this._web) {\n return Boolean(this.webModalContinueOtherDeviceLabel) && Boolean(this.webModalContinueThisDeviceLabel);\n }\n else {\n return Boolean(this.mobileModalContinueOtherDeviceLabel) && Boolean(this.mobileModalContinueThisDeviceLabel);\n }\n }\n\n render() {\n const headingId = 'pn-level-up-heading';\n return (\n <Host>\n {this.isLeveledUp \|\| this.isRecentLeveledUp \n ? (this.presentResult()) \n : (<div class=\"pn-level-up\" role=\"region\" aria-labelledby={this.heading ? headingId : undefined}>\n <div class=\"content\">\n {this.heading && (\n <HeadingTag id={headingId} level={this.headingLevel} cssClass=\"heading\">\n {this.heading}\n </HeadingTag>\n )}\n {this.preamble && (\n <div class=\"preamble\">\n {this.preamble}\n </div>\n )}\n {this.hasButtonTexts && this._system === this._web && this.renderWebButtonOptions()}\n {this.hasButtonTexts && this._system !== this._web && this.renderMobileButtonOptions()}\n </div>\n <div class=\"image-container\" aria-hidden={!this.imageAltText}>\n {this.imageUrl && <img class=\"image graphics\" src={this.imageUrl} alt={this.imageAltText \|\| ''} loading=\"lazy\" />}\n </div>\n </div>\n )}\n {this.errorMessage && <pn-toast text={this.errorMessage} appearance='warning'></pn-toast>}\n <pn-level-up-modal\n open='close'\n endpoint={this.endpoint}\n instruction-phone-line-one={this.modalInstructionPhoneLineOne}\n instruction-phone-line-two={this.modalInstructionPhoneLineTwo}\n instruction-phone-line-three={this.modalInstructionPhoneLineThree}\n heading-text={this.modalHeadingText}\n outdated-q-r-message={this.modalOutdatedQRMessage}\n expires-in-message={this.modalExpiresInMessage}\n qr-aria-label={this.qrAriaLabel}\n system={this._android}>\n </pn-level-up-modal>\n </Host>\n );\n }\n}\n\n"]}
1	+ {"version":3,"file":"pn-level-up.js","sourceRoot":"","sources":["../../../../src/components/widgets/pn-level-up/pn-level-up.tsx"],"names":[],"mappings":"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","sourcesContent":["import { HeadingLevel } from '@/components';\nimport { HeadingTag } from '@/globals/HeadingTag';\nimport { Component, Host, Prop, h, State } from '@stencil/core';\nimport { bankid } from 'pn-design-assets/pn-assets/icons.js';\nimport { DeviceType } from './types';\nimport { PnLevelUpService } from './pn-level-up.service';\nimport { LocalStorageService } from '@/globals/LocalStorageService';\n\n@Component({\n tag: 'pn-level-up',\n styleUrl: 'pn-level-up.scss'\n})\nexport class PnLevelUp {\n @Prop() heading?: string;\n @Prop() headingLevel: HeadingLevel = 'h2';\n @Prop() preamble?: string;\n @Prop() imageUrl?: string;\n @Prop() imageAltText?: string;\n @Prop() endpoint: string;\n @Prop() webModalContinueOtherDeviceLabel: string;\n @Prop() webModalContinueThisDeviceLabel: string;\n @Prop() mobileModalContinueThisDeviceLabel: string;\n @Prop() mobileModalContinueOtherDeviceLabel: string;\n @Prop() modalInstructionPhoneLineOne: string;\n @Prop() modalInstructionPhoneLineTwo: string;\n @Prop() modalInstructionPhoneLineThree: string;\n @Prop() modalHeadingText: string;\n @Prop() modalOutdatedQRMessage: string;\n @Prop() modalExpiresInMessage: string;\n @Prop() qrAriaLabel: string;\n @Prop() leveledupMessage: string;\n @Prop() isLeveledUp: boolean = false;\n\n @State() private isLoading: boolean = false;\n @State() private isRecentLeveledUp: boolean = false;\n @State() private errorMessage: string;\n private showModal: boolean = false;\n\n private readonly _android: DeviceType = 'android';\n private readonly _ios: DeviceType = 'ios';\n private readonly _web: DeviceType = 'web';\n private readonly levelupLocalStorageKey = 'levelup';\n\n private _system: DeviceType;\n private _levelupService: PnLevelUpService;\n private _storage: LocalStorageService = new LocalStorageService();\n private modal: HTMLElement;\n\n componentWillLoad() {\n if (!this.isLeveledUp) {\n this.checkRecentLevelUp();\n }\n\n this._levelupService = new PnLevelUpService(this.endpoint);\n this._system = this.getDeviceType();\n }\n\n getDeviceType(): DeviceType {\n const userAgent = navigator.userAgent;\n \n if (/android/i.test(userAgent)) {\n return this._android;\n }\n \n if (/iPad\|iPhone\|iPod/.test(userAgent) && !(window as any).MSStream) {\n return this._ios;\n }\n \n return this._web;\n }\n\n private openLocalApp = async () => {\n this.isLoading = true;\n let authResponse = await this._levelupService.levelupAuthorize(this._system, null)\n window.location.href = authResponse.url;\n this.isLoading = false;\n await this._levelupService.levelupTokenGrant(authResponse.id, '30', null).then((response) => {\n if (response.code === 200) {\n this._levelupService.newLevelupUser();\n this.isRecentLeveledUp = true;\n this.errorMessage = null;\n }\n else {\n this.errorMessage = response.customMessage;\n }\n });\n }\n\n private openModal() {\n if (this.showModal) {\n this.modal.setAttribute('open', 'false');\n this.showModal = false;\n } \n this.modal.setAttribute('open', 'true');\n this.showModal = true;\n }\n\n private renderWebButtonOptions() {\n return ( \n <div class=\"cta\" role=\"group\">\n {this.webModalContinueOtherDeviceLabel &&\n <pn-button\n icon={bankid}\n left-icon='true'\n appearance='default'\n label={this.webModalContinueOtherDeviceLabel}\n onClick={() => this.openModal()}>\n </pn-button>}\n {this.webModalContinueThisDeviceLabel &&\n <pn-button\n icon={bankid}\n left-icon='true'\n appearance='light'\n variant='outlined'\n label={this.webModalContinueThisDeviceLabel}\n onClick={() => this.openLocalApp()}\n loading={this.isLoading}>\n </pn-button>}\n </div>);\n }\n\n private renderMobileButtonOptions() {\n return (\n <div class=\"cta\" role=\"group\">\n {this.mobileModalContinueThisDeviceLabel &&\n <pn-button\n icon={bankid}\n left-icon='true'\n appearance='default'\n label={this.mobileModalContinueThisDeviceLabel}\n onClick={() => this.openLocalApp()}\n loading={this.isLoading}>\n </pn-button>}\n {this.mobileModalContinueOtherDeviceLabel &&\n <pn-button\n icon={bankid}\n left-icon='true'\n appearance='light'\n variant='outlined'\n label={this.mobileModalContinueOtherDeviceLabel}\n onClick={() => this.openModal()}>\n </pn-button>}\n </div>);\n }\n\n private presentResult() {\n if (this.isLeveledUp) {\n return null;\n }\n\n return (<pn-toast text={this.leveledupMessage} appearance='success'></pn-toast>);\n }\n\n private checkRecentLevelUp() {\n let levelupStorage = this._storage.get(this.levelupLocalStorageKey);\n if (levelupStorage === null) {\n this.isRecentLeveledUp = false;\n }\n else if (levelupStorage.expire > Date.now()) {\n this.isRecentLeveledUp = true;\n }\n else {\n this._storage.remove(this.levelupLocalStorageKey);\n this.isRecentLeveledUp = false;\n }\n }\n\n private get hasButtonTexts(): boolean {\n if (this._system === this._web) {\n return Boolean(this.webModalContinueOtherDeviceLabel) && Boolean(this.webModalContinueThisDeviceLabel);\n }\n else {\n return Boolean(this.mobileModalContinueOtherDeviceLabel) && Boolean(this.mobileModalContinueThisDeviceLabel);\n }\n }\n\n render() {\n const headingId = 'pn-level-up-heading';\n return (\n <Host>\n {this.isLeveledUp \|\| this.isRecentLeveledUp \n ? (this.presentResult()) \n : (<div class=\"pn-level-up\" role=\"region\" aria-labelledby={this.heading ? headingId : undefined}>\n <div class=\"content\">\n {this.heading && (\n <HeadingTag id={headingId} level={this.headingLevel} cssClass=\"heading\">\n {this.heading}\n </HeadingTag>\n )}\n {this.preamble && (\n <div class=\"preamble\">\n {this.preamble}\n </div>\n )}\n {this.hasButtonTexts && this._system === this._web && this.renderWebButtonOptions()}\n {this.hasButtonTexts && this._system !== this._web && this.renderMobileButtonOptions()}\n </div>\n <div class=\"image-container\" aria-hidden={!this.imageAltText}>\n {this.imageUrl && <img class=\"image graphics\" src={this.imageUrl} alt={this.imageAltText \|\| ''} loading=\"lazy\" />}\n </div>\n </div>\n )}\n {this.errorMessage && <pn-toast text={this.errorMessage} appearance='warning'></pn-toast>}\n <pn-level-up-modal\n ref={el => this.modal = el as HTMLElement}\n open={false}\n endpoint={this.endpoint}\n instruction-phone-line-one={this.modalInstructionPhoneLineOne}\n instruction-phone-line-two={this.modalInstructionPhoneLineTwo}\n instruction-phone-line-three={this.modalInstructionPhoneLineThree}\n heading-text={this.modalHeadingText}\n outdated-q-r-message={this.modalOutdatedQRMessage}\n expires-in-message={this.modalExpiresInMessage}\n qr-aria-label={this.qrAriaLabel}\n system={this._android}>\n </pn-level-up-modal>\n </Host>\n );\n }\n}\n\n"]}

package/collection/components/widgets/pn-qr-code-generator/pn-qr-code-generator.js CHANGED Viewed

@@ -18,14 +18,33 @@ export class QrCodeGenerator {
     gray900 = '#2d2013';
     blackHex = '#000';
     whiteHex = '#fff';
+    connectedCallback() {
+        this.isOutdated = false;
+        if (this.timer == null) {
+            this.generateQRCode();
+            if (this.countdownSeconds !== -1) {
+                requestAnimationFrame(() => {
+                    this.startCountdown();
+                });
+            }
+        }
+    }
     componentWillLoad() {
         this.urlWithSegment = this.url + '#';
         this.remainingSeconds = this.countdownSeconds;
+        if (this.timer != null) {
+            this.resetCountdown();
+        }
     }
-    componentDidLoad() {
-        this.generateQRCode();
-        if (this.countdownSeconds !== -1) {
-            this.startCountdown();
+    disconnectedCallback() {
+        this.resetCountdown();
+    }
+    resetCountdown() {
+        if (this.timer !== null) {
+            this.remainingSeconds = this.countdownSeconds;
+            clearInterval(this.timer);
+            this.timer = null;
+            return;
         }
     }
     generateQRCode(urlSegment = '') {
@@ -56,11 +75,8 @@ export class QrCodeGenerator {
             }
         }, 1000);
     }
-    disconnectedCallback() {
-        clearInterval(this.timer);
-    }
     render() {
-        return (h("div", { key: 'e0bc37a181c7787812bbd052877cf1c0ecffe4c9' }, h("button", { key: '6486b7b7e94493ba8cf32d6cef7e9224c119a8ea', class: "qr-button__wrapper", "aria-label": this.ariaLabel }, h("canvas", { key: 'e66b827b3a7b92b3cf250e73b0dade3675fad9b7', class: this.isOutdated ? 'outdated' : '', ref: el => (this.canvasRef = el) })), this.countdownSeconds !== -1 && h("div", { key: '122ba7328a26fb6116ffc5b6c9b3a4cdcc24b8a2', class: "timer" }, this.isOutdated && h("span", { key: 'da1c41fe27834b3fdfcc08f456ab0f53e13a9a12', class: "outdated-message" }, this.outdatedMessage), !this.isOutdated && this.expiresInMessage && h("span", { key: 'c6515a6aa7491e02267f82f55abac7388ed68d15' }, this.expiresInMessage, " ", this.remainingSeconds))));
+        return (h("div", { key: 'e5b9bef49f102baf00ff2638d1aacda0fb3d49c4' }, h("button", { key: 'ba1c2a070481c2eee9a4d23bd41e17e23158610c', class: "qr-button__wrapper", "aria-label": this.ariaLabel }, h("canvas", { key: '50c30caabfcf98666a6cd5c0aaf83934cfbbf3d5', class: this.isOutdated ? 'outdated' : '', ref: el => (this.canvasRef = el) })), this.countdownSeconds !== -1 && h("div", { key: 'dfcb33c704376bbe087e20737118325fae4eb6d8', class: "timer" }, this.isOutdated && h("span", { key: '617d0795c50621394aa0a8edc32c76ba004824da', class: "outdated-message" }, this.outdatedMessage), !this.isOutdated && this.expiresInMessage && h("span", { key: '0ff4b37fe905149f20432819889f64f4296f136c' }, this.expiresInMessage, " ", this.remainingSeconds))));
     }
     static get is() { return "pn-qr-code-generator"; }
     static get originalStyleUrls() {

package/collection/components/widgets/pn-qr-code-generator/pn-qr-code-generator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pn-qr-code-generator.js","sourceRoot":"","sources":["../../../../src/components/widgets/pn-qr-code-generator/pn-qr-code-generator.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,MAAM,MAAM,QAAQ,CAAC;AAM5B,MAAM,OAAO,eAAe;;;gCAES,CAAC,CAAC;;;qCAGI,IAAI;;;0BAId,KAAK;4BACH,KAAK;;IAE9B,SAAS,CAAoB;IAC7B,KAAK,CAAM;IACX,cAAc,CAAS;IAEd,OAAO,GAAW,SAAS,CAAC;IAC5B,QAAQ,GAAW,MAAM,CAAC;IAC1B,QAAQ,GAAW,MAAM,CAAC;IAE3C,iBAAiB;QACf,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;QACrC,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,gBAAgB,CAAC;~~IAChD~~,CAAC;IAED,~~gBAAgB~~;~~QACd~~,IAAI,CAAC,cAAc,EAAE,CAAC;~~QACtB~~,IAAI,IAAI,CAAC,~~gBAAgB~~,KAAK,CAAC,CAAC,~~EAAE~~,CAAC;~~YACjC~~,IAAI,CAAC,~~cAAc~~,~~EAAE~~,CAAC;~~QACxB~~,CAAC;IACH,CAAC;IAGD,cAAc,CAAC,aAAqB,EAAE;QACpC,IAAI,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YAC/B,IAAI,CAAC,cAAc,IAAI,UAAU,CAAC;YAClC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,cAAc,EAAE;gBACnD,KAAK,EAAE,GAAG;gBACV,KAAK,EAAE;oBACL,IAAI,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ;oBACpD,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ;iBACtD;aACF,EAAE,KAAK,CAAC,EAAE;gBACT,IAAI,KAAK;oBAAE,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;YAClC,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC;IAED,cAAc;QACZ,IAAI,CAAC,KAAK,GAAG,WAAW,CAAC,GAAG,EAAE;YAC5B,IAAI,IAAI,CAAC,gBAAgB,GAAG,CAAC,EAAE,CAAC;gBAC9B,IAAI,CAAC,gBAAgB,EAAE,CAAC;gBACxB,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC;YAC3B,CAAC;iBAAM,CAAC;gBACN,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;gBAC1B,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;gBACvB,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,CAAC;QACH,CAAC,EAAE,IAAI,CAAC,CAAC;IACX,CAAC;~~IAED~~,~~oBAAoB;QAClB,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC;IAED,~~MAAM;QACJ,OAAO,CACL;YACE,+DAAQ,KAAK,EAAC,oBAAoB,gBAAa,IAAI,CAAC,SAAS;gBAC3D,+DACE,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EACxC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC,GACzB,CACF;~~YACN~~,IAAI,CAAC,gBAAgB,KAAK,CAAC,CAAC,IAAI,4DAAK,KAAK,EAAC,OAAO;gBAChD,IAAI,CAAC,UAAU,IAAI,6DAAM,KAAK,EAAC,kBAAkB,IAAE,IAAI,CAAC,eAAe,CAAQ;gBAC/E,CAAC,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,gBAAgB,IAAI;oBAAO,IAAI,CAAC,gBAAgB;;oBAAG,IAAI,CAAC,gBAAgB,CAAQ,CACtG,~~CACJ~~,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, State, Watch, h } from '@stencil/core';\nimport QRCode from 'qrcode';\n\n@Component({\n tag: 'pn-qr-code-generator',\n styleUrl: 'pn-qr-code-generator.scss'\n})\nexport class QrCodeGenerator {\n @Prop() url: string;\n @Prop() countdownSeconds: number = -1;\n @Prop() outdatedMessage: string;\n @Prop() expiresInMessage: string;\n @Prop() updateCodeEverySecond: boolean = true;\n @Prop() ariaLabel: string;\n\n @State() remainingSeconds: number;\n @State() isOutdated: boolean = false;\n @State() isFullscreen: boolean = false;\n\n private canvasRef: HTMLCanvasElement;\n private timer: any;\n private urlWithSegment: string;\n\n private readonly gray900: string = '#2d2013';\n private readonly blackHex: string = '#000';\n private readonly whiteHex: string = '#fff';\n\n componentWillLoad() {\n this.urlWithSegment = this.url + '#';\n this.remainingSeconds = this.countdownSeconds;\n }\n\n ~~componentDidLoad~~() {\n this.~~generateQRCode~~();\n if (this.~~countdownSeconds~~ !== -1) {\n this.~~startCountdown~~();\n }\n }\n\n @Watch('url')\n generateQRCode(urlSegment: string = '') {\n if (this.url && this.canvasRef) {\n this.urlWithSegment += urlSegment;\n QRCode.toCanvas(this.canvasRef, this.urlWithSegment, {\n width: 200,\n color: {\n dark: this.isOutdated ? this.gray900 : this.blackHex,\n light: this.isOutdated ? this.gray900 : this.whiteHex,\n },\n }, error => {\n if (error) console.error(error);\n });\n }\n }\n\n startCountdown() {\n this.timer = setInterval(() => {\n if (this.remainingSeconds > 0) {\n this.remainingSeconds--;\n this.generateQRCode('p');\n } else {\n clearInterval(this.timer);\n this.isOutdated = true;\n this.generateQRCode();\n }\n }, 1000);\n }\n\n ~~disconnectedCallback() {~~\n ~~clearInterval(this.timer);\n~~ ~~}\n\n~~ render() {\n return (\n <div>\n <button class=\"qr-button__wrapper\" aria-label={this.ariaLabel}>\n <canvas\n class={this.isOutdated ? 'outdated' : ''}\n ref={el => (this.canvasRef = el)}>\n </canvas>\n </button>\n {this.countdownSeconds !== -1 && <div class=\"timer\">\n {this.isOutdated && <span class=\"outdated-message\">{this.outdatedMessage}</span>}\n {!this.isOutdated && this.expiresInMessage && <span>{this.expiresInMessage} {this.remainingSeconds}</span>}\n </div>}\n </div>\n );\n }\n}"]}
1	+ {"version":3,"file":"pn-qr-code-generator.js","sourceRoot":"","sources":["../../../../src/components/widgets/pn-qr-code-generator/pn-qr-code-generator.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, State, Watch, h } from '@stencil/core';\nimport QRCode from 'qrcode';\n\n@Component({\n tag: 'pn-qr-code-generator',\n styleUrl: 'pn-qr-code-generator.scss'\n})\nexport class QrCodeGenerator {\n @Prop() url: string;\n @Prop() countdownSeconds: number = -1;\n @Prop() outdatedMessage: string;\n @Prop() expiresInMessage: string;\n @Prop() updateCodeEverySecond: boolean = true;\n @Prop() ariaLabel: string;\n\n @State() remainingSeconds: number;\n @State() isOutdated: boolean = false;\n @State() isFullscreen: boolean = false;\n\n private canvasRef: HTMLCanvasElement;\n private timer: any;\n private urlWithSegment: string;\n\n private readonly gray900: string = '#2d2013';\n private readonly blackHex: string = '#000';\n private readonly whiteHex: string = '#fff';\n\n connectedCallback() {\n this.isOutdated = false;\n\n if (this.timer == null) {\n this.generateQRCode();\n if (this.countdownSeconds !== -1) {\n\n requestAnimationFrame(() => {\n this.startCountdown();\n });\n }\n }\n }\n\n componentWillLoad() {\n this.urlWithSegment = this.url + '#';\n this.remainingSeconds = this.countdownSeconds;\n if(this.timer != null) {\n this.resetCountdown();\n }\n }\n\n disconnectedCallback() {\n this.resetCountdown();\n }\n\n private resetCountdown() {\n if (this.timer !== null) {\n this.remainingSeconds = this.countdownSeconds;\n clearInterval(this.timer);\n this.timer = null;\n return;\n }\n }\n\n @Watch('url')\n generateQRCode(urlSegment: string = '') {\n if (this.url && this.canvasRef) {\n this.urlWithSegment += urlSegment;\n QRCode.toCanvas(this.canvasRef, this.urlWithSegment, {\n width: 200,\n color: {\n dark: this.isOutdated ? this.gray900 : this.blackHex,\n light: this.isOutdated ? this.gray900 : this.whiteHex,\n },\n }, error => {\n if (error) console.error(error);\n });\n }\n }\n\n startCountdown() {\n this.timer = setInterval(() => {\n if (this.remainingSeconds > 0) {\n this.remainingSeconds--;\n this.generateQRCode('p');\n } else {\n clearInterval(this.timer);\n this.isOutdated = true;\n this.generateQRCode();\n }\n }, 1000);\n }\n\n\n render() {\n return (\n <div>\n <button class=\"qr-button__wrapper\" aria-label={this.ariaLabel}>\n <canvas\n class={this.isOutdated ? 'outdated' : ''}\n ref={el => (this.canvasRef = el)}>\n </canvas>\n </button>\n {this.countdownSeconds !== -1 && <div class=\"timer\">\n {this.isOutdated && <span class=\"outdated-message\">{this.outdatedMessage}</span>}\n {!this.isOutdated && this.expiresInMessage && <span>{this.expiresInMessage} {this.remainingSeconds}</span>}\n </div>}\n </div>\n );\n }\n}"]}

package/components/pn-dropdown-choice-adds-row.js CHANGED Viewed

@@ -21,8 +21,10 @@ const pnDropdownChoiceAddsRow = /*@__PURE__*/ proxyCustomElement(class pnDropdow
         this.rowInputLabel = '';
         this.rowDeleteButtonText = '';
         this.totalInputLimit = 0;
+        this.minimumInputLimit = 0;
         this.inputLimitWarning = null;
         this.inputEmptyWarning = null;
+        this.inputLowError = null;
         this.dropdownEmptyWarning = null;
         this.nextRowIndex = null;
         this.rowSelectDropdownArr = null;
@@ -234,11 +236,11 @@ const pnDropdownChoiceAddsRow = /*@__PURE__*/ proxyCustomElement(class pnDropdow
         const inputElm = document.createElement('pn-input');
         inputElm.setAttribute('type', 'number');
         inputElm.setAttribute('name', `${selectedValue}-input`);
-        inputElm.setAttribute('placeholder', '0');
         if (this.totalInputLimit > 0) {
             inputElm.setAttribute('max', `${this.totalInputLimit}`);
         }
-        inputElm.setAttribute('min', '0');
+        inputElm.setAttribute('min', `${this.minimumInputLimit}`);
+        inputElm.setAttribute('placeholder', `${this.minimumInputLimit}`);
         inputElm.setAttribute('error', '');
         inputColumn.appendChild(inputElm);
         return inputColumn;
@@ -321,6 +323,18 @@ const pnDropdownChoiceAddsRow = /*@__PURE__*/ proxyCustomElement(class pnDropdow
                         inputElem.setAttribute('error', '');
                         showWarning = false;
                     }
+                    if (this.minimumInputLimit > currentValue && inputElem.hasAttribute('min')) {
+                        inputElem.setAttribute('error', `${this.inputLowError || "Amount too low"}`);
+                        showWarning = true;
+                    }
+                    else if (currentValue <= 0 || isNaN(currentValue)) {
+                        inputElem.setAttribute('error', `${this.inputEmptyWarning || "This field cannot be empty"}`);
+                        showWarning = true;
+                    }
+                    else {
+                        inputElem.setAttribute('error', '');
+                        showWarning = false;
+                    }
                 }
             });
         }
@@ -330,7 +344,7 @@ const pnDropdownChoiceAddsRow = /*@__PURE__*/ proxyCustomElement(class pnDropdow
         return true;
     }
     render() {
-        return (h(Host, { key: '4d75a1a804885406d9bf70647ee031b283001316' }, h("div", { key: '4db2eab15b25d322bd8081f22fa0dfb4e40ff1d8', class: "dropdown-choice-form-row" }, h("pn-select", { key: '34479df6fd80391a95628b34a9d3d4007a43700a', ref: el => (this.pnRowSelectDropdown = el), name: this.addRowDropdownName, label: this.addRowDropdownLabel, class: "pn-row-select-dropdown", language: this.languageCode }, h("option", { key: 'c445488973b9c7127a55f0f83cfb46276f3a165e', value: "", selected: true, disabled: true }, this.addRowDropdownPlaceholder), this.rowSelectDropdownArr?.map((value) => h("option", { label: value, value: value }, value)))), h("div", { key: '15abdc5dae3056d3e81069c01e67245aacba5c59', class: "dropdown-choice-form-row" }, h("div", { key: '2386cfc37b14b5769e095596f191054b2fb3e0af', class: "pn-dropdown-choice-table" }, h("div", { key: '123b39e0fc0dba53aa35da0dea41178f77633c76', 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: '8d6e932979cd2065cbf77a70e74e30d087351b24', ref: el => (this.tableBody = el), class: "pn-dropdown-choice-table-slot" }, h("slot", { key: '8957b9b3b30d090c51bc993ff4676f91a2846a15' }))))));
+        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' }))))));
     }
     static get watchers() { return {
         "dropdownData": ["dropdownDataWatcher"]
@@ -349,8 +363,10 @@ const pnDropdownChoiceAddsRow = /*@__PURE__*/ proxyCustomElement(class pnDropdow
         "rowInputLabel": [1, "row-input-label"],
         "rowDeleteButtonText": [1, "row-delete-button-text"],
         "totalInputLimit": [2, "total-input-limit"],
+        "minimumInputLimit": [2, "minimum-input-limit"],
         "inputLimitWarning": [1, "input-limit-warning"],
         "inputEmptyWarning": [1, "input-empty-warning"],
+        "inputLowError": [1, "input-low-error"],
         "dropdownEmptyWarning": [1, "dropdown-empty-warning"],
         "nextRowIndex": [32],
         "rowSelectDropdownArr": [32],

package/components/pn-dropdown-choice-adds-row.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"pn-dropdown-choice-adds-row.js","mappings":"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","names":[],"sources":["src/components/input/pn-dropdown-choice-adds-row/pn-dropdown-choice-adds-row.scss?tag=pn-dropdown-choice-adds-row","src/components/input/pn-dropdown-choice-adds-row/pn-dropdown-choice-adds-row.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-dropdown-choice-adds-row {\n display: block;\n width: 80rem;\n\n .pn-row-select-dropdown {\n width: 50%;\n margin-bottom: 1rem;\n }\n\n @media only screen and (max-width: 640px) {\n .pn-row-select-dropdown {\n width: 100%;\n }\n }\n\n .pn-dropdown-choice-table {\n width: 100%;\n border-spacing: 0rem;\n border: none !important;\n\n thead {\n th {\n text-align: left;\n padding: 1rem 0.5rem;\n\n label {\n color: $gray700;\n font-size: 1.4rem;\n font-weight: 400;\n }\n }\n }\n \n .generated-table-row {\n display: flex;\n margin-bottom: 2rem;\n }\n\n .table-header {\n display: flex;\n margin: 2rem 0 3rem 0;\n font-weight: 500;\n }\n\n .table-header, .tr {\n &-dropdown, &-column, &-name {\n padding-right: 0.5rem;\n width: 35%;\n\n pn-select {\n width: 95%;\n }\n }\n\n &-input {\n width: 15%;\n\n pn-input {\n width: 100%;\n }\n }\n\n &-delete {\n margin: 1rem;\n width: 15%;\n }\n }\n\n tbody {\n td {\n padding: 0.5rem;\n }\n\n tr:nth-child(even) {\n background-color: #effbff;\n }\n\n .tr-delete {\n text-align: center;\n }\n }\n\n tfoot {\n td {\n small {\n color: $warning;\n vertical-align: middle;\n }\n\n pn-icon {\n margin-right: 0.25em;\n vertical-align: middle;\n }\n }\n }\n }\n}\n","import { Component, Prop, h, Element, State, Host, Watch, Event, EventEmitter } from '@stencil/core';\nimport { FormValue, RowValue, Root } from './types';\nimport debounce from 'debounce';\n\n@Component({\n tag: 'pn-dropdown-choice-adds-row',\n styleUrl: 'pn-dropdown-choice-adds-row.scss',\n})\nexport class pnDropdownChoiceAddsRow {\n @Element() hostElement: Element;\n pnRowSelectDropdown: HTMLElement = null;\n tableHead: HTMLElement = null;\n tableBody: HTMLElement = null;\n private _dropdownData: Root[];\n\n @Prop() dropdownData: string \| Root[] = null;\n @Prop() languageCode: string = null;\n @Prop() addRowDropdownName: string = '';\n @Prop() addRowDropdownPlaceholder: string = '';\n @Prop() addRowDropdownLabel: string = '';\n @Prop() rowNameLabel: string = '';\n @Prop() rowHasDropdown: boolean = true;\n @Prop() rowDropdownLabel: string = '';\n @Prop() rowDropdownPlaceholder: string = '';\n @Prop() rowInputLabel: string = '';\n @Prop() rowDeleteButtonText: string = '';\n @Prop() totalInputLimit: number = 0;\n @Prop() inputLimitWarning: string = null;\n @Prop() inputEmptyWarning: string = null;\n @Prop() dropdownEmptyWarning: string = null;\n\n @State() nextRowIndex: number = null;\n @State() rowSelectDropdownArr: string[] = null;\n @State() formValue: string = null;\n\n @Event() rowvalues: EventEmitter<string>;\n\n @Watch('dropdownData')\n dropdownDataWatcher() {\n if (typeof this.dropdownData === 'string') {\n this._dropdownData = JSON.parse(this.dropdownData);\n } else {\n this._dropdownData = this.dropdownData;\n }\n }\n\n componentWillLoad() {\n this.dropdownDataWatcher();\n }\n\n componentDidLoad() {\n this.setInitialValues();\n this.addEventHandlers();\n }\n\n addEventHandlers() {\n this.pnRowSelectDropdown.addEventListener('change', debounce(this.addRowElement.bind(this), 500));\n }\n\n setInitialValues() {\n this.nextRowIndex = 0;\n this.setRowSelectDropdownArr();\n }\n\n setRowSelectDropdownArr() {\n this.rowSelectDropdownArr = [];\n this._dropdownData.forEach(element => {\n this.rowSelectDropdownArr.push(element.label);\n });\n }\n\n formRowEvent = e => {\n const debouncedAddValue = debounce(this.updateHiddenFieldValue.bind(this), 500);\n\n if (e.target.matches('input')) {\n ['change', 'keyup'].forEach(eventName => {\n e.target.addEventListener(eventName, debouncedAddValue);\n });\n } else {\n const rowDropdown = e.target.closest('.generated-table-row')?.querySelector('pn-select') as HTMLElement;\n if (rowDropdown) {\n rowDropdown.addEventListener('change', debouncedAddValue);\n }\n }\n };\n\n updateHiddenFieldValue() {\n try {\n const allRows = [...this.tableBody.querySelectorAll('.generated-table-row')];\n const mainDropdown = this.hostElement.querySelector('.pn-row-select-dropdown');\n\n if (!mainDropdown) {\n return;\n }\n\n if (!allRows.length) {\n mainDropdown.setAttribute('error', `${this.dropdownEmptyWarning \|\| \"This field cannot be empty\"}`);\n this.formValue = '';\n this.rowvalues.emit('');\n return;\n }\n\n let allRowsValid = true;\n const formValues = allRows.map(row => {\n const nameElm = row.querySelector('.tr-name');\n const dropdownElm = row.querySelector('.tr-dropdown');\n const inputElm = row.querySelector('.tr-input');\n\n if (!nameElm \|\| !inputElm) {\n allRowsValid = false;\n return null;\n }\n\n const rowData = {\n row: [\n {\n name: this.rowNameLabel,\n value: nameElm.innerHTML\n }\n ]\n };\n\n if (dropdownElm && dropdownElm.querySelector('pn-select')) {\n const pnSelect = dropdownElm.querySelector('pn-select');\n const nativeSelect = pnSelect?.querySelector('select');\n const dropdownSelection = nativeSelect?.value \|\| '';\n if (!dropdownSelection) {\n allRowsValid = false;\n } else {\n rowData.row.push({\n name: this.rowDropdownLabel,\n value: dropdownSelection\n });\n }\n }\n\n const input = inputElm.querySelector('input');\n const inputValue = parseInt(input?.value \|\| '0', 10);\n if (inputValue > 0) {\n rowData.row.push({\n name: this.rowInputLabel,\n value: inputValue.toString()\n });\n } else {\n allRowsValid = false;\n }\n return rowData;\n });\n\n if (!allRowsValid \|\| !formValues.length \|\| formValues.includes(null)) {\n this.formValue = '';\n this.rowvalues.emit('');\n return;\n }\n\n this.formValue = `PN-JSON\|${JSON.stringify(formValues)}`;\n \n if (this.validateInputs()) {\n this.rowvalues.emit(this.formValue);\n } else {\n this.rowvalues.emit('');\n }\n\n } catch (error) {\n console.error('Error updating field value: ', error);\n this.formValue = '';\n }\n }\n\n addRowElement(e: CustomEvent) {\n const selectedElement = e.target as HTMLSelectElement;\n const selectedValue = selectedElement?.value;\n\n if (!selectedValue) {\n return;\n }\n\n const mainDropdown = this.hostElement.querySelector('.pn-row-select-dropdown');\n mainDropdown?.removeAttribute('error');\n\n if (!this.tableBody) {\n console.error('tableBody is not defined.');\n return;\n }\n\n const newRow = document.createElement('div');\n newRow.setAttribute('index', `${this.nextRowIndex}`);\n newRow.className = 'generated-table-row';\n newRow.onclick = e => this.formRowEvent(e);\n\n const rowNameColumn = document.createElement('div');\n rowNameColumn.className = 'tr-name';\n rowNameColumn.innerHTML = selectedValue;\n rowNameColumn.dataset.name = selectedValue;\n newRow.appendChild(rowNameColumn);\n\n const selectedR = this._dropdownData?.find(item => item.label === selectedValue);\n\n if (selectedR?.values?.length) {\n this.rowHasDropdown = true;\n const dropdownCol = this.createDropdownColumn(selectedValue);\n newRow.appendChild(dropdownCol);\n } else {\n this.rowHasDropdown = false;\n const emptyDropdownCol = document.createElement('div');\n emptyDropdownCol.className = 'tr-column';\n newRow.appendChild(emptyDropdownCol);\n }\n\n const rowInputColumn = this.createInputColumn(selectedValue);\n newRow.appendChild(rowInputColumn);\n\n const deleteButton = this.createDeleteButtonColumn();\n newRow.appendChild(deleteButton);\n\n this.tableBody.appendChild(newRow);\n\n this.updateRowSelectDropdown();\n this.nextRowIndex++;\n selectedElement.value = '';\n }\n\n getCurrentRow(selectedValue: string) {\n return this.hostElement.querySelectorAll(`.tr-name[data-name='${selectedValue}'`);\n }\n\n createDropdownColumn(selectedValue: string) {\n const dropdownColumn = document.createElement('div');\n dropdownColumn.setAttribute('class', 'tr-dropdown');\n const selectedItem = this._dropdownData.find(arr => arr.label === selectedValue);\n const selectedOptionValues = [];\n const currentRow = this.getCurrentRow(selectedValue);\n\n currentRow.forEach(row => {\n selectedOptionValues.push(row.parentElement?.querySelector('.tr-dropdown [aria-selected=true]')?.textContent);\n });\n\n if (selectedItem.values.length) {\n const dropdown = document.createElement('pn-select');\n dropdown.setAttribute('name', `${selectedValue}-dropdown`);\n dropdown.setAttribute('placeholder', this.rowDropdownPlaceholder);\n dropdown.setAttribute('required', 'true');\n dropdown.setAttribute('error', '');\n\n const placeholder = document.createElement('option');\n placeholder.setAttribute(\"value\", \"\");\n placeholder.textContent = this.rowDropdownPlaceholder;\n placeholder.selected = true;\n placeholder.disabled = true;\n dropdown.appendChild(placeholder);\n\n selectedItem.values.forEach(childItem => {\n const childOption = document.createElement('option');\n childOption.setAttribute(\"label\", childItem.label);\n childOption.setAttribute(\"value\", childItem.label);\n childOption.textContent = childItem.label;\n dropdown.appendChild(childOption);\n });\n\n dropdownColumn.appendChild(dropdown);\n }\n\n return dropdownColumn;\n }\n\n createInputColumn(selectedValue: string) {\n const inputColumn = document.createElement('div');\n inputColumn.setAttribute('class', 'tr-input');\n const inputElm = document.createElement('pn-input');\n inputElm.setAttribute('type', 'number');\n inputElm.setAttribute('name', `${selectedValue}-input`);\n inputElm.setAttribute('placeholder', '0');\n if (this.totalInputLimit > 0) {\n inputElm.setAttribute('max', `${this.totalInputLimit}`);\n }\n inputElm.setAttribute('min', '0');\n inputElm.setAttribute('error', '');\n inputColumn.appendChild(inputElm);\n return inputColumn;\n }\n\n createDeleteButtonColumn() {\n const buttonColumn = document.createElement('div');\n buttonColumn.setAttribute('class', 'tr-delete');\n const buttonElm = document.createElement('pn-button');\n buttonElm.onclick = e => this.deleteRow(e);\n buttonElm.setAttribute('appearance', 'warning');\n buttonElm.setAttribute('small', 'true');\n buttonElm.appendChild(document.createTextNode(this.rowDeleteButtonText));\n buttonColumn.appendChild(buttonElm);\n return buttonColumn;\n }\n\n updateRowSelectDropdown() {\n type Row = { rowName: string; selectedValue: string; placeholder: string };\n\n const rows: Row[] = [].map.call(this.tableBody.querySelectorAll('.tr-name'), el => {\n const dropdownColumn = el?.parentElement?.querySelector('.tr-dropdown');\n const dropdownPlaceholder = dropdownColumn?.querySelector('.pn-select-content span')?.textContent;\n const row: Row = {\n rowName: el?.innerHTML,\n selectedValue: dropdownColumn?.querySelector('[aria-selected=true]')?.textContent,\n placeholder: dropdownPlaceholder,\n };\n return row;\n });\n\n const selectOptions = this.pnRowSelectDropdown.querySelectorAll('option');\n selectOptions.forEach(elm => {\n elm.removeAttribute('selected');\n });\n }\n\n deleteRow(e: Event) {\n e.preventDefault();\n this.nextRowIndex--;\n const targetElm = e.currentTarget as HTMLButtonElement;\n const targetRow = targetElm.closest('.generated-table-row');\n targetRow.remove();\n const allRows = [...this.tableBody.querySelectorAll('.generated-table-row')];\n\n allRows.map((elm, index) => {\n elm.setAttribute('index', `${index}`);\n });\n this.updateHiddenFieldValue()\n this.updateRowSelectDropdown();\n }\n\n validateInputs() {\n const dropdownSelections = this.tableBody.querySelectorAll('pn-select');\n const numberInputs = this.tableBody.querySelectorAll('pn-input');\n let selectionEmpty = false;\n let showWarning = false;\n\n if (dropdownSelections) {\n dropdownSelections.forEach(dropdownElem => {\n if (!dropdownElem) {\n return;\n }\n\n const selection = dropdownElem.querySelector('select');\n const dropdownVal = selection?.value \|\| '';\n\n if (dropdownVal === null \|\| dropdownVal === \"\") {\n dropdownElem.setAttribute('error', `${this.dropdownEmptyWarning \|\| \"This field cannot be empty\"}`);\n selectionEmpty = true;\n } else {\n dropdownElem.setAttribute('error', '');\n }\n });\n }\n\n if (numberInputs) {\n numberInputs.forEach(inputElem => {\n if (inputElem) {\n const currentNumber = inputElem.querySelector(\"input\");\n let currentValue = parseInt(currentNumber.value);\n\n if (this.totalInputLimit < currentValue && inputElem.hasAttribute('max')) {\n inputElem.setAttribute('error', `${this.inputLimitWarning \|\| \"Amount too high\"}`);\n showWarning = true;\n } else if (currentValue <= 0 \|\| isNaN(currentValue)) {\n inputElem.setAttribute('error', `${this.inputEmptyWarning \|\| \"This field cannot be empty\"}`);\n showWarning = true;\n } else {\n inputElem.setAttribute('error', '');\n showWarning = false;\n }\n }\n });\n }\n\n if (selectionEmpty \|\| showWarning) {\n return false;\n }\n\n return true;\n }\n\n render() {\n return (\n <Host>\n <div class=\"dropdown-choice-form-row\">\n <pn-select\n ref={el => (this.pnRowSelectDropdown = el as HTMLElement)}\n name={this.addRowDropdownName}\n label={this.addRowDropdownLabel}\n class=\"pn-row-select-dropdown\"\n language={this.languageCode}>\n <option value=\"\" selected disabled>{this.addRowDropdownPlaceholder}</option>\n {this.rowSelectDropdownArr?.map((value: string) => <option label={value} value={value}>{value}</option>)}\n </pn-select>\n </div>\n <div class=\"dropdown-choice-form-row\">\n <div class=\"pn-dropdown-choice-table\">\n <div ref={el => (this.tableHead = el as HTMLElement)}>\n {this.nextRowIndex === 0 ? null : (\n <div class=\"table-header\">\n <div class=\"table-header-name\">\n <label>{this.rowNameLabel}</label>\n </div>\n <div class=\"table-header-dropdown\">\n <label>{this.rowDropdownLabel}</label>\n </div>\n <div class=\"table-header-input\">\n <label>{this.rowInputLabel}</label>\n </div>\n <div class=\"table-header-delete\"></div>\n </div>\n )}\n </div>\n <div ref={el => (this.tableBody = el as HTMLElement)} class=\"pn-dropdown-choice-table-slot\">\n <slot></slot>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"pn-dropdown-choice-adds-row.js","mappings":"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","names":[],"sources":["src/components/input/pn-dropdown-choice-adds-row/pn-dropdown-choice-adds-row.scss?tag=pn-dropdown-choice-adds-row","src/components/input/pn-dropdown-choice-adds-row/pn-dropdown-choice-adds-row.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-dropdown-choice-adds-row {\n display: block;\n width: 80rem;\n\n .pn-row-select-dropdown {\n width: 50%;\n margin-bottom: 1rem;\n }\n\n @media only screen and (max-width: 640px) {\n .pn-row-select-dropdown {\n width: 100%;\n }\n }\n\n .pn-dropdown-choice-table {\n width: 100%;\n border-spacing: 0rem;\n border: none !important;\n\n thead {\n th {\n text-align: left;\n padding: 1rem 0.5rem;\n\n label {\n color: $gray700;\n font-size: 1.4rem;\n font-weight: 400;\n }\n }\n }\n \n .generated-table-row {\n display: flex;\n margin-bottom: 2rem;\n }\n\n .table-header {\n display: flex;\n margin: 2rem 0 3rem 0;\n font-weight: 500;\n }\n\n .table-header, .tr {\n &-dropdown, &-column, &-name {\n padding-right: 0.5rem;\n width: 35%;\n\n pn-select {\n width: 95%;\n }\n }\n\n &-input {\n width: 15%;\n\n pn-input {\n width: 100%;\n }\n }\n\n &-delete {\n margin: 1rem;\n width: 15%;\n }\n }\n\n tbody {\n td {\n padding: 0.5rem;\n }\n\n tr:nth-child(even) {\n background-color: #effbff;\n }\n\n .tr-delete {\n text-align: center;\n }\n }\n\n tfoot {\n td {\n small {\n color: $warning;\n vertical-align: middle;\n }\n\n pn-icon {\n margin-right: 0.25em;\n vertical-align: middle;\n }\n }\n }\n }\n}\n","import { Component, Prop, h, Element, State, Host, Watch, Event, EventEmitter } from '@stencil/core';\nimport { FormValue, RowValue, Root } from './types';\nimport debounce from 'debounce';\n\n@Component({\n tag: 'pn-dropdown-choice-adds-row',\n styleUrl: 'pn-dropdown-choice-adds-row.scss',\n})\nexport class pnDropdownChoiceAddsRow {\n @Element() hostElement: Element;\n pnRowSelectDropdown: HTMLElement = null;\n tableHead: HTMLElement = null;\n tableBody: HTMLElement = null;\n private _dropdownData: Root[];\n\n @Prop() dropdownData: string \| Root[] = null;\n @Prop() languageCode: string = null;\n @Prop() addRowDropdownName: string = '';\n @Prop() addRowDropdownPlaceholder: string = '';\n @Prop() addRowDropdownLabel: string = '';\n @Prop() rowNameLabel: string = '';\n @Prop() rowHasDropdown: boolean = true;\n @Prop() rowDropdownLabel: string = '';\n @Prop() rowDropdownPlaceholder: string = '';\n @Prop() rowInputLabel: string = '';\n @Prop() rowDeleteButtonText: string = '';\n @Prop() totalInputLimit: number = 0;\n @Prop() minimumInputLimit: number = 0;\n @Prop() inputLimitWarning: string = null;\n @Prop() inputEmptyWarning: string = null;\n @Prop() inputLowError: string = null;\n @Prop() dropdownEmptyWarning: string = null;\n\n @State() nextRowIndex: number = null;\n @State() rowSelectDropdownArr: string[] = null;\n @State() formValue: string = null;\n\n @Event() rowvalues: EventEmitter<string>;\n\n @Watch('dropdownData')\n dropdownDataWatcher() {\n if (typeof this.dropdownData === 'string') {\n this._dropdownData = JSON.parse(this.dropdownData);\n } else {\n this._dropdownData = this.dropdownData;\n }\n }\n\n componentWillLoad() {\n this.dropdownDataWatcher();\n }\n\n componentDidLoad() {\n this.setInitialValues();\n this.addEventHandlers();\n }\n\n addEventHandlers() {\n this.pnRowSelectDropdown.addEventListener('change', debounce(this.addRowElement.bind(this), 500));\n }\n\n setInitialValues() {\n this.nextRowIndex = 0;\n this.setRowSelectDropdownArr();\n }\n\n setRowSelectDropdownArr() {\n this.rowSelectDropdownArr = [];\n this._dropdownData.forEach(element => {\n this.rowSelectDropdownArr.push(element.label);\n });\n }\n\n formRowEvent = e => {\n const debouncedAddValue = debounce(this.updateHiddenFieldValue.bind(this), 500);\n\n if (e.target.matches('input')) {\n ['change', 'keyup'].forEach(eventName => {\n e.target.addEventListener(eventName, debouncedAddValue);\n });\n } else {\n const rowDropdown = e.target.closest('.generated-table-row')?.querySelector('pn-select') as HTMLElement;\n if (rowDropdown) {\n rowDropdown.addEventListener('change', debouncedAddValue);\n }\n }\n };\n\n updateHiddenFieldValue() {\n try {\n const allRows = [...this.tableBody.querySelectorAll('.generated-table-row')];\n const mainDropdown = this.hostElement.querySelector('.pn-row-select-dropdown');\n\n if (!mainDropdown) {\n return;\n }\n\n if (!allRows.length) {\n mainDropdown.setAttribute('error', `${this.dropdownEmptyWarning \|\| \"This field cannot be empty\"}`);\n this.formValue = '';\n this.rowvalues.emit('');\n return;\n }\n\n let allRowsValid = true;\n const formValues = allRows.map(row => {\n const nameElm = row.querySelector('.tr-name');\n const dropdownElm = row.querySelector('.tr-dropdown');\n const inputElm = row.querySelector('.tr-input');\n\n if (!nameElm \|\| !inputElm) {\n allRowsValid = false;\n return null;\n }\n\n const rowData = {\n row: [\n {\n name: this.rowNameLabel,\n value: nameElm.innerHTML\n }\n ]\n };\n\n if (dropdownElm && dropdownElm.querySelector('pn-select')) {\n const pnSelect = dropdownElm.querySelector('pn-select');\n const nativeSelect = pnSelect?.querySelector('select');\n const dropdownSelection = nativeSelect?.value \|\| '';\n if (!dropdownSelection) {\n allRowsValid = false;\n } else {\n rowData.row.push({\n name: this.rowDropdownLabel,\n value: dropdownSelection\n });\n }\n }\n\n const input = inputElm.querySelector('input');\n const inputValue = parseInt(input?.value \|\| '0', 10);\n if (inputValue > 0) {\n rowData.row.push({\n name: this.rowInputLabel,\n value: inputValue.toString()\n });\n } else {\n allRowsValid = false;\n }\n return rowData;\n });\n\n if (!allRowsValid \|\| !formValues.length \|\| formValues.includes(null)) {\n this.formValue = '';\n this.rowvalues.emit('');\n return;\n }\n\n this.formValue = `PN-JSON\|${JSON.stringify(formValues)}`;\n \n if (this.validateInputs()) {\n this.rowvalues.emit(this.formValue);\n } else {\n this.rowvalues.emit('');\n }\n\n } catch (error) {\n console.error('Error updating field value: ', error);\n this.formValue = '';\n }\n }\n\n addRowElement(e: CustomEvent) {\n const selectedElement = e.target as HTMLSelectElement;\n const selectedValue = selectedElement?.value;\n\n if (!selectedValue) {\n return;\n }\n\n const mainDropdown = this.hostElement.querySelector('.pn-row-select-dropdown');\n mainDropdown?.removeAttribute('error');\n\n if (!this.tableBody) {\n console.error('tableBody is not defined.');\n return;\n }\n\n const newRow = document.createElement('div');\n newRow.setAttribute('index', `${this.nextRowIndex}`);\n newRow.className = 'generated-table-row';\n newRow.onclick = e => this.formRowEvent(e);\n\n const rowNameColumn = document.createElement('div');\n rowNameColumn.className = 'tr-name';\n rowNameColumn.innerHTML = selectedValue;\n rowNameColumn.dataset.name = selectedValue;\n newRow.appendChild(rowNameColumn);\n\n const selectedR = this._dropdownData?.find(item => item.label === selectedValue);\n\n if (selectedR?.values?.length) {\n this.rowHasDropdown = true;\n const dropdownCol = this.createDropdownColumn(selectedValue);\n newRow.appendChild(dropdownCol);\n } else {\n this.rowHasDropdown = false;\n const emptyDropdownCol = document.createElement('div');\n emptyDropdownCol.className = 'tr-column';\n newRow.appendChild(emptyDropdownCol);\n }\n\n const rowInputColumn = this.createInputColumn(selectedValue);\n newRow.appendChild(rowInputColumn);\n\n const deleteButton = this.createDeleteButtonColumn();\n newRow.appendChild(deleteButton);\n\n this.tableBody.appendChild(newRow);\n\n this.updateRowSelectDropdown();\n this.nextRowIndex++;\n selectedElement.value = '';\n }\n\n getCurrentRow(selectedValue: string) {\n return this.hostElement.querySelectorAll(`.tr-name[data-name='${selectedValue}'`);\n }\n\n createDropdownColumn(selectedValue: string) {\n const dropdownColumn = document.createElement('div');\n dropdownColumn.setAttribute('class', 'tr-dropdown');\n const selectedItem = this._dropdownData.find(arr => arr.label === selectedValue);\n const selectedOptionValues = [];\n const currentRow = this.getCurrentRow(selectedValue);\n\n currentRow.forEach(row => {\n selectedOptionValues.push(row.parentElement?.querySelector('.tr-dropdown [aria-selected=true]')?.textContent);\n });\n\n if (selectedItem.values.length) {\n const dropdown = document.createElement('pn-select');\n dropdown.setAttribute('name', `${selectedValue}-dropdown`);\n dropdown.setAttribute('placeholder', this.rowDropdownPlaceholder);\n dropdown.setAttribute('required', 'true');\n dropdown.setAttribute('error', '');\n\n const placeholder = document.createElement('option');\n placeholder.setAttribute(\"value\", \"\");\n placeholder.textContent = this.rowDropdownPlaceholder;\n placeholder.selected = true;\n placeholder.disabled = true;\n dropdown.appendChild(placeholder);\n\n selectedItem.values.forEach(childItem => {\n const childOption = document.createElement('option');\n childOption.setAttribute(\"label\", childItem.label);\n childOption.setAttribute(\"value\", childItem.label);\n childOption.textContent = childItem.label;\n dropdown.appendChild(childOption);\n });\n\n dropdownColumn.appendChild(dropdown);\n }\n\n return dropdownColumn;\n }\n\n createInputColumn(selectedValue: string) {\n const inputColumn = document.createElement('div');\n inputColumn.setAttribute('class', 'tr-input');\n const inputElm = document.createElement('pn-input');\n inputElm.setAttribute('type', 'number');\n inputElm.setAttribute('name', `${selectedValue}-input`);\n if (this.totalInputLimit > 0) {\n inputElm.setAttribute('max', `${this.totalInputLimit}`);\n }\n inputElm.setAttribute('min', `${this.minimumInputLimit}`);\n inputElm.setAttribute('placeholder', `${this.minimumInputLimit}`);\n inputElm.setAttribute('error', '');\n inputColumn.appendChild(inputElm);\n return inputColumn;\n }\n\n createDeleteButtonColumn() {\n const buttonColumn = document.createElement('div');\n buttonColumn.setAttribute('class', 'tr-delete');\n const buttonElm = document.createElement('pn-button');\n buttonElm.onclick = e => this.deleteRow(e);\n buttonElm.setAttribute('appearance', 'warning');\n buttonElm.setAttribute('small', 'true');\n buttonElm.appendChild(document.createTextNode(this.rowDeleteButtonText));\n buttonColumn.appendChild(buttonElm);\n return buttonColumn;\n }\n\n updateRowSelectDropdown() {\n type Row = { rowName: string; selectedValue: string; placeholder: string };\n\n const rows: Row[] = [].map.call(this.tableBody.querySelectorAll('.tr-name'), el => {\n const dropdownColumn = el?.parentElement?.querySelector('.tr-dropdown');\n const dropdownPlaceholder = dropdownColumn?.querySelector('.pn-select-content span')?.textContent;\n const row: Row = {\n rowName: el?.innerHTML,\n selectedValue: dropdownColumn?.querySelector('[aria-selected=true]')?.textContent,\n placeholder: dropdownPlaceholder,\n };\n return row;\n });\n\n const selectOptions = this.pnRowSelectDropdown.querySelectorAll('option');\n selectOptions.forEach(elm => {\n elm.removeAttribute('selected');\n });\n }\n\n deleteRow(e: Event) {\n e.preventDefault();\n this.nextRowIndex--;\n const targetElm = e.currentTarget as HTMLButtonElement;\n const targetRow = targetElm.closest('.generated-table-row');\n targetRow.remove();\n const allRows = [...this.tableBody.querySelectorAll('.generated-table-row')];\n\n allRows.map((elm, index) => {\n elm.setAttribute('index', `${index}`);\n });\n this.updateHiddenFieldValue()\n this.updateRowSelectDropdown();\n }\n\n validateInputs() {\n const dropdownSelections = this.tableBody.querySelectorAll('pn-select');\n const numberInputs = this.tableBody.querySelectorAll('pn-input');\n let selectionEmpty = false;\n let showWarning = false;\n\n if (dropdownSelections) {\n dropdownSelections.forEach(dropdownElem => {\n if (!dropdownElem) {\n return;\n }\n\n const selection = dropdownElem.querySelector('select');\n const dropdownVal = selection?.value \|\| '';\n\n if (dropdownVal === null \|\| dropdownVal === \"\") {\n dropdownElem.setAttribute('error', `${this.dropdownEmptyWarning \|\| \"This field cannot be empty\"}`);\n selectionEmpty = true;\n } else {\n dropdownElem.setAttribute('error', '');\n }\n });\n }\n\n if (numberInputs) {\n numberInputs.forEach(inputElem => {\n if (inputElem) {\n const currentNumber = inputElem.querySelector(\"input\");\n let currentValue = parseInt(currentNumber.value);\n\n if (this.totalInputLimit < currentValue && inputElem.hasAttribute('max')) {\n inputElem.setAttribute('error', `${this.inputLimitWarning \|\| \"Amount too high\"}`);\n showWarning = true;\n } else if (currentValue <= 0 \|\| isNaN(currentValue)) {\n inputElem.setAttribute('error', `${this.inputEmptyWarning \|\| \"This field cannot be empty\"}`);\n showWarning = true;\n } else {\n inputElem.setAttribute('error', '');\n showWarning = false;\n }\n\n if (this.minimumInputLimit > currentValue && inputElem.hasAttribute('min')) {\n inputElem.setAttribute('error', `${this.inputLowError \|\| \"Amount too low\"}`);\n showWarning = true;\n } else if (currentValue <= 0 \|\| isNaN(currentValue)) {\n inputElem.setAttribute('error', `${this.inputEmptyWarning \|\| \"This field cannot be empty\"}`);\n showWarning = true;\n }\n else {\n inputElem.setAttribute('error', '');\n showWarning = false;\n }\n }\n });\n }\n\n if (selectionEmpty \|\| showWarning) {\n return false;\n }\n\n return true;\n }\n\n render() {\n return (\n <Host>\n <div class=\"dropdown-choice-form-row\">\n <pn-select\n ref={el => (this.pnRowSelectDropdown = el as HTMLElement)}\n name={this.addRowDropdownName}\n label={this.addRowDropdownLabel}\n class=\"pn-row-select-dropdown\"\n language={this.languageCode}>\n <option value=\"\" selected disabled>{this.addRowDropdownPlaceholder}</option>\n {this.rowSelectDropdownArr?.map((value: string) => <option label={value} value={value}>{value}</option>)}\n </pn-select>\n </div>\n <div class=\"dropdown-choice-form-row\">\n <div class=\"pn-dropdown-choice-table\">\n <div ref={el => (this.tableHead = el as HTMLElement)}>\n {this.nextRowIndex === 0 ? null : (\n <div class=\"table-header\">\n <div class=\"table-header-name\">\n <label>{this.rowNameLabel}</label>\n </div>\n <div class=\"table-header-dropdown\">\n <label>{this.rowDropdownLabel}</label>\n </div>\n <div class=\"table-header-input\">\n <label>{this.rowInputLabel}</label>\n </div>\n <div class=\"table-header-delete\"></div>\n </div>\n )}\n </div>\n <div ref={el => (this.tableBody = el as HTMLElement)} class=\"pn-dropdown-choice-table-slot\">\n <slot></slot>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}