@nuralyui/document 0.0.1

package/demo/document-demo.d.ts

@@ -0,0 +1,12 @@
+/**
+ * @license
+ * Copyright 2023 Google Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+import { LitElement } from 'lit';
+import '../document.component.js';
+export declare class HyDatePickerDemoElement extends LitElement {
+    selectedLanguage: string;
+    render(): import("lit").TemplateResult<1>;
+}
+//# sourceMappingURL=document-demo.d.ts.map

package/demo/document-demo.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"document-demo.d.ts","sourceRoot":"","sources":["../../../../src/components/document/demo/document-demo.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAEvC,OAAO,0BAA0B,CAAC;AAElC,qBACa,uBAAwB,SAAQ,UAAU;IAErD,gBAAgB,SAAQ;IAEf,MAAM;CAYhB"}

package/demo/document-demo.js

@@ -0,0 +1,40 @@
+/**
+ * @license
+ * Copyright 2023 Google Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+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 } from 'lit';
+import { customElement, state } from 'lit/decorators.js';
+import '../document.component.js';
+let HyDatePickerDemoElement = class HyDatePickerDemoElement extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.selectedLanguage = 'en';
+    }
+    render() {
+        return html `
+       <hy-pdf-viewer 
+       previewable="true"
+          id="url-viewer"
+          src="http://localhost:7004/api/v1/storage/preview/my-folder%2FRNE%20Public.pdf"
+          width="100%"
+          height="500px"
+          previewable
+        ></hy-pdf-viewer>
+    `;
+    }
+};
+__decorate([
+    state()
+], HyDatePickerDemoElement.prototype, "selectedLanguage", void 0);
+HyDatePickerDemoElement = __decorate([
+    customElement('hy-document-demo')
+], HyDatePickerDemoElement);
+export { HyDatePickerDemoElement };
+//# sourceMappingURL=document-demo.js.map

package/demo/document-demo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"document-demo.js","sourceRoot":"","sources":["../../../../src/components/document/demo/document-demo.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;;;;;;AAEH,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,0BAA0B,CAAC;AAGlC,IAAa,uBAAuB,GAApC,MAAa,uBAAwB,SAAQ,UAAU;IAAvD;;QAEE,qBAAgB,GAAG,IAAI,CAAC;IAc1B,CAAC;IAZU,MAAM;QACb,OAAO,IAAI,CAAA;;;;;;;;;KASV,CAAC;IACJ,CAAC;CACF,CAAA;AAdC;IADC,KAAK,EAAE;iEACgB;AAFb,uBAAuB;IADnC,aAAa,CAAC,kBAAkB,CAAC;GACrB,uBAAuB,CAgBnC;SAhBY,uBAAuB","sourcesContent":["/**\n * @license\n * Copyright 2023 Google Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nimport { LitElement, html } from 'lit';\nimport { customElement, state } from 'lit/decorators.js';\nimport '../document.component.js';\n\n@customElement('hy-document-demo')\nexport class HyDatePickerDemoElement extends LitElement {\n  @state()\n  selectedLanguage = 'en';\n\n  override render() {\n    return html`\n       <hy-pdf-viewer \n       previewable=\"true\"\n          id=\"url-viewer\"\n          src=\"http://localhost:7004/api/v1/storage/preview/my-folder%2FRNE%20Public.pdf\"\n          width=\"100%\"\n          height=\"500px\"\n          previewable\n        ></hy-pdf-viewer>\n    `;\n  }\n}\n"]}

package/document.component.d.ts

@@ -0,0 +1,17 @@
+import { LitElement } from "lit";
+export declare class HyPdfViewer extends LitElement {
+    src: string;
+    width: string;
+    height: string;
+    fallback: null;
+    previewable: boolean;
+    private isFullscreen;
+    defaultFallBack: string;
+    static styles: import("lit").CSSResult;
+    render(): import("lit").TemplateResult<1>;
+    _handleError(e: Event): void;
+    _openFullscreen(): void;
+    _closeFullscreen(): void;
+    disconnectedCallback(): void;
+}
+//# sourceMappingURL=document.component.d.ts.map

package/document.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"document.component.d.ts","sourceRoot":"","sources":["../../../src/components/document/document.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAG5C,qBACa,WAAY,SAAQ,UAAU;IAEzC,GAAG,EAAG,MAAM,CAAC;IAGb,KAAK,SAAU;IAGf,MAAM,SAAU;IAGhB,QAAQ,OAAQ;IAGhB,WAAW,UAAS;IAGpB,OAAO,CAAC,YAAY,CAAS;IAE7B,eAAe,SAAw0B;IAEv1B,OAAgB,MAAM,0BAgGpB;IAEO,MAAM;IA6Cf,YAAY,CAAC,CAAC,EAAE,KAAK;IA0BrB,eAAe;IAMf,gBAAgB;IAOP,oBAAoB;CAO9B"}

package/document.component.js

@@ -0,0 +1,226 @@
+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";
+let HyPdfViewer = class HyPdfViewer extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.width = 'auto';
+        this.height = 'auto';
+        this.fallback = null;
+        this.previewable = false;
+        this.isFullscreen = false;
+        this.defaultFallBack = 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IS0tIFVwbG9hZGVkIHRvOiBTVkcgUmVwbywgd3d3LnN2Z3JlcG8uY29tLCBHZW5lcmF0b3I6IFNWRyBSZXBvIE1peGVyIFRvb2xzIC0tPg0KPHN2ZyB3aWR0aD0iODAwcHgiIGhlaWdodD0iODAwcHgiIHZpZXdCb3g9IjAgMCAxMjAgMTIwIiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPg0KPHJlY3Qgd2lkdGg9IjEyMCIgaGVpZ2h0PSIxMjAiIGZpbGw9IiNFRkYxRjMiLz4NCjxwYXRoIGQ9Ik01OS40IDYyLjhWODAuNEg0OC4yVjQxLjZINjMuNEM2Ny4xIDQxLjYgNzAuMSA0Mi42IDcyLjQgNDQuN0M3NC43IDQ2LjggNzUuOCA0OS42IDc1LjggNTNDNzUuOCA1Ni41IDc0LjcgNTkuMiA3Mi40IDYxLjNDNzAuMiA2My40IDY3LjIgNjQuNCA2My40IDY0LjRINTkuNFY2Mi44Wk01OS40IDU0LjZINjMuNEM2NSA1NC42IDY2LjMgNTQuMSA2Ny4yIDUzQzY4LjEgNTEuOSA2OC42IDUwLjYgNjguNiA0OUM2OC42IDQ3LjUgNjguMSA0Ni4yIDY3LjIgNDUuMUM2Ni4zIDQ0IDY1IDQzLjQgNjMuNCA0My40SDU5LjRWNTQuNloiIGZpbGw9IiM2ODc3ODciLz4NCjwvc3ZnPg==';
+    }
+    render() {
+        return html `
+      <div class="pdf-container" style="width:${this.width}; height:${this.height};">
+        <iframe 
+          class="pdf-iframe"
+          src="${this.src}" 
+          title="PDF Viewer"
+          @error=${this._handleError}
+        ></iframe>
+        
+        ${this.previewable ? html `
+          <button class="preview-button" @click=${this._openFullscreen}>
+            <svg width="14" height="14" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <path d="M5.5 1H1.5C1.22386 1 1 1.22386 1 1.5V5.5C1 5.77614 1.22386 6 1.5 6C1.77614 6 2 5.77614 2 5.5V2H5.5C5.77614 2 6 1.77614 6 1.5C6 1.22386 5.77614 1 5.5 1Z" fill="currentColor"/>
+              <path d="M14.5 1H10.5C10.2239 1 10 1.22386 10 1.5C10 1.77614 10.2239 2 10.5 2H14V5.5C14 5.77614 14.2239 6 14.5 6C14.7761 6 15 5.77614 15 5.5V1.5C15 1.22386 14.7761 1 14.5 1Z" fill="currentColor"/>
+              <path d="M5.5 14H2V10.5C2 10.2239 1.77614 10 1.5 10C1.22386 10 1 10.2239 1 10.5V14.5C1 14.7761 1.22386 15 1.5 15H5.5C5.77614 15 6 14.7761 6 14.5C6 14.2239 5.77614 14 5.5 14Z" fill="currentColor"/>
+              <path d="M14.5 10C14.2239 10 14 10.2239 14 10.5V14H10.5C10.2239 14 10 14.2239 10 14.5C10 14.7761 10.2239 15 10.5 15H14.5C14.7761 15 15 14.7761 15 14.5V10.5C15 10.2239 14.7761 10 14.5 10Z" fill="currentColor"/>
+            </svg>
+            Fullscreen
+          </button>
+        ` : ''}
+      </div>
+      
+      ${this.isFullscreen ? html `
+        <div class="fullscreen-overlay">
+          <div class="fullscreen-header">
+            <button class="close-button" @click=${this._closeFullscreen}>
+              <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+                <path d="M12.5 3.5L3.5 12.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+                <path d="M12.5 12.5L3.5 3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+              </svg>
+            </button>
+          </div>
+          <div class="fullscreen-content">
+            <iframe 
+              class="fullscreen-iframe"
+              src="${this.src}" 
+              title="Fullscreen PDF"
+            ></iframe>
+          </div>
+        </div>
+      ` : ''}
+    `;
+    }
+    _handleError(e) {
+        var _a;
+        console.error('PDF loading error:', e);
+        this.dispatchEvent(new CustomEvent('onError', {
+            bubbles: true,
+            composed: true,
+            detail: {
+                error: `Error loading PDF: PDF viewer not supported or file cannot be loaded`
+            }
+        }));
+        // Show fallback image when error occurs
+        const container = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.pdf-container');
+        if (container) {
+            const iframe = container.querySelector('iframe');
+            if (iframe) {
+                const img = document.createElement('img');
+                img.src = this.fallback || this.defaultFallBack;
+                img.alt = "PDF failed to load";
+                img.style.width = "100%";
+                img.style.height = "100%";
+                img.style.objectFit = "contain";
+                container.replaceChild(img, iframe);
+            }
+        }
+    }
+    _openFullscreen() {
+        this.isFullscreen = true;
+        // Prevent scrolling of the background when fullscreen is active
+        document.body.style.overflow = 'hidden';
+    }
+    _closeFullscreen() {
+        this.isFullscreen = false;
+        // Restore scrolling when fullscreen is closed
+        document.body.style.overflow = '';
+    }
+    // Clean up when component is removed
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        // Ensure body scrolling is restored if component is removed while in fullscreen
+        if (this.isFullscreen) {
+            document.body.style.overflow = '';
+        }
+    }
+};
+HyPdfViewer.styles = css `
+    :host {
+      display: block;
+    }
+    
+    .pdf-container {
+      position: relative;
+      overflow: hidden;
+      min-height: 100px;
+      background-color: #f5f5f5;
+      border: 1px solid #e0e0e0;
+    }
+    
+    .pdf-iframe {
+      border: none;
+      display: block;
+      width: 100%;
+      height: 100%;
+    }
+    
+    .preview-button {
+      position: absolute;
+      top: 10px;
+      right: 10px;
+      background-color: rgba(255, 255, 255, 0.8);
+      border: 1px solid #ccc;
+      border-radius: 4px;
+      padding: 5px 10px;
+      cursor: pointer;
+      display: flex;
+      align-items: center;
+      font-family: system-ui, -apple-system, sans-serif;
+      font-size: 12px;
+      z-index: 10;
+      box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+    }
+    
+    .preview-button:hover {
+      background-color: rgba(255, 255, 255, 1);
+    }
+
+    .preview-button svg {
+      margin-right: 4px;
+    }
+    
+    .fullscreen-overlay {
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100vw;
+      height: 100vh;
+      background-color: rgba(0, 0, 0, 0.95);
+      z-index: 9999;
+      display: flex;
+      flex-direction: column;
+    }
+    
+    .fullscreen-header {
+      display: flex;
+      justify-content: flex-end;
+      padding: 16px;
+      background-color: rgba(0, 0, 0, 0.4);
+    }
+    
+    .close-button {
+      background-color: white;
+      border: none;
+      border-radius: 4px;
+      padding: 8px;
+      cursor: pointer;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 32px;
+      height: 32px;
+      box-shadow: 0 2px 4px rgba(0,0,0,0.2);
+    }
+
+    .close-button:hover {
+      background-color: #f0f0f0;
+    }
+    
+    .fullscreen-content {
+      flex: 1;
+      padding: 0;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+    
+    .fullscreen-iframe {
+      width: 100%;
+      height: 100%;
+      border: none;
+      background-color: white;
+    }
+  `;
+__decorate([
+    property()
+], HyPdfViewer.prototype, "src", void 0);
+__decorate([
+    property()
+], HyPdfViewer.prototype, "width", void 0);
+__decorate([
+    property()
+], HyPdfViewer.prototype, "height", void 0);
+__decorate([
+    property({ type: Object })
+], HyPdfViewer.prototype, "fallback", void 0);
+__decorate([
+    property({ type: Boolean })
+], HyPdfViewer.prototype, "previewable", void 0);
+__decorate([
+    state()
+], HyPdfViewer.prototype, "isFullscreen", void 0);
+HyPdfViewer = __decorate([
+    customElement('hy-pdf-viewer')
+], HyPdfViewer);
+export { HyPdfViewer };
+//# sourceMappingURL=document.component.js.map

package/document.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"document.component.js","sourceRoot":"","sources":["../../../src/components/document/document.component.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, css } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators.js\";\n\n@customElement('hy-pdf-viewer')\nexport class HyPdfViewer extends LitElement {\n  @property()\n  src!: string;\n\n  @property()\n  width = 'auto';\n\n  @property()\n  height = 'auto';\n\n  @property({type: Object})\n  fallback = null;\n\n  @property({ type: Boolean })\n  previewable = false;\n\n  @state()\n  private isFullscreen = false;\n\n  defaultFallBack = 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IS0tIFVwbG9hZGVkIHRvOiBTVkcgUmVwbywgd3d3LnN2Z3JlcG8uY29tLCBHZW5lcmF0b3I6IFNWRyBSZXBvIE1peGVyIFRvb2xzIC0tPg0KPHN2ZyB3aWR0aD0iODAwcHgiIGhlaWdodD0iODAwcHgiIHZpZXdCb3g9IjAgMCAxMjAgMTIwIiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPg0KPHJlY3Qgd2lkdGg9IjEyMCIgaGVpZ2h0PSIxMjAiIGZpbGw9IiNFRkYxRjMiLz4NCjxwYXRoIGQ9Ik01OS40IDYyLjhWODAuNEg0OC4yVjQxLjZINjMuNEM2Ny4xIDQxLjYgNzAuMSA0Mi42IDcyLjQgNDQuN0M3NC43IDQ2LjggNzUuOCA0OS42IDc1LjggNTNDNzUuOCA1Ni41IDc0LjcgNTkuMiA3Mi40IDYxLjNDNzAuMiA2My40IDY3LjIgNjQuNCA2My40IDY0LjRINTkuNFY2Mi44Wk01OS40IDU0LjZINjMuNEM2NSA1NC42IDY2LjMgNTQuMSA2Ny4yIDUzQzY4LjEgNTEuOSA2OC42IDUwLjYgNjguNiA0OUM2OC42IDQ3LjUgNjguMSA0Ni4yIDY3LjIgNDUuMUM2Ni4zIDQ0IDY1IDQzLjQgNjMuNCA0My40SDU5LjRWNTQuNloiIGZpbGw9IiM2ODc3ODciLz4NCjwvc3ZnPg==';\n\n  static override styles = css`\n    :host {\n      display: block;\n    }\n    \n    .pdf-container {\n      position: relative;\n      overflow: hidden;\n      min-height: 100px;\n      background-color: #f5f5f5;\n      border: 1px solid #e0e0e0;\n    }\n    \n    .pdf-iframe {\n      border: none;\n      display: block;\n      width: 100%;\n      height: 100%;\n    }\n    \n    .preview-button {\n      position: absolute;\n      top: 10px;\n      right: 10px;\n      background-color: rgba(255, 255, 255, 0.8);\n      border: 1px solid #ccc;\n      border-radius: 4px;\n      padding: 5px 10px;\n      cursor: pointer;\n      display: flex;\n      align-items: center;\n      font-family: system-ui, -apple-system, sans-serif;\n      font-size: 12px;\n      z-index: 10;\n      box-shadow: 0 2px 4px rgba(0,0,0,0.1);\n    }\n    \n    .preview-button:hover {\n      background-color: rgba(255, 255, 255, 1);\n    }\n\n    .preview-button svg {\n      margin-right: 4px;\n    }\n    \n    .fullscreen-overlay {\n      position: fixed;\n      top: 0;\n      left: 0;\n      width: 100vw;\n      height: 100vh;\n      background-color: rgba(0, 0, 0, 0.95);\n      z-index: 9999;\n      display: flex;\n      flex-direction: column;\n    }\n    \n    .fullscreen-header {\n      display: flex;\n      justify-content: flex-end;\n      padding: 16px;\n      background-color: rgba(0, 0, 0, 0.4);\n    }\n    \n    .close-button {\n      background-color: white;\n      border: none;\n      border-radius: 4px;\n      padding: 8px;\n      cursor: pointer;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      width: 32px;\n      height: 32px;\n      box-shadow: 0 2px 4px rgba(0,0,0,0.2);\n    }\n\n    .close-button:hover {\n      background-color: #f0f0f0;\n    }\n    \n    .fullscreen-content {\n      flex: 1;\n      padding: 0;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n    \n    .fullscreen-iframe {\n      width: 100%;\n      height: 100%;\n      border: none;\n      background-color: white;\n    }\n  `;\n\n  override render() {\n    return html`\n      <div class=\"pdf-container\" style=\"width:${this.width}; height:${this.height};\">\n        <iframe \n          class=\"pdf-iframe\"\n          src=\"${this.src}\" \n          title=\"PDF Viewer\"\n          @error=${this._handleError}\n        ></iframe>\n        \n        ${this.previewable ? html`\n          <button class=\"preview-button\" @click=${this._openFullscreen}>\n            <svg width=\"14\" height=\"14\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path d=\"M5.5 1H1.5C1.22386 1 1 1.22386 1 1.5V5.5C1 5.77614 1.22386 6 1.5 6C1.77614 6 2 5.77614 2 5.5V2H5.5C5.77614 2 6 1.77614 6 1.5C6 1.22386 5.77614 1 5.5 1Z\" fill=\"currentColor\"/>\n              <path d=\"M14.5 1H10.5C10.2239 1 10 1.22386 10 1.5C10 1.77614 10.2239 2 10.5 2H14V5.5C14 5.77614 14.2239 6 14.5 6C14.7761 6 15 5.77614 15 5.5V1.5C15 1.22386 14.7761 1 14.5 1Z\" fill=\"currentColor\"/>\n              <path d=\"M5.5 14H2V10.5C2 10.2239 1.77614 10 1.5 10C1.22386 10 1 10.2239 1 10.5V14.5C1 14.7761 1.22386 15 1.5 15H5.5C5.77614 15 6 14.7761 6 14.5C6 14.2239 5.77614 14 5.5 14Z\" fill=\"currentColor\"/>\n              <path d=\"M14.5 10C14.2239 10 14 10.2239 14 10.5V14H10.5C10.2239 14 10 14.2239 10 14.5C10 14.7761 10.2239 15 10.5 15H14.5C14.7761 15 15 14.7761 15 14.5V10.5C15 10.2239 14.7761 10 14.5 10Z\" fill=\"currentColor\"/>\n            </svg>\n            Fullscreen\n          </button>\n        ` : ''}\n      </div>\n      \n      ${this.isFullscreen ? html`\n        <div class=\"fullscreen-overlay\">\n          <div class=\"fullscreen-header\">\n            <button class=\"close-button\" @click=${this._closeFullscreen}>\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                <path d=\"M12.5 3.5L3.5 12.5\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                <path d=\"M12.5 12.5L3.5 3.5\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n              </svg>\n            </button>\n          </div>\n          <div class=\"fullscreen-content\">\n            <iframe \n              class=\"fullscreen-iframe\"\n              src=\"${this.src}\" \n              title=\"Fullscreen PDF\"\n            ></iframe>\n          </div>\n        </div>\n      ` : ''}\n    `;\n  }\n\n  _handleError(e: Event) {\n    console.error('PDF loading error:', e);\n    this.dispatchEvent(new CustomEvent('onError', {\n      bubbles: true,\n      composed: true,\n      detail: {\n        error: `Error loading PDF: PDF viewer not supported or file cannot be loaded`\n      }\n    }));\n    \n    // Show fallback image when error occurs\n    const container = this.shadowRoot?.querySelector('.pdf-container');\n    if (container) {\n      const iframe = container.querySelector('iframe');\n      if (iframe) {\n        const img = document.createElement('img');\n        img.src = this.fallback || this.defaultFallBack;\n        img.alt = \"PDF failed to load\";\n        img.style.width = \"100%\";\n        img.style.height = \"100%\";\n        img.style.objectFit = \"contain\";\n        container.replaceChild(img, iframe);\n      }\n    }\n  }\n\n  _openFullscreen() {\n    this.isFullscreen = true;\n    // Prevent scrolling of the background when fullscreen is active\n    document.body.style.overflow = 'hidden';\n  }\n\n  _closeFullscreen() {\n    this.isFullscreen = false;\n    // Restore scrolling when fullscreen is closed\n    document.body.style.overflow = '';\n  }\n\n  // Clean up when component is removed\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    // Ensure body scrolling is restored if component is removed while in fullscreen\n    if (this.isFullscreen) {\n      document.body.style.overflow = '';\n    }\n  }\n}"]}

package/document.style.d.ts

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

package/document.style.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"document.style.d.ts","sourceRoot":"","sources":["../../../src/components/document/document.style.ts"],"names":[],"mappings":";AAEA,wBAsIE"}

package/document.style.js

@@ -0,0 +1,137 @@
+import { css } from 'lit';
+export default css `
+  :host {
+    display: block;
+  }
+  
+  .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-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: transparent;
+    border: none;
+    font-size: 24px;
+    cursor: pointer;
+    z-index: 1010;
+    color: #333;
+  }
+  
+  .preview-close:hover {
+    color: #000;
+  }
+  
+  .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/document.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"document.style.js","sourceRoot":"","sources":["../../../src/components/document/document.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsIjB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport default css`\n  :host {\n    display: block;\n  }\n  \n  .pdf-container {\n    display: flex;\n    flex-direction: column;\n    border: 1px solid #ccc;\n    border-radius: 4px;\n    overflow: hidden;\n    background-color: #f5f5f5;\n    position: relative;\n  }\n  \n  .toolbar {\n    display: flex;\n    align-items: center;\n    padding: 8px;\n    background-color: #f0f0f0;\n    border-bottom: 1px solid #ddd;\n    gap: 8px;\n  }\n  \n  .toolbar button {\n    background-color: #fff;\n    border: 1px solid #ccc;\n    border-radius: 4px;\n    padding: 4px 8px;\n    cursor: pointer;\n    font-size: 14px;\n  }\n  \n  .toolbar button:hover {\n    background-color: #e6e6e6;\n  }\n  \n  .toolbar button:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n  \n  .toolbar span {\n    margin: 0 4px;\n    font-size: 14px;\n  }\n  \n  .canvas-container {\n    flex: 1;\n    overflow: auto;\n    display: flex;\n    justify-content: center;\n    align-items: flex-start;\n    background-color: #e0e0e0;\n    padding: 16px;\n    min-height: 200px;\n  }\n  \n  canvas {\n    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);\n    background-color: white;\n  }\n  \n  .preview-modal {\n    position: fixed;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background-color: rgba(0, 0, 0, 0.8);\n    z-index: 1000;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n  \n  .preview-content {\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    width: 90%;\n    height: 90%;\n    background-color: #f5f5f5;\n    border-radius: 8px;\n    overflow: hidden;\n  }\n  \n  .preview-toolbar {\n    display: flex;\n    align-items: center;\n    padding: 12px;\n    background-color: #f0f0f0;\n    border-bottom: 1px solid #ddd;\n    gap: 12px;\n  }\n  \n  .preview-toolbar button {\n    background-color: #fff;\n    border: 1px solid #ccc;\n    border-radius: 4px;\n    padding: 6px 12px;\n    cursor: pointer;\n    font-size: 16px;\n  }\n  \n  .preview-toolbar span {\n    margin: 0 6px;\n    font-size: 16px;\n  }\n  \n  .preview-close {\n    position: absolute;\n    top: 10px;\n    right: 10px;\n    background-color: transparent;\n    border: none;\n    font-size: 24px;\n    cursor: pointer;\n    z-index: 1010;\n    color: #333;\n  }\n  \n  .preview-close:hover {\n    color: #000;\n  }\n  \n  .preview-modal canvas {\n    max-width: 100%;\n    max-height: calc(100% - 60px); /* Account for toolbar height */\n    object-fit: contain;\n    margin: auto;\n    display: block;\n    flex: 1;\n  }\n`;"]}

package/index.d.ts

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

package/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/document/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAA"}

package/index.js

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

package/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/document/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAA","sourcesContent":["export * from './document.component.js'"]}

package/package.json

@@ -0,0 +1,12 @@
+{
+    "name": "@nuralyui/document",
+    "version": "0.0.1",
+    "description": "",
+    "main": "index.js",
+    "type": "module",
+    "scripts": {
+        "test": "echo \"Error: no test specified\" && exit 1"
+    },
+    "author": "Labidi Aymen",
+    "license": "ISC"
+}