@oiz/stzh-components 3.0.0-beta3 → 3.0.0-beta4

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 (258) hide show
  1. package/dist/cjs/{app-globals-0cbebaa1.js → app-globals-5897b76e.js} +39 -14
  2. package/dist/cjs/app-globals-5897b76e.js.map +1 -0
  3. package/dist/cjs/index.cjs.js.map +1 -1
  4. package/dist/cjs/loader.cjs.js +2 -2
  5. package/dist/cjs/stzh-appointments.cjs.entry.js +11 -8
  6. package/dist/cjs/stzh-appointments.cjs.entry.js.map +1 -1
  7. package/dist/cjs/stzh-badge_3.cjs.entry.js +1 -1
  8. package/dist/cjs/stzh-badge_3.cjs.entry.js.map +1 -1
  9. package/dist/cjs/stzh-calendar.cjs.entry.js +1 -1
  10. package/dist/cjs/stzh-calendar.cjs.entry.js.map +1 -1
  11. package/dist/cjs/stzh-card_3.cjs.entry.js +16 -19
  12. package/dist/cjs/stzh-card_3.cjs.entry.js.map +1 -1
  13. package/dist/cjs/stzh-chip.cjs.entry.js +2 -2
  14. package/dist/cjs/stzh-chip.cjs.entry.js.map +1 -1
  15. package/dist/cjs/stzh-components.cjs.js +2 -2
  16. package/dist/cjs/stzh-content.cjs.entry.js +1 -1
  17. package/dist/cjs/stzh-content.cjs.entry.js.map +1 -1
  18. package/dist/cjs/stzh-cspace.cjs.entry.js +1 -1
  19. package/dist/cjs/stzh-cspace.cjs.entry.js.map +1 -1
  20. package/dist/cjs/stzh-cta.cjs.entry.js +1 -1
  21. package/dist/cjs/stzh-cta.cjs.entry.js.map +1 -1
  22. package/dist/cjs/stzh-datamessagelist-item.cjs.entry.js +9 -4
  23. package/dist/cjs/stzh-datamessagelist-item.cjs.entry.js.map +1 -1
  24. package/dist/cjs/stzh-datamessagelist.cjs.entry.js +1 -1
  25. package/dist/cjs/stzh-datamessagelist.cjs.entry.js.map +1 -1
  26. package/dist/cjs/stzh-datepicker_3.cjs.entry.js +1 -1
  27. package/dist/cjs/stzh-datepicker_3.cjs.entry.js.map +1 -1
  28. package/dist/cjs/stzh-dropdown.cjs.entry.js +8 -2
  29. package/dist/cjs/stzh-dropdown.cjs.entry.js.map +1 -1
  30. package/dist/cjs/stzh-header.cjs.entry.js +15 -5
  31. package/dist/cjs/stzh-header.cjs.entry.js.map +1 -1
  32. package/dist/cjs/stzh-iframe.cjs.entry.js +11 -3
  33. package/dist/cjs/stzh-iframe.cjs.entry.js.map +1 -1
  34. package/dist/cjs/stzh-imagecomparison.cjs.entry.js +2 -2
  35. package/dist/cjs/stzh-imagecomparison.cjs.entry.js.map +1 -1
  36. package/dist/cjs/stzh-link.cjs.entry.js +1 -1
  37. package/dist/cjs/stzh-link.cjs.entry.js.map +1 -1
  38. package/dist/cjs/stzh-search.cjs.entry.js +20 -3
  39. package/dist/cjs/stzh-search.cjs.entry.js.map +1 -1
  40. package/dist/cjs/stzh-skin-portal-mitwirken.cjs.entry.js +1 -1
  41. package/dist/cjs/stzh-skin-portal-mitwirken.cjs.entry.js.map +1 -1
  42. package/dist/collection/assets/i18n/de.json +2 -2
  43. package/dist/collection/assets/i18n/en.json +2 -2
  44. package/dist/collection/components/stzh-appointments/stzh-appointments.css +99 -19
  45. package/dist/collection/components/stzh-appointments/stzh-appointments.js +9 -7
  46. package/dist/collection/components/stzh-appointments/stzh-appointments.js.map +1 -1
  47. package/dist/collection/components/stzh-appointments/stzh-appointments.stories.js +7 -1
  48. package/dist/collection/components/stzh-button/stzh-button.css +10 -10
  49. package/dist/collection/components/stzh-calendar/stzh-calendar.css +0 -2
  50. package/dist/collection/components/stzh-card/stzh-card.css +0 -27
  51. package/dist/collection/components/stzh-card/stzh-card.js +12 -94
  52. package/dist/collection/components/stzh-card/stzh-card.js.map +1 -1
  53. package/dist/collection/components/stzh-card/stzh-card.stories.js +0 -17
  54. package/dist/collection/components/stzh-chip/stzh-chip.css +22 -10
  55. package/dist/collection/components/stzh-chip/stzh-chip.js +2 -2
  56. package/dist/collection/components/stzh-chip/stzh-chip.js.map +1 -1
  57. package/dist/collection/components/stzh-chipselect/stzh-chipselect.js +3 -1
  58. package/dist/collection/components/stzh-chipselect/stzh-chipselect.js.map +1 -1
  59. package/dist/collection/components/stzh-content/stzh-content.css +3 -3
  60. package/dist/collection/components/stzh-cspace/stzh-cspace.css +36 -0
  61. package/dist/collection/components/stzh-cta/stzh-cta.css +22 -36
  62. package/dist/collection/components/stzh-datamessagelist/stzh-datamessagelist.css +0 -5
  63. package/dist/collection/components/stzh-datamessagelist/stzh-datamessagelist.stories.js +26 -0
  64. package/dist/collection/components/stzh-datamessagelist-item/stzh-datamessagelist-item.css +26 -16
  65. package/dist/collection/components/stzh-datamessagelist-item/stzh-datamessagelist-item.js +26 -3
  66. package/dist/collection/components/stzh-datamessagelist-item/stzh-datamessagelist-item.js.map +1 -1
  67. package/dist/collection/components/stzh-datepicker/stzh-datepicker.css +18 -3
  68. package/dist/collection/components/stzh-dropdown/stzh-dropdown.css +288 -40
  69. package/dist/collection/components/stzh-dropdown/stzh-dropdown.js +108 -4
  70. package/dist/collection/components/stzh-dropdown/stzh-dropdown.js.map +1 -1
  71. package/dist/collection/components/stzh-header/stzh-header.css +15 -13
  72. package/dist/collection/components/stzh-header/stzh-header.js +19 -6
  73. package/dist/collection/components/stzh-header/stzh-header.js.map +1 -1
  74. package/dist/collection/components/stzh-iframe/stzh-iframe.js +160 -3
  75. package/dist/collection/components/stzh-iframe/stzh-iframe.js.map +1 -1
  76. package/dist/collection/components/stzh-imagecomparison/stzh-imagecomparison.css +12 -17
  77. package/dist/collection/components/stzh-imagecomparison/stzh-imagecomparison.js +1 -1
  78. package/dist/collection/components/stzh-imagecomparison/stzh-imagecomparison.js.map +1 -1
  79. package/dist/collection/components/stzh-link/stzh-link.js +19 -19
  80. package/dist/collection/components/stzh-link/stzh-link.js.map +1 -1
  81. package/dist/collection/components/stzh-search/stzh-search.css +70 -0
  82. package/dist/collection/components/stzh-search/stzh-search.js +72 -3
  83. package/dist/collection/components/stzh-search/stzh-search.js.map +1 -1
  84. package/dist/collection/components/stzh-search/stzh-search.stories.js +3 -0
  85. package/dist/collection/components/stzh-skin-portal-mitwirken/stzh-skin-portal-mitwirken.css +7 -7
  86. package/dist/collection/global/js/helpers/autofocus.js +36 -11
  87. package/dist/collection/global/js/script.js +2 -0
  88. package/dist/collection/index.js.map +1 -1
  89. package/dist/components/index.js +38 -13
  90. package/dist/components/index.js.map +1 -1
  91. package/dist/components/index2.js.map +1 -1
  92. package/dist/components/stzh-appointments.js +11 -9
  93. package/dist/components/stzh-appointments.js.map +1 -1
  94. package/dist/components/stzh-button2.js +1 -1
  95. package/dist/components/stzh-button2.js.map +1 -1
  96. package/dist/components/stzh-calendar2.js +1 -1
  97. package/dist/components/stzh-calendar2.js.map +1 -1
  98. package/dist/components/stzh-card2.js +13 -22
  99. package/dist/components/stzh-card2.js.map +1 -1
  100. package/dist/components/stzh-chip2.js +3 -3
  101. package/dist/components/stzh-chip2.js.map +1 -1
  102. package/dist/components/stzh-chipselect2.js +3 -1
  103. package/dist/components/stzh-chipselect2.js.map +1 -1
  104. package/dist/components/stzh-content.js +1 -1
  105. package/dist/components/stzh-content.js.map +1 -1
  106. package/dist/components/stzh-cspace.js +1 -1
  107. package/dist/components/stzh-cspace.js.map +1 -1
  108. package/dist/components/stzh-cta.js +1 -1
  109. package/dist/components/stzh-cta.js.map +1 -1
  110. package/dist/components/stzh-datamessagelist-item.js +10 -4
  111. package/dist/components/stzh-datamessagelist-item.js.map +1 -1
  112. package/dist/components/stzh-datamessagelist.js +1 -1
  113. package/dist/components/stzh-datamessagelist.js.map +1 -1
  114. package/dist/components/stzh-datepicker2.js +1 -1
  115. package/dist/components/stzh-datepicker2.js.map +1 -1
  116. package/dist/components/stzh-dropdown2.js +12 -2
  117. package/dist/components/stzh-dropdown2.js.map +1 -1
  118. package/dist/components/stzh-header.js +17 -5
  119. package/dist/components/stzh-header.js.map +1 -1
  120. package/dist/components/stzh-iframe2.js +19 -3
  121. package/dist/components/stzh-iframe2.js.map +1 -1
  122. package/dist/components/stzh-imagecomparison.js +2 -2
  123. package/dist/components/stzh-imagecomparison.js.map +1 -1
  124. package/dist/components/stzh-link2.js +2 -2
  125. package/dist/components/stzh-link2.js.map +1 -1
  126. package/dist/components/stzh-search.js +49 -16
  127. package/dist/components/stzh-search.js.map +1 -1
  128. package/dist/components/stzh-skin-portal-mitwirken.js +1 -1
  129. package/dist/components/stzh-skin-portal-mitwirken.js.map +1 -1
  130. package/dist/esm/{app-globals-3c171b79.js → app-globals-6a7ed0f4.js} +39 -14
  131. package/dist/esm/app-globals-6a7ed0f4.js.map +1 -0
  132. package/dist/esm/index.js.map +1 -1
  133. package/dist/esm/loader.js +2 -2
  134. package/dist/esm/stzh-appointments.entry.js +11 -8
  135. package/dist/esm/stzh-appointments.entry.js.map +1 -1
  136. package/dist/esm/stzh-badge_3.entry.js +1 -1
  137. package/dist/esm/stzh-badge_3.entry.js.map +1 -1
  138. package/dist/esm/stzh-calendar.entry.js +1 -1
  139. package/dist/esm/stzh-calendar.entry.js.map +1 -1
  140. package/dist/esm/stzh-card_3.entry.js +16 -19
  141. package/dist/esm/stzh-card_3.entry.js.map +1 -1
  142. package/dist/esm/stzh-chip.entry.js +3 -3
  143. package/dist/esm/stzh-chip.entry.js.map +1 -1
  144. package/dist/esm/stzh-components.js +2 -2
  145. package/dist/esm/stzh-content.entry.js +1 -1
  146. package/dist/esm/stzh-content.entry.js.map +1 -1
  147. package/dist/esm/stzh-cspace.entry.js +1 -1
  148. package/dist/esm/stzh-cspace.entry.js.map +1 -1
  149. package/dist/esm/stzh-cta.entry.js +1 -1
  150. package/dist/esm/stzh-cta.entry.js.map +1 -1
  151. package/dist/esm/stzh-datamessagelist-item.entry.js +9 -4
  152. package/dist/esm/stzh-datamessagelist-item.entry.js.map +1 -1
  153. package/dist/esm/stzh-datamessagelist.entry.js +1 -1
  154. package/dist/esm/stzh-datamessagelist.entry.js.map +1 -1
  155. package/dist/esm/stzh-datepicker_3.entry.js +1 -1
  156. package/dist/esm/stzh-datepicker_3.entry.js.map +1 -1
  157. package/dist/esm/stzh-dropdown.entry.js +8 -2
  158. package/dist/esm/stzh-dropdown.entry.js.map +1 -1
  159. package/dist/esm/stzh-header.entry.js +15 -5
  160. package/dist/esm/stzh-header.entry.js.map +1 -1
  161. package/dist/esm/stzh-iframe.entry.js +11 -3
  162. package/dist/esm/stzh-iframe.entry.js.map +1 -1
  163. package/dist/esm/stzh-imagecomparison.entry.js +2 -2
  164. package/dist/esm/stzh-imagecomparison.entry.js.map +1 -1
  165. package/dist/esm/stzh-link.entry.js +1 -1
  166. package/dist/esm/stzh-link.entry.js.map +1 -1
  167. package/dist/esm/stzh-search.entry.js +20 -3
  168. package/dist/esm/stzh-search.entry.js.map +1 -1
  169. package/dist/esm/stzh-skin-portal-mitwirken.entry.js +1 -1
  170. package/dist/esm/stzh-skin-portal-mitwirken.entry.js.map +1 -1
  171. package/dist/stzh-components/assets/i18n/de.json +2 -2
  172. package/dist/stzh-components/assets/i18n/en.json +2 -2
  173. package/dist/stzh-components/index.esm.js.map +1 -1
  174. package/dist/stzh-components/{p-3ca4f71a.entry.js → p-069e181f.entry.js} +2 -2
  175. package/dist/stzh-components/p-069e181f.entry.js.map +1 -0
  176. package/dist/stzh-components/p-1b78f602.entry.js +2 -0
  177. package/dist/stzh-components/p-1b78f602.entry.js.map +1 -0
  178. package/dist/stzh-components/p-295c8995.entry.js +2 -0
  179. package/dist/stzh-components/p-295c8995.entry.js.map +1 -0
  180. package/dist/stzh-components/p-2bbbc217.entry.js +9 -0
  181. package/dist/stzh-components/{p-b4ce8e10.entry.js.map → p-2bbbc217.entry.js.map} +1 -1
  182. package/dist/stzh-components/p-2d57953a.entry.js +2 -0
  183. package/dist/stzh-components/{p-1252aa01.entry.js.map → p-2d57953a.entry.js.map} +1 -1
  184. package/dist/stzh-components/p-2eb8f323.entry.js +2 -0
  185. package/dist/stzh-components/{p-62b88844.entry.js.map → p-2eb8f323.entry.js.map} +1 -1
  186. package/dist/stzh-components/p-45392fe0.entry.js +2 -0
  187. package/dist/stzh-components/p-45392fe0.entry.js.map +1 -0
  188. package/dist/stzh-components/{p-bd494b47.entry.js → p-523c0bb1.entry.js} +2 -2
  189. package/dist/stzh-components/p-523c0bb1.entry.js.map +1 -0
  190. package/dist/stzh-components/{p-e63dfe12.entry.js → p-5b9b2425.entry.js} +2 -2
  191. package/dist/stzh-components/{p-e63dfe12.entry.js.map → p-5b9b2425.entry.js.map} +1 -1
  192. package/dist/stzh-components/{p-bb87a6e2.entry.js → p-75fec3cd.entry.js} +2 -2
  193. package/dist/stzh-components/{p-bb87a6e2.entry.js.map → p-75fec3cd.entry.js.map} +1 -1
  194. package/dist/stzh-components/p-78eaea8d.js +2 -0
  195. package/dist/stzh-components/p-78eaea8d.js.map +1 -0
  196. package/dist/stzh-components/p-8ab62796.entry.js +2 -0
  197. package/dist/stzh-components/p-8ab62796.entry.js.map +1 -0
  198. package/dist/stzh-components/p-b0626969.entry.js +2 -0
  199. package/dist/stzh-components/p-b0626969.entry.js.map +1 -0
  200. package/dist/stzh-components/p-b34a4e7c.entry.js +2 -0
  201. package/dist/stzh-components/p-b34a4e7c.entry.js.map +1 -0
  202. package/dist/stzh-components/p-b5224e53.entry.js +2 -0
  203. package/dist/stzh-components/p-b5224e53.entry.js.map +1 -0
  204. package/dist/stzh-components/p-d1e6afe2.entry.js +2 -0
  205. package/dist/stzh-components/p-d1e6afe2.entry.js.map +1 -0
  206. package/dist/stzh-components/p-ddfb8df0.entry.js +2 -0
  207. package/dist/stzh-components/p-ddfb8df0.entry.js.map +1 -0
  208. package/dist/stzh-components/p-eb79f3ed.entry.js +2 -0
  209. package/dist/stzh-components/p-eb79f3ed.entry.js.map +1 -0
  210. package/dist/stzh-components/p-f50e0102.entry.js +2 -0
  211. package/dist/stzh-components/p-f50e0102.entry.js.map +1 -0
  212. package/dist/stzh-components/stzh-components.css +1 -1
  213. package/dist/stzh-components/stzh-components.esm.js +1 -1
  214. package/dist/stzh-components/stzh-components.esm.js.map +1 -1
  215. package/dist/types/components/stzh-card/stzh-card.d.ts +1 -5
  216. package/dist/types/components/stzh-datamessagelist-item/stzh-datamessagelist-item.d.ts +2 -0
  217. package/dist/types/components/stzh-dropdown/stzh-dropdown.d.ts +10 -2
  218. package/dist/types/components/stzh-header/stzh-header.d.ts +2 -2
  219. package/dist/types/components/stzh-iframe/stzh-iframe.d.ts +29 -1
  220. package/dist/types/components/stzh-link/stzh-link.d.ts +2 -2
  221. package/dist/types/components/stzh-search/stzh-search.d.ts +10 -0
  222. package/dist/types/components.d.ts +156 -38
  223. package/dist/types/index.d.ts +3 -0
  224. package/dist/vscode-data.json +140 -12
  225. package/package.json +1 -1
  226. package/dist/cjs/app-globals-0cbebaa1.js.map +0 -1
  227. package/dist/collection/patterns/appointments/appointments.e2e.js +0 -18
  228. package/dist/collection/patterns/appointments/appointments.e2e.js.map +0 -1
  229. package/dist/esm/app-globals-3c171b79.js.map +0 -1
  230. package/dist/stzh-components/p-1252aa01.entry.js +0 -2
  231. package/dist/stzh-components/p-18015613.entry.js +0 -2
  232. package/dist/stzh-components/p-18015613.entry.js.map +0 -1
  233. package/dist/stzh-components/p-38d64313.entry.js +0 -2
  234. package/dist/stzh-components/p-38d64313.entry.js.map +0 -1
  235. package/dist/stzh-components/p-39fa126d.js +0 -2
  236. package/dist/stzh-components/p-39fa126d.js.map +0 -1
  237. package/dist/stzh-components/p-3ca4f71a.entry.js.map +0 -1
  238. package/dist/stzh-components/p-4cff0c86.entry.js +0 -2
  239. package/dist/stzh-components/p-4cff0c86.entry.js.map +0 -1
  240. package/dist/stzh-components/p-5e48450d.entry.js +0 -2
  241. package/dist/stzh-components/p-5e48450d.entry.js.map +0 -1
  242. package/dist/stzh-components/p-62b88844.entry.js +0 -2
  243. package/dist/stzh-components/p-69c1826d.entry.js +0 -2
  244. package/dist/stzh-components/p-69c1826d.entry.js.map +0 -1
  245. package/dist/stzh-components/p-7091d652.entry.js +0 -2
  246. package/dist/stzh-components/p-7091d652.entry.js.map +0 -1
  247. package/dist/stzh-components/p-76902b7c.entry.js +0 -2
  248. package/dist/stzh-components/p-76902b7c.entry.js.map +0 -1
  249. package/dist/stzh-components/p-92285350.entry.js +0 -2
  250. package/dist/stzh-components/p-92285350.entry.js.map +0 -1
  251. package/dist/stzh-components/p-93e0ff47.entry.js +0 -2
  252. package/dist/stzh-components/p-93e0ff47.entry.js.map +0 -1
  253. package/dist/stzh-components/p-b4ce8e10.entry.js +0 -9
  254. package/dist/stzh-components/p-bd494b47.entry.js.map +0 -1
  255. package/dist/stzh-components/p-e6785bb1.entry.js +0 -2
  256. package/dist/stzh-components/p-e6785bb1.entry.js.map +0 -1
  257. package/dist/stzh-components/p-fb1d20da.entry.js +0 -2
  258. package/dist/stzh-components/p-fb1d20da.entry.js.map +0 -1
