@manzanohq/components 0.1.1 → 0.1.4

package/cdn/chunks/chunk.B2HRJL4L.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/data-table/data-table.component.ts"],
+  "sourcesContent": ["import { html, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\nimport { ManzanoElement } from '../../internal/manzano-element.js';\nimport styles from './data-table.styles.js';\n\nexport interface DataTableColumn {\n  key: string;\n  label: string;\n  sortable?: boolean;\n  width?: string;\n  align?: 'left' | 'center' | 'right';\n  render?: (value: unknown, row: Record<string, unknown>) => string;\n}\n\nexport interface DataTableRow {\n  [key: string]: unknown;\n}\n\n/**\n * @summary A data-driven table component with sorting, filtering, pagination, and row selection.\n * Takes structured data (columns + rows) as properties rather than slotted HTML.\n *\n * @tag mz-data-table\n *\n * @event mz-sort - Emitted when a column header is clicked for sorting. Detail: `{ key: string, direction: 'asc' | 'desc' }`\n * @event mz-select - Emitted when row selection changes. Detail: `{ selectedRows: number[], rows: DataTableRow[] }`\n * @event mz-page-change - Emitted when the page changes. Detail: `{ page: number }`\n *\n * @csspart base - The outermost wrapper div.\n * @csspart toolbar - The toolbar containing the search input.\n * @csspart search - The search input element.\n * @csspart table - The table element.\n * @csspart th - A table header cell.\n * @csspart row - A table body row.\n * @csspart td - A table body cell.\n * @csspart pagination - The pagination controls wrapper.\n */\nexport class MzDataTable extends ManzanoElement {\n  static styles = styles;\n\n  /** Column definitions. */\n  @property({ attribute: false }) columns: DataTableColumn[] = [];\n\n  /** Data rows. */\n  @property({ attribute: false }) rows: DataTableRow[] = [];\n\n  /** Enable row selection with checkboxes. */\n  @property({ type: Boolean, reflect: true }) selectable = false;\n\n  /** Show alternating row colors. */\n  @property({ type: Boolean, reflect: true }) striped = false;\n\n  /** Show cell borders. */\n  @property({ type: Boolean, reflect: true }) bordered = false;\n\n  /** Highlight row on hover. */\n  @property({ type: Boolean, reflect: true }) hoverable = true;\n\n  /** Show search input. */\n  @property({ type: Boolean, reflect: true }) searchable = false;\n\n  /** Rows per page. 0 means no pagination. */\n  @property({ type: Number, attribute: 'page-size' }) pageSize = 0;\n\n  /** Currently sorted column key. */\n  @property({ attribute: 'sort-key' }) sortKey = '';\n\n  /** Current sort direction. */\n  @property({ attribute: 'sort-direction' }) sortDirection: 'asc' | 'desc' = 'asc';\n\n  @state() private searchQuery = '';\n  @state() private currentPage = 1;\n  @state() private selectedRows: Set<number> = new Set();\n\n  // --- Computed getters ---\n\n  private get filteredRows(): DataTableRow[] {\n    if (!this.searchQuery) return this.rows;\n    const q = this.searchQuery.toLowerCase();\n    return this.rows.filter(row =>\n      this.columns.some(col => {\n        const val = row[col.key];\n        return val != null && String(val).toLowerCase().includes(q);\n      })\n    );\n  }\n\n  private get sortedRows(): DataTableRow[] {\n    const rows = [...this.filteredRows];\n    if (!this.sortKey) return rows;\n\n    return rows.sort((a, b) => {\n      const aVal = a[this.sortKey];\n      const bVal = b[this.sortKey];\n      let cmp = 0;\n      if (aVal == null && bVal == null) cmp = 0;\n      else if (aVal == null) cmp = -1;\n      else if (bVal == null) cmp = 1;\n      else if (typeof aVal === 'number' && typeof bVal === 'number') cmp = aVal - bVal;\n      else cmp = String(aVal).localeCompare(String(bVal));\n\n      return this.sortDirection === 'desc' ? -cmp : cmp;\n    });\n  }\n\n  private get paginatedRows(): DataTableRow[] {\n    if (!this.pageSize) return this.sortedRows;\n    const start = (this.currentPage - 1) * this.pageSize;\n    return this.sortedRows.slice(start, start + this.pageSize);\n  }\n\n  private get totalPages(): number {\n    if (!this.pageSize) return 1;\n    return Math.ceil(this.filteredRows.length / this.pageSize);\n  }\n\n  private get isAllSelected(): boolean {\n    return this.filteredRows.length > 0 && this.selectedRows.size === this.filteredRows.length;\n  }\n\n  private get isIndeterminate(): boolean {\n    return this.selectedRows.size > 0 && this.selectedRows.size < this.filteredRows.length;\n  }\n\n  // --- Event handlers ---\n\n  private handleSort(key: string) {\n    if (this.sortKey === key) {\n      this.sortDirection = this.sortDirection === 'asc' ? 'desc' : 'asc';\n    } else {\n      this.sortKey = key;\n      this.sortDirection = 'asc';\n    }\n    this.emit('mz-sort', { detail: { key: this.sortKey, direction: this.sortDirection } });\n  }\n\n  private handleSearch(e: Event) {\n    this.searchQuery = (e.target as HTMLInputElement).value;\n    this.currentPage = 1;\n  }\n\n  private handleRowSelect(index: number) {\n    const newSet = new Set(this.selectedRows);\n    if (newSet.has(index)) newSet.delete(index);\n    else newSet.add(index);\n    this.selectedRows = newSet;\n    this.emitSelection();\n  }\n\n  private handleSelectAll() {\n    if (this.isAllSelected) {\n      this.selectedRows = new Set();\n    } else {\n      const all = new Set<number>();\n      this.filteredRows.forEach((_, i) => all.add(i));\n      this.selectedRows = all;\n    }\n    this.emitSelection();\n  }\n\n  private emitSelection() {\n    const selectedIndices = [...this.selectedRows];\n    const selectedRowData = selectedIndices.map(i => this.rows[i]).filter(Boolean);\n    this.emit('mz-select', { detail: { selectedRows: selectedIndices, rows: selectedRowData } });\n  }\n\n  private goToPage(page: number) {\n    this.currentPage = Math.max(1, Math.min(page, this.totalPages));\n    this.emit('mz-page-change', { detail: { page: this.currentPage } });\n  }\n\n  private unsafeRender(content: string) {\n    return unsafeHTML(content);\n  }\n\n  // --- Render ---\n\n  render() {\n    return html`\n      <div part=\"base\" class=\"data-table\">\n        ${this.searchable\n          ? html`\n              <div part=\"toolbar\" class=\"data-table__toolbar\">\n                <div class=\"data-table__search\">\n                  <svg\n                    class=\"data-table__search-icon\"\n                    width=\"14\"\n                    height=\"14\"\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    stroke=\"currentColor\"\n                    stroke-width=\"2\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  >\n                    <circle cx=\"11\" cy=\"11\" r=\"8\" />\n                    <line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\" />\n                  </svg>\n                  <input\n                    part=\"search\"\n                    class=\"data-table__search-input\"\n                    type=\"text\"\n                    placeholder=\"Search...\"\n                    .value=${this.searchQuery}\n                    @input=${this.handleSearch}\n                  />\n                </div>\n                ${this.selectable && this.selectedRows.size > 0\n                  ? html`<span class=\"data-table__selection-count\"\n                      >${this.selectedRows.size} selected</span\n                    >`\n                  : nothing}\n              </div>\n            `\n          : nothing}\n\n        <div class=\"data-table__wrapper\">\n          <table\n            part=\"table\"\n            class=${classMap({\n              'data-table__table': true,\n              'data-table__table--striped': this.striped,\n              'data-table__table--bordered': this.bordered,\n              'data-table__table--hoverable': this.hoverable\n            })}\n          >\n            <thead>\n              <tr>\n                ${this.selectable\n                  ? html`\n                      <th class=\"data-table__th data-table__th--checkbox\">\n                        <input\n                          type=\"checkbox\"\n                          .checked=${this.isAllSelected}\n                          .indeterminate=${this.isIndeterminate}\n                          @change=${this.handleSelectAll}\n                        />\n                      </th>\n                    `\n                  : nothing}\n                ${this.columns.map(\n                  col => html`\n                    <th\n                      part=\"th\"\n                      class=${classMap({\n                        'data-table__th': true,\n                        'data-table__th--sortable': !!col.sortable,\n                        'data-table__th--sorted': this.sortKey === col.key,\n                        [`data-table__th--align-${col.align || 'left'}`]: true\n                      })}\n                      style=${col.width ? `width: ${col.width}` : ''}\n                      @click=${col.sortable ? () => this.handleSort(col.key) : nothing}\n                    >\n                      <span>${col.label}</span>\n                      ${col.sortable\n                        ? html`\n                            <span class=\"data-table__sort-icon\">\n                              ${this.sortKey === col.key\n                                ? this.sortDirection === 'asc'\n                                  ? html`<svg\n                                      width=\"12\"\n                                      height=\"12\"\n                                      viewBox=\"0 0 24 24\"\n                                      fill=\"none\"\n                                      stroke=\"currentColor\"\n                                      stroke-width=\"2\"\n                                    >\n                                      <polyline points=\"18 15 12 9 6 15\" />\n                                    </svg>`\n                                  : html`<svg\n                                      width=\"12\"\n                                      height=\"12\"\n                                      viewBox=\"0 0 24 24\"\n                                      fill=\"none\"\n                                      stroke=\"currentColor\"\n                                      stroke-width=\"2\"\n                                    >\n                                      <polyline points=\"6 9 12 15 18 9\" />\n                                    </svg>`\n                                : html`<svg\n                                    width=\"12\"\n                                    height=\"12\"\n                                    viewBox=\"0 0 24 24\"\n                                    fill=\"none\"\n                                    stroke=\"currentColor\"\n                                    stroke-width=\"2\"\n                                    opacity=\"0.3\"\n                                  >\n                                    <polyline points=\"18 15 12 9 6 15\" />\n                                  </svg>`}\n                            </span>\n                          `\n                        : nothing}\n                    </th>\n                  `\n                )}\n              </tr>\n            </thead>\n            <tbody>\n              ${this.paginatedRows.length === 0\n                ? html`\n                    <tr>\n                      <td\n                        class=\"data-table__empty\"\n                        colspan=${this.columns.length + (this.selectable ? 1 : 0)}\n                      >\n                        No data\n                      </td>\n                    </tr>\n                  `\n                : this.paginatedRows.map((row, i) => {\n                    const globalIndex = this.pageSize\n                      ? (this.currentPage - 1) * this.pageSize + i\n                      : i;\n                    return html`\n                      <tr\n                        part=\"row\"\n                        class=${classMap({\n                          'data-table__tr': true,\n                          'data-table__tr--selected': this.selectedRows.has(globalIndex)\n                        })}\n                      >\n                        ${this.selectable\n                          ? html`\n                              <td class=\"data-table__td data-table__td--checkbox\">\n                                <input\n                                  type=\"checkbox\"\n                                  .checked=${this.selectedRows.has(globalIndex)}\n                                  @change=${() => this.handleRowSelect(globalIndex)}\n                                />\n                              </td>\n                            `\n                          : nothing}\n                        ${this.columns.map(\n                          col => html`\n                            <td\n                              part=\"td\"\n                              class=${classMap({\n                                'data-table__td': true,\n                                [`data-table__td--align-${col.align || 'left'}`]: true\n                              })}\n                            >\n                              ${col.render\n                                ? this.unsafeRender(col.render(row[col.key], row))\n                                : row[col.key] ?? ''}\n                            </td>\n                          `\n                        )}\n                      </tr>\n                    `;\n                  })}\n            </tbody>\n          </table>\n        </div>\n\n        ${this.pageSize && this.totalPages > 1\n          ? html`\n              <div part=\"pagination\" class=\"data-table__pagination\">\n                <span class=\"data-table__page-info\">\n                  ${(this.currentPage - 1) * this.pageSize + 1}\u2013${Math.min(\n                    this.currentPage * this.pageSize,\n                    this.filteredRows.length\n                  )}\n                  of ${this.filteredRows.length}\n                </span>\n                <div class=\"data-table__page-controls\">\n                  <button\n                    class=\"data-table__page-btn\"\n                    type=\"button\"\n                    ?disabled=${this.currentPage <= 1}\n                    @click=${() => this.goToPage(this.currentPage - 1)}\n                  >\n                    <svg\n                      width=\"14\"\n                      height=\"14\"\n                      viewBox=\"0 0 24 24\"\n                      fill=\"none\"\n                      stroke=\"currentColor\"\n                      stroke-width=\"2\"\n                    >\n                      <polyline points=\"15 18 9 12 15 6\" />\n                    </svg>\n                  </button>\n                  <span class=\"data-table__page-number\">\n                    Page ${this.currentPage} of ${this.totalPages}\n                  </span>\n                  <button\n                    class=\"data-table__page-btn\"\n                    type=\"button\"\n                    ?disabled=${this.currentPage >= this.totalPages}\n                    @click=${() => this.goToPage(this.currentPage + 1)}\n                  >\n                    <svg\n                      width=\"14\"\n                      height=\"14\"\n                      viewBox=\"0 0 24 24\"\n                      fill=\"none\"\n                      stroke=\"currentColor\"\n                      stroke-width=\"2\"\n                    >\n                      <polyline points=\"9 18 15 12 9 6\" />\n                    </svg>\n                  </button>\n                </div>\n              </div>\n            `\n          : nothing}\n      </div>\n    `;\n  }\n}\n"],
+  "mappings": "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",
+  "names": ["MzDataTable", "ManzanoElement", "q", "row", "col", "val", "rows", "b", "aVal", "bVal", "cmp", "start", "key", "index", "newSet", "all", "_", "i", "selectedIndices", "selectedRowData", "page", "content", "o", "A", "e", "globalIndex", "data_table_styles_default", "__decorateClass", "n", "r"]
+}

