katalyst-koi 4.18.0 → 4.19.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: feb798fc8f8baf7c9b7e78269e46c510d04c5e345ed7f605490fab898f2428ec
-  data.tar.gz: 7be3b6e4c9de2969f6118283004bef6d511cddf2fd2277886fdafbdd54177700
+  metadata.gz: ade3236f89d6ce47ecd5c365e7f47897f3b520983168a674ce14681ccadb805b
+  data.tar.gz: 54cfce0d885a190456ef78f72d7db89d8c9078e5cead1a62ae7c8d9459523f58
 SHA512:
-  metadata.gz: '088d74784a4b12c90295467d4d5d3ef0baea13e66bc34cce1f1237ebc8ced0696711d77cd4333b5d9245edeaeaaa1c67236027facaa9ab37642ece2dfdd33245'
-  data.tar.gz: 348b7140826626abc87d0f421c15c43a8d2e36dc7fc792b5756dcb2f877412af2204f49042d6ef416b9dda8e65399377d8ecfb5f6127dce3480c935665f4d59e
+  metadata.gz: 0d7d676ab5aaada95ad72039a4942e4768e1a8b3dc958557768ae2e9a2250a67ddc4c9b0e10561e441b8e5ed415ca808f5967638eafcd953a385f94064f5481c
+  data.tar.gz: 1fbf60e25099b5ae5fc9c1794b85347d7983b412eb304432fd597dd003699e98751c9114e994659e3c7f570b49c2a01315c6c544e6dcf06367244d3a5c461fd4

data/app/assets/builds/katalyst/koi.esm.js

