@pnx-mixtape/mxds 0.0.7 → 0.0.8

package/dist/build/in-page-navigation.entry.js

@@ -0,0 +1,89 @@
+import { m as makeAnchor, c as createElement } from "./chunks/utilities-B4YZb689.js";
+class InPageNavigation extends HTMLElement {
+  constructor() {
+    super();
+    this.handleClick = (target) => {
+      this.active = this.items.find((item) => item.link === target);
+      if (!this.links || !this.active) return;
+      this.links.forEach((link) => link.classList.remove("is-active"));
+      this.active.link.classList.add("is-active");
+    };
+    this.internals_ = this.attachInternals();
+    this.controller = new AbortController();
+    this.headingLevels = this.dataset?.headings || "h2";
+    this.items = [];
+  }
+  connectedCallback() {
+    if (!this.menu || !this.headings) return;
+    this.headings.forEach((heading) => {
+      const listItem = this.generateListItem(heading);
+      const link = this.generateAnchor(heading);
+      this.items.push({ link, heading });
+      listItem.appendChild(link);
+      this.menu?.appendChild(listItem);
+    });
+    const { signal } = this.controller;
+    this.menu.addEventListener(
+      "click",
+      (e) => {
+        const { target } = e;
+        if (!(target instanceof HTMLAnchorElement)) return;
+        this.handleClick(target);
+      },
+      {
+        signal
+      }
+    );
+  }
+  disconnectedCallback() {
+    if (!this.menu || !this.headings) return;
+    this.menu.textContent = "";
+    this.items = [];
+    this.controller.abort();
+  }
+  get menu() {
+    const menu = this.querySelector("ul, ol");
+    if (!menu) {
+      throw new Error(`${this.localName} must contain a <ul> or <ol> element.`);
+    }
+    return menu;
+  }
+  get container() {
+    const selector = this.getAttribute("data-content");
+    if (!selector) {
+      throw new Error(
+        `${this.localName} must have a [data-content] attribute that contains the content selector.`
+      );
+    }
+    return this.closest(selector) || this.parentElement.querySelector(selector);
+  }
+  get headings() {
+    return this.container?.querySelectorAll(this.headingLevels);
+  }
+  get links() {
+    return this.menu?.querySelectorAll("a");
+  }
+  generatedId(heading) {
+    const string = heading?.textContent?.trim();
+    return !string ? "" : makeAnchor(string);
+  }
+  generateAnchor(heading) {
+    const { textContent, id } = heading;
+    const linkText = heading.getAttribute("data-in-page-navigation-title") || textContent;
+    const targetID = id || this.generatedId(heading);
+    if (!id) heading.id = targetID;
+    const item = createElement(
+      `<a href="#${targetID}" class="mx-icon mx-icon--chevron-right">${linkText}</a>`
+    );
+    return item;
+  }
+  generateListItem(heading) {
+    const { tagName } = heading;
+    const item = createElement(
+      `<li class="mx-in-page-navigation__level--${tagName.toLowerCase()}"></li>`
+    );
+    return item;
+  }
+}
+customElements.define("mx-in-page-navigation", InPageNavigation);
+//# sourceMappingURL=in-page-navigation.entry.js.map

