@ptcwebops/ptcw-design 0.7.5 → 0.7.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (380) hide show
  1. package/LICENSE +21 -21
  2. package/dist/cjs/dropdown-item.cjs.entry.js +11 -11
  3. package/dist/cjs/icon-asset.cjs.entry.js +43 -55
  4. package/dist/cjs/{index-b3fabe79.js → index-8745a0a3.js} +486 -255
  5. package/dist/cjs/list-item.cjs.entry.js +20 -20
  6. package/dist/cjs/loader.cjs.js +3 -3
  7. package/dist/cjs/lottie-player.cjs.entry.js +355 -355
  8. package/dist/cjs/my-component.cjs.entry.js +16 -13
  9. package/dist/cjs/ptc-accordion-item.cjs.entry.js +84 -98
  10. package/dist/cjs/ptc-accordion.cjs.entry.js +36 -39
  11. package/dist/cjs/ptc-announcement.cjs.entry.js +53 -39
  12. package/dist/cjs/ptc-breadcrumb.cjs.entry.js +13 -13
  13. package/dist/cjs/ptc-button.cjs.entry.js +35 -66
  14. package/dist/cjs/ptc-card-bottom.cjs.entry.js +34 -32
  15. package/dist/cjs/ptc-card-content.cjs.entry.js +38 -36
  16. package/dist/cjs/ptc-card-plm.cjs.entry.js +20 -17
  17. package/dist/cjs/ptc-card_6.cjs.entry.js +428 -536
  18. package/dist/cjs/ptc-checkbox.cjs.entry.js +34 -32
  19. package/dist/cjs/ptc-collapse-list.cjs.entry.js +347 -336
  20. package/dist/cjs/ptc-container.cjs.entry.js +33 -36
  21. package/dist/cjs/ptc-dropdown.cjs.entry.js +65 -65
  22. package/dist/cjs/ptc-dynamic-card.cjs.entry.js +49 -42
  23. package/dist/cjs/ptc-ellipsis-dropdown.cjs.entry.js +39 -38
  24. package/dist/cjs/ptc-filter-tag.cjs.entry.js +58 -57
  25. package/dist/cjs/ptc-hero-footer-cta.cjs.entry.js +12 -9
  26. package/dist/cjs/ptc-hero.cjs.entry.js +17 -19
  27. package/dist/cjs/ptc-icon-list.cjs.entry.js +21 -33
  28. package/dist/cjs/ptc-icon-minimize.cjs.entry.js +37 -36
  29. package/dist/cjs/ptc-link.cjs.entry.js +27 -43
  30. package/dist/cjs/ptc-list.cjs.entry.js +51 -51
  31. package/dist/cjs/ptc-lottie.cjs.entry.js +11 -13
  32. package/dist/cjs/ptc-minimized-footer.cjs.entry.js +9 -9
  33. package/dist/cjs/ptc-minimized-header.cjs.entry.js +12 -12
  34. package/dist/cjs/ptc-mobile-select.cjs.entry.js +55 -70
  35. package/dist/cjs/ptc-modal.cjs.entry.js +138 -156
  36. package/dist/cjs/ptc-overlay.cjs.entry.js +21 -21
  37. package/dist/cjs/ptc-pagenation.cjs.entry.js +107 -106
  38. package/dist/cjs/ptc-previous-url.cjs.entry.js +11 -9
  39. package/dist/cjs/ptc-pricing-block.cjs.entry.js +17 -16
  40. package/dist/cjs/ptc-quote.cjs.entry.js +24 -26
  41. package/dist/cjs/ptc-readmore_2.cjs.entry.js +85 -0
  42. package/dist/cjs/ptc-responsive-wrapper.cjs.entry.js +55 -55
  43. package/dist/cjs/ptc-shopping-cart.cjs.entry.js +51 -50
  44. package/dist/cjs/ptc-social-share.cjs.entry.js +58 -65
  45. package/dist/cjs/ptc-span.cjs.entry.js +19 -24
  46. package/dist/cjs/ptc-svg-btn.cjs.entry.js +74 -76
  47. package/dist/cjs/ptc-tab-list.cjs.entry.js +124 -123
  48. package/dist/cjs/ptc-text-copy-with-background.cjs.entry.js +21 -25
  49. package/dist/cjs/ptc-title.cjs.entry.js +67 -75
  50. package/dist/cjs/ptc-two-column-media.cjs.entry.js +16 -15
  51. package/dist/cjs/ptcw-design.cjs.js +3 -3
  52. package/dist/cjs/tab-content.cjs.entry.js +28 -27
  53. package/dist/cjs/tab-header.cjs.entry.js +45 -44
  54. package/dist/cjs/{utils-2ac2a528.js → utils-5245e89c.js} +79 -79
  55. package/dist/collection/collection-manifest.json +4 -4
  56. package/dist/collection/components/dropdown-item/dropdown-item.js +61 -56
  57. package/dist/collection/components/icon-asset/icon-asset.css +4 -4
  58. package/dist/collection/components/icon-asset/icon-asset.js +199 -217
  59. package/dist/collection/components/icon-asset/media/brands.svg +1381 -1381
  60. package/dist/collection/components/icon-asset/media/designer.svg +379 -368
  61. package/dist/collection/components/icon-asset/media/regular.svg +463 -463
  62. package/dist/collection/components/icon-asset/media/solid.svg +3013 -3013
  63. package/dist/collection/components/icon-asset/media/svg-with-js.min.css +4 -4
  64. package/dist/collection/components/list-item/list-item.js +107 -103
  65. package/dist/collection/components/my-component/my-component.css +3 -3
  66. package/dist/collection/components/my-component/my-component.js +82 -73
  67. package/dist/collection/components/ptc-accordion/ptc-accordion-item/ptc-accordion-item.js +287 -296
  68. package/dist/collection/components/ptc-accordion/ptc-accordion.js +78 -74
  69. package/dist/collection/components/ptc-announcement/ptc-announcement.css +86 -80
  70. package/dist/collection/components/ptc-announcement/ptc-announcement.js +239 -210
  71. package/dist/collection/components/ptc-breadcrumb/ptc-breadcrumb.js +22 -21
  72. package/dist/collection/components/ptc-button/ptc-button.js +264 -293
  73. package/dist/collection/components/ptc-card/ptc-card.css +167 -6
  74. package/dist/collection/components/ptc-card/ptc-card.js +312 -342
  75. package/dist/collection/components/ptc-card-bottom/ptc-card-bottom.js +114 -105
  76. package/dist/collection/components/ptc-card-content/ptc-card-content.js +118 -109
  77. package/dist/collection/components/ptc-card-plm/ptc-card-plm.js +104 -97
  78. package/dist/collection/components/ptc-checkbox/ptc-checkbox.js +118 -114
  79. package/dist/collection/components/ptc-collapse-list/ptc-collapse-list.js +570 -557
  80. package/dist/collection/components/ptc-container/ptc-container.js +120 -119
  81. package/dist/collection/components/ptc-date/ptc-date.js +190 -201
  82. package/dist/collection/components/ptc-dropdown/ptc-dropdown.js +162 -157
  83. package/dist/collection/components/ptc-dynamic-card/media/nav-active-dotslick.svg +16 -0
  84. package/dist/collection/components/ptc-dynamic-card/ptc-dynamic-card.css +4 -0
  85. package/dist/collection/components/ptc-dynamic-card/ptc-dynamic-card.js +183 -156
  86. package/dist/collection/components/ptc-ellipsis-dropdown/ptc-ellipsis-dropdown.js +122 -115
  87. package/dist/collection/components/ptc-filter-tag/ptc-filter-tag.js +113 -105
  88. package/dist/collection/components/ptc-hero/ptc-hero.js +67 -67
  89. package/dist/collection/components/ptc-hero-footer-cta/ptc-hero-footer-cta.js +78 -77
  90. package/dist/collection/components/ptc-icon-list/ptc-icon-list.js +126 -145
  91. package/dist/collection/components/ptc-icon-minimize/ptc-icon-minimize.js +87 -86
  92. package/dist/collection/components/ptc-img/ptc-img.js +296 -313
  93. package/dist/collection/components/ptc-link/ptc-link.js +184 -198
  94. package/dist/collection/components/ptc-list/ptc-list.js +100 -95
  95. package/dist/collection/components/ptc-lottie/ptc-lottie.css +5 -5
  96. package/dist/collection/components/ptc-lottie/ptc-lottie.js +62 -58
  97. package/dist/collection/components/ptc-minimized-footer/ptc-minimized-footer.js +18 -17
  98. package/dist/collection/components/ptc-minimized-header/ptc-minimized-header.js +81 -80
  99. package/dist/collection/components/ptc-mobile-select/ptc-mobile-select.js +209 -221
  100. package/dist/collection/components/ptc-modal/ptc-modal.js +341 -359
  101. package/dist/collection/components/ptc-overlay/ptc-overlay.js +105 -99
  102. package/dist/collection/components/ptc-pagenation/ptc-pagenation.css +10 -2
  103. package/dist/collection/components/ptc-pagenation/ptc-pagenation.js +322 -317
  104. package/dist/collection/components/ptc-para/ptc-para.js +186 -195
  105. package/dist/collection/components/ptc-picture/ptc-picture.js +452 -473
  106. package/dist/collection/components/ptc-previous-url/ptc-previous-url.js +60 -54
  107. package/dist/collection/components/ptc-pricing-block/ptc-pricing-block.js +49 -45
  108. package/dist/collection/components/ptc-quote/ptc-quote.js +144 -154
  109. package/dist/collection/components/ptc-readmore/ptc-readmore.css +66 -0
  110. package/dist/collection/components/ptc-readmore/ptc-readmore.js +129 -0
  111. package/dist/collection/components/ptc-responsive-wrapper/ptc-responsive-wrapper.css +3 -3
  112. package/dist/collection/components/ptc-responsive-wrapper/ptc-responsive-wrapper.js +65 -62
  113. package/dist/collection/components/ptc-shopping-cart/ptc-shopping-cart.js +97 -91
  114. package/dist/collection/components/ptc-social-share/ptc-social-share.js +201 -206
  115. package/dist/collection/components/ptc-spacer/ptc-spacer.css +322 -322
  116. package/dist/collection/components/ptc-spacer/ptc-spacer.js +96 -99
  117. package/dist/collection/components/ptc-span/ptc-span.js +87 -89
  118. package/dist/collection/components/ptc-svg-btn/ptc-svg-btn.js +72 -71
  119. package/dist/collection/components/ptc-tab-list/ptc-tab-list.js +154 -149
  120. package/dist/collection/components/ptc-text-copy-with-background/ptc-text-copy-with-background.js +123 -129
  121. package/dist/collection/components/ptc-title/ptc-title.css +1 -1
  122. package/dist/collection/components/ptc-title/ptc-title.js +291 -297
  123. package/dist/collection/components/ptc-tooltip/ptc-tooltip.css +112 -0
  124. package/dist/collection/components/ptc-tooltip/ptc-tooltip.js +163 -0
  125. package/dist/collection/components/ptc-two-column-media/ptc-two-column-media.js +48 -40
  126. package/dist/collection/components/tab-content/tab-content.js +84 -74
  127. package/dist/collection/components/tab-header/tab-header.js +118 -106
  128. package/dist/collection/index.js +1 -1
  129. package/dist/collection/media/svg-imgs/Back-arrow.svg +11 -11
  130. package/dist/collection/media/svg-imgs/close.svg +10 -10
  131. package/dist/collection/media/svg-imgs/ptc-shopping-cart-black.svg +3 -3
  132. package/dist/collection/media/svg-imgs/ptc-shopping-cart-white.svg +3 -3
  133. package/dist/collection/media/svg-imgs/slider-arrow-left.svg +18 -18
  134. package/dist/collection/media/svg-imgs/slider-arrow-right.svg +18 -18
  135. package/dist/collection/media/svg-imgs/union.svg +3 -3
  136. package/dist/collection/utils/component.js +3 -3
  137. package/dist/collection/utils/interfaces.js +11 -11
  138. package/dist/collection/utils/utils.js +81 -81
  139. package/dist/custom-elements/index.d.ts +12 -12
  140. package/dist/custom-elements/index.js +3158 -3385
  141. package/dist/esm/dropdown-item.entry.js +11 -11
  142. package/dist/esm/icon-asset.entry.js +43 -55
  143. package/dist/esm/{index-5ff11327.js → index-0c73b51e.js} +486 -255
  144. package/dist/esm/list-item.entry.js +20 -20
  145. package/dist/esm/loader.js +3 -3
  146. package/dist/esm/lottie-player.entry.js +355 -355
  147. package/dist/esm/my-component.entry.js +16 -13
  148. package/dist/esm/polyfills/core-js.js +0 -0
  149. package/dist/esm/polyfills/css-shim.js +1 -1
  150. package/dist/esm/polyfills/dom.js +0 -0
  151. package/dist/esm/polyfills/es5-html-element.js +0 -0
  152. package/dist/esm/polyfills/index.js +0 -0
  153. package/dist/esm/polyfills/system.js +0 -0
  154. package/dist/esm/ptc-accordion-item.entry.js +84 -98
  155. package/dist/esm/ptc-accordion.entry.js +36 -39
  156. package/dist/esm/ptc-announcement.entry.js +53 -39
  157. package/dist/esm/ptc-breadcrumb.entry.js +13 -13
  158. package/dist/esm/ptc-button.entry.js +35 -66
  159. package/dist/esm/ptc-card-bottom.entry.js +34 -32
  160. package/dist/esm/ptc-card-content.entry.js +38 -36
  161. package/dist/esm/ptc-card-plm.entry.js +20 -17
  162. package/dist/esm/ptc-card_6.entry.js +428 -536
  163. package/dist/esm/ptc-checkbox.entry.js +34 -32
  164. package/dist/esm/ptc-collapse-list.entry.js +347 -336
  165. package/dist/esm/ptc-container.entry.js +33 -36
  166. package/dist/esm/ptc-dropdown.entry.js +65 -65
  167. package/dist/esm/ptc-dynamic-card.entry.js +49 -42
  168. package/dist/esm/ptc-ellipsis-dropdown.entry.js +39 -38
  169. package/dist/esm/ptc-filter-tag.entry.js +58 -57
  170. package/dist/esm/ptc-hero-footer-cta.entry.js +12 -9
  171. package/dist/esm/ptc-hero.entry.js +17 -19
  172. package/dist/esm/ptc-icon-list.entry.js +21 -33
  173. package/dist/esm/ptc-icon-minimize.entry.js +37 -36
  174. package/dist/esm/ptc-link.entry.js +27 -43
  175. package/dist/esm/ptc-list.entry.js +51 -51
  176. package/dist/esm/ptc-lottie.entry.js +11 -13
  177. package/dist/esm/ptc-minimized-footer.entry.js +9 -9
  178. package/dist/esm/ptc-minimized-header.entry.js +12 -12
  179. package/dist/esm/ptc-mobile-select.entry.js +55 -70
  180. package/dist/esm/ptc-modal.entry.js +138 -156
  181. package/dist/esm/ptc-overlay.entry.js +21 -21
  182. package/dist/esm/ptc-pagenation.entry.js +107 -106
  183. package/dist/esm/ptc-previous-url.entry.js +11 -9
  184. package/dist/esm/ptc-pricing-block.entry.js +17 -16
  185. package/dist/esm/ptc-quote.entry.js +24 -26
  186. package/dist/esm/ptc-readmore_2.entry.js +80 -0
  187. package/dist/esm/ptc-responsive-wrapper.entry.js +55 -55
  188. package/dist/esm/ptc-shopping-cart.entry.js +51 -50
  189. package/dist/esm/ptc-social-share.entry.js +58 -65
  190. package/dist/esm/ptc-span.entry.js +19 -24
  191. package/dist/esm/ptc-svg-btn.entry.js +74 -76
  192. package/dist/esm/ptc-tab-list.entry.js +124 -123
  193. package/dist/esm/ptc-text-copy-with-background.entry.js +21 -25
  194. package/dist/esm/ptc-title.entry.js +67 -75
  195. package/dist/esm/ptc-two-column-media.entry.js +16 -15
  196. package/dist/esm/ptcw-design.js +3 -3
  197. package/dist/esm/tab-content.entry.js +28 -27
  198. package/dist/esm/tab-header.entry.js +45 -44
  199. package/dist/esm/{utils-2dbb41dc.js → utils-646cc62f.js} +79 -79
  200. package/dist/ptcw-design/media/brands.svg +1381 -1381
  201. package/dist/ptcw-design/media/designer.svg +379 -368
  202. package/dist/ptcw-design/media/nav-active-dotslick.svg +16 -0
  203. package/dist/ptcw-design/media/regular.svg +463 -463
  204. package/dist/ptcw-design/media/solid.svg +3013 -3013
  205. package/dist/ptcw-design/media/svg-with-js.min.css +4 -4
  206. package/dist/ptcw-design/p-009001dc.js +2 -0
  207. package/dist/ptcw-design/p-00c1343b.entry.js +1 -0
  208. package/dist/ptcw-design/p-188d69d9.entry.js +1 -0
  209. package/dist/ptcw-design/p-1964f1f4.entry.js +1 -0
  210. package/dist/ptcw-design/p-1cd396ab.entry.js +1 -0
  211. package/dist/ptcw-design/p-1e80c01f.entry.js +1 -0
  212. package/dist/ptcw-design/p-21e27f2b.entry.js +1 -0
  213. package/dist/ptcw-design/p-24321c52.entry.js +1 -0
  214. package/dist/ptcw-design/p-2b6244ad.entry.js +1 -0
  215. package/dist/ptcw-design/{p-7599491c.entry.js → p-2dcea9db.entry.js} +1 -1
  216. package/dist/ptcw-design/p-36a453d4.entry.js +1 -0
  217. package/dist/ptcw-design/p-3db835e4.entry.js +1 -0
  218. package/dist/ptcw-design/p-3f85b469.entry.js +1 -0
  219. package/dist/ptcw-design/p-482a8bc9.entry.js +1 -0
  220. package/dist/ptcw-design/p-4de70656.entry.js +1 -0
  221. package/dist/ptcw-design/p-5105d9e5.entry.js +1 -0
  222. package/dist/ptcw-design/p-58e06eee.entry.js +1 -0
  223. package/dist/ptcw-design/p-5bb7354a.entry.js +1 -0
  224. package/dist/ptcw-design/p-5d585b54.entry.js +1 -0
  225. package/dist/ptcw-design/p-5dbf98a9.entry.js +1 -0
  226. package/dist/ptcw-design/p-60843852.entry.js +1 -0
  227. package/dist/ptcw-design/p-6131b9a1.entry.js +1 -0
  228. package/dist/ptcw-design/p-6b1fdce6.entry.js +1 -0
  229. package/dist/ptcw-design/p-6d713986.entry.js +1 -0
  230. package/dist/ptcw-design/p-8637cefc.entry.js +1 -0
  231. package/dist/ptcw-design/p-8808ecc8.entry.js +1 -0
  232. package/dist/ptcw-design/p-8b197833.entry.js +1 -0
  233. package/dist/ptcw-design/p-8b5b5614.entry.js +1 -0
  234. package/dist/ptcw-design/p-8bb41e7c.entry.js +1 -0
  235. package/dist/ptcw-design/p-9311ee3f.entry.js +1 -0
  236. package/dist/ptcw-design/p-97e00dfa.entry.js +1 -0
  237. package/dist/ptcw-design/p-a05fe3d0.entry.js +1 -0
  238. package/dist/ptcw-design/p-a0f25c98.entry.js +1 -0
  239. package/dist/ptcw-design/p-a4900673.entry.js +1 -0
  240. package/dist/ptcw-design/p-a749c353.entry.js +1 -0
  241. package/dist/ptcw-design/p-adcc9906.entry.js +1 -0
  242. package/dist/ptcw-design/p-b420e81a.entry.js +1 -0
  243. package/dist/ptcw-design/p-b701bbc0.entry.js +1 -0
  244. package/dist/ptcw-design/p-bbbced85.entry.js +1 -0
  245. package/dist/ptcw-design/p-c3f73953.entry.js +1 -0
  246. package/dist/ptcw-design/p-c4e20f99.entry.js +1 -0
  247. package/dist/ptcw-design/p-ca9efc42.entry.js +1 -0
  248. package/dist/ptcw-design/p-d56b953e.entry.js +1 -0
  249. package/dist/ptcw-design/{p-5e845a15.entry.js → p-d910c9d6.entry.js} +2 -2
  250. package/dist/ptcw-design/p-e3280772.entry.js +1 -0
  251. package/dist/ptcw-design/p-e34d194d.entry.js +1 -0
  252. package/dist/ptcw-design/p-e87bc2cd.entry.js +1 -0
  253. package/dist/ptcw-design/p-f2cb8bc4.entry.js +1 -0
  254. package/dist/ptcw-design/p-f9694131.entry.js +1 -0
  255. package/dist/ptcw-design/p-fbd43055.entry.js +1 -0
  256. package/dist/ptcw-design/ptcw-design.esm.js +1 -1
  257. package/dist/types/components/dropdown-item/dropdown-item.d.ts +5 -5
  258. package/dist/types/components/icon-asset/icon-asset.d.ts +40 -40
  259. package/dist/types/components/list-item/list-item.d.ts +8 -8
  260. package/dist/types/components/my-component/my-component.d.ts +16 -16
  261. package/dist/types/components/ptc-accordion/ptc-accordion-item/ptc-accordion-item.d.ts +59 -59
  262. package/dist/types/components/ptc-accordion/ptc-accordion.d.ts +13 -13
  263. package/dist/types/components/ptc-announcement/ptc-announcement.d.ts +51 -43
  264. package/dist/types/components/ptc-breadcrumb/ptc-breadcrumb.d.ts +4 -4
  265. package/dist/types/components/ptc-button/ptc-button.d.ts +56 -56
  266. package/dist/types/components/ptc-card/ptc-card.d.ts +62 -62
  267. package/dist/types/components/ptc-card-bottom/ptc-card-bottom.d.ts +15 -15
  268. package/dist/types/components/ptc-card-content/ptc-card-content.d.ts +15 -15
  269. package/dist/types/components/ptc-card-plm/ptc-card-plm.d.ts +8 -8
  270. package/dist/types/components/ptc-checkbox/ptc-checkbox.d.ts +11 -11
  271. package/dist/types/components/ptc-collapse-list/ptc-collapse-list.d.ts +56 -56
  272. package/dist/types/components/ptc-container/ptc-container.d.ts +12 -12
  273. package/dist/types/components/ptc-date/ptc-date.d.ts +41 -41
  274. package/dist/types/components/ptc-dropdown/ptc-dropdown.d.ts +19 -19
  275. package/dist/types/components/ptc-dynamic-card/ptc-dynamic-card.d.ts +24 -16
  276. package/dist/types/components/ptc-ellipsis-dropdown/ptc-ellipsis-dropdown.d.ts +12 -12
  277. package/dist/types/components/ptc-filter-tag/ptc-filter-tag.d.ts +17 -17
  278. package/dist/types/components/ptc-hero/ptc-hero.d.ts +12 -12
  279. package/dist/types/components/ptc-hero-footer-cta/ptc-hero-footer-cta.d.ts +6 -6
  280. package/dist/types/components/ptc-icon-list/ptc-icon-list.d.ts +21 -21
  281. package/dist/types/components/ptc-icon-minimize/ptc-icon-minimize.d.ts +9 -9
  282. package/dist/types/components/ptc-img/ptc-img.d.ts +51 -51
  283. package/dist/types/components/ptc-link/ptc-link.d.ts +36 -36
  284. package/dist/types/components/ptc-list/ptc-list.d.ts +8 -8
  285. package/dist/types/components/ptc-lottie/ptc-lottie.d.ts +12 -12
  286. package/dist/types/components/ptc-minimized-footer/ptc-minimized-footer.d.ts +3 -3
  287. package/dist/types/components/ptc-minimized-header/ptc-minimized-header.d.ts +6 -6
  288. package/dist/types/components/ptc-mobile-select/ptc-mobile-select.d.ts +40 -40
  289. package/dist/types/components/ptc-modal/ptc-modal.d.ts +59 -59
  290. package/dist/types/components/ptc-overlay/ptc-overlay.d.ts +20 -20
  291. package/dist/types/components/ptc-pagenation/ptc-pagenation.d.ts +27 -27
  292. package/dist/types/components/ptc-para/ptc-para.d.ts +34 -34
  293. package/dist/types/components/ptc-picture/ptc-picture.d.ts +93 -93
  294. package/dist/types/components/ptc-previous-url/ptc-previous-url.d.ts +5 -5
  295. package/dist/types/components/ptc-pricing-block/ptc-pricing-block.d.ts +5 -5
  296. package/dist/types/components/ptc-quote/ptc-quote.d.ts +29 -29
  297. package/dist/types/components/ptc-readmore/ptc-readmore.d.ts +27 -0
  298. package/dist/types/components/ptc-responsive-wrapper/ptc-responsive-wrapper.d.ts +8 -8
  299. package/dist/types/components/ptc-shopping-cart/ptc-shopping-cart.d.ts +6 -6
  300. package/dist/types/components/ptc-social-share/ptc-social-share.d.ts +25 -25
  301. package/dist/types/components/ptc-spacer/ptc-spacer.d.ts +16 -16
  302. package/dist/types/components/ptc-span/ptc-span.d.ts +16 -16
  303. package/dist/types/components/ptc-svg-btn/ptc-svg-btn.d.ts +12 -12
  304. package/dist/types/components/ptc-tab-list/ptc-tab-list.d.ts +15 -15
  305. package/dist/types/components/ptc-text-copy-with-background/ptc-text-copy-with-background.d.ts +25 -25
  306. package/dist/types/components/ptc-title/ptc-title.d.ts +50 -50
  307. package/dist/types/components/ptc-tooltip/ptc-tooltip.d.ts +34 -0
  308. package/dist/types/components/ptc-two-column-media/ptc-two-column-media.d.ts +9 -9
  309. package/dist/types/components/tab-content/tab-content.d.ts +12 -12
  310. package/dist/types/components/tab-header/tab-header.d.ts +13 -13
  311. package/dist/types/components.d.ts +230 -149
  312. package/dist/types/global.d.ts +1072 -1072
  313. package/dist/types/index.d.ts +1 -1
  314. package/dist/types/stencil-public-runtime.d.ts +20 -4
  315. package/dist/types/utils/component.d.ts +1 -1
  316. package/dist/types/utils/interfaces.d.ts +31 -31
  317. package/dist/types/utils/utils.d.ts +4 -4
  318. package/loader/package.json +1 -0
  319. package/package.json +61 -59
  320. package/readme.md +11 -11
  321. package/dist/cjs/ptc-nav-item.cjs.entry.js +0 -94
  322. package/dist/cjs/ptc-nav.cjs.entry.js +0 -19
  323. package/dist/collection/components/ptc-nav/ptc-nav.css +0 -29
  324. package/dist/collection/components/ptc-nav/ptc-nav.js +0 -21
  325. package/dist/collection/components/ptc-nav-item/ptc-nav-item.css +0 -81
  326. package/dist/collection/components/ptc-nav-item/ptc-nav-item.js +0 -252
  327. package/dist/esm/ptc-nav-item.entry.js +0 -90
  328. package/dist/esm/ptc-nav.entry.js +0 -15
  329. package/dist/ptcw-design/p-09351f78.entry.js +0 -1
  330. package/dist/ptcw-design/p-10385027.entry.js +0 -1
  331. package/dist/ptcw-design/p-10f6d8ae.entry.js +0 -1
  332. package/dist/ptcw-design/p-15ec8469.entry.js +0 -1
  333. package/dist/ptcw-design/p-1a77a824.entry.js +0 -1
  334. package/dist/ptcw-design/p-1ec512ea.entry.js +0 -1
  335. package/dist/ptcw-design/p-21a381bd.entry.js +0 -1
  336. package/dist/ptcw-design/p-39b8d25b.entry.js +0 -1
  337. package/dist/ptcw-design/p-3a4bb2b1.entry.js +0 -1
  338. package/dist/ptcw-design/p-3b994b78.entry.js +0 -1
  339. package/dist/ptcw-design/p-4355ed7c.js +0 -1
  340. package/dist/ptcw-design/p-446423fc.entry.js +0 -1
  341. package/dist/ptcw-design/p-4ab335ac.entry.js +0 -1
  342. package/dist/ptcw-design/p-4da25d67.entry.js +0 -1
  343. package/dist/ptcw-design/p-53790fb4.entry.js +0 -1
  344. package/dist/ptcw-design/p-5bf5932c.entry.js +0 -1
  345. package/dist/ptcw-design/p-5c02f876.entry.js +0 -1
  346. package/dist/ptcw-design/p-5c5c8f25.entry.js +0 -1
  347. package/dist/ptcw-design/p-5fd37a0e.entry.js +0 -1
  348. package/dist/ptcw-design/p-5fd60b15.entry.js +0 -1
  349. package/dist/ptcw-design/p-6ab5aee9.entry.js +0 -1
  350. package/dist/ptcw-design/p-70d2c46d.entry.js +0 -1
  351. package/dist/ptcw-design/p-74a31734.entry.js +0 -1
  352. package/dist/ptcw-design/p-7a37d762.entry.js +0 -1
  353. package/dist/ptcw-design/p-83a9720c.entry.js +0 -1
  354. package/dist/ptcw-design/p-85e7bbc3.entry.js +0 -1
  355. package/dist/ptcw-design/p-8ba6cef7.entry.js +0 -1
  356. package/dist/ptcw-design/p-8c0ba2d5.entry.js +0 -1
  357. package/dist/ptcw-design/p-8c594b35.entry.js +0 -1
  358. package/dist/ptcw-design/p-8d46a06e.entry.js +0 -1
  359. package/dist/ptcw-design/p-8e2e81c8.entry.js +0 -1
  360. package/dist/ptcw-design/p-96bfb95b.entry.js +0 -1
  361. package/dist/ptcw-design/p-b1bfc20f.entry.js +0 -1
  362. package/dist/ptcw-design/p-baa7d351.entry.js +0 -1
  363. package/dist/ptcw-design/p-bb4485e3.entry.js +0 -1
  364. package/dist/ptcw-design/p-bcfd05dc.entry.js +0 -1
  365. package/dist/ptcw-design/p-be32e928.entry.js +0 -1
  366. package/dist/ptcw-design/p-c05f0c98.entry.js +0 -1
  367. package/dist/ptcw-design/p-c267b720.entry.js +0 -1
  368. package/dist/ptcw-design/p-c26e343e.entry.js +0 -1
  369. package/dist/ptcw-design/p-c460a62d.entry.js +0 -1
  370. package/dist/ptcw-design/p-c91a875b.entry.js +0 -1
  371. package/dist/ptcw-design/p-cd2404f0.entry.js +0 -1
  372. package/dist/ptcw-design/p-ce5ee58d.entry.js +0 -1
  373. package/dist/ptcw-design/p-d39668ca.entry.js +0 -1
  374. package/dist/ptcw-design/p-e955c833.entry.js +0 -1
  375. package/dist/ptcw-design/p-f0cd0fb4.entry.js +0 -1
  376. package/dist/ptcw-design/p-f7d18b93.entry.js +0 -1
  377. package/dist/ptcw-design/p-fce72f70.entry.js +0 -1
  378. package/dist/types/components/ptc-nav/ptc-nav.d.ts +0 -3
  379. package/dist/types/components/ptc-nav-item/ptc-nav-item.d.ts +0 -53
  380. /package/dist/ptcw-design/{p-5e98555a.js → p-e121ff2a.js} +0 -0
