diff --git a/packages/angular/src/create-document.ts b/packages/angular/src/create-document.ts index 6bc7f37..66731da 100644 --- a/packages/angular/src/create-document.ts +++ b/packages/angular/src/create-document.ts @@ -7,8 +7,9 @@ export type EmbedCreateDocumentProps = { className?: string; host?: string; presignToken: string; - externalId?: string; // @src: /apps/web/src/app/embed/direct/[[...url]]/schema + externalId?: string; + // @src: /apps/web/src/app/embed/direct/[[...url]]/schema css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; @@ -20,9 +21,10 @@ export type EmbedCreateDocumentProps = { allowConfigureTimezone?: boolean; allowConfigureRedirectUrl?: boolean; allowConfigureCommunication?: boolean; - }; // Additional props to be passed to the iframe, used for testing out features - // prior to being added to the main props + }; + // Additional props to be passed to the iframe, used for testing out features + // prior to being added to the main props additionalProps?: Record | undefined; onDocumentCreated?: (data: { externalId: string; @@ -35,7 +37,12 @@ import { CssVars } from "./css-vars"; @Component({ selector: "embed-create-document", template: ` - + `, styles: [ ` @@ -82,6 +89,10 @@ export default class EmbedCreateDocument { srcUrl.hash = encodedOptions; return srcUrl.toString(); } + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + } handleMessage(event: MessageEvent) { if (this.__iframe?.nativeElement?.contentWindow === event.source) { switch (event.data.type) { diff --git a/packages/angular/src/create-envelope.ts b/packages/angular/src/create-envelope.ts index 627d906..97ed1c0 100644 --- a/packages/angular/src/create-envelope.ts +++ b/packages/angular/src/create-envelope.ts @@ -17,8 +17,9 @@ export type EmbedCreateEnvelopeProps = { css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; - language?: string | undefined; // biome-ignore lint/suspicious/noExplicitAny: Hehe + language?: string | undefined; + // biome-ignore lint/suspicious/noExplicitAny: Hehe features?: DeepPartial & Record; onEnvelopeCreated?: (data: { externalId: string | null; @@ -32,7 +33,12 @@ import type { DeepPartial, EnvelopeEditorSettings } from "./features-type"; @Component({ selector: "embed-create-envelope", template: ` - + `, styles: [ ` @@ -83,6 +89,10 @@ export default class EmbedCreateEnvelope { srcUrl.hash = encodedOptions; return srcUrl.toString(); } + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + } handleMessage(event: MessageEvent) { if (this.__iframe?.nativeElement?.contentWindow === event.source) { switch (event.data.type) { diff --git a/packages/angular/src/create-template.ts b/packages/angular/src/create-template.ts index cb847bd..d0b98bc 100644 --- a/packages/angular/src/create-template.ts +++ b/packages/angular/src/create-template.ts @@ -7,8 +7,9 @@ export type EmbedCreateTemplateProps = { className?: string; host?: string; presignToken: string; - externalId?: string; // @src: /apps/web/src/app/embed/direct/[[...url]]/schema + externalId?: string; + // @src: /apps/web/src/app/embed/direct/[[...url]]/schema css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; @@ -20,9 +21,10 @@ export type EmbedCreateTemplateProps = { allowConfigureTimezone?: boolean; allowConfigureRedirectUrl?: boolean; allowConfigureCommunication?: boolean; - }; // Additional props to be passed to the iframe, used for testing out features - // prior to being added to the main props + }; + // Additional props to be passed to the iframe, used for testing out features + // prior to being added to the main props additionalProps?: Record | undefined; onTemplateCreated?: (data: { externalId: string; @@ -35,7 +37,12 @@ import { CssVars } from "./css-vars"; @Component({ selector: "embed-create-template", template: ` - + `, styles: [ ` @@ -82,6 +89,10 @@ export default class EmbedCreateTemplate { srcUrl.hash = encodedOptions; return srcUrl.toString(); } + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + } handleMessage(event: MessageEvent) { if (this.__iframe?.nativeElement?.contentWindow === event.source) { switch (event.data.type) { diff --git a/packages/angular/src/css-vars.ts b/packages/angular/src/css-vars.ts index 4a7705b..b024227 100644 --- a/packages/angular/src/css-vars.ts +++ b/packages/angular/src/css-vars.ts @@ -2,84 +2,57 @@ export type CssVars = { /** Base background color */ background?: string | null; /** Base text color */ - foreground?: string | null; /** Muted/subtle background color */ - muted?: string | null; /** Muted/subtle text color */ - mutedForeground?: string | null; /** Popover/dropdown background color */ - popover?: string | null; /** Popover/dropdown text color */ - popoverForeground?: string | null; /** Card background color */ - card?: string | null; /** Card border color */ - cardBorder?: string | null; /** Card border tint/highlight color */ - cardBorderTint?: string | null; /** Card text color */ - cardForeground?: string | null; /** Field card background color */ - fieldCard?: string | null; /** Field card border color */ - fieldCardBorder?: string | null; /** Field card text color */ - fieldCardForeground?: string | null; /** Widget background color */ - widget?: string | null; /** Widget text color */ - widgetForeground?: string | null; /** Default border color */ - border?: string | null; /** Input field border color */ - input?: string | null; /** Primary action/button color */ - primary?: string | null; /** Primary action/button text color */ - primaryForeground?: string | null; /** Secondary action/button color */ - secondary?: string | null; /** Secondary action/button text color */ - secondaryForeground?: string | null; /** Accent/highlight color */ - accent?: string | null; /** Accent/highlight text color */ - accentForeground?: string | null; /** Destructive/danger action color */ - destructive?: string | null; /** Destructive/danger text color */ - destructiveForeground?: string | null; /** Focus ring color */ - ring?: string | null; /** Border radius size in REM units */ - radius?: string | null; /** Warning/alert color */ - warning?: string | null; } \ No newline at end of file diff --git a/packages/angular/src/direct-template.ts b/packages/angular/src/direct-template.ts index c2be210..b2fb67c 100644 --- a/packages/angular/src/direct-template.ts +++ b/packages/angular/src/direct-template.ts @@ -7,8 +7,9 @@ export type EmbedDirectTemplateProps = { className?: string; host?: string; token: string; - externalId?: string; // @src: /apps/web/src/app/embed/direct/[[...url]]/schema + externalId?: string; + // @src: /apps/web/src/app/embed/direct/[[...url]]/schema css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; @@ -16,9 +17,10 @@ export type EmbedDirectTemplateProps = { email?: string | undefined; lockEmail?: boolean | undefined; name?: string | undefined; - lockName?: boolean | undefined; // Additional props to be passed to the iframe, used for testing out features - // prior to being added to the main props + lockName?: boolean | undefined; + // Additional props to be passed to the iframe, used for testing out features + // prior to being added to the main props additionalProps?: Record | undefined; onDocumentReady?: () => void; onDocumentCompleted?: (data: { @@ -36,7 +38,12 @@ import { CssVars } from "./css-vars"; @Component({ selector: "embed-direct-template", template: ` - + `, styles: [ ` @@ -89,32 +96,30 @@ export default class EmbedDirectTemplate { ) ); const srcUrl = new URL(`/embed/direct/${this.token}`, appHost); - if (this.externalId) { srcUrl.searchParams.set("externalId", this.externalId); } - return `${srcUrl}#${encodedOptions}`; } + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + } handleMessage(event: MessageEvent) { if (this.__iframe?.nativeElement?.contentWindow === event.source) { switch (event.data.action) { case "document-ready": this.onDocumentReady?.(); break; - case "document-completed": this.onDocumentCompleted?.(event.data.data); break; - case "document-error": this.onDocumentError?.(event.data.data); break; - case "field-signed": this.onFieldSigned?.(); break; - case "field-unsigned": this.onFieldUnsigned?.(); break; diff --git a/packages/angular/src/features-type.ts b/packages/angular/src/features-type.ts index 04ed67e..0aa92b7 100644 --- a/packages/angular/src/features-type.ts +++ b/packages/angular/src/features-type.ts @@ -1,9 +1,9 @@ export type DeepPartial = T extends object ? { [K in keyof T]?: DeepPartial } : T; + /** * Envelope editor settings (features) for create/edit envelope embeds. * Matches ZEnvelopeEditorSettingsSchema from the app. */ - export type EnvelopeEditorSettings = { general: { allowConfigureEnvelopeTitle: boolean; @@ -12,8 +12,8 @@ export type EnvelopeEditorSettings = { allowPreviewStep: boolean; minimizeLeftSidebar: boolean; }; - /** If null, envelope settings will not be available to be seen/updated. */ + /** If null, envelope settings will not be available to be seen/updated. */ settings: { allowConfigureSignatureTypes: boolean; allowConfigureLanguage: boolean; @@ -26,15 +26,15 @@ export type EnvelopeEditorSettings = { allowConfigureEmailReplyTo: boolean; } | null; actions: { - allowAttachments: boolean; // allowDistributing: boolean; // These are not available for embeds. + allowAttachments: boolean; + // allowDistributing: boolean; // These are not available for embeds. // allowDirectLink: boolean; // These are not available for embeds. // allowDuplication: boolean; // These are not available for embeds. // allowDownloadPDF: boolean; // These are not available for embeds. // allowDeletion: boolean; // These are not available for embeds. - }; - /** If null, no adjustments to envelope items will be allowed. */ + /** If null, no adjustments to envelope items will be allowed. */ envelopeItems: { allowConfigureTitle: boolean; allowConfigureOrder: boolean; @@ -42,8 +42,8 @@ export type EnvelopeEditorSettings = { allowDelete: boolean; allowReplace: boolean; } | null; - /** If null, recipients will not be configurable at all. */ + /** If null, recipients will not be configurable at all. */ recipients: { // allowAIDetection: boolean; // These aren't available for embeds. allowConfigureSigningOrder: boolean; @@ -52,8 +52,9 @@ export type EnvelopeEditorSettings = { allowViewerRole: boolean; allowCCerRole: boolean; allowAssistantRole: boolean; - } | null; // fields: { + } | null; + + // fields: { // allowAIDetection: boolean; // These aren't available for embeds. // }; - } \ No newline at end of file diff --git a/packages/angular/src/multisign-document.ts b/packages/angular/src/multisign-document.ts index 90c57a4..23b0a3a 100644 --- a/packages/angular/src/multisign-document.ts +++ b/packages/angular/src/multisign-document.ts @@ -6,16 +6,18 @@ import { CommonModule } from "@angular/common"; export type EmbedMultiSignDocumentProps = { className?: string; host?: string; - tokens: string[]; // @src: /apps/web/src/app/embed/direct/[[...url]]/schema + tokens: string[]; + // @src: /apps/web/src/app/embed/direct/[[...url]]/schema css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; name?: string | undefined; lockName?: 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 + allowDocumentRejection?: boolean | undefined; + // Additional props to be passed to the iframe, used for testing out features + // prior to being added to the main props additionalProps?: Record | undefined; onDocumentReady?: () => void; onDocumentCompleted?: (data: { @@ -46,7 +48,12 @@ import { CssVars } from "./css-vars"; @Component({ selector: "embed-multi-sign-document", template: ` - + `, styles: [ ` @@ -97,32 +104,30 @@ export default class EmbedMultiSignDocument { ) ); const srcUrl = new URL(`/embed/v1/multisign`, appHost); - for (const token of this.tokens) { srcUrl.searchParams.append("token", token); } - return `${srcUrl}#${encodedOptions}`; } + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + } handleMessage(event: MessageEvent) { if (this.__iframe?.nativeElement?.contentWindow === event.source) { switch (event.data.action) { case "document-ready": this.onDocumentReady?.(); break; - case "document-completed": this.onDocumentCompleted?.(event.data.data); break; - case "document-error": this.onDocumentError?.(event.data.data); break; - case "document-rejected": this.onDocumentRejected?.(event.data.data); break; - case "all-documents-completed": this.onAllDocumentsCompleted?.(event.data.data); break; diff --git a/packages/angular/src/sign-document.ts b/packages/angular/src/sign-document.ts index 41f1dc1..c1e8b51 100644 --- a/packages/angular/src/sign-document.ts +++ b/packages/angular/src/sign-document.ts @@ -6,8 +6,9 @@ import { CommonModule } from "@angular/common"; export type EmbedSignDocumentProps = { className?: string; host?: string; - token: string; // @src: /apps/web/src/app/embed/direct/[[...url]]/schema + token: string; + // @src: /apps/web/src/app/embed/direct/[[...url]]/schema css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; @@ -16,9 +17,10 @@ export type EmbedSignDocumentProps = { 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 + allowDocumentRejection?: boolean | undefined; + // Additional props to be passed to the iframe, used for testing out features + // prior to being added to the main props additionalProps?: Record | undefined; onDocumentReady?: () => void; onDocumentCompleted?: (data: { @@ -26,7 +28,7 @@ export type EmbedSignDocumentProps = { documentId: number; recipientId: number; }) => void; - onDocumentError?: (error: string) => void; + onDocumentError?: (error: string | null) => void; onDocumentRejected?: (data: { token: string; documentId: number; @@ -40,7 +42,12 @@ import { CssVars } from "./css-vars"; @Component({ selector: "embed-sign-document", template: ` - + `, styles: [ ` @@ -95,21 +102,22 @@ export default class EmbedSignDocument { const srcUrl = new URL(`/embed/sign/${this.token}`, appHost); return `${srcUrl}#${encodedOptions}`; } + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + } handleMessage(event: MessageEvent) { if (this.__iframe?.nativeElement?.contentWindow === event.source) { switch (event.data.action) { case "document-ready": this.onDocumentReady?.(); break; - case "document-completed": this.onDocumentCompleted?.(event.data.data); break; - case "document-error": this.onDocumentError?.(event.data.data); break; - case "document-rejected": this.onDocumentRejected?.(event.data.data); break; diff --git a/packages/angular/src/update-document.ts b/packages/angular/src/update-document.ts index 4c565a5..6b557d8 100644 --- a/packages/angular/src/update-document.ts +++ b/packages/angular/src/update-document.ts @@ -8,8 +8,9 @@ export type EmbedUpdateDocumentProps = { host?: string; presignToken: string; documentId: number; - externalId?: string; // @src: /apps/web/src/app/embed/direct/[[...url]]/schema + externalId?: string; + // @src: /apps/web/src/app/embed/direct/[[...url]]/schema css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; @@ -22,9 +23,10 @@ export type EmbedUpdateDocumentProps = { allowConfigureRedirectUrl?: boolean; allowConfigureCommunication?: boolean; }; - onlyEditFields?: boolean | undefined; // Additional props to be passed to the iframe, used for testing out features - // prior to being added to the main props + onlyEditFields?: boolean | undefined; + // Additional props to be passed to the iframe, used for testing out features + // prior to being added to the main props additionalProps?: Record | undefined; onDocumentUpdated?: (data: { externalId: string; @@ -37,7 +39,12 @@ import { CssVars } from "./css-vars"; @Component({ selector: "embed-update-document", template: ` - + `, styles: [ ` @@ -91,6 +98,10 @@ export default class EmbedUpdateDocument { srcUrl.hash = encodedOptions; return srcUrl.toString(); } + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + } handleMessage(event: MessageEvent) { if (this.__iframe?.nativeElement?.contentWindow === event.source) { switch (event.data.type) { diff --git a/packages/angular/src/update-envelope.ts b/packages/angular/src/update-envelope.ts index 591e580..fcee05e 100644 --- a/packages/angular/src/update-envelope.ts +++ b/packages/angular/src/update-envelope.ts @@ -16,8 +16,9 @@ export type EmbedUpdateEnvelopeProps = { css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; - language?: string | undefined; // biome-ignore lint/suspicious/noExplicitAny: Hehe + language?: string | undefined; + // biome-ignore lint/suspicious/noExplicitAny: Hehe features?: DeepPartial & Record; onEnvelopeUpdated?: (data: { externalId: string | null; @@ -31,7 +32,12 @@ import type { DeepPartial, EnvelopeEditorSettings } from "./features-type"; @Component({ selector: "embed-update-envelope", template: ` - + `, styles: [ ` @@ -82,6 +88,10 @@ export default class EmbedUpdateEnvelope { srcUrl.hash = encodedOptions; return srcUrl.toString(); } + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + } handleMessage(event: MessageEvent) { if (this.__iframe?.nativeElement?.contentWindow === event.source) { switch (event.data.type) { diff --git a/packages/angular/src/update-template.ts b/packages/angular/src/update-template.ts index 3db567e..fff36a2 100644 --- a/packages/angular/src/update-template.ts +++ b/packages/angular/src/update-template.ts @@ -8,8 +8,9 @@ export type EmbedUpdateTemplateProps = { host?: string; presignToken: string; templateId: number; - externalId?: string; // @src: /apps/web/src/app/embed/direct/[[...url]]/schema + externalId?: string; + // @src: /apps/web/src/app/embed/direct/[[...url]]/schema css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; @@ -22,9 +23,10 @@ export type EmbedUpdateTemplateProps = { allowConfigureRedirectUrl?: boolean; allowConfigureCommunication?: boolean; }; - onlyEditFields?: boolean | undefined; // Additional props to be passed to the iframe, used for testing out features - // prior to being added to the main props + onlyEditFields?: boolean | undefined; + // Additional props to be passed to the iframe, used for testing out features + // prior to being added to the main props additionalProps?: Record | undefined; onTemplateUpdated?: (data: { externalId: string; @@ -37,7 +39,12 @@ import { CssVars } from "./css-vars"; @Component({ selector: "embed-update-template", template: ` - + `, styles: [ ` @@ -90,6 +97,10 @@ export default class EmbedUpdateTemplate { srcUrl.hash = encodedOptions; return srcUrl.toString(); } + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + } handleMessage(event: MessageEvent) { if (this.__iframe?.nativeElement?.contentWindow === event.source) { switch (event.data.type) { diff --git a/packages/mitosis/src/create-document.lite.tsx b/packages/mitosis/src/create-document.lite.tsx index b9818dd..51d2e1b 100644 --- a/packages/mitosis/src/create-document.lite.tsx +++ b/packages/mitosis/src/create-document.lite.tsx @@ -61,6 +61,11 @@ export default function EmbedCreateDocument(props: EmbedCreateDocumentProps) { return srcUrl.toString(); }, + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return 'allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation' as any; + }, + handleMessage(event: MessageEvent) { if (__iframe?.contentWindow === event.source) { switch (event.data.type) { @@ -83,5 +88,7 @@ export default function EmbedCreateDocument(props: EmbedCreateDocumentProps) { window.removeEventListener('message', state.handleMessage); }); - return ; + return ( + + ); } diff --git a/packages/mitosis/src/create-envelope.lite.tsx b/packages/mitosis/src/create-envelope.lite.tsx index 1217b87..72113b5 100644 --- a/packages/mitosis/src/create-envelope.lite.tsx +++ b/packages/mitosis/src/create-envelope.lite.tsx @@ -59,6 +59,11 @@ export default function EmbedCreateEnvelope(props: EmbedCreateEnvelopeProps) { return srcUrl.toString(); }, + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return 'allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation' as any; + }, + handleMessage(event: MessageEvent) { if (__iframe?.contentWindow === event.source) { switch (event.data.type) { @@ -81,5 +86,7 @@ export default function EmbedCreateEnvelope(props: EmbedCreateEnvelopeProps) { window.removeEventListener('message', state.handleMessage); }); - return ; + return ( + + ); } diff --git a/packages/mitosis/src/create-template.lite.tsx b/packages/mitosis/src/create-template.lite.tsx index f084843..02740ef 100644 --- a/packages/mitosis/src/create-template.lite.tsx +++ b/packages/mitosis/src/create-template.lite.tsx @@ -61,6 +61,11 @@ export default function EmbedCreateTemplate(props: EmbedCreateTemplateProps) { return srcUrl.toString(); }, + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return 'allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation' as any; + }, + handleMessage(event: MessageEvent) { if (__iframe?.contentWindow === event.source) { switch (event.data.type) { @@ -83,5 +88,7 @@ export default function EmbedCreateTemplate(props: EmbedCreateTemplateProps) { window.removeEventListener('message', state.handleMessage); }); - return ; + return ( + + ); } diff --git a/packages/mitosis/src/direct-template.lite.tsx b/packages/mitosis/src/direct-template.lite.tsx index 0076735..e6be1d9 100644 --- a/packages/mitosis/src/direct-template.lite.tsx +++ b/packages/mitosis/src/direct-template.lite.tsx @@ -64,6 +64,11 @@ export default function EmbedDirectTemplate(props: EmbedDirectTemplateProps) { return `${srcUrl}#${encodedOptions}`; }, + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return 'allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation' as any; + }, + handleMessage(event: MessageEvent) { if (__iframe?.contentWindow === event.source) { switch (event.data.action) { @@ -99,5 +104,7 @@ export default function EmbedDirectTemplate(props: EmbedDirectTemplateProps) { window.removeEventListener('message', state.handleMessage); }); - return ; + return ( + + ); } diff --git a/packages/mitosis/src/multisign-document.lite.tsx b/packages/mitosis/src/multisign-document.lite.tsx index 68349c0..600ef2b 100644 --- a/packages/mitosis/src/multisign-document.lite.tsx +++ b/packages/mitosis/src/multisign-document.lite.tsx @@ -72,6 +72,11 @@ export default function EmbedMultiSignDocument(props: EmbedMultiSignDocumentProp return `${srcUrl}#${encodedOptions}`; }, + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return 'allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation' as any; + }, + handleMessage(event: MessageEvent) { if (__iframe?.contentWindow === event.source) { switch (event.data.action) { @@ -107,5 +112,7 @@ export default function EmbedMultiSignDocument(props: EmbedMultiSignDocumentProp window.removeEventListener('message', state.handleMessage); }); - return ; + return ( + + ); } diff --git a/packages/mitosis/src/sign-document.lite.tsx b/packages/mitosis/src/sign-document.lite.tsx index e1f0a8d..b1c139b 100644 --- a/packages/mitosis/src/sign-document.lite.tsx +++ b/packages/mitosis/src/sign-document.lite.tsx @@ -26,7 +26,7 @@ export type EmbedSignDocumentProps = { onDocumentReady?: () => void; onDocumentCompleted?: (data: { token: string; documentId: number; recipientId: number }) => void; - onDocumentError?: (error: string) => void; + onDocumentError?: (error: string | null) => void; onDocumentRejected?: (data: { token: string; documentId: number; @@ -65,6 +65,11 @@ export default function EmbedSignDocument(props: EmbedSignDocumentProps) { return `${srcUrl}#${encodedOptions}`; }, + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return 'allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation' as any; + }, + handleMessage(event: MessageEvent) { if (__iframe?.contentWindow === event.source) { switch (event.data.action) { @@ -96,5 +101,7 @@ export default function EmbedSignDocument(props: EmbedSignDocumentProps) { window.removeEventListener('message', state.handleMessage); }); - return ; + return ( + + ); } diff --git a/packages/mitosis/src/update-document.lite.tsx b/packages/mitosis/src/update-document.lite.tsx index a2f6a1a..7280c79 100644 --- a/packages/mitosis/src/update-document.lite.tsx +++ b/packages/mitosis/src/update-document.lite.tsx @@ -67,6 +67,11 @@ export default function EmbedUpdateDocument(props: EmbedUpdateDocumentProps) { return srcUrl.toString(); }, + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return 'allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation' as any; + }, + handleMessage(event: MessageEvent) { if (__iframe?.contentWindow === event.source) { switch (event.data.type) { @@ -89,5 +94,7 @@ export default function EmbedUpdateDocument(props: EmbedUpdateDocumentProps) { window.removeEventListener('message', state.handleMessage); }); - return ; + return ( + + ); } diff --git a/packages/mitosis/src/update-envelope.lite.tsx b/packages/mitosis/src/update-envelope.lite.tsx index 35bbdf0..9106122 100644 --- a/packages/mitosis/src/update-envelope.lite.tsx +++ b/packages/mitosis/src/update-envelope.lite.tsx @@ -56,6 +56,11 @@ export default function EmbedUpdateEnvelope(props: EmbedUpdateEnvelopeProps) { return srcUrl.toString(); }, + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return 'allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation' as any; + }, + handleMessage(event: MessageEvent) { if (__iframe?.contentWindow === event.source) { switch (event.data.type) { @@ -78,5 +83,7 @@ export default function EmbedUpdateEnvelope(props: EmbedUpdateEnvelopeProps) { window.removeEventListener('message', state.handleMessage); }); - return ; + return ( + + ); } diff --git a/packages/mitosis/src/update-template.lite.tsx b/packages/mitosis/src/update-template.lite.tsx index fc6fd25..d16ca4a 100644 --- a/packages/mitosis/src/update-template.lite.tsx +++ b/packages/mitosis/src/update-template.lite.tsx @@ -65,6 +65,11 @@ export default function EmbedUpdateTemplate(props: EmbedUpdateTemplateProps) { return srcUrl.toString(); }, + get sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return 'allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation' as any; + }, + handleMessage(event: MessageEvent) { if (__iframe?.contentWindow === event.source) { switch (event.data.type) { @@ -87,5 +92,7 @@ export default function EmbedUpdateTemplate(props: EmbedUpdateTemplateProps) { window.removeEventListener('message', state.handleMessage); }); - return ; + return ( + + ); } diff --git a/packages/preact/src/create-document.tsx b/packages/preact/src/create-document.tsx index 31002ce..3c2a003 100644 --- a/packages/preact/src/create-document.tsx +++ b/packages/preact/src/create-document.tsx @@ -6,8 +6,9 @@ export type EmbedCreateDocumentProps = { className?: string; host?: string; presignToken: string; - externalId?: string; // @src: /apps/web/src/app/embed/direct/[[...url]]/schema + externalId?: string; + // @src: /apps/web/src/app/embed/direct/[[...url]]/schema css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; @@ -19,9 +20,10 @@ export type EmbedCreateDocumentProps = { allowConfigureTimezone?: boolean; allowConfigureRedirectUrl?: boolean; allowConfigureCommunication?: boolean; - }; // Additional props to be passed to the iframe, used for testing out features - // prior to being added to the main props + }; + // Additional props to be passed to the iframe, used for testing out features + // prior to being added to the main props additionalProps?: Record | undefined; onDocumentCreated?: (data: { externalId: string; @@ -53,6 +55,11 @@ function EmbedCreateDocument(props: EmbedCreateDocumentProps) { return srcUrl.toString(); } + function sandbox() { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + } + function handleMessage(event: MessageEvent) { if (__iframe.current?.contentWindow === event.source) { switch (event.data.type) { @@ -76,7 +83,14 @@ function EmbedCreateDocument(props: EmbedCreateDocumentProps) { }; }, []); - return + ); } diff --git a/packages/solid/src/create-envelope.tsx b/packages/solid/src/create-envelope.tsx index aa2f0a2..3cc77c7 100644 --- a/packages/solid/src/create-envelope.tsx +++ b/packages/solid/src/create-envelope.tsx @@ -14,8 +14,9 @@ export type EmbedCreateEnvelopeProps = { css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; - language?: string | undefined; // biome-ignore lint/suspicious/noExplicitAny: Hehe + language?: string | undefined; + // biome-ignore lint/suspicious/noExplicitAny: Hehe features?: DeepPartial & Record; onEnvelopeCreated?: (data: { externalId: string | null; @@ -50,6 +51,11 @@ function EmbedCreateEnvelope(props: EmbedCreateEnvelopeProps) { return srcUrl.toString(); }); + const sandbox = createMemo(() => { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + }); + function handleMessage(event: MessageEvent) { if (__iframe?.contentWindow === event.source) { switch (event.data.type) { @@ -71,7 +77,12 @@ function EmbedCreateEnvelope(props: EmbedCreateEnvelopeProps) { return ( <> - + ); } diff --git a/packages/solid/src/create-template.tsx b/packages/solid/src/create-template.tsx index 7512ed7..e4658b1 100644 --- a/packages/solid/src/create-template.tsx +++ b/packages/solid/src/create-template.tsx @@ -4,8 +4,9 @@ export type EmbedCreateTemplateProps = { className?: string; host?: string; presignToken: string; - externalId?: string; // @src: /apps/web/src/app/embed/direct/[[...url]]/schema + externalId?: string; + // @src: /apps/web/src/app/embed/direct/[[...url]]/schema css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; @@ -17,9 +18,10 @@ export type EmbedCreateTemplateProps = { allowConfigureTimezone?: boolean; allowConfigureRedirectUrl?: boolean; allowConfigureCommunication?: boolean; - }; // Additional props to be passed to the iframe, used for testing out features - // prior to being added to the main props + }; + // Additional props to be passed to the iframe, used for testing out features + // prior to being added to the main props additionalProps?: Record | undefined; onTemplateCreated?: (data: { externalId: string; @@ -51,6 +53,11 @@ function EmbedCreateTemplate(props: EmbedCreateTemplateProps) { return srcUrl.toString(); }); + const sandbox = createMemo(() => { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + }); + function handleMessage(event: MessageEvent) { if (__iframe?.contentWindow === event.source) { switch (event.data.type) { @@ -72,7 +79,12 @@ function EmbedCreateTemplate(props: EmbedCreateTemplateProps) { return ( <> - + ); } diff --git a/packages/solid/src/css-vars.ts b/packages/solid/src/css-vars.ts index 4a7705b..b024227 100644 --- a/packages/solid/src/css-vars.ts +++ b/packages/solid/src/css-vars.ts @@ -2,84 +2,57 @@ export type CssVars = { /** Base background color */ background?: string | null; /** Base text color */ - foreground?: string | null; /** Muted/subtle background color */ - muted?: string | null; /** Muted/subtle text color */ - mutedForeground?: string | null; /** Popover/dropdown background color */ - popover?: string | null; /** Popover/dropdown text color */ - popoverForeground?: string | null; /** Card background color */ - card?: string | null; /** Card border color */ - cardBorder?: string | null; /** Card border tint/highlight color */ - cardBorderTint?: string | null; /** Card text color */ - cardForeground?: string | null; /** Field card background color */ - fieldCard?: string | null; /** Field card border color */ - fieldCardBorder?: string | null; /** Field card text color */ - fieldCardForeground?: string | null; /** Widget background color */ - widget?: string | null; /** Widget text color */ - widgetForeground?: string | null; /** Default border color */ - border?: string | null; /** Input field border color */ - input?: string | null; /** Primary action/button color */ - primary?: string | null; /** Primary action/button text color */ - primaryForeground?: string | null; /** Secondary action/button color */ - secondary?: string | null; /** Secondary action/button text color */ - secondaryForeground?: string | null; /** Accent/highlight color */ - accent?: string | null; /** Accent/highlight text color */ - accentForeground?: string | null; /** Destructive/danger action color */ - destructive?: string | null; /** Destructive/danger text color */ - destructiveForeground?: string | null; /** Focus ring color */ - ring?: string | null; /** Border radius size in REM units */ - radius?: string | null; /** Warning/alert color */ - warning?: string | null; } \ No newline at end of file diff --git a/packages/solid/src/direct-template.tsx b/packages/solid/src/direct-template.tsx index a83fe71..29a22ba 100644 --- a/packages/solid/src/direct-template.tsx +++ b/packages/solid/src/direct-template.tsx @@ -4,8 +4,9 @@ export type EmbedDirectTemplateProps = { className?: string; host?: string; token: string; - externalId?: string; // @src: /apps/web/src/app/embed/direct/[[...url]]/schema + externalId?: string; + // @src: /apps/web/src/app/embed/direct/[[...url]]/schema css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; @@ -13,9 +14,10 @@ export type EmbedDirectTemplateProps = { email?: string | undefined; lockEmail?: boolean | undefined; name?: string | undefined; - lockName?: boolean | undefined; // Additional props to be passed to the iframe, used for testing out features - // prior to being added to the main props + lockName?: boolean | undefined; + // Additional props to be passed to the iframe, used for testing out features + // prior to being added to the main props additionalProps?: Record | undefined; onDocumentReady?: () => void; onDocumentCompleted?: (data: { @@ -49,33 +51,32 @@ function EmbedDirectTemplate(props: EmbedDirectTemplateProps) { ) ); const srcUrl = new URL(`/embed/direct/${props.token}`, appHost); - if (props.externalId) { srcUrl.searchParams.set("externalId", props.externalId); } - return `${srcUrl}#${encodedOptions}`; }); + const sandbox = createMemo(() => { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + }); + function handleMessage(event: MessageEvent) { if (__iframe?.contentWindow === event.source) { switch (event.data.action) { case "document-ready": props.onDocumentReady?.(); break; - case "document-completed": props.onDocumentCompleted?.(event.data.data); break; - case "document-error": props.onDocumentError?.(event.data.data); break; - case "field-signed": props.onFieldSigned?.(); break; - case "field-unsigned": props.onFieldUnsigned?.(); break; @@ -91,7 +92,12 @@ function EmbedDirectTemplate(props: EmbedDirectTemplateProps) { return ( <> - + ); } diff --git a/packages/solid/src/features-type.ts b/packages/solid/src/features-type.ts index 04ed67e..0aa92b7 100644 --- a/packages/solid/src/features-type.ts +++ b/packages/solid/src/features-type.ts @@ -1,9 +1,9 @@ export type DeepPartial = T extends object ? { [K in keyof T]?: DeepPartial } : T; + /** * Envelope editor settings (features) for create/edit envelope embeds. * Matches ZEnvelopeEditorSettingsSchema from the app. */ - export type EnvelopeEditorSettings = { general: { allowConfigureEnvelopeTitle: boolean; @@ -12,8 +12,8 @@ export type EnvelopeEditorSettings = { allowPreviewStep: boolean; minimizeLeftSidebar: boolean; }; - /** If null, envelope settings will not be available to be seen/updated. */ + /** If null, envelope settings will not be available to be seen/updated. */ settings: { allowConfigureSignatureTypes: boolean; allowConfigureLanguage: boolean; @@ -26,15 +26,15 @@ export type EnvelopeEditorSettings = { allowConfigureEmailReplyTo: boolean; } | null; actions: { - allowAttachments: boolean; // allowDistributing: boolean; // These are not available for embeds. + allowAttachments: boolean; + // allowDistributing: boolean; // These are not available for embeds. // allowDirectLink: boolean; // These are not available for embeds. // allowDuplication: boolean; // These are not available for embeds. // allowDownloadPDF: boolean; // These are not available for embeds. // allowDeletion: boolean; // These are not available for embeds. - }; - /** If null, no adjustments to envelope items will be allowed. */ + /** If null, no adjustments to envelope items will be allowed. */ envelopeItems: { allowConfigureTitle: boolean; allowConfigureOrder: boolean; @@ -42,8 +42,8 @@ export type EnvelopeEditorSettings = { allowDelete: boolean; allowReplace: boolean; } | null; - /** If null, recipients will not be configurable at all. */ + /** If null, recipients will not be configurable at all. */ recipients: { // allowAIDetection: boolean; // These aren't available for embeds. allowConfigureSigningOrder: boolean; @@ -52,8 +52,9 @@ export type EnvelopeEditorSettings = { allowViewerRole: boolean; allowCCerRole: boolean; allowAssistantRole: boolean; - } | null; // fields: { + } | null; + + // fields: { // allowAIDetection: boolean; // These aren't available for embeds. // }; - } \ No newline at end of file diff --git a/packages/solid/src/multisign-document.tsx b/packages/solid/src/multisign-document.tsx index 21135c7..81fe561 100644 --- a/packages/solid/src/multisign-document.tsx +++ b/packages/solid/src/multisign-document.tsx @@ -3,16 +3,18 @@ import { onMount, createSignal, createMemo } from "solid-js"; export type EmbedMultiSignDocumentProps = { className?: string; host?: string; - tokens: string[]; // @src: /apps/web/src/app/embed/direct/[[...url]]/schema + tokens: string[]; + // @src: /apps/web/src/app/embed/direct/[[...url]]/schema css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; name?: string | undefined; lockName?: 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 + allowDocumentRejection?: boolean | undefined; + // Additional props to be passed to the iframe, used for testing out features + // prior to being added to the main props additionalProps?: Record | undefined; onDocumentReady?: () => void; onDocumentCompleted?: (data: { @@ -57,33 +59,32 @@ function EmbedMultiSignDocument(props: EmbedMultiSignDocumentProps) { ) ); const srcUrl = new URL(`/embed/v1/multisign`, appHost); - for (const token of props.tokens) { srcUrl.searchParams.append("token", token); } - return `${srcUrl}#${encodedOptions}`; }); + const sandbox = createMemo(() => { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + }); + function handleMessage(event: MessageEvent) { if (__iframe?.contentWindow === event.source) { switch (event.data.action) { case "document-ready": props.onDocumentReady?.(); break; - case "document-completed": props.onDocumentCompleted?.(event.data.data); break; - case "document-error": props.onDocumentError?.(event.data.data); break; - case "document-rejected": props.onDocumentRejected?.(event.data.data); break; - case "all-documents-completed": props.onAllDocumentsCompleted?.(event.data.data); break; @@ -99,7 +100,12 @@ function EmbedMultiSignDocument(props: EmbedMultiSignDocumentProps) { return ( <> - + ); } diff --git a/packages/solid/src/sign-document.tsx b/packages/solid/src/sign-document.tsx index f8abc74..5fbdc37 100644 --- a/packages/solid/src/sign-document.tsx +++ b/packages/solid/src/sign-document.tsx @@ -3,8 +3,9 @@ import { onMount, createSignal, createMemo } from "solid-js"; export type EmbedSignDocumentProps = { className?: string; host?: string; - token: string; // @src: /apps/web/src/app/embed/direct/[[...url]]/schema + token: string; + // @src: /apps/web/src/app/embed/direct/[[...url]]/schema css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; @@ -13,9 +14,10 @@ export type EmbedSignDocumentProps = { 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 + allowDocumentRejection?: boolean | undefined; + // Additional props to be passed to the iframe, used for testing out features + // prior to being added to the main props additionalProps?: Record | undefined; onDocumentReady?: () => void; onDocumentCompleted?: (data: { @@ -23,7 +25,7 @@ export type EmbedSignDocumentProps = { documentId: number; recipientId: number; }) => void; - onDocumentError?: (error: string) => void; + onDocumentError?: (error: string | null) => void; onDocumentRejected?: (data: { token: string; documentId: number; @@ -57,21 +59,23 @@ function EmbedSignDocument(props: EmbedSignDocumentProps) { return `${srcUrl}#${encodedOptions}`; }); + const sandbox = createMemo(() => { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + }); + function handleMessage(event: MessageEvent) { if (__iframe?.contentWindow === event.source) { switch (event.data.action) { case "document-ready": props.onDocumentReady?.(); break; - case "document-completed": props.onDocumentCompleted?.(event.data.data); break; - case "document-error": props.onDocumentError?.(event.data.data); break; - case "document-rejected": props.onDocumentRejected?.(event.data.data); break; @@ -87,7 +91,12 @@ function EmbedSignDocument(props: EmbedSignDocumentProps) { return ( <> - + ); } diff --git a/packages/solid/src/update-document.tsx b/packages/solid/src/update-document.tsx index 0546a45..835b8f4 100644 --- a/packages/solid/src/update-document.tsx +++ b/packages/solid/src/update-document.tsx @@ -5,8 +5,9 @@ export type EmbedUpdateDocumentProps = { host?: string; presignToken: string; documentId: number; - externalId?: string; // @src: /apps/web/src/app/embed/direct/[[...url]]/schema + externalId?: string; + // @src: /apps/web/src/app/embed/direct/[[...url]]/schema css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; @@ -19,9 +20,10 @@ export type EmbedUpdateDocumentProps = { allowConfigureRedirectUrl?: boolean; allowConfigureCommunication?: boolean; }; - onlyEditFields?: boolean | undefined; // Additional props to be passed to the iframe, used for testing out features - // prior to being added to the main props + onlyEditFields?: boolean | undefined; + // Additional props to be passed to the iframe, used for testing out features + // prior to being added to the main props additionalProps?: Record | undefined; onDocumentUpdated?: (data: { externalId: string; @@ -58,6 +60,11 @@ function EmbedUpdateDocument(props: EmbedUpdateDocumentProps) { return srcUrl.toString(); }); + const sandbox = createMemo(() => { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + }); + function handleMessage(event: MessageEvent) { if (__iframe?.contentWindow === event.source) { switch (event.data.type) { @@ -79,7 +86,12 @@ function EmbedUpdateDocument(props: EmbedUpdateDocumentProps) { return ( <> - + ); } diff --git a/packages/solid/src/update-envelope.tsx b/packages/solid/src/update-envelope.tsx index aa32bc3..2c0e704 100644 --- a/packages/solid/src/update-envelope.tsx +++ b/packages/solid/src/update-envelope.tsx @@ -13,8 +13,9 @@ export type EmbedUpdateEnvelopeProps = { css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; - language?: string | undefined; // biome-ignore lint/suspicious/noExplicitAny: Hehe + language?: string | undefined; + // biome-ignore lint/suspicious/noExplicitAny: Hehe features?: DeepPartial & Record; onEnvelopeUpdated?: (data: { externalId: string | null; @@ -50,6 +51,11 @@ function EmbedUpdateEnvelope(props: EmbedUpdateEnvelopeProps) { return srcUrl.toString(); }); + const sandbox = createMemo(() => { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + }); + function handleMessage(event: MessageEvent) { if (__iframe?.contentWindow === event.source) { switch (event.data.type) { @@ -71,7 +77,12 @@ function EmbedUpdateEnvelope(props: EmbedUpdateEnvelopeProps) { return ( <> - + ); } diff --git a/packages/solid/src/update-template.tsx b/packages/solid/src/update-template.tsx index 07314ed..a9c6283 100644 --- a/packages/solid/src/update-template.tsx +++ b/packages/solid/src/update-template.tsx @@ -5,8 +5,9 @@ export type EmbedUpdateTemplateProps = { host?: string; presignToken: string; templateId: number; - externalId?: string; // @src: /apps/web/src/app/embed/direct/[[...url]]/schema + externalId?: string; + // @src: /apps/web/src/app/embed/direct/[[...url]]/schema css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; @@ -19,9 +20,10 @@ export type EmbedUpdateTemplateProps = { allowConfigureRedirectUrl?: boolean; allowConfigureCommunication?: boolean; }; - onlyEditFields?: boolean | undefined; // Additional props to be passed to the iframe, used for testing out features - // prior to being added to the main props + onlyEditFields?: boolean | undefined; + // Additional props to be passed to the iframe, used for testing out features + // prior to being added to the main props additionalProps?: Record | undefined; onTemplateUpdated?: (data: { externalId: string; @@ -57,6 +59,11 @@ function EmbedUpdateTemplate(props: EmbedUpdateTemplateProps) { return srcUrl.toString(); }); + const sandbox = createMemo(() => { + // biome-ignore lint/suspicious/noExplicitAny: Mitosis types `sandbox` as a single token, but the attribute is space-separated. + return "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" as any; + }); + function handleMessage(event: MessageEvent) { if (__iframe?.contentWindow === event.source) { switch (event.data.type) { @@ -78,7 +85,12 @@ function EmbedUpdateTemplate(props: EmbedUpdateTemplateProps) { return ( <> - + ); } diff --git a/packages/svelte/src/create-document.svelte b/packages/svelte/src/create-document.svelte index 45033f2..af07c71 100644 --- a/packages/svelte/src/create-document.svelte +++ b/packages/svelte/src/create-document.svelte @@ -3,8 +3,9 @@ className?: string; host?: string; presignToken: string; - externalId?: string; // @src: /apps/web/src/app/embed/direct/[[...url]]/schema + externalId?: string; + // @src: /apps/web/src/app/embed/direct/[[...url]]/schema css?: string | undefined; cssVars?: (CssVars & Record) | undefined; darkModeDisabled?: boolean | undefined; @@ -16,9 +17,10 @@ allowConfigureTimezone?: boolean; allowConfigureRedirectUrl?: boolean; allowConfigureCommunication?: boolean; - }; // Additional props to be passed to the iframe, used for testing out features - // prior to being added to the main props + }; + // Additional props to be passed to the iframe, used for testing out features + // prior to being added to the main props additionalProps?: Record | undefined; onDocumentCreated?: (data: { externalId: string; @@ -30,7 +32,7 @@ - +