govuk_publishing_components 17.21.0 → 18.0.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (476) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/javascripts/govuk_publishing_components/all_components.js +1 -1
  3. data/app/assets/javascripts/govuk_publishing_components/components/accordion.js +1 -1
  4. data/app/assets/javascripts/govuk_publishing_components/components/character-count.js +1 -1
  5. data/app/assets/javascripts/govuk_publishing_components/components/checkboxes.js +1 -1
  6. data/app/assets/javascripts/govuk_publishing_components/components/error-summary.js +1 -1
  7. data/app/assets/javascripts/govuk_publishing_components/components/radio.js +1 -1
  8. data/app/assets/javascripts/govuk_publishing_components/lib/header-navigation.js +1 -1
  9. data/app/assets/stylesheets/component_guide/application.scss +5 -7
  10. data/app/assets/stylesheets/govuk_publishing_components/_all_components.scss +1 -2
  11. data/app/assets/stylesheets/govuk_publishing_components/components/_accordion.scss +1 -1
  12. data/app/assets/stylesheets/govuk_publishing_components/components/_attachment.scss +1 -1
  13. data/app/assets/stylesheets/govuk_publishing_components/components/_back-link.scss +1 -1
  14. data/app/assets/stylesheets/govuk_publishing_components/components/_breadcrumbs.scss +5 -1
  15. data/app/assets/stylesheets/govuk_publishing_components/components/_button.scss +3 -15
  16. data/app/assets/stylesheets/govuk_publishing_components/components/_character-count.scss +1 -1
  17. data/app/assets/stylesheets/govuk_publishing_components/components/_checkboxes.scss +2 -2
  18. data/app/assets/stylesheets/govuk_publishing_components/components/_contents-list.scss +28 -9
  19. data/app/assets/stylesheets/govuk_publishing_components/components/_date-input.scss +1 -1
  20. data/app/assets/stylesheets/govuk_publishing_components/components/_details.scss +1 -1
  21. data/app/assets/stylesheets/govuk_publishing_components/components/_document-list.scss +2 -2
  22. data/app/assets/stylesheets/govuk_publishing_components/components/_error-message.scss +1 -1
  23. data/app/assets/stylesheets/govuk_publishing_components/components/_error-summary.scss +1 -1
  24. data/app/assets/stylesheets/govuk_publishing_components/components/_feedback.scss +1 -13
  25. data/app/assets/stylesheets/govuk_publishing_components/components/_fieldset.scss +1 -1
  26. data/app/assets/stylesheets/govuk_publishing_components/components/_file-upload.scss +1 -1
  27. data/app/assets/stylesheets/govuk_publishing_components/components/_govspeak-html-publication.scss +3 -3
  28. data/app/assets/stylesheets/govuk_publishing_components/components/_highlight-boxes.scss +3 -3
  29. data/app/assets/stylesheets/govuk_publishing_components/components/_hint.scss +1 -1
  30. data/app/assets/stylesheets/govuk_publishing_components/components/_image-card.scss +18 -7
  31. data/app/assets/stylesheets/govuk_publishing_components/components/_input.scss +1 -1
  32. data/app/assets/stylesheets/govuk_publishing_components/components/_inset-text.scss +1 -1
  33. data/app/assets/stylesheets/govuk_publishing_components/components/_label.scss +1 -1
  34. data/app/assets/stylesheets/govuk_publishing_components/components/_layout-footer.scss +1 -1
  35. data/app/assets/stylesheets/govuk_publishing_components/components/_layout-for-admin.scss +1 -1
  36. data/app/assets/stylesheets/govuk_publishing_components/components/_layout-header.scss +6 -6
  37. data/app/assets/stylesheets/govuk_publishing_components/components/_modal-dialogue.scss +8 -3
  38. data/app/assets/stylesheets/govuk_publishing_components/components/_panel.scss +1 -1
  39. data/app/assets/stylesheets/govuk_publishing_components/components/_phase-banner.scss +1 -1
  40. data/app/assets/stylesheets/govuk_publishing_components/components/_previous-and-next-navigation.scss +6 -3
  41. data/app/assets/stylesheets/govuk_publishing_components/components/_radio.scss +1 -1
  42. data/app/assets/stylesheets/govuk_publishing_components/components/_related-navigation.scss +1 -1
  43. data/app/assets/stylesheets/govuk_publishing_components/components/_search.scss +10 -3
  44. data/app/assets/stylesheets/govuk_publishing_components/components/_select.scss +1 -1
  45. data/app/assets/stylesheets/govuk_publishing_components/components/_skip-link.scss +1 -1
  46. data/app/assets/stylesheets/govuk_publishing_components/components/_step-by-step-nav-header.scss +3 -3
  47. data/app/assets/stylesheets/govuk_publishing_components/components/_step-by-step-nav.scss +17 -1
  48. data/app/assets/stylesheets/govuk_publishing_components/components/_subscription-links.scss +1 -1
  49. data/app/assets/stylesheets/govuk_publishing_components/components/_table.scss +8 -6
  50. data/app/assets/stylesheets/govuk_publishing_components/components/_tabs.scss +1 -1
  51. data/app/assets/stylesheets/govuk_publishing_components/components/_textarea.scss +1 -1
  52. data/app/assets/stylesheets/govuk_publishing_components/components/_title.scss +5 -5
  53. data/app/assets/stylesheets/govuk_publishing_components/components/_warning-text.scss +1 -1
  54. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_advisory.scss +1 -1
  55. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_attachment.scss +2 -2
  56. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_button.scss +1 -1
  57. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_call-to-action.scss +2 -2
  58. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_charts.scss +2 -2
  59. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_contact.scss +2 -2
  60. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_example.scss +2 -2
  61. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_footnotes.scss +2 -2
  62. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_fraction.scss +2 -2
  63. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_highlight-answer.scss +2 -2
  64. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_information-callout.scss +2 -2
  65. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_legislative-list.scss +1 -1
  66. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_media-player.scss +1 -1
  67. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_place.scss +1 -1
  68. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_stat-headline.scss +1 -1
  69. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_tables.scss +2 -2
  70. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_typography.scss +4 -4
  71. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_warning-callout.scss +1 -1
  72. data/app/assets/stylesheets/govuk_publishing_components/components/helpers/_brand-colours.scss +2 -2
  73. data/app/assets/stylesheets/govuk_publishing_components/components/helpers/_govuk-frontend-settings.scss +0 -4
  74. data/app/assets/stylesheets/govuk_publishing_components/components/helpers/_markdown-typography.scss +4 -1
  75. data/app/assets/stylesheets/govuk_publishing_components/components/helpers/_variables.scss +1 -1
  76. data/app/assets/stylesheets/govuk_publishing_components/components/print/_govspeak.scss +1 -1
  77. data/app/views/govuk_publishing_components/component_guide/index.html.erb +14 -12
  78. data/app/views/govuk_publishing_components/components/_accordion.html.erb +1 -1
  79. data/app/views/govuk_publishing_components/components/_button.html.erb +16 -2
  80. data/app/views/govuk_publishing_components/components/_character_count.html.erb +1 -1
  81. data/app/views/govuk_publishing_components/components/_checkboxes.html.erb +1 -1
  82. data/app/views/govuk_publishing_components/components/_contents_list.html.erb +5 -1
  83. data/app/views/govuk_publishing_components/components/_details.html.erb +3 -1
  84. data/app/views/govuk_publishing_components/components/_error_summary.html.erb +1 -1
  85. data/app/views/govuk_publishing_components/components/_layout_header.html.erb +2 -2
  86. data/app/views/govuk_publishing_components/components/_radio.html.erb +1 -1
  87. data/app/views/govuk_publishing_components/components/_subscription-links.html.erb +2 -2
  88. data/app/views/govuk_publishing_components/components/_tabs.html.erb +1 -1
  89. data/app/views/govuk_publishing_components/components/_textarea.html.erb +1 -1
  90. data/app/views/govuk_publishing_components/components/_title.html.erb +1 -1
  91. data/app/views/govuk_publishing_components/components/docs/button.yml +1 -1
  92. data/app/views/govuk_publishing_components/components/docs/contents_list.yml +12 -0
  93. data/app/views/govuk_publishing_components/components/docs/contextual_breadcrumbs.yml +1 -1
  94. data/app/views/govuk_publishing_components/components/docs/fieldset.yml +1 -1
  95. data/app/views/govuk_publishing_components/components/docs/label.yml +4 -1
  96. data/app/views/govuk_publishing_components/components/docs/table.yml +1 -0
  97. data/app/views/govuk_publishing_components/components/feedback/_problem_form.html.erb +2 -2
  98. data/app/views/govuk_publishing_components/components/feedback/_survey_signup_form.html.erb +2 -2
  99. data/config/initializers/assets.rb +3 -3
  100. data/config/locales/en.yml +0 -2
  101. data/lib/govuk_publishing_components/version.rb +1 -1
  102. data/node_modules/govuk-frontend/README.md +4 -9
  103. data/node_modules/govuk-frontend/govuk-prototype-kit.config.json +4 -5
  104. data/node_modules/govuk-frontend/{all-ie8.scss → govuk/all-ie8.scss} +0 -0
  105. data/node_modules/govuk-frontend/{all.js → govuk/all.js} +116 -63
  106. data/node_modules/govuk-frontend/{all.scss → govuk/all.scss} +0 -0
  107. data/node_modules/govuk-frontend/govuk/assets/fonts/bold-affa96571d-v2.woff +0 -0
  108. data/node_modules/govuk-frontend/govuk/assets/fonts/bold-b542beb274-v2.woff2 +0 -0
  109. data/node_modules/govuk-frontend/govuk/assets/fonts/light-94a07e06a1-v2.woff2 +0 -0
  110. data/node_modules/govuk-frontend/govuk/assets/fonts/light-f591b13f7d-v2.woff +0 -0
  111. data/node_modules/govuk-frontend/{assets → govuk/assets}/images/favicon.ico +0 -0
  112. data/node_modules/govuk-frontend/{assets → govuk/assets}/images/govuk-apple-touch-icon-152x152.png +0 -0
  113. data/node_modules/govuk-frontend/{assets → govuk/assets}/images/govuk-apple-touch-icon-167x167.png +0 -0
  114. data/node_modules/govuk-frontend/{assets → govuk/assets}/images/govuk-apple-touch-icon-180x180.png +0 -0
  115. data/node_modules/govuk-frontend/{assets → govuk/assets}/images/govuk-apple-touch-icon.png +0 -0
  116. data/node_modules/govuk-frontend/{assets → govuk/assets}/images/govuk-crest-2x.png +0 -0
  117. data/node_modules/govuk-frontend/{assets → govuk/assets}/images/govuk-crest.png +0 -0
  118. data/node_modules/govuk-frontend/{assets → govuk/assets}/images/govuk-logotype-crown.png +0 -0
  119. data/node_modules/govuk-frontend/{assets → govuk/assets}/images/govuk-mask-icon.svg +0 -0
  120. data/node_modules/govuk-frontend/{assets → govuk/assets}/images/govuk-opengraph-image.png +0 -0
  121. data/node_modules/govuk-frontend/{common.js → govuk/common.js} +0 -0
  122. data/node_modules/govuk-frontend/{components → govuk/components}/_all.scss +0 -0
  123. data/node_modules/govuk-frontend/{components → govuk/components}/accordion/README.md +0 -0
  124. data/node_modules/govuk-frontend/{components → govuk/components}/accordion/_accordion.scss +48 -28
  125. data/node_modules/govuk-frontend/{components → govuk/components}/accordion/accordion.js +0 -0
  126. data/node_modules/govuk-frontend/{components → govuk/components}/accordion/macro-options.json +8 -2
  127. data/node_modules/govuk-frontend/{components → govuk/components}/accordion/macro.njk +0 -0
  128. data/node_modules/govuk-frontend/{components → govuk/components}/accordion/template.njk +1 -3
  129. data/node_modules/govuk-frontend/{components → govuk/components}/back-link/README.md +0 -0
  130. data/node_modules/govuk-frontend/{components → govuk/components}/back-link/_back-link.scss +17 -9
  131. data/node_modules/govuk-frontend/{components → govuk/components}/back-link/macro-options.json +0 -0
  132. data/node_modules/govuk-frontend/{components → govuk/components}/back-link/macro.njk +0 -0
  133. data/node_modules/govuk-frontend/{components → govuk/components}/back-link/template.njk +0 -0
  134. data/node_modules/govuk-frontend/{components → govuk/components}/breadcrumbs/README.md +0 -0
  135. data/node_modules/govuk-frontend/{components → govuk/components}/breadcrumbs/_breadcrumbs.scss +10 -11
  136. data/node_modules/govuk-frontend/{components → govuk/components}/breadcrumbs/macro-options.json +0 -0
  137. data/node_modules/govuk-frontend/{components → govuk/components}/breadcrumbs/macro.njk +0 -0
  138. data/node_modules/govuk-frontend/{components → govuk/components}/breadcrumbs/template.njk +0 -0
  139. data/node_modules/govuk-frontend/{components → govuk/components}/button/README.md +0 -0
  140. data/node_modules/govuk-frontend/{components → govuk/components}/button/_button.scss +76 -46
  141. data/node_modules/govuk-frontend/{components → govuk/components}/button/button.js +168 -17
  142. data/node_modules/govuk-frontend/{components → govuk/components}/button/macro-options.json +0 -0
  143. data/node_modules/govuk-frontend/{components → govuk/components}/button/macro.njk +0 -0
  144. data/node_modules/govuk-frontend/govuk/components/button/template.njk +60 -0
  145. data/node_modules/govuk-frontend/{components → govuk/components}/character-count/README.md +0 -0
  146. data/node_modules/govuk-frontend/{components → govuk/components}/character-count/_character-count.scss +0 -0
  147. data/node_modules/govuk-frontend/{components → govuk/components}/character-count/character-count.js +5 -1
  148. data/node_modules/govuk-frontend/{components → govuk/components}/character-count/macro-options.json +0 -0
  149. data/node_modules/govuk-frontend/{components → govuk/components}/character-count/macro.njk +0 -0
  150. data/node_modules/govuk-frontend/{components → govuk/components}/character-count/template.njk +2 -2
  151. data/node_modules/govuk-frontend/{components → govuk/components}/checkboxes/README.md +0 -0
  152. data/node_modules/govuk-frontend/{components → govuk/components}/checkboxes/_checkboxes.scss +4 -6
  153. data/node_modules/govuk-frontend/{components → govuk/components}/checkboxes/checkboxes.js +0 -0
  154. data/node_modules/govuk-frontend/{components → govuk/components}/checkboxes/macro-options.json +6 -0
  155. data/node_modules/govuk-frontend/{components → govuk/components}/checkboxes/macro.njk +0 -0
  156. data/node_modules/govuk-frontend/{components → govuk/components}/checkboxes/template.njk +18 -5
  157. data/node_modules/govuk-frontend/{components → govuk/components}/date-input/README.md +0 -0
  158. data/node_modules/govuk-frontend/{components → govuk/components}/date-input/_date-input.scss +0 -0
  159. data/node_modules/govuk-frontend/{components → govuk/components}/date-input/macro-options.json +0 -0
  160. data/node_modules/govuk-frontend/{components → govuk/components}/date-input/macro.njk +0 -0
  161. data/node_modules/govuk-frontend/{components → govuk/components}/date-input/template.njk +1 -1
  162. data/node_modules/govuk-frontend/{components → govuk/components}/details/README.md +0 -0
  163. data/node_modules/govuk-frontend/{components → govuk/components}/details/_details.scss +12 -13
  164. data/node_modules/govuk-frontend/{components → govuk/components}/details/details.js +3 -4
  165. data/node_modules/govuk-frontend/{components → govuk/components}/details/implementation.md +0 -0
  166. data/node_modules/govuk-frontend/{components → govuk/components}/details/macro-options.json +0 -0
  167. data/node_modules/govuk-frontend/{components → govuk/components}/details/macro.njk +0 -0
  168. data/node_modules/govuk-frontend/{components → govuk/components}/details/template.njk +1 -1
  169. data/node_modules/govuk-frontend/{components → govuk/components}/error-message/README.md +0 -0
  170. data/node_modules/govuk-frontend/{components → govuk/components}/error-message/_error-message.scss +0 -0
  171. data/node_modules/govuk-frontend/{components → govuk/components}/error-message/macro-options.json +0 -0
  172. data/node_modules/govuk-frontend/{components → govuk/components}/error-message/macro.njk +0 -0
  173. data/node_modules/govuk-frontend/{components → govuk/components}/error-message/template.njk +0 -0
  174. data/node_modules/govuk-frontend/{components → govuk/components}/error-summary/README.md +0 -0
  175. data/node_modules/govuk-frontend/{components → govuk/components}/error-summary/_error-summary.scss +4 -17
  176. data/node_modules/govuk-frontend/{components → govuk/components}/error-summary/error-summary.js +0 -10
  177. data/node_modules/govuk-frontend/{components → govuk/components}/error-summary/macro-options.json +0 -0
  178. data/node_modules/govuk-frontend/{components → govuk/components}/error-summary/macro.njk +0 -0
  179. data/node_modules/govuk-frontend/{components → govuk/components}/error-summary/template.njk +1 -1
  180. data/node_modules/govuk-frontend/{components → govuk/components}/fieldset/README.md +0 -0
  181. data/node_modules/govuk-frontend/{components → govuk/components}/fieldset/_fieldset.scss +0 -0
  182. data/node_modules/govuk-frontend/{components → govuk/components}/fieldset/macro-options.json +1 -1
  183. data/node_modules/govuk-frontend/{components → govuk/components}/fieldset/macro.njk +0 -0
  184. data/node_modules/govuk-frontend/{components → govuk/components}/fieldset/template.njk +0 -0
  185. data/node_modules/govuk-frontend/{components → govuk/components}/file-upload/README.md +0 -0
  186. data/node_modules/govuk-frontend/govuk/components/file-upload/_file-upload.scss +81 -0
  187. data/node_modules/govuk-frontend/{components → govuk/components}/file-upload/macro-options.json +6 -0
  188. data/node_modules/govuk-frontend/{components → govuk/components}/file-upload/macro.njk +0 -0
  189. data/node_modules/govuk-frontend/{components → govuk/components}/file-upload/template.njk +1 -1
  190. data/node_modules/govuk-frontend/{components → govuk/components}/footer/README.md +0 -0
  191. data/node_modules/govuk-frontend/{components → govuk/components}/footer/_footer.scss +47 -16
  192. data/node_modules/govuk-frontend/{components → govuk/components}/footer/macro-options.json +5 -0
  193. data/node_modules/govuk-frontend/{components → govuk/components}/footer/macro.njk +0 -0
  194. data/node_modules/govuk-frontend/{components → govuk/components}/footer/template.njk +1 -1
  195. data/node_modules/govuk-frontend/{components → govuk/components}/header/README.md +0 -0
  196. data/node_modules/govuk-frontend/{components → govuk/components}/header/_header.scss +34 -21
  197. data/node_modules/govuk-frontend/{components → govuk/components}/header/header.js +1 -1
  198. data/node_modules/govuk-frontend/{components → govuk/components}/header/macro-options.json +2 -2
  199. data/node_modules/govuk-frontend/{components → govuk/components}/header/macro.njk +0 -0
  200. data/node_modules/govuk-frontend/{components → govuk/components}/header/template.njk +6 -9
  201. data/node_modules/govuk-frontend/{components → govuk/components}/hint/README.md +0 -0
  202. data/node_modules/govuk-frontend/{components → govuk/components}/hint/_hint.scss +0 -0
  203. data/node_modules/govuk-frontend/{components → govuk/components}/hint/macro-options.json +0 -0
  204. data/node_modules/govuk-frontend/{components → govuk/components}/hint/macro.njk +0 -0
  205. data/node_modules/govuk-frontend/{components → govuk/components}/hint/template.njk +0 -0
  206. data/node_modules/govuk-frontend/{components → govuk/components}/input/README.md +0 -0
  207. data/node_modules/govuk-frontend/{components → govuk/components}/input/_input.scss +24 -1
  208. data/node_modules/govuk-frontend/{components → govuk/components}/input/macro-options.json +6 -0
  209. data/node_modules/govuk-frontend/{components → govuk/components}/input/macro.njk +0 -0
  210. data/node_modules/govuk-frontend/{components → govuk/components}/input/template.njk +1 -1
  211. data/node_modules/govuk-frontend/{components → govuk/components}/inset-text/README.md +0 -0
  212. data/node_modules/govuk-frontend/{components → govuk/components}/inset-text/_inset-text.scss +0 -0
  213. data/node_modules/govuk-frontend/{components → govuk/components}/inset-text/macro-options.json +0 -0
  214. data/node_modules/govuk-frontend/{components → govuk/components}/inset-text/macro.njk +0 -0
  215. data/node_modules/govuk-frontend/{components → govuk/components}/inset-text/template.njk +0 -0
  216. data/node_modules/govuk-frontend/{components → govuk/components}/label/README.md +0 -0
  217. data/node_modules/govuk-frontend/{components → govuk/components}/label/_label.scss +0 -0
  218. data/node_modules/govuk-frontend/{components → govuk/components}/label/macro-options.json +0 -0
  219. data/node_modules/govuk-frontend/{components → govuk/components}/label/macro.njk +0 -0
  220. data/node_modules/govuk-frontend/{components → govuk/components}/label/template.njk +0 -0
  221. data/node_modules/govuk-frontend/{components → govuk/components}/panel/README.md +0 -0
  222. data/node_modules/govuk-frontend/{components → govuk/components}/panel/_panel.scss +1 -1
  223. data/node_modules/govuk-frontend/{components → govuk/components}/panel/macro-options.json +0 -0
  224. data/node_modules/govuk-frontend/{components → govuk/components}/panel/macro.njk +0 -0
  225. data/node_modules/govuk-frontend/{components → govuk/components}/panel/template.njk +0 -0
  226. data/node_modules/govuk-frontend/{components → govuk/components}/phase-banner/README.md +0 -0
  227. data/node_modules/govuk-frontend/{components → govuk/components}/phase-banner/_phase-banner.scss +0 -0
  228. data/node_modules/govuk-frontend/{components → govuk/components}/phase-banner/macro-options.json +0 -0
  229. data/node_modules/govuk-frontend/{components → govuk/components}/phase-banner/macro.njk +0 -0
  230. data/node_modules/govuk-frontend/{components → govuk/components}/phase-banner/template.njk +5 -7
  231. data/node_modules/govuk-frontend/{components → govuk/components}/radios/README.md +0 -0
  232. data/node_modules/govuk-frontend/{components → govuk/components}/radios/_radios.scss +7 -9
  233. data/node_modules/govuk-frontend/{components → govuk/components}/radios/macro-options.json +0 -0
  234. data/node_modules/govuk-frontend/{components → govuk/components}/radios/macro.njk +0 -0
  235. data/node_modules/govuk-frontend/{components → govuk/components}/radios/radios.js +24 -11
  236. data/node_modules/govuk-frontend/{components → govuk/components}/radios/template.njk +15 -5
  237. data/node_modules/govuk-frontend/{components → govuk/components}/select/README.md +0 -0
  238. data/node_modules/govuk-frontend/{components → govuk/components}/select/_select.scss +23 -1
  239. data/node_modules/govuk-frontend/{components → govuk/components}/select/macro-options.json +6 -0
  240. data/node_modules/govuk-frontend/{components → govuk/components}/select/macro.njk +0 -0
  241. data/node_modules/govuk-frontend/{components → govuk/components}/select/template.njk +1 -1
  242. data/node_modules/govuk-frontend/{components → govuk/components}/skip-link/README.md +0 -0
  243. data/node_modules/govuk-frontend/{components → govuk/components}/skip-link/_skip-link.scss +6 -1
  244. data/node_modules/govuk-frontend/{components → govuk/components}/skip-link/macro-options.json +0 -0
  245. data/node_modules/govuk-frontend/{components → govuk/components}/skip-link/macro.njk +0 -0
  246. data/node_modules/govuk-frontend/{components → govuk/components}/skip-link/template.njk +0 -0
  247. data/node_modules/govuk-frontend/{components → govuk/components}/summary-list/README.md +0 -0
  248. data/node_modules/govuk-frontend/{components → govuk/components}/summary-list/_summary-list.scss +0 -0
  249. data/node_modules/govuk-frontend/{components → govuk/components}/summary-list/macro-options.json +7 -1
  250. data/node_modules/govuk-frontend/{components → govuk/components}/summary-list/macro.njk +0 -0
  251. data/node_modules/govuk-frontend/{components → govuk/components}/summary-list/template.njk +1 -1
  252. data/node_modules/govuk-frontend/{components → govuk/components}/table/README.md +0 -0
  253. data/node_modules/govuk-frontend/{components → govuk/components}/table/_table.scss +1 -0
  254. data/node_modules/govuk-frontend/{components → govuk/components}/table/macro-options.json +0 -0
  255. data/node_modules/govuk-frontend/{components → govuk/components}/table/macro.njk +0 -0
  256. data/node_modules/govuk-frontend/{components → govuk/components}/table/template.njk +14 -14
  257. data/node_modules/govuk-frontend/{components → govuk/components}/tabs/README.md +0 -0
  258. data/node_modules/govuk-frontend/govuk/components/tabs/_tabs.scss +142 -0
  259. data/node_modules/govuk-frontend/{components → govuk/components}/tabs/macro-options.json +0 -0
  260. data/node_modules/govuk-frontend/{components → govuk/components}/tabs/macro.njk +0 -0
  261. data/node_modules/govuk-frontend/{components → govuk/components}/tabs/tabs.js +59 -5
  262. data/node_modules/govuk-frontend/{components → govuk/components}/tabs/template.njk +4 -6
  263. data/node_modules/govuk-frontend/{components → govuk/components}/tag/README.md +0 -0
  264. data/node_modules/govuk-frontend/govuk/components/tag/_tag.scss +44 -0
  265. data/node_modules/govuk-frontend/{components → govuk/components}/tag/macro-options.json +0 -0
  266. data/node_modules/govuk-frontend/{components → govuk/components}/tag/macro.njk +0 -0
  267. data/node_modules/govuk-frontend/{components → govuk/components}/tag/template.njk +0 -0
  268. data/node_modules/govuk-frontend/{components → govuk/components}/textarea/README.md +0 -0
  269. data/node_modules/govuk-frontend/govuk/components/textarea/_textarea.scss +55 -0
  270. data/node_modules/govuk-frontend/{components → govuk/components}/textarea/macro-options.json +6 -0
  271. data/node_modules/govuk-frontend/{components → govuk/components}/textarea/macro.njk +0 -0
  272. data/node_modules/govuk-frontend/{components → govuk/components}/textarea/template.njk +1 -1
  273. data/node_modules/govuk-frontend/{components → govuk/components}/warning-text/README.md +0 -0
  274. data/node_modules/govuk-frontend/{components → govuk/components}/warning-text/_warning-text.scss +0 -0
  275. data/node_modules/govuk-frontend/{components → govuk/components}/warning-text/macro-options.json +0 -0
  276. data/node_modules/govuk-frontend/{components → govuk/components}/warning-text/macro.njk +0 -0
  277. data/node_modules/govuk-frontend/{components → govuk/components}/warning-text/template.njk +0 -0
  278. data/node_modules/govuk-frontend/{core → govuk/core}/_all.scss +0 -0
  279. data/node_modules/govuk-frontend/{core → govuk/core}/_global-styles.scss +0 -0
  280. data/node_modules/govuk-frontend/{core → govuk/core}/_links.scss +0 -0
  281. data/node_modules/govuk-frontend/{core → govuk/core}/_lists.scss +0 -0
  282. data/node_modules/govuk-frontend/{core → govuk/core}/_section-break.scss +0 -0
  283. data/node_modules/govuk-frontend/{core → govuk/core}/_template.scss +0 -0
  284. data/node_modules/govuk-frontend/{core → govuk/core}/_typography.scss +0 -0
  285. data/node_modules/govuk-frontend/{helpers → govuk/helpers}/_all.scss +1 -1
  286. data/node_modules/govuk-frontend/{helpers → govuk/helpers}/_clearfix.scss +0 -0
  287. data/node_modules/govuk-frontend/{helpers → govuk/helpers}/_colour.scss +23 -1
  288. data/node_modules/govuk-frontend/{helpers → govuk/helpers}/_device-pixels.scss +0 -0
  289. data/node_modules/govuk-frontend/govuk/helpers/_focused.scss +28 -0
  290. data/node_modules/govuk-frontend/govuk/helpers/_font-faces.scss +41 -0
  291. data/node_modules/govuk-frontend/govuk/helpers/_grid.scss +60 -0
  292. data/node_modules/govuk-frontend/{helpers → govuk/helpers}/_links.scss +15 -1
  293. data/node_modules/govuk-frontend/{helpers → govuk/helpers}/_media-queries.scss +0 -0
  294. data/node_modules/govuk-frontend/{helpers → govuk/helpers}/_shape-arrow.scss +0 -0
  295. data/node_modules/govuk-frontend/{helpers → govuk/helpers}/_spacing.scss +0 -0
  296. data/node_modules/govuk-frontend/{helpers → govuk/helpers}/_typography.scss +23 -5
  297. data/node_modules/govuk-frontend/{helpers → govuk/helpers}/_visually-hidden.scss +4 -2
  298. data/node_modules/govuk-frontend/{objects → govuk/objects}/_all.scss +0 -0
  299. data/node_modules/govuk-frontend/{objects → govuk/objects}/_form-group.scss +0 -0
  300. data/node_modules/govuk-frontend/{objects → govuk/objects}/_grid.scss +2 -2
  301. data/node_modules/govuk-frontend/{objects → govuk/objects}/_main-wrapper.scss +15 -1
  302. data/node_modules/govuk-frontend/{objects → govuk/objects}/_width-container.scss +0 -0
  303. data/node_modules/govuk-frontend/{overrides → govuk/overrides}/_all.scss +0 -0
  304. data/node_modules/govuk-frontend/{overrides → govuk/overrides}/_display.scss +0 -0
  305. data/node_modules/govuk-frontend/{overrides → govuk/overrides}/_spacing.scss +0 -0
  306. data/node_modules/govuk-frontend/{overrides → govuk/overrides}/_typography.scss +0 -0
  307. data/node_modules/govuk-frontend/{overrides → govuk/overrides}/_width.scss +0 -0
  308. data/node_modules/govuk-frontend/{settings → govuk/settings}/_all.scss +0 -0
  309. data/node_modules/govuk-frontend/{settings → govuk/settings}/_assets.scss +0 -0
  310. data/node_modules/govuk-frontend/{settings → govuk/settings}/_colours-applied.scss +9 -8
  311. data/node_modules/govuk-frontend/{settings → govuk/settings}/_colours-organisations.scss +1 -1
  312. data/node_modules/govuk-frontend/govuk/settings/_colours-palette.scss +101 -0
  313. data/node_modules/govuk-frontend/govuk/settings/_compatibility.scss +75 -0
  314. data/node_modules/govuk-frontend/{settings → govuk/settings}/_global-styles.scss +0 -0
  315. data/node_modules/govuk-frontend/{settings → govuk/settings}/_ie8.scss +0 -0
  316. data/node_modules/govuk-frontend/{settings → govuk/settings}/_measurements.scss +2 -2
  317. data/node_modules/govuk-frontend/{settings → govuk/settings}/_media-queries.scss +0 -0
  318. data/node_modules/govuk-frontend/{settings → govuk/settings}/_spacing.scss +0 -0
  319. data/node_modules/govuk-frontend/{settings → govuk/settings}/_typography-font-families.scss +11 -1
  320. data/node_modules/govuk-frontend/{settings → govuk/settings}/_typography-font.scss +27 -7
  321. data/node_modules/govuk-frontend/{settings → govuk/settings}/_typography-responsive.scss +9 -10
  322. data/node_modules/govuk-frontend/{template.njk → govuk/template.njk} +0 -0
  323. data/node_modules/govuk-frontend/{tools → govuk/tools}/_all.scss +0 -0
  324. data/node_modules/govuk-frontend/{tools → govuk/tools}/_compatibility.scss +0 -0
  325. data/node_modules/govuk-frontend/{tools → govuk/tools}/_exports.scss +0 -0
  326. data/node_modules/govuk-frontend/{tools → govuk/tools}/_font-url.scss +0 -0
  327. data/node_modules/govuk-frontend/{tools → govuk/tools}/_ie8.scss +0 -0
  328. data/node_modules/govuk-frontend/{tools → govuk/tools}/_iff.scss +0 -0
  329. data/node_modules/govuk-frontend/{tools → govuk/tools}/_image-url.scss +0 -0
  330. data/node_modules/govuk-frontend/{tools → govuk/tools}/_px-to-em.scss +0 -0
  331. data/node_modules/govuk-frontend/{tools → govuk/tools}/_px-to-rem.scss +0 -0
  332. data/node_modules/govuk-frontend/{utilities → govuk/utilities}/_all.scss +0 -0
  333. data/node_modules/govuk-frontend/{utilities → govuk/utilities}/_clearfix.scss +0 -0
  334. data/node_modules/govuk-frontend/{utilities → govuk/utilities}/_visually-hidden.scss +0 -0
  335. data/node_modules/govuk-frontend/{vendor → govuk/vendor}/_sass-mq.scss +0 -0
  336. data/node_modules/govuk-frontend/{vendor → govuk/vendor}/polyfills/DOMTokenList.js +0 -0
  337. data/node_modules/govuk-frontend/{vendor → govuk/vendor}/polyfills/Document.js +0 -0
  338. data/node_modules/govuk-frontend/{vendor → govuk/vendor}/polyfills/Element.js +0 -0
  339. data/node_modules/govuk-frontend/{vendor → govuk/vendor}/polyfills/Element/prototype/classList.js +0 -0
  340. data/node_modules/govuk-frontend/{vendor → govuk/vendor}/polyfills/Element/prototype/closest.js +0 -0
  341. data/node_modules/govuk-frontend/{vendor → govuk/vendor}/polyfills/Element/prototype/matches.js +0 -0
  342. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element/prototype/nextElementSibling.js +259 -0
  343. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element/prototype/previousElementSibling.js +257 -0
  344. data/node_modules/govuk-frontend/{vendor → govuk/vendor}/polyfills/Event.js +0 -0
  345. data/node_modules/govuk-frontend/{vendor → govuk/vendor}/polyfills/Function/prototype/bind.js +0 -0
  346. data/node_modules/govuk-frontend/{vendor → govuk/vendor}/polyfills/Object/defineProperty.js +0 -0
  347. data/node_modules/govuk-frontend/{vendor → govuk/vendor}/polyfills/Window.js +0 -0
  348. data/node_modules/govuk-frontend/package.json +21 -21
  349. data/node_modules/react-is/README.md +2 -12
  350. data/node_modules/react-is/build-info.json +5 -5
  351. data/node_modules/react-is/cjs/react-is.development.js +7 -2
  352. data/node_modules/react-is/cjs/react-is.production.min.js +6 -6
  353. data/node_modules/react-is/package.json +13 -13
  354. data/node_modules/react-is/umd/react-is.development.js +7 -2
  355. data/node_modules/react-is/umd/react-is.production.min.js +5 -5
  356. data/node_modules/type/CHANGELOG.md +62 -50
  357. data/node_modules/type/LICENSE +15 -0
  358. data/node_modules/type/README.md +19 -19
  359. data/node_modules/type/error/is.js +28 -7
  360. data/node_modules/type/package.json +36 -22
  361. data/node_modules/type/test/error/is.js +13 -5
  362. metadata +247 -344
  363. data/app/assets/javascripts/govuk_publishing_components/components/accessible-autocomplete.js +0 -79
  364. data/app/assets/stylesheets/govuk_publishing_components/components/_accessible-autocomplete.scss +0 -41
  365. data/app/views/govuk_publishing_components/components/_accessible_autocomplete.html.erb +0 -35
  366. data/app/views/govuk_publishing_components/components/docs/accessible_autocomplete.yml +0 -49
  367. data/node_modules/accessible-autocomplete/CHANGELOG.md +0 -269
  368. data/node_modules/accessible-autocomplete/CONTRIBUTING.md +0 -150
  369. data/node_modules/accessible-autocomplete/LICENSE.txt +0 -20
  370. data/node_modules/accessible-autocomplete/Procfile +0 -1
  371. data/node_modules/accessible-autocomplete/README.md +0 -416
  372. data/node_modules/accessible-autocomplete/accessibility-criteria.md +0 -42
  373. data/node_modules/accessible-autocomplete/app.json +0 -15
  374. data/node_modules/accessible-autocomplete/dist/accessible-autocomplete.min.css +0 -1
  375. data/node_modules/accessible-autocomplete/dist/accessible-autocomplete.min.js +0 -2
  376. data/node_modules/accessible-autocomplete/dist/accessible-autocomplete.min.js.map +0 -1
  377. data/node_modules/accessible-autocomplete/dist/lib/accessible-autocomplete.preact.min.js +0 -2
  378. data/node_modules/accessible-autocomplete/dist/lib/accessible-autocomplete.preact.min.js.map +0 -1
  379. data/node_modules/accessible-autocomplete/dist/lib/accessible-autocomplete.react.min.js +0 -2
  380. data/node_modules/accessible-autocomplete/dist/lib/accessible-autocomplete.react.min.js.map +0 -1
  381. data/node_modules/accessible-autocomplete/examples/form.html +0 -671
  382. data/node_modules/accessible-autocomplete/examples/index.html +0 -665
  383. data/node_modules/accessible-autocomplete/examples/multiselect.html +0 -134
  384. data/node_modules/accessible-autocomplete/examples/preact/index.html +0 -346
  385. data/node_modules/accessible-autocomplete/examples/react/index.html +0 -347
  386. data/node_modules/accessible-autocomplete/package-lock.json +0 -14491
  387. data/node_modules/accessible-autocomplete/package.json +0 -173
  388. data/node_modules/accessible-autocomplete/preact.js +0 -1
  389. data/node_modules/accessible-autocomplete/react.js +0 -1
  390. data/node_modules/accessible-autocomplete/scripts/check-staged.js +0 -14
  391. data/node_modules/accessible-autocomplete/src/autocomplete.css +0 -192
  392. data/node_modules/accessible-autocomplete/src/autocomplete.js +0 -618
  393. data/node_modules/accessible-autocomplete/src/dropdown-arrow-down.js +0 -11
  394. data/node_modules/accessible-autocomplete/src/status.js +0 -80
  395. data/node_modules/accessible-autocomplete/src/wrapper.js +0 -76
  396. data/node_modules/accessible-autocomplete/test/functional/dropdown-arrow-down.js +0 -44
  397. data/node_modules/accessible-autocomplete/test/functional/index.js +0 -485
  398. data/node_modules/accessible-autocomplete/test/functional/wrapper.js +0 -318
  399. data/node_modules/accessible-autocomplete/test/integration/index.js +0 -188
  400. data/node_modules/accessible-autocomplete/test/karma.config.js +0 -42
  401. data/node_modules/accessible-autocomplete/test/wdio.config.js +0 -80
  402. data/node_modules/accessible-autocomplete/webpack.config.babel.js +0 -193
  403. data/node_modules/govuk-frontend/assets/fonts/bold-a2452cb66f-v1.woff2 +0 -0
  404. data/node_modules/govuk-frontend/assets/fonts/bold-f38c792ac2-v1.woff +0 -0
  405. data/node_modules/govuk-frontend/assets/fonts/bold-fb2676462a-v1.eot +0 -0
  406. data/node_modules/govuk-frontend/assets/fonts/bold-tabular-357fdfbcc3-v1.eot +0 -0
  407. data/node_modules/govuk-frontend/assets/fonts/bold-tabular-784c21afb8-v1.woff +0 -0
  408. data/node_modules/govuk-frontend/assets/fonts/bold-tabular-b89238d840-v1.woff2 +0 -0
  409. data/node_modules/govuk-frontend/assets/fonts/light-2c037cf7e1-v1.eot +0 -0
  410. data/node_modules/govuk-frontend/assets/fonts/light-458f8ea81c-v1.woff +0 -0
  411. data/node_modules/govuk-frontend/assets/fonts/light-f38ad40456-v1.woff2 +0 -0
  412. data/node_modules/govuk-frontend/assets/fonts/light-tabular-498ea8ffe2-v1.eot +0 -0
  413. data/node_modules/govuk-frontend/assets/fonts/light-tabular-62cc6f0a28-v1.woff +0 -0
  414. data/node_modules/govuk-frontend/assets/fonts/light-tabular-851b10ccdd-v1.woff2 +0 -0
  415. data/node_modules/govuk-frontend/assets/images/icon-arrow-left.png +0 -0
  416. data/node_modules/govuk-frontend/assets/images/icon-important.png +0 -0
  417. data/node_modules/govuk-frontend/assets/images/icon-pointer-2x.png +0 -0
  418. data/node_modules/govuk-frontend/assets/images/icon-pointer.png +0 -0
  419. data/node_modules/govuk-frontend/components/button/template.njk +0 -35
  420. data/node_modules/govuk-frontend/components/file-upload/_file-upload.scss +0 -19
  421. data/node_modules/govuk-frontend/components/tabs/_tabs.scss +0 -130
  422. data/node_modules/govuk-frontend/components/tag/_tag.scss +0 -33
  423. data/node_modules/govuk-frontend/components/textarea/_textarea.scss +0 -32
  424. data/node_modules/govuk-frontend/helpers/_focusable.scss +0 -34
  425. data/node_modules/govuk-frontend/helpers/_font-faces.scss +0 -67
  426. data/node_modules/govuk-frontend/helpers/_grid.scss +0 -107
  427. data/node_modules/govuk-frontend/settings/_colours-palette.scss +0 -37
  428. data/node_modules/govuk-frontend/settings/_compatibility.scss +0 -51
  429. data/node_modules/preact/LICENSE +0 -21
  430. data/node_modules/preact/README.md +0 -592
  431. data/node_modules/preact/debug.js +0 -740
  432. data/node_modules/preact/debug.js.map +0 -1
  433. data/node_modules/preact/debug/dist/debug.js +0 -2
  434. data/node_modules/preact/debug/dist/debug.js.map +0 -1
  435. data/node_modules/preact/debug/dist/debug.mjs +0 -681
  436. data/node_modules/preact/debug/dist/debug.mjs.map +0 -1
  437. data/node_modules/preact/debug/dist/debug.module.js +0 -2
  438. data/node_modules/preact/debug/dist/debug.module.js.map +0 -1
  439. data/node_modules/preact/debug/dist/debug.umd.js +0 -2
  440. data/node_modules/preact/debug/dist/debug.umd.js.map +0 -1
  441. data/node_modules/preact/debug/index.js +0 -122
  442. data/node_modules/preact/devtools.js +0 -403
  443. data/node_modules/preact/devtools.js.map +0 -1
  444. data/node_modules/preact/devtools/devtools.js +0 -395
  445. data/node_modules/preact/devtools/index.js +0 -4
  446. data/node_modules/preact/dist/preact.d.ts +0 -1712
  447. data/node_modules/preact/dist/preact.dev.js +0 -727
  448. data/node_modules/preact/dist/preact.dev.js.map +0 -1
  449. data/node_modules/preact/dist/preact.js +0 -414
  450. data/node_modules/preact/dist/preact.js.flow +0 -25
  451. data/node_modules/preact/dist/preact.js.map +0 -1
  452. data/node_modules/preact/dist/preact.min.js +0 -2
  453. data/node_modules/preact/dist/preact.min.js.map +0 -1
  454. data/node_modules/preact/dist/preact.mjs +0 -724
  455. data/node_modules/preact/dist/preact.mjs.map +0 -1
  456. data/node_modules/preact/dist/preact.umd.js +0 -751
  457. data/node_modules/preact/dist/preact.umd.js.map +0 -1
  458. data/node_modules/preact/package.json +0 -226
  459. data/node_modules/preact/src/clone-element.js +0 -18
  460. data/node_modules/preact/src/component.js +0 -90
  461. data/node_modules/preact/src/constants.js +0 -17
  462. data/node_modules/preact/src/dom/index.js +0 -139
  463. data/node_modules/preact/src/h.js +0 -86
  464. data/node_modules/preact/src/options.js +0 -22
  465. data/node_modules/preact/src/preact.d.ts +0 -1712
  466. data/node_modules/preact/src/preact.js +0 -32
  467. data/node_modules/preact/src/preact.js.flow +0 -25
  468. data/node_modules/preact/src/render-queue.js +0 -27
  469. data/node_modules/preact/src/render.js +0 -22
  470. data/node_modules/preact/src/util.js +0 -30
  471. data/node_modules/preact/src/vdom/component-recycler.js +0 -48
  472. data/node_modules/preact/src/vdom/component.js +0 -296
  473. data/node_modules/preact/src/vdom/diff.js +0 -337
  474. data/node_modules/preact/src/vdom/index.js +0 -54
  475. data/node_modules/preact/src/vnode.js +0 -9
  476. data/node_modules/preact/typings.json +0 -5