@@ -1,563 +1,455 @@
1
- import { r as registerInstance, h, H as Host, g as getElement } from './index-5ff11327.js';
1
+ import { r as registerInstance, h, H as Host, g as getElement } from './index-0c73b51e.js';
2
2
 
3
- const ptcCardCss = ":host{display:block}:host(.lottie-card) .card-border{box-shadow:var(--ptc-shadow-small);border:1px solid var(--color-gray-03);border-radius:10px;position:relative;overflow:hidden}:host(.lottie-card) .card-border::after{content:\"\";height:40%;width:4px;position:absolute;top:30%;right:-2px;background-color:var(--color-green-06);z-index:2;display:block}:host(.lottie-card) .card-border:hover{box-shadow:var(--ptc-shadow-x-large)}:host(.lottie-card) .card-border:hover .card-body h3{border-bottom:2px solid var(--color-green-07)}:host(.lottie-card) .card-layout{display:block}@media only screen and (min-width: 768px){:host(.lottie-card) .card-layout{display:flex;flex-flow:nowrap row;justify-content:center}}:host(.lottie-card) .link-wrapper{outline:none;text-decoration:none}:host(.lottie-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.lottie-card) .card-media{flex-basis:40%;border-right:1px solid var(--color-gray-03);display:flex}:host(.lottie-card) .card-body{flex-basis:60%;align-self:center;padding:0 30px 10px}:host(.lottie-card) .card-body h3{display:inline-block;line-height:var(--ptc-line-height-densest);color:var(--color-gray-10);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-x-small);border-bottom:2px solid transparent;margin-bottom:var(--ptc-element-spacing-02)}:host(.simple-card) .card-layout{display:block}:host(.simple-card) .link-wrapper{outline:none;text-decoration:none}:host(.simple-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.simple-card) .link-wrapper:hover .card-body h3::before{width:100%}:host(.simple-card) .link-wrapper:hover ::slotted([slot=slot-after-heading]){margin-left:var(--ptc-element-spacing-04)}:host(.simple-card) .card-body h3{color:var(--color-gray-10);font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-black);line-height:var(--ptc-line-height-dense);position:relative;margin-bottom:var(--ptc-element-spacing-02);display:inline-block}:host(.simple-card) .card-body h3::before{display:block;position:absolute;content:\"\";width:var(--ptc-element-spacing-07);border-bottom:2px solid var(--color-green-06);bottom:1px;transition:width var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.simple-card) ::slotted([slot=slot-after-heading]){margin-left:var(--ptc-element-spacing-01);transition:margin-left var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) .card-border{overflow:hidden;filter:drop-shadow(rgba(0, 0, 0, 0.32) 0px 3px 6px);width:100%}:host(.clip-edge-card) .card-border:hover{filter:drop-shadow(rgba(0, 0, 0, 0.32) 0px 6px 12px)}:host(.clip-edge-card) .card-layout{display:block}:host(.clip-edge-card) .link-wrapper{outline:none;text-decoration:none}:host(.clip-edge-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.clip-edge-card) .card-media{position:relative;width:100%;height:124px;overflow:hidden;border-radius:var(--ptc-border-radius-standard)}:host(.clip-edge-card) .card-body{transform:translateY(calc((-1) * var(--ptc-element-spacing-04)));overflow:hidden;width:calc(95% - var(--ptc-element-spacing-04) - var(--ptc-element-spacing-04));font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-medium);line-height:var(--ptc-line-height-dense);color:var(--color-gray-10);clip-path:var(--ptc-clip-path-bottom-right);background-color:var(--color-white);border-radius:var(--ptc-border-radius-standard);padding:var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-03) var(--ptc-element-spacing-04)}:host(.clip-edge-card) .card-body h3{display:inline-block;margin:0px;font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-bold);line-height:var(--ptc-line-height-dense);color:var(--color-gray-10);text-decoration:none;border-bottom:2px solid transparent;transition:border-bottom var(--ptc-transition-medium) var(--ptc-ease-inout), margin var(--ptc-transition-medium) var(--ptc-ease-inout);margin:var(--ptc-element-spacing-03) 0 var(--ptc-element-spacing-03) 0}:host(.clip-edge-card) ::slotted([slot=slot-description]){height:0;opacity:0;transition:height var(--ptc-transition-medium) var(--ptc-ease-inout), opacity var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) ::slotted([slot=slot-image]){display:block;width:100%;height:100%;transform:scale(1);transition:transform var(--ptc-transition-medium) var(--ptc-ease-inout);transform-origin:top center}:host(.clip-edge-card) ::slotted([slot=slot-after-heading]){position:absolute;top:var(--ptc-element-spacing-03);left:var(--ptc-element-spacing-04);opacity:1;transform:scale(1);height:44px;transform-origin:bottom center;transition:opacity var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) ::slotted([slot=slot-before-heading]){display:block;opacity:0;height:24px;transition:all var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) .link-wrapper:hover .card-body h3{border-bottom:2px solid var(--color-green-06)}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:60px;opacity:1}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-image]){transform:scale(1.1)}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-after-heading]){opacity:0;transform:scale(0);height:0}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-before-heading]){opacity:1}:host(.hightlight-card) .card-border{width:100%;border-radius:var(--ptc-border-radius-standard);overflow:hidden}:host(.hightlight-card) .card-border:hover .card-media{transform:scale(1.1)}:host(.hightlight-card) .card-layout{display:block;position:relative}:host(.hightlight-card) .link-wrapper{outline:none;text-decoration:none}:host(.hightlight-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:96px;opacity:1}@media only screen and (min-width: 768px){:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:var(--ptc-layout-spacing-05)}}@media only screen and (min-width: 992px){:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:var(--ptc-layout-spacing-06)}}@media only screen and (min-width: 1440px){:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:var(--ptc-layout-spacing-05)}}:host(.hightlight-card) .card-media{width:100%;height:auto;min-height:450px;position:relative;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-ease-inout);transition-delay:var(--ptc-delay-5)}:host(.hightlight-card) .card-body{position:absolute;bottom:0;top:auto;left:0;right:auto;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-07);background-color:var(--color-white);box-sizing:border-box}:host(.hightlight-card) .card-body h3{font-size:var(--ptc-font-size-x-large);line-height:var(--ptc-line-height-densest);font-weight:var(--ptc-font-weight-bold);color:var(--color-gray-10);margin:var(--ptc-element-spacing-04) 0}:host(.hightlight-card) ::slotted([slot=slot-description]){height:0;opacity:0;transition:height var(--ptc-transition-medium) var(--ptc-ease-inout), opacity var(--ptc-transition-fast) var(--ptc-ease-inout);transition-delay:var(--ptc-delay-5)}:host(.horizontal-card){margin-bottom:var(--ptc-layout-spacing-02)}:host(.horizontal-card) .card-layout{position:relative}@media only screen and (min-width: 768px){:host(.horizontal-card) .card-layout{display:grid;grid-template-columns:42% 58%;direction:ltr;grid-auto-rows:1fr}}:host(.horizontal-card) .link-wrapper{outline:none;text-decoration:none;transition:var(--ptc-transition-slow) linear}:host(.horizontal-card) .link-wrapper:hover{box-shadow:var(--ptc-shadow-large);transition:var(--ptc-transition-slow) linear;background-color:var(--color-white)}:host(.horizontal-card) .link-wrapper:hover h3{border-color:var(--color-green-06);transition:var(--ptc-transition-slow) linear}:host(.horizontal-card) .card-media{display:flex;align-self:center}:host(.horizontal-card) .card-body{padding:var(--ptc-element-spacing-05) var(--ptc-element-spacing-04)}@media only screen and (min-width: 768px){:host(.horizontal-card) .card-body{padding:var(--ptc-element-spacing-06) var(--ptc-element-spacing-07)}}:host(.horizontal-card) .card-body h3{margin-top:0;font-size:var(--ptc-font-size-x-small);color:var(--color-gray-10);border-bottom:1px solid transparent;padding-bottom:var(--ptc-element-spacing-01);margin-bottom:var(--ptc-element-spacing-02);transition:var(--ptc-transition-slow) linear}:host(.horizontal-card) ::slotted([slot=slot-image]){box-shadow:var(--ptc-shadow-medium);width:100%}:host(.listing-card) .card-border{width:325px;overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;height:487px;display:flex;flex-direction:row;margin-bottom:0.5rem}:host(.listing-card) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.listing-card) .card-border:hover .card-media{background:var(--color-white)}:host(.listing-card) .card-border:hover .card-media .smart-img{background:var(--color-white)}@media (min-width: 480px){:host(.listing-card) .card-border{width:432px;height:487px}}@media (min-width: 768px){:host(.listing-card) .card-border{margin-left:4px;margin-right:4px;width:348px;height:456px}}@media (min-width: 992px){:host(.listing-card) .card-border{width:288px;height:440px}}@media (min-width: 1200px){:host(.listing-card) .card-border{width:260px;height:420px}}@media (min-width: 1440px){:host(.listing-card) .card-border{width:260px;height:420px}}:host(.listing-card) .card-layout{display:block;position:relative;width:100%;height:100%}:host(.listing-card) .link-wrapper{outline:none;text-decoration:none}:host(.listing-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.listing-card) .card-media{width:100%;height:288px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium)}:host(.listing-card) .card-media .smart-img{height:288px}@media (min-width: 768px){:host(.listing-card) .card-media .smart-img{height:232px}}@media (min-width: 992px){:host(.listing-card) .card-media .smart-img{height:192px}}@media (min-width: 1200px){:host(.listing-card) .card-media .smart-img{height:170px}}@media (min-width: 768px){:host(.listing-card) .card-media{height:232px}}@media (min-width: 992px){:host(.listing-card) .card-media{height:192px}}@media (min-width: 1200px){:host(.listing-card) .card-media{height:170px}}:host(.listing-card) .card-body{padding:16px 20px 0px 20px}:host(.listing-card) .card-body .card-date-text{display:flex;flex-direction:row}:host(.listing-card) .card-body .card-date-text p{font-size:var(--ptc-font-size-xx-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block;margin-top:0rem}:host(.listing-card) .card-body .small{font-size:var(--ptc-font-size-x-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block}:host(.listing-card) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin-bottom:14px;margin-top:0rem}:host(.listing-card) ::slotted([slot=slot-date]){font-weight:400;font-size:16px;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block}:host(.listing-card) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:39px}:host(.listing-card-horizontal) .card-border{width:325px;overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;height:220px}:host(.listing-card-horizontal) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.listing-card-horizontal) .card-border:hover .card-media{background:var(--color-white)}:host(.listing-card-horizontal) .card-border:hover .card-media .smart-img{background:var(--color-white)}@media (min-width: 480px){:host(.listing-card-horizontal) .card-border{width:432px;height:178px}}@media (min-width: 768px){:host(.listing-card-horizontal) .card-border{width:704px;height:184px}}@media (min-width: 992px){:host(.listing-card-horizontal) .card-border{width:688px;height:166px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-border{width:779px;height:170px}}:host(.listing-card-horizontal) .card-layout{display:flex;flex-direction:row;width:325px;height:220px}@media (min-width: 480px){:host(.listing-card-horizontal) .card-layout{width:432px;height:178px}}@media (min-width: 768px){:host(.listing-card-horizontal) .card-layout{width:704px;height:184px}}@media (min-width: 992px){:host(.listing-card-horizontal) .card-layout{width:688px;height:166px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-layout{width:779px;height:170px}}:host(.listing-card-horizontal) .link-wrapper{outline:none;text-decoration:none}:host(.listing-card-horizontal) .link-wrapper:hover{outline:none;text-decoration:none}:host(.listing-card-horizontal) .card-media{width:325px;height:224px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium);display:none}:host(.listing-card-horizontal) .card-media .smart-img{height:224px;width:325px}@media (min-width: 768px){:host(.listing-card-horizontal) .card-media .smart-img{width:275px;height:184px}}@media (min-width: 992px){:host(.listing-card-horizontal) .card-media .smart-img{width:224px;height:166px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-media .smart-img{width:260px;height:170px}}@media (min-width: 768px){:host(.listing-card-horizontal) .card-media{display:block;width:275px;height:184px}}@media (min-width: 992px){:host(.listing-card-horizontal) .card-media{width:224px;height:166px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-media{width:260px;height:170px}}:host(.listing-card-horizontal) .card-body{padding:16px 24px 0px 24px}@media only screen and (min-width: 768px){:host(.listing-card-horizontal) .card-body{width:505px}}@media only screen and (min-width: 1440px){:host(.listing-card-horizontal) .card-body{padding:24px 38px 0px 31px}}:host(.listing-card-horizontal) .card-body .card-date-text{display:flex;flex-direction:row}:host(.listing-card-horizontal) .card-body .card-date-text p{font-size:var(--ptc-font-size-xx-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:12px;display:inline-block;margin-top:0rem;margin-block-start:0rem}@media only screen and (min-width: 1200px){:host(.listing-card-horizontal) .card-body .card-date-text p{margin-bottom:20px}}@media only screen and (min-width: 1440px){:host(.listing-card-horizontal) .card-body .card-date-text p{margin-bottom:24px}}@media only screen and (min-width: 1600px){:host(.listing-card-horizontal) .card-body .card-date-text p{margin-bottom:32px}}:host(.listing-card-horizontal) .card-body .small{font-weight:400;font-size:16px;line-height:19px;color:#282F35;margin-bottom:12px;display:inline-block}@media (min-width: 992px){:host(.listing-card-horizontal) .card-body .small{margin-bottom:4px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-body .small{margin-bottom:8px}}:host(.listing-card-horizontal) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-x-small);line-height:19px;color:var(--color-gray-11);margin-bottom:8px;margin-top:0rem}@media (min-width: 768px){:host(.listing-card-horizontal) .card-body h3{margin-bottom:16px}}@media (min-width: 992px){:host(.listing-card-horizontal) .card-body h3{margin-bottom:12px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-body h3{margin-bottom:16px}}@media only screen and (min-width: 768px){:host(.listing-card-horizontal) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin-bottom:8px;margin-top:0rem}}:host(.listing-card-horizontal) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:19px;margin-top:0rem;margin-block-start:0rem}:host(.listing-card-horizontal) ::slotted([slot=slot-description]) p{margin-block-start:0rem}@media only screen and (min-width: 768px){:host(.listing-card-horizontal) ::slotted([slot=slot-description]){font-weight:400;font-size:14px;line-height:16px}}:host(.resource-center-card) .card-border{width:320px;overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;height:450px;display:flex;flex-direction:row;margin-bottom:1rem}:host(.resource-center-card) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.resource-center-card) .card-border:hover .card-media{background:var(--color-white)}:host(.resource-center-card) .card-border:hover .card-media .smart-img{background:var(--color-white)}@media only screen and (min-width: 768px){:host(.resource-center-card) .card-border{margin-left:4px;margin-right:4px}}:host(.resource-center-card) .card-layout{display:block;position:relative}:host(.resource-center-card) .card-layout .ribbon-text{position:absolute;top:0;left:0;margin-right:100px;margin-top:24px;background-color:var(--color-white);padding:4px 24px;max-width:80%;font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);color:var(--color-gray-11);border-radius:0px 3px 3px 0px;box-shadow:var(--ptc-shadow-small)}:host(.resource-center-card) .link-wrapper{outline:none;text-decoration:none}:host(.resource-center-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.resource-center-card) .card-media{width:100%;height:210px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium)}:host(.resource-center-card) .card-media .smart-img{height:210px}:host(.resource-center-card) .card-body{padding:32px 20px 0px 20px}:host(.resource-center-card) .card-body .small{font-size:var(--ptc-font-size-x-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:24px;display:inline-block}:host(.resource-center-card) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin-bottom:14px;margin-top:0rem}:host(.resource-center-card) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:39px}:host(.case-studies-card) .card-border{width:320px;overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;height:447px;display:flex;flex-direction:row;margin-bottom:1rem}:host(.case-studies-card) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.case-studies-card) .card-border:hover .card-media{background:var(--color-white)}:host(.case-studies-card) .card-border:hover .card-media .smart-img{background:var(--color-white)}@media only screen and (min-width: 768px){:host(.case-studies-card) .card-border{margin-left:4px;margin-right:4px}}:host(.case-studies-card) .card-layout{display:block;position:relative}:host(.case-studies-card) .link-wrapper{outline:none;text-decoration:none}:host(.case-studies-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.case-studies-card) .card-media{width:100%;height:200px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium)}:host(.case-studies-card) .card-media .smart-img{height:200px}:host(.case-studies-card) .card-body .card-logo-container{padding:8px 20px;border-bottom:1px solid #E4E7E9}:host(.case-studies-card) .card-body .card-logo-none{padding-top:16px}:host(.case-studies-card) .card-body .card-logo{max-width:280px;width:auto;height:40px;object-fit:cover;border:1px solid #E4E7E9;margin-bottom:8px}:host(.case-studies-card) .card-body .small{font-size:var(--ptc-font-size-x-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:24px;display:inline-block}:host(.case-studies-card) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin:8px 20px 12px 20px}:host(.case-studies-card) ::slotted([slot=slot-date]){font-weight:400;font-size:16px;line-height:19px;color:#282F35;margin-bottom:24px;display:inline-block}:host(.case-studies-card) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin:0px 20px 39px 20px}.ptc-h3.uppercase{text-transform:uppercase}.ptc-h3.capitalize{text-transform:capitalize}.ptc-h3.lowercase{text-transform:lowercase}.ptc-h3.none{text-transform:none}";
3
+ const ptcCardCss = ":host{display:block}:host(.lottie-card) .card-border{box-shadow:var(--ptc-shadow-small);border:1px solid var(--color-gray-03);border-radius:10px;position:relative;overflow:hidden}:host(.lottie-card) .card-border::after{content:\"\";height:40%;width:4px;position:absolute;top:30%;right:-2px;background-color:var(--color-green-06);z-index:2;display:block}:host(.lottie-card) .card-border:hover{box-shadow:var(--ptc-shadow-x-large)}:host(.lottie-card) .card-border:hover .card-body h3{border-bottom:2px solid var(--color-green-07)}:host(.lottie-card) .card-layout{display:block}@media only screen and (min-width: 768px){:host(.lottie-card) .card-layout{display:flex;flex-flow:nowrap row;justify-content:center}}:host(.lottie-card) .link-wrapper{outline:none;text-decoration:none}:host(.lottie-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.lottie-card) .card-media{flex-basis:40%;border-right:1px solid var(--color-gray-03);display:flex}:host(.lottie-card) .card-body{flex-basis:60%;align-self:center;padding:0 30px 10px}:host(.lottie-card) .card-body h3{display:inline-block;line-height:var(--ptc-line-height-densest);color:var(--color-gray-10);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-x-small);border-bottom:2px solid transparent;margin-bottom:var(--ptc-element-spacing-02)}:host(.simple-card) .card-layout{display:block}:host(.simple-card) .link-wrapper{outline:none;text-decoration:none}:host(.simple-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.simple-card) .link-wrapper:hover .card-body h3::before{width:100%}:host(.simple-card) .link-wrapper:hover ::slotted([slot=slot-after-heading]){margin-left:var(--ptc-element-spacing-04)}:host(.simple-card) .card-body h3{color:var(--color-gray-10);font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-black);line-height:var(--ptc-line-height-dense);position:relative;margin-bottom:var(--ptc-element-spacing-02);display:inline-block}:host(.simple-card) .card-body h3::before{display:block;position:absolute;content:\"\";width:var(--ptc-element-spacing-07);border-bottom:2px solid var(--color-green-06);bottom:1px;transition:width var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.simple-card) ::slotted([slot=slot-after-heading]){margin-left:var(--ptc-element-spacing-01);transition:margin-left var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) .card-border{overflow:hidden;filter:drop-shadow(rgba(0, 0, 0, 0.32) 0px 3px 6px);width:100%}:host(.clip-edge-card) .card-border:hover{filter:drop-shadow(rgba(0, 0, 0, 0.32) 0px 6px 12px)}:host(.clip-edge-card) .card-layout{display:block}:host(.clip-edge-card) .link-wrapper{outline:none;text-decoration:none}:host(.clip-edge-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.clip-edge-card) .card-media{position:relative;width:100%;height:124px;overflow:hidden;border-radius:var(--ptc-border-radius-standard)}:host(.clip-edge-card) .card-body{transform:translateY(calc((-1) * var(--ptc-element-spacing-04)));overflow:hidden;width:calc(95% - var(--ptc-element-spacing-04) - var(--ptc-element-spacing-04));font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-medium);line-height:var(--ptc-line-height-dense);color:var(--color-gray-10);clip-path:var(--ptc-clip-path-bottom-right);background-color:var(--color-white);border-radius:var(--ptc-border-radius-standard);padding:var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-03) var(--ptc-element-spacing-04)}:host(.clip-edge-card) .card-body h3{display:inline-block;margin:0px;font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-bold);line-height:var(--ptc-line-height-dense);color:var(--color-gray-10);text-decoration:none;border-bottom:2px solid transparent;transition:border-bottom var(--ptc-transition-medium) var(--ptc-ease-inout), margin var(--ptc-transition-medium) var(--ptc-ease-inout);margin:var(--ptc-element-spacing-03) 0 var(--ptc-element-spacing-03) 0}:host(.clip-edge-card) ::slotted([slot=slot-description]){height:0;opacity:0;transition:height var(--ptc-transition-medium) var(--ptc-ease-inout), opacity var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) ::slotted([slot=slot-image]){display:block;width:100%;height:100%;transform:scale(1);transition:transform var(--ptc-transition-medium) var(--ptc-ease-inout);transform-origin:top center}:host(.clip-edge-card) ::slotted([slot=slot-after-heading]){position:absolute;top:var(--ptc-element-spacing-03);left:var(--ptc-element-spacing-04);opacity:1;transform:scale(1);height:44px;transform-origin:bottom center;transition:opacity var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) ::slotted([slot=slot-before-heading]){display:block;opacity:0;height:24px;transition:all var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) .link-wrapper:hover .card-body h3{border-bottom:2px solid var(--color-green-06)}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:60px;opacity:1}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-image]){transform:scale(1.1)}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-after-heading]){opacity:0;transform:scale(0);height:0}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-before-heading]){opacity:1}:host(.hightlight-card) .card-border{width:100%;border-radius:var(--ptc-border-radius-standard);overflow:hidden}:host(.hightlight-card) .card-border:hover .card-media{transform:scale(1.1)}:host(.hightlight-card) .card-layout{display:block;position:relative}:host(.hightlight-card) .link-wrapper{outline:none;text-decoration:none}:host(.hightlight-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:96px;opacity:1}@media only screen and (min-width: 768px){:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:var(--ptc-layout-spacing-05)}}@media only screen and (min-width: 992px){:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:var(--ptc-layout-spacing-06)}}@media only screen and (min-width: 1440px){:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:var(--ptc-layout-spacing-05)}}:host(.hightlight-card) .card-media{width:100%;height:auto;min-height:450px;position:relative;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-ease-inout);transition-delay:var(--ptc-delay-5)}:host(.hightlight-card) .card-body{position:absolute;bottom:0;top:auto;left:0;right:auto;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-07);background-color:var(--color-white);box-sizing:border-box}:host(.hightlight-card) .card-body h3{font-size:var(--ptc-font-size-x-large);line-height:var(--ptc-line-height-densest);font-weight:var(--ptc-font-weight-bold);color:var(--color-gray-10);margin:var(--ptc-element-spacing-04) 0}:host(.hightlight-card) ::slotted([slot=slot-description]){height:0;opacity:0;transition:height var(--ptc-transition-medium) var(--ptc-ease-inout), opacity var(--ptc-transition-fast) var(--ptc-ease-inout);transition-delay:var(--ptc-delay-5)}:host(.horizontal-card){margin-bottom:var(--ptc-layout-spacing-02)}:host(.horizontal-card) .card-layout{position:relative}@media only screen and (min-width: 768px){:host(.horizontal-card) .card-layout{display:grid;grid-template-columns:42% 58%;direction:ltr;grid-auto-rows:1fr}}:host(.horizontal-card) .link-wrapper{outline:none;text-decoration:none;transition:var(--ptc-transition-slow) linear}:host(.horizontal-card) .link-wrapper:hover{box-shadow:var(--ptc-shadow-large);transition:var(--ptc-transition-slow) linear;background-color:var(--color-white)}:host(.horizontal-card) .link-wrapper:hover h3{border-color:var(--color-green-06);transition:var(--ptc-transition-slow) linear}:host(.horizontal-card) .card-media{display:flex;align-self:center}:host(.horizontal-card) .card-body{padding:var(--ptc-element-spacing-05) var(--ptc-element-spacing-04)}@media only screen and (min-width: 768px){:host(.horizontal-card) .card-body{padding:var(--ptc-element-spacing-06) var(--ptc-element-spacing-07)}}:host(.horizontal-card) .card-body h3{margin-top:0;font-size:var(--ptc-font-size-x-small);color:var(--color-gray-10);border-bottom:1px solid transparent;padding-bottom:var(--ptc-element-spacing-01);margin-bottom:var(--ptc-element-spacing-02);transition:var(--ptc-transition-slow) linear}:host(.horizontal-card) ::slotted([slot=slot-image]){box-shadow:var(--ptc-shadow-medium);width:100%}:host(.listing-card) .card-border{width:325px;overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;height:487px;display:flex;flex-direction:row;margin-bottom:0.5rem}:host(.listing-card) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.listing-card) .card-border:hover .card-media{background:var(--color-white)}:host(.listing-card) .card-border:hover .card-media .smart-img{background:var(--color-white)}@media (min-width: 480px){:host(.listing-card) .card-border{width:432px;height:487px}}@media (min-width: 768px){:host(.listing-card) .card-border{margin-left:4px;margin-right:4px;width:348px;height:456px}}@media (min-width: 992px){:host(.listing-card) .card-border{width:288px;height:440px}}@media (min-width: 1200px){:host(.listing-card) .card-border{width:260px;height:420px}}@media (min-width: 1440px){:host(.listing-card) .card-border{width:260px;height:420px}}:host(.listing-card) .card-layout{display:block;position:relative;width:100%;height:100%}:host(.listing-card) .link-wrapper{outline:none;text-decoration:none}:host(.listing-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.listing-card) .card-media{width:100%;height:288px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium)}:host(.listing-card) .card-media .smart-img{height:288px}@media (min-width: 768px){:host(.listing-card) .card-media .smart-img{height:232px}}@media (min-width: 992px){:host(.listing-card) .card-media .smart-img{height:192px}}@media (min-width: 1200px){:host(.listing-card) .card-media .smart-img{height:170px}}@media (min-width: 768px){:host(.listing-card) .card-media{height:232px}}@media (min-width: 992px){:host(.listing-card) .card-media{height:192px}}@media (min-width: 1200px){:host(.listing-card) .card-media{height:170px}}:host(.listing-card) .card-body{padding:16px 20px 0px 20px}:host(.listing-card) .card-body .card-date-text{display:flex;flex-direction:row}:host(.listing-card) .card-body .card-date-text p{font-size:var(--ptc-font-size-xx-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block;margin-top:0rem}:host(.listing-card) .card-body .small{font-size:var(--ptc-font-size-x-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block}:host(.listing-card) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin-bottom:14px;margin-top:0rem}:host(.listing-card) ::slotted([slot=slot-date]){font-weight:400;font-size:16px;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block}:host(.listing-card) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:39px}:host(.listing-card-horizontal) .card-border{width:325px;overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;height:220px}:host(.listing-card-horizontal) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.listing-card-horizontal) .card-border:hover .card-media{background:var(--color-white)}:host(.listing-card-horizontal) .card-border:hover .card-media .smart-img{background:var(--color-white)}@media (min-width: 480px){:host(.listing-card-horizontal) .card-border{width:432px;height:178px}}@media (min-width: 768px){:host(.listing-card-horizontal) .card-border{width:704px;height:184px}}@media (min-width: 992px){:host(.listing-card-horizontal) .card-border{width:688px;height:166px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-border{width:779px;height:170px}}:host(.listing-card-horizontal) .card-layout{display:flex;flex-direction:row;width:325px;height:220px}@media (min-width: 480px){:host(.listing-card-horizontal) .card-layout{width:432px;height:178px}}@media (min-width: 768px){:host(.listing-card-horizontal) .card-layout{width:704px;height:184px}}@media (min-width: 992px){:host(.listing-card-horizontal) .card-layout{width:688px;height:166px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-layout{width:779px;height:170px}}:host(.listing-card-horizontal) .link-wrapper{outline:none;text-decoration:none}:host(.listing-card-horizontal) .link-wrapper:hover{outline:none;text-decoration:none}:host(.listing-card-horizontal) .card-media{width:325px;height:224px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium);display:none}:host(.listing-card-horizontal) .card-media .smart-img{height:224px;width:325px}@media (min-width: 768px){:host(.listing-card-horizontal) .card-media .smart-img{width:275px;height:184px}}@media (min-width: 992px){:host(.listing-card-horizontal) .card-media .smart-img{width:224px;height:166px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-media .smart-img{width:260px;height:170px}}@media (min-width: 768px){:host(.listing-card-horizontal) .card-media{display:block;width:275px;height:184px}}@media (min-width: 992px){:host(.listing-card-horizontal) .card-media{width:224px;height:166px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-media{width:260px;height:170px}}:host(.listing-card-horizontal) .card-body{padding:16px 24px 0px 24px}@media only screen and (min-width: 768px){:host(.listing-card-horizontal) .card-body{width:505px}}@media only screen and (min-width: 1440px){:host(.listing-card-horizontal) .card-body{padding:24px 38px 0px 31px}}:host(.listing-card-horizontal) .card-body .card-date-text{display:flex;flex-direction:row}:host(.listing-card-horizontal) .card-body .card-date-text p{font-size:var(--ptc-font-size-xx-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:12px;display:inline-block;margin-top:0rem;margin-block-start:0rem}@media only screen and (min-width: 1200px){:host(.listing-card-horizontal) .card-body .card-date-text p{margin-bottom:20px}}@media only screen and (min-width: 1440px){:host(.listing-card-horizontal) .card-body .card-date-text p{margin-bottom:24px}}@media only screen and (min-width: 1600px){:host(.listing-card-horizontal) .card-body .card-date-text p{margin-bottom:32px}}:host(.listing-card-horizontal) .card-body .small{font-weight:400;font-size:16px;line-height:19px;color:#282F35;margin-bottom:12px;display:inline-block}@media (min-width: 992px){:host(.listing-card-horizontal) .card-body .small{margin-bottom:4px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-body .small{margin-bottom:8px}}:host(.listing-card-horizontal) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-x-small);line-height:19px;color:var(--color-gray-11);margin-bottom:8px;margin-top:0rem}@media (min-width: 768px){:host(.listing-card-horizontal) .card-body h3{margin-bottom:16px}}@media (min-width: 992px){:host(.listing-card-horizontal) .card-body h3{margin-bottom:12px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-body h3{margin-bottom:16px}}@media only screen and (min-width: 768px){:host(.listing-card-horizontal) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin-bottom:8px;margin-top:0rem}}:host(.listing-card-horizontal) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:19px;margin-top:0rem;margin-block-start:0rem}:host(.listing-card-horizontal) ::slotted([slot=slot-description]) p{margin-block-start:0rem}@media only screen and (min-width: 768px){:host(.listing-card-horizontal) ::slotted([slot=slot-description]){font-weight:400;font-size:14px;line-height:16px}}:host(.resource-center-card) .card-border{width:325px;overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;height:442px;display:flex;flex-direction:row;margin-bottom:1rem}:host(.resource-center-card) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.resource-center-card) .card-border:hover .card-media{background:var(--color-white)}:host(.resource-center-card) .card-border:hover .card-media .smart-img{background:var(--color-white)}@media (min-width: 480px){:host(.resource-center-card) .card-border{width:433px;height:442px}}@media (min-width: 768px){:host(.resource-center-card) .card-border{width:336px;height:396px}}@media (min-width: 992px){:host(.resource-center-card) .card-border{width:287px;height:396px}}@media (min-width: 1200px){:host(.resource-center-card) .card-border{width:260px;height:396px}}@media (min-width: 1440px){:host(.resource-center-card) .card-border{width:260px;height:396px}}@media only screen and (min-width: 768px){:host(.resource-center-card) .card-border{margin-left:4px;margin-right:4px}}:host(.resource-center-card) .card-layout{display:block;position:relative}:host(.resource-center-card) .card-layout .ribbon-text{position:absolute;top:0;left:0;margin-right:100px;margin-top:24px;background-color:var(--color-white);padding:4px 24px;max-width:80%;font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);color:var(--color-gray-11);border-radius:0px 3px 3px 0px;box-shadow:var(--ptc-shadow-small)}:host(.resource-center-card) .link-wrapper{outline:none;text-decoration:none}:host(.resource-center-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.resource-center-card) .card-media{width:100%;height:250px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium)}:host(.resource-center-card) .card-media .smart-img{height:250px}@media (min-width: 480px){:host(.resource-center-card) .card-media .smart-img{height:285px}}@media (min-width: 768px){:host(.resource-center-card) .card-media .smart-img{height:221px}}@media (min-width: 992px){:host(.resource-center-card) .card-media .smart-img{height:189px}}@media (min-width: 1200px){:host(.resource-center-card) .card-media .smart-img{height:173px}}@media (min-width: 1440px){:host(.resource-center-card) .card-media .smart-img{height:173px}}@media (min-width: 480px){:host(.resource-center-card) .card-media{height:285px}}@media (min-width: 768px){:host(.resource-center-card) .card-media{height:221px}}@media (min-width: 992px){:host(.resource-center-card) .card-media{height:189px}}@media (min-width: 1200px){:host(.resource-center-card) .card-media{height:173px}}@media (min-width: 1440px){:host(.resource-center-card) .card-media{height:173px}}:host(.resource-center-card) .card-body{padding:14px 20px 0px 20px}:host(.resource-center-card) .card-body .small{font-size:var(--ptc-font-size-x-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:24px;display:inline-block}:host(.resource-center-card) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin-bottom:12px;margin-top:0rem}:host(.resource-center-card) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:39px}:host(.case-studies-card) .card-border{width:320px;overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;height:447px;display:flex;flex-direction:row;margin-bottom:1rem}:host(.case-studies-card) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.case-studies-card) .card-border:hover .card-media{background:var(--color-white)}:host(.case-studies-card) .card-border:hover .card-media .smart-img{background:var(--color-white)}@media (min-width: 480px){:host(.case-studies-card) .card-border{width:431px;height:536px}}@media (min-width: 768px){:host(.case-studies-card) .card-border{width:335px;height:452px}}@media (min-width: 992px){:host(.case-studies-card) .card-border{width:288px;height:452px}}@media (min-width: 1200px){:host(.case-studies-card) .card-border{width:260px;height:452px}}@media (min-width: 1440px){:host(.case-studies-card) .card-border{width:260px;height:452px}}@media only screen and (min-width: 768px){:host(.case-studies-card) .card-border{margin-left:4px;margin-right:4px}}:host(.case-studies-card) .card-layout{display:block;position:relative}:host(.case-studies-card) .link-wrapper{outline:none;text-decoration:none}:host(.case-studies-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.case-studies-card) .card-media{width:100%;height:200px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium)}:host(.case-studies-card) .card-media .smart-img{width:100%;height:200px}@media (min-width: 480px){:host(.case-studies-card) .card-media .smart-img{height:286px}}@media (min-width: 768px){:host(.case-studies-card) .card-media .smart-img{height:224px}}@media (min-width: 992px){:host(.case-studies-card) .card-media .smart-img{height:192px}}@media (min-width: 1200px){:host(.case-studies-card) .card-media .smart-img{height:173px}}@media (min-width: 1440px){:host(.case-studies-card) .card-media .smart-img{height:170px}}@media (min-width: 480px){:host(.case-studies-card) .card-media{height:286px}}@media (min-width: 768px){:host(.case-studies-card) .card-media{height:224px}}@media (min-width: 992px){:host(.case-studies-card) .card-media{height:192px}}@media (min-width: 1200px){:host(.case-studies-card) .card-media{height:173px}}@media (min-width: 1440px){:host(.case-studies-card) .card-media{height:170px}}:host(.case-studies-card) .card-body .card-logo-container{padding:8px 20px;border-bottom:1px solid #E4E7E9}:host(.case-studies-card) .card-body .card-logo-none{padding-top:16px}:host(.case-studies-card) .card-body .card-logo{max-width:280px;width:auto;height:40px;object-fit:cover;border:1px solid #E4E7E9;margin-bottom:8px}:host(.case-studies-card) .card-body .small{font-size:var(--ptc-font-size-x-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:24px;display:inline-block}:host(.case-studies-card) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin:8px 20px 12px 20px}:host(.case-studies-card) ::slotted([slot=slot-date]){font-weight:400;font-size:16px;line-height:19px;color:#282F35;margin-bottom:24px;display:inline-block}:host(.case-studies-card) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin:0px 20px 39px 20px}.ptc-h3.uppercase{text-transform:uppercase}.ptc-h3.capitalize{text-transform:capitalize}.ptc-h3.lowercase{text-transform:lowercase}.ptc-h3.none{text-transform:none}";
4
4
 