package/cdn/chunks/chunk.B5BP6LY2.js

@@ -0,0 +1,6 @@
+import{a as r}from"./chunk.4PUQWPE6.js";import{a as l,d as n}from"./chunk.K3BKUERM.js";import{d as i}from"./chunk.TO7F5R6A.js";import{a as s}from"./chunk.MGICPQBB.js";var e=class extends n{constructor(){super(...arguments);this.selection="none";this.handleItemSelect=m=>{if(this.selection==="none")return;let o=m.detail.item;this.selection==="single"&&this.querySelectorAll("mz-tree-item[selected]").forEach(t=>{t!==o&&(t.selected=!1)}),this.emit("mz-selection-change",{detail:{selection:[...this.querySelectorAll("mz-tree-item[selected]")]}})}}connectedCallback(){super.connectedCallback(),this.addEventListener("mz-tree-item-select",this.handleItemSelect)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("mz-tree-item-select",this.handleItemSelect)}render(){return i`
+      <div class="tree" role="tree" part="base">
+        <slot></slot>
+      </div>
+    `}};e.styles=r,s([l()],e.prototype,"selection",2);export{e as a};
+//# sourceMappingURL=chunk.B5BP6LY2.js.map

package/cdn/chunks/chunk.B5BP6LY2.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/tree/tree.component.ts"],
+  "sourcesContent": ["import { html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { ManzanoElement } from '../../internal/manzano-element.js';\nimport type { MzTreeItem } from '../tree-item/tree-item.component.js';\nimport styles from './tree.styles.js';\n\n/**\n * @tag mz-tree\n * @summary A tree view container that displays hierarchical data.\n *\n * @slot - Tree item children (`mz-tree-item` elements).\n *\n * @event mz-selection-change - Emitted when the selection changes. `event.detail.selection` contains an array of selected `MzTreeItem` elements.\n *\n * @csspart base - The tree container.\n */\nexport class MzTree extends ManzanoElement {\n  static styles = styles;\n\n  /** Controls how items can be selected. */\n  @property() selection: 'none' | 'single' | 'multiple' = 'none';\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener('mz-tree-item-select', this.handleItemSelect as EventListener);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('mz-tree-item-select', this.handleItemSelect as EventListener);\n  }\n\n  private handleItemSelect = (e: CustomEvent) => {\n    if (this.selection === 'none') return;\n\n    const item = e.detail.item as MzTreeItem;\n\n    if (this.selection === 'single') {\n      // Deselect all others\n      this.querySelectorAll('mz-tree-item[selected]').forEach(el => {\n        if (el !== item) (el as MzTreeItem).selected = false;\n      });\n    }\n\n    this.emit('mz-selection-change', {\n      detail: { selection: [...this.querySelectorAll('mz-tree-item[selected]')] }\n    });\n  };\n\n  render() {\n    return html`\n      <div class=\"tree\" role=\"tree\" part=\"base\">\n        <slot></slot>\n      </div>\n    `;\n  }\n}\n"],
+  "mappings": "uKAgBO,IAAMA,EAAN,cAAqBC,CAAe,CAApC,kCAIO,eAA4C,OAYxD,KAAQ,iBAAoBC,GAAmB,CAC7C,GAAI,KAAK,YAAc,OAAQ,OAE/B,IAAMC,EAAOD,EAAE,OAAO,KAElB,KAAK,YAAc,UAErB,KAAK,iBAAiB,wBAAwB,EAAE,QAAQE,GAAM,CACxDA,IAAOD,IAAOC,EAAkB,SAAW,GACjD,CAAC,EAGH,KAAK,KAAK,sBAAuB,CAC/B,OAAQ,CAAE,UAAW,CAAC,GAAG,KAAK,iBAAiB,wBAAwB,CAAC,CAAE,CAC5E,CAAC,CACH,EAzBA,mBAAoB,CAClB,MAAM,kBAAkB,EACxB,KAAK,iBAAiB,sBAAuB,KAAK,gBAAiC,CACrF,CAEA,sBAAuB,CACrB,MAAM,qBAAqB,EAC3B,KAAK,oBAAoB,sBAAuB,KAAK,gBAAiC,CACxF,CAmBA,QAAS,CACP,OAAOC;AAAA;AAAA;AAAA;AAAA,KAKT,CACF,EAxCaL,EACJ,OAASM,EAGJC,EAAA,CAAXC,EAAS,GAJCR,EAIC",
+  "names": ["MzTree", "ManzanoElement", "e", "item", "el", "b", "tree_styles_default", "__decorateClass", "n"]
+}

