@postnord/pn-marketweb-components 3.3.6 → 3.3.7
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.
- package/cjs/pn-dropdown-with-multi-input-rows.cjs.entry.js +3 -3
- package/cjs/pn-dropdown-with-multi-input-rows.cjs.entry.js.map +1 -1
- package/cjs/pn-teaser-card.cjs.entry.js +1 -1
- package/cjs/pn-teaser-card.cjs.entry.js.map +1 -1
- package/collection/components/cards/pn-teaser-card/pn-teaser-card.js +1 -1
- package/collection/components/cards/pn-teaser-card/pn-teaser-card.js.map +1 -1
- package/collection/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows.js +3 -3
- package/collection/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows.js.map +1 -1
- package/components/pn-dropdown-with-multi-input-rows.js +3 -3
- package/components/pn-dropdown-with-multi-input-rows.js.map +1 -1
- package/components/pn-teaser-card.js +1 -1
- package/components/pn-teaser-card.js.map +1 -1
- package/esm/pn-dropdown-with-multi-input-rows.entry.js +3 -3
- package/esm/pn-dropdown-with-multi-input-rows.entry.js.map +1 -1
- package/esm/pn-teaser-card.entry.js +1 -1
- package/esm/pn-teaser-card.entry.js.map +1 -1
- package/package.json +1 -1
- package/pn-market-web-components/p-1426fb9f.entry.js +2 -0
- package/pn-market-web-components/p-1426fb9f.entry.js.map +1 -0
- package/pn-market-web-components/{p-73db2c9c.entry.js → p-ab9dfa16.entry.js} +2 -2
- package/pn-market-web-components/{p-73db2c9c.entry.js.map → p-ab9dfa16.entry.js.map} +1 -1
- package/pn-market-web-components/pn-market-web-components.esm.js +1 -1
- package/pn-market-web-components/p-85f1e4c3.entry.js +0 -2
- package/pn-market-web-components/p-85f1e4c3.entry.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"pn-dropdown-with-multi-input-rows.js","mappings":"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","names":["PnDropdownWithMultiInputRows","uuidv4"],"sources":["src/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows.scss?tag=pn-dropdown-with-multi-input-rows","src/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-dropdown-with-multi-input-rows {\n .dropdown-with-multi-input-elemet {\n &__row {\n margin-bottom: 1rem;\n }\n\n &__delete {\n display: flex;\n gap: 1rem;\n margin-bottom: 1rem;\n padding: 1rem;\n background-color: $gray25;\n\n pn-button {\n margin-top: 0.9rem;\n }\n }\n\n &__label-row {\n display: flex;\n gap: 1rem;\n }\n\n &__label {\n width: 30%;\n font-size: 0.875em;\n color: #5e554a;\n }\n }\n\n .sum-row {\n display: flex;\n justify-content: space-between;\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 { v4 as uuidv4 } from 'uuid';\nimport debounce from 'debounce';\nimport { plus } from 'pn-design-assets/pn-assets/icons.js';\n\n@Component({\n tag: 'pn-dropdown-with-multi-input-rows',\n styleUrl: 'pn-dropdown-with-multi-input-rows.scss',\n})\nexport class PnDropdownWithMultiInputRows {\n @Element() hostElement: Element;\n pnFirstDropdown: HTMLElement = null;\n pnSecondDropdown: HTMLElement = null;\n pnSumField: HTMLElement = null;\n pnConfirmDeleteButton: HTMLElement = null;\n pnAbortDeleteButton: HTMLElement = null;\n\n @Prop() dropdownData: string | Root[] = null;\n @Prop() languageCode: string = null;\n @Prop() firstDropdownLabel: string = null;\n @Prop() firstDropdownHelperText: string = null;\n @Prop() secondDropdownLabel: string = null;\n @Prop() secondDropdownHelperText: string = null;\n @Prop() secondDropdownMax: number = null;\n @Prop() deleteMultipleRowsWarningText: string = null;\n @Prop() confirmDeleteButtonText: string = null;\n @Prop() abortDeleteButtonText: string = null;\n @Prop() fristInputLabel: 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() secondInputLabel: 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() dateDaysFromToday: number = 1;\n @Prop() yearsToAddToEndDate: number = null;\n @Prop() sumFieldLabel: string = null;\n @Prop() addRowText: string = null;\n @Prop() elementHelperText: string = null;\n\n @State() dropdownDataRoot: Root[] = null;\n @State() secondDropdownArr: number[] = [];\n @State() rowCount: number = null;\n @State() rowData: PredefinedValues[] = null;\n @State() formValues: FormValue[] = null;\n @State() firstValidDateString: string = '';\n @State() lastValidDateString: string = '';\n @State() rowSum: string = null;\n @State() minRowCount: number = null;\n @State() showDelteConfirm: boolean = false;\n\n @Event() allFormValues: EventEmitter<string>;\n\n private _firstDropdownSelection: string = null;\n private _secondDropdownSelection: number = null;\n\n private _defaultRow: PredefinedValues;\n\n constructor() {\n this._defaultRow = {\n id: this.generateUniqueId(),\n firstInput: '',\n secondInput: this.secondInputWarning !== null ? this.secondInputWarning.toString() : '',\n date: '',\n };\n }\n\n componentWillLoad() {\n this.formValues = [];\n this.setDropDownData();\n this.updateSecondDropdown();\n this.setRowData();\n this.setFirstValidDate();\n }\n\n componentDidLoad() {\n this.updateSum();\n }\n\n setDropDownData() {\n if (typeof this.dropdownData === 'string') {\n this.dropdownDataRoot = JSON.parse(this.dropdownData);\n } else {\n this.dropdownDataRoot = this.dropdownData;\n }\n\n if (this.dropdownDataRoot?.length) {\n this.dropdownDataRoot.forEach(element => {\n if (!element.value) {\n element.value = 0;\n }\n });\n }\n\n if (this.dropdownDataRoot.length > 0) {\n this.dropdownDataRoot[0].checked = true;\n this._firstDropdownSelection = this.dropdownDataRoot[0].label;\n this._secondDropdownSelection = this.dropdownDataRoot[0].value;\n this.minRowCount = this.dropdownDataRoot[0].value;\n }\n }\n\n updateSecondDropdown() {\n const selectedItem = this.dropdownDataRoot.find(arr => arr.checked === true);\n this.secondDropdownArr = [];\n\n for (let index = selectedItem.value; index <= this.secondDropdownMax; index++) {\n this.secondDropdownArr.push(index);\n }\n }\n\n updateSelectItemArr(arr: Root[], caption: string) {\n arr.forEach(item => {\n if (item.label === caption) {\n item.checked = !item.checked;\n } else {\n item.checked = false;\n }\n });\n return arr;\n }\n\n setRowData() {\n this.rowData = [];\n for (let index = 0; index < this._secondDropdownSelection; index++) {\n const row = Object.assign({}, this._defaultRow);\n row.id = this.generateUniqueId();\n this.rowData = [...this.rowData, row];\n }\n\n this.rowCount = this.rowData.length;\n }\n\n generateUniqueId() {\n return uuidv4();\n }\n\n setFirstValidDate() {\n const yearsToadd = this.yearsToAddToEndDate ? this.yearsToAddToEndDate : 2;\n const date = new Date();\n date.setDate(date.getDate() + this.dateDaysFromToday ?? 0);\n\n const year = date.getFullYear();\n const month = (date.getMonth() + 1).toString().padStart(2, '0');\n const day = date.getDate().toString().padStart(2, '0');\n const endYear = year + yearsToadd;\n\n this.firstValidDateString = `${year.toString()}-${month}-${day}`;\n this.lastValidDateString = `${endYear.toString()}-${month}-${day}`;\n }\n\n addRow(newRowId: string) {\n const newRow = Object.assign({}, this.rowData[0]);\n newRow.id = newRowId ? newRowId : this.generateUniqueId();\n newRow.date = '';\n this.rowData = [...this.rowData, newRow];\n this.rowCount = this.rowData.length;\n\n this._secondDropdownSelection = this.rowCount;\n this.secondDropdownArr = [...this.secondDropdownArr];\n this.updateSum();\n this.emitValuesIfValid();\n }\n\n handleFirstDropdown() {\n const selected = this.pnFirstDropdown.querySelector('[aria-selected=true]');\n const selectedValue = selected?.textContent;\n if (!selectedValue?.length) {\n return;\n }\n\n this.dropdownDataRoot.forEach(element => {\n element.checked = false;\n });\n const selectionRoot = this.dropdownDataRoot.find(x => x.value?.toString() === selectedValue);\n selectionRoot.checked = true;\n this._firstDropdownSelection = selectionRoot.label;\n this.minRowCount = selectionRoot.value;\n\n if (selectionRoot.value > this._secondDropdownSelection) {\n this.dropdownDataRoot = [...this.dropdownDataRoot];\n\n for (let index = this.rowCount; index < selectionRoot.value; index++) {\n this.addRow(this.generateUniqueId());\n }\n }\n\n this.updateSecondDropdown();\n this.updateSum();\n this.emitValuesIfValid();\n }\n\n handleSecondDropdown() {\n const selected = this.pnSecondDropdown.querySelector('[aria-selected=true]');\n const selectedValue = selected?.textContent;\n if (!selectedValue?.length) {\n return;\n }\n\n const value = parseInt(selectedValue);\n if (value < this._secondDropdownSelection) {\n this.showDelteConfirm = true;\n } else {\n for (let index = this.rowCount; index < value; index++) {\n this.addRow(this.generateUniqueId());\n }\n }\n this.updateSum();\n this.emitValuesIfValid();\n }\n\n @Listen('rowValueChange')\n @Listen('firstInputChange')\n @Listen('secondInputChange')\n predefinedValueChange(e) {\n const indexToUpdate = this.rowData.findIndex(data => data.id === e.detail.id);\n const val: PredefinedValues = e.detail;\n this.rowData[indexToUpdate] = {\n ...this.rowData[indexToUpdate],\n firstInput: val.firstInput,\n secondInput: val.secondInput,\n date: val.date,\n };\n\n if (e.type === 'firstInputChange' && indexToUpdate === 0) {\n this.updateFirstInputOfRows(val.firstInput);\n }\n\n if (e.type === 'secondInputChange' && indexToUpdate === 0) {\n this.updateSecondInputOfRows(val.secondInput);\n }\n\n this.rowData = [...this.rowData];\n this.emitValuesIfValid();\n this.updateSum();\n }\n\n updateFirstInputOfRows(value: string) {\n for (let index = 1; index < this.rowCount; index++) {\n this.rowData[index] = {\n ...this.rowData[index],\n firstInput: value,\n };\n }\n }\n\n updateSecondInputOfRows(value: string) {\n for (let index = 1; index < this.rowCount; index++) {\n this.rowData[index] = {\n ...this.rowData[index],\n secondInput: value,\n };\n }\n }\n\n @Listen('deleteRowEvent')\n deleteRowEvent(e) {\n const indexToRemove = this.rowData.findIndex(data => data.id === e.detail);\n if (indexToRemove < 0) {\n return;\n }\n\n this.rowData.splice(indexToRemove, 1);\n this.rowData = [...this.rowData];\n this.rowCount = this.rowData.length;\n\n this._secondDropdownSelection = this.rowCount;\n this.secondDropdownArr = [...this.secondDropdownArr];\n this.emitValuesIfValid();\n this.updateSum();\n }\n\n updateSum() {\n this.rowSum = '';\n let sum = 0;\n this.rowData.forEach(element => {\n if (element?.firstInput?.length) {\n sum += parseInt(element.firstInput);\n }\n });\n\n this.rowSum = sum.toString();\n }\n\n deleteExcessRows() {\n const selected = this.pnSecondDropdown.querySelector('[aria-selected=true]');\n const selectedValue = selected?.textContent;\n if (!selectedValue?.length) {\n return;\n }\n const rowsToDelete = this.rowCount - parseInt(selectedValue);\n for (let index = 0; index < rowsToDelete; index++) {\n this.rowData.pop();\n }\n this.rowData = [...this.rowData];\n this.showDelteConfirm = false;\n this.updateSum();\n }\n\n abortDeleteRows() {\n this.showDelteConfirm = false;\n }\n\n emitValuesIfValid() {\n this.formValues = [];\n this.rowData.forEach(item => {\n const rowValue: FormValue = { row: [] };\n if (this._firstDropdownSelection?.length) {\n const dropDownValue: RowValue = { name: this.firstDropdownLabel, value: this._firstDropdownSelection };\n rowValue.row.push(dropDownValue);\n }\n \n if (item.firstInput?.length) {\n const firstInputValue: RowValue = { name: this.fristInputLabel, value: item.firstInput };\n rowValue.row.push(firstInputValue);\n }\n \n if (item.secondInput?.length) {\n const secondInputValue: RowValue = { name: this.secondInputLabel, value: item.secondInput };\n rowValue.row.push(secondInputValue);\n }\n\n if (item.date) {\n const dateValue: RowValue = { name: this.dateLabel, value: item.date };\n rowValue.row.push(dateValue);\n }\n \n if (rowValue.row.length === 4) {\n this.formValues.push(rowValue);\n }\n });\n \n if (this.formValues.length === this.rowData.length) {\n const valueJsonString = JSON.stringify(this.formValues);\n this.allFormValues.emit(valueJsonString);\n } else {\n this.allFormValues.emit('');\n }\n }\n\n render() {\n return (\n <Host class=\"dropdown-with-multi-input-elemet\">\n <div class=\"dropdown-with-multi-input-elemet__row\">\n <div>\n <pn-select ref={el => (this.pnFirstDropdown = el as HTMLElement)} class=\"pn-row-select-dropdown dropDown1-dropdown\" label={this.firstDropdownLabel} empty-option=\"true\" language={this.languageCode}>\n {this.dropdownDataRoot?.map((item, i) => (\n <pn-option index={i} label={item.value} value={item.value} selected={item.checked} onClick={debounce(this.handleFirstDropdown.bind(this), 500)}></pn-option>\n ))}\n </pn-select>\n {this.firstDropdownHelperText?.length ? <small>{this.firstDropdownHelperText}</small> : null}\n </div>\n </div>\n\n <div class=\"dropdown-with-multi-input-elemet__row\">\n <div>\n <pn-select ref={el => (this.pnSecondDropdown = el as HTMLElement)} class=\"pn-row-select-dropdown dropDown2-dropdown\" label={this.secondDropdownLabel} empty-option=\"true\" language={this.languageCode}>\n {this.secondDropdownArr?.map((item, i) => (\n <pn-option index={i} label={item} value={item} selected={item === this._secondDropdownSelection} onClick={debounce(this.handleSecondDropdown.bind(this), 500)}></pn-option>\n ))}\n </pn-select>\n {this.secondDropdownHelperText?.length ? <small>{this.secondDropdownHelperText}</small> : null}\n </div>\n </div>\n\n {this.showDelteConfirm ? (\n <div class=\"dropdown-with-multi-input-elemet__delete\">\n <p>{this.deleteMultipleRowsWarningText}</p>\n <pn-button ref={el => (this.pnConfirmDeleteButton = el as HTMLElement)} small=\"true\" appearance=\"warning\" onClick={this.deleteExcessRows.bind(this)}>\n {this.confirmDeleteButtonText}\n </pn-button>\n <pn-button ref={el => (this.pnAbortDeleteButton = el as HTMLElement)} small=\"true\" appearance=\"light\" onClick={this.abortDeleteRows.bind(this)}>\n {this.abortDeleteButtonText}\n </pn-button>\n </div>\n ) : null}\n\n <div class=\"dropdown-with-multi-input-elemet__label-row\">\n <div class=\"dropdown-with-multi-input-elemet__label\">\n <label>{this.fristInputLabel}</label>\n </div>\n <div class=\"dropdown-with-multi-input-elemet__label\">\n <label>{this.secondInputLabel}</label>\n </div>\n <div class=\"dropdown-with-multi-input-elemet__label\">\n <label>{this.dateLabel}</label>\n </div>\n </div>\n\n {this.rowData?.map((data, i) => {\n return (\n <div class={'dropdown-with-multi-input-elemet__row generated-row-' + i} id={'generated-row-' + i}>\n <pn-dropdown-with-multi-input-rows-row\n language-code={this.languageCode}\n frist-input-placeholder={this.fristInputPlaceholder}\n first-input-min={this.firstInputMin}\n first-input-max={this.firstInputMax}\n first-input-warning={this.firstInputWarning}\n first-input-warning-text={this.firstInputWarningText}\n first-input-low-error-text={this.firstInputLowErrorText}\n first-input-high-error-text={this.firstInputHighErrorText}\n second-input-placeholder={this.secondInputPlaceholder}\n second-input-min={this.secondInputMin}\n second-input-max={this.secondInputMax}\n second-input-warning={this.secondInputWarning}\n second-input-warning-text={this.secondInputWarningText}\n second-input-low-error-text={this.secondInputLowErrorText}\n second-input-high-error-text={this.secondInputHighErrorText}\n datePlaceholder={this.datePlaceholder}\n firstValidDate={this.firstValidDateString}\n lastValidDate={this.lastValidDateString}\n predefined-value={JSON.stringify(data)}\n min-row-count={this.minRowCount}\n row-index={i}\n ></pn-dropdown-with-multi-input-rows-row>\n </div>\n );\n })}\n\n <div class=\"dropdown-with-multi-input-elemet__row sum-row\">\n <pn-marketweb-input disabled={true} ref={el => (this.pnSumField = el as HTMLElement)} type=\"number\" value={this.rowSum} label={this.sumFieldLabel}></pn-marketweb-input>\n\n <pn-button\n tooltip={this.addRowText ? this.addRowText : null}\n left-icon=\"true\"\n arialabel=\"Add\"\n icon={plus}\n appearance=\"light\"\n variant=\"borderless\"\n class=\"connected-dropdown__button-right\"\n onClick={() => {\n this.addRow(this.generateUniqueId());\n }}\n >\n {this.addRowText}\n </pn-button>\n </div>\n\n {this.elementHelperText?.length ? <div class=\"dropdown-with-multi-input-elemet__row\">{this.elementHelperText}</div> : null}\n </Host>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"pn-dropdown-with-multi-input-rows.js","mappings":"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","names":["PnDropdownWithMultiInputRows","uuidv4"],"sources":["src/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows.scss?tag=pn-dropdown-with-multi-input-rows","src/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-dropdown-with-multi-input-rows {\n .dropdown-with-multi-input-elemet {\n &__row {\n margin-bottom: 1rem;\n }\n\n &__delete {\n display: flex;\n gap: 1rem;\n margin-bottom: 1rem;\n padding: 1rem;\n background-color: $gray25;\n\n pn-button {\n margin-top: 0.9rem;\n }\n }\n\n &__label-row {\n display: flex;\n gap: 1rem;\n }\n\n &__label {\n width: 30%;\n font-size: 0.875em;\n color: #5e554a;\n }\n }\n\n .sum-row {\n display: flex;\n justify-content: space-between;\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 { v4 as uuidv4 } from 'uuid';\nimport debounce from 'debounce';\nimport { plus } from 'pn-design-assets/pn-assets/icons.js';\n\n@Component({\n tag: 'pn-dropdown-with-multi-input-rows',\n styleUrl: 'pn-dropdown-with-multi-input-rows.scss',\n})\nexport class PnDropdownWithMultiInputRows {\n @Element() hostElement: Element;\n pnFirstDropdown: HTMLElement = null;\n pnSecondDropdown: HTMLElement = null;\n pnSumField: HTMLElement = null;\n pnConfirmDeleteButton: HTMLElement = null;\n pnAbortDeleteButton: HTMLElement = null;\n\n @Prop() dropdownData: string | Root[] = null;\n @Prop() languageCode: string = null;\n @Prop() firstDropdownLabel: string = null;\n @Prop() firstDropdownHelperText: string = null;\n @Prop() secondDropdownLabel: string = null;\n @Prop() secondDropdownHelperText: string = null;\n @Prop() secondDropdownMax: number = null;\n @Prop() deleteMultipleRowsWarningText: string = null;\n @Prop() confirmDeleteButtonText: string = null;\n @Prop() abortDeleteButtonText: string = null;\n @Prop() fristInputLabel: 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() secondInputLabel: 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() dateDaysFromToday: number = 1;\n @Prop() yearsToAddToEndDate: number = null;\n @Prop() sumFieldLabel: string = null;\n @Prop() addRowText: string = null;\n @Prop() elementHelperText: string = null;\n\n @State() dropdownDataRoot: Root[] = null;\n @State() secondDropdownArr: number[] = [];\n @State() rowCount: number = null;\n @State() rowData: PredefinedValues[] = null;\n @State() formValues: FormValue[] = null;\n @State() firstValidDateString: string = '';\n @State() lastValidDateString: string = '';\n @State() rowSum: string = null;\n @State() minRowCount: number = null;\n @State() showDelteConfirm: boolean = false;\n\n @Event() allFormValues: EventEmitter<string>;\n\n private _firstDropdownSelection: string = null;\n private _secondDropdownSelection: number = null;\n\n private _defaultRow: PredefinedValues;\n\n constructor() {\n this._defaultRow = {\n id: this.generateUniqueId(),\n firstInput: '',\n secondInput: this.secondInputWarning !== null ? this.secondInputWarning.toString() : '',\n date: '',\n };\n }\n\n componentWillLoad() {\n this.formValues = [];\n this.setDropDownData();\n this.updateSecondDropdown();\n this.setRowData();\n this.setFirstValidDate();\n }\n\n componentDidLoad() {\n this.updateSum();\n }\n\n setDropDownData() {\n if (typeof this.dropdownData === 'string') {\n this.dropdownDataRoot = JSON.parse(this.dropdownData);\n } else {\n this.dropdownDataRoot = this.dropdownData;\n }\n\n if (this.dropdownDataRoot?.length) {\n this.dropdownDataRoot.forEach(element => {\n if (!element.value) {\n element.value = 0;\n }\n });\n }\n\n if (this.dropdownDataRoot.length > 0) {\n this.dropdownDataRoot[0].checked = true;\n this._firstDropdownSelection = this.dropdownDataRoot[0].label;\n this._secondDropdownSelection = this.dropdownDataRoot[0].value;\n this.minRowCount = this.dropdownDataRoot[0].value;\n }\n }\n\n updateSecondDropdown() {\n const selectedItem = this.dropdownDataRoot.find(arr => arr.checked === true);\n this.secondDropdownArr = [];\n\n for (let index = selectedItem.value; index <= this.secondDropdownMax; index++) {\n this.secondDropdownArr.push(index);\n }\n }\n\n updateSelectItemArr(arr: Root[], caption: string) {\n arr.forEach(item => {\n if (item.label === caption) {\n item.checked = !item.checked;\n } else {\n item.checked = false;\n }\n });\n return arr;\n }\n\n setRowData() {\n this.rowData = [];\n for (let index = 0; index < this._secondDropdownSelection; index++) {\n const row = Object.assign({}, this._defaultRow);\n row.id = this.generateUniqueId();\n this.rowData = [...this.rowData, row];\n }\n\n this.rowCount = this.rowData.length;\n }\n\n generateUniqueId() {\n return uuidv4();\n }\n\n setFirstValidDate() {\n const yearsToadd = this.yearsToAddToEndDate ? this.yearsToAddToEndDate : 2;\n const date = new Date();\n date.setDate(date.getDate() + this.dateDaysFromToday ?? 0);\n\n const year = date.getFullYear();\n const month = (date.getMonth() + 1).toString().padStart(2, '0');\n const day = date.getDate().toString().padStart(2, '0');\n const endYear = year + yearsToadd;\n\n this.firstValidDateString = `${year.toString()}-${month}-${day}`;\n this.lastValidDateString = `${endYear.toString()}-${month}-${day}`;\n }\n\n addRow(newRowId: string) {\n const newRow = Object.assign({}, this.rowData[0]);\n newRow.id = newRowId ? newRowId : this.generateUniqueId();\n newRow.date = '';\n this.rowData = [...this.rowData, newRow];\n this.rowCount = this.rowData.length;\n\n this._secondDropdownSelection = this.rowCount;\n this.secondDropdownArr = [...this.secondDropdownArr];\n this.updateSum();\n this.emitValuesIfValid();\n }\n\n handleFirstDropdown() {\n const selected = this.pnFirstDropdown.querySelector('[aria-selected=true]');\n const selectedValue = selected?.textContent;\n if (!selectedValue?.length) {\n return;\n }\n\n this.dropdownDataRoot.forEach(element => {\n element.checked = false;\n });\n const selectionRoot = this.dropdownDataRoot.find(x => x.label === selectedValue);\n selectionRoot.checked = true;\n this._firstDropdownSelection = selectionRoot.label;\n this.minRowCount = selectionRoot.value;\n\n if (selectionRoot.value > this._secondDropdownSelection) {\n this.dropdownDataRoot = [...this.dropdownDataRoot];\n\n for (let index = this.rowCount; index < selectionRoot.value; index++) {\n this.addRow(this.generateUniqueId());\n }\n }\n\n this.updateSecondDropdown();\n this.updateSum();\n this.emitValuesIfValid();\n }\n\n handleSecondDropdown() {\n const selected = this.pnSecondDropdown.querySelector('[aria-selected=true]');\n const selectedValue = selected?.textContent;\n if (!selectedValue?.length) {\n return;\n }\n\n const value = parseInt(selectedValue);\n if (value < this._secondDropdownSelection) {\n this.showDelteConfirm = true;\n } else {\n for (let index = this.rowCount; index < value; index++) {\n this.addRow(this.generateUniqueId());\n }\n }\n this.updateSum();\n this.emitValuesIfValid();\n }\n\n @Listen('rowValueChange')\n @Listen('firstInputChange')\n @Listen('secondInputChange')\n predefinedValueChange(e) {\n const indexToUpdate = this.rowData.findIndex(data => data.id === e.detail.id);\n const val: PredefinedValues = e.detail;\n this.rowData[indexToUpdate] = {\n ...this.rowData[indexToUpdate],\n firstInput: val.firstInput,\n secondInput: val.secondInput,\n date: val.date,\n };\n\n if (e.type === 'firstInputChange' && indexToUpdate === 0) {\n this.updateFirstInputOfRows(val.firstInput);\n }\n\n if (e.type === 'secondInputChange' && indexToUpdate === 0) {\n this.updateSecondInputOfRows(val.secondInput);\n }\n\n this.rowData = [...this.rowData];\n this.emitValuesIfValid();\n this.updateSum();\n }\n\n updateFirstInputOfRows(value: string) {\n for (let index = 1; index < this.rowCount; index++) {\n this.rowData[index] = {\n ...this.rowData[index],\n firstInput: value,\n };\n }\n }\n\n updateSecondInputOfRows(value: string) {\n for (let index = 1; index < this.rowCount; index++) {\n this.rowData[index] = {\n ...this.rowData[index],\n secondInput: value,\n };\n }\n }\n\n @Listen('deleteRowEvent')\n deleteRowEvent(e) {\n const indexToRemove = this.rowData.findIndex(data => data.id === e.detail);\n if (indexToRemove < 0) {\n return;\n }\n\n this.rowData.splice(indexToRemove, 1);\n this.rowData = [...this.rowData];\n this.rowCount = this.rowData.length;\n\n this._secondDropdownSelection = this.rowCount;\n this.secondDropdownArr = [...this.secondDropdownArr];\n this.emitValuesIfValid();\n this.updateSum();\n }\n\n updateSum() {\n this.rowSum = '';\n let sum = 0;\n this.rowData.forEach(element => {\n if (element?.firstInput?.length) {\n sum += parseInt(element.firstInput);\n }\n });\n\n this.rowSum = sum.toString();\n }\n\n deleteExcessRows() {\n const selected = this.pnSecondDropdown.querySelector('[aria-selected=true]');\n const selectedValue = selected?.textContent;\n if (!selectedValue?.length) {\n return;\n }\n const rowsToDelete = this.rowCount - parseInt(selectedValue);\n for (let index = 0; index < rowsToDelete; index++) {\n this.rowData.pop();\n }\n this.rowData = [...this.rowData];\n this.showDelteConfirm = false;\n this.updateSum();\n }\n\n abortDeleteRows() {\n this.showDelteConfirm = false;\n }\n\n emitValuesIfValid() {\n this.formValues = [];\n this.rowData.forEach(item => {\n const rowValue: FormValue = { row: [] };\n if (this._firstDropdownSelection?.length) {\n const dropDownValue: RowValue = { name: this.firstDropdownLabel, value: this._firstDropdownSelection };\n rowValue.row.push(dropDownValue);\n }\n \n if (item.firstInput?.length) {\n const firstInputValue: RowValue = { name: this.fristInputLabel, value: item.firstInput };\n rowValue.row.push(firstInputValue);\n }\n \n if (item.secondInput?.length) {\n const secondInputValue: RowValue = { name: this.secondInputLabel, value: item.secondInput };\n rowValue.row.push(secondInputValue);\n }\n\n if (item.date) {\n const dateValue: RowValue = { name: this.dateLabel, value: item.date };\n rowValue.row.push(dateValue);\n }\n \n if (rowValue.row.length === 4) {\n this.formValues.push(rowValue);\n }\n });\n \n if (this.formValues.length === this.rowData.length) {\n const valueJsonString = JSON.stringify(this.formValues);\n this.allFormValues.emit(valueJsonString);\n } else {\n this.allFormValues.emit('');\n }\n }\n\n render() {\n return (\n <Host class=\"dropdown-with-multi-input-elemet\">\n <div class=\"dropdown-with-multi-input-elemet__row\">\n <div>\n <pn-select ref={el => (this.pnFirstDropdown = el as HTMLElement)} class=\"pn-row-select-dropdown dropDown1-dropdown\" label={this.firstDropdownLabel} empty-option=\"true\" language={this.languageCode}>\n {this.dropdownDataRoot?.map((item, i) => (\n <pn-option index={i} label={item.label} value={item.value} selected={item.checked} onClick={debounce(this.handleFirstDropdown.bind(this), 500)}></pn-option>\n ))}\n </pn-select>\n {this.firstDropdownHelperText?.length ? <small>{this.firstDropdownHelperText}</small> : null}\n </div>\n </div>\n\n <div class=\"dropdown-with-multi-input-elemet__row\">\n <div>\n <pn-select ref={el => (this.pnSecondDropdown = el as HTMLElement)} class=\"pn-row-select-dropdown dropDown2-dropdown\" label={this.secondDropdownLabel} empty-option=\"true\" language={this.languageCode}>\n {this.secondDropdownArr?.map((item, i) => (\n <pn-option index={i} label={item} value={item} selected={item === this._secondDropdownSelection} onClick={debounce(this.handleSecondDropdown.bind(this), 500)}></pn-option>\n ))}\n </pn-select>\n {this.secondDropdownHelperText?.length ? <small>{this.secondDropdownHelperText}</small> : null}\n </div>\n </div>\n\n {this.showDelteConfirm ? (\n <div class=\"dropdown-with-multi-input-elemet__delete\">\n <p>{this.deleteMultipleRowsWarningText}</p>\n <pn-button ref={el => (this.pnConfirmDeleteButton = el as HTMLElement)} small=\"true\" appearance=\"warning\" onClick={this.deleteExcessRows.bind(this)}>\n {this.confirmDeleteButtonText}\n </pn-button>\n <pn-button ref={el => (this.pnAbortDeleteButton = el as HTMLElement)} small=\"true\" appearance=\"light\" onClick={this.abortDeleteRows.bind(this)}>\n {this.abortDeleteButtonText}\n </pn-button>\n </div>\n ) : null}\n\n <div class=\"dropdown-with-multi-input-elemet__label-row\">\n <div class=\"dropdown-with-multi-input-elemet__label\">\n <label>{this.fristInputLabel}</label>\n </div>\n <div class=\"dropdown-with-multi-input-elemet__label\">\n <label>{this.secondInputLabel}</label>\n </div>\n <div class=\"dropdown-with-multi-input-elemet__label\">\n <label>{this.dateLabel}</label>\n </div>\n </div>\n\n {this.rowData?.map((data, i) => {\n return (\n <div class={'dropdown-with-multi-input-elemet__row generated-row-' + i} id={'generated-row-' + i}>\n <pn-dropdown-with-multi-input-rows-row\n language-code={this.languageCode}\n frist-input-placeholder={this.fristInputPlaceholder}\n first-input-min={this.firstInputMin}\n first-input-max={this.firstInputMax}\n first-input-warning={this.firstInputWarning}\n first-input-warning-text={this.firstInputWarningText}\n first-input-low-error-text={this.firstInputLowErrorText}\n first-input-high-error-text={this.firstInputHighErrorText}\n second-input-placeholder={this.secondInputPlaceholder}\n second-input-min={this.secondInputMin}\n second-input-max={this.secondInputMax}\n second-input-warning={this.secondInputWarning}\n second-input-warning-text={this.secondInputWarningText}\n second-input-low-error-text={this.secondInputLowErrorText}\n second-input-high-error-text={this.secondInputHighErrorText}\n datePlaceholder={this.datePlaceholder}\n firstValidDate={this.firstValidDateString}\n lastValidDate={this.lastValidDateString}\n predefined-value={JSON.stringify(data)}\n min-row-count={this.minRowCount}\n row-index={i}\n ></pn-dropdown-with-multi-input-rows-row>\n </div>\n );\n })}\n\n <div class=\"dropdown-with-multi-input-elemet__row sum-row\">\n <pn-marketweb-input disabled={true} ref={el => (this.pnSumField = el as HTMLElement)} type=\"number\" value={this.rowSum} label={this.sumFieldLabel}></pn-marketweb-input>\n\n <pn-button\n tooltip={this.addRowText ? this.addRowText : null}\n left-icon=\"true\"\n arialabel=\"Add\"\n icon={plus}\n appearance=\"light\"\n variant=\"borderless\"\n class=\"connected-dropdown__button-right\"\n onClick={() => {\n this.addRow(this.generateUniqueId());\n }}\n >\n {this.addRowText}\n </pn-button>\n </div>\n\n {this.elementHelperText?.length ? <div class=\"dropdown-with-multi-input-elemet__row\">{this.elementHelperText}</div> : null}\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -23,7 +23,7 @@ const PnTeaserCard$1 = /*@__PURE__*/ proxyCustomElement(class PnTeaserCard exten
|
|
|
23
23
|
//render
|
|
24
24
|
render() {
|
|
25
25
|
const labelToCapitals = this.label?.toUpperCase();
|
|
26
|
-
return (h(Host, { key: 'fdbbca9a340be605fab4928fd899e2ed7d6da987' }, h("slot", { key: '73c277568a6552fc2cdad9449c5805198f6c4c39', name: "clickable-block-wrapper" }), h("div", { key: '263a5919c76eb373958d3ef92aa90ed67656d25e', class: "pn-teaser-card__container" }, h("div", { key: '11cd5bc0d913acc378f960ec4d3baf0c7d3ecc99', class: `pn-teaser-card__container__image__container ${!this.hasIllustrationSlot ? 'pn-teaser-card__container__image__container--no-image' : ''}` }, h("slot", { key: '71893f8f45c0275c68c59768582a663737fd5eea', name: "illustration" })), h("div", { key: '99a874f3c2a22983edcab63a018050d47cbdc5d0', class: "pn-teaser-card__container__content" }, h("div", { key: '451ae56adec502481416822c169a01774fa262aa', class: "pn-teaser-card__container__content__text__container" }, labelToCapitals && h("span", { key: '2dfcef1bf94c1caea50c0f86263fea71713bf572', class: "pn-teaser-card__container__content__text__container__label" }, labelToCapitals), h("
|
|
26
|
+
return (h(Host, { key: 'fdbbca9a340be605fab4928fd899e2ed7d6da987' }, h("slot", { key: '73c277568a6552fc2cdad9449c5805198f6c4c39', name: "clickable-block-wrapper" }), h("div", { key: '263a5919c76eb373958d3ef92aa90ed67656d25e', class: "pn-teaser-card__container" }, h("div", { key: '11cd5bc0d913acc378f960ec4d3baf0c7d3ecc99', class: `pn-teaser-card__container__image__container ${!this.hasIllustrationSlot ? 'pn-teaser-card__container__image__container--no-image' : ''}` }, h("slot", { key: '71893f8f45c0275c68c59768582a663737fd5eea', name: "illustration" })), h("div", { key: '99a874f3c2a22983edcab63a018050d47cbdc5d0', class: "pn-teaser-card__container__content" }, h("div", { key: '451ae56adec502481416822c169a01774fa262aa', class: "pn-teaser-card__container__content__text__container" }, labelToCapitals && h("span", { key: '2dfcef1bf94c1caea50c0f86263fea71713bf572', class: "pn-teaser-card__container__content__text__container__label" }, labelToCapitals), h("h3", { key: 'bd796379bb1bb106aea2de582df537a804f4c415', class: "pn-teaser-card__container__content__text__container__heading" }, this.heading), h("p", { key: 'ec25bea0041371fb67bb414cbc731d46234b118a', class: "pn-teaser-card__container__content__text__container__preamble" }, this.text)), this.hasCtaSlotContent && (h("div", { key: '6ebbe23c0584a63325e2faff4eb3979f804869aa', class: "pn-teaser-card__container__content__cta" }, h("slot", { key: '0a87639586c866e4e2439c67951362abe7a2f26d', name: "cta" })))))));
|
|
27
27
|
}
|
|
28
28
|
static get style() { return PnTeaserCardStyle0; }
|
|
29
29
|
}, [4, "pn-teaser-card", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"pn-teaser-card.js","mappings":";;AAAA,MAAM,eAAe,GAAG,g0RAAg0R,CAAC;AACz1R,2BAAe,eAAe;;MCKjBA,cAAY;;;;oBAGA,IAAI;uBACD,IAAI;qBACL,IAAI;6BACoB,OAAO;iCACH,MAAM;iCAErB,KAAK;mCACH,IAAI;;;IAE5C,iBAAiB;QACf,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;QAC1E,IAAI,CAAC,mBAAmB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;KACtF;;IAGD,MAAM;QACJ,MAAM,eAAe,GAAG,IAAI,CAAC,KAAK,EAAE,WAAW,EAAE,CAAC;QAElD,QACE,EAAC,IAAI,uDACH,6DAAM,IAAI,EAAC,yBAAyB,GAAG,EACvC,4DAAK,KAAK,EAAC,2BAA2B,IACpC,4DAAK,KAAK,EAAE,+CAA+C,CAAC,IAAI,CAAC,mBAAmB,GAAG,uDAAuD,GAAG,EAAE,EAAE,IACnJ,6DAAM,IAAI,EAAC,cAAc,GAAG,CACxB,EACN,4DAAK,KAAK,EAAC,oCAAoC,IAC7C,4DAAK,KAAK,EAAC,qDAAqD,IAC7D,eAAe,IAAI,6DAAM,KAAK,EAAC,4DAA4D,IAAE,eAAe,CAAQ,EACrH,2DAAI,KAAK,EAAC,8DAA8D,IAAE,IAAI,CAAC,OAAO,CAAM,EAC5F,0DAAG,KAAK,EAAC,+DAA+D,IAAE,IAAI,CAAC,IAAI,CAAK,CACpF,EACL,IAAI,CAAC,iBAAiB,KACrB,4DAAK,KAAK,EAAC,yCAAyC,IAClD,6DAAM,IAAI,EAAC,KAAK,GAAG,CACf,CACP,CACG,CACF,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["PnTeaserCard"],"sources":["src/components/cards/pn-teaser-card/pn-teaser-card.scss?tag=pn-teaser-card","src/components/cards/pn-teaser-card/pn-teaser-card.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\n$teaser-card-media-tablet: 768px; // 768px\n$teaser-card-media-desktop: 1200px; //1200px\n$teaser-card-media-large-desktop: 1640px; //1640\n\n//making pn wrapping link clickable over card image\n.block.teasercardblock {\n a[data-block-clickable-link='true'] {\n z-index: 1;\n }\n}\n\n//mobile first\npn-teaser-card {\n width: 100%;\n height: 100%;\n display: flex;\n\n .pn-teaser-card__container {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n border-radius: 2.4rem;\n width: 100%;\n }\n\n .pn-teaser-card__container__image__container {\n width: 100%;\n position: relative;\n\n & > [slot='illustration'] {\n clip-path: ellipse(100% 90% at 50% 0%);\n height: 100%;\n overflow: hidden;\n border-top-left-radius: 2.4rem;\n border-top-right-radius: 2.4rem;\n\n & > picture > img {\n width: 100%;\n height: auto;\n transition: 0.4s ease-in-out;\n transform: scale(1);\n aspect-ratio: 16/9;\n object-fit: cover;\n object-position: 50% 0;\n }\n }\n }\n\n .pn-teaser-card__container__content {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n flex: 1 1 100%;\n gap: 3.2rem;\n padding: 2.4rem 2.4rem;\n padding-top: 0;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 2.4rem;\n line-height: 2.64rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n padding-top: 1.6rem;\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 2.24rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__label {\n display: block;\n margin-bottom: 1.6rem;\n font-weight: 400;\n font-size: 1.2rem;\n line-height: 140%;\n }\n\n .pn-teaser-card__container__content__cta {\n & > pn-button {\n align-self: flex-end;\n width: 100%;\n\n & a:hover {\n text-decoration: none;\n }\n\n & > button,\n & > a {\n & > .pn-button-bg {\n transition: 0.4s ease-in-out;\n }\n }\n\n @media screen and (min-width: $teaser-card-media-tablet) {\n width: fit-content;\n }\n }\n\n .secondary-link--animated {\n font-weight: 500;\n font-size: 1.6rem;\n text-decoration: none;\n color: $blue700;\n\n pn-icon svg {\n transition: 0.3s ease-in-out;\n position: relative;\n left: -0.3rem;\n\n path {\n fill: $blue700;\n }\n }\n\n &[target='_blank']:not(.pn-button):after {\n display: none;\n }\n }\n }\n}\n\n//colors\npn-teaser-card[data-card-color='coral'] {\n & > .pn-teaser-card__container {\n background-color: $coral50;\n }\n}\n\npn-teaser-card[data-card-color='green'] {\n & > .pn-teaser-card__container {\n background-color: $green50;\n }\n}\n\npn-teaser-card[data-card-color='blue'] {\n & > .pn-teaser-card__container {\n background-color: $blue25;\n }\n}\n\npn-teaser-card[data-card-color='blue50'] {\n & > .pn-teaser-card__container {\n background-color: $blue50;\n }\n}\n\npn-teaser-card[data-card-color='blue400'] {\n & > .pn-teaser-card__container {\n background-color: $blue400;\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__heading,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='blue900'] {\n & > .pn-teaser-card__container {\n background-color: $blue900;\n .pn-teaser-card__container__content__text__container__heading {\n color: $coral400;\n }\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='white'] {\n & > .pn-teaser-card__container {\n background-color: $white;\n }\n}\n\n//color override when in a listblock\n.teasercardlistblock {\n .teasercardblock.has-bg {\n background-color: transparent;\n background: transparent;\n }\n}\n\n// variants\n\n.onequarterwidth {\n .pn-teaser-card__container__content__text__container__label {\n @media screen and (min-width: $teaser-card-media-desktop) {\n margin-bottom: 0.8rem;\n }\n }\n}\n\n.onethirdwidth,\n.onequarterwidth {\n & > pn-teaser-card {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n }\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n}\n\n.halfwidth {\n & > pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: 992px) {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n }\n\n @media screen and (min-width: $teaser-card-media-desktop) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 4rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 4rem 4rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 3.2rem;\n line-height: 3.52rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-weight: 400;\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n\n @media screen and (min-width: $teaser-card-media-large-desktop) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 5.6rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 5.6rem 5.6rem;\n }\n }\n }\n}\n\n.fullwidth {\n & > pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n width: auto;\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $teaser-card-media-tablet) {\n min-height: 35rem;\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n\n .pn-teaser-card__container {\n flex-direction: row;\n }\n\n .pn-teaser-card__container__content {\n align-self: center;\n gap: 2.4rem;\n padding: 3.2rem 3.2rem 3.2rem 2.4rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-top-left-radius: 2.4rem;\n border-bottom-left-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 0% 50%);\n\n & > picture > img {\n height: 100%;\n object-fit: cover;\n }\n }\n }\n }\n\n @media screen and (min-width: $teaser-card-media-desktop) {\n min-height: 52rem;\n\n .pn-teaser-card__container__content {\n padding: 4rem 4rem 4rem 3.2rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 4.8rem;\n line-height: 5.28rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n }\n\n pn-teaser-card[data-card-alignment='right'] {\n @media screen and (min-width: $teaser-card-media-tablet) {\n .pn-teaser-card__container {\n flex-direction: row-reverse;\n }\n\n .pn-teaser-card__container__content {\n padding: 3.2rem 2.4rem 3.2rem 3.2rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-bottom-right-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 100% 50%);\n }\n }\n }\n\n @media screen and (min-width: $teaser-card-media-desktop) {\n .pn-teaser-card__container__content {\n padding: 4rem 3.2rem 4rem 4rem;\n }\n }\n }\n}\n\n//effect class\npn-teaser-card.teaser-card--hover-effect {\n &:hover {\n cursor: pointer;\n .pn-teaser-card__container__image__container {\n & [slot='illustration'] {\n & picture > img {\n transform: scale(1.02);\n filter: brightness(0.85);\n }\n }\n }\n\n .secondary-link--animated {\n text-decoration: underline;\n\n pn-icon svg {\n left: 0;\n }\n }\n\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue900;\n }\n }\n }\n\n &[data-card-color='blue900'] {\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue400;\n }\n }\n }\n }\n }\n}\n","import { Component, Prop, h, Element, State, Host } from \"@stencil/core\";\n\n@Component({\n tag: 'pn-teaser-card',\n styleUrl: 'pn-teaser-card.scss'\n})\nexport class PnTeaserCard {\n @Element() hostElement: HTMLElement;\n //props\n @Prop() text: string = null;\n @Prop() heading: string = null;\n @Prop() label?: string = null;\n @Prop({ reflect: true }) dataCardColor: string = 'coral';\n @Prop({ reflect: true }) dataCardAlignment: string = 'left';\n\n @State() hasCtaSlotContent: boolean = false;\n @State() hasIllustrationSlot: boolean = true;\n\n componentWillLoad() {\n this.hasCtaSlotContent = !!this.hostElement.querySelector('[slot=\"cta\"]');\n this.hasIllustrationSlot = !!this.hostElement.querySelector('[slot=\"illustration\"]');\n }\n\n //render\n render() {\n const labelToCapitals = this.label?.toUpperCase();\n\n return (\n <Host>\n <slot name=\"clickable-block-wrapper\" />\n <div class=\"pn-teaser-card__container\">\n <div class={`pn-teaser-card__container__image__container ${!this.hasIllustrationSlot ? 'pn-teaser-card__container__image__container--no-image' : ''}`}>\n <slot name=\"illustration\" />\n </div>\n <div class=\"pn-teaser-card__container__content\">\n <div class=\"pn-teaser-card__container__content__text__container\">\n {labelToCapitals && <span class=\"pn-teaser-card__container__content__text__container__label\">{labelToCapitals}</span>}\n <h2 class=\"pn-teaser-card__container__content__text__container__heading\">{this.heading}</h2>\n <p class=\"pn-teaser-card__container__content__text__container__preamble\">{this.text}</p>\n </div>\n {this.hasCtaSlotContent && (\n <div class=\"pn-teaser-card__container__content__cta\">\n <slot name=\"cta\" />\n </div>\n )}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"pn-teaser-card.js","mappings":";;AAAA,MAAM,eAAe,GAAG,g0RAAg0R,CAAC;AACz1R,2BAAe,eAAe;;MCKjBA,cAAY;;;;oBAGA,IAAI;uBACD,IAAI;qBACL,IAAI;6BACoB,OAAO;iCACH,MAAM;iCAErB,KAAK;mCACH,IAAI;;;IAE5C,iBAAiB;QACf,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;QAC1E,IAAI,CAAC,mBAAmB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;KACtF;;IAGD,MAAM;QACJ,MAAM,eAAe,GAAG,IAAI,CAAC,KAAK,EAAE,WAAW,EAAE,CAAC;QAElD,QACE,EAAC,IAAI,uDACH,6DAAM,IAAI,EAAC,yBAAyB,GAAG,EACvC,4DAAK,KAAK,EAAC,2BAA2B,IACpC,4DAAK,KAAK,EAAE,+CAA+C,CAAC,IAAI,CAAC,mBAAmB,GAAG,uDAAuD,GAAG,EAAE,EAAE,IACnJ,6DAAM,IAAI,EAAC,cAAc,GAAG,CACxB,EACN,4DAAK,KAAK,EAAC,oCAAoC,IAC7C,4DAAK,KAAK,EAAC,qDAAqD,IAC7D,eAAe,IAAI,6DAAM,KAAK,EAAC,4DAA4D,IAAE,eAAe,CAAQ,EACrH,2DAAI,KAAK,EAAC,8DAA8D,IAAE,IAAI,CAAC,OAAO,CAAM,EAC5F,0DAAG,KAAK,EAAC,+DAA+D,IAAE,IAAI,CAAC,IAAI,CAAK,CACpF,EACL,IAAI,CAAC,iBAAiB,KACrB,4DAAK,KAAK,EAAC,yCAAyC,IAClD,6DAAM,IAAI,EAAC,KAAK,GAAG,CACf,CACP,CACG,CACF,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["PnTeaserCard"],"sources":["src/components/cards/pn-teaser-card/pn-teaser-card.scss?tag=pn-teaser-card","src/components/cards/pn-teaser-card/pn-teaser-card.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\n$teaser-card-media-tablet: 768px; // 768px\n$teaser-card-media-desktop: 1200px; //1200px\n$teaser-card-media-large-desktop: 1640px; //1640\n\n//making pn wrapping link clickable over card image\n.block.teasercardblock {\n a[data-block-clickable-link='true'] {\n z-index: 1;\n }\n}\n\n//mobile first\npn-teaser-card {\n width: 100%;\n height: 100%;\n display: flex;\n\n .pn-teaser-card__container {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n border-radius: 2.4rem;\n width: 100%;\n }\n\n .pn-teaser-card__container__image__container {\n width: 100%;\n position: relative;\n\n & > [slot='illustration'] {\n clip-path: ellipse(100% 90% at 50% 0%);\n height: 100%;\n overflow: hidden;\n border-top-left-radius: 2.4rem;\n border-top-right-radius: 2.4rem;\n\n & > picture > img {\n width: 100%;\n height: auto;\n transition: 0.4s ease-in-out;\n transform: scale(1);\n aspect-ratio: 16/9;\n object-fit: cover;\n object-position: 50% 0;\n }\n }\n }\n\n .pn-teaser-card__container__content {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n flex: 1 1 100%;\n gap: 3.2rem;\n padding: 2.4rem 2.4rem;\n padding-top: 0;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 2.4rem;\n line-height: 2.64rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n padding-top: 1.6rem;\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 2.24rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__label {\n display: block;\n margin-bottom: 1.6rem;\n font-weight: 400;\n font-size: 1.2rem;\n line-height: 140%;\n }\n\n .pn-teaser-card__container__content__cta {\n & > pn-button {\n align-self: flex-end;\n width: 100%;\n\n & a:hover {\n text-decoration: none;\n }\n\n & > button,\n & > a {\n & > .pn-button-bg {\n transition: 0.4s ease-in-out;\n }\n }\n\n @media screen and (min-width: $teaser-card-media-tablet) {\n width: fit-content;\n }\n }\n\n .secondary-link--animated {\n font-weight: 500;\n font-size: 1.6rem;\n text-decoration: none;\n color: $blue700;\n\n pn-icon svg {\n transition: 0.3s ease-in-out;\n position: relative;\n left: -0.3rem;\n\n path {\n fill: $blue700;\n }\n }\n\n &[target='_blank']:not(.pn-button):after {\n display: none;\n }\n }\n }\n}\n\n//colors\npn-teaser-card[data-card-color='coral'] {\n & > .pn-teaser-card__container {\n background-color: $coral50;\n }\n}\n\npn-teaser-card[data-card-color='green'] {\n & > .pn-teaser-card__container {\n background-color: $green50;\n }\n}\n\npn-teaser-card[data-card-color='blue'] {\n & > .pn-teaser-card__container {\n background-color: $blue25;\n }\n}\n\npn-teaser-card[data-card-color='blue50'] {\n & > .pn-teaser-card__container {\n background-color: $blue50;\n }\n}\n\npn-teaser-card[data-card-color='blue400'] {\n & > .pn-teaser-card__container {\n background-color: $blue400;\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__heading,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='blue900'] {\n & > .pn-teaser-card__container {\n background-color: $blue900;\n .pn-teaser-card__container__content__text__container__heading {\n color: $coral400;\n }\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='white'] {\n & > .pn-teaser-card__container {\n background-color: $white;\n }\n}\n\n//color override when in a listblock\n.teasercardlistblock {\n .teasercardblock.has-bg {\n background-color: transparent;\n background: transparent;\n }\n}\n\n// variants\n\n.onequarterwidth {\n .pn-teaser-card__container__content__text__container__label {\n @media screen and (min-width: $teaser-card-media-desktop) {\n margin-bottom: 0.8rem;\n }\n }\n}\n\n.onethirdwidth,\n.onequarterwidth {\n & > pn-teaser-card {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n }\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n}\n\n.halfwidth {\n & > pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: 992px) {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n }\n\n @media screen and (min-width: $teaser-card-media-desktop) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 4rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 4rem 4rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 3.2rem;\n line-height: 3.52rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-weight: 400;\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n\n @media screen and (min-width: $teaser-card-media-large-desktop) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 5.6rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 5.6rem 5.6rem;\n }\n }\n }\n}\n\n.fullwidth {\n & > pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n width: auto;\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $teaser-card-media-tablet) {\n min-height: 35rem;\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n\n .pn-teaser-card__container {\n flex-direction: row;\n }\n\n .pn-teaser-card__container__content {\n align-self: center;\n gap: 2.4rem;\n padding: 3.2rem 3.2rem 3.2rem 2.4rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-top-left-radius: 2.4rem;\n border-bottom-left-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 0% 50%);\n\n & > picture > img {\n height: 100%;\n object-fit: cover;\n }\n }\n }\n }\n\n @media screen and (min-width: $teaser-card-media-desktop) {\n min-height: 52rem;\n\n .pn-teaser-card__container__content {\n padding: 4rem 4rem 4rem 3.2rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 4.8rem;\n line-height: 5.28rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n }\n\n pn-teaser-card[data-card-alignment='right'] {\n @media screen and (min-width: $teaser-card-media-tablet) {\n .pn-teaser-card__container {\n flex-direction: row-reverse;\n }\n\n .pn-teaser-card__container__content {\n padding: 3.2rem 2.4rem 3.2rem 3.2rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-bottom-right-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 100% 50%);\n }\n }\n }\n\n @media screen and (min-width: $teaser-card-media-desktop) {\n .pn-teaser-card__container__content {\n padding: 4rem 3.2rem 4rem 4rem;\n }\n }\n }\n}\n\n//effect class\npn-teaser-card.teaser-card--hover-effect {\n &:hover {\n cursor: pointer;\n .pn-teaser-card__container__image__container {\n & [slot='illustration'] {\n & picture > img {\n transform: scale(1.02);\n filter: brightness(0.85);\n }\n }\n }\n\n .secondary-link--animated {\n text-decoration: underline;\n\n pn-icon svg {\n left: 0;\n }\n }\n\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue900;\n }\n }\n }\n\n &[data-card-color='blue900'] {\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue400;\n }\n }\n }\n }\n }\n}\n","import { Component, Prop, h, Element, State, Host } from \"@stencil/core\";\n\n@Component({\n tag: 'pn-teaser-card',\n styleUrl: 'pn-teaser-card.scss'\n})\nexport class PnTeaserCard {\n @Element() hostElement: HTMLElement;\n //props\n @Prop() text: string = null;\n @Prop() heading: string = null;\n @Prop() label?: string = null;\n @Prop({ reflect: true }) dataCardColor: string = 'coral';\n @Prop({ reflect: true }) dataCardAlignment: string = 'left';\n\n @State() hasCtaSlotContent: boolean = false;\n @State() hasIllustrationSlot: boolean = true;\n\n componentWillLoad() {\n this.hasCtaSlotContent = !!this.hostElement.querySelector('[slot=\"cta\"]');\n this.hasIllustrationSlot = !!this.hostElement.querySelector('[slot=\"illustration\"]');\n }\n\n //render\n render() {\n const labelToCapitals = this.label?.toUpperCase();\n\n return (\n <Host>\n <slot name=\"clickable-block-wrapper\" />\n <div class=\"pn-teaser-card__container\">\n <div class={`pn-teaser-card__container__image__container ${!this.hasIllustrationSlot ? 'pn-teaser-card__container__image__container--no-image' : ''}`}>\n <slot name=\"illustration\" />\n </div>\n <div class=\"pn-teaser-card__container__content\">\n <div class=\"pn-teaser-card__container__content__text__container\">\n {labelToCapitals && <span class=\"pn-teaser-card__container__content__text__container__label\">{labelToCapitals}</span>}\n <h3 class=\"pn-teaser-card__container__content__text__container__heading\">{this.heading}</h3>\n <p class=\"pn-teaser-card__container__content__text__container__preamble\">{this.text}</p>\n </div>\n {this.hasCtaSlotContent && (\n <div class=\"pn-teaser-card__container__content__cta\">\n <slot name=\"cta\" />\n </div>\n )}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -162,7 +162,7 @@ const PnDropdownWithMultiInputRows = class {
|
|
|
162
162
|
this.dropdownDataRoot.forEach(element => {
|
|
163
163
|
element.checked = false;
|
|
164
164
|
});
|
|
165
|
-
const selectionRoot = this.dropdownDataRoot.find(x => x.
|
|
165
|
+
const selectionRoot = this.dropdownDataRoot.find(x => x.label === selectedValue);
|
|
166
166
|
selectionRoot.checked = true;
|
|
167
167
|
this._firstDropdownSelection = selectionRoot.label;
|
|
168
168
|
this.minRowCount = selectionRoot.value;
|
|
@@ -302,9 +302,9 @@ const PnDropdownWithMultiInputRows = class {
|
|
|
302
302
|
}
|
|
303
303
|
}
|
|
304
304
|
render() {
|
|
305
|
-
return (h(Host, { key: '
|
|
305
|
+
return (h(Host, { key: '351d770fce9e7bfc2cd50ef79a6aceaa930f9fdc', class: "dropdown-with-multi-input-elemet" }, h("div", { key: 'fc9085e111574f62f794ea9337b3d6b891ce3c34', class: "dropdown-with-multi-input-elemet__row" }, h("div", { key: '2b60e8eaa8c9a75d1efa48850de1524deae5ba69' }, h("pn-select", { key: '086490769b71e4532100e3be53450bbf1a9082cf', ref: el => (this.pnFirstDropdown = el), class: "pn-row-select-dropdown dropDown1-dropdown", label: this.firstDropdownLabel, "empty-option": "true", language: this.languageCode }, this.dropdownDataRoot?.map((item, i) => (h("pn-option", { index: i, label: item.label, value: item.value, selected: item.checked, onClick: debounce(this.handleFirstDropdown.bind(this), 500) })))), this.firstDropdownHelperText?.length ? h("small", null, this.firstDropdownHelperText) : null)), h("div", { key: 'c13f4f51c46e2525cb11616d11fdee4765a5c773', class: "dropdown-with-multi-input-elemet__row" }, h("div", { key: '7d5f42e40bb8238ea8ebfce1346076210756b234' }, h("pn-select", { key: 'ba639bca03afd0267a476225686d895dad563ace', ref: el => (this.pnSecondDropdown = el), class: "pn-row-select-dropdown dropDown2-dropdown", label: this.secondDropdownLabel, "empty-option": "true", language: this.languageCode }, this.secondDropdownArr?.map((item, i) => (h("pn-option", { index: i, label: item, value: item, selected: item === this._secondDropdownSelection, onClick: debounce(this.handleSecondDropdown.bind(this), 500) })))), this.secondDropdownHelperText?.length ? h("small", null, this.secondDropdownHelperText) : null)), this.showDelteConfirm ? (h("div", { class: "dropdown-with-multi-input-elemet__delete" }, h("p", null, this.deleteMultipleRowsWarningText), h("pn-button", { ref: el => (this.pnConfirmDeleteButton = el), small: "true", appearance: "warning", onClick: this.deleteExcessRows.bind(this) }, this.confirmDeleteButtonText), h("pn-button", { ref: el => (this.pnAbortDeleteButton = el), small: "true", appearance: "light", onClick: this.abortDeleteRows.bind(this) }, this.abortDeleteButtonText))) : null, h("div", { key: '44d06edf20b400c6503c3e677bd5afa884aceff5', class: "dropdown-with-multi-input-elemet__label-row" }, h("div", { key: '18167ded0b2d8777613ba74f2c2871887d802db4', class: "dropdown-with-multi-input-elemet__label" }, h("label", { key: '571080cd07542e281e340754b6e548fc7907a5c9' }, this.fristInputLabel)), h("div", { key: '46bb0a4abaa57f583c0f3dfccbe4d34b71cc6abc', class: "dropdown-with-multi-input-elemet__label" }, h("label", { key: '22d43e66420bc1b24406b79ea73443e95c539be3' }, this.secondInputLabel)), h("div", { key: 'c832cf94f4cf173055fb335a98aa58f12a001abe', class: "dropdown-with-multi-input-elemet__label" }, h("label", { key: '9c080141355b5ba5938b519e348f7ab0b3265eff' }, this.dateLabel))), this.rowData?.map((data, i) => {
|
|
306
306
|
return (h("div", { class: 'dropdown-with-multi-input-elemet__row generated-row-' + i, id: 'generated-row-' + i }, h("pn-dropdown-with-multi-input-rows-row", { "language-code": this.languageCode, "frist-input-placeholder": this.fristInputPlaceholder, "first-input-min": this.firstInputMin, "first-input-max": this.firstInputMax, "first-input-warning": this.firstInputWarning, "first-input-warning-text": this.firstInputWarningText, "first-input-low-error-text": this.firstInputLowErrorText, "first-input-high-error-text": this.firstInputHighErrorText, "second-input-placeholder": this.secondInputPlaceholder, "second-input-min": this.secondInputMin, "second-input-max": this.secondInputMax, "second-input-warning": this.secondInputWarning, "second-input-warning-text": this.secondInputWarningText, "second-input-low-error-text": this.secondInputLowErrorText, "second-input-high-error-text": this.secondInputHighErrorText, datePlaceholder: this.datePlaceholder, firstValidDate: this.firstValidDateString, lastValidDate: this.lastValidDateString, "predefined-value": JSON.stringify(data), "min-row-count": this.minRowCount, "row-index": i })));
|
|
307
|
-
}), h("div", { key: '
|
|
307
|
+
}), h("div", { key: 'ca742eab0dfdbd2b04ba5963aa231bd5f78e1035', class: "dropdown-with-multi-input-elemet__row sum-row" }, h("pn-marketweb-input", { key: '7b5c4c6886a617dd071555e7c523e4f9379d0f73', disabled: true, ref: el => (this.pnSumField = el), type: "number", value: this.rowSum, label: this.sumFieldLabel }), h("pn-button", { key: 'dc1fe71d337b31e1e44f3679942a884a44ecc801', tooltip: this.addRowText ? this.addRowText : null, "left-icon": "true", arialabel: "Add", icon: plus, appearance: "light", variant: "borderless", class: "connected-dropdown__button-right", onClick: () => {
|
|
308
308
|
this.addRow(this.generateUniqueId());
|
|
309
309
|
} }, this.addRowText)), this.elementHelperText?.length ? h("div", { class: "dropdown-with-multi-input-elemet__row" }, this.elementHelperText) : null));
|
|
310
310
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"pn-dropdown-with-multi-input-rows.entry.js","mappings":"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","names":["uuidv4"],"sources":["src/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows.scss?tag=pn-dropdown-with-multi-input-rows","src/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-dropdown-with-multi-input-rows {\n .dropdown-with-multi-input-elemet {\n &__row {\n margin-bottom: 1rem;\n }\n\n &__delete {\n display: flex;\n gap: 1rem;\n margin-bottom: 1rem;\n padding: 1rem;\n background-color: $gray25;\n\n pn-button {\n margin-top: 0.9rem;\n }\n }\n\n &__label-row {\n display: flex;\n gap: 1rem;\n }\n\n &__label {\n width: 30%;\n font-size: 0.875em;\n color: #5e554a;\n }\n }\n\n .sum-row {\n display: flex;\n justify-content: space-between;\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 { v4 as uuidv4 } from 'uuid';\nimport debounce from 'debounce';\nimport { plus } from 'pn-design-assets/pn-assets/icons.js';\n\n@Component({\n tag: 'pn-dropdown-with-multi-input-rows',\n styleUrl: 'pn-dropdown-with-multi-input-rows.scss',\n})\nexport class PnDropdownWithMultiInputRows {\n @Element() hostElement: Element;\n pnFirstDropdown: HTMLElement = null;\n pnSecondDropdown: HTMLElement = null;\n pnSumField: HTMLElement = null;\n pnConfirmDeleteButton: HTMLElement = null;\n pnAbortDeleteButton: HTMLElement = null;\n\n @Prop() dropdownData: string | Root[] = null;\n @Prop() languageCode: string = null;\n @Prop() firstDropdownLabel: string = null;\n @Prop() firstDropdownHelperText: string = null;\n @Prop() secondDropdownLabel: string = null;\n @Prop() secondDropdownHelperText: string = null;\n @Prop() secondDropdownMax: number = null;\n @Prop() deleteMultipleRowsWarningText: string = null;\n @Prop() confirmDeleteButtonText: string = null;\n @Prop() abortDeleteButtonText: string = null;\n @Prop() fristInputLabel: 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() secondInputLabel: 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() dateDaysFromToday: number = 1;\n @Prop() yearsToAddToEndDate: number = null;\n @Prop() sumFieldLabel: string = null;\n @Prop() addRowText: string = null;\n @Prop() elementHelperText: string = null;\n\n @State() dropdownDataRoot: Root[] = null;\n @State() secondDropdownArr: number[] = [];\n @State() rowCount: number = null;\n @State() rowData: PredefinedValues[] = null;\n @State() formValues: FormValue[] = null;\n @State() firstValidDateString: string = '';\n @State() lastValidDateString: string = '';\n @State() rowSum: string = null;\n @State() minRowCount: number = null;\n @State() showDelteConfirm: boolean = false;\n\n @Event() allFormValues: EventEmitter<string>;\n\n private _firstDropdownSelection: string = null;\n private _secondDropdownSelection: number = null;\n\n private _defaultRow: PredefinedValues;\n\n constructor() {\n this._defaultRow = {\n id: this.generateUniqueId(),\n firstInput: '',\n secondInput: this.secondInputWarning !== null ? this.secondInputWarning.toString() : '',\n date: '',\n };\n }\n\n componentWillLoad() {\n this.formValues = [];\n this.setDropDownData();\n this.updateSecondDropdown();\n this.setRowData();\n this.setFirstValidDate();\n }\n\n componentDidLoad() {\n this.updateSum();\n }\n\n setDropDownData() {\n if (typeof this.dropdownData === 'string') {\n this.dropdownDataRoot = JSON.parse(this.dropdownData);\n } else {\n this.dropdownDataRoot = this.dropdownData;\n }\n\n if (this.dropdownDataRoot?.length) {\n this.dropdownDataRoot.forEach(element => {\n if (!element.value) {\n element.value = 0;\n }\n });\n }\n\n if (this.dropdownDataRoot.length > 0) {\n this.dropdownDataRoot[0].checked = true;\n this._firstDropdownSelection = this.dropdownDataRoot[0].label;\n this._secondDropdownSelection = this.dropdownDataRoot[0].value;\n this.minRowCount = this.dropdownDataRoot[0].value;\n }\n }\n\n updateSecondDropdown() {\n const selectedItem = this.dropdownDataRoot.find(arr => arr.checked === true);\n this.secondDropdownArr = [];\n\n for (let index = selectedItem.value; index <= this.secondDropdownMax; index++) {\n this.secondDropdownArr.push(index);\n }\n }\n\n updateSelectItemArr(arr: Root[], caption: string) {\n arr.forEach(item => {\n if (item.label === caption) {\n item.checked = !item.checked;\n } else {\n item.checked = false;\n }\n });\n return arr;\n }\n\n setRowData() {\n this.rowData = [];\n for (let index = 0; index < this._secondDropdownSelection; index++) {\n const row = Object.assign({}, this._defaultRow);\n row.id = this.generateUniqueId();\n this.rowData = [...this.rowData, row];\n }\n\n this.rowCount = this.rowData.length;\n }\n\n generateUniqueId() {\n return uuidv4();\n }\n\n setFirstValidDate() {\n const yearsToadd = this.yearsToAddToEndDate ? this.yearsToAddToEndDate : 2;\n const date = new Date();\n date.setDate(date.getDate() + this.dateDaysFromToday ?? 0);\n\n const year = date.getFullYear();\n const month = (date.getMonth() + 1).toString().padStart(2, '0');\n const day = date.getDate().toString().padStart(2, '0');\n const endYear = year + yearsToadd;\n\n this.firstValidDateString = `${year.toString()}-${month}-${day}`;\n this.lastValidDateString = `${endYear.toString()}-${month}-${day}`;\n }\n\n addRow(newRowId: string) {\n const newRow = Object.assign({}, this.rowData[0]);\n newRow.id = newRowId ? newRowId : this.generateUniqueId();\n newRow.date = '';\n this.rowData = [...this.rowData, newRow];\n this.rowCount = this.rowData.length;\n\n this._secondDropdownSelection = this.rowCount;\n this.secondDropdownArr = [...this.secondDropdownArr];\n this.updateSum();\n this.emitValuesIfValid();\n }\n\n handleFirstDropdown() {\n const selected = this.pnFirstDropdown.querySelector('[aria-selected=true]');\n const selectedValue = selected?.textContent;\n if (!selectedValue?.length) {\n return;\n }\n\n this.dropdownDataRoot.forEach(element => {\n element.checked = false;\n });\n const selectionRoot = this.dropdownDataRoot.find(x => x.value?.toString() === selectedValue);\n selectionRoot.checked = true;\n this._firstDropdownSelection = selectionRoot.label;\n this.minRowCount = selectionRoot.value;\n\n if (selectionRoot.value > this._secondDropdownSelection) {\n this.dropdownDataRoot = [...this.dropdownDataRoot];\n\n for (let index = this.rowCount; index < selectionRoot.value; index++) {\n this.addRow(this.generateUniqueId());\n }\n }\n\n this.updateSecondDropdown();\n this.updateSum();\n this.emitValuesIfValid();\n }\n\n handleSecondDropdown() {\n const selected = this.pnSecondDropdown.querySelector('[aria-selected=true]');\n const selectedValue = selected?.textContent;\n if (!selectedValue?.length) {\n return;\n }\n\n const value = parseInt(selectedValue);\n if (value < this._secondDropdownSelection) {\n this.showDelteConfirm = true;\n } else {\n for (let index = this.rowCount; index < value; index++) {\n this.addRow(this.generateUniqueId());\n }\n }\n this.updateSum();\n this.emitValuesIfValid();\n }\n\n @Listen('rowValueChange')\n @Listen('firstInputChange')\n @Listen('secondInputChange')\n predefinedValueChange(e) {\n const indexToUpdate = this.rowData.findIndex(data => data.id === e.detail.id);\n const val: PredefinedValues = e.detail;\n this.rowData[indexToUpdate] = {\n ...this.rowData[indexToUpdate],\n firstInput: val.firstInput,\n secondInput: val.secondInput,\n date: val.date,\n };\n\n if (e.type === 'firstInputChange' && indexToUpdate === 0) {\n this.updateFirstInputOfRows(val.firstInput);\n }\n\n if (e.type === 'secondInputChange' && indexToUpdate === 0) {\n this.updateSecondInputOfRows(val.secondInput);\n }\n\n this.rowData = [...this.rowData];\n this.emitValuesIfValid();\n this.updateSum();\n }\n\n updateFirstInputOfRows(value: string) {\n for (let index = 1; index < this.rowCount; index++) {\n this.rowData[index] = {\n ...this.rowData[index],\n firstInput: value,\n };\n }\n }\n\n updateSecondInputOfRows(value: string) {\n for (let index = 1; index < this.rowCount; index++) {\n this.rowData[index] = {\n ...this.rowData[index],\n secondInput: value,\n };\n }\n }\n\n @Listen('deleteRowEvent')\n deleteRowEvent(e) {\n const indexToRemove = this.rowData.findIndex(data => data.id === e.detail);\n if (indexToRemove < 0) {\n return;\n }\n\n this.rowData.splice(indexToRemove, 1);\n this.rowData = [...this.rowData];\n this.rowCount = this.rowData.length;\n\n this._secondDropdownSelection = this.rowCount;\n this.secondDropdownArr = [...this.secondDropdownArr];\n this.emitValuesIfValid();\n this.updateSum();\n }\n\n updateSum() {\n this.rowSum = '';\n let sum = 0;\n this.rowData.forEach(element => {\n if (element?.firstInput?.length) {\n sum += parseInt(element.firstInput);\n }\n });\n\n this.rowSum = sum.toString();\n }\n\n deleteExcessRows() {\n const selected = this.pnSecondDropdown.querySelector('[aria-selected=true]');\n const selectedValue = selected?.textContent;\n if (!selectedValue?.length) {\n return;\n }\n const rowsToDelete = this.rowCount - parseInt(selectedValue);\n for (let index = 0; index < rowsToDelete; index++) {\n this.rowData.pop();\n }\n this.rowData = [...this.rowData];\n this.showDelteConfirm = false;\n this.updateSum();\n }\n\n abortDeleteRows() {\n this.showDelteConfirm = false;\n }\n\n emitValuesIfValid() {\n this.formValues = [];\n this.rowData.forEach(item => {\n const rowValue: FormValue = { row: [] };\n if (this._firstDropdownSelection?.length) {\n const dropDownValue: RowValue = { name: this.firstDropdownLabel, value: this._firstDropdownSelection };\n rowValue.row.push(dropDownValue);\n }\n \n if (item.firstInput?.length) {\n const firstInputValue: RowValue = { name: this.fristInputLabel, value: item.firstInput };\n rowValue.row.push(firstInputValue);\n }\n \n if (item.secondInput?.length) {\n const secondInputValue: RowValue = { name: this.secondInputLabel, value: item.secondInput };\n rowValue.row.push(secondInputValue);\n }\n\n if (item.date) {\n const dateValue: RowValue = { name: this.dateLabel, value: item.date };\n rowValue.row.push(dateValue);\n }\n \n if (rowValue.row.length === 4) {\n this.formValues.push(rowValue);\n }\n });\n \n if (this.formValues.length === this.rowData.length) {\n const valueJsonString = JSON.stringify(this.formValues);\n this.allFormValues.emit(valueJsonString);\n } else {\n this.allFormValues.emit('');\n }\n }\n\n render() {\n return (\n <Host class=\"dropdown-with-multi-input-elemet\">\n <div class=\"dropdown-with-multi-input-elemet__row\">\n <div>\n <pn-select ref={el => (this.pnFirstDropdown = el as HTMLElement)} class=\"pn-row-select-dropdown dropDown1-dropdown\" label={this.firstDropdownLabel} empty-option=\"true\" language={this.languageCode}>\n {this.dropdownDataRoot?.map((item, i) => (\n <pn-option index={i} label={item.value} value={item.value} selected={item.checked} onClick={debounce(this.handleFirstDropdown.bind(this), 500)}></pn-option>\n ))}\n </pn-select>\n {this.firstDropdownHelperText?.length ? <small>{this.firstDropdownHelperText}</small> : null}\n </div>\n </div>\n\n <div class=\"dropdown-with-multi-input-elemet__row\">\n <div>\n <pn-select ref={el => (this.pnSecondDropdown = el as HTMLElement)} class=\"pn-row-select-dropdown dropDown2-dropdown\" label={this.secondDropdownLabel} empty-option=\"true\" language={this.languageCode}>\n {this.secondDropdownArr?.map((item, i) => (\n <pn-option index={i} label={item} value={item} selected={item === this._secondDropdownSelection} onClick={debounce(this.handleSecondDropdown.bind(this), 500)}></pn-option>\n ))}\n </pn-select>\n {this.secondDropdownHelperText?.length ? <small>{this.secondDropdownHelperText}</small> : null}\n </div>\n </div>\n\n {this.showDelteConfirm ? (\n <div class=\"dropdown-with-multi-input-elemet__delete\">\n <p>{this.deleteMultipleRowsWarningText}</p>\n <pn-button ref={el => (this.pnConfirmDeleteButton = el as HTMLElement)} small=\"true\" appearance=\"warning\" onClick={this.deleteExcessRows.bind(this)}>\n {this.confirmDeleteButtonText}\n </pn-button>\n <pn-button ref={el => (this.pnAbortDeleteButton = el as HTMLElement)} small=\"true\" appearance=\"light\" onClick={this.abortDeleteRows.bind(this)}>\n {this.abortDeleteButtonText}\n </pn-button>\n </div>\n ) : null}\n\n <div class=\"dropdown-with-multi-input-elemet__label-row\">\n <div class=\"dropdown-with-multi-input-elemet__label\">\n <label>{this.fristInputLabel}</label>\n </div>\n <div class=\"dropdown-with-multi-input-elemet__label\">\n <label>{this.secondInputLabel}</label>\n </div>\n <div class=\"dropdown-with-multi-input-elemet__label\">\n <label>{this.dateLabel}</label>\n </div>\n </div>\n\n {this.rowData?.map((data, i) => {\n return (\n <div class={'dropdown-with-multi-input-elemet__row generated-row-' + i} id={'generated-row-' + i}>\n <pn-dropdown-with-multi-input-rows-row\n language-code={this.languageCode}\n frist-input-placeholder={this.fristInputPlaceholder}\n first-input-min={this.firstInputMin}\n first-input-max={this.firstInputMax}\n first-input-warning={this.firstInputWarning}\n first-input-warning-text={this.firstInputWarningText}\n first-input-low-error-text={this.firstInputLowErrorText}\n first-input-high-error-text={this.firstInputHighErrorText}\n second-input-placeholder={this.secondInputPlaceholder}\n second-input-min={this.secondInputMin}\n second-input-max={this.secondInputMax}\n second-input-warning={this.secondInputWarning}\n second-input-warning-text={this.secondInputWarningText}\n second-input-low-error-text={this.secondInputLowErrorText}\n second-input-high-error-text={this.secondInputHighErrorText}\n datePlaceholder={this.datePlaceholder}\n firstValidDate={this.firstValidDateString}\n lastValidDate={this.lastValidDateString}\n predefined-value={JSON.stringify(data)}\n min-row-count={this.minRowCount}\n row-index={i}\n ></pn-dropdown-with-multi-input-rows-row>\n </div>\n );\n })}\n\n <div class=\"dropdown-with-multi-input-elemet__row sum-row\">\n <pn-marketweb-input disabled={true} ref={el => (this.pnSumField = el as HTMLElement)} type=\"number\" value={this.rowSum} label={this.sumFieldLabel}></pn-marketweb-input>\n\n <pn-button\n tooltip={this.addRowText ? this.addRowText : null}\n left-icon=\"true\"\n arialabel=\"Add\"\n icon={plus}\n appearance=\"light\"\n variant=\"borderless\"\n class=\"connected-dropdown__button-right\"\n onClick={() => {\n this.addRow(this.generateUniqueId());\n }}\n >\n {this.addRowText}\n </pn-button>\n </div>\n\n {this.elementHelperText?.length ? <div class=\"dropdown-with-multi-input-elemet__row\">{this.elementHelperText}</div> : null}\n </Host>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"pn-dropdown-with-multi-input-rows.entry.js","mappings":"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","names":["uuidv4"],"sources":["src/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows.scss?tag=pn-dropdown-with-multi-input-rows","src/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-dropdown-with-multi-input-rows {\n .dropdown-with-multi-input-elemet {\n &__row {\n margin-bottom: 1rem;\n }\n\n &__delete {\n display: flex;\n gap: 1rem;\n margin-bottom: 1rem;\n padding: 1rem;\n background-color: $gray25;\n\n pn-button {\n margin-top: 0.9rem;\n }\n }\n\n &__label-row {\n display: flex;\n gap: 1rem;\n }\n\n &__label {\n width: 30%;\n font-size: 0.875em;\n color: #5e554a;\n }\n }\n\n .sum-row {\n display: flex;\n justify-content: space-between;\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 { v4 as uuidv4 } from 'uuid';\nimport debounce from 'debounce';\nimport { plus } from 'pn-design-assets/pn-assets/icons.js';\n\n@Component({\n tag: 'pn-dropdown-with-multi-input-rows',\n styleUrl: 'pn-dropdown-with-multi-input-rows.scss',\n})\nexport class PnDropdownWithMultiInputRows {\n @Element() hostElement: Element;\n pnFirstDropdown: HTMLElement = null;\n pnSecondDropdown: HTMLElement = null;\n pnSumField: HTMLElement = null;\n pnConfirmDeleteButton: HTMLElement = null;\n pnAbortDeleteButton: HTMLElement = null;\n\n @Prop() dropdownData: string | Root[] = null;\n @Prop() languageCode: string = null;\n @Prop() firstDropdownLabel: string = null;\n @Prop() firstDropdownHelperText: string = null;\n @Prop() secondDropdownLabel: string = null;\n @Prop() secondDropdownHelperText: string = null;\n @Prop() secondDropdownMax: number = null;\n @Prop() deleteMultipleRowsWarningText: string = null;\n @Prop() confirmDeleteButtonText: string = null;\n @Prop() abortDeleteButtonText: string = null;\n @Prop() fristInputLabel: 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() secondInputLabel: 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() dateDaysFromToday: number = 1;\n @Prop() yearsToAddToEndDate: number = null;\n @Prop() sumFieldLabel: string = null;\n @Prop() addRowText: string = null;\n @Prop() elementHelperText: string = null;\n\n @State() dropdownDataRoot: Root[] = null;\n @State() secondDropdownArr: number[] = [];\n @State() rowCount: number = null;\n @State() rowData: PredefinedValues[] = null;\n @State() formValues: FormValue[] = null;\n @State() firstValidDateString: string = '';\n @State() lastValidDateString: string = '';\n @State() rowSum: string = null;\n @State() minRowCount: number = null;\n @State() showDelteConfirm: boolean = false;\n\n @Event() allFormValues: EventEmitter<string>;\n\n private _firstDropdownSelection: string = null;\n private _secondDropdownSelection: number = null;\n\n private _defaultRow: PredefinedValues;\n\n constructor() {\n this._defaultRow = {\n id: this.generateUniqueId(),\n firstInput: '',\n secondInput: this.secondInputWarning !== null ? this.secondInputWarning.toString() : '',\n date: '',\n };\n }\n\n componentWillLoad() {\n this.formValues = [];\n this.setDropDownData();\n this.updateSecondDropdown();\n this.setRowData();\n this.setFirstValidDate();\n }\n\n componentDidLoad() {\n this.updateSum();\n }\n\n setDropDownData() {\n if (typeof this.dropdownData === 'string') {\n this.dropdownDataRoot = JSON.parse(this.dropdownData);\n } else {\n this.dropdownDataRoot = this.dropdownData;\n }\n\n if (this.dropdownDataRoot?.length) {\n this.dropdownDataRoot.forEach(element => {\n if (!element.value) {\n element.value = 0;\n }\n });\n }\n\n if (this.dropdownDataRoot.length > 0) {\n this.dropdownDataRoot[0].checked = true;\n this._firstDropdownSelection = this.dropdownDataRoot[0].label;\n this._secondDropdownSelection = this.dropdownDataRoot[0].value;\n this.minRowCount = this.dropdownDataRoot[0].value;\n }\n }\n\n updateSecondDropdown() {\n const selectedItem = this.dropdownDataRoot.find(arr => arr.checked === true);\n this.secondDropdownArr = [];\n\n for (let index = selectedItem.value; index <= this.secondDropdownMax; index++) {\n this.secondDropdownArr.push(index);\n }\n }\n\n updateSelectItemArr(arr: Root[], caption: string) {\n arr.forEach(item => {\n if (item.label === caption) {\n item.checked = !item.checked;\n } else {\n item.checked = false;\n }\n });\n return arr;\n }\n\n setRowData() {\n this.rowData = [];\n for (let index = 0; index < this._secondDropdownSelection; index++) {\n const row = Object.assign({}, this._defaultRow);\n row.id = this.generateUniqueId();\n this.rowData = [...this.rowData, row];\n }\n\n this.rowCount = this.rowData.length;\n }\n\n generateUniqueId() {\n return uuidv4();\n }\n\n setFirstValidDate() {\n const yearsToadd = this.yearsToAddToEndDate ? this.yearsToAddToEndDate : 2;\n const date = new Date();\n date.setDate(date.getDate() + this.dateDaysFromToday ?? 0);\n\n const year = date.getFullYear();\n const month = (date.getMonth() + 1).toString().padStart(2, '0');\n const day = date.getDate().toString().padStart(2, '0');\n const endYear = year + yearsToadd;\n\n this.firstValidDateString = `${year.toString()}-${month}-${day}`;\n this.lastValidDateString = `${endYear.toString()}-${month}-${day}`;\n }\n\n addRow(newRowId: string) {\n const newRow = Object.assign({}, this.rowData[0]);\n newRow.id = newRowId ? newRowId : this.generateUniqueId();\n newRow.date = '';\n this.rowData = [...this.rowData, newRow];\n this.rowCount = this.rowData.length;\n\n this._secondDropdownSelection = this.rowCount;\n this.secondDropdownArr = [...this.secondDropdownArr];\n this.updateSum();\n this.emitValuesIfValid();\n }\n\n handleFirstDropdown() {\n const selected = this.pnFirstDropdown.querySelector('[aria-selected=true]');\n const selectedValue = selected?.textContent;\n if (!selectedValue?.length) {\n return;\n }\n\n this.dropdownDataRoot.forEach(element => {\n element.checked = false;\n });\n const selectionRoot = this.dropdownDataRoot.find(x => x.label === selectedValue);\n selectionRoot.checked = true;\n this._firstDropdownSelection = selectionRoot.label;\n this.minRowCount = selectionRoot.value;\n\n if (selectionRoot.value > this._secondDropdownSelection) {\n this.dropdownDataRoot = [...this.dropdownDataRoot];\n\n for (let index = this.rowCount; index < selectionRoot.value; index++) {\n this.addRow(this.generateUniqueId());\n }\n }\n\n this.updateSecondDropdown();\n this.updateSum();\n this.emitValuesIfValid();\n }\n\n handleSecondDropdown() {\n const selected = this.pnSecondDropdown.querySelector('[aria-selected=true]');\n const selectedValue = selected?.textContent;\n if (!selectedValue?.length) {\n return;\n }\n\n const value = parseInt(selectedValue);\n if (value < this._secondDropdownSelection) {\n this.showDelteConfirm = true;\n } else {\n for (let index = this.rowCount; index < value; index++) {\n this.addRow(this.generateUniqueId());\n }\n }\n this.updateSum();\n this.emitValuesIfValid();\n }\n\n @Listen('rowValueChange')\n @Listen('firstInputChange')\n @Listen('secondInputChange')\n predefinedValueChange(e) {\n const indexToUpdate = this.rowData.findIndex(data => data.id === e.detail.id);\n const val: PredefinedValues = e.detail;\n this.rowData[indexToUpdate] = {\n ...this.rowData[indexToUpdate],\n firstInput: val.firstInput,\n secondInput: val.secondInput,\n date: val.date,\n };\n\n if (e.type === 'firstInputChange' && indexToUpdate === 0) {\n this.updateFirstInputOfRows(val.firstInput);\n }\n\n if (e.type === 'secondInputChange' && indexToUpdate === 0) {\n this.updateSecondInputOfRows(val.secondInput);\n }\n\n this.rowData = [...this.rowData];\n this.emitValuesIfValid();\n this.updateSum();\n }\n\n updateFirstInputOfRows(value: string) {\n for (let index = 1; index < this.rowCount; index++) {\n this.rowData[index] = {\n ...this.rowData[index],\n firstInput: value,\n };\n }\n }\n\n updateSecondInputOfRows(value: string) {\n for (let index = 1; index < this.rowCount; index++) {\n this.rowData[index] = {\n ...this.rowData[index],\n secondInput: value,\n };\n }\n }\n\n @Listen('deleteRowEvent')\n deleteRowEvent(e) {\n const indexToRemove = this.rowData.findIndex(data => data.id === e.detail);\n if (indexToRemove < 0) {\n return;\n }\n\n this.rowData.splice(indexToRemove, 1);\n this.rowData = [...this.rowData];\n this.rowCount = this.rowData.length;\n\n this._secondDropdownSelection = this.rowCount;\n this.secondDropdownArr = [...this.secondDropdownArr];\n this.emitValuesIfValid();\n this.updateSum();\n }\n\n updateSum() {\n this.rowSum = '';\n let sum = 0;\n this.rowData.forEach(element => {\n if (element?.firstInput?.length) {\n sum += parseInt(element.firstInput);\n }\n });\n\n this.rowSum = sum.toString();\n }\n\n deleteExcessRows() {\n const selected = this.pnSecondDropdown.querySelector('[aria-selected=true]');\n const selectedValue = selected?.textContent;\n if (!selectedValue?.length) {\n return;\n }\n const rowsToDelete = this.rowCount - parseInt(selectedValue);\n for (let index = 0; index < rowsToDelete; index++) {\n this.rowData.pop();\n }\n this.rowData = [...this.rowData];\n this.showDelteConfirm = false;\n this.updateSum();\n }\n\n abortDeleteRows() {\n this.showDelteConfirm = false;\n }\n\n emitValuesIfValid() {\n this.formValues = [];\n this.rowData.forEach(item => {\n const rowValue: FormValue = { row: [] };\n if (this._firstDropdownSelection?.length) {\n const dropDownValue: RowValue = { name: this.firstDropdownLabel, value: this._firstDropdownSelection };\n rowValue.row.push(dropDownValue);\n }\n \n if (item.firstInput?.length) {\n const firstInputValue: RowValue = { name: this.fristInputLabel, value: item.firstInput };\n rowValue.row.push(firstInputValue);\n }\n \n if (item.secondInput?.length) {\n const secondInputValue: RowValue = { name: this.secondInputLabel, value: item.secondInput };\n rowValue.row.push(secondInputValue);\n }\n\n if (item.date) {\n const dateValue: RowValue = { name: this.dateLabel, value: item.date };\n rowValue.row.push(dateValue);\n }\n \n if (rowValue.row.length === 4) {\n this.formValues.push(rowValue);\n }\n });\n \n if (this.formValues.length === this.rowData.length) {\n const valueJsonString = JSON.stringify(this.formValues);\n this.allFormValues.emit(valueJsonString);\n } else {\n this.allFormValues.emit('');\n }\n }\n\n render() {\n return (\n <Host class=\"dropdown-with-multi-input-elemet\">\n <div class=\"dropdown-with-multi-input-elemet__row\">\n <div>\n <pn-select ref={el => (this.pnFirstDropdown = el as HTMLElement)} class=\"pn-row-select-dropdown dropDown1-dropdown\" label={this.firstDropdownLabel} empty-option=\"true\" language={this.languageCode}>\n {this.dropdownDataRoot?.map((item, i) => (\n <pn-option index={i} label={item.label} value={item.value} selected={item.checked} onClick={debounce(this.handleFirstDropdown.bind(this), 500)}></pn-option>\n ))}\n </pn-select>\n {this.firstDropdownHelperText?.length ? <small>{this.firstDropdownHelperText}</small> : null}\n </div>\n </div>\n\n <div class=\"dropdown-with-multi-input-elemet__row\">\n <div>\n <pn-select ref={el => (this.pnSecondDropdown = el as HTMLElement)} class=\"pn-row-select-dropdown dropDown2-dropdown\" label={this.secondDropdownLabel} empty-option=\"true\" language={this.languageCode}>\n {this.secondDropdownArr?.map((item, i) => (\n <pn-option index={i} label={item} value={item} selected={item === this._secondDropdownSelection} onClick={debounce(this.handleSecondDropdown.bind(this), 500)}></pn-option>\n ))}\n </pn-select>\n {this.secondDropdownHelperText?.length ? <small>{this.secondDropdownHelperText}</small> : null}\n </div>\n </div>\n\n {this.showDelteConfirm ? (\n <div class=\"dropdown-with-multi-input-elemet__delete\">\n <p>{this.deleteMultipleRowsWarningText}</p>\n <pn-button ref={el => (this.pnConfirmDeleteButton = el as HTMLElement)} small=\"true\" appearance=\"warning\" onClick={this.deleteExcessRows.bind(this)}>\n {this.confirmDeleteButtonText}\n </pn-button>\n <pn-button ref={el => (this.pnAbortDeleteButton = el as HTMLElement)} small=\"true\" appearance=\"light\" onClick={this.abortDeleteRows.bind(this)}>\n {this.abortDeleteButtonText}\n </pn-button>\n </div>\n ) : null}\n\n <div class=\"dropdown-with-multi-input-elemet__label-row\">\n <div class=\"dropdown-with-multi-input-elemet__label\">\n <label>{this.fristInputLabel}</label>\n </div>\n <div class=\"dropdown-with-multi-input-elemet__label\">\n <label>{this.secondInputLabel}</label>\n </div>\n <div class=\"dropdown-with-multi-input-elemet__label\">\n <label>{this.dateLabel}</label>\n </div>\n </div>\n\n {this.rowData?.map((data, i) => {\n return (\n <div class={'dropdown-with-multi-input-elemet__row generated-row-' + i} id={'generated-row-' + i}>\n <pn-dropdown-with-multi-input-rows-row\n language-code={this.languageCode}\n frist-input-placeholder={this.fristInputPlaceholder}\n first-input-min={this.firstInputMin}\n first-input-max={this.firstInputMax}\n first-input-warning={this.firstInputWarning}\n first-input-warning-text={this.firstInputWarningText}\n first-input-low-error-text={this.firstInputLowErrorText}\n first-input-high-error-text={this.firstInputHighErrorText}\n second-input-placeholder={this.secondInputPlaceholder}\n second-input-min={this.secondInputMin}\n second-input-max={this.secondInputMax}\n second-input-warning={this.secondInputWarning}\n second-input-warning-text={this.secondInputWarningText}\n second-input-low-error-text={this.secondInputLowErrorText}\n second-input-high-error-text={this.secondInputHighErrorText}\n datePlaceholder={this.datePlaceholder}\n firstValidDate={this.firstValidDateString}\n lastValidDate={this.lastValidDateString}\n predefined-value={JSON.stringify(data)}\n min-row-count={this.minRowCount}\n row-index={i}\n ></pn-dropdown-with-multi-input-rows-row>\n </div>\n );\n })}\n\n <div class=\"dropdown-with-multi-input-elemet__row sum-row\">\n <pn-marketweb-input disabled={true} ref={el => (this.pnSumField = el as HTMLElement)} type=\"number\" value={this.rowSum} label={this.sumFieldLabel}></pn-marketweb-input>\n\n <pn-button\n tooltip={this.addRowText ? this.addRowText : null}\n left-icon=\"true\"\n arialabel=\"Add\"\n icon={plus}\n appearance=\"light\"\n variant=\"borderless\"\n class=\"connected-dropdown__button-right\"\n onClick={() => {\n this.addRow(this.generateUniqueId());\n }}\n >\n {this.addRowText}\n </pn-button>\n </div>\n\n {this.elementHelperText?.length ? <div class=\"dropdown-with-multi-input-elemet__row\">{this.elementHelperText}</div> : null}\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -22,7 +22,7 @@ const PnTeaserCard = class {
|
|
|
22
22
|
//render
|
|
23
23
|
render() {
|
|
24
24
|
const labelToCapitals = this.label?.toUpperCase();
|
|
25
|
-
return (h(Host, { key: 'fdbbca9a340be605fab4928fd899e2ed7d6da987' }, h("slot", { key: '73c277568a6552fc2cdad9449c5805198f6c4c39', name: "clickable-block-wrapper" }), h("div", { key: '263a5919c76eb373958d3ef92aa90ed67656d25e', class: "pn-teaser-card__container" }, h("div", { key: '11cd5bc0d913acc378f960ec4d3baf0c7d3ecc99', class: `pn-teaser-card__container__image__container ${!this.hasIllustrationSlot ? 'pn-teaser-card__container__image__container--no-image' : ''}` }, h("slot", { key: '71893f8f45c0275c68c59768582a663737fd5eea', name: "illustration" })), h("div", { key: '99a874f3c2a22983edcab63a018050d47cbdc5d0', class: "pn-teaser-card__container__content" }, h("div", { key: '451ae56adec502481416822c169a01774fa262aa', class: "pn-teaser-card__container__content__text__container" }, labelToCapitals && h("span", { key: '2dfcef1bf94c1caea50c0f86263fea71713bf572', class: "pn-teaser-card__container__content__text__container__label" }, labelToCapitals), h("
|
|
25
|
+
return (h(Host, { key: 'fdbbca9a340be605fab4928fd899e2ed7d6da987' }, h("slot", { key: '73c277568a6552fc2cdad9449c5805198f6c4c39', name: "clickable-block-wrapper" }), h("div", { key: '263a5919c76eb373958d3ef92aa90ed67656d25e', class: "pn-teaser-card__container" }, h("div", { key: '11cd5bc0d913acc378f960ec4d3baf0c7d3ecc99', class: `pn-teaser-card__container__image__container ${!this.hasIllustrationSlot ? 'pn-teaser-card__container__image__container--no-image' : ''}` }, h("slot", { key: '71893f8f45c0275c68c59768582a663737fd5eea', name: "illustration" })), h("div", { key: '99a874f3c2a22983edcab63a018050d47cbdc5d0', class: "pn-teaser-card__container__content" }, h("div", { key: '451ae56adec502481416822c169a01774fa262aa', class: "pn-teaser-card__container__content__text__container" }, labelToCapitals && h("span", { key: '2dfcef1bf94c1caea50c0f86263fea71713bf572', class: "pn-teaser-card__container__content__text__container__label" }, labelToCapitals), h("h3", { key: 'bd796379bb1bb106aea2de582df537a804f4c415', class: "pn-teaser-card__container__content__text__container__heading" }, this.heading), h("p", { key: 'ec25bea0041371fb67bb414cbc731d46234b118a', class: "pn-teaser-card__container__content__text__container__preamble" }, this.text)), this.hasCtaSlotContent && (h("div", { key: '6ebbe23c0584a63325e2faff4eb3979f804869aa', class: "pn-teaser-card__container__content__cta" }, h("slot", { key: '0a87639586c866e4e2439c67951362abe7a2f26d', name: "cta" })))))));
|
|
26
26
|
}
|
|
27
27
|
};
|
|
28
28
|
PnTeaserCard.style = PnTeaserCardStyle0;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"pn-teaser-card.entry.js","mappings":";;AAAA,MAAM,eAAe,GAAG,g0RAAg0R,CAAC;AACz1R,2BAAe,eAAe;;MCKjB,YAAY;;;oBAGA,IAAI;uBACD,IAAI;qBACL,IAAI;6BACoB,OAAO;iCACH,MAAM;iCAErB,KAAK;mCACH,IAAI;;;IAE5C,iBAAiB;QACf,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;QAC1E,IAAI,CAAC,mBAAmB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;KACtF;;IAGD,MAAM;QACJ,MAAM,eAAe,GAAG,IAAI,CAAC,KAAK,EAAE,WAAW,EAAE,CAAC;QAElD,QACE,EAAC,IAAI,uDACH,6DAAM,IAAI,EAAC,yBAAyB,GAAG,EACvC,4DAAK,KAAK,EAAC,2BAA2B,IACpC,4DAAK,KAAK,EAAE,+CAA+C,CAAC,IAAI,CAAC,mBAAmB,GAAG,uDAAuD,GAAG,EAAE,EAAE,IACnJ,6DAAM,IAAI,EAAC,cAAc,GAAG,CACxB,EACN,4DAAK,KAAK,EAAC,oCAAoC,IAC7C,4DAAK,KAAK,EAAC,qDAAqD,IAC7D,eAAe,IAAI,6DAAM,KAAK,EAAC,4DAA4D,IAAE,eAAe,CAAQ,EACrH,2DAAI,KAAK,EAAC,8DAA8D,IAAE,IAAI,CAAC,OAAO,CAAM,EAC5F,0DAAG,KAAK,EAAC,+DAA+D,IAAE,IAAI,CAAC,IAAI,CAAK,CACpF,EACL,IAAI,CAAC,iBAAiB,KACrB,4DAAK,KAAK,EAAC,yCAAyC,IAClD,6DAAM,IAAI,EAAC,KAAK,GAAG,CACf,CACP,CACG,CACF,CACD,EACP;KACH;;;;;;","names":[],"sources":["src/components/cards/pn-teaser-card/pn-teaser-card.scss?tag=pn-teaser-card","src/components/cards/pn-teaser-card/pn-teaser-card.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\n$teaser-card-media-tablet: 768px; // 768px\n$teaser-card-media-desktop: 1200px; //1200px\n$teaser-card-media-large-desktop: 1640px; //1640\n\n//making pn wrapping link clickable over card image\n.block.teasercardblock {\n a[data-block-clickable-link='true'] {\n z-index: 1;\n }\n}\n\n//mobile first\npn-teaser-card {\n width: 100%;\n height: 100%;\n display: flex;\n\n .pn-teaser-card__container {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n border-radius: 2.4rem;\n width: 100%;\n }\n\n .pn-teaser-card__container__image__container {\n width: 100%;\n position: relative;\n\n & > [slot='illustration'] {\n clip-path: ellipse(100% 90% at 50% 0%);\n height: 100%;\n overflow: hidden;\n border-top-left-radius: 2.4rem;\n border-top-right-radius: 2.4rem;\n\n & > picture > img {\n width: 100%;\n height: auto;\n transition: 0.4s ease-in-out;\n transform: scale(1);\n aspect-ratio: 16/9;\n object-fit: cover;\n object-position: 50% 0;\n }\n }\n }\n\n .pn-teaser-card__container__content {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n flex: 1 1 100%;\n gap: 3.2rem;\n padding: 2.4rem 2.4rem;\n padding-top: 0;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 2.4rem;\n line-height: 2.64rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n padding-top: 1.6rem;\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 2.24rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__label {\n display: block;\n margin-bottom: 1.6rem;\n font-weight: 400;\n font-size: 1.2rem;\n line-height: 140%;\n }\n\n .pn-teaser-card__container__content__cta {\n & > pn-button {\n align-self: flex-end;\n width: 100%;\n\n & a:hover {\n text-decoration: none;\n }\n\n & > button,\n & > a {\n & > .pn-button-bg {\n transition: 0.4s ease-in-out;\n }\n }\n\n @media screen and (min-width: $teaser-card-media-tablet) {\n width: fit-content;\n }\n }\n\n .secondary-link--animated {\n font-weight: 500;\n font-size: 1.6rem;\n text-decoration: none;\n color: $blue700;\n\n pn-icon svg {\n transition: 0.3s ease-in-out;\n position: relative;\n left: -0.3rem;\n\n path {\n fill: $blue700;\n }\n }\n\n &[target='_blank']:not(.pn-button):after {\n display: none;\n }\n }\n }\n}\n\n//colors\npn-teaser-card[data-card-color='coral'] {\n & > .pn-teaser-card__container {\n background-color: $coral50;\n }\n}\n\npn-teaser-card[data-card-color='green'] {\n & > .pn-teaser-card__container {\n background-color: $green50;\n }\n}\n\npn-teaser-card[data-card-color='blue'] {\n & > .pn-teaser-card__container {\n background-color: $blue25;\n }\n}\n\npn-teaser-card[data-card-color='blue50'] {\n & > .pn-teaser-card__container {\n background-color: $blue50;\n }\n}\n\npn-teaser-card[data-card-color='blue400'] {\n & > .pn-teaser-card__container {\n background-color: $blue400;\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__heading,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='blue900'] {\n & > .pn-teaser-card__container {\n background-color: $blue900;\n .pn-teaser-card__container__content__text__container__heading {\n color: $coral400;\n }\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='white'] {\n & > .pn-teaser-card__container {\n background-color: $white;\n }\n}\n\n//color override when in a listblock\n.teasercardlistblock {\n .teasercardblock.has-bg {\n background-color: transparent;\n background: transparent;\n }\n}\n\n// variants\n\n.onequarterwidth {\n .pn-teaser-card__container__content__text__container__label {\n @media screen and (min-width: $teaser-card-media-desktop) {\n margin-bottom: 0.8rem;\n }\n }\n}\n\n.onethirdwidth,\n.onequarterwidth {\n & > pn-teaser-card {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n }\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n}\n\n.halfwidth {\n & > pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: 992px) {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n }\n\n @media screen and (min-width: $teaser-card-media-desktop) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 4rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 4rem 4rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 3.2rem;\n line-height: 3.52rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-weight: 400;\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n\n @media screen and (min-width: $teaser-card-media-large-desktop) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 5.6rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 5.6rem 5.6rem;\n }\n }\n }\n}\n\n.fullwidth {\n & > pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n width: auto;\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $teaser-card-media-tablet) {\n min-height: 35rem;\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n\n .pn-teaser-card__container {\n flex-direction: row;\n }\n\n .pn-teaser-card__container__content {\n align-self: center;\n gap: 2.4rem;\n padding: 3.2rem 3.2rem 3.2rem 2.4rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-top-left-radius: 2.4rem;\n border-bottom-left-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 0% 50%);\n\n & > picture > img {\n height: 100%;\n object-fit: cover;\n }\n }\n }\n }\n\n @media screen and (min-width: $teaser-card-media-desktop) {\n min-height: 52rem;\n\n .pn-teaser-card__container__content {\n padding: 4rem 4rem 4rem 3.2rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 4.8rem;\n line-height: 5.28rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n }\n\n pn-teaser-card[data-card-alignment='right'] {\n @media screen and (min-width: $teaser-card-media-tablet) {\n .pn-teaser-card__container {\n flex-direction: row-reverse;\n }\n\n .pn-teaser-card__container__content {\n padding: 3.2rem 2.4rem 3.2rem 3.2rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-bottom-right-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 100% 50%);\n }\n }\n }\n\n @media screen and (min-width: $teaser-card-media-desktop) {\n .pn-teaser-card__container__content {\n padding: 4rem 3.2rem 4rem 4rem;\n }\n }\n }\n}\n\n//effect class\npn-teaser-card.teaser-card--hover-effect {\n &:hover {\n cursor: pointer;\n .pn-teaser-card__container__image__container {\n & [slot='illustration'] {\n & picture > img {\n transform: scale(1.02);\n filter: brightness(0.85);\n }\n }\n }\n\n .secondary-link--animated {\n text-decoration: underline;\n\n pn-icon svg {\n left: 0;\n }\n }\n\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue900;\n }\n }\n }\n\n &[data-card-color='blue900'] {\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue400;\n }\n }\n }\n }\n }\n}\n","import { Component, Prop, h, Element, State, Host } from \"@stencil/core\";\n\n@Component({\n tag: 'pn-teaser-card',\n styleUrl: 'pn-teaser-card.scss'\n})\nexport class PnTeaserCard {\n @Element() hostElement: HTMLElement;\n //props\n @Prop() text: string = null;\n @Prop() heading: string = null;\n @Prop() label?: string = null;\n @Prop({ reflect: true }) dataCardColor: string = 'coral';\n @Prop({ reflect: true }) dataCardAlignment: string = 'left';\n\n @State() hasCtaSlotContent: boolean = false;\n @State() hasIllustrationSlot: boolean = true;\n\n componentWillLoad() {\n this.hasCtaSlotContent = !!this.hostElement.querySelector('[slot=\"cta\"]');\n this.hasIllustrationSlot = !!this.hostElement.querySelector('[slot=\"illustration\"]');\n }\n\n //render\n render() {\n const labelToCapitals = this.label?.toUpperCase();\n\n return (\n <Host>\n <slot name=\"clickable-block-wrapper\" />\n <div class=\"pn-teaser-card__container\">\n <div class={`pn-teaser-card__container__image__container ${!this.hasIllustrationSlot ? 'pn-teaser-card__container__image__container--no-image' : ''}`}>\n <slot name=\"illustration\" />\n </div>\n <div class=\"pn-teaser-card__container__content\">\n <div class=\"pn-teaser-card__container__content__text__container\">\n {labelToCapitals && <span class=\"pn-teaser-card__container__content__text__container__label\">{labelToCapitals}</span>}\n <h2 class=\"pn-teaser-card__container__content__text__container__heading\">{this.heading}</h2>\n <p class=\"pn-teaser-card__container__content__text__container__preamble\">{this.text}</p>\n </div>\n {this.hasCtaSlotContent && (\n <div class=\"pn-teaser-card__container__content__cta\">\n <slot name=\"cta\" />\n </div>\n )}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"pn-teaser-card.entry.js","mappings":";;AAAA,MAAM,eAAe,GAAG,g0RAAg0R,CAAC;AACz1R,2BAAe,eAAe;;MCKjB,YAAY;;;oBAGA,IAAI;uBACD,IAAI;qBACL,IAAI;6BACoB,OAAO;iCACH,MAAM;iCAErB,KAAK;mCACH,IAAI;;;IAE5C,iBAAiB;QACf,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;QAC1E,IAAI,CAAC,mBAAmB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;KACtF;;IAGD,MAAM;QACJ,MAAM,eAAe,GAAG,IAAI,CAAC,KAAK,EAAE,WAAW,EAAE,CAAC;QAElD,QACE,EAAC,IAAI,uDACH,6DAAM,IAAI,EAAC,yBAAyB,GAAG,EACvC,4DAAK,KAAK,EAAC,2BAA2B,IACpC,4DAAK,KAAK,EAAE,+CAA+C,CAAC,IAAI,CAAC,mBAAmB,GAAG,uDAAuD,GAAG,EAAE,EAAE,IACnJ,6DAAM,IAAI,EAAC,cAAc,GAAG,CACxB,EACN,4DAAK,KAAK,EAAC,oCAAoC,IAC7C,4DAAK,KAAK,EAAC,qDAAqD,IAC7D,eAAe,IAAI,6DAAM,KAAK,EAAC,4DAA4D,IAAE,eAAe,CAAQ,EACrH,2DAAI,KAAK,EAAC,8DAA8D,IAAE,IAAI,CAAC,OAAO,CAAM,EAC5F,0DAAG,KAAK,EAAC,+DAA+D,IAAE,IAAI,CAAC,IAAI,CAAK,CACpF,EACL,IAAI,CAAC,iBAAiB,KACrB,4DAAK,KAAK,EAAC,yCAAyC,IAClD,6DAAM,IAAI,EAAC,KAAK,GAAG,CACf,CACP,CACG,CACF,CACD,EACP;KACH;;;;;;","names":[],"sources":["src/components/cards/pn-teaser-card/pn-teaser-card.scss?tag=pn-teaser-card","src/components/cards/pn-teaser-card/pn-teaser-card.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\n$teaser-card-media-tablet: 768px; // 768px\n$teaser-card-media-desktop: 1200px; //1200px\n$teaser-card-media-large-desktop: 1640px; //1640\n\n//making pn wrapping link clickable over card image\n.block.teasercardblock {\n a[data-block-clickable-link='true'] {\n z-index: 1;\n }\n}\n\n//mobile first\npn-teaser-card {\n width: 100%;\n height: 100%;\n display: flex;\n\n .pn-teaser-card__container {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n border-radius: 2.4rem;\n width: 100%;\n }\n\n .pn-teaser-card__container__image__container {\n width: 100%;\n position: relative;\n\n & > [slot='illustration'] {\n clip-path: ellipse(100% 90% at 50% 0%);\n height: 100%;\n overflow: hidden;\n border-top-left-radius: 2.4rem;\n border-top-right-radius: 2.4rem;\n\n & > picture > img {\n width: 100%;\n height: auto;\n transition: 0.4s ease-in-out;\n transform: scale(1);\n aspect-ratio: 16/9;\n object-fit: cover;\n object-position: 50% 0;\n }\n }\n }\n\n .pn-teaser-card__container__content {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n flex: 1 1 100%;\n gap: 3.2rem;\n padding: 2.4rem 2.4rem;\n padding-top: 0;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 2.4rem;\n line-height: 2.64rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n padding-top: 1.6rem;\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 2.24rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__label {\n display: block;\n margin-bottom: 1.6rem;\n font-weight: 400;\n font-size: 1.2rem;\n line-height: 140%;\n }\n\n .pn-teaser-card__container__content__cta {\n & > pn-button {\n align-self: flex-end;\n width: 100%;\n\n & a:hover {\n text-decoration: none;\n }\n\n & > button,\n & > a {\n & > .pn-button-bg {\n transition: 0.4s ease-in-out;\n }\n }\n\n @media screen and (min-width: $teaser-card-media-tablet) {\n width: fit-content;\n }\n }\n\n .secondary-link--animated {\n font-weight: 500;\n font-size: 1.6rem;\n text-decoration: none;\n color: $blue700;\n\n pn-icon svg {\n transition: 0.3s ease-in-out;\n position: relative;\n left: -0.3rem;\n\n path {\n fill: $blue700;\n }\n }\n\n &[target='_blank']:not(.pn-button):after {\n display: none;\n }\n }\n }\n}\n\n//colors\npn-teaser-card[data-card-color='coral'] {\n & > .pn-teaser-card__container {\n background-color: $coral50;\n }\n}\n\npn-teaser-card[data-card-color='green'] {\n & > .pn-teaser-card__container {\n background-color: $green50;\n }\n}\n\npn-teaser-card[data-card-color='blue'] {\n & > .pn-teaser-card__container {\n background-color: $blue25;\n }\n}\n\npn-teaser-card[data-card-color='blue50'] {\n & > .pn-teaser-card__container {\n background-color: $blue50;\n }\n}\n\npn-teaser-card[data-card-color='blue400'] {\n & > .pn-teaser-card__container {\n background-color: $blue400;\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__heading,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='blue900'] {\n & > .pn-teaser-card__container {\n background-color: $blue900;\n .pn-teaser-card__container__content__text__container__heading {\n color: $coral400;\n }\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='white'] {\n & > .pn-teaser-card__container {\n background-color: $white;\n }\n}\n\n//color override when in a listblock\n.teasercardlistblock {\n .teasercardblock.has-bg {\n background-color: transparent;\n background: transparent;\n }\n}\n\n// variants\n\n.onequarterwidth {\n .pn-teaser-card__container__content__text__container__label {\n @media screen and (min-width: $teaser-card-media-desktop) {\n margin-bottom: 0.8rem;\n }\n }\n}\n\n.onethirdwidth,\n.onequarterwidth {\n & > pn-teaser-card {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n }\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n}\n\n.halfwidth {\n & > pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: 992px) {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n }\n\n @media screen and (min-width: $teaser-card-media-desktop) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 4rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 4rem 4rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 3.2rem;\n line-height: 3.52rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-weight: 400;\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n\n @media screen and (min-width: $teaser-card-media-large-desktop) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 5.6rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 5.6rem 5.6rem;\n }\n }\n }\n}\n\n.fullwidth {\n & > pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n width: auto;\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $teaser-card-media-tablet) {\n min-height: 35rem;\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n\n .pn-teaser-card__container {\n flex-direction: row;\n }\n\n .pn-teaser-card__container__content {\n align-self: center;\n gap: 2.4rem;\n padding: 3.2rem 3.2rem 3.2rem 2.4rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-top-left-radius: 2.4rem;\n border-bottom-left-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 0% 50%);\n\n & > picture > img {\n height: 100%;\n object-fit: cover;\n }\n }\n }\n }\n\n @media screen and (min-width: $teaser-card-media-desktop) {\n min-height: 52rem;\n\n .pn-teaser-card__container__content {\n padding: 4rem 4rem 4rem 3.2rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 4.8rem;\n line-height: 5.28rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n }\n\n pn-teaser-card[data-card-alignment='right'] {\n @media screen and (min-width: $teaser-card-media-tablet) {\n .pn-teaser-card__container {\n flex-direction: row-reverse;\n }\n\n .pn-teaser-card__container__content {\n padding: 3.2rem 2.4rem 3.2rem 3.2rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-bottom-right-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 100% 50%);\n }\n }\n }\n\n @media screen and (min-width: $teaser-card-media-desktop) {\n .pn-teaser-card__container__content {\n padding: 4rem 3.2rem 4rem 4rem;\n }\n }\n }\n}\n\n//effect class\npn-teaser-card.teaser-card--hover-effect {\n &:hover {\n cursor: pointer;\n .pn-teaser-card__container__image__container {\n & [slot='illustration'] {\n & picture > img {\n transform: scale(1.02);\n filter: brightness(0.85);\n }\n }\n }\n\n .secondary-link--animated {\n text-decoration: underline;\n\n pn-icon svg {\n left: 0;\n }\n }\n\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue900;\n }\n }\n }\n\n &[data-card-color='blue900'] {\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue400;\n }\n }\n }\n }\n }\n}\n","import { Component, Prop, h, Element, State, Host } from \"@stencil/core\";\n\n@Component({\n tag: 'pn-teaser-card',\n styleUrl: 'pn-teaser-card.scss'\n})\nexport class PnTeaserCard {\n @Element() hostElement: HTMLElement;\n //props\n @Prop() text: string = null;\n @Prop() heading: string = null;\n @Prop() label?: string = null;\n @Prop({ reflect: true }) dataCardColor: string = 'coral';\n @Prop({ reflect: true }) dataCardAlignment: string = 'left';\n\n @State() hasCtaSlotContent: boolean = false;\n @State() hasIllustrationSlot: boolean = true;\n\n componentWillLoad() {\n this.hasCtaSlotContent = !!this.hostElement.querySelector('[slot=\"cta\"]');\n this.hasIllustrationSlot = !!this.hostElement.querySelector('[slot=\"illustration\"]');\n }\n\n //render\n render() {\n const labelToCapitals = this.label?.toUpperCase();\n\n return (\n <Host>\n <slot name=\"clickable-block-wrapper\" />\n <div class=\"pn-teaser-card__container\">\n <div class={`pn-teaser-card__container__image__container ${!this.hasIllustrationSlot ? 'pn-teaser-card__container__image__container--no-image' : ''}`}>\n <slot name=\"illustration\" />\n </div>\n <div class=\"pn-teaser-card__container__content\">\n <div class=\"pn-teaser-card__container__content__text__container\">\n {labelToCapitals && <span class=\"pn-teaser-card__container__content__text__container__label\">{labelToCapitals}</span>}\n <h3 class=\"pn-teaser-card__container__content__text__container__heading\">{this.heading}</h3>\n <p class=\"pn-teaser-card__container__content__text__container__preamble\">{this.text}</p>\n </div>\n {this.hasCtaSlotContent && (\n <div class=\"pn-teaser-card__container__content__cta\">\n <slot name=\"cta\" />\n </div>\n )}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
package/package.json
CHANGED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{g as t,r as i,c as s,h as e,d as n}from"./p-06555615.js";import{d as l}from"./p-aed52bc1.js";import{p as h}from"./p-df8bfe03.js";import{v as o}from"./p-4ed69de7.js";const d="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-dropdown-with-multi-input-rows .dropdown-with-multi-input-elemet__row{margin-bottom:1rem}pn-dropdown-with-multi-input-rows .dropdown-with-multi-input-elemet__delete{display:flex;gap:1rem;margin-bottom:1rem;padding:1rem;background-color:#f9f8f8}pn-dropdown-with-multi-input-rows .dropdown-with-multi-input-elemet__delete pn-button{margin-top:0.9rem}pn-dropdown-with-multi-input-rows .dropdown-with-multi-input-elemet__label-row{display:flex;gap:1rem}pn-dropdown-with-multi-input-rows .dropdown-with-multi-input-elemet__label{width:30%;font-size:0.875em;color:#5e554a}pn-dropdown-with-multi-input-rows .sum-row{display:flex;justify-content:space-between}";const r=d;const a=class{get hostElement(){return t(this)}pnFirstDropdown=null;pnSecondDropdown=null;pnSumField=null;pnConfirmDeleteButton=null;pnAbortDeleteButton=null;allFormValues;_firstDropdownSelection=null;_secondDropdownSelection=null;_defaultRow;constructor(t){i(this,t);this.allFormValues=s(this,"allFormValues",7);this.dropdownData=null;this.languageCode=null;this.firstDropdownLabel=null;this.firstDropdownHelperText=null;this.secondDropdownLabel=null;this.secondDropdownHelperText=null;this.secondDropdownMax=null;this.deleteMultipleRowsWarningText=null;this.confirmDeleteButtonText=null;this.abortDeleteButtonText=null;this.fristInputLabel=null;this.fristInputPlaceholder=null;this.firstInputMin=null;this.firstInputMax=null;this.firstInputWarning=null;this.firstInputWarningText=null;this.firstInputLowErrorText=null;this.firstInputHighErrorText=null;this.secondInputLabel=null;this.secondInputPlaceholder=null;this.secondInputMin=null;this.secondInputMax=null;this.secondInputWarning=null;this.secondInputWarningText=null;this.secondInputLowErrorText=null;this.secondInputHighErrorText=null;this.dateLabel=null;this.datePlaceholder=null;this.dateDaysFromToday=1;this.yearsToAddToEndDate=null;this.sumFieldLabel=null;this.addRowText=null;this.elementHelperText=null;this.dropdownDataRoot=null;this.secondDropdownArr=[];this.rowCount=null;this.rowData=null;this.formValues=null;this.firstValidDateString="";this.lastValidDateString="";this.rowSum=null;this.minRowCount=null;this.showDelteConfirm=false;this._defaultRow={id:this.generateUniqueId(),firstInput:"",secondInput:this.secondInputWarning!==null?this.secondInputWarning.toString():"",date:""}}componentWillLoad(){this.formValues=[];this.setDropDownData();this.updateSecondDropdown();this.setRowData();this.setFirstValidDate()}componentDidLoad(){this.updateSum()}setDropDownData(){if(typeof this.dropdownData==="string"){this.dropdownDataRoot=JSON.parse(this.dropdownData)}else{this.dropdownDataRoot=this.dropdownData}if(this.dropdownDataRoot?.length){this.dropdownDataRoot.forEach((t=>{if(!t.value){t.value=0}}))}if(this.dropdownDataRoot.length>0){this.dropdownDataRoot[0].checked=true;this._firstDropdownSelection=this.dropdownDataRoot[0].label;this._secondDropdownSelection=this.dropdownDataRoot[0].value;this.minRowCount=this.dropdownDataRoot[0].value}}updateSecondDropdown(){const t=this.dropdownDataRoot.find((t=>t.checked===true));this.secondDropdownArr=[];for(let i=t.value;i<=this.secondDropdownMax;i++){this.secondDropdownArr.push(i)}}updateSelectItemArr(t,i){t.forEach((t=>{if(t.label===i){t.checked=!t.checked}else{t.checked=false}}));return t}setRowData(){this.rowData=[];for(let t=0;t<this._secondDropdownSelection;t++){const t=Object.assign({},this._defaultRow);t.id=this.generateUniqueId();this.rowData=[...this.rowData,t]}this.rowCount=this.rowData.length}generateUniqueId(){return o()}setFirstValidDate(){const t=this.yearsToAddToEndDate?this.yearsToAddToEndDate:2;const i=new Date;i.setDate(i.getDate()+this.dateDaysFromToday??0);const s=i.getFullYear();const e=(i.getMonth()+1).toString().padStart(2,"0");const n=i.getDate().toString().padStart(2,"0");const l=s+t;this.firstValidDateString=`${s.toString()}-${e}-${n}`;this.lastValidDateString=`${l.toString()}-${e}-${n}`}addRow(t){const i=Object.assign({},this.rowData[0]);i.id=t?t:this.generateUniqueId();i.date="";this.rowData=[...this.rowData,i];this.rowCount=this.rowData.length;this._secondDropdownSelection=this.rowCount;this.secondDropdownArr=[...this.secondDropdownArr];this.updateSum();this.emitValuesIfValid()}handleFirstDropdown(){const t=this.pnFirstDropdown.querySelector("[aria-selected=true]");const i=t?.textContent;if(!i?.length){return}this.dropdownDataRoot.forEach((t=>{t.checked=false}));const s=this.dropdownDataRoot.find((t=>t.label===i));s.checked=true;this._firstDropdownSelection=s.label;this.minRowCount=s.value;if(s.value>this._secondDropdownSelection){this.dropdownDataRoot=[...this.dropdownDataRoot];for(let t=this.rowCount;t<s.value;t++){this.addRow(this.generateUniqueId())}}this.updateSecondDropdown();this.updateSum();this.emitValuesIfValid()}handleSecondDropdown(){const t=this.pnSecondDropdown.querySelector("[aria-selected=true]");const i=t?.textContent;if(!i?.length){return}const s=parseInt(i);if(s<this._secondDropdownSelection){this.showDelteConfirm=true}else{for(let t=this.rowCount;t<s;t++){this.addRow(this.generateUniqueId())}}this.updateSum();this.emitValuesIfValid()}predefinedValueChange(t){const i=this.rowData.findIndex((i=>i.id===t.detail.id));const s=t.detail;this.rowData[i]={...this.rowData[i],firstInput:s.firstInput,secondInput:s.secondInput,date:s.date};if(t.type==="firstInputChange"&&i===0){this.updateFirstInputOfRows(s.firstInput)}if(t.type==="secondInputChange"&&i===0){this.updateSecondInputOfRows(s.secondInput)}this.rowData=[...this.rowData];this.emitValuesIfValid();this.updateSum()}updateFirstInputOfRows(t){for(let i=1;i<this.rowCount;i++){this.rowData[i]={...this.rowData[i],firstInput:t}}}updateSecondInputOfRows(t){for(let i=1;i<this.rowCount;i++){this.rowData[i]={...this.rowData[i],secondInput:t}}}deleteRowEvent(t){const i=this.rowData.findIndex((i=>i.id===t.detail));if(i<0){return}this.rowData.splice(i,1);this.rowData=[...this.rowData];this.rowCount=this.rowData.length;this._secondDropdownSelection=this.rowCount;this.secondDropdownArr=[...this.secondDropdownArr];this.emitValuesIfValid();this.updateSum()}updateSum(){this.rowSum="";let t=0;this.rowData.forEach((i=>{if(i?.firstInput?.length){t+=parseInt(i.firstInput)}}));this.rowSum=t.toString()}deleteExcessRows(){const t=this.pnSecondDropdown.querySelector("[aria-selected=true]");const i=t?.textContent;if(!i?.length){return}const s=this.rowCount-parseInt(i);for(let t=0;t<s;t++){this.rowData.pop()}this.rowData=[...this.rowData];this.showDelteConfirm=false;this.updateSum()}abortDeleteRows(){this.showDelteConfirm=false}emitValuesIfValid(){this.formValues=[];this.rowData.forEach((t=>{const i={row:[]};if(this._firstDropdownSelection?.length){const t={name:this.firstDropdownLabel,value:this._firstDropdownSelection};i.row.push(t)}if(t.firstInput?.length){const s={name:this.fristInputLabel,value:t.firstInput};i.row.push(s)}if(t.secondInput?.length){const s={name:this.secondInputLabel,value:t.secondInput};i.row.push(s)}if(t.date){const s={name:this.dateLabel,value:t.date};i.row.push(s)}if(i.row.length===4){this.formValues.push(i)}}));if(this.formValues.length===this.rowData.length){const t=JSON.stringify(this.formValues);this.allFormValues.emit(t)}else{this.allFormValues.emit("")}}render(){return e(n,{key:"351d770fce9e7bfc2cd50ef79a6aceaa930f9fdc",class:"dropdown-with-multi-input-elemet"},e("div",{key:"fc9085e111574f62f794ea9337b3d6b891ce3c34",class:"dropdown-with-multi-input-elemet__row"},e("div",{key:"2b60e8eaa8c9a75d1efa48850de1524deae5ba69"},e("pn-select",{key:"086490769b71e4532100e3be53450bbf1a9082cf",ref:t=>this.pnFirstDropdown=t,class:"pn-row-select-dropdown dropDown1-dropdown",label:this.firstDropdownLabel,"empty-option":"true",language:this.languageCode},this.dropdownDataRoot?.map(((t,i)=>e("pn-option",{index:i,label:t.label,value:t.value,selected:t.checked,onClick:l(this.handleFirstDropdown.bind(this),500)})))),this.firstDropdownHelperText?.length?e("small",null,this.firstDropdownHelperText):null)),e("div",{key:"c13f4f51c46e2525cb11616d11fdee4765a5c773",class:"dropdown-with-multi-input-elemet__row"},e("div",{key:"7d5f42e40bb8238ea8ebfce1346076210756b234"},e("pn-select",{key:"ba639bca03afd0267a476225686d895dad563ace",ref:t=>this.pnSecondDropdown=t,class:"pn-row-select-dropdown dropDown2-dropdown",label:this.secondDropdownLabel,"empty-option":"true",language:this.languageCode},this.secondDropdownArr?.map(((t,i)=>e("pn-option",{index:i,label:t,value:t,selected:t===this._secondDropdownSelection,onClick:l(this.handleSecondDropdown.bind(this),500)})))),this.secondDropdownHelperText?.length?e("small",null,this.secondDropdownHelperText):null)),this.showDelteConfirm?e("div",{class:"dropdown-with-multi-input-elemet__delete"},e("p",null,this.deleteMultipleRowsWarningText),e("pn-button",{ref:t=>this.pnConfirmDeleteButton=t,small:"true",appearance:"warning",onClick:this.deleteExcessRows.bind(this)},this.confirmDeleteButtonText),e("pn-button",{ref:t=>this.pnAbortDeleteButton=t,small:"true",appearance:"light",onClick:this.abortDeleteRows.bind(this)},this.abortDeleteButtonText)):null,e("div",{key:"44d06edf20b400c6503c3e677bd5afa884aceff5",class:"dropdown-with-multi-input-elemet__label-row"},e("div",{key:"18167ded0b2d8777613ba74f2c2871887d802db4",class:"dropdown-with-multi-input-elemet__label"},e("label",{key:"571080cd07542e281e340754b6e548fc7907a5c9"},this.fristInputLabel)),e("div",{key:"46bb0a4abaa57f583c0f3dfccbe4d34b71cc6abc",class:"dropdown-with-multi-input-elemet__label"},e("label",{key:"22d43e66420bc1b24406b79ea73443e95c539be3"},this.secondInputLabel)),e("div",{key:"c832cf94f4cf173055fb335a98aa58f12a001abe",class:"dropdown-with-multi-input-elemet__label"},e("label",{key:"9c080141355b5ba5938b519e348f7ab0b3265eff"},this.dateLabel))),this.rowData?.map(((t,i)=>e("div",{class:"dropdown-with-multi-input-elemet__row generated-row-"+i,id:"generated-row-"+i},e("pn-dropdown-with-multi-input-rows-row",{"language-code":this.languageCode,"frist-input-placeholder":this.fristInputPlaceholder,"first-input-min":this.firstInputMin,"first-input-max":this.firstInputMax,"first-input-warning":this.firstInputWarning,"first-input-warning-text":this.firstInputWarningText,"first-input-low-error-text":this.firstInputLowErrorText,"first-input-high-error-text":this.firstInputHighErrorText,"second-input-placeholder":this.secondInputPlaceholder,"second-input-min":this.secondInputMin,"second-input-max":this.secondInputMax,"second-input-warning":this.secondInputWarning,"second-input-warning-text":this.secondInputWarningText,"second-input-low-error-text":this.secondInputLowErrorText,"second-input-high-error-text":this.secondInputHighErrorText,datePlaceholder:this.datePlaceholder,firstValidDate:this.firstValidDateString,lastValidDate:this.lastValidDateString,"predefined-value":JSON.stringify(t),"min-row-count":this.minRowCount,"row-index":i})))),e("div",{key:"ca742eab0dfdbd2b04ba5963aa231bd5f78e1035",class:"dropdown-with-multi-input-elemet__row sum-row"},e("pn-marketweb-input",{key:"7b5c4c6886a617dd071555e7c523e4f9379d0f73",disabled:true,ref:t=>this.pnSumField=t,type:"number",value:this.rowSum,label:this.sumFieldLabel}),e("pn-button",{key:"dc1fe71d337b31e1e44f3679942a884a44ecc801",tooltip:this.addRowText?this.addRowText:null,"left-icon":"true",arialabel:"Add",icon:h,appearance:"light",variant:"borderless",class:"connected-dropdown__button-right",onClick:()=>{this.addRow(this.generateUniqueId())}},this.addRowText)),this.elementHelperText?.length?e("div",{class:"dropdown-with-multi-input-elemet__row"},this.elementHelperText):null)}};a.style=r;export{a as pn_dropdown_with_multi_input_rows};
|
|
2
|
+
//# sourceMappingURL=p-1426fb9f.entry.js.map
|