5
- let PtcCard = class {
6
- constructor(hostRef) {
7
- registerInstance(this, hostRef);
8
- /**
9
- * Card Type
10
- * Specify Card Type, default to simple card
11
- */
12
- this.cardType = 'custom-card';
13
- /**
14
- * Card Link URL (Optional)
15
- */
16
- this.cardHref = undefined;
17
- /**
18
- * (optional) Link card target
19
- * */
20
- this.target = '_self';
21
- /**
22
- * (optional) Link card rel
23
- * */
24
- this.rel = undefined;
25
- /**
26
- * If this card has Image
27
- */
28
- this.hasImage = false;
29
- /**
30
- * If this card has Video
31
- */
32
- this.hasVideo = false;
33
- /**
34
- * If this card has Lottie Image
35
- */
36
- this.hasLottie = false;
37
- /**
38
- * Card heading text transform
39
- */
40
- this.headingTransform = 'none';
41
- }
42
- render() {
43
- const Tag = !!this.cardHref ? 'a' : 'div';
44
- const classMap = this.getCssClassMap();
45
- return (h(Host, Object.assign({}, (!!this.cardType ? { class: this.cardType } : {})), this.styles && h("style", null, this.styles), h("div", { class: "card-border", part: "border-wrapper" }, h(Tag, Object.assign({ class: classMap, part: "card-layout" }, (!!this.cardHref ? { href: this.cardHref } : {}), (!!this.target && !!this.cardHref ? { target: this.target } : {}), (!!this.rel && !!this.cardHref ? { rel: this.rel } : {}), (!!this.ribbonText ? { rel: this.ribbonText } : {})), this.hasImage || this.hasLottie || this.hasVideo ? (h("div", { class: "card-media", part: "media-wrapper" }, this.getMediaSlot ? h("slot", { name: this.getMediaSlot() }) : null)) : null, !!this.ribbonText && this.cardType == 'resource-center-card' ? h("div", { class: "ribbon-text" }, `${this.ribbonText}`) : null, h("div", { class: "card-body", part: "body-wrapper" }, !!this.cardDate && (this.cardType === 'listing-card' || this.cardType === 'listing-card-horizontal') ?
46
- h("div", { class: "card-date-text" }, h("ptc-date", { "date-string": `${this.cardDate}` }), !!this.eventType ? h("p", null, "\u00A0\u00A0\u00A0|\u00A0\u00A0\u00A0", this.eventType) : null) : null, this.cardType === 'case-studies-card' ? Object.assign({}, !!this.cardLogo ? h("div", { class: "card-logo-container" }, h("ptc-picture", { alt: "", "object-fit": "cover", "max-width": "280", src: this.cardLogo, height: "40" })) : h("div", { class: "card-logo-none" })) : null, h("slot", { name: "slot-before-heading" }), !!this.heading
47
- ? [
48
- h("h3", { class: `ptc-h3 ${this.headingTransform}`, part: "card-heading" }, this.heading),
49
- h("slot", { name: "slot-after-heading" }),
50
- ]
51
- : null, h("slot", { name: "slot-description" }), !!this.cardDate && this.cardType !== 'listing-card' && this.cardType !== 'listing-card-horizontal' && this.cardType !== 'hightlight-card' ? h("ptc-date", { "date-string": `${this.cardDate}`, "date-styles": "span{color:#40434a;font-size:var(--ptc-font-size-x-small);margin-top:var(--ptc-element-spacing-06);display:inline-block;}" }) : null)))));
52
- }
53
- getCssClassMap() {
54
- return {
55
- ['card-layout']: true,
56
- ['link-wrapper']: !!this.cardType ? true : false,
57
- };
58
- }
59
- getMediaSlot() {
60
- if (this.hasLottie) {
61
- return 'slot-lottie';
62
- }
63
- else if (this.hasVideo) {
64
- return 'slot-video';
65
- }
66
- else if (this.hasImage) {
67
- return 'slot-image';
68
- }
69
- else {
70
- return null;
71
- }
72
- }
73
- };
5
+ const PtcCard = class {
6
+ constructor(hostRef) {
7
+ registerInstance(this, hostRef);
8
+ this.cardType = 'custom-card';
9
+ this.cardHref = undefined;
10
+ this.target = '_self';
11
+ this.rel = undefined;
12
+ this.hasImage = false;
13
+ this.hasVideo = false;
14
+ this.hasLottie = false;
15
+ this.heading = undefined;
16
+ this.headingTransform = 'none';
17
+ this.cardDate = undefined;
18
+ this.styles = undefined;
19
+ this.ribbonText = undefined;
20
+ this.eventType = undefined;
21
+ this.cardLogo = undefined;
22
+ }
23
+ render() {
24
+ const Tag = !!this.cardHref ? 'a' : 'div';
25
+ const classMap = this.getCssClassMap();
26
+ return (h(Host, Object.assign({}, (!!this.cardType ? { class: this.cardType } : {})), this.styles && h("style", null, this.styles), h("div", { class: "card-border", part: "border-wrapper" }, h(Tag, Object.assign({ class: classMap, part: "card-layout" }, (!!this.cardHref ? { href: this.cardHref } : {}), (!!this.target && !!this.cardHref ? { target: this.target } : {}), (!!this.rel && !!this.cardHref ? { rel: this.rel } : {}), (!!this.ribbonText ? { rel: this.ribbonText } : {})), this.hasImage || this.hasLottie || this.hasVideo ? (h("div", { class: "card-media", part: "media-wrapper" }, this.getMediaSlot ? h("slot", { name: this.getMediaSlot() }) : null)) : null, !!this.ribbonText && this.cardType == 'resource-center-card' ? h("div", { class: "ribbon-text" }, `${this.ribbonText}`) : null, h("div", { class: "card-body", part: "body-wrapper" }, !!this.cardDate && (this.cardType === 'listing-card' || this.cardType === 'listing-card-horizontal') ?
27
+ h("div", { class: "card-date-text" }, h("ptc-date", { "date-string": `${this.cardDate}` }), !!this.eventType ? h("p", null, "\u00A0\u00A0\u00A0|\u00A0\u00A0\u00A0", this.eventType) : null) : null, this.cardType === 'case-studies-card' ? Object.assign({}, !!this.cardLogo ? h("div", { class: "card-logo-container" }, h("ptc-picture", { alt: "", "object-fit": "cover", "max-width": "280", src: this.cardLogo, height: "40" })) : h("div", { class: "card-logo-none" })) : null, h("slot", { name: "slot-before-heading" }), !!this.heading
28
+ ? [
29
+ h("h3", { class: `ptc-h3 ${this.headingTransform}`, part: "card-heading" }, this.heading),
30
+ h("slot", { name: "slot-after-heading" }),
31
+ ]
32
+ : null, h("slot", { name: "slot-description" }), !!this.cardDate && this.cardType !== 'listing-card' && this.cardType !== 'listing-card-horizontal' && this.cardType !== 'hightlight-card' ? h("ptc-date", { "date-string": `${this.cardDate}`, "date-styles": "span{color:#40434a;font-size:var(--ptc-font-size-x-small);margin-top:var(--ptc-element-spacing-06);display:inline-block;}" }) : null)))));
33
+ }
34
+ getCssClassMap() {
35
+ return {
36
+ ['card-layout']: true,
37
+ ['link-wrapper']: !!this.cardType ? true : false,
38
+ };
39
+ }
40
+ getMediaSlot() {
41
+ if (this.hasLottie) {
42
+ return 'slot-lottie';
43
+ }
44
+ else if (this.hasVideo) {
45
+ return 'slot-video';
46
+ }
47
+ else if (this.hasImage) {
48
+ return 'slot-image';
49
+ }
50
+ else {
51
+ return null;
52
+ }
53
+ }
54
+ };
74
55
  PtcCard.style = ptcCardCss;
