@public-ui/components 1.5.0-rc.6 → 1.5.0-rc.8

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 (594) hide show
  1. package/cheat-sheet.html +8 -8
  2. package/custom-elements.json +8 -8
  3. package/dist/cjs/a11y.tipps-d37919af.js +4 -0
  4. package/dist/cjs/a11y.tipps-d37919af.js.map +1 -0
  5. package/dist/cjs/{app-globals-962138ea.js → app-globals-6eda606a.js} +1 -1
  6. package/dist/cjs/{app-globals-962138ea.js.map → app-globals-6eda606a.js.map} +1 -1
  7. package/dist/cjs/{button-link-824cc1bc.js → button-link-d6aa5d38.js} +1 -1
  8. package/dist/cjs/button-link-d6aa5d38.js.map +1 -0
  9. package/dist/cjs/{controller-3153f149.js → controller-21a6eac9.js} +1 -1
  10. package/dist/cjs/{controller-3153f149.js.map → controller-21a6eac9.js.map} +1 -1
  11. package/dist/cjs/{controller-69bd7d0e.js → controller-41024136.js} +1 -1
  12. package/dist/cjs/{controller-69bd7d0e.js.map → controller-41024136.js.map} +1 -1
  13. package/dist/cjs/{controller-e3409b41.js → controller-5565d7af.js} +1 -1
  14. package/dist/cjs/{controller-e3409b41.js.map → controller-5565d7af.js.map} +1 -1
  15. package/dist/cjs/controller-830760de.js +4 -0
  16. package/dist/cjs/controller-830760de.js.map +1 -0
  17. package/dist/cjs/{controller-e4ebc485.js → controller-bab88e15.js} +1 -1
  18. package/dist/cjs/{controller-e4ebc485.js.map → controller-bab88e15.js.map} +1 -1
  19. package/dist/cjs/{controller-56af7c82.js → controller-e17991a8.js} +1 -1
  20. package/dist/cjs/{controller-56af7c82.js.map → controller-e17991a8.js.map} +1 -1
  21. package/dist/cjs/{controller-icon-795c30fb.js → controller-icon-f69a8b14.js} +1 -1
  22. package/dist/cjs/controller-icon-f69a8b14.js.map +1 -0
  23. package/dist/cjs/{devtools-0dd3813e.js → devtools-78d46952.js} +1 -1
  24. package/dist/cjs/{devtools-0dd3813e.js.map → devtools-78d46952.js.map} +1 -1
  25. package/dist/cjs/{i18n-6d129e0e.js → i18n-f4e2ff1a.js} +1 -1
  26. package/dist/cjs/{i18n-6d129e0e.js.map → i18n-f4e2ff1a.js.map} +1 -1
  27. package/dist/cjs/{icon-31fdd6ee.js → icon-e4f3e165.js} +1 -1
  28. package/dist/cjs/icon-e4f3e165.js.map +1 -0
  29. package/dist/cjs/index.cjs.js +1 -1
  30. package/dist/cjs/kol-abbr.cjs.entry.js +1 -1
  31. package/dist/cjs/kol-abbr.cjs.entry.js.map +1 -1
  32. package/dist/cjs/kol-accordion.cjs.entry.js +1 -1
  33. package/dist/cjs/kol-accordion.cjs.entry.js.map +1 -1
  34. package/dist/cjs/kol-alert.cjs.entry.js +1 -1
  35. package/dist/cjs/kol-alert.cjs.entry.js.map +1 -1
  36. package/dist/cjs/kol-badge.cjs.entry.js +1 -1
  37. package/dist/cjs/kol-badge.cjs.entry.js.map +1 -1
  38. package/dist/cjs/kol-breadcrumb.cjs.entry.js +1 -1
  39. package/dist/cjs/kol-breadcrumb.cjs.entry.js.map +1 -1
  40. package/dist/cjs/kol-button-group.cjs.entry.js +1 -1
  41. package/dist/cjs/kol-button-group.cjs.entry.js.map +1 -1
  42. package/dist/cjs/kol-button-link.cjs.entry.js +1 -1
  43. package/dist/cjs/kol-button-link.cjs.entry.js.map +1 -1
  44. package/dist/cjs/kol-button-wc_2.cjs.entry.js +1 -1
  45. package/dist/cjs/kol-button-wc_2.cjs.entry.js.map +1 -1
  46. package/dist/cjs/kol-button.cjs.entry.js +1 -1
  47. package/dist/cjs/kol-button.cjs.entry.js.map +1 -1
  48. package/dist/cjs/kol-card.cjs.entry.js +1 -1
  49. package/dist/cjs/kol-card.cjs.entry.js.map +1 -1
  50. package/dist/cjs/kol-details.cjs.entry.js +1 -1
  51. package/dist/cjs/kol-details.cjs.entry.js.map +1 -1
  52. package/dist/cjs/kol-form.cjs.entry.js +1 -1
  53. package/dist/cjs/kol-heading-wc_2.cjs.entry.js +1 -1
  54. package/dist/cjs/kol-heading-wc_2.cjs.entry.js.map +1 -1
  55. package/dist/cjs/kol-heading.cjs.entry.js +1 -1
  56. package/dist/cjs/kol-heading.cjs.entry.js.map +1 -1
  57. package/dist/cjs/kol-icon.cjs.entry.js +1 -1
  58. package/dist/cjs/kol-icon.cjs.entry.js.map +1 -1
  59. package/dist/cjs/kol-image.cjs.entry.js +1 -1
  60. package/dist/cjs/kol-indented-text.cjs.entry.js +1 -1
  61. package/dist/cjs/kol-indented-text.cjs.entry.js.map +1 -1
  62. package/dist/cjs/kol-input-adapter-leanup.cjs.entry.js +1 -1
  63. package/dist/cjs/kol-input-checkbox.cjs.entry.js +1 -1
  64. package/dist/cjs/kol-input-checkbox.cjs.entry.js.map +1 -1
  65. package/dist/cjs/kol-input-color.cjs.entry.js +1 -1
  66. package/dist/cjs/kol-input-color.cjs.entry.js.map +1 -1
  67. package/dist/cjs/kol-input-date.cjs.entry.js +1 -1
  68. package/dist/cjs/kol-input-date.cjs.entry.js.map +1 -1
  69. package/dist/cjs/kol-input-email.cjs.entry.js +1 -1
  70. package/dist/cjs/kol-input-email.cjs.entry.js.map +1 -1
  71. package/dist/cjs/kol-input-file.cjs.entry.js +1 -1
  72. package/dist/cjs/kol-input-file.cjs.entry.js.map +1 -1
  73. package/dist/cjs/kol-input-number.cjs.entry.js +1 -1
  74. package/dist/cjs/kol-input-number.cjs.entry.js.map +1 -1
  75. package/dist/cjs/kol-input-password.cjs.entry.js +1 -1
  76. package/dist/cjs/kol-input-password.cjs.entry.js.map +1 -1
  77. package/dist/cjs/kol-input-radio-group.cjs.entry.js +1 -1
  78. package/dist/cjs/kol-input-radio.cjs.entry.js +1 -1
  79. package/dist/cjs/kol-input-radio.cjs.entry.js.map +1 -1
  80. package/dist/cjs/kol-input-range.cjs.entry.js +1 -1
  81. package/dist/cjs/kol-input-range.cjs.entry.js.map +1 -1
  82. package/dist/cjs/kol-input-text.cjs.entry.js +1 -1
  83. package/dist/cjs/kol-input-text.cjs.entry.js.map +1 -1
  84. package/dist/cjs/kol-kolibri.cjs.entry.js +1 -1
  85. package/dist/cjs/kol-kolibri.cjs.entry.js.map +1 -1
  86. package/dist/cjs/kol-link-button.cjs.entry.js +1 -1
  87. package/dist/cjs/kol-link-button.cjs.entry.js.map +1 -1
  88. package/dist/cjs/kol-link-group.cjs.entry.js +1 -1
  89. package/dist/cjs/kol-link-group.cjs.entry.js.map +1 -1
  90. package/dist/cjs/kol-link-wc.cjs.entry.js +1 -1
  91. package/dist/cjs/kol-link-wc.cjs.entry.js.map +1 -1
  92. package/dist/cjs/kol-link.cjs.entry.js +1 -1
  93. package/dist/cjs/kol-link.cjs.entry.js.map +1 -1
  94. package/dist/cjs/kol-logo.cjs.entry.js +1 -1
  95. package/dist/cjs/kol-logo.cjs.entry.js.map +1 -1
  96. package/dist/cjs/kol-modal.cjs.entry.js +1 -1
  97. package/dist/cjs/kol-modal.cjs.entry.js.map +1 -1
  98. package/dist/cjs/kol-nav.cjs.entry.js +1 -1
  99. package/dist/cjs/kol-nav.cjs.entry.js.map +1 -1
  100. package/dist/cjs/kol-pagination.cjs.entry.js +1 -1
  101. package/dist/cjs/kol-pagination.cjs.entry.js.map +1 -1
  102. package/dist/cjs/kol-progress.cjs.entry.js +1 -1
  103. package/dist/cjs/kol-progress.cjs.entry.js.map +1 -1
  104. package/dist/cjs/kol-quote.cjs.entry.js +1 -1
  105. package/dist/cjs/kol-quote.cjs.entry.js.map +1 -1
  106. package/dist/cjs/kol-select.cjs.entry.js +1 -1
  107. package/dist/cjs/kol-select.cjs.entry.js.map +1 -1
  108. package/dist/cjs/kol-skip-nav.cjs.entry.js +1 -1
  109. package/dist/cjs/kol-skip-nav.cjs.entry.js.map +1 -1
  110. package/dist/cjs/kol-span.cjs.entry.js +1 -1
  111. package/dist/cjs/kol-span.cjs.entry.js.map +1 -1
  112. package/dist/cjs/kol-spin.cjs.entry.js +1 -1
  113. package/dist/cjs/kol-spin.cjs.entry.js.map +1 -1
  114. package/dist/cjs/kol-symbol.cjs.entry.js +1 -1
  115. package/dist/cjs/kol-table.cjs.entry.js +1 -1
  116. package/dist/cjs/kol-table.cjs.entry.js.map +1 -1
  117. package/dist/cjs/kol-tabs.cjs.entry.js +1 -1
  118. package/dist/cjs/kol-tabs.cjs.entry.js.map +1 -1
  119. package/dist/cjs/kol-textarea.cjs.entry.js +1 -1
  120. package/dist/cjs/kol-textarea.cjs.entry.js.map +1 -1
  121. package/dist/cjs/kol-toast.cjs.entry.js +1 -1
  122. package/dist/cjs/kol-toast.cjs.entry.js.map +1 -1
  123. package/dist/cjs/kol-tooltip.cjs.entry.js +1 -1
  124. package/dist/cjs/kol-tooltip.cjs.entry.js.map +1 -1
  125. package/dist/cjs/kol-version.cjs.entry.js +1 -1
  126. package/dist/cjs/kol-version.cjs.entry.js.map +1 -1
  127. package/dist/cjs/kolibri.cjs.js +1 -1
  128. package/dist/cjs/label-412be5d5.js +4 -0
  129. package/dist/cjs/{label-18346064.js.map → label-412be5d5.js.map} +1 -1
  130. package/dist/cjs/loader.cjs.js +1 -1
  131. package/dist/cjs/prop.validators-6a254bcc.js +4 -0
  132. package/dist/cjs/prop.validators-6a254bcc.js.map +1 -0
  133. package/dist/cjs/{tab-index-b403a20d.js → tab-index-f37e79c5.js} +1 -1
  134. package/dist/cjs/{tab-index-b403a20d.js.map → tab-index-f37e79c5.js.map} +1 -1
  135. package/dist/cjs/{validation-9c5d9498.js → validation-ce77567d.js} +1 -1
  136. package/dist/cjs/{validation-9c5d9498.js.map → validation-ce77567d.js.map} +1 -1
  137. package/dist/cjs/{validation-1298c9ca.js → validation-fa80f868.js} +1 -1
  138. package/dist/cjs/validation-fa80f868.js.map +1 -0
  139. package/dist/components/component.js +1 -1
  140. package/dist/components/component.js.map +1 -1
  141. package/dist/components/component10.js +1 -1
  142. package/dist/components/component10.js.map +1 -1
  143. package/dist/components/component11.js +1 -1
  144. package/dist/components/component11.js.map +1 -1
  145. package/dist/components/component12.js +1 -1
  146. package/dist/components/component12.js.map +1 -1
  147. package/dist/components/component13.js +1 -1
  148. package/dist/components/component13.js.map +1 -1
  149. package/dist/components/component2.js +1 -1
  150. package/dist/components/component2.js.map +1 -1
  151. package/dist/components/component3.js +1 -1
  152. package/dist/components/component3.js.map +1 -1
  153. package/dist/components/component5.js +1 -1
  154. package/dist/components/component5.js.map +1 -1
  155. package/dist/components/component6.js +1 -1
  156. package/dist/components/component6.js.map +1 -1
  157. package/dist/components/component8.js +1 -1
  158. package/dist/components/component8.js.map +1 -1
  159. package/dist/components/component9.js +1 -1
  160. package/dist/components/component9.js.map +1 -1
  161. package/dist/components/controller-icon.js +1 -1
  162. package/dist/components/controller-icon.js.map +1 -1
  163. package/dist/components/controller.js +1 -1
  164. package/dist/components/controller2.js +1 -1
  165. package/dist/components/controller3.js +1 -1
  166. package/dist/components/controller4.js +1 -1
  167. package/dist/components/devtools.js +1 -1
  168. package/dist/components/kol-abbr.js +1 -1
  169. package/dist/components/kol-abbr.js.map +1 -1
  170. package/dist/components/kol-accordion.js +1 -1
  171. package/dist/components/kol-accordion.js.map +1 -1
  172. package/dist/components/kol-breadcrumb.js +1 -1
  173. package/dist/components/kol-breadcrumb.js.map +1 -1
  174. package/dist/components/kol-button-group.js +1 -1
  175. package/dist/components/kol-button-group.js.map +1 -1
  176. package/dist/components/kol-button-link.js +1 -1
  177. package/dist/components/kol-button-link.js.map +1 -1
  178. package/dist/components/kol-card.js +1 -1
  179. package/dist/components/kol-card.js.map +1 -1
  180. package/dist/components/kol-details.js +1 -1
  181. package/dist/components/kol-details.js.map +1 -1
  182. package/dist/components/kol-form.js +1 -1
  183. package/dist/components/kol-heading.js +1 -1
  184. package/dist/components/kol-heading.js.map +1 -1
  185. package/dist/components/kol-input-adapter-leanup.js +1 -1
  186. package/dist/components/kol-input-checkbox.js +1 -1
  187. package/dist/components/kol-input-checkbox.js.map +1 -1
  188. package/dist/components/kol-input-color.js +1 -1
  189. package/dist/components/kol-input-color.js.map +1 -1
  190. package/dist/components/kol-input-date.js +1 -1
  191. package/dist/components/kol-input-date.js.map +1 -1
  192. package/dist/components/kol-input-email.js +1 -1
  193. package/dist/components/kol-input-email.js.map +1 -1
  194. package/dist/components/kol-input-file.js +1 -1
  195. package/dist/components/kol-input-file.js.map +1 -1
  196. package/dist/components/kol-input-password.js +1 -1
  197. package/dist/components/kol-input-password.js.map +1 -1
  198. package/dist/components/kol-input-radio-group.js +1 -1
  199. package/dist/components/kol-input-range.js +1 -1
  200. package/dist/components/kol-input-range.js.map +1 -1
  201. package/dist/components/kol-input-text.js +1 -1
  202. package/dist/components/kol-input-text.js.map +1 -1
  203. package/dist/components/kol-kolibri.js +1 -1
  204. package/dist/components/kol-kolibri.js.map +1 -1
  205. package/dist/components/kol-link-button.js +1 -1
  206. package/dist/components/kol-link-button.js.map +1 -1
  207. package/dist/components/kol-link-group.js +1 -1
  208. package/dist/components/kol-link-group.js.map +1 -1
  209. package/dist/components/kol-logo.js +1 -1
  210. package/dist/components/kol-logo.js.map +1 -1
  211. package/dist/components/kol-modal.js +1 -1
  212. package/dist/components/kol-modal.js.map +1 -1
  213. package/dist/components/kol-nav.js +1 -1
  214. package/dist/components/kol-nav.js.map +1 -1
  215. package/dist/components/kol-progress.js +1 -1
  216. package/dist/components/kol-progress.js.map +1 -1
  217. package/dist/components/kol-quote.js +1 -1
  218. package/dist/components/kol-quote.js.map +1 -1
  219. package/dist/components/kol-skip-nav.js +1 -1
  220. package/dist/components/kol-skip-nav.js.map +1 -1
  221. package/dist/components/kol-span.js +1 -1
  222. package/dist/components/kol-span.js.map +1 -1
  223. package/dist/components/kol-spin.js +1 -1
  224. package/dist/components/kol-spin.js.map +1 -1
  225. package/dist/components/kol-table.js +1 -1
  226. package/dist/components/kol-table.js.map +1 -1
  227. package/dist/components/kol-tabs.js +1 -1
  228. package/dist/components/kol-tabs.js.map +1 -1
  229. package/dist/components/kol-textarea.js +1 -1
  230. package/dist/components/kol-textarea.js.map +1 -1
  231. package/dist/components/kol-toast.js +1 -1
  232. package/dist/components/kol-toast.js.map +1 -1
  233. package/dist/components/kol-version.js +1 -1
  234. package/dist/components/kol-version.js.map +1 -1
  235. package/dist/components/prop.validators.js +1 -1
  236. package/dist/components/prop.validators.js.map +1 -1
  237. package/dist/components/shadow.js +1 -1
  238. package/dist/components/shadow.js.map +1 -1
  239. package/dist/components/shadow2.js +1 -1
  240. package/dist/components/shadow2.js.map +1 -1
  241. package/dist/components/validation.js +1 -1
  242. package/dist/components/validation.js.map +1 -1
  243. package/dist/esm/a11y.tipps-5ca36877.js +4 -0
  244. package/dist/esm/a11y.tipps-5ca36877.js.map +1 -0
  245. package/dist/esm/{app-globals-2f4ec88e.js → app-globals-08fd5e4e.js} +1 -1
  246. package/dist/esm/{app-globals-2f4ec88e.js.map → app-globals-08fd5e4e.js.map} +1 -1
  247. package/dist/esm/{button-link-e424d11b.js → button-link-249585bf.js} +1 -1
  248. package/dist/esm/button-link-249585bf.js.map +1 -0
  249. package/dist/esm/{controller-2397b4c5.js → controller-03e00b6c.js} +1 -1
  250. package/dist/esm/{controller-2397b4c5.js.map → controller-03e00b6c.js.map} +1 -1
  251. package/dist/esm/{controller-c1692f88.js → controller-08af836c.js} +1 -1
  252. package/dist/esm/{controller-c1692f88.js.map → controller-08af836c.js.map} +1 -1
  253. package/dist/esm/{controller-6ba588d9.js → controller-4f4582b7.js} +1 -1
  254. package/dist/esm/{controller-6ba588d9.js.map → controller-4f4582b7.js.map} +1 -1
  255. package/dist/esm/{controller-ea973815.js → controller-ac44fc5f.js} +1 -1
  256. package/dist/esm/{controller-ea973815.js.map → controller-ac44fc5f.js.map} +1 -1
  257. package/dist/esm/controller-bf4a0bc1.js +4 -0
  258. package/dist/esm/controller-bf4a0bc1.js.map +1 -0
  259. package/dist/esm/{controller-0b6f277d.js → controller-ca954299.js} +1 -1
  260. package/dist/esm/{controller-0b6f277d.js.map → controller-ca954299.js.map} +1 -1
  261. package/dist/esm/{controller-icon-4bce436b.js → controller-icon-fb82236a.js} +1 -1
  262. package/dist/esm/controller-icon-fb82236a.js.map +1 -0
  263. package/dist/esm/{devtools-657e1cb8.js → devtools-525ee939.js} +1 -1
  264. package/dist/esm/{devtools-657e1cb8.js.map → devtools-525ee939.js.map} +1 -1
  265. package/dist/esm/{i18n-bc1e0dfd.js → i18n-97355570.js} +1 -1
  266. package/dist/esm/{i18n-bc1e0dfd.js.map → i18n-97355570.js.map} +1 -1
  267. package/dist/esm/{icon-a88dcc85.js → icon-970694a7.js} +1 -1
  268. package/dist/esm/icon-970694a7.js.map +1 -0
  269. package/dist/esm/index.js +1 -1
  270. package/dist/esm/kol-abbr.entry.js +1 -1
  271. package/dist/esm/kol-abbr.entry.js.map +1 -1
  272. package/dist/esm/kol-accordion.entry.js +1 -1
  273. package/dist/esm/kol-accordion.entry.js.map +1 -1
  274. package/dist/esm/kol-alert.entry.js +1 -1
  275. package/dist/esm/kol-alert.entry.js.map +1 -1
  276. package/dist/esm/kol-badge.entry.js +1 -1
  277. package/dist/esm/kol-badge.entry.js.map +1 -1
  278. package/dist/esm/kol-breadcrumb.entry.js +1 -1
  279. package/dist/esm/kol-breadcrumb.entry.js.map +1 -1
  280. package/dist/esm/kol-button-group.entry.js +1 -1
  281. package/dist/esm/kol-button-group.entry.js.map +1 -1
  282. package/dist/esm/kol-button-link.entry.js +1 -1
  283. package/dist/esm/kol-button-link.entry.js.map +1 -1
  284. package/dist/esm/kol-button-wc_2.entry.js +1 -1
  285. package/dist/esm/kol-button-wc_2.entry.js.map +1 -1
  286. package/dist/esm/kol-button.entry.js +1 -1
  287. package/dist/esm/kol-button.entry.js.map +1 -1
  288. package/dist/esm/kol-card.entry.js +1 -1
  289. package/dist/esm/kol-card.entry.js.map +1 -1
  290. package/dist/esm/kol-details.entry.js +1 -1
  291. package/dist/esm/kol-details.entry.js.map +1 -1
  292. package/dist/esm/kol-form.entry.js +1 -1
  293. package/dist/esm/kol-heading-wc_2.entry.js +1 -1
  294. package/dist/esm/kol-heading-wc_2.entry.js.map +1 -1
  295. package/dist/esm/kol-heading.entry.js +1 -1
  296. package/dist/esm/kol-heading.entry.js.map +1 -1
  297. package/dist/esm/kol-icon.entry.js +1 -1
  298. package/dist/esm/kol-icon.entry.js.map +1 -1
  299. package/dist/esm/kol-image.entry.js +1 -1
  300. package/dist/esm/kol-indented-text.entry.js +1 -1
  301. package/dist/esm/kol-indented-text.entry.js.map +1 -1
  302. package/dist/esm/kol-input-adapter-leanup.entry.js +1 -1
  303. package/dist/esm/kol-input-checkbox.entry.js +1 -1
  304. package/dist/esm/kol-input-checkbox.entry.js.map +1 -1
  305. package/dist/esm/kol-input-color.entry.js +1 -1
  306. package/dist/esm/kol-input-color.entry.js.map +1 -1
  307. package/dist/esm/kol-input-date.entry.js +1 -1
  308. package/dist/esm/kol-input-date.entry.js.map +1 -1
  309. package/dist/esm/kol-input-email.entry.js +1 -1
  310. package/dist/esm/kol-input-email.entry.js.map +1 -1
  311. package/dist/esm/kol-input-file.entry.js +1 -1
  312. package/dist/esm/kol-input-file.entry.js.map +1 -1
  313. package/dist/esm/kol-input-number.entry.js +1 -1
  314. package/dist/esm/kol-input-number.entry.js.map +1 -1
  315. package/dist/esm/kol-input-password.entry.js +1 -1
  316. package/dist/esm/kol-input-password.entry.js.map +1 -1
  317. package/dist/esm/kol-input-radio-group.entry.js +1 -1
  318. package/dist/esm/kol-input-radio.entry.js +1 -1
  319. package/dist/esm/kol-input-radio.entry.js.map +1 -1
  320. package/dist/esm/kol-input-range.entry.js +1 -1
  321. package/dist/esm/kol-input-range.entry.js.map +1 -1
  322. package/dist/esm/kol-input-text.entry.js +1 -1
  323. package/dist/esm/kol-input-text.entry.js.map +1 -1
  324. package/dist/esm/kol-kolibri.entry.js +1 -1
  325. package/dist/esm/kol-kolibri.entry.js.map +1 -1
  326. package/dist/esm/kol-link-button.entry.js +1 -1
  327. package/dist/esm/kol-link-button.entry.js.map +1 -1
  328. package/dist/esm/kol-link-group.entry.js +1 -1
  329. package/dist/esm/kol-link-group.entry.js.map +1 -1
  330. package/dist/esm/kol-link-wc.entry.js +1 -1
  331. package/dist/esm/kol-link-wc.entry.js.map +1 -1
  332. package/dist/esm/kol-link.entry.js +1 -1
  333. package/dist/esm/kol-link.entry.js.map +1 -1
  334. package/dist/esm/kol-logo.entry.js +1 -1
  335. package/dist/esm/kol-logo.entry.js.map +1 -1
  336. package/dist/esm/kol-modal.entry.js +1 -1
  337. package/dist/esm/kol-modal.entry.js.map +1 -1
  338. package/dist/esm/kol-nav.entry.js +1 -1
  339. package/dist/esm/kol-nav.entry.js.map +1 -1
  340. package/dist/esm/kol-pagination.entry.js +1 -1
  341. package/dist/esm/kol-pagination.entry.js.map +1 -1
  342. package/dist/esm/kol-progress.entry.js +1 -1
  343. package/dist/esm/kol-progress.entry.js.map +1 -1
  344. package/dist/esm/kol-quote.entry.js +1 -1
  345. package/dist/esm/kol-quote.entry.js.map +1 -1
  346. package/dist/esm/kol-select.entry.js +1 -1
  347. package/dist/esm/kol-select.entry.js.map +1 -1
  348. package/dist/esm/kol-skip-nav.entry.js +1 -1
  349. package/dist/esm/kol-skip-nav.entry.js.map +1 -1
  350. package/dist/esm/kol-span.entry.js +1 -1
  351. package/dist/esm/kol-span.entry.js.map +1 -1
  352. package/dist/esm/kol-spin.entry.js +1 -1
  353. package/dist/esm/kol-spin.entry.js.map +1 -1
  354. package/dist/esm/kol-symbol.entry.js +1 -1
  355. package/dist/esm/kol-table.entry.js +1 -1
  356. package/dist/esm/kol-table.entry.js.map +1 -1
  357. package/dist/esm/kol-tabs.entry.js +1 -1
  358. package/dist/esm/kol-tabs.entry.js.map +1 -1
  359. package/dist/esm/kol-textarea.entry.js +1 -1
  360. package/dist/esm/kol-textarea.entry.js.map +1 -1
  361. package/dist/esm/kol-toast.entry.js +1 -1
  362. package/dist/esm/kol-toast.entry.js.map +1 -1
  363. package/dist/esm/kol-tooltip.entry.js +1 -1
  364. package/dist/esm/kol-tooltip.entry.js.map +1 -1
  365. package/dist/esm/kol-version.entry.js +1 -1
  366. package/dist/esm/kol-version.entry.js.map +1 -1
  367. package/dist/esm/kolibri.js +1 -1
  368. package/dist/esm/{label-f8bdc301.js → label-966377c0.js} +1 -1
  369. package/dist/esm/{label-f8bdc301.js.map → label-966377c0.js.map} +1 -1
  370. package/dist/esm/loader.js +1 -1
  371. package/dist/esm/prop.validators-1f3db013.js +4 -0
  372. package/dist/esm/prop.validators-1f3db013.js.map +1 -0
  373. package/dist/esm/{tab-index-dc6e8ba5.js → tab-index-97fed287.js} +1 -1
  374. package/dist/esm/{tab-index-dc6e8ba5.js.map → tab-index-97fed287.js.map} +1 -1
  375. package/dist/esm/validation-2bb481bd.js +4 -0
  376. package/dist/esm/validation-2bb481bd.js.map +1 -0
  377. package/dist/esm/validation-b0614edd.js +4 -0
  378. package/dist/esm/{validation-ce72d9b3.js.map → validation-b0614edd.js.map} +1 -1
  379. package/dist/kolibri/a11y.tipps-5ca36877.js +4 -0
  380. package/dist/kolibri/a11y.tipps-5ca36877.js.map +1 -0
  381. package/dist/kolibri/app-globals-08fd5e4e.js +4 -0
  382. package/dist/kolibri/assets/modal-simulation.js +1 -1
  383. package/dist/kolibri/assets/nav-simulation.js +1 -1
  384. package/dist/kolibri/assets/progress-simulation.js +1 -1
  385. package/dist/kolibri/assets/toast-simulation.js +1 -1
  386. package/dist/kolibri/button-link-249585bf.js +4 -0
  387. package/dist/kolibri/button-link-249585bf.js.map +1 -0
  388. package/dist/kolibri/{controller-2397b4c5.js → controller-03e00b6c.js} +1 -1
  389. package/dist/kolibri/{controller-c1692f88.js → controller-08af836c.js} +1 -1
  390. package/dist/kolibri/{controller-6ba588d9.js → controller-4f4582b7.js} +1 -1
  391. package/dist/kolibri/controller-ac44fc5f.js +4 -0
  392. package/dist/kolibri/{controller-fe7060bc.js → controller-bf4a0bc1.js} +1 -1
  393. package/dist/kolibri/controller-bf4a0bc1.js.map +1 -0
  394. package/dist/kolibri/{controller-0b6f277d.js → controller-ca954299.js} +1 -1
  395. package/dist/kolibri/{controller-icon-4bce436b.js → controller-icon-fb82236a.js} +1 -1
  396. package/dist/kolibri/{controller-icon-4bce436b.js.map → controller-icon-fb82236a.js.map} +1 -1
  397. package/dist/kolibri/{devtools-657e1cb8.js → devtools-525ee939.js} +1 -1
  398. package/dist/kolibri/{i18n-bc1e0dfd.js → i18n-97355570.js} +1 -1
  399. package/dist/kolibri/{icon-a88dcc85.js → icon-970694a7.js} +1 -1
  400. package/dist/kolibri/icon-970694a7.js.map +1 -0
  401. package/dist/kolibri/index.esm.js +1 -1
  402. package/dist/kolibri/kol-abbr.entry.js +1 -1
  403. package/dist/kolibri/kol-abbr.entry.js.map +1 -1
  404. package/dist/kolibri/kol-accordion.entry.js +1 -1
  405. package/dist/kolibri/kol-accordion.entry.js.map +1 -1
  406. package/dist/kolibri/kol-alert.entry.js +1 -1
  407. package/dist/kolibri/kol-alert.entry.js.map +1 -1
  408. package/dist/kolibri/kol-badge.entry.js +1 -1
  409. package/dist/kolibri/kol-badge.entry.js.map +1 -1
  410. package/dist/kolibri/kol-breadcrumb.entry.js +1 -1
  411. package/dist/kolibri/kol-breadcrumb.entry.js.map +1 -1
  412. package/dist/kolibri/kol-button-group.entry.js +1 -1
  413. package/dist/kolibri/kol-button-group.entry.js.map +1 -1
  414. package/dist/kolibri/kol-button-link.entry.js +1 -1
  415. package/dist/kolibri/kol-button-link.entry.js.map +1 -1
  416. package/dist/kolibri/kol-button-wc_2.entry.js +1 -1
  417. package/dist/kolibri/kol-button-wc_2.entry.js.map +1 -1
  418. package/dist/kolibri/kol-button.entry.js +1 -1
  419. package/dist/kolibri/kol-button.entry.js.map +1 -1
  420. package/dist/kolibri/kol-card.entry.js +1 -1
  421. package/dist/kolibri/kol-card.entry.js.map +1 -1
  422. package/dist/kolibri/kol-details.entry.js +1 -1
  423. package/dist/kolibri/kol-details.entry.js.map +1 -1
  424. package/dist/kolibri/kol-form.entry.js +1 -1
  425. package/dist/kolibri/kol-heading-wc_2.entry.js +1 -1
  426. package/dist/kolibri/kol-heading-wc_2.entry.js.map +1 -1
  427. package/dist/kolibri/kol-heading.entry.js +1 -1
  428. package/dist/kolibri/kol-heading.entry.js.map +1 -1
  429. package/dist/kolibri/kol-icon.entry.js +1 -1
  430. package/dist/kolibri/kol-icon.entry.js.map +1 -1
  431. package/dist/kolibri/kol-image.entry.js +1 -1
  432. package/dist/kolibri/kol-image.entry.js.map +1 -1
  433. package/dist/kolibri/kol-indented-text.entry.js +1 -1
  434. package/dist/kolibri/kol-indented-text.entry.js.map +1 -1
  435. package/dist/kolibri/kol-input-adapter-leanup.entry.js +1 -1
  436. package/dist/kolibri/kol-input-checkbox.entry.js +1 -1
  437. package/dist/kolibri/kol-input-checkbox.entry.js.map +1 -1
  438. package/dist/kolibri/kol-input-color.entry.js +1 -1
  439. package/dist/kolibri/kol-input-color.entry.js.map +1 -1
  440. package/dist/kolibri/kol-input-date.entry.js +1 -1
  441. package/dist/kolibri/kol-input-date.entry.js.map +1 -1
  442. package/dist/kolibri/kol-input-email.entry.js +1 -1
  443. package/dist/kolibri/kol-input-email.entry.js.map +1 -1
  444. package/dist/kolibri/kol-input-file.entry.js +1 -1
  445. package/dist/kolibri/kol-input-file.entry.js.map +1 -1
  446. package/dist/kolibri/kol-input-number.entry.js +1 -1
  447. package/dist/kolibri/kol-input-number.entry.js.map +1 -1
  448. package/dist/kolibri/kol-input-password.entry.js +1 -1
  449. package/dist/kolibri/kol-input-password.entry.js.map +1 -1
  450. package/dist/kolibri/kol-input-radio-group.entry.js +1 -1
  451. package/dist/kolibri/kol-input-radio.entry.js +1 -1
  452. package/dist/kolibri/kol-input-radio.entry.js.map +1 -1
  453. package/dist/kolibri/kol-input-range.entry.js +1 -1
  454. package/dist/kolibri/kol-input-range.entry.js.map +1 -1
  455. package/dist/kolibri/kol-input-text.entry.js +1 -1
  456. package/dist/kolibri/kol-input-text.entry.js.map +1 -1
  457. package/dist/kolibri/kol-kolibri.entry.js +1 -1
  458. package/dist/kolibri/kol-kolibri.entry.js.map +1 -1
  459. package/dist/kolibri/kol-link-button.entry.js +1 -1
  460. package/dist/kolibri/kol-link-button.entry.js.map +1 -1
  461. package/dist/kolibri/kol-link-group.entry.js +1 -1
  462. package/dist/kolibri/kol-link-group.entry.js.map +1 -1
  463. package/dist/kolibri/kol-link-wc.entry.js +1 -1
  464. package/dist/kolibri/kol-link-wc.entry.js.map +1 -1
  465. package/dist/kolibri/kol-link.entry.js +1 -1
  466. package/dist/kolibri/kol-link.entry.js.map +1 -1
  467. package/dist/kolibri/kol-logo.entry.js +1 -1
  468. package/dist/kolibri/kol-logo.entry.js.map +1 -1
  469. package/dist/kolibri/kol-modal.entry.js +1 -1
  470. package/dist/kolibri/kol-modal.entry.js.map +1 -1
  471. package/dist/kolibri/kol-nav.entry.js +1 -1
  472. package/dist/kolibri/kol-nav.entry.js.map +1 -1
  473. package/dist/kolibri/kol-pagination.entry.js +1 -1
  474. package/dist/kolibri/kol-pagination.entry.js.map +1 -1
  475. package/dist/kolibri/kol-progress.entry.js +1 -1
  476. package/dist/kolibri/kol-progress.entry.js.map +1 -1
  477. package/dist/kolibri/kol-quote.entry.js +1 -1
  478. package/dist/kolibri/kol-quote.entry.js.map +1 -1
  479. package/dist/kolibri/kol-select.entry.js +1 -1
  480. package/dist/kolibri/kol-select.entry.js.map +1 -1
  481. package/dist/kolibri/kol-skip-nav.entry.js +1 -1
  482. package/dist/kolibri/kol-skip-nav.entry.js.map +1 -1
  483. package/dist/kolibri/kol-span.entry.js +1 -1
  484. package/dist/kolibri/kol-span.entry.js.map +1 -1
  485. package/dist/kolibri/kol-spin.entry.js +1 -1
  486. package/dist/kolibri/kol-spin.entry.js.map +1 -1
  487. package/dist/kolibri/kol-symbol.entry.js +1 -1
  488. package/dist/kolibri/kol-table.entry.js +1 -1
  489. package/dist/kolibri/kol-table.entry.js.map +1 -1
  490. package/dist/kolibri/kol-tabs.entry.js +1 -1
  491. package/dist/kolibri/kol-tabs.entry.js.map +1 -1
  492. package/dist/kolibri/kol-textarea.entry.js +1 -1
  493. package/dist/kolibri/kol-textarea.entry.js.map +1 -1
  494. package/dist/kolibri/kol-toast.entry.js +1 -1
  495. package/dist/kolibri/kol-toast.entry.js.map +1 -1
  496. package/dist/kolibri/kol-tooltip.entry.js +1 -1
  497. package/dist/kolibri/kol-tooltip.entry.js.map +1 -1
  498. package/dist/kolibri/kol-version.entry.js +1 -1
  499. package/dist/kolibri/kol-version.entry.js.map +1 -1
  500. package/dist/kolibri/kolibri.esm.js +1 -1
  501. package/dist/kolibri/{label-f8bdc301.js → label-966377c0.js} +1 -1
  502. package/dist/kolibri/{prop.validators-daa14517.js → prop.validators-1f3db013.js} +1 -1
  503. package/dist/kolibri/prop.validators-1f3db013.js.map +1 -0
  504. package/dist/kolibri/tab-index-97fed287.js +4 -0
  505. package/dist/kolibri/{tab-index-dc6e8ba5.js.map → tab-index-97fed287.js.map} +1 -1
  506. package/dist/kolibri/validation-2bb481bd.js +4 -0
  507. package/dist/kolibri/validation-2bb481bd.js.map +1 -0
  508. package/dist/kolibri/{validation-ce72d9b3.js → validation-b0614edd.js} +1 -1
  509. package/dist/types/components/breadcrumb/component.d.ts +5 -5
  510. package/dist/types/components/button/test/html.mock.d.ts +1 -1
  511. package/dist/types/components/icon/component.d.ts +1 -1
  512. package/dist/types/components/input-checkbox/component.d.ts +1 -1
  513. package/dist/types/components/input-checkbox/controller.d.ts +1 -1
  514. package/dist/types/components/input-checkbox/types.d.ts +2 -2
  515. package/dist/types/components/input-date/types.d.ts +1 -1
  516. package/dist/types/components/input-text/component.d.ts +1 -1
  517. package/dist/types/components/link/component.d.ts +0 -6
  518. package/dist/types/components/link-group/component.d.ts +7 -7
  519. package/dist/types/components/nav/component.d.ts +16 -11
  520. package/dist/types/components/nav/validation.d.ts +3 -3
  521. package/dist/types/components/skip-nav/component.d.ts +5 -5
  522. package/dist/types/components.d.ts +28 -22
  523. package/dist/types/index.d.ts +1 -1
  524. package/dist/types/types/button-link-text.d.ts +32 -0
  525. package/dist/types/types/button-link.d.ts +6 -5
  526. package/dist/types/types/icon.d.ts +2 -1
  527. package/dist/types/types/props/label.d.ts +5 -0
  528. package/dist/types/utils/a11y.tipps.d.ts +1 -0
  529. package/dist/types/utils/prop.validators.d.ts +1 -1
  530. package/doc/badge.md +1 -1
  531. package/doc/breadcrumb.md +4 -4
  532. package/doc/components.md +3 -3
  533. package/doc/icon-icofont.md +1 -1
  534. package/doc/input-color.md +1 -1
  535. package/doc/input-date.md +1 -1
  536. package/doc/input-email.md +1 -1
  537. package/doc/input-file.md +1 -1
  538. package/doc/input-number.md +1 -1
  539. package/doc/input-password.md +1 -1
  540. package/doc/input-text.md +1 -1
  541. package/doc/link-button.md +1 -1
  542. package/doc/link-group.md +1 -1
  543. package/doc/link.md +1 -1
  544. package/doc/nav.md +19 -15
  545. package/doc/skip-nav.md +4 -4
  546. package/doc/tabs.md +1 -1
  547. package/jest-test-results.json +1 -1
  548. package/package.json +1 -1
  549. package/vscode-custom-data.json +3 -3
  550. package/dist/cjs/a11y.tipps-8f94ed90.js +0 -4
  551. package/dist/cjs/a11y.tipps-8f94ed90.js.map +0 -1
  552. package/dist/cjs/button-link-824cc1bc.js.map +0 -1
  553. package/dist/cjs/controller-58da8827.js +0 -4
  554. package/dist/cjs/controller-58da8827.js.map +0 -1
  555. package/dist/cjs/controller-icon-795c30fb.js.map +0 -1
  556. package/dist/cjs/icon-31fdd6ee.js.map +0 -1
  557. package/dist/cjs/label-18346064.js +0 -4
  558. package/dist/cjs/prop.validators-90a0e362.js +0 -4
  559. package/dist/cjs/prop.validators-90a0e362.js.map +0 -1
  560. package/dist/cjs/validation-1298c9ca.js.map +0 -1
  561. package/dist/esm/a11y.tipps-e0a65f3c.js +0 -4
  562. package/dist/esm/a11y.tipps-e0a65f3c.js.map +0 -1
  563. package/dist/esm/button-link-e424d11b.js.map +0 -1
  564. package/dist/esm/controller-fe7060bc.js +0 -4
  565. package/dist/esm/controller-fe7060bc.js.map +0 -1
  566. package/dist/esm/controller-icon-4bce436b.js.map +0 -1
  567. package/dist/esm/icon-a88dcc85.js.map +0 -1
  568. package/dist/esm/prop.validators-daa14517.js +0 -4
  569. package/dist/esm/prop.validators-daa14517.js.map +0 -1
  570. package/dist/esm/validation-8f8d53e5.js +0 -4
  571. package/dist/esm/validation-8f8d53e5.js.map +0 -1
  572. package/dist/esm/validation-ce72d9b3.js +0 -4
  573. package/dist/kolibri/a11y.tipps-e0a65f3c.js +0 -4
  574. package/dist/kolibri/a11y.tipps-e0a65f3c.js.map +0 -1
  575. package/dist/kolibri/app-globals-2f4ec88e.js +0 -4
  576. package/dist/kolibri/button-link-e424d11b.js +0 -4
  577. package/dist/kolibri/button-link-e424d11b.js.map +0 -1
  578. package/dist/kolibri/controller-ea973815.js +0 -4
  579. package/dist/kolibri/controller-fe7060bc.js.map +0 -1
  580. package/dist/kolibri/icon-a88dcc85.js.map +0 -1
  581. package/dist/kolibri/prop.validators-daa14517.js.map +0 -1
  582. package/dist/kolibri/tab-index-dc6e8ba5.js +0 -4
  583. package/dist/kolibri/validation-8f8d53e5.js +0 -4
  584. package/dist/kolibri/validation-8f8d53e5.js.map +0 -1
  585. /package/dist/kolibri/{app-globals-2f4ec88e.js.map → app-globals-08fd5e4e.js.map} +0 -0
  586. /package/dist/kolibri/{controller-2397b4c5.js.map → controller-03e00b6c.js.map} +0 -0
  587. /package/dist/kolibri/{controller-c1692f88.js.map → controller-08af836c.js.map} +0 -0
  588. /package/dist/kolibri/{controller-6ba588d9.js.map → controller-4f4582b7.js.map} +0 -0
  589. /package/dist/kolibri/{controller-ea973815.js.map → controller-ac44fc5f.js.map} +0 -0
  590. /package/dist/kolibri/{controller-0b6f277d.js.map → controller-ca954299.js.map} +0 -0
  591. /package/dist/kolibri/{devtools-657e1cb8.js.map → devtools-525ee939.js.map} +0 -0
  592. /package/dist/kolibri/{i18n-bc1e0dfd.js.map → i18n-97355570.js.map} +0 -0
  593. /package/dist/kolibri/{label-f8bdc301.js.map → label-966377c0.js.map} +0 -0
  594. /package/dist/kolibri/{validation-ce72d9b3.js.map → validation-b0614edd.js.map} +0 -0
