@nuraly/lumenui 0.1.0

package/dist/src/components/document/bundle.js

@@ -0,0 +1,242 @@
+import{css as e,LitElement as o,html as i}from"lit";import{property as t,state as r,customElement as s}from"lit/decorators.js";import{classMap as n}from"lit/directives/class-map.js";import{styleMap as a}from"lit/directives/style-map.js";import{NuralyUIBaseMixin as d}from"@nuralyui/common/mixins";var l=e`
+  :host {
+    display: block;
+  }
+
+  .document-container {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    position: relative;
+    background-color: #f5f5f5;
+  }
+
+  .document-iframe {
+    width: 100%;
+    height: 100%;
+    border: none;
+    flex: 1;
+  }
+
+  .error-message {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+    padding: 2rem;
+    text-align: center;
+  }
+
+  .error-icon {
+    width: 64px;
+    height: 64px;
+    margin-bottom: 1rem;
+  }
+
+  .preview-button {
+    position: absolute;
+    bottom: 10px;
+    right: 10px;
+    background-color: rgba(255, 255, 255, 0.9);
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    padding: 8px 12px;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    font-size: 14px;
+    z-index: 10;
+  }
+
+  .preview-button:hover {
+    background-color: #fff;
+  }
+  
+  .pdf-container {
+    display: flex;
+    flex-direction: column;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    overflow: hidden;
+    background-color: #f5f5f5;
+    position: relative;
+  }
+  
+  .toolbar {
+    display: flex;
+    align-items: center;
+    padding: 8px;
+    background-color: #f0f0f0;
+    border-bottom: 1px solid #ddd;
+    gap: 8px;
+  }
+  
+  .toolbar button {
+    background-color: #fff;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    padding: 4px 8px;
+    cursor: pointer;
+    font-size: 14px;
+  }
+  
+  .toolbar button:hover {
+    background-color: #e6e6e6;
+  }
+  
+  .toolbar button:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+  
+  .toolbar span {
+    margin: 0 4px;
+    font-size: 14px;
+  }
+  
+  .canvas-container {
+    flex: 1;
+    overflow: auto;
+    display: flex;
+    justify-content: center;
+    align-items: flex-start;
+    background-color: #e0e0e0;
+    padding: 16px;
+    min-height: 200px;
+  }
+  
+  canvas {
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
+    background-color: white;
+  }
+  
+  .preview-modal {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: rgba(0, 0, 0, 0.8);
+    z-index: 1000;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .preview-modal iframe {
+    width: 100%;
+    height: 100%;
+    border: none;
+  }
+  
+  .preview-content {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    width: 90%;
+    height: 90%;
+    background-color: #f5f5f5;
+    border-radius: 8px;
+    overflow: hidden;
+  }
+  
+  .preview-toolbar {
+    display: flex;
+    align-items: center;
+    padding: 12px;
+    background-color: #f0f0f0;
+    border-bottom: 1px solid #ddd;
+    gap: 12px;
+  }
+  
+  .preview-toolbar button {
+    background-color: #fff;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    padding: 6px 12px;
+    cursor: pointer;
+    font-size: 16px;
+  }
+  
+  .preview-toolbar span {
+    margin: 0 6px;
+    font-size: 16px;
+  }
+  
+  .preview-close {
+    position: absolute;
+    top: 10px;
+    right: 10px;
+    background-color: rgba(255, 255, 255, 0.9);
+    border: none;
+    border-radius: 50%;
+    width: 32px;
+    height: 32px;
+    font-size: 24px;
+    cursor: pointer;
+    z-index: 1010;
+    color: #333;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+  
+  .preview-close:hover {
+    background-color: #fff;
+    color: #000;
+  }
+
+  .preview-header {
+    position: absolute;
+    top: 0;
+    right: 0;
+    z-index: 1010;
+    padding: 10px;
+  }
+  
+  .preview-modal canvas {
+    max-width: 100%;
+    max-height: calc(100% - 60px); /* Account for toolbar height */
+    object-fit: contain;
+    margin: auto;
+    display: block;
+    flex: 1;
+  }
+`,c=function(e,o,i,t){for(var r,s=arguments.length,n=s<3?o:null===t?t=Object.getOwnPropertyDescriptor(o,i):t,a=e.length-1;a>=0;a--)(r=e[a])&&(n=(s<3?r(n):s>3?r(o,i,n):r(o,i))||n);return s>3&&n&&Object.defineProperty(o,i,n),n};let p=class extends(d(o)){constructor(){super(...arguments),this.type="pdf",this.width="auto",this.height="500px",this.previewable=!1,this.block=!1,this.showPreview=!1,this.hasError=!1,this.defaultFallback="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIwIiBoZWlnaHQ9IjEyMCIgdmlld0JveD0iMCAwIDEyMCAxMjAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHJlY3Qgd2lkdGg9IjEyMCIgaGVpZ2h0PSIxMjAiIGZpbGw9IiNFRkYxRjMiLz48cGF0aCBkPSJNNTkuNCA2Mi44VjgwLjRINDguMlY0MS42SDYzLjRDNjcuMSA0MS42IDcwLjEgNDIuNiA3Mi40IDQ0LjdDNzQuNyA0Ni44IDc1LjggNDkuNiA3NS44IDUzQzc1LjggNTYuNSA3NC43IDU5LjIgNzIuNCA2MS4zQzcwLjIgNjMuNCA2Ny4yIDY0LjQgNjMuNCA2NC40SDU5LjRWNjIuOFpNNTkuNCA1NC42SDYzLjRDNjUgNTQuNiA2Ni4zIDU0LjEgNjcuMiA1M0M2OC4xIDUxLjkgNjguNiA1MC42IDY4LjYgNDlDNjguNiA0Ny41IDY4LjEgNDYuMiA2Ny4yIDQ1LjFDNjYuMyA0NCA2NSA0My40IDYzLjQgNDMuNEg1OS40VjU0LjZaIiBmaWxsPSIjNjg3Nzg3Ii8+PC9zdmc+"}handleError(){this.hasError=!0,this.dispatchEvent(new CustomEvent("nr-document-error",{bubbles:!0,composed:!0,detail:{error:`Error loading document: ${this.src}`,src:this.src,type:this.type}}))}handleLoad(){this.dispatchEvent(new CustomEvent("nr-document-load",{bubbles:!0,composed:!0,detail:{src:this.src,type:this.type}}))}showPreviewModal(){this.previewable&&!this.hasError&&(this.showPreview=!0,this.dispatchEvent(new CustomEvent("nr-document-preview-open",{bubbles:!0,composed:!0,detail:{src:this.src,type:this.type}})))}closePreviewModal(){this.showPreview=!1,this.dispatchEvent(new CustomEvent("nr-document-preview-close",{bubbles:!0,composed:!0,detail:{src:this.src,type:this.type}}))}render(){const e={"document-container":!0,"document--error":this.hasError},o={width:"number"==typeof this.width?`${this.width}px`:this.width,height:"number"==typeof this.height?`${this.height}px`:this.height};return this.hasError?i`
+        <div class=${n(e)} style=${a(o)}>
+          <div class="error-message">
+            <img class="error-icon" src=${this.defaultFallback} alt="Document error" />
+            <p>Unable to load document</p>
+          </div>
+        </div>
+      `:i`
+      <div class=${n(e)} style=${a(o)}>
+        <iframe
+          class="document-iframe"
+          src=${this.src}
+          @error=${this.handleError}
+          @load=${this.handleLoad}
+          title="Document viewer"
+        ></iframe>
+        ${this.previewable?i`
+          <button class="preview-button" @click=${this.showPreviewModal}>
+            <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor">
+              <path d="M5.5 5.5A.5.5 0 0 1 6 6v3a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v3a.5.5 0 0 0 1 0V6z"/>
+              <path d="M2 1a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H2zM1 2a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2z"/>
+            </svg>
+            Fullscreen
+          </button>
+        `:""}
+        ${this.showPreview?i`
+          <div class="preview-modal">
+            <div class="preview-header">
+              <button class="preview-close" @click=${this.closePreviewModal} aria-label="Close preview">×</button>
+            </div>
+            <iframe src=${this.src} title="Document viewer fullscreen"></iframe>
+          </div>
+        `:""}
+      </div>
+    `}};p.styles=l,c([t({type:String})],p.prototype,"src",void 0),c([t({type:String})],p.prototype,"type",void 0),c([t({type:String})],p.prototype,"width",void 0),c([t({type:String})],p.prototype,"height",void 0),c([t({type:Boolean})],p.prototype,"previewable",void 0),c([t({type:Boolean,reflect:!0})],p.prototype,"block",void 0),c([r()],p.prototype,"showPreview",void 0),c([r()],p.prototype,"hasError",void 0),p=c([s("nr-document")],p);export{p as NrDocumentElement};

