@inploi/plugin-chatbot 3.28.7 → 3.30.0

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.
@@ -1,4886 +0,0 @@
1
- import { g as get$1, i as isString$2, k as kbToReadableSize, a as getHeadOrThrow, b as invariant, A as AbortedError, c as getFlowSubmissionsPayload, N, _, d as getDefaultExportFromCjs, h, e as _$1, p, F, o as o$1, f as clsx, y, s as store, j as a$2, l as k, m as k$1, n as getFormSubmitter, q as parse, r as picklist, t as isSubmissionOfType, C as Cn, u as parseAsync, V as ValiError, v as object, w as transform, x as cva, z as maxLength, B as minLength, D as record, E as boolean, G as number, H as minValue, I as maxValue, J as custom, K as string, L as regex, M as email, O as url, P as LoadingIndicator, Q as ERROR_MESSAGES } from "./index-12c8b547.js";
2
- import "@inploi/sdk";
3
- const isConditionMet = ({
4
- condition,
5
- context,
6
- submissions,
7
- ifBlock
8
- }) => {
9
- const [firstSegment, ...path] = condition.compareKey.split(".");
10
- if (!firstSegment)
11
- return false;
12
- const answer = getSubmissionValueToCheck({
13
- context,
14
- key: firstSegment,
15
- path,
16
- submissions
17
- });
18
- if (!answer)
19
- return false;
20
- switch (answer.type) {
21
- case "address": {
22
- const value = get$1(answer.value, path.join("."));
23
- switch (condition.compare) {
24
- case "equals":
25
- return value === condition.compareValue;
26
- case "contains":
27
- if (!value)
28
- return false;
29
- return value.includes(condition.compareValue);
30
- case "notEquals":
31
- return value !== condition.compareValue;
32
- case "notContains":
33
- if (!value)
34
- return true;
35
- return !value.includes(condition.compareValue);
36
- }
37
- break;
38
- }
39
- case "integration": {
40
- if (typeof answer.value !== "object")
41
- return false;
42
- if (Array.isArray(answer.value))
43
- return false;
44
- const value = get$1(answer.value, path.join("."));
45
- const newIfBlock = {
46
- ...ifBlock,
47
- data: {
48
- ...ifBlock.data,
49
- compareKey: "_temp"
50
- }
51
- };
52
- switch (typeof value) {
53
- case "boolean":
54
- return isIfBlockConditionMet(newIfBlock, {
55
- submissions: {
56
- ["_temp"]: {
57
- value,
58
- type: "boolean"
59
- }
60
- },
61
- context
62
- });
63
- case "string":
64
- return isIfBlockConditionMet(newIfBlock, {
65
- submissions: {
66
- ["_temp"]: {
67
- value,
68
- type: "string"
69
- }
70
- },
71
- context
72
- });
73
- case "number":
74
- return isIfBlockConditionMet(newIfBlock, {
75
- submissions: {
76
- ["_temp"]: {
77
- value,
78
- type: "number"
79
- }
80
- },
81
- context
82
- });
83
- case "object":
84
- if (Array.isArray(value) && value.every(isString$2)) {
85
- return isIfBlockConditionMet(newIfBlock, {
86
- submissions: {
87
- ["_temp"]: {
88
- value,
89
- type: "enum"
90
- }
91
- },
92
- context
93
- });
94
- }
95
- return false;
96
- }
97
- break;
98
- }
99
- case "boolean": {
100
- const compareBoolean = condition.compareValue === "true";
101
- switch (condition.compare) {
102
- case "equals":
103
- return answer.value === compareBoolean;
104
- case "notEquals":
105
- return answer.value !== compareBoolean;
106
- }
107
- break;
108
- }
109
- case "string":
110
- switch (condition.compare) {
111
- case "equals":
112
- return answer.value === condition.compareValue;
113
- case "contains":
114
- if (!answer.value)
115
- return false;
116
- return answer.value.includes(condition.compareValue);
117
- case "notEquals":
118
- return answer.value !== condition.compareValue;
119
- case "notContains":
120
- if (!answer.value)
121
- return true;
122
- return !answer.value.includes(condition.compareValue);
123
- }
124
- break;
125
- case "number": {
126
- try {
127
- const compareNumber = Number(condition.compareValue);
128
- switch (condition.compare) {
129
- case "equals":
130
- return answer.value === compareNumber;
131
- case "notEquals":
132
- return answer.value !== compareNumber;
133
- case "greaterThan":
134
- return answer.value > compareNumber;
135
- case "greaterThanOrEqualTo":
136
- return answer.value >= compareNumber;
137
- case "lessThan":
138
- return answer.value < compareNumber;
139
- case "lessThanOrEqualTo":
140
- return answer.value <= compareNumber;
141
- }
142
- } catch {
143
- console.error(`Failed to parse number in if-block ${ifBlock.id}`, answer.value);
144
- return false;
145
- }
146
- break;
147
- }
148
- case "enum":
149
- switch (condition.compare) {
150
- case "equals":
151
- return answer.value.length === 1 && answer.value[0] === condition.compareValue;
152
- case "notEquals":
153
- return answer.value.length === 1 && answer.value[0] !== condition.compareValue;
154
- case "contains":
155
- return answer.value.includes(condition.compareValue);
156
- case "notContains":
157
- return !answer.value.includes(condition.compareValue);
158
- }
159
- break;
160
- }
161
- };
162
- const isIfBlockConditionMet = (ifBlock, {
163
- context,
164
- submissions
165
- }) => {
166
- const conditions = "combinator" in ifBlock.data ? ifBlock.data.conditions : [ifBlock.data];
167
- const combinator = "combinator" in ifBlock.data ? ifBlock.data.combinator : "and";
168
- for (const condition of conditions) {
169
- const isMet = isConditionMet({
170
- condition,
171
- context,
172
- submissions,
173
- ifBlock
174
- });
175
- if (combinator === "or" && isMet)
176
- return true;
177
- if (combinator === "and" && !isMet)
178
- return false;
179
- }
180
- return true;
181
- };
182
- const HANDLEBARS_REGEXP = /{{\s*([^}]+?)\s*(?:\|\s*([^}]+?)\s*)?}}/g;
183
- const interpolateWithData = (str, {
184
- context,
185
- submissions
186
- }) => {
187
- return str.replace(HANDLEBARS_REGEXP, (_2, key, defaultValue = "") => {
188
- const [firstSegment, ...path] = key.trim().split(".");
189
- const entity = getSubmissionValueToCheck({
190
- key: firstSegment,
191
- path,
192
- submissions,
193
- context
194
- });
195
- if (!entity)
196
- return defaultValue;
197
- switch (entity.type) {
198
- case "boolean":
199
- return entity.value === true ? "true" : "false";
200
- case "file":
201
- return entity.value.map((file) => `${file.name} (${kbToReadableSize(file.sizeKb)})`).join(", ");
202
- case "enum":
203
- return entity.value.join(", ");
204
- case "address":
205
- return Object.values(entity.value).filter((line) => line && line.trim().length > 0).join(", ");
206
- case "number":
207
- case "string":
208
- if (!entity.value)
209
- return defaultValue;
210
- return entity.value.toString();
211
- case "integration": {
212
- if (typeof entity.value !== "object")
213
- break;
214
- if (Array.isArray(entity.value))
215
- break;
216
- const value = get$1(entity.value, path.join("."));
217
- switch (typeof value) {
218
- case "boolean":
219
- return value === true ? "true" : "false";
220
- case "string":
221
- return value;
222
- case "number":
223
- return value.toString();
224
- case "object":
225
- if (Array.isArray(value) && value.every(isString$2)) {
226
- return value.join(", ");
227
- }
228
- }
229
- break;
230
- }
231
- }
232
- return defaultValue;
233
- });
234
- };
235
- const followNodes = ({
236
- node,
237
- nodes,
238
- stopWhen
239
- }) => {
240
- if ((stopWhen == null ? void 0 : stopWhen(node)) === true)
241
- return node;
242
- const nextNode = node.nextId ? nodes.find((n2) => n2.id === node.nextId) : void 0;
243
- if (!nextNode)
244
- return;
245
- return followNodes({
246
- node: nextNode,
247
- nodes,
248
- stopWhen
249
- });
250
- };
251
- const fallthroughBranch = ({
252
- childNode,
253
- nodes
254
- }) => {
255
- const branches = nodes.filter((node) => node.type === "if-block");
256
- const branch = branches.find((branchNode) => {
257
- if (!branchNode.branchId)
258
- return false;
259
- const nodeToFollow = nodes.find((n2) => n2.id === branchNode.branchId);
260
- if (!nodeToFollow)
261
- return false;
262
- const node = followNodes({
263
- node: nodeToFollow,
264
- nodes,
265
- stopWhen: (n2) => n2.id === childNode.id
266
- });
267
- if (!node || node.id !== childNode.id)
268
- return false;
269
- return true;
270
- });
271
- if (!(branch == null ? void 0 : branch.nextId))
272
- return;
273
- return nodes.find((n2) => n2.id === branch.nextId);
274
- };
275
- const createFlowInterpreter = ({
276
- flow,
277
- analytics,
278
- logger,
279
- context,
280
- apiClient,
281
- getSubmissions,
282
- chatService,
283
- onFlowEnd,
284
- onInterpret
285
- }) => {
286
- let controller = new AbortController();
287
- const analyticsWithCustomProperties = {
288
- ...analytics.service,
289
- log: (params) => analytics.service.log({
290
- ...params,
291
- customProperties: {
292
- ...params.customProperties,
293
- ...analytics.customProperties
294
- }
295
- })
296
- };
297
- const interpretNode = async (node, prevNode) => {
298
- const submissions = getSubmissions();
299
- onInterpret == null ? void 0 : onInterpret(node, prevNode);
300
- try {
301
- await interpret({
302
- flow,
303
- analytics: analyticsWithCustomProperties,
304
- logger,
305
- apiClient,
306
- context,
307
- node,
308
- submissions,
309
- chat: {
310
- sendMessage: async (message) => chatService.send({
311
- groupId: node.id,
312
- message,
313
- signal: controller.signal
314
- }),
315
- userInput: async (input) => chatService.input({
316
- input,
317
- signal: controller.signal
318
- }),
319
- addToSubmissions: chatService.addToSubmissions
320
- },
321
- next: (nodeId) => {
322
- const nextNode = nodeId ? flow.nodes.find((node2) => node2.id === nodeId) : fallthroughBranch({
323
- childNode: node,
324
- nodes: flow.nodes
325
- });
326
- if (!nextNode)
327
- return onFlowEnd == null ? void 0 : onFlowEnd(node);
328
- return interpretNode(nextNode, node);
329
- },
330
- end: () => onFlowEnd == null ? void 0 : onFlowEnd(node)
331
- });
332
- } catch (e) {
333
- if (e instanceof AbortedError)
334
- return;
335
- throw e;
336
- }
337
- };
338
- return {
339
- interpret: async (startFromNodeId) => {
340
- const startNode = flow.nodes.find((node) => node.id === startFromNodeId) ?? getHeadOrThrow(flow.nodes);
341
- return interpretNode(startNode);
342
- },
343
- undo: (nodeHistory) => {
344
- let removed = 1;
345
- const formerLastNode = flow.nodes.find((n2) => n2.id === nodeHistory[nodeHistory.length - 1]);
346
- for (let i2 = nodeHistory.length - 2; i2 > 0; i2--) {
347
- const nodeId = nodeHistory[i2];
348
- const node = flow.nodes.find((n2) => n2.id === nodeId);
349
- if (!node)
350
- break;
351
- removed++;
352
- if (node.type.startsWith("question-"))
353
- break;
354
- }
355
- controller.abort();
356
- controller = new AbortController();
357
- const newStartNode = flow.nodes.find((node) => node.id === nodeHistory[nodeHistory.length - removed]);
358
- invariant(newStartNode, "Undo failed: new start node not found");
359
- interpretNode(newStartNode, formerLastNode);
360
- return {
361
- removed
362
- };
363
- },
364
- abort: () => {
365
- controller.abort();
366
- }
367
- };
368
- };
369
- async function interpret(params) {
370
- const node = params.node;
371
- switch (node.type) {
372
- case "text":
373
- return interpretTextNode({
374
- ...params,
375
- node
376
- });
377
- case "image":
378
- return interpretImageNode({
379
- ...params,
380
- node
381
- });
382
- case "question-text":
383
- return interpretQuestionTextNode({
384
- ...params,
385
- node
386
- });
387
- case "question-enum":
388
- return interpretQuestionEnumNode({
389
- ...params,
390
- node
391
- });
392
- case "question-number":
393
- return interpretQuestionNumberNode({
394
- ...params,
395
- node
396
- });
397
- case "question-boolean":
398
- return interpretQuestionBooleanNode({
399
- ...params,
400
- node
401
- });
402
- case "question-file":
403
- return interpretQuestionFileNode({
404
- ...params,
405
- node
406
- });
407
- case "question-address":
408
- return interpretQuestionAddressNode({
409
- ...params,
410
- node
411
- });
412
- case "end-flow":
413
- return interpretEndFlowNode({
414
- ...params,
415
- node
416
- });
417
- case "if-block":
418
- return interpretIfBlockNode({
419
- ...params,
420
- node
421
- });
422
- case "jump":
423
- return interpretJumpNode({
424
- ...params,
425
- node
426
- });
427
- case "link":
428
- return interpretLinkNode({
429
- ...params,
430
- node
431
- });
432
- case "integration-application-submit":
433
- return interpretSubmitNode({
434
- ...params,
435
- node
436
- });
437
- case "add-submission":
438
- return interpretAddSubmissionNode({
439
- ...params,
440
- node
441
- });
442
- case "integration-workflow-get":
443
- throw Error("Workflow should be unreachable");
444
- case "identify":
445
- return interpretIdentifyNode({
446
- ...params,
447
- node
448
- });
449
- default:
450
- throw new Error(`Unknown node: ${JSON.stringify(node)}`);
451
- }
452
- }
453
- const getSubmissionValue = (submissions, key) => {
454
- var _a;
455
- const value = (_a = submissions[key]) == null ? void 0 : _a.value;
456
- if (typeof value !== "string" && typeof value !== "number")
457
- throw new Error(`Submission at “${key}” is not a string or number`);
458
- return value;
459
- };
460
- async function interpretIdentifyNode({
461
- next,
462
- node,
463
- analytics,
464
- submissions,
465
- logger
466
- }) {
467
- if (!submissions)
468
- return next(node.nextId);
469
- try {
470
- analytics.log({
471
- event: "IDENTIFY",
472
- properties: {
473
- identifier: getSubmissionValue(submissions, node.data.key).toString(),
474
- first_name: node.data.firstName ? getSubmissionValue(submissions, node.data.firstName).toString() : void 0,
475
- last_name: node.data.lastName ? getSubmissionValue(submissions, node.data.lastName).toString() : void 0,
476
- email: node.data.email ? getSubmissionValue(submissions, node.data.email).toString() : void 0,
477
- phone_number: node.data.phoneNumber ? getSubmissionValue(submissions, node.data.phoneNumber).toString() : void 0,
478
- custom_traits: node.data.customTraits ? Object.fromEntries(node.data.customTraits.map(({
479
- key,
480
- value
481
- }) => {
482
- var _a;
483
- return [key, (_a = submissions[value]) == null ? void 0 : _a.value];
484
- })) : void 0
485
- }
486
- });
487
- } catch (e) {
488
- logger.error(e);
489
- } finally {
490
- next(node.nextId);
491
- }
492
- }
493
- async function interpretJumpNode({
494
- next,
495
- node
496
- }) {
497
- next(node.data.targetId);
498
- }
499
- async function interpretAddSubmissionNode({
500
- next,
501
- node,
502
- logger,
503
- submissions,
504
- context
505
- }) {
506
- if (!submissions) {
507
- logger.error("Submissions not found");
508
- return;
509
- }
510
- submissions[node.data.key] = {
511
- type: "string",
512
- value: interpolateWithData(node.data.value, {
513
- submissions,
514
- context
515
- })
516
- };
517
- next(node.nextId);
518
- }
519
- async function interpretSubmitNode({
520
- chat,
521
- next,
522
- node,
523
- logger,
524
- apiClient,
525
- submissions,
526
- analytics,
527
- flow
528
- }) {
529
- const submit = async (skipConfirmation) => {
530
- if (skipConfirmation !== true) {
531
- await chat.userInput({
532
- type: "submit",
533
- key: void 0,
534
- config: {
535
- label: node.data.submitLabel
536
- }
537
- });
538
- }
539
- await chat.sendMessage({
540
- type: "loading"
541
- });
542
- const {
543
- anonymous_id,
544
- session_id
545
- } = analytics.getSessionInfo();
546
- const response = await apiClient.fetch(`/flow/submit`, {
547
- method: "POST",
548
- body: JSON.stringify({
549
- log_submit: false,
550
- integration_id: node.data.integrationId,
551
- anonymous_id,
552
- session_id,
553
- job: flow.job,
554
- submissions: getFlowSubmissionsPayload(submissions || {})
555
- })
556
- }).catch((e) => e);
557
- if (node.data.key)
558
- chat.addToSubmissions(node.data.key, {
559
- type: "integration",
560
- value: response
561
- });
562
- N(response).with({
563
- integration_response: _.select(_.union({
564
- service: _.optional(_.string),
565
- status: _.number,
566
- data: _.any
567
- }, {
568
- service: _.optional(_.string),
569
- status: _.number,
570
- error: {
571
- message: _.string,
572
- data: _.any
573
- }
574
- }))
575
- }, (integrationResponse) => {
576
- analytics.log({
577
- event: "FLOW_SUBMIT",
578
- properties: {
579
- flow_id: flow.id,
580
- flow_version: flow.version,
581
- flow_session_id: flow.data.flowSessionId,
582
- flow_build: flow.build,
583
- service: integrationResponse.service ?? "INVALID_SERVICE",
584
- response: {
585
- status: integrationResponse.status,
586
- payload: "data" in integrationResponse ? integrationResponse.data : integrationResponse.error.data ?? null
587
- },
588
- job: flow.job
589
- }
590
- });
591
- }).otherwise(() => {
592
- });
593
- await N(response).with(_.union({
594
- ats_data: _.select("redirect", {
595
- redirect_url: _.string,
596
- message: _.optional(_.union(_.string, _.nullish)),
597
- button_text: _.optional(_.union(_.string, _.nullish))
598
- })
599
- }, {
600
- integration_response: {
601
- data: _.select("redirect", {
602
- redirect_url: _.string,
603
- message: _.optional(_.union(_.string, _.nullish)),
604
- button_text: _.optional(_.union(_.string, _.nullish))
605
- })
606
- }
607
- }), async (response2) => {
608
- if (response2.redirect === void 0)
609
- return;
610
- await chat.sendMessage({
611
- type: "text",
612
- author: "bot",
613
- text: response2.redirect.message ?? "Almost there! Please complete your submission here:"
614
- });
615
- try {
616
- const href = new URL(response2.redirect.redirect_url);
617
- if (anonymous_id && !href.searchParams.has("anonymous_id")) {
618
- href.searchParams.set("anonymous_id", anonymous_id);
619
- }
620
- await chat.sendMessage({
621
- type: "link",
622
- href: href.toString(),
623
- text: response2.redirect.button_text ?? "Complete submission",
624
- onClick: () => {
625
- if (!session_id) {
626
- logger.error("session_id not set, cannot log FLOW_REDIRECT event");
627
- return;
628
- }
629
- analytics.log({
630
- event: "FLOW_REDIRECT",
631
- properties: {
632
- flow_build: flow.build,
633
- flow_id: flow.id,
634
- flow_session_id: session_id,
635
- flow_version: flow.version,
636
- href: href.toString(),
637
- job: flow.job
638
- }
639
- });
640
- }
641
- });
642
- } catch (e) {
643
- logger.error(`Invalid redirect URL: ${response2.redirect.redirect_url}`, e);
644
- chat.sendMessage({
645
- type: "system",
646
- variant: "error",
647
- text: "Couldn’t get the redirect URL."
648
- });
649
- }
650
- next(node.nextId);
651
- }).with({
652
- success: true
653
- }, async () => {
654
- if (node.data.skipConfirmation !== true) {
655
- await chat.sendMessage({
656
- type: "system",
657
- variant: "success",
658
- text: "Submission completed!"
659
- });
660
- }
661
- next(node.nextId);
662
- }).with(_.union({
663
- success: false,
664
- ats_data: _.select("error", {
665
- message: _.string
666
- })
667
- }, {
668
- integration_response: {
669
- error: _.select("error", {
670
- message: _.string
671
- })
672
- }
673
- }), async (response2) => {
674
- var _a;
675
- logger.error(response2.error);
676
- await chat.sendMessage({
677
- type: "system",
678
- variant: "error",
679
- text: ((_a = response2.error) == null ? void 0 : _a.message) || "Failed to submit"
680
- });
681
- await submit(false);
682
- }).otherwise(async (response2) => {
683
- logger.error(response2);
684
- await chat.sendMessage({
685
- type: "system",
686
- variant: "error",
687
- text: "Failed to submit"
688
- });
689
- await submit(false);
690
- });
691
- };
692
- await submit(node.data.skipConfirmation);
693
- }
694
- async function interpretLinkNode({
695
- chat,
696
- next,
697
- node,
698
- submissions,
699
- context
700
- }) {
701
- await chat.sendMessage({
702
- type: "link",
703
- href: interpolateWithData(node.data.href, {
704
- submissions,
705
- context
706
- }),
707
- text: interpolateWithData(node.data.cta, {
708
- submissions,
709
- context
710
- })
711
- });
712
- next(node.nextId);
713
- }
714
- async function interpretIfBlockNode({
715
- submissions,
716
- next,
717
- node,
718
- context
719
- }) {
720
- next(isIfBlockConditionMet(node, {
721
- submissions,
722
- context
723
- }) ? node.branchId : node.nextId);
724
- }
725
- async function interpretTextNode({
726
- chat,
727
- next,
728
- node,
729
- submissions,
730
- context
731
- }) {
732
- await chat.sendMessage({
733
- author: "bot",
734
- type: "text",
735
- text: interpolateWithData(node.data.text, {
736
- submissions,
737
- context
738
- })
739
- });
740
- next(node.nextId);
741
- }
742
- async function interpretImageNode({
743
- chat,
744
- next,
745
- node
746
- }) {
747
- await chat.sendMessage({
748
- author: "bot",
749
- type: "image",
750
- url: node.data.url,
751
- height: node.data.height,
752
- width: node.data.width
753
- });
754
- next(node.nextId);
755
- }
756
- async function interpretQuestionTextNode({
757
- chat,
758
- next,
759
- node,
760
- submissions,
761
- context
762
- }) {
763
- await chat.sendMessage({
764
- author: "bot",
765
- type: "text",
766
- text: interpolateWithData(node.data.question, {
767
- submissions,
768
- context
769
- })
770
- });
771
- const reply = node.data.format === "phone" ? await chat.userInput({
772
- key: node.data.key,
773
- type: "phone",
774
- config: {
775
- optional: node.data.optional,
776
- placeholder: node.data.placeholder,
777
- maxChars: node.data.maxChars,
778
- minChars: node.data.minChars
779
- }
780
- }) : await chat.userInput({
781
- key: node.data.key,
782
- type: "text",
783
- config: {
784
- optional: node.data.optional,
785
- placeholder: node.data.placeholder,
786
- format: node.data.format,
787
- maxChars: node.data.maxChars,
788
- minChars: node.data.minChars
789
- }
790
- });
791
- if (reply === null) {
792
- await chat.sendMessage({
793
- type: "system",
794
- variant: "info",
795
- text: "Skipped"
796
- });
797
- } else {
798
- await chat.sendMessage({
799
- author: "user",
800
- type: "text",
801
- text: reply.value
802
- });
803
- }
804
- next(node.nextId);
805
- }
806
- async function interpretQuestionNumberNode({
807
- chat,
808
- next,
809
- node,
810
- submissions,
811
- context
812
- }) {
813
- await chat.sendMessage({
814
- author: "bot",
815
- type: "text",
816
- text: interpolateWithData(node.data.question, {
817
- submissions,
818
- context
819
- })
820
- });
821
- const reply = await chat.userInput({
822
- key: node.data.key,
823
- type: "number",
824
- config: {
825
- max: node.data.max,
826
- min: node.data.min,
827
- optional: node.data.optional,
828
- placeholder: node.data.placeholder,
829
- decimalCases: node.data.decimalCases
830
- }
831
- });
832
- if (reply === null) {
833
- await chat.sendMessage({
834
- type: "system",
835
- variant: "info",
836
- text: "Skipped"
837
- });
838
- } else {
839
- await chat.sendMessage({
840
- author: "user",
841
- type: "text",
842
- text: reply.value.toString()
843
- });
844
- }
845
- next(node.nextId);
846
- }
847
- async function interpretQuestionEnumNode({
848
- chat,
849
- next,
850
- node,
851
- submissions,
852
- context
853
- }) {
854
- await chat.sendMessage({
855
- author: "bot",
856
- type: "text",
857
- text: interpolateWithData(node.data.question, {
858
- submissions,
859
- context
860
- })
861
- });
862
- const reply = await chat.userInput({
863
- key: node.data.key,
864
- type: "multiple-choice",
865
- config: node.data
866
- });
867
- if (reply.value.length === 0) {
868
- await chat.sendMessage({
869
- type: "system",
870
- variant: "info",
871
- text: "Skipped"
872
- });
873
- } else {
874
- await chat.sendMessage({
875
- author: "user",
876
- type: "text",
877
- text: node.data.options.filter((o2) => reply.value.includes(o2.value)).map((o2) => o2.label).join(", ")
878
- });
879
- }
880
- next(node.nextId);
881
- }
882
- async function interpretQuestionBooleanNode({
883
- chat,
884
- next,
885
- node,
886
- submissions,
887
- context
888
- }) {
889
- await chat.sendMessage({
890
- author: "bot",
891
- type: "text",
892
- text: interpolateWithData(node.data.question, {
893
- submissions,
894
- context
895
- })
896
- });
897
- const reply = await chat.userInput({
898
- key: node.data.key,
899
- type: "boolean",
900
- config: {
901
- optional: node.data.optional,
902
- labels: {
903
- true: node.data.trueLabel,
904
- false: node.data.falseLabel
905
- }
906
- }
907
- });
908
- if (reply === null) {
909
- await chat.sendMessage({
910
- type: "system",
911
- variant: "info",
912
- text: "Skipped"
913
- });
914
- } else {
915
- await chat.sendMessage({
916
- author: "user",
917
- type: "text",
918
- text: reply.value === true ? node.data.trueLabel : node.data.falseLabel
919
- });
920
- }
921
- next(node.nextId);
922
- }
923
- async function interpretQuestionAddressNode({
924
- chat,
925
- next,
926
- node
927
- }) {
928
- await chat.sendMessage({
929
- author: "bot",
930
- type: "text",
931
- text: node.data.question
932
- });
933
- const response = await chat.userInput({
934
- type: "address",
935
- key: node.data.key,
936
- config: {
937
- optional: node.data.optional,
938
- keys: node.data.keys,
939
- placeholder: node.data.placeholder
940
- }
941
- });
942
- if (response === null) {
943
- await chat.sendMessage({
944
- type: "system",
945
- variant: "info",
946
- text: "Skipped"
947
- });
948
- } else {
949
- const addressMessage = Object.values(response.value).filter((line) => line && line.trim().length > 0).join(", ");
950
- await chat.sendMessage({
951
- author: "user",
952
- type: "text",
953
- text: addressMessage
954
- });
955
- }
956
- return next(node.nextId);
957
- }
958
- async function interpretQuestionFileNode({
959
- node,
960
- chat,
961
- next,
962
- submissions,
963
- context
964
- }) {
965
- await chat.sendMessage({
966
- author: "bot",
967
- type: "text",
968
- text: interpolateWithData(node.data.question, {
969
- submissions,
970
- context
971
- })
972
- });
973
- const files = await chat.userInput({
974
- key: node.data.key,
975
- type: "file",
976
- config: {
977
- optional: node.data.optional,
978
- extensions: node.data.extensions,
979
- // default value for fileSizeLimitKib is 10MB
980
- fileSizeLimitKib: node.data.maxSizeKb ?? 10 * 1024,
981
- allowMultiple: node.data.multiple === true
982
- }
983
- });
984
- if (files === null) {
985
- await chat.sendMessage({
986
- type: "system",
987
- variant: "info",
988
- text: "Skipped"
989
- });
990
- } else {
991
- for (const file of files.value) {
992
- await chat.sendMessage({
993
- author: "user",
994
- type: "file",
995
- fileName: file.name,
996
- fileSizeKb: file.sizeKb
997
- });
998
- }
999
- }
1000
- next(node.nextId);
1001
- }
1002
- async function interpretEndFlowNode({
1003
- chat,
1004
- end,
1005
- node
1006
- }) {
1007
- await chat.sendMessage({
1008
- type: "system",
1009
- variant: "info",
1010
- text: node.data.systemMessage
1011
- });
1012
- end();
1013
- }
1014
- const getSubmissionValueToCheck = ({
1015
- key,
1016
- path,
1017
- submissions,
1018
- context
1019
- }) => {
1020
- if (key === "$context") {
1021
- if (!path)
1022
- return void 0;
1023
- const contextData = get$1(context, path.join("."));
1024
- switch (typeof contextData) {
1025
- case "string":
1026
- return {
1027
- type: "string",
1028
- value: contextData
1029
- };
1030
- case "number":
1031
- return {
1032
- type: "number",
1033
- value: contextData
1034
- };
1035
- case "boolean":
1036
- return {
1037
- type: "boolean",
1038
- value: contextData
1039
- };
1040
- default:
1041
- console.warn(`Unexpected type for $context.${path.join(".")}`, contextData);
1042
- return void 0;
1043
- }
1044
- }
1045
- return submissions == null ? void 0 : submissions[key];
1046
- };
1047
- function debounce(func, wait, immediate) {
1048
- var timeout, args, context, timestamp, result;
1049
- if (null == wait)
1050
- wait = 100;
1051
- function later() {
1052
- var last = Date.now() - timestamp;
1053
- if (last < wait && last >= 0) {
1054
- timeout = setTimeout(later, wait - last);
1055
- } else {
1056
- timeout = null;
1057
- if (!immediate) {
1058
- result = func.apply(context, args);
1059
- context = args = null;
1060
- }
1061
- }
1062
- }
1063
- var debounced = function() {
1064
- context = this;
1065
- args = arguments;
1066
- timestamp = Date.now();
1067
- var callNow = immediate && !timeout;
1068
- if (!timeout)
1069
- timeout = setTimeout(later, wait);
1070
- if (callNow) {
1071
- result = func.apply(context, args);
1072
- context = args = null;
1073
- }
1074
- return result;
1075
- };
1076
- debounced.clear = function() {
1077
- if (timeout) {
1078
- clearTimeout(timeout);
1079
- timeout = null;
1080
- }
1081
- };
1082
- debounced.flush = function() {
1083
- if (timeout) {
1084
- result = func.apply(context, args);
1085
- context = args = null;
1086
- clearTimeout(timeout);
1087
- timeout = null;
1088
- }
1089
- };
1090
- return debounced;
1091
- }
1092
- debounce.debounce = debounce;
1093
- var debounce_1 = debounce;
1094
- const createDebounce = /* @__PURE__ */ getDefaultExportFromCjs(debounce_1);
1095
- function useMeasure(_temp) {
1096
- let {
1097
- debounce: debounce2,
1098
- scroll,
1099
- polyfill,
1100
- offsetSize
1101
- } = _temp === void 0 ? {
1102
- debounce: 0,
1103
- scroll: false,
1104
- offsetSize: false
1105
- } : _temp;
1106
- const ResizeObserver = polyfill || (typeof window === "undefined" ? class ResizeObserver {
1107
- } : window.ResizeObserver);
1108
- if (!ResizeObserver) {
1109
- throw new Error("This browser does not support ResizeObserver out of the box. See: https://github.com/react-spring/react-use-measure/#resize-observer-polyfills");
1110
- }
1111
- const [bounds, set2] = h({
1112
- left: 0,
1113
- top: 0,
1114
- width: 0,
1115
- height: 0,
1116
- bottom: 0,
1117
- right: 0,
1118
- x: 0,
1119
- y: 0
1120
- });
1121
- const state = _$1({
1122
- element: null,
1123
- scrollContainers: null,
1124
- resizeObserver: null,
1125
- lastBounds: bounds
1126
- });
1127
- const scrollDebounce = debounce2 ? typeof debounce2 === "number" ? debounce2 : debounce2.scroll : null;
1128
- const resizeDebounce = debounce2 ? typeof debounce2 === "number" ? debounce2 : debounce2.resize : null;
1129
- const mounted = _$1(false);
1130
- p(() => {
1131
- mounted.current = true;
1132
- return () => void (mounted.current = false);
1133
- });
1134
- const [forceRefresh, resizeChange, scrollChange] = F(() => {
1135
- const callback = () => {
1136
- if (!state.current.element)
1137
- return;
1138
- const {
1139
- left,
1140
- top,
1141
- width,
1142
- height,
1143
- bottom,
1144
- right,
1145
- x,
1146
- y: y2
1147
- } = state.current.element.getBoundingClientRect();
1148
- const size = {
1149
- left,
1150
- top,
1151
- width,
1152
- height,
1153
- bottom,
1154
- right,
1155
- x,
1156
- y: y2
1157
- };
1158
- if (state.current.element instanceof HTMLElement && offsetSize) {
1159
- size.height = state.current.element.offsetHeight;
1160
- size.width = state.current.element.offsetWidth;
1161
- }
1162
- Object.freeze(size);
1163
- if (mounted.current && !areBoundsEqual(state.current.lastBounds, size))
1164
- set2(state.current.lastBounds = size);
1165
- };
1166
- return [callback, resizeDebounce ? createDebounce(callback, resizeDebounce) : callback, scrollDebounce ? createDebounce(callback, scrollDebounce) : callback];
1167
- }, [set2, offsetSize, scrollDebounce, resizeDebounce]);
1168
- function removeListeners() {
1169
- if (state.current.scrollContainers) {
1170
- state.current.scrollContainers.forEach((element) => element.removeEventListener("scroll", scrollChange, true));
1171
- state.current.scrollContainers = null;
1172
- }
1173
- if (state.current.resizeObserver) {
1174
- state.current.resizeObserver.disconnect();
1175
- state.current.resizeObserver = null;
1176
- }
1177
- }
1178
- function addListeners() {
1179
- if (!state.current.element)
1180
- return;
1181
- state.current.resizeObserver = new ResizeObserver(scrollChange);
1182
- state.current.resizeObserver.observe(state.current.element);
1183
- if (scroll && state.current.scrollContainers) {
1184
- state.current.scrollContainers.forEach((scrollContainer) => scrollContainer.addEventListener("scroll", scrollChange, {
1185
- capture: true,
1186
- passive: true
1187
- }));
1188
- }
1189
- }
1190
- const ref = (node) => {
1191
- if (!node || node === state.current.element)
1192
- return;
1193
- removeListeners();
1194
- state.current.element = node;
1195
- state.current.scrollContainers = findScrollContainers(node);
1196
- addListeners();
1197
- };
1198
- useOnWindowScroll(scrollChange, Boolean(scroll));
1199
- useOnWindowResize(resizeChange);
1200
- p(() => {
1201
- removeListeners();
1202
- addListeners();
1203
- }, [scroll, scrollChange, resizeChange]);
1204
- p(() => removeListeners, []);
1205
- return [ref, bounds, forceRefresh];
1206
- }
1207
- function useOnWindowResize(onWindowResize) {
1208
- p(() => {
1209
- const cb = onWindowResize;
1210
- window.addEventListener("resize", cb);
1211
- return () => void window.removeEventListener("resize", cb);
1212
- }, [onWindowResize]);
1213
- }
1214
- function useOnWindowScroll(onScroll, enabled) {
1215
- p(() => {
1216
- if (enabled) {
1217
- const cb = onScroll;
1218
- window.addEventListener("scroll", cb, {
1219
- capture: true,
1220
- passive: true
1221
- });
1222
- return () => void window.removeEventListener("scroll", cb, true);
1223
- }
1224
- }, [onScroll, enabled]);
1225
- }
1226
- function findScrollContainers(element) {
1227
- const result = [];
1228
- if (!element || element === document.body)
1229
- return result;
1230
- const {
1231
- overflow,
1232
- overflowX,
1233
- overflowY
1234
- } = window.getComputedStyle(element);
1235
- if ([overflow, overflowX, overflowY].some((prop) => prop === "auto" || prop === "scroll"))
1236
- result.push(element);
1237
- return [...result, ...findScrollContainers(element.parentElement)];
1238
- }
1239
- const keys = ["x", "y", "top", "bottom", "left", "right", "width", "height"];
1240
- const areBoundsEqual = (a2, b) => keys.every((key) => a2[key] === b[key]);
1241
- const SendButton = ({
1242
- class: className,
1243
- ...props
1244
- }) => o$1("button", {
1245
- class: clsx("bg-accent-9 active:bg-accent-10 pointer-coarse:touch-hitbox fr flex-shrink-0 rounded-full p-2 text-white transition-all disabled:cursor-not-allowed disabled:opacity-50", className),
1246
- type: "submit",
1247
- ...props,
1248
- children: o$1("svg", {
1249
- class: "block",
1250
- width: "16",
1251
- height: "16",
1252
- viewBox: "0 0 16 16",
1253
- fill: "transparent",
1254
- stroke: "currentColor",
1255
- "stroke-linecap": "round",
1256
- "stroke-width": "2",
1257
- children: [o$1("title", {
1258
- children: "Send"
1259
- }), o$1("path", {
1260
- d: "M3.5 7.5L8 3L12.5 7.5"
1261
- }), o$1("path", {
1262
- d: "M8 4V13"
1263
- })]
1264
- })
1265
- });
1266
- const TYPING_SPEED_MS_PER_CHARACTER = 25;
1267
- const scrollToEndFn$ = a$2({
1268
- instant: () => {
1269
- },
1270
- smooth: () => {
1271
- }
1272
- });
1273
- const chatStore = {
1274
- onSubmitSuccessFn$: a$2(() => {
1275
- }),
1276
- isBotTyping$: a$2(false),
1277
- scrollToEnd: {
1278
- instant: () => scrollToEndFn$.value.instant(),
1279
- smooth: () => scrollToEndFn$.value.smooth()
1280
- }
1281
- };
1282
- const useChatService = () => {
1283
- const chatRef = _$1(null);
1284
- y(() => {
1285
- scrollToEndFn$.value = {
1286
- instant: () => {
1287
- var _a;
1288
- return (_a = chatRef.current) == null ? void 0 : _a.scrollTo({
1289
- top: chatRef.current.scrollHeight,
1290
- behavior: "instant"
1291
- });
1292
- },
1293
- smooth: () => {
1294
- if (!chatRef.current)
1295
- return;
1296
- if (chatRef.current.scrollHeight - chatRef.current.scrollTop <= chatRef.current.clientHeight * 2) {
1297
- chatRef.current.scrollTo({
1298
- top: chatRef.current.scrollHeight,
1299
- behavior: "smooth"
1300
- });
1301
- }
1302
- }
1303
- };
1304
- }, [chatRef]);
1305
- const chatService = F(() => {
1306
- const inputFn = ({
1307
- input,
1308
- signal: signal2
1309
- }) => {
1310
- if (signal2 == null ? void 0 : signal2.aborted)
1311
- throw new AbortedError();
1312
- store.setInput(input);
1313
- return new Promise((resolve) => {
1314
- const submitFunction = (submission) => {
1315
- if (signal2 == null ? void 0 : signal2.aborted)
1316
- throw new AbortedError();
1317
- store.setInput(void 0);
1318
- if (input.key) {
1319
- store.setSubmission(input.key, submission);
1320
- }
1321
- resolve(submission);
1322
- };
1323
- chatStore.onSubmitSuccessFn$.value = submitFunction;
1324
- });
1325
- };
1326
- return {
1327
- addToSubmissions: (key, value) => store.setSubmission(key, value),
1328
- send: async ({
1329
- message,
1330
- signal: signal2,
1331
- groupId
1332
- }) => {
1333
- await N(message).with({
1334
- author: "bot",
1335
- type: "text"
1336
- }, async (message2) => {
1337
- if (signal2 == null ? void 0 : signal2.aborted)
1338
- throw new AbortedError();
1339
- chatStore.isBotTyping$.value = true;
1340
- const typingTime = Math.min(Math.max(20, message2.text.length), 100) * TYPING_SPEED_MS_PER_CHARACTER;
1341
- await new Promise((resolve) => {
1342
- return setTimeout(resolve, typingTime, {
1343
- signal: signal2
1344
- });
1345
- });
1346
- chatStore.isBotTyping$.value = false;
1347
- }).otherwise(async () => void 0);
1348
- if (signal2 == null ? void 0 : signal2.aborted)
1349
- throw new AbortedError();
1350
- store.addMessage(message, groupId);
1351
- },
1352
- input: inputFn
1353
- };
1354
- }, []);
1355
- return {
1356
- chatRef,
1357
- chatService
1358
- };
1359
- };
1360
- const SkipButton = ({
1361
- class: className,
1362
- ...props
1363
- }) => o$1("button", {
1364
- type: "button",
1365
- class: clsx("fr text-neutral-9 flex flex-shrink-0 items-center justify-center gap-1 rounded-full py-[6px] pl-2 pr-3 text-sm underline-offset-2 transition-all", className),
1366
- ...props,
1367
- children: [o$1("svg", {
1368
- class: "block",
1369
- width: "16",
1370
- height: "16",
1371
- viewBox: "0 0 16 16",
1372
- fill: "transparent",
1373
- stroke: "currentColor",
1374
- "stroke-linecap": "round",
1375
- "stroke-width": "1.5",
1376
- children: [o$1("title", {
1377
- children: "Skip"
1378
- }), o$1("path", {
1379
- d: "M3.25 11.25A5 5 0 0 1 12 7"
1380
- }), o$1("path", {
1381
- d: "M13.25 4.5V8.25H9.5"
1382
- })]
1383
- }), "Skip"]
1384
- });
1385
- const countries = {
1386
- Afghanistan: "93",
1387
- Albania: "355",
1388
- Algeria: "213",
1389
- "American Samoa": "1 684",
1390
- Andorra: "376",
1391
- Angola: "244",
1392
- Anguilla: "1 264",
1393
- Antarctica: "672",
1394
- "Antigua and Barbuda": "1 268",
1395
- Argentina: "54",
1396
- Armenia: "374",
1397
- Aruba: "297",
1398
- Australia: "61",
1399
- Austria: "43",
1400
- Azerbaijan: "994",
1401
- Bahrain: "973",
1402
- Bangladesh: "880",
1403
- Barbados: "1 246",
1404
- Belarus: "375",
1405
- Belgium: "32",
1406
- Belize: "501",
1407
- Benin: "229",
1408
- Bermuda: "1 441",
1409
- Bhutan: "975",
1410
- Bolivia: "591",
1411
- "Bosnia and Herzegovina": "387",
1412
- Botswana: "267",
1413
- "Bouvet Island": "47",
1414
- Brazil: "55",
1415
- "British Indian Ocean Territory": "246",
1416
- "British Virgin Islands": "1 284",
1417
- Brunei: "673",
1418
- Bulgaria: "359",
1419
- "Burkina Faso": "226",
1420
- Burundi: "257",
1421
- "Cabo Verde": "238",
1422
- Cambodia: "855",
1423
- Cameroon: "237",
1424
- Canada: "1",
1425
- "Caribbean Netherlands": "599",
1426
- "Cayman Islands": "1 345",
1427
- "Central African Republic": "236",
1428
- Chad: "235",
1429
- Chile: "56",
1430
- China: "86",
1431
- "Christmas Island": "61",
1432
- "Cocos (Keeling) Islands": "61",
1433
- Colombia: "57",
1434
- Comoros: "269",
1435
- "Cook Islands": "682",
1436
- "Costa Rica": "506",
1437
- Croatia: "385",
1438
- Cuba: "53",
1439
- Curaçao: "599",
1440
- Cyprus: "357",
1441
- Czechia: "420",
1442
- "Côte d'Ivoire": "225",
1443
- "Democratic Republic of the Congo": "243",
1444
- Denmark: "45",
1445
- Djibouti: "253",
1446
- "Dominican Republic": "1 809",
1447
- Ecuador: "593",
1448
- Egypt: "20",
1449
- "El Salvador": "503",
1450
- "Equatorial Guinea": "240",
1451
- Eritrea: "291",
1452
- Estonia: "372",
1453
- Eswatini: "268",
1454
- Ethiopia: "251",
1455
- "Falkland Islands (Islas Malvinas)": "500",
1456
- "Faroe Islands": "298",
1457
- Fiji: "679",
1458
- Finland: "358",
1459
- France: "33",
1460
- "French Guiana": "594",
1461
- "French Polynesia": "689",
1462
- "French Southern and Antarctic Lands": "262",
1463
- Gabon: "241",
1464
- Georgia: "995",
1465
- Germany: "49",
1466
- Ghana: "233",
1467
- Gibraltar: "350",
1468
- Greece: "30",
1469
- Greenland: "299",
1470
- Grenada: "1 473",
1471
- Guadeloupe: "590",
1472
- Guam: "1 671",
1473
- Guatemala: "502",
1474
- Guernsey: "44",
1475
- Guinea: "224",
1476
- "Guinea-Bissau": "245",
1477
- Guyana: "592",
1478
- Haiti: "509",
1479
- Honduras: "504",
1480
- "Hong Kong": "852",
1481
- Hungary: "36",
1482
- Iceland: "354",
1483
- India: "91",
1484
- Indonesia: "62",
1485
- Iran: "98",
1486
- Iraq: "964",
1487
- Ireland: "353",
1488
- "Isle of Man": "44",
1489
- Israel: "972",
1490
- Italy: "39",
1491
- Jamaica: "1 876",
1492
- Japan: "81",
1493
- Jersey: "44",
1494
- Jordan: "962",
1495
- Kazakhstan: "7",
1496
- Kenya: "254",
1497
- Kiribati: "686",
1498
- Kosovo: "383",
1499
- Kuwait: "965",
1500
- Kyrgyzstan: "996",
1501
- Laos: "856",
1502
- Latvia: "371",
1503
- Lebanon: "961",
1504
- Lesotho: "266",
1505
- Liberia: "231",
1506
- Libya: "218",
1507
- Liechtenstein: "423",
1508
- Lithuania: "370",
1509
- Luxembourg: "352",
1510
- Macao: "853",
1511
- Madagascar: "261",
1512
- Malawi: "265",
1513
- Malaysia: "60",
1514
- Maldives: "960",
1515
- Mali: "223",
1516
- Malta: "356",
1517
- "Marshall Islands": "692",
1518
- Martinique: "596",
1519
- Mauritania: "222",
1520
- Mauritius: "230",
1521
- Mayotte: "262",
1522
- Mexico: "52",
1523
- Micronesia: "691",
1524
- Moldova: "373",
1525
- Monaco: "377",
1526
- Mongolia: "976",
1527
- Montenegro: "382",
1528
- Montserrat: "1 664",
1529
- Morocco: "212",
1530
- Mozambique: "258",
1531
- "Myanmar (Burma)": "95",
1532
- Namibia: "264",
1533
- Nauru: "674",
1534
- Nepal: "977",
1535
- Netherlands: "31",
1536
- "New Caledonia": "687",
1537
- "New Zealand": "64",
1538
- Nicaragua: "505",
1539
- Niger: "227",
1540
- Nigeria: "234",
1541
- Niue: "683",
1542
- "Norfolk Island": "672",
1543
- "North Korea": "850",
1544
- "North Macedonia": "389",
1545
- "Northern Mariana Islands": "1 670",
1546
- Norway: "47",
1547
- Oman: "968",
1548
- Pakistan: "92",
1549
- Palau: "680",
1550
- Palestine: "970",
1551
- Panama: "507",
1552
- "Papua New Guinea": "675",
1553
- Paraguay: "595",
1554
- Peru: "51",
1555
- Philippines: "63",
1556
- "Pitcairn Islands": "64",
1557
- Poland: "48",
1558
- Portugal: "351",
1559
- "Puerto Rico": "1 787",
1560
- Qatar: "974",
1561
- Romania: "40",
1562
- Russia: "7",
1563
- Rwanda: "250",
1564
- Réunion: "262",
1565
- "Saint Barthélemy": "590",
1566
- "Saint Helena, Ascension and Tristan da Cunha": "290",
1567
- "Saint Kitts and Nevis": "1 869",
1568
- "Saint Lucia": "1 758",
1569
- "Saint Martin": "590",
1570
- "Saint Pierre and Miquelon": "508",
1571
- "Saint Vincent and the Grenadines": "1 784",
1572
- Samoa: "685",
1573
- "San Marino": "378",
1574
- "Saudi Arabia": "966",
1575
- Senegal: "221",
1576
- Serbia: "381",
1577
- Seychelles: "248",
1578
- "Sierra Leone": "232",
1579
- Singapore: "65",
1580
- "Sint Maarten": "1 721",
1581
- Slovakia: "421",
1582
- Slovenia: "386",
1583
- "Solomon Islands": "677",
1584
- Somalia: "252",
1585
- "South Africa": "27",
1586
- "South Georgia and the South Sandwich Islands": "500",
1587
- "South Korea": "82",
1588
- "South Sudan": "211",
1589
- Spain: "34",
1590
- "Sri Lanka": "94",
1591
- Sudan: "249",
1592
- Suriname: "597",
1593
- "Svalbard and Jan Mayen": "47",
1594
- Sweden: "46",
1595
- Switzerland: "41",
1596
- Syria: "963",
1597
- "São Tomé and Príncipe": "239",
1598
- Taiwan: "886",
1599
- Tajikistan: "992",
1600
- Tanzania: "255",
1601
- Thailand: "66",
1602
- "The Bahamas": "1 242",
1603
- "The Gambia": "220",
1604
- "Timor-Leste": "670",
1605
- Togo: "228",
1606
- Tokelau: "690",
1607
- Tonga: "676",
1608
- "Trinidad and Tobago": "1 868",
1609
- Tunisia: "216",
1610
- Turkmenistan: "993",
1611
- "Turks and Caicos Islands": "1 649",
1612
- Tuvalu: "688",
1613
- Türkiye: "90",
1614
- "U.S. Virgin Islands": "1 340",
1615
- Uganda: "256",
1616
- Ukraine: "380",
1617
- "United Arab Emirates": "971",
1618
- "United Kingdom": "44",
1619
- "United States": "1",
1620
- "United States Minor Outlying Islands": "1",
1621
- Uruguay: "598",
1622
- Uzbekistan: "998",
1623
- Vanuatu: "678",
1624
- "Vatican City": "379",
1625
- Venezuela: "58",
1626
- Vietnam: "84",
1627
- "Wallis and Futuna": "681",
1628
- "Western Sahara": "212",
1629
- Yemen: "967",
1630
- Zambia: "260",
1631
- Zimbabwe: "263",
1632
- "Åland Islands": "358"
1633
- };
1634
- const keyToAddressComponents = {
1635
- line1: ["street_number", "floor", "room", "premise"],
1636
- line2: ["subpremise", "street_address", "route"],
1637
- line3: ["sublocality", "neighborhood"],
1638
- city: ["locality", "postal_town"],
1639
- state: ["administrative_area_level_1"],
1640
- postcode: ["postal_code"],
1641
- country: ["country"]
1642
- };
1643
- const fieldMapKeys = Object.keys(keyToAddressComponents);
1644
- const addressComponentsToFields = (addressComponents) => {
1645
- return fieldMapKeys.reduce((acc, key) => {
1646
- const componentTypes = keyToAddressComponents[key];
1647
- const value = addressComponents.filter((component) => component.types.some((type) => componentTypes.includes(type))).map((component) => component.long_name).join(", ");
1648
- if (value) {
1649
- acc[key] = value;
1650
- }
1651
- return acc;
1652
- }, {});
1653
- };
1654
- const dummyDivBecauseGoogleRequiresIt = document.createElement("div");
1655
- const useGooglePlaces = () => {
1656
- return F(() => {
1657
- const {
1658
- google
1659
- } = window;
1660
- if ("google" in window === false || "maps" in google === false || "places" in google.maps === false) {
1661
- return {
1662
- enabled: false
1663
- };
1664
- }
1665
- const autocomplete = new google.maps.places.AutocompleteService();
1666
- const places = new google.maps.places.PlacesService(dummyDivBecauseGoogleRequiresIt);
1667
- return {
1668
- enabled: true,
1669
- getPredictions: async (input) => {
1670
- const {
1671
- predictions
1672
- } = await autocomplete.getPlacePredictions({
1673
- input,
1674
- language: "en"
1675
- });
1676
- return predictions.map((p2) => ({
1677
- label: p2.description,
1678
- value: p2.place_id
1679
- }));
1680
- },
1681
- getPlaceDetails: async (placeId) => {
1682
- const result = await new Promise((resolve, reject) => places.getDetails({
1683
- placeId,
1684
- fields: ["address_components"],
1685
- language: "en"
1686
- }, (result2, status) => {
1687
- if (status !== google.maps.places.PlacesServiceStatus["OK"])
1688
- return reject(status);
1689
- if (result2 === null)
1690
- return reject("ZERO_RESULTS");
1691
- return resolve({
1692
- ok: true,
1693
- place: result2
1694
- });
1695
- })).catch(async (e) => {
1696
- console.error("Failed to get address details", e);
1697
- return {
1698
- ok: false
1699
- };
1700
- });
1701
- return result;
1702
- }
1703
- };
1704
- }, []);
1705
- };
1706
- const BackButton = (props) => {
1707
- return o$1("button", {
1708
- type: "button",
1709
- class: "text-neutral-10 hover:bg-neutral-4 hover:text-neutral-12 hover:border-neutral-5 flex items-center gap-1 rounded-[18px] border border-solid border-transparent px-3 py-1 pl-1.5 text-sm transition-colors",
1710
- ...props,
1711
- children: [o$1("svg", {
1712
- width: "16",
1713
- height: "16",
1714
- viewBox: "0 0 16 16",
1715
- stroke: "currentColor",
1716
- "stroke-width": "1.5",
1717
- fill: "none",
1718
- xmlns: "http://www.w3.org/2000/svg",
1719
- children: o$1("path", {
1720
- d: "M10 3L5 8L10 13"
1721
- })
1722
- }), o$1("span", {
1723
- children: "Back"
1724
- })]
1725
- });
1726
- };
1727
- const optionManual = {
1728
- label: "Fill in manually",
1729
- value: ""
1730
- };
1731
- const ChatInputAddress = ({
1732
- input,
1733
- onSubmitSuccess
1734
- }) => {
1735
- const [query, setQuery] = h("");
1736
- const [addressFields, setAddressFields] = h();
1737
- const [suggestions, setSuggestions] = h([]);
1738
- const [placeId, setPlaceId] = h();
1739
- const {
1740
- enabled,
1741
- getPredictions,
1742
- getPlaceDetails
1743
- } = useGooglePlaces();
1744
- const [state, setState] = h(enabled ? "query" : "manual");
1745
- const searchPlaces = (query2) => {
1746
- invariant(enabled, "Query state should not be enabled if Google Places isn't available");
1747
- setQuery(query2);
1748
- if (query2 === "")
1749
- setSuggestions([]);
1750
- getPredictions(query2).then((predictions) => {
1751
- setSuggestions(predictions);
1752
- });
1753
- };
1754
- p(() => {
1755
- if (!enabled)
1756
- return;
1757
- if (placeId === void 0 || placeId === "")
1758
- return;
1759
- getPlaceDetails(placeId).then((result) => {
1760
- if (!result.ok || !result.place.address_components) {
1761
- setAddressFields({});
1762
- return;
1763
- }
1764
- const fields = addressComponentsToFields(result.place.address_components);
1765
- setAddressFields(fields);
1766
- setState("details");
1767
- });
1768
- return () => {
1769
- setAddressFields(void 0);
1770
- };
1771
- }, [placeId, getPlaceDetails, enabled]);
1772
- switch (state) {
1773
- case "query": {
1774
- invariant(enabled, "Query state should not be enabled if Google Places isn't available");
1775
- return o$1(ChatInputAddressQuery, {
1776
- input,
1777
- onSkip: () => onSubmitSuccess(null),
1778
- onAddressSelect: (e) => {
1779
- setPlaceId(e);
1780
- setState("loading");
1781
- },
1782
- onAddressSearch: (e) => {
1783
- searchPlaces(e);
1784
- },
1785
- suggestions,
1786
- query
1787
- });
1788
- }
1789
- case "loading":
1790
- return o$1(ChatInputAddressDetails, {
1791
- input,
1792
- onSubmitSuccess,
1793
- addressFields: {},
1794
- actions: o$1(BackButton, {
1795
- onClick: () => {
1796
- setPlaceId(void 0);
1797
- setState("query");
1798
- }
1799
- })
1800
- });
1801
- case "details":
1802
- invariant(addressFields !== void 0);
1803
- return o$1(ChatInputAddressDetails, {
1804
- input,
1805
- onSubmitSuccess,
1806
- addressFields,
1807
- actions: o$1(BackButton, {
1808
- onClick: () => {
1809
- setPlaceId(void 0);
1810
- setState("query");
1811
- }
1812
- })
1813
- });
1814
- case "manual":
1815
- return o$1(ChatInputAddressDetails, {
1816
- input,
1817
- onSubmitSuccess,
1818
- addressFields: {},
1819
- actions: enabled ? o$1(BackButton, {
1820
- onClick: () => {
1821
- setPlaceId(void 0);
1822
- setState("query");
1823
- }
1824
- }) : void 0
1825
- });
1826
- }
1827
- };
1828
- const ChatInputAddressQuery = ({
1829
- input,
1830
- onSkip,
1831
- suggestions,
1832
- onAddressSelect,
1833
- query,
1834
- onAddressSearch
1835
- }) => {
1836
- const ref = _$1(null);
1837
- y(() => {
1838
- if (ref.current) {
1839
- ref.current.focus();
1840
- ref.current.select();
1841
- }
1842
- }, []);
1843
- return o$1(k, {
1844
- children: [o$1("form", {
1845
- noValidate: true,
1846
- onSubmit: (e) => {
1847
- e.preventDefault();
1848
- const formData = new FormData(e.currentTarget);
1849
- const address = formData.get("address");
1850
- if (typeof address !== "string")
1851
- return;
1852
- onAddressSearch(address);
1853
- },
1854
- class: "flex gap-1 p-2.5",
1855
- children: [o$1("div", {
1856
- class: "group relative flex-1",
1857
- children: [o$1("input", {
1858
- ref,
1859
- name: "address",
1860
- id: "chat-address",
1861
- autocomplete: "address-line1 country-name postal-code",
1862
- autoFocus: true,
1863
- class: "outline-divider ease-expo-out placeholder:text-neutral-10 text-neutral-12 focus-visible:outline-accent-7 caret-accent-9 bg-lowest w-full rounded-full px-3 py-1 text-base outline outline-2 transition-all",
1864
- placeholder: input.config.placeholder || "Type and search for places...",
1865
- defaultValue: query
1866
- }), o$1("button", {
1867
- type: "submit",
1868
- class: "touch-hitbox text-neutral-12 hover:bg-neutral-3 fr absolute bottom-0 right-0 top-0 flex cursor-pointer items-center gap-1 rounded-full px-3 transition-all",
1869
- children: o$1("svg", {
1870
- width: "16",
1871
- height: "16",
1872
- viewBox: "0 0 16 16",
1873
- fill: "none",
1874
- xmlns: "http://www.w3.org/2000/svg",
1875
- children: [o$1("g", {
1876
- id: "inploi",
1877
- stroke: "currentColor",
1878
- "stroke-linecap": "round",
1879
- "stroke-linejoin": "round",
1880
- strokeWidth: "1.5",
1881
- children: [o$1("circle", {
1882
- cx: "7",
1883
- cy: "7",
1884
- r: "4"
1885
- }), o$1("path", {
1886
- d: "M10 10L13 13"
1887
- })]
1888
- }), o$1("span", {
1889
- class: "sr-only",
1890
- children: "Search"
1891
- })]
1892
- })
1893
- })]
1894
- }), input.config.optional && o$1(SkipButton, {
1895
- class: "",
1896
- onClick: onSkip
1897
- })]
1898
- }), o$1("ul", {
1899
- children: [suggestions.map((suggestion) => o$1("li", {
1900
- children: o$1("button", {
1901
- class: "text-neutral-11 fr hover:bg-neutral-3 focus-visible:bg-neutral-3 hover:text-neutral-12 border-b-neutral-3 flex w-full items-center border border-b border-solid border-transparent px-4 py-3 text-sm transition-colors duration-100",
1902
- onClick: () => {
1903
- onAddressSelect(suggestion.value);
1904
- },
1905
- children: [o$1("span", {
1906
- class: "flex-grow",
1907
- children: suggestion.label
1908
- }), o$1("svg", {
1909
- class: "flex-none",
1910
- width: "16",
1911
- height: "16",
1912
- viewBox: "0 0 16 16",
1913
- stroke: "currentColor",
1914
- "stroke-width": "1.5",
1915
- fill: "none",
1916
- xmlns: "http://www.w3.org/2000/svg",
1917
- children: o$1("path", {
1918
- d: "M6 3L11 8L6 13"
1919
- })
1920
- })]
1921
- })
1922
- }, suggestion.label)), o$1("li", {
1923
- children: o$1("button", {
1924
- class: "text-neutral-11 fr hover:bg-neutral-3 focus-visible:bg-neutral-3 hover:text-neutral-12 border-b-neutral-3 flex w-full items-center border border-b border-solid border-transparent px-4 py-3 text-sm transition-colors duration-100",
1925
- onClick: () => {
1926
- onAddressSelect(optionManual.value);
1927
- },
1928
- children: o$1("span", {
1929
- class: "flex-grow",
1930
- children: optionManual.label
1931
- })
1932
- })
1933
- }, optionManual.label)]
1934
- })]
1935
- });
1936
- };
1937
- const addressKeyToLabel = {
1938
- line1: "Line 1",
1939
- line2: "Line 2",
1940
- line3: "Line 3",
1941
- city: "City",
1942
- state: "State",
1943
- postcode: "Postcode",
1944
- country: "Country"
1945
- };
1946
- const ChatInputAddressDetails = ({
1947
- addressFields,
1948
- onSubmitSuccess,
1949
- actions,
1950
- input
1951
- }) => {
1952
- const ref = _$1(null);
1953
- y(() => {
1954
- if (ref.current) {
1955
- const firstInput = ref.current.querySelector("input");
1956
- if (firstInput) {
1957
- firstInput.focus();
1958
- firstInput.select();
1959
- }
1960
- }
1961
- }, []);
1962
- const countryNames = Object.keys(countries);
1963
- return o$1("form", {
1964
- class: "bg-neutral-1/90 flex flex-col justify-end gap-2 p-2",
1965
- onSubmit: (e) => {
1966
- const formData = new FormData(e.currentTarget);
1967
- const fields = Object.fromEntries(formData.entries());
1968
- onSubmitSuccess({
1969
- type: "address",
1970
- value: fields
1971
- });
1972
- },
1973
- children: [o$1("div", {
1974
- class: "bg-neutral-3 border-neutral-5 grid items-center gap-1.5 rounded-2xl border pb-2 pl-4 pr-3 pt-3 [grid-template-columns:min-content_1fr]",
1975
- ref,
1976
- children: fieldMapKeys.map((key, i2) => {
1977
- const labelId = `isdk_${key}`;
1978
- const name = input.config.keys[key];
1979
- if (!name)
1980
- return null;
1981
- return o$1(k, {
1982
- children: [o$1("label", {
1983
- for: labelId,
1984
- class: "text-neutral-9 [&:has(+*>input:focus)]:text-neutral-11 w-24 pb-2 text-xs uppercase leading-3 tracking-widest transition-colors",
1985
- children: addressKeyToLabel[key]
1986
- }), o$1("div", {
1987
- class: "flex flex-col items-stretch gap-1.5",
1988
- children: [key === "country" ? o$1("div", {
1989
- class: "relative",
1990
- children: [o$1("select", {
1991
- class: "text-neutral-12 hover:bg-neutral-4 placeholder:text-neutral-8 focus:bg-neutral-5 w-full flex-1 appearance-none rounded-lg border-solid bg-transparent bg-none px-3 py-1.5 text-base transition-colors focus:outline-none",
1992
- name,
1993
- id: labelId,
1994
- defaultValue: addressFields[key],
1995
- required: true,
1996
- children: [addressFields.country && !countryNames.includes(addressFields.country) ? o$1("option", {
1997
- value: addressFields[key],
1998
- children: addressFields[key]
1999
- }) : o$1("option", {
2000
- value: "",
2001
- children: "Select a country"
2002
- }), countryNames.map((countryName) => o$1("option", {
2003
- value: countryName,
2004
- children: countryName
2005
- }, countryName))]
2006
- }), o$1("svg", {
2007
- class: "text-neutral-12 absolute bottom-2.5 right-2 flex items-center justify-center",
2008
- width: "16",
2009
- height: "16",
2010
- stroke: "currentColor",
2011
- "stroke-width": "1.5",
2012
- "stroke-linecap": "round",
2013
- "stroke-linejoin": "round",
2014
- viewBox: "0 0 16 16",
2015
- fill: "none",
2016
- xmlns: "http://www.w3.org/2000/svg",
2017
- children: o$1("path", {
2018
- d: "M4 6.5L8 10.5L12 6.5"
2019
- })
2020
- })]
2021
- }) : o$1("input", {
2022
- autoFocus: i2 === 0 ? true : void 0,
2023
- class: "text-neutral-12 hover:bg-neutral-4 placeholder:text-neutral-8 focus:bg-neutral-5 flex-1 rounded-lg border-solid bg-transparent px-3 py-1.5 text-base transition-colors autofill:shadow-[inset_0_0_0_1000px_hsl(210_16.7%_97.6%)] focus:outline-none",
2024
- name,
2025
- id: labelId,
2026
- defaultValue: addressFields[key],
2027
- required: true
2028
- }), i2 !== fieldMapKeys.length - 1 && o$1("hr", {
2029
- class: "border-b-neutral-5 m-0 w-full border-b border-solid"
2030
- }), i2 === fieldMapKeys.length - 1 && o$1("hr", {
2031
- class: "m-0 w-full border-b border-b-transparent"
2032
- })]
2033
- })]
2034
- });
2035
- })
2036
- }), o$1("div", {
2037
- class: "flex w-full flex-1 ",
2038
- children: [o$1("div", {
2039
- class: "flex-grow",
2040
- children: actions
2041
- }), o$1(SendButton, {
2042
- class: "flex items-center justify-center"
2043
- })]
2044
- })]
2045
- });
2046
- };
2047
- const useFocusOnMount = () => {
2048
- const focusRef = _$1(null);
2049
- p(() => {
2050
- var _a;
2051
- (_a = focusRef.current) == null ? void 0 : _a.focus();
2052
- }, []);
2053
- return focusRef;
2054
- };
2055
- const options = ["true", "false"];
2056
- const AnswerSchema = picklist(options);
2057
- const FIELD_NAME = "answer";
2058
- const booleanButtonListClass = "flex items-center gap-2 p-2.5";
2059
- const BooleanOption = k$1(({
2060
- label,
2061
- ...props
2062
- }, ref) => {
2063
- return o$1("button", {
2064
- class: "bg-lowest ease-expo-out ring-divider text-neutral-12 active:ring-accent-7 active:bg-accent-2 active:text-accent-11 fr block w-full overflow-hidden rounded-2xl px-2.5 py-2.5 ring-2 transition-all selection:bg-transparent",
2065
- ...props,
2066
- ref,
2067
- children: o$1("p", {
2068
- class: "truncate text-center text-base",
2069
- children: label
2070
- })
2071
- });
2072
- });
2073
- const ChatInputBoolean = ({
2074
- input,
2075
- onSubmitSuccess
2076
- }) => {
2077
- const focusRef = useFocusOnMount();
2078
- return o$1("form", {
2079
- noValidate: true,
2080
- class: "",
2081
- onSubmit: (e) => {
2082
- e.preventDefault();
2083
- const value = getFormSubmitter(e).value;
2084
- const answer = parse(AnswerSchema, value);
2085
- onSubmitSuccess({
2086
- type: "boolean",
2087
- value: answer === "true"
2088
- });
2089
- },
2090
- children: [o$1("ul", {
2091
- class: booleanButtonListClass,
2092
- children: options.map((value, i2) => {
2093
- return o$1("li", {
2094
- class: "flex-1",
2095
- children: o$1(BooleanOption, {
2096
- ref: i2 === 0 ? focusRef : null,
2097
- type: "submit",
2098
- name: FIELD_NAME,
2099
- value,
2100
- label: input.config.labels[value]
2101
- }, value)
2102
- });
2103
- })
2104
- }), input.config.optional && o$1("div", {
2105
- class: "px-2 pb-2",
2106
- children: o$1(SkipButton, {
2107
- class: "w-full",
2108
- type: "button",
2109
- onClick: () => onSubmitSuccess(null)
2110
- })
2111
- })]
2112
- });
2113
- };
2114
- const InputError = ({
2115
- error
2116
- }) => {
2117
- if (!error || !error.message)
2118
- return null;
2119
- return o$1("div", {
2120
- role: "alert",
2121
- class: "text-error-11 flex max-w-full items-center gap-1 overflow-hidden rounded-full px-2 py-2",
2122
- children: [o$1("svg", {
2123
- class: "text-error-9 h-4 w-4",
2124
- viewBox: "0 0 16 16",
2125
- fill: "none",
2126
- xmlns: "http://www.w3.org/2000/svg",
2127
- children: [o$1("circle", {
2128
- cx: "8",
2129
- cy: "8",
2130
- r: "6.3",
2131
- stroke: "currentColor",
2132
- "stroke-width": "1.4"
2133
- }), o$1("rect", {
2134
- x: "7",
2135
- y: "4",
2136
- width: "2",
2137
- height: "5",
2138
- fill: "currentColor"
2139
- }), o$1("rect", {
2140
- x: "7",
2141
- y: "10",
2142
- width: "2",
2143
- height: "2",
2144
- fill: "currentColor"
2145
- })]
2146
- }), o$1("p", {
2147
- class: "truncate pr-1 text-sm",
2148
- children: error.message
2149
- })]
2150
- });
2151
- };
2152
- const toBase64 = (file) => new Promise((resolve, reject) => {
2153
- const reader = new FileReader();
2154
- reader.readAsDataURL(file);
2155
- reader.onload = () => {
2156
- if (!reader.result)
2157
- return reject("No result from reader");
2158
- return resolve(reader.result.toString());
2159
- };
2160
- reader.onerror = reject;
2161
- });
2162
- const addFileSizesKb = (files) => files.reduce((acc, cur) => acc + cur.sizeKb, 0);
2163
- const isFileSubmission = isSubmissionOfType("file");
2164
- const FILENAMES_TO_SHOW_QTY = 3;
2165
- const FileThumbnail = ({
2166
- file,
2167
- class: className,
2168
- ...props
2169
- }) => {
2170
- const extension = file.name.split(".").pop();
2171
- const fileName = file.name.replace(new RegExp(`.${extension}$`), "");
2172
- return o$1("div", {
2173
- class: clsx("bg-accent-1 outline-accent-4 flex max-w-full gap-2 overflow-hidden rounded-lg px-3 py-2 text-sm outline", className),
2174
- ...props,
2175
- children: [o$1("p", {
2176
- "aria-label": "File name",
2177
- class: "text-accent-12 flex flex-grow overflow-hidden",
2178
- children: [o$1("span", {
2179
- class: "block truncate",
2180
- children: fileName
2181
- }), o$1("span", {
2182
- children: [".", extension]
2183
- })]
2184
- }), o$1("p", {
2185
- "aria-label": "File size",
2186
- class: "text-accent-11",
2187
- children: kbToReadableSize(file.sizeKb)
2188
- })]
2189
- });
2190
- };
2191
- const FilenameBadge = ({
2192
- class: className,
2193
- ...props
2194
- }) => o$1("li", {
2195
- class: clsx("outline-neutral-6 text-neutral-11 bg-neutral-1 block rounded-md px-1 py-0.5 text-xs outline outline-1", className),
2196
- ...props
2197
- });
2198
- const getFileExtension = (fileName) => {
2199
- const extension = fileName.split(".").pop();
2200
- if (!extension)
2201
- throw new Error("No file extension found");
2202
- return extension ? "." + extension : "";
2203
- };
2204
- const validateExtensions = ({
2205
- allowedExtensions,
2206
- files
2207
- }) => {
2208
- const normalisedExtensions = allowedExtensions.map((ext) => ext.toLowerCase());
2209
- return files.every((file) => normalisedExtensions.includes(getFileExtension(file.name).toLowerCase()));
2210
- };
2211
- const trimFileName = (fileName, maxLength2) => {
2212
- const extension = getFileExtension(fileName);
2213
- const trimmedName = fileName.replace(new RegExp(`${extension}$`), "").slice(0, maxLength2);
2214
- return `${trimmedName}${extension}`;
2215
- };
2216
- const ChatInputFile = ({
2217
- input,
2218
- onSubmitSuccess
2219
- }) => {
2220
- var _a;
2221
- const submission = (_a = store.current$.value.flow) == null ? void 0 : _a.data.submissions[input.key];
2222
- const [files, setFiles] = h(isFileSubmission(submission) ? submission.value : []);
2223
- const [error, setError] = h();
2224
- const hiddenFileCount = files.length - FILENAMES_TO_SHOW_QTY;
2225
- const totalSize = addFileSizesKb(files);
2226
- const focusRef = useFocusOnMount();
2227
- return o$1("form", {
2228
- class: "flex flex-col gap-1 p-2.5",
2229
- onSubmit: (e) => {
2230
- e.preventDefault();
2231
- setError(void 0);
2232
- if (files.length === 0) {
2233
- return setError({
2234
- type: "required",
2235
- message: "Please select a file"
2236
- });
2237
- }
2238
- if (input.config.extensions.length > 0 && !validateExtensions({
2239
- allowedExtensions: input.config.extensions,
2240
- files
2241
- })) {
2242
- return setError({
2243
- type: "validate",
2244
- message: `Please upload ${input.config.extensions.join(", ")} files only`
2245
- });
2246
- }
2247
- if (input.config.fileSizeLimitKib && totalSize > input.config.fileSizeLimitKib) {
2248
- return setError({
2249
- type: "max",
2250
- message: `File size exceeds limit of ${kbToReadableSize(input.config.fileSizeLimitKib)}`
2251
- });
2252
- }
2253
- if (input.config.allowMultiple === false && files.length > 1)
2254
- return setError({
2255
- type: "invalid",
2256
- message: "Only one file is allowed"
2257
- });
2258
- return onSubmitSuccess({
2259
- type: "file",
2260
- value: files
2261
- });
2262
- },
2263
- children: [o$1("div", {
2264
- class: "flex items-center gap-2",
2265
- children: [o$1("label", {
2266
- ref: focusRef,
2267
- for: "dropzone-file",
2268
- class: "border-neutral-8 bg-neutral-2 flex h-48 w-full cursor-pointer flex-col items-center justify-center overflow-hidden rounded-2xl border border-dashed p-4",
2269
- children: [files.length > 0 ? o$1(k, {
2270
- children: [o$1("ul", {
2271
- class: "flex max-w-full flex-wrap justify-center gap-1 overflow-hidden p-1",
2272
- children: [files.slice(0, FILENAMES_TO_SHOW_QTY).map((file) => {
2273
- const extension = file.name.split(".").pop();
2274
- const fileName = file.name.replace(new RegExp(`.${extension}$`), "");
2275
- return o$1(FilenameBadge, {
2276
- class: "flex overflow-hidden",
2277
- children: [o$1("span", {
2278
- class: "block truncate",
2279
- children: fileName
2280
- }), o$1("span", {
2281
- children: [".", extension]
2282
- })]
2283
- });
2284
- }), hiddenFileCount > 0 ? o$1(FilenameBadge, {
2285
- children: ["+", hiddenFileCount, " file", hiddenFileCount !== 1 ? "s" : ""]
2286
- }) : null]
2287
- }), o$1("p", {
2288
- class: "text-neutral-11 text-xs",
2289
- children: [kbToReadableSize(totalSize), " ", files.length > 1 ? "total" : ""]
2290
- })]
2291
- }) : o$1("div", {
2292
- class: "flex flex-col justify-center gap-4 pb-6 pt-5",
2293
- children: [o$1("header", {
2294
- class: "flex flex-col items-center gap-0",
2295
- children: [o$1("svg", {
2296
- class: "text-neutral-11 mb-1 h-8 w-8",
2297
- "aria-hidden": "true",
2298
- xmlns: "http://www.w3.org/2000/svg",
2299
- fill: "none",
2300
- viewBox: "0 0 20 16",
2301
- children: o$1("path", {
2302
- stroke: "currentColor",
2303
- "stroke-linecap": "round",
2304
- "stroke-linejoin": "round",
2305
- "stroke-width": "1.5",
2306
- d: "M13 13h3a3 3 0 0 0 0-6h-.025A5.56 5.56 0 0 0 16 6.5 5.5 5.5 0 0 0 5.207 5.021C5.137 5.017 5.071 5 5 5a4 4 0 0 0 0 8h2.167M10 15V6m0 0L8 8m2-2 2 2"
2307
- })
2308
- }), o$1("p", {
2309
- class: "text-neutral-12 tracking-[-0.01em]",
2310
- children: [input.config.allowMultiple ? "Select files" : "Select a file", " to upload"]
2311
- }), input.config.fileSizeLimitKib ? o$1("p", {
2312
- class: "text-neutral-10 text-xs",
2313
- children: ["(max ", kbToReadableSize(input.config.fileSizeLimitKib), ")"]
2314
- }) : null]
2315
- }), o$1("aside", {
2316
- class: "flex flex-col items-center gap-2",
2317
- children: [o$1("p", {
2318
- id: "accepted-filetypes",
2319
- class: "sr-only",
2320
- children: "Accepted file extensions"
2321
- }), o$1("ul", {
2322
- "aria-describedby": "accepted-filetypes",
2323
- class: "flex flex-wrap justify-center gap-2",
2324
- children: input.config.extensions.map((ext) => o$1("li", {
2325
- class: "ring-lowest outline-neutral-6 text-neutral-9 bg-neutral-1 rounded-md px-1 py-0.5 text-[11px] uppercase tracking-wide outline outline-1 ring-2",
2326
- children: ext.replace(".", "")
2327
- }))
2328
- })]
2329
- })]
2330
- }), o$1("input", {
2331
- id: "dropzone-file",
2332
- onInput: async (e) => {
2333
- invariant(e.target instanceof HTMLInputElement);
2334
- const files2 = e.target.files ? Array.from(e.target.files) : [];
2335
- const filesToUpload = await Promise.allSettled(files2.map(async (file) => {
2336
- const data = await toBase64(file);
2337
- return {
2338
- name: trimFileName(file.name, 42),
2339
- data,
2340
- sizeKb: file.size / 1e3
2341
- };
2342
- }));
2343
- if (filesToUpload.some(({
2344
- status
2345
- }) => status === "rejected")) {
2346
- return setError({
2347
- type: "invalid",
2348
- message: "Invalid file"
2349
- });
2350
- }
2351
- const validFiles = filesToUpload.map((promise) => promise.status === "fulfilled" ? promise.value : null).filter(Boolean);
2352
- setFiles(validFiles);
2353
- },
2354
- multiple: input.config.allowMultiple,
2355
- type: "file",
2356
- class: "sr-only"
2357
- })]
2358
- }), o$1("div", {
2359
- class: "flex h-full flex-col items-center gap-2",
2360
- children: [o$1(SendButton, {
2361
- disabled: files.length === 0
2362
- }), input.config.optional && o$1(SkipButton, {
2363
- onClick: () => onSubmitSuccess(null)
2364
- })]
2365
- })]
2366
- }), o$1(InputError, {
2367
- error
2368
- })]
2369
- });
2370
- };
2371
- var isCheckBoxInput = (element) => element.type === "checkbox";
2372
- var isDateObject = (value) => value instanceof Date;
2373
- var isNullOrUndefined = (value) => value == null;
2374
- const isObjectType = (value) => typeof value === "object";
2375
- var isObject = (value) => !isNullOrUndefined(value) && !Array.isArray(value) && isObjectType(value) && !isDateObject(value);
2376
- var getEventValue = (event) => isObject(event) && event.target ? isCheckBoxInput(event.target) ? event.target.checked : event.target.value : event;
2377
- var getNodeParentName = (name) => name.substring(0, name.search(/\.\d+(\.|$)/)) || name;
2378
- var isNameInFieldArray = (names, name) => names.has(getNodeParentName(name));
2379
- var isPlainObject = (tempObject) => {
2380
- const prototypeCopy = tempObject.constructor && tempObject.constructor.prototype;
2381
- return isObject(prototypeCopy) && prototypeCopy.hasOwnProperty("isPrototypeOf");
2382
- };
2383
- var isWeb = typeof window !== "undefined" && typeof window.HTMLElement !== "undefined" && typeof document !== "undefined";
2384
- function cloneObject(data) {
2385
- let copy;
2386
- const isArray = Array.isArray(data);
2387
- if (data instanceof Date) {
2388
- copy = new Date(data);
2389
- } else if (data instanceof Set) {
2390
- copy = new Set(data);
2391
- } else if (!(isWeb && (data instanceof Blob || data instanceof FileList)) && (isArray || isObject(data))) {
2392
- copy = isArray ? [] : {};
2393
- if (!isArray && !isPlainObject(data)) {
2394
- copy = data;
2395
- } else {
2396
- for (const key in data) {
2397
- if (data.hasOwnProperty(key)) {
2398
- copy[key] = cloneObject(data[key]);
2399
- }
2400
- }
2401
- }
2402
- } else {
2403
- return data;
2404
- }
2405
- return copy;
2406
- }
2407
- var compact = (value) => Array.isArray(value) ? value.filter(Boolean) : [];
2408
- var isUndefined = (val) => val === void 0;
2409
- var get = (obj, path, defaultValue) => {
2410
- if (!path || !isObject(obj)) {
2411
- return defaultValue;
2412
- }
2413
- const result = compact(path.split(/[,[\].]+?/)).reduce((result2, key) => isNullOrUndefined(result2) ? result2 : result2[key], obj);
2414
- return isUndefined(result) || result === obj ? isUndefined(obj[path]) ? defaultValue : obj[path] : result;
2415
- };
2416
- var isBoolean = (value) => typeof value === "boolean";
2417
- const EVENTS = {
2418
- BLUR: "blur",
2419
- FOCUS_OUT: "focusout",
2420
- CHANGE: "change"
2421
- };
2422
- const VALIDATION_MODE = {
2423
- onBlur: "onBlur",
2424
- onChange: "onChange",
2425
- onSubmit: "onSubmit",
2426
- onTouched: "onTouched",
2427
- all: "all"
2428
- };
2429
- const INPUT_VALIDATION_RULES = {
2430
- max: "max",
2431
- min: "min",
2432
- maxLength: "maxLength",
2433
- minLength: "minLength",
2434
- pattern: "pattern",
2435
- required: "required",
2436
- validate: "validate"
2437
- };
2438
- Cn.createContext(null);
2439
- var getProxyFormState = (formState, control, localProxyFormState, isRoot = true) => {
2440
- const result = {
2441
- defaultValues: control._defaultValues
2442
- };
2443
- for (const key in formState) {
2444
- Object.defineProperty(result, key, {
2445
- get: () => {
2446
- const _key = key;
2447
- if (control._proxyFormState[_key] !== VALIDATION_MODE.all) {
2448
- control._proxyFormState[_key] = !isRoot || VALIDATION_MODE.all;
2449
- }
2450
- localProxyFormState && (localProxyFormState[_key] = true);
2451
- return formState[_key];
2452
- }
2453
- });
2454
- }
2455
- return result;
2456
- };
2457
- var isEmptyObject = (value) => isObject(value) && !Object.keys(value).length;
2458
- var shouldRenderFormState = (formStateData, _proxyFormState, updateFormState, isRoot) => {
2459
- updateFormState(formStateData);
2460
- const { name, ...formState } = formStateData;
2461
- return isEmptyObject(formState) || Object.keys(formState).length >= Object.keys(_proxyFormState).length || Object.keys(formState).find((key) => _proxyFormState[key] === (!isRoot || VALIDATION_MODE.all));
2462
- };
2463
- var convertToArrayPayload = (value) => Array.isArray(value) ? value : [value];
2464
- function useSubscribe(props) {
2465
- const _props = Cn.useRef(props);
2466
- _props.current = props;
2467
- Cn.useEffect(() => {
2468
- const subscription = !props.disabled && _props.current.subject && _props.current.subject.subscribe({
2469
- next: _props.current.next
2470
- });
2471
- return () => {
2472
- subscription && subscription.unsubscribe();
2473
- };
2474
- }, [props.disabled]);
2475
- }
2476
- var isString$1 = (value) => typeof value === "string";
2477
- var generateWatchOutput = (names, _names, formValues, isGlobal, defaultValue) => {
2478
- if (isString$1(names)) {
2479
- isGlobal && _names.watch.add(names);
2480
- return get(formValues, names, defaultValue);
2481
- }
2482
- if (Array.isArray(names)) {
2483
- return names.map((fieldName) => (isGlobal && _names.watch.add(fieldName), get(formValues, fieldName)));
2484
- }
2485
- isGlobal && (_names.watchAll = true);
2486
- return formValues;
2487
- };
2488
- var isKey = (value) => /^\w*$/.test(value);
2489
- var stringToPath = (input) => compact(input.replace(/["|']|\]/g, "").split(/\.|\[/));
2490
- function set(object2, path, value) {
2491
- let index = -1;
2492
- const tempPath = isKey(path) ? [path] : stringToPath(path);
2493
- const length = tempPath.length;
2494
- const lastIndex = length - 1;
2495
- while (++index < length) {
2496
- const key = tempPath[index];
2497
- let newValue = value;
2498
- if (index !== lastIndex) {
2499
- const objValue = object2[key];
2500
- newValue = isObject(objValue) || Array.isArray(objValue) ? objValue : !isNaN(+tempPath[index + 1]) ? [] : {};
2501
- }
2502
- object2[key] = newValue;
2503
- object2 = object2[key];
2504
- }
2505
- return object2;
2506
- }
2507
- var appendErrors = (name, validateAllFieldCriteria, errors2, type, message) => validateAllFieldCriteria ? {
2508
- ...errors2[name],
2509
- types: {
2510
- ...errors2[name] && errors2[name].types ? errors2[name].types : {},
2511
- [type]: message || true
2512
- }
2513
- } : {};
2514
- var getValidationModes = (mode) => ({
2515
- isOnSubmit: !mode || mode === VALIDATION_MODE.onSubmit,
2516
- isOnBlur: mode === VALIDATION_MODE.onBlur,
2517
- isOnChange: mode === VALIDATION_MODE.onChange,
2518
- isOnAll: mode === VALIDATION_MODE.all,
2519
- isOnTouch: mode === VALIDATION_MODE.onTouched
2520
- });
2521
- var isWatched = (name, _names, isBlurEvent) => !isBlurEvent && (_names.watchAll || _names.watch.has(name) || [..._names.watch].some((watchName) => name.startsWith(watchName) && /^\.\w+/.test(name.slice(watchName.length))));
2522
- const iterateFieldsByAction = (fields, action, fieldsNames, abortEarly) => {
2523
- for (const key of fieldsNames || Object.keys(fields)) {
2524
- const field = get(fields, key);
2525
- if (field) {
2526
- const { _f, ...currentField } = field;
2527
- if (_f) {
2528
- if (_f.refs && _f.refs[0] && action(_f.refs[0], key) && !abortEarly) {
2529
- break;
2530
- } else if (_f.ref && action(_f.ref, _f.name) && !abortEarly) {
2531
- break;
2532
- }
2533
- } else if (isObject(currentField)) {
2534
- iterateFieldsByAction(currentField, action);
2535
- }
2536
- }
2537
- }
2538
- };
2539
- var updateFieldArrayRootError = (errors2, error, name) => {
2540
- const fieldArrayErrors = compact(get(errors2, name));
2541
- set(fieldArrayErrors, "root", error[name]);
2542
- set(errors2, name, fieldArrayErrors);
2543
- return errors2;
2544
- };
2545
- var isFileInput = (element) => element.type === "file";
2546
- var isFunction = (value) => typeof value === "function";
2547
- var isHTMLElement = (value) => {
2548
- if (!isWeb) {
2549
- return false;
2550
- }
2551
- const owner = value ? value.ownerDocument : 0;
2552
- return value instanceof (owner && owner.defaultView ? owner.defaultView.HTMLElement : HTMLElement);
2553
- };
2554
- var isMessage = (value) => isString$1(value);
2555
- var isRadioInput = (element) => element.type === "radio";
2556
- var isRegex = (value) => value instanceof RegExp;
2557
- const defaultResult = {
2558
- value: false,
2559
- isValid: false
2560
- };
2561
- const validResult = { value: true, isValid: true };
2562
- var getCheckboxValue = (options2) => {
2563
- if (Array.isArray(options2)) {
2564
- if (options2.length > 1) {
2565
- const values = options2.filter((option) => option && option.checked && !option.disabled).map((option) => option.value);
2566
- return { value: values, isValid: !!values.length };
2567
- }
2568
- return options2[0].checked && !options2[0].disabled ? (
2569
- // @ts-expect-error expected to work in the browser
2570
- options2[0].attributes && !isUndefined(options2[0].attributes.value) ? isUndefined(options2[0].value) || options2[0].value === "" ? validResult : { value: options2[0].value, isValid: true } : validResult
2571
- ) : defaultResult;
2572
- }
2573
- return defaultResult;
2574
- };
2575
- const defaultReturn = {
2576
- isValid: false,
2577
- value: null
2578
- };
2579
- var getRadioValue = (options2) => Array.isArray(options2) ? options2.reduce((previous, option) => option && option.checked && !option.disabled ? {
2580
- isValid: true,
2581
- value: option.value
2582
- } : previous, defaultReturn) : defaultReturn;
2583
- function getValidateError(result, ref, type = "validate") {
2584
- if (isMessage(result) || Array.isArray(result) && result.every(isMessage) || isBoolean(result) && !result) {
2585
- return {
2586
- type,
2587
- message: isMessage(result) ? result : "",
2588
- ref
2589
- };
2590
- }
2591
- }
2592
- var getValueAndMessage = (validationData) => isObject(validationData) && !isRegex(validationData) ? validationData : {
2593
- value: validationData,
2594
- message: ""
2595
- };
2596
- var validateField = async (field, formValues, validateAllFieldCriteria, shouldUseNativeValidation, isFieldArray) => {
2597
- const { ref, refs, required, maxLength: maxLength2, minLength: minLength2, min, max, pattern, validate, name, valueAsNumber, mount, disabled } = field._f;
2598
- const inputValue = get(formValues, name);
2599
- if (!mount || disabled) {
2600
- return {};
2601
- }
2602
- const inputRef = refs ? refs[0] : ref;
2603
- const setCustomValidity = (message) => {
2604
- if (shouldUseNativeValidation && inputRef.reportValidity) {
2605
- inputRef.setCustomValidity(isBoolean(message) ? "" : message || "");
2606
- inputRef.reportValidity();
2607
- }
2608
- };
2609
- const error = {};
2610
- const isRadio = isRadioInput(ref);
2611
- const isCheckBox = isCheckBoxInput(ref);
2612
- const isRadioOrCheckbox2 = isRadio || isCheckBox;
2613
- const isEmpty = (valueAsNumber || isFileInput(ref)) && isUndefined(ref.value) && isUndefined(inputValue) || isHTMLElement(ref) && ref.value === "" || inputValue === "" || Array.isArray(inputValue) && !inputValue.length;
2614
- const appendErrorsCurry = appendErrors.bind(null, name, validateAllFieldCriteria, error);
2615
- const getMinMaxMessage = (exceedMax, maxLengthMessage, minLengthMessage, maxType = INPUT_VALIDATION_RULES.maxLength, minType = INPUT_VALIDATION_RULES.minLength) => {
2616
- const message = exceedMax ? maxLengthMessage : minLengthMessage;
2617
- error[name] = {
2618
- type: exceedMax ? maxType : minType,
2619
- message,
2620
- ref,
2621
- ...appendErrorsCurry(exceedMax ? maxType : minType, message)
2622
- };
2623
- };
2624
- if (isFieldArray ? !Array.isArray(inputValue) || !inputValue.length : required && (!isRadioOrCheckbox2 && (isEmpty || isNullOrUndefined(inputValue)) || isBoolean(inputValue) && !inputValue || isCheckBox && !getCheckboxValue(refs).isValid || isRadio && !getRadioValue(refs).isValid)) {
2625
- const { value, message } = isMessage(required) ? { value: !!required, message: required } : getValueAndMessage(required);
2626
- if (value) {
2627
- error[name] = {
2628
- type: INPUT_VALIDATION_RULES.required,
2629
- message,
2630
- ref: inputRef,
2631
- ...appendErrorsCurry(INPUT_VALIDATION_RULES.required, message)
2632
- };
2633
- if (!validateAllFieldCriteria) {
2634
- setCustomValidity(message);
2635
- return error;
2636
- }
2637
- }
2638
- }
2639
- if (!isEmpty && (!isNullOrUndefined(min) || !isNullOrUndefined(max))) {
2640
- let exceedMax;
2641
- let exceedMin;
2642
- const maxOutput = getValueAndMessage(max);
2643
- const minOutput = getValueAndMessage(min);
2644
- if (!isNullOrUndefined(inputValue) && !isNaN(inputValue)) {
2645
- const valueNumber = ref.valueAsNumber || (inputValue ? +inputValue : inputValue);
2646
- if (!isNullOrUndefined(maxOutput.value)) {
2647
- exceedMax = valueNumber > maxOutput.value;
2648
- }
2649
- if (!isNullOrUndefined(minOutput.value)) {
2650
- exceedMin = valueNumber < minOutput.value;
2651
- }
2652
- } else {
2653
- const valueDate = ref.valueAsDate || new Date(inputValue);
2654
- const convertTimeToDate = (time) => /* @__PURE__ */ new Date((/* @__PURE__ */ new Date()).toDateString() + " " + time);
2655
- const isTime = ref.type == "time";
2656
- const isWeek = ref.type == "week";
2657
- if (isString$1(maxOutput.value) && inputValue) {
2658
- exceedMax = isTime ? convertTimeToDate(inputValue) > convertTimeToDate(maxOutput.value) : isWeek ? inputValue > maxOutput.value : valueDate > new Date(maxOutput.value);
2659
- }
2660
- if (isString$1(minOutput.value) && inputValue) {
2661
- exceedMin = isTime ? convertTimeToDate(inputValue) < convertTimeToDate(minOutput.value) : isWeek ? inputValue < minOutput.value : valueDate < new Date(minOutput.value);
2662
- }
2663
- }
2664
- if (exceedMax || exceedMin) {
2665
- getMinMaxMessage(!!exceedMax, maxOutput.message, minOutput.message, INPUT_VALIDATION_RULES.max, INPUT_VALIDATION_RULES.min);
2666
- if (!validateAllFieldCriteria) {
2667
- setCustomValidity(error[name].message);
2668
- return error;
2669
- }
2670
- }
2671
- }
2672
- if ((maxLength2 || minLength2) && !isEmpty && (isString$1(inputValue) || isFieldArray && Array.isArray(inputValue))) {
2673
- const maxLengthOutput = getValueAndMessage(maxLength2);
2674
- const minLengthOutput = getValueAndMessage(minLength2);
2675
- const exceedMax = !isNullOrUndefined(maxLengthOutput.value) && inputValue.length > +maxLengthOutput.value;
2676
- const exceedMin = !isNullOrUndefined(minLengthOutput.value) && inputValue.length < +minLengthOutput.value;
2677
- if (exceedMax || exceedMin) {
2678
- getMinMaxMessage(exceedMax, maxLengthOutput.message, minLengthOutput.message);
2679
- if (!validateAllFieldCriteria) {
2680
- setCustomValidity(error[name].message);
2681
- return error;
2682
- }
2683
- }
2684
- }
2685
- if (pattern && !isEmpty && isString$1(inputValue)) {
2686
- const { value: patternValue, message } = getValueAndMessage(pattern);
2687
- if (isRegex(patternValue) && !inputValue.match(patternValue)) {
2688
- error[name] = {
2689
- type: INPUT_VALIDATION_RULES.pattern,
2690
- message,
2691
- ref,
2692
- ...appendErrorsCurry(INPUT_VALIDATION_RULES.pattern, message)
2693
- };
2694
- if (!validateAllFieldCriteria) {
2695
- setCustomValidity(message);
2696
- return error;
2697
- }
2698
- }
2699
- }
2700
- if (validate) {
2701
- if (isFunction(validate)) {
2702
- const result = await validate(inputValue, formValues);
2703
- const validateError = getValidateError(result, inputRef);
2704
- if (validateError) {
2705
- error[name] = {
2706
- ...validateError,
2707
- ...appendErrorsCurry(INPUT_VALIDATION_RULES.validate, validateError.message)
2708
- };
2709
- if (!validateAllFieldCriteria) {
2710
- setCustomValidity(validateError.message);
2711
- return error;
2712
- }
2713
- }
2714
- } else if (isObject(validate)) {
2715
- let validationResult = {};
2716
- for (const key in validate) {
2717
- if (!isEmptyObject(validationResult) && !validateAllFieldCriteria) {
2718
- break;
2719
- }
2720
- const validateError = getValidateError(await validate[key](inputValue, formValues), inputRef, key);
2721
- if (validateError) {
2722
- validationResult = {
2723
- ...validateError,
2724
- ...appendErrorsCurry(key, validateError.message)
2725
- };
2726
- setCustomValidity(validateError.message);
2727
- if (validateAllFieldCriteria) {
2728
- error[name] = validationResult;
2729
- }
2730
- }
2731
- }
2732
- if (!isEmptyObject(validationResult)) {
2733
- error[name] = {
2734
- ref: inputRef,
2735
- ...validationResult
2736
- };
2737
- if (!validateAllFieldCriteria) {
2738
- return error;
2739
- }
2740
- }
2741
- }
2742
- }
2743
- setCustomValidity(true);
2744
- return error;
2745
- };
2746
- function baseGet(object2, updatePath) {
2747
- const length = updatePath.slice(0, -1).length;
2748
- let index = 0;
2749
- while (index < length) {
2750
- object2 = isUndefined(object2) ? index++ : object2[updatePath[index++]];
2751
- }
2752
- return object2;
2753
- }
2754
- function isEmptyArray(obj) {
2755
- for (const key in obj) {
2756
- if (obj.hasOwnProperty(key) && !isUndefined(obj[key])) {
2757
- return false;
2758
- }
2759
- }
2760
- return true;
2761
- }
2762
- function unset(object2, path) {
2763
- const paths = Array.isArray(path) ? path : isKey(path) ? [path] : stringToPath(path);
2764
- const childObject = paths.length === 1 ? object2 : baseGet(object2, paths);
2765
- const index = paths.length - 1;
2766
- const key = paths[index];
2767
- if (childObject) {
2768
- delete childObject[key];
2769
- }
2770
- if (index !== 0 && (isObject(childObject) && isEmptyObject(childObject) || Array.isArray(childObject) && isEmptyArray(childObject))) {
2771
- unset(object2, paths.slice(0, -1));
2772
- }
2773
- return object2;
2774
- }
2775
- function createSubject() {
2776
- let _observers = [];
2777
- const next = (value) => {
2778
- for (const observer of _observers) {
2779
- observer.next && observer.next(value);
2780
- }
2781
- };
2782
- const subscribe = (observer) => {
2783
- _observers.push(observer);
2784
- return {
2785
- unsubscribe: () => {
2786
- _observers = _observers.filter((o2) => o2 !== observer);
2787
- }
2788
- };
2789
- };
2790
- const unsubscribe = () => {
2791
- _observers = [];
2792
- };
2793
- return {
2794
- get observers() {
2795
- return _observers;
2796
- },
2797
- next,
2798
- subscribe,
2799
- unsubscribe
2800
- };
2801
- }
2802
- var isPrimitive = (value) => isNullOrUndefined(value) || !isObjectType(value);
2803
- function deepEqual(object1, object2) {
2804
- if (isPrimitive(object1) || isPrimitive(object2)) {
2805
- return object1 === object2;
2806
- }
2807
- if (isDateObject(object1) && isDateObject(object2)) {
2808
- return object1.getTime() === object2.getTime();
2809
- }
2810
- const keys1 = Object.keys(object1);
2811
- const keys2 = Object.keys(object2);
2812
- if (keys1.length !== keys2.length) {
2813
- return false;
2814
- }
2815
- for (const key of keys1) {
2816
- const val1 = object1[key];
2817
- if (!keys2.includes(key)) {
2818
- return false;
2819
- }
2820
- if (key !== "ref") {
2821
- const val2 = object2[key];
2822
- if (isDateObject(val1) && isDateObject(val2) || isObject(val1) && isObject(val2) || Array.isArray(val1) && Array.isArray(val2) ? !deepEqual(val1, val2) : val1 !== val2) {
2823
- return false;
2824
- }
2825
- }
2826
- }
2827
- return true;
2828
- }
2829
- var isMultipleSelect = (element) => element.type === `select-multiple`;
2830
- var isRadioOrCheckbox = (ref) => isRadioInput(ref) || isCheckBoxInput(ref);
2831
- var live = (ref) => isHTMLElement(ref) && ref.isConnected;
2832
- var objectHasFunction = (data) => {
2833
- for (const key in data) {
2834
- if (isFunction(data[key])) {
2835
- return true;
2836
- }
2837
- }
2838
- return false;
2839
- };
2840
- function markFieldsDirty(data, fields = {}) {
2841
- const isParentNodeArray = Array.isArray(data);
2842
- if (isObject(data) || isParentNodeArray) {
2843
- for (const key in data) {
2844
- if (Array.isArray(data[key]) || isObject(data[key]) && !objectHasFunction(data[key])) {
2845
- fields[key] = Array.isArray(data[key]) ? [] : {};
2846
- markFieldsDirty(data[key], fields[key]);
2847
- } else if (!isNullOrUndefined(data[key])) {
2848
- fields[key] = true;
2849
- }
2850
- }
2851
- }
2852
- return fields;
2853
- }
2854
- function getDirtyFieldsFromDefaultValues(data, formValues, dirtyFieldsFromValues) {
2855
- const isParentNodeArray = Array.isArray(data);
2856
- if (isObject(data) || isParentNodeArray) {
2857
- for (const key in data) {
2858
- if (Array.isArray(data[key]) || isObject(data[key]) && !objectHasFunction(data[key])) {
2859
- if (isUndefined(formValues) || isPrimitive(dirtyFieldsFromValues[key])) {
2860
- dirtyFieldsFromValues[key] = Array.isArray(data[key]) ? markFieldsDirty(data[key], []) : { ...markFieldsDirty(data[key]) };
2861
- } else {
2862
- getDirtyFieldsFromDefaultValues(data[key], isNullOrUndefined(formValues) ? {} : formValues[key], dirtyFieldsFromValues[key]);
2863
- }
2864
- } else {
2865
- dirtyFieldsFromValues[key] = !deepEqual(data[key], formValues[key]);
2866
- }
2867
- }
2868
- }
2869
- return dirtyFieldsFromValues;
2870
- }
2871
- var getDirtyFields = (defaultValues, formValues) => getDirtyFieldsFromDefaultValues(defaultValues, formValues, markFieldsDirty(formValues));
2872
- var getFieldValueAs = (value, { valueAsNumber, valueAsDate, setValueAs }) => isUndefined(value) ? value : valueAsNumber ? value === "" ? NaN : value ? +value : value : valueAsDate && isString$1(value) ? new Date(value) : setValueAs ? setValueAs(value) : value;
2873
- function getFieldValue(_f) {
2874
- const ref = _f.ref;
2875
- if (_f.refs ? _f.refs.every((ref2) => ref2.disabled) : ref.disabled) {
2876
- return;
2877
- }
2878
- if (isFileInput(ref)) {
2879
- return ref.files;
2880
- }
2881
- if (isRadioInput(ref)) {
2882
- return getRadioValue(_f.refs).value;
2883
- }
2884
- if (isMultipleSelect(ref)) {
2885
- return [...ref.selectedOptions].map(({ value }) => value);
2886
- }
2887
- if (isCheckBoxInput(ref)) {
2888
- return getCheckboxValue(_f.refs).value;
2889
- }
2890
- return getFieldValueAs(isUndefined(ref.value) ? _f.ref.value : ref.value, _f);
2891
- }
2892
- var getResolverOptions = (fieldsNames, _fields, criteriaMode, shouldUseNativeValidation) => {
2893
- const fields = {};
2894
- for (const name of fieldsNames) {
2895
- const field = get(_fields, name);
2896
- field && set(fields, name, field._f);
2897
- }
2898
- return {
2899
- criteriaMode,
2900
- names: [...fieldsNames],
2901
- fields,
2902
- shouldUseNativeValidation
2903
- };
2904
- };
2905
- var getRuleValue = (rule) => isUndefined(rule) ? rule : isRegex(rule) ? rule.source : isObject(rule) ? isRegex(rule.value) ? rule.value.source : rule.value : rule;
2906
- var hasValidation = (options2) => options2.mount && (options2.required || options2.min || options2.max || options2.maxLength || options2.minLength || options2.pattern || options2.validate);
2907
- function schemaErrorLookup(errors2, _fields, name) {
2908
- const error = get(errors2, name);
2909
- if (error || isKey(name)) {
2910
- return {
2911
- error,
2912
- name
2913
- };
2914
- }
2915
- const names = name.split(".");
2916
- while (names.length) {
2917
- const fieldName = names.join(".");
2918
- const field = get(_fields, fieldName);
2919
- const foundError = get(errors2, fieldName);
2920
- if (field && !Array.isArray(field) && name !== fieldName) {
2921
- return { name };
2922
- }
2923
- if (foundError && foundError.type) {
2924
- return {
2925
- name: fieldName,
2926
- error: foundError
2927
- };
2928
- }
2929
- names.pop();
2930
- }
2931
- return {
2932
- name
2933
- };
2934
- }
2935
- var skipValidation = (isBlurEvent, isTouched, isSubmitted, reValidateMode, mode) => {
2936
- if (mode.isOnAll) {
2937
- return false;
2938
- } else if (!isSubmitted && mode.isOnTouch) {
2939
- return !(isTouched || isBlurEvent);
2940
- } else if (isSubmitted ? reValidateMode.isOnBlur : mode.isOnBlur) {
2941
- return !isBlurEvent;
2942
- } else if (isSubmitted ? reValidateMode.isOnChange : mode.isOnChange) {
2943
- return isBlurEvent;
2944
- }
2945
- return true;
2946
- };
2947
- var unsetEmptyArray = (ref, name) => !compact(get(ref, name)).length && unset(ref, name);
2948
- const defaultOptions = {
2949
- mode: VALIDATION_MODE.onSubmit,
2950
- reValidateMode: VALIDATION_MODE.onChange,
2951
- shouldFocusError: true
2952
- };
2953
- function createFormControl(props = {}, flushRootRender) {
2954
- let _options = {
2955
- ...defaultOptions,
2956
- ...props
2957
- };
2958
- let _formState = {
2959
- submitCount: 0,
2960
- isDirty: false,
2961
- isLoading: isFunction(_options.defaultValues),
2962
- isValidating: false,
2963
- isSubmitted: false,
2964
- isSubmitting: false,
2965
- isSubmitSuccessful: false,
2966
- isValid: false,
2967
- touchedFields: {},
2968
- dirtyFields: {},
2969
- errors: {},
2970
- disabled: false
2971
- };
2972
- let _fields = {};
2973
- let _defaultValues = isObject(_options.defaultValues) || isObject(_options.values) ? cloneObject(_options.defaultValues || _options.values) || {} : {};
2974
- let _formValues = _options.shouldUnregister ? {} : cloneObject(_defaultValues);
2975
- let _state = {
2976
- action: false,
2977
- mount: false,
2978
- watch: false
2979
- };
2980
- let _names = {
2981
- mount: /* @__PURE__ */ new Set(),
2982
- unMount: /* @__PURE__ */ new Set(),
2983
- array: /* @__PURE__ */ new Set(),
2984
- watch: /* @__PURE__ */ new Set()
2985
- };
2986
- let delayErrorCallback;
2987
- let timer = 0;
2988
- const _proxyFormState = {
2989
- isDirty: false,
2990
- dirtyFields: false,
2991
- touchedFields: false,
2992
- isValidating: false,
2993
- isValid: false,
2994
- errors: false
2995
- };
2996
- const _subjects = {
2997
- values: createSubject(),
2998
- array: createSubject(),
2999
- state: createSubject()
3000
- };
3001
- const shouldCaptureDirtyFields = props.resetOptions && props.resetOptions.keepDirtyValues;
3002
- const validationModeBeforeSubmit = getValidationModes(_options.mode);
3003
- const validationModeAfterSubmit = getValidationModes(_options.reValidateMode);
3004
- const shouldDisplayAllAssociatedErrors = _options.criteriaMode === VALIDATION_MODE.all;
3005
- const debounce2 = (callback) => (wait) => {
3006
- clearTimeout(timer);
3007
- timer = setTimeout(callback, wait);
3008
- };
3009
- const _updateValid = async (shouldUpdateValid) => {
3010
- if (_proxyFormState.isValid || shouldUpdateValid) {
3011
- const isValid = _options.resolver ? isEmptyObject((await _executeSchema()).errors) : await executeBuiltInValidation(_fields, true);
3012
- if (isValid !== _formState.isValid) {
3013
- _subjects.state.next({
3014
- isValid
3015
- });
3016
- }
3017
- }
3018
- };
3019
- const _updateIsValidating = (value) => _proxyFormState.isValidating && _subjects.state.next({
3020
- isValidating: value
3021
- });
3022
- const _updateFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {
3023
- if (args && method) {
3024
- _state.action = true;
3025
- if (shouldUpdateFieldsAndState && Array.isArray(get(_fields, name))) {
3026
- const fieldValues = method(get(_fields, name), args.argA, args.argB);
3027
- shouldSetValues && set(_fields, name, fieldValues);
3028
- }
3029
- if (shouldUpdateFieldsAndState && Array.isArray(get(_formState.errors, name))) {
3030
- const errors2 = method(get(_formState.errors, name), args.argA, args.argB);
3031
- shouldSetValues && set(_formState.errors, name, errors2);
3032
- unsetEmptyArray(_formState.errors, name);
3033
- }
3034
- if (_proxyFormState.touchedFields && shouldUpdateFieldsAndState && Array.isArray(get(_formState.touchedFields, name))) {
3035
- const touchedFields = method(get(_formState.touchedFields, name), args.argA, args.argB);
3036
- shouldSetValues && set(_formState.touchedFields, name, touchedFields);
3037
- }
3038
- if (_proxyFormState.dirtyFields) {
3039
- _formState.dirtyFields = getDirtyFields(_defaultValues, _formValues);
3040
- }
3041
- _subjects.state.next({
3042
- name,
3043
- isDirty: _getDirty(name, values),
3044
- dirtyFields: _formState.dirtyFields,
3045
- errors: _formState.errors,
3046
- isValid: _formState.isValid
3047
- });
3048
- } else {
3049
- set(_formValues, name, values);
3050
- }
3051
- };
3052
- const updateErrors = (name, error) => {
3053
- set(_formState.errors, name, error);
3054
- _subjects.state.next({
3055
- errors: _formState.errors
3056
- });
3057
- };
3058
- const updateValidAndValue = (name, shouldSkipSetValueAs, value, ref) => {
3059
- const field = get(_fields, name);
3060
- if (field) {
3061
- const defaultValue = get(_formValues, name, isUndefined(value) ? get(_defaultValues, name) : value);
3062
- isUndefined(defaultValue) || ref && ref.defaultChecked || shouldSkipSetValueAs ? set(_formValues, name, shouldSkipSetValueAs ? defaultValue : getFieldValue(field._f)) : setFieldValue(name, defaultValue);
3063
- _state.mount && _updateValid();
3064
- }
3065
- };
3066
- const updateTouchAndDirty = (name, fieldValue, isBlurEvent, shouldDirty, shouldRender) => {
3067
- let shouldUpdateField = false;
3068
- let isPreviousDirty = false;
3069
- const output = {
3070
- name
3071
- };
3072
- if (!isBlurEvent || shouldDirty) {
3073
- if (_proxyFormState.isDirty) {
3074
- isPreviousDirty = _formState.isDirty;
3075
- _formState.isDirty = output.isDirty = _getDirty();
3076
- shouldUpdateField = isPreviousDirty !== output.isDirty;
3077
- }
3078
- const isCurrentFieldPristine = deepEqual(get(_defaultValues, name), fieldValue);
3079
- isPreviousDirty = get(_formState.dirtyFields, name);
3080
- isCurrentFieldPristine ? unset(_formState.dirtyFields, name) : set(_formState.dirtyFields, name, true);
3081
- output.dirtyFields = _formState.dirtyFields;
3082
- shouldUpdateField = shouldUpdateField || _proxyFormState.dirtyFields && isPreviousDirty !== !isCurrentFieldPristine;
3083
- }
3084
- if (isBlurEvent) {
3085
- const isPreviousFieldTouched = get(_formState.touchedFields, name);
3086
- if (!isPreviousFieldTouched) {
3087
- set(_formState.touchedFields, name, isBlurEvent);
3088
- output.touchedFields = _formState.touchedFields;
3089
- shouldUpdateField = shouldUpdateField || _proxyFormState.touchedFields && isPreviousFieldTouched !== isBlurEvent;
3090
- }
3091
- }
3092
- shouldUpdateField && shouldRender && _subjects.state.next(output);
3093
- return shouldUpdateField ? output : {};
3094
- };
3095
- const shouldRenderByError = (name, isValid, error, fieldState) => {
3096
- const previousFieldError = get(_formState.errors, name);
3097
- const shouldUpdateValid = _proxyFormState.isValid && isBoolean(isValid) && _formState.isValid !== isValid;
3098
- if (props.delayError && error) {
3099
- delayErrorCallback = debounce2(() => updateErrors(name, error));
3100
- delayErrorCallback(props.delayError);
3101
- } else {
3102
- clearTimeout(timer);
3103
- delayErrorCallback = null;
3104
- error ? set(_formState.errors, name, error) : unset(_formState.errors, name);
3105
- }
3106
- if ((error ? !deepEqual(previousFieldError, error) : previousFieldError) || !isEmptyObject(fieldState) || shouldUpdateValid) {
3107
- const updatedFormState = {
3108
- ...fieldState,
3109
- ...shouldUpdateValid && isBoolean(isValid) ? { isValid } : {},
3110
- errors: _formState.errors,
3111
- name
3112
- };
3113
- _formState = {
3114
- ..._formState,
3115
- ...updatedFormState
3116
- };
3117
- _subjects.state.next(updatedFormState);
3118
- }
3119
- _updateIsValidating(false);
3120
- };
3121
- const _executeSchema = async (name) => _options.resolver(_formValues, _options.context, getResolverOptions(name || _names.mount, _fields, _options.criteriaMode, _options.shouldUseNativeValidation));
3122
- const executeSchemaAndUpdateState = async (names) => {
3123
- const { errors: errors2 } = await _executeSchema(names);
3124
- if (names) {
3125
- for (const name of names) {
3126
- const error = get(errors2, name);
3127
- error ? set(_formState.errors, name, error) : unset(_formState.errors, name);
3128
- }
3129
- } else {
3130
- _formState.errors = errors2;
3131
- }
3132
- return errors2;
3133
- };
3134
- const executeBuiltInValidation = async (fields, shouldOnlyCheckValid, context = {
3135
- valid: true
3136
- }) => {
3137
- for (const name in fields) {
3138
- const field = fields[name];
3139
- if (field) {
3140
- const { _f, ...fieldValue } = field;
3141
- if (_f) {
3142
- const isFieldArrayRoot = _names.array.has(_f.name);
3143
- const fieldError = await validateField(field, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation && !shouldOnlyCheckValid, isFieldArrayRoot);
3144
- if (fieldError[_f.name]) {
3145
- context.valid = false;
3146
- if (shouldOnlyCheckValid) {
3147
- break;
3148
- }
3149
- }
3150
- !shouldOnlyCheckValid && (get(fieldError, _f.name) ? isFieldArrayRoot ? updateFieldArrayRootError(_formState.errors, fieldError, _f.name) : set(_formState.errors, _f.name, fieldError[_f.name]) : unset(_formState.errors, _f.name));
3151
- }
3152
- fieldValue && await executeBuiltInValidation(fieldValue, shouldOnlyCheckValid, context);
3153
- }
3154
- }
3155
- return context.valid;
3156
- };
3157
- const _removeUnmounted = () => {
3158
- for (const name of _names.unMount) {
3159
- const field = get(_fields, name);
3160
- field && (field._f.refs ? field._f.refs.every((ref) => !live(ref)) : !live(field._f.ref)) && unregister(name);
3161
- }
3162
- _names.unMount = /* @__PURE__ */ new Set();
3163
- };
3164
- const _getDirty = (name, data) => (name && data && set(_formValues, name, data), !deepEqual(getValues(), _defaultValues));
3165
- const _getWatch = (names, defaultValue, isGlobal) => generateWatchOutput(names, _names, {
3166
- ..._state.mount ? _formValues : isUndefined(defaultValue) ? _defaultValues : isString$1(names) ? { [names]: defaultValue } : defaultValue
3167
- }, isGlobal, defaultValue);
3168
- const _getFieldArray = (name) => compact(get(_state.mount ? _formValues : _defaultValues, name, props.shouldUnregister ? get(_defaultValues, name, []) : []));
3169
- const setFieldValue = (name, value, options2 = {}) => {
3170
- const field = get(_fields, name);
3171
- let fieldValue = value;
3172
- if (field) {
3173
- const fieldReference = field._f;
3174
- if (fieldReference) {
3175
- !fieldReference.disabled && set(_formValues, name, getFieldValueAs(value, fieldReference));
3176
- fieldValue = isHTMLElement(fieldReference.ref) && isNullOrUndefined(value) ? "" : value;
3177
- if (isMultipleSelect(fieldReference.ref)) {
3178
- [...fieldReference.ref.options].forEach((optionRef) => optionRef.selected = fieldValue.includes(optionRef.value));
3179
- } else if (fieldReference.refs) {
3180
- if (isCheckBoxInput(fieldReference.ref)) {
3181
- fieldReference.refs.length > 1 ? fieldReference.refs.forEach((checkboxRef) => (!checkboxRef.defaultChecked || !checkboxRef.disabled) && (checkboxRef.checked = Array.isArray(fieldValue) ? !!fieldValue.find((data) => data === checkboxRef.value) : fieldValue === checkboxRef.value)) : fieldReference.refs[0] && (fieldReference.refs[0].checked = !!fieldValue);
3182
- } else {
3183
- fieldReference.refs.forEach((radioRef) => radioRef.checked = radioRef.value === fieldValue);
3184
- }
3185
- } else if (isFileInput(fieldReference.ref)) {
3186
- fieldReference.ref.value = "";
3187
- } else {
3188
- fieldReference.ref.value = fieldValue;
3189
- if (!fieldReference.ref.type) {
3190
- _subjects.values.next({
3191
- name,
3192
- values: { ..._formValues }
3193
- });
3194
- }
3195
- }
3196
- }
3197
- }
3198
- (options2.shouldDirty || options2.shouldTouch) && updateTouchAndDirty(name, fieldValue, options2.shouldTouch, options2.shouldDirty, true);
3199
- options2.shouldValidate && trigger(name);
3200
- };
3201
- const setValues = (name, value, options2) => {
3202
- for (const fieldKey in value) {
3203
- const fieldValue = value[fieldKey];
3204
- const fieldName = `${name}.${fieldKey}`;
3205
- const field = get(_fields, fieldName);
3206
- (_names.array.has(name) || !isPrimitive(fieldValue) || field && !field._f) && !isDateObject(fieldValue) ? setValues(fieldName, fieldValue, options2) : setFieldValue(fieldName, fieldValue, options2);
3207
- }
3208
- };
3209
- const setValue = (name, value, options2 = {}) => {
3210
- const field = get(_fields, name);
3211
- const isFieldArray = _names.array.has(name);
3212
- const cloneValue = cloneObject(value);
3213
- set(_formValues, name, cloneValue);
3214
- if (isFieldArray) {
3215
- _subjects.array.next({
3216
- name,
3217
- values: { ..._formValues }
3218
- });
3219
- if ((_proxyFormState.isDirty || _proxyFormState.dirtyFields) && options2.shouldDirty) {
3220
- _subjects.state.next({
3221
- name,
3222
- dirtyFields: getDirtyFields(_defaultValues, _formValues),
3223
- isDirty: _getDirty(name, cloneValue)
3224
- });
3225
- }
3226
- } else {
3227
- field && !field._f && !isNullOrUndefined(cloneValue) ? setValues(name, cloneValue, options2) : setFieldValue(name, cloneValue, options2);
3228
- }
3229
- isWatched(name, _names) && _subjects.state.next({ ..._formState });
3230
- _subjects.values.next({
3231
- name,
3232
- values: { ..._formValues }
3233
- });
3234
- !_state.mount && flushRootRender();
3235
- };
3236
- const onChange = async (event) => {
3237
- const target = event.target;
3238
- let name = target.name;
3239
- let isFieldValueUpdated = true;
3240
- const field = get(_fields, name);
3241
- const getCurrentFieldValue = () => target.type ? getFieldValue(field._f) : getEventValue(event);
3242
- const _updateIsFieldValueUpdated = (fieldValue) => {
3243
- isFieldValueUpdated = Number.isNaN(fieldValue) || fieldValue === get(_formValues, name, fieldValue);
3244
- };
3245
- if (field) {
3246
- let error;
3247
- let isValid;
3248
- const fieldValue = getCurrentFieldValue();
3249
- const isBlurEvent = event.type === EVENTS.BLUR || event.type === EVENTS.FOCUS_OUT;
3250
- const shouldSkipValidation = !hasValidation(field._f) && !_options.resolver && !get(_formState.errors, name) && !field._f.deps || skipValidation(isBlurEvent, get(_formState.touchedFields, name), _formState.isSubmitted, validationModeAfterSubmit, validationModeBeforeSubmit);
3251
- const watched = isWatched(name, _names, isBlurEvent);
3252
- set(_formValues, name, fieldValue);
3253
- if (isBlurEvent) {
3254
- field._f.onBlur && field._f.onBlur(event);
3255
- delayErrorCallback && delayErrorCallback(0);
3256
- } else if (field._f.onChange) {
3257
- field._f.onChange(event);
3258
- }
3259
- const fieldState = updateTouchAndDirty(name, fieldValue, isBlurEvent, false);
3260
- const shouldRender = !isEmptyObject(fieldState) || watched;
3261
- !isBlurEvent && _subjects.values.next({
3262
- name,
3263
- type: event.type,
3264
- values: { ..._formValues }
3265
- });
3266
- if (shouldSkipValidation) {
3267
- _proxyFormState.isValid && _updateValid();
3268
- return shouldRender && _subjects.state.next({ name, ...watched ? {} : fieldState });
3269
- }
3270
- !isBlurEvent && watched && _subjects.state.next({ ..._formState });
3271
- _updateIsValidating(true);
3272
- if (_options.resolver) {
3273
- const { errors: errors2 } = await _executeSchema([name]);
3274
- _updateIsFieldValueUpdated(fieldValue);
3275
- if (isFieldValueUpdated) {
3276
- const previousErrorLookupResult = schemaErrorLookup(_formState.errors, _fields, name);
3277
- const errorLookupResult = schemaErrorLookup(errors2, _fields, previousErrorLookupResult.name || name);
3278
- error = errorLookupResult.error;
3279
- name = errorLookupResult.name;
3280
- isValid = isEmptyObject(errors2);
3281
- }
3282
- } else {
3283
- error = (await validateField(field, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation))[name];
3284
- _updateIsFieldValueUpdated(fieldValue);
3285
- if (isFieldValueUpdated) {
3286
- if (error) {
3287
- isValid = false;
3288
- } else if (_proxyFormState.isValid) {
3289
- isValid = await executeBuiltInValidation(_fields, true);
3290
- }
3291
- }
3292
- }
3293
- if (isFieldValueUpdated) {
3294
- field._f.deps && trigger(field._f.deps);
3295
- shouldRenderByError(name, isValid, error, fieldState);
3296
- }
3297
- }
3298
- };
3299
- const _focusInput = (ref, key) => {
3300
- if (get(_formState.errors, key) && ref.focus) {
3301
- ref.focus();
3302
- return 1;
3303
- }
3304
- return;
3305
- };
3306
- const trigger = async (name, options2 = {}) => {
3307
- let isValid;
3308
- let validationResult;
3309
- const fieldNames = convertToArrayPayload(name);
3310
- _updateIsValidating(true);
3311
- if (_options.resolver) {
3312
- const errors2 = await executeSchemaAndUpdateState(isUndefined(name) ? name : fieldNames);
3313
- isValid = isEmptyObject(errors2);
3314
- validationResult = name ? !fieldNames.some((name2) => get(errors2, name2)) : isValid;
3315
- } else if (name) {
3316
- validationResult = (await Promise.all(fieldNames.map(async (fieldName) => {
3317
- const field = get(_fields, fieldName);
3318
- return await executeBuiltInValidation(field && field._f ? { [fieldName]: field } : field);
3319
- }))).every(Boolean);
3320
- !(!validationResult && !_formState.isValid) && _updateValid();
3321
- } else {
3322
- validationResult = isValid = await executeBuiltInValidation(_fields);
3323
- }
3324
- _subjects.state.next({
3325
- ...!isString$1(name) || _proxyFormState.isValid && isValid !== _formState.isValid ? {} : { name },
3326
- ..._options.resolver || !name ? { isValid } : {},
3327
- errors: _formState.errors,
3328
- isValidating: false
3329
- });
3330
- options2.shouldFocus && !validationResult && iterateFieldsByAction(_fields, _focusInput, name ? fieldNames : _names.mount);
3331
- return validationResult;
3332
- };
3333
- const getValues = (fieldNames) => {
3334
- const values = {
3335
- ..._defaultValues,
3336
- ..._state.mount ? _formValues : {}
3337
- };
3338
- return isUndefined(fieldNames) ? values : isString$1(fieldNames) ? get(values, fieldNames) : fieldNames.map((name) => get(values, name));
3339
- };
3340
- const getFieldState = (name, formState) => ({
3341
- invalid: !!get((formState || _formState).errors, name),
3342
- isDirty: !!get((formState || _formState).dirtyFields, name),
3343
- isTouched: !!get((formState || _formState).touchedFields, name),
3344
- error: get((formState || _formState).errors, name)
3345
- });
3346
- const clearErrors = (name) => {
3347
- name && convertToArrayPayload(name).forEach((inputName) => unset(_formState.errors, inputName));
3348
- _subjects.state.next({
3349
- errors: name ? _formState.errors : {}
3350
- });
3351
- };
3352
- const setError = (name, error, options2) => {
3353
- const ref = (get(_fields, name, { _f: {} })._f || {}).ref;
3354
- set(_formState.errors, name, {
3355
- ...error,
3356
- ref
3357
- });
3358
- _subjects.state.next({
3359
- name,
3360
- errors: _formState.errors,
3361
- isValid: false
3362
- });
3363
- options2 && options2.shouldFocus && ref && ref.focus && ref.focus();
3364
- };
3365
- const watch = (name, defaultValue) => isFunction(name) ? _subjects.values.subscribe({
3366
- next: (payload) => name(_getWatch(void 0, defaultValue), payload)
3367
- }) : _getWatch(name, defaultValue, true);
3368
- const unregister = (name, options2 = {}) => {
3369
- for (const fieldName of name ? convertToArrayPayload(name) : _names.mount) {
3370
- _names.mount.delete(fieldName);
3371
- _names.array.delete(fieldName);
3372
- if (!options2.keepValue) {
3373
- unset(_fields, fieldName);
3374
- unset(_formValues, fieldName);
3375
- }
3376
- !options2.keepError && unset(_formState.errors, fieldName);
3377
- !options2.keepDirty && unset(_formState.dirtyFields, fieldName);
3378
- !options2.keepTouched && unset(_formState.touchedFields, fieldName);
3379
- !_options.shouldUnregister && !options2.keepDefaultValue && unset(_defaultValues, fieldName);
3380
- }
3381
- _subjects.values.next({
3382
- values: { ..._formValues }
3383
- });
3384
- _subjects.state.next({
3385
- ..._formState,
3386
- ...!options2.keepDirty ? {} : { isDirty: _getDirty() }
3387
- });
3388
- !options2.keepIsValid && _updateValid();
3389
- };
3390
- const _updateDisabledField = ({ disabled, name, field, fields, value }) => {
3391
- if (isBoolean(disabled)) {
3392
- const inputValue = disabled ? void 0 : isUndefined(value) ? getFieldValue(field ? field._f : get(fields, name)._f) : value;
3393
- set(_formValues, name, inputValue);
3394
- updateTouchAndDirty(name, inputValue, false, false, true);
3395
- }
3396
- };
3397
- const register = (name, options2 = {}) => {
3398
- let field = get(_fields, name);
3399
- const disabledIsDefined = isBoolean(options2.disabled);
3400
- set(_fields, name, {
3401
- ...field || {},
3402
- _f: {
3403
- ...field && field._f ? field._f : { ref: { name } },
3404
- name,
3405
- mount: true,
3406
- ...options2
3407
- }
3408
- });
3409
- _names.mount.add(name);
3410
- if (field) {
3411
- _updateDisabledField({
3412
- field,
3413
- disabled: options2.disabled,
3414
- name
3415
- });
3416
- } else {
3417
- updateValidAndValue(name, true, options2.value);
3418
- }
3419
- return {
3420
- ...disabledIsDefined ? { disabled: options2.disabled } : {},
3421
- ..._options.progressive ? {
3422
- required: !!options2.required,
3423
- min: getRuleValue(options2.min),
3424
- max: getRuleValue(options2.max),
3425
- minLength: getRuleValue(options2.minLength),
3426
- maxLength: getRuleValue(options2.maxLength),
3427
- pattern: getRuleValue(options2.pattern)
3428
- } : {},
3429
- name,
3430
- onChange,
3431
- onBlur: onChange,
3432
- ref: (ref) => {
3433
- if (ref) {
3434
- register(name, options2);
3435
- field = get(_fields, name);
3436
- const fieldRef = isUndefined(ref.value) ? ref.querySelectorAll ? ref.querySelectorAll("input,select,textarea")[0] || ref : ref : ref;
3437
- const radioOrCheckbox = isRadioOrCheckbox(fieldRef);
3438
- const refs = field._f.refs || [];
3439
- if (radioOrCheckbox ? refs.find((option) => option === fieldRef) : fieldRef === field._f.ref) {
3440
- return;
3441
- }
3442
- set(_fields, name, {
3443
- _f: {
3444
- ...field._f,
3445
- ...radioOrCheckbox ? {
3446
- refs: [
3447
- ...refs.filter(live),
3448
- fieldRef,
3449
- ...Array.isArray(get(_defaultValues, name)) ? [{}] : []
3450
- ],
3451
- ref: { type: fieldRef.type, name }
3452
- } : { ref: fieldRef }
3453
- }
3454
- });
3455
- updateValidAndValue(name, false, void 0, fieldRef);
3456
- } else {
3457
- field = get(_fields, name, {});
3458
- if (field._f) {
3459
- field._f.mount = false;
3460
- }
3461
- (_options.shouldUnregister || options2.shouldUnregister) && !(isNameInFieldArray(_names.array, name) && _state.action) && _names.unMount.add(name);
3462
- }
3463
- }
3464
- };
3465
- };
3466
- const _focusError = () => _options.shouldFocusError && iterateFieldsByAction(_fields, _focusInput, _names.mount);
3467
- const _disableForm = (disabled) => {
3468
- if (isBoolean(disabled)) {
3469
- _subjects.state.next({ disabled });
3470
- iterateFieldsByAction(_fields, (ref) => {
3471
- ref.disabled = disabled;
3472
- }, 0, false);
3473
- }
3474
- };
3475
- const handleSubmit = (onValid, onInvalid) => async (e) => {
3476
- if (e) {
3477
- e.preventDefault && e.preventDefault();
3478
- e.persist && e.persist();
3479
- }
3480
- let fieldValues = cloneObject(_formValues);
3481
- _subjects.state.next({
3482
- isSubmitting: true
3483
- });
3484
- if (_options.resolver) {
3485
- const { errors: errors2, values } = await _executeSchema();
3486
- _formState.errors = errors2;
3487
- fieldValues = values;
3488
- } else {
3489
- await executeBuiltInValidation(_fields);
3490
- }
3491
- unset(_formState.errors, "root");
3492
- if (isEmptyObject(_formState.errors)) {
3493
- _subjects.state.next({
3494
- errors: {}
3495
- });
3496
- await onValid(fieldValues, e);
3497
- } else {
3498
- if (onInvalid) {
3499
- await onInvalid({ ..._formState.errors }, e);
3500
- }
3501
- _focusError();
3502
- setTimeout(_focusError);
3503
- }
3504
- _subjects.state.next({
3505
- isSubmitted: true,
3506
- isSubmitting: false,
3507
- isSubmitSuccessful: isEmptyObject(_formState.errors),
3508
- submitCount: _formState.submitCount + 1,
3509
- errors: _formState.errors
3510
- });
3511
- };
3512
- const resetField = (name, options2 = {}) => {
3513
- if (get(_fields, name)) {
3514
- if (isUndefined(options2.defaultValue)) {
3515
- setValue(name, get(_defaultValues, name));
3516
- } else {
3517
- setValue(name, options2.defaultValue);
3518
- set(_defaultValues, name, options2.defaultValue);
3519
- }
3520
- if (!options2.keepTouched) {
3521
- unset(_formState.touchedFields, name);
3522
- }
3523
- if (!options2.keepDirty) {
3524
- unset(_formState.dirtyFields, name);
3525
- _formState.isDirty = options2.defaultValue ? _getDirty(name, get(_defaultValues, name)) : _getDirty();
3526
- }
3527
- if (!options2.keepError) {
3528
- unset(_formState.errors, name);
3529
- _proxyFormState.isValid && _updateValid();
3530
- }
3531
- _subjects.state.next({ ..._formState });
3532
- }
3533
- };
3534
- const _reset = (formValues, keepStateOptions = {}) => {
3535
- const updatedValues = formValues ? cloneObject(formValues) : _defaultValues;
3536
- const cloneUpdatedValues = cloneObject(updatedValues);
3537
- const values = formValues && !isEmptyObject(formValues) ? cloneUpdatedValues : _defaultValues;
3538
- if (!keepStateOptions.keepDefaultValues) {
3539
- _defaultValues = updatedValues;
3540
- }
3541
- if (!keepStateOptions.keepValues) {
3542
- if (keepStateOptions.keepDirtyValues || shouldCaptureDirtyFields) {
3543
- for (const fieldName of _names.mount) {
3544
- get(_formState.dirtyFields, fieldName) ? set(values, fieldName, get(_formValues, fieldName)) : setValue(fieldName, get(values, fieldName));
3545
- }
3546
- } else {
3547
- if (isWeb && isUndefined(formValues)) {
3548
- for (const name of _names.mount) {
3549
- const field = get(_fields, name);
3550
- if (field && field._f) {
3551
- const fieldReference = Array.isArray(field._f.refs) ? field._f.refs[0] : field._f.ref;
3552
- if (isHTMLElement(fieldReference)) {
3553
- const form = fieldReference.closest("form");
3554
- if (form) {
3555
- form.reset();
3556
- break;
3557
- }
3558
- }
3559
- }
3560
- }
3561
- }
3562
- _fields = {};
3563
- }
3564
- _formValues = props.shouldUnregister ? keepStateOptions.keepDefaultValues ? cloneObject(_defaultValues) : {} : cloneObject(values);
3565
- _subjects.array.next({
3566
- values: { ...values }
3567
- });
3568
- _subjects.values.next({
3569
- values: { ...values }
3570
- });
3571
- }
3572
- _names = {
3573
- mount: /* @__PURE__ */ new Set(),
3574
- unMount: /* @__PURE__ */ new Set(),
3575
- array: /* @__PURE__ */ new Set(),
3576
- watch: /* @__PURE__ */ new Set(),
3577
- watchAll: false,
3578
- focus: ""
3579
- };
3580
- !_state.mount && flushRootRender();
3581
- _state.mount = !_proxyFormState.isValid || !!keepStateOptions.keepIsValid;
3582
- _state.watch = !!props.shouldUnregister;
3583
- _subjects.state.next({
3584
- submitCount: keepStateOptions.keepSubmitCount ? _formState.submitCount : 0,
3585
- isDirty: keepStateOptions.keepDirty ? _formState.isDirty : !!(keepStateOptions.keepDefaultValues && !deepEqual(formValues, _defaultValues)),
3586
- isSubmitted: keepStateOptions.keepIsSubmitted ? _formState.isSubmitted : false,
3587
- dirtyFields: keepStateOptions.keepDirtyValues ? _formState.dirtyFields : keepStateOptions.keepDefaultValues && formValues ? getDirtyFields(_defaultValues, formValues) : {},
3588
- touchedFields: keepStateOptions.keepTouched ? _formState.touchedFields : {},
3589
- errors: keepStateOptions.keepErrors ? _formState.errors : {},
3590
- isSubmitSuccessful: keepStateOptions.keepIsSubmitSuccessful ? _formState.isSubmitSuccessful : false,
3591
- isSubmitting: false
3592
- });
3593
- };
3594
- const reset = (formValues, keepStateOptions) => _reset(isFunction(formValues) ? formValues(_formValues) : formValues, keepStateOptions);
3595
- const setFocus = (name, options2 = {}) => {
3596
- const field = get(_fields, name);
3597
- const fieldReference = field && field._f;
3598
- if (fieldReference) {
3599
- const fieldRef = fieldReference.refs ? fieldReference.refs[0] : fieldReference.ref;
3600
- if (fieldRef.focus) {
3601
- fieldRef.focus();
3602
- options2.shouldSelect && fieldRef.select();
3603
- }
3604
- }
3605
- };
3606
- const _updateFormState = (updatedFormState) => {
3607
- _formState = {
3608
- ..._formState,
3609
- ...updatedFormState
3610
- };
3611
- };
3612
- const _resetDefaultValues = () => isFunction(_options.defaultValues) && _options.defaultValues().then((values) => {
3613
- reset(values, _options.resetOptions);
3614
- _subjects.state.next({
3615
- isLoading: false
3616
- });
3617
- });
3618
- return {
3619
- control: {
3620
- register,
3621
- unregister,
3622
- getFieldState,
3623
- handleSubmit,
3624
- setError,
3625
- _executeSchema,
3626
- _getWatch,
3627
- _getDirty,
3628
- _updateValid,
3629
- _removeUnmounted,
3630
- _updateFieldArray,
3631
- _updateDisabledField,
3632
- _getFieldArray,
3633
- _reset,
3634
- _resetDefaultValues,
3635
- _updateFormState,
3636
- _disableForm,
3637
- _subjects,
3638
- _proxyFormState,
3639
- get _fields() {
3640
- return _fields;
3641
- },
3642
- get _formValues() {
3643
- return _formValues;
3644
- },
3645
- get _state() {
3646
- return _state;
3647
- },
3648
- set _state(value) {
3649
- _state = value;
3650
- },
3651
- get _defaultValues() {
3652
- return _defaultValues;
3653
- },
3654
- get _names() {
3655
- return _names;
3656
- },
3657
- set _names(value) {
3658
- _names = value;
3659
- },
3660
- get _formState() {
3661
- return _formState;
3662
- },
3663
- set _formState(value) {
3664
- _formState = value;
3665
- },
3666
- get _options() {
3667
- return _options;
3668
- },
3669
- set _options(value) {
3670
- _options = {
3671
- ..._options,
3672
- ...value
3673
- };
3674
- }
3675
- },
3676
- trigger,
3677
- register,
3678
- handleSubmit,
3679
- watch,
3680
- setValue,
3681
- getValues,
3682
- reset,
3683
- resetField,
3684
- clearErrors,
3685
- unregister,
3686
- setError,
3687
- setFocus,
3688
- getFieldState
3689
- };
3690
- }
3691
- function useForm(props = {}) {
3692
- const _formControl = Cn.useRef();
3693
- const _values = Cn.useRef();
3694
- const [formState, updateFormState] = Cn.useState({
3695
- isDirty: false,
3696
- isValidating: false,
3697
- isLoading: isFunction(props.defaultValues),
3698
- isSubmitted: false,
3699
- isSubmitting: false,
3700
- isSubmitSuccessful: false,
3701
- isValid: false,
3702
- submitCount: 0,
3703
- dirtyFields: {},
3704
- touchedFields: {},
3705
- errors: {},
3706
- disabled: false,
3707
- defaultValues: isFunction(props.defaultValues) ? void 0 : props.defaultValues
3708
- });
3709
- if (!_formControl.current) {
3710
- _formControl.current = {
3711
- ...createFormControl(props, () => updateFormState((formState2) => ({ ...formState2 }))),
3712
- formState
3713
- };
3714
- }
3715
- const control = _formControl.current.control;
3716
- control._options = props;
3717
- useSubscribe({
3718
- subject: control._subjects.state,
3719
- next: (value) => {
3720
- if (shouldRenderFormState(value, control._proxyFormState, control._updateFormState, true)) {
3721
- updateFormState({ ...control._formState });
3722
- }
3723
- }
3724
- });
3725
- Cn.useEffect(() => control._disableForm(props.disabled), [control, props.disabled]);
3726
- Cn.useEffect(() => {
3727
- if (control._proxyFormState.isDirty) {
3728
- const isDirty = control._getDirty();
3729
- if (isDirty !== formState.isDirty) {
3730
- control._subjects.state.next({
3731
- isDirty
3732
- });
3733
- }
3734
- }
3735
- }, [control, formState.isDirty]);
3736
- Cn.useEffect(() => {
3737
- if (props.values && !deepEqual(props.values, _values.current)) {
3738
- control._reset(props.values, control._options.resetOptions);
3739
- _values.current = props.values;
3740
- } else {
3741
- control._resetDefaultValues();
3742
- }
3743
- }, [props.values, control]);
3744
- Cn.useEffect(() => {
3745
- if (!control._state.mount) {
3746
- control._updateValid();
3747
- control._state.mount = true;
3748
- }
3749
- if (control._state.watch) {
3750
- control._state.watch = false;
3751
- control._subjects.state.next({ ...control._formState });
3752
- }
3753
- control._removeUnmounted();
3754
- });
3755
- _formControl.current.formState = getProxyFormState(formState, control);
3756
- return _formControl.current;
3757
- }
3758
- var t = function(e, t2, i2) {
3759
- if (e && "reportValidity" in e) {
3760
- var n2 = get(i2, t2);
3761
- e.setCustomValidity(n2 && n2.message || ""), e.reportValidity();
3762
- }
3763
- }, i$1 = function(r, e) {
3764
- var i2 = function(i3) {
3765
- var n3 = e.fields[i3];
3766
- n3 && n3.ref && "reportValidity" in n3.ref ? t(n3.ref, i3, r) : n3.refs && n3.refs.forEach(function(e2) {
3767
- return t(e2, i3, r);
3768
- });
3769
- };
3770
- for (var n2 in e.fields)
3771
- i2(n2);
3772
- }, n = function(t2, n2) {
3773
- n2.shouldUseNativeValidation && i$1(t2, n2);
3774
- var f = {};
3775
- for (var s in t2) {
3776
- var u = get(n2.fields, s), c = Object.assign(t2[s] || {}, { ref: u && u.ref });
3777
- if (a$1(n2.names || Object.keys(t2), s)) {
3778
- var l = Object.assign({}, o(get(f, s)));
3779
- set(l, "root", c), set(f, s, l);
3780
- } else
3781
- set(f, s, c);
3782
- }
3783
- return f;
3784
- }, o = function(r) {
3785
- return Array.isArray(r) ? r.filter(Boolean) : [];
3786
- }, a$1 = function(r, e) {
3787
- return r.some(function(r2) {
3788
- return r2.startsWith(e + ".");
3789
- });
3790
- };
3791
- var a = function(r, e) {
3792
- for (var t2 = {}; r.issues.length; ) {
3793
- var o2 = r.issues[0];
3794
- if (o2.path) {
3795
- var a2 = o2.path.map(function(r2) {
3796
- return r2.key;
3797
- }).join(".");
3798
- if (t2[a2] || (t2[a2] = { message: o2.message, type: o2.validation }), e) {
3799
- var i2 = t2[a2].types, s = i2 && i2[o2.validation];
3800
- t2[a2] = appendErrors(a2, e, t2, o2.validation, s ? [].concat(s, o2.message) : o2.message);
3801
- }
3802
- r.issues.shift();
3803
- }
3804
- }
3805
- return t2;
3806
- }, i = function(n$1, i2, s) {
3807
- return void 0 === s && (s = {}), function(u, c, f) {
3808
- try {
3809
- return Promise.resolve(function(r, o2) {
3810
- try {
3811
- var a2 = function() {
3812
- function r2(r3) {
3813
- return { values: s.raw ? u : r3, errors: {} };
3814
- }
3815
- var o3 = Object.assign({}, { abortEarly: false, abortPipeEarly: false }, i2);
3816
- return "sync" === s.mode ? r2(parse(n$1, u, o3)) : Promise.resolve(parseAsync(n$1, u, o3)).then(r2);
3817
- }();
3818
- } catch (r2) {
3819
- return o2(r2);
3820
- }
3821
- return a2 && a2.then ? a2.then(void 0, o2) : a2;
3822
- }(0, function(e) {
3823
- if (e instanceof ValiError)
3824
- return { values: {}, errors: n(a(e, !f.shouldUseNativeValidation && "all" === f.criteriaMode), f) };
3825
- throw e;
3826
- }));
3827
- } catch (r) {
3828
- return Promise.reject(r);
3829
- }
3830
- };
3831
- };
3832
- const LABEL_HEIGHT = 27;
3833
- const GAP = 12;
3834
- const PADDING = 10;
3835
- const isMultipleChoiceSubmission = isSubmissionOfType("enum");
3836
- const getResolver$3 = (config) => {
3837
- const length = {
3838
- min: config.minSelected ?? 0,
3839
- max: config.maxSelected ?? config.options.length
3840
- };
3841
- return i(object({
3842
- checked: transform(record(boolean()), (o2) => Object.entries(o2).filter(([_2, v]) => v).map(([k2, _2]) => k2), [maxLength(length.max, `Please select at most ${length.max} option${length.max !== 1 ? "s" : ""}`), minLength(length.min, `Please select at least ${length.min} option${length.min !== 1 ? "s" : ""}`)])
3843
- }));
3844
- };
3845
- const MultipleChoiceOption = k$1(({
3846
- option,
3847
- ...props
3848
- }, ref) => {
3849
- return o$1(k, {
3850
- children: [o$1("input", {
3851
- class: "peer sr-only h-full",
3852
- type: "checkbox",
3853
- ...props,
3854
- ref
3855
- }), o$1("label", {
3856
- class: "bg-lowest hover:bg-neutral-2 active:outline-neutral-8 ease-expo-out outline-divider text-neutral-11 peer-checked:outline-accent-7 peer-checked:bg-accent-2 peer-checked:text-accent-9 peer-focus-visible:ring-accent-9 peer-focus-visible:ring-offset-accent-7 block cursor-pointer select-none rounded-2xl px-3 py-1.5 outline outline-1 ring-0 ring-transparent transition-all selection:bg-transparent peer-focus-visible:ring-4",
3857
- htmlFor: props.id,
3858
- children: option.label
3859
- })]
3860
- });
3861
- });
3862
- const multipleChoiceListClass = cva("gutter-stable flex w-full flex-1 flex-wrap gap-3 overflow-y-auto rounded-xl p-2.5 pr-4", {
3863
- variants: {
3864
- variant: {
3865
- // In cases where there is only one option, we want to center it
3866
- singleOption: "justify-center",
3867
- // Two choices with exactly 1 min 1 max
3868
- booleanLike: booleanButtonListClass
3869
- }
3870
- }
3871
- });
3872
- const ChatInputMultipleChoice = ({
3873
- input,
3874
- onSubmitSuccess
3875
- }) => {
3876
- var _a, _b;
3877
- const submission = input.key ? (_a = store.current$.value.flow) == null ? void 0 : _a.data.submissions[input.key] : void 0;
3878
- const isSingleChoice = (input.config.minSelected === 1 || input.config.minSelected === void 0) && input.config.maxSelected === 1;
3879
- const isBooleanLike = isSingleChoice && input.config.options.length === 2;
3880
- const {
3881
- register,
3882
- handleSubmit,
3883
- formState: {
3884
- errors: errors2
3885
- }
3886
- } = useForm({
3887
- defaultValues: {
3888
- checked: isSingleChoice ? {} : isMultipleChoiceSubmission(submission) ? Object.fromEntries(submission.value.map((key) => [key, true])) : {}
3889
- },
3890
- resolver: getResolver$3(input.config)
3891
- });
3892
- const focusRef = useFocusOnMount();
3893
- if (isBooleanLike) {
3894
- return o$1("ul", {
3895
- style: {
3896
- maxHeight: 6.5 * LABEL_HEIGHT + 5 * GAP + 2 * PADDING
3897
- },
3898
- class: multipleChoiceListClass({
3899
- variant: "booleanLike"
3900
- }),
3901
- children: input.config.options.map((option, i2) => o$1("li", {
3902
- class: "flex-1",
3903
- children: o$1(BooleanOption, {
3904
- type: "submit",
3905
- ref: (e) => {
3906
- if (e && i2 === 0) {
3907
- focusRef.current = e;
3908
- }
3909
- },
3910
- label: option.label,
3911
- value: "true",
3912
- onClick: () => onSubmitSuccess({
3913
- type: "enum",
3914
- value: [option.value]
3915
- })
3916
- })
3917
- }, option.value))
3918
- });
3919
- }
3920
- return o$1("form", {
3921
- noValidate: true,
3922
- onSubmit: (e) => {
3923
- return handleSubmit((submission2) => {
3924
- const checked = submission2.checked;
3925
- onSubmitSuccess({
3926
- type: "enum",
3927
- value: checked
3928
- });
3929
- })(e);
3930
- },
3931
- children: [o$1("div", {
3932
- class: "flex items-center gap-1",
3933
- children: [o$1("ul", {
3934
- style: {
3935
- maxHeight: 6.5 * LABEL_HEIGHT + 5 * GAP + 2 * PADDING
3936
- },
3937
- class: multipleChoiceListClass({
3938
- variant: input.config.options.length === 1 ? "singleOption" : void 0
3939
- }),
3940
- children: input.config.options.map((option, i2) => {
3941
- const id = `checked.${option.value}`;
3942
- const {
3943
- ref: setRef,
3944
- ...props
3945
- } = register(id);
3946
- return o$1("li", {
3947
- class: "relative",
3948
- children: o$1(MultipleChoiceOption, {
3949
- option,
3950
- autoFocus: i2 === 0,
3951
- ref: (e) => {
3952
- if (e && i2 === 0) {
3953
- focusRef.current = e;
3954
- }
3955
- setRef(e);
3956
- },
3957
- id,
3958
- ...props,
3959
- onClick: isSingleChoice ? () => onSubmitSuccess({
3960
- type: "enum",
3961
- value: [option.value]
3962
- }) : void 0
3963
- })
3964
- }, option.value);
3965
- })
3966
- }), o$1("div", {
3967
- class: "flex flex-col items-center gap-2 pr-2.5 pt-2.5",
3968
- children: [isSingleChoice ? null : o$1(SendButton, {}), input.config.minSelected === 0 && o$1(SkipButton, {
3969
- type: "button",
3970
- onClick: () => onSubmitSuccess({
3971
- type: "enum",
3972
- value: []
3973
- })
3974
- })]
3975
- })]
3976
- }), o$1("div", {
3977
- class: "px-1",
3978
- children: o$1(InputError, {
3979
- error: (_b = errors2.checked) == null ? void 0 : _b.root
3980
- })
3981
- })]
3982
- });
3983
- };
3984
- const isNumberSubmission = isSubmissionOfType("number");
3985
- const errors$1 = {
3986
- number: () => "Please enter a valid number",
3987
- min: (min) => `Please enter a number greater than or equal to ${min}`,
3988
- max: (max) => `Please enter a number less than or equal to ${max}`,
3989
- decimalCases: (decimalCases) => `Please enter a number with at most ${decimalCases} decimal cases`
3990
- };
3991
- const getResolver$2 = (config) => {
3992
- const min = config.min ?? Number.MIN_SAFE_INTEGER;
3993
- const max = config.max ?? Number.MAX_SAFE_INTEGER;
3994
- const decimalCases = config.decimalCases ?? 0;
3995
- return i(object({
3996
- number: number(errors$1.number(), [minValue(min, errors$1.min(min)), maxValue(max, errors$1.max(max)), custom((value) => {
3997
- return value === Number(value.toFixed(decimalCases));
3998
- }, errors$1.decimalCases(decimalCases))])
3999
- }));
4000
- };
4001
- const ChatInputNumber = ({
4002
- input,
4003
- onSubmitSuccess
4004
- }) => {
4005
- var _a;
4006
- const defaultValue = input.config.defaultValue;
4007
- const submission = input.key ? (_a = store.current$.value.flow) == null ? void 0 : _a.data.submissions[input.key] : void 0;
4008
- const {
4009
- register,
4010
- handleSubmit,
4011
- formState: {
4012
- errors: errors2
4013
- }
4014
- } = useForm({
4015
- defaultValues: {
4016
- number: defaultValue ? Number(defaultValue) : isNumberSubmission(submission) ? submission.value : void 0
4017
- },
4018
- resolver: getResolver$2(input.config)
4019
- });
4020
- const {
4021
- ref: setRef,
4022
- ...props
4023
- } = register("number", {
4024
- required: !input.config.optional,
4025
- valueAsNumber: true
4026
- });
4027
- const ref = _$1();
4028
- y(() => {
4029
- if (ref.current) {
4030
- ref.current.focus();
4031
- ref.current.select();
4032
- }
4033
- }, []);
4034
- return o$1("form", {
4035
- class: "flex flex-col gap-1 p-2.5",
4036
- onSubmit: handleSubmit((submission2) => {
4037
- if (submission2.number === void 0)
4038
- return;
4039
- onSubmitSuccess({
4040
- type: "number",
4041
- value: submission2.number
4042
- });
4043
- }),
4044
- children: [o$1("div", {
4045
- class: "flex items-center gap-2",
4046
- children: [o$1("div", {
4047
- class: "relative min-w-0 flex-grow",
4048
- children: [o$1("input", {
4049
- ...props,
4050
- id: "chat-input",
4051
- autocomplete: "off",
4052
- autoCapitalize: "off",
4053
- autoCorrect: "off",
4054
- autoFocus: true,
4055
- ref: (element) => {
4056
- if (element) {
4057
- ref.current = element;
4058
- }
4059
- setRef(element);
4060
- },
4061
- type: "text",
4062
- min: input.config.min,
4063
- max: input.config.max,
4064
- class: "outline-divider ease-expo-out placeholder:text-neutral-10 text-neutral-12 focus-visible:outline-accent-7 caret-accent-9 bg-lowest [type=number:-webkit-inner-spin-button] w-full rounded-full px-3 py-1 text-base outline outline-2 transition-all [-webkit-outer-spin-button:none]",
4065
- placeholder: input.config.placeholder
4066
- }), input.config.optional && o$1(SkipButton, {
4067
- class: "absolute right-0 top-0",
4068
- onClick: () => onSubmitSuccess(null)
4069
- })]
4070
- }), o$1(SendButton, {})]
4071
- }), o$1(InputError, {
4072
- error: errors2.number
4073
- })]
4074
- });
4075
- };
4076
- const getPhoneNumberParts = (input) => {
4077
- if (input === "")
4078
- return {
4079
- countryCode: "",
4080
- phoneNumber: ""
4081
- };
4082
- const country = Object.entries(countries).find((obj) => {
4083
- return input.startsWith(obj[1]);
4084
- });
4085
- const countryCode = country ? country[1] : "";
4086
- const phoneNumber = input.replace(countryCode, "");
4087
- if (!/^\d+$/.test(phoneNumber)) {
4088
- return {
4089
- countryCode: "",
4090
- phoneNumber: ""
4091
- };
4092
- }
4093
- return {
4094
- countryCode,
4095
- phoneNumber
4096
- };
4097
- };
4098
- const UK_CODE = "44";
4099
- const invalidPhoneErrorMessage = "That doesn’t look like a valid phone number";
4100
- const errorMessages = (config) => ({
4101
- min: `The phone number needs to be at least ${config.minChars} digits long.`,
4102
- max: `The phone number can't be longer than ${config.maxChars} digits.`
4103
- });
4104
- const isTextSubmission$1 = isSubmissionOfType("string");
4105
- const PhoneSchema = string(invalidPhoneErrorMessage, [regex(/^\+?[0-9 -]+$/, invalidPhoneErrorMessage)]);
4106
- const CountryCodeSchema = string("Please select a country code", [regex(/^\+?[0-9 -]+$/, invalidPhoneErrorMessage)]);
4107
- const getResolver$1 = () => {
4108
- return i(object({
4109
- countryCode: CountryCodeSchema,
4110
- phoneNumber: transform(PhoneSchema, (value) => value.replace(/[^0-9]/g, ""), [])
4111
- }));
4112
- };
4113
- const ChatInputPhoneNumber = ({
4114
- input,
4115
- onSubmitSuccess
4116
- }) => {
4117
- var _a;
4118
- const submission = input.key ? (_a = store.current$.value.flow) == null ? void 0 : _a.data.submissions[input.key] : void 0;
4119
- const [error, setError] = h();
4120
- const {
4121
- register,
4122
- handleSubmit,
4123
- formState: {
4124
- errors: errors2
4125
- },
4126
- watch
4127
- } = useForm({
4128
- defaultValues: input.config.defaultValue ? getPhoneNumberParts(input.config.defaultValue) : isTextSubmission$1(submission) ? getPhoneNumberParts(submission.value) : {
4129
- countryCode: UK_CODE,
4130
- phoneNumber: ""
4131
- },
4132
- resolver: getResolver$1()
4133
- });
4134
- const {
4135
- ref: setRef,
4136
- ...props
4137
- } = register("phoneNumber", {
4138
- required: !input.config.optional
4139
- });
4140
- const inputRef = _$1();
4141
- const countryCodeValue = watch("countryCode");
4142
- y(() => {
4143
- if (inputRef.current) {
4144
- inputRef.current.focus();
4145
- inputRef.current.select();
4146
- }
4147
- }, []);
4148
- return o$1("form", {
4149
- noValidate: true,
4150
- class: "flex flex-col gap-1 p-2.5",
4151
- onSubmit: handleSubmit((submission2) => {
4152
- const submissionBody = submission2.phoneNumber.replace(/[^0-9]/g, "");
4153
- const submissionCountryCode = submission2.countryCode.replace(/[^0-9]/g, "");
4154
- setError(void 0);
4155
- if (submissionBody.length + submissionCountryCode.length > (input.config.maxChars || Infinity))
4156
- return setError(errorMessages(input.config).max);
4157
- if (submissionBody.length + submissionCountryCode.length < (input.config.minChars || 0))
4158
- return setError(errorMessages(input.config).min);
4159
- onSubmitSuccess({
4160
- type: "string",
4161
- value: countryCodeValue + submission2.phoneNumber
4162
- });
4163
- }),
4164
- children: [o$1("div", {
4165
- class: "flex items-center gap-2",
4166
- children: [o$1("div", {
4167
- class: "relative flex min-w-0 flex-1 flex-grow gap-2",
4168
- children: [o$1("label", {
4169
- class: "text-neutral-12 bg-lowest hover:bg-neutral-5 placeholder:text-neutral-8 focus-visible:outline-accent-7 focus-within:bg-neutral-5 focus-within:outline-accent-7 outline-divider relative flex h-full cursor-pointer appearance-none items-center justify-center overflow-hidden text-ellipsis whitespace-nowrap rounded-l-full border-solid px-3 py-1.5 text-center text-base outline outline-2 transition-all focus-within:outline-none",
4170
- htmlFor: `isdk_phone_${input.key}`,
4171
- children: [o$1("span", {
4172
- children: ["+", countryCodeValue]
4173
- }), o$1("select", {
4174
- ...register("countryCode", {}),
4175
- id: `isdk_phone_${input.key}`,
4176
- class: "absolute inset-0 opacity-0",
4177
- children: Object.entries(countries).map(([name, code]) => o$1("option", {
4178
- value: code,
4179
- children: [name, " (+", code, ")"]
4180
- }, name))
4181
- })]
4182
- }), o$1("input", {
4183
- ...props,
4184
- id: "chat-input",
4185
- type: "tel",
4186
- inputMode: "tel",
4187
- autocomplete: "off",
4188
- autoCapitalize: "off",
4189
- autoCorrect: "off",
4190
- autoFocus: true,
4191
- ref: (element) => {
4192
- if (element) {
4193
- inputRef.current = element;
4194
- }
4195
- setRef(element);
4196
- },
4197
- class: "outline-divider ease-expo-out placeholder:text-neutral-10 text-neutral-12 focus-visible:outline-accent-7 caret-accent-9 bg-lowest flex-1 rounded-r-full px-3 py-1 text-base outline outline-2 transition-all",
4198
- placeholder: input.config.placeholder
4199
- }), input.config.optional && o$1(SkipButton, {
4200
- class: "absolute right-0 top-0",
4201
- onClick: () => onSubmitSuccess(null)
4202
- })]
4203
- }), o$1(SendButton, {})]
4204
- }), o$1(InputError, {
4205
- error: errors2.countryCode || errors2.phoneNumber || {
4206
- message: error
4207
- }
4208
- })]
4209
- });
4210
- };
4211
- const ChatInputSubmit = ({
4212
- input,
4213
- onSubmitSuccess
4214
- }) => {
4215
- return o$1("div", {
4216
- class: "flex flex-col items-center py-3",
4217
- children: o$1("button", {
4218
- class: "bg-accent-9 hover:bg-accent-10 active:bg-submit-bg-active hover:border-accent-10 active:border-submit-bg-active border-accent-9 ring-accent-6 focus-visible:outline-accent-8 ring-offset-neutral-1 flex cursor-pointer rounded-full border border-solid px-5 py-3 pr-4 text-white outline-none ring-1 ring-offset-[1.5px] transition-all duration-300 focus-visible:outline-2 active:ring-2 active:ring-offset-2",
4219
- name: input.key,
4220
- onClick: () => {
4221
- onSubmitSuccess(null);
4222
- },
4223
- children: o$1("span", {
4224
- class: "flex items-center gap-1.5",
4225
- children: [o$1("span", {
4226
- class: "inline-flex items-center text-sm font-medium",
4227
- children: input.config.label || "Submit"
4228
- }), o$1("svg", {
4229
- stroke: "currentColor",
4230
- "stroke-width": "1.5",
4231
- width: "16",
4232
- height: "16",
4233
- viewBox: "0 0 16 16",
4234
- fill: "none",
4235
- xmlns: "http://www.w3.org/2000/svg",
4236
- children: [o$1("path", {
4237
- d: "M4 8L8 4L12 8"
4238
- }), o$1("path", {
4239
- d: "M8 4V13"
4240
- })]
4241
- })]
4242
- })
4243
- })
4244
- });
4245
- };
4246
- const errors = {
4247
- empty: "Please enter some text",
4248
- email: "That doesn’t look like a valid email address",
4249
- phone: "That doesn’t look like a valid phone number",
4250
- url: "That doesn’t look like a valid URL"
4251
- };
4252
- const inputFormatToProps = {
4253
- email: {
4254
- type: "email",
4255
- inputMode: "email",
4256
- formNoValidate: true
4257
- },
4258
- text: {
4259
- type: "text",
4260
- inputMode: "text"
4261
- },
4262
- url: {
4263
- type: "url",
4264
- inputMode: "url",
4265
- formNoValidate: true
4266
- }
4267
- };
4268
- const isTextSubmission = isSubmissionOfType("string");
4269
- const getResolver = (config) => {
4270
- const configErrors = {
4271
- maxLength: `Please enter no more than ${config.maxChars ?? 999} characters`,
4272
- minLength: `Please enter ${config.minChars ?? 1} or more characters`
4273
- };
4274
- return i(object({
4275
- text: {
4276
- email: string(errors.email, [email(errors.email), minLength(config.minChars ?? 1, configErrors.minLength), maxLength(config.maxChars ?? Infinity, configErrors.maxLength)]),
4277
- text: string([minLength(config.minChars ?? 1, configErrors.minLength), maxLength(config.maxChars ?? Infinity, configErrors.maxLength)]),
4278
- url: string([url(errors.url), minLength(config.minChars ?? 1, configErrors.minLength), maxLength(config.maxChars ?? Infinity, configErrors.maxLength)])
4279
- }[config.format]
4280
- }));
4281
- };
4282
- const ChatInputText = ({
4283
- input,
4284
- onSubmitSuccess
4285
- }) => {
4286
- var _a;
4287
- const submission = input.key ? (_a = store.current$.value.flow) == null ? void 0 : _a.data.submissions[input.key] : void 0;
4288
- const defaultValue = input.config.defaultValue;
4289
- const {
4290
- register,
4291
- handleSubmit,
4292
- formState: {
4293
- errors: errors2
4294
- }
4295
- } = useForm({
4296
- defaultValues: {
4297
- text: defaultValue ? defaultValue : isTextSubmission(submission) ? submission.value : ""
4298
- },
4299
- resolver: getResolver(input.config)
4300
- });
4301
- const {
4302
- ref: setRef,
4303
- ...props
4304
- } = register("text", {
4305
- required: !input.config.optional
4306
- });
4307
- const inputRef = _$1();
4308
- y(() => {
4309
- if (inputRef.current) {
4310
- inputRef.current.focus();
4311
- inputRef.current.select();
4312
- }
4313
- }, []);
4314
- return o$1("form", {
4315
- noValidate: true,
4316
- class: "flex flex-col gap-1 p-2.5",
4317
- onSubmit: handleSubmit((submission2) => {
4318
- onSubmitSuccess({
4319
- type: "string",
4320
- value: submission2.text
4321
- });
4322
- }),
4323
- children: [o$1("div", {
4324
- class: "flex items-center gap-2",
4325
- children: [o$1("div", {
4326
- class: "relative min-w-0 flex-1",
4327
- children: [o$1("input", {
4328
- id: "chat-input",
4329
- ...props,
4330
- ...inputFormatToProps[input.config.format],
4331
- autocomplete: "off",
4332
- autoCapitalize: "off",
4333
- autoCorrect: "off",
4334
- autoFocus: true,
4335
- ref: (element) => {
4336
- if (element) {
4337
- inputRef.current = element;
4338
- }
4339
- setRef(element);
4340
- },
4341
- class: "outline-divider ease-expo-out placeholder:text-neutral-10 text-neutral-12 focus-visible:outline-accent-7 caret-accent-9 bg-lowest w-full rounded-full px-3 py-1 text-base outline outline-2 transition-all",
4342
- placeholder: input.config.placeholder
4343
- }), input.config.optional && o$1(SkipButton, {
4344
- class: "absolute right-0 top-0",
4345
- onClick: () => onSubmitSuccess(null)
4346
- })]
4347
- }), o$1(SendButton, {})]
4348
- }), o$1(InputError, {
4349
- error: errors2.text
4350
- })]
4351
- });
4352
- };
4353
- const ChatInput = () => {
4354
- var _a;
4355
- const input = (_a = store.current$.value.flow) == null ? void 0 : _a.data.currentInput;
4356
- const [inputContentRef, bounds] = useMeasure();
4357
- const inputWrapperRef = _$1(null);
4358
- store.inputHeight$.value = bounds.height;
4359
- p(() => {
4360
- const wrapper = inputWrapperRef.current;
4361
- if (!wrapper)
4362
- return;
4363
- wrapper.addEventListener("transitionstart", chatStore.scrollToEnd.smooth);
4364
- wrapper.addEventListener("transitioncancel", chatStore.scrollToEnd.smooth);
4365
- wrapper.addEventListener("transitionend", chatStore.scrollToEnd.smooth);
4366
- return () => {
4367
- wrapper.removeEventListener("transitionstart", chatStore.scrollToEnd.smooth);
4368
- wrapper.removeEventListener("transitioncancel", chatStore.scrollToEnd.smooth);
4369
- wrapper.removeEventListener("transitionend", chatStore.scrollToEnd.smooth);
4370
- };
4371
- }, []);
4372
- return o$1("div", {
4373
- ref: inputWrapperRef,
4374
- class: "ease-expo-out absolute bottom-0 w-full overflow-hidden rounded-b-3xl backdrop-blur-xl transition-all duration-700 will-change-[height]",
4375
- style: {
4376
- height: bounds.height
4377
- },
4378
- children: o$1("div", {
4379
- ref: inputContentRef,
4380
- class: "border-divider flex flex-col justify-end border-t",
4381
- children: N({
4382
- input
4383
- }).with({
4384
- input: _.nullish
4385
- }, () => o$1("div", {
4386
- class: "flex items-center gap-2 p-2.5",
4387
- children: [o$1("input", {
4388
- "aria-hidden": "true",
4389
- id: "chat-input",
4390
- class: "outline-divider flex-grow rounded-full bg-transparent px-3 py-1 text-base outline outline-2",
4391
- disabled: true
4392
- }), o$1(SendButton, {
4393
- disabled: true,
4394
- "aria-hidden": "true",
4395
- tabIndex: -1
4396
- })]
4397
- })).with({
4398
- input: {
4399
- type: "text"
4400
- }
4401
- }, (props) => o$1(ChatInputText, {
4402
- onSubmitSuccess: chatStore.onSubmitSuccessFn$.value,
4403
- ...props
4404
- })).with({
4405
- input: {
4406
- type: "phone"
4407
- }
4408
- }, (props) => o$1(ChatInputPhoneNumber, {
4409
- onSubmitSuccess: chatStore.onSubmitSuccessFn$.value,
4410
- ...props
4411
- })).with({
4412
- input: {
4413
- type: "multiple-choice"
4414
- }
4415
- }, (props) => o$1(ChatInputMultipleChoice, {
4416
- onSubmitSuccess: chatStore.onSubmitSuccessFn$.value,
4417
- ...props
4418
- })).with({
4419
- input: {
4420
- type: "boolean"
4421
- }
4422
- }, (props) => o$1(ChatInputBoolean, {
4423
- onSubmitSuccess: chatStore.onSubmitSuccessFn$.value,
4424
- ...props
4425
- })).with({
4426
- input: {
4427
- type: "file"
4428
- }
4429
- }, (props) => o$1(ChatInputFile, {
4430
- onSubmitSuccess: chatStore.onSubmitSuccessFn$.value,
4431
- ...props
4432
- })).with({
4433
- input: {
4434
- type: "submit"
4435
- }
4436
- }, (props) => o$1(ChatInputSubmit, {
4437
- onSubmitSuccess: chatStore.onSubmitSuccessFn$.value,
4438
- ...props
4439
- })).with({
4440
- input: {
4441
- type: "address"
4442
- }
4443
- }, (props) => o$1(ChatInputAddress, {
4444
- onSubmitSuccess: chatStore.onSubmitSuccessFn$.value,
4445
- ...props
4446
- })).with({
4447
- input: {
4448
- type: "number"
4449
- }
4450
- }, (props) => o$1(ChatInputNumber, {
4451
- onSubmitSuccess: chatStore.onSubmitSuccessFn$.value,
4452
- ...props
4453
- })).exhaustive()
4454
- })
4455
- });
4456
- };
4457
- var isRegExp = function(re) {
4458
- return re instanceof RegExp;
4459
- };
4460
- var escapeRegExp = function escapeRegExp2(string2) {
4461
- var reRegExpChar = /[\\^$.*+?()[\]{}|]/g, reHasRegExpChar = RegExp(reRegExpChar.source);
4462
- return string2 && reHasRegExpChar.test(string2) ? string2.replace(reRegExpChar, "\\$&") : string2;
4463
- };
4464
- var isString = function(value) {
4465
- return typeof value === "string";
4466
- };
4467
- var flatten = function(array) {
4468
- var newArray = [];
4469
- array.forEach(function(item) {
4470
- if (Array.isArray(item)) {
4471
- newArray = newArray.concat(item);
4472
- } else {
4473
- newArray.push(item);
4474
- }
4475
- });
4476
- return newArray;
4477
- };
4478
- function replaceString(str, match, fn) {
4479
- var curCharStart = 0;
4480
- var curCharLen = 0;
4481
- if (str === "") {
4482
- return str;
4483
- } else if (!str || !isString(str)) {
4484
- throw new TypeError("First argument to react-string-replace#replaceString must be a string");
4485
- }
4486
- var re = match;
4487
- if (!isRegExp(re)) {
4488
- re = new RegExp("(" + escapeRegExp(re) + ")", "gi");
4489
- }
4490
- var result = str.split(re);
4491
- for (var i2 = 1, length = result.length; i2 < length; i2 += 2) {
4492
- if (result[i2] === void 0 || result[i2 - 1] === void 0) {
4493
- console.warn("reactStringReplace: Encountered undefined value during string replacement. Your RegExp may not be working the way you expect.");
4494
- continue;
4495
- }
4496
- curCharLen = result[i2].length;
4497
- curCharStart += result[i2 - 1].length;
4498
- result[i2] = fn(result[i2], i2, curCharStart);
4499
- curCharStart += curCharLen;
4500
- }
4501
- return result;
4502
- }
4503
- var reactStringReplace = function reactStringReplace2(source, match, fn) {
4504
- if (!Array.isArray(source))
4505
- source = [source];
4506
- return flatten(source.map(function(x) {
4507
- return isString(x) ? replaceString(x, match, fn) : x;
4508
- }));
4509
- };
4510
- const reactStringReplace$1 = /* @__PURE__ */ getDefaultExportFromCjs(reactStringReplace);
4511
- const mdLinkRegexp = /(\[[^\]]+\]\([^)]+\))/g;
4512
- const mdLinkPartsRegexp = /\[([^\]]+)\]\(([^)]+)\)/;
4513
- const urlRegexp = /(https?:\/\/[^\s]+)/g;
4514
- const emRegexp = /_(.*?)_/g;
4515
- const strongRegexp = /\*\*(.*?)\*\*/g;
4516
- const inlineLinkClass = "text-accent-10 hover:text-accent-11 no-underline underline-offset-2 hover:underline";
4517
- const parseMarkdownToJSX = (input) => {
4518
- const withLink = reactStringReplace$1(input, mdLinkRegexp, (mdLink, i2) => {
4519
- const [, text, url2] = mdLink.match(mdLinkPartsRegexp) ?? [];
4520
- if (!url2)
4521
- return o$1("span", {
4522
- children: "INVALID LINK"
4523
- });
4524
- return o$1("a", {
4525
- class: inlineLinkClass,
4526
- href: url2,
4527
- children: text ?? url2
4528
- }, url2 + i2);
4529
- });
4530
- const withUrl = reactStringReplace$1(withLink, urlRegexp, (url2, i2) => o$1("a", {
4531
- class: inlineLinkClass,
4532
- href: url2,
4533
- children: url2
4534
- }, url2 + i2));
4535
- const withEm = reactStringReplace$1(withUrl, emRegexp, (match, i2) => o$1("em", {
4536
- children: match
4537
- }, match + i2));
4538
- const withStrong = reactStringReplace$1(withEm, strongRegexp, (match, i2) => o$1("strong", {
4539
- children: match
4540
- }, match + i2));
4541
- return withStrong;
4542
- };
4543
- const chatBubbleVariants = cva("select-text max-w-[min(100%,24rem)] [text-wrap:pretty] leading-snug flex-shrink min-w-[2rem] py-2 px-3 rounded-[18px] min-h-[36px] break-words relative", {
4544
- variants: {
4545
- side: {
4546
- left: "bg-bubble-weak-bg text-neutral-12 shadow-surface-sm outline outline-1 outline-bubble-weak rounded-bl-md",
4547
- right: "ml-auto bg-accent-9 text-white rounded-br-md shadow-surface-sm shadow-bubble-strong-shadow"
4548
- },
4549
- animate: {
4550
- true: "animate-bubble-in",
4551
- false: ""
4552
- }
4553
- },
4554
- defaultVariants: {
4555
- side: "left"
4556
- }
4557
- });
4558
- const ChatBubble = ({
4559
- children,
4560
- className,
4561
- animate,
4562
- side,
4563
- ...props
4564
- }) => {
4565
- return o$1("p", {
4566
- style: {
4567
- transformOrigin: side === "left" ? "0% 50%" : "100% 50%"
4568
- },
4569
- class: chatBubbleVariants({
4570
- className,
4571
- side,
4572
- animate
4573
- }),
4574
- ...props,
4575
- children
4576
- });
4577
- };
4578
- const LinkMessage = ({
4579
- message
4580
- }) => {
4581
- return o$1("div", {
4582
- class: "bg-accent-3 flex w-full items-center justify-center overflow-hidden rounded-xl px-2 py-2",
4583
- children: o$1("a", {
4584
- onClick: message.onClick,
4585
- class: "bg-lowest shadow-surface-sm ring-accent-6 hover:ring-accent-8 active:bg-accent-2 active:text-accent-10 text-accent-9 focus-visible:ring-accent-7/50 text-wrap-balance flex items-center gap-1.5 rounded-full py-2 pl-4 pr-2.5 text-center no-underline ring-1 transition-all focus:outline-none focus-visible:ring-4 focus-visible:ring-offset-2",
4586
- target: "_blank",
4587
- href: message.href,
4588
- children: [message.text, o$1("svg", {
4589
- class: "flex-none",
4590
- width: "15",
4591
- height: "15",
4592
- viewBox: "0 0 15 15",
4593
- fill: "none",
4594
- xmlns: "http://www.w3.org/2000/svg",
4595
- children: o$1("path", {
4596
- d: "M3.64645 11.3536C3.45118 11.1583 3.45118 10.8417 3.64645 10.6465L10.2929 4L6 4C5.72386 4 5.5 3.77614 5.5 3.5C5.5 3.22386 5.72386 3 6 3L11.5 3C11.6326 3 11.7598 3.05268 11.8536 3.14645C11.9473 3.24022 12 3.36739 12 3.5L12 9.00001C12 9.27615 11.7761 9.50001 11.5 9.50001C11.2239 9.50001 11 9.27615 11 9.00001V4.70711L4.35355 11.3536C4.15829 11.5488 3.84171 11.5488 3.64645 11.3536Z",
4597
- fill: "currentColor",
4598
- "fill-rule": "evenodd",
4599
- "clip-rule": "evenodd"
4600
- })
4601
- })]
4602
- })
4603
- });
4604
- };
4605
- const TypingIndicator = ({
4606
- className,
4607
- ...props
4608
- }) => {
4609
- p(() => {
4610
- chatStore.scrollToEnd.smooth();
4611
- });
4612
- return o$1("div", {
4613
- "aria-hidden": true,
4614
- children: chatStore.isBotTyping$.value === true ? o$1("div", {
4615
- "aria-label": "Typing…",
4616
- class: clsx("flex gap-1 p-4", className),
4617
- ...props,
4618
- children: Array.from({
4619
- length: 3
4620
- }, (_2, i2) => o$1("div", {
4621
- class: "bg-accent-9 h-1.5 w-1.5 animate-bounce rounded-full",
4622
- style: {
4623
- animationDelay: `${-i2 * 200}ms`
4624
- }
4625
- }))
4626
- }) : void 0
4627
- });
4628
- };
4629
- const authorToSide = {
4630
- bot: "left",
4631
- user: "right"
4632
- };
4633
- const systemMessageStyle = cva("w-full select-none py-2 text-wrap-balance text-center text-[10px] uppercase tracking-widest drop-shadow-[0_1.5px_var(--i-color-n-1)]", {
4634
- variants: {
4635
- variant: {
4636
- info: "text-neutral-8",
4637
- warning: "text-[#FFC107]",
4638
- error: "text-error-9",
4639
- success: "text-[#4CAF50]"
4640
- }
4641
- }
4642
- });
4643
- const Conversation = ({
4644
- lastSentMessageFooter
4645
- }) => {
4646
- var _a;
4647
- const messages = ((_a = store.current$.value.flow) == null ? void 0 : _a.data.messages) ?? [];
4648
- p(() => {
4649
- chatStore.scrollToEnd.smooth();
4650
- }, [messages.length]);
4651
- return o$1("ol", {
4652
- "aria-label": "Chat messages",
4653
- class: "mt-auto flex flex-col justify-end gap-2 p-2 pt-[calc(var(--header-height)+1rem)]",
4654
- children: [messages.map((message, i2) => {
4655
- return o$1(k, {
4656
- children: o$1("li", {
4657
- class: "flex",
4658
- children: N(message).with({
4659
- type: "system"
4660
- }, (message2) => o$1("p", {
4661
- class: systemMessageStyle({
4662
- variant: message2.variant
4663
- }),
4664
- children: message2.text
4665
- })).with({
4666
- type: "text",
4667
- author: _.union("bot", "user")
4668
- }, (message2) => {
4669
- const isLastSentMessage = message2.author === "user" && !messages.slice(i2 + 1).some((m) => m.type === "text" && m.author === "user");
4670
- const isLastMessage = i2 === messages.length - 1;
4671
- const body = message2.author === "bot" ? parseMarkdownToJSX(message2.text) : message2.text;
4672
- return o$1(ChatBubble, {
4673
- animate: isLastMessage,
4674
- side: authorToSide[message2.author],
4675
- children: [body, isLastSentMessage ? lastSentMessageFooter : null]
4676
- }, i2);
4677
- }).with({
4678
- type: "link"
4679
- }, (message2) => o$1(LinkMessage, {
4680
- message: message2
4681
- })).with({
4682
- type: "image"
4683
- }, (image) => o$1("img", {
4684
- class: "shadow-surface-md w-full max-w-[min(100%,24rem)] rounded-2xl",
4685
- src: image.url,
4686
- style: {
4687
- aspectRatio: image.width / image.height
4688
- }
4689
- })).with({
4690
- type: "file"
4691
- }, (file) => {
4692
- return o$1(FileThumbnail, {
4693
- class: file.author === "bot" ? void 0 : "ml-auto",
4694
- file: {
4695
- name: file.fileName,
4696
- sizeKb: file.fileSizeKb
4697
- }
4698
- });
4699
- }).with({
4700
- type: "loading"
4701
- }, (message2) => {
4702
- const lastMessage = messages[messages.length - 1];
4703
- const isLastMessage = message2 === lastMessage;
4704
- if (!isLastMessage || chatStore.isBotTyping$.value)
4705
- return null;
4706
- return o$1("div", {
4707
- class: "flex flex-grow flex-col items-center justify-center",
4708
- children: o$1(LoadingIndicator, {
4709
- class: "text-neutral-6 h-8 w-8"
4710
- })
4711
- });
4712
- }).exhaustive()
4713
- })
4714
- }, i2);
4715
- }), o$1(TypingIndicator, {}, "typing")]
4716
- });
4717
- };
4718
- const ChatbotBody = ({
4719
- logger,
4720
- apiClient,
4721
- analytics
4722
- }) => {
4723
- const {
4724
- flow
4725
- } = store.current$.value;
4726
- invariant(flow, "Flow is required to exist to show chatbot body");
4727
- const view = store.viewState$.value;
4728
- const {
4729
- chatRef,
4730
- chatService
4731
- } = useChatService();
4732
- const [undoFn, setUndoFn] = h();
4733
- y(() => {
4734
- if (view === "maximised")
4735
- chatStore.scrollToEnd.instant();
4736
- }, [view]);
4737
- y(() => {
4738
- var _a, _b;
4739
- const {
4740
- state,
4741
- flow: currentApplication
4742
- } = store.current$.peek();
4743
- if (state !== "loaded")
4744
- throw new Error(ERROR_MESSAGES.invalid_state);
4745
- let fromNodeId = currentApplication.data.nodeHistory.at(-1);
4746
- chatStore.scrollToEnd.instant();
4747
- store.setInput(void 0);
4748
- if (currentApplication.data.isFinished)
4749
- return;
4750
- if (fromNodeId === void 0) {
4751
- fromNodeId = getHeadOrThrow(flow.nodes).id;
4752
- store.setCurrentNodeId(fromNodeId);
4753
- analytics.log({
4754
- event: "FLOW_START",
4755
- properties: {
4756
- flow_id: flow.id,
4757
- flow_version: flow.version,
4758
- flow_session_id: currentApplication.data.flowSessionId,
4759
- flow_build: flow.build,
4760
- job: flow.job
4761
- },
4762
- customProperties: (_a = flow.analytics) == null ? void 0 : _a.customProperties
4763
- });
4764
- } else {
4765
- store.removeMessagesSentByNodeIds([fromNodeId]);
4766
- }
4767
- const {
4768
- interpret: interpret2,
4769
- abort,
4770
- undo
4771
- } = createFlowInterpreter({
4772
- context: flow.context,
4773
- analytics: {
4774
- service: analytics,
4775
- customProperties: (_b = flow.analytics) == null ? void 0 : _b.customProperties
4776
- },
4777
- apiClient,
4778
- logger,
4779
- flow,
4780
- chatService,
4781
- // We need to get fresh submissions, that’s why we call `peek` here.
4782
- getSubmissions: () => {
4783
- var _a2;
4784
- return (_a2 = store.current$.peek().flow) == null ? void 0 : _a2.data.submissions;
4785
- },
4786
- onInterpret: (node, prevNode) => {
4787
- var _a2;
4788
- const currentState = store.current$.peek().flow;
4789
- invariant(currentState);
4790
- if (prevNode) {
4791
- currentState.data.sequence = currentState.data.sequence + 1;
4792
- analytics.log({
4793
- event: "FLOW_NODE",
4794
- properties: {
4795
- flow_id: flow.id,
4796
- flow_version: flow.version,
4797
- from_node_id: prevNode.id,
4798
- flow_build: flow.build,
4799
- to_node_id: node.id,
4800
- sequence: currentState.data.sequence,
4801
- flow_session_id: currentState.data.flowSessionId,
4802
- job: flow.job
4803
- },
4804
- customProperties: (_a2 = flow.analytics) == null ? void 0 : _a2.customProperties
4805
- });
4806
- }
4807
- store.setCurrentNodeId(node.id);
4808
- },
4809
- onFlowEnd: async () => {
4810
- var _a2;
4811
- store.markAsFinished();
4812
- const currentState = store.current$.peek().flow;
4813
- invariant(currentState);
4814
- analytics.log({
4815
- event: "FLOW_END",
4816
- properties: {
4817
- flow_id: flow.id,
4818
- flow_version: flow.version,
4819
- flow_session_id: currentState.data.flowSessionId,
4820
- flow_build: flow.build,
4821
- job: flow.job
4822
- },
4823
- customProperties: (_a2 = flow.analytics) == null ? void 0 : _a2.customProperties
4824
- });
4825
- }
4826
- });
4827
- setUndoFn(() => undo);
4828
- interpret2(fromNodeId);
4829
- return abort;
4830
- }, [analytics, apiClient, chatService, logger, flow]);
4831
- return o$1(k, {
4832
- children: [o$1("div", {
4833
- ref: chatRef,
4834
- className: "hide-scrollbars relative flex w-full max-w-full flex-grow flex-col overflow-y-scroll",
4835
- style: {
4836
- WebkitOverflowScrolling: "touch",
4837
- paddingBottom: store.inputHeight$.value
4838
- },
4839
- children: o$1(Conversation, {
4840
- lastSentMessageFooter: flow.data.isFinished || !undoFn ? null : o$1(UndoButton, {
4841
- undoFn
4842
- })
4843
- })
4844
- }), o$1(ChatInput, {})]
4845
- });
4846
- };
4847
- const getNodeKeys = (node) => {
4848
- if ("key" in node.data && node.data.key)
4849
- return [node.data.key];
4850
- if ("keys" in node.data)
4851
- return Object.values(node.data.keys).filter((key) => typeof key === "string");
4852
- return [];
4853
- };
4854
- const UndoButton = ({
4855
- undoFn
4856
- }) => {
4857
- return o$1("div", {
4858
- class: "absolute bottom-0 right-0 flex w-full translate-y-full justify-end",
4859
- children: o$1("button", {
4860
- class: "fr touch-hitbox text-neutral-9 hover:text-neutral-12 rounded-full p-1 text-right text-xs transition-all",
4861
- onClick: async () => {
4862
- const {
4863
- flow
4864
- } = store.current$.peek();
4865
- invariant(flow);
4866
- const {
4867
- removed
4868
- } = undoFn(flow.data.nodeHistory);
4869
- const removedNodeIds = flow.data.nodeHistory.splice(-removed);
4870
- if (removedNodeIds.length === 0)
4871
- return;
4872
- store.removeMessagesSentByNodeIds(removedNodeIds);
4873
- store.setInput(void 0);
4874
- removedNodeIds.pop();
4875
- removedNodeIds.map((nodeId) => flow.nodes.find((node) => node.id === nodeId)).filter(Boolean).flatMap(getNodeKeys).forEach((key) => delete flow.data.submissions[key]);
4876
- store.current$.value = {
4877
- ...store.current$.value
4878
- };
4879
- },
4880
- children: "Undo"
4881
- })
4882
- });
4883
- };
4884
- export {
4885
- ChatbotBody
4886
- };