@zentto/studio 0.1.0 → 0.2.0

package/dist/fields/zs-modal.js

@@ -0,0 +1,352 @@
+// @zentto/studio — Modal / Dialog system
+// Supports: alert, confirm, form, custom content, fullscreen, side-panel
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { LitElement, html, css } from 'lit';
+import { customElement, property, state } from 'lit/decorators.js';
+import { studioTokens } from '../styles/tokens.js';
+let ZsModal = class ZsModal extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.open = false;
+        this.title = '';
+        this.subtitle = '';
+        this.icon = '';
+        this.size = 'md';
+        this.variant = 'default';
+        this.closable = true;
+        this.closeOnBackdrop = true;
+        this.hideFooter = false;
+        this.hideHeader = false;
+        // Confirm dialog props
+        this.confirmText = '';
+        this.cancelText = 'Cancelar';
+        this.okText = 'Aceptar';
+        this.okVariant = 'primary';
+        this.loading = false;
+        // Confirm with input (type to confirm)
+        this.confirmInput = ''; // if set, user must type this to confirm
+        this.confirmInputValue = '';
+        this.handleKeydown = (e) => {
+            if (e.key === 'Escape' && this.closable)
+                this.close('escape');
+        };
+    }
+    static { this.styles = [studioTokens, css `
+    :host { display: contents; }
+
+    /* Backdrop */
+    .zs-backdrop {
+      position: fixed; inset: 0; z-index: 9998;
+      background: rgba(0, 0, 0, 0.5);
+      backdrop-filter: blur(4px);
+      display: flex; align-items: center; justify-content: center;
+      opacity: 0; pointer-events: none;
+      transition: opacity 200ms ease;
+    }
+    .zs-backdrop--open { opacity: 1; pointer-events: auto; }
+
+    /* Dialog */
+    .zs-dialog {
+      background: var(--zs-bg, #fff);
+      border-radius: 12px;
+      box-shadow: 0 20px 60px rgba(0,0,0,0.3);
+      display: flex; flex-direction: column;
+      max-height: 90vh;
+      transform: translateY(20px) scale(0.97);
+      transition: transform 250ms cubic-bezier(0.34, 1.56, 0.64, 1);
+      overflow: hidden;
+    }
+    .zs-backdrop--open .zs-dialog {
+      transform: translateY(0) scale(1);
+    }
+
+    /* Sizes */
+    .zs-dialog--sm { width: 400px; }
+    .zs-dialog--md { width: 560px; }
+    .zs-dialog--lg { width: 760px; }
+    .zs-dialog--xl { width: 960px; }
+    .zs-dialog--fullscreen {
+      width: 100vw; height: 100vh; max-height: 100vh;
+      border-radius: 0;
+    }
+    .zs-dialog--side-right {
+      position: fixed; right: 0; top: 0; bottom: 0;
+      width: 480px; max-height: 100vh; height: 100vh;
+      border-radius: 12px 0 0 12px;
+      transform: translateX(100%);
+    }
+    .zs-backdrop--open .zs-dialog--side-right { transform: translateX(0); }
+    .zs-dialog--side-left {
+      position: fixed; left: 0; top: 0; bottom: 0;
+      width: 480px; max-height: 100vh; height: 100vh;
+      border-radius: 0 12px 12px 0;
+      transform: translateX(-100%);
+    }
+    .zs-backdrop--open .zs-dialog--side-left { transform: translateX(0); }
+
+    /* Header */
+    .zs-dialog-header {
+      display: flex; align-items: center; gap: 12px;
+      padding: 20px 24px 16px;
+      border-bottom: 1px solid var(--zs-border, #dee2e6);
+    }
+    .zs-dialog-icon {
+      width: 40px; height: 40px; border-radius: 10px;
+      display: flex; align-items: center; justify-content: center;
+      font-size: 20px; flex-shrink: 0;
+    }
+    .zs-dialog-icon--default { background: var(--zs-bg-secondary); }
+    .zs-dialog-icon--danger { background: #fde8e8; color: #e74c3c; }
+    .zs-dialog-icon--success { background: #d4edda; color: #27ae60; }
+    .zs-dialog-icon--warning { background: #fff3cd; color: #f39c12; }
+    .zs-dialog-icon--info { background: #d1ecf1; color: #3498db; }
+    .zs-dialog-title {
+      font-size: 18px; font-weight: 600; color: var(--zs-text, #212529);
+      margin: 0; flex: 1;
+    }
+    .zs-dialog-subtitle {
+      font-size: 13px; color: var(--zs-text-secondary, #6c757d);
+      margin: 2px 0 0;
+    }
+    .zs-dialog-close {
+      width: 32px; height: 32px; border-radius: 8px;
+      border: none; background: none; cursor: pointer;
+      font-size: 18px; color: var(--zs-text-muted, #adb5bd);
+      display: flex; align-items: center; justify-content: center;
+      transition: all 150ms;
+    }
+    .zs-dialog-close:hover {
+      background: var(--zs-bg-hover, #f1f3f5);
+      color: var(--zs-text, #212529);
+    }
+
+    /* Body */
+    .zs-dialog-body {
+      padding: 20px 24px;
+      overflow-y: auto; flex: 1;
+      font-size: 14px; color: var(--zs-text, #212529);
+      line-height: 1.6;
+    }
+
+    /* Footer */
+    .zs-dialog-footer {
+      display: flex; gap: 8px; justify-content: flex-end;
+      padding: 16px 24px;
+      border-top: 1px solid var(--zs-border, #dee2e6);
+      background: var(--zs-bg-secondary, #f8f9fa);
+    }
+    .zs-dialog-footer--spread { justify-content: space-between; }
+
+    /* Buttons */
+    .zs-dlg-btn {
+      padding: 9px 20px; border-radius: 8px;
+      font-family: var(--zs-font-family, sans-serif);
+      font-size: 14px; font-weight: 500;
+      cursor: pointer; border: 1px solid transparent;
+      transition: all 150ms;
+    }
+    .zs-dlg-btn--primary { background: var(--zs-primary, #e67e22); color: white; }
+    .zs-dlg-btn--primary:hover { filter: brightness(0.9); }
+    .zs-dlg-btn--secondary {
+      background: var(--zs-bg, #fff); color: var(--zs-text, #212529);
+      border-color: var(--zs-border, #dee2e6);
+    }
+    .zs-dlg-btn--secondary:hover { background: var(--zs-bg-hover, #f1f3f5); }
+    .zs-dlg-btn--danger { background: #e74c3c; color: white; }
+    .zs-dlg-btn--danger:hover { background: #c0392b; }
+    .zs-dlg-btn--success { background: #27ae60; color: white; }
+    .zs-dlg-btn--success:hover { background: #219a52; }
+    .zs-dlg-btn--ghost {
+      background: none; color: var(--zs-text-secondary, #6c757d);
+    }
+    .zs-dlg-btn--ghost:hover { color: var(--zs-text); background: var(--zs-bg-hover); }
+    .zs-dlg-btn:disabled { opacity: 0.5; cursor: not-allowed; }
+    .zs-dlg-btn--loading {
+      position: relative; color: transparent; pointer-events: none;
+    }
+    .zs-dlg-btn--loading::after {
+      content: ''; position: absolute; inset: 0;
+      display: flex; align-items: center; justify-content: center;
+      font-size: 14px; color: white;
+    }
+
+    /* Confirm specific */
+    .zs-confirm-text { font-size: 15px; line-height: 1.6; color: var(--zs-text); }
+    .zs-confirm-input {
+      width: 100%; margin-top: 12px; padding: 8px 12px;
+      border: 1px solid var(--zs-border); border-radius: 6px;
+      font-size: 14px; font-family: var(--zs-font-family);
+      outline: none; box-sizing: border-box;
+    }
+    .zs-confirm-input:focus { border-color: var(--zs-primary); }
+    .zs-confirm-hint {
+      font-size: 12px; color: var(--zs-text-muted);
+      margin-top: 4px;
+    }
+  `]; }
+    get canConfirm() {
+        if (!this.confirmInput)
+            return true;
+        return this.confirmInputValue === this.confirmInput;
+    }
+    handleBackdropClick(e) {
+        if (e.target === e.currentTarget && this.closeOnBackdrop && this.closable) {
+            this.close('backdrop');
+        }
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        document.addEventListener('keydown', this.handleKeydown);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        document.removeEventListener('keydown', this.handleKeydown);
+    }
+    close(reason = 'close') {
+        this.open = false;
+        this.confirmInputValue = '';
+        this.dispatchEvent(new CustomEvent('modal-close', {
+            detail: { reason },
+            bubbles: true, composed: true,
+        }));
+    }
+    confirm() {
+        if (!this.canConfirm)
+            return;
+        this.dispatchEvent(new CustomEvent('modal-confirm', {
+            detail: {},
+            bubbles: true, composed: true,
+        }));
+        if (!this.loading)
+            this.close('ok');
+    }
+    cancel() {
+        this.dispatchEvent(new CustomEvent('modal-cancel', {
+            detail: {},
+            bubbles: true, composed: true,
+        }));
+        this.close('cancel');
+    }
+    getVariantIcon() {
+        if (this.icon)
+            return this.icon;
+        const icons = {
+            default: '💬',
+            danger: '⚠️',
+            success: '✅',
+            warning: '⚡',
+            info: 'ℹ️',
+        };
+        return icons[this.variant];
+    }
+    render() {
+        const backdropClass = `zs-backdrop ${this.open ? 'zs-backdrop--open' : ''}`;
+        const dialogClass = `zs-dialog zs-dialog--${this.size}`;
+        const iconClass = `zs-dialog-icon zs-dialog-icon--${this.variant}`;
+        return html `
+      <div class="${backdropClass}" @click="${this.handleBackdropClick}">
+        <div class="${dialogClass}" @click="${(e) => e.stopPropagation()}">
+
+          ${!this.hideHeader ? html `
+            <div class="zs-dialog-header">
+              <div class="${iconClass}">${this.getVariantIcon()}</div>
+              <div style="flex:1;">
+                <h3 class="zs-dialog-title">${this.title}</h3>
+                ${this.subtitle ? html `<p class="zs-dialog-subtitle">${this.subtitle}</p>` : ''}
+              </div>
+              ${this.closable ? html `
+                <button class="zs-dialog-close" @click="${() => this.close('close')}">✕</button>
+              ` : ''}
+            </div>
+          ` : ''}
+
+          <div class="zs-dialog-body">
+            ${this.confirmText ? html `
+              <p class="zs-confirm-text">${this.confirmText}</p>
+              ${this.confirmInput ? html `
+                <input class="zs-confirm-input"
+                  placeholder="Escribe '${this.confirmInput}' para confirmar"
+                  .value="${this.confirmInputValue}"
+                  @input="${(e) => { this.confirmInputValue = e.target.value; }}"
+                />
+                <div class="zs-confirm-hint">Escribe <strong>${this.confirmInput}</strong> para habilitar el boton</div>
+              ` : ''}
+            ` : ''}
+            <slot></slot>
+          </div>
+
+          ${!this.hideFooter ? html `
+            <div class="zs-dialog-footer">
+              <button class="zs-dlg-btn zs-dlg-btn--secondary" @click="${this.cancel}">${this.cancelText}</button>
+              <button class="zs-dlg-btn zs-dlg-btn--${this.okVariant} ${this.loading ? 'zs-dlg-btn--loading' : ''}"
+                ?disabled="${!this.canConfirm || this.loading}"
+                @click="${this.confirm}"
+              >${this.loading ? '...' : this.okText}</button>
+            </div>
+          ` : ''}
+        </div>
+      </div>
+    `;
+    }
+};
+__decorate([
+    property({ type: Boolean, reflect: true })
+], ZsModal.prototype, "open", void 0);
+__decorate([
+    property()
+], ZsModal.prototype, "title", void 0);
+__decorate([
+    property()
+], ZsModal.prototype, "subtitle", void 0);
+__decorate([
+    property()
+], ZsModal.prototype, "icon", void 0);
+__decorate([
+    property()
+], ZsModal.prototype, "size", void 0);
+__decorate([
+    property()
+], ZsModal.prototype, "variant", void 0);
+__decorate([
+    property({ type: Boolean })
+], ZsModal.prototype, "closable", void 0);
+__decorate([
+    property({ type: Boolean })
+], ZsModal.prototype, "closeOnBackdrop", void 0);
+__decorate([
+    property({ type: Boolean })
+], ZsModal.prototype, "hideFooter", void 0);
+__decorate([
+    property({ type: Boolean })
+], ZsModal.prototype, "hideHeader", void 0);
+__decorate([
+    property()
+], ZsModal.prototype, "confirmText", void 0);
+__decorate([
+    property()
+], ZsModal.prototype, "cancelText", void 0);
+__decorate([
+    property()
+], ZsModal.prototype, "okText", void 0);
+__decorate([
+    property()
+], ZsModal.prototype, "okVariant", void 0);
+__decorate([
+    property({ type: Boolean })
+], ZsModal.prototype, "loading", void 0);
+__decorate([
+    property()
+], ZsModal.prototype, "confirmInput", void 0);
+__decorate([
+    state()
+], ZsModal.prototype, "confirmInputValue", void 0);
+ZsModal = __decorate([
+    customElement('zs-modal')
+], ZsModal);
+export { ZsModal };
+//# sourceMappingURL=zs-modal.js.map

