@postnord/pn-marketweb-components 4.4.0 → 4.5.1

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 (177) hide show
  1. package/cjs/loader.cjs.js +1 -1
  2. package/cjs/pn-date-and-time.cjs.entry.js +25 -3
  3. package/cjs/pn-date-and-time.cjs.entry.js.map +1 -1
  4. package/cjs/pn-market-web-components.cjs.js +1 -1
  5. package/collection/components/input/pn-date-and-time/pn-date-and-time.js +44 -3
  6. package/collection/components/input/pn-date-and-time/pn-date-and-time.js.map +1 -1
  7. package/collection/components/input/pn-date-and-time/pn-date-and-time.stories.js +3 -1
  8. package/components/pn-date-and-time.js +27 -3
  9. package/components/pn-date-and-time.js.map +1 -1
  10. package/esm/loader.js +1 -1
  11. package/esm/pn-date-and-time.entry.js +25 -3
  12. package/esm/pn-date-and-time.entry.js.map +1 -1
  13. package/esm/pn-market-web-components.js +1 -1
  14. package/package.json +1 -1
  15. package/pn-market-web-components/p-dbfb632c.entry.js +2 -0
  16. package/pn-market-web-components/p-dbfb632c.entry.js.map +1 -0
  17. package/pn-market-web-components/pn-market-web-components.esm.js +1 -1
  18. package/pn-market-web-components/pn-market-web-components.esm.js.map +1 -1
  19. package/types/components/input/pn-date-and-time/pn-date-and-time.d.ts +3 -0
  20. package/types/components.d.ts +2 -0
  21. package/umd/modules/@postnord/web-components/cem.json +392 -0
  22. package/umd/modules/@postnord/web-components/cjs/close_small-CTOfc4Qy.js +10 -0
  23. package/umd/modules/@postnord/web-components/cjs/index-DWu-2oJc.js +12 -4
  24. package/umd/modules/@postnord/web-components/cjs/loader.cjs.js +1 -1
  25. package/umd/modules/@postnord/web-components/cjs/pn-card.cjs.entry.js +1 -1
  26. package/umd/modules/@postnord/web-components/cjs/pn-footer.cjs.entry.js +1 -1
  27. package/umd/modules/@postnord/web-components/cjs/pn-header.cjs.entry.js +1 -1
  28. package/umd/modules/@postnord/web-components/cjs/pn-input-chip.cjs.entry.js +52 -0
  29. package/umd/modules/@postnord/web-components/cjs/pn-multiselect.cjs.entry.js +1 -1
  30. package/umd/modules/@postnord/web-components/cjs/pn-ocr-search.cjs.entry.js +1 -1
  31. package/umd/modules/@postnord/web-components/cjs/pn-page-nav-dropdown-item.cjs.entry.js +1 -1
  32. package/umd/modules/@postnord/web-components/cjs/pn-page-nav-item.cjs.entry.js +1 -1
  33. package/umd/modules/@postnord/web-components/cjs/pn-page-nav.cjs.entry.js +1 -1
  34. package/umd/modules/@postnord/web-components/cjs/pn-pagination.cjs.entry.js +1 -1
  35. package/umd/modules/@postnord/web-components/cjs/pn-radio-button.cjs.entry.js +1 -1
  36. package/umd/modules/@postnord/web-components/cjs/pn-range.cjs.entry.js +1 -1
  37. package/umd/modules/@postnord/web-components/cjs/pn-search-field.cjs.entry.js +2 -4
  38. package/umd/modules/@postnord/web-components/cjs/pn-segment.cjs.entry.js +1 -1
  39. package/umd/modules/@postnord/web-components/cjs/pn-segmented-control.cjs.entry.js +1 -1
  40. package/umd/modules/@postnord/web-components/cjs/pn-select.cjs.entry.js +1 -1
  41. package/umd/modules/@postnord/web-components/cjs/pn-skeleton-loader.cjs.entry.js +103 -0
  42. package/umd/modules/@postnord/web-components/cjs/pn-tab.cjs.entry.js +1 -1
  43. package/umd/modules/@postnord/web-components/cjs/pn-tablist.cjs.entry.js +1 -1
  44. package/umd/modules/@postnord/web-components/cjs/pn-text-link.cjs.entry.js +1 -1
  45. package/umd/modules/@postnord/web-components/cjs/pn-textarea.cjs.entry.js +1 -1
  46. package/umd/modules/@postnord/web-components/cjs/pn-tile.cjs.entry.js +1 -1
  47. package/umd/modules/@postnord/web-components/cjs/pn-toggle-switch.cjs.entry.js +1 -1
  48. package/umd/modules/@postnord/web-components/cjs/pn-zipcode-search.cjs.entry.js +1 -1
  49. package/umd/modules/@postnord/web-components/cjs/postnord-web-components.cjs.js +1 -1
  50. package/umd/modules/@postnord/web-components/collection/collection-manifest.json +2 -0
  51. package/umd/modules/@postnord/web-components/collection/components/feedback/pn-skeleton-loader/pn-skeleton-loader.css +314 -0
  52. package/umd/modules/@postnord/web-components/collection/components/feedback/pn-skeleton-loader/pn-skeleton-loader.js +291 -0
  53. package/umd/modules/@postnord/web-components/collection/components/input/pn-input-chip/pn-input-chip.css +109 -0
  54. package/umd/modules/@postnord/web-components/collection/components/input/pn-input-chip/pn-input-chip.js +232 -0
  55. package/umd/modules/@postnord/web-components/collection/components/input/pn-multiselect/pn-multiselect.js +1 -1
  56. package/umd/modules/@postnord/web-components/collection/components/input/pn-radio-button/pn-radio-button.js +1 -1
  57. package/umd/modules/@postnord/web-components/collection/components/input/pn-range/pn-range.js +1 -1
  58. package/umd/modules/@postnord/web-components/collection/components/input/pn-search-field/pn-search-field.js +1 -1
  59. package/umd/modules/@postnord/web-components/collection/components/input/pn-segmented-control/pn-segmented-control.js +1 -1
  60. package/umd/modules/@postnord/web-components/collection/components/input/pn-segmented-control/segment/pn-segment.js +1 -1
  61. package/umd/modules/@postnord/web-components/collection/components/input/pn-select/pn-select.js +1 -1
  62. package/umd/modules/@postnord/web-components/collection/components/input/pn-textarea/pn-textarea.js +1 -1
  63. package/umd/modules/@postnord/web-components/collection/components/input/pn-toggle-switch/pn-toggle-switch.js +1 -1
  64. package/umd/modules/@postnord/web-components/collection/components/layout/pn-header/pn-header.js +1 -1
  65. package/umd/modules/@postnord/web-components/collection/components/navigation/pn-card/pn-card.js +1 -1
  66. package/umd/modules/@postnord/web-components/collection/components/navigation/pn-footer/pn-footer.js +1 -1
  67. package/umd/modules/@postnord/web-components/collection/components/navigation/pn-page-nav/dropdown-item/pn-page-nav-dropdown-item.js +1 -1
  68. package/umd/modules/@postnord/web-components/collection/components/navigation/pn-page-nav/item/pn-page-nav-item.js +1 -1
  69. package/umd/modules/@postnord/web-components/collection/components/navigation/pn-page-nav/menu/pn-page-nav.js +1 -1
  70. package/umd/modules/@postnord/web-components/collection/components/navigation/pn-pagination/pn-pagination.js +1 -1
  71. package/umd/modules/@postnord/web-components/collection/components/navigation/pn-tablist/pn-tablist.js +1 -1
  72. package/umd/modules/@postnord/web-components/collection/components/navigation/pn-tablist/tab/pn-tab.js +1 -1
  73. package/umd/modules/@postnord/web-components/collection/components/navigation/pn-text-link/pn-text-link.js +1 -1
  74. package/umd/modules/@postnord/web-components/collection/components/navigation/pn-tile/pn-tile.js +1 -1
  75. package/umd/modules/@postnord/web-components/collection/components/web-components/pn-ocr-search/pn-ocr-search.js +1 -1
  76. package/umd/modules/@postnord/web-components/collection/components/web-components/pn-zipcode-search/pn-zipcode-search.js +1 -1
  77. package/umd/modules/@postnord/web-components/components/close_small.js +5 -0
  78. package/umd/modules/@postnord/web-components/components/index.d.ts +4 -0
  79. package/umd/modules/@postnord/web-components/components/index.js +1 -1
  80. package/umd/modules/@postnord/web-components/components/pn-card.js +1 -1
  81. package/umd/modules/@postnord/web-components/components/pn-footer.js +1 -1
  82. package/umd/modules/@postnord/web-components/components/pn-header.js +1 -1
  83. package/umd/modules/@postnord/web-components/components/pn-input-chip.d.ts +11 -0
  84. package/umd/modules/@postnord/web-components/components/pn-input-chip.js +5 -0
  85. package/umd/modules/@postnord/web-components/components/pn-multiselect.js +1 -1
  86. package/umd/modules/@postnord/web-components/components/pn-ocr-search.js +1 -1
  87. package/umd/modules/@postnord/web-components/components/pn-page-nav-dropdown-item.js +1 -1
  88. package/umd/modules/@postnord/web-components/components/pn-page-nav-item.js +1 -1
  89. package/umd/modules/@postnord/web-components/components/pn-page-nav.js +1 -1
  90. package/umd/modules/@postnord/web-components/components/pn-pagination.js +1 -1
  91. package/umd/modules/@postnord/web-components/components/pn-radio-button.js +1 -1
  92. package/umd/modules/@postnord/web-components/components/pn-range.js +1 -1
  93. package/umd/modules/@postnord/web-components/components/pn-search-field2.js +1 -1
  94. package/umd/modules/@postnord/web-components/components/pn-segment.js +1 -1
  95. package/umd/modules/@postnord/web-components/components/pn-segmented-control.js +1 -1
  96. package/umd/modules/@postnord/web-components/components/pn-select2.js +1 -1
  97. package/umd/modules/@postnord/web-components/components/pn-skeleton-loader.d.ts +11 -0
  98. package/umd/modules/@postnord/web-components/components/pn-skeleton-loader.js +5 -0
  99. package/umd/modules/@postnord/web-components/components/pn-tab.js +1 -1
  100. package/umd/modules/@postnord/web-components/components/pn-tablist.js +1 -1
  101. package/umd/modules/@postnord/web-components/components/pn-text-link2.js +1 -1
  102. package/umd/modules/@postnord/web-components/components/pn-textarea.js +1 -1
  103. package/umd/modules/@postnord/web-components/components/pn-tile.js +1 -1
  104. package/umd/modules/@postnord/web-components/components/pn-toggle-switch.js +1 -1
  105. package/umd/modules/@postnord/web-components/components/pn-zipcode-search.js +1 -1
  106. package/umd/modules/@postnord/web-components/esm/close_small-gPbnChG6.js +8 -0
  107. package/umd/modules/@postnord/web-components/esm/index-XKg-ydzH.js +12 -4
  108. package/umd/modules/@postnord/web-components/esm/loader.js +1 -1
  109. package/umd/modules/@postnord/web-components/esm/pn-card.entry.js +1 -1
  110. package/umd/modules/@postnord/web-components/esm/pn-footer.entry.js +1 -1
  111. package/umd/modules/@postnord/web-components/esm/pn-header.entry.js +1 -1
  112. package/umd/modules/@postnord/web-components/esm/pn-input-chip.entry.js +50 -0
  113. package/umd/modules/@postnord/web-components/esm/pn-multiselect.entry.js +1 -1
  114. package/umd/modules/@postnord/web-components/esm/pn-ocr-search.entry.js +1 -1
  115. package/umd/modules/@postnord/web-components/esm/pn-page-nav-dropdown-item.entry.js +1 -1
  116. package/umd/modules/@postnord/web-components/esm/pn-page-nav-item.entry.js +1 -1
  117. package/umd/modules/@postnord/web-components/esm/pn-page-nav.entry.js +1 -1
  118. package/umd/modules/@postnord/web-components/esm/pn-pagination.entry.js +1 -1
  119. package/umd/modules/@postnord/web-components/esm/pn-radio-button.entry.js +1 -1
  120. package/umd/modules/@postnord/web-components/esm/pn-range.entry.js +1 -1
  121. package/umd/modules/@postnord/web-components/esm/pn-search-field.entry.js +2 -4
  122. package/umd/modules/@postnord/web-components/esm/pn-segment.entry.js +1 -1
  123. package/umd/modules/@postnord/web-components/esm/pn-segmented-control.entry.js +1 -1
  124. package/umd/modules/@postnord/web-components/esm/pn-select.entry.js +1 -1
  125. package/umd/modules/@postnord/web-components/esm/pn-skeleton-loader.entry.js +101 -0
  126. package/umd/modules/@postnord/web-components/esm/pn-tab.entry.js +1 -1
  127. package/umd/modules/@postnord/web-components/esm/pn-tablist.entry.js +1 -1
  128. package/umd/modules/@postnord/web-components/esm/pn-text-link.entry.js +1 -1
  129. package/umd/modules/@postnord/web-components/esm/pn-textarea.entry.js +1 -1
  130. package/umd/modules/@postnord/web-components/esm/pn-tile.entry.js +1 -1
  131. package/umd/modules/@postnord/web-components/esm/pn-toggle-switch.entry.js +1 -1
  132. package/umd/modules/@postnord/web-components/esm/pn-zipcode-search.entry.js +1 -1
  133. package/umd/modules/@postnord/web-components/esm/postnord-web-components.js +1 -1
  134. package/umd/modules/@postnord/web-components/hydrate/index.js +199 -22
  135. package/umd/modules/@postnord/web-components/hydrate/index.mjs +199 -22
  136. package/umd/modules/@postnord/web-components/package.json +1 -1
  137. package/umd/modules/@postnord/web-components/postnord-web-components/{p-e11b4af5.entry.js → p-10d5fb90.entry.js} +1 -1
  138. package/umd/modules/@postnord/web-components/postnord-web-components/{p-88344f8d.entry.js → p-110ba4cc.entry.js} +1 -1
  139. package/umd/modules/@postnord/web-components/postnord-web-components/{p-98a37be9.entry.js → p-1b27c05f.entry.js} +1 -1
  140. package/umd/modules/@postnord/web-components/postnord-web-components/{p-292a7591.entry.js → p-20fe57fd.entry.js} +1 -1
  141. package/umd/modules/@postnord/web-components/postnord-web-components/p-43483837.entry.js +5 -0
  142. package/umd/modules/@postnord/web-components/postnord-web-components/{p-060b6ad2.entry.js → p-48f7e582.entry.js} +1 -1
  143. package/umd/modules/@postnord/web-components/postnord-web-components/{p-a31d93db.entry.js → p-594f5e35.entry.js} +1 -1
  144. package/umd/modules/@postnord/web-components/postnord-web-components/{p-9d56fb64.entry.js → p-5f5f3eeb.entry.js} +1 -1
  145. package/umd/modules/@postnord/web-components/postnord-web-components/p-783ee52f.entry.js +5 -0
  146. package/umd/modules/@postnord/web-components/postnord-web-components/{p-e5574624.entry.js → p-809a0ddb.entry.js} +1 -1
  147. package/umd/modules/@postnord/web-components/postnord-web-components/{p-d81b4ede.entry.js → p-8d90ab9d.entry.js} +1 -1
  148. package/umd/modules/@postnord/web-components/postnord-web-components/{p-3db02038.entry.js → p-90b44536.entry.js} +1 -1
  149. package/umd/modules/@postnord/web-components/postnord-web-components/{p-a1f92f19.entry.js → p-9f48d450.entry.js} +1 -1
  150. package/umd/modules/@postnord/web-components/postnord-web-components/{p-ef00ef4d.entry.js → p-a028c1af.entry.js} +1 -1
  151. package/umd/modules/@postnord/web-components/postnord-web-components/p-a3bd612d.entry.js +5 -0
  152. package/umd/modules/@postnord/web-components/postnord-web-components/{p-d228b929.entry.js → p-a70c9879.entry.js} +1 -1
  153. package/umd/modules/@postnord/web-components/postnord-web-components/p-b80c060c.entry.js +5 -0
  154. package/umd/modules/@postnord/web-components/postnord-web-components/{p-0bf70d44.entry.js → p-bdb494ac.entry.js} +1 -1
  155. package/umd/modules/@postnord/web-components/postnord-web-components/{p-020ee3f4.entry.js → p-c51d8164.entry.js} +1 -1
  156. package/umd/modules/@postnord/web-components/postnord-web-components/{p-8cedf2e0.entry.js → p-c7a6d048.entry.js} +1 -1
  157. package/umd/modules/@postnord/web-components/postnord-web-components/{p-b45e58df.entry.js → p-d728a000.entry.js} +1 -1
  158. package/umd/modules/@postnord/web-components/postnord-web-components/p-eb15a889.entry.js +5 -0
  159. package/umd/modules/@postnord/web-components/postnord-web-components/{p-3709c995.entry.js → p-fa3c2490.entry.js} +1 -1
  160. package/umd/modules/@postnord/web-components/postnord-web-components/{p-64207923.entry.js → p-fdbffb51.entry.js} +1 -1
  161. package/umd/modules/@postnord/web-components/postnord-web-components/p-gPbnChG6.js +5 -0
  162. package/umd/modules/@postnord/web-components/postnord-web-components/postnord-web-components.esm.js +1 -1
  163. package/umd/modules/@postnord/web-components/types/components/feedback/pn-skeleton-loader/pn-skeleton-loader.d.ts +35 -0
  164. package/umd/modules/@postnord/web-components/types/components/input/pn-input-chip/pn-input-chip.d.ts +34 -0
  165. package/umd/modules/@postnord/web-components/types/components.d.ts +257 -0
  166. package/umd/modules/@postnord/web-components/vscode-data.json +117 -0
  167. package/umd/pn-marketweb-header-wrongrembase.css +6 -5
  168. package/umd/pn-marketweb-init.js +1 -1
  169. package/umd/pn-marketweb-salesforce-header.js +1 -1
  170. package/umd/pn-marketweb-salesforce-owncss.js +88 -0
  171. package/umd/pn-marketweb-salesforce.js +1 -1
  172. package/vscode-data.json +4 -0
  173. package/pn-market-web-components/p-99843884.entry.js +0 -2
  174. package/pn-market-web-components/p-99843884.entry.js.map +0 -1
  175. package/umd/modules/@postnord/web-components/postnord-web-components/p-aa15469e.entry.js +0 -5
  176. package/umd/modules/@postnord/web-components/postnord-web-components/p-b72f9866.entry.js +0 -5
  177. package/umd/modules/@postnord/web-components/postnord-web-components/p-d71054df.entry.js +0 -5
@@ -2,4 +2,4 @@
2
2
  * Built with Stencil
3
3
  * By PostNord.
4
4
  */
