@itcenteratunihelsinki/huds-lib 0.8.43 → 0.8.44

package/components/hy-content-list-item2.js

@@ -0,0 +1,109 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { c as CourseVariants, d as CourseStateVariants } from './utils.js';
+import { j as jsonParserWorker } from './globalScript.js';
+import { d as defineCustomElement$2 } from './icon.js';
+import { d as defineCustomElement$1 } from './hy-tag2.js';
+
+const hyContentListItemCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}hy-content-list-item{background:radial-gradient(circle, #f8f8f8 0%, #f5f5f5 100%);cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;margin-bottom:16px;position:relative}@media (min-width: 30rem){hy-content-list-item{margin-bottom:24px}}hy-content-list-item[variant=row],hy-content-list-item.row{max-width:100%;padding:21px 0 60px 12px;width:100%}@media (min-width: 30rem){hy-content-list-item[variant=row],hy-content-list-item.row{padding:21px 0 12px 24px}}@media (min-width: 60rem){hy-content-list-item[variant=row],hy-content-list-item.row{margin-bottom:16px}}hy-content-list-item.grid{max-width:100%;padding:21px 0 60px 12px;width:100%}@media (min-width: 30rem){hy-content-list-item.grid{margin-right:var(--gutter-medium);max-width:calc(((100% - var(--gutter-medium) * 11) / 12) * 6 + var(--gutter-medium) * 5);padding:21px 0 60px 12px;width:calc(((100% - var(--gutter-medium) * 11) / 12) * 6 + var(--gutter-medium) * 5)}}@media (min-width: 60rem){hy-content-list-item.grid{margin-bottom:27px;margin-right:var(--gutter-wide);max-width:calc(((100% - var(--gutter-wide) * 11) / 12) * 4 + var(--gutter-wide) * 3);width:calc(((100% - var(--gutter-wide) * 11) / 12) * 4 + var(--gutter-wide) * 3)}}@media (min-width: 75.0625rem){hy-content-list-item.grid{margin-bottom:32px;margin-right:var(--gutter-extrawide);max-width:calc(((100% - var(--gutter-extrawide) * 11) / 12) * 4 + var(--gutter-extrawide) * 3);width:calc(((100% - var(--gutter-extrawide) * 11) / 12) * 4 + var(--gutter-extrawide) * 3)}}@media (min-width: 30rem){hy-content-list-item.grid:nth-of-type(2n+0){margin-right:0}}@media (min-width: 60rem){hy-content-list-item.grid:nth-of-type(2n+0){margin-right:var(--gutter-wide)}}@media (min-width: 75.0625rem){hy-content-list-item.grid:nth-of-type(2n+0){margin-right:var(--gutter-extrawide)}}@media (min-width: 60rem){hy-content-list-item.grid:nth-of-type(3n+0){margin-right:0}}.hy-content-list-item{font-family:var(--main-font-family);position:relative;width:100%}.hy-content-list-item a{text-decoration:none}.hy-content-list-item--container{cursor:pointer}.hy-content-list-item--item-name{color:var(--link-blue);font-size:1.25rem;line-height:24px;font-weight:700;letter-spacing:-0.6px;margin-bottom:16px;word-break:break-word}.hy-content-list-item--item-name--past-courses{color:var(--grayscale-dark)}.hy-content-list-item--metadata{font-size:0.875rem;line-height:16px;font-weight:600;color:var(--grayscale-black);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;letter-spacing:-0.44px;line-height:16px;margin-bottom:19px;padding-bottom:0}.hy-content-list-item--metadata--item{padding-bottom:6px}@media (min-width: 30rem){.hy-content-list-item--metadata{padding-bottom:1rem}}@media (min-width: 75.0625rem){.hy-content-list-item--metadata{padding-bottom:0}}.hy-content-list-item--metadata--item:after{content:\"|\";padding:0 8px}.hy-content-list-item--metadata--item--last:after{content:\" \"}.hy-content-list-item .cancelled span{font-size:0.75rem;line-height:12px;font-weight:700;background-color:var(--additional-red-light);color:var(--grayscale-white);letter-spacing:-0.5px;padding:6px 8px;text-transform:uppercase}.hy-content-list-item .cancelled--past-courses span{background-color:var(--grayscale-dark)}.hy-content-list-item .cancelled:not(.mobile){display:none}.hy-content-list-item .cancelled.mobile{bottom:-50px;display:block;margin:0;padding-bottom:12px;position:absolute}@media (min-width: 30rem){.hy-content-list-item .cancelled{margin-right:8px}.hy-content-list-item .cancelled.mobile{display:none}.hy-content-list-item .cancelled:not(.mobile){display:block}}.hy-content-list-item--link{position:absolute;right:-6px}.hy-content-list-item--link a{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;text-decoration:none}.hy-content-list-item--link a .label{font-size:1rem;line-height:16px;font-weight:700;color:var(--link-blue);letter-spacing:-0.5px;line-height:16px;margin-right:8px;text-align:right}.hy-content-list-item--link a .icon-wrapper{background-color:var(--brand-main-light);z-index:10}.hy-content-list-item--link a .icon-wrapper .icon{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);position:relative;overflow:hidden}.hy-content-list-item--link a .icon-wrapper .icon svg{background-color:transparent;-webkit-box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.1);box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.1);fill:var(--grayscale-white);padding:10.29px}.hy-content-list-item.row .hy-content-list-item--link{bottom:-60px;padding-bottom:12px}@media (min-width: 30rem){.hy-content-list-item.row .hy-content-list-item--link{bottom:0;padding-bottom:0}}.hy-content-list-item.row .hy-content-list-item--tags{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:wrap;flex-wrap:wrap}@media (min-width: 60rem){.hy-content-list-item.row .hy-content-list-item--tags{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;padding-right:200px}}.hy-content-list-item.grid .hy-content-list-item--link{bottom:-60px;padding-bottom:12px}.hy-content-list-item.grid .hy-content-list-item--tags{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:wrap;flex-wrap:wrap}";
+
+let keys = {
+  enter: "Enter",
+};
+const HyContentLstItem = /*@__PURE__*/ proxyCustomElement(class HyContentLstItem extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.variant = CourseVariants.default;
+    this.stateVariant = CourseStateVariants.default;
+    this.courseCode = undefined;
+    this.courseName = undefined;
+    this.isCancelled = undefined;
+    this.cancelledLabel = "Cancelled";
+    this.courseCredits = undefined;
+    this.courseTags = undefined;
+    this.courseStartDate = undefined;
+    this.courseEndDate = undefined;
+    this.formattedTimeRange = undefined;
+    this.courseStudyFormat = undefined;
+    this.courseOrganisation = undefined;
+    this.courseEnrollmentLink = undefined;
+    this.courseTeachingLanguage = undefined;
+    this.courseLinkLabel = undefined;
+  }
+  async componentWillLoad() {
+    this._courseTags = await jsonParserWorker(this.courseTags);
+  }
+  handleKeyDown(event) {
+    const key = event.code;
+    if (key == keys.enter) {
+      let card = this.el;
+      window.open(card.dataset.location, "_blank", "noopener");
+    }
+  }
+  render() {
+    const classAttributes = [this.variant, "hy-content-list-item"].join(" ");
+    const target = "_blank";
+    const ariaLabel = "Link points outside the current website.";
+    const classItemName = [
+      "hy-content-list-item--item-name",
+      `hy-content-list-item--item-name--${this.stateVariant}`,
+    ].join(" ");
+    const classItemCancelled = ["cancelled", `cancelled--${this.stateVariant}`].join(" ");
+    return [
+      h("div", { class: classAttributes, tabindex: "0" }, h("div", { class: classItemName }, this.courseName), h("div", { class: "hy-content-list-item--metadata" }, this.isCancelled && (h("div", { class: classItemCancelled }, h("span", null, this.cancelledLabel))), h("div", { class: "hy-content-list-item--metadata--item hy-content-list-item--metadata--item--first" }, h("span", null, this.formattedTimeRange)), this.courseOrganisation
+        ? [
+          h("div", { class: "hy-content-list-item--metadata--item" }, h("span", null, this.courseStudyFormat)),
+          h("div", { class: "hy-content-list-item--metadata--item hy-content-list-item--metadata--item--last" }, h("span", null, this.courseOrganisation)),
+        ]
+        : [
+          h("div", { class: "hy-content-list-item--metadata--item hy-content-list-item--metadata--item--last" }, h("span", null, this.courseStudyFormat)),
+        ]), this._courseTags && this._courseTags.length > 0 && (h("div", { class: "hy-content-list-item--tags" }, this._courseTags.map((x) => {
+        return h("hy-tag", null, x.name);
+      }))), this.isCancelled && (h("div", { class: "cancelled mobile" }, h("span", null, this.cancelledLabel))), h("div", { class: "hy-content-list-item--link" }, h("a", { href: this.courseEnrollmentLink, target: target, "aria-label": ariaLabel, class: "hy-content-list-item--link--link", tabindex: "-1" }, h("span", { class: "label" }, this.courseLinkLabel), h("span", { class: "icon-wrapper" }, h("div", { class: "icon" }, h("hy-icon", { icon: "hy-icon-arrow-to-right", size: 40 })))))),
+    ];
+  }
+  get el() { return this; }
+  static get style() { return hyContentListItemCss; }
+}, [0, "hy-content-list-item", {
+    "variant": [1],
+    "stateVariant": [1, "state-variant"],
+    "courseCode": [1, "course-code"],
+    "courseName": [1, "course-name"],
+    "isCancelled": [4, "is-cancelled"],
+    "cancelledLabel": [1, "cancelled-label"],
+    "courseCredits": [1, "course-credits"],
+    "courseTags": [1, "course-tags"],
+    "courseStartDate": [1, "course-start-date"],
+    "courseEndDate": [1, "course-end-date"],
+    "formattedTimeRange": [1, "formatted-time-range"],
+    "courseStudyFormat": [1, "course-study-format"],
+    "courseOrganisation": [1, "course-organisation"],
+    "courseEnrollmentLink": [1, "course-enrollment-link"],
+    "courseTeachingLanguage": [1, "course-teaching-language"],
+    "courseLinkLabel": [1, "course-link-label"]
+  }, [[0, "keydown", "handleKeyDown"]]]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["hy-content-list-item", "hy-icon", "hy-tag"];
+  components.forEach(tagName => { switch (tagName) {
+    case "hy-content-list-item":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, HyContentLstItem);
+      }
+      break;
+    case "hy-icon":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+    case "hy-tag":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$1();
+      }
+      break;
+  } });
+}
+
+export { HyContentLstItem as H, defineCustomElement as d };