75
56
 
76
57
  const ptcDateCss = ":host{display:block}:host(.small) span{font-size:var(--ptc-font-size-xx-small)}:host(.medium) span{font-size:var(--ptc-font-size-x-small)}:host(.primary-grey){color:var(--color-primary-gray-new)}:host(.white) span{color:var(--color-white)}:host(.date-m-top){margin-top:var(--ptc-element-spacing-01)}";
77
58
 
78
- let PtcDate = class {
79
- constructor(hostRef) {
80
- registerInstance(this, hostRef);
81
- /**
82
- * Year
83
- */
84
- this.year = 1900;
85
- /**
86
- * Month
87
- * An integer between 1 (January) and 12 (December) representing the month.If omitted, defaults to 0.
88
- */
89
- this.month = 0;
90
- /**
91
- * Day
92
- * An integer between 1 and 31 representing the day of the month. If omitted, defaults to 1.
93
- */
94
- this.day = 1;
95
- /**
96
- * Country
97
- * examples: en-US, zh-CN, zh-TW, fr-FR, ja-JP, ru-RU, de-DE, ko-KR, it-IT, es-ES
98
- */
99
- this.country = 'en-US';
100
- /**
101
- * Date Font Size
102
- */
103
- this.dataSize = 'small';
104
- }
105
- render() {
106
- // const newDate = new Date(this.year, this.month, this.day);
107
- const classMap = this.getCssClassMap();
108
- return (h(Host, { class: classMap }, this.dateStyles && h("style", null, this.dateStyles), h("span", { part: "part-ptc-date" }, this.getDate().toLocaleDateString(this.country, { year: 'numeric', month: 'short', day: 'numeric' }))));
109
- }
110
- getCssClassMap() {
111
- return {
112
- [this.dateColor]: !!this.dateColor ? true : false,
113
- [this.dataSize]: !!this.dataSize ? true : false,
114
- };
115
- }
116
- getDate() {
117
- if (this.dateString) {
118
- let newDate = new Date(this.dateString.replace(/-/g, '/'));
119
- return newDate;
120
- }
121
- else {
122
- return new Date(this.year, this.month - 1, this.day);
123
- }
124
- }
125
- };
59
+ const PtcDate = class {
60
+ constructor(hostRef) {
61
+ registerInstance(this, hostRef);
62
+ this.year = 1900;
63
+ this.month = 0;
64
+ this.day = 1;
65
+ this.country = 'en-US';
66
+ this.dateString = undefined;
67
+ this.dateColor = undefined;
68
+ this.dateStyles = undefined;
69
+ this.dataSize = 'small';
70
+ }
71
+ render() {
72
+ // const newDate = new Date(this.year, this.month, this.day);
73
+ const classMap = this.getCssClassMap();
74
+ return (h(Host, { class: classMap }, this.dateStyles && h("style", null, this.dateStyles), h("span", { part: "part-ptc-date" }, this.getDate().toLocaleDateString(this.country, { year: 'numeric', month: 'short', day: 'numeric' }))));
75
+ }
76
+ getCssClassMap() {
77
+ return {
78
+ [this.dateColor]: !!this.dateColor ? true : false,
79
+ [this.dataSize]: !!this.dataSize ? true : false,
80
+ };
81
+ }
82
+ getDate() {
83
+ if (this.dateString) {
84
+ let newDate = new Date(this.dateString.replace(/-/g, '/'));
85
+ return newDate;
86
+ }
87
+ else {
88
+ return new Date(this.year, this.month - 1, this.day);
89
+ }
90
+ }
91
+ };
126
92
  PtcDate.style = ptcDateCss;
