@postnord/pn-marketweb-components 3.4.21 → 3.4.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (88) hide show
  1. package/cjs/loader.cjs.js +1 -1
  2. package/cjs/pn-dropdown-with-multi-input-rows-row.cjs.entry.js +2 -1
  3. package/cjs/pn-dropdown-with-multi-input-rows-row.cjs.entry.js.map +1 -1
  4. package/cjs/pn-dropdown-with-multi-input-rows.cjs.entry.js +5 -4
  5. package/cjs/pn-dropdown-with-multi-input-rows.cjs.entry.js.map +1 -1
  6. package/cjs/pn-language-selector_9.cjs.entry.js +7 -1
  7. package/cjs/pn-language-selector_9.cjs.entry.js.map +1 -1
  8. package/cjs/pn-market-web-components.cjs.js +1 -1
  9. package/cjs/pn-multi-row-connected-dropdown-row.cjs.entry.js +26 -25
  10. package/cjs/pn-multi-row-connected-dropdown-row.cjs.entry.js.map +1 -1
  11. package/cjs/pn-multi-row-connected-dropdown.cjs.entry.js +7 -6
  12. package/cjs/pn-multi-row-connected-dropdown.cjs.entry.js.map +1 -1
  13. package/cjs/pn-teaser-card.cjs.entry.js +1 -1
  14. package/cjs/pn-teaser-card.cjs.entry.js.map +1 -1
  15. package/collection/components/cards/pn-teaser-card/pn-teaser-card.css +30 -30
  16. package/collection/components/cards/pn-teaser-card/pn-teaser-card.stories.js +2 -2
  17. package/collection/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows-row.js +20 -1
  18. package/collection/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows-row.js.map +1 -1
  19. package/collection/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows.js +23 -4
  20. package/collection/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows.js.map +1 -1
  21. package/collection/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows.stories.js +2 -0
  22. package/collection/components/input/pn-multi-row-connected-dropdown/pn-multi-row-connected-dropdown-row.js +45 -26
  23. package/collection/components/input/pn-multi-row-connected-dropdown/pn-multi-row-connected-dropdown-row.js.map +1 -1
  24. package/collection/components/input/pn-multi-row-connected-dropdown/pn-multi-row-connected-dropdown.js +25 -6
  25. package/collection/components/input/pn-multi-row-connected-dropdown/pn-multi-row-connected-dropdown.js.map +1 -1
  26. package/collection/components/input/pn-multi-row-connected-dropdown/pn-multi-row-connected-dropdown.stories.js +2 -0
  27. package/collection/components/navigation/pn-language-selector/pn-language-selector-option.js +7 -1
  28. package/collection/components/navigation/pn-language-selector/pn-language-selector-option.js.map +1 -1
  29. package/components/pn-dropdown-with-multi-input-rows-row2.js +3 -1
  30. package/components/pn-dropdown-with-multi-input-rows-row2.js.map +1 -1
  31. package/components/pn-dropdown-with-multi-input-rows.js +6 -4
  32. package/components/pn-dropdown-with-multi-input-rows.js.map +1 -1
  33. package/components/pn-language-selector-option2.js +7 -1
  34. package/components/pn-language-selector-option2.js.map +1 -1
  35. package/components/pn-multi-row-connected-dropdown-row2.js +28 -26
  36. package/components/pn-multi-row-connected-dropdown-row2.js.map +1 -1
  37. package/components/pn-multi-row-connected-dropdown.js +8 -6
  38. package/components/pn-multi-row-connected-dropdown.js.map +1 -1
  39. package/components/pn-teaser-card.js +1 -1
  40. package/components/pn-teaser-card.js.map +1 -1
  41. package/esm/loader.js +1 -1
  42. package/esm/pn-dropdown-with-multi-input-rows-row.entry.js +2 -1
  43. package/esm/pn-dropdown-with-multi-input-rows-row.entry.js.map +1 -1
  44. package/esm/pn-dropdown-with-multi-input-rows.entry.js +5 -4
  45. package/esm/pn-dropdown-with-multi-input-rows.entry.js.map +1 -1
  46. package/esm/pn-language-selector_9.entry.js +7 -1
  47. package/esm/pn-language-selector_9.entry.js.map +1 -1
  48. package/esm/pn-market-web-components.js +1 -1
  49. package/esm/pn-multi-row-connected-dropdown-row.entry.js +26 -25
  50. package/esm/pn-multi-row-connected-dropdown-row.entry.js.map +1 -1
  51. package/esm/pn-multi-row-connected-dropdown.entry.js +7 -6
  52. package/esm/pn-multi-row-connected-dropdown.entry.js.map +1 -1
  53. package/esm/pn-teaser-card.entry.js +1 -1
  54. package/esm/pn-teaser-card.entry.js.map +1 -1
  55. package/package.json +1 -1
  56. package/pn-market-web-components/p-0bf27e1a.entry.js +2 -0
  57. package/pn-market-web-components/p-0bf27e1a.entry.js.map +1 -0
  58. package/pn-market-web-components/p-0c54be24.entry.js +2 -0
  59. package/pn-market-web-components/p-0c54be24.entry.js.map +1 -0
  60. package/pn-market-web-components/p-655b1ddf.entry.js +2 -0
  61. package/pn-market-web-components/p-655b1ddf.entry.js.map +1 -0
  62. package/pn-market-web-components/p-725aba56.entry.js +2 -0
  63. package/pn-market-web-components/p-725aba56.entry.js.map +1 -0
  64. package/pn-market-web-components/p-cff67e55.entry.js +2 -0
  65. package/pn-market-web-components/p-cff67e55.entry.js.map +1 -0
  66. package/pn-market-web-components/p-fb580773.entry.js +2 -0
  67. package/pn-market-web-components/p-fb580773.entry.js.map +1 -0
  68. package/pn-market-web-components/pn-market-web-components.esm.js +1 -1
  69. package/pn-market-web-components/pn-market-web-components.esm.js.map +1 -1
  70. package/types/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows-row.d.ts +1 -0
  71. package/types/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows.d.ts +1 -0
  72. package/types/components/input/pn-multi-row-connected-dropdown/pn-multi-row-connected-dropdown-row.d.ts +2 -1
  73. package/types/components/input/pn-multi-row-connected-dropdown/pn-multi-row-connected-dropdown.d.ts +2 -1
  74. package/types/components/navigation/pn-language-selector/pn-language-selector-option.d.ts +2 -0
  75. package/types/components.d.ts +8 -0
  76. package/vscode-data.json +16 -0
  77. package/pn-market-web-components/p-2551b0de.entry.js +0 -2
  78. package/pn-market-web-components/p-2551b0de.entry.js.map +0 -1
  79. package/pn-market-web-components/p-6f1dd775.entry.js +0 -2
  80. package/pn-market-web-components/p-6f1dd775.entry.js.map +0 -1
  81. package/pn-market-web-components/p-88013a39.entry.js +0 -2
  82. package/pn-market-web-components/p-88013a39.entry.js.map +0 -1
  83. package/pn-market-web-components/p-8f58dac3.entry.js +0 -2
  84. package/pn-market-web-components/p-8f58dac3.entry.js.map +0 -1
  85. package/pn-market-web-components/p-daba7df2.entry.js +0 -2
  86. package/pn-market-web-components/p-daba7df2.entry.js.map +0 -1
  87. package/pn-market-web-components/p-ef182c3e.entry.js +0 -2
  88. package/pn-market-web-components/p-ef182c3e.entry.js.map +0 -1
