@ministryofjustice/frontend 4.0.1 → 5.1.0

package/moj/components/rich-text-editor/rich-text-editor.mjs

@@ -1,158 +1,204 @@
-function RichTextEditor(options) {
-  if (!('contentEditable' in document.documentElement)) {
-    return
+import { ConfigurableComponent } from 'govuk-frontend';
+
+/**
+ * @augments {ConfigurableComponent<RichTextEditorConfig>}
+ */
+class RichTextEditor extends ConfigurableComponent {
+  /**
+   * @param {Element | null} $root - HTML element to use for rich text editor
+   * @param {RichTextEditorConfig} config
+   */
+  constructor($root, config = {}) {
+    super($root, config);
+    if (!RichTextEditor.isSupported()) {
+      return this;
+    }
+    const $textarea = this.$root.querySelector('.govuk-textarea');
+    if (!$textarea || !($textarea instanceof HTMLTextAreaElement)) {
+      return this;
+    }
+    this.$textarea = $textarea;
+    this.createToolbar();
+    this.hideDefault();
+    this.configureToolbar();
+    this.keys = {
+      left: 37,
+      right: 39,
+      up: 38,
+      down: 40
+    };
+    this.$content.addEventListener('input', this.onEditorInput.bind(this));
+    this.$root.querySelector('label').addEventListener('click', this.onLabelClick.bind(this));
+    this.$toolbar.addEventListener('keydown', this.onToolbarKeydown.bind(this));
   }
 
-  this.options = options;
-  this.options.toolbar = this.options.toolbar || {
-    bold: false,
-    italic: false,
-    underline: false,
-    bullets: true,
-    numbers: true
-  };
-  this.textarea = this.options.textarea;
-  this.container = $(this.textarea).parent();
-
-  if (this.container.data('moj-rich-text-editor-initialised')) {
-    return
+  /**
+   * @param {KeyboardEvent} event - Click event
+   */
+  onToolbarKeydown(event) {
+    let $focusableButton;
+    switch (event.keyCode) {
+      case this.keys.right:
+      case this.keys.down:
+        {
+          $focusableButton = this.$buttons.find(button => button.getAttribute('tabindex') === '0');
+          if ($focusableButton) {
+            const $nextButton = $focusableButton.nextElementSibling;
+            if ($nextButton && $nextButton instanceof HTMLButtonElement) {
+              $nextButton.focus();
+              $focusableButton.setAttribute('tabindex', '-1');
+              $nextButton.setAttribute('tabindex', '0');
+            }
+          }
+          break;
+        }
+      case this.keys.left:
+      case this.keys.up:
+        {
+          $focusableButton = this.$buttons.find(button => button.getAttribute('tabindex') === '0');
+          if ($focusableButton) {
+            const $previousButton = $focusableButton.previousElementSibling;
+            if ($previousButton && $previousButton instanceof HTMLButtonElement) {
+              $previousButton.focus();
+              $focusableButton.setAttribute('tabindex', '-1');
+              $previousButton.setAttribute('tabindex', '0');
+            }
+          }
+          break;
+        }
+    }
   }
-
-  this.container.data('moj-rich-text-editor-initialised', true);
-
-  this.createToolbar();
-  this.hideDefault();
-  this.configureToolbar();
-  this.keys = {
-    left: 37,
-    right: 39,
-    up: 38,
-    down: 40
-  };
-  this.container.on(
-    'click',
-    '.moj-rich-text-editor__toolbar-button',
-    $.proxy(this, 'onButtonClick')
-  );
-  this.container
-    .find('.moj-rich-text-editor__content')
-    .on('input', $.proxy(this, 'onEditorInput'));
-  this.container.find('label').on('click', $.proxy(this, 'onLabelClick'));
-  this.toolbar.on('keydown', $.proxy(this, 'onToolbarKeydown'));
-}
-
-RichTextEditor.prototype.onToolbarKeydown = function (e) {
-  let focusableButton;
-  switch (e.keyCode) {
-    case this.keys.right:
-    case this.keys.down: {
-      focusableButton = this.toolbar.find('button[tabindex=0]');
-      const nextButton = focusableButton.next('button');
-      if (nextButton[0]) {
-        nextButton.focus();
-        focusableButton.attr('tabindex', '-1');
-        nextButton.attr('tabindex', '0');
-      }
-      break
+  getToolbarHtml() {
+    let html = '';
+    html += '<div class="moj-rich-text-editor__toolbar" role="toolbar">';
+    if (this.config.toolbar.bold) {
+      html += '<button class="moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--bold" type="button" data-command="bold"><span class="govuk-visually-hidden">Bold</span></button>';
+    }
+    if (this.config.toolbar.italic) {
+      html += '<button class="moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--italic" type="button" data-command="italic"><span class="govuk-visually-hidden">Italic</span></button>';
     }
-    case this.keys.left:
-    case this.keys.up: {
-      focusableButton = this.toolbar.find('button[tabindex=0]');
-      const previousButton = focusableButton.prev('button');
-      if (previousButton[0]) {
-        previousButton.focus();
-        focusableButton.attr('tabindex', '-1');
-        previousButton.attr('tabindex', '0');
-      }
-      break
+    if (this.config.toolbar.underline) {
+      html += '<button class="moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--underline" type="button" data-command="underline"><span class="govuk-visually-hidden">Underline</span></button>';
     }
+    if (this.config.toolbar.bullets) {
+      html += '<button class="moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--unordered-list" type="button" data-command="insertUnorderedList"><span class="govuk-visually-hidden">Unordered list</span></button>';
+    }
+    if (this.config.toolbar.numbers) {
+      html += '<button class="moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--ordered-list" type="button" data-command="insertOrderedList"><span class="govuk-visually-hidden">Ordered list</span></button>';
+    }
+    html += '</div>';
+    return html;
   }
-};
-
-RichTextEditor.prototype.getToolbarHtml = function () {
-  let html = '';
-
-  html += '<div class="moj-rich-text-editor__toolbar" role="toolbar">';
-
-  if (this.options.toolbar.bold) {
-    html +=
-      '<button class="moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--bold" type="button" data-command="bold"><span class="govuk-visually-hidden">Bold</span></button>';
+  getEnhancedHtml() {
+    return `${this.getToolbarHtml()}<div class="govuk-textarea moj-rich-text-editor__content" contenteditable="true" spellcheck="false"></div>`;
   }
-
-  if (this.options.toolbar.italic) {
-    html +=
-      '<button class="moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--italic" type="button" data-command="italic"><span class="govuk-visually-hidden">Italic</span></button>';
+  hideDefault() {
+    this.$textarea.classList.add('govuk-visually-hidden');
+    this.$textarea.setAttribute('aria-hidden', 'true');
+    this.$textarea.setAttribute('tabindex', '-1');
   }
-
-  if (this.options.toolbar.underline) {
-    html +=
-      '<button class="moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--underline" type="button" data-command="underline"><span class="govuk-visually-hidden">Underline</span></button>';
+  createToolbar() {
+    this.$toolbar = document.createElement('div');
+    this.$toolbar.className = 'moj-rich-text-editor';
+    this.$toolbar.innerHTML = this.getEnhancedHtml();
+    this.$root.append(this.$toolbar);
+    this.$content = /** @type {HTMLElement} */
+    this.$root.querySelector('.moj-rich-text-editor__content');
+    this.$content.innerHTML = this.$textarea.value;
   }
-
-  if (this.options.toolbar.bullets) {
-    html +=
-      '<button class="moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--unordered-list" type="button" data-command="insertUnorderedList"><span class="govuk-visually-hidden">Unordered list</span></button>';
+  configureToolbar() {
+    this.$buttons = Array.from(/** @type {NodeListOf<HTMLButtonElement>} */
+    this.$root.querySelectorAll('.moj-rich-text-editor__toolbar-button'));
+    this.$buttons.forEach(($button, index) => {
+      $button.setAttribute('tabindex', !index ? '0' : '-1');
+      $button.addEventListener('click', this.onButtonClick.bind(this));
+    });
   }
 
-  if (this.options.toolbar.numbers) {
-    html +=
-      '<button class="moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--ordered-list" type="button" data-command="insertOrderedList"><span class="govuk-visually-hidden">Ordered list</span></button>';
+  /**
+   * @param {MouseEvent} event - Click event
+   */
+  onButtonClick(event) {
+    if (!(event.currentTarget instanceof HTMLElement)) {
+      return;
+    }
+    document.execCommand(event.currentTarget.getAttribute('data-command'), false, undefined);
+  }
+  getContent() {
+    return this.$content.innerHTML;
+  }
+  onEditorInput() {
+    this.updateTextarea();
+  }
+  updateTextarea() {
+    document.execCommand('defaultParagraphSeparator', false, 'p');
+    this.$textarea.value = this.getContent();
   }
 
-  html += '</div>';
-  return html
-};
-
-RichTextEditor.prototype.getEnhancedHtml = function (val) {
-  return `${this.getToolbarHtml()}<div class="govuk-textarea moj-rich-text-editor__content" contenteditable="true" spellcheck="false"></div>`
-};
-
-RichTextEditor.prototype.hideDefault = function () {
-  this.textarea = this.container.find('textarea');
-  this.textarea.addClass('govuk-visually-hidden');
-  this.textarea.attr('aria-hidden', true);
-  this.textarea.attr('tabindex', '-1');
-};
-
-RichTextEditor.prototype.createToolbar = function () {
-  this.toolbar = document.createElement('div');
-  this.toolbar.className = 'moj-rich-text-editor';
-  this.toolbar.innerHTML = this.getEnhancedHtml();
-  this.container.append(this.toolbar);
-  this.toolbar = this.container.find('.moj-rich-text-editor__toolbar');
-  this.container
-    .find('.moj-rich-text-editor__content')
-    .html(this.textarea.val());
-};
-
-RichTextEditor.prototype.configureToolbar = function () {
-  this.buttons = this.container.find('.moj-rich-text-editor__toolbar-button');
-  this.buttons.prop('tabindex', '-1');
-  const firstTab = this.buttons.first();
-  firstTab.prop('tabindex', '0');
-};
-
-RichTextEditor.prototype.onButtonClick = function (e) {
-  document.execCommand($(e.currentTarget).data('command'), false, null);
-};
-
-RichTextEditor.prototype.getContent = function () {
-  return this.container.find('.moj-rich-text-editor__content').html()
-};
-
-RichTextEditor.prototype.onEditorInput = function (e) {
-  this.updateTextarea();
-};
+  /**
+   * @param {MouseEvent} event - Click event
+   */
+  onLabelClick(event) {
+    event.preventDefault();
+    this.$content.focus();
+  }
+  static isSupported() {
+    return 'contentEditable' in document.documentElement;
+  }
 
-RichTextEditor.prototype.updateTextarea = function () {
-  document.execCommand('defaultParagraphSeparator', false, 'p');
-  this.textarea.val(this.getContent());
-};
+  /**
+   * Name for the component used when initialising using data-module attributes.
+   */
+}
 
-RichTextEditor.prototype.onLabelClick = function (e) {
-  e.preventDefault();
-  this.container.find('.moj-rich-text-editor__content').focus();
-};
+/**
+ * Rich text editor config
+ *
+ * @typedef {object} RichTextEditorConfig
+ * @property {RichTextEditorToolbar} [toolbar] - Toolbar options
+ */
+
+/**
+ * Rich text editor toolbar options
+ *
+ * @typedef {object} RichTextEditorToolbar
+ * @property {boolean} [bold] - Show the bold button
+ * @property {boolean} [italic] - Show the italic button
+ * @property {boolean} [underline] - Show the underline button
+ * @property {boolean} [bullets] - Show the bullets button
+ * @property {boolean} [numbers] - Show the numbers button
+ */
+
+/**
+ * @import { Schema } from 'govuk-frontend/dist/govuk/common/configuration.mjs'
+ */
+RichTextEditor.moduleName = 'moj-rich-text-editor';
+/**
+ * Rich text editor config
+ *
+ * @type {RichTextEditorConfig}
+ */
+RichTextEditor.defaults = Object.freeze({
+  toolbar: {
+    bold: false,
+    italic: false,
+    underline: false,
+    bullets: true,
+    numbers: true
+  }
+});
+/**
+ * Rich text editor config schema
+ *
+ * @satisfies {Schema<RichTextEditorConfig>}
+ */
+RichTextEditor.schema = Object.freeze(/** @type {const} */{
+  properties: {
+    toolbar: {
+      type: 'object'
+    }
+  }
+});
 
 export { RichTextEditor };
 //# sourceMappingURL=rich-text-editor.mjs.map

package/moj/components/rich-text-editor/rich-text-editor.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"rich-text-editor.mjs","sources":["../../../../src/moj/components/rich-text-editor/rich-text-editor.mjs"],"sourcesContent":["import $ from 'jquery'\n\nexport function RichTextEditor(options) {\n  if (!('contentEditable' in document.documentElement)) {\n    return\n  }\n\n  this.options = options\n  this.options.toolbar = this.options.toolbar || {\n    bold: false,\n    italic: false,\n    underline: false,\n    bullets: true,\n    numbers: true\n  }\n  this.textarea = this.options.textarea\n  this.container = $(this.textarea).parent()\n\n  if (this.container.data('moj-rich-text-editor-initialised')) {\n    return\n  }\n\n  this.container.data('moj-rich-text-editor-initialised', true)\n\n  this.createToolbar()\n  this.hideDefault()\n  this.configureToolbar()\n  this.keys = {\n    left: 37,\n    right: 39,\n    up: 38,\n    down: 40\n  }\n  this.container.on(\n    'click',\n    '.moj-rich-text-editor__toolbar-button',\n    $.proxy(this, 'onButtonClick')\n  )\n  this.container\n    .find('.moj-rich-text-editor__content')\n    .on('input', $.proxy(this, 'onEditorInput'))\n  this.container.find('label').on('click', $.proxy(this, 'onLabelClick'))\n  this.toolbar.on('keydown', $.proxy(this, 'onToolbarKeydown'))\n}\n\nRichTextEditor.prototype.onToolbarKeydown = function (e) {\n  let focusableButton\n  switch (e.keyCode) {\n    case this.keys.right:\n    case this.keys.down: {\n      focusableButton = this.toolbar.find('button[tabindex=0]')\n      const nextButton = focusableButton.next('button')\n      if (nextButton[0]) {\n        nextButton.focus()\n        focusableButton.attr('tabindex', '-1')\n        nextButton.attr('tabindex', '0')\n      }\n      break\n    }\n    case this.keys.left:\n    case this.keys.up: {\n      focusableButton = this.toolbar.find('button[tabindex=0]')\n      const previousButton = focusableButton.prev('button')\n      if (previousButton[0]) {\n        previousButton.focus()\n        focusableButton.attr('tabindex', '-1')\n        previousButton.attr('tabindex', '0')\n      }\n      break\n    }\n  }\n}\n\nRichTextEditor.prototype.getToolbarHtml = function () {\n  let html = ''\n\n  html += '<div class=\"moj-rich-text-editor__toolbar\" role=\"toolbar\">'\n\n  if (this.options.toolbar.bold) {\n    html +=\n      '<button class=\"moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--bold\" type=\"button\" data-command=\"bold\"><span class=\"govuk-visually-hidden\">Bold</span></button>'\n  }\n\n  if (this.options.toolbar.italic) {\n    html +=\n      '<button class=\"moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--italic\" type=\"button\" data-command=\"italic\"><span class=\"govuk-visually-hidden\">Italic</span></button>'\n  }\n\n  if (this.options.toolbar.underline) {\n    html +=\n      '<button class=\"moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--underline\" type=\"button\" data-command=\"underline\"><span class=\"govuk-visually-hidden\">Underline</span></button>'\n  }\n\n  if (this.options.toolbar.bullets) {\n    html +=\n      '<button class=\"moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--unordered-list\" type=\"button\" data-command=\"insertUnorderedList\"><span class=\"govuk-visually-hidden\">Unordered list</span></button>'\n  }\n\n  if (this.options.toolbar.numbers) {\n    html +=\n      '<button class=\"moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--ordered-list\" type=\"button\" data-command=\"insertOrderedList\"><span class=\"govuk-visually-hidden\">Ordered list</span></button>'\n  }\n\n  html += '</div>'\n  return html\n}\n\nRichTextEditor.prototype.getEnhancedHtml = function (val) {\n  return `${this.getToolbarHtml()}<div class=\"govuk-textarea moj-rich-text-editor__content\" contenteditable=\"true\" spellcheck=\"false\"></div>`\n}\n\nRichTextEditor.prototype.hideDefault = function () {\n  this.textarea = this.container.find('textarea')\n  this.textarea.addClass('govuk-visually-hidden')\n  this.textarea.attr('aria-hidden', true)\n  this.textarea.attr('tabindex', '-1')\n}\n\nRichTextEditor.prototype.createToolbar = function () {\n  this.toolbar = document.createElement('div')\n  this.toolbar.className = 'moj-rich-text-editor'\n  this.toolbar.innerHTML = this.getEnhancedHtml()\n  this.container.append(this.toolbar)\n  this.toolbar = this.container.find('.moj-rich-text-editor__toolbar')\n  this.container\n    .find('.moj-rich-text-editor__content')\n    .html(this.textarea.val())\n}\n\nRichTextEditor.prototype.configureToolbar = function () {\n  this.buttons = this.container.find('.moj-rich-text-editor__toolbar-button')\n  this.buttons.prop('tabindex', '-1')\n  const firstTab = this.buttons.first()\n  firstTab.prop('tabindex', '0')\n}\n\nRichTextEditor.prototype.onButtonClick = function (e) {\n  document.execCommand($(e.currentTarget).data('command'), false, null)\n}\n\nRichTextEditor.prototype.getContent = function () {\n  return this.container.find('.moj-rich-text-editor__content').html()\n}\n\nRichTextEditor.prototype.onEditorInput = function (e) {\n  this.updateTextarea()\n}\n\nRichTextEditor.prototype.updateTextarea = function () {\n  document.execCommand('defaultParagraphSeparator', false, 'p')\n  this.textarea.val(this.getContent())\n}\n\nRichTextEditor.prototype.onLabelClick = function (e) {\n  e.preventDefault()\n  this.container.find('.moj-rich-text-editor__content').focus()\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"rich-text-editor.mjs","sources":["../../../../src/moj/components/rich-text-editor/rich-text-editor.mjs"],"sourcesContent":["import { ConfigurableComponent } from 'govuk-frontend'\n\n/**\n * @augments {ConfigurableComponent<RichTextEditorConfig>}\n */\nexport class RichTextEditor extends ConfigurableComponent {\n  /**\n   * @param {Element | null} $root - HTML element to use for rich text editor\n   * @param {RichTextEditorConfig} config\n   */\n  constructor($root, config = {}) {\n    super($root, config)\n\n    if (!RichTextEditor.isSupported()) {\n      return this\n    }\n\n    const $textarea = this.$root.querySelector('.govuk-textarea')\n    if (!$textarea || !($textarea instanceof HTMLTextAreaElement)) {\n      return this\n    }\n\n    this.$textarea = $textarea\n\n    this.createToolbar()\n    this.hideDefault()\n    this.configureToolbar()\n\n    this.keys = {\n      left: 37,\n      right: 39,\n      up: 38,\n      down: 40\n    }\n\n    this.$content.addEventListener('input', this.onEditorInput.bind(this))\n\n    this.$root\n      .querySelector('label')\n      .addEventListener('click', this.onLabelClick.bind(this))\n\n    this.$toolbar.addEventListener('keydown', this.onToolbarKeydown.bind(this))\n  }\n\n  /**\n   * @param {KeyboardEvent} event - Click event\n   */\n  onToolbarKeydown(event) {\n    let $focusableButton\n    switch (event.keyCode) {\n      case this.keys.right:\n      case this.keys.down: {\n        $focusableButton = this.$buttons.find(\n          (button) => button.getAttribute('tabindex') === '0'\n        )\n\n        if ($focusableButton) {\n          const $nextButton = $focusableButton.nextElementSibling\n\n          if ($nextButton && $nextButton instanceof HTMLButtonElement) {\n            $nextButton.focus()\n            $focusableButton.setAttribute('tabindex', '-1')\n            $nextButton.setAttribute('tabindex', '0')\n          }\n        }\n\n        break\n      }\n\n      case this.keys.left:\n      case this.keys.up: {\n        $focusableButton = this.$buttons.find(\n          (button) => button.getAttribute('tabindex') === '0'\n        )\n\n        if ($focusableButton) {\n          const $previousButton = $focusableButton.previousElementSibling\n\n          if ($previousButton && $previousButton instanceof HTMLButtonElement) {\n            $previousButton.focus()\n            $focusableButton.setAttribute('tabindex', '-1')\n            $previousButton.setAttribute('tabindex', '0')\n          }\n        }\n\n        break\n      }\n    }\n  }\n\n  getToolbarHtml() {\n    let html = ''\n\n    html += '<div class=\"moj-rich-text-editor__toolbar\" role=\"toolbar\">'\n\n    if (this.config.toolbar.bold) {\n      html +=\n        '<button class=\"moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--bold\" type=\"button\" data-command=\"bold\"><span class=\"govuk-visually-hidden\">Bold</span></button>'\n    }\n\n    if (this.config.toolbar.italic) {\n      html +=\n        '<button class=\"moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--italic\" type=\"button\" data-command=\"italic\"><span class=\"govuk-visually-hidden\">Italic</span></button>'\n    }\n\n    if (this.config.toolbar.underline) {\n      html +=\n        '<button class=\"moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--underline\" type=\"button\" data-command=\"underline\"><span class=\"govuk-visually-hidden\">Underline</span></button>'\n    }\n\n    if (this.config.toolbar.bullets) {\n      html +=\n        '<button class=\"moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--unordered-list\" type=\"button\" data-command=\"insertUnorderedList\"><span class=\"govuk-visually-hidden\">Unordered list</span></button>'\n    }\n\n    if (this.config.toolbar.numbers) {\n      html +=\n        '<button class=\"moj-rich-text-editor__toolbar-button moj-rich-text-editor__toolbar-button--ordered-list\" type=\"button\" data-command=\"insertOrderedList\"><span class=\"govuk-visually-hidden\">Ordered list</span></button>'\n    }\n\n    html += '</div>'\n    return html\n  }\n\n  getEnhancedHtml() {\n    return `${this.getToolbarHtml()}<div class=\"govuk-textarea moj-rich-text-editor__content\" contenteditable=\"true\" spellcheck=\"false\"></div>`\n  }\n\n  hideDefault() {\n    this.$textarea.classList.add('govuk-visually-hidden')\n    this.$textarea.setAttribute('aria-hidden', 'true')\n    this.$textarea.setAttribute('tabindex', '-1')\n  }\n\n  createToolbar() {\n    this.$toolbar = document.createElement('div')\n    this.$toolbar.className = 'moj-rich-text-editor'\n    this.$toolbar.innerHTML = this.getEnhancedHtml()\n    this.$root.append(this.$toolbar)\n\n    this.$content = /** @type {HTMLElement} */ (\n      this.$root.querySelector('.moj-rich-text-editor__content')\n    )\n\n    this.$content.innerHTML = this.$textarea.value\n  }\n\n  configureToolbar() {\n    this.$buttons = Array.from(\n      /** @type {NodeListOf<HTMLButtonElement>} */\n      (this.$root.querySelectorAll('.moj-rich-text-editor__toolbar-button'))\n    )\n\n    this.$buttons.forEach(($button, index) => {\n      $button.setAttribute('tabindex', !index ? '0' : '-1')\n      $button.addEventListener('click', this.onButtonClick.bind(this))\n    })\n  }\n\n  /**\n   * @param {MouseEvent} event - Click event\n   */\n  onButtonClick(event) {\n    if (!(event.currentTarget instanceof HTMLElement)) {\n      return\n    }\n\n    document.execCommand(\n      event.currentTarget.getAttribute('data-command'),\n      false,\n      undefined\n    )\n  }\n\n  getContent() {\n    return this.$content.innerHTML\n  }\n\n  onEditorInput() {\n    this.updateTextarea()\n  }\n\n  updateTextarea() {\n    document.execCommand('defaultParagraphSeparator', false, 'p')\n    this.$textarea.value = this.getContent()\n  }\n\n  /**\n   * @param {MouseEvent} event - Click event\n   */\n  onLabelClick(event) {\n    event.preventDefault()\n    this.$content.focus()\n  }\n\n  static isSupported() {\n    return 'contentEditable' in document.documentElement\n  }\n\n  /**\n   * Name for the component used when initialising using data-module attributes.\n   */\n  static moduleName = 'moj-rich-text-editor'\n\n  /**\n   * Rich text editor config\n   *\n   * @type {RichTextEditorConfig}\n   */\n  static defaults = Object.freeze({\n    toolbar: {\n      bold: false,\n      italic: false,\n      underline: false,\n      bullets: true,\n      numbers: true\n    }\n  })\n\n  /**\n   * Rich text editor config schema\n   *\n   * @satisfies {Schema<RichTextEditorConfig>}\n   */\n  static schema = Object.freeze(\n    /** @type {const} */ ({\n      properties: {\n        toolbar: { type: 'object' }\n      }\n    })\n  )\n}\n\n/**\n * Rich text editor config\n *\n * @typedef {object} RichTextEditorConfig\n * @property {RichTextEditorToolbar} [toolbar] - Toolbar options\n */\n\n/**\n * Rich text editor toolbar options\n *\n * @typedef {object} RichTextEditorToolbar\n * @property {boolean} [bold] - Show the bold button\n * @property {boolean} [italic] - Show the italic button\n * @property {boolean} [underline] - Show the underline button\n * @property {boolean} [bullets] - Show the bullets button\n * @property {boolean} [numbers] - Show the numbers button\n */\n\n/**\n * @import { Schema } from 'govuk-frontend/dist/govuk/common/configuration.mjs'\n */\n"],"names":["RichTextEditor","ConfigurableComponent","constructor","$root","config","isSupported","$textarea","querySelector","HTMLTextAreaElement","createToolbar","hideDefault","configureToolbar","keys","left","right","up","down","$content","addEventListener","onEditorInput","bind","onLabelClick","$toolbar","onToolbarKeydown","event","$focusableButton","keyCode","$buttons","find","button","getAttribute","$nextButton","nextElementSibling","HTMLButtonElement","focus","setAttribute","$previousButton","previousElementSibling","getToolbarHtml","html","toolbar","bold","italic","underline","bullets","numbers","getEnhancedHtml","classList","add","document","createElement","className","innerHTML","append","value","Array","from","querySelectorAll","forEach","$button","index","onButtonClick","currentTarget","HTMLElement","execCommand","undefined","getContent","updateTextarea","preventDefault","documentElement","moduleName","defaults","Object","freeze","schema","properties","type"],"mappings":"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"}

package/moj/components/search/_search.scss

@@ -44,3 +44,5 @@
     padding: 0 !important;
   }
 }
+
+/*# sourceMappingURL=_search.scss.map */

package/moj/components/search/_search.scss.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/moj/components/search/_search.scss"],"names":[],"mappings":"AAAA,uCAAuC;;AAEvC;EACE,YAAY,EAAE,UAAU;AAC1B;;AAEA;EACE,qBAAqB;EACrB,aAAa;AACf;;AAEA;EACE,qBAAqB;EACrB,OAAO;EACP,gBAAgB;EAChB,mBAAmB;AACrB;;AAEA;;EAEE,gBAAgB;AAClB;;AAEA;EACE,kBAAkB;EAClB,UAAU;AACZ;;AAEA;EACE,qBAAqB;EACrB,kBAAkB;EAClB,SAAS,EAAE,8DAA8D;EACzE,WAAW;EACX,gBAAgB;EAChB,6BAA6B;EAC7B,sBAAsB;AACxB;;AAEA;EACE,sDAAsD;EACtD,sCAAsC;EACtC;IACE,sDAAsD;IACtD,qBAAqB;EACvB;AACF","file":"_search.scss","sourcesContent":["@use \"../../vendor/govuk-frontend\" as *;\n\n.moj-search {\n  font-size: 0; // Fallback\n}\n\n.moj-search form {\n  align-items: flex-end;\n  display: flex;\n}\n\n.moj-search .govuk-form-group {\n  display: inline-block;\n  flex: 1;\n  margin-bottom: 0;\n  vertical-align: top;\n}\n\n.moj-search__label,\n.moj-search__hint {\n  text-align: left;\n}\n\n.moj-search__input:focus {\n  position: relative;\n  z-index: 1;\n}\n\n.moj-search__button {\n  display: inline-block;\n  position: relative;\n  top: -2px; // Override default gov properties due to active pixel movement\n  width: auto;\n  margin-bottom: 0;\n  margin-left: govuk-spacing(2);\n  vertical-align: bottom;\n}\n\n.moj-search--inline {\n  // stylelint-disable-next-line declaration-no-important\n  padding: govuk-spacing(2) 0 !important;\n  @include govuk-media-query($from: desktop) {\n    // stylelint-disable-next-line declaration-no-important\n    padding: 0 !important;\n  }\n}\n"]}

package/moj/components/search-toggle/{search-toggle.scss → _search-toggle.scss}

@@ -75,3 +75,5 @@
     max-width: 450px;
   }
 }
+
+/*# sourceMappingURL=_search-toggle.scss.map */

package/moj/components/search-toggle/_search-toggle.scss.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/moj/components/search-toggle/_search-toggle.scss"],"names":[],"mappings":"AAAA,uCAAuC;;AAEvC;EACE,qBAAqB;EACrB,iBAAiB;EACjB,gBAAgB;EAChB,oBAAoB;EACpB,eAAe;EACf,YAAY;EACZ,yBAAyB;EACzB,6BAA6B;EAC7B,eAAe;EACf,mCAAmC;EACnC,wBAAwB;EACxB,gBAAgB;EAChB,6CAA6C;;EAE7C;IACE,qBAAqB;IACrB,WAAW;IACX,YAAY;IACZ,6BAA6B;IAC7B,kBAAkB;IAClB,sBAAsB;;IAEtB;MACE,gBAAgB;IAClB;EACF;;EAEA;IACE,kBAAkB;IAClB,UAAU;IACV,aAAa;IACb,+BAA+B;IAC/B,qCAAqC;IACrC;;oCAEgC;EAClC;AACF;;AAEA;EACE,yBAAyB;;EAEzB;IACE,sDAAsD;IACtD,2BAA2B;IAC3B,sDAAsD;IACtD,0BAA0B;EAC5B;AACF;;AAEA,YAAY;AACZ;EACE;IACE,sDAAsD;IACtD,yBAAyB;EAC3B;AACF;;AAEA;EACE,kBAAkB;AACpB;;AAEA;EACE,4CAA4C;;EAE5C;IACE,kBAAkB;IAClB,WAAW;IACX,SAAS,EAAE,mBAAmB;IAC9B,YAAY;IACZ,YAAY;IACZ,gBAAgB;EAClB;AACF","file":"_search-toggle.scss","sourcesContent":["@use \"../../vendor/govuk-frontend\" as *;\n\n.moj-search-toggle__button {\n  display: inline-block;\n  padding-top: 12px;\n  padding-right: 0;\n  padding-bottom: 13px;\n  padding-left: 0;\n  border: none;\n  color: $govuk-link-colour;\n  background-color: transparent;\n  cursor: pointer;\n  -webkit-font-smoothing: antialiased;\n  -webkit-appearance: none;\n  appearance: none;\n  @include govuk-font($size: 19, $weight: bold);\n\n  &__icon {\n    display: inline-block;\n    width: 20px;\n    height: 20px;\n    margin-left: govuk-spacing(2);\n    fill: currentcolor;\n    vertical-align: middle;\n\n    @media screen and (forced-colors: active) {\n      fill: windowText;\n    }\n  }\n\n  &:focus {\n    position: relative;\n    z-index: 1;\n    outline: none;\n    color: $govuk-focus-text-colour;\n    background-color: $govuk-focus-colour;\n    box-shadow:\n      0 -2px $govuk-focus-colour,\n      0 4px $govuk-focus-text-colour;\n  }\n}\n\n.moj-search--toggle {\n  padding: govuk-spacing(3);\n\n  @include govuk-media-query($until: desktop) {\n    // stylelint-disable-next-line declaration-no-important\n    padding-right: 0 !important;\n    // stylelint-disable-next-line declaration-no-important\n    padding-left: 0 !important;\n  }\n}\n\n// JS enabled\n.js-enabled .moj-search--toggle {\n  @include govuk-media-query($until: desktop) {\n    // stylelint-disable-next-line declaration-no-important\n    padding-top: 0 !important;\n  }\n}\n\n.js-enabled .moj-search-toggle {\n  position: relative;\n}\n\n.js-enabled .moj-search-toggle__search {\n  background-color: govuk-colour(\"light-grey\");\n\n  @include govuk-media-query($from: desktop) {\n    position: absolute;\n    z-index: 10;\n    top: 50px; // Height of nav bar\n    right: -15px;\n    width: 450px;\n    max-width: 450px;\n  }\n}\n"]}

package/moj/components/search-toggle/search-toggle.bundle.js

@@ -0,0 +1,122 @@
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('govuk-frontend')) :
+  typeof define === 'function' && define.amd ? define(['exports', 'govuk-frontend'], factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.MOJFrontend = global.MOJFrontend || {}, global.GOVUKFrontend));
+})(this, (function (exports, govukFrontend) { 'use strict';
+
+  /**
+   * @augments {ConfigurableComponent<SearchToggleConfig>}
+   */
+  class SearchToggle extends govukFrontend.ConfigurableComponent {
+    /**
+     * @param {Element | null} $root - HTML element to use for search toggle
+     * @param {SearchToggleConfig} [config] - Search toggle config
+     */
+    constructor($root, config = {}) {
+      var _this$config$searchCo, _this$config$toggleBu;
+      super($root, config);
+      const $searchContainer = (_this$config$searchCo = this.config.searchContainer.element) != null ? _this$config$searchCo : this.$root.querySelector(this.config.searchContainer.selector);
+      const $toggleButtonContainer = (_this$config$toggleBu = this.config.toggleButtonContainer.element) != null ? _this$config$toggleBu : this.$root.querySelector(this.config.toggleButtonContainer.selector);
+      if (!$searchContainer || !$toggleButtonContainer || !($searchContainer instanceof HTMLElement) || !($toggleButtonContainer instanceof HTMLElement)) {
+        return this;
+      }
+      this.$searchContainer = $searchContainer;
+      this.$toggleButtonContainer = $toggleButtonContainer;
+      const svg = '<svg viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="moj-search-toggle__button__icon"><path d="M7.433,12.5790048 C6.06762625,12.5808611 4.75763941,12.0392925 3.79217348,11.0738265 C2.82670755,10.1083606 2.28513891,8.79837375 2.28699522,7.433 C2.28513891,6.06762625 2.82670755,4.75763941 3.79217348,3.79217348 C4.75763941,2.82670755 6.06762625,2.28513891 7.433,2.28699522 C8.79837375,2.28513891 10.1083606,2.82670755 11.0738265,3.79217348 C12.0392925,4.75763941 12.5808611,6.06762625 12.5790048,7.433 C12.5808611,8.79837375 12.0392925,10.1083606 11.0738265,11.0738265 C10.1083606,12.0392925 8.79837375,12.5808611 7.433,12.5790048 L7.433,12.5790048 Z M14.293,12.579 L13.391,12.579 L13.071,12.269 C14.2300759,10.9245158 14.8671539,9.20813198 14.866,7.433 C14.866,3.32786745 11.5381325,-1.65045755e-15 7.433,-1.65045755e-15 C3.32786745,-1.65045755e-15 -1.65045755e-15,3.32786745 -1.65045755e-15,7.433 C-1.65045755e-15,11.5381325 3.32786745,14.866 7.433,14.866 C9.208604,14.8671159 10.9253982,14.2296624 12.27,13.07 L12.579,13.39 L12.579,14.294 L18.296,20 L20,18.296 L14.294,12.579 L14.293,12.579 Z"></path></svg>';
+      this.$toggleButton = document.createElement('button');
+      this.$toggleButton.setAttribute('class', 'moj-search-toggle__button');
+      this.$toggleButton.setAttribute('type', 'button');
+      this.$toggleButton.setAttribute('aria-haspopup', 'true');
+      this.$toggleButton.setAttribute('aria-expanded', 'false');
+      this.$toggleButton.innerHTML = `${this.config.toggleButton.text} ${svg}`;
+      this.$toggleButton.addEventListener('click', this.onToggleButtonClick.bind(this));
+      this.$toggleButtonContainer.append(this.$toggleButton);
+      document.addEventListener('click', this.onDocumentClick.bind(this));
+      document.addEventListener('focusin', this.onDocumentClick.bind(this));
+    }
+    showMenu() {
+      this.$toggleButton.setAttribute('aria-expanded', 'true');
+      this.$searchContainer.classList.remove('moj-js-hidden');
+      this.$searchContainer.querySelector('input').focus();
+    }
+    hideMenu() {
+      this.$searchContainer.classList.add('moj-js-hidden');
+      this.$toggleButton.setAttribute('aria-expanded', 'false');
+    }
+    onToggleButtonClick() {
+      if (this.$toggleButton.getAttribute('aria-expanded') === 'false') {
+        this.showMenu();
+      } else {
+        this.hideMenu();
+      }
+    }
+
+    /**
+     * @param {MouseEvent | FocusEvent} event
+     */
+    onDocumentClick(event) {
+      if (event.target instanceof Node && !this.$toggleButtonContainer.contains(event.target) && !this.$searchContainer.contains(event.target)) {
+        this.hideMenu();
+      }
+    }
+
+    /**
+     * Name for the component used when initialising using data-module attributes.
+     */
+  }
+
+  /**
+   * @typedef {object} SearchToggleConfig
+   * @property {object} [searchContainer] - Search config
+   * @property {string} [searchContainer.selector] - Selector for search container
+   * @property {Element | null} [searchContainer.element] - HTML element for search container
+   * @property {object} [toggleButton] - Toggle button config
+   * @property {string} [toggleButton.text] - Text for toggle button
+   * @property {object} [toggleButtonContainer] - Toggle button container config
+   * @property {string} [toggleButtonContainer.selector] - Selector for toggle button container
+   * @property {Element | null} [toggleButtonContainer.element] - HTML element for toggle button container
+   */
+
+  /**
+   * @import { Schema } from 'govuk-frontend/dist/govuk/common/configuration.mjs'
+   */
+  SearchToggle.moduleName = 'moj-search-toggle';
+  /**
+   * Search toggle config
+   *
+   * @type {SearchToggleConfig}
+   */
+  SearchToggle.defaults = Object.freeze({
+    searchContainer: {
+      selector: '.moj-search'
+    },
+    toggleButton: {
+      text: 'Search'
+    },
+    toggleButtonContainer: {
+      selector: '.moj-search-toggle__toggle'
+    }
+  });
+  /**
+   * Search toggle config schema
+   *
+   * @satisfies {Schema<SearchToggleConfig>}
+   */
+  SearchToggle.schema = Object.freeze(/** @type {const} */{
+    properties: {
+      searchContainer: {
+        type: 'object'
+      },
+      toggleButton: {
+        type: 'object'
+      },
+      toggleButtonContainer: {
+        type: 'object'
+      }
+    }
+  });
+
+  exports.SearchToggle = SearchToggle;
+
+}));
+//# sourceMappingURL=search-toggle.bundle.js.map

