@ptcwebops/ptcw-design 0.5.7 → 0.5.9

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 (249) hide show
  1. package/LICENSE +21 -21
  2. package/dist/cjs/dropdown-item.cjs.entry.js +10 -10
  3. package/dist/cjs/icon-asset_13.cjs.entry.js +678 -678
  4. package/dist/cjs/{interfaces-0ecd8027.js → interfaces-574e6df7.js} +9 -9
  5. package/dist/cjs/list-item.cjs.entry.js +19 -19
  6. package/dist/cjs/loader.cjs.js +1 -1
  7. package/dist/cjs/lottie-player.cjs.entry.js +354 -354
  8. package/dist/cjs/my-component.cjs.entry.js +13 -13
  9. package/dist/cjs/ptc-accordion-item.cjs.entry.js +97 -97
  10. package/dist/cjs/ptc-accordion.cjs.entry.js +38 -38
  11. package/dist/cjs/ptc-announcement.cjs.entry.js +38 -38
  12. package/dist/cjs/ptc-breadcrumb.cjs.entry.js +13 -13
  13. package/dist/cjs/ptc-card-bottom.cjs.entry.js +31 -31
  14. package/dist/cjs/ptc-card-content.cjs.entry.js +32 -32
  15. package/dist/cjs/ptc-card-plm.cjs.entry.js +16 -16
  16. package/dist/cjs/ptc-card.cjs.entry.js +69 -69
  17. package/dist/cjs/ptc-date.cjs.entry.js +48 -48
  18. package/dist/cjs/ptc-ellipsis-dropdown.cjs.entry.js +23 -23
  19. package/dist/cjs/ptc-hero-footer-cta.cjs.entry.js +8 -8
  20. package/dist/cjs/ptc-hero.cjs.entry.js +18 -18
  21. package/dist/cjs/ptc-icon-list.cjs.entry.js +32 -32
  22. package/dist/cjs/ptc-img_2.cjs.entry.js +169 -169
  23. package/dist/cjs/ptc-list.cjs.entry.js +23 -23
  24. package/dist/cjs/ptc-lottie.cjs.entry.js +12 -12
  25. package/dist/cjs/ptc-minimized-footer.cjs.entry.js +8 -8
  26. package/dist/cjs/ptc-minimized-header.cjs.entry.js +11 -11
  27. package/dist/cjs/ptc-mobile-select.cjs.entry.js +69 -69
  28. package/dist/cjs/ptc-nav-item.cjs.entry.js +83 -83
  29. package/dist/cjs/ptc-nav.cjs.entry.js +8 -8
  30. package/dist/cjs/ptc-pagenation.cjs.entry.js +111 -0
  31. package/dist/cjs/ptc-picture.cjs.entry.js +169 -169
  32. package/dist/cjs/ptc-previous-url.cjs.entry.js +8 -8
  33. package/dist/cjs/ptc-pricing-block.cjs.entry.js +14 -14
  34. package/dist/cjs/ptc-quote.cjs.entry.js +25 -25
  35. package/dist/cjs/ptc-responsive-wrapper.cjs.entry.js +54 -54
  36. package/dist/cjs/ptc-social-share.cjs.entry.js +64 -64
  37. package/dist/cjs/ptc-span.cjs.entry.js +23 -23
  38. package/dist/cjs/ptc-svg-btn.cjs.entry.js +75 -75
  39. package/dist/cjs/ptc-tab-list.cjs.entry.js +116 -116
  40. package/dist/cjs/ptc-two-column-media.cjs.entry.js +14 -14
  41. package/dist/cjs/ptcw-design.cjs.js +1 -1
  42. package/dist/cjs/tab-content.cjs.entry.js +26 -26
  43. package/dist/cjs/tab-header.cjs.entry.js +43 -43
  44. package/dist/collection/collection-manifest.json +1 -0
  45. package/dist/collection/components/dropdown-item/dropdown-item.js +56 -56
  46. package/dist/collection/components/icon-asset/icon-asset.css +4 -4
  47. package/dist/collection/components/icon-asset/icon-asset.js +199 -199
  48. package/dist/collection/components/icon-asset/media/brands.svg +1381 -1381
  49. package/dist/collection/components/icon-asset/media/designer.svg +338 -338
  50. package/dist/collection/components/icon-asset/media/regular.svg +463 -463
  51. package/dist/collection/components/icon-asset/media/solid.svg +3013 -3013
  52. package/dist/collection/components/icon-asset/media/svg-with-js.min.css +4 -4
  53. package/dist/collection/components/list-item/list-item.js +103 -103
  54. package/dist/collection/components/my-component/my-component.css +3 -3
  55. package/dist/collection/components/my-component/my-component.js +73 -73
  56. package/dist/collection/components/ptc-accordion/ptc-accordion-item/ptc-accordion-item.js +296 -296
  57. package/dist/collection/components/ptc-accordion/ptc-accordion.js +74 -74
  58. package/dist/collection/components/ptc-announcement/ptc-announcement.css +2 -1
  59. package/dist/collection/components/ptc-announcement/ptc-announcement.js +210 -210
  60. package/dist/collection/components/ptc-breadcrumb/ptc-breadcrumb.css +1 -1
  61. package/dist/collection/components/ptc-breadcrumb/ptc-breadcrumb.js +21 -21
  62. package/dist/collection/components/ptc-button/ptc-button.js +293 -293
  63. package/dist/collection/components/ptc-card/ptc-card.css +76 -0
  64. package/dist/collection/components/ptc-card/ptc-card.js +301 -282
  65. package/dist/collection/components/ptc-card-bottom/ptc-card-bottom.js +105 -105
  66. package/dist/collection/components/ptc-card-content/ptc-card-content.css +1 -1
  67. package/dist/collection/components/ptc-card-content/ptc-card-content.js +105 -105
  68. package/dist/collection/components/ptc-card-plm/ptc-card-plm.js +97 -97
  69. package/dist/collection/components/ptc-checkbox/ptc-checkbox.js +114 -114
  70. package/dist/collection/components/ptc-container/ptc-container.js +119 -119
  71. package/dist/collection/components/ptc-date/ptc-date.js +201 -201
  72. package/dist/collection/components/ptc-dropdown/ptc-dropdown.js +144 -144
  73. package/dist/collection/components/ptc-ellipsis-dropdown/ptc-ellipsis-dropdown.js +77 -77
  74. package/dist/collection/components/ptc-filter-tag/ptc-filter-tag.js +70 -70
  75. package/dist/collection/components/ptc-hero/ptc-hero.js +67 -67
  76. package/dist/collection/components/ptc-hero-footer-cta/ptc-hero-footer-cta.js +77 -77
  77. package/dist/collection/components/ptc-icon-list/ptc-icon-list.js +145 -145
  78. package/dist/collection/components/ptc-icon-minimize/ptc-icon-minimize.js +86 -86
  79. package/dist/collection/components/ptc-img/ptc-img.js +314 -314
  80. package/dist/collection/components/ptc-link/ptc-link.css +1 -1
  81. package/dist/collection/components/ptc-link/ptc-link.js +198 -198
  82. package/dist/collection/components/ptc-list/ptc-list.js +68 -68
  83. package/dist/collection/components/ptc-lottie/ptc-lottie.css +5 -5
  84. package/dist/collection/components/ptc-lottie/ptc-lottie.js +58 -58
  85. package/dist/collection/components/ptc-minimized-footer/ptc-minimized-footer.js +17 -17
  86. package/dist/collection/components/ptc-minimized-header/ptc-minimized-header.js +80 -80
  87. package/dist/collection/components/ptc-mobile-select/ptc-mobile-select.js +221 -221
  88. package/dist/collection/components/ptc-modal/ptc-modal.js +337 -337
  89. package/dist/collection/components/ptc-nav/ptc-nav.js +21 -21
  90. package/dist/collection/components/ptc-nav-item/ptc-nav-item.js +252 -252
  91. package/dist/collection/components/ptc-overlay/ptc-overlay.js +99 -99
  92. package/dist/collection/components/ptc-pagenation/ptc-pagenation.css +113 -0
  93. package/dist/collection/components/ptc-pagenation/ptc-pagenation.js +277 -0
  94. package/dist/collection/components/ptc-para/ptc-para.js +157 -157
  95. package/dist/collection/components/ptc-picture/ptc-picture.js +474 -474
  96. package/dist/collection/components/ptc-previous-url/ptc-previous-url.js +54 -54
  97. package/dist/collection/components/ptc-pricing-block/ptc-pricing-block.js +25 -25
  98. package/dist/collection/components/ptc-quote/ptc-quote.js +154 -154
  99. package/dist/collection/components/ptc-responsive-wrapper/ptc-responsive-wrapper.css +3 -3
  100. package/dist/collection/components/ptc-responsive-wrapper/ptc-responsive-wrapper.js +62 -62
  101. package/dist/collection/components/ptc-shopping-cart/ptc-shopping-cart.js +91 -91
  102. package/dist/collection/components/ptc-social-share/ptc-social-share.js +206 -206
  103. package/dist/collection/components/ptc-spacer/ptc-spacer.css +322 -322
  104. package/dist/collection/components/ptc-spacer/ptc-spacer.js +99 -99
  105. package/dist/collection/components/ptc-span/ptc-span.js +89 -89
  106. package/dist/collection/components/ptc-svg-btn/ptc-svg-btn.js +71 -71
  107. package/dist/collection/components/ptc-tab-list/ptc-tab-list.js +140 -140
  108. package/dist/collection/components/ptc-title/ptc-title.js +245 -245
  109. package/dist/collection/components/ptc-two-column-media/ptc-two-column-media.js +40 -40
  110. package/dist/collection/components/tab-content/tab-content.js +74 -74
  111. package/dist/collection/components/tab-header/tab-header.js +107 -107
  112. package/dist/collection/index.js +1 -1
  113. package/dist/collection/media/svg-imgs/Back-arrow.svg +11 -11
  114. package/dist/collection/media/svg-imgs/close.svg +10 -10
  115. package/dist/collection/media/svg-imgs/ptc-shopping-cart-black.svg +3 -3
  116. package/dist/collection/media/svg-imgs/ptc-shopping-cart-white.svg +3 -3
  117. package/dist/collection/media/svg-imgs/slider-arrow-left.svg +18 -18
  118. package/dist/collection/media/svg-imgs/slider-arrow-right.svg +18 -18
  119. package/dist/collection/media/svg-imgs/union.svg +3 -3
  120. package/dist/collection/utils/component.js +3 -3
  121. package/dist/collection/utils/interfaces.js +11 -11
  122. package/dist/collection/utils/utils.js +3 -3
  123. package/dist/custom-elements/index.d.ts +6 -0
  124. package/dist/custom-elements/index.js +2766 -2658
  125. package/dist/esm/dropdown-item.entry.js +10 -10
  126. package/dist/esm/icon-asset_13.entry.js +677 -677
  127. package/dist/esm/{interfaces-c1c73092.js → interfaces-7c0243be.js} +9 -9
  128. package/dist/esm/list-item.entry.js +19 -19
  129. package/dist/esm/loader.js +1 -1
  130. package/dist/esm/lottie-player.entry.js +354 -354
  131. package/dist/esm/my-component.entry.js +13 -13
  132. package/dist/esm/polyfills/core-js.js +0 -0
  133. package/dist/esm/polyfills/dom.js +0 -0
  134. package/dist/esm/polyfills/es5-html-element.js +0 -0
  135. package/dist/esm/polyfills/index.js +0 -0
  136. package/dist/esm/polyfills/system.js +0 -0
  137. package/dist/esm/ptc-accordion-item.entry.js +97 -97
  138. package/dist/esm/ptc-accordion.entry.js +38 -38
  139. package/dist/esm/ptc-announcement.entry.js +38 -38
  140. package/dist/esm/ptc-breadcrumb.entry.js +13 -13
  141. package/dist/esm/ptc-card-bottom.entry.js +31 -31
  142. package/dist/esm/ptc-card-content.entry.js +32 -32
  143. package/dist/esm/ptc-card-plm.entry.js +16 -16
  144. package/dist/esm/ptc-card.entry.js +69 -69
  145. package/dist/esm/ptc-date.entry.js +48 -48
  146. package/dist/esm/ptc-ellipsis-dropdown.entry.js +23 -23
  147. package/dist/esm/ptc-hero-footer-cta.entry.js +8 -8
  148. package/dist/esm/ptc-hero.entry.js +18 -18
  149. package/dist/esm/ptc-icon-list.entry.js +32 -32
  150. package/dist/esm/ptc-img_2.entry.js +169 -169
  151. package/dist/esm/ptc-list.entry.js +23 -23
  152. package/dist/esm/ptc-lottie.entry.js +12 -12
  153. package/dist/esm/ptc-minimized-footer.entry.js +8 -8
  154. package/dist/esm/ptc-minimized-header.entry.js +11 -11
  155. package/dist/esm/ptc-mobile-select.entry.js +69 -69
  156. package/dist/esm/ptc-nav-item.entry.js +83 -83
  157. package/dist/esm/ptc-nav.entry.js +8 -8
  158. package/dist/esm/ptc-pagenation.entry.js +107 -0
  159. package/dist/esm/ptc-picture.entry.js +169 -169
  160. package/dist/esm/ptc-previous-url.entry.js +8 -8
  161. package/dist/esm/ptc-pricing-block.entry.js +14 -14
  162. package/dist/esm/ptc-quote.entry.js +25 -25
  163. package/dist/esm/ptc-responsive-wrapper.entry.js +54 -54
  164. package/dist/esm/ptc-social-share.entry.js +64 -64
  165. package/dist/esm/ptc-span.entry.js +23 -23
  166. package/dist/esm/ptc-svg-btn.entry.js +75 -75
  167. package/dist/esm/ptc-tab-list.entry.js +116 -116
  168. package/dist/esm/ptc-two-column-media.entry.js +14 -14
  169. package/dist/esm/ptcw-design.js +1 -1
  170. package/dist/esm/tab-content.entry.js +26 -26
  171. package/dist/esm/tab-header.entry.js +43 -43
  172. package/dist/ptcw-design/media/brands.svg +1381 -1381
  173. package/dist/ptcw-design/media/designer.svg +338 -338
  174. package/dist/ptcw-design/media/regular.svg +463 -463
  175. package/dist/ptcw-design/media/solid.svg +3013 -3013
  176. package/dist/ptcw-design/media/svg-with-js.min.css +4 -4
  177. package/dist/ptcw-design/p-1884f74a.entry.js +1 -0
  178. package/dist/ptcw-design/{p-9e1fe694.entry.js → p-1b5090d8.entry.js} +1 -1
  179. package/dist/ptcw-design/p-246057c5.entry.js +1 -0
  180. package/dist/ptcw-design/p-26c9bc7b.entry.js +1 -0
  181. package/dist/ptcw-design/{p-5142e9f1.entry.js → p-4a80df00.entry.js} +1 -1
  182. package/dist/ptcw-design/{p-695f82bc.entry.js → p-7541c3e8.entry.js} +1 -1
  183. package/dist/ptcw-design/{p-83277ae9.entry.js → p-b61d821b.entry.js} +1 -1
  184. package/dist/ptcw-design/p-e5b8fc3d.entry.js +1 -0
  185. package/dist/ptcw-design/ptcw-design.css +1 -1
  186. package/dist/ptcw-design/ptcw-design.esm.js +1 -1
  187. package/dist/types/components/dropdown-item/dropdown-item.d.ts +5 -5
  188. package/dist/types/components/icon-asset/icon-asset.d.ts +36 -36
  189. package/dist/types/components/list-item/list-item.d.ts +8 -8
  190. package/dist/types/components/my-component/my-component.d.ts +16 -16
  191. package/dist/types/components/ptc-accordion/ptc-accordion-item/ptc-accordion-item.d.ts +59 -59
  192. package/dist/types/components/ptc-accordion/ptc-accordion.d.ts +13 -13
  193. package/dist/types/components/ptc-announcement/ptc-announcement.d.ts +43 -43
  194. package/dist/types/components/ptc-breadcrumb/ptc-breadcrumb.d.ts +4 -4
  195. package/dist/types/components/ptc-button/ptc-button.d.ts +56 -56
  196. package/dist/types/components/ptc-card/ptc-card.d.ts +54 -50
  197. package/dist/types/components/ptc-card-bottom/ptc-card-bottom.d.ts +15 -15
  198. package/dist/types/components/ptc-card-content/ptc-card-content.d.ts +15 -15
  199. package/dist/types/components/ptc-card-plm/ptc-card-plm.d.ts +8 -8
  200. package/dist/types/components/ptc-checkbox/ptc-checkbox.d.ts +11 -11
  201. package/dist/types/components/ptc-container/ptc-container.d.ts +12 -12
  202. package/dist/types/components/ptc-date/ptc-date.d.ts +41 -41
  203. package/dist/types/components/ptc-dropdown/ptc-dropdown.d.ts +18 -18
  204. package/dist/types/components/ptc-ellipsis-dropdown/ptc-ellipsis-dropdown.d.ts +10 -10
  205. package/dist/types/components/ptc-filter-tag/ptc-filter-tag.d.ts +11 -11
  206. package/dist/types/components/ptc-hero/ptc-hero.d.ts +12 -12
  207. package/dist/types/components/ptc-hero-footer-cta/ptc-hero-footer-cta.d.ts +6 -6
  208. package/dist/types/components/ptc-icon-list/ptc-icon-list.d.ts +21 -21
  209. package/dist/types/components/ptc-icon-minimize/ptc-icon-minimize.d.ts +9 -9
  210. package/dist/types/components/ptc-img/ptc-img.d.ts +51 -51
  211. package/dist/types/components/ptc-link/ptc-link.d.ts +36 -36
  212. package/dist/types/components/ptc-list/ptc-list.d.ts +6 -6
  213. package/dist/types/components/ptc-lottie/ptc-lottie.d.ts +12 -12
  214. package/dist/types/components/ptc-minimized-footer/ptc-minimized-footer.d.ts +3 -3
  215. package/dist/types/components/ptc-minimized-header/ptc-minimized-header.d.ts +6 -6
  216. package/dist/types/components/ptc-mobile-select/ptc-mobile-select.d.ts +40 -40
  217. package/dist/types/components/ptc-modal/ptc-modal.d.ts +55 -55
  218. package/dist/types/components/ptc-nav/ptc-nav.d.ts +3 -3
  219. package/dist/types/components/ptc-nav-item/ptc-nav-item.d.ts +53 -53
  220. package/dist/types/components/ptc-overlay/ptc-overlay.d.ts +20 -20
  221. package/dist/types/components/ptc-pagenation/ptc-pagenation.d.ts +25 -0
  222. package/dist/types/components/ptc-para/ptc-para.d.ts +28 -28
  223. package/dist/types/components/ptc-picture/ptc-picture.d.ts +93 -93
  224. package/dist/types/components/ptc-previous-url/ptc-previous-url.d.ts +5 -5
  225. package/dist/types/components/ptc-pricing-block/ptc-pricing-block.d.ts +4 -4
  226. package/dist/types/components/ptc-quote/ptc-quote.d.ts +29 -29
  227. package/dist/types/components/ptc-responsive-wrapper/ptc-responsive-wrapper.d.ts +8 -8
  228. package/dist/types/components/ptc-shopping-cart/ptc-shopping-cart.d.ts +6 -6
  229. package/dist/types/components/ptc-social-share/ptc-social-share.d.ts +25 -25
  230. package/dist/types/components/ptc-spacer/ptc-spacer.d.ts +16 -16
  231. package/dist/types/components/ptc-span/ptc-span.d.ts +16 -16
  232. package/dist/types/components/ptc-svg-btn/ptc-svg-btn.d.ts +12 -12
  233. package/dist/types/components/ptc-tab-list/ptc-tab-list.d.ts +14 -14
  234. package/dist/types/components/ptc-title/ptc-title.d.ts +41 -41
  235. package/dist/types/components/ptc-two-column-media/ptc-two-column-media.d.ts +9 -9
  236. package/dist/types/components/tab-content/tab-content.d.ts +12 -12
  237. package/dist/types/components/tab-header/tab-header.d.ts +13 -13
  238. package/dist/types/components.d.ts +64 -26
  239. package/dist/types/global.d.ts +1072 -1072
  240. package/dist/types/index.d.ts +1 -1
  241. package/dist/types/utils/component.d.ts +1 -1
  242. package/dist/types/utils/interfaces.d.ts +28 -28
  243. package/dist/types/utils/utils.d.ts +1 -1
  244. package/package.json +59 -59
  245. package/readme.md +11 -11
  246. package/dist/ptcw-design/p-32ec2097.entry.js +0 -1
  247. package/dist/ptcw-design/p-525da87e.entry.js +0 -1
  248. package/dist/ptcw-design/p-6ec21b76.entry.js +0 -1
  249. /package/dist/ptcw-design/{p-50e52c88.js → p-ee1183b2.js} +0 -0
