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