package/dist/build/in-page-navigation.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"in-page-navigation.entry.js","sources":["../../src/Component/InPageNavigation/Elements/InPageNavigation.ts"],"sourcesContent":["/**\n * DialogBase\n * @file Support opening/closing, and adding a scroll lock to the body.\n */\n\nimport { makeAnchor, createElement } from \"../../../Utility/utilities\"\n\nexport default class InPageNavigation extends HTMLElement {\n  internals_: ElementInternals\n  controller: AbortController\n  headingLevels: string\n  items: { link: HTMLAnchorElement; heading: HTMLHeadingElement }[]\n  active: { link: HTMLAnchorElement; heading: HTMLHeadingElement } | undefined\n\n  constructor() {\n    super()\n    this.internals_ = this.attachInternals()\n    this.controller = new AbortController()\n    this.headingLevels = this.dataset?.headings || \"h2\"\n    this.items = []\n  }\n\n  connectedCallback(): void {\n    if (!this.menu || !this.headings) return\n\n    this.headings.forEach((heading: HTMLHeadingElement) => {\n      const listItem: HTMLLIElement = this.generateListItem(heading)\n      const link: HTMLAnchorElement = this.generateAnchor(heading)\n      this.items.push({ link, heading })\n      listItem.appendChild(link)\n      this.menu?.appendChild(listItem)\n    })\n\n    const { signal }: AbortController = this.controller\n\n    // Open on toggle click.\n    this.menu.addEventListener(\n      \"click\",\n      (e: MouseEvent): void => {\n        const { target } = e\n        if (!(target instanceof HTMLAnchorElement)) return\n        this.handleClick(target)\n      },\n      {\n        signal,\n      },\n    )\n  }\n\n  disconnectedCallback(): void {\n    if (!this.menu || !this.headings) return\n    this.menu.textContent = \"\"\n    this.items = []\n    this.controller.abort()\n  }\n\n  handleClick = (target: EventTarget | null): void => {\n    this.active = this.items.find(item => item.link === target)\n    if (!this.links || !this.active) return\n    this.links.forEach(link => link.classList.remove(\"is-active\"))\n    this.active.link.classList.add(\"is-active\")\n  }\n\n  get menu(): HTMLUListElement | HTMLOListElement | null {\n    const menu: HTMLUListElement | HTMLOListElement | null =\n      this.querySelector(\"ul, ol\")\n    if (!menu) {\n      throw new Error(`${this.localName} must contain a <ul> or <ol> element.`)\n    }\n    return menu\n  }\n\n  get container(): HTMLElement | null {\n    const selector: string | null = this.getAttribute(\"data-content\")\n    if (!selector) {\n      throw new Error(\n        `${this.localName} must have a [data-content] attribute that contains the content selector.`,\n      )\n    }\n    return this.closest(selector) || this.parentElement.querySelector(selector)\n  }\n\n  get headings(): NodeListOf<HTMLHeadingElement> | undefined {\n    return this.container?.querySelectorAll(this.headingLevels)\n  }\n\n  get links(): NodeListOf<HTMLAnchorElement> | undefined {\n    return this.menu?.querySelectorAll(\"a\")\n  }\n\n  generatedId(heading: HTMLHeadingElement): string {\n    const string: string | undefined = heading?.textContent?.trim()\n    return !string ? \"\" : makeAnchor(string)\n  }\n\n  generateAnchor(heading: HTMLHeadingElement): HTMLAnchorElement {\n    const { textContent, id } = heading\n    const linkText: string | null =\n      heading.getAttribute(\"data-in-page-navigation-title\") || textContent\n    const targetID: string = id || this.generatedId(heading)\n    if (!id) heading.id = targetID\n    const item: Element = createElement(\n      `<a href=\"#${targetID}\" class=\"mx-icon mx-icon--chevron-right\">${linkText}</a>`,\n    )\n\n    return item as HTMLAnchorElement\n  }\n\n  generateListItem(heading: HTMLHeadingElement): HTMLLIElement {\n    const { tagName } = heading\n    const item: Element = createElement(\n      `<li class=\"mx-in-page-navigation__level--${tagName.toLowerCase()}\"></li>`,\n    )\n\n    return item as HTMLLIElement\n  }\n}\n\ncustomElements.define(\"mx-in-page-navigation\", InPageNavigation)\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"mx-in-page-navigation\": InPageNavigation\n  }\n}\n"],"names":[],"mappings":";AAOA,MAAqB,yBAAyB,YAAY;AAAA,EAOxD,cAAc;AACN;AAyCR,SAAA,cAAc,CAAC,WAAqC;AAClD,WAAK,SAAS,KAAK,MAAM,KAAK,CAAQ,SAAA,KAAK,SAAS,MAAM;AAC1D,UAAI,CAAC,KAAK,SAAS,CAAC,KAAK,OAAQ;AACjC,WAAK,MAAM,QAAQ,CAAA,SAAQ,KAAK,UAAU,OAAO,WAAW,CAAC;AAC7D,WAAK,OAAO,KAAK,UAAU,IAAI,WAAW;AAAA,IAAA;AA5CrC,SAAA,aAAa,KAAK;AAClB,SAAA,aAAa,IAAI;AACjB,SAAA,gBAAgB,KAAK,SAAS,YAAY;AAC/C,SAAK,QAAQ;EACf;AAAA,EAEA,oBAA0B;AACxB,QAAI,CAAC,KAAK,QAAQ,CAAC,KAAK,SAAU;AAE7B,SAAA,SAAS,QAAQ,CAAC,YAAgC;AAC/C,YAAA,WAA0B,KAAK,iBAAiB,OAAO;AACvD,YAAA,OAA0B,KAAK,eAAe,OAAO;AAC3D,WAAK,MAAM,KAAK,EAAE,MAAM,QAAS,CAAA;AACjC,eAAS,YAAY,IAAI;AACpB,WAAA,MAAM,YAAY,QAAQ;AAAA,IAAA,CAChC;AAEK,UAAA,EAAE,OAAO,IAAqB,KAAK;AAGzC,SAAK,KAAK;AAAA,MACR;AAAA,MACA,CAAC,MAAwB;AACjB,cAAA,EAAE,OAAW,IAAA;AACf,YAAA,EAAE,kBAAkB,mBAAoB;AAC5C,aAAK,YAAY,MAAM;AAAA,MACzB;AAAA,MACA;AAAA,QACE;AAAA,MACF;AAAA,IAAA;AAAA,EAEJ;AAAA,EAEA,uBAA6B;AAC3B,QAAI,CAAC,KAAK,QAAQ,CAAC,KAAK,SAAU;AAClC,SAAK,KAAK,cAAc;AACxB,SAAK,QAAQ;AACb,SAAK,WAAW;EAClB;AAAA,EASA,IAAI,OAAmD;AAC/C,UAAA,OACJ,KAAK,cAAc,QAAQ;AAC7B,QAAI,CAAC,MAAM;AACT,YAAM,IAAI,MAAM,GAAG,KAAK,SAAS,uCAAuC;AAAA,IAC1E;AACO,WAAA;AAAA,EACT;AAAA,EAEA,IAAI,YAAgC;AAC5B,UAAA,WAA0B,KAAK,aAAa,cAAc;AAChE,QAAI,CAAC,UAAU;AACb,YAAM,IAAI;AAAA,QACR,GAAG,KAAK,SAAS;AAAA,MAAA;AAAA,IAErB;AACA,WAAO,KAAK,QAAQ,QAAQ,KAAK,KAAK,cAAc,cAAc,QAAQ;AAAA,EAC5E;AAAA,EAEA,IAAI,WAAuD;AACzD,WAAO,KAAK,WAAW,iBAAiB,KAAK,aAAa;AAAA,EAC5D;AAAA,EAEA,IAAI,QAAmD;AAC9C,WAAA,KAAK,MAAM,iBAAiB,GAAG;AAAA,EACxC;AAAA,EAEA,YAAY,SAAqC;AACzC,UAAA,SAA6B,SAAS,aAAa,KAAK;AAC9D,WAAO,CAAC,SAAS,KAAK,WAAW,MAAM;AAAA,EACzC;AAAA,EAEA,eAAe,SAAgD;AACvD,UAAA,EAAE,aAAa,GAAO,IAAA;AAC5B,UAAM,WACJ,QAAQ,aAAa,+BAA+B,KAAK;AAC3D,UAAM,WAAmB,MAAM,KAAK,YAAY,OAAO;AACnD,QAAA,CAAC,GAAI,SAAQ,KAAK;AACtB,UAAM,OAAgB;AAAA,MACpB,aAAa,QAAQ,4CAA4C,QAAQ;AAAA,IAAA;AAGpE,WAAA;AAAA,EACT;AAAA,EAEA,iBAAiB,SAA4C;AACrD,UAAA,EAAE,QAAY,IAAA;AACpB,UAAM,OAAgB;AAAA,MACpB,4CAA4C,QAAQ,YAAA,CAAa;AAAA,IAAA;AAG5D,WAAA;AAAA,EACT;AACF;AAEA,eAAe,OAAO,yBAAyB,gBAAgB;"}