5
- import{transformTag as e,proxyCustomElement as i,HTMLElement as n,createEvent as t,h as a,Host as s}from"@stencil/core/internal/client";import{u as l,k as r,e as o}from"./helpers.js";import{d as c}from"./pn-button2.js";import{d}from"./pn-icon2.js";import{d as h}from"./pn-spinner2.js";const p='<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 11.442A7.44 7.44 0 0 1 11.44 4c6.24 0 9.617 7.154 5.923 11.949l2.844 2.844a1 1 0 0 1-1.414 1.414l-2.837-2.837C11.21 21.045 4 17.73 4 11.441m11.277 3.867C11.846 18.714 6 16.284 6 11.442A5.44 5.44 0 0 1 11.44 6c4.724 0 7.204 5.605 4.026 9.1z" clip-rule="evenodd"/></svg>',f={SEARCH:{en:"Search",sv:"Sök",da:"Søg",fi:"Hae",no:"Søk"},CLEAR:{en:"Clear search field",sv:"Rensa sökfältet",da:"Ryd søgefeltet",fi:"Tyhjennä hakukenttä",no:"Tøm søkefeltet"}},u=i(class extends n{constructor(e){super(),!1!==e&&this.__registerHost(),this.search=t(this,"search",7),this.update=t(this,"update",7)}id=`pn-search-field-${l()}`;get hostElement(){return this}label;language=void 0;value="";name;placeholder;autocomplete;list;required=!1;disabled=!1;loading=!1;button="";buttonLabel;buttonTooltip;buttonLight=!1;pnId;pnAriaLabelledby;searchid;search;update;inputHandler(){this.update.emit(this.value)}async componentWillLoad(){void 0===this.language&&await r(this.hostElement)}getId(){return this.pnId||this.searchid||this.id}translate(e){return f?.[e]?.[this.language||o]}emitSearch({click:e,button:i}){("click"===e?.type||"keydown"===i?.type&&"Enter"===i?.key)&&((e||i).preventDefault(),this.search.emit(this.value))}setVal(e){this.value=e.target.value}clearInput(){this.value="",this.update.emit(this.value),this.hostElement.querySelector("input").focus()}displayLabel(){return!!this.label}getAriaLabelledby(){return this.displayLabel()?null:this.pnAriaLabelledby}getButtonLabel(){return this.buttonLabel||this.translate("SEARCH")}searchSimple(){return"icon"===this.button||"simple"===this.button}searchAuto(){return"icon-inline"===this.button||"none"===this.button||"auto"===this.button}searchJumbo(){return"jumbo"===this.button}searchButtonAppearance(){return this.searchSimple()?"light":null}searchButtonVariant(){return this.searchSimple()?"outlined":null}render(){return a(s,{key:"5ffa0c58cd54c1a6588147e5ec9a72e0045e16aa"},a("div",{key:"d18a2bdaef46229ff87fe1612d39489443fd70cc",class:"pn-search-field","data-inline":this.searchAuto(),"data-loading":this.loading,"data-searching":!!this.value,"data-jumbo":this.searchJumbo()},a("div",{key:"1a7c9e872e0c7696f0d1d84a3420eade2b1cd2ed",class:"pn-search-field-container"},a("input",{key:"3ff3e9809123283f66ea933f7bc9fb5a92489e51",class:"pn-search-field-input",id:this.getId(),type:"search",value:this.value,name:this.name,placeholder:this.placeholder,autocomplete:this.autocomplete,list:this.list,required:this.required,disabled:this.disabled,"aria-label":this.label,"aria-labelledby":this.getAriaLabelledby(),onKeyDown:e=>this.emitSearch({button:e}),onInput:e=>this.setVal(e)}),a("div",{key:"eeb6d382c93f98da5561b30219ef829c668eab54",class:"pn-search-field-inline"},this.searchAuto()&&a("pn-button",{key:"65d7049753656a7f4bce29e7e8c99305e99f15e2",class:"pn-search-field-button",type:"button",appearance:"light",small:!0,icon:p,iconOnly:!0,arialabel:this.getButtonLabel(),noTab:this.loading,onPnClick:e=>this.emitSearch({click:e.detail})}),!this.disabled&&a("pn-button",{key:"58bae5e2fc05c66cee21081e71904530ca75a0b9",small:!0,class:"pn-search-field-clear",type:"button",appearance:"light",icon:'<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="M6.293 6.293a1 1 0 0 1 1.414 0L12 10.586l4.293-4.293a1 1 0 1 1 1.414 1.414L13.414 12l4.293 4.293a1 1 0 0 1-1.414 1.414L12 13.414l-4.293 4.293a1 1 0 0 1-1.414-1.414L10.586 12 6.293 7.707a1 1 0 0 1 0-1.414" clip-rule="evenodd"/></svg>',iconOnly:!0,arialabel:this.translate("CLEAR"),noTab:!this.value||this.loading,onPnClick:()=>this.clearInput()}),this.searchAuto()&&a("pn-spinner",{key:"d3955278766f786897eb0024c7523179a2ad78c4",class:"pn-search-field-spinner"}))),!this.searchAuto()&&a("pn-button",{key:"fd46d299cfd9600e671e827daa4a00675a6bd25b",class:"pn-search-field-submit",label:this.getButtonLabel(),tooltip:this.buttonTooltip,appearance:this.searchButtonAppearance(),variant:this.searchButtonVariant(),icon:p,iconOnly:this.searchSimple()||this.searchJumbo(),arialabel:this.searchSimple()||this.searchJumbo()?this.getButtonLabel():null,loading:this.loading,onPnClick:e=>this.emitSearch({click:e.detail})})))}static get style(){return`${e("pn-search-field")}{display:inline-block}${e("pn-search-field")} .pn-search-field{display:flex;gap:0.5em}${e("pn-search-field")} .pn-search-field-container{width:100%;flex:1 1 100%;position:relative}${e("pn-search-field")} .pn-search-field-input{min-height:3em;height:100%;width:100%;color:#2d2013;background-color:#ffffff;border:0.0625em solid #969087;border-radius:3em;padding:0.75em;font-family:inherit;font-size:1em;font-weight:500;line-height:1.5em;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}${e("pn-search-field")} .pn-search-field-input:-webkit-autofill,${e("pn-search-field")} .pn-search-field-input:-webkit-autofill:hover,${e("pn-search-field")} .pn-search-field-input:-webkit-autofill:focus,${e("pn-search-field")} .pn-search-field-input:-webkit-autofill:active{-webkit-box-shadow:0 0 0 10em #e0f8ff inset;-webkit-text-fill-color:#2d2013}${e("pn-search-field")} .pn-search-field-input{outline:0.2rem solid transparent;outline-offset:0.2rem}${e("pn-search-field")} .pn-search-field-input:focus-visible{outline-color:#005d92;background-color:#ffffff;border-color:#005d92}${e("pn-search-field")} .pn-search-field-input{transition-property:outline-color, background-color, border-color, color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-search-field")} .pn-search-field-input{transition-duration:0s;transition-delay:0s}}${e("pn-search-field")} .pn-search-field-input::placeholder{color:#5e554a;font-weight:normal}${e("pn-search-field")} .pn-search-field-input:hover{border-color:#005d92}${e("pn-search-field")} .pn-search-field-input:disabled{color:#5e554a;background-color:#f3f2f2;border-color:#f3f2f2}${e("pn-search-field")} .pn-search-field-input::-webkit-calendar-picker-indicator,${e("pn-search-field")} .pn-search-field-input::-webkit-search-cancel-button,${e("pn-search-field")} .pn-search-field-input::-webkit-search-decoration{display:none !important}${e("pn-search-field")} .pn-search-field-inline{pointer-events:none;position:absolute;top:0;right:0;background:transparent;width:3em;height:100%;overflow:hidden;display:flex;align-items:center;justify-content:center}${e("pn-search-field")} .pn-search-field-inline ${e("pn-button")}{position:absolute;left:50%;top:50%;transition-property:transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-search-field")} .pn-search-field-inline ${e("pn-button")}{transition-duration:0s;transition-delay:0s}}${e("pn-search-field")} .pn-search-field-inline ${e("pn-button")}{transition-delay:0.2s;transform:translate(100%, -50%)}${e("pn-search-field")} .pn-search-field-submit{white-space:nowrap}${e("pn-search-field")} .pn-search-field-spinner{position:absolute;left:50%;top:50%;transition:transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;transform:translate(100%, -50%)}${e("pn-search-field")} .pn-search-field[data-inline] .pn-search-field-inline{pointer-events:unset}${e("pn-search-field")} .pn-search-field[data-inline] .pn-search-field-button{transform:translate(-50%, -50%)}${e("pn-search-field")} .pn-search-field[data-inline][data-loading] ${e("pn-button")}{transform:translate(100%, -50%)}${e("pn-search-field")} .pn-search-field[data-inline][data-loading] .pn-search-field-spinner{transform:translate(-50%, -50%)}${e("pn-search-field")} .pn-search-field[data-inline][data-searching] .pn-search-field-button{transform:translate(150%, -50%)}${e("pn-search-field")} .pn-search-field[data-jumbo] .pn-search-field-input{min-height:4em;padding-left:1.25em}${e("pn-search-field")} .pn-search-field[data-jumbo] .pn-search-field-submit .pn-button[data-icon-only]{width:4em;height:4em}${e("pn-search-field")} .pn-search-field[data-jumbo] .pn-search-field-submit .pn-button[data-icon-only][data-loading] .pn-button-bg{width:4em;height:4em}${e("pn-search-field")} .pn-search-field[data-searching] .pn-search-field-inline{pointer-events:unset}${e("pn-search-field")} .pn-search-field[data-searching] .pn-search-field-clear{transform:translate(-50%, -50%)}`}},[512,"pn-search-field",{label:[1],language:[1],value:[1025],name:[1],placeholder:[1],autocomplete:[1],list:[1],required:[4],disabled:[4],loading:[4],button:[1],buttonLabel:[1,"button-label"],buttonTooltip:[1,"button-tooltip"],buttonLight:[4,"button-light"],pnId:[1,"pn-id"],pnAriaLabelledby:[1,"pn-aria-labelledby"],searchid:[1]},[[0,"input","inputHandler"]]]);function b(){"undefined"!=typeof customElements&&["pn-search-field","pn-button","pn-icon","pn-spinner"].forEach((i=>{switch(i){case"pn-search-field":customElements.get(e(e(i)))||customElements.define(e(e(i)),u);break;case"pn-button":customElements.get(e(e(i)))||c();break;case"pn-icon":customElements.get(e(e(i)))||d();break;case"pn-spinner":customElements.get(e(e(i)))||h()}}))}export{u as P,b as d}
5
+ import{transformTag as e,proxyCustomElement as i,HTMLElement as n,createEvent as t,h as a,Host as s}from"@stencil/core/internal/client";import{u as l,k as r,e as o}from"./helpers.js";import{c}from"./close_small.js";import{d}from"./pn-button2.js";import{d as h}from"./pn-icon2.js";import{d as p}from"./pn-spinner2.js";const f='<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 11.442A7.44 7.44 0 0 1 11.44 4c6.24 0 9.617 7.154 5.923 11.949l2.844 2.844a1 1 0 0 1-1.414 1.414l-2.837-2.837C11.21 21.045 4 17.73 4 11.441m11.277 3.867C11.846 18.714 6 16.284 6 11.442A5.44 5.44 0 0 1 11.44 6c4.724 0 7.204 5.605 4.026 9.1z" clip-rule="evenodd"/></svg>',u={SEARCH:{en:"Search",sv:"Sök",da:"Søg",fi:"Hae",no:"Søk"},CLEAR:{en:"Clear search field",sv:"Rensa sökfältet",da:"Ryd søgefeltet",fi:"Tyhjennä hakukenttä",no:"Tøm søkefeltet"}},b=i(class extends n{constructor(e){super(),!1!==e&&this.__registerHost(),this.search=t(this,"search",7),this.update=t(this,"update",7)}id=`pn-search-field-${l()}`;get hostElement(){return this}label;language=void 0;value="";name;placeholder;autocomplete;list;required=!1;disabled=!1;loading=!1;button="";buttonLabel;buttonTooltip;buttonLight=!1;pnId;pnAriaLabelledby;searchid;search;update;inputHandler(){this.update.emit(this.value)}async componentWillLoad(){void 0===this.language&&await r(this.hostElement)}getId(){return this.pnId||this.searchid||this.id}translate(e){return u?.[e]?.[this.language||o]}emitSearch({click:e,button:i}){("click"===e?.type||"keydown"===i?.type&&"Enter"===i?.key)&&((e||i).preventDefault(),this.search.emit(this.value))}setVal(e){this.value=e.target.value}clearInput(){this.value="",this.update.emit(this.value),this.hostElement.querySelector("input").focus()}displayLabel(){return!!this.label}getAriaLabelledby(){return this.displayLabel()?null:this.pnAriaLabelledby}getButtonLabel(){return this.buttonLabel||this.translate("SEARCH")}searchSimple(){return"icon"===this.button||"simple"===this.button}searchAuto(){return"icon-inline"===this.button||"none"===this.button||"auto"===this.button}searchJumbo(){return"jumbo"===this.button}searchButtonAppearance(){return this.searchSimple()?"light":null}searchButtonVariant(){return this.searchSimple()?"outlined":null}render(){return a(s,{key:"aa01f135ec98eed061d33617a5d21fb75407a917"},a("div",{key:"17161eac733e7f46c26524baf0508292b1575712",class:"pn-search-field","data-inline":this.searchAuto(),"data-loading":this.loading,"data-searching":!!this.value,"data-jumbo":this.searchJumbo()},a("div",{key:"12a771d29c021a6c83fe9aa152f8367c7f20f2e3",class:"pn-search-field-container"},a("input",{key:"b5ce3770f1ef6d53ee904ef40894eb91c76c96b4",class:"pn-search-field-input",id:this.getId(),type:"search",value:this.value,name:this.name,placeholder:this.placeholder,autocomplete:this.autocomplete,list:this.list,required:this.required,disabled:this.disabled,"aria-label":this.label,"aria-labelledby":this.getAriaLabelledby(),onKeyDown:e=>this.emitSearch({button:e}),onInput:e=>this.setVal(e)}),a("div",{key:"f1922be073a70bbf54f67b7adc793c240b212769",class:"pn-search-field-inline"},this.searchAuto()&&a("pn-button",{key:"497b71cf5c3a1403789a4746b92da1b6f72f6341",class:"pn-search-field-button",type:"button",appearance:"light",small:!0,icon:f,iconOnly:!0,arialabel:this.getButtonLabel(),noTab:this.loading,onPnClick:e=>this.emitSearch({click:e.detail})}),!this.disabled&&a("pn-button",{key:"d1591b1d364e9da38129099a7f2841282c0d224e",small:!0,class:"pn-search-field-clear",type:"button",appearance:"light",icon:c,iconOnly:!0,arialabel:this.translate("CLEAR"),noTab:!this.value||this.loading,onPnClick:()=>this.clearInput()}),this.searchAuto()&&a("pn-spinner",{key:"205a3761b7637381f9ea50c4e28c6734f27558f3",class:"pn-search-field-spinner"}))),!this.searchAuto()&&a("pn-button",{key:"0b41069b9d9554c196e32289e82192137cd8059e",class:"pn-search-field-submit",label:this.getButtonLabel(),tooltip:this.buttonTooltip,appearance:this.searchButtonAppearance(),variant:this.searchButtonVariant(),icon:f,iconOnly:this.searchSimple()||this.searchJumbo(),arialabel:this.searchSimple()||this.searchJumbo()?this.getButtonLabel():null,loading:this.loading,onPnClick:e=>this.emitSearch({click:e.detail})})))}static get style(){return`${e("pn-search-field")}{display:inline-block}${e("pn-search-field")} .pn-search-field{display:flex;gap:0.5em}${e("pn-search-field")} .pn-search-field-container{width:100%;flex:1 1 100%;position:relative}${e("pn-search-field")} .pn-search-field-input{min-height:3em;height:100%;width:100%;color:#2d2013;background-color:#ffffff;border:0.0625em solid #969087;border-radius:3em;padding:0.75em;font-family:inherit;font-size:1em;font-weight:500;line-height:1.5em;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}${e("pn-search-field")} .pn-search-field-input:-webkit-autofill,${e("pn-search-field")} .pn-search-field-input:-webkit-autofill:hover,${e("pn-search-field")} .pn-search-field-input:-webkit-autofill:focus,${e("pn-search-field")} .pn-search-field-input:-webkit-autofill:active{-webkit-box-shadow:0 0 0 10em #e0f8ff inset;-webkit-text-fill-color:#2d2013}${e("pn-search-field")} .pn-search-field-input{outline:0.2rem solid transparent;outline-offset:0.2rem}${e("pn-search-field")} .pn-search-field-input:focus-visible{outline-color:#005d92;background-color:#ffffff;border-color:#005d92}${e("pn-search-field")} .pn-search-field-input{transition-property:outline-color, background-color, border-color, color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-search-field")} .pn-search-field-input{transition-duration:0s;transition-delay:0s}}${e("pn-search-field")} .pn-search-field-input::placeholder{color:#5e554a;font-weight:normal}${e("pn-search-field")} .pn-search-field-input:hover{border-color:#005d92}${e("pn-search-field")} .pn-search-field-input:disabled{color:#5e554a;background-color:#f3f2f2;border-color:#f3f2f2}${e("pn-search-field")} .pn-search-field-input::-webkit-calendar-picker-indicator,${e("pn-search-field")} .pn-search-field-input::-webkit-search-cancel-button,${e("pn-search-field")} .pn-search-field-input::-webkit-search-decoration{display:none !important}${e("pn-search-field")} .pn-search-field-inline{pointer-events:none;position:absolute;top:0;right:0;background:transparent;width:3em;height:100%;overflow:hidden;display:flex;align-items:center;justify-content:center}${e("pn-search-field")} .pn-search-field-inline ${e("pn-button")}{position:absolute;left:50%;top:50%;transition-property:transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-search-field")} .pn-search-field-inline ${e("pn-button")}{transition-duration:0s;transition-delay:0s}}${e("pn-search-field")} .pn-search-field-inline ${e("pn-button")}{transition-delay:0.2s;transform:translate(100%, -50%)}${e("pn-search-field")} .pn-search-field-submit{white-space:nowrap}${e("pn-search-field")} .pn-search-field-spinner{position:absolute;left:50%;top:50%;transition:transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;transform:translate(100%, -50%)}${e("pn-search-field")} .pn-search-field[data-inline] .pn-search-field-inline{pointer-events:unset}${e("pn-search-field")} .pn-search-field[data-inline] .pn-search-field-button{transform:translate(-50%, -50%)}${e("pn-search-field")} .pn-search-field[data-inline][data-loading] ${e("pn-button")}{transform:translate(100%, -50%)}${e("pn-search-field")} .pn-search-field[data-inline][data-loading] .pn-search-field-spinner{transform:translate(-50%, -50%)}${e("pn-search-field")} .pn-search-field[data-inline][data-searching] .pn-search-field-button{transform:translate(150%, -50%)}${e("pn-search-field")} .pn-search-field[data-jumbo] .pn-search-field-input{min-height:4em;padding-left:1.25em}${e("pn-search-field")} .pn-search-field[data-jumbo] .pn-search-field-submit .pn-button[data-icon-only]{width:4em;height:4em}${e("pn-search-field")} .pn-search-field[data-jumbo] .pn-search-field-submit .pn-button[data-icon-only][data-loading] .pn-button-bg{width:4em;height:4em}${e("pn-search-field")} .pn-search-field[data-searching] .pn-search-field-inline{pointer-events:unset}${e("pn-search-field")} .pn-search-field[data-searching] .pn-search-field-clear{transform:translate(-50%, -50%)}`}},[512,"pn-search-field",{label:[1],language:[1],value:[1025],name:[1],placeholder:[1],autocomplete:[1],list:[1],required:[4],disabled:[4],loading:[4],button:[1],buttonLabel:[1,"button-label"],buttonTooltip:[1,"button-tooltip"],buttonLight:[4,"button-light"],pnId:[1,"pn-id"],pnAriaLabelledby:[1,"pn-aria-labelledby"],searchid:[1]},[[0,"input","inputHandler"]]]);function m(){"undefined"!=typeof customElements&&["pn-search-field","pn-button","pn-icon","pn-spinner"].forEach((i=>{switch(i){case"pn-search-field":customElements.get(e(e(i)))||customElements.define(e(e(i)),b);break;case"pn-button":customElements.get(e(e(i)))||d();break;case"pn-icon":customElements.get(e(e(i)))||h();break;case"pn-spinner":customElements.get(e(e(i)))||p()}}))}export{b as P,m as d}
@@ -2,4 +2,4 @@
2
2
  * Built with Stencil
3
3
  * By PostNord.
4
4
  */
5
- import{transformTag as e,proxyCustomElement as t,HTMLElement as n,createEvent as s,h as i,Host as a}from"@stencil/core/internal/client";import{u as l}from"./helpers.js";import{d as o}from"./pn-icon2.js";const c=t(class extends n{constructor(e){super(),!1!==e&&this.__registerHost(),this.segmentHover=s(this,"segmentHover",7)}id="pn-segment-"+l();get hostElement(){return this}label;value;name;disabled=!1;selected=!1;icon;pnId;segmentid;segmentHover;handleHover(e){this.segmentHover.emit(e)}getId(){return this.pnId||this.segmentid||this.id}render(){return i(a,{key:"c1ca80ac494bc4b75dea79723d12650d18c47e98",onMouseEnter:e=>this.handleHover(e)},i("input",{key:"c3bdb057f6ecb46a0a343da3c54331375a6c0e35",class:"pn-segment",id:this.getId(),name:this.name,checked:this.selected,type:"radio",value:this.value,disabled:this.disabled}),i("label",{key:"06f7c91d9440c867a98642246a7ef9c958f2eb1b",htmlFor:this.getId(),class:"pn-segment-label"},this.icon&&i("pn-icon",{key:"caf831966dd81f60ac72f2c3a18ca1afd085d07c",icon:this.icon,color:"blue700"}),i("span",{key:"0d14699fcadef37bcb33d43464db9e5217d0d202",class:"pn-segment-text"},this.label,i("slot",{key:"7e7398bba9a088764e844dc7856aec2ec325161b"}))))}static get style(){return`${e("pn-segment")}{position:relative;color:#005d92;margin-right:0.5em;z-index:2;white-space:nowrap;scroll-snap-align:center;outline:none;-webkit-tap-highlight-color:transparent;transform:translateZ(0)}${e("pn-segment")}:last-of-type{margin-right:0}${e("pn-segment")} .pn-segment{cursor:pointer;margin:0;padding:0;opacity:0;position:absolute;top:0;left:0;width:100%;height:100%;-webkit-tap-highlight-color:transparent}${e("pn-segment")} .pn-segment:disabled{cursor:not-allowed}${e("pn-segment")} .pn-segment:disabled~.pn-segment-label{color:#5e554a}${e("pn-segment")} .pn-segment:disabled~.pn-segment-label ${e("pn-icon")} .pn-icon-svg path{fill:#5e554a}${e("pn-segment")} .pn-segment-label{height:100%;width:100%;padding:0.5em;border-radius:3em;font-weight:500;border:0.0625em solid transparent;display:inline-flex;gap:0.5em;align-items:center;-webkit-tap-highlight-color:transparent}`}},[772,"pn-segment",{label:[1],value:[1],name:[1],disabled:[4],selected:[4],icon:[1],pnId:[1,"pn-id"],segmentid:[1]}]),r=c,d=function(){"undefined"!=typeof customElements&&["pn-segment","pn-icon"].forEach((t=>{switch(t){case"pn-segment":customElements.get(e(e(t)))||customElements.define(e(e(t)),c);break;case"pn-icon":customElements.get(e(e(t)))||o()}}))};export{r as PnSegment,d as defineCustomElement}
5
+ import{transformTag as e,proxyCustomElement as t,HTMLElement as n,createEvent as s,h as i,Host as a}from"@stencil/core/internal/client";import{u as l}from"./helpers.js";import{d as o}from"./pn-icon2.js";const r=t(class extends n{constructor(e){super(),!1!==e&&this.__registerHost(),this.segmentHover=s(this,"segmentHover",7)}id="pn-segment-"+l();get hostElement(){return this}label;value;name;disabled=!1;selected=!1;icon;pnId;segmentid;segmentHover;handleHover(e){this.segmentHover.emit(e)}getId(){return this.pnId||this.segmentid||this.id}render(){return i(a,{key:"035a10616c69c6c25f0edcff2a31532138684e99",onMouseEnter:e=>this.handleHover(e)},i("input",{key:"d256c8e01319f349339beafe2257ff2b2ebfbf08",class:"pn-segment",id:this.getId(),name:this.name,checked:this.selected,type:"radio",value:this.value,disabled:this.disabled}),i("label",{key:"1bd57da75f8c9de454777d4bdcc22f23703c9d7e",htmlFor:this.getId(),class:"pn-segment-label"},this.icon&&i("pn-icon",{key:"f5c399f939fcad384b18c1de782fa542f3cf0ee9",icon:this.icon,color:"blue700"}),i("span",{key:"e0484e6a5357c24a2fa61bdb63245703a8db9cda",class:"pn-segment-text"},this.label,i("slot",{key:"1c2e2d941fefd272ea58fdcd0b98c0909eccfd5f"}))))}static get style(){return`${e("pn-segment")}{position:relative;color:#005d92;margin-right:0.5em;z-index:2;white-space:nowrap;scroll-snap-align:center;outline:none;-webkit-tap-highlight-color:transparent;transform:translateZ(0)}${e("pn-segment")}:last-of-type{margin-right:0}${e("pn-segment")} .pn-segment{cursor:pointer;margin:0;padding:0;opacity:0;position:absolute;top:0;left:0;width:100%;height:100%;-webkit-tap-highlight-color:transparent}${e("pn-segment")} .pn-segment:disabled{cursor:not-allowed}${e("pn-segment")} .pn-segment:disabled~.pn-segment-label{color:#5e554a}${e("pn-segment")} .pn-segment:disabled~.pn-segment-label ${e("pn-icon")} .pn-icon-svg path{fill:#5e554a}${e("pn-segment")} .pn-segment-label{height:100%;width:100%;padding:0.5em;border-radius:3em;font-weight:500;border:0.0625em solid transparent;display:inline-flex;gap:0.5em;align-items:center;-webkit-tap-highlight-color:transparent}`}},[772,"pn-segment",{label:[1],value:[1],name:[1],disabled:[4],selected:[4],icon:[1],pnId:[1,"pn-id"],segmentid:[1]}]),c=r,d=function(){"undefined"!=typeof customElements&&["pn-segment","pn-icon"].forEach((t=>{switch(t){case"pn-segment":customElements.get(e(e(t)))||customElements.define(e(e(t)),r);break;case"pn-icon":customElements.get(e(e(t)))||o()}}))};export{c as PnSegment,d as defineCustomElement}
@@ -2,4 +2,4 @@
2
2
  * Built with Stencil
3
3
  * By PostNord.
4
4
  */
