@ministryofjustice/frontend 5.2.1 → 6.0.0

package/moj/all.bundle.mjs

@@ -23,6 +23,9 @@ function isArray(option) {
 function isObject(option) {
   return !!option && typeof option === 'object' && !isArray(option);
 }
+function isScope($scope) {
+  return !!$scope && ($scope instanceof Element || $scope instanceof Document);
+}
 function formatErrorMessage(Component, message) {
   return `${Component.moduleName}: ${message}`;
 }
@@ -54,7 +57,7 @@ class ConfigError extends GOVUKFrontendError {
 class ElementError extends GOVUKFrontendError {
   constructor(messageOrOptions) {
     let message = typeof messageOrOptions === 'string' ? messageOrOptions : '';
-    if (typeof messageOrOptions === 'object') {
+    if (isObject(messageOrOptions)) {
       const {
         component,
         identifier,
@@ -63,7 +66,9 @@ class ElementError extends GOVUKFrontendError {
       } = messageOrOptions;
       message = identifier;
       message += element ? ` is not of type ${expectedType != null ? expectedType : 'HTMLElement'}` : ' not found';
-      message = formatErrorMessage(component, message);
+      if (component) {
+        message = formatErrorMessage(component, message);
+      }
     }
     super(message);
     this.name = 'ElementError';
@@ -200,6 +205,30 @@ function normaliseDataset(Component, dataset) {
   }
   return out;
 }
+function normaliseOptions(scopeOrOptions) {
+  let $scope = document;
+  let onError;
+  if (isObject(scopeOrOptions)) {
+    const options = scopeOrOptions;
+    if (isScope(options.scope) || options.scope === null) {
+      $scope = options.scope;
+    }
+    if (typeof options.onError === 'function') {
+      onError = options.onError;
+    }
+  }
+  if (isScope(scopeOrOptions)) {
+    $scope = scopeOrOptions;
+  } else if (scopeOrOptions === null) {
+    $scope = null;
+  } else if (typeof scopeOrOptions === 'function') {
+    onError = scopeOrOptions;
+  }
+  return {
+    scope: $scope,
+    onError
+  };
+}
 function mergeConfigs(...configObjects) {
   const formattedConfigObject = {};
   for (const configObject of configObjects) {
@@ -254,42 +283,42 @@ function extractConfigByNamespace(schema, dataset, namespace) {
  * @template {CompatibleClass} ComponentClass
  * @param {ComponentClass} Component - class of the component to create
  * @param {ComponentConfig<ComponentClass>} [config] - Config supplied to component
- * @param {OnErrorCallback<ComponentClass> | Element | Document | CreateAllOptions<ComponentClass> } [createAllOptions] - options for createAll including scope of the document to search within and callback function if error throw by component on init
+ * @param {OnErrorCallback<ComponentClass> | Element | Document | null | CreateAllOptions<ComponentClass>} [scopeOrOptions] - options for createAll including scope of the document to search within and callback function if error throw by component on init
  * @returns {Array<InstanceType<ComponentClass>>} - array of instantiated components
  */
-function createAll(Component, config, createAllOptions) {
-  let $scope = document;
-  let onError;
-  if (typeof createAllOptions === 'object') {
-    var _createAllOptions$sco;
-    createAllOptions = createAllOptions;
-    $scope = (_createAllOptions$sco = createAllOptions.scope) != null ? _createAllOptions$sco : $scope;
-    onError = createAllOptions.onError;
-  }
-  if (typeof createAllOptions === 'function') {
-    onError = createAllOptions;
-  }
-  if (createAllOptions instanceof HTMLElement) {
-    $scope = createAllOptions;
-  }
-  const $elements = $scope.querySelectorAll(`[data-module="${Component.moduleName}"]`);
-  if (!isSupported()) {
-    if (onError) {
-      onError(new SupportError(), {
+function createAll(Component, config, scopeOrOptions) {
+  let $elements;
+  const options = normaliseOptions(scopeOrOptions);
+  try {
+    var _options$scope;
+    if (!isSupported()) {
+      throw new SupportError();
+    }
+    if (options.scope === null) {
+      throw new ElementError({
+        element: options.scope,
+        component: Component,
+        identifier: 'Scope element (`$scope`)'
+      });
+    }
+    $elements = (_options$scope = options.scope) == null ? void 0 : _options$scope.querySelectorAll(`[data-module="${Component.moduleName}"]`);
+  } catch (error) {
+    if (options.onError) {
+      options.onError(error, {
         component: Component,
         config
       });
     } else {
-      console.log(new SupportError());
+      console.log(error);
     }
     return [];
   }
-  return Array.from($elements).map($element => {
+  return Array.from($elements != null ? $elements : []).map($element => {
     try {
       return typeof config !== 'undefined' ? new Component($element, config) : new Component($element);
     } catch (error) {
-      if (onError) {
-        onError(error, {
+      if (options.onError) {
+        options.onError(error, {
           element: $element,
           component: Component,
           config
@@ -312,7 +341,7 @@ function createAll(Component, config, createAllOptions) {
  *
  * {@link https://github.com/ministryofjustice/moj-frontend/releases}
  */
-const version = '5.2.1';
+const version = '6.0.0';
 
 class AddAnother extends Component {
   /**
@@ -601,7 +630,7 @@ function getPreviousSibling($element, selector) {
  */
 function findNearestMatchingElement($element, selector) {
   // If no element or selector is provided, return
-  if (!$element || !($element instanceof HTMLElement) || false) {
+  if (!$element || !($element instanceof HTMLElement) || !selector) {
     return;
   }
 
@@ -3407,16 +3436,24 @@ SortableTable.schema = Object.freeze(/** @type {const} */{
 });
 
 /**
- * @param {Config} [config]
+ * Initialise all components
+ *
+ * Use the `data-module` attributes to find, instantiate and init all of the
+ * components provided as part of MOJ Frontend.
+ *
+ * @param {Config | Element | Document | null} [scopeOrConfig]
  */
-function initAll(config) {
-  for (const Component of [AddAnother, Alert, ButtonMenu, DatePicker, MultiSelect, PasswordReveal, RichTextEditor, SearchToggle, SortableTable, PdsHeader]) {
-    createAll(Component, undefined, config);
+function initAll(scopeOrConfig) {
+  for (const Component of [AddAnother, Alert, ButtonMenu, DatePicker, MultiSelect, PasswordReveal, PdsHeader, RichTextEditor, SearchToggle, SortableTable]) {
+    createAll(Component, undefined, scopeOrConfig);
   }
 }
 
 /**
- * @typedef {Parameters<typeof GOVUKFrontend.initAll>[0]} Config
+ * Config for all components via `initAll()`
+ *
+ * @typedef {object} Config
+ * @property {Element | Document | null } scope - the scope to search for components in
  */
 
 /**