@@ -6,128 +6,128 @@ const index = require('./index-3adcf9f4.js');
6
6
 
7
7
  const iconAssetCss = ".svg-inline--fa.sc-icon-asset,svg.sc-icon-asset:not(:root).svg-inline--fa{overflow:visible}.svg-inline--fa.sc-icon-asset{display:inline-block;font-size:inherit;height:1em;vertical-align:-.125em}.svg-inline--fa.fa-lg.sc-icon-asset{vertical-align:-.225em}.svg-inline--fa.fa-w-1.sc-icon-asset{width:.0625em}.svg-inline--fa.fa-w-2.sc-icon-asset{width:.125em}.svg-inline--fa.fa-w-3.sc-icon-asset{width:.1875em}.svg-inline--fa.fa-w-4.sc-icon-asset{width:.25em}.svg-inline--fa.fa-w-5.sc-icon-asset{width:.3125em}.svg-inline--fa.fa-w-6.sc-icon-asset{width:.375em}.svg-inline--fa.fa-w-7.sc-icon-asset{width:.4375em}.svg-inline--fa.fa-w-8.sc-icon-asset{width:.5em}.svg-inline--fa.fa-w-9.sc-icon-asset{width:.5625em}.svg-inline--fa.fa-w-10.sc-icon-asset{width:.625em}.svg-inline--fa.fa-w-11.sc-icon-asset{width:.6875em}.svg-inline--fa.fa-w-12.sc-icon-asset{width:.75em}.svg-inline--fa.fa-w-13.sc-icon-asset{width:.8125em}.svg-inline--fa.fa-w-14.sc-icon-asset{width:.875em}.svg-inline--fa.fa-w-15.sc-icon-asset{width:.9375em}.svg-inline--fa.fa-w-16.sc-icon-asset{width:1em}.svg-inline--fa.fa-w-17.sc-icon-asset{width:1.0625em}.svg-inline--fa.fa-w-18.sc-icon-asset{width:1.125em}.svg-inline--fa.fa-w-19.sc-icon-asset{width:1.1875em}.svg-inline--fa.fa-w-20.sc-icon-asset{width:1.25em}.svg-inline--fa.fa-pull-left.sc-icon-asset{margin-right:.3em;width:auto}.svg-inline--fa.fa-pull-right.sc-icon-asset{margin-left:.3em;width:auto}.svg-inline--fa.fa-border.sc-icon-asset{height:1.5em}.svg-inline--fa.fa-li.sc-icon-asset{width:2em}.svg-inline--fa.fa-fw.sc-icon-asset{width:1.25em}.fa-layers.sc-icon-asset svg.svg-inline--fa.sc-icon-asset{bottom:0;left:0;margin:auto;position:absolute;right:0;top:0}.fa-layers.sc-icon-asset{display:inline-block;height:1em;position:relative;text-align:center;vertical-align:-.125em;width:1em}.fa-layers.sc-icon-asset svg.svg-inline--fa.sc-icon-asset{-webkit-transform-origin:center center;transform-origin:center center}.fa-layers-counter.sc-icon-asset,.fa-layers-text.sc-icon-asset{display:inline-block;position:absolute;text-align:center}.fa-layers-text.sc-icon-asset{left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-transform-origin:center center;transform-origin:center center}.fa-layers-counter.sc-icon-asset{background-color:#ff253a;border-radius:1em;-webkit-box-sizing:border-box;box-sizing:border-box;color:#fff;height:1.5em;line-height:1;max-width:5em;min-width:1.5em;overflow:hidden;padding:.25em;right:0;text-overflow:ellipsis;top:0;-webkit-transform:scale(.25);transform:scale(.25);-webkit-transform-origin:top right;transform-origin:top right}.fa-layers-bottom-right.sc-icon-asset{bottom:0;right:0;top:auto;-webkit-transform:scale(.25);transform:scale(.25);-webkit-transform-origin:bottom right;transform-origin:bottom right}.fa-layers-bottom-left.sc-icon-asset{bottom:0;left:0;right:auto;top:auto;-webkit-transform:scale(.25);transform:scale(.25);-webkit-transform-origin:bottom left;transform-origin:bottom left}.fa-layers-top-right.sc-icon-asset{right:0;top:0;-webkit-transform:scale(.25);transform:scale(.25);-webkit-transform-origin:top right;transform-origin:top right}.fa-layers-top-left.sc-icon-asset{left:0;right:auto;top:0;-webkit-transform:scale(.25);transform:scale(.25);-webkit-transform-origin:top left;transform-origin:top left}.fa-lg.sc-icon-asset{font-size:1.33333em;line-height:.75em;vertical-align:-.0667em}.fa-xs.sc-icon-asset{font-size:.75em}.fa-sm.sc-icon-asset{font-size:.875em}.fa-1x.sc-icon-asset{font-size:1em}.fa-2x.sc-icon-asset{font-size:2em}.fa-3x.sc-icon-asset{font-size:3em}.fa-4x.sc-icon-asset{font-size:4em}.fa-5x.sc-icon-asset{font-size:5em}.fa-6x.sc-icon-asset{font-size:6em}.fa-7x.sc-icon-asset{font-size:7em}.fa-8x.sc-icon-asset{font-size:8em}.fa-9x.sc-icon-asset{font-size:9em}.fa-10x.sc-icon-asset{font-size:10em}.fa-fw.sc-icon-asset{text-align:center;width:1.25em}.fa-ul.sc-icon-asset{list-style-type:none;margin-left:2.5em;padding-left:0}.fa-ul.sc-icon-asset>li.sc-icon-asset{position:relative}.fa-li.sc-icon-asset{left:-2em;position:absolute;text-align:center;width:2em;line-height:inherit}.fa-border.sc-icon-asset{border:.08em solid #eee;border-radius:.1em;padding:.2em .25em .15em}.fa-pull-left.sc-icon-asset{float:left}.fa-pull-right.sc-icon-asset{float:right}.fa.fa-pull-left.sc-icon-asset,.fab.fa-pull-left.sc-icon-asset,.fal.fa-pull-left.sc-icon-asset,.far.fa-pull-left.sc-icon-asset,.fas.fa-pull-left.sc-icon-asset{margin-right:.3em}.fa.fa-pull-right.sc-icon-asset,.fab.fa-pull-right.sc-icon-asset,.fal.fa-pull-right.sc-icon-asset,.far.fa-pull-right.sc-icon-asset,.fas.fa-pull-right.sc-icon-asset{margin-left:.3em}.fa-spin.sc-icon-asset{-webkit-animation:fa-spin 2s linear infinite;animation:fa-spin 2s linear infinite}.fa-pulse.sc-icon-asset{-webkit-animation:fa-spin 1s steps(8) infinite;animation:fa-spin 1s steps(8) infinite}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.fa-rotate-90.sc-icon-asset{-ms-filter:\"progid:DXImageTransform.Microsoft.BasicImage(rotation=1)\";-webkit-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180.sc-icon-asset{-ms-filter:\"progid:DXImageTransform.Microsoft.BasicImage(rotation=2)\";-webkit-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270.sc-icon-asset{-ms-filter:\"progid:DXImageTransform.Microsoft.BasicImage(rotation=3)\";-webkit-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal.sc-icon-asset{-ms-filter:\"progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)\";-webkit-transform:scaleX(-1);transform:scaleX(-1)}.fa-flip-vertical.sc-icon-asset{-webkit-transform:scaleY(-1);transform:scaleY(-1)}.fa-flip-both.sc-icon-asset,.fa-flip-horizontal.fa-flip-vertical.sc-icon-asset,.fa-flip-vertical.sc-icon-asset{-ms-filter:\"progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)\"}.fa-flip-both.sc-icon-asset,.fa-flip-horizontal.fa-flip-vertical.sc-icon-asset{-webkit-transform:scale(-1);transform:scale(-1)}.sc-icon-asset:root .fa-flip-both.sc-icon-asset,.sc-icon-asset:root .fa-flip-horizontal.sc-icon-asset,.sc-icon-asset:root .fa-flip-vertical.sc-icon-asset,.sc-icon-asset:root .fa-rotate-90.sc-icon-asset,.sc-icon-asset:root .fa-rotate-180.sc-icon-asset,.sc-icon-asset:root .fa-rotate-270.sc-icon-asset{-webkit-filter:none;filter:none}.fa-stack.sc-icon-asset{display:inline-block;height:2em;position:relative;width:2.5em}.fa-stack-1x.sc-icon-asset,.fa-stack-2x.sc-icon-asset{bottom:0;left:0;margin:auto;position:absolute;right:0;top:0}.svg-inline--fa.fa-stack-1x.sc-icon-asset{height:1em;width:1.25em}.svg-inline--fa.fa-stack-2x.sc-icon-asset{height:2em;width:2.5em}.fa-inverse.sc-icon-asset{color:#fff}.sr-only.sc-icon-asset{border:0;clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.sr-only-focusable.sc-icon-asset:active,.sr-only-focusable.sc-icon-asset:focus{clip:auto;height:auto;margin:0;overflow:visible;position:static;width:auto}.svg-inline--fa.sc-icon-asset .fa-primary.sc-icon-asset{fill:var(--fa-primary-color,currentColor);opacity:1;opacity:var(--fa-primary-opacity,1)}.svg-inline--fa.sc-icon-asset .fa-secondary.sc-icon-asset{fill:var(--fa-secondary-color,currentColor)}.svg-inline--fa.sc-icon-asset .fa-secondary.sc-icon-asset,.svg-inline--fa.fa-swap-opacity.sc-icon-asset .fa-primary.sc-icon-asset{opacity:.4;opacity:var(--fa-secondary-opacity,.4)}.svg-inline--fa.fa-swap-opacity.sc-icon-asset .fa-secondary.sc-icon-asset{opacity:1;opacity:var(--fa-primary-opacity,1)}.svg-inline--fa.sc-icon-asset mask.sc-icon-asset .fa-primary.sc-icon-asset,.svg-inline--fa.sc-icon-asset mask.sc-icon-asset .fa-secondary.sc-icon-asset{fill:#000}.fad.fa-inverse.sc-icon-asset{color:#fff}icon-asset.sc-icon-asset{vertical-align:middle}svg.sc-icon-asset{transition:all var(--ptc-transition-medium) var(--ptc-ease-inout)}svg.xxx-small.sc-icon-asset{width:var(--ptc-font-size-xxx-small);height:var(--ptc-font-size-xxx-small)}svg.xx-small.sc-icon-asset{width:var(--ptc-font-size-xx-small);height:var(--ptc-font-size-xx-small)}svg.x-small.sc-icon-asset{width:var(--ptc-font-size-x-small);height:var(--ptc-font-size-x-small)}svg.small.sc-icon-asset{width:var(--ptc-font-size-small);height:var(--ptc-font-size-small)}svg.medium.sc-icon-asset{width:var(--ptc-font-size-medium);height:var(--ptc-font-size-medium)}svg.large.sc-icon-asset{width:var(--ptc-font-size-large);height:var(--ptc-font-size-large)}svg.x-large.sc-icon-asset{width:var(--ptc-font-size-x-large);height:var(--ptc-font-size-x-large)}svg.xx-large.sc-icon-asset{width:var(--ptc-font-size-xx-large);height:var(--ptc-font-size-xx-large)}svg.xxx-large.sc-icon-asset{width:var(--ptc-font-size-xxx-large);height:var(--ptc-font-size-xxx-large)}svg.xxxx-large.sc-icon-asset{width:var(--ptc-font-size-xxxx-large);height:var(--ptc-font-size-xxxx-large)}svg.white.sc-icon-asset{fill:var(--color-white)}svg.black.sc-icon-asset{fill:var(--color-black)}svg.ptc-green.sc-icon-asset{fill:var(--color-green-07)}svg.gray.sc-icon-asset{fill:var(--color-gray-06)}svg.inherit.sc-icon-asset{fill:inherit}";
8
8
 
9
- let IconAsset = class {
10
- constructor(hostRef) {
11
- index.registerInstance(this, hostRef);
12
- /**
13
- * Icon Size
14
- */
15
- this.size = 'xx-small';
16
- /**
17
- * Icon Type
18
- */
19
- this.type = 'regular';
20
- /**
21
- * Icon Spin Animation (not valid for ptc type)
22
- */
23
- this.spin = '';
24
- /**
25
- * Icon Pulse Animation (not valid for ptc type)
26
- */
27
- this.pulse = '';
28
- /**
29
- * Icon Color
30
- */
31
- this.color = 'default';
32
- this.regularSprite = index.getAssetPath('./media/regular.svg');
33
- this.solidSprite = index.getAssetPath('./media/solid.svg');
34
- this.brandSprite = index.getAssetPath('./media/brands.svg');
35
- this.ptcSprite = index.getAssetPath('./media/designer.svg');
36
- }
37
- render() {
38
- const classMap = this.getCssClassMap();
39
- if (this.type == 'brands') {
40
- return (index.h(index.Host, null, this.injectedStyle && index.h("style", null, this.injectedStyle), index.h("svg", { class: classMap }, index.h("use", { href: `${this.brandSprite}#${this.name}` }))));
41
- }
42
- else if (this.type == 'solid') {
43
- return (index.h(index.Host, null, this.injectedStyle && index.h("style", null, this.injectedStyle), index.h("svg", { class: classMap }, index.h("use", { href: `${this.solidSprite}#${this.name}` }))));
44
- }
45
- else if (this.type == 'ptc') {
46
- return (index.h(index.Host, null, this.injectedStyle && index.h("style", null, this.injectedStyle), index.h("svg", { class: classMap }, index.h("use", { href: `${this.ptcSprite}#${this.name}` }))));
47
- }
48
- else {
49
- return (index.h(index.Host, null, this.injectedStyle && index.h("style", null, this.injectedStyle), index.h("svg", { class: classMap }, index.h("use", { href: `${this.regularSprite}#${this.name}` }))));
50
- }
51
- }
52
- getCssClassMap() {
53
- return {
54
- [this.size]: true,
55
- [this.spin]: true,
56
- [this.pulse]: true,
57
- [this.color]: true,
58
- };
59
- }
60
- static get assetsDirs() { return ["media"]; }
61
- };
9
+ let IconAsset = class {
10
+ constructor(hostRef) {
11
+ index.registerInstance(this, hostRef);
12
+ /**
13
+ * Icon Size
14
+ */
15
+ this.size = 'xx-small';
16
+ /**
17
+ * Icon Type
18
+ */
19
+ this.type = 'regular';
20
+ /**
21
+ * Icon Spin Animation (not valid for ptc type)
22
+ */
23
+ this.spin = '';
24
+ /**
25
+ * Icon Pulse Animation (not valid for ptc type)
26
+ */
27
+ this.pulse = '';
28
+ /**
29
+ * Icon Color
30
+ */
31
+ this.color = 'default';
32
+ this.regularSprite = index.getAssetPath('./media/regular.svg');
33
+ this.solidSprite = index.getAssetPath('./media/solid.svg');
34
+ this.brandSprite = index.getAssetPath('./media/brands.svg');
35
+ this.ptcSprite = index.getAssetPath('./media/designer.svg');
36
+ }
37
+ render() {
38
+ const classMap = this.getCssClassMap();
39
+ if (this.type == 'brands') {
40
+ return (index.h(index.Host, null, this.injectedStyle && index.h("style", null, this.injectedStyle), index.h("svg", { class: classMap }, index.h("use", { href: `${this.brandSprite}#${this.name}` }))));
41
+ }
42
+ else if (this.type == 'solid') {
43
+ return (index.h(index.Host, null, this.injectedStyle && index.h("style", null, this.injectedStyle), index.h("svg", { class: classMap }, index.h("use", { href: `${this.solidSprite}#${this.name}` }))));
44
+ }
45
+ else if (this.type == 'ptc') {
46
+ return (index.h(index.Host, null, this.injectedStyle && index.h("style", null, this.injectedStyle), index.h("svg", { class: classMap }, index.h("use", { href: `${this.ptcSprite}#${this.name}` }))));
47
+ }
48
+ else {
49
+ return (index.h(index.Host, null, this.injectedStyle && index.h("style", null, this.injectedStyle), index.h("svg", { class: classMap }, index.h("use", { href: `${this.regularSprite}#${this.name}` }))));
50
+ }
51
+ }
52
+ getCssClassMap() {
53
+ return {
54
+ [this.size]: true,
55
+ [this.spin]: true,
56
+ [this.pulse]: true,
57
+ [this.color]: true,
58
+ };
59
+ }
60
+ static get assetsDirs() { return ["media"]; }
61
+ };
62
62
  IconAsset.style = iconAssetCss;
63
63
 
