@pnx-mixtape/mxds 0.0.7 → 0.0.8

package/dist/build/breadcrumb.css

@@ -0,0 +1,51 @@
+/**
+ * Breadcrumb Navigation
+ */
+
+@layer design-system.components {
+  .mx-nav--breadcrumbs {
+    --nav-font-size: var(--font-size-s);
+
+    position: relative;
+    z-index: 1;
+    overflow: auto;
+    white-space: nowrap;
+  }
+
+    .mx-nav--breadcrumbs > ul {
+      gap: var(--breadcrumb-gap, var(--spacing-xxxxs));
+    }
+
+    .mx-nav--breadcrumbs > ul > li {
+      color: var(
+        --breadcrumb-foreground,
+        var(--foreground, var(--colour-foreground-alt))
+      );
+      display: flex;
+      align-items: center;
+    }
+
+      .mx-nav--breadcrumbs > ul > li:where(:not(:last-child))::after {
+        content: "";
+        display: block;
+        vertical-align: middle;
+        -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M6 13.4L4.6 12l4-4-4-4L6 2.6 11.4 8z'/%3E%3C/svg%3E");
+                mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M6 13.4L4.6 12l4-4-4-4L6 2.6 11.4 8z'/%3E%3C/svg%3E");
+        -webkit-mask-position: center;
+                mask-position: center;
+        -webkit-mask-repeat: no-repeat;
+                mask-repeat: no-repeat;
+        block-size: var(--spacing-m);
+        inline-size: var(--spacing-m);
+        background-color: currentcolor;
+      }
+
+    .mx-nav--breadcrumbs [aria-current="page"] {
+      pointer-events: none;
+    }
+    [dir="rtl"] .mx-nav--breadcrumbs > ul > li::after, .translated-rtl .mx-nav--breadcrumbs > ul > li::after {
+      transform: rotate(180deg);
+    }
+}
+
+/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImJyZWFkY3J1bWIuY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztFQUVFOztBQUVGO0VBQ0U7SUFDRSxtQ0FBbUM7O0lBRW5DLGtCQUFrQjtJQUNsQixVQUFVO0lBQ1YsY0FBYztJQUNkLG1CQUFtQjtFQThCckI7O0lBNUJFO01BQ0UsZ0RBQWdEO0lBQ2xEOztJQUVBO01BQ0U7OztPQUdDO01BQ0QsYUFBYTtNQUNiLG1CQUFtQjtJQWFyQjs7TUFYRTtRQUNFLFdBQVc7UUFDWCxjQUFjO1FBQ2Qsc0JBQXNCO1FBQ3RCLDZMQUFnRTtnQkFBaEUscUxBQWdFO1FBQ2hFLDZCQUFxQjtnQkFBckIscUJBQXFCO1FBQ3JCLDhCQUFzQjtnQkFBdEIsc0JBQXNCO1FBQ3RCLDRCQUE0QjtRQUM1Qiw2QkFBNkI7UUFDN0IsOEJBQThCO01BQ2hDOztJQUdGO01BQ0Usb0JBQW9CO0lBQ3RCO0lBS0E7TUFDRSx5QkFBeUI7SUFDM0I7QUFFSiIsImZpbGUiOiJicmVhZGNydW1iLmNzcyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQnJlYWRjcnVtYiBOYXZpZ2F0aW9uXG4gKi9cblxuQGxheWVyIGRlc2lnbi1zeXN0ZW0uY29tcG9uZW50cyB7XG4gIC5teC1uYXYtLWJyZWFkY3J1bWJzIHtcbiAgICAtLW5hdi1mb250LXNpemU6IHZhcigtLWZvbnQtc2l6ZS1zKTtcblxuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICB6LWluZGV4OiAxO1xuICAgIG92ZXJmbG93OiBhdXRvO1xuICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7XG5cbiAgICAmID4gdWwge1xuICAgICAgZ2FwOiB2YXIoLS1icmVhZGNydW1iLWdhcCwgdmFyKC0tc3BhY2luZy14eHh4cykpO1xuICAgIH1cblxuICAgICYgPiB1bCA+IGxpIHtcbiAgICAgIGNvbG9yOiB2YXIoXG4gICAgICAgIC0tYnJlYWRjcnVtYi1mb3JlZ3JvdW5kLFxuICAgICAgICB2YXIoLS1mb3JlZ3JvdW5kLCB2YXIoLS1jb2xvdXItZm9yZWdyb3VuZC1hbHQpKVxuICAgICAgKTtcbiAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuXG4gICAgICAmOndoZXJlKDpub3QoOmxhc3QtY2hpbGQpKTo6YWZ0ZXIge1xuICAgICAgICBjb250ZW50OiBcIlwiO1xuICAgICAgICBkaXNwbGF5OiBibG9jaztcbiAgICAgICAgdmVydGljYWwtYWxpZ246IG1pZGRsZTtcbiAgICAgICAgbWFzay1pbWFnZTogc3ZnLWxvYWQoXCIuLi8uLi9BdG9tL0ljb24vaW1hZ2VzL2NoZXZyb24tcmlnaHQuc3ZnXCIpO1xuICAgICAgICBtYXNrLXBvc2l0aW9uOiBjZW50ZXI7XG4gICAgICAgIG1hc2stcmVwZWF0OiBuby1yZXBlYXQ7XG4gICAgICAgIGJsb2NrLXNpemU6IHZhcigtLXNwYWNpbmctbSk7XG4gICAgICAgIGlubGluZS1zaXplOiB2YXIoLS1zcGFjaW5nLW0pO1xuICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiBjdXJyZW50Y29sb3I7XG4gICAgICB9XG4gICAgfVxuXG4gICAgJiBbYXJpYS1jdXJyZW50PVwicGFnZVwiXSB7XG4gICAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgICB9XG4gIH1cblxuICBbZGlyPVwicnRsXCJdIC5teC1uYXYtLWJyZWFkY3J1bWJzLFxuICAudHJhbnNsYXRlZC1ydGwgLm14LW5hdi0tYnJlYWRjcnVtYnMge1xuICAgICYgPiB1bCA+IGxpOjphZnRlciB7XG4gICAgICB0cmFuc2Zvcm06IHJvdGF0ZSgxODBkZWcpO1xuICAgIH1cbiAgfVxufVxuIl19 */

package/dist/build/button.css

