@inploi/plugin-chatbot 3.28.7 → 3.30.0

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