package/components/hy-content-list.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../dist/types/components";
+
+interface HyContentList extends Components.HyContentList, HTMLElement {}
+export const HyContentList: {
+  prototype: HyContentList;
+  new (): HyContentList;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/components/hy-content-list.js

@@ -0,0 +1,155 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { c as CourseVariants, d as CourseStateVariants } from './utils.js';
+import { d as defineCustomElement$4 } from './hy-content-list-item2.js';
+import { d as defineCustomElement$3 } from './icon.js';
+import { d as defineCustomElement$2 } from './hy-tag2.js';
+
+const hyContentListCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}:host{display:block}.hy-content-list{display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--main-font-family);-ms-flex-wrap:wrap;flex-wrap:wrap}.hy-content-list--no-result{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex}.hy-content-list--alert{margin-right:6px}.hy-content-list--alert svg{fill:var(--grayscale-dark)}@media (min-width: 1601px){.hy-content-list--alert svg{height:18px;width:18px}}@media (min-width: 87.5rem){.hy-content-list--alert--large svg{height:18px;width:18px}}.hy-content-list--alert-label{font-family:var(--main-font-family);font-size:0.9375rem;line-height:22px;color:var(--grayscale-dark);font-style:italic;letter-spacing:0}@media (min-width: 30rem){.hy-content-list--alert-label{font-size:1rem;line-height:24px}}@media (min-width: 1601px){.hy-content-list--alert-label{font-size:1.0625rem;line-height:26px}}@media (min-width: 87.5rem){.hy-content-list--alert-label--large{font-size:1.0625rem;line-height:26px}}.hy-content-list.row{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.hy-content-list.grid{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}";
+
+const HyContentList$1 = /*@__PURE__*/ proxyCustomElement(class HyContentList extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.variant = CourseVariants.default;
+    this.linkLabel = "Go to course page";
+    this.noResultLabel = "No courses scheduled at the moment";
+    this.creditsLabel = "cr";
+    this.cancelledLabel = "Cancelled";
+    this.dataItems = undefined;
+    this.headerstyle = "common";
+    this.courseStateVariant = CourseStateVariants.default;
+    this.courseRealisations = [];
+  }
+  /**
+   * Data for links to be displayed.
+   */
+  dataWatcher(data) {
+    this._dataItems = typeof data === "string" ? JSON.parse(data) : data;
+  }
+  componentWillLoad() {
+    this.dataWatcher(this.dataItems);
+  }
+  handleCardClick(e, id) {
+    e.preventDefault();
+    let card = this.el.querySelector(`#${id}`);
+    if (card) {
+      window.open(card.dataset.location, "_blank");
+    }
+  }
+  async componentDidLoad() {
+    let hyMainDiv = this.el.closest(".hy-main");
+    if (hyMainDiv) {
+      if (!hyMainDiv.classList.contains("with-sidebar")) {
+        this.headerstyle = "large";
+      }
+    }
+  }
+  renderItems() {
+    let courseRealisations = [];
+    if (this._dataItems && this._dataItems.length > 0) {
+      this._dataItems.forEach((item) => {
+        const courseObject = JSON.parse(JSON.stringify(item));
+        const courseListType = courseObject["courseListType"];
+        this.variant = courseListType == "list" ? CourseVariants.row : CourseVariants.grid;
+        for (const courseProperty in courseObject) {
+          if (courseProperty == "courseListType")
+            continue;
+          const courseItem = courseObject[courseProperty];
+          const courseCode = courseItem["code"];
+          const courseCredits = courseItem["credits"];
+          // Course realisations.
+          if (courseItem["realisations"]) {
+            const realisations = JSON.parse(JSON.stringify(courseItem["realisations"]));
+            for (const realisationProperty in realisations) {
+              const realizationItem = realisations[realisationProperty];
+              const courseRealisationName = realizationItem["name"];
+              const courseRealisationFullName = courseRealisationName + ", " + courseCredits + " " + this.creditsLabel;
+              const courseStudyFormat = realizationItem["studyFormat"];
+              const courseCancelled = realizationItem["cancelled"];
+              const courseStartDate = realizationItem["startDate"];
+              const courseEndDate = realizationItem["endDate"];
+              const formattedTimeRange = realizationItem["formattedTimeRange"];
+              const courseEnrollmentLink = realizationItem["enrolmentLink"];
+              const courseTeachingLanguage = realizationItem["teachingLanguage"];
+              const courseOrganisation = realizationItem["organisation"];
+              let courseTags = [];
+              if (realizationItem["tags"]) {
+                let tags = JSON.parse(JSON.stringify(realizationItem["tags"]));
+                for (let z in tags) {
+                  let tagItem = { name: tags[z] };
+                  courseTags.push(tagItem);
+                }
+              }
+              const courseTagsJSON = JSON.stringify(courseTags);
+              const contentListItemClassAttributes = ["item", this.variant].join(" ");
+              courseRealisations.push(h("hy-content-list-item", { id: realisationProperty, class: contentListItemClassAttributes, variant: this.variant, "state-variant": this.courseStateVariant, "course-code": courseCode, "course-name": courseRealisationFullName, "is-cancelled": courseCancelled, "cancelled-label": this.cancelledLabel, "course-credits": courseCredits, "course-tags": courseTagsJSON, "course-start-date": courseStartDate, "course-end-date": courseEndDate, "formatted-time-range": formattedTimeRange, "course-study-format": courseStudyFormat, "course-organisation": courseOrganisation, "course-enrollment-link": courseEnrollmentLink, "course-teaching-language": courseTeachingLanguage, "course-link-label": this.linkLabel, "data-location": courseEnrollmentLink, onClick: (e) => this.handleCardClick(e, realisationProperty) }));
+            }
+          }
+        }
+      });
+    }
+    return courseRealisations;
+  }
+  render() {
+    const classAttributes = [this.variant, "hy-content-list"].join(" ");
+    const classAlertAttributes = ["hy-content-list--alert", `hy-content-list--alert--${this.headerstyle}`].join(" ");
+    const classAlertLabelAttributes = [
+      "hy-content-list--alert-label",
+      `hy-content-list--alert-label--${this.headerstyle}`,
+    ].join(" ");
+    this.courseRealisations = this.renderItems();
+    if (this.courseRealisations && this.courseRealisations.length > 0) {
+      return (h(Host, null, h("div", { class: classAttributes }, this.courseRealisations)));
+    }
+    else {
+      return (h(Host, null, h("div", { class: classAttributes }, h("div", { class: "hy-content-list--no-result" }, h("span", { class: classAlertAttributes }, h("hy-icon", { icon: "hy-icon-info", size: 16 })), h("span", { class: classAlertLabelAttributes }, this.noResultLabel)))));
+    }
+  }
+  get el() { return this; }
+  static get watchers() { return {
+    "dataItems": ["dataWatcher"]
+  }; }
+  static get style() { return hyContentListCss; }
+}, [0, "hy-content-list", {
+    "linkLabel": [1, "link-label"],
+    "noResultLabel": [1, "no-result-label"],
+    "creditsLabel": [1, "credits-label"],
+    "cancelledLabel": [1, "cancelled-label"],
+    "dataItems": [1, "data-items"],
+    "headerstyle": [1],
+    "courseStateVariant": [1, "course-state-variant"],
+    "courseRealisations": [32]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["hy-content-list", "hy-content-list-item", "hy-icon", "hy-tag"];
+  components.forEach(tagName => { switch (tagName) {
+    case "hy-content-list":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, HyContentList$1);
+      }
+      break;
+    case "hy-content-list-item":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$4();
+      }
+      break;
+    case "hy-icon":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$3();
+      }
+      break;
+    case "hy-tag":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+  } });
+}
+
+const HyContentList = HyContentList$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { HyContentList, defineCustomElement };