@@ -0,0 +1,132 @@
+/**
+ * Buttons
+ */
+
+@layer design-system.atoms {
+  .mx-button {
+    --outline-offset: 0.0625rem;
+    --outline-width: 0.25rem;
+
+    display: inline-flex;
+    inline-size: -moz-fit-content;
+    inline-size: fit-content;
+    gap: var(--button-gap, var(--spacing-s));
+    font-size: var(--button-font-size, var(--font-size));
+    font-weight: var(--font-weight-bold);
+    font-family: var(--font-family);
+    line-height: var(--line-height-ui);
+    border: 2px solid
+      var(--button-line-colour, var(--colour-border));
+    border: var(--line-width, 2px) solid
+      var(--button-line-colour, var(--colour-border));
+    border-radius: var(--radius, var(--border-radius-l));
+    padding-block: var(--vertical-padding, var(--spacing-xxs));
+    padding-inline: var(--horizontal-padding, var(--spacing-m));
+    background-color: var(--background, var(--colour-background));
+    color: var(--foreground, var(--colour-foreground));
+    text-decoration-line: none;
+    transition:
+      0.2s color,
+      0.2s background-color,
+      0.2s border-color;
+  }
+
+    .mx-button:hover {
+      cursor: pointer;
+      text-decoration-line: none;
+    }
+
+    .mx-button:disabled {
+      cursor: not-allowed;
+      opacity: 0.3;
+    }
+
+  .mx-button--full-width {
+    inline-size: 100%;
+    justify-content: center;
+  }
+
+  .mx-button--large {
+    --vertical-padding: var(--spacing-s);
+    --horizontal-padding: var(--spacing-l);
+  }
+
+  .mx-button--small {
+    --button-font-size: var(--font-size-s);
+    --vertical-padding: var(--spacing-xxxs);
+    --horizontal-padding: var(--spacing-s);
+  }
+
+  .mx-button--icon-only {
+    inline-size: var(--spacing-xl);
+    block-size: var(--spacing-xl);
+    padding: 0;
+    border-radius: var(--border-radius-round);
+    overflow: hidden;
+    flex-wrap: wrap;
+  }
+
+    .mx-button--icon-only::before {
+      inline-size: 100%;
+      block-size: 100%;
+      -webkit-mask-size: var(--spacing-s);
+              mask-size: var(--spacing-s);
+    }
+
+    .mx-button--icon-only:has(.mx-icon) {
+      align-content: center;
+      justify-content: center;
+      place-content: center;
+    }
+}
+
+/**
+ * Buttons
+ */
+
+@layer design-system.atoms {
+  .mx-button--dark {
+    --button-line-colour: var(--colour-primary);
+    --background: var(--colour-primary);
+    --foreground: var(--colour-foreground-reverse);
+  }
+
+    .mx-button--dark.button--outline {
+      --background: transparent;
+      --foreground: var(--colour-primary);
+    }
+
+  .mx-button--light {
+    border: transparent;
+    color: var(--link-colour, var(--colour-primary));
+    text-decoration-line: underline;
+  }
+
+    .mx-button--light:hover {
+      text-decoration-line: underline;
+    }
+
+  .mx-button--destructive {
+    --button-line-colour: var(--colour-error-foreground);
+    --background: var(--colour-error-foreground);
+    --foreground: var(--colour-foreground-reverse);
+  }
+
+    .mx-button--destructive.button--outline {
+      --background: transparent;
+      --foreground: var(--colour-error-foreground);
+    }
+
+  .mx-button--white {
+    --button-line-colour: var(--colour-foreground-reverse);
+    --background: var(--colour-foreground-reverse);
+    --foreground: var(--colour-foreground);
+  }
+
+    .mx-button--white.button--outline {
+      --background: transparent;
+      --foreground: var(--colour-foreground-reverse);
+    }
+}
+
+/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIl9idXR0b25zLmNzcyIsIl9idXR0b25zLXN0eWxlcy5jc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0VBRUU7O0FBRUY7RUFDRTtJQUNFLDJCQUFxQjtJQUNyQix3QkFBb0I7O0lBRXBCLG9CQUFvQjtJQUNwQiw2QkFBd0I7SUFBeEIsd0JBQXdCO0lBQ3hCLHdDQUF3QztJQUN4QyxvREFBb0Q7SUFDcEQsb0NBQW9DO0lBQ3BDLCtCQUErQjtJQUMvQixrQ0FBa0M7SUFDbEM7cURBQ2lEO0lBRGpEO3FEQUNpRDtJQUNqRCxvREFBb0Q7SUFDcEQsMERBQTBEO0lBQzFELDJEQUEyRDtJQUMzRCw2REFBNkQ7SUFDN0Qsa0RBQWtEO0lBQ2xELDBCQUEwQjtJQUMxQjs7O3VCQUdtQjtFQVdyQjs7SUFURTtNQUNFLGVBQWU7TUFDZiwwQkFBMEI7SUFDNUI7O0lBRUE7TUFDRSxtQkFBbUI7TUFDbkIsWUFBWTtJQUNkOztFQUdGO0lBQ0UsaUJBQWlCO0lBQ2pCLHVCQUF1QjtFQUN6Qjs7RUFFQTtJQUNFLG9DQUFvQztJQUNwQyxzQ0FBc0M7RUFDeEM7O0VBRUE7SUFDRSxzQ0FBc0M7SUFDdEMsdUNBQXVDO0lBQ3ZDLHNDQUFzQztFQUN4Qzs7RUFFQTtJQUNFLDhCQUE4QjtJQUM5Qiw2QkFBNkI7SUFDN0IsVUFBVTtJQUNWLHlDQUF5QztJQUN6QyxnQkFBZ0I7SUFDaEIsZUFBZTtFQVdqQjs7SUFURTtNQUNFLGlCQUFpQjtNQUNqQixnQkFBZ0I7TUFDaEIsbUNBQTJCO2NBQTNCLDJCQUEyQjtJQUM3Qjs7SUFFQTtNQUNFLHFCQUFxQjtNQUFyQix1QkFBcUI7TUFBckIscUJBQXFCO0lBQ3ZCO0FBRUo7O0FDMUVBOztFQUVFOztBQUVGO0VBQ0U7SUFDRSwyQ0FBMkM7SUFDM0MsbUNBQW1DO0lBQ25DLDhDQUE4QztFQU1oRDs7SUFKRTtNQUNFLHlCQUF5QjtNQUN6QixtQ0FBbUM7SUFDckM7O0VBR0Y7SUFDRSxtQkFBbUI7SUFDbkIsZ0RBQWdEO0lBQ2hELCtCQUErQjtFQUtqQzs7SUFIRTtNQUNFLCtCQUErQjtJQUNqQzs7RUFHRjtJQUNFLG9EQUFvRDtJQUNwRCw0Q0FBNEM7SUFDNUMsOENBQThDO0VBTWhEOztJQUpFO01BQ0UseUJBQXlCO01BQ3pCLDRDQUE0QztJQUM5Qzs7RUFHRjtJQUNFLHNEQUFzRDtJQUN0RCw4Q0FBOEM7SUFDOUMsc0NBQXNDO0VBTXhDOztJQUpFO01BQ0UseUJBQXlCO01BQ3pCLDhDQUE4QztJQUNoRDtBQUVKIiwiZmlsZSI6ImJ1dHRvbi5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEJ1dHRvbnNcbiAqL1xuXG5AbGF5ZXIgZGVzaWduLXN5c3RlbS5hdG9tcyB7XG4gIC5teC1idXR0b24ge1xuICAgIC0tb3V0bGluZS1vZmZzZXQ6IDFweDtcbiAgICAtLW91dGxpbmUtd2lkdGg6IDRweDtcblxuICAgIGRpc3BsYXk6IGlubGluZS1mbGV4O1xuICAgIGlubGluZS1zaXplOiBmaXQtY29udGVudDtcbiAgICBnYXA6IHZhcigtLWJ1dHRvbi1nYXAsIHZhcigtLXNwYWNpbmctcykpO1xuICAgIGZvbnQtc2l6ZTogdmFyKC0tYnV0dG9uLWZvbnQtc2l6ZSwgdmFyKC0tZm9udC1zaXplKSk7XG4gICAgZm9udC13ZWlnaHQ6IHZhcigtLWZvbnQtd2VpZ2h0LWJvbGQpO1xuICAgIGZvbnQtZmFtaWx5OiB2YXIoLS1mb250LWZhbWlseSk7XG4gICAgbGluZS1oZWlnaHQ6IHZhcigtLWxpbmUtaGVpZ2h0LXVpKTtcbiAgICBib3JkZXI6IHZhcigtLWxpbmUtd2lkdGgsIDJweCkgc29saWRcbiAgICAgIHZhcigtLWJ1dHRvbi1saW5lLWNvbG91ciwgdmFyKC0tY29sb3VyLWJvcmRlcikpO1xuICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLXJhZGl1cywgdmFyKC0tYm9yZGVyLXJhZGl1cy1sKSk7XG4gICAgcGFkZGluZy1ibG9jazogdmFyKC0tdmVydGljYWwtcGFkZGluZywgdmFyKC0tc3BhY2luZy14eHMpKTtcbiAgICBwYWRkaW5nLWlubGluZTogdmFyKC0taG9yaXpvbnRhbC1wYWRkaW5nLCB2YXIoLS1zcGFjaW5nLW0pKTtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1iYWNrZ3JvdW5kLCB2YXIoLS1jb2xvdXItYmFja2dyb3VuZCkpO1xuICAgIGNvbG9yOiB2YXIoLS1mb3JlZ3JvdW5kLCB2YXIoLS1jb2xvdXItZm9yZWdyb3VuZCkpO1xuICAgIHRleHQtZGVjb3JhdGlvbi1saW5lOiBub25lO1xuICAgIHRyYW5zaXRpb246XG4gICAgICAwLjJzIGNvbG9yLFxuICAgICAgMC4ycyBiYWNrZ3JvdW5kLWNvbG9yLFxuICAgICAgMC4ycyBib3JkZXItY29sb3I7XG5cbiAgICAmOmhvdmVyIHtcbiAgICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICAgIHRleHQtZGVjb3JhdGlvbi1saW5lOiBub25lO1xuICAgIH1cblxuICAgICY6ZGlzYWJsZWQge1xuICAgICAgY3Vyc29yOiBub3QtYWxsb3dlZDtcbiAgICAgIG9wYWNpdHk6IDAuMztcbiAgICB9XG4gIH1cblxuICAubXgtYnV0dG9uLS1mdWxsLXdpZHRoIHtcbiAgICBpbmxpbmUtc2l6ZTogMTAwJTtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgfVxuXG4gIC5teC1idXR0b24tLWxhcmdlIHtcbiAgICAtLXZlcnRpY2FsLXBhZGRpbmc6IHZhcigtLXNwYWNpbmctcyk7XG4gICAgLS1ob3Jpem9udGFsLXBhZGRpbmc6IHZhcigtLXNwYWNpbmctbCk7XG4gIH1cblxuICAubXgtYnV0dG9uLS1zbWFsbCB7XG4gICAgLS1idXR0b24tZm9udC1zaXplOiB2YXIoLS1mb250LXNpemUtcyk7XG4gICAgLS12ZXJ0aWNhbC1wYWRkaW5nOiB2YXIoLS1zcGFjaW5nLXh4eHMpO1xuICAgIC0taG9yaXpvbnRhbC1wYWRkaW5nOiB2YXIoLS1zcGFjaW5nLXMpO1xuICB9XG5cbiAgLm14LWJ1dHRvbi0taWNvbi1vbmx5IHtcbiAgICBpbmxpbmUtc2l6ZTogdmFyKC0tc3BhY2luZy14bCk7XG4gICAgYmxvY2stc2l6ZTogdmFyKC0tc3BhY2luZy14bCk7XG4gICAgcGFkZGluZzogMDtcbiAgICBib3JkZXItcmFkaXVzOiB2YXIoLS1ib3JkZXItcmFkaXVzLXJvdW5kKTtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIGZsZXgtd3JhcDogd3JhcDtcblxuICAgICY6OmJlZm9yZSB7XG4gICAgICBpbmxpbmUtc2l6ZTogMTAwJTtcbiAgICAgIGJsb2NrLXNpemU6IDEwMCU7XG4gICAgICBtYXNrLXNpemU6IHZhcigtLXNwYWNpbmctcyk7XG4gICAgfVxuXG4gICAgJjpoYXMoLm14LWljb24pIHtcbiAgICAgIHBsYWNlLWNvbnRlbnQ6IGNlbnRlcjtcbiAgICB9XG4gIH1cbn1cbiIsIi8qKlxuICogQnV0dG9uc1xuICovXG5cbkBsYXllciBkZXNpZ24tc3lzdGVtLmF0b21zIHtcbiAgLm14LWJ1dHRvbi0tZGFyayB7XG4gICAgLS1idXR0b24tbGluZS1jb2xvdXI6IHZhcigtLWNvbG91ci1wcmltYXJ5KTtcbiAgICAtLWJhY2tncm91bmQ6IHZhcigtLWNvbG91ci1wcmltYXJ5KTtcbiAgICAtLWZvcmVncm91bmQ6IHZhcigtLWNvbG91ci1mb3JlZ3JvdW5kLXJldmVyc2UpO1xuXG4gICAgJi5idXR0b24tLW91dGxpbmUge1xuICAgICAgLS1iYWNrZ3JvdW5kOiB0cmFuc3BhcmVudDtcbiAgICAgIC0tZm9yZWdyb3VuZDogdmFyKC0tY29sb3VyLXByaW1hcnkpO1xuICAgIH1cbiAgfVxuXG4gIC5teC1idXR0b24tLWxpZ2h0IHtcbiAgICBib3JkZXI6IHRyYW5zcGFyZW50O1xuICAgIGNvbG9yOiB2YXIoLS1saW5rLWNvbG91ciwgdmFyKC0tY29sb3VyLXByaW1hcnkpKTtcbiAgICB0ZXh0LWRlY29yYXRpb24tbGluZTogdW5kZXJsaW5lO1xuXG4gICAgJjpob3ZlciB7XG4gICAgICB0ZXh0LWRlY29yYXRpb24tbGluZTogdW5kZXJsaW5lO1xuICAgIH1cbiAgfVxuXG4gIC5teC1idXR0b24tLWRlc3RydWN0aXZlIHtcbiAgICAtLWJ1dHRvbi1saW5lLWNvbG91cjogdmFyKC0tY29sb3VyLWVycm9yLWZvcmVncm91bmQpO1xuICAgIC0tYmFja2dyb3VuZDogdmFyKC0tY29sb3VyLWVycm9yLWZvcmVncm91bmQpO1xuICAgIC0tZm9yZWdyb3VuZDogdmFyKC0tY29sb3VyLWZvcmVncm91bmQtcmV2ZXJzZSk7XG5cbiAgICAmLmJ1dHRvbi0tb3V0bGluZSB7XG4gICAgICAtLWJhY2tncm91bmQ6IHRyYW5zcGFyZW50O1xuICAgICAgLS1mb3JlZ3JvdW5kOiB2YXIoLS1jb2xvdXItZXJyb3ItZm9yZWdyb3VuZCk7XG4gICAgfVxuICB9XG5cbiAgLm14LWJ1dHRvbi0td2hpdGUge1xuICAgIC0tYnV0dG9uLWxpbmUtY29sb3VyOiB2YXIoLS1jb2xvdXItZm9yZWdyb3VuZC1yZXZlcnNlKTtcbiAgICAtLWJhY2tncm91bmQ6IHZhcigtLWNvbG91ci1mb3JlZ3JvdW5kLXJldmVyc2UpO1xuICAgIC0tZm9yZWdyb3VuZDogdmFyKC0tY29sb3VyLWZvcmVncm91bmQpO1xuXG4gICAgJi5idXR0b24tLW91dGxpbmUge1xuICAgICAgLS1iYWNrZ3JvdW5kOiB0cmFuc3BhcmVudDtcbiAgICAgIC0tZm9yZWdyb3VuZDogdmFyKC0tY29sb3VyLWZvcmVncm91bmQtcmV2ZXJzZSk7XG4gICAgfVxuICB9XG59XG4iXX0= */