package/cdn/chunks/chunk.BK6DYCV2.js

@@ -0,0 +1,90 @@
+import{a as r}from"./chunk.22OS67BO.js";import{a as o}from"./chunk.TO7F5R6A.js";var i=[r,o`
+    :host {
+      display: contents;
+    }
+
+    .dialog {
+      border: none;
+      padding: 0;
+      background: transparent;
+      max-width: none;
+      max-height: none;
+      width: 100%;
+      height: 100%;
+      overflow: visible;
+    }
+
+    .dialog::backdrop {
+      background: rgb(28 25 21 / 0.5);
+    }
+
+    .dialog__panel {
+      position: fixed;
+      inset: 0;
+      margin: auto;
+      display: flex;
+      flex-direction: column;
+      width: min(calc(100vw - var(--mz-space-xl) * 2), 32rem);
+      max-height: calc(100vh - var(--mz-space-xl) * 2);
+      background: var(--mz-color-surface-overlay, var(--mz-color-surface));
+      border-radius: var(--mz-radius-lg);
+      box-shadow: var(--mz-shadow-xl);
+      z-index: var(--mz-z-modal, 1050);
+    }
+
+    .dialog__header {
+      display: flex;
+      align-items: center;
+      gap: var(--mz-space-sm);
+      padding: var(--mz-space-md) var(--mz-space-lg);
+      border-bottom: var(--mz-border-width-sm) solid var(--mz-color-border);
+      font-family: var(--mz-font-sans);
+      font-size: var(--mz-font-size-lg);
+      font-weight: var(--mz-font-weight-semibold, 600);
+      color: var(--mz-color-text);
+    }
+
+    .dialog__close {
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      margin-inline-start: auto;
+      padding: var(--mz-space-2xs);
+      border: none;
+      background: none;
+      color: var(--mz-color-text-secondary);
+      cursor: pointer;
+      border-radius: var(--mz-radius-sm);
+      transition: color var(--mz-transition-fast), background var(--mz-transition-fast);
+    }
+
+    .dialog__close:hover {
+      color: var(--mz-color-text);
+      background: color-mix(in srgb, var(--mz-color-text) 8%, var(--mz-color-surface));
+    }
+
+    .dialog__close:focus-visible {
+      outline: var(--mz-focus-ring);
+      outline-offset: var(--mz-focus-ring-offset);
+    }
+
+    .dialog__body {
+      flex: 1;
+      padding: var(--mz-space-lg);
+      overflow-y: auto;
+      color: var(--mz-color-text);
+      font-family: var(--mz-font-sans);
+      font-size: var(--mz-font-size-md);
+      line-height: var(--mz-line-height-normal);
+    }
+
+    .dialog__footer {
+      padding: var(--mz-space-md) var(--mz-space-lg);
+      border-top: var(--mz-border-width-sm) solid var(--mz-color-border);
+    }
+
+    .dialog__footer:empty {
+      display: none;
+    }
+  `];export{i as a};
+//# sourceMappingURL=chunk.BK6DYCV2.js.map

