@embedpdf/svelte-pdf-viewer 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 CloudPDF
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,86 @@
+# @embedpdf/svelte-pdf-viewer
+
+Svelte component for embedding PDF documents with full-featured viewing capabilities.
+
+## Installation
+
+```bash
+npm install @embedpdf/svelte-pdf-viewer
+# or
+pnpm add @embedpdf/svelte-pdf-viewer
+# or
+yarn add @embedpdf/svelte-pdf-viewer
+```
+
+## Usage
+
+```svelte
+<script>
+  import { PDFViewer } from '@embedpdf/svelte-pdf-viewer';
+
+  const config = {
+    src: '/document.pdf',
+    theme: { preference: 'system' },
+  };
+
+  function onReady(event) {
+    console.log('PDF viewer ready', event.detail);
+  }
+</script>
+
+<PDFViewer {config} style="width: 100%; height: 100vh;" on:ready={onReady} />
+```
+
+## Props
+
+| Prop     | Type              | Description                              |
+| -------- | ----------------- | ---------------------------------------- |
+| `config` | `PDFViewerConfig` | Full configuration object for the viewer |
+| `class`  | `string`          | CSS class name for the container         |
+| `style`  | `string`          | Inline styles for the container          |
+
+The `config` prop accepts all configuration options from `@embedpdf/snippet`, including:
+
+- `src` - URL or path to the PDF document
+- `theme` - Theme configuration
+- `zoom` - Zoom configuration
+- `scroll` - Scroll configuration
+- `annotations` - Annotation configuration
+- And more...
+
+## Events
+
+| Event   | Detail              | Description                      |
+| ------- | ------------------- | -------------------------------- |
+| `init`  | `EmbedPdfContainer` | Fired when viewer is initialized |
+| `ready` | `PluginRegistry`    | Fired when registry is ready     |
+
+## Accessing the Registry
+
+Use bind: directives to access the viewer container and registry:
+
+```svelte
+<script>
+  import { PDFViewer } from '@embedpdf/svelte-pdf-viewer';
+
+  let container;
+  let registry;
+
+  async function handleClick() {
+    const reg = await registry;
+    // Use registry to access plugins
+  }
+</script>
+
+<PDFViewer
+  bind:container
+  bind:registry
+  config={{ src: '/document.pdf' }}
+  style="width: 100%; height: 100vh;"
+/>
+<button on:click={handleClick}>Get Registry</button>
+```
+
+## License
+
+MIT

package/dist/PDFViewer.svelte

@@ -0,0 +1,53 @@
+<script lang="ts">
+  import { onMount, onDestroy, createEventDispatcher } from 'svelte';
+  import EmbedPDF, {
+    type EmbedPdfContainer,
+    type PDFViewerConfig,
+    type PluginRegistry,
+  } from '@embedpdf/snippet';
+
+  /** Full configuration for the PDF viewer */
+  export let config: PDFViewerConfig = {};
+
+  /** Exposed bindings for accessing the viewer */
+  export let container: EmbedPdfContainer | null = null;
+  export let registry: Promise<PluginRegistry> | null = null;
+
+  const dispatch = createEventDispatcher<{
+    init: EmbedPdfContainer;
+    ready: PluginRegistry;
+  }>();
+
+  let containerEl: HTMLDivElement;
+
+  onMount(() => {
+    // Initialize the viewer with the config prop
+    const viewer = EmbedPDF.init({
+      type: 'container',
+      target: containerEl,
+      ...config,
+    });
+
+    if (viewer) {
+      container = viewer;
+      registry = viewer.registry;
+      dispatch('init', viewer);
+
+      // Dispatch ready when registry is available
+      viewer.registry.then((reg) => {
+        dispatch('ready', reg);
+      });
+    }
+  });
+
+  onDestroy(() => {
+    // Cleanup: remove the viewer element
+    if (container && containerEl) {
+      containerEl.innerHTML = '';
+      container = null;
+      registry = null;
+    }
+  });
+</script>
+
+<div bind:this={containerEl} class={$$props.class} style={$$props.style} />

package/dist/PDFViewer.svelte.d.ts

@@ -0,0 +1,28 @@
+import { type EmbedPdfContainer, type PDFViewerConfig, type PluginRegistry } from '@embedpdf/snippet';
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const PDFViewer: $$__sveltets_2_IsomorphicComponent<{
+    [x: string]: any;
+    config?: PDFViewerConfig | undefined;
+    container?: (EmbedPdfContainer | null) | undefined;
+    registry?: (Promise<PluginRegistry> | null) | undefined;
+}, {
+    init: CustomEvent<EmbedPdfContainer>;
+    ready: CustomEvent<PluginRegistry>;
+} & {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type PDFViewer = InstanceType<typeof PDFViewer>;
+export default PDFViewer;
+//# sourceMappingURL=PDFViewer.svelte.d.ts.map

package/dist/PDFViewer.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PDFViewer.svelte.d.ts","sourceRoot":"","sources":["../src/PDFViewer.svelte.ts"],"names":[],"mappings":"AAIA,OAAiB,EACb,KAAK,iBAAiB,EACtB,KAAK,eAAe,EACpB,KAAK,cAAc,EACpB,MAAM,mBAAmB,CAAC;AA2D7B,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,SAAS;;aAdsC,eAAe;iBACR,iBAAiB,GAAG,IAAI;gBAAa,OAAO,CAAC,cAAc,CAAC,GAAG,IAAI;;;;;;kBAaV,CAAC;AACpG,KAAK,SAAS,GAAG,YAAY,CAAC,OAAO,SAAS,CAAC,CAAC;AAClD,eAAe,SAAS,CAAC"}

package/dist/index.d.ts

@@ -0,0 +1,3 @@
+export { default as PDFViewer } from './PDFViewer.svelte';
+export * from '@embedpdf/snippet';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAG1D,cAAc,mBAAmB,CAAC"}

package/dist/index.js

@@ -0,0 +1,4 @@
+// Re-export the component
+export { default as PDFViewer } from './PDFViewer.svelte';
+// Re-export everything from snippet for convenience
+export * from '@embedpdf/snippet';

package/package.json

@@ -0,0 +1,52 @@
+{
+  "name": "@embedpdf/svelte-pdf-viewer",
+  "version": "1.0.0",
+  "description": "Svelte component for embedding PDF documents",
+  "license": "MIT",
+  "type": "module",
+  "sideEffects": false,
+  "svelte": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "svelte": "./dist/index.js",
+      "default": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "dependencies": {
+    "@embedpdf/snippet": "1.0.0"
+  },
+  "devDependencies": {
+    "@sveltejs/package": "^2.3.0",
+    "rimraf": "^5.0.5",
+    "svelte": "^5.0.0",
+    "typescript": "^5.1.6"
+  },
+  "peerDependencies": {
+    "svelte": ">=4.0.0"
+  },
+  "keywords": [
+    "svelte",
+    "pdf",
+    "viewer",
+    "embed",
+    "document"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/embedpdf/embed-pdf-viewer.git",
+    "directory": "viewers/svelte"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "clean": "rimraf dist",
+    "build": "pnpm run clean && svelte-package -i src -o dist"
+  }
+}