@documenso/embed-svelte 0.5.0 → 0.6.0

package/dist/create-envelope.svelte

@@ -0,0 +1,82 @@
+<script context="module" lang="ts">
+  export type EmbedCreateEnvelopeProps = {
+    className?: string;
+    host?: string;
+    presignToken: string;
+    externalId?: string;
+    type: "DOCUMENT" | "TEMPLATE";
+    css?: string | undefined;
+    cssVars?: (CssVars & Record<string, string>) | undefined;
+    darkModeDisabled?: boolean | undefined; // biome-ignore lint/suspicious/noExplicitAny: Hehe
+
+    features?: DeepPartial<EnvelopeEditorSettings> & Record<string, any>;
+    onEnvelopeCreated?: (data: {
+      externalId: string | null;
+      envelopeId: number;
+    }) => void;
+  };
+</script>
+
+<script lang="ts">
+  import { onDestroy, onMount } from "svelte";
+
+  import { CssVars } from "./css-vars";
+  import type { DeepPartial, EnvelopeEditorSettings } from "./features-type";
+
+  export let host: EmbedCreateEnvelopeProps["host"] = undefined;
+  export let externalId: EmbedCreateEnvelopeProps["externalId"] = undefined;
+  export let type: EmbedCreateEnvelopeProps["type"];
+  export let features: EmbedCreateEnvelopeProps["features"] = undefined;
+  export let css: EmbedCreateEnvelopeProps["css"] = undefined;
+  export let cssVars: EmbedCreateEnvelopeProps["cssVars"] = undefined;
+  export let darkModeDisabled: EmbedCreateEnvelopeProps["darkModeDisabled"] =
+    undefined;
+  export let presignToken: EmbedCreateEnvelopeProps["presignToken"];
+  export let onEnvelopeCreated: EmbedCreateEnvelopeProps["onEnvelopeCreated"] =
+    undefined;
+  export let className: EmbedCreateEnvelopeProps["className"] = undefined;
+
+  function handleMessage(event: MessageEvent) {
+    if (__iframe?.contentWindow === event.source) {
+      switch (event.data.type) {
+        case "envelope-created":
+          onEnvelopeCreated?.({
+            envelopeId: event.data.envelopeId,
+            externalId: event.data.externalId,
+          });
+          break;
+      }
+    }
+  }
+  $: src = () => {
+    const appHost = host || "https://app.documenso.com";
+    const encodedOptions = btoa(
+      encodeURIComponent(
+        JSON.stringify({
+          externalId: externalId,
+          type: type,
+          features: features,
+          css: css,
+          cssVars: cssVars,
+          darkModeDisabled: darkModeDisabled,
+        })
+      )
+    );
+    const srcUrl = new URL(`/embed/v2/authoring/envelope/create`, appHost);
+    srcUrl.searchParams.set("token", presignToken);
+    srcUrl.hash = encodedOptions;
+    return srcUrl.toString();
+  };
+
+  let __iframe;
+
+  onMount(() => {
+    window.addEventListener("message", handleMessage);
+  });
+
+  onDestroy(() => {
+    window.removeEventListener("message", handleMessage);
+  });
+</script>
+
+<iframe bind:this={__iframe} class={className} src={src()} />

package/dist/create-envelope.svelte.d.ts

