@manzanohq/components 0.1.1

package/dist/components/badge/badge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../src/components/badge/badge.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAE/C,cAAc,sBAAsB,CAAC;AAIrC,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}

package/dist/components/badge/badge.js

@@ -0,0 +1,4 @@
+import { MzBadge } from "./badge.component.js";
+export * from "./badge.component.js";
+MzBadge.define("mz-badge");
+//# sourceMappingURL=badge.js.map

package/dist/components/badge/badge.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/badge/badge.ts"],
+  "sourcesContent": ["import { MzBadge } from './badge.component.js';\n\nexport * from './badge.component.js';\n\nMzBadge.define('mz-badge');\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'mz-badge': MzBadge;\n  }\n}\n"],
+  "mappings": "AAAA,SAAS,eAAe;AAExB,cAAc;AAEd,QAAQ,OAAO,UAAU;",
+  "names": []
+}

package/dist/components/badge/badge.styles.d.ts

@@ -0,0 +1,3 @@
+declare const _default: import("lit").CSSResult[];
+export default _default;
+//# sourceMappingURL=badge.styles.d.ts.map

package/dist/components/badge/badge.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge.styles.d.ts","sourceRoot":"","sources":["../../../src/components/badge/badge.styles.ts"],"names":[],"mappings":";AAGA,wBAoGE"}

package/dist/components/badge/badge.styles.js

@@ -0,0 +1,107 @@
+import { css } from "lit";
+import componentStyles from "../../styles/component.styles.js";
+var badge_styles_default = [
+  componentStyles,
+  css`
+    @layer base, variants, appearances, sizes, states;
+
+    @layer base {
+      :host {
+        display: inline-flex;
+      }
+
+      .badge {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        gap: var(--mz-space-2xs);
+        white-space: nowrap;
+        font-family: var(--mz-font-sans);
+        font-weight: var(--mz-font-weight-medium);
+        line-height: var(--mz-line-height-dense);
+        border: var(--mz-border-width-sm) solid transparent;
+        border-radius: var(--_radius, var(--mz-badge-radius, var(--mz-radius-pill)));
+        background: var(--_bg);
+        color: var(--_text);
+        border-color: var(--_border, transparent);
+        font-size: var(--_font-size);
+        padding: var(--_padding);
+      }
+    }
+
+    @layer variants {
+      :host([variant='primary']) {
+        --_color: var(--mz-color-primary);
+        --_on-color: var(--mz-color-on-primary);
+      }
+
+      :host([variant='danger']) {
+        --_color: var(--mz-color-danger);
+        --_on-color: var(--mz-color-on-danger);
+      }
+
+      :host([variant='success']) {
+        --_color: var(--mz-color-success);
+        --_on-color: var(--mz-color-on-success);
+      }
+
+      :host([variant='warning']) {
+        --_color: var(--mz-color-warning);
+        --_on-color: var(--mz-color-on-warning);
+      }
+
+      :host([variant='neutral']),
+      :host(:not([variant])) {
+        --_color: var(--mz-color-neutral);
+        --_on-color: var(--mz-color-on-neutral);
+      }
+    }
+
+    @layer appearances {
+      :host([appearance='filled']),
+      :host(:not([appearance])) {
+        --_bg: var(--mz-badge-bg, var(--_color));
+        --_text: var(--mz-badge-color, var(--_on-color));
+      }
+
+      :host([appearance='outline']) {
+        --_bg: transparent;
+        --_text: var(--_color);
+        --_border: var(--_color);
+      }
+
+      :host([appearance='soft']) {
+        --_bg: color-mix(in srgb, var(--_color) 15%, transparent);
+        --_text: var(--_color);
+      }
+    }
+
+    @layer sizes {
+      :host([size='sm']) {
+        --_font-size: var(--mz-font-size-2xs);
+        --_padding: var(--mz-space-2xs) var(--mz-space-sm);
+      }
+
+      :host([size='md']),
+      :host(:not([size])) {
+        --_font-size: var(--mz-font-size-xs);
+        --_padding: var(--mz-space-2xs) var(--mz-space-md);
+      }
+
+      :host([size='lg']) {
+        --_font-size: var(--mz-font-size-sm);
+        --_padding: var(--mz-space-xs) var(--mz-space-lg);
+      }
+    }
+
+    @layer states {
+      :host([pill]) {
+        --_radius: var(--mz-radius-pill);
+      }
+    }
+  `
+];
+export {
+  badge_styles_default as default
+};
+//# sourceMappingURL=badge.styles.js.map