package/dist/src/components/document/document.component.d.ts

@@ -0,0 +1,27 @@
+import { LitElement } from "lit";
+import { DocumentType } from "./document.types.js";
+declare const NrDocumentElement_base: (new (...args: any[]) => import("@nuralyui/common/mixins").DependencyAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").ThemeAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").EventHandlerCapable) & typeof LitElement;
+export declare class NrDocumentElement extends NrDocumentElement_base {
+    static styles: import("lit").CSSResult;
+    src: string;
+    type: DocumentType;
+    width: string;
+    height: string;
+    previewable: boolean;
+    block: boolean;
+    private showPreview;
+    private hasError;
+    private readonly defaultFallback;
+    private handleError;
+    private handleLoad;
+    private showPreviewModal;
+    private closePreviewModal;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'nr-document': NrDocumentElement;
+    }
+}
+export {};
+//# sourceMappingURL=document.component.d.ts.map

package/dist/src/components/document/document.component.js

@@ -0,0 +1,136 @@
+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 { html, LitElement } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
+import { classMap } from "lit/directives/class-map.js";
+import { styleMap } from "lit/directives/style-map.js";
+import { NuralyUIBaseMixin } from '@nuralyui/common/mixins';
+import styles from "./document.style.js";
+let NrDocumentElement = class NrDocumentElement extends NuralyUIBaseMixin(LitElement) {
+    constructor() {
+        super(...arguments);
+        this.type = "pdf" /* DocumentType.PDF */;
+        this.width = 'auto';
+        this.height = '500px';
+        this.previewable = false;
+        this.block = false;
+        this.showPreview = false;
+        this.hasError = false;
+        this.defaultFallback = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIwIiBoZWlnaHQ9IjEyMCIgdmlld0JveD0iMCAwIDEyMCAxMjAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHJlY3Qgd2lkdGg9IjEyMCIgaGVpZ2h0PSIxMjAiIGZpbGw9IiNFRkYxRjMiLz48cGF0aCBkPSJNNTkuNCA2Mi44VjgwLjRINDguMlY0MS42SDYzLjRDNjcuMSA0MS42IDcwLjEgNDIuNiA3Mi40IDQ0LjdDNzQuNyA0Ni44IDc1LjggNDkuNiA3NS44IDUzQzc1LjggNTYuNSA3NC43IDU5LjIgNzIuNCA2MS4zQzcwLjIgNjMuNCA2Ny4yIDY0LjQgNjMuNCA2NC40SDU5LjRWNjIuOFpNNTkuNCA1NC42SDYzLjRDNjUgNTQuNiA2Ni4zIDU0LjEgNjcuMiA1M0M2OC4xIDUxLjkgNjguNiA1MC42IDY4LjYgNDlDNjguNiA0Ny41IDY4LjEgNDYuMiA2Ny4yIDQ1LjFDNjYuMyA0NCA2NSA0My40IDYzLjQgNDMuNEg1OS40VjU0LjZaIiBmaWxsPSIjNjg3Nzg3Ii8+PC9zdmc+';
+    }
+    handleError() {
+        this.hasError = true;
+        this.dispatchEvent(new CustomEvent('nr-document-error', {
+            bubbles: true,
+            composed: true,
+            detail: { error: `Error loading document: ${this.src}`, src: this.src, type: this.type }
+        }));
+    }
+    handleLoad() {
+        this.dispatchEvent(new CustomEvent('nr-document-load', {
+            bubbles: true,
+            composed: true,
+            detail: { src: this.src, type: this.type }
+        }));
+    }
+    showPreviewModal() {
+        if (this.previewable && !this.hasError) {
+            this.showPreview = true;
+            this.dispatchEvent(new CustomEvent('nr-document-preview-open', {
+                bubbles: true,
+                composed: true,
+                detail: { src: this.src, type: this.type }
+            }));
+        }
+    }
+    closePreviewModal() {
+        this.showPreview = false;
+        this.dispatchEvent(new CustomEvent('nr-document-preview-close', {
+            bubbles: true,
+            composed: true,
+            detail: { src: this.src, type: this.type }
+        }));
+    }
+    render() {
+        const containerClasses = {
+            'document-container': true,
+            'document--error': this.hasError
+        };
+        const containerStyles = {
+            width: typeof this.width === 'number' ? `${this.width}px` : this.width,
+            height: typeof this.height === 'number' ? `${this.height}px` : this.height,
+        };
+        if (this.hasError) {
+            return html `
+        <div class=${classMap(containerClasses)} style=${styleMap(containerStyles)}>
+          <div class="error-message">
+            <img class="error-icon" src=${this.defaultFallback} alt="Document error" />
+            <p>Unable to load document</p>
+          </div>
+        </div>
+      `;
+        }
+        return html `
+      <div class=${classMap(containerClasses)} style=${styleMap(containerStyles)}>
+        <iframe
+          class="document-iframe"
+          src=${this.src}
+          @error=${this.handleError}
+          @load=${this.handleLoad}
+          title="Document viewer"
+        ></iframe>
+        ${this.previewable ? html `
+          <button class="preview-button" @click=${this.showPreviewModal}>
+            <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor">
+              <path d="M5.5 5.5A.5.5 0 0 1 6 6v3a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v3a.5.5 0 0 0 1 0V6z"/>
+              <path d="M2 1a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H2zM1 2a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2z"/>
+            </svg>
+            Fullscreen
+          </button>
+        ` : ''}
+        ${this.showPreview ? html `
+          <div class="preview-modal">
+            <div class="preview-header">
+              <button class="preview-close" @click=${this.closePreviewModal} aria-label="Close preview">×</button>
+            </div>
+            <iframe src=${this.src} title="Document viewer fullscreen"></iframe>
+          </div>
+        ` : ''}
+      </div>
+    `;
+    }
+};
+NrDocumentElement.styles = styles;
+__decorate([
+    property({ type: String })
+], NrDocumentElement.prototype, "src", void 0);
+__decorate([
+    property({ type: String })
+], NrDocumentElement.prototype, "type", void 0);
+__decorate([
+    property({ type: String })
+], NrDocumentElement.prototype, "width", void 0);
+__decorate([
+    property({ type: String })
+], NrDocumentElement.prototype, "height", void 0);
+__decorate([
+    property({ type: Boolean })
+], NrDocumentElement.prototype, "previewable", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], NrDocumentElement.prototype, "block", void 0);
+__decorate([
+    state()
+], NrDocumentElement.prototype, "showPreview", void 0);
+__decorate([
+    state()
+], NrDocumentElement.prototype, "hasError", void 0);
+NrDocumentElement = __decorate([
+    customElement('nr-document')
+], NrDocumentElement);
+export { NrDocumentElement };
+//# sourceMappingURL=document.component.js.map