64
64
  const ptcButtonCss = "button.disabled{pointer-events:none;opacity:0.6}button{background-color:var(--color-gray-10);display:inline-block;border-style:solid;border-width:1px;white-space:normal;position:relative;text-decoration:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;cursor:pointer;padding:9.4px 17.5px;border-radius:var(--ptc-border-radius-standard)}button.animation-right ::slotted([slot=slot-after-text]),button.animation-right ::slotted([slot=slot-before-text]),button.animation-down ::slotted([slot=slot-after-text]),button.animation-down ::slotted([slot=slot-before-text]){transition:transform var(--ptc-transition-medium) var(--ptc-ease-inout);position:relative;display:inline-block}button:hover.animation-right ::slotted([slot=slot-after-text]),button:hover.animation-right ::slotted([slot=slot-before-text]){transform:translateX(var(--ptc-element-spacing-02))}button:hover.animation-down ::slotted([slot=slot-after-text]),button:hover.animation-down ::slotted([slot=slot-before-text]){transform:translateY(var(--ptc-element-spacing-02))}button span{font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-small);font-weight:bold;line-height:var(--ptc-line-height-densest)}.icon-left ::slotted([slot=slot-before-text]){margin-right:var(--ptc-element-spacing-01)}.icon-right ::slotted([slot=slot-after-text]){margin-left:var(--ptc-element-spacing-01)}.blackgrey{box-shadow:var(--ptc-shadow-x-small);border:solid 1px var(--color-gray-10);background-image:linear-gradient(285deg, var(--color-gray-10) 155%, var(--color-gray-07) 62%)}.blackgrey:hover{box-shadow:var(--ptc-shadow-x-large)}.blackgrey span{color:var(--color-white)}.turtlegreen{box-shadow:var(--ptc-shadow-x-small);border:solid 1px var(--color-green-07);background-image:linear-gradient(285deg, var(--color-green-07) 155%, var(--color-green-07) 62%)}.turtlegreen:hover{box-shadow:var(--ptc-shadow-x-large)}.turtlegreen span{color:var(--color-white)}.offwhite{box-shadow:var(--ptc-shadow-x-small);border:solid 1px var(--color-gray-10);background-image:linear-gradient(to right, var(--color-white), var(--color-gray-02), var(--color-gray-01))}.offwhite:hover{box-shadow:var(--ptc-shadow-x-large)}.offwhite span{color:var(--color-gray-10)}.legacy-green{margin-left:10px;padding:10px 20px;margin-bottom:var(--ptc-element-spacing-01);margin-top:var(--ptc-element-spacing-01);box-shadow:var(--ptc-shadow-large);border:solid 2.5px var(--color-green-08);background-image:linear-gradient(to right, var(--color-green-06), var(--color-green-08))}.legacy-green:after{position:absolute;content:\"\";top:-1px;left:0;bottom:0;right:0;width:100%;height:103%;background-image:linear-gradient(to right, var(--color-green-08), var(--color-green-06));opacity:0;transition:opacity var(--ptc-transition-x-slow) var(--ptc-ease-inout);border-radius:2px}.legacy-green:hover{box-shadow:var(--ptc-shadow-x-large)}.legacy-green:hover span{color:var(--color-white)}.legacy-green:hover:after{opacity:1}.legacy-green span{font-family:var(--ptc-font-secondary-latin);color:var(--color-white);z-index:100;position:relative;text-transform:uppercase;font-weight:var(--ptc-font-weight-bold);letter-spacing:var(--ptc-letter-spacing-normal);font-size:var(--ptc-font-size-x-small)}@media only screen and (min-width: 768px){.legacy-green span{font-size:var(--ptc-font-size-small);letter-spacing:var(--ptc-letter-spacing-loose)}}.legacy-green icon-asset{display:inline}a{border-style:solid;border-width:1px;position:relative;text-decoration:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;padding:9.4px 17.5px;border-radius:var(--ptc-border-radius-standard);display:inline-block;position:relative}a.animation-right ::slotted([slot=slot-after-text]),a.animation-right ::slotted([slot=slot-before-text]),a.animation-down ::slotted([slot=slot-after-text]),a.animation-down ::slotted([slot=slot-before-text]){transition:all var(--ptc-ease-inout) var(--ptc-transition-medium);position:relative;display:inline-block;margin-left:5px}a:hover.animation-right ::slotted([slot=slot-after-text]),a:hover.animation-right ::slotted([slot=slot-before-text]){transform:translateX(var(--ptc-element-spacing-02))}a:hover.animation-down ::slotted([slot=slot-after-text]),a:hover.animation-down ::slotted([slot=slot-before-text]){transform:translateY(var(--ptc-element-spacing-02))}.nav{font-family:var(--ptc-font-latin);background-color:var(--color-gray-10);border-radius:var(--ptc-border-radius-standard);border:1px solid var(--color-white);border-bottom-style:solid;border-bottom-width:1px;box-sizing:border-box;color:var(--color-white);display:inline-block;font-size:var(--ptc-font-size-xx-small);font-stretch:100%;font-weight:var(--ptc-font-weight-bold);line-height:var(--ptc-line-height-loose);list-style:none;padding:3px var(--ptc-element-spacing-04);position:relative;text-align:center;text-decoration:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;transition:background-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.nav:focus{outline:3px solid var(--color-blue-07);outline-offset:2px}.nav:hover{background-color:var(--color-gray-12)}.ptc-primary,.ptc-quaternary,.ptc-secondary,.ptc-tertiary{padding:var(--ptc-font-size-xx-small) var(--ptc-font-size-medium);transition:background-color var(--ptc-ease-inout) var(--ptc-transition-medium);line-height:20px}.ptc-primary.disabled,.ptc-quaternary.disabled,.ptc-secondary.disabled,.ptc-tertiary.disabled{pointer-events:none;border-color:var(--color-gray-03);background:var(--color-gray-02)}.ptc-primary.disabled span,.ptc-quaternary.disabled span,.ptc-secondary.disabled span,.ptc-tertiary.disabled span{color:var(--color-gray-03)}.ptc-primary.disabled ::slotted([slot=slot-after-text]),.ptc-quaternary.disabled ::slotted([slot=slot-after-text]),.ptc-secondary.disabled ::slotted([slot=slot-after-text]),.ptc-tertiary.disabled ::slotted([slot=slot-after-text]){fill:var(--color-gray-03) !important}.ptc-primary:focus,.ptc-quaternary:focus,.ptc-secondary:focus,.ptc-tertiary:focus{outline:3px solid var(--color-blue-07);outline-offset:2px}.ptc-primary span,.ptc-quaternary span,.ptc-secondary span,.ptc-tertiary span{font-family:var(--ptc-font-latin);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-densest);letter-spacing:normal}.ptc-primary{background:var(--color-gray-10);border:2px solid var(--color-green-07);border-radius:var(--ptc-border-radius-standard)}.ptc-primary:hover{background-color:var(--color-gray-12)}.ptc-primary:active{background-color:var(--color-black)}.ptc-primary span{color:var(--color-white)}.ptc-primary ::slotted([slot=slot-after-text]){fill:var(--color-white) !important}.ptc-secondary{background:var(--color-gray-10);border:2px solid var(--color-gray-08);border-radius:var(--ptc-border-radius-standard)}.ptc-secondary:hover{background-color:var(--color-gray-12)}.ptc-secondary:active{background-color:var(--color-black)}.ptc-secondary span{color:var(--color-white)}.ptc-secondary ::slotted([slot=slot-after-text]){fill:var(--color-white) !important}.ptc-tertiary{background:var(--color-white);border:2px solid var(--color-gray-10);border-radius:var(--ptc-border-radius-standard)}.ptc-tertiary:hover{background-color:var(--color-gray-02)}.ptc-tertiary:active{background-color:var(--color-gray-03)}.ptc-tertiary span{color:var(--color-gray-10)}.ptc-tertiary ::slotted([slot=slot-after-text]){fill:var(--color-gray-10) !important}.ptc-quaternary{background:var(--color-green-07);border:2px solid var(--color-green-07);border-radius:var(--ptc-border-radius-standard)}.ptc-quaternary:hover{background-color:var(--color-green-08)}.ptc-quaternary:active{background-color:var(--color-green-09)}.ptc-quaternary span{color:var(--color-white)}.ptc-quaternary ::slotted([slot=slot-after-text]){fill:var(--color-white) !important}";
65
65
 
66
- let PtcButton = class {
67
- constructor(hostRef) {
68
- index.registerInstance(this, hostRef);
69
- this.clickEvent = index.createEvent(this, "clickEvent", 7);
70
- /**
71
- * Disabled button
72
- */
73
- this.disabled = false;
74
- /**
75
- * Button type
76
- */
77
- this.type = 'button';
78
- /**
79
- * Button theme color
80
- */
81
- this.color = 'ptc-primary';
82
- /**
83
- * Icon Animation
84
- */
85
- this.iconAnimation = '';
86
- /**
87
- * Icon Position
88
- */
89
- this.iconPosition = 'icon-right';
90
- /**
91
- * Link URL
92
- */
93
- this.linkHref = undefined;
94
- /**
95
- * link Title
96
- */
97
- this.linkTitle = undefined;
98
- /**
99
- * Link target
100
- * */
101
- this.target = '_self';
102
- /**
103
- * Link rel
104
- * */
105
- this.rel = undefined;
106
- /**
107
- * (optional) tab-nav.
108
- * indicates that its element can be focused, and where it participates in sequential keyboard navigation.
109
- * A negative value (usually tabindex="-1") means that the element is not reachable via sequential keyboard navigation
110
- */
111
- this.tabNav = 0;
112
- }
113
- clickEventHandler() {
114
- this.clickEvent.emit();
115
- //console.log('click!');
116
- }
117
- render() {
118
- const classMap = this.getCssClassMap();
119
- const Tag = !!this.linkHref ? 'a' : 'button';
120
- return (index.h(index.Host, null, this.styles && index.h("style", null, this.styles), index.h(Tag, Object.assign({ class: classMap, onClick: this.clickEventHandler.bind(this) }, (!!this.linkHref ? { href: this.linkHref } : {}), (!this.linkHref ? { type: this.type } : {}), (!!this.target && !!this.linkHref ? { target: this.target } : {}), (!!this.rel && !!this.linkHref ? { rel: this.rel } : {}), (!!this.linkHref ? { title: this.linkTitle ? this.linkTitle : this.linkHref } : {}), (!!this.tabNav ? { tabindex: -1 } : { tabindex: 0 })), index.h("span", null, index.h("slot", { name: "slot-before-text" }), index.h("slot", null), index.h("slot", { name: "slot-after-text" })))));
121
- }
122
- getCssClassMap() {
123
- return {
124
- [this.color]: true,
125
- [this.iconAnimation]: true,
126
- [this.iconPosition]: true,
127
- ['disabled']: this.disabled ? true : false,
128
- };
129
- }
130
- };
66
+ let PtcButton = class {
67
+ constructor(hostRef) {
68
+ index.registerInstance(this, hostRef);
69
+ this.clickEvent = index.createEvent(this, "clickEvent", 7);
70
+ /**
71
+ * Disabled button
72
+ */
73
+ this.disabled = false;
74
+ /**
75
+ * Button type
76
+ */
77
+ this.type = 'button';
78
+ /**
79
+ * Button theme color
80
+ */
81
+ this.color = 'ptc-primary';
82
+ /**
83
+ * Icon Animation
84
+ */
85
+ this.iconAnimation = '';
86
+ /**
87
+ * Icon Position
88
+ */
89
+ this.iconPosition = 'icon-right';
90
+ /**
91
+ * Link URL
92
+ */
93
+ this.linkHref = undefined;
94
+ /**
95
+ * link Title
96
+ */
97
+ this.linkTitle = undefined;
98
+ /**
99
+ * Link target
100
+ * */
101
+ this.target = '_self';
102
+ /**
103
+ * Link rel
104
+ * */
105
+ this.rel = undefined;
106
+ /**
107
+ * (optional) tab-nav.
108
+ * indicates that its element can be focused, and where it participates in sequential keyboard navigation.
109
+ * A negative value (usually tabindex="-1") means that the element is not reachable via sequential keyboard navigation
110
+ */
111
+ this.tabNav = 0;
112
+ }
113
+ clickEventHandler() {
114
+ this.clickEvent.emit();
115
+ //console.log('click!');
116
+ }
117
+ render() {
118
+ const classMap = this.getCssClassMap();
119
+ const Tag = !!this.linkHref ? 'a' : 'button';
120
+ return (index.h(index.Host, null, this.styles && index.h("style", null, this.styles), index.h(Tag, Object.assign({ class: classMap, onClick: this.clickEventHandler.bind(this) }, (!!this.linkHref ? { href: this.linkHref } : {}), (!this.linkHref ? { type: this.type } : {}), (!!this.target && !!this.linkHref ? { target: this.target } : {}), (!!this.rel && !!this.linkHref ? { rel: this.rel } : {}), (!!this.linkHref ? { title: this.linkTitle ? this.linkTitle : this.linkHref } : {}), (!!this.tabNav ? { tabindex: -1 } : { tabindex: 0 })), index.h("span", null, index.h("slot", { name: "slot-before-text" }), index.h("slot", null), index.h("slot", { name: "slot-after-text" })))));
121
+ }
122
+ getCssClassMap() {
123
+ return {
124
+ [this.color]: true,
125
+ [this.iconAnimation]: true,
126
+ [this.iconPosition]: true,
127
+ ['disabled']: this.disabled ? true : false,
128
+ };
129
+ }
130
+ };
131
131
  PtcButton.style = ptcButtonCss;
132
132
 
133
133
  const CheckIcon = `<svg width="14" height="10" viewBox="0 0 14 10" fill="none" xmlns="http://www.w3.org/2000/svg">
@@ -137,610 +137,610 @@ const CheckIcon = `<svg width="14" height="10" viewBox="0 0 14 10" fill="none" x
137
137
 
138
138
  const ptcCheckboxCss = ":host{display:block}:host .ptc-checkbox{display:block;position:relative;user-select:none;cursor:pointer;font-family:\"Raleway\";font-style:normal;color:var(--color-gray-10);padding-left:var(--spacing-lg);font-weight:var(--ptc-font-weight-regular);font-size:var(--ptc-font-size-x-small);line-height:var(--ptc-line-height-dense)}:host .ptc-checkbox input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}:host .ptc-checkbox .check{position:absolute;top:0;left:0;height:1.375rem;width:1.375rem;background-color:var(--color-white);border:1px solid var(--color-gray-07);box-sizing:border-box;border-radius:0.4rem}:host .ptc-checkbox .check .mark{position:absolute;transition:opacity ease-out 250ms;opacity:0;left:3px;top:-2px;width:1.375rem;height:1.375rem}:host .ptc-checkbox input:checked~.check{background-color:#1F2024}:host .ptc-checkbox input:checked~.check .mark{opacity:1}:host .ptc-checkbox:hover input~.check{background-color:#E4E7E9}:host .ptc-checkbox:hover input:checked~.check{background-color:#33353A}";
139
139
 
140
- let PtcCheckbox = class {
141
- constructor(hostRef) {
142
- index.registerInstance(this, hostRef);
143
- this.checkedChanged = index.createEvent(this, "checkedChanged", 7);
144
- this.checked = 'unchecked';
145
- this.handleClick = (e) => {
146
- let input = this.host.shadowRoot.querySelector('input');
147
- let parameter = {
148
- event: e,
149
- sender: input,
150
- value: this.value,
151
- checked: this.checked
152
- };
153
- if (this.checked == 'unchecked') {
154
- this.checked = 'checked';
155
- }
156
- else {
157
- this.checked = 'unchecked';
158
- }
159
- this.checkedChanged.emit(parameter);
160
- };
161
- }
162
- componentDidLoad() {
163
- let input = this.host.shadowRoot.querySelector('input');
164
- input.checked = this.checked == 'checked';
165
- }
166
- render() {
167
- return (index.h(index.Host, null, index.h("label", { class: "ptc-checkbox", onClick: (e) => this.handleClick(e) }, index.h("slot", null), index.h("input", { type: "checkbox", name: this.inputName, value: this.value }), index.h("span", { class: "check" }, index.h("span", { class: "mark", innerHTML: CheckIcon })))));
168
- }
169
- get host() { return index.getElement(this); }
170
- };
140
+ let PtcCheckbox = class {
141
+ constructor(hostRef) {
142
+ index.registerInstance(this, hostRef);
143
+ this.checkedChanged = index.createEvent(this, "checkedChanged", 7);
144
+ this.checked = 'unchecked';
145
+ this.handleClick = (e) => {
146
+ let input = this.host.shadowRoot.querySelector('input');
147
+ let parameter = {
148
+ event: e,
149
+ sender: input,
150
+ value: this.value,
151
+ checked: this.checked
152
+ };
153
+ if (this.checked == 'unchecked') {
154
+ this.checked = 'checked';
155
+ }
156
+ else {
157
+ this.checked = 'unchecked';
158
+ }
159
+ this.checkedChanged.emit(parameter);
160
+ };
161
+ }
162
+ componentDidLoad() {
163
+ let input = this.host.shadowRoot.querySelector('input');
164
+ input.checked = this.checked == 'checked';
165
+ }
166
+ render() {
167
+ return (index.h(index.Host, null, index.h("label", { class: "ptc-checkbox", onClick: (e) => this.handleClick(e) }, index.h("slot", null), index.h("input", { type: "checkbox", name: this.inputName, value: this.value }), index.h("span", { class: "check" }, index.h("span", { class: "mark", innerHTML: CheckIcon })))));
168
+ }
169
+ get host() { return index.getElement(this); }
170
+ };
171
171
  PtcCheckbox.style = ptcCheckboxCss;
172
172
 
173
173
  const ptcContainerCss = ":host{display:block;position:relative}.white{border-radius:4px;background-color:var(--color-white)}.gray{border-radius:4px;background-color:var(--color-white-gray)}.content-wrapper{font-family:Raleway;font-size:16px;font-weight:400;line-height:24px;letter-spacing:0;text-align:left}.content-wrapper.x-small{box-shadow:var(--ptc-shadow-x-small)}.content-wrapper.small{box-shadow:var(--ptc-shadow-small)}.content-wrapper.medium{box-shadow:var(--ptc-shadow-medium)}.content-wrapper.large{box-shadow:var(--ptc-shadow-large)}.content-wrapper.x-large{box-shadow:var(--ptc-shadow-x-large)}.content-wrapper.spacing-xx-small{padding:var(--ptc-element-spacing-01)}.content-wrapper.spacing-x-small{padding:var(--ptc-element-spacing-02)}.content-wrapper.spacing-small{padding:var(--ptc-element-spacing-03)}.content-wrapper.spacing-medium{padding:var(--ptc-element-spacing-04)}.content-wrapper.spacing-large{padding:var(--ptc-element-spacing-05)}.content-wrapper.spacing-x-large{padding:var(--ptc-element-spacing-06)}.content-wrapper.spacing-xx-large{padding:var(--ptc-element-spacing-07)}.content-wrapper.spacing-xxx-large{padding:var(--ptc-element-spacing-08)}";
174
174
 
175
- let PtcContainer = class {
176
- constructor(hostRef) {
177
- index.registerInstance(this, hostRef);
178
- /**
179
- * Theme
180
- */
181
- this.backgroundColor = 'white';
182
- this.elevation = 'small';
183
- this.containerType = 'normal';
184
- this.spacing = 'xxx-large';
185
- }
186
- render() {
187
- const classMap = this.getCssClassMap();
188
- return (index.h(index.Host, { class: this.getContainerClass() }, index.h("div", { class: classMap }, index.h("slot", null))));
189
- }
190
- getContainerClass() {
191
- switch (this.containerType) {
192
- case 'large':
193
- return 'ptc-container-lg';
194
- case 'none':
195
- return undefined;
196
- default:
197
- return 'ptc-container';
198
- }
199
- }
200
- getCssClassMap() {
201
- const spacing = `spacing-${this.spacing}`;
202
- return {
203
- ['content-wrapper']: true,
204
- [this.backgroundColor]: true,
205
- [this.elevation]: true,
206
- [spacing]: true
207
- };
208
- }
209
- };
175
+ let PtcContainer = class {
176
+ constructor(hostRef) {
177
+ index.registerInstance(this, hostRef);
178
+ /**
179
+ * Theme
180
+ */
181
+ this.backgroundColor = 'white';
182
+ this.elevation = 'small';
183
+ this.containerType = 'normal';
184
+ this.spacing = 'xxx-large';
185
+ }
186
+ render() {
187
+ const classMap = this.getCssClassMap();
188
+ return (index.h(index.Host, { class: this.getContainerClass() }, index.h("div", { class: classMap }, index.h("slot", null))));
189
+ }
190
+ getContainerClass() {
191
+ switch (this.containerType) {
192
+ case 'large':
193
+ return 'ptc-container-lg';
194
+ case 'none':
195
+ return undefined;
196
+ default:
197
+ return 'ptc-container';
198
+ }
199
+ }
200
+ getCssClassMap() {
201
+ const spacing = `spacing-${this.spacing}`;
202
+ return {
203
+ ['content-wrapper']: true,
204
+ [this.backgroundColor]: true,
205
+ [this.elevation]: true,
206
+ [spacing]: true
207
+ };
208
+ }
209
+ };
210
210
  PtcContainer.style = ptcContainerCss;
211
211
 
212
212
  const ptcDropdownCss = "@charset \"UTF-8\";:host{position:relative}:host .dropdown__header{cursor:pointer;transition:background-color ease-out 250ms, border-color ease-out 250ms;background-color:var(--color-white);display:flex;align-items:center;align-content:center;border:1px solid var(--color-gray-05);padding:0.25rem 0.75rem 0.25rem 0.75rem;border-radius:4px;font-family:Raleway;font-size:16px;font-weight:400;line-height:24px;letter-spacing:0em;text-align:left}:host .dropdown__header b{font-weight:600}:host .dropdown__header icon-asset{width:1rem;height:1rem;margin-left:0.5rem}:host .dropdown__header:hover{background-color:var(--color-gray-02)}:host .dropdown__list{display:table;border:1px solid rgba(0, 0, 0, 0.24);border-radius:8px}:host ul{display:block;top:0.2rem;right:0.2rem;margin:0;list-style-type:none;padding-inline-start:0;padding:0.25rem 0.25rem;background-color:var(--color-gray-02);cursor:pointer;position:absolute;z-index:500}:host ul li{white-space:nowrap;padding:3px 1rem;font-weight:500}:host ul li.selected:before{content:\"✓\";display:block;position:absolute;left:0.4rem}:host ul li:hover{color:#fff;background-color:#699af8;border-radius:4px}";
