docuseal-svelte 0.0.1

package/README.md

@@ -0,0 +1,58 @@
+# Svelte library
+
+Everything you need to build a Svelte library, powered by [`sv`](https://npmjs.com/package/sv).
+
+Read more about creating a library [in the docs](https://svelte.dev/docs/kit/packaging).
+
+## Creating a project
+
+If you're seeing this, you've probably already done this step. Congrats!
+
+```sh
+# create a new project in the current directory
+npx sv create
+
+# create a new project in my-app
+npx sv create my-app
+```
+
+## Developing
+
+Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
+
+```sh
+npm run dev
+
+# or start the server and open the app in a new browser tab
+npm run dev -- --open
+```
+
+Everything inside `src/lib` is part of your library, everything inside `src/routes` can be used as a showcase or preview app.
+
+## Building
+
+To build your library:
+
+```sh
+npm pack
+```
+
+To create a production version of your showcase app:
+
+```sh
+npm run build
+```
+
+You can preview the production build with `npm run preview`.
+
+> To deploy your app, you may need to install an [adapter](https://svelte.dev/docs/kit/adapters) for your target environment.
+
+## Publishing
+
+Go into the `package.json` and give your package the desired name through the `"name"` option. Also consider adding a `"license"` field and point it to a `LICENSE` file which you can create from a template (one popular option is the [MIT license](https://opensource.org/license/mit/)).
+
+To publish your library to [npm](https://www.npmjs.com):
+
+```sh
+npm publish
+```

package/dist/components/DocuSealBuilder.svelte

@@ -0,0 +1,247 @@
+<script lang="ts">
+  import {onMount} from "svelte"
+  import type {
+    DocuSealBuilderField,
+    DocuSealBuilderSubmitter,
+  } from "../types/index.js"
+  import {DocuSealError} from "../utils/docuseal.js"
+
+  let {
+    token,
+    host = "cdn.docuseal.com",
+    withRecipientsButton = true,
+    withSendButton = true,
+    withTitle = true,
+    withDocumentsList = true,
+    withFieldsList = true,
+    withFieldPlaceholder = false,
+    onlyDefinedFields = false,
+    preview = false,
+    previewMode = false,
+    inputMode = false,
+    language = "en",
+    autosave = true,
+    roles = [],
+    fieldTypes = [],
+    drawFieldType = "text",
+    fields = [],
+    submitters = [],
+    requiredFields = [],
+    i18n = {},
+    withSignYourselfButton = true,
+    withUploadButton = true,
+    withSignatureId = undefined,
+    withAddPageButton = false,
+    customButton = {title: "", url: ""},
+    emailMessage = {subject: "", body: ""},
+    backgroundColor = "",
+    saveButtonText = "",
+    sendButtonText = "",
+    className = "",
+    customCss = "",
+    style = undefined,
+    onLoad = undefined,
+    onUpload = undefined,
+    onSend = undefined,
+    onSave = undefined,
+    onChange = undefined,
+  }: {
+    token: string
+    host?: string
+    withRecipientsButton?: boolean
+    withSendButton?: boolean
+    withTitle?: boolean
+    withDocumentsList?: boolean
+    withFieldsList?: boolean
+    withFieldPlaceholder?: boolean
+    onlyDefinedFields?: boolean
+    preview?: boolean
+    previewMode?: boolean
+    inputMode?: boolean
+    language?: string
+    autosave?: boolean
+    roles?: string[]
+    fieldTypes?: string[]
+    drawFieldType?: string
+    fields?: DocuSealBuilderField[]
+    submitters?: DocuSealBuilderSubmitter[]
+    requiredFields?: DocuSealBuilderField[]
+    i18n?: object
+    withSignYourselfButton?: boolean
+    withUploadButton?: boolean
+    withSignatureId?: boolean | undefined
+    withAddPageButton?: boolean
+    customButton?: {title: string; url: string}
+    emailMessage?: {subject: string; body: string}
+    backgroundColor?: string
+    saveButtonText?: string
+    sendButtonText?: string
+    className?: string
+    customCss?: string
+    style?: string | undefined
+    onLoad?: ((detail: any) => void) | undefined
+    onUpload?: ((detail: any) => void) | undefined
+    onSend?: ((detail: any) => void) | undefined
+    onSave?: ((detail: any) => void) | undefined
+    onChange?: ((detail: any) => void) | undefined
+  } = $props()
+
+  let el = $state<HTMLElement | null>(null)
+
+  const booleanToAttr = (value: any): string | undefined => {
+    if (value === true) return "true"
+    if (value === false) return "false"
+    return value
+  }
+
+  const validateHost = (host: string): void => {
+    const testUrl = `https://${host}`
+    try {
+      new URL(testUrl)
+    } catch {
+      throw new DocuSealError(`Invalid host: ${host}`, "INVALID_HOST")
+    }
+  }
+
+  const loadBuilderScript = (host: string): Promise<void> => {
+    return new Promise((resolve, reject) => {
+      const scriptId = "docuseal-builder-script"
+      const scriptSrc = `https://${host}/js/builder.js`
+
+      // Check if script already exists
+      const existingScript = document.getElementById(scriptId)
+      if (existingScript) {
+        resolve()
+        return
+      }
+
+      const script = document.createElement("script")
+      script.id = scriptId
+      script.async = true
+      script.src = scriptSrc
+
+      script.onload = () => resolve()
+      script.onerror = () =>
+        reject(
+          new DocuSealError(
+            `Failed to load DocuSeal builder script from ${scriptSrc}`,
+            "SCRIPT_LOAD_ERROR"
+          )
+        )
+
+      document.head.appendChild(script)
+    })
+  }
+
+  const setupEventListeners = (element: HTMLElement): (() => void) => {
+    const handleLoad = (e: Event) => {
+      if (onLoad && e instanceof CustomEvent) {
+        onLoad(e.detail)
+      }
+    }
+
+    const handleUpload = (e: Event) => {
+      if (onUpload && e instanceof CustomEvent) {
+        onUpload(e.detail)
+      }
+    }
+
+    const handleSend = (e: Event) => {
+      if (onSend && e instanceof CustomEvent) {
+        onSend(e.detail)
+      }
+    }
+
+    const handleSave = (e: Event) => {
+      if (onSave && e instanceof CustomEvent) {
+        onSave(e.detail)
+      }
+    }
+
+    const handleChange = (e: Event) => {
+      if (onChange && e instanceof CustomEvent) {
+        onChange(e.detail)
+      }
+    }
+
+    element.addEventListener("load", handleLoad)
+    element.addEventListener("upload", handleUpload)
+    element.addEventListener("send", handleSend)
+    element.addEventListener("save", handleSave)
+    element.addEventListener("change", handleChange)
+
+    // Return cleanup function
+    return () => {
+      element.removeEventListener("load", handleLoad)
+      element.removeEventListener("upload", handleUpload)
+      element.removeEventListener("send", handleSend)
+      element.removeEventListener("save", handleSave)
+      element.removeEventListener("change", handleChange)
+    }
+  }
+
+  onMount(() => {
+    let cleanup: (() => void) | undefined
+
+    ;(async () => {
+      try {
+        validateHost(host)
+        await loadBuilderScript(host)
+        if (el) {
+          cleanup = setupEventListeners(el)
+        }
+      } catch (error) {
+        console.error("DocuSeal Builder initialization error:", error)
+        if (error instanceof DocuSealError) {
+          throw error
+        }
+        throw new DocuSealError(
+          "Failed to initialize DocuSeal Builder",
+          "INIT_ERROR",
+          error
+        )
+      }
+    })()
+
+    return () => {
+      if (cleanup) cleanup()
+    }
+  })
+</script>
+
+<docuseal-builder
+  bind:this={el}
+  data-token={token}
+  data-preview={booleanToAttr(preview || previewMode)}
+  data-input-mode={inputMode}
+  data-language={language}
+  data-autosave={booleanToAttr(autosave)}
+  data-send-button-text={sendButtonText}
+  data-save-button-text={saveButtonText}
+  data-roles={roles.join(",")}
+  data-field-types={fieldTypes.join(",")}
+  data-draw-field-type={drawFieldType}
+  data-fields={JSON.stringify(fields)}
+  data-submitters={JSON.stringify(submitters)}
+  data-required-fields={JSON.stringify(requiredFields)}
+  data-i18n={JSON.stringify(i18n)}
+  data-custom-button-title={customButton.title}
+  data-custom-button-url={customButton.url}
+  data-email-subject={emailMessage.subject}
+  data-email-body={emailMessage.body}
+  data-with-recipients-button={booleanToAttr(withRecipientsButton)}
+  data-with-send-button={booleanToAttr(withSendButton)}
+  data-with-documents-list={booleanToAttr(withDocumentsList)}
+  data-with-fields-list={booleanToAttr(withFieldsList)}
+  data-with-field-placeholder={booleanToAttr(withFieldPlaceholder)}
+  data-with-signature-id={booleanToAttr(withSignatureId)}
+  data-with-title={booleanToAttr(withTitle)}
+  data-only-defined-fields={booleanToAttr(onlyDefinedFields)}
+  data-with-upload-button={booleanToAttr(withUploadButton)}
+  data-with-add-page-button={booleanToAttr(withAddPageButton)}
+  data-with-sign-yourself-button={booleanToAttr(withSignYourselfButton)}
+  data-background-color={backgroundColor}
+  data-custom-css={customCss}
+  class={className}
+  {style}
+></docuseal-builder>

package/dist/components/DocuSealBuilder.svelte.d.ts

@@ -0,0 +1,50 @@
+import type { DocuSealBuilderField, DocuSealBuilderSubmitter } from "../types/index.js";
+type $$ComponentProps = {
+    token: string;
+    host?: string;
+    withRecipientsButton?: boolean;
+    withSendButton?: boolean;
+    withTitle?: boolean;
+    withDocumentsList?: boolean;
+    withFieldsList?: boolean;
+    withFieldPlaceholder?: boolean;
+    onlyDefinedFields?: boolean;
+    preview?: boolean;
+    previewMode?: boolean;
+    inputMode?: boolean;
+    language?: string;
+    autosave?: boolean;
+    roles?: string[];
+    fieldTypes?: string[];
+    drawFieldType?: string;
+    fields?: DocuSealBuilderField[];
+    submitters?: DocuSealBuilderSubmitter[];
+    requiredFields?: DocuSealBuilderField[];
+    i18n?: object;
+    withSignYourselfButton?: boolean;
+    withUploadButton?: boolean;
+    withSignatureId?: boolean | undefined;
+    withAddPageButton?: boolean;
+    customButton?: {
+        title: string;
+        url: string;
+    };
+    emailMessage?: {
+        subject: string;
+        body: string;
+    };
+    backgroundColor?: string;
+    saveButtonText?: string;
+    sendButtonText?: string;
+    className?: string;
+    customCss?: string;
+    style?: string | undefined;
+    onLoad?: ((detail: any) => void) | undefined;
+    onUpload?: ((detail: any) => void) | undefined;
+    onSend?: ((detail: any) => void) | undefined;
+    onSave?: ((detail: any) => void) | undefined;
+    onChange?: ((detail: any) => void) | undefined;
+};
+declare const DocuSealBuilder: import("svelte").Component<$$ComponentProps, {}, "">;
+type DocuSealBuilder = ReturnType<typeof DocuSealBuilder>;
+export default DocuSealBuilder;

package/dist/components/DocuSealForm.svelte

@@ -0,0 +1,148 @@
+<script lang="ts">
+  import {onMount} from "svelte"
+  import type {DocuSealFormField} from "../types/index.js"
+
+  export let src: string = ""
+  export let token: string = ""
+  export let host: string = "cdn.docuseal.com"
+  export let role: string = ""
+  export let submitter: string = ""
+  export let preview: boolean = false
+  export let dryRun: boolean = false
+  export let expand: boolean = true
+  export let minimize: boolean = false
+  export let orderAsOnPage: boolean = false
+  export let email: string = ""
+  export let name: string = ""
+  export let backgroundColor: string = ""
+  export let sendCopyEmail: boolean | undefined = undefined
+  export let applicationKey: string = ""
+  export let externalId: string = ""
+  export let logo: string = ""
+  export let language: string = ""
+  export let completedRedirectUrl: string = ""
+  export let completedButton: {title: string; url: string} = {
+    title: "",
+    url: "",
+  }
+  export let completedMessage: {title?: string; body?: string} = {
+    title: "",
+    body: "",
+  }
+  export let goToLast: boolean = true
+  export let skipFields: boolean = false
+  export let autoscrollFields: boolean = true
+  export let withTitle: boolean = true
+  export let withDecline: boolean = false
+  export let withFieldNames: boolean = true
+  export let withFieldPlaceholder: boolean = false
+  export let withDownloadButton: boolean = true
+  export let allowToResubmit: boolean = true
+  export let allowTypedSignature: boolean = true
+  export let signature: string = ""
+  export let rememberSignature: boolean = false
+  export let reuseSignature: boolean = true
+  export let withSendCopyButton: boolean = true
+  export let withCompleteButton: boolean = false
+  export let values: object = {}
+  export let metadata: object = {}
+  export let i18n: object = {}
+  export let fields: DocuSealFormField[] = []
+  export let readonlyFields: string[] = []
+  export let customCss: string = ""
+  export let className: string = ""
+  export let style: string | undefined = undefined
+
+  export let onComplete: ((detail: any) => void) | undefined = undefined
+  export let onInit: ((detail: any) => void) | undefined = undefined
+  export let onDecline: ((detail: any) => void) | undefined = undefined
+  export let onLoad: ((detail: any) => void) | undefined = undefined
+
+  let el: HTMLElement | null = null
+
+  const booleanToAttr = (value: any) =>
+    value === true ? "true" : value === false ? "false" : value
+
+  onMount(() => {
+    const scriptId = "docuseal-form-script"
+    const scriptSrc = `https://${host}/js/form.js`
+
+    if (!document.getElementById(scriptId)) {
+      const script = document.createElement("script")
+      script.id = scriptId
+      script.async = true
+      script.src = scriptSrc
+      document.head.appendChild(script)
+    }
+
+    const handleCompleted = (e: Event) =>
+      onComplete && onComplete((e as CustomEvent).detail)
+    const handleInit = (e: Event) => onInit && onInit((e as CustomEvent).detail)
+    const handleDecline = (e: Event) =>
+      onDecline && onDecline((e as CustomEvent).detail)
+    const handleLoad = (e: Event) => onLoad && onLoad((e as CustomEvent).detail)
+
+    if (el) {
+      el.addEventListener("completed", handleCompleted)
+      el.addEventListener("init", handleInit)
+      el.addEventListener("declined", handleDecline)
+      el.addEventListener("load", handleLoad)
+    }
+
+    return () => {
+      if (el) {
+        el.removeEventListener("completed", handleCompleted)
+        el.removeEventListener("init", handleInit)
+        el.removeEventListener("declined", handleDecline)
+        el.removeEventListener("load", handleLoad)
+      }
+    }
+  })
+</script>
+
+<docuseal-form
+  bind:this={el}
+  data-src={src}
+  data-token={token}
+  data-email={email}
+  data-name={name}
+  data-role={role || submitter}
+  data-external-id={externalId || applicationKey}
+  data-expand={booleanToAttr(expand)}
+  data-minimize={booleanToAttr(minimize)}
+  data-order-as-on-page={orderAsOnPage}
+  data-preview={booleanToAttr(preview)}
+  data-dry-run={booleanToAttr(dryRun)}
+  data-go-to-last={booleanToAttr(goToLast)}
+  data-skip-fields={booleanToAttr(skipFields)}
+  data-autoscroll-fields={booleanToAttr(autoscrollFields)}
+  data-send-copy-email={booleanToAttr(sendCopyEmail)}
+  data-with-title={booleanToAttr(withTitle)}
+  data-with-decline={booleanToAttr(withDecline)}
+  data-logo={logo}
+  data-language={language}
+  data-with-field-names={booleanToAttr(withFieldNames)}
+  data-with-field-placeholder={booleanToAttr(withFieldPlaceholder)}
+  data-with-download-button={booleanToAttr(withDownloadButton)}
+  data-allow-to-resubmit={booleanToAttr(allowToResubmit)}
+  data-allow-typed-signature={booleanToAttr(allowTypedSignature)}
+  data-signature={signature}
+  data-remember-signature={booleanToAttr(rememberSignature)}
+  data-reuse-signature={booleanToAttr(reuseSignature)}
+  data-completed-redirect-url={completedRedirectUrl}
+  data-with-send-copy-button={booleanToAttr(withSendCopyButton)}
+  data-with-complete-button={booleanToAttr(withCompleteButton)}
+  data-values={JSON.stringify(values)}
+  data-metadata={JSON.stringify(metadata)}
+  data-fields={JSON.stringify(fields)}
+  data-i18n={JSON.stringify(i18n)}
+  data-readonly-fields={readonlyFields.join(",")}
+  data-completed-message-title={completedMessage.title}
+  data-completed-message-body={completedMessage.body}
+  data-completed-button-title={completedButton.title}
+  data-completed-button-url={completedButton.url}
+  data-background-color={backgroundColor}
+  data-custom-css={customCss}
+  class={className}
+  {style}
+></docuseal-form>

package/dist/components/DocuSealForm.svelte.d.ts

@@ -0,0 +1,74 @@
+import type { DocuSealFormField } from "../types/index.ts";
+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 DocuSealForm: $$__sveltets_2_IsomorphicComponent<{
+    src?: string;
+    token?: string;
+    host?: string;
+    role?: string;
+    submitter?: string;
+    preview?: boolean;
+    dryRun?: boolean;
+    expand?: boolean;
+    minimize?: boolean;
+    orderAsOnPage?: boolean;
+    email?: string;
+    name?: string;
+    backgroundColor?: string;
+    sendCopyEmail?: boolean | undefined;
+    applicationKey?: string;
+    externalId?: string;
+    logo?: string;
+    language?: string;
+    completedRedirectUrl?: string;
+    completedButton?: {
+        title: string;
+        url: string;
+    };
+    completedMessage?: {
+        title?: string;
+        body?: string;
+    };
+    goToLast?: boolean;
+    skipFields?: boolean;
+    autoscrollFields?: boolean;
+    withTitle?: boolean;
+    withDecline?: boolean;
+    withFieldNames?: boolean;
+    withFieldPlaceholder?: boolean;
+    withDownloadButton?: boolean;
+    allowToResubmit?: boolean;
+    allowTypedSignature?: boolean;
+    signature?: string;
+    rememberSignature?: boolean;
+    reuseSignature?: boolean;
+    withSendCopyButton?: boolean;
+    withCompleteButton?: boolean;
+    values?: object;
+    metadata?: object;
+    i18n?: object;
+    fields?: DocuSealFormField[];
+    readonlyFields?: string[];
+    customCss?: string;
+    className?: string;
+    style?: string | undefined;
+    onComplete?: ((detail: any) => void) | undefined;
+    onInit?: ((detail: any) => void) | undefined;
+    onDecline?: ((detail: any) => void) | undefined;
+    onLoad?: ((detail: any) => void) | undefined;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type DocuSealForm = InstanceType<typeof DocuSealForm>;
+export default DocuSealForm;

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export { default as DocuSealForm } from './components/DocuSealForm.svelte';
+export { default as DocuSealBuilder } from './components/DocuSealBuilder.svelte';
+export type { DocuSealFormProps, DocuSealFormField, DocuSealBuilderField, DocuSealBuilderSubmitter, } from './types/index.js';
+export { isValidDocuSealUrl, buildFormUrl, DocuSealEventType, DocuSealError } from './utils/docuseal.js';

package/dist/index.js

@@ -0,0 +1,6 @@
+// Reexport your entry components here
+// Re-export components
+export { default as DocuSealForm } from './components/DocuSealForm.svelte';
+export { default as DocuSealBuilder } from './components/DocuSealBuilder.svelte';
+// Re-export utilities (optional - if you want users to access them)
+export { isValidDocuSealUrl, buildFormUrl, DocuSealEventType, DocuSealError } from './utils/docuseal.js';

package/dist/types/index.d.ts

@@ -0,0 +1,111 @@
+interface CompletedMessage {
+    title?: string;
+    body?: string;
+}
+interface CompletedButton {
+    title: string;
+    url: string;
+}
+interface ValidationBase {
+    pattern?: string;
+    message?: string;
+}
+interface PreferencesBase {
+    font_size?: number;
+    font_type?: "bold" | "italic" | "bold_italic";
+    mask?: boolean | number;
+    font?: "Times" | "Helvetica" | "Courier";
+    color?: "black" | "white" | "blue";
+    align?: "left" | "center" | "right";
+    valign?: "top" | "center" | "bottom";
+    format?: string;
+    price?: number;
+    currency?: "USD" | "EUR" | "GBP" | "CAD" | "AUD";
+}
+export interface DocuSealFormField {
+    name: string;
+    title?: string;
+    description?: string;
+    type?: string;
+    position?: number;
+    required?: boolean;
+    readonly?: boolean;
+    validation?: ValidationBase;
+    preferences?: PreferencesBase;
+}
+export interface DocuSealFormProps {
+    src?: string;
+    token?: string;
+    host?: string;
+    role?: string;
+    submitter?: string;
+    expand?: boolean;
+    minimize?: boolean;
+    orderAsOnPage?: boolean;
+    preview?: boolean;
+    dryRun?: boolean;
+    email?: string;
+    name?: string;
+    applicationKey?: string;
+    externalId?: string;
+    backgroundColor?: string;
+    logo?: string;
+    language?: string;
+    completedMessage?: CompletedMessage;
+    completedRedirectUrl?: string;
+    completedButton?: CompletedButton;
+    goToLast?: boolean;
+    skipFields?: boolean;
+    autoscrollFields?: boolean;
+    withTitle?: boolean;
+    withDecline?: boolean;
+    withFieldNames?: boolean;
+    withFieldPlaceholder?: boolean;
+    sendCopyEmail?: boolean;
+    withDownloadButton?: boolean;
+    withSendCopyButton?: boolean;
+    withCompleteButton?: boolean;
+    allowToResubmit?: boolean;
+    allowTypedSignature?: boolean;
+    signature?: string;
+    rememberSignature?: boolean;
+    reuseSignature?: boolean;
+    values?: object;
+    metadata?: object;
+    i18n?: object;
+    fields?: DocuSealFormField[];
+    readonlyFields?: string[];
+    customCss?: string;
+    className?: string;
+    style?: string | undefined;
+}
+interface BuilderValidation extends ValidationBase {
+    min?: number | string;
+    max?: number | string;
+    step?: number;
+}
+interface BuilderPreferences extends PreferencesBase {
+    with_signature_id?: boolean;
+}
+export interface DocuSealBuilderField {
+    name: string;
+    type?: string;
+    role?: string;
+    title?: string;
+    description?: string;
+    required?: boolean;
+    readonly?: boolean;
+    default_value?: string;
+    width?: number;
+    height?: number;
+    options?: string[];
+    preferences?: BuilderPreferences;
+    validation?: BuilderValidation;
+}
+export interface DocuSealBuilderSubmitter {
+    email?: string;
+    role?: string;
+    name?: string;
+    phone?: string;
+}
+export {};

package/dist/types/index.js

@@ -0,0 +1 @@
+export {};

package/dist/utils/docuseal.d.ts

@@ -0,0 +1,69 @@
+/**
+ * Validates if a URL is a valid DocuSeal URL
+ */
+export declare function isValidDocuSealUrl(url: string): boolean;
+/**
+ * Builds a DocuSeal form URL with query parameters
+ */
+export declare function buildFormUrl(baseUrl: string, params?: {
+    email?: string;
+    name?: string;
+    phone?: string;
+    [key: string]: string | undefined;
+}): string;
+/**
+ * Message types from DocuSeal iframe
+ */
+export declare enum DocuSealEventType {
+    COMPLETED = "completed",
+    DECLINED = "declined",
+    ERROR = "error",
+    LOADED = "loaded",
+    RESIZE = "resize"
+}
+/**
+ * Type guard for DocuSeal messages
+ */
+export declare function isDocuSealMessage(event: MessageEvent): boolean;
+/**
+ * Parse DocuSeal postMessage events
+ */
+export declare function parseDocuSealEvent(event: MessageEvent): {
+    type: DocuSealEventType;
+    data?: any;
+} | null;
+/**
+ * Create an iframe element with DocuSeal configuration
+ */
+export declare function createDocuSealIframe(src: string, options?: {
+    title?: string;
+    className?: string;
+    allowFullscreen?: boolean;
+}): HTMLIFrameElement;
+/**
+ * Send a message to DocuSeal iframe
+ */
+export declare function sendToDocuSeal(iframe: HTMLIFrameElement | null, message: {
+    type: string;
+    data?: any;
+}): void;
+/**
+ * Calculates optimal iframe height based on content
+ */
+export declare function calculateIframeHeight(contentHeight?: number, minHeight?: number, maxHeight?: number): number;
+/**
+ * Error types that can occur with DocuSeal
+ */
+export declare class DocuSealError extends Error {
+    code?: string | undefined;
+    details?: any | undefined;
+    constructor(message: string, code?: string | undefined, details?: any | undefined);
+}
+/**
+ * Retry logic for failed operations
+ */
+export declare function retryOperation<T>(operation: () => Promise<T>, maxRetries?: number, delayMs?: number): Promise<T>;
+/**
+ * Prefetch DocuSeal resources for faster loading
+ */
+export declare function prefetchDocuSeal(url: string): void;

package/dist/utils/docuseal.js

@@ -0,0 +1,131 @@
+// src/lib/utils/docuseal.ts
+/**
+ * Validates if a URL is a valid DocuSeal URL
+ */
+export function isValidDocuSealUrl(url) {
+    try {
+        const parsed = new URL(url);
+        return parsed.hostname.includes('docuseal.co') ||
+            parsed.hostname.includes('docuseal.com');
+    }
+    catch {
+        return false;
+    }
+}
+/**
+ * Builds a DocuSeal form URL with query parameters
+ */
+export function buildFormUrl(baseUrl, params) {
+    const url = new URL(baseUrl);
+    if (params) {
+        Object.entries(params).forEach(([key, value]) => {
+            if (value !== undefined) {
+                url.searchParams.set(key, value);
+            }
+        });
+    }
+    return url.toString();
+}
+/**
+ * Message types from DocuSeal iframe
+ */
+export var DocuSealEventType;
+(function (DocuSealEventType) {
+    DocuSealEventType["COMPLETED"] = "completed";
+    DocuSealEventType["DECLINED"] = "declined";
+    DocuSealEventType["ERROR"] = "error";
+    DocuSealEventType["LOADED"] = "loaded";
+    DocuSealEventType["RESIZE"] = "resize";
+})(DocuSealEventType || (DocuSealEventType = {}));
+/**
+ * Type guard for DocuSeal messages
+ */
+export function isDocuSealMessage(event) {
+    return event.data?.source === 'docuseal' ||
+        event.data?.type?.startsWith('docuseal.');
+}
+/**
+ * Parse DocuSeal postMessage events
+ */
+export function parseDocuSealEvent(event) {
+    if (!isDocuSealMessage(event)) {
+        return null;
+    }
+    const { type, data } = event.data;
+    return { type, data };
+}
+/**
+ * Create an iframe element with DocuSeal configuration
+ */
+export function createDocuSealIframe(src, options) {
+    const iframe = document.createElement('iframe');
+    iframe.src = src;
+    iframe.title = options?.title || 'DocuSeal Form';
+    iframe.className = options?.className || '';
+    iframe.setAttribute('frameborder', '0');
+    iframe.setAttribute('allow', 'camera; microphone; clipboard-write');
+    if (options?.allowFullscreen) {
+        iframe.setAttribute('allowfullscreen', 'true');
+    }
+    iframe.style.width = '100%';
+    iframe.style.height = '100%';
+    return iframe;
+}
+/**
+ * Send a message to DocuSeal iframe
+ */
+export function sendToDocuSeal(iframe, message) {
+    if (!iframe?.contentWindow) {
+        console.warn('DocuSeal iframe not ready');
+        return;
+    }
+    iframe.contentWindow.postMessage({ source: 'parent', ...message }, '*');
+}
+/**
+ * Calculates optimal iframe height based on content
+ */
+export function calculateIframeHeight(contentHeight, minHeight = 400, maxHeight = 1200) {
+    if (!contentHeight)
+        return minHeight;
+    return Math.min(Math.max(contentHeight, minHeight), maxHeight);
+}
+/**
+ * Error types that can occur with DocuSeal
+ */
+export class DocuSealError extends Error {
+    code;
+    details;
+    constructor(message, code, details) {
+        super(message);
+        this.code = code;
+        this.details = details;
+        this.name = 'DocuSealError';
+    }
+}
+/**
+ * Retry logic for failed operations
+ */
+export async function retryOperation(operation, maxRetries = 3, delayMs = 1000) {
+    let lastError = new Error();
+    for (let i = 0; i < maxRetries; i++) {
+        try {
+            return await operation();
+        }
+        catch (error) {
+            lastError = error;
+            if (i < maxRetries - 1) {
+                await new Promise(resolve => setTimeout(resolve, delayMs * (i + 1)));
+            }
+        }
+    }
+    throw new DocuSealError(`Operation failed after ${maxRetries} retries`, 'RETRY_EXCEEDED', lastError);
+}
+/**
+ * Prefetch DocuSeal resources for faster loading
+ */
+export function prefetchDocuSeal(url) {
+    const link = document.createElement('link');
+    link.rel = 'prefetch';
+    link.href = url;
+    document.head.appendChild(link);
+}

package/package.json

@@ -0,0 +1,56 @@
+{
+	"name": "docuseal-svelte",
+	"version": "0.0.1",
+	"scripts": {
+		"dev": "vite dev",
+		"build": "vite build && npm run prepack",
+		"preview": "vite preview",
+		"prepare": "svelte-kit sync || echo ''",
+		"prepack": "svelte-kit sync && svelte-package && publint",
+		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+		"release": "npm run build && changeset publish"
+	},
+	"files": [
+		"dist",
+		"!dist/**/*.test.*",
+		"!dist/**/*.spec.*"
+	],
+	"sideEffects": [
+		"**/*.css"
+	],
+	"svelte": "./dist/index.js",
+	"types": "./dist/index.d.ts",
+	"type": "module",
+	"exports": {
+		".": {
+			"types": "./dist/index.d.ts",
+			"svelte": "./dist/index.js"
+		}
+	},
+	"peerDependencies": {
+		"svelte": "^5.0.0"
+	},
+	"devDependencies": {
+		"@changesets/cli": "^2.29.8",
+		"@sveltejs/adapter-auto": "^7.0.0",
+		"@sveltejs/kit": "^2.49.1",
+		"@sveltejs/package": "^2.5.7",
+		"@sveltejs/vite-plugin-svelte": "^6.2.1",
+		"publint": "^0.3.15",
+		"svelte": "^5.45.6",
+		"svelte-check": "^4.3.4",
+		"typescript": "^5.9.3",
+		"vite": "^7.2.6"
+	},
+	"keywords": [
+		"svelte",
+		"docuseal",
+		"document",
+		"signature",
+		"signing",
+		"pdf",
+		"component",
+		"library"
+	]
+}