package/dist/src/components/document/document.style.d.ts

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

package/dist/src/components/document/document.style.js

@@ -0,0 +1,210 @@
+import { css } from 'lit';
+export default css `
+  :host {
+    display: block;
+  }
+
+  .document-container {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    position: relative;
+    background-color: #f5f5f5;
+  }
+
+  .document-iframe {
+    width: 100%;
+    height: 100%;
+    border: none;
+    flex: 1;
+  }
+
+  .error-message {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+    padding: 2rem;
+    text-align: center;
+  }
+
+  .error-icon {
+    width: 64px;
+    height: 64px;
+    margin-bottom: 1rem;
+  }
+
+  .preview-button {
+    position: absolute;
+    bottom: 10px;
+    right: 10px;
+    background-color: rgba(255, 255, 255, 0.9);
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    padding: 8px 12px;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    font-size: 14px;
+    z-index: 10;
+  }
+
+  .preview-button:hover {
+    background-color: #fff;
+  }
+  
+  .pdf-container {
+    display: flex;
+    flex-direction: column;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    overflow: hidden;
+    background-color: #f5f5f5;
+    position: relative;
+  }
+  
+  .toolbar {
+    display: flex;
+    align-items: center;
+    padding: 8px;
+    background-color: #f0f0f0;
+    border-bottom: 1px solid #ddd;
+    gap: 8px;
+  }
+  
+  .toolbar button {
+    background-color: #fff;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    padding: 4px 8px;
+    cursor: pointer;
+    font-size: 14px;
+  }
+  
+  .toolbar button:hover {
+    background-color: #e6e6e6;
+  }
+  
+  .toolbar button:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+  
+  .toolbar span {
+    margin: 0 4px;
+    font-size: 14px;
+  }
+  
+  .canvas-container {
+    flex: 1;
+    overflow: auto;
+    display: flex;
+    justify-content: center;
+    align-items: flex-start;
+    background-color: #e0e0e0;
+    padding: 16px;
+    min-height: 200px;
+  }
+  
+  canvas {
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
+    background-color: white;
+  }
+  
+  .preview-modal {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: rgba(0, 0, 0, 0.8);
+    z-index: 1000;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .preview-modal iframe {
+    width: 100%;
+    height: 100%;
+    border: none;
+  }
+  
+  .preview-content {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    width: 90%;
+    height: 90%;
+    background-color: #f5f5f5;
+    border-radius: 8px;
+    overflow: hidden;
+  }
+  
+  .preview-toolbar {
+    display: flex;
+    align-items: center;
+    padding: 12px;
+    background-color: #f0f0f0;
+    border-bottom: 1px solid #ddd;
+    gap: 12px;
+  }
+  
+  .preview-toolbar button {
+    background-color: #fff;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    padding: 6px 12px;
+    cursor: pointer;
+    font-size: 16px;
+  }
+  
+  .preview-toolbar span {
+    margin: 0 6px;
+    font-size: 16px;
+  }
+  
+  .preview-close {
+    position: absolute;
+    top: 10px;
+    right: 10px;
+    background-color: rgba(255, 255, 255, 0.9);
+    border: none;
+    border-radius: 50%;
+    width: 32px;
+    height: 32px;
+    font-size: 24px;
+    cursor: pointer;
+    z-index: 1010;
+    color: #333;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+  
+  .preview-close:hover {
+    background-color: #fff;
+    color: #000;
+  }
+
+  .preview-header {
+    position: absolute;
+    top: 0;
+    right: 0;
+    z-index: 1010;
+    padding: 10px;
+  }
+  
+  .preview-modal canvas {
+    max-width: 100%;
+    max-height: calc(100% - 60px); /* Account for toolbar height */
+    object-fit: contain;
+    margin: auto;
+    display: block;
+    flex: 1;
+  }
+`;
+//# sourceMappingURL=document.style.js.map