5
- import{transformTag as e,proxyCustomElement as t,HTMLElement as n,forceUpdate as r,h as o,Host as s}from"@stencil/core/internal/client";import{a as i}from"./arrow_left.js";import{a}from"./arrow_right.js";import{d as c}from"./pn-icon2.js";const d=t(class extends n{constructor(e){super(),!1!==e&&this.__registerHost()}mo;segmentContainer;segments=[];activeBg;hoverBg;scrollRegistered=!1;get hostElement(){return this}showScrollArrows=!1;showLeftArrow=!1;showRightArrow=!1;name;value;valueHandler(){this.setActiveSegment()}changeHandler(e){this.value=e.target.value,this.setActiveSegment()}handleResize(){this.rerender()}handleHover(e){const{target:t}=e.detail;this.calcHighlight(t,!0)}connectedCallback(){this.mo=new MutationObserver((()=>{r(this.hostElement),this.setSegments()})),this.mo.observe(this.hostElement,{childList:!0,subtree:!0})}disconnectedCallback(){this.mo&&this.mo.disconnect()}componentDidLoad(){this.setSegments()}setSegments(){const t=e("pn-segment"),n=this.hostElement.querySelectorAll(t);this.segments=Array.from(n),this.setActiveSegment()}setActiveSegment(){this.segments.forEach((e=>{this.value===e.value?e.setAttribute("selected","true"):e.removeAttribute("selected")})),this.rerender()}rerender(){requestAnimationFrame((()=>{this.calcHighlight(),this.scrollArrowRender()}))}calcHighlight(t,n){const r=n?this.hoverBg:this.activeBg;requestAnimationFrame((()=>{const n=t||this.segments.find((({value:e})=>e===this.value)),o=e("pn-segment"),s=n?.closest(o);if(!s)return;const i=s.getBoundingClientRect(),{left:a}=this.segmentContainer.getBoundingClientRect(),{left:c,height:d,width:l}=i;r.style.setProperty("transform",`translate(${c-a+this.segmentContainer.scrollLeft}px, -50%`),r.style.setProperty("width",l+"px"),r.style.setProperty("height",d+"px"),n.disabled?r.dataset.disabled="":delete r.dataset.disabled}))}scrollArrowRender(){if(this.segmentContainer.scrollWidth>this.segmentContainer.clientWidth){this.showScrollArrows=!0,this.scrollRegistered||(this.segmentContainer.addEventListener("scroll",this.scrollArrowRender.bind(this)),this.scrollRegistered=!0);const e=Math.round(this.segmentContainer.scrollWidth-this.segmentContainer.scrollLeft)-this.segmentContainer.clientWidth;this.showLeftArrow=this.segmentContainer.scrollLeft>0,this.showRightArrow=e>0}else this.showLeftArrow=!1,this.showRightArrow=!1,this.showScrollArrows=!1}scroll(e){this.segmentContainer.scroll({left:this.segmentContainer.scrollLeft+e,behavior:"smooth"})}render(){return o(s,{key:"e50018a767b5280ce0144544f3fb213b8f025944"},o("div",{key:"8f9f4beedc7b07d2431fde84456a96d501bdbf15",class:"pn-segmented-control",ref:e=>this.segmentContainer=e},o("slot",{key:"1caffca6e2cd27adcb2c5bfa5b45f52043c85829"}),o("div",{key:"3ef184c6e26f194aa3b5e3ef284313f73aa03a6e",class:"pn-sc-bg","data-active":!0,ref:e=>this.activeBg=e}),o("div",{key:"90c56a3f631557e062f70b4ef98231eafc1f46d7",class:"pn-sc-bg","data-hover":!0,ref:e=>this.hoverBg=e})),o("div",{key:"371d10511a314e69613a195858dba3073f7ca920",class:"pn-sc-arrows","data-left":this.showLeftArrow,"data-right":this.showRightArrow,hidden:!this.showScrollArrows},o("button",{key:"e698d859b989e8fde8864185d3fdce81584280da","aria-label":"Left",class:"pn-sc-arrow pn-sc-arrow-left",onClick:()=>this.scroll(-120),tabindex:"-1"},o("pn-icon",{key:"e82f3b0257bd48dc281a6c113cecbd0cb551fd53",icon:i})),o("button",{key:"8eba509c3c48304c372d543e51edecaaf41cf564","aria-label":"Right",class:"pn-sc-arrow pn-sc-arrow-right",onClick:()=>this.scroll(120),tabindex:"-1"},o("pn-icon",{key:"0ed1d7cd2b88a619f21e2ee8075c864f9bdcf561",icon:a}))))}static get watchers(){return{value:[{valueHandler:0}]}}static get style(){return`${e("pn-segmented-control")}{position:relative;display:inline-block;max-width:100%;overflow:hidden;border-radius:3em;transform:translateZ(0);transition-property:outline-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-segmented-control")}{transition-duration:0s;transition-delay:0s}}${e("pn-segmented-control")}{outline:0.2rem solid transparent;outline-offset:0.2rem}${e("pn-segmented-control")}:focus-within,${e("pn-segmented-control")}:active{outline-color:#005d92}${e("pn-segmented-control")} .pn-segmented-control{display:flex;align-items:center;border-radius:3em;min-height:3em;padding:0.25em;background:#f3f2f2;position:relative;overflow-x:auto;scroll-snap-type:x mandatory}${e("pn-segmented-control")} .pn-segmented-control:hover .pn-sc-bg[data-hover]{opacity:1}${e("pn-segmented-control")} .pn-segmented-control::-webkit-scrollbar{display:none}${e("pn-segmented-control")} .pn-segmented-control .pn-sc-bg{position:absolute;top:50%;transform:translateY(-50%);will-change:transform;left:0;border-radius:inherit;transition-property:width, transform, background-color, opacity, box-shadow;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-segmented-control")} .pn-segmented-control .pn-sc-bg{transition-duration:0s;transition-delay:0s}}${e("pn-segmented-control")} .pn-segmented-control .pn-sc-bg[data-active]{box-shadow:0px 0.3px 0.9px rgba(0, 0, 0, 0.1), 0px 1.6px 3.6px rgba(0, 0, 0, 0.13);border:0.0625em solid #005d92;background-color:#ffffff;z-index:1}${e("pn-segmented-control")} .pn-segmented-control .pn-sc-bg[data-hover]{background-color:#e0f8ff;opacity:0;border:0.25em solid transparent;z-index:0}${e("pn-segmented-control")} .pn-segmented-control .pn-sc-bg[data-hover][data-disabled]{border-color:#e9e6e5;background-color:#e9e6e5}${e("pn-segmented-control")} .pn-segmented-control .pn-sc-bg[data-disabled]{border-color:#e9e6e5;background-color:#e9e6e5}${e("pn-segmented-control")} .pn-sc-arrows{position:absolute;top:50%;transform:translateY(-50%);left:0;height:100%;width:100%;z-index:3;display:flex;justify-content:space-between;align-items:center;pointer-events:none}${e("pn-segmented-control")} .pn-sc-arrows svg{width:1.5em}${e("pn-segmented-control")} .pn-sc-arrows svg.pn-icon-svg path{fill:#005d92}${e("pn-segmented-control")} .pn-sc-arrows>.pn-sc-arrow{cursor:pointer;pointer-events:all;width:2.5em;height:2.5em;background:#ffffff;border:none;outline:none;display:flex;align-items:center;justify-content:center;opacity:0;will-change:transform;-webkit-tap-highlight-color:transparent;transition-property:transform, opacity, background-color, box-shadow;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-segmented-control")} .pn-sc-arrows>.pn-sc-arrow{transition-duration:0s;transition-delay:0s}}${e("pn-segmented-control")} .pn-sc-arrows>.pn-sc-arrow.pn-sc-arrow-left{transform:translateX(-100%);border-radius:0 50% 50% 0;padding:0 0.3em 0 0;box-shadow:0.2rem 0.3rem 0.2rem rgba(0, 0, 0, 0.4)}${e("pn-segmented-control")} .pn-sc-arrows>.pn-sc-arrow.pn-sc-arrow-right{transform:translateX(100%);border-radius:50% 0 0 50%;box-shadow:-0.2rem 0.3rem 0.2rem rgba(0, 0, 0, 0.4)}${e("pn-segmented-control")} .pn-sc-arrows[data-left] .pn-sc-arrow-left,${e("pn-segmented-control")} .pn-sc-arrows[data-right] .pn-sc-arrow-right{opacity:1;transform:translateX(0)}`}},[772,"pn-segmented-control",{name:[1],value:[1537],showScrollArrows:[32],showLeftArrow:[32],showRightArrow:[32]},[[0,"change","changeHandler"],[9,"resize","handleResize"],[0,"segmentHover","handleHover"]],{value:[{valueHandler:0}]}]),l=d,p=function(){"undefined"!=typeof customElements&&["pn-segmented-control","pn-icon"].forEach((t=>{switch(t){case"pn-segmented-control":customElements.get(e(e(t)))||customElements.define(e(e(t)),d);break;case"pn-icon":customElements.get(e(e(t)))||c()}}))};export{l as PnSegmentedControl,p as defineCustomElement}
5
+ import{transformTag as e,proxyCustomElement as t,HTMLElement as n,forceUpdate as r,h as o,Host as s}from"@stencil/core/internal/client";import{a}from"./arrow_left.js";import{a as i}from"./arrow_right.js";import{d as c}from"./pn-icon2.js";const d=t(class extends n{constructor(e){super(),!1!==e&&this.__registerHost()}mo;segmentContainer;segments=[];activeBg;hoverBg;scrollRegistered=!1;get hostElement(){return this}showScrollArrows=!1;showLeftArrow=!1;showRightArrow=!1;name;value;valueHandler(){this.setActiveSegment()}changeHandler(e){this.value=e.target.value,this.setActiveSegment()}handleResize(){this.rerender()}handleHover(e){const{target:t}=e.detail;this.calcHighlight(t,!0)}connectedCallback(){this.mo=new MutationObserver((()=>{r(this.hostElement),this.setSegments()})),this.mo.observe(this.hostElement,{childList:!0,subtree:!0})}disconnectedCallback(){this.mo&&this.mo.disconnect()}componentDidLoad(){this.setSegments()}setSegments(){const t=e("pn-segment"),n=this.hostElement.querySelectorAll(t);this.segments=Array.from(n),this.setActiveSegment()}setActiveSegment(){this.segments.forEach((e=>{this.value===e.value?e.setAttribute("selected","true"):e.removeAttribute("selected")})),this.rerender()}rerender(){requestAnimationFrame((()=>{this.calcHighlight(),this.scrollArrowRender()}))}calcHighlight(t,n){const r=n?this.hoverBg:this.activeBg;requestAnimationFrame((()=>{const n=t||this.segments.find((({value:e})=>e===this.value)),o=e("pn-segment"),s=n?.closest(o);if(!s)return;const a=s.getBoundingClientRect(),{left:i}=this.segmentContainer.getBoundingClientRect(),{left:c,height:d,width:l}=a;r.style.setProperty("transform",`translate(${c-i+this.segmentContainer.scrollLeft}px, -50%`),r.style.setProperty("width",l+"px"),r.style.setProperty("height",d+"px"),n.disabled?r.dataset.disabled="":delete r.dataset.disabled}))}scrollArrowRender(){if(this.segmentContainer.scrollWidth>this.segmentContainer.clientWidth){this.showScrollArrows=!0,this.scrollRegistered||(this.segmentContainer.addEventListener("scroll",this.scrollArrowRender.bind(this)),this.scrollRegistered=!0);const e=Math.round(this.segmentContainer.scrollWidth-this.segmentContainer.scrollLeft)-this.segmentContainer.clientWidth;this.showLeftArrow=this.segmentContainer.scrollLeft>0,this.showRightArrow=e>0}else this.showLeftArrow=!1,this.showRightArrow=!1,this.showScrollArrows=!1}scroll(e){this.segmentContainer.scroll({left:this.segmentContainer.scrollLeft+e,behavior:"smooth"})}render(){return o(s,{key:"314c016bb1daea417c741babc236f8de14b9ab21"},o("div",{key:"10af3eb77723a2f99d6e665e6340caf9aaf03d27",class:"pn-segmented-control",ref:e=>this.segmentContainer=e},o("slot",{key:"516890ccb71a58628d1f527272424b295c8959ab"}),o("div",{key:"f0f162d91a3c14a93b60195492978f03b41a0ecf",class:"pn-sc-bg","data-active":!0,ref:e=>this.activeBg=e}),o("div",{key:"9ca1016209402986a1702db3f50f9d52d913d249",class:"pn-sc-bg","data-hover":!0,ref:e=>this.hoverBg=e})),o("div",{key:"61d56ebba096df1a0cfab0aea8aa52059c62d13e",class:"pn-sc-arrows","data-left":this.showLeftArrow,"data-right":this.showRightArrow,hidden:!this.showScrollArrows},o("button",{key:"1da8665af3d990175b92e50cf83e01adca082909","aria-label":"Left",class:"pn-sc-arrow pn-sc-arrow-left",onClick:()=>this.scroll(-120),tabindex:"-1"},o("pn-icon",{key:"3e78658670b082a938a5f976ea34b51449d669af",icon:a})),o("button",{key:"03fad3f5c772b282850098e31d8ea717f5efb054","aria-label":"Right",class:"pn-sc-arrow pn-sc-arrow-right",onClick:()=>this.scroll(120),tabindex:"-1"},o("pn-icon",{key:"659dfab232a3256a9819cdf4ec34445f9bbfa875",icon:i}))))}static get watchers(){return{value:[{valueHandler:0}]}}static get style(){return`${e("pn-segmented-control")}{position:relative;display:inline-block;max-width:100%;overflow:hidden;border-radius:3em;transform:translateZ(0);transition-property:outline-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-segmented-control")}{transition-duration:0s;transition-delay:0s}}${e("pn-segmented-control")}{outline:0.2rem solid transparent;outline-offset:0.2rem}${e("pn-segmented-control")}:focus-within,${e("pn-segmented-control")}:active{outline-color:#005d92}${e("pn-segmented-control")} .pn-segmented-control{display:flex;align-items:center;border-radius:3em;min-height:3em;padding:0.25em;background:#f3f2f2;position:relative;overflow-x:auto;scroll-snap-type:x mandatory}${e("pn-segmented-control")} .pn-segmented-control:hover .pn-sc-bg[data-hover]{opacity:1}${e("pn-segmented-control")} .pn-segmented-control::-webkit-scrollbar{display:none}${e("pn-segmented-control")} .pn-segmented-control .pn-sc-bg{position:absolute;top:50%;transform:translateY(-50%);will-change:transform;left:0;border-radius:inherit;transition-property:width, transform, background-color, opacity, box-shadow;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-segmented-control")} .pn-segmented-control .pn-sc-bg{transition-duration:0s;transition-delay:0s}}${e("pn-segmented-control")} .pn-segmented-control .pn-sc-bg[data-active]{box-shadow:0px 0.3px 0.9px rgba(0, 0, 0, 0.1), 0px 1.6px 3.6px rgba(0, 0, 0, 0.13);border:0.0625em solid #005d92;background-color:#ffffff;z-index:1}${e("pn-segmented-control")} .pn-segmented-control .pn-sc-bg[data-hover]{background-color:#e0f8ff;opacity:0;border:0.25em solid transparent;z-index:0}${e("pn-segmented-control")} .pn-segmented-control .pn-sc-bg[data-hover][data-disabled]{border-color:#e9e6e5;background-color:#e9e6e5}${e("pn-segmented-control")} .pn-segmented-control .pn-sc-bg[data-disabled]{border-color:#e9e6e5;background-color:#e9e6e5}${e("pn-segmented-control")} .pn-sc-arrows{position:absolute;top:50%;transform:translateY(-50%);left:0;height:100%;width:100%;z-index:3;display:flex;justify-content:space-between;align-items:center;pointer-events:none}${e("pn-segmented-control")} .pn-sc-arrows svg{width:1.5em}${e("pn-segmented-control")} .pn-sc-arrows svg.pn-icon-svg path{fill:#005d92}${e("pn-segmented-control")} .pn-sc-arrows>.pn-sc-arrow{cursor:pointer;pointer-events:all;width:2.5em;height:2.5em;background:#ffffff;border:none;outline:none;display:flex;align-items:center;justify-content:center;opacity:0;will-change:transform;-webkit-tap-highlight-color:transparent;transition-property:transform, opacity, background-color, box-shadow;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-segmented-control")} .pn-sc-arrows>.pn-sc-arrow{transition-duration:0s;transition-delay:0s}}${e("pn-segmented-control")} .pn-sc-arrows>.pn-sc-arrow.pn-sc-arrow-left{transform:translateX(-100%);border-radius:0 50% 50% 0;padding:0 0.3em 0 0;box-shadow:0.2rem 0.3rem 0.2rem rgba(0, 0, 0, 0.4)}${e("pn-segmented-control")} .pn-sc-arrows>.pn-sc-arrow.pn-sc-arrow-right{transform:translateX(100%);border-radius:50% 0 0 50%;box-shadow:-0.2rem 0.3rem 0.2rem rgba(0, 0, 0, 0.4)}${e("pn-segmented-control")} .pn-sc-arrows[data-left] .pn-sc-arrow-left,${e("pn-segmented-control")} .pn-sc-arrows[data-right] .pn-sc-arrow-right{opacity:1;transform:translateX(0)}`}},[772,"pn-segmented-control",{name:[1],value:[1537],showScrollArrows:[32],showLeftArrow:[32],showRightArrow:[32]},[[0,"change","changeHandler"],[9,"resize","handleResize"],[0,"segmentHover","handleHover"]],{value:[{valueHandler:0}]}]),l=d,p=function(){"undefined"!=typeof customElements&&["pn-segmented-control","pn-icon"].forEach((t=>{switch(t){case"pn-segmented-control":customElements.get(e(e(t)))||customElements.define(e(e(t)),d);break;case"pn-icon":customElements.get(e(e(t)))||c()}}))};export{l as PnSegmentedControl,p as defineCustomElement}
@@ -2,4 +2,4 @@
2
2
  * Built with Stencil
3
3
  * By PostNord.
4
4
  */