@@ -1,4 +1,4 @@
1
1
  /*!
2
2
  * KoliBri - The accessible HTML-Standard
3
3
  */
4
- import{r as registerInstance,h,H as Host}from"./index-50adf9a0.js";import{d as devHint,b as a11yHintLabelingLandmarks}from"./a11y.tipps-e0a65f3c.js";import{a as watchValidator,w as watchString,b as watchBoolean}from"./prop.validators-daa14517.js";import{w as watchNavLinks}from"./validation-8f8d53e5.js";import{a as translate}from"./i18n-bc1e0dfd.js";import"./dev.utils-bedce29d.js";import"./reuse-56bb5a4b.js";import"./index-81bd9b41.js";import"./index-f3c76945.js";const defaultStyleCss=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']),input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],option,select,textarea{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button,input,option,select,textarea{cursor:pointer;font-family:inherit;font-size:inherit}.icon-only>kol-span-wc>span>span{display:none}:host>div{display:inline-block}",UNIQUE_ARIA_LABEL=[],removeAriaLabel=t=>{const a=UNIQUE_ARIA_LABEL.indexOf(t);a>=0&&UNIQUE_ARIA_LABEL.splice(a,1)},KolNav=class{constructor(t){registerInstance(this,t),this.onClick=t=>{t._active=!1===t._active,this.state=Object.assign({},this.state)},this.hasActiveChild=t=>!!(Array.isArray(t._children)&&t._children.length>0)&&t._children.some(this.hasActiveChild),this.linkList=t=>h("ul",{class:{flex:0===t.deep&&"horizontal"===this.state._orientation},part:`nav ${this.state._orientation}`},t.links.map(((a,i)=>h("li",{key:i,part:`li ${0===t.deep?this.state._orientation:"vertical"}${a._active?" selected":""}${i<t.links.length-1?"":" last"}`},Array.isArray(a._children)&&a._children.length>0?h("div",{class:"h-full"},h("div",{class:{"h-full":!0}},h("kol-link-wc",{class:"block w-full h-full",exportparts:"icon,link,span"+(!0===a._active?",selected":""),_ariaLabel:!0===this.state._compact||!0===a._iconOnly?a._label:void 0,_ariaExpanded:!0===a._active,_disabled:a._disabled,_href:"javascript:void(0)",_icon:!0===this.state._collapsible?!0===a._active?"codicon codicon-remove":"codicon codicon-add":"string"==typeof a._icon?a._icon:"codicon codicon-symbol-event",_iconOnly:!0===this.state._compact||!0===a._iconOnly,_label:a._label,onClick:()=>this.onClick(a)})),!0===a._active&&h("div",{class:{expanded:!0,active:!0===a._active,"active-child":this.hasActiveChild(a),"absolute ":0===t.deep&&"horizontal"===this.state._orientation}},h(this.linkList,{links:a._children,deep:t.deep+1}))):h("div",{class:{"h-full":!0,"text-center":!0===this.state._compact||!0===a._iconOnly}},h("kol-link-wc",{class:{"block w-full h-full":!0,active:!0===a._active},exportparts:"icon,link,span"+(!0===a._active?",selected":""),_ariaCurrent:!0===a._active&&this.state._ariaCurrentValue,_ariaLabel:!0===this.state._compact||!0===a._iconOnly?a._label:void 0,_href:a._href,_icon:"string"==typeof a._icon?a._icon:"codicon codicon-symbol-event","_icon-only":!0===this.state._compact||!0===a._iconOnly,_label:a._label,_on:a._on,_selector:a._selector,_tooltipAlign:a._tooltipAlign,_target:a._target})))))),this._ariaCurrentValue=!1,this._ariaLabel=void 0,this._collapsible=!1,this._compact=!1,this._hasCompactButton=!1,this._orientation="vertical",this._links=void 0,this._variant="primary",this.state={_ariaCurrentValue:!1,_ariaLabel:"…",_collapsible:!0,_hasCompactButton:!1,_links:[],_orientation:"vertical",_variant:"primary"}}render(){let t=this.state._hasCompactButton;return"horizontal"===this.state._orientation&&!0===this.state._hasCompactButton&&(t=!1,devHint("[KolNav] Wenn eine horizontale Navigation verwendet wird, kann die Option _hasCompactButton nicht aktiviert werden.")),h(Host,null,h("div",{class:{[this.state._orientation]:!0,"inline-block":!0===this.state._compact,[this.state._variant]:!0}},h("nav",{"aria-label":this.state._ariaLabel,id:"nav",part:"nav"},h(this.linkList,{links:this.state._links,deep:0})),t&&h("div",{class:"mt-2 w-full text-center"},h("kol-button",{exportparts:"button,ghost",_ariaControls:"nav",_ariaExpanded:!0===this.state._compact,_ariaLabel:translate(this.state._compact?"kol-nav-maximize":"kol-nav-minimize"),_icon:this.state._compact?"codicon codicon-chevron-right":"codicon codicon-chevron-left",_iconOnly:!0,_label:translate(this.state._compact?"kol-nav-maximize":"kol-nav-minimize"),_on:{onClick:()=>{this.state=Object.assign(Object.assign({},this.state),{_compact:!1===this.state._compact})}},_tooltipAlign:"right",_variant:"ghost"}))))}validateAriaCurrentValue(t){watchValidator(this,"_ariaCurrentValue",(t=>!0===t||"date"===t||"location"===t||"page"===t||"step"===t||"time"===t),new Set(["boolean","String {data, location, page, step, time}"]),t)}validateAriaLabel(t){watchString(this,"_ariaLabel",t,{hooks:{afterPatch:()=>{UNIQUE_ARIA_LABEL.includes(this.state._ariaLabel)&&devHint(`[KolNav] Das Aria-Label "${this.state._ariaLabel}" wurde für die Rolle Navigation mehrfach verwendet!`),UNIQUE_ARIA_LABEL.push(this.state._ariaLabel)},beforePatch:()=>{removeAriaLabel(this.state._ariaLabel)}},required:!0}),a11yHintLabelingLandmarks(t)}validateCollapsible(t){watchBoolean(this,"_collapsible",t)}validateCompact(t){watchBoolean(this,"_compact",t)}validateHasCompactButton(t){watchBoolean(this,"_hasCompactButton",t)}validateLinks(t){watchNavLinks("KolNav",this,t),devHint("[KolNav] Die Navigationsstruktur wird noch nicht rekursiv validiert.")}validateOrientation(t){watchValidator(this,"_orientation",(t=>"horizontal"===t||"vertical"===t),new Set(["Orientation {horizontal, vertical}"]),t,{defaultValue:"vertical"})}validateVariant(t){watchValidator(this,"_variant",(t=>"primary"===t||"secondary"===t),new Set(["KoliBriNavVariant {primary, secondary}"]),t,{defaultValue:"primary"})}componentWillLoad(){this.validateAriaCurrentValue(this._ariaCurrentValue),this.validateAriaLabel(this._ariaLabel),this.validateCollapsible(this._collapsible),this.validateCompact(this._compact),this.validateHasCompactButton(this._hasCompactButton),this.validateLinks(this._links),this.validateOrientation(this._orientation),this.validateVariant(this._variant)}disconnectedCallback(){removeAriaLabel(this.state._ariaLabel)}static get watchers(){return{_ariaCurrentValue:["validateAriaCurrentValue"],_ariaLabel:["validateAriaLabel"],_collapsible:["validateCollapsible"],_compact:["validateCompact"],_hasCompactButton:["validateHasCompactButton"],_links:["validateLinks"],_orientation:["validateOrientation"],_variant:["validateVariant"]}}};KolNav.style={default:defaultStyleCss};export{KolNav as kol_nav};
4
+ import{r as registerInstance,h,H as Host}from"./index-50adf9a0.js";import{a as translate}from"./i18n-97355570.js";import{g as devWarning,b as a11yHintLabelingLandmarks,d as devHint}from"./a11y.tipps-5ca36877.js";import{a as watchValidator,w as watchString,b as watchBoolean}from"./prop.validators-1f3db013.js";import{w as watchNavLinks}from"./validation-2bb481bd.js";import"./index-f3c76945.js";import"./index-81bd9b41.js";import"./dev.utils-bedce29d.js";import"./reuse-56bb5a4b.js";const defaultStyleCss=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']),input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],option,select,textarea{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button,input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],option,select{cursor:pointer;font-family:inherit;font-size:inherit}.icon-only>kol-span-wc>span>span{display:none}.list-container.absolute{position:absolute;inset:100% 0 auto 0}.list{display:flex;list-style:none;margin:0px;padding:0px}.list.vertical{flex-direction:column}.entry,.entry>kol-button-wc>button{height:100%}.entry.has-children{display:flex;justify-content:space-between}.entry kol-link-wc{flex-grow:1}.expand-button{display:grid;place-content:center}",UNIQUE_ARIA_LABEL=[],removeAriaLabel=t=>{const a=UNIQUE_ARIA_LABEL.indexOf(t);a>=0&&UNIQUE_ARIA_LABEL.splice(a,1)},KolNav=class{constructor(t){registerInstance(this,t),this.onClick=t=>{t._active=!t._active,this.state=Object.assign({},this.state)},this.hasActiveChild=t=>!!(Array.isArray(t._children)&&t._children.length>0)&&t._children.some(this.hasActiveChild),this.linkList=t=>h("ul",{class:"list "+(0===t.deep&&"horizontal"===t.orientation?" horizontal":" vertical"),"data-deep":t.deep,part:`nav ${t.orientation}`},t.links.map(((a,i)=>this.li(t.collapsible,t.compact,t.deep,i,i<t.links.length-1,a,t.orientation)))),this._ariaCurrentValue=!1,this._ariaLabel=void 0,this._collapsible=!0,this._compact=!1,this._hasCompactButton=!1,this._orientation="vertical",this._links=void 0,this._variant="primary",this.state={_ariaCurrentValue:!1,_ariaLabel:"",_collapsible:!0,_hasCompactButton:!1,_links:[],_orientation:"vertical",_variant:"primary"}}button(t,a,i,e,n,l){return h("kol-button-wc",{exportparts:"icon,button,span"+(t?",selected":""),_ariaExpanded:t,_disabled:i,_icon:e,_iconOnly:a,_label:n,_on:l})}text(t,a,i){return h("kol-span-wc",{_icon:a,_iconOnly:t,_label:i})}dropDown(t,a,i,e,n){return h("div",{class:{"list-container":!0,"active-child":this.hasActiveChild(e),"absolute ":0===i&&"horizontal"===n}},h(this.linkList,{collapsible:t,compact:a,deep:i+1,links:e._children,orientation:n}))}entry(t,a,i,e,n,l,o){return h("div",{class:{entry:!0,"has-children":i,selected:l,expanded:n,"text-center":o}},this.buttonOrLinkOrText(a,e,l),i?this.expandButton(t,e,l):"")}expandButton(t,a,i){return h("kol-button-wc",{class:"expand-button",_disabled:!t,_icon:"codicon codicon-"+(i?"remove":"add"),_iconOnly:!0,_label:`Untermenü zu ${a._label} ${i?"schließen":"öffnen"}`,_on:{onClick:()=>this.onClick(a)}})}li(t,a,i,e,n,l,o){const s=Array.isArray(l._children)&&l._children.length>0,r=!!l._active,c=s&&!!l._active,d=a;return h("li",{class:{expanded:c,selected:r,"has-children":s},key:e,part:`li ${0===i?o:"vertical"}${c?" expanded":""}${r?" selected":""}${n?"":" last"}`,style:{position:"relative"}},this.entry(t,a,s,l,c,r,d),s&&r?this.dropDown(t,a,i,l,o):"")}link(t,a,i,e,n){return h("kol-link-wc",{exportparts:"icon,link,span"+(t?",selected":""),_ariaExpanded:t,_href:i,_icon:e,_iconOnly:a,_label:n})}buttonOrLinkOrText(t,a,i){return a._on?this.button(i,t,!0===a._disabled,a._icon,a._label,a._on):a._href?this.link(i,t,a._href,a._icon,a._label):this.text(t,a._icon,a._label)}render(){let t=this.state._hasCompactButton;"horizontal"===this.state._orientation&&!0===this.state._hasCompactButton&&(t=!1,devWarning("[KolNav] Wenn eine horizontale Navigation verwendet wird, kann die Option _hasCompactButton nicht aktiviert werden."));const a=this.state._collapsible,i=!0===this.state._compact,e=this.state._orientation;return h(Host,null,h("div",{class:{[e]:!0,"inline-block":i,[this.state._variant]:!0}},h("nav",{"aria-label":this.state._ariaLabel,id:"nav",part:"nav"},h(this.linkList,{collapsible:a,compact:i,deep:0,links:this.state._links,orientation:e})),t&&h("div",{class:"mt-2 w-full text-center"},h("kol-button",{exportparts:"button,ghost",_ariaControls:"nav",_ariaExpanded:i,_ariaLabel:translate(i?"kol-nav-maximize":"kol-nav-minimize"),_icon:i?"codicon codicon-chevron-right":"codicon codicon-chevron-left",_iconOnly:!0,_label:translate(i?"kol-nav-maximize":"kol-nav-minimize"),_on:{onClick:()=>{this.state=Object.assign(Object.assign({},this.state),{_compact:!1===this.state._compact})}},_tooltipAlign:"right",_variant:"ghost"}))))}validateAriaCurrentValue(t){watchValidator(this,"_ariaCurrentValue",(t=>!0===t||"date"===t||"location"===t||"page"===t||"step"===t||"time"===t),new Set(["boolean","String {data, location, page, step, time}"]),t)}validateAriaLabel(t){watchString(this,"_ariaLabel",t,{hooks:{afterPatch:()=>{UNIQUE_ARIA_LABEL.includes(this.state._ariaLabel)&&devHint(`[KolNav] Das Aria-Label "${this.state._ariaLabel}" wurde für die Rolle Navigation mehrfach verwendet!`),UNIQUE_ARIA_LABEL.push(this.state._ariaLabel)},beforePatch:()=>{removeAriaLabel(this.state._ariaLabel)}},required:!0}),a11yHintLabelingLandmarks(t)}validateCollapsible(t){watchBoolean(this,"_collapsible",t)}validateCompact(t){watchBoolean(this,"_compact",t)}validateHasCompactButton(t){watchBoolean(this,"_hasCompactButton",t)}validateLinks(t){watchNavLinks("KolNav",this,t),devHint("[KolNav] Die Navigationsstruktur wird noch nicht rekursiv validiert.")}validateOrientation(t){watchValidator(this,"_orientation",(t=>"horizontal"===t||"vertical"===t),new Set(["Orientation {horizontal, vertical}"]),t,{defaultValue:"vertical"})}validateVariant(t){watchValidator(this,"_variant",(t=>"primary"===t||"secondary"===t),new Set(["KoliBriNavVariant {primary, secondary}"]),t,{defaultValue:"primary"})}componentWillLoad(){this.validateAriaCurrentValue(this._ariaCurrentValue),this.validateAriaLabel(this._ariaLabel),this.validateCollapsible(this._collapsible),this.validateCompact(this._compact),this.validateHasCompactButton(this._hasCompactButton),this.validateLinks(this._links),this.validateOrientation(this._orientation),this.validateVariant(this._variant)}disconnectedCallback(){removeAriaLabel(this.state._ariaLabel)}static get watchers(){return{_ariaCurrentValue:["validateAriaCurrentValue"],_ariaLabel:["validateAriaLabel"],_collapsible:["validateCollapsible"],_compact:["validateCompact"],_hasCompactButton:["validateHasCompactButton"],_links:["validateLinks"],_orientation:["validateOrientation"],_variant:["validateVariant"]}}};KolNav.style={default:defaultStyleCss};export{KolNav as kol_nav};
@@ -1 +1 @@
1
- {"file":"kol-nav.entry.js","mappings":"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","names":[],"sources":["./src/components/nav/style.css?tag=kol-nav&mode=default&encapsulation=shadow","./src/components/nav/component.tsx"],"sourcesContent":["@import '../style.css';\n\n:host > div {\n\tdisplay: inline-block;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { Generic } from '@a11y-ui/core';\nimport { Orientation } from '../../types/orientation';\nimport { a11yHintLabelingLandmarks, devHint } from '../../utils/a11y.tipps';\nimport { watchBoolean, watchString, watchValidator } from '../../utils/prop.validators';\nimport { NavLinkProps } from '../link/component';\nimport { watchNavLinks } from './validation';\nimport { Stringified } from '../../types/common';\nimport { AriaCurrent } from '../../types/button-link';\nimport { translate } from '../../i18n';\n\nexport type NavLinkWithChildrenProps = NavLinkProps & {\n\t_children?: NavLinkWithChildrenProps[];\n};\n\nexport type KoliBriNavVariant = 'primary' | 'secondary';\n\nconst UNIQUE_ARIA_LABEL: string[] = [];\nconst removeAriaLabel = (ariaLabel: string) => {\n\tconst index = UNIQUE_ARIA_LABEL.indexOf(ariaLabel);\n\tif (index >= 0) {\n\t\tUNIQUE_ARIA_LABEL.splice(index, 1);\n\t}\n};\n\nconst linkValidator = (link: NavLinkWithChildrenProps): boolean => {\n\tif (typeof link === 'object' && typeof link._label === 'string' /* && typeof newLink._href === 'string' */) {\n\t\tif (Array.isArray(link._children)) {\n\t\t\treturn linksValidator(link._children);\n\t\t}\n\t\treturn false;\n\t}\n\treturn true;\n};\n\nconst linksValidator = (links: NavLinkWithChildrenProps[]): boolean => {\n\tif (Array.isArray(links)) {\n\t\treturn links.find(linkValidator) !== undefined;\n\t}\n\treturn true;\n};\n\n/**\n * API\n */\ntype RequiredProps = {\n\tariaLabel: string;\n\tlinks: Stringified<NavLinkWithChildrenProps[]>;\n};\ntype OptionalProps = {\n\tariaCurrentValue: AriaCurrent;\n\tcollapsible: boolean;\n\tcompact: boolean;\n\thasCompactButton: boolean;\n\torientation: Orientation;\n\tvariant: KoliBriNavVariant;\n};\n// type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = {\n\tariaCurrentValue: AriaCurrent;\n\tariaLabel: string;\n\tcollapsible: boolean;\n\thasCompactButton: boolean;\n\tlinks: NavLinkWithChildrenProps[];\n\torientation: Orientation;\n\tvariant: KoliBriNavVariant;\n};\ntype OptionalStates = {\n\tcompact: boolean;\n};\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n/**\n * @part nav - TBD\n */\n@Component({\n\ttag: 'kol-nav',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolNav implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate readonly onClick = (link: NavLinkWithChildrenProps): void => {\n\t\tlink._active = link._active === false;\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t};\n\t};\n\n\tprivate readonly hasActiveChild = (link: NavLinkWithChildrenProps): boolean => {\n\t\tif (Array.isArray(link._children) && link._children.length > 0) {\n\t\t\treturn link._children.some(this.hasActiveChild);\n\t\t}\n\n\t\treturn false;\n\t};\n\n\tprivate linkList = (props: { links: NavLinkWithChildrenProps[]; deep: number }): JSX.Element => {\n\t\treturn (\n\t\t\t<ul\n\t\t\t\tclass={{\n\t\t\t\t\tflex: props.deep === 0 && this.state._orientation === 'horizontal',\n\t\t\t\t}}\n\t\t\t\tpart={`nav ${this.state._orientation}`}\n\t\t\t>\n\t\t\t\t{props.links.map((link, index: number) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<li\n\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\tpart={`li ${props.deep === 0 ? this.state._orientation : 'vertical'}${link._active ? ' selected' : ''}${\n\t\t\t\t\t\t\t\tindex < props.links.length - 1 ? '' : ' last'\n\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{Array.isArray(link._children) && link._children.length > 0 ? (\n\t\t\t\t\t\t\t\t<div class=\"h-full\">\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t'h-full': true,\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<kol-link-wc\n\t\t\t\t\t\t\t\t\t\t\tclass=\"block w-full h-full\"\n\t\t\t\t\t\t\t\t\t\t\texportparts={`icon,link,span${link._active === true ? ',selected' : ''}`}\n\t\t\t\t\t\t\t\t\t\t\t// _ariaCurrent will not be set here, since it will be set on a child of this item.\n\t\t\t\t\t\t\t\t\t\t\t_ariaLabel={this.state._compact === true || link._iconOnly === true ? link._label : undefined}\n\t\t\t\t\t\t\t\t\t\t\t_ariaExpanded={link._active === true}\n\t\t\t\t\t\t\t\t\t\t\t_disabled={link._disabled}\n\t\t\t\t\t\t\t\t\t\t\t_href=\"javascript:void(0)\"\n\t\t\t\t\t\t\t\t\t\t\t_icon={\n\t\t\t\t\t\t\t\t\t\t\t\tthis.state._collapsible === true\n\t\t\t\t\t\t\t\t\t\t\t\t\t? link._active === true\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'codicon codicon-remove'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 'codicon codicon-add'\n\t\t\t\t\t\t\t\t\t\t\t\t\t: typeof link._icon === 'string'\n\t\t\t\t\t\t\t\t\t\t\t\t\t? link._icon\n\t\t\t\t\t\t\t\t\t\t\t\t\t: 'codicon codicon-symbol-event'\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t_iconOnly={this.state._compact === true || link._iconOnly === true}\n\t\t\t\t\t\t\t\t\t\t\t_label={link._label}\n\t\t\t\t\t\t\t\t\t\t\tonClick={() => this.onClick(link)}\n\t\t\t\t\t\t\t\t\t\t></kol-link-wc>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t{link._active === true && (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\texpanded: true,\n\t\t\t\t\t\t\t\t\t\t\t\tactive: link._active === true,\n\t\t\t\t\t\t\t\t\t\t\t\t'active-child': this.hasActiveChild(link),\n\t\t\t\t\t\t\t\t\t\t\t\t'absolute ': props.deep === 0 && this.state._orientation === 'horizontal',\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<this.linkList links={link._children} deep={props.deep + 1} />\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t'h-full': true,\n\t\t\t\t\t\t\t\t\t\t'text-center': this.state._compact === true || link._iconOnly === true,\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<kol-link-wc\n\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t'block w-full h-full': true,\n\t\t\t\t\t\t\t\t\t\t\tactive: link._active === true,\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\texportparts={`icon,link,span${link._active === true ? ',selected' : ''}`}\n\t\t\t\t\t\t\t\t\t\t_ariaCurrent={link._active === true ? this.state._ariaCurrentValue : false}\n\t\t\t\t\t\t\t\t\t\t_ariaLabel={this.state._compact === true || link._iconOnly === true ? link._label : undefined}\n\t\t\t\t\t\t\t\t\t\t_href={link._href}\n\t\t\t\t\t\t\t\t\t\t_icon={typeof link._icon === 'string' ? link._icon : 'codicon codicon-symbol-event'}\n\t\t\t\t\t\t\t\t\t\t_icon-only={this.state._compact === true || link._iconOnly === true}\n\t\t\t\t\t\t\t\t\t\t_label={link._label}\n\t\t\t\t\t\t\t\t\t\t_on={link._on}\n\t\t\t\t\t\t\t\t\t\t_selector={link._selector}\n\t\t\t\t\t\t\t\t\t\t_tooltipAlign={link._tooltipAlign}\n\t\t\t\t\t\t\t\t\t\t_target={link._target}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</li>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</ul>\n\t\t);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tlet hasCompactButton = this.state._hasCompactButton;\n\t\tif (this.state._orientation === 'horizontal' && this.state._hasCompactButton === true) {\n\t\t\thasCompactButton = false;\n\t\t\tdevHint(`[KolNav] Wenn eine horizontale Navigation verwendet wird, kann die Option _hasCompactButton nicht aktiviert werden.`);\n\t\t}\n\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[this.state._orientation]: true,\n\t\t\t\t\t\t'inline-block': this.state._compact === true,\n\t\t\t\t\t\t[this.state._variant]: true,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<nav aria-label={this.state._ariaLabel} id=\"nav\" part=\"nav\">\n\t\t\t\t\t\t<this.linkList links={this.state._links} deep={0}></this.linkList>\n\t\t\t\t\t</nav>\n\t\t\t\t\t{hasCompactButton && (\n\t\t\t\t\t\t<div class=\"mt-2 w-full text-center\">\n\t\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t\texportparts=\"button,ghost\"\n\t\t\t\t\t\t\t\t_ariaControls=\"nav\"\n\t\t\t\t\t\t\t\t_ariaExpanded={this.state._compact === true}\n\t\t\t\t\t\t\t\t_ariaLabel={translate(this.state._compact ? 'kol-nav-maximize' : 'kol-nav-minimize')}\n\t\t\t\t\t\t\t\t_icon={this.state._compact ? 'codicon codicon-chevron-right' : 'codicon codicon-chevron-left'}\n\t\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t\t_label={translate(this.state._compact ? 'kol-nav-maximize' : 'kol-nav-minimize')}\n\t\t\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\t\t\tonClick: (): void => {\n\t\t\t\t\t\t\t\t\t\tthis.state = {\n\t\t\t\t\t\t\t\t\t\t\t...this.state,\n\t\t\t\t\t\t\t\t\t\t\t_compact: this.state._compact === false,\n\t\t\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t_tooltipAlign=\"right\"\n\t\t\t\t\t\t\t\t_variant=\"ghost\"\n\t\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt den Wert von aria-current an, der bei dem aktuellen Kontext innerhalb der Navigation verwendet werden soll.\n\t */\n\t@Prop() public _ariaCurrentValue: AriaCurrent = false;\n\n\t/**\n\t * Gibt den Text an, der die Navigation von anderen Navigationen differenziert.\n\t */\n\t@Prop() public _ariaLabel!: string;\n\n\t/**\n\t * Gibt an, ob Knoten in der Navigation zusammengeklappt werden können. Ist standardmäßig aktiv.\n\t */\n\t@Prop({ reflect: true }) public _collapsible?: boolean = false;\n\n\t/**\n\t * Gibt an, ob die Navigation kompakt angezeigt wird.\n\t */\n\t@Prop({ reflect: true }) public _compact?: boolean = false;\n\n\t/**\n\t * Gibt an, ob die Navigation eine zusätzliche Schaltfläche zum Aus- und Einklappen der Navigation anzeigen soll.\n\t */\n\t@Prop({ reflect: true }) public _hasCompactButton?: boolean = false;\n\n\t/**\n\t * Gibt die Ausrichtung der Navigation an.\n\t */\n\t@Prop() public _orientation?: Orientation = 'vertical';\n\n\t/**\n\t * Gibt die geordnete Liste der Seitenhierarchie an.\n\t */\n\t@Prop() public _links!: Stringified<NavLinkWithChildrenProps[]>;\n\n\t/**\n\t * Gibt an, welche Ausprägung der Button hat.\n\t */\n\t@Prop() public _variant?: KoliBriNavVariant = 'primary';\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_ariaCurrentValue: false,\n\t\t_ariaLabel: '…', // '⚠'\n\t\t_collapsible: true,\n\t\t_hasCompactButton: false,\n\t\t_links: [],\n\t\t_orientation: 'vertical',\n\t\t_variant: 'primary',\n\t};\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_ariaCurrentValue')\n\tpublic validateAriaCurrentValue(value?: AriaCurrent): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_ariaCurrentValue',\n\t\t\t(value) => value === true || value === 'date' || value === 'location' || value === 'page' || value === 'step' || value === 'time',\n\t\t\tnew Set(['boolean', 'String {data, location, page, step, time}']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_ariaLabel')\n\tpublic validateAriaLabel(value?: string): void {\n\t\twatchString(this, '_ariaLabel', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: () => {\n\t\t\t\t\tif (UNIQUE_ARIA_LABEL.includes(this.state._ariaLabel)) {\n\t\t\t\t\t\tdevHint(`[KolNav] Das Aria-Label \"${this.state._ariaLabel}\" wurde für die Rolle Navigation mehrfach verwendet!`);\n\t\t\t\t\t}\n\t\t\t\t\tUNIQUE_ARIA_LABEL.push(this.state._ariaLabel);\n\t\t\t\t},\n\t\t\t\tbeforePatch: () => {\n\t\t\t\t\tremoveAriaLabel(this.state._ariaLabel);\n\t\t\t\t},\n\t\t\t},\n\t\t\trequired: true,\n\t\t});\n\t\ta11yHintLabelingLandmarks(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_collapsible')\n\tpublic validateCollapsible(value?: boolean): void {\n\t\twatchBoolean(this, '_collapsible', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_compact')\n\tpublic validateCompact(value?: boolean): void {\n\t\twatchBoolean(this, '_compact', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hasCompactButton')\n\tpublic validateHasCompactButton(value?: boolean): void {\n\t\twatchBoolean(this, '_hasCompactButton', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_links')\n\tpublic validateLinks(value?: Stringified<NavLinkWithChildrenProps[]>): void {\n\t\twatchNavLinks('KolNav', this, value);\n\t\tdevHint(`[KolNav] Die Navigationsstruktur wird noch nicht rekursiv validiert.`);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_orientation')\n\tpublic validateOrientation(value?: Orientation): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_orientation',\n\t\t\t(value): boolean => value === 'horizontal' || value === 'vertical',\n\t\t\tnew Set(['Orientation {horizontal, vertical}']),\n\t\t\tvalue,\n\t\t\t{\n\t\t\t\tdefaultValue: 'vertical',\n\t\t\t}\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_variant')\n\tpublic validateVariant(value?: KoliBriNavVariant): void {\n\t\twatchValidator(this, '_variant', (value) => value === 'primary' || value === 'secondary', new Set(['KoliBriNavVariant {primary, secondary}']), value, {\n\t\t\tdefaultValue: 'primary',\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAriaCurrentValue(this._ariaCurrentValue);\n\t\tthis.validateAriaLabel(this._ariaLabel);\n\t\tthis.validateCollapsible(this._collapsible);\n\t\tthis.validateCompact(this._compact);\n\t\tthis.validateHasCompactButton(this._hasCompactButton);\n\t\tthis.validateLinks(this._links);\n\t\tthis.validateOrientation(this._orientation);\n\t\tthis.validateVariant(this._variant);\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tremoveAriaLabel(this.state._ariaLabel);\n\t}\n}\n\n// console.log(\n// stringifyJson([\n// { _label: '1 Navigationspunkt', _href: '#abc', _icon: 'codicon codicon-folder-closed', _target: 'asdasd' },\n// { _label: '2 Navigationspunkt', _href: '#abc', _icon: 'codicon codicon-folder-closed' },\n// {\n// _active: true,\n// _label: '3 Navigationspunkt',\n// _href: '#abc',\n// _icon: 'codicon codicon-folder-closed',\n// _children: [\n// { _label: '3.1 Navigationspunkt', _href: '#abc', _icon: 'codicon codicon-folder-closed' },\n// { _label: '3.2 Navigationspunkt', _href: '#abc', _icon: 'codicon codicon-folder-closed', _target: 'asdasd' },\n// {\n// _active: true,\n// _label: '3.3 Navigationspunkt',\n// _href: '#abc',\n// _children: [\n// { _active: true, _label: '3.3.1 Navigationspunkt (aktiv)', _href: '#abc' },\n// { _label: '3.3.2 Navigationspunkt', _href: '#abc' },\n// ],\n// },\n// {\n// _label: '3.4 Navigationspunkt',\n// _href: '#abc',\n// _children: [\n// { _label: '3.4.1 Navigationspunkt', _href: '#abc' },\n// { _label: '3.4.2 Navigationspunkt', _href: '#abc' },\n// ],\n// },\n// { _label: '3.5 Navigationspunkt', _href: '#abc' },\n// ],\n// },\n// { _label: '4 Navigationspunkt', _href: '#abc' },\n// ])\n// );\n"],"version":3}
1
+ {"file":"kol-nav.entry.js","mappings":"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","names":[],"sources":["./src/components/nav/style.css?tag=kol-nav&mode=default&encapsulation=shadow","./src/components/nav/component.tsx"],"sourcesContent":["@import '../style.css';\n\n.list-container.absolute {\n\tposition: absolute;\n\tinset: 100% 0 auto 0;\n}\n.list {\n\tdisplay: flex;\n\t/** ul reset um das erwartete Verhalten zu erzeugen */\n\tlist-style: none;\n\tmargin: 0px;\n\tpadding: 0px;\n}\n.list.vertical {\n\tflex-direction: column;\n}\n\n.entry,\n.entry > kol-button-wc > button {\n\theight: 100%;\n}\n.entry.has-children {\n\tdisplay: flex;\n\tjustify-content: space-between;\n}\n\n.entry kol-link-wc {\n\tflex-grow: 1;\n}\n\n.expand-button {\n\tdisplay: grid;\n\tplace-content: center;\n}\n","import { Generic } from '@a11y-ui/core';\nimport { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { translate } from '../../i18n';\nimport { AriaCurrent, KoliBriButtonCallbacks } from '../../types/button-link';\nimport { ButtonOrLinkOrTextWithChildrenProps, ButtonWithChildrenProps, LinkWithChildrenProps } from '../../types/button-link-text';\nimport { Stringified } from '../../types/common';\nimport { KoliBriIconProp } from '../../types/icon';\nimport { Orientation } from '../../types/orientation';\nimport { a11yHintLabelingLandmarks, devHint, devWarning } from '../../utils/a11y.tipps';\nimport { watchBoolean, watchString, watchValidator } from '../../utils/prop.validators';\nimport { watchNavLinks } from './validation';\n\n/**\n * @deprecated\n */\nexport type KoliBriNavVariant = 'primary' | 'secondary';\n\nconst UNIQUE_ARIA_LABEL: string[] = [];\nconst removeAriaLabel = (ariaLabel: string) => {\n\tconst index = UNIQUE_ARIA_LABEL.indexOf(ariaLabel);\n\tif (index >= 0) {\n\t\tUNIQUE_ARIA_LABEL.splice(index, 1);\n\t}\n};\n\nconst linkValidator = (link: ButtonOrLinkOrTextWithChildrenProps): boolean => {\n\tif (typeof link === 'object' && typeof link._label === 'string' /* && typeof newLink._href === 'string' */) {\n\t\tif (Array.isArray(link._children)) {\n\t\t\treturn linksValidator(link._children);\n\t\t}\n\t\treturn false;\n\t}\n\treturn true;\n};\n\nconst linksValidator = (links: ButtonOrLinkOrTextWithChildrenProps[]): boolean => {\n\tif (Array.isArray(links)) {\n\t\treturn links.find(linkValidator) !== undefined;\n\t}\n\treturn true;\n};\n\n/**\n * API\n */\ntype RequiredProps = {\n\tariaLabel: string;\n\tlinks: Stringified<ButtonOrLinkOrTextWithChildrenProps[]>;\n};\ntype OptionalProps = {\n\tariaCurrentValue: AriaCurrent;\n\tcollapsible: boolean;\n\tcompact: boolean;\n\thasCompactButton: boolean;\n\torientation: Orientation;\n\t/**\n\t * @deprecated\n\t */\n\tvariant: KoliBriNavVariant;\n};\n// type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = {\n\tariaCurrentValue: AriaCurrent;\n\tariaLabel: string;\n\tcollapsible: boolean;\n\thasCompactButton: boolean;\n\tlinks: ButtonOrLinkOrTextWithChildrenProps[];\n\torientation: Orientation;\n\t/**\n\t * @deprecated\n\t */\n\tvariant: KoliBriNavVariant;\n};\ntype OptionalStates = {\n\tcompact: boolean;\n};\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n/**\n * @part nav - TBD\n */\n@Component({\n\ttag: 'kol-nav',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolNav implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate readonly onClick = (link: ButtonOrLinkOrTextWithChildrenProps): void => {\n\t\tlink._active = !link._active;\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t};\n\t};\n\n\tprivate readonly hasActiveChild = (link: ButtonOrLinkOrTextWithChildrenProps): boolean => {\n\t\tif (Array.isArray(link._children) && link._children.length > 0) {\n\t\t\treturn link._children.some(this.hasActiveChild);\n\t\t}\n\n\t\treturn false;\n\t};\n\n\t/** Element creation functions */\n\tprivate button(\n\t\tselected: boolean,\n\t\tcompact: boolean,\n\t\tdisabled: boolean,\n\t\ticon: Stringified<KoliBriIconProp> | undefined,\n\t\tlabel: string,\n\t\ton: KoliBriButtonCallbacks<unknown>\n\t): JSX.Element {\n\t\treturn (\n\t\t\t<kol-button-wc\n\t\t\t\texportparts={`icon,button,span${selected ? ',selected' : ''}`}\n\t\t\t\t// _ariaCurrent will not be set here, since it will be set on a child of this item.\n\t\t\t\t_ariaExpanded={selected}\n\t\t\t\t_disabled={disabled}\n\t\t\t\t_icon={icon}\n\t\t\t\t_iconOnly={compact}\n\t\t\t\t_label={label}\n\t\t\t\t_on={on}\n\t\t\t></kol-button-wc>\n\t\t);\n\t}\n\n\tprivate text(compact: boolean, icon: Stringified<KoliBriIconProp> | undefined, label: string): JSX.Element {\n\t\treturn <kol-span-wc _icon={icon} _iconOnly={compact} _label={label}></kol-span-wc>;\n\t}\n\n\tprivate dropDown(collapsible: boolean, compact: boolean, deep: number, link: ButtonOrLinkOrTextWithChildrenProps, orientation: Orientation): JSX.Element {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={{\n\t\t\t\t\t'list-container': true,\n\t\t\t\t\t'active-child': this.hasActiveChild(link),\n\t\t\t\t\t'absolute ': deep === 0 && orientation === 'horizontal',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{/* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */}\n\t\t\t\t<this.linkList collapsible={collapsible} compact={compact} deep={deep + 1} links={link._children!} orientation={orientation} />\n\t\t\t</div>\n\t\t);\n\t}\n\n\tprivate entry(\n\t\tcollapsible: boolean,\n\t\tcompact: boolean,\n\t\thasChildren: boolean,\n\t\tlink: ButtonOrLinkOrTextWithChildrenProps,\n\t\texpanded: boolean,\n\t\tselected: boolean,\n\t\ttextCenter: boolean\n\t): JSX.Element {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={{\n\t\t\t\t\tentry: true,\n\t\t\t\t\t'has-children': hasChildren,\n\t\t\t\t\tselected,\n\t\t\t\t\texpanded,\n\t\t\t\t\t'text-center': textCenter,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{this.buttonOrLinkOrText(compact, link, selected)}\n\t\t\t\t{hasChildren ? this.expandButton(collapsible, link, selected) : ''}\n\t\t\t</div>\n\t\t);\n\t}\n\n\tprivate expandButton(collapsible: boolean, link: ButtonOrLinkOrTextWithChildrenProps, selected: boolean): JSX.Element {\n\t\treturn (\n\t\t\t<kol-button-wc\n\t\t\t\tclass=\"expand-button\"\n\t\t\t\t_disabled={!collapsible}\n\t\t\t\t_icon={'codicon codicon-' + (selected ? 'remove' : 'add')}\n\t\t\t\t_iconOnly\n\t\t\t\t_label={`Untermenü zu ${link._label} ${selected ? 'schließen' : 'öffnen'}`}\n\t\t\t\t_on={{ onClick: () => this.onClick(link) }}\n\t\t\t></kol-button-wc>\n\t\t);\n\t}\n\n\tprivate li(\n\t\tcollapsible: boolean,\n\t\tcompact: boolean,\n\t\tdeep: number,\n\t\tindex: number,\n\t\tisLast: boolean,\n\t\tlink: ButtonOrLinkOrTextWithChildrenProps,\n\t\torientation: Orientation\n\t): JSX.Element {\n\t\tconst hasChildren = Array.isArray(link._children) && link._children.length > 0;\n\t\tconst selected = !!link._active;\n\t\tconst expanded = hasChildren && !!link._active;\n\t\tconst textCenter = compact;\n\t\treturn (\n\t\t\t<li\n\t\t\t\tclass={{ expanded, selected, 'has-children': hasChildren }}\n\t\t\t\tkey={index}\n\t\t\t\tpart={`li ${deep === 0 ? orientation : 'vertical'}${expanded ? ' expanded' : ''}${selected ? ' selected' : ''}${isLast ? '' : ' last'}`}\n\t\t\t\tstyle={{ position: 'relative' }}\n\t\t\t>\n\t\t\t\t{this.entry(collapsible, compact, hasChildren, link, expanded, selected, textCenter)}\n\t\t\t\t{hasChildren && selected ? this.dropDown(collapsible, compact, deep, link, orientation) : ''}\n\t\t\t</li>\n\t\t);\n\t}\n\n\tprivate link(selected: boolean, compact: boolean, href: string, icon: Stringified<KoliBriIconProp> | undefined, label: string): JSX.Element {\n\t\treturn (\n\t\t\t<kol-link-wc\n\t\t\t\texportparts={`icon,link,span${selected ? ',selected' : ''}`}\n\t\t\t\t// _ariaCurrent will not be set here, since it will be set on a child of this item.\n\t\t\t\t_ariaExpanded={selected}\n\t\t\t\t_href={href}\n\t\t\t\t_icon={icon}\n\t\t\t\t_iconOnly={compact}\n\t\t\t\t_label={label}\n\t\t\t></kol-link-wc>\n\t\t);\n\t}\n\n\tprivate linkList = (props: {\n\t\tcollapsible: boolean;\n\t\tcompact: boolean;\n\t\tdeep: number;\n\t\tlinks: ButtonOrLinkOrTextWithChildrenProps[];\n\t\torientation: Orientation;\n\t}): JSX.Element => {\n\t\treturn (\n\t\t\t<ul\n\t\t\t\tclass={`list ${props.deep === 0 && props.orientation === 'horizontal' ? ' horizontal' : ' vertical'}`}\n\t\t\t\tdata-deep={props.deep}\n\t\t\t\tpart={`nav ${props.orientation}`}\n\t\t\t>\n\t\t\t\t{props.links.map((link, index: number) => {\n\t\t\t\t\treturn this.li(props.collapsible, props.compact, props.deep, index, index < props.links.length - 1, link, props.orientation);\n\t\t\t\t})}\n\t\t\t</ul>\n\t\t);\n\t};\n\n\tprivate buttonOrLinkOrText(compact: boolean, link: ButtonOrLinkOrTextWithChildrenProps, selected: boolean): JSX.Element {\n\t\tif ((link as ButtonWithChildrenProps)._on) {\n\t\t\treturn this.button(\n\t\t\t\tselected,\n\t\t\t\tcompact,\n\t\t\t\t(link as ButtonWithChildrenProps)._disabled === true,\n\t\t\t\tlink._icon,\n\t\t\t\tlink._label,\n\t\t\t\t(link as ButtonWithChildrenProps)._on\n\t\t\t);\n\t\t} else if ((link as LinkWithChildrenProps)._href) {\n\t\t\treturn this.link(selected, compact, (link as LinkWithChildrenProps)._href, link._icon, link._label);\n\t\t} else {\n\t\t\treturn this.text(compact, link._icon, link._label);\n\t\t}\n\t}\n\n\tpublic render(): JSX.Element {\n\t\tlet hasCompactButton = this.state._hasCompactButton;\n\t\tif (this.state._orientation === 'horizontal' && this.state._hasCompactButton === true) {\n\t\t\thasCompactButton = false;\n\t\t\tdevWarning(`[KolNav] Wenn eine horizontale Navigation verwendet wird, kann die Option _hasCompactButton nicht aktiviert werden.`);\n\t\t}\n\t\tconst collapsible = this.state._collapsible;\n\t\tconst compact = this.state._compact === true;\n\t\tconst orientation = this.state._orientation;\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[orientation]: true,\n\t\t\t\t\t\t'inline-block': compact,\n\t\t\t\t\t\t[this.state._variant]: true,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<nav aria-label={this.state._ariaLabel} id=\"nav\" part=\"nav\">\n\t\t\t\t\t\t<this.linkList collapsible={collapsible} compact={compact} deep={0} links={this.state._links} orientation={orientation}></this.linkList>\n\t\t\t\t\t</nav>\n\t\t\t\t\t{hasCompactButton && (\n\t\t\t\t\t\t<div class=\"mt-2 w-full text-center\">\n\t\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t\texportparts=\"button,ghost\"\n\t\t\t\t\t\t\t\t_ariaControls=\"nav\"\n\t\t\t\t\t\t\t\t_ariaExpanded={compact}\n\t\t\t\t\t\t\t\t_ariaLabel={translate(compact ? 'kol-nav-maximize' : 'kol-nav-minimize')}\n\t\t\t\t\t\t\t\t_icon={compact ? 'codicon codicon-chevron-right' : 'codicon codicon-chevron-left'}\n\t\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t\t_label={translate(compact ? 'kol-nav-maximize' : 'kol-nav-minimize')}\n\t\t\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\t\t\tonClick: (): void => {\n\t\t\t\t\t\t\t\t\t\tthis.state = {\n\t\t\t\t\t\t\t\t\t\t\t...this.state,\n\t\t\t\t\t\t\t\t\t\t\t_compact: this.state._compact === false,\n\t\t\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t_tooltipAlign=\"right\"\n\t\t\t\t\t\t\t\t_variant=\"ghost\"\n\t\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt den Wert von aria-current an, der bei dem aktuellen Kontext innerhalb der Navigation verwendet werden soll.\n\t */\n\t@Prop() public _ariaCurrentValue: AriaCurrent = false;\n\n\t/**\n\t * Gibt den Text an, der die Navigation von anderen Navigationen differenziert.\n\t */\n\t@Prop() public _ariaLabel!: string;\n\n\t/**\n\t * Gibt an, ob Knoten in der Navigation zusammengeklappt werden können. Ist standardmäßig aktiv.\n\t */\n\t@Prop({ reflect: true }) public _collapsible?: boolean = true;\n\n\t/**\n\t * Gibt an, ob die Navigation kompakt angezeigt wird.\n\t */\n\t@Prop({ reflect: true }) public _compact?: boolean = false;\n\n\t/**\n\t * Gibt an, ob die Navigation eine zusätzliche Schaltfläche zum Aus- und Einklappen der Navigation anzeigen soll.\n\t */\n\t@Prop({ reflect: true }) public _hasCompactButton?: boolean = false;\n\n\t/**\n\t * Gibt die Ausrichtung der Navigation an.\n\t */\n\t@Prop() public _orientation?: Orientation = 'vertical';\n\n\t/**\n\t * Gibt die geordnete Liste der Seitenhierarchie an.\n\t */\n\t@Prop() public _links!: Stringified<ButtonOrLinkOrTextWithChildrenProps[]>;\n\n\t/**\n\t * Gibt an, welche Ausprägung der Button hat.\n\t *\n\t * @deprecated This property is deprecated and will be removed in the next major version.\n\t */\n\t@Prop() public _variant?: KoliBriNavVariant = 'primary';\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_ariaCurrentValue: false,\n\t\t_ariaLabel: '…', // '⚠'\n\t\t_collapsible: true,\n\t\t_hasCompactButton: false,\n\t\t_links: [],\n\t\t_orientation: 'vertical',\n\t\t_variant: 'primary',\n\t};\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_ariaCurrentValue')\n\tpublic validateAriaCurrentValue(value?: AriaCurrent): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_ariaCurrentValue',\n\t\t\t(value) => value === true || value === 'date' || value === 'location' || value === 'page' || value === 'step' || value === 'time',\n\t\t\tnew Set(['boolean', 'String {data, location, page, step, time}']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_ariaLabel')\n\tpublic validateAriaLabel(value?: string): void {\n\t\twatchString(this, '_ariaLabel', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: () => {\n\t\t\t\t\tif (UNIQUE_ARIA_LABEL.includes(this.state._ariaLabel)) {\n\t\t\t\t\t\tdevHint(`[KolNav] Das Aria-Label \"${this.state._ariaLabel}\" wurde für die Rolle Navigation mehrfach verwendet!`);\n\t\t\t\t\t}\n\t\t\t\t\tUNIQUE_ARIA_LABEL.push(this.state._ariaLabel);\n\t\t\t\t},\n\t\t\t\tbeforePatch: () => {\n\t\t\t\t\tremoveAriaLabel(this.state._ariaLabel);\n\t\t\t\t},\n\t\t\t},\n\t\t\trequired: true,\n\t\t});\n\t\ta11yHintLabelingLandmarks(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_collapsible')\n\tpublic validateCollapsible(value?: boolean): void {\n\t\twatchBoolean(this, '_collapsible', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_compact')\n\tpublic validateCompact(value?: boolean): void {\n\t\twatchBoolean(this, '_compact', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hasCompactButton')\n\tpublic validateHasCompactButton(value?: boolean): void {\n\t\twatchBoolean(this, '_hasCompactButton', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_links')\n\tpublic validateLinks(value?: Stringified<ButtonOrLinkOrTextWithChildrenProps[]>): void {\n\t\twatchNavLinks('KolNav', this, value);\n\t\tdevHint(`[KolNav] Die Navigationsstruktur wird noch nicht rekursiv validiert.`);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_orientation')\n\tpublic validateOrientation(value?: Orientation): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_orientation',\n\t\t\t(value): boolean => value === 'horizontal' || value === 'vertical',\n\t\t\tnew Set(['Orientation {horizontal, vertical}']),\n\t\t\tvalue,\n\t\t\t{\n\t\t\t\tdefaultValue: 'vertical',\n\t\t\t}\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_variant')\n\tpublic validateVariant(value?: KoliBriNavVariant): void {\n\t\twatchValidator(this, '_variant', (value) => value === 'primary' || value === 'secondary', new Set(['KoliBriNavVariant {primary, secondary}']), value, {\n\t\t\tdefaultValue: 'primary',\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAriaCurrentValue(this._ariaCurrentValue);\n\t\tthis.validateAriaLabel(this._ariaLabel);\n\t\tthis.validateCollapsible(this._collapsible);\n\t\tthis.validateCompact(this._compact);\n\t\tthis.validateHasCompactButton(this._hasCompactButton);\n\t\tthis.validateLinks(this._links);\n\t\tthis.validateOrientation(this._orientation);\n\t\tthis.validateVariant(this._variant);\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tremoveAriaLabel(this.state._ariaLabel);\n\t}\n}\n"],"version":3}
@@ -1,4 +1,4 @@
1
1
  /*!
2
2
  * KoliBri - The accessible HTML-Standard
3
3
  */