213
213
 
214
- let PtcDropdown = class {
215
- constructor(hostRef) {
216
- index.registerInstance(this, hostRef);
217
- this.clickedItem = index.createEvent(this, "clickedItem", 7);
218
- /**
219
- * Theme
220
- */
221
- this.theme = 'sort';
222
- this.toggle = false;
223
- this.handleClick = (item) => {
224
- this.listItems.forEach((item) => item.selected = undefined);
225
- item.selected = true;
226
- this.selectedItem = item;
227
- this.toggle = !this.toggle;
228
- this.clickedItem.emit(item);
229
- };
230
- this.toggleList = () => {
231
- this.toggle = !this.toggle;
232
- };
233
- }
234
- componentWillLoad() {
235
- let items = this.host.querySelectorAll('item');
236
- if (!this.listItems) {
237
- this.listItems = [];
238
- }
239
- items.forEach(item => {
240
- if (item && item.getAttribute('label')) {
241
- let listItem = {
242
- element: item,
243
- label: item.getAttribute('label'),
244
- selected: item.hasAttribute('selected')
245
- };
246
- this.listItems.push(listItem);
247
- if (item.hasAttribute('selected')) {
248
- this.selectedItem = listItem;
249
- }
250
- }
251
- });
252
- }
253
- render() {
254
- const classMap = this.getCssClassMap();
255
- return (index.h("div", { class: classMap }, index.h("header", { class: "dropdown__header", onClick: this.toggleList }, index.h("label", null, index.h("b", null, this.label), " ", this.selectedItem ? this.selectedItem.label : "Select Option"), index.h("icon-asset", { type: "solid", size: "x-small", name: "chevron-down" })), this.toggle &&
256
- index.h("ul", { tabIndex: -1, class: "dropdown__list", onBlur: () => { this.toggle = false; } }, this.listItems.map((item) => {
257
- let cssClass = "dropdown__item";
258
- if (item.selected) {
259
- cssClass += " selected";
260
- }
261
- return (index.h("li", { class: cssClass, onClick: () => this.handleClick(item) }, item.label));
262
- }))));
263
- }
264
- getCssClassMap() {
265
- return {
266
- ['ptc-dropdown']: true,
267
- [this.theme]: true
268
- };
269
- }
270
- get host() { return index.getElement(this); }
271
- };
214
+ let PtcDropdown = class {
215
+ constructor(hostRef) {
216
+ index.registerInstance(this, hostRef);
217
+ this.clickedItem = index.createEvent(this, "clickedItem", 7);
218
+ /**
219
+ * Theme
220
+ */
221
+ this.theme = 'sort';
222
+ this.toggle = false;
223
+ this.handleClick = (item) => {
224
+ this.listItems.forEach((item) => item.selected = undefined);
225
+ item.selected = true;
226
+ this.selectedItem = item;
227
+ this.toggle = !this.toggle;
228
+ this.clickedItem.emit(item);
229
+ };
230
+ this.toggleList = () => {
231
+ this.toggle = !this.toggle;
232
+ };
233
+ }
234
+ componentWillLoad() {
235
+ let items = this.host.querySelectorAll('item');
236
+ if (!this.listItems) {
237
+ this.listItems = [];
238
+ }
239
+ items.forEach(item => {
240
+ if (item && item.getAttribute('label')) {
241
+ let listItem = {
242
+ element: item,
243
+ label: item.getAttribute('label'),
244
+ selected: item.hasAttribute('selected')
245
+ };
246
+ this.listItems.push(listItem);
247
+ if (item.hasAttribute('selected')) {
248
+ this.selectedItem = listItem;
249
+ }
250
+ }
251
+ });
252
+ }
253
+ render() {
254
+ const classMap = this.getCssClassMap();
255
+ return (index.h("div", { class: classMap }, index.h("header", { class: "dropdown__header", onClick: this.toggleList }, index.h("label", null, index.h("b", null, this.label), " ", this.selectedItem ? this.selectedItem.label : "Select Option"), index.h("icon-asset", { type: "solid", size: "x-small", name: "chevron-down" })), this.toggle &&
256
+ index.h("ul", { tabIndex: -1, class: "dropdown__list", onBlur: () => { this.toggle = false; } }, this.listItems.map((item) => {
257
+ let cssClass = "dropdown__item";
258
+ if (item.selected) {
259
+ cssClass += " selected";
260
+ }
261
+ return (index.h("li", { class: cssClass, onClick: () => this.handleClick(item) }, item.label));
262
+ }))));
263
+ }
264
+ getCssClassMap() {
265
+ return {
266
+ ['ptc-dropdown']: true,
267
+ [this.theme]: true
268
+ };
269
+ }
270
+ get host() { return index.getElement(this); }
271
+ };
272
272
  PtcDropdown.style = ptcDropdownCss;
273
273
 