5
- import{transformTag as e,proxyCustomElement as t,HTMLElement as n,forceUpdate as l,h as s,Host as a}from"@stencil/core/internal/client";import{a as r}from"./alert_exclamation_circle.js";import{c}from"./chevron_down.js";import{u as i}from"./helpers.js";import{d as o}from"./pn-icon2.js";const p=t(class extends n{constructor(e){super(),!1!==e&&this.__registerHost()}id=`pn-select-${i()}`;idHelper=`${this.id}-text`;idError=`${this.id}-error`;mo;get hostElement(){return this}label;helpertext;name;form;autocomplete;required=!1;disabled=!1;compact=!1;icon;invalid=!1;error;pnId;pnAriaLabel;pnAriaLabelledby;selectId;handleId(){this.idHelper=`${this.getId()}-text`,this.idError=`${this.getId()}-error`}connectedCallback(){this.mo=new MutationObserver((()=>l(this.hostElement))),this.mo.observe(this.hostElement,{childList:!0,subtree:!0})}disconnectedCallback(){this.mo&&this.mo.disconnect()}hasHelperText(){return this.helpertext?.length>0||this.checkSlottedHelper()}hasErrorMessage(){return this.error?.length>0||this.checkSlottedError()}hasError(){return this.hasErrorMessage()||this.invalid||this.checkSlottedError()}checkSlottedHelper(){return!!this.hostElement.querySelector("[slot=helpertext]")}checkSlottedError(){return!!this.hostElement.querySelector("[slot=error]")}hideHelpertext(){return this.hasErrorMessage()||!this.hasHelperText()}hideError(){return!this.hasErrorMessage()}getId(){return this.pnId||this.selectId||this.id}displayLabel(){return!!this.label}getAriaLabel(){return this.displayLabel()||this.pnAriaLabelledby?null:this.pnAriaLabel}getAriaLabelledby(){return this.displayLabel()||this.pnAriaLabel?null:this.pnAriaLabelledby}getAriaDescribedby(){const e=[];return this.hasErrorMessage()?e.push(this.idError):this.hasHelperText()&&e.push(this.idHelper),e.length?e.join(" "):null}renderLabel(){return this.label?s("label",{htmlFor:this.getId(),class:"pn-select-label","data-compact":this.compact,"data-icon":!!this.icon},s("span",null,this.label)):null}render(){return s(a,{key:"dfd4d3814426a88b975bd86948c7ac2207255f4b"},s("div",{key:"5423289d1771840d08ab1de18ab3af4a31cb98f1",class:"pn-select","data-error":this.hasError()},!this.compact&&this.renderLabel(),s("div",{key:"164933a196821353cf7ca31d6d12b65a84da012a",class:"pn-select-input"},this.icon&&s("pn-icon",{key:"da732b9152cba5035039a9761f38471d5885ddb1",class:"pn-select-icon",icon:this.icon,"data-custom":!0,"aria-hidden":"true"}),this.hasError()&&s("pn-icon",{key:"3370ffc0f4f6de399762bf5d854433020830ff2e",class:"pn-select-icon",icon:r,color:"warning","data-error":!0,"aria-hidden":"true"}),s("select",{key:"2a31f44242dd230d68c8d10ed461aeb25f8ec231",id:this.getId(),class:"pn-select-element",name:this.name,form:this.form,autocomplete:this.autocomplete,"aria-label":this.getAriaLabel(),"aria-labelledby":this.getAriaLabelledby(),"aria-describedby":this.getAriaDescribedby(),"aria-invalid":this.hasError().toString(),disabled:this.disabled,"data-compact":this.compact},s("slot",{key:"8130b7ac6969e2fa0c801e0b10a47e97cf6505bf"})),this.compact&&this.renderLabel(),s("pn-icon",{key:"c2167ea78e00914296efd758d044a9ea24e428da",class:"pn-select-icon",icon:c,color:"blue700","data-default":!0,"aria-hidden":"true"})),s("p",{key:"528f5a13255b52009b6b291eff57a164b3650f07",id:this.idHelper,class:"pn-select-text",hidden:this.hideHelpertext()},s("span",{key:"0a802a236cef453ef78783a051b29ccfd0efd997"},this.helpertext),s("slot",{key:"b23ef510ec48ac499ab6c589d0be1b71517a9496",name:"helpertext"})),s("p",{key:"026c3978d58c24193731048373e83510002dd116",id:this.idError,class:"pn-select-text",role:"alert",hidden:this.hideError()},s("span",{key:"b8724dfc973607a0f4776aa40846c2c86c33c8af"},this.error),s("slot",{key:"90b29ba6d58e629783c4c8264c9aeaf3d84ffce8",name:"error"}))))}static get watchers(){return{selectId:[{handleId:0}],pnId:[{handleId:1}]}}static get style(){return`${e("pn-select")}{display:inline-block}${e("pn-select")} .pn-select-label{cursor:pointer;display:flex;justify-content:space-between;align-items:flex-end;font-weight:400;color:#2d2013;margin:0 0 0.25em 0;gap:0.5em;-webkit-tap-highlight-color:transparent;transition-property:color, transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-select")} .pn-select-label{transition-duration:0s;transition-delay:0s}}${e("pn-select")} .pn-select-label[data-compact]{position:absolute;top:1.5625em;left:calc(var(--pn-input-offset-left, 0px) + 0.75em + 0.0625em);margin:0;pointer-events:none;align-items:center;height:1.5em;max-width:calc(100% - (var(--pn-input-offset-left, 0px) + 0.75em) - (var(--pn-input-offset-right, 0px) + 0.75em));transform:translateY(-50%) scale(1) translateZ(0);transform-origin:0 0;transition-delay:0.2s}${e("pn-select")} .pn-select-label[data-compact]>span{font-size:1em;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;line-height:1.5em}${e("pn-select")} .pn-select-label>span{font-size:0.875em}${e("pn-select")} .pn-select-label[data-compact][data-icon]{--pn-input-offset-left:calc(2em)}${e("pn-select")} .pn-select-input{position:relative}${e("pn-select")} .pn-select-icon{pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);width:1.5em;height:1.5em;border-radius:50%;background-color:transparent}${e("pn-select")} .pn-select-icon .pn-icon-svg{transition-property:transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-select")} .pn-select-icon .pn-icon-svg{transition-duration:0s;transition-delay:0s}}${e("pn-select")} .pn-select-icon[data-default]{right:1em}${e("pn-select")} .pn-select-icon[data-custom]{left:0.75em}${e("pn-select")} .pn-select-icon[data-custom]~.pn-select-element{padding-left:2.75em}${e("pn-select")} .pn-select-icon[data-error]{right:3.5em}${e("pn-select")} .pn-select-icon[data-error]~.pn-select-element{padding-right:5.5em}${e("pn-select")} .pn-select-element{cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;text-overflow:ellipsis;white-space:nowrap;color:#2d2013;background-color:#ffffff;border:0.0625em solid #969087;border-radius:0.5em;padding:0.75em 3em 0.75em 0.75em;font-family:inherit;font-size:1em;font-weight:500;line-height:1.5em;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}${e("pn-select")} .pn-select-element:-webkit-autofill,${e("pn-select")} .pn-select-element:-webkit-autofill:hover,${e("pn-select")} .pn-select-element:-webkit-autofill:focus,${e("pn-select")} .pn-select-element:-webkit-autofill:active{-webkit-box-shadow:0 0 0 10em #e0f8ff inset;-webkit-text-fill-color:#2d2013}${e("pn-select")} .pn-select-element{outline:0.2rem solid transparent;outline-offset:0.2rem}${e("pn-select")} .pn-select-element:focus-visible{outline-color:#005d92;background-color:#ffffff;border-color:#005d92}${e("pn-select")} .pn-select-element{transition-property:outline-color, background-color, border-color, color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-select")} .pn-select-element{transition-duration:0s;transition-delay:0s}}${e("pn-select")} .pn-select-element[data-compact]{text-align:left;padding-top:1.125em;padding-bottom:0.375em;max-width:unset}${e("pn-select")} .pn-select-element[data-compact]::placeholder{color:transparent}${e("pn-select")} .pn-select-element[data-compact]:focus+.pn-select-label,${e("pn-select")} .pn-select-element[data-compact]:not(:placeholder-shown)+.pn-select-label{transform:translateY(-85%) scale(0.75);transition-delay:0s}${e("pn-select")} .pn-select-element::placeholder{color:#5e554a;font-weight:normal}${e("pn-select")} .pn-select-element:hover{border-color:#005d92}${e("pn-select")} .pn-select-element:disabled{color:#5e554a;background-color:#f3f2f2;border-color:#f3f2f2}${e("pn-select")} .pn-select-element:open~.pn-select-icon .pn-icon-svg{transform:rotate(180deg)}${e("pn-select")} .pn-select-element:disabled{color:#5e554a;background-color:#f3f2f2;border-color:#f3f2f2;pointer-events:none}${e("pn-select")} .pn-select-element:disabled:hover{background-color:#f3f2f2}${e("pn-select")} .pn-select-element:has(option[value=""]:checked){color:#5e554a;font-weight:normal}${e("pn-select")} .pn-select-element:hover{color:#2d2013;background-color:#effbff}${e("pn-select")} .pn-select-no-results{margin:0;padding:0.75em}${e("pn-select")} .pn-select-text{color:#5e554a;font-size:0.875em;font-weight:400;margin:0.25em 0 0 0;display:flex;flex-direction:column;gap:0.25em}${e("pn-select")} .pn-select-text[role=alert]{color:#a70707}${e("pn-select")} .pn-select[data-error]>.pn-select-label{color:#a70707}${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element{border-color:#a70707}${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:hover{border-color:#500715}${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:focus-visible{background-color:#ffffff;border-color:#a70707;outline-color:#a70707}${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:-webkit-autofill,${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:-webkit-autofill:hover,${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:-webkit-autofill:focus,${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:-webkit-autofill:active{-webkit-box-shadow:0 0 0 10em #fef7f6 inset;-webkit-text-fill-color:#2d2013}${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:hover{background-color:#fdefee}`}},[772,"pn-select",{label:[1],helpertext:[1],name:[1],form:[1],autocomplete:[1],required:[4],disabled:[4],compact:[4],icon:[1],invalid:[4],error:[1],pnId:[1,"pn-id"],pnAriaLabel:[1,"pn-aria-label"],pnAriaLabelledby:[1,"pn-aria-labelledby"],selectId:[1,"select-id"]},void 0,{selectId:[{handleId:0}],pnId:[{handleId:1}]}]);function d(){"undefined"!=typeof customElements&&["pn-select","pn-icon"].forEach((t=>{switch(t){case"pn-select":customElements.get(e(e(t)))||customElements.define(e(e(t)),p);break;case"pn-icon":customElements.get(e(e(t)))||o()}}))}export{p as P,d}
5
+ import{transformTag as e,proxyCustomElement as t,HTMLElement as n,forceUpdate as l,h as s,Host as c}from"@stencil/core/internal/client";import{a}from"./alert_exclamation_circle.js";import{c as r}from"./chevron_down.js";import{u as i}from"./helpers.js";import{d as o}from"./pn-icon2.js";const p=t(class extends n{constructor(e){super(),!1!==e&&this.__registerHost()}id=`pn-select-${i()}`;idHelper=`${this.id}-text`;idError=`${this.id}-error`;mo;get hostElement(){return this}label;helpertext;name;form;autocomplete;required=!1;disabled=!1;compact=!1;icon;invalid=!1;error;pnId;pnAriaLabel;pnAriaLabelledby;selectId;handleId(){this.idHelper=`${this.getId()}-text`,this.idError=`${this.getId()}-error`}connectedCallback(){this.mo=new MutationObserver((()=>l(this.hostElement))),this.mo.observe(this.hostElement,{childList:!0,subtree:!0})}disconnectedCallback(){this.mo&&this.mo.disconnect()}hasHelperText(){return this.helpertext?.length>0||this.checkSlottedHelper()}hasErrorMessage(){return this.error?.length>0||this.checkSlottedError()}hasError(){return this.hasErrorMessage()||this.invalid||this.checkSlottedError()}checkSlottedHelper(){return!!this.hostElement.querySelector("[slot=helpertext]")}checkSlottedError(){return!!this.hostElement.querySelector("[slot=error]")}hideHelpertext(){return this.hasErrorMessage()||!this.hasHelperText()}hideError(){return!this.hasErrorMessage()}getId(){return this.pnId||this.selectId||this.id}displayLabel(){return!!this.label}getAriaLabel(){return this.displayLabel()||this.pnAriaLabelledby?null:this.pnAriaLabel}getAriaLabelledby(){return this.displayLabel()||this.pnAriaLabel?null:this.pnAriaLabelledby}getAriaDescribedby(){const e=[];return this.hasErrorMessage()?e.push(this.idError):this.hasHelperText()&&e.push(this.idHelper),e.length?e.join(" "):null}renderLabel(){return this.label?s("label",{htmlFor:this.getId(),class:"pn-select-label","data-compact":this.compact,"data-icon":!!this.icon},s("span",null,this.label)):null}render(){return s(c,{key:"c00c913a1786719ef71800ed15adaf0dd47577ff"},s("div",{key:"c2ee0553f2c130e12e7bc5bcfb611d457071cdec",class:"pn-select","data-error":this.hasError()},!this.compact&&this.renderLabel(),s("div",{key:"7e8d7a1ab89e30b870883ff50bec31dd2a38690d",class:"pn-select-input"},this.icon&&s("pn-icon",{key:"772eb356db3cdf4fd04a67e1666ddb98799d40c0",class:"pn-select-icon",icon:this.icon,"data-custom":!0,"aria-hidden":"true"}),this.hasError()&&s("pn-icon",{key:"03ccbd0952abb83cc4828ad6bfca777e1544f7a6",class:"pn-select-icon",icon:a,color:"warning","data-error":!0,"aria-hidden":"true"}),s("select",{key:"46db113874c38b6f2ae6a42fbc63d9a9654a9dc1",id:this.getId(),class:"pn-select-element",name:this.name,form:this.form,autocomplete:this.autocomplete,"aria-label":this.getAriaLabel(),"aria-labelledby":this.getAriaLabelledby(),"aria-describedby":this.getAriaDescribedby(),"aria-invalid":this.hasError().toString(),disabled:this.disabled,"data-compact":this.compact},s("slot",{key:"8253ace83c8f6454d8bae7550895768d4e53f809"})),this.compact&&this.renderLabel(),s("pn-icon",{key:"88b094bd13b0d9cf912103427722e8be9ea2b687",class:"pn-select-icon",icon:r,color:"blue700","data-default":!0,"aria-hidden":"true"})),s("p",{key:"03009e2b484ade6fadb9e20f161cfc50964db43a",id:this.idHelper,class:"pn-select-text",hidden:this.hideHelpertext()},s("span",{key:"2620e53c70c4ab95efc9924faa1a3ea298ec741b"},this.helpertext),s("slot",{key:"bd9798ba17632021ce177292cc022f57ae52193f",name:"helpertext"})),s("p",{key:"6ba88b6a3884430e7c263803ece5000adb08abe7",id:this.idError,class:"pn-select-text",role:"alert",hidden:this.hideError()},s("span",{key:"dcc53f692bce2eaa5460075b9a1e191f29a777ad"},this.error),s("slot",{key:"0cf932dadffd1df3958e400a08c090483fc7c397",name:"error"}))))}static get watchers(){return{selectId:[{handleId:0}],pnId:[{handleId:1}]}}static get style(){return`${e("pn-select")}{display:inline-block}${e("pn-select")} .pn-select-label{cursor:pointer;display:flex;justify-content:space-between;align-items:flex-end;font-weight:400;color:#2d2013;margin:0 0 0.25em 0;gap:0.5em;-webkit-tap-highlight-color:transparent;transition-property:color, transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-select")} .pn-select-label{transition-duration:0s;transition-delay:0s}}${e("pn-select")} .pn-select-label[data-compact]{position:absolute;top:1.5625em;left:calc(var(--pn-input-offset-left, 0px) + 0.75em + 0.0625em);margin:0;pointer-events:none;align-items:center;height:1.5em;max-width:calc(100% - (var(--pn-input-offset-left, 0px) + 0.75em) - (var(--pn-input-offset-right, 0px) + 0.75em));transform:translateY(-50%) scale(1) translateZ(0);transform-origin:0 0;transition-delay:0.2s}${e("pn-select")} .pn-select-label[data-compact]>span{font-size:1em;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;line-height:1.5em}${e("pn-select")} .pn-select-label>span{font-size:0.875em}${e("pn-select")} .pn-select-label[data-compact][data-icon]{--pn-input-offset-left:calc(2em)}${e("pn-select")} .pn-select-input{position:relative}${e("pn-select")} .pn-select-icon{pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);width:1.5em;height:1.5em;border-radius:50%;background-color:transparent}${e("pn-select")} .pn-select-icon .pn-icon-svg{transition-property:transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-select")} .pn-select-icon .pn-icon-svg{transition-duration:0s;transition-delay:0s}}${e("pn-select")} .pn-select-icon[data-default]{right:1em}${e("pn-select")} .pn-select-icon[data-custom]{left:0.75em}${e("pn-select")} .pn-select-icon[data-custom]~.pn-select-element{padding-left:2.75em}${e("pn-select")} .pn-select-icon[data-error]{right:3.5em}${e("pn-select")} .pn-select-icon[data-error]~.pn-select-element{padding-right:5.5em}${e("pn-select")} .pn-select-element{cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;text-overflow:ellipsis;white-space:nowrap;color:#2d2013;background-color:#ffffff;border:0.0625em solid #969087;border-radius:0.5em;padding:0.75em 3em 0.75em 0.75em;font-family:inherit;font-size:1em;font-weight:500;line-height:1.5em;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}${e("pn-select")} .pn-select-element:-webkit-autofill,${e("pn-select")} .pn-select-element:-webkit-autofill:hover,${e("pn-select")} .pn-select-element:-webkit-autofill:focus,${e("pn-select")} .pn-select-element:-webkit-autofill:active{-webkit-box-shadow:0 0 0 10em #e0f8ff inset;-webkit-text-fill-color:#2d2013}${e("pn-select")} .pn-select-element{outline:0.2rem solid transparent;outline-offset:0.2rem}${e("pn-select")} .pn-select-element:focus-visible{outline-color:#005d92;background-color:#ffffff;border-color:#005d92}${e("pn-select")} .pn-select-element{transition-property:outline-color, background-color, border-color, color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-select")} .pn-select-element{transition-duration:0s;transition-delay:0s}}${e("pn-select")} .pn-select-element[data-compact]{text-align:left;padding-top:1.125em;padding-bottom:0.375em;max-width:unset}${e("pn-select")} .pn-select-element[data-compact]::placeholder{color:transparent}${e("pn-select")} .pn-select-element[data-compact]:focus+.pn-select-label,${e("pn-select")} .pn-select-element[data-compact]:not(:placeholder-shown)+.pn-select-label{transform:translateY(-85%) scale(0.75);transition-delay:0s}${e("pn-select")} .pn-select-element::placeholder{color:#5e554a;font-weight:normal}${e("pn-select")} .pn-select-element:hover{border-color:#005d92}${e("pn-select")} .pn-select-element:disabled{color:#5e554a;background-color:#f3f2f2;border-color:#f3f2f2}${e("pn-select")} .pn-select-element:open~.pn-select-icon .pn-icon-svg{transform:rotate(180deg)}${e("pn-select")} .pn-select-element:disabled{color:#5e554a;background-color:#f3f2f2;border-color:#f3f2f2;pointer-events:none}${e("pn-select")} .pn-select-element:disabled:hover{background-color:#f3f2f2}${e("pn-select")} .pn-select-element:has(option[value=""]:checked){color:#5e554a;font-weight:normal}${e("pn-select")} .pn-select-element:hover{color:#2d2013;background-color:#effbff}${e("pn-select")} .pn-select-no-results{margin:0;padding:0.75em}${e("pn-select")} .pn-select-text{color:#5e554a;font-size:0.875em;font-weight:400;margin:0.25em 0 0 0;display:flex;flex-direction:column;gap:0.25em}${e("pn-select")} .pn-select-text[role=alert]{color:#a70707}${e("pn-select")} .pn-select[data-error]>.pn-select-label{color:#a70707}${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element{border-color:#a70707}${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:hover{border-color:#500715}${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:focus-visible{background-color:#ffffff;border-color:#a70707;outline-color:#a70707}${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:-webkit-autofill,${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:-webkit-autofill:hover,${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:-webkit-autofill:focus,${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:-webkit-autofill:active{-webkit-box-shadow:0 0 0 10em #fef7f6 inset;-webkit-text-fill-color:#2d2013}${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:hover{background-color:#fdefee}`}},[772,"pn-select",{label:[1],helpertext:[1],name:[1],form:[1],autocomplete:[1],required:[4],disabled:[4],compact:[4],icon:[1],invalid:[4],error:[1],pnId:[1,"pn-id"],pnAriaLabel:[1,"pn-aria-label"],pnAriaLabelledby:[1,"pn-aria-labelledby"],selectId:[1,"select-id"]},void 0,{selectId:[{handleId:0}],pnId:[{handleId:1}]}]);function d(){"undefined"!=typeof customElements&&["pn-select","pn-icon"].forEach((t=>{switch(t){case"pn-select":customElements.get(e(e(t)))||customElements.define(e(e(t)),p);break;case"pn-icon":customElements.get(e(e(t)))||o()}}))}export{p as P,d}
@@ -0,0 +1,11 @@
1
+ import type { Components, JSX } from "../types/components";
2
+
3
+ interface PnSkeletonLoader extends Components.PnSkeletonLoader, HTMLElement {}
4
+ export const PnSkeletonLoader: {
5
+ prototype: PnSkeletonLoader;
6
+ new (): PnSkeletonLoader;
7
+ };
8
+ /**
9
+ * Used to define this component and all nested components recursively.
10
+ */
11
+ export const defineCustomElement: () => void;
@@ -0,0 +1,5 @@
1
+ /*!
2
+ * Built with Stencil
3
+ * By PostNord.
4
+ */
5
+ import{transformTag as e,proxyCustomElement as n,HTMLElement as a,h as o,Host as t}from"@stencil/core/internal/client";const i=n(class extends a{constructor(e){super(),!1!==e&&this.__registerHost()}type="box";width;height;borderRadius;small=!1;large=!1;lines=3;automatic=!1;hide=!1;getStyle(){const e={};return this.width&&(e.width=this.width),this.height&&(e.height=this.height),this.borderRadius&&(e["border-radius"]=this.borderRadius),e}renderParagraph(){const e=[];for(let n=0;n<this.lines;n++)e.push(o("div",{class:"pn-skeleton-loader-line",style:n===this.lines-1?{width:"75%"}:void 0}));return e}renderTable(){const e=[];for(let n=0;n<this.lines;n++)e.push(o("div",{class:"pn-skeleton-loader-table-row"}));return e}render(){const e=this.getStyle();return this.automatic?o(t,null,o("div",{class:{"pn-skeleton-loader--automatic":!this.hide},role:this.hide?void 0:"status","aria-busy":this.hide?void 0:"true","aria-label":this.hide?void 0:"Loading"},o("slot",null))):this.hide?o(t,{style:{display:"none"}}):o(t,null,"paragraph"===this.type?o("div",{class:"pn-skeleton-loader pn-skeleton-loader--paragraph",style:e,role:"status","aria-busy":"true","aria-label":"Loading"},this.renderParagraph()):"table"===this.type?o("div",{class:"pn-skeleton-loader pn-skeleton-loader--table",style:e,role:"status","aria-busy":"true","aria-label":"Loading"},o("div",{class:"pn-skeleton-loader-table-header"}),this.renderTable()):"card"===this.type?o("div",{class:"pn-skeleton-loader pn-skeleton-loader--card",style:e,role:"status","aria-busy":"true","aria-label":"Loading"},o("div",{class:"pn-skeleton-loader-card-image"}),o("div",{class:"pn-skeleton-loader-card-content"},this.renderParagraph())):"tile"===this.type?o("div",{class:"pn-skeleton-loader pn-skeleton-loader--tile",style:e,role:"status","aria-busy":"true","aria-label":"Loading"},o("div",{class:"pn-skeleton-loader-tile-circle"}),o("div",{class:"pn-skeleton-loader-tile-content"},o("div",{class:"pn-skeleton-loader-line"}),o("div",{class:"pn-skeleton-loader-line",style:{width:"75%"}}))):"header"===this.type?o("div",{class:"pn-skeleton-loader pn-skeleton-loader--header",style:e,role:"status","aria-busy":"true","aria-label":"Loading"},o("div",{class:"pn-skeleton-loader-header-back"}),o("div",{class:"pn-skeleton-loader-header-heading"}),o("div",{class:"pn-skeleton-loader-header-subheading"})):o("div",{class:{"pn-skeleton-loader":!0,["pn-skeleton-loader--"+this.type]:!0,"pn-skeleton-loader--small":this.small,"pn-skeleton-loader--large":this.large},style:e,role:"status","aria-busy":"true","aria-label":"Loading"}))}static get style(){return`@keyframes pn-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}${e("pn-skeleton-loader")}{display:block;background:transparent}${e("pn-skeleton-loader")} .pn-skeleton-loader{background:linear-gradient(90deg, #f3f2f2 25%, #f9f8f8 50%, #f3f2f2 75%);background-size:200% 100%;animation:pn-shimmer 1.5s infinite ease-in-out}@media (prefers-reduced-motion: reduce){${e("pn-skeleton-loader")} .pn-skeleton-loader{animation:none}}${e("pn-skeleton-loader")} .pn-skeleton-loader--box{width:100%;height:100%;min-height:3em;min-width:10em;border-radius:0.5em}${e("pn-skeleton-loader")} .pn-skeleton-loader--card{width:100%;min-width:10em;border-radius:0.5em;box-shadow:0em 0.0625em 0.125em 0em rgba(20, 20, 20, 0.11), 0em 0.1875em 0.4375em 0em rgba(0, 0, 0, 0.13);background:#ffffff;animation:none;overflow:hidden;display:flex;flex-direction:column}${e("pn-skeleton-loader")} .pn-skeleton-loader-card-image{width:100%;height:10em;clip-path:ellipse(175% 100% at top center);background:linear-gradient(90deg, #f3f2f2 25%, #f9f8f8 50%, #f3f2f2 75%);background-size:200% 100%;animation:pn-shimmer 1.5s infinite ease-in-out}@media (prefers-reduced-motion: reduce){${e("pn-skeleton-loader")} .pn-skeleton-loader-card-image{animation:none}}${e("pn-skeleton-loader")} .pn-skeleton-loader-card-content{display:flex;flex-direction:column;gap:0.5em;padding:clamp(0.75em, 5vw, 1.5em)}${e("pn-skeleton-loader")} .pn-skeleton-loader--tile{width:100%;border-radius:0.5em;box-shadow:0em 0.0625em 0.125em 0em rgba(20, 20, 20, 0.11), 0em 0.1875em 0.4375em 0em rgba(0, 0, 0, 0.13);background:#ffffff;animation:none;display:flex;flex-direction:column;align-items:center;padding:clamp(0.75em, 3vw, 1.5em);gap:clamp(1em, 5vw, 1.5em);text-align:center}${e("pn-skeleton-loader")} .pn-skeleton-loader-tile-circle{width:7em;height:7em;border-radius:50%;background:linear-gradient(90deg, #f3f2f2 25%, #f9f8f8 50%, #f3f2f2 75%);background-size:200% 100%;animation:pn-shimmer 1.5s infinite ease-in-out}@media (prefers-reduced-motion: reduce){${e("pn-skeleton-loader")} .pn-skeleton-loader-tile-circle{animation:none}}${e("pn-skeleton-loader")} .pn-skeleton-loader-tile-content{display:flex;flex-direction:column;gap:0.5em;width:100%}${e("pn-skeleton-loader")} .pn-skeleton-loader--header{width:100%;background:none;animation:none;display:flex;flex-direction:column;gap:1em;padding:clamp(1em, 3vw, 2em) clamp(0.5em, 3vw, 2em)}${e("pn-skeleton-loader")} .pn-skeleton-loader-header-back{width:5em;height:1em;border-radius:0.25em;background:linear-gradient(90deg, #f3f2f2 25%, #f9f8f8 50%, #f3f2f2 75%);background-size:200% 100%;animation:pn-shimmer 1.5s infinite ease-in-out}@media (prefers-reduced-motion: reduce){${e("pn-skeleton-loader")} .pn-skeleton-loader-header-back{animation:none}}${e("pn-skeleton-loader")} .pn-skeleton-loader-header-heading{width:40%;height:2em;border-radius:0.25em;background:linear-gradient(90deg, #f3f2f2 25%, #f9f8f8 50%, #f3f2f2 75%);background-size:200% 100%;animation:pn-shimmer 1.5s infinite ease-in-out}@media (prefers-reduced-motion: reduce){${e("pn-skeleton-loader")} .pn-skeleton-loader-header-heading{animation:none}}${e("pn-skeleton-loader")} .pn-skeleton-loader-header-subheading{width:30%;height:1em;border-radius:0.25em;background:linear-gradient(90deg, #f3f2f2 25%, #f9f8f8 50%, #f3f2f2 75%);background-size:200% 100%;animation:pn-shimmer 1.5s infinite ease-in-out}@media (prefers-reduced-motion: reduce){${e("pn-skeleton-loader")} .pn-skeleton-loader-header-subheading{animation:none}}${e("pn-skeleton-loader")} .pn-skeleton-loader--chip{display:inline-block;width:6em;height:2.5em;border-radius:0.5em}${e("pn-skeleton-loader")} .pn-skeleton-loader--chip.pn-skeleton-loader--small{height:2em;width:5em}${e("pn-skeleton-loader")} .pn-skeleton-loader--chip.pn-skeleton-loader--large{height:2.875em;width:7em}${e("pn-skeleton-loader")} .pn-skeleton-loader--input{width:100%;min-width:10em;height:3em;border-radius:0.5em}${e("pn-skeleton-loader")} .pn-skeleton-loader--avatar{width:3em;height:3em;border-radius:50%}${e("pn-skeleton-loader")} .pn-skeleton-loader--button{display:inline-block;min-width:5.5em;height:3em;border-radius:3em}${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic{position:relative;background:none;animation:none;pointer-events:none}${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic *{color:transparent !important;text-shadow:none !important}${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic img,${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic svg,${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic ${e("pn-icon")},${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic ${e("pn-illustration")}{visibility:hidden}${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic [data-skeleton]{position:relative;overflow:hidden}${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic [data-skeleton]::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg, #f3f2f2 25%, #f9f8f8 50%, #f3f2f2 75%);background-size:200% 100%;animation:pn-shimmer 1.5s infinite ease-in-out}@media (prefers-reduced-motion: reduce){${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic [data-skeleton]::after{animation:none}}${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic [data-skeleton=avatar]{border-radius:50%;overflow:hidden}${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic [data-skeleton=button]{border-radius:3em;min-height:3em;min-width:5.5em}${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic [data-skeleton=button] *{visibility:hidden}${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic [data-skeleton=chip]{border-radius:0.5em;min-height:2.5em;min-width:4em}${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic [data-skeleton=chip] *{visibility:hidden}${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic [data-skeleton=text]::after{display:none}${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic [data-skeleton=text]>*{position:relative;overflow:hidden;border-radius:0.25em}${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic [data-skeleton=text]>*::after{content:"";position:absolute;inset:0;border-radius:0.25em;background:linear-gradient(90deg, #f3f2f2 25%, #f9f8f8 50%, #f3f2f2 75%);background-size:200% 100%;animation:pn-shimmer 1.5s infinite ease-in-out}@media (prefers-reduced-motion: reduce){${e("pn-skeleton-loader")} .pn-skeleton-loader--automatic [data-skeleton=text]>*::after{animation:none}}${e("pn-skeleton-loader")} .pn-skeleton-loader--text{width:100%;min-width:10em;height:1em;border-radius:0.25em}${e("pn-skeleton-loader")} .pn-skeleton-loader--paragraph{display:flex;flex-direction:column;gap:0.5em;min-width:10em;background:none;animation:none}${e("pn-skeleton-loader")} .pn-skeleton-loader--table{display:flex;flex-direction:column;gap:0.5em;min-width:10em;background:none;animation:none;border-radius:0.5em}${e("pn-skeleton-loader")} .pn-skeleton-loader-table-header{width:100%;height:4em;border-radius:0.5em 0.5em 0 0;background:linear-gradient(90deg, #f3f2f2 25%, #f9f8f8 50%, #f3f2f2 75%);background-size:200% 100%;animation:pn-shimmer 1.5s infinite ease-in-out}@media (prefers-reduced-motion: reduce){${e("pn-skeleton-loader")} .pn-skeleton-loader-table-header{animation:none}}${e("pn-skeleton-loader")} .pn-skeleton-loader-table-row{width:100%;height:3em;background:linear-gradient(90deg, #f3f2f2 25%, #f9f8f8 50%, #f3f2f2 75%);background-size:200% 100%;animation:pn-shimmer 1.5s infinite ease-in-out}${e("pn-skeleton-loader")} .pn-skeleton-loader-table-row:last-child{border-radius:0 0 0.5em 0.5em}@media (prefers-reduced-motion: reduce){${e("pn-skeleton-loader")} .pn-skeleton-loader-table-row{animation:none}}${e("pn-skeleton-loader")} .pn-skeleton-loader-line{width:100%;height:1em;border-radius:0.25em;background:linear-gradient(90deg, #f3f2f2 25%, #f9f8f8 50%, #f3f2f2 75%);background-size:200% 100%;animation:pn-shimmer 1.5s infinite ease-in-out}@media (prefers-reduced-motion: reduce){${e("pn-skeleton-loader")} .pn-skeleton-loader-line{animation:none}}`}},[772,"pn-skeleton-loader",{type:[1],width:[1],height:[1],borderRadius:[1,"border-radius"],small:[4],large:[4],lines:[2],automatic:[4],hide:[4]}]),l=i,r=function(){"undefined"!=typeof customElements&&["pn-skeleton-loader"].forEach((n=>{"pn-skeleton-loader"===n&&(customElements.get(e(e(n)))||customElements.define(e(e(n)),i))}))};export{l as PnSkeletonLoader,r as defineCustomElement}
@@ -2,4 +2,4 @@
2
2
  * Built with Stencil
3
3
  * By PostNord.
4
4
  */
5
- import{transformTag as t,proxyCustomElement as e,HTMLElement as n,createEvent as i,forceUpdate as a,h as o,Host as r}from"@stencil/core/internal/client";import{o as s}from"./helpers.js";import{d as c}from"./pn-icon2.js";const l=e(class extends n{constructor(t){super(),!1!==t&&this.__registerHost(),this.setActiveTab=i(this,"setActiveTab",7),this.tabEnter=i(this,"tabEnter",7),this.tabLeave=i(this,"tabLeave",7)}mo;tag="button";get hostElement(){return this}label;value;href;icon;ariacontrols;tabid;activeTab;setActiveTab;setActiveTabHandler({click:t=!1,element:e}={}){(t||this.isActive())&&this.setActiveTab.emit({val:e?.value||this.value,el:e?.value&&e||this.hostElement})}tabEnter;triggerEnter(t){this.tabEnter.emit(t)}tabLeave;triggerLeave(t){this.tabLeave.emit(t)}connectedCallback(){this.mo=new MutationObserver((()=>a(this.hostElement))),this.mo.observe(this.hostElement,{subtree:!0,childList:!0})}disconnectedCallback(){this.mo?.disconnect()}componentWillLoad(){this.tabTag()}componentDidUpdate(){this.setActiveTabHandler()}componentDidLoad(){this.setActiveTabHandler()}arrowKeyNav(e){if(!/^(ArrowRight|ArrowLeft|Home|End)$/.test(e.key))return;const n=t("pn-tab"),i=t("pn-tablist");e.preventDefault();const a=e.target.closest(i);if(!a)return;const o=Array.from(a.querySelectorAll(n)),r=o[0],s=o[o.length-1],c=this.hostElement.nextElementSibling,l=this.hostElement.previousElementSibling;"Home"===e.key&&this.setActiveTabHandler({element:r}),"End"===e.key&&this.setActiveTabHandler({element:s}),"ArrowRight"===e.key&&this.setActiveTabHandler({element:c?.value?c:r}),"ArrowLeft"===e.key&&this.setActiveTabHandler({element:l?.value?l:s})}isActive(){return this.activeTab===this.value}tabTag(){const e=t("pn-tablist"),n=this.hostElement.closest(e);this.tag="menu"===n?.slot?"a":"button"}renderProperties(){return"a"===this.tag?{href:this.href,"aria-current":this.isActive()?"page":"false"}:{tabindex:this.isActive()?0:-1,type:"button",role:"tab","aria-selected":""+this.isActive(),"aria-controls":this.ariacontrols}}iconColor(){return this.isActive()?"blue700":"gray900"}handleClick(t){this.setActiveTabHandler({click:!0}),s(t,this.hostElement,".pn-tab")}render(){return o(r,{key:"37a1d2234aa0d4fe1f5f1af6f8334f9e4109eff6"},o(this.tag,{key:"17e8e25c54b556f65b7c98ac4eaef07f1bc131ac",id:this.tabid,class:"pn-tab",...this.renderProperties(),onClick:t=>this.handleClick(t),onMouseEnter:t=>this.triggerEnter(t),onFocus:t=>this.triggerEnter(t),onMouseLeave:t=>this.triggerLeave(t),onBlur:t=>this.triggerLeave(t),onKeyDown:t=>this.arrowKeyNav(t)},!!this.icon&&o("pn-icon",{key:"42c7473fd8b573ec47e8e2074a4ded3ff3e40249",icon:this.icon,color:this.iconColor()}),o("slot",{key:"c39be583c461850d49f7e5a96c071c80b7b132da"}),o("span",{key:"ce995d860775c71e8fda7dc4e94c2a7896759f62",class:"pn-tab-label"},this.label)))}static get style(){return`${t("pn-tab")}{position:relative;overflow:hidden;flex-shrink:0;scroll-snap-align:center;display:inline-block;border-radius:0.5em}${t("pn-tab")} .pn-tab{position:relative;cursor:pointer;margin:1em 0.25em;padding:0 0.25em;border:none;border-radius:0.5em;color:#2d2013;background-color:transparent;font-family:inherit;font-size:1em;font-weight:500;text-decoration:none;display:flex;gap:0.5em;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent}${t("pn-tab")} .pn-tab .pn-ripple{animation:ripple 0.4s cubic-bezier(0.7, 0, 0.3, 1);position:absolute;border-radius:50%;background-color:#005d92;transform:translate(-50%, -50%) scale(0);opacity:0.1;pointer-events:none;z-index:3}@keyframes ripple{to{transform:translate(-50%, -50%) scale(1);opacity:0}}${t("pn-tab")} .pn-tab{transition-property:color, outline-color, background-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tab")} .pn-tab{transition-duration:0s;transition-delay:0s}}${t("pn-tab")} .pn-tab{outline:0.2rem solid transparent;outline-offset:0.2rem}${t("pn-tab")} .pn-tab-label{line-height:1.5em}${t("pn-tab")} .pn-tab:focus-visible{overflow:hidden;outline-color:#005d92;background-color:#ffffff}${t("pn-tab")} .pn-tab[aria-selected=true],${t("pn-tab")} .pn-tab[aria-current=page]{color:#005d92}${t("pn-tab")} .pn-tab[aria-selected=true]:focus,${t("pn-tab")} .pn-tab[aria-current=page]:focus{color:#0d234b}${t("pn-tab")} .pn-tab[aria-selected=true]:focus ${t("pn-icon")} .pn-icon-svg path,${t("pn-tab")} .pn-tab[aria-selected=true]:focus ${t("pn-icon")} .pn-icon-svg polygon,${t("pn-tab")} .pn-tab[aria-current=page]:focus ${t("pn-icon")} .pn-icon-svg path,${t("pn-tab")} .pn-tab[aria-current=page]:focus ${t("pn-icon")} .pn-icon-svg polygon{fill:#0d234b}`}},[772,"pn-tab",{label:[1],value:[1],href:[1],icon:[1],ariacontrols:[1],tabid:[1],activeTab:[1,"active-tab"]}]),p=l,b=function(){"undefined"!=typeof customElements&&["pn-tab","pn-icon"].forEach((e=>{switch(e){case"pn-tab":customElements.get(t(t(e)))||customElements.define(t(t(e)),l);break;case"pn-icon":customElements.get(t(t(e)))||c()}}))};export{p as PnTab,b as defineCustomElement}
5
+ import{transformTag as t,proxyCustomElement as e,HTMLElement as n,createEvent as i,forceUpdate as a,h as o,Host as r}from"@stencil/core/internal/client";import{o as s}from"./helpers.js";import{d as c}from"./pn-icon2.js";const l=e(class extends n{constructor(t){super(),!1!==t&&this.__registerHost(),this.setActiveTab=i(this,"setActiveTab",7),this.tabEnter=i(this,"tabEnter",7),this.tabLeave=i(this,"tabLeave",7)}mo;tag="button";get hostElement(){return this}label;value;href;icon;ariacontrols;tabid;activeTab;setActiveTab;setActiveTabHandler({click:t=!1,element:e}={}){(t||this.isActive())&&this.setActiveTab.emit({val:e?.value||this.value,el:e?.value&&e||this.hostElement})}tabEnter;triggerEnter(t){this.tabEnter.emit(t)}tabLeave;triggerLeave(t){this.tabLeave.emit(t)}connectedCallback(){this.mo=new MutationObserver((()=>a(this.hostElement))),this.mo.observe(this.hostElement,{subtree:!0,childList:!0})}disconnectedCallback(){this.mo?.disconnect()}componentWillLoad(){this.tabTag()}componentDidUpdate(){this.setActiveTabHandler()}componentDidLoad(){this.setActiveTabHandler()}arrowKeyNav(e){if(!/^(ArrowRight|ArrowLeft|Home|End)$/.test(e.key))return;const n=t("pn-tab"),i=t("pn-tablist");e.preventDefault();const a=e.target.closest(i);if(!a)return;const o=Array.from(a.querySelectorAll(n)),r=o[0],s=o[o.length-1],c=this.hostElement.nextElementSibling,l=this.hostElement.previousElementSibling;"Home"===e.key&&this.setActiveTabHandler({element:r}),"End"===e.key&&this.setActiveTabHandler({element:s}),"ArrowRight"===e.key&&this.setActiveTabHandler({element:c?.value?c:r}),"ArrowLeft"===e.key&&this.setActiveTabHandler({element:l?.value?l:s})}isActive(){return this.activeTab===this.value}tabTag(){const e=t("pn-tablist"),n=this.hostElement.closest(e);this.tag="menu"===n?.slot?"a":"button"}renderProperties(){return"a"===this.tag?{href:this.href,"aria-current":this.isActive()?"page":"false"}:{tabindex:this.isActive()?0:-1,type:"button",role:"tab","aria-selected":""+this.isActive(),"aria-controls":this.ariacontrols}}iconColor(){return this.isActive()?"blue700":"gray900"}handleClick(t){this.setActiveTabHandler({click:!0}),s(t,this.hostElement,".pn-tab")}render(){return o(r,{key:"55537e72d57486887ce53f76414c3cf2f6cf8d5d"},o(this.tag,{key:"a6b04fbff9c34f49e3ef93b4d34dc7dc08fcdbc9",id:this.tabid,class:"pn-tab",...this.renderProperties(),onClick:t=>this.handleClick(t),onMouseEnter:t=>this.triggerEnter(t),onFocus:t=>this.triggerEnter(t),onMouseLeave:t=>this.triggerLeave(t),onBlur:t=>this.triggerLeave(t),onKeyDown:t=>this.arrowKeyNav(t)},!!this.icon&&o("pn-icon",{key:"9d7fc111d42a22dbed2f9bc3a67644d6de632e61",icon:this.icon,color:this.iconColor()}),o("slot",{key:"09d51a66dada9af7263e01ea08b0717cba6f4722"}),o("span",{key:"23ae59bf1b5fbb25fe3a936758402c67e47eee3a",class:"pn-tab-label"},this.label)))}static get style(){return`${t("pn-tab")}{position:relative;overflow:hidden;flex-shrink:0;scroll-snap-align:center;display:inline-block;border-radius:0.5em}${t("pn-tab")} .pn-tab{position:relative;cursor:pointer;margin:1em 0.25em;padding:0 0.25em;border:none;border-radius:0.5em;color:#2d2013;background-color:transparent;font-family:inherit;font-size:1em;font-weight:500;text-decoration:none;display:flex;gap:0.5em;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent}${t("pn-tab")} .pn-tab .pn-ripple{animation:ripple 0.4s cubic-bezier(0.7, 0, 0.3, 1);position:absolute;border-radius:50%;background-color:#005d92;transform:translate(-50%, -50%) scale(0);opacity:0.1;pointer-events:none;z-index:3}@keyframes ripple{to{transform:translate(-50%, -50%) scale(1);opacity:0}}${t("pn-tab")} .pn-tab{transition-property:color, outline-color, background-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tab")} .pn-tab{transition-duration:0s;transition-delay:0s}}${t("pn-tab")} .pn-tab{outline:0.2rem solid transparent;outline-offset:0.2rem}${t("pn-tab")} .pn-tab-label{line-height:1.5em}${t("pn-tab")} .pn-tab:focus-visible{overflow:hidden;outline-color:#005d92;background-color:#ffffff}${t("pn-tab")} .pn-tab[aria-selected=true],${t("pn-tab")} .pn-tab[aria-current=page]{color:#005d92}${t("pn-tab")} .pn-tab[aria-selected=true]:focus,${t("pn-tab")} .pn-tab[aria-current=page]:focus{color:#0d234b}${t("pn-tab")} .pn-tab[aria-selected=true]:focus ${t("pn-icon")} .pn-icon-svg path,${t("pn-tab")} .pn-tab[aria-selected=true]:focus ${t("pn-icon")} .pn-icon-svg polygon,${t("pn-tab")} .pn-tab[aria-current=page]:focus ${t("pn-icon")} .pn-icon-svg path,${t("pn-tab")} .pn-tab[aria-current=page]:focus ${t("pn-icon")} .pn-icon-svg polygon{fill:#0d234b}`}},[772,"pn-tab",{label:[1],value:[1],href:[1],icon:[1],ariacontrols:[1],tabid:[1],activeTab:[1,"active-tab"]}]),p=l,b=function(){"undefined"!=typeof customElements&&["pn-tab","pn-icon"].forEach((e=>{switch(e){case"pn-tab":customElements.get(t(t(e)))||customElements.define(t(t(e)),l);break;case"pn-icon":customElements.get(t(t(e)))||c()}}))};export{p as PnTab,b as defineCustomElement}
@@ -2,4 +2,4 @@
2
2
  * Built with Stencil