package/dist/fields/zs-modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"zs-modal.js","sourceRoot":"","sources":["../../src/fields/zs-modal.ts"],"names":[],"mappings":"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"}

package/dist/fields/zs-toast.d.ts

@@ -0,0 +1,40 @@
+import { LitElement } from 'lit';
+export interface ToastMessage {
+    id: string;
+    title: string;
+    message?: string;
+    type: 'success' | 'error' | 'warning' | 'info';
+    duration?: number;
+    action?: string;
+    actionId?: string;
+    dismissable?: boolean;
+    icon?: string;
+    progress?: boolean;
+}
+export declare class ZsToast extends LitElement {
+    static styles: import("lit").CSSResult[];
+    position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left' | 'top-center' | 'bottom-center';
+    maxVisible: number;
+    private toasts;
+    private getDefaultIcon;
+    /** Add a toast notification */
+    show(toast: Omit<ToastMessage, 'id'> & {
+        id?: string;
+    }): void;
+    /** Dismiss a toast by ID */
+    dismiss(id: string): void;
+    /** Clear all toasts */
+    clear(): void;
+    /** Convenience methods */
+    success(title: string, message?: string): void;
+    error(title: string, message?: string): void;
+    warning(title: string, message?: string): void;
+    info(title: string, message?: string): void;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'zs-toast': ZsToast;
+    }
+}
+//# sourceMappingURL=zs-toast.d.ts.map