4
- import{r as registerInstance,h,H as Host}from"./index-50adf9a0.js";import{w as watchTooltipAlignment}from"./button-link-e424d11b.js";import{n as nonce}from"./dev.utils-bedce29d.js";import{e as watchNumber,w as watchString,a as watchValidator,d as watchJsonArrayString,p as parseJson}from"./prop.validators-daa14517.js";import{w as watchButtonVariant}from"./controller-ea973815.js";import{S as STATE_CHANGE_EVENT}from"./reuse-56bb5a4b.js";import{a as translate}from"./i18n-bc1e0dfd.js";import"./a11y.tipps-e0a65f3c.js";import"./index-81bd9b41.js";import"./index-f3c76945.js";const defaultStyleCss=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']),input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],option,select,textarea{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button,input,option,select,textarea{cursor:pointer;font-family:inherit;font-size:inherit}.icon-only>kol-span-wc>span>span{display:none}",leftDoubleArrowIcon={left:"codicon codicon-debug-reverse-continue"},leftSingleArrow={left:"codicon codicon-chevron-left"},rightSingleArrowIcon={right:"codicon codicon-chevron-right"},rightDoubleArrowIcon={right:"codicon codicon-debug-continue"},KolPagination=class{constructor(t){registerInstance(this,t),this.nonce=nonce(),this.calcCount=(t,e=1)=>Math.ceil(t/e),this.getCount=()=>this.calcCount(this.state._total,this.state._pageSize),this.onClick=(t,e)=>{"function"==typeof this.state._on.onClick&&this.state._on.onClick(t,e),this.onChangePage(t,e)},this.onChangePage=(t,e)=>{const a=setTimeout((()=>{clearTimeout(a),"function"==typeof this.state._on.onChangePage&&this.state._on.onChangePage(t,e)}))},this.onChangePageSize=(t,e)=>{if("number"==typeof(e=parseInt(e[0]))&&e>0&&this._pageSize!==e){this._pageSize=e;const a=setTimeout((()=>{clearTimeout(a),"function"==typeof this.state._on.onChangePageSize&&this.state._on.onChangePageSize(t,this._pageSize)}))}},this.onGoToFirst={onClick:t=>{this.onClick(t,1)}},this.onGoToEnd={onClick:t=>{this.onClick(t,this.getCount())}},this.onGoBackward={onClick:t=>{this.onClick(t,this.state._page-1)}},this.onGoForward={onClick:t=>{this.onClick(t,this.state._page+1)}},this.beforePageSize=(t,e)=>{let a=e.has("_pageSize")?e.get("_pageSize"):this.state._pageSize;const i=e.has("_pageSizeOptions")?e.get("_pageSizeOptions"):this.state._pageSizeOptions;if(Array.isArray(i)&&i.length>0){const t=i.find((t=>t.value===a));a=void 0===t?i[0].value:t.value,e.set("_pageSize",a)}const s=e.has("_page")?e.get("_page"):this.state._page,o=e.has("_total")?e.get("_total"):this.state._total;this.syncPage(e,s,e.get("_pageSize"),o)},this.syncPage=(t,e,a,i)=>{if(i>0){const s=this.calcCount(i,a);s>0&&(e>s?(t.set("_page",s),this.onChangePage(STATE_CHANGE_EVENT,s)):e<1&&(t.set("_page",1),this.onChangePage(STATE_CHANGE_EVENT,1)))}},this.beforePageSizeOptions=(t,e)=>{const a=[];if(Array.isArray(t))for(const e of t)"number"==typeof e&&a.push({label:translate("kol-page-per-site",{placeholders:{entries:`${e}`}}),value:e});e.set("_pageSizeOptions",a),this.beforePageSize(a,e)},this._boundaryCount=1,this._customClass=void 0,this._hasButtons=void 0,this._page=void 0,this._pageSize=1,this._pageSizeOptions=[],this._on=void 0,this._siblingCount=1,this._tooltipAlign="top",this._total=void 0,this._variant="normal",this.state={_boundaryCount:1,_hasButtons:{first:!0,last:!0,next:!0,previous:!0},_on:{onClick:()=>null},_page:0,_pageSize:1,_pageSizeOptions:[],_siblingCount:1,_total:0,_variant:"normal"}}render(){var t;let e=!1;const a=this.getCount(),i=Array.from(Array(a).keys()).map((t=>t+1)).map((t=>t<=this.state._boundaryCount||t>a-this.state._boundaryCount||t>=this.state._page-this.state._siblingCount&&t<=this.state._page+this.state._siblingCount?(e=!0,this.state._page===t?this.getSelectedPageButton(t):this.getUnselectedPageButton(t)):!0===e?(e=!1,h("span",{key:`${this.nonce}-el-${t}`},"•••")):null));return h(Host,null,h("div",null,this.state._hasButtons.first&&h("kol-button",{_customClass:this.state._customClass,_disabled:this.state._page<=1,_icon:leftDoubleArrowIcon,_iconOnly:!0,_label:translate("kol-page-first"),_on:this.onGoToFirst,_variant:this.state._variant,_tooltipAlign:this.state._tooltipAlign}),this.state._hasButtons.previous&&h("kol-button",{_customClass:this.state._customClass,_disabled:this.state._page<=1,_icon:leftSingleArrow,_iconOnly:!0,_label:translate("kol-page-back"),_on:this.onGoBackward,_variant:this.state._variant,_tooltipAlign:this.state._tooltipAlign}),i,this.state._hasButtons.next&&h("kol-button",{_customClass:this.state._customClass,_disabled:a<=this.state._page,_icon:rightSingleArrowIcon,_iconOnly:!0,_label:translate("kol-page-next"),_on:this.onGoForward,_variant:this.state._variant,_tooltipAlign:this.state._tooltipAlign}),this.state._hasButtons.last&&h("kol-button",{_customClass:this.state._customClass,_disabled:a<=this.state._page,_icon:rightDoubleArrowIcon,_iconOnly:!0,_label:translate("kol-page-last"),_on:this.onGoToEnd,_variant:this.state._variant,_tooltipAlign:this.state._tooltipAlign})),(null===(t=this.state._pageSizeOptions)||void 0===t?void 0:t.length)>0&&h("kol-select",{_hideLabel:!0,_id:"pagination-size",_list:this.state._pageSizeOptions,_on:{onChange:this.onChangePageSize},_value:[this.state._pageSize]},translate("kol-entries-per-site")))}getUnselectedPageButton(t){return h("kol-button",{key:`${this.nonce}-${t}`,_customClass:this.state._customClass,_ariaLabel:translate("kol-page-current",{placeholders:{page:t.toFixed(0)}}),_label:`${t}`,_on:{onClick:e=>{this.onClick(e,t)}},_variant:this.state._variant})}getSelectedPageButton(t){return h("kol-button-wc",{class:"selected",key:`${this.nonce}-selected`,_customClass:this.state._customClass,_disabled:!0,_ariaCurrent:!0,_ariaLabel:translate("kol-page-selected",{placeholders:{page:t.toFixed(0)}}),_label:`${t}`,_variant:this.state._variant})}validateBoundaryCount(t){watchNumber(this,"_boundaryCount",Math.max(0,null!=t?t:1))}validateCustomClass(t){watchString(this,"_customClass",t,{defaultValue:void 0})}validateHasButtons(t){watchValidator(this,"_hasButtons",(t=>"boolean"==typeof t||"string"==typeof t||"object"==typeof t&&null!==t),new Set(["Boolean","PaginationHasButton"]),t,{hooks:{beforePatch:(t,e)=>{if("boolean"==typeof t)e.set("_hasButtons",{first:t,last:t,next:t,previous:t});else{if("string"==typeof t)try{t=parseJson(t)}catch(t){e.delete("_hasButtons")}"object"==typeof t&&null!==t&&e.set("_hasButtons",Object.assign(Object.assign({},this.state._hasButtons),{first:"boolean"==typeof t.first?!0===t.first:this.state._hasButtons.first,last:"boolean"==typeof t.last?!0===t.last:this.state._hasButtons.last,next:"boolean"==typeof t.next?!0===t.next:this.state._hasButtons.next,previous:"boolean"==typeof t.previous?!0===t.previous:this.state._hasButtons.previous}))}}}})}validateOn(t){"object"==typeof t&&null!==t&&(this.state=Object.assign(Object.assign({},this.state),{_on:t}))}validatePage(t){watchNumber(this,"_page",t,{hooks:{beforePatch:(t,e)=>{const a=e.has("_pageSize")?e.get("_pageSize"):this.state._pageSize,i=e.has("_total")?e.get("_total"):this.state._total;this.syncPage(e,t,a,i)}}})}validatePageSize(t){watchNumber(this,"_pageSize",t,{hooks:{beforePatch:this.beforePageSize}})}validatePageSizeOptions(t){watchJsonArrayString(this,"_pageSizeOptions",(t=>"number"==typeof t),t,void 0,{hooks:{beforePatch:this.beforePageSizeOptions}})}validateSiblingCount(t){watchNumber(this,"_siblingCount",Math.max(0,null!=t?t:1))}validateTotal(t){watchNumber(this,"_total",t,{hooks:{beforePatch:(t,e)=>{const a=e.has("_page")?e.get("_page"):this.state._page,i=e.has("_pageSize")?e.get("_pageSize"):this.state._pageSize;this.syncPage(e,a,i,t)}}})}validateTooltipAlign(t){watchTooltipAlignment(this,"_tooltipAlign",t)}validateVariant(t){watchButtonVariant(this,"_variant",t)}componentWillLoad(){this.validateBoundaryCount(this._boundaryCount),this.validateCustomClass(this._customClass),this.validateHasButtons(this._hasButtons),this.validateOn(this._on),this.validatePage(this._page),this.validatePageSize(this._pageSize),this.validatePageSizeOptions(this._pageSizeOptions),this.validateSiblingCount(this._siblingCount),this.validateTooltipAlign(this._tooltipAlign),this.validateTotal(this._total),this.validateVariant(this._variant),this.validatePage(this._page)}static get watchers(){return{_boundaryCount:["validateBoundaryCount"],_customClass:["validateCustomClass"],_hasButtons:["validateHasButtons"],_on:["validateOn"],_page:["validatePage"],_pageSize:["validatePageSize"],_pageSizeOptions:["validatePageSizeOptions"],_siblingCount:["validateSiblingCount"],_total:["validateTotal"],_tooltipAlign:["validateTooltipAlign"],_variant:["validateVariant"]}}};KolPagination.style={default:defaultStyleCss};export{KolPagination as kol_pagination};
4
+ import{r as registerInstance,h,H as Host}from"./index-50adf9a0.js";import{w as watchTooltipAlignment}from"./button-link-249585bf.js";import{n as nonce}from"./dev.utils-bedce29d.js";import{e as watchNumber,w as watchString,a as watchValidator,d as watchJsonArrayString,p as parseJson}from"./prop.validators-1f3db013.js";import{w as watchButtonVariant}from"./controller-ac44fc5f.js";import{S as STATE_CHANGE_EVENT}from"./reuse-56bb5a4b.js";import{a as translate}from"./i18n-97355570.js";import"./a11y.tipps-5ca36877.js";import"./index-81bd9b41.js";import"./index-f3c76945.js";const defaultStyleCss=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']),input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],option,select,textarea{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button,input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],option,select{cursor:pointer;font-family:inherit;font-size:inherit}.icon-only>kol-span-wc>span>span{display:none}",leftDoubleArrowIcon={left:"codicon codicon-debug-reverse-continue"},leftSingleArrow={left:"codicon codicon-chevron-left"},rightSingleArrowIcon={right:"codicon codicon-chevron-right"},rightDoubleArrowIcon={right:"codicon codicon-debug-continue"},KolPagination=class{constructor(t){registerInstance(this,t),this.nonce=nonce(),this.calcCount=(t,e=1)=>Math.ceil(t/e),this.getCount=()=>this.calcCount(this.state._total,this.state._pageSize),this.onClick=(t,e)=>{"function"==typeof this.state._on.onClick&&this.state._on.onClick(t,e),this.onChangePage(t,e)},this.onChangePage=(t,e)=>{const a=setTimeout((()=>{clearTimeout(a),"function"==typeof this.state._on.onChangePage&&this.state._on.onChangePage(t,e)}))},this.onChangePageSize=(t,e)=>{if("number"==typeof(e=parseInt(e[0]))&&e>0&&this._pageSize!==e){this._pageSize=e;const a=setTimeout((()=>{clearTimeout(a),"function"==typeof this.state._on.onChangePageSize&&this.state._on.onChangePageSize(t,this._pageSize)}))}},this.onGoToFirst={onClick:t=>{this.onClick(t,1)}},this.onGoToEnd={onClick:t=>{this.onClick(t,this.getCount())}},this.onGoBackward={onClick:t=>{this.onClick(t,this.state._page-1)}},this.onGoForward={onClick:t=>{this.onClick(t,this.state._page+1)}},this.beforePageSize=(t,e)=>{let a=e.has("_pageSize")?e.get("_pageSize"):this.state._pageSize;const i=e.has("_pageSizeOptions")?e.get("_pageSizeOptions"):this.state._pageSizeOptions;if(Array.isArray(i)&&i.length>0){const t=i.find((t=>t.value===a));a=void 0===t?i[0].value:t.value,e.set("_pageSize",a)}const s=e.has("_page")?e.get("_page"):this.state._page,o=e.has("_total")?e.get("_total"):this.state._total;this.syncPage(e,s,e.get("_pageSize"),o)},this.syncPage=(t,e,a,i)=>{if(i>0){const s=this.calcCount(i,a);s>0&&(e>s?(t.set("_page",s),this.onChangePage(STATE_CHANGE_EVENT,s)):e<1&&(t.set("_page",1),this.onChangePage(STATE_CHANGE_EVENT,1)))}},this.beforePageSizeOptions=(t,e)=>{const a=[];if(Array.isArray(t))for(const e of t)"number"==typeof e&&a.push({label:translate("kol-page-per-site",{placeholders:{entries:`${e}`}}),value:e});e.set("_pageSizeOptions",a),this.beforePageSize(a,e)},this._boundaryCount=1,this._customClass=void 0,this._hasButtons=void 0,this._page=void 0,this._pageSize=1,this._pageSizeOptions=[],this._on=void 0,this._siblingCount=1,this._tooltipAlign="top",this._total=void 0,this._variant="normal",this.state={_boundaryCount:1,_hasButtons:{first:!0,last:!0,next:!0,previous:!0},_on:{onClick:()=>null},_page:0,_pageSize:1,_pageSizeOptions:[],_siblingCount:1,_total:0,_variant:"normal"}}render(){var t;let e=!1;const a=this.getCount(),i=Array.from(Array(a).keys()).map((t=>t+1)).map((t=>t<=this.state._boundaryCount||t>a-this.state._boundaryCount||t>=this.state._page-this.state._siblingCount&&t<=this.state._page+this.state._siblingCount?(e=!0,this.state._page===t?this.getSelectedPageButton(t):this.getUnselectedPageButton(t)):!0===e?(e=!1,h("span",{key:`${this.nonce}-el-${t}`},"•••")):null));return h(Host,null,h("div",null,this.state._hasButtons.first&&h("kol-button",{_customClass:this.state._customClass,_disabled:this.state._page<=1,_icon:leftDoubleArrowIcon,_iconOnly:!0,_label:translate("kol-page-first"),_on:this.onGoToFirst,_variant:this.state._variant,_tooltipAlign:this.state._tooltipAlign}),this.state._hasButtons.previous&&h("kol-button",{_customClass:this.state._customClass,_disabled:this.state._page<=1,_icon:leftSingleArrow,_iconOnly:!0,_label:translate("kol-page-back"),_on:this.onGoBackward,_variant:this.state._variant,_tooltipAlign:this.state._tooltipAlign}),i,this.state._hasButtons.next&&h("kol-button",{_customClass:this.state._customClass,_disabled:a<=this.state._page,_icon:rightSingleArrowIcon,_iconOnly:!0,_label:translate("kol-page-next"),_on:this.onGoForward,_variant:this.state._variant,_tooltipAlign:this.state._tooltipAlign}),this.state._hasButtons.last&&h("kol-button",{_customClass:this.state._customClass,_disabled:a<=this.state._page,_icon:rightDoubleArrowIcon,_iconOnly:!0,_label:translate("kol-page-last"),_on:this.onGoToEnd,_variant:this.state._variant,_tooltipAlign:this.state._tooltipAlign})),(null===(t=this.state._pageSizeOptions)||void 0===t?void 0:t.length)>0&&h("kol-select",{_hideLabel:!0,_id:"pagination-size",_list:this.state._pageSizeOptions,_on:{onChange:this.onChangePageSize},_value:[this.state._pageSize]},translate("kol-entries-per-site")))}getUnselectedPageButton(t){return h("kol-button",{key:`${this.nonce}-${t}`,_customClass:this.state._customClass,_ariaLabel:translate("kol-page-current",{placeholders:{page:t.toFixed(0)}}),_label:`${t}`,_on:{onClick:e=>{this.onClick(e,t)}},_variant:this.state._variant})}getSelectedPageButton(t){return h("kol-button-wc",{class:"selected",key:`${this.nonce}-selected`,_customClass:this.state._customClass,_disabled:!0,_ariaCurrent:!0,_ariaLabel:translate("kol-page-selected",{placeholders:{page:t.toFixed(0)}}),_label:`${t}`,_variant:this.state._variant})}validateBoundaryCount(t){watchNumber(this,"_boundaryCount",Math.max(0,null!=t?t:1))}validateCustomClass(t){watchString(this,"_customClass",t,{defaultValue:void 0})}validateHasButtons(t){watchValidator(this,"_hasButtons",(t=>"boolean"==typeof t||"string"==typeof t||"object"==typeof t&&null!==t),new Set(["Boolean","PaginationHasButton"]),t,{hooks:{beforePatch:(t,e)=>{if("boolean"==typeof t)e.set("_hasButtons",{first:t,last:t,next:t,previous:t});else{if("string"==typeof t)try{t=parseJson(t)}catch(t){e.delete("_hasButtons")}"object"==typeof t&&null!==t&&e.set("_hasButtons",Object.assign(Object.assign({},this.state._hasButtons),{first:"boolean"==typeof t.first?!0===t.first:this.state._hasButtons.first,last:"boolean"==typeof t.last?!0===t.last:this.state._hasButtons.last,next:"boolean"==typeof t.next?!0===t.next:this.state._hasButtons.next,previous:"boolean"==typeof t.previous?!0===t.previous:this.state._hasButtons.previous}))}}}})}validateOn(t){"object"==typeof t&&null!==t&&(this.state=Object.assign(Object.assign({},this.state),{_on:t}))}validatePage(t){watchNumber(this,"_page",t,{hooks:{beforePatch:(t,e)=>{const a=e.has("_pageSize")?e.get("_pageSize"):this.state._pageSize,i=e.has("_total")?e.get("_total"):this.state._total;this.syncPage(e,t,a,i)}}})}validatePageSize(t){watchNumber(this,"_pageSize",t,{hooks:{beforePatch:this.beforePageSize}})}validatePageSizeOptions(t){watchJsonArrayString(this,"_pageSizeOptions",(t=>"number"==typeof t),t,void 0,{hooks:{beforePatch:this.beforePageSizeOptions}})}validateSiblingCount(t){watchNumber(this,"_siblingCount",Math.max(0,null!=t?t:1))}validateTotal(t){watchNumber(this,"_total",t,{hooks:{beforePatch:(t,e)=>{const a=e.has("_page")?e.get("_page"):this.state._page,i=e.has("_pageSize")?e.get("_pageSize"):this.state._pageSize;this.syncPage(e,a,i,t)}}})}validateTooltipAlign(t){watchTooltipAlignment(this,"_tooltipAlign",t)}validateVariant(t){watchButtonVariant(this,"_variant",t)}componentWillLoad(){this.validateBoundaryCount(this._boundaryCount),this.validateCustomClass(this._customClass),this.validateHasButtons(this._hasButtons),this.validateOn(this._on),this.validatePage(this._page),this.validatePageSize(this._pageSize),this.validatePageSizeOptions(this._pageSizeOptions),this.validateSiblingCount(this._siblingCount),this.validateTooltipAlign(this._tooltipAlign),this.validateTotal(this._total),this.validateVariant(this._variant),this.validatePage(this._page)}static get watchers(){return{_boundaryCount:["validateBoundaryCount"],_customClass:["validateCustomClass"],_hasButtons:["validateHasButtons"],_on:["validateOn"],_page:["validatePage"],_pageSize:["validatePageSize"],_pageSizeOptions:["validatePageSizeOptions"],_siblingCount:["validateSiblingCount"],_total:["validateTotal"],_tooltipAlign:["validateTooltipAlign"],_variant:["validateVariant"]}}};KolPagination.style={default:defaultStyleCss};export{KolPagination as kol_pagination};
@@ -1 +1 @@
1
- {"file":"kol-pagination.entry.js","mappings":"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","names":[],"sources":["./src/components/pagination/style.css?tag=kol-pagination&mode=default&encapsulation=shadow","./src/components/pagination/component.tsx"],"sourcesContent":["@import '../style.css';\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { KoliBriButtonVariant, KoliBriButtonVariantPropState, KoliBriButtonCustomClassPropState, watchTooltipAlignment } from '../../types/button-link';\nimport { nonce } from '../../utils/dev.utils';\nimport { parseJson, watchJsonArrayString, watchNumber, watchString, watchValidator } from '../../utils/prop.validators';\nimport { watchButtonVariant } from '../button/controller';\nimport { Alignment } from '../../types/props/alignment';\nimport { KoliBriPaginationButtonCallbacks } from './types';\nimport { Stringified } from '../../types/common';\nimport { Option } from '../../types/input/types';\nimport { STATE_CHANGE_EVENT } from '../../utils/validator';\nimport { translate } from '../../i18n';\n\n/**\n * Der HasButton-Typ definiert die Einstellungsmöglichkeiten der speziellen\n * Sprung-Schalter der Pagination.\n */\nexport type PaginationHasButton = {\n\t/**\n\t * Der First-Button ist der Schalter, um direkt auf die erste Seite zu gelangen.\n\t */\n\tfirst: boolean;\n\t/**\n\t * Der Last-Button ist der Schalter, um direkt auf die letzte Seite zu gelangen.\n\t */\n\tlast: boolean;\n\t/**\n\t * Der Next-Button ist der Schalter, um direkt auf die nächste Seite zu gelangen.\n\t */\n\tnext: boolean;\n\t/**\n\t * Der Next-Button ist der Schalter, um direkt auf die vorherige Seite zu gelangen.\n\t */\n\tprevious: boolean;\n};\n\n/**\n * API\n */\nexport type RequiredProps = {\n\ton: KoliBriPaginationButtonCallbacks;\n\tpage: number;\n\ttotal: number;\n};\nexport type OptionalProps = KoliBriButtonCustomClassPropState &\n\tKoliBriButtonVariantPropState & {\n\t\tboundaryCount: number;\n\t\thasButtons: boolean | Stringified<PaginationHasButton>;\n\t\tpageSize: number;\n\t\tpageSizeOptions: Stringified<number[]>;\n\t\tsiblingCount: number;\n\t\ttooltipAlign: Alignment;\n\t};\n// export type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = KoliBriButtonVariantPropState & {\n\tboundaryCount: number;\n\thasButtons: PaginationHasButton;\n\tpage: number;\n\tpageSize: number;\n\tpageSizeOptions: Option<number>[];\n\ton: KoliBriPaginationButtonCallbacks;\n\tsiblingCount: number;\n\ttotal: number;\n};\ntype OptionalStates = KoliBriButtonCustomClassPropState & {\n\ttooltipAlign: Alignment;\n};\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\nconst leftDoubleArrowIcon = {\n\tleft: 'codicon codicon-debug-reverse-continue',\n};\nconst leftSingleArrow = {\n\tleft: 'codicon codicon-chevron-left',\n};\nconst rightSingleArrowIcon = {\n\tright: 'codicon codicon-chevron-right',\n};\nconst rightDoubleArrowIcon = {\n\tright: 'codicon codicon-debug-continue',\n};\n\n@Component({\n\ttag: 'kol-pagination',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolPagination implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate readonly nonce = nonce();\n\n\tprivate readonly calcCount = (total: number, pageSize = 1): number => Math.ceil(total / pageSize);\n\n\tprivate readonly getCount = (): number => this.calcCount(this.state._total, this.state._pageSize);\n\n\tpublic render(): JSX.Element {\n\t\tlet ellipsis = false;\n\t\tconst count = this.getCount();\n\t\tconst pageButtons = Array.from(Array(count).keys())\n\t\t\t.map((index: number) => index + 1)\n\t\t\t.map((page: number) => {\n\t\t\t\tif (\n\t\t\t\t\tpage <= this.state._boundaryCount ||\n\t\t\t\t\tpage > count - this.state._boundaryCount ||\n\t\t\t\t\t(page >= this.state._page - this.state._siblingCount && page <= this.state._page + this.state._siblingCount)\n\t\t\t\t) {\n\t\t\t\t\tellipsis = true;\n\t\t\t\t\tif (this.state._page === page) {\n\t\t\t\t\t\treturn this.getSelectedPageButton(page);\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn this.getUnselectedPageButton(page);\n\t\t\t\t\t}\n\t\t\t\t} else if (ellipsis === true) {\n\t\t\t\t\tellipsis = false;\n\t\t\t\t\treturn <span key={`${this.nonce}-el-${page}`}>•••</span>;\n\t\t\t\t} else {\n\t\t\t\t\treturn null;\n\t\t\t\t}\n\t\t\t});\n\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div>\n\t\t\t\t\t{this.state._hasButtons.first && (\n\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t_customClass={this.state._customClass}\n\t\t\t\t\t\t\t_disabled={this.state._page <= 1}\n\t\t\t\t\t\t\t_icon={leftDoubleArrowIcon}\n\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t_label={translate('kol-page-first')}\n\t\t\t\t\t\t\t_on={this.onGoToFirst}\n\t\t\t\t\t\t\t_variant={this.state._variant}\n\t\t\t\t\t\t\t_tooltipAlign={this.state._tooltipAlign}\n\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t)}\n\t\t\t\t\t{this.state._hasButtons.previous && (\n\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t_customClass={this.state._customClass}\n\t\t\t\t\t\t\t_disabled={this.state._page <= 1}\n\t\t\t\t\t\t\t_icon={leftSingleArrow}\n\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t_label={translate('kol-page-back')}\n\t\t\t\t\t\t\t_on={this.onGoBackward}\n\t\t\t\t\t\t\t_variant={this.state._variant}\n\t\t\t\t\t\t\t_tooltipAlign={this.state._tooltipAlign}\n\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t)}\n\t\t\t\t\t{pageButtons}\n\t\t\t\t\t{this.state._hasButtons.next && (\n\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t_customClass={this.state._customClass}\n\t\t\t\t\t\t\t_disabled={count <= this.state._page}\n\t\t\t\t\t\t\t_icon={rightSingleArrowIcon}\n\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t_label={translate('kol-page-next')}\n\t\t\t\t\t\t\t_on={this.onGoForward}\n\t\t\t\t\t\t\t_variant={this.state._variant}\n\t\t\t\t\t\t\t_tooltipAlign={this.state._tooltipAlign}\n\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t)}\n\t\t\t\t\t{this.state._hasButtons.last && (\n\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t_customClass={this.state._customClass}\n\t\t\t\t\t\t\t_disabled={count <= this.state._page}\n\t\t\t\t\t\t\t_icon={rightDoubleArrowIcon}\n\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t_label={translate('kol-page-last')}\n\t\t\t\t\t\t\t_on={this.onGoToEnd}\n\t\t\t\t\t\t\t_variant={this.state._variant}\n\t\t\t\t\t\t\t_tooltipAlign={this.state._tooltipAlign}\n\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t{this.state._pageSizeOptions?.length > 0 && (\n\t\t\t\t\t<kol-select\n\t\t\t\t\t\t_hideLabel\n\t\t\t\t\t\t_id=\"pagination-size\"\n\t\t\t\t\t\t_list={this.state._pageSizeOptions}\n\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\tonChange: this.onChangePageSize,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\t_value={[this.state._pageSize]}\n\t\t\t\t\t>\n\t\t\t\t\t\t{translate('kol-entries-per-site')}\n\t\t\t\t\t</kol-select>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, wie viele Seiten neben den am Rand liegenden Pfeil-Schaltern angezeigt werden sollen.\n\t */\n\t@Prop() public _boundaryCount?: number = 1;\n\n\t/**\n\t * Gibt an, welche Custom-Class übergeben werden soll, wenn _variant=\"custom\" gesetzt ist.\n\t */\n\t@Prop() public _customClass?: string;\n\n\t/**\n\t * Gibt an, welche Sprung-Schalter sichtbar sein sollen.\n\t */\n\t@Prop() public _hasButtons?: boolean | Stringified<PaginationHasButton>;\n\n\t/**\n\t * Gibt an, welche Seite aktuell ausgewählt ist.\n\t */\n\t@Prop() public _page!: number;\n\n\t/**\n\t * Gibt an, wie viele Einträge pro Seite angezeigt werden.\n\t */\n\t@Prop({ mutable: true, reflect: false }) public _pageSize = 1;\n\n\t/**\n\t * Gibt an, welche Optionen für die Seitenlänge angeboten werden.\n\t */\n\t@Prop() public _pageSizeOptions: Stringified<number[]> = [];\n\n\t/**\n\t * Gibt an, auf welche Callback-Events reagiert werden.\n\t */\n\t@Prop() public _on!: KoliBriPaginationButtonCallbacks;\n\n\t/**\n\t * Gibt an, wie viele Seiten neben dem aktuell ausgewählten Seite angezeigt werden.\n\t */\n\t@Prop() public _siblingCount?: number = 1;\n\n\t/**\n\t * Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden.\n\t */\n\t@Prop() public _tooltipAlign?: Alignment = 'top';\n\n\t/**\n\t * Gibt an, wie viele Einträge mit der Pagination gehandelt werden.\n\t */\n\t@Prop() public _total!: number;\n\n\t/**\n\t * Gibt an, welche Button-Variante verwendet werden soll.\n\t */\n\t@Prop() public _variant?: KoliBriButtonVariant = 'normal';\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_boundaryCount: 1,\n\t\t_hasButtons: {\n\t\t\tfirst: true,\n\t\t\tlast: true,\n\t\t\tnext: true,\n\t\t\tprevious: true,\n\t\t},\n\t\t_on: {\n\t\t\tonClick: () => null,\n\t\t},\n\t\t_page: 0,\n\t\t_pageSize: 1,\n\t\t_pageSizeOptions: [],\n\t\t_siblingCount: 1,\n\t\t_total: 0,\n\t\t_variant: 'normal',\n\t};\n\n\tprivate onClick = (event: Event, page: number) => {\n\t\tif (typeof this.state._on.onClick === 'function') {\n\t\t\tthis.state._on.onClick(event, page);\n\t\t}\n\t\tthis.onChangePage(event, page);\n\t};\n\n\tprivate onChangePage = (event: Event, page: number) => {\n\t\tconst timeout = setTimeout(() => {\n\t\t\tclearTimeout(timeout);\n\t\t\tif (typeof this.state._on.onChangePage === 'function') {\n\t\t\t\tthis.state._on.onChangePage(event, page);\n\t\t\t}\n\t\t});\n\t};\n\n\tprivate onChangePageSize = (event: Event, value: unknown) => {\n\t\tvalue = parseInt((value as string[])[0]);\n\t\tif (typeof value === 'number' && value > 0 && this._pageSize !== value) {\n\t\t\tthis._pageSize = value;\n\t\t\tconst timeout = setTimeout(() => {\n\t\t\t\tclearTimeout(timeout);\n\t\t\t\tif (typeof this.state._on.onChangePageSize === 'function') {\n\t\t\t\t\tthis.state._on.onChangePageSize(event, this._pageSize);\n\t\t\t\t}\n\t\t\t});\n\t\t}\n\t};\n\n\tprivate readonly onGoToFirst = {\n\t\tonClick: (event: Event) => {\n\t\t\tthis.onClick(event, 1);\n\t\t},\n\t};\n\tprivate readonly onGoToEnd = {\n\t\tonClick: (event: Event) => {\n\t\t\tthis.onClick(event, this.getCount());\n\t\t},\n\t};\n\tprivate readonly onGoBackward = {\n\t\tonClick: (event: Event) => {\n\t\t\tthis.onClick(event, this.state._page - 1);\n\t\t},\n\t};\n\tprivate readonly onGoForward = {\n\t\tonClick: (event: Event) => {\n\t\t\tthis.onClick(event, this.state._page + 1);\n\t\t},\n\t};\n\n\tprivate getUnselectedPageButton(page: number): JSX.Element {\n\t\treturn (\n\t\t\t<kol-button\n\t\t\t\tkey={`${this.nonce}-${page}`}\n\t\t\t\t_customClass={this.state._customClass}\n\t\t\t\t_ariaLabel={translate('kol-page-current', { placeholders: { page: page.toFixed(0) } })}\n\t\t\t\t_label={`${page}`}\n\t\t\t\t_on={{\n\t\t\t\t\tonClick: (event: Event) => {\n\t\t\t\t\t\tthis.onClick(event, page);\n\t\t\t\t\t},\n\t\t\t\t}}\n\t\t\t\t_variant={this.state._variant}\n\t\t\t></kol-button>\n\t\t);\n\t}\n\n\tprivate getSelectedPageButton(page: number): JSX.Element {\n\t\treturn (\n\t\t\t<kol-button-wc\n\t\t\t\tclass=\"selected\"\n\t\t\t\tkey={`${this.nonce}-selected`}\n\t\t\t\t_customClass={this.state._customClass}\n\t\t\t\t_disabled={true}\n\t\t\t\t_ariaCurrent={true}\n\t\t\t\t_ariaLabel={translate('kol-page-selected', { placeholders: { page: page.toFixed(0) } })}\n\t\t\t\t_label={`${page}`}\n\t\t\t\t_variant={this.state._variant}\n\t\t\t/>\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_boundaryCount')\n\tpublic validateBoundaryCount(value?: number): void {\n\t\twatchNumber(this, '_boundaryCount', Math.max(0, value ?? 1));\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_customClass')\n\tpublic validateCustomClass(value?: string): void {\n\t\twatchString(this, '_customClass', value, {\n\t\t\tdefaultValue: undefined,\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hasButtons')\n\tpublic validateHasButtons(value?: string | boolean | Stringified<PaginationHasButton>): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_hasButtons',\n\t\t\t(value) => typeof value === 'boolean' || typeof value === 'string' || (typeof value === 'object' && value !== null),\n\t\t\tnew Set(['Boolean', 'PaginationHasButton']),\n\t\t\tvalue,\n\t\t\t{\n\t\t\t\thooks: {\n\t\t\t\t\tbeforePatch: (nextValue: unknown, nextState: Map<string, unknown>) => {\n\t\t\t\t\t\tif (typeof nextValue === 'boolean') {\n\t\t\t\t\t\t\tnextState.set('_hasButtons', {\n\t\t\t\t\t\t\t\tfirst: nextValue,\n\t\t\t\t\t\t\t\tlast: nextValue,\n\t\t\t\t\t\t\t\tnext: nextValue,\n\t\t\t\t\t\t\t\tprevious: nextValue,\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tif (typeof nextValue === 'string') {\n\t\t\t\t\t\t\t\ttry {\n\t\t\t\t\t\t\t\t\tnextValue = parseJson<PaginationHasButton>(nextValue);\n\t\t\t\t\t\t\t\t} catch (e) {\n\t\t\t\t\t\t\t\t\tnextState.delete('_hasButtons');\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tif (typeof nextValue === 'object' && nextValue !== null) {\n\t\t\t\t\t\t\t\tnextState.set('_hasButtons', {\n\t\t\t\t\t\t\t\t\t...this.state._hasButtons,\n\t\t\t\t\t\t\t\t\tfirst:\n\t\t\t\t\t\t\t\t\t\ttypeof (nextValue as PaginationHasButton).first === 'boolean'\n\t\t\t\t\t\t\t\t\t\t\t? (nextValue as PaginationHasButton).first === true\n\t\t\t\t\t\t\t\t\t\t\t: this.state._hasButtons.first,\n\t\t\t\t\t\t\t\t\tlast:\n\t\t\t\t\t\t\t\t\t\ttypeof (nextValue as PaginationHasButton).last === 'boolean'\n\t\t\t\t\t\t\t\t\t\t\t? (nextValue as PaginationHasButton).last === true\n\t\t\t\t\t\t\t\t\t\t\t: this.state._hasButtons.last,\n\t\t\t\t\t\t\t\t\tnext:\n\t\t\t\t\t\t\t\t\t\ttypeof (nextValue as PaginationHasButton).next === 'boolean'\n\t\t\t\t\t\t\t\t\t\t\t? (nextValue as PaginationHasButton).next === true\n\t\t\t\t\t\t\t\t\t\t\t: this.state._hasButtons.next,\n\t\t\t\t\t\t\t\t\tprevious:\n\t\t\t\t\t\t\t\t\t\ttypeof (nextValue as PaginationHasButton).previous === 'boolean'\n\t\t\t\t\t\t\t\t\t\t\t? (nextValue as PaginationHasButton).previous === true\n\t\t\t\t\t\t\t\t\t\t\t: this.state._hasButtons.previous,\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t}\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriPaginationButtonCallbacks): void {\n\t\tif (typeof value === 'object' && value !== null) {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_on: value,\n\t\t\t};\n\t\t}\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_page')\n\tpublic validatePage(value?: number): void {\n\t\twatchNumber(this, '_page', value, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: (_nextValue: unknown, nextState: Map<string, unknown>) => {\n\t\t\t\t\tconst pageSize = nextState.has('_pageSize') ? (nextState.get('_pageSize') as number) : this.state._pageSize;\n\t\t\t\t\tconst total = nextState.has('_total') ? (nextState.get('_total') as number) : this.state._total;\n\t\t\t\t\tthis.syncPage(nextState, _nextValue as number, pageSize, total);\n\t\t\t\t},\n\t\t\t},\n\t\t});\n\t}\n\n\tprivate beforePageSize = (_nextValue: unknown, nextState: Map<string, unknown>) => {\n\t\tlet pageSize = nextState.has('_pageSize') ? (nextState.get('_pageSize') as number) : this.state._pageSize;\n\t\tconst pageSizeOptions = nextState.has('_pageSizeOptions') ? (nextState.get('_pageSizeOptions') as Option<number>[]) : this.state._pageSizeOptions;\n\t\tif (Array.isArray(pageSizeOptions) && pageSizeOptions.length > 0) {\n\t\t\tconst find = pageSizeOptions.find((option) => option.value === pageSize);\n\t\t\tif (find === undefined) {\n\t\t\t\tpageSize = pageSizeOptions[0].value;\n\t\t\t} else {\n\t\t\t\tpageSize = find.value;\n\t\t\t}\n\t\t\tnextState.set('_pageSize', pageSize);\n\t\t}\n\t\tconst page = nextState.has('_page') ? (nextState.get('_page') as number) : this.state._page;\n\t\tconst total = nextState.has('_total') ? (nextState.get('_total') as number) : this.state._total;\n\t\tthis.syncPage(nextState, page, nextState.get('_pageSize') as number, total);\n\t};\n\n\tprivate syncPage = (nextState: Map<string, unknown>, page: number, pageSize: number, total: number) => {\n\t\t// count === 0 means no data\n\t\tif (total > 0) {\n\t\t\tconst count = this.calcCount(total, pageSize);\n\t\t\tif (count > 0) {\n\t\t\t\tif (page > count) {\n\t\t\t\t\tnextState.set('_page', count);\n\t\t\t\t\tthis.onChangePage(STATE_CHANGE_EVENT, count);\n\t\t\t\t} else if (page < 1) {\n\t\t\t\t\tnextState.set('_page', 1);\n\t\t\t\t\tthis.onChangePage(STATE_CHANGE_EVENT, 1);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t};\n\n\tprivate beforePageSizeOptions = (nextValue: unknown, nextState: Map<string, unknown>) => {\n\t\tconst options: Option<number>[] = [];\n\t\tif (Array.isArray(nextValue)) {\n\t\t\tfor (const value of nextValue) {\n\t\t\t\tif (typeof value === 'number') {\n\t\t\t\t\toptions.push({\n\t\t\t\t\t\tlabel: translate('kol-page-per-site', { placeholders: { entries: `${value}` } }),\n\t\t\t\t\t\tvalue: value,\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\tnextState.set('_pageSizeOptions', options);\n\t\tthis.beforePageSize(options, nextState);\n\t};\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_pageSize')\n\tpublic validatePageSize(value?: number): void {\n\t\twatchNumber(this, '_pageSize', value, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: this.beforePageSize,\n\t\t\t},\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_pageSizeOptions')\n\tpublic validatePageSizeOptions(value?: Stringified<number[]>): void {\n\t\twatchJsonArrayString(this, '_pageSizeOptions', (value) => typeof value === 'number', value, undefined, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: this.beforePageSizeOptions,\n\t\t\t},\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_siblingCount')\n\tpublic validateSiblingCount(value?: number): void {\n\t\twatchNumber(this, '_siblingCount', Math.max(0, value ?? 1));\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_total')\n\tpublic validateTotal(value?: number): void {\n\t\twatchNumber(this, '_total', value, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: (_nextValue: unknown, nextState: Map<string, unknown>) => {\n\t\t\t\t\tconst page = nextState.has('_page') ? (nextState.get('_page') as number) : this.state._page;\n\t\t\t\t\tconst pageSize = nextState.has('_pageSize') ? (nextState.get('_pageSize') as number) : this.state._pageSize;\n\t\t\t\t\tthis.syncPage(nextState, page, pageSize, _nextValue as number);\n\t\t\t\t},\n\t\t\t},\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tooltipAlign')\n\tpublic validateTooltipAlign(value?: Alignment): void {\n\t\twatchTooltipAlignment(this, '_tooltipAlign', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_variant')\n\tpublic validateVariant(value?: KoliBriButtonVariant): void {\n\t\twatchButtonVariant(this, '_variant', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateBoundaryCount(this._boundaryCount);\n\t\tthis.validateCustomClass(this._customClass);\n\t\tthis.validateHasButtons(this._hasButtons);\n\t\tthis.validateOn(this._on);\n\t\tthis.validatePage(this._page);\n\t\tthis.validatePageSize(this._pageSize);\n\t\tthis.validatePageSizeOptions(this._pageSizeOptions);\n\t\tthis.validateSiblingCount(this._siblingCount);\n\t\tthis.validateTooltipAlign(this._tooltipAlign);\n\t\tthis.validateTotal(this._total);\n\t\tthis.validateVariant(this._variant);\n\n\t\t/**\n\t\t * Die Seite muss als letztes gesetzt werden, da sonst die Seite\n\t\t * nicht korrekt berechnet wird.\n\t\t */\n\t\tthis.validatePage(this._page);\n\t}\n}\n"],"version":3}
1
+ {"file":"kol-pagination.entry.js","mappings":"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","names":[],"sources":["./src/components/pagination/style.css?tag=kol-pagination&mode=default&encapsulation=shadow","./src/components/pagination/component.tsx"],"sourcesContent":["@import '../style.css';\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { KoliBriButtonVariant, KoliBriButtonVariantPropState, KoliBriButtonCustomClassPropState, watchTooltipAlignment } from '../../types/button-link';\nimport { nonce } from '../../utils/dev.utils';\nimport { parseJson, watchJsonArrayString, watchNumber, watchString, watchValidator } from '../../utils/prop.validators';\nimport { watchButtonVariant } from '../button/controller';\nimport { Alignment } from '../../types/props/alignment';\nimport { KoliBriPaginationButtonCallbacks } from './types';\nimport { Stringified } from '../../types/common';\nimport { Option } from '../../types/input/types';\nimport { STATE_CHANGE_EVENT } from '../../utils/validator';\nimport { translate } from '../../i18n';\n\n/**\n * Der HasButton-Typ definiert die Einstellungsmöglichkeiten der speziellen\n * Sprung-Schalter der Pagination.\n */\nexport type PaginationHasButton = {\n\t/**\n\t * Der First-Button ist der Schalter, um direkt auf die erste Seite zu gelangen.\n\t */\n\tfirst: boolean;\n\t/**\n\t * Der Last-Button ist der Schalter, um direkt auf die letzte Seite zu gelangen.\n\t */\n\tlast: boolean;\n\t/**\n\t * Der Next-Button ist der Schalter, um direkt auf die nächste Seite zu gelangen.\n\t */\n\tnext: boolean;\n\t/**\n\t * Der Next-Button ist der Schalter, um direkt auf die vorherige Seite zu gelangen.\n\t */\n\tprevious: boolean;\n};\n\n/**\n * API\n */\nexport type RequiredProps = {\n\ton: KoliBriPaginationButtonCallbacks;\n\tpage: number;\n\ttotal: number;\n};\nexport type OptionalProps = KoliBriButtonCustomClassPropState &\n\tKoliBriButtonVariantPropState & {\n\t\tboundaryCount: number;\n\t\thasButtons: boolean | Stringified<PaginationHasButton>;\n\t\tpageSize: number;\n\t\tpageSizeOptions: Stringified<number[]>;\n\t\tsiblingCount: number;\n\t\ttooltipAlign: Alignment;\n\t};\n// export type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = KoliBriButtonVariantPropState & {\n\tboundaryCount: number;\n\thasButtons: PaginationHasButton;\n\tpage: number;\n\tpageSize: number;\n\tpageSizeOptions: Option<number>[];\n\ton: KoliBriPaginationButtonCallbacks;\n\tsiblingCount: number;\n\ttotal: number;\n};\ntype OptionalStates = KoliBriButtonCustomClassPropState & {\n\ttooltipAlign: Alignment;\n};\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\nconst leftDoubleArrowIcon = {\n\tleft: 'codicon codicon-debug-reverse-continue',\n};\nconst leftSingleArrow = {\n\tleft: 'codicon codicon-chevron-left',\n};\nconst rightSingleArrowIcon = {\n\tright: 'codicon codicon-chevron-right',\n};\nconst rightDoubleArrowIcon = {\n\tright: 'codicon codicon-debug-continue',\n};\n\n@Component({\n\ttag: 'kol-pagination',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolPagination implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate readonly nonce = nonce();\n\n\tprivate readonly calcCount = (total: number, pageSize = 1): number => Math.ceil(total / pageSize);\n\n\tprivate readonly getCount = (): number => this.calcCount(this.state._total, this.state._pageSize);\n\n\tpublic render(): JSX.Element {\n\t\tlet ellipsis = false;\n\t\tconst count = this.getCount();\n\t\tconst pageButtons = Array.from(Array(count).keys())\n\t\t\t.map((index: number) => index + 1)\n\t\t\t.map((page: number) => {\n\t\t\t\tif (\n\t\t\t\t\tpage <= this.state._boundaryCount ||\n\t\t\t\t\tpage > count - this.state._boundaryCount ||\n\t\t\t\t\t(page >= this.state._page - this.state._siblingCount && page <= this.state._page + this.state._siblingCount)\n\t\t\t\t) {\n\t\t\t\t\tellipsis = true;\n\t\t\t\t\tif (this.state._page === page) {\n\t\t\t\t\t\treturn this.getSelectedPageButton(page);\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn this.getUnselectedPageButton(page);\n\t\t\t\t\t}\n\t\t\t\t} else if (ellipsis === true) {\n\t\t\t\t\tellipsis = false;\n\t\t\t\t\treturn <span key={`${this.nonce}-el-${page}`}>•••</span>;\n\t\t\t\t} else {\n\t\t\t\t\treturn null;\n\t\t\t\t}\n\t\t\t});\n\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div>\n\t\t\t\t\t{this.state._hasButtons.first && (\n\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t_customClass={this.state._customClass}\n\t\t\t\t\t\t\t_disabled={this.state._page <= 1}\n\t\t\t\t\t\t\t_icon={leftDoubleArrowIcon}\n\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t_label={translate('kol-page-first')}\n\t\t\t\t\t\t\t_on={this.onGoToFirst}\n\t\t\t\t\t\t\t_variant={this.state._variant}\n\t\t\t\t\t\t\t_tooltipAlign={this.state._tooltipAlign}\n\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t)}\n\t\t\t\t\t{this.state._hasButtons.previous && (\n\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t_customClass={this.state._customClass}\n\t\t\t\t\t\t\t_disabled={this.state._page <= 1}\n\t\t\t\t\t\t\t_icon={leftSingleArrow}\n\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t_label={translate('kol-page-back')}\n\t\t\t\t\t\t\t_on={this.onGoBackward}\n\t\t\t\t\t\t\t_variant={this.state._variant}\n\t\t\t\t\t\t\t_tooltipAlign={this.state._tooltipAlign}\n\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t)}\n\t\t\t\t\t{pageButtons}\n\t\t\t\t\t{this.state._hasButtons.next && (\n\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t_customClass={this.state._customClass}\n\t\t\t\t\t\t\t_disabled={count <= this.state._page}\n\t\t\t\t\t\t\t_icon={rightSingleArrowIcon}\n\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t_label={translate('kol-page-next')}\n\t\t\t\t\t\t\t_on={this.onGoForward}\n\t\t\t\t\t\t\t_variant={this.state._variant}\n\t\t\t\t\t\t\t_tooltipAlign={this.state._tooltipAlign}\n\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t)}\n\t\t\t\t\t{this.state._hasButtons.last && (\n\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t_customClass={this.state._customClass}\n\t\t\t\t\t\t\t_disabled={count <= this.state._page}\n\t\t\t\t\t\t\t_icon={rightDoubleArrowIcon}\n\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t_label={translate('kol-page-last')}\n\t\t\t\t\t\t\t_on={this.onGoToEnd}\n\t\t\t\t\t\t\t_variant={this.state._variant}\n\t\t\t\t\t\t\t_tooltipAlign={this.state._tooltipAlign}\n\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t{this.state._pageSizeOptions?.length > 0 && (\n\t\t\t\t\t<kol-select\n\t\t\t\t\t\t_hideLabel\n\t\t\t\t\t\t_id=\"pagination-size\"\n\t\t\t\t\t\t_list={this.state._pageSizeOptions}\n\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\tonChange: this.onChangePageSize,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\t_value={[this.state._pageSize]}\n\t\t\t\t\t>\n\t\t\t\t\t\t{translate('kol-entries-per-site')}\n\t\t\t\t\t</kol-select>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, wie viele Seiten neben den am Rand liegenden Pfeil-Schaltern angezeigt werden sollen.\n\t */\n\t@Prop() public _boundaryCount?: number = 1;\n\n\t/**\n\t * Gibt an, welche Custom-Class übergeben werden soll, wenn _variant=\"custom\" gesetzt ist.\n\t */\n\t@Prop() public _customClass?: string;\n\n\t/**\n\t * Gibt an, welche Sprung-Schalter sichtbar sein sollen.\n\t */\n\t@Prop() public _hasButtons?: boolean | Stringified<PaginationHasButton>;\n\n\t/**\n\t * Gibt an, welche Seite aktuell ausgewählt ist.\n\t */\n\t@Prop() public _page!: number;\n\n\t/**\n\t * Gibt an, wie viele Einträge pro Seite angezeigt werden.\n\t */\n\t@Prop({ mutable: true, reflect: false }) public _pageSize = 1;\n\n\t/**\n\t * Gibt an, welche Optionen für die Seitenlänge angeboten werden.\n\t */\n\t@Prop() public _pageSizeOptions: Stringified<number[]> = [];\n\n\t/**\n\t * Gibt an, auf welche Callback-Events reagiert werden.\n\t */\n\t@Prop() public _on!: KoliBriPaginationButtonCallbacks;\n\n\t/**\n\t * Gibt an, wie viele Seiten neben dem aktuell ausgewählten Seite angezeigt werden.\n\t */\n\t@Prop() public _siblingCount?: number = 1;\n\n\t/**\n\t * Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden.\n\t */\n\t@Prop() public _tooltipAlign?: Alignment = 'top';\n\n\t/**\n\t * Gibt an, wie viele Einträge mit der Pagination gehandelt werden.\n\t */\n\t@Prop() public _total!: number;\n\n\t/**\n\t * Gibt an, welche Button-Variante verwendet werden soll.\n\t */\n\t@Prop() public _variant?: KoliBriButtonVariant = 'normal';\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_boundaryCount: 1,\n\t\t_hasButtons: {\n\t\t\tfirst: true,\n\t\t\tlast: true,\n\t\t\tnext: true,\n\t\t\tprevious: true,\n\t\t},\n\t\t_on: {\n\t\t\tonClick: () => null,\n\t\t},\n\t\t_page: 0,\n\t\t_pageSize: 1,\n\t\t_pageSizeOptions: [],\n\t\t_siblingCount: 1,\n\t\t_total: 0,\n\t\t_variant: 'normal',\n\t};\n\n\tprivate onClick = (event: Event, page: number) => {\n\t\tif (typeof this.state._on.onClick === 'function') {\n\t\t\tthis.state._on.onClick(event, page);\n\t\t}\n\t\tthis.onChangePage(event, page);\n\t};\n\n\tprivate onChangePage = (event: Event, page: number) => {\n\t\tconst timeout = setTimeout(() => {\n\t\t\tclearTimeout(timeout);\n\t\t\tif (typeof this.state._on.onChangePage === 'function') {\n\t\t\t\tthis.state._on.onChangePage(event, page);\n\t\t\t}\n\t\t});\n\t};\n\n\tprivate onChangePageSize = (event: Event, value: unknown) => {\n\t\tvalue = parseInt((value as string[])[0]);\n\t\tif (typeof value === 'number' && value > 0 && this._pageSize !== value) {\n\t\t\tthis._pageSize = value;\n\t\t\tconst timeout = setTimeout(() => {\n\t\t\t\tclearTimeout(timeout);\n\t\t\t\tif (typeof this.state._on.onChangePageSize === 'function') {\n\t\t\t\t\tthis.state._on.onChangePageSize(event, this._pageSize);\n\t\t\t\t}\n\t\t\t});\n\t\t}\n\t};\n\n\tprivate readonly onGoToFirst = {\n\t\tonClick: (event: Event) => {\n\t\t\tthis.onClick(event, 1);\n\t\t},\n\t};\n\tprivate readonly onGoToEnd = {\n\t\tonClick: (event: Event) => {\n\t\t\tthis.onClick(event, this.getCount());\n\t\t},\n\t};\n\tprivate readonly onGoBackward = {\n\t\tonClick: (event: Event) => {\n\t\t\tthis.onClick(event, this.state._page - 1);\n\t\t},\n\t};\n\tprivate readonly onGoForward = {\n\t\tonClick: (event: Event) => {\n\t\t\tthis.onClick(event, this.state._page + 1);\n\t\t},\n\t};\n\n\tprivate getUnselectedPageButton(page: number): JSX.Element {\n\t\treturn (\n\t\t\t<kol-button\n\t\t\t\tkey={`${this.nonce}-${page}`}\n\t\t\t\t_customClass={this.state._customClass}\n\t\t\t\t_ariaLabel={translate('kol-page-current', { placeholders: { page: page.toFixed(0) } })}\n\t\t\t\t_label={`${page}`}\n\t\t\t\t_on={{\n\t\t\t\t\tonClick: (event: Event) => {\n\t\t\t\t\t\tthis.onClick(event, page);\n\t\t\t\t\t},\n\t\t\t\t}}\n\t\t\t\t_variant={this.state._variant}\n\t\t\t></kol-button>\n\t\t);\n\t}\n\n\tprivate getSelectedPageButton(page: number): JSX.Element {\n\t\treturn (\n\t\t\t<kol-button-wc\n\t\t\t\tclass=\"selected\"\n\t\t\t\tkey={`${this.nonce}-selected`}\n\t\t\t\t_customClass={this.state._customClass}\n\t\t\t\t_disabled={true}\n\t\t\t\t_ariaCurrent={true}\n\t\t\t\t_ariaLabel={translate('kol-page-selected', { placeholders: { page: page.toFixed(0) } })}\n\t\t\t\t_label={`${page}`}\n\t\t\t\t_variant={this.state._variant}\n\t\t\t/>\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_boundaryCount')\n\tpublic validateBoundaryCount(value?: number): void {\n\t\twatchNumber(this, '_boundaryCount', Math.max(0, value ?? 1));\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_customClass')\n\tpublic validateCustomClass(value?: string): void {\n\t\twatchString(this, '_customClass', value, {\n\t\t\tdefaultValue: undefined,\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hasButtons')\n\tpublic validateHasButtons(value?: string | boolean | Stringified<PaginationHasButton>): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_hasButtons',\n\t\t\t(value) => typeof value === 'boolean' || typeof value === 'string' || (typeof value === 'object' && value !== null),\n\t\t\tnew Set(['Boolean', 'PaginationHasButton']),\n\t\t\tvalue,\n\t\t\t{\n\t\t\t\thooks: {\n\t\t\t\t\tbeforePatch: (nextValue: unknown, nextState: Map<string, unknown>) => {\n\t\t\t\t\t\tif (typeof nextValue === 'boolean') {\n\t\t\t\t\t\t\tnextState.set('_hasButtons', {\n\t\t\t\t\t\t\t\tfirst: nextValue,\n\t\t\t\t\t\t\t\tlast: nextValue,\n\t\t\t\t\t\t\t\tnext: nextValue,\n\t\t\t\t\t\t\t\tprevious: nextValue,\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tif (typeof nextValue === 'string') {\n\t\t\t\t\t\t\t\ttry {\n\t\t\t\t\t\t\t\t\tnextValue = parseJson<PaginationHasButton>(nextValue);\n\t\t\t\t\t\t\t\t} catch (e) {\n\t\t\t\t\t\t\t\t\tnextState.delete('_hasButtons');\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tif (typeof nextValue === 'object' && nextValue !== null) {\n\t\t\t\t\t\t\t\tnextState.set('_hasButtons', {\n\t\t\t\t\t\t\t\t\t...this.state._hasButtons,\n\t\t\t\t\t\t\t\t\tfirst:\n\t\t\t\t\t\t\t\t\t\ttypeof (nextValue as PaginationHasButton).first === 'boolean'\n\t\t\t\t\t\t\t\t\t\t\t? (nextValue as PaginationHasButton).first === true\n\t\t\t\t\t\t\t\t\t\t\t: this.state._hasButtons.first,\n\t\t\t\t\t\t\t\t\tlast:\n\t\t\t\t\t\t\t\t\t\ttypeof (nextValue as PaginationHasButton).last === 'boolean'\n\t\t\t\t\t\t\t\t\t\t\t? (nextValue as PaginationHasButton).last === true\n\t\t\t\t\t\t\t\t\t\t\t: this.state._hasButtons.last,\n\t\t\t\t\t\t\t\t\tnext:\n\t\t\t\t\t\t\t\t\t\ttypeof (nextValue as PaginationHasButton).next === 'boolean'\n\t\t\t\t\t\t\t\t\t\t\t? (nextValue as PaginationHasButton).next === true\n\t\t\t\t\t\t\t\t\t\t\t: this.state._hasButtons.next,\n\t\t\t\t\t\t\t\t\tprevious:\n\t\t\t\t\t\t\t\t\t\ttypeof (nextValue as PaginationHasButton).previous === 'boolean'\n\t\t\t\t\t\t\t\t\t\t\t? (nextValue as PaginationHasButton).previous === true\n\t\t\t\t\t\t\t\t\t\t\t: this.state._hasButtons.previous,\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t}\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriPaginationButtonCallbacks): void {\n\t\tif (typeof value === 'object' && value !== null) {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_on: value,\n\t\t\t};\n\t\t}\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_page')\n\tpublic validatePage(value?: number): void {\n\t\twatchNumber(this, '_page', value, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: (_nextValue: unknown, nextState: Map<string, unknown>) => {\n\t\t\t\t\tconst pageSize = nextState.has('_pageSize') ? (nextState.get('_pageSize') as number) : this.state._pageSize;\n\t\t\t\t\tconst total = nextState.has('_total') ? (nextState.get('_total') as number) : this.state._total;\n\t\t\t\t\tthis.syncPage(nextState, _nextValue as number, pageSize, total);\n\t\t\t\t},\n\t\t\t},\n\t\t});\n\t}\n\n\tprivate beforePageSize = (_nextValue: unknown, nextState: Map<string, unknown>) => {\n\t\tlet pageSize = nextState.has('_pageSize') ? (nextState.get('_pageSize') as number) : this.state._pageSize;\n\t\tconst pageSizeOptions = nextState.has('_pageSizeOptions') ? (nextState.get('_pageSizeOptions') as Option<number>[]) : this.state._pageSizeOptions;\n\t\tif (Array.isArray(pageSizeOptions) && pageSizeOptions.length > 0) {\n\t\t\tconst find = pageSizeOptions.find((option) => option.value === pageSize);\n\t\t\tif (find === undefined) {\n\t\t\t\tpageSize = pageSizeOptions[0].value;\n\t\t\t} else {\n\t\t\t\tpageSize = find.value;\n\t\t\t}\n\t\t\tnextState.set('_pageSize', pageSize);\n\t\t}\n\t\tconst page = nextState.has('_page') ? (nextState.get('_page') as number) : this.state._page;\n\t\tconst total = nextState.has('_total') ? (nextState.get('_total') as number) : this.state._total;\n\t\tthis.syncPage(nextState, page, nextState.get('_pageSize') as number, total);\n\t};\n\n\tprivate syncPage = (nextState: Map<string, unknown>, page: number, pageSize: number, total: number) => {\n\t\t// count === 0 means no data\n\t\tif (total > 0) {\n\t\t\tconst count = this.calcCount(total, pageSize);\n\t\t\tif (count > 0) {\n\t\t\t\tif (page > count) {\n\t\t\t\t\tnextState.set('_page', count);\n\t\t\t\t\tthis.onChangePage(STATE_CHANGE_EVENT, count);\n\t\t\t\t} else if (page < 1) {\n\t\t\t\t\tnextState.set('_page', 1);\n\t\t\t\t\tthis.onChangePage(STATE_CHANGE_EVENT, 1);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t};\n\n\tprivate beforePageSizeOptions = (nextValue: unknown, nextState: Map<string, unknown>) => {\n\t\tconst options: Option<number>[] = [];\n\t\tif (Array.isArray(nextValue)) {\n\t\t\tfor (const value of nextValue) {\n\t\t\t\tif (typeof value === 'number') {\n\t\t\t\t\toptions.push({\n\t\t\t\t\t\tlabel: translate('kol-page-per-site', { placeholders: { entries: `${value}` } }),\n\t\t\t\t\t\tvalue: value,\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\tnextState.set('_pageSizeOptions', options);\n\t\tthis.beforePageSize(options, nextState);\n\t};\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_pageSize')\n\tpublic validatePageSize(value?: number): void {\n\t\twatchNumber(this, '_pageSize', value, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: this.beforePageSize,\n\t\t\t},\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_pageSizeOptions')\n\tpublic validatePageSizeOptions(value?: Stringified<number[]>): void {\n\t\twatchJsonArrayString(this, '_pageSizeOptions', (value) => typeof value === 'number', value, undefined, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: this.beforePageSizeOptions,\n\t\t\t},\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_siblingCount')\n\tpublic validateSiblingCount(value?: number): void {\n\t\twatchNumber(this, '_siblingCount', Math.max(0, value ?? 1));\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_total')\n\tpublic validateTotal(value?: number): void {\n\t\twatchNumber(this, '_total', value, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: (_nextValue: unknown, nextState: Map<string, unknown>) => {\n\t\t\t\t\tconst page = nextState.has('_page') ? (nextState.get('_page') as number) : this.state._page;\n\t\t\t\t\tconst pageSize = nextState.has('_pageSize') ? (nextState.get('_pageSize') as number) : this.state._pageSize;\n\t\t\t\t\tthis.syncPage(nextState, page, pageSize, _nextValue as number);\n\t\t\t\t},\n\t\t\t},\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tooltipAlign')\n\tpublic validateTooltipAlign(value?: Alignment): void {\n\t\twatchTooltipAlignment(this, '_tooltipAlign', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_variant')\n\tpublic validateVariant(value?: KoliBriButtonVariant): void {\n\t\twatchButtonVariant(this, '_variant', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateBoundaryCount(this._boundaryCount);\n\t\tthis.validateCustomClass(this._customClass);\n\t\tthis.validateHasButtons(this._hasButtons);\n\t\tthis.validateOn(this._on);\n\t\tthis.validatePage(this._page);\n\t\tthis.validatePageSize(this._pageSize);\n\t\tthis.validatePageSizeOptions(this._pageSizeOptions);\n\t\tthis.validateSiblingCount(this._siblingCount);\n\t\tthis.validateTooltipAlign(this._tooltipAlign);\n\t\tthis.validateTotal(this._total);\n\t\tthis.validateVariant(this._variant);\n\n\t\t/**\n\t\t * Die Seite muss als letztes gesetzt werden, da sonst die Seite\n\t\t * nicht korrekt berechnet wird.\n\t\t */\n\t\tthis.validatePage(this._page);\n\t}\n}\n"],"version":3}
@@ -1,4 +1,4 @@
1
1
  /*!
2
2
  * KoliBri - The accessible HTML-Standard
3
3
  */
