@hydrogen-design-system/system/dist/import/0042/components/alert/scripts/alert.js

Hydrogen's full design system and component library.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.h2AlertHideHandler = h2AlertHideHandler;
exports.h2AlertShowHandler = h2AlertShowHandler;
exports.h2AlertToggleHandler = h2AlertToggleHandler;
exports.h2AlertToggleEvent = h2AlertToggleEvent;
exports.h2AlertToggle = h2AlertToggle;

// Hydrogen / Component / Module JS
// This file is designed to be the location in which all scripting for the component's functionality exists. This file should export all relevant functionality so that it can be imported by Hydrogen and other systems.
// Development Notes:
// - please ensure all functions are defined with "" at the end of their name.
// - please ensure all references to the parent component's selector also include "" (e.g. [data-h2-accordion])
//   This is so that when the component is built, it produces a version-locked set of code that can me manually imported to override newer versions.
// - please ensure that when event listeners are added to a trigger, that the script is checking for the system variable (see an example below).
// System Check Script
function h2AlertSystemCheck(version, target, targetComponentType, targetComponentTrigger, errorMessage) {
  var triggers = [];

  if (target == "all") {
    // Determine where the module is being loaded from. If the module is being loaded from the system, the event should only be applied to the component when it exists within the system's enabler selector (data-h2-system). This check ensures that any code that is loaded by the system is instanced and can be overridden by previous versions if need be.
    if (version == "latest") {
      if (targetComponentTrigger != null) {
        triggers = document.querySelectorAll(targetComponentType + " " + targetComponentTrigger);
        return triggers;
      } else {
        triggers = document.querySelectorAll(targetComponentType);
        return triggers;
      }
    } else if (version == null || version == false || version == "") {
      console.log("Hydrogen (" + errorMessage + "): no version value has been specified. Please specify \"latest\" or a version number.");
      return false;
    } else {
      var components = [];

      if (targetComponentTrigger != null) {
        components = document.querySelectorAll(targetComponentType + " " + targetComponentTrigger);
      } else {
        components = document.querySelectorAll(targetComponentType);
      }

      components.forEach(function (component) {
        if (component.closest("[data-h2-system]").getAttribute("data-h2-system") == version) {
          triggers.push(component);
        }
      });

      if (triggers.length == 0) {
        console.log("Hydrogen (" + errorMessage + "): no components were found within the system version you've specified. Please double check the version value being passed matches the version of the system installation on your project.");
        return false;
      } else {
        return triggers;
      }
    }
  } else if (target == null || target == false || target == "") {
    console.log("Hydrogen (" + errorMessage + "): no target has been specified. Please pass an HTMLelement object, a NodeList of elements, or \"all\".");
    return false;
  } else {
    // Check to see if the target is an HTMLelement object.
    if (target.nodeType == Node.ELEMENT_NODE) {
      if (targetComponentTrigger != null) {
        triggers.push(target.querySelector(targetComponentTrigger));
        return triggers;
      } else {
        triggers.push(target);
        return triggers;
      }
    } else {
      // Check to see if the target is a NodeList.
      if (NodeList.prototype.isPrototypeOf(target) == true) {
        target.forEach(function (trigger) {
          if (targetComponentTrigger != null) {
            triggers.push(trigger.querySelector(targetComponentTrigger));
          } else {
            triggers.push(trigger);
          }
        });
        return triggers;
      } else {
        // The target isn't a usable value.
        console.log("Hydrogen (" + errorMessage + "): you've passed an invalid target format. Targets must be a valid HTMLelement object or NodeList of elements.");
        return false;
      }
    }
  }
} // Handler


function h2AlertHideHandler(alert) {
  alert.classList.add("h2-dismissed");
  alert.setAttribute("aria-hidden", true);
}

function h2AlertShowHandler(alert) {
  alert.classList.remove("h2-dismissed");
  alert.setAttribute("aria-hidden", false);
}

function h2AlertToggleHandler(alert) {
  // Check to see if the alert is active or hidden.
  if (alert.classList.contains("h2-dismissed")) {
    h2AlertShowHandler(alert);
  } else {
    h2AlertHideHandler(alert);
  }
} // Event


function h2AlertToggleEvent(e) {
  // Get the alerts's trigger.
  var trigger = e.currentTarget; // Get the alert itself.

  var alert = trigger.closest("[data-h2-alert]"); // Prevent the trigger's default behaviour.

  e.preventDefault(); // Check to see if the alert has been manually disabled.

  if (alert.hasAttribute("data-h2-no-js") == false) {
    // Activate the alert.
    h2AlertToggleHandler(alert);
  }
} // Event Listener


function h2AlertToggle(targetAlerts) {
  var systemVersion = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "latest";
  // Set the system version check variables.
  var targetComponentType = "[data-h2-alert]";
  var targetComponentTrigger = "[data-h2-alert-dismissal-trigger]";
  var errorMessage = "Alert / Event Listener Script"; // Run the system version check.

  var alerts = h2AlertSystemCheck(systemVersion, targetAlerts, targetComponentType, targetComponentTrigger, errorMessage); // Loop through the triggers, and add the event trigger script.

  if (alerts != false) {
    alerts.forEach(function (alert) {
      // Check to see if the dismissal trigger exists.
      if (alert != null) {
        alert.removeEventListener("click", h2AlertToggleEvent);
        alert.addEventListener("click", h2AlertToggleEvent);
      }
    });
  }
} // Exports