3
3
  * By PostNord.
4
4
  */
5
- import{transformTag as t,proxyCustomElement as i,HTMLElement as a,createEvent as e,forceUpdate as s,h as n,Host as l}from"@stencil/core/internal/client";import{a as r,c as o}from"./chevron_right.js";import{k as c,e as b}from"./helpers.js";import{d as p}from"./pn-button2.js";import{d}from"./pn-icon2.js";import{d as h}from"./pn-spinner2.js";var m={LEFT:{sv:"Bläddra åt vänster",en:"Scroll to the left",da:"Rul til venstre",fi:"Vieritä vasemmalle",no:"Rull til venstre"},RIGHT:{sv:"Bläddra åt höger",en:"Scroll to the right",da:"Rul til højre",fi:"Vieritä oikealle",no:"Rull til høyre"}};const u=i(class extends a{constructor(t){super(),!1!==t&&this.__registerHost(),this.tabchange=e(this,"tabchange",7)}mo;isMenu=!1;isTabHovered=!1;tabListEl;lineActive;lineHovered;tabElement;get hostElement(){return this}showScrollArrows=!1;arrowLeft=!1;arrowRight=!1;label;value;small;stackedicons=!1;language=null;tabchange;setValue(){const i=t("pn-tab");Array.from(this.hostElement.querySelectorAll(i)).forEach((t=>{t.activeTab=this.value}))}scrollHandler(){this.showScrollArrows?this.tabListEl.addEventListener("scroll",this.scrollIndicators.bind(this)):this.tabListEl.removeEventListener("scroll",this.scrollIndicators)}setActiveTabHandler({detail:t}){this.tabElement=t.el,requestAnimationFrame((()=>this.activateTab(t.el))),this.value!==t.val&&(this.value=t.val,this.tabchange.emit(this.value),this.tabElement.querySelector(".pn-tab").focus())}rerender(){requestAnimationFrame((()=>{this.scrollIndicators(),this.isTabHovered=!1}))}handleEnter(t){this.isTabHovered=!0,this.styleLines(t.target)}handleLeave(){this.isTabHovered=!1,setTimeout((()=>{this.isTabHovered||this.lineHovered.style.setProperty("--pn-hover-opacity","0")}),500)}connectedCallback(){this.mo=new MutationObserver((()=>{s(this.hostElement),this.setValue(),this.rerender()})),this.mo.observe(this.hostElement,{subtree:!0,childList:!0})}disconnectedCallback(){this.mo?.disconnect()}async componentWillLoad(){this.isMenu="menu"===this.hostElement.slot,null===this.language&&await c(this.hostElement)}componentDidRender(){this.setValue(),this.rerender()}getRect(t){return t.getBoundingClientRect()}activateTab(t){this.styleLines(t,!0),this.styleLines(t,!1)}styleLines(t,i=!1){const a=this.getRect(this.tabListEl),e=this.tabListEl.scrollLeft,s=this.getRect(t),n=s.left+e-a.left,l=i?"active":"hover",r=i?"lineActive":"lineHovered";this[r].style.setProperty(`--pn-${l}-width`,s.width+"px"),this[r].style.setProperty(`--pn-${l}-offset`,n+"px"),this[r].style.setProperty(`--pn-${l}-opacity`,"1")}scrollIndicators(){const{scrollWidth:t,scrollLeft:i}=this.tabListEl,{clientWidth:a}=this.hostElement;this.showScrollArrows=t>a,this.arrowLeft=this.showScrollArrows&&i>0,this.arrowRight=this.showScrollArrows&&a+16+i<t}scroll({right:t=!1}={}){const i=this.tabListEl,{scrollLeft:a,clientWidth:e}=i;let s=a;const n=e-64;t?s+=n:s-=n,i.scrollTo({left:s,behavior:"smooth"})}translate(t){return m?.[t]?.[this.language||b]}render(){return n(l,{key:"7dca608244acd89c6506d10db8bd774055623f77"},n("nav",{key:"263e6774e93dd98d82282d9f591b4f2053c0421c",class:"pn-tablist",role:this.isMenu?null:"tablist","aria-label":this.label,"data-stacked":this.stackedicons,"data-small":!this.isMenu&&this.small,"data-large":this.isMenu,"data-scroll":this.showScrollArrows,ref:t=>this.tabListEl=t},n("slot",{key:"3a5a6f587b750c035f1b61b1184bf7d9fd843cd2"}),n("div",{key:"a21c49db6f1f38066d7b54d11faeb441cfbd52b1",class:"pn-tablist-line"},n("div",{key:"35f4d30ba1e7de4737dd65d38febd6cf0dc0ab41",ref:t=>this.lineActive=t,class:"pn-tablist-line-item pn-tablist-line-active"}),n("div",{key:"ab05a4b61abac290894cd93e89bd9de80c710189",ref:t=>this.lineHovered=t,class:"pn-tablist-line-item pn-tablist-line-hovered"}))),n("div",{key:"1845500af4535f9a7d4006fc781f52c7a31776d9",class:"pn-tablist-scroll"},n("pn-button",{key:"c7421e16d531fe9559b46a3e0fa8bdcb4bf5a142",class:"pn-tablist-arrow","data-show":this.arrowLeft,onClick:()=>this.scroll(),noTab:!0,appearance:"light",variant:"outlined",icon:r,iconOnly:!0,arialabel:this.translate("LEFT"),small:!0}),n("pn-button",{key:"a79c5096ee1f9ca79755b54db6bc0b05d3c8ac5a",class:"pn-tablist-arrow","data-show":this.arrowRight,onClick:()=>this.scroll({right:!0}),noTab:!0,appearance:"light",variant:"outlined",icon:o,iconOnly:!0,arialabel:this.translate("RIGHT"),small:!0})))}static get watchers(){return{value:[{setValue:0}],showScrollArrows:[{scrollHandler:0}]}}static get style(){return`${t("pn-tablist")}{width:100%;min-width:0;position:relative;border-bottom:0.0625em solid #d3cecb;display:block}${t("pn-tablist")} .pn-tablist,${t("pn-tablist")} ol,${t("pn-tablist")} ul{display:flex;width:100%;flex-direction:row;gap:1em;position:relative;list-style:none;padding:0;margin:0}${t("pn-tablist")} .pn-tablist[data-stacked] .pn-tab,${t("pn-tablist")} ol[data-stacked] .pn-tab,${t("pn-tablist")} ul[data-stacked] .pn-tab{margin:0.5em 0.25em 0.75em;gap:0.25em;flex-direction:column}${t("pn-tablist")} .pn-tablist[data-small] .pn-tab,${t("pn-tablist")} ol[data-small] .pn-tab,${t("pn-tablist")} ul[data-small] .pn-tab{margin:0.25em 0.25em 0.75em}${t("pn-tablist")} .pn-tablist[data-small] .pn-tab>*:not(${t("pn-icon")}),${t("pn-tablist")} ol[data-small] .pn-tab>*:not(${t("pn-icon")}),${t("pn-tablist")} ul[data-small] .pn-tab>*:not(${t("pn-icon")}){font-size:0.875em}${t("pn-tablist")} .pn-tablist[data-large] .pn-tab>*:not(${t("pn-icon")}),${t("pn-tablist")} ol[data-large] .pn-tab>*:not(${t("pn-icon")}),${t("pn-tablist")} ul[data-large] .pn-tab>*:not(${t("pn-icon")}){font-size:1.25em}${t("pn-tablist")} .pn-tablist[data-scroll],${t("pn-tablist")} ol[data-scroll],${t("pn-tablist")} ul[data-scroll]{overflow-y:hidden;overflow-x:auto;scroll-snap-type:x mandatory}${t("pn-tablist")} .pn-tablist::-webkit-scrollbar,${t("pn-tablist")} ol::-webkit-scrollbar,${t("pn-tablist")} ul::-webkit-scrollbar{display:none}${t("pn-tablist")} .pn-tablist-line{height:0.25em;position:absolute;bottom:0}${t("pn-tablist")} .pn-tablist-line-item{position:absolute;width:100%;height:inherit;border-radius:0.25em 0.25em 0 0;transform-origin:left center;opacity:0;transition-property:transform, opacity, width;transition-duration:0.4s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tablist")} .pn-tablist-line-item{transition-duration:0s;transition-delay:0s}}${t("pn-tablist")} .pn-tablist-line-active{z-index:1;background-color:#005d92;width:var(--pn-active-width);transform:translateX(var(--pn-active-offset));opacity:var(--pn-active-opacity)}${t("pn-tablist")} .pn-tablist-line-hovered{background-color:#00a0d6;width:var(--pn-hover-width);transform:translateX(var(--pn-hover-offset));opacity:var(--pn-hover-opacity)}${t("pn-tablist")} .pn-tablist-scroll{position:absolute;top:50%;left:0;right:0;pointer-events:none;transform:translateY(-50%);display:flex;justify-content:space-between;align-items:center;z-index:1;height:100%}${t("pn-tablist")} .pn-tablist-arrow{pointer-events:all;transform:scaleY(0);opacity:0;visibility:hidden;transition-property:transform, opacity, visibility;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tablist")} .pn-tablist-arrow{transition-duration:0s;transition-delay:0s}}${t("pn-tablist")} .pn-tablist-arrow[data-show]{opacity:1;visibility:visible;transform:scaleY(1)}`}},[772,"pn-tablist",{label:[1],value:[1537],small:[4],stackedicons:[4],language:[1],showScrollArrows:[32],arrowLeft:[32],arrowRight:[32]},[[0,"setActiveTab","setActiveTabHandler"],[9,"resize","rerender"],[0,"tabEnter","handleEnter"],[0,"tabLeave","handleLeave"]],{value:[{setValue:0}],showScrollArrows:[{scrollHandler:0}]}]),f=u,v=function(){"undefined"!=typeof customElements&&["pn-tablist","pn-button","pn-icon","pn-spinner"].forEach((i=>{switch(i){case"pn-tablist":customElements.get(t(t(i)))||customElements.define(t(t(i)),u);break;case"pn-button":customElements.get(t(t(i)))||p();break;case"pn-icon":customElements.get(t(t(i)))||d();break;case"pn-spinner":customElements.get(t(t(i)))||h()}}))};export{f as PnTablist,v as defineCustomElement}
5
+ import{transformTag as t,proxyCustomElement as i,HTMLElement as a,createEvent as e,forceUpdate as s,h as n,Host as l}from"@stencil/core/internal/client";import{a as r,c as o}from"./chevron_right.js";import{k as c,e as p}from"./helpers.js";import{d as b}from"./pn-button2.js";import{d as h}from"./pn-icon2.js";import{d}from"./pn-spinner2.js";var m={LEFT:{sv:"Bläddra åt vänster",en:"Scroll to the left",da:"Rul til venstre",fi:"Vieritä vasemmalle",no:"Rull til venstre"},RIGHT:{sv:"Bläddra åt höger",en:"Scroll to the right",da:"Rul til højre",fi:"Vieritä oikealle",no:"Rull til høyre"}};const u=i(class extends a{constructor(t){super(),!1!==t&&this.__registerHost(),this.tabchange=e(this,"tabchange",7)}mo;isMenu=!1;isTabHovered=!1;tabListEl;lineActive;lineHovered;tabElement;get hostElement(){return this}showScrollArrows=!1;arrowLeft=!1;arrowRight=!1;label;value;small;stackedicons=!1;language=null;tabchange;setValue(){const i=t("pn-tab");Array.from(this.hostElement.querySelectorAll(i)).forEach((t=>{t.activeTab=this.value}))}scrollHandler(){this.showScrollArrows?this.tabListEl.addEventListener("scroll",this.scrollIndicators.bind(this)):this.tabListEl.removeEventListener("scroll",this.scrollIndicators)}setActiveTabHandler({detail:t}){this.tabElement=t.el,requestAnimationFrame((()=>this.activateTab(t.el))),this.value!==t.val&&(this.value=t.val,this.tabchange.emit(this.value),this.tabElement.querySelector(".pn-tab").focus())}rerender(){requestAnimationFrame((()=>{this.scrollIndicators(),this.isTabHovered=!1}))}handleEnter(t){this.isTabHovered=!0,this.styleLines(t.target)}handleLeave(){this.isTabHovered=!1,setTimeout((()=>{this.isTabHovered||this.lineHovered.style.setProperty("--pn-hover-opacity","0")}),500)}connectedCallback(){this.mo=new MutationObserver((()=>{s(this.hostElement),this.setValue(),this.rerender()})),this.mo.observe(this.hostElement,{subtree:!0,childList:!0})}disconnectedCallback(){this.mo?.disconnect()}async componentWillLoad(){this.isMenu="menu"===this.hostElement.slot,null===this.language&&await c(this.hostElement)}componentDidRender(){this.setValue(),this.rerender()}getRect(t){return t.getBoundingClientRect()}activateTab(t){this.styleLines(t,!0),this.styleLines(t,!1)}styleLines(t,i=!1){const a=this.getRect(this.tabListEl),e=this.tabListEl.scrollLeft,s=this.getRect(t),n=s.left+e-a.left,l=i?"active":"hover",r=i?"lineActive":"lineHovered";this[r].style.setProperty(`--pn-${l}-width`,s.width+"px"),this[r].style.setProperty(`--pn-${l}-offset`,n+"px"),this[r].style.setProperty(`--pn-${l}-opacity`,"1")}scrollIndicators(){const{scrollWidth:t,scrollLeft:i}=this.tabListEl,{clientWidth:a}=this.hostElement;this.showScrollArrows=t>a,this.arrowLeft=this.showScrollArrows&&i>0,this.arrowRight=this.showScrollArrows&&a+16+i<t}scroll({right:t=!1}={}){const i=this.tabListEl,{scrollLeft:a,clientWidth:e}=i;let s=a;const n=e-64;t?s+=n:s-=n,i.scrollTo({left:s,behavior:"smooth"})}translate(t){return m?.[t]?.[this.language||p]}render(){return n(l,{key:"5e8d5b627e77c77e6de6bc560695f1acd5b1630d"},n("nav",{key:"a33459d6510b75b5fc72674ab18606c4806a4058",class:"pn-tablist",role:this.isMenu?null:"tablist","aria-label":this.label,"data-stacked":this.stackedicons,"data-small":!this.isMenu&&this.small,"data-large":this.isMenu,"data-scroll":this.showScrollArrows,ref:t=>this.tabListEl=t},n("slot",{key:"7bc0071b838903823c0c687385cd7d3311e83111"}),n("div",{key:"50a05b5c23f05341728a941f3285e33c0b4dea0b",class:"pn-tablist-line"},n("div",{key:"9f838979792831b3283e35e60328ef406a52115e",ref:t=>this.lineActive=t,class:"pn-tablist-line-item pn-tablist-line-active"}),n("div",{key:"06c6f200d2aa9eab372bcf5eee3b903864b2b7ff",ref:t=>this.lineHovered=t,class:"pn-tablist-line-item pn-tablist-line-hovered"}))),n("div",{key:"a43537577c3442186c66418cbaa26d48547c0828",class:"pn-tablist-scroll"},n("pn-button",{key:"7881274a4cffa56529a8c1684d38d7bc3af7ac66",class:"pn-tablist-arrow","data-show":this.arrowLeft,onClick:()=>this.scroll(),noTab:!0,appearance:"light",variant:"outlined",icon:r,iconOnly:!0,arialabel:this.translate("LEFT"),small:!0}),n("pn-button",{key:"0f38bf167cf2c8784242439c43950e5608699bed",class:"pn-tablist-arrow","data-show":this.arrowRight,onClick:()=>this.scroll({right:!0}),noTab:!0,appearance:"light",variant:"outlined",icon:o,iconOnly:!0,arialabel:this.translate("RIGHT"),small:!0})))}static get watchers(){return{value:[{setValue:0}],showScrollArrows:[{scrollHandler:0}]}}static get style(){return`${t("pn-tablist")}{width:100%;min-width:0;position:relative;border-bottom:0.0625em solid #d3cecb;display:block}${t("pn-tablist")} .pn-tablist,${t("pn-tablist")} ol,${t("pn-tablist")} ul{display:flex;width:100%;flex-direction:row;gap:1em;position:relative;list-style:none;padding:0;margin:0}${t("pn-tablist")} .pn-tablist[data-stacked] .pn-tab,${t("pn-tablist")} ol[data-stacked] .pn-tab,${t("pn-tablist")} ul[data-stacked] .pn-tab{margin:0.5em 0.25em 0.75em;gap:0.25em;flex-direction:column}${t("pn-tablist")} .pn-tablist[data-small] .pn-tab,${t("pn-tablist")} ol[data-small] .pn-tab,${t("pn-tablist")} ul[data-small] .pn-tab{margin:0.25em 0.25em 0.75em}${t("pn-tablist")} .pn-tablist[data-small] .pn-tab>*:not(${t("pn-icon")}),${t("pn-tablist")} ol[data-small] .pn-tab>*:not(${t("pn-icon")}),${t("pn-tablist")} ul[data-small] .pn-tab>*:not(${t("pn-icon")}){font-size:0.875em}${t("pn-tablist")} .pn-tablist[data-large] .pn-tab>*:not(${t("pn-icon")}),${t("pn-tablist")} ol[data-large] .pn-tab>*:not(${t("pn-icon")}),${t("pn-tablist")} ul[data-large] .pn-tab>*:not(${t("pn-icon")}){font-size:1.25em}${t("pn-tablist")} .pn-tablist[data-scroll],${t("pn-tablist")} ol[data-scroll],${t("pn-tablist")} ul[data-scroll]{overflow-y:hidden;overflow-x:auto;scroll-snap-type:x mandatory}${t("pn-tablist")} .pn-tablist::-webkit-scrollbar,${t("pn-tablist")} ol::-webkit-scrollbar,${t("pn-tablist")} ul::-webkit-scrollbar{display:none}${t("pn-tablist")} .pn-tablist-line{height:0.25em;position:absolute;bottom:0}${t("pn-tablist")} .pn-tablist-line-item{position:absolute;width:100%;height:inherit;border-radius:0.25em 0.25em 0 0;transform-origin:left center;opacity:0;transition-property:transform, opacity, width;transition-duration:0.4s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tablist")} .pn-tablist-line-item{transition-duration:0s;transition-delay:0s}}${t("pn-tablist")} .pn-tablist-line-active{z-index:1;background-color:#005d92;width:var(--pn-active-width);transform:translateX(var(--pn-active-offset));opacity:var(--pn-active-opacity)}${t("pn-tablist")} .pn-tablist-line-hovered{background-color:#00a0d6;width:var(--pn-hover-width);transform:translateX(var(--pn-hover-offset));opacity:var(--pn-hover-opacity)}${t("pn-tablist")} .pn-tablist-scroll{position:absolute;top:50%;left:0;right:0;pointer-events:none;transform:translateY(-50%);display:flex;justify-content:space-between;align-items:center;z-index:1;height:100%}${t("pn-tablist")} .pn-tablist-arrow{pointer-events:all;transform:scaleY(0);opacity:0;visibility:hidden;transition-property:transform, opacity, visibility;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tablist")} .pn-tablist-arrow{transition-duration:0s;transition-delay:0s}}${t("pn-tablist")} .pn-tablist-arrow[data-show]{opacity:1;visibility:visible;transform:scaleY(1)}`}},[772,"pn-tablist",{label:[1],value:[1537],small:[4],stackedicons:[4],language:[1],showScrollArrows:[32],arrowLeft:[32],arrowRight:[32]},[[0,"setActiveTab","setActiveTabHandler"],[9,"resize","rerender"],[0,"tabEnter","handleEnter"],[0,"tabLeave","handleLeave"]],{value:[{setValue:0}],showScrollArrows:[{scrollHandler:0}]}]),f=u,v=function(){"undefined"!=typeof customElements&&["pn-tablist","pn-button","pn-icon","pn-spinner"].forEach((i=>{switch(i){case"pn-tablist":customElements.get(t(t(i)))||customElements.define(t(t(i)),u);break;case"pn-button":customElements.get(t(t(i)))||b();break;case"pn-icon":customElements.get(t(t(i)))||h();break;case"pn-spinner":customElements.get(t(t(i)))||d()}}))};export{f as PnTablist,v as defineCustomElement}
@@ -2,4 +2,4 @@
2
2
  * Built with Stencil
3
3
  * By PostNord.
4
4
  */
5
- import{transformTag as t,proxyCustomElement as n,HTMLElement as e,h as i}from"@stencil/core/internal/client";import{d as o}from"./pn-icon2.js";const l=n(class extends e{constructor(t){super(),!1!==t&&this.__registerHost()}get hostElement(){return this}label;href;light=!1;icon;leftIcon=!1;download;hreflang;media;referrerpolicy;rel="noopener noreferrer";target;linkid;render(){return i("a",{key:"0641c9d91a5652eba8498546f1c2e64b3bf5c7f4",id:this.linkid,class:"pn-text-link",href:this.href,rel:this.rel,target:this.target,download:this.download,hreflang:this.hreflang,media:this.media,referrerPolicy:this.referrerpolicy,"data-icon":!!this.icon,"data-icon-left":this.leftIcon,"data-light":this.light},this.label,i("slot",{key:"dd448ea86844b810197fb2735025b9213984918f"}),this.icon&&i("pn-icon",{key:"4350858f2f87b0c35e472078ea30eb252a894651",icon:this.icon}))}static get style(){return`${t("pn-text-link")}{display:inline}${t("pn-text-link")} .pn-text-link{border-radius:0.25em;color:#005d92;font-weight:500;text-decoration:underline;font-size:1em;transition-property:color, outline-color, text-decoration-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-text-link")} .pn-text-link{transition-duration:0s;transition-delay:0s}}${t("pn-text-link")} .pn-text-link{outline:0.2rem solid transparent;outline-offset:0.2rem}${t("pn-text-link")} .pn-text-link:focus-visible{outline-color:#005d92}${t("pn-text-link")} .pn-text-link:hover{color:#0d234b;text-decoration-color:#0d234b}${t("pn-text-link")} .pn-text-link[data-icon]{display:inline-flex;gap:0.25em;align-items:center;text-decoration-color:transparent;padding:0.1em;border-radius:0.5em}${t("pn-text-link")} .pn-text-link[data-icon] .pn-icon-svg path{fill:#005d92}${t("pn-text-link")} .pn-text-link[data-icon]:hover{text-decoration-color:#0d234b}${t("pn-text-link")} .pn-text-link[data-icon]:hover .pn-icon-svg path,${t("pn-text-link")} .pn-text-link[data-icon]:focus-visible .pn-icon-svg path{fill:#0d234b}${t("pn-text-link")} .pn-text-link[data-icon][data-icon-left]{flex-direction:row-reverse}${t("pn-text-link")} .pn-text-link[data-light]{color:#ffffff}${t("pn-text-link")} .pn-text-link[data-light]:focus-visible{outline-color:#ffffff}${t("pn-text-link")} .pn-text-link[data-light]:hover{text-decoration-color:#ffffff}${t("pn-text-link")} .pn-text-link[data-light][data-icon] ${t("pn-icon")} .pn-icon-svg path{fill:#ffffff}`}},[772,"pn-text-link",{label:[1],href:[1],light:[4],icon:[1],leftIcon:[4,"left-icon"],download:[1],hreflang:[1],media:[1],referrerpolicy:[1],rel:[1],target:[1],linkid:[1]}]);function r(){"undefined"!=typeof customElements&&["pn-text-link","pn-icon"].forEach((n=>{switch(n){case"pn-text-link":customElements.get(t(t(n)))||customElements.define(t(t(n)),l);break;case"pn-icon":customElements.get(t(t(n)))||o()}}))}export{l as P,r as d}
5
+ import{transformTag as t,proxyCustomElement as n,HTMLElement as e,h as i}from"@stencil/core/internal/client";import{d as o}from"./pn-icon2.js";const l=n(class extends e{constructor(t){super(),!1!==t&&this.__registerHost()}get hostElement(){return this}label;href;light=!1;icon;leftIcon=!1;download;hreflang;media;referrerpolicy;rel="noopener noreferrer";target;linkid;render(){return i("a",{key:"c6ea5bb512bf4ea09b6003358805533d2230ec67",id:this.linkid,class:"pn-text-link",href:this.href,rel:this.rel,target:this.target,download:this.download,hreflang:this.hreflang,media:this.media,referrerPolicy:this.referrerpolicy,"data-icon":!!this.icon,"data-icon-left":this.leftIcon,"data-light":this.light},this.label,i("slot",{key:"17fa00f7ca96e51f512713cd344d9c8bfb160af1"}),this.icon&&i("pn-icon",{key:"99a0150b6b9be360f911c2afb66c728ae54d739b",icon:this.icon}))}static get style(){return`${t("pn-text-link")}{display:inline}${t("pn-text-link")} .pn-text-link{border-radius:0.25em;color:#005d92;font-weight:500;text-decoration:underline;font-size:1em;transition-property:color, outline-color, text-decoration-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-text-link")} .pn-text-link{transition-duration:0s;transition-delay:0s}}${t("pn-text-link")} .pn-text-link{outline:0.2rem solid transparent;outline-offset:0.2rem}${t("pn-text-link")} .pn-text-link:focus-visible{outline-color:#005d92}${t("pn-text-link")} .pn-text-link:hover{color:#0d234b;text-decoration-color:#0d234b}${t("pn-text-link")} .pn-text-link[data-icon]{display:inline-flex;gap:0.25em;align-items:center;text-decoration-color:transparent;padding:0.1em;border-radius:0.5em}${t("pn-text-link")} .pn-text-link[data-icon] .pn-icon-svg path{fill:#005d92}${t("pn-text-link")} .pn-text-link[data-icon]:hover{text-decoration-color:#0d234b}${t("pn-text-link")} .pn-text-link[data-icon]:hover .pn-icon-svg path,${t("pn-text-link")} .pn-text-link[data-icon]:focus-visible .pn-icon-svg path{fill:#0d234b}${t("pn-text-link")} .pn-text-link[data-icon][data-icon-left]{flex-direction:row-reverse}${t("pn-text-link")} .pn-text-link[data-light]{color:#ffffff}${t("pn-text-link")} .pn-text-link[data-light]:focus-visible{outline-color:#ffffff}${t("pn-text-link")} .pn-text-link[data-light]:hover{text-decoration-color:#ffffff}${t("pn-text-link")} .pn-text-link[data-light][data-icon] ${t("pn-icon")} .pn-icon-svg path{fill:#ffffff}`}},[772,"pn-text-link",{label:[1],href:[1],light:[4],icon:[1],leftIcon:[4,"left-icon"],download:[1],hreflang:[1],media:[1],referrerpolicy:[1],rel:[1],target:[1],linkid:[1]}]);function r(){"undefined"!=typeof customElements&&["pn-text-link","pn-icon"].forEach((n=>{switch(n){case"pn-text-link":customElements.get(t(t(n)))||customElements.define(t(t(n)),l);break;case"pn-icon":customElements.get(t(t(n)))||o()}}))}export{l as P,r as d}
@@ -2,4 +2,4 @@
2
2
  * Built with Stencil