package/moj/components/search-toggle/search-toggle.bundle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"search-toggle.bundle.js","sources":["../../../../src/moj/components/search-toggle/search-toggle.mjs"],"sourcesContent":["import { ConfigurableComponent } from 'govuk-frontend'\n\n/**\n * @augments {ConfigurableComponent<SearchToggleConfig>}\n */\nexport class SearchToggle extends ConfigurableComponent {\n  /**\n   * @param {Element | null} $root - HTML element to use for search toggle\n   * @param {SearchToggleConfig} [config] - Search toggle config\n   */\n  constructor($root, config = {}) {\n    super($root, config)\n\n    const $searchContainer =\n      this.config.searchContainer.element ??\n      this.$root.querySelector(this.config.searchContainer.selector)\n\n    const $toggleButtonContainer =\n      this.config.toggleButtonContainer.element ??\n      this.$root.querySelector(this.config.toggleButtonContainer.selector)\n\n    if (\n      !$searchContainer ||\n      !$toggleButtonContainer ||\n      !($searchContainer instanceof HTMLElement) ||\n      !($toggleButtonContainer instanceof HTMLElement)\n    ) {\n      return this\n    }\n\n    this.$searchContainer = $searchContainer\n    this.$toggleButtonContainer = $toggleButtonContainer\n\n    const svg =\n      '<svg viewBox=\"0 0 20 20\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" class=\"moj-search-toggle__button__icon\"><path d=\"M7.433,12.5790048 C6.06762625,12.5808611 4.75763941,12.0392925 3.79217348,11.0738265 C2.82670755,10.1083606 2.28513891,8.79837375 2.28699522,7.433 C2.28513891,6.06762625 2.82670755,4.75763941 3.79217348,3.79217348 C4.75763941,2.82670755 6.06762625,2.28513891 7.433,2.28699522 C8.79837375,2.28513891 10.1083606,2.82670755 11.0738265,3.79217348 C12.0392925,4.75763941 12.5808611,6.06762625 12.5790048,7.433 C12.5808611,8.79837375 12.0392925,10.1083606 11.0738265,11.0738265 C10.1083606,12.0392925 8.79837375,12.5808611 7.433,12.5790048 L7.433,12.5790048 Z M14.293,12.579 L13.391,12.579 L13.071,12.269 C14.2300759,10.9245158 14.8671539,9.20813198 14.866,7.433 C14.866,3.32786745 11.5381325,-1.65045755e-15 7.433,-1.65045755e-15 C3.32786745,-1.65045755e-15 -1.65045755e-15,3.32786745 -1.65045755e-15,7.433 C-1.65045755e-15,11.5381325 3.32786745,14.866 7.433,14.866 C9.208604,14.8671159 10.9253982,14.2296624 12.27,13.07 L12.579,13.39 L12.579,14.294 L18.296,20 L20,18.296 L14.294,12.579 L14.293,12.579 Z\"></path></svg>'\n\n    this.$toggleButton = document.createElement('button')\n    this.$toggleButton.setAttribute('class', 'moj-search-toggle__button')\n    this.$toggleButton.setAttribute('type', 'button')\n    this.$toggleButton.setAttribute('aria-haspopup', 'true')\n    this.$toggleButton.setAttribute('aria-expanded', 'false')\n    this.$toggleButton.innerHTML = `${this.config.toggleButton.text} ${svg}`\n\n    this.$toggleButton.addEventListener(\n      'click',\n      this.onToggleButtonClick.bind(this)\n    )\n\n    this.$toggleButtonContainer.append(this.$toggleButton)\n\n    document.addEventListener('click', this.onDocumentClick.bind(this))\n    document.addEventListener('focusin', this.onDocumentClick.bind(this))\n  }\n\n  showMenu() {\n    this.$toggleButton.setAttribute('aria-expanded', 'true')\n    this.$searchContainer.classList.remove('moj-js-hidden')\n    this.$searchContainer.querySelector('input').focus()\n  }\n\n  hideMenu() {\n    this.$searchContainer.classList.add('moj-js-hidden')\n    this.$toggleButton.setAttribute('aria-expanded', 'false')\n  }\n\n  onToggleButtonClick() {\n    if (this.$toggleButton.getAttribute('aria-expanded') === 'false') {\n      this.showMenu()\n    } else {\n      this.hideMenu()\n    }\n  }\n\n  /**\n   * @param {MouseEvent | FocusEvent} event\n   */\n  onDocumentClick(event) {\n    if (\n      event.target instanceof Node &&\n      !this.$toggleButtonContainer.contains(event.target) &&\n      !this.$searchContainer.contains(event.target)\n    ) {\n      this.hideMenu()\n    }\n  }\n\n  /**\n   * Name for the component used when initialising using data-module attributes.\n   */\n  static moduleName = 'moj-search-toggle'\n\n  /**\n   * Search toggle config\n   *\n   * @type {SearchToggleConfig}\n   */\n  static defaults = Object.freeze({\n    searchContainer: {\n      selector: '.moj-search'\n    },\n    toggleButton: {\n      text: 'Search'\n    },\n    toggleButtonContainer: {\n      selector: '.moj-search-toggle__toggle'\n    }\n  })\n\n  /**\n   * Search toggle config schema\n   *\n   * @satisfies {Schema<SearchToggleConfig>}\n   */\n  static schema = Object.freeze(\n    /** @type {const} */ ({\n      properties: {\n        searchContainer: { type: 'object' },\n        toggleButton: { type: 'object' },\n        toggleButtonContainer: { type: 'object' }\n      }\n    })\n  )\n}\n\n/**\n * @typedef {object} SearchToggleConfig\n * @property {object} [searchContainer] - Search config\n * @property {string} [searchContainer.selector] - Selector for search container\n * @property {Element | null} [searchContainer.element] - HTML element for search container\n * @property {object} [toggleButton] - Toggle button config\n * @property {string} [toggleButton.text] - Text for toggle button\n * @property {object} [toggleButtonContainer] - Toggle button container config\n * @property {string} [toggleButtonContainer.selector] - Selector for toggle button container\n * @property {Element | null} [toggleButtonContainer.element] - HTML element for toggle button container\n */\n\n/**\n * @import { Schema } from 'govuk-frontend/dist/govuk/common/configuration.mjs'\n */\n"],"names":["SearchToggle","ConfigurableComponent","constructor","$root","config","_this$config$searchCo","_this$config$toggleBu","$searchContainer","searchContainer","element","querySelector","selector","$toggleButtonContainer","toggleButtonContainer","HTMLElement","svg","$toggleButton","document","createElement","setAttribute","innerHTML","toggleButton","text","addEventListener","onToggleButtonClick","bind","append","onDocumentClick","showMenu","classList","remove","focus","hideMenu","add","getAttribute","event","target","Node","contains","moduleName","defaults","Object","freeze","schema","properties","type"],"mappings":"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"}