@documenso/embed-vue 0.1.0 → 0.2.0-rc.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/css-vars.d.ts +58 -0
- package/dist/direct-template.vue.d.ts +3 -1
- package/dist/index.js +1 -1
- package/dist/index.mjs +52 -42
- package/dist/sign-document.vue.d.ts +3 -1
- package/package.json +1 -1
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
export type CssVars = {
|
|
2
|
+
/** Base background color */
|
|
3
|
+
background?: string | null;
|
|
4
|
+
/** Base text color */
|
|
5
|
+
foreground?: string | null;
|
|
6
|
+
/** Muted/subtle background color */
|
|
7
|
+
muted?: string | null;
|
|
8
|
+
/** Muted/subtle text color */
|
|
9
|
+
mutedForeground?: string | null;
|
|
10
|
+
/** Popover/dropdown background color */
|
|
11
|
+
popover?: string | null;
|
|
12
|
+
/** Popover/dropdown text color */
|
|
13
|
+
popoverForeground?: string | null;
|
|
14
|
+
/** Card background color */
|
|
15
|
+
card?: string | null;
|
|
16
|
+
/** Card border color */
|
|
17
|
+
cardBorder?: string | null;
|
|
18
|
+
/** Card border tint/highlight color */
|
|
19
|
+
cardBorderTint?: string | null;
|
|
20
|
+
/** Card text color */
|
|
21
|
+
cardForeground?: string | null;
|
|
22
|
+
/** Field card background color */
|
|
23
|
+
fieldCard?: string | null;
|
|
24
|
+
/** Field card border color */
|
|
25
|
+
fieldCardBorder?: string | null;
|
|
26
|
+
/** Field card text color */
|
|
27
|
+
fieldCardForeground?: string | null;
|
|
28
|
+
/** Widget background color */
|
|
29
|
+
widget?: string | null;
|
|
30
|
+
/** Widget text color */
|
|
31
|
+
widgetForeground?: string | null;
|
|
32
|
+
/** Default border color */
|
|
33
|
+
border?: string | null;
|
|
34
|
+
/** Input field border color */
|
|
35
|
+
input?: string | null;
|
|
36
|
+
/** Primary action/button color */
|
|
37
|
+
primary?: string | null;
|
|
38
|
+
/** Primary action/button text color */
|
|
39
|
+
primaryForeground?: string | null;
|
|
40
|
+
/** Secondary action/button color */
|
|
41
|
+
secondary?: string | null;
|
|
42
|
+
/** Secondary action/button text color */
|
|
43
|
+
secondaryForeground?: string | null;
|
|
44
|
+
/** Accent/highlight color */
|
|
45
|
+
accent?: string | null;
|
|
46
|
+
/** Accent/highlight text color */
|
|
47
|
+
accentForeground?: string | null;
|
|
48
|
+
/** Destructive/danger action color */
|
|
49
|
+
destructive?: string | null;
|
|
50
|
+
/** Destructive/danger text color */
|
|
51
|
+
destructiveForeground?: string | null;
|
|
52
|
+
/** Focus ring color */
|
|
53
|
+
ring?: string | null;
|
|
54
|
+
/** Border radius size in REM units */
|
|
55
|
+
radius?: string | null;
|
|
56
|
+
/** Warning/alert color */
|
|
57
|
+
warning?: string | null;
|
|
58
|
+
};
|
|
@@ -1,10 +1,12 @@
|
|
|
1
|
+
import { CssVars } from './css-vars';
|
|
1
2
|
export type EmbedDirectTemplateProps = {
|
|
2
3
|
className?: string;
|
|
3
4
|
host?: string;
|
|
4
5
|
token: string;
|
|
5
6
|
externalId?: string;
|
|
6
7
|
css?: string | undefined;
|
|
7
|
-
cssVars?: Record<string, string> | undefined;
|
|
8
|
+
cssVars?: (CssVars & Record<string, string>) | undefined;
|
|
9
|
+
darkModeDisabled?: boolean | undefined;
|
|
8
10
|
email?: string | undefined;
|
|
9
11
|
lockEmail?: boolean | undefined;
|
|
10
12
|
name?: string | undefined;
|
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("vue"),k=["src"],f=o.defineComponent({__name:"direct-template",props:{className:{},host:{},token:{},externalId:{},css:{},cssVars:{},darkModeDisabled:{type:Boolean},email:{},lockEmail:{type:Boolean},name:{},lockName:{type:Boolean},onDocumentReady:{type:Function},onDocumentCompleted:{type:Function},onDocumentError:{type:Function},onFieldSigned:{type:Function},onFieldUnsigned:{type:Function}},setup(m){const e=m,c=o.ref();o.onMounted(()=>{window.addEventListener("message",s)}),o.onUnmounted(()=>{window.removeEventListener("message",s)});const i=o.computed(()=>{const n=e.host||"https://app.documenso.com",t=btoa(encodeURIComponent(JSON.stringify({name:e.name,lockName:e.lockName,email:e.email,lockEmail:e.lockEmail,css:e.css,cssVars:e.cssVars,darkModeDisabled:e.darkModeDisabled}))),a=new URL(`/embed/direct/${e.token}`,n);return e.externalId&&a.searchParams.set("externalId",e.externalId),`${a}#${t}`});function s(n){var t,a,d,r,l,u;if(((t=c.value)==null?void 0:t.contentWindow)===n.source)switch(n.data.action){case"document-ready":(a=e.onDocumentReady)==null||a.call(e);break;case"document-completed":(d=e.onDocumentCompleted)==null||d.call(e,n.data.data);break;case"document-error":(r=e.onDocumentError)==null||r.call(e,n.data.data);break;case"field-signed":(l=e.onFieldSigned)==null||l.call(e);break;case"field-unsigned":(u=e.onFieldUnsigned)==null||u.call(e);break}}return(n,t)=>(o.openBlock(),o.createElementBlock("iframe",{ref_key:"__iframe",ref:c,class:o.normalizeClass(n.className),src:i.value},null,10,k))}}),y=["src"],_=o.defineComponent({__name:"sign-document",props:{className:{},host:{},token:{},css:{},cssVars:{},darkModeDisabled:{type:Boolean},name:{},lockName:{type:Boolean},onDocumentReady:{type:Function},onDocumentCompleted:{type:Function},onDocumentError:{type:Function}},setup(m){const e=m,c=o.ref();o.onMounted(()=>{window.addEventListener("message",s)}),o.onUnmounted(()=>{window.removeEventListener("message",s)});const i=o.computed(()=>{const n=e.host||"https://app.documenso.com",t=btoa(encodeURIComponent(JSON.stringify({name:e.name,lockName:e.lockName,css:e.css,cssVars:e.cssVars,darkModeDisabled:e.darkModeDisabled})));return`${new URL(`/embed/sign/${e.token}`,n)}#${t}`});function s(n){var t,a,d,r;if(((t=c.value)==null?void 0:t.contentWindow)===n.source)switch(n.data.action){case"document-ready":(a=e.onDocumentReady)==null||a.call(e);break;case"document-completed":(d=e.onDocumentCompleted)==null||d.call(e,n.data.data);break;case"document-error":(r=e.onDocumentError)==null||r.call(e,n.data.data);break}}return(n,t)=>(o.openBlock(),o.createElementBlock("iframe",{ref_key:"__iframe",ref:c,class:o.normalizeClass(n.className),src:i.value},null,10,y))}});exports.EmbedDirectTemplate=f;exports.EmbedSignDocument=_;
|
package/dist/index.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { defineComponent as u, ref as k, onMounted as f, onUnmounted as _, computed as y, openBlock as
|
|
2
|
-
const
|
|
1
|
+
import { defineComponent as u, ref as k, onMounted as f, onUnmounted as _, computed as y, openBlock as b, createElementBlock as D, normalizeClass as p } from "vue";
|
|
2
|
+
const g = ["src"], E = /* @__PURE__ */ u({
|
|
3
3
|
__name: "direct-template",
|
|
4
4
|
props: {
|
|
5
5
|
className: {},
|
|
@@ -8,6 +8,7 @@ const p = ["src"], E = /* @__PURE__ */ u({
|
|
|
8
8
|
externalId: {},
|
|
9
9
|
css: {},
|
|
10
10
|
cssVars: {},
|
|
11
|
+
darkModeDisabled: { type: Boolean },
|
|
11
12
|
email: {},
|
|
12
13
|
lockEmail: { type: Boolean },
|
|
13
14
|
name: {},
|
|
@@ -19,36 +20,40 @@ const p = ["src"], E = /* @__PURE__ */ u({
|
|
|
19
20
|
onFieldUnsigned: { type: Function }
|
|
20
21
|
},
|
|
21
22
|
setup(r) {
|
|
22
|
-
const e = r,
|
|
23
|
+
const e = r, t = k();
|
|
23
24
|
f(() => {
|
|
24
25
|
window.addEventListener("message", c);
|
|
25
26
|
}), _(() => {
|
|
26
27
|
window.removeEventListener("message", c);
|
|
27
28
|
});
|
|
28
|
-
const
|
|
29
|
-
const n = e.host || "https://app.documenso.com",
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
29
|
+
const m = y(() => {
|
|
30
|
+
const n = e.host || "https://app.documenso.com", o = btoa(
|
|
31
|
+
encodeURIComponent(
|
|
32
|
+
JSON.stringify({
|
|
33
|
+
name: e.name,
|
|
34
|
+
lockName: e.lockName,
|
|
35
|
+
email: e.email,
|
|
36
|
+
lockEmail: e.lockEmail,
|
|
37
|
+
css: e.css,
|
|
38
|
+
cssVars: e.cssVars,
|
|
39
|
+
darkModeDisabled: e.darkModeDisabled
|
|
40
|
+
})
|
|
41
|
+
)
|
|
42
|
+
), a = new URL(`/embed/direct/${e.token}`, n);
|
|
43
|
+
return e.externalId && a.searchParams.set("externalId", e.externalId), `${a}#${o}`;
|
|
39
44
|
});
|
|
40
45
|
function c(n) {
|
|
41
|
-
var
|
|
42
|
-
if (((
|
|
46
|
+
var o, a, s, d, i, l;
|
|
47
|
+
if (((o = t.value) == null ? void 0 : o.contentWindow) === n.source)
|
|
43
48
|
switch (n.data.action) {
|
|
44
49
|
case "document-ready":
|
|
45
|
-
(
|
|
50
|
+
(a = e.onDocumentReady) == null || a.call(e);
|
|
46
51
|
break;
|
|
47
52
|
case "document-completed":
|
|
48
53
|
(s = e.onDocumentCompleted) == null || s.call(e, n.data.data);
|
|
49
54
|
break;
|
|
50
55
|
case "document-error":
|
|
51
|
-
(
|
|
56
|
+
(d = e.onDocumentError) == null || d.call(e, n.data.data);
|
|
52
57
|
break;
|
|
53
58
|
case "field-signed":
|
|
54
59
|
(i = e.onFieldSigned) == null || i.call(e);
|
|
@@ -58,14 +63,14 @@ const p = ["src"], E = /* @__PURE__ */ u({
|
|
|
58
63
|
break;
|
|
59
64
|
}
|
|
60
65
|
}
|
|
61
|
-
return (n,
|
|
66
|
+
return (n, o) => (b(), D("iframe", {
|
|
62
67
|
ref_key: "__iframe",
|
|
63
|
-
ref:
|
|
64
|
-
class:
|
|
65
|
-
src:
|
|
66
|
-
}, null, 10,
|
|
68
|
+
ref: t,
|
|
69
|
+
class: p(n.className),
|
|
70
|
+
src: m.value
|
|
71
|
+
}, null, 10, g));
|
|
67
72
|
}
|
|
68
|
-
}),
|
|
73
|
+
}), h = ["src"], F = /* @__PURE__ */ u({
|
|
69
74
|
__name: "sign-document",
|
|
70
75
|
props: {
|
|
71
76
|
className: {},
|
|
@@ -73,6 +78,7 @@ const p = ["src"], E = /* @__PURE__ */ u({
|
|
|
73
78
|
token: {},
|
|
74
79
|
css: {},
|
|
75
80
|
cssVars: {},
|
|
81
|
+
darkModeDisabled: { type: Boolean },
|
|
76
82
|
name: {},
|
|
77
83
|
lockName: { type: Boolean },
|
|
78
84
|
onDocumentReady: { type: Function },
|
|
@@ -80,43 +86,47 @@ const p = ["src"], E = /* @__PURE__ */ u({
|
|
|
80
86
|
onDocumentError: { type: Function }
|
|
81
87
|
},
|
|
82
88
|
setup(r) {
|
|
83
|
-
const e = r,
|
|
89
|
+
const e = r, t = k();
|
|
84
90
|
f(() => {
|
|
85
91
|
window.addEventListener("message", c);
|
|
86
92
|
}), _(() => {
|
|
87
93
|
window.removeEventListener("message", c);
|
|
88
94
|
});
|
|
89
|
-
const
|
|
90
|
-
const n = e.host || "https://app.documenso.com",
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
95
|
+
const m = y(() => {
|
|
96
|
+
const n = e.host || "https://app.documenso.com", o = btoa(
|
|
97
|
+
encodeURIComponent(
|
|
98
|
+
JSON.stringify({
|
|
99
|
+
name: e.name,
|
|
100
|
+
lockName: e.lockName,
|
|
101
|
+
css: e.css,
|
|
102
|
+
cssVars: e.cssVars,
|
|
103
|
+
darkModeDisabled: e.darkModeDisabled
|
|
104
|
+
})
|
|
105
|
+
)
|
|
96
106
|
);
|
|
97
|
-
return `${new URL(`/embed/sign/${e.token}`, n)}#${
|
|
107
|
+
return `${new URL(`/embed/sign/${e.token}`, n)}#${o}`;
|
|
98
108
|
});
|
|
99
109
|
function c(n) {
|
|
100
|
-
var
|
|
101
|
-
if (((
|
|
110
|
+
var o, a, s, d;
|
|
111
|
+
if (((o = t.value) == null ? void 0 : o.contentWindow) === n.source)
|
|
102
112
|
switch (n.data.action) {
|
|
103
113
|
case "document-ready":
|
|
104
|
-
(
|
|
114
|
+
(a = e.onDocumentReady) == null || a.call(e);
|
|
105
115
|
break;
|
|
106
116
|
case "document-completed":
|
|
107
117
|
(s = e.onDocumentCompleted) == null || s.call(e, n.data.data);
|
|
108
118
|
break;
|
|
109
119
|
case "document-error":
|
|
110
|
-
(
|
|
120
|
+
(d = e.onDocumentError) == null || d.call(e, n.data.data);
|
|
111
121
|
break;
|
|
112
122
|
}
|
|
113
123
|
}
|
|
114
|
-
return (n,
|
|
124
|
+
return (n, o) => (b(), D("iframe", {
|
|
115
125
|
ref_key: "__iframe",
|
|
116
|
-
ref:
|
|
117
|
-
class:
|
|
118
|
-
src:
|
|
119
|
-
}, null, 10,
|
|
126
|
+
ref: t,
|
|
127
|
+
class: p(n.className),
|
|
128
|
+
src: m.value
|
|
129
|
+
}, null, 10, h));
|
|
120
130
|
}
|
|
121
131
|
});
|
|
122
132
|
export {
|
|
@@ -1,9 +1,11 @@
|
|
|
1
|
+
import { CssVars } from './css-vars';
|
|
1
2
|
export type EmbedSignDocumentProps = {
|
|
2
3
|
className?: string;
|
|
3
4
|
host?: string;
|
|
4
5
|
token: string;
|
|
5
6
|
css?: string | undefined;
|
|
6
|
-
cssVars?: Record<string, string> | undefined;
|
|
7
|
+
cssVars?: (CssVars & Record<string, string>) | undefined;
|
|
8
|
+
darkModeDisabled?: boolean | undefined;
|
|
7
9
|
name?: string | undefined;
|
|
8
10
|
lockName?: boolean | undefined;
|
|
9
11
|
onDocumentReady?: () => void;
|