127
93
 
128
- let ResponsiveBgVariables = {
129
- envs: ['xs', 'sm', 'md', 'lg'],
130
- selector: '.ptc-img',
131
- interval: 250
132
- };
133
- let ResponsivePictureVariables = {
134
- envs: ['xs', 'sm', 'md', 'lg'],
135
- selector: '.ptc-picture',
136
- interval: 250
94
+ let ResponsiveBgVariables = {
95
+ envs: ['xs', 'sm', 'md', 'lg'],
96
+ selector: '.ptc-img',
97
+ interval: 250
98
+ };
99
+ let ResponsivePictureVariables = {
100
+ envs: ['xs', 'sm', 'md', 'lg'],
101
+ selector: '.ptc-picture',
102
+ interval: 250
137
103
  };
138
104
 
139
105
  const ptcImgCss = ".smart-bg{width:100%;height:100%;background-size:cover;background-repeat:no-repeat;background-position:50% 50%}.smart-img{position:absolute;display:block;width:100%;height:100%;top:0;left:0;background-size:cover;background-repeat:no-repeat;background-position:50% 50%}.radius-standard{border-radius:var(--ptc-border-radius-standard)}.radius-large{border-radius:var(--ptc-border-radius-large)}.lazy-bg{background-image:none !important;background-color:var(--color-gray-03)}@media only screen and (min-width: 768px){.hidden-xs{display:none !important}}@media (min-width: 768px) and (max-width: 991px){.hidden-sm{display:none !important}}@media (min-width: 992px) and (max-width: 1199px){.hidden-md{display:none !important}}@media only screen and (min-width: 768px){.hidden-lg{display:none !important}}";
140
106
 
141
- let PtcImg = class {
142
- constructor(hostRef) {
143
- registerInstance(this, hostRef);
144
- /**
145
- * Image size for smallest screen
146
- * <=767px
147
- */
148
- this.sizeXs = '510x340';
149
- /**
150
- * Image size for small screen
151
- * >=768px and <=991px
152
- */
153
- this.sizeSm = '1240x496';
154
- /**
155
- * Image size for medium screen
156
- * >=992px and <=1199px
157
- */
158
- this.sizeMd = '1366x500';
159
- /**
160
- * Image solution for large screen
161
- * >=1200px
162
- */
163
- this.sizeLg = '1920x1080';
164
- /**
165
- * Image type
166
- */
167
- this.imageType = 'smart-bg';
168
- /**
169
- * Image border shape
170
- */
171
- this.borderRadius = '';
172
- /**
173
- * Lazy loading option
174
- */
175
- this.loadMode = 'lazy-bg';
176
- }
177
- /**
178
- * Image Z Index
179
- */
180
- // @Prop() imageZIndex: 'z-index-auto' | 'z-index-n-2' | 'z-index-n-1' | 'z-index-p-1' | 'z-index-p-2' = 'z-index-auto';
181
- WindowResize() {
182
- this.setResponsiveBg();
183
- }
184
- render() {
185
- const classMap = this.getCssClassMap();
186
- return (h(Host, null, h("div", { class: classMap, "data-xs": `${this.imgUrl}:${this.sizeXs}`, "data-sm": `${this.imgUrl}:${this.sizeSm}`, "data-md": `${this.imgUrl}:${this.sizeMd}`, "data-lg": `${this.imgUrl}:${this.sizeLg}` }, this.imageType == 'smart-bg' ? h("slot", null) : null)));
187
- }
188
- componentDidLoad() {
189
- this.addIntersectionObserver();
190
- this.setResponsiveBg();
191
- }
192
- componentWillUpdate() {
193
- // console.log('componentWillUpdate!');
194
- this.addIntersectionObserver();
195
- this.setResponsiveBg();
196
- }
197
- //responsive image
198
- setResponsiveBg() {
199
- // Define local variables
200
- let backgrounds = (this.el || document).querySelectorAll(ResponsiveBgVariables.selector), el, elData, currentBreakpoint = this.getCurrentBreakPoints();
201
- // console.log('current breakpoint: ' + currentBreakpoint);
202
- // Loop through all target elements
203
- for (var i = 0, len = backgrounds.length; i < len; i++) {
204
- // Set current variables
205
- el = backgrounds[i];
206
- elData = el.getAttribute('data-' + currentBreakpoint);
207
- // If the data attribute exists, set the background
208
- if (elData !== null) {
209
- el.style.backgroundImage = "url('" + elData + "')";
210
- }
211
- else {
212
- if (typeof console == 'object') {
213
- console.warn('Data attribute: data-' + currentBreakpoint + ' not found on element:\n\n' + el.outerHTML + '\n\n\n');
214
- }
215
- }
216
- }
217
- }
218
- //lazy loading
219
- addIntersectionObserver() {
220
- if (!this.imgUrl) {
221
- console.log('no image!');
222
- return;
223
- }
224
- if ('IntersectionObserver' in window) {
225
- let lazyLoadBgs = (this.el || document).querySelectorAll('.lazy-bg');
226
- let bgObserver = new IntersectionObserver(entries => {
227
- entries.forEach(entry => {
228
- if (entry.isIntersecting) {
229
- const image = entry.target;
230
- image.classList.remove('lazy-bg');
231
- // console.log('loaded');
232
- bgObserver.unobserve(image);
233
- }
234
- });
235
- });
236
- lazyLoadBgs.forEach(image => {
237
- bgObserver.observe(image);
238
- });
239
- }
240
- }
241
- getCssClassMap() {
242
- return {
243
- [this.imageType]: true,
244
- 'ptc-img': true,
245
- [this.borderRadius]: true,
246
- [this.loadMode]: true,
247
- // [this.imageZIndex] : true
248
- };
249
- }
250
- getCurrentBreakPoints() {
251
- // Define local variables
252
- let doc = window.document, temp = doc.createElement('div'), env;
253
- // Append test node
254
- doc.body.appendChild(temp);
255
- // Loop through breakpoints
256
- for (let i = ResponsiveBgVariables.envs.length - 1; i >= 0; i--) {
257
- env = ResponsiveBgVariables.envs[i];
258
- // Add classes
259
- temp.className = 'hidden-' + env;
260
- // Found breakpoint
261
- if (temp.offsetParent === null) {
262
- // Remove our test node
263
- doc.body.removeChild(temp);
264
- // Return current breakpoint
265
- return env;
266
- }
267
- }
268
- // Breakpoint not found, try fallback
269
- doc.body.removeChild(temp);
270
- return this.getFallbackBreakpoint();
271
- }
272
- getFallbackBreakpoint() {
273
- if (window.matchMedia('(min-width: 992px)').matches) {
274
- return 'lg';
275
- }
276
- else if (window.matchMedia('(min-width: 768px)').matches) {
277
- return 'md';
278
- }
279
- else if (window.matchMedia('(min-width: 576px)').matches) {
280
- return 'sm';
281
- }
282
- else {
283
- return 'xs';
284
- }
285
- }
286
- get el() { return getElement(this); }
287
- };
107
+ const PtcImg = class {
108
+ constructor(hostRef) {
109
+ registerInstance(this, hostRef);
110
+ this.sizeXs = '510x340';
111
+ this.sizeSm = '1240x496';
112
+ this.sizeMd = '1366x500';
113
+ this.sizeLg = '1920x1080';
114
+ this.imgUrl = undefined;
115
+ this.imageType = 'smart-bg';
116
+ this.borderRadius = '';
117
+ this.loadMode = 'lazy-bg';
118
+ }
119
+ /**
120
+ * Image Z Index
121
+ */
122
+ // @Prop() imageZIndex: 'z-index-auto' | 'z-index-n-2' | 'z-index-n-1' | 'z-index-p-1' | 'z-index-p-2' = 'z-index-auto';
123
+ WindowResize() {
124
+ this.setResponsiveBg();
125
+ }
126
+ render() {
127
+ const classMap = this.getCssClassMap();
128
+ return (h(Host, null, h("div", { class: classMap, "data-xs": `${this.imgUrl}:${this.sizeXs}`, "data-sm": `${this.imgUrl}:${this.sizeSm}`, "data-md": `${this.imgUrl}:${this.sizeMd}`, "data-lg": `${this.imgUrl}:${this.sizeLg}` }, this.imageType == 'smart-bg' ? h("slot", null) : null)));
129
+ }
130
+ componentDidLoad() {
131
+ this.addIntersectionObserver();
132
+ this.setResponsiveBg();
133
+ }
134
+ componentWillUpdate() {
135
+ // console.log('componentWillUpdate!');
136
+ this.addIntersectionObserver();
137
+ this.setResponsiveBg();
138
+ }
139
+ //responsive image
140
+ setResponsiveBg() {
141
+ // Define local variables
142
+ let backgrounds = (this.el || document).querySelectorAll(ResponsiveBgVariables.selector), el, elData, currentBreakpoint = this.getCurrentBreakPoints();
143
+ // console.log('current breakpoint: ' + currentBreakpoint);
144
+ // Loop through all target elements
145
+ for (var i = 0, len = backgrounds.length; i < len; i++) {
146
+ // Set current variables
147
+ el = backgrounds[i];
148
+ elData = el.getAttribute('data-' + currentBreakpoint);
149
+ // If the data attribute exists, set the background
150
+ if (elData !== null) {
151
+ el.style.backgroundImage = "url('" + elData + "')";
152
+ }
153
+ else {
154
+ if (typeof console == 'object') {
155
+ console.warn('Data attribute: data-' + currentBreakpoint + ' not found on element:\n\n' + el.outerHTML + '\n\n\n');
156
+ }
157
+ }
158
+ }
159
+ }
160
+ //lazy loading
161
+ addIntersectionObserver() {
162
+ if (!this.imgUrl) {
163
+ console.log('no image!');
164
+ return;
165
+ }
166
+ if ('IntersectionObserver' in window) {
167
+ let lazyLoadBgs = (this.el || document).querySelectorAll('.lazy-bg');
168
+ let bgObserver = new IntersectionObserver(entries => {
169
+ entries.forEach(entry => {
170
+ if (entry.isIntersecting) {
171
+ const image = entry.target;
172
+ image.classList.remove('lazy-bg');
173
+ // console.log('loaded');
174
+ bgObserver.unobserve(image);
175
+ }
176
+ });
177
+ });
178
+ lazyLoadBgs.forEach(image => {
179
+ bgObserver.observe(image);
180
+ });
181
+ }
182
+ }
183
+ getCssClassMap() {
184
+ return {
185
+ [this.imageType]: true,
186
+ 'ptc-img': true,
187
+ [this.borderRadius]: true,
188
+ [this.loadMode]: true,
189
+ // [this.imageZIndex] : true
190
+ };
191
+ }
192
+ getCurrentBreakPoints() {
193
+ // Define local variables
194
+ let doc = window.document, temp = doc.createElement('div'), env;
195
+ // Append test node
196
+ doc.body.appendChild(temp);
197
+ // Loop through breakpoints
198
+ for (let i = ResponsiveBgVariables.envs.length - 1; i >= 0; i--) {
199
+ env = ResponsiveBgVariables.envs[i];
200
+ // Add classes
201
+ temp.className = 'hidden-' + env;
202
+ // Found breakpoint
203
+ if (temp.offsetParent === null) {
204
+ // Remove our test node
205
+ doc.body.removeChild(temp);
206
+ // Return current breakpoint
207
+ return env;
208
+ }
209
+ }
210
+ // Breakpoint not found, try fallback
211
+ doc.body.removeChild(temp);
212
+ return this.getFallbackBreakpoint();
213
+ }
214
+ getFallbackBreakpoint() {
215
+ if (window.matchMedia('(min-width: 992px)').matches) {
216
+ return 'lg';
217
+ }
218
+ else if (window.matchMedia('(min-width: 768px)').matches) {
219
+ return 'md';
220
+ }
221
+ else if (window.matchMedia('(min-width: 576px)').matches) {
222
+ return 'sm';
223
+ }
224
+ else {
225
+ return 'xs';
226
+ }
227
+ }
228
+ get el() { return getElement(this); }
229
+ };
288
230
  PtcImg.style = ptcImgCss;
289
231
 
290
232
  const ptcParaCss = ":host{z-index:1}:host(.white){color:var(--color-white)}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-p{line-height:var(--ptc-line-height-p)}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)}p.ellipsis-boxing{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;overflow-wrap:break-word}";
291
233
 
292
- let PtcPara = class {
293
- constructor(hostRef) {
294
- registerInstance(this, hostRef);
295
- /**
296
- * Paragraph font size
297
- **/
298
- this.fontSize = "x-small";
299
- /**
300
- * Paragraph font weight
301
- **/
302
- this.fontWeight = 'w-4';
303
- /**
304
- * Paragraph Style
305
- **/
306
- this.paraStyle = 'default';
307
- /**
308
- * Paragraph Color
309
- */
310
- this.paraColor = 'primary-grey';
311
- /**
312
- * line height
313
- */
314
- this.paraLineH = 'line-height-normal';
315
- }
316
- render() {
317
- const classMap = this.getCssClassMap();
318
- const colorClass = this.addWhiteClass();
319
- const cutOff = this.getLineCuttoff();
320
- return (h(Host, { class: colorClass }, h("p", { class: classMap, part: "part-para", style: cutOff }, h("slot", null))));
321
- }
322
- getCssClassMap() {
323
- return {
324
- [this.fontSize]: true,
325
- [this.fontWeight]: true,
326
- [this.paraStyle]: true,
327
- [this.paraMargin]: !!this.paraMargin ? true : false,
328
- [this.paraColor]: true,
329
- [this.paraLineH]: true,
330
- ['ellipsis-boxing']: this.ellipsisLineCutoff && this.ellipsisLineCutoff > 0
331
- };
332
- }
333
- //WEB-2392
334
- addWhiteClass() {
335
- if (this.paraColor == "white") {
336
- return {
337
- [this.paraColor]: true,
338
- };
339
- }
340
- }
341
- getLineCuttoff() {
342
- let result;
343
- if (this.ellipsisLineCutoff && this.ellipsisLineCutoff > 0) {
344
- result = {
345
- ['-webkit-line-clamp']: `${this.ellipsisLineCutoff}`
346
- };
347
- }
348
- return result;
349
- }
350
- };
234
+ const PtcPara = class {
235
+ constructor(hostRef) {
236
+ registerInstance(this, hostRef);
237
+ this.fontSize = "x-small";
238
+ this.fontWeight = 'w-4';
239
+ this.paraStyle = 'default';
240
+ this.paraColor = 'primary-grey';
241
+ this.paraLineH = 'line-height-normal';
242
+ this.paraMargin = undefined;
243
+ this.ellipsisLineCutoff = undefined;
244
+ }
245
+ render() {
246
+ const classMap = this.getCssClassMap();
247
+ const colorClass = this.addWhiteClass();
248
+ const cutOff = this.getLineCuttoff();
249
+ return (h(Host, { class: colorClass }, h("p", { class: classMap, part: "part-para", style: cutOff }, h("slot", null))));
250
+ }
251
+ getCssClassMap() {
252
+ return {
253
+ [this.fontSize]: true,
254
+ [this.fontWeight]: true,
255
+ [this.paraStyle]: true,
256
+ [this.paraMargin]: !!this.paraMargin ? true : false,
257
+ [this.paraColor]: true,
258
+ [this.paraLineH]: true,
259
+ ['ellipsis-boxing']: this.ellipsisLineCutoff && this.ellipsisLineCutoff > 0
260
+ };
261
+ }
262
+ //WEB-2392
263
+ addWhiteClass() {
264
+ if (this.paraColor == "white") {
265
+ return {
266
+ [this.paraColor]: true,
267
+ };
268
+ }
269
+ }
270
+ getLineCuttoff() {
271
+ let result;
272
+ if (this.ellipsisLineCutoff && this.ellipsisLineCutoff > 0) {
273
+ result = {
274
+ ['-webkit-line-clamp']: `${this.ellipsisLineCutoff}`
275
+ };
276
+ }
277
+ return result;
278
+ }
279
+ };
351
280
  PtcPara.style = ptcParaCss;
352
281
 
353
282
  const ptcPictureCss = ":host{display:block;overflow:hidden}:host img{display:block}:host(.relative){position:relative}:host(.static){position:static}:host(.absoltue){position:absolute}img{max-width:100%}.cover{object-fit:cover}.fill{object-fit:fill}.contain{object-fit:contain}.scale-down{object-fit:scale-down}.none{object-fit:none}.initial{object-fit:initial}.inherit{object-fit:inherit}.radius-standard{border-radius:var(--ptc-border-radius-standard)}.radius-large{border-radius:var(--ptc-border-radius-large)}.is-full-height{height:100%}.is-full-width{width:100%}:host(.left){text-align:left}:host(.right){text-align:right}:host(.center){text-align:center}";
354
283
 
355
- let PtcPicture = class {
356
- constructor(hostRef) {
357
- registerInstance(this, hostRef);
358
- /**
359
- * Image alt
360
- */
361
- this.alt = "image";
362
- /**
363
- * Image size for smallest screen
364
- * <=767px
365
- */
366
- this.sizeXs = '510x340';
367
- /**
368
- * Image size for small screen
369
- * >=768px and <=991px
370
- */
371
- this.sizeSm = '1240x496';
372
- /**
373
- * Image size for medium screen
374
- * >=992px and <=1199px
375
- */
376
- this.sizeMd = '1366x500';
377
- /**
378
- * Image solution for large screen
379
- * >=1200px
380
- */
381
- this.sizeLg = '1920x1080';
382
- /**
383
- * Image Position
384
- */
385
- this.imagePosition = 'static';
386
- /**
387
- * Object Fit
388
- * Default: cover
389
- */
390
- this.objectFit = 'cover';
391
- /**
392
- * Stretch height to 100%?
393
- */
394
- this.isFullHeight = false;
395
- /**
396
- * Stretch width to 100%?
397
- */
398
- this.isFullWidth = false;
399
- /**
400
- * (optional) Image alignment
401
- **/
402
- this.imageAlignment = 'left';
403
- }
404
- WindowResize() {
405
- this.addIntersectionObserver();
406
- }
407
- componentDidLoad() {
408
- this.addIntersectionObserver();
409
- }
410
- componentWillUpdate() {
411
- if (this.src !== this.oldSrc) {
412
- this.addIntersectionObserver();
413
- }
414
- this.oldSrc = this.src;
415
- }
416
- //lazy-loading
417
- addIntersectionObserver() {
418
- if (!this.src) {
419
- return;
420
- }
421
- if ('IntersectionObserver' in window) {
422
- let lazyLoadImages = new IntersectionObserver(entries => {
423
- entries.forEach(entry => {
424
- if (entry.isIntersecting) {
425
- const image = this.el.shadowRoot.querySelector('img');
426
- image.src = this.setResponsiveBg();
427
- console.log('loaded');
428
- lazyLoadImages.unobserve(image);
429
- }
430
- });
431
- });
432
- lazyLoadImages.observe(this.el.shadowRoot.querySelector('img'));
433
- }
434
- else {
435
- // fall back to setTimeout for Safari and IE
436
- setTimeout(() => {
437
- const image = this.el.shadowRoot.querySelector('img');
438
- image.src = this.setResponsiveBg();
439
- image.onload = () => {
440
- image.removeAttribute('data-src');
441
- console.log('loaded fallback');
442
- };
443
- }, 5000);
444
- }
445
- }
446
- //responsive image
447
- setResponsiveBg() {
448
- // Define local variables
449
- let backgrounds = (this.el.shadowRoot || document).querySelectorAll('img'), el, elData, currentBreakpoint = this.getCurrentBreakPoints();
450
- for (var i = 0, len = backgrounds.length; i < len; i++) {
451
- // Set current variables
452
- el = backgrounds[i];
453
- elData = el.getAttribute('data-' + currentBreakpoint);
454
- if (elData !== null) {
455
- // console.log('img src= ' + elData);
456
- return elData;
457
- }
458
- else {
459
- if (typeof console == 'object') {
460
- console.warn('Data attribute: data-' + currentBreakpoint + ' not found on element:\n\n' + el.outerHTML + '\n\n\n');
461
- }
462
- }
463
- }
464
- }
465
- render() {
466
- const classMap = this.getCssClassMap();
467
- const classMapHost = this.getCssClassMapHost();
468
- return (h(Host, { class: classMapHost }, this.styles && h("style", null, this.styles), h("img", Object.assign({ class: classMap, "data-xs": !!this.sizeXs ? `${this.src}:${this.sizeXs}` : `${this.src}`, "data-sm": !!this.sizeSm ? `${this.src}:${this.sizeSm}` : `${this.src}`, "data-md": !!this.sizeMd ? `${this.src}:${this.sizeMd}` : `${this.src}`, "data-lg": !!this.sizeLg ? `${this.src}:${this.sizeLg}` : `${this.src}` }, (!!this.width ? { width: this.width } : {}), (!!this.height ? { height: this.height } : {}), { alt: this.alt, style: Object.assign({}, (!!this.maxWidth ? { maxWidth: this.maxWidth + 'px' } : {})) })), h("slot", null)));
469
- }
470
- getCurrentBreakPoints() {
471
- // Define local variables
472
- let doc = window.document, temp = doc.createElement('div'), env;
473
- // Append test node
474
- doc.body.appendChild(temp);
475
- // Loop through breakpoints
476
- for (let i = ResponsivePictureVariables.envs.length - 1; i >= 0; i--) {
477
- env = ResponsivePictureVariables.envs[i];
478
- // Add classes
479
- temp.className = 'hidden-' + env;
480
- // Found breakpoint
481
- if (temp.offsetParent === null) {
482
- // Remove our test node
483
- doc.body.removeChild(temp);
484
- // Return current breakpoint
485
- return env;
486
- }
487
- }
488
- // Breakpoint not found, try fallback
489
- doc.body.removeChild(temp);
490
- return this.getFallbackBreakpoint();
491
- }
492
- getFallbackBreakpoint() {
493
- if (window.matchMedia('(min-width: 992px)').matches) {
494
- return 'lg';
495
- }
496
- else if (window.matchMedia('(min-width: 768px)').matches) {
497
- return 'md';
498
- }
499
- else if (window.matchMedia('(min-width: 576px)').matches) {
500
- return 'sm';
501
- }
502
- else {
503
- return 'xs';
504
- }
505
- }
506
- getCssClassMap() {
507
- return {
508
- [this.borderRadius]: this.borderRadius ? true : false,
509
- [this.objectFit]: true,
510
- [this.isFullHeight ? 'is-full-height' : 'is-normal-height']: true,
511
- [this.isFullWidth ? 'is-full-width' : 'is-normal-width']: true
512
- };
513
- }
514
- getCssClassMapHost() {
515
- return {
516
- [this.imagePosition]: true,
517
- [this.imageAlignment]: true
518
- };
519
- }
520
- get el() { return getElement(this); }
521
- };
284
+ const PtcPicture = class {
285
+ constructor(hostRef) {
286
+ registerInstance(this, hostRef);
287
+ this.src = undefined;
288
+ this.alt = "image";
289
+ this.sizeXs = '510x340';
290
+ this.sizeSm = '1240x496';
291
+ this.sizeMd = '1366x500';
292
+ this.sizeLg = '1920x1080';
293
+ this.oldSrc = undefined;
294
+ this.imagePosition = 'static';
295
+ this.borderRadius = undefined;
296
+ this.height = undefined;
297
+ this.width = undefined;
298
+ this.objectFit = 'cover';
299
+ this.isFullHeight = false;
300
+ this.isFullWidth = false;
301
+ this.styles = undefined;
302
+ this.imageAlignment = 'left';
303
+ this.maxWidth = undefined;
304
+ }
305
+ WindowResize() {
306
+ this.addIntersectionObserver();
307
+ }
308
+ componentDidLoad() {
309
+ this.addIntersectionObserver();
310
+ }
311
+ componentWillUpdate() {
312
+ if (this.src !== this.oldSrc) {
313
+ this.addIntersectionObserver();
314
+ }
315
+ this.oldSrc = this.src;
316
+ }
317
+ //lazy-loading
318
+ addIntersectionObserver() {
319
+ if (!this.src) {
320
+ return;
321
+ }
322
+ if ('IntersectionObserver' in window) {
323
+ let lazyLoadImages = new IntersectionObserver(entries => {
324
+ entries.forEach(entry => {
325
+ if (entry.isIntersecting) {
326
+ const image = this.el.shadowRoot.querySelector('img');
327
+ image.src = this.setResponsiveBg();
328
+ console.log('loaded');
329
+ lazyLoadImages.unobserve(image);
330
+ }
331
+ });
332
+ });
333
+ lazyLoadImages.observe(this.el.shadowRoot.querySelector('img'));
334
+ }
335
+ else {
336
+ // fall back to setTimeout for Safari and IE
337
+ setTimeout(() => {
338
+ const image = this.el.shadowRoot.querySelector('img');
339
+ image.src = this.setResponsiveBg();
340
+ image.onload = () => {
341
+ image.removeAttribute('data-src');
342
+ console.log('loaded fallback');
343
+ };
344
+ }, 5000);
345
+ }
346
+ }
347
+ //responsive image
348
+ setResponsiveBg() {
349
+ // Define local variables
350
+ let backgrounds = (this.el.shadowRoot || document).querySelectorAll('img'), el, elData, currentBreakpoint = this.getCurrentBreakPoints();
351
+ for (var i = 0, len = backgrounds.length; i < len; i++) {
352
+ // Set current variables
353
+ el = backgrounds[i];
354
+ elData = el.getAttribute('data-' + currentBreakpoint);
355
+ if (elData !== null) {
356
+ // console.log('img src= ' + elData);
357
+ return elData;
358
+ }
359
+ else {
360
+ if (typeof console == 'object') {
361
+ console.warn('Data attribute: data-' + currentBreakpoint + ' not found on element:\n\n' + el.outerHTML + '\n\n\n');
362
+ }
363
+ }
364
+ }
365
+ }
366
+ render() {
367
+ const classMap = this.getCssClassMap();
368
+ const classMapHost = this.getCssClassMapHost();
369
+ return (h(Host, { class: classMapHost }, this.styles && h("style", null, this.styles), h("img", Object.assign({ class: classMap, "data-xs": !!this.sizeXs ? `${this.src}:${this.sizeXs}` : `${this.src}`, "data-sm": !!this.sizeSm ? `${this.src}:${this.sizeSm}` : `${this.src}`, "data-md": !!this.sizeMd ? `${this.src}:${this.sizeMd}` : `${this.src}`, "data-lg": !!this.sizeLg ? `${this.src}:${this.sizeLg}` : `${this.src}` }, (!!this.width ? { width: this.width } : {}), (!!this.height ? { height: this.height } : {}), { alt: this.alt, style: Object.assign({}, (!!this.maxWidth ? { maxWidth: this.maxWidth + 'px' } : {})) })), h("slot", null)));
370
+ }
371
+ getCurrentBreakPoints() {
372
+ // Define local variables
373
+ let doc = window.document, temp = doc.createElement('div'), env;
374
+ // Append test node
375
+ doc.body.appendChild(temp);
376
+ // Loop through breakpoints
377
+ for (let i = ResponsivePictureVariables.envs.length - 1; i >= 0; i--) {
378
+ env = ResponsivePictureVariables.envs[i];
379
+ // Add classes
380
+ temp.className = 'hidden-' + env;
381
+ // Found breakpoint
382
+ if (temp.offsetParent === null) {
383
+ // Remove our test node
384
+ doc.body.removeChild(temp);
385
+ // Return current breakpoint
386
+ return env;
387
+ }
388
+ }
389
+ // Breakpoint not found, try fallback
390
+ doc.body.removeChild(temp);
391
+ return this.getFallbackBreakpoint();
392
+ }
393
+ getFallbackBreakpoint() {
394
+ if (window.matchMedia('(min-width: 992px)').matches) {
395
+ return 'lg';
396
+ }
397
+ else if (window.matchMedia('(min-width: 768px)').matches) {
398
+ return 'md';
399
+ }
400
+ else if (window.matchMedia('(min-width: 576px)').matches) {
401
+ return 'sm';
402
+ }
403
+ else {
404
+ return 'xs';
405
+ }
406
+ }
407
+ getCssClassMap() {
408
+ return {
409
+ [this.borderRadius]: this.borderRadius ? true : false,
410
+ [this.objectFit]: true,
411
+ [this.isFullHeight ? 'is-full-height' : 'is-normal-height']: true,
412
+ [this.isFullWidth ? 'is-full-width' : 'is-normal-width']: true
413
+ };
414
+ }
415
+ getCssClassMapHost() {
416
+ return {
417
+ [this.imagePosition]: true,
418
+ [this.imageAlignment]: true
419
+ };
420
+ }
421
+ get el() { return getElement(this); }
422
+ };
522
423
  PtcPicture.style = ptcPictureCss;
523
424
 
524
425
  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}}";