package/dist/fields/zs-toast.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"zs-toast.d.ts","sourceRoot":"","sources":["../../src/fields/zs-toast.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAC;AAIrD,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC;IAC/C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,qBACa,OAAQ,SAAQ,UAAU;IACrC,MAAM,CAAC,MAAM,4BA+FV;IAES,QAAQ,EAAE,WAAW,GAAG,UAAU,GAAG,cAAc,GAAG,aAAa,GAAG,YAAY,GAAG,eAAe,CAAe;IACnG,UAAU,SAAK;IAElC,OAAO,CAAC,MAAM,CAAuF;IAE9G,OAAO,CAAC,cAAc;IAItB,+BAA+B;IAC/B,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,GAAG;QAAE,EAAE,CAAC,EAAE,MAAM,CAAA;KAAE;IAgCtD,4BAA4B;IAC5B,OAAO,CAAC,EAAE,EAAE,MAAM;IAYlB,uBAAuB;IACvB,KAAK;IAOL,0BAA0B;IAC1B,OAAO,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM;IACvC,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM;IACrC,OAAO,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM;IACvC,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM;IAEpC,MAAM;CA6BP;AAED,OAAO,CAAC,MAAM,CAAC;IAAE,UAAU,qBAAqB;QAAG,UAAU,EAAE,OAAO,CAAC;KAAE;CAAE"}