3
3
  * By PostNord.
4
4
  */
5
- import{transformTag as e,proxyCustomElement as t,HTMLElement as a,h as r,Host as n}from"@stencil/core/internal/client";import{u as l}from"./helpers.js";const i=t(class extends a{constructor(e){super(),!1!==e&&this.__registerHost()}id="pn-textarea-"+l();idHelper=this.id+"-text";idError=this.id+"-error";get hostElement(){return this}label;helpertext;value="";name;placeholder;form;rows=2;cols=20;wrap="soft";maxlength;autocomplete="off";spellcheck=!1;resize=!1;required=!1;disabled=!1;readonly=!1;compact=!1;valid=!1;invalid=!1;error;pnId;pnAriaLabel;pnAriaLabelledby;textareaid;handleId(){this.idHelper=this.getId()+"-helpertext",this.idError=this.getId()+"-error"}setVal(e){this.value=e.target.value}hasHelperText(){return this.helpertext?.length>0||this.checkSlottedHelper()}hasErrorMessage(){return this.error?.length>0||this.checkSlottedError()}hasError(){return this.hasErrorMessage()||this.invalid||this.checkSlottedError()}checkSlottedHelper(){return!!this.hostElement.querySelector("[slot=helpertext]")}checkSlottedError(){return!!this.hostElement.querySelector("[slot=error]")}hideHelpertext(){return this.hasErrorMessage()||!this.hasHelperText()}hideError(){return!this.hasErrorMessage()}getId(){return this.pnId||this.textareaid||this.id}displayLabel(){return!!this.label}getAriaLabel(){return this.displayLabel()||this.pnAriaLabelledby?null:this.pnAriaLabel}getAriaLabelledby(){return this.displayLabel()||this.pnAriaLabel?null:this.pnAriaLabelledby}getAriaDescribedby(){const e=[];return this.hasErrorMessage()?e.push(this.idError):this.hasHelperText()&&e.push(this.idHelper),e.length?e.join(" "):null}renderLabel(){return r("label",{class:"pn-textarea-label",htmlFor:this.getId(),"data-compact":this.compact},r("span",null,this.label),this.maxlength>=1&&r("span",null,`${this.value?.length||0}/${this.maxlength}`))}render(){return r(n,{key:"30ea927b4d57c041164f7ccfd052121d3723591b"},r("div",{key:"2c927468a5159cd2544af2bd351df2b45a5abf55",class:"pn-textarea","data-valid":this.valid,"data-error":this.hasError(),"data-resize":this.resize},!this.compact&&this.renderLabel(),r("textarea",{key:"2f933bd8e3477c3f7010d676f4fde0f49e2ebc9e",class:"pn-textarea-element",id:this.getId(),value:this.value,name:this.name,placeholder:this.compact?this.placeholder||" ":this.placeholder,rows:this.rows,cols:this.cols,wrap:this.wrap,autocomplete:this.autocomplete,spellcheck:this.spellcheck,maxlength:this.maxlength,required:this.required,disabled:this.disabled,readonly:this.readonly,"aria-label":this.getAriaLabel(),"aria-labelledby":this.getAriaLabelledby(),"aria-describedby":this.getAriaDescribedby(),"aria-invalid":""+this.hasError(),"data-compact":this.compact,onInput:e=>this.setVal(e)}),this.compact&&this.renderLabel(),r("p",{key:"368de1a346ca5161b8e6da6170453cd68605e92c",id:this.idHelper,class:"pn-textarea-text",hidden:this.hideHelpertext()},r("span",{key:"055d5ea03484c61e64bb674bad2a8bc5bffb253e"},this.helpertext),r("slot",{key:"3782f2b397e46f3dd8e0d4253b1071b1d98ffb65",name:"helpertext"})),r("p",{key:"7a092d28df13950e4fba9e4df46c8e6176a70ae3",id:this.idError,class:"pn-textarea-text",role:"alert",hidden:this.hideError()},r("span",{key:"49ef6664c21f2a4281dd8f8919cfa0d66d7554fb"},this.error),r("slot",{key:"51819bfeff00a85706a4c60de35926e65e3cd22d",name:"error"}))))}static get watchers(){return{textareaid:[{handleId:0}],pnId:[{handleId:1}]}}static get style(){return`${e("pn-textarea")}{display:inline-flex;flex-direction:column}${e("pn-textarea")} .pn-textarea{position:relative}${e("pn-textarea")} .pn-textarea-label{cursor:pointer;display:flex;justify-content:space-between;align-items:flex-end;font-weight:400;color:#2d2013;margin:0 0 0.25em 0;gap:0.5em;-webkit-tap-highlight-color:transparent;transition-property:color, transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-textarea")} .pn-textarea-label{transition-duration:0s;transition-delay:0s}}${e("pn-textarea")} .pn-textarea-label[data-compact]{position:absolute;top:1.5625em;left:calc(var(--pn-input-offset-left, 0px) + 0.75em + 0.0625em);margin:0;pointer-events:none;align-items:center;height:1.5em;max-width:calc(100% - (var(--pn-input-offset-left, 0px) + 0.75em) - (var(--pn-input-offset-right, 0px) + 0.75em));transform:translateY(-50%) scale(1) translateZ(0);transform-origin:0 0;transition-delay:0.2s}${e("pn-textarea")} .pn-textarea-label[data-compact]>span{font-size:1em;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;line-height:1.5em}${e("pn-textarea")} .pn-textarea-label>span{font-size:0.875em}${e("pn-textarea")} .pn-textarea-label[data-compact]>span{background-color:#ffffff;color:#2d2013}${e("pn-textarea")} .pn-textarea-text{color:#5e554a;font-size:0.875em;font-weight:400;margin:0.25em 0 0 0;display:flex;flex-direction:column;gap:0.25em;text-align:left}${e("pn-textarea")} .pn-textarea-text[role=alert]{color:#a70707}${e("pn-textarea")} .pn-textarea-text[hidden]{display:none}${e("pn-textarea")} .pn-textarea-element{width:100%;resize:none;color:#2d2013;background-color:#ffffff;border:0.0625em solid #969087;border-radius:0.5em;padding:0.75em;font-family:inherit;font-size:1em;font-weight:500;line-height:1.5em;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}${e("pn-textarea")} .pn-textarea-element:-webkit-autofill,${e("pn-textarea")} .pn-textarea-element:-webkit-autofill:hover,${e("pn-textarea")} .pn-textarea-element:-webkit-autofill:focus,${e("pn-textarea")} .pn-textarea-element:-webkit-autofill:active{-webkit-box-shadow:0 0 0 10em #e0f8ff inset;-webkit-text-fill-color:#2d2013}${e("pn-textarea")} .pn-textarea-element{outline:0.2rem solid transparent;outline-offset:0.2rem}${e("pn-textarea")} .pn-textarea-element:focus-visible{outline-color:#005d92;background-color:#ffffff;border-color:#005d92}${e("pn-textarea")} .pn-textarea-element{transition-property:outline-color, background-color, border-color, color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-textarea")} .pn-textarea-element{transition-duration:0s;transition-delay:0s}}${e("pn-textarea")} .pn-textarea-element[data-compact]{text-align:left;padding-top:1.125em;padding-bottom:0.375em;max-width:unset}${e("pn-textarea")} .pn-textarea-element[data-compact]::placeholder{color:transparent}${e("pn-textarea")} .pn-textarea-element[data-compact]:focus+.pn-textarea-label,${e("pn-textarea")} .pn-textarea-element[data-compact]:not(:placeholder-shown)+.pn-textarea-label{transform:translateY(-85%) scale(0.75);transition-delay:0s}${e("pn-textarea")} .pn-textarea-element::placeholder{color:#5e554a;font-weight:normal}${e("pn-textarea")} .pn-textarea-element:hover{border-color:#005d92}${e("pn-textarea")} .pn-textarea-element:disabled{color:#5e554a;background-color:#f3f2f2;border-color:#f3f2f2}${e("pn-textarea")} .pn-textarea-element::-webkit-scrollbar{background-color:#ffffff;width:0.875em;border-radius:0.5em}${e("pn-textarea")} .pn-textarea-element::-webkit-scrollbar-track{background-color:#ffffff;border-radius:0.5em}${e("pn-textarea")} .pn-textarea-element::-webkit-scrollbar-thumb{cursor:pointer;background-color:#969087;border-radius:1em;border:0.25em solid #ffffff}${e("pn-textarea")} .pn-textarea-element::-webkit-scrollbar-thumb:hover{background-color:#5e554a}${e("pn-textarea")} .pn-textarea-element::-webkit-scrollbar-corner,${e("pn-textarea")} .pn-textarea-element::-webkit-scrollbar-button{display:none}${e("pn-textarea")} .pn-textarea-element:read-only{border-color:#ffffff}${e("pn-textarea")} .pn-textarea-element:disabled+.pn-textarea-label>span{background-color:#f3f2f2}${e("pn-textarea")} .pn-textarea-element::-webkit-resizer{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%0A%20%20%3Cpath%20d%3D%22M7%2017L17%207M12%2017L17%2012%22%20stroke%3D%22%23005D92%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E");background-repeat:no-repeat;background-position:center}${e("pn-textarea")} .pn-textarea[data-valid]>.pn-textarea-label{color:#005e41}${e("pn-textarea")} .pn-textarea[data-valid]>.pn-textarea-element{border-color:#005e41}${e("pn-textarea")} .pn-textarea[data-valid]>.pn-textarea-element:hover{border-color:#002f24}${e("pn-textarea")} .pn-textarea[data-valid]>.pn-textarea-element:focus-visible{background-color:#ffffff;border-color:#005e41;outline-color:#005e41}${e("pn-textarea")} .pn-textarea[data-valid]>.pn-textarea-element:-webkit-autofill,${e("pn-textarea")} .pn-textarea[data-valid]>.pn-textarea-element:-webkit-autofill:hover,${e("pn-textarea")} .pn-textarea[data-valid]>.pn-textarea-element:-webkit-autofill:focus,${e("pn-textarea")} .pn-textarea[data-valid]>.pn-textarea-element:-webkit-autofill:active{-webkit-box-shadow:0 0 0 10em #edfbf3 inset;-webkit-text-fill-color:#2d2013}${e("pn-textarea")} .pn-textarea[data-error]>.pn-textarea-label{color:#a70707}${e("pn-textarea")} .pn-textarea[data-error]>.pn-textarea-element{border-color:#a70707}${e("pn-textarea")} .pn-textarea[data-error]>.pn-textarea-element:hover{border-color:#500715}${e("pn-textarea")} .pn-textarea[data-error]>.pn-textarea-element:focus-visible{background-color:#ffffff;border-color:#a70707;outline-color:#a70707}${e("pn-textarea")} .pn-textarea[data-error]>.pn-textarea-element:-webkit-autofill,${e("pn-textarea")} .pn-textarea[data-error]>.pn-textarea-element:-webkit-autofill:hover,${e("pn-textarea")} .pn-textarea[data-error]>.pn-textarea-element:-webkit-autofill:focus,${e("pn-textarea")} .pn-textarea[data-error]>.pn-textarea-element:-webkit-autofill:active{-webkit-box-shadow:0 0 0 10em #fef7f6 inset;-webkit-text-fill-color:#2d2013}${e("pn-textarea")} .pn-textarea[data-resize]>.pn-textarea-element{resize:vertical}`}},[772,"pn-textarea",{label:[1],helpertext:[1],value:[1025],name:[1],placeholder:[1],form:[1],rows:[2],cols:[2],wrap:[1],maxlength:[2],autocomplete:[1],spellcheck:[4],resize:[4],required:[4],disabled:[4],readonly:[4],compact:[4],valid:[4],invalid:[4],error:[1],pnId:[1,"pn-id"],pnAriaLabel:[1,"pn-aria-label"],pnAriaLabelledby:[1,"pn-aria-labelledby"],textareaid:[1]},void 0,{textareaid:[{handleId:0}],pnId:[{handleId:1}]}]),o=i,s=function(){"undefined"!=typeof customElements&&["pn-textarea"].forEach((t=>{"pn-textarea"===t&&(customElements.get(e(e(t)))||customElements.define(e(e(t)),i))}))};export{o as PnTextarea,s as defineCustomElement}
5
+ import{transformTag as e,proxyCustomElement as t,HTMLElement as a,h as r,Host as n}from"@stencil/core/internal/client";import{u as l}from"./helpers.js";const i=t(class extends a{constructor(e){super(),!1!==e&&this.__registerHost()}id="pn-textarea-"+l();idHelper=this.id+"-text";idError=this.id+"-error";get hostElement(){return this}label;helpertext;value="";name;placeholder;form;rows=2;cols=20;wrap="soft";maxlength;autocomplete="off";spellcheck=!1;resize=!1;required=!1;disabled=!1;readonly=!1;compact=!1;valid=!1;invalid=!1;error;pnId;pnAriaLabel;pnAriaLabelledby;textareaid;handleId(){this.idHelper=this.getId()+"-helpertext",this.idError=this.getId()+"-error"}setVal(e){this.value=e.target.value}hasHelperText(){return this.helpertext?.length>0||this.checkSlottedHelper()}hasErrorMessage(){return this.error?.length>0||this.checkSlottedError()}hasError(){return this.hasErrorMessage()||this.invalid||this.checkSlottedError()}checkSlottedHelper(){return!!this.hostElement.querySelector("[slot=helpertext]")}checkSlottedError(){return!!this.hostElement.querySelector("[slot=error]")}hideHelpertext(){return this.hasErrorMessage()||!this.hasHelperText()}hideError(){return!this.hasErrorMessage()}getId(){return this.pnId||this.textareaid||this.id}displayLabel(){return!!this.label}getAriaLabel(){return this.displayLabel()||this.pnAriaLabelledby?null:this.pnAriaLabel}getAriaLabelledby(){return this.displayLabel()||this.pnAriaLabel?null:this.pnAriaLabelledby}getAriaDescribedby(){const e=[];return this.hasErrorMessage()?e.push(this.idError):this.hasHelperText()&&e.push(this.idHelper),e.length?e.join(" "):null}renderLabel(){return r("label",{class:"pn-textarea-label",htmlFor:this.getId(),"data-compact":this.compact},r("span",null,this.label),this.maxlength>=1&&r("span",null,`${this.value?.length||0}/${this.maxlength}`))}render(){return r(n,{key:"046f1fdb7dd6f834116a0488a90da361d7b91b1c"},r("div",{key:"f0ffbb17ac4dfe2074deba72fbc26e7988dafeb6",class:"pn-textarea","data-valid":this.valid,"data-error":this.hasError(),"data-resize":this.resize},!this.compact&&this.renderLabel(),r("textarea",{key:"aa82eb1bbe99f801941cb155fe1ee6af1f55b805",class:"pn-textarea-element",id:this.getId(),value:this.value,name:this.name,placeholder:this.compact?this.placeholder||" ":this.placeholder,rows:this.rows,cols:this.cols,wrap:this.wrap,autocomplete:this.autocomplete,spellcheck:this.spellcheck,maxlength:this.maxlength,required:this.required,disabled:this.disabled,readonly:this.readonly,"aria-label":this.getAriaLabel(),"aria-labelledby":this.getAriaLabelledby(),"aria-describedby":this.getAriaDescribedby(),"aria-invalid":""+this.hasError(),"data-compact":this.compact,onInput:e=>this.setVal(e)}),this.compact&&this.renderLabel(),r("p",{key:"3b258a6423b92fb8fdc411db861be42c17f0b0d1",id:this.idHelper,class:"pn-textarea-text",hidden:this.hideHelpertext()},r("span",{key:"be839a0794224ee1766e56b09858df2050d7199a"},this.helpertext),r("slot",{key:"631642b2a335fb0009cc110f177cbe4851d5a0fb",name:"helpertext"})),r("p",{key:"7f91ffb2a81e5dd9a78187d86aa71aca6e2b43d7",id:this.idError,class:"pn-textarea-text",role:"alert",hidden:this.hideError()},r("span",{key:"4d8d749e257bb292c8e0b982354e9a7add06b50b"},this.error),r("slot",{key:"7178418c4bf5cbe7b2bc8de6f586766e3cbc73c9",name:"error"}))))}static get watchers(){return{textareaid:[{handleId:0}],pnId:[{handleId:1}]}}static get style(){return`${e("pn-textarea")}{display:inline-flex;flex-direction:column}${e("pn-textarea")} .pn-textarea{position:relative}${e("pn-textarea")} .pn-textarea-label{cursor:pointer;display:flex;justify-content:space-between;align-items:flex-end;font-weight:400;color:#2d2013;margin:0 0 0.25em 0;gap:0.5em;-webkit-tap-highlight-color:transparent;transition-property:color, transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-textarea")} .pn-textarea-label{transition-duration:0s;transition-delay:0s}}${e("pn-textarea")} .pn-textarea-label[data-compact]{position:absolute;top:1.5625em;left:calc(var(--pn-input-offset-left, 0px) + 0.75em + 0.0625em);margin:0;pointer-events:none;align-items:center;height:1.5em;max-width:calc(100% - (var(--pn-input-offset-left, 0px) + 0.75em) - (var(--pn-input-offset-right, 0px) + 0.75em));transform:translateY(-50%) scale(1) translateZ(0);transform-origin:0 0;transition-delay:0.2s}${e("pn-textarea")} .pn-textarea-label[data-compact]>span{font-size:1em;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;line-height:1.5em}${e("pn-textarea")} .pn-textarea-label>span{font-size:0.875em}${e("pn-textarea")} .pn-textarea-label[data-compact]>span{background-color:#ffffff;color:#2d2013}${e("pn-textarea")} .pn-textarea-text{color:#5e554a;font-size:0.875em;font-weight:400;margin:0.25em 0 0 0;display:flex;flex-direction:column;gap:0.25em;text-align:left}${e("pn-textarea")} .pn-textarea-text[role=alert]{color:#a70707}${e("pn-textarea")} .pn-textarea-text[hidden]{display:none}${e("pn-textarea")} .pn-textarea-element{width:100%;resize:none;color:#2d2013;background-color:#ffffff;border:0.0625em solid #969087;border-radius:0.5em;padding:0.75em;font-family:inherit;font-size:1em;font-weight:500;line-height:1.5em;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}${e("pn-textarea")} .pn-textarea-element:-webkit-autofill,${e("pn-textarea")} .pn-textarea-element:-webkit-autofill:hover,${e("pn-textarea")} .pn-textarea-element:-webkit-autofill:focus,${e("pn-textarea")} .pn-textarea-element:-webkit-autofill:active{-webkit-box-shadow:0 0 0 10em #e0f8ff inset;-webkit-text-fill-color:#2d2013}${e("pn-textarea")} .pn-textarea-element{outline:0.2rem solid transparent;outline-offset:0.2rem}${e("pn-textarea")} .pn-textarea-element:focus-visible{outline-color:#005d92;background-color:#ffffff;border-color:#005d92}${e("pn-textarea")} .pn-textarea-element{transition-property:outline-color, background-color, border-color, color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-textarea")} .pn-textarea-element{transition-duration:0s;transition-delay:0s}}${e("pn-textarea")} .pn-textarea-element[data-compact]{text-align:left;padding-top:1.125em;padding-bottom:0.375em;max-width:unset}${e("pn-textarea")} .pn-textarea-element[data-compact]::placeholder{color:transparent}${e("pn-textarea")} .pn-textarea-element[data-compact]:focus+.pn-textarea-label,${e("pn-textarea")} .pn-textarea-element[data-compact]:not(:placeholder-shown)+.pn-textarea-label{transform:translateY(-85%) scale(0.75);transition-delay:0s}${e("pn-textarea")} .pn-textarea-element::placeholder{color:#5e554a;font-weight:normal}${e("pn-textarea")} .pn-textarea-element:hover{border-color:#005d92}${e("pn-textarea")} .pn-textarea-element:disabled{color:#5e554a;background-color:#f3f2f2;border-color:#f3f2f2}${e("pn-textarea")} .pn-textarea-element::-webkit-scrollbar{background-color:#ffffff;width:0.875em;border-radius:0.5em}${e("pn-textarea")} .pn-textarea-element::-webkit-scrollbar-track{background-color:#ffffff;border-radius:0.5em}${e("pn-textarea")} .pn-textarea-element::-webkit-scrollbar-thumb{cursor:pointer;background-color:#969087;border-radius:1em;border:0.25em solid #ffffff}${e("pn-textarea")} .pn-textarea-element::-webkit-scrollbar-thumb:hover{background-color:#5e554a}${e("pn-textarea")} .pn-textarea-element::-webkit-scrollbar-corner,${e("pn-textarea")} .pn-textarea-element::-webkit-scrollbar-button{display:none}${e("pn-textarea")} .pn-textarea-element:read-only{border-color:#ffffff}${e("pn-textarea")} .pn-textarea-element:disabled+.pn-textarea-label>span{background-color:#f3f2f2}${e("pn-textarea")} .pn-textarea-element::-webkit-resizer{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%0A%20%20%3Cpath%20d%3D%22M7%2017L17%207M12%2017L17%2012%22%20stroke%3D%22%23005D92%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E");background-repeat:no-repeat;background-position:center}${e("pn-textarea")} .pn-textarea[data-valid]>.pn-textarea-label{color:#005e41}${e("pn-textarea")} .pn-textarea[data-valid]>.pn-textarea-element{border-color:#005e41}${e("pn-textarea")} .pn-textarea[data-valid]>.pn-textarea-element:hover{border-color:#002f24}${e("pn-textarea")} .pn-textarea[data-valid]>.pn-textarea-element:focus-visible{background-color:#ffffff;border-color:#005e41;outline-color:#005e41}${e("pn-textarea")} .pn-textarea[data-valid]>.pn-textarea-element:-webkit-autofill,${e("pn-textarea")} .pn-textarea[data-valid]>.pn-textarea-element:-webkit-autofill:hover,${e("pn-textarea")} .pn-textarea[data-valid]>.pn-textarea-element:-webkit-autofill:focus,${e("pn-textarea")} .pn-textarea[data-valid]>.pn-textarea-element:-webkit-autofill:active{-webkit-box-shadow:0 0 0 10em #edfbf3 inset;-webkit-text-fill-color:#2d2013}${e("pn-textarea")} .pn-textarea[data-error]>.pn-textarea-label{color:#a70707}${e("pn-textarea")} .pn-textarea[data-error]>.pn-textarea-element{border-color:#a70707}${e("pn-textarea")} .pn-textarea[data-error]>.pn-textarea-element:hover{border-color:#500715}${e("pn-textarea")} .pn-textarea[data-error]>.pn-textarea-element:focus-visible{background-color:#ffffff;border-color:#a70707;outline-color:#a70707}${e("pn-textarea")} .pn-textarea[data-error]>.pn-textarea-element:-webkit-autofill,${e("pn-textarea")} .pn-textarea[data-error]>.pn-textarea-element:-webkit-autofill:hover,${e("pn-textarea")} .pn-textarea[data-error]>.pn-textarea-element:-webkit-autofill:focus,${e("pn-textarea")} .pn-textarea[data-error]>.pn-textarea-element:-webkit-autofill:active{-webkit-box-shadow:0 0 0 10em #fef7f6 inset;-webkit-text-fill-color:#2d2013}${e("pn-textarea")} .pn-textarea[data-resize]>.pn-textarea-element{resize:vertical}`}},[772,"pn-textarea",{label:[1],helpertext:[1],value:[1025],name:[1],placeholder:[1],form:[1],rows:[2],cols:[2],wrap:[1],maxlength:[2],autocomplete:[1],spellcheck:[4],resize:[4],required:[4],disabled:[4],readonly:[4],compact:[4],valid:[4],invalid:[4],error:[1],pnId:[1,"pn-id"],pnAriaLabel:[1,"pn-aria-label"],pnAriaLabelledby:[1,"pn-aria-labelledby"],textareaid:[1]},void 0,{textareaid:[{handleId:0}],pnId:[{handleId:1}]}]),o=i,s=function(){"undefined"!=typeof customElements&&["pn-textarea"].forEach((t=>{"pn-textarea"===t&&(customElements.get(e(e(t)))||customElements.define(e(e(t)),i))}))};export{o as PnTextarea,s as defineCustomElement}
@@ -2,4 +2,4 @@
2
2
  * Built with Stencil