package/dist/build/link-list.css

@@ -0,0 +1,72 @@
+/**
+ * Link List
+ */
+
+@layer design-system.components {
+  .mx-link-list {
+    list-style-type: none;
+    padding-inline-start: 0;
+  }
+
+    .mx-link-list a {
+      display: block;
+      text-decoration-line: none;
+      color: inherit;
+    }
+
+      .mx-link-list a:hover {
+        text-decoration-line: underline;
+      }
+
+    .mx-link-list li {
+      min-block-size: var(--min-height, var(--spacing-xl));
+      border-block-end: 1px solid
+        var(--line-colour, var(--colour-border));
+      border-block-end: var(--line-width, 1px) solid
+        var(--line-colour, var(--colour-border));
+    }
+
+      .mx-link-list li:last-child {
+        border-block-end: 0;
+      }
+
+    .mx-link-list .mx-icon {
+      position: relative;
+      display: flex;
+      align-items: center;
+      padding-block: var(--spacing-xxxs);
+      inline-size: 100%;
+      gap: var(--spacing-s);
+    }
+
+      .mx-link-list .mx-icon::before {
+        flex: 0 0 auto;
+        -webkit-mask-position: left center;
+                mask-position: left center;
+      }
+
+    .mx-link-list:where(:not(.mx-link-list--reverse)) .mx-icon {
+      justify-content: space-between;
+    }
+
+      .mx-link-list:where(:not(.mx-link-list--reverse)) .mx-icon::before {
+        -webkit-mask-position: right center;
+                mask-position: right center;
+        order: 2;
+      }
+    [dir="rtl"] .mx-link-list .mx-icon::before, .translated-rtl .mx-link-list .mx-icon::before {
+      -webkit-mask-position: left center;
+              mask-position: left center;
+    }
+
+    [dir="rtl"] .mx-link-list.mx-link-list--reverse .mx-icon::before, .translated-rtl .mx-link-list.mx-link-list--reverse .mx-icon::before {
+      -webkit-mask-position: right center;
+              mask-position: right center;
+    }
+
+  * + .mx-link-list {
+    margin-block-start: var(--spacing-m);
+  }
+}
+
+/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImxpbmstbGlzdC5jc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0VBRUU7O0FBRUY7RUFDRTtJQUNFLHFCQUFxQjtJQUNyQix1QkFBdUI7RUE0Q3pCOztJQTFDRTtNQUNFLGNBQWM7TUFDZCwwQkFBMEI7TUFDMUIsY0FBYztJQUtoQjs7TUFIRTtRQUNFLCtCQUErQjtNQUNqQzs7SUFHRjtNQUNFLG9EQUFvRDtNQUNwRDtnREFDMEM7TUFEMUM7Z0RBQzBDO0lBSzVDOztNQUhFO1FBQ0UsbUJBQW1CO01BQ3JCOztJQUdGO01BQ0Usa0JBQWtCO01BQ2xCLGFBQWE7TUFDYixtQkFBbUI7TUFDbkIsa0NBQWtDO01BQ2xDLGlCQUFpQjtNQUNqQixxQkFBcUI7SUFNdkI7O01BSkU7UUFDRSxjQUFjO1FBQ2Qsa0NBQTBCO2dCQUExQiwwQkFBMEI7TUFDNUI7O0lBR0Y7TUFDRSw4QkFBOEI7SUFNaEM7O01BSkU7UUFDRSxtQ0FBMkI7Z0JBQTNCLDJCQUEyQjtRQUMzQixRQUFRO01BQ1Y7SUFNRjtNQUNFLGtDQUEwQjtjQUExQiwwQkFBMEI7SUFDNUI7O0lBRUE7TUFDRSxtQ0FBMkI7Y0FBM0IsMkJBQTJCO0lBQzdCOztFQUdGO0lBQ0Usb0NBQW9DO0VBQ3RDO0FBQ0YiLCJmaWxlIjoibGluay1saXN0LmNzcyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogTGluayBMaXN0XG4gKi9cblxuQGxheWVyIGRlc2lnbi1zeXN0ZW0uY29tcG9uZW50cyB7XG4gIC5teC1saW5rLWxpc3Qge1xuICAgIGxpc3Qtc3R5bGUtdHlwZTogbm9uZTtcbiAgICBwYWRkaW5nLWlubGluZS1zdGFydDogMDtcblxuICAgICYgYSB7XG4gICAgICBkaXNwbGF5OiBibG9jaztcbiAgICAgIHRleHQtZGVjb3JhdGlvbi1saW5lOiBub25lO1xuICAgICAgY29sb3I6IGluaGVyaXQ7XG5cbiAgICAgICY6aG92ZXIge1xuICAgICAgICB0ZXh0LWRlY29yYXRpb24tbGluZTogdW5kZXJsaW5lO1xuICAgICAgfVxuICAgIH1cblxuICAgICYgbGkge1xuICAgICAgbWluLWJsb2NrLXNpemU6IHZhcigtLW1pbi1oZWlnaHQsIHZhcigtLXNwYWNpbmcteGwpKTtcbiAgICAgIGJvcmRlci1ibG9jay1lbmQ6IHZhcigtLWxpbmUtd2lkdGgsIDFweCkgc29saWRcbiAgICAgICAgdmFyKC0tbGluZS1jb2xvdXIsIHZhcigtLWNvbG91ci1ib3JkZXIpKTtcblxuICAgICAgJjpsYXN0LWNoaWxkIHtcbiAgICAgICAgYm9yZGVyLWJsb2NrLWVuZDogMDtcbiAgICAgIH1cbiAgICB9XG5cbiAgICAmIC5teC1pY29uIHtcbiAgICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgICAgcGFkZGluZy1ibG9jazogdmFyKC0tc3BhY2luZy14eHhzKTtcbiAgICAgIGlubGluZS1zaXplOiAxMDAlO1xuICAgICAgZ2FwOiB2YXIoLS1zcGFjaW5nLXMpO1xuXG4gICAgICAmOjpiZWZvcmUge1xuICAgICAgICBmbGV4OiAwIDAgYXV0bztcbiAgICAgICAgbWFzay1wb3NpdGlvbjogbGVmdCBjZW50ZXI7XG4gICAgICB9XG4gICAgfVxuXG4gICAgJjp3aGVyZSg6bm90KC5teC1saW5rLWxpc3QtLXJldmVyc2UpKSAubXgtaWNvbiB7XG4gICAgICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47XG5cbiAgICAgICY6OmJlZm9yZSB7XG4gICAgICAgIG1hc2stcG9zaXRpb246IHJpZ2h0IGNlbnRlcjtcbiAgICAgICAgb3JkZXI6IDI7XG4gICAgICB9XG4gICAgfVxuICB9XG5cbiAgW2Rpcj1cInJ0bFwiXSAubXgtbGluay1saXN0LFxuICAudHJhbnNsYXRlZC1ydGwgLm14LWxpbmstbGlzdCB7XG4gICAgJiAubXgtaWNvbjo6YmVmb3JlIHtcbiAgICAgIG1hc2stcG9zaXRpb246IGxlZnQgY2VudGVyO1xuICAgIH1cblxuICAgICYubXgtbGluay1saXN0LS1yZXZlcnNlIC5teC1pY29uOjpiZWZvcmUge1xuICAgICAgbWFzay1wb3NpdGlvbjogcmlnaHQgY2VudGVyO1xuICAgIH1cbiAgfVxuXG4gICogKyAubXgtbGluay1saXN0IHtcbiAgICBtYXJnaW4tYmxvY2stc3RhcnQ6IHZhcigtLXNwYWNpbmctbSk7XG4gIH1cbn1cbiJdfQ== */