package/dist/fields/zs-toast.js

@@ -0,0 +1,218 @@
+// @zentto/studio — Toast notification system
+// Stackable toasts with auto-dismiss, action buttons, progress bar
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { LitElement, html, css } from 'lit';
+import { customElement, property, state } from 'lit/decorators.js';
+import { studioTokens } from '../styles/tokens.js';
+let ZsToast = class ZsToast extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.position = 'top-right';
+        this.maxVisible = 5;
+        this.toasts = [];
+    }
+    static { this.styles = [studioTokens, css `
+    :host { display: contents; }
+
+    .zs-toast-container {
+      position: fixed; z-index: 9999;
+      display: flex; flex-direction: column; gap: 8px;
+      max-width: 420px; width: 100%;
+      pointer-events: none;
+    }
+    .zs-toast-container--top-right { top: 16px; right: 16px; }
+    .zs-toast-container--top-left { top: 16px; left: 16px; }
+    .zs-toast-container--bottom-right { bottom: 16px; right: 16px; }
+    .zs-toast-container--bottom-left { bottom: 16px; left: 16px; }
+    .zs-toast-container--top-center { top: 16px; left: 50%; transform: translateX(-50%); }
+    .zs-toast-container--bottom-center { bottom: 16px; left: 50%; transform: translateX(-50%); }
+
+    .zs-toast-item {
+      display: flex; align-items: flex-start; gap: 12px;
+      padding: 14px 16px;
+      background: var(--zs-bg, #fff);
+      border-radius: 10px;
+      border-left: 4px solid;
+      box-shadow: 0 8px 30px rgba(0,0,0,0.12);
+      pointer-events: auto;
+      animation: zs-toast-in 300ms cubic-bezier(0.34, 1.56, 0.64, 1);
+      position: relative;
+      overflow: hidden;
+      transition: all 200ms;
+    }
+    .zs-toast-item--removing {
+      animation: zs-toast-out 200ms ease forwards;
+    }
+    .zs-toast-item--success { border-left-color: #27ae60; }
+    .zs-toast-item--error { border-left-color: #e74c3c; }
+    .zs-toast-item--warning { border-left-color: #f39c12; }
+    .zs-toast-item--info { border-left-color: #3498db; }
+
+    @keyframes zs-toast-in {
+      from { opacity: 0; transform: translateX(30px) scale(0.95); }
+      to { opacity: 1; transform: translateX(0) scale(1); }
+    }
+    @keyframes zs-toast-out {
+      from { opacity: 1; transform: translateX(0); max-height: 200px; }
+      to { opacity: 0; transform: translateX(60px); max-height: 0; padding: 0; margin: 0; }
+    }
+
+    .zs-toast-icon { font-size: 20px; flex-shrink: 0; margin-top: 1px; }
+    .zs-toast-content { flex: 1; min-width: 0; }
+    .zs-toast-title {
+      font-size: 14px; font-weight: 600;
+      color: var(--zs-text, #212529);
+      margin: 0;
+    }
+    .zs-toast-message {
+      font-size: 13px; color: var(--zs-text-secondary, #6c757d);
+      margin: 2px 0 0; line-height: 1.4;
+    }
+    .zs-toast-actions {
+      display: flex; gap: 8px; margin-top: 8px;
+    }
+    .zs-toast-action {
+      padding: 4px 12px; border-radius: 6px;
+      font-size: 12px; font-weight: 600;
+      cursor: pointer; border: none;
+      transition: all 100ms;
+    }
+    .zs-toast-action--primary {
+      background: var(--zs-primary, #e67e22); color: white;
+    }
+    .zs-toast-action--primary:hover { filter: brightness(0.9); }
+    .zs-toast-action--secondary {
+      background: var(--zs-bg-secondary, #f8f9fa);
+      color: var(--zs-text-secondary); border: 1px solid var(--zs-border);
+    }
+
+    .zs-toast-close {
+      border: none; background: none; cursor: pointer;
+      color: var(--zs-text-muted, #adb5bd); font-size: 16px;
+      padding: 0; line-height: 1; transition: color 100ms;
+      flex-shrink: 0;
+    }
+    .zs-toast-close:hover { color: var(--zs-text); }
+
+    /* Progress bar */
+    .zs-toast-progress {
+      position: absolute; bottom: 0; left: 0; right: 0;
+      height: 3px; background: rgba(0,0,0,0.06);
+    }
+    .zs-toast-progress-bar {
+      height: 100%; transition: width 100ms linear;
+    }
+    .zs-toast-progress-bar--success { background: #27ae60; }
+    .zs-toast-progress-bar--error { background: #e74c3c; }
+    .zs-toast-progress-bar--warning { background: #f39c12; }
+    .zs-toast-progress-bar--info { background: #3498db; }
+  `]; }
+    getDefaultIcon(type) {
+        return { success: '✅', error: '❌', warning: '⚠️', info: 'ℹ️' }[type] ?? 'ℹ️';
+    }
+    /** Add a toast notification */
+    show(toast) {
+        const id = toast.id ?? `toast-${Date.now()}-${Math.random().toString(36).slice(2, 6)}`;
+        const duration = toast.duration ?? 4000;
+        const item = {
+            ...toast, id,
+            dismissable: toast.dismissable ?? true,
+            progress: toast.progress ?? true,
+            _progress: 100,
+        };
+        this.toasts = [...this.toasts.slice(-(this.maxVisible - 1)), item];
+        if (duration > 0) {
+            const startTime = Date.now();
+            const tick = () => {
+                const elapsed = Date.now() - startTime;
+                const remaining = Math.max(0, 100 - (elapsed / duration) * 100);
+                const t = this.toasts.find(t => t.id === id);
+                if (t) {
+                    t._progress = remaining;
+                    this.requestUpdate();
+                }
+                if (remaining > 0) {
+                    item._timer = requestAnimationFrame(tick);
+                }
+                else {
+                    this.dismiss(id);
+                }
+            };
+            item._timer = requestAnimationFrame(tick);
+        }
+    }
+    /** Dismiss a toast by ID */
+    dismiss(id) {
+        const t = this.toasts.find(t => t.id === id);
+        if (t) {
+            if (t._timer)
+                cancelAnimationFrame(t._timer);
+            t._removing = true;
+            this.requestUpdate();
+            setTimeout(() => {
+                this.toasts = this.toasts.filter(t => t.id !== id);
+            }, 200);
+        }
+    }
+    /** Clear all toasts */
+    clear() {
+        this.toasts.forEach(t => {
+            if (t._timer)
+                cancelAnimationFrame(t._timer);
+        });
+        this.toasts = [];
+    }
+    /** Convenience methods */
+    success(title, message) { this.show({ title, message, type: 'success' }); }
+    error(title, message) { this.show({ title, message, type: 'error', duration: 6000 }); }
+    warning(title, message) { this.show({ title, message, type: 'warning' }); }
+    info(title, message) { this.show({ title, message, type: 'info' }); }
+    render() {
+        return html `
+      <div class="zs-toast-container zs-toast-container--${this.position}">
+        ${this.toasts.map(t => html `
+          <div class="zs-toast-item zs-toast-item--${t.type} ${t._removing ? 'zs-toast-item--removing' : ''}">
+            <span class="zs-toast-icon">${t.icon ?? this.getDefaultIcon(t.type)}</span>
+            <div class="zs-toast-content">
+              <div class="zs-toast-title">${t.title}</div>
+              ${t.message ? html `<div class="zs-toast-message">${t.message}</div>` : ''}
+              ${t.action ? html `
+                <div class="zs-toast-actions">
+                  <button class="zs-toast-action zs-toast-action--primary" @click="${() => {
+            this.dispatchEvent(new CustomEvent('toast-action', { detail: { id: t.id, actionId: t.actionId ?? t.action }, bubbles: true, composed: true }));
+            this.dismiss(t.id);
+        }}">${t.action}</button>
+                </div>
+              ` : ''}
+            </div>
+            ${t.dismissable ? html `<button class="zs-toast-close" @click="${() => this.dismiss(t.id)}">✕</button>` : ''}
+            ${t.progress && t.duration !== 0 ? html `
+              <div class="zs-toast-progress">
+                <div class="zs-toast-progress-bar zs-toast-progress-bar--${t.type}" style="width:${t._progress ?? 100}%"></div>
+              </div>
+            ` : ''}
+          </div>
+        `)}
+      </div>
+    `;
+    }
+};
+__decorate([
+    property()
+], ZsToast.prototype, "position", void 0);
+__decorate([
+    property({ type: Number })
+], ZsToast.prototype, "maxVisible", void 0);
+__decorate([
+    state()
+], ZsToast.prototype, "toasts", void 0);
+ZsToast = __decorate([
+    customElement('zs-toast')
+], ZsToast);
+export { ZsToast };
+//# sourceMappingURL=zs-toast.js.map