274
- const CloseIcon = `<svg width="8" height="8" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg">
275
- <path fill-rule="evenodd" clip-rule="evenodd" d="M4.88956 3.99986L8.00002 0.888695L7.11135 -0.000183105L4.00089 3.11099L0.890644 2.34688e-05L0.00197005 0.888902L3.11222 3.99986L0.00195312 7.11084L0.890627 7.99972L4.00089 4.88874L7.11136 7.99993L8.00003 7.11105L4.88956 3.99986Z" fill="#9AA6AD"/>
276
- </svg>
274
+ const CloseIcon = `<svg width="8" height="8" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg">
275
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M4.88956 3.99986L8.00002 0.888695L7.11135 -0.000183105L4.00089 3.11099L0.890644 2.34688e-05L0.00197005 0.888902L3.11222 3.99986L0.00195312 7.11084L0.890627 7.99972L4.00089 4.88874L7.11136 7.99993L8.00003 7.11105L4.88956 3.99986Z" fill="#9AA6AD"/>
276
+ </svg>
277
277
  `;
278
278
 
279
279
  const ptcFilterTagCss = ".ptc-filter-tag{display:block;cursor:pointer;position:relative;margin:0.25rem}.ptc-filter-tag.bubble{display:inline-block;font-family:Raleway;font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-semibold);line-height:var(--ptc-line-height-denser);letter-spacing:var(--ptc-letter-spacing-normal);text-align:left;align-items:center;transition:border-color ease-out 250ms;border:1px solid var(--color-gray-05);border-radius:999px;padding:0.375rem 1.875rem 0.375rem 0.875rem;background:var(--color-white)}.ptc-filter-tag.bubble:hover{border:1px solid var(--color-gray-12)}.ptc-filter-tag.bubble .cls{display:block;position:absolute;top:0.35rem;right:0.8rem}.ptc-filter-tag.link,.ptc-filter-tag.link-lg{display:inline-block;font-family:Raleway;font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-semibold);line-height:var(--ptc-line-height-denser);letter-spacing:var(--ptc-letter-spacing-normal);text-align:right;border-bottom:1px solid transparent;background:var(--color-white)}.ptc-filter-tag.link:hover,.ptc-filter-tag.link-lg:hover{text-decoration:underline}.ptc-filter-tag.link .cls,.ptc-filter-tag.link-lg .cls{display:none}.ptc-filter-tag.link-lg{font-size:var(--ptc-font-size-small);font-weight:var(--ptc-font-weight-bold)}.ptc-filter-tag.button{background:var(--color-gray-10);border-radius:var(--ptc-border-radius-standard);padding:0.625rem 1rem;font-family:\"Raleway\";font-style:normal;font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-semibold);line-height:var(--ptc-line-height-denser);color:var(--color-white)}.ptc-filter-tag.button:hover{background-color:var(--color-gray-12)}.ptc-filter-tag.button:active{background-color:var(--color-black)}.ptc-filter-tag.button .cls{display:none}";
280
280
 
281
- let PtcFilterTag = class {
282
- constructor(hostRef) {
283
- index.registerInstance(this, hostRef);
284
- this.clicked = index.createEvent(this, "clicked", 7);
285
- /**
286
- * Theme
287
- */
288
- this.theme = 'bubble';
289
- this.handleClick = () => {
290
- this.clicked.emit(this);
291
- };
292
- }
293
- render() {
294
- const classMap = this.getCssClassMap();
295
- return (index.h(index.Host, null, index.h("span", { class: classMap, onClick: () => this.handleClick() }, index.h("slot", null), index.h("span", { class: "cls", innerHTML: CloseIcon }))));
296
- }
297
- getCssClassMap() {
298
- return {
299
- ['ptc-filter-tag']: true,
300
- [this.theme]: true
301
- };
302
- }
303
- };
281
+ let PtcFilterTag = class {
282
+ constructor(hostRef) {
283
+ index.registerInstance(this, hostRef);
284
+ this.clicked = index.createEvent(this, "clicked", 7);
285
+ /**
286
+ * Theme
287
+ */
288
+ this.theme = 'bubble';
289
+ this.handleClick = () => {
290
+ this.clicked.emit(this);
291
+ };
292
+ }
293
+ render() {
294
+ const classMap = this.getCssClassMap();
295
+ return (index.h(index.Host, null, index.h("span", { class: classMap, onClick: () => this.handleClick() }, index.h("slot", null), index.h("span", { class: "cls", innerHTML: CloseIcon }))));
296
+ }
297
+ getCssClassMap() {
298
+ return {
299
+ ['ptc-filter-tag']: true,
300
+ [this.theme]: true
301
+ };
302
+ }
303
+ };
304
304
  PtcFilterTag.style = ptcFilterTagCss;
305
305
 
306
306
  const ptcIconMinimizeCss = ".content{transition:max-height ease-out 250ms;overflow:hidden;max-height:0}.ptc-icon-minimize .header{display:flex;justify-content:space-between;align-items:center;align-content:center}.ptc-icon-minimize .header .title{color:var(--color-gray-10);font-family:\"Raleway\";font-style:normal;font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-x-small);line-height:var(--ptc-line-height-normal)}.ptc-icon-minimize .header .icon{cursor:pointer;border:1px solid var(--color-gray-10);border-radius:2px;transition:background-color ease-out 250ms;background-color:transparent;vertical-align:middle;height:1.25rem;width:1.25rem;text-align:center}.ptc-icon-minimize .header .icon:hover{background-color:var(--color-gray-02)}.ptc-icon-minimize .header .icon icon-asset{position:relative}";
307
307
 
308
- let PtcIconMinimize = class {
309
- constructor(hostRef) {
310
- index.registerInstance(this, hostRef);
311
- this.opened = true;
312
- }
313
- componentDidLoad() {
314
- let content = this.host.shadowRoot.querySelector('.content');
315
- if (this.opened && !content.style.maxHeight) {
316
- content.style.maxHeight = content.scrollHeight + "px";
317
- }
318
- }
319
- dropdownToggle() {
320
- this.opened = !this.opened;
321
- }
322
- getScrollHeight() {
323
- let result = undefined;
324
- let content = this.host.shadowRoot.querySelector('.content');
325
- if (this.opened && content) {
326
- result = { 'max-height': content.scrollHeight + "px" };
327
- }
328
- else if (this.opened) {
329
- result = { 'max-height': 350 + "px" };
330
- }
331
- else if (content && content.style.maxHeight) {
332
- content.style.removeProperty('max-height');
333
- }
334
- return result;
335
- }
336
- render() {
337
- let scrollHeight = this.getScrollHeight();
338
- let icon = this.opened ? 'minus' : 'plus';
339
- return (index.h("div", { class: "ptc-icon-minimize" }, index.h("div", { class: "header" }, index.h("div", { class: "title" }, this.heading), index.h("div", { class: "icon", onClick: () => this.dropdownToggle() }, index.h("icon-asset", { type: "solid", size: "xxx-small", name: icon }))), index.h("div", { class: "content", style: scrollHeight }, index.h("slot", null))));
340
- }
341
- get host() { return index.getElement(this); }
342
- };
308
+ let PtcIconMinimize = class {
309
+ constructor(hostRef) {
310
+ index.registerInstance(this, hostRef);
311
+ this.opened = true;
312
+ }
313
+ componentDidLoad() {
314
+ let content = this.host.shadowRoot.querySelector('.content');
315
+ if (this.opened && !content.style.maxHeight) {
316
+ content.style.maxHeight = content.scrollHeight + "px";
317
+ }
318
+ }
319
+ dropdownToggle() {
320
+ this.opened = !this.opened;
321
+ }
322
+ getScrollHeight() {
323
+ let result = undefined;
324
+ let content = this.host.shadowRoot.querySelector('.content');
325
+ if (this.opened && content) {
326
+ result = { 'max-height': content.scrollHeight + "px" };
327
+ }
328
+ else if (this.opened) {
329
+ result = { 'max-height': 350 + "px" };
330
+ }
331
+ else if (content && content.style.maxHeight) {
332
+ content.style.removeProperty('max-height');
333
+ }
334
+ return result;
335
+ }
336
+ render() {
337
+ let scrollHeight = this.getScrollHeight();
338
+ let icon = this.opened ? 'minus' : 'plus';
339
+ return (index.h("div", { class: "ptc-icon-minimize" }, index.h("div", { class: "header" }, index.h("div", { class: "title" }, this.heading), index.h("div", { class: "icon", onClick: () => this.dropdownToggle() }, index.h("icon-asset", { type: "solid", size: "xxx-small", name: icon }))), index.h("div", { class: "content", style: scrollHeight }, index.h("slot", null))));
340
+ }
341
+ get host() { return index.getElement(this); }
342
+ };
343
343
  PtcIconMinimize.style = ptcIconMinimizeCss;
344
344
 
345
- const ptcLinkCss = ":host{display:block}.disabled{pointer-events:none;cursor:default;text-decoration:none}.ptc-link{display:inline-block;color:var(--color-gray-10);font-weight:var(--ptc-font-weight-black);position:relative;line-height:var(--ptc-line-height-normal);outline:none;text-decoration:none}.simple::after{content:\"\";position:absolute;width:100%;left:0px;bottom:2px;transition:opacity var(--ptc-transition-fast) var(--ptc-ease-inout);border-bottom:2px solid var(--color-green-07);opacity:0}.simple:hover.simple::after{opacity:1}.product-link{font-weight:var(--ptc-font-weight-extrabold);margin-top:var(--ptc-element-spacing-04)}.product-link::after{content:\"\";position:absolute;width:100%;left:0px;bottom:2px;transition:opacity var(--ptc-transition-fast) var(--ptc-ease-inout);border-bottom:2px solid var(--color-green-07);opacity:0}.product-link:hover.product-link::after{opacity:1}.arrow{margin-right:var(--ptc-element-spacing-01)}.arrow::after{position:absolute;display:block;content:\"\";width:var(--ptc-element-spacing-07);border-bottom:2px solid var(--color-green-07);bottom:1px;transition:width var(--ptc-transition-fast) var(--ptc-ease-inout)}.arrow:hover.arrow::after{width:100%}.underline{border-bottom:2px solid var(--color-green-07)}.underline:hover{color:#00890B;border-bottom:2px solid #00890B}.uppercase{text-transform:uppercase}.small{font-size:var(--ptc-font-size-xx-small)}.medium{font-size:var(--ptc-font-size-x-small)}.large{font-size:var(--ptc-font-size-medium)}.ptc-link.arrow icon-asset{position:absolute;right:-25px;transition:transform var(--ptc-transition-fast) var(--ptc-ease-inout);transform:translateY(2px)}.ptc-link.arrow icon-asset svg{fill:var(--color-green-07) !important}.ptc-link.arrow-plm icon-asset{position:absolute;right:-6.75px;transform:translate(100%, 8%)}.ptc-link.arrow-plm svg{fill:var(--color-green-07) !important}.ptc-link:hover.arrow icon-asset{transform:translate(var(--ptc-element-spacing-04), 2px)}.nav-title:focus,.nav-title-link:focus,.primary-nav-link:focus,.secondary-nav-link:focus,.footer-nav-link:focus,.copyright-link:focus{outline:3px solid var(--color-blue-07);outline-offset:2px}.nav-title{box-sizing:border-box;color:var(--color-white);display:inline-block;font-size:var(--ptc-font-size-x-small);font-stretch:100%;font-weight:var(--ptc-font-weight-extrabold);letter-spacing:var(--ptc-letter-spacing-normal);line-height:var(--ptc-line-height-dense);list-style:none;margin-bottom:var(--ptc-element-spacing-02);text-align:left}.primary-nav-link{background-color:transparent;box-sizing:border-box;color:var(--color-gray-01);display:inline-block;font-size:var(--ptc-font-size-x-small);font-stretch:100%;font-weight:var(--ptc-font-weight-extrabold);letter-spacing:var(--ptc-letter-spacing-normal);line-height:var(--ptc-line-height-dense);list-style:none;margin:var(--ptc-element-spacing-01) var(--ptc-element-spacing-03);padding:var(--ptc-element-spacing-02) var(--ptc-element-spacing-06);position:relative;text-decoration:none;transition:background-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.primary-nav-link:hover{border-radius:var(--ptc-border-radius-standard);background-color:var(--color-gray-12);text-decoration:none;outline:none}.nav-title-link{background-color:transparent;box-sizing:border-box;color:var(--color-white);font-size:var(--ptc-font-size-xxx-small);font-stretch:100%;font-weight:var(--ptc-font-weight-extrabold);line-height:var(--ptc-line-height-densest);list-style:none;text-align:left;text-decoration-color:var(--color-white);text-decoration:none;transition:border-color var(--ptc-transition-medium) var(--ptc-ease-inout);border-bottom:1.5px solid transparent;display:inline-block}.nav-title-link:hover{color:var(--color-white);border-bottom:1.5px solid var(--color-green-06)}.secondary-nav-link{display:inline-block;background-color:transparent;box-sizing:border-box;color:var(--color-white);font-size:var(--ptc-font-size-xxx-small);font-stretch:100%;font-style:normal;font-weight:var(--ptc-font-weight-semibold);letter-spacing:var(--ptc-letter-spacing-normal);line-height:var(--ptc-line-height-densest);list-style:none;margin-bottom:var(--ptc-element-spacing-03);text-align:left;text-decoration:none;transition:border-color var(--ptc-transition-medium) var(--ptc-ease-inout);border-bottom:1.5px solid transparent;white-space:nowrap}.secondary-nav-link:hover{color:var(--color-white);border-bottom:1.5px solid var(--color-green-06);border-radius:0;text-decoration:none}.footer-nav-link{color:var(--color-white);transition:border var(--ptc-transition-medium) var(--ptc-ease-inout), color var(--ptc-transition-medium) var(--ptc-ease-inout);border-bottom:1px solid transparent;outline:none;text-decoration:none;font-weight:var(--ptc-font-weight-semibold);letter-spacing:var(--ptc-letter-spacing-normal);line-height:var(--ptc-line-height-densest);text-align:left;font-size:var(--ptc-font-size-x-small)}.footer-nav-link:hover{outline:none;text-decoration:none;border-bottom:0.1rem solid var(--color-green-06);color:var(--color-green-06)}.copyright-link{color:var(--color-white);font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-normal);line-height:var(--ptc-line-height-loose);display:inline-block}.arrow-plm{color:var(--color-white);font-weight:var(--ptc-font-weight-extrabold);line-height:var(--ptc-line-height-densest);text-decoration:underline;text-decoration-thickness:1px;text-decoration-color:transparent;text-underline-offset:2px;transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.arrow-plm:hover{text-decoration-color:var(--color-green-07)}";
346
-
347
- let PtcLink = class {
348
- constructor(hostRef) {
349
- index.registerInstance(this, hostRef);
350
- /**
351
- * Disabled link
352
- */
353
- this.disabled = false;
354
- /**
355
- * Rxternal link
356
- * */
357
- this.external = false;
358
- /**
359
- * Target
360
- */
361
- this.target = '_self';
362
- /**
363
- * Theme
364
- */
365
- this.theme = 'simple';
366
- /**
367
- * Uppercase
368
- */
369
- this.uppercase = false;
370
- /**
371
- * Font Size
372
- */
373
- this.fontSize = 'medium';
374
- }
375
- render() {
376
- const classMap = this.getCssClassMap();
377
- return (index.h(index.Host, null, index.h("a", { class: classMap, href: this.href, target: this.external ? '_blank' : this.target, title: this.linkTitle }, this.theme == 'arrow' ? index.h("icon-asset", { type: "solid", size: "x-small", name: "arrow-right" }) : '', this.theme == 'arrow-plm' ? index.h("icon-asset", { type: "ptc", size: "x-small", name: "button-arrow-right" }) : '', index.h("slot", null))));
378
- }
379
- getCssClassMap() {
380
- return {
381
- ['ptc-link']: true,
382
- [this.theme]: true,
383
- ['uppercase']: this.uppercase,
384
- ['disabled']: this.disabled,
385
- [this.fontSize]: true,
386
- };
387
- }
388
- };
345
+ const ptcLinkCss = ":host{display:block}.disabled{pointer-events:none;cursor:default;text-decoration:none}.ptc-link{display:inline-block;color:var(--color-gray-10);font-weight:var(--ptc-font-weight-black);position:relative;line-height:var(--ptc-line-height-normal);outline:none;text-decoration:none}.simple::after{content:\"\";position:absolute;width:100%;left:0px;bottom:2px;transition:opacity var(--ptc-transition-fast) var(--ptc-ease-inout);border-bottom:2px solid var(--color-green-07);opacity:0}.simple:hover.simple::after{opacity:1}.product-link{font-weight:var(--ptc-font-weight-extrabold);margin-top:var(--ptc-element-spacing-04)}.product-link::after{content:\"\";position:absolute;width:100%;left:0px;bottom:2px;transition:opacity var(--ptc-transition-fast) var(--ptc-ease-inout);border-bottom:2px solid var(--color-green-07);opacity:0}.product-link:hover.product-link::after{opacity:1}.arrow{margin-right:var(--ptc-element-spacing-01)}.arrow::after{position:absolute;display:block;content:\"\";width:var(--ptc-element-spacing-07);border-bottom:2px solid var(--color-green-07);bottom:1px;transition:width var(--ptc-transition-fast) var(--ptc-ease-inout)}.arrow:hover.arrow::after{width:100%}.underline{border-bottom:2px solid var(--color-green-07)}.underline:hover{color:#00890B;border-bottom:2px solid #00890B}.uppercase{text-transform:uppercase}.small{font-size:var(--ptc-font-size-xx-small)}.medium{font-size:var(--ptc-font-size-x-small)}.large{font-size:var(--ptc-font-size-medium)}.ptc-link.arrow icon-asset{position:absolute;right:-25px;transition:transform var(--ptc-transition-fast) var(--ptc-ease-inout);transform:translateY(2px)}.ptc-link.arrow icon-asset svg{fill:var(--color-green-07) !important}.ptc-link.arrow-plm icon-asset{position:absolute;right:-6.75px;transform:translate(100%, 3%)}.ptc-link.arrow-plm svg{fill:var(--color-green-07) !important}.ptc-link:hover.arrow icon-asset{transform:translate(var(--ptc-element-spacing-04), 2px)}.nav-title:focus,.nav-title-link:focus,.primary-nav-link:focus,.secondary-nav-link:focus,.footer-nav-link:focus,.copyright-link:focus{outline:3px solid var(--color-blue-07);outline-offset:2px}.nav-title{box-sizing:border-box;color:var(--color-white);display:inline-block;font-size:var(--ptc-font-size-x-small);font-stretch:100%;font-weight:var(--ptc-font-weight-extrabold);letter-spacing:var(--ptc-letter-spacing-normal);line-height:var(--ptc-line-height-dense);list-style:none;margin-bottom:var(--ptc-element-spacing-02);text-align:left}.primary-nav-link{background-color:transparent;box-sizing:border-box;color:var(--color-gray-01);display:inline-block;font-size:var(--ptc-font-size-x-small);font-stretch:100%;font-weight:var(--ptc-font-weight-extrabold);letter-spacing:var(--ptc-letter-spacing-normal);line-height:var(--ptc-line-height-dense);list-style:none;margin:var(--ptc-element-spacing-01) var(--ptc-element-spacing-03);padding:var(--ptc-element-spacing-02) var(--ptc-element-spacing-06);position:relative;text-decoration:none;transition:background-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.primary-nav-link:hover{border-radius:var(--ptc-border-radius-standard);background-color:var(--color-gray-12);text-decoration:none;outline:none}.nav-title-link{background-color:transparent;box-sizing:border-box;color:var(--color-white);font-size:var(--ptc-font-size-xxx-small);font-stretch:100%;font-weight:var(--ptc-font-weight-extrabold);line-height:var(--ptc-line-height-densest);list-style:none;text-align:left;text-decoration-color:var(--color-white);text-decoration:none;transition:border-color var(--ptc-transition-medium) var(--ptc-ease-inout);border-bottom:1.5px solid transparent;display:inline-block}.nav-title-link:hover{color:var(--color-white);border-bottom:1.5px solid var(--color-green-06)}.secondary-nav-link{display:inline-block;background-color:transparent;box-sizing:border-box;color:var(--color-white);font-size:var(--ptc-font-size-xxx-small);font-stretch:100%;font-style:normal;font-weight:var(--ptc-font-weight-semibold);letter-spacing:var(--ptc-letter-spacing-normal);line-height:var(--ptc-line-height-densest);list-style:none;margin-bottom:var(--ptc-element-spacing-03);text-align:left;text-decoration:none;transition:border-color var(--ptc-transition-medium) var(--ptc-ease-inout);border-bottom:1.5px solid transparent;white-space:nowrap}.secondary-nav-link:hover{color:var(--color-white);border-bottom:1.5px solid var(--color-green-06);border-radius:0;text-decoration:none}.footer-nav-link{color:var(--color-white);transition:border var(--ptc-transition-medium) var(--ptc-ease-inout), color var(--ptc-transition-medium) var(--ptc-ease-inout);border-bottom:1px solid transparent;outline:none;text-decoration:none;font-weight:var(--ptc-font-weight-semibold);letter-spacing:var(--ptc-letter-spacing-normal);line-height:var(--ptc-line-height-densest);text-align:left;font-size:var(--ptc-font-size-x-small)}.footer-nav-link:hover{outline:none;text-decoration:none;border-bottom:0.1rem solid var(--color-green-06);color:var(--color-green-06)}.copyright-link{color:var(--color-white);font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-normal);line-height:var(--ptc-line-height-loose);display:inline-block}.arrow-plm{color:var(--color-white);font-weight:var(--ptc-font-weight-extrabold);line-height:var(--ptc-line-height-densest);text-decoration:underline;text-decoration-thickness:1px;text-decoration-color:transparent;text-underline-offset:2px;transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.arrow-plm:hover{text-decoration-color:var(--color-green-07)}";
346
+
347
+ let PtcLink = class {
348
+ constructor(hostRef) {
349
+ index.registerInstance(this, hostRef);
350
+ /**
351
+ * Disabled link
352
+ */
353
+ this.disabled = false;
354
+ /**
355
+ * Rxternal link
356
+ * */
357
+ this.external = false;
358
+ /**
359
+ * Target
360
+ */
361
+ this.target = '_self';
362
+ /**
363
+ * Theme
364
+ */
365
+ this.theme = 'simple';
366
+ /**
367
+ * Uppercase
368
+ */
369
+ this.uppercase = false;
370
+ /**
371
+ * Font Size
372
+ */
373
+ this.fontSize = 'medium';
374
+ }
375
+ render() {
376
+ const classMap = this.getCssClassMap();
377
+ return (index.h(index.Host, null, index.h("a", { class: classMap, href: this.href, target: this.external ? '_blank' : this.target, title: this.linkTitle }, this.theme == 'arrow' ? index.h("icon-asset", { type: "solid", size: "x-small", name: "arrow-right" }) : '', this.theme == 'arrow-plm' ? index.h("icon-asset", { type: "ptc", size: "xxx-small", name: "button-arrow-right" }) : '', index.h("slot", null))));
378
+ }
379
+ getCssClassMap() {
380
+ return {
381
+ ['ptc-link']: true,
382
+ [this.theme]: true,
383
+ ['uppercase']: this.uppercase,
384
+ ['disabled']: this.disabled,
385
+ [this.fontSize]: true,
386
+ };
387
+ }
388
+ };
389
389
  PtcLink.style = ptcLinkCss;
390
390
 
391
391
  const ptcModalCss = ":host{display:block}.wrapper{position:fixed;width:100vw;height:100%;top:0;left:0;z-index:3000;display:none}.wrapper .modal-popup{margin:7.5rem auto 1rem;background-color:var(--color-white);box-shadow:var(--ptc-shadow-large);max-width:22.5625rem;width:80%;display:flex;flex-direction:column;align-items:flex-end;align-content:flex-end;z-index:3020;transform:translateY(-100%)}@media only screen and (min-width: 992px){.wrapper .modal-popup{max-width:29.125rem}}.wrapper .modal-popup.md{max-width:44.125rem}.wrapper .modal-popup.lg{max-width:56.25rem}.wrapper .modal-popup.xl{max-width:64.0625rem}.wrapper .modal-popup .modal-body{width:100%}.wrapper .modal-popup .modal-body iframe{opacity:0;overflow:hidden;width:100%;border:0;transition:opacity var(--ptc-ease-inout) var(--ptc-transition-medium)}.wrapper .modal-popup .modal-body iframe.ready{opacity:1}.wrapper .modal-popup .modal-body.frame{overflow:hidden}.wrapper .modal-popup .modal-body.html{overflow:hidden}.wrapper .modal-popup .close{margin-right:var(--ptc-element-spacing-03);margin-top:var(--ptc-element-spacing-03)}.wrapper .modal-popup.shadow-scroller{max-height:756px}.wrapper .modal-popup.shadow-scroller .modal-header{transition:box-shadow ease-in-out 250ms;position:relative;min-height:57px;border-bottom:1px solid var(--color-gray-02);width:100%}.wrapper .modal-popup.shadow-scroller .modal-header .close{position:absolute;top:var(--spacing-md);right:var(--spacing-md);margin:0}.wrapper .modal-popup.shadow-scroller .modal-body{min-height:200px;overflow-x:hidden;overflow-y:auto}.wrapper .modal-popup.shadow-scroller .modal-footer{transition:box-shadow ease-in-out 250ms;width:100%;min-height:72px;border-top:1px solid var(--color-gray-02);padding-top:1rem}.wrapper .modal-popup.shadow-scroller.scroll-top .modal-header{box-shadow:0px 4px 12px rgba(0, 0, 0, 0.12)}.wrapper .modal-popup.shadow-scroller.scroll-bottom .modal-footer{box-shadow:0px -8px 12px rgba(0, 0, 0, 0.12)}.wrapper.show{display:flex;align-items:flex-start}.wrapper.show .modal-popup{transform:translateY(0)}.wrapper.show .modal-popup.rounded{border-radius:var(--ptc-border-radius-standard)}.overlay{width:100vw;height:100vh;position:fixed;top:0;left:0;z-index:3010;display:block;background-color:rgba(0, 0, 0, 0.6)}";
392
392
 
393
- let PtcModal = class {
394
- constructor(hostRef) {
395
- index.registerInstance(this, hostRef);
396
- this.closed = index.createEvent(this, "closed", 7);
397
- this.opened = index.createEvent(this, "opened", 7);
398
- /**
399
- * Sets if popup should close if click on outside
400
- */
401
- this.size = 'sm';
402
- /**
403
- * Set whether or not to display modal
404
- */
405
- this.show = false;
406
- /**
407
- * Sets if popup should overlay
408
- */
409
- this.overlay = true;
410
- /**
411
- * Sets if popup should close if click on outside
412
- */
413
- this.closeOnBlur = false;
414
- /**
415
- * Sets if popup should have rounded corners
416
- */
417
- this.rounded = false;
418
- /**
419
- * Sets if popup should have header footer sections
420
- */
421
- this.showHeaderFooter = false;
422
- }
423
- fireOnClosed(modal) {
424
- this.closed.emit(modal);
425
- }
426
- fireOnOpened(modal) {
427
- this.opened.emit(modal);
428
- }
429
- componentWillLoad() {
430
- let body = document.querySelector('body');
431
- this.bodyOverflowSetting = {
432
- //overflow: body.style['overflow'],
433
- overflowY: body.style['overflowY'],
434
- overflowX: body.style['overflowX'],
435
- };
436
- }
437
- componentWillRender() {
438
- let body = document.querySelector('body');
439
- if (body) {
440
- if (this.show) {
441
- //body.style['overflow'] = 'hidden';
442
- body.style['overflowY'] = 'scroll';
443
- body.style['overflowX'] = 'hidden';
444
- }
445
- else {
446
- //body.style['overflow'] = this.bodyOverflowSetting.overflow;
447
- body.style['overflowY'] = this.bodyOverflowSetting.overflowY;
448
- body.style['overflowX'] = this.bodyOverflowSetting.overflowX;
449
- }
450
- }
451
- }
452
- componentDidLoad() {
453
- if (this.show) {
454
- this.fireOnOpened(this);
455
- }
456
- if (this.showHeaderFooter) {
457
- this.handleScroll();
458
- }
459
- }
460
- componentDidUpdate() {
461
- if (this.show) {
462
- this.fireOnOpened(this);
463
- }
464
- else {
465
- this.fireOnClosed(this);
466
- }
467
- }
468
- resizeIframe(e) {
469
- let iFrame = e.target;
470
- setTimeout(() => {
471
- try {
472
- iFrame.height = `${iFrame.contentDocument.body.scrollHeight}px`;
473
- }
474
- catch (error) {
475
- console.log(error);
476
- iFrame.height = '616px'; //default
477
- iFrame.removeAttribute('scrolling');
478
- }
479
- iFrame.classList.add('ready');
480
- }, 50);
481
- }
482
- handleScroll() {
483
- let modal = this.el.shadowRoot.querySelector('.shadow-scroller');
484
- if (modal) {
485
- let body = modal.querySelector('.modal-body');
486
- var height = body.clientHeight;
487
- var scrollHeight = body.scrollHeight;
488
- var scrollTop = body.scrollTop;
489
- var offset = body.offsetHeight;
490
- if (height < scrollHeight) { //has scrollbar
491
- if (scrollTop > 0) { //can scroll up
492
- modal.classList.add('scroll-top');
493
- }
494
- else {
495
- modal.classList.remove('scroll-top');
496
- }
497
- if (offset + scrollTop < scrollHeight) { //can scroll down
498
- modal.classList.add('scroll-bottom');
499
- }
500
- else {
501
- modal.classList.remove('scroll-bottom');
502
- }
503
- }
504
- }
505
- }
506
- close() {
507
- this.show = false;
508
- }
509
- render() {
510
- let content;
511
- let overlay;
512
- let type = this.iframeUrl ? 'frame' : 'html';
513
- let closebtn = (index.h("div", { class: "close" }, index.h("a", { href: "#", onClick: (e) => { e.preventDefault(); this.close(); } }, index.h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "14", height: "14", viewBox: "0 0 14 14", fill: "none" }, index.h("path", { d: "M1 1L13 13", stroke: "black" }), index.h("path", { d: "M13 1L1 13", stroke: "black" })))));
514
- if (this.iframeUrl) {
515
- content = (index.h("iframe", { src: this.iframeUrl, frameBorder: 0, allowFullScreen: false, height: "100%", width: "100%", scrolling: "no", onLoad: this.resizeIframe }));
516
- }
517
- else {
518
- if (this.showHeaderFooter) {
519
- content = (index.h("slot", { name: "body" }));
520
- }
521
- else {
522
- content = (index.h("slot", null));
523
- }
524
- }
525
- if (this.overlay) {
526
- if (this.closeOnBlur) {
527
- overlay = index.h("div", { class: "overlay", onClick: (_) => this.close() });
528
- }
529
- else {
530
- overlay = index.h("div", { class: "overlay" });
531
- }
532
- }
533
- return (index.h(index.Host, null, index.h("div", { class: `wrapper ${this.show ? "show" : "hide"}` }, overlay, index.h("div", { class: `modal-popup ${this.size} ${type} ${this.rounded ? 'rounded' : ''} ${this.showHeaderFooter ? 'shadow-scroller' : ''} ` }, this.showHeaderFooter ? [
534
- index.h("div", { class: "modal-header" }, index.h("slot", { name: "header" }), closebtn),
535
- index.h("div", { class: "modal-body", onScroll: () => this.handleScroll() }, content),
536
- index.h("div", { class: "modal-footer" }, index.h("slot", { name: "footer" }))
537
- ] : [
538
- closebtn,
539
- index.h("div", { class: "modal-body" }, content)
540
- ]))));
541
- }
542
- get el() { return index.getElement(this); }
543
- };
393
+ let PtcModal = class {
394
+ constructor(hostRef) {
395
+ index.registerInstance(this, hostRef);
396
+ this.closed = index.createEvent(this, "closed", 7);
397
+ this.opened = index.createEvent(this, "opened", 7);
398
+ /**
399
+ * Sets if popup should close if click on outside
400
+ */
401
+ this.size = 'sm';
402
+ /**
403
+ * Set whether or not to display modal
404
+ */
405
+ this.show = false;
406
+ /**
407
+ * Sets if popup should overlay
408
+ */
409
+ this.overlay = true;
410
+ /**
411
+ * Sets if popup should close if click on outside
412
+ */
413
+ this.closeOnBlur = false;
414
+ /**
415
+ * Sets if popup should have rounded corners
416
+ */
417
+ this.rounded = false;
418
+ /**
419
+ * Sets if popup should have header footer sections
420
+ */
421
+ this.showHeaderFooter = false;
422
+ }
423
+ fireOnClosed(modal) {
424
+ this.closed.emit(modal);
425
+ }
426
+ fireOnOpened(modal) {
427
+ this.opened.emit(modal);
428
+ }
429
+ componentWillLoad() {
430
+ let body = document.querySelector('body');
431
+ this.bodyOverflowSetting = {
432
+ //overflow: body.style['overflow'],
433
+ overflowY: body.style['overflowY'],
434
+ overflowX: body.style['overflowX'],
435
+ };
436
+ }
437
+ componentWillRender() {
438
+ let body = document.querySelector('body');
439
+ if (body) {
440
+ if (this.show) {
441
+ //body.style['overflow'] = 'hidden';
442
+ body.style['overflowY'] = 'scroll';
443
+ body.style['overflowX'] = 'hidden';
444
+ }
445
+ else {
446
+ //body.style['overflow'] = this.bodyOverflowSetting.overflow;
447
+ body.style['overflowY'] = this.bodyOverflowSetting.overflowY;
448
+ body.style['overflowX'] = this.bodyOverflowSetting.overflowX;
449
+ }
450
+ }
451
+ }
452
+ componentDidLoad() {
453
+ if (this.show) {
454
+ this.fireOnOpened(this);
455
+ }
456
+ if (this.showHeaderFooter) {
457
+ this.handleScroll();
458
+ }
459
+ }
460
+ componentDidUpdate() {
461
+ if (this.show) {
462
+ this.fireOnOpened(this);
463
+ }
464
+ else {
465
+ this.fireOnClosed(this);
466
+ }
467
+ }
468
+ resizeIframe(e) {
469
+ let iFrame = e.target;
470
+ setTimeout(() => {
471
+ try {
472
+ iFrame.height = `${iFrame.contentDocument.body.scrollHeight}px`;
473
+ }
474
+ catch (error) {
475
+ console.log(error);
476
+ iFrame.height = '616px'; //default
477
+ iFrame.removeAttribute('scrolling');
478
+ }
479
+ iFrame.classList.add('ready');
480
+ }, 50);
481
+ }
482
+ handleScroll() {
483
+ let modal = this.el.shadowRoot.querySelector('.shadow-scroller');
484
+ if (modal) {
485
+ let body = modal.querySelector('.modal-body');
486
+ var height = body.clientHeight;
487
+ var scrollHeight = body.scrollHeight;
488
+ var scrollTop = body.scrollTop;
489
+ var offset = body.offsetHeight;
490
+ if (height < scrollHeight) { //has scrollbar
491
+ if (scrollTop > 0) { //can scroll up
492
+ modal.classList.add('scroll-top');
493
+ }
494
+ else {
495
+ modal.classList.remove('scroll-top');
496
+ }
497
+ if (offset + scrollTop < scrollHeight) { //can scroll down
498
+ modal.classList.add('scroll-bottom');
499
+ }
500
+ else {
501
+ modal.classList.remove('scroll-bottom');
502
+ }
503
+ }
504
+ }
505
+ }
506
+ close() {
507
+ this.show = false;
508
+ }
509
+ render() {
510
+ let content;
511
+ let overlay;
512
+ let type = this.iframeUrl ? 'frame' : 'html';
513
+ let closebtn = (index.h("div", { class: "close" }, index.h("a", { href: "#", onClick: (e) => { e.preventDefault(); this.close(); } }, index.h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "14", height: "14", viewBox: "0 0 14 14", fill: "none" }, index.h("path", { d: "M1 1L13 13", stroke: "black" }), index.h("path", { d: "M13 1L1 13", stroke: "black" })))));
514
+ if (this.iframeUrl) {
515
+ content = (index.h("iframe", { src: this.iframeUrl, frameBorder: 0, allowFullScreen: false, height: "100%", width: "100%", scrolling: "no", onLoad: this.resizeIframe }));
516
+ }
517
+ else {
518
+ if (this.showHeaderFooter) {
519
+ content = (index.h("slot", { name: "body" }));
520
+ }
521
+ else {
522
+ content = (index.h("slot", null));
523
+ }
524
+ }
525
+ if (this.overlay) {
526
+ if (this.closeOnBlur) {
527
+ overlay = index.h("div", { class: "overlay", onClick: (_) => this.close() });
528
+ }
529
+ else {
530
+ overlay = index.h("div", { class: "overlay" });
531
+ }
532
+ }
533
+ return (index.h(index.Host, null, index.h("div", { class: `wrapper ${this.show ? "show" : "hide"}` }, overlay, index.h("div", { class: `modal-popup ${this.size} ${type} ${this.rounded ? 'rounded' : ''} ${this.showHeaderFooter ? 'shadow-scroller' : ''} ` }, this.showHeaderFooter ? [
534
+ index.h("div", { class: "modal-header" }, index.h("slot", { name: "header" }), closebtn),
535
+ index.h("div", { class: "modal-body", onScroll: () => this.handleScroll() }, content),
536
+ index.h("div", { class: "modal-footer" }, index.h("slot", { name: "footer" }))
537
+ ] : [
538
+ closebtn,
539
+ index.h("div", { class: "modal-body" }, content)
540
+ ]))));
541
+ }
542
+ get el() { return index.getElement(this); }
543
+ };
544
544
  PtcModal.style = ptcModalCss;
545
545
 
546
546
  const ptcParaCss = ":host{z-index:1}p.default{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;}p.main{text-shadow:0 3px 6px var(--color-white);line-height:var(--ptc-line-height-dense);color:var(--color-gray-10)}p.primary-grey{color:var(--color-gray-10)}p.white{color:var(--color-white)}p.xxx-small{font-size:var(--ptc-font-size-xxx-small)}p.xx-small{font-size:var(--ptc-font-size-xx-small)}p.x-small{font-size:var(--ptc-font-size-x-small)}p.small{font-size:var(--ptc-font-size-small)}p.medium{font-size:var(--ptc-font-size-medium)}p.large{font-size:var(--ptc-font-size-large)}p.x-large{font-size:var(--ptc-font-size-x-large)}p.xx-large{font-size:var(--ptc-font-size-xx-large)}p.xxx-large{font-size:var(--ptc-font-size-xxx-large)}p.xxxx-large{font-size:var(--ptc-font-size-xxxx-large)}p.w-3{font-weight:var(--ptc-font-weight-thin)}p.w-4{font-weight:var(--ptc-font-weight-regular)}p.w-5{font-weight:var(--ptc-font-weight-medium)}p.w-6{font-weight:var(--ptc-font-weight-semibold)}p.w-7{font-weight:var(--ptc-font-weight-bold)}p.w-8{font-weight:var(--ptc-font-weight-extrabold)}p.w-9{font-weight:var(--ptc-font-weight-black)}p.margin-flush{margin-top:0;margin-bottom:0}p.margin-top-1{margin-top:var(--ptc-element-spacing-01);margin-bottom:0}p.margin-top-2{margin-top:var(--ptc-element-spacing-02);margin-bottom:0}p.margin-top-3{margin-top:var(--ptc-element-spacing-03);margin-bottom:0}p.margin-top-4{margin-top:var(--ptc-element-spacing-04);margin-bottom:0}p.margin-top-5{margin-top:var(--ptc-element-spacing-05);margin-bottom:0}p.margin-top-6{margin-top:var(--ptc-element-spacing-06);margin-bottom:0}p.margin-bottom-1{margin-bottom:var(--ptc-element-spacing-01);margin-top:0}p.margin-bottom-2{margin-bottom:var(--ptc-element-spacing-02);margin-top:0}p.margin-bottom-3{margin-bottom:var(--ptc-element-spacing-03);margin-top:0}p.margin-bottom-4{margin-bottom:var(--ptc-element-spacing-04);margin-top:0}p.margin-bottom-5{margin-bottom:var(--ptc-element-spacing-05);margin-top:0}p.margin-bottom-6{margin-bottom:var(--ptc-element-spacing-06);margin-top:0}p.margin-1{margin-top:var(--ptc-element-spacing-01);margin-bottom:var(--ptc-element-spacing-01)}p.margin-2{margin-top:var(--ptc-element-spacing-02);margin-bottom:var(--ptc-element-spacing-02)}p.margin-3{margin-top:var(--ptc-element-spacing-03);margin-bottom:var(--ptc-element-spacing-03)}p.margin-4{margin-top:var(--ptc-element-spacing-04);margin-bottom:var(--ptc-element-spacing-04)}p.margin-5{margin-top:var(--ptc-element-spacing-05);margin-bottom:var(--ptc-element-spacing-05)}p.margin-6{margin-top:var(--ptc-element-spacing-06);margin-bottom:var(--ptc-element-spacing-06)}p.line-height-densest{line-height:var(--ptc-line-height-densest)}p.line-height-denser{line-height:var(--ptc-line-height-denser)}p.line-height-dense{line-height:var(--ptc-line-height-dense)}p.line-height-normal{line-height:var(--ptc-line-height-normal)}p.line-height-loose{line-height:var(--ptc-line-height-loose)}p.line-height-looser{line-height:var(--ptc-line-height-looser)}p.announcement{text-transform:uppercase;font-size:var(--ptc-font-size-small);color:var(--color-gray-07);line-height:var(--ptc-line-height-looser);letter-spacing:var(--ptc-letter-spacing-loose)}";
547
547
 
548
- let PtcPara = class {
549
- constructor(hostRef) {
550
- index.registerInstance(this, hostRef);
551
- /**
552
- * Paragraph font size
553
- **/
554
- this.fontSize = "x-small";
555
- /**
556
- * Paragraph font weight
557
- **/
558
- this.fontWeight = 'w-4';
559
- /**
560
- * Paragraph Style
561
- **/
562
- this.paraStyle = 'default';
563
- /**
564
- * Paragraph Color
565
- */
566
- this.paraColor = 'primary-grey';
567
- /**
568
- * line height
569
- */
570
- this.paraLineH = 'line-height-normal';
571
- }
572
- render() {
573
- const classMap = this.getCssClassMap();
574
- return (index.h("p", { class: classMap, part: "part-para" }, index.h("slot", null)));
575
- }
576
- getCssClassMap() {
577
- return {
578
- [this.fontSize]: true,
579
- [this.fontWeight]: true,
580
- [this.paraStyle]: true,
581
- [this.paraMargin]: !!this.paraMargin ? true : false,
582
- [this.paraColor]: true,
583
- [this.paraLineH]: true
584
- };
585
- }
586
- };
548
+ let PtcPara = class {
549
+ constructor(hostRef) {
550
+ index.registerInstance(this, hostRef);
551
+ /**
552
+ * Paragraph font size
553
+ **/
554
+ this.fontSize = "x-small";
555
+ /**
556
+ * Paragraph font weight
557
+ **/
558
+ this.fontWeight = 'w-4';
559
+ /**
560
+ * Paragraph Style
561
+ **/
562
+ this.paraStyle = 'default';
563
+ /**
564
+ * Paragraph Color
565
+ */
566
+ this.paraColor = 'primary-grey';
567
+ /**
568
+ * line height
569
+ */
570
+ this.paraLineH = 'line-height-normal';
571
+ }
572
+ render() {
573
+ const classMap = this.getCssClassMap();
574
+ return (index.h("p", { class: classMap, part: "part-para" }, index.h("slot", null)));
575
+ }
576
+ getCssClassMap() {
577
+ return {
578
+ [this.fontSize]: true,
579
+ [this.fontWeight]: true,
580
+ [this.paraStyle]: true,
581
+ [this.paraMargin]: !!this.paraMargin ? true : false,
582
+ [this.paraColor]: true,
583
+ [this.paraLineH]: true
584
+ };
585
+ }
586
+ };
587
587
  PtcPara.style = ptcParaCss;
588
588
 
589
- const ShoppingCartBlack = `<svg width="26" height="24" viewBox="0 0 26 24" fill="none" xmlns="http://www.w3.org/2000/svg">
590
- <path fill-rule="evenodd" clip-rule="evenodd" d="M22.0047 16.9625H7.80762L6.89267 18.9387H22.1419V20.4358H21.288C21.5163 20.7841 21.6448 21.1863 21.66 21.6002C21.6753 22.0141 21.5767 22.4243 21.3747 22.7879C21.1726 23.1514 20.8746 23.4548 20.5118 23.6662C20.1491 23.8776 19.735 23.9892 19.3132 23.9892C18.8914 23.9892 18.4773 23.8776 18.1146 23.6662C17.7518 23.4548 17.4538 23.1514 17.2517 22.7879C17.0497 22.4243 16.9511 22.0141 16.9663 21.6002C16.9816 21.1863 17.1101 20.7841 17.3384 20.4358H9.27155C9.47218 20.7382 9.59773 21.0825 9.63811 21.4412C9.67848 21.7998 9.63255 22.1627 9.50401 22.5008C9.37547 22.8388 9.16791 23.1425 8.89803 23.3875C8.62815 23.6324 8.30348 23.8117 7.95014 23.911C7.5968 24.0103 7.22465 24.0268 6.86364 23.9591C6.50263 23.8915 6.16283 23.7416 5.87158 23.5215C5.58033 23.3014 5.34576 23.0173 5.18674 22.692C5.02772 22.3667 4.94869 22.0093 4.95601 21.6485C4.96201 21.221 5.08301 20.8027 5.30675 20.4358H4.33079L6.49619 14.9713H18.6041V13.7137H6.23695L2.33314 2.08101L0 1.25759V0L3.20235 1.10788L4.43754 4.49139H26L22.0047 16.9625ZM6.64528 22.5946C6.83586 22.7196 7.05993 22.7863 7.28915 22.7863C7.59652 22.7863 7.8913 22.6665 8.10865 22.4531C8.32599 22.2397 8.44809 21.9503 8.44809 21.6485C8.44809 21.4235 8.38012 21.2035 8.25278 21.0164C8.12543 20.8293 7.94443 20.6834 7.73266 20.5973C7.52089 20.5112 7.28786 20.4887 7.06305 20.5326C6.83824 20.5765 6.63173 20.6848 6.46965 20.844C6.30757 21.0031 6.19719 21.2058 6.15247 21.4265C6.10776 21.6473 6.13071 21.876 6.21843 22.0839C6.30614 22.2919 6.45469 22.4696 6.64528 22.5946ZM18.6769 22.5946C18.8675 22.7196 19.0916 22.7863 19.3208 22.7863C19.6282 22.7863 19.923 22.6665 20.1403 22.4531C20.3577 22.2397 20.4798 21.9503 20.4798 21.6485C20.4798 21.4235 20.4118 21.2035 20.2845 21.0164C20.1571 20.8293 19.9761 20.6834 19.7643 20.5973C19.5526 20.5112 19.3195 20.4887 19.0947 20.5326C18.8699 20.5765 18.6634 20.6848 18.5013 20.844C18.3392 21.0031 18.2289 21.2058 18.1841 21.4265C18.1394 21.6473 18.1624 21.876 18.2501 22.0839C18.3378 22.2919 18.4864 22.4696 18.6769 22.5946ZM19.3206 21.1395C19.2138 21.1365 19.1086 21.1651 19.0185 21.2215C18.9284 21.278 18.8577 21.3596 18.8154 21.456C18.7731 21.5523 18.7613 21.6589 18.7814 21.7619C18.8015 21.8649 18.8526 21.9596 18.9282 22.0338C19.0037 22.108 19.1002 22.1582 19.2051 22.1779C19.3101 22.1977 19.4186 22.186 19.5167 22.1445C19.6149 22.103 19.698 22.0336 19.7555 21.9451C19.813 21.8567 19.8421 21.7534 19.8391 21.6485C19.8391 21.5135 19.7845 21.384 19.6872 21.2886C19.59 21.1931 19.4581 21.1395 19.3206 21.1395ZM7.28896 21.1395C7.18276 21.1395 7.07899 21.1707 6.99092 21.2289C6.90285 21.2872 6.83449 21.3699 6.79458 21.4665C6.75467 21.5632 6.74503 21.6693 6.76689 21.7713C6.78875 21.8734 6.84111 21.9667 6.91729 22.0393C6.99347 22.112 7.08999 22.1607 7.1945 22.1791C7.29902 22.1976 7.40678 22.1851 7.504 22.1431C7.60122 22.1012 7.68348 22.0317 7.74025 21.9436C7.79702 21.8555 7.82572 21.7527 7.82269 21.6485C7.81872 21.5121 7.76074 21.3827 7.66107 21.2876C7.56141 21.1926 7.42791 21.1394 7.28896 21.1395Z" fill="#20262A"/>
591
- </svg>
589
+ const ShoppingCartBlack = `<svg width="26" height="24" viewBox="0 0 26 24" fill="none" xmlns="http://www.w3.org/2000/svg">
590
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M22.0047 16.9625H7.80762L6.89267 18.9387H22.1419V20.4358H21.288C21.5163 20.7841 21.6448 21.1863 21.66 21.6002C21.6753 22.0141 21.5767 22.4243 21.3747 22.7879C21.1726 23.1514 20.8746 23.4548 20.5118 23.6662C20.1491 23.8776 19.735 23.9892 19.3132 23.9892C18.8914 23.9892 18.4773 23.8776 18.1146 23.6662C17.7518 23.4548 17.4538 23.1514 17.2517 22.7879C17.0497 22.4243 16.9511 22.0141 16.9663 21.6002C16.9816 21.1863 17.1101 20.7841 17.3384 20.4358H9.27155C9.47218 20.7382 9.59773 21.0825 9.63811 21.4412C9.67848 21.7998 9.63255 22.1627 9.50401 22.5008C9.37547 22.8388 9.16791 23.1425 8.89803 23.3875C8.62815 23.6324 8.30348 23.8117 7.95014 23.911C7.5968 24.0103 7.22465 24.0268 6.86364 23.9591C6.50263 23.8915 6.16283 23.7416 5.87158 23.5215C5.58033 23.3014 5.34576 23.0173 5.18674 22.692C5.02772 22.3667 4.94869 22.0093 4.95601 21.6485C4.96201 21.221 5.08301 20.8027 5.30675 20.4358H4.33079L6.49619 14.9713H18.6041V13.7137H6.23695L2.33314 2.08101L0 1.25759V0L3.20235 1.10788L4.43754 4.49139H26L22.0047 16.9625ZM6.64528 22.5946C6.83586 22.7196 7.05993 22.7863 7.28915 22.7863C7.59652 22.7863 7.8913 22.6665 8.10865 22.4531C8.32599 22.2397 8.44809 21.9503 8.44809 21.6485C8.44809 21.4235 8.38012 21.2035 8.25278 21.0164C8.12543 20.8293 7.94443 20.6834 7.73266 20.5973C7.52089 20.5112 7.28786 20.4887 7.06305 20.5326C6.83824 20.5765 6.63173 20.6848 6.46965 20.844C6.30757 21.0031 6.19719 21.2058 6.15247 21.4265C6.10776 21.6473 6.13071 21.876 6.21843 22.0839C6.30614 22.2919 6.45469 22.4696 6.64528 22.5946ZM18.6769 22.5946C18.8675 22.7196 19.0916 22.7863 19.3208 22.7863C19.6282 22.7863 19.923 22.6665 20.1403 22.4531C20.3577 22.2397 20.4798 21.9503 20.4798 21.6485C20.4798 21.4235 20.4118 21.2035 20.2845 21.0164C20.1571 20.8293 19.9761 20.6834 19.7643 20.5973C19.5526 20.5112 19.3195 20.4887 19.0947 20.5326C18.8699 20.5765 18.6634 20.6848 18.5013 20.844C18.3392 21.0031 18.2289 21.2058 18.1841 21.4265C18.1394 21.6473 18.1624 21.876 18.2501 22.0839C18.3378 22.2919 18.4864 22.4696 18.6769 22.5946ZM19.3206 21.1395C19.2138 21.1365 19.1086 21.1651 19.0185 21.2215C18.9284 21.278 18.8577 21.3596 18.8154 21.456C18.7731 21.5523 18.7613 21.6589 18.7814 21.7619C18.8015 21.8649 18.8526 21.9596 18.9282 22.0338C19.0037 22.108 19.1002 22.1582 19.2051 22.1779C19.3101 22.1977 19.4186 22.186 19.5167 22.1445C19.6149 22.103 19.698 22.0336 19.7555 21.9451C19.813 21.8567 19.8421 21.7534 19.8391 21.6485C19.8391 21.5135 19.7845 21.384 19.6872 21.2886C19.59 21.1931 19.4581 21.1395 19.3206 21.1395ZM7.28896 21.1395C7.18276 21.1395 7.07899 21.1707 6.99092 21.2289C6.90285 21.2872 6.83449 21.3699 6.79458 21.4665C6.75467 21.5632 6.74503 21.6693 6.76689 21.7713C6.78875 21.8734 6.84111 21.9667 6.91729 22.0393C6.99347 22.112 7.08999 22.1607 7.1945 22.1791C7.29902 22.1976 7.40678 22.1851 7.504 22.1431C7.60122 22.1012 7.68348 22.0317 7.74025 21.9436C7.79702 21.8555 7.82572 21.7527 7.82269 21.6485C7.81872 21.5121 7.76074 21.3827 7.66107 21.2876C7.56141 21.1926 7.42791 21.1394 7.28896 21.1395Z" fill="#20262A"/>
591
+ </svg>
592
592
  `;