package/components/hy-crisis-banner.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../dist/types/components";
+
+interface HyCrisisBanner extends Components.HyCrisisBanner, HTMLElement {}
+export const HyCrisisBanner: {
+  prototype: HyCrisisBanner;
+  new (): HyCrisisBanner;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/components/hy-crisis-banner.js

@@ -0,0 +1,47 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { d as defineCustomElement$2 } from './icon.js';
+
+const hyCrisisBannerCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}.hy-crisis-banner{-webkit-box-shadow:inset 0 -20px 20px -20px rgba(14, 104, 139, 0.1);box-shadow:inset 0 -20px 20px -20px rgba(14, 104, 139, 0.1);display:block}.hy-crisis-banner__container{display:-webkit-box;display:-ms-flexbox;display:flex;margin:0 auto;max-width:1216px}.hy-crisis-banner__indicator{background-color:var(--additional-yellow-light);-ms-flex-negative:0;flex-shrink:0}@media (min-width: 30rem){.hy-crisis-banner__indicator{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}}.hy-crisis-banner__indicator-icon{margin-left:8px;margin-right:8px;margin-top:10px}@media (min-width: 30rem){.hy-crisis-banner__indicator-icon{margin-left:10px;margin-right:10px;margin-top:0}}.hy-crisis-banner__indicator-icon svg{height:22px;width:22px}.hy-crisis-banner__indicator-icon svg circle{fill:var(--grayscale-white)}.hy-crisis-banner__indicator-icon svg path{fill:var(--additional-yellow-light)}.hy-crisis-banner__content-wrapper{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:12px 0 12px 12px}@media (min-width: 30rem){.hy-crisis-banner__content-wrapper{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;padding:14px 0 14px 14px}}@media (min-width: 60rem){.hy-crisis-banner__content-wrapper{padding:20px 0 20px 20px}}@media (min-width: 30rem){.hy-crisis-banner__content{max-width:61.22%;width:100%}}@media (min-width: 60rem){.hy-crisis-banner__content{max-width:65.83%}}@media (min-width: 75.0625rem){.hy-crisis-banner__content{max-width:65.79%}}.hy-crisis-banner__title{font-size:0.875rem;line-height:16px;font-weight:700;color:var(--grayscale-black);font-family:var(--main-font-family);letter-spacing:-0.35px;margin:0 0 2px 0}@media (min-width: 1601px){.hy-crisis-banner__title{font-size:1rem;line-height:18px;letter-spacing:-0.4px}}.hy-crisis-banner__description{font-size:0.75rem;line-height:14px;color:var(--grayscale-dark);font-family:var(--main-font-family);letter-spacing:-0.35px;margin:0}@media (min-width: 30rem){.hy-crisis-banner__description{font-size:0.875rem;line-height:16px}}.hy-crisis-banner__description p{margin-top:0}.hy-crisis-banner__description p:last-of-type{margin-bottom:0}.hy-crisis-banner__link{font-size:0.875rem;line-height:16px;font-weight:600;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--brand-main-light);display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--main-font-family);letter-spacing:-0.5px;margin:12px 0 0;overflow:hidden;text-decoration:none}@media (min-width: 30rem){.hy-crisis-banner__link{-ms-flex-negative:0;flex-shrink:0;margin-left:24px;margin-right:32px;margin-top:0;text-align:right}}@media (min-width: 75.0625rem){.hy-crisis-banner__link{margin-left:32px}}@media (min-width: 1601px){.hy-crisis-banner__link{font-size:1rem;line-height:18px}}.hy-crisis-banner__link:hover,.hy-crisis-banner__link:focus{color:var(--brand-main);text-decoration:underline}.hy-crisis-banner__link:hover .hy-crisis-banner__link-icon svg,.hy-crisis-banner__link:focus .hy-crisis-banner__link-icon svg{fill:var(--brand-main)}.hy-crisis-banner__link-icon{margin-left:4px}@media (min-width: 30rem){.hy-crisis-banner__link-icon{margin-left:8px}}@media (min-width: 75.0625rem){.hy-crisis-banner__link-icon{margin-left:12px}}.hy-crisis-banner__link-icon svg{fill:var(--brand-main-light);height:12px;width:12px}@media (min-width: 30rem){.hy-crisis-banner__link-icon svg{height:14px;width:14px}}@media (min-width: 1601px){.hy-crisis-banner__link-icon svg{height:16px;width:16px}}";
+
+const HyCrisisBanner$1 = /*@__PURE__*/ proxyCustomElement(class HyCrisisBanner extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.bannerTitle = undefined;
+    this.bannerDescription = undefined;
+    this.linkTitle = undefined;
+    this.linkUrl = undefined;
+  }
+  render() {
+    return (h(Host, { class: "hy-crisis-banner", role: "alert" }, h("div", { class: "hy-crisis-banner__container" }, h("div", { class: "hy-crisis-banner__indicator" }, h("hy-icon", { class: "hy-crisis-banner__indicator-icon", icon: "hy-icon-alert" })), h("div", { class: "hy-crisis-banner__content-wrapper" }, h("div", { class: "hy-crisis-banner__content" }, h("h3", { class: "hy-crisis-banner__title" }, this.bannerTitle), this.bannerDescription && (h("div", { class: "hy-crisis-banner__description", innerHTML: this.bannerDescription }))), this.linkUrl && (h("a", { class: "hy-crisis-banner__link", href: this.linkUrl }, this.linkTitle, h("hy-icon", { class: "hy-crisis-banner__link-icon", icon: "hy-icon-arrow-to-right" })))))));
+  }
+  static get style() { return hyCrisisBannerCss; }
+}, [0, "hy-crisis-banner", {
+    "bannerTitle": [1, "banner-title"],
+    "bannerDescription": [1, "banner-description"],
+    "linkTitle": [1, "link-title"],
+    "linkUrl": [1, "link-url"]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["hy-crisis-banner", "hy-icon"];
+  components.forEach(tagName => { switch (tagName) {
+    case "hy-crisis-banner":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, HyCrisisBanner$1);
+      }
+      break;
+    case "hy-icon":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+  } });
+}
+
+const HyCrisisBanner = HyCrisisBanner$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { HyCrisisBanner, defineCustomElement };