package/dist/build/list-item.css

@@ -0,0 +1,114 @@
+/**
+ * List Item
+ */
+
+@layer design-system.components {
+  .mx-list-item {
+    display: grid;
+    grid-gap: var(--list-item-gap, var(--gap));
+    gap: var(--list-item-gap, var(--gap));
+  }
+
+  .mx-list-item:has(> .mx-list-item__media) {
+    grid-template: "media" "content" 1fr / 1fr;
+  }
+
+    @container (min-width: 720px) {
+
+  .mx-list-item:has(> .mx-list-item__media) {
+      --list-item-gap: var(--gap-l);
+      --image-min-width: var(--image-max-width, 200px);
+
+      grid-template: "media content" 1fr / auto 1fr;
+      align-items: center;
+  }
+    }
+      @container (min-width: 720px) {
+
+    .mx-list-item.mx-list-item--reversed:has(> .mx-list-item__media) {
+        grid-template-areas: "content media";
+        grid-template-columns: 1fr auto;
+    }
+      }
+
+    .mx-list-item:has(> .mx-list-item__media) .mx-list-item__content {
+      grid-area: content;
+    }
+
+    .mx-list-item:has(> .mx-list-item__media) :is(.mx-list-item__media, figure) {
+      grid-area: media;
+      display: grid;
+      position: relative;
+      inline-size: 100%;
+      max-inline-size: 100px;
+      max-inline-size: var(--image-min-width, 100px);
+    }
+
+      .mx-list-item:has(> .mx-list-item__media) :is(.mx-list-item__media, figure) img {
+        aspect-ratio: 1 / 1;
+        border-radius: var(--border-radius);
+        -o-object-fit: cover;
+           object-fit: cover;
+        display: block;
+      }
+
+  .mx-list-item__content {
+    --flow-gap: var(--gap-s);
+  }
+
+    .mx-list-item__content > .mx-text--s {
+      --flow-gap: 0;
+    }
+    :is(.mx-list-item, .mx-container:has(> .mx-list-item)):where(:not(:first-child)) {
+      border-block-start: 1px solid
+        var(--line-colour, var(--colour-border));
+      border-block-start: var(--line-width, 1px) solid
+        var(--line-colour, var(--colour-border));
+      padding-block-start: var(--gap);
+      margin-block-start: var(--gap);
+    }
+}
+
+/**
+ * List item grid
+ */
+
+@layer design-system.components {
+  .mx-grid:has(> *:nth-child(2):last-child)
+    > :is(.mx-list-item, .mx-container:has(.mx-list-item)) {
+    inline-size: 100%;
+    max-inline-size: 37ch;
+    max-inline-size: var(--max-list-item-width, 37ch);
+    margin-inline: auto;
+  }
+}
+
+/**
+ * Block list item
+ */
+
+@layer design-system.components {
+  .mx-list-item--block {
+    position: relative;
+  }
+
+    .mx-list-item--block:focus-within {
+      border-radius: var(--border-radius);
+      outline: var(--outline-width) var(--outline-style) var(--outline-color);
+      outline-offset: 2px;
+    }
+      .mx-list-item--block :is(a[href], button):focus-visible {
+        outline: none;
+      }
+
+    .mx-list-item--block a::after {
+      content: "";
+      position: absolute;
+      inset-block-start: 0;
+      inset-inline-start: 0;
+      inline-size: 100%;
+      block-size: 100%;
+    }
+}
+
+/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImxpc3QtaXRlbS5jc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0VBRUU7O0FBRUY7RUFDRTtJQUNFLGFBQWE7SUFDYiwwQ0FBcUM7SUFBckMscUNBQXFDO0VBQ3ZDOztFQUVBO0lBQ0UsMENBQTBDO0VBbUM1Qzs7SUFqQ0U7O0VBSEY7TUFJSSw2QkFBNkI7TUFDN0IsZ0RBQWdEOztNQUVoRCw2Q0FBNkM7TUFDN0MsbUJBQW1CO0VBNEJ2QjtJQTNCRTtNQUdFOztJQURGO1FBRUksb0NBQW9DO1FBQ3BDLCtCQUErQjtJQUVuQztNQURFOztJQUdGO01BQ0Usa0JBQWtCO0lBQ3BCOztJQUVBO01BQ0UsZ0JBQWdCO01BQ2hCLGFBQWE7TUFDYixrQkFBa0I7TUFDbEIsaUJBQWlCO01BQ2pCLHNCQUE4QztNQUE5Qyw4Q0FBOEM7SUFRaEQ7O01BTkU7UUFDRSxtQkFBbUI7UUFDbkIsbUNBQW1DO1FBQ25DLG9CQUFpQjtXQUFqQixpQkFBaUI7UUFDakIsY0FBYztNQUNoQjs7RUFJSjtJQUNFLHdCQUF3QjtFQUsxQjs7SUFIRTtNQUNFLGFBQWE7SUFDZjtJQUlBO01BQ0U7Z0RBQzBDO01BRDFDO2dEQUMwQztNQUMxQywrQkFBK0I7TUFDL0IsOEJBQThCO0lBQ2hDO0FBRUo7O0FBRUE7O0VBRUU7O0FBRUY7RUFDRTs7SUFFRSxpQkFBaUI7SUFDakIscUJBQWlEO0lBQWpELGlEQUFpRDtJQUNqRCxtQkFBbUI7RUFDckI7QUFDRjs7QUFFQTs7RUFFRTs7QUFFRjtFQUNFO0lBQ0Usa0JBQWtCO0VBc0JwQjs7SUFwQkU7TUFDRSxtQ0FBbUM7TUFDbkMsdUVBQXVFO01BQ3ZFLG1CQUFtQjtJQUNyQjtNQUdFO1FBQ0UsYUFBYTtNQUNmOztJQUdGO01BQ0UsV0FBVztNQUNYLGtCQUFrQjtNQUNsQixvQkFBb0I7TUFDcEIscUJBQXFCO01BQ3JCLGlCQUFpQjtNQUNqQixnQkFBZ0I7SUFDbEI7QUFFSiIsImZpbGUiOiJsaXN0LWl0ZW0uY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBMaXN0IEl0ZW1cbiAqL1xuXG5AbGF5ZXIgZGVzaWduLXN5c3RlbS5jb21wb25lbnRzIHtcbiAgLm14LWxpc3QtaXRlbSB7XG4gICAgZGlzcGxheTogZ3JpZDtcbiAgICBnYXA6IHZhcigtLWxpc3QtaXRlbS1nYXAsIHZhcigtLWdhcCkpO1xuICB9XG5cbiAgLm14LWxpc3QtaXRlbTpoYXMoPiAubXgtbGlzdC1pdGVtX19tZWRpYSkge1xuICAgIGdyaWQtdGVtcGxhdGU6IFwibWVkaWFcIiBcImNvbnRlbnRcIiAxZnIgLyAxZnI7XG5cbiAgICBAY29udGFpbmVyIChtaW4td2lkdGg6IHRva2VuKFwiYnJlYWtwb2ludC5jb250ZW50Q2FyZFwiKSkge1xuICAgICAgLS1saXN0LWl0ZW0tZ2FwOiB2YXIoLS1nYXAtbCk7XG4gICAgICAtLWltYWdlLW1pbi13aWR0aDogdmFyKC0taW1hZ2UtbWF4LXdpZHRoLCAyMDBweCk7XG5cbiAgICAgIGdyaWQtdGVtcGxhdGU6IFwibWVkaWEgY29udGVudFwiIDFmciAvIGF1dG8gMWZyO1xuICAgICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICB9XG5cbiAgICAmLm14LWxpc3QtaXRlbS0tcmV2ZXJzZWQge1xuICAgICAgQGNvbnRhaW5lciAobWluLXdpZHRoOiB0b2tlbihcImJyZWFrcG9pbnQuY29udGVudENhcmRcIikpIHtcbiAgICAgICAgZ3JpZC10ZW1wbGF0ZS1hcmVhczogXCJjb250ZW50IG1lZGlhXCI7XG4gICAgICAgIGdyaWQtdGVtcGxhdGUtY29sdW1uczogMWZyIGF1dG87XG4gICAgICB9XG4gICAgfVxuXG4gICAgJiAubXgtbGlzdC1pdGVtX19jb250ZW50IHtcbiAgICAgIGdyaWQtYXJlYTogY29udGVudDtcbiAgICB9XG5cbiAgICAmIDppcygubXgtbGlzdC1pdGVtX19tZWRpYSwgZmlndXJlKSB7XG4gICAgICBncmlkLWFyZWE6IG1lZGlhO1xuICAgICAgZGlzcGxheTogZ3JpZDtcbiAgICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICAgIGlubGluZS1zaXplOiAxMDAlO1xuICAgICAgbWF4LWlubGluZS1zaXplOiB2YXIoLS1pbWFnZS1taW4td2lkdGgsIDEwMHB4KTtcblxuICAgICAgJiBpbWcge1xuICAgICAgICBhc3BlY3QtcmF0aW86IDEgLyAxO1xuICAgICAgICBib3JkZXItcmFkaXVzOiB2YXIoLS1ib3JkZXItcmFkaXVzKTtcbiAgICAgICAgb2JqZWN0LWZpdDogY292ZXI7XG4gICAgICAgIGRpc3BsYXk6IGJsb2NrO1xuICAgICAgfVxuICAgIH1cbiAgfVxuXG4gIC5teC1saXN0LWl0ZW1fX2NvbnRlbnQge1xuICAgIC0tZmxvdy1nYXA6IHZhcigtLWdhcC1zKTtcblxuICAgICYgPiAubXgtdGV4dC0tcyB7XG4gICAgICAtLWZsb3ctZ2FwOiAwO1xuICAgIH1cbiAgfVxuXG4gIDppcygubXgtbGlzdC1pdGVtLCAubXgtY29udGFpbmVyOmhhcyg+IC5teC1saXN0LWl0ZW0pKSB7XG4gICAgJjp3aGVyZSg6bm90KDpmaXJzdC1jaGlsZCkpIHtcbiAgICAgIGJvcmRlci1ibG9jay1zdGFydDogdmFyKC0tbGluZS13aWR0aCwgMXB4KSBzb2xpZFxuICAgICAgICB2YXIoLS1saW5lLWNvbG91ciwgdmFyKC0tY29sb3VyLWJvcmRlcikpO1xuICAgICAgcGFkZGluZy1ibG9jay1zdGFydDogdmFyKC0tZ2FwKTtcbiAgICAgIG1hcmdpbi1ibG9jay1zdGFydDogdmFyKC0tZ2FwKTtcbiAgICB9XG4gIH1cbn1cblxuLyoqXG4gKiBMaXN0IGl0ZW0gZ3JpZFxuICovXG5cbkBsYXllciBkZXNpZ24tc3lzdGVtLmNvbXBvbmVudHMge1xuICAubXgtZ3JpZDpoYXMoPiAqOm50aC1jaGlsZCgyKTpsYXN0LWNoaWxkKVxuICAgID4gOmlzKC5teC1saXN0LWl0ZW0sIC5teC1jb250YWluZXI6aGFzKC5teC1saXN0LWl0ZW0pKSB7XG4gICAgaW5saW5lLXNpemU6IDEwMCU7XG4gICAgbWF4LWlubGluZS1zaXplOiB2YXIoLS1tYXgtbGlzdC1pdGVtLXdpZHRoLCAzN2NoKTtcbiAgICBtYXJnaW4taW5saW5lOiBhdXRvO1xuICB9XG59XG5cbi8qKlxuICogQmxvY2sgbGlzdCBpdGVtXG4gKi9cblxuQGxheWVyIGRlc2lnbi1zeXN0ZW0uY29tcG9uZW50cyB7XG4gIC5teC1saXN0LWl0ZW0tLWJsb2NrIHtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG5cbiAgICAmOmZvY3VzLXdpdGhpbiB7XG4gICAgICBib3JkZXItcmFkaXVzOiB2YXIoLS1ib3JkZXItcmFkaXVzKTtcbiAgICAgIG91dGxpbmU6IHZhcigtLW91dGxpbmUtd2lkdGgpIHZhcigtLW91dGxpbmUtc3R5bGUpIHZhcigtLW91dGxpbmUtY29sb3IpO1xuICAgICAgb3V0bGluZS1vZmZzZXQ6IDJweDtcbiAgICB9XG5cbiAgICAmIDppcyhhW2hyZWZdLCBidXR0b24pIHtcbiAgICAgICY6Zm9jdXMtdmlzaWJsZSB7XG4gICAgICAgIG91dGxpbmU6IG5vbmU7XG4gICAgICB9XG4gICAgfVxuXG4gICAgJiBhOjphZnRlciB7XG4gICAgICBjb250ZW50OiBcIlwiO1xuICAgICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgICAgaW5zZXQtYmxvY2stc3RhcnQ6IDA7XG4gICAgICBpbnNldC1pbmxpbmUtc3RhcnQ6IDA7XG4gICAgICBpbmxpbmUtc2l6ZTogMTAwJTtcbiAgICAgIGJsb2NrLXNpemU6IDEwMCU7XG4gICAgfVxuICB9XG59XG4iXX0= */