@@ -0,0 +1,44 @@
+import { SvelteComponent } from "svelte";
+export type EmbedCreateEnvelopeProps = {
+    className?: string;
+    host?: string;
+    presignToken: string;
+    externalId?: string;
+    type: "DOCUMENT" | "TEMPLATE";
+    css?: string | undefined;
+    cssVars?: (CssVars & Record<string, string>) | undefined;
+    darkModeDisabled?: boolean | undefined;
+    features?: DeepPartial<EnvelopeEditorSettings> & Record<string, any>;
+    onEnvelopeCreated?: (data: {
+        externalId: string | null;
+        envelopeId: number;
+    }) => void;
+};
+import { CssVars } from "./css-vars";
+import type { DeepPartial, EnvelopeEditorSettings } from "./features-type";
+declare const __propDef: {
+    props: {
+        host?: EmbedCreateEnvelopeProps["host"];
+        externalId?: EmbedCreateEnvelopeProps["externalId"];
+        type: EmbedCreateEnvelopeProps["type"];
+        features?: EmbedCreateEnvelopeProps["features"];
+        css?: EmbedCreateEnvelopeProps["css"];
+        cssVars?: EmbedCreateEnvelopeProps["cssVars"];
+        darkModeDisabled?: EmbedCreateEnvelopeProps["darkModeDisabled"];
+        presignToken: EmbedCreateEnvelopeProps["presignToken"];
+        onEnvelopeCreated?: EmbedCreateEnvelopeProps["onEnvelopeCreated"];
+        className?: EmbedCreateEnvelopeProps["className"];
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+    exports?: {};
+    bindings?: string;
+};
+export type CreateEnvelopeProps = typeof __propDef.props;
+export type CreateEnvelopeEvents = typeof __propDef.events;
+export type CreateEnvelopeSlots = typeof __propDef.slots;
+export default class CreateEnvelope extends SvelteComponent<CreateEnvelopeProps, CreateEnvelopeEvents, CreateEnvelopeSlots> {
+}
+export {};

package/dist/features-type.d.ts

@@ -0,0 +1,47 @@
+export type DeepPartial<T> = T extends object ? {
+    [K in keyof T]?: DeepPartial<T[K]>;
+} : T;
+/**
+ * Envelope editor settings (features) for create/edit envelope embeds.
+ * Matches ZEnvelopeEditorSettingsSchema from the app.
+ */
+export type EnvelopeEditorSettings = {
+    general: {
+        allowConfigureEnvelopeTitle: boolean;
+        allowUploadAndRecipientStep: boolean;
+        allowAddFieldsStep: boolean;
+        allowPreviewStep: boolean;
+        minimizeLeftSidebar: boolean;
+    };
+    /** If null, envelope settings will not be available to be seen/updated. */
+    settings: {
+        allowConfigureSignatureTypes: boolean;
+        allowConfigureLanguage: boolean;
+        allowConfigureDateFormat: boolean;
+        allowConfigureTimezone: boolean;
+        allowConfigureRedirectUrl: boolean;
+        allowConfigureDistribution: boolean;
+        allowConfigureExpirationPeriod: boolean;
+        allowConfigureEmailSender: boolean;
+        allowConfigureEmailReplyTo: boolean;
+    } | null;
+    actions: {
+        allowAttachments: boolean;
+    };
+    /** If null, no adjustments to envelope items will be allowed. */
+    envelopeItems: {
+        allowConfigureTitle: boolean;
+        allowConfigureOrder: boolean;
+        allowUpload: boolean;
+        allowDelete: boolean;
+    } | null;
+    /** If null, recipients will not be configurable at all. */
+    recipients: {
+        allowConfigureSigningOrder: boolean;
+        allowConfigureDictateNextSigner: boolean;
+        allowApproverRole: boolean;
+        allowViewerRole: boolean;
+        allowCCerRole: boolean;
+        allowAssistantRole: boolean;
+    } | null;
+};

package/dist/features-type.js

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

package/dist/index.d.ts

@@ -4,8 +4,13 @@ export { default as EmbedCreateDocumentV1 } from './create-document.svelte';
 export { default as EmbedCreateTemplateV1 } from './create-template.svelte';
 export { default as EmbedUpdateDocumentV1 } from './update-document.svelte';
 export { default as EmbedUpdateTemplateV1 } from './update-template.svelte';
+export { default as EmbedCreateEnvelopeV2 } from './create-envelope.svelte';
+export { default as EmbedUpdateEnvelopeV2 } from './update-envelope.svelte';
+export type { EnvelopeEditorSettings } from './features-type';
 export { default as unstable_EmbedCreateDocument } from './create-document.svelte';
 export { default as unstable_EmbedCreateTemplate } from './create-template.svelte';
 export { default as unstable_EmbedUpdateDocument } from './update-document.svelte';
 export { default as unstable_EmbedUpdateTemplate } from './update-template.svelte';
+export { default as unstable_EmbedCreateEnvelope } from './create-envelope.svelte';
+export { default as unstable_EmbedUpdateEnvelope } from './update-envelope.svelte';
 export { default as unstable_EmbedMultiSignDocument } from './multisign-document.svelte';

package/dist/index.js

@@ -4,8 +4,12 @@ export { default as EmbedCreateDocumentV1 } from './create-document.svelte';
 export { default as EmbedCreateTemplateV1 } from './create-template.svelte';
 export { default as EmbedUpdateDocumentV1 } from './update-document.svelte';
 export { default as EmbedUpdateTemplateV1 } from './update-template.svelte';
+export { default as EmbedCreateEnvelopeV2 } from './create-envelope.svelte';
+export { default as EmbedUpdateEnvelopeV2 } from './update-envelope.svelte';
 export { default as unstable_EmbedCreateDocument } from './create-document.svelte';
 export { default as unstable_EmbedCreateTemplate } from './create-template.svelte';
 export { default as unstable_EmbedUpdateDocument } from './update-document.svelte';
 export { default as unstable_EmbedUpdateTemplate } from './update-template.svelte';
+export { default as unstable_EmbedCreateEnvelope } from './create-envelope.svelte';
+export { default as unstable_EmbedUpdateEnvelope } from './update-envelope.svelte';
 export { default as unstable_EmbedMultiSignDocument } from './multisign-document.svelte';

package/dist/sign-document.svelte

@@ -9,6 +9,8 @@
     darkModeDisabled?: boolean | undefined;
     name?: string | undefined;
     lockName?: boolean | undefined;
+    email?: string | undefined;
+    lockEmail?: boolean | undefined;
     allowDocumentRejection?: boolean | undefined; // Additional props to be passed to the iframe, used for testing out features
     // prior to being added to the main props
 
@@ -37,6 +39,8 @@
   export let host: EmbedSignDocumentProps["host"] = undefined;
   export let name: EmbedSignDocumentProps["name"] = undefined;
   export let lockName: EmbedSignDocumentProps["lockName"] = undefined;
+  export let email: EmbedSignDocumentProps["email"] = undefined;
+  export let lockEmail: EmbedSignDocumentProps["lockEmail"] = undefined;
   export let css: EmbedSignDocumentProps["css"] = undefined;
   export let cssVars: EmbedSignDocumentProps["cssVars"] = undefined;
   export let darkModeDisabled: EmbedSignDocumentProps["darkModeDisabled"] =
@@ -84,6 +88,8 @@
         JSON.stringify({
           name: name,
           lockName: lockName,
+          email: email,
+          lockEmail: lockEmail,
           css: css,
           cssVars: cssVars,
           darkModeDisabled: darkModeDisabled,

package/dist/sign-document.svelte.d.ts

@@ -8,6 +8,8 @@ export type EmbedSignDocumentProps = {
     darkModeDisabled?: boolean | undefined;
     name?: string | undefined;
     lockName?: boolean | undefined;
+    email?: string | undefined;
+    lockEmail?: boolean | undefined;
     allowDocumentRejection?: boolean | undefined;
     additionalProps?: Record<string, string | number | boolean> | undefined;
     onDocumentReady?: () => void;
@@ -30,6 +32,8 @@ declare const __propDef: {
         host?: EmbedSignDocumentProps["host"];
         name?: EmbedSignDocumentProps["name"];
         lockName?: EmbedSignDocumentProps["lockName"];
+        email?: EmbedSignDocumentProps["email"];
+        lockEmail?: EmbedSignDocumentProps["lockEmail"];
         css?: EmbedSignDocumentProps["css"];
         cssVars?: EmbedSignDocumentProps["cssVars"];
         darkModeDisabled?: EmbedSignDocumentProps["darkModeDisabled"];

package/dist/update-envelope.svelte

@@ -0,0 +1,84 @@
+<script context="module" lang="ts">
+  export type EmbedUpdateEnvelopeProps = {
+    className?: string;
+    host?: string;
+    presignToken: string;
+    externalId?: string;
+    envelopeId: string;
+    css?: string | undefined;
+    cssVars?: (CssVars & Record<string, string>) | undefined;
+    darkModeDisabled?: boolean | undefined; // biome-ignore lint/suspicious/noExplicitAny: Hehe
+
+    features?: DeepPartial<EnvelopeEditorSettings> & Record<string, any>;
+    onEnvelopeUpdated?: (data: {
+      externalId: string | null;
+      envelopeId: string;
+    }) => void;
+  };
+</script>
+
+<script lang="ts">
+  import { onDestroy, onMount } from "svelte";
+
+  import { CssVars } from "./css-vars";
+  import type { DeepPartial, EnvelopeEditorSettings } from "./features-type";
+
+  export let host: EmbedUpdateEnvelopeProps["host"] = undefined;
+  export let externalId: EmbedUpdateEnvelopeProps["externalId"] = undefined;
+  export let features: EmbedUpdateEnvelopeProps["features"] = undefined;
+  export let css: EmbedUpdateEnvelopeProps["css"] = undefined;
+  export let cssVars: EmbedUpdateEnvelopeProps["cssVars"] = undefined;
+  export let darkModeDisabled: EmbedUpdateEnvelopeProps["darkModeDisabled"] =
+    undefined;
+  export let envelopeId: EmbedUpdateEnvelopeProps["envelopeId"];
+  export let presignToken: EmbedUpdateEnvelopeProps["presignToken"];
+  export let onEnvelopeUpdated: EmbedUpdateEnvelopeProps["onEnvelopeUpdated"] =
+    undefined;
+  export let className: EmbedUpdateEnvelopeProps["className"] = undefined;
+
+  function handleMessage(event: MessageEvent) {
+    if (__iframe?.contentWindow === event.source) {
+      switch (event.data.type) {
+        case "envelope-updated":
+          onEnvelopeUpdated?.({
+            envelopeId: event.data.envelopeId,
+            externalId: event.data.externalId,
+          });
+          break;
+      }
+    }
+  }
+  $: src = () => {
+    const appHost = host || "https://app.documenso.com";
+    const encodedOptions = btoa(
+      encodeURIComponent(
+        JSON.stringify({
+          externalId: externalId,
+          features: features,
+          css: css,
+          cssVars: cssVars,
+          darkModeDisabled: darkModeDisabled,
+        })
+      )
+    );
+    const srcUrl = new URL(
+      `/embed/v2/authoring/envelope/edit/${envelopeId}`,
+      appHost
+    );
+    srcUrl.searchParams.set("token", presignToken);
+    srcUrl.hash = encodedOptions;
+    return srcUrl.toString();
+  };
+
+  let __iframe;
+
+  onMount(() => {
+    window.addEventListener("message", handleMessage);
+  });
+
+  onDestroy(() => {
+    window.removeEventListener("message", handleMessage);
+  });
+</script>
+
+<iframe bind:this={__iframe} class={className} src={src()} />

package/dist/update-envelope.svelte.d.ts

@@ -0,0 +1,44 @@
+import { SvelteComponent } from "svelte";
+export type EmbedUpdateEnvelopeProps = {
+    className?: string;
+    host?: string;
+    presignToken: string;
+    externalId?: string;
+    envelopeId: string;
+    css?: string | undefined;
+    cssVars?: (CssVars & Record<string, string>) | undefined;
+    darkModeDisabled?: boolean | undefined;
+    features?: DeepPartial<EnvelopeEditorSettings> & Record<string, any>;
+    onEnvelopeUpdated?: (data: {
+        externalId: string | null;
+        envelopeId: string;
+    }) => void;
+};
+import { CssVars } from "./css-vars";
+import type { DeepPartial, EnvelopeEditorSettings } from "./features-type";
+declare const __propDef: {
+    props: {
+        host?: EmbedUpdateEnvelopeProps["host"];
+        externalId?: EmbedUpdateEnvelopeProps["externalId"];
+        features?: EmbedUpdateEnvelopeProps["features"];
+        css?: EmbedUpdateEnvelopeProps["css"];
+        cssVars?: EmbedUpdateEnvelopeProps["cssVars"];
+        darkModeDisabled?: EmbedUpdateEnvelopeProps["darkModeDisabled"];
+        envelopeId: EmbedUpdateEnvelopeProps["envelopeId"];
+        presignToken: EmbedUpdateEnvelopeProps["presignToken"];
+        onEnvelopeUpdated?: EmbedUpdateEnvelopeProps["onEnvelopeUpdated"];
+        className?: EmbedUpdateEnvelopeProps["className"];
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+    exports?: {};
+    bindings?: string;
+};
+export type UpdateEnvelopeProps = typeof __propDef.props;
+export type UpdateEnvelopeEvents = typeof __propDef.events;
+export type UpdateEnvelopeSlots = typeof __propDef.slots;
+export default class UpdateEnvelope extends SvelteComponent<UpdateEnvelopeProps, UpdateEnvelopeEvents, UpdateEnvelopeSlots> {
+}
+export {};

package/package.json

@@ -1,7 +1,12 @@
 {
   "name": "@documenso/embed-svelte",
-  "version": "0.5.0",
+  "version": "0.6.0",
   "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/documenso/embeds",
+    "directory": "packages/svelte"
+  },
   "files": [
     "dist"
   ],