@gov-design-system-ce/components 0.0.36 → 0.0.38

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 (490) hide show
  1. package/dist/cjs/{constants-245999e7.js → constants-ff12205f.js} +1 -1
  2. package/dist/cjs/constants-ff12205f.js.map +1 -0
  3. package/dist/cjs/core.cjs.js +1 -1
  4. package/dist/cjs/{form-62c6a8c6.js → form-f68d13c6.js} +2 -2
  5. package/dist/cjs/form-f68d13c6.js.map +1 -0
  6. package/dist/cjs/gov-accordion.cjs.entry.js +2 -2
  7. package/dist/cjs/gov-alert.cjs.entry.js +2 -2
  8. package/dist/cjs/gov-alert.cjs.entry.js.map +1 -1
  9. package/dist/cjs/gov-app.cjs.entry.js +1122 -663
  10. package/dist/cjs/gov-app.cjs.entry.js.map +1 -1
  11. package/dist/cjs/gov-attachments_3.cjs.entry.js +2 -2
  12. package/dist/cjs/gov-backdrop.cjs.entry.js +2 -2
  13. package/dist/cjs/gov-badge.cjs.entry.js +2 -2
  14. package/dist/cjs/gov-badge.cjs.entry.js.map +1 -1
  15. package/dist/cjs/gov-breadcrumbs.cjs.entry.js +2 -2
  16. package/dist/cjs/gov-button.cjs.entry.js +4 -4
  17. package/dist/cjs/gov-button.cjs.entry.js.map +1 -1
  18. package/dist/cjs/gov-card.cjs.entry.js +2 -2
  19. package/dist/cjs/gov-control-group.cjs.entry.js +42 -0
  20. package/dist/cjs/gov-control-group.cjs.entry.js.map +1 -0
  21. package/dist/cjs/gov-dropdown.cjs.entry.js +129 -0
  22. package/dist/cjs/gov-dropdown.cjs.entry.js.map +1 -0
  23. package/dist/cjs/gov-form-checkbox.cjs.entry.js +3 -3
  24. package/dist/cjs/gov-form-control.cjs.entry.js +35 -7
  25. package/dist/cjs/gov-form-control.cjs.entry.js.map +1 -1
  26. package/dist/cjs/gov-form-file.cjs.entry.js +4 -4
  27. package/dist/cjs/gov-form-file.cjs.entry.js.map +1 -1
  28. package/dist/cjs/gov-form-input.cjs.entry.js +6 -6
  29. package/dist/cjs/gov-form-input.cjs.entry.js.map +1 -1
  30. package/dist/cjs/gov-form-label.cjs.entry.js +1 -1
  31. package/dist/cjs/gov-form-label.cjs.entry.js.map +1 -1
  32. package/dist/cjs/gov-form-multi-select.cjs.entry.js +4 -4
  33. package/dist/cjs/gov-form-multi-select.cjs.entry.js.map +1 -1
  34. package/dist/cjs/gov-form-radio.cjs.entry.js +3 -3
  35. package/dist/cjs/gov-form-search.cjs.entry.js +5 -1
  36. package/dist/cjs/gov-form-search.cjs.entry.js.map +1 -1
  37. package/dist/cjs/gov-form-select.cjs.entry.js +20 -10
  38. package/dist/cjs/gov-form-select.cjs.entry.js.map +1 -1
  39. package/dist/cjs/gov-form-switch.cjs.entry.js +3 -3
  40. package/dist/cjs/gov-icon.cjs.entry.js +2 -2
  41. package/dist/cjs/gov-modal.cjs.entry.js +2 -2
  42. package/dist/cjs/gov-nav.cjs.entry.js +2 -2
  43. package/dist/cjs/gov-pagination.cjs.entry.js +2 -2
  44. package/dist/cjs/gov-prompt.cjs.entry.js +2 -2
  45. package/dist/cjs/gov-side-nav.cjs.entry.js +2 -2
  46. package/dist/cjs/gov-skeleton.cjs.entry.js +2 -2
  47. package/dist/cjs/gov-tabs.cjs.entry.js +2 -2
  48. package/dist/cjs/gov-wizzard-item.cjs.entry.js +13 -15
  49. package/dist/cjs/gov-wizzard-item.cjs.entry.js.map +1 -1
  50. package/dist/cjs/gov-wizzard.cjs.entry.js +2 -2
  51. package/dist/cjs/index-29ac07f6.js +8 -0
  52. package/dist/cjs/loader.cjs.js +1 -1
  53. package/dist/cjs/{wcag-6efc0ab7.js → wcag-b0321f09.js} +2 -2
  54. package/dist/cjs/{wcag-6efc0ab7.js.map → wcag-b0321f09.js.map} +1 -1
  55. package/dist/cjs/{win-84bda0aa.js → win-53f637d4.js} +3 -2
  56. package/dist/cjs/win-53f637d4.js.map +1 -0
  57. package/dist/collection/collection-manifest.json +3 -1
  58. package/dist/collection/components/gov-accordion/gov-accordion-item.css +6 -0
  59. package/dist/collection/components/gov-accordion/gov-accordion.css +6 -0
  60. package/dist/collection/components/gov-alert/gov-alert.css +6 -0
  61. package/dist/collection/components/gov-alert/gov-alert.js.map +1 -1
  62. package/dist/collection/components/gov-app/gov-app.css +6 -0
  63. package/dist/collection/components/gov-app/gov-app.js +10 -8
  64. package/dist/collection/components/gov-app/gov-app.js.map +1 -1
  65. package/dist/collection/components/gov-attachments/gov-attachments-item.css +6 -0
  66. package/dist/collection/components/gov-attachments/gov-attachments.css +6 -0
  67. package/dist/collection/components/gov-backdrop/gov-backdrop.css +6 -0
  68. package/dist/collection/components/gov-badge/gov-badge.css +9 -3
  69. package/dist/collection/components/gov-badge/gov-badge.js +4 -4
  70. package/dist/collection/components/gov-badge/gov-badge.js.map +1 -1
  71. package/dist/collection/components/gov-breadcrumbs/gov-breadcrumbs.css +6 -0
  72. package/dist/collection/components/gov-button/{constants.js → default/constants.js} +3 -3
  73. package/dist/collection/components/gov-button/default/constants.js.map +1 -0
  74. package/dist/collection/components/gov-button/{gov-button.css → default/gov-button.css} +6 -3
  75. package/dist/collection/components/gov-button/{gov-button.js → default/gov-button.js} +7 -7
  76. package/dist/collection/components/gov-button/default/gov-button.js.map +1 -0
  77. package/dist/collection/components/gov-button/default/gov-button.types.js.map +1 -0
  78. package/dist/collection/components/gov-button/dropdown/constants.js +10 -0
  79. package/dist/collection/components/gov-button/dropdown/constants.js.map +1 -0
  80. package/dist/collection/components/gov-button/dropdown/gov-dropdown.css +263 -0
  81. package/dist/collection/components/gov-button/dropdown/gov-dropdown.js +148 -0
  82. package/dist/collection/components/gov-button/dropdown/gov-dropdown.js.map +1 -0
  83. package/dist/collection/components/gov-button/dropdown/gov-dropdown.types.js +2 -0
  84. package/dist/collection/components/gov-button/dropdown/gov-dropdown.types.js.map +1 -0
  85. package/dist/collection/components/gov-card/gov-card.css +6 -0
  86. package/dist/collection/components/gov-container/gov-container.css +6 -0
  87. package/dist/collection/components/gov-control-group/constants.js +7 -0
  88. package/dist/collection/components/gov-control-group/constants.js.map +1 -0
  89. package/dist/collection/components/gov-control-group/gov-control-group.css +259 -0
  90. package/dist/collection/components/gov-control-group/gov-control-group.js +83 -0
  91. package/dist/collection/components/gov-control-group/gov-control-group.js.map +1 -0
  92. package/dist/collection/components/gov-cookiebar/gov-cookiebar.css +6 -0
  93. package/dist/collection/components/gov-empty/gov-empty.css +6 -0
  94. package/dist/collection/components/gov-error-code/gov-error-code.css +6 -0
  95. package/dist/collection/components/gov-form/autocomplete/gov-form-autocomplete.css +6 -0
  96. package/dist/collection/components/gov-form/checkbox/gov-form-checkbox.css +6 -0
  97. package/dist/collection/components/gov-form/control/gov-form-control.css +6 -0
  98. package/dist/collection/components/gov-form/control/gov-form-control.js +35 -10
  99. package/dist/collection/components/gov-form/control/gov-form-control.js.map +1 -1
  100. package/dist/collection/components/gov-form/file/gov-form-file.css +13 -0
  101. package/dist/collection/components/gov-form/group/gov-form-group.css +6 -0
  102. package/dist/collection/components/gov-form/input/constants.js +1 -1
  103. package/dist/collection/components/gov-form/input/constants.js.map +1 -1
  104. package/dist/collection/components/gov-form/input/gov-form-input.css +106 -50
  105. package/dist/collection/components/gov-form/input/gov-form-input.js +9 -9
  106. package/dist/collection/components/gov-form/input/gov-form-input.js.map +1 -1
  107. package/dist/collection/components/gov-form/label/gov-form-label.css +6 -0
  108. package/dist/collection/components/gov-form/label/gov-form-label.js +1 -1
  109. package/dist/collection/components/gov-form/label/gov-form-label.js.map +1 -1
  110. package/dist/collection/components/gov-form/message/gov-form-message.css +6 -0
  111. package/dist/collection/components/gov-form/multiselect/gov-form-multi-select.css +106 -50
  112. package/dist/collection/components/gov-form/password-power/gov-form-password-power.css +6 -0
  113. package/dist/collection/components/gov-form/radio/gov-form-radio.css +6 -0
  114. package/dist/collection/components/gov-form/search/constants.js +3 -0
  115. package/dist/collection/components/gov-form/search/constants.js.map +1 -1
  116. package/dist/collection/components/gov-form/search/gov-form-search.css +12 -1
  117. package/dist/collection/components/gov-form/search/gov-form-search.js +30 -0
  118. package/dist/collection/components/gov-form/search/gov-form-search.js.map +1 -1
  119. package/dist/collection/components/gov-form/select/gov-form-select.css +106 -50
  120. package/dist/collection/components/gov-form/select/gov-form-select.js +17 -5
  121. package/dist/collection/components/gov-form/select/gov-form-select.js.map +1 -1
  122. package/dist/collection/components/gov-form/switch/gov-form-switch.css +6 -0
  123. package/dist/collection/components/gov-grid/gov-grid-item.css +6 -0
  124. package/dist/collection/components/gov-grid/gov-grid.css +6 -0
  125. package/dist/collection/components/gov-icon/gov-icon.css +6 -0
  126. package/dist/collection/components/gov-icon/list.js +10 -0
  127. package/dist/collection/components/gov-icon/list.js.map +1 -1
  128. package/dist/collection/components/gov-layout/gov-layout-column.css +6 -0
  129. package/dist/collection/components/gov-layout/gov-layout.css +6 -0
  130. package/dist/collection/components/gov-loading/loading/gov-loading.css +6 -0
  131. package/dist/collection/components/gov-loading/skeleton/gov-skeleton.css +6 -0
  132. package/dist/collection/components/gov-message/gov-message.css +6 -0
  133. package/dist/collection/components/gov-modal/gov-modal.css +6 -0
  134. package/dist/collection/components/gov-nav/gov-nav-item.css +6 -0
  135. package/dist/collection/components/gov-nav/gov-nav.css +6 -0
  136. package/dist/collection/components/gov-pagination/gov-pagination.css +6 -0
  137. package/dist/collection/components/gov-promp/gov-prompt.css +6 -0
  138. package/dist/collection/components/gov-side-nav/gov-side-nav-item.css +6 -0
  139. package/dist/collection/components/gov-side-nav/gov-side-nav.css +6 -0
  140. package/dist/collection/components/gov-spacer/gov-spacer.css +6 -0
  141. package/dist/collection/components/gov-statsbar/gov-statsbar-item.css +6 -0
  142. package/dist/collection/components/gov-statsbar/gov-statsbar.css +6 -0
  143. package/dist/collection/components/gov-stepper/gov-stepper-item.css +6 -0
  144. package/dist/collection/components/gov-stepper/gov-stepper.css +6 -0
  145. package/dist/collection/components/gov-tabs/gov-tabs-item.css +6 -0
  146. package/dist/collection/components/gov-tabs/gov-tabs.css +6 -0
  147. package/dist/collection/components/gov-tile/container/gov-tiles.css +6 -0
  148. package/dist/collection/components/gov-tile/gov-tile.css +6 -0
  149. package/dist/collection/components/gov-toast/gov-toast.css +6 -0
  150. package/dist/collection/components/gov-tooltip/gov-tooltip-content.css +6 -0
  151. package/dist/collection/components/gov-tooltip/gov-tooltip.css +6 -0
  152. package/dist/collection/components/gov-wizzard/gov-wizzard-item.css +6 -0
  153. package/dist/collection/components/gov-wizzard/gov-wizzard-item.js +29 -36
  154. package/dist/collection/components/gov-wizzard/gov-wizzard-item.js.map +1 -1
  155. package/dist/collection/components/gov-wizzard/gov-wizzard-item.types.js +2 -0
  156. package/dist/collection/components/gov-wizzard/gov-wizzard-item.types.js.map +1 -0
  157. package/dist/collection/components/gov-wizzard/gov-wizzard.css +6 -0
  158. package/dist/collection/helpers/Dom/win.js +2 -1
  159. package/dist/collection/helpers/Dom/win.js.map +1 -1
  160. package/dist/collection/pages/Alert.js +1 -1
  161. package/dist/collection/pages/Alert.js.map +1 -1
  162. package/dist/collection/pages/Button.js +65 -0
  163. package/dist/collection/pages/Button.js.map +1 -1
  164. package/dist/collection/pages/ControlGroup.js +206 -0
  165. package/dist/collection/pages/ControlGroup.js.map +1 -0
  166. package/dist/collection/pages/Forms.js +369 -206
  167. package/dist/collection/pages/Forms.js.map +1 -1
  168. package/dist/collection/pages/Tooltip.js +24 -0
  169. package/dist/collection/pages/Tooltip.js.map +1 -1
  170. package/dist/components/constants3.js +1 -1
  171. package/dist/components/constants3.js.map +1 -1
  172. package/dist/components/form.js +8 -8
  173. package/dist/components/form.js.map +1 -1
  174. package/dist/components/gov-accordion-item.js +1 -0
  175. package/dist/components/gov-accordion-item.js.map +1 -1
  176. package/dist/components/gov-accordion.js +1 -0
  177. package/dist/components/gov-accordion.js.map +1 -1
  178. package/dist/components/gov-alert.js +1 -0
  179. package/dist/components/gov-alert.js.map +1 -1
  180. package/dist/components/gov-app.js +1123 -663
  181. package/dist/components/gov-app.js.map +1 -1
  182. package/dist/components/gov-attachments-item2.js +1 -0
  183. package/dist/components/gov-attachments-item2.js.map +1 -1
  184. package/dist/components/gov-attachments2.js +1 -0
  185. package/dist/components/gov-attachments2.js.map +1 -1
  186. package/dist/components/gov-backdrop2.js +1 -0
  187. package/dist/components/gov-backdrop2.js.map +1 -1
  188. package/dist/components/gov-badge2.js +3 -2
  189. package/dist/components/gov-badge2.js.map +1 -1
  190. package/dist/components/gov-breadcrumbs.js +1 -0
  191. package/dist/components/gov-breadcrumbs.js.map +1 -1
  192. package/dist/components/gov-button2.js +3 -2
  193. package/dist/components/gov-button2.js.map +1 -1
  194. package/dist/components/gov-card.js +1 -0
  195. package/dist/components/gov-card.js.map +1 -1
  196. package/dist/components/gov-container.js +1 -0
  197. package/dist/components/gov-container.js.map +1 -1
  198. package/dist/components/gov-control-group.d.ts +11 -0
  199. package/dist/components/gov-control-group.js +58 -0
  200. package/dist/components/gov-control-group.js.map +1 -0
  201. package/dist/components/gov-cookiebar.js +1 -0
  202. package/dist/components/gov-cookiebar.js.map +1 -1
  203. package/dist/components/gov-dropdown.d.ts +11 -0
  204. package/dist/components/gov-dropdown.js +144 -0
  205. package/dist/components/gov-dropdown.js.map +1 -0
  206. package/dist/components/gov-empty.js +1 -0
  207. package/dist/components/gov-empty.js.map +1 -1
  208. package/dist/components/gov-error-code.js +1 -0
  209. package/dist/components/gov-error-code.js.map +1 -1
  210. package/dist/components/gov-form-autocomplete2.js +1 -0
  211. package/dist/components/gov-form-autocomplete2.js.map +1 -1
  212. package/dist/components/gov-form-checkbox.js +1 -0
  213. package/dist/components/gov-form-checkbox.js.map +1 -1
  214. package/dist/components/gov-form-control.js +36 -7
  215. package/dist/components/gov-form-control.js.map +1 -1
  216. package/dist/components/gov-form-file.js +2 -1
  217. package/dist/components/gov-form-file.js.map +1 -1
  218. package/dist/components/gov-form-group.js +1 -0
  219. package/dist/components/gov-form-group.js.map +1 -1
  220. package/dist/components/gov-form-input2.js +6 -5
  221. package/dist/components/gov-form-input2.js.map +1 -1
  222. package/dist/components/gov-form-label.js +2 -1
  223. package/dist/components/gov-form-label.js.map +1 -1
  224. package/dist/components/gov-form-message2.js +1 -0
  225. package/dist/components/gov-form-message2.js.map +1 -1
  226. package/dist/components/gov-form-multi-select.js +2 -1
  227. package/dist/components/gov-form-multi-select.js.map +1 -1
  228. package/dist/components/gov-form-password-power.js +1 -0
  229. package/dist/components/gov-form-password-power.js.map +1 -1
  230. package/dist/components/gov-form-radio.js +1 -0
  231. package/dist/components/gov-form-radio.js.map +1 -1
  232. package/dist/components/gov-form-search.js +9 -2
  233. package/dist/components/gov-form-search.js.map +1 -1
  234. package/dist/components/gov-form-select2.js +18 -7
  235. package/dist/components/gov-form-select2.js.map +1 -1
  236. package/dist/components/gov-form-switch.js +1 -0
  237. package/dist/components/gov-form-switch.js.map +1 -1
  238. package/dist/components/gov-grid-item.js +1 -0
  239. package/dist/components/gov-grid-item.js.map +1 -1
  240. package/dist/components/gov-grid.js +1 -0
  241. package/dist/components/gov-grid.js.map +1 -1
  242. package/dist/components/gov-icon2.js +2 -1
  243. package/dist/components/gov-icon2.js.map +1 -1
  244. package/dist/components/gov-layout-column.js +1 -0
  245. package/dist/components/gov-layout-column.js.map +1 -1
  246. package/dist/components/gov-layout.js +1 -0
  247. package/dist/components/gov-layout.js.map +1 -1
  248. package/dist/components/gov-loading.js +1 -0
  249. package/dist/components/gov-loading.js.map +1 -1
  250. package/dist/components/gov-message.js +1 -0
  251. package/dist/components/gov-message.js.map +1 -1
  252. package/dist/components/gov-modal.js +1 -0
  253. package/dist/components/gov-modal.js.map +1 -1
  254. package/dist/components/gov-nav-item.js +1 -0
  255. package/dist/components/gov-nav-item.js.map +1 -1
  256. package/dist/components/gov-nav.js +1 -0
  257. package/dist/components/gov-nav.js.map +1 -1
  258. package/dist/components/gov-pagination.js +1 -0
  259. package/dist/components/gov-pagination.js.map +1 -1
  260. package/dist/components/gov-prompt.js +1 -0
  261. package/dist/components/gov-prompt.js.map +1 -1
  262. package/dist/components/gov-side-nav-item.js +1 -0
  263. package/dist/components/gov-side-nav-item.js.map +1 -1
  264. package/dist/components/gov-side-nav.js +1 -0
  265. package/dist/components/gov-side-nav.js.map +1 -1
  266. package/dist/components/gov-skeleton.js +1 -0
  267. package/dist/components/gov-skeleton.js.map +1 -1
  268. package/dist/components/gov-spacer.js +1 -0
  269. package/dist/components/gov-spacer.js.map +1 -1
  270. package/dist/components/gov-statsbar-item.js +1 -0
  271. package/dist/components/gov-statsbar-item.js.map +1 -1
  272. package/dist/components/gov-statsbar.js +1 -0
  273. package/dist/components/gov-statsbar.js.map +1 -1
  274. package/dist/components/gov-stepper-item.js +1 -0
  275. package/dist/components/gov-stepper-item.js.map +1 -1
  276. package/dist/components/gov-stepper.js +1 -0
  277. package/dist/components/gov-stepper.js.map +1 -1
  278. package/dist/components/gov-tabs-item.js +1 -0
  279. package/dist/components/gov-tabs-item.js.map +1 -1
  280. package/dist/components/gov-tabs.js +1 -0
  281. package/dist/components/gov-tabs.js.map +1 -1
  282. package/dist/components/gov-tile.js +1 -0
  283. package/dist/components/gov-tile.js.map +1 -1
  284. package/dist/components/gov-tiles.js +1 -0
  285. package/dist/components/gov-tiles.js.map +1 -1
  286. package/dist/components/gov-toast.js +1 -0
  287. package/dist/components/gov-toast.js.map +1 -1
  288. package/dist/components/gov-tooltip-content.js +1 -0
  289. package/dist/components/gov-tooltip-content.js.map +1 -1
  290. package/dist/components/gov-tooltip.js +1 -0
  291. package/dist/components/gov-tooltip.js.map +1 -1
  292. package/dist/components/gov-wizzard-item.js +15 -17
  293. package/dist/components/gov-wizzard-item.js.map +1 -1
  294. package/dist/components/gov-wizzard.js +1 -0
  295. package/dist/components/gov-wizzard.js.map +1 -1
  296. package/dist/components/index.d.ts +3 -1
  297. package/dist/components/index.js +2 -0
  298. package/dist/components/index.js.map +1 -1
  299. package/dist/components/win.js +2 -1
  300. package/dist/components/win.js.map +1 -1
  301. package/dist/core/core.esm.js +1 -1
  302. package/dist/core/core.esm.js.map +1 -1
  303. package/dist/core/p-00c4dc0d.entry.js +2 -0
  304. package/dist/core/p-00c4dc0d.entry.js.map +1 -0
  305. package/dist/core/{p-6044a1e7.entry.js → p-02fb27e8.entry.js} +2 -2
  306. package/dist/core/p-0574a26a.entry.js +2 -0
  307. package/dist/core/{p-a423b62a.entry.js.map → p-0574a26a.entry.js.map} +1 -1
  308. package/dist/core/{p-a9c57f72.entry.js → p-070f9684.entry.js} +2 -2
  309. package/dist/core/p-0f5e2b0a.js +2 -0
  310. package/dist/core/{p-d14130ac.entry.js → p-14a475a8.entry.js} +2 -2
  311. package/dist/core/p-1c4ad772.entry.js +2 -0
  312. package/dist/core/p-1c4ad772.entry.js.map +1 -0
  313. package/dist/core/{p-3e1a1bd4.entry.js → p-22222994.entry.js} +2 -2
  314. package/dist/core/{p-54b17f4d.entry.js → p-2e2be66b.entry.js} +2 -2
  315. package/dist/core/p-2e94d2d3.entry.js +2 -0
  316. package/dist/core/p-2e94d2d3.entry.js.map +1 -0
  317. package/dist/core/p-2f0f56fc.entry.js +2 -0
  318. package/dist/core/p-2f0f56fc.entry.js.map +1 -0
  319. package/dist/core/p-304f2d62.entry.js +2 -0
  320. package/dist/core/p-304f2d62.entry.js.map +1 -0
  321. package/dist/core/p-34152b51.js +2 -0
  322. package/dist/core/p-34152b51.js.map +1 -0
  323. package/dist/core/p-34ed07f6.js +2 -0
  324. package/dist/core/p-34ed07f6.js.map +1 -0
  325. package/dist/core/{p-005bfb42.entry.js → p-3d7ea15c.entry.js} +2 -2
  326. package/dist/core/{p-cd869237.js → p-3dbf7f49.js} +2 -2
  327. package/dist/core/p-3dbf7f49.js.map +1 -0
  328. package/dist/core/{p-5e865538.entry.js → p-4c6d7b65.entry.js} +2 -2
  329. package/dist/core/{p-d37f03e0.entry.js → p-529363af.entry.js} +2 -2
  330. package/dist/core/p-58047fab.entry.js +2 -0
  331. package/dist/core/p-58047fab.entry.js.map +1 -0
  332. package/dist/core/p-60ff8457.entry.js +2 -0
  333. package/dist/core/{p-acfd00a2.entry.js.map → p-60ff8457.entry.js.map} +1 -1
  334. package/dist/core/{p-fe1ee53b.entry.js → p-63ef7826.entry.js} +2 -2
  335. package/dist/core/p-63ef7826.entry.js.map +1 -0
  336. package/dist/core/{p-42db4603.entry.js → p-65aa3b0c.entry.js} +2 -2
  337. package/dist/core/{p-75a4c838.entry.js → p-683fc65e.entry.js} +2 -2
  338. package/dist/core/{p-75a4c838.entry.js.map → p-683fc65e.entry.js.map} +1 -1
  339. package/dist/core/{p-5a2a9cde.entry.js → p-70a7e7f6.entry.js} +2 -2
  340. package/dist/core/{p-1025c6ac.entry.js → p-78f8ffb0.entry.js} +2 -2
  341. package/dist/core/{p-3da88ddb.entry.js → p-7cde4bc8.entry.js} +2 -2
  342. package/dist/core/{p-d1275fa8.entry.js → p-90330543.entry.js} +2 -2
  343. package/dist/core/p-90330543.entry.js.map +1 -0
  344. package/dist/core/{p-d9b4bc20.entry.js → p-9fbee429.entry.js} +2 -2
  345. package/dist/core/p-9fbee429.entry.js.map +1 -0
  346. package/dist/core/p-bfc5e0f7.entry.js +2 -0
  347. package/dist/core/p-bfc5e0f7.entry.js.map +1 -0
  348. package/dist/core/p-cdd12494.entry.js +2 -0
  349. package/dist/core/p-cdd12494.entry.js.map +1 -0
  350. package/dist/core/{p-41f07da7.entry.js → p-ce59c2ee.entry.js} +2 -2
  351. package/dist/core/{p-207ba616.entry.js → p-d9e28400.entry.js} +2 -2
  352. package/dist/core/{p-f7275b59.entry.js → p-ec63daab.entry.js} +2 -2
  353. package/dist/core/{p-c289af04.entry.js → p-ed1e9d01.entry.js} +2 -2
  354. package/dist/core/p-f5d42069.entry.js +2 -0
  355. package/dist/core/p-f5d42069.entry.js.map +1 -0
  356. package/dist/custom-elements/index.d.ts +12 -0
  357. package/dist/custom-elements/index.js +1 -1
  358. package/dist/custom-elements/index.js.map +1 -1
  359. package/dist/esm/{constants-45f6db4c.js → constants-5708696f.js} +2 -2
  360. package/dist/esm/constants-5708696f.js.map +1 -0
  361. package/dist/esm/core.js +1 -1
  362. package/dist/esm/{form-613741a5.js → form-2d9f68d9.js} +2 -2
  363. package/dist/esm/form-2d9f68d9.js.map +1 -0
  364. package/dist/esm/gov-accordion.entry.js +2 -2
  365. package/dist/esm/gov-alert.entry.js +2 -2
  366. package/dist/esm/gov-alert.entry.js.map +1 -1
  367. package/dist/esm/gov-app.entry.js +1122 -663
  368. package/dist/esm/gov-app.entry.js.map +1 -1
  369. package/dist/esm/gov-attachments_3.entry.js +2 -2
  370. package/dist/esm/gov-backdrop.entry.js +2 -2
  371. package/dist/esm/gov-badge.entry.js +2 -2
  372. package/dist/esm/gov-badge.entry.js.map +1 -1
  373. package/dist/esm/gov-breadcrumbs.entry.js +2 -2
  374. package/dist/esm/gov-button.entry.js +4 -4
  375. package/dist/esm/gov-button.entry.js.map +1 -1
  376. package/dist/esm/gov-card.entry.js +2 -2
  377. package/dist/esm/gov-control-group.entry.js +38 -0
  378. package/dist/esm/gov-control-group.entry.js.map +1 -0
  379. package/dist/esm/gov-dropdown.entry.js +125 -0
  380. package/dist/esm/gov-dropdown.entry.js.map +1 -0
  381. package/dist/esm/gov-form-checkbox.entry.js +3 -3
  382. package/dist/esm/gov-form-control.entry.js +35 -7
  383. package/dist/esm/gov-form-control.entry.js.map +1 -1
  384. package/dist/esm/gov-form-file.entry.js +4 -4
  385. package/dist/esm/gov-form-file.entry.js.map +1 -1
  386. package/dist/esm/gov-form-input.entry.js +6 -6
  387. package/dist/esm/gov-form-input.entry.js.map +1 -1
  388. package/dist/esm/gov-form-label.entry.js +1 -1
  389. package/dist/esm/gov-form-label.entry.js.map +1 -1
  390. package/dist/esm/gov-form-multi-select.entry.js +4 -4
  391. package/dist/esm/gov-form-multi-select.entry.js.map +1 -1
  392. package/dist/esm/gov-form-radio.entry.js +3 -3
  393. package/dist/esm/gov-form-search.entry.js +5 -1
  394. package/dist/esm/gov-form-search.entry.js.map +1 -1
  395. package/dist/esm/gov-form-select.entry.js +20 -10
  396. package/dist/esm/gov-form-select.entry.js.map +1 -1
  397. package/dist/esm/gov-form-switch.entry.js +3 -3
  398. package/dist/esm/gov-icon.entry.js +2 -2
  399. package/dist/esm/gov-modal.entry.js +2 -2
  400. package/dist/esm/gov-nav.entry.js +2 -2
  401. package/dist/esm/gov-pagination.entry.js +2 -2
  402. package/dist/esm/gov-prompt.entry.js +2 -2
  403. package/dist/esm/gov-side-nav.entry.js +2 -2
  404. package/dist/esm/gov-skeleton.entry.js +2 -2
  405. package/dist/esm/gov-tabs.entry.js +2 -2
  406. package/dist/esm/gov-wizzard-item.entry.js +13 -15
  407. package/dist/esm/gov-wizzard-item.entry.js.map +1 -1
  408. package/dist/esm/gov-wizzard.entry.js +2 -2
  409. package/dist/esm/index-b010bfb4.js +8 -0
  410. package/dist/esm/loader.js +1 -1
  411. package/dist/esm/{wcag-d588d144.js → wcag-afdfdddb.js} +2 -2
  412. package/dist/esm/{wcag-d588d144.js.map → wcag-afdfdddb.js.map} +1 -1
  413. package/dist/esm/{win-9c8460bb.js → win-7a1a8ac8.js} +3 -2
  414. package/dist/esm/win-7a1a8ac8.js.map +1 -0
  415. package/dist/hydrate/index.js +1316 -650
  416. package/dist/types/components/gov-alert/gov-alert.d.ts +1 -1
  417. package/dist/types/components/gov-app/gov-app.d.ts +9 -8
  418. package/dist/types/components/gov-badge/gov-badge.d.ts +1 -1
  419. package/dist/types/components/gov-button/{constants.d.ts → default/constants.d.ts} +3 -3
  420. package/dist/types/components/gov-button/{gov-button.d.ts → default/gov-button.d.ts} +1 -1
  421. package/dist/types/components/gov-button/{gov-button.types.d.ts → default/gov-button.types.d.ts} +1 -1
  422. package/dist/types/components/gov-button/dropdown/constants.d.ts +10 -0
  423. package/dist/types/components/gov-button/dropdown/gov-dropdown.d.ts +30 -0
  424. package/dist/types/components/gov-button/dropdown/gov-dropdown.types.d.ts +4 -0
  425. package/dist/types/components/gov-control-group/constants.d.ts +7 -0
  426. package/dist/types/components/gov-control-group/gov-control-group.d.ts +16 -0
  427. package/dist/types/components/gov-form/control/gov-form-control.d.ts +2 -1
  428. package/dist/types/components/gov-form/input/constants.d.ts +1 -1
  429. package/dist/types/components/gov-form/input/gov-form-input.d.ts +1 -2
  430. package/dist/types/components/gov-form/search/constants.d.ts +4 -0
  431. package/dist/types/components/gov-form/search/gov-form-search.d.ts +5 -0
  432. package/dist/types/components/gov-form/select/gov-form-select.d.ts +2 -0
  433. package/dist/types/components/gov-wizzard/gov-wizzard-item.d.ts +7 -8
  434. package/dist/types/components/gov-wizzard/gov-wizzard-item.types.d.ts +4 -0
  435. package/dist/types/components.d.ts +90 -7
  436. package/dist/types/helpers/Dom/win.d.ts +1 -0
  437. package/dist/types/pages/ControlGroup.d.ts +3 -0
  438. package/package.json +1 -1
  439. package/dist/cjs/constants-245999e7.js.map +0 -1
  440. package/dist/cjs/form-62c6a8c6.js.map +0 -1
  441. package/dist/cjs/win-84bda0aa.js.map +0 -1
  442. package/dist/collection/components/gov-button/constants.js.map +0 -1
  443. package/dist/collection/components/gov-button/gov-button.js.map +0 -1
  444. package/dist/collection/components/gov-button/gov-button.types.js.map +0 -1
  445. package/dist/core/p-0a300d3e.entry.js +0 -2
  446. package/dist/core/p-0a300d3e.entry.js.map +0 -1
  447. package/dist/core/p-35aadeeb.entry.js +0 -2
  448. package/dist/core/p-35aadeeb.entry.js.map +0 -1
  449. package/dist/core/p-670b4f93.js +0 -2
  450. package/dist/core/p-67982c3a.entry.js +0 -2
  451. package/dist/core/p-67982c3a.entry.js.map +0 -1
  452. package/dist/core/p-7e524b49.js +0 -2
  453. package/dist/core/p-7e524b49.js.map +0 -1
  454. package/dist/core/p-a423b62a.entry.js +0 -2
  455. package/dist/core/p-a825183a.entry.js +0 -2
  456. package/dist/core/p-a825183a.entry.js.map +0 -1
  457. package/dist/core/p-acfd00a2.entry.js +0 -2
  458. package/dist/core/p-bbc765ca.entry.js +0 -2
  459. package/dist/core/p-bbc765ca.entry.js.map +0 -1
  460. package/dist/core/p-c20102ff.js +0 -2
  461. package/dist/core/p-c20102ff.js.map +0 -1
  462. package/dist/core/p-cd869237.js.map +0 -1
  463. package/dist/core/p-d1275fa8.entry.js.map +0 -1
  464. package/dist/core/p-d9b4bc20.entry.js.map +0 -1
  465. package/dist/core/p-e4bb6114.entry.js +0 -2
  466. package/dist/core/p-e4bb6114.entry.js.map +0 -1
  467. package/dist/core/p-e6904513.entry.js +0 -2
  468. package/dist/core/p-e6904513.entry.js.map +0 -1
  469. package/dist/core/p-fe1ee53b.entry.js.map +0 -1
  470. package/dist/esm/constants-45f6db4c.js.map +0 -1
  471. package/dist/esm/form-613741a5.js.map +0 -1
  472. package/dist/esm/win-9c8460bb.js.map +0 -1
  473. /package/dist/collection/components/gov-button/{gov-button.types.js → default/gov-button.types.js} +0 -0
  474. /package/dist/core/{p-6044a1e7.entry.js.map → p-02fb27e8.entry.js.map} +0 -0
  475. /package/dist/core/{p-a9c57f72.entry.js.map → p-070f9684.entry.js.map} +0 -0
  476. /package/dist/core/{p-670b4f93.js.map → p-0f5e2b0a.js.map} +0 -0
  477. /package/dist/core/{p-d14130ac.entry.js.map → p-14a475a8.entry.js.map} +0 -0
  478. /package/dist/core/{p-3e1a1bd4.entry.js.map → p-22222994.entry.js.map} +0 -0
  479. /package/dist/core/{p-54b17f4d.entry.js.map → p-2e2be66b.entry.js.map} +0 -0
  480. /package/dist/core/{p-005bfb42.entry.js.map → p-3d7ea15c.entry.js.map} +0 -0
  481. /package/dist/core/{p-5e865538.entry.js.map → p-4c6d7b65.entry.js.map} +0 -0
  482. /package/dist/core/{p-d37f03e0.entry.js.map → p-529363af.entry.js.map} +0 -0
  483. /package/dist/core/{p-42db4603.entry.js.map → p-65aa3b0c.entry.js.map} +0 -0
  484. /package/dist/core/{p-5a2a9cde.entry.js.map → p-70a7e7f6.entry.js.map} +0 -0
  485. /package/dist/core/{p-1025c6ac.entry.js.map → p-78f8ffb0.entry.js.map} +0 -0
  486. /package/dist/core/{p-3da88ddb.entry.js.map → p-7cde4bc8.entry.js.map} +0 -0
  487. /package/dist/core/{p-41f07da7.entry.js.map → p-ce59c2ee.entry.js.map} +0 -0
  488. /package/dist/core/{p-207ba616.entry.js.map → p-d9e28400.entry.js.map} +0 -0
  489. /package/dist/core/{p-f7275b59.entry.js.map → p-ec63daab.entry.js.map} +0 -0
  490. /package/dist/core/{p-c289af04.entry.js.map → p-ed1e9d01.entry.js.map} +0 -0