package/dist/fields/zs-toast.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"zs-toast.js","sourceRoot":"","sources":["../../src/fields/zs-toast.ts"],"names":[],"mappings":"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"}

package/dist/zentto-studio-app.d.ts

@@ -1,9 +1,10 @@
 import { LitElement, type TemplateResult } from 'lit';
-import type { AppConfig } from '@zentto/studio-core';
+import type { AppConfig, StudioProvider } from '@zentto/studio-core';
 import './zentto-studio-renderer.js';
 export declare class ZenttoStudioApp extends LitElement {
     static styles: import("lit").CSSResult[];
     config: AppConfig | null;
+    provider: StudioProvider;
     customCss: string;
     cssVars: Record<string, string>;
     private currentSegment;

package/dist/zentto-studio-app.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"zentto-studio-app.d.ts","sourceRoot":"","sources":["../src/zentto-studio-app.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,UAAU,EAAsB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAI1E,OAAO,KAAK,EACV,SAAS,EACV,MAAM,qBAAqB,CAAC;AAW7B,OAAO,6BAA6B,CAAC;AAErC,qBACa,eAAgB,SAAQ,UAAU;IAC7C,MAAM,CAAC,MAAM,4BA8OV;IAIyB,MAAM,EAAE,SAAS,GAAG,IAAI,CAAQ;IAChC,SAAS,SAAM;IACf,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAM;IAIxD,OAAO,CAAC,cAAc,CAAM;IAC5B,OAAO,CAAC,gBAAgB,CAAS;IACjC,OAAO,CAAC,gBAAgB,CAAqB;IAC7C,OAAO,CAAC,QAAQ,CAA+B;IAC/C,OAAO,CAAC,WAAW,CAAS;IAC5B,OAAO,CAAC,SAAS,CAAK;IAC/B,OAAO,CAAC,QAAQ,CAAkB;IAClC,OAAO,CAAC,OAAO,CAAgB;IAI/B,iBAAiB;IAWjB,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAWrC,OAAO,CAAC,QAAQ;IAYhB,OAAO,CAAC,MAAM;IAQd,OAAO,KAAK,WAAW,GAEtB;IAED,OAAO,KAAK,WAAW,GA0BtB;YAIa,YAAY;IAyB1B,OAAO,CAAC,OAAO;IAQf,MAAM;IA2CN,OAAO,CAAC,kBAAkB;IAmB1B,OAAO,CAAC,aAAa;IAyCrB,OAAO,CAAC,mBAAmB;IAqB3B,OAAO,CAAC,iBAAiB;IAoBzB,OAAO,CAAC,mBAAmB;IAgB3B,OAAO,CAAC,UAAU;IAmClB,OAAO,CAAC,iBAAiB;IAsBzB,OAAO,CAAC,eAAe;IAwCvB,OAAO,CAAC,gBAAgB;IAcxB,OAAO,CAAC,cAAc;IAyCtB,OAAO,CAAC,eAAe;IAgCd,OAAO,CAAC,SAAS,CAAK;IAE/B,OAAO,CAAC,cAAc;IAqBtB,kDAAkD;IAClD,UAAU,CAAC,OAAO,EAAE,MAAM;IAE1B,+BAA+B;IAC/B,iBAAiB,IAAI,MAAM;IAE3B,wCAAwC;IACxC,WAAW,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAEtC,+BAA+B;IACzB,UAAU;IAEhB,kCAAkC;IAClC,WAAW,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;CAI1C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,mBAAmB,EAAE,eAAe,CAAC;KACtC;CACF"}
+{"version":3,"file":"zentto-studio-app.d.ts","sourceRoot":"","sources":["../src/zentto-studio-app.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,UAAU,EAAsB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAI1E,OAAO,KAAK,EACV,SAAS,EACT,cAAc,EACf,MAAM,qBAAqB,CAAC;AAY7B,OAAO,6BAA6B,CAAC;AAErC,qBACa,eAAgB,SAAQ,UAAU;IAC7C,MAAM,CAAC,MAAM,4BA8OV;IAIyB,MAAM,EAAE,SAAS,GAAG,IAAI,CAAQ;IAChC,QAAQ,EAAE,cAAc,CAAM;IAC9B,SAAS,SAAM;IACf,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAM;IAIxD,OAAO,CAAC,cAAc,CAAM;IAC5B,OAAO,CAAC,gBAAgB,CAAS;IACjC,OAAO,CAAC,gBAAgB,CAAqB;IAC7C,OAAO,CAAC,QAAQ,CAA+B;IAC/C,OAAO,CAAC,WAAW,CAAS;IAC5B,OAAO,CAAC,SAAS,CAAK;IAC/B,OAAO,CAAC,QAAQ,CAAkB;IAClC,OAAO,CAAC,OAAO,CAAgB;IAI/B,iBAAiB;IAWjB,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAWrC,OAAO,CAAC,QAAQ;IAYhB,OAAO,CAAC,MAAM;IAQd,OAAO,KAAK,WAAW,GAEtB;IAED,OAAO,KAAK,WAAW,GA0BtB;YAIa,YAAY;IA8B1B,OAAO,CAAC,OAAO;IAQf,MAAM;IA2CN,OAAO,CAAC,kBAAkB;IAmB1B,OAAO,CAAC,aAAa;IAyCrB,OAAO,CAAC,mBAAmB;IAqB3B,OAAO,CAAC,iBAAiB;IAoBzB,OAAO,CAAC,mBAAmB;IAgB3B,OAAO,CAAC,UAAU;IAmClB,OAAO,CAAC,iBAAiB;IAiCzB,OAAO,CAAC,eAAe;IAwCvB,OAAO,CAAC,gBAAgB;IAcxB,OAAO,CAAC,cAAc;IAyCtB,OAAO,CAAC,eAAe;IAgCd,OAAO,CAAC,SAAS,CAAK;IAE/B,OAAO,CAAC,cAAc;IAqBtB,kDAAkD;IAClD,UAAU,CAAC,OAAO,EAAE,MAAM;IAE1B,+BAA+B;IAC/B,iBAAiB,IAAI,MAAM;IAE3B,wCAAwC;IACxC,WAAW,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAEtC,+BAA+B;IACzB,UAAU;IAEhB,kCAAkC;IAClC,WAAW,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;CAI1C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,mBAAmB,EAAE,eAAe,CAAC;KACtC;CACF"}