@@ -296,8 +296,8 @@
296
296
  --padding-right: var(--stzh-space-medium);
297
297
  --padding-top: calc(var(--stzh-space-xxsmall) - var(--border-width));
298
298
  --padding-bottom: calc(var(--stzh-space-xxsmall) - var(--border-width));
299
- --font-size: var(--stzh-font-micro-font-size);
300
- --line-height: var(--stzh-font-micro-text-line-height);
299
+ --font-size: var(--stzh-font-milli-font-size);
300
+ --line-height: var(--stzh-font-milli-text-line-height);
301
301
  --icon-size: var(--stzh-icon-size-medium);
302
302
  }
303
303
 
@@ -333,8 +333,8 @@
333
333
  --padding-right: var(--stzh-space-medium);
334
334
  --padding-top: calc(var(--stzh-space-xxsmall) - var(--border-width));
335
335
  --padding-bottom: calc(var(--stzh-space-xxsmall) - var(--border-width));
336
- --font-size: var(--stzh-font-micro-font-size);
337
- --line-height: var(--stzh-font-micro-text-line-height);
336
+ --font-size: var(--stzh-font-milli-font-size);
337
+ --line-height: var(--stzh-font-milli-text-line-height);
338
338
  --icon-size: var(--stzh-icon-size-medium);