3
3
  * By PostNord.
4
4
  */
5
- import{transformTag as t,proxyCustomElement as e,HTMLElement as i,createEvent as n,forceUpdate as l,h as o,Host as a}from"@stencil/core/internal/client";import{o as r}from"./open_in_new.js";import{o as s}from"./helpers.js";import{d as c}from"./pn-icon2.js";import{d as p}from"./pn-illustration2.js";const d=e(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.pnTile=n(this,"pnTile",7)}mo;tile;illustrationSlot;visibleOutline=!1;get hostElement(){return this}label;text;url;target;rel="noopener noreferrer";illustration;icon;horizontal=!1;pnTile;connectedCallback(){this.mo=new MutationObserver((()=>l(this.hostElement))),this.mo.observe(this.hostElement,{subtree:!0,childList:!0})}disconnectedCallback(){this.mo?.disconnect()}isExternal(){return"_blank"===this.target}showIcon(){return!!this.icon&&!this.showSlotIllustration()}showPropIllustration(){return!!this.illustration&&!this.showSlotIllustration()}showSlotIllustration(){return!!this.illustrationSlot?.querySelector('[slot="illustration"]')}showImage(){return this.showIcon()||this.showPropIllustration()||this.showSlotIllustration()}handleFocus({type:t,target:e}){this.visibleOutline="focus"===t&&e.matches(":focus-visible")}clickHandler(t){s(t,this.tile),this.pnTile.emit({click:t})}render(){return o(a,{key:"a29b0f244288bdff245e275a9ab3d11bec87a476"},o("div",{key:"beed67096e5bd7448416b5c0422596f2e4d61be9",class:"pn-tile","data-horizontal":this.horizontal,"data-href":!!this.url,"data-focus":this.visibleOutline,ref:t=>this.tile=t},o("div",{key:"458a7df237ec2fc27c33c3f3306d880f5ba6ab11",class:"pn-tile-illustration","data-circle":!!this.url,"data-icon":this.showIcon(),role:"presentation",hidden:!this.showImage()},this.showPropIllustration()?o("pn-illustration",{illustration:this.illustration}):this.showIcon()&&o("pn-icon",{color:"blue700",icon:this.icon}),o("div",{key:"bd70e9eb9e29cd48d29170e05f279019005d564a",class:"pn-tile-illustration-slot",hidden:!this.showSlotIllustration(),ref:t=>this.illustrationSlot=t},o("slot",{key:"c22dee0ca1663e47fbbc2625af6060ebc1fec4d5",name:"illustration"}))),o("div",{key:"0dbb257acaf45f22a16f4bd4616d1a862c281ee9",class:"pn-tile-text"},o("h3",{key:"c2459327b7ac973e8f7f4c372c6457d70db4bfde",class:"pn-tile-title"},this.url?o("a",{class:"pn-tile-link",href:this.url,target:this.target,rel:!this.rel&&this.isExternal()?"noopener noreferrer":this.rel,onClick:t=>this.clickHandler(t),onFocus:t=>this.handleFocus(t),onBlur:t=>this.handleFocus(t)},this.label):this.label,this.isExternal()&&o("pn-icon",{key:"661061f5e03c7b658967e1c9e306857b730203b0",icon:r,small:!0,color:"blue700"})),o("div",{key:"8c51850bc85b2223dcd67c81d8f15a78ec9ef3cc",class:"pn-tile-slot"},!!this.text&&o("p",{key:"9759d3fd1a5a5219dc22a31ab874eab2475e14d8",class:"pn-tile-paragraph"},this.text),o("slot",{key:"b3e0e1442bfb5cc003e696be617c879919facbbc"})))))}static get style(){return`${t("pn-tile")}{position:relative;display:block}${t("pn-tile")} .pn-tile{position:relative;overflow:hidden;word-break:break-word;text-align:center;border-radius:0.5em;padding:clamp(0.75em, 3vw, 1.5em);height:100%;color:#2d2013;background-color:#ffffff;box-shadow:0em 0.0625em 0.125em 0em rgba(20, 20, 20, 0.11), 0em 0.1875em 0.4375em 0em rgba(0, 0, 0, 0.13);display:flex;flex-wrap:wrap;flex-direction:column;align-items:center;justify-content:flex-start;gap:clamp(1em, 5vw, 1.5em);outline:0.2rem solid transparent;outline-offset:0.2rem;transition-property:box-shadow, background-color, outline-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tile")} .pn-tile{transition-duration:0s;transition-delay:0s}}${t("pn-tile")} .pn-tile .pn-ripple{animation:ripple 0.4s cubic-bezier(0.7, 0, 0.3, 1);position:absolute;border-radius:50%;background-color:#005d92;transform:translate(-50%, -50%) scale(0);opacity:0.1;pointer-events:none;z-index:3}@keyframes ripple{to{transform:translate(-50%, -50%) scale(1);opacity:0}}${t("pn-tile")} .pn-tile[data-horizontal]{text-align:left;flex-direction:row;flex-wrap:nowrap;gap:clamp(1em, 5vw, 1.5em)}${t("pn-tile")} .pn-tile[data-horizontal] .pn-tile-illustration[data-circle]:before{clip-path:ellipse(0% 100% at 0% 50%)}${t("pn-tile")} .pn-tile[data-horizontal] .pn-tile-text{flex-grow:2}${t("pn-tile")} .pn-tile[data-href][data-focus]{outline-color:#005d92;box-shadow:0em 0em 0em 0em rgba(20, 20, 20, 0.11), 0em 0em 0em 0em rgba(0, 0, 0, 0.13)}${t("pn-tile")} .pn-tile[data-href]:hover{background-color:rgba(183, 235, 252, 0.3)}${t("pn-tile")} .pn-tile[data-href]:hover .pn-tile-illustration[data-circle]:before,${t("pn-tile")} .pn-tile[data-href]:focus-within .pn-tile-illustration[data-circle]:before{clip-path:ellipse(100% 50% at 50% -25%)}${t("pn-tile")} .pn-tile[data-href]:hover[data-horizontal] .pn-tile-illustration[data-circle]:before,${t("pn-tile")} .pn-tile[data-href]:focus-within[data-horizontal] .pn-tile-illustration[data-circle]:before{clip-path:ellipse(50% 100% at -25% 50%)}${t("pn-tile")} .pn-tile[data-href]:hover .pn-tile-link,${t("pn-tile")} .pn-tile[data-href]:focus-within .pn-tile-link{color:#0d234b;text-decoration-color:#0d234b}${t("pn-tile")} .pn-tile[data-href]:hover ${t("pn-icon")} .pn-icon-svg path,${t("pn-tile")} .pn-tile[data-href]:focus-within ${t("pn-icon")} .pn-icon-svg path{fill:#0d234b}${t("pn-tile")} .pn-tile-illustration{z-index:2;flex:1 1;max-width:7.5em;max-height:7.5em}${t("pn-tile")} .pn-tile-illustration[data-icon]{flex:0 0}${t("pn-tile")} .pn-tile-illustration[data-icon] ${t("pn-icon")}{padding:1em;border-radius:50%;background-color:#e0f8ff}${t("pn-tile")} .pn-tile-illustration[data-icon] ${t("pn-icon")}>svg{font-size:2em}${t("pn-tile")} .pn-tile-illustration-slot{display:block;height:100%;width:100%}${t("pn-tile")} .pn-tile-illustration[data-circle]:before{content:"";position:absolute;z-index:-1;top:0;left:0;width:100%;height:100%;background-color:rgba(183, 235, 252, 0.7);background-color:rgba(183, 235, 252, 0.7);clip-path:ellipse(100% 0% at 50% 0%);transition-property:clip-path;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tile")} .pn-tile-illustration[data-circle]:before{transition-duration:0s;transition-delay:0s}}${t("pn-tile")} .pn-tile-text{z-index:3;flex:1 1;display:flex;flex-direction:column;gap:0.5em}${t("pn-tile")} .pn-tile-link{cursor:pointer;color:#005d92;text-decoration:underline;text-decoration-color:transparent;-webkit-tap-highlight-color:transparent;transition-property:color, text-decoration-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tile")} .pn-tile-link{transition-duration:0s;transition-delay:0s}}${t("pn-tile")} .pn-tile-link:focus{outline:0;text-decoration-color:#0d234b;color:#0d234b}${t("pn-tile")} .pn-tile-link:after{content:"";position:absolute;top:0;left:0;height:100%;width:100%;opacity:0}${t("pn-tile")} .pn-tile-title{font-family:inherit;font-weight:700;font-size:clamp(1.25em, 3vw, 1.5em);margin:0em}${t("pn-tile")} .pn-tile-title ${t("pn-icon")}{margin-left:0.25em;vertical-align:middle}${t("pn-tile")} .pn-tile-slot{font-weight:400;color:#5e554a;display:flex;flex-direction:column;gap:0.25em}${t("pn-tile")} .pn-tile-paragraph,${t("pn-tile")} .pn-tile p{font-size:0.875em}${t("pn-tile")} .pn-tile-paragraph:last-child,${t("pn-tile")} .pn-tile p:last-child{margin:0em}`}},[772,"pn-tile",{label:[1],text:[1],url:[1],target:[1],rel:[1],illustration:[1],icon:[1],horizontal:[4],visibleOutline:[32]}]),h=d,f=function(){"undefined"!=typeof customElements&&["pn-tile","pn-icon","pn-illustration"].forEach((e=>{switch(e){case"pn-tile":customElements.get(t(t(e)))||customElements.define(t(t(e)),d);break;case"pn-icon":customElements.get(t(t(e)))||c();break;case"pn-illustration":customElements.get(t(t(e)))||p()}}))};export{h as PnTile,f as defineCustomElement}
5
+ import{transformTag as t,proxyCustomElement as e,HTMLElement as i,createEvent as n,forceUpdate as l,h as o,Host as a}from"@stencil/core/internal/client";import{o as r}from"./open_in_new.js";import{o as s}from"./helpers.js";import{d as p}from"./pn-icon2.js";import{d as c}from"./pn-illustration2.js";const d=e(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.pnTile=n(this,"pnTile",7)}mo;tile;illustrationSlot;visibleOutline=!1;get hostElement(){return this}label;text;url;target;rel="noopener noreferrer";illustration;icon;horizontal=!1;pnTile;connectedCallback(){this.mo=new MutationObserver((()=>l(this.hostElement))),this.mo.observe(this.hostElement,{subtree:!0,childList:!0})}disconnectedCallback(){this.mo?.disconnect()}isExternal(){return"_blank"===this.target}showIcon(){return!!this.icon&&!this.showSlotIllustration()}showPropIllustration(){return!!this.illustration&&!this.showSlotIllustration()}showSlotIllustration(){return!!this.illustrationSlot?.querySelector('[slot="illustration"]')}showImage(){return this.showIcon()||this.showPropIllustration()||this.showSlotIllustration()}handleFocus({type:t,target:e}){this.visibleOutline="focus"===t&&e.matches(":focus-visible")}clickHandler(t){s(t,this.tile),this.pnTile.emit({click:t})}render(){return o(a,{key:"127727acb1596f91d84fce39bb15da17557ab760"},o("div",{key:"afc40764a1e45b51127f4622758678351d6c6c4e",class:"pn-tile","data-horizontal":this.horizontal,"data-href":!!this.url,"data-focus":this.visibleOutline,ref:t=>this.tile=t},o("div",{key:"32546ad6c86dd3ca850b4161c5672fdfc612ccf4",class:"pn-tile-illustration","data-circle":!!this.url,"data-icon":this.showIcon(),role:"presentation",hidden:!this.showImage()},this.showPropIllustration()?o("pn-illustration",{illustration:this.illustration}):this.showIcon()&&o("pn-icon",{color:"blue700",icon:this.icon}),o("div",{key:"4bc8653775913c7c3f5437b724905833136d6305",class:"pn-tile-illustration-slot",hidden:!this.showSlotIllustration(),ref:t=>this.illustrationSlot=t},o("slot",{key:"4d1658c813db7e2b4b6f2c32ce081384a576cf2d",name:"illustration"}))),o("div",{key:"f51d689d6d72a039d83adbdc28d6b6de2953e610",class:"pn-tile-text"},o("h3",{key:"904c4fb3f4578842cebef57f810314fc41e47ab5",class:"pn-tile-title"},this.url?o("a",{class:"pn-tile-link",href:this.url,target:this.target,rel:!this.rel&&this.isExternal()?"noopener noreferrer":this.rel,onClick:t=>this.clickHandler(t),onFocus:t=>this.handleFocus(t),onBlur:t=>this.handleFocus(t)},this.label):this.label,this.isExternal()&&o("pn-icon",{key:"1bbebd1324580d07ef646a272b0f73396a6ff7db",icon:r,small:!0,color:"blue700"})),o("div",{key:"b223d1cda348abe5dc4c07e4d52d33580b6fdf67",class:"pn-tile-slot"},!!this.text&&o("p",{key:"6e79f2654198dfe5d1f3dab7cd0527174393b00e",class:"pn-tile-paragraph"},this.text),o("slot",{key:"33a4dfe4e18147785372a56c19b78e8961ad1ccb"})))))}static get style(){return`${t("pn-tile")}{position:relative;display:block}${t("pn-tile")} .pn-tile{position:relative;overflow:hidden;word-break:break-word;text-align:center;border-radius:0.5em;padding:clamp(0.75em, 3vw, 1.5em);height:100%;color:#2d2013;background-color:#ffffff;box-shadow:0em 0.0625em 0.125em 0em rgba(20, 20, 20, 0.11), 0em 0.1875em 0.4375em 0em rgba(0, 0, 0, 0.13);display:flex;flex-wrap:wrap;flex-direction:column;align-items:center;justify-content:flex-start;gap:clamp(1em, 5vw, 1.5em);outline:0.2rem solid transparent;outline-offset:0.2rem;transition-property:box-shadow, background-color, outline-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tile")} .pn-tile{transition-duration:0s;transition-delay:0s}}${t("pn-tile")} .pn-tile .pn-ripple{animation:ripple 0.4s cubic-bezier(0.7, 0, 0.3, 1);position:absolute;border-radius:50%;background-color:#005d92;transform:translate(-50%, -50%) scale(0);opacity:0.1;pointer-events:none;z-index:3}@keyframes ripple{to{transform:translate(-50%, -50%) scale(1);opacity:0}}${t("pn-tile")} .pn-tile[data-horizontal]{text-align:left;flex-direction:row;flex-wrap:nowrap;gap:clamp(1em, 5vw, 1.5em)}${t("pn-tile")} .pn-tile[data-horizontal] .pn-tile-illustration[data-circle]:before{clip-path:ellipse(0% 100% at 0% 50%)}${t("pn-tile")} .pn-tile[data-horizontal] .pn-tile-text{flex-grow:2}${t("pn-tile")} .pn-tile[data-href][data-focus]{outline-color:#005d92;box-shadow:0em 0em 0em 0em rgba(20, 20, 20, 0.11), 0em 0em 0em 0em rgba(0, 0, 0, 0.13)}${t("pn-tile")} .pn-tile[data-href]:hover{background-color:rgba(183, 235, 252, 0.3)}${t("pn-tile")} .pn-tile[data-href]:hover .pn-tile-illustration[data-circle]:before,${t("pn-tile")} .pn-tile[data-href]:focus-within .pn-tile-illustration[data-circle]:before{clip-path:ellipse(100% 50% at 50% -25%)}${t("pn-tile")} .pn-tile[data-href]:hover[data-horizontal] .pn-tile-illustration[data-circle]:before,${t("pn-tile")} .pn-tile[data-href]:focus-within[data-horizontal] .pn-tile-illustration[data-circle]:before{clip-path:ellipse(50% 100% at -25% 50%)}${t("pn-tile")} .pn-tile[data-href]:hover .pn-tile-link,${t("pn-tile")} .pn-tile[data-href]:focus-within .pn-tile-link{color:#0d234b;text-decoration-color:#0d234b}${t("pn-tile")} .pn-tile[data-href]:hover ${t("pn-icon")} .pn-icon-svg path,${t("pn-tile")} .pn-tile[data-href]:focus-within ${t("pn-icon")} .pn-icon-svg path{fill:#0d234b}${t("pn-tile")} .pn-tile-illustration{z-index:2;flex:1 1;max-width:7.5em;max-height:7.5em}${t("pn-tile")} .pn-tile-illustration[data-icon]{flex:0 0}${t("pn-tile")} .pn-tile-illustration[data-icon] ${t("pn-icon")}{padding:1em;border-radius:50%;background-color:#e0f8ff}${t("pn-tile")} .pn-tile-illustration[data-icon] ${t("pn-icon")}>svg{font-size:2em}${t("pn-tile")} .pn-tile-illustration-slot{display:block;height:100%;width:100%}${t("pn-tile")} .pn-tile-illustration[data-circle]:before{content:"";position:absolute;z-index:-1;top:0;left:0;width:100%;height:100%;background-color:rgba(183, 235, 252, 0.7);background-color:rgba(183, 235, 252, 0.7);clip-path:ellipse(100% 0% at 50% 0%);transition-property:clip-path;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tile")} .pn-tile-illustration[data-circle]:before{transition-duration:0s;transition-delay:0s}}${t("pn-tile")} .pn-tile-text{z-index:3;flex:1 1;display:flex;flex-direction:column;gap:0.5em}${t("pn-tile")} .pn-tile-link{cursor:pointer;color:#005d92;text-decoration:underline;text-decoration-color:transparent;-webkit-tap-highlight-color:transparent;transition-property:color, text-decoration-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tile")} .pn-tile-link{transition-duration:0s;transition-delay:0s}}${t("pn-tile")} .pn-tile-link:focus{outline:0;text-decoration-color:#0d234b;color:#0d234b}${t("pn-tile")} .pn-tile-link:after{content:"";position:absolute;top:0;left:0;height:100%;width:100%;opacity:0}${t("pn-tile")} .pn-tile-title{font-family:inherit;font-weight:700;font-size:clamp(1.25em, 3vw, 1.5em);margin:0em}${t("pn-tile")} .pn-tile-title ${t("pn-icon")}{margin-left:0.25em;vertical-align:middle}${t("pn-tile")} .pn-tile-slot{font-weight:400;color:#5e554a;display:flex;flex-direction:column;gap:0.25em}${t("pn-tile")} .pn-tile-paragraph,${t("pn-tile")} .pn-tile p{font-size:0.875em}${t("pn-tile")} .pn-tile-paragraph:last-child,${t("pn-tile")} .pn-tile p:last-child{margin:0em}`}},[772,"pn-tile",{label:[1],text:[1],url:[1],target:[1],rel:[1],illustration:[1],icon:[1],horizontal:[4],visibleOutline:[32]}]),h=d,f=function(){"undefined"!=typeof customElements&&["pn-tile","pn-icon","pn-illustration"].forEach((e=>{switch(e){case"pn-tile":customElements.get(t(t(e)))||customElements.define(t(t(e)),d);break;case"pn-icon":customElements.get(t(t(e)))||p();break;case"pn-illustration":customElements.get(t(t(e)))||c()}}))};export{h as PnTile,f as defineCustomElement}
@@ -2,4 +2,4 @@
2
2
  * Built with Stencil
3
3
  * By PostNord.
4
4
  */