@@ -1,33 +0,0 @@
1
- @import "../../settings/all";
2
- @import "../../tools/all";
3
- @import "../../helpers/all";
4
-
5
- @include govuk-exports("govuk/component/tag") {
6
- .govuk-tag {
7
- @include govuk-font($size: 16, $weight: bold, $line-height: 1.25);
8
-
9
- display: inline-block;
10
- padding: 4px 8px;
11
- // Since New Transport sits slightly higher than other common fonts.
12
- // We use intentionally uneven padding to make it balanced, this can be
13
- // removed using the version of the font that has a more common vertical spacing.
14
- padding-bottom: 1px;
15
-
16
- // When a user customises their colours often the background is removed,
17
- // by adding a outline we ensure that the tag component still keeps it's meaning.
18
- // https://accessibility.blog.gov.uk/2017/03/27/how-users-change-colours-on-websites/
19
- outline: 2px solid transparent;
20
- outline-offset: -2px;
21
-
22
- color: govuk-colour("white");
23
- background-color: govuk-colour("blue");
24
- letter-spacing: 1px;
25
-
26
- text-decoration: none;
27
- text-transform: uppercase;
28
- }
29
-
30
- .govuk-tag--inactive {
31
- background-color: govuk-colour("grey-1");
32
- }
33
- }
@@ -1,32 +0,0 @@
1
- @import "../../settings/all";
2
- @import "../../tools/all";
3
- @import "../../helpers/all";
4
-
5
- @import "../error-message/error-message";
6
- @import "../hint/hint";
7
- @import "../label/label";
8
-
9
- @include govuk-exports("govuk/component/textarea") {
10
- .govuk-textarea {
11
- @include govuk-font($size: 19, $line-height: 1.25);
12
- @include govuk-focusable;
13
-
14
- box-sizing: border-box; // should this be global?
15
- display: block;
16
- width: 100%;
17
- min-height: 40px;
18
- @include govuk-responsive-margin(6, "bottom");
19
- padding: govuk-spacing(1);
20
-
21
- resize: vertical;
22
-
23
- border: $govuk-border-width-form-element solid $govuk-input-border-colour;
24
- border-radius: 0;
25
-
26
- -webkit-appearance: none;
27
- }
28
-
29
- .govuk-textarea--error {
30
- border: $govuk-border-width-form-element-error solid $govuk-error-colour;
31
- }
32
- }
@@ -1,34 +0,0 @@
1
- ////
2
- /// @group helpers
3
- ////
4
-
5
- /// Focusable helper
6
- ///
7
- /// Provides an additional outline to clearly indicate when the target element is
8
- /// focussed. Used for interactive elements which themselves have some background
9
- /// or border, such as most form elements.
10
- ///
11
- /// @access public
12
-
13
- @mixin govuk-focusable {
14
- &:focus {
15
- outline: $govuk-focus-width solid $govuk-focus-colour;
16
- outline-offset: 0;
17
- }
18
- }
19
-
20
- /// Focusable with fill helper
21
- ///
22
- /// Provides an additional outline and background colour to clearly indicate when
23
- /// the target element is focussed. Used for interactive text-based elements such
24
- /// as links.
25
- ///
26
- /// @access public
27
-
28
- @mixin govuk-focusable-fill {
29
- &:focus {
30
- outline: $govuk-focus-width solid $govuk-focus-colour;
31
- outline-offset: 0;
32
- background-color: $govuk-focus-colour;
33
- }
34
- }
@@ -1,67 +0,0 @@
1
- ////
2
- /// @group helpers
3
- ////
4
-
5
- // Disables linting for this file only
6
- // sass-lint:disable no-css-comments, no-duplicate-properties, property-sort-order, indentation
7
-
8
- @import "../tools/exports";
9
-
10
- /// Font Face - NTA
11
- ///
12
- /// Outputs the font-face declaration for NTA at the root of the CSS document
13
- /// the first time it is called.
14
- ///
15
- /// @access private
16
-
17
- @mixin _govuk-font-face-nta {
18
- @include govuk-exports("govuk/helpers/font-face") {
19
- @at-root {
20
- /*! Copyright (c) 2011 by Margaret Calvert & Henrik Kubel. All rights reserved. The font has been customised for exclusive use on gov.uk. This cut is not commercially available. */
21
-
22
- @font-face {
23
- font-family: "nta";
24
- src: govuk-font-url("light-2c037cf7e1-v1.eot");
25
- src: govuk-font-url("light-2c037cf7e1-v1.eot?#iefix") format("embedded-opentype"),
26
- govuk-font-url("light-f38ad40456-v1.woff2") format("woff2"),
27
- govuk-font-url("light-458f8ea81c-v1.woff") format("woff");
28
- font-weight: normal;
29
- font-style: normal;
30
- font-display: fallback;
31
- }
32
-
33
- @font-face {
34
- font-family: "nta";
35
- src: govuk-font-url("bold-fb2676462a-v1.eot");
36
- src: govuk-font-url("bold-fb2676462a-v1.eot?#iefix") format("embedded-opentype"),
37
- govuk-font-url("bold-a2452cb66f-v1.woff2") format("woff2"),
38
- govuk-font-url("bold-f38c792ac2-v1.woff") format("woff");
39
- font-weight: bold;
40
- font-style: normal;
41
- font-display: fallback;
42
- }
43
-
44
- @font-face {
45
- font-family: "ntatabularnumbers";
46
- src: govuk-font-url("light-tabular-498ea8ffe2-v1.eot");
47
- src: govuk-font-url("light-tabular-498ea8ffe2-v1.eot?#iefix") format("embedded-opentype"),
48
- govuk-font-url("light-tabular-851b10ccdd-v1.woff2") format("woff2"),
49
- govuk-font-url("light-tabular-62cc6f0a28-v1.woff") format("woff");
50
- font-weight: normal;
51
- font-style: normal;
52
- font-display: fallback;
53
- }
54
-
55
- @font-face {
56
- font-family: "ntatabularnumbers";
57
- src: govuk-font-url("bold-tabular-357fdfbcc3-v1.eot");
58
- src: govuk-font-url("bold-tabular-357fdfbcc3-v1.eot?#iefix") format("embedded-opentype"),
59
- govuk-font-url("bold-tabular-b89238d840-v1.woff2") format("woff2"),
60
- govuk-font-url("bold-tabular-784c21afb8-v1.woff") format("woff");
61
- font-weight: bold;
62
- font-style: normal;
63
- font-display: fallback;
64
- }
65
- }
66
- }
67
- }
@@ -1,107 +0,0 @@
1
- ////
2
- /// @group helpers
3
- ////
4
-
5
- /// Grid width percentage
6
- ///
7
- /// @param {String} $key - Name of grid width (e.g. two-thirds)
8
- /// @return {Number} Percentage width
9
- /// @throw if `$key` is not a valid grid width
10
- /// @access public
11
-
12
- @function govuk-grid-width($key) {
13
- @if map-has-key($govuk-grid-widths, $key) {
14
- @return map-get($govuk-grid-widths, $key);
15
- }
16
-
17
- @error "Unknown grid width `#{$key}`";
18
- }
19
-
20
- /// Grid width percentage (alias)
21
- ///
22
- /// @alias govuk-grid-width
23
- /// @deprecated To be removed in v3.0, replaced by govuk-grid-width
24
- @function grid-width($key) {
25
- @return govuk-grid-width($key);
26
- }
27
-
28
- /// Generate grid row styles
29
- ///
30
- /// Creates a grid row class with a standardised margin.
31
- ///
32
- /// @param {String} $class [govuk-grid-row] CSS class name
33
- ///
34
- /// @example scss - Default
35
- /// @include govuk-grid-row;
36
- ///
37
- /// @example scss - Customising the class name
38
- /// @include govuk-grid-row("app-grid");
39
- ///
40
- /// @access public
41
- /// @deprecated To be removed in v3.0, replaced by the govuk-grid-row class
42
-
43
- @mixin govuk-grid-row($class: "govuk-grid-row") {
44
- .#{$class} {
45
- @include govuk-clearfix;
46
- margin-right: - ($govuk-gutter-half);
47
- margin-left: - ($govuk-gutter-half);
48
- }
49
- }
50
-
51
- /// Generate grid column styles
52
- ///
53
- /// Creates a grid column with standard gutter between the columns.
54
- ///
55
- /// If a `$class` is provided (which is the default, but deprecated behaviour),
56
- /// the generated rules will be wrapped in a predefined selector in the format
57
- /// `$class-$width` (e.g. `govuk-grid-column-full`). This behaviour is
58
- /// deprecated and will be removed in v3.0
59
- ///
60
- /// Grid widths are defined in the `$govuk-grid-widths` map.
61
- ///
62
- /// By default the column width changes from 100% to specified width at the
63
- /// 'tablet' breakpoint, but other breakpoints can be specified using the `$at`
64
- /// parameter.
65
- ///
66
- /// @param {String} $width [full] name of a grid width from $govuk-grid-widths
67
- /// @param {String} $float [left] left | right
68
- /// @param {String} $at [tablet] - mobile | tablet | desktop | any custom breakpoint
69
- /// @param {String} $class [govuk-grid-column] CSS class name (deprecated)
70
- ///
71
- /// @example scss - Default
72
- /// .govuk-grid-column-two-thirds {
73
- /// @include govuk-grid-column(two-thirds, $class: false)
74
- /// }
75
- ///
76
- /// @example scss - Customising the breakpoint where width percentage is applied
77
- /// .govuk-grid-column-one-half-at-desktop {
78
- /// @include govuk-grid-column(one-half, $at: desktop);
79
- /// }
80
- ///
81
- /// @example scss - Customising the float direction
82
- /// .govuk-grid-column-one-half-right {
83
- /// @include govuk-grid-column(two-thirds, $float: right, $class: false);
84
- /// }
85
- ///
86
- /// @example scss - Customising the class name (deprecated)
87
- /// @include govuk-grid-column(one-half, $class: "test-column");
88
- ///
89
- /// @access public
90
-
91
- @mixin govuk-grid-column($width: full, $float: left, $at: tablet, $class: "govuk-grid-column") {
92
- @if ($class) {
93
- .#{$class}-#{$width} {
94
- @include govuk-grid-column($width, $float, $at, $class: false);
95
- }
96
- } @else {
97
- box-sizing: border-box;
98
- @if $at != desktop {
99
- width: 100%;
100
- }
101
- padding: 0 $govuk-gutter-half;
102
- @include govuk-media-query($from: $at) {
103
- width: govuk-grid-width($width);
104
- float: $float;
105
- }
106
- }
107
- }
@@ -1,37 +0,0 @@
1
- ////
2
- /// @group settings/colours
3
- ////
4
-
5
- /// Colour palette
6
- ///
7
- /// @type Map
8
- ///
9
- /// @prop $colour - Representation for the given $colour, where $colour is the
10
- /// friendly name for the colour (e.g. "red": #ff0000);
11
- ///
12
- /// @access public
13
-
14
- $govuk-colours: (
15
- "purple": #2e358b,
16
- "light-purple": #6f72af,
17
- "bright-purple": #912b88,
18
- "pink": #d53880,
19
- "light-pink": #f499be,
20
- "red": #b10e1e,
21
- "bright-red": #df3034,
22
- "orange": #f47738,
23
- "brown": #b58840,
24
- "yellow": #ffbf47,
25
- "light-green": #85994b,
26
- "green": #006435,
27
- "turquoise": #28a197,
28
- "light-blue": #2b8cc4,
29
- "blue": #005ea5,
30
-
31
- "black": #0b0c0c,
32
- "grey-1": #6f777b,
33
- "grey-2": #bfc1c3,
34
- "grey-3": #dee0e2,
35
- "grey-4": #f8f8f8,
36
- "white": #ffffff
37
- ) !default;
@@ -1,51 +0,0 @@
1
- ////
2
- /// Compatibility with legacy repos (govuk_elements, govuk_frontend_tookkit and
3
- /// govuk_template) settings
4
- ///
5
- /// We default these settings to `true` so that if they are missed we opt for a
6
- /// mild performance hit over a potential broken experience for the end-user.
7
- ///
8
- /// @group settings/compatibility
9
- ////
10
-
11
-
12
- /// Compatibility Mode: alphagov/govuk_frontend_toolkit
13
- ///
14
- /// True if used in a project that also includes alphagov/govuk_frontend_toolkit.
15
- ///
16
- /// @type Boolean
17
- /// @access public
18
-
19
- $govuk-compatibility-govukfrontendtoolkit: false !default;
20
-
21
- /// Compatibility Mode: alphagov/govuk_template
22
- ///
23
- /// True if used in a project that also includes alphagov/govuk_template.
24
- ///
25
- /// @type Boolean
26
- /// @access public
27
-
28
- $govuk-compatibility-govuktemplate: false !default;
29
-
30
- /// Compatibility Mode: alphagov/govuk_elements
31
- ///
32
- /// True if used in a project that also includes alphagov/govuk_elements.
33
- ///
34
- /// @type Boolean
35
- /// @access public
36
-
37
- $govuk-compatibility-govukelements: false !default;
38
-
39
- /// Compatibility Product Map
40
- ///
41
- /// Maps product names to their settings that we can use to lookup states from
42
- /// within the `@govuk-compatibility` mixin.
43
- ///
44
- /// @type Map
45
- /// @access private
46
-
47
- $_govuk-compatibility: (
48
- govuk_frontend_toolkit: $govuk-compatibility-govukfrontendtoolkit,
49
- govuk_template: $govuk-compatibility-govuktemplate,
50
- govuk_elements: $govuk-compatibility-govukelements,
51
- );
@@ -1,21 +0,0 @@
1
- The MIT License (MIT)
2
-
3
- Copyright (c) 2015-present Jason Miller
4
-
5
- Permission is hereby granted, free of charge, to any person obtaining a copy
6
- of this software and associated documentation files (the "Software"), to deal
7
- in the Software without restriction, including without limitation the rights
8
- to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
- copies of the Software, and to permit persons to whom the Software is
10
- furnished to do so, subject to the following conditions:
11
-
12
- The above copyright notice and this permission notice shall be included in all
13
- copies or substantial portions of the Software.
14
-
15
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
- IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
- FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
- AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
- LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
- OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
- SOFTWARE.
@@ -1,592 +0,0 @@
1
- <p align="center">
2
- <a href="https://preactjs.com" target="_blank">
3
-
4
- ![Preact](https://raw.githubusercontent.com/developit/preact/8b0bcc927995c188eca83cba30fbc83491cc0b2f/logo.svg?sanitize=true "Preact")
5
-
6
- </a>
7
- </p>
8
- <p align="center">Fast <b>3kB</b> alternative to React with the same modern API.</p>
9
-
10
- **All the power of Virtual DOM components, without the overhead:**
11
-
12
- - Familiar React API & patterns: [ES6 Class] and [Functional Components]
13
- - Extensive React compatibility via a simple [preact-compat] alias
14
- - Everything you need: JSX, <abbr title="Virtual DOM">VDOM</abbr>, React DevTools, <abbr title="Hot Module Replacement">HMR</abbr>, <abbr title="Server-Side Rendering">SSR</abbr>..
15
- - A highly optimized diff algorithm and seamless Server Side Rendering
16
- - Transparent asynchronous rendering with a pluggable scheduler
17
- - 🆕💥 **Instant no-config app bundling with [Preact CLI](https://github.com/developit/preact-cli)**
18
-
19
- ### 💁 More information at the [Preact Website ➞](https://preactjs.com)
20
-
21
-
22
- ---
23
-
24
- <!-- TOC depthFrom:2 depthTo:6 withLinks:1 updateOnSave:1 orderedList:0 -->
25
-
26
- - [Demos](#demos)
27
- - [Libraries & Add-ons](#libraries--add-ons)
28
- - [Getting Started](#getting-started)
29
- - [Import what you need](#import-what-you-need)
30
- - [Rendering JSX](#rendering-jsx)
31
- - [Components](#components)
32
- - [Props & State](#props--state)
33
- - [Linked State](#linked-state)
34
- - [Examples](#examples)
35
- - [Extensions](#extensions)
36
- - [Debug Mode](#debug-mode)
37
- - [Backers](#backers)
38
- - [Sponsors](#sponsors)
39
- - [License](#license)
40
-
41
- <!-- /TOC -->
42
-
43
-
44
- # Preact
45
-
46
- [![npm](https://img.shields.io/npm/v/preact.svg)](http://npm.im/preact)
47
- [![CDNJS](https://img.shields.io/cdnjs/v/preact.svg)](https://cdnjs.com/libraries/preact)
48
- [![Preact Slack Community](https://preact-slack.now.sh/badge.svg)](https://preact-slack.now.sh)
49
- [![OpenCollective Backers](https://opencollective.com/preact/backers/badge.svg)](#backers)
50
- [![OpenCollective Sponsors](https://opencollective.com/preact/sponsors/badge.svg)](#sponsors)
51
- [![travis](https://travis-ci.org/developit/preact.svg?branch=master)](https://travis-ci.org/developit/preact)
52
- [![coveralls](https://img.shields.io/coveralls/developit/preact/master.svg)](https://coveralls.io/github/developit/preact)
53
- [![gzip size](http://img.badgesize.io/https://unpkg.com/preact/dist/preact.min.js?compression=gzip)](https://unpkg.com/preact/dist/preact.min.js)
54
- [![install size](https://packagephobia.now.sh/badge?p=preact)](https://packagephobia.now.sh/result?p=preact)
55
-
56
- Preact supports modern browsers and IE9+:
57
-
58
- [![Browsers](https://saucelabs.com/browser-matrix/preact.svg)](https://saucelabs.com/u/preact)
59
-
60
-
61
- ---
62
-
63
-
64
- ## Demos
65
-
66
- #### Real-World Apps
67
-
68
- - [**Preact Hacker News**](https://hn.kristoferbaxter.com) _([GitHub Project](https://github.com/kristoferbaxter/preact-hn))_
69
- - [**Play.cash**](https://play.cash) :notes: _([GitHub Project](https://github.com/feross/play.cash))_
70
- - [**BitMidi**](https://bitmidi.com/) 🎹 Wayback machine for free MIDI files _([GitHub Project](https://github.com/feross/bitmidi.com))_
71
- - [**Ultimate Guitar**](https://www.ultimate-guitar.com) 🎸speed boosted by Preact.
72
- - [**ESBench**](http://esbench.com) is built using Preact.
73
- - [**BigWebQuiz**](https://bigwebquiz.com) _([GitHub Project](https://github.com/jakearchibald/big-web-quiz))_
74
- - [**Nectarine.rocks**](http://nectarine.rocks) _([GitHub Project](https://github.com/developit/nectarine))_ :peach:
75
- - [**TodoMVC**](https://preact-todomvc.surge.sh) _([GitHub Project](https://github.com/developit/preact-todomvc))_
76
- - [**OSS.Ninja**](https://oss.ninja) _([GitHub Project](https://github.com/developit/oss.ninja))_
77
- - [**GuriVR**](https://gurivr.com) _([GitHub Project](https://github.com/opennewslabs/guri-vr))_
78
- - [**Color Picker**](https://colors.now.sh) _([GitHub Project](https://github.com/lukeed/colors-app))_ :art:
79
- - [**Offline Gallery**](https://use-the-platform.com/offline-gallery/) _([GitHub Project](https://github.com/vaneenige/offline-gallery/))_ :balloon:
80
- - [**Periodic Weather**](https://use-the-platform.com/periodic-weather/) _([GitHub Project](https://github.com/vaneenige/periodic-weather/))_ :sunny:
81
- - [**Rugby News Board**](http://nbrugby.com) _[(GitHub Project)](https://github.com/rugby-board/rugby-board-node)_
82
- - [**Preact Gallery**](https://preact.gallery/) an 8KB photo gallery PWA built using Preact.
83
- - [**Rainbow Explorer**](https://use-the-platform.com/rainbow-explorer/) Preact app to translate real life color to digital color _([Github project](https://github.com/vaneenige/rainbow-explorer))_.
84
- - [**YASCC**](https://carlosqsilva.github.io/YASCC/#/) Yet Another SoundCloud Client _([Github project](https://github.com/carlosqsilva/YASCC))_.
85
- - [**Journalize**](https://preact-journal.herokuapp.com/) 14k offline-capable journaling PWA using preact. _([Github project](https://github.com/jpodwys/preact-journal))_.
86
-
87
-
88
- #### Runnable Examples
89
-
90
- - [**Flickr Browser**](http://codepen.io/developit/full/VvMZwK/) (@ CodePen)
91
- - [**Animating Text**](http://codepen.io/developit/full/LpNOdm/) (@ CodePen)
92
- - [**60FPS Rainbow Spiral**](http://codepen.io/developit/full/xGoagz/) (@ CodePen)
93
- - [**Simple Clock**](http://jsfiddle.net/developit/u9m5x0L7/embedded/result,js/) (@ JSFiddle)
94
- - [**3D + ThreeJS**](http://codepen.io/developit/pen/PPMNjd?editors=0010) (@ CodePen)
95
- - [**Stock Ticker**](http://codepen.io/developit/pen/wMYoBb?editors=0010) (@ CodePen)
96
- - [*Create your Own!*](https://jsfiddle.net/developit/rs6zrh5f/embedded/result/) (@ JSFiddle)
97
-
98
- ### Starter Projects
99
-
100
- - [**Preact Boilerplate**](https://preact-boilerplate.surge.sh) _([GitHub Project](https://github.com/developit/preact-boilerplate))_ :zap:
101
- - [**Preact Offline Starter**](https://preact-starter.now.sh) _([GitHub Project](https://github.com/lukeed/preact-starter))_ :100:
102
- - [**Preact PWA**](https://preact-pwa-yfxiijbzit.now.sh/) _([GitHub Project](https://github.com/ezekielchentnik/preact-pwa))_ :hamburger:
103
- - [**Parcel + Preact + Unistore Starter**](https://github.com/hwclass/parcel-preact-unistore-starter)
104
- - [**Preact Mobx Starter**](https://awaw00.github.io/preact-mobx-starter/) _([GitHub Project](https://github.com/awaw00/preact-mobx-starter))_ :sunny:
105
- - [**Preact Redux Example**](https://github.com/developit/preact-redux-example) :star:
106
- - [**Preact Redux/RxJS/Reselect Example**](https://github.com/continuata/preact-seed)
107
- - [**V2EX Preact**](https://github.com/yanni4night/v2ex-preact)
108
- - [**Preact Coffeescript**](https://github.com/crisward/preact-coffee)
109
- - [**Preact + TypeScript + Webpack**](https://github.com/k1r0s/bleeding-preact-starter)
110
- - [**0 config => Preact + Poi**](https://github.com/k1r0s/preact-poi-starter)
111
- - [**Zero configuration => Preact + Typescript + Parcel**](https://github.com/aalises/preact-typescript-parcel-starter)
112
-
113
- ---
114
-
115
- ## Libraries & Add-ons
116
-
117
- - :raised_hands: [**preact-compat**](https://git.io/preact-compat): use any React library with Preact *([full example](http://git.io/preact-compat-example))*
118
- - :twisted_rightwards_arrows: [**preact-context**](https://github.com/valotas/preact-context): React's `createContext` api for Preact
119
- - :page_facing_up: [**preact-render-to-string**](https://git.io/preact-render-to-string): Universal rendering.
120
- - :eyes: [**preact-render-spy**](https://github.com/mzgoddard/preact-render-spy): Enzyme-lite: Renderer with access to the produced virtual dom for testing.
121
- - :loop: [**preact-render-to-json**](https://git.io/preact-render-to-json): Render for Jest Snapshot testing.
122
- - :earth_americas: [**preact-router**](https://git.io/preact-router): URL routing for your components
123
- - :bookmark_tabs: [**preact-markup**](https://git.io/preact-markup): Render HTML & Custom Elements as JSX & Components
124
- - :satellite: [**preact-portal**](https://git.io/preact-portal): Render Preact components into (a) SPACE :milky_way:
125
- - :pencil: [**preact-richtextarea**](https://git.io/preact-richtextarea): Simple HTML editor component
126
- - :bookmark: [**preact-token-input**](https://github.com/developit/preact-token-input): Text field that tokenizes input, for things like tags
127
- - :card_index: [**preact-virtual-list**](https://github.com/developit/preact-virtual-list): Easily render lists with millions of rows ([demo](https://jsfiddle.net/developit/qqan9pdo/))
128
- - :repeat: [**preact-cycle**](https://git.io/preact-cycle): Functional-reactive paradigm for Preact
129
- - :triangular_ruler: [**preact-layout**](https://download.github.io/preact-layout/): Small and simple layout library
130
- - :thought_balloon: [**preact-socrates**](https://github.com/matthewmueller/preact-socrates): Preact plugin for [Socrates](http://github.com/matthewmueller/socrates)
131
- - :rowboat: [**preact-flyd**](https://github.com/xialvjun/preact-flyd): Use [flyd](https://github.com/paldepind/flyd) FRP streams in Preact + JSX
132
- - :speech_balloon: [**preact-i18nline**](https://github.com/download/preact-i18nline): Integrates the ecosystem around [i18n-js](https://github.com/everydayhero/i18n-js) with Preact via [i18nline](https://github.com/download/i18nline).
133
- - :microscope: [**preact-jsx-chai**](https://git.io/preact-jsx-chai): JSX assertion testing _(no DOM, right in Node)_
134
- - :tophat: [**preact-classless-component**](https://github.com/ld0rman/preact-classless-component): create preact components without the class keyword
135
- - :hammer: [**preact-hyperscript**](https://github.com/queckezz/preact-hyperscript): Hyperscript-like syntax for creating elements
136
- - :white_check_mark: [**shallow-compare**](https://github.com/tkh44/shallow-compare): simplified `shouldComponentUpdate` helper.
137
- - :shaved_ice: [**preact-codemod**](https://github.com/vutran/preact-codemod): Transform your React code to Preact.
138
- - :construction_worker: [**preact-helmet**](https://github.com/download/preact-helmet): A document head manager for Preact
139
- - :necktie: [**preact-delegate**](https://github.com/NekR/preact-delegate): Delegate DOM events
140
- - :art: [**preact-stylesheet-decorator**](https://github.com/k1r0s/preact-stylesheet-decorator): Add Scoped Stylesheets to your Preact Components
141
- - :electric_plug: [**preact-routlet**](https://github.com/k1r0s/preact-routlet): Simple `Component Driven` Routing for Preact using ES7 Decorators
142
- - :fax: [**preact-bind-group**](https://github.com/k1r0s/preact-bind-group): Preact Forms made easy, Group Events into a Single Callback
143
- - :hatching_chick: [**preact-habitat**](https://github.com/zouhir/preact-habitat): Declarative Preact widgets renderer in any CMS or DOM host ([demo](https://codepen.io/zouhir/pen/brrOPB)).
144
- - :tada: [**proppy-preact**](https://github.com/fahad19/proppy): Functional props composition for Preact components
145
-
146
- #### UI Component Libraries
147
-
148
- > Want to prototype something or speed up your development? Try one of these toolkits:
149
-
150
- - [**preact-material-components**](https://github.com/prateekbh/preact-material-components): Material Design Components for Preact ([website](https://material.preactjs.com/))
151
- - [**preact-mdc**](https://github.com/BerndWessels/preact-mdc): Material Design Components for Preact ([demo](https://github.com/BerndWessels/preact-mdc-demo))
152
- - [**preact-mui**](https://git.io/v1aVO): The MUI CSS Preact library.
153
- - [**preact-photon**](https://git.io/preact-photon): build beautiful desktop UI with [photon](http://photonkit.com)
154
- - [**preact-mdl**](https://git.io/preact-mdl): [Material Design Lite](https://getmdl.io) for Preact
155
- - [**preact-weui**](https://github.com/afeiship/preact-weui): [Weui](https://github.com/afeiship/preact-weui) for Preact
156
-
157
-
158
- ---
159
-
160
- ## Getting Started
161
-
162
- > 💁 _**Note:** You [don't need ES2015 to use Preact](https://github.com/developit/preact-in-es3)... but give it a try!_
163
-
164
- The easiest way to get started with Preact is to install [Preact CLI](https://github.com/developit/preact-cli). This simple command-line tool wraps up the best possible Webpack and Babel setup for you, and even keeps you up-to-date as the underlying tools change. Best of all, it's easy to understand! It builds your app in a single command (`preact build`), doesn't need any configuration, and bakes in best-practises 🙌.
165
-
166
- The following guide assumes you have some sort of ES2015 build set up using babel and/or webpack/browserify/gulp/grunt/etc.
167
-
168
- You can also start with [preact-boilerplate] or a [CodePen Template](http://codepen.io/developit/pen/pgaROe?editors=0010).
169
-
170
-
171
- ### Import what you need
172
-
173
- The `preact` module provides both named and default exports, so you can either import everything under a namespace of your choosing, or just what you need as locals:
174
-
175
- ##### Named:
176
-
177
- ```js
178
- import { h, render, Component } from 'preact';
179
-
180
- // Tell Babel to transform JSX into h() calls:
181
- /** @jsx h */
182
- ```
183
-
184
- ##### Default:
185
-
186
- ```js
187
- import preact from 'preact';
188
-
189
- // Tell Babel to transform JSX into preact.h() calls:
190
- /** @jsx preact.h */
191
- ```
192
-
193
- > Named imports work well for highly structured applications, whereas the default import is quick and never needs to be updated when using different parts of the library.
194
- >
195
- > Instead of declaring the `@jsx` pragma in your code, it's best to configure it globally in a `.babelrc`:
196
- >
197
- > **For Babel 5 and prior:**
198
- >
199
- > ```json
200
- > { "jsxPragma": "h" }
201
- > ```
202
- >
203
- > **For Babel 6:**
204
- >
205
- > ```json
206
- > {
207
- > "plugins": [
208
- > ["transform-react-jsx", { "pragma":"h" }]
209
- > ]
210
- > }
211
- > ```
212
- >
213
- > **For Babel 7:**
214
- >
215
- > ```json
216
- > {
217
- > "plugins": [
218
- > ["@babel/plugin-transform-react-jsx", { "pragma":"h" }]
219
- > ]
220
- > }
221
- > ```
222
- > **For using Preact along with TypeScript add to `tsconfig.json`:**
223
- >
224
- > ```json
225
- > {
226
- > "jsx": "react",
227
- > "jsxFactory": "h",
228
- > }
229
- > ```
230
-
231
-
232
- ### Rendering JSX
233
-
234
- Out of the box, Preact provides an `h()` function that turns your JSX into Virtual DOM elements _([here's how](http://jasonformat.com/wtf-is-jsx))_. It also provides a `render()` function that creates a DOM tree from that Virtual DOM.
235
-
236
- To render some JSX, just import those two functions and use them like so:
237
-
238
- ```js
239
- import { h, render } from 'preact';
240
-
241
- render((
242
- <div id="foo">
243
- <span>Hello, world!</span>
244
- <button onClick={ e => alert("hi!") }>Click Me</button>
245
- </div>
246
- ), document.body);
247
- ```
248
-
249
- This should seem pretty straightforward if you've used hyperscript or one of its many friends. If you're not, the short of it is that the `h()` function import gets used in the final, transpiled code as a drop in replacement for `React.createElement()`, and so needs to be imported even if you don't explicitly use it in the code you write. Also note that if you're the kind of person who likes writing your React code in "pure JavaScript" (you know who you are) you will need to use `h()` wherever you would otherwise use `React.createElement()`.
250
-
251
- Rendering hyperscript with a virtual DOM is pointless, though. We want to render components and have them updated when data changes - that's where the power of virtual DOM diffing shines. :star2:
252
-
253
-
254
- ### Components
255
-
256
- Preact exports a generic `Component` class, which can be extended to build encapsulated, self-updating pieces of a User Interface. Components support all of the standard React [lifecycle methods], like `shouldComponentUpdate()` and `componentWillReceiveProps()`. Providing specific implementations of these methods is the preferred mechanism for controlling _when_ and _how_ components update.
257
-
258
- Components also have a `render()` method, but unlike React this method is passed `(props, state)` as arguments. This provides an ergonomic means to destructure `props` and `state` into local variables to be referenced from JSX.
259
-
260
- Let's take a look at a very simple `Clock` component, which shows the current time.
261
-
262
- ```js
263
- import { h, render, Component } from 'preact';
264
-
265
- class Clock extends Component {
266
- render() {
267
- let time = new Date();
268
- return <time datetime={time.toISOString()}>{ time.toLocaleTimeString() }</time>;
269
- }
270
- }
271
-
272
- // render an instance of Clock into <body>:
273
- render(<Clock />, document.body);
274
- ```
275
-
276
-
277
- That's great. Running this produces the following HTML DOM structure:
278
-
279
- ```html
280
- <span>10:28:57 PM</span>
281
- ```
282
-
283
- In order to have the clock's time update every second, we need to know when `<Clock>` gets mounted to the DOM. _If you've used HTML5 Custom Elements, this is similar to the `attachedCallback` and `detachedCallback` lifecycle methods._ Preact invokes the following lifecycle methods if they are defined for a Component:
284
-
285
- | Lifecycle method | When it gets called |
286
- |-----------------------------|--------------------------------------------------|
287
- | `componentWillMount` | before the component gets mounted to the DOM |
288
- | `componentDidMount` | after the component gets mounted to the DOM |
289
- | `componentWillUnmount` | prior to removal from the DOM |
290
- | `componentWillReceiveProps` | before new props get accepted |
291
- | `shouldComponentUpdate` | before `render()`. Return `false` to skip render |
292
- | `componentWillUpdate` | before `render()` |
293
- | `componentDidUpdate` | after `render()` |
294
-
295
-
296
-
297
- So, we want to have a 1-second timer start once the Component gets added to the DOM, and stop if it is removed. We'll create the timer and store a reference to it in `componentDidMount()`, and stop the timer in `componentWillUnmount()`. On each timer tick, we'll update the component's `state` object with a new time value. Doing this will automatically re-render the component.
298
-
299
- ```js
300
- import { h, render, Component } from 'preact';
301
-
302
- class Clock extends Component {
303
- constructor() {
304
- super();
305
- // set initial time:
306
- this.state = {
307
- time: Date.now()
308
- };
309
- }
310
-
311
- componentDidMount() {
312
- // update time every second
313
- this.timer = setInterval(() => {
314
- this.setState({ time: Date.now() });
315
- }, 1000);
316
- }
317
-
318
- componentWillUnmount() {
319
- // stop when not renderable
320
- clearInterval(this.timer);
321
- }
322
-
323
- render(props, state) {
324
- let time = new Date(state.time).toLocaleTimeString();
325
- return <span>{ time }</span>;
326
- }
327
- }
328
-
329
- // render an instance of Clock into <body>:
330
- render(<Clock />, document.body);
331
- ```
332
-
333
- Now we have [a ticking clock](http://jsfiddle.net/developit/u9m5x0L7/embedded/result,js/)!
334
-
335
-
336
- ### Props & State
337
-
338
- The concept (and nomenclature) for `props` and `state` is the same as in React. `props` are passed to a component by defining attributes in JSX, `state` is internal state. Changing either triggers a re-render, though by default Preact re-renders Components asynchronously for `state` changes and synchronously for `props` changes. You can tell Preact to render `prop` changes asynchronously by setting `options.syncComponentUpdates` to `false`.
339
-
340
-
341
- ---
342
-
343
-
344
- ## Linked State
345
-
346
- One area Preact takes a little further than React is in optimizing state changes. A common pattern in ES2015 React code is to use Arrow functions within a `render()` method in order to update state in response to events. Creating functions enclosed in a scope on every render is inefficient and forces the garbage collector to do more work than is necessary.
347
-
348
- One solution to this is to bind component methods declaratively.
349
- Here is an example using [decko](http://git.io/decko):
350
-
351
- ```js
352
- class Foo extends Component {
353
- @bind
354
- updateText(e) {
355
- this.setState({ text: e.target.value });
356
- }
357
- render({ }, { text }) {
358
- return <input value={text} onInput={this.updateText} />;
359
- }
360
- }
361
- ```
362
-
363
- While this achieves much better runtime performance, it's still a lot of unnecessary code to wire up state to UI.
364
-
365
- Fortunately there is a solution, in the form of a module called [linkstate](https://github.com/developit/linkstate). Calling `linkState(component, 'text')` returns a function that accepts an Event and uses its associated value to update the given property in your component's state. Calls to `linkState()` with the same arguments are cached, so there is no performance penalty. Here is the previous example rewritten using _Linked State_:
366
-
367
- ```js
368
- import linkState from 'linkstate';
369
-
370
- class Foo extends Component {
371
- render({ }, { text }) {
372
- return <input value={text} onInput={linkState(this, 'text')} />;
373
- }
374
- }
375
- ```
376
-
377
- Simple and effective. It handles linking state from any input type, or an optional second parameter can be used to explicitly provide a keypath to the new state value.
378
-
379
- > **Note:** In Preact 7 and prior, `linkState()` was built right into Component. In 8.0, it was moved to a separate module. You can restore the 7.x behavior by using linkstate as a polyfill - see [the linkstate docs](https://github.com/developit/linkstate#usage).
380
-
381
-
382
-
383
- ## Examples
384
-
385
- Here is a somewhat verbose Preact `<Link>` component:
386
-
387
- ```js
388
- class Link extends Component {
389
- render(props, state) {
390
- return <a href={props.href}>{props.children}</a>;
391
- }
392
- }
393
- ```
394
-
395
- Since this is ES6/ES2015, we can further simplify:
396
-
397
- ```js
398
- class Link extends Component {
399
- render({ href, children }) {
400
- return <a {...{ href, children }} />;
401
- }
402
- }
403
-
404
- // or, for wide-open props support:
405
- class Link extends Component {
406
- render(props) {
407
- return <a {...props} />;
408
- }
409
- }
410
-
411
- // or, as a stateless functional component:
412
- const Link = ({ children, ...props }) => (
413
- <a {...props}>{ children }</a>
414
- );
415
- ```
416
-
417
-
418
- ## Extensions
419
-
420
- It is likely that some projects based on Preact would wish to extend Component with great new functionality.
421
-
422
- Perhaps automatic connection to stores for a Flux-like architecture, or mixed-in context bindings to make it feel more like `React.createClass()`. Just use ES2015 inheritance:
423
-
424
- ```js
425
- class BoundComponent extends Component {
426
- constructor(props) {
427
- super(props);
428
- this.bind();
429
- }
430
- bind() {
431
- this.binds = {};
432
- for (let i in this) {
433
- this.binds[i] = this[i].bind(this);
434
- }
435
- }
436
- }
437
-
438
- // example usage
439
- class Link extends BoundComponent {
440
- click() {
441
- open(this.href);
442
- }
443
- render() {
444
- let { click } = this.binds;
445
- return <span onclick={ click }>{ children }</span>;
446
- }
447
- }
448
- ```
449
-
450
-
451
- The possibilities are pretty endless here. You could even add support for rudimentary mixins:
452
-
453
- ```js
454
- class MixedComponent extends Component {
455
- constructor() {
456
- super();
457
- (this.mixins || []).forEach( m => Object.assign(this, m) );
458
- }
459
- }
460
- ```
461
-
462
- ## Debug Mode
463
-
464
- You can inspect and modify the state of your Preact UI components at runtime using the
465
- [React Developer Tools](https://github.com/facebook/react-devtools) browser extension.
466
-
467
- 1. Install the [React Developer Tools](https://github.com/facebook/react-devtools) extension
468
- 2. Import the "preact/debug" module in your app
469
- 3. Set `process.env.NODE_ENV` to 'development'
470
- 4. Reload and go to the 'React' tab in the browser's development tools
471
-
472
-
473
- ```js
474
- import { h, Component, render } from 'preact';
475
-
476
- // Enable debug mode. You can reduce the size of your app by only including this
477
- // module in development builds. eg. In Webpack, wrap this with an `if (module.hot) {...}`
478
- // check.
479
- require('preact/debug');
480
- ```
481
-
482
- ### Runtime Error Checking
483
-
484
- To enable debug mode, you need to set `process.env.NODE_ENV=development`. You can do this
485
- with webpack via a builtin plugin.
486
-
487
- ```js
488
- // webpack.config.js
489
-
490
- // Set NODE_ENV=development to enable error checking
491
- new webpack.DefinePlugin({
492
- 'process.env': {
493
- 'NODE_ENV': JSON.stringify('development')
494
- }
495
- });
496
- ```
497
-
498
- When enabled, warnings are logged to the console when undefined components or string refs
499
- are detected.
500
-
501
- ### Developer Tools
502
-
503
- If you only want to include devtool integration, without runtime error checking, you can
504
- replace `preact/debug` in the above example with `preact/devtools`. This option doesn't
505
- require setting `NODE_ENV=development`.
506
-
507
-
508
-
509
- ## Backers
510
- Support us with a monthly donation and help us continue our activities. [[Become a backer](https://opencollective.com/preact#backer)]
511
-
512
- <a href="https://opencollective.com/preact/backer/0/website" target="_blank"><img src="https://opencollective.com/preact/backer/0/avatar.svg"></a>
513
- <a href="https://opencollective.com/preact/backer/1/website" target="_blank"><img src="https://opencollective.com/preact/backer/1/avatar.svg"></a>
514
- <a href="https://opencollective.com/preact/backer/2/website" target="_blank"><img src="https://opencollective.com/preact/backer/2/avatar.svg"></a>
515
- <a href="https://opencollective.com/preact/backer/3/website" target="_blank"><img src="https://opencollective.com/preact/backer/3/avatar.svg"></a>
516
- <a href="https://opencollective.com/preact/backer/4/website" target="_blank"><img src="https://opencollective.com/preact/backer/4/avatar.svg"></a>
517
- <a href="https://opencollective.com/preact/backer/5/website" target="_blank"><img src="https://opencollective.com/preact/backer/5/avatar.svg"></a>
518
- <a href="https://opencollective.com/preact/backer/6/website" target="_blank"><img src="https://opencollective.com/preact/backer/6/avatar.svg"></a>
519
- <a href="https://opencollective.com/preact/backer/7/website" target="_blank"><img src="https://opencollective.com/preact/backer/7/avatar.svg"></a>
520
- <a href="https://opencollective.com/preact/backer/8/website" target="_blank"><img src="https://opencollective.com/preact/backer/8/avatar.svg"></a>
521
- <a href="https://opencollective.com/preact/backer/9/website" target="_blank"><img src="https://opencollective.com/preact/backer/9/avatar.svg"></a>
522
- <a href="https://opencollective.com/preact/backer/10/website" target="_blank"><img src="https://opencollective.com/preact/backer/10/avatar.svg"></a>
523
- <a href="https://opencollective.com/preact/backer/11/website" target="_blank"><img src="https://opencollective.com/preact/backer/11/avatar.svg"></a>
524
- <a href="https://opencollective.com/preact/backer/12/website" target="_blank"><img src="https://opencollective.com/preact/backer/12/avatar.svg"></a>
525
- <a href="https://opencollective.com/preact/backer/13/website" target="_blank"><img src="https://opencollective.com/preact/backer/13/avatar.svg"></a>
526
- <a href="https://opencollective.com/preact/backer/14/website" target="_blank"><img src="https://opencollective.com/preact/backer/14/avatar.svg"></a>
527
- <a href="https://opencollective.com/preact/backer/15/website" target="_blank"><img src="https://opencollective.com/preact/backer/15/avatar.svg"></a>
528
- <a href="https://opencollective.com/preact/backer/16/website" target="_blank"><img src="https://opencollective.com/preact/backer/16/avatar.svg"></a>
529
- <a href="https://opencollective.com/preact/backer/17/website" target="_blank"><img src="https://opencollective.com/preact/backer/17/avatar.svg"></a>
530
- <a href="https://opencollective.com/preact/backer/18/website" target="_blank"><img src="https://opencollective.com/preact/backer/18/avatar.svg"></a>
531
- <a href="https://opencollective.com/preact/backer/19/website" target="_blank"><img src="https://opencollective.com/preact/backer/19/avatar.svg"></a>
532
- <a href="https://opencollective.com/preact/backer/20/website" target="_blank"><img src="https://opencollective.com/preact/backer/20/avatar.svg"></a>
533
- <a href="https://opencollective.com/preact/backer/21/website" target="_blank"><img src="https://opencollective.com/preact/backer/21/avatar.svg"></a>
534
- <a href="https://opencollective.com/preact/backer/22/website" target="_blank"><img src="https://opencollective.com/preact/backer/22/avatar.svg"></a>
535
- <a href="https://opencollective.com/preact/backer/23/website" target="_blank"><img src="https://opencollective.com/preact/backer/23/avatar.svg"></a>
536
- <a href="https://opencollective.com/preact/backer/24/website" target="_blank"><img src="https://opencollective.com/preact/backer/24/avatar.svg"></a>
537
- <a href="https://opencollective.com/preact/backer/25/website" target="_blank"><img src="https://opencollective.com/preact/backer/25/avatar.svg"></a>
538
- <a href="https://opencollective.com/preact/backer/26/website" target="_blank"><img src="https://opencollective.com/preact/backer/26/avatar.svg"></a>
539
- <a href="https://opencollective.com/preact/backer/27/website" target="_blank"><img src="https://opencollective.com/preact/backer/27/avatar.svg"></a>
540
- <a href="https://opencollective.com/preact/backer/28/website" target="_blank"><img src="https://opencollective.com/preact/backer/28/avatar.svg"></a>
541
- <a href="https://opencollective.com/preact/backer/29/website" target="_blank"><img src="https://opencollective.com/preact/backer/29/avatar.svg"></a>
542
-
543
-
544
- ## Sponsors
545
- Become a sponsor and get your logo on our README on GitHub with a link to your site. [[Become a sponsor](https://opencollective.com/preact#sponsor)]
546
-
547
- <a href="https://opencollective.com/preact/sponsor/0/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/0/avatar.svg"></a>
548
- <a href="https://opencollective.com/preact/sponsor/1/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/1/avatar.svg"></a>
549
- <a href="https://opencollective.com/preact/sponsor/2/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/2/avatar.svg"></a>
550
- <a href="https://opencollective.com/preact/sponsor/3/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/3/avatar.svg"></a>
551
- <a href="https://opencollective.com/preact/sponsor/4/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/4/avatar.svg"></a>
552
- <a href="https://opencollective.com/preact/sponsor/5/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/5/avatar.svg"></a>
553
- <a href="https://opencollective.com/preact/sponsor/6/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/6/avatar.svg"></a>
554
- <a href="https://opencollective.com/preact/sponsor/7/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/7/avatar.svg"></a>
555
- <a href="https://opencollective.com/preact/sponsor/8/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/8/avatar.svg"></a>
556
- <a href="https://opencollective.com/preact/sponsor/9/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/9/avatar.svg"></a>
557
- <a href="https://opencollective.com/preact/sponsor/10/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/10/avatar.svg"></a>
558
- <a href="https://opencollective.com/preact/sponsor/11/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/11/avatar.svg"></a>
559
- <a href="https://opencollective.com/preact/sponsor/12/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/12/avatar.svg"></a>
560
- <a href="https://opencollective.com/preact/sponsor/13/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/13/avatar.svg"></a>
561
- <a href="https://opencollective.com/preact/sponsor/14/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/14/avatar.svg"></a>
562
- <a href="https://opencollective.com/preact/sponsor/15/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/15/avatar.svg"></a>
563
- <a href="https://opencollective.com/preact/sponsor/16/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/16/avatar.svg"></a>
564
- <a href="https://opencollective.com/preact/sponsor/17/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/17/avatar.svg"></a>
565
- <a href="https://opencollective.com/preact/sponsor/18/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/18/avatar.svg"></a>
566
- <a href="https://opencollective.com/preact/sponsor/19/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/19/avatar.svg"></a>
567
- <a href="https://opencollective.com/preact/sponsor/20/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/20/avatar.svg"></a>
568
- <a href="https://opencollective.com/preact/sponsor/21/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/21/avatar.svg"></a>
569
- <a href="https://opencollective.com/preact/sponsor/22/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/22/avatar.svg"></a>
570
- <a href="https://opencollective.com/preact/sponsor/23/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/23/avatar.svg"></a>
571
- <a href="https://opencollective.com/preact/sponsor/24/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/24/avatar.svg"></a>
572
- <a href="https://opencollective.com/preact/sponsor/25/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/25/avatar.svg"></a>
573
- <a href="https://opencollective.com/preact/sponsor/26/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/26/avatar.svg"></a>
574
- <a href="https://opencollective.com/preact/sponsor/27/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/27/avatar.svg"></a>
575
- <a href="https://opencollective.com/preact/sponsor/28/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/28/avatar.svg"></a>
576
- <a href="https://opencollective.com/preact/sponsor/29/website" target="_blank"><img src="https://opencollective.com/preact/sponsor/29/avatar.svg"></a>
577
-
578
- ## License
579
-
580
- MIT
581
-
582
-
583
-
584
- [![Preact](http://i.imgur.com/YqCHvEW.gif)](https://preactjs.com)
585
-
586
-
587
- [preact-compat]: https://github.com/developit/preact-compat
588
- [ES6 Class]: https://facebook.github.io/react/docs/reusable-components.html#es6-classes
589
- [Functional Components]: https://facebook.github.io/react/blog/2015/10/07/react-v0.14.html#stateless-functional-components
590
- [hyperscript]: https://github.com/dominictarr/hyperscript
591
- [preact-boilerplate]: https://github.com/developit/preact-boilerplate
592
- [lifecycle methods]: https://facebook.github.io/react/docs/component-specs.html