593
593
 
594
- const ShoppingCartWhite = `<svg width="26" height="24" viewBox="0 0 26 24" fill="none" xmlns="http://www.w3.org/2000/svg">
595
- <path fill-rule="evenodd" clip-rule="evenodd" d="M22.0047 16.9625H7.80762L6.89267 18.9387H22.1419V20.4358H21.288C21.5163 20.7841 21.6448 21.1863 21.66 21.6002C21.6753 22.0141 21.5767 22.4243 21.3747 22.7879C21.1726 23.1514 20.8746 23.4548 20.5118 23.6662C20.1491 23.8776 19.735 23.9892 19.3132 23.9892C18.8914 23.9892 18.4773 23.8776 18.1146 23.6662C17.7518 23.4548 17.4538 23.1514 17.2517 22.7879C17.0497 22.4243 16.9511 22.0141 16.9663 21.6002C16.9816 21.1863 17.1101 20.7841 17.3384 20.4358H9.27155C9.47218 20.7382 9.59773 21.0825 9.63811 21.4412C9.67848 21.7998 9.63255 22.1627 9.50401 22.5008C9.37547 22.8388 9.16791 23.1425 8.89803 23.3875C8.62815 23.6324 8.30348 23.8117 7.95014 23.911C7.5968 24.0103 7.22465 24.0268 6.86364 23.9591C6.50263 23.8915 6.16283 23.7416 5.87158 23.5215C5.58033 23.3014 5.34576 23.0173 5.18674 22.692C5.02772 22.3667 4.94869 22.0093 4.95601 21.6485C4.96201 21.221 5.08301 20.8027 5.30675 20.4358H4.33079L6.49619 14.9713H18.6041V13.7137H6.23695L2.33314 2.08101L0 1.25759V0L3.20235 1.10788L4.43754 4.49139H26L22.0047 16.9625ZM6.64528 22.5946C6.83586 22.7196 7.05993 22.7863 7.28915 22.7863C7.59652 22.7863 7.8913 22.6665 8.10865 22.4531C8.32599 22.2397 8.44809 21.9503 8.44809 21.6485C8.44809 21.4235 8.38012 21.2035 8.25278 21.0164C8.12543 20.8293 7.94443 20.6834 7.73266 20.5973C7.52089 20.5112 7.28786 20.4887 7.06305 20.5326C6.83824 20.5765 6.63173 20.6848 6.46965 20.844C6.30757 21.0031 6.19719 21.2058 6.15247 21.4265C6.10776 21.6473 6.13071 21.876 6.21843 22.0839C6.30614 22.2919 6.45469 22.4696 6.64528 22.5946ZM18.6769 22.5946C18.8675 22.7196 19.0916 22.7863 19.3208 22.7863C19.6282 22.7863 19.923 22.6665 20.1403 22.4531C20.3577 22.2397 20.4798 21.9503 20.4798 21.6485C20.4798 21.4235 20.4118 21.2035 20.2845 21.0164C20.1571 20.8293 19.9761 20.6834 19.7643 20.5973C19.5526 20.5112 19.3195 20.4887 19.0947 20.5326C18.8699 20.5765 18.6634 20.6848 18.5013 20.844C18.3392 21.0031 18.2289 21.2058 18.1841 21.4265C18.1394 21.6473 18.1624 21.876 18.2501 22.0839C18.3378 22.2919 18.4864 22.4696 18.6769 22.5946ZM19.3206 21.1395C19.2138 21.1365 19.1086 21.1651 19.0185 21.2215C18.9284 21.278 18.8577 21.3596 18.8154 21.456C18.7731 21.5523 18.7613 21.6589 18.7814 21.7619C18.8015 21.8649 18.8526 21.9596 18.9282 22.0338C19.0037 22.108 19.1002 22.1582 19.2051 22.1779C19.3101 22.1977 19.4186 22.186 19.5167 22.1445C19.6149 22.103 19.698 22.0336 19.7555 21.9451C19.813 21.8567 19.8421 21.7534 19.8391 21.6485C19.8391 21.5135 19.7845 21.384 19.6872 21.2886C19.59 21.1931 19.4581 21.1395 19.3206 21.1395ZM7.28896 21.1395C7.18276 21.1395 7.07899 21.1707 6.99092 21.2289C6.90285 21.2872 6.83449 21.3699 6.79458 21.4665C6.75467 21.5632 6.74503 21.6693 6.76689 21.7713C6.78875 21.8734 6.84111 21.9667 6.91729 22.0393C6.99347 22.112 7.08999 22.1607 7.1945 22.1791C7.29902 22.1976 7.40678 22.1851 7.504 22.1431C7.60122 22.1012 7.68348 22.0317 7.74025 21.9436C7.79702 21.8555 7.82572 21.7527 7.82269 21.6485C7.81872 21.5121 7.76074 21.3827 7.66107 21.2876C7.56141 21.1926 7.42791 21.1394 7.28896 21.1395Z" fill="white"/>
596
- </svg>
594
+ const ShoppingCartWhite = `<svg width="26" height="24" viewBox="0 0 26 24" fill="none" xmlns="http://www.w3.org/2000/svg">
595
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M22.0047 16.9625H7.80762L6.89267 18.9387H22.1419V20.4358H21.288C21.5163 20.7841 21.6448 21.1863 21.66 21.6002C21.6753 22.0141 21.5767 22.4243 21.3747 22.7879C21.1726 23.1514 20.8746 23.4548 20.5118 23.6662C20.1491 23.8776 19.735 23.9892 19.3132 23.9892C18.8914 23.9892 18.4773 23.8776 18.1146 23.6662C17.7518 23.4548 17.4538 23.1514 17.2517 22.7879C17.0497 22.4243 16.9511 22.0141 16.9663 21.6002C16.9816 21.1863 17.1101 20.7841 17.3384 20.4358H9.27155C9.47218 20.7382 9.59773 21.0825 9.63811 21.4412C9.67848 21.7998 9.63255 22.1627 9.50401 22.5008C9.37547 22.8388 9.16791 23.1425 8.89803 23.3875C8.62815 23.6324 8.30348 23.8117 7.95014 23.911C7.5968 24.0103 7.22465 24.0268 6.86364 23.9591C6.50263 23.8915 6.16283 23.7416 5.87158 23.5215C5.58033 23.3014 5.34576 23.0173 5.18674 22.692C5.02772 22.3667 4.94869 22.0093 4.95601 21.6485C4.96201 21.221 5.08301 20.8027 5.30675 20.4358H4.33079L6.49619 14.9713H18.6041V13.7137H6.23695L2.33314 2.08101L0 1.25759V0L3.20235 1.10788L4.43754 4.49139H26L22.0047 16.9625ZM6.64528 22.5946C6.83586 22.7196 7.05993 22.7863 7.28915 22.7863C7.59652 22.7863 7.8913 22.6665 8.10865 22.4531C8.32599 22.2397 8.44809 21.9503 8.44809 21.6485C8.44809 21.4235 8.38012 21.2035 8.25278 21.0164C8.12543 20.8293 7.94443 20.6834 7.73266 20.5973C7.52089 20.5112 7.28786 20.4887 7.06305 20.5326C6.83824 20.5765 6.63173 20.6848 6.46965 20.844C6.30757 21.0031 6.19719 21.2058 6.15247 21.4265C6.10776 21.6473 6.13071 21.876 6.21843 22.0839C6.30614 22.2919 6.45469 22.4696 6.64528 22.5946ZM18.6769 22.5946C18.8675 22.7196 19.0916 22.7863 19.3208 22.7863C19.6282 22.7863 19.923 22.6665 20.1403 22.4531C20.3577 22.2397 20.4798 21.9503 20.4798 21.6485C20.4798 21.4235 20.4118 21.2035 20.2845 21.0164C20.1571 20.8293 19.9761 20.6834 19.7643 20.5973C19.5526 20.5112 19.3195 20.4887 19.0947 20.5326C18.8699 20.5765 18.6634 20.6848 18.5013 20.844C18.3392 21.0031 18.2289 21.2058 18.1841 21.4265C18.1394 21.6473 18.1624 21.876 18.2501 22.0839C18.3378 22.2919 18.4864 22.4696 18.6769 22.5946ZM19.3206 21.1395C19.2138 21.1365 19.1086 21.1651 19.0185 21.2215C18.9284 21.278 18.8577 21.3596 18.8154 21.456C18.7731 21.5523 18.7613 21.6589 18.7814 21.7619C18.8015 21.8649 18.8526 21.9596 18.9282 22.0338C19.0037 22.108 19.1002 22.1582 19.2051 22.1779C19.3101 22.1977 19.4186 22.186 19.5167 22.1445C19.6149 22.103 19.698 22.0336 19.7555 21.9451C19.813 21.8567 19.8421 21.7534 19.8391 21.6485C19.8391 21.5135 19.7845 21.384 19.6872 21.2886C19.59 21.1931 19.4581 21.1395 19.3206 21.1395ZM7.28896 21.1395C7.18276 21.1395 7.07899 21.1707 6.99092 21.2289C6.90285 21.2872 6.83449 21.3699 6.79458 21.4665C6.75467 21.5632 6.74503 21.6693 6.76689 21.7713C6.78875 21.8734 6.84111 21.9667 6.91729 22.0393C6.99347 22.112 7.08999 22.1607 7.1945 22.1791C7.29902 22.1976 7.40678 22.1851 7.504 22.1431C7.60122 22.1012 7.68348 22.0317 7.74025 21.9436C7.79702 21.8555 7.82572 21.7527 7.82269 21.6485C7.81872 21.5121 7.76074 21.3827 7.66107 21.2876C7.56141 21.1926 7.42791 21.1394 7.28896 21.1395Z" fill="white"/>
596
+ </svg>
597
597
  `;
598
598
 
599
599
  const ptcShoppingCartCss = ":host .cart{border-radius:4px;display:inline-block;padding:0.45rem;max-height:28px}:host .cart .cart__count{position:relative;background:#D33E3E;height:20px;width:20px;text-align:center;border-radius:50%;color:white;left:18px;bottom:38px;vertical-align:middle;display:flex;justify-content:center;align-items:center;text-align:center;font-family:Raleway;font-size:14px;font-weight:600;line-height:21px;letter-spacing:0em}:host .cart.black-background{background:rgba(0, 0, 0, 0.54)}:host .cart.clear-background{background:rgba(0, 0, 0, 0)}";
600
600
 
601
- let PtcShoppingCart = class {
602
- constructor(hostRef) {
603
- index.registerInstance(this, hostRef);
604
- this.color = 'white';
605
- }
606
- render() {
607
- const classMap = this.getCssClassMap();
608
- const svg = this.color == 'black' ? ShoppingCartBlack : ShoppingCartWhite;
609
- const svgClass = this.color == 'black' ? "cart clear-background" : "cart black-background";
610
- return (index.h(index.Host, { class: classMap }, this.cartCount ? (index.h("div", { class: svgClass, innerHTML: svg }, index.h("div", { class: "cart__count" }, this.cartCount))) : (index.h("div", { class: svgClass, innerHTML: svg }))));
611
- /*
612
- if(this.color == 'black'){
613
- return (
614
- <Host class={classMap}>
615
- {this.cartCount ? (
616
- <div class="cart" innerHTML={ShoppingCartBlack}>
617
- <div class="cart__count">{this.cartCount}</div>
618
- </div>
619
- ) : (
620
- <div innerHTML={ShoppingCartBlack}></div>)
621
- }
622
- </Host>
623
- );
624
- } else if(this.color == 'white'){
625
- return(
626
- <Host class={classMap}>
627
- {this.cartCount ? (
628
- <div class="cart black-background" innerHTML={ShoppingCartWhite}>
629
- <div class="cart__count">{this.cartCount}</div>
630
- </div>
631
- ) : (
632
- <div innerHTML={ShoppingCartWhite} class="black-background"></div>)
633
- }
634
- </Host>
635
- );
636
- }*/
637
- }
638
- getCssClassMap() {
639
- return {
640
- ['ptc-shopping-cart']: true,
641
- };
642
- }
643
- };
601
+ let PtcShoppingCart = class {
602
+ constructor(hostRef) {
603
+ index.registerInstance(this, hostRef);
604
+ this.color = 'white';
605
+ }
606
+ render() {
607
+ const classMap = this.getCssClassMap();
608
+ const svg = this.color == 'black' ? ShoppingCartBlack : ShoppingCartWhite;
609
+ const svgClass = this.color == 'black' ? "cart clear-background" : "cart black-background";
610
+ return (index.h(index.Host, { class: classMap }, this.cartCount ? (index.h("div", { class: svgClass, innerHTML: svg }, index.h("div", { class: "cart__count" }, this.cartCount))) : (index.h("div", { class: svgClass, innerHTML: svg }))));
611
+ /*
612
+ if(this.color == 'black'){
613
+ return (
614
+ <Host class={classMap}>
615
+ {this.cartCount ? (
616
+ <div class="cart" innerHTML={ShoppingCartBlack}>
617
+ <div class="cart__count">{this.cartCount}</div>
618
+ </div>
619
+ ) : (
620
+ <div innerHTML={ShoppingCartBlack}></div>)
621
+ }
622
+ </Host>
623
+ );
624
+ } else if(this.color == 'white'){
625
+ return(
626
+ <Host class={classMap}>
627
+ {this.cartCount ? (
628
+ <div class="cart black-background" innerHTML={ShoppingCartWhite}>
629
+ <div class="cart__count">{this.cartCount}</div>
630
+ </div>
631
+ ) : (
632
+ <div innerHTML={ShoppingCartWhite} class="black-background"></div>)
633
+ }
634
+ </Host>
635
+ );
636
+ }*/
637
+ }
638
+ getCssClassMap() {
639
+ return {
640
+ ['ptc-shopping-cart']: true,
641
+ };
642
+ }
643
+ };
644
644
  PtcShoppingCart.style = ptcShoppingCartCss;
645
645
 
646
646
  const ptcSpacerCss = ":host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;display:block;width:12px;min-width:12px;height:12px}@media (min-width: 36em){:host{width:16px;min-width:16px;height:16px}}:host(.ptc-spacer-horizontal){display:inline-block;height:100% !important}:host(.ptc-spacer-horizontal.xx-small){width:4px;min-width:4px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xx-small){width:4px;min-width:4px}}:host(.ptc-spacer-horizontal.x-small){width:4px;min-width:4px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.x-small){width:8px;min-width:8px}}:host(.ptc-spacer-horizontal.small){width:8px;min-width:8px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.small){width:12px;min-width:12px}}:host(.ptc-spacer-horizontal.medium){height:100%}:host(.ptc-spacer-horizontal.large){width:16px;min-width:16px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.large){width:20px;min-width:20px}}:host(.ptc-spacer-horizontal.x-large){width:20px;min-width:20px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.x-large){width:28px;min-width:28px}}:host(.ptc-spacer-horizontal.xx-large){width:28px;min-width:28px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xx-large){width:36px;min-width:36px}}:host(.ptc-spacer-horizontal.xxx-large){width:36px;min-width:36px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xxx-large){width:48px;min-width:48px}}:host(.ptc-spacer-horizontal.xxxx-large){width:48px;min-width:48px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xxxx-large){width:72px;min-width:72px}}:host(.ptc-spacer-vertical.xx-small){width:100%;height:4px;min-height:4px}:host(.ptc-spacer-vertical.x-small){width:100%;height:4px;min-height:4px}@media (min-width: 36em){:host(.ptc-spacer-vertical.x-small){height:8px;min-height:8px}}:host(.ptc-spacer-vertical.small){width:100%;height:8px;min-height:8px}@media (min-width: 36em){:host(.ptc-spacer-vertical.small){height:12px;min-height:12px}}:host(.ptc-spacer-vertical.medium){width:100%}:host(.ptc-spacer-vertical.large){width:100%;height:16px;min-height:16px}@media (min-width: 36em){:host(.ptc-spacer-vertical.large){height:20px;min-height:20px}}:host(.ptc-spacer-vertical.x-large){width:100%;height:20px;min-height:20px}@media (min-width: 36em){:host(.ptc-spacer-vertical.x-large){height:28px;min-height:28px}}:host(.ptc-spacer-vertical.xx-large){width:100%;height:28px;min-height:28px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xx-large){height:36px;min-height:36px}}:host(.ptc-spacer-vertical.xxx-large){width:100%;height:36px;min-height:36px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xxx-large){height:48px;min-height:48px}}:host(.ptc-spacer-vertical.xxxx-large){width:100%;height:48px;min-height:48px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xxxx-large){height:72px;min-height:72px}}:host(.ptc-spacer-vertical.space-144){width:100%;height:144px;min-height:144px}:host(.ptc-spacer-vertical.space-120){width:100%;height:120px;min-height:120px}:host(.ptc-spacer-vertical.space-128){width:100%;height:128px;min-height:128px}:host(.ptc-spacer-xx-small){display:none}@media (max-width: 22.5em){:host(.ptc-spacer-xx-small){display:block}}:host(.ptc-spacer-x-small){display:none}@media (max-width: 35.9375em){:host(.ptc-spacer-x-small){display:block}}:host(.ptc-spacer-small){display:none}@media (min-width: 36em){:host(.ptc-spacer-small){display:block}}:host(.ptc-spacer-medium){display:none}@media (min-width: 48em){:host(.ptc-spacer-medium){display:block}}:host(.ptc-spacer-large){display:none}@media (min-width: 62em){:host(.ptc-spacer-large){display:block}}:host(.ptc-spacer-x-large){display:none}@media (min-width: 64.0625em){:host(.ptc-spacer-x-large){display:block}}:host(.ptc-spacer-xx-large){display:none}@media (min-width: 76.25em){:host(.ptc-spacer-xx-large){display:block}}";
647
647
 
648
- let PtcSpacer = class {
649
- constructor(hostRef) {
650
- index.registerInstance(this, hostRef);
651
- /**
652
- * Breakpoint
653
- */
654
- this.breakpoint = '';
655
- /**
656
- * Spacing Size
657
- */
658
- this.size = 'medium';
659
- /**
660
- * Direction
661
- */
662
- this.direction = 'vertical';
663
- }
664
- render() {
665
- const classMap = this.getCssClassMap();
666
- return (index.h(index.Host, { class: classMap }));
667
- }
668
- getCssClassMap() {
669
- return {
670
- [this.size]: true,
671
- ['ptc-spacer-horizontal']: this.direction === 'horizontal',
672
- ['ptc-spacer-vertical']: this.direction === 'vertical',
673
- ['ptc-spacer-xx-small']: this.breakpoint === 'xx-small',
674
- ['ptc-spacer-x-small']: this.breakpoint === 'x-small',
675
- ['ptc-spacer-small']: this.breakpoint === 'small',
676
- ['ptc-spacer-medium']: this.breakpoint === 'medium',
677
- ['ptc-spacer-large']: this.breakpoint === 'large',
678
- ['ptc-spacer-x-large']: this.breakpoint === 'x-large',
679
- ['ptc-spacer-xx-large']: this.breakpoint === 'xx-large',
680
- };
681
- }
682
- };
648
+ let PtcSpacer = class {
649
+ constructor(hostRef) {
650
+ index.registerInstance(this, hostRef);
651
+ /**
652
+ * Breakpoint
653
+ */
654
+ this.breakpoint = '';
655
+ /**
656
+ * Spacing Size
657
+ */
658
+ this.size = 'medium';
659
+ /**
660
+ * Direction
661
+ */
662
+ this.direction = 'vertical';
663
+ }
664
+ render() {
665
+ const classMap = this.getCssClassMap();
666
+ return (index.h(index.Host, { class: classMap }));
667
+ }
668
+ getCssClassMap() {
669
+ return {
670
+ [this.size]: true,
671
+ ['ptc-spacer-horizontal']: this.direction === 'horizontal',
672
+ ['ptc-spacer-vertical']: this.direction === 'vertical',
673
+ ['ptc-spacer-xx-small']: this.breakpoint === 'xx-small',
674
+ ['ptc-spacer-x-small']: this.breakpoint === 'x-small',
675
+ ['ptc-spacer-small']: this.breakpoint === 'small',
676
+ ['ptc-spacer-medium']: this.breakpoint === 'medium',
677
+ ['ptc-spacer-large']: this.breakpoint === 'large',
678
+ ['ptc-spacer-x-large']: this.breakpoint === 'x-large',
679
+ ['ptc-spacer-xx-large']: this.breakpoint === 'xx-large',
680
+ };
681
+ }
682
+ };
683
683
  PtcSpacer.style = ptcSpacerCss;
684
684
 
685
685
  const ptcTitleCss = "div.center.sc-ptc-title{text-align:center}div.center.dotted.sc-ptc-title h1.sc-ptc-title::before,div.center.dotted.sc-ptc-title h2.sc-ptc-title::before,div.center.dotted.sc-ptc-title h3.sc-ptc-title::before,div.center.dotted.sc-ptc-title h4.sc-ptc-title::before,div.center.dotted.sc-ptc-title h5.sc-ptc-title::before,div.center.dotted.sc-ptc-title h6.sc-ptc-title::before{left:50%;transform:translateX(-50%)}div.left.sc-ptc-title{text-align:left}div.left.dotted.sc-ptc-title h1.sc-ptc-title::before,div.left.dotted.sc-ptc-title h2.sc-ptc-title::before,div.left.dotted.sc-ptc-title h3.sc-ptc-title::before,div.left.dotted.sc-ptc-title h4.sc-ptc-title::before,div.left.dotted.sc-ptc-title h5.sc-ptc-title::before,div.left.dotted.sc-ptc-title h6.sc-ptc-title::before{left:0%}div.right.sc-ptc-title{text-align:right}div.right.dotted.sc-ptc-title h1.sc-ptc-title::before,div.right.dotted.sc-ptc-title h2.sc-ptc-title::before,div.right.dotted.sc-ptc-title h3.sc-ptc-title::before,div.right.dotted.sc-ptc-title h4.sc-ptc-title::before,div.right.dotted.sc-ptc-title h5.sc-ptc-title::before,div.right.dotted.sc-ptc-title h6.sc-ptc-title::before{right:0%}div.inherit.sc-ptc-title{text-align:inherit}div.dotted.sc-ptc-title h1.sc-ptc-title::before,div.dotted.sc-ptc-title h2.sc-ptc-title::before,div.dotted.sc-ptc-title h3.sc-ptc-title::before,div.dotted.sc-ptc-title h4.sc-ptc-title::before,div.dotted.sc-ptc-title h5.sc-ptc-title::before,div.dotted.sc-ptc-title h6.sc-ptc-title::before{content:\"\";position:absolute;top:-6px;width:30%;display:block;border-top:3px dashed var(--color-green-07)}div.solid.sc-ptc-title h1.sc-ptc-title::before,div.solid.sc-ptc-title h2.sc-ptc-title::before,div.solid.sc-ptc-title h3.sc-ptc-title::before,div.solid.sc-ptc-title h4.sc-ptc-title::before,div.solid.sc-ptc-title h5.sc-ptc-title::before,div.solid.sc-ptc-title h6.sc-ptc-title::before{content:\"\";position:absolute;width:100%;height:0.7px;background-color:var(--color-gray-07);opacity:0.9;left:0px}div.solid.sc-ptc-title h1.sc-ptc-title::after,div.solid.sc-ptc-title h2.sc-ptc-title::after,div.solid.sc-ptc-title h3.sc-ptc-title::after,div.solid.sc-ptc-title h4.sc-ptc-title::after,div.solid.sc-ptc-title h5.sc-ptc-title::after,div.solid.sc-ptc-title h6.sc-ptc-title::after{content:\"\";position:absolute;width:20%;height:2px;background-color:var(--color-green-07);top:-2px;left:0px}div.is-standard.sc-ptc-title h1.sc-ptc-title,div.is-standard.sc-ptc-title h2.sc-ptc-title,div.is-standard.sc-ptc-title h3.sc-ptc-title,div.is-standard.sc-ptc-title h4.sc-ptc-title,div.is-standard.sc-ptc-title h5.sc-ptc-title,div.is-standard.sc-ptc-title h6.sc-ptc-title{display:inline-block;position:relative}div.is-standard.sc-ptc-title h1.sc-ptc-title{font-size:var(--ptc-font-size-xxxx-large);line-height:var(--ptc-line-height-densest);font-weight:var(--ptc-font-weight-extrabold);letter-spacing:0px;color:var(--color-gray-10)}div.is-standard.sc-ptc-title h2.sc-ptc-title{font-size:var(--ptc-font-size-x-large);line-height:var(--ptc-line-height-densest);font-weight:var(--ptc-font-weight-extrabold);color:var(--color-gray-10)}div.is-plm-hub.sc-ptc-title h1.sc-ptc-title,div.is-plm-hub.sc-ptc-title h2.sc-ptc-title,div.is-plm-hub.sc-ptc-title h3.sc-ptc-title,div.is-plm-hub.sc-ptc-title h4.sc-ptc-title,div.is-plm-hub.sc-ptc-title h5.sc-ptc-title,div.is-plm-hub.sc-ptc-title h6.sc-ptc-title{display:inline-block;position:relative;margin-block-start:0em;margin-block-end:0em;margin-inline-start:0px;margin-inline-end:0px;color:var(--color-white)}div.margin-flush.sc-ptc-title{margin-top:0;margin-bottom:0}div.margin-flush.sc-ptc-title h1.sc-ptc-title,div.margin-flush.sc-ptc-title h2.sc-ptc-title,div.margin-flush.sc-ptc-title h3.sc-ptc-title,div.margin-flush.sc-ptc-title h4.sc-ptc-title,div.margin-flush.sc-ptc-title h5.sc-ptc-title{margin-top:0;margin-bottom:0}div.margin-top-2.sc-ptc-title{margin-top:var(--ptc-element-spacing-02);margin-bottom:0}div.margin-top-3.sc-ptc-title{margin-top:var(--ptc-element-spacing-03);margin-bottom:0}div.margin-top-4.sc-ptc-title{margin-top:var(--ptc-element-spacing-04);margin-bottom:0}div.margin-top-5.sc-ptc-title{margin-top:var(--ptc-element-spacing-05);margin-bottom:0}div.margin-top-6.sc-ptc-title{margin-top:var(--ptc-element-spacing-06);margin-bottom:0}div.margin-bottom-2.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-02);margin-top:0}div.margin-bottom-3.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-03);margin-top:0}div.margin-bottom-4.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-04);margin-top:0}div.margin-bottom-5.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-05);margin-top:0}div.margin-bottom-6.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-06);margin-top:0}div.margin-2.sc-ptc-title{margin-top:var(--ptc-element-spacing-02);margin-bottom:var(--ptc-element-spacing-02)}div.margin-3.sc-ptc-title{margin-top:var(--ptc-element-spacing-03);margin-bottom:var(--ptc-element-spacing-03)}div.margin-4.sc-ptc-title{margin-top:var(--ptc-element-spacing-04);margin-bottom:var(--ptc-element-spacing-04)}div.margin-5.sc-ptc-title{margin-top:var(--ptc-element-spacing-05);margin-bottom:var(--ptc-element-spacing-05)}div.margin-5.sc-ptc-title h4.sc-ptc-title{margin-top:0;margin-bottom:0}div.margin-6.sc-ptc-title{margin-top:var(--ptc-element-spacing-06);margin-bottom:var(--ptc-element-spacing-06)}div.green.sc-ptc-title h1.sc-ptc-title,div.green.sc-ptc-title h2.sc-ptc-title,div.green.sc-ptc-title h3.sc-ptc-title,div.green.sc-ptc-title h4.sc-ptc-title,div.green.sc-ptc-title h5.sc-ptc-title,div.green.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-green-07)}div.blue.sc-ptc-title h1.sc-ptc-title,div.blue.sc-ptc-title h2.sc-ptc-title,div.blue.sc-ptc-title h3.sc-ptc-title,div.blue.sc-ptc-title h4.sc-ptc-title,div.blue.sc-ptc-title h5.sc-ptc-title,div.blue.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-blue-07)}div.red.sc-ptc-title h1.sc-ptc-title,div.red.sc-ptc-title h2.sc-ptc-title,div.red.sc-ptc-title h3.sc-ptc-title,div.red.sc-ptc-title h4.sc-ptc-title,div.red.sc-ptc-title h5.sc-ptc-title,div.red.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-red-07)}div.orange.sc-ptc-title h1.sc-ptc-title,div.orange.sc-ptc-title h2.sc-ptc-title,div.orange.sc-ptc-title h3.sc-ptc-title,div.orange.sc-ptc-title h4.sc-ptc-title,div.orange.sc-ptc-title h5.sc-ptc-title,div.orange.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-orange-07)}div.slate-grey.sc-ptc-title h1.sc-ptc-title,div.slate-grey.sc-ptc-title h2.sc-ptc-title,div.slate-grey.sc-ptc-title h3.sc-ptc-title,div.slate-grey.sc-ptc-title h4.sc-ptc-title,div.slate-grey.sc-ptc-title h5.sc-ptc-title,div.slate-grey.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-grey-07)}div.w-3.sc-ptc-title h1.sc-ptc-title,div.w-3.sc-ptc-title h2.sc-ptc-title,div.w-3.sc-ptc-title h3.sc-ptc-title,div.w-3.sc-ptc-title h4.sc-ptc-title,div.w-3.sc-ptc-title h5.sc-ptc-title,div.w-3.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-thin)}div.w-4.sc-ptc-title h1.sc-ptc-title,div.w-4.sc-ptc-title h2.sc-ptc-title,div.w-4.sc-ptc-title h3.sc-ptc-title,div.w-4.sc-ptc-title h4.sc-ptc-title,div.w-4.sc-ptc-title h5.sc-ptc-title,div.w-4.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-regular)}div.w-5.sc-ptc-title h1.sc-ptc-title,div.w-5.sc-ptc-title h2.sc-ptc-title,div.w-5.sc-ptc-title h3.sc-ptc-title,div.w-5.sc-ptc-title h4.sc-ptc-title,div.w-5.sc-ptc-title h5.sc-ptc-title,div.w-5.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-medium)}div.w-6.sc-ptc-title h1.sc-ptc-title,div.w-6.sc-ptc-title h2.sc-ptc-title,div.w-6.sc-ptc-title h3.sc-ptc-title,div.w-6.sc-ptc-title h4.sc-ptc-title,div.w-6.sc-ptc-title h5.sc-ptc-title,div.w-6.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-semibold)}div.w-7.sc-ptc-title h1.sc-ptc-title,div.w-7.sc-ptc-title h2.sc-ptc-title,div.w-7.sc-ptc-title h3.sc-ptc-title,div.w-7.sc-ptc-title h4.sc-ptc-title,div.w-7.sc-ptc-title h5.sc-ptc-title,div.w-7.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-bold)}div.w-8.sc-ptc-title h1.sc-ptc-title,div.w-8.sc-ptc-title h2.sc-ptc-title,div.w-8.sc-ptc-title h3.sc-ptc-title,div.w-8.sc-ptc-title h4.sc-ptc-title,div.w-8.sc-ptc-title h5.sc-ptc-title,div.w-8.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-extrabold)}div.w-9.sc-ptc-title h1.sc-ptc-title,div.w-9.sc-ptc-title h2.sc-ptc-title,div.w-9.sc-ptc-title h3.sc-ptc-title,div.w-9.sc-ptc-title h4.sc-ptc-title,div.w-9.sc-ptc-title h5.sc-ptc-title,div.w-9.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-black)}div.xx-small.sc-ptc-title h1.sc-ptc-title,div.xx-small.sc-ptc-title h2.sc-ptc-title,div.xx-small.sc-ptc-title h3.sc-ptc-title,div.xx-small.sc-ptc-title h4.sc-ptc-title,div.xx-small.sc-ptc-title h5.sc-ptc-title,div.xx-small.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xx-small)}div.x-small.sc-ptc-title h1.sc-ptc-title,div.x-small.sc-ptc-title h2.sc-ptc-title,div.x-small.sc-ptc-title h3.sc-ptc-title,div.x-small.sc-ptc-title h4.sc-ptc-title,div.x-small.sc-ptc-title h5.sc-ptc-title,div.x-small.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-x-small)}div.small.sc-ptc-title h1.sc-ptc-title,div.small.sc-ptc-title h2.sc-ptc-title,div.small.sc-ptc-title h3.sc-ptc-title,div.small.sc-ptc-title h4.sc-ptc-title,div.small.sc-ptc-title h5.sc-ptc-title,div.small.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-small)}div.medium.sc-ptc-title h1.sc-ptc-title,div.medium.sc-ptc-title h2.sc-ptc-title,div.medium.sc-ptc-title h3.sc-ptc-title,div.medium.sc-ptc-title h4.sc-ptc-title,div.medium.sc-ptc-title h5.sc-ptc-title,div.medium.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-medium)}div.large.sc-ptc-title h1.sc-ptc-title,div.large.sc-ptc-title h2.sc-ptc-title,div.large.sc-ptc-title h3.sc-ptc-title,div.large.sc-ptc-title h4.sc-ptc-title,div.large.sc-ptc-title h5.sc-ptc-title,div.large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-large)}div.x-large.sc-ptc-title h1.sc-ptc-title,div.x-large.sc-ptc-title h2.sc-ptc-title,div.x-large.sc-ptc-title h3.sc-ptc-title,div.x-large.sc-ptc-title h4.sc-ptc-title,div.x-large.sc-ptc-title h5.sc-ptc-title,div.x-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-x-large)}div.xx-large.sc-ptc-title h1.sc-ptc-title,div.xx-large.sc-ptc-title h2.sc-ptc-title,div.xx-large.sc-ptc-title h3.sc-ptc-title{font-size:var(--ptc-font-size-xx-large)}div.xxx-large.sc-ptc-title h1.sc-ptc-title,div.xxx-large.sc-ptc-title h2.sc-ptc-title,div.xxx-large.sc-ptc-title h3.sc-ptc-title,div.xxx-large.sc-ptc-title h4.sc-ptc-title,div.xxx-large.sc-ptc-title h5.sc-ptc-title,div.xxx-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxx-large)}div.xxxx-large.sc-ptc-title h1.sc-ptc-title,div.xxxx-large.sc-ptc-title h2.sc-ptc-title,div.xxxx-large.sc-ptc-title h3.sc-ptc-title,div.xxxx-large.sc-ptc-title h4.sc-ptc-title,div.xxxx-large.sc-ptc-title h5.sc-ptc-title,div.xxxx-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxxx-large)}div.densest.sc-ptc-title h1.sc-ptc-title,div.densest.sc-ptc-title h2.sc-ptc-title,div.densest.sc-ptc-title h3.sc-ptc-title,div.densest.sc-ptc-title h4.sc-ptc-title,div.densest.sc-ptc-title h5.sc-ptc-title,div.densest.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-densest)}div.denser.sc-ptc-title h1.sc-ptc-title,div.denser.sc-ptc-title h2.sc-ptc-title,div.denser.sc-ptc-title h3.sc-ptc-title,div.denser.sc-ptc-title h4.sc-ptc-title,div.denser.sc-ptc-title h5.sc-ptc-title,div.denser.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-denser)}div.dense.sc-ptc-title h1.sc-ptc-title,div.dense.sc-ptc-title h2.sc-ptc-title,div.dense.sc-ptc-title h3.sc-ptc-title,div.dense.sc-ptc-title h4.sc-ptc-title,div.dense.sc-ptc-title h5.sc-ptc-title,div.dense.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-dense)}div.normal.sc-ptc-title h1.sc-ptc-title,div.normal.sc-ptc-title h2.sc-ptc-title,div.normal.sc-ptc-title h3.sc-ptc-title,div.normal.sc-ptc-title h4.sc-ptc-title,div.normal.sc-ptc-title h5.sc-ptc-title,div.normal.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-normal)}div.loose.sc-ptc-title h1.sc-ptc-title,div.loose.sc-ptc-title h2.sc-ptc-title,div.loose.sc-ptc-title h3.sc-ptc-title,div.loose.sc-ptc-title h4.sc-ptc-title,div.loose.sc-ptc-title h5.sc-ptc-title,div.loose.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-loose)}div.looser.sc-ptc-title h1.sc-ptc-title,div.looser.sc-ptc-title h2.sc-ptc-title,div.looser.sc-ptc-title h3.sc-ptc-title,div.looser.sc-ptc-title h4.sc-ptc-title,div.looser.sc-ptc-title h5.sc-ptc-title,div.looser.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-looser)}div.paragraph.sc-ptc-title h1.sc-ptc-title,div.paragraph.sc-ptc-title h2.sc-ptc-title,div.paragraph.sc-ptc-title h3.sc-ptc-title,div.paragraph.sc-ptc-title h4.sc-ptc-title,div.paragraph.sc-ptc-title h5.sc-ptc-title,div.paragraph.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-paragraph)}";
686
686
 
687
- let PtcTitle = class {
688
- constructor(hostRef) {
689
- index.registerInstance(this, hostRef);
690
- /**
691
- * Is this title using on the PLM Hub page
692
- */
693
- this.isPlmHub = false;
694
- /**
695
- * Title Tag Type
696
- */
697
- this.type = 'h2';
698
- /**
699
- * Upperline Style
700
- */
701
- this.upperline = 'dotted';
702
- /**
703
- * Title line height
704
- */
705
- this.titleHeight = 'paragraph';
706
- }
707
- render() {
708
- const classMap = this.getCssClassMap();
709
- let TagType;
710
- switch (this.type) {
711
- case 'h1':
712
- TagType = 'h1';
713
- break;
714
- case 'h3':
715
- TagType = 'h3';
716
- break;
717
- case 'h4':
718
- TagType = 'h4';
719
- break;
720
- case 'h5':
721
- TagType = 'h5';
722
- break;
723
- case 'h6':
724
- TagType = 'h6';
725
- break;
726
- default:
727
- TagType = 'h2';
728
- }
729
- return (index.h(index.Host, null, this.styles && index.h("style", null, this.styles), index.h("div", { class: classMap }, index.h(TagType, null, index.h("slot", null)))));
730
- }
731
- getCssClassMap() {
732
- return {
733
- [this.textAlign]: !!this.textAlign ? true : false,
734
- [this.upperline]: true,
735
- [this.isPlmHub ? 'is-plm-hub' : 'is-standard']: true,
736
- [this.titleMargin]: !!this.titleMargin ? true : false,
737
- [this.titleShadow]: !!this.titleShadow ? true : false,
738
- [this.titleWeight]: !!this.titleWeight ? true : false,
739
- [this.titleSize]: !!this.titleSize ? true : false,
740
- [this.titleHeight]: !!this.titleHeight ? true : false
741
- };
742
- }
743
- };
687
+ let PtcTitle = class {
688
+ constructor(hostRef) {
689
+ index.registerInstance(this, hostRef);
690
+ /**
691
+ * Is this title using on the PLM Hub page
692
+ */
693
+ this.isPlmHub = false;
694
+ /**
695
+ * Title Tag Type
696
+ */
697
+ this.type = 'h2';
698
+ /**
699
+ * Upperline Style
700
+ */
701
+ this.upperline = 'dotted';
702
+ /**
703
+ * Title line height
704
+ */
705
+ this.titleHeight = 'paragraph';
706
+ }
707
+ render() {
708
+ const classMap = this.getCssClassMap();
709
+ let TagType;
710
+ switch (this.type) {
711
+ case 'h1':
712
+ TagType = 'h1';
713
+ break;
714
+ case 'h3':
715
+ TagType = 'h3';
716
+ break;
717
+ case 'h4':
718
+ TagType = 'h4';
719
+ break;
720
+ case 'h5':
721
+ TagType = 'h5';
722
+ break;
723
+ case 'h6':
724
+ TagType = 'h6';
725
+ break;
726
+ default:
727
+ TagType = 'h2';
728
+ }
729
+ return (index.h(index.Host, null, this.styles && index.h("style", null, this.styles), index.h("div", { class: classMap }, index.h(TagType, null, index.h("slot", null)))));
730
+ }
731
+ getCssClassMap() {
732
+ return {
733
+ [this.textAlign]: !!this.textAlign ? true : false,
734
+ [this.upperline]: true,
735
+ [this.isPlmHub ? 'is-plm-hub' : 'is-standard']: true,
736
+ [this.titleMargin]: !!this.titleMargin ? true : false,
737
+ [this.titleShadow]: !!this.titleShadow ? true : false,
738
+ [this.titleWeight]: !!this.titleWeight ? true : false,
739
+ [this.titleSize]: !!this.titleSize ? true : false,
740
+ [this.titleHeight]: !!this.titleHeight ? true : false
741
+ };
742
+ }
743
+ };
744
744
  PtcTitle.style = ptcTitleCss;
745
745
 
746
746
  exports.icon_asset = IconAsset;