package/dist/build/callout.css

@@ -0,0 +1,11 @@
+@layer design-system.components {
+  .mx-callout {
+    padding-inline-start: var(--line-gap, var(--gap));
+    border-inline-start: 6px solid
+      var(--line-colour, var(--colour-primary));
+    border-inline-start: var(--line-width, 6px) solid
+      var(--line-colour, var(--colour-primary));
+  }
+}
+
+/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImNhbGxvdXQuY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBO0VBQ0U7SUFDRSxpREFBaUQ7SUFDakQ7K0NBQzJDO0lBRDNDOytDQUMyQztFQUM3QztBQUNGIiwiZmlsZSI6ImNhbGxvdXQuY3NzIiwic291cmNlc0NvbnRlbnQiOlsiQGxheWVyIGRlc2lnbi1zeXN0ZW0uY29tcG9uZW50cyB7XG4gIC5teC1jYWxsb3V0IHtcbiAgICBwYWRkaW5nLWlubGluZS1zdGFydDogdmFyKC0tbGluZS1nYXAsIHZhcigtLWdhcCkpO1xuICAgIGJvcmRlci1pbmxpbmUtc3RhcnQ6IHZhcigtLWxpbmUtd2lkdGgsIDZweCkgc29saWRcbiAgICAgIHZhcigtLWxpbmUtY29sb3VyLCB2YXIoLS1jb2xvdXItcHJpbWFyeSkpO1xuICB9XG59XG4iXX0= */