339
339
  }
340
340
  }
@@ -370,8 +370,8 @@
370
370
  --padding-right: var(--stzh-space-medium);
371
371
  --padding-top: calc(var(--stzh-space-xxsmall) - var(--border-width));
372
372
  --padding-bottom: calc(var(--stzh-space-xxsmall) - var(--border-width));
373
- --font-size: var(--stzh-font-micro-font-size);
374
- --line-height: var(--stzh-font-micro-text-line-height);
373
+ --font-size: var(--stzh-font-milli-font-size);
374
+ --line-height: var(--stzh-font-milli-text-line-height);
375
375
  --icon-size: var(--stzh-icon-size-medium);
376
376
  }
377
377
  }
@@ -407,8 +407,8 @@
407
407
  --padding-right: var(--stzh-space-medium);
408
408
  --padding-top: calc(var(--stzh-space-xxsmall) - var(--border-width));
409
409
  --padding-bottom: calc(var(--stzh-space-xxsmall) - var(--border-width));
410
- --font-size: var(--stzh-font-micro-font-size);
411
- --line-height: var(--stzh-font-micro-text-line-height);
410
+ --font-size: var(--stzh-font-milli-font-size);
411
+ --line-height: var(--stzh-font-milli-text-line-height);
412
412
  --icon-size: var(--stzh-icon-size-medium);
413
413
  }
414
414
  }
@@ -444,8 +444,8 @@
444
444
  --padding-right: var(--stzh-space-medium);
445
445
  --padding-top: calc(var(--stzh-space-xxsmall) - var(--border-width));
446
446
  --padding-bottom: calc(var(--stzh-space-xxsmall) - var(--border-width));
447
- --font-size: var(--stzh-font-micro-font-size);
448
- --line-height: var(--stzh-font-micro-text-line-height);
447
+ --font-size: var(--stzh-font-milli-font-size);
448
+ --line-height: var(--stzh-font-milli-text-line-height);
449
449
  --icon-size: var(--stzh-icon-size-medium);
450
450
  }
451
451
  }
@@ -169,7 +169,6 @@
169
169
  --padding-bottom: var(--stzh-space-small);
170
170
  --padding-left: var(--stzh-space-xsmall);
171
171
  --padding-right: var(--stzh-space-xsmall);
172
- --background-color: var(--stzh-color-grey10);
173
172
  width: var(--stzh-calendar-width);
174
173
  }
175
174
 
@@ -187,7 +186,6 @@
187
186
  padding-bottom: var(--padding-bottom);
188
187
  padding-left: var(--padding-left);
189
188
  padding-right: var(--padding-right);
190
- background-color: var(--background-color);
191
189
  }
192
190
  .stzh-calendar__wrapper {
193
191
  width: 100%;
@@ -345,33 +345,6 @@
345
345
  letter-spacing: var(--stzh-font-curve---text-letter-spacing);
346
346
  flex-grow: 1;
347
347
  }