package/dist/build/masthead.css

@@ -0,0 +1,30 @@
+/**
+ * Masthead
+ */
+
+@layer design-system.layouts {
+    .mx-masthead .flex {
+      justify-content: space-between;
+      align-items: center;
+    }
+
+  .mx-masthead__nav {
+    display: none;
+  }
+
+    @media (min-width: 720px) {
+
+  .mx-masthead__nav {
+      display: inline-flex;
+      gap: var(--gap);
+  }
+    }
+}
+
+@media print {
+  .mx-masthead {
+    display: none;
+  }
+}
+
+/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIm1hc3RoZWFkLmNzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7RUFFRTs7QUFFRjtJQUVJO01BQ0UsOEJBQThCO01BQzlCLG1CQUFtQjtJQUNyQjs7RUFHRjtJQUNFLGFBQWE7RUFNZjs7SUFKRTs7RUFIRjtNQUlJLG9CQUFvQjtNQUNwQixlQUFlO0VBRW5CO0lBREU7QUFFSjs7QUFFQTtFQUNFO0lBQ0UsYUFBYTtFQUNmO0FBQ0YiLCJmaWxlIjoibWFzdGhlYWQuY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBNYXN0aGVhZFxuICovXG5cbkBsYXllciBkZXNpZ24tc3lzdGVtLmxheW91dHMge1xuICAubXgtbWFzdGhlYWQge1xuICAgICYgLmZsZXgge1xuICAgICAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuICAgICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICB9XG4gIH1cblxuICAubXgtbWFzdGhlYWRfX25hdiB7XG4gICAgZGlzcGxheTogbm9uZTtcblxuICAgIEBtZWRpYSAoLS1nbG9iYWwtbmF2LXVwKSB7XG4gICAgICBkaXNwbGF5OiBpbmxpbmUtZmxleDtcbiAgICAgIGdhcDogdmFyKC0tZ2FwKTtcbiAgICB9XG4gIH1cbn1cblxuQG1lZGlhIHByaW50IHtcbiAgLm14LW1hc3RoZWFkIHtcbiAgICBkaXNwbGF5OiBub25lO1xuICB9XG59XG4iXX0= */