5
- import{transformTag as e,proxyCustomElement as t,HTMLElement as n,h as i,Host as o}from"@stencil/core/internal/client";import{u as l}from"./helpers.js";import{d as g}from"./pn-spinner2.js";const r=t(class extends n{constructor(e){super(),!1!==e&&this.__registerHost()}id="pn-toggle-"+l();idHelper=this.id+"-helper";get hostElement(){return this}label;helpertext;value=null;name=null;checked=!1;required=!1;disabled=!1;small=!1;large=!1;loading=!1;pnId;pnAriaLabel;pnAriaLabelledby;toggleid;handleHelperId(){this.idHelper=this.getId()+"-helper"}getId(){return this.pnId||this.toggleid||this.id}getSpinnerSize(){return this.small?1:this.large?1.25:1.125}hasHelpertextProp(){return!!this.helpertext}hasHelpertextSlot(){return!!this.hostElement.querySelector('[slot="helpertext"]')}showHelpertext(){return this.hasHelpertextProp()||this.hasHelpertextSlot()}describedBy(){return this.showHelpertext()?this.idHelper:null}displayLabel(){return!!this.label}getAriaLabel(){return this.displayLabel()||this.pnAriaLabelledby?null:this.pnAriaLabel}getAriaLabelledby(){return this.displayLabel()||this.pnAriaLabel?null:this.pnAriaLabelledby}render(){return i(o,{key:"e6a6de7ded1a69b16843133338ba8a1ae1294b19"},i("div",{key:"142125dd53902df30a93a5e5257650a7841a1644",class:"pn-toggle"},i("div",{key:"d4e35ed179dc5f1423cdf59cf0481ecbcb33021f",class:"pn-toggle-content"},this.label&&i("label",{key:"f38bdb380fb05349909e386dd6e22d841c0caf56",htmlFor:this.getId(),class:"pn-toggle-label"},i("span",{key:"94a35b2682a039613dd0814a25ba30f954018dc6"},this.label)),i("p",{key:"c621112acea7f18b7943d9d07c0af52dd7455329",id:this.idHelper,class:"pn-toggle-helper",hidden:!this.showHelpertext()},this.hasHelpertextProp()&&i("span",{key:"1959f88dbe079595e3cd6bbb48098e2777ab642e"},this.helpertext),i("slot",{key:"e493dcb3022bd31c4ecfb349756d3d83bf51bf9a",name:"helpertext"}))),i("div",{key:"1f13bb2bcb798b5221d06e55640848034ad2b260",class:"pn-toggle-button","data-small":this.small,"data-large":this.large,"data-loading":this.loading},i("input",{key:"ebf1c43df4b75f8df0769d2d458c04fbf17385f6",id:this.getId(),class:"pn-toggle-element",type:"checkbox",name:this.name,value:this.value,checked:this.checked,required:this.required,disabled:this.disabled,"aria-label":this.getAriaLabel(),"aria-labelledby":this.getAriaLabelledby(),"aria-describedby":this.describedBy()}),i("div",{key:"51c67cb5c61e3d3b93bd49013594109772b7d796",class:"pn-toggle-bg"}),i("div",{key:"1932ea8d92b8ab57a47fdd3ced9795be78cc1620",class:"pn-toggle-circle"},i("svg",{key:"67e5adc0818d3fe76de4dffa45bc8c1d5c9fba45",class:"pn-toggle-check",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none"},i("polyline",{key:"f1722e0d19629ea38eac2faa6d2ccaf007e78463",points:"4,12 9,17 20,6","stroke-width":"3"})),i("pn-spinner",{key:"60ab6b2fea45ddbc8793b06f18032df94c858a9d",size:this.getSpinnerSize()})))))}static get watchers(){return{pnId:[{handleHelperId:0}],toggleid:[{handleHelperId:1}]}}static get style(){return`${e("pn-toggle-switch")}{display:inline-block;position:relative}${e("pn-toggle-switch")} .pn-toggle{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1em}${e("pn-toggle-switch")} .pn-toggle-label{cursor:pointer;display:flex;justify-content:space-between;align-items:flex-end;font-weight:500;color:#2d2013;margin:0;gap:0.5em;-webkit-tap-highlight-color:transparent;transition-property:color, transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-label{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-label>span{font-size:1em}${e("pn-toggle-switch")} .pn-toggle-helper{color:#5e554a;font-size:0.875em;font-weight:400;margin:0.25em 0 0 0;display:flex;flex-direction:column;gap:0.25em}${e("pn-toggle-switch")} .pn-toggle-content{flex:1 0}${e("pn-toggle-switch")} .pn-toggle-button{position:relative;font-size:1em;width:3.625em;height:2em;padding:0.1875em;transition-property:transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-button{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-button{-webkit-tap-highlight-color:transparent}${e("pn-toggle-switch")} .pn-toggle-button[data-small]{width:2.625em;height:1.5em}${e("pn-toggle-switch")} .pn-toggle-button[data-small] .pn-toggle-circle{width:1.125em;height:1.125em}${e("pn-toggle-switch")} .pn-toggle-button[data-small][data-loading]>.pn-toggle-bg{width:1.5em}${e("pn-toggle-switch")} .pn-toggle-button[data-large]{width:4.625em;height:2.5em}${e("pn-toggle-switch")} .pn-toggle-button[data-large] .pn-toggle-circle{width:2.125em;height:2.125em}${e("pn-toggle-switch")} .pn-toggle-button[data-large][data-loading]>.pn-toggle-bg{width:2.5em}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-bg{width:2em}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-circle,${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-element:checked~.pn-toggle-circle{transform:translateX(50%)}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-element:checked~.pn-toggle-circle .pn-toggle-check{opacity:0}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-element:checked~.pn-toggle-circle .pn-toggle-check polyline{stroke-dashoffset:23;transition-delay:0s}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] ${e("pn-spinner")}{opacity:1;transform:translate(-50%, -50%);position:absolute;top:50%;left:50%}${e("pn-toggle-switch")} .pn-toggle-bg{position:absolute;top:0;left:50%;width:100%;height:100%;z-index:0;border-radius:2em;background-color:#969087;transform:translateX(-50%);outline:0.2rem solid transparent;outline-offset:0.2rem;transition-property:width, background-color, outline-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-bg{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-circle{position:relative;z-index:1;width:1.625em;height:1.625em;background-color:#ffffff;box-shadow:0 0.25em 0.5em rgba(0, 0, 0, 0.1);border-radius:50%;padding:0.25em;transform:translateX(0%);transition-property:transform, background-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-circle{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-element{position:absolute;z-index:3;top:0;left:0;cursor:pointer;width:100%;height:100%;opacity:0;margin:0;}${e("pn-toggle-switch")} .pn-toggle-element:focus-visible+.pn-toggle-bg{outline-color:#005d92}${e("pn-toggle-switch")} .pn-toggle-element:hover+.pn-toggle-bg{background-color:#5e554a}${e("pn-toggle-switch")} .pn-toggle-element:hover:checked+.pn-toggle-bg{background-color:#0d234b}${e("pn-toggle-switch")} .pn-toggle-element:hover:checked~.pn-toggle-circle .pn-toggle-check polyline{stroke:#0d234b}${e("pn-toggle-switch")} .pn-toggle-element:checked~.pn-toggle-bg{background-color:#005d92}${e("pn-toggle-switch")} .pn-toggle-element:checked~.pn-toggle-circle{transform:translateX(100%)}${e("pn-toggle-switch")} .pn-toggle-element:checked~.pn-toggle-circle .pn-toggle-check{opacity:1}${e("pn-toggle-switch")} .pn-toggle-element:checked~.pn-toggle-circle .pn-toggle-check polyline{transition-delay:0.2s, 0s;stroke-dashoffset:0}${e("pn-toggle-switch")} .pn-toggle-element:disabled{cursor:not-allowed}${e("pn-toggle-switch")} .pn-toggle-element:disabled+.pn-toggle-bg{background-color:#d3cecb;box-shadow:none}${e("pn-toggle-switch")} .pn-toggle-element:disabled~.pn-toggle-circle{background-color:#f3f2f2}${e("pn-toggle-switch")} .pn-toggle-element:disabled~.pn-toggle-circle .pn-toggle-check polyline{stroke:#969087}${e("pn-toggle-switch")} .pn-toggle-element:disabled~.pn-toggle-circle ${e("pn-spinner")} .pn-spinner-circle{stroke:#969087}${e("pn-toggle-switch")} .pn-toggle-element:disabled~.pn-toggle-circle ${e("pn-spinner")} .pn-spinner-dot{fill:#969087}${e("pn-toggle-switch")} .pn-toggle-element:disabled:hover+.pn-toggle-bg,${e("pn-toggle-switch")} .pn-toggle-element:disabled:hover:checked+.pn-toggle-bg{background-color:#d3cecb}${e("pn-toggle-switch")} .pn-toggle-element:disabled:hover~.pn-toggle-circle .pn-toggle-check polyline,${e("pn-toggle-switch")} .pn-toggle-element:disabled:hover:checked~.pn-toggle-circle .pn-toggle-check polyline{stroke:#969087}${e("pn-toggle-switch")} .pn-toggle-check{position:absolute;left:50%;top:50%;height:1.5em;width:1.5em;padding:0.25em;transform:translate(-50%, -50%);opacity:0;transition-property:opacity;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-check{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-check polyline{stroke:#005d92;stroke-linecap:round;stroke-dasharray:23;stroke-dashoffset:23;transition-property:stroke-dashoffset, stroke;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-check polyline{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")}{opacity:0;transition-property:opacity;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")}{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")} .pn-spinner-circle{transition-property:stroke;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")} .pn-spinner-circle{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")} .pn-spinner-dot{transition-property:fill;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")} .pn-spinner-dot{transition-duration:0s;transition-delay:0s}}`}},[772,"pn-toggle-switch",{label:[1],helpertext:[1],value:[1],name:[1],checked:[1028],required:[4],disabled:[4],small:[4],large:[4],loading:[4],pnId:[1,"pn-id"],pnAriaLabel:[1,"pn-aria-label"],pnAriaLabelledby:[1,"pn-aria-labelledby"],toggleid:[1]},void 0,{pnId:[{handleHelperId:0}],toggleid:[{handleHelperId:1}]}]),s=r,a=function(){"undefined"!=typeof customElements&&["pn-toggle-switch","pn-spinner"].forEach((t=>{switch(t){case"pn-toggle-switch":customElements.get(e(e(t)))||customElements.define(e(e(t)),r);break;case"pn-spinner":customElements.get(e(e(t)))||g()}}))};export{s as PnToggleSwitch,a as defineCustomElement}
5
+ import{transformTag as e,proxyCustomElement as t,HTMLElement as n,h as i,Host as o}from"@stencil/core/internal/client";import{u as l}from"./helpers.js";import{d as g}from"./pn-spinner2.js";const r=t(class extends n{constructor(e){super(),!1!==e&&this.__registerHost()}id="pn-toggle-"+l();idHelper=this.id+"-helper";get hostElement(){return this}label;helpertext;value=null;name=null;checked=!1;required=!1;disabled=!1;small=!1;large=!1;loading=!1;pnId;pnAriaLabel;pnAriaLabelledby;toggleid;handleHelperId(){this.idHelper=this.getId()+"-helper"}getId(){return this.pnId||this.toggleid||this.id}getSpinnerSize(){return this.small?1:this.large?1.25:1.125}hasHelpertextProp(){return!!this.helpertext}hasHelpertextSlot(){return!!this.hostElement.querySelector('[slot="helpertext"]')}showHelpertext(){return this.hasHelpertextProp()||this.hasHelpertextSlot()}describedBy(){return this.showHelpertext()?this.idHelper:null}displayLabel(){return!!this.label}getAriaLabel(){return this.displayLabel()||this.pnAriaLabelledby?null:this.pnAriaLabel}getAriaLabelledby(){return this.displayLabel()||this.pnAriaLabel?null:this.pnAriaLabelledby}render(){return i(o,{key:"a3363d23f18ca6fd7e9240dcaa46946cda07dd7b"},i("div",{key:"203140db6d9953527ba4f15e7289bffb2e69a2a1",class:"pn-toggle"},i("div",{key:"dac906f74e8aa9899bcb1c99ee53e82695f5a280",class:"pn-toggle-content"},this.label&&i("label",{key:"fecf18137bbec21e45feb4380f6c0ebdd0dae01a",htmlFor:this.getId(),class:"pn-toggle-label"},i("span",{key:"176e29c2756be27e0975690fe0d5f555b382ef6f"},this.label)),i("p",{key:"865da739546b4f5214fdb63d22a1ea23f1029203",id:this.idHelper,class:"pn-toggle-helper",hidden:!this.showHelpertext()},this.hasHelpertextProp()&&i("span",{key:"c958031faa669b81215300bd4bc2b31fed018e1a"},this.helpertext),i("slot",{key:"01267d6e878a089a7174e2747cd232fd9a250f28",name:"helpertext"}))),i("div",{key:"e3f74dd8febd161788f7a9d197e4216cfa00513e",class:"pn-toggle-button","data-small":this.small,"data-large":this.large,"data-loading":this.loading},i("input",{key:"2e9627c525e29bf561072b6d5578b379cba5f597",id:this.getId(),class:"pn-toggle-element",type:"checkbox",name:this.name,value:this.value,checked:this.checked,required:this.required,disabled:this.disabled,"aria-label":this.getAriaLabel(),"aria-labelledby":this.getAriaLabelledby(),"aria-describedby":this.describedBy()}),i("div",{key:"45c2b0269215a6ffa48654541f81d70f33eb57d3",class:"pn-toggle-bg"}),i("div",{key:"684e373a709db9877993c18f29eefc68e6f74585",class:"pn-toggle-circle"},i("svg",{key:"e918edb5254603543bc20d639164c05f56db1c54",class:"pn-toggle-check",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none"},i("polyline",{key:"4f5441441932cd5e645686a8226ddd6a9744b47c",points:"4,12 9,17 20,6","stroke-width":"3"})),i("pn-spinner",{key:"a0d94d932142f174c009bf0fb61d23714f9f700d",size:this.getSpinnerSize()})))))}static get watchers(){return{pnId:[{handleHelperId:0}],toggleid:[{handleHelperId:1}]}}static get style(){return`${e("pn-toggle-switch")}{display:inline-block;position:relative}${e("pn-toggle-switch")} .pn-toggle{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1em}${e("pn-toggle-switch")} .pn-toggle-label{cursor:pointer;display:flex;justify-content:space-between;align-items:flex-end;font-weight:500;color:#2d2013;margin:0;gap:0.5em;-webkit-tap-highlight-color:transparent;transition-property:color, transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-label{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-label>span{font-size:1em}${e("pn-toggle-switch")} .pn-toggle-helper{color:#5e554a;font-size:0.875em;font-weight:400;margin:0.25em 0 0 0;display:flex;flex-direction:column;gap:0.25em}${e("pn-toggle-switch")} .pn-toggle-content{flex:1 0}${e("pn-toggle-switch")} .pn-toggle-button{position:relative;font-size:1em;width:3.625em;height:2em;padding:0.1875em;transition-property:transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-button{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-button{-webkit-tap-highlight-color:transparent}${e("pn-toggle-switch")} .pn-toggle-button[data-small]{width:2.625em;height:1.5em}${e("pn-toggle-switch")} .pn-toggle-button[data-small] .pn-toggle-circle{width:1.125em;height:1.125em}${e("pn-toggle-switch")} .pn-toggle-button[data-small][data-loading]>.pn-toggle-bg{width:1.5em}${e("pn-toggle-switch")} .pn-toggle-button[data-large]{width:4.625em;height:2.5em}${e("pn-toggle-switch")} .pn-toggle-button[data-large] .pn-toggle-circle{width:2.125em;height:2.125em}${e("pn-toggle-switch")} .pn-toggle-button[data-large][data-loading]>.pn-toggle-bg{width:2.5em}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-bg{width:2em}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-circle,${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-element:checked~.pn-toggle-circle{transform:translateX(50%)}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-element:checked~.pn-toggle-circle .pn-toggle-check{opacity:0}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] .pn-toggle-element:checked~.pn-toggle-circle .pn-toggle-check polyline{stroke-dashoffset:23;transition-delay:0s}${e("pn-toggle-switch")} .pn-toggle-button[data-loading] ${e("pn-spinner")}{opacity:1;transform:translate(-50%, -50%);position:absolute;top:50%;left:50%}${e("pn-toggle-switch")} .pn-toggle-bg{position:absolute;top:0;left:50%;width:100%;height:100%;z-index:0;border-radius:2em;background-color:#969087;transform:translateX(-50%);outline:0.2rem solid transparent;outline-offset:0.2rem;transition-property:width, background-color, outline-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-bg{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-circle{position:relative;z-index:1;width:1.625em;height:1.625em;background-color:#ffffff;box-shadow:0 0.25em 0.5em rgba(0, 0, 0, 0.1);border-radius:50%;padding:0.25em;transform:translateX(0%);transition-property:transform, background-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-circle{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-element{position:absolute;z-index:3;top:0;left:0;cursor:pointer;width:100%;height:100%;opacity:0;margin:0;}${e("pn-toggle-switch")} .pn-toggle-element:focus-visible+.pn-toggle-bg{outline-color:#005d92}${e("pn-toggle-switch")} .pn-toggle-element:hover+.pn-toggle-bg{background-color:#5e554a}${e("pn-toggle-switch")} .pn-toggle-element:hover:checked+.pn-toggle-bg{background-color:#0d234b}${e("pn-toggle-switch")} .pn-toggle-element:hover:checked~.pn-toggle-circle .pn-toggle-check polyline{stroke:#0d234b}${e("pn-toggle-switch")} .pn-toggle-element:checked~.pn-toggle-bg{background-color:#005d92}${e("pn-toggle-switch")} .pn-toggle-element:checked~.pn-toggle-circle{transform:translateX(100%)}${e("pn-toggle-switch")} .pn-toggle-element:checked~.pn-toggle-circle .pn-toggle-check{opacity:1}${e("pn-toggle-switch")} .pn-toggle-element:checked~.pn-toggle-circle .pn-toggle-check polyline{transition-delay:0.2s, 0s;stroke-dashoffset:0}${e("pn-toggle-switch")} .pn-toggle-element:disabled{cursor:not-allowed}${e("pn-toggle-switch")} .pn-toggle-element:disabled+.pn-toggle-bg{background-color:#d3cecb;box-shadow:none}${e("pn-toggle-switch")} .pn-toggle-element:disabled~.pn-toggle-circle{background-color:#f3f2f2}${e("pn-toggle-switch")} .pn-toggle-element:disabled~.pn-toggle-circle .pn-toggle-check polyline{stroke:#969087}${e("pn-toggle-switch")} .pn-toggle-element:disabled~.pn-toggle-circle ${e("pn-spinner")} .pn-spinner-circle{stroke:#969087}${e("pn-toggle-switch")} .pn-toggle-element:disabled~.pn-toggle-circle ${e("pn-spinner")} .pn-spinner-dot{fill:#969087}${e("pn-toggle-switch")} .pn-toggle-element:disabled:hover+.pn-toggle-bg,${e("pn-toggle-switch")} .pn-toggle-element:disabled:hover:checked+.pn-toggle-bg{background-color:#d3cecb}${e("pn-toggle-switch")} .pn-toggle-element:disabled:hover~.pn-toggle-circle .pn-toggle-check polyline,${e("pn-toggle-switch")} .pn-toggle-element:disabled:hover:checked~.pn-toggle-circle .pn-toggle-check polyline{stroke:#969087}${e("pn-toggle-switch")} .pn-toggle-check{position:absolute;left:50%;top:50%;height:1.5em;width:1.5em;padding:0.25em;transform:translate(-50%, -50%);opacity:0;transition-property:opacity;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-check{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle-check polyline{stroke:#005d92;stroke-linecap:round;stroke-dasharray:23;stroke-dashoffset:23;transition-property:stroke-dashoffset, stroke;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle-check polyline{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")}{opacity:0;transition-property:opacity;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")}{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")} .pn-spinner-circle{transition-property:stroke;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")} .pn-spinner-circle{transition-duration:0s;transition-delay:0s}}${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")} .pn-spinner-dot{transition-property:fill;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-toggle-switch")} .pn-toggle ${e("pn-spinner")} .pn-spinner-dot{transition-duration:0s;transition-delay:0s}}`}},[772,"pn-toggle-switch",{label:[1],helpertext:[1],value:[1],name:[1],checked:[1028],required:[4],disabled:[4],small:[4],large:[4],loading:[4],pnId:[1,"pn-id"],pnAriaLabel:[1,"pn-aria-label"],pnAriaLabelledby:[1,"pn-aria-labelledby"],toggleid:[1]},void 0,{pnId:[{handleHelperId:0}],toggleid:[{handleHelperId:1}]}]),s=r,a=function(){"undefined"!=typeof customElements&&["pn-toggle-switch","pn-spinner"].forEach((t=>{switch(t){case"pn-toggle-switch":customElements.get(e(e(t)))||customElements.define(e(e(t)),r);break;case"pn-spinner":customElements.get(e(e(t)))||g()}}))};export{s as PnToggleSwitch,a as defineCustomElement}
@@ -2,4 +2,4 @@
2
2
  * Built with Stencil
3
3
  * By PostNord.
4
4
  */
5
- import{transformTag as e,proxyCustomElement as s,HTMLElement as t,createEvent as i,h as n,Host as r}from"@stencil/core/internal/client";import{u as a,k as o,s as c}from"./helpers.js";import{d as l}from"./pn-button2.js";import{d as h}from"./pn-icon2.js";import{d as p}from"./pn-search-field2.js";import{d}from"./pn-spinner2.js";const u={CLOSEST_DELIVERY_DATE:{en:"Closest delivery date:",sv:"Nästa utdelningsdag:"},NEXT_DELIVERY_DATE:{en:"Next delivery date:",sv:"Kommande utdelningsdag:"},ZIP_CODE:{en:"Zip code:",sv:"Postnummer:"},VALIDATION_ERROR_MESSAGE:{en:"Zip code not valid",sv:"Postnumret är inte giltigt"},SERVER_ERROR_MESSAGE:{en:"Could not find zip code",sv:"Kan inte hitta postnumret"},PLACEHOLDER_TEXT:{en:"Search for a zip code",sv:"Sök på ett postnummer"},SEARCH:{en:"Search",sv:"Sök"}},E=s(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.searchsuccessful=i(this,"searchsuccessful",7)}searchId="pn-zipcode-"+a();get hostElement(){return this}validZipCode;loading=!1;showResult=!1;zipCodeSearchResult={delivery:"",upcoming:"",city:"",postalCode:""};error=!1;errorMessage;language=null;value;searchsuccessful;async componentWillLoad(){null===this.language&&await o(this.hostElement),this.value&&this.handleSearch(this.value)}translation(e){return u[e][this.language||c]}handleSearch(e){this.value=e,this.validateZipCode(),this.error?this.errorMessage="VALIDATION_ERROR_MESSAGE":this.zipCodeSearch()}async zipCodeSearch(){this.loading=!0,await fetch("https://portal.postnord.com/api/sendoutarrival/closest?postalCode="+this.validZipCode).then((e=>e.json())).then((e=>{this.showResult=!0,this.zipCodeSearchResult=e,this.searchsuccessful.emit(!0)})).catch((()=>{this.error=!0,this.errorMessage="SERVER_ERROR_MESSAGE",this.searchsuccessful.emit(!1)})).finally((()=>{this.loading=!1}))}validateZipCode(){const e=this.value?this.value.replace(/[ -]/gi,""):"",s=/^\d{5}$/.test(e);this.error=!s,s&&(this.validZipCode=e)}renderSearchResult(){if(!this.loading&&!this.error&&this.showResult)return n("output",{class:"pn-search-results",htmlFor:this.searchId},n("p",{class:"text-row"},n("span",null,this.translation("CLOSEST_DELIVERY_DATE")),n("h3",{class:"delivery-date"},this.zipCodeSearchResult.delivery)),n("p",{class:"text-row"},n("span",null,this.translation("NEXT_DELIVERY_DATE")),n("h3",{class:"delivery-date"},this.zipCodeSearchResult.upcoming)),n("p",{class:"text-row"},n("span",null,this.translation("ZIP_CODE")),n("h3",null,this.zipCodeSearchResult.postalCode,", ",this.zipCodeSearchResult.city||"N/A")))}renderErrorMessage(){if(this.error&&!this.loading)return n("p",{class:"pn-error-text",role:"alert"},n("small",null,this.translation(this.errorMessage)))}render(){return n(r,{key:"2631586788c0b4fc5e5b4914dd44e9b20c87598e"},n("pn-search-field",{key:"0d9743b99db487cb1acb27825fca4e872e25c72d",label:this.translation("PLACEHOLDER_TEXT"),value:this.value,searchid:this.searchId,loading:this.loading,button:"icon",buttonLabel:this.translation("SEARCH"),placeholder:this.translation("PLACEHOLDER_TEXT"),onSearch:e=>this.handleSearch(e.detail)}),this.renderSearchResult(),this.renderErrorMessage())}static get style(){return`${e("pn-zipcode-search")}{display:block;color:#5e554a}${e("pn-zipcode-search")} .pn-search-results{display:flex;flex-direction:column;gap:1em;padding:0 0.75em}${e("pn-zipcode-search")} .pn-search-results span{color:#5e554a}${e("pn-zipcode-search")} .pn-search-results h3{color:#2d2013}${e("pn-zipcode-search")} .pn-error-text{color:#a70707;padding:0 0.75em}${e("pn-zipcode-search")}>${e("pn-search-field")}{width:100%;margin-bottom:1em}`}},[512,"pn-zipcode-search",{language:[1],value:[1025],validZipCode:[32],loading:[32],showResult:[32],zipCodeSearchResult:[32],error:[32],errorMessage:[32]}]),m=E,R=function(){"undefined"!=typeof customElements&&["pn-zipcode-search","pn-button","pn-icon","pn-search-field","pn-spinner"].forEach((s=>{switch(s){case"pn-zipcode-search":customElements.get(e(e(s)))||customElements.define(e(e(s)),E);break;case"pn-button":customElements.get(e(e(s)))||l();break;case"pn-icon":customElements.get(e(e(s)))||h();break;case"pn-search-field":customElements.get(e(e(s)))||p();break;case"pn-spinner":customElements.get(e(e(s)))||d()}}))};export{m as PnZipcodeSearch,R as defineCustomElement}
5
+ import{transformTag as e,proxyCustomElement as s,HTMLElement as t,createEvent as i,h as n,Host as r}from"@stencil/core/internal/client";import{u as a,k as o,s as c}from"./helpers.js";import{d as l}from"./pn-button2.js";import{d as h}from"./pn-icon2.js";import{d as p}from"./pn-search-field2.js";import{d}from"./pn-spinner2.js";const u={CLOSEST_DELIVERY_DATE:{en:"Closest delivery date:",sv:"Nästa utdelningsdag:"},NEXT_DELIVERY_DATE:{en:"Next delivery date:",sv:"Kommande utdelningsdag:"},ZIP_CODE:{en:"Zip code:",sv:"Postnummer:"},VALIDATION_ERROR_MESSAGE:{en:"Zip code not valid",sv:"Postnumret är inte giltigt"},SERVER_ERROR_MESSAGE:{en:"Could not find zip code",sv:"Kan inte hitta postnumret"},PLACEHOLDER_TEXT:{en:"Search for a zip code",sv:"Sök på ett postnummer"},SEARCH:{en:"Search",sv:"Sök"}},E=s(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.searchsuccessful=i(this,"searchsuccessful",7)}searchId="pn-zipcode-"+a();get hostElement(){return this}validZipCode;loading=!1;showResult=!1;zipCodeSearchResult={delivery:"",upcoming:"",city:"",postalCode:""};error=!1;errorMessage;language=null;value;searchsuccessful;async componentWillLoad(){null===this.language&&await o(this.hostElement),this.value&&this.handleSearch(this.value)}translation(e){return u[e][this.language||c]}handleSearch(e){this.value=e,this.validateZipCode(),this.error?this.errorMessage="VALIDATION_ERROR_MESSAGE":this.zipCodeSearch()}async zipCodeSearch(){this.loading=!0,await fetch("https://portal.postnord.com/api/sendoutarrival/closest?postalCode="+this.validZipCode).then((e=>e.json())).then((e=>{this.showResult=!0,this.zipCodeSearchResult=e,this.searchsuccessful.emit(!0)})).catch((()=>{this.error=!0,this.errorMessage="SERVER_ERROR_MESSAGE",this.searchsuccessful.emit(!1)})).finally((()=>{this.loading=!1}))}validateZipCode(){const e=this.value?this.value.replace(/[ -]/gi,""):"",s=/^\d{5}$/.test(e);this.error=!s,s&&(this.validZipCode=e)}renderSearchResult(){if(!this.loading&&!this.error&&this.showResult)return n("output",{class:"pn-search-results",htmlFor:this.searchId},n("p",{class:"text-row"},n("span",null,this.translation("CLOSEST_DELIVERY_DATE")),n("h3",{class:"delivery-date"},this.zipCodeSearchResult.delivery)),n("p",{class:"text-row"},n("span",null,this.translation("NEXT_DELIVERY_DATE")),n("h3",{class:"delivery-date"},this.zipCodeSearchResult.upcoming)),n("p",{class:"text-row"},n("span",null,this.translation("ZIP_CODE")),n("h3",null,this.zipCodeSearchResult.postalCode,", ",this.zipCodeSearchResult.city||"N/A")))}renderErrorMessage(){if(this.error&&!this.loading)return n("p",{class:"pn-error-text",role:"alert"},n("small",null,this.translation(this.errorMessage)))}render(){return n(r,{key:"604fc6f9244f665ee3aec5411ed21c475e103755"},n("pn-search-field",{key:"80704adf3156c3ad8b0430cff195344ae2e31536",label:this.translation("PLACEHOLDER_TEXT"),value:this.value,searchid:this.searchId,loading:this.loading,button:"icon",buttonLabel:this.translation("SEARCH"),placeholder:this.translation("PLACEHOLDER_TEXT"),onSearch:e=>this.handleSearch(e.detail)}),this.renderSearchResult(),this.renderErrorMessage())}static get style(){return`${e("pn-zipcode-search")}{display:block;color:#5e554a}${e("pn-zipcode-search")} .pn-search-results{display:flex;flex-direction:column;gap:1em;padding:0 0.75em}${e("pn-zipcode-search")} .pn-search-results span{color:#5e554a}${e("pn-zipcode-search")} .pn-search-results h3{color:#2d2013}${e("pn-zipcode-search")} .pn-error-text{color:#a70707;padding:0 0.75em}${e("pn-zipcode-search")}>${e("pn-search-field")}{width:100%;margin-bottom:1em}`}},[512,"pn-zipcode-search",{language:[1],value:[1025],validZipCode:[32],loading:[32],showResult:[32],zipCodeSearchResult:[32],error:[32],errorMessage:[32]}]),m=E,R=function(){"undefined"!=typeof customElements&&["pn-zipcode-search","pn-button","pn-icon","pn-search-field","pn-spinner"].forEach((s=>{switch(s){case"pn-zipcode-search":customElements.get(e(e(s)))||customElements.define(e(e(s)),E);break;case"pn-button":customElements.get(e(e(s)))||l();break;case"pn-icon":customElements.get(e(e(s)))||h();break;case"pn-search-field":customElements.get(e(e(s)))||p();break;case"pn-spinner":customElements.get(e(e(s)))||d()}}))};export{m as PnZipcodeSearch,R as defineCustomElement}
@@ -0,0 +1,8 @@
1
+ /*!
2
+ * Built with Stencil
3
+ * By PostNord.
4
+ */
5
+ const icon = '<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="M6.293 6.293a1 1 0 0 1 1.414 0L12 10.586l4.293-4.293a1 1 0 1 1 1.414 1.414L13.414 12l4.293 4.293a1 1 0 0 1-1.414 1.414L12 13.414l-4.293 4.293a1 1 0 0 1-1.414-1.414L10.586 12 6.293 7.707a1 1 0 0 1 0-1.414" clip-rule="evenodd"/></svg>';
6
+ const close_small = icon;
7
+
8
+ export { close_small as c };
@@ -172,6 +172,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
172
172
  return import(
173
173
  /* webpackMode: "lazy" */
174
174
  './pn-header.entry.js').then(processMod, consoleError);
175
+ case 'pn-input-chip':
176
+ return import(
177
+ /* webpackMode: "lazy" */
178
+ './pn-input-chip.entry.js').then(processMod, consoleError);
175
179
  case 'pn-page-nav':
176
180
  return import(
177
181
  /* webpackMode: "lazy" */
@@ -212,6 +216,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
212
216
  return import(
213
217
  /* webpackMode: "lazy" */
214
218
  './pn-segmented-control.entry.js').then(processMod, consoleError);
219
+ case 'pn-skeleton-loader':
220
+ return import(
221
+ /* webpackMode: "lazy" */
222
+ './pn-skeleton-loader.entry.js').then(processMod, consoleError);
215
223
  case 'pn-tab':
216
224
  return import(
217
225
  /* webpackMode: "lazy" */
@@ -300,6 +308,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
300
308
  return import(
301
309
  /* webpackMode: "lazy" */
302
310
  './pn-toast.entry.js').then(processMod, consoleError);
311
+ case 'pn-search-field':
312
+ return import(
313
+ /* webpackMode: "lazy" */
314
+ './pn-search-field.entry.js').then(processMod, consoleError);
303
315
  case 'pn-button_2':
304
316
  return import(
305
317
  /* webpackMode: "lazy" */
@@ -312,10 +324,6 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
312
324
  return import(
313
325
  /* webpackMode: "lazy" */
314
326
  './pn-input.entry.js').then(processMod, consoleError);
315
- case 'pn-search-field':
316
- return import(
317
- /* webpackMode: "lazy" */
318
- './pn-search-field.entry.js').then(processMod, consoleError);
319
327
  case 'pn-file-upload':
320
328
  return import(
321
329
  /* webpackMode: "lazy" */