package/cdn/chunks/chunk.BK6DYCV2.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/dialog/dialog.styles.ts"],
+  "sourcesContent": ["import { css } from 'lit';\nimport componentStyles from '../../styles/component.styles.js';\n\nexport default [\n  componentStyles,\n  css`\n    :host {\n      display: contents;\n    }\n\n    .dialog {\n      border: none;\n      padding: 0;\n      background: transparent;\n      max-width: none;\n      max-height: none;\n      width: 100%;\n      height: 100%;\n      overflow: visible;\n    }\n\n    .dialog::backdrop {\n      background: rgb(28 25 21 / 0.5);\n    }\n\n    .dialog__panel {\n      position: fixed;\n      inset: 0;\n      margin: auto;\n      display: flex;\n      flex-direction: column;\n      width: min(calc(100vw - var(--mz-space-xl) * 2), 32rem);\n      max-height: calc(100vh - var(--mz-space-xl) * 2);\n      background: var(--mz-color-surface-overlay, var(--mz-color-surface));\n      border-radius: var(--mz-radius-lg);\n      box-shadow: var(--mz-shadow-xl);\n      z-index: var(--mz-z-modal, 1050);\n    }\n\n    .dialog__header {\n      display: flex;\n      align-items: center;\n      gap: var(--mz-space-sm);\n      padding: var(--mz-space-md) var(--mz-space-lg);\n      border-bottom: var(--mz-border-width-sm) solid var(--mz-color-border);\n      font-family: var(--mz-font-sans);\n      font-size: var(--mz-font-size-lg);\n      font-weight: var(--mz-font-weight-semibold, 600);\n      color: var(--mz-color-text);\n    }\n\n    .dialog__close {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      margin-inline-start: auto;\n      padding: var(--mz-space-2xs);\n      border: none;\n      background: none;\n      color: var(--mz-color-text-secondary);\n      cursor: pointer;\n      border-radius: var(--mz-radius-sm);\n      transition: color var(--mz-transition-fast), background var(--mz-transition-fast);\n    }\n\n    .dialog__close:hover {\n      color: var(--mz-color-text);\n      background: color-mix(in srgb, var(--mz-color-text) 8%, var(--mz-color-surface));\n    }\n\n    .dialog__close:focus-visible {\n      outline: var(--mz-focus-ring);\n      outline-offset: var(--mz-focus-ring-offset);\n    }\n\n    .dialog__body {\n      flex: 1;\n      padding: var(--mz-space-lg);\n      overflow-y: auto;\n      color: var(--mz-color-text);\n      font-family: var(--mz-font-sans);\n      font-size: var(--mz-font-size-md);\n      line-height: var(--mz-line-height-normal);\n    }\n\n    .dialog__footer {\n      padding: var(--mz-space-md) var(--mz-space-lg);\n      border-top: var(--mz-border-width-sm) solid var(--mz-color-border);\n    }\n\n    .dialog__footer:empty {\n      display: none;\n    }\n  `\n];\n"],
+  "mappings": "gFAGA,IAAOA,EAAQ,CACbC,EACAC;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,GAyFF",
+  "names": ["dialog_styles_default", "component_styles_default", "i"]
+}

package/cdn/chunks/chunk.BLN3OKJG.js

@@ -0,0 +1,66 @@
+import{a as o}from"./chunk.22OS67BO.js";import{a as r}from"./chunk.TO7F5R6A.js";var i=r`
+  ${o}
+
+  :host {
+    --_ring-indicator-color: var(--mz-progress-ring-indicator-color, var(--mz-color-primary));
+    --_ring-track-color: var(--mz-progress-ring-track-color, var(--mz-color-border));
+
+    display: inline-flex;
+  }
+
+  .progress-ring {
+    position: relative;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  svg {
+    display: block;
+    transform-origin: center;
+  }
+
+  .progress-ring__track {
+    fill: none;
+    stroke: var(--_ring-track-color);
+  }
+
+  .progress-ring__indicator {
+    fill: none;
+    stroke: var(--_ring-indicator-color);
+    stroke-linecap: round;
+    transition: stroke-dashoffset 300ms ease;
+  }
+
+  .progress-ring__label {
+    position: absolute;
+    inset: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-family: var(--mz-font-sans);
+    font-size: var(--mz-font-size-xs);
+    font-weight: var(--mz-font-weight-semibold, 600);
+    color: var(--mz-color-text);
+    user-select: none;
+  }
+
+  .progress-ring__value {
+    font-variant-numeric: tabular-nums;
+  }
+
+  /* Indeterminate animation */
+  .progress-ring--indeterminate svg {
+    animation: progress-ring-spin 1.5s linear infinite;
+  }
+
+  @keyframes progress-ring-spin {
+    from {
+      transform: rotate(0deg);
+    }
+    to {
+      transform: rotate(360deg);
+    }
+  }
+`;export{i as a};
+//# sourceMappingURL=chunk.BLN3OKJG.js.map