348
- .stzh-card__footer-meta {
349
- font-size: var(--stzh-font-micro-font-size);
350
- line-height: var(--stzh-font-micro-text-line-height);
351
- display: flex;
352
- flex-wrap: wrap;
353
- gap: var(--stzh-space-xsmall);
354
- color: var(--stzh-color-grey80);
355
- }
356
- .stzh-card__footer-meta-separator {
357
- width: 0.0625rem;
358
- background-color: currentColor;
359
- flex-shrink: 0;
360
- }
361
- .stzh-card__tag {
362
- font-size: var(--stzh-font-nano-font-size);
363
- line-height: var(--stzh-font-nano-text-line-height);
364
- position: absolute;
365
- top: 0;
366
- right: 0;
367
- height: 1.5rem;
368
- display: flex;
369
- align-items: center;
370
- color: var(--stzh-color-white);
371
- background-color: var(--stzh-color-firgreen50);
372
- padding-left: var(--stzh-space-small);
373
- padding-right: var(--stzh-space-small);
374
- }
375
348
  .stzh-card__card-actions {
376
349
  display: inline-flex;
377
350
  white-space: nowrap;
@@ -148,10 +148,6 @@ export class StzhCard {
148
148
  this.heading = "";
149
149
  this.headingLevel = "3";
150
150
  this.subtitle = "";
151
- this.author = undefined;
152
- this.date = undefined;
153
- this.dateAdapter = undefined;
154
- this.tag = undefined;
155
151
  this.headerActions = [];
156
152
  this.headerActionsBadge = undefined;
157
153
  this.headerActionsBadgeType = undefined;
@@ -220,9 +216,12 @@ export class StzhCard {
220
216
  if (!this.localization) {
221
217
  this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, "card");
222
218
  }
223
- if (!this.dateAdapter) {
224
- this.dateAdapter = window.stzhComponents.utils.createFormatParseAdapter(this.localization.$formats, this.localization.$globals);
225
- }
219
+ // if (!this.dateAdapter) {
220
+ // this.dateAdapter = window.stzhComponents.utils.createFormatParseAdapter(
221
+ // this.localization.$formats,
222
+ // this.localization.$globals
223
+ // );
224
+ // }
226
225
  }
227
226
  componentDidLoad() {
228
227
  this.sortable = this.element.closest("stzh-sortable");
@@ -289,9 +288,9 @@ export class StzhCard {
289
288
  || sortableActionsEnabled;
290
289
  const hasFooter = footerUsed
291
290
  || this._footerActions.length > 0
292
- || this.selectable
293
- || !!this.author
294
- || !!this.date;
291
+ || this.selectable;
292
+ // || !!this.author
293
+ // || !!this.date;
295
294
  const headerActionsWithBadge = this._headerActions.filter(action => !!action.badge || action.badgeEmpty);
296
295
  const classes = {
297
296
  "stzh-card": true,
@@ -302,7 +301,7 @@ export class StzhCard {
302
301
  "stzh-card--has-subtitle-interactive": !!this.subtitle && this.subtitleInteractive,
303
302
  "stzh-card--has-header": hasHeader,
304
303
  "stzh-card--has-footer": hasFooter,
305
- "stzh-card--has-tag": !!this.tag,
304
+ // "stzh-card--has-tag": !!this.tag,
306
305
  "stzh-card--is-collapsible": this.collapsible,
307
306
  "stzh-card--is-collapsed": this.collapsed,
308
307
  "stzh-card--is-starred": this.starred,
@@ -313,7 +312,7 @@ export class StzhCard {
313
312
  return (h(Host, { role: "listitem", "aria-label": this.heading, "is-sortable": sortableEnabled }, h("article", {
314
313
  // ref={(el) => (this.mainElement = el as HTMLElement)}
315
314
  class: classes
316
- }, h("a", { ref: (el) => (this.imageLinkElement = el), "aria-hidden": "true", tabindex: "-1", class: "stzh-card__image-link", href: this.href, target: this.target, onClick: this.href ? this.handleCardClick : null }, h("slot", { name: "image" })), h("div", { class: "stzh-card__content-wrapper" }, h("stzh-icon", { class: "stzh-card__dnd", name: "drag" }), this.tag && h("div", { class: "stzh-card__tag" }, this.tag), h("header", {
315
+ }, h("a", { ref: (el) => (this.imageLinkElement = el), "aria-hidden": "true", tabindex: "-1", class: "stzh-card__image-link", href: this.href, target: this.target, onClick: this.href ? this.handleCardClick : null }, h("slot", { name: "image" })), h("div", { class: "stzh-card__content-wrapper" }, h("stzh-icon", { class: "stzh-card__dnd", name: "drag" }), h("header", {
317
316
  // ref={(el) => (this.headerElement = el as HTMLElement)}
318
317
  class: "stzh-card__header", onClick: this.headerClick
319
318
  }, h("div", { class: "stzh-card__header-top" }, h("div", {
@@ -336,11 +335,7 @@ export class StzhCard {
336
335
  h(Fragment, null, !isFirstItemInSortable &&
337
336
  h("stzh-menu-item", { icon: "arrow-up", onClick: this.arrowUpClick }, this.localization.actionMoveUp), !isLastItemInSortable &&
338
337
  h("stzh-menu-item", { icon: "arrow-down", onClick: this.arrowDownClick }, this.localization.actionMoveDown)), this.starrable &&
339
- h("stzh-menu-item", { icon: this.starred ? "star-filled" : "star", onClick: this.starToggleClick }, this.starred ? this.localization.actionRemove : this.localization.actionAdd)))))), h("div", { class: "stzh-card__header-meta" }, h("slot", { name: "meta" }))), h("div", { class: "stzh-card__content hide-when-collapsed" }, h("slot", { name: "content" })), h("div", { class: "stzh-card__footer hide-when-collapsed" }, (this.author || this.date) &&
340
- h("div", { class: "stzh-card__footer-meta" }, this.author &&
341
- h("div", { class: "stzh-card__footer-author" }, this.author), this.author && this.date &&
342
- h("div", { class: "stzh-card__footer-meta-separator" }), this.date &&
343
- h("div", { class: "stzh-card__footer-date" }, this.dateAdapter.format(new Date(this.date), "dateInput"))), h("slot", { name: "footer" }, this._footerActions.length > 0 &&
338
+ h("stzh-menu-item", { icon: this.starred ? "star-filled" : "star", onClick: this.starToggleClick }, this.starred ? this.localization.actionRemove : this.localization.actionAdd)))))), h("div", { class: "stzh-card__header-meta" }, h("slot", { name: "meta" }))), h("div", { class: "stzh-card__content hide-when-collapsed" }, h("slot", { name: "content" })), h("div", { class: "stzh-card__footer hide-when-collapsed" }, h("slot", { name: "footer" }, this._footerActions.length > 0 &&
344
339
  h("stzh-actionset", { class: "stzh-card__footer-actionset", actions: this._footerActions }), this.selectable &&
345
340
  h("stzh-button", { class: "stzh-card__footer-select-button", fullwidth: true, type: "radio", variant: "secondary", name: this.name, value: this.value, checked: this.checked, disabled: this.disabled, label: this.localization.select, onStzhChange: this.handleSelectionChange })))))));
346
341
  }
@@ -629,83 +624,6 @@ export class StzhCard {
629
624
  "reflect": false,
630
625
  "defaultValue": "\"\""
631
626
  },
632
- "author": {
633
- "type": "string",
634
- "mutable": false,
635
- "complexType": {
636
- "original": "string",
637
- "resolved": "string",
638
- "references": {}
639
- },
640
- "required": false,
641
- "optional": false,
642
- "docs": {
643
- "tags": [],
644
- "text": "Author name"
645
- },
646
- "attribute": "author",
647
- "reflect": false
648
- },
649
- "date": {
650
- "type": "string",
651
- "mutable": false,
652
- "complexType": {
653
- "original": "Date | string",
654
- "resolved": "Date | string",
655
- "references": {
656
- "Date": {
657
- "location": "global",
658
- "id": "global::Date"
659
- }
660
- }
661
- },
662
- "required": false,
663
- "optional": false,
664
- "docs": {
665
- "tags": [],
666
- "text": "Date to display"
667
- },
668
- "attribute": "date",
669
- "reflect": false
670
- },
671
- "dateAdapter": {
672
- "type": "unknown",
673
- "mutable": false,
674
- "complexType": {
675
- "original": "StzhLocaleAdapter",
676
- "resolved": "StzhLocaleAdapter",
677
- "references": {
678
- "StzhLocaleAdapter": {
679
- "location": "import",
680
- "path": "../../index",
681
- "id": "src/index.ts::StzhLocaleAdapter"
682
- }
683
- }
684
- },
685
- "required": false,
686
- "optional": false,
687
- "docs": {
688
- "tags": [],
689
- "text": "Date adapter, for custom parsing/formatting.\nMust be object with a `parse` function which accepts a `string` and returns a `Date`,\nand a `format` function which accepts a `Date` and returns a `string`."
690
- }
691
- },
692
- "tag": {
693
- "type": "string",
694
- "mutable": false,
695
- "complexType": {
696
- "original": "string",
697
- "resolved": "string",
698
- "references": {}
699
- },
700
- "required": false,
701
- "optional": false,
702
- "docs": {
703
- "tags": [],
704
- "text": "Tag name"
705
- },
706
- "attribute": "tag",
707
- "reflect": false
708
- },
709
627
  "headerActions": {
710
628
  "type": "string",
711
629
  "mutable": false,
@@ -1 +1 @@
1
- {"version":3,"file":"stzh-card.js","sourceRoot":"","sources":["../../../../src/components/stzh-card/stzh-card.tsx"],"names":[],"mappings":"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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n Component,\n Host,\n h,\n Element,\n Prop,\n Watch,\n Event,\n EventEmitter,\n Fragment,\n forceUpdate\n} from \"@stencil/core\";\n\nimport {\n StzhCardHeaderAction,\n StzhActionsetItem,\n StzhCardCollapseEvent,\n StzhCardSubtitleClickEvent,\n StzhCardStarClickEvent,\n StzhCardClickEvent,\n StzhCardHeaderActionClickEvent,\n StzhButtonChangeEvent,\n StzhLocaleAdapter\n} from \"../../index\";\n\nimport { hasSlot, setPropsIfNull } from \"../../utils/utils\";\n// import { media } from '../../utils/media-utils';\n\nimport { StzhCardLocalizedText } from './stzh-card.localization';\n\n/**\n * @slot heading - Slot for heading\n * @slot image - Slot for optional image element\n * @slot content - Slot for content for any elements\n * @slot meta - Slot for meta elements (status or chip)\n * @slot footer - Slot to replace footer content (`footerActions` and `selectable` button are not shown anymore)\n */\n@Component({\n tag: \"stzh-card\",\n styleUrl: \"stzh-card.scss\",\n scoped: true\n})\nexport class StzhCard {\n /** Translation strings */\n @Prop() localization: StzhCardLocalizedText;\n\n /** Variant */\n @Prop({ reflect: true }) variant: \"default\" | \"service\" = \"default\";\n\n /** Whether card is collapsed or not */\n @Prop({ reflect: true, mutable: true }) collapsed: boolean = false;\n\n /** Whether card was starred */\n @Prop({ reflect: true, mutable: true }) starred: boolean = false;\n\n /**\n * Whether card star is displayed (with tooltip and menu-item in mobile popover).\n * The tooltip / menu-item text can be adjusted in the translations file (`actionAdd` & `actionRemove`).\n */\n @Prop({ reflect: true }) starrable: boolean = false;\n\n /** Whether card is selectable */\n @Prop({ reflect: true }) selectable: boolean = false;\n\n /** Whether card is checked (if card is selectable) */\n @Prop({ reflect: true }) checked: boolean = false;\n\n /** The name of the input element (if card is selectable) */\n @Prop({ reflect: true }) name: string = \"\";\n\n /** Href of card */\n @Prop({ reflect: true }) href: string;\n\n /** target if the button is used as link (if href used) */\n @Prop() target: string;\n\n /** The value of the input element (if card is selectable) */\n @Prop({ mutable: true }) value: string = \"\";\n\n /** Whether the element is disabled or not (if card is selectable) */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /** Heading (or use heading slot instead) */\n @Prop() heading: string = \"\";\n\n /** Heading level */\n @Prop({ reflect: true }) headingLevel: \"1\" | \"2\" | \"3\" | \"4\" = \"3\";\n\n /** Subtitle */\n @Prop() subtitle: string | string[] = \"\";\n private _subtitles = [];\n\n /** Author name */\n @Prop() author: string;\n\n /** Date to display */\n @Prop() date: Date | string;\n\n /**\n * Date adapter, for custom parsing/formatting.\n * Must be object with a `parse` function which accepts a `string` and returns a `Date`,\n * and a `format` function which accepts a `Date` and returns a `string`.\n */\n @Prop() dateAdapter: StzhLocaleAdapter;\n\n /** Tag name */\n @Prop() tag: string;\n\n /** Card header actions */\n @Prop() headerActions: string | StzhCardHeaderAction[] = [];\n private _headerActions: StzhCardHeaderAction[];\n\n /**\n * Set a badge text if header action badge exists (see headerActionsBadgeType for more info).\n */\n @Prop() headerActionsBadge: string;\n\n /**\n * If a header action with a badge exists inside `headerActions`, the more actions popover will automatically have a empty badge.\n * By default, it takes the badge type from the first one. With this property you can overwrite it.\n */\n @Prop() headerActionsBadgeType: \"default\" | \"success\" | \"warning\" | \"error\" | \"info\";\n\n /**\n * Card footer actions.\n * The [`stzh-actionset`](?path=/story/components-actionset) component is used internally.\n * You can listen to clicks with the `stzhActionClick` event.\n */\n @Prop() footerActions: string | StzhActionsetItem[] = [];\n private _footerActions: StzhActionsetItem[];\n\n /** Whether subtitle should be rendered as button and event `stzhSubtitleClick` executed on click */\n @Prop() subtitleInteractive: boolean = false;\n\n /**\n * Whether sorting should be disabled.\n * Has no effect if card is not inside a `cardlist` element, which has `sortableEnabled` property set to true.\n */\n @Prop({ reflect: true }) sortableDisabled: boolean = false;\n\n /** Whether card is collapsible */\n @Prop({ reflect: true }) collapsible: boolean = false;\n\n /**\n * Whether movement menu items should be shown.\n * Has no effect if card is not inside a `cardlist` element, which has `sortableEnabled` property set to true.\n */\n @Prop() hideMovementActions: boolean = false;\n\n /**\n * For Adobe Analytics.\n * Will be rendered as value of `s-object-id` attribute to the link elements.\n * Default value will be taken from `heading` prop/slot.\n */\n @Prop() analyticsId: string;\n\n @Element() element: HTMLStzhCardElement;\n\n /** Click event (if href is used) */\n @Event() stzhClick: EventEmitter<StzhCardClickEvent>;\n\n /** Collapse event */\n @Event() stzhCollapse: EventEmitter<StzhCardCollapseEvent>;\n\n /** Subtitle click event */\n @Event() stzhSubtitleClick: EventEmitter<StzhCardSubtitleClickEvent>;\n\n /** Star click event */\n @Event() stzhStarClick: EventEmitter<StzhCardStarClickEvent>;\n\n /** Header action click event */\n @Event() stzhHeaderActionClick: EventEmitter<StzhCardHeaderActionClickEvent>;\n\n @Watch(\"subtitle\")\n subtitleWatcher(newValue: string[] | string) {\n if (typeof newValue === \"string\") {\n if (newValue === \"\") {\n this._subtitles = [];\n } else {\n try {\n this._subtitles = JSON.parse(newValue);\n } catch(err) {\n this._subtitles = [newValue];\n }\n }\n } else {\n this._subtitles = newValue;\n }\n }\n\n @Watch(\"headerActions\")\n headerActionsWatcher(newValue: StzhCardHeaderAction[] | string) {\n if (typeof newValue === \"string\") {\n this._headerActions = JSON.parse(newValue);\n } else {\n this._headerActions = newValue;\n }\n }\n\n @Watch(\"footerActions\")\n footerActionsWatcher(newValue: StzhActionsetItem[] | string) {\n if (typeof newValue === \"string\") {\n this._footerActions = JSON.parse(newValue);\n } else {\n this._footerActions = newValue;\n }\n }\n\n // @Watch(\"collapsed\")\n // collapsedWatcher() {\n // this.handleResize();\n // }\n\n private observer: MutationObserver;\n\n private nodeChange = (entries) => {\n let changeInSlot = false;\n\n entries.forEach((entry) => {\n if (entry.target.closest('[slot]') || entry.target.hasAttribute('slot')) {\n changeInSlot = true;\n }\n });\n\n if (changeInSlot) {\n forceUpdate(this.element);\n }\n };\n\n // private mainElement: HTMLElement;\n // private headerElement: HTMLElement;\n // private headerLeftElement: HTMLElement;\n // private headerRightElement: HTMLElement;\n private imageLinkElement: HTMLAnchorElement;\n private titleLinkElement: HTMLAnchorElement;\n private headingTextElement: HTMLDivElement;\n private sortable: HTMLStzhSortableElement;\n\n // private debounceResize: number;\n // private resizeObserver: ResizeObserver;\n\n // private update = () => {\n // if (!this.mainElement) {\n // return;\n // }\n\n // this.mainElement.classList.remove(\"stzh-card--has-collapsed-header\");\n\n // if (media('medium').matches) {\n // const headerWidth = this.headerElement.clientWidth;\n // const leftWidth = this.headerLeftElement.clientWidth;\n // const rightWidth = this.headerRightElement.clientWidth;\n\n // if (headerWidth - leftWidth <= rightWidth) {\n // this.mainElement.classList.add(\"stzh-card--has-collapsed-header\");\n // }\n // }\n // }\n\n private headerClick = (event: MouseEvent) => {\n if (!this.collapsible) {\n return;\n }\n\n const filterTags = [\"stzh-popover\", \"stzh-tooltip\", \"button\", \"a\", \"input\", \"select\", \"textarea\", \"iframe\", \"details\", \"label\", \"area\"];\n const composedPathTags = event.composedPath().map(element => (element as HTMLElement).tagName?.toLowerCase());\n const found = composedPathTags.some(r => filterTags.includes(r))\n\n if (!found) {\n this.collapsed = !this.collapsed;\n\n this.stzhCollapse.emit({\n component: \"stzh-card\",\n collapsed: this.collapsed\n });\n }\n }\n\n private subtitleClick = (event: MouseEvent) => {\n if (this.subtitleInteractive) {\n this.stzhSubtitleClick.emit({\n component: \"stzh-card\",\n originalEvent: event\n });\n }\n }\n\n private starToggleClick = (event: MouseEvent) => {\n this.stzhStarClick.emit({\n component: \"stzh-card\",\n starred: this.starred,\n originalEvent: event\n });\n }\n\n private actionClick = (event: MouseEvent, action: StzhCardHeaderAction) => {\n this.stzhHeaderActionClick.emit({\n component: \"stzh-card\",\n action,\n originalEvent: event\n });\n }\n\n private arrowUpClick = () => {\n const sortable = this.element.closest(\"stzh-sortable\");\n\n if (sortable) {\n const element = this.findSortableChildElement();\n sortable.moveItem(element, \"up\");\n }\n }\n\n private arrowDownClick = () => {\n const sortable = this.element.closest(\"stzh-sortable\");\n\n if (sortable) {\n const element = this.findSortableChildElement();\n sortable.moveItem(element, \"down\");\n }\n }\n\n private updateElementInsideSortable = () => {\n const currentSortable = this.element.closest(\"stzh-sortable\");\n\n // check if element is still inside sortable\n if (!currentSortable) {\n this.sortable.removeEventListener(\"stzhUpdate\", this.updateElementInsideSortable);\n this.sortable.removeEventListener(\"stzhDisable\", this.updateElementInsideSortable)\n return;\n }\n\n if (this.element) {\n forceUpdate(this.element);\n }\n }\n\n private init = () => {\n const chips = this.element.querySelectorAll(\n 'stzh-chip[slot=\"meta\"], [slot=\"meta\"] stzh-chip'\n );\n\n const texts = this.element.querySelectorAll(\n 'stzh-text[slot=\"content\"], [slot=\"meta\"] stzh-text'\n );\n\n chips.forEach((chip) => {\n setPropsIfNull(chip, {\n size: \"small\"\n } as HTMLStzhChipElement)\n });\n\n texts.forEach((text) => {\n setPropsIfNull(text, {\n size: \"inherit\"\n } as HTMLStzhTextElement)\n });\n }\n\n // private handleResize = () => {\n // if (this.debounceResize) {\n // window.cancelAnimationFrame(this.debounceResize);\n // }\n\n // this.debounceResize = requestAnimationFrame(this.update);\n // }\n\n private handleMutation = (entries) => {\n this.init();\n this.nodeChange(entries);\n }\n\n private handleSelectionChange = (event: CustomEvent<StzhButtonChangeEvent>) => {\n this.checked = event.detail.checked;\n }\n\n private handleCardClick = (originalEvent: MouseEvent) => {\n this.stzhClick.emit({\n component: \"stzh-card\",\n originalEvent\n });\n }\n\n private findSortableChildElement(): HTMLElement | undefined {\n const sortable = this.element.closest(\"stzh-sortable\");\n\n if (sortable) {\n let element: HTMLElement = this.element;\n let sortableContainer = null;\n\n if (typeof sortable.container === \"function\") {\n sortableContainer = sortable.container();\n } else {\n sortableContainer = sortable.container;\n }\n\n while (element.parentElement && element.parentElement !== sortableContainer) {\n element = element.parentElement;\n }\n\n return element;\n }\n }\n\n async componentWillLoad() {\n this.subtitleWatcher(this.subtitle);\n this.headerActionsWatcher(this.headerActions);\n this.footerActionsWatcher(this.footerActions);\n\n if (!this.localization) {\n this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"card\");\n }\n\n if (!this.dateAdapter) {\n this.dateAdapter = window.stzhComponents.utils.createFormatParseAdapter(\n this.localization.$formats,\n this.localization.$globals\n );\n }\n }\n\n componentDidLoad() {\n this.sortable = this.element.closest(\"stzh-sortable\");\n\n if (this.sortable) {\n this.sortable.addEventListener(\"stzhUpdate\", this.updateElementInsideSortable);\n this.sortable.addEventListener(\"stzhDisable\", this.updateElementInsideSortable)\n }\n }\n\n componentDidRender() {\n requestAnimationFrame(() => {\n const objectId = this.analyticsId || this.headingTextElement?.innerText;\n\n if (objectId) {\n this.imageLinkElement?.setAttribute(\"s-object-id\", objectId);\n this.titleLinkElement?.setAttribute(\"s-object-id\", objectId);\n }\n });\n }\n\n connectedCallback() {\n this.init();\n\n this.observer = new MutationObserver(this.handleMutation);\n this.observer.observe(this.element, {\n childList: true,\n subtree: true\n });\n\n // this.resizeObserver = new ResizeObserver(this.handleResize);\n // this.resizeObserver.observe(this.element);\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\n }\n\n // if (this.resizeObserver) {\n // this.resizeObserver.disconnect();\n // }\n }\n\n render() {\n const imageUsed: boolean = hasSlot(this.element, \"image\");\n const headingUsed: boolean = hasSlot(this.element, \"heading\");\n const footerUsed: boolean = hasSlot(this.element, \"footer\");\n const contentUsed: boolean = hasSlot(this.element, \"content\");\n\n const Heading = `h${this.headingLevel}`;\n const Subtitle = `${this.subtitleInteractive ? 'button' : 'span'}`;\n\n const sortableChildElement = this.findSortableChildElement();\n\n const isFirstItemInSortable = sortableChildElement?.parentElement\n && Array.from(sortableChildElement?.parentElement?.children)\n .indexOf(sortableChildElement) === 0;\n\n const isLastItemInSortable = sortableChildElement?.parentElement\n && Array.from(sortableChildElement?.parentElement?.children)\n .indexOf(sortableChildElement) === sortableChildElement?.parentElement?.children.length - 1;\n\n const sortableEnabled = !this.sortableDisabled && this.sortable && !this.sortable.disabled;\n const sortableActionsEnabled = sortableEnabled && !this.hideMovementActions;\n\n // const nonCollapsingTextHeaderActions = this._headerActions.filter(action => !action.onlyCollapseText);\n\n // const headerActions = [\n // ...this._headerActions\n // ];\n\n const hasHeading = !!this.heading || headingUsed;\n\n const hasHeader = hasHeading\n || this._subtitles.length > 0\n || this._headerActions.length > 0\n // || nonCollapsingTextHeaderActions.length > 0\n || this.starrable\n || sortableActionsEnabled;\n\n const hasFooter = footerUsed\n || this._footerActions.length > 0\n || this.selectable\n || !!this.author\n || !!this.date;\n\n const headerActionsWithBadge = this._headerActions.filter(action => !!action.badge || action.badgeEmpty);\n\n const classes = {\n \"stzh-card\": true,\n \"stzh-card--has-link\": !!this.href,\n \"stzh-card--has-image\": imageUsed,\n \"stzh-card--has-content\": contentUsed,\n \"stzh-card--has-subtitle\": !!this.subtitle,\n \"stzh-card--has-subtitle-interactive\": !!this.subtitle && this.subtitleInteractive,\n \"stzh-card--has-header\": hasHeader,\n \"stzh-card--has-footer\": hasFooter,\n \"stzh-card--has-tag\": !!this.tag,\n \"stzh-card--is-collapsible\": this.collapsible,\n \"stzh-card--is-collapsed\": this.collapsed,\n \"stzh-card--is-starred\": this.starred,\n \"stzh-card--is-checked\": this.checked,\n \"stzh-card--is-sortable\": sortableEnabled,\n [`stzh-card--${this.variant}`]: !!this.variant\n };\n\n return (\n <Host role=\"listitem\" aria-label={this.heading} is-sortable={sortableEnabled}>\n <article\n // ref={(el) => (this.mainElement = el as HTMLElement)}\n class={classes}\n >\n <a\n ref={(el) => (this.imageLinkElement = el as HTMLAnchorElement)}\n aria-hidden=\"true\"\n tabindex=\"-1\"\n class=\"stzh-card__image-link\"\n href={this.href}\n target={this.target}\n onClick={this.href ? this.handleCardClick : null}\n >\n <slot name=\"image\"></slot>\n </a>\n <div class=\"stzh-card__content-wrapper\">\n <stzh-icon class=\"stzh-card__dnd\" name=\"drag\"></stzh-icon>\n {this.tag && <div class=\"stzh-card__tag\">{this.tag}</div>}\n\n <header\n // ref={(el) => (this.headerElement = el as HTMLElement)}\n class=\"stzh-card__header\"\n onClick={this.headerClick}\n >\n <div class=\"stzh-card__header-top\">\n <div\n // ref={(el) => (this.headerLeftElement = el as HTMLElement)}\n class=\"stzh-card__header-left\"\n >\n <div class=\"stzh-card__title-area\">\n {hasHeading &&\n <Heading class=\"stzh-card__title\">\n <a\n ref={(el) => (this.titleLinkElement = el as HTMLAnchorElement)}\n class=\"stzh-card__title-link\"\n href={this.href}\n target={this.target}\n onClick={this.href ? this.handleCardClick : null}\n >\n <div ref={(el) => (this.headingTextElement = el as HTMLDivElement)}>\n {this.heading ? this.heading : <slot name=\"heading\"></slot>}\n </div>\n </a>\n </Heading>\n }\n {this._subtitles.length > 0 &&\n <Subtitle class=\"stzh-card__subtitle\" onClick={this.subtitleClick}>\n {this._subtitles.map(subtitle => (\n <span class=\"stzh-card__subtitle-text\">{subtitle}</span>\n ))}\n </Subtitle>\n }\n </div>\n </div>\n <div\n // ref={(el) => (this.headerRightElement = el as HTMLElement)}\n class=\"stzh-card__header-right\"\n >\n <div class=\"stzh-card__card-actions\">\n {/* {this._headerActions.map(action => (\n <stzh-button\n class={{\n \"stzh-card__card-action\": true,\n \"is-button\": true,\n \"show-medium\": !action.onlyCollapseText,\n \"hide-when-collapsed\": !action.onlyCollapseText,\n \"hide-text-when-collapsed\": action.onlyCollapseText\n }}\n icon={action.icon}\n badge={action.badge}\n badgeEmpty={action.badgeEmpty}\n badgeType={action.badgeType}\n variant=\"tertiary\"\n size=\"tiny\"\n badgePosition=\"icon\"\n onClick={(e: MouseEvent) => { this.actionClick(e, action) }}\n >\n <span\n class={{\n \"vshow-medium\": action.onlyCollapseText,\n \"vhide-when-collapsed\": action.onlyCollapseText\n }}\n >\n {action.label}\n </span>\n </stzh-button>\n ))} */}\n\n {this.starrable &&\n <stzh-tooltip>\n <stzh-button\n class=\"stzh-card__card-action is-star\"\n icon={this.starred ? \"star-filled\" : \"star\"}\n variant=\"tertiary\"\n size=\"tiny\"\n iconOnly={true}\n onClick={this.starToggleClick}\n ></stzh-button>\n <div slot=\"content\">\n {this.starred ? this.localization.actionRemove : this.localization.actionAdd}\n </div>\n </stzh-tooltip>\n }\n\n {/* <stzh-actionset actions={headerActions} variant=\"overflow\"></stzh-actionset> */}\n {/* {(nonCollapsingTextHeaderActions.length > 0 || this.starrable || sortableActionsEnabled) && */}\n {(this._headerActions.length > 0 || this.starrable || sortableActionsEnabled) &&\n <stzh-popover\n label={this.localization.actionsPopoverLabel}\n placement=\"bottom-end\"\n class={{\n \"stzh-card__card-action-popover\": true,\n // \"hide-medium show-when-collapsed\": !this.starrable && !sortableActionsEnabled\n }}\n >\n <stzh-button\n class=\"stzh-card__card-action is-further\"\n variant=\"tertiary\"\n size=\"tiny\"\n icon=\"more-vertical\"\n iconOnly={true}\n badge={this.headerActionsBadge}\n badgeEmpty={headerActionsWithBadge.length > 0}\n badgePosition=\"icon\"\n badgeType={this.headerActionsBadgeType || headerActionsWithBadge[0]?.badgeType || \"default\"}\n ></stzh-button>\n <stzh-menu slot=\"content\">\n {/* {nonCollapsingTextHeaderActions.map(action => ( */}\n {this._headerActions.map(action => (\n <stzh-menu-item\n // class=\"hide-medium show-when-collapsed\"\n icon={action.icon}\n badge={action.badge}\n badgeEmpty={action.badgeEmpty}\n badgeType={action.badgeType}\n onClick={(e: MouseEvent) => { this.actionClick(e, action) }}\n >\n {action.label}\n </stzh-menu-item>\n ))}\n\n {sortableActionsEnabled &&\n <Fragment>\n {!isFirstItemInSortable &&\n <stzh-menu-item icon=\"arrow-up\" onClick={this.arrowUpClick}>\n {this.localization.actionMoveUp}\n </stzh-menu-item>\n }\n {!isLastItemInSortable &&\n <stzh-menu-item icon=\"arrow-down\" onClick={this.arrowDownClick}>\n {this.localization.actionMoveDown}\n </stzh-menu-item>\n }\n </Fragment>\n }\n\n {this.starrable &&\n <stzh-menu-item icon={this.starred ? \"star-filled\" : \"star\"} onClick={this.starToggleClick}>\n {this.starred ? this.localization.actionRemove : this.localization.actionAdd}\n </stzh-menu-item>\n }\n </stzh-menu>\n </stzh-popover>\n }\n </div>\n </div>\n </div>\n\n <div class=\"stzh-card__header-meta\">\n <slot name=\"meta\"></slot>\n </div>\n </header>\n\n <div class=\"stzh-card__content hide-when-collapsed\">\n <slot name=\"content\"></slot>\n </div>\n\n <div class=\"stzh-card__footer hide-when-collapsed\">\n {(this.author || this.date) &&\n <div class=\"stzh-card__footer-meta\">\n {this.author &&\n <div class=\"stzh-card__footer-author\">{this.author}</div>\n }\n {this.author && this.date &&\n <div class=\"stzh-card__footer-meta-separator\"></div>\n }\n {this.date &&\n <div class=\"stzh-card__footer-date\">\n {this.dateAdapter.format(new Date(this.date), \"dateInput\")}\n </div>\n }\n </div>\n }\n\n <slot name=\"footer\">\n {this._footerActions.length > 0 &&\n <stzh-actionset\n class=\"stzh-card__footer-actionset\"\n actions={this._footerActions}\n ></stzh-actionset>\n }\n\n {this.selectable &&\n <stzh-button\n class=\"stzh-card__footer-select-button\"\n fullwidth\n type=\"radio\"\n variant=\"secondary\"\n name={this.name}\n value={this.value}\n checked={this.checked}\n disabled={this.disabled}\n label={this.localization.select}\n onStzhChange={this.handleSelectionChange}\n ></stzh-button>\n }\n </slot>\n </div>\n </div>\n </article>\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"stzh-card.js","sourceRoot":"","sources":["../../../../src/components/stzh-card/stzh-card.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Host,\n h,\n Element,\n Prop,\n Watch,\n Event,\n EventEmitter,\n Fragment,\n forceUpdate\n} from \"@stencil/core\";\n\nimport {\n StzhCardHeaderAction,\n StzhActionsetItem,\n StzhCardCollapseEvent,\n StzhCardSubtitleClickEvent,\n StzhCardStarClickEvent,\n StzhCardClickEvent,\n StzhCardHeaderActionClickEvent,\n StzhButtonChangeEvent,\n // StzhLocaleAdapter\n} from \"../../index\";\n\nimport { hasSlot, setPropsIfNull } from \"../../utils/utils\";\n// import { media } from '../../utils/media-utils';\n\nimport { StzhCardLocalizedText } from './stzh-card.localization';\n\n/**\n * @slot heading - Slot for heading\n * @slot image - Slot for optional image element\n * @slot content - Slot for content for any elements\n * @slot meta - Slot for meta elements (status or chip)\n * @slot footer - Slot to replace footer content (`footerActions` and `selectable` button are not shown anymore)\n */\n@Component({\n tag: \"stzh-card\",\n styleUrl: \"stzh-card.scss\",\n scoped: true\n})\nexport class StzhCard {\n /** Translation strings */\n @Prop() localization: StzhCardLocalizedText;\n\n /** Variant */\n @Prop({ reflect: true }) variant: \"default\" | \"service\" = \"default\";\n\n /** Whether card is collapsed or not */\n @Prop({ reflect: true, mutable: true }) collapsed: boolean = false;\n\n /** Whether card was starred */\n @Prop({ reflect: true, mutable: true }) starred: boolean = false;\n\n /**\n * Whether card star is displayed (with tooltip and menu-item in mobile popover).\n * The tooltip / menu-item text can be adjusted in the translations file (`actionAdd` & `actionRemove`).\n */\n @Prop({ reflect: true }) starrable: boolean = false;\n\n /** Whether card is selectable */\n @Prop({ reflect: true }) selectable: boolean = false;\n\n /** Whether card is checked (if card is selectable) */\n @Prop({ reflect: true }) checked: boolean = false;\n\n /** The name of the input element (if card is selectable) */\n @Prop({ reflect: true }) name: string = \"\";\n\n /** Href of card */\n @Prop({ reflect: true }) href: string;\n\n /** target if the button is used as link (if href used) */\n @Prop() target: string;\n\n /** The value of the input element (if card is selectable) */\n @Prop({ mutable: true }) value: string = \"\";\n\n /** Whether the element is disabled or not (if card is selectable) */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /** Heading (or use heading slot instead) */\n @Prop() heading: string = \"\";\n\n /** Heading level */\n @Prop({ reflect: true }) headingLevel: \"1\" | \"2\" | \"3\" | \"4\" = \"3\";\n\n /** Subtitle */\n @Prop() subtitle: string | string[] = \"\";\n private _subtitles = [];\n\n /** Author name */\n // @Prop() author: string;\n\n /** Date to display */\n // @Prop() date: Date | string;\n\n /**\n * Date adapter, for custom parsing/formatting.\n * Must be object with a `parse` function which accepts a `string` and returns a `Date`,\n * and a `format` function which accepts a `Date` and returns a `string`.\n */\n // @Prop() dateAdapter: StzhLocaleAdapter;\n\n /** Tag name */\n // @Prop() tag: string;\n\n /** Card header actions */\n @Prop() headerActions: string | StzhCardHeaderAction[] = [];\n private _headerActions: StzhCardHeaderAction[];\n\n /**\n * Set a badge text if header action badge exists (see headerActionsBadgeType for more info).\n */\n @Prop() headerActionsBadge: string;\n\n /**\n * If a header action with a badge exists inside `headerActions`, the more actions popover will automatically have a empty badge.\n * By default, it takes the badge type from the first one. With this property you can overwrite it.\n */\n @Prop() headerActionsBadgeType: \"default\" | \"success\" | \"warning\" | \"error\" | \"info\";\n\n /**\n * Card footer actions.\n * The [`stzh-actionset`](?path=/story/components-actionset) component is used internally.\n * You can listen to clicks with the `stzhActionClick` event.\n */\n @Prop() footerActions: string | StzhActionsetItem[] = [];\n private _footerActions: StzhActionsetItem[];\n\n /** Whether subtitle should be rendered as button and event `stzhSubtitleClick` executed on click */\n @Prop() subtitleInteractive: boolean = false;\n\n /**\n * Whether sorting should be disabled.\n * Has no effect if card is not inside a `cardlist` element, which has `sortableEnabled` property set to true.\n */\n @Prop({ reflect: true }) sortableDisabled: boolean = false;\n\n /** Whether card is collapsible */\n @Prop({ reflect: true }) collapsible: boolean = false;\n\n /**\n * Whether movement menu items should be shown.\n * Has no effect if card is not inside a `cardlist` element, which has `sortableEnabled` property set to true.\n */\n @Prop() hideMovementActions: boolean = false;\n\n /**\n * For Adobe Analytics.\n * Will be rendered as value of `s-object-id` attribute to the link elements.\n * Default value will be taken from `heading` prop/slot.\n */\n @Prop() analyticsId: string;\n\n @Element() element: HTMLStzhCardElement;\n\n /** Click event (if href is used) */\n @Event() stzhClick: EventEmitter<StzhCardClickEvent>;\n\n /** Collapse event */\n @Event() stzhCollapse: EventEmitter<StzhCardCollapseEvent>;\n\n /** Subtitle click event */\n @Event() stzhSubtitleClick: EventEmitter<StzhCardSubtitleClickEvent>;\n\n /** Star click event */\n @Event() stzhStarClick: EventEmitter<StzhCardStarClickEvent>;\n\n /** Header action click event */\n @Event() stzhHeaderActionClick: EventEmitter<StzhCardHeaderActionClickEvent>;\n\n @Watch(\"subtitle\")\n subtitleWatcher(newValue: string[] | string) {\n if (typeof newValue === \"string\") {\n if (newValue === \"\") {\n this._subtitles = [];\n } else {\n try {\n this._subtitles = JSON.parse(newValue);\n } catch(err) {\n this._subtitles = [newValue];\n }\n }\n } else {\n this._subtitles = newValue;\n }\n }\n\n @Watch(\"headerActions\")\n headerActionsWatcher(newValue: StzhCardHeaderAction[] | string) {\n if (typeof newValue === \"string\") {\n this._headerActions = JSON.parse(newValue);\n } else {\n this._headerActions = newValue;\n }\n }\n\n @Watch(\"footerActions\")\n footerActionsWatcher(newValue: StzhActionsetItem[] | string) {\n if (typeof newValue === \"string\") {\n this._footerActions = JSON.parse(newValue);\n } else {\n this._footerActions = newValue;\n }\n }\n\n // @Watch(\"collapsed\")\n // collapsedWatcher() {\n // this.handleResize();\n // }\n\n private observer: MutationObserver;\n\n private nodeChange = (entries) => {\n let changeInSlot = false;\n\n entries.forEach((entry) => {\n if (entry.target.closest('[slot]') || entry.target.hasAttribute('slot')) {\n changeInSlot = true;\n }\n });\n\n if (changeInSlot) {\n forceUpdate(this.element);\n }\n };\n\n // private mainElement: HTMLElement;\n // private headerElement: HTMLElement;\n // private headerLeftElement: HTMLElement;\n // private headerRightElement: HTMLElement;\n private imageLinkElement: HTMLAnchorElement;\n private titleLinkElement: HTMLAnchorElement;\n private headingTextElement: HTMLDivElement;\n private sortable: HTMLStzhSortableElement;\n\n // private debounceResize: number;\n // private resizeObserver: ResizeObserver;\n\n // private update = () => {\n // if (!this.mainElement) {\n // return;\n // }\n\n // this.mainElement.classList.remove(\"stzh-card--has-collapsed-header\");\n\n // if (media('medium').matches) {\n // const headerWidth = this.headerElement.clientWidth;\n // const leftWidth = this.headerLeftElement.clientWidth;\n // const rightWidth = this.headerRightElement.clientWidth;\n\n // if (headerWidth - leftWidth <= rightWidth) {\n // this.mainElement.classList.add(\"stzh-card--has-collapsed-header\");\n // }\n // }\n // }\n\n private headerClick = (event: MouseEvent) => {\n if (!this.collapsible) {\n return;\n }\n\n const filterTags = [\"stzh-popover\", \"stzh-tooltip\", \"button\", \"a\", \"input\", \"select\", \"textarea\", \"iframe\", \"details\", \"label\", \"area\"];\n const composedPathTags = event.composedPath().map(element => (element as HTMLElement).tagName?.toLowerCase());\n const found = composedPathTags.some(r => filterTags.includes(r))\n\n if (!found) {\n this.collapsed = !this.collapsed;\n\n this.stzhCollapse.emit({\n component: \"stzh-card\",\n collapsed: this.collapsed\n });\n }\n }\n\n private subtitleClick = (event: MouseEvent) => {\n if (this.subtitleInteractive) {\n this.stzhSubtitleClick.emit({\n component: \"stzh-card\",\n originalEvent: event\n });\n }\n }\n\n private starToggleClick = (event: MouseEvent) => {\n this.stzhStarClick.emit({\n component: \"stzh-card\",\n starred: this.starred,\n originalEvent: event\n });\n }\n\n private actionClick = (event: MouseEvent, action: StzhCardHeaderAction) => {\n this.stzhHeaderActionClick.emit({\n component: \"stzh-card\",\n action,\n originalEvent: event\n });\n }\n\n private arrowUpClick = () => {\n const sortable = this.element.closest(\"stzh-sortable\");\n\n if (sortable) {\n const element = this.findSortableChildElement();\n sortable.moveItem(element, \"up\");\n }\n }\n\n private arrowDownClick = () => {\n const sortable = this.element.closest(\"stzh-sortable\");\n\n if (sortable) {\n const element = this.findSortableChildElement();\n sortable.moveItem(element, \"down\");\n }\n }\n\n private updateElementInsideSortable = () => {\n const currentSortable = this.element.closest(\"stzh-sortable\");\n\n // check if element is still inside sortable\n if (!currentSortable) {\n this.sortable.removeEventListener(\"stzhUpdate\", this.updateElementInsideSortable);\n this.sortable.removeEventListener(\"stzhDisable\", this.updateElementInsideSortable)\n return;\n }\n\n if (this.element) {\n forceUpdate(this.element);\n }\n }\n\n private init = () => {\n const chips = this.element.querySelectorAll(\n 'stzh-chip[slot=\"meta\"], [slot=\"meta\"] stzh-chip'\n );\n\n const texts = this.element.querySelectorAll(\n 'stzh-text[slot=\"content\"], [slot=\"meta\"] stzh-text'\n );\n\n chips.forEach((chip) => {\n setPropsIfNull(chip, {\n size: \"small\"\n } as HTMLStzhChipElement)\n });\n\n texts.forEach((text) => {\n setPropsIfNull(text, {\n size: \"inherit\"\n } as HTMLStzhTextElement)\n });\n }\n\n // private handleResize = () => {\n // if (this.debounceResize) {\n // window.cancelAnimationFrame(this.debounceResize);\n // }\n\n // this.debounceResize = requestAnimationFrame(this.update);\n // }\n\n private handleMutation = (entries) => {\n this.init();\n this.nodeChange(entries);\n }\n\n private handleSelectionChange = (event: CustomEvent<StzhButtonChangeEvent>) => {\n this.checked = event.detail.checked;\n }\n\n private handleCardClick = (originalEvent: MouseEvent) => {\n this.stzhClick.emit({\n component: \"stzh-card\",\n originalEvent\n });\n }\n\n private findSortableChildElement(): HTMLElement | undefined {\n const sortable = this.element.closest(\"stzh-sortable\");\n\n if (sortable) {\n let element: HTMLElement = this.element;\n let sortableContainer = null;\n\n if (typeof sortable.container === \"function\") {\n sortableContainer = sortable.container();\n } else {\n sortableContainer = sortable.container;\n }\n\n while (element.parentElement && element.parentElement !== sortableContainer) {\n element = element.parentElement;\n }\n\n return element;\n }\n }\n\n async componentWillLoad() {\n this.subtitleWatcher(this.subtitle);\n this.headerActionsWatcher(this.headerActions);\n this.footerActionsWatcher(this.footerActions);\n\n if (!this.localization) {\n this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"card\");\n }\n\n // if (!this.dateAdapter) {\n // this.dateAdapter = window.stzhComponents.utils.createFormatParseAdapter(\n // this.localization.$formats,\n // this.localization.$globals\n // );\n // }\n }\n\n componentDidLoad() {\n this.sortable = this.element.closest(\"stzh-sortable\");\n\n if (this.sortable) {\n this.sortable.addEventListener(\"stzhUpdate\", this.updateElementInsideSortable);\n this.sortable.addEventListener(\"stzhDisable\", this.updateElementInsideSortable)\n }\n }\n\n componentDidRender() {\n requestAnimationFrame(() => {\n const objectId = this.analyticsId || this.headingTextElement?.innerText;\n\n if (objectId) {\n this.imageLinkElement?.setAttribute(\"s-object-id\", objectId);\n this.titleLinkElement?.setAttribute(\"s-object-id\", objectId);\n }\n });\n }\n\n connectedCallback() {\n this.init();\n\n this.observer = new MutationObserver(this.handleMutation);\n this.observer.observe(this.element, {\n childList: true,\n subtree: true\n });\n\n // this.resizeObserver = new ResizeObserver(this.handleResize);\n // this.resizeObserver.observe(this.element);\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\n }\n\n // if (this.resizeObserver) {\n // this.resizeObserver.disconnect();\n // }\n }\n\n render() {\n const imageUsed: boolean = hasSlot(this.element, \"image\");\n const headingUsed: boolean = hasSlot(this.element, \"heading\");\n const footerUsed: boolean = hasSlot(this.element, \"footer\");\n const contentUsed: boolean = hasSlot(this.element, \"content\");\n\n const Heading = `h${this.headingLevel}`;\n const Subtitle = `${this.subtitleInteractive ? 'button' : 'span'}`;\n\n const sortableChildElement = this.findSortableChildElement();\n\n const isFirstItemInSortable = sortableChildElement?.parentElement\n && Array.from(sortableChildElement?.parentElement?.children)\n .indexOf(sortableChildElement) === 0;\n\n const isLastItemInSortable = sortableChildElement?.parentElement\n && Array.from(sortableChildElement?.parentElement?.children)\n .indexOf(sortableChildElement) === sortableChildElement?.parentElement?.children.length - 1;\n\n const sortableEnabled = !this.sortableDisabled && this.sortable && !this.sortable.disabled;\n const sortableActionsEnabled = sortableEnabled && !this.hideMovementActions;\n\n // const nonCollapsingTextHeaderActions = this._headerActions.filter(action => !action.onlyCollapseText);\n\n // const headerActions = [\n // ...this._headerActions\n // ];\n\n const hasHeading = !!this.heading || headingUsed;\n\n const hasHeader = hasHeading\n || this._subtitles.length > 0\n || this._headerActions.length > 0\n // || nonCollapsingTextHeaderActions.length > 0\n || this.starrable\n || sortableActionsEnabled;\n\n const hasFooter = footerUsed\n || this._footerActions.length > 0\n || this.selectable\n // || !!this.author\n // || !!this.date;\n\n const headerActionsWithBadge = this._headerActions.filter(action => !!action.badge || action.badgeEmpty);\n\n const classes = {\n \"stzh-card\": true,\n \"stzh-card--has-link\": !!this.href,\n \"stzh-card--has-image\": imageUsed,\n \"stzh-card--has-content\": contentUsed,\n \"stzh-card--has-subtitle\": !!this.subtitle,\n \"stzh-card--has-subtitle-interactive\": !!this.subtitle && this.subtitleInteractive,\n \"stzh-card--has-header\": hasHeader,\n \"stzh-card--has-footer\": hasFooter,\n // \"stzh-card--has-tag\": !!this.tag,\n \"stzh-card--is-collapsible\": this.collapsible,\n \"stzh-card--is-collapsed\": this.collapsed,\n \"stzh-card--is-starred\": this.starred,\n \"stzh-card--is-checked\": this.checked,\n \"stzh-card--is-sortable\": sortableEnabled,\n [`stzh-card--${this.variant}`]: !!this.variant\n };\n\n return (\n <Host role=\"listitem\" aria-label={this.heading} is-sortable={sortableEnabled}>\n <article\n // ref={(el) => (this.mainElement = el as HTMLElement)}\n class={classes}\n >\n <a\n ref={(el) => (this.imageLinkElement = el as HTMLAnchorElement)}\n aria-hidden=\"true\"\n tabindex=\"-1\"\n class=\"stzh-card__image-link\"\n href={this.href}\n target={this.target}\n onClick={this.href ? this.handleCardClick : null}\n >\n <slot name=\"image\"></slot>\n </a>\n <div class=\"stzh-card__content-wrapper\">\n <stzh-icon class=\"stzh-card__dnd\" name=\"drag\"></stzh-icon>\n {/* {this.tag && <div class=\"stzh-card__tag\">{this.tag}</div>} */}\n\n <header\n // ref={(el) => (this.headerElement = el as HTMLElement)}\n class=\"stzh-card__header\"\n onClick={this.headerClick}\n >\n <div class=\"stzh-card__header-top\">\n <div\n // ref={(el) => (this.headerLeftElement = el as HTMLElement)}\n class=\"stzh-card__header-left\"\n >\n <div class=\"stzh-card__title-area\">\n {hasHeading &&\n <Heading class=\"stzh-card__title\">\n <a\n ref={(el) => (this.titleLinkElement = el as HTMLAnchorElement)}\n class=\"stzh-card__title-link\"\n href={this.href}\n target={this.target}\n onClick={this.href ? this.handleCardClick : null}\n >\n <div ref={(el) => (this.headingTextElement = el as HTMLDivElement)}>\n {this.heading ? this.heading : <slot name=\"heading\"></slot>}\n </div>\n </a>\n </Heading>\n }\n {this._subtitles.length > 0 &&\n <Subtitle class=\"stzh-card__subtitle\" onClick={this.subtitleClick}>\n {this._subtitles.map(subtitle => (\n <span class=\"stzh-card__subtitle-text\">{subtitle}</span>\n ))}\n </Subtitle>\n }\n </div>\n </div>\n <div\n // ref={(el) => (this.headerRightElement = el as HTMLElement)}\n class=\"stzh-card__header-right\"\n >\n <div class=\"stzh-card__card-actions\">\n {/* {this._headerActions.map(action => (\n <stzh-button\n class={{\n \"stzh-card__card-action\": true,\n \"is-button\": true,\n \"show-medium\": !action.onlyCollapseText,\n \"hide-when-collapsed\": !action.onlyCollapseText,\n \"hide-text-when-collapsed\": action.onlyCollapseText\n }}\n icon={action.icon}\n badge={action.badge}\n badgeEmpty={action.badgeEmpty}\n badgeType={action.badgeType}\n variant=\"tertiary\"\n size=\"tiny\"\n badgePosition=\"icon\"\n onClick={(e: MouseEvent) => { this.actionClick(e, action) }}\n >\n <span\n class={{\n \"vshow-medium\": action.onlyCollapseText,\n \"vhide-when-collapsed\": action.onlyCollapseText\n }}\n >\n {action.label}\n </span>\n </stzh-button>\n ))} */}\n\n {this.starrable &&\n <stzh-tooltip>\n <stzh-button\n class=\"stzh-card__card-action is-star\"\n icon={this.starred ? \"star-filled\" : \"star\"}\n variant=\"tertiary\"\n size=\"tiny\"\n iconOnly={true}\n onClick={this.starToggleClick}\n ></stzh-button>\n <div slot=\"content\">\n {this.starred ? this.localization.actionRemove : this.localization.actionAdd}\n </div>\n </stzh-tooltip>\n }\n\n {/* <stzh-actionset actions={headerActions} variant=\"overflow\"></stzh-actionset> */}\n {/* {(nonCollapsingTextHeaderActions.length > 0 || this.starrable || sortableActionsEnabled) && */}\n {(this._headerActions.length > 0 || this.starrable || sortableActionsEnabled) &&\n <stzh-popover\n label={this.localization.actionsPopoverLabel}\n placement=\"bottom-end\"\n class={{\n \"stzh-card__card-action-popover\": true,\n // \"hide-medium show-when-collapsed\": !this.starrable && !sortableActionsEnabled\n }}\n >\n <stzh-button\n class=\"stzh-card__card-action is-further\"\n variant=\"tertiary\"\n size=\"tiny\"\n icon=\"more-vertical\"\n iconOnly={true}\n badge={this.headerActionsBadge}\n badgeEmpty={headerActionsWithBadge.length > 0}\n badgePosition=\"icon\"\n badgeType={this.headerActionsBadgeType || headerActionsWithBadge[0]?.badgeType || \"default\"}\n ></stzh-button>\n <stzh-menu slot=\"content\">\n {/* {nonCollapsingTextHeaderActions.map(action => ( */}\n {this._headerActions.map(action => (\n <stzh-menu-item\n // class=\"hide-medium show-when-collapsed\"\n icon={action.icon}\n badge={action.badge}\n badgeEmpty={action.badgeEmpty}\n badgeType={action.badgeType}\n onClick={(e: MouseEvent) => { this.actionClick(e, action) }}\n >\n {action.label}\n </stzh-menu-item>\n ))}\n\n {sortableActionsEnabled &&\n <Fragment>\n {!isFirstItemInSortable &&\n <stzh-menu-item icon=\"arrow-up\" onClick={this.arrowUpClick}>\n {this.localization.actionMoveUp}\n </stzh-menu-item>\n }\n {!isLastItemInSortable &&\n <stzh-menu-item icon=\"arrow-down\" onClick={this.arrowDownClick}>\n {this.localization.actionMoveDown}\n </stzh-menu-item>\n }\n </Fragment>\n }\n\n {this.starrable &&\n <stzh-menu-item icon={this.starred ? \"star-filled\" : \"star\"} onClick={this.starToggleClick}>\n {this.starred ? this.localization.actionRemove : this.localization.actionAdd}\n </stzh-menu-item>\n }\n </stzh-menu>\n </stzh-popover>\n }\n </div>\n </div>\n </div>\n\n <div class=\"stzh-card__header-meta\">\n <slot name=\"meta\"></slot>\n </div>\n </header>\n\n <div class=\"stzh-card__content hide-when-collapsed\">\n <slot name=\"content\"></slot>\n </div>\n\n <div class=\"stzh-card__footer hide-when-collapsed\">\n {/* {(this.author || this.date) &&\n <div class=\"stzh-card__footer-meta\">\n {this.author &&\n <div class=\"stzh-card__footer-author\">{this.author}</div>\n }\n {this.author && this.date &&\n <div class=\"stzh-card__footer-meta-separator\"></div>\n }\n {this.date &&\n <div class=\"stzh-card__footer-date\">\n {this.dateAdapter.format(new Date(this.date), \"dateInput\")}\n </div>\n }\n </div>\n } */}\n\n <slot name=\"footer\">\n {this._footerActions.length > 0 &&\n <stzh-actionset\n class=\"stzh-card__footer-actionset\"\n actions={this._footerActions}\n ></stzh-actionset>\n }\n\n {this.selectable &&\n <stzh-button\n class=\"stzh-card__footer-select-button\"\n fullwidth\n type=\"radio\"\n variant=\"secondary\"\n name={this.name}\n value={this.value}\n checked={this.checked}\n disabled={this.disabled}\n label={this.localization.select}\n onStzhChange={this.handleSelectionChange}\n ></stzh-button>\n }\n </slot>\n </div>\n </div>\n </article>\n </Host>\n );\n }\n}\n"]}
@@ -34,13 +34,6 @@ const TEMPLATE_STARRABLE = `
34
34
  </stzh-card>
35
35
  `;
36
36
 
37
- const TEMPLATE_PUBLICATION = `
38
- <stzh-card>
39
- <img slot="image" src="media/images/example.jpg" loading="lazy" alt="Example image" />
40
- <div slot="content">Card Content</div>
41
- </stzh-card>
42
- `;
43
-
44
37
  export default {
45
38
  title: 'Components/Card',
46
39
  component: COMPONENT_NAME,
@@ -149,13 +142,3 @@ export const Starrable = {
149
142
  footerActions: footerActions
150
143
  }
151
144
  };
152
-
153
- export const Publication = {
154
- render: (args) => story(args, TEMPLATE_PUBLICATION),
155
- args: {
156
- heading: 'Lorem ipsum',
157
- author: 'Max Mustermann',
158
- date: '2019-11-20',
159
- tag: 'Lorem ipsum'
160
- }
161
- };
@@ -172,6 +172,7 @@
172
172
  --icon-gap: var(--stzh-space-xsmall);
173
173
  --counter-color: var(--color);
174
174
  --counter-gap: var(--stzh-space-xsmall);
175
+ --outer-height: 2.5rem;
175
176
  --hover-color: var(--stzh-chip-hover-color, var(--stzh-color-primary70));
176
177
  --hover-background-color: var(--stzh-chip-hover-background-color, var(--stzh-color-secondary40));
177
178
  --hover-remove-color: var(--hover-color);
@@ -180,6 +181,11 @@
180
181
  --hover-counter-color: var(--hover-color);
181
182
  display: inline-flex;
182
183
  }