package/dist/build/card.css

@@ -0,0 +1,149 @@
+/**
+ * Content Card
+ */
+
+@layer design-system.components {
+  .mx-card {
+    display: grid;
+    grid-gap: var(--card-gap, var(--gap));
+    gap: var(--card-gap, var(--gap));
+  }
+
+    .mx-card[class*="mx-background--"] {
+      border-radius: var(--border-radius);
+    }
+
+      .mx-card[class*="mx-background--"] .mx-card__content {
+        padding-inline: var(--content-min-spacing, var(--spacing-s));
+        padding-block-end: var(--content-min-spacing, var(--spacing-s));
+      }
+
+        @container (min-width: 720px) {
+
+      .mx-card[class*="mx-background--"] .mx-card__content {
+          --content-min-spacing: var(--content-max-spacing, var(--spacing-m));
+      }
+        }
+
+    .mx-card:has(.mx-card__media) {
+      grid-template: "media" "content" 1fr / 1fr;
+    }
+
+      @container (min-width: 720px) {
+
+    .mx-card:has(.mx-card__media) {
+        --card-gap: var(--gap-l);
+
+        grid-template: "media content" 1fr / 1fr 1fr;
+        align-items: center;
+    }
+
+        .mx-card.mx-card--reversed:has(.mx-card__media) {
+          grid-template-areas: "content media";
+        }
+
+        .mx-card:has(.mx-card__media) .mx-card__content {
+          justify-content: center;
+        }
+      }
+
+      @container (min-width: 946px) {
+
+    .mx-card:has(.mx-card__media) {
+        --card-gap: 6rem;
+    }
+      }
+        @container (min-width: 720px) {
+          .mx-card[class*="mx-background--"]:has(.mx-card__media) .mx-card__content {
+            padding-block-start: var(--content-min-spacing, var(--spacing-s));
+          }
+
+          .mx-card[class*="mx-background--"]:has(.mx-card__media):where(:not(.mx-card--reversed)) .mx-card__content {
+            padding-inline-start: 0;
+          }
+
+          .mx-card.mx-card--reversed[class*="mx-background--"]:has(.mx-card__media) .mx-card__content {
+            padding-inline-end: 0;
+          }
+        }
+
+      .mx-card:has(.mx-card__media) .mx-card__content {
+        grid-area: content;
+      }
+
+      .mx-card:has(.mx-card__media) :is(.mx-card__media, figure) {
+        grid-area: media;
+        display: grid;
+        margin: auto;
+        position: relative;
+        inline-size: 100%;
+      }
+
+        .mx-card:has(.mx-card__media) :is(.mx-card__media, figure) img {
+          aspect-ratio: var(--ratio);
+          border-radius: var(--border-radius);
+          -o-object-fit: cover;
+             object-fit: cover;
+          display: block;
+        }
+
+        .mx-card:has(.mx-card__media) :is(.mx-card__media, figure) .mx-skeleton--bg {
+          aspect-ratio: var(--ratio);
+        }
+
+      .mx-card:has(.mx-card__media) .mx-card__icon {
+        grid-area: media;
+      }
+
+    .mx-card .mx-link-list {
+      inline-size: 100%;
+    }
+}
+
+/**
+ * Content Card Grid
+ */
+
+@layer design-system.components {
+  .mx-grid:has(> *:nth-child(2):last-child)
+    > :is(.mx-card, .mx-container:has(.mx-card)) {
+    inline-size: 100%;
+    max-inline-size: 37ch;
+    max-inline-size: var(--max-card-width, 37ch);
+    margin-inline: auto;
+  }
+}
+
+/**
+ * Content Card Linked
+ */
+
+@layer design-system.components {
+    a.mx-card[href]:hover {
+      color: inherit;
+    }
+
+  .mx-card--block {
+    position: relative;
+  }
+
+    .mx-card--block:focus-within {
+      border-radius: var(--border-radius);
+      outline: var(--outline-width) var(--outline-style) var(--outline-color);
+      outline-offset: 2px;
+    }
+      .mx-card--block :is(a[href], button):focus-visible {
+        outline: none;
+      }
+
+    .mx-card--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,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImNhcmQuY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztFQUVFOztBQUVGO0VBQ0U7SUFDRSxhQUFhO0lBQ2IscUNBQWdDO0lBQWhDLGdDQUFnQztFQW9GbEM7O0lBbEZFO01BQ0UsbUNBQW1DO0lBVXJDOztNQVJFO1FBQ0UsNERBQTREO1FBQzVELCtEQUErRDtNQUtqRTs7UUFIRTs7TUFKRjtVQUtJLG1FQUFtRTtNQUV2RTtRQURFOztJQUlKO01BQ0UsMENBQTBDO0lBK0Q1Qzs7TUE3REU7O0lBSEY7UUFJSSx3QkFBd0I7O1FBRXhCLDRDQUE0QztRQUM1QyxtQkFBbUI7SUF5RHZCOztRQXZESTtVQUNFLG9DQUFvQztRQUN0Qzs7UUFFQTtVQUNFLHVCQUF1QjtRQUN6QjtNQUNGOztNQUVBOztJQWxCRjtRQW1CSSxnQkFBZ0I7SUE2Q3BCO01BNUNFO1FBR0U7VUFDRTtZQUNFLGlFQUFpRTtVQUNuRTs7VUFFQTtZQUNFLHVCQUF1QjtVQUN6Qjs7VUFFQTtZQUNFLHFCQUFxQjtVQUN2QjtRQUNGOztNQUdGO1FBQ0Usa0JBQWtCO01BQ3BCOztNQUVBO1FBQ0UsZ0JBQWdCO1FBQ2hCLGFBQWE7UUFDYixZQUFZO1FBQ1osa0JBQWtCO1FBQ2xCLGlCQUFpQjtNQVluQjs7UUFWRTtVQUNFLDBCQUEwQjtVQUMxQixtQ0FBbUM7VUFDbkMsb0JBQWlCO2FBQWpCLGlCQUFpQjtVQUNqQixjQUFjO1FBQ2hCOztRQUVBO1VBQ0UsMEJBQTBCO1FBQzVCOztNQUdGO1FBQ0UsZ0JBQWdCO01BQ2xCOztJQUdGO01BQ0UsaUJBQWlCO0lBQ25CO0FBRUo7O0FBRUE7O0VBRUU7O0FBRUY7RUFDRTs7SUFFRSxpQkFBaUI7SUFDakIscUJBQTRDO0lBQTVDLDRDQUE0QztJQUM1QyxtQkFBbUI7RUFDckI7QUFDRjs7QUFFQTs7RUFFRTs7QUFFRjtJQUVJO01BQ0UsY0FBYztJQUNoQjs7RUFHRjtJQUNFLGtCQUFrQjtFQXNCcEI7O0lBcEJFO01BQ0UsbUNBQW1DO01BQ25DLHVFQUF1RTtNQUN2RSxtQkFBbUI7SUFDckI7TUFHRTtRQUNFLGFBQWE7TUFDZjs7SUFHRjtNQUNFLFdBQVc7TUFDWCxrQkFBa0I7TUFDbEIsb0JBQW9CO01BQ3BCLHFCQUFxQjtNQUNyQixpQkFBaUI7TUFDakIsZ0JBQWdCO0lBQ2xCO0FBRUoiLCJmaWxlIjoiY2FyZC5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvbnRlbnQgQ2FyZFxuICovXG5cbkBsYXllciBkZXNpZ24tc3lzdGVtLmNvbXBvbmVudHMge1xuICAubXgtY2FyZCB7XG4gICAgZGlzcGxheTogZ3JpZDtcbiAgICBnYXA6IHZhcigtLWNhcmQtZ2FwLCB2YXIoLS1nYXApKTtcblxuICAgICZbY2xhc3MqPVwibXgtYmFja2dyb3VuZC0tXCJdIHtcbiAgICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLWJvcmRlci1yYWRpdXMpO1xuXG4gICAgICAmIC5teC1jYXJkX19jb250ZW50IHtcbiAgICAgICAgcGFkZGluZy1pbmxpbmU6IHZhcigtLWNvbnRlbnQtbWluLXNwYWNpbmcsIHZhcigtLXNwYWNpbmctcykpO1xuICAgICAgICBwYWRkaW5nLWJsb2NrLWVuZDogdmFyKC0tY29udGVudC1taW4tc3BhY2luZywgdmFyKC0tc3BhY2luZy1zKSk7XG5cbiAgICAgICAgQGNvbnRhaW5lciAobWluLXdpZHRoOiB0b2tlbihcImJyZWFrcG9pbnQuY29udGVudENhcmRcIikpIHtcbiAgICAgICAgICAtLWNvbnRlbnQtbWluLXNwYWNpbmc6IHZhcigtLWNvbnRlbnQtbWF4LXNwYWNpbmcsIHZhcigtLXNwYWNpbmctbSkpO1xuICAgICAgICB9XG4gICAgICB9XG4gICAgfVxuXG4gICAgJjpoYXMoLm14LWNhcmRfX21lZGlhKSB7XG4gICAgICBncmlkLXRlbXBsYXRlOiBcIm1lZGlhXCIgXCJjb250ZW50XCIgMWZyIC8gMWZyO1xuXG4gICAgICBAY29udGFpbmVyIChtaW4td2lkdGg6IHRva2VuKFwiYnJlYWtwb2ludC5jb250ZW50Q2FyZFwiKSkge1xuICAgICAgICAtLWNhcmQtZ2FwOiB2YXIoLS1nYXAtbCk7XG5cbiAgICAgICAgZ3JpZC10ZW1wbGF0ZTogXCJtZWRpYSBjb250ZW50XCIgMWZyIC8gMWZyIDFmcjtcbiAgICAgICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcblxuICAgICAgICAmLm14LWNhcmQtLXJldmVyc2VkIHtcbiAgICAgICAgICBncmlkLXRlbXBsYXRlLWFyZWFzOiBcImNvbnRlbnQgbWVkaWFcIjtcbiAgICAgICAgfVxuXG4gICAgICAgICYgLm14LWNhcmRfX2NvbnRlbnQge1xuICAgICAgICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgICAgICB9XG4gICAgICB9XG5cbiAgICAgIEBjb250YWluZXIgKG1pbi13aWR0aDogdG9rZW4oXCJicmVha3BvaW50LmxcIikpIHtcbiAgICAgICAgLS1jYXJkLWdhcDogNnJlbTtcbiAgICAgIH1cblxuICAgICAgJltjbGFzcyo9XCJteC1iYWNrZ3JvdW5kLS1cIl0ge1xuICAgICAgICBAY29udGFpbmVyIChtaW4td2lkdGg6IHRva2VuKFwiYnJlYWtwb2ludC5jb250ZW50Q2FyZFwiKSkge1xuICAgICAgICAgICYgLm14LWNhcmRfX2NvbnRlbnQge1xuICAgICAgICAgICAgcGFkZGluZy1ibG9jay1zdGFydDogdmFyKC0tY29udGVudC1taW4tc3BhY2luZywgdmFyKC0tc3BhY2luZy1zKSk7XG4gICAgICAgICAgfVxuXG4gICAgICAgICAgJjp3aGVyZSg6bm90KC5teC1jYXJkLS1yZXZlcnNlZCkpIC5teC1jYXJkX19jb250ZW50IHtcbiAgICAgICAgICAgIHBhZGRpbmctaW5saW5lLXN0YXJ0OiAwO1xuICAgICAgICAgIH1cblxuICAgICAgICAgICYubXgtY2FyZC0tcmV2ZXJzZWQgLm14LWNhcmRfX2NvbnRlbnQge1xuICAgICAgICAgICAgcGFkZGluZy1pbmxpbmUtZW5kOiAwO1xuICAgICAgICAgIH1cbiAgICAgICAgfVxuICAgICAgfVxuXG4gICAgICAmIC5teC1jYXJkX19jb250ZW50IHtcbiAgICAgICAgZ3JpZC1hcmVhOiBjb250ZW50O1xuICAgICAgfVxuXG4gICAgICAmIDppcygubXgtY2FyZF9fbWVkaWEsIGZpZ3VyZSkge1xuICAgICAgICBncmlkLWFyZWE6IG1lZGlhO1xuICAgICAgICBkaXNwbGF5OiBncmlkO1xuICAgICAgICBtYXJnaW46IGF1dG87XG4gICAgICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICAgICAgaW5saW5lLXNpemU6IDEwMCU7XG5cbiAgICAgICAgJiBpbWcge1xuICAgICAgICAgIGFzcGVjdC1yYXRpbzogdmFyKC0tcmF0aW8pO1xuICAgICAgICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLWJvcmRlci1yYWRpdXMpO1xuICAgICAgICAgIG9iamVjdC1maXQ6IGNvdmVyO1xuICAgICAgICAgIGRpc3BsYXk6IGJsb2NrO1xuICAgICAgICB9XG5cbiAgICAgICAgJiAubXgtc2tlbGV0b24tLWJnIHtcbiAgICAgICAgICBhc3BlY3QtcmF0aW86IHZhcigtLXJhdGlvKTtcbiAgICAgICAgfVxuICAgICAgfVxuXG4gICAgICAmIC5teC1jYXJkX19pY29uIHtcbiAgICAgICAgZ3JpZC1hcmVhOiBtZWRpYTtcbiAgICAgIH1cbiAgICB9XG5cbiAgICAmIC5teC1saW5rLWxpc3Qge1xuICAgICAgaW5saW5lLXNpemU6IDEwMCU7XG4gICAgfVxuICB9XG59XG5cbi8qKlxuICogQ29udGVudCBDYXJkIEdyaWRcbiAqL1xuXG5AbGF5ZXIgZGVzaWduLXN5c3RlbS5jb21wb25lbnRzIHtcbiAgLm14LWdyaWQ6aGFzKD4gKjpudGgtY2hpbGQoMik6bGFzdC1jaGlsZClcbiAgICA+IDppcygubXgtY2FyZCwgLm14LWNvbnRhaW5lcjpoYXMoLm14LWNhcmQpKSB7XG4gICAgaW5saW5lLXNpemU6IDEwMCU7XG4gICAgbWF4LWlubGluZS1zaXplOiB2YXIoLS1tYXgtY2FyZC13aWR0aCwgMzdjaCk7XG4gICAgbWFyZ2luLWlubGluZTogYXV0bztcbiAgfVxufVxuXG4vKipcbiAqIENvbnRlbnQgQ2FyZCBMaW5rZWRcbiAqL1xuXG5AbGF5ZXIgZGVzaWduLXN5c3RlbS5jb21wb25lbnRzIHtcbiAgYVtocmVmXS5teC1jYXJkIHtcbiAgICAmOmhvdmVyIHtcbiAgICAgIGNvbG9yOiBpbmhlcml0O1xuICAgIH1cbiAgfVxuXG4gIC5teC1jYXJkLS1ibG9jayB7XG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuXG4gICAgJjpmb2N1cy13aXRoaW4ge1xuICAgICAgYm9yZGVyLXJhZGl1czogdmFyKC0tYm9yZGVyLXJhZGl1cyk7XG4gICAgICBvdXRsaW5lOiB2YXIoLS1vdXRsaW5lLXdpZHRoKSB2YXIoLS1vdXRsaW5lLXN0eWxlKSB2YXIoLS1vdXRsaW5lLWNvbG9yKTtcbiAgICAgIG91dGxpbmUtb2Zmc2V0OiAycHg7XG4gICAgfVxuXG4gICAgJiA6aXMoYVtocmVmXSwgYnV0dG9uKSB7XG4gICAgICAmOmZvY3VzLXZpc2libGUge1xuICAgICAgICBvdXRsaW5lOiBub25lO1xuICAgICAgfVxuICAgIH1cblxuICAgICYgYTo6YWZ0ZXIge1xuICAgICAgY29udGVudDogXCJcIjtcbiAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICAgIGluc2V0LWJsb2NrLXN0YXJ0OiAwO1xuICAgICAgaW5zZXQtaW5saW5lLXN0YXJ0OiAwO1xuICAgICAgaW5saW5lLXNpemU6IDEwMCU7XG4gICAgICBibG9jay1zaXplOiAxMDAlO1xuICAgIH1cbiAgfVxufVxuIl19 */

package/dist/build/chunks/disclosure-widget-CQLPJ8Ta.js

@@ -0,0 +1,124 @@
+import { m as makeAnchor } from "./utilities-B4YZb689.js";
+class DisclosureWidget {
+  constructor(trigger, element, overrides, context = document) {
+    this.init = () => {
+      if (Object.prototype.hasOwnProperty.call(this.trigger, "disclosureWidget"))
+        return;
+      const { attribute, setInitialAttribute } = this.options;
+      this.trigger.disclosureWidget = this;
+      if (setInitialAttribute) this.element.setAttribute(attribute, "");
+      this.attach();
+    };
+    this.handleToggle = () => {
+      const { attribute, setInitialAttribute } = this.options;
+      this.element.toggleAttribute(attribute);
+      const hasAttribute = this.element.hasAttribute(attribute);
+      this.isOpen = setInitialAttribute ? !hasAttribute : hasAttribute;
+      this.trigger.setAttribute("aria-expanded", String(this.isOpen));
+      const newEvent = new CustomEvent(
+        "disclosure-toggle",
+        {
+          bubbles: true,
+          cancelable: true,
+          detail: {
+            isOpen: this.isOpen,
+            id: this.id,
+            options: this.options,
+            target: this.element
+          }
+        }
+      );
+      this.trigger.dispatchEvent(newEvent);
+    };
+    this.handleMouse = (event) => {
+      const { currentTarget, type, relatedTarget } = event;
+      if (type === "mouseover" || type === "mouseout") {
+        const triggerParent = this.trigger.parentNode;
+        if (triggerParent !== currentTarget || triggerParent.contains(relatedTarget))
+          return;
+      } else if (this.trigger !== currentTarget) return;
+      const { shouldPreventDefault } = this.options;
+      this.handleToggle();
+      if (shouldPreventDefault) {
+        event.preventDefault();
+        event.stopPropagation();
+      }
+    };
+    this.handleKeyboard = (event) => {
+      const { key, target } = event;
+      if (this.trigger !== target) return;
+      const { isOpen } = this;
+      const { shouldPreventDefault } = this.options;
+      switch (key) {
+        case "ArrowDown":
+        case "Enter":
+          if (!isOpen) this.handleToggle();
+          if (shouldPreventDefault) event.preventDefault();
+          break;
+        case "ArrowUp":
+        case "Escape":
+          if (isOpen) this.handleToggle();
+          if (shouldPreventDefault) event.preventDefault();
+          break;
+      }
+    };
+    this.attach = () => {
+      if (this.attached) return;
+      const { clickEvent } = this.options;
+      if (clickEvent === "mouseover") {
+        const parent = this.trigger.parentNode;
+        parent.addEventListener("mouseover", this.handleMouse);
+        parent.addEventListener("mouseout", this.handleMouse);
+      } else {
+        this.trigger.addEventListener("click", this.handleMouse);
+      }
+      this.trigger.addEventListener("keydown", this.handleKeyboard);
+      this.trigger.setAttribute("aria-expanded", "false");
+      if (!this.trigger.hasAttribute("aria-controls"))
+        this.trigger.setAttribute("aria-controls", this.id);
+      this.attached = true;
+    };
+    this.detach = () => {
+      if (!this.attached) return;
+      if (this.isOpen) {
+        this.handleToggle();
+      }
+      const { clickEvent } = this.options;
+      if (clickEvent === "mouseover") {
+        const parent = this.trigger.parentNode;
+        parent.removeEventListener("mouseover", this.handleMouse);
+        parent.removeEventListener("mouseout", this.handleMouse);
+      } else {
+        this.trigger.removeEventListener("click", this.handleMouse);
+      }
+      this.trigger.removeEventListener("keydown", this.handleKeyboard);
+      this.trigger.removeAttribute("aria-expanded");
+      this.attached = false;
+    };
+    this.generatedId = () => {
+      const string = this.trigger?.textContent?.trim();
+      return !string ? "" : makeAnchor(string);
+    };
+    if (!trigger) {
+      throw new Error("toggle is required.");
+    }
+    if (!element) {
+      throw new Error("element is required.");
+    }
+    const options = {
+      attribute: "inert",
+      shouldPreventDefault: true,
+      setInitialAttribute: true,
+      clickEvent: "click"
+    };
+    this.options = { ...options, ...overrides };
+    this.context = context || document;
+    this.trigger = trigger;
+    this.element = element;
+    this.id = this.element.id || this.generatedId();
+  }
+}
+export {
+  DisclosureWidget as D
+};
+//# sourceMappingURL=disclosure-widget-CQLPJ8Ta.js.map

package/dist/build/chunks/disclosure-widget-CQLPJ8Ta.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"disclosure-widget-CQLPJ8Ta.js","sources":["../../../src/Utility/Elements/disclosure-widget.ts"],"sourcesContent":["/**\n * Class for a generic Disclosure Widget.\n */\nimport { makeAnchor } from \"../utilities\"\n\ntype DisclosureWidgetOptions = {\n  attribute?: string\n  shouldPreventDefault?: boolean\n  setInitialAttribute?: boolean\n  clickEvent?: \"click\" | \"mouseover\"\n}\n\nexport type DisclosureWidgetEvent = {\n  isOpen: boolean\n  id: string\n  options: DisclosureWidgetOptions\n  target: Element\n}\n\nexport default class DisclosureWidget {\n  options: DisclosureWidgetOptions\n  context: Document | Element\n  trigger: Element & { disclosureWidget?: DisclosureWidget }\n  element: Element\n  id: string\n  isOpen?: boolean\n  attached?: boolean\n\n  constructor(\n    trigger: Element,\n    element: Element,\n    overrides?: DisclosureWidgetOptions,\n    context: Element | Document = document,\n  ) {\n    if (!trigger) {\n      throw new Error(\"toggle is required.\")\n    }\n    if (!element) {\n      throw new Error(\"element is required.\")\n    }\n    const options: DisclosureWidgetOptions = {\n      attribute: \"inert\",\n      shouldPreventDefault: true,\n      setInitialAttribute: true,\n      clickEvent: \"click\",\n    }\n\n    this.options = { ...options, ...overrides }\n    this.context = context || document\n    this.trigger = trigger\n    this.element = element\n    this.id = this.element.id || this.generatedId()\n  }\n\n  init = (): void => {\n    if (Object.prototype.hasOwnProperty.call(this.trigger, \"disclosureWidget\"))\n      return\n    const { attribute, setInitialAttribute } = this.options\n    this.trigger.disclosureWidget = this\n    if (setInitialAttribute) this.element.setAttribute(attribute, \"\")\n    this.attach()\n  }\n\n  handleToggle = (): void => {\n    const { attribute, setInitialAttribute } = this.options\n    this.element.toggleAttribute(attribute)\n    const hasAttribute: boolean = this.element.hasAttribute(attribute)\n    this.isOpen = setInitialAttribute ? !hasAttribute : hasAttribute\n    this.trigger.setAttribute(\"aria-expanded\", String(this.isOpen))\n    const newEvent: CustomEvent<DisclosureWidgetEvent> = new CustomEvent(\n      \"disclosure-toggle\",\n      {\n        bubbles: true,\n        cancelable: true,\n        detail: {\n          isOpen: this.isOpen,\n          id: this.id,\n          options: this.options,\n          target: this.element,\n        },\n      },\n    )\n    this.trigger.dispatchEvent(newEvent)\n  }\n\n  handleMouse = (event: MouseEvent): void => {\n    const { currentTarget, type, relatedTarget } = event\n\n    if (type === \"mouseover\" || type === \"mouseout\") {\n      const triggerParent = this.trigger.parentNode\n      if (\n        triggerParent !== currentTarget ||\n        triggerParent.contains(relatedTarget as HTMLElement)\n      )\n        return\n    } else if (this.trigger !== currentTarget) return\n\n    const { shouldPreventDefault } = this.options\n    this.handleToggle()\n    if (shouldPreventDefault) {\n      event.preventDefault()\n      event.stopPropagation()\n    }\n  }\n\n  handleKeyboard = (event: KeyboardEvent): void => {\n    const { key, target } = event\n    if (this.trigger !== target) return\n    const { isOpen } = this\n    const { shouldPreventDefault } = this.options\n\n    switch (key) {\n      // Down/Enter should open it.\n      case \"ArrowDown\":\n      case \"Enter\":\n        if (!isOpen) this.handleToggle()\n        if (shouldPreventDefault) event.preventDefault()\n        break\n\n      // Up/Esc should close it.\n      case \"ArrowUp\":\n      case \"Escape\":\n        if (isOpen) this.handleToggle()\n        if (shouldPreventDefault) event.preventDefault()\n        break\n\n      default:\n        break\n    }\n  }\n\n  attach = (): void => {\n    if (this.attached) return\n    const { clickEvent } = this.options\n    if (clickEvent === \"mouseover\") {\n      const parent = this.trigger.parentNode\n      parent.addEventListener(\"mouseover\", this.handleMouse)\n      parent.addEventListener(\"mouseout\", this.handleMouse)\n    } else {\n      this.trigger.addEventListener(\"click\", this.handleMouse)\n    }\n    this.trigger.addEventListener(\"keydown\", this.handleKeyboard)\n\n    this.trigger.setAttribute(\"aria-expanded\", \"false\")\n    if (!this.trigger.hasAttribute(\"aria-controls\"))\n      this.trigger.setAttribute(\"aria-controls\", this.id)\n    this.attached = true\n  }\n\n  detach = (): void => {\n    if (!this.attached) return\n    if (this.isOpen) {\n      this.handleToggle()\n    }\n    const { clickEvent } = this.options\n    if (clickEvent === \"mouseover\") {\n      const parent = this.trigger.parentNode\n      parent.removeEventListener(\"mouseover\", this.handleMouse)\n      parent.removeEventListener(\"mouseout\", this.handleMouse)\n    } else {\n      this.trigger.removeEventListener(\"click\", this.handleMouse)\n    }\n    this.trigger.removeEventListener(\"keydown\", this.handleKeyboard)\n\n    this.trigger.removeAttribute(\"aria-expanded\")\n    this.attached = false\n  }\n\n  generatedId = (): string => {\n    const string: string | undefined = this.trigger?.textContent?.trim()\n    return !string ? \"\" : makeAnchor(string)\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/build/chunks/drop-menu.entry-BC6x9vst.js

@@ -0,0 +1,132 @@
+import { m as makeAnchor } from "./utilities-B4YZb689.js";
+import { K as Keyboard } from "./keyboard-C73DHu0c.js";
+class DropMenu extends HTMLElement {
+  constructor() {
+    super();
+    this.keyboard = new Keyboard();
+    this.handleSelect = (event) => {
+      const target = event.target;
+      this.items.forEach((item) => {
+        if (!(item instanceof HTMLButtonElement)) return;
+        item.setAttribute("aria-checked", String(item === target));
+      });
+      const newEvent = new CustomEvent("drop-menu-select", {
+        bubbles: true,
+        cancelable: true,
+        detail: {
+          event,
+          target
+        }
+      });
+      this.menu.dispatchEvent(newEvent);
+      if (this.closeOnClick) this.menu.togglePopover();
+    };
+    this.handleToggle = ({ newState }) => {
+      const handleClose = () => this.menu.togglePopover();
+      if (newState === "open") {
+        this.keyboard.attachPopup(this.menu.id, handleClose);
+      } else {
+        this.keyboard.detachPopup(this.menu.id);
+      }
+    };
+    this.attachKeyboardMenu = () => {
+      this.keyboard.attachMenu(this.menu, this.items);
+    };
+    this.detachKeyboardMenu = () => {
+      this.keyboard.detachMenu();
+    };
+    this.generatedId = () => {
+      const string = this.trigger?.textContent?.trim();
+      return !string ? "" : makeAnchor(string);
+    };
+    this.internals_ = this.attachInternals();
+    this.controller = new AbortController();
+  }
+  async connectedCallback() {
+    if (!this.menu || !this.trigger) return;
+    if (!("anchorName" in document.documentElement.style)) {
+      const { default: Polyfills } = await import("./polyfills-CJ5uTmUJ.js");
+      new Polyfills(this.menu);
+    }
+    if (!Object.hasOwn(HTMLElement, "popover")) {
+      await import("./popover-wbPSyFRj.js");
+    }
+    this.closeOnClick = this.hasAttribute("closeonclick");
+    const { signal } = this.controller;
+    document.addEventListener(
+      "click",
+      (event) => {
+        const { target } = event;
+        if (target !== this.menu && ![...this.items].includes(
+          target
+        ))
+          return;
+        this.handleSelect(event);
+        event.preventDefault();
+      },
+      {
+        signal
+      }
+    );
+    document.addEventListener(
+      "keydown",
+      (event) => {
+        const { target, key } = event;
+        if (target !== this.menu && ![...this.items].includes(
+          target
+        ))
+          return;
+        if (key === "Enter") this.handleSelect(event);
+        event.preventDefault();
+      },
+      {
+        signal
+      }
+    );
+    this.keyboard.attachEventListeners(signal);
+    this.menu.addEventListener("focusin", this.attachKeyboardMenu, {
+      signal
+    });
+    this.menu.addEventListener("focusout", this.detachKeyboardMenu, {
+      signal
+    });
+    this.menu.addEventListener("toggle", this.handleToggle, {
+      signal
+    });
+  }
+  disconnectedCallback() {
+    this.controller.abort();
+    this.keyboard.detachMenu();
+  }
+  get menu() {
+    const menu = this.querySelector("[popover]");
+    if (!menu) {
+      throw new Error(`${this.localName} must contain a <div popover> element.`);
+    }
+    menu.id = menu.id || this.generatedId();
+    return menu;
+  }
+  get items() {
+    const items = this.menu.querySelectorAll(":scope > *");
+    if (!items) {
+      throw new Error(`${this.localName} must contain some menu items.`);
+    }
+    return items;
+  }
+  get trigger() {
+    const trigger = this.querySelector(
+      `[popovertarget=${this.menu?.id}]`
+    );
+    if (!trigger) {
+      throw new Error(
+        `${this.localName} must contain a <button popovertarget="${this.menu.id}">`
+      );
+    }
+    return trigger;
+  }
+}
+customElements.define("mx-dropmenu", DropMenu);
+export {
+  DropMenu as D
+};
+//# sourceMappingURL=drop-menu.entry-BC6x9vst.js.map

package/dist/build/chunks/drop-menu.entry-BC6x9vst.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drop-menu.entry-BC6x9vst.js","sources":["../../../src/Component/DropMenu/Elements/DropMenu.ts"],"sourcesContent":["/**\n * DropMenu\n * @file Create a DropMenu using the Popover and Anchor APIs\n */\n\nimport { Keyboard, makeAnchor } from \"../../../Utility/utilities\"\n\nexport type DropMenuEvent = CustomEvent<{\n  event: MouseEvent | KeyboardEvent\n  target: HTMLButtonElement | HTMLAnchorElement\n}>\n\nexport default class DropMenu extends HTMLElement {\n  internals_: ElementInternals\n  controller: AbortController\n  keyboard: Keyboard = new Keyboard()\n  closeOnClick: boolean\n\n  constructor() {\n    super()\n    this.internals_ = this.attachInternals()\n    this.controller = new AbortController()\n  }\n\n  async connectedCallback() {\n    if (!this.menu || !this.trigger) return\n\n    // Polyfill anchor (everywhere so far).\n    if (!(\"anchorName\" in document.documentElement.style)) {\n      const { default: Polyfills } = await import(\"../polyfills.js\")\n      new Polyfills(this.menu) // eslint-disable-line no-new\n    }\n    // Polyfill popover (FF only)\n    if (!Object.hasOwn(HTMLElement, \"popover\")) {\n      await import(\"@oddbird/popover-polyfill\")\n    }\n    this.closeOnClick = this.hasAttribute(\"closeonclick\")\n\n    const { signal }: AbortController = this.controller\n    document.addEventListener(\n      \"click\",\n      (event: MouseEvent): void => {\n        const { target } = event\n        if (\n          (target as HTMLElement) !== this.menu &&\n          ![...this.items].includes(\n            target as HTMLButtonElement | HTMLAnchorElement,\n          )\n        )\n          return\n        this.handleSelect(event)\n        event.preventDefault()\n      },\n      {\n        signal,\n      },\n    )\n\n    document.addEventListener(\n      \"keydown\",\n      (event: KeyboardEvent): void => {\n        const { target, key } = event\n        if (\n          (target as HTMLElement) !== this.menu &&\n          ![...this.items].includes(\n            target as HTMLButtonElement | HTMLAnchorElement,\n          )\n        )\n          return\n        if (key === \"Enter\") this.handleSelect(event)\n        event.preventDefault()\n      },\n      {\n        signal,\n      },\n    )\n\n    this.keyboard.attachEventListeners(signal)\n    this.menu.addEventListener(\"focusin\", this.attachKeyboardMenu, {\n      signal,\n    })\n    this.menu.addEventListener(\"focusout\", this.detachKeyboardMenu, {\n      signal,\n    })\n    this.menu.addEventListener(\"toggle\", this.handleToggle, {\n      signal,\n    })\n  }\n\n  disconnectedCallback(): void {\n    this.controller.abort()\n    this.keyboard.detachMenu()\n  }\n\n  handleSelect = (event: MouseEvent | KeyboardEvent): void => {\n    const target = event.target as HTMLButtonElement | HTMLAnchorElement\n    this.items.forEach(item => {\n      if (!(item instanceof HTMLButtonElement)) return\n      item.setAttribute(\"aria-checked\", String(item === target))\n    })\n    const newEvent: DropMenuEvent = new CustomEvent(\"drop-menu-select\", {\n      bubbles: true,\n      cancelable: true,\n      detail: {\n        event,\n        target,\n      },\n    })\n    this.menu.dispatchEvent(newEvent)\n    if (this.closeOnClick) this.menu.togglePopover()\n  }\n\n  handleToggle = ({ newState }: ToggleEvent): void => {\n    const handleClose = () => this.menu.togglePopover()\n    if (newState === \"open\") {\n      this.keyboard.attachPopup(this.menu.id, handleClose)\n    } else {\n      this.keyboard.detachPopup(this.menu.id)\n    }\n  }\n\n  attachKeyboardMenu = (): void => {\n    this.keyboard.attachMenu(this.menu, this.items)\n  }\n\n  detachKeyboardMenu = (): void => {\n    this.keyboard.detachMenu()\n  }\n\n  get menu(): HTMLDivElement | null {\n    const menu: HTMLDivElement | null = this.querySelector(\"[popover]\")\n    if (!menu) {\n      throw new Error(`${this.localName} must contain a <div popover> element.`)\n    }\n    menu.id = menu.id || this.generatedId()\n    return menu\n  }\n\n  get items(): NodeListOf<HTMLButtonElement | HTMLAnchorElement> {\n    const items: NodeListOf<HTMLButtonElement | HTMLAnchorElement> =\n      this.menu.querySelectorAll(\":scope > *\")\n    if (!items) {\n      throw new Error(`${this.localName} must contain some menu items.`)\n    }\n    return items\n  }\n\n  get trigger(): HTMLButtonElement | null {\n    const trigger: HTMLButtonElement | null = this.querySelector(\n      `[popovertarget=${this.menu?.id}]`,\n    )\n    if (!trigger) {\n      throw new Error(\n        `${this.localName} must contain a <button popovertarget=\"${this.menu.id}\">`,\n      )\n    }\n    return trigger\n  }\n\n  generatedId = (): string => {\n    const string: string | undefined = this.trigger?.textContent?.trim()\n    return !string ? \"\" : makeAnchor(string)\n  }\n}\n\ncustomElements.define(\"mx-dropmenu\", DropMenu)\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"mx-dropmenu\": DropMenu\n  }\n}\n"],"names":[],"mappings":"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"}