@postnord/pn-marketweb-components 3.0.3 → 3.1.0

package/esm/pn-dropdown-choice-adds-row.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, d as Host, g as getElement } from './index-fa51bde4.js';
+import { r as registerInstance, c as createEvent, g as getElement, h, d as Host } from './index-fa51bde4.js';
 import { d as debounce } from './index-1093ae90.js';
 import { a as alert_exclamation_circle } from './alert_exclamation_circle-f0fe7c7b.js';
 
@@ -9,25 +9,8 @@ const pnDropdownChoiceAddsRow = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
         this.rowvalues = createEvent(this, "rowvalues", 7);
-        this.pnRowSelectDropdown = null;
-        this.tableHead = null;
-        this.tableBody = null;
-        this.formRowEvent = e => {
-            var _a;
-            const debouncedAddValue = debounce(this.updateHiddenFieldValue.bind(this), 500);
-            if (e.target.matches('input')) {
-                ['change', 'keyup'].forEach(eventName => {
-                    e.target.addEventListener(eventName, debouncedAddValue);
-                });
-            }
-            else {
-                const rowDropdown = (_a = e.target.closest('.generated-table-row')) === null || _a === void 0 ? void 0 : _a.querySelector('pn-select');
-                if (rowDropdown) {
-                    rowDropdown.addEventListener('selectOption', debouncedAddValue);
-                }
-            }
-        };
         this.dropdownData = null;
+        this.languageCode = null;
         this.addRowDropdownName = '';
         this.addRowDropdownPlaceholder = '';
         this.addRowDropdownLabel = '';
@@ -45,6 +28,12 @@ const pnDropdownChoiceAddsRow = class {
         this.showWarning = false;
         this.formValue = null;
     }
+    get hostElement() { return getElement(this); }
+    pnRowSelectDropdown = null;
+    tableHead = null;
+    tableBody = null;
+    _dropdownData;
+    rowvalues;
     dropdownDataWatcher() {
         if (typeof this.dropdownData === 'string') {
             this._dropdownData = JSON.parse(this.dropdownData);
@@ -74,22 +63,35 @@ const pnDropdownChoiceAddsRow = class {
             this.rowSelectDropdownArr.push(element.label);
         });
     }
