@encatch/ws-react 0.0.50-beta.8 → 0.1.0-beta.19
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/README.md +1 -1
- package/dist/iframe-messages.d.ts +2 -2
- package/dist/index.es.js +53 -53
- package/dist/index.umd.js +3 -3
- package/dist/types.d.ts +5 -3
- package/package.json +3 -3
package/README.md
CHANGED
|
@@ -164,7 +164,7 @@ function MyComponent() {
|
|
|
164
164
|
- `form:show` - Form shown/displayed event
|
|
165
165
|
- `form:close` - Form closed event
|
|
166
166
|
- `form:section:change` - Section navigation event
|
|
167
|
-
- `form:
|
|
167
|
+
- `form:answered` - Question answered event
|
|
168
168
|
- `form:error` - Error event
|
|
169
169
|
|
|
170
170
|
### useEncatchFormEventAll
|
|
@@ -6,9 +6,9 @@
|
|
|
6
6
|
/** Message types sent from parent (EncatchPreview) to iframe */
|
|
7
7
|
export type SDKMessageType = "sdk:formConfig" | "sdk:theme" | "sdk:locale" | "sdk:resetData" | "sdk:prefillResponses";
|
|
8
8
|
/** Message types sent from iframe to parent */
|
|
9
|
-
export type FormMessageType = "form:ready" | "form:submit" | "form:complete" | "form:close" | "form:error" | "form:resize" | "form:
|
|
9
|
+
export type FormMessageType = "form:ready" | "form:submit" | "form:complete" | "form:close" | "form:error" | "form:resize" | "form:themeData";
|
|
10
10
|
/** Event-publisher messages (prefixed with encatch:) from iframe to parent */
|
|
11
|
-
export type EncatchFormEventType = "encatch:form:show" | "encatch:form:started" | "encatch:form:section:change" | "encatch:form:
|
|
11
|
+
export type EncatchFormEventType = "encatch:form:show" | "encatch:form:started" | "encatch:form:section:change" | "encatch:form:answered";
|
|
12
12
|
export interface SDKMessage {
|
|
13
13
|
type: SDKMessageType;
|
|
14
14
|
data?: Record<string, unknown>;
|
package/dist/index.es.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import q, { useRef as $, useEffect as O, useCallback as X } from "react";
|
|
2
2
|
var j = { exports: {} }, A = {};
|
|
3
3
|
/**
|
|
4
4
|
* @license React
|
|
@@ -13,7 +13,7 @@ var H;
|
|
|
13
13
|
function ae() {
|
|
14
14
|
if (H) return A;
|
|
15
15
|
H = 1;
|
|
16
|
-
var
|
|
16
|
+
var f = Symbol.for("react.transitional.element"), r = Symbol.for("react.fragment");
|
|
17
17
|
function n(a, s, c) {
|
|
18
18
|
var m = null;
|
|
19
19
|
if (c !== void 0 && (m = "" + c), s.key !== void 0 && (m = "" + s.key), "key" in s) {
|
|
@@ -22,7 +22,7 @@ function ae() {
|
|
|
22
22
|
w !== "key" && (c[w] = s[w]);
|
|
23
23
|
} else c = s;
|
|
24
24
|
return s = c.ref, {
|
|
25
|
-
$$typeof:
|
|
25
|
+
$$typeof: f,
|
|
26
26
|
type: a,
|
|
27
27
|
key: m,
|
|
28
28
|
ref: s !== void 0 ? s : null,
|
|
@@ -44,13 +44,13 @@ var C = {};
|
|
|
44
44
|
var Z;
|
|
45
45
|
function se() {
|
|
46
46
|
return Z || (Z = 1, process.env.NODE_ENV !== "production" && (function() {
|
|
47
|
-
function
|
|
47
|
+
function f(e) {
|
|
48
48
|
if (e == null) return null;
|
|
49
49
|
if (typeof e == "function")
|
|
50
50
|
return e.$$typeof === te ? null : e.displayName || e.name || null;
|
|
51
51
|
if (typeof e == "string") return e;
|
|
52
52
|
switch (e) {
|
|
53
|
-
case
|
|
53
|
+
case u:
|
|
54
54
|
return "Fragment";
|
|
55
55
|
case P:
|
|
56
56
|
return "Profiler";
|
|
@@ -77,11 +77,11 @@ function se() {
|
|
|
77
77
|
var t = e.render;
|
|
78
78
|
return e = e.displayName, e || (e = t.displayName || t.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
|
|
79
79
|
case o:
|
|
80
|
-
return t = e.displayName || null, t !== null ? t :
|
|
80
|
+
return t = e.displayName || null, t !== null ? t : f(e.type) || "Memo";
|
|
81
81
|
case J:
|
|
82
82
|
t = e._payload, e = e._init;
|
|
83
83
|
try {
|
|
84
|
-
return
|
|
84
|
+
return f(e(t));
|
|
85
85
|
} catch {
|
|
86
86
|
}
|
|
87
87
|
}
|
|
@@ -99,8 +99,8 @@ function se() {
|
|
|
99
99
|
}
|
|
100
100
|
if (t) {
|
|
101
101
|
t = console;
|
|
102
|
-
var
|
|
103
|
-
return
|
|
102
|
+
var l = t.error, b = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
|
|
103
|
+
return l.call(
|
|
104
104
|
t,
|
|
105
105
|
"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
|
|
106
106
|
b
|
|
@@ -108,11 +108,11 @@ function se() {
|
|
|
108
108
|
}
|
|
109
109
|
}
|
|
110
110
|
function a(e) {
|
|
111
|
-
if (e ===
|
|
111
|
+
if (e === u) return "<>";
|
|
112
112
|
if (typeof e == "object" && e !== null && e.$$typeof === J)
|
|
113
113
|
return "<...>";
|
|
114
114
|
try {
|
|
115
|
-
var t =
|
|
115
|
+
var t = f(e);
|
|
116
116
|
return t ? "<" + t + ">" : "<...>";
|
|
117
117
|
} catch {
|
|
118
118
|
return "<...>";
|
|
@@ -133,31 +133,31 @@ function se() {
|
|
|
133
133
|
return e.key !== void 0;
|
|
134
134
|
}
|
|
135
135
|
function w(e, t) {
|
|
136
|
-
function
|
|
136
|
+
function l() {
|
|
137
137
|
V || (V = !0, console.error(
|
|
138
138
|
"%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
|
|
139
139
|
t
|
|
140
140
|
));
|
|
141
141
|
}
|
|
142
|
-
|
|
143
|
-
get:
|
|
142
|
+
l.isReactWarning = !0, Object.defineProperty(e, "key", {
|
|
143
|
+
get: l,
|
|
144
144
|
configurable: !0
|
|
145
145
|
});
|
|
146
146
|
}
|
|
147
147
|
function v() {
|
|
148
|
-
var e =
|
|
148
|
+
var e = f(this.type);
|
|
149
149
|
return z[e] || (z[e] = !0, console.error(
|
|
150
150
|
"Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
|
|
151
151
|
)), e = this.props.ref, e !== void 0 ? e : null;
|
|
152
152
|
}
|
|
153
|
-
function h(e, t,
|
|
154
|
-
return
|
|
153
|
+
function h(e, t, l, b, k, g, Y, W) {
|
|
154
|
+
return l = g.ref, e = {
|
|
155
155
|
$$typeof: I,
|
|
156
156
|
type: e,
|
|
157
157
|
key: t,
|
|
158
158
|
props: g,
|
|
159
159
|
_owner: k
|
|
160
|
-
}, (
|
|
160
|
+
}, (l !== void 0 ? l : null) !== null ? Object.defineProperty(e, "ref", {
|
|
161
161
|
enumerable: !1,
|
|
162
162
|
get: v
|
|
163
163
|
}) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
|
|
@@ -182,7 +182,7 @@ function se() {
|
|
|
182
182
|
value: W
|
|
183
183
|
}), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
|
|
184
184
|
}
|
|
185
|
-
function R(e, t,
|
|
185
|
+
function R(e, t, l, b, k, g, Y, W) {
|
|
186
186
|
var p = t.children;
|
|
187
187
|
if (p !== void 0)
|
|
188
188
|
if (b)
|
|
@@ -196,7 +196,7 @@ function se() {
|
|
|
196
196
|
);
|
|
197
197
|
else y(p);
|
|
198
198
|
if (U.call(t, "key")) {
|
|
199
|
-
p =
|
|
199
|
+
p = f(e);
|
|
200
200
|
var S = Object.keys(t).filter(function(oe) {
|
|
201
201
|
return oe !== "key";
|
|
202
202
|
});
|
|
@@ -213,13 +213,13 @@ React keys must be passed directly to JSX without using spread:
|
|
|
213
213
|
p
|
|
214
214
|
), Q[p + b] = !0);
|
|
215
215
|
}
|
|
216
|
-
if (p = null,
|
|
217
|
-
|
|
216
|
+
if (p = null, l !== void 0 && (n(l), p = "" + l), m(t) && (n(t.key), p = "" + t.key), "key" in t) {
|
|
217
|
+
l = {};
|
|
218
218
|
for (var L in t)
|
|
219
|
-
L !== "key" && (
|
|
220
|
-
} else
|
|
219
|
+
L !== "key" && (l[L] = t[L]);
|
|
220
|
+
} else l = t;
|
|
221
221
|
return p && w(
|
|
222
|
-
|
|
222
|
+
l,
|
|
223
223
|
typeof e == "function" ? e.displayName || e.name || "Unknown" : e
|
|
224
224
|
), h(
|
|
225
225
|
e,
|
|
@@ -227,7 +227,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
227
227
|
g,
|
|
228
228
|
k,
|
|
229
229
|
s(),
|
|
230
|
-
|
|
230
|
+
l,
|
|
231
231
|
Y,
|
|
232
232
|
W
|
|
233
233
|
);
|
|
@@ -235,7 +235,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
235
235
|
function y(e) {
|
|
236
236
|
typeof e == "object" && e !== null && e.$$typeof === I && e._store && (e._store.validated = 1);
|
|
237
237
|
}
|
|
238
|
-
var i =
|
|
238
|
+
var i = q, I = Symbol.for("react.transitional.element"), N = Symbol.for("react.portal"), u = Symbol.for("react.fragment"), d = Symbol.for("react.strict_mode"), P = Symbol.for("react.profiler"), x = Symbol.for("react.consumer"), F = Symbol.for("react.context"), E = Symbol.for("react.forward_ref"), _ = Symbol.for("react.suspense"), T = Symbol.for("react.suspense_list"), o = Symbol.for("react.memo"), J = Symbol.for("react.lazy"), re = Symbol.for("react.activity"), te = Symbol.for("react.client.reference"), D = i.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, U = Object.prototype.hasOwnProperty, ne = Array.isArray, M = console.createTask ? console.createTask : function() {
|
|
239
239
|
return null;
|
|
240
240
|
};
|
|
241
241
|
i = {
|
|
@@ -247,24 +247,24 @@ React keys must be passed directly to JSX without using spread:
|
|
|
247
247
|
i,
|
|
248
248
|
c
|
|
249
249
|
)(), B = M(a(c)), Q = {};
|
|
250
|
-
C.Fragment =
|
|
250
|
+
C.Fragment = u, C.jsx = function(e, t, l, b, k) {
|
|
251
251
|
var g = 1e4 > D.recentlyCreatedOwnerStacks++;
|
|
252
252
|
return R(
|
|
253
253
|
e,
|
|
254
254
|
t,
|
|
255
|
-
|
|
255
|
+
l,
|
|
256
256
|
!1,
|
|
257
257
|
b,
|
|
258
258
|
k,
|
|
259
259
|
g ? Error("react-stack-top-frame") : G,
|
|
260
260
|
g ? M(a(e)) : B
|
|
261
261
|
);
|
|
262
|
-
}, C.jsxs = function(e, t,
|
|
262
|
+
}, C.jsxs = function(e, t, l, b, k) {
|
|
263
263
|
var g = 1e4 > D.recentlyCreatedOwnerStacks++;
|
|
264
264
|
return R(
|
|
265
265
|
e,
|
|
266
266
|
t,
|
|
267
|
-
|
|
267
|
+
l,
|
|
268
268
|
!0,
|
|
269
269
|
b,
|
|
270
270
|
k,
|
|
@@ -280,15 +280,15 @@ function ie() {
|
|
|
280
280
|
}
|
|
281
281
|
var ce = ie();
|
|
282
282
|
const fe = ({
|
|
283
|
-
formConfig:
|
|
283
|
+
formConfig: f,
|
|
284
284
|
formPageUrl: r,
|
|
285
285
|
formId: n,
|
|
286
286
|
scale: a = 100,
|
|
287
287
|
instanceId: s,
|
|
288
288
|
onFormEvent: c
|
|
289
289
|
}) => {
|
|
290
|
-
const m = !!(
|
|
291
|
-
}), i =
|
|
290
|
+
const m = !!(f && r), w = n ?? f?.formId ?? s ?? "preview", v = q.useRef(null), h = q.useRef(null), R = $(!1), y = $(() => {
|
|
291
|
+
}), i = $({});
|
|
292
292
|
O(() => {
|
|
293
293
|
if (!c) return;
|
|
294
294
|
c({
|
|
@@ -313,25 +313,25 @@ const fe = ({
|
|
|
313
313
|
});
|
|
314
314
|
}, [c]);
|
|
315
315
|
const I = X(() => {
|
|
316
|
-
if (!h.current?.contentWindow || !
|
|
317
|
-
const
|
|
316
|
+
if (!h.current?.contentWindow || !f) return;
|
|
317
|
+
const u = { formId: w, scale: a, ...f };
|
|
318
318
|
h.current.contentWindow.postMessage(
|
|
319
|
-
{ type: "sdk:formConfig", data:
|
|
319
|
+
{ type: "sdk:formConfig", data: u },
|
|
320
320
|
"*"
|
|
321
321
|
);
|
|
322
|
-
}, [
|
|
322
|
+
}, [f, w, a]);
|
|
323
323
|
y.current = I, O(() => {
|
|
324
324
|
!m || !R.current || y.current();
|
|
325
|
-
}, [m,
|
|
326
|
-
const N = X((
|
|
327
|
-
|
|
325
|
+
}, [m, f, I]);
|
|
326
|
+
const N = X((u) => {
|
|
327
|
+
u.style.border = "none", u.style.width = "100%", u.style.height = "100%";
|
|
328
328
|
}, []);
|
|
329
329
|
return O(() => {
|
|
330
|
-
if (!m || !v.current || !
|
|
331
|
-
const
|
|
332
|
-
|
|
330
|
+
if (!m || !v.current || !f || !r) return;
|
|
331
|
+
const u = document.createElement("div");
|
|
332
|
+
u.className = "encatch-preview-inner", u.style.width = "100%", u.style.height = "100%", u.style.display = "flex", u.style.flexDirection = "column", u.style.justifyContent = "flex-end", u.style.overflow = "auto";
|
|
333
333
|
const d = document.createElement("iframe"), P = new URL(r, window.location.origin);
|
|
334
|
-
P.searchParams.set("formId", w), d.src = P.toString(), d.title = "Encatch form", N(d), h.current = d,
|
|
334
|
+
P.searchParams.set("formId", w), d.src = P.toString(), d.title = "Encatch form", N(d), h.current = d, u.appendChild(d), v.current.appendChild(u);
|
|
335
335
|
const x = (F) => {
|
|
336
336
|
const E = F.data;
|
|
337
337
|
if (!E || typeof E != "object" || !E.type) return;
|
|
@@ -380,7 +380,7 @@ const fe = ({
|
|
|
380
380
|
timestamp: Date.now()
|
|
381
381
|
});
|
|
382
382
|
break;
|
|
383
|
-
case "form:
|
|
383
|
+
case "form:answered":
|
|
384
384
|
o && i.current.onQuestionAnswered && i.current.onQuestionAnswered({
|
|
385
385
|
feedbackConfigurationId: o.feedbackConfigurationId ?? T ?? "",
|
|
386
386
|
questionId: o.questionId,
|
|
@@ -400,7 +400,7 @@ const fe = ({
|
|
|
400
400
|
}
|
|
401
401
|
};
|
|
402
402
|
return window.addEventListener("message", x), () => {
|
|
403
|
-
window.removeEventListener("message", x), R.current = !1,
|
|
403
|
+
window.removeEventListener("message", x), R.current = !1, u.parentNode && u.parentNode.removeChild(u), h.current = null;
|
|
404
404
|
};
|
|
405
405
|
}, [m, r, w]), /* @__PURE__ */ ce.jsx(
|
|
406
406
|
"div",
|
|
@@ -482,7 +482,7 @@ class ue extends EventTarget {
|
|
|
482
482
|
"form:submit",
|
|
483
483
|
"form:close",
|
|
484
484
|
"form:section:change",
|
|
485
|
-
"form:
|
|
485
|
+
"form:answered",
|
|
486
486
|
"form:error"
|
|
487
487
|
], s = [];
|
|
488
488
|
return a.forEach((c) => {
|
|
@@ -523,15 +523,15 @@ class ue extends EventTarget {
|
|
|
523
523
|
}
|
|
524
524
|
}
|
|
525
525
|
const ee = new ue();
|
|
526
|
-
function de(
|
|
526
|
+
function de(f, r, n) {
|
|
527
527
|
O(() => ee.subscribe(
|
|
528
|
-
|
|
528
|
+
f,
|
|
529
529
|
r,
|
|
530
530
|
n
|
|
531
|
-
), [
|
|
531
|
+
), [f, n?.formId, r]);
|
|
532
532
|
}
|
|
533
|
-
function me(
|
|
534
|
-
O(() => ee.subscribeAll(
|
|
533
|
+
function me(f, r) {
|
|
534
|
+
O(() => ee.subscribeAll(f, r), [r?.formId, f]);
|
|
535
535
|
}
|
|
536
536
|
export {
|
|
537
537
|
fe as EncatchPreview,
|
package/dist/index.umd.js
CHANGED
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
*
|
|
7
7
|
* This source code is licensed under the MIT license found in the
|
|
8
8
|
* LICENSE file in the root directory of this source tree.
|
|
9
|
-
*/var
|
|
9
|
+
*/var q;function K(){if(q)return C;q=1;var l=Symbol.for("react.transitional.element"),r=Symbol.for("react.fragment");function n(s,a,c){var b=null;if(c!==void 0&&(b=""+c),a.key!==void 0&&(b=""+a.key),"key"in a){c={};for(var h in a)h!=="key"&&(c[h]=a[h])}else c=a;return a=c.ref,{$$typeof:l,type:s,key:b,ref:a!==void 0?a:null,props:c}}return C.Fragment=r,C.jsx=n,C.jsxs=n,C}var O={};/**
|
|
10
10
|
* @license React
|
|
11
11
|
* react-jsx-runtime.development.js
|
|
12
12
|
*
|
|
@@ -14,9 +14,9 @@
|
|
|
14
14
|
*
|
|
15
15
|
* This source code is licensed under the MIT license found in the
|
|
16
16
|
* LICENSE file in the root directory of this source tree.
|
|
17
|
-
*/var J;function ee(){return J||(J=1,process.env.NODE_ENV!=="production"&&(function(){function
|
|
17
|
+
*/var J;function ee(){return J||(J=1,process.env.NODE_ENV!=="production"&&(function(){function l(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===ce?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case u:return"Fragment";case j:return"Profiler";case d:return"StrictMode";case S:return"Suspense";case I:return"SuspenseList";case ie:return"Activity"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case F:return"Portal";case D:return(e.displayName||"Context")+".Provider";case N:return(e._context.displayName||"Context")+".Consumer";case v:var t=e.render;return e=e.displayName,e||(e=t.displayName||t.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case o:return t=e.displayName||null,t!==null?t:l(e.type)||"Memo";case z:t=e._payload,e=e._init;try{return l(e(t))}catch{}}return null}function r(e){return""+e}function n(e){try{r(e);var t=!1}catch{t=!0}if(t){t=console;var f=t.error,p=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return f.call(t,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",p),r(e)}}function s(e){if(e===u)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===z)return"<...>";try{var t=l(e);return t?"<"+t+">":"<...>"}catch{return"<...>"}}function a(){var e=M.A;return e===null?null:e.getOwner()}function c(){return Error("react-stack-top-frame")}function b(e){if(G.call(e,"key")){var t=Object.getOwnPropertyDescriptor(e,"key").get;if(t&&t.isReactWarning)return!1}return e.key!==void 0}function h(e,t){function f(){B||(B=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",t))}f.isReactWarning=!0,Object.defineProperty(e,"key",{get:f,configurable:!0})}function y(){var e=l(this.type);return Q[e]||(Q[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),e=this.props.ref,e!==void 0?e:null}function E(e,t,f,p,R,g,W,L){return f=g.ref,e={$$typeof:P,type:e,key:t,props:g,_owner:R},(f!==void 0?f:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:y}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:W}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:L}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function _(e,t,f,p,R,g,W,L){var w=t.children;if(w!==void 0)if(p)if(ue(w)){for(p=0;p<w.length;p++)T(w[p]);Object.freeze&&Object.freeze(w)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else T(w);if(G.call(t,"key")){w=l(e);var A=Object.keys(t).filter(function(fe){return fe!=="key"});p=0<A.length?"{key: someKey, "+A.join(": ..., ")+": ...}":"{key: someKey}",Z[w+p]||(A=0<A.length?"{"+A.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
|
|
18
18
|
let props = %s;
|
|
19
19
|
<%s {...props} />
|
|
20
20
|
React keys must be passed directly to JSX without using spread:
|
|
21
21
|
let props = %s;
|
|
22
|
-
<%s key={someKey} {...props} />`,p,w,A,w),Z[w+p]=!0)}if(w=null,
|
|
22
|
+
<%s key={someKey} {...props} />`,p,w,A,w),Z[w+p]=!0)}if(w=null,f!==void 0&&(n(f),w=""+f),b(t)&&(n(t.key),w=""+t.key),"key"in t){f={};for(var $ in t)$!=="key"&&(f[$]=t[$])}else f=t;return w&&h(f,typeof e=="function"?e.displayName||e.name||"Unknown":e),E(e,w,g,R,a(),f,W,L)}function T(e){typeof e=="object"&&e!==null&&e.$$typeof===P&&e._store&&(e._store.validated=1)}var i=m,P=Symbol.for("react.transitional.element"),F=Symbol.for("react.portal"),u=Symbol.for("react.fragment"),d=Symbol.for("react.strict_mode"),j=Symbol.for("react.profiler"),N=Symbol.for("react.consumer"),D=Symbol.for("react.context"),v=Symbol.for("react.forward_ref"),S=Symbol.for("react.suspense"),I=Symbol.for("react.suspense_list"),o=Symbol.for("react.memo"),z=Symbol.for("react.lazy"),ie=Symbol.for("react.activity"),ce=Symbol.for("react.client.reference"),M=i.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,G=Object.prototype.hasOwnProperty,ue=Array.isArray,Y=console.createTask?console.createTask:function(){return null};i={react_stack_bottom_frame:function(e){return e()}};var B,Q={},X=i.react_stack_bottom_frame.bind(i,c)(),H=Y(s(c)),Z={};O.Fragment=u,O.jsx=function(e,t,f,p,R){var g=1e4>M.recentlyCreatedOwnerStacks++;return _(e,t,f,!1,p,R,g?Error("react-stack-top-frame"):X,g?Y(s(e)):H)},O.jsxs=function(e,t,f,p,R){var g=1e4>M.recentlyCreatedOwnerStacks++;return _(e,t,f,!0,p,R,g?Error("react-stack-top-frame"):X,g?Y(s(e)):H)}})()),O}var U;function re(){return U||(U=1,process.env.NODE_ENV==="production"?x.exports=K():x.exports=ee()),x.exports}var te=re();const ne=({formConfig:l,formPageUrl:r,formId:n,scale:s=100,instanceId:a,onFormEvent:c})=>{const b=!!(l&&r),h=n??l?.formId??a??"preview",y=m.useRef(null),E=m.useRef(null),_=m.useRef(!1),T=m.useRef(()=>{}),i=m.useRef({});m.useEffect(()=>{if(!c)return;c({onSubmit:d=>{i.current.onSubmit=d},onShow:d=>{i.current.onShow=d},onClose:d=>{i.current.onClose=d},onSectionChange:d=>{i.current.onSectionChange=d},onQuestionAnswered:d=>{i.current.onQuestionAnswered=d},onError:d=>{i.current.onError=d}})},[c]);const P=m.useCallback(()=>{if(!E.current?.contentWindow||!l)return;const u={formId:h,scale:s,...l};E.current.contentWindow.postMessage({type:"sdk:formConfig",data:u},"*")},[l,h,s]);T.current=P,m.useEffect(()=>{!b||!_.current||T.current()},[b,l,P]);const F=m.useCallback(u=>{u.style.border="none",u.style.width="100%",u.style.height="100%"},[]);return m.useEffect(()=>{if(!b||!y.current||!l||!r)return;const u=document.createElement("div");u.className="encatch-preview-inner",u.style.width="100%",u.style.height="100%",u.style.display="flex",u.style.flexDirection="column",u.style.justifyContent="flex-end",u.style.overflow="auto";const d=document.createElement("iframe"),j=new URL(r,window.location.origin);j.searchParams.set("formId",h),d.src=j.toString(),d.title="Encatch form",F(d),E.current=d,u.appendChild(d),y.current.appendChild(u);const N=D=>{const v=D.data;if(!v||typeof v!="object"||!v.type)return;let S=v.type,I=v.formId,o=v.data;switch(S.startsWith("encatch:")&&(S=S.replace("encatch:",""),I=v.payload?.feedbackConfigurationId,o=v.payload),S){case"form:resize":E.current&&o&&typeof o.height=="number"&&(E.current.style.height=`${o.height}px`);break;case"form:ready":_.current=!0,T.current();break;case"form:close":i.current.onClose?.({timestamp:Date.now()});break;case"form:complete":i.current.onClose?.({timestamp:Date.now()});break;case"form:submit":o&&i.current.onSubmit&&i.current.onSubmit({feedbackConfigurationId:o.feedbackConfigurationId,feedbackIdentifier:o.feedbackIdentifier,response:o.response,isPartialSubmit:o.isPartialSubmit,timestamp:Date.now()});break;case"form:show":o&&i.current.onShow&&i.current.onShow({feedbackConfigurationId:o.feedbackConfigurationId,feedbackIdentifier:o.feedbackIdentifier,timestamp:Date.now()});break;case"form:started":o&&i.current.onShow&&i.current.onShow({feedbackConfigurationId:o.feedbackConfigurationId,feedbackIdentifier:o.feedbackIdentifier,timestamp:Date.now()});break;case"form:section:change":o&&i.current.onSectionChange&&i.current.onSectionChange({feedbackConfigurationId:o.feedbackConfigurationId??I??"",sectionIndex:o.sectionIndex,sectionId:o.sectionId,timestamp:Date.now()});break;case"form:answered":o&&i.current.onQuestionAnswered&&i.current.onQuestionAnswered({feedbackConfigurationId:o.feedbackConfigurationId??I??"",questionId:o.questionId,questionType:o.questionType,answer:o.answer,timestamp:Date.now()});break;case"form:error":o&&i.current.onError&&i.current.onError({feedbackConfigurationId:o.feedbackConfigurationId??I??"",questionId:o.questionId,error:o.error??"Unknown error",timestamp:Date.now()});break}};return window.addEventListener("message",N),()=>{window.removeEventListener("message",N),_.current=!1,u.parentNode&&u.parentNode.removeChild(u),E.current=null}},[b,r,h]),te.jsx("div",{ref:y,title:"encatchPreview1",style:b?{width:"100%",height:"100%"}:void 0})};class oe extends EventTarget{subscriptions=new Map;targetOrigin="*";matchesFilter(r,n){return!n||n==="*"||n===null||n===void 0?!0:typeof n=="string"?r===n:Array.isArray(n)?n.includes(r||""):typeof n=="function"?n(r||""):!1}getFormIdFromPayload(r){return r?.feedbackConfigurationId}publish(r,n,s){typeof window<"u"&&window.dispatchEvent(new CustomEvent(r,{detail:n,bubbles:!0})),s?.usePostMessage!==!1&&this.sendPostMessage(r,n)}subscribe(r,n,s){const a=Symbol("subscription"),c={eventType:r,handler:n,filter:s?.formId,id:a,once:s?.once};this.subscriptions.has(r)||this.subscriptions.set(r,[]),this.subscriptions.get(r).push(c);const b=h=>{const y=h,E=this.getFormIdFromPayload(y.detail);this.matchesFilter(E,s?.formId)&&(n(y.detail),s?.once&&typeof window<"u"&&window.removeEventListener(r,b))};return typeof window<"u"&&window.addEventListener(r,b),()=>{this.unsubscribe(a),typeof window<"u"&&window.removeEventListener(r,b)}}unsubscribe(r){for(const[n,s]of this.subscriptions.entries()){const a=s.findIndex(c=>c.id===r);if(a!==-1){s.splice(a,1),s.length===0&&this.subscriptions.delete(n);break}}}subscribeAll(r,n){const s=["form:show","form:started","form:submit","form:close","form:section:change","form:answered","form:error"],a=[];return s.forEach(c=>{const b=this.subscribe(c,h=>r(c,h),n);a.push(b)}),()=>{a.forEach(c=>c())}}getSubscriptionCount(r){return r?this.subscriptions.get(r)?.length||0:Array.from(this.subscriptions.values()).reduce((n,s)=>n+s.length,0)}clearSubscriptions(r){r?this.subscriptions.delete(r):this.subscriptions.clear()}sendPostMessage(r,n){const s={type:`encatch:${r}`,payload:n,source:"encatch-form-engine"};window.parent&&window.parent!==window&&window.parent.postMessage(s,this.targetOrigin),document.querySelectorAll("iframe").forEach(a=>{a.contentWindow&&a.contentWindow.postMessage(s,this.targetOrigin)}),typeof window.ReactNativeWebView<"u"&&window.ReactNativeWebView.postMessage(JSON.stringify({action:r.replace("form:",""),data:JSON.stringify(n)}))}}const V=new oe;function se(l,r,n){m.useEffect(()=>V.subscribe(l,r,n),[l,n?.formId,r])}function ae(l,r){m.useEffect(()=>V.subscribeAll(l,r),[r?.formId,l])}k.EncatchPreview=ne,k.useEncatchFormEvent=se,k.useEncatchFormEventAll=ae,Object.defineProperty(k,Symbol.toStringTag,{value:"Module"})}));
|
package/dist/types.d.ts
CHANGED
|
@@ -15,6 +15,8 @@ export interface EncatchFormConfig {
|
|
|
15
15
|
isFixed?: boolean;
|
|
16
16
|
}>;
|
|
17
17
|
translations?: Record<string, unknown>;
|
|
18
|
+
/** Initial locale for preview (e.g. from admin language selector). If set, iframe applies it on sdk:formConfig. */
|
|
19
|
+
initialLocale?: string;
|
|
18
20
|
};
|
|
19
21
|
appearanceProperties?: {
|
|
20
22
|
themes?: {
|
|
@@ -28,10 +30,10 @@ export interface EncatchFormConfig {
|
|
|
28
30
|
featureSettings?: {
|
|
29
31
|
closeButton?: boolean;
|
|
30
32
|
shareableMode?: string;
|
|
33
|
+
/** URL to custom stylesheet (must end with .css). Overrides common.css classes. */
|
|
34
|
+
customCss?: string;
|
|
31
35
|
};
|
|
32
36
|
};
|
|
33
|
-
welcomeScreenProperties?: unknown;
|
|
34
|
-
endScreenProperties?: unknown;
|
|
35
37
|
otherConfigurationProperties?: unknown;
|
|
36
38
|
feedbackConfigurationId?: string;
|
|
37
39
|
feedbackIdentifier?: string;
|
|
@@ -59,7 +61,7 @@ export type OnSectionChangeCallback = (payload: FormEventPayload['form:section:c
|
|
|
59
61
|
/**
|
|
60
62
|
* Callback function for question answered events
|
|
61
63
|
*/
|
|
62
|
-
export type OnQuestionAnsweredCallback = (payload: FormEventPayload['form:
|
|
64
|
+
export type OnQuestionAnsweredCallback = (payload: FormEventPayload['form:answered']) => void;
|
|
63
65
|
/**
|
|
64
66
|
* Callback function for form error events
|
|
65
67
|
*/
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@encatch/ws-react",
|
|
3
|
-
"version": "0.0
|
|
3
|
+
"version": "0.1.0-beta.19",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "./dist/index.umd.js",
|
|
6
6
|
"module": "./dist/index.es.js",
|
|
@@ -20,8 +20,8 @@
|
|
|
20
20
|
"react-dom": "^19.1.1"
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
|
-
"@encatch/schema": "1.0.
|
|
24
|
-
"@encatch/event-publisher": "1.0.0-beta.
|
|
23
|
+
"@encatch/schema": "1.1.0-beta.8",
|
|
24
|
+
"@encatch/event-publisher": "1.0.0-beta.4"
|
|
25
25
|
},
|
|
26
26
|
"devDependencies": {
|
|
27
27
|
"@eslint/js": "^9.36.0",
|