package/cdn/chunks/chunk.BLN3OKJG.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/progress-ring/progress-ring.styles.ts"],
+  "sourcesContent": ["import { css } from 'lit';\nimport componentStyles from '../../styles/component.styles.js';\n\nexport default css`\n  ${componentStyles}\n\n  :host {\n    --_ring-indicator-color: var(--mz-progress-ring-indicator-color, var(--mz-color-primary));\n    --_ring-track-color: var(--mz-progress-ring-track-color, var(--mz-color-border));\n\n    display: inline-flex;\n  }\n\n  .progress-ring {\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n  }\n\n  svg {\n    display: block;\n    transform-origin: center;\n  }\n\n  .progress-ring__track {\n    fill: none;\n    stroke: var(--_ring-track-color);\n  }\n\n  .progress-ring__indicator {\n    fill: none;\n    stroke: var(--_ring-indicator-color);\n    stroke-linecap: round;\n    transition: stroke-dashoffset 300ms ease;\n  }\n\n  .progress-ring__label {\n    position: absolute;\n    inset: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-family: var(--mz-font-sans);\n    font-size: var(--mz-font-size-xs);\n    font-weight: var(--mz-font-weight-semibold, 600);\n    color: var(--mz-color-text);\n    user-select: none;\n  }\n\n  .progress-ring__value {\n    font-variant-numeric: tabular-nums;\n  }\n\n  /* Indeterminate animation */\n  .progress-ring--indeterminate svg {\n    animation: progress-ring-spin 1.5s linear infinite;\n  }\n\n  @keyframes progress-ring-spin {\n    from {\n      transform: rotate(0deg);\n    }\n    to {\n      transform: rotate(360deg);\n    }\n  }\n`;\n"],
+  "mappings": "gFAGA,IAAOA,EAAQC;AAAA,IACXC,CAAe;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;",
+  "names": ["progress_ring_styles_default", "i", "component_styles_default"]
+}

package/cdn/chunks/chunk.BUJWKEQP.js

@@ -0,0 +1,33 @@
+import{a as m}from"./chunk.BK6DYCV2.js";import{a as c}from"./chunk.YUHTZU7Y.js";import{d as n}from"./chunk.GX7DY53T.js";import{a as i,c as l,d}from"./chunk.K3BKUERM.js";import{d as a,g as s}from"./chunk.TO7F5R6A.js";import{a as p}from"./chunk.O6DGTOVN.js";import{a as h,b as r}from"./chunk.3HBRHIFP.js";import{a as o}from"./chunk.MGICPQBB.js";var t=class extends d{constructor(){super(...arguments);this.open=!1;this.label="";this.noCloseButton=!1}connectedCallback(){super.connectedCallback(),this.focusTrap=new p(this)}disconnectedCallback(){super.disconnectedCallback(),this.focusTrap.deactivate(),r()}async updated(e){e.has("open")&&(this.open?await this.showDialog():e.get("open")===!0&&await this.hideDialog())}async showDialog(){this.emit("mz-show"),this.dialogEl.showModal(),h(),this.focusTrap.activate(),await n(this.panelEl,"dialog.show",this.prefersReducedMotion).finished,this.emit("mz-after-show")}async hideDialog(){this.emit("mz-hide"),this.focusTrap.deactivate(),await n(this.panelEl,"dialog.hide",this.prefersReducedMotion).finished,this.dialogEl.close(),r(),this.emit("mz-after-hide")}requestClose(e){this.emit("mz-request-close",{cancelable:!0,detail:{source:e}})&&(this.open=!1)}show(){this.open=!0}hide(){this.open=!1}handleCancel(e){e.preventDefault(),this.requestClose("keyboard")}handleDialogClick(e){e.target===this.dialogEl&&this.requestClose("backdrop")}render(){return a`
+      <dialog
+        part="base"
+        class="dialog"
+        aria-label=${this.label||s}
+        @cancel=${this.handleCancel}
+        @click=${this.handleDialogClick}
+      >
+        <div part="panel" class="dialog__panel">
+          <header part="header" class="dialog__header">
+            <slot name="header">${this.label}</slot>
+            ${this.noCloseButton?s:a`
+                  <button
+                    part="close"
+                    class="dialog__close"
+                    type="button"
+                    aria-label="Close"
+                    @click=${()=>this.requestClose("close-button")}
+                  >
+                    <mz-icon name="x" label="Close"></mz-icon>
+                  </button>
+                `}
+          </header>
+          <div part="body" class="dialog__body">
+            <slot></slot>
+          </div>
+          <footer part="footer" class="dialog__footer">
+            <slot name="footer"></slot>
+          </footer>
+        </div>
+      </dialog>
+    `}};t.styles=m,t.dependencies={"mz-icon":c},o([l("dialog")],t.prototype,"dialogEl",2),o([l(".dialog__panel")],t.prototype,"panelEl",2),o([i({type:Boolean,reflect:!0})],t.prototype,"open",2),o([i()],t.prototype,"label",2),o([i({type:Boolean,attribute:"no-close-button"})],t.prototype,"noCloseButton",2);export{t as a};
+//# sourceMappingURL=chunk.BUJWKEQP.js.map

package/cdn/chunks/chunk.BV3MKPPK.js

@@ -0,0 +1,6 @@
+import{a as t}from"./chunk.22OS67BO.js";import{a as o}from"./chunk.TO7F5R6A.js";var m=[t,o`
+    :host {
+      display: inline;
+    }
+  `];export{m as a};
+//# sourceMappingURL=chunk.BV3MKPPK.js.map

package/cdn/chunks/chunk.BV3MKPPK.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/format-date/format-date.styles.ts"],
+  "sourcesContent": ["import { css } from 'lit';\nimport componentStyles from '../../styles/component.styles.js';\n\nexport default [\n  componentStyles,\n  css`\n    :host {\n      display: inline;\n    }\n  `\n];\n"],
+  "mappings": "gFAGA,IAAOA,EAAQ,CACbC,EACAC;AAAA;AAAA;AAAA;AAAA,GAKF",
+  "names": ["format_date_styles_default", "component_styles_default", "i"]
+}

package/cdn/chunks/chunk.C5MT4Y5Y.js

@@ -0,0 +1,18 @@
+import{a as l}from"./chunk.Q5NQRRET.js";import{a as r}from"./chunk.YUHTZU7Y.js";import{a as s,d as n}from"./chunk.K3BKUERM.js";import{d as o,g as a}from"./chunk.TO7F5R6A.js";import{a as t}from"./chunk.MGICPQBB.js";var e=class extends n{constructor(){super(...arguments);this.variant="neutral";this.appearance="soft";this.closable=!1;this.open=!0}handleClose(){this.open=!1,this.emit("mz-close")}render(){return this.open?o`
+      <div part="base" class="alert" role="alert">
+        <span part="icon" class="alert__icon">
+          <slot name="icon"></slot>
+        </span>
+        <span part="content" class="alert__content">
+          <slot></slot>
+        </span>
+        ${this.closable?o`<button
+              part="close"
+              class="alert__close"
+              type="button"
+              aria-label="Close"
+              @click=${this.handleClose}
+            >&times;</button>`:a}
+      </div>
+    `:a}};e.styles=l,e.dependencies={"mz-icon":r},t([s({reflect:!0})],e.prototype,"variant",2),t([s({reflect:!0})],e.prototype,"appearance",2),t([s({type:Boolean,reflect:!0})],e.prototype,"closable",2),t([s({type:Boolean,reflect:!0})],e.prototype,"open",2);export{e as a};
+//# sourceMappingURL=chunk.C5MT4Y5Y.js.map