184
+ @media screen and (min-width: 900px) {
185
+ :host {
186
+ --outer-height: auto;
187
+ }
188
+ }
183
189
  @media (forced-colors: active), (-ms-high-contrast: active) {
184
190
  :host {
185
191
  --hover-color: Highlight;
@@ -311,7 +317,19 @@
311
317
  .stzh-chip__button {
312
318
  font-size: var(--stzh-font-micro-font-size);
313
319
  line-height: var(--stzh-font-micro-text-line-height);
320
+ min-height: var(--outer-height);
314
321
  font-family: inherit;
322
+ -webkit-appearance: none;
323
+ -moz-appearance: none;
324
+ appearance: none;
325
+ padding: 0px;
326
+ border: none;
327
+ background-color: transparent;
328
+ }
329
+ .stzh-chip__button.is-button, .stzh-chip__button.is-link {
330
+ cursor: pointer;
331
+ }
332
+ .stzh-chip__button-inner {
315
333
  height: var(--height);
316
334
  display: flex;
317
335
  flex-direction: row;
@@ -322,19 +340,12 @@
322
340
  padding-left: var(--padding-left);
323
341
  padding-right: var(--padding-right);
324
342
  color: var(--color);
325
- -webkit-appearance: none;
326
- -moz-appearance: none;
327
- appearance: none;
328
- border: none;
329
343
  background-color: var(--background-color);
330
344
  transition-duration: var(--stzh-base-transition-animation-speed);
331
345
  transition-property: color, background-color;
332
346
  -webkit-text-decoration-line: none;
333
347
  text-decoration-line: none;
334
348
  }
335
- .stzh-chip__button.is-button, .stzh-chip__button.is-link {
336
- cursor: pointer;
337
- }
338
349
  .stzh-chip__label {
339
350
  text-align: left;
340
351
  }
@@ -357,7 +368,8 @@
357
368
  }
358
369
  .stzh-chip__remove {
359
370
  position: absolute;
360
- top: 0;
371
+ top: 50%;
372
+ transform: translateY(-50%);
361
373
  right: 0;
362
374
  -webkit-appearance: none;
363
375
  -moz-appearance: none;
@@ -385,7 +397,7 @@
385
397
  .stzh-chip__remove-icon {
386
398
  --size: var(--stzh-icon-size-xxsmall);
387
399
  }
388
- .stzh-chip__button:hover, .stzh-chip__remove:hover + .stzh-chip__button {
400
+ .stzh-chip__button:hover .stzh-chip__button-inner, .stzh-chip__remove:hover + .stzh-chip__button .stzh-chip__button-inner {
389
401
  color: var(--hover-color);
390
402
  background-color: var(--hover-background-color);
391
403
  }
@@ -399,7 +411,7 @@
399
411
  font-size: var(--stzh-font-nano-font-size);
400
412
  line-height: var(--stzh-font-nano-text-line-height);
401
413
  }
402
- .stzh-chip--is-removable .stzh-chip__button {
414
+ .stzh-chip--is-removable .stzh-chip__button-inner {
403
415
  padding-right: calc(var(--height) + var(--stzh-space-xxsmall));
404
416
  }
405
417
  .stzh-chip--is-disabled .stzh-chip__button, .stzh-chip--is-disabled .stzh-chip__remove {
@@ -1,4 +1,4 @@
1
- import { Host, h, Fragment } from "@stencil/core";
1
+ import { Host, h } from "@stencil/core";
2
2
  /**
3
3
  * @slot - Slot for label
4
4
  * @slot icon - Slot for icon
@@ -76,7 +76,7 @@ export class StzhChip {
76
76
  });
77
77
  }
78
78
  renderInner() {
79
- return (h(Fragment, null, h("div", { class: "stzh-chip__icon-wrapper" }, this.icon || (typeof this.icon === "undefined" && this.variant === "tag" && this.type !== "default") ?
79
+ return (h("div", { class: "stzh-chip__button-inner" }, h("div", { class: "stzh-chip__icon-wrapper" }, this.icon || (typeof this.icon === "undefined" && this.variant === "tag" && this.type !== "default") ?
80
80
  h("stzh-icon", { class: "stzh-chip__icon", name: this.icon
81
81
  || this.type === "info" && "info-help"
82
82
  || this.type === "warning" && "important-warning"