package/dist/components/badge/badge.styles.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/badge/badge.styles.ts"],
+  "sourcesContent": ["import { css } from 'lit';\nimport componentStyles from '../../styles/component.styles.js';\n\nexport default [\n  componentStyles,\n  css`\n    @layer base, variants, appearances, sizes, states;\n\n    @layer base {\n      :host {\n        display: inline-flex;\n      }\n\n      .badge {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        gap: var(--mz-space-2xs);\n        white-space: nowrap;\n        font-family: var(--mz-font-sans);\n        font-weight: var(--mz-font-weight-medium);\n        line-height: var(--mz-line-height-dense);\n        border: var(--mz-border-width-sm) solid transparent;\n        border-radius: var(--_radius, var(--mz-badge-radius, var(--mz-radius-pill)));\n        background: var(--_bg);\n        color: var(--_text);\n        border-color: var(--_border, transparent);\n        font-size: var(--_font-size);\n        padding: var(--_padding);\n      }\n    }\n\n    @layer variants {\n      :host([variant='primary']) {\n        --_color: var(--mz-color-primary);\n        --_on-color: var(--mz-color-on-primary);\n      }\n\n      :host([variant='danger']) {\n        --_color: var(--mz-color-danger);\n        --_on-color: var(--mz-color-on-danger);\n      }\n\n      :host([variant='success']) {\n        --_color: var(--mz-color-success);\n        --_on-color: var(--mz-color-on-success);\n      }\n\n      :host([variant='warning']) {\n        --_color: var(--mz-color-warning);\n        --_on-color: var(--mz-color-on-warning);\n      }\n\n      :host([variant='neutral']),\n      :host(:not([variant])) {\n        --_color: var(--mz-color-neutral);\n        --_on-color: var(--mz-color-on-neutral);\n      }\n    }\n\n    @layer appearances {\n      :host([appearance='filled']),\n      :host(:not([appearance])) {\n        --_bg: var(--mz-badge-bg, var(--_color));\n        --_text: var(--mz-badge-color, var(--_on-color));\n      }\n\n      :host([appearance='outline']) {\n        --_bg: transparent;\n        --_text: var(--_color);\n        --_border: var(--_color);\n      }\n\n      :host([appearance='soft']) {\n        --_bg: color-mix(in srgb, var(--_color) 15%, transparent);\n        --_text: var(--_color);\n      }\n    }\n\n    @layer sizes {\n      :host([size='sm']) {\n        --_font-size: var(--mz-font-size-2xs);\n        --_padding: var(--mz-space-2xs) var(--mz-space-sm);\n      }\n\n      :host([size='md']),\n      :host(:not([size])) {\n        --_font-size: var(--mz-font-size-xs);\n        --_padding: var(--mz-space-2xs) var(--mz-space-md);\n      }\n\n      :host([size='lg']) {\n        --_font-size: var(--mz-font-size-sm);\n        --_padding: var(--mz-space-xs) var(--mz-space-lg);\n      }\n    }\n\n    @layer states {\n      :host([pill]) {\n        --_radius: var(--mz-radius-pill);\n      }\n    }\n  `\n];\n"],
+  "mappings": "AAAA,SAAS,WAAW;AACpB,OAAO,qBAAqB;AAE5B,IAAO,uBAAQ;AAAA,EACb;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkGF;",
+  "names": []
+}

package/dist/components/button/button.component.d.ts

