@zanichelli/albe-web-components 15.0.1-RC → 15.0.2

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 (372) hide show
  1. package/CHANGELOG.md +5 -1
  2. package/dist/cjs/index-5dc4a8de.js +10 -2
  3. package/dist/cjs/loader.cjs.js +1 -1
  4. package/dist/cjs/{utils-f5f944ed.js → utils-2b313a8e.js} +1 -1
  5. package/dist/cjs/{utils-f5f944ed.js.map → utils-2b313a8e.js.map} +1 -1
  6. package/dist/cjs/web-components-library.cjs.js +1 -1
  7. package/dist/cjs/{z-app-header_15.cjs.entry.js → z-app-header_12.cjs.entry.js} +21 -1240
  8. package/dist/cjs/z-app-header_12.cjs.entry.js.map +1 -0
  9. package/dist/cjs/z-book-card.cjs.entry.js +1 -1
  10. package/dist/cjs/z-book-card.cjs.entry.js.map +1 -1
  11. package/dist/cjs/z-card.cjs.entry.js +1 -1
  12. package/dist/cjs/z-card.cjs.entry.js.map +1 -1
  13. package/dist/cjs/z-date-picker.cjs.entry.js +1 -1
  14. package/dist/cjs/z-dragdrop-area_2.cjs.entry.js +1033 -0
  15. package/dist/cjs/z-dragdrop-area_2.cjs.entry.js.map +1 -0
  16. package/dist/cjs/z-file-upload.cjs.entry.js +215 -0
  17. package/dist/cjs/z-file-upload.cjs.entry.js.map +1 -0
  18. package/dist/cjs/z-myz-card-list.cjs.entry.js +1 -1
  19. package/dist/cjs/z-myz-card-list.cjs.entry.js.map +1 -1
  20. package/dist/cjs/z-navigation-tabs.cjs.entry.js +1 -1
  21. package/dist/cjs/z-navigation-tabs.cjs.entry.js.map +1 -1
  22. package/dist/cjs/z-notification.cjs.entry.js +1 -1
  23. package/dist/cjs/z-notification.cjs.entry.js.map +1 -1
  24. package/dist/cjs/z-otp.cjs.entry.js +1 -1
  25. package/dist/cjs/z-otp.cjs.entry.js.map +1 -1
  26. package/dist/cjs/z-range-picker.cjs.entry.js +1 -1
  27. package/dist/cjs/z-slideshow.cjs.entry.js +1 -1
  28. package/dist/cjs/z-slideshow.cjs.entry.js.map +1 -1
  29. package/dist/cjs/z-stepper.cjs.entry.js +1 -1
  30. package/dist/cjs/z-stepper.cjs.entry.js.map +1 -1
  31. package/dist/cjs/z-toast-notification.cjs.entry.js +1 -1
  32. package/dist/cjs/z-toast-notification.cjs.entry.js.map +1 -1
  33. package/dist/collection/components/file-upload/z-file-upload/index.js +1 -1
  34. package/dist/collection/components/file-upload/z-file-upload/index.js.map +1 -1
  35. package/dist/collection/components/file-upload/z-file-upload/index.spec.js +3 -3
  36. package/dist/collection/components/file-upload/z-file-upload/index.spec.js.map +1 -1
  37. package/dist/collection/components/file-upload/z-file-upload/styles.css +5 -0
  38. package/dist/collection/components/z-app-header/styles.css +5 -0
  39. package/dist/collection/components/z-book-card/styles.css +10 -0
  40. package/dist/collection/components/z-card/styles.css +15 -0
  41. package/dist/collection/components/z-input/styles-checkbox-radio.css +8 -1
  42. package/dist/collection/components/z-input/styles-general.css +1 -1
  43. package/dist/collection/components/z-input/styles-text.css +5 -0
  44. package/dist/collection/components/z-modal/index.js +13 -4
  45. package/dist/collection/components/z-modal/index.js.map +1 -1
  46. package/dist/collection/components/z-modal/styles.css +18 -19
  47. package/dist/collection/components/z-navigation-tabs/styles.css +1 -1
  48. package/dist/collection/components/z-notification/styles.css +6 -1
  49. package/dist/collection/components/z-searchbar/styles.css +5 -0
  50. package/dist/collection/components/z-stepper/index.js +2 -2
  51. package/dist/collection/components/z-stepper/index.js.map +1 -1
  52. package/dist/collection/components/z-stepper/index.stories.js +44 -3
  53. package/dist/collection/components/z-stepper/index.stories.js.map +1 -1
  54. package/dist/collection/components/z-stepper-item/index.stories.js +44 -19
  55. package/dist/collection/components/z-stepper-item/index.stories.js.map +1 -1
  56. package/dist/collection/components/z-tag/index.stories.js +11 -7
  57. package/dist/collection/components/z-tag/index.stories.js.map +1 -1
  58. package/dist/collection/components/z-toast-notification/styles.css +12 -0
  59. package/dist/collection/snowflakes/myz/card/z-myz-card-list/styles.css +5 -0
  60. package/dist/collection/snowflakes/myz/z-otp/styles.css +5 -0
  61. package/dist/collection/snowflakes/myz/z-slideshow/styles.css +7 -0
  62. package/dist/components/index10.js +3 -3
  63. package/dist/components/index10.js.map +1 -1
  64. package/dist/components/index15.js +14 -5
  65. package/dist/components/index15.js.map +1 -1
  66. package/dist/components/index26.js +1 -1
  67. package/dist/components/index26.js.map +1 -1
  68. package/dist/components/z-app-header.js +1 -1
  69. package/dist/components/z-app-header.js.map +1 -1
  70. package/dist/components/z-book-card.js +1 -1
  71. package/dist/components/z-book-card.js.map +1 -1
  72. package/dist/components/z-card.js +1 -1
  73. package/dist/components/z-card.js.map +1 -1
  74. package/dist/components/z-file-upload.js +2 -2
  75. package/dist/components/z-file-upload.js.map +1 -1
  76. package/dist/components/z-myz-card-list.js +1 -1
  77. package/dist/components/z-myz-card-list.js.map +1 -1
  78. package/dist/components/z-navigation-tabs.js +1 -1
  79. package/dist/components/z-navigation-tabs.js.map +1 -1
  80. package/dist/components/z-notification.js +1 -1
  81. package/dist/components/z-notification.js.map +1 -1
  82. package/dist/components/z-otp.js +1 -1
  83. package/dist/components/z-otp.js.map +1 -1
  84. package/dist/components/z-slideshow.js +1 -1
  85. package/dist/components/z-slideshow.js.map +1 -1
  86. package/dist/components/z-stepper.js +1 -1
  87. package/dist/components/z-stepper.js.map +1 -1
  88. package/dist/components/z-toast-notification.js +1 -1
  89. package/dist/components/z-toast-notification.js.map +1 -1
  90. package/dist/esm/index-ab5f1eaa.js +10 -2
  91. package/dist/esm/loader.js +1 -1
  92. package/dist/esm/{utils-ba4f0770.js → utils-cd008fbc.js} +1 -1
  93. package/dist/esm/{utils-ba4f0770.js.map → utils-cd008fbc.js.map} +1 -1
  94. package/dist/esm/web-components-library.js +1 -1
  95. package/dist/esm/{z-app-header_15.entry.js → z-app-header_12.entry.js} +24 -1240
  96. package/dist/esm/z-app-header_12.entry.js.map +1 -0
  97. package/dist/esm/z-book-card.entry.js +1 -1
  98. package/dist/esm/z-book-card.entry.js.map +1 -1
  99. package/dist/esm/z-card.entry.js +1 -1
  100. package/dist/esm/z-card.entry.js.map +1 -1
  101. package/dist/esm/z-date-picker.entry.js +1 -1
  102. package/dist/esm/z-dragdrop-area_2.entry.js +1028 -0
  103. package/dist/esm/z-dragdrop-area_2.entry.js.map +1 -0
  104. package/dist/esm/z-file-upload.entry.js +211 -0
  105. package/dist/esm/z-file-upload.entry.js.map +1 -0
  106. package/dist/esm/z-myz-card-list.entry.js +1 -1
  107. package/dist/esm/z-myz-card-list.entry.js.map +1 -1
  108. package/dist/esm/z-navigation-tabs.entry.js +1 -1
  109. package/dist/esm/z-navigation-tabs.entry.js.map +1 -1
  110. package/dist/esm/z-notification.entry.js +1 -1
  111. package/dist/esm/z-notification.entry.js.map +1 -1
  112. package/dist/esm/z-otp.entry.js +1 -1
  113. package/dist/esm/z-otp.entry.js.map +1 -1
  114. package/dist/esm/z-range-picker.entry.js +1 -1
  115. package/dist/esm/z-slideshow.entry.js +1 -1
  116. package/dist/esm/z-slideshow.entry.js.map +1 -1
  117. package/dist/esm/z-stepper.entry.js +1 -1
  118. package/dist/esm/z-stepper.entry.js.map +1 -1
  119. package/dist/esm/z-toast-notification.entry.js +1 -1
  120. package/dist/esm/z-toast-notification.entry.js.map +1 -1
  121. package/dist/esm-es5/index-ab5f1eaa.js +1 -1
  122. package/dist/esm-es5/index-ab5f1eaa.js.map +1 -1
  123. package/dist/esm-es5/loader.js +1 -1
  124. package/dist/esm-es5/loader.js.map +1 -1
  125. package/dist/esm-es5/{utils-ba4f0770.js → utils-cd008fbc.js} +1 -1
  126. package/dist/esm-es5/web-components-library.js +1 -1
  127. package/dist/esm-es5/web-components-library.js.map +1 -1
  128. package/dist/esm-es5/z-app-header_12.entry.js +2 -0
  129. package/dist/esm-es5/z-app-header_12.entry.js.map +1 -0
  130. package/dist/esm-es5/z-book-card.entry.js +1 -1
  131. package/dist/esm-es5/z-book-card.entry.js.map +1 -1
  132. package/dist/esm-es5/z-card.entry.js +1 -1
  133. package/dist/esm-es5/z-card.entry.js.map +1 -1
  134. package/dist/esm-es5/z-date-picker.entry.js +1 -1
  135. package/dist/esm-es5/z-dragdrop-area_2.entry.js +2 -0
  136. package/dist/esm-es5/z-dragdrop-area_2.entry.js.map +1 -0
  137. package/dist/esm-es5/z-file-upload.entry.js +2 -0
  138. package/dist/esm-es5/z-file-upload.entry.js.map +1 -0
  139. package/dist/esm-es5/z-myz-card-list.entry.js +1 -1
  140. package/dist/esm-es5/z-myz-card-list.entry.js.map +1 -1
  141. package/dist/esm-es5/z-navigation-tabs.entry.js +1 -1
  142. package/dist/esm-es5/z-navigation-tabs.entry.js.map +1 -1
  143. package/dist/esm-es5/z-notification.entry.js +1 -1
  144. package/dist/esm-es5/z-notification.entry.js.map +1 -1
  145. package/dist/esm-es5/z-otp.entry.js +1 -1
  146. package/dist/esm-es5/z-otp.entry.js.map +1 -1
  147. package/dist/esm-es5/z-range-picker.entry.js +1 -1
  148. package/dist/esm-es5/z-slideshow.entry.js +1 -1
  149. package/dist/esm-es5/z-slideshow.entry.js.map +1 -1
  150. package/dist/esm-es5/z-stepper.entry.js +1 -1
  151. package/dist/esm-es5/z-stepper.entry.js.map +1 -1
  152. package/dist/esm-es5/z-toast-notification.entry.js +1 -1
  153. package/dist/esm-es5/z-toast-notification.entry.js.map +1 -1
  154. package/dist/types/components/z-modal/index.d.ts +1 -0
  155. package/dist/types/components/z-stepper/index.d.ts +1 -1
  156. package/dist/types/components/z-stepper/index.stories.d.ts +6 -0
  157. package/dist/types/components/z-stepper-item/index.stories.d.ts +22 -9
  158. package/dist/types/components/z-tag/index.stories.d.ts +6 -2
  159. package/dist/web-components-library/p-0108191f.system.entry.js +2 -0
  160. package/dist/web-components-library/{p-ffee2568.system.entry.js.map → p-0108191f.system.entry.js.map} +1 -1
  161. package/dist/web-components-library/p-05827ca5.entry.js +2 -0
  162. package/dist/web-components-library/{p-8f28871c.entry.js.map → p-05827ca5.entry.js.map} +1 -1
  163. package/dist/web-components-library/p-0a6424ef.entry.js +2 -0
  164. package/dist/web-components-library/p-0a6424ef.entry.js.map +1 -0
  165. package/dist/web-components-library/p-0bde1f0e.entry.js +2 -0
  166. package/dist/web-components-library/{p-df6ef4b4.entry.js.map → p-0bde1f0e.entry.js.map} +1 -1
  167. package/{www/build/p-3b801ea6.entry.js → dist/web-components-library/p-0e342fa3.entry.js} +2 -2
  168. package/dist/web-components-library/{p-fb6c02f1.entry.js → p-114088a1.entry.js} +2 -2
  169. package/dist/web-components-library/p-12008903.system.entry.js +2 -0
  170. package/dist/web-components-library/p-12008903.system.entry.js.map +1 -0
  171. package/dist/web-components-library/p-16b1b35a.entry.js +2 -0
  172. package/dist/web-components-library/p-16b1b35a.entry.js.map +1 -0
  173. package/dist/web-components-library/p-21941767.entry.js +2 -0
  174. package/dist/web-components-library/p-21941767.entry.js.map +1 -0
  175. package/dist/web-components-library/p-22d9f9c3.entry.js +2 -0
  176. package/dist/web-components-library/p-22d9f9c3.entry.js.map +1 -0
  177. package/dist/web-components-library/p-23975a98.system.entry.js +2 -0
  178. package/dist/web-components-library/p-23975a98.system.entry.js.map +1 -0
  179. package/dist/web-components-library/p-25872e04.system.entry.js +2 -0
  180. package/dist/web-components-library/p-25872e04.system.entry.js.map +1 -0
  181. package/{www/build/p-7519c72d.system.entry.js → dist/web-components-library/p-2dd2d037.system.entry.js} +2 -2
  182. package/dist/web-components-library/p-2df54d7d.entry.js +2 -0
  183. package/dist/web-components-library/p-2df54d7d.entry.js.map +1 -0
  184. package/dist/web-components-library/p-33368291.system.entry.js +2 -0
  185. package/dist/web-components-library/p-33368291.system.entry.js.map +1 -0
  186. package/dist/web-components-library/p-49256720.system.entry.js +2 -0
  187. package/dist/web-components-library/p-49256720.system.entry.js.map +1 -0
  188. package/{www/build/p-662c8342.js → dist/web-components-library/p-49a35cf0.js} +1 -1
  189. package/dist/web-components-library/p-4d0200ca.system.entry.js +2 -0
  190. package/dist/web-components-library/p-4d0200ca.system.entry.js.map +1 -0
  191. package/dist/web-components-library/p-5a6d6203.system.entry.js +2 -0
  192. package/dist/web-components-library/p-5a6d6203.system.entry.js.map +1 -0
  193. package/dist/web-components-library/{p-22610d00.entry.js → p-6830461d.entry.js} +2 -2
  194. package/dist/web-components-library/p-6830461d.entry.js.map +1 -0
  195. package/{www/build/p-461cf578.system.entry.js → dist/web-components-library/p-751c58e2.system.entry.js} +2 -2
  196. package/dist/web-components-library/{p-dead4830.system.js → p-7dd29d4d.system.js} +1 -1
  197. package/dist/web-components-library/p-7e5ae5bd.entry.js +2 -0
  198. package/dist/web-components-library/p-7e5ae5bd.entry.js.map +1 -0
  199. package/dist/web-components-library/p-8078896f.system.entry.js +2 -0
  200. package/dist/web-components-library/p-8078896f.system.entry.js.map +1 -0
  201. package/dist/web-components-library/p-9450cc97.system.entry.js +2 -0
  202. package/dist/web-components-library/p-9450cc97.system.entry.js.map +1 -0
  203. package/dist/web-components-library/{p-eea9f7fd.system.entry.js → p-9551ea7a.system.entry.js} +2 -2
  204. package/dist/web-components-library/{p-eea9f7fd.system.entry.js.map → p-9551ea7a.system.entry.js.map} +1 -1
  205. package/dist/web-components-library/p-a5f739b0.entry.js +2 -0
  206. package/dist/web-components-library/p-a5f739b0.entry.js.map +1 -0
  207. package/dist/web-components-library/p-d2a11d41.system.entry.js +2 -0
  208. package/dist/web-components-library/p-d2a11d41.system.entry.js.map +1 -0
  209. package/dist/web-components-library/p-f3ef3a26.entry.js +2 -0
  210. package/dist/web-components-library/p-f3ef3a26.entry.js.map +1 -0
  211. package/dist/web-components-library/p-f530271b.system.js +1 -1
  212. package/dist/web-components-library/p-f530271b.system.js.map +1 -1
  213. package/dist/web-components-library/p-ff54b247.entry.js +2 -0
  214. package/dist/web-components-library/p-ff54b247.entry.js.map +1 -0
  215. package/dist/web-components-library/web-components-library.css +4 -3
  216. package/dist/web-components-library/web-components-library.esm.js +1 -1
  217. package/dist/web-components-library/web-components-library.esm.js.map +1 -1
  218. package/package.json +2 -2
  219. package/www/build/p-0108191f.system.entry.js +2 -0
  220. package/www/build/{p-ffee2568.system.entry.js.map → p-0108191f.system.entry.js.map} +1 -1
  221. package/www/build/p-05827ca5.entry.js +2 -0
  222. package/www/build/{p-8f28871c.entry.js.map → p-05827ca5.entry.js.map} +1 -1
  223. package/www/build/p-0a6424ef.entry.js +2 -0
  224. package/www/build/p-0a6424ef.entry.js.map +1 -0
  225. package/www/build/p-0bde1f0e.entry.js +2 -0
  226. package/www/build/{p-df6ef4b4.entry.js.map → p-0bde1f0e.entry.js.map} +1 -1
  227. package/{dist/web-components-library/p-3b801ea6.entry.js → www/build/p-0e342fa3.entry.js} +2 -2
  228. package/www/build/{p-fb6c02f1.entry.js → p-114088a1.entry.js} +2 -2
  229. package/www/build/p-12008903.system.entry.js +2 -0
  230. package/www/build/p-12008903.system.entry.js.map +1 -0
  231. package/www/build/p-16b1b35a.entry.js +2 -0
  232. package/www/build/p-16b1b35a.entry.js.map +1 -0
  233. package/www/build/p-21941767.entry.js +2 -0
  234. package/www/build/p-21941767.entry.js.map +1 -0
  235. package/www/build/p-22d9f9c3.entry.js +2 -0
  236. package/www/build/p-22d9f9c3.entry.js.map +1 -0
  237. package/www/build/p-23975a98.system.entry.js +2 -0
  238. package/www/build/p-23975a98.system.entry.js.map +1 -0
  239. package/www/build/p-25872e04.system.entry.js +2 -0
  240. package/www/build/p-25872e04.system.entry.js.map +1 -0
  241. package/{dist/web-components-library/p-7519c72d.system.entry.js → www/build/p-2dd2d037.system.entry.js} +2 -2
  242. package/www/build/p-2df54d7d.entry.js +2 -0
  243. package/www/build/p-2df54d7d.entry.js.map +1 -0
  244. package/www/build/p-33368291.system.entry.js +2 -0
  245. package/www/build/p-33368291.system.entry.js.map +1 -0
  246. package/www/build/p-49256720.system.entry.js +2 -0
  247. package/www/build/p-49256720.system.entry.js.map +1 -0
  248. package/{dist/web-components-library/p-662c8342.js → www/build/p-49a35cf0.js} +1 -1
  249. package/www/build/p-4d0200ca.system.entry.js +2 -0
  250. package/www/build/p-4d0200ca.system.entry.js.map +1 -0
  251. package/www/build/p-5a6d6203.system.entry.js +2 -0
  252. package/www/build/p-5a6d6203.system.entry.js.map +1 -0
  253. package/www/build/{p-22610d00.entry.js → p-6830461d.entry.js} +2 -2
  254. package/www/build/p-6830461d.entry.js.map +1 -0
  255. package/{dist/web-components-library/p-461cf578.system.entry.js → www/build/p-751c58e2.system.entry.js} +2 -2
  256. package/www/build/p-751c7014.css +4 -0
  257. package/www/build/{p-dead4830.system.js → p-7dd29d4d.system.js} +1 -1
  258. package/www/build/p-7e5ae5bd.entry.js +2 -0
  259. package/www/build/p-7e5ae5bd.entry.js.map +1 -0
  260. package/www/build/p-8078896f.system.entry.js +2 -0
  261. package/www/build/p-8078896f.system.entry.js.map +1 -0
  262. package/www/build/p-9450cc97.system.entry.js +2 -0
  263. package/www/build/p-9450cc97.system.entry.js.map +1 -0
  264. package/www/build/{p-eea9f7fd.system.entry.js → p-9551ea7a.system.entry.js} +2 -2
  265. package/www/build/{p-eea9f7fd.system.entry.js.map → p-9551ea7a.system.entry.js.map} +1 -1
  266. package/www/build/p-a5f739b0.entry.js +2 -0
  267. package/www/build/p-a5f739b0.entry.js.map +1 -0
  268. package/www/build/p-d2a11d41.system.entry.js +2 -0
  269. package/www/build/p-d2a11d41.system.entry.js.map +1 -0
  270. package/www/build/p-e65aa787.js +2 -0
  271. package/www/build/p-f3ef3a26.entry.js +2 -0
  272. package/www/build/p-f3ef3a26.entry.js.map +1 -0
  273. package/www/build/p-f530271b.system.js +1 -1
  274. package/www/build/p-f530271b.system.js.map +1 -1
  275. package/www/build/p-ff54b247.entry.js +2 -0
  276. package/www/build/p-ff54b247.entry.js.map +1 -0
  277. package/www/build/web-components-library.css +4 -3
  278. package/www/build/web-components-library.esm.js +1 -1
  279. package/www/build/web-components-library.esm.js.map +1 -1
  280. package/www/index.html +1 -11
  281. package/dist/cjs/z-app-header_15.cjs.entry.js.map +0 -1
  282. package/dist/esm/z-app-header_15.entry.js.map +0 -1
  283. package/dist/esm-es5/z-app-header_15.entry.js +0 -2
  284. package/dist/esm-es5/z-app-header_15.entry.js.map +0 -1
  285. package/dist/web-components-library/p-22610d00.entry.js.map +0 -1
  286. package/dist/web-components-library/p-353c9666.entry.js +0 -2
  287. package/dist/web-components-library/p-353c9666.entry.js.map +0 -1
  288. package/dist/web-components-library/p-3970d479.entry.js +0 -2
  289. package/dist/web-components-library/p-3970d479.entry.js.map +0 -1
  290. package/dist/web-components-library/p-3cd2a911.system.entry.js +0 -2
  291. package/dist/web-components-library/p-3cd2a911.system.entry.js.map +0 -1
  292. package/dist/web-components-library/p-5d0fd3e4.system.entry.js +0 -2
  293. package/dist/web-components-library/p-5d0fd3e4.system.entry.js.map +0 -1
  294. package/dist/web-components-library/p-8f28871c.entry.js +0 -2
  295. package/dist/web-components-library/p-93f6a3ca.system.entry.js +0 -2
  296. package/dist/web-components-library/p-93f6a3ca.system.entry.js.map +0 -1
  297. package/dist/web-components-library/p-94bfd79b.system.entry.js +0 -2
  298. package/dist/web-components-library/p-94bfd79b.system.entry.js.map +0 -1
  299. package/dist/web-components-library/p-9bae8b1c.system.entry.js +0 -2
  300. package/dist/web-components-library/p-9bae8b1c.system.entry.js.map +0 -1
  301. package/dist/web-components-library/p-a0893037.entry.js +0 -2
  302. package/dist/web-components-library/p-a0893037.entry.js.map +0 -1
  303. package/dist/web-components-library/p-a8d78db5.system.entry.js +0 -2
  304. package/dist/web-components-library/p-a8d78db5.system.entry.js.map +0 -1
  305. package/dist/web-components-library/p-b6aa9719.entry.js +0 -2
  306. package/dist/web-components-library/p-b6aa9719.entry.js.map +0 -1
  307. package/dist/web-components-library/p-c012f19c.entry.js +0 -2
  308. package/dist/web-components-library/p-c012f19c.entry.js.map +0 -1
  309. package/dist/web-components-library/p-df6ef4b4.entry.js +0 -2
  310. package/dist/web-components-library/p-efda4ff7.system.entry.js +0 -2
  311. package/dist/web-components-library/p-efda4ff7.system.entry.js.map +0 -1
  312. package/dist/web-components-library/p-fc1e9ce0.entry.js +0 -2
  313. package/dist/web-components-library/p-fc1e9ce0.entry.js.map +0 -1
  314. package/dist/web-components-library/p-ffcf7250.entry.js +0 -2
  315. package/dist/web-components-library/p-ffcf7250.entry.js.map +0 -1
  316. package/dist/web-components-library/p-ffeb3d1b.system.entry.js +0 -2
  317. package/dist/web-components-library/p-ffeb3d1b.system.entry.js.map +0 -1
  318. package/dist/web-components-library/p-ffee2568.system.entry.js +0 -2
  319. package/www/build/p-22610d00.entry.js.map +0 -1
  320. package/www/build/p-353c9666.entry.js +0 -2
  321. package/www/build/p-353c9666.entry.js.map +0 -1
  322. package/www/build/p-3970d479.entry.js +0 -2
  323. package/www/build/p-3970d479.entry.js.map +0 -1
  324. package/www/build/p-3cd2a911.system.entry.js +0 -2
  325. package/www/build/p-3cd2a911.system.entry.js.map +0 -1
  326. package/www/build/p-5d0fd3e4.system.entry.js +0 -2
  327. package/www/build/p-5d0fd3e4.system.entry.js.map +0 -1
  328. package/www/build/p-6232f1d4.css +0 -3
  329. package/www/build/p-8f28871c.entry.js +0 -2
  330. package/www/build/p-93f6a3ca.system.entry.js +0 -2
  331. package/www/build/p-93f6a3ca.system.entry.js.map +0 -1
  332. package/www/build/p-94bfd79b.system.entry.js +0 -2
  333. package/www/build/p-94bfd79b.system.entry.js.map +0 -1
  334. package/www/build/p-9bae8b1c.system.entry.js +0 -2
  335. package/www/build/p-9bae8b1c.system.entry.js.map +0 -1
  336. package/www/build/p-a0893037.entry.js +0 -2
  337. package/www/build/p-a0893037.entry.js.map +0 -1
  338. package/www/build/p-a8d78db5.system.entry.js +0 -2
  339. package/www/build/p-a8d78db5.system.entry.js.map +0 -1
  340. package/www/build/p-b6aa9719.entry.js +0 -2
  341. package/www/build/p-b6aa9719.entry.js.map +0 -1
  342. package/www/build/p-c012f19c.entry.js +0 -2
  343. package/www/build/p-c012f19c.entry.js.map +0 -1
  344. package/www/build/p-c94a3f4f.js +0 -2
  345. package/www/build/p-df6ef4b4.entry.js +0 -2
  346. package/www/build/p-efda4ff7.system.entry.js +0 -2
  347. package/www/build/p-efda4ff7.system.entry.js.map +0 -1
  348. package/www/build/p-fc1e9ce0.entry.js +0 -2
  349. package/www/build/p-fc1e9ce0.entry.js.map +0 -1
  350. package/www/build/p-ffcf7250.entry.js +0 -2
  351. package/www/build/p-ffcf7250.entry.js.map +0 -1
  352. package/www/build/p-ffeb3d1b.system.entry.js +0 -2
  353. package/www/build/p-ffeb3d1b.system.entry.js.map +0 -1
  354. package/www/build/p-ffee2568.system.entry.js +0 -2
  355. /package/dist/esm-es5/{utils-ba4f0770.js.map → utils-cd008fbc.js.map} +0 -0
  356. /package/dist/types/home/{veronica/zanichelli/ds → runner/work/design-system}/design-system/.stencil/.storybook/elements/args-controls.d.ts +0 -0
  357. /package/dist/types/home/{veronica/zanichelli/ds → runner/work/design-system}/design-system/.stencil/.storybook/elements/docs-template.d.ts +0 -0
  358. /package/dist/types/home/{veronica/zanichelli/ds → runner/work/design-system}/design-system/.stencil/docs/grid/index.stories.d.ts +0 -0
  359. /package/dist/types/home/{veronica/zanichelli/ds → runner/work/design-system}/design-system/.stencil/docs/iconset/index.stories.d.ts +0 -0
  360. /package/dist/types/home/{veronica/zanichelli/ds → runner/work/design-system}/design-system/.stencil/docs/themes/index.stories.d.ts +0 -0
  361. /package/dist/web-components-library/{p-3b801ea6.entry.js.map → p-0e342fa3.entry.js.map} +0 -0
  362. /package/dist/web-components-library/{p-fb6c02f1.entry.js.map → p-114088a1.entry.js.map} +0 -0
  363. /package/dist/web-components-library/{p-7519c72d.system.entry.js.map → p-2dd2d037.system.entry.js.map} +0 -0
  364. /package/dist/web-components-library/{p-662c8342.js.map → p-49a35cf0.js.map} +0 -0
  365. /package/dist/web-components-library/{p-461cf578.system.entry.js.map → p-751c58e2.system.entry.js.map} +0 -0
  366. /package/dist/web-components-library/{p-dead4830.system.js.map → p-7dd29d4d.system.js.map} +0 -0
  367. /package/www/build/{p-3b801ea6.entry.js.map → p-0e342fa3.entry.js.map} +0 -0
  368. /package/www/build/{p-fb6c02f1.entry.js.map → p-114088a1.entry.js.map} +0 -0
  369. /package/www/build/{p-7519c72d.system.entry.js.map → p-2dd2d037.system.entry.js.map} +0 -0
  370. /package/www/build/{p-662c8342.js.map → p-49a35cf0.js.map} +0 -0
  371. /package/www/build/{p-461cf578.system.entry.js.map → p-751c58e2.system.entry.js.map} +0 -0
  372. /package/www/build/{p-dead4830.system.js.map → p-7dd29d4d.system.js.map} +0 -0