@@ -0,0 +1,518 @@
+import '@hotwired/turbo-rails';
+import govuk, { initAll } from '@katalyst/govuk-formbuilder';
+import '@rails/actiontext';
+import 'trix';
+import { Application, Controller } from '@hotwired/stimulus';
+import content from '@katalyst/content';
+import navigation from '@katalyst/navigation';
+import tables from '@katalyst/tables';
+
+const application = Application.start();
+
+class ClipboardController extends Controller {
+  static targets = ["source"];
+
+  static classes = ["supported"];
+
+  connect() {
+    if ("clipboard" in navigator) {
+      this.element.classList.add(this.supportedClass);
+    }
+  }
+
+  copy(event) {
+    event.preventDefault();
+    navigator.clipboard.writeText(this.sourceTarget.value);
+
+    this.element.classList.add("copied");
+    setTimeout(() => {
+      this.element.classList.remove("copied");
+    }, 2000);
+  }
+}
+
+class FlashController extends Controller {
+  close(e) {
+    e.target.closest("li").remove();
+
+    // remove the flash container if there are no more flashes
+    if (this.element.children.length === 0) {
+      this.element.remove();
+    }
+  }
+}
+
+class KeyboardController extends Controller {
+  static values = {
+    mapping: String,
+    depth: { type: Number, default: 2 },
+  };
+
+  event(cause) {
+    if (isFormField(cause.target) || this.#ignore(cause)) return;
+
+    const key = this.describeEvent(cause);
+
+    this.buffer = [...(this.buffer || []), key].slice(0 - this.depthValue);
+
+    // test whether the tail of the buffer matches any of the configured chords
+    const action = this.buffer.reduceRight((mapping, key) => {
+      if (typeof mapping === "string" || typeof mapping === "undefined") {
+        return mapping;
+      } else {
+        return mapping[key];
+      }
+    }, this.mappings);
+
+    // if we don't have a string we may have a miss or an incomplete chord
+    if (typeof action !== "string") return;
+
+    // clear the buffer and prevent the key from being consumed elsewhere
+    this.buffer = [];
+    cause.preventDefault();
+
+    // fire the configured event
+    const event = new CustomEvent(action, {
+      detail: { cause: cause },
+      bubbles: true,
+    });
+    cause.target.dispatchEvent(event);
+  }
+
+  /**
+   * @param event KeyboardEvent input event to describe
+   * @return String description of keyboard event, e.g. 'C-KeyV' (CTRL+V)
+   */
+  describeEvent(event) {
+    return [
+      event.ctrlKey && "C",
+      event.metaKey && "M",
+      event.altKey && "A",
+      event.shiftKey && "S",
+      event.code,
+    ]
+      .filter((w) => w)
+      .join("-");
+  }
+
+  /**
+   * Build a tree for efficiently looking up key chords, where the last key in the sequence
+   * is the first key in tree.
+   */
+  get mappings() {
+    const inputs = this.mappingValue
+      .replaceAll(/\s+/g, " ")
+      .split(" ")
+      .filter((f) => f.length > 0);
+    const mappings = {};
+
+    inputs.forEach((mapping) => this.#parse(mappings, mapping));
+
+    // memoize the result
+    Object.defineProperty(this, "mappings", {
+      value: mappings,
+      writable: false,
+    });
+
+    return mappings;
+  }
+
+  /**
+   * Parse a key chord pattern and an event and store it in the inverted tree lookup structure.
+   *
+   * @param mappings inverted tree lookup for key chords
+   * @param mapping input definition, e.g. "C-KeyC+C-KeyV->paste"
+   */
+  #parse(mappings, mapping) {
+    const [pattern, event] = mapping.split("->");
+    const keys = pattern.split("+");
+    const first = keys.shift();
+
+    mappings = keys.reduceRight(
+      (mappings, key) => (mappings[key] ||= {}),
+      mappings,
+    );
+    mappings[first] = event;
+  }
+
+  /**
+   * Ignore modifier keys, as they will be captured in normal key presses.
+   *
+   * @param event KeyboardEvent
+   * @returns {boolean} true if key event should be ignored
+   */
+  #ignore(event) {
+    switch (event.code) {
+      case "ControlLeft":
+      case "ControlRight":
+      case "MetaLeft":
+      case "MetaRight":
+      case "ShiftLeft":
+      case "ShiftRight":
+      case "AltLeft":
+      case "AltRight":
+        return true;
+      default:
+        return false;
+    }
+  }
+}
+
+/**
+ * Detect input nodes where we should not listen for events.
+ *
+ * Credit: github.com
+ */
+function isFormField(element) {
+  if (!(element instanceof HTMLElement)) {
+    return false;
+  }
+
+  const name = element.nodeName.toLowerCase();
+  const type = (element.getAttribute("type") || "").toLowerCase();
+  return (
+    name === "select" ||
+    name === "textarea" ||
+    name === "trix-editor" ||
+    (name === "input" &&
+      type !== "submit" &&
+      type !== "reset" &&
+      type !== "checkbox" &&
+      type !== "radio" &&
+      type !== "file") ||
+    element.isContentEditable
+  );
+}
+
+class ModalController extends Controller {
+  static targets = ["dialog"];
+
+  connect() {
+    this.element.addEventListener("turbo:submit-end", this.onSubmit);
+  }
+
+  disconnect() {
+    this.element.removeEventListener("turbo:submit-end", this.onSubmit);
+  }
+
+  outside(e) {
+    if (e.target.tagName === "DIALOG") this.dismiss();
+  }
+
+  dismiss() {
+    if (!this.dialogTarget) return;
+    if (!this.dialogTarget.open) this.dialogTarget.close();
+
+    this.element.removeAttribute("src");
+    this.dialogTarget.remove();
+  }
+
+  dialogTargetConnected(dialog) {
+    dialog.showModal();
+  }
+
+  onSubmit = (event) => {
+    if (
+      event.detail.success &&
+      "closeDialog" in event.detail.formSubmission?.submitter?.dataset
+    ) {
+      this.dialogTarget.close();
+      this.element.removeAttribute("src");
+      this.dialogTarget.remove();
+    }
+  };
+}
+
+class NavigationController extends Controller {
+  static targets = ["filter"];
+
+  filter() {
+    const filter = this.filterTarget.value;
+    this.clearFilter(filter);
+
+    if (filter.length > 0) {
+      this.applyFilter(filter);
+    }
+  }
+
+  go() {
+    this.element.querySelector("li:not([hidden]) > a").click();
+  }
+
+  clear() {
+    if (this.filterTarget.value.length === 0) this.filterTarget.blur();
+  }
+
+  applyFilter(filter) {
+    // hide items that don't match the search filter
+    this.links
+      .filter(
+        (li) =>
+          !this.prefixSearch(filter.toLowerCase(), li.innerText.toLowerCase()),
+      )
+      .forEach((li) => {
+        li.toggleAttribute("hidden", true);
+      });
+
+    this.menus
+      .filter((li) => !li.matches("li:has(li:not([hidden]) > a)"))
+      .forEach((li) => {
+        li.toggleAttribute("hidden", true);
+      });
+  }
+
+  clearFilter(filter) {
+    this.element.querySelectorAll("li").forEach((li) => {
+      li.toggleAttribute("hidden", false);
+    });
+  }
+
+  prefixSearch(needle, haystack) {
+    const haystackLength = haystack.length;
+    const needleLength = needle.length;
+    if (needleLength > haystackLength) {
+      return false;
+    }
+    if (needleLength === haystackLength) {
+      return needle === haystack;
+    }
+    outer: for (let i = 0, j = 0; i < needleLength; i++) {
+      const needleChar = needle.charCodeAt(i);
+      if (needleChar === 32) {
+        // skip ahead to next space in the haystack
+        while (j < haystackLength && haystack.charCodeAt(j++) !== 32) {}
+        continue;
+      }
+      while (j < haystackLength) {
+        if (haystack.charCodeAt(j++) === needleChar) continue outer;
+        // skip ahead to the next space in the haystack
+        while (j < haystackLength && haystack.charCodeAt(j++) !== 32) {}
+      }
+      return false;
+    }
+    return true;
+  }
+
+  toggle() {
+    this.element.open ? this.close() : this.open();
+  }
+
+  open() {
+    if (!this.element.open) this.element.showModal();
+  }
+
+  close() {
+    if (this.element.open) this.element.close();
+  }
+
+  click(e) {
+    if (e.target === this.element) this.close();
+  }
+
+  onMorphAttribute = (e) => {
+    if (e.target !== this.element) return;
+
+    switch (e.detail.attributeName) {
+      case "open":
+        e.preventDefault();
+    }
+  };
+
+  get links() {
+    return Array.from(this.element.querySelectorAll("li:has(> a)"));
+  }
+
+  get menus() {
+    return Array.from(this.element.querySelectorAll("li:has(> ul)"));
+  }
+}
+
+class NavigationToggleController extends Controller {
+  trigger() {
+    this.dispatch("toggle", { prefix: "navigation", bubbles: true });
+  }
+}
+
+class PagyNavController extends Controller {
+  connect() {
+    document.addEventListener("shortcut:page-prev", this.prevPage);
+    document.addEventListener("shortcut:page-next", this.nextPage);
+  }
+
+  disconnect() {
+    document.removeEventListener("shortcut:page-prev", this.prevPage);
+    document.removeEventListener("shortcut:page-next", this.nextPage);
+  }
+
+  nextPage = () => {
+    this.element.querySelector("a:last-child").click();
+  };
+
+  prevPage = () => {
+    this.element.querySelector("a:first-child").click();
+  };
+}
+
+/**
+ * Connect an input (e.g. title) to slug.
+ */
+class SluggableController extends Controller {
+  static targets = ["source", "slug"];
+  static values = {
+    slug: String,
+  };
+
+  sourceChanged(e) {
+    if (this.slugValue === "") {
+      this.slugTarget.value = parameterize(this.sourceTarget.value);
+    }
+  }
+
+  slugChanged(e) {
+    this.slugValue = this.slugTarget.value;
+  }
+}
+
+function parameterize(input) {
+  return input
+    .toLowerCase()
+    .replace(/'/g, "-")
+    .replace(/[^-\w\s]/g, "")
+    .replace(/[^a-z0-9]+/g, "-")
+    .replace(/(^-|-$)/g, "");
+}
+
+class WebauthnAuthenticationController extends Controller {
+  static targets = ["response"];
+  static values = {
+    options: Object,
+  };
+
+  async authenticate() {
+    const credential = await navigator.credentials.get(this.options);
+
+    this.responseTarget.value = JSON.stringify(credential.toJSON());
+
+    this.element.requestSubmit();
+  }
+
+  get options() {
+    return {
+      publicKey: PublicKeyCredential.parseRequestOptionsFromJSON(
+        this.optionsValue,
+      ),
+    };
+  }
+}
+
+class WebauthnRegistrationController extends Controller {
+  static targets = ["response"];
+  static values = {
+    options: Object,
+  };
+
+  submit(e) {
+    if (this.responseTarget.value) return;
+
+    e.preventDefault();
+    this.createCredential().then(() => {
+      e.target.submit();
+    });
+  }
+
+  async createCredential() {
+    const credential = await navigator.credentials.create(this.options);
+    this.responseTarget.value = JSON.stringify(credential.toJSON());
+  }
+
+  get options() {
+    return {
+      publicKey: PublicKeyCredential.parseCreationOptionsFromJSON(
+        this.optionsValue,
+      ),
+    };
+  }
+}
+
+application.load(content);
+application.load(govuk);
+application.load(navigation);
+application.load(tables);
+
+const Definitions = [
+  {
+    identifier: "clipboard",
+    controllerConstructor: ClipboardController,
+  },
+  {
+    identifier: "flash",
+    controllerConstructor: FlashController,
+  },
+  {
+    identifier: "keyboard",
+    controllerConstructor: KeyboardController,
+  },
+  {
+    identifier: "modal",
+    controllerConstructor: ModalController,
+  },
+  {
+    identifier: "navigation",
+    controllerConstructor: NavigationController,
+  },
+  {
+    identifier: "navigation-toggle",
+    controllerConstructor: NavigationToggleController,
+  },
+  {
+    identifier: "pagy-nav",
+    controllerConstructor: PagyNavController,
+  },
+  {
+    identifier: "sluggable",
+    controllerConstructor: SluggableController,
+  },
+  {
+    identifier: "webauthn-authentication",
+    controllerConstructor: WebauthnAuthenticationController,
+  },
+  {
+    identifier: "webauthn-registration",
+    controllerConstructor: WebauthnRegistrationController,
+  },
+];
+
+// dynamically attempt to load hw_combobox_controller, this is an optional dependency
+await import('controllers/hw_combobox_controller')
+  .then(({ default: HwComboboxController }) => {
+    Definitions.push({
+      identifier: "hw-combobox",
+      controllerConstructor: HwComboboxController,
+    });
+  })
+  .catch(() => null);
+
+application.load(Definitions);
+
+class KoiToolbarElement extends HTMLElement {
+  constructor() {
+    super();
+
+    this.setAttribute("role", "toolbar");
+  }
+}
+
+customElements.define("koi-toolbar", KoiToolbarElement);
+
+/** Initialize GOVUK */
+function initGOVUK() {
+  document.body.classList.toggle("js-enabled", true);
+  document.body.classList.toggle(
+    "govuk-frontend-supported",
+    "noModule" in HTMLScriptElement.prototype,
+  );
+  initAll();
+}
+
+window.addEventListener("turbo:load", initGOVUK);
+if (window.Turbo) initGOVUK();