package/components/hy-cta-button.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../dist/types/components";
+
+interface HyCtaButton extends Components.HyCtaButton, HTMLElement {}
+export const HyCtaButton: {
+  prototype: HyCtaButton;
+  new (): HyCtaButton;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/components/hy-cta-button.js

@@ -0,0 +1,6 @@
+import { C as CtaButton, d as defineCustomElement$1 } from './cta-button.js';
+
+const HyCtaButton = CtaButton;
+const defineCustomElement = defineCustomElement$1;
+
+export { HyCtaButton, defineCustomElement };

package/components/hy-cta-link.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../dist/types/components";
+
+interface HyCtaLink extends Components.HyCtaLink, HTMLElement {}
+export const HyCtaLink: {
+  prototype: HyCtaLink;
+  new (): HyCtaLink;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/components/hy-cta-link.js

@@ -0,0 +1,6 @@
+import { C as CtaLink, d as defineCustomElement$1 } from './cta-link.js';
+
+const HyCtaLink = CtaLink;
+const defineCustomElement = defineCustomElement$1;
+
+export { HyCtaLink, defineCustomElement };

package/components/hy-docs-container.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../dist/types/components";
+
+interface HyDocsContainer extends Components.HyDocsContainer, HTMLElement {}
+export const HyDocsContainer: {
+  prototype: HyDocsContainer;
+  new (): HyDocsContainer;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/components/hy-docs-container.js

@@ -0,0 +1,32 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+
+const docsContainerCss = "div.hy-docs-container{display:block;margin:2rem 0}";
+
+const DocsContainer = /*@__PURE__*/ proxyCustomElement(class DocsContainer extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+  }
+  render() {
+    return (h("div", { class: "hy-docs-container" }, h("slot", null)));
+  }
+  static get style() { return docsContainerCss; }
+}, [4, "hy-docs-container"]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["hy-docs-container"];
+  components.forEach(tagName => { switch (tagName) {
+    case "hy-docs-container":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, DocsContainer);
+      }
+      break;
+  } });
+}
+
+const HyDocsContainer = DocsContainer;
+const defineCustomElement = defineCustomElement$1;
+
+export { HyDocsContainer, defineCustomElement };