@@ -18,6 +18,7 @@ const PnMultiRowConnectedDropdown = class {
18
18
  this.addRowText = null;
19
19
  this.inputFildLabel = null;
20
20
  this.inputFildPlaceholder = null;
21
+ this.disabledDates = null;
21
22
  this.dateButtonText = null;
22
23
  this.datePlaceholder = null;
23
24
  this.dateDaysFromToday = null;
@@ -71,7 +72,7 @@ const PnMultiRowConnectedDropdown = class {
71
72
  this._dateValueName = this.dateButtonText?.length ? this.dateButtonText : 'value4';
72
73
  }
73
74
  componentDidLoad() { }
74
- emittValuesIfValid() {
75
+ emitValuesIfValid() {
75
76
  this.formValues = [];
76
77
  this.rowData.forEach(item => {
77
78
  const rowValue = { row: [] };
@@ -95,7 +96,7 @@ const PnMultiRowConnectedDropdown = class {
95
96
  const inputValue = { name: this._inputValueName, value: input };
96
97
  rowValue.row.push(inputValue);
97
98
  }
98
- const dates = item.dates["start"];
99
+ const dates = item.dates;
99
100
  if (dates?.length) {
100
101
  const datestValue = { name: this._dateValueName, value: dates };
101
102
  rowValue.row.push(datestValue);
@@ -124,14 +125,14 @@ const PnMultiRowConnectedDropdown = class {
124
125
  dates: val.dates,
125
126
  dateRange: val.dateRange,
126
127
  };
127
- this.emittValuesIfValid();
128
+ this.emitValuesIfValid();
128
129
  }
129
130
  deleteRowEvent(e) {
130
131
  const indexToRemove = this.rowData.findIndex(data => data.id === e.detail);
131
132
  this.rowData.splice(indexToRemove, 1);
132
133
  this.rowData = [...this.rowData];
133
134
  this.rowCount = this.rowData.length;
134
- this.emittValuesIfValid();
135
+ this.emitValuesIfValid();
135
136
  }
136
137
  generateUniqueId() {
137
138
  return v4();
@@ -202,8 +203,8 @@ const PnMultiRowConnectedDropdown = class {
202
203
  }
203
204
  }
204
205
  render() {
205
- return (h(Host, { key: '0f0d61b6b25972bbd7718ddb301a9bb7c7b0d9b6' }, this.rowData?.map((data, i) => {
206
- return (h("div", { class: 'generated-row-' + i, id: 'generated-row-connected-dropdown-' + i }, h("pn-multi-row-connected-dropdown-row", { "dropdown-data": this.dropdownData, "language-code": this.languageCode, label: this.label, "first-dropdown-label": this.firstDropdownLabel, "second-dropdown-label": this.secondDropdownLabel, "dropdown-placeholder": this.dropdownPlaceholder, "add-row-text": this.addRowText, "input-fild-label": this.inputFildLabel, "input-fild-placeholder": this.inputFildPlaceholder, "date-button-text": this.dateButtonText, "date-placeholder": this.datePlaceholder, "date-days-from-today": this.dateDaysFromToday, "allow-multiple-dates": this.allowMultipleDates, "start-date-label": this.startDateLabel, "end-date-label": this.endDateLabel, "multi-date-helper-text": this.multiDateHelperText, "generate-dates-button-text": this.generateDatesButtonText, "save-date-button-text": this.saveDateButtonText, "no-dates-text": this.noDatesText, index: i, "predefined-value": JSON.stringify(data), "years-to-add-to-end-date": this.yearsToAddToEndDate, "min-amount": this.minAmount, "error-message-empty": this.errorMessageEmpty, "error-message-min-amount": this.errorMessageMinAmount, "min-warning-amount": this.minWarningAmount, "warning-message-min-amount": this.warningMessageMinAmount })));
206
+ return (h(Host, { key: '72f936b5123cca5da08001070d1ed32051eed34b' }, this.rowData?.map((data, i) => {
207
+ return (h("div", { class: 'generated-row-' + i, id: 'generated-row-connected-dropdown-' + i }, h("pn-multi-row-connected-dropdown-row", { "dropdown-data": this.dropdownData, "language-code": this.languageCode, label: this.label, "first-dropdown-label": this.firstDropdownLabel, "second-dropdown-label": this.secondDropdownLabel, "dropdown-placeholder": this.dropdownPlaceholder, "add-row-text": this.addRowText, "input-fild-label": this.inputFildLabel, "input-fild-placeholder": this.inputFildPlaceholder, "disabled-dates": this.disabledDates, "date-button-text": this.dateButtonText, "date-placeholder": this.datePlaceholder, "date-days-from-today": this.dateDaysFromToday, "allow-multiple-dates": this.allowMultipleDates, "start-date-label": this.startDateLabel, "end-date-label": this.endDateLabel, "multi-date-helper-text": this.multiDateHelperText, "generate-dates-button-text": this.generateDatesButtonText, "save-date-button-text": this.saveDateButtonText, "no-dates-text": this.noDatesText, index: i, "predefined-value": JSON.stringify(data), "years-to-add-to-end-date": this.yearsToAddToEndDate, "min-amount": this.minAmount, "error-message-empty": this.errorMessageEmpty, "error-message-min-amount": this.errorMessageMinAmount, "min-warning-amount": this.minWarningAmount, "warning-message-min-amount": this.warningMessageMinAmount })));
207
208
  }), this.allowMultipleRows ? (h("div", { class: "connected-dropdown__row" }, h("pn-button", { tooltip: this.addRowText ? this.addRowText : null, "left-icon": "true", arialabel: "Add", icon: plus, appearance: "light", variant: "borderless", class: "connected-dropdown__button-right", onClick: () => {
208
209
  this.addRow();
209
210
  } }, this.addRowText))) : null));
@@ -1 +1 @@
1
- {"file":"pn-multi-row-connected-dropdown.entry.js","mappings":"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","names":["uuidv4"],"sources":["src/components/input/pn-multi-row-connected-dropdown/pn-multi-row-connected-dropdown.scss?tag=pn-multi-row-connected-dropdown","src/components/input/pn-multi-row-connected-dropdown/pn-multi-row-connected-dropdown.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-multi-row-connected-dropdown {\n gap: 1rem;\n\n .connected-dropdown {\n &__row {\n display: flex;\n align-items: flex-end;\n gap: 1rem;\n margin-bottom: 1rem;\n justify-content: space-between;\n\n &__no-margin {\n margin: 0;\n }\n }\n\n &__button-right {\n margin-left: auto;\n }\n }\n}\n","import { Component, Prop, h, Element, State, Host, Watch, Event, EventEmitter, Listen } from '@stencil/core';\nimport { FormValue, PredefinedValues, Root, RowValue, SelectItem } from './types';\nimport { v4 as uuidv4 } from 'uuid';\nimport { plus } from 'pn-design-assets/pn-assets/icons.js';\n\n@Component({\n tag: 'pn-multi-row-connected-dropdown',\n styleUrl: 'pn-multi-row-connected-dropdown.scss',\n})\nexport class PnMultiRowConnectedDropdown {\n @Element() hostElement: Element;\n\n @Prop() dropdownData: string | Root[] = null;\n @Prop() languageCode: string = null;\n @Prop() label: string = null;\n @Prop() firstDropdownLabel: string = null;\n @Prop() secondDropdownLabel: string = null;\n @Prop() dropdownPlaceholder: string = null;\n @Prop() addRowText: string = null;\n @Prop() inputFildLabel: string = null;\n @Prop() inputFildPlaceholder: string = null;\n @Prop() dateButtonText: string = null;\n @Prop() datePlaceholder: string = null;\n @Prop() dateDaysFromToday: number = null;\n @Prop() allowMultipleRows: boolean = false;\n @Prop() allowMultipleDates: boolean = false;\n @Prop() startDateLabel: string = null;\n @Prop() endDateLabel: string = null;\n @Prop() multiDateHelperText: string = null;\n @Prop() generateDatesButtonText: string = null;\n @Prop() saveDateButtonText: string = null;\n @Prop() noDatesText: string = null;\n @Prop() yearsToAddToEndDate: number = null;\n @Prop() minAmount: number = 1;\n @Prop() errorMessageEmpty: string;\n @Prop() errorMessageMinAmount: string;\n @Prop() minWarningAmount: number = null;\n @Prop() warningMessageMinAmount: string;\n\n @State() rowCount: number = null;\n @State() rowData: PredefinedValues[] = null;\n @State() formValues: FormValue[] = null;\n\n private _buttonValueName: string = null;\n private _firstDropdownValueName: string = null;\n private _secondDropdownValueName: string = null;\n private _inputValueName: string = null;\n private _dateValueName: string = null;\n\n @Event() allFormValues: EventEmitter<string>;\n\n private _defaultRow: PredefinedValues = {\n id: this.generateUniqueId(),\n buttons: [],\n firstDropdown: [],\n secondDropdown: [],\n input: '',\n dates: '',\n dateRange: {\n days: [],\n startDate: '',\n endDate: '',\n },\n };\n\n componentWillLoad() {\n this.setDaysArr();\n this.formValues = [];\n this.rowData = [this._defaultRow];\n this.rowCount = this.rowData.length;\n\n this._buttonValueName = this.label?.length ? this.label : 'value0';\n this._firstDropdownValueName = this.firstDropdownLabel?.length ? this.firstDropdownLabel : 'value1';\n this._secondDropdownValueName = this.secondDropdownLabel?.length ? this.secondDropdownLabel : 'value2';\n this._inputValueName = this.inputFildLabel?.length ? this.inputFildLabel : 'value3';\n this._dateValueName = this.dateButtonText?.length ? this.dateButtonText : 'value4';\n }\n\n componentDidLoad() {}\n\n emittValuesIfValid() {\n this.formValues = [];\n this.rowData.forEach(item => {\n const rowValue: FormValue = { row: [] };\n\n const buttonSelection = item.buttons.find(x => x.selected === true);\n if (buttonSelection) {\n const buttonValue: RowValue = { name: this._buttonValueName, value: buttonSelection.label };\n rowValue.row.push(buttonValue);\n }\n\n const firstDropdownSelection = item.firstDropdown.find(x => x.selected === true);\n if (firstDropdownSelection) {\n const firstDropdownValue: RowValue = { name: this._firstDropdownValueName, value: firstDropdownSelection.label };\n rowValue.row.push(firstDropdownValue);\n }\n\n const secondDropdownSelection = item.secondDropdown.find(x => x.selected === true);\n if (secondDropdownSelection) {\n const secondDropdownValue: RowValue = { name: this._secondDropdownValueName, value: secondDropdownSelection.label };\n rowValue.row.push(secondDropdownValue);\n }\n\n const input = item.input;\n if (input?.length) {\n const inputValue: RowValue = { name: this._inputValueName, value: input };\n rowValue.row.push(inputValue);\n }\n\n const dates = item.dates[\"start\"];\n if (dates?.length) {\n const datestValue: RowValue = { name: this._dateValueName, value: dates };\n rowValue.row.push(datestValue);\n }\n\n if (rowValue.row.length === 5) {\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 @Listen('rowValueChange')\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 buttons: val.buttons,\n firstDropdown: val.firstDropdown,\n secondDropdown: val.secondDropdown,\n input: val.input,\n dates: val.dates,\n dateRange: val.dateRange,\n };\n this.emittValuesIfValid();\n }\n\n @Listen('deleteRowEvent')\n deleteRowEvent(e) {\n const indexToRemove = this.rowData.findIndex(data => data.id === e.detail);\n this.rowData.splice(indexToRemove, 1);\n this.rowData = [...this.rowData];\n this.rowCount = this.rowData.length;\n this.emittValuesIfValid();\n }\n\n generateUniqueId() {\n return uuidv4();\n }\n\n addRow() {\n const newRow = this._defaultRow;\n newRow.id = this.generateUniqueId();\n\n this.rowData = [...this.rowData, newRow];\n this.rowCount = this.rowData.length;\n }\n\n setDaysArr() {\n const language = this.languageCode.toLowerCase();\n\n switch (language) {\n case 'en':\n this._defaultRow.dateRange.days = [\n { label: 'Monday', value: '1', selected: false },\n { label: 'Tuesday', value: '2', selected: false },\n { label: 'Wednesday', value: '3', selected: false },\n { label: 'Thursday', value: '4', selected: false },\n { label: 'Friday', value: '5', selected: false },\n ];\n break;\n\n case 'sv':\n this._defaultRow.dateRange.days = [\n { label: 'Måndag', value: '1', selected: false },\n { label: 'Tisdag', value: '2', selected: false },\n { label: 'Onsdag', value: '3', selected: false },\n { label: 'Torsdag', value: '4', selected: false },\n { label: 'Fredag', value: '5', selected: false },\n ];\n break;\n\n case 'da':\n this._defaultRow.dateRange.days = [\n { label: 'Mandag', value: '1', selected: false },\n { label: 'Tirsdag', value: '2', selected: false },\n { label: 'Onsdag', value: '3', selected: false },\n { label: 'Torsdag', value: '4', selected: false },\n { label: 'Fredag', value: '5', selected: false },\n ];\n break;\n\n case 'fi':\n this._defaultRow.dateRange.days = [\n { label: 'Maanantai', value: '1', selected: false },\n { label: 'Tiistai', value: '2', selected: false },\n { label: 'Keskiviikko', value: '3', selected: false },\n { label: 'Torstai', value: '4', selected: false },\n { label: 'Perjantai', value: '5', selected: false },\n ];\n break;\n\n case 'no':\n this._defaultRow.dateRange.days = [\n { label: 'Mandag', value: '1', selected: false },\n { label: 'Tirsdag', value: '2', selected: false },\n { label: 'Onsdag', value: '3', selected: false },\n { label: 'Torsdag', value: '4', selected: false },\n { label: 'Fredag', value: '5', selected: false },\n ];\n break;\n\n default:\n this._defaultRow.dateRange.days = [\n { label: 'Monday', value: '1', selected: false },\n { label: 'Tuesday', value: '2', selected: false },\n { label: 'Wednesday', value: '3', selected: false },\n { label: 'Thursday', value: '4', selected: false },\n { label: 'Friday', value: '5', selected: false },\n ];\n break;\n }\n }\n\n render() {\n return (\n <Host>\n {this.rowData?.map((data, i) => {\n return (\n <div class={'generated-row-' + i} id={'generated-row-connected-dropdown-' + i}>\n <pn-multi-row-connected-dropdown-row\n dropdown-data={this.dropdownData}\n language-code={this.languageCode}\n label={this.label}\n first-dropdown-label={this.firstDropdownLabel}\n second-dropdown-label={this.secondDropdownLabel}\n dropdown-placeholder={this.dropdownPlaceholder}\n add-row-text={this.addRowText}\n input-fild-label={this.inputFildLabel}\n input-fild-placeholder={this.inputFildPlaceholder}\n date-button-text={this.dateButtonText}\n date-placeholder={this.datePlaceholder}\n date-days-from-today={this.dateDaysFromToday}\n allow-multiple-dates={this.allowMultipleDates}\n start-date-label={this.startDateLabel}\n end-date-label={this.endDateLabel}\n multi-date-helper-text={this.multiDateHelperText}\n generate-dates-button-text={this.generateDatesButtonText}\n save-date-button-text={this.saveDateButtonText}\n no-dates-text={this.noDatesText}\n index={i}\n predefined-value={JSON.stringify(data)}\n years-to-add-to-end-date={this.yearsToAddToEndDate}\n min-amount={this.minAmount}\n error-message-empty={this.errorMessageEmpty}\n error-message-min-amount={this.errorMessageMinAmount}\n min-warning-amount={this.minWarningAmount}\n warning-message-min-amount={this.warningMessageMinAmount}\n ></pn-multi-row-connected-dropdown-row>\n </div>\n );\n })}\n\n {this.allowMultipleRows ? (\n <div class=\"connected-dropdown__row\">\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();\n }}\n >\n {this.addRowText}\n </pn-button>\n </div>\n ) : null}\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"pn-multi-row-connected-dropdown.entry.js","mappings":"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","names":["uuidv4"],"sources":["src/components/input/pn-multi-row-connected-dropdown/pn-multi-row-connected-dropdown.scss?tag=pn-multi-row-connected-dropdown","src/components/input/pn-multi-row-connected-dropdown/pn-multi-row-connected-dropdown.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-multi-row-connected-dropdown {\n gap: 1rem;\n\n .connected-dropdown {\n &__row {\n display: flex;\n align-items: flex-end;\n gap: 1rem;\n margin-bottom: 1rem;\n justify-content: space-between;\n\n &__no-margin {\n margin: 0;\n }\n }\n\n &__button-right {\n margin-left: auto;\n }\n }\n}\n","import { Component, Prop, h, Element, State, Host, Watch, Event, EventEmitter, Listen } from '@stencil/core';\nimport { FormValue, PredefinedValues, Root, RowValue, SelectItem } from './types';\nimport { v4 as uuidv4 } from 'uuid';\nimport { plus } from 'pn-design-assets/pn-assets/icons.js';\n\n@Component({\n tag: 'pn-multi-row-connected-dropdown',\n styleUrl: 'pn-multi-row-connected-dropdown.scss',\n})\nexport class PnMultiRowConnectedDropdown {\n @Element() hostElement: Element;\n\n @Prop() dropdownData: string | Root[] = null;\n @Prop() languageCode: string = null;\n @Prop() label: string = null;\n @Prop() firstDropdownLabel: string = null;\n @Prop() secondDropdownLabel: string = null;\n @Prop() dropdownPlaceholder: string = null;\n @Prop() addRowText: string = null;\n @Prop() inputFildLabel: string = null;\n @Prop() inputFildPlaceholder: string = null;\n @Prop() disabledDates: string = null;\n @Prop() dateButtonText: string = null;\n @Prop() datePlaceholder: string = null;\n @Prop() dateDaysFromToday: number = null;\n @Prop() allowMultipleRows: boolean = false;\n @Prop() allowMultipleDates: boolean = false;\n @Prop() startDateLabel: string = null;\n @Prop() endDateLabel: string = null;\n @Prop() multiDateHelperText: string = null;\n @Prop() generateDatesButtonText: string = null;\n @Prop() saveDateButtonText: string = null;\n @Prop() noDatesText: string = null;\n @Prop() yearsToAddToEndDate: number = null;\n @Prop() minAmount: number = 1;\n @Prop() errorMessageEmpty: string;\n @Prop() errorMessageMinAmount: string;\n @Prop() minWarningAmount: number = null;\n @Prop() warningMessageMinAmount: string;\n\n @State() rowCount: number = null;\n @State() rowData: PredefinedValues[] = null;\n @State() formValues: FormValue[] = null;\n\n private _buttonValueName: string = null;\n private _firstDropdownValueName: string = null;\n private _secondDropdownValueName: string = null;\n private _inputValueName: string = null;\n private _dateValueName: string = null;\n\n @Event() allFormValues: EventEmitter<string>;\n\n private _defaultRow: PredefinedValues = {\n id: this.generateUniqueId(),\n buttons: [],\n firstDropdown: [],\n secondDropdown: [],\n input: '',\n dates: '',\n dateRange: {\n days: [],\n startDate: '',\n endDate: '',\n },\n };\n\n componentWillLoad() {\n this.setDaysArr();\n this.formValues = [];\n this.rowData = [this._defaultRow];\n this.rowCount = this.rowData.length;\n\n this._buttonValueName = this.label?.length ? this.label : 'value0';\n this._firstDropdownValueName = this.firstDropdownLabel?.length ? this.firstDropdownLabel : 'value1';\n this._secondDropdownValueName = this.secondDropdownLabel?.length ? this.secondDropdownLabel : 'value2';\n this._inputValueName = this.inputFildLabel?.length ? this.inputFildLabel : 'value3';\n this._dateValueName = this.dateButtonText?.length ? this.dateButtonText : 'value4';\n }\n\n componentDidLoad() {}\n\n emitValuesIfValid() {\n this.formValues = [];\n this.rowData.forEach(item => {\n const rowValue: FormValue = { row: [] };\n\n const buttonSelection = item.buttons.find(x => x.selected === true);\n if (buttonSelection) {\n const buttonValue: RowValue = { name: this._buttonValueName, value: buttonSelection.label };\n rowValue.row.push(buttonValue);\n }\n\n const firstDropdownSelection = item.firstDropdown.find(x => x.selected === true);\n if (firstDropdownSelection) {\n const firstDropdownValue: RowValue = { name: this._firstDropdownValueName, value: firstDropdownSelection.label };\n rowValue.row.push(firstDropdownValue);\n }\n\n const secondDropdownSelection = item.secondDropdown.find(x => x.selected === true);\n if (secondDropdownSelection) {\n const secondDropdownValue: RowValue = { name: this._secondDropdownValueName, value: secondDropdownSelection.label };\n rowValue.row.push(secondDropdownValue);\n }\n\n const input = item.input;\n if (input?.length) {\n const inputValue: RowValue = { name: this._inputValueName, value: input };\n rowValue.row.push(inputValue);\n }\n\n const dates = item.dates;\n if (dates?.length) {\n const datestValue: RowValue = { name: this._dateValueName, value: dates };\n rowValue.row.push(datestValue);\n }\n\n if (rowValue.row.length === 5) {\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 @Listen('rowValueChange')\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 buttons: val.buttons,\n firstDropdown: val.firstDropdown,\n secondDropdown: val.secondDropdown,\n input: val.input,\n dates: val.dates,\n dateRange: val.dateRange,\n };\n this.emitValuesIfValid();\n }\n\n @Listen('deleteRowEvent')\n deleteRowEvent(e) {\n const indexToRemove = this.rowData.findIndex(data => data.id === e.detail);\n this.rowData.splice(indexToRemove, 1);\n this.rowData = [...this.rowData];\n this.rowCount = this.rowData.length;\n this.emitValuesIfValid();\n }\n\n generateUniqueId() {\n return uuidv4();\n }\n\n addRow() {\n const newRow = this._defaultRow;\n newRow.id = this.generateUniqueId();\n\n this.rowData = [...this.rowData, newRow];\n this.rowCount = this.rowData.length;\n }\n\n setDaysArr() {\n const language = this.languageCode.toLowerCase();\n\n switch (language) {\n case 'en':\n this._defaultRow.dateRange.days = [\n { label: 'Monday', value: '1', selected: false },\n { label: 'Tuesday', value: '2', selected: false },\n { label: 'Wednesday', value: '3', selected: false },\n { label: 'Thursday', value: '4', selected: false },\n { label: 'Friday', value: '5', selected: false },\n ];\n break;\n\n case 'sv':\n this._defaultRow.dateRange.days = [\n { label: 'Måndag', value: '1', selected: false },\n { label: 'Tisdag', value: '2', selected: false },\n { label: 'Onsdag', value: '3', selected: false },\n { label: 'Torsdag', value: '4', selected: false },\n { label: 'Fredag', value: '5', selected: false },\n ];\n break;\n\n case 'da':\n this._defaultRow.dateRange.days = [\n { label: 'Mandag', value: '1', selected: false },\n { label: 'Tirsdag', value: '2', selected: false },\n { label: 'Onsdag', value: '3', selected: false },\n { label: 'Torsdag', value: '4', selected: false },\n { label: 'Fredag', value: '5', selected: false },\n ];\n break;\n\n case 'fi':\n this._defaultRow.dateRange.days = [\n { label: 'Maanantai', value: '1', selected: false },\n { label: 'Tiistai', value: '2', selected: false },\n { label: 'Keskiviikko', value: '3', selected: false },\n { label: 'Torstai', value: '4', selected: false },\n { label: 'Perjantai', value: '5', selected: false },\n ];\n break;\n\n case 'no':\n this._defaultRow.dateRange.days = [\n { label: 'Mandag', value: '1', selected: false },\n { label: 'Tirsdag', value: '2', selected: false },\n { label: 'Onsdag', value: '3', selected: false },\n { label: 'Torsdag', value: '4', selected: false },\n { label: 'Fredag', value: '5', selected: false },\n ];\n break;\n\n default:\n this._defaultRow.dateRange.days = [\n { label: 'Monday', value: '1', selected: false },\n { label: 'Tuesday', value: '2', selected: false },\n { label: 'Wednesday', value: '3', selected: false },\n { label: 'Thursday', value: '4', selected: false },\n { label: 'Friday', value: '5', selected: false },\n ];\n break;\n }\n }\n\n render() {\n return (\n <Host>\n {this.rowData?.map((data, i) => {\n return (\n <div class={'generated-row-' + i} id={'generated-row-connected-dropdown-' + i}>\n <pn-multi-row-connected-dropdown-row\n dropdown-data={this.dropdownData}\n language-code={this.languageCode}\n label={this.label}\n first-dropdown-label={this.firstDropdownLabel}\n second-dropdown-label={this.secondDropdownLabel}\n dropdown-placeholder={this.dropdownPlaceholder}\n add-row-text={this.addRowText}\n input-fild-label={this.inputFildLabel}\n input-fild-placeholder={this.inputFildPlaceholder}\n disabled-dates={this.disabledDates}\n date-button-text={this.dateButtonText}\n date-placeholder={this.datePlaceholder}\n date-days-from-today={this.dateDaysFromToday}\n allow-multiple-dates={this.allowMultipleDates}\n start-date-label={this.startDateLabel}\n end-date-label={this.endDateLabel}\n multi-date-helper-text={this.multiDateHelperText}\n generate-dates-button-text={this.generateDatesButtonText}\n save-date-button-text={this.saveDateButtonText}\n no-dates-text={this.noDatesText}\n index={i}\n predefined-value={JSON.stringify(data)}\n years-to-add-to-end-date={this.yearsToAddToEndDate}\n min-amount={this.minAmount}\n error-message-empty={this.errorMessageEmpty}\n error-message-min-amount={this.errorMessageMinAmount}\n min-warning-amount={this.minWarningAmount}\n warning-message-min-amount={this.warningMessageMinAmount}\n ></pn-multi-row-connected-dropdown-row>\n </div>\n );\n })}\n\n {this.allowMultipleRows ? (\n <div class=\"connected-dropdown__row\">\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();\n }}\n >\n {this.addRowText}\n </pn-button>\n </div>\n ) : null}\n </Host>\n );\n }\n}\n"],"version":3}
@@ -1,6 +1,6 @@
1
1
  import { r as registerInstance, g as getElement, h, d as Host } from './index-51d67461.js';
2
2
 
3
- const pnTeaserCardCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.block.teasercardblock a[data-block-clickable-link=true]{z-index:1}pn-teaser-card{width:100%;height:100%;display:flex}pn-teaser-card .pn-teaser-card__container{display:flex;flex-direction:column;justify-content:flex-start;border-radius:2.4rem;width:100%}pn-teaser-card .pn-teaser-card__container__image__container{width:100%;position:relative}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{clip-path:ellipse(100% 90% at 50% 0%);height:100%;overflow:hidden;border-top-left-radius:2.4rem;border-top-right-radius:2.4rem}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{width:100%;height:auto;transition:0.4s ease-in-out;transform:scale(1);aspect-ratio:16/9;object-fit:cover;object-position:50% 0}pn-teaser-card .pn-teaser-card__container__content{display:flex;flex-direction:column;justify-content:space-between;flex:1 1 100%;gap:3.2rem;padding:2.4rem 2.4rem;padding-top:0}pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:2.4rem;line-height:2.64rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{padding-top:1.6rem;font-weight:400;font-size:1.6rem;line-height:2.24rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__label{display:block;margin-bottom:1.6rem;font-weight:400;font-size:1.2rem;line-height:140%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{align-self:flex-end;width:100%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button a:hover{text-decoration:none}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>button>.pn-button-bg,pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>a>.pn-button-bg{transition:0.4s ease-in-out}@media screen and (min-width: 768px){pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{width:fit-content}}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500;font-size:1.6rem;text-decoration:none;color:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg{transition:0.3s ease-in-out;position:relative;left:-0.3rem}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg path{fill:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated[target=_blank]:not(.pn-button):after{display:none}pn-teaser-card[data-card-color=coral]>.pn-teaser-card__container{background-color:#fdefee}pn-teaser-card[data-card-color=green]>.pn-teaser-card__container{background-color:#dcf6e7}pn-teaser-card[data-card-color=blue]>.pn-teaser-card__container{background-color:#effbff}pn-teaser-card[data-card-color=blue50]>.pn-teaser-card__container{background-color:#e0f8ff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container{background-color:#00a0d6}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container{background-color:#0d234b}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading{color:#f06365}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=white]>.pn-teaser-card__container{background-color:#ffffff}.teasercardlistblock .teasercardblock.has-bg{background-color:transparent;background:transparent}@media screen and (min-width: 1200px){.onequarterwidth .pn-teaser-card__container__content__text__container__label{margin-bottom:0.8rem}}.onethirdwidth pn-teaser-card .pn-teaser-card__container__image__container--no-image,.onequarterwidth pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}.onethirdwidth .pn-teaser-card__container__content__cta .secondary-link--animated,.onequarterwidth .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}@media screen and (min-width: 992px){.halfwidth pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}}@media screen and (min-width: 1200px){.halfwidth pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:4rem}.halfwidth pn-teaser-card .pn-teaser-card__container__content{padding:0 4rem 4rem}.halfwidth pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:3.2rem;line-height:3.52rem}.halfwidth pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-weight:400;font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 1640px){.halfwidth pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:5.6rem}.halfwidth pn-teaser-card .pn-teaser-card__container__content{padding:0 5.6rem 5.6rem}}.fullwidth pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.fullwidth pn-teaser-card .pn-teaser-card__container__image__container--no-image{width:auto;padding-top:2.4rem}@media screen and (min-width: 768px){.fullwidth pn-teaser-card{min-height:35rem}.fullwidth pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}.fullwidth pn-teaser-card .pn-teaser-card__container{flex-direction:row}.fullwidth pn-teaser-card .pn-teaser-card__container__content{align-self:center;gap:2.4rem;padding:3.2rem 3.2rem 3.2rem 2.4rem}.fullwidth pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{border-top-left-radius:2.4rem;border-bottom-left-radius:2.4rem;clip-path:ellipse(100% 100% at 0% 50%)}.fullwidth pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{height:100%;object-fit:cover}}@media screen and (min-width: 1200px){.fullwidth pn-teaser-card{min-height:52rem}.fullwidth pn-teaser-card .pn-teaser-card__container__content{padding:4rem 4rem 4rem 3.2rem}.fullwidth pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:4.8rem;line-height:5.28rem}.fullwidth pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 768px){.fullwidth pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container{flex-direction:row-reverse}.fullwidth pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:3.2rem 2.4rem 3.2rem 3.2rem}.fullwidth pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__image__container>[slot=illustration]{border-bottom-right-radius:2.4rem;clip-path:ellipse(100% 100% at 100% 50%)}}@media screen and (min-width: 1200px){.fullwidth pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:4rem 3.2rem 4rem 4rem}}pn-teaser-card.teaser-card--hover-effect:hover{cursor:pointer}pn-teaser-card.teaser-card--hover-effect:hover .pn-teaser-card__container__image__container [slot=illustration] picture>img{transform:scale(1.02);filter:brightness(0.85)}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated{text-decoration:underline}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated pn-icon svg{left:0}pn-teaser-card.teaser-card--hover-effect:hover pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover pn-button a .pn-button-bg{background-color:#0d234b}pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button a .pn-button-bg{background-color:#00a0d6}";
3
+ const pnTeaserCardCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.block.teasercardblock a[data-block-clickable-link=true]{z-index:1}pn-teaser-card{width:100%;height:100%;display:flex}pn-teaser-card .pn-teaser-card__container{display:flex;flex-direction:column;justify-content:flex-start;border-radius:2.4rem;width:100%}pn-teaser-card .pn-teaser-card__container__image__container{width:100%;position:relative}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{clip-path:ellipse(100% 90% at 50% 0%);height:100%;overflow:hidden;border-top-left-radius:2.4rem;border-top-right-radius:2.4rem}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{width:100%;height:auto;transition:0.4s ease-in-out;transform:scale(1);aspect-ratio:16/9;object-fit:cover;object-position:50% 0}pn-teaser-card .pn-teaser-card__container__content{display:flex;flex-direction:column;justify-content:space-between;flex:1 1 100%;gap:3.2rem;padding:2.4rem 2.4rem;padding-top:0}pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:2.4rem;line-height:2.64rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{padding-top:1.6rem;font-weight:400;font-size:1.6rem;line-height:2.24rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__label{display:block;margin-bottom:1.6rem;font-weight:400;font-size:1.2rem;line-height:140%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{align-self:flex-end;width:100%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button a:hover{text-decoration:none}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>button>.pn-button-bg,pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>a>.pn-button-bg{transition:0.4s ease-in-out}@media screen and (min-width: 768px){pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{width:fit-content}}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500;font-size:1.6rem;text-decoration:none;color:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg{transition:0.3s ease-in-out;position:relative;left:-0.3rem}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg path{fill:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated[target=_blank]:not(.pn-button):after{display:none}pn-teaser-card[data-card-color=coral]>.pn-teaser-card__container{background-color:#fdefee}pn-teaser-card[data-card-color=green]>.pn-teaser-card__container{background-color:#dcf6e7}pn-teaser-card[data-card-color=blue]>.pn-teaser-card__container{background-color:#effbff}pn-teaser-card[data-card-color=blue50]>.pn-teaser-card__container{background-color:#e0f8ff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container{background-color:#00a0d6}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container{background-color:#0d234b}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading{color:#f06365}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=white]>.pn-teaser-card__container{background-color:#ffffff}.teasercardlistblock .teasercardblock.has-bg{background-color:transparent;background:transparent}@media screen and (min-width: 1200px){.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__text__container__label{margin-bottom:0.8rem}}.onethirdwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image,.onequarterwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}.onethirdwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated,.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}@media screen and (min-width: 992px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}}@media screen and (min-width: 1200px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 4rem 4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:3.2rem;line-height:3.52rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-weight:400;font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 1640px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:5.6rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 5.6rem 5.6rem}}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{width:auto;padding-top:2.4rem}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:35rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container{flex-direction:row}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{align-self:center;gap:2.4rem;padding:3.2rem 3.2rem 3.2rem 2.4rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{border-top-left-radius:2.4rem;border-bottom-left-radius:2.4rem;clip-path:ellipse(100% 100% at 0% 50%)}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{height:100%;object-fit:cover}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:52rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:4rem 4rem 4rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:4.8rem;line-height:5.28rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container{flex-direction:row-reverse}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:3.2rem 2.4rem 3.2rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__image__container>[slot=illustration]{border-bottom-right-radius:2.4rem;clip-path:ellipse(100% 100% at 100% 50%)}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:4rem 3.2rem 4rem 4rem}}pn-teaser-card.teaser-card--hover-effect:hover{cursor:pointer}pn-teaser-card.teaser-card--hover-effect:hover .pn-teaser-card__container__image__container [slot=illustration] picture>img{transform:scale(1.02);filter:brightness(0.85)}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated{text-decoration:underline}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated pn-icon svg{left:0}pn-teaser-card.teaser-card--hover-effect:hover pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover pn-button a .pn-button-bg{background-color:#0d234b}pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button a .pn-button-bg{background-color:#00a0d6}";
4
4
  const PnTeaserCardStyle0 = pnTeaserCardCss;
5
5
 
6
6
  const PnTeaserCard = class {
@@ -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;;6BAEoB,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;QAErF,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,KAAK,CAAC,IAAI,CAAC,YAAmB,CAAC,EAAE;YACzD,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;SACvB;KACF;;IAGD,MAAM;QACJ,MAAM,eAAe,GAAG,IAAI,CAAC,KAAK,EAAE,WAAW,EAAE,CAAC;QAClD,MAAM,UAAU,GAAG,IAAI,IAAI,CAAC,YAAY,IAAI,CAAC,EAAE,CAAC;QAEhD,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,EACpH,IAAI,CAAC,OAAO,IAAI,EAAC,UAAU,qDAAC,KAAK,EAAC,8DAA8D,IAAE,IAAI,CAAC,OAAO,CAAc,EAC7H,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() headingLevel?: number;\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 if (!this.headingLevel || isNaN(this.headingLevel as any)) {\n this.headingLevel = 3;\n }\n }\n\n //render\n render() {\n const labelToCapitals = this.label?.toUpperCase();\n const HeadingTag = `h${this.headingLevel ?? 3}`;\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 {this.heading && <HeadingTag class=\"pn-teaser-card__container__content__text__container__heading\">{this.heading}</HeadingTag>}\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,8iTAA8iT,CAAC;AACvkT,2BAAe,eAAe;;MCKjB,YAAY;;;oBAGA,IAAI;uBACD,IAAI;qBACL,IAAI;;6BAEoB,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;QAErF,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,KAAK,CAAC,IAAI,CAAC,YAAmB,CAAC,EAAE;YACzD,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;SACvB;KACF;;IAGD,MAAM;QACJ,MAAM,eAAe,GAAG,IAAI,CAAC,KAAK,EAAE,WAAW,EAAE,CAAC;QAClD,MAAM,UAAU,GAAG,IAAI,IAAI,CAAC,YAAY,IAAI,CAAC,EAAE,CAAC;QAEhD,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,EACpH,IAAI,CAAC,OAAO,IAAI,EAAC,UAAU,qDAAC,KAAK,EAAC,8DAA8D,IAAE,IAAI,CAAC,OAAO,CAAc,EAC7H,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:not(.familywrapperblock) {\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:not(.familywrapperblock),\n.onequarterwidth:not(.familywrapperblock) {\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:not(.familywrapperblock) {\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:not(.familywrapperblock) {\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() headingLevel?: number;\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 if (!this.headingLevel || isNaN(this.headingLevel as any)) {\n this.headingLevel = 3;\n }\n }\n\n //render\n render() {\n const labelToCapitals = this.label?.toUpperCase();\n const HeadingTag = `h${this.headingLevel ?? 3}`;\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 {this.heading && <HeadingTag class=\"pn-teaser-card__container__content__text__container__heading\">{this.heading}</HeadingTag>}\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
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@postnord/pn-marketweb-components",
3
- "version": "3.4.21",
3
+ "version": "3.4.23",
4
4
  "description": "PostNord Market Websites Components",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -0,0 +1,2 @@
1
+ import{r as t,c as e,g as n,h as o,d as s}from"./p-bb1c965e.js";import{d as i}from"./p-aed52bc1.js";import{m as d}from"./p-b2f2fbb6.js";import{v as l}from"./p-4ed69de7.js";const r="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-multi-row-connected-dropdown-row{gap:1rem}pn-multi-row-connected-dropdown-row .connected-dropdown__row.input-row pn-select,pn-multi-row-connected-dropdown-row .connected-dropdown__row.input-row pn-input{width:25%}pn-multi-row-connected-dropdown-row .connected-dropdown-parent-element{margin-bottom:0.5rem}pn-multi-row-connected-dropdown-row pn-select{width:35%}pn-multi-row-connected-dropdown-row pn-marketweb-input{width:10%}pn-multi-row-connected-dropdown-row pn-marketweb-input input{height:4.3rem}pn-multi-row-connected-dropdown-row .connected-dropdown{padding:1rem;border-left:0.2rem solid #005d92}pn-multi-row-connected-dropdown-row .connected-dropdown:hover{background-color:#f9f8f8}pn-multi-row-connected-dropdown-row .connected-dropdown__toggle-date-button{width:20%;margin-bottom:0.5rem}pn-multi-row-connected-dropdown-row .connected-dropdown__row{display:flex;align-items:flex-start;gap:1rem;margin-bottom:1rem;justify-content:space-between}pn-multi-row-connected-dropdown-row .connected-dropdown__row__no-margin{margin:0}pn-multi-row-connected-dropdown-row .connected-dropdown__multi-date-row{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}pn-multi-row-connected-dropdown-row .connected-dropdown__button-container{display:flex;align-items:flex-end;gap:1rem}pn-multi-row-connected-dropdown-row .connected-dropdown__button{background-color:#ffffff;border:solid;border-width:0.1rem;border-radius:0.8rem;border-color:#005d92;padding:0.4rem 0.8rem;color:#005d92;font-size:1.4rem;text-align:center;text-decoration:none;cursor:pointer}pn-multi-row-connected-dropdown-row .connected-dropdown__button:hover,pn-multi-row-connected-dropdown-row .connected-dropdown__button.active{background-color:#0d234b;border-color:#0d234b;color:#ffffff}pn-multi-row-connected-dropdown-row .connected-dropdown__buttom-container-right{display:flex}pn-multi-row-connected-dropdown-row .connected-dropdown__button-right{margin-left:auto}pn-multi-row-connected-dropdown-row .connected-dropdown__label-container{margin-bottom:0.4rem;color:#5e554a;font-size:0.875em;justify-content:space-between;align-items:flex-end}pn-multi-row-connected-dropdown-row .connected-dropdown__checkbox{display:flex;gap:0.5rem}pn-multi-row-connected-dropdown-row .connected-dropdown__date-slot{border:0.1rem solid #005d92;margin-bottom:1rem;padding:1rem}pn-multi-row-connected-dropdown-row .generated-date-row{border-bottom:0.1rem solid #005d92}";const c=r;const h=class{constructor(n){t(this,n);this.rowValueChange=e(this,"rowValueChange",7);this.deleteRowEvent=e(this,"deleteRowEvent",7);this.dropdownData=null;this.languageCode=null;this.label=null;this.firstDropdownLabel=null;this.secondDropdownLabel=null;this.dropdownPlaceholder=null;this.addRowText=null;this.inputFildLabel=null;this.inputFildPlaceholder=null;this.disabledDates=null;this.dateButtonText=null;this.datePlaceholder=null;this.dateDaysFromToday=1;this.allowMultipleDates=null;this.startDateLabel=null;this.endDateLabel=null;this.multiDateHelperText=null;this.generateDatesButtonText=null;this.saveDateButtonText=null;this.noDatesText=null;this.index=null;this.predefinedValue=null;this.yearsToAddToEndDate=null;this.minAmount=null;this.errorMessageEmpty=undefined;this.errorMessageMinAmount=undefined;this.minWarningAmount=null;this.warningMessageMinAmount=undefined;this.buttonsArray=null;this.firstDropdownArr=null;this.secondDropdownArr=[];this.firstDropdownClass=null;this.secondDropdownClass=null;this.firstValidDateString="";this.lastValidDateString="";this.firstDropdownPlaceholder="-";this.secondDropdownPlaceholder="-";this.startDateValue="";this.endDateValue="";this.generatedDatesArr=[];this.selectedButtonValue="";this.inputFieldValue="";this.dateValue="";this.daysArr=null}get hostElement(){return n(this)}_dropdownData;_predefinedValue;pnConnectedDropdown=null;pnConnectedDropdownSlotElement=null;pnAddFieldButton=null;pnFirstDropdown=null;pnSecondDropdown=null;pnInputField=null;pnSingleDatePicker=null;pnStartDate=null;pnEndDate=null;pnShowDateRangeFiledButton=null;pnDateRangeContainer=null;pnGenerateDatesButton=null;pnDaysRow=null;pnGeneratedDatesSlot=null;pnSaveGeneratedDatesButton=null;pnDeleteRowButton=null;rowValueChange;deleteRowEvent;componentWillLoad(){this.getPredefinedValues();this.setDropDownData();this.setFirstValidDate()}componentDidLoad(){this.setInitialValues();this.addEventHandlers();this.emitRowValues()}setDropDownData(){if(typeof this.dropdownData==="string"){this._dropdownData=JSON.parse(this.dropdownData)}else{this._dropdownData=this.dropdownData}}getPredefinedValues(){this._predefinedValue=JSON.parse(this.predefinedValue)}applyPredefinedValue(){this.getPredefinedValues();this.setInitialValues()}setInitialValues(){this.setButtonsValue();this.setFirstDropdownValues();this.setSecondDropdownValues();this.setInputField();this.setDateValue();this.setDateRangeDefaults();this.firstDropdownClass=this.firstDropdownLabel.replace(" ","_")+"-dropdown";this.secondDropdownClass=this.secondDropdownLabel.replace(" ","_")+"-dropdown"}setButtonsValue(){this.buttonsArray=[];if(this._predefinedValue.buttons?.length){this.buttonsArray=this._predefinedValue.buttons;this.buttonsArray.forEach((t=>{if(t.selected){this.selectedButtonValue=t.value}}))}else{this._dropdownData.forEach((t=>{const e={selected:false,value:t.label,label:t.label};this.buttonsArray.push(e)}))}}setFirstDropdownValues(){this.firstDropdownArr=[];if(this._predefinedValue.firstDropdown?.length){this.firstDropdownArr=[...this._predefinedValue.firstDropdown]}}setSecondDropdownValues(){this.secondDropdownArr=[];if(this._predefinedValue.secondDropdown?.length){this.secondDropdownArr=[...this._predefinedValue.secondDropdown]}}setInputField(){this.inputFieldValue=this._predefinedValue.input?.length?this._predefinedValue.input:""}setDateValue(){if(this.allowMultipleDates){this.pnDateRangeContainer.style.display=this._predefinedValue.dates["start"]?.length?"":"none";this.generatedDatesArr=this._predefinedValue.dates["start"]?.length?this._predefinedValue.dates["start"].split(","):[];this.saveGeneratedDates()}else{this.dateValue=this._predefinedValue.dates["start"]?.length?this._predefinedValue.dates["start"]:""}}setDateRangeDefaults(){this.daysArr=this._predefinedValue.dateRange.days;this.startDateValue=this._predefinedValue.dateRange.startDate?.length?this._predefinedValue.dateRange.startDate:"";this.endDateValue=this._predefinedValue.dateRange.endDate?.length?this._predefinedValue.dateRange.endDate:""}setFirstValidDate(){const t=this.yearsToAddToEndDate?this.yearsToAddToEndDate:2;const e=new Date;e.setDate(e.getDate()+this.dateDaysFromToday);const n=e.getFullYear();const o=(e.getMonth()+1).toString().padStart(2,"0");const s=e.getDate().toString().padStart(2,"0");const i=n+t;this.firstValidDateString=`${n.toString()}-${o}-${s}`;this.lastValidDateString=`${i.toString()}-${o}-${s}`}addEventHandlers(){const t=i(this.emitRowValues.bind(this),500);this.pnInputField.addEventListener("keyup",this.handleInput.bind(this));this.pnInputField.addEventListener("change",this.handleInput.bind(this));this.pnInputField.addEventListener("input",this.handleInput.bind(this));this.pnInputField.addEventListener("keyup",t);this.pnInputField.addEventListener("change",t);this.pnInputField.addEventListener("input",t);if(this.allowMultipleDates){this.pnShowDateRangeFiledButton.addEventListener("click",this.showDateRangeRow.bind(this));this.pnGenerateDatesButton.addEventListener("click",this.generateDates.bind(this));this.pnSaveGeneratedDatesButton.addEventListener("click",this.saveGeneratedDates.bind(this));this.pnSaveGeneratedDatesButton.addEventListener("click",t)}else{this.pnSingleDatePicker.addEventListener("dateselection",this.setSingleDateValue.bind(this));this.pnSingleDatePicker.addEventListener("dateselection",t)}if(this.index>0){this.pnDeleteRowButton.addEventListener("click",this.deleteRow.bind(this))}}generateUniqueId(){return l()}updateSelectItemArr(t,e){t.forEach((t=>{if(t.value===e){t.selected=!t.selected}else{t.selected=false}}));return t}handleOptionButtonClick(t){t.preventDefault();const e=t.target.innerHTML;this.buttonsArray=[...this.updateSelectItemArr(this.buttonsArray,e)];this.selectedButtonValue=this.buttonsArray.filter((t=>t.selected===true)).length>0?e:"";if(this.selectedButtonValue?.length){this.firstDropdownArr=[];const t=this._dropdownData.find((t=>t.label===e));t.values.forEach((t=>{this.firstDropdownArr.push({selected:false,value:t.label,label:t.label})}));this.firstDropdownArr=[...this.firstDropdownArr];this.firstDropdownPlaceholder=this.dropdownPlaceholder;const n=this.pnFirstDropdown.querySelector(".pn-select-content span");n.innerHTML=this.dropdownPlaceholder;this.secondDropdownArr=[];this.secondDropdownPlaceholder="-";const o=this.pnSecondDropdown.querySelector(".pn-select-content span");o.innerHTML=this.secondDropdownPlaceholder}else{this.firstDropdownArr=[];this.firstDropdownPlaceholder="-";const t=this.pnFirstDropdown.querySelector(".pn-select-content span");t.innerHTML=this.firstDropdownPlaceholder;this.secondDropdownArr=[];this.secondDropdownPlaceholder="-";const e=this.pnSecondDropdown.querySelector(".pn-select-content span");e.innerHTML=this.secondDropdownPlaceholder}this.emitRowValues()}handleFirstDropdownChange(){const t=this.pnFirstDropdown.querySelector("[aria-selected=true]");const e=t?.textContent;this.firstDropdownArr=[...this.updateSelectItemArr(this.firstDropdownArr,e)];const n=this.pnFirstDropdown.querySelector(".pn-select-content span");n.innerHTML=e;this.secondDropdownArr=[];const o=this.buttonsArray.findIndex((t=>t.selected===true));const s=this._dropdownData.find((t=>t.label===this.buttonsArray[o].value));const i=s.values.find((t=>t.label===e));i.values.forEach((t=>{this.secondDropdownArr.push({selected:false,value:t.label,label:t.label})}));this.secondDropdownPlaceholder=this.dropdownPlaceholder;const d=this.pnSecondDropdown.querySelector(".pn-select-content span");d.innerHTML=this.secondDropdownPlaceholder;this.emitRowValues()}handleSecondDropdownChange(){const t=this.pnSecondDropdown.querySelector("[aria-selected=true]");const e=t?.textContent;this.secondDropdownArr=[...this.updateSelectItemArr(this.secondDropdownArr,e)];const n=this.pnSecondDropdown.querySelector(".pn-select-content span");n.innerHTML=e;this.emitRowValues()}handleInput(t){const e=t.target.value;const n=t.target.closest(".input-amount");if(!n){return}if(Number(e)===0){n.setAttribute("error",this.errorMessageEmpty||"Cannot be empty");n.removeAttribute("helpertext");this.inputFieldValue="";return}n.removeAttribute("error");n.removeAttribute("helpertext");if(Number(e)<this.minAmount){n.setAttribute("error",this.errorMessageMinAmount||"Amount too low");this.inputFieldValue="";return}if(Number(e)<this.minWarningAmount){n.setAttribute("helpertext",this.warningMessageMinAmount||"Amount too low")}this.inputFieldValue=e}showDateRangeRow(){if(this.pnDateRangeContainer.style.display==="none"){this.pnDateRangeContainer.style.display=""}else{this.pnDateRangeContainer.style.display="none"}}HandleRangeDatePickers(t){const e=t.target;if(e===this.pnStartDate){this.startDateValue=t.detail}if(e===this.pnEndDate){this.endDateValue=t.detail}}generateDates(t){t.preventDefault();const e=this.pnDaysRow.querySelectorAll("pn-filter-checkbox");const n=[];this.generatedDatesArr=[];e.forEach((t=>{const e=t.querySelector("input");if(e.value){n.push(e.value)}}));this.startDateValue=this.pnStartDate.querySelector(".pn-date-input-container input").value;this.endDateValue=this.pnEndDate.querySelector(".pn-date-input-container input").value;if(n.length&&this.startDateValue&&this.endDateValue){this.daysArr.forEach((t=>{t.selected=n.includes(t.value)}));const t=new Date(this.startDateValue);const e=new Date(this.endDateValue);const o=new Set(this.disabledDates.split(","));for(let s=new Date(t);s<=e;s.setDate(s.getDate()+1)){const t=s.getFullYear();const e=(s.getMonth()+1).toString().padStart(2,"0");const i=s.getDate().toString().padStart(2,"0");const d=`${t}-${e}-${i}`;if(o.has(d)){continue}const l=s.getDay()===0?"7":s.getDay().toString();if(n.includes(l)){this.generatedDatesArr.push(d)}}}}deleteGeneratedDateRow(t){this.generatedDatesArr.splice(t,1);this.generatedDatesArr=[...this.generatedDatesArr]}saveGeneratedDates(){if(this.generatedDatesArr?.length){this.dateValue=this.generatedDatesArr.join(",");const t=this.generatedDatesArr.length;const e=this.pnShowDateRangeFiledButton.querySelector(".pn-button-content");e.innerHTML=t>0?`${this.dateButtonText} (${t})`:this.dateButtonText;this.showDateRangeRow()}}setSingleDateValue(t){const e=t.target;if(e===this.pnSingleDatePicker){this.dateValue=t.detail.start}}emitRowValues(){this.rowValueChange.emit({id:this._predefinedValue.id,buttons:this.buttonsArray,firstDropdown:this.firstDropdownArr,secondDropdown:this.secondDropdownArr,input:this.inputFieldValue,dates:this.dateValue,dateRange:{days:this.daysArr,startDate:this.startDateValue,endDate:this.endDateValue}})}deleteRow(){this.deleteRowEvent.emit(this._predefinedValue.id)}setActive(t){return t?"connected-dropdown__button active":"connected-dropdown__button"}render(){return o(s,{key:"35b486ed0f97430716ffc8614400ef2784396d8d"},o("div",{key:"b35394961a1a51d432ee7622f03af1e10d016388",ref:t=>this.pnConnectedDropdownSlotElement=t,class:"connected-dropdown-slot-element"},o("div",{key:"e26929840f40451f5ff9ad23126524ad4925b5ba",class:"connected-dropdown-parent-element connected-dropdown"},o("div",{key:"1793abb24dc56239aea9b07a8098b07856a9a814",class:"connected-dropdown__row__no-margin"},o("label",{key:"9d5ee09efa53a5efc749acd6a4e855624faeaad0"},this.label)),o("div",{key:"e3c561e971fc04bd63b64fa631d39cf2ba00bfd4",class:"connected-dropdown__row button-row"},o("div",{key:"02c843135ca6c3e22068343447b6204bc33779a0",class:"connected-dropdown__button-container option-buttons"},this.buttonsArray?.map((t=>o("button",{class:`${this.setActive(t.selected)}`,id:this.generateUniqueId(),onClick:this.handleOptionButtonClick.bind(this)},t.value)))),o("div",{key:"256608e95218af95933f19a804b1a2fb6fe03fa3",class:"connected-dropdown__button-container delete-button"},this.index>0?o("pn-button",{ref:t=>this.pnDeleteRowButton=t,small:"true",icon:d,appearance:"warning",index:this.index},"Delete"):null)),o("div",{key:"3ad64da3c97ff384771a20fcc71b14c8259df101",class:"connected-dropdown__row input-row"},o("pn-select",{key:"c8c9d036aa77339f0a5cc5182e47e9219e20d9dc",ref:t=>this.pnFirstDropdown=t,class:"pn-row-select-dropdown dropDown1-dropdown",placeholder:this.firstDropdownPlaceholder,label:this.firstDropdownLabel,"empty-option":"true",language:this.languageCode},this.firstDropdownArr?.map(((t,e)=>o("pn-option",{index:e,label:t.label,value:t.value,selected:t.selected,onClick:i(this.handleFirstDropdownChange.bind(this),500)})))),o("pn-select",{key:"688b314311b83a47a0a464d147e6d32544d5cc3d",ref:t=>this.pnSecondDropdown=t,class:"pn-row-select-dropdown dropDown2-dropdown",placeholder:this.secondDropdownPlaceholder,label:this.secondDropdownLabel,"empty-option":"true",language:this.languageCode},this.secondDropdownArr?.map(((t,e)=>o("pn-option",{index:e,label:t.label,value:t.value,selected:t.selected,onClick:i(this.handleSecondDropdownChange.bind(this),500)})))),o("pn-input",{key:"664454a5a0a0db6617dc2e2c111961f9957b1bd2",ref:t=>this.pnInputField=t,class:"input-amount",type:"number",placeholder:"0",label:this.inputFildLabel,value:this.inputFieldValue,min:this.minAmount}),this.allowMultipleDates?o("pn-button",{ref:t=>this.pnShowDateRangeFiledButton=t,class:"connected-dropdown__toggle-date-button",small:"true",appearance:"light"},this.dateButtonText):o("div",{class:"connected-dropdown__date-container"},o("div",{class:"connected-dropdown__label-container"},o("label",null,this.dateButtonText)),o("pn-date-picker",{ref:t=>this.pnSingleDatePicker=t,range:"false","disable-weekends":true,"disabled-dates":this.disabledDates,"min-date":this.firstValidDateString,language:this.languageCode,placeholder:this.datePlaceholder,class:"connected-dropdown__date-picker",start:this.dateValue?.length?this.dateValue:null}))),this.allowMultipleDates?o("div",{ref:t=>this.pnDateRangeContainer=t,class:"connected-dropdown__date-container",style:{display:"none"}},this.multiDateHelperText?o("div",{class:"connected-dropdown__row"},o("p",null,this.multiDateHelperText)):null,o("div",{class:"connected-dropdown__multi-date-row"},o("div",{class:"connected-dropdown__date-container"},o("div",{class:"connected-dropdown__label-container"},o("label",null,this.startDateLabel)),o("pn-date-picker",{ref:t=>this.pnStartDate=t,range:"false","disable-weekends":true,"disabled-dates":this.disabledDates,class:"connected-dropdown__date-picker","min-date":this.firstValidDateString,"max-date":this.lastValidDateString,language:this.languageCode,placeholder:this.datePlaceholder})),o("div",{class:"connected-dropdown__date-container"},o("div",{class:"connected-dropdown__label-container"},o("label",null,this.endDateLabel)),o("pn-date-picker",{ref:t=>this.pnEndDate=t,range:"false","disable-weekends":true,"disabled-dates":this.disabledDates,class:"connected-dropdown__date-picker","min-date":this.firstValidDateString,"max-date":this.lastValidDateString,language:this.languageCode,placeholder:this.datePlaceholder}))),o("div",{ref:t=>this.pnDaysRow=t,class:"connected-dropdown__multi-date-row"},this.daysArr?.map((t=>o("div",{class:"connected-dropdown__checkbox"},o("pn-filter-checkbox",{checkboxid:"day-"+t.value,name:"__"+t.label,value:t.value,checked:t.selected}),o("label",{htmlFor:"day-"+t.value},t.label))))),o("div",{class:"connected-dropdown__row"},o("pn-button",{ref:t=>this.pnGenerateDatesButton=t,small:"true"},this.generateDatesButtonText)),o("div",{ref:t=>this.pnGeneratedDatesSlot=t,class:"connected-dropdown__date-slot"},this.generatedDatesArr?.map(((t,e)=>o("div",{class:"connected-dropdown__row generated-date-row"},o("p",null,t),o("pn-button",{index:e,small:"true",icon:d,appearance:"warning",id:"delete-date-"+e,onClick:this.deleteGeneratedDateRow.bind(this,e)},t)))),!this.generatedDatesArr?.length?o("p",null,this.noDatesText):null),o("div",{class:"connected-dropdown__row"},o("pn-button",{ref:t=>this.pnSaveGeneratedDatesButton=t,class:"connected-dropdown__button-right",small:"true"},this.saveDateButtonText))):null)))}static get watchers(){return{predefinedValue:["applyPredefinedValue"]}}};h.style=c;export{h as pn_multi_row_connected_dropdown_row};
2
+ //# sourceMappingURL=p-0bf27e1a.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["pnMultiRowConnectedDropdownRowCss","PnMultiRowConnectedDropdownRowStyle0","PnMultiRowConnectedDropdownRow","_dropdownData","_predefinedValue","pnConnectedDropdown","pnConnectedDropdownSlotElement","pnAddFieldButton","pnFirstDropdown","pnSecondDropdown","pnInputField","pnSingleDatePicker","pnStartDate","pnEndDate","pnShowDateRangeFiledButton","pnDateRangeContainer","pnGenerateDatesButton","pnDaysRow","pnGeneratedDatesSlot","pnSaveGeneratedDatesButton","pnDeleteRowButton","rowValueChange","deleteRowEvent","componentWillLoad","this","getPredefinedValues","setDropDownData","setFirstValidDate","componentDidLoad","setInitialValues","addEventHandlers","emitRowValues","dropdownData","JSON","parse","predefinedValue","applyPredefinedValue","setButtonsValue","setFirstDropdownValues","setSecondDropdownValues","setInputField","setDateValue","setDateRangeDefaults","firstDropdownClass","firstDropdownLabel","replace","secondDropdownClass","secondDropdownLabel","buttonsArray","buttons","length","forEach","item","selected","selectedButtonValue","value","button","label","push","firstDropdownArr","firstDropdown","secondDropdownArr","secondDropdown","inputFieldValue","input","allowMultipleDates","style","display","dates","generatedDatesArr","split","saveGeneratedDates","dateValue","daysArr","dateRange","days","startDateValue","startDate","endDateValue","endDate","yearsToadd","yearsToAddToEndDate","date","Date","setDate","getDate","dateDaysFromToday","year","getFullYear","month","getMonth","toString","padStart","day","endYear","firstValidDateString","lastValidDateString","emitValues","debounce","bind","addEventListener","handleInput","showDateRangeRow","generateDates","setSingleDateValue","index","deleteRow","generateUniqueId","uuidv4","updateSelectItemArr","arr","val","handleOptionButtonClick","e","preventDefault","elmValue","target","innerHTML","filter","selectionChildren","find","values","firstDropdownPlaceholder","dropdownPlaceholder","firstDropdownText","querySelector","secondDropdownPlaceholder","secondDropdownText","handleFirstDropdownChange","selectedValue","textContent","selectedButton","findIndex","firstChildren","secondChildren","handleSecondDropdownChange","currentValue","inputAmount","closest","Number","setAttribute","errorMessageEmpty","removeAttribute","minAmount","errorMessageMinAmount","minWarningAmount","warningMessageMinAmount","HandleRangeDatePickers","elm","detail","allCheckboxes","querySelectorAll","selectedDays","element","includes","disabledDateSet","Set","disabledDates","d","formattedDate","has","dayOfWeek","getDay","deleteGeneratedDateRow","splice","join","dateCount","buttonTextElm","dateButtonText","start","emit","id","setActive","active","render","h","Host","key","ref","el","class","map","onClick","small","icon","minus","appearance","placeholder","language","languageCode","i","type","inputFildLabel","min","range","datePlaceholder","multiDateHelperText","startDateLabel","endDateLabel","checkboxid","name","checked","htmlFor","generateDatesButtonText","noDatesText","saveDateButtonText"],"sources":["src/components/input/pn-multi-row-connected-dropdown/pn-multi-row-connected-dropdown-row.scss?tag=pn-multi-row-connected-dropdown-row","src/components/input/pn-multi-row-connected-dropdown/pn-multi-row-connected-dropdown-row.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-multi-row-connected-dropdown-row {\n gap: 1rem;\n\n .connected-dropdown__row.input-row pn-select,\n .connected-dropdown__row.input-row pn-input {\n width: 25%;\n }\n\n .connected-dropdown-parent-element {\n margin-bottom: 0.5rem;\n }\n\n pn-select {\n width: 35%;\n }\n\n pn-marketweb-input {\n width: 10%;\n\n input {\n height: 4.3rem;\n }\n }\n\n .connected-dropdown {\n padding: 1rem;\n border-left: 0.2rem solid $blue700;\n\n &:hover {\n background-color: $gray25;\n }\n\n &__toggle-date-button {\n width: 20%;\n margin-bottom: 0.5rem;\n }\n\n &__row {\n display: flex;\n align-items: flex-start;\n gap: 1rem;\n margin-bottom: 1rem;\n justify-content: space-between;\n\n &__no-margin {\n margin: 0;\n }\n }\n\n &__multi-date-row {\n display: flex;\n align-items: center;\n gap: 1rem;\n margin-bottom: 1rem;\n }\n\n &__button-container {\n display: flex;\n align-items: flex-end;\n gap: 1rem;\n }\n\n &__button {\n background-color: #ffffff;\n border: solid;\n border-width: 0.1rem;\n border-radius: 0.8rem;\n border-color: $blue700;\n padding: 0.4rem 0.8rem;\n color: $blue700;\n font-size: 1.4rem;\n text-align: center;\n text-decoration: none;\n cursor: pointer;\n\n &:hover,\n &.active {\n background-color: $blue900;\n border-color: $blue900;\n color: #ffffff;\n }\n }\n\n &__buttom-container-right {\n display: flex;\n }\n\n &__button-right {\n margin-left: auto;\n }\n\n &__label-container {\n margin-bottom: 0.4rem;\n color: $gray700;\n font-size: 0.875em;\n justify-content: space-between;\n align-items: flex-end;\n }\n\n &__checkbox {\n display: flex;\n gap: 0.5rem;\n }\n\n &__date-slot {\n border: 0.1rem solid $blue700;\n margin-bottom: 1rem;\n padding: 1rem;\n }\n }\n\n .generated-date-row {\n border-bottom: 0.1rem solid $blue700;\n }\n}\n","import { Component, Prop, h, Element, Host, State, Watch, Event, EventEmitter } from '@stencil/core';\nimport { Root, SelectItem, PredefinedValues } from './types';\nimport debounce from 'debounce';\nimport { v4 as uuidv4 } from 'uuid';\nimport { minus } from 'pn-design-assets/pn-assets/icons.js';\n\n@Component({\n tag: 'pn-multi-row-connected-dropdown-row',\n styleUrl: 'pn-multi-row-connected-dropdown-row.scss',\n})\nexport class PnMultiRowConnectedDropdownRow {\n @Element() hostElement: Element;\n private _dropdownData: Root[];\n private _predefinedValue: PredefinedValues;\n pnConnectedDropdown: HTMLElement = null;\n pnConnectedDropdownSlotElement: HTMLElement = null;\n pnAddFieldButton: HTMLElement = null;\n pnFirstDropdown: HTMLElement = null;\n pnSecondDropdown: HTMLElement = null;\n pnInputField: HTMLElement = null;\n pnSingleDatePicker: HTMLElement = null;\n pnStartDate: HTMLElement = null;\n pnEndDate: HTMLElement = null;\n pnShowDateRangeFiledButton: HTMLElement = null;\n pnDateRangeContainer: HTMLElement = null;\n pnGenerateDatesButton: HTMLElement = null;\n pnDaysRow: HTMLElement = null;\n pnGeneratedDatesSlot: HTMLElement = null;\n pnSaveGeneratedDatesButton: HTMLElement = null;\n pnDeleteRowButton: HTMLElement = null;\n\n @Prop() dropdownData: string | Root[] = null;\n @Prop() languageCode: string = null;\n @Prop() label: string = null;\n @Prop() firstDropdownLabel: string = null;\n @Prop() secondDropdownLabel: string = null;\n @Prop() dropdownPlaceholder: string = null;\n @Prop() addRowText: string = null;\n @Prop() inputFildLabel: string = null;\n @Prop() inputFildPlaceholder: string = null;\n @Prop() disabledDates: string = null;\n @Prop() dateButtonText: string = null;\n @Prop() datePlaceholder: string = null;\n @Prop() dateDaysFromToday: number = 1;\n @Prop() allowMultipleDates: boolean = null;\n @Prop() startDateLabel: string = null;\n @Prop() endDateLabel: string = null;\n @Prop() multiDateHelperText: string = null;\n @Prop() generateDatesButtonText: string = null;\n @Prop() saveDateButtonText: string = null;\n @Prop() noDatesText: string = null;\n @Prop() index: number = null;\n @Prop() predefinedValue: string = null;\n @Prop() yearsToAddToEndDate: number = null;\n @Prop() minAmount: number = null;\n @Prop() errorMessageEmpty: string;\n @Prop() errorMessageMinAmount: string;\n @Prop() minWarningAmount: number = null;\n @Prop() warningMessageMinAmount: string;\n\n @State() buttonsArray: SelectItem[] = null;\n @State() firstDropdownArr: SelectItem[] = null;\n @State() secondDropdownArr: SelectItem[] = [];\n @State() firstDropdownClass: string = null;\n @State() secondDropdownClass: string = null;\n @State() firstValidDateString: string = '';\n @State() lastValidDateString: string = '';\n @State() firstDropdownPlaceholder: string = '-';\n @State() secondDropdownPlaceholder: string = '-';\n @State() startDateValue: string = '';\n @State() endDateValue: string = '';\n @State() generatedDatesArr: string[] = [];\n @State() selectedButtonValue: string = '';\n @State() inputFieldValue: string = '';\n @State() dateValue: string = '';\n @State() daysArr: SelectItem[] = null;\n\n @Event() rowValueChange: EventEmitter<PredefinedValues>;\n @Event() deleteRowEvent: EventEmitter<string>;\n\n componentWillLoad() {\n this.getPredefinedValues();\n this.setDropDownData();\n this.setFirstValidDate();\n }\n\n componentDidLoad() {\n this.setInitialValues();\n this.addEventHandlers();\n this.emitRowValues();\n }\n\n setDropDownData() {\n if (typeof this.dropdownData === 'string') {\n this._dropdownData = JSON.parse(this.dropdownData);\n } else {\n this._dropdownData = this.dropdownData;\n }\n }\n\n getPredefinedValues() {\n this._predefinedValue = JSON.parse(this.predefinedValue);\n }\n\n @Watch('predefinedValue')\n applyPredefinedValue() {\n this.getPredefinedValues();\n this.setInitialValues();\n }\n\n setInitialValues() {\n this.setButtonsValue();\n this.setFirstDropdownValues();\n this.setSecondDropdownValues();\n this.setInputField();\n this.setDateValue();\n this.setDateRangeDefaults();\n\n this.firstDropdownClass = this.firstDropdownLabel.replace(' ', '_') + '-dropdown';\n this.secondDropdownClass = this.secondDropdownLabel.replace(' ', '_') + '-dropdown';\n }\n\n setButtonsValue() {\n this.buttonsArray = [];\n\n if (this._predefinedValue.buttons?.length) {\n this.buttonsArray = this._predefinedValue.buttons;\n\n this.buttonsArray.forEach(item => {\n if (item.selected) {\n this.selectedButtonValue = item.value;\n }\n });\n } else {\n this._dropdownData.forEach(item => {\n const button: SelectItem = { selected: false, value: item.label, label: item.label };\n this.buttonsArray.push(button);\n });\n }\n }\n\n setFirstDropdownValues() {\n this.firstDropdownArr = [];\n\n if (this._predefinedValue.firstDropdown?.length) {\n this.firstDropdownArr = [...this._predefinedValue.firstDropdown];\n }\n }\n\n setSecondDropdownValues() {\n this.secondDropdownArr = [];\n\n if (this._predefinedValue.secondDropdown?.length) {\n this.secondDropdownArr = [...this._predefinedValue.secondDropdown];\n }\n }\n\n setInputField() {\n this.inputFieldValue = this._predefinedValue.input?.length ? this._predefinedValue.input : '';\n }\n\n setDateValue() {\n if (this.allowMultipleDates) {\n this.pnDateRangeContainer.style.display = this._predefinedValue.dates[\"start\"]?.length ? '' : 'none';\n this.generatedDatesArr = this._predefinedValue.dates[\"start\"]?.length ? this._predefinedValue.dates[\"start\"].split(',') : [];\n this.saveGeneratedDates();\n } else {\n this.dateValue = this._predefinedValue.dates[\"start\"]?.length ? this._predefinedValue.dates[\"start\"] : '';\n }\n }\n\n setDateRangeDefaults() {\n this.daysArr = this._predefinedValue.dateRange.days;\n this.startDateValue = this._predefinedValue.dateRange.startDate?.length ? this._predefinedValue.dateRange.startDate : '';\n this.endDateValue = this._predefinedValue.dateRange.endDate?.length ? this._predefinedValue.dateRange.endDate : '';\n }\n\n setFirstValidDate() {\n const yearsToadd = this.yearsToAddToEndDate ? this.yearsToAddToEndDate : 2;\n const date = new Date();\n date.setDate(date.getDate() + this.dateDaysFromToday);\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 addEventHandlers() {\n const emitValues = debounce(this.emitRowValues.bind(this), 500);\n\n this.pnInputField.addEventListener('keyup', this.handleInput.bind(this));\n this.pnInputField.addEventListener('change', this.handleInput.bind(this));\n this.pnInputField.addEventListener('input', this.handleInput.bind(this));\n this.pnInputField.addEventListener('keyup', emitValues);\n this.pnInputField.addEventListener('change', emitValues);\n this.pnInputField.addEventListener('input', emitValues);\n\n if (this.allowMultipleDates) {\n this.pnShowDateRangeFiledButton.addEventListener('click', this.showDateRangeRow.bind(this));\n this.pnGenerateDatesButton.addEventListener('click', this.generateDates.bind(this));\n this.pnSaveGeneratedDatesButton.addEventListener('click', this.saveGeneratedDates.bind(this));\n this.pnSaveGeneratedDatesButton.addEventListener('click', emitValues);\n } else {\n this.pnSingleDatePicker.addEventListener('dateselection', this.setSingleDateValue.bind(this));\n this.pnSingleDatePicker.addEventListener('dateselection', emitValues);\n }\n\n if (this.index > 0) {\n this.pnDeleteRowButton.addEventListener('click', this.deleteRow.bind(this));\n }\n }\n\n generateUniqueId() {\n return uuidv4();\n }\n\n updateSelectItemArr(arr: SelectItem[], val: string) {\n arr.forEach(item => {\n if (item.value === val) {\n item.selected = !item.selected;\n } else {\n item.selected = false;\n }\n });\n return arr;\n }\n\n handleOptionButtonClick(e) {\n e.preventDefault();\n const elmValue = e.target.innerHTML;\n\n this.buttonsArray = [...this.updateSelectItemArr(this.buttonsArray, elmValue)];\n this.selectedButtonValue = this.buttonsArray.filter(e => e.selected === true).length > 0 ? elmValue : '';\n\n if (this.selectedButtonValue?.length) {\n this.firstDropdownArr = [];\n const selectionChildren = this._dropdownData.find(arr => arr.label === elmValue);\n selectionChildren.values.forEach(item => {\n this.firstDropdownArr.push({ selected: false, value: item.label, label: item.label });\n });\n\n this.firstDropdownArr = [...this.firstDropdownArr];\n this.firstDropdownPlaceholder = this.dropdownPlaceholder;\n const firstDropdownText = this.pnFirstDropdown.querySelector('.pn-select-content span');\n firstDropdownText.innerHTML = this.dropdownPlaceholder;\n\n this.secondDropdownArr = [];\n this.secondDropdownPlaceholder = '-';\n const secondDropdownText = this.pnSecondDropdown.querySelector('.pn-select-content span');\n secondDropdownText.innerHTML = this.secondDropdownPlaceholder;\n } else {\n this.firstDropdownArr = [];\n this.firstDropdownPlaceholder = '-';\n const firstDropdownText = this.pnFirstDropdown.querySelector('.pn-select-content span');\n firstDropdownText.innerHTML = this.firstDropdownPlaceholder;\n\n this.secondDropdownArr = [];\n this.secondDropdownPlaceholder = '-';\n const secondDropdownText = this.pnSecondDropdown.querySelector('.pn-select-content span');\n secondDropdownText.innerHTML = this.secondDropdownPlaceholder;\n }\n\n this.emitRowValues();\n }\n\n handleFirstDropdownChange() {\n const selected = this.pnFirstDropdown.querySelector(\"[aria-selected=true]\");\n const selectedValue = selected?.textContent;\n this.firstDropdownArr = [...this.updateSelectItemArr(this.firstDropdownArr, selectedValue)];\n const firstDropdownText = this.pnFirstDropdown.querySelector('.pn-select-content span');\n firstDropdownText.innerHTML = selectedValue;\n\n this.secondDropdownArr = [];\n const selectedButton = this.buttonsArray.findIndex(item => item.selected === true);\n const firstChildren = this._dropdownData.find(arr => arr.label === this.buttonsArray[selectedButton].value);\n const secondChildren = firstChildren.values.find(arr => arr.label === selectedValue);\n secondChildren.values.forEach(item => {\n this.secondDropdownArr.push({ selected: false, value: item.label, label: item.label });\n });\n\n this.secondDropdownPlaceholder = this.dropdownPlaceholder;\n const secondDropdownText = this.pnSecondDropdown.querySelector('.pn-select-content span');\n secondDropdownText.innerHTML = this.secondDropdownPlaceholder;\n this.emitRowValues();\n }\n\n handleSecondDropdownChange() {\n const selected = this.pnSecondDropdown.querySelector(\"[aria-selected=true]\");\n const selectedValue = selected?.textContent;\n this.secondDropdownArr = [...this.updateSelectItemArr(this.secondDropdownArr, selectedValue)];\n const secondDropdownText = this.pnSecondDropdown.querySelector('.pn-select-content span');\n secondDropdownText.innerHTML = selectedValue;\n this.emitRowValues();\n }\n\n handleInput(e) {\n const currentValue = e.target.value;\n const inputAmount = e.target.closest(\".input-amount\");\n\n if (!inputAmount) {\n return;\n }\n\n if (Number(currentValue) === 0) {\n inputAmount.setAttribute(\"error\", this.errorMessageEmpty || \"Cannot be empty\");\n inputAmount.removeAttribute(\"helpertext\");\n this.inputFieldValue = '';\n return;\n }\n\n inputAmount.removeAttribute(\"error\");\n inputAmount.removeAttribute(\"helpertext\");\n\n if (Number(currentValue) < this.minAmount) {\n inputAmount.setAttribute(\"error\", this.errorMessageMinAmount || \"Amount too low\");\n this.inputFieldValue = '';\n return;\n }\n\n if (Number(currentValue) < this.minWarningAmount) {\n inputAmount.setAttribute(\"helpertext\", this.warningMessageMinAmount || \"Amount too low\");\n }\n\n this.inputFieldValue = currentValue;\n}\n\n showDateRangeRow() {\n if (this.pnDateRangeContainer.style.display === 'none') {\n this.pnDateRangeContainer.style.display = '';\n } else {\n this.pnDateRangeContainer.style.display = 'none';\n }\n }\n\n HandleRangeDatePickers(e) {\n const elm = e.target;\n\n if (elm === this.pnStartDate) {\n this.startDateValue = e.detail;\n }\n\n if (elm === this.pnEndDate) {\n this.endDateValue = e.detail;\n }\n }\n\n generateDates(e) {\n e.preventDefault();\n const allCheckboxes = this.pnDaysRow.querySelectorAll('pn-filter-checkbox');\n const selectedDays = [];\n this.generatedDatesArr = [];\n \n allCheckboxes.forEach(element => {\n const input = element.querySelector('input');\n if (input.value) {\n selectedDays.push(input.value);\n }\n });\n \n this.startDateValue = (this.pnStartDate.querySelector(\".pn-date-input-container input\") as HTMLInputElement).value;\n this.endDateValue = (this.pnEndDate.querySelector(\".pn-date-input-container input\") as HTMLInputElement).value;\n \n if (selectedDays.length && this.startDateValue && this.endDateValue) {\n this.daysArr.forEach(item => {\n item.selected = selectedDays.includes(item.value);\n });\n \n const startDate = new Date(this.startDateValue);\n const endDate = new Date(this.endDateValue);\n const disabledDateSet = new Set(this.disabledDates.split(','));\n \n for (let d = new Date(startDate); d <= endDate; d.setDate(d.getDate() + 1)) {\n const year = d.getFullYear();\n const month = (d.getMonth() + 1).toString().padStart(2, '0');\n const day = d.getDate().toString().padStart(2, '0');\n const formattedDate = `${year}-${month}-${day}`;\n \n if (disabledDateSet.has(formattedDate)) {\n continue;\n }\n \n const dayOfWeek = (d.getDay() === 0) ? '7' : d.getDay().toString();\n if (selectedDays.includes(dayOfWeek)) {\n this.generatedDatesArr.push(formattedDate);\n }\n }\n }\n }\n \n\n deleteGeneratedDateRow(index) {\n this.generatedDatesArr.splice(index, 1);\n this.generatedDatesArr = [...this.generatedDatesArr];\n }\n\n saveGeneratedDates() {\n if (this.generatedDatesArr?.length) {\n this.dateValue = this.generatedDatesArr.join(\",\");\n const dateCount = this.generatedDatesArr.length;\n const buttonTextElm = this.pnShowDateRangeFiledButton.querySelector('.pn-button-content');\n buttonTextElm.innerHTML = dateCount > 0 ? `${this.dateButtonText} (${dateCount})` : this.dateButtonText;\n this.showDateRangeRow();\n }\n }\n\n setSingleDateValue(e) {\n const elm = e.target;\n if (elm === this.pnSingleDatePicker) {\n this.dateValue = e.detail.start;\n }\n }\n\n emitRowValues() {\n this.rowValueChange.emit({\n id: this._predefinedValue.id,\n buttons: this.buttonsArray,\n firstDropdown: this.firstDropdownArr,\n secondDropdown: this.secondDropdownArr,\n input: this.inputFieldValue,\n dates: this.dateValue,\n dateRange: {\n days: this.daysArr,\n startDate: this.startDateValue,\n endDate: this.endDateValue,\n },\n });\n }\n\n deleteRow() {\n this.deleteRowEvent.emit(this._predefinedValue.id);\n }\n\n setActive(active: boolean) {\n return active ? 'connected-dropdown__button active' : 'connected-dropdown__button';\n }\n\n render() {\n return (\n <Host>\n <div ref={el => (this.pnConnectedDropdownSlotElement = el as HTMLElement)} class=\"connected-dropdown-slot-element\">\n <div class=\"connected-dropdown-parent-element connected-dropdown\">\n <div class=\"connected-dropdown__row__no-margin\">\n <label>{this.label}</label>\n </div>\n\n <div class=\"connected-dropdown__row button-row\">\n <div class=\"connected-dropdown__button-container option-buttons\">\n {this.buttonsArray?.map(item => (\n <button class={`${this.setActive(item.selected)}`} id={this.generateUniqueId()} onClick={this.handleOptionButtonClick.bind(this)}>\n {item.value}\n </button>\n ))}\n </div>\n\n <div class=\"connected-dropdown__button-container delete-button\">\n {this.index > 0 ? (\n <pn-button ref={el => (this.pnDeleteRowButton = el as HTMLElement)} small=\"true\" icon={minus} appearance=\"warning\" index={this.index}>\n Delete\n </pn-button>\n ) : null}\n </div>\n </div>\n\n <div class=\"connected-dropdown__row input-row\">\n <pn-select\n ref={el => (this.pnFirstDropdown = el as HTMLElement)}\n class=\"pn-row-select-dropdown dropDown1-dropdown\"\n placeholder={this.firstDropdownPlaceholder}\n label={this.firstDropdownLabel}\n empty-option=\"true\"\n language={this.languageCode}\n >\n {this.firstDropdownArr?.map((item, i) => (\n <pn-option index={i} label={item.label} value={item.value} selected={item.selected} onClick={debounce(this.handleFirstDropdownChange.bind(this), 500)}></pn-option>\n ))}\n </pn-select>\n\n <pn-select\n ref={el => (this.pnSecondDropdown = el as HTMLElement)}\n class=\"pn-row-select-dropdown dropDown2-dropdown\"\n placeholder={this.secondDropdownPlaceholder}\n label={this.secondDropdownLabel}\n empty-option=\"true\"\n language={this.languageCode}\n >\n {this.secondDropdownArr?.map((item, i) => (\n <pn-option index={i} label={item.label} value={item.value} selected={item.selected} onClick={debounce(this.handleSecondDropdownChange.bind(this), 500)}></pn-option>\n ))}\n </pn-select>\n\n <pn-input\n ref={el => (this.pnInputField = el as HTMLElement)}\n class=\"input-amount\"\n type=\"number\"\n placeholder=\"0\"\n label={this.inputFildLabel}\n value={this.inputFieldValue}\n min={this.minAmount}\n ></pn-input>\n\n {this.allowMultipleDates ? (\n <pn-button ref={el => (this.pnShowDateRangeFiledButton = el as HTMLElement)} class=\"connected-dropdown__toggle-date-button\" small=\"true\" appearance=\"light\">\n {this.dateButtonText}\n </pn-button>\n ) : (\n <div class=\"connected-dropdown__date-container\">\n <div class=\"connected-dropdown__label-container\">\n <label>{this.dateButtonText}</label>\n </div>\n <pn-date-picker\n ref={el => (this.pnSingleDatePicker = el as HTMLElement)}\n range=\"false\"\n disable-weekends={true}\n disabled-dates={this.disabledDates}\n min-date={this.firstValidDateString}\n language={this.languageCode}\n placeholder={this.datePlaceholder}\n class=\"connected-dropdown__date-picker\"\n start={this.dateValue?.length ? this.dateValue : null}\n ></pn-date-picker>\n </div>\n )}\n </div>\n\n {this.allowMultipleDates ? (\n <div ref={el => (this.pnDateRangeContainer = el as HTMLElement)} class=\"connected-dropdown__date-container\" style={{ display: 'none' }}>\n {this.multiDateHelperText ? (\n <div class=\"connected-dropdown__row\">\n <p>{this.multiDateHelperText}</p>\n </div>\n ) : null}\n\n <div class=\"connected-dropdown__multi-date-row\">\n <div class=\"connected-dropdown__date-container\">\n <div class=\"connected-dropdown__label-container\">\n <label>{this.startDateLabel}</label>\n </div>\n\n <pn-date-picker\n ref={el => (this.pnStartDate = el as HTMLElement)}\n range=\"false\"\n disable-weekends={true}\n disabled-dates={this.disabledDates}\n class=\"connected-dropdown__date-picker\"\n min-date={this.firstValidDateString}\n max-date={this.lastValidDateString}\n language={this.languageCode}\n placeholder={this.datePlaceholder}\n ></pn-date-picker>\n </div>\n\n <div class=\"connected-dropdown__date-container\">\n <div class=\"connected-dropdown__label-container\">\n <label>{this.endDateLabel}</label>\n </div>\n <pn-date-picker\n ref={el => (this.pnEndDate = el as HTMLElement)}\n range=\"false\"\n disable-weekends={true}\n disabled-dates={this.disabledDates}\n class=\"connected-dropdown__date-picker\"\n min-date={this.firstValidDateString}\n max-date={this.lastValidDateString}\n language={this.languageCode}\n placeholder={this.datePlaceholder}\n ></pn-date-picker>\n </div>\n </div>\n <div ref={el => (this.pnDaysRow = el as HTMLElement)} class=\"connected-dropdown__multi-date-row\">\n {this.daysArr?.map((day: SelectItem) => (\n <div class=\"connected-dropdown__checkbox\">\n <pn-filter-checkbox checkboxid={'day-' + day.value} name={'__' + day.label} value={day.value} checked={day.selected}></pn-filter-checkbox>\n <label htmlFor={'day-' + day.value}>{day.label}</label>\n </div>\n ))}\n </div>\n\n <div class=\"connected-dropdown__row\">\n <pn-button ref={el => (this.pnGenerateDatesButton = el as HTMLElement)} small=\"true\">\n {this.generateDatesButtonText}\n </pn-button>\n </div>\n\n <div ref={el => (this.pnGeneratedDatesSlot = el as HTMLElement)} class=\"connected-dropdown__date-slot\">\n {this.generatedDatesArr?.map((date: string, i) => (\n <div class=\"connected-dropdown__row generated-date-row\">\n <p>{date}</p>\n <pn-button index={i} small=\"true\" icon={minus} appearance=\"warning\" id={'delete-date-' + i} onClick={this.deleteGeneratedDateRow.bind(this, i)}>\n {date}\n </pn-button>\n </div>\n ))}\n\n {!this.generatedDatesArr?.length ? <p>{this.noDatesText}</p> : null}\n </div>\n\n <div class=\"connected-dropdown__row\">\n <pn-button ref={el => (this.pnSaveGeneratedDatesButton = el as HTMLElement)} class=\"connected-dropdown__button-right\" small=\"true\">\n {this.saveDateButtonText}\n </pn-button>\n </div>\n </div>\n ) : null}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,2 @@
1
+ import{r as e,c as t,g as n,h as i,d as o}from"./p-bb1c965e.js";import{s as a,o as s}from"./p-e09a907b.js";import{b as r}from"./p-7e3afa8c.js";import{a as l}from"./p-575f557a.js";import{s as h}from"./p-13190b30.js";import{c as d}from"./p-2509d18d.js";import{s as c}from"./p-66d71724.js";import{a as u}from"./p-3fdca5bd.js";const m='<svg class="pn-icon-svg" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path fill="#000" fill-rule="evenodd" d="M16.707 11.293a1 1 0 0 1 0 1.414l-6 6a1 1 0 0 1-1.414-1.414L14.586 12 9.293 6.707a1 1 0 0 1 1.414-1.414z" clip-rule="evenodd"/></svg>';const p=m;const g='<svg class="pn-icon-svg" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path fill="#000" fill-rule="evenodd" d="M4.293 4.293a1 1 0 0 1 1.414 0L12 10.586l6.293-6.293a1 1 0 1 1 1.414 1.414L13.414 12l6.293 6.293a1 1 0 0 1-1.414 1.414L12 13.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L10.586 12 4.293 5.707a1 1 0 0 1 0-1.414" clip-rule="evenodd"/></svg>';const f=g;const b='<svg class="pn-icon-svg" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path fill="#000" fill-rule="evenodd" d="M4.252 10A8 8 0 0 0 4 12c0 .69.088 1.36.252 2h3.166a13.8 13.8 0 0 1 0-4zm.818-2h2.795a13.6 13.6 0 0 1 1.719-3.629A8.02 8.02 0 0 0 5.07 8M12 4.48A11.7 11.7 0 0 0 9.972 8h4.056A11.7 11.7 0 0 0 12 4.48M14.557 10H9.443a11.8 11.8 0 0 0 0 4h5.114a11.8 11.8 0 0 0 0-4m2.025 4a13.8 13.8 0 0 0 0-4h3.166c.165.64.252 1.31.252 2s-.087 1.36-.252 2zm-2.554 2H9.972A11.7 11.7 0 0 0 12 19.52 11.7 11.7 0 0 0 14.028 16m-4.444 3.629A13.6 13.6 0 0 1 7.864 16H5.07a8.02 8.02 0 0 0 4.514 3.629m4.832 0A13.6 13.6 0 0 0 16.136 16h2.794a8.02 8.02 0 0 1-4.514 3.629M18.93 8h-2.795a13.6 13.6 0 0 0-1.719-3.629A8.02 8.02 0 0 1 18.93 8M2 12C2 6.477 6.477 2 12 2s10 4.477 10 10-4.477 10-10 10S2 17.523 2 12" clip-rule="evenodd"/></svg>';const v=b;const w='<svg class="pn-icon-svg" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path fill="#000" fill-rule="evenodd" d="M7.5 7.5a4.5 4.5 0 1 1 9 0 4.5 4.5 0 0 1-9 0M12 5a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5M4.928 20.372a1 1 0 0 1-1.856-.743l.883.353a82 82 0 0 1-.883-.354v-.002l.001-.002.003-.007.008-.018a4 4 0 0 1 .114-.25c.078-.161.193-.383.35-.645.315-.523.8-1.217 1.495-1.911C6.444 15.39 8.688 14 12 14s5.556 1.391 6.957 2.793a10 10 0 0 1 1.494 1.911 8 8 0 0 1 .44.837q.016.036.025.058l.008.018.003.007.001.004-.883.354.883-.353a1 1 0 0 1-1.856.744v.001l.001.001v-.002a2 2 0 0 0-.07-.15 6 6 0 0 0-.267-.49 8 8 0 0 0-1.193-1.526C16.444 17.11 14.688 16 12 16s-4.444 1.109-5.543 2.207a8 8 0 0 0-1.193 1.526 6 6 0 0 0-.336.64m0 0-.001.003zm14.144.001" clip-rule="evenodd"/></svg>';const k=w;const y={sv:{heading:"Språk"},en:{heading:"Language"},da:{heading:"Sprog"},no:{heading:"Språk"},fi:{heading:"Kieli"},de:{heading:"Sprache"},zh:{heading:"语言"},fr:{heading:"Langue"},es:{heading:"Idioma"},nl:{heading:"Spraak"},it:{heading:"Idioma"},tr:{heading:"Dil"},pl:{heading:"Język"},pt:{heading:"Linguagem"},"pt-BR":{heading:"Linguagem"}};const x="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-language-selector{max-height:5.2rem}.languageselector{position:relative}.languageselector-togglebtn{cursor:pointer;border:0;padding:0.64rem 0;background-color:#ffffff;color:#005d92;font-size:1.6rem}.languageselector-togglebtn:hover,.languageselector-togglebtn:focus,.languageselector-togglebtn:active{color:#0d234b;text-decoration:underline}.languageselector-togglebtn svg{width:1.9rem;height:1.9rem}.languageselector-title{padding:0.8rem 1.6rem;display:flex;align-items:center}.languageselector-list{margin:0;padding:0;list-style:none}";const B=x;const L=class{constructor(n){e(this,n);this.setLanguage=t(this,"setLanguage",7);this.value="";this.selectedLanguageName="";this.options=[];this.i18n=undefined}get hostElement(){return n(this)}setLanguage;componentWillLoad(){this.setInitialSelectedLanguageName();this.setTranslations()}componentDidLoad(){this.initialize()}initialize(){this.setSelectedLanguageName();this.addEventBindingsToOptions()}setInitialSelectedLanguageName(){if(!window.Intl||!this.value){return}const e=new Intl.DisplayNames([this.value],{type:"language"});if(!e){return}const t=e.of(this.value);if(!t){return}this.selectedLanguageName=t.charAt(0).toUpperCase()+t.slice(1)}addEventBindingsToOptions(){const e=[].slice.apply(this.hostElement.querySelectorAll("pn-language-selector-option"));e.map((e=>{e.removeEventListener("setCurrentLanguage",(e=>{this.onSetCurrentLanguage(e.detail)}));e.addEventListener("setCurrentLanguage",(e=>{this.onSetCurrentLanguage(e.detail)}))}))}setSelectedLanguageName(){const e=[].slice.apply(this.hostElement.querySelectorAll("pn-language-selector-option"));e.map((e=>{if(e.getAttribute("code")==this.value){this.selectedLanguageName=e.getAttribute("name")}}))}onSetCurrentLanguage(e){this.value=e.code;this.selectedLanguageName=e.name;this.setLanguage.emit(this.value)}setTranslations(){if(y[this.value]){this.i18n=y[this.value]}}onValueChange(){const e=this.hostElement.querySelectorAll("pn-language-selector-option")??[];e.forEach((e=>{const t=(e.getAttribute("code")===this.value)+"";if(e.getAttribute("selected")+""!==t){e.setAttribute("selected",t)}}))}render(){return i(o,{key:"c7cdab6eeccbc93bcc4f0d286bdefa17495b0349",value:this.value},i("pn-button-dropdown",{key:"71e193acb636f6e3bd03101473e59d371064f178",label:this.selectedLanguageName,icon:v,appearance:"light",variant:"borderless"},i("nav",{key:"67a65ae2feec9cc7448099bd2a6b70e15886d0b5",class:"languageselector-nav","aria-label":this.i18n.heading},i("strong",{key:"2befcaf1993606e5ae2cbff52338a4568b1098ca",class:"languageselector-title"},this.i18n.heading),i("div",{key:"afc6903faca9f225355def10f9e41521d7570987",class:"languageselector-list",role:"list"},i("slot",{key:"904a906437fe780ac728d23fb031dd0ff265221f"})))))}static get watchers(){return{value:["setSelectedLanguageName","setTranslations","onValueChange"]}}};L.style=B;const S="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-language-selector-option{margin:0;padding:0;list-style:none}.languageselector-button,.languageselector-link{width:100%;padding:1.1rem 1.6rem 1.1rem 1.4rem;display:flex;align-items:center;position:relative;text-decoration:none;border:0;cursor:pointer;background-color:#ffffff;color:#005d92;font-size:1.6rem;font-weight:bold;border-radius:0}.languageselector-button:hover,.languageselector-button:focus,.languageselector-button:active,.languageselector-link:hover,.languageselector-link:focus,.languageselector-link:active{color:#0d234b;text-decoration:underline;box-shadow:none;background-color:#f3f2f2;color:#005d92;outline:none}.languageselector-itemtext{display:inline-block;margin-left:1rem}.languageselector-radio-outer{background:#fff;border:0.1em solid #d3cecb;border-radius:50%;height:1.5em;width:1.5em;display:flex;justify-content:center;align-items:center;transition:border 0.2s ease-in-out, background-color 0.2s ease-in-out, box-shadow 0.1s;cursor:pointer}.languageselector-radio-outer:focus>.languageselector-radio-outer,.languageselector-radio-outer:active>.languageselector-radio-outer{box-shadow:0 0 0 0.1rem white, 0 0 0 0.3rem #005d92}.languageselector-radio-outer:hover>.languageselector-radio-outer{border:0.1rem solid #005d92;background:#e0f8ff}[selected=true] .languageselector-radio-outer{border:0.1rem solid #005d92}.languageselector-radio-inner{transform:scale(0);height:1em;width:1em;background-color:#005d92;border-radius:50%;transform-origin:center center;transition:transform 0.1s cubic-bezier(0.64, 0.01, 0.67, 0.92)}[selected=true] .languageselector-radio-inner{transform:scale(1)}";const C=S;const M=class{constructor(n){e(this,n);this.setCurrentLanguage=t(this,"setCurrentLanguage",7);this.name="";this.code="";this.url="";this.selected=false;this.currentLanguage=undefined}spanEl;setCurrentLanguage;onOptionClick(){const e={name:this.name,code:this.code,url:this.url,current:true};this.setCurrentLanguage.emit(e)}componentDidLoad(){if(this.spanEl){this.spanEl.setAttribute("xml:lang",this.code)}}render(){return i(o,{key:"ca44e8a1d300207013e35e7b537a6962f8754b20",role:"listitem",selected:this.selected+"",code:this.code,name:this.name},!this.url?i("button",{class:"languageselector-button","data-langcode":this.code,onClick:this.onOptionClick.bind(this)},i("span",{class:"languageselector-radio-outer"},i("span",{class:"languageselector-radio-inner"})),i("span",{ref:e=>this.spanEl=e,lang:this.code,class:"languageselector-itemtext"},this.name," - ",this.code)):i("a",{href:this.url,target:"_self",class:"languageselector-link","data-langcode":this.code},i("span",{class:"languageselector-radio-outer"},i("span",{class:"languageselector-radio-inner"})),i("span",{ref:e=>this.spanEl=e,lang:this.code,class:"languageselector-itemtext"},this.name," - ",this.code)))}};M.style=C;const $={sv:{menuHomeButton:"Hem",menuGoBackButton:"Gå tillbaka",mainMenuButton:"Meny",menuStartButton:"Start",navLabel:"Huvudnavigation"},en:{menuHomeButton:"Home",menuGoBackButton:"Go back",mainMenuButton:"Menu",menuStartButton:"Start",navLabel:"Main navigation"},da:{menuHomeButton:"Hjem",menuGoBackButton:"Gå tilbage",mainMenuButton:"Menu",menuStartButton:"Start",navLabel:"Hovednavigation"},no:{menuHomeButton:"Hjem",menuGoBackButton:"Gå tilbake",mainMenuButton:"Meny",menuStartButton:"Start",navLabel:"Hovednavigasjon"},de:{menuHomeButton:"Home",menuGoBackButton:"Geh zurück",mainMenuButton:"Menü",menuStartButton:"Start",navLabel:"Hauptnavigation"},zh:{menuHomeButton:"Home",menuGoBackButton:"Go back",mainMenuButton:"Menu",menuStartButton:"Start",navLabel:"Main navigation"},it:{menuHomeButton:"Home",menuGoBackButton:"Go back",mainMenuButton:"Menu",menuStartButton:"Start",navLabel:"Main navigation"},nl:{menuHomeButton:"Home",menuGoBackButton:"Go back",mainMenuButton:"Menu",menuStartButton:"Start",navLabel:"Main navigation"},tr:{menuHomeButton:"Anasayfa",menuGoBackButton:"Geri git",mainMenuButton:"Menü",menuStartButton:"Başlat",navLabel:"Ana gezinme"},pt:{menuHomeButton:"Página inicial",menuGoBackButton:"Go back",mainMenuButton:"Menu",menuStartButton:"Start",navLabel:"Main navigation"},pl:{menuHomeButton:"Strona główna",menuGoBackButton:"Powrót",mainMenuButton:"Menu",menuStartButton:"Początek",navLabel:"Menu główne systemu"},"pt-BR":{menuHomeButton:"Página inicial",menuGoBackButton:"Voltar",mainMenuButton:"Menu",menuStartButton:"Iniciar",navLabel:"Navegação principal"}};const T="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-mainnav{display:flex;flex-flow:row-reverse;position:relative;width:100%;min-height:5.1rem}@media screen and (min-width: 48em){pn-mainnav{flex-flow:row}}@media screen and (min-width: 64em){pn-mainnav{flex-flow:column}}@media screen and (min-width: 64em){pn-mainnav [slot=footer]{display:none}}pn-mainnav>nav{height:auto;width:100vw;background-color:#ffffff;z-index:2;transform:translateX(100vw);transition:transform 0.2s 0s;transition-property:transform, visibility;display:flex;flex-flow:column;visibility:hidden;position:fixed;top:3em;bottom:0;left:0}@media screen and (min-width: 48em){pn-mainnav>nav{top:6.5em}}pn-mainnav>nav[data-menu-open=true]{visibility:visible;transform:translateX(0)}@media screen and (min-width: 64em){pn-mainnav>nav{flex-flow:row-reverse;top:0;position:static;height:auto;width:100%;justify-content:space-between;visibility:visible;transform:translateX(0)}}pn-mainnav>nav a{text-decoration:none}pn-mainnav>nav button{cursor:pointer}.mainnav-toggle{display:flex;align-items:center;align-self:center}@media screen and (min-width: 64em){.mainnav-toggle{display:none}}.mainnav-toggle>button{display:flex;align-items:center;background-color:#005d92;color:#ffffff;border-radius:2.4rem;border:none;padding:0.6rem 1.6rem;cursor:pointer;font-size:1.6rem}.mainnav-toggle>button:focus{outline:0}.mainnav-toggle>button pn-icon{margin-left:0.8rem;display:block}.mainnav-toggle>button svg{display:block;margin:-0.2rem -0.5rem -0.2rem 0;height:1.9rem;width:1.9rem}";const H=T;const z=class{constructor(n){e(this,n);this.menuLanguageChange=t(this,"menuLanguageChange",7);this.marketChange=t(this,"marketChange",7);this.menuOpenChange=t(this,"menuOpenChange",7);this.market="se";this.language="sv";this.navigationId="mainnav";this.openMenu=false;this.navLabel=""}get hostElement(){return n(this)}menuLanguageChange;marketChange;menuOpenChange;componentWillLoad(){this.init();document.removeEventListener("mousedown",this._onClickOutside.bind(this));document.addEventListener("mousedown",this._onClickOutside.bind(this))}async init(){this.setLanguage();this.setMarket()}_onClickOutside(e){const t=!this.hostElement.contains(e.target);if(t){a.openLevel=""}}setLanguage(){this.menuLanguageChange.emit(this.language)}setMarket(){this.marketChange.emit(this.market)}onLanguageChange(e){if($[e.detail]){a.i18n=$[e.detail];if(!this.navLabel){this.navLabel=a.i18n.navLabel}}}setMenuOpenState(){a.openMenu=!a.openMenu;this.menuOpenChange.emit(a.openMenu)}onOpenMenuLevelChange(e){a.openLevel=e.detail}render(){return i(o,{key:"910f0a551b6c6b86df0aa04c291c0b8deceac12a"},i("div",{key:"0a764c1d5ab3f09e10960c1648cebbb1f783be4e",class:"mainnav-toggle"},i("button",{key:"3cea0b2660e01d5049b0799339ce0ebd73a1dc8a","aria-controls":this.navigationId,"aria-expanded":a.openMenu+"",onClick:this.setMenuOpenState.bind(this)},a.i18n.mainMenuButton,i("pn-icon",{key:"705297573ebe108584e9edc61cadc71771aa79b4",icon:a.openMenu?f:r,color:"white"}))),i("nav",{key:"3c017fb27d53da0740736bdaeb13dd86d2576c32",class:"mainnav","aria-label":this.navLabel,"data-menu-open":a.openMenu+"","data-menu-currentlevel":a.currentLevel,id:this.navigationId},i("slot",{key:"b94c6dc92bb5c246035412def657829022794a3d"})))}};z.style=H;const U='pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-mainnav-level{display:block}pn-mainnav-level:not(.hydrated){max-height:5.6rem;overflow:hidden}pn-mainnav-level[data-level="1"]{width:100%;right:0;overflow-y:scroll;overflow-x:hidden;flex:1}@media screen and (min-width: 64em){pn-mainnav-level[data-level="1"]{width:auto;overflow:initial}pn-mainnav-level[data-level="1"]::-webkit-scrollbar{display:none}}pn-mainnav-level[data-level="2"]{position:absolute;top:0;bottom:0;left:0;width:100vw;padding:0;background-color:#ffffff;z-index:1;transform:translateX(100vw);transition:transform 0.2s 0s;transition-property:transform, visibility;overflow:scroll;visibility:hidden}@media screen and (min-width: 64em){pn-mainnav-level[data-level="2"]{left:0;top:calc(100% + 1rem);bottom:auto;border-radius:1.6rem;width:auto;padding:1.6rem 1.6rem 0 1.6rem;-webkit-box-shadow:0 0.06rem 0.18rem rgba(0, 0, 0, 0.1), 0 0.32rem 0.72rem rgba(0, 0, 0, 0.13);-moz-box-shadow:0 0.06rem 0.18rem rgba(0, 0, 0, 0.1), 0 0.32rem 0.72rem rgba(0, 0, 0, 0.13);box-shadow:0 0.06rem 0.18rem rgba(0, 0, 0, 0.1), 0 0.32rem 0.72rem rgba(0, 0, 0, 0.13);height:auto;z-index:3;display:none}pn-mainnav-level[data-level="2"][data-menuitem-rightaligned=true]{right:0;left:unset}}@media screen and (max-height: 33.125em){pn-mainnav-level[data-level="2"]{-ms-overflow-style:none;scrollbar-width:none}pn-mainnav-level[data-level="2"]::-webkit-scrollbar{display:none}}pn-mainnav-level[data-level="2"][aria-hidden=false]{transform:translateX(0);visibility:visible}@media screen and (min-width: 64em){pn-mainnav-level[data-level="2"][aria-hidden=false]{display:block;overflow:visible}pn-mainnav-level[data-level="2"][aria-hidden=false]:not([data-level-listcount="1"]){display:grid;grid-template-columns:minmax(12em, 20em) 1fr;grid-template-rows:auto auto;gap:0px 1.6rem;grid-template-areas:"top top" "left right"}}@media screen and (min-width: 64em){pn-mainnav-level[data-level="2"][data-level-alignment=left]{right:0;left:unset}}@media screen and (min-width: 64em){pn-mainnav-level[data-level="2"][data-level-alignment=center]{left:50%;transform:translateX(-50%)}}pn-mainnav-level[data-level="2"] a{color:#005d92;text-decoration:none}pn-mainnav-level [slot=top]{display:flex}@media screen and (min-width: 48em){pn-mainnav-level [slot=top]{display:none}}[data-menu-currentlevel="2"] pn-mainnav-level [slot=footer]{display:none;overscroll-behavior:contain}.mainnav-level-header{grid-area:top}.mainnav-level-header>label{position:absolute;width:0.1rem;height:0.1rem;padding:0;margin:-0.1rem;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;white-space:nowrap}.mainnav-level-header>button{display:block;position:relative;border:none;background-color:transparent;color:#005d92;padding:2.4rem 0 2.4rem 6.2rem;width:100%;text-align:left}@media screen and (min-width: 64em){.mainnav-level-header>button{display:none;speak:none}}.mainnav-level-header>button>pn-icon{speak:none;position:absolute;height:2.4rem;width:2.4rem;left:3rem;top:50%;transform:translateY(-50%)}[data-level="2"] .mainnav-level-header>pn-mainnav-link>a{font-size:2.4rem}';const I=U;const _=class{constructor(t){e(this,t);this.label="";this.level=1;this.levelId="";this.isOpen=false;this.parentName="";this.parentHref="";this.parentLinkId="";this.listCount=0;this.alignment="right"}get hostElement(){return n(this)}async componentWillLoad(){this.setState();s("openLevel",(()=>{this.onChangeOpenLevel()}))}setState(){this.listCount=this.hostElement.querySelectorAll(":scope > pn-mainnav-list").length;const e=this.hostElement.parentElement;if(e.tagName.toLowerCase()!=="nav"){this.level=2}if(e.tagName.toLowerCase()==="pn-mainnav-link"){this.parentName=e.getAttribute("name")+"";if(!this.label&&this.parentName||this.label!==this.parentName){this.label=this.parentName}this.parentHref=e.getAttribute("href")+"";this.parentLinkId=e.getAttribute("linkid")+"";const t=this.parentName.toLowerCase().replace(/\W/gi,"_");this.levelId=`mainnav-lvl${this.level}-${t}`}}onOpen(){if(this.level===2){requestAnimationFrame((()=>{const e=this.hostElement.getClientRects()[0];if(!e){return}const t=this.hostElement.parentElement.parentElement.parentElement.parentElement;if(t&&t.tagName.toLowerCase()==="nav"){const n=t.getClientRects()[0];if(!n){return}if(e.right>window.innerWidth){const t=this.hostElement.parentElement.getClientRects()[0];if(t.left-e.width<0){this.alignment="center"}else{this.alignment="left"}}}}))}}onChangeOpenLevel(){this.isOpen=a.openLevel===this.levelId;a.currentLevel=this.level}render(){return i(o,{key:"b17f6289b08e866eae25c354328c8caa2aab90e8",role:"navigation",...this.level>1&&this.levelId?{"aria-hidden":!this.isOpen+""}:{},"data-level-listcount":this.listCount+"","data-level-alignment":this.alignment,"data-level":this.level+"",...this.levelId?{id:this.levelId}:{}},this.level>1?i("div",{class:"mainnav-level-header"},i("label",{htmlFor:this.levelId},a.i18n.menuGoBackButton),i("button",{class:"secondlevel-backbtn",onClick:()=>{a.openLevel="";a.currentLevel=1},"aria-expanded":(a.openLevel===this.levelId)+""},i("pn-icon",{icon:l,color:"blue700"}),a.i18n.menuStartButton),this.parentHref&&this.label?i("pn-mainnav-link",{href:this.parentHref,name:this.label,linkid:this.parentLinkId}):null):null,i("slot",{key:"91dc3e2fb54c04b3421e77dc2da775e30bd16ed3",name:"top"}),i("slot",{key:"a5559d56167e3a63c9ee4409d7a9b8f572c016ab"}),i("slot",{key:"370e3749baa8d846a2b46ef530d193052357834a",name:"additional"}),i("slot",{key:"8990d0eccc05be615e57af1fb4dfcd5ecfab442a",name:"footer"}))}static get watchers(){return{label:["setState"],isOpen:["onOpen"]}}};_.style=I;const G='pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-mainnav-list{display:block;overflow:visible;list-style:none;margin:0;padding:0;grid-area:right}@media screen and (min-width: 64em){pn-mainnav-list+pn-mainnav-list{grid-area:left;border-right:0.1rem solid #d3cecb;margin-bottom:1.6rem;margin-right:-0.7rem;padding-right:0.7rem}}[data-level="1"]>pn-mainnav-list{overflow:scroll;-webkit-overflow-scrolling:touch}@media screen and (min-width: 64em){[data-level="1"]>pn-mainnav-list{height:100%;display:flex;flex-flow:row;overflow:visible;padding:0}}@media screen and (min-width: 64em){[data-level="2"]>pn-mainnav-list[data-navlist-showcolumns=true]{column-count:2;column-gap:1.6rem;padding-bottom:1.6rem}}.mainnav-list-heading{display:none;font-weight:bold;column-span:all;font-size:1.8rem;padding:1.4rem 1.4rem 1.4rem 4.8rem}@media screen and (min-width: 64em){.mainnav-list-heading{display:block;padding:0 1.4rem 1.4rem 1.4rem}}';const A=G;const j=class{constructor(t){e(this,t);this.heading="";this.linkCount=0}get hostElement(){return n(this)}componentWillLoad(){this.linkCount=this.hostElement.querySelectorAll(":scope > pn-mainnav-link").length}render(){return i(o,{key:"5cef1764640843570d240aeda1f1a3a2f365064c",class:"mainnav-list",role:"list","data-navlist-itemcount":this.linkCount+"","data-navlist-showcolumns":(this.linkCount>=8)+""},this.heading?i("div",{class:"mainnav-list-heading"},this.heading):null,i("slot",{key:"63a60869af810fe9da3013e7c95a7c99b9078ab8"}))}};j.style=A;class E{eventTarget=window??document?.body;endpoint="";storagePrefix="pn-user";checkUserLoggedInStateInterval=0;baseUrls={at:"https://atportal.postnord.com/api/unified-login/backend",prod:"https://portal.postnord.com/api/unified-login/backend"};events={loginstatechange:"loginstatechange"};endpoints={authorizationEndpoint:`/authorization`,tokenExchangeEndpoint:`/token`,userInfoEndpoint:`/user`,logoutEndpoint:`/logout`};keys={tokensource:"tokensource",token:"token",accessToken:"accessToken",user:"user",expire:"expire",expireDate:"expiredate"};overridetokenValue="overridetokenValue";siteUrl=window.location.origin;abortSignalForLoginCheck=null;loginCheckInProgress=false;loginCheckTimer=null;constructor(e=null){if(!e){return}this.eventTarget=e.eventTarget?e.eventTarget:this.eventTarget;this.endpoint=e.endpoint?e.endpoint:`${window.location.protocol}//${window.location.host}`;this.storagePrefix??=e.storagePrefix;this.checkUserLoggedInStateInterval=e.checkUserLoggedInStateInterval&&e.checkUserLoggedInStateInterval>0?parseInt(e.checkUserLoggedInStateInterval+"",10):0;if(e.userInfo){this.store.set(this.keys.user,e.userInfo);this.registerToken(this.overridetokenValue,"override")}}init(e=true){if(e){this.checkParameters();this.checkPNTopbar();this.checkExpireTime();if(this.store.get(this.keys.token)&&!this.store.get(this.keys.user)){this.fetchUserInfo()}this.loginStateChange();if(this.checkUserLoggedInStateInterval>0){this.initiateLoggedInCheck()}}}setSiteUrl(e){if(e){this.siteUrl=e}}initiateLoggedInCheck(){if(this.isLoggedIn()){if(window&&window["AbortController"]){this.abortSignalForLoginCheck=new AbortController}this.loginCheckTimer=window.setInterval((()=>{this.doExternalLoggedInCheck().then((()=>{})).catch((()=>{}))}),this.checkUserLoggedInStateInterval)}}async doExternalLoggedInCheck(){if(!window.navigator.onLine){return}if(!this.getToken()){window.clearInterval(this.checkUserLoggedInStateInterval);return}if(this.loginCheckInProgress&&this.abortSignalForLoginCheck){this.abortSignalForLoginCheck.abort();this.abortSignalForLoginCheck=new AbortController}this.loginCheckInProgress=true;const e={method:"GET",headers:{Accept:"application/json","Content-Type":"application/json",Authorization:this.getToken()}};if(this.abortSignalForLoginCheck&&this.abortSignalForLoginCheck["signal"]){e["signal"]=this.abortSignalForLoginCheck["signal"]}const t=await fetch(`${this.getBaseUrl()}${this.endpoints.userInfoEndpoint}`,e);if(t.status===409){window.clearInterval(this.checkUserLoggedInStateInterval);console.log("Cleared out user data due to bad response from authentication endpoint");this.LogoutUser();return}if(!t.ok){return}const n=await t.json();if(!n||!n["accessToken"]){window.clearInterval(this.checkUserLoggedInStateInterval);console.log("Cleared out user data due to bad response from authentication endpoint");this.LogoutUser()}this.loginCheckInProgress=false}LogoutUser(){this.clearUserData();if(this.eventTarget){const e=this.eventTarget.querySelector("#pn-marketweb-header-logoutlink");if(e){e.click();return}}this.loginStateChange();const e=window.location.href;window.location.href=this.getLogoutUrl(e)}isLoggedIn(e=false){if(e){return e}let t=this.store.get(this.keys.token)&&this.store.get(this.keys.user)?true:false;if(!t&&this.store.get(this.keys.token)===this.overridetokenValue){t=true}return t}registerToken(e="",t="frontend"){if(!e||e===this.getToken()){return}this.clearUserData();this.store.set(this.keys.tokensource,t);this.store.set(this.keys.token,e);this.fetchUserInfo()}invalidateTokenOfType(e="frontend"){const t=this.store.get(this.keys.token);if(!t){return}const n=this.store.get(this.keys.tokensource);if(n!==e){return}this.clearUserData()}getLoginUrl(e=""){const t=window.location.href;e=e?e:t;return`${this.getBaseUrl()}${this.endpoints.authorizationEndpoint}?redirectionUrl=${e}`}getLogoutUrl(e=""){if(e.indexOf("logout?logoutUrl")!==-1){return e}let t=e.replace("logout","").replace("http://window.location.href/?",window.location.href).replace("https://window.location.href/?",window.location.href);let n=this.siteUrl;try{const e=new URL(this.siteUrl+"");n=e.origin}catch(e){}const i=n.lastIndexOf("/")!==n.length-1;const o=n+(i?"/":"")+"logout";const a=`${this.getBaseUrl()}${this.endpoints.logoutEndpoint}?authorization=${this.store.get(this.keys.token)}%26redirectionUrl=${t}`;const s=`${o}?logoutUrl=${a}`;return s}getUserInfo(){if(this.isLoggedIn()){return this.store.get(this.keys.user)}}getEventTarget(){return this.eventTarget}checkExpireTime(){const e=this.store.get(this.keys.expire);if(!e){return}const t=new Date;const n=new Date(Math.floor(parseInt(e,10)*1e3));if(t>n){console.info("Login time has expired");this.clearUserData();this.loginStateChange()}}checkPNTopbar(){if(this.isLoggedIn()||!window["pnTopbar"]||!window["pnTopbar"]["session_id"]){return}this.store.set(this.keys.token,window["pnTopbar"]["session_id"]);this.fetchUserInfo()}checkParameters(){if(!window?.location){return}const e=new URLSearchParams(window.location.search);if(e.get("oneTimeCode")){const t=e.get("oneTimeCode");this.exchangeToken(t).then((()=>{const e=window.location.href;const n=e.indexOf("?oneTimeCode")!==-1?"?":"&";const i=e.replace(`${n}oneTimeCode=${t}`,"");history.replaceState({},document.querySelector("title").innerText,i)}))}}async fetchUserInfo(){const e=this.store.get(this.keys.token);if(this.store.get(this.keys.token)===this.overridetokenValue){console.info("Did not fetch user data since it was set by an override");return}const t={method:"GET",headers:{Accept:"application/json","Content-Type":"application/json",Authorization:e}};const n=await fetch(`${this.getBaseUrl()}${this.endpoints.userInfoEndpoint}`,t);const i=await n.json();if(i&&i["idToken"]){try{const{idToken:e,expiryTime:t,accessToken:n}=i;const o=this.parseUserInfo(e);if(!o){console.error("Userdata is not valid");this.clearUserData();return}this.store.set(this.keys.user,o);this.store.set(this.keys.accessToken,n);this.store.set(this.keys.expire,t);this.store.set(this.keys.expireDate,new Date(Math.floor(parseInt(t,10)*1e3)));this.loginStateChange()}catch(e){console.error("Unable to get user information",e)}}else{console.error("Unable to get user information. Clearing login state");this.clearUserData()}}clearUserData(){this.store.remove(this.keys.user);this.store.remove(this.keys.tokensource);this.store.remove(this.keys.accessToken);this.store.remove(this.keys.token);this.store.remove(this.keys.expire);this.store.remove(this.keys.expireDate)}getToken(){return this.store.get(this.keys.token)}getAccessToken(){return this.store.get(this.keys.accessToken)}async exchangeToken(e){this.clearUserData();const t=await fetch(`${this.getBaseUrl()}${this.endpoints.tokenExchangeEndpoint}?oneTimeCode=${e}`);const{token:n}=await t.json();if(typeof n==="string"&&n){this.store.set(this.keys.token,n)}this.fetchUserInfo()}loginStateChange(){if(!this.eventTarget){return}this.eventTarget.dispatchEvent(new CustomEvent(this.events.loginstatechange,{detail:this.isLoggedIn()}))}getBaseUrl(){const e=["localhost","integration.","inte.","local."];let t=e.filter((e=>this.endpoint.indexOf(e)!==-1)).length>0;if(["devportal.postnord.com","atportal.postnord.com"].indexOf(window.location.hostname)!==-1){t=true}if(t){return this.baseUrls.at}return this.baseUrls.prod}parseUserInfo(e){if(!e){return null}var t=e.split(".")[1];var n=t.replace(/-/g,"+").replace(/_/g,"/");var i=decodeURIComponent(atob(n).split("").map((function(e){return"%"+("00"+e.charCodeAt(0).toString(16)).slice(-2)})).join(""));return JSON.parse(i)}store={get:e=>{const t=window.localStorage.getItem(`${this.storagePrefix}-${e}`);if(!t){return t}if(t.indexOf("{")===0){try{return JSON.parse(t)}catch(e){}}if(t.indexOf(",")!==-1){return t.split(",")}return t},set:(e,t)=>{if(typeof t==="object"&&typeof t.length==="undefined"){window.localStorage.setItem(`${this.storagePrefix}-${e}`,JSON.stringify(t));return}window.localStorage.setItem(`${this.storagePrefix}-${e}`,t)},remove:e=>{window.localStorage.removeItem(`${this.storagePrefix}-${e}`)}}}const N='pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-marketweb-siteheader-login{padding:1rem 0;max-height:5.2rem;position:relative}pn-marketweb-siteheader-login pn-button-dropdown .pn-button-dropdown-container .pn-button-dropdown-content{max-width:350px;display:flex;flex-direction:column;gap:2.4rem;padding:4rem}pn-marketweb-siteheader-login pn-button-dropdown .pn-button-dropdown-container .pn-button-dropdown-content pn-button{width:100%}pn-marketweb-siteheader-login pn-button-dropdown .pn-button-dropdown-container .pn-button-dropdown-content pn-marketweb-siteheader-unified-login::after{display:block;content:"";height:2px;background:#f9f8f8;width:100%;margin-top:2.4rem}pn-marketweb-siteheader-login pn-button-dropdown .pn-button-dropdown-container .pn-button-dropdown-content span::before{display:block;content:"";height:2px;background:#f9f8f8;width:100%;margin-bottom:2.4rem}pn-marketweb-siteheader-login pn-button-dropdown .pn-button-dropdown-container .pn-button-dropdown-content span{font-size:1.4rem;color:#2d2013}pn-marketweb-siteheader-login pn-button-dropdown .pn-button-dropdown-container .pn-button-dropdown-content span a{text-decoration:none;color:#005d92}pn-marketweb-siteheader-login pn-button-dropdown .pn-button-dropdown-container .pn-button-dropdown-content span a:hover{text-decoration:underline}pn-marketweb-siteheader-login pn-button-dropdown .pn-button-dropdown-container .pn-button-dropdown-content span *{margin-bottom:0}pn-marketweb-siteheader-login pn-button-dropdown{display:none}pn-marketweb-siteheader-login.hydrated pn-button-dropdown{display:block}';const O=N;const W=class{constructor(n){e(this,n);this.loginStateChange=t(this,"loginStateChange",7);this.endpoint="";this.token="";this.i18n={searchlabel:"",searchplaceholder:"",searchbuttontext:"",menuHomeButton:"",menuGoBackButton:"",mainMenuButton:"",menuStartButton:"",profileSelectionFlyoutHeading:"",unifiedLoginButton:"",unifiedMyPagesButton:""};this.siteUrl="";this.emitEvents=true;this.loginDialog=null;this.fullname="";this.loggedin=false;this.showProfileSelection=false;this.showUnifiedLogin=false;this.checkUserLoggedInStateInterval=0;this.environment=undefined;this.loginLinks=undefined;this.toggleButtonText=this.loginDialog?.loginMenuLinkText?this.loginDialog.loginMenuLinkText:"";this.username=this.fullname}get hostElement(){return n(this)}loginStateChange;componentWillLoad(){const e=this.loggedin&&this.fullname?{given_name:this.fullname}:null;h.loginManager=new E({endpoint:this.endpoint,eventTarget:this.hostElement,checkUserLoggedInStateInterval:this.checkUserLoggedInStateInterval,userInfo:e});h.loginManager.setSiteUrl(this.siteUrl);this.hostElement["loginmanager"]=h.loginManager;if(this.token){h.loginManager.registerToken(this.token,"backend")}else if(this.emitEvents){h.loginManager.invalidateTokenOfType("backend")}this.hostElement.addEventListener(h.loginManager.events.loginstatechange,this.onLoginStateChange.bind(this));this.init();this.setUserName();this.setToggleButtonText()}async init(){h.loginManager.init(this.emitEvents);this.setToggleButtonText();this.adjustLoginLinks()}adjustLoginLinks(){if(!this.loginDialog?.loginMenuLinks){return}const e=(e,t)=>{if(!e.isLogoutLink){e.isLogoutLink=e.pageLink.indexOf("location.href")!==-1&&e.pageLink.indexOf("logout")!==-1}if(e.isLogoutLink){e.href=h.loginManager.getLogoutUrl(e.pageLink)}if(t===0&&!e.href){e.href=h.loginManager.getLoginUrl();e.linkType="primary"}if(e.primaryLinkApperance&&!e.linkType){e.linkType="primary"}return e};if(this.loginDialog){this.loginDialog.loginMenuLinks=this.loginDialog.loginMenuLinks.map(e);this.loginDialog.loggedInLinks=this.loginDialog.loggedInLinks.map(e)}this.loginDialog.legacyLoginLinks=[{href:h.loginManager.getLoginUrl(this.loginDialog.loginUrl),linkText:this.loginDialog.loginLinkText,openInNewWindow:false,isLogoutLink:false,pageLink:null,linkType:"primary",primaryLinkApperance:true},{href:h.loginManager.getLoginUrl(this.loginDialog.registerUrl),linkText:this.loginDialog.createLoginLinkText,openInNewWindow:false,isLogoutLink:false,pageLink:null,primaryLinkApperance:false}]}setUserName(){const e=h.loginManager.getUserInfo();let t="";if(!this.loggedin||!e){this.username=t}if(e&&e.given_name){t=e.given_name+(e?.family_name?` ${e?.family_name}`:"")}if(!t&&e&&e.email){t=e.email}if(!t&&this.fullname){t=this.fullname}this.username=t;this.adjustLoginLinks()}setToggleButtonText(){if(this.loggedin){this.toggleButtonText=this.username;if(!this.toggleButtonText){this.toggleButtonText=this.loginDialog.loggedInButtonText}}else{this.toggleButtonText=this.loginDialog.loginMenuLinkText}}onLoginStateChange(e){if(this.loggedin!==e.detail&&this.emitEvents){this.loggedin=e.detail;this.loginStateChange.emit({loggedIn:this.loggedin,token:h.loginManager.getToken()});this.setUserName();this.setToggleButtonText()}}render(){if(!this.loginDialog){return}let e={username:null,loggedin:"false"};if(this.username){e.username=this.username;e.loggedin=this.loggedin+""}return i(o,{...e},i("pn-button-dropdown",{label:this.toggleButtonText,icon:k,appearance:"light",variant:"borderless",class:"siteheader-logindialog"},this.showUnifiedLogin&&i("pn-marketweb-siteheader-unified-login",{loggedIn:this.loggedin,myPageLabel:this.i18n.unifiedMyPagesButton,myPageUrl:"https://account.postnord.com/secure/profile",logInLabel:this.i18n.unifiedLoginButton}),this.loggedin&&this.showProfileSelection?i("pn-marketweb-siteheader-login-profileselection",{loginDialog:this.loginDialog,loggedin:this.loggedin,i18n:this.i18n,idNamespace:this.emitEvents?"1":"2",endpoint:this.endpoint}):i("pn-marketweb-siteheader-login-links",{loginDialog:this.loginDialog,loggedin:this.loggedin,idNamespace:this.emitEvents?"1":"2",username:this.username,showUnifiedLogin:this.showUnifiedLogin}),!this.loggedin&&this.loginDialog?.loginInfo&&i("span",{innerHTML:`${this.loginDialog.loginInfo}`})))}static get watchers(){return{i18n:["init"],loginDialog:["init"]}}};W.style=O;const{state:D,onChange:P}=d({searchValue:"",autocompleteSuggestions:{},requestAbortController:new AbortController});const V="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.siteheader-search a{display:none}@media screen and (min-width: 48em){.siteheader-search a{display:block}}.siteheader-search pn-search-field>.input-container button{background:#ffffff}.siteheader-search pn-search-field.button-icon pn-button,.siteheader-search pn-button{display:inline-flex}.siteheader-search pn-search-field.button-icon pn-button button,.siteheader-search pn-button button{align-self:center;padding:0;height:2.3em;width:2.4em;line-height:0;min-height:unset;min-width:initial}.siteheader-search pn-search-field.button-icon pn-button pn-icon,.siteheader-search pn-button pn-icon{margin-left:0}.siteheader-search pn-search-field.button-icon pn-button .pn-button-tooltip,.siteheader-search pn-button .pn-button-tooltip{line-height:initial !important}.siteheader-search form{justify-content:flex-end;align-items:stretch;width:auto;flex:none;display:flex;padding:0;margin:0 0 0 0.4rem;position:relative;flex-direction:column}@media screen and (min-width: 60em){.siteheader-search form{margin-right:1.6rem}}.siteheader-search form pn-search-field{min-width:13.5em}.siteheader-search form pn-search-field .input-container{align-self:center}.siteheader-search form pn-search-field input{height:auto;min-height:1em;padding:0.6em 0.75em}";const R=V;const X=class{constructor(t){e(this,t);this.i18n=undefined;this.showOnlyLink=false;this.hideSearch=false;this.language=null;this.siteid=null;this.search={};this.primary=false;this.icononly=true;this.autoCompleteOptions=[]}get hostElement(){return n(this)}onSearchValueUpdate(){this.getAutocomplete(D.searchValue)}async getAutocomplete(e){if(!this.search.AutocompleteEndpoint||e.length<2){this.autoCompleteOptions=[];return}if(D.autocompleteSuggestions[e]){this.setAutocompleteSuggestions(D.autocompleteSuggestions[e]);return}let t=`${this.search.AutocompleteEndpoint}?prefix=${e}&size=10`;if(this.language||this.siteid){t+=`&tags=`;if(this.language){t+=`language:${this.language}`}if(this.language&&this.siteid){t+=`,`}if(this.siteid){t+=`siteid:${this.siteid}`}}const n=await fetch(t,{signal:D.requestAbortController.signal}).catch((e=>{console.warn("Unable to fetch autocomplete suggestions",e)}));if(!n){return}const i=await n.json();if(!i||!i.hits||!i.hits.length){return}const o=i.hits.filter((e=>e.type==="editorial")).map((e=>e.query));D.autocompleteSuggestions[e]=o;this.setAutocompleteSuggestions(o)}setAutocompleteSuggestions(e){if(typeof e!=="object"||typeof e.length!=="number"||e.length===0){return}this.autoCompleteOptions=e}componentWillLoad(){P("searchValue",(()=>{this.onSearchValueUpdate()}))}componentDidRender(){const e=this.hostElement.querySelector("pn-search-field input:not([list])");if(e&&this.search.AutocompleteEndpoint){e.setAttribute("list","siteheader-search-autocomplete")}}render(){if(!this.search.formActionUrl||this.hideSearch){return}const e=this.search.AutocompleteEndpoint?{list:"siteheader-search-autocomplete"}:{};return i("div",{class:"siteheader-search"},this.showOnlyLink?i("pn-button",{href:this.search.formActionUrl,appearance:"light",icon:c,tooltip:this.i18n.searchlabel}):i("form",{method:"get",action:this.search.formActionUrl,role:"search"},i("pn-search-field",{...e,label:this.i18n.searchlabel,name:"q",button:this.icononly?"icon":null,"button-label":"Search",placeholder:this.i18n.searchplaceholder,onUpdate:e=>{D.searchValue=e.detail},onSearch:()=>{const e=this.hostElement.querySelector("form");if(e){e.submit()}}}),this.primary&&this.search.AutocompleteEndpoint?i("datalist",{id:"siteheader-search-autocomplete"},this.autoCompleteOptions.map((e=>i("option",null,e)))):null))}};X.style=R;const q={sv:{navlabel:"Webbplatsväljare"},en:{navlabel:"Website selector"},da:{navlabel:"Webstedsvælger"},no:{navlabel:"Nettstedsvelger"},fi:{navlabel:"Verkkosivun valitsin"},de:{navlabel:"Website-Selektor"}};const F="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-site-selector{display:flex;position:relative;justify-content:center;max-height:5.2rem}@media screen and (min-width: 75em){pn-site-selector{display:block}}.siteselector-heading{display:block;padding:0;margin-bottom:1.6rem}@media screen and (min-width: 75em){.siteselector-heading{display:flex;align-items:center;margin-top:0.8rem}}.siteselector-list{list-style:none;margin:0;padding:0}";const J=F;const K=class{constructor(t){e(this,t);this.buttontext="postnord";this.heading="PostNord";this.language="sv";this.i18n={navlabel:"Site selector"}}get hostElement(){return n(this)}componentWillLoad(){this.setLanguage()}setLanguage(){if(q[this.language]){this.i18n=q[this.language]}}render(){return i(o,{key:"e7f2afb9152823c342d400159df9250b8077f5e4"},i("pn-button-dropdown",{key:"cf7772fb94bc00f0e34f2224de5801087b1b4bdc",label:this.buttontext,icon:u,appearance:"light",variant:"borderless"},i("nav",{key:"a9aa62af98725a2ae8c9ee3c8763b1657b686b3b",class:"siteselector-nav","aria-label":this.i18n.navlabel},this.heading?i("strong",{class:"siteselector-heading"},this.heading):null,i("ul",{key:"e39b42302acdcbde9513b0886ba689a2dd15ba53",class:"siteselector-list"},i("slot",{key:"2f653ff81c6b0cdf631aab20e6730251c4929f4f"})))))}};K.style=J;const Y="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-site-selector-item{display:block}pn-site-selector-item>div,pn-site-selector-item>a{padding:0.8rem 0;display:flex;flex-flow:column;position:relative}.siteselector-item-link{border-radius:0;text-decoration:none;color:#005d92;flex-direction:row}.siteselector-item-link:hover,.siteselector-item-link:focus{background-color:#f3f2f2;color:#005d92;text-decoration:underline;outline:none;box-shadow:none}.siteselector-item-link:active{background-color:#f3f2f2;color:#00a0d6;outline:none}.siteselector-item-link>span{flex-grow:1}.siteselector-item-link pn-icon{right:3.2rem;height:1.9rem;width:1.9rem;align-self:center}.siteselector-item-link pn-icon svg{width:100%;height:auto}.siteselector-item-title{display:block}.siteselector-item-description{color:#2d2013;font-size:1.28rem}a:hover>.siteselector-item-description,a:focus>.siteselector-item-description{background-color:#f3f2f2;color:#005d92;text-decoration:underline;outline:none}a:active>.siteselector-item-description{background-color:#f3f2f2;color:#00a0d6;outline:none}";const Q=Y;const Z=class{constructor(t){e(this,t);this.url="";this.heading="";this.description="";this.newwindow=false}render(){return i(o,{key:"5b5d779730b32cd1e510f6a484a79be67933b6d2",role:"listitem"},this.url?i("a",{class:"siteselector-item-link",href:this.url,target:this.newwindow?"_blank":"self",rel:this.newwindow?"nofollow noopener":""},i("span",null,this.heading&&i("span",{class:"siteselector-item-title"},this.heading),this.description&&i("small",{class:"siteselector-item-description"},this.description)),i("pn-icon",{icon:p,color:"blue700"})):i("div",null,this.heading&&i("span",{class:"siteselector-item-title"},this.heading),this.description&&i("small",{class:"siteselector-item-description"},this.description)))}};Z.style=Q;export{L as pn_language_selector,M as pn_language_selector_option,z as pn_mainnav,_ as pn_mainnav_level,j as pn_mainnav_list,W as pn_marketweb_siteheader_login,X as pn_marketweb_siteheader_search,K as pn_site_selector,Z as pn_site_selector_item};
2
+ //# sourceMappingURL=p-0c54be24.entry.js.map