4
- import{r as registerInstance,h,H as Host}from"./index-50adf9a0.js";import{e as watchNumber,w as watchString}from"./prop.validators-daa14517.js";import"./a11y.tipps-e0a65f3c.js";import"./dev.utils-bedce29d.js";import"./reuse-56bb5a4b.js";import"./index-81bd9b41.js";const defaultStyleCss=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']),input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],option,select,textarea{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button,input,option,select,textarea{cursor:pointer;font-family:inherit;font-size:inherit}.icon-only>kol-span-wc>span>span{display:none}progress,span{display:block;height:0px;overflow:hidden;width:0px}.bar,.cycle{transition:all 0.5s ease-in-out 0s;transition-property:all;transition-duration:0.5s;transition-timing-function:ease-in-out;transition-delay:0.25s}.cycle{transform-origin:50% 50%;transform:rotate(-90deg)}",createProgressSVG=t=>"cycle"===t._type?h("svg",{width:"100",viewBox:"0 0 12 12",xmlns:"http://www.w3.org/2000/svg"},h("circle",{fill:"none",stroke:"#efefef",cx:"6px",cy:"6px",r:"5px"}),h("circle",{class:"cycle","stroke-linecap":"round","stroke-dasharray":`${Math.round(t._value/t._max*32)}px 32px`,fill:"none",stroke:"#0075ff",cx:"6px",cy:"6px",r:"5px"})):h("svg",{width:"100",viewBox:"0 0 24 2",xmlns:"http://www.w3.org/2000/svg"},h("line",{"stroke-width":"2",x1:"1","stroke-linecap":"round",y1:"1",x2:"23",y2:"1",fill:"#efefef",stroke:"#efefef"}),h("line",{class:"bar","stroke-width":"2",x1:"1","stroke-linecap":"round",y1:"1",x2:`${1+Math.round(t._value/t._max*22)}`,y2:"1",fill:"#0075ff",stroke:"#0075ff"})),KolProcess=class{constructor(t){registerInstance(this,t),this._max=void 0,this._type=void 0,this._unit="%",this._value=void 0,this.state={_max:100,_type:"bar",_unit:"%",_value:0,_liveValue:0}}render(){return h(Host,null,"cycle"===(t=this.state)._type?h("svg",{width:"100",viewBox:"0 0 12 12",xmlns:"http://www.w3.org/2000/svg"},h("circle",{fill:"none",stroke:"#efefef",cx:"6px",cy:"6px",r:"5px"}),h("circle",{class:"cycle","stroke-linecap":"round","stroke-dasharray":`${Math.round(t._value/t._max*32)}px 32px`,fill:"none",stroke:"#0075ff",cx:"6px",cy:"6px",r:"5px"})):h("svg",{width:"100",viewBox:"0 0 24 2",xmlns:"http://www.w3.org/2000/svg"},h("line",{"stroke-width":"2",x1:"1","stroke-linecap":"round",y1:"1",x2:"23",y2:"1",fill:"#efefef",stroke:"#efefef"}),h("line",{class:"bar","stroke-width":"2",x1:"1","stroke-linecap":"round",y1:"1",x2:`${1+Math.round(t._value/t._max*22)}`,y2:"1",fill:"#0075ff",stroke:"#0075ff"})),h("progress",{"aria-busy":this.state._value<this.state._max?"true":"false",max:this.state._max,value:this.state._value}),h("span",{"aria-live":"polite","aria-relevant":"removals text"},this.state._liveValue," von ",this.state._max," ",this.state._unit));var t}validateMax(t){"number"!=typeof t&&(t=100),watchNumber(this,"_max",t,{required:!0})}validateType(t){if("cycle"===t);else t="bar";this.state=Object.assign(Object.assign({},this.state),{_type:t})}validateUnit(t){watchString(this,"_unit",t)}validateValue(t){"number"!=typeof t&&(t=0),watchNumber(this,"_value",t,{required:!0})}componentWillLoad(){this.validateMax(this._max),this.validateType(this._type),this.validateUnit(this._unit),this.validateValue(this._value),this.interval=setInterval((()=>{this.state._liveValue!==this.state._value&&(this.state=Object.assign(Object.assign({},this.state),{_liveValue:this.state._value}))}),5e3)}disconnectedCallback(){clearInterval(this.interval)}static get watchers(){return{_max:["validateMax"],_type:["validateType"],_unit:["validateUnit"],_value:["validateValue"]}}};KolProcess.style={default:defaultStyleCss};export{KolProcess as kol_progress};
4
+ import{r as registerInstance,h,H as Host}from"./index-50adf9a0.js";import{e as watchNumber,w as watchString}from"./prop.validators-1f3db013.js";import"./a11y.tipps-5ca36877.js";import"./dev.utils-bedce29d.js";import"./reuse-56bb5a4b.js";import"./index-81bd9b41.js";const defaultStyleCss=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']),input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],option,select,textarea{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button,input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],option,select{cursor:pointer;font-family:inherit;font-size:inherit}.icon-only>kol-span-wc>span>span{display:none}progress,span{display:block;height:0px;overflow:hidden;width:0px}.bar,.cycle{transition:all 0.5s ease-in-out 0s;transition-property:all;transition-duration:0.5s;transition-timing-function:ease-in-out;transition-delay:0.25s}.cycle{transform-origin:50% 50%;transform:rotate(-90deg)}",createProgressSVG=t=>"cycle"===t._type?h("svg",{width:"100",viewBox:"0 0 12 12",xmlns:"http://www.w3.org/2000/svg"},h("circle",{fill:"none",stroke:"#efefef",cx:"6px",cy:"6px",r:"5px"}),h("circle",{class:"cycle","stroke-linecap":"round","stroke-dasharray":`${Math.round(t._value/t._max*32)}px 32px`,fill:"none",stroke:"#0075ff",cx:"6px",cy:"6px",r:"5px"})):h("svg",{width:"100",viewBox:"0 0 24 2",xmlns:"http://www.w3.org/2000/svg"},h("line",{"stroke-width":"2",x1:"1","stroke-linecap":"round",y1:"1",x2:"23",y2:"1",fill:"#efefef",stroke:"#efefef"}),h("line",{class:"bar","stroke-width":"2",x1:"1","stroke-linecap":"round",y1:"1",x2:`${1+Math.round(t._value/t._max*22)}`,y2:"1",fill:"#0075ff",stroke:"#0075ff"})),KolProcess=class{constructor(t){registerInstance(this,t),this._max=void 0,this._type=void 0,this._unit="%",this._value=void 0,this.state={_max:100,_type:"bar",_unit:"%",_value:0,_liveValue:0}}render(){return h(Host,null,"cycle"===(t=this.state)._type?h("svg",{width:"100",viewBox:"0 0 12 12",xmlns:"http://www.w3.org/2000/svg"},h("circle",{fill:"none",stroke:"#efefef",cx:"6px",cy:"6px",r:"5px"}),h("circle",{class:"cycle","stroke-linecap":"round","stroke-dasharray":`${Math.round(t._value/t._max*32)}px 32px`,fill:"none",stroke:"#0075ff",cx:"6px",cy:"6px",r:"5px"})):h("svg",{width:"100",viewBox:"0 0 24 2",xmlns:"http://www.w3.org/2000/svg"},h("line",{"stroke-width":"2",x1:"1","stroke-linecap":"round",y1:"1",x2:"23",y2:"1",fill:"#efefef",stroke:"#efefef"}),h("line",{class:"bar","stroke-width":"2",x1:"1","stroke-linecap":"round",y1:"1",x2:`${1+Math.round(t._value/t._max*22)}`,y2:"1",fill:"#0075ff",stroke:"#0075ff"})),h("progress",{"aria-busy":this.state._value<this.state._max?"true":"false",max:this.state._max,value:this.state._value}),h("span",{"aria-live":"polite","aria-relevant":"removals text"},this.state._liveValue," von ",this.state._max," ",this.state._unit));var t}validateMax(t){"number"!=typeof t&&(t=100),watchNumber(this,"_max",t,{required:!0})}validateType(t){if("cycle"===t);else t="bar";this.state=Object.assign(Object.assign({},this.state),{_type:t})}validateUnit(t){watchString(this,"_unit",t)}validateValue(t){"number"!=typeof t&&(t=0),watchNumber(this,"_value",t,{required:!0})}componentWillLoad(){this.validateMax(this._max),this.validateType(this._type),this.validateUnit(this._unit),this.validateValue(this._value),this.interval=setInterval((()=>{this.state._liveValue!==this.state._value&&(this.state=Object.assign(Object.assign({},this.state),{_liveValue:this.state._value}))}),5e3)}disconnectedCallback(){clearInterval(this.interval)}static get watchers(){return{_max:["validateMax"],_type:["validateType"],_unit:["validateUnit"],_value:["validateValue"]}}};KolProcess.style={default:defaultStyleCss};export{KolProcess as kol_progress};
@@ -1 +1 @@
1
- {"file":"kol-progress.entry.js","mappings":"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","names":[],"sources":["./src/components/progress/style.css?tag=kol-progress&mode=default&encapsulation=shadow","./src/components/progress/component.tsx"],"sourcesContent":["@import '../style.css';\n\nprogress,\nspan {\n\tdisplay: block;\n\theight: 0px;\n\toverflow: hidden;\n\twidth: 0px;\n}\n\n.bar,\n.cycle {\n\ttransition: all 0.5s ease-in-out 0s;\n\ttransition-property: all;\n\ttransition-duration: 0.5s;\n\ttransition-timing-function: ease-in-out;\n\ttransition-delay: 0.25s;\n}\n\n.cycle {\n\ttransform-origin: 50% 50%;\n\ttransform: rotate(-90deg);\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { KoliBriProgressType } from '../../types/progress';\nimport { watchNumber, watchString } from '../../utils/prop.validators';\n\n/**\n * API\n */\ntype RequiredProps = {\n\tmax: number;\n\tvalue: number;\n};\ntype OptionalProps = {\n\ttype: KoliBriProgressType;\n\tunit: string;\n};\n// type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps & {\n\tliveValue: number;\n};\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n// https://css-tricks.com/html5-progress-element/\nconst createProgressSVG = (state: States): JSX.Element => {\n\tswitch (state._type) {\n\t\tcase 'cycle':\n\t\t\treturn (\n\t\t\t\t<svg width=\"100\" viewBox=\"0 0 12 12\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t\t\t\t<circle fill=\"none\" stroke=\"#efefef\" cx=\"6px\" cy=\"6px\" r=\"5px\"></circle>\n\t\t\t\t\t<circle\n\t\t\t\t\t\tclass=\"cycle\"\n\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\tstroke-dasharray={`${Math.round((state._value / state._max) * 32)}px 32px`}\n\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\tstroke=\"#0075ff\"\n\t\t\t\t\t\tcx=\"6px\"\n\t\t\t\t\t\tcy=\"6px\"\n\t\t\t\t\t\tr=\"5px\"\n\t\t\t\t\t></circle>\n\t\t\t\t</svg>\n\t\t\t);\n\t\tdefault:\n\t\t\treturn (\n\t\t\t\t<svg width=\"100\" viewBox=\"0 0 24 2\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t\t\t\t<line stroke-width=\"2\" x1=\"1\" stroke-linecap=\"round\" y1=\"1\" x2=\"23\" y2=\"1\" fill=\"#efefef\" stroke=\"#efefef\"></line>\n\t\t\t\t\t<line\n\t\t\t\t\t\tclass=\"bar\"\n\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\tx1=\"1\"\n\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\ty1=\"1\"\n\t\t\t\t\t\tx2={`${1 + Math.round((state._value / state._max) * 22)}`}\n\t\t\t\t\t\ty2=\"1\"\n\t\t\t\t\t\tfill=\"#0075ff\"\n\t\t\t\t\t\tstroke=\"#0075ff\"\n\t\t\t\t\t></line>\n\t\t\t\t</svg>\n\t\t\t);\n\t}\n};\n\n@Component({\n\ttag: 'kol-progress',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolProcess implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate interval?: NodeJS.Timer;\n\n\t// https://dequeuniversity.com/library/aria/progress-bar-bounded\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{createProgressSVG(this.state)}\n\t\t\t\t<progress aria-busy={this.state._value < this.state._max ? 'true' : 'false'} max={this.state._max} value={this.state._value}></progress>\n\t\t\t\t<span aria-live=\"polite\" aria-relevant=\"removals text\">\n\t\t\t\t\t{this.state._liveValue} von {this.state._max} {this.state._unit}\n\t\t\t\t</span>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, bei welchem Wert die Fortschrittsanzeige abgeschlossen ist.\n\t */\n\t@Prop() public _max!: number;\n\n\t/**\n\t * Gibt an, ob der Prozess als Balken oder Kreis dargestellt wird.\n\t */\n\t@Prop() public _type?: KoliBriProgressType;\n\n\t/**\n\t * Gibt die Einheit der Fortschrittswerte an.\n\t */\n\t@Prop() public _unit?: string = '%';\n\n\t/**\n\t * Gibt an, wie weit die Anzeige fortgeschritten ist.\n\t */\n\t@Prop() public _value!: number;\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_max: 100,\n\t\t_type: 'bar',\n\t\t_unit: '%',\n\t\t_value: 0,\n\t\t_liveValue: 0,\n\t};\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_max')\n\tpublic validateMax(value?: number): void {\n\t\tif (typeof value !== 'number') {\n\t\t\tvalue = 100;\n\t\t}\n\t\twatchNumber(this, '_max', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_type')\n\tpublic validateType(value?: KoliBriProgressType): void {\n\t\tswitch (value) {\n\t\t\tcase 'cycle':\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tvalue = 'bar';\n\t\t}\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_type: value,\n\t\t};\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_unit')\n\tpublic validateUnit(value?: string): void {\n\t\twatchString(this, '_unit', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_value')\n\tpublic validateValue(value?: number): void {\n\t\tif (typeof value !== 'number') {\n\t\t\tvalue = 0;\n\t\t}\n\t\twatchNumber(this, '_value', value, {\n\t\t\t// max: this._max, TODO as Function\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateMax(this._max);\n\t\tthis.validateType(this._type);\n\t\tthis.validateUnit(this._unit);\n\t\tthis.validateValue(this._value);\n\n\t\tthis.interval = setInterval(() => {\n\t\t\tif (this.state._liveValue !== this.state._value) {\n\t\t\t\tthis.state = {\n\t\t\t\t\t...this.state,\n\t\t\t\t\t_liveValue: this.state._value,\n\t\t\t\t};\n\t\t\t}\n\t\t}, 5000);\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tclearInterval(this.interval as unknown as number);\n\t}\n}\n"],"version":3}
1
+ {"file":"kol-progress.entry.js","mappings":"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","names":[],"sources":["./src/components/progress/style.css?tag=kol-progress&mode=default&encapsulation=shadow","./src/components/progress/component.tsx"],"sourcesContent":["@import '../style.css';\n\nprogress,\nspan {\n\tdisplay: block;\n\theight: 0px;\n\toverflow: hidden;\n\twidth: 0px;\n}\n\n.bar,\n.cycle {\n\ttransition: all 0.5s ease-in-out 0s;\n\ttransition-property: all;\n\ttransition-duration: 0.5s;\n\ttransition-timing-function: ease-in-out;\n\ttransition-delay: 0.25s;\n}\n\n.cycle {\n\ttransform-origin: 50% 50%;\n\ttransform: rotate(-90deg);\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { KoliBriProgressType } from '../../types/progress';\nimport { watchNumber, watchString } from '../../utils/prop.validators';\n\n/**\n * API\n */\ntype RequiredProps = {\n\tmax: number;\n\tvalue: number;\n};\ntype OptionalProps = {\n\ttype: KoliBriProgressType;\n\tunit: string;\n};\n// type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps & {\n\tliveValue: number;\n};\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n// https://css-tricks.com/html5-progress-element/\nconst createProgressSVG = (state: States): JSX.Element => {\n\tswitch (state._type) {\n\t\tcase 'cycle':\n\t\t\treturn (\n\t\t\t\t<svg width=\"100\" viewBox=\"0 0 12 12\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t\t\t\t<circle fill=\"none\" stroke=\"#efefef\" cx=\"6px\" cy=\"6px\" r=\"5px\"></circle>\n\t\t\t\t\t<circle\n\t\t\t\t\t\tclass=\"cycle\"\n\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\tstroke-dasharray={`${Math.round((state._value / state._max) * 32)}px 32px`}\n\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\tstroke=\"#0075ff\"\n\t\t\t\t\t\tcx=\"6px\"\n\t\t\t\t\t\tcy=\"6px\"\n\t\t\t\t\t\tr=\"5px\"\n\t\t\t\t\t></circle>\n\t\t\t\t</svg>\n\t\t\t);\n\t\tdefault:\n\t\t\treturn (\n\t\t\t\t<svg width=\"100\" viewBox=\"0 0 24 2\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t\t\t\t<line stroke-width=\"2\" x1=\"1\" stroke-linecap=\"round\" y1=\"1\" x2=\"23\" y2=\"1\" fill=\"#efefef\" stroke=\"#efefef\"></line>\n\t\t\t\t\t<line\n\t\t\t\t\t\tclass=\"bar\"\n\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\tx1=\"1\"\n\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\ty1=\"1\"\n\t\t\t\t\t\tx2={`${1 + Math.round((state._value / state._max) * 22)}`}\n\t\t\t\t\t\ty2=\"1\"\n\t\t\t\t\t\tfill=\"#0075ff\"\n\t\t\t\t\t\tstroke=\"#0075ff\"\n\t\t\t\t\t></line>\n\t\t\t\t</svg>\n\t\t\t);\n\t}\n};\n\n@Component({\n\ttag: 'kol-progress',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolProcess implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate interval?: NodeJS.Timer;\n\n\t// https://dequeuniversity.com/library/aria/progress-bar-bounded\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{createProgressSVG(this.state)}\n\t\t\t\t<progress aria-busy={this.state._value < this.state._max ? 'true' : 'false'} max={this.state._max} value={this.state._value}></progress>\n\t\t\t\t<span aria-live=\"polite\" aria-relevant=\"removals text\">\n\t\t\t\t\t{this.state._liveValue} von {this.state._max} {this.state._unit}\n\t\t\t\t</span>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, bei welchem Wert die Fortschrittsanzeige abgeschlossen ist.\n\t */\n\t@Prop() public _max!: number;\n\n\t/**\n\t * Gibt an, ob der Prozess als Balken oder Kreis dargestellt wird.\n\t */\n\t@Prop() public _type?: KoliBriProgressType;\n\n\t/**\n\t * Gibt die Einheit der Fortschrittswerte an.\n\t */\n\t@Prop() public _unit?: string = '%';\n\n\t/**\n\t * Gibt an, wie weit die Anzeige fortgeschritten ist.\n\t */\n\t@Prop() public _value!: number;\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_max: 100,\n\t\t_type: 'bar',\n\t\t_unit: '%',\n\t\t_value: 0,\n\t\t_liveValue: 0,\n\t};\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_max')\n\tpublic validateMax(value?: number): void {\n\t\tif (typeof value !== 'number') {\n\t\t\tvalue = 100;\n\t\t}\n\t\twatchNumber(this, '_max', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_type')\n\tpublic validateType(value?: KoliBriProgressType): void {\n\t\tswitch (value) {\n\t\t\tcase 'cycle':\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tvalue = 'bar';\n\t\t}\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_type: value,\n\t\t};\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_unit')\n\tpublic validateUnit(value?: string): void {\n\t\twatchString(this, '_unit', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_value')\n\tpublic validateValue(value?: number): void {\n\t\tif (typeof value !== 'number') {\n\t\t\tvalue = 0;\n\t\t}\n\t\twatchNumber(this, '_value', value, {\n\t\t\t// max: this._max, TODO as Function\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateMax(this._max);\n\t\tthis.validateType(this._type);\n\t\tthis.validateUnit(this._unit);\n\t\tthis.validateValue(this._value);\n\n\t\tthis.interval = setInterval(() => {\n\t\t\tif (this.state._liveValue !== this.state._value) {\n\t\t\t\tthis.state = {\n\t\t\t\t\t...this.state,\n\t\t\t\t\t_liveValue: this.state._value,\n\t\t\t\t};\n\t\t\t}\n\t\t}, 5000);\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tclearInterval(this.interval as unknown as number);\n\t}\n}\n"],"version":3}
@@ -1,4 +1,4 @@
1
1
  /*!
2
2
  * KoliBri - The accessible HTML-Standard
3
3
  */