package/dist/esm-es5/z-book-card.entry.js CHANGED
@@ -1,2 +1,2 @@
1
- import{r as registerInstance,c as createEvent,h,g as getElement}from"./index-ab5f1eaa.js";import{Y as BookCardVariant}from"./index-2255c6c8.js";import{m as mobileBreakpoint}from"./breakpoints-680e0e56.js";import{r as randomId}from"./utils-7983d02c.js";var stylesCss=':host{--z-book-card-ribbon-background-color:var(--avatar-C08);--z-book-card-ribbon-shadow-color:var(--green950);--z-book-card-compact-width:262px;--z-book-card-compact-height:568px}:host>article{display:block;width:100%;max-width:360px;-webkit-box-sizing:border-box;box-sizing:border-box;border:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>article div.cover{position:relative}:host>article div.cover div.img-wrapper{display:-ms-flexbox;display:flex;overflow:hidden;border:var(--border-size-small) solid var(--color-surface03);line-height:0}:host>article div.cover div.img-wrapper img{width:auto;max-width:100%;height:auto;max-height:100%;-ms-flex-item-align:end;align-self:flex-end}:host>article div.cover .ribbon{position:absolute;z-index:10;top:calc(var(--space-unit) * 2);left:calc(var(--space-unit) * -2);display:-ms-flexbox;display:flex;max-width:100%;height:calc(var(--space-unit) * 4);-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-align:center;align-items:center;padding:0 calc(var(--space-unit) * 2);border:var(--border-size-medium) solid var(--color-surface01);background:var(--z-book-card-ribbon-background-color);border-radius:0 var(--border-radius) var(--border-radius) 0;-webkit-box-shadow:var(--shadow-2);box-shadow:var(--shadow-2);color:var(--color-text-inverse);font-family:var(--font-family-sans);font-size:var(--font-size-2);font-weight:var(--font-sb);line-height:initial}:host>article div.cover .ribbon.interactive:hover{cursor:pointer}:host>article div.cover .ribbon span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:nowrap}:host>article div.cover .ribbon::before{position:absolute;bottom:-12px;left:-2px;width:0;height:0;border-top:10px solid var(--z-book-card-ribbon-shadow-color);border-left:16px solid transparent;content:""}:host>article div.cover .ribbon z-icon{margin-right:var(--space-unit)}:host>article div.content{margin:var(--space-unit) 0;border-radius:var(--border-radius)}:host>article .title{display:-ms-flexbox;display:flex;height:100%;-ms-flex-item-align:center;align-self:center;color:var(--color-default-text);font-size:var(--font-size-4);font-weight:var(--font-sb);line-height:1.5}:host>article .title *{all:unset}:host>article div.subtitle{color:var(--color-default-text);font-size:var(--font-size-2);font-weight:var(--font-rg);line-height:1.4}:host>article div.authors{color:var(--color-default-text);font-size:var(--font-size-1);font-weight:var(--font-rg);line-height:1.33}:host>article div.isbn{overflow:hidden;color:var(--color-default-text);font-size:var(--font-size-2);line-height:1.33;text-overflow:ellipsis;white-space:nowrap;word-wrap:nowrap}:host>article div.isbn>.code{font-weight:var(--font-sb)}:host>article div.tags{display:-ms-flexbox;display:flex;overflow:hidden;max-height:32px;-ms-flex-flow:row wrap;flex-flow:row wrap;-ms-flex-line-pack:stretch;align-content:stretch;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:start;justify-content:flex-start;gap:calc(var(--space-unit) / 2)}:host>article ::slotted([slot="tags"]){margin-bottom:var(--space-unit)}:host>article ::slotted([slot="header-cta"]){--z-icon-width:20px;--z-icon-height:20px;padding:var(--space-unit);cursor:pointer;fill:var(--color-primary01-icon)}:host>article.expanded{width:100%;min-width:328px;padding:calc(var(--space-unit) * 2);padding-bottom:0}:host>article.expanded div.header{display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-line-pack:stretch;align-content:stretch;-ms-flex-align:top;align-items:top;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:var(--space-unit);white-space:nowrap}:host>article.expanded div.cover div.img-wrapper{border-radius:var(--border-radius)}:host>article.expanded div.cover div.img-wrapper img{width:100%}:host>article.expanded .title,:host>article.expanded .subtitle,:host>article.expanded .authors{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:initial}:host>article.expanded div.footer{border-top:var(--border-size-small) solid var(--color-surface03);margin-bottom:calc(var(--space-unit) * 1.5)}:host>article.expanded div.footer.open{padding-top:calc(var(--space-unit) * 1.5)}:host>article.expanded div.footer.open div.resources{display:initial}:host>article.expanded div.footer.close div.resources{display:none}:host>article.expanded button.show-resources{--z-icon-height:16px;--z-icon-width:16px;all:unset;display:-ms-flexbox;display:flex;width:100%;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-line-pack:center;align-content:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:calc(var(--space-unit) * 1) 0;color:var(--color-link-primary);cursor:pointer;fill:var(--color-link-primary);font-size:var(--font-size-2);font-weight:var(--font-sb);gap:var(--space-unit)}:host>article.expanded button.show-resources:focus{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host>article.search{width:262px;height:616px;padding:calc(var(--space-unit) * 2);padding-bottom:0}:host>article.search .wrapper-container{display:-ms-flexbox;display:flex;height:100%;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between}:host>article.search .wrapper-container .wrapper{height:451px}:host>article.search .wrapper-container .action-container{padding-bottom:calc(var(--space-unit) * 2)}:host>article.search div.header{display:-ms-flexbox;display:flex;height:24px;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-line-pack:stretch;align-content:stretch;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:calc(var(--space-unit) * 1.5);white-space:nowrap}:host>article.search div.cover div.img-wrapper{height:314px;border-radius:var(--border-radius)}:host>article.search .title{display:block;height:initial;-ms-flex-item-align:unset;align-self:unset;font-size:var(--font-size-3)}:host>article.search .title,:host>article.search .subtitle,:host>article.search .authors{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host>article.compact{width:var(--z-book-card-compact-width);height:var(--z-book-card-compact-height)}:host>article.compact.borderless{border:none}:host>article.compact div.cover div.img-wrapper{width:100%;height:calc(var(--z-book-card-compact-width) * 1.36);-webkit-box-sizing:border-box;box-sizing:border-box;border:none;background:var(--color-white);border-radius:var(--border-radius) var(--border-radius) 0 0;-webkit-box-shadow:var(--shadow-2);box-shadow:var(--shadow-2)}:host>article.compact div.wrapper{display:-ms-flexbox;display:flex;height:100%;-ms-flex-flow:column nowrap;flex-flow:column nowrap;-ms-flex-line-pack:stretch;align-content:stretch;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:start;justify-content:flex-start}:host>article.compact div.content{display:-ms-flexbox;display:flex;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-flow:column nowrap;flex-flow:column nowrap;-ms-flex-line-pack:stretch;align-content:stretch;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:justify;justify-content:space-between;padding:calc(var(--space-unit) * 2);padding-top:var(--space-unit);margin:0}:host>article.compact div.action-container{padding:calc(var(--space-unit) * 2);padding-top:0;margin-top:auto}:host>article.compact.borderless div.cover div.img-wrapper{width:var(--z-book-card-compact-width)}:host>article.compact.borderless div.content{padding:0;padding-top:var(--space-unit)}:host>article.compact.borderless div.action-container{padding:0;padding-bottom:calc(var(--space-unit) * 2)}:host>article.compact .title{display:block;height:initial;-ms-flex-item-align:unset;align-self:unset}:host>article.compact .title,:host>article.compact .subtitle,:host>article.compact .authors{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:initial}@media (min-width: 768px){:host>article{width:100%;max-width:initial}:host>article .title{display:block;height:initial;-ms-flex-item-align:unset;align-self:unset}:host>article.expanded{width:100%;min-width:initial;max-width:initial;height:360px;padding:0;border:0}:host>article.expanded div.wrapper{display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-line-pack:stretch;align-content:stretch;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:start;justify-content:flex-start}:host>article.expanded div.cover div.img-wrapper{width:262px;height:356px;border:0;border:var(--border-size-medium) solid var(--color-surface03);border-right:none;background:var(--color-surface01);border-radius:var(--border-radius) 0 0 var(--border-radius)}:host>article.expanded div.cover div.img-wrapper img{width:auto;border-radius:0}:host>article.expanded div.content{display:-ms-flexbox;display:flex;overflow:hidden;width:100%;height:356px;-ms-flex-flow:column nowrap;flex-flow:column nowrap;-ms-flex-line-pack:stretch;align-content:stretch;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:justify;justify-content:space-between;border:var(--border-size-medium) solid var(--color-surface03);border-left:none;margin:0;background:var(--color-surface01);border-radius:0 var(--border-radius) var(--border-radius) 0}:host>article.expanded div.content div.top{padding:calc(var(--space-unit) * 2);padding-bottom:0}:host>article.expanded div.content div.top div.info{display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-line-pack:stretch;align-content:stretch;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:calc(var(--space-unit) / 2)}:host>article.expanded div.content div.top div.info>div.left{width:100%}:host>article.expanded div.content div.bottom{padding:calc(var(--space-unit) * 2);padding-bottom:0}}@media (min-width: 1152px){:host>article{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;max-width:initial}}@media (min-width: 1366px){:host>article.expanded{width:635px}:host>article.expanded div.content{width:369px}}';var ZBookCardStyle0=stylesCss;var ZBookCard=function(){function t(t){registerInstance(this,t);this.ribbonClick=createEvent(this,"ribbonClick",7);this.variant=undefined;this.cover=undefined;this.operaTitle=undefined;this.volumeTitle=undefined;this.authors=undefined;this.isbn=undefined;this.isbnLabel="";this.ribbon=undefined;this.ribbonIcon=undefined;this.ribbonInteractive=undefined;this.borderless=undefined;this.fallbackCover=undefined;this.operaTitleTag=undefined;this.isMobile=false;this.hasResources=false;this.showResources=false}t.prototype.emitRibbonClick=function(){this.ribbonClick.emit()};t.prototype.componentWillLoad=function(){var t=this;this.id="id-".concat(randomId());var i=window.matchMedia("(max-width: ".concat(mobileBreakpoint,"px)"));this.isMobile=i.matches;i.onchange=function(i){return t.isMobile=i.matches}};t.prototype.componentDidLoad=function(){this.handleResources()};t.prototype.handleResources=function(){var t;if(this.variant!==BookCardVariant.EXPANDED||!this.isMobile){return}this.hasResources=((t=this.hostElement.querySelectorAll("[slot=resources]"))===null||t===void 0?void 0:t.length)>0};t.prototype.toggleResources=function(){this.showResources=!this.showResources};t.prototype.renderCard=function(){switch(this.variant){case BookCardVariant.EXPANDED:return this.isMobile?this.renderMobileExpandedCard():this.renderExpandedCard();case BookCardVariant.COMPACT:return this.renderCompactCard();case BookCardVariant.SEARCH:return this.renderSearchCard()}};t.prototype.renderExpandedCard=function(){return h("div",{class:"wrapper"},this.renderCover(),h("div",{class:"content"},h("div",{class:"top"},h("div",{class:"info"},h("div",{class:"left"},this.renderAuthors(),this.renderOperaTitle(),this.renderVolumeTitle(),this.renderIsbn()),h("div",{class:"right"},this.renderHeaderCtaSlot())),this.renderTagsSlot()),h("div",{class:"bottom"},this.renderResourcesSlot())))};t.prototype.renderMobileExpandedCard=function(){return h("div",{class:"wrapper"},h("div",{class:"header"},this.renderOperaTitle(),this.renderHeaderCtaSlot()),this.renderCover(),h("div",{class:"content"},this.renderTagsSlot(),this.renderAuthors(),this.renderVolumeTitle(),this.renderIsbn()),this.hasResources&&h("div",{class:{footer:true,open:this.showResources,close:!this.showResources}},!this.showResources&&this.renderShowResources(),this.renderResourcesSlot(),this.showResources&&this.renderShowResources()))};t.prototype.renderSearchCard=function(){return h("div",{class:"wrapper-container"},h("div",{class:"wrapper"},h("div",{class:"header"},this.renderOperaTitle(),this.renderHeaderCtaSlot()),this.renderCover(),h("div",{class:"content"},this.renderTagsSlot(),this.renderAuthors(),this.renderVolumeTitle(),this.renderIsbn())),this.renderFooterCtaSlot())};t.prototype.renderCompactCard=function(){return h("div",{class:"wrapper"},this.renderCover(),h("div",{class:"content"},this.renderAuthors(),this.renderOperaTitle(),this.renderVolumeTitle(),this.renderIsbn()),this.renderFooterCtaSlot())};t.prototype.renderCover=function(){var t=this;return h("div",{class:"cover"},this.ribbon&&this.variant!==BookCardVariant.COMPACT&&this.renderRibbon(),h("div",{class:"img-wrapper"},h("img",{src:this.cover,onError:function(){if(t.fallbackCover){t.cover=t.fallbackCover}},"aria-hidden":"true"})))};t.prototype.renderRibbon=function(){var t=this;var i=[this.ribbonIcon&&h("z-icon",{name:this.ribbonIcon,width:16,height:16,fill:"color-inverse-icon"}),h("span",null,this.ribbon)];return this.ribbonInteractive?h("button",{class:"ribbon interactive",onClick:function(){return t.emitRibbonClick()}},i):h("div",{class:"ribbon"},i)};t.prototype.renderOperaTitle=function(){var t=this.operaTitleTag?"<".concat(this.operaTitleTag,">").concat(this.operaTitle,"</").concat(this.operaTitleTag,">"):this.operaTitle;return h("div",{class:"title",innerHTML:t})};t.prototype.renderVolumeTitle=function(){return this.volumeTitle?h("div",{class:"subtitle"},this.volumeTitle):null};t.prototype.renderAuthors=function(){return this.authors?h("div",{class:"authors","aria-description":"Autori"},this.authors):null};t.prototype.renderIsbn=function(){return this.isbn?h("div",{class:"isbn"},h("span",{class:"code","aria-description":"ISBN ".concat(this.isbnLabel)},this.isbn),this.isbnLabel?h("span",{class:"label"}," ",this.isbnLabel):null):null};t.prototype.renderShowResources=function(){var t=this;return h("button",{class:"show-resources","aria-label":"Risorse del libro ".concat(this.operaTitle),"aria-expanded":this.showResources.toString(),"aria-controls":"resources-".concat(this.id),onClick:function(){return t.toggleResources()}},this.showResources?"Chiudi":"Vedi tutto",h("z-icon",{name:this.showResources?"chevron-up":"chevron-down"}))};t.prototype.renderTagsSlot=function(){return h("div",{class:"tags"},h("slot",{name:"tags"}))};t.prototype.renderHeaderCtaSlot=function(){return h("slot",{name:"header-cta"})};t.prototype.renderResourcesSlot=function(){var t=this;return h("div",{id:"resources-".concat(this.id),class:"resources"},h("slot",{name:"resources",onSlotchange:function(){return t.handleResources()}}))};t.prototype.renderFooterCtaSlot=function(){return h("div",{class:"action-container"},h("slot",{name:"footer-cta"}))};t.prototype.render=function(){var t;return h("article",{key:"93b847b7f5067c69880ea8ba283a207c8b691a2a",class:(t={},t[this.variant]=true,t.borderless=!!this.borderless,t)},this.renderCard())};Object.defineProperty(t.prototype,"hostElement",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();ZBookCard.style=ZBookCardStyle0;export{ZBookCard as z_book_card};
1
+ import{r as registerInstance,c as createEvent,h,g as getElement}from"./index-ab5f1eaa.js";import{Y as BookCardVariant}from"./index-2255c6c8.js";import{m as mobileBreakpoint}from"./breakpoints-680e0e56.js";import{r as randomId}from"./utils-7983d02c.js";var stylesCss=':host{--z-book-card-ribbon-background-color:var(--avatar-C08);--z-book-card-ribbon-shadow-color:var(--green950);--z-book-card-compact-width:262px;--z-book-card-compact-height:568px}:host>article{display:block;width:100%;max-width:360px;-webkit-box-sizing:border-box;box-sizing:border-box;border:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>article div.cover{position:relative}:host>article div.cover div.img-wrapper{display:-ms-flexbox;display:flex;overflow:hidden;border:var(--border-size-small) solid var(--color-surface03);line-height:0}:host>article div.cover div.img-wrapper img{width:auto;max-width:100%;height:auto;max-height:100%;-ms-flex-item-align:end;align-self:flex-end}:host>article div.cover .ribbon{position:absolute;z-index:10;top:calc(var(--space-unit) * 2);left:calc(var(--space-unit) * -2);display:-ms-flexbox;display:flex;max-width:100%;height:calc(var(--space-unit) * 4);-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-align:center;align-items:center;padding:0 calc(var(--space-unit) * 2);border:var(--border-size-medium) solid var(--color-surface01);background:var(--z-book-card-ribbon-background-color);border-radius:0 var(--border-radius) var(--border-radius) 0;-webkit-box-shadow:var(--shadow-2);box-shadow:var(--shadow-2);color:var(--color-text-inverse);font-family:var(--font-family-sans);font-size:var(--font-size-2);font-weight:var(--font-sb);line-height:initial}:host>article div.cover .ribbon.interactive:hover{cursor:pointer}:host>article div.cover .ribbon.interactive:focus{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary);outline:none !important}:host>article div.cover .ribbon span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:nowrap}:host>article div.cover .ribbon::before{position:absolute;bottom:-12px;left:-2px;width:0;height:0;border-top:10px solid var(--z-book-card-ribbon-shadow-color);border-left:16px solid transparent;content:""}:host>article div.cover .ribbon z-icon{margin-right:var(--space-unit)}:host>article div.content{margin:var(--space-unit) 0;border-radius:var(--border-radius)}:host>article .title{display:-ms-flexbox;display:flex;height:100%;-ms-flex-item-align:center;align-self:center;color:var(--color-default-text);font-size:var(--font-size-4);font-weight:var(--font-sb);line-height:1.5}:host>article .title *{all:unset}:host>article div.subtitle{color:var(--color-default-text);font-size:var(--font-size-2);font-weight:var(--font-rg);line-height:1.4}:host>article div.authors{color:var(--color-default-text);font-size:var(--font-size-1);font-weight:var(--font-rg);line-height:1.33}:host>article div.isbn{overflow:hidden;color:var(--color-default-text);font-size:var(--font-size-2);line-height:1.33;text-overflow:ellipsis;white-space:nowrap;word-wrap:nowrap}:host>article div.isbn>.code{font-weight:var(--font-sb)}:host>article div.tags{display:-ms-flexbox;display:flex;overflow:hidden;max-height:32px;-ms-flex-flow:row wrap;flex-flow:row wrap;-ms-flex-line-pack:stretch;align-content:stretch;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:start;justify-content:flex-start;gap:calc(var(--space-unit) / 2)}:host>article ::slotted([slot="tags"]){margin-bottom:var(--space-unit)}:host>article ::slotted([slot="header-cta"]){--z-icon-width:20px;--z-icon-height:20px;padding:var(--space-unit);cursor:pointer;fill:var(--color-primary01-icon)}:host>article ::slotted([slot="header-cta"]:focus){-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary);outline:none !important}:host>article.expanded{width:100%;min-width:328px;padding:calc(var(--space-unit) * 2);padding-bottom:0}:host>article.expanded div.header{display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-line-pack:stretch;align-content:stretch;-ms-flex-align:top;align-items:top;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:var(--space-unit);white-space:nowrap}:host>article.expanded div.cover div.img-wrapper{border-radius:var(--border-radius)}:host>article.expanded div.cover div.img-wrapper img{width:100%}:host>article.expanded .title,:host>article.expanded .subtitle,:host>article.expanded .authors{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:initial}:host>article.expanded div.footer{border-top:var(--border-size-small) solid var(--color-surface03);margin-bottom:calc(var(--space-unit) * 1.5)}:host>article.expanded div.footer.open{padding-top:calc(var(--space-unit) * 1.5)}:host>article.expanded div.footer.open div.resources{display:initial}:host>article.expanded div.footer.close div.resources{display:none}:host>article.expanded button.show-resources{--z-icon-height:16px;--z-icon-width:16px;all:unset;display:-ms-flexbox;display:flex;width:100%;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-line-pack:center;align-content:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:calc(var(--space-unit) * 1) 0;color:var(--color-link-primary);cursor:pointer;fill:var(--color-link-primary);font-size:var(--font-size-2);font-weight:var(--font-sb);gap:var(--space-unit)}:host>article.expanded button.show-resources:focus{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host>article.search{width:262px;height:616px;padding:calc(var(--space-unit) * 2);padding-bottom:0}:host>article.search .wrapper-container{display:-ms-flexbox;display:flex;height:100%;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between}:host>article.search .wrapper-container .wrapper{height:451px}:host>article.search .wrapper-container .action-container{padding-bottom:calc(var(--space-unit) * 2)}:host>article.search div.header{display:-ms-flexbox;display:flex;height:24px;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-line-pack:stretch;align-content:stretch;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:calc(var(--space-unit) * 1.5);white-space:nowrap}:host>article.search div.cover div.img-wrapper{height:314px;border-radius:var(--border-radius)}:host>article.search .title{display:block;height:initial;-ms-flex-item-align:unset;align-self:unset;font-size:var(--font-size-3)}:host>article.search .title,:host>article.search .subtitle,:host>article.search .authors{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host>article.compact{width:var(--z-book-card-compact-width);height:var(--z-book-card-compact-height)}:host>article.compact.borderless{border:none}:host>article.compact div.cover div.img-wrapper{width:100%;height:calc(var(--z-book-card-compact-width) * 1.36);-webkit-box-sizing:border-box;box-sizing:border-box;border:none;background:var(--color-white);border-radius:var(--border-radius) var(--border-radius) 0 0;-webkit-box-shadow:var(--shadow-2);box-shadow:var(--shadow-2)}:host>article.compact div.wrapper{display:-ms-flexbox;display:flex;height:100%;-ms-flex-flow:column nowrap;flex-flow:column nowrap;-ms-flex-line-pack:stretch;align-content:stretch;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:start;justify-content:flex-start}:host>article.compact div.content{display:-ms-flexbox;display:flex;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-flow:column nowrap;flex-flow:column nowrap;-ms-flex-line-pack:stretch;align-content:stretch;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:justify;justify-content:space-between;padding:calc(var(--space-unit) * 2);padding-top:var(--space-unit);margin:0}:host>article.compact div.action-container{padding:calc(var(--space-unit) * 2);padding-top:0;margin-top:auto}:host>article.compact.borderless div.cover div.img-wrapper{width:var(--z-book-card-compact-width)}:host>article.compact.borderless div.content{padding:0;padding-top:var(--space-unit)}:host>article.compact.borderless div.action-container{padding:0;padding-bottom:calc(var(--space-unit) * 2)}:host>article.compact .title{display:block;height:initial;-ms-flex-item-align:unset;align-self:unset}:host>article.compact .title,:host>article.compact .subtitle,:host>article.compact .authors{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:initial}@media (min-width: 768px){:host>article{width:100%;max-width:initial}:host>article .title{display:block;height:initial;-ms-flex-item-align:unset;align-self:unset}:host>article.expanded{width:100%;min-width:initial;max-width:initial;height:360px;padding:0;border:0}:host>article.expanded div.wrapper{display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-line-pack:stretch;align-content:stretch;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:start;justify-content:flex-start}:host>article.expanded div.cover div.img-wrapper{width:262px;height:356px;border:0;border:var(--border-size-medium) solid var(--color-surface03);border-right:none;background:var(--color-surface01);border-radius:var(--border-radius) 0 0 var(--border-radius)}:host>article.expanded div.cover div.img-wrapper img{width:auto;border-radius:0}:host>article.expanded div.content{display:-ms-flexbox;display:flex;overflow:hidden;width:100%;height:356px;-ms-flex-flow:column nowrap;flex-flow:column nowrap;-ms-flex-line-pack:stretch;align-content:stretch;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:justify;justify-content:space-between;border:var(--border-size-medium) solid var(--color-surface03);border-left:none;margin:0;background:var(--color-surface01);border-radius:0 var(--border-radius) var(--border-radius) 0}:host>article.expanded div.content div.top{padding:calc(var(--space-unit) * 2);padding-bottom:0}:host>article.expanded div.content div.top div.info{display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-line-pack:stretch;align-content:stretch;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:calc(var(--space-unit) / 2)}:host>article.expanded div.content div.top div.info>div.left{width:100%}:host>article.expanded div.content div.bottom{padding:calc(var(--space-unit) * 2);padding-bottom:0}}@media (min-width: 1152px){:host>article{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;max-width:initial}}@media (min-width: 1366px){:host>article.expanded{width:635px}:host>article.expanded div.content{width:369px}}';var ZBookCardStyle0=stylesCss;var ZBookCard=function(){function t(t){registerInstance(this,t);this.ribbonClick=createEvent(this,"ribbonClick",7);this.variant=undefined;this.cover=undefined;this.operaTitle=undefined;this.volumeTitle=undefined;this.authors=undefined;this.isbn=undefined;this.isbnLabel="";this.ribbon=undefined;this.ribbonIcon=undefined;this.ribbonInteractive=undefined;this.borderless=undefined;this.fallbackCover=undefined;this.operaTitleTag=undefined;this.isMobile=false;this.hasResources=false;this.showResources=false}t.prototype.emitRibbonClick=function(){this.ribbonClick.emit()};t.prototype.componentWillLoad=function(){var t=this;this.id="id-".concat(randomId());var i=window.matchMedia("(max-width: ".concat(mobileBreakpoint,"px)"));this.isMobile=i.matches;i.onchange=function(i){return t.isMobile=i.matches}};t.prototype.componentDidLoad=function(){this.handleResources()};t.prototype.handleResources=function(){var t;if(this.variant!==BookCardVariant.EXPANDED||!this.isMobile){return}this.hasResources=((t=this.hostElement.querySelectorAll("[slot=resources]"))===null||t===void 0?void 0:t.length)>0};t.prototype.toggleResources=function(){this.showResources=!this.showResources};t.prototype.renderCard=function(){switch(this.variant){case BookCardVariant.EXPANDED:return this.isMobile?this.renderMobileExpandedCard():this.renderExpandedCard();case BookCardVariant.COMPACT:return this.renderCompactCard();case BookCardVariant.SEARCH:return this.renderSearchCard()}};t.prototype.renderExpandedCard=function(){return h("div",{class:"wrapper"},this.renderCover(),h("div",{class:"content"},h("div",{class:"top"},h("div",{class:"info"},h("div",{class:"left"},this.renderAuthors(),this.renderOperaTitle(),this.renderVolumeTitle(),this.renderIsbn()),h("div",{class:"right"},this.renderHeaderCtaSlot())),this.renderTagsSlot()),h("div",{class:"bottom"},this.renderResourcesSlot())))};t.prototype.renderMobileExpandedCard=function(){return h("div",{class:"wrapper"},h("div",{class:"header"},this.renderOperaTitle(),this.renderHeaderCtaSlot()),this.renderCover(),h("div",{class:"content"},this.renderTagsSlot(),this.renderAuthors(),this.renderVolumeTitle(),this.renderIsbn()),this.hasResources&&h("div",{class:{footer:true,open:this.showResources,close:!this.showResources}},!this.showResources&&this.renderShowResources(),this.renderResourcesSlot(),this.showResources&&this.renderShowResources()))};t.prototype.renderSearchCard=function(){return h("div",{class:"wrapper-container"},h("div",{class:"wrapper"},h("div",{class:"header"},this.renderOperaTitle(),this.renderHeaderCtaSlot()),this.renderCover(),h("div",{class:"content"},this.renderTagsSlot(),this.renderAuthors(),this.renderVolumeTitle(),this.renderIsbn())),this.renderFooterCtaSlot())};t.prototype.renderCompactCard=function(){return h("div",{class:"wrapper"},this.renderCover(),h("div",{class:"content"},this.renderAuthors(),this.renderOperaTitle(),this.renderVolumeTitle(),this.renderIsbn()),this.renderFooterCtaSlot())};t.prototype.renderCover=function(){var t=this;return h("div",{class:"cover"},this.ribbon&&this.variant!==BookCardVariant.COMPACT&&this.renderRibbon(),h("div",{class:"img-wrapper"},h("img",{src:this.cover,onError:function(){if(t.fallbackCover){t.cover=t.fallbackCover}},"aria-hidden":"true"})))};t.prototype.renderRibbon=function(){var t=this;var i=[this.ribbonIcon&&h("z-icon",{name:this.ribbonIcon,width:16,height:16,fill:"color-inverse-icon"}),h("span",null,this.ribbon)];return this.ribbonInteractive?h("button",{class:"ribbon interactive",onClick:function(){return t.emitRibbonClick()}},i):h("div",{class:"ribbon"},i)};t.prototype.renderOperaTitle=function(){var t=this.operaTitleTag?"<".concat(this.operaTitleTag,">").concat(this.operaTitle,"</").concat(this.operaTitleTag,">"):this.operaTitle;return h("div",{class:"title",innerHTML:t})};t.prototype.renderVolumeTitle=function(){return this.volumeTitle?h("div",{class:"subtitle"},this.volumeTitle):null};t.prototype.renderAuthors=function(){return this.authors?h("div",{class:"authors","aria-description":"Autori"},this.authors):null};t.prototype.renderIsbn=function(){return this.isbn?h("div",{class:"isbn"},h("span",{class:"code","aria-description":"ISBN ".concat(this.isbnLabel)},this.isbn),this.isbnLabel?h("span",{class:"label"}," ",this.isbnLabel):null):null};t.prototype.renderShowResources=function(){var t=this;return h("button",{class:"show-resources","aria-label":"Risorse del libro ".concat(this.operaTitle),"aria-expanded":this.showResources.toString(),"aria-controls":"resources-".concat(this.id),onClick:function(){return t.toggleResources()}},this.showResources?"Chiudi":"Vedi tutto",h("z-icon",{name:this.showResources?"chevron-up":"chevron-down"}))};t.prototype.renderTagsSlot=function(){return h("div",{class:"tags"},h("slot",{name:"tags"}))};t.prototype.renderHeaderCtaSlot=function(){return h("slot",{name:"header-cta"})};t.prototype.renderResourcesSlot=function(){var t=this;return h("div",{id:"resources-".concat(this.id),class:"resources"},h("slot",{name:"resources",onSlotchange:function(){return t.handleResources()}}))};t.prototype.renderFooterCtaSlot=function(){return h("div",{class:"action-container"},h("slot",{name:"footer-cta"}))};t.prototype.render=function(){var t;return h("article",{key:"93b847b7f5067c69880ea8ba283a207c8b691a2a",class:(t={},t[this.variant]=true,t.borderless=!!this.borderless,t)},this.renderCard())};Object.defineProperty(t.prototype,"hostElement",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();ZBookCard.style=ZBookCardStyle0;export{ZBookCard as z_book_card};
2
2
  //# sourceMappingURL=z-book-card.entry.js.map
package/dist/esm-es5/z-book-card.entry.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["stylesCss","ZBookCardStyle0","ZBookCard","prototype","emitRibbonClick","this","ribbonClick","emit","componentWillLoad","_this","id","concat","randomId","mobileMediaQuery","window","matchMedia","mobileBreakpoint","isMobile","matches","onchange","mql","componentDidLoad","handleResources","variant","BookCardVariant","EXPANDED","hasResources","_a","hostElement","querySelectorAll","length","toggleResources","showResources","renderCard","renderMobileExpandedCard","renderExpandedCard","COMPACT","renderCompactCard","SEARCH","renderSearchCard","h","class","renderCover","renderAuthors","renderOperaTitle","renderVolumeTitle","renderIsbn","renderHeaderCtaSlot","renderTagsSlot","renderResourcesSlot","footer","open","close","renderShowResources","renderFooterCtaSlot","ribbon","renderRibbon","src","cover","onError","fallbackCover","content","ribbonIcon","name","width","height","fill","ribbonInteractive","onClick","title","operaTitleTag","operaTitle","innerHTML","volumeTitle","authors","isbn","isbnLabel","toString","onSlotchange","render","key","_b","borderless"],"sources":["src/components/z-book-card/styles.css?tag=z-book-card&encapsulation=shadow","src/components/z-book-card/index.tsx"],"sourcesContent":["/* COMMON STYLES */\n\n:host {\n --z-book-card-ribbon-background-color: var(--avatar-C08);\n --z-book-card-ribbon-shadow-color: var(--green950);\n --z-book-card-compact-width: 262px;\n --z-book-card-compact-height: 568px;\n}\n\n:host > article {\n display: block;\n width: 100%;\n max-width: 360px;\n box-sizing: border-box;\n border: var(--border-size-medium) solid var(--color-surface03);\n background-color: var(--color-surface01);\n border-radius: var(--border-radius);\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n:host > article div.cover {\n position: relative;\n}\n\n:host > article div.cover div.img-wrapper {\n display: flex;\n overflow: hidden;\n border: var(--border-size-small) solid var(--color-surface03);\n line-height: 0;\n}\n\n:host > article div.cover div.img-wrapper img {\n width: auto;\n max-width: 100%;\n height: auto;\n max-height: 100%;\n align-self: flex-end;\n}\n\n:host > article div.cover .ribbon {\n position: absolute;\n z-index: 10;\n top: calc(var(--space-unit) * 2);\n left: calc(var(--space-unit) * -2);\n display: flex;\n max-width: 100%;\n height: calc(var(--space-unit) * 4);\n box-sizing: border-box;\n align-items: center;\n padding: 0 calc(var(--space-unit) * 2);\n border: var(--border-size-medium) solid var(--color-surface01);\n background: var(--z-book-card-ribbon-background-color);\n border-radius: 0 var(--border-radius) var(--border-radius) 0;\n box-shadow: var(--shadow-2);\n color: var(--color-text-inverse);\n font-family: var(--font-family-sans);\n font-size: var(--font-size-2);\n font-weight: var(--font-sb);\n line-height: initial;\n}\n\n:host > article div.cover .ribbon.interactive:hover {\n cursor: pointer;\n}\n\n:host > article div.cover .ribbon span {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n word-wrap: nowrap;\n}\n\n:host > article div.cover .ribbon::before {\n position: absolute;\n bottom: -12px;\n left: -2px;\n width: 0;\n height: 0;\n border-top: 10px solid var(--z-book-card-ribbon-shadow-color);\n border-left: 16px solid transparent;\n content: \"\";\n}\n\n:host > article div.cover .ribbon z-icon {\n margin-right: var(--space-unit);\n}\n\n:host > article div.content {\n margin: var(--space-unit) 0;\n border-radius: var(--border-radius);\n}\n\n:host > article .title {\n display: flex;\n height: 100%;\n align-self: center;\n color: var(--color-default-text);\n font-size: var(--font-size-4);\n font-weight: var(--font-sb);\n line-height: 1.5;\n}\n\n:host > article .title * {\n all: unset;\n}\n\n:host > article div.subtitle {\n color: var(--color-default-text);\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n line-height: 1.4;\n}\n\n:host > article div.authors {\n color: var(--color-default-text);\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n line-height: 1.33;\n}\n\n:host > article div.isbn {\n overflow: hidden;\n color: var(--color-default-text);\n font-size: var(--font-size-2);\n line-height: 1.33;\n text-overflow: ellipsis;\n white-space: nowrap;\n word-wrap: nowrap;\n}\n\n:host > article div.isbn > .code {\n font-weight: var(--font-sb);\n}\n\n:host > article div.tags {\n display: flex;\n overflow: hidden;\n max-height: 32px;\n flex-flow: row wrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: flex-start;\n gap: calc(var(--space-unit) / 2);\n}\n\n:host > article ::slotted([slot=\"tags\"]) {\n margin-bottom: var(--space-unit);\n}\n\n:host > article ::slotted([slot=\"header-cta\"]) {\n --z-icon-width: 20px;\n --z-icon-height: 20px;\n\n padding: var(--space-unit);\n cursor: pointer;\n fill: var(--color-primary01-icon);\n}\n\n/* EXPANDED STYLES */\n\n:host > article.expanded {\n width: 100%;\n min-width: 328px;\n padding: calc(var(--space-unit) * 2);\n padding-bottom: 0;\n}\n\n:host > article.expanded div.header {\n display: flex;\n flex-flow: row nowrap;\n align-content: stretch;\n align-items: top;\n justify-content: space-between;\n margin-bottom: var(--space-unit);\n white-space: nowrap;\n}\n\n:host > article.expanded div.cover div.img-wrapper {\n border-radius: var(--border-radius);\n}\n\n:host > article.expanded div.cover div.img-wrapper img {\n width: 100%;\n}\n\n:host > article.expanded .title,\n:host > article.expanded .subtitle,\n:host > article.expanded .authors {\n display: -webkit-box;\n overflow: hidden;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n white-space: initial;\n}\n\n:host > article.expanded div.footer {\n border-top: var(--border-size-small) solid var(--color-surface03);\n margin-bottom: calc(var(--space-unit) * 1.5);\n}\n\n:host > article.expanded div.footer.open {\n padding-top: calc(var(--space-unit) * 1.5);\n}\n\n:host > article.expanded div.footer.open div.resources {\n display: initial;\n}\n\n:host > article.expanded div.footer.close div.resources {\n display: none;\n}\n\n:host > article.expanded button.show-resources {\n --z-icon-height: 16px;\n --z-icon-width: 16px;\n\n all: unset;\n display: flex;\n width: 100%;\n flex-flow: row nowrap;\n align-content: center;\n align-items: center;\n justify-content: center;\n padding: calc(var(--space-unit) * 1) 0;\n color: var(--color-link-primary);\n cursor: pointer;\n fill: var(--color-link-primary);\n font-size: var(--font-size-2);\n font-weight: var(--font-sb);\n gap: var(--space-unit);\n}\n\n:host > article.expanded button.show-resources:focus {\n box-shadow: var(--shadow-focus-primary);\n}\n\n/* SEARCH STYLES */\n\n:host > article.search {\n width: 262px;\n height: 616px;\n padding: calc(var(--space-unit) * 2);\n padding-bottom: 0;\n}\n\n:host > article.search .wrapper-container {\n display: flex;\n height: 100%;\n flex-direction: column;\n justify-content: space-between;\n}\n\n:host > article.search .wrapper-container .wrapper {\n height: 451px;\n}\n\n:host > article.search .wrapper-container .action-container {\n padding-bottom: calc(var(--space-unit) * 2);\n}\n\n:host > article.search div.header {\n display: flex;\n height: 24px;\n flex-flow: row nowrap;\n align-content: stretch;\n align-items: center;\n justify-content: space-between;\n margin-bottom: calc(var(--space-unit) * 1.5);\n white-space: nowrap;\n}\n\n:host > article.search div.cover div.img-wrapper {\n height: 314px;\n border-radius: var(--border-radius);\n}\n\n:host > article.search .title {\n display: block;\n height: initial;\n align-self: unset;\n font-size: var(--font-size-3);\n}\n\n:host > article.search .title,\n:host > article.search .subtitle,\n:host > article.search .authors {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/* COMPACT STYLES */\n\n:host > article.compact {\n width: var(--z-book-card-compact-width);\n height: var(--z-book-card-compact-height);\n}\n\n:host > article.compact.borderless {\n border: none;\n}\n\n:host > article.compact div.cover div.img-wrapper {\n width: 100%;\n height: calc(var(--z-book-card-compact-width) * 1.36);\n box-sizing: border-box;\n border: none;\n background: var(--color-white);\n border-radius: var(--border-radius) var(--border-radius) 0 0;\n box-shadow: var(--shadow-2);\n}\n\n:host > article.compact div.wrapper {\n display: flex;\n height: 100%;\n flex-flow: column nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: flex-start;\n}\n\n:host > article.compact div.content {\n display: flex;\n box-sizing: border-box;\n flex-flow: column nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: space-between;\n padding: calc(var(--space-unit) * 2);\n padding-top: var(--space-unit);\n margin: 0;\n}\n\n:host > article.compact div.action-container {\n padding: calc(var(--space-unit) * 2);\n padding-top: 0;\n margin-top: auto;\n}\n\n:host > article.compact.borderless div.cover div.img-wrapper {\n width: var(--z-book-card-compact-width);\n}\n\n:host > article.compact.borderless div.content {\n padding: 0;\n padding-top: var(--space-unit);\n}\n\n:host > article.compact.borderless div.action-container {\n padding: 0;\n padding-bottom: calc(var(--space-unit) * 2);\n}\n\n:host > article.compact .title {\n display: block;\n height: initial;\n align-self: unset;\n}\n\n:host > article.compact .title,\n:host > article.compact .subtitle,\n:host > article.compact .authors {\n display: -webkit-box;\n overflow: hidden;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n white-space: initial;\n}\n\n/* Tablet breakpoint */\n@media (min-width: 768px) {\n :host > article {\n width: 100%;\n max-width: initial;\n }\n\n :host > article .title {\n display: block;\n height: initial;\n align-self: unset;\n }\n\n /* EXPANDED STYLES */\n\n :host > article.expanded {\n width: 100%;\n min-width: initial;\n max-width: initial;\n height: 360px;\n padding: 0;\n border: 0;\n }\n\n :host > article.expanded div.wrapper {\n display: flex;\n flex-flow: row nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: flex-start;\n }\n\n :host > article.expanded div.cover div.img-wrapper {\n width: 262px;\n height: 356px;\n border: 0;\n border: var(--border-size-medium) solid var(--color-surface03);\n border-right: none;\n background: var(--color-surface01);\n border-radius: var(--border-radius) 0 0 var(--border-radius);\n }\n\n :host > article.expanded div.cover div.img-wrapper img {\n width: auto;\n border-radius: 0;\n }\n\n :host > article.expanded div.content {\n display: flex;\n overflow: hidden;\n width: 100%;\n height: 356px;\n flex-flow: column nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: space-between;\n border: var(--border-size-medium) solid var(--color-surface03);\n border-left: none;\n margin: 0;\n background: var(--color-surface01);\n border-radius: 0 var(--border-radius) var(--border-radius) 0;\n }\n\n :host > article.expanded div.content div.top {\n padding: calc(var(--space-unit) * 2);\n padding-bottom: 0;\n }\n\n :host > article.expanded div.content div.top div.info {\n display: flex;\n flex-flow: row nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: space-between;\n margin-bottom: calc(var(--space-unit) / 2);\n }\n\n :host > article.expanded div.content div.top div.info > div.left {\n width: 100%;\n }\n\n :host > article.expanded div.content div.bottom {\n padding: calc(var(--space-unit) * 2);\n padding-bottom: 0;\n }\n}\n\n/* Desktop breakpoint */\n\n@media (min-width: 1152px) {\n :host > article {\n width: fit-content;\n max-width: initial;\n }\n}\n\n/* Wide breakpoint */\n@media (min-width: 1366px) {\n :host > article.expanded {\n width: 635px;\n }\n\n :host > article.expanded div.content {\n width: 369px;\n }\n}\n","import {Component, Element, Event, EventEmitter, Prop, State, h} from \"@stencil/core\";\nimport {BookCardVariant} from \"../../beans\";\nimport {mobileBreakpoint} from \"../../constants/breakpoints\";\nimport {randomId} from \"../../utils/utils\";\n\n/**\n * @slot resources - books resources (extended variant only)\n * @slot header-cta - header CTA (e.g. bookmark icon - extended and search variant only)\n * @slot tags - card tags (extended and search variant only)\n * @slot footer-cta - footer cta button (search and compact variant only)\n * @cssprop --z-book-card-ribbon-background-color - ribbon backgrund color\n * @cssprop --z-book-card-ribbon-shadow-color - ribbon shadow color\n * @cssprop --z-book-card-compact-width - compact card custom width\n * @cssprop --z-book-card-compact-height - compact card custom height\n */\n@Component({\n tag: \"z-book-card\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZBookCard {\n @Element() hostElement: HTMLZBookCardElement;\n\n /**\n * Card variant: expanded, compact, search\n */\n @Prop()\n variant: BookCardVariant;\n\n /**\n * Cover URL\n */\n @Prop()\n cover: string;\n\n /**\n * Card main title\n */\n @Prop()\n operaTitle: string;\n\n /**\n * [optional] Card subtitle\n */\n @Prop()\n volumeTitle?: string;\n\n /**\n * [optional] Authors\n */\n @Prop()\n authors?: string;\n\n /**\n * [optional] Main ISBN\n */\n @Prop()\n isbn?: string;\n\n /**\n * [optional] ISBN label\n */\n @Prop()\n isbnLabel = \"\";\n\n /**\n * [optional] Ribbon label - expanded and search variant only\n */\n @Prop()\n ribbon?: string;\n\n /**\n * [optional] Ribbon icon - expanded and search variant only\n */\n @Prop()\n ribbonIcon?: string;\n\n /**\n * [optional] Ribbon interactive - expanded and search variant only\n */\n @Prop()\n ribbonInteractive?: boolean;\n\n /**\n * [optional] Borderless card - compact variant only\n */\n @Prop()\n borderless?: boolean;\n\n /**\n * [optional] Fallback cover URL\n */\n @Prop()\n fallbackCover?: string;\n\n /**\n * [optional] [accessibility] Card title HTML tag\n */\n @Prop()\n operaTitleTag?: string;\n\n @State()\n isMobile = false;\n\n @State()\n hasResources = false;\n\n @State()\n showResources = false;\n\n /** click on interactive ribbon */\n @Event()\n ribbonClick: EventEmitter;\n\n private emitRibbonClick(): void {\n this.ribbonClick.emit();\n }\n\n private id: string;\n\n componentWillLoad(): void {\n this.id = `id-${randomId()}`;\n\n const mobileMediaQuery = window.matchMedia(`(max-width: ${mobileBreakpoint}px)`);\n this.isMobile = mobileMediaQuery.matches;\n mobileMediaQuery.onchange = (mql) => (this.isMobile = mql.matches);\n }\n\n componentDidLoad(): void {\n this.handleResources();\n }\n\n private handleResources(): void {\n if (this.variant !== BookCardVariant.EXPANDED || !this.isMobile) {\n return;\n }\n this.hasResources = this.hostElement.querySelectorAll(\"[slot=resources]\")?.length > 0;\n }\n\n private toggleResources(): void {\n this.showResources = !this.showResources;\n }\n\n private renderCard(): HTMLDivElement {\n switch (this.variant) {\n case BookCardVariant.EXPANDED:\n return this.isMobile ? this.renderMobileExpandedCard() : this.renderExpandedCard();\n case BookCardVariant.COMPACT:\n return this.renderCompactCard();\n case BookCardVariant.SEARCH:\n return this.renderSearchCard();\n }\n }\n\n private renderExpandedCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n {this.renderCover()}\n <div class=\"content\">\n <div class=\"top\">\n <div class=\"info\">\n <div class=\"left\">\n {this.renderAuthors()}\n {this.renderOperaTitle()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n <div class=\"right\">{this.renderHeaderCtaSlot()}</div>\n </div>\n {this.renderTagsSlot()}\n </div>\n <div class=\"bottom\">{this.renderResourcesSlot()}</div>\n </div>\n </div>\n );\n }\n\n private renderMobileExpandedCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n <div class=\"header\">\n {this.renderOperaTitle()}\n {this.renderHeaderCtaSlot()}\n </div>\n {this.renderCover()}\n <div class=\"content\">\n {this.renderTagsSlot()}\n {this.renderAuthors()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n {this.hasResources && (\n <div\n class={{\n footer: true,\n open: this.showResources,\n close: !this.showResources,\n }}\n >\n {!this.showResources && this.renderShowResources()}\n {this.renderResourcesSlot()}\n {this.showResources && this.renderShowResources()}\n </div>\n )}\n </div>\n );\n }\n\n private renderSearchCard(): HTMLDivElement {\n return (\n <div class=\"wrapper-container\">\n <div class=\"wrapper\">\n <div class=\"header\">\n {this.renderOperaTitle()}\n {this.renderHeaderCtaSlot()}\n </div>\n {this.renderCover()}\n <div class=\"content\">\n {this.renderTagsSlot()}\n {this.renderAuthors()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n </div>\n {this.renderFooterCtaSlot()}\n </div>\n );\n }\n\n private renderCompactCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n {this.renderCover()}\n <div class=\"content\">\n {this.renderAuthors()}\n {this.renderOperaTitle()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n {this.renderFooterCtaSlot()}\n </div>\n );\n }\n\n private renderCover(): HTMLDivElement {\n return (\n <div class=\"cover\">\n {this.ribbon && this.variant !== BookCardVariant.COMPACT && this.renderRibbon()}\n <div class=\"img-wrapper\">\n <img\n src={this.cover}\n onError={() => {\n if (this.fallbackCover) {\n this.cover = this.fallbackCover;\n }\n }}\n aria-hidden=\"true\"\n />\n </div>\n </div>\n );\n }\n\n private renderRibbon(): HTMLElement {\n const content = [\n this.ribbonIcon && (\n <z-icon\n name={this.ribbonIcon}\n width={16}\n height={16}\n fill={\"color-inverse-icon\"}\n />\n ),\n <span>{this.ribbon}</span>,\n ];\n\n return this.ribbonInteractive ? (\n <button\n class=\"ribbon interactive\"\n onClick={() => this.emitRibbonClick()}\n >\n {content}\n </button>\n ) : (\n <div class=\"ribbon\">{content}</div>\n );\n }\n\n private renderOperaTitle(): HTMLDivElement {\n const title = this.operaTitleTag\n ? `<${this.operaTitleTag}>${this.operaTitle}</${this.operaTitleTag}>`\n : this.operaTitle;\n\n return (\n <div\n class=\"title\"\n innerHTML={title}\n />\n );\n }\n\n private renderVolumeTitle(): null | HTMLDivElement {\n return this.volumeTitle ? <div class=\"subtitle\">{this.volumeTitle}</div> : null;\n }\n\n private renderAuthors(): null | HTMLDivElement {\n return this.authors ? (\n <div\n class=\"authors\"\n aria-description=\"Autori\"\n >\n {this.authors}\n </div>\n ) : null;\n }\n\n private renderIsbn(): null | HTMLDivElement {\n return this.isbn ? (\n <div class=\"isbn\">\n <span\n class=\"code\"\n aria-description={`ISBN ${this.isbnLabel}`}\n >\n {this.isbn}\n </span>\n {this.isbnLabel ? <span class=\"label\"> {this.isbnLabel}</span> : null}\n </div>\n ) : null;\n }\n\n private renderShowResources(): HTMLButtonElement {\n return (\n <button\n class=\"show-resources\"\n aria-label={`Risorse del libro ${this.operaTitle}`}\n aria-expanded={this.showResources.toString()}\n aria-controls={`resources-${this.id}`}\n onClick={() => this.toggleResources()}\n >\n {this.showResources ? \"Chiudi\" : \"Vedi tutto\"}\n <z-icon name={this.showResources ? \"chevron-up\" : \"chevron-down\"} />\n </button>\n );\n }\n\n private renderTagsSlot(): HTMLDivElement {\n return (\n <div class=\"tags\">\n <slot name=\"tags\" />\n </div>\n );\n }\n\n private renderHeaderCtaSlot(): HTMLSlotElement {\n return <slot name=\"header-cta\" />;\n }\n\n private renderResourcesSlot(): HTMLDivElement {\n return (\n <div\n id={`resources-${this.id}`}\n class=\"resources\"\n >\n <slot\n name=\"resources\"\n onSlotchange={() => this.handleResources()}\n />\n </div>\n );\n }\n\n private renderFooterCtaSlot(): HTMLDivElement {\n return (\n <div class=\"action-container\">\n <slot name=\"footer-cta\" />\n </div>\n );\n }\n\n render(): HTMLZBookCardElement {\n return (\n <article\n class={{\n [this.variant]: true,\n borderless: !!this.borderless,\n }}\n >\n {this.renderCard()}\n </article>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["stylesCss","ZBookCardStyle0","ZBookCard","prototype","emitRibbonClick","this","ribbonClick","emit","componentWillLoad","_this","id","concat","randomId","mobileMediaQuery","window","matchMedia","mobileBreakpoint","isMobile","matches","onchange","mql","componentDidLoad","handleResources","variant","BookCardVariant","EXPANDED","hasResources","_a","hostElement","querySelectorAll","length","toggleResources","showResources","renderCard","renderMobileExpandedCard","renderExpandedCard","COMPACT","renderCompactCard","SEARCH","renderSearchCard","h","class","renderCover","renderAuthors","renderOperaTitle","renderVolumeTitle","renderIsbn","renderHeaderCtaSlot","renderTagsSlot","renderResourcesSlot","footer","open","close","renderShowResources","renderFooterCtaSlot","ribbon","renderRibbon","src","cover","onError","fallbackCover","content","ribbonIcon","name","width","height","fill","ribbonInteractive","onClick","title","operaTitleTag","operaTitle","innerHTML","volumeTitle","authors","isbn","isbnLabel","toString","onSlotchange","render","key","_b","borderless"],"sources":["src/components/z-book-card/styles.css?tag=z-book-card&encapsulation=shadow","src/components/z-book-card/index.tsx"],"sourcesContent":["/* COMMON STYLES */\n\n:host {\n --z-book-card-ribbon-background-color: var(--avatar-C08);\n --z-book-card-ribbon-shadow-color: var(--green950);\n --z-book-card-compact-width: 262px;\n --z-book-card-compact-height: 568px;\n}\n\n:host > article {\n display: block;\n width: 100%;\n max-width: 360px;\n box-sizing: border-box;\n border: var(--border-size-medium) solid var(--color-surface03);\n background-color: var(--color-surface01);\n border-radius: var(--border-radius);\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n:host > article div.cover {\n position: relative;\n}\n\n:host > article div.cover div.img-wrapper {\n display: flex;\n overflow: hidden;\n border: var(--border-size-small) solid var(--color-surface03);\n line-height: 0;\n}\n\n:host > article div.cover div.img-wrapper img {\n width: auto;\n max-width: 100%;\n height: auto;\n max-height: 100%;\n align-self: flex-end;\n}\n\n:host > article div.cover .ribbon {\n position: absolute;\n z-index: 10;\n top: calc(var(--space-unit) * 2);\n left: calc(var(--space-unit) * -2);\n display: flex;\n max-width: 100%;\n height: calc(var(--space-unit) * 4);\n box-sizing: border-box;\n align-items: center;\n padding: 0 calc(var(--space-unit) * 2);\n border: var(--border-size-medium) solid var(--color-surface01);\n background: var(--z-book-card-ribbon-background-color);\n border-radius: 0 var(--border-radius) var(--border-radius) 0;\n box-shadow: var(--shadow-2);\n color: var(--color-text-inverse);\n font-family: var(--font-family-sans);\n font-size: var(--font-size-2);\n font-weight: var(--font-sb);\n line-height: initial;\n}\n\n:host > article div.cover .ribbon.interactive:hover {\n cursor: pointer;\n}\n\n:host > article div.cover .ribbon.interactive:focus {\n box-shadow: var(--shadow-focus-primary);\n outline: none !important;\n}\n\n:host > article div.cover .ribbon span {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n word-wrap: nowrap;\n}\n\n:host > article div.cover .ribbon::before {\n position: absolute;\n bottom: -12px;\n left: -2px;\n width: 0;\n height: 0;\n border-top: 10px solid var(--z-book-card-ribbon-shadow-color);\n border-left: 16px solid transparent;\n content: \"\";\n}\n\n:host > article div.cover .ribbon z-icon {\n margin-right: var(--space-unit);\n}\n\n:host > article div.content {\n margin: var(--space-unit) 0;\n border-radius: var(--border-radius);\n}\n\n:host > article .title {\n display: flex;\n height: 100%;\n align-self: center;\n color: var(--color-default-text);\n font-size: var(--font-size-4);\n font-weight: var(--font-sb);\n line-height: 1.5;\n}\n\n:host > article .title * {\n all: unset;\n}\n\n:host > article div.subtitle {\n color: var(--color-default-text);\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n line-height: 1.4;\n}\n\n:host > article div.authors {\n color: var(--color-default-text);\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n line-height: 1.33;\n}\n\n:host > article div.isbn {\n overflow: hidden;\n color: var(--color-default-text);\n font-size: var(--font-size-2);\n line-height: 1.33;\n text-overflow: ellipsis;\n white-space: nowrap;\n word-wrap: nowrap;\n}\n\n:host > article div.isbn > .code {\n font-weight: var(--font-sb);\n}\n\n:host > article div.tags {\n display: flex;\n overflow: hidden;\n max-height: 32px;\n flex-flow: row wrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: flex-start;\n gap: calc(var(--space-unit) / 2);\n}\n\n:host > article ::slotted([slot=\"tags\"]) {\n margin-bottom: var(--space-unit);\n}\n\n:host > article ::slotted([slot=\"header-cta\"]) {\n --z-icon-width: 20px;\n --z-icon-height: 20px;\n\n padding: var(--space-unit);\n cursor: pointer;\n fill: var(--color-primary01-icon);\n}\n\n:host > article ::slotted([slot=\"header-cta\"]:focus) {\n box-shadow: var(--shadow-focus-primary);\n outline: none !important;\n}\n\n/* EXPANDED STYLES */\n\n:host > article.expanded {\n width: 100%;\n min-width: 328px;\n padding: calc(var(--space-unit) * 2);\n padding-bottom: 0;\n}\n\n:host > article.expanded div.header {\n display: flex;\n flex-flow: row nowrap;\n align-content: stretch;\n align-items: top;\n justify-content: space-between;\n margin-bottom: var(--space-unit);\n white-space: nowrap;\n}\n\n:host > article.expanded div.cover div.img-wrapper {\n border-radius: var(--border-radius);\n}\n\n:host > article.expanded div.cover div.img-wrapper img {\n width: 100%;\n}\n\n:host > article.expanded .title,\n:host > article.expanded .subtitle,\n:host > article.expanded .authors {\n display: -webkit-box;\n overflow: hidden;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n white-space: initial;\n}\n\n:host > article.expanded div.footer {\n border-top: var(--border-size-small) solid var(--color-surface03);\n margin-bottom: calc(var(--space-unit) * 1.5);\n}\n\n:host > article.expanded div.footer.open {\n padding-top: calc(var(--space-unit) * 1.5);\n}\n\n:host > article.expanded div.footer.open div.resources {\n display: initial;\n}\n\n:host > article.expanded div.footer.close div.resources {\n display: none;\n}\n\n:host > article.expanded button.show-resources {\n --z-icon-height: 16px;\n --z-icon-width: 16px;\n\n all: unset;\n display: flex;\n width: 100%;\n flex-flow: row nowrap;\n align-content: center;\n align-items: center;\n justify-content: center;\n padding: calc(var(--space-unit) * 1) 0;\n color: var(--color-link-primary);\n cursor: pointer;\n fill: var(--color-link-primary);\n font-size: var(--font-size-2);\n font-weight: var(--font-sb);\n gap: var(--space-unit);\n}\n\n:host > article.expanded button.show-resources:focus {\n box-shadow: var(--shadow-focus-primary);\n}\n\n/* SEARCH STYLES */\n\n:host > article.search {\n width: 262px;\n height: 616px;\n padding: calc(var(--space-unit) * 2);\n padding-bottom: 0;\n}\n\n:host > article.search .wrapper-container {\n display: flex;\n height: 100%;\n flex-direction: column;\n justify-content: space-between;\n}\n\n:host > article.search .wrapper-container .wrapper {\n height: 451px;\n}\n\n:host > article.search .wrapper-container .action-container {\n padding-bottom: calc(var(--space-unit) * 2);\n}\n\n:host > article.search div.header {\n display: flex;\n height: 24px;\n flex-flow: row nowrap;\n align-content: stretch;\n align-items: center;\n justify-content: space-between;\n margin-bottom: calc(var(--space-unit) * 1.5);\n white-space: nowrap;\n}\n\n:host > article.search div.cover div.img-wrapper {\n height: 314px;\n border-radius: var(--border-radius);\n}\n\n:host > article.search .title {\n display: block;\n height: initial;\n align-self: unset;\n font-size: var(--font-size-3);\n}\n\n:host > article.search .title,\n:host > article.search .subtitle,\n:host > article.search .authors {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/* COMPACT STYLES */\n\n:host > article.compact {\n width: var(--z-book-card-compact-width);\n height: var(--z-book-card-compact-height);\n}\n\n:host > article.compact.borderless {\n border: none;\n}\n\n:host > article.compact div.cover div.img-wrapper {\n width: 100%;\n height: calc(var(--z-book-card-compact-width) * 1.36);\n box-sizing: border-box;\n border: none;\n background: var(--color-white);\n border-radius: var(--border-radius) var(--border-radius) 0 0;\n box-shadow: var(--shadow-2);\n}\n\n:host > article.compact div.wrapper {\n display: flex;\n height: 100%;\n flex-flow: column nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: flex-start;\n}\n\n:host > article.compact div.content {\n display: flex;\n box-sizing: border-box;\n flex-flow: column nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: space-between;\n padding: calc(var(--space-unit) * 2);\n padding-top: var(--space-unit);\n margin: 0;\n}\n\n:host > article.compact div.action-container {\n padding: calc(var(--space-unit) * 2);\n padding-top: 0;\n margin-top: auto;\n}\n\n:host > article.compact.borderless div.cover div.img-wrapper {\n width: var(--z-book-card-compact-width);\n}\n\n:host > article.compact.borderless div.content {\n padding: 0;\n padding-top: var(--space-unit);\n}\n\n:host > article.compact.borderless div.action-container {\n padding: 0;\n padding-bottom: calc(var(--space-unit) * 2);\n}\n\n:host > article.compact .title {\n display: block;\n height: initial;\n align-self: unset;\n}\n\n:host > article.compact .title,\n:host > article.compact .subtitle,\n:host > article.compact .authors {\n display: -webkit-box;\n overflow: hidden;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n white-space: initial;\n}\n\n/* Tablet breakpoint */\n@media (min-width: 768px) {\n :host > article {\n width: 100%;\n max-width: initial;\n }\n\n :host > article .title {\n display: block;\n height: initial;\n align-self: unset;\n }\n\n /* EXPANDED STYLES */\n\n :host > article.expanded {\n width: 100%;\n min-width: initial;\n max-width: initial;\n height: 360px;\n padding: 0;\n border: 0;\n }\n\n :host > article.expanded div.wrapper {\n display: flex;\n flex-flow: row nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: flex-start;\n }\n\n :host > article.expanded div.cover div.img-wrapper {\n width: 262px;\n height: 356px;\n border: 0;\n border: var(--border-size-medium) solid var(--color-surface03);\n border-right: none;\n background: var(--color-surface01);\n border-radius: var(--border-radius) 0 0 var(--border-radius);\n }\n\n :host > article.expanded div.cover div.img-wrapper img {\n width: auto;\n border-radius: 0;\n }\n\n :host > article.expanded div.content {\n display: flex;\n overflow: hidden;\n width: 100%;\n height: 356px;\n flex-flow: column nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: space-between;\n border: var(--border-size-medium) solid var(--color-surface03);\n border-left: none;\n margin: 0;\n background: var(--color-surface01);\n border-radius: 0 var(--border-radius) var(--border-radius) 0;\n }\n\n :host > article.expanded div.content div.top {\n padding: calc(var(--space-unit) * 2);\n padding-bottom: 0;\n }\n\n :host > article.expanded div.content div.top div.info {\n display: flex;\n flex-flow: row nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: space-between;\n margin-bottom: calc(var(--space-unit) / 2);\n }\n\n :host > article.expanded div.content div.top div.info > div.left {\n width: 100%;\n }\n\n :host > article.expanded div.content div.bottom {\n padding: calc(var(--space-unit) * 2);\n padding-bottom: 0;\n }\n}\n\n/* Desktop breakpoint */\n\n@media (min-width: 1152px) {\n :host > article {\n width: fit-content;\n max-width: initial;\n }\n}\n\n/* Wide breakpoint */\n@media (min-width: 1366px) {\n :host > article.expanded {\n width: 635px;\n }\n\n :host > article.expanded div.content {\n width: 369px;\n }\n}\n","import {Component, Element, Event, EventEmitter, Prop, State, h} from \"@stencil/core\";\nimport {BookCardVariant} from \"../../beans\";\nimport {mobileBreakpoint} from \"../../constants/breakpoints\";\nimport {randomId} from \"../../utils/utils\";\n\n/**\n * @slot resources - books resources (extended variant only)\n * @slot header-cta - header CTA (e.g. bookmark icon - extended and search variant only)\n * @slot tags - card tags (extended and search variant only)\n * @slot footer-cta - footer cta button (search and compact variant only)\n * @cssprop --z-book-card-ribbon-background-color - ribbon backgrund color\n * @cssprop --z-book-card-ribbon-shadow-color - ribbon shadow color\n * @cssprop --z-book-card-compact-width - compact card custom width\n * @cssprop --z-book-card-compact-height - compact card custom height\n */\n@Component({\n tag: \"z-book-card\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZBookCard {\n @Element() hostElement: HTMLZBookCardElement;\n\n /**\n * Card variant: expanded, compact, search\n */\n @Prop()\n variant: BookCardVariant;\n\n /**\n * Cover URL\n */\n @Prop()\n cover: string;\n\n /**\n * Card main title\n */\n @Prop()\n operaTitle: string;\n\n /**\n * [optional] Card subtitle\n */\n @Prop()\n volumeTitle?: string;\n\n /**\n * [optional] Authors\n */\n @Prop()\n authors?: string;\n\n /**\n * [optional] Main ISBN\n */\n @Prop()\n isbn?: string;\n\n /**\n * [optional] ISBN label\n */\n @Prop()\n isbnLabel = \"\";\n\n /**\n * [optional] Ribbon label - expanded and search variant only\n */\n @Prop()\n ribbon?: string;\n\n /**\n * [optional] Ribbon icon - expanded and search variant only\n */\n @Prop()\n ribbonIcon?: string;\n\n /**\n * [optional] Ribbon interactive - expanded and search variant only\n */\n @Prop()\n ribbonInteractive?: boolean;\n\n /**\n * [optional] Borderless card - compact variant only\n */\n @Prop()\n borderless?: boolean;\n\n /**\n * [optional] Fallback cover URL\n */\n @Prop()\n fallbackCover?: string;\n\n /**\n * [optional] [accessibility] Card title HTML tag\n */\n @Prop()\n operaTitleTag?: string;\n\n @State()\n isMobile = false;\n\n @State()\n hasResources = false;\n\n @State()\n showResources = false;\n\n /** click on interactive ribbon */\n @Event()\n ribbonClick: EventEmitter;\n\n private emitRibbonClick(): void {\n this.ribbonClick.emit();\n }\n\n private id: string;\n\n componentWillLoad(): void {\n this.id = `id-${randomId()}`;\n\n const mobileMediaQuery = window.matchMedia(`(max-width: ${mobileBreakpoint}px)`);\n this.isMobile = mobileMediaQuery.matches;\n mobileMediaQuery.onchange = (mql) => (this.isMobile = mql.matches);\n }\n\n componentDidLoad(): void {\n this.handleResources();\n }\n\n private handleResources(): void {\n if (this.variant !== BookCardVariant.EXPANDED || !this.isMobile) {\n return;\n }\n this.hasResources = this.hostElement.querySelectorAll(\"[slot=resources]\")?.length > 0;\n }\n\n private toggleResources(): void {\n this.showResources = !this.showResources;\n }\n\n private renderCard(): HTMLDivElement {\n switch (this.variant) {\n case BookCardVariant.EXPANDED:\n return this.isMobile ? this.renderMobileExpandedCard() : this.renderExpandedCard();\n case BookCardVariant.COMPACT:\n return this.renderCompactCard();\n case BookCardVariant.SEARCH:\n return this.renderSearchCard();\n }\n }\n\n private renderExpandedCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n {this.renderCover()}\n <div class=\"content\">\n <div class=\"top\">\n <div class=\"info\">\n <div class=\"left\">\n {this.renderAuthors()}\n {this.renderOperaTitle()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n <div class=\"right\">{this.renderHeaderCtaSlot()}</div>\n </div>\n {this.renderTagsSlot()}\n </div>\n <div class=\"bottom\">{this.renderResourcesSlot()}</div>\n </div>\n </div>\n );\n }\n\n private renderMobileExpandedCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n <div class=\"header\">\n {this.renderOperaTitle()}\n {this.renderHeaderCtaSlot()}\n </div>\n {this.renderCover()}\n <div class=\"content\">\n {this.renderTagsSlot()}\n {this.renderAuthors()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n {this.hasResources && (\n <div\n class={{\n footer: true,\n open: this.showResources,\n close: !this.showResources,\n }}\n >\n {!this.showResources && this.renderShowResources()}\n {this.renderResourcesSlot()}\n {this.showResources && this.renderShowResources()}\n </div>\n )}\n </div>\n );\n }\n\n private renderSearchCard(): HTMLDivElement {\n return (\n <div class=\"wrapper-container\">\n <div class=\"wrapper\">\n <div class=\"header\">\n {this.renderOperaTitle()}\n {this.renderHeaderCtaSlot()}\n </div>\n {this.renderCover()}\n <div class=\"content\">\n {this.renderTagsSlot()}\n {this.renderAuthors()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n </div>\n {this.renderFooterCtaSlot()}\n </div>\n );\n }\n\n private renderCompactCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n {this.renderCover()}\n <div class=\"content\">\n {this.renderAuthors()}\n {this.renderOperaTitle()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n {this.renderFooterCtaSlot()}\n </div>\n );\n }\n\n private renderCover(): HTMLDivElement {\n return (\n <div class=\"cover\">\n {this.ribbon && this.variant !== BookCardVariant.COMPACT && this.renderRibbon()}\n <div class=\"img-wrapper\">\n <img\n src={this.cover}\n onError={() => {\n if (this.fallbackCover) {\n this.cover = this.fallbackCover;\n }\n }}\n aria-hidden=\"true\"\n />\n </div>\n </div>\n );\n }\n\n private renderRibbon(): HTMLElement {\n const content = [\n this.ribbonIcon && (\n <z-icon\n name={this.ribbonIcon}\n width={16}\n height={16}\n fill={\"color-inverse-icon\"}\n />\n ),\n <span>{this.ribbon}</span>,\n ];\n\n return this.ribbonInteractive ? (\n <button\n class=\"ribbon interactive\"\n onClick={() => this.emitRibbonClick()}\n >\n {content}\n </button>\n ) : (\n <div class=\"ribbon\">{content}</div>\n );\n }\n\n private renderOperaTitle(): HTMLDivElement {\n const title = this.operaTitleTag\n ? `<${this.operaTitleTag}>${this.operaTitle}</${this.operaTitleTag}>`\n : this.operaTitle;\n\n return (\n <div\n class=\"title\"\n innerHTML={title}\n />\n );\n }\n\n private renderVolumeTitle(): null | HTMLDivElement {\n return this.volumeTitle ? <div class=\"subtitle\">{this.volumeTitle}</div> : null;\n }\n\n private renderAuthors(): null | HTMLDivElement {\n return this.authors ? (\n <div\n class=\"authors\"\n aria-description=\"Autori\"\n >\n {this.authors}\n </div>\n ) : null;\n }\n\n private renderIsbn(): null | HTMLDivElement {\n return this.isbn ? (\n <div class=\"isbn\">\n <span\n class=\"code\"\n aria-description={`ISBN ${this.isbnLabel}`}\n >\n {this.isbn}\n </span>\n {this.isbnLabel ? <span class=\"label\"> {this.isbnLabel}</span> : null}\n </div>\n ) : null;\n }\n\n private renderShowResources(): HTMLButtonElement {\n return (\n <button\n class=\"show-resources\"\n aria-label={`Risorse del libro ${this.operaTitle}`}\n aria-expanded={this.showResources.toString()}\n aria-controls={`resources-${this.id}`}\n onClick={() => this.toggleResources()}\n >\n {this.showResources ? \"Chiudi\" : \"Vedi tutto\"}\n <z-icon name={this.showResources ? \"chevron-up\" : \"chevron-down\"} />\n </button>\n );\n }\n\n private renderTagsSlot(): HTMLDivElement {\n return (\n <div class=\"tags\">\n <slot name=\"tags\" />\n </div>\n );\n }\n\n private renderHeaderCtaSlot(): HTMLSlotElement {\n return <slot name=\"header-cta\" />;\n }\n\n private renderResourcesSlot(): HTMLDivElement {\n return (\n <div\n id={`resources-${this.id}`}\n class=\"resources\"\n >\n <slot\n name=\"resources\"\n onSlotchange={() => this.handleResources()}\n />\n </div>\n );\n }\n\n private renderFooterCtaSlot(): HTMLDivElement {\n return (\n <div class=\"action-container\">\n <slot name=\"footer-cta\" />\n </div>\n );\n }\n\n render(): HTMLZBookCardElement {\n return (\n <article\n class={{\n [this.variant]: true,\n borderless: !!this.borderless,\n }}\n >\n {this.renderCard()}\n </article>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
package/dist/esm-es5/z-card.entry.js CHANGED
@@ -1,2 +1,2 @@
1
- import{r as registerInstance,h,a as Host,g as getElement}from"./index-ab5f1eaa.js";import{C as CardVariant}from"./index-2255c6c8.js";var stylesCss=':host{--aspect-ratio:1.62;--z-card--border-color:var(--gray200);--z-card--color-cover-background:var(--color-surface01);--z-card--text-background:var(--color-surface01);--z-card--text-border-radius:none;--z-card--text-border:none;--z-card--text-padding:calc(var(--space-unit) * 2) var(--space-unit);position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-family:var(--font-family-sans);font-weight:var(--font-rg)}*,::slotted(*){-webkit-box-sizing:border-box;box-sizing:border-box}:host(:not([variant="overlay"])) .cover-container{position:relative;width:100%}.cover-container{padding-bottom:calc(100% / var(--aspect-ratio))}::slotted([slot="cover"]),.color-cover{position:absolute;top:0;left:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center}.cover-container>z-icon{--z-icon-width:calc(var(--space-unit) * 11);--z-icon-height:var(--z-icon-width);position:absolute;top:calc(50% - calc(var(--z-icon-height) / 2));left:calc(50% - calc(var(--z-icon-width) / 2));fill:var(--color-primary01)}.color-cover{background-color:var(--z-card--color-cover-background)}.content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding-top:var(--space-unit)}.color-cover .cover-content{display:-ms-flexbox;display:flex;height:100%;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:end;justify-content:flex-end;padding:var(--space-unit)}::slotted([slot="metadata"]),::slotted([slot="title"]),::slotted([slot="text"]){display:-webkit-inline-box;overflow:hidden;-webkit-box-orient:vertical}::slotted([slot="title"]:not(:last-child)),::slotted([slot="text"]:not(:last-child)){margin-bottom:var(--space-unit)}::slotted([slot="title"])::before{position:absolute;z-index:1;top:0;right:0;bottom:0;left:0;content:""}::slotted([slot="metadata"]:not(:last-child)){margin:0 0 calc(var(--space-unit) * 0.25);-webkit-line-clamp:1;text-transform:uppercase}::slotted([slot="title"]){margin:0;color:inherit;font-size:inherit;font-weight:var(--font-sb);-webkit-line-clamp:2;text-decoration:none}::slotted([slot="text"]){margin:0;-webkit-line-clamp:3}.actions{position:relative;z-index:2;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}::slotted([slot="action"]:not(:last-child)){margin-right:calc(var(--space-unit) * 2)}:host([clickable]) ::slotted([slot="title"]:focus:focus-visible)::before{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host([clickable]) ::slotted([slot="title"]:focus:focus-visible){-webkit-box-shadow:none !important;box-shadow:none !important;outline:none !important}:host([variant="text"]){border:var(--z-card--text-border);background-color:var(--z-card--text-background);border-radius:var(--z-card--text-border-radius)}:host([show-shadow])>.content,:host([variant="border"])>.content,:host([variant="shadow"])>.content{height:100%;padding:var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2)}:host([variant="text"])>.content{padding:var(--z-card--text-padding)}:host([variant="border"]) .actions,:host([variant="shadow"]) .actions{margin-top:auto}:host([variant="border"]){border:var(--border-size-small) solid var(--z-card--border-color)}:host([variant="border"][clickable]:hover)>.content{background:var(--color-background)}:host([variant="border"][clickable]:focus:focus-visible){-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host([variant="border"][clickable]:active){border-color:transparent}:host([variant="shadow"]),:host([show-shadow]){-webkit-box-shadow:var(--shadow-2);box-shadow:var(--shadow-2)}:host([variant="shadow"][clickable]:hover),:host([clickable][show-shadow]:hover){-webkit-box-shadow:var(--shadow-4);box-shadow:var(--shadow-4)}:host([variant="shadow"][clickable]:focus:focus-visible),:host([clickable][show-shadow]:focus:focus-visible){-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host([variant="shadow"][clickable]:active),:host([clickable][show-shadow]:active){-webkit-box-shadow:none;box-shadow:none}:host([variant="overlay"]) .content{position:absolute;top:0;right:0;bottom:0;left:0;-ms-flex-pack:end;justify-content:flex-end;padding:var(--space-unit);background-image:-webkit-gradient(linear, left bottom, left top, from(rgb(0 0 0 / 100%)), to(rgb(0 0 0 / 0%)));background-image:linear-gradient(to top, rgb(0 0 0 / 100%), rgb(0 0 0 / 0%));color:var(--color-text-inverse);fill:var(--color-text-inverse)}';var ZCardStyle0=stylesCss;var ZCard=function(){function t(t){registerInstance(this,t);this.variant=undefined;this.coverIcon=undefined;this.showShadow=false;this.clickable=false;this.hasCoverImage=undefined}t.prototype.componentWillLoad=function(){this.hasCoverImage=this.host.querySelector('[slot="cover"]')!==null};t.prototype.renderColorCoverCard=function(){return[h("div",{class:"cover-container"},h("div",{class:"color-cover"},h("div",{class:"cover-content"},h("slot",{name:"metadata"}),h("slot",{name:"title"})))),h("div",{class:"content"},h("slot",{name:"text"}),h("div",{class:"actions"},h("slot",{name:"action"})))]};t.prototype.renderContentDiv=function(){return h("div",{class:"content"},h("slot",{name:"metadata"}),h("slot",{name:"title"}),h("slot",{name:"text"}),h("div",{class:"actions"},h("slot",{name:"action"})))};t.prototype.render=function(){if(this.variant===CardVariant.TEXT){return h(Host,null,this.renderContentDiv())}if(this.variant===CardVariant.OVERLAY||this.hasCoverImage){return h(Host,null,h("div",{class:"cover-container"},this.hasCoverImage&&[h("slot",{name:"cover"}),this.variant!==CardVariant.OVERLAY&&this.coverIcon&&h("z-icon",{name:this.coverIcon})],!this.hasCoverImage&&h("div",{class:"color-cover"})),this.renderContentDiv())}return h(Host,null,this.renderColorCoverCard())};Object.defineProperty(t.prototype,"host",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();ZCard.style=ZCardStyle0;export{ZCard as z_card};
1
+ import{r as registerInstance,h,a as Host,g as getElement}from"./index-ab5f1eaa.js";import{C as CardVariant}from"./index-2255c6c8.js";var stylesCss=':host{--aspect-ratio:1.62;--z-card--border-color:var(--gray200);--z-card--color-cover-background:var(--color-surface01);--z-card--text-background:var(--color-surface01);--z-card--text-border-radius:none;--z-card--text-border:none;--z-card--text-padding:calc(var(--space-unit) * 2) var(--space-unit);position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-family:var(--font-family-sans);font-weight:var(--font-rg)}*,::slotted(*){-webkit-box-sizing:border-box;box-sizing:border-box}*:focus{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary);outline:none !important}:host(:not([variant="overlay"])) .cover-container{position:relative;width:100%}.cover-container{padding-bottom:calc(100% / var(--aspect-ratio))}::slotted([slot="cover"]),.color-cover{position:absolute;top:0;left:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center}.cover-container>z-icon{--z-icon-width:calc(var(--space-unit) * 11);--z-icon-height:var(--z-icon-width);position:absolute;top:calc(50% - calc(var(--z-icon-height) / 2));left:calc(50% - calc(var(--z-icon-width) / 2));fill:var(--color-primary01)}.color-cover{background-color:var(--z-card--color-cover-background)}.content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding-top:var(--space-unit)}.color-cover .cover-content{display:-ms-flexbox;display:flex;height:100%;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:end;justify-content:flex-end;padding:var(--space-unit)}::slotted([slot="metadata"]),::slotted([slot="title"]),::slotted([slot="text"]){display:-webkit-inline-box;overflow:hidden;-webkit-box-orient:vertical}::slotted([slot="title"]:not(:last-child)),::slotted([slot="text"]:not(:last-child)){margin-bottom:var(--space-unit)}::slotted([slot="title"])::before{position:absolute;z-index:1;top:0;right:0;bottom:0;left:0;content:""}::slotted([slot="metadata"]:not(:last-child)){margin:0 0 calc(var(--space-unit) * 0.25);-webkit-line-clamp:1;text-transform:uppercase}::slotted([slot="title"]){margin:0;color:inherit;font-size:inherit;font-weight:var(--font-sb);-webkit-line-clamp:2;text-decoration:none}::slotted([slot="title"]:focus){-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary);outline:none !important}::slotted([slot="text"]){margin:0;-webkit-line-clamp:3}.actions{position:relative;z-index:2;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}::slotted([slot="action"]:not(:last-child)){margin-right:calc(var(--space-unit) * 2)}::slotted([slot="action"]:focus){-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary);outline:none !important}:host([clickable]) ::slotted([slot="title"]:focus:focus-visible)::before{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host([clickable]) ::slotted([slot="title"]:focus:focus-visible){-webkit-box-shadow:none !important;box-shadow:none !important;outline:none !important}:host([variant="text"]){border:var(--z-card--text-border);background-color:var(--z-card--text-background);border-radius:var(--z-card--text-border-radius)}:host([show-shadow])>.content,:host([variant="border"])>.content,:host([variant="shadow"])>.content{height:100%;padding:var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2)}:host([variant="text"])>.content{padding:var(--z-card--text-padding)}:host([variant="border"]) .actions,:host([variant="shadow"]) .actions{margin-top:auto}:host([variant="border"]){border:var(--border-size-small) solid var(--z-card--border-color)}:host([variant="border"][clickable]:hover)>.content{background:var(--color-background)}:host([variant="border"][clickable]:focus:focus-visible){-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host([variant="border"][clickable]:active){border-color:transparent}:host([variant="shadow"]),:host([show-shadow]){-webkit-box-shadow:var(--shadow-2);box-shadow:var(--shadow-2)}:host([variant="shadow"][clickable]:hover),:host([clickable][show-shadow]:hover){-webkit-box-shadow:var(--shadow-4);box-shadow:var(--shadow-4)}:host([variant="shadow"][clickable]:focus:focus-visible),:host([clickable][show-shadow]:focus:focus-visible){-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host([variant="shadow"][clickable]:active),:host([clickable][show-shadow]:active){-webkit-box-shadow:none;box-shadow:none}:host([variant="overlay"]) .content{position:absolute;top:0;right:0;bottom:0;left:0;-ms-flex-pack:end;justify-content:flex-end;padding:var(--space-unit);background-image:-webkit-gradient(linear, left bottom, left top, from(rgb(0 0 0 / 100%)), to(rgb(0 0 0 / 0%)));background-image:linear-gradient(to top, rgb(0 0 0 / 100%), rgb(0 0 0 / 0%));color:var(--color-text-inverse);fill:var(--color-text-inverse)}';var ZCardStyle0=stylesCss;var ZCard=function(){function o(o){registerInstance(this,o);this.variant=undefined;this.coverIcon=undefined;this.showShadow=false;this.clickable=false;this.hasCoverImage=undefined}o.prototype.componentWillLoad=function(){this.hasCoverImage=this.host.querySelector('[slot="cover"]')!==null};o.prototype.renderColorCoverCard=function(){return[h("div",{class:"cover-container"},h("div",{class:"color-cover"},h("div",{class:"cover-content"},h("slot",{name:"metadata"}),h("slot",{name:"title"})))),h("div",{class:"content"},h("slot",{name:"text"}),h("div",{class:"actions"},h("slot",{name:"action"})))]};o.prototype.renderContentDiv=function(){return h("div",{class:"content"},h("slot",{name:"metadata"}),h("slot",{name:"title"}),h("slot",{name:"text"}),h("div",{class:"actions"},h("slot",{name:"action"})))};o.prototype.render=function(){if(this.variant===CardVariant.TEXT){return h(Host,null,this.renderContentDiv())}if(this.variant===CardVariant.OVERLAY||this.hasCoverImage){return h(Host,null,h("div",{class:"cover-container"},this.hasCoverImage&&[h("slot",{name:"cover"}),this.variant!==CardVariant.OVERLAY&&this.coverIcon&&h("z-icon",{name:this.coverIcon})],!this.hasCoverImage&&h("div",{class:"color-cover"})),this.renderContentDiv())}return h(Host,null,this.renderColorCoverCard())};Object.defineProperty(o.prototype,"host",{get:function(){return getElement(this)},enumerable:false,configurable:true});return o}();ZCard.style=ZCardStyle0;export{ZCard as z_card};
2
2
  //# sourceMappingURL=z-card.entry.js.map
package/dist/esm-es5/z-card.entry.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["stylesCss","ZCardStyle0","ZCard","prototype","componentWillLoad","this","hasCoverImage","host","querySelector","renderColorCoverCard","h","class","name","renderContentDiv","render","variant","CardVariant","TEXT","Host","OVERLAY","coverIcon"],"sources":["src/components/z-card/styles.css?tag=z-card&encapsulation=shadow","src/components/z-card/index.tsx"],"sourcesContent":["/* The width of the card must be set by its container,\nrespecting the grid indications of the design. */\n\n:host {\n /* Override this var to change the cover's aspect ratio */\n --aspect-ratio: 1.62;\n --z-card--border-color: var(--gray200);\n --z-card--color-cover-background: var(--color-surface01);\n --z-card--text-background: var(--color-surface01);\n --z-card--text-border-radius: none;\n --z-card--text-border: none;\n --z-card--text-padding: calc(var(--space-unit) * 2) var(--space-unit);\n\n position: relative;\n display: flex;\n flex-direction: column;\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n*,\n::slotted(*) {\n box-sizing: border-box;\n}\n\n:host(:not([variant=\"overlay\"])) .cover-container {\n position: relative;\n width: 100%;\n}\n\n/* Old good trick with percentage padding to keep the aspect ratio.\nUnfortunately the `aspect-ratio` property is still experimental */\n.cover-container {\n padding-bottom: calc(100% / var(--aspect-ratio));\n}\n\n::slotted([slot=\"cover\"]),\n.color-cover {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n object-position: center;\n}\n\n.cover-container > z-icon {\n --z-icon-width: calc(var(--space-unit) * 11);\n --z-icon-height: var(--z-icon-width);\n\n position: absolute;\n top: calc(50% - calc(var(--z-icon-height) / 2));\n left: calc(50% - calc(var(--z-icon-width) / 2));\n fill: var(--color-primary01);\n}\n\n.color-cover {\n background-color: var(--z-card--color-cover-background);\n}\n\n.content {\n display: flex;\n flex-direction: column;\n padding-top: var(--space-unit);\n}\n\n.color-cover .cover-content {\n display: flex;\n height: 100%;\n flex-direction: column;\n justify-content: flex-end;\n padding: var(--space-unit);\n}\n\n/* Truncates overflowing text */\n::slotted([slot=\"metadata\"]),\n::slotted([slot=\"title\"]),\n::slotted([slot=\"text\"]) {\n display: -webkit-inline-box;\n overflow: hidden;\n -webkit-box-orient: vertical;\n}\n\n::slotted([slot=\"title\"]:not(:last-child)),\n::slotted([slot=\"text\"]:not(:last-child)) {\n margin-bottom: var(--space-unit);\n}\n\n::slotted([slot=\"title\"])::before {\n position: absolute;\n z-index: 1;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n content: \"\";\n}\n\n::slotted([slot=\"metadata\"]:not(:last-child)) {\n margin: 0 0 calc(var(--space-unit) * 0.25);\n -webkit-line-clamp: 1;\n text-transform: uppercase;\n}\n\n::slotted([slot=\"title\"]) {\n margin: 0;\n color: inherit;\n font-size: inherit;\n font-weight: var(--font-sb);\n -webkit-line-clamp: 2;\n text-decoration: none;\n}\n\n::slotted([slot=\"text\"]) {\n margin: 0;\n -webkit-line-clamp: 3;\n}\n\n.actions {\n position: relative;\n z-index: 2;\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n\n::slotted([slot=\"action\"]:not(:last-child)) {\n margin-right: calc(var(--space-unit) * 2);\n}\n\n:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible)::before {\n box-shadow: var(--shadow-focus-primary);\n}\n\n:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible) {\n box-shadow: none !important;\n outline: none !important;\n}\n\n:host([variant=\"text\"]) {\n border: var(--z-card--text-border);\n background-color: var(--z-card--text-background);\n border-radius: var(--z-card--text-border-radius);\n}\n\n:host([show-shadow]) > .content,\n:host([variant=\"border\"]) > .content,\n:host([variant=\"shadow\"]) > .content {\n height: 100%;\n padding: var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2);\n}\n\n:host([variant=\"text\"]) > .content {\n padding: var(--z-card--text-padding);\n}\n\n:host([variant=\"border\"]) .actions,\n:host([variant=\"shadow\"]) .actions {\n margin-top: auto;\n}\n\n/* Border */\n:host([variant=\"border\"]) {\n border: var(--border-size-small) solid var(--z-card--border-color);\n}\n\n:host([variant=\"border\"][clickable]:hover) > .content {\n background: var(--color-background);\n}\n\n:host([variant=\"border\"][clickable]:focus:focus-visible) {\n box-shadow: var(--shadow-focus-primary);\n}\n\n:host([variant=\"border\"][clickable]:active) {\n border-color: transparent;\n}\n\n/* Shadow */\n:host([variant=\"shadow\"]),\n:host([show-shadow]) {\n box-shadow: var(--shadow-2);\n}\n\n:host([variant=\"shadow\"][clickable]:hover),\n:host([clickable][show-shadow]:hover) {\n box-shadow: var(--shadow-4);\n}\n\n:host([variant=\"shadow\"][clickable]:focus:focus-visible),\n:host([clickable][show-shadow]:focus:focus-visible) {\n box-shadow: var(--shadow-focus-primary);\n}\n\n:host([variant=\"shadow\"][clickable]:active),\n:host([clickable][show-shadow]:active) {\n box-shadow: none;\n}\n\n/* Overlay */\n:host([variant=\"overlay\"]) .content {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n justify-content: flex-end;\n padding: var(--space-unit);\n background-image: linear-gradient(to top, rgb(0 0 0 / 100%), rgb(0 0 0 / 0%));\n color: var(--color-text-inverse);\n fill: var(--color-text-inverse);\n}\n","import {Component, Element, Host, Prop, State, h} from \"@stencil/core\";\nimport {CardVariant} from \"../../beans\";\n\n/**\n * ZCard component.\n * @cssprop --aspect-ratio - Cover aspect ratio. Default: `1.62`\n * @cssprop --z-card--border-color - Default: `var(--gray200)`\n * @cssprop --z-card--color-cover-background - Cover color. Default: `var(--color-surface01)`\n * @cssprop --z-card--text-background - Background color for the `text` variant. Default: `var(--color-surface01)`\n * @cssprop --z-card--text-border-radius - Default: `none`\n * @cssprop --z-card--text-border - Configure CSS `border`. Default: `none`\n * @cssprop --z-card--text-padding - Configure CSS `padding`. Default: `none`\n * @slot cover - Image cover\n * @slot metadata - Metadata\n * @slot title - Title\n * @slot text - Text content\n * @slot action - Actions\n */\n@Component({\n tag: \"z-card\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZCard {\n /**\n * Card variant.\n * Can be one of \"text\", \"border\", \"shadow\", \"overlay\".\n * Leave it undefined for the default card.\n */\n @Prop({reflect: true})\n variant: CardVariant;\n\n /** Name of the icon to place over the image cover */\n @Prop()\n coverIcon: string;\n\n /** Enable shadow. Default: false. */\n @Prop({reflect: true})\n showShadow = false;\n\n /** Enable 'clickable' style like hover and focus style. */\n @Prop({reflect: true})\n clickable = false;\n\n @Element() host: HTMLZCardElement;\n\n @State()\n hasCoverImage: boolean;\n\n componentWillLoad(): void {\n this.hasCoverImage = this.host.querySelector('[slot=\"cover\"]') !== null;\n }\n\n /**\n * Template for a card without image cover.\n * A colored background replaces the image and some data is moved over it.\n */\n private renderColorCoverCard(): HTMLDivElement[] {\n return [\n <div class=\"cover-container\">\n <div class=\"color-cover\">\n <div class=\"cover-content\">\n <slot name=\"metadata\"></slot>\n <slot name=\"title\"></slot>\n </div>\n </div>\n </div>,\n <div class=\"content\">\n <slot name=\"text\"></slot>\n <div class=\"actions\">\n <slot name=\"action\"></slot>\n </div>\n </div>,\n ];\n }\n\n /**\n * Template for the content div.\n */\n private renderContentDiv(): HTMLDivElement {\n return (\n <div class=\"content\">\n <slot name=\"metadata\"></slot>\n <slot name=\"title\"></slot>\n <slot name=\"text\"></slot>\n <div class=\"actions\">\n <slot name=\"action\"></slot>\n </div>\n </div>\n );\n }\n\n render(): HTMLZCardElement {\n if (this.variant === CardVariant.TEXT) {\n return <Host>{this.renderContentDiv()}</Host>;\n }\n\n if (this.variant === CardVariant.OVERLAY || this.hasCoverImage) {\n return (\n <Host>\n <div class=\"cover-container\">\n {this.hasCoverImage && [\n <slot name=\"cover\"></slot>,\n this.variant !== CardVariant.OVERLAY && this.coverIcon && <z-icon name={this.coverIcon}></z-icon>,\n ]}\n {!this.hasCoverImage && <div class=\"color-cover\"></div>}\n </div>\n {this.renderContentDiv()}\n </Host>\n );\n }\n\n return <Host>{this.renderColorCoverCard()}</Host>;\n }\n}\n"],"mappings":"qIAAA,IAAMA,UAAY,k+IAClB,IAAAC,YAAeD,U,ICsBFE,MAAK,W,uGAeH,M,eAID,M,6BAOZA,EAAAC,UAAAC,kBAAA,WACEC,KAAKC,cAAgBD,KAAKE,KAAKC,cAAc,oBAAsB,I,EAO7DN,EAAAC,UAAAM,qBAAA,WACN,MAAO,CACLC,EAAA,OAAKC,MAAM,mBACTD,EAAA,OAAKC,MAAM,eACTD,EAAA,OAAKC,MAAM,iBACTD,EAAA,QAAME,KAAK,aACXF,EAAA,QAAME,KAAK,aAIjBF,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,SACXF,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,a,EASXV,EAAAC,UAAAU,iBAAA,WACN,OACEH,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,aACXF,EAAA,QAAME,KAAK,UACXF,EAAA,QAAME,KAAK,SACXF,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,Y,EAMnBV,EAAAC,UAAAW,OAAA,WACE,GAAIT,KAAKU,UAAYC,YAAYC,KAAM,CACrC,OAAOP,EAACQ,KAAI,KAAEb,KAAKQ,mB,CAGrB,GAAIR,KAAKU,UAAYC,YAAYG,SAAWd,KAAKC,cAAe,CAC9D,OACEI,EAACQ,KAAI,KACHR,EAAA,OAAKC,MAAM,mBACRN,KAAKC,eAAiB,CACrBI,EAAA,QAAME,KAAK,UACXP,KAAKU,UAAYC,YAAYG,SAAWd,KAAKe,WAAaV,EAAA,UAAQE,KAAMP,KAAKe,cAE7Ef,KAAKC,eAAiBI,EAAA,OAAKC,MAAM,iBAEpCN,KAAKQ,mB,CAKZ,OAAOH,EAACQ,KAAI,KAAEb,KAAKI,uB,kIAzFL,G","ignoreList":[]}
1
+ {"version":3,"names":["stylesCss","ZCardStyle0","ZCard","prototype","componentWillLoad","this","hasCoverImage","host","querySelector","renderColorCoverCard","h","class","name","renderContentDiv","render","variant","CardVariant","TEXT","Host","OVERLAY","coverIcon"],"sources":["src/components/z-card/styles.css?tag=z-card&encapsulation=shadow","src/components/z-card/index.tsx"],"sourcesContent":["/* The width of the card must be set by its container,\nrespecting the grid indications of the design. */\n\n:host {\n /* Override this var to change the cover's aspect ratio */\n --aspect-ratio: 1.62;\n --z-card--border-color: var(--gray200);\n --z-card--color-cover-background: var(--color-surface01);\n --z-card--text-background: var(--color-surface01);\n --z-card--text-border-radius: none;\n --z-card--text-border: none;\n --z-card--text-padding: calc(var(--space-unit) * 2) var(--space-unit);\n\n position: relative;\n display: flex;\n flex-direction: column;\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n*,\n::slotted(*) {\n box-sizing: border-box;\n}\n\n*:focus {\n box-shadow: var(--shadow-focus-primary);\n outline: none !important;\n}\n\n:host(:not([variant=\"overlay\"])) .cover-container {\n position: relative;\n width: 100%;\n}\n\n/* Old good trick with percentage padding to keep the aspect ratio.\nUnfortunately the `aspect-ratio` property is still experimental */\n.cover-container {\n padding-bottom: calc(100% / var(--aspect-ratio));\n}\n\n::slotted([slot=\"cover\"]),\n.color-cover {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n object-position: center;\n}\n\n.cover-container > z-icon {\n --z-icon-width: calc(var(--space-unit) * 11);\n --z-icon-height: var(--z-icon-width);\n\n position: absolute;\n top: calc(50% - calc(var(--z-icon-height) / 2));\n left: calc(50% - calc(var(--z-icon-width) / 2));\n fill: var(--color-primary01);\n}\n\n.color-cover {\n background-color: var(--z-card--color-cover-background);\n}\n\n.content {\n display: flex;\n flex-direction: column;\n padding-top: var(--space-unit);\n}\n\n.color-cover .cover-content {\n display: flex;\n height: 100%;\n flex-direction: column;\n justify-content: flex-end;\n padding: var(--space-unit);\n}\n\n/* Truncates overflowing text */\n::slotted([slot=\"metadata\"]),\n::slotted([slot=\"title\"]),\n::slotted([slot=\"text\"]) {\n display: -webkit-inline-box;\n overflow: hidden;\n -webkit-box-orient: vertical;\n}\n\n::slotted([slot=\"title\"]:not(:last-child)),\n::slotted([slot=\"text\"]:not(:last-child)) {\n margin-bottom: var(--space-unit);\n}\n\n::slotted([slot=\"title\"])::before {\n position: absolute;\n z-index: 1;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n content: \"\";\n}\n\n::slotted([slot=\"metadata\"]:not(:last-child)) {\n margin: 0 0 calc(var(--space-unit) * 0.25);\n -webkit-line-clamp: 1;\n text-transform: uppercase;\n}\n\n::slotted([slot=\"title\"]) {\n margin: 0;\n color: inherit;\n font-size: inherit;\n font-weight: var(--font-sb);\n -webkit-line-clamp: 2;\n text-decoration: none;\n}\n\n::slotted([slot=\"title\"]:focus) {\n box-shadow: var(--shadow-focus-primary);\n outline: none !important;\n}\n\n::slotted([slot=\"text\"]) {\n margin: 0;\n -webkit-line-clamp: 3;\n}\n\n.actions {\n position: relative;\n z-index: 2;\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n\n::slotted([slot=\"action\"]:not(:last-child)) {\n margin-right: calc(var(--space-unit) * 2);\n}\n\n::slotted([slot=\"action\"]:focus) {\n box-shadow: var(--shadow-focus-primary);\n outline: none !important;\n}\n\n:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible)::before {\n box-shadow: var(--shadow-focus-primary);\n}\n\n:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible) {\n box-shadow: none !important;\n outline: none !important;\n}\n\n:host([variant=\"text\"]) {\n border: var(--z-card--text-border);\n background-color: var(--z-card--text-background);\n border-radius: var(--z-card--text-border-radius);\n}\n\n:host([show-shadow]) > .content,\n:host([variant=\"border\"]) > .content,\n:host([variant=\"shadow\"]) > .content {\n height: 100%;\n padding: var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2);\n}\n\n:host([variant=\"text\"]) > .content {\n padding: var(--z-card--text-padding);\n}\n\n:host([variant=\"border\"]) .actions,\n:host([variant=\"shadow\"]) .actions {\n margin-top: auto;\n}\n\n/* Border */\n:host([variant=\"border\"]) {\n border: var(--border-size-small) solid var(--z-card--border-color);\n}\n\n:host([variant=\"border\"][clickable]:hover) > .content {\n background: var(--color-background);\n}\n\n:host([variant=\"border\"][clickable]:focus:focus-visible) {\n box-shadow: var(--shadow-focus-primary);\n}\n\n:host([variant=\"border\"][clickable]:active) {\n border-color: transparent;\n}\n\n/* Shadow */\n:host([variant=\"shadow\"]),\n:host([show-shadow]) {\n box-shadow: var(--shadow-2);\n}\n\n:host([variant=\"shadow\"][clickable]:hover),\n:host([clickable][show-shadow]:hover) {\n box-shadow: var(--shadow-4);\n}\n\n:host([variant=\"shadow\"][clickable]:focus:focus-visible),\n:host([clickable][show-shadow]:focus:focus-visible) {\n box-shadow: var(--shadow-focus-primary);\n}\n\n:host([variant=\"shadow\"][clickable]:active),\n:host([clickable][show-shadow]:active) {\n box-shadow: none;\n}\n\n/* Overlay */\n:host([variant=\"overlay\"]) .content {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n justify-content: flex-end;\n padding: var(--space-unit);\n background-image: linear-gradient(to top, rgb(0 0 0 / 100%), rgb(0 0 0 / 0%));\n color: var(--color-text-inverse);\n fill: var(--color-text-inverse);\n}\n","import {Component, Element, Host, Prop, State, h} from \"@stencil/core\";\nimport {CardVariant} from \"../../beans\";\n\n/**\n * ZCard component.\n * @cssprop --aspect-ratio - Cover aspect ratio. Default: `1.62`\n * @cssprop --z-card--border-color - Default: `var(--gray200)`\n * @cssprop --z-card--color-cover-background - Cover color. Default: `var(--color-surface01)`\n * @cssprop --z-card--text-background - Background color for the `text` variant. Default: `var(--color-surface01)`\n * @cssprop --z-card--text-border-radius - Default: `none`\n * @cssprop --z-card--text-border - Configure CSS `border`. Default: `none`\n * @cssprop --z-card--text-padding - Configure CSS `padding`. Default: `none`\n * @slot cover - Image cover\n * @slot metadata - Metadata\n * @slot title - Title\n * @slot text - Text content\n * @slot action - Actions\n */\n@Component({\n tag: \"z-card\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZCard {\n /**\n * Card variant.\n * Can be one of \"text\", \"border\", \"shadow\", \"overlay\".\n * Leave it undefined for the default card.\n */\n @Prop({reflect: true})\n variant: CardVariant;\n\n /** Name of the icon to place over the image cover */\n @Prop()\n coverIcon: string;\n\n /** Enable shadow. Default: false. */\n @Prop({reflect: true})\n showShadow = false;\n\n /** Enable 'clickable' style like hover and focus style. */\n @Prop({reflect: true})\n clickable = false;\n\n @Element() host: HTMLZCardElement;\n\n @State()\n hasCoverImage: boolean;\n\n componentWillLoad(): void {\n this.hasCoverImage = this.host.querySelector('[slot=\"cover\"]') !== null;\n }\n\n /**\n * Template for a card without image cover.\n * A colored background replaces the image and some data is moved over it.\n */\n private renderColorCoverCard(): HTMLDivElement[] {\n return [\n <div class=\"cover-container\">\n <div class=\"color-cover\">\n <div class=\"cover-content\">\n <slot name=\"metadata\"></slot>\n <slot name=\"title\"></slot>\n </div>\n </div>\n </div>,\n <div class=\"content\">\n <slot name=\"text\"></slot>\n <div class=\"actions\">\n <slot name=\"action\"></slot>\n </div>\n </div>,\n ];\n }\n\n /**\n * Template for the content div.\n */\n private renderContentDiv(): HTMLDivElement {\n return (\n <div class=\"content\">\n <slot name=\"metadata\"></slot>\n <slot name=\"title\"></slot>\n <slot name=\"text\"></slot>\n <div class=\"actions\">\n <slot name=\"action\"></slot>\n </div>\n </div>\n );\n }\n\n render(): HTMLZCardElement {\n if (this.variant === CardVariant.TEXT) {\n return <Host>{this.renderContentDiv()}</Host>;\n }\n\n if (this.variant === CardVariant.OVERLAY || this.hasCoverImage) {\n return (\n <Host>\n <div class=\"cover-container\">\n {this.hasCoverImage && [\n <slot name=\"cover\"></slot>,\n this.variant !== CardVariant.OVERLAY && this.coverIcon && <z-icon name={this.coverIcon}></z-icon>,\n ]}\n {!this.hasCoverImage && <div class=\"color-cover\"></div>}\n </div>\n {this.renderContentDiv()}\n </Host>\n );\n }\n\n return <Host>{this.renderColorCoverCard()}</Host>;\n }\n}\n"],"mappings":"qIAAA,IAAMA,UAAY,q3JAClB,IAAAC,YAAeD,U,ICsBFE,MAAK,W,uGAeH,M,eAID,M,6BAOZA,EAAAC,UAAAC,kBAAA,WACEC,KAAKC,cAAgBD,KAAKE,KAAKC,cAAc,oBAAsB,I,EAO7DN,EAAAC,UAAAM,qBAAA,WACN,MAAO,CACLC,EAAA,OAAKC,MAAM,mBACTD,EAAA,OAAKC,MAAM,eACTD,EAAA,OAAKC,MAAM,iBACTD,EAAA,QAAME,KAAK,aACXF,EAAA,QAAME,KAAK,aAIjBF,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,SACXF,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,a,EASXV,EAAAC,UAAAU,iBAAA,WACN,OACEH,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,aACXF,EAAA,QAAME,KAAK,UACXF,EAAA,QAAME,KAAK,SACXF,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,Y,EAMnBV,EAAAC,UAAAW,OAAA,WACE,GAAIT,KAAKU,UAAYC,YAAYC,KAAM,CACrC,OAAOP,EAACQ,KAAI,KAAEb,KAAKQ,mB,CAGrB,GAAIR,KAAKU,UAAYC,YAAYG,SAAWd,KAAKC,cAAe,CAC9D,OACEI,EAACQ,KAAI,KACHR,EAAA,OAAKC,MAAM,mBACRN,KAAKC,eAAiB,CACrBI,EAAA,QAAME,KAAK,UACXP,KAAKU,UAAYC,YAAYG,SAAWd,KAAKe,WAAaV,EAAA,UAAQE,KAAMP,KAAKe,cAE7Ef,KAAKC,eAAiBI,EAAA,OAAKC,MAAM,iBAEpCN,KAAKQ,mB,CAKZ,OAAOH,EAACQ,KAAI,KAAEb,KAAKI,uB,kIAzFL,G","ignoreList":[]}
package/dist/esm-es5/z-date-picker.entry.js CHANGED
@@ -1,4 +1,4 @@
1
- import{r as registerInstance,c as createEvent,h,g as getElement}from"./index-ab5f1eaa.js";import{c as commonjsGlobal,f as flatpickr,i as it,s as setAriaOptions,a as setFlatpickrPosition,v as validateDate}from"./utils-ba4f0770.js";import{z as ZDatePickerMode,G as ZDatePickerPosition,I as InputType}from"./index-2255c6c8.js";var monthSelect={exports:{}};(function(t,r){(function(r,e){t.exports=e()})(commonjsGlobal,(function(){
1
+ import{r as registerInstance,c as createEvent,h,g as getElement}from"./index-ab5f1eaa.js";import{c as commonjsGlobal,f as flatpickr,i as it,s as setAriaOptions,a as setFlatpickrPosition,v as validateDate}from"./utils-cd008fbc.js";import{z as ZDatePickerMode,G as ZDatePickerPosition,I as InputType}from"./index-2255c6c8.js";var monthSelect={exports:{}};(function(t,r){(function(r,e){t.exports=e()})(commonjsGlobal,(function(){
2
2
  /*! *****************************************************************************
3
3
  Copyright (c) Microsoft Corporation.
4
4
 
package/dist/esm-es5/z-dragdrop-area_2.entry.js ADDED
@@ -0,0 +1,2 @@
1
+ var __awaiter=this&&this.__awaiter||function(t,e,i,o){function r(t){return t instanceof i?t:new i((function(e){e(t)}))}return new(i||(i=Promise))((function(i,n){function a(t){try{s(o.next(t))}catch(t){n(t)}}function l(t){try{s(o["throw"](t))}catch(t){n(t)}}function s(t){t.done?i(t.value):r(t.value).then(a,l)}s((o=o.apply(t,e||[])).next())}))};var __generator=this&&this.__generator||function(t,e){var i={label:0,sent:function(){if(n[0]&1)throw n[1];return n[1]},trys:[],ops:[]},o,r,n,a;return a={next:l(0),throw:l(1),return:l(2)},typeof Symbol==="function"&&(a[Symbol.iterator]=function(){return this}),a;function l(t){return function(e){return s([t,e])}}function s(l){if(o)throw new TypeError("Generator is already executing.");while(a&&(a=0,l[0]&&(i=0)),i)try{if(o=1,r&&(n=l[0]&2?r["return"]:l[0]?r["throw"]||((n=r["return"])&&n.call(r),0):r.next)&&!(n=n.call(r,l[1])).done)return n;if(r=0,n)l=[l[0]&2,n.value];switch(l[0]){case 0:case 1:n=l;break;case 4:i.label++;return{value:l[1],done:false};case 5:i.label++;r=l[1];l=[0];continue;case 7:l=i.ops.pop();i.trys.pop();continue;default:if(!(n=i.trys,n=n.length>0&&n[n.length-1])&&(l[0]===6||l[0]===2)){i=0;continue}if(l[0]===3&&(!n||l[1]>n[0]&&l[1]<n[3])){i.label=l[1];break}if(l[0]===6&&i.label<n[1]){i.label=n[1];n=l;break}if(n&&i.label<n[2]){i.label=n[2];i.ops.push(l);break}if(n[2])i.ops.pop();i.trys.pop();continue}l=e.call(t,i)}catch(t){l=[6,t];r=0}finally{o=n=0}if(l[0]&5)throw l[1];return{value:l[0]?l[1]:void 0,done:true}}};var __spreadArray=this&&this.__spreadArray||function(t,e,i){if(i||arguments.length===2)for(var o=0,r=e.length,n;o<r;o++){if(n||!(o in e)){if(!n)n=Array.prototype.slice.call(e,0,o);n[o]=e[o]}}return t.concat(n||Array.prototype.slice.call(e))};import{r as registerInstance,c as createEvent,h,g as getElement}from"./index-ab5f1eaa.js";import{g as KeyboardCode}from"./index-2255c6c8.js";import{m as mobileBreakpoint}from"./breakpoints-680e0e56.js";var stylesCss$1=":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>.dragdrop{position:relative;display:-ms-flexbox;display:flex;height:228px;-ms-flex-direction:column;flex-direction:column;padding:calc(var(--space-unit) * 2);border-color:var(--color-surface04);background-color:var(--color-surface02);background-image:url(\"data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='2' ry='2' stroke='%23CACCCEFF' stroke-width='2' stroke-dasharray='15%2c 10%2c 14%2c 11' stroke-dashoffset='3' stroke-linecap='square'/%3e%3c/svg%3e\");border-radius:2px;color:var(--color-default-text)}:host>.dragdrop.dragover *{pointer-events:none}:host>.dragdrop .dragover-container{position:absolute;z-index:10;top:0;left:0;display:none;width:100%;height:100%;background-color:var(--color-primary03);-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host>.dragdrop .dragover-container .dragover-message{padding:10px 28px;background-color:var(--color-link-primary);color:var(--color-text-inverse)}:host>.dragdrop.dragover .dragover-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}";var ZDragdropAreaStyle0=stylesCss$1;var ZDragdropArea=function(){function t(t){registerInstance(this,t);this.fileDropped=createEvent(this,"fileDropped",7);this.dragAndDropLabel=undefined}t.prototype.fileDroppedHandler=function(t){this.fileDropped.emit(t)};t.prototype.renderOnDragOverMessage=function(){return h("div",{class:"dragover-container"},h("div",{class:"dragover-message"},h("span",{class:"body-2-sb"},this.dragAndDropLabel)))};t.prototype.render=function(){var t=this;return h("div",{key:"41334ac77bca3fb0d30518480b702c815d95b125",tabIndex:0,ref:function(e){return t.dragDropContainer=e},class:"dragdrop",onDragOver:function(e){e.preventDefault();t.dragDropContainer.classList.add("dragover")},onDragLeave:function(){t.dragDropContainer.classList.remove("dragover")},onDrop:function(e){e.preventDefault();if(e.dataTransfer.files.length){t.dragDropContainer.classList.remove("dragover");t.fileDroppedHandler(e.dataTransfer.files)}}},this.renderOnDragOverMessage(),h("slot",{key:"83344ee14fcec799690b644fe0a56cc86e1b4476"}))};return t}();ZDragdropArea.style=ZDragdropAreaStyle0;var supportCustomEvent=window.CustomEvent;if(!supportCustomEvent||typeof supportCustomEvent==="object"){supportCustomEvent=function t(e,i){i=i||{};var o=document.createEvent("CustomEvent");o.initCustomEvent(e,!!i.bubbles,!!i.cancelable,i.detail||null);return o};supportCustomEvent.prototype=window.Event.prototype}function safeDispatchEvent(t,e){var i="on"+e.type.toLowerCase();if(typeof t[i]==="function"){t[i](e)}return t.dispatchEvent(e)}function createsStackingContext(t){while(t&&t!==document.body){var e=window.getComputedStyle(t);var i=function(t,i){return!(e[t]===undefined||e[t]===i)};if(e.opacity<1||i("zIndex","auto")||i("transform","none")||i("mixBlendMode","normal")||i("filter","none")||i("perspective","none")||e["isolation"]==="isolate"||e.position==="fixed"||e.webkitOverflowScrolling==="touch"){return true}t=t.parentElement}return false}function findNearestDialog(t){while(t){if(t.localName==="dialog"){return t}if(t.parentElement){t=t.parentElement}else if(t.parentNode){t=t.parentNode.host}else{t=null}}return null}function safeBlur(t){while(t&&t.shadowRoot&&t.shadowRoot.activeElement){t=t.shadowRoot.activeElement}if(t&&t.blur&&t!==document.body){t.blur()}}function inNodeList(t,e){for(var i=0;i<t.length;++i){if(t[i]===e){return true}}return false}function isFormMethodDialog(t){if(!t||!t.hasAttribute("method")){return false}return t.getAttribute("method").toLowerCase()==="dialog"}function findFocusableElementWithin(t){var e=["button","input","keygen","select","textarea"];var i=e.map((function(t){return t+":not([disabled])"}));i.push('[tabindex]:not([disabled]):not([tabindex=""])');var o=t.querySelector(i.join(", "));if(!o&&"attachShadow"in Element.prototype){var r=t.querySelectorAll("*");for(var n=0;n<r.length;n++){if(r[n].tagName&&r[n].shadowRoot){o=findFocusableElementWithin(r[n].shadowRoot);if(o){break}}}}return o}function isConnected(t){return t.isConnected||document.body.contains(t)}function findFormSubmitter(t){if(t.submitter){return t.submitter}var e=t.target;if(!(e instanceof HTMLFormElement)){return null}var i=dialogPolyfill.formSubmitter;if(!i){var o=t.target;var r="getRootNode"in o&&o.getRootNode()||document;i=r.activeElement}if(!i||i.form!==e){return null}return i}function maybeHandleSubmit(t){if(t.defaultPrevented){return}var e=t.target;var i=dialogPolyfill.imagemapUseValue;var o=findFormSubmitter(t);if(i===null&&o){i=o.value}var r=findNearestDialog(e);if(!r){return}var n=o&&o.getAttribute("formmethod")||e.getAttribute("method");if(n!=="dialog"){return}t.preventDefault();if(i!=null){r.close(i)}else{r.close()}}function dialogPolyfillInfo(t){this.dialog_=t;this.replacedStyleTop_=false;this.openAsModal_=false;if(!t.hasAttribute("role")){t.setAttribute("role","dialog")}t.show=this.show.bind(this);t.showModal=this.showModal.bind(this);t.close=this.close.bind(this);t.addEventListener("submit",maybeHandleSubmit,false);if(!("returnValue"in t)){t.returnValue=""}if("MutationObserver"in window){var e=new MutationObserver(this.maybeHideModal.bind(this));e.observe(t,{attributes:true,attributeFilter:["open"]})}else{var i=false;var o=function(){i?this.downgradeModal():this.maybeHideModal();i=false}.bind(this);var r;var n=function(e){if(e.target!==t){return}var n="DOMNodeRemoved";i|=e.type.substr(0,n.length)===n;window.clearTimeout(r);r=window.setTimeout(o,0)};["DOMAttrModified","DOMNodeRemoved","DOMNodeRemovedFromDocument"].forEach((function(e){t.addEventListener(e,n)}))}Object.defineProperty(t,"open",{set:this.setOpen.bind(this),get:t.hasAttribute.bind(t,"open")});this.backdrop_=document.createElement("div");this.backdrop_.className="backdrop";this.backdrop_.addEventListener("mouseup",this.backdropMouseEvent_.bind(this));this.backdrop_.addEventListener("mousedown",this.backdropMouseEvent_.bind(this));this.backdrop_.addEventListener("click",this.backdropMouseEvent_.bind(this))}dialogPolyfillInfo.prototype={get dialog(){return this.dialog_},maybeHideModal:function(){if(this.dialog_.hasAttribute("open")&&isConnected(this.dialog_)){return}this.downgradeModal()},downgradeModal:function(){if(!this.openAsModal_){return}this.openAsModal_=false;this.dialog_.style.zIndex="";if(this.replacedStyleTop_){this.dialog_.style.top="";this.replacedStyleTop_=false}this.backdrop_.parentNode&&this.backdrop_.parentNode.removeChild(this.backdrop_);dialogPolyfill.dm.removeDialog(this)},setOpen:function(t){if(t){this.dialog_.hasAttribute("open")||this.dialog_.setAttribute("open","")}else{this.dialog_.removeAttribute("open");this.maybeHideModal()}},backdropMouseEvent_:function(t){if(!this.dialog_.hasAttribute("tabindex")){var e=document.createElement("div");this.dialog_.insertBefore(e,this.dialog_.firstChild);e.tabIndex=-1;e.focus();this.dialog_.removeChild(e)}else{this.dialog_.focus()}var i=document.createEvent("MouseEvents");i.initMouseEvent(t.type,t.bubbles,t.cancelable,window,t.detail,t.screenX,t.screenY,t.clientX,t.clientY,t.ctrlKey,t.altKey,t.shiftKey,t.metaKey,t.button,t.relatedTarget);this.dialog_.dispatchEvent(i);t.stopPropagation()},focus_:function(){var t=this.dialog_.querySelector("[autofocus]:not([disabled])");if(!t&&this.dialog_.tabIndex>=0){t=this.dialog_}if(!t){t=findFocusableElementWithin(this.dialog_)}safeBlur(document.activeElement);t&&t.focus()},updateZIndex:function(t,e){if(t<e){throw new Error("dialogZ should never be < backdropZ")}this.dialog_.style.zIndex=t;this.backdrop_.style.zIndex=e},show:function(){if(!this.dialog_.open){this.setOpen(true);this.focus_()}},showModal:function(){if(this.dialog_.hasAttribute("open")){throw new Error("Failed to execute 'showModal' on dialog: The element is already open, and therefore cannot be opened modally.")}if(!isConnected(this.dialog_)){throw new Error("Failed to execute 'showModal' on dialog: The element is not in a Document.")}if(!dialogPolyfill.dm.pushDialog(this)){throw new Error("Failed to execute 'showModal' on dialog: There are too many open modal dialogs.")}if(createsStackingContext(this.dialog_.parentElement)){console.warn("A dialog is being shown inside a stacking context. "+"This may cause it to be unusable. For more information, see this link: "+"https://github.com/GoogleChrome/dialog-polyfill/#stacking-context")}this.setOpen(true);this.openAsModal_=true;if(dialogPolyfill.needsCentering(this.dialog_)){dialogPolyfill.reposition(this.dialog_);this.replacedStyleTop_=true}else{this.replacedStyleTop_=false}this.dialog_.parentNode.insertBefore(this.backdrop_,this.dialog_.nextSibling);this.focus_()},close:function(t){if(!this.dialog_.hasAttribute("open")){throw new Error("Failed to execute 'close' on dialog: The element does not have an 'open' attribute, and therefore cannot be closed.")}this.setOpen(false);if(t!==undefined){this.dialog_.returnValue=t}var e=new supportCustomEvent("close",{bubbles:false,cancelable:false});safeDispatchEvent(this.dialog_,e)}};var dialogPolyfill={};dialogPolyfill.reposition=function(t){var e=document.body.scrollTop||document.documentElement.scrollTop;var i=e+(window.innerHeight-t.offsetHeight)/2;t.style.top=Math.max(e,i)+"px"};dialogPolyfill.isInlinePositionSetByStylesheet=function(t){for(var e=0;e<document.styleSheets.length;++e){var i=document.styleSheets[e];var o=null;try{o=i.cssRules}catch(t){}if(!o){continue}for(var r=0;r<o.length;++r){var n=o[r];var a=null;try{a=document.querySelectorAll(n.selectorText)}catch(t){}if(!a||!inNodeList(a,t)){continue}var l=n.style.getPropertyValue("top");var s=n.style.getPropertyValue("bottom");if(l&&l!=="auto"||s&&s!=="auto"){return true}}}return false};dialogPolyfill.needsCentering=function(t){var e=window.getComputedStyle(t);if(e.position!=="absolute"){return false}if(t.style.top!=="auto"&&t.style.top!==""||t.style.bottom!=="auto"&&t.style.bottom!==""){return false}return!dialogPolyfill.isInlinePositionSetByStylesheet(t)};dialogPolyfill.forceRegisterDialog=function(t){if(window.HTMLDialogElement||t.showModal){console.warn("This browser already supports <dialog>, the polyfill "+"may not work correctly",t)}if(t.localName!=="dialog"){throw new Error("Failed to register dialog: The element is not a dialog.")}new dialogPolyfillInfo(t)};dialogPolyfill.registerDialog=function(t){if(!t.showModal){dialogPolyfill.forceRegisterDialog(t)}};dialogPolyfill.DialogManager=function(){this.pendingDialogStack=[];var t=this.checkDOM_.bind(this);this.overlay=document.createElement("div");this.overlay.className="_dialog_overlay";this.overlay.addEventListener("click",function(e){this.forwardTab_=undefined;e.stopPropagation();t([])}.bind(this));this.handleKey_=this.handleKey_.bind(this);this.handleFocus_=this.handleFocus_.bind(this);this.zIndexLow_=1e5;this.zIndexHigh_=1e5+150;this.forwardTab_=undefined;if("MutationObserver"in window){this.mo_=new MutationObserver((function(e){var i=[];e.forEach((function(t){for(var e=0,o;o=t.removedNodes[e];++e){if(!(o instanceof Element)){continue}else if(o.localName==="dialog"){i.push(o)}i=i.concat(o.querySelectorAll("dialog"))}}));i.length&&t(i)}))}};dialogPolyfill.DialogManager.prototype.blockDocument=function(){document.documentElement.addEventListener("focus",this.handleFocus_,true);document.addEventListener("keydown",this.handleKey_);this.mo_&&this.mo_.observe(document,{childList:true,subtree:true})};dialogPolyfill.DialogManager.prototype.unblockDocument=function(){document.documentElement.removeEventListener("focus",this.handleFocus_,true);document.removeEventListener("keydown",this.handleKey_);this.mo_&&this.mo_.disconnect()};dialogPolyfill.DialogManager.prototype.updateStacking=function(){var t=this.zIndexHigh_;for(var e=0,i;i=this.pendingDialogStack[e];++e){i.updateZIndex(--t,--t);if(e===0){this.overlay.style.zIndex=--t}}var o=this.pendingDialogStack[0];if(o){var r=o.dialog.parentNode||document.body;r.appendChild(this.overlay)}else if(this.overlay.parentNode){this.overlay.parentNode.removeChild(this.overlay)}};dialogPolyfill.DialogManager.prototype.containedByTopDialog_=function(t){while(t=findNearestDialog(t)){for(var e=0,i;i=this.pendingDialogStack[e];++e){if(i.dialog===t){return e===0}}t=t.parentElement}return false};dialogPolyfill.DialogManager.prototype.handleFocus_=function(t){var e=t.composedPath?t.composedPath()[0]:t.target;if(this.containedByTopDialog_(e)){return}if(document.activeElement===document.documentElement){return}t.preventDefault();t.stopPropagation();safeBlur(e);if(this.forwardTab_===undefined){return}var i=this.pendingDialogStack[0];var o=i.dialog;var r=o.compareDocumentPosition(e);if(r&Node.DOCUMENT_POSITION_PRECEDING){if(this.forwardTab_){i.focus_()}else if(e!==document.documentElement){document.documentElement.focus()}}return false};dialogPolyfill.DialogManager.prototype.handleKey_=function(t){this.forwardTab_=undefined;if(t.keyCode===27){t.preventDefault();t.stopPropagation();var e=new supportCustomEvent("cancel",{bubbles:false,cancelable:true});var i=this.pendingDialogStack[0];if(i&&safeDispatchEvent(i.dialog,e)){i.dialog.close()}}else if(t.keyCode===9){this.forwardTab_=!t.shiftKey}};dialogPolyfill.DialogManager.prototype.checkDOM_=function(t){var e=this.pendingDialogStack.slice();e.forEach((function(e){if(t.indexOf(e.dialog)!==-1){e.downgradeModal()}else{e.maybeHideModal()}}))};dialogPolyfill.DialogManager.prototype.pushDialog=function(t){var e=(this.zIndexHigh_-this.zIndexLow_)/2-1;if(this.pendingDialogStack.length>=e){return false}if(this.pendingDialogStack.unshift(t)===1){this.blockDocument()}this.updateStacking();return true};dialogPolyfill.DialogManager.prototype.removeDialog=function(t){var e=this.pendingDialogStack.indexOf(t);if(e===-1){return}this.pendingDialogStack.splice(e,1);if(this.pendingDialogStack.length===0){this.unblockDocument()}this.updateStacking()};dialogPolyfill.dm=new dialogPolyfill.DialogManager;dialogPolyfill.formSubmitter=null;dialogPolyfill.imagemapUseValue=null;if(window.HTMLDialogElement===undefined){var testForm=document.createElement("form");testForm.setAttribute("method","dialog");if(testForm.method!=="dialog"){var methodDescriptor=Object.getOwnPropertyDescriptor(HTMLFormElement.prototype,"method");if(methodDescriptor){var realGet=methodDescriptor.get;methodDescriptor.get=function(){if(isFormMethodDialog(this)){return"dialog"}return realGet.call(this)};var realSet=methodDescriptor.set;methodDescriptor.set=function(t){if(typeof t==="string"&&t.toLowerCase()==="dialog"){return this.setAttribute("method",t)}return realSet.call(this,t)};Object.defineProperty(HTMLFormElement.prototype,"method",methodDescriptor)}}document.addEventListener("click",(function(t){dialogPolyfill.formSubmitter=null;dialogPolyfill.imagemapUseValue=null;if(t.defaultPrevented){return}var e=t.target;if("composedPath"in t){var i=t.composedPath();e=i.shift()||e}if(!e||!isFormMethodDialog(e.form)){return}var o=e.type==="submit"&&["button","input"].indexOf(e.localName)>-1;if(!o){if(!(e.localName==="input"&&e.type==="image")){return}dialogPolyfill.imagemapUseValue=t.offsetX+","+t.offsetY}var r=findNearestDialog(e);if(!r){return}dialogPolyfill.formSubmitter=e}),false);document.addEventListener("submit",(function(t){var e=t.target;var i=findNearestDialog(e);if(i){return}var o=findFormSubmitter(t);var r=o&&o.getAttribute("formmethod")||e.getAttribute("method");if(r==="dialog"){t.preventDefault()}}));var nativeFormSubmit=HTMLFormElement.prototype.submit;var replacementFormSubmit=function(){if(!isFormMethodDialog(this)){return nativeFormSubmit.call(this)}var t=findNearestDialog(this);t&&t.close()};HTMLFormElement.prototype.submit=replacementFormSubmit}var stylesCss='*:focus{border-radius:50%;-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary);outline:none !important}:host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>dialog{padding:0;border:none;margin:0;background-color:transparent}:host>dialog:modal{width:100%;max-width:100%;max-height:100%}:host>dialog::-webkit-backdrop{display:none}:host>dialog::-ms-backdrop{display:none}:host>dialog::backdrop{display:none}:host>dialog+.backdrop{display:none}:host>dialog:not([open]){display:none}:host>dialog[open]{display:block}.modal-container{z-index:1010;display:-ms-flexbox;display:flex;overflow:-moz-scrollbars-none;width:100%;height:100vh;-ms-flex-direction:column;flex-direction:column}.modal-container>.modal-content-scroll-outside{overflow:auto;background:var(--color-surface01)}.modal-container>header{padding:calc(var(--space-unit) * 1.75) calc(var(--space-unit) * 2) calc(var(--space-unit) * 1.75)\n calc(var(--space-unit) * 2);background:var(--color-surface02)}.modal-container>header button{padding:0;border:none;margin:0;margin-left:auto;background:transparent;cursor:pointer}.modal-container>header z-icon{--z-icon-width:calc(var(--space-unit) * 2.25);--z-icon-height:calc(var(--space-unit) * 2.25);display:-ms-flexbox;display:flex;fill:var(--color-primary01-icon)}.modal-container>header>div{display:-ms-flexbox;display:flex;width:100%;-ms-flex-align:baseline;align-items:baseline;margin-right:calc(var(--space-unit) * 2)}.modal-container>header h1,.modal-container>header .subtitle{padding:0;margin:0;color:var(--color-default-text);font-weight:var(--font-sb)}.modal-container>header h1{font-size:var(--font-size-5);letter-spacing:0;line-height:1.4}.modal-container>header .subtitle{font-size:var(--font-size-3);font-weight:var(--font-rg);letter-spacing:0;line-height:1.5}.modal-container>header>div>h1 *:empty{display:none}.modal-container>header h1+.subtitle{margin-top:calc(var(--space-unit) * 0.5)}.modal-container-scroll-inside>.modal-content-scroll-inside{overflow:hidden auto;-ms-flex:1 auto;flex:1 auto;background:var(--color-surface01)}.modal-container-scroll-inside>.modal-content-scroll-inside::-webkit-scrollbar,.modal-container-scroll-outside>.modal-content-scroll-outside::-webkit-scrollbar{width:10px;background:linear-gradient(to right, transparent 0 3px, var(--gray200) 3px 7px, transparent 7px 10px);border-radius:var(--border-radius)}.modal-container-scroll-inside>.modal-content-scroll-inside::-webkit-scrollbar-thumb,.modal-container-scroll-outside>.modal-content-scroll-outside::-webkit-scrollbar-thumb{width:10px;background-color:var(--color-primary01)}.modal-container-scroll-inside>.modal-content-scroll-inside::-webkit-scrollbar-thumb:hover,.modal-container-scroll-outside>.modal-content-scroll-outside::-webkit-scrollbar-thumb:hover{background-color:var(--color-hover-primary)}.modal-container-scroll-inside .modal-content-scroll-inside,.modal-container-scroll-outside .modal-content-scroll-outside{scrollbar-color:var(--color-primary01) transparent}@media only screen and (min-width: 768px){.modal-background{position:fixed;top:0;left:0;overflow:hidden;width:100vw;height:100vh;background-color:var(--gray900);opacity:0.7}.modal-background.modal-background-scroll-outside{position:-webkit-sticky;position:sticky}.modal-container-scroll-inside{position:fixed;top:calc(var(--space-unit) * 6);left:50%;overflow:hidden;width:auto;min-width:calc(var(--space-unit) * 40);height:auto;min-height:calc(var(--space-unit) * 40);max-height:calc(100vh - calc(var(--space-unit) * 6 * 2));border-radius:var(--border-radius);-webkit-transform:translateX(-50%);transform:translateX(-50%)}.modal-container-scroll-outside{position:absolute;top:calc(var(--space-unit) * 6);left:50%;display:block;overflow:initial;width:auto;min-width:calc(var(--space-unit) * 40);height:auto;min-height:calc(var(--space-unit) * 40);max-height:calc(100vh - calc(var(--space-unit) * 6 * 2));-webkit-transform:translateX(-50%);transform:translateX(-50%)}.modal-container>.modal-content-scroll-outside{overflow:initial}.modal-container-scroll-outside>header,.modal-container-scroll-inside>header{border-top-left-radius:var(--border-radius);border-top-right-radius:var(--border-radius)}.modal-container-scroll-outside::after{display:block;height:calc(var(--space-unit) * 6);content:" "}.modal-dialog{position:fixed;top:0;left:0;height:auto;overflow-x:hidden;overflow-y:auto}.modal-content-scroll-outside{border-bottom-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius)}.modal-dialog::-webkit-scrollbar{display:none}}@media only screen and (min-width: 1152px){.modal-container>header{padding-top:calc(var(--space-unit) * 1.5);padding-bottom:calc(var(--space-unit) * 1.5)}.modal-container>header h1{font-size:var(--font-size-6);font-weight:var(--font-sb);letter-spacing:0;line-height:1.333}.modal-container>header .subtitle{font-size:var(--font-size-4);font-weight:var(--font-rg);letter-spacing:0;line-height:1.5}.modal-container>header h1+.subtitle{margin-top:0}}';var ZModalStyle0=stylesCss;var FOCUSABLE_ELEMENTS_SELECTOR=':is(button, input, select, textarea, [contenteditable=""], [contenteditable="true"], a[href], [tabindex], summary):not([disabled], [disabled=""], [tabindex="-1"], [aria-hidden="true"], [hidden])';var ZModal=function(){function t(t){registerInstance(this,t);this.modalClose=createEvent(this,"modalClose",7);this.modalHeaderActive=createEvent(this,"modalHeaderActive",7);this.modalBackgroundClick=createEvent(this,"modalBackgroundClick",7);this.modalid=undefined;this.modaltitle=undefined;this.modalsubtitle=undefined;this.closeButtonLabel="chiudi modale";this.alertdialog=false;this.closable=true;this.scrollInside=true}t.prototype.emitModalClose=function(){if(this.closable){this.modalClose.emit({modalid:this.modalid})}};t.prototype.emitModalHeaderActive=function(){this.modalHeaderActive.emit({modalid:this.modalid})};t.prototype.emitBackgroundClick=function(){if(this.closable){this.modalBackgroundClick.emit({modalid:this.modalid})}};t.prototype.handlePageOverflow=function(){var t=window.matchMedia("(max-width: ".concat(mobileBreakpoint,"px)"));document.body.style["overflow-y"]=t.matches?"hidden":""};t.prototype.componentDidLoad=function(){if(typeof window.HTMLDialogElement!=="function"){if(!this.dialog.localName){Object.defineProperty(this.dialog,"localName",{value:"dialog"})}dialogPolyfill.registerDialog(this.dialog);this.dialog.setAttribute("open","true")}else{this.open()}this.handlePageOverflow()};t.prototype.open=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(e){(t=this.dialog)===null||t===void 0?void 0:t.showModal();return[2]}))}))};t.prototype.close=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(e){if(this.closable){(t=this.dialog)===null||t===void 0?void 0:t.close()}return[2]}))}))};Object.defineProperty(t.prototype,"focusableElements",{get:function(){return __spreadArray(__spreadArray([],Array.from(this.host.shadowRoot.querySelectorAll(FOCUSABLE_ELEMENTS_SELECTOR)),true),Array.from(this.host.querySelectorAll(FOCUSABLE_ELEMENTS_SELECTOR)),true).filter((function(t){return getComputedStyle(t).display!=="none"}))},enumerable:false,configurable:true});t.prototype.handleKeyDown=function(t){if(t.code===KeyboardCode.ESC&&!this.closable){t.preventDefault()}if(t.code!==KeyboardCode.TAB){return}var e=this.focusableElements;var i=this.host.shadowRoot.activeElement;var o=this.host.ownerDocument.activeElement;var r=e[0];var n=e[e.length-1];if(t.shiftKey&&(i==r||o==r)){t.preventDefault();n.focus()}else if(!t.shiftKey&&(i==n||o==n)){t.preventDefault();r.focus()}};t.prototype.closeButtonSlot=function(){var t=this;if(this.closable){return h("slot",{name:"modalCloseButton"},h("button",{"aria-label":this.closeButtonLabel,onClick:function(){return t.close()}},h("z-icon",{name:"multiply-circle-filled"})))}};t.prototype.handleEscape=function(t){if(this.closable){return}t.preventDefault()};t.prototype.render=function(){var t=this;return h("dialog",{key:"50df4e07a74c86679fd2243e6795da0eeaae9c2c",class:{"modal-dialog":!this.scrollInside},"aria-labelledby":"modal-title","aria-describedby":"modal-content",role:this.alertdialog?"alertdialog":undefined,ref:function(e){return t.dialog=e},onClose:function(){return t.emitModalClose()},onCancel:function(e){return t.handleEscape(e)}},h("div",{key:"035ad0b71a6726e43c1fb52dae69257afd054525",class:{"modal-container":true,"modal-container-scroll-inside":this.scrollInside,"modal-container-scroll-outside":!this.scrollInside},id:this.modalid},h("header",{key:"8f9e92a6c41e4dbff647c4140a1efc42adf258a9",onClick:this.emitModalHeaderActive.bind(this)},h("div",{key:"3521275e24a100ba06c2f259ef239a361a6841e5"},this.modaltitle&&h("h1",{key:"3c345754f355fbe4cb7c0515404b01a3ff647b26",id:"modal-title"},this.modaltitle),this.closeButtonSlot()),this.modalsubtitle&&h("div",{key:"5307334b7aca04ae351a0a69cbdaa6ec0ee32654",class:"subtitle",id:"modal-subtitle"},this.modalsubtitle)),h("div",{key:"fe5a158f3a0f0d6a06e83ce4cf32fb50ea5bf79f",class:{"modal-content-scroll-inside":this.scrollInside,"modal-content-scroll-outside":!this.scrollInside},id:"modal-content"},h("slot",{key:"c2e5855dc48026fda519ad69bf5a7f9c3c1a2773",name:"modalContent"}))),h("div",{key:"d7f80d8206c262bf5166ee1231d78eb0e55e4bb5",class:{"modal-background":true,"modal-background-scroll-outside":!this.scrollInside},"data-action":"modalBackground","data-modal":this.modalid,onClick:function(){t.emitBackgroundClick();t.close()}}))};Object.defineProperty(t.prototype,"host",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();ZModal.style=ZModalStyle0;export{ZDragdropArea as z_dragdrop_area,ZModal as z_modal};
2
+ //# sourceMappingURL=z-dragdrop-area_2.entry.js.map
package/dist/esm-es5/z-dragdrop-area_2.entry.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"names":["stylesCss","ZDragdropAreaStyle0","ZDragdropArea","prototype","fileDroppedHandler","files","this","fileDropped","emit","renderOnDragOverMessage","h","class","dragAndDropLabel","render","_this","key","tabIndex","ref","val","dragDropContainer","onDragOver","e","preventDefault","classList","add","onDragLeave","remove","onDrop","dataTransfer","length","supportCustomEvent","window","CustomEvent","event","x","ev","document","createEvent","initCustomEvent","bubbles","cancelable","detail","Event","safeDispatchEvent","target","check","type","toLowerCase","dispatchEvent","createsStackingContext","el","body","s","getComputedStyle","invalid","k","ok","undefined","opacity","position","webkitOverflowScrolling","parentElement","findNearestDialog","localName","parentNode","host","safeBlur","shadowRoot","activeElement","blur","inNodeList","nodeList","node","i","isFormMethodDialog","hasAttribute","getAttribute","findFocusableElementWithin","hostElement","opts","query","map","push","querySelector","join","Element","elems","querySelectorAll","tagName","isConnected","element","contains","findFormSubmitter","submitter","form","HTMLFormElement","dialogPolyfill","formSubmitter","root","getRootNode","maybeHandleSubmit","defaultPrevented","value","imagemapUseValue","dialog","formmethod","close","dialogPolyfillInfo","dialog_","replacedStyleTop_","openAsModal_","setAttribute","show","bind","showModal","addEventListener","returnValue","mo","MutationObserver","maybeHideModal","observe","attributes","attributeFilter","removed","cb","downgradeModal","timeout","delayModel","cand","substr","clearTimeout","setTimeout","forEach","name","Object","defineProperty","set","setOpen","get","backdrop_","createElement","className","backdropMouseEvent_","style","zIndex","top","removeChild","dm","removeDialog","removeAttribute","fake","insertBefore","firstChild","focus","redirectedEvent","initMouseEvent","screenX","screenY","clientX","clientY","ctrlKey","altKey","shiftKey","metaKey","button","relatedTarget","stopPropagation","focus_","updateZIndex","dialogZ","backdropZ","Error","open","pushDialog","console","warn","needsCentering","reposition","nextSibling","opt_returnValue","closeEvent","scrollTop","documentElement","topValue","innerHeight","offsetHeight","Math","max","isInlinePositionSetByStylesheet","styleSheets","styleSheet","cssRules","j","rule","selectedNodes","selectorText","cssTop","getPropertyValue","cssBottom","computedStyle","bottom","forceRegisterDialog","HTMLDialogElement","registerDialog","DialogManager","pendingDialogStack","checkDOM","checkDOM_","overlay","forwardTab_","handleKey_","handleFocus_","zIndexLow_","zIndexHigh_","mo_","records","rec","c","removedNodes","concat","blockDocument","childList","subtree","unblockDocument","removeEventListener","disconnect","updateStacking","dpi","last","p","appendChild","containedByTopDialog_","candidate","composedPath","compareDocumentPosition","Node","DOCUMENT_POSITION_PRECEDING","keyCode","cancelEvent","clone","slice","indexOf","allowed","unshift","index","splice","testForm","method","methodDescriptor","getOwnPropertyDescriptor","realGet","call","realSet","v","path","shift","valid","offsetX","offsetY","nativeFormSubmit","submit","replacementFormSubmit","ZModalStyle0","FOCUSABLE_ELEMENTS_SELECTOR","ZModal","class_1","emitModalClose","closable","modalClose","modalid","emitModalHeaderActive","modalHeaderActive","emitBackgroundClick","modalBackgroundClick","handlePageOverflow","mobileMediaQuery","matchMedia","mobileBreakpoint","matches","componentDidLoad","_a","__spreadArray","Array","from","filter","display","handleKeyDown","code","KeyboardCode","ESC","TAB","focusableElements","shadowActiveElement","ownerDocument","firstFocusableElement","lastFocusableElement","closeButtonSlot","closeButtonLabel","onClick","handleEscape","scrollInside","role","alertdialog","onClose","onCancel","id","modaltitle","modalsubtitle"],"sources":["src/components/file-upload/z-dragdrop-area/styles.css?tag=z-dragdrop-area&encapsulation=shadow","src/components/file-upload/z-dragdrop-area/index.tsx","node_modules/dialog-polyfill/dist/dialog-polyfill.esm.js","src/components/z-modal/styles.css?tag=z-modal&encapsulation=shadow","src/components/z-modal/index.tsx"],"sourcesContent":[":host {\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n:host > .dragdrop {\n position: relative;\n display: flex;\n height: 228px;\n flex-direction: column;\n padding: calc(var(--space-unit) * 2);\n border-color: var(--color-surface04);\n background-color: var(--color-surface02);\n\n /* Native CSS properties don't support the customization of border-style.\n Therefore, we use a trick with an SVG image inside background-image property.\n The SVG features give us the ability to change the distance between dashed lines, set custom pattern, add dash offset or even change a line cap.\n Generated SVG image is vector and it fills width and height of elements by 100%, so it doesn't matter what size elements have. */\n background-image: url(\"data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='2' ry='2' stroke='%23CACCCEFF' stroke-width='2' stroke-dasharray='15%2c 10%2c 14%2c 11' stroke-dashoffset='3' stroke-linecap='square'/%3e%3c/svg%3e\");\n border-radius: 2px;\n color: var(--color-default-text);\n}\n\n/* https://stackoverflow.com/questions/7110353/html5-dragleave-fired-when-hovering-a-child-element */\n:host > .dragdrop.dragover * {\n pointer-events: none;\n}\n\n:host > .dragdrop .dragover-container {\n position: absolute;\n z-index: 10;\n top: 0;\n left: 0;\n display: none;\n width: 100%;\n height: 100%;\n background-color: var(--color-primary03);\n box-shadow: var(--shadow-focus-primary);\n}\n\n:host > .dragdrop .dragover-container .dragover-message {\n padding: 10px 28px;\n background-color: var(--color-link-primary);\n color: var(--color-text-inverse);\n}\n\n:host > .dragdrop.dragover .dragover-container {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n","import {Component, Event, EventEmitter, Prop, h} from \"@stencil/core\";\n\n@Component({\n tag: \"z-dragdrop-area\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZDragdropArea {\n /** drag & drop button label */\n @Prop()\n dragAndDropLabel: string;\n\n /** Emitted when user drop one or more files */\n @Event()\n fileDropped: EventEmitter;\n\n private fileDroppedHandler(files: FileList): void {\n this.fileDropped.emit(files);\n }\n\n private dragDropContainer: HTMLDivElement;\n\n private renderOnDragOverMessage(): HTMLDivElement {\n return (\n <div class=\"dragover-container\">\n <div class=\"dragover-message\">\n <span class=\"body-2-sb\">{this.dragAndDropLabel}</span>\n </div>\n </div>\n );\n }\n\n render(): HTMLDivElement {\n return (\n <div\n tabIndex={0}\n ref={(val) => (this.dragDropContainer = val)}\n class=\"dragdrop\"\n onDragOver={(e) => {\n e.preventDefault();\n this.dragDropContainer.classList.add(\"dragover\");\n }}\n onDragLeave={() => {\n this.dragDropContainer.classList.remove(\"dragover\");\n }}\n onDrop={(e) => {\n e.preventDefault();\n if (e.dataTransfer.files.length) {\n this.dragDropContainer.classList.remove(\"dragover\");\n this.fileDroppedHandler(e.dataTransfer.files);\n }\n }}\n >\n {this.renderOnDragOverMessage()}\n <slot />\n </div>\n );\n }\n}\n","// nb. This is for IE10 and lower _only_.\nvar supportCustomEvent = window.CustomEvent;\nif (!supportCustomEvent || typeof supportCustomEvent === 'object') {\n supportCustomEvent = function CustomEvent(event, x) {\n x = x || {};\n var ev = document.createEvent('CustomEvent');\n ev.initCustomEvent(event, !!x.bubbles, !!x.cancelable, x.detail || null);\n return ev;\n };\n supportCustomEvent.prototype = window.Event.prototype;\n}\n\n/**\n * Dispatches the passed event to both an \"on<type>\" handler as well as via the\n * normal dispatch operation. Does not bubble.\n *\n * @param {!EventTarget} target\n * @param {!Event} event\n * @return {boolean}\n */\nfunction safeDispatchEvent(target, event) {\n var check = 'on' + event.type.toLowerCase();\n if (typeof target[check] === 'function') {\n target[check](event);\n }\n return target.dispatchEvent(event);\n}\n\n/**\n * @param {Element} el to check for stacking context\n * @return {boolean} whether this el or its parents creates a stacking context\n */\nfunction createsStackingContext(el) {\n while (el && el !== document.body) {\n var s = window.getComputedStyle(el);\n var invalid = function(k, ok) {\n return !(s[k] === undefined || s[k] === ok);\n };\n\n if (s.opacity < 1 ||\n invalid('zIndex', 'auto') ||\n invalid('transform', 'none') ||\n invalid('mixBlendMode', 'normal') ||\n invalid('filter', 'none') ||\n invalid('perspective', 'none') ||\n s['isolation'] === 'isolate' ||\n s.position === 'fixed' ||\n s.webkitOverflowScrolling === 'touch') {\n return true;\n }\n el = el.parentElement;\n }\n return false;\n}\n\n/**\n * Finds the nearest <dialog> from the passed element.\n *\n * @param {Element} el to search from\n * @return {HTMLDialogElement} dialog found\n */\nfunction findNearestDialog(el) {\n while (el) {\n if (el.localName === 'dialog') {\n return /** @type {HTMLDialogElement} */ (el);\n }\n if (el.parentElement) {\n el = el.parentElement;\n } else if (el.parentNode) {\n el = el.parentNode.host;\n } else {\n el = null;\n }\n }\n return null;\n}\n\n/**\n * Blur the specified element, as long as it's not the HTML body element.\n * This works around an IE9/10 bug - blurring the body causes Windows to\n * blur the whole application.\n *\n * @param {Element} el to blur\n */\nfunction safeBlur(el) {\n // Find the actual focused element when the active element is inside a shadow root\n while (el && el.shadowRoot && el.shadowRoot.activeElement) {\n el = el.shadowRoot.activeElement;\n }\n\n if (el && el.blur && el !== document.body) {\n el.blur();\n }\n}\n\n/**\n * @param {!NodeList} nodeList to search\n * @param {Node} node to find\n * @return {boolean} whether node is inside nodeList\n */\nfunction inNodeList(nodeList, node) {\n for (var i = 0; i < nodeList.length; ++i) {\n if (nodeList[i] === node) {\n return true;\n }\n }\n return false;\n}\n\n/**\n * @param {HTMLFormElement} el to check\n * @return {boolean} whether this form has method=\"dialog\"\n */\nfunction isFormMethodDialog(el) {\n if (!el || !el.hasAttribute('method')) {\n return false;\n }\n return el.getAttribute('method').toLowerCase() === 'dialog';\n}\n\n/**\n * @param {!DocumentFragment|!Element} hostElement\n * @return {?Element}\n */\nfunction findFocusableElementWithin(hostElement) {\n // Note that this is 'any focusable area'. This list is probably not exhaustive, but the\n // alternative involves stepping through and trying to focus everything.\n var opts = ['button', 'input', 'keygen', 'select', 'textarea'];\n var query = opts.map(function(el) {\n return el + ':not([disabled])';\n });\n // TODO(samthor): tabindex values that are not numeric are not focusable.\n query.push('[tabindex]:not([disabled]):not([tabindex=\"\"])'); // tabindex != \"\", not disabled\n var target = hostElement.querySelector(query.join(', '));\n\n if (!target && 'attachShadow' in Element.prototype) {\n // If we haven't found a focusable target, see if the host element contains an element\n // which has a shadowRoot.\n // Recursively search for the first focusable item in shadow roots.\n var elems = hostElement.querySelectorAll('*');\n for (var i = 0; i < elems.length; i++) {\n if (elems[i].tagName && elems[i].shadowRoot) {\n target = findFocusableElementWithin(elems[i].shadowRoot);\n if (target) {\n break;\n }\n }\n }\n }\n return target;\n}\n\n/**\n * Determines if an element is attached to the DOM.\n * @param {Element} element to check\n * @return {boolean} whether the element is in DOM\n */\nfunction isConnected(element) {\n return element.isConnected || document.body.contains(element);\n}\n\n/**\n * @param {!Event} event\n * @return {?Element}\n */\nfunction findFormSubmitter(event) {\n if (event.submitter) {\n return event.submitter;\n }\n\n var form = event.target;\n if (!(form instanceof HTMLFormElement)) {\n return null;\n }\n\n var submitter = dialogPolyfill.formSubmitter;\n if (!submitter) {\n var target = event.target;\n var root = ('getRootNode' in target && target.getRootNode() || document);\n submitter = root.activeElement;\n }\n\n if (!submitter || submitter.form !== form) {\n return null;\n }\n return submitter;\n}\n\n/**\n * @param {!Event} event\n */\nfunction maybeHandleSubmit(event) {\n if (event.defaultPrevented) {\n return;\n }\n var form = /** @type {!HTMLFormElement} */ (event.target);\n\n // We'd have a value if we clicked on an imagemap.\n var value = dialogPolyfill.imagemapUseValue;\n var submitter = findFormSubmitter(event);\n if (value === null && submitter) {\n value = submitter.value;\n }\n\n // There should always be a dialog as this handler is added specifically on them, but check just\n // in case.\n var dialog = findNearestDialog(form);\n if (!dialog) {\n return;\n }\n\n // Prefer formmethod on the button.\n var formmethod = submitter && submitter.getAttribute('formmethod') || form.getAttribute('method');\n if (formmethod !== 'dialog') {\n return;\n }\n event.preventDefault();\n\n if (value != null) {\n // nb. we explicitly check against null/undefined\n dialog.close(value);\n } else {\n dialog.close();\n }\n}\n\n/**\n * @param {!HTMLDialogElement} dialog to upgrade\n * @constructor\n */\nfunction dialogPolyfillInfo(dialog) {\n this.dialog_ = dialog;\n this.replacedStyleTop_ = false;\n this.openAsModal_ = false;\n\n // Set a11y role. Browsers that support dialog implicitly know this already.\n if (!dialog.hasAttribute('role')) {\n dialog.setAttribute('role', 'dialog');\n }\n\n dialog.show = this.show.bind(this);\n dialog.showModal = this.showModal.bind(this);\n dialog.close = this.close.bind(this);\n\n dialog.addEventListener('submit', maybeHandleSubmit, false);\n\n if (!('returnValue' in dialog)) {\n dialog.returnValue = '';\n }\n\n if ('MutationObserver' in window) {\n var mo = new MutationObserver(this.maybeHideModal.bind(this));\n mo.observe(dialog, {attributes: true, attributeFilter: ['open']});\n } else {\n // IE10 and below support. Note that DOMNodeRemoved etc fire _before_ removal. They also\n // seem to fire even if the element was removed as part of a parent removal. Use the removed\n // events to force downgrade (useful if removed/immediately added).\n var removed = false;\n var cb = function() {\n removed ? this.downgradeModal() : this.maybeHideModal();\n removed = false;\n }.bind(this);\n var timeout;\n var delayModel = function(ev) {\n if (ev.target !== dialog) { return; } // not for a child element\n var cand = 'DOMNodeRemoved';\n removed |= (ev.type.substr(0, cand.length) === cand);\n window.clearTimeout(timeout);\n timeout = window.setTimeout(cb, 0);\n };\n ['DOMAttrModified', 'DOMNodeRemoved', 'DOMNodeRemovedFromDocument'].forEach(function(name) {\n dialog.addEventListener(name, delayModel);\n });\n }\n // Note that the DOM is observed inside DialogManager while any dialog\n // is being displayed as a modal, to catch modal removal from the DOM.\n\n Object.defineProperty(dialog, 'open', {\n set: this.setOpen.bind(this),\n get: dialog.hasAttribute.bind(dialog, 'open')\n });\n\n this.backdrop_ = document.createElement('div');\n this.backdrop_.className = 'backdrop';\n this.backdrop_.addEventListener('mouseup' , this.backdropMouseEvent_.bind(this));\n this.backdrop_.addEventListener('mousedown', this.backdropMouseEvent_.bind(this));\n this.backdrop_.addEventListener('click' , this.backdropMouseEvent_.bind(this));\n}\n\ndialogPolyfillInfo.prototype = /** @type {HTMLDialogElement.prototype} */ ({\n\n get dialog() {\n return this.dialog_;\n },\n\n /**\n * Maybe remove this dialog from the modal top layer. This is called when\n * a modal dialog may no longer be tenable, e.g., when the dialog is no\n * longer open or is no longer part of the DOM.\n */\n maybeHideModal: function() {\n if (this.dialog_.hasAttribute('open') && isConnected(this.dialog_)) { return; }\n this.downgradeModal();\n },\n\n /**\n * Remove this dialog from the modal top layer, leaving it as a non-modal.\n */\n downgradeModal: function() {\n if (!this.openAsModal_) { return; }\n this.openAsModal_ = false;\n this.dialog_.style.zIndex = '';\n\n // This won't match the native <dialog> exactly because if the user set top on a centered\n // polyfill dialog, that top gets thrown away when the dialog is closed. Not sure it's\n // possible to polyfill this perfectly.\n if (this.replacedStyleTop_) {\n this.dialog_.style.top = '';\n this.replacedStyleTop_ = false;\n }\n\n // Clear the backdrop and remove from the manager.\n this.backdrop_.parentNode && this.backdrop_.parentNode.removeChild(this.backdrop_);\n dialogPolyfill.dm.removeDialog(this);\n },\n\n /**\n * @param {boolean} value whether to open or close this dialog\n */\n setOpen: function(value) {\n if (value) {\n this.dialog_.hasAttribute('open') || this.dialog_.setAttribute('open', '');\n } else {\n this.dialog_.removeAttribute('open');\n this.maybeHideModal(); // nb. redundant with MutationObserver\n }\n },\n\n /**\n * Handles mouse events ('mouseup', 'mousedown', 'click') on the fake .backdrop element, redirecting them as if\n * they were on the dialog itself.\n *\n * @param {!Event} e to redirect\n */\n backdropMouseEvent_: function(e) {\n if (!this.dialog_.hasAttribute('tabindex')) {\n // Clicking on the backdrop should move the implicit cursor, even if dialog cannot be\n // focused. Create a fake thing to focus on. If the backdrop was _before_ the dialog, this\n // would not be needed - clicks would move the implicit cursor there.\n var fake = document.createElement('div');\n this.dialog_.insertBefore(fake, this.dialog_.firstChild);\n fake.tabIndex = -1;\n fake.focus();\n this.dialog_.removeChild(fake);\n } else {\n this.dialog_.focus();\n }\n\n var redirectedEvent = document.createEvent('MouseEvents');\n redirectedEvent.initMouseEvent(e.type, e.bubbles, e.cancelable, window,\n e.detail, e.screenX, e.screenY, e.clientX, e.clientY, e.ctrlKey,\n e.altKey, e.shiftKey, e.metaKey, e.button, e.relatedTarget);\n this.dialog_.dispatchEvent(redirectedEvent);\n e.stopPropagation();\n },\n\n /**\n * Focuses on the first focusable element within the dialog. This will always blur the current\n * focus, even if nothing within the dialog is found.\n */\n focus_: function() {\n // Find element with `autofocus` attribute, or fall back to the first form/tabindex control.\n var target = this.dialog_.querySelector('[autofocus]:not([disabled])');\n if (!target && this.dialog_.tabIndex >= 0) {\n target = this.dialog_;\n }\n if (!target) {\n target = findFocusableElementWithin(this.dialog_);\n }\n safeBlur(document.activeElement);\n target && target.focus();\n },\n\n /**\n * Sets the zIndex for the backdrop and dialog.\n *\n * @param {number} dialogZ\n * @param {number} backdropZ\n */\n updateZIndex: function(dialogZ, backdropZ) {\n if (dialogZ < backdropZ) {\n throw new Error('dialogZ should never be < backdropZ');\n }\n this.dialog_.style.zIndex = dialogZ;\n this.backdrop_.style.zIndex = backdropZ;\n },\n\n /**\n * Shows the dialog. If the dialog is already open, this does nothing.\n */\n show: function() {\n if (!this.dialog_.open) {\n this.setOpen(true);\n this.focus_();\n }\n },\n\n /**\n * Show this dialog modally.\n */\n showModal: function() {\n if (this.dialog_.hasAttribute('open')) {\n throw new Error('Failed to execute \\'showModal\\' on dialog: The element is already open, and therefore cannot be opened modally.');\n }\n if (!isConnected(this.dialog_)) {\n throw new Error('Failed to execute \\'showModal\\' on dialog: The element is not in a Document.');\n }\n if (!dialogPolyfill.dm.pushDialog(this)) {\n throw new Error('Failed to execute \\'showModal\\' on dialog: There are too many open modal dialogs.');\n }\n\n if (createsStackingContext(this.dialog_.parentElement)) {\n console.warn('A dialog is being shown inside a stacking context. ' +\n 'This may cause it to be unusable. For more information, see this link: ' +\n 'https://github.com/GoogleChrome/dialog-polyfill/#stacking-context');\n }\n\n this.setOpen(true);\n this.openAsModal_ = true;\n\n // Optionally center vertically, relative to the current viewport.\n if (dialogPolyfill.needsCentering(this.dialog_)) {\n dialogPolyfill.reposition(this.dialog_);\n this.replacedStyleTop_ = true;\n } else {\n this.replacedStyleTop_ = false;\n }\n\n // Insert backdrop.\n this.dialog_.parentNode.insertBefore(this.backdrop_, this.dialog_.nextSibling);\n\n // Focus on whatever inside the dialog.\n this.focus_();\n },\n\n /**\n * Closes this HTMLDialogElement. This is optional vs clearing the open\n * attribute, however this fires a 'close' event.\n *\n * @param {string=} opt_returnValue to use as the returnValue\n */\n close: function(opt_returnValue) {\n if (!this.dialog_.hasAttribute('open')) {\n throw new Error('Failed to execute \\'close\\' on dialog: The element does not have an \\'open\\' attribute, and therefore cannot be closed.');\n }\n this.setOpen(false);\n\n // Leave returnValue untouched in case it was set directly on the element\n if (opt_returnValue !== undefined) {\n this.dialog_.returnValue = opt_returnValue;\n }\n\n // Triggering \"close\" event for any attached listeners on the <dialog>.\n var closeEvent = new supportCustomEvent('close', {\n bubbles: false,\n cancelable: false\n });\n safeDispatchEvent(this.dialog_, closeEvent);\n }\n\n});\n\nvar dialogPolyfill = {};\n\ndialogPolyfill.reposition = function(element) {\n var scrollTop = document.body.scrollTop || document.documentElement.scrollTop;\n var topValue = scrollTop + (window.innerHeight - element.offsetHeight) / 2;\n element.style.top = Math.max(scrollTop, topValue) + 'px';\n};\n\ndialogPolyfill.isInlinePositionSetByStylesheet = function(element) {\n for (var i = 0; i < document.styleSheets.length; ++i) {\n var styleSheet = document.styleSheets[i];\n var cssRules = null;\n // Some browsers throw on cssRules.\n try {\n cssRules = styleSheet.cssRules;\n } catch (e) {}\n if (!cssRules) { continue; }\n for (var j = 0; j < cssRules.length; ++j) {\n var rule = cssRules[j];\n var selectedNodes = null;\n // Ignore errors on invalid selector texts.\n try {\n selectedNodes = document.querySelectorAll(rule.selectorText);\n } catch(e) {}\n if (!selectedNodes || !inNodeList(selectedNodes, element)) {\n continue;\n }\n var cssTop = rule.style.getPropertyValue('top');\n var cssBottom = rule.style.getPropertyValue('bottom');\n if ((cssTop && cssTop !== 'auto') || (cssBottom && cssBottom !== 'auto')) {\n return true;\n }\n }\n }\n return false;\n};\n\ndialogPolyfill.needsCentering = function(dialog) {\n var computedStyle = window.getComputedStyle(dialog);\n if (computedStyle.position !== 'absolute') {\n return false;\n }\n\n // We must determine whether the top/bottom specified value is non-auto. In\n // WebKit/Blink, checking computedStyle.top == 'auto' is sufficient, but\n // Firefox returns the used value. So we do this crazy thing instead: check\n // the inline style and then go through CSS rules.\n if ((dialog.style.top !== 'auto' && dialog.style.top !== '') ||\n (dialog.style.bottom !== 'auto' && dialog.style.bottom !== '')) {\n return false;\n }\n return !dialogPolyfill.isInlinePositionSetByStylesheet(dialog);\n};\n\n/**\n * @param {!Element} element to force upgrade\n */\ndialogPolyfill.forceRegisterDialog = function(element) {\n if (window.HTMLDialogElement || element.showModal) {\n console.warn('This browser already supports <dialog>, the polyfill ' +\n 'may not work correctly', element);\n }\n if (element.localName !== 'dialog') {\n throw new Error('Failed to register dialog: The element is not a dialog.');\n }\n new dialogPolyfillInfo(/** @type {!HTMLDialogElement} */ (element));\n};\n\n/**\n * @param {!Element} element to upgrade, if necessary\n */\ndialogPolyfill.registerDialog = function(element) {\n if (!element.showModal) {\n dialogPolyfill.forceRegisterDialog(element);\n }\n};\n\n/**\n * @constructor\n */\ndialogPolyfill.DialogManager = function() {\n /** @type {!Array<!dialogPolyfillInfo>} */\n this.pendingDialogStack = [];\n\n var checkDOM = this.checkDOM_.bind(this);\n\n // The overlay is used to simulate how a modal dialog blocks the document.\n // The blocking dialog is positioned on top of the overlay, and the rest of\n // the dialogs on the pending dialog stack are positioned below it. In the\n // actual implementation, the modal dialog stacking is controlled by the\n // top layer, where z-index has no effect.\n this.overlay = document.createElement('div');\n this.overlay.className = '_dialog_overlay';\n this.overlay.addEventListener('click', function(e) {\n this.forwardTab_ = undefined;\n e.stopPropagation();\n checkDOM([]); // sanity-check DOM\n }.bind(this));\n\n this.handleKey_ = this.handleKey_.bind(this);\n this.handleFocus_ = this.handleFocus_.bind(this);\n\n this.zIndexLow_ = 100000;\n this.zIndexHigh_ = 100000 + 150;\n\n this.forwardTab_ = undefined;\n\n if ('MutationObserver' in window) {\n this.mo_ = new MutationObserver(function(records) {\n var removed = [];\n records.forEach(function(rec) {\n for (var i = 0, c; c = rec.removedNodes[i]; ++i) {\n if (!(c instanceof Element)) {\n continue;\n } else if (c.localName === 'dialog') {\n removed.push(c);\n }\n removed = removed.concat(c.querySelectorAll('dialog'));\n }\n });\n removed.length && checkDOM(removed);\n });\n }\n};\n\n/**\n * Called on the first modal dialog being shown. Adds the overlay and related\n * handlers.\n */\ndialogPolyfill.DialogManager.prototype.blockDocument = function() {\n document.documentElement.addEventListener('focus', this.handleFocus_, true);\n document.addEventListener('keydown', this.handleKey_);\n this.mo_ && this.mo_.observe(document, {childList: true, subtree: true});\n};\n\n/**\n * Called on the first modal dialog being removed, i.e., when no more modal\n * dialogs are visible.\n */\ndialogPolyfill.DialogManager.prototype.unblockDocument = function() {\n document.documentElement.removeEventListener('focus', this.handleFocus_, true);\n document.removeEventListener('keydown', this.handleKey_);\n this.mo_ && this.mo_.disconnect();\n};\n\n/**\n * Updates the stacking of all known dialogs.\n */\ndialogPolyfill.DialogManager.prototype.updateStacking = function() {\n var zIndex = this.zIndexHigh_;\n\n for (var i = 0, dpi; dpi = this.pendingDialogStack[i]; ++i) {\n dpi.updateZIndex(--zIndex, --zIndex);\n if (i === 0) {\n this.overlay.style.zIndex = --zIndex;\n }\n }\n\n // Make the overlay a sibling of the dialog itself.\n var last = this.pendingDialogStack[0];\n if (last) {\n var p = last.dialog.parentNode || document.body;\n p.appendChild(this.overlay);\n } else if (this.overlay.parentNode) {\n this.overlay.parentNode.removeChild(this.overlay);\n }\n};\n\n/**\n * @param {Element} candidate to check if contained or is the top-most modal dialog\n * @return {boolean} whether candidate is contained in top dialog\n */\ndialogPolyfill.DialogManager.prototype.containedByTopDialog_ = function(candidate) {\n while (candidate = findNearestDialog(candidate)) {\n for (var i = 0, dpi; dpi = this.pendingDialogStack[i]; ++i) {\n if (dpi.dialog === candidate) {\n return i === 0; // only valid if top-most\n }\n }\n candidate = candidate.parentElement;\n }\n return false;\n};\n\ndialogPolyfill.DialogManager.prototype.handleFocus_ = function(event) {\n var target = event.composedPath ? event.composedPath()[0] : event.target;\n\n if (this.containedByTopDialog_(target)) { return; }\n\n if (document.activeElement === document.documentElement) { return; }\n\n event.preventDefault();\n event.stopPropagation();\n safeBlur(/** @type {Element} */ (target));\n\n if (this.forwardTab_ === undefined) { return; } // move focus only from a tab key\n\n var dpi = this.pendingDialogStack[0];\n var dialog = dpi.dialog;\n var position = dialog.compareDocumentPosition(target);\n if (position & Node.DOCUMENT_POSITION_PRECEDING) {\n if (this.forwardTab_) {\n // forward\n dpi.focus_();\n } else if (target !== document.documentElement) {\n // backwards if we're not already focused on <html>\n document.documentElement.focus();\n }\n }\n\n return false;\n};\n\ndialogPolyfill.DialogManager.prototype.handleKey_ = function(event) {\n this.forwardTab_ = undefined;\n if (event.keyCode === 27) {\n event.preventDefault();\n event.stopPropagation();\n var cancelEvent = new supportCustomEvent('cancel', {\n bubbles: false,\n cancelable: true\n });\n var dpi = this.pendingDialogStack[0];\n if (dpi && safeDispatchEvent(dpi.dialog, cancelEvent)) {\n dpi.dialog.close();\n }\n } else if (event.keyCode === 9) {\n this.forwardTab_ = !event.shiftKey;\n }\n};\n\n/**\n * Finds and downgrades any known modal dialogs that are no longer displayed. Dialogs that are\n * removed and immediately readded don't stay modal, they become normal.\n *\n * @param {!Array<!HTMLDialogElement>} removed that have definitely been removed\n */\ndialogPolyfill.DialogManager.prototype.checkDOM_ = function(removed) {\n // This operates on a clone because it may cause it to change. Each change also calls\n // updateStacking, which only actually needs to happen once. But who removes many modal dialogs\n // at a time?!\n var clone = this.pendingDialogStack.slice();\n clone.forEach(function(dpi) {\n if (removed.indexOf(dpi.dialog) !== -1) {\n dpi.downgradeModal();\n } else {\n dpi.maybeHideModal();\n }\n });\n};\n\n/**\n * @param {!dialogPolyfillInfo} dpi\n * @return {boolean} whether the dialog was allowed\n */\ndialogPolyfill.DialogManager.prototype.pushDialog = function(dpi) {\n var allowed = (this.zIndexHigh_ - this.zIndexLow_) / 2 - 1;\n if (this.pendingDialogStack.length >= allowed) {\n return false;\n }\n if (this.pendingDialogStack.unshift(dpi) === 1) {\n this.blockDocument();\n }\n this.updateStacking();\n return true;\n};\n\n/**\n * @param {!dialogPolyfillInfo} dpi\n */\ndialogPolyfill.DialogManager.prototype.removeDialog = function(dpi) {\n var index = this.pendingDialogStack.indexOf(dpi);\n if (index === -1) { return; }\n\n this.pendingDialogStack.splice(index, 1);\n if (this.pendingDialogStack.length === 0) {\n this.unblockDocument();\n }\n this.updateStacking();\n};\n\ndialogPolyfill.dm = new dialogPolyfill.DialogManager();\ndialogPolyfill.formSubmitter = null;\ndialogPolyfill.imagemapUseValue = null;\n\n/**\n * Installs global handlers, such as click listers and native method overrides. These are needed\n * even if a no dialog is registered, as they deal with <form method=\"dialog\">.\n */\nif (window.HTMLDialogElement === undefined) {\n\n /**\n * If HTMLFormElement translates method=\"DIALOG\" into 'get', then replace the descriptor with\n * one that returns the correct value.\n */\n var testForm = document.createElement('form');\n testForm.setAttribute('method', 'dialog');\n if (testForm.method !== 'dialog') {\n var methodDescriptor = Object.getOwnPropertyDescriptor(HTMLFormElement.prototype, 'method');\n if (methodDescriptor) {\n // nb. Some older iOS and older PhantomJS fail to return the descriptor. Don't do anything\n // and don't bother to update the element.\n var realGet = methodDescriptor.get;\n methodDescriptor.get = function() {\n if (isFormMethodDialog(this)) {\n return 'dialog';\n }\n return realGet.call(this);\n };\n var realSet = methodDescriptor.set;\n /** @this {HTMLElement} */\n methodDescriptor.set = function(v) {\n if (typeof v === 'string' && v.toLowerCase() === 'dialog') {\n return this.setAttribute('method', v);\n }\n return realSet.call(this, v);\n };\n Object.defineProperty(HTMLFormElement.prototype, 'method', methodDescriptor);\n }\n }\n\n /**\n * Global 'click' handler, to capture the <input type=\"submit\"> or <button> element which has\n * submitted a <form method=\"dialog\">. Needed as Safari and others don't report this inside\n * document.activeElement.\n */\n document.addEventListener('click', function(ev) {\n dialogPolyfill.formSubmitter = null;\n dialogPolyfill.imagemapUseValue = null;\n if (ev.defaultPrevented) { return; } // e.g. a submit which prevents default submission\n\n var target = /** @type {Element} */ (ev.target);\n if ('composedPath' in ev) {\n var path = ev.composedPath();\n target = path.shift() || target;\n }\n if (!target || !isFormMethodDialog(target.form)) { return; }\n\n var valid = (target.type === 'submit' && ['button', 'input'].indexOf(target.localName) > -1);\n if (!valid) {\n if (!(target.localName === 'input' && target.type === 'image')) { return; }\n // this is a <input type=\"image\">, which can submit forms\n dialogPolyfill.imagemapUseValue = ev.offsetX + ',' + ev.offsetY;\n }\n\n var dialog = findNearestDialog(target);\n if (!dialog) { return; }\n\n dialogPolyfill.formSubmitter = target;\n\n }, false);\n\n /**\n * Global 'submit' handler. This handles submits of `method=\"dialog\"` which are invalid, i.e.,\n * outside a dialog. They get prevented.\n */\n document.addEventListener('submit', function(ev) {\n var form = ev.target;\n var dialog = findNearestDialog(form);\n if (dialog) {\n return; // ignore, handle there\n }\n\n var submitter = findFormSubmitter(ev);\n var formmethod = submitter && submitter.getAttribute('formmethod') || form.getAttribute('method');\n if (formmethod === 'dialog') {\n ev.preventDefault();\n }\n });\n\n /**\n * Replace the native HTMLFormElement.submit() method, as it won't fire the\n * submit event and give us a chance to respond.\n */\n var nativeFormSubmit = HTMLFormElement.prototype.submit;\n var replacementFormSubmit = function () {\n if (!isFormMethodDialog(this)) {\n return nativeFormSubmit.call(this);\n }\n var dialog = findNearestDialog(this);\n dialog && dialog.close();\n };\n HTMLFormElement.prototype.submit = replacementFormSubmit;\n}\n\nexport default dialogPolyfill;\n","*:focus {\n border-radius: 50%;\n box-shadow: var(--shadow-focus-primary);\n outline: none !important;\n}\n\n:host {\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n:host > dialog {\n padding: 0;\n border: none;\n margin: 0;\n background-color: transparent;\n}\n\n/* stylelint-disable selector-pseudo-class-no-unknown */\n:host > dialog:modal {\n width: 100%;\n max-width: 100%;\n max-height: 100%;\n}\n\n:host > dialog::backdrop {\n display: none;\n}\n\n/* polyfill style */\n:host > dialog + .backdrop {\n display: none;\n}\n\n:host > dialog:not([open]) {\n display: none;\n}\n\n:host > dialog[open] {\n display: block;\n}\n\n.modal-container {\n z-index: 1010;\n display: flex;\n overflow: -moz-scrollbars-none;\n width: 100%;\n height: 100vh;\n flex-direction: column;\n}\n\n.modal-container > .modal-content-scroll-outside {\n overflow: auto;\n background: var(--color-surface01);\n}\n\n.modal-container > header {\n padding: calc(var(--space-unit) * 1.75) calc(var(--space-unit) * 2) calc(var(--space-unit) * 1.75)\n calc(var(--space-unit) * 2);\n background: var(--color-surface02);\n}\n\n.modal-container > header button {\n padding: 0;\n border: none;\n margin: 0;\n margin-left: auto;\n background: transparent;\n cursor: pointer;\n}\n\n.modal-container > header z-icon {\n --z-icon-width: calc(var(--space-unit) * 2.25);\n --z-icon-height: calc(var(--space-unit) * 2.25);\n\n display: flex;\n fill: var(--color-primary01-icon);\n}\n\n.modal-container > header > div {\n display: flex;\n width: 100%;\n align-items: baseline;\n margin-right: calc(var(--space-unit) * 2);\n}\n\n.modal-container > header h1,\n.modal-container > header .subtitle {\n padding: 0;\n margin: 0;\n color: var(--color-default-text);\n font-weight: var(--font-sb);\n}\n\n.modal-container > header h1 {\n font-size: var(--font-size-5);\n letter-spacing: 0;\n line-height: 1.4;\n}\n\n.modal-container > header .subtitle {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n letter-spacing: 0;\n line-height: 1.5;\n}\n\n.modal-container > header > div > h1 *:empty {\n display: none;\n}\n\n.modal-container > header h1 + .subtitle {\n margin-top: calc(var(--space-unit) * 0.5);\n}\n\n.modal-container-scroll-inside > .modal-content-scroll-inside {\n overflow: hidden auto;\n flex: 1 auto;\n background: var(--color-surface01);\n}\n\n.modal-container-scroll-inside > .modal-content-scroll-inside::-webkit-scrollbar,\n.modal-container-scroll-outside > .modal-content-scroll-outside::-webkit-scrollbar {\n width: 10px;\n background: linear-gradient(to right, transparent 0 3px, var(--gray200) 3px 7px, transparent 7px 10px);\n border-radius: var(--border-radius);\n}\n\n.modal-container-scroll-inside > .modal-content-scroll-inside::-webkit-scrollbar-thumb,\n.modal-container-scroll-outside > .modal-content-scroll-outside::-webkit-scrollbar-thumb {\n width: 10px;\n background-color: var(--color-primary01);\n}\n\n.modal-container-scroll-inside > .modal-content-scroll-inside::-webkit-scrollbar-thumb:hover,\n.modal-container-scroll-outside > .modal-content-scroll-outside::-webkit-scrollbar-thumb:hover {\n background-color: var(--color-hover-primary);\n}\n\n/* Firefox */\n.modal-container-scroll-inside .modal-content-scroll-inside,\n.modal-container-scroll-outside .modal-content-scroll-outside {\n scrollbar-color: var(--color-primary01) transparent;\n}\n\n/* Tablet / Desktop */\n@media only screen and (min-width: 768px) {\n .modal-background {\n position: fixed;\n top: 0;\n left: 0;\n overflow: hidden;\n width: 100vw;\n height: 100vh;\n background-color: var(--gray900);\n opacity: 0.7;\n }\n\n .modal-background.modal-background-scroll-outside {\n position: sticky;\n }\n\n .modal-container-scroll-inside {\n position: fixed;\n top: calc(var(--space-unit) * 6);\n left: 50%;\n overflow: hidden;\n width: auto;\n min-width: calc(var(--space-unit) * 40);\n height: auto;\n min-height: calc(var(--space-unit) * 40);\n max-height: calc(100vh - calc(var(--space-unit) * 6 * 2));\n border-radius: var(--border-radius);\n transform: translateX(-50%);\n }\n\n .modal-container-scroll-outside {\n position: absolute;\n top: calc(var(--space-unit) * 6);\n left: 50%;\n display: block;\n overflow: initial;\n width: auto;\n min-width: calc(var(--space-unit) * 40);\n height: auto;\n min-height: calc(var(--space-unit) * 40);\n max-height: calc(100vh - calc(var(--space-unit) * 6 * 2));\n transform: translateX(-50%);\n }\n\n .modal-container > .modal-content-scroll-outside {\n overflow: initial;\n }\n\n .modal-container-scroll-outside > header,\n .modal-container-scroll-inside > header {\n border-top-left-radius: var(--border-radius);\n border-top-right-radius: var(--border-radius);\n }\n\n .modal-container-scroll-outside::after {\n display: block;\n height: calc(var(--space-unit) * 6);\n content: \" \";\n }\n\n .modal-dialog {\n position: fixed;\n top: 0;\n left: 0;\n height: auto;\n overflow-x: hidden;\n overflow-y: auto;\n }\n\n .modal-content-scroll-outside {\n border-bottom-left-radius: var(--border-radius);\n border-bottom-right-radius: var(--border-radius);\n }\n\n .modal-dialog::-webkit-scrollbar {\n display: none;\n }\n}\n\n/* Desktop */\n@media only screen and (min-width: 1152px) {\n .modal-container > header {\n padding-top: calc(var(--space-unit) * 1.5);\n padding-bottom: calc(var(--space-unit) * 1.5);\n }\n\n .modal-container > header h1 {\n font-size: var(--font-size-6);\n font-weight: var(--font-sb);\n letter-spacing: 0;\n line-height: 1.333;\n }\n\n .modal-container > header .subtitle {\n font-size: var(--font-size-4);\n font-weight: var(--font-rg);\n letter-spacing: 0;\n line-height: 1.5;\n }\n\n .modal-container > header h1 + .subtitle {\n margin-top: 0;\n }\n}\n","import {Component, Element, Event, EventEmitter, Listen, Method, Prop, h} from \"@stencil/core\";\nimport dialogPolyfill from \"dialog-polyfill\";\nimport {KeyboardCode} from \"../../beans\";\nimport {mobileBreakpoint} from \"../../constants/breakpoints\";\n\nconst FOCUSABLE_ELEMENTS_SELECTOR =\n ':is(button, input, select, textarea, [contenteditable=\"\"], [contenteditable=\"true\"], a[href], [tabindex], summary):not([disabled], [disabled=\"\"], [tabindex=\"-1\"], [aria-hidden=\"true\"], [hidden])';\n\n/**\n * @slot modalCloseButton - accept custom close button\n * @slot modalContent - set the content of the modal\n */\n@Component({\n tag: \"z-modal\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZModal {\n /** unique id */\n @Prop()\n modalid: string;\n\n /** title text (optional) */\n @Prop()\n modaltitle?: string;\n\n /** subtitle (optional) */\n @Prop()\n modalsubtitle?: string;\n\n /** aria-label for close button (optional) */\n @Prop()\n closeButtonLabel = \"chiudi modale\";\n\n /** add role \"alertdialog\" to dialog (optional, default is false) */\n @Prop()\n alertdialog?: boolean = false;\n\n /** if true, the modal is closable (optional, default is true) */\n @Prop()\n closable?: boolean = true;\n\n /** if true, the modal can scroll inside, if false the viewport can scroll */\n @Prop()\n scrollInside?: boolean = true;\n\n private dialog: HTMLDialogElement;\n\n @Element() host: HTMLZModalElement;\n\n /** emitted on close button click, returns modalid */\n @Event()\n modalClose: EventEmitter;\n\n private emitModalClose(): void {\n if (this.closable) {\n this.modalClose.emit({modalid: this.modalid});\n }\n }\n\n /** emitted on modal header click, returns modalid */\n @Event()\n modalHeaderActive: EventEmitter;\n\n private emitModalHeaderActive(): void {\n this.modalHeaderActive.emit({modalid: this.modalid});\n }\n\n /** emitted on background click, returns modalid */\n @Event()\n modalBackgroundClick: EventEmitter;\n\n private emitBackgroundClick(): void {\n if (this.closable) {\n this.modalBackgroundClick.emit({modalid: this.modalid});\n }\n }\n\n private handlePageOverflow(): void {\n const mobileMediaQuery = window.matchMedia(`(max-width: ${mobileBreakpoint}px)`);\n document.body.style[\"overflow-y\"] = mobileMediaQuery.matches ? \"hidden\" : \"\";\n }\n\n componentDidLoad(): void {\n if (typeof window.HTMLDialogElement !== \"function\") {\n /* workaround to fix `registerDialog` in test environment:\n stencil converts html elements to MockHTMLElement but this element is missing the `localName` property,\n which is used by `registerDialog` to recognize the element as dialog */\n if (!this.dialog.localName) {\n Object.defineProperty(this.dialog, \"localName\", {value: \"dialog\"});\n }\n dialogPolyfill.registerDialog(this.dialog);\n this.dialog.setAttribute(\"open\", \"true\");\n } else {\n this.open();\n }\n\n this.handlePageOverflow();\n }\n\n /** open modal */\n @Method()\n async open(): Promise<void> {\n this.dialog?.showModal();\n }\n\n /** close modal */\n @Method()\n async close(): Promise<void> {\n if (this.closable) {\n this.dialog?.close();\n }\n }\n\n /**\n * Get a list of focusable elements in the dialog.\n * Remove elements with `display: none` from the list, because they're not focusable.\n *\n * N.B. The list is built on the assumption that elements inside shadow root are placed ALL before the `modalContent` slot.\n * Adding focusable elements after the `modalContent` slot would break the order of elements in the list.\n */\n private get focusableElements(): HTMLElement[] {\n return [\n ...Array.from(this.host.shadowRoot.querySelectorAll<HTMLElement>(FOCUSABLE_ELEMENTS_SELECTOR)),\n ...Array.from(this.host.querySelectorAll<HTMLElement>(FOCUSABLE_ELEMENTS_SELECTOR)),\n ].filter((element) => getComputedStyle(element).display !== \"none\");\n }\n\n @Listen(\"keydown\")\n handleKeyDown(e: KeyboardEvent): void {\n if (e.code === KeyboardCode.ESC && !this.closable) {\n e.preventDefault();\n }\n\n if (e.code !== KeyboardCode.TAB) {\n return;\n }\n\n const focusableElements = this.focusableElements;\n const shadowActiveElement = this.host.shadowRoot.activeElement;\n const activeElement = this.host.ownerDocument.activeElement;\n const firstFocusableElement = focusableElements[0];\n const lastFocusableElement = focusableElements[focusableElements.length - 1];\n if (e.shiftKey && (shadowActiveElement == firstFocusableElement || activeElement == firstFocusableElement)) {\n // shift + tab was pressed and current active element is the first focusable element\n e.preventDefault();\n lastFocusableElement.focus();\n } else if (!e.shiftKey && (shadowActiveElement == lastFocusableElement || activeElement == lastFocusableElement)) {\n // shift + tab was pressed and current active element is the first focusable element\n e.preventDefault();\n firstFocusableElement.focus();\n }\n }\n\n private closeButtonSlot(): HTMLElement | void {\n if (this.closable) {\n return (\n <slot name=\"modalCloseButton\">\n <button\n aria-label={this.closeButtonLabel}\n onClick={() => this.close()}\n >\n <z-icon name=\"multiply-circle-filled\"></z-icon>\n </button>\n </slot>\n );\n }\n }\n\n private handleEscape(e: Event): void {\n if (this.closable) {\n return;\n }\n e.preventDefault();\n }\n\n render(): HTMLZModalElement {\n return (\n <dialog\n class={{\n \"modal-dialog\": !this.scrollInside,\n }}\n aria-labelledby=\"modal-title\"\n aria-describedby=\"modal-content\"\n role={this.alertdialog ? \"alertdialog\" : undefined}\n ref={(el) => (this.dialog = el as HTMLDialogElement)}\n onClose={() => this.emitModalClose()}\n onCancel={(e) => this.handleEscape(e)}\n >\n <div\n class={{\n \"modal-container\": true,\n \"modal-container-scroll-inside\": this.scrollInside,\n \"modal-container-scroll-outside\": !this.scrollInside,\n }}\n id={this.modalid}\n >\n <header onClick={this.emitModalHeaderActive.bind(this)}>\n <div>\n {this.modaltitle && <h1 id=\"modal-title\">{this.modaltitle}</h1>}\n {this.closeButtonSlot()}\n </div>\n {this.modalsubtitle && (\n <div\n class=\"subtitle\"\n id=\"modal-subtitle\"\n >\n {this.modalsubtitle}\n </div>\n )}\n </header>\n\n <div\n class={{\n \"modal-content-scroll-inside\": this.scrollInside,\n \"modal-content-scroll-outside\": !this.scrollInside,\n }}\n id=\"modal-content\"\n >\n <slot name=\"modalContent\"></slot>\n </div>\n </div>\n <div\n class={{\n \"modal-background\": true,\n \"modal-background-scroll-outside\": !this.scrollInside,\n }}\n data-action=\"modalBackground\"\n data-modal={this.modalid}\n onClick={() => {\n this.emitBackgroundClick();\n this.close();\n }}\n ></div>\n </dialog>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}