package/dist/components/gov-app.js CHANGED
@@ -2891,15 +2891,6 @@ usageStatistics();
2891
2891
 
2892
2892
  Router.NavigationTrigger = {POPSTATE, CLICK};
2893
2893
 
2894
- class HomePage extends HTMLElement {
2895
- connectedCallback() {
2896
- this.innerHTML = ``;
2897
- }
2898
- }
2899
- if (customElements.get('home-page') === undefined) {
2900
- customElements.define('home-page', HomePage);
2901
- }
2902
-
2903
2894
  class AccordionPage extends HTMLElement {
2904
2895
  connectedCallback() {
2905
2896
  this.innerHTML = `
@@ -3272,7 +3263,7 @@ class AlertPage extends HTMLElement {
3272
3263
  connectedCallback() {
3273
3264
  this.innerHTML = `
3274
3265
  <h2>Alert</h2>
3275
-
3266
+
3276
3267
  <gov-alert variant="secondary" headline="Tohle bude super nadpis pro všechno" closable>
3277
3268
  <gov-icon name="info" slot="icon"></gov-icon>
3278
3269
  <p>
@@ -3733,11 +3724,112 @@ if (customElements.get('badge-page') === undefined) {
3733
3724
  customElements.define('badge-page', BadgePage);
3734
3725
  }
3735
3726
 
3727
+ class BreadcrumbsPage extends HTMLElement {
3728
+ connectedCallback() {
3729
+ this.innerHTML = `
3730
+ <h2>Breadcrumbs</h2>
3731
+
3732
+ <gov-breadcrumbs wcag-label="Drobečková navigace pro stránku Czech POINT">
3733
+ <ul>
3734
+ <li>
3735
+ <button>
3736
+ Domů
3737
+ </button>
3738
+ </li>
3739
+ <li>
3740
+ <gov-icon name="chevron-right"></gov-icon>
3741
+ <a href="#">Kam dál</a>
3742
+ </li>
3743
+ <li>
3744
+ <gov-icon name="chevron-right"></gov-icon>
3745
+ <a href="#">
3746
+ Český eGovernment
3747
+ </a>
3748
+ </li>
3749
+ <li>
3750
+ <gov-icon name="chevron-right"></gov-icon>
3751
+ <strong>Czech POINT</strong>
3752
+ </li>
3753
+ </ul>
3754
+ </gov-breadcrumbs>
3755
+
3756
+ `;
3757
+ }
3758
+ }
3759
+ if (customElements.get("breadcrumbs-page") === undefined) {
3760
+ customElements.define("breadcrumbs-page", BreadcrumbsPage);
3761
+ }
3762
+
3736
3763
  class ButtonPage extends HTMLElement {
3737
3764
  connectedCallback() {
3738
3765
  this.innerHTML = `
3739
3766
  <h1>Buttons</h1>
3767
+
3768
+ <h4>Dropdown</h4>
3769
+
3770
+ <gov-layout>
3771
+ <gov-layout-column>
3772
+ <div class="container-view">
3773
+ <gov-dropdown>
3774
+ <gov-button variant="primary" size="s">
3775
+ Více
3776
+ </gov-button>
3777
+ <ul slot="list">
3778
+ <li>
3779
+ <gov-button variant="primary" type="base" size="s">
3780
+ A další nabídka
3781
+ <gov-icon slot="right-icon" name="info"></gov-icon>
3782
+ </gov-button>
3783
+ </li>
3784
+ <li>
3785
+ <gov-button variant="primary" type="base" size="s">
3786
+ A další dlouhá nabídka
3787
+ <gov-icon slot="right-icon" name="info"></gov-icon>
3788
+ </gov-button>
3789
+ </li>
3790
+ <li>
3791
+ <gov-button variant="primary" type="base" size="s">
3792
+ A další
3793
+ <gov-icon slot="right-icon" name="info"></gov-icon>
3794
+ </gov-button>
3795
+ </li>
3796
+ </ul>
3797
+ </gov-dropdown>
3798
+ </div>
3799
+ </gov-layout-column>
3800
+ <gov-layout-column>
3801
+ <div class="container-view">
3802
+ <gov-dropdown position="right">
3803
+ <gov-button variant="primary" size="s">
3804
+ Více
3805
+ </gov-button>
3806
+ <ul slot="list">
3807
+ <li>
3808
+ <gov-button variant="secondary" type="base" size="s">
3809
+ A další nabídka
3810
+ <gov-icon slot="right-icon" name="info"></gov-icon>
3811
+ </gov-button>
3812
+ </li>
3813
+ <li>
3814
+ <gov-button variant="secondary" type="base" size="s">
3815
+ A další dlouhá nabídka
3816
+ <gov-icon slot="right-icon" name="info"></gov-icon>
3817
+ </gov-button>
3818
+ </li>
3819
+ <li>
3820
+ <gov-button variant="secondary" type="base" size="s">
3821
+ A další
3822
+ <gov-icon slot="right-icon" name="info"></gov-icon>
3823
+ </gov-button>
3824
+ </li>
3825
+ </ul>
3826
+ </gov-dropdown>
3827
+ </div>
3828
+ </gov-layout-column>
3829
+ </gov-layout>
3830
+
3740
3831
  <h4>Buttons - primary (default)</h4>
3832
+
3741
3833
  <div class="container-view">
3742
3834
  <gov-button variant="primary" size="s" href="http://localhost:3333/button">
3743
3835
  <gov-icon slot="left-icon" name="info"></gov-icon>
@@ -5010,42 +5102,6 @@ if (customElements.get('button-page') === undefined) {
5010
5102
  customElements.define('button-page', ButtonPage);
5011
5103
  }
5012
5104
 
5013
- class BreadcrumbsPage extends HTMLElement {
5014
- connectedCallback() {
5015
- this.innerHTML = `
5016
- <h2>Breadcrumbs</h2>
5017
-
5018
- <gov-breadcrumbs wcag-label="Drobečková navigace pro stránku Czech POINT">
5019
- <ul>
5020
- <li>
5021
- <button>
5022
- Domů
5023
- </button>
5024
- </li>
5025
- <li>
5026
- <gov-icon name="chevron-right"></gov-icon>
5027
- <a href="#">Kam dál</a>
5028
- </li>
5029
- <li>
5030
- <gov-icon name="chevron-right"></gov-icon>
5031
- <a href="#">
5032
- Český eGovernment
5033
- </a>
5034
- </li>
5035
- <li>
5036
- <gov-icon name="chevron-right"></gov-icon>
5037
- <strong>Czech POINT</strong>
5038
- </li>
5039
- </ul>
5040
- </gov-breadcrumbs>
5041
-
5042
- `;
5043
- }
5044
- }
5045
- if (customElements.get("breadcrumbs-page") === undefined) {
5046
- customElements.define("breadcrumbs-page", BreadcrumbsPage);
5047
- }
5048
-
5049
5105
  class CardPage extends HTMLElement {
5050
5106
  connectedCallback() {
5051
5107
  this.innerHTML = `
@@ -5148,6 +5204,227 @@ if (customElements.get('card-page') === undefined) {
5148
5204
  customElements.define('card-page', CardPage);
5149
5205
  }
5150
5206
 
5207
+ class ContainerPage extends HTMLElement {
5208
+ connectedCallback() {
5209
+ this.innerHTML = `
5210
+ <h2>Container</h2>
5211
+
5212
+ <gov-container>
5213
+ <p>Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus. Donec justo lacus, congue hendrerit felis sit amet, commodo lobortis neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Nulla vulputate urna sapien. Proin imperdiet rhoncus dictum. Pellentesque tempor ultrices tortor, ac mollis lorem mollis non. Phasellus sit amet maximus ex, id scelerisque nulla. Etiam eu orci a nulla semper maximus et at quam.</p>
5214
+ </gov-container>
5215
+ `;
5216
+ }
5217
+ }
5218
+ if (customElements.get('container-page') === undefined) {
5219
+ customElements.define('container-page', ContainerPage);
5220
+ }
5221
+
5222
+ class ControlGroupPage extends HTMLElement {
5223
+ connectedCallback() {
5224
+ this.innerHTML = `
5225
+ <h2>Control Group</h2>
5226
+
5227
+ <gov-control-group>
5228
+ <gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" size="s"></gov-form-input>
5229
+ <gov-button variant="primary" type="outlined" size="s">
5230
+ <gov-icon slot="left-icon" name="chevron-up"></gov-icon>
5231
+ </gov-button>
5232
+ <gov-button variant="primary" type="outlined" size="s">
5233
+ <gov-icon slot="left-icon" name="chevron-down"></gov-icon>
5234
+ </gov-button>
5235
+ <gov-button variant="primary" type="outlined" size="s">
5236
+ <gov-icon slot="left-icon" name="x-lg"></gov-icon>
5237
+ </gov-button>
5238
+ <gov-dropdown position="right">
5239
+ <gov-button variant="primary" size="s">
5240
+ Více
5241
+ </gov-button>
5242
+ <ul slot="list">
5243
+ <li>
5244
+ <gov-button variant="primary" type="base" size="s">
5245
+ A další nabídka
5246
+ </gov-button>
5247
+ </li>
5248
+ <li>
5249
+ <gov-button variant="primary" type="base" size="s">
5250
+ A další nabídka
5251
+ </gov-button>
5252
+ </li>
5253
+ <li>
5254
+ <gov-button variant="primary" type="base" size="s">
5255
+ A další nabídka
5256
+ </gov-button>
5257
+ </li>
5258
+ </ul>
5259
+ </gov-dropdown>
5260
+ </gov-control-group>
5261
+ <br />
5262
+ <gov-control-group variant="primary">
5263
+ <gov-form-select name="test-me" size="m">
5264
+ <option value="" selected>Placeholder</option>
5265
+ <option value="b">Value B</option>
5266
+ <option value="c">Value C</option>
5267
+ <option value="d">Value D</option>
5268
+ </gov-form-select>
5269
+ <gov-button variant="primary" type="solid" size="m">
5270
+ <gov-icon slot="left-icon" name="x-lg"></gov-icon>
5271
+ </gov-button>
5272
+ </gov-control-group>
5273
+ <br />
5274
+ <gov-control-group>
5275
+ <gov-button variant="primary" type="outlined" size="l">
5276
+ <gov-icon slot="left-icon" name="gear"></gov-icon>
5277
+ </gov-button>
5278
+ <gov-form-file name="test-me-c" accept="image/*" max-file-size="1024">
5279
+ <gov-button variant="primary" type="outlined" size="l" tabindex="-1">
5280
+ Nahrát soubor ze zařízení
5281
+ </gov-button>
5282
+ </gov-form-file>
5283
+ <gov-button variant="primary" type="outlined" size="l">
5284
+ <gov-icon slot="left-icon" name="x-lg"></gov-icon>
5285
+ </gov-button>
5286
+ </gov-control-group>
5287
+ <br />
5288
+ <gov-control-group variant="primary" no-border>
5289
+ <gov-button variant="primary" type="outlined" size="xl">
5290
+ <gov-icon slot="left-icon" name="chevron-up"></gov-icon>
5291
+ </gov-button>
5292
+ <gov-button variant="primary" type="outlined" size="xl">
5293
+ <gov-icon slot="left-icon" name="chevron-down"></gov-icon>
5294
+ </gov-button>
5295
+ <gov-form-select name="test-me" size="xl">
5296
+ <option value="" selected>Placeholder</option>
5297
+ <option value="b">Value B</option>
5298
+ <option value="c">Value C</option>
5299
+ <option value="d">Value D</option>
5300
+ </gov-form-select>
5301
+ <gov-button variant="primary" type="outlined" size="xl">
5302
+ <gov-icon slot="left-icon" name="x-lg"></gov-icon>
5303
+ </gov-button>
5304
+ </gov-control-group>
5305
+ <br><br>
5306
+
5307
+ <gov-control-group variant="secondary" no-border>
5308
+ <gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" variant="primary" size="s"></gov-form-input>
5309
+ <gov-button variant="primary" type="outlined" size="s">
5310
+ <gov-icon slot="left-icon" name="chevron-up"></gov-icon>
5311
+ </gov-button>
5312
+ <gov-button variant="primary" type="outlined" size="s">
5313
+ <gov-icon slot="left-icon" name="chevron-down"></gov-icon>
5314
+ </gov-button>
5315
+ <gov-button variant="primary" type="outlined" size="s">
5316
+ <gov-icon slot="left-icon" name="x-lg"></gov-icon>
5317
+ </gov-button>
5318
+ </gov-control-group>
5319
+ <br />
5320
+ <gov-control-group variant="secondary">
5321
+ <gov-form-select name="test-me" size="m">
5322
+ <option value="" selected>Placeholder</option>
5323
+ <option value="b">Value B</option>
5324
+ <option value="c">Value C</option>
5325
+ <option value="d">Value D</option>
5326
+ </gov-form-select>
5327
+ <gov-button variant="primary" type="outlined" size="m">
5328
+ <gov-icon slot="left-icon" name="x-lg"></gov-icon>
5329
+ </gov-button>
5330
+ </gov-control-group>
5331
+ <br />
5332
+ <gov-control-group variant="secondary">
5333
+ <gov-button variant="primary" type="outlined" size="l">
5334
+ <gov-icon slot="left-icon" name="gear"></gov-icon>
5335
+ </gov-button>
5336
+ <gov-form-file name="test-me-c" accept="image/*" max-file-size="1024">
5337
+ <gov-button variant="primary" type="outlined" size="l" tabindex="-1">
5338
+ Nahrát soubor ze zařízení
5339
+ </gov-button>
5340
+ </gov-form-file>
5341
+ <gov-button variant="primary" type="outlined" size="l">
5342
+ <gov-icon slot="left-icon" name="x-lg"></gov-icon>
5343
+ </gov-button>
5344
+ </gov-control-group>
5345
+ <br />
5346
+ <gov-control-group variant="secondary">
5347
+ <gov-button variant="primary" type="outlined" size="xl">
5348
+ <gov-icon slot="left-icon" name="chevron-up"></gov-icon>
5349
+ </gov-button>
5350
+ <gov-button variant="primary" type="outlined" size="xl">
5351
+ <gov-icon slot="left-icon" name="chevron-down"></gov-icon>
5352
+ </gov-button>
5353
+ <gov-form-select name="test-me" variant="primary" size="xl">
5354
+ <option value="" selected>Placeholder</option>
5355
+ <option value="b">Value B</option>
5356
+ <option value="c">Value C</option>
5357
+ <option value="d">Value D</option>
5358
+ </gov-form-select>
5359
+ <gov-button variant="primary" type="outlined" size="xl">
5360
+ <gov-icon slot="left-icon" name="x-lg"></gov-icon>
5361
+ </gov-button>
5362
+ </gov-control-group>
5363
+ <br><br>
5364
+
5365
+ <gov-control-group variant="secondary">
5366
+ <gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" variant="secondary" size="s"></gov-form-input>
5367
+ <gov-button variant="secondary" type="outlined" size="s">
5368
+ <gov-icon slot="left-icon" name="chevron-up"></gov-icon>
5369
+ </gov-button>
5370
+ <gov-button variant="secondary" type="outlined" size="s">
5371
+ <gov-icon slot="left-icon" name="chevron-down"></gov-icon>
5372
+ </gov-button>
5373
+ <gov-button variant="secondary" type="outlined" size="s">
5374
+ <gov-icon slot="left-icon" name="x-lg"></gov-icon>
5375
+ </gov-button>
5376
+ </gov-control-group>
5377
+ <br />
5378
+ <gov-control-group variant="secondary" no-border>
5379
+ <gov-form-select name="test-me" size="m">
5380
+ <option value="" selected>Placeholder</option>
5381
+ <option value="b">Value B</option>
5382
+ <option value="c">Value C</option>
5383
+ <option value="d">Value D</option>
5384
+ </gov-form-select>
5385
+ <gov-button variant="secondary" type="outlined" size="m">
5386
+ <gov-icon slot="left-icon" name="x-lg"></gov-icon>
5387
+ </gov-button>
5388
+ </gov-control-group>
5389
+ <br />
5390
+ <gov-control-group variant="secondary">
5391
+ <gov-button variant="secondary" type="outlined" size="l">
5392
+ <gov-icon slot="left-icon" name="gear"></gov-icon>
5393
+ </gov-button>
5394
+ <gov-form-file name="test-me-c" accept="image/*" max-file-size="1024">
5395
+ <gov-button variant="secondary" type="outlined" size="l" tabindex="-1">
5396
+ Nahrát soubor ze zařízení
5397
+ </gov-button>
5398
+ </gov-form-file>
5399
+ <gov-button variant="secondary" type="outlined" size="l">
5400
+ <gov-icon slot="left-icon" name="x-lg"></gov-icon>
5401
+ </gov-button>
5402
+ </gov-control-group>
5403
+ <br />
5404
+ <gov-control-group variant="secondary">
5405
+ <gov-button variant="secondary" type="outlined" size="xl">
5406
+ <gov-icon slot="left-icon" name="chevron-up"></gov-icon>
5407
+ </gov-button>
5408
+ <gov-button variant="secondary" type="outlined" size="xl">
5409
+ <gov-icon slot="left-icon" name="chevron-down"></gov-icon>
5410
+ </gov-button>
5411
+ <gov-form-select name="test-me" variant="secondary" size="xl">
5412
+ <option value="" selected>Placeholder</option>
5413
+ <option value="b">Value B</option>
5414
+ <option value="c">Value C</option>
5415
+ <option value="d">Value D</option>
5416
+ </gov-form-select>
5417
+ <gov-button variant="secondary" type="outlined" size="xl">
5418
+ <gov-icon slot="left-icon" name="x-lg"></gov-icon>
5419
+ </gov-button>
5420
+ </gov-control-group>
5421
+ `;
5422
+ }
5423
+ }
5424
+ if (customElements.get('control-group-page') === undefined) {
5425
+ customElements.define('control-group-page', ControlGroupPage);
5426
+ }
5427
+
5151
5428
  class Cookiebar extends HTMLElement {
5152
5429
  connectedCallback() {
5153
5430
  this.innerHTML = `
@@ -5177,21 +5454,6 @@ if (customElements.get('cookiebar-page') === undefined) {
5177
5454
  customElements.define('cookiebar-page', Cookiebar);
5178
5455
  }
5179
5456
 
5180
- class ContainerPage extends HTMLElement {
5181
- connectedCallback() {
5182
- this.innerHTML = `
5183
- <h2>Container</h2>
5184
-
5185
- <gov-container>
5186
- <p>Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus. Donec justo lacus, congue hendrerit felis sit amet, commodo lobortis neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Nulla vulputate urna sapien. Proin imperdiet rhoncus dictum. Pellentesque tempor ultrices tortor, ac mollis lorem mollis non. Phasellus sit amet maximus ex, id scelerisque nulla. Etiam eu orci a nulla semper maximus et at quam.</p>
5187
- </gov-container>
5188
- `;
5189
- }
5190
- }
5191
- if (customElements.get('container-page') === undefined) {
5192
- customElements.define('container-page', ContainerPage);
5193
- }
5194
-
5195
5457
  class EmptyPage extends HTMLElement {
5196
5458
  connectedCallback() {
5197
5459
  this.innerHTML = `
@@ -5251,67 +5513,168 @@ if (customElements.get('error-page') === undefined) {
5251
5513
  customElements.define('error-page', ErrorPage);
5252
5514
  }
5253
5515
 
5254
- const removeDiacritics = (string) => {
5255
- if (!string)
5256
- return string;
5257
- return string.normalize('NFD').replace(/[\u0300-\u036f]/g, '');
5258
- };
5259
- const randomNumber = (min, max) => {
5260
- return Math.floor(Math.random() * (max - min + 1) + min);
5261
- };
5262
- const data = () => [
5263
- { name: 'Pepa' },
5264
- { name: 'Katak' },
5265
- { name: 'Tomáš' },
5266
- { name: 'Ludvík' },
5267
- { name: 'Anežda' },
5268
- { name: 'Xaviér' },
5269
- { name: 'Ondřej' },
5270
- { name: 'Mirek' },
5271
- { name: 'Zdeněk' },
5272
- { name: 'Monika' },
5273
- { name: 'Jirka' },
5274
- { name: 'Abrahám' },
5275
- { name: 'Lucie' },
5276
- { name: 'Emily' },
5277
- { name: 'Pavel' },
5278
- { name: 'Gustav' },
5279
- { name: 'Amálie' },
5280
- ];
5281
- class FormsPage extends HTMLElement {
5516
+ class FormLabelPage extends HTMLElement {
5282
5517
  connectedCallback() {
5283
- (() => {
5284
- setTimeout(() => {
5285
- const po = document.getElementById('bagr');
5286
- const ba = document.getElementById('ba');
5287
- if (ba) {
5288
- ba.addEventListener('gov-change', function (e) {
5289
- console.log(e);
5290
- });
5291
- }
5292
- if (po) {
5293
- po.addEventListener('gov-select', function (e) {
5294
- console.log(e);
5295
- });
5296
- po.setSearchCallback(val => {
5297
- return new Promise(resolve => {
5298
- setTimeout(() => {
5299
- resolve(data().filter(({ name }) => {
5300
- if (!name)
5301
- return false;
5302
- return removeDiacritics(name).toLowerCase().indexOf(removeDiacritics(val).toLowerCase()) > -1;
5303
- }));
5304
- }, randomNumber(100, 1000));
5305
- });
5306
- });
5307
- }
5308
- }, 1000);
5309
- })();
5310
5518
  this.innerHTML = `
5311
- <h2>
5519
+ <gov-form-label>
5520
+ Form Label
5521
+ </gov-form-label>
5522
+ `;
5523
+ }
5524
+ }
5525
+ if (customElements.get('form-label-page') === undefined) {
5526
+ customElements.define('form-label-page', FormLabelPage);
5527
+ }
5528
+
5529
+ class FormMessagePage extends HTMLElement {
5530
+ connectedCallback() {
5531
+ this.innerHTML = `
5532
+ <gov-form-message>
5533
+ <gov-icon slot="icon" name="info"></gov-icon>
5534
+ <p>
5535
+ Default
5536
+ </p>
5537
+ </gov-form-message>
5538
+ <gov-form-message>
5539
+ <p>
5540
+ Default
5541
+ </p>
5542
+ </gov-form-message>
5543
+ <gov-form-message variant="secondary">
5544
+ <gov-icon name="info" slot="icon"></gov-icon>
5545
+ <p>
5546
+ Secondary
5547
+ </p>
5548
+ </gov-form-message>
5549
+ <gov-form-message variant="secondary">
5550
+ <p>
5551
+ Secondary
5552
+ </p>
5553
+ </gov-form-message>
5554
+ <gov-form-message variant="error">
5555
+ <gov-icon slot="icon" name="info"></gov-icon>
5556
+ <p>
5557
+ Error
5558
+ </p>
5559
+ </gov-form-message>
5560
+ <gov-form-message variant="error">
5561
+ <p>
5562
+ Error
5563
+ </p>
5564
+ </gov-form-message>
5565
+ <gov-form-message variant="warning">
5566
+ <gov-icon slot="icon" name="info"></gov-icon>
5567
+ <p>
5568
+ Warning
5569
+ </p>
5570
+ </gov-form-message>
5571
+ <gov-form-message variant="warning">
5572
+ <p>
5573
+ Warning
5574
+ </p>
5575
+ </gov-form-message>
5576
+ <gov-form-message variant="success">
5577
+ <gov-icon slot="icon" name="info"></gov-icon>
5578
+ <p>
5579
+ Success
5580
+ </p>
5581
+ </gov-form-message>
5582
+ <gov-form-message variant="success">
5583
+ <p>
5584
+ Success
5585
+ </p>
5586
+ </gov-form-message>
5587
+ <gov-form-message>
5588
+ <gov-icon slot="icon" name="info"></gov-icon>
5589
+ <p>
5590
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi vitae dapibus eros, a dapibus metus. Ut a leo lorem. Sed ut fermentum diam. Sed porttitor ligula est, eget lobortis lacus rutrum et. Nunc sapien arcu, faucibus sit amet justo vel, aliquam gravida magna. Pellentesque et tempor risus.
5591
+ </p>
5592
+ <p>
5593
+ Aliquam suscipit justo dolor, et pellentesque dui venenatis quis. Vestibulum dignissim libero urna, non ultricies neque consequat ut.
5594
+ </p>
5595
+ </gov-form-message>
5596
+ <gov-form-message>
5597
+ <p>
5598
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi vitae dapibus eros, a dapibus metus. Ut a leo lorem. Sed ut fermentum diam. Sed porttitor ligula est, eget lobortis lacus rutrum et. Nunc sapien arcu, faucibus sit amet justo vel, aliquam gravida magna. Pellentesque et tempor risus.
5599
+ </p>
5600
+ <p>
5601
+ Aliquam suscipit justo dolor, et pellentesque dui venenatis quis. Vestibulum dignissim libero urna, non ultricies neque consequat ut.
5602
+ </p>
5603
+ </gov-form-message>
5604
+ `;
5605
+ }
5606
+ }
5607
+ if (customElements.get('form-message-page') === undefined) {
5608
+ customElements.define('form-message-page', FormMessagePage);
5609
+ }
5610
+
5611
+ const removeDiacritics = (string) => {
5612
+ if (!string)
5613
+ return string;
5614
+ return string.normalize('NFD').replace(/[\u0300-\u036f]/g, '');
5615
+ };
5616
+ const randomNumber = (min, max) => {
5617
+ return Math.floor(Math.random() * (max - min + 1) + min);
5618
+ };
5619
+ const data = () => [
5620
+ { name: 'Pepa' },
5621
+ { name: 'Katak' },
5622
+ { name: 'Tomáš' },
5623
+ { name: 'Ludvík' },
5624
+ { name: 'Anežda' },
5625
+ { name: 'Xaviér' },
5626
+ { name: 'Ondřej' },
5627
+ { name: 'Mirek' },
5628
+ { name: 'Zdeněk' },
5629
+ { name: 'Monika' },
5630
+ { name: 'Jirka' },
5631
+ { name: 'Abrahám' },
5632
+ { name: 'Lucie' },
5633
+ { name: 'Emily' },
5634
+ { name: 'Pavel' },
5635
+ { name: 'Gustav' },
5636
+ { name: 'Amálie' },
5637
+ ];
5638
+ class FormsPage extends HTMLElement {
5639
+ connectedCallback() {
5640
+ (() => {
5641
+ setTimeout(() => {
5642
+ const po = document.getElementById('bagr');
5643
+ const ba = document.getElementById('ba');
5644
+ const na = document.getElementById('kaprWWWWWW');
5645
+ if (ba) {
5646
+ ba.addEventListener('gov-change', function (e) {
5647
+ console.log(e);
5648
+ });
5649
+ }
5650
+ if (na) {
5651
+ na.addEventListener('gov-blur', function (e) {
5652
+ console.log(e);
5653
+ });
5654
+ }
5655
+ if (po) {
5656
+ po.addEventListener('gov-select', function (e) {
5657
+ console.log(e);
5658
+ });
5659
+ po.setSearchCallback(val => {
5660
+ return new Promise(resolve => {
5661
+ setTimeout(() => {
5662
+ resolve(data().filter(({ name }) => {
5663
+ if (!name)
5664
+ return false;
5665
+ return removeDiacritics(name).toLowerCase().indexOf(removeDiacritics(val).toLowerCase()) > -1;
5666
+ }));
5667
+ }, randomNumber(100, 1000));
5668
+ });
5669
+ });
5670
+ }
5671
+ }, 1000);
5672
+ })();
5673
+ this.innerHTML = `
5674
+ <h2>
5312
5675
  Samostatné použití
5313
5676
  </h2>
5314
- <gov-form-input placeholder="Co hledáte">
5677
+ <gov-form-input placeholder="Co hledáte" variant="primary">
5315
5678
  <gov-icon slot="right-icon" name="info"></gov-icon>
5316
5679
  </gov-form-input>
5317
5680
  <br>
@@ -5353,6 +5716,9 @@ class FormsPage extends HTMLElement {
5353
5716
  </gov-form-switch>
5354
5717
 
5355
5718
 
5719
+ <!-- ----------------------------------------------------------------------------------------------------------------------------- -->
5720
+
5721
+
5356
5722
  <h2>
5357
5723
  Date & Time input (nativní)
5358
5724
  </h2>
@@ -5362,10 +5728,14 @@ class FormsPage extends HTMLElement {
5362
5728
  <br>
5363
5729
  <gov-form-input size="xl" placeholder="Co hledáte" input-type="time"></gov-form-input>
5364
5730
 
5731
+
5732
+ <!-- ----------------------------------------------------------------------------------------------------------------------------- -->
5733
+
5734
+
5365
5735
  <h2>Search</h2>
5366
5736
  <gov-form-control>
5367
5737
  <gov-form-group>
5368
- <gov-form-search name="test-me-c" value="me" checked>
5738
+ <gov-form-search name="test-me-c" value="me" variant="secondary">
5369
5739
  <gov-form-input slot="input" id="kapr" name="test-me" size="m" placeholder="Co hledáte"></gov-form-input>
5370
5740
  <gov-button slot="button" variant="primary" size="s">
5371
5741
  <gov-icon slot="left-icon" name="search"></gov-icon>
@@ -5376,7 +5746,7 @@ class FormsPage extends HTMLElement {
5376
5746
  <br>
5377
5747
  <gov-form-control>
5378
5748
  <gov-form-group>
5379
- <gov-form-search name="test-me-c" value="me" checked>
5749
+ <gov-form-search name="test-me-c" value="me" variant="primary">
5380
5750
  <gov-form-input slot="input" id="kapr" name="test-me" size="l" placeholder="Co hledáte"></gov-form-input>
5381
5751
  <gov-button slot="button" variant="primary" size="m">
5382
5752
  Hledat
@@ -5396,13 +5766,17 @@ class FormsPage extends HTMLElement {
5396
5766
  </gov-form-group>
5397
5767
  </gov-form-control>
5398
5768
 
5769
+
5770
+ <!-- ----------------------------------------------------------------------------------------------------------------------------- -->
5771
+
5772
+
5399
5773
  <h2>File</h2>
5400
5774
  <div class="container-view">
5401
5775
  <h3>Normal</h3>
5402
5776
  <gov-form-control>
5403
5777
  <gov-form-label size="s" slot="top">Přidat přílohu *</gov-form-label>
5404
5778
  <gov-form-group>
5405
- <gov-form-file name="test-me-c" expanded accept="image/*" max-file-size="1024">
5779
+ <gov-form-file name="test-me-c" accept="image/*" max-file-size="1024">
5406
5780
  <p>
5407
5781
  <gov-button variant="primary" type="outlined" tabindex="-1">
5408
5782
  Nahrát soubor ze zařízení
@@ -5415,9 +5789,8 @@ class FormsPage extends HTMLElement {
5415
5789
  </gov-form-group>
5416
5790
  </gov-form-control>
5417
5791
  <br>
5418
-
5419
5792
  <gov-form-control>
5420
- <gov-form-label size="s" slot="top">Přidat přílohu 22 *</gov-form-label>
5793
+ <gov-form-label size="s" slot="top">Přidat přílohu *</gov-form-label>
5421
5794
  <gov-form-group>
5422
5795
  <gov-form-file name="test-me-c">
5423
5796
  <p aria-hidden="true">
@@ -5433,11 +5806,10 @@ class FormsPage extends HTMLElement {
5433
5806
  </gov-form-group>
5434
5807
  </gov-form-control>
5435
5808
  <br>
5436
-
5437
- <gov-form-control invalid>
5809
+ <gov-form-control>
5438
5810
  <gov-form-label size="s" slot="top">Přidat přílohu *</gov-form-label>
5439
5811
  <gov-form-group>
5440
- <gov-form-file name="test-me-c">
5812
+ <gov-form-file name="test-me-c" invalid>
5441
5813
  <p>
5442
5814
  <gov-button variant="primary" type="outlined">
5443
5815
  <gov-icon slot="left-icon" name="upload"></gov-icon>
@@ -5461,7 +5833,7 @@ class FormsPage extends HTMLElement {
5461
5833
  <gov-form-label size="s" slot="top">Přidat přílohu *</gov-form-label>
5462
5834
  <gov-form-group>
5463
5835
  <gov-form-file expanded name="test-me-c">
5464
- <p class="gov-color--secondary-800">
5836
+ <p>
5465
5837
  Přetáhněte soubor nebo
5466
5838
  </p>
5467
5839
  <p>
@@ -5476,12 +5848,11 @@ class FormsPage extends HTMLElement {
5476
5848
  </gov-form-group>
5477
5849
  </gov-form-control>
5478
5850
  <br>
5479
-
5480
5851
  <gov-form-control disabled>
5481
5852
  <gov-form-label size="s" slot="top">Přidat přílohu *</gov-form-label>
5482
5853
  <gov-form-group>
5483
- <gov-form-file expanded name="test-me-c">
5484
- <p class="gov-color--secondary-800">
5854
+ <gov-form-file expanded name="test-me-c" disabled>
5855
+ <p>
5485
5856
  Přetáhněte soubor nebo
5486
5857
  </p>
5487
5858
  <p>
@@ -5496,12 +5867,11 @@ class FormsPage extends HTMLElement {
5496
5867
  </gov-form-group>
5497
5868
  </gov-form-control>
5498
5869
  <br>
5499
-
5500
5870
  <gov-form-control invalid>
5501
5871
  <gov-form-label size="s" slot="top">Přidat přílohu *</gov-form-label>
5502
5872
  <gov-form-group>
5503
- <gov-form-file expanded name="test-me-c">
5504
- <p class="gov-color--secondary-800">
5873
+ <gov-form-file expanded name="test-me-c" invalid>
5874
+ <p>
5505
5875
  Přetáhněte soubor nebo
5506
5876
  </p>
5507
5877
  <p>
@@ -5522,6 +5892,10 @@ class FormsPage extends HTMLElement {
5522
5892
  <br>
5523
5893
  </div>
5524
5894
 
5895
+
5896
+ <!-- ----------------------------------------------------------------------------------------------------------------------------- -->
5897
+
5898
+
5525
5899
  <h2>Multiselect</h2>
5526
5900
  <gov-form-control>
5527
5901
  <gov-form-label slot="top">Multiselect</gov-form-label>
@@ -5544,17 +5918,43 @@ class FormsPage extends HTMLElement {
5544
5918
  </gov-form-message>
5545
5919
  </gov-form-control>
5546
5920
 
5921
+
5922
+ <!-- ----------------------------------------------------------------------------------------------------------------------------- -->
5923
+
5924
+
5547
5925
  <h2>Autocomplete</h2>
5548
5926
  <gov-form-control>
5549
5927
  <gov-form-label slot="top">Label of autocomplete</gov-form-label>
5550
5928
  <gov-form-group>
5551
- <gov-form-autocomplete placeholder="Placeholder autcomplete" id="bagr"></gov-form-autocomplete>
5929
+ <gov-form-autocomplete placeholder="Placeholder autcomplete" id="bagr">
5930
+ <gov-icon name="search" slot="right-icon" />
5931
+ </gov-form-autocomplete>
5932
+ </gov-form-group>
5933
+ </gov-form-control>
5934
+ <gov-form-control>
5935
+ <gov-form-label slot="top">Label of autocomplete</gov-form-label>
5936
+ <gov-form-group>
5937
+ <gov-form-autocomplete placeholder="Placeholder autcomplete" id="bagr" invalid="true">
5938
+ <gov-icon name="search" slot="right-icon" />
5939
+ </gov-form-autocomplete>
5552
5940
  </gov-form-group>
5553
5941
  <gov-form-message slot="bottom" variant="error">
5554
5942
  <gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>
5555
5943
  Required
5556
5944
  </gov-form-message>
5557
5945
  </gov-form-control>
5946
+ <gov-form-control>
5947
+ <gov-form-label slot="top">Label of autocomplete</gov-form-label>
5948
+ <gov-form-group>
5949
+ <gov-form-autocomplete placeholder="Placeholder autcomplete" id="bagr" disabled="true">
5950
+ <gov-icon name="search" slot="right-icon" />
5951
+ </gov-form-autocomplete>
5952
+ </gov-form-group>
5953
+ </gov-form-control>
5954
+
5955
+
5956
+ <!-- ----------------------------------------------------------------------------------------------------------------------------- -->
5957
+
5558
5958
 
5559
5959
  <h2>Textarea</h2>
5560
5960
  <h3>
@@ -5566,21 +5966,23 @@ class FormsPage extends HTMLElement {
5566
5966
  <gov-form-input multiline rows="3" name="test-me" placeholder="Placeholder"></gov-form-input>
5567
5967
  </gov-form-group>
5568
5968
  </gov-form-control>
5969
+
5569
5970
  <h3>
5570
5971
  Invalid
5571
5972
  </h3>
5572
- <gov-form-control invalid="TRUE" type="input" id="metro2">
5973
+ <gov-form-control type="input" id="metro2">
5573
5974
  <gov-form-label size="s" slot="top">Label of textarea</gov-form-label>
5574
5975
  <gov-form-group>
5575
- <gov-form-input required multiline rows="3" name="test-me" value="Value of textarea"></gov-form-input>
5976
+ <gov-form-input required multiline rows="3" name="test-me" value="Value of textarea" invalid="TRUE"></gov-form-input>
5576
5977
  </gov-form-group>
5577
5978
  <gov-form-message slot="bottom" variant="error">
5578
5979
  <gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>
5579
5980
  Required
5580
5981
  </gov-form-message>
5581
5982
  </gov-form-control>
5983
+
5582
5984
  <h3>
5583
- Disabled DDD
5985
+ Disabled
5584
5986
  </h3>
5585
5987
  <gov-form-control id="metro2">
5586
5988
  <gov-form-label size="s" slot="top">Label of textarea</gov-form-label>
@@ -5589,58 +5991,61 @@ class FormsPage extends HTMLElement {
5589
5991
  </gov-form-group>
5590
5992
  </gov-form-control>
5591
5993
 
5994
+
5995
+ <!-- ----------------------------------------------------------------------------------------------------------------------------- -->
5996
+
5997
+
5592
5998
  <h2>Checkbox</h2>
5593
5999
  <h3>
5594
6000
  Gaps
5595
6001
  </h3>
5596
-
5597
- <gov-form-control size="xs">
6002
+ <gov-form-control>
5598
6003
  <gov-form-label size="xs" slot="top">Label of word</gov-form-label>
5599
6004
  <gov-form-group gap="2xs">
5600
- <gov-form-checkbox name="test-me-c" value="me" checked></gov-form-checkbox>
5601
- <gov-form-checkbox name="test-me-c" value="me" checked></gov-form-checkbox>
6005
+ <gov-form-checkbox name="test-me-c" value="me" size="xs" checked></gov-form-checkbox>
6006
+ <gov-form-checkbox name="test-me-c" value="me" size="xs" checked></gov-form-checkbox>
5602
6007
  </gov-form-group>
5603
6008
  </gov-form-control>
5604
6009
  <br>
5605
- <gov-form-control size="xs">
6010
+ <gov-form-control>
5606
6011
  <gov-form-group gap="2xs">
5607
- <gov-form-checkbox name="test-me-c" value="me" required checked>
6012
+ <gov-form-checkbox name="test-me-c" value="me" size="xs" required checked>
5608
6013
  <gov-form-label slot="label">Option 1</gov-form-label>
5609
6014
  </gov-form-checkbox>
5610
- <gov-form-checkbox name="test-me-c" value="me" checked>
6015
+ <gov-form-checkbox name="test-me-c" value="me" size="xs" checked>
5611
6016
  <gov-form-label slot="label">Option 2</gov-form-label>
5612
6017
  </gov-form-checkbox>
5613
6018
  </gov-form-group>
5614
6019
  </gov-form-control>
5615
6020
  <br>
5616
- <gov-form-control size="s">
6021
+ <gov-form-control>
5617
6022
  <gov-form-group gap="xs">
5618
- <gov-form-checkbox name="test-me-c" value="me" checked>
6023
+ <gov-form-checkbox name="test-me-c" value="me" size="s" checked>
5619
6024
  <gov-form-label slot="label">Option 1</gov-form-label>
5620
6025
  </gov-form-checkbox>
5621
- <gov-form-checkbox name="test-me-c" value="me" checked>
6026
+ <gov-form-checkbox name="test-me-c" value="me" size="s" checked>
5622
6027
  <gov-form-label slot="label">Option 2</gov-form-label>
5623
6028
  </gov-form-checkbox>
5624
6029
  </gov-form-group>
5625
6030
  </gov-form-control>
5626
6031
  <br>
5627
- <gov-form-control size="m">
6032
+ <gov-form-control>
5628
6033
  <gov-form-group gap="s">
5629
- <gov-form-checkbox name="test-me-c" value="me" checked>
6034
+ <gov-form-checkbox name="test-me-c" value="me" size="m" checked>
5630
6035
  <gov-form-label slot="label">Option 1</gov-form-label>
5631
6036
  </gov-form-checkbox>
5632
- <gov-form-checkbox name="test-me-c" value="me" checked>
6037
+ <gov-form-checkbox name="test-me-c" value="me" size="m" checked>
5633
6038
  <gov-form-label slot="label">Option 2</gov-form-label>
5634
6039
  </gov-form-checkbox>
5635
6040
  </gov-form-group>
5636
6041
  </gov-form-control>
5637
6042
  <br>
5638
- <gov-form-control size="l">
6043
+ <gov-form-control>
5639
6044
  <gov-form-group gap="m">
5640
- <gov-form-checkbox name="test-me-c" value="me" checked>
6045
+ <gov-form-checkbox name="test-me-c" value="me" size="l" checked>
5641
6046
  <gov-form-label slot="label">Option 1</gov-form-label>
5642
6047
  </gov-form-checkbox>
5643
- <gov-form-checkbox name="test-me-c" value="me" checked>
6048
+ <gov-form-checkbox name="test-me-c" value="me" size="l" checked>
5644
6049
  <gov-form-label slot="label">Option 2</gov-form-label>
5645
6050
  </gov-form-checkbox>
5646
6051
  </gov-form-group>
@@ -5649,40 +6054,41 @@ class FormsPage extends HTMLElement {
5649
6054
  <h3>
5650
6055
  Default
5651
6056
  </h3>
5652
- <gov-form-control size="xs">
6057
+ <gov-form-control>
5653
6058
  <gov-form-group>
5654
- <gov-form-checkbox name="test-me-c" value="me" checked>
6059
+ <gov-form-checkbox name="test-me-c" value="me" size="xs" checked>
5655
6060
  <gov-form-label slot="label">Souhlasím</gov-form-label>
5656
6061
  </gov-form-checkbox>
5657
6062
  </gov-form-group>
5658
6063
  </gov-form-control>
5659
- <gov-form-control size="s">
6064
+ <gov-form-control>
5660
6065
  <gov-form-group>
5661
- <gov-form-checkbox name="test-me-c" value="me" checked>
6066
+ <gov-form-checkbox name="test-me-c" value="me" size="s" checked>
5662
6067
  <gov-form-label slot="label">Souhlasím</gov-form-label>
5663
6068
  </gov-form-checkbox>
5664
6069
  </gov-form-group>
5665
6070
  </gov-form-control>
5666
- <gov-form-control size="m">
6071
+ <gov-form-control>
5667
6072
  <gov-form-group>
5668
- <gov-form-checkbox name="test-me-c" value="me" checked>
6073
+ <gov-form-checkbox name="test-me-c" value="me" size="m" checked>
5669
6074
  <gov-form-label slot="label">Souhlasím</gov-form-label>
5670
6075
  </gov-form-checkbox>
5671
6076
  </gov-form-group>
5672
6077
  </gov-form-control>
5673
- <gov-form-control size="l">
6078
+ <gov-form-control>
5674
6079
  <gov-form-group>
5675
- <gov-form-checkbox name="test-me-c" value="me" checked>
6080
+ <gov-form-checkbox name="test-me-c" value="me" size="l" checked>
5676
6081
  <gov-form-label slot="label">Souhlasím</gov-form-label>
5677
6082
  </gov-form-checkbox>
5678
6083
  </gov-form-group>
5679
6084
  </gov-form-control>
6085
+
5680
6086
  <h3>
5681
6087
  Invalid
5682
6088
  </h3>
5683
- <gov-form-control invalid="true" size="xs">
6089
+ <gov-form-control>
5684
6090
  <gov-form-group>
5685
- <gov-form-checkbox name="test-me-c" value="me" checked>
6091
+ <gov-form-checkbox name="test-me-c" value="me" size="xs" checked invalid="true">
5686
6092
  <gov-form-label slot="label">Souhlasím</gov-form-label>
5687
6093
  </gov-form-checkbox>
5688
6094
  </gov-form-group>
@@ -5691,9 +6097,9 @@ class FormsPage extends HTMLElement {
5691
6097
  Required
5692
6098
  </gov-form-message>
5693
6099
  </gov-form-control>
5694
- <gov-form-control invalid="true" size="s">
6100
+ <gov-form-control>
5695
6101
  <gov-form-group>
5696
- <gov-form-checkbox name="test-me-c" value="me" checked>
6102
+ <gov-form-checkbox name="test-me-c" value="me" size="s" checked invalid="true">
5697
6103
  <gov-form-label slot="label">Souhlasím</gov-form-label>
5698
6104
  </gov-form-checkbox>
5699
6105
  </gov-form-group>
@@ -5702,9 +6108,9 @@ class FormsPage extends HTMLElement {
5702
6108
  Required
5703
6109
  </gov-form-message>
5704
6110
  </gov-form-control>
5705
- <gov-form-control invalid="true" size="m">
6111
+ <gov-form-control>
5706
6112
  <gov-form-group>
5707
- <gov-form-checkbox name="test-me-c" value="me" checked>
6113
+ <gov-form-checkbox name="test-me-c" value="me" size="m" checked invalid="true">
5708
6114
  <gov-form-label slot="label">Souhlasím</gov-form-label>
5709
6115
  </gov-form-checkbox>
5710
6116
  </gov-form-group>
@@ -5713,96 +6119,101 @@ class FormsPage extends HTMLElement {
5713
6119
  Required
5714
6120
  </gov-form-message>
5715
6121
  </gov-form-control>
5716
-
6122
+
5717
6123
  <h3>
5718
6124
  Disabled
5719
6125
  </h3>
5720
- <gov-form-control disabled size="xs">
6126
+ <gov-form-control>
5721
6127
  <gov-form-group>
5722
- <gov-form-checkbox name="test-me-c" value="me">
6128
+ <gov-form-checkbox name="test-me-c" value="me" size="xs" disabled>
5723
6129
  <gov-form-label slot="label">Souhlasím</gov-form-label>
5724
6130
  </gov-form-checkbox>
5725
6131
  </gov-form-group>
5726
6132
  </gov-form-control>
5727
- <gov-form-control disabled="True" size="s">
6133
+ <gov-form-control>
5728
6134
  <gov-form-group>
5729
- <gov-form-checkbox name="test-me-c" value="me">
6135
+ <gov-form-checkbox name="test-me-c" value="me" size="s" disabled="True">
5730
6136
  <gov-form-label slot="label">Souhlasím</gov-form-label>
5731
6137
  </gov-form-checkbox>
5732
6138
  </gov-form-group>
5733
6139
  </gov-form-control>
5734
- <gov-form-control disabled="TRUE" size="m">
6140
+ <gov-form-control>
5735
6141
  <gov-form-group>
5736
- <gov-form-checkbox name="test-me-c" value="me" checked>
6142
+ <gov-form-checkbox name="test-me-c" value="me" size="m" checked disabled="TRUE">
5737
6143
  <gov-form-label slot="label">Souhlasím</gov-form-label>
5738
6144
  </gov-form-checkbox>
5739
6145
  </gov-form-group>
5740
6146
  </gov-form-control>
5741
- <gov-form-control disabled="1" size="l">
6147
+ <gov-form-control>
5742
6148
  <gov-form-group>
5743
- <gov-form-checkbox name="test-me-c" value="me" checked>
6149
+ <gov-form-checkbox name="test-me-c" value="me" size="l" checked disabled="1">
5744
6150
  <gov-form-label slot="label">Souhlasím</gov-form-label>
5745
6151
  </gov-form-checkbox>
5746
6152
  </gov-form-group>
5747
6153
  </gov-form-control>
5748
6154
 
6155
+
6156
+ <!-- ----------------------------------------------------------------------------------------------------------------------------- -->
6157
+
6158
+
5749
6159
  <h2>Radio</h2>
5750
6160
  <h3>
5751
6161
  Default group
5752
6162
  </h3>
5753
- <gov-form-control size="xs" fieldset>
6163
+ <gov-form-control fieldset>
5754
6164
  <gov-form-label legend size="s" slot="top">Seznam skupiny</gov-form-label>
5755
6165
  <gov-form-group>
5756
- <gov-form-radio name="test1" value="me" >
6166
+ <gov-form-radio name="test1" value="me" size="xs">
5757
6167
  <gov-form-label slot="label">Value 1</gov-form-label>
5758
6168
  </gov-form-radio>
5759
- <gov-form-radio name="test1" value="me2" checked>
6169
+ <gov-form-radio name="test1" value="me2" size="xs" checked>
5760
6170
  <gov-form-label slot="label">Value 2</gov-form-label>
5761
6171
  </gov-form-radio>
5762
6172
  </gov-form-group>
5763
6173
  </gov-form-control>
5764
6174
  <br>
5765
- <gov-form-control size="s">
6175
+ <gov-form-control>
5766
6176
  <gov-form-group>
5767
- <gov-form-radio name="test2" value="me" >
6177
+ <gov-form-radio name="test2" value="me" size="s">
5768
6178
  <gov-form-label slot="label">Value 1</gov-form-label>
5769
6179
  </gov-form-radio>
5770
- <gov-form-radio name="test2" value="me2" checked>
6180
+ <gov-form-radio name="test2" value="me2" size="s" checked>
5771
6181
  <gov-form-label slot="label">Value 2</gov-form-label>
5772
6182
  </gov-form-radio>
5773
6183
  </gov-form-group>
5774
6184
  </gov-form-control>
5775
6185
  <br>
5776
- <gov-form-control size="m">
6186
+ <gov-form-control>
5777
6187
  <gov-form-group>
5778
- <gov-form-radio name="test3" value="me" >
6188
+ <gov-form-radio name="test3" value="me" size="m">
5779
6189
  <gov-form-label slot="label">Value 1</gov-form-label>
5780
6190
  </gov-form-radio>
5781
- <gov-form-radio name="test3" value="me2" checked>
6191
+ <gov-form-radio name="test3" value="me2" size="m" checked>
5782
6192
  <gov-form-label slot="label">Value 2</gov-form-label>
5783
6193
  </gov-form-radio>
5784
6194
  </gov-form-group>
5785
6195
  </gov-form-control>
5786
6196
  <br>
5787
- <gov-form-control size="l">
6197
+ <gov-form-control>
5788
6198
  <gov-form-group>
5789
- <gov-form-radio name="test4" value="me" >
6199
+ <gov-form-radio name="test4" value="me" size="l">
5790
6200
  <gov-form-label slot="label">Value 1</gov-form-label>
5791
6201
  </gov-form-radio>
5792
- <gov-form-radio name="test4" value="me2" checked>
6202
+ <gov-form-radio name="test4" value="me2" size="l" checked>
5793
6203
  <gov-form-label slot="label">Value 2</gov-form-label>
5794
6204
  </gov-form-radio>
5795
6205
  </gov-form-group>
5796
6206
  </gov-form-control>
6207
+
5797
6208
  <h3>
5798
6209
  Invalid
5799
6210
  </h3>
5800
- <gov-form-control invalid="true" size="xs">
6211
+ <gov-form-control>
5801
6212
  <gov-form-group>
5802
- <gov-form-radio name="test5" value="me" >
6213
+ <gov-form-radio name="test5" value="me" size="xs" invalid="true">
5803
6214
  <gov-form-label slot="label">Value 1</gov-form-label>
5804
6215
  </gov-form-radio>
5805
- <gov-form-radio name="test5" value="me2" checked>
6216
+ <gov-form-radio name="test5" value="me2" size="xs" checked invalid="true">
5806
6217
  <gov-form-label slot="label">Value 2</gov-form-label>
5807
6218
  </gov-form-radio>
5808
6219
  </gov-form-group>
@@ -5812,12 +6223,12 @@ class FormsPage extends HTMLElement {
5812
6223
  </gov-form-message>
5813
6224
  </gov-form-control>
5814
6225
  <br>
5815
- <gov-form-control invalid="true" size="s">
6226
+ <gov-form-control>
5816
6227
  <gov-form-group>
5817
- <gov-form-radio name="test6" value="me" >
6228
+ <gov-form-radio name="test6" value="me" size="s" invalid="true">
5818
6229
  <gov-form-label slot="label">Value 1</gov-form-label>
5819
6230
  </gov-form-radio>
5820
- <gov-form-radio name="test6" value="me2" checked>
6231
+ <gov-form-radio name="test6" value="me2" size="s" checked invalid="true">
5821
6232
  <gov-form-label slot="label">Value 2</gov-form-label>
5822
6233
  </gov-form-radio>
5823
6234
  </gov-form-group>
@@ -5827,12 +6238,12 @@ class FormsPage extends HTMLElement {
5827
6238
  </gov-form-message>
5828
6239
  </gov-form-control>
5829
6240
  <br>
5830
- <gov-form-control invalid="true" size="m">
6241
+ <gov-form-control>
5831
6242
  <gov-form-group>
5832
- <gov-form-radio name="test7" value="me" >
6243
+ <gov-form-radio name="test7" value="me" size="m" invalid="true">
5833
6244
  <gov-form-label slot="label">Value 1</gov-form-label>
5834
6245
  </gov-form-radio>
5835
- <gov-form-radio name="test7" value="me2" checked>
6246
+ <gov-form-radio name="test7" value="me2" size="m" checked invalid="true">
5836
6247
  <gov-form-label slot="label">Value 2</gov-form-label>
5837
6248
  </gov-form-radio>
5838
6249
  </gov-form-group>
@@ -5842,12 +6253,12 @@ class FormsPage extends HTMLElement {
5842
6253
  </gov-form-message>
5843
6254
  </gov-form-control>
5844
6255
  <br>
5845
- <gov-form-control invalid="true" size="l">
6256
+ <gov-form-control>
5846
6257
  <gov-form-group>
5847
- <gov-form-radio name="test8" value="me" >
6258
+ <gov-form-radio name="test8" value="me" size="l" invalid="true">
5848
6259
  <gov-form-label slot="label">Value 1</gov-form-label>
5849
6260
  </gov-form-radio>
5850
- <gov-form-radio name="test8" value="me2" checked>
6261
+ <gov-form-radio name="test8" value="me2" size="l" checked invalid="true">
5851
6262
  <gov-form-label slot="label">Value 2</gov-form-label>
5852
6263
  </gov-form-radio>
5853
6264
  </gov-form-group>
@@ -5856,61 +6267,66 @@ class FormsPage extends HTMLElement {
5856
6267
  Required
5857
6268
  </gov-form-message>
5858
6269
  </gov-form-control>
6270
+
5859
6271
  <h3>
5860
6272
  Disabled
5861
6273
  </h3>
5862
- <gov-form-control size="xs" disabled>
6274
+ <gov-form-control>
5863
6275
  <gov-form-group>
5864
- <gov-form-radio name="test9" value="me" >
6276
+ <gov-form-radio name="test9" value="me" size="xs" disabled>
5865
6277
  <gov-form-label slot="label">Value 1</gov-form-label>
5866
6278
  </gov-form-radio>
5867
- <gov-form-radio name="test9" value="me2" checked>
6279
+ <gov-form-radio name="test9" value="me2" size="xs" checked disabled>
5868
6280
  <gov-form-label slot="label">Value 2</gov-form-label>
5869
6281
  </gov-form-radio>
5870
6282
  </gov-form-group>
5871
6283
  </gov-form-control>
5872
6284
  <br>
5873
- <gov-form-control disabled="true" size="s">
6285
+ <gov-form-control>
5874
6286
  <gov-form-group>
5875
- <gov-form-radio name="test10" value="me" >
6287
+ <gov-form-radio name="test10" value="me" size="s" disabled="true">
5876
6288
  <gov-form-label slot="label">Value 1</gov-form-label>
5877
6289
  </gov-form-radio>
5878
- <gov-form-radio name="test10" value="me2" checked>
6290
+ <gov-form-radio name="test10" value="me2" size="s" checked disabled="true">
5879
6291
  <gov-form-label slot="label">Value 2</gov-form-label>
5880
6292
  </gov-form-radio>
5881
6293
  </gov-form-group>
5882
6294
  </gov-form-control>
5883
6295
  <br>
5884
- <gov-form-control disabled="true" size="m">
6296
+ <gov-form-control>
5885
6297
  <gov-form-group>
5886
- <gov-form-radio name="test11" value="me" >
6298
+ <gov-form-radio name="test11" value="me" size="m" disabled="true">
5887
6299
  <gov-form-label slot="label">Value 1</gov-form-label>
5888
6300
  </gov-form-radio>
5889
- <gov-form-radio name="test11" value="me2" checked>
6301
+ <gov-form-radio name="test11" value="me2" size="m" checked disabled="true">
5890
6302
  <gov-form-label slot="label">Value 2</gov-form-label>
5891
6303
  </gov-form-radio>
5892
6304
  </gov-form-group>
5893
6305
  </gov-form-control>
5894
6306
  <br>
5895
- <gov-form-control disabled="true" size="l">
6307
+ <gov-form-control>
5896
6308
  <gov-form-group>
5897
- <gov-form-radio name="test12" value="me" >
6309
+ <gov-form-radio name="test12" value="me" size="l" disabled="true">
5898
6310
  <gov-form-label slot="label">Value 1</gov-form-label>
5899
6311
  </gov-form-radio>
5900
- <gov-form-radio name="test12" value="me2" checked>
6312
+ <gov-form-radio name="test12" value="me2" size="l" checked disabled="true">
5901
6313
  <gov-form-label slot="label">Value 2</gov-form-label>
5902
6314
  </gov-form-radio>
5903
6315
  </gov-form-group>
5904
6316
  </gov-form-control>
5905
6317
 
6318
+
6319
+ <!-- ----------------------------------------------------------------------------------------------------------------------------- -->
6320
+
6321
+
5906
6322
  <h2>Select</h2>
5907
6323
  <h3>
5908
6324
  Default
5909
6325
  </h3>
5910
- <gov-form-control size="m">
6326
+ <gov-form-control>
5911
6327
  <gov-form-label size="s" slot="top">Souhlasím</gov-form-label>
5912
6328
  <gov-form-group>
5913
- <gov-form-select name="test-me">
6329
+ <gov-form-select name="test-me" size="m">
5914
6330
  <option value="" selected>Placeholder</option>
5915
6331
  <option value="b">Value B</option>
5916
6332
  <option value="c">Value C</option>
@@ -5918,10 +6334,10 @@ class FormsPage extends HTMLElement {
5918
6334
  </gov-form-select>
5919
6335
  </gov-form-group>
5920
6336
  </gov-form-control>
5921
- <gov-form-control size="l">
6337
+ <gov-form-control>
5922
6338
  <gov-form-label size="s" slot="top">Souhlasím</gov-form-label>
5923
6339
  <gov-form-group>
5924
- <gov-form-select name="test-me">
6340
+ <gov-form-select name="test-me" size="l">
5925
6341
  <option value="a" selected>Value A</option>
5926
6342
  <option value="b">Value B</option>
5927
6343
  <option value="c">Value C</option>
@@ -5929,10 +6345,10 @@ class FormsPage extends HTMLElement {
5929
6345
  </gov-form-select>
5930
6346
  </gov-form-group>
5931
6347
  </gov-form-control>
5932
- <gov-form-control size="xl">
6348
+ <gov-form-control>
5933
6349
  <gov-form-label size="m" slot="top">Souhlasím</gov-form-label>
5934
6350
  <gov-form-group>
5935
- <gov-form-select name="test-me">
6351
+ <gov-form-select name="test-me" size="xl">
5936
6352
  <option value="a" selected>Value A</option>
5937
6353
  <option value="b">Value B</option>
5938
6354
  <option value="c">Value C</option>
@@ -5940,16 +6356,16 @@ class FormsPage extends HTMLElement {
5940
6356
  </gov-form-select>
5941
6357
  </gov-form-group>
5942
6358
  </gov-form-control>
6359
+
5943
6360
  <h3>
5944
6361
  Prefix / sufix
5945
6362
  </h3>
5946
- <gov-form-control size="m">
6363
+ <gov-form-control>
5947
6364
  <gov-form-label size="s" slot="top">Souhlasím</gov-form-label>
5948
6365
  <gov-form-group>
5949
- <gov-form-select name="test-me">
6366
+ <gov-form-select name="test-me" size="m">
5950
6367
  <span slot="prefix">$</span>
5951
6368
  <span slot="sufix">Kč</span>
5952
-
5953
6369
  <option value="" selected>Placeholder</option>
5954
6370
  <option value="b">Value B</option>
5955
6371
  <option value="c">Value C</option>
@@ -5957,13 +6373,12 @@ class FormsPage extends HTMLElement {
5957
6373
  </gov-form-select>
5958
6374
  </gov-form-group>
5959
6375
  </gov-form-control>
5960
- <gov-form-control size="l">
6376
+ <gov-form-control>
5961
6377
  <gov-form-label size="s" slot="top">Souhlasím</gov-form-label>
5962
6378
  <gov-form-group>
5963
- <gov-form-select name="test-me">
6379
+ <gov-form-select name="test-me" size="l">
5964
6380
  <span slot="prefix">$</span>
5965
6381
  <span slot="sufix">Kč</span>
5966
-
5967
6382
  <option value="a" selected>Value A</option>
5968
6383
  <option value="b">Value B</option>
5969
6384
  <option value="c">Value C</option>
@@ -5971,13 +6386,12 @@ class FormsPage extends HTMLElement {
5971
6386
  </gov-form-select>
5972
6387
  </gov-form-group>
5973
6388
  </gov-form-control>
5974
- <gov-form-control size="l">
6389
+ <gov-form-control>
5975
6390
  <gov-form-label size="m" slot="top">Souhlasím</gov-form-label>
5976
6391
  <gov-form-group>
5977
- <gov-form-select name="test-me">
6392
+ <gov-form-select name="test-me" size="l">
5978
6393
  <span slot="prefix">$</span>
5979
6394
  <span slot="sufix">Kč</span>
5980
-
5981
6395
  <option value="a" selected>Value A</option>
5982
6396
  <option value="b">Value B</option>
5983
6397
  <option value="c">Value C</option>
@@ -5985,13 +6399,14 @@ class FormsPage extends HTMLElement {
5985
6399
  </gov-form-select>
5986
6400
  </gov-form-group>
5987
6401
  </gov-form-control>
6402
+
5988
6403
  <h3>
5989
6404
  Invalid
5990
6405
  </h3>
5991
- <gov-form-control invalid="true" size="m">
6406
+ <gov-form-control>
5992
6407
  <gov-form-label size="s" slot="top">Souhlasím</gov-form-label>
5993
6408
  <gov-form-group>
5994
- <gov-form-select name="test-me">
6409
+ <gov-form-select name="test-me" size="m" invalid="true">
5995
6410
  <option value="" selected>Placeholder</option>
5996
6411
  <option value="b">Value B</option>
5997
6412
  <option value="c">Value C</option>
@@ -6003,10 +6418,10 @@ class FormsPage extends HTMLElement {
6003
6418
  Required
6004
6419
  </gov-form-message>
6005
6420
  </gov-form-control>
6006
- <gov-form-control invalid="true" size="l">
6421
+ <gov-form-control>
6007
6422
  <gov-form-label size="s" slot="top">Souhlasím</gov-form-label>
6008
6423
  <gov-form-group>
6009
- <gov-form-select name="test-me">
6424
+ <gov-form-select name="test-me" size="l" invalid="true">
6010
6425
  <option value="" selected>Placeholder</option>
6011
6426
  <option value="b">Value B</option>
6012
6427
  <option value="c">Value C</option>
@@ -6018,10 +6433,10 @@ class FormsPage extends HTMLElement {
6018
6433
  Required
6019
6434
  </gov-form-message>
6020
6435
  </gov-form-control>
6021
- <gov-form-control invalid="true" size="xl">
6436
+ <gov-form-control>
6022
6437
  <gov-form-label size="m" slot="top">Souhlasím</gov-form-label>
6023
6438
  <gov-form-group>
6024
- <gov-form-select name="test-me">
6439
+ <gov-form-select name="test-me" size="xl" invalid="true">
6025
6440
  <option value="" selected>Placeholder</option>
6026
6441
  <option value="b">Value B</option>
6027
6442
  <option value="c">Value C</option>
@@ -6033,13 +6448,14 @@ class FormsPage extends HTMLElement {
6033
6448
  Required
6034
6449
  </gov-form-message>
6035
6450
  </gov-form-control>
6451
+
6036
6452
  <h3>
6037
6453
  Disabled
6038
6454
  </h3>
6039
- <gov-form-control size="m" disabled>
6455
+ <gov-form-control>
6040
6456
  <gov-form-label size="s" slot="top">Souhlasím</gov-form-label>
6041
6457
  <gov-form-group>
6042
- <gov-form-select name="test-me">
6458
+ <gov-form-select name="test-me" size="m" disabled>
6043
6459
  <option value="" selected>Placeholder</option>
6044
6460
  <option value="b">Value B</option>
6045
6461
  <option value="c">Value C</option>
@@ -6047,10 +6463,10 @@ class FormsPage extends HTMLElement {
6047
6463
  </gov-form-select>
6048
6464
  </gov-form-group>
6049
6465
  </gov-form-control>
6050
- <gov-form-control disabled="true" size="m">
6466
+ <gov-form-control>
6051
6467
  <gov-form-label size="s" slot="top">Souhlasím</gov-form-label>
6052
6468
  <gov-form-group>
6053
- <gov-form-select name="test-me">
6469
+ <gov-form-select name="test-me" size="m" disabled="true">
6054
6470
  <option value="" selected>Placeholder</option>
6055
6471
  <option value="b">Value B</option>
6056
6472
  <option value="c">Value C</option>
@@ -6058,10 +6474,10 @@ class FormsPage extends HTMLElement {
6058
6474
  </gov-form-select>
6059
6475
  </gov-form-group>
6060
6476
  </gov-form-control>
6061
- <gov-form-control disabled="true" size="l">
6477
+ <gov-form-control>
6062
6478
  <gov-form-label size="m" slot="top">Souhlasím</gov-form-label>
6063
6479
  <gov-form-group>
6064
- <gov-form-select name="test-me">
6480
+ <gov-form-select name="test-me" size="l" disabled="true">
6065
6481
  <option value="" selected>Placeholder</option>
6066
6482
  <option value="b">Value B</option>
6067
6483
  <option value="c">Value C</option>
@@ -6070,153 +6486,238 @@ class FormsPage extends HTMLElement {
6070
6486
  </gov-form-group>
6071
6487
  </gov-form-control>
6072
6488
 
6489
+
6490
+ <!-- ----------------------------------------------------------------------------------------------------------------------------- -->
6491
+
6492
+
6073
6493
  <h2>Input</h2>
6074
6494
  <h3>
6075
- Default
6495
+ Primary
6076
6496
  </h3>
6077
- <gov-form-control size="m" type="input" id="metro2">
6497
+ <gov-form-control type="input" id="metro2">
6498
+ <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6499
+ <gov-form-group>
6500
+ <gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" variant="primary" size="s"></gov-form-input>
6501
+ </gov-form-group>
6502
+ </gov-form-control>
6503
+ <gov-form-control type="input" id="metro2">
6504
+ <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6505
+ <gov-form-group>
6506
+ <gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" variant="primary" size="m"></gov-form-input>
6507
+ </gov-form-group>
6508
+ </gov-form-control>
6509
+ <gov-form-control type="input" id="metro2">
6510
+ <gov-form-label size="s" slot="top">Label of input 3333</gov-form-label>
6511
+ <gov-form-group>
6512
+ <gov-form-input id="kapr" name="test-me" value="Value of input" variant="primary" size="l"></gov-form-input>
6513
+ </gov-form-group>
6514
+ </gov-form-control>
6515
+ <gov-form-control type="input" id="metro2">
6516
+ <gov-form-label size="m" slot="top">Label of input</gov-form-label>
6517
+ <gov-form-group>
6518
+ <gov-form-input id="kapr" name="test-me" value="Value of input" variant="primary" size="xl"></gov-form-input>
6519
+ </gov-form-group>
6520
+ </gov-form-control>
6521
+
6522
+ <h3>
6523
+ Secondary
6524
+ </h3>
6525
+ <gov-form-control type="input" id="metro2">
6078
6526
  <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6079
6527
  <gov-form-group>
6080
- <gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder"></gov-form-input>
6528
+ <gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" variant="secondary" size="s"></gov-form-input>
6081
6529
  </gov-form-group>
6082
6530
  </gov-form-control>
6083
- <gov-form-control size="l" type="input" id="metro2">
6531
+ <gov-form-control type="input" id="metro2">
6532
+ <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6533
+ <gov-form-group>
6534
+ <gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" variant="secondary" size="m"></gov-form-input>
6535
+ </gov-form-group>
6536
+ </gov-form-control>
6537
+ <gov-form-control type="input" id="metro2">
6084
6538
  <gov-form-label size="s" slot="top">Label of input 3333</gov-form-label>
6085
6539
  <gov-form-group>
6086
- <gov-form-input id="kapr" name="test-me" value="Value of input"></gov-form-input>
6540
+ <gov-form-input id="kapr" name="test-me" value="Value of input" variant="secondary" size="l"></gov-form-input>
6087
6541
  </gov-form-group>
6088
6542
  </gov-form-control>
6089
- <gov-form-control size="xl" type="input" id="metro2">
6543
+ <gov-form-control type="input" id="metro2">
6090
6544
  <gov-form-label size="m" slot="top">Label of input</gov-form-label>
6091
6545
  <gov-form-group>
6092
- <gov-form-input id="kapr" name="test-me" value="Value of input"></gov-form-input>
6546
+ <gov-form-input id="kapr" name="test-me" value="Value of input" variant="secondary" size="xl"></gov-form-input>
6093
6547
  </gov-form-group>
6094
6548
  </gov-form-control>
6549
+
6095
6550
  <h3>
6096
6551
  Prefix / sufix
6097
6552
  </h3>
6098
- <gov-form-control size="m" type="input" id="metro2">
6553
+ <gov-form-control type="input" id="metro2">
6554
+ <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6555
+ <gov-form-group>
6556
+ <gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" size="s">
6557
+ <span slot="prefix">$</span>
6558
+ <span slot="sufix">Kč</span>
6559
+ </gov-form-input>
6560
+ </gov-form-group>
6561
+ </gov-form-control>
6562
+ <gov-form-control type="input" id="metro2">
6099
6563
  <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6100
6564
  <gov-form-group>
6101
- <gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder">
6565
+ <gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" size="m">
6102
6566
  <span slot="prefix">$</span>
6103
6567
  <span slot="sufix">Kč</span>
6104
6568
  </gov-form-input>
6105
6569
  </gov-form-group>
6106
6570
  </gov-form-control>
6107
- <gov-form-control size="l" type="input" id="metro2">
6571
+ <gov-form-control type="input" id="metro2">
6108
6572
  <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6109
6573
  <gov-form-group>
6110
- <gov-form-input id="kapr" name="test-me" value="Value of input">
6574
+ <gov-form-input id="kapr" name="test-me" value="Value of input" size="l">
6111
6575
  <span slot="prefix">$</span>
6112
6576
  <span slot="sufix">Kč</span>
6113
6577
  </gov-form-input>
6114
6578
  </gov-form-group>
6115
6579
  </gov-form-control>
6116
- <gov-form-control size="xl" type="input" id="metro2">
6580
+ <gov-form-control type="input" id="metro2">
6117
6581
  <gov-form-label size="m" slot="top">Label of input</gov-form-label>
6118
6582
  <gov-form-group>
6119
- <gov-form-input id="kapr" name="test-me" value="Value of input">
6583
+ <gov-form-input id="kapr" name="test-me" value="Value of input" size="xl">
6120
6584
  <span slot="prefix">$</span>
6121
6585
  <span slot="sufix">Kč</span>
6122
6586
  </gov-form-input>
6123
6587
  </gov-form-group>
6124
6588
  </gov-form-control>
6589
+
6125
6590
  <h3>
6126
6591
  Left icon
6127
6592
  </h3>
6128
- <gov-form-control size="m" type="input" id="metro2">
6593
+ <gov-form-control type="input" id="metro2">
6594
+ <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6595
+ <gov-form-group>
6596
+ <gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="s">
6597
+ <gov-icon slot="left-icon" name="info"></gov-icon>
6598
+ </gov-form-input>
6599
+ </gov-form-group>
6600
+ </gov-form-control>
6601
+ <gov-form-control type="input" id="metro2">
6129
6602
  <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6130
6603
  <gov-form-group>
6131
- <gov-form-input id="kapr" name="test-me" placeholder="Placeholder">
6604
+ <gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="m">
6132
6605
  <gov-icon slot="left-icon" name="info"></gov-icon>
6133
6606
  </gov-form-input>
6134
6607
  </gov-form-group>
6135
6608
  </gov-form-control>
6136
- <gov-form-control size="l" type="input" id="metro2">
6609
+ <gov-form-control type="input" id="metro2">
6137
6610
  <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6138
6611
  <gov-form-group>
6139
- <gov-form-input id="kapr" name="test-me" value="Value of input">
6612
+ <gov-form-input id="kapr" name="test-me" value="Value of input" size="l">
6140
6613
  <gov-icon slot="left-icon" name="info"></gov-icon>
6141
6614
  </gov-form-input>
6142
6615
  </gov-form-group>
6143
6616
  </gov-form-control>
6144
- <gov-form-control size="xl" type="input" id="metro2">
6617
+ <gov-form-control type="input" id="metro2">
6145
6618
  <gov-form-label size="m" slot="top">Label of input</gov-form-label>
6146
6619
  <gov-form-group>
6147
- <gov-form-input id="kapr" name="test-me" value="Value of input">
6620
+ <gov-form-input id="kapr" name="test-me" value="Value of input" size="xl">
6148
6621
  <gov-icon slot="left-icon" name="info"></gov-icon>
6149
6622
  </gov-form-input>
6150
6623
  </gov-form-group>
6151
6624
  </gov-form-control>
6625
+
6152
6626
  <h3>
6153
6627
  Right icon
6154
6628
  </h3>
6155
- <gov-form-control size="m" type="input" id="metro2">
6629
+ <gov-form-control type="input" id="metro2">
6156
6630
  <gov-form-label slot="top">Label of input</gov-form-label>
6157
6631
  <gov-form-group>
6158
- <gov-form-input id="kapr" name="test-me" placeholder="Placeholder">
6632
+ <gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="s">
6633
+ <gov-icon slot="right-icon" name="info"></gov-icon>
6159
6634
  </gov-form-input>
6160
6635
  </gov-form-group>
6161
6636
  </gov-form-control>
6162
- <gov-form-control size="l" type="input" id="metro2">
6637
+ <gov-form-control type="input" id="metro2">
6638
+ <gov-form-label slot="top">Label of input</gov-form-label>
6639
+ <gov-form-group>
6640
+ <gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="m">
6641
+ <gov-icon slot="right-icon" name="info"></gov-icon>
6642
+ </gov-form-input>
6643
+ </gov-form-group>
6644
+ </gov-form-control>
6645
+ <gov-form-control type="input" id="metro2">
6163
6646
  <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6164
6647
  <gov-form-group>
6165
- <gov-form-input id="kapr" name="test-me" value="Value of input">
6648
+ <gov-form-input id="kapr" name="test-me" value="Value of input" size="l">
6166
6649
  <gov-icon slot="right-icon" name="info"></gov-icon>
6167
6650
  </gov-form-input>
6168
6651
  </gov-form-group>
6169
6652
  </gov-form-control>
6170
- <gov-form-control size="xl" type="input" id="metro2">
6653
+ <gov-form-control type="input" id="metro2">
6171
6654
  <gov-form-label size="m" slot="top">Label of input</gov-form-label>
6172
6655
  <gov-form-group>
6173
- <gov-form-input id="kapr" name="test-me" value="Value of input">
6656
+ <gov-form-input id="kapr" name="test-me" value="Value of input" size="xl">
6174
6657
  <gov-icon slot="right-icon" name="info"></gov-icon>
6175
6658
  </gov-form-input>
6176
6659
  </gov-form-group>
6177
6660
  </gov-form-control>
6661
+
6178
6662
  <h3>
6179
6663
  Success
6180
6664
  </h3>
6181
- <gov-form-control success="true" size="m" type="input" id="metro2">
6665
+ <gov-form-control type="input" id="metro2" success="true">
6666
+ <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6667
+ <gov-form-group>
6668
+ <gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="s"></gov-form-input>
6669
+ </gov-form-group>
6670
+ </gov-form-control>
6671
+ <gov-form-control type="input" id="metro2" success="true">
6182
6672
  <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6183
6673
  <gov-form-group>
6184
- <gov-form-input id="kapr" name="test-me" placeholder="Placeholder"></gov-form-input>
6674
+ <gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="m"></gov-form-input>
6185
6675
  </gov-form-group>
6186
6676
  </gov-form-control>
6187
- <gov-form-control success="True" size="l" type="input" id="metro2">
6677
+ <gov-form-control type="input" id="metro2" success="True">
6188
6678
  <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6189
6679
  <gov-form-group>
6190
- <gov-form-input id="kapr" name="test-me" value="Value of input">
6680
+ <gov-form-input id="kapr" name="test-me" value="Value of input" size="l">
6191
6681
  <gov-icon slot="right-icon" name="info"></gov-icon>
6192
6682
  </gov-form-input>
6193
6683
  </gov-form-group>
6194
6684
  </gov-form-control>
6195
- <gov-form-control success="1" size="xl" type="input" id="metro2">
6685
+ <gov-form-control type="input" id="metro2" success="1">
6196
6686
  <gov-form-label size="m" slot="top">Label of input</gov-form-label>
6197
6687
  <gov-form-group>
6198
- <gov-form-input id="kapr" name="test-me" value="Value of input">
6688
+ <gov-form-input id="kapr" name="test-me" value="Value of input" size="xl">
6199
6689
  <gov-icon slot="left-icon" name="info"></gov-icon>
6200
6690
  </gov-form-input>
6201
6691
  </gov-form-group>
6202
6692
  </gov-form-control>
6693
+
6203
6694
  <h3>
6204
6695
  Invalid
6205
6696
  </h3>
6206
- <gov-form-control invalid="true" size="m" type="input" id="metro2">
6697
+ <gov-form-control type="input" id="metro2">
6698
+ <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6699
+ <gov-form-group>
6700
+ <gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="s" invalid="true"></gov-form-input>
6701
+ </gov-form-group>
6702
+ <gov-form-message slot="bottom" variant="error">
6703
+ <gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>
6704
+ Required
6705
+ </gov-form-message>
6706
+ </gov-form-control>
6707
+ <gov-form-control type="input" id="metro2">
6207
6708
  <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6208
6709
  <gov-form-group>
6209
- <gov-form-input id="kapr" name="test-me" placeholder="Placeholder"></gov-form-input>
6710
+ <gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="m" invalid="true"></gov-form-input>
6210
6711
  </gov-form-group>
6211
6712
  <gov-form-message slot="bottom" variant="error">
6212
6713
  <gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>
6213
6714
  Required
6214
6715
  </gov-form-message>
6215
6716
  </gov-form-control>
6216
- <gov-form-control invalid="true" size="l" type="input" id="metro2">
6717
+ <gov-form-control type="input" id="metro2">
6217
6718
  <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6218
6719
  <gov-form-group>
6219
- <gov-form-input id="kapr" name="test-me" value="Value of input">
6720
+ <gov-form-input id="kapr" name="test-me" value="Value of input" size="l" invalid="true">
6220
6721
  <gov-icon slot="right-icon" name="info"></gov-icon>
6221
6722
  </gov-form-input>
6222
6723
  </gov-form-group>
@@ -6225,10 +6726,10 @@ class FormsPage extends HTMLElement {
6225
6726
  Required
6226
6727
  </gov-form-message>
6227
6728
  </gov-form-control>
6228
- <gov-form-control invalid="true" size="xl" type="input" id="metro2">
6729
+ <gov-form-control type="input" id="metro2">
6229
6730
  <gov-form-label size="m" slot="top">Label of input</gov-form-label>
6230
6731
  <gov-form-group>
6231
- <gov-form-input id="kapr" name="test-me" value="Value of input">
6732
+ <gov-form-input id="kapr" name="test-me" value="Value of input" size="xl" invalid="true">
6232
6733
  <gov-icon slot="left-icon" name="info"></gov-icon>
6233
6734
  </gov-form-input>
6234
6735
  </gov-form-group>
@@ -6237,34 +6738,47 @@ class FormsPage extends HTMLElement {
6237
6738
  Required
6238
6739
  </gov-form-message>
6239
6740
  </gov-form-control>
6741
+
6240
6742
  <h3>
6241
6743
  Disabled
6242
6744
  </h3>
6243
- <gov-form-control size="m" type="input" id="metro2" disabled>
6745
+ <gov-form-control size="m" type="input" id="metro2">
6244
6746
  <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6245
6747
  <gov-form-group>
6246
- <gov-form-input id="kapr" name="test-me" placeholder="Placeholder">
6748
+ <gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="s" disabled>
6247
6749
  <gov-icon slot="right-icon" name="info"></gov-icon>
6248
6750
  </gov-form-input>
6249
6751
  </gov-form-group>
6250
6752
  </gov-form-control>
6251
- <gov-form-control disabled="True" size="l" type="input" id="metro2">
6753
+ <gov-form-control size="m" type="input" id="metro2">
6252
6754
  <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6253
6755
  <gov-form-group>
6254
- <gov-form-input id="kapr" name="test-me" value="Value of input">
6756
+ <gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="m" disabled>
6255
6757
  <gov-icon slot="right-icon" name="info"></gov-icon>
6256
6758
  </gov-form-input>
6257
6759
  </gov-form-group>
6258
6760
  </gov-form-control>
6259
- <gov-form-control disabled="1" size="xl" type="input" id="metro2">
6761
+ <gov-form-control type="input" id="metro2">
6762
+ <gov-form-label size="s" slot="top">Label of input</gov-form-label>
6763
+ <gov-form-group>
6764
+ <gov-form-input id="kapr" name="test-me" value="Value of input" size="l" disabled="True">
6765
+ <gov-icon slot="right-icon" name="info"></gov-icon>
6766
+ </gov-form-input>
6767
+ </gov-form-group>
6768
+ </gov-form-control>
6769
+ <gov-form-control type="input" id="metro2">
6260
6770
  <gov-form-label size="m" slot="top">Label of input</gov-form-label>
6261
6771
  <gov-form-group>
6262
- <gov-form-input id="kapr" name="test-me" value="Value of input">
6772
+ <gov-form-input id="kapr" name="test-me" value="Value of input" size="xl" disabled="1">
6263
6773
  <gov-icon slot="left-icon" name="info"></gov-icon>
6264
6774
  </gov-form-input>
6265
6775
  </gov-form-group>
6266
6776
  </gov-form-control>
6267
6777
 
6778
+
6779
+ <!-- ----------------------------------------------------------------------------------------------------------------------------- -->
6780
+
6781
+
6268
6782
  <h3>
6269
6783
  Password power
6270
6784
  </h3>
@@ -6273,35 +6787,38 @@ class FormsPage extends HTMLElement {
6273
6787
  <gov-form-password-power power="2">střední</gov-form-password-power>
6274
6788
  <gov-form-password-power power="3">silné</gov-form-password-power>
6275
6789
 
6790
+
6791
+ <!-- ----------------------------------------------------------------------------------------------------------------------------- -->
6792
+
6793
+
6276
6794
  <h2>Switch</h2>
6277
6795
  <h3>
6278
6796
  Default
6279
6797
  </h3>
6280
- <gov-form-control size="xs">
6798
+ <gov-form-control>
6281
6799
  <gov-form-group>
6282
- <gov-form-switch name="test-me" value="me" checked>
6800
+ <gov-form-switch name="test-me" value="me" size="xs" checked>
6283
6801
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6284
6802
  </gov-form-switch>
6285
6803
  </gov-form-group>
6286
6804
  </gov-form-control>
6287
- <gov-form-control size="s">
6805
+ <gov-form-control>
6288
6806
  <gov-form-group>
6289
- <gov-form-switch name="test-me" value="me" checked>
6807
+ <gov-form-switch name="test-me" value="me" size="s" checked>
6290
6808
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6291
6809
  </gov-form-switch>
6292
6810
  </gov-form-group>
6293
6811
  </gov-form-control>
6294
- <gov-form-control size="m">
6812
+ <gov-form-control>
6295
6813
  <gov-form-group>
6296
- <gov-form-switch name="test-me" value="me" checked>
6814
+ <gov-form-switch name="test-me" value="me" size="m" checked>
6297
6815
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6298
6816
  </gov-form-switch>
6299
6817
  </gov-form-group>
6300
6818
  </gov-form-control>
6301
-
6302
- <gov-form-control size="l">
6819
+ <gov-form-control>
6303
6820
  <gov-form-group>
6304
- <gov-form-switch name="test-me" value="me" checked>
6821
+ <gov-form-switch name="test-me" value="me" size="l" checked>
6305
6822
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6306
6823
  </gov-form-switch>
6307
6824
  </gov-form-group>
@@ -6310,9 +6827,9 @@ class FormsPage extends HTMLElement {
6310
6827
  <h3>
6311
6828
  With message
6312
6829
  </h3>
6313
- <gov-form-control size="xs">
6830
+ <gov-form-control>
6314
6831
  <gov-form-group>
6315
- <gov-form-switch name="test-me" value="me" checked>
6832
+ <gov-form-switch name="test-me" value="me" size="xs" checked>
6316
6833
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6317
6834
  </gov-form-switch>
6318
6835
  </gov-form-group>
@@ -6321,9 +6838,9 @@ class FormsPage extends HTMLElement {
6321
6838
  Required
6322
6839
  </gov-form-message>
6323
6840
  </gov-form-control>
6324
- <gov-form-control size="s">
6841
+ <gov-form-control>
6325
6842
  <gov-form-group>
6326
- <gov-form-switch name="test-me" value="me" checked>
6843
+ <gov-form-switch name="test-me" value="me" size="s" checked>
6327
6844
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6328
6845
  </gov-form-switch>
6329
6846
  </gov-form-group>
@@ -6332,9 +6849,9 @@ class FormsPage extends HTMLElement {
6332
6849
  Required
6333
6850
  </gov-form-message>
6334
6851
  </gov-form-control>
6335
- <gov-form-control size="m">
6852
+ <gov-form-control>
6336
6853
  <gov-form-group>
6337
- <gov-form-switch name="test-me" value="me" checked>
6854
+ <gov-form-switch name="test-me" value="me" size="m" checked>
6338
6855
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6339
6856
  </gov-form-switch>
6340
6857
  </gov-form-group>
@@ -6343,9 +6860,9 @@ class FormsPage extends HTMLElement {
6343
6860
  Required
6344
6861
  </gov-form-message>
6345
6862
  </gov-form-control>
6346
- <gov-form-control size="l">
6863
+ <gov-form-control>
6347
6864
  <gov-form-group>
6348
- <gov-form-switch name="test-me" value="me" checked>
6865
+ <gov-form-switch name="test-me" value="me" size="l" checked>
6349
6866
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6350
6867
  </gov-form-switch>
6351
6868
  </gov-form-group>
@@ -6354,99 +6871,102 @@ class FormsPage extends HTMLElement {
6354
6871
  Required
6355
6872
  </gov-form-message>
6356
6873
  </gov-form-control>
6874
+
6357
6875
  <h3>
6358
6876
  With label
6359
6877
  </h3>
6360
- <gov-form-control size="xs">
6878
+ <gov-form-control>
6361
6879
  <gov-form-label size="s" slot="top">Label of toggle</gov-form-label>
6362
6880
  <gov-form-group>
6363
- <gov-form-switch name="test-me" value="me" checked>
6881
+ <gov-form-switch name="test-me" value="me" size="xs" checked>
6364
6882
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6365
6883
  </gov-form-switch>
6366
6884
  </gov-form-group>
6367
6885
  </gov-form-control>
6368
- <gov-form-control size="s">
6886
+ <gov-form-control>
6369
6887
  <gov-form-label size="s" slot="top">Label of toggle</gov-form-label>
6370
6888
  <gov-form-group>
6371
- <gov-form-switch name="test-me" value="me" checked>
6889
+ <gov-form-switch name="test-me" value="me" size="s" checked>
6372
6890
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6373
6891
  </gov-form-switch>
6374
6892
  </gov-form-group>
6375
6893
  </gov-form-control>
6376
- <gov-form-control size="m">
6894
+ <gov-form-control>
6377
6895
  <gov-form-label size="m" slot="top">Label of toggle</gov-form-label>
6378
6896
  <gov-form-group>
6379
- <gov-form-switch name="test-me" value="me" checked>
6897
+ <gov-form-switch name="test-me" value="me" size="m" checked>
6380
6898
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6381
6899
  </gov-form-switch>
6382
6900
  </gov-form-group>
6383
6901
  </gov-form-control>
6384
- <gov-form-control size="l">
6902
+ <gov-form-control>
6385
6903
  <gov-form-label size="m" slot="top">Label of toggle</gov-form-label>
6386
6904
  <gov-form-group>
6387
- <gov-form-switch name="test-me" value="me" checked>
6905
+ <gov-form-switch name="test-me" value="me" size="l" checked>
6388
6906
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6389
6907
  </gov-form-switch>
6390
6908
  </gov-form-group>
6391
6909
  </gov-form-control>
6910
+
6392
6911
  <h3>
6393
6912
  Disabled
6394
6913
  </h3>
6395
- <gov-form-control type="switch" size="xs" disabled>
6914
+ <gov-form-control type="switch">
6396
6915
  <gov-form-group>
6397
- <gov-form-switch name="test-me" value="me">
6916
+ <gov-form-switch name="test-me" value="me" size="xs" disabled>
6398
6917
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6399
6918
  </gov-form-switch>
6400
6919
  </gov-form-group>
6401
6920
  </gov-form-control>
6402
- <gov-form-control type="switch" size="s" disabled="true">
6921
+ <gov-form-control type="switch">
6403
6922
  <gov-form-group>
6404
- <gov-form-switch name="test-me" value="me">
6923
+ <gov-form-switch name="test-me" value="me" size="s" disabled="true">
6405
6924
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6406
6925
  </gov-form-switch>
6407
6926
  </gov-form-group>
6408
6927
  </gov-form-control>
6409
- <gov-form-control type="switch" size="m" disabled="true">
6928
+ <gov-form-control type="switch">
6410
6929
  <gov-form-group>
6411
- <gov-form-switch name="test-me" value="me" checked>
6930
+ <gov-form-switch name="test-me" value="me" size="m" checked disabled="true">
6412
6931
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6413
6932
  </gov-form-switch>
6414
6933
  </gov-form-group>
6415
6934
  </gov-form-control>
6416
- <gov-form-control type="switch" size="l" disabled="true">
6935
+ <gov-form-control type="switch">
6417
6936
  <gov-form-group>
6418
- <gov-form-switch name="test-me" value="me" checked>
6937
+ <gov-form-switch name="test-me" value="me" size="l" checked disabled="true">
6419
6938
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6420
6939
  </gov-form-switch>
6421
6940
  </gov-form-group>
6422
6941
  </gov-form-control>
6942
+
6423
6943
  <h3>
6424
6944
  Invalid
6425
6945
  </h3>
6426
- <gov-form-control size="xs" invalid="True">
6946
+ <gov-form-control>
6427
6947
  <gov-form-group>
6428
- <gov-form-switch invalid name="test-me" value="me" checked>
6948
+ <gov-form-switch invalid name="test-me" value="me" size="xs" invalid="True">
6429
6949
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6430
6950
  </gov-form-switch>
6431
6951
  </gov-form-group>
6432
6952
  </gov-form-control>
6433
- <gov-form-control size="s" invalid="TRUE">
6953
+ <gov-form-control>
6434
6954
  <gov-form-group>
6435
- <gov-form-switch invalid name="test-me" value="me" checked>
6955
+ <gov-form-switch invalid name="test-me" value="me" size="s" invalid="TRUE">
6436
6956
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6437
6957
  </gov-form-switch>
6438
6958
  </gov-form-group>
6439
6959
  </gov-form-control>
6440
- <gov-form-control size="m" invalid="true">
6960
+ <gov-form-control>
6441
6961
  <gov-form-group>
6442
- <gov-form-switch invalid name="test-me" value="me" checked>
6962
+ <gov-form-switch invalid name="test-me" value="me" size="m" invalid="true" checked>
6443
6963
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6444
6964
  </gov-form-switch>
6445
6965
  </gov-form-group>
6446
6966
  </gov-form-control>
6447
- <gov-form-control size="l" invalid="1">
6967
+ <gov-form-control>
6448
6968
  <gov-form-group>
6449
- <gov-form-switch invalid name="test-me" value="me" checked>
6969
+ <gov-form-switch invalid name="test-me" value="me" size="l" invalid="1" checked>
6450
6970
  <gov-form-label slot="label">Souhlasím</gov-form-label>
6451
6971
  </gov-form-switch>
6452
6972
  </gov-form-group>
@@ -6471,101 +6991,6 @@ if (customElements.get('forms-restructue-page') === undefined) {
6471
6991
  customElements.define('forms-restructue-page', FormsRestructurePage);
6472
6992
  }
6473
6993
 
6474
- class FormLabelPage extends HTMLElement {
6475
- connectedCallback() {
6476
- this.innerHTML = `
6477
- <gov-form-label>
6478
- Form Label
6479
- </gov-form-label>
6480
- `;
6481
- }
6482
- }
6483
- if (customElements.get('form-label-page') === undefined) {
6484
- customElements.define('form-label-page', FormLabelPage);
6485
- }
6486
-
6487
- class FormMessagePage extends HTMLElement {
6488
- connectedCallback() {
6489
- this.innerHTML = `
6490
- <gov-form-message>
6491
- <gov-icon slot="icon" name="info"></gov-icon>
6492
- <p>
6493
- Default
6494
- </p>
6495
- </gov-form-message>
6496
- <gov-form-message>
6497
- <p>
6498
- Default
6499
- </p>
6500
- </gov-form-message>
6501
- <gov-form-message variant="secondary">
6502
- <gov-icon name="info" slot="icon"></gov-icon>
6503
- <p>
6504
- Secondary
6505
- </p>
6506
- </gov-form-message>
6507
- <gov-form-message variant="secondary">
6508
- <p>
6509
- Secondary
6510
- </p>
6511
- </gov-form-message>
6512
- <gov-form-message variant="error">
6513
- <gov-icon slot="icon" name="info"></gov-icon>
6514
- <p>
6515
- Error
6516
- </p>
6517
- </gov-form-message>
6518
- <gov-form-message variant="error">
6519
- <p>
6520
- Error
6521
- </p>
6522
- </gov-form-message>
6523
- <gov-form-message variant="warning">
6524
- <gov-icon slot="icon" name="info"></gov-icon>
6525
- <p>
6526
- Warning
6527
- </p>
6528
- </gov-form-message>
6529
- <gov-form-message variant="warning">
6530
- <p>
6531
- Warning
6532
- </p>
6533
- </gov-form-message>
6534
- <gov-form-message variant="success">
6535
- <gov-icon slot="icon" name="info"></gov-icon>
6536
- <p>
6537
- Success
6538
- </p>
6539
- </gov-form-message>
6540
- <gov-form-message variant="success">
6541
- <p>
6542
- Success
6543
- </p>
6544
- </gov-form-message>
6545
- <gov-form-message>
6546
- <gov-icon slot="icon" name="info"></gov-icon>
6547
- <p>
6548
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi vitae dapibus eros, a dapibus metus. Ut a leo lorem. Sed ut fermentum diam. Sed porttitor ligula est, eget lobortis lacus rutrum et. Nunc sapien arcu, faucibus sit amet justo vel, aliquam gravida magna. Pellentesque et tempor risus.
6549
- </p>
6550
- <p>
6551
- Aliquam suscipit justo dolor, et pellentesque dui venenatis quis. Vestibulum dignissim libero urna, non ultricies neque consequat ut.
6552
- </p>
6553
- </gov-form-message>
6554
- <gov-form-message>
6555
- <p>
6556
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi vitae dapibus eros, a dapibus metus. Ut a leo lorem. Sed ut fermentum diam. Sed porttitor ligula est, eget lobortis lacus rutrum et. Nunc sapien arcu, faucibus sit amet justo vel, aliquam gravida magna. Pellentesque et tempor risus.
6557
- </p>
6558
- <p>
6559
- Aliquam suscipit justo dolor, et pellentesque dui venenatis quis. Vestibulum dignissim libero urna, non ultricies neque consequat ut.
6560
- </p>
6561
- </gov-form-message>
6562
- `;
6563
- }
6564
- }
6565
- if (customElements.get('form-message-page') === undefined) {
6566
- customElements.define('form-message-page', FormMessagePage);
6567
- }
6568
-
6569
6994
  class GridPage extends HTMLElement {
6570
6995
  connectedCallback() {
6571
6996
  this.innerHTML = `
@@ -6658,6 +7083,15 @@ if (customElements.get('grid-page') === undefined) {
6658
7083
  customElements.define('grid-page', GridPage);
6659
7084
  }
6660
7085
 
7086
+ class HomePage extends HTMLElement {
7087
+ connectedCallback() {
7088
+ this.innerHTML = ``;
7089
+ }
7090
+ }
7091
+ if (customElements.get('home-page') === undefined) {
7092
+ customElements.define('home-page', HomePage);
7093
+ }
7094
+
6661
7095
  class LayoutPage extends HTMLElement {
6662
7096
  connectedCallback() {
6663
7097
  this.innerHTML = `
@@ -6755,6 +7189,101 @@ if (customElements.get('layout-page') === undefined) {
6755
7189
  customElements.define('layout-page', LayoutPage);
6756
7190
  }
6757
7191
 
7192
+ class LoadingPage extends HTMLElement {
7193
+ connectedCallback() {
7194
+ setTimeout(function () {
7195
+ document.getElementById('btn').addEventListener('gov-click', function () {
7196
+ document.getElementById('loading').setAttribute('loading', 'true');
7197
+ });
7198
+ }, 500);
7199
+ this.innerHTML = `
7200
+ <h2>Loading</h2>
7201
+ <div class="preview-container">
7202
+ <div class="skeletons-defaults">
7203
+ <h2>Default</h2>
7204
+ <gov-skeleton variant="success"></gov-skeleton>
7205
+ </div>
7206
+ <div class="skeletons-appearance-circle">
7207
+ <h2>Default circle</h2>
7208
+ <gov-skeleton shape="circle"> </gov-skeleton>
7209
+ </div>
7210
+ <div class="skeletons-appearance-circle">
7211
+ <h2>Default rect</h2>
7212
+ <gov-skeleton shape="rect"> </gov-skeleton>
7213
+ </div>
7214
+ <div class="skeletons-with-count">
7215
+ <h2>Default 4 rows</h2>
7216
+ <gov-skeleton count="2"></gov-skeleton>
7217
+ </div>
7218
+ <div class="skeletons-animation-no-animation">
7219
+ <h2>Without animation</h2>
7220
+ <gov-skeleton animation="false"></gov-skeleton>
7221
+ </div>
7222
+ <div class="skeletons-animation-pulse">
7223
+ <h2>Pulse animation</h2>
7224
+ <gov-skeleton animation="pulse"></gov-skeleton>
7225
+ </div>
7226
+ <div class="skeletons-animation-progress">
7227
+ <h2>Progress animation</h2>
7228
+ <gov-skeleton animation="progress"></gov-skeleton>
7229
+ </div>
7230
+ <div class="skeletons-with-theming">
7231
+ <h2>Custom styles</h2>
7232
+ <style>
7233
+ .custom-skeleton {
7234
+ --skeleton-width: 100px;
7235
+ --skeleton-height: 100px;
7236
+ --skeleton-background: #cccccc;
7237
+ --skeleton-border-radius: 20px;
7238
+ }
7239
+ </style>
7240
+ <gov-skeleton></gov-skeleton>
7241
+ </div>
7242
+ <div>
7243
+ <h2>Custom width</h2>
7244
+ <gov-skeleton width="500px"></gov-skeleton>
7245
+ </div>
7246
+ <div>
7247
+ <h2>Custom height</h2>
7248
+ <gov-skeleton height="80px"></gov-skeleton>
7249
+ </div>
7250
+ </div>
7251
+
7252
+
7253
+ <gov-button variant="primary" id="btn" wcag-label="Zobrazit načítání">Zobrazit načítání</gov-button>
7254
+
7255
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7256
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7257
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7258
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7259
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7260
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7261
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7262
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7263
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7264
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7265
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7266
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7267
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7268
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7269
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7270
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7271
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7272
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7273
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7274
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7275
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7276
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7277
+ <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
7278
+
7279
+ <gov-loading id="loading">Načítání</gov-loading>
7280
+ `;
7281
+ }
7282
+ }
7283
+ if (customElements.get('loading-page') === undefined) {
7284
+ customElements.define('loading-page', LoadingPage);
7285
+ }
7286
+
6758
7287
  class MessagePage extends HTMLElement {
6759
7288
  connectedCallback() {
6760
7289
  this.innerHTML = `
@@ -6820,155 +7349,45 @@ class MessagePage extends HTMLElement {
6820
7349
  </p>
6821
7350
  </gov-message>
6822
7351
  <br>
6823
- <gov-message inverse variant="warning">
6824
- <gov-icon name="info" slot="icon"></gov-icon>
6825
- <p>
6826
- Font awesome. Default - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.
6827
- </p>
6828
- </gov-message>
6829
- <br>
6830
- <gov-message inverse variant="secondary">
6831
- <gov-icon name="info" slot="icon"></gov-icon>
6832
- <p>
6833
- Font awesome. Default - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.
6834
- </p>
6835
- </gov-message>
6836
- </div>
6837
-
6838
- <h3>Shadow</h3>
6839
- <gov-message variant="secondary" shadow>
6840
- <gov-icon name="info" slot="icon"></gov-icon>
6841
- <p>
6842
- Font awesome. Default - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.
6843
- </p>
6844
- </gov-message>
6845
- `;
6846
- }
6847
- }
6848
- if (customElements.get('message-page') === undefined) {
6849
- customElements.define('message-page', MessagePage);
6850
- }
6851
-
6852
- class ModalPage extends HTMLElement {
6853
- connectedCallback() {
6854
- setTimeout(function () {
6855
- document.getElementById('btn').addEventListener('gov-click', function () {
6856
- document.getElementById('modal').setAttribute('open', 'true');
6857
- });
6858
- }, 500);
6859
- this.innerHTML = `
6860
- <h2>Modal</h2>
6861
- <gov-button variant="primary" id="btn" wcag-label="Zobrazit formulář o výši dávky">Vyplnit formulář</gov-button>
6862
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6863
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6864
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6865
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6866
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6867
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6868
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6869
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6870
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6871
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6872
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6873
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6874
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6875
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6876
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6877
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6878
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6879
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6880
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6881
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6882
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6883
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6884
- <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6885
-
6886
- <gov-modal label="Podání daňového přiznání" id="modal" wcag-close-label="Zavřít modal žádosti o dávku">
6887
- <gov-icon slot="icon" name="info"></gov-icon>
6888
- <h3>Obsah modálního okna</h3>
6889
- <p>Bude tvořen libovolnými komponentami</p>
6890
- <h3>Obsah modálního okna</h3>
6891
- <p>
6892
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis eros libero, pulvinar vitae tempor at, laoreet quis mi. Vivamus vitae orci mi. Sed eget nisi convallis, condimentum diam a, fermentum risus. Proin vulputate pretium nisi sit amet commodo. Fusce ac magna velit. Maecenas sit amet sem quis arcu lobortis varius a non urna. Morbi ex neque, tempor bibendum sagittis vitae, vulputate ut nibh. Vestibulum sit amet pretium metus. Interdum et malesuada fames ac ante ipsum primis in faucibus. Ut molestie varius nisi, sed mattis quam mollis vulputate. Morbi semper, purus sed ornare sodales, risus tellus porta massa, et eleifend erat diam vitae ex.
6893
- </p>
6894
- <p>
6895
- Suspendisse quis justo nibh. Aenean id purus mattis, posuere urna a, blandit magna. Aenean a ante eleifend, ornare ipsum quis, bibendum mauris. Integer eget posuere sem, in tincidunt quam. Phasellus massa erat, sodales vel hendrerit vitae, ultrices quis dolor. Fusce id vestibulum sem, eu pretium sem. Praesent lacinia, odio non aliquam cursus, arcu ipsum ornare diam, vitae pharetra erat dui non velit. Quisque eu tempus mi. Nam a diam mauris. Quisque sollicitudin risus eu neque accumsan vulputate. Ut tincidunt metus eu nulla sodales, vitae dictum justo ornare. In tincidunt lobortis nunc, ac imperdiet odio condimentum nec. Ut aliquet pulvinar ligula vitae tincidunt. Phasellus egestas ut leo pretium laoreet. Fusce et vestibulum purus. Duis semper sem massa, non dignissim nunc aliquam sit amet.
6896
- </p>
6897
- <p>
6898
- Praesent blandit mattis neque varius sagittis. Nulla ac scelerisque justo. Vestibulum aliquet blandit pharetra. Quisque lacus mi, tincidunt ac dui at, lobortis efficitur nisi. Fusce laoreet maximus purus, sit amet pulvinar mauris facilisis in. Integer fermentum elit eu aliquam sodales. Curabitur laoreet pharetra est rutrum posuere. In at eros tempus ex sodales facilisis. Interdum et malesuada fames ac ante ipsum primis in faucibus. Cras placerat dolor ac urna elementum facilisis. Aenean diam nibh, sollicitudin in porta sed, laoreet in nisl. Ut scelerisque tortor augue, vitae fermentum dui ornare non. Nulla fringilla libero non metus venenatis, eu maximus massa placerat. Praesent elementum convallis metus, vel iaculis sem pretium cursus.
6899
- </p>
6900
- <gov-button slot="footer" variant="primary" wcag-label="Vyplnit formulář o výši dávky">Vyplnit formulář</gov-button>
6901
- </gov-modal>
6902
- `;
6903
- }
6904
- }
6905
- if (customElements.get('modal-page') === undefined) {
6906
- customElements.define('modal-page', ModalPage);
6907
- }
6908
-
6909
- class LoadingPage extends HTMLElement {
6910
- connectedCallback() {
6911
- setTimeout(function () {
6912
- document.getElementById('btn').addEventListener('gov-click', function () {
6913
- document.getElementById('loading').setAttribute('loading', 'true');
6914
- });
6915
- }, 500);
6916
- this.innerHTML = `
6917
- <h2>Loading</h2>
6918
- <div class="preview-container">
6919
- <div class="skeletons-defaults">
6920
- <h2>Default</h2>
6921
- <gov-skeleton variant="success"></gov-skeleton>
6922
- </div>
6923
- <div class="skeletons-appearance-circle">
6924
- <h2>Default circle</h2>
6925
- <gov-skeleton shape="circle"> </gov-skeleton>
6926
- </div>
6927
- <div class="skeletons-appearance-circle">
6928
- <h2>Default rect</h2>
6929
- <gov-skeleton shape="rect"> </gov-skeleton>
6930
- </div>
6931
- <div class="skeletons-with-count">
6932
- <h2>Default 4 rows</h2>
6933
- <gov-skeleton count="2"></gov-skeleton>
6934
- </div>
6935
- <div class="skeletons-animation-no-animation">
6936
- <h2>Without animation</h2>
6937
- <gov-skeleton animation="false"></gov-skeleton>
6938
- </div>
6939
- <div class="skeletons-animation-pulse">
6940
- <h2>Pulse animation</h2>
6941
- <gov-skeleton animation="pulse"></gov-skeleton>
6942
- </div>
6943
- <div class="skeletons-animation-progress">
6944
- <h2>Progress animation</h2>
6945
- <gov-skeleton animation="progress"></gov-skeleton>
6946
- </div>
6947
- <div class="skeletons-with-theming">
6948
- <h2>Custom styles</h2>
6949
- <style>
6950
- .custom-skeleton {
6951
- --skeleton-width: 100px;
6952
- --skeleton-height: 100px;
6953
- --skeleton-background: #cccccc;
6954
- --skeleton-border-radius: 20px;
6955
- }
6956
- </style>
6957
- <gov-skeleton></gov-skeleton>
6958
- </div>
6959
- <div>
6960
- <h2>Custom width</h2>
6961
- <gov-skeleton width="500px"></gov-skeleton>
6962
- </div>
6963
- <div>
6964
- <h2>Custom height</h2>
6965
- <gov-skeleton height="80px"></gov-skeleton>
6966
- </div>
6967
- </div>
6968
-
6969
-
6970
- <gov-button variant="primary" id="btn" wcag-label="Zobrazit načítání">Zobrazit načítání</gov-button>
7352
+ <gov-message inverse variant="warning">
7353
+ <gov-icon name="info" slot="icon"></gov-icon>
7354
+ <p>
7355
+ Font awesome. Default - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.
7356
+ </p>
7357
+ </gov-message>
7358
+ <br>
7359
+ <gov-message inverse variant="secondary">
7360
+ <gov-icon name="info" slot="icon"></gov-icon>
7361
+ <p>
7362
+ Font awesome. Default - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.
7363
+ </p>
7364
+ </gov-message>
7365
+ </div>
7366
+
7367
+ <h3>Shadow</h3>
7368
+ <gov-message variant="secondary" shadow>
7369
+ <gov-icon name="info" slot="icon"></gov-icon>
7370
+ <p>
7371
+ Font awesome. Default - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.
7372
+ </p>
7373
+ </gov-message>
7374
+ `;
7375
+ }
7376
+ }
7377
+ if (customElements.get('message-page') === undefined) {
7378
+ customElements.define('message-page', MessagePage);
7379
+ }
6971
7380
 
7381
+ class ModalPage extends HTMLElement {
7382
+ connectedCallback() {
7383
+ setTimeout(function () {
7384
+ document.getElementById('btn').addEventListener('gov-click', function () {
7385
+ document.getElementById('modal').setAttribute('open', 'true');
7386
+ });
7387
+ }, 500);
7388
+ this.innerHTML = `
7389
+ <h2>Modal</h2>
7390
+ <gov-button variant="primary" id="btn" wcag-label="Zobrazit formulář o výši dávky">Vyplnit formulář</gov-button>
6972
7391
  <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6973
7392
  <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6974
7393
  <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
@@ -6993,12 +7412,27 @@ class LoadingPage extends HTMLElement {
6993
7412
  <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6994
7413
  <p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
6995
7414
 
6996
- <gov-loading id="loading">Načítání</gov-loading>
7415
+ <gov-modal label="Podání daňového přiznání" id="modal" wcag-close-label="Zavřít modal žádosti o dávku">
7416
+ <gov-icon slot="icon" name="info"></gov-icon>
7417
+ <h3>Obsah modálního okna</h3>
7418
+ <p>Bude tvořen libovolnými komponentami</p>
7419
+ <h3>Obsah modálního okna</h3>
7420
+ <p>
7421
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis eros libero, pulvinar vitae tempor at, laoreet quis mi. Vivamus vitae orci mi. Sed eget nisi convallis, condimentum diam a, fermentum risus. Proin vulputate pretium nisi sit amet commodo. Fusce ac magna velit. Maecenas sit amet sem quis arcu lobortis varius a non urna. Morbi ex neque, tempor bibendum sagittis vitae, vulputate ut nibh. Vestibulum sit amet pretium metus. Interdum et malesuada fames ac ante ipsum primis in faucibus. Ut molestie varius nisi, sed mattis quam mollis vulputate. Morbi semper, purus sed ornare sodales, risus tellus porta massa, et eleifend erat diam vitae ex.
7422
+ </p>
7423
+ <p>
7424
+ Suspendisse quis justo nibh. Aenean id purus mattis, posuere urna a, blandit magna. Aenean a ante eleifend, ornare ipsum quis, bibendum mauris. Integer eget posuere sem, in tincidunt quam. Phasellus massa erat, sodales vel hendrerit vitae, ultrices quis dolor. Fusce id vestibulum sem, eu pretium sem. Praesent lacinia, odio non aliquam cursus, arcu ipsum ornare diam, vitae pharetra erat dui non velit. Quisque eu tempus mi. Nam a diam mauris. Quisque sollicitudin risus eu neque accumsan vulputate. Ut tincidunt metus eu nulla sodales, vitae dictum justo ornare. In tincidunt lobortis nunc, ac imperdiet odio condimentum nec. Ut aliquet pulvinar ligula vitae tincidunt. Phasellus egestas ut leo pretium laoreet. Fusce et vestibulum purus. Duis semper sem massa, non dignissim nunc aliquam sit amet.
7425
+ </p>
7426
+ <p>
7427
+ Praesent blandit mattis neque varius sagittis. Nulla ac scelerisque justo. Vestibulum aliquet blandit pharetra. Quisque lacus mi, tincidunt ac dui at, lobortis efficitur nisi. Fusce laoreet maximus purus, sit amet pulvinar mauris facilisis in. Integer fermentum elit eu aliquam sodales. Curabitur laoreet pharetra est rutrum posuere. In at eros tempus ex sodales facilisis. Interdum et malesuada fames ac ante ipsum primis in faucibus. Cras placerat dolor ac urna elementum facilisis. Aenean diam nibh, sollicitudin in porta sed, laoreet in nisl. Ut scelerisque tortor augue, vitae fermentum dui ornare non. Nulla fringilla libero non metus venenatis, eu maximus massa placerat. Praesent elementum convallis metus, vel iaculis sem pretium cursus.
7428
+ </p>
7429
+ <gov-button slot="footer" variant="primary" wcag-label="Vyplnit formulář o výši dávky">Vyplnit formulář</gov-button>
7430
+ </gov-modal>
6997
7431
  `;
6998
7432
  }
6999
7433
  }
7000
- if (customElements.get('loading-page') === undefined) {
7001
- customElements.define('loading-page', LoadingPage);
7434
+ if (customElements.get('modal-page') === undefined) {
7435
+ customElements.define('modal-page', ModalPage);
7002
7436
  }
7003
7437
 
7004
7438
  class NavPage extends HTMLElement {
@@ -7982,9 +8416,127 @@ if (customElements.get('tiles-page') === undefined) {
7982
8416
  customElements.define('tiles-page', TilesPage);
7983
8417
  }
7984
8418
 
8419
+ class ToastMessagePage extends HTMLElement {
8420
+ connectedCallback() {
8421
+ this.innerHTML = `
8422
+ <h2>
8423
+ Toast Message
8424
+ </h2>
8425
+ <gov-toast variant="success">
8426
+ <gov-icon name="check-lg" slot="icon"></gov-icon>
8427
+ <p>
8428
+ Vaše dokumenty byly úspěšně staženy.
8429
+ </p>
8430
+ </gov-toast>
8431
+ <br>
8432
+ <gov-toast variant="error" gravity="bottom" position="left">
8433
+ <gov-icon name="info" slot="icon"></gov-icon>
8434
+ <p>
8435
+ Není možné požadavek zpracovat z důvodu chyby serveru.
8436
+ </p>
8437
+ </gov-toast>
8438
+ <br>
8439
+ <gov-toast variant="warning" position="left">
8440
+ <gov-icon name="info" slot="icon"></gov-icon>
8441
+ <p>
8442
+ Žádost se nepodařilo odeslat, zkontrolujte nastavení.
8443
+ </p>
8444
+ </gov-toast>
8445
+ <br>
8446
+ <gov-toast variant="primary" position="center">
8447
+ <gov-icon name="info" slot="icon"></gov-icon>
8448
+ <p>
8449
+ Soubory jsou připraveny ke stažení.
8450
+ </p>
8451
+ </gov-toast>
8452
+ <br>
8453
+ <gov-toast variant="secondary" gravity="bottom" position="right">
8454
+ <gov-icon name="info" slot="icon"></gov-icon>
8455
+ <p>
8456
+ Vaše aplikace byla aktualizovaná na novou verzi!
8457
+ </p>
8458
+ </gov-toast>
8459
+ `;
8460
+ }
8461
+ }
8462
+ if (customElements.get('toast-message-page') === undefined) {
8463
+ customElements.define('toast-message-page', ToastMessagePage);
8464
+ }
8465
+
8466
+ class ToastMessageCountdownPage extends HTMLElement {
8467
+ connectedCallback() {
8468
+ this.innerHTML = `
8469
+ <h2>
8470
+ Toast Message Countdown
8471
+ </h2>
8472
+ <gov-toast variant="success" type="solid">
8473
+ <gov-icon name="check-lg" slot="icon"></gov-icon>
8474
+ <p>
8475
+ Vaše dokumenty byly úspěšně staženy.
8476
+ </p>
8477
+ </gov-toast>
8478
+ <br>
8479
+ <gov-toast variant="error" type="solid" gravity="bottom" position="left">
8480
+ <gov-icon name="info" slot="icon"></gov-icon>
8481
+ <p>
8482
+ Není možné požadavek zpracovat z důvodu chyby serveru.
8483
+ </p>
8484
+ </gov-toast>
8485
+ <br>
8486
+ <gov-toast variant="warning" type="solid" position="left">
8487
+ <gov-icon name="info" slot="icon"></gov-icon>
8488
+ <p>
8489
+ Žádost se nepodařilo odeslat, zkontrolujte nastavení.
8490
+ </p>
8491
+ </gov-toast>
8492
+ <br>
8493
+ <gov-toast variant="primary" type="solid" position="center">
8494
+ <gov-icon name="info" slot="icon"></gov-icon>
8495
+ <p>
8496
+ Soubory jsou připraveny ke stažení.
8497
+ </p>
8498
+ </gov-toast>
8499
+ <br>
8500
+ <gov-toast variant="secondary" type="solid" gravity="bottom" position="right">
8501
+ <gov-icon name="info" slot="icon"></gov-icon>
8502
+ <p>
8503
+ Vaše aplikace byla aktualizovaná na novou verzi!
8504
+ </p>
8505
+ </gov-toast>
8506
+ `;
8507
+ }
8508
+ }
8509
+ if (customElements.get('toast-message-countdown-page') === undefined) {
8510
+ customElements.define('toast-message-countdown-page', ToastMessageCountdownPage);
8511
+ }
8512
+
7985
8513
  class TooltipPage extends HTMLElement {
7986
8514
  connectedCallback() {
7987
8515
  this.innerHTML = `
8516
+ <div style="width: 500px; overflow: auto; height: 100px">
8517
+ <div style="width: 800px; display: flex; flex-direction: row; height: 100px; gap: 20px">
8518
+ <div style="width: 100px; border: 1px solid black; height: 100px"></div>
8519
+ <div style="width: 100px; border: 1px solid black; height: 100px"></div>
8520
+ <div style="width: 100px; border: 1px solid black; height: 100px"></div>
8521
+ <div style="width: 100px; border: 1px solid black; height: 100px"></div>
8522
+ <div style="width: 100px; border: 1px solid black; height: 100px"></div>
8523
+ <div style="width: 100px; border: 1px solid black; height: 100px"></div>
8524
+ <div style="width: 100px; border: 1px solid black; height: 100px"></div>
8525
+ <div style="width: 100px; border: 1px solid black; height: 100px"></div>
8526
+ <div style="width: 100px; border: 1px solid black; height: 100px"></div>
8527
+ <div style="width: 100px; border: 1px solid black; height: 100px">
8528
+ <gov-tooltip position="right" size="s" icon>
8529
+ <gov-icon name="info"></gov-icon>
8530
+ <gov-tooltip-content>
8531
+ <ul>
8532
+ <li>Toggler div, h1, h2 rozbije celou komponentu. </li>
8533
+ <li>Můžu použít tagy jako span, anchor, gov-icon - inlinové. Zde je použita ikonka z knihovny font-awesome</li>
8534
+ </ul>
8535
+ </gov-tooltip-content>
8536
+ </gov-tooltip>
8537
+ </div>
8538
+ </div>
8539
+ </div>
7988
8540
  <p>
7989
8541
  Default scheme, size Small. Nelze umístit jako toggle element který je blokový - tj. div, h1, h2, atp.
7990
8542
  <gov-tooltip position="right" size="s" icon>
@@ -8194,100 +8746,6 @@ if (customElements.get('typography-page') === undefined) {
8194
8746
  customElements.define('typography-page', TypographyPage);
8195
8747
  }
8196
8748
 
8197
- class ToastMessagePage extends HTMLElement {
8198
- connectedCallback() {
8199
- this.innerHTML = `
8200
- <h2>
8201
- Toast Message
8202
- </h2>
8203
- <gov-toast variant="success">
8204
- <gov-icon name="check-lg" slot="icon"></gov-icon>
8205
- <p>
8206
- Vaše dokumenty byly úspěšně staženy.
8207
- </p>
8208
- </gov-toast>
8209
- <br>
8210
- <gov-toast variant="error" gravity="bottom" position="left">
8211
- <gov-icon name="info" slot="icon"></gov-icon>
8212
- <p>
8213
- Není možné požadavek zpracovat z důvodu chyby serveru.
8214
- </p>
8215
- </gov-toast>
8216
- <br>
8217
- <gov-toast variant="warning" position="left">
8218
- <gov-icon name="info" slot="icon"></gov-icon>
8219
- <p>
8220
- Žádost se nepodařilo odeslat, zkontrolujte nastavení.
8221
- </p>
8222
- </gov-toast>
8223
- <br>
8224
- <gov-toast variant="primary" position="center">
8225
- <gov-icon name="info" slot="icon"></gov-icon>
8226
- <p>
8227
- Soubory jsou připraveny ke stažení.
8228
- </p>
8229
- </gov-toast>
8230
- <br>
8231
- <gov-toast variant="secondary" gravity="bottom" position="right">
8232
- <gov-icon name="info" slot="icon"></gov-icon>
8233
- <p>
8234
- Vaše aplikace byla aktualizovaná na novou verzi!
8235
- </p>
8236
- </gov-toast>
8237
- `;
8238
- }
8239
- }
8240
- if (customElements.get('toast-message-page') === undefined) {
8241
- customElements.define('toast-message-page', ToastMessagePage);
8242
- }
8243
-
8244
- class ToastMessageCountdownPage extends HTMLElement {
8245
- connectedCallback() {
8246
- this.innerHTML = `
8247
- <h2>
8248
- Toast Message Countdown
8249
- </h2>
8250
- <gov-toast variant="success" type="solid">
8251
- <gov-icon name="check-lg" slot="icon"></gov-icon>
8252
- <p>
8253
- Vaše dokumenty byly úspěšně staženy.
8254
- </p>
8255
- </gov-toast>
8256
- <br>
8257
- <gov-toast variant="error" type="solid" gravity="bottom" position="left">
8258
- <gov-icon name="info" slot="icon"></gov-icon>
8259
- <p>
8260
- Není možné požadavek zpracovat z důvodu chyby serveru.
8261
- </p>
8262
- </gov-toast>
8263
- <br>
8264
- <gov-toast variant="warning" type="solid" position="left">
8265
- <gov-icon name="info" slot="icon"></gov-icon>
8266
- <p>
8267
- Žádost se nepodařilo odeslat, zkontrolujte nastavení.
8268
- </p>
8269
- </gov-toast>
8270
- <br>
8271
- <gov-toast variant="primary" type="solid" position="center">
8272
- <gov-icon name="info" slot="icon"></gov-icon>
8273
- <p>
8274
- Soubory jsou připraveny ke stažení.
8275
- </p>
8276
- </gov-toast>
8277
- <br>
8278
- <gov-toast variant="secondary" type="solid" gravity="bottom" position="right">
8279
- <gov-icon name="info" slot="icon"></gov-icon>
8280
- <p>
8281
- Vaše aplikace byla aktualizovaná na novou verzi!
8282
- </p>
8283
- </gov-toast>
8284
- `;
8285
- }
8286
- }
8287
- if (customElements.get('toast-message-countdown-page') === undefined) {
8288
- customElements.define('toast-message-countdown-page', ToastMessageCountdownPage);
8289
- }
8290
-
8291
8749
  class WizzardPage extends HTMLElement {
8292
8750
  connectedCallback() {
8293
8751
  this.innerHTML = `
@@ -8398,6 +8856,7 @@ const GovApp$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement$1 {
8398
8856
  { path: '/message', component: 'message-page' },
8399
8857
  { path: '/cookiebar', component: 'cookiebar-page' },
8400
8858
  { path: '/container', component: 'container-page' },
8859
+ { path: '/control-group', component: 'control-group-page' },
8401
8860
  { path: '/empty', component: 'empty-page' },
8402
8861
  { path: '/error', component: 'error-page' },
8403
8862
  { path: '/forms', component: 'forms-page' },
@@ -8443,6 +8902,7 @@ function defineCustomElement$1() {
8443
8902
  break;
8444
8903
  } });
8445
8904
  }
8905
+ defineCustomElement$1();
8446
8906
 
8447
8907
  const GovApp = GovApp$1;
8448
8908
  const defineCustomElement = defineCustomElement$1;