4
- import{r as registerInstance,h,H as Host}from"./index-50adf9a0.js";import{w as watchString,a as watchValidator}from"./prop.validators-daa14517.js";import"./a11y.tipps-e0a65f3c.js";import"./dev.utils-bedce29d.js";import"./reuse-56bb5a4b.js";import"./index-81bd9b41.js";const defaultStyleCss=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']),input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],option,select,textarea{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button,input,option,select,textarea{cursor:pointer;font-family:inherit;font-size:inherit}.icon-only>kol-span-wc>span>span{display:none}cite,figure,q+figcaption{display:inline;margin:0;padding:0}blockquote::before{content:open-quote}blockquote::after{content:close-quote}cite::before{content:'—'}.block cite::before{padding-right:0.5em}.inline cite::before{padding:0.5em}",KolQuote=class{constructor(t){registerInstance(this,t),this._caption=void 0,this._href=void 0,this._quote=void 0,this._variant="inline",this.state={_href:"…",_quote:"…",_variant:"inline"}}validateCaption(t){watchString(this,"_caption",t)}validateHref(t){watchString(this,"_href",t,{required:!0})}validateQuote(t){watchString(this,"_quote",t,{required:!0})}validateVariant(t){watchValidator(this,"_variant",(t=>"block"===t||"inline"===t),new Set(["block","inline"]),t)}componentWillLoad(){this.validateCaption(this._caption),this.validateHref(this._href),this.validateQuote(this._quote),this.validateVariant(this._variant)}render(){const t=""!==this.state._quote;return h(Host,null,h("figure",{class:{[this.state._variant]:!0}},"block"===this.state._variant?h("blockquote",{cite:this.state._href},this.state._quote,h("span",{"aria-hidden":t?"true":void 0,hidden:t},h("slot",{name:"expert"}))):h("q",{cite:this.state._href},this.state._quote,h("span",{"aria-hidden":t?"true":void 0,hidden:t},h("slot",{name:"expert"}))),"string"==typeof this.state._caption&&this.state._caption.length>0&&h("figcaption",null,h("cite",null,h("kol-link",{_href:this.state._href,_label:this.state._caption,_target:"_blank"})))))}static get watchers(){return{_caption:["validateCaption"],_href:["validateHref"],_quote:["validateQuote"],_variant:["validateVariant"]}}};KolQuote.style={default:defaultStyleCss};export{KolQuote as kol_quote};
4
+ import{r as registerInstance,h,H as Host}from"./index-50adf9a0.js";import{w as watchString,a as watchValidator}from"./prop.validators-1f3db013.js";import"./a11y.tipps-5ca36877.js";import"./dev.utils-bedce29d.js";import"./reuse-56bb5a4b.js";import"./index-81bd9b41.js";const defaultStyleCss=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']),input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],option,select,textarea{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button,input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],option,select{cursor:pointer;font-family:inherit;font-size:inherit}.icon-only>kol-span-wc>span>span{display:none}cite,figure,q+figcaption{display:inline;margin:0;padding:0}blockquote::before{content:open-quote}blockquote::after{content:close-quote}cite::before{content:'—'}.block cite::before{padding-right:0.5em}.inline cite::before{padding:0.5em}",KolQuote=class{constructor(t){registerInstance(this,t),this._caption=void 0,this._href=void 0,this._quote=void 0,this._variant="inline",this.state={_href:"…",_quote:"…",_variant:"inline"}}validateCaption(t){watchString(this,"_caption",t)}validateHref(t){watchString(this,"_href",t,{required:!0})}validateQuote(t){watchString(this,"_quote",t,{required:!0})}validateVariant(t){watchValidator(this,"_variant",(t=>"block"===t||"inline"===t),new Set(["block","inline"]),t)}componentWillLoad(){this.validateCaption(this._caption),this.validateHref(this._href),this.validateQuote(this._quote),this.validateVariant(this._variant)}render(){const t=""!==this.state._quote;return h(Host,null,h("figure",{class:{[this.state._variant]:!0}},"block"===this.state._variant?h("blockquote",{cite:this.state._href},this.state._quote,h("span",{"aria-hidden":t?"true":void 0,hidden:t},h("slot",{name:"expert"}))):h("q",{cite:this.state._href},this.state._quote,h("span",{"aria-hidden":t?"true":void 0,hidden:t},h("slot",{name:"expert"}))),"string"==typeof this.state._caption&&this.state._caption.length>0&&h("figcaption",null,h("cite",null,h("kol-link",{_href:this.state._href,_label:this.state._caption,_target:"_blank"})))))}static get watchers(){return{_caption:["validateCaption"],_href:["validateHref"],_quote:["validateQuote"],_variant:["validateVariant"]}}};KolQuote.style={default:defaultStyleCss};export{KolQuote as kol_quote};
@@ -1 +1 @@
1
- {"file":"kol-quote.entry.js","mappings":";;;;;;;;;;AAAA,MAAM,eAAe,GAAG,gmCAAgmC;;MCW3mC,QAAQ;;;;;;oBAmB4B,QAAQ;iBAExB;MAC/B,KAAK,EAAE,GAAG;MACV,MAAM,EAAE,GAAG;MACX,QAAQ,EAAE,QAAQ;KAClB;;EAGM,eAAe,CAAC,KAAc;IACpC,WAAW,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC;GACrC;EAGM,YAAY,CAAC,KAAc;IACjC,WAAW,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE;MACjC,QAAQ,EAAE,IAAI;KACd,CAAC,CAAC;GACH;EAGM,aAAa,CAAC,KAAc;IAClC,WAAW,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE;MAClC,QAAQ,EAAE,IAAI;KACd,CAAC,CAAC;GACH;EAGM,eAAe,CAAC,KAA2B;IACjD,cAAc,CAAC,IAAI,EAAE,UAAU,EAAE,CAAC,KAAK,KAAK,KAAK,KAAK,OAAO,IAAI,KAAK,KAAK,QAAQ,EAAE,IAAI,GAAG,CAAC,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC;GAC1H;EAEM,iBAAiB;IACvB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IACpC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC9B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAChC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;GACpC;EAEM,MAAM;IACZ,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,KAAK,EAAE,CAAC;IAChD,QACC,EAAC,IAAI,QACJ,cACC,KAAK,EAAE;QACN,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,IAAI;OAC3B,IAEA,IAAI,CAAC,KAAK,CAAC,QAAQ,KAAK,OAAO,IAC/B,kBAAY,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,IAChC,IAAI,CAAC,KAAK,CAAC,MAAM,EAClB,2BAAmB,cAAc,GAAG,MAAM,GAAG,SAAS,EAAE,MAAM,EAAE,cAAc,IAC7E,YAAM,IAAI,EAAC,QAAQ,GAAG,CAChB,CACK,KAEb,SAAG,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,IACvB,IAAI,CAAC,KAAK,CAAC,MAAM,EAClB,2BAAmB,cAAc,GAAG,MAAM,GAAG,SAAS,EAAE,MAAM,EAAE,cAAc,IAC7E,YAAM,IAAI,EAAC,QAAQ,GAAG,CAChB,CACJ,CACJ,EACA,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,KAAK,QAAQ,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,KACzE,sBACC,gBACC,gBAAU,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,OAAO,EAAC,QAAQ,GAAG,CAC7E,CACK,CACb,CACO,CACH,EACN;GACF;;;;;;;;;;;;;;","names":[],"sources":["./src/components/quote/style.css?tag=kol-quote&mode=default&encapsulation=shadow","./src/components/quote/shadow.tsx"],"sourcesContent":["@import '../style.css';\n\ncite,\nfigure,\nq + figcaption {\n\tdisplay: inline;\n\tmargin: 0;\n\tpadding: 0;\n}\n\nblockquote::before {\n\tcontent: open-quote;\n}\nblockquote::after {\n\tcontent: close-quote;\n}\n\ncite::before {\n\tcontent: '—';\n}\n.block cite::before {\n\tpadding-right: 0.5em;\n}\n.inline cite::before {\n\tpadding: 0.5em;\n}\n","import { h, Component, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { watchString, watchValidator } from '../../utils/prop.validators';\nimport { ComponentApi, KoliBriQuoteVariant, States } from './types';\n\n@Component({\n\ttag: 'kol-quote',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolQuote implements ComponentApi {\n\t/**\n\t * The caption of the quote.\n\t */\n\t@Prop() public _caption?: string;\n\n\t/**\n\t * The href is a URL that designates a source document or message for the information quoted.\n\t */\n\t@Prop() public _href!: string;\n\n\t/**\n\t * The text of the quote.\n\t */\n\t@Prop() public _quote!: string;\n\n\t/**\n\t * The variant of the quote.\n\t */\n\t@Prop() public _variant?: KoliBriQuoteVariant = 'inline';\n\n\t@State() public state: States = {\n\t\t_href: '…', // ⚠ required\n\t\t_quote: '…', // ⚠ required\n\t\t_variant: 'inline',\n\t};\n\n\t@Watch('_caption')\n\tpublic validateCaption(value?: string): void {\n\t\twatchString(this, '_caption', value);\n\t}\n\n\t@Watch('_href')\n\tpublic validateHref(value?: string): void {\n\t\twatchString(this, '_href', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t@Watch('_quote')\n\tpublic validateQuote(value?: string): void {\n\t\twatchString(this, '_quote', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t@Watch('_variant')\n\tpublic validateVariant(value?: KoliBriQuoteVariant): void {\n\t\twatchValidator(this, '_variant', (value) => value === 'block' || value === 'inline', new Set(['block', 'inline']), value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateCaption(this._caption);\n\t\tthis.validateHref(this._href);\n\t\tthis.validateQuote(this._quote);\n\t\tthis.validateVariant(this._variant);\n\t}\n\n\tpublic render(): JSX.Element {\n\t\tconst hideExpertSlot = this.state._quote !== '';\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<figure\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[this.state._variant]: true,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{this.state._variant === 'block' ? (\n\t\t\t\t\t\t<blockquote cite={this.state._href}>\n\t\t\t\t\t\t\t{this.state._quote}\n\t\t\t\t\t\t\t<span aria-hidden={hideExpertSlot ? 'true' : undefined} hidden={hideExpertSlot}>\n\t\t\t\t\t\t\t\t<slot name=\"expert\" />\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</blockquote>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<q cite={this.state._href}>\n\t\t\t\t\t\t\t{this.state._quote}\n\t\t\t\t\t\t\t<span aria-hidden={hideExpertSlot ? 'true' : undefined} hidden={hideExpertSlot}>\n\t\t\t\t\t\t\t\t<slot name=\"expert\" />\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</q>\n\t\t\t\t\t)}\n\t\t\t\t\t{typeof this.state._caption === 'string' && this.state._caption.length > 0 && (\n\t\t\t\t\t\t<figcaption>\n\t\t\t\t\t\t\t<cite>\n\t\t\t\t\t\t\t\t<kol-link _href={this.state._href} _label={this.state._caption} _target=\"_blank\" />\n\t\t\t\t\t\t\t</cite>\n\t\t\t\t\t\t</figcaption>\n\t\t\t\t\t)}\n\t\t\t\t</figure>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}
1
+ {"file":"kol-quote.entry.js","mappings":";;;;;;;;;;AAAA,MAAM,eAAe,GAAG,mqCAAmqC;;MCW9qC,QAAQ;;;;;;oBAmB4B,QAAQ;iBAExB;MAC/B,KAAK,EAAE,GAAG;MACV,MAAM,EAAE,GAAG;MACX,QAAQ,EAAE,QAAQ;KAClB;;EAGM,eAAe,CAAC,KAAc;IACpC,WAAW,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC;GACrC;EAGM,YAAY,CAAC,KAAc;IACjC,WAAW,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE;MACjC,QAAQ,EAAE,IAAI;KACd,CAAC,CAAC;GACH;EAGM,aAAa,CAAC,KAAc;IAClC,WAAW,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE;MAClC,QAAQ,EAAE,IAAI;KACd,CAAC,CAAC;GACH;EAGM,eAAe,CAAC,KAA2B;IACjD,cAAc,CAAC,IAAI,EAAE,UAAU,EAAE,CAAC,KAAK,KAAK,KAAK,KAAK,OAAO,IAAI,KAAK,KAAK,QAAQ,EAAE,IAAI,GAAG,CAAC,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC;GAC1H;EAEM,iBAAiB;IACvB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IACpC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC9B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAChC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;GACpC;EAEM,MAAM;IACZ,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,KAAK,EAAE,CAAC;IAChD,QACC,EAAC,IAAI,QACJ,cACC,KAAK,EAAE;QACN,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,IAAI;OAC3B,IAEA,IAAI,CAAC,KAAK,CAAC,QAAQ,KAAK,OAAO,IAC/B,kBAAY,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,IAChC,IAAI,CAAC,KAAK,CAAC,MAAM,EAClB,2BAAmB,cAAc,GAAG,MAAM,GAAG,SAAS,EAAE,MAAM,EAAE,cAAc,IAC7E,YAAM,IAAI,EAAC,QAAQ,GAAG,CAChB,CACK,KAEb,SAAG,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,IACvB,IAAI,CAAC,KAAK,CAAC,MAAM,EAClB,2BAAmB,cAAc,GAAG,MAAM,GAAG,SAAS,EAAE,MAAM,EAAE,cAAc,IAC7E,YAAM,IAAI,EAAC,QAAQ,GAAG,CAChB,CACJ,CACJ,EACA,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,KAAK,QAAQ,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,KACzE,sBACC,gBACC,gBAAU,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,OAAO,EAAC,QAAQ,GAAG,CAC7E,CACK,CACb,CACO,CACH,EACN;GACF;;;;;;;;;;;;;;","names":[],"sources":["./src/components/quote/style.css?tag=kol-quote&mode=default&encapsulation=shadow","./src/components/quote/shadow.tsx"],"sourcesContent":["@import '../style.css';\n\ncite,\nfigure,\nq + figcaption {\n\tdisplay: inline;\n\tmargin: 0;\n\tpadding: 0;\n}\n\nblockquote::before {\n\tcontent: open-quote;\n}\nblockquote::after {\n\tcontent: close-quote;\n}\n\ncite::before {\n\tcontent: '—';\n}\n.block cite::before {\n\tpadding-right: 0.5em;\n}\n.inline cite::before {\n\tpadding: 0.5em;\n}\n","import { h, Component, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { watchString, watchValidator } from '../../utils/prop.validators';\nimport { ComponentApi, KoliBriQuoteVariant, States } from './types';\n\n@Component({\n\ttag: 'kol-quote',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolQuote implements ComponentApi {\n\t/**\n\t * The caption of the quote.\n\t */\n\t@Prop() public _caption?: string;\n\n\t/**\n\t * The href is a URL that designates a source document or message for the information quoted.\n\t */\n\t@Prop() public _href!: string;\n\n\t/**\n\t * The text of the quote.\n\t */\n\t@Prop() public _quote!: string;\n\n\t/**\n\t * The variant of the quote.\n\t */\n\t@Prop() public _variant?: KoliBriQuoteVariant = 'inline';\n\n\t@State() public state: States = {\n\t\t_href: '…', // ⚠ required\n\t\t_quote: '…', // ⚠ required\n\t\t_variant: 'inline',\n\t};\n\n\t@Watch('_caption')\n\tpublic validateCaption(value?: string): void {\n\t\twatchString(this, '_caption', value);\n\t}\n\n\t@Watch('_href')\n\tpublic validateHref(value?: string): void {\n\t\twatchString(this, '_href', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t@Watch('_quote')\n\tpublic validateQuote(value?: string): void {\n\t\twatchString(this, '_quote', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t@Watch('_variant')\n\tpublic validateVariant(value?: KoliBriQuoteVariant): void {\n\t\twatchValidator(this, '_variant', (value) => value === 'block' || value === 'inline', new Set(['block', 'inline']), value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateCaption(this._caption);\n\t\tthis.validateHref(this._href);\n\t\tthis.validateQuote(this._quote);\n\t\tthis.validateVariant(this._variant);\n\t}\n\n\tpublic render(): JSX.Element {\n\t\tconst hideExpertSlot = this.state._quote !== '';\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<figure\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[this.state._variant]: true,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{this.state._variant === 'block' ? (\n\t\t\t\t\t\t<blockquote cite={this.state._href}>\n\t\t\t\t\t\t\t{this.state._quote}\n\t\t\t\t\t\t\t<span aria-hidden={hideExpertSlot ? 'true' : undefined} hidden={hideExpertSlot}>\n\t\t\t\t\t\t\t\t<slot name=\"expert\" />\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</blockquote>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<q cite={this.state._href}>\n\t\t\t\t\t\t\t{this.state._quote}\n\t\t\t\t\t\t\t<span aria-hidden={hideExpertSlot ? 'true' : undefined} hidden={hideExpertSlot}>\n\t\t\t\t\t\t\t\t<slot name=\"expert\" />\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</q>\n\t\t\t\t\t)}\n\t\t\t\t\t{typeof this.state._caption === 'string' && this.state._caption.length > 0 && (\n\t\t\t\t\t\t<figcaption>\n\t\t\t\t\t\t\t<cite>\n\t\t\t\t\t\t\t\t<kol-link _href={this.state._href} _label={this.state._caption} _target=\"_blank\" />\n\t\t\t\t\t\t\t</cite>\n\t\t\t\t\t\t</figcaption>\n\t\t\t\t\t)}\n\t\t\t\t</figure>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}
@@ -1,4 +1,4 @@
1
1
  /*!
2
2
  * KoliBri - The accessible HTML-Standard
3
3
  */
4
- import{h,H as Host,r as registerInstance,g as getElement}from"./index-50adf9a0.js";import{S as STATE_CHANGE_EVENT,a as propergateFocus}from"./reuse-56bb5a4b.js";import{g as getRenderStates}from"./controller-6ba588d9.js";import{w as watchString,d as watchJsonArrayString,b as watchBoolean,e as watchNumber}from"./prop.validators-daa14517.js";import{I as InputIconController}from"./controller-icon-4bce436b.js";import{f as fillKeyOptionMap}from"./controller-0b6f277d.js";import{a as a11yHint}from"./a11y.tipps-e0a65f3c.js";import{h as hasEnoughReadableChars,c as containsOnlyNumbers}from"./label-f8bdc301.js";import"./tab-index-dc6e8ba5.js";import"./dev.utils-bedce29d.js";import"./index-81bd9b41.js";import"./icon-a88dcc85.js";const validateInputSelectList=t=>{if("object"==typeof t&&null!==t){if("string"==typeof t.label&&t.label.length>0)return t.disabled=!0===t.disabled,t.label=`${t.label}`.trim(),!1===hasEnoughReadableChars(t.label,3)&&!1===containsOnlyNumbers(t.label)&&a11yHint(`Ein abweichendes Aria-Label (${t.label}) ist nicht barrierefrei. Ein abweichendes Aria-Label sollte aus mindestens drei lesbaren Zeichen bestehen.`),!Array.isArray(t.options)||void 0===t.options.find((t=>!1===validateInputSelectList(t)));if("number"==typeof t.label)return!0}return!1};class SelectController extends InputIconController{constructor(t,e,i){super(t,e,i),this.keyOptionMap=new Map,this.getOptionByKey=t=>this.keyOptionMap.get(t),this.isValueInOptions=(t,e)=>void 0!==e.find((e=>"string"==typeof e.value?e.value===t:!!Array.isArray(e.options)&&this.isValueInOptions(t,e.options))),this.filterValuesInOptions=(t,e)=>t.filter((t=>void 0!==this.isValueInOptions(t,e))),this.beforePatchListValue=(t,e)=>{const i=e.has("_list")?e.get("_list"):this.component.state._list;if(Array.isArray(i)&&i.length>0){this.keyOptionMap.clear(),fillKeyOptionMap(this.keyOptionMap,i);const t=e.has("_value")?e.get("_value"):this.component.state._value,a=this.filterValuesInOptions(Array.isArray(t)&&t.length>0?t:[],i);!1===this.component._multiple&&0===a.length?(e.set("_value",[i[0].value]),this.onStateChange()):Array.isArray(t)&&a.length<t.length&&(e.set("_value",a),this.onStateChange())}},this.component=t}validateHeight(t){watchString(this.component,"_height",t)}validateList(t){watchJsonArrayString(this.component,"_list",validateInputSelectList,t,void 0,{hooks:{beforePatch:this.beforePatchListValue}})}validateMultiple(t){watchBoolean(this.component,"_multiple",t,{hooks:{beforePatch:this.beforePatchListValue}})}validateRequired(t){watchBoolean(this.component,"_required",t)}validateSize(t){watchNumber(this.component,"_size",t,{min:1})}validateValue(t){watchJsonArrayString(this.component,"_value",(()=>!0),t,void 0,{hooks:{beforePatch:this.beforePatchListValue}}),this.setFormAssociatedValue(this.component._value)}componentWillLoad(t){super.componentWillLoad(),this.onStateChange=()=>{if("function"==typeof t){const e=setTimeout((()=>{clearTimeout(e),t(STATE_CHANGE_EVENT)}))}},this.validateHeight(this.component._height),this.validateList(this.component._list),this.validateMultiple(this.component._multiple),this.validateRequired(this.component._required),this.validateSize(this.component._size),this.validateValue(this.component._value)}}const defaultStyleCss=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']),input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],option,select,textarea{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button,input,option,select,textarea{cursor:pointer;font-family:inherit;font-size:inherit}.icon-only>kol-span-wc>span>span{display:none}.required *[id*='-label']>span::after{content:'*';padding-left:0.125em}:host{display:block}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select[multiple] option,select:not([multiple]),textarea{font-size:1rem;padding:0 0.5em}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}:is(button,input,option,select,textarea):disabled,.kol-cursor-not-allowed,.kol-cursor-not-allowed *{cursor:not-allowed}kol-input{display:grid}input,option,select,textarea{display:block;line-height:2.5em;width:100%}input,select:not([multiple]){height:2.75em}.icons{display:flex;justify-content:space-between;height:0}.icons>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center;width:2.5em}.icon-left input,.icon-left select{padding-left:var(--a11y-min-size)}kol-button-wc{position:relative;float:right;z-index:1000;margin-top:calc(-1 * var(--a11y-min-size))}.icon-right kol-button-wc{margin-right:var(--a11y-min-size)}.disabled{opacity:0.5}",isSelected=(t,e)=>Array.isArray(t)&&t.includes(e),KolSelect=class{renderOptgroup(t,e){var i;return h("optgroup",{disabled:!0===t.disabled,label:t.label},null===(i=t.options)||void 0===i?void 0:i.map(((t,i)=>{const a=`${e}-${i}`;return Array.isArray(t.options)?this.renderOptgroup(t,a):h("option",{disabled:!0===t.disabled,key:a,selected:isSelected(this.state._value,t.value),value:a},t.label)})))}render(){const{ariaDiscribedBy:t}=getRenderStates(this.state);return h(Host,null,h("kol-input",{_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_required:this.state._required,_touched:this.state._touched},h("span",{slot:"label"},h("slot",null)),h("select",Object.assign({ref:this.catchRef,part:"select",title:"",accessKey:this.state._accessKey,"aria-describedby":t.length>0?t.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,multiple:this.state._multiple,name:this.state._name,required:this.state._required,size:this.state._size,slot:"input",spellcheck:"false",style:{height:this.state._height}},{onClick:this.controller.onFacade.onClick,onBlur:this.controller.onFacade.onBlur,onFocus:this.controller.onFacade.onFocus},{onChange:this.onChange}),this.state._list.map(((t,e)=>{const i=`-${e}`;return Array.isArray(t.options)?this.renderOptgroup(t,i):h("option",{disabled:!0===t.disabled,key:i,selected:isSelected(this.state._value,t.value),value:i},t.label)})))))}constructor(t){registerInstance(this,t),this.catchRef=t=>{this.ref=t,propergateFocus(this.host,this.ref)},this.onChange=t=>{var e,i;this._value=Array.from((null===(e=this.ref)||void 0===e?void 0:e.options)||[]).filter((t=>!0===t.selected)).map((t=>{var e;return null===(e=this.controller.getOptionByKey(t.value))||void 0===e?void 0:e.value})),this.controller.setFormAssociatedValue(this._value),"function"==typeof(null===(i=this.state._on)||void 0===i?void 0:i.onChange)&&this.state._on.onChange(t,this._value)},this._accessKey=void 0,this._alert=!0,this._disabled=void 0,this._error=void 0,this._height=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._list=void 0,this._multiple=!1,this._name=void 0,this._on=void 0,this._required=void 0,this._size=void 0,this._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_height:"",_id:"…",_list:[],_multiple:!1,_value:[]},this.controller=new SelectController(this,"textarea",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHeight(t){this.controller.validateHeight(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateList(t){this.controller.validateList(t)}validateMultiple(t){this.controller.validateMultiple(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validateRequired(t){this.controller.validateRequired(t)}validateSize(t){this.controller.validateSize(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateValue(t){this.controller.validateValue(t)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(this.onChange)}get host(){return getElement(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_disabled:["validateDisabled"],_error:["validateError"],_height:["validateHeight"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_list:["validateList"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_size:["validateSize"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};KolSelect.style={default:defaultStyleCss};export{KolSelect as kol_select};
4
+ import{h,H as Host,r as registerInstance,g as getElement}from"./index-50adf9a0.js";import{S as STATE_CHANGE_EVENT,a as propergateFocus}from"./reuse-56bb5a4b.js";import{g as getRenderStates}from"./controller-4f4582b7.js";import{w as watchString,d as watchJsonArrayString,b as watchBoolean,e as watchNumber}from"./prop.validators-1f3db013.js";import{I as InputIconController}from"./controller-icon-fb82236a.js";import{f as fillKeyOptionMap}from"./controller-ca954299.js";import{a as a11yHint}from"./a11y.tipps-5ca36877.js";import{h as hasEnoughReadableChars,c as containsOnlyNumbers}from"./label-966377c0.js";import"./tab-index-97fed287.js";import"./dev.utils-bedce29d.js";import"./index-81bd9b41.js";import"./icon-970694a7.js";const validateInputSelectList=t=>{if("object"==typeof t&&null!==t){if("string"==typeof t.label&&t.label.length>0)return t.disabled=!0===t.disabled,t.label=`${t.label}`.trim(),!1===hasEnoughReadableChars(t.label,3)&&!1===containsOnlyNumbers(t.label)&&a11yHint(`Ein abweichendes Aria-Label (${t.label}) ist nicht barrierefrei. Ein abweichendes Aria-Label sollte aus mindestens drei lesbaren Zeichen bestehen.`),!Array.isArray(t.options)||void 0===t.options.find((t=>!1===validateInputSelectList(t)));if("number"==typeof t.label)return!0}return!1};class SelectController extends InputIconController{constructor(t,e,i){super(t,e,i),this.keyOptionMap=new Map,this.getOptionByKey=t=>this.keyOptionMap.get(t),this.isValueInOptions=(t,e)=>void 0!==e.find((e=>"string"==typeof e.value?e.value===t:!!Array.isArray(e.options)&&this.isValueInOptions(t,e.options))),this.filterValuesInOptions=(t,e)=>t.filter((t=>void 0!==this.isValueInOptions(t,e))),this.beforePatchListValue=(t,e)=>{const i=e.has("_list")?e.get("_list"):this.component.state._list;if(Array.isArray(i)&&i.length>0){this.keyOptionMap.clear(),fillKeyOptionMap(this.keyOptionMap,i);const t=e.has("_value")?e.get("_value"):this.component.state._value,a=this.filterValuesInOptions(Array.isArray(t)&&t.length>0?t:[],i);!1===this.component._multiple&&0===a.length?(e.set("_value",[i[0].value]),this.onStateChange()):Array.isArray(t)&&a.length<t.length&&(e.set("_value",a),this.onStateChange())}},this.component=t}validateHeight(t){watchString(this.component,"_height",t)}validateList(t){watchJsonArrayString(this.component,"_list",validateInputSelectList,t,void 0,{hooks:{beforePatch:this.beforePatchListValue}})}validateMultiple(t){watchBoolean(this.component,"_multiple",t,{hooks:{beforePatch:this.beforePatchListValue}})}validateRequired(t){watchBoolean(this.component,"_required",t)}validateSize(t){watchNumber(this.component,"_size",t,{min:1})}validateValue(t){watchJsonArrayString(this.component,"_value",(()=>!0),t,void 0,{hooks:{beforePatch:this.beforePatchListValue}}),this.setFormAssociatedValue(this.component._value)}componentWillLoad(t){super.componentWillLoad(),this.onStateChange=()=>{if("function"==typeof t){const e=setTimeout((()=>{clearTimeout(e),t(STATE_CHANGE_EVENT)}))}},this.validateHeight(this.component._height),this.validateList(this.component._list),this.validateMultiple(this.component._multiple),this.validateRequired(this.component._required),this.validateSize(this.component._size),this.validateValue(this.component._value)}}const defaultStyleCss=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']),input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],option,select,textarea{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button,input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],option,select{cursor:pointer;font-family:inherit;font-size:inherit}.icon-only>kol-span-wc>span>span{display:none}.required *[id*='-label']>span::after{content:'*';padding-left:0.125em}:host{display:block}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select[multiple] option,select:not([multiple]),textarea{font-size:1rem;padding:0 0.5em}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}:is(button,input,option,select,textarea):disabled,.kol-cursor-not-allowed,.kol-cursor-not-allowed *{cursor:not-allowed}kol-input{display:grid}input,option,select,textarea{display:block;line-height:2.5em;flex-grow:1}div.input{display:flex}div.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center;width:2.5em}input,select:not([multiple]){height:2.75em}.disabled{opacity:0.5}",isSelected=(t,e)=>Array.isArray(t)&&t.includes(e),KolSelect=class{renderOptgroup(t,e){var i;return h("optgroup",{disabled:!0===t.disabled,label:t.label},null===(i=t.options)||void 0===i?void 0:i.map(((t,i)=>{const a=`${e}-${i}`;return Array.isArray(t.options)?this.renderOptgroup(t,a):h("option",{disabled:!0===t.disabled,key:a,selected:isSelected(this.state._value,t.value),value:a},t.label)})))}render(){const{ariaDiscribedBy:t}=getRenderStates(this.state);return h(Host,null,h("kol-input",{_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_required:this.state._required,_touched:this.state._touched},h("span",{slot:"label"},h("slot",null)),h("select",Object.assign({ref:this.catchRef,part:"select",title:"",accessKey:this.state._accessKey,"aria-describedby":t.length>0?t.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,multiple:this.state._multiple,name:this.state._name,required:this.state._required,size:this.state._size,slot:"input",spellcheck:"false",style:{height:this.state._height}},{onClick:this.controller.onFacade.onClick,onBlur:this.controller.onFacade.onBlur,onFocus:this.controller.onFacade.onFocus},{onChange:this.onChange}),this.state._list.map(((t,e)=>{const i=`-${e}`;return Array.isArray(t.options)?this.renderOptgroup(t,i):h("option",{disabled:!0===t.disabled,key:i,selected:isSelected(this.state._value,t.value),value:i},t.label)})))))}constructor(t){registerInstance(this,t),this.catchRef=t=>{this.ref=t,propergateFocus(this.host,this.ref)},this.onChange=t=>{var e,i;this._value=Array.from((null===(e=this.ref)||void 0===e?void 0:e.options)||[]).filter((t=>!0===t.selected)).map((t=>{var e;return null===(e=this.controller.getOptionByKey(t.value))||void 0===e?void 0:e.value})),this.controller.setFormAssociatedValue(this._value),"function"==typeof(null===(i=this.state._on)||void 0===i?void 0:i.onChange)&&this.state._on.onChange(t,this._value)},this._accessKey=void 0,this._alert=!0,this._disabled=void 0,this._error=void 0,this._height=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._list=void 0,this._multiple=!1,this._name=void 0,this._on=void 0,this._required=void 0,this._size=void 0,this._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_height:"",_id:"…",_list:[],_multiple:!1,_value:[]},this.controller=new SelectController(this,"textarea",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHeight(t){this.controller.validateHeight(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateList(t){this.controller.validateList(t)}validateMultiple(t){this.controller.validateMultiple(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validateRequired(t){this.controller.validateRequired(t)}validateSize(t){this.controller.validateSize(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateValue(t){this.controller.validateValue(t)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(this.onChange)}get host(){return getElement(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_disabled:["validateDisabled"],_error:["validateError"],_height:["validateHeight"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_list:["validateList"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_size:["validateSize"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};KolSelect.style={default:defaultStyleCss};export{KolSelect as kol_select};