Use config type definitions for initAll

alphagov · Nov 10, 2022 · cab5c36 · cab5c36
1 parent ddc6c1e
commit cab5c36
Show file tree

Hide file tree

Showing 4 changed files with 44 additions and 19 deletions.
diff --git a/src/govuk/all.mjs b/src/govuk/all.mjs
@@ -17,13 +17,7 @@ import Tabs from './components/tabs/tabs.mjs'
  * Use the `data-module` attributes to find, instantiate and init all of the
  * components provided as part of GOV.UK Frontend.
  *
- * @param {object} [config] - Config
- * @param {HTMLElement} [config.scope=document] - Scope to query for components
- * @param {object} [config.accordion] - Accordion config
- * @param {object} [config.button] - Button config
- * @param {object} [config.characterCount] - Character Count config
- * @param {object} [config.errorSummary] - Error Summary config
- * @param {object} [config.notificationBanner] - Notification Banner config
+ * @param {Config} [config] - Config for all components
  */
 function initAll (config) {
   config = typeof config !== 'undefined' ? config : {}
@@ -103,3 +97,15 @@ export {
   SkipLink,
   Tabs
 }
+
+/**
+ * Config for all components
+ *
+ * @typedef {object} Config
+ * @property {HTMLElement} [scope=document] - Scope to query for components
+ * @property {import('./components/accordion/accordion.mjs').AccordionConfig} [accordion] - Accordion config
+ * @property {import('./components/button/button.mjs').ButtonConfig} [button] - Button config
+ * @property {import('./components/character-count/character-count.mjs').CharacterCountConfig} [characterCount] - Character Count config
+ * @property {import('./components/error-summary/error-summary.mjs').ErrorSummaryConfig} [errorSummary] - Error Summary config
+ * @property {import('./components/notification-banner/notification-banner.mjs').NotificationBannerConfig} [notificationBanner] - Notification Banner config
+ */
diff --git a/src/govuk/components/button/button.mjs b/src/govuk/components/button/button.mjs
@@ -11,10 +11,7 @@ var DEBOUNCE_TIMEOUT_IN_SECONDS = 1
  *
  * @class
  * @param {HTMLElement} $module - The element this component controls
- * @param {object} config - Button config
- * @param {boolean} [config.preventDoubleClick=false] -
- *  Prevent accidental double clicks on submit buttons from submitting forms
- *  multiple times.
+ * @param {ButtonConfig} config - Button config
  */
 function Button ($module, config) {
   if (!$module) {
@@ -93,3 +90,12 @@ Button.prototype.debounce = function (event) {
 }
 
 export default Button
+
+/**
+ * Button config
+ *
+ * @typedef {object} ButtonConfig
+ * @property {boolean} [preventDoubleClick = false] -
+ *  Prevent accidental double clicks on submit buttons from submitting forms
+ *  multiple times.
+ */
diff --git a/src/govuk/components/error-summary/error-summary.mjs b/src/govuk/components/error-summary/error-summary.mjs
@@ -12,8 +12,7 @@ import { normaliseDataset } from '../../common/normalise-dataset.mjs'
  *
  * @class
  * @param {HTMLElement} $module - The element this component controls
- * @param {object} config - Error summary config
- * @param {boolean} [config.disableAutoFocus=false] - If set to `true` the error summary will not be focussed when the page loads.
+ * @param {ErrorSummaryConfig} config - Error summary config
  */
 function ErrorSummary ($module, config) {
   // Some consuming code may not be passing a module,
@@ -201,3 +200,11 @@ ErrorSummary.prototype.getAssociatedLegendOrLabel = function ($input) {
 }
 
 export default ErrorSummary
+
+/**
+ * Error summary config
+ *
+ * @typedef {object} ErrorSummaryConfig
+ * @property {boolean} [disableAutoFocus = false] -
+ *  If set to `true` the error summary will not be focussed when the page loads.
+ */
diff --git a/src/govuk/components/notification-banner/notification-banner.mjs b/src/govuk/components/notification-banner/notification-banner.mjs
@@ -8,12 +8,7 @@ import { normaliseDataset } from '../../common/normalise-dataset.mjs'
  *
  * @class
  * @param {HTMLElement} $module - HTML element to use for notification banner
- * @param {object} config - Error summary config
- * @param {boolean} [config.disableAutoFocus=false] -
- *   If set to `true` the notification banner will not be focussed when the page
- *   loads. This only applies if the component has a `role` of `alert` – in
- *   other cases the component will not be focused on page load, regardless of
- *   this option.
+ * @param {NotificationBannerConfig} config - Notification banner config
  */
 function NotificationBanner ($module, config) {
   this.$module = $module
@@ -77,3 +72,14 @@ NotificationBanner.prototype.setFocus = function () {
 }
 
 export default NotificationBanner
+
+/**
+ * Notification banner config
+ *
+ * @typedef {object} NotificationBannerConfig
+ * @property {boolean} [disableAutoFocus = false] -
+ *   If set to `true` the notification banner will not be focussed when the page
+ *   loads. This only applies if the component has a `role` of `alert` – in
+ *   other cases the component will not be focused on page load, regardless of
+ *   this option.
+ */