package/dist/src/components/document/document.types.d.ts

@@ -0,0 +1,68 @@
+/**
+ * @license
+ * Copyright 2023 Nuraly, Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+/**
+ * Document viewer type
+ */
+export declare const enum DocumentType {
+    /** PDF document */
+    PDF = "pdf",
+    /** Image document */
+    Image = "image",
+    /** Other/unknown type */
+    Other = "other"
+}
+/**
+ * Document fit mode
+ */
+export declare const enum DocumentFit {
+    /** Fit to width */
+    Width = "width",
+    /** Fit to height */
+    Height = "height",
+    /** Fit to page */
+    Page = "page",
+    /** Auto fit */
+    Auto = "auto"
+}
+/**
+ * Document configuration interface
+ */
+export interface DocumentConfig {
+    /** Document source URL */
+    src: string;
+    /** Document type */
+    type?: DocumentType;
+    /** Fallback document URL or image */
+    fallback?: string;
+    /** Document width */
+    width?: string | number;
+    /** Document height */
+    height?: string | number;
+    /** Whether document is previewable (fullscreen) */
+    previewable?: boolean;
+    /** Fit mode for document display */
+    fit?: DocumentFit;
+    /** Custom CSS class */
+    customClass?: string;
+    /** Callback when document loads */
+    onLoad?: () => void;
+    /** Callback when document fails to load */
+    onError?: (error: Error) => void;
+}
+/**
+ * Document event detail
+ */
+export interface DocumentEventDetail {
+    /** Original event */
+    originalEvent?: Event;
+    /** Error message if applicable */
+    error?: string;
+    /** Document source */
+    src?: string;
+    /** Document type */
+    type?: DocumentType;
+}
+//# sourceMappingURL=document.types.d.ts.map

package/dist/src/components/document/document.types.js

@@ -0,0 +1,7 @@
+/**
+ * @license
+ * Copyright 2023 Nuraly, Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+export {};
+//# sourceMappingURL=document.types.js.map

package/dist/src/components/document/index.d.ts

@@ -0,0 +1,3 @@
+export * from './document.component.js';
+export * from './document.types.js';
+//# sourceMappingURL=index.d.ts.map