+    formRowEvent = e => {
+        const debouncedAddValue = debounce(this.updateHiddenFieldValue.bind(this), 500);
+        if (e.target.matches('input')) {
+            ['change', 'keyup'].forEach(eventName => {
+                e.target.addEventListener(eventName, debouncedAddValue);
+            });
+        }
+        else {
+            const rowDropdown = e.target.closest('.generated-table-row')?.querySelector('pn-select');
+            if (rowDropdown) {
+                rowDropdown.addEventListener('selectOption', debouncedAddValue);
+            }
+        }
+    };
     updateHiddenFieldValue() {
         const allRows = [...this.tableBody.querySelectorAll('tr')];
         const columnValueCount = this.rowHasDropdown ? 3 : 2;
         const formValues = [];
         if (allRows.length) {
             allRows.forEach(elm => {
-                var _a, _b, _c;
                 const row = { row: [] };
                 const nameElm = elm.querySelector('.tr-name');
                 const dropdownElm = elm.querySelector('.tr-dropdown');
                 const inputElm = elm.querySelector('.tr-input');
-                const nameValue = { name: this.rowNameLabel, value: nameElm === null || nameElm === void 0 ? void 0 : nameElm.innerHTML };
+                const nameValue = { name: this.rowNameLabel, value: nameElm?.innerHTML };
                 row.row.push(nameValue);
                 const dropdown = dropdownElm.querySelector('.current-selection');
                 if (dropdown) {
-                    const dropdownSelection = (_a = dropdown.textContent) !== null && _a !== void 0 ? _a : '';
+                    const dropdownSelection = dropdown.textContent ?? '';
                     if (dropdownSelection.length) {
                         const dropdownValue = {
                             name: this.rowDropdownLabel,
@@ -105,7 +107,7 @@ const pnDropdownChoiceAddsRow = class {
                     };
                     row.row.push(dropdownValue);
                 }
-                const inputValue = parseInt((_c = (_b = inputElm.querySelector('input')) === null || _b === void 0 ? void 0 : _b.value) !== null && _c !== void 0 ? _c : '0');
+                const inputValue = parseInt(inputElm.querySelector('input')?.value ?? '0');
                 if (inputValue > 0) {
                     const inputColumnValue = { name: this.rowInputLabel, value: inputValue.toString() };
                     row.row.push(inputColumnValue);
@@ -127,7 +129,7 @@ const pnDropdownChoiceAddsRow = class {
     }
     addRowElement() {
         const selected = this.pnRowSelectDropdown.querySelector('[aria-selected=true]');
-        const selectedValue = selected === null || selected === void 0 ? void 0 : selected.textContent;
+        const selectedValue = selected?.textContent;
         const slotElm = this.tableBody;
         const newRow = document.createElement('tr');
         newRow.setAttribute('index', `${this.nextRowIndex}`);
@@ -160,14 +162,13 @@ const pnDropdownChoiceAddsRow = class {
         const selectedOptionValues = [];
         const currentRow = this.getCurrentRow(selectedValue);
         currentRow.forEach(row => {
-            var _a, _b;
-            selectedOptionValues.push((_b = (_a = row.parentElement) === null || _a === void 0 ? void 0 : _a.querySelector('.tr-dropdown [aria-selected=true]')) === null || _b === void 0 ? void 0 : _b.textContent);
+            selectedOptionValues.push(row.parentElement?.querySelector('.tr-dropdown [aria-selected=true]')?.textContent);
         });
         if (Array.isArray(selectedItem.values) && selectedItem.values.length) {
             const dropdown = document.createElement('pn-select');
             dropdown.setAttribute('name', `${selectedValue}-dropdown`);
             dropdown.setAttribute('placeholder', this.rowDropdownPlaceholder);
-            const filtereredValues = selectedItem.values.filter(item => !(selectedOptionValues === null || selectedOptionValues === void 0 ? void 0 : selectedOptionValues.includes(item.value)));
+            const filtereredValues = selectedItem.values.filter(item => !selectedOptionValues?.includes(item.value));
             filtereredValues.forEach(childItem => {
                 const childOption = document.createElement('pn-option');
                 childOption.setAttribute("label", childItem.label);
@@ -201,12 +202,11 @@ const pnDropdownChoiceAddsRow = class {
     }
     updateRowSelectDropdown() {
         const rows = [].map.call(this.tableBody.querySelectorAll('.tr-name'), el => {
-            var _a, _b, _c;
-            const dropdownColumn = (_a = el === null || el === void 0 ? void 0 : el.parentElement) === null || _a === void 0 ? void 0 : _a.querySelector('.tr-dropdown');
-            const dropdownPlaceholder = (_b = dropdownColumn === null || dropdownColumn === void 0 ? void 0 : dropdownColumn.querySelector('.pn-select-content span')) === null || _b === void 0 ? void 0 : _b.textContent;
+            const dropdownColumn = el?.parentElement?.querySelector('.tr-dropdown');
+            const dropdownPlaceholder = dropdownColumn?.querySelector('.pn-select-content span')?.textContent;
             const row = {
-                rowName: el === null || el === void 0 ? void 0 : el.innerHTML,
-                selectedValue: (_c = dropdownColumn === null || dropdownColumn === void 0 ? void 0 : dropdownColumn.querySelector('[aria-selected=true]')) === null || _c === void 0 ? void 0 : _c.textContent,
+                rowName: el?.innerHTML,
+                selectedValue: dropdownColumn?.querySelector('[aria-selected=true]')?.textContent,
                 placeholder: dropdownPlaceholder,
             };
             return row;
@@ -252,19 +252,16 @@ const pnDropdownChoiceAddsRow = class {
         }
         let totalInput = 0;
         allRows.forEach(element => {
-            var _a;
             const inputField = element.querySelector('pn-marketweb-input');
             if (inputField.value) {
-                totalInput += (_a = parseInt(inputField.value)) !== null && _a !== void 0 ? _a : 0;
+                totalInput += parseInt(inputField.value) ?? 0;
             }
         });
         this.showWarning = totalInput > this.totalInputLimit ? true : false;
     }
     render() {
-        var _a;
-        return (h(Host, { key: 'e42637fdfbc059fe081da8fb8af2a2469f357d15' }, h("div", { key: 'da4240a50ed0be9b937bbcb998ca26569c1ffd8c', class: "dropdown-choice-form-row" }, h("pn-select", { key: '7b57bbef46778d4ce63b937e80b2df10501e36c5', ref: el => (this.pnRowSelectDropdown = el), name: this.addRowDropdownName, placeholder: this.addRowDropdownPlaceholder, label: this.addRowDropdownLabel, class: "pn-row-select-dropdown", "empty-option": "true" }, (_a = this.rowSelectDropdownArr) === null || _a === void 0 ? void 0 : _a.map((value) => h("pn-option", { label: value, value: value })))), h("div", { key: 'ae290b0a39886fead6a6cf6cff9e7ff0329b0cf2', class: "dropdown-choice-form-row" }, h("table", { key: '1fac0a253d5ea42876bda4a32dd43db1223bd650', class: "pn-dropdown-choice-table" }, h("thead", { key: 'dc119ee9a215b433e480d3ace1a04fc4c093fe5a', ref: el => (this.tableHead = el) }, this.nextRowIndex === 0 ? null : (h("tr", null, h("th", { class: "table-header--name" }, h("label", null, this.rowNameLabel)), this.rowHasDropdown ? (h("th", { class: "table-header--dropdown" }, h("label", null, this.rowDropdownLabel))) : null, h("th", { class: "table-header--input" }, h("label", null, this.rowInputLabel)), h("th", { class: "table-header--delete" })))), h("tbody", { key: '334d8505ff7214e80cf26ae638134b8efedf1c6e', ref: el => (this.tableBody = el), class: "pn-dropdown-choice-table-slot" }, h("slot", { key: '40463ee8d5959bb3c2fbf10d7256883699eaf5ca' })), h("tfoot", { key: '8bc7637282d2e5656096233a7b431ae6d9961972' }, this.showWarning ? (h("tr", null, h("td", { colSpan: this.columnCount }, h("pn-icon", { icon: alert_exclamation_circle, small: true, color: "warning" }), h("small", { class: "dropdown-choice-error-message" }, this.inputLimitWarning)))) : null)))));
+        return (h(Host, { key: 'a89919e962a274e3ad61e52821081cb3cc30e7d2' }, h("div", { key: 'a0c2b1338c64590db11bcdb550993dbecef5d3bb', class: "dropdown-choice-form-row" }, h("pn-select", { key: '3907fa6ea69ccb68462626a06804c5b72b6c44d8', ref: el => (this.pnRowSelectDropdown = el), name: this.addRowDropdownName, placeholder: this.addRowDropdownPlaceholder, label: this.addRowDropdownLabel, class: "pn-row-select-dropdown", "empty-option": "true", language: this.languageCode }, this.rowSelectDropdownArr?.map((value) => h("pn-option", { label: value, value: value })))), h("div", { key: '85b44d5c44bf07ad9a775f052929b32803725e77', class: "dropdown-choice-form-row" }, h("table", { key: '4910bda32683fd621c9d78f3a24a206bb7f079a5', class: "pn-dropdown-choice-table" }, h("thead", { key: '7dea2804e6a1a1cb40be105a65cc3368e1e17ba6', ref: el => (this.tableHead = el) }, this.nextRowIndex === 0 ? null : (h("tr", null, h("th", { class: "table-header--name" }, h("label", null, this.rowNameLabel)), this.rowHasDropdown ? (h("th", { class: "table-header--dropdown" }, h("label", null, this.rowDropdownLabel))) : null, h("th", { class: "table-header--input" }, h("label", null, this.rowInputLabel)), h("th", { class: "table-header--delete" })))), h("tbody", { key: '71b7e0e23703179e3d922ad0045e9a0264b3253a', ref: el => (this.tableBody = el), class: "pn-dropdown-choice-table-slot" }, h("slot", { key: '93b5dd3bfc2907bef2c68a48b4e8364088196f8b' })), h("tfoot", { key: '403dbbc82f349d5e3ece295f36ccc3e6242a968c' }, this.showWarning ? (h("tr", null, h("td", { colSpan: this.columnCount }, h("pn-icon", { icon: alert_exclamation_circle, small: true, color: "warning" }), h("small", { class: "dropdown-choice-error-message" }, this.inputLimitWarning)))) : null)))));
     }
-    get hostElement() { return getElement(this); }
     static get watchers() { return {
         "dropdownData": ["dropdownDataWatcher"]
     }; }

package/esm/pn-dropdown-choice-adds-row.entry.js.map

@@ -1 +1 @@
-{"file":"pn-dropdown-choice-adds-row.entry.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  gap: 1rem;\n\n  .dropdown-choice-form-row {\n    display: flex;\n    gap: 1rem;\n  }\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\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      .table-header {\n        &--name {\n          width: 40%;\n        }\n\n        &--dropdown {\n          width: 40%;\n        }\n\n        &--input {\n          width: 10%;\n        }\n\n        &--delete {\n          width: 10%;\n        }\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';\nimport { alert_exclamation_circle } from 'pn-design-assets/pn-assets/icons.js';\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() 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\n  @State() nextRowIndex: number = null;\n  @State() rowSelectDropdownArr: string[] = null;\n  @State() columnCount: number = null;\n  @State() showWarning: boolean = false;\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('selectOption', debounce(this.addRowElement.bind(this), 500));\n  }\n\n  setInitialValues() {\n    this.nextRowIndex = 0;\n    this.columnCount = this.rowHasDropdown ? 4 : 3;\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('selectOption', debouncedAddValue);\n      }\n    }\n  };\n\n  updateHiddenFieldValue() {\n    const allRows = [...this.tableBody.querySelectorAll('tr')];\n    const columnValueCount = this.rowHasDropdown ? 3 : 2;\n    const formValues: FormValue[] = [];\n\n    if (allRows.length) {\n      allRows.forEach(elm => {\n        const row: FormValue = { row: [] };\n        const nameElm = elm.querySelector('.tr-name');\n        const dropdownElm = elm.querySelector('.tr-dropdown');\n        const inputElm = elm.querySelector('.tr-input');\n\n        const nameValue: RowValue = { name: this.rowNameLabel, value: nameElm?.innerHTML };\n        row.row.push(nameValue);\n\n        const dropdown = dropdownElm.querySelector('.current-selection');\n        if (dropdown) {\n          const dropdownSelection = dropdown.textContent ?? '';\n\n          if (dropdownSelection.length) {\n            const dropdownValue: RowValue = {\n              name: this.rowDropdownLabel,\n              value: dropdownSelection,\n            };\n            row.row.push(dropdownValue);\n          }\n        }\n        if (!dropdown && columnValueCount === 3) {\n          const dropdownValue: RowValue = {\n            name: this.rowDropdownLabel,\n            value: '',\n          };\n          row.row.push(dropdownValue);\n        }\n\n        const inputValue = parseInt(inputElm.querySelector('input')?.value ?? '0');\n        if (inputValue > 0) {\n          const inputColumnValue: RowValue = { name: this.rowInputLabel, value: inputValue.toString() };\n          row.row.push(inputColumnValue);\n        }\n\n        if (row.row.length === columnValueCount) {\n          formValues.push(row);\n        }\n      });\n    }\n\n    if (formValues.length && formValues.length === allRows.length) {\n      const valueJsonString = JSON.stringify(formValues);\n      this.formValue = `PN-JSON|${valueJsonString}`;\n    } else {\n      this.formValue = '';\n    }\n\n    this.rowvalues.emit(this.formValue);\n    this.checkInputTotal();\n  }\n\n  addRowElement() {\n    const selected = this.pnRowSelectDropdown.querySelector('[aria-selected=true]');\n    const selectedValue = selected?.textContent;\n    const slotElm = this.tableBody;\n    const newRow = document.createElement('tr');\n    newRow.setAttribute('index', `${this.nextRowIndex}`);\n    newRow.setAttribute('class', 'generated-table-row');\n    newRow.onclick = e => this.formRowEvent(e);\n    const rowNameColumn = document.createElement('td');\n    rowNameColumn.setAttribute('class', 'tr-name');\n    rowNameColumn.innerHTML = selectedValue;\n    rowNameColumn.dataset.name = selectedValue;\n    newRow.appendChild(rowNameColumn);\n\n    if (this.rowHasDropdown) {\n      const rowDropdownColumn = this.createDropdownColumn(selectedValue);\n      newRow.appendChild(rowDropdownColumn);\n    }\n\n    const rowInputColumn = this.createInputColumn(selectedValue);\n    newRow.appendChild(rowInputColumn);\n    const deleteButton = this.createDeleteButtonColumn();\n    newRow.appendChild(deleteButton);\n\n    slotElm.appendChild(newRow);\n    this.updateRowSelectDropdown();\n    this.nextRowIndex++;\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('td');\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 (Array.isArray(selectedItem.values) && selectedItem.values.length) {\n      const dropdown = document.createElement('pn-select');\n      dropdown.setAttribute('name', `${selectedValue}-dropdown`);\n      dropdown.setAttribute('placeholder', this.rowDropdownPlaceholder);\n\n      const filtereredValues = selectedItem.values.filter(item => !selectedOptionValues?.includes(item.value));\n\n      filtereredValues.forEach(childItem => {\n        const childOption = document.createElement('pn-option');\n        childOption.setAttribute(\"label\", childItem.label);\n        childOption.setAttribute(\"value\", 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('td');\n    inputColumn.setAttribute('class', 'tr-input');\n    const inputElm = document.createElement('pn-marketweb-input');\n    inputElm.setAttribute('type', 'number');\n    inputElm.setAttribute('name', `${selectedValue}-input`);\n    inputElm.setAttribute('placeholder', '0');\n    inputColumn.appendChild(inputElm);\n    return inputColumn;\n  }\n\n  createDeleteButtonColumn() {\n    const buttonColumn = document.createElement('td');\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    if (rows.length) {\n      this.rowSelectDropdownArr = [];\n\n      this._dropdownData.forEach(element => {\n        const filteredRows = rows.filter(row => row.rowName === element.label);\n        const mainOptionReachedMaxPossibleRows =\n          (element.values.length > 0 && filteredRows.length >= element.values.length) || (element.values.length === 0 && filteredRows.length === 1);\n        if (!mainOptionReachedMaxPossibleRows) {\n          this.rowSelectDropdownArr.push(element.label);\n        }\n      });\n    } else {\n      this.setRowSelectDropdownArr();\n    }\n\n    const selectOptions = this.pnRowSelectDropdown.querySelectorAll('pn-option');\n    selectOptions.forEach(elm => {\n      elm.removeAttribute('selected');\n    });\n\n    const placeholder = this.pnRowSelectDropdown.querySelector('.pn-select-content span');\n    placeholder.innerHTML = this.addRowDropdownPlaceholder;\n\n    this.updateHiddenFieldValue();\n  }\n\n  deleteRow(e: Event) {\n    e.preventDefault();\n    this.nextRowIndex--;\n    const targetElm = e.currentTarget as HTMLButtonElement;\n    const targetRow = targetElm.closest('tr');\n    targetRow.remove();\n    const allRows = [...this.tableBody.querySelectorAll('tr')];\n\n    allRows.map((elm, index) => {\n      elm.setAttribute('index', `${index}`);\n    });\n\n    this.updateRowSelectDropdown();\n  }\n\n  checkInputTotal() {\n    const allRows = this.tableBody.querySelectorAll('tr');\n\n    if (this.totalInputLimit === 0 || allRows.length < 1) {\n      this.showWarning = false;\n      return;\n    }\n\n    let totalInput = 0;\n\n    allRows.forEach(element => {\n      const inputField = element.querySelector('pn-marketweb-input');\n      if (inputField.value) {\n        totalInput += parseInt(inputField.value) ?? 0;\n      }\n    });\n    this.showWarning = totalInput > this.totalInputLimit ? true : false;\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            placeholder={this.addRowDropdownPlaceholder}\n            label={this.addRowDropdownLabel}\n            class=\"pn-row-select-dropdown\"\n            empty-option=\"true\"\n          >\n            {this.rowSelectDropdownArr?.map((value: string) => <pn-option label={value} value={value}></pn-option>)}\n          </pn-select>\n        </div>\n        <div class=\"dropdown-choice-form-row\">\n          <table class=\"pn-dropdown-choice-table\">\n            <thead ref={el => (this.tableHead = el as HTMLElement)}>\n              {this.nextRowIndex === 0 ? null : (\n                <tr>\n                  <th class=\"table-header--name\">\n                    <label>{this.rowNameLabel}</label>\n                  </th>\n                  {this.rowHasDropdown ? (\n                    <th class=\"table-header--dropdown\">\n                      <label>{this.rowDropdownLabel}</label>\n                    </th>\n                  ) : null}\n                  <th class=\"table-header--input\">\n                    <label>{this.rowInputLabel}</label>\n                  </th>\n                  <th class=\"table-header--delete\"></th>\n                </tr>\n              )}\n            </thead>\n            <tbody ref={el => (this.tableBody = el as HTMLElement)} class=\"pn-dropdown-choice-table-slot\">\n              <slot></slot>\n            </tbody>\n            <tfoot>\n              {this.showWarning ? (\n                <tr>\n                  <td colSpan={this.columnCount}>\n                    <pn-icon icon={alert_exclamation_circle} small color=\"warning\"></pn-icon>\n                    <small class=\"dropdown-choice-error-message\">{this.inputLimitWarning}</small>\n                  </td>\n                </tr>\n              ) : null}\n            </tfoot>\n          </table>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"pn-dropdown-choice-adds-row.entry.js","mappings":";;;;AAAA,MAAM,0BAA0B,GAAG,igDAAigD,CAAC;AACriD,sCAAe,0BAA0B;;MCQ5B,uBAAuB;;;;4BAOM,IAAI;4BACb,IAAI;kCACE,EAAE;yCACK,EAAE;mCACR,EAAE;4BACT,EAAE;8BACC,IAAI;gCACH,EAAE;sCACI,EAAE;6BACX,EAAE;mCACI,EAAE;+BACN,CAAC;iCACC,IAAI;4BAER,IAAI;oCACM,IAAI;2BACf,IAAI;2BACH,KAAK;yBACR,IAAI;;;IAvBjC,mBAAmB,GAAgB,IAAI,CAAC;IACxC,SAAS,GAAgB,IAAI,CAAC;IAC9B,SAAS,GAAgB,IAAI,CAAC;IACtB,aAAa,CAAS;IAsBrB,SAAS,CAAuB;IAGzC,mBAAmB;QACjB,IAAI,OAAO,IAAI,CAAC,YAAY,KAAK,QAAQ,EAAE;YACzC,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;SACpD;aAAM;YACL,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,YAAY,CAAC;SACxC;KACF;IAED,iBAAiB;QACf,IAAI,CAAC,mBAAmB,EAAE,CAAC;KAC5B;IAED,gBAAgB;QACd,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACxB,IAAI,CAAC,gBAAgB,EAAE,CAAC;KACzB;IAED,gBAAgB;QACd,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,cAAc,EAAE,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC;KACzG;IAED,gBAAgB;QACd,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;QACtB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,cAAc,GAAG,CAAC,GAAG,CAAC,CAAC;QAC/C,IAAI,CAAC,uBAAuB,EAAE,CAAC;KAChC;IAED,uBAAuB;QACrB,IAAI,CAAC,oBAAoB,GAAG,EAAE,CAAC;QAC/B,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,OAAO;YAChC,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;SAC/C,CAAC,CAAC;KACJ;IAED,YAAY,GAAG,CAAC;QACd,MAAM,iBAAiB,GAAG,QAAQ,CAAC,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,GAAG,CAAC,CAAC;QAEhF,IAAI,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE;YAC7B,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC,OAAO,CAAC,SAAS;gBACnC,CAAC,CAAC,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,iBAAiB,CAAC,CAAC;aACzD,CAAC,CAAC;SACJ;aAAM;YACL,MAAM,WAAW,GAAG,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,sBAAsB,CAAC,EAAE,aAAa,CAAC,WAAW,CAAgB,CAAC;YACxG,IAAI,WAAW,EAAE;gBACf,WAAW,CAAC,gBAAgB,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;aACjE;SACF;KACF,CAAC;IAEF,sBAAsB;QACpB,MAAM,OAAO,GAAG,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,CAAC;QAC3D,MAAM,gBAAgB,GAAG,IAAI,CAAC,cAAc,GAAG,CAAC,GAAG,CAAC,CAAC;QACrD,MAAM,UAAU,GAAgB,EAAE,CAAC;QAEnC,IAAI,OAAO,CAAC,MAAM,EAAE;YAClB,OAAO,CAAC,OAAO,CAAC,GAAG;gBACjB,MAAM,GAAG,GAAc,EAAE,GAAG,EAAE,EAAE,EAAE,CAAC;gBACnC,MAAM,OAAO,GAAG,GAAG,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;gBAC9C,MAAM,WAAW,GAAG,GAAG,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;gBACtD,MAAM,QAAQ,GAAG,GAAG,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;gBAEhD,MAAM,SAAS,GAAa,EAAE,IAAI,EAAE,IAAI,CAAC,YAAY,EAAE,KAAK,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC;gBACnF,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;gBAExB,MAAM,QAAQ,GAAG,WAAW,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;gBACjE,IAAI,QAAQ,EAAE;oBACZ,MAAM,iBAAiB,GAAG,QAAQ,CAAC,WAAW,IAAI,EAAE,CAAC;oBAErD,IAAI,iBAAiB,CAAC,MAAM,EAAE;wBAC5B,MAAM,aAAa,GAAa;4BAC9B,IAAI,EAAE,IAAI,CAAC,gBAAgB;4BAC3B,KAAK,EAAE,iBAAiB;yBACzB,CAAC;wBACF,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;qBAC7B;iBACF;gBACD,IAAI,CAAC,QAAQ,IAAI,gBAAgB,KAAK,CAAC,EAAE;oBACvC,MAAM,aAAa,GAAa;wBAC9B,IAAI,EAAE,IAAI,CAAC,gBAAgB;wBAC3B,KAAK,EAAE,EAAE;qBACV,CAAC;oBACF,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;iBAC7B;gBAED,MAAM,UAAU,GAAG,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,EAAE,KAAK,IAAI,GAAG,CAAC,CAAC;gBAC3E,IAAI,UAAU,GAAG,CAAC,EAAE;oBAClB,MAAM,gBAAgB,GAAa,EAAE,IAAI,EAAE,IAAI,CAAC,aAAa,EAAE,KAAK,EAAE,UAAU,CAAC,QAAQ,EAAE,EAAE,CAAC;oBAC9F,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;iBAChC;gBAED,IAAI,GAAG,CAAC,GAAG,CAAC,MAAM,KAAK,gBAAgB,EAAE;oBACvC,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;iBACtB;aACF,CAAC,CAAC;SACJ;QAED,IAAI,UAAU,CAAC,MAAM,IAAI,UAAU,CAAC,MAAM,KAAK,OAAO,CAAC,MAAM,EAAE;YAC7D,MAAM,eAAe,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;YACnD,IAAI,CAAC,SAAS,GAAG,WAAW,eAAe,EAAE,CAAC;SAC/C;aAAM;YACL,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;SACrB;QAED,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QACpC,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAED,aAAa;QACX,MAAM,QAAQ,GAAG,IAAI,CAAC,mBAAmB,CAAC,aAAa,CAAC,sBAAsB,CAAC,CAAC;QAChF,MAAM,aAAa,GAAG,QAAQ,EAAE,WAAW,CAAC;QAC5C,MAAM,OAAO,GAAG,IAAI,CAAC,SAAS,CAAC;QAC/B,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QAC5C,MAAM,CAAC,YAAY,CAAC,OAAO,EAAE,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC;QACrD,MAAM,CAAC,YAAY,CAAC,OAAO,EAAE,qBAAqB,CAAC,CAAC;QACpD,MAAM,CAAC,OAAO,GAAG,CAAC,IAAI,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;QAC3C,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QACnD,aAAa,CAAC,YAAY,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;QAC/C,aAAa,CAAC,SAAS,GAAG,aAAa,CAAC;QACxC,aAAa,CAAC,OAAO,CAAC,IAAI,GAAG,aAAa,CAAC;QAC3C,MAAM,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC;QAElC,IAAI,IAAI,CAAC,cAAc,EAAE;YACvB,MAAM,iBAAiB,GAAG,IAAI,CAAC,oBAAoB,CAAC,aAAa,CAAC,CAAC;YACnE,MAAM,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC;SACvC;QAED,MAAM,cAAc,GAAG,IAAI,CAAC,iBAAiB,CAAC,aAAa,CAAC,CAAC;QAC7D,MAAM,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;QACnC,MAAM,YAAY,GAAG,IAAI,CAAC,wBAAwB,EAAE,CAAC;QACrD,MAAM,CAAC,WAAW,CAAC,YAAY,CAAC,CAAC;QAEjC,OAAO,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;QAC5B,IAAI,CAAC,uBAAuB,EAAE,CAAC;QAC/B,IAAI,CAAC,YAAY,EAAE,CAAC;KACrB;IAED,aAAa,CAAC,aAAqB;QACjC,OAAO,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,uBAAuB,aAAa,GAAG,CAAC,CAAC;KACnF;IAED,oBAAoB,CAAC,aAAqB;QACxC,MAAM,cAAc,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QACpD,cAAc,CAAC,YAAY,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC;QACpD,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,GAAG,IAAI,GAAG,CAAC,KAAK,KAAK,aAAa,CAAC,CAAC;QACjF,MAAM,oBAAoB,GAAG,EAAE,CAAC;QAChC,MAAM,UAAU,GAAG,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC;QAErD,UAAU,CAAC,OAAO,CAAC,GAAG;YACpB,oBAAoB,CAAC,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,aAAa,CAAC,mCAAmC,CAAC,EAAE,WAAW,CAAC,CAAC;SAC/G,CAAC,CAAC;QAEH,IAAI,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,MAAM,CAAC,IAAI,YAAY,CAAC,MAAM,CAAC,MAAM,EAAE;YACpE,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;YACrD,QAAQ,CAAC,YAAY,CAAC,MAAM,EAAE,GAAG,aAAa,WAAW,CAAC,CAAC;YAC3D,QAAQ,CAAC,YAAY,CAAC,aAAa,EAAE,IAAI,CAAC,sBAAsB,CAAC,CAAC;YAElE,MAAM,gBAAgB,GAAG,YAAY,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,oBAAoB,EAAE,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;YAEzG,gBAAgB,CAAC,OAAO,CAAC,SAAS;gBAChC,MAAM,WAAW,GAAG,QAAQ,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;gBACxD,WAAW,CAAC,YAAY,CAAC,OAAO,EAAE,SAAS,CAAC,KAAK,CAAC,CAAC;gBACnD,WAAW,CAAC,YAAY,CAAC,OAAO,EAAE,SAAS,CAAC,KAAK,CAAC,CAAA;gBAClD,QAAQ,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC;aACnC,CAAC,CAAC;YAEH,cAAc,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC;SACtC;QAED,OAAO,cAAc,CAAC;KACvB;IAED,iBAAiB,CAAC,aAAqB;QACrC,MAAM,WAAW,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QACjD,WAAW,CAAC,YAAY,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC;QAC9C,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;QAC9D,QAAQ,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;QACxC,QAAQ,CAAC,YAAY,CAAC,MAAM,EAAE,GAAG,aAAa,QAAQ,CAAC,CAAC;QACxD,QAAQ,CAAC,YAAY,CAAC,aAAa,EAAE,GAAG,CAAC,CAAC;QAC1C,WAAW,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC;QAClC,OAAO,WAAW,CAAC;KACpB;IAED,wBAAwB;QACtB,MAAM,YAAY,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QAClD,YAAY,CAAC,YAAY,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QAChD,MAAM,SAAS,GAAG,QAAQ,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;QACtD,SAAS,CAAC,OAAO,GAAG,CAAC,IAAI,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;QAC3C,SAAS,CAAC,YAAY,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC;QAChD,SAAS,CAAC,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;QACxC,SAAS,CAAC,WAAW,CAAC,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC,CAAC;QACzE,YAAY,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC;QACpC,OAAO,YAAY,CAAC;KACrB;IAED,uBAAuB;QAGrB,MAAM,IAAI,GAAU,EAAE,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,UAAU,CAAC,EAAE,EAAE;YAC7E,MAAM,cAAc,GAAG,EAAE,EAAE,aAAa,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;YACxE,MAAM,mBAAmB,GAAG,cAAc,EAAE,aAAa,CAAC,yBAAyB,CAAC,EAAE,WAAW,CAAC;YAClG,MAAM,GAAG,GAAQ;gBACf,OAAO,EAAE,EAAE,EAAE,SAAS;gBACtB,aAAa,EAAE,cAAc,EAAE,aAAa,CAAC,sBAAsB,CAAC,EAAE,WAAW;gBACjF,WAAW,EAAE,mBAAmB;aACjC,CAAC;YACF,OAAO,GAAG,CAAC;SACZ,CAAC,CAAC;QAEH,IAAI,IAAI,CAAC,MAAM,EAAE;YACf,IAAI,CAAC,oBAAoB,GAAG,EAAE,CAAC;YAE/B,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,OAAO;gBAChC,MAAM,YAAY,GAAG,IAAI,CAAC,MAAM,CAAC,GAAG,IAAI,GAAG,CAAC,OAAO,KAAK,OAAO,CAAC,KAAK,CAAC,CAAC;gBACvE,MAAM,gCAAgC,GACpC,CAAC,OAAO,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,IAAI,YAAY,CAAC,MAAM,IAAI,OAAO,CAAC,MAAM,CAAC,MAAM,MAAM,OAAO,CAAC,MAAM,CAAC,MAAM,KAAK,CAAC,IAAI,YAAY,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC;gBAC5I,IAAI,CAAC,gCAAgC,EAAE;oBACrC,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;iBAC/C;aACF,CAAC,CAAC;SACJ;aAAM;YACL,IAAI,CAAC,uBAAuB,EAAE,CAAC;SAChC;QAED,MAAM,aAAa,GAAG,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAAC;QAC7E,aAAa,CAAC,OAAO,CAAC,GAAG;YACvB,GAAG,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;SACjC,CAAC,CAAC;QAEH,MAAM,WAAW,GAAG,IAAI,CAAC,mBAAmB,CAAC,aAAa,CAAC,yBAAyB,CAAC,CAAC;QACtF,WAAW,CAAC,SAAS,GAAG,IAAI,CAAC,yBAAyB,CAAC;QAEvD,IAAI,CAAC,sBAAsB,EAAE,CAAC;KAC/B;IAED,SAAS,CAAC,CAAQ;QAChB,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,IAAI,CAAC,YAAY,EAAE,CAAC;QACpB,MAAM,SAAS,GAAG,CAAC,CAAC,aAAkC,CAAC;QACvD,MAAM,SAAS,GAAG,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;QAC1C,SAAS,CAAC,MAAM,EAAE,CAAC;QACnB,MAAM,OAAO,GAAG,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,CAAC;QAE3D,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK;YACrB,GAAG,CAAC,YAAY,CAAC,OAAO,EAAE,GAAG,KAAK,EAAE,CAAC,CAAC;SACvC,CAAC,CAAC;QAEH,IAAI,CAAC,uBAAuB,EAAE,CAAC;KAChC;IAED,eAAe;QACb,MAAM,OAAO,GAAG,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC;QAEtD,IAAI,IAAI,CAAC,eAAe,KAAK,CAAC,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE;YACpD,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;YACzB,OAAO;SACR;QAED,IAAI,UAAU,GAAG,CAAC,CAAC;QAEnB,OAAO,CAAC,OAAO,CAAC,OAAO;YACrB,MAAM,UAAU,GAAG,OAAO,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;YAC/D,IAAI,UAAU,CAAC,KAAK,EAAE;gBACpB,UAAU,IAAI,QAAQ,CAAC,UAAU,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;aAC/C;SACF,CAAC,CAAC;QACH,IAAI,CAAC,WAAW,GAAG,UAAU,GAAG,IAAI,CAAC,eAAe,GAAG,IAAI,GAAG,KAAK,CAAC;KACrE;IAED,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,4DAAK,KAAK,EAAC,0BAA0B,IACnC,kEACE,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,mBAAmB,GAAG,EAAiB,CAAC,EACzD,IAAI,EAAE,IAAI,CAAC,kBAAkB,EAC7B,WAAW,EAAE,IAAI,CAAC,yBAAyB,EAC3C,KAAK,EAAE,IAAI,CAAC,mBAAmB,EAC/B,KAAK,EAAC,wBAAwB,kBACjB,MAAM,EACnB,QAAQ,EAAE,IAAI,CAAC,YAAY,IAE1B,IAAI,CAAC,oBAAoB,EAAE,GAAG,CAAC,CAAC,KAAa,KAAK,iBAAW,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,GAAc,CAAC,CAC7F,CACR,EACN,4DAAK,KAAK,EAAC,0BAA0B,IACnC,8DAAO,KAAK,EAAC,0BAA0B,IACrC,8DAAO,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,SAAS,GAAG,EAAiB,CAAC,IACnD,IAAI,CAAC,YAAY,KAAK,CAAC,GAAG,IAAI,IAC7B,cACE,UAAI,KAAK,EAAC,oBAAoB,IAC5B,iBAAQ,IAAI,CAAC,YAAY,CAAS,CAC/B,EACJ,IAAI,CAAC,cAAc,IAClB,UAAI,KAAK,EAAC,wBAAwB,IAChC,iBAAQ,IAAI,CAAC,gBAAgB,CAAS,CACnC,IACH,IAAI,EACR,UAAI,KAAK,EAAC,qBAAqB,IAC7B,iBAAQ,IAAI,CAAC,aAAa,CAAS,CAChC,EACL,UAAI,KAAK,EAAC,sBAAsB,GAAM,CACnC,CACN,CACK,EACR,8DAAO,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,SAAS,GAAG,EAAiB,CAAC,EAAE,KAAK,EAAC,+BAA+B,IAC3F,8DAAa,CACP,EACR,gEACG,IAAI,CAAC,WAAW,IACf,cACE,UAAI,OAAO,EAAE,IAAI,CAAC,WAAW,IAC3B,eAAS,IAAI,EAAE,wBAAwB,EAAE,KAAK,QAAC,KAAK,EAAC,SAAS,GAAW,EACzE,aAAO,KAAK,EAAC,+BAA+B,IAAE,IAAI,CAAC,iBAAiB,CAAS,CAC1E,CACF,IACH,IAAI,CACF,CACF,CACJ,CACD,EACP;KACH;;;;;;;;;","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  gap: 1rem;\n\n  .dropdown-choice-form-row {\n    display: flex;\n    gap: 1rem;\n  }\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\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      .table-header {\n        &--name {\n          width: 40%;\n        }\n\n        &--dropdown {\n          width: 40%;\n        }\n\n        &--input {\n          width: 10%;\n        }\n\n        &--delete {\n          width: 10%;\n        }\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';\nimport { alert_exclamation_circle } from 'pn-design-assets/pn-assets/icons.js';\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\n  @State() nextRowIndex: number = null;\n  @State() rowSelectDropdownArr: string[] = null;\n  @State() columnCount: number = null;\n  @State() showWarning: boolean = false;\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('selectOption', debounce(this.addRowElement.bind(this), 500));\n  }\n\n  setInitialValues() {\n    this.nextRowIndex = 0;\n    this.columnCount = this.rowHasDropdown ? 4 : 3;\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('selectOption', debouncedAddValue);\n      }\n    }\n  };\n\n  updateHiddenFieldValue() {\n    const allRows = [...this.tableBody.querySelectorAll('tr')];\n    const columnValueCount = this.rowHasDropdown ? 3 : 2;\n    const formValues: FormValue[] = [];\n\n    if (allRows.length) {\n      allRows.forEach(elm => {\n        const row: FormValue = { row: [] };\n        const nameElm = elm.querySelector('.tr-name');\n        const dropdownElm = elm.querySelector('.tr-dropdown');\n        const inputElm = elm.querySelector('.tr-input');\n\n        const nameValue: RowValue = { name: this.rowNameLabel, value: nameElm?.innerHTML };\n        row.row.push(nameValue);\n\n        const dropdown = dropdownElm.querySelector('.current-selection');\n        if (dropdown) {\n          const dropdownSelection = dropdown.textContent ?? '';\n\n          if (dropdownSelection.length) {\n            const dropdownValue: RowValue = {\n              name: this.rowDropdownLabel,\n              value: dropdownSelection,\n            };\n            row.row.push(dropdownValue);\n          }\n        }\n        if (!dropdown && columnValueCount === 3) {\n          const dropdownValue: RowValue = {\n            name: this.rowDropdownLabel,\n            value: '',\n          };\n          row.row.push(dropdownValue);\n        }\n\n        const inputValue = parseInt(inputElm.querySelector('input')?.value ?? '0');\n        if (inputValue > 0) {\n          const inputColumnValue: RowValue = { name: this.rowInputLabel, value: inputValue.toString() };\n          row.row.push(inputColumnValue);\n        }\n\n        if (row.row.length === columnValueCount) {\n          formValues.push(row);\n        }\n      });\n    }\n\n    if (formValues.length && formValues.length === allRows.length) {\n      const valueJsonString = JSON.stringify(formValues);\n      this.formValue = `PN-JSON|${valueJsonString}`;\n    } else {\n      this.formValue = '';\n    }\n\n    this.rowvalues.emit(this.formValue);\n    this.checkInputTotal();\n  }\n\n  addRowElement() {\n    const selected = this.pnRowSelectDropdown.querySelector('[aria-selected=true]');\n    const selectedValue = selected?.textContent;\n    const slotElm = this.tableBody;\n    const newRow = document.createElement('tr');\n    newRow.setAttribute('index', `${this.nextRowIndex}`);\n    newRow.setAttribute('class', 'generated-table-row');\n    newRow.onclick = e => this.formRowEvent(e);\n    const rowNameColumn = document.createElement('td');\n    rowNameColumn.setAttribute('class', 'tr-name');\n    rowNameColumn.innerHTML = selectedValue;\n    rowNameColumn.dataset.name = selectedValue;\n    newRow.appendChild(rowNameColumn);\n\n    if (this.rowHasDropdown) {\n      const rowDropdownColumn = this.createDropdownColumn(selectedValue);\n      newRow.appendChild(rowDropdownColumn);\n    }\n\n    const rowInputColumn = this.createInputColumn(selectedValue);\n    newRow.appendChild(rowInputColumn);\n    const deleteButton = this.createDeleteButtonColumn();\n    newRow.appendChild(deleteButton);\n\n    slotElm.appendChild(newRow);\n    this.updateRowSelectDropdown();\n    this.nextRowIndex++;\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('td');\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 (Array.isArray(selectedItem.values) && selectedItem.values.length) {\n      const dropdown = document.createElement('pn-select');\n      dropdown.setAttribute('name', `${selectedValue}-dropdown`);\n      dropdown.setAttribute('placeholder', this.rowDropdownPlaceholder);\n\n      const filtereredValues = selectedItem.values.filter(item => !selectedOptionValues?.includes(item.value));\n\n      filtereredValues.forEach(childItem => {\n        const childOption = document.createElement('pn-option');\n        childOption.setAttribute(\"label\", childItem.label);\n        childOption.setAttribute(\"value\", 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('td');\n    inputColumn.setAttribute('class', 'tr-input');\n    const inputElm = document.createElement('pn-marketweb-input');\n    inputElm.setAttribute('type', 'number');\n    inputElm.setAttribute('name', `${selectedValue}-input`);\n    inputElm.setAttribute('placeholder', '0');\n    inputColumn.appendChild(inputElm);\n    return inputColumn;\n  }\n\n  createDeleteButtonColumn() {\n    const buttonColumn = document.createElement('td');\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    if (rows.length) {\n      this.rowSelectDropdownArr = [];\n\n      this._dropdownData.forEach(element => {\n        const filteredRows = rows.filter(row => row.rowName === element.label);\n        const mainOptionReachedMaxPossibleRows =\n          (element.values.length > 0 && filteredRows.length >= element.values.length) || (element.values.length === 0 && filteredRows.length === 1);\n        if (!mainOptionReachedMaxPossibleRows) {\n          this.rowSelectDropdownArr.push(element.label);\n        }\n      });\n    } else {\n      this.setRowSelectDropdownArr();\n    }\n\n    const selectOptions = this.pnRowSelectDropdown.querySelectorAll('pn-option');\n    selectOptions.forEach(elm => {\n      elm.removeAttribute('selected');\n    });\n\n    const placeholder = this.pnRowSelectDropdown.querySelector('.pn-select-content span');\n    placeholder.innerHTML = this.addRowDropdownPlaceholder;\n\n    this.updateHiddenFieldValue();\n  }\n\n  deleteRow(e: Event) {\n    e.preventDefault();\n    this.nextRowIndex--;\n    const targetElm = e.currentTarget as HTMLButtonElement;\n    const targetRow = targetElm.closest('tr');\n    targetRow.remove();\n    const allRows = [...this.tableBody.querySelectorAll('tr')];\n\n    allRows.map((elm, index) => {\n      elm.setAttribute('index', `${index}`);\n    });\n\n    this.updateRowSelectDropdown();\n  }\n\n  checkInputTotal() {\n    const allRows = this.tableBody.querySelectorAll('tr');\n\n    if (this.totalInputLimit === 0 || allRows.length < 1) {\n      this.showWarning = false;\n      return;\n    }\n\n    let totalInput = 0;\n\n    allRows.forEach(element => {\n      const inputField = element.querySelector('pn-marketweb-input');\n      if (inputField.value) {\n        totalInput += parseInt(inputField.value) ?? 0;\n      }\n    });\n    this.showWarning = totalInput > this.totalInputLimit ? true : false;\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            placeholder={this.addRowDropdownPlaceholder}\n            label={this.addRowDropdownLabel}\n            class=\"pn-row-select-dropdown\"\n            empty-option=\"true\"\n            language={this.languageCode}\n          >\n            {this.rowSelectDropdownArr?.map((value: string) => <pn-option label={value} value={value}></pn-option>)}\n          </pn-select>\n        </div>\n        <div class=\"dropdown-choice-form-row\">\n          <table class=\"pn-dropdown-choice-table\">\n            <thead ref={el => (this.tableHead = el as HTMLElement)}>\n              {this.nextRowIndex === 0 ? null : (\n                <tr>\n                  <th class=\"table-header--name\">\n                    <label>{this.rowNameLabel}</label>\n                  </th>\n                  {this.rowHasDropdown ? (\n                    <th class=\"table-header--dropdown\">\n                      <label>{this.rowDropdownLabel}</label>\n                    </th>\n                  ) : null}\n                  <th class=\"table-header--input\">\n                    <label>{this.rowInputLabel}</label>\n                  </th>\n                  <th class=\"table-header--delete\"></th>\n                </tr>\n              )}\n            </thead>\n            <tbody ref={el => (this.tableBody = el as HTMLElement)} class=\"pn-dropdown-choice-table-slot\">\n              <slot></slot>\n            </tbody>\n            <tfoot>\n              {this.showWarning ? (\n                <tr>\n                  <td colSpan={this.columnCount}>\n                    <pn-icon icon={alert_exclamation_circle} small color=\"warning\"></pn-icon>\n                    <small class=\"dropdown-choice-error-message\">{this.inputLimitWarning}</small>\n                  </td>\n                </tr>\n              ) : null}\n            </tfoot>\n          </table>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/esm/pn-dropdown-with-multi-input-rows-row.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, d as Host, g as getElement } from './index-fa51bde4.js';
+import { r as registerInstance, c as createEvent, g as getElement, h, d as Host } from './index-fa51bde4.js';
 import { d as debounce } from './index-1093ae90.js';
 import { m as minus } from './minus-2b8ae0b8.js';
 
@@ -12,10 +12,6 @@ const PnDropdownWithMultiInputRowsRow = class {
         this.deleteRowEvent = createEvent(this, "deleteRowEvent", 7);
         this.firstInputChange = createEvent(this, "firstInputChange", 7);
         this.secondInputChange = createEvent(this, "secondInputChange", 7);
-        this.pnFirstInputField = null;
-        this.pnSecondInputField = null;
-        this.pnDatePicker = null;
-        this.pnDeleteRowButton = null;
         this.languageCode = null;
         this.fristInputPlaceholder = null;
         this.firstInputMin = null;
@@ -48,6 +44,16 @@ const PnDropdownWithMultiInputRowsRow = class {
         this.secondInputValue = '';
         this.dateValue = '';
     }
+    get hostElement() { return getElement(this); }
+    _predefinedValue;
+    pnFirstInputField = null;
+    pnSecondInputField = null;
+    pnDatePicker = null;
+    pnDeleteRowButton = null;
+    rowValueChange;
+    deleteRowEvent;
+    firstInputChange;
+    secondInputChange;
     componentWillLoad() {
         this.getPredefinedValues();
         this.setInitialValues();
@@ -59,13 +65,12 @@ const PnDropdownWithMultiInputRowsRow = class {
         this._predefinedValue = JSON.parse(this.predefinedValue);
     }
     applyPredefinedValue() {
-        var _a, _b;
         this.getPredefinedValues();
         this.setInitialValues();
-        if ((_a = this.firstInputValue) === null || _a === void 0 ? void 0 : _a.length) {
+        if (this.firstInputValue?.length) {
             this.validateFirstInput(parseInt(this.firstInputValue));
         }
-        if ((_b = this.secondInputValue) === null || _b === void 0 ? void 0 : _b.length) {
+        if (this.secondInputValue?.length) {
             this.validateSecondInput(parseInt(this.secondInputValue));
         }
         if (this.rowIndex >= this.minRowCount) {
@@ -166,12 +171,10 @@ const PnDropdownWithMultiInputRowsRow = class {
         this.deleteRowEvent.emit(this._predefinedValue.id);
     }
     render() {
-        var _a;
-        return (h(Host, { key: '101265b9e24ada0da3199690b2c2f56cfd7d6a00' }, h("div", { key: 'fed264cfb3a052b3b2b5b26d2484e9787eaa3d36', class: "input-element-row" }, h("div", { key: '6161953b428a44b37defc7c3e2d6a95d79845c36', class: "input-container" }, h("pn-marketweb-input", { key: '7e155be4887029e727ac78380ab5783ce50301d4', ref: el => (this.pnFirstInputField = el), type: "number", placeholder: this.fristInputPlaceholder, 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: '1bad690de5ffe9e79c18614bcd3224d9fb5940fe', class: "input-container" }, h("pn-marketweb-input", { key: '7894824d20d159e2a03f131d3e348f06e7ce67a4', 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: '209e5aa157272445cb02f7634d7b503b8be34a48', class: "input-container" }, h("pn-date-picker", { key: 'e284c5c8ef3eebed689d9bd3f7ec29c11d51190d', ref: el => (this.pnDatePicker = el), range: "false", "disable-weekends": true, "min-date": this.firstValidDate, "max-date": this.lastValidDate, language: this.languageCode, placeholder: this.datePlaceholder, start: ((_a = this.dateValue) === null || _a === void 0 ? void 0 : _a.length) ? this.dateValue : null })), this.rowIndex >= this.minRowCount ? (h("div", { class: "delete-button-contianer" }, h("pn-button", { ref: el => (this.pnDeleteRowButton = el), small: "true", icon: minus, appearance: "warning", index: this.rowIndex, onClick: () => {
+        return (h(Host, { key: '101265b9e24ada0da3199690b2c2f56cfd7d6a00' }, h("div", { key: 'fed264cfb3a052b3b2b5b26d2484e9787eaa3d36', class: "input-element-row" }, h("div", { key: '6161953b428a44b37defc7c3e2d6a95d79845c36', class: "input-container" }, h("pn-marketweb-input", { key: '7e155be4887029e727ac78380ab5783ce50301d4', ref: el => (this.pnFirstInputField = el), type: "number", placeholder: this.fristInputPlaceholder, 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: '1bad690de5ffe9e79c18614bcd3224d9fb5940fe', class: "input-container" }, h("pn-marketweb-input", { key: '7894824d20d159e2a03f131d3e348f06e7ce67a4', 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: '209e5aa157272445cb02f7634d7b503b8be34a48', class: "input-container" }, h("pn-date-picker", { key: 'e284c5c8ef3eebed689d9bd3f7ec29c11d51190d', ref: el => (this.pnDatePicker = el), range: "false", "disable-weekends": true, "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-contianer" }, h("pn-button", { ref: el => (this.pnDeleteRowButton = el), small: "true", icon: minus, appearance: "warning", index: this.rowIndex, onClick: () => {
                 this.deleteRow();
             } }, "Delete"))) : null)));
     }
-    get hostElement() { return getElement(this); }
     static get watchers() { return {
         "predefinedValue": ["applyPredefinedValue"]
     }; }

package/esm/pn-dropdown-with-multi-input-rows-row.entry.js.map

@@ -1 +1 @@
-{"file":"pn-dropdown-with-multi-input-rows-row.entry.js","mappings":"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","names":[],"sources":["src/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows-row.scss?tag=pn-dropdown-with-multi-input-rows-row","src/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows-row.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-dropdown-with-multi-input-rows-row {\n  .input-element-row {\n    display: flex;\n    gap: 1rem;\n    margin-bottom: 1rem;\n\n    .input-container {\n      width: 30%;\n\n      pn-marketweb-input {\n        .input-container {\n          width: 100%;\n        }\n      }\n\n      pn-date-picker {\n        width: 100%;\n      }\n\n      .input-element-message-container {\n        margin-top: 0.3rem;\n        &__error {\n          color: red;\n          line-height: 1;\n        }\n\n        &__warning {\n          line-height: 1;\n        }\n      }\n    }\n  }\n\n  .delete-button-contianer {\n    margin-top: 0.6rem;\n  }\n}\n","import { Component, Prop, h, Element, State, Host, Watch, Event, EventEmitter, Listen } from '@stencil/core';\nimport { FormValue, RowValue, Root, PredefinedValues } from './types';\nimport debounce from 'debounce';\nimport { minus } from 'pn-design-assets/pn-assets/icons.js';\n\n@Component({\n  tag: 'pn-dropdown-with-multi-input-rows-row',\n  styleUrl: 'pn-dropdown-with-multi-input-rows-row.scss',\n})\nexport class PnDropdownWithMultiInputRowsRow {\n  @Element() hostElement: Element;\n  private _predefinedValue: PredefinedValues;\n  pnFirstInputField: HTMLElement = null;\n  pnSecondInputField: HTMLElement = null;\n  pnDatePicker: HTMLElement = null;\n  pnDeleteRowButton: HTMLElement = null;\n\n  @Prop() languageCode: string = null;\n  @Prop() fristInputPlaceholder: string = null;\n  @Prop() firstInputMin: number = null;\n  @Prop() firstInputMax: number = null;\n  @Prop() firstInputWarning: number = null;\n  @Prop() firstInputWarningText: string = null;\n  @Prop() firstInputLowErrorText: string = null;\n  @Prop() firstInputHighErrorText: string = null;\n  @Prop() secondInputPlaceholder: string = null;\n  @Prop() secondInputMin: number = null;\n  @Prop() secondInputMax: number = null;\n  @Prop() secondInputWarning: number = null;\n  @Prop() secondInputWarningText: string = null;\n  @Prop() secondInputLowErrorText: string = null;\n  @Prop() secondInputHighErrorText: string = null;\n  @Prop() dateLabel: string = null;\n  @Prop() datePlaceholder: string = null;\n  @Prop() firstValidDate: string = null;\n  @Prop() lastValidDate: string = null;\n  @Prop() predefinedValue: string = null;\n  @Prop() rowIndex: number = null;\n  @Prop() minRowCount: number = null;\n\n  @State() showFirstInputWarning: boolean = false;\n  @State() showFirstInputLowError: boolean = false;\n  @State() showFirstInputHighError: boolean = false;\n  @State() showSecondInputWarning: boolean = false;\n  @State() showSecondInputLowError: boolean = false;\n  @State() showSecondInputHighError: boolean = false;\n\n  @State() firstInputValue: string = '';\n  @State() secondInputValue: string = '';\n  @State() dateValue: string = '';\n\n  @Event() rowValueChange: EventEmitter<PredefinedValues>;\n  @Event() deleteRowEvent: EventEmitter<string>;\n  @Event() firstInputChange: EventEmitter<PredefinedValues>;\n  @Event() secondInputChange: EventEmitter<PredefinedValues>;\n\n  componentWillLoad() {\n    this.getPredefinedValues();\n    this.setInitialValues();\n  }\n\n  componentDidLoad() {\n    this.addEventHandlers();\n  }\n\n  getPredefinedValues() {\n    this._predefinedValue = JSON.parse(this.predefinedValue);\n  }\n\n  @Watch('predefinedValue')\n  applyPredefinedValue() {\n    this.getPredefinedValues();\n    this.setInitialValues();\n\n    if (this.firstInputValue?.length) {\n      this.validateFirstInput(parseInt(this.firstInputValue));\n    }\n\n    if (this.secondInputValue?.length) {\n      this.validateSecondInput(parseInt(this.secondInputValue));\n    }\n\n    if (this.rowIndex >= this.minRowCount) {\n      this.pnDeleteRowButton.addEventListener('click', this.deleteRow.bind(this));\n    }\n  }\n\n  setInitialValues() {\n    this.firstInputValue = this._predefinedValue.firstInput;\n    this.secondInputValue = this._predefinedValue.secondInput;\n    this.dateValue = this._predefinedValue.date;\n  }\n\n  addEventHandlers() {\n    const emmitValues = debounce(this.emitRowValues.bind(this), 500);\n    this.pnFirstInputField.addEventListener('keyup', debounce(this.handleFirstInput.bind(this), 500));\n    this.pnSecondInputField.addEventListener('keyup', debounce(this.handleSecondInput.bind(this), 500));\n    this.pnDatePicker.addEventListener('dateselection', this.handleDateChange.bind(this));\n    this.pnDatePicker.addEventListener('dateselection', emmitValues);\n  }\n\n  handleFirstInput(e) {\n    const elm = e.target;\n    const value = parseInt(elm.value);\n\n    if (value > 0) {\n      this.firstInputValue = elm.value;\n      this.firstInputChange.emit({\n        id: this._predefinedValue.id,\n        firstInput: this.firstInputValue,\n        secondInput: this.secondInputValue,\n        date: this.dateValue,\n      });\n    }\n\n    this.validateFirstInput(value);\n    this.emitRowValues();\n  }\n\n  handleSecondInput(e) {\n    const elm = e.target;\n    const value = parseInt(elm.value);\n\n    if (value > 0) {\n      this.secondInputValue = elm.value;\n      this.secondInputChange.emit({\n        id: this._predefinedValue.id,\n        firstInput: this.firstInputValue,\n        secondInput: this.secondInputValue,\n        date: this.dateValue,\n      });\n    }\n\n    this.validateSecondInput(value);\n    this.emitRowValues();\n  }\n\n  validateFirstInput(input: number) {\n    this.showFirstInputWarning = false;\n    this.showFirstInputLowError = false;\n    this.showFirstInputHighError = false;\n\n    if (input < this.firstInputWarning) {\n      this.showFirstInputWarning = true;\n    }\n\n    if (input < this.firstInputMin) {\n      this.showFirstInputWarning = false;\n      this.showFirstInputLowError = true;\n    }\n\n    if (input > this.firstInputMax) {\n      this.showFirstInputWarning = false;\n      this.showFirstInputLowError = false;\n      this.showFirstInputHighError = true;\n    }\n  }\n\n  validateSecondInput(input: number) {\n    this.showSecondInputWarning = false;\n    this.showSecondInputLowError = false;\n    this.showSecondInputHighError = false;\n\n    if (input < this.secondInputWarning) {\n      this.showSecondInputWarning = true;\n    }\n\n    if (input < this.secondInputMin) {\n      this.showSecondInputWarning = false;\n      this.showSecondInputLowError = true;\n    }\n\n    if (input > this.secondInputMax) {\n      this.showSecondInputWarning = false;\n      this.showSecondInputLowError = false;\n      this.showSecondInputHighError = true;\n    }\n  }\n\n  handleDateChange(e) {\n    const elm = e.target;\n    if (elm === this.pnDatePicker) {\n      this.dateValue = e.detail;\n    }\n  }\n\n  emitRowValues() {\n    this.rowValueChange.emit({\n      id: this._predefinedValue.id,\n      firstInput: this.firstInputValue,\n      secondInput: this.secondInputValue,\n      date: this.dateValue,\n    });\n  }\n\n  deleteRow() {\n    this.deleteRowEvent.emit(this._predefinedValue.id);\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"input-element-row\">\n          <div class=\"input-container\">\n            <pn-marketweb-input\n              ref={el => (this.pnFirstInputField = el as HTMLElement)}\n              type=\"number\"\n              placeholder={this.fristInputPlaceholder}\n              value={this.firstInputValue}\n              min=\"1\"\n            ></pn-marketweb-input>\n            {this.showFirstInputLowError || this.showFirstInputHighError || this.showFirstInputWarning ? (\n              <div class=\"input-element-message-container\">\n                {this.showFirstInputLowError ? (\n                  <div class=\"input-element-message-container__error\">\n                    <small>{this.firstInputLowErrorText}</small>\n                  </div>\n                ) : null}\n\n                {this.showFirstInputHighError ? (\n                  <div class=\"input-element-message-container__error\">\n                    <small>{this.firstInputHighErrorText}</small>\n                  </div>\n                ) : null}\n\n                {this.showFirstInputWarning ? (\n                  <div class=\"input-element-message-container__warning\">\n                    <small>{this.firstInputWarningText}</small>\n                  </div>\n                ) : null}\n              </div>\n            ) : null}\n          </div>\n\n          <div class=\"input-container\">\n            <pn-marketweb-input\n              ref={el => (this.pnSecondInputField = el as HTMLElement)}\n              type=\"number\"\n              placeholder={this.secondInputPlaceholder}\n              value={this.secondInputValue}\n              min=\"1\"\n            ></pn-marketweb-input>\n            {this.showSecondInputLowError || this.showSecondInputHighError || this.showSecondInputWarning ? (\n              <div class=\"input-element-message-container\">\n                {this.showSecondInputLowError ? (\n                  <div class=\"input-element-message-container__error\">\n                    <small>{this.secondInputLowErrorText}</small>\n                  </div>\n                ) : null}\n\n                {this.showSecondInputHighError ? (\n                  <div class=\"input-element-message-container__error\">\n                    <small>{this.secondInputHighErrorText}</small>\n                  </div>\n                ) : null}\n\n                {this.showSecondInputWarning ? (\n                  <div class=\"input-element-message-container__warning\">\n                    <small>{this.secondInputWarningText}</small>\n                  </div>\n                ) : null}\n              </div>\n            ) : null}\n          </div>\n\n          <div class=\"input-container\">\n            <pn-date-picker\n              ref={el => (this.pnDatePicker = el as HTMLElement)}\n              range=\"false\"\n              disable-weekends={true}\n              min-date={this.firstValidDate}\n              max-date={this.lastValidDate}\n              language={this.languageCode}\n              placeholder={this.datePlaceholder}\n              start={this.dateValue?.length ? this.dateValue : null}\n            ></pn-date-picker>\n          </div>\n\n          {this.rowIndex >= this.minRowCount ? (\n            <div class=\"delete-button-contianer\">\n              <pn-button\n                ref={el => (this.pnDeleteRowButton = el as HTMLElement)}\n                small=\"true\"\n                icon={minus}\n                appearance=\"warning\"\n                index={this.rowIndex}\n                onClick={() => {\n                  this.deleteRow();\n                }}\n              >\n                Delete\n              </pn-button>\n            </div>\n          ) : null}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"pn-dropdown-with-multi-input-rows-row.entry.js","mappings":"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","names":[],"sources":["src/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows-row.scss?tag=pn-dropdown-with-multi-input-rows-row","src/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows-row.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-dropdown-with-multi-input-rows-row {\n  .input-element-row {\n    display: flex;\n    gap: 1rem;\n    margin-bottom: 1rem;\n\n    .input-container {\n      width: 30%;\n\n      pn-marketweb-input {\n        .input-container {\n          width: 100%;\n        }\n      }\n\n      pn-date-picker {\n        width: 100%;\n      }\n\n      .input-element-message-container {\n        margin-top: 0.3rem;\n        &__error {\n          color: red;\n          line-height: 1;\n        }\n\n        &__warning {\n          line-height: 1;\n        }\n      }\n    }\n  }\n\n  .delete-button-contianer {\n    margin-top: 0.6rem;\n  }\n}\n","import { Component, Prop, h, Element, State, Host, Watch, Event, EventEmitter, Listen } from '@stencil/core';\nimport { FormValue, RowValue, Root, PredefinedValues } from './types';\nimport debounce from 'debounce';\nimport { minus } from 'pn-design-assets/pn-assets/icons.js';\n\n@Component({\n  tag: 'pn-dropdown-with-multi-input-rows-row',\n  styleUrl: 'pn-dropdown-with-multi-input-rows-row.scss',\n})\nexport class PnDropdownWithMultiInputRowsRow {\n  @Element() hostElement: Element;\n  private _predefinedValue: PredefinedValues;\n  pnFirstInputField: HTMLElement = null;\n  pnSecondInputField: HTMLElement = null;\n  pnDatePicker: HTMLElement = null;\n  pnDeleteRowButton: HTMLElement = null;\n\n  @Prop() languageCode: string = null;\n  @Prop() fristInputPlaceholder: string = null;\n  @Prop() firstInputMin: number = null;\n  @Prop() firstInputMax: number = null;\n  @Prop() firstInputWarning: number = null;\n  @Prop() firstInputWarningText: string = null;\n  @Prop() firstInputLowErrorText: string = null;\n  @Prop() firstInputHighErrorText: string = null;\n  @Prop() secondInputPlaceholder: string = null;\n  @Prop() secondInputMin: number = null;\n  @Prop() secondInputMax: number = null;\n  @Prop() secondInputWarning: number = null;\n  @Prop() secondInputWarningText: string = null;\n  @Prop() secondInputLowErrorText: string = null;\n  @Prop() secondInputHighErrorText: string = null;\n  @Prop() dateLabel: string = null;\n  @Prop() datePlaceholder: string = null;\n  @Prop() firstValidDate: string = null;\n  @Prop() lastValidDate: string = null;\n  @Prop() predefinedValue: string = null;\n  @Prop() rowIndex: number = null;\n  @Prop() minRowCount: number = null;\n\n  @State() showFirstInputWarning: boolean = false;\n  @State() showFirstInputLowError: boolean = false;\n  @State() showFirstInputHighError: boolean = false;\n  @State() showSecondInputWarning: boolean = false;\n  @State() showSecondInputLowError: boolean = false;\n  @State() showSecondInputHighError: boolean = false;\n\n  @State() firstInputValue: string = '';\n  @State() secondInputValue: string = '';\n  @State() dateValue: string = '';\n\n  @Event() rowValueChange: EventEmitter<PredefinedValues>;\n  @Event() deleteRowEvent: EventEmitter<string>;\n  @Event() firstInputChange: EventEmitter<PredefinedValues>;\n  @Event() secondInputChange: EventEmitter<PredefinedValues>;\n\n  componentWillLoad() {\n    this.getPredefinedValues();\n    this.setInitialValues();\n  }\n\n  componentDidLoad() {\n    this.addEventHandlers();\n  }\n\n  getPredefinedValues() {\n    this._predefinedValue = JSON.parse(this.predefinedValue);\n  }\n\n  @Watch('predefinedValue')\n  applyPredefinedValue() {\n    this.getPredefinedValues();\n    this.setInitialValues();\n\n    if (this.firstInputValue?.length) {\n      this.validateFirstInput(parseInt(this.firstInputValue));\n    }\n\n    if (this.secondInputValue?.length) {\n      this.validateSecondInput(parseInt(this.secondInputValue));\n    }\n\n    if (this.rowIndex >= this.minRowCount) {\n      this.pnDeleteRowButton.addEventListener('click', this.deleteRow.bind(this));\n    }\n  }\n\n  setInitialValues() {\n    this.firstInputValue = this._predefinedValue.firstInput;\n    this.secondInputValue = this._predefinedValue.secondInput;\n    this.dateValue = this._predefinedValue.date;\n  }\n\n  addEventHandlers() {\n    const emmitValues = debounce(this.emitRowValues.bind(this), 500);\n    this.pnFirstInputField.addEventListener('keyup', debounce(this.handleFirstInput.bind(this), 500));\n    this.pnSecondInputField.addEventListener('keyup', debounce(this.handleSecondInput.bind(this), 500));\n    this.pnDatePicker.addEventListener('dateselection', this.handleDateChange.bind(this));\n    this.pnDatePicker.addEventListener('dateselection', emmitValues);\n  }\n\n  handleFirstInput(e) {\n    const elm = e.target;\n    const value = parseInt(elm.value);\n\n    if (value > 0) {\n      this.firstInputValue = elm.value;\n      this.firstInputChange.emit({\n        id: this._predefinedValue.id,\n        firstInput: this.firstInputValue,\n        secondInput: this.secondInputValue,\n        date: this.dateValue,\n      });\n    }\n\n    this.validateFirstInput(value);\n    this.emitRowValues();\n  }\n\n  handleSecondInput(e) {\n    const elm = e.target;\n    const value = parseInt(elm.value);\n\n    if (value > 0) {\n      this.secondInputValue = elm.value;\n      this.secondInputChange.emit({\n        id: this._predefinedValue.id,\n        firstInput: this.firstInputValue,\n        secondInput: this.secondInputValue,\n        date: this.dateValue,\n      });\n    }\n\n    this.validateSecondInput(value);\n    this.emitRowValues();\n  }\n\n  validateFirstInput(input: number) {\n    this.showFirstInputWarning = false;\n    this.showFirstInputLowError = false;\n    this.showFirstInputHighError = false;\n\n    if (input < this.firstInputWarning) {\n      this.showFirstInputWarning = true;\n    }\n\n    if (input < this.firstInputMin) {\n      this.showFirstInputWarning = false;\n      this.showFirstInputLowError = true;\n    }\n\n    if (input > this.firstInputMax) {\n      this.showFirstInputWarning = false;\n      this.showFirstInputLowError = false;\n      this.showFirstInputHighError = true;\n    }\n  }\n\n  validateSecondInput(input: number) {\n    this.showSecondInputWarning = false;\n    this.showSecondInputLowError = false;\n    this.showSecondInputHighError = false;\n\n    if (input < this.secondInputWarning) {\n      this.showSecondInputWarning = true;\n    }\n\n    if (input < this.secondInputMin) {\n      this.showSecondInputWarning = false;\n      this.showSecondInputLowError = true;\n    }\n\n    if (input > this.secondInputMax) {\n      this.showSecondInputWarning = false;\n      this.showSecondInputLowError = false;\n      this.showSecondInputHighError = true;\n    }\n  }\n\n  handleDateChange(e) {\n    const elm = e.target;\n    if (elm === this.pnDatePicker) {\n      this.dateValue = e.detail;\n    }\n  }\n\n  emitRowValues() {\n    this.rowValueChange.emit({\n      id: this._predefinedValue.id,\n      firstInput: this.firstInputValue,\n      secondInput: this.secondInputValue,\n      date: this.dateValue,\n    });\n  }\n\n  deleteRow() {\n    this.deleteRowEvent.emit(this._predefinedValue.id);\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"input-element-row\">\n          <div class=\"input-container\">\n            <pn-marketweb-input\n              ref={el => (this.pnFirstInputField = el as HTMLElement)}\n              type=\"number\"\n              placeholder={this.fristInputPlaceholder}\n              value={this.firstInputValue}\n              min=\"1\"\n            ></pn-marketweb-input>\n            {this.showFirstInputLowError || this.showFirstInputHighError || this.showFirstInputWarning ? (\n              <div class=\"input-element-message-container\">\n                {this.showFirstInputLowError ? (\n                  <div class=\"input-element-message-container__error\">\n                    <small>{this.firstInputLowErrorText}</small>\n                  </div>\n                ) : null}\n\n                {this.showFirstInputHighError ? (\n                  <div class=\"input-element-message-container__error\">\n                    <small>{this.firstInputHighErrorText}</small>\n                  </div>\n                ) : null}\n\n                {this.showFirstInputWarning ? (\n                  <div class=\"input-element-message-container__warning\">\n                    <small>{this.firstInputWarningText}</small>\n                  </div>\n                ) : null}\n              </div>\n            ) : null}\n          </div>\n\n          <div class=\"input-container\">\n            <pn-marketweb-input\n              ref={el => (this.pnSecondInputField = el as HTMLElement)}\n              type=\"number\"\n              placeholder={this.secondInputPlaceholder}\n              value={this.secondInputValue}\n              min=\"1\"\n            ></pn-marketweb-input>\n            {this.showSecondInputLowError || this.showSecondInputHighError || this.showSecondInputWarning ? (\n              <div class=\"input-element-message-container\">\n                {this.showSecondInputLowError ? (\n                  <div class=\"input-element-message-container__error\">\n                    <small>{this.secondInputLowErrorText}</small>\n                  </div>\n                ) : null}\n\n                {this.showSecondInputHighError ? (\n                  <div class=\"input-element-message-container__error\">\n                    <small>{this.secondInputHighErrorText}</small>\n                  </div>\n                ) : null}\n\n                {this.showSecondInputWarning ? (\n                  <div class=\"input-element-message-container__warning\">\n                    <small>{this.secondInputWarningText}</small>\n                  </div>\n                ) : null}\n              </div>\n            ) : null}\n          </div>\n\n          <div class=\"input-container\">\n            <pn-date-picker\n              ref={el => (this.pnDatePicker = el as HTMLElement)}\n              range=\"false\"\n              disable-weekends={true}\n              min-date={this.firstValidDate}\n              max-date={this.lastValidDate}\n              language={this.languageCode}\n              placeholder={this.datePlaceholder}\n              start={this.dateValue?.length ? this.dateValue : null}\n            ></pn-date-picker>\n          </div>\n\n          {this.rowIndex >= this.minRowCount ? (\n            <div class=\"delete-button-contianer\">\n              <pn-button\n                ref={el => (this.pnDeleteRowButton = el as HTMLElement)}\n                small=\"true\"\n                icon={minus}\n                appearance=\"warning\"\n                index={this.rowIndex}\n                onClick={() => {\n                  this.deleteRow();\n                }}\n              >\n                Delete\n              </pn-button>\n            </div>\n          ) : null}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}