525
426
 
526
- let PtcSpacer = class {
527
- constructor(hostRef) {
528
- registerInstance(this, hostRef);
529
- /**
530
- * Breakpoint
531
- */
532
- this.breakpoint = '';
533
- /**
534
- * Spacing Size
535
- */
536
- this.size = 'medium';
537
- /**
538
- * Direction
539
- */
540
- this.direction = 'vertical';
541
- }
542
- render() {
543
- const classMap = this.getCssClassMap();
544
- return (h(Host, { class: classMap }));
545
- }
546
- getCssClassMap() {
547
- return {
548
- [this.size]: true,
549
- ['ptc-spacer-horizontal']: this.direction === 'horizontal',
550
- ['ptc-spacer-vertical']: this.direction === 'vertical',
551
- ['ptc-spacer-xx-small']: this.breakpoint === 'xx-small',
552
- ['ptc-spacer-x-small']: this.breakpoint === 'x-small',
553
- ['ptc-spacer-small']: this.breakpoint === 'small',
554
- ['ptc-spacer-medium']: this.breakpoint === 'medium',
555
- ['ptc-spacer-large']: this.breakpoint === 'large',
556
- ['ptc-spacer-x-large']: this.breakpoint === 'x-large',
557
- ['ptc-spacer-xx-large']: this.breakpoint === 'xx-large',
558
- };
559
- }
560
- };
427
+ const PtcSpacer = class {
428
+ constructor(hostRef) {
429
+ registerInstance(this, hostRef);
430
+ this.breakpoint = '';
431
+ this.size = 'medium';
432
+ this.direction = 'vertical';
433
+ }
434
+ render() {
435
+ const classMap = this.getCssClassMap();
436
+ return (h(Host, { class: classMap }));
437
+ }
438
+ getCssClassMap() {
439
+ return {
440
+ [this.size]: true,
441
+ ['ptc-spacer-horizontal']: this.direction === 'horizontal',
442
+ ['ptc-spacer-vertical']: this.direction === 'vertical',
443
+ ['ptc-spacer-xx-small']: this.breakpoint === 'xx-small',
444
+ ['ptc-spacer-x-small']: this.breakpoint === 'x-small',
445
+ ['ptc-spacer-small']: this.breakpoint === 'small',
446
+ ['ptc-spacer-medium']: this.breakpoint === 'medium',
447
+ ['ptc-spacer-large']: this.breakpoint === 'large',
448
+ ['ptc-spacer-x-large']: this.breakpoint === 'x-large',
449
+ ['ptc-spacer-xx-large']: this.breakpoint === 'xx-large',
450
+ };
451
+ }
452
+ };
561
453
  PtcSpacer.style = ptcSpacerCss;
562
454
 
563
455
  export { PtcCard as ptc_card, PtcDate as ptc_date, PtcImg as ptc_img, PtcPara as ptc_para, PtcPicture as ptc_picture, PtcSpacer as ptc_spacer };