package/cdn/chunks/chunk.CGJMWRBS.js

@@ -0,0 +1,6 @@
+import{a as o}from"./chunk.TO7F5R6A.js";var t=o`
+  :host {
+    display: block;
+  }
+`;export{t as a};
+//# sourceMappingURL=chunk.CGJMWRBS.js.map

package/cdn/chunks/chunk.CGJMWRBS.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/resize-observer/resize-observer.styles.ts"],
+  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  :host {\n    display: block;\n  }\n`;\n"],
+  "mappings": "wCAEA,IAAOA,EAAQC;AAAA;AAAA;AAAA;",
+  "names": ["resize_observer_styles_default", "i"]
+}

package/cdn/chunks/chunk.CGXQR74G.js

@@ -0,0 +1,22 @@
+import{a as o}from"./chunk.22OS67BO.js";import{a as i}from"./chunk.TO7F5R6A.js";var r=[o,i`
+    :host {
+      display: inline-flex;
+      width: var(--mz-icon-size, 1em);
+      height: var(--mz-icon-size, 1em);
+      color: inherit;
+      flex: none;
+    }
+
+    svg {
+      display: block;
+      width: 100%;
+      height: 100%;
+      fill: currentColor;
+    }
+
+    /* RTL: Flip directional icons */
+    :host([dir='rtl']) svg.flip-rtl {
+      transform: scaleX(-1);
+    }
+  `];export{r as a};
+//# sourceMappingURL=chunk.CGXQR74G.js.map

package/cdn/chunks/chunk.CLJWUNFI.js

@@ -0,0 +1,40 @@
+import{a as b}from"./chunk.HMER2ELR.js";import{a as o}from"./chunk.2EV445AD.js";import{a as $}from"./chunk.AEQDWEVQ.js";import{a}from"./chunk.X6MSTFXZ.js";import{a as u}from"./chunk.YUHTZU7Y.js";import{a as s,d as p}from"./chunk.K3BKUERM.js";import{d as r,g as l}from"./chunk.TO7F5R6A.js";import{a as m}from"./chunk.N7WYNIN3.js";import{a as c}from"./chunk.JWKG2VH6.js";import{a as t}from"./chunk.MGICPQBB.js";var e=class extends p{constructor(){super(...arguments);this.formController=new c(this);this.hasSlotController=new m(this,"prefix","suffix");this.variant="neutral";this.appearance="filled";this.size="md";this.pill=!1;this.loading=!1;this.disabled=!1;this.type="button";this.name="";this.value="";this.href="";this.target=""}click(){this.shadowRoot?.querySelector(".button")?.click()}focus(i){this.shadowRoot?.querySelector(".button")?.focus(i)}blur(){this.shadowRoot?.querySelector(".button")?.blur()}handleClick(i){if(this.disabled||this.loading){i.preventDefault(),i.stopPropagation();return}this.type==="submit"?this.formController.form?.requestSubmit():this.type==="reset"&&this.formController.form?.reset()}handleFocus(){this.emit("mz-focus")}handleBlur(){this.emit("mz-blur")}render(){let i=this.href.length>0,n=this.hasSlotController.test("prefix"),d=this.hasSlotController.test("suffix"),f={button:!0,"button--loading":this.loading,"button--disabled":this.disabled,"button--has-prefix":n,"button--has-suffix":d},h=r`
+      ${n?r`<span part="prefix" class="button__prefix"><slot name="prefix"></slot></span>`:l}
+      <span part="label" class="button__label"><slot></slot></span>
+      ${d?r`<span part="suffix" class="button__suffix"><slot name="suffix"></slot></span>`:l}
+      ${this.loading?r`<span class="button__spinner"><mz-spinner></mz-spinner></span>`:l}
+    `;return i?r`
+        <a
+          part="base"
+          class=${a(f)}
+          href=${this.href}
+          target=${o(this.target||void 0)}
+          download=${o(this.download)}
+          rel=${this.target==="_blank"?"noopener noreferrer":l}
+          role="button"
+          aria-disabled=${this.disabled}
+          tabindex=${this.disabled?"-1":"0"}
+          @click=${this.handleClick}
+          @focus=${this.handleFocus}
+          @blur=${this.handleBlur}
+        >
+          ${h}
+        </a>
+      `:r`
+      <button
+        part="base"
+        class=${a(f)}
+        ?disabled=${this.disabled}
+        type=${this.type}
+        name=${o(this.name||void 0)}
+        value=${o(this.value||void 0)}
+        aria-disabled=${this.disabled}
+        aria-busy=${this.loading}
+        @click=${this.handleClick}
+        @focus=${this.handleFocus}
+        @blur=${this.handleBlur}
+      >
+        ${h}
+      </button>
+    `}};e.styles=$,e.formAssociated=!0,e.dependencies={"mz-spinner":b,"mz-icon":u},t([s({reflect:!0})],e.prototype,"variant",2),t([s({reflect:!0})],e.prototype,"appearance",2),t([s({reflect:!0})],e.prototype,"size",2),t([s({type:Boolean,reflect:!0})],e.prototype,"pill",2),t([s({type:Boolean,reflect:!0})],e.prototype,"loading",2),t([s({type:Boolean,reflect:!0})],e.prototype,"disabled",2),t([s()],e.prototype,"type",2),t([s()],e.prototype,"name",2),t([s()],e.prototype,"value",2),t([s()],e.prototype,"href",2),t([s()],e.prototype,"target",2),t([s()],e.prototype,"download",2);export{e as a};
+//# sourceMappingURL=chunk.CLJWUNFI.js.map

package/cdn/chunks/chunk.COALXZOO.js

@@ -0,0 +1,66 @@
+import{a}from"./chunk.22OS67BO.js";import{a as e}from"./chunk.TO7F5R6A.js";var i=[a,e`
+    @layer base, sizes, states;
+
+    @layer base {
+      :host {
+        display: inline-flex;
+      }
+
+      .avatar {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        overflow: hidden;
+        width: var(--_size, var(--mz-avatar-size, 2.5rem));
+        height: var(--_size, var(--mz-avatar-size, 2.5rem));
+        border-radius: var(--_radius, var(--mz-avatar-radius, var(--mz-radius-circle)));
+        background: var(--mz-avatar-bg, var(--mz-color-neutral));
+        color: var(--mz-avatar-color, var(--mz-color-on-neutral));
+        font-family: var(--mz-font-sans);
+        font-weight: var(--mz-font-weight-semibold);
+        font-size: var(--_font-size, calc(var(--_size, 2.5rem) * 0.4));
+        line-height: 1;
+        user-select: none;
+        flex-shrink: 0;
+      }
+
+      .avatar__image {
+        width: 100%;
+        height: 100%;
+        object-fit: cover;
+      }
+
+      .avatar__icon {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-size: calc(var(--_size, 2.5rem) * 0.5);
+      }
+    }
+
+    @layer sizes {
+      :host([size='sm']) {
+        --_size: 2rem;
+      }
+
+      :host([size='md']),
+      :host(:not([size])) {
+        --_size: 2.5rem;
+      }
+
+      :host([size='lg']) {
+        --_size: 3rem;
+      }
+
+      :host([size='xl']) {
+        --_size: 4rem;
+      }
+    }
+
+    @layer states {
+      :host([shape='square']) {
+        --_radius: var(--mz-radius-md);
+      }
+    }
+  `];export{i as a};
+//# sourceMappingURL=chunk.COALXZOO.js.map

package/cdn/chunks/chunk.CPMFNRGK.js

@@ -0,0 +1,2 @@
+import{a as e}from"./chunk.C5MT4Y5Y.js";e.define("mz-alert");
+//# sourceMappingURL=chunk.CPMFNRGK.js.map

package/cdn/chunks/chunk.CXLLRDSK.js

@@ -0,0 +1,25 @@
+import{a as n}from"./chunk.5TV4T36L.js";import{a as c}from"./chunk.X6MSTFXZ.js";import{a as t,c as r,d as i}from"./chunk.K3BKUERM.js";import{d as l}from"./chunk.TO7F5R6A.js";import{a as s}from"./chunk.MGICPQBB.js";var e=class extends i{constructor(){super(...arguments);this.name="";this.value="on";this.size="md";this.checked=!1;this.disabled=!1;this.required=!1}focus(a){this.inputEl?.focus(a)}blur(){this.inputEl?.blur()}handleChange(){this.checked=this.inputEl.checked,this.emit("mz-change")}handleFocus(){this.emit("mz-focus")}handleBlur(){this.emit("mz-blur")}render(){let a={switch__track:!0,"switch__track--checked":this.checked};return l`
+      <label part="base" class="switch">
+        <input
+          class="switch__input"
+          type="checkbox"
+          role="switch"
+          name=${this.name}
+          value=${this.value}
+          .checked=${this.checked}
+          ?disabled=${this.disabled}
+          ?required=${this.required}
+          aria-checked=${this.checked}
+          @change=${this.handleChange}
+          @focus=${this.handleFocus}
+          @blur=${this.handleBlur}
+        />
+        <span part="track" class=${c(a)}>
+          <span part="thumb" class="switch__thumb"></span>
+        </span>
+        <span part="label" class="switch__label">
+          <slot></slot>
+        </span>
+      </label>
+    `}};e.styles=n,e.formAssociated=!0,s([r(".switch__input")],e.prototype,"inputEl",2),s([t()],e.prototype,"name",2),s([t()],e.prototype,"value",2),s([t({reflect:!0})],e.prototype,"size",2),s([t({type:Boolean,reflect:!0})],e.prototype,"checked",2),s([t({type:Boolean,reflect:!0})],e.prototype,"disabled",2),s([t({type:Boolean,reflect:!0})],e.prototype,"required",2);export{e as a};
+//# sourceMappingURL=chunk.CXLLRDSK.js.map

package/cdn/chunks/chunk.D3M42MEZ.js

@@ -0,0 +1,18 @@
+import{a as m}from"./chunk.IHP5MR6U.js";import{d as l}from"./chunk.GX7DY53T.js";import{a as o,b as n,c as d,d as h}from"./chunk.K3BKUERM.js";import{d as a}from"./chunk.TO7F5R6A.js";import{a as r}from"./chunk.OJRE6F6M.js";import{a as i}from"./chunk.MGICPQBB.js";var c=0,e=class extends h{constructor(){super(...arguments);this.tooltipId=`mz-tooltip-${++c}`;this.content="";this.placement="top";this.distance=8;this.disabled=!1;this.visible=!1}connectedCallback(){super.connectedCallback(),this.floatingController=new r(this,{referenceEl:()=>this.getTrigger(),floatingEl:()=>this.bodyEl,placement:this.placement,distance:this.distance})}disconnectedCallback(){super.disconnectedCallback(),clearTimeout(this.showTimeout),clearTimeout(this.hideTimeout)}getTrigger(){return(this.shadowRoot?.querySelector("slot:not([name])")?.assignedElements({flatten:!0})??[])[0]??null}updated(t){(t.has("placement")||t.has("distance"))&&(this.floatingController=new r(this,{referenceEl:()=>this.getTrigger(),floatingEl:()=>this.bodyEl,placement:this.placement,distance:this.distance}))}async showTooltip(){if(this.disabled||this.visible)return;this.visible=!0,await this.updateComplete,this.bodyEl.style.display="block",await this.floatingController.show();let t=this.getTrigger();t&&t.setAttribute("aria-describedby",this.tooltipId),l(this.bodyEl,"tooltip.show",this.prefersReducedMotion)}async hideTooltip(){if(!this.visible)return;await l(this.bodyEl,"tooltip.hide",this.prefersReducedMotion).finished,this.bodyEl.style.display="none",this.visible=!1,this.floatingController.hide();let s=this.getTrigger();s&&s.removeAttribute("aria-describedby")}handleMouseEnter(){clearTimeout(this.hideTimeout),this.showTimeout=setTimeout(()=>this.showTooltip(),200)}handleMouseLeave(){clearTimeout(this.showTimeout),this.hideTimeout=setTimeout(()=>this.hideTooltip(),0)}handleFocusIn(){clearTimeout(this.hideTimeout),this.showTooltip()}handleFocusOut(){clearTimeout(this.showTimeout),this.hideTooltip()}render(){return a`
+      <slot
+        @mouseenter=${this.handleMouseEnter}
+        @mouseleave=${this.handleMouseLeave}
+        @focusin=${this.handleFocusIn}
+        @focusout=${this.handleFocusOut}
+      ></slot>
+      <div
+        part="body"
+        class="tooltip__body"
+        role="tooltip"
+        id=${this.tooltipId}
+        style="display: none"
+      >
+        ${this.content}
+      </div>
+    `}};e.styles=m,i([d(".tooltip__body")],e.prototype,"bodyEl",2),i([o()],e.prototype,"content",2),i([o()],e.prototype,"placement",2),i([o({type:Number})],e.prototype,"distance",2),i([o({type:Boolean,reflect:!0})],e.prototype,"disabled",2),i([n()],e.prototype,"visible",2);export{e as a};
+//# sourceMappingURL=chunk.D3M42MEZ.js.map

package/cdn/chunks/chunk.D6AAPS2R.js

@@ -0,0 +1,2 @@
+import{a as e}from"./chunk.CXLLRDSK.js";e.define("mz-switch");
+//# sourceMappingURL=chunk.D6AAPS2R.js.map

package/cdn/chunks/chunk.DEUU2SSC.js

@@ -0,0 +1,2 @@
+import{a as l}from"./chunk.LSNIMSME.js";import{a as i}from"./chunk.22OS67BO.js";import{a as r,d as o}from"./chunk.K3BKUERM.js";import{d as s}from"./chunk.TO7F5R6A.js";import{a as t}from"./chunk.MGICPQBB.js";var e=class extends o{constructor(){super(...arguments);this.observer=null;this.threshold=0;this.rootMargin="0px";this.disabled=!1}connectedCallback(){super.connectedCallback(),this.startObserver()}disconnectedCallback(){super.disconnectedCallback(),this.stopObserver()}updated(){this.stopObserver(),this.startObserver()}startObserver(){this.disabled||(this.observer=new IntersectionObserver(a=>{this.emit("mz-intersect",{detail:{entries:a}})},{threshold:this.threshold,rootMargin:this.rootMargin}),this.observer.observe(this))}stopObserver(){this.observer&&(this.observer.disconnect(),this.observer=null)}render(){return s`<slot></slot>`}};e.styles=[i,l],t([r({type:Number,reflect:!0})],e.prototype,"threshold",2),t([r({type:String,reflect:!0,attribute:"root-margin"})],e.prototype,"rootMargin",2),t([r({type:Boolean,reflect:!0})],e.prototype,"disabled",2);export{e as a};
+//# sourceMappingURL=chunk.DEUU2SSC.js.map

package/cdn/chunks/chunk.DEUU2SSC.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/intersection-observer/intersection-observer.component.ts"],
+  "sourcesContent": ["import { html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { ManzanoElement } from '../../internal/manzano-element.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport styles from './intersection-observer.styles.js';\n\n/**\n * @summary A wrapper around the browser's native `IntersectionObserver` API that emits an event when the host element's visibility changes.\n *\n * @event mz-intersect - Emitted when the host element's intersection with its root changes. The event detail contains `{ entries: IntersectionObserverEntry[] }`.\n *\n * @slot - The content to observe for intersection changes.\n */\nexport class MzIntersectionObserver extends ManzanoElement {\n  static styles = [componentStyles, styles];\n\n  private observer: IntersectionObserver | null = null;\n\n  /** A single threshold value (0-1) at which to trigger the observer callback. */\n  @property({ type: Number, reflect: true }) threshold = 0;\n\n  /** Margin around the root. Can have values similar to CSS margin property. */\n  @property({ type: String, reflect: true, attribute: 'root-margin' }) rootMargin = '0px';\n\n  /** Disables the observer. */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.startObserver();\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.stopObserver();\n  }\n\n  protected updated() {\n    this.stopObserver();\n    this.startObserver();\n  }\n\n  private startObserver() {\n    if (this.disabled) return;\n\n    this.observer = new IntersectionObserver(\n      (entries: IntersectionObserverEntry[]) => {\n        this.emit('mz-intersect', { detail: { entries } });\n      },\n      {\n        threshold: this.threshold,\n        rootMargin: this.rootMargin\n      }\n    );\n\n    this.observer.observe(this);\n  }\n\n  private stopObserver() {\n    if (this.observer) {\n      this.observer.disconnect();\n      this.observer = null;\n    }\n  }\n\n  render() {\n    return html`<slot></slot>`;\n  }\n}\n"],
+  "mappings": "+MAaO,IAAMA,EAAN,cAAqCC,CAAe,CAApD,kCAGL,KAAQ,SAAwC,KAGL,eAAY,EAGc,gBAAa,MAGtC,cAAW,GAEvD,mBAAoB,CAClB,MAAM,kBAAkB,EACxB,KAAK,cAAc,CACrB,CAEA,sBAAuB,CACrB,MAAM,qBAAqB,EAC3B,KAAK,aAAa,CACpB,CAEU,SAAU,CAClB,KAAK,aAAa,EAClB,KAAK,cAAc,CACrB,CAEQ,eAAgB,CAClB,KAAK,WAET,KAAK,SAAW,IAAI,qBACjBC,GAAyC,CACxC,KAAK,KAAK,eAAgB,CAAE,OAAQ,CAAE,QAAAA,CAAQ,CAAE,CAAC,CACnD,EACA,CACE,UAAW,KAAK,UAChB,WAAY,KAAK,UACnB,CACF,EAEA,KAAK,SAAS,QAAQ,IAAI,EAC5B,CAEQ,cAAe,CACjB,KAAK,WACP,KAAK,SAAS,WAAW,EACzB,KAAK,SAAW,KAEpB,CAEA,QAAS,CACP,OAAOC,gBACT,CACF,EAvDaH,EACJ,OAAS,CAACI,EAAiBC,CAAM,EAKGC,EAAA,CAA1CC,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,GAN9BP,EAMgC,yBAG0BM,EAAA,CAApEC,EAAS,CAAE,KAAM,OAAQ,QAAS,GAAM,UAAW,aAAc,CAAC,GATxDP,EAS0D,0BAGzBM,EAAA,CAA3CC,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GAZ/BP,EAYiC",
+  "names": ["MzIntersectionObserver", "ManzanoElement", "entries", "b", "component_styles_default", "intersection_observer_styles_default", "__decorateClass", "n"]
+}

package/cdn/chunks/chunk.DKM3D3LK.js

@@ -0,0 +1,6 @@
+import{a as n}from"./chunk.GY2I4635.js";import{a as t,d as s}from"./chunk.K3BKUERM.js";import{d as l}from"./chunk.TO7F5R6A.js";import{a as r}from"./chunk.MGICPQBB.js";var e=class extends s{constructor(){super(...arguments);this.variant="neutral";this.appearance="filled";this.size="md";this.pill=!1}render(){return l`
+      <span part="base" class="badge">
+        <slot></slot>
+      </span>
+    `}};e.styles=n,r([t({reflect:!0})],e.prototype,"variant",2),r([t({reflect:!0})],e.prototype,"appearance",2),r([t({reflect:!0})],e.prototype,"size",2),r([t({type:Boolean,reflect:!0})],e.prototype,"pill",2);export{e as a};
+//# sourceMappingURL=chunk.DKM3D3LK.js.map