package/components/hy-dropdown-panel-item.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../dist/types/components";
+
+interface HyDropdownPanelItem extends Components.HyDropdownPanelItem, HTMLElement {}
+export const HyDropdownPanelItem: {
+  prototype: HyDropdownPanelItem;
+  new (): HyDropdownPanelItem;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/components/hy-dropdown-panel-item.js

@@ -0,0 +1,6 @@
+import { H as HyDropdownPanelItem$1, d as defineCustomElement$1 } from './hy-dropdown.panel.item.js';
+
+const HyDropdownPanelItem = HyDropdownPanelItem$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { HyDropdownPanelItem, defineCustomElement };

package/components/hy-dropdown-panel.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../dist/types/components";
+
+interface HyDropdownPanel extends Components.HyDropdownPanel, HTMLElement {}
+export const HyDropdownPanel: {
+  prototype: HyDropdownPanel;
+  new (): HyDropdownPanel;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/components/hy-dropdown-panel.js

@@ -0,0 +1,6 @@
+import { H as HyDropdownPanel$1, d as defineCustomElement$1 } from './hy-dropdown.panel.js';
+
+const HyDropdownPanel = HyDropdownPanel$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { HyDropdownPanel, defineCustomElement };

package/components/hy-dropdown.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../dist/types/components";
+
+interface HyDropdown extends Components.HyDropdown, HTMLElement {}
+export const HyDropdown: {
+  prototype: HyDropdown;
+  new (): HyDropdown;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;