@@ -0,0 +1,72 @@
+import { ManzanoElement } from '../../internal/manzano-element.js';
+import { MzSpinner } from '../spinner/spinner.component.js';
+import { MzIcon } from '../icon/icon.component.js';
+/**
+ * @summary A button component with multiple variants and appearances.
+ *
+ * @tag mz-button
+ *
+ * @dependency mz-spinner
+ * @dependency mz-icon
+ *
+ * @slot - The button's label.
+ * @slot prefix - Content to render before the label.
+ * @slot suffix - Content to render after the label.
+ *
+ * @event mz-focus - Emitted when the button gains focus.
+ * @event mz-blur - Emitted when the button loses focus.
+ *
+ * @csspart base - The button's base wrapper.
+ * @csspart prefix - The prefix container.
+ * @csspart label - The label container.
+ * @csspart suffix - The suffix container.
+ *
+ * @cssproperty --mz-button-bg - Override the button background.
+ * @cssproperty --mz-button-color - Override the button text color.
+ * @cssproperty --mz-button-radius - Override the button border radius.
+ */
+export declare class MzButton extends ManzanoElement {
+    static styles: import("lit").CSSResult[];
+    static formAssociated: boolean;
+    static dependencies: {
+        'mz-spinner': typeof MzSpinner;
+        'mz-icon': typeof MzIcon;
+    };
+    private readonly formController;
+    private readonly hasSlotController;
+    /** The button's semantic variant. */
+    variant: 'primary' | 'danger' | 'success' | 'warning' | 'neutral';
+    /** The button's visual appearance. */
+    appearance: 'filled' | 'outline' | 'ghost' | 'link';
+    /** The button's size. */
+    size: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    /** Renders a pill-shaped button. */
+    pill: boolean;
+    /** Renders the button in a loading state. */
+    loading: boolean;
+    /** Disables the button. */
+    disabled: boolean;
+    /** The button's type (for form participation). */
+    type: 'button' | 'submit' | 'reset';
+    /** The button's name (for form participation). */
+    name: string;
+    /** The button's value (for form participation). */
+    value: string;
+    /** Renders the button as a link. */
+    href: string;
+    /** The target attribute for link buttons. */
+    target: '_blank' | '_parent' | '_self' | '_top' | '';
+    /** The download attribute for link buttons. */
+    download?: string;
+    /** Simulates a click on the button. */
+    click(): void;
+    /** Sets focus on the button. */
+    focus(options?: FocusOptions): void;
+    /** Removes focus from the button. */
+    blur(): void;
+    private handleClick;
+    private handleFocus;
+    private handleBlur;
+    render(): import("lit").TemplateResult<1>;
+}
+//# sourceMappingURL=button.component.d.ts.map

package/dist/components/button/button.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.component.d.ts","sourceRoot":"","sources":["../../../src/components/button/button.component.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AAGnE,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAGnD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,qBAAa,QAAS,SAAQ,cAAc;IAC1C,MAAM,CAAC,MAAM,4BAAU;IACvB,MAAM,CAAC,cAAc,UAAQ;IAE7B,MAAM,CAAC,YAAY;;;MAGjB;IAEF,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAmC;IAClE,OAAO,CAAC,QAAQ,CAAC,iBAAiB,CAAmD;IAErF,qCAAqC;IACR,OAAO,EAAE,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAa;IAE3G,sCAAsC;IACT,UAAU,EAAE,QAAQ,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAY;IAE5F,yBAAyB;IACI,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAE3E,oCAAoC;IACQ,IAAI,UAAS;IAEzD,6CAA6C;IACD,OAAO,UAAS;IAE5D,2BAA2B;IACiB,QAAQ,UAAS;IAE7D,kDAAkD;IACtC,IAAI,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAY;IAE3D,kDAAkD;IACtC,IAAI,SAAM;IAEtB,mDAAmD;IACvC,KAAK,SAAM;IAEvB,oCAAoC;IACxB,IAAI,SAAM;IAEtB,6CAA6C;IACjC,MAAM,EAAE,QAAQ,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,EAAE,CAAM;IAEtE,+CAA+C;IACnC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAE9B,uCAAuC;IACvC,KAAK,IAAI,IAAI;IAIb,gCAAgC;IAChC,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY,GAAG,IAAI;IAInC,qCAAqC;IACrC,IAAI,IAAI,IAAI;IAIZ,OAAO,CAAC,WAAW;IAcnB,OAAO,CAAC,WAAW;IAInB,OAAO,CAAC,UAAU;IAIlB,MAAM;CA+DP"}

package/dist/components/button/button.component.js

@@ -0,0 +1,169 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+import { html, nothing } from "lit";
+import { property } from "lit/decorators.js";
+import { classMap } from "lit/directives/class-map.js";
+import { ifDefined } from "lit/directives/if-defined.js";
+import { ManzanoElement } from "../../internal/manzano-element.js";
+import { FormControlController } from "../../internal/form.js";
+import { HasSlotController } from "../../internal/slot.js";
+import { MzSpinner } from "../spinner/spinner.component.js";
+import { MzIcon } from "../icon/icon.component.js";
+import styles from "./button.styles.js";
+class MzButton extends ManzanoElement {
+  constructor() {
+    super(...arguments);
+    this.formController = new FormControlController(this);
+    this.hasSlotController = new HasSlotController(this, "prefix", "suffix");
+    this.variant = "neutral";
+    this.appearance = "filled";
+    this.size = "md";
+    this.pill = false;
+    this.loading = false;
+    this.disabled = false;
+    this.type = "button";
+    this.name = "";
+    this.value = "";
+    this.href = "";
+    this.target = "";
+  }
+  /** Simulates a click on the button. */
+  click() {
+    this.shadowRoot?.querySelector(".button")?.click();
+  }
+  /** Sets focus on the button. */
+  focus(options) {
+    this.shadowRoot?.querySelector(".button")?.focus(options);
+  }
+  /** Removes focus from the button. */
+  blur() {
+    this.shadowRoot?.querySelector(".button")?.blur();
+  }
+  handleClick(event) {
+    if (this.disabled || this.loading) {
+      event.preventDefault();
+      event.stopPropagation();
+      return;
+    }
+    if (this.type === "submit") {
+      this.formController.form?.requestSubmit();
+    } else if (this.type === "reset") {
+      this.formController.form?.reset();
+    }
+  }
+  handleFocus() {
+    this.emit("mz-focus");
+  }
+  handleBlur() {
+    this.emit("mz-blur");
+  }
+  render() {
+    const isLink = this.href.length > 0;
+    const hasPrefix = this.hasSlotController.test("prefix");
+    const hasSuffix = this.hasSlotController.test("suffix");
+    const classes = {
+      button: true,
+      "button--loading": this.loading,
+      "button--disabled": this.disabled,
+      "button--has-prefix": hasPrefix,
+      "button--has-suffix": hasSuffix
+    };
+    const inner = html`
+      ${hasPrefix ? html`<span part="prefix" class="button__prefix"><slot name="prefix"></slot></span>` : nothing}
+      <span part="label" class="button__label"><slot></slot></span>
+      ${hasSuffix ? html`<span part="suffix" class="button__suffix"><slot name="suffix"></slot></span>` : nothing}
+      ${this.loading ? html`<span class="button__spinner"><mz-spinner></mz-spinner></span>` : nothing}
+    `;
+    if (isLink) {
+      return html`
+        <a
+          part="base"
+          class=${classMap(classes)}
+          href=${this.href}
+          target=${ifDefined(this.target || void 0)}
+          download=${ifDefined(this.download)}
+          rel=${this.target === "_blank" ? "noopener noreferrer" : nothing}
+          role="button"
+          aria-disabled=${this.disabled}
+          tabindex=${this.disabled ? "-1" : "0"}
+          @click=${this.handleClick}
+          @focus=${this.handleFocus}
+          @blur=${this.handleBlur}
+        >
+          ${inner}
+        </a>
+      `;
+    }
+    return html`
+      <button
+        part="base"
+        class=${classMap(classes)}
+        ?disabled=${this.disabled}
+        type=${this.type}
+        name=${ifDefined(this.name || void 0)}
+        value=${ifDefined(this.value || void 0)}
+        aria-disabled=${this.disabled}
+        aria-busy=${this.loading}
+        @click=${this.handleClick}
+        @focus=${this.handleFocus}
+        @blur=${this.handleBlur}
+      >
+        ${inner}
+      </button>
+    `;
+  }
+}
+MzButton.styles = styles;
+MzButton.formAssociated = true;
+MzButton.dependencies = {
+  "mz-spinner": MzSpinner,
+  "mz-icon": MzIcon
+};
+__decorateClass([
+  property({ reflect: true })
+], MzButton.prototype, "variant", 2);
+__decorateClass([
+  property({ reflect: true })
+], MzButton.prototype, "appearance", 2);
+__decorateClass([
+  property({ reflect: true })
+], MzButton.prototype, "size", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], MzButton.prototype, "pill", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], MzButton.prototype, "loading", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], MzButton.prototype, "disabled", 2);
+__decorateClass([
+  property()
+], MzButton.prototype, "type", 2);
+__decorateClass([
+  property()
+], MzButton.prototype, "name", 2);
+__decorateClass([
+  property()
+], MzButton.prototype, "value", 2);
+__decorateClass([
+  property()
+], MzButton.prototype, "href", 2);
+__decorateClass([
+  property()
+], MzButton.prototype, "target", 2);
+__decorateClass([
+  property()
+], MzButton.prototype, "download", 2);
+export {
+  MzButton
+};
+//# sourceMappingURL=button.component.js.map

package/dist/components/button/button.component.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/button/button.component.ts"],
+  "sourcesContent": ["import { html, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { ManzanoElement } from '../../internal/manzano-element.js';\nimport { FormControlController } from '../../internal/form.js';\nimport { HasSlotController } from '../../internal/slot.js';\nimport { MzSpinner } from '../spinner/spinner.component.js';\nimport { MzIcon } from '../icon/icon.component.js';\nimport styles from './button.styles.js';\n\n/**\n * @summary A button component with multiple variants and appearances.\n *\n * @tag mz-button\n *\n * @dependency mz-spinner\n * @dependency mz-icon\n *\n * @slot - The button's label.\n * @slot prefix - Content to render before the label.\n * @slot suffix - Content to render after the label.\n *\n * @event mz-focus - Emitted when the button gains focus.\n * @event mz-blur - Emitted when the button loses focus.\n *\n * @csspart base - The button's base wrapper.\n * @csspart prefix - The prefix container.\n * @csspart label - The label container.\n * @csspart suffix - The suffix container.\n *\n * @cssproperty --mz-button-bg - Override the button background.\n * @cssproperty --mz-button-color - Override the button text color.\n * @cssproperty --mz-button-radius - Override the button border radius.\n */\nexport class MzButton extends ManzanoElement {\n  static styles = styles;\n  static formAssociated = true;\n\n  static dependencies = {\n    'mz-spinner': MzSpinner,\n    'mz-icon': MzIcon\n  };\n\n  private readonly formController = new FormControlController(this);\n  private readonly hasSlotController = new HasSlotController(this, 'prefix', 'suffix');\n\n  /** The button's semantic variant. */\n  @property({ reflect: true }) variant: 'primary' | 'danger' | 'success' | 'warning' | 'neutral' = 'neutral';\n\n  /** The button's visual appearance. */\n  @property({ reflect: true }) appearance: 'filled' | 'outline' | 'ghost' | 'link' = 'filled';\n\n  /** The button's size. */\n  @property({ reflect: true }) size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'md';\n\n  /** Renders a pill-shaped button. */\n  @property({ type: Boolean, reflect: true }) pill = false;\n\n  /** Renders the button in a loading state. */\n  @property({ type: Boolean, reflect: true }) loading = false;\n\n  /** Disables the button. */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** The button's type (for form participation). */\n  @property() type: 'button' | 'submit' | 'reset' = 'button';\n\n  /** The button's name (for form participation). */\n  @property() name = '';\n\n  /** The button's value (for form participation). */\n  @property() value = '';\n\n  /** Renders the button as a link. */\n  @property() href = '';\n\n  /** The target attribute for link buttons. */\n  @property() target: '_blank' | '_parent' | '_self' | '_top' | '' = '';\n\n  /** The download attribute for link buttons. */\n  @property() download?: string;\n\n  /** Simulates a click on the button. */\n  click(): void {\n    this.shadowRoot?.querySelector<HTMLElement>('.button')?.click();\n  }\n\n  /** Sets focus on the button. */\n  focus(options?: FocusOptions): void {\n    this.shadowRoot?.querySelector<HTMLElement>('.button')?.focus(options);\n  }\n\n  /** Removes focus from the button. */\n  blur(): void {\n    this.shadowRoot?.querySelector<HTMLElement>('.button')?.blur();\n  }\n\n  private handleClick(event: MouseEvent): void {\n    if (this.disabled || this.loading) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n\n    if (this.type === 'submit') {\n      this.formController.form?.requestSubmit();\n    } else if (this.type === 'reset') {\n      this.formController.form?.reset();\n    }\n  }\n\n  private handleFocus(): void {\n    this.emit('mz-focus');\n  }\n\n  private handleBlur(): void {\n    this.emit('mz-blur');\n  }\n\n  render() {\n    const isLink = this.href.length > 0;\n    const hasPrefix = this.hasSlotController.test('prefix');\n    const hasSuffix = this.hasSlotController.test('suffix');\n\n    const classes = {\n      button: true,\n      'button--loading': this.loading,\n      'button--disabled': this.disabled,\n      'button--has-prefix': hasPrefix,\n      'button--has-suffix': hasSuffix\n    };\n\n    const inner = html`\n      ${hasPrefix\n        ? html`<span part=\"prefix\" class=\"button__prefix\"><slot name=\"prefix\"></slot></span>`\n        : nothing}\n      <span part=\"label\" class=\"button__label\"><slot></slot></span>\n      ${hasSuffix\n        ? html`<span part=\"suffix\" class=\"button__suffix\"><slot name=\"suffix\"></slot></span>`\n        : nothing}\n      ${this.loading ? html`<span class=\"button__spinner\"><mz-spinner></mz-spinner></span>` : nothing}\n    `;\n\n    if (isLink) {\n      return html`\n        <a\n          part=\"base\"\n          class=${classMap(classes)}\n          href=${this.href}\n          target=${ifDefined(this.target || undefined)}\n          download=${ifDefined(this.download)}\n          rel=${this.target === '_blank' ? 'noopener noreferrer' : nothing}\n          role=\"button\"\n          aria-disabled=${this.disabled}\n          tabindex=${this.disabled ? '-1' : '0'}\n          @click=${this.handleClick}\n          @focus=${this.handleFocus}\n          @blur=${this.handleBlur}\n        >\n          ${inner}\n        </a>\n      `;\n    }\n\n    return html`\n      <button\n        part=\"base\"\n        class=${classMap(classes)}\n        ?disabled=${this.disabled}\n        type=${this.type}\n        name=${ifDefined(this.name || undefined)}\n        value=${ifDefined(this.value || undefined)}\n        aria-disabled=${this.disabled}\n        aria-busy=${this.loading}\n        @click=${this.handleClick}\n        @focus=${this.handleFocus}\n        @blur=${this.handleBlur}\n      >\n        ${inner}\n      </button>\n    `;\n  }\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/components/button/button.d.ts

@@ -0,0 +1,8 @@
+import { MzButton } from './button.component.js';
+export * from './button.component.js';
+declare global {
+    interface HTMLElementTagNameMap {
+        'mz-button': MzButton;
+    }
+}
+//# sourceMappingURL=button.d.ts.map

package/dist/components/button/button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/button/button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEjD,cAAc,uBAAuB,CAAC;AAItC,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,QAAQ,CAAC;KACvB;CACF"}

package/dist/components/button/button.js

@@ -0,0 +1,4 @@
+import { MzButton } from "./button.component.js";
+export * from "./button.component.js";
+MzButton.define("mz-button");
+//# sourceMappingURL=button.js.map

package/dist/components/button/button.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/button/button.ts"],
+  "sourcesContent": ["import { MzButton } from './button.component.js';\n\nexport * from './button.component.js';\n\nMzButton.define('mz-button');\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'mz-button': MzButton;\n  }\n}\n"],
+  "mappings": "AAAA,SAAS,gBAAgB;AAEzB,cAAc;AAEd,SAAS,OAAO,WAAW;",
+  "names": []
+}

package/dist/components/button/button.styles.d.ts

@@ -0,0 +1,3 @@
+declare const _default: import("lit").CSSResult[];
+export default _default;
+//# sourceMappingURL=button.styles.d.ts.map

package/dist/components/button/button.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.styles.d.ts","sourceRoot":"","sources":["../../../src/components/button/button.styles.ts"],"names":[],"mappings":";AAGA,wBAsNE"}