govuk_publishing_components 62.0.0 → 62.1.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 0c8da1f43ba0d018e6a7578e500c7b8c413f5e6374616962a8b4f0409c4813dc
-  data.tar.gz: be66202a83920b0c1b73287a138feaf04944812b3a5a9a7ed9377b5739d739b1
+  metadata.gz: c0b6593923ef9b4160aa5ff1b04e103f3f5094ff4748c6b6f6588a0296cf95ba
+  data.tar.gz: a82f523e9a22d356e5d25a2b814810b4b69a8a9692fcc7a1df240e7a945503e3
 SHA512:
-  metadata.gz: 492e5332b0615d82b43f834a2faf7a713d7531db35aaab326893568215a11334cae6ca93e810ae35a353b51a2053d82960f5806f3f9170fba76afcc2e2e303cd
-  data.tar.gz: 686930de1300550b6f0a04d46c7fb63c25a3b319f86eb9479165639b38a0b4d232a0d159cb4e2e92137abd300aca023a768d27e3e5c7e7d51e86d215c26e9150
+  metadata.gz: 9fb4b8c3a6cde7baa11b3803c270557170207132d95eda07479970582ebbd36a91d709d25b2341217aaf3660f3923e219d5919a882429c85c32efa7b949d6752
+  data.tar.gz: 0b94a6a07e8962cdbd197cebfb69e92978190012276d595be78000aec8035ed294f67e74660666c9f7476cacb87ca6937e4971b2ff3488c94b8c98bc287aa4cc

data/app/assets/javascripts/govuk_publishing_components/components/option-select.js

@@ -251,6 +251,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
 
   OptionSelect.prototype.setContainerHeight = function setContainerHeight (height) {
     this.$optionsContainer.style.height = height + 'px'
+    this.$optionsContainer.style.maxHeight = height + 'px'
   }
 
   OptionSelect.prototype.isCheckboxVisible = function isCheckboxVisible (option) {
@@ -295,12 +296,12 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
     var isComponentParentHidden = this.isComponentParentHidden()
 
     if (isComponentParentHidden) {
-      initialOptionContainerHeight = 200
-      height = 200
+      initialOptionContainerHeight = 180
+      height = 180
     }
 
     // Resize if the list is only slightly bigger than its container
-    // If isComponentParentHidden is true, then 200 < 250
+    // If isComponentParentHidden is true, then 180 < 250
     // And the container height is always set to 201px
     if (height < initialOptionContainerHeight + 50) {
       this.setContainerHeight(height + 1)

data/app/assets/javascripts/govuk_publishing_components/lib/filter-list.js

@@ -0,0 +1,48 @@
+window.GOVUK = window.GOVUK || {}
+window.GOVUK.Modules = window.GOVUK.Modules || {};
+
+(function (Modules) {
+  'use strict'
+
+  function FilterList (module) {
+    this.module = module
+    this.items = this.module.querySelectorAll('[data-filter-item]')
+    this.labelText = this.module.getAttribute('data-filter-label') || 'Filter list'
+  }
+
+  FilterList.prototype.init = function () {
+    if (this.items.length) {
+      this.appendFilterInput()
+    }
+  }
+
+  FilterList.prototype.appendFilterInput = function () {
+    const form = document.createElement('div')
+    form.classList.add('govuk-form-group')
+    form.innerHTML = `
+      <label for="filterInput" class="gem-c-label govuk-label">${this.labelText}</label>
+      <input class="gem-c-input govuk-input" id="filterInput" name="name" spellcheck="false" type="text">
+    `
+    this.module.prepend(form)
+    const input = form.querySelector('.govuk-input')
+    input.addEventListener('submit', function (e) { e.preventDefault() })
+    input.addEventListener('input', this.filterList.bind(this))
+  }
+
+  FilterList.prototype.filterList = function (e) {
+    const searchTerm = e.srcElement.value
+
+    for (var i = 0; i < this.items.length; i++) {
+      const item = this.items[i]
+      const text = item.innerText.toLowerCase()
+
+      if (text.includes(searchTerm.toLowerCase())) {
+        item.classList.remove('govuk-!-display-none')
+      } else {
+        item.classList.add('govuk-!-display-none')
+      }
+    }
+  }
+
+  Modules.FilterList = FilterList
+})(window.GOVUK.Modules)