@chekinapp/ui 0.2.2 → 0.2.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +683 -493
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +82 -63
- package/dist/index.d.ts +82 -63
- package/dist/index.js +664 -475
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -5461,7 +5461,6 @@ var translation_default = {
|
|
|
5461
5461
|
close_other_application_that_may_be_using_your_camera: "\u0417\u0430\u0442\u0432\u0430\u0440\u044F\u043D\u0435 \u043D\u0430 \u0434\u0440\u0443\u0433\u0438 \u043F\u0440\u0438\u043B\u043E\u0436\u0435\u043D\u0438\u044F, \u043A\u043E\u0438\u0442\u043E \u043C\u043E\u0436\u0435 \u0434\u0430 \u0438\u0437\u043F\u043E\u043B\u0437\u0432\u0430\u0442 \u043A\u0430\u043C\u0435\u0440\u0430\u0442\u0430",
|
|
5462
5462
|
if_you_use_external_camera_disconnect_and_reconnect: "\u0410\u043A\u043E \u0438\u0437\u043F\u043E\u043B\u0437\u0432\u0430\u0442\u0435 \u0432\u044A\u043D\u0448\u043D\u0430 \u043A\u0430\u043C\u0435\u0440\u0430, \u0438\u0437\u043A\u043B\u044E\u0447\u0435\u0442\u0435 \u044F \u0438 \u044F \u0441\u0432\u044A\u0440\u0436\u0435\u0442\u0435 \u043E\u0442\u043D\u043E\u0432\u043E",
|
|
5463
5463
|
close_the_browser_re_open_it: "\u0417\u0430\u0442\u0432\u043E\u0440\u0435\u0442\u0435 \u0431\u0440\u0430\u0443\u0437\u044A\u0440\u0430 \u0438 \u0433\u043E \u043E\u0442\u0432\u043E\u0440\u0435\u0442\u0435 \u043E\u0442\u043D\u043E\u0432\u043E",
|
|
5464
|
-
camera_permissions_denied: "\u041A\u0430\u043C\u0435\u0440\u0430\u0442\u0430 \u043D\u0435 \u0441\u0435 \u043E\u0442\u0432\u0430\u0440\u044F? \u0423\u0432\u0435\u0440\u0435\u0442\u0435 \u0441\u0435, \u0447\u0435 \u0441\u0442\u0435 \u0440\u0430\u0437\u0440\u0435\u0448\u0438\u043B\u0438 \u043D\u0430 \u0431\u0440\u0430\u0443\u0437\u044A\u0440\u0430 \u0434\u0430 \u0438\u0437\u043F\u043E\u043B\u0437\u0432\u0430 \u043A\u0430\u043C\u0435\u0440\u0430\u0442\u0430.",
|
|
5465
5464
|
camera_errors: {
|
|
5466
5465
|
experiencing_camera_issues: "\u0418\u043C\u0430\u0442\u0435 \u043F\u0440\u043E\u0431\u043B\u0435\u043C\u0438 \u0441 \u043A\u0430\u043C\u0435\u0440\u0430\u0442\u0430?",
|
|
5467
5466
|
chekin_cant_use_your_camera: "Chekin \u043D\u0435 \u043C\u043E\u0436\u0435 \u0434\u0430 \u0438\u0437\u043F\u043E\u043B\u0437\u0432\u0430 \u0432\u0430\u0448\u0430\u0442\u0430 \u043A\u0430\u043C\u0435\u0440\u0430",
|
|
@@ -5485,7 +5484,8 @@ var translation_default = {
|
|
|
5485
5484
|
hide_password: "\u0421\u043A\u0440\u0438\u0432\u0430\u043D\u0435 \u043D\u0430 \u043F\u0430\u0440\u043E\u043B\u0430\u0442\u0430",
|
|
5486
5485
|
increment: "\u0423\u0432\u0435\u043B\u0438\u0447\u0430\u0432\u0430\u043D\u0435 \u043D\u0430",
|
|
5487
5486
|
decrement: "\u041D\u0430\u043C\u0430\u043B\u0435\u043D\u0438\u0435",
|
|
5488
|
-
create_option: '\u0421\u044A\u0437\u0434\u0430\u0432\u0430\u043D\u0435 \u043D\u0430 "{{input}}"'
|
|
5487
|
+
create_option: '\u0421\u044A\u0437\u0434\u0430\u0432\u0430\u043D\u0435 \u043D\u0430 "{{input}}"',
|
|
5488
|
+
year_out_of_range: "\u0413\u043E\u0434\u0438\u043D\u0430\u0442\u0430 \u0442\u0440\u044F\u0431\u0432\u0430 \u0434\u0430 \u0435 \u043C\u0435\u0436\u0434\u0443 {{min}} \u0438 {{max}}"
|
|
5489
5489
|
};
|
|
5490
5490
|
|
|
5491
5491
|
// src/locales/ca/translation.json
|
|
@@ -5593,7 +5593,6 @@ var translation_default3 = {
|
|
|
5593
5593
|
close_other_application_that_may_be_using_your_camera: "Zav\u0159en\xED dal\u0161\xEDch aplikac\xED, kter\xE9 mohou pou\u017E\xEDvat fotoapar\xE1t",
|
|
5594
5594
|
if_you_use_external_camera_disconnect_and_reconnect: "Pokud pou\u017E\xEDv\xE1te extern\xED kameru, odpojte ji a znovu p\u0159ipojte.",
|
|
5595
5595
|
close_the_browser_re_open_it: "Zav\u0159ete prohl\xED\u017Ee\u010D a znovu jej otev\u0159ete",
|
|
5596
|
-
camera_permissions_denied: "Fotoapar\xE1t se neotev\u0159e? Ujist\u011Bte se, \u017Ee jste prohl\xED\u017Ee\u010Di povolili pou\u017E\xEDvat kameru.",
|
|
5597
5596
|
camera_errors: {
|
|
5598
5597
|
experiencing_camera_issues: "M\xE1te probl\xE9my s fotoapar\xE1tem?",
|
|
5599
5598
|
chekin_cant_use_your_camera: "Chekin nem\u016F\u017Ee pou\u017E\xEDvat v\xE1\u0161 fotoapar\xE1t",
|
|
@@ -5617,7 +5616,8 @@ var translation_default3 = {
|
|
|
5617
5616
|
hide_password: "Skr\xFDt heslo",
|
|
5618
5617
|
increment: "P\u0159\xEDr\u016Fstek",
|
|
5619
5618
|
decrement: "Sn\xED\u017Een\xED",
|
|
5620
|
-
create_option: 'Vytvo\u0159it "{{input}}"'
|
|
5619
|
+
create_option: 'Vytvo\u0159it "{{input}}"',
|
|
5620
|
+
year_out_of_range: "Rok mus\xED b\xFDt mezi {{min}} a {{max}}."
|
|
5621
5621
|
};
|
|
5622
5622
|
|
|
5623
5623
|
// src/locales/de/translation.json
|
|
@@ -5722,7 +5722,6 @@ var translation_default4 = {
|
|
|
5722
5722
|
close_other_application_that_may_be_using_your_camera: "Schlie\xDFen Sie andere Anwendungen, die m\xF6glicherweise Ihre Kamera verwenden",
|
|
5723
5723
|
if_you_use_external_camera_disconnect_and_reconnect: "Wenn Sie eine externe Kamera verwenden, trennen Sie sie ab und schlie\xDFen Sie sie wieder an.",
|
|
5724
5724
|
close_the_browser_re_open_it: "Schlie\xDFen Sie den Browser und \xF6ffnen Sie ihn erneut",
|
|
5725
|
-
camera_permissions_denied: "Die Kamera l\xE4sst sich nicht \xF6ffnen? Stellen Sie sicher, dass Sie dem Browser die Verwendung der Kamera erlauben.",
|
|
5726
5725
|
camera_errors: {
|
|
5727
5726
|
experiencing_camera_issues: "Haben Sie Probleme mit der Kamera?",
|
|
5728
5727
|
chekin_cant_use_your_camera: "Chekin kann deine Kamera nicht benutzen",
|
|
@@ -5746,7 +5745,8 @@ var translation_default4 = {
|
|
|
5746
5745
|
hide_password: "Passwort verstecken",
|
|
5747
5746
|
increment: "Inkrement",
|
|
5748
5747
|
decrement: "Verkleinern",
|
|
5749
|
-
create_option: 'Erstellen Sie "{{input}}".'
|
|
5748
|
+
create_option: 'Erstellen Sie "{{input}}".',
|
|
5749
|
+
year_out_of_range: "Das Jahr muss zwischen {{min}} und {{max}} liegen"
|
|
5750
5750
|
};
|
|
5751
5751
|
|
|
5752
5752
|
// src/locales/el/translation.json
|
|
@@ -5851,7 +5851,6 @@ var translation_default5 = {
|
|
|
5851
5851
|
close_other_application_that_may_be_using_your_camera: "\u039A\u03BB\u03B5\u03AF\u03C3\u03C4\u03B5 \u03AC\u03BB\u03BB\u03B5\u03C2 \u03B5\u03C6\u03B1\u03C1\u03BC\u03BF\u03B3\u03AD\u03C2 \u03C0\u03BF\u03C5 \u03BC\u03C0\u03BF\u03C1\u03B5\u03AF \u03BD\u03B1 \u03C7\u03C1\u03B7\u03C3\u03B9\u03BC\u03BF\u03C0\u03BF\u03B9\u03BF\u03CD\u03BD \u03C4\u03B7\u03BD \u03BA\u03AC\u03BC\u03B5\u03C1\u03AC \u03C3\u03B1\u03C2",
|
|
5852
5852
|
if_you_use_external_camera_disconnect_and_reconnect: "\u0395\u03AC\u03BD \u03C7\u03C1\u03B7\u03C3\u03B9\u03BC\u03BF\u03C0\u03BF\u03B9\u03B5\u03AF\u03C4\u03B5 \u03B5\u03BE\u03C9\u03C4\u03B5\u03C1\u03B9\u03BA\u03AE \u03BA\u03AC\u03BC\u03B5\u03C1\u03B1, \u03B1\u03C0\u03BF\u03C3\u03C5\u03BD\u03B4\u03AD\u03C3\u03C4\u03B5 \u03BA\u03B1\u03B9 \u03B5\u03C0\u03B1\u03BD\u03B1\u03C3\u03C5\u03BD\u03B4\u03AD\u03C3\u03C4\u03B5 \u03C4\u03B7\u03BD.",
|
|
5853
5853
|
close_the_browser_re_open_it: "\u039A\u03BB\u03B5\u03AF\u03C3\u03C4\u03B5 \u03C4\u03BF \u03C0\u03C1\u03CC\u03B3\u03C1\u03B1\u03BC\u03BC\u03B1 \u03C0\u03B5\u03C1\u03B9\u03AE\u03B3\u03B7\u03C3\u03B7\u03C2 \u03BA\u03B1\u03B9 \u03B1\u03BD\u03BF\u03AF\u03BE\u03C4\u03B5 \u03C4\u03BF \u03BE\u03B1\u03BD\u03AC",
|
|
5854
|
-
camera_permissions_denied: "\u0397 \u03BA\u03AC\u03BC\u03B5\u03C1\u03B1 \u03B4\u03B5\u03BD \u03B1\u03BD\u03BF\u03AF\u03B3\u03B5\u03B9; \u0392\u03B5\u03B2\u03B1\u03B9\u03C9\u03B8\u03B5\u03AF\u03C4\u03B5 \u03CC\u03C4\u03B9 \u03B5\u03C0\u03B9\u03C4\u03C1\u03AD\u03C0\u03B5\u03C4\u03B5 \u03C3\u03C4\u03BF \u03C0\u03C1\u03CC\u03B3\u03C1\u03B1\u03BC\u03BC\u03B1 \u03C0\u03B5\u03C1\u03B9\u03AE\u03B3\u03B7\u03C3\u03B7\u03C2 \u03C4\u03B7\u03BD \u03AC\u03B4\u03B5\u03B9\u03B1 \u03C7\u03C1\u03AE\u03C3\u03B7\u03C2 \u03C4\u03B7\u03C2 \u03BA\u03AC\u03BC\u03B5\u03C1\u03B1\u03C2.",
|
|
5855
5854
|
camera_errors: {
|
|
5856
5855
|
experiencing_camera_issues: "\u0391\u03BD\u03C4\u03B9\u03BC\u03B5\u03C4\u03C9\u03C0\u03AF\u03B6\u03B5\u03C4\u03B5 \u03C0\u03C1\u03BF\u03B2\u03BB\u03AE\u03BC\u03B1\u03C4\u03B1 \u03BC\u03B5 \u03C4\u03B7\u03BD \u03BA\u03AC\u03BC\u03B5\u03C1\u03B1;",
|
|
5857
5856
|
chekin_cant_use_your_camera: "\u039F \u03A4\u03C3\u03AD\u03BA\u03B9\u03BD \u03B4\u03B5\u03BD \u03BC\u03C0\u03BF\u03C1\u03B5\u03AF \u03BD\u03B1 \u03C7\u03C1\u03B7\u03C3\u03B9\u03BC\u03BF\u03C0\u03BF\u03B9\u03AE\u03C3\u03B5\u03B9 \u03C4\u03B7\u03BD \u03BA\u03AC\u03BC\u03B5\u03C1\u03AC \u03C3\u03B1\u03C2",
|
|
@@ -5875,7 +5874,8 @@ var translation_default5 = {
|
|
|
5875
5874
|
hide_password: "\u0391\u03C0\u03CC\u03BA\u03C1\u03C5\u03C8\u03B7 \u03BA\u03C9\u03B4\u03B9\u03BA\u03BF\u03CD \u03C0\u03C1\u03CC\u03C3\u03B2\u03B1\u03C3\u03B7\u03C2",
|
|
5876
5875
|
increment: "\u0391\u03CD\u03BE\u03B7\u03C3\u03B7",
|
|
5877
5876
|
decrement: "\u039C\u03B5\u03AF\u03C9\u03C3\u03B7",
|
|
5878
|
-
create_option: '\u0394\u03B7\u03BC\u03B9\u03BF\u03C5\u03C1\u03B3\u03AE\u03C3\u03C4\u03B5 \u03C4\u03BF "{{input}}__"'
|
|
5877
|
+
create_option: '\u0394\u03B7\u03BC\u03B9\u03BF\u03C5\u03C1\u03B3\u03AE\u03C3\u03C4\u03B5 \u03C4\u03BF "{{input}}__"',
|
|
5878
|
+
year_out_of_range: "\u03A4\u03BF \u03AD\u03C4\u03BF\u03C2 \u03C0\u03C1\u03AD\u03C0\u03B5\u03B9 \u03BD\u03B1 \u03B5\u03AF\u03BD\u03B1\u03B9 \u03BC\u03B5\u03C4\u03B1\u03BE\u03CD {{min}} \u03BA\u03B1\u03B9 {{max}}"
|
|
5879
5879
|
};
|
|
5880
5880
|
|
|
5881
5881
|
// src/locales/en/translation.json
|
|
@@ -5974,13 +5974,13 @@ var translation_default6 = {
|
|
|
5974
5974
|
date_range_min_days_error_other: "Range must be at least {{count}} days",
|
|
5975
5975
|
past_dates: "Date cannot be before {{minDate}}",
|
|
5976
5976
|
future_dates: "Date cannot be after {{maxDate}}",
|
|
5977
|
+
year_out_of_range: "Year must be between {{min}} and {{max}}",
|
|
5977
5978
|
signature_placeholder_text: "Sign inside this box.<br/> Use your finger.<br/> Tap to start.",
|
|
5978
5979
|
open_devices_camera: "Open device's camera",
|
|
5979
5980
|
place_document_inside_frame: "Place your document inside the frame",
|
|
5980
5981
|
close_other_application_that_may_be_using_your_camera: "Close other applications that may be using your camera",
|
|
5981
5982
|
if_you_use_external_camera_disconnect_and_reconnect: "If you use an external camera, disconnect and reconnect it",
|
|
5982
5983
|
close_the_browser_re_open_it: "Close the browser and reopen it",
|
|
5983
|
-
camera_permissions_denied: "The camera doesn't open? Make sure to allow the browser permission to use the camera.",
|
|
5984
5984
|
camera_errors: {
|
|
5985
5985
|
experiencing_camera_issues: "Experiencing camera issues?",
|
|
5986
5986
|
chekin_cant_use_your_camera: "Chekin can't use your camera",
|
|
@@ -6109,7 +6109,6 @@ var translation_default7 = {
|
|
|
6109
6109
|
close_other_application_that_may_be_using_your_camera: "Cierra otras aplicaciones que puedan estar utilizando tu c\xE1mara",
|
|
6110
6110
|
if_you_use_external_camera_disconnect_and_reconnect: "Si utilizas una c\xE1mara externa, descon\xE9ctala y vuelve a conectarla",
|
|
6111
6111
|
close_the_browser_re_open_it: "Cierre el navegador y vuelva a abrirlo",
|
|
6112
|
-
camera_permissions_denied: "\xBFLa c\xE1mara no se abre? Aseg\xFArate de dar permiso al navegador para usar la c\xE1mara.",
|
|
6113
6112
|
camera_errors: {
|
|
6114
6113
|
experiencing_camera_issues: "\xBFTienes problemas con la c\xE1mara?",
|
|
6115
6114
|
chekin_cant_use_your_camera: "Chekin no puede usar tu c\xE1mara",
|
|
@@ -6133,7 +6132,8 @@ var translation_default7 = {
|
|
|
6133
6132
|
hide_password: "Ocultar contrase\xF1a",
|
|
6134
6133
|
increment: "Incremento",
|
|
6135
6134
|
decrement: "Disminuci\xF3n",
|
|
6136
|
-
create_option: 'Crear "{{input}}"'
|
|
6135
|
+
create_option: 'Crear "{{input}}"',
|
|
6136
|
+
year_out_of_range: "El a\xF1o debe estar comprendido entre {{min}} y {{max}}."
|
|
6137
6137
|
};
|
|
6138
6138
|
|
|
6139
6139
|
// src/locales/et/translation.json
|
|
@@ -6238,7 +6238,6 @@ var translation_default8 = {
|
|
|
6238
6238
|
close_other_application_that_may_be_using_your_camera: "Sulgege muud rakendused, mis v\xF5ivad kasutada teie kaamerat",
|
|
6239
6239
|
if_you_use_external_camera_disconnect_and_reconnect: "Kui kasutate v\xE4list kaamerat, \xFChendage see lahti ja \xFChendage uuesti.",
|
|
6240
6240
|
close_the_browser_re_open_it: "Sulgege brauser ja avage see uuesti",
|
|
6241
|
-
camera_permissions_denied: "Kaamera ei avane? Veenduge, et lubate brauserile kaamera kasutamise loa.",
|
|
6242
6241
|
camera_errors: {
|
|
6243
6242
|
experiencing_camera_issues: "Kas teil on probleeme kaameraga?",
|
|
6244
6243
|
chekin_cant_use_your_camera: "Chekin ei saa oma kaamerat kasutada",
|
|
@@ -6262,7 +6261,8 @@ var translation_default8 = {
|
|
|
6262
6261
|
hide_password: "Peida parool",
|
|
6263
6262
|
increment: "Inkrement",
|
|
6264
6263
|
decrement: "V\xE4hendamine",
|
|
6265
|
-
create_option: 'Loo "{{input}}".'
|
|
6264
|
+
create_option: 'Loo "{{input}}".',
|
|
6265
|
+
year_out_of_range: "Aasta peab olema {{min}} ja {{max}} vahel."
|
|
6266
6266
|
};
|
|
6267
6267
|
|
|
6268
6268
|
// src/locales/fr/translation.json
|
|
@@ -6367,7 +6367,6 @@ var translation_default9 = {
|
|
|
6367
6367
|
close_other_application_that_may_be_using_your_camera: "Fermez les autres applications qui peuvent utiliser votre appareil photo",
|
|
6368
6368
|
if_you_use_external_camera_disconnect_and_reconnect: "Si vous utilisez un appareil photo externe, d\xE9connectez-le et reconnectez-le",
|
|
6369
6369
|
close_the_browser_re_open_it: "Fermer le navigateur et le rouvrir",
|
|
6370
|
-
camera_permissions_denied: "L'appareil photo ne s'ouvre pas ? Veillez \xE0 autoriser le navigateur \xE0 utiliser l'appareil photo.",
|
|
6371
6370
|
camera_errors: {
|
|
6372
6371
|
experiencing_camera_issues: "Vous avez des probl\xE8mes avec l'appareil photo ?",
|
|
6373
6372
|
chekin_cant_use_your_camera: "Chekin ne peut pas utiliser votre appareil photo",
|
|
@@ -6391,7 +6390,8 @@ var translation_default9 = {
|
|
|
6391
6390
|
hide_password: "Cacher le mot de passe",
|
|
6392
6391
|
increment: "Incr\xE9ment",
|
|
6393
6392
|
decrement: "D\xE9croissance",
|
|
6394
|
-
create_option: 'Cr\xE9er "{{input}}"'
|
|
6393
|
+
create_option: 'Cr\xE9er "{{input}}"',
|
|
6394
|
+
year_out_of_range: "L'ann\xE9e doit \xEAtre comprise entre {{min}} et {{max}}."
|
|
6395
6395
|
};
|
|
6396
6396
|
|
|
6397
6397
|
// src/locales/hu/translation.json
|
|
@@ -6496,7 +6496,6 @@ var translation_default10 = {
|
|
|
6496
6496
|
close_other_application_that_may_be_using_your_camera: "Z\xE1rjon be m\xE1s alkalmaz\xE1sokat, amelyek esetleg a kamer\xE1t haszn\xE1lj\xE1k",
|
|
6497
6497
|
if_you_use_external_camera_disconnect_and_reconnect: "Ha k\xFCls\u0151 kamer\xE1t haszn\xE1l, v\xE1lassza ki \xE9s csatlakoztassa \xFAjra.",
|
|
6498
6498
|
close_the_browser_re_open_it: "Z\xE1rja be a b\xF6ng\xE9sz\u0151t, majd nyissa meg \xFAjra",
|
|
6499
|
-
camera_permissions_denied: "A kamera nem ny\xEDlik ki? Gy\u0151z\u0151dj\xF6n meg r\xF3la, hogy enged\xE9lyezi a b\xF6ng\xE9sz\u0151 sz\xE1m\xE1ra a kamera haszn\xE1lat\xE1t.",
|
|
6500
6499
|
camera_errors: {
|
|
6501
6500
|
experiencing_camera_issues: "Kameraprobl\xE9m\xE1k?",
|
|
6502
6501
|
chekin_cant_use_your_camera: "Chekin nem tudja haszn\xE1lni a kamer\xE1t",
|
|
@@ -6520,7 +6519,8 @@ var translation_default10 = {
|
|
|
6520
6519
|
hide_password: "Jelsz\xF3 elrejt\xE9se",
|
|
6521
6520
|
increment: "Inkrement\xE1l\xE1s",
|
|
6522
6521
|
decrement: "Cs\xF6kkent\xE9s",
|
|
6523
|
-
create_option: 'Hozzon l\xE9tre "{{input}}__"'
|
|
6522
|
+
create_option: 'Hozzon l\xE9tre "{{input}}__"',
|
|
6523
|
+
year_out_of_range: "Az \xE9vnek {{min}} \xE9s {{max}} k\xF6z\xF6tt kell lennie."
|
|
6524
6524
|
};
|
|
6525
6525
|
|
|
6526
6526
|
// src/locales/it/translation.json
|
|
@@ -6625,7 +6625,6 @@ var translation_default11 = {
|
|
|
6625
6625
|
close_other_application_that_may_be_using_your_camera: "Chiudere altre applicazioni che potrebbero utilizzare la fotocamera",
|
|
6626
6626
|
if_you_use_external_camera_disconnect_and_reconnect: "Se si utilizza una telecamera esterna, scollegarla e ricollegarla.",
|
|
6627
6627
|
close_the_browser_re_open_it: "Chiudere il browser e riaprirlo",
|
|
6628
|
-
camera_permissions_denied: "La fotocamera non si apre? Assicurarsi di autorizzare il browser a utilizzare la fotocamera.",
|
|
6629
6628
|
camera_errors: {
|
|
6630
6629
|
experiencing_camera_issues: "Problemi con la fotocamera?",
|
|
6631
6630
|
chekin_cant_use_your_camera: "Chekin non pu\xF2 usare la macchina fotografica",
|
|
@@ -6649,7 +6648,8 @@ var translation_default11 = {
|
|
|
6649
6648
|
hide_password: "Nascondere la password",
|
|
6650
6649
|
increment: "Incremento",
|
|
6651
6650
|
decrement: "Decremento",
|
|
6652
|
-
create_option: 'Creare "{{input}}"'
|
|
6651
|
+
create_option: 'Creare "{{input}}"',
|
|
6652
|
+
year_out_of_range: "L'anno deve essere compreso tra {{min}} e {{max}}"
|
|
6653
6653
|
};
|
|
6654
6654
|
|
|
6655
6655
|
// src/locales/ko/translation.json
|
|
@@ -6754,7 +6754,6 @@ var translation_default12 = {
|
|
|
6754
6754
|
close_other_application_that_may_be_using_your_camera: "\uCE74\uBA54\uB77C\uB97C \uC0AC\uC6A9\uD560 \uC218 \uC788\uB294 \uB2E4\uB978 \uC560\uD50C\uB9AC\uCF00\uC774\uC158\uC744 \uB2EB\uC2B5\uB2C8\uB2E4.",
|
|
6755
6755
|
if_you_use_external_camera_disconnect_and_reconnect: "\uC678\uBD80 \uCE74\uBA54\uB77C\uB97C \uC0AC\uC6A9\uD558\uB294 \uACBD\uC6B0 \uC5F0\uACB0\uC744 \uB04A\uC5C8\uB2E4\uAC00 \uB2E4\uC2DC \uC5F0\uACB0\uD558\uC138\uC694.",
|
|
6756
6756
|
close_the_browser_re_open_it: "\uBE0C\uB77C\uC6B0\uC800\uB97C \uB2EB\uC558\uB2E4\uAC00 \uB2E4\uC2DC \uC5F4\uAE30",
|
|
6757
|
-
camera_permissions_denied: "\uCE74\uBA54\uB77C\uAC00 \uC5F4\uB9AC\uC9C0 \uC54A\uB098\uC694? \uBE0C\uB77C\uC6B0\uC800\uC5D0\uC11C \uCE74\uBA54\uB77C \uC0AC\uC6A9 \uAD8C\uD55C\uC744 \uD5C8\uC6A9\uD588\uB294\uC9C0 \uD655\uC778\uD558\uC138\uC694.",
|
|
6758
6757
|
camera_errors: {
|
|
6759
6758
|
experiencing_camera_issues: "\uCE74\uBA54\uB77C \uBB38\uC81C\uAC00 \uBC1C\uC0DD\uD588\uB098\uC694?",
|
|
6760
6759
|
chekin_cant_use_your_camera: "Chekin\uC774 \uCE74\uBA54\uB77C\uB97C \uC0AC\uC6A9\uD560 \uC218 \uC5C6\uC2B5\uB2C8\uB2E4.",
|
|
@@ -6778,7 +6777,8 @@ var translation_default12 = {
|
|
|
6778
6777
|
hide_password: "\uBE44\uBC00\uBC88\uD638 \uC228\uAE30\uAE30",
|
|
6779
6778
|
increment: "\uC99D\uBD84",
|
|
6780
6779
|
decrement: "\uAC10\uC18C",
|
|
6781
|
-
create_option: '"{{input}}" \uB9CC\uB4E4\uAE30'
|
|
6780
|
+
create_option: '"{{input}}" \uB9CC\uB4E4\uAE30',
|
|
6781
|
+
year_out_of_range: "\uC5F0\uB3C4\uB294 {{min}}\uC5D0\uC11C {{max}} \uC0AC\uC774\uC5EC\uC57C \uD569\uB2C8\uB2E4."
|
|
6782
6782
|
};
|
|
6783
6783
|
|
|
6784
6784
|
// src/locales/nl/translation.json
|
|
@@ -6883,7 +6883,6 @@ var translation_default13 = {
|
|
|
6883
6883
|
close_other_application_that_may_be_using_your_camera: "Sluit andere toepassingen die mogelijk gebruikmaken van uw camera",
|
|
6884
6884
|
if_you_use_external_camera_disconnect_and_reconnect: "Als u een externe camera gebruikt, koppelt u deze los en sluit u deze weer aan.",
|
|
6885
6885
|
close_the_browser_re_open_it: "Sluit de browser en open deze opnieuw",
|
|
6886
|
-
camera_permissions_denied: "De camera opent niet? Zorg ervoor dat de browser toestemming geeft om de camera te gebruiken.",
|
|
6887
6886
|
camera_errors: {
|
|
6888
6887
|
experiencing_camera_issues: "Problemen met de camera?",
|
|
6889
6888
|
chekin_cant_use_your_camera: "Chekin kan je camera niet gebruiken",
|
|
@@ -6907,7 +6906,8 @@ var translation_default13 = {
|
|
|
6907
6906
|
hide_password: "Wachtwoord verbergen",
|
|
6908
6907
|
increment: "Verhoging",
|
|
6909
6908
|
decrement: "Afname",
|
|
6910
|
-
create_option: 'Maak "{{input}}" aan.'
|
|
6909
|
+
create_option: 'Maak "{{input}}" aan.',
|
|
6910
|
+
year_out_of_range: "Het jaar moet liggen tussen {{min}} en {{max}}"
|
|
6911
6911
|
};
|
|
6912
6912
|
|
|
6913
6913
|
// src/locales/pl/translation.json
|
|
@@ -7012,7 +7012,6 @@ var translation_default14 = {
|
|
|
7012
7012
|
close_other_application_that_may_be_using_your_camera: "Zamknij inne aplikacje, kt\xF3re mog\u0105 korzysta\u0107 z kamery",
|
|
7013
7013
|
if_you_use_external_camera_disconnect_and_reconnect: "Je\u015Bli u\u017Cywasz kamery zewn\u0119trznej, od\u0142\u0105cz j\u0105 i pod\u0142\u0105cz ponownie",
|
|
7014
7014
|
close_the_browser_re_open_it: "Zamknij przegl\u0105dark\u0119 i otw\xF3rz j\u0105 ponownie",
|
|
7015
|
-
camera_permissions_denied: "Kamera nie otwiera si\u0119? Upewnij si\u0119, \u017Ce zezwolono przegl\u0105darce na korzystanie z kamery.",
|
|
7016
7015
|
camera_errors: {
|
|
7017
7016
|
experiencing_camera_issues: "Problemy z kamer\u0105?",
|
|
7018
7017
|
chekin_cant_use_your_camera: "Chekin nie mo\u017Ce u\u017Cywa\u0107 kamery",
|
|
@@ -7036,7 +7035,8 @@ var translation_default14 = {
|
|
|
7036
7035
|
hide_password: "Ukryj has\u0142o",
|
|
7037
7036
|
increment: "Przyrost",
|
|
7038
7037
|
decrement: "Spadek",
|
|
7039
|
-
create_option: 'Utw\xF3rz "{{input}}"'
|
|
7038
|
+
create_option: 'Utw\xF3rz "{{input}}"',
|
|
7039
|
+
year_out_of_range: "Rok musi zawiera\u0107 si\u0119 w przedziale od {{min}} do {{max}}."
|
|
7040
7040
|
};
|
|
7041
7041
|
|
|
7042
7042
|
// src/locales/pt/translation.json
|
|
@@ -7141,7 +7141,6 @@ var translation_default15 = {
|
|
|
7141
7141
|
close_other_application_that_may_be_using_your_camera: "Fechar outras aplica\xE7\xF5es que possam estar a utilizar a sua c\xE2mara",
|
|
7142
7142
|
if_you_use_external_camera_disconnect_and_reconnect: "Se utilizar uma c\xE2mara externa, desligue-a e volte a lig\xE1-la",
|
|
7143
7143
|
close_the_browser_re_open_it: "Fechar o browser e voltar a abri-lo",
|
|
7144
|
-
camera_permissions_denied: "A c\xE2mara n\xE3o abre? Certifique-se de que d\xE1 permiss\xE3o ao browser para utilizar a c\xE2mara.",
|
|
7145
7144
|
camera_errors: {
|
|
7146
7145
|
experiencing_camera_issues: "Est\xE1 a ter problemas com a c\xE2mara?",
|
|
7147
7146
|
chekin_cant_use_your_camera: "Chekin n\xE3o pode usar a sua c\xE2mara",
|
|
@@ -7165,7 +7164,8 @@ var translation_default15 = {
|
|
|
7165
7164
|
hide_password: "Ocultar palavra-passe",
|
|
7166
7165
|
increment: "Incremento",
|
|
7167
7166
|
decrement: "Diminui\xE7\xE3o",
|
|
7168
|
-
create_option: 'Criar "{{input}}"'
|
|
7167
|
+
create_option: 'Criar "{{input}}"',
|
|
7168
|
+
year_out_of_range: "O ano deve estar compreendido entre {{min}} e {{max}}"
|
|
7169
7169
|
};
|
|
7170
7170
|
|
|
7171
7171
|
// src/locales/ro/translation.json
|
|
@@ -7270,7 +7270,6 @@ var translation_default16 = {
|
|
|
7270
7270
|
close_other_application_that_may_be_using_your_camera: "\xCEnchide\u021Bi alte aplica\u021Bii care pot utiliza camera dvs.",
|
|
7271
7271
|
if_you_use_external_camera_disconnect_and_reconnect: "Dac\u0103 utiliza\u021Bi o camer\u0103 extern\u0103, deconecta\u021Bi-o \u0219i reconecta\u021Bi-o",
|
|
7272
7272
|
close_the_browser_re_open_it: "\xCEnchide\u021Bi browserul \u0219i redeschide\u021Bi-l",
|
|
7273
|
-
camera_permissions_denied: "Camera nu se deschide? Asigura\u021Bi-v\u0103 c\u0103 acorda\u021Bi browserului permisiunea de a utiliza camera.",
|
|
7274
7273
|
camera_errors: {
|
|
7275
7274
|
experiencing_camera_issues: "Ave\u021Bi probleme cu camera foto?",
|
|
7276
7275
|
chekin_cant_use_your_camera: "Chekin nu-\u021Bi poate folosi camera",
|
|
@@ -7294,7 +7293,8 @@ var translation_default16 = {
|
|
|
7294
7293
|
hide_password: "Ascunde\u021Bi parola",
|
|
7295
7294
|
increment: "Increment",
|
|
7296
7295
|
decrement: "Diminuare",
|
|
7297
|
-
create_option: 'Crea\u021Bi "{{input}}"'
|
|
7296
|
+
create_option: 'Crea\u021Bi "{{input}}"',
|
|
7297
|
+
year_out_of_range: "Anul trebuie s\u0103 fie \xEEntre {{min}} \u0219i {{max}}"
|
|
7298
7298
|
};
|
|
7299
7299
|
|
|
7300
7300
|
// src/locales/ru/translation.json
|
|
@@ -7399,7 +7399,6 @@ var translation_default17 = {
|
|
|
7399
7399
|
close_other_application_that_may_be_using_your_camera: "\u0417\u0430\u043A\u0440\u043E\u0439\u0442\u0435 \u0434\u0440\u0443\u0433\u0438\u0435 \u043F\u0440\u0438\u043B\u043E\u0436\u0435\u043D\u0438\u044F, \u043A\u043E\u0442\u043E\u0440\u044B\u0435 \u043C\u043E\u0433\u0443\u0442 \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u044C \u0432\u0430\u0448\u0443 \u043A\u0430\u043C\u0435\u0440\u0443",
|
|
7400
7400
|
if_you_use_external_camera_disconnect_and_reconnect: "\u0415\u0441\u043B\u0438 \u0432\u044B \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0435\u0442\u0435 \u0432\u043D\u0435\u0448\u043D\u044E\u044E \u043A\u0430\u043C\u0435\u0440\u0443, \u043E\u0442\u0441\u043E\u0435\u0434\u0438\u043D\u0438\u0442\u0435 \u0438 \u0441\u043D\u043E\u0432\u0430 \u043F\u043E\u0434\u0441\u043E\u0435\u0434\u0438\u043D\u0438\u0442\u0435 \u0435\u0435",
|
|
7401
7401
|
close_the_browser_re_open_it: "\u0417\u0430\u043A\u0440\u043E\u0439\u0442\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u0438 \u043E\u0442\u043A\u0440\u043E\u0439\u0442\u0435 \u0435\u0433\u043E \u0441\u043D\u043E\u0432\u0430",
|
|
7402
|
-
camera_permissions_denied: "\u041A\u0430\u043C\u0435\u0440\u0430 \u043D\u0435 \u043E\u0442\u043A\u0440\u044B\u0432\u0430\u0435\u0442\u0441\u044F? \u0423\u0431\u0435\u0434\u0438\u0442\u0435\u0441\u044C, \u0447\u0442\u043E \u0440\u0430\u0437\u0440\u0435\u0448\u0438\u043B\u0438 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0443 \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u044C \u043A\u0430\u043C\u0435\u0440\u0443.",
|
|
7403
7402
|
camera_errors: {
|
|
7404
7403
|
experiencing_camera_issues: "\u0418\u0441\u043F\u044B\u0442\u044B\u0432\u0430\u0435\u0442\u0435 \u043F\u0440\u043E\u0431\u043B\u0435\u043C\u044B \u0441 \u043A\u0430\u043C\u0435\u0440\u043E\u0439?",
|
|
7405
7404
|
chekin_cant_use_your_camera: "\u0427\u0435\u043A\u0438\u043D \u043D\u0435 \u043C\u043E\u0436\u0435\u0442 \u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u044C\u0441\u044F \u0432\u0430\u0448\u0435\u0439 \u043A\u0430\u043C\u0435\u0440\u043E\u0439",
|
|
@@ -7423,7 +7422,8 @@ var translation_default17 = {
|
|
|
7423
7422
|
hide_password: "\u0421\u043A\u0440\u044B\u0442\u044C \u043F\u0430\u0440\u043E\u043B\u044C",
|
|
7424
7423
|
increment: "\u0418\u043D\u043A\u0440\u0435\u043C\u0435\u043D\u0442",
|
|
7425
7424
|
decrement: "\u0423\u043C\u0435\u043D\u044C\u0448\u0435\u043D\u0438\u0435",
|
|
7426
|
-
create_option: '\u0421\u043E\u0437\u0434\u0430\u0439\u0442\u0435 "{{input}}"'
|
|
7425
|
+
create_option: '\u0421\u043E\u0437\u0434\u0430\u0439\u0442\u0435 "{{input}}"',
|
|
7426
|
+
year_out_of_range: "\u0413\u043E\u0434 \u0434\u043E\u043B\u0436\u0435\u043D \u0431\u044B\u0442\u044C \u043C\u0435\u0436\u0434\u0443 {{min}} \u0438 {{max}}"
|
|
7427
7427
|
};
|
|
7428
7428
|
|
|
7429
7429
|
// src/locales/uk/translation.json
|
|
@@ -7528,7 +7528,6 @@ var translation_default18 = {
|
|
|
7528
7528
|
close_other_application_that_may_be_using_your_camera: "\u0417\u0430\u043A\u0440\u0438\u0439\u0442\u0435 \u0456\u043D\u0448\u0456 \u043F\u0440\u043E\u0433\u0440\u0430\u043C\u0438, \u044F\u043A\u0456 \u043C\u043E\u0436\u0443\u0442\u044C \u0432\u0438\u043A\u043E\u0440\u0438\u0441\u0442\u043E\u0432\u0443\u0432\u0430\u0442\u0438 \u043A\u0430\u043C\u0435\u0440\u0443",
|
|
7529
7529
|
if_you_use_external_camera_disconnect_and_reconnect: "\u042F\u043A\u0449\u043E \u0432\u0438 \u0432\u0438\u043A\u043E\u0440\u0438\u0441\u0442\u043E\u0432\u0443\u0454\u0442\u0435 \u0437\u043E\u0432\u043D\u0456\u0448\u043D\u044E \u043A\u0430\u043C\u0435\u0440\u0443, \u0432\u0456\u0434'\u0454\u0434\u043D\u0430\u0439\u0442\u0435 \u0442\u0430 \u0437\u043D\u043E\u0432\u0443 \u043F\u0456\u0434'\u0454\u0434\u043D\u0430\u0439\u0442\u0435 \u0457\u0457",
|
|
7530
7530
|
close_the_browser_re_open_it: "\u0417\u0430\u043A\u0440\u0438\u0439\u0442\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u0456 \u0432\u0456\u0434\u043A\u0440\u0438\u0439\u0442\u0435 \u0439\u043E\u0433\u043E \u0437\u043D\u043E\u0432\u0443",
|
|
7531
|
-
camera_permissions_denied: "\u041A\u0430\u043C\u0435\u0440\u0430 \u043D\u0435 \u0432\u0456\u0434\u043A\u0440\u0438\u0432\u0430\u0454\u0442\u044C\u0441\u044F? \u041F\u0435\u0440\u0435\u043A\u043E\u043D\u0430\u0439\u0442\u0435\u0441\u044F, \u0449\u043E \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u043C\u0430\u0454 \u0434\u043E\u0437\u0432\u0456\u043B \u043D\u0430 \u0432\u0438\u043A\u043E\u0440\u0438\u0441\u0442\u0430\u043D\u043D\u044F \u043A\u0430\u043C\u0435\u0440\u0438.",
|
|
7532
7531
|
camera_errors: {
|
|
7533
7532
|
experiencing_camera_issues: "\u0412\u0438\u043D\u0438\u043A\u0430\u044E\u0442\u044C \u043F\u0440\u043E\u0431\u043B\u0435\u043C\u0438 \u0437 \u043A\u0430\u043C\u0435\u0440\u043E\u044E?",
|
|
7534
7533
|
chekin_cant_use_your_camera: "\u0427\u0435\u043A\u0456\u043D \u043D\u0435 \u043C\u043E\u0436\u0435 \u043A\u043E\u0440\u0438\u0441\u0442\u0443\u0432\u0430\u0442\u0438\u0441\u044F \u0442\u0432\u043E\u0454\u044E \u043A\u0430\u043C\u0435\u0440\u043E\u044E",
|
|
@@ -7552,7 +7551,8 @@ var translation_default18 = {
|
|
|
7552
7551
|
hide_password: "\u041F\u0440\u0438\u0445\u043E\u0432\u0430\u0442\u0438 \u043F\u0430\u0440\u043E\u043B\u044C",
|
|
7553
7552
|
increment: "\u041F\u0440\u0438\u0440\u0456\u0441\u0442",
|
|
7554
7553
|
decrement: "\u0414\u0435\u043A\u0440\u0435\u0442",
|
|
7555
|
-
create_option: '\u0421\u0442\u0432\u043E\u0440\u0456\u0442\u044C "{{input}}"'
|
|
7554
|
+
create_option: '\u0421\u0442\u0432\u043E\u0440\u0456\u0442\u044C "{{input}}"',
|
|
7555
|
+
year_out_of_range: "\u0420\u0456\u043A \u043F\u043E\u0432\u0438\u043D\u0435\u043D \u0431\u0443\u0442\u0438 \u043C\u0456\u0436 {{min}} \u0442\u0430 {{max}}."
|
|
7556
7556
|
};
|
|
7557
7557
|
|
|
7558
7558
|
// src/i18n/resources.ts
|
|
@@ -9555,7 +9555,7 @@ function TooltipInfo({ content, className }) {
|
|
|
9555
9555
|
side: "right",
|
|
9556
9556
|
content,
|
|
9557
9557
|
contentClassName: "max-w-64",
|
|
9558
|
-
className: cn("text-[var(--
|
|
9558
|
+
className: cn("text-[var(--section-tooltip-color)]", className),
|
|
9559
9559
|
onClick: (event) => event.stopPropagation(),
|
|
9560
9560
|
label: typeof content === "string" ? content : "More information"
|
|
9561
9561
|
}
|
|
@@ -9595,19 +9595,19 @@ var Section = forwardRef38(
|
|
|
9595
9595
|
"div",
|
|
9596
9596
|
{
|
|
9597
9597
|
className: cn(
|
|
9598
|
-
"flex max-w-[85%] items-center text-lg font-bold text-[var(--
|
|
9598
|
+
"flex max-w-[85%] items-center text-lg font-bold text-[var(--section-title-color)] md:max-w-full",
|
|
9599
9599
|
size !== 0 /* L */ && "subsection-title",
|
|
9600
9600
|
titleClassName
|
|
9601
9601
|
),
|
|
9602
9602
|
children: [
|
|
9603
9603
|
title,
|
|
9604
9604
|
titleTooltip && /* @__PURE__ */ jsx98("div", { className: "ml-2.5", children: /* @__PURE__ */ jsx98(TooltipInfo, { content: titleTooltip }) }),
|
|
9605
|
-
linkContent && /* @__PURE__ */ jsx98("div", { className: "ml-6 text-sm font-semibold text-[var(--
|
|
9605
|
+
linkContent && /* @__PURE__ */ jsx98("div", { className: "ml-6 text-sm font-semibold text-[var(--section-link-color)] no-underline hover:opacity-70 active:opacity-100", children: linkContent })
|
|
9606
9606
|
]
|
|
9607
9607
|
}
|
|
9608
9608
|
),
|
|
9609
9609
|
subtitle && /* @__PURE__ */ jsxs60("div", { className: "w-full max-w-[720px] md:max-w-full", children: [
|
|
9610
|
-
/* @__PURE__ */ jsx98("div", { className: "inline text-base font-normal text-[var(--
|
|
9610
|
+
/* @__PURE__ */ jsx98("div", { className: "inline text-base font-normal text-[var(--section-subtitle-color)]", children: subtitle }),
|
|
9611
9611
|
subtitleTooltip && /* @__PURE__ */ jsx98("div", { className: "ml-1.5 inline-block align-text-top", children: /* @__PURE__ */ jsx98(TooltipInfo, { content: subtitleTooltip }) })
|
|
9612
9612
|
] })
|
|
9613
9613
|
] }),
|
|
@@ -17129,7 +17129,7 @@ var Textarea = React61.forwardRef(function Textarea2({
|
|
|
17129
17129
|
});
|
|
17130
17130
|
|
|
17131
17131
|
// src/fields/datepicker/Datepicker.tsx
|
|
17132
|
-
import * as
|
|
17132
|
+
import * as React64 from "react";
|
|
17133
17133
|
import { ChevronDown as ChevronDown4 } from "lucide-react";
|
|
17134
17134
|
import { useTranslation as useTranslation38 } from "react-i18next";
|
|
17135
17135
|
|
|
@@ -17777,6 +17777,142 @@ function AirbnbDatePickerContent({
|
|
|
17777
17777
|
) });
|
|
17778
17778
|
}
|
|
17779
17779
|
|
|
17780
|
+
// src/fields/datepicker/useMonthCombobox.ts
|
|
17781
|
+
import * as React63 from "react";
|
|
17782
|
+
function useMonthCombobox({
|
|
17783
|
+
monthLabels,
|
|
17784
|
+
monthIndex,
|
|
17785
|
+
isFieldFocused,
|
|
17786
|
+
disabled,
|
|
17787
|
+
onSelect,
|
|
17788
|
+
onCommit,
|
|
17789
|
+
onClear
|
|
17790
|
+
}) {
|
|
17791
|
+
const [isOpen, setIsOpen] = React63.useState(false);
|
|
17792
|
+
const [inputValue, setInputValue] = React63.useState("");
|
|
17793
|
+
const [highlightIndex, setHighlightIndex] = React63.useState(-1);
|
|
17794
|
+
const labelFor = React63.useCallback(
|
|
17795
|
+
(index) => index !== null ? monthLabels[index] ?? "" : "",
|
|
17796
|
+
[monthLabels]
|
|
17797
|
+
);
|
|
17798
|
+
React63.useEffect(() => {
|
|
17799
|
+
if (isFieldFocused) return;
|
|
17800
|
+
setInputValue(labelFor(monthIndex));
|
|
17801
|
+
}, [monthIndex, labelFor, isFieldFocused]);
|
|
17802
|
+
const filteredMonths = React63.useMemo(() => {
|
|
17803
|
+
const all = monthLabels.map((label, index) => ({ label, index }));
|
|
17804
|
+
const query = inputValue.trim().toLowerCase();
|
|
17805
|
+
if (!query || inputValue === labelFor(monthIndex)) return all;
|
|
17806
|
+
return all.filter((option) => option.label.toLowerCase().includes(query));
|
|
17807
|
+
}, [inputValue, monthIndex, monthLabels, labelFor]);
|
|
17808
|
+
React63.useEffect(() => {
|
|
17809
|
+
if (!isOpen) {
|
|
17810
|
+
setHighlightIndex(-1);
|
|
17811
|
+
return;
|
|
17812
|
+
}
|
|
17813
|
+
if (monthIndex !== null) {
|
|
17814
|
+
const index = filteredMonths.findIndex((option) => option.index === monthIndex);
|
|
17815
|
+
if (index >= 0) {
|
|
17816
|
+
setHighlightIndex(index);
|
|
17817
|
+
return;
|
|
17818
|
+
}
|
|
17819
|
+
}
|
|
17820
|
+
setHighlightIndex(filteredMonths.length > 0 ? 0 : -1);
|
|
17821
|
+
}, [isOpen, filteredMonths.length]);
|
|
17822
|
+
const selectMonth = React63.useCallback(
|
|
17823
|
+
(index) => {
|
|
17824
|
+
setInputValue(labelFor(index));
|
|
17825
|
+
setIsOpen(false);
|
|
17826
|
+
onSelect(index);
|
|
17827
|
+
},
|
|
17828
|
+
[labelFor, onSelect]
|
|
17829
|
+
);
|
|
17830
|
+
const commitInput = React63.useCallback(() => {
|
|
17831
|
+
const query = inputValue.trim().toLowerCase();
|
|
17832
|
+
if (!query) {
|
|
17833
|
+
if (monthIndex !== null) onClear();
|
|
17834
|
+
setInputValue("");
|
|
17835
|
+
return;
|
|
17836
|
+
}
|
|
17837
|
+
const exactMatch = monthLabels.findIndex((label) => label.toLowerCase() === query);
|
|
17838
|
+
if (exactMatch >= 0) {
|
|
17839
|
+
if (exactMatch !== monthIndex) onCommit(exactMatch);
|
|
17840
|
+
setInputValue(labelFor(exactMatch));
|
|
17841
|
+
return;
|
|
17842
|
+
}
|
|
17843
|
+
setInputValue(labelFor(monthIndex));
|
|
17844
|
+
}, [inputValue, monthIndex, monthLabels, labelFor, onClear, onCommit]);
|
|
17845
|
+
const handleInputChange = React63.useCallback(
|
|
17846
|
+
(event) => {
|
|
17847
|
+
setInputValue(event.target.value);
|
|
17848
|
+
setIsOpen(true);
|
|
17849
|
+
setHighlightIndex(0);
|
|
17850
|
+
},
|
|
17851
|
+
[]
|
|
17852
|
+
);
|
|
17853
|
+
const handleInputKeyDown = React63.useCallback(
|
|
17854
|
+
(event) => {
|
|
17855
|
+
if (disabled) return;
|
|
17856
|
+
if (event.key === "ArrowDown") {
|
|
17857
|
+
event.preventDefault();
|
|
17858
|
+
setIsOpen(true);
|
|
17859
|
+
setHighlightIndex(
|
|
17860
|
+
(prev) => filteredMonths.length === 0 ? -1 : Math.min(prev + 1, filteredMonths.length - 1)
|
|
17861
|
+
);
|
|
17862
|
+
return;
|
|
17863
|
+
}
|
|
17864
|
+
if (event.key === "ArrowUp") {
|
|
17865
|
+
event.preventDefault();
|
|
17866
|
+
setIsOpen(true);
|
|
17867
|
+
setHighlightIndex((prev) => Math.max(prev - 1, 0));
|
|
17868
|
+
return;
|
|
17869
|
+
}
|
|
17870
|
+
if (event.key === "Enter") {
|
|
17871
|
+
if (!isOpen) return;
|
|
17872
|
+
event.preventDefault();
|
|
17873
|
+
const target = filteredMonths[highlightIndex];
|
|
17874
|
+
if (target) {
|
|
17875
|
+
selectMonth(target.index);
|
|
17876
|
+
} else {
|
|
17877
|
+
commitInput();
|
|
17878
|
+
}
|
|
17879
|
+
return;
|
|
17880
|
+
}
|
|
17881
|
+
if (event.key === "Escape") {
|
|
17882
|
+
event.preventDefault();
|
|
17883
|
+
setIsOpen(false);
|
|
17884
|
+
setInputValue(labelFor(monthIndex));
|
|
17885
|
+
return;
|
|
17886
|
+
}
|
|
17887
|
+
if (event.key === "Tab") {
|
|
17888
|
+
setIsOpen(false);
|
|
17889
|
+
}
|
|
17890
|
+
},
|
|
17891
|
+
[
|
|
17892
|
+
commitInput,
|
|
17893
|
+
disabled,
|
|
17894
|
+
filteredMonths,
|
|
17895
|
+
highlightIndex,
|
|
17896
|
+
isOpen,
|
|
17897
|
+
labelFor,
|
|
17898
|
+
monthIndex,
|
|
17899
|
+
selectMonth
|
|
17900
|
+
]
|
|
17901
|
+
);
|
|
17902
|
+
return {
|
|
17903
|
+
isOpen,
|
|
17904
|
+
setIsOpen,
|
|
17905
|
+
inputValue,
|
|
17906
|
+
highlightIndex,
|
|
17907
|
+
setHighlightIndex,
|
|
17908
|
+
filteredMonths,
|
|
17909
|
+
selectMonth,
|
|
17910
|
+
commitInput,
|
|
17911
|
+
handleInputChange,
|
|
17912
|
+
handleInputKeyDown
|
|
17913
|
+
};
|
|
17914
|
+
}
|
|
17915
|
+
|
|
17780
17916
|
// src/fields/datepicker/Datepicker.tsx
|
|
17781
17917
|
import { jsx as jsx172, jsxs as jsxs108 } from "react/jsx-runtime";
|
|
17782
17918
|
var MONTHS_IN_YEAR2 = 12;
|
|
@@ -17788,13 +17924,33 @@ function getMonthLabels2(locale) {
|
|
|
17788
17924
|
);
|
|
17789
17925
|
}
|
|
17790
17926
|
var DAY_PATTERN = /^([1-9]|[12]\d|3[01])$/;
|
|
17791
|
-
var PARTIAL_DAY_PATTERN = /^[0-9]
|
|
17927
|
+
var PARTIAL_DAY_PATTERN = /^([0-9]|0[1-9]|[12]\d|3[01])?$/;
|
|
17792
17928
|
var PARTIAL_YEAR_PATTERN = /^[0-9]{0,4}$/;
|
|
17793
|
-
var
|
|
17929
|
+
var COMPLETE_YEAR_PATTERN = /^\d{4}$/;
|
|
17930
|
+
var MIN_YEAR_OFFSET = 120;
|
|
17931
|
+
var MAX_YEAR_OFFSET = 50;
|
|
17932
|
+
function getYearBounds() {
|
|
17933
|
+
const currentYear = (/* @__PURE__ */ new Date()).getFullYear();
|
|
17934
|
+
return {
|
|
17935
|
+
minYear: currentYear - MIN_YEAR_OFFSET,
|
|
17936
|
+
maxYear: currentYear + MAX_YEAR_OFFSET
|
|
17937
|
+
};
|
|
17938
|
+
}
|
|
17794
17939
|
function isValidCalendarDate(year, monthIndex, day) {
|
|
17795
17940
|
const date = new Date(year, monthIndex, day);
|
|
17796
17941
|
return date.getFullYear() === year && date.getMonth() === monthIndex && date.getDate() === day;
|
|
17797
17942
|
}
|
|
17943
|
+
function getDaysInMonth2(monthIndex, year) {
|
|
17944
|
+
const yearNum = COMPLETE_YEAR_PATTERN.test(year) ? parseInt(year, 10) : 2024;
|
|
17945
|
+
return new Date(yearNum, monthIndex + 1, 0).getDate();
|
|
17946
|
+
}
|
|
17947
|
+
function clampDayToMonth(day, monthIndex, year) {
|
|
17948
|
+
if (!day || monthIndex === null) return day;
|
|
17949
|
+
const dayNum = parseInt(day, 10);
|
|
17950
|
+
if (Number.isNaN(dayNum)) return day;
|
|
17951
|
+
const max = getDaysInMonth2(monthIndex, year);
|
|
17952
|
+
return dayNum > max ? String(max) : day;
|
|
17953
|
+
}
|
|
17798
17954
|
function partsFromDate(date) {
|
|
17799
17955
|
if (!date) return { day: "", monthIndex: null, year: "" };
|
|
17800
17956
|
return {
|
|
@@ -17803,15 +17959,23 @@ function partsFromDate(date) {
|
|
|
17803
17959
|
year: String(date.getFullYear())
|
|
17804
17960
|
};
|
|
17805
17961
|
}
|
|
17806
|
-
function
|
|
17962
|
+
function datepickerDatesEqual(a, b) {
|
|
17963
|
+
if (a === null || b === null) return a === b;
|
|
17964
|
+
return a.getTime() === b.getTime();
|
|
17965
|
+
}
|
|
17966
|
+
function isYearInRange(yearNum, minYear, maxYear) {
|
|
17967
|
+
return yearNum >= minYear && yearNum <= maxYear;
|
|
17968
|
+
}
|
|
17969
|
+
function dateFromParts(day, monthIndex, year, minYear, maxYear) {
|
|
17807
17970
|
if (!day || monthIndex === null || !year) return null;
|
|
17808
|
-
if (!DAY_PATTERN.test(day) || !
|
|
17971
|
+
if (!DAY_PATTERN.test(day) || !COMPLETE_YEAR_PATTERN.test(year)) return null;
|
|
17809
17972
|
const dayNum = parseInt(day, 10);
|
|
17810
17973
|
const yearNum = parseInt(year, 10);
|
|
17974
|
+
if (!isYearInRange(yearNum, minYear, maxYear)) return null;
|
|
17811
17975
|
if (!isValidCalendarDate(yearNum, monthIndex, dayNum)) return null;
|
|
17812
17976
|
return new Date(yearNum, monthIndex, dayNum);
|
|
17813
17977
|
}
|
|
17814
|
-
var Datepicker =
|
|
17978
|
+
var Datepicker = React64.forwardRef(
|
|
17815
17979
|
function Datepicker2({
|
|
17816
17980
|
label,
|
|
17817
17981
|
value,
|
|
@@ -17844,133 +18008,154 @@ var Datepicker = React63.forwardRef(
|
|
|
17844
18008
|
maxDate,
|
|
17845
18009
|
formatValue
|
|
17846
18010
|
}, ref) {
|
|
17847
|
-
const containerRef =
|
|
17848
|
-
const dayInputRef =
|
|
17849
|
-
const monthInputRef =
|
|
17850
|
-
const
|
|
17851
|
-
const
|
|
17852
|
-
const
|
|
17853
|
-
const wheelBaseId = React63.useId();
|
|
17854
|
-
const reactId = React63.useId();
|
|
18011
|
+
const containerRef = React64.useRef(null);
|
|
18012
|
+
const dayInputRef = React64.useRef(null);
|
|
18013
|
+
const monthInputRef = React64.useRef(null);
|
|
18014
|
+
const yearInputRef = React64.useRef(null);
|
|
18015
|
+
const mobileTriggerRef = React64.useRef(null);
|
|
18016
|
+
const reactId = React64.useId();
|
|
17855
18017
|
const baseId = name ?? `dash-datepicker-${reactId}`;
|
|
17856
18018
|
const dayId = `${baseId}-day`;
|
|
17857
18019
|
const monthId = `${baseId}-month`;
|
|
17858
18020
|
const yearId = `${baseId}-year`;
|
|
17859
18021
|
const labelId = `${baseId}-label`;
|
|
17860
18022
|
const errorId = `${baseId}-error`;
|
|
18023
|
+
const wheelBaseId = `${baseId}-wheel`;
|
|
17861
18024
|
const { t, i18n } = useTranslation38();
|
|
17862
18025
|
const resolvedLocale = locale ?? i18n.resolvedLanguage ?? i18n.language ?? "en-US";
|
|
17863
|
-
const resolvedMonthLabels =
|
|
18026
|
+
const resolvedMonthLabels = React64.useMemo(
|
|
17864
18027
|
() => monthLabels ?? getMonthLabels2(resolvedLocale),
|
|
17865
18028
|
[resolvedLocale, monthLabels]
|
|
17866
18029
|
);
|
|
17867
18030
|
const resolvedMonthPlaceholder = monthPlaceholder ?? t("month");
|
|
17868
18031
|
const resolvedDoneLabel = doneLabel ?? t("done");
|
|
17869
18032
|
const isControlled = value !== void 0;
|
|
17870
|
-
const initialParts =
|
|
18033
|
+
const initialParts = React64.useMemo(
|
|
17871
18034
|
() => partsFromDate(value ?? defaultValue ?? null),
|
|
17872
18035
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
17873
18036
|
[]
|
|
17874
18037
|
);
|
|
17875
|
-
const [day, setDay] =
|
|
17876
|
-
const [monthIndex, setMonthIndex] =
|
|
18038
|
+
const [day, setDay] = React64.useState(initialParts.day);
|
|
18039
|
+
const [monthIndex, setMonthIndex] = React64.useState(
|
|
17877
18040
|
initialParts.monthIndex
|
|
17878
18041
|
);
|
|
17879
|
-
const [year, setYear] =
|
|
17880
|
-
const [
|
|
17881
|
-
const [
|
|
17882
|
-
const [focusedField, setFocusedField] = React63.useState(null);
|
|
17883
|
-
const [monthInputValue, setMonthInputValue] = React63.useState("");
|
|
17884
|
-
const [monthHighlightIndex, setMonthHighlightIndex] = React63.useState(-1);
|
|
18042
|
+
const [year, setYear] = React64.useState(initialParts.year);
|
|
18043
|
+
const [isWheelOpen, setIsWheelOpen] = React64.useState(false);
|
|
18044
|
+
const [focusedField, setFocusedField] = React64.useState(null);
|
|
17885
18045
|
const isMobile3 = useIsMobile();
|
|
17886
|
-
const emitChangeRef =
|
|
18046
|
+
const emitChangeRef = React64.useRef(() => {
|
|
17887
18047
|
});
|
|
17888
|
-
const
|
|
17889
|
-
const
|
|
17890
|
-
const
|
|
18048
|
+
const lastEmittedRef = React64.useRef(value ?? null);
|
|
18049
|
+
const dayStateRef = React64.useRef(day);
|
|
18050
|
+
const yearStateRef = React64.useRef(year);
|
|
18051
|
+
const monthIndexRef = React64.useRef(monthIndex);
|
|
17891
18052
|
dayStateRef.current = day;
|
|
17892
18053
|
yearStateRef.current = year;
|
|
17893
18054
|
monthIndexRef.current = monthIndex;
|
|
17894
|
-
|
|
18055
|
+
React64.useImperativeHandle(
|
|
17895
18056
|
ref,
|
|
17896
18057
|
() => ({
|
|
17897
18058
|
getDayValue: () => dayStateRef.current,
|
|
17898
18059
|
getYearValue: () => yearStateRef.current,
|
|
17899
18060
|
setDayValue: (next) => {
|
|
17900
18061
|
if (!PARTIAL_DAY_PATTERN.test(next)) return;
|
|
18062
|
+
const month = monthIndexRef.current;
|
|
18063
|
+
if (month !== null && next && parseInt(next, 10) > getDaysInMonth2(month, yearStateRef.current)) {
|
|
18064
|
+
return;
|
|
18065
|
+
}
|
|
17901
18066
|
setDay(next);
|
|
17902
|
-
emitChangeRef.current(next,
|
|
18067
|
+
emitChangeRef.current(next, month, yearStateRef.current);
|
|
17903
18068
|
},
|
|
17904
18069
|
setYearValue: (next) => {
|
|
17905
18070
|
if (!PARTIAL_YEAR_PATTERN.test(next)) return;
|
|
18071
|
+
const clampedDay = clampDayToMonth(
|
|
18072
|
+
dayStateRef.current,
|
|
18073
|
+
monthIndexRef.current,
|
|
18074
|
+
next
|
|
18075
|
+
);
|
|
18076
|
+
if (clampedDay !== dayStateRef.current) setDay(clampedDay);
|
|
17906
18077
|
setYear(next);
|
|
17907
|
-
emitChangeRef.current(
|
|
18078
|
+
emitChangeRef.current(clampedDay, monthIndexRef.current, next);
|
|
17908
18079
|
}
|
|
17909
18080
|
}),
|
|
17910
18081
|
[]
|
|
17911
18082
|
);
|
|
17912
|
-
|
|
18083
|
+
React64.useEffect(() => {
|
|
17913
18084
|
if (!isControlled) return;
|
|
17914
|
-
const
|
|
18085
|
+
const incoming = value ?? null;
|
|
18086
|
+
if (datepickerDatesEqual(incoming, lastEmittedRef.current)) return;
|
|
18087
|
+
lastEmittedRef.current = incoming;
|
|
18088
|
+
const next = partsFromDate(incoming);
|
|
17915
18089
|
setDay(next.day);
|
|
17916
18090
|
setMonthIndex(next.monthIndex);
|
|
17917
18091
|
setYear(next.year);
|
|
17918
18092
|
}, [isControlled, value]);
|
|
17919
|
-
|
|
17920
|
-
|
|
17921
|
-
|
|
17922
|
-
|
|
17923
|
-
)
|
|
17924
|
-
|
|
17925
|
-
const filteredMonths = React63.useMemo(() => {
|
|
17926
|
-
const all = resolvedMonthLabels.map((label2, index) => ({ label: label2, index }));
|
|
17927
|
-
const query = monthInputValue.trim().toLowerCase();
|
|
17928
|
-
const currentLabel = monthIndex !== null ? resolvedMonthLabels[monthIndex] ?? "" : "";
|
|
17929
|
-
if (!query || monthInputValue === currentLabel) return all;
|
|
17930
|
-
return all.filter((opt) => opt.label.toLowerCase().includes(query));
|
|
17931
|
-
}, [monthInputValue, monthIndex, resolvedMonthLabels]);
|
|
17932
|
-
React63.useEffect(() => {
|
|
17933
|
-
if (!isMonthOpen) {
|
|
17934
|
-
setMonthHighlightIndex(-1);
|
|
17935
|
-
return;
|
|
17936
|
-
}
|
|
17937
|
-
if (monthIndex !== null) {
|
|
17938
|
-
const currentLabel = resolvedMonthLabels[monthIndex];
|
|
17939
|
-
const index = filteredMonths.findIndex((o) => o.label === currentLabel);
|
|
17940
|
-
if (index >= 0) {
|
|
17941
|
-
setMonthHighlightIndex(index);
|
|
17942
|
-
return;
|
|
17943
|
-
}
|
|
18093
|
+
const { minYear, maxYear } = React64.useMemo(() => getYearBounds(), []);
|
|
18094
|
+
const yearError = React64.useMemo(() => {
|
|
18095
|
+
if (year.length < 4) return null;
|
|
18096
|
+
const yearNum = parseInt(year, 10);
|
|
18097
|
+
if (!isYearInRange(yearNum, minYear, maxYear)) {
|
|
18098
|
+
return t("year_out_of_range", { min: minYear, max: maxYear });
|
|
17944
18099
|
}
|
|
17945
|
-
|
|
17946
|
-
}, [
|
|
17947
|
-
const
|
|
17948
|
-
const isEmpty = !
|
|
18100
|
+
return null;
|
|
18101
|
+
}, [year, minYear, maxYear, t]);
|
|
18102
|
+
const resolvedError = error || yearError || void 0;
|
|
18103
|
+
const isEmpty = !day && monthIndex === null && !year;
|
|
17949
18104
|
const isBlocked = Boolean(disabled) || Boolean(loading);
|
|
17950
|
-
const
|
|
17951
|
-
const isInvalid = Boolean(invalid || error);
|
|
18105
|
+
const isInvalid = Boolean(invalid || resolvedError);
|
|
17952
18106
|
const wrapperWidth = toCssSize(width);
|
|
17953
|
-
const
|
|
17954
|
-
|
|
17955
|
-
|
|
18107
|
+
const errorDescribedBy = resolvedError && !hideErrorMessage ? errorId : void 0;
|
|
18108
|
+
const currentDate = React64.useMemo(
|
|
18109
|
+
() => dateFromParts(day, monthIndex, year, minYear, maxYear),
|
|
18110
|
+
[day, monthIndex, year, minYear, maxYear]
|
|
17956
18111
|
);
|
|
17957
|
-
|
|
17958
|
-
elementRef: containerRef,
|
|
17959
|
-
onOutsideClick: () => setIsMonthOpen(false),
|
|
17960
|
-
isDisabled: !isMonthOpen || isMobile3
|
|
17961
|
-
});
|
|
17962
|
-
const emitChange = React63.useCallback(
|
|
18112
|
+
const emitChange = React64.useCallback(
|
|
17963
18113
|
(nextDay, nextMonth, nextYear) => {
|
|
17964
|
-
|
|
17965
|
-
|
|
17966
|
-
onChange(date, name);
|
|
18114
|
+
const date = dateFromParts(nextDay, nextMonth, nextYear, minYear, maxYear);
|
|
18115
|
+
lastEmittedRef.current = date;
|
|
18116
|
+
onChange?.(date, name);
|
|
17967
18117
|
},
|
|
17968
|
-
[name, onChange]
|
|
18118
|
+
[name, onChange, minYear, maxYear]
|
|
17969
18119
|
);
|
|
17970
18120
|
emitChangeRef.current = emitChange;
|
|
18121
|
+
const commitMonth = React64.useCallback(
|
|
18122
|
+
(index) => {
|
|
18123
|
+
const clampedDay = clampDayToMonth(day, index, year);
|
|
18124
|
+
if (clampedDay !== day) setDay(clampedDay);
|
|
18125
|
+
setMonthIndex(index);
|
|
18126
|
+
emitChange(clampedDay, index, year);
|
|
18127
|
+
},
|
|
18128
|
+
[day, emitChange, year]
|
|
18129
|
+
);
|
|
18130
|
+
const handleMonthSelect = React64.useCallback(
|
|
18131
|
+
(index) => {
|
|
18132
|
+
commitMonth(index);
|
|
18133
|
+
yearInputRef.current?.focus();
|
|
18134
|
+
},
|
|
18135
|
+
[commitMonth]
|
|
18136
|
+
);
|
|
18137
|
+
const handleMonthClear = React64.useCallback(() => commitMonth(null), [commitMonth]);
|
|
18138
|
+
const monthCombobox = useMonthCombobox({
|
|
18139
|
+
monthLabels: resolvedMonthLabels,
|
|
18140
|
+
monthIndex,
|
|
18141
|
+
isFieldFocused: focusedField === "month",
|
|
18142
|
+
disabled: isBlocked,
|
|
18143
|
+
onSelect: handleMonthSelect,
|
|
18144
|
+
onCommit: commitMonth,
|
|
18145
|
+
onClear: handleMonthClear
|
|
18146
|
+
});
|
|
18147
|
+
const isFocused = focusedField !== null || monthCombobox.isOpen || isWheelOpen;
|
|
18148
|
+
useOutsideClick({
|
|
18149
|
+
elementRef: containerRef,
|
|
18150
|
+
onOutsideClick: () => monthCombobox.setIsOpen(false),
|
|
18151
|
+
isDisabled: !monthCombobox.isOpen || isMobile3
|
|
18152
|
+
});
|
|
17971
18153
|
const handleDayChange = (event) => {
|
|
17972
18154
|
const next = event.target.value;
|
|
17973
18155
|
if (!PARTIAL_DAY_PATTERN.test(next)) return;
|
|
18156
|
+
if (monthIndex !== null && next && parseInt(next, 10) > getDaysInMonth2(monthIndex, year)) {
|
|
18157
|
+
return;
|
|
18158
|
+
}
|
|
17974
18159
|
setDay(next);
|
|
17975
18160
|
emitChange(next, monthIndex, year);
|
|
17976
18161
|
if (next.length === 2 && DAY_PATTERN.test(next)) {
|
|
@@ -17980,90 +18165,20 @@ var Datepicker = React63.forwardRef(
|
|
|
17980
18165
|
const handleYearChange = (event) => {
|
|
17981
18166
|
const next = event.target.value;
|
|
17982
18167
|
if (!PARTIAL_YEAR_PATTERN.test(next)) return;
|
|
18168
|
+
const clampedDay = clampDayToMonth(day, monthIndex, next);
|
|
18169
|
+
if (clampedDay !== day) setDay(clampedDay);
|
|
17983
18170
|
setYear(next);
|
|
17984
|
-
emitChange(
|
|
17985
|
-
};
|
|
17986
|
-
const handleMonthSelect = (index) => {
|
|
17987
|
-
setMonthIndex(index);
|
|
17988
|
-
setMonthInputValue(resolvedMonthLabels[index] ?? "");
|
|
17989
|
-
setIsMonthOpen(false);
|
|
17990
|
-
emitChange(day, index, year);
|
|
17991
|
-
yearInputRef.current?.focus();
|
|
17992
|
-
};
|
|
17993
|
-
const handleMonthInputChange = (event) => {
|
|
17994
|
-
setMonthInputValue(event.target.value);
|
|
17995
|
-
setIsMonthOpen(true);
|
|
17996
|
-
setMonthHighlightIndex(0);
|
|
17997
|
-
};
|
|
17998
|
-
const commitMonthInput = React63.useCallback(() => {
|
|
17999
|
-
const query = monthInputValue.trim().toLowerCase();
|
|
18000
|
-
if (!query) {
|
|
18001
|
-
if (monthIndex !== null) {
|
|
18002
|
-
setMonthIndex(null);
|
|
18003
|
-
emitChange(day, null, year);
|
|
18004
|
-
}
|
|
18005
|
-
setMonthInputValue("");
|
|
18006
|
-
return;
|
|
18007
|
-
}
|
|
18008
|
-
const exactMatch = resolvedMonthLabels.findIndex(
|
|
18009
|
-
(label2) => label2.toLowerCase() === query
|
|
18010
|
-
);
|
|
18011
|
-
if (exactMatch >= 0) {
|
|
18012
|
-
if (exactMatch !== monthIndex) {
|
|
18013
|
-
setMonthIndex(exactMatch);
|
|
18014
|
-
emitChange(day, exactMatch, year);
|
|
18015
|
-
}
|
|
18016
|
-
setMonthInputValue(resolvedMonthLabels[exactMatch]);
|
|
18017
|
-
return;
|
|
18018
|
-
}
|
|
18019
|
-
setMonthInputValue(monthIndex !== null ? resolvedMonthLabels[monthIndex] : "");
|
|
18020
|
-
}, [day, emitChange, monthIndex, monthInputValue, resolvedMonthLabels, year]);
|
|
18021
|
-
const handleMonthInputKeyDown = (event) => {
|
|
18022
|
-
if (isBlocked) return;
|
|
18023
|
-
if (event.key === "ArrowDown") {
|
|
18024
|
-
event.preventDefault();
|
|
18025
|
-
setIsMonthOpen(true);
|
|
18026
|
-
setMonthHighlightIndex(
|
|
18027
|
-
(prev) => filteredMonths.length === 0 ? -1 : Math.min(prev + 1, filteredMonths.length - 1)
|
|
18028
|
-
);
|
|
18029
|
-
return;
|
|
18030
|
-
}
|
|
18031
|
-
if (event.key === "ArrowUp") {
|
|
18032
|
-
event.preventDefault();
|
|
18033
|
-
setIsMonthOpen(true);
|
|
18034
|
-
setMonthHighlightIndex((prev) => Math.max(prev - 1, 0));
|
|
18035
|
-
return;
|
|
18036
|
-
}
|
|
18037
|
-
if (event.key === "Enter") {
|
|
18038
|
-
if (!isMonthOpen) return;
|
|
18039
|
-
event.preventDefault();
|
|
18040
|
-
const target = filteredMonths[monthHighlightIndex];
|
|
18041
|
-
if (target) {
|
|
18042
|
-
handleMonthSelect(target.index);
|
|
18043
|
-
} else {
|
|
18044
|
-
commitMonthInput();
|
|
18045
|
-
}
|
|
18046
|
-
return;
|
|
18047
|
-
}
|
|
18048
|
-
if (event.key === "Escape") {
|
|
18049
|
-
event.preventDefault();
|
|
18050
|
-
setIsMonthOpen(false);
|
|
18051
|
-
setMonthInputValue(monthIndex !== null ? resolvedMonthLabels[monthIndex] : "");
|
|
18052
|
-
return;
|
|
18053
|
-
}
|
|
18054
|
-
if (event.key === "Tab") {
|
|
18055
|
-
setIsMonthOpen(false);
|
|
18056
|
-
}
|
|
18171
|
+
emitChange(clampedDay, monthIndex, next);
|
|
18057
18172
|
};
|
|
18058
|
-
const focusDayInput =
|
|
18173
|
+
const focusDayInput = React64.useCallback(() => {
|
|
18059
18174
|
if (isBlocked || readOnly) return;
|
|
18060
18175
|
dayInputRef.current?.focus();
|
|
18061
18176
|
}, [isBlocked, readOnly]);
|
|
18062
|
-
const openWheel =
|
|
18177
|
+
const openWheel = React64.useCallback(() => {
|
|
18063
18178
|
if (isBlocked || readOnly) return;
|
|
18064
18179
|
setIsWheelOpen(true);
|
|
18065
18180
|
}, [isBlocked, readOnly]);
|
|
18066
|
-
const closeWheel =
|
|
18181
|
+
const closeWheel = React64.useCallback(() => {
|
|
18067
18182
|
setIsWheelOpen(false);
|
|
18068
18183
|
mobileTriggerRef.current?.focus();
|
|
18069
18184
|
}, []);
|
|
@@ -18075,33 +18190,33 @@ var Datepicker = React63.forwardRef(
|
|
|
18075
18190
|
minDate,
|
|
18076
18191
|
maxDate
|
|
18077
18192
|
});
|
|
18078
|
-
const handleWheelDone =
|
|
18193
|
+
const handleWheelDone = React64.useCallback(() => {
|
|
18079
18194
|
const next = wheel.draftDate;
|
|
18080
18195
|
setDay(String(next.getDate()));
|
|
18081
18196
|
setMonthIndex(next.getMonth());
|
|
18082
18197
|
setYear(String(next.getFullYear()));
|
|
18198
|
+
lastEmittedRef.current = next;
|
|
18083
18199
|
onChange?.(next, name);
|
|
18084
18200
|
setIsWheelOpen(false);
|
|
18085
18201
|
mobileTriggerRef.current?.focus();
|
|
18086
18202
|
}, [name, onChange, wheel.draftDate]);
|
|
18087
|
-
const defaultFormatValue =
|
|
18203
|
+
const defaultFormatValue = React64.useCallback(
|
|
18088
18204
|
(date) => `${date.getDate()} ${resolvedMonthLabels[date.getMonth()]} ${date.getFullYear()}`,
|
|
18089
18205
|
[resolvedMonthLabels]
|
|
18090
18206
|
);
|
|
18091
18207
|
const triggerText = currentDate ? (formatValue ?? defaultFormatValue)(currentDate) : void 0;
|
|
18092
18208
|
const monthListboxId = `${monthId}-listbox`;
|
|
18093
18209
|
const getMonthOptionId = (index) => `${monthId}-option-${index}`;
|
|
18094
|
-
const monthPanelContent = filteredMonths.length === 0 ? /* @__PURE__ */ jsx172("div", { className: "px-4 py-3 text-left text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: t("no_options") }) : /* @__PURE__ */ jsx172(
|
|
18210
|
+
const monthPanelContent = monthCombobox.filteredMonths.length === 0 ? /* @__PURE__ */ jsx172("div", { className: "px-4 py-3 text-left text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: t("no_options") }) : /* @__PURE__ */ jsx172(
|
|
18095
18211
|
"ul",
|
|
18096
18212
|
{
|
|
18097
|
-
ref: monthListRef,
|
|
18098
18213
|
id: monthListboxId,
|
|
18099
18214
|
role: "listbox",
|
|
18100
18215
|
"aria-labelledby": labelId,
|
|
18101
18216
|
className: "m-0 max-h-[260px] list-none overflow-y-auto p-1",
|
|
18102
|
-
children: filteredMonths.map((option, position) => {
|
|
18217
|
+
children: monthCombobox.filteredMonths.map((option, position) => {
|
|
18103
18218
|
const isSelected = option.index === monthIndex;
|
|
18104
|
-
const isHighlighted = position ===
|
|
18219
|
+
const isHighlighted = position === monthCombobox.highlightIndex;
|
|
18105
18220
|
return /* @__PURE__ */ jsx172("li", { role: "presentation", children: /* @__PURE__ */ jsx172(
|
|
18106
18221
|
"button",
|
|
18107
18222
|
{
|
|
@@ -18111,8 +18226,8 @@ var Datepicker = React63.forwardRef(
|
|
|
18111
18226
|
"aria-selected": isSelected,
|
|
18112
18227
|
tabIndex: -1,
|
|
18113
18228
|
onMouseDown: (event) => event.preventDefault(),
|
|
18114
|
-
onMouseMove: () =>
|
|
18115
|
-
onClick: () =>
|
|
18229
|
+
onMouseMove: () => monthCombobox.setHighlightIndex(position),
|
|
18230
|
+
onClick: () => monthCombobox.selectMonth(option.index),
|
|
18116
18231
|
className: cn(
|
|
18117
18232
|
"flex w-full items-center justify-start rounded-md border-0 bg-transparent px-3 py-[10px] text-left text-[16px] font-medium text-[var(--chekin-color-brand-navy)] outline-none transition-colors",
|
|
18118
18233
|
isHighlighted && "bg-[var(--chekin-color-surface-pressed)] text-[var(--chekin-color-brand-blue)]",
|
|
@@ -18152,6 +18267,7 @@ var Datepicker = React63.forwardRef(
|
|
|
18152
18267
|
"aria-expanded": isWheelOpen,
|
|
18153
18268
|
"aria-labelledby": labelId,
|
|
18154
18269
|
"aria-invalid": isInvalid,
|
|
18270
|
+
"aria-describedby": errorDescribedBy,
|
|
18155
18271
|
"aria-busy": loading,
|
|
18156
18272
|
disabled: isBlocked || readOnly,
|
|
18157
18273
|
onClick: openWheel,
|
|
@@ -18196,6 +18312,7 @@ var Datepicker = React63.forwardRef(
|
|
|
18196
18312
|
disabled: isBlocked,
|
|
18197
18313
|
readOnly,
|
|
18198
18314
|
"aria-invalid": isInvalid,
|
|
18315
|
+
"aria-describedby": errorDescribedBy,
|
|
18199
18316
|
"aria-labelledby": labelId,
|
|
18200
18317
|
onChange: handleDayChange,
|
|
18201
18318
|
onFocus: (event) => {
|
|
@@ -18221,36 +18338,39 @@ var Datepicker = React63.forwardRef(
|
|
|
18221
18338
|
role: "combobox",
|
|
18222
18339
|
autoComplete: "off",
|
|
18223
18340
|
"aria-haspopup": "listbox",
|
|
18224
|
-
"aria-expanded":
|
|
18341
|
+
"aria-expanded": monthCombobox.isOpen,
|
|
18225
18342
|
"aria-controls": monthListboxId,
|
|
18226
18343
|
"aria-autocomplete": "list",
|
|
18227
|
-
"aria-activedescendant":
|
|
18344
|
+
"aria-activedescendant": monthCombobox.highlightIndex >= 0 && monthCombobox.filteredMonths[monthCombobox.highlightIndex] ? getMonthOptionId(
|
|
18345
|
+
monthCombobox.filteredMonths[monthCombobox.highlightIndex].index
|
|
18346
|
+
) : void 0,
|
|
18228
18347
|
"aria-labelledby": labelId,
|
|
18229
18348
|
"aria-invalid": isInvalid,
|
|
18349
|
+
"aria-describedby": errorDescribedBy,
|
|
18230
18350
|
name: name ? `${name}-month` : void 0,
|
|
18231
|
-
value:
|
|
18351
|
+
value: monthCombobox.inputValue,
|
|
18232
18352
|
placeholder: resolvedMonthPlaceholder,
|
|
18233
18353
|
disabled: isBlocked,
|
|
18234
18354
|
readOnly,
|
|
18235
|
-
onChange:
|
|
18355
|
+
onChange: monthCombobox.handleInputChange,
|
|
18236
18356
|
onFocus: (event) => {
|
|
18237
18357
|
onFocus?.(event);
|
|
18238
18358
|
onFieldFocus?.("month");
|
|
18239
18359
|
setFocusedField("month");
|
|
18240
18360
|
if (!isBlocked && !readOnly) {
|
|
18241
|
-
|
|
18361
|
+
monthCombobox.setIsOpen(true);
|
|
18242
18362
|
monthInputRef.current?.select();
|
|
18243
18363
|
}
|
|
18244
18364
|
},
|
|
18245
18365
|
onBlur: () => {
|
|
18246
18366
|
onFieldBlur?.("month");
|
|
18247
18367
|
setFocusedField(null);
|
|
18248
|
-
|
|
18368
|
+
monthCombobox.commitInput();
|
|
18249
18369
|
},
|
|
18250
18370
|
onClick: () => {
|
|
18251
|
-
if (!isBlocked && !readOnly)
|
|
18371
|
+
if (!isBlocked && !readOnly) monthCombobox.setIsOpen(true);
|
|
18252
18372
|
},
|
|
18253
|
-
onKeyDown:
|
|
18373
|
+
onKeyDown: monthCombobox.handleInputKeyDown,
|
|
18254
18374
|
className: cn(
|
|
18255
18375
|
"m-0 box-border h-full w-full min-w-0 border-0 bg-transparent text-center text-[16px] font-medium leading-5 outline-none placeholder:text-[length:var(--field-placeholder-font-size)] placeholder:font-[var(--field-placeholder-font-weight)] placeholder:text-[var(--chekin-color-gray-1)]",
|
|
18256
18376
|
monthIndex !== null ? "text-[var(--chekin-color-brand-navy)]" : "text-[var(--chekin-color-gray-1)]",
|
|
@@ -18265,12 +18385,12 @@ var Datepicker = React63.forwardRef(
|
|
|
18265
18385
|
onMouseDown: (event) => {
|
|
18266
18386
|
event.preventDefault();
|
|
18267
18387
|
if (isBlocked || readOnly) return;
|
|
18268
|
-
|
|
18388
|
+
monthCombobox.setIsOpen((prev) => !prev);
|
|
18269
18389
|
monthInputRef.current?.focus();
|
|
18270
18390
|
},
|
|
18271
18391
|
className: cn(
|
|
18272
18392
|
"shrink-0 cursor-pointer text-[var(--chekin-color-gray-2)] transition-transform duration-200",
|
|
18273
|
-
|
|
18393
|
+
monthCombobox.isOpen && "rotate-180 text-[var(--chekin-color-brand-blue)]"
|
|
18274
18394
|
)
|
|
18275
18395
|
}
|
|
18276
18396
|
)
|
|
@@ -18289,6 +18409,7 @@ var Datepicker = React63.forwardRef(
|
|
|
18289
18409
|
disabled: isBlocked,
|
|
18290
18410
|
readOnly,
|
|
18291
18411
|
"aria-invalid": isInvalid,
|
|
18412
|
+
"aria-describedby": errorDescribedBy,
|
|
18292
18413
|
"aria-labelledby": labelId,
|
|
18293
18414
|
onChange: handleYearChange,
|
|
18294
18415
|
onFocus: (event) => {
|
|
@@ -18333,7 +18454,7 @@ var Datepicker = React63.forwardRef(
|
|
|
18333
18454
|
onClick: isMobile3 ? openWheel : showCoverage ? focusDayInput : void 0
|
|
18334
18455
|
}
|
|
18335
18456
|
),
|
|
18336
|
-
|
|
18457
|
+
monthCombobox.isOpen && !isMobile3 && /* @__PURE__ */ jsx172("div", { className: "absolute left-0 right-0 top-full z-30 mx-auto mt-1 w-full max-w-[260px] overflow-hidden rounded-md bg-white shadow-[0_30px_30px_0_rgba(33,72,255,0.2)] sm:left-1/2 sm:right-auto sm:-translate-x-1/2", children: monthPanelContent })
|
|
18337
18458
|
] }),
|
|
18338
18459
|
isMobile3 && /* @__PURE__ */ jsx172(
|
|
18339
18460
|
AirbnbDatePickerContent,
|
|
@@ -18363,13 +18484,13 @@ var Datepicker = React63.forwardRef(
|
|
|
18363
18484
|
onOptionSelect: wheel.handleOptionSelect
|
|
18364
18485
|
}
|
|
18365
18486
|
),
|
|
18366
|
-
!
|
|
18367
|
-
!
|
|
18368
|
-
|
|
18487
|
+
!resolvedError && optional && /* @__PURE__ */ jsx172("span", { className: "mt-[1px] block text-left text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: typeof optional === "string" ? optional : t("optional") }),
|
|
18488
|
+
!resolvedError && helperText && /* @__PURE__ */ jsx172("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText }),
|
|
18489
|
+
resolvedError && !hideErrorMessage && /* @__PURE__ */ jsx172(
|
|
18369
18490
|
FieldErrorMessage,
|
|
18370
18491
|
{
|
|
18371
18492
|
id: errorId,
|
|
18372
|
-
message:
|
|
18493
|
+
message: resolvedError,
|
|
18373
18494
|
className: "mt-[1px] text-[14px]"
|
|
18374
18495
|
}
|
|
18375
18496
|
)
|
|
@@ -18380,7 +18501,7 @@ var Datepicker = React63.forwardRef(
|
|
|
18380
18501
|
);
|
|
18381
18502
|
|
|
18382
18503
|
// src/fields/date-range-picker/DateRangePicker.tsx
|
|
18383
|
-
import * as
|
|
18504
|
+
import * as React68 from "react";
|
|
18384
18505
|
import { useTranslation as useTranslation39 } from "react-i18next";
|
|
18385
18506
|
|
|
18386
18507
|
// src/fields/date-range-picker/isDayBlocked.ts
|
|
@@ -18459,7 +18580,7 @@ var createDisabledMatchers = ({
|
|
|
18459
18580
|
};
|
|
18460
18581
|
|
|
18461
18582
|
// src/fields/date-range-picker/hooks/useRangeValue.ts
|
|
18462
|
-
import * as
|
|
18583
|
+
import * as React65 from "react";
|
|
18463
18584
|
var getRangeKey = (range) => `${range?.from?.getTime() ?? ""}-${range?.to?.getTime() ?? ""}`;
|
|
18464
18585
|
function useRangeValue({
|
|
18465
18586
|
value: externalValue,
|
|
@@ -18468,10 +18589,10 @@ function useRangeValue({
|
|
|
18468
18589
|
name
|
|
18469
18590
|
}) {
|
|
18470
18591
|
const isControlled = externalValue !== void 0;
|
|
18471
|
-
const [draft, setDraft] =
|
|
18592
|
+
const [draft, setDraft] = React65.useState(
|
|
18472
18593
|
isControlled ? externalValue : defaultValue
|
|
18473
18594
|
);
|
|
18474
|
-
const lastExternalKeyRef =
|
|
18595
|
+
const lastExternalKeyRef = React65.useRef(getRangeKey(externalValue));
|
|
18475
18596
|
if (isControlled) {
|
|
18476
18597
|
const externalKey = getRangeKey(externalValue);
|
|
18477
18598
|
if (externalKey !== lastExternalKeyRef.current) {
|
|
@@ -18479,7 +18600,7 @@ function useRangeValue({
|
|
|
18479
18600
|
setDraft(externalValue);
|
|
18480
18601
|
}
|
|
18481
18602
|
}
|
|
18482
|
-
const commit =
|
|
18603
|
+
const commit = React65.useCallback(
|
|
18483
18604
|
(next) => {
|
|
18484
18605
|
setDraft(next);
|
|
18485
18606
|
if (next === void 0) {
|
|
@@ -18494,7 +18615,7 @@ function useRangeValue({
|
|
|
18494
18615
|
}
|
|
18495
18616
|
|
|
18496
18617
|
// src/fields/date-range-picker/hooks/useRangeTextInputs.ts
|
|
18497
|
-
import * as
|
|
18618
|
+
import * as React66 from "react";
|
|
18498
18619
|
|
|
18499
18620
|
// src/fields/date-range-picker/utils/inputFormat.ts
|
|
18500
18621
|
function parseDateInputFormat(format2) {
|
|
@@ -18584,18 +18705,18 @@ function useRangeTextInputs({
|
|
|
18584
18705
|
onFromComplete,
|
|
18585
18706
|
onToComplete
|
|
18586
18707
|
}) {
|
|
18587
|
-
const tokens =
|
|
18708
|
+
const tokens = React66.useMemo(
|
|
18588
18709
|
() => parseDateInputFormat(displayFormat),
|
|
18589
18710
|
[displayFormat]
|
|
18590
18711
|
);
|
|
18591
|
-
const maxDigits =
|
|
18592
|
-
const [fromText, setFromText] =
|
|
18593
|
-
const [toText, setToText] =
|
|
18594
|
-
|
|
18712
|
+
const maxDigits = React66.useMemo(() => getMaxDigits(tokens), [tokens]);
|
|
18713
|
+
const [fromText, setFromText] = React66.useState(value?.from ? format2(value.from) : "");
|
|
18714
|
+
const [toText, setToText] = React66.useState(value?.to ? format2(value.to) : "");
|
|
18715
|
+
React66.useEffect(() => {
|
|
18595
18716
|
setFromText(value?.from ? format2(value.from) : "");
|
|
18596
18717
|
setToText(value?.to ? format2(value.to) : "");
|
|
18597
18718
|
}, [format2, value?.from, value?.to]);
|
|
18598
|
-
const handleFromChange =
|
|
18719
|
+
const handleFromChange = React66.useCallback(
|
|
18599
18720
|
(raw) => {
|
|
18600
18721
|
const formatted = autoFormatDateInput(raw, tokens);
|
|
18601
18722
|
const wasComplete = countDigits(fromText) === maxDigits;
|
|
@@ -18607,7 +18728,7 @@ function useRangeTextInputs({
|
|
|
18607
18728
|
},
|
|
18608
18729
|
[fromText, maxDigits, onFromComplete, parse3, tokens]
|
|
18609
18730
|
);
|
|
18610
|
-
const handleToChange =
|
|
18731
|
+
const handleToChange = React66.useCallback(
|
|
18611
18732
|
(raw) => {
|
|
18612
18733
|
const formatted = autoFormatDateInput(raw, tokens);
|
|
18613
18734
|
const wasComplete = countDigits(toText) === maxDigits;
|
|
@@ -18619,7 +18740,7 @@ function useRangeTextInputs({
|
|
|
18619
18740
|
},
|
|
18620
18741
|
[maxDigits, onToComplete, parse3, toText, tokens]
|
|
18621
18742
|
);
|
|
18622
|
-
const handleFromBlur =
|
|
18743
|
+
const handleFromBlur = React66.useCallback(() => {
|
|
18623
18744
|
if (!fromText) {
|
|
18624
18745
|
const next = { from: void 0, to: value?.to };
|
|
18625
18746
|
onCommit(next);
|
|
@@ -18636,7 +18757,7 @@ function useRangeTextInputs({
|
|
|
18636
18757
|
setFromText(value?.from ? format2(value.from) : "");
|
|
18637
18758
|
return void 0;
|
|
18638
18759
|
}, [format2, fromText, onBlur, onCommit, parse3, value]);
|
|
18639
|
-
const handleToBlur =
|
|
18760
|
+
const handleToBlur = React66.useCallback(() => {
|
|
18640
18761
|
if (!toText) {
|
|
18641
18762
|
const next = { from: value?.from, to: void 0 };
|
|
18642
18763
|
onCommit(next);
|
|
@@ -18665,21 +18786,21 @@ function useRangeTextInputs({
|
|
|
18665
18786
|
}
|
|
18666
18787
|
|
|
18667
18788
|
// src/fields/date-range-picker/hooks/useRangeMonthSync.ts
|
|
18668
|
-
import * as
|
|
18789
|
+
import * as React67 from "react";
|
|
18669
18790
|
function useRangeMonthSync(value) {
|
|
18670
|
-
const isPreloadedRef =
|
|
18671
|
-
const [month, setMonth] =
|
|
18672
|
-
|
|
18791
|
+
const isPreloadedRef = React67.useRef(false);
|
|
18792
|
+
const [month, setMonth] = React67.useState(value?.from ?? /* @__PURE__ */ new Date());
|
|
18793
|
+
React67.useEffect(() => {
|
|
18673
18794
|
if (value?.from && !isPreloadedRef.current) {
|
|
18674
18795
|
setMonth(value.from);
|
|
18675
18796
|
isPreloadedRef.current = true;
|
|
18676
18797
|
}
|
|
18677
18798
|
}, [value?.from]);
|
|
18678
|
-
const syncMonthToValue =
|
|
18799
|
+
const syncMonthToValue = React67.useCallback((next) => {
|
|
18679
18800
|
isPreloadedRef.current = true;
|
|
18680
18801
|
if (next?.from) setMonth(next.from);
|
|
18681
18802
|
}, []);
|
|
18682
|
-
const resetPreload =
|
|
18803
|
+
const resetPreload = React67.useCallback(() => {
|
|
18683
18804
|
isPreloadedRef.current = false;
|
|
18684
18805
|
}, []);
|
|
18685
18806
|
return { month, setMonth, syncMonthToValue, resetPreload };
|
|
@@ -18947,7 +19068,7 @@ function DateRangePopover({
|
|
|
18947
19068
|
|
|
18948
19069
|
// src/fields/date-range-picker/DateRangePicker.tsx
|
|
18949
19070
|
import { jsx as jsx176, jsxs as jsxs111 } from "react/jsx-runtime";
|
|
18950
|
-
var DateRangePicker =
|
|
19071
|
+
var DateRangePicker = React68.forwardRef(function DateRangePicker2({
|
|
18951
19072
|
label,
|
|
18952
19073
|
value: externalValue,
|
|
18953
19074
|
defaultValue,
|
|
@@ -18982,20 +19103,20 @@ var DateRangePicker = React67.forwardRef(function DateRangePicker2({
|
|
|
18982
19103
|
components: customComponents,
|
|
18983
19104
|
...dayPickerProps
|
|
18984
19105
|
}, ref) {
|
|
18985
|
-
const containerRef =
|
|
18986
|
-
const fromInputRef =
|
|
18987
|
-
const toInputRef =
|
|
18988
|
-
const reactId =
|
|
19106
|
+
const containerRef = React68.useRef(null);
|
|
19107
|
+
const fromInputRef = React68.useRef(null);
|
|
19108
|
+
const toInputRef = React68.useRef(null);
|
|
19109
|
+
const reactId = React68.useId();
|
|
18989
19110
|
const baseId = name ?? `dash-daterange-${reactId}`;
|
|
18990
19111
|
const fromId = `${baseId}-from`;
|
|
18991
19112
|
const toId = `${baseId}-to`;
|
|
18992
19113
|
const labelId = `${baseId}-label`;
|
|
18993
19114
|
const errorId = `${baseId}-error`;
|
|
18994
|
-
const normalizedValue =
|
|
19115
|
+
const normalizedValue = React68.useMemo(() => {
|
|
18995
19116
|
if (externalValue === void 0) return void 0;
|
|
18996
19117
|
return { from: toDate(externalValue?.from), to: toDate(externalValue?.to) };
|
|
18997
19118
|
}, [externalValue]);
|
|
18998
|
-
const normalizedDefaultValue =
|
|
19119
|
+
const normalizedDefaultValue = React68.useMemo(() => {
|
|
18999
19120
|
if (defaultValue === void 0) return void 0;
|
|
19000
19121
|
return { from: toDate(defaultValue?.from), to: toDate(defaultValue?.to) };
|
|
19001
19122
|
}, [defaultValue]);
|
|
@@ -19005,16 +19126,16 @@ var DateRangePicker = React67.forwardRef(function DateRangePicker2({
|
|
|
19005
19126
|
onChange,
|
|
19006
19127
|
name
|
|
19007
19128
|
});
|
|
19008
|
-
const normalizedMinDate =
|
|
19009
|
-
const normalizedMaxDate =
|
|
19010
|
-
const formatter =
|
|
19011
|
-
const parser =
|
|
19012
|
-
const closeCalendarRef =
|
|
19129
|
+
const normalizedMinDate = React68.useMemo(() => toDate(minDate), [minDate]);
|
|
19130
|
+
const normalizedMaxDate = React68.useMemo(() => toDate(maxDate), [maxDate]);
|
|
19131
|
+
const formatter = React68.useMemo(() => formatDate(displayFormat), [displayFormat]);
|
|
19132
|
+
const parser = React68.useMemo(() => parseDate(displayFormat), [displayFormat]);
|
|
19133
|
+
const closeCalendarRef = React68.useRef(() => {
|
|
19013
19134
|
});
|
|
19014
|
-
const handleFromComplete =
|
|
19135
|
+
const handleFromComplete = React68.useCallback(() => {
|
|
19015
19136
|
toInputRef.current?.focus();
|
|
19016
19137
|
}, []);
|
|
19017
|
-
const handleToComplete =
|
|
19138
|
+
const handleToComplete = React68.useCallback(() => {
|
|
19018
19139
|
toInputRef.current?.blur();
|
|
19019
19140
|
closeCalendarRef.current();
|
|
19020
19141
|
}, []);
|
|
@@ -19038,9 +19159,9 @@ var DateRangePicker = React67.forwardRef(function DateRangePicker2({
|
|
|
19038
19159
|
onToComplete: handleToComplete
|
|
19039
19160
|
});
|
|
19040
19161
|
const { month, setMonth, syncMonthToValue } = useRangeMonthSync(value);
|
|
19041
|
-
const [isOpen, setIsOpen] =
|
|
19042
|
-
const [focusedInput, setFocusedInput] =
|
|
19043
|
-
const [autoFocus, setAutoFocus] =
|
|
19162
|
+
const [isOpen, setIsOpen] = React68.useState(false);
|
|
19163
|
+
const [focusedInput, setFocusedInput] = React68.useState(null);
|
|
19164
|
+
const [autoFocus, setAutoFocus] = React68.useState(false);
|
|
19044
19165
|
const isMobile3 = useIsMobile();
|
|
19045
19166
|
const { t } = useTranslation39();
|
|
19046
19167
|
const drawerTitle = label ?? t("select_dates");
|
|
@@ -19051,14 +19172,14 @@ var DateRangePicker = React67.forwardRef(function DateRangePicker2({
|
|
|
19051
19172
|
const isFocused = focusedInput !== null || isOpen;
|
|
19052
19173
|
const wrapperWidth = toCssSize(width);
|
|
19053
19174
|
const monthsToShow = numberOfMonths ?? (isMobile3 ? 1 : 2);
|
|
19054
|
-
const closeCalendar =
|
|
19175
|
+
const closeCalendar = React68.useCallback(() => {
|
|
19055
19176
|
setIsOpen(false);
|
|
19056
19177
|
setFocusedInput(null);
|
|
19057
19178
|
setAutoFocus(false);
|
|
19058
19179
|
if (value?.from) setMonth(value.from);
|
|
19059
19180
|
}, [setMonth, value?.from]);
|
|
19060
19181
|
closeCalendarRef.current = closeCalendar;
|
|
19061
|
-
const openCalendar =
|
|
19182
|
+
const openCalendar = React68.useCallback(() => {
|
|
19062
19183
|
if (isBlocked || readOnly) return;
|
|
19063
19184
|
setIsOpen(true);
|
|
19064
19185
|
}, [isBlocked, readOnly]);
|
|
@@ -19067,7 +19188,7 @@ var DateRangePicker = React67.forwardRef(function DateRangePicker2({
|
|
|
19067
19188
|
onOutsideClick: closeCalendar,
|
|
19068
19189
|
isDisabled: !isOpen || isMobile3
|
|
19069
19190
|
});
|
|
19070
|
-
const handlePickerChange =
|
|
19191
|
+
const handlePickerChange = React68.useCallback(
|
|
19071
19192
|
(range, pickedDate) => {
|
|
19072
19193
|
const { next, shouldClose } = resolveRangeSelection({
|
|
19073
19194
|
previous: value,
|
|
@@ -19088,7 +19209,7 @@ var DateRangePicker = React67.forwardRef(function DateRangePicker2({
|
|
|
19088
19209
|
setToText("");
|
|
19089
19210
|
setMonth(/* @__PURE__ */ new Date());
|
|
19090
19211
|
};
|
|
19091
|
-
const disabledMatchers =
|
|
19212
|
+
const disabledMatchers = React68.useMemo(
|
|
19092
19213
|
() => createDisabledMatchers({
|
|
19093
19214
|
minDate: normalizedMinDate,
|
|
19094
19215
|
maxDate: normalizedMaxDate,
|
|
@@ -19107,7 +19228,7 @@ var DateRangePicker = React67.forwardRef(function DateRangePicker2({
|
|
|
19107
19228
|
openCalendar();
|
|
19108
19229
|
if (autoFocusOnOpen) setAutoFocus(true);
|
|
19109
19230
|
};
|
|
19110
|
-
|
|
19231
|
+
React68.useImperativeHandle(
|
|
19111
19232
|
ref,
|
|
19112
19233
|
() => ({
|
|
19113
19234
|
setDateRange: (range) => {
|
|
@@ -19288,7 +19409,7 @@ var DateRangePicker = React67.forwardRef(function DateRangePicker2({
|
|
|
19288
19409
|
});
|
|
19289
19410
|
|
|
19290
19411
|
// src/fields/date-range-picker/useValidateDates.ts
|
|
19291
|
-
import * as
|
|
19412
|
+
import * as React69 from "react";
|
|
19292
19413
|
import { useTranslation as useTranslation40 } from "react-i18next";
|
|
19293
19414
|
import { differenceInDays as differenceInDays2, isAfter as isAfter2, isBefore as isBefore3 } from "date-fns";
|
|
19294
19415
|
import {
|
|
@@ -19314,11 +19435,11 @@ function useValidateDates({
|
|
|
19314
19435
|
const { t } = useTranslation40();
|
|
19315
19436
|
const handleError = useEvent(onError);
|
|
19316
19437
|
const handleSuccess = useEvent(onSuccess);
|
|
19317
|
-
const errorFormatter =
|
|
19438
|
+
const errorFormatter = React69.useMemo(
|
|
19318
19439
|
() => formatDate(displayFormat ?? DEFAULT_DISPLAY_FORMAT),
|
|
19319
19440
|
[displayFormat]
|
|
19320
19441
|
);
|
|
19321
|
-
const validateDates =
|
|
19442
|
+
const validateDates = React69.useCallback(
|
|
19322
19443
|
(dates) => {
|
|
19323
19444
|
const startDate = dates?.from;
|
|
19324
19445
|
const endDate = dates?.to;
|
|
@@ -19368,7 +19489,7 @@ function useValidateDates({
|
|
|
19368
19489
|
}
|
|
19369
19490
|
|
|
19370
19491
|
// src/fields/time-picker/TimePicker.tsx
|
|
19371
|
-
import * as
|
|
19492
|
+
import * as React70 from "react";
|
|
19372
19493
|
import { addDays, addHours, addMinutes, format, parse as parse2 } from "date-fns";
|
|
19373
19494
|
import { jsx as jsx177 } from "react/jsx-runtime";
|
|
19374
19495
|
var SHORT_TIME_FORMAT = "HH:mm";
|
|
@@ -19412,8 +19533,8 @@ var FORMAT_SETTINGS = {
|
|
|
19412
19533
|
},
|
|
19413
19534
|
hours: { interval_unit: "H", interval: 1, min_time: "00:00", max_time: "23:00" }
|
|
19414
19535
|
};
|
|
19415
|
-
var TimePicker =
|
|
19416
|
-
const resolvedOptions =
|
|
19536
|
+
var TimePicker = React70.forwardRef(function TimePicker2({ format: formatName = "time", timeSettings, options, ...selectProps }, ref) {
|
|
19537
|
+
const resolvedOptions = React70.useMemo(() => {
|
|
19417
19538
|
if (options) return options;
|
|
19418
19539
|
const settings = timeSettings ?? FORMAT_SETTINGS[formatName];
|
|
19419
19540
|
return buildOptions(settings);
|
|
@@ -19422,14 +19543,14 @@ var TimePicker = React69.forwardRef(function TimePicker2({ format: formatName =
|
|
|
19422
19543
|
});
|
|
19423
19544
|
|
|
19424
19545
|
// src/fields/file-input/FileInput.tsx
|
|
19425
|
-
import * as
|
|
19546
|
+
import * as React71 from "react";
|
|
19426
19547
|
import { Download, Paperclip, SquareX as SquareX5 } from "lucide-react";
|
|
19427
19548
|
import { useTranslation as useTranslation41 } from "react-i18next";
|
|
19428
19549
|
import { jsx as jsx178, jsxs as jsxs112 } from "react/jsx-runtime";
|
|
19429
19550
|
function defaultDownload(url) {
|
|
19430
19551
|
window.open(url, "_blank", "noopener,noreferrer");
|
|
19431
19552
|
}
|
|
19432
|
-
var FileInput =
|
|
19553
|
+
var FileInput = React71.forwardRef(function FileInput2({
|
|
19433
19554
|
label,
|
|
19434
19555
|
value,
|
|
19435
19556
|
onChange,
|
|
@@ -19452,12 +19573,12 @@ var FileInput = React70.forwardRef(function FileInput2({
|
|
|
19452
19573
|
width,
|
|
19453
19574
|
downloadLabel
|
|
19454
19575
|
}, ref) {
|
|
19455
|
-
const internalRef =
|
|
19576
|
+
const internalRef = React71.useRef(null);
|
|
19456
19577
|
const inputRef = useCombinedRef(ref, internalRef);
|
|
19457
19578
|
const { t } = useTranslation41();
|
|
19458
19579
|
const resolvedLabel = label ?? t("upload_file");
|
|
19459
19580
|
const resolvedDownloadLabel = downloadLabel ?? t("download_attachment");
|
|
19460
|
-
const reactId =
|
|
19581
|
+
const reactId = React71.useId();
|
|
19461
19582
|
const inputId = `${name || "dash-file"}-${reactId}`;
|
|
19462
19583
|
const labelId = `${inputId}-label`;
|
|
19463
19584
|
const errorId = `${inputId}-error`;
|
|
@@ -19602,10 +19723,10 @@ var FileInput = React70.forwardRef(function FileInput2({
|
|
|
19602
19723
|
});
|
|
19603
19724
|
|
|
19604
19725
|
// src/fields/select-icons-box/SelectIconsBox.tsx
|
|
19605
|
-
import * as
|
|
19726
|
+
import * as React72 from "react";
|
|
19606
19727
|
import { jsx as jsx179, jsxs as jsxs113 } from "react/jsx-runtime";
|
|
19607
19728
|
var FOCUSABLE_TRIGGER_SELECTOR2 = 'input:not([type="hidden"]):not([disabled]):not([readonly]), button:not([disabled])';
|
|
19608
|
-
var SelectIconsBox =
|
|
19729
|
+
var SelectIconsBox = React72.forwardRef(
|
|
19609
19730
|
function SelectIconsBox2({
|
|
19610
19731
|
children,
|
|
19611
19732
|
icons,
|
|
@@ -19621,10 +19742,10 @@ var SelectIconsBox = React71.forwardRef(
|
|
|
19621
19742
|
className,
|
|
19622
19743
|
boxClassName
|
|
19623
19744
|
}, ref) {
|
|
19624
|
-
const containerRef =
|
|
19745
|
+
const containerRef = React72.useRef(null);
|
|
19625
19746
|
const combinedContainerRef = useCombinedRef(containerRef, ref);
|
|
19626
19747
|
const isControlled = controlledOpen !== void 0;
|
|
19627
|
-
const [internalOpen, setInternalOpen] =
|
|
19748
|
+
const [internalOpen, setInternalOpen] = React72.useState(defaultOpen);
|
|
19628
19749
|
const isOpen = isControlled ? controlledOpen : internalOpen;
|
|
19629
19750
|
const setOpen = (next) => {
|
|
19630
19751
|
if (!isControlled) setInternalOpen(next);
|
|
@@ -19817,15 +19938,40 @@ var LegacyTextarea = forwardRef73(
|
|
|
19817
19938
|
LegacyTextarea.displayName = "LegacyTextarea";
|
|
19818
19939
|
|
|
19819
19940
|
// src/airbnb-fields/datepicker/DatePicker.tsx
|
|
19820
|
-
import * as
|
|
19941
|
+
import * as React74 from "react";
|
|
19821
19942
|
import { Calendar as Calendar2 } from "lucide-react";
|
|
19822
19943
|
|
|
19823
19944
|
// src/airbnb-fields/field-trigger/FieldTrigger.tsx
|
|
19824
|
-
import * as
|
|
19945
|
+
import * as React73 from "react";
|
|
19825
19946
|
import { Loader2 as Loader24 } from "lucide-react";
|
|
19826
19947
|
import { useTranslation as useTranslation42 } from "react-i18next";
|
|
19827
|
-
|
|
19828
|
-
|
|
19948
|
+
|
|
19949
|
+
// src/airbnb-fields/field-helper-text/FieldHelperText.tsx
|
|
19950
|
+
import { jsx as jsx182 } from "react/jsx-runtime";
|
|
19951
|
+
function AirbnbFieldHelperText({
|
|
19952
|
+
id,
|
|
19953
|
+
helper,
|
|
19954
|
+
disabled,
|
|
19955
|
+
className
|
|
19956
|
+
}) {
|
|
19957
|
+
if (!helper) return null;
|
|
19958
|
+
return /* @__PURE__ */ jsx182(
|
|
19959
|
+
"p",
|
|
19960
|
+
{
|
|
19961
|
+
id,
|
|
19962
|
+
className: cn(
|
|
19963
|
+
"mt-2 text-[12px] font-normal leading-5 text-[var(--chekin-airbnb-gray-text)]",
|
|
19964
|
+
disabled && "opacity-50",
|
|
19965
|
+
className
|
|
19966
|
+
),
|
|
19967
|
+
children: helper
|
|
19968
|
+
}
|
|
19969
|
+
);
|
|
19970
|
+
}
|
|
19971
|
+
|
|
19972
|
+
// src/airbnb-fields/field-trigger/FieldTrigger.tsx
|
|
19973
|
+
import { Fragment as Fragment17, jsx as jsx183, jsxs as jsxs116 } from "react/jsx-runtime";
|
|
19974
|
+
var AirbnbFieldTrigger = React73.forwardRef(
|
|
19829
19975
|
({
|
|
19830
19976
|
as = "button",
|
|
19831
19977
|
id,
|
|
@@ -19838,6 +19984,7 @@ var AirbnbFieldTrigger = React72.forwardRef(
|
|
|
19838
19984
|
labelText,
|
|
19839
19985
|
valueText,
|
|
19840
19986
|
placeholder,
|
|
19987
|
+
helper,
|
|
19841
19988
|
disabled,
|
|
19842
19989
|
error,
|
|
19843
19990
|
loading,
|
|
@@ -19856,19 +20003,20 @@ var AirbnbFieldTrigger = React72.forwardRef(
|
|
|
19856
20003
|
...props
|
|
19857
20004
|
}, ref) => {
|
|
19858
20005
|
const { t } = useTranslation42();
|
|
20006
|
+
const generatedHelperId = React73.useId();
|
|
19859
20007
|
const hasValue = Boolean(valueText);
|
|
19860
20008
|
const isRaised = hasValue || forceFloatingLabel;
|
|
19861
20009
|
const optionalLabel = optional ? typeof optional === "string" ? optional : t("optional") : void 0;
|
|
19862
20010
|
const visibleLabelText = labelText ?? label;
|
|
19863
20011
|
const hasLabelMeta = Boolean(optionalLabel) || Boolean(tooltip);
|
|
19864
20012
|
const resolvedLabelText = visibleLabelText && hasLabelMeta ? /* @__PURE__ */ jsxs116("span", { className: "inline-flex max-w-full items-center gap-1.5 align-middle", children: [
|
|
19865
|
-
/* @__PURE__ */
|
|
20013
|
+
/* @__PURE__ */ jsx183("span", { className: "min-w-0 truncate", children: visibleLabelText }),
|
|
19866
20014
|
optionalLabel && /* @__PURE__ */ jsxs116("span", { className: "text-current opacity-70 lowercase", children: [
|
|
19867
20015
|
"(",
|
|
19868
20016
|
optionalLabel,
|
|
19869
20017
|
")"
|
|
19870
20018
|
] }),
|
|
19871
|
-
tooltip && /* @__PURE__ */
|
|
20019
|
+
tooltip && /* @__PURE__ */ jsx183(
|
|
19872
20020
|
HelpTooltip,
|
|
19873
20021
|
{
|
|
19874
20022
|
content: tooltip,
|
|
@@ -19882,10 +20030,14 @@ var AirbnbFieldTrigger = React72.forwardRef(
|
|
|
19882
20030
|
const animatedLabel = forceLabelText ? resolvedLabelText ?? placeholder : isRaised ? resolvedLabelText : label ?? placeholder;
|
|
19883
20031
|
const hasInvalidState = Boolean(error);
|
|
19884
20032
|
const errorMessage = typeof error === "string" ? error : void 0;
|
|
20033
|
+
const showErrorMessage = Boolean(errorMessage) && !hideErrorMessage;
|
|
20034
|
+
const showHelper = Boolean(helper) && !showErrorMessage;
|
|
20035
|
+
const helperId = helper ? generatedHelperId : void 0;
|
|
20036
|
+
const describedByValue = [describedBy, showHelper ? helperId : void 0].filter(Boolean).join(" ") || void 0;
|
|
19885
20037
|
const isBlocked = Boolean(disabled) || Boolean(loading);
|
|
19886
20038
|
const resolvedTrailingAdornment = loading || trailingAdornment ? /* @__PURE__ */ jsxs116("span", { className: "flex items-center gap-2", children: [
|
|
19887
20039
|
trailingAdornment,
|
|
19888
|
-
loading && /* @__PURE__ */
|
|
20040
|
+
loading && /* @__PURE__ */ jsx183(
|
|
19889
20041
|
Loader24,
|
|
19890
20042
|
{
|
|
19891
20043
|
"aria-hidden": "true",
|
|
@@ -19911,7 +20063,7 @@ var AirbnbFieldTrigger = React72.forwardRef(
|
|
|
19911
20063
|
contentClassName
|
|
19912
20064
|
),
|
|
19913
20065
|
children: [
|
|
19914
|
-
/* @__PURE__ */
|
|
20066
|
+
/* @__PURE__ */ jsx183(
|
|
19915
20067
|
"span",
|
|
19916
20068
|
{
|
|
19917
20069
|
id: labelId,
|
|
@@ -19924,7 +20076,7 @@ var AirbnbFieldTrigger = React72.forwardRef(
|
|
|
19924
20076
|
children: animatedLabel
|
|
19925
20077
|
}
|
|
19926
20078
|
),
|
|
19927
|
-
children ? children : hasValue ? /* @__PURE__ */
|
|
20079
|
+
children ? children : hasValue ? /* @__PURE__ */ jsx183(
|
|
19928
20080
|
"span",
|
|
19929
20081
|
{
|
|
19930
20082
|
id: valueId,
|
|
@@ -19935,11 +20087,11 @@ var AirbnbFieldTrigger = React72.forwardRef(
|
|
|
19935
20087
|
),
|
|
19936
20088
|
children: valueText
|
|
19937
20089
|
}
|
|
19938
|
-
) : /* @__PURE__ */
|
|
20090
|
+
) : /* @__PURE__ */ jsx183("span", { id: helperTextId, className: "sr-only", children: placeholder ?? label })
|
|
19939
20091
|
]
|
|
19940
20092
|
}
|
|
19941
20093
|
),
|
|
19942
|
-
resolvedTrailingAdornment && /* @__PURE__ */
|
|
20094
|
+
resolvedTrailingAdornment && /* @__PURE__ */ jsx183(
|
|
19943
20095
|
"span",
|
|
19944
20096
|
{
|
|
19945
20097
|
"aria-hidden": "true",
|
|
@@ -19949,15 +20101,15 @@ var AirbnbFieldTrigger = React72.forwardRef(
|
|
|
19949
20101
|
)
|
|
19950
20102
|
] });
|
|
19951
20103
|
return /* @__PURE__ */ jsxs116("div", { className: "w-full", children: [
|
|
19952
|
-
topLabel && /* @__PURE__ */
|
|
19953
|
-
as === "button" ? /* @__PURE__ */
|
|
20104
|
+
topLabel && /* @__PURE__ */ jsx183("p", { className: "mb-3 text-[16px] font-semibold leading-5 text-[var(--chekin-airbnb-ink-strong)]", children: topLabel }),
|
|
20105
|
+
as === "button" ? /* @__PURE__ */ jsx183(
|
|
19954
20106
|
"button",
|
|
19955
20107
|
{
|
|
19956
20108
|
id,
|
|
19957
20109
|
ref,
|
|
19958
20110
|
type: "button",
|
|
19959
20111
|
"aria-labelledby": hasValue && valueId ? `${labelId} ${valueId}` : labelId,
|
|
19960
|
-
"aria-describedby":
|
|
20112
|
+
"aria-describedby": describedByValue,
|
|
19961
20113
|
"aria-invalid": hasInvalidState,
|
|
19962
20114
|
"aria-busy": loading,
|
|
19963
20115
|
disabled: isBlocked,
|
|
@@ -19967,13 +20119,13 @@ var AirbnbFieldTrigger = React72.forwardRef(
|
|
|
19967
20119
|
...props,
|
|
19968
20120
|
children: sharedContent
|
|
19969
20121
|
}
|
|
19970
|
-
) : /* @__PURE__ */
|
|
20122
|
+
) : /* @__PURE__ */ jsx183(
|
|
19971
20123
|
"div",
|
|
19972
20124
|
{
|
|
19973
20125
|
id,
|
|
19974
20126
|
ref,
|
|
19975
20127
|
"aria-labelledby": hasValue && valueId ? `${labelId} ${valueId}` : labelId,
|
|
19976
|
-
"aria-describedby":
|
|
20128
|
+
"aria-describedby": describedByValue,
|
|
19977
20129
|
"aria-invalid": hasInvalidState,
|
|
19978
20130
|
"aria-busy": loading,
|
|
19979
20131
|
"aria-disabled": isBlocked,
|
|
@@ -19984,16 +20136,17 @@ var AirbnbFieldTrigger = React72.forwardRef(
|
|
|
19984
20136
|
children: sharedContent
|
|
19985
20137
|
}
|
|
19986
20138
|
),
|
|
19987
|
-
|
|
20139
|
+
showErrorMessage && /* @__PURE__ */ jsx183(FieldErrorMessage, { id: errorId, message: errorMessage }),
|
|
20140
|
+
showHelper && /* @__PURE__ */ jsx183(AirbnbFieldHelperText, { id: helperId, helper, disabled })
|
|
19988
20141
|
] });
|
|
19989
20142
|
}
|
|
19990
20143
|
);
|
|
19991
20144
|
AirbnbFieldTrigger.displayName = "AirbnbFieldTrigger";
|
|
19992
20145
|
|
|
19993
20146
|
// src/airbnb-fields/datepicker/DatePicker.tsx
|
|
19994
|
-
import { jsx as
|
|
20147
|
+
import { jsx as jsx184, jsxs as jsxs117 } from "react/jsx-runtime";
|
|
19995
20148
|
var DEFAULT_MIN_DATE = new Date(1920, 0, 1);
|
|
19996
|
-
var AirbnbDatePicker =
|
|
20149
|
+
var AirbnbDatePicker = React74.forwardRef(
|
|
19997
20150
|
({
|
|
19998
20151
|
label,
|
|
19999
20152
|
topLabel,
|
|
@@ -20008,6 +20161,7 @@ var AirbnbDatePicker = React73.forwardRef(
|
|
|
20008
20161
|
loading,
|
|
20009
20162
|
optional,
|
|
20010
20163
|
tooltip,
|
|
20164
|
+
helper,
|
|
20011
20165
|
className,
|
|
20012
20166
|
name,
|
|
20013
20167
|
minDate,
|
|
@@ -20018,24 +20172,24 @@ var AirbnbDatePicker = React73.forwardRef(
|
|
|
20018
20172
|
formatValue = formatDateValue
|
|
20019
20173
|
}, ref) => {
|
|
20020
20174
|
const { isMatch: isMobile3 } = useScreenResize(DEVICE.mobileXL);
|
|
20021
|
-
const [isOpen, setIsOpen] =
|
|
20022
|
-
const triggerId =
|
|
20023
|
-
const pickerId =
|
|
20024
|
-
const labelId =
|
|
20025
|
-
const valueId =
|
|
20026
|
-
const helperTextId =
|
|
20027
|
-
const errorId =
|
|
20028
|
-
const internalRef =
|
|
20175
|
+
const [isOpen, setIsOpen] = React74.useState(false);
|
|
20176
|
+
const triggerId = React74.useId();
|
|
20177
|
+
const pickerId = React74.useId();
|
|
20178
|
+
const labelId = React74.useId();
|
|
20179
|
+
const valueId = React74.useId();
|
|
20180
|
+
const helperTextId = React74.useId();
|
|
20181
|
+
const errorId = React74.useId();
|
|
20182
|
+
const internalRef = React74.useRef(null);
|
|
20029
20183
|
const combinedRef = useCombinedRef(ref, internalRef);
|
|
20030
|
-
const monthLabels =
|
|
20031
|
-
const resolvedMinDate =
|
|
20032
|
-
const resolvedMaxDate =
|
|
20033
|
-
const normalizedValue =
|
|
20034
|
-
const normalizedDefaultValue =
|
|
20184
|
+
const monthLabels = React74.useMemo(() => getMonthLabels(locale), [locale]);
|
|
20185
|
+
const resolvedMinDate = React74.useMemo(() => minDate ?? DEFAULT_MIN_DATE, [minDate]);
|
|
20186
|
+
const resolvedMaxDate = React74.useMemo(() => maxDate ?? /* @__PURE__ */ new Date(), [maxDate]);
|
|
20187
|
+
const normalizedValue = React74.useMemo(() => normalizeDateValue(value), [value]);
|
|
20188
|
+
const normalizedDefaultValue = React74.useMemo(
|
|
20035
20189
|
() => normalizeDateValue(defaultValue),
|
|
20036
20190
|
[defaultValue]
|
|
20037
20191
|
);
|
|
20038
|
-
const resolvedValue =
|
|
20192
|
+
const resolvedValue = React74.useMemo(
|
|
20039
20193
|
() => normalizedValue ? clampDate(normalizedValue, resolvedMinDate, resolvedMaxDate) : null,
|
|
20040
20194
|
[normalizedValue, resolvedMaxDate, resolvedMinDate]
|
|
20041
20195
|
);
|
|
@@ -20066,7 +20220,7 @@ var AirbnbDatePicker = React73.forwardRef(
|
|
|
20066
20220
|
minDate: resolvedMinDate,
|
|
20067
20221
|
maxDate: resolvedMaxDate
|
|
20068
20222
|
});
|
|
20069
|
-
const handleOpenChange =
|
|
20223
|
+
const handleOpenChange = React74.useCallback(
|
|
20070
20224
|
(nextOpen) => {
|
|
20071
20225
|
if (isBlocked && nextOpen) return;
|
|
20072
20226
|
setIsOpen(nextOpen);
|
|
@@ -20076,7 +20230,7 @@ var AirbnbDatePicker = React73.forwardRef(
|
|
|
20076
20230
|
},
|
|
20077
20231
|
[isBlocked]
|
|
20078
20232
|
);
|
|
20079
|
-
const handleDone =
|
|
20233
|
+
const handleDone = React74.useCallback(() => {
|
|
20080
20234
|
if (isBlocked) return;
|
|
20081
20235
|
onChange(clampDate(draftDate, resolvedMinDate, resolvedMaxDate));
|
|
20082
20236
|
handleOpenChange(false);
|
|
@@ -20088,11 +20242,11 @@ var AirbnbDatePicker = React73.forwardRef(
|
|
|
20088
20242
|
resolvedMaxDate,
|
|
20089
20243
|
resolvedMinDate
|
|
20090
20244
|
]);
|
|
20091
|
-
const handleTriggerClick =
|
|
20245
|
+
const handleTriggerClick = React74.useCallback(() => {
|
|
20092
20246
|
if (isBlocked) return;
|
|
20093
20247
|
setIsOpen(true);
|
|
20094
20248
|
}, [isBlocked]);
|
|
20095
|
-
const handleTriggerKeyDown =
|
|
20249
|
+
const handleTriggerKeyDown = React74.useCallback(
|
|
20096
20250
|
(event) => {
|
|
20097
20251
|
if (isBlocked) return;
|
|
20098
20252
|
if (event.key === "ArrowDown" || event.key === "ArrowUp" || event.key === "Enter" || event.key === " ") {
|
|
@@ -20102,13 +20256,13 @@ var AirbnbDatePicker = React73.forwardRef(
|
|
|
20102
20256
|
},
|
|
20103
20257
|
[isBlocked]
|
|
20104
20258
|
);
|
|
20105
|
-
|
|
20259
|
+
React74.useEffect(() => {
|
|
20106
20260
|
if (isBlocked) {
|
|
20107
20261
|
setIsOpen(false);
|
|
20108
20262
|
}
|
|
20109
20263
|
}, [isBlocked]);
|
|
20110
20264
|
return /* @__PURE__ */ jsxs117("div", { className: cn("relative w-full max-w-[var(--max-field-width)]", className), children: [
|
|
20111
|
-
name && /* @__PURE__ */
|
|
20265
|
+
name && /* @__PURE__ */ jsx184(
|
|
20112
20266
|
"input",
|
|
20113
20267
|
{
|
|
20114
20268
|
type: "hidden",
|
|
@@ -20116,7 +20270,7 @@ var AirbnbDatePicker = React73.forwardRef(
|
|
|
20116
20270
|
value: resolvedValue ? formatDateInputValue(resolvedValue) : ""
|
|
20117
20271
|
}
|
|
20118
20272
|
),
|
|
20119
|
-
/* @__PURE__ */
|
|
20273
|
+
/* @__PURE__ */ jsx184(
|
|
20120
20274
|
AirbnbFieldTrigger,
|
|
20121
20275
|
{
|
|
20122
20276
|
id: triggerId,
|
|
@@ -20136,13 +20290,14 @@ var AirbnbDatePicker = React73.forwardRef(
|
|
|
20136
20290
|
loading,
|
|
20137
20291
|
optional,
|
|
20138
20292
|
tooltip,
|
|
20293
|
+
helper,
|
|
20139
20294
|
forceLabelText: Boolean(optional) || Boolean(tooltip),
|
|
20140
20295
|
"aria-haspopup": "dialog",
|
|
20141
20296
|
"aria-expanded": isOpen,
|
|
20142
20297
|
onClick: handleTriggerClick,
|
|
20143
20298
|
onKeyDown: handleTriggerKeyDown,
|
|
20144
20299
|
onBlur,
|
|
20145
|
-
trailingAdornment: /* @__PURE__ */
|
|
20300
|
+
trailingAdornment: /* @__PURE__ */ jsx184(
|
|
20146
20301
|
Calendar2,
|
|
20147
20302
|
{
|
|
20148
20303
|
className: "h-5 w-5 text-[var(--chekin-airbnb-ink)]",
|
|
@@ -20151,7 +20306,7 @@ var AirbnbDatePicker = React73.forwardRef(
|
|
|
20151
20306
|
)
|
|
20152
20307
|
}
|
|
20153
20308
|
),
|
|
20154
|
-
/* @__PURE__ */
|
|
20309
|
+
/* @__PURE__ */ jsx184(
|
|
20155
20310
|
AirbnbDatePickerContent,
|
|
20156
20311
|
{
|
|
20157
20312
|
baseId: pickerId,
|
|
@@ -20185,16 +20340,17 @@ var AirbnbDatePicker = React73.forwardRef(
|
|
|
20185
20340
|
AirbnbDatePicker.displayName = "AirbnbDatePicker";
|
|
20186
20341
|
|
|
20187
20342
|
// src/airbnb-fields/input/Input.tsx
|
|
20188
|
-
import * as
|
|
20343
|
+
import * as React75 from "react";
|
|
20189
20344
|
import { Eye as Eye2 } from "lucide-react";
|
|
20190
20345
|
import { useTranslation as useTranslation43 } from "react-i18next";
|
|
20191
|
-
import { jsx as
|
|
20346
|
+
import { jsx as jsx185, jsxs as jsxs118 } from "react/jsx-runtime";
|
|
20192
20347
|
var getInputValue = (value) => value != null ? String(value) : "";
|
|
20193
|
-
var AirbnbInput =
|
|
20348
|
+
var AirbnbInput = React75.forwardRef(
|
|
20194
20349
|
({
|
|
20195
20350
|
label,
|
|
20196
20351
|
topLabel,
|
|
20197
20352
|
helperText,
|
|
20353
|
+
helper,
|
|
20198
20354
|
error,
|
|
20199
20355
|
invalid,
|
|
20200
20356
|
loading,
|
|
@@ -20219,16 +20375,16 @@ var AirbnbInput = React74.forwardRef(
|
|
|
20219
20375
|
...props
|
|
20220
20376
|
}, ref) => {
|
|
20221
20377
|
const { t } = useTranslation43();
|
|
20222
|
-
const generatedId =
|
|
20223
|
-
const inputRef =
|
|
20378
|
+
const generatedId = React75.useId();
|
|
20379
|
+
const inputRef = React75.useRef(null);
|
|
20224
20380
|
const inputId = id ?? generatedId;
|
|
20225
20381
|
const fieldId = `${inputId}-field`;
|
|
20226
20382
|
const labelId = `${inputId}-label`;
|
|
20227
20383
|
const errorId = `${inputId}-error`;
|
|
20228
20384
|
const accessibleLabel = placeholder ?? label;
|
|
20229
|
-
const [isFocused, setIsFocused] =
|
|
20230
|
-
const [isPasswordRevealed, setIsPasswordRevealed] =
|
|
20231
|
-
const [currentValue, setCurrentValue] =
|
|
20385
|
+
const [isFocused, setIsFocused] = React75.useState(false);
|
|
20386
|
+
const [isPasswordRevealed, setIsPasswordRevealed] = React75.useState(false);
|
|
20387
|
+
const [currentValue, setCurrentValue] = React75.useState(
|
|
20232
20388
|
() => value != null ? getInputValue(value) : getInputValue(defaultValue)
|
|
20233
20389
|
);
|
|
20234
20390
|
const resolvedValue = value != null ? getInputValue(value) : currentValue;
|
|
@@ -20241,16 +20397,16 @@ var AirbnbInput = React74.forwardRef(
|
|
|
20241
20397
|
const triggerError = error ?? invalid;
|
|
20242
20398
|
const hasLabelMeta = Boolean(optional) || Boolean(tooltip);
|
|
20243
20399
|
const isBlocked = Boolean(disabled) || Boolean(loading);
|
|
20244
|
-
|
|
20400
|
+
React75.useLayoutEffect(() => {
|
|
20245
20401
|
const nextValue = value != null ? getInputValue(value) : getInputValue(inputRef.current?.value);
|
|
20246
20402
|
setCurrentValue((prevValue) => prevValue === nextValue ? prevValue : nextValue);
|
|
20247
20403
|
}, [value]);
|
|
20248
|
-
|
|
20404
|
+
React75.useEffect(() => {
|
|
20249
20405
|
if (!isPasswordInput) {
|
|
20250
20406
|
setIsPasswordRevealed(false);
|
|
20251
20407
|
}
|
|
20252
20408
|
}, [isPasswordInput]);
|
|
20253
|
-
const setRefs =
|
|
20409
|
+
const setRefs = React75.useCallback(
|
|
20254
20410
|
(node) => {
|
|
20255
20411
|
inputRef.current = node;
|
|
20256
20412
|
if (node && value == null) {
|
|
@@ -20283,7 +20439,13 @@ var AirbnbInput = React74.forwardRef(
|
|
|
20283
20439
|
const togglePasswordReveal = () => {
|
|
20284
20440
|
setIsPasswordRevealed((isRevealed) => !isRevealed);
|
|
20285
20441
|
};
|
|
20286
|
-
|
|
20442
|
+
const focusInput = () => {
|
|
20443
|
+
if (isBlocked) {
|
|
20444
|
+
return;
|
|
20445
|
+
}
|
|
20446
|
+
inputRef.current?.focus();
|
|
20447
|
+
};
|
|
20448
|
+
return /* @__PURE__ */ jsx185("div", { className: cn("w-full max-w-[var(--max-field-width)]", wrapperClassName), children: /* @__PURE__ */ jsxs118(
|
|
20287
20449
|
AirbnbFieldTrigger,
|
|
20288
20450
|
{
|
|
20289
20451
|
as: "div",
|
|
@@ -20295,11 +20457,13 @@ var AirbnbInput = React74.forwardRef(
|
|
|
20295
20457
|
errorId: error ? errorId : void 0,
|
|
20296
20458
|
labelText: helperText ?? label,
|
|
20297
20459
|
placeholder: placeholder ?? label,
|
|
20460
|
+
helper,
|
|
20298
20461
|
disabled,
|
|
20299
20462
|
error: triggerError,
|
|
20300
20463
|
loading,
|
|
20301
20464
|
optional,
|
|
20302
20465
|
tooltip,
|
|
20466
|
+
onClick: focusInput,
|
|
20303
20467
|
describedBy: error && renderErrorMessage ? errorId : void 0,
|
|
20304
20468
|
className: cn(
|
|
20305
20469
|
"px-4 focus-within:ring-2 focus-within:ring-[var(--chekin-airbnb-ink)] focus-within:ring-offset-2",
|
|
@@ -20312,7 +20476,7 @@ var AirbnbInput = React74.forwardRef(
|
|
|
20312
20476
|
forceLabelText: hasLabelMeta,
|
|
20313
20477
|
hideErrorMessage: !renderErrorMessage,
|
|
20314
20478
|
children: [
|
|
20315
|
-
/* @__PURE__ */
|
|
20479
|
+
/* @__PURE__ */ jsx185(
|
|
20316
20480
|
"input",
|
|
20317
20481
|
{
|
|
20318
20482
|
...props,
|
|
@@ -20342,7 +20506,7 @@ var AirbnbInput = React74.forwardRef(
|
|
|
20342
20506
|
)
|
|
20343
20507
|
}
|
|
20344
20508
|
),
|
|
20345
|
-
shouldShowPasswordReveal && /* @__PURE__ */
|
|
20509
|
+
shouldShowPasswordReveal && /* @__PURE__ */ jsx185(
|
|
20346
20510
|
"button",
|
|
20347
20511
|
{
|
|
20348
20512
|
type: "button",
|
|
@@ -20350,7 +20514,7 @@ var AirbnbInput = React74.forwardRef(
|
|
|
20350
20514
|
disabled: isBlocked,
|
|
20351
20515
|
className: "absolute bottom-0 right-0 flex h-6 w-6 items-center justify-center border-0 bg-transparent p-0 text-[var(--chekin-airbnb-gray-cool)] hover:text-[var(--chekin-airbnb-ink)] hover:opacity-85 disabled:cursor-not-allowed disabled:opacity-50",
|
|
20352
20516
|
"aria-label": isPasswordRevealed ? t("hide_password") : t("show_password"),
|
|
20353
|
-
children: /* @__PURE__ */
|
|
20517
|
+
children: /* @__PURE__ */ jsx185(
|
|
20354
20518
|
Eye2,
|
|
20355
20519
|
{
|
|
20356
20520
|
size: 18,
|
|
@@ -20370,14 +20534,14 @@ var AirbnbInput = React74.forwardRef(
|
|
|
20370
20534
|
AirbnbInput.displayName = "AirbnbInput";
|
|
20371
20535
|
|
|
20372
20536
|
// src/airbnb-fields/phone-field/PhoneField.tsx
|
|
20373
|
-
import * as
|
|
20537
|
+
import * as React81 from "react";
|
|
20374
20538
|
import { ChevronDown as ChevronDown6 } from "lucide-react";
|
|
20375
20539
|
|
|
20376
20540
|
// src/airbnb-fields/select/Select.tsx
|
|
20377
|
-
import * as
|
|
20541
|
+
import * as React80 from "react";
|
|
20378
20542
|
|
|
20379
20543
|
// src/airbnb-fields/select/SelectDesktopMenu.tsx
|
|
20380
|
-
import { jsx as
|
|
20544
|
+
import { jsx as jsx186, jsxs as jsxs119 } from "react/jsx-runtime";
|
|
20381
20545
|
function AirbnbSelectDesktopMenu({
|
|
20382
20546
|
id,
|
|
20383
20547
|
options,
|
|
@@ -20409,12 +20573,12 @@ function AirbnbSelectDesktopMenu({
|
|
|
20409
20573
|
onKeyDown,
|
|
20410
20574
|
className: cn("max-h-[280px] overflow-y-auto p-2 outline-none", menuClassName),
|
|
20411
20575
|
children: [
|
|
20412
|
-
options.length === 0 && emptyMessage ? /* @__PURE__ */
|
|
20576
|
+
options.length === 0 && emptyMessage ? /* @__PURE__ */ jsx186("div", { className: "px-4 py-3 text-base leading-6 text-[var(--chekin-airbnb-gray-text)]", children: emptyMessage }) : null,
|
|
20413
20577
|
options.map((option, index) => {
|
|
20414
20578
|
const isSelected = selectedValue?.value === option.value;
|
|
20415
20579
|
const isHighlighted = index === highlightedIndex;
|
|
20416
20580
|
const optionKey = `${String(option.value)}-${index}`;
|
|
20417
|
-
return /* @__PURE__ */
|
|
20581
|
+
return /* @__PURE__ */ jsx186(
|
|
20418
20582
|
"button",
|
|
20419
20583
|
{
|
|
20420
20584
|
id: getOptionId2(index),
|
|
@@ -20446,7 +20610,7 @@ function AirbnbSelectDesktopMenu({
|
|
|
20446
20610
|
}
|
|
20447
20611
|
|
|
20448
20612
|
// src/airbnb-fields/select/SelectDesktopContent.tsx
|
|
20449
|
-
import { jsx as
|
|
20613
|
+
import { jsx as jsx187 } from "react/jsx-runtime";
|
|
20450
20614
|
function AirbnbSelectDesktopContent({
|
|
20451
20615
|
isOpen,
|
|
20452
20616
|
listboxId,
|
|
@@ -20467,14 +20631,14 @@ function AirbnbSelectDesktopContent({
|
|
|
20467
20631
|
noOptionsMessage
|
|
20468
20632
|
}) {
|
|
20469
20633
|
if (!isOpen) return null;
|
|
20470
|
-
return /* @__PURE__ */
|
|
20634
|
+
return /* @__PURE__ */ jsx187(
|
|
20471
20635
|
"div",
|
|
20472
20636
|
{
|
|
20473
20637
|
className: cn(
|
|
20474
20638
|
"absolute left-0 right-0 top-[calc(100%+8px)] z-20 overflow-hidden rounded-[20px] border border-[var(--chekin-airbnb-border)] bg-white shadow-[0_14px_30px_rgba(18,18,18,0.08)]",
|
|
20475
20639
|
dropdownClassName
|
|
20476
20640
|
),
|
|
20477
|
-
children: /* @__PURE__ */
|
|
20641
|
+
children: /* @__PURE__ */ jsx187(
|
|
20478
20642
|
AirbnbSelectDesktopMenu,
|
|
20479
20643
|
{
|
|
20480
20644
|
id: listboxId,
|
|
@@ -20572,7 +20736,7 @@ function getMobileOptionStyles(index, scrollTop) {
|
|
|
20572
20736
|
}
|
|
20573
20737
|
|
|
20574
20738
|
// src/airbnb-fields/select/SelectMobileWheel.tsx
|
|
20575
|
-
import { jsx as
|
|
20739
|
+
import { jsx as jsx188, jsxs as jsxs120 } from "react/jsx-runtime";
|
|
20576
20740
|
function AirbnbSelectMobileWheel({
|
|
20577
20741
|
id,
|
|
20578
20742
|
options,
|
|
@@ -20603,10 +20767,10 @@ function AirbnbSelectMobileWheel({
|
|
|
20603
20767
|
onKeyDown,
|
|
20604
20768
|
className: cn("relative overflow-hidden outline-none", menuClassName),
|
|
20605
20769
|
children: [
|
|
20606
|
-
options.length === 0 && emptyMessage ? /* @__PURE__ */
|
|
20607
|
-
/* @__PURE__ */
|
|
20608
|
-
/* @__PURE__ */
|
|
20609
|
-
/* @__PURE__ */
|
|
20770
|
+
options.length === 0 && emptyMessage ? /* @__PURE__ */ jsx188("div", { className: "flex min-h-[160px] items-center justify-center px-4 text-center text-base leading-6 text-[var(--chekin-airbnb-gray-text)]", children: emptyMessage }) : null,
|
|
20771
|
+
/* @__PURE__ */ jsx188("div", { className: "pointer-events-none absolute inset-x-0 top-0 h-16 bg-gradient-to-b from-white via-white/80 to-transparent" }),
|
|
20772
|
+
/* @__PURE__ */ jsx188("div", { className: "pointer-events-none absolute inset-x-0 bottom-0 h-16 bg-gradient-to-t from-white via-white/80 to-transparent" }),
|
|
20773
|
+
/* @__PURE__ */ jsx188(
|
|
20610
20774
|
"div",
|
|
20611
20775
|
{
|
|
20612
20776
|
"aria-hidden": true,
|
|
@@ -20631,11 +20795,11 @@ function AirbnbSelectMobileWheel({
|
|
|
20631
20795
|
WebkitOverflowScrolling: "touch"
|
|
20632
20796
|
},
|
|
20633
20797
|
children: [
|
|
20634
|
-
/* @__PURE__ */
|
|
20798
|
+
/* @__PURE__ */ jsx188("div", { style: { height: `${spacerHeight2}px` } }),
|
|
20635
20799
|
options.map((option, index) => {
|
|
20636
20800
|
const { distance, style } = getMobileOptionStyles(index, scrollTop);
|
|
20637
20801
|
const optionKey = `${String(option.value)}-${index}`;
|
|
20638
|
-
return /* @__PURE__ */
|
|
20802
|
+
return /* @__PURE__ */ jsx188(
|
|
20639
20803
|
"button",
|
|
20640
20804
|
{
|
|
20641
20805
|
id: getOptionId2(index),
|
|
@@ -20656,7 +20820,7 @@ function AirbnbSelectMobileWheel({
|
|
|
20656
20820
|
optionKey
|
|
20657
20821
|
);
|
|
20658
20822
|
}),
|
|
20659
|
-
/* @__PURE__ */
|
|
20823
|
+
/* @__PURE__ */ jsx188("div", { style: { height: `${spacerHeight2}px` } })
|
|
20660
20824
|
]
|
|
20661
20825
|
}
|
|
20662
20826
|
)
|
|
@@ -20666,7 +20830,7 @@ function AirbnbSelectMobileWheel({
|
|
|
20666
20830
|
}
|
|
20667
20831
|
|
|
20668
20832
|
// src/airbnb-fields/select/SelectMobileContent.tsx
|
|
20669
|
-
import { jsx as
|
|
20833
|
+
import { jsx as jsx189, jsxs as jsxs121 } from "react/jsx-runtime";
|
|
20670
20834
|
function AirbnbSelectMobileContent({
|
|
20671
20835
|
open,
|
|
20672
20836
|
onOpenChange,
|
|
@@ -20690,11 +20854,11 @@ function AirbnbSelectMobileContent({
|
|
|
20690
20854
|
getOptionId: getOptionId2,
|
|
20691
20855
|
noOptionsMessage
|
|
20692
20856
|
}) {
|
|
20693
|
-
return /* @__PURE__ */
|
|
20694
|
-
/* @__PURE__ */
|
|
20695
|
-
/* @__PURE__ */
|
|
20857
|
+
return /* @__PURE__ */ jsx189(Drawer, { open, onOpenChange, children: /* @__PURE__ */ jsxs121(DrawerContent, { onClose, lockScroll: false, children: [
|
|
20858
|
+
/* @__PURE__ */ jsx189(DrawerTitle, { className: "sr-only", children: mobileTitle ?? label }),
|
|
20859
|
+
/* @__PURE__ */ jsx189(DrawerDescription, { className: "sr-only", children: label }),
|
|
20696
20860
|
/* @__PURE__ */ jsxs121("div", { className: "px-6 pb-4 pt-1", children: [
|
|
20697
|
-
/* @__PURE__ */
|
|
20861
|
+
/* @__PURE__ */ jsx189(
|
|
20698
20862
|
AirbnbSelectMobileWheel,
|
|
20699
20863
|
{
|
|
20700
20864
|
id: listboxId,
|
|
@@ -20713,16 +20877,16 @@ function AirbnbSelectMobileContent({
|
|
|
20713
20877
|
noOptionsMessage
|
|
20714
20878
|
}
|
|
20715
20879
|
),
|
|
20716
|
-
/* @__PURE__ */
|
|
20880
|
+
/* @__PURE__ */ jsx189(Button, { type: "button", onClick: onDone, className: "mt-4 h-12 mb-8 w-full", children: doneLabel })
|
|
20717
20881
|
] })
|
|
20718
20882
|
] }) });
|
|
20719
20883
|
}
|
|
20720
20884
|
|
|
20721
20885
|
// src/airbnb-fields/select/SelectTrigger.tsx
|
|
20722
|
-
import * as
|
|
20886
|
+
import * as React76 from "react";
|
|
20723
20887
|
import { ChevronDown as ChevronDown5 } from "lucide-react";
|
|
20724
|
-
import { jsx as
|
|
20725
|
-
var AirbnbSelectTrigger =
|
|
20888
|
+
import { jsx as jsx190 } from "react/jsx-runtime";
|
|
20889
|
+
var AirbnbSelectTrigger = React76.forwardRef(
|
|
20726
20890
|
({
|
|
20727
20891
|
id,
|
|
20728
20892
|
open,
|
|
@@ -20734,6 +20898,7 @@ var AirbnbSelectTrigger = React75.forwardRef(
|
|
|
20734
20898
|
loading,
|
|
20735
20899
|
optional,
|
|
20736
20900
|
tooltip,
|
|
20901
|
+
helper,
|
|
20737
20902
|
error,
|
|
20738
20903
|
hideErrorMessage,
|
|
20739
20904
|
labelId,
|
|
@@ -20746,7 +20911,7 @@ var AirbnbSelectTrigger = React75.forwardRef(
|
|
|
20746
20911
|
onKeyDown,
|
|
20747
20912
|
onBlur
|
|
20748
20913
|
}, ref) => {
|
|
20749
|
-
return /* @__PURE__ */
|
|
20914
|
+
return /* @__PURE__ */ jsx190(
|
|
20750
20915
|
AirbnbFieldTrigger,
|
|
20751
20916
|
{
|
|
20752
20917
|
id,
|
|
@@ -20768,15 +20933,17 @@ var AirbnbSelectTrigger = React75.forwardRef(
|
|
|
20768
20933
|
loading,
|
|
20769
20934
|
optional,
|
|
20770
20935
|
tooltip,
|
|
20936
|
+
helper,
|
|
20771
20937
|
forceLabelText: Boolean(optional) || Boolean(tooltip),
|
|
20772
20938
|
hideErrorMessage,
|
|
20773
20939
|
disabled,
|
|
20774
20940
|
onClick,
|
|
20775
20941
|
onKeyDown,
|
|
20776
20942
|
onBlur,
|
|
20777
|
-
trailingAdornment: /* @__PURE__ */
|
|
20943
|
+
trailingAdornment: /* @__PURE__ */ jsx190(
|
|
20778
20944
|
ChevronDown5,
|
|
20779
20945
|
{
|
|
20946
|
+
strokeWidth: "1.5",
|
|
20780
20947
|
className: open ? "h-6 w-6 rotate-180 text-[var(--chekin-airbnb-ink)] transition-transform" : "h-6 w-6 text-[var(--chekin-airbnb-ink)] transition-transform"
|
|
20781
20948
|
}
|
|
20782
20949
|
)
|
|
@@ -20787,7 +20954,7 @@ var AirbnbSelectTrigger = React75.forwardRef(
|
|
|
20787
20954
|
AirbnbSelectTrigger.displayName = "AirbnbSelectTrigger";
|
|
20788
20955
|
|
|
20789
20956
|
// src/airbnb-fields/select/useDesktopSelect.ts
|
|
20790
|
-
import * as
|
|
20957
|
+
import * as React77 from "react";
|
|
20791
20958
|
function useDesktopSelect({
|
|
20792
20959
|
isMobile: isMobile3,
|
|
20793
20960
|
isOpen,
|
|
@@ -20796,12 +20963,12 @@ function useDesktopSelect({
|
|
|
20796
20963
|
disabled,
|
|
20797
20964
|
onChange
|
|
20798
20965
|
}) {
|
|
20799
|
-
const [highlightedIndex, setHighlightedIndex] =
|
|
20800
|
-
const triggerRef =
|
|
20801
|
-
const listRef =
|
|
20802
|
-
const optionRefs =
|
|
20966
|
+
const [highlightedIndex, setHighlightedIndex] = React77.useState(-1);
|
|
20967
|
+
const triggerRef = React77.useRef(null);
|
|
20968
|
+
const listRef = React77.useRef(null);
|
|
20969
|
+
const optionRefs = React77.useRef([]);
|
|
20803
20970
|
const selectedIndex = getOptionIndex2(options, value);
|
|
20804
|
-
|
|
20971
|
+
React77.useEffect(() => {
|
|
20805
20972
|
if (!isOpen || isMobile3) return;
|
|
20806
20973
|
setHighlightedIndex((currentIndex) => {
|
|
20807
20974
|
if (currentIndex >= 0) {
|
|
@@ -20816,34 +20983,34 @@ function useDesktopSelect({
|
|
|
20816
20983
|
window.cancelAnimationFrame(frameId);
|
|
20817
20984
|
};
|
|
20818
20985
|
}, [isMobile3, isOpen, options, selectedIndex]);
|
|
20819
|
-
|
|
20986
|
+
React77.useEffect(() => {
|
|
20820
20987
|
if (!isOpen || isMobile3 || highlightedIndex < 0) return;
|
|
20821
20988
|
optionRefs.current[highlightedIndex]?.scrollIntoView({
|
|
20822
20989
|
block: "nearest"
|
|
20823
20990
|
});
|
|
20824
20991
|
}, [highlightedIndex, isMobile3, isOpen]);
|
|
20825
|
-
|
|
20992
|
+
React77.useEffect(() => {
|
|
20826
20993
|
if (isOpen) return;
|
|
20827
20994
|
setHighlightedIndex(-1);
|
|
20828
20995
|
}, [isOpen]);
|
|
20829
|
-
const focusTrigger =
|
|
20996
|
+
const focusTrigger = React77.useCallback(() => {
|
|
20830
20997
|
triggerRef.current?.focus();
|
|
20831
20998
|
}, []);
|
|
20832
|
-
const handleSelect =
|
|
20999
|
+
const handleSelect = React77.useCallback(
|
|
20833
21000
|
(option) => {
|
|
20834
21001
|
if (option.isDisabled || disabled) return;
|
|
20835
21002
|
onChange?.(option);
|
|
20836
21003
|
},
|
|
20837
21004
|
[disabled, onChange]
|
|
20838
21005
|
);
|
|
20839
|
-
const openMenu =
|
|
21006
|
+
const openMenu = React77.useCallback(
|
|
20840
21007
|
(targetIndex) => {
|
|
20841
21008
|
const fallbackIndex = selectedIndex >= 0 ? selectedIndex : getFirstEnabledOptionIndex2(options);
|
|
20842
21009
|
setHighlightedIndex(targetIndex ?? fallbackIndex);
|
|
20843
21010
|
},
|
|
20844
21011
|
[options, selectedIndex]
|
|
20845
21012
|
);
|
|
20846
|
-
const handleTriggerKeyDown =
|
|
21013
|
+
const handleTriggerKeyDown = React77.useCallback(
|
|
20847
21014
|
(event, onOpen) => {
|
|
20848
21015
|
if (disabled) return;
|
|
20849
21016
|
if (event.key === "ArrowDown") {
|
|
@@ -20868,7 +21035,7 @@ function useDesktopSelect({
|
|
|
20868
21035
|
},
|
|
20869
21036
|
[disabled, openMenu, options, selectedIndex]
|
|
20870
21037
|
);
|
|
20871
|
-
const handleMenuKeyDown =
|
|
21038
|
+
const handleMenuKeyDown = React77.useCallback(
|
|
20872
21039
|
(event, onClose) => {
|
|
20873
21040
|
if (event.key === "Escape") {
|
|
20874
21041
|
event.preventDefault();
|
|
@@ -20918,7 +21085,7 @@ function useDesktopSelect({
|
|
|
20918
21085
|
},
|
|
20919
21086
|
[focusTrigger, highlightedIndex, onChange, options]
|
|
20920
21087
|
);
|
|
20921
|
-
const setOptionRef =
|
|
21088
|
+
const setOptionRef = React77.useCallback(
|
|
20922
21089
|
(index, node) => {
|
|
20923
21090
|
optionRefs.current[index] = node;
|
|
20924
21091
|
},
|
|
@@ -20938,23 +21105,23 @@ function useDesktopSelect({
|
|
|
20938
21105
|
}
|
|
20939
21106
|
|
|
20940
21107
|
// src/airbnb-fields/select/useMobileSelectWheel.ts
|
|
20941
|
-
import * as
|
|
21108
|
+
import * as React78 from "react";
|
|
20942
21109
|
function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, disabled }) {
|
|
20943
|
-
const [pendingValue, setPendingValue] =
|
|
21110
|
+
const [pendingValue, setPendingValue] = React78.useState(
|
|
20944
21111
|
value ?? null
|
|
20945
21112
|
);
|
|
20946
|
-
const [mobileScrollTop, setMobileScrollTop] =
|
|
20947
|
-
const mobileListRef =
|
|
20948
|
-
const scrollSettleTimeoutRef =
|
|
20949
|
-
const scrollAnimationFrameRef =
|
|
20950
|
-
const getTargetIndex =
|
|
21113
|
+
const [mobileScrollTop, setMobileScrollTop] = React78.useState(0);
|
|
21114
|
+
const mobileListRef = React78.useRef(null);
|
|
21115
|
+
const scrollSettleTimeoutRef = React78.useRef(null);
|
|
21116
|
+
const scrollAnimationFrameRef = React78.useRef(null);
|
|
21117
|
+
const getTargetIndex = React78.useCallback(
|
|
20951
21118
|
(targetValue) => {
|
|
20952
21119
|
const selectedIndex = getOptionIndex2(options, targetValue);
|
|
20953
21120
|
return selectedIndex >= 0 ? selectedIndex : getFirstEnabledOptionIndex2(options);
|
|
20954
21121
|
},
|
|
20955
21122
|
[options]
|
|
20956
21123
|
);
|
|
20957
|
-
const syncScrollPosition =
|
|
21124
|
+
const syncScrollPosition = React78.useCallback(
|
|
20958
21125
|
(targetValue, behavior = "instant") => {
|
|
20959
21126
|
const targetIndex = getTargetIndex(targetValue);
|
|
20960
21127
|
if (targetIndex < 0) return;
|
|
@@ -20973,27 +21140,27 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
|
|
|
20973
21140
|
},
|
|
20974
21141
|
[getTargetIndex, options]
|
|
20975
21142
|
);
|
|
20976
|
-
const clearScrollSettleTimeout =
|
|
21143
|
+
const clearScrollSettleTimeout = React78.useCallback(() => {
|
|
20977
21144
|
if (scrollSettleTimeoutRef.current === null) return;
|
|
20978
21145
|
window.clearTimeout(scrollSettleTimeoutRef.current);
|
|
20979
21146
|
scrollSettleTimeoutRef.current = null;
|
|
20980
21147
|
}, []);
|
|
20981
|
-
const clearScrollAnimationFrame =
|
|
21148
|
+
const clearScrollAnimationFrame = React78.useCallback(() => {
|
|
20982
21149
|
if (scrollAnimationFrameRef.current === null) return;
|
|
20983
21150
|
window.cancelAnimationFrame(scrollAnimationFrameRef.current);
|
|
20984
21151
|
scrollAnimationFrameRef.current = null;
|
|
20985
21152
|
}, []);
|
|
20986
|
-
|
|
21153
|
+
React78.useEffect(
|
|
20987
21154
|
() => () => {
|
|
20988
21155
|
clearScrollSettleTimeout();
|
|
20989
21156
|
clearScrollAnimationFrame();
|
|
20990
21157
|
},
|
|
20991
21158
|
[clearScrollAnimationFrame, clearScrollSettleTimeout]
|
|
20992
21159
|
);
|
|
20993
|
-
|
|
21160
|
+
React78.useEffect(() => {
|
|
20994
21161
|
setPendingValue(value ?? null);
|
|
20995
21162
|
}, [value]);
|
|
20996
|
-
|
|
21163
|
+
React78.useLayoutEffect(() => {
|
|
20997
21164
|
if (!isMobile3 || !isOpen) return;
|
|
20998
21165
|
const frameId = window.requestAnimationFrame(() => {
|
|
20999
21166
|
syncScrollPosition(value ?? null, "instant");
|
|
@@ -21002,7 +21169,7 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
|
|
|
21002
21169
|
window.cancelAnimationFrame(frameId);
|
|
21003
21170
|
};
|
|
21004
21171
|
}, [isMobile3, isOpen, syncScrollPosition, value]);
|
|
21005
|
-
const settleScroll =
|
|
21172
|
+
const settleScroll = React78.useCallback(() => {
|
|
21006
21173
|
if (!mobileListRef.current) return;
|
|
21007
21174
|
const nextIndex = Math.round(mobileListRef.current.scrollTop / MOBILE_OPTION_HEIGHT);
|
|
21008
21175
|
const nextOption = options[nextIndex];
|
|
@@ -21014,13 +21181,13 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
|
|
|
21014
21181
|
}
|
|
21015
21182
|
setPendingValue(nextOption);
|
|
21016
21183
|
}, [options, pendingValue]);
|
|
21017
|
-
const scheduleScrollSettle =
|
|
21184
|
+
const scheduleScrollSettle = React78.useCallback(() => {
|
|
21018
21185
|
clearScrollSettleTimeout();
|
|
21019
21186
|
scrollSettleTimeoutRef.current = window.setTimeout(() => {
|
|
21020
21187
|
settleScroll();
|
|
21021
21188
|
}, MOBILE_SCROLL_SETTLE_DELAY);
|
|
21022
21189
|
}, [clearScrollSettleTimeout, settleScroll]);
|
|
21023
|
-
const handleScroll =
|
|
21190
|
+
const handleScroll = React78.useCallback(() => {
|
|
21024
21191
|
if (!mobileListRef.current) return;
|
|
21025
21192
|
const nextScrollTop = mobileListRef.current.scrollTop;
|
|
21026
21193
|
clearScrollAnimationFrame();
|
|
@@ -21030,7 +21197,7 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
|
|
|
21030
21197
|
});
|
|
21031
21198
|
scheduleScrollSettle();
|
|
21032
21199
|
}, [clearScrollAnimationFrame, scheduleScrollSettle]);
|
|
21033
|
-
const focusOptionByIndex =
|
|
21200
|
+
const focusOptionByIndex = React78.useCallback(
|
|
21034
21201
|
(index, behavior = "instant", updatePendingImmediately = behavior === "instant") => {
|
|
21035
21202
|
if (!mobileListRef.current || index < 0 || index >= options.length) return;
|
|
21036
21203
|
const option = options[index];
|
|
@@ -21048,7 +21215,7 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
|
|
|
21048
21215
|
},
|
|
21049
21216
|
[options, scheduleScrollSettle]
|
|
21050
21217
|
);
|
|
21051
|
-
const handleOptionClick =
|
|
21218
|
+
const handleOptionClick = React78.useCallback(
|
|
21052
21219
|
(option) => {
|
|
21053
21220
|
if (!mobileListRef.current || disabled || option.isDisabled) return;
|
|
21054
21221
|
const optionIndex = getOptionIndex2(options, option);
|
|
@@ -21057,7 +21224,7 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
|
|
|
21057
21224
|
},
|
|
21058
21225
|
[disabled, focusOptionByIndex, options]
|
|
21059
21226
|
);
|
|
21060
|
-
const moveByStep =
|
|
21227
|
+
const moveByStep = React78.useCallback(
|
|
21061
21228
|
(step) => {
|
|
21062
21229
|
const currentIndex = getOptionIndex2(options, pendingValue);
|
|
21063
21230
|
const fallbackIndex = step === 1 ? getFirstEnabledOptionIndex2(options) : getLastEnabledOptionIndex2(options);
|
|
@@ -21069,7 +21236,7 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
|
|
|
21069
21236
|
},
|
|
21070
21237
|
[focusOptionByIndex, options, pendingValue]
|
|
21071
21238
|
);
|
|
21072
|
-
const moveToBoundary =
|
|
21239
|
+
const moveToBoundary = React78.useCallback(
|
|
21073
21240
|
(boundary) => {
|
|
21074
21241
|
const targetIndex = boundary === "start" ? getFirstEnabledOptionIndex2(options) : getLastEnabledOptionIndex2(options);
|
|
21075
21242
|
if (targetIndex >= 0) {
|
|
@@ -21078,7 +21245,7 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
|
|
|
21078
21245
|
},
|
|
21079
21246
|
[focusOptionByIndex, options]
|
|
21080
21247
|
);
|
|
21081
|
-
const syncPendingValue =
|
|
21248
|
+
const syncPendingValue = React78.useCallback(
|
|
21082
21249
|
(nextValue) => {
|
|
21083
21250
|
const normalizedValue = nextValue ?? null;
|
|
21084
21251
|
const matchedIndex = getOptionIndex2(options, normalizedValue);
|
|
@@ -21106,9 +21273,9 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
|
|
|
21106
21273
|
}
|
|
21107
21274
|
|
|
21108
21275
|
// src/airbnb-fields/select/useSelectIds.ts
|
|
21109
|
-
import * as
|
|
21276
|
+
import * as React79 from "react";
|
|
21110
21277
|
function useSelectIds2({ name, hasValue, error, hideErrorMessage }) {
|
|
21111
|
-
const reactId =
|
|
21278
|
+
const reactId = React79.useId().replace(/:/g, "");
|
|
21112
21279
|
const baseId = name ? `select-${name}` : `select-${reactId}`;
|
|
21113
21280
|
const triggerId = `${baseId}-trigger`;
|
|
21114
21281
|
const labelId = `${baseId}-label`;
|
|
@@ -21118,7 +21285,7 @@ function useSelectIds2({ name, hasValue, error, hideErrorMessage }) {
|
|
|
21118
21285
|
const listboxId = `${baseId}-listbox`;
|
|
21119
21286
|
const describedErrorId = error && !hideErrorMessage ? errorId : void 0;
|
|
21120
21287
|
const describedBy = [!hasValue ? helperTextId : null, describedErrorId].filter(Boolean).join(" ") || void 0;
|
|
21121
|
-
const getOptionId2 =
|
|
21288
|
+
const getOptionId2 = React79.useCallback(
|
|
21122
21289
|
(index) => `${baseId}-option-${index}`,
|
|
21123
21290
|
[baseId]
|
|
21124
21291
|
);
|
|
@@ -21136,8 +21303,8 @@ function useSelectIds2({ name, hasValue, error, hideErrorMessage }) {
|
|
|
21136
21303
|
}
|
|
21137
21304
|
|
|
21138
21305
|
// src/airbnb-fields/select/Select.tsx
|
|
21139
|
-
import { jsx as
|
|
21140
|
-
var AirbnbSelect =
|
|
21306
|
+
import { jsx as jsx191, jsxs as jsxs122 } from "react/jsx-runtime";
|
|
21307
|
+
var AirbnbSelect = React80.forwardRef(function AirbnbSelect2({
|
|
21141
21308
|
options = [],
|
|
21142
21309
|
value,
|
|
21143
21310
|
onChange,
|
|
@@ -21151,6 +21318,7 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
21151
21318
|
loading,
|
|
21152
21319
|
optional,
|
|
21153
21320
|
tooltip,
|
|
21321
|
+
helper,
|
|
21154
21322
|
error,
|
|
21155
21323
|
invalid,
|
|
21156
21324
|
hideErrorMessage,
|
|
@@ -21164,8 +21332,8 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
21164
21332
|
filterOption
|
|
21165
21333
|
}, ref) {
|
|
21166
21334
|
const { isMatch: isMobile3 } = useScreenResize(DEVICE.mobileXL);
|
|
21167
|
-
const [isOpen, setIsOpen] =
|
|
21168
|
-
const containerRef =
|
|
21335
|
+
const [isOpen, setIsOpen] = React80.useState(false);
|
|
21336
|
+
const containerRef = React80.useRef(null);
|
|
21169
21337
|
const filteredOptions = filterOption ? options.filter(filterOption) : options;
|
|
21170
21338
|
const hasValue = Boolean(value);
|
|
21171
21339
|
const helperText = placeholder ?? label;
|
|
@@ -21227,12 +21395,12 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
21227
21395
|
onOutsideClick: () => setIsOpen(false),
|
|
21228
21396
|
isDisabled: !isOpen || isMobile3
|
|
21229
21397
|
});
|
|
21230
|
-
|
|
21398
|
+
React80.useEffect(() => {
|
|
21231
21399
|
if (isBlocked) {
|
|
21232
21400
|
setIsOpen(false);
|
|
21233
21401
|
}
|
|
21234
21402
|
}, [isBlocked]);
|
|
21235
|
-
|
|
21403
|
+
React80.useEffect(
|
|
21236
21404
|
function setCorrectOptionIfThereIsOnlyValue() {
|
|
21237
21405
|
if (value?.value === void 0 || value.value === null || value.label !== "") {
|
|
21238
21406
|
return;
|
|
@@ -21244,7 +21412,7 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
21244
21412
|
},
|
|
21245
21413
|
[onChange, filteredOptions, value]
|
|
21246
21414
|
);
|
|
21247
|
-
const handleMobileOpenChange =
|
|
21415
|
+
const handleMobileOpenChange = React80.useCallback(
|
|
21248
21416
|
(nextOpen) => {
|
|
21249
21417
|
if (isBlocked && nextOpen) return;
|
|
21250
21418
|
setIsOpen(nextOpen);
|
|
@@ -21255,7 +21423,7 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
21255
21423
|
},
|
|
21256
21424
|
[focusTrigger, isBlocked, syncPendingValue, value]
|
|
21257
21425
|
);
|
|
21258
|
-
const handleMobileDone =
|
|
21426
|
+
const handleMobileDone = React80.useCallback(() => {
|
|
21259
21427
|
if (isBlocked) return;
|
|
21260
21428
|
const finalOption = pendingValue;
|
|
21261
21429
|
if (finalOption && finalOption.value !== value?.value) {
|
|
@@ -21264,7 +21432,7 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
21264
21432
|
setIsOpen(false);
|
|
21265
21433
|
focusTrigger();
|
|
21266
21434
|
}, [focusTrigger, isBlocked, onChange, pendingValue, value]);
|
|
21267
|
-
const handleTriggerClick =
|
|
21435
|
+
const handleTriggerClick = React80.useCallback(() => {
|
|
21268
21436
|
if (isBlocked) return;
|
|
21269
21437
|
setIsOpen((prev) => {
|
|
21270
21438
|
const nextOpen = !prev;
|
|
@@ -21323,7 +21491,7 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
21323
21491
|
ref: containerRef,
|
|
21324
21492
|
className: cn("relative w-full max-w-[var(--max-field-width)]", className),
|
|
21325
21493
|
children: [
|
|
21326
|
-
name && /* @__PURE__ */
|
|
21494
|
+
name && /* @__PURE__ */ jsx191("input", { type: "hidden", name, value: value ? String(value.value) : "" }),
|
|
21327
21495
|
renderTrigger ? renderTrigger({
|
|
21328
21496
|
id: triggerId,
|
|
21329
21497
|
open: isOpen,
|
|
@@ -21336,6 +21504,7 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
21336
21504
|
loading,
|
|
21337
21505
|
optional,
|
|
21338
21506
|
tooltip,
|
|
21507
|
+
helper,
|
|
21339
21508
|
error,
|
|
21340
21509
|
invalid,
|
|
21341
21510
|
listboxId,
|
|
@@ -21344,7 +21513,7 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
21344
21513
|
onClick: handleTriggerClick,
|
|
21345
21514
|
onKeyDown: handleRootTriggerKeyDown,
|
|
21346
21515
|
onBlur
|
|
21347
|
-
}) : /* @__PURE__ */
|
|
21516
|
+
}) : /* @__PURE__ */ jsx191(
|
|
21348
21517
|
AirbnbSelectTrigger,
|
|
21349
21518
|
{
|
|
21350
21519
|
id: triggerId,
|
|
@@ -21358,6 +21527,7 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
21358
21527
|
loading,
|
|
21359
21528
|
optional,
|
|
21360
21529
|
tooltip,
|
|
21530
|
+
helper,
|
|
21361
21531
|
error: triggerError,
|
|
21362
21532
|
hideErrorMessage,
|
|
21363
21533
|
labelId,
|
|
@@ -21371,7 +21541,7 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
21371
21541
|
onBlur
|
|
21372
21542
|
}
|
|
21373
21543
|
),
|
|
21374
|
-
isMobile3 ? /* @__PURE__ */
|
|
21544
|
+
isMobile3 ? /* @__PURE__ */ jsx191(
|
|
21375
21545
|
AirbnbSelectMobileContent,
|
|
21376
21546
|
{
|
|
21377
21547
|
open: isOpen,
|
|
@@ -21396,7 +21566,7 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
21396
21566
|
getOptionId: getOptionId2,
|
|
21397
21567
|
noOptionsMessage
|
|
21398
21568
|
}
|
|
21399
|
-
) : /* @__PURE__ */
|
|
21569
|
+
) : /* @__PURE__ */ jsx191(
|
|
21400
21570
|
AirbnbSelectDesktopContent,
|
|
21401
21571
|
{
|
|
21402
21572
|
isOpen,
|
|
@@ -21430,13 +21600,13 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
21430
21600
|
});
|
|
21431
21601
|
|
|
21432
21602
|
// src/airbnb-fields/phone-field/PhoneField.tsx
|
|
21433
|
-
import { jsx as
|
|
21603
|
+
import { jsx as jsx192, jsxs as jsxs123 } from "react/jsx-runtime";
|
|
21434
21604
|
function formatPhoneCodeOptionLabel2(option) {
|
|
21435
21605
|
const label = String(option.label);
|
|
21436
21606
|
const value = String(option.value);
|
|
21437
21607
|
return label.includes(value) ? label : `${label} (${value})`;
|
|
21438
21608
|
}
|
|
21439
|
-
var AirbnbPhoneField =
|
|
21609
|
+
var AirbnbPhoneField = React81.forwardRef(
|
|
21440
21610
|
({
|
|
21441
21611
|
label,
|
|
21442
21612
|
topLabel,
|
|
@@ -21452,6 +21622,7 @@ var AirbnbPhoneField = React80.forwardRef(
|
|
|
21452
21622
|
loading,
|
|
21453
21623
|
optional,
|
|
21454
21624
|
tooltip,
|
|
21625
|
+
helper,
|
|
21455
21626
|
className,
|
|
21456
21627
|
name,
|
|
21457
21628
|
codeName,
|
|
@@ -21460,9 +21631,9 @@ var AirbnbPhoneField = React80.forwardRef(
|
|
|
21460
21631
|
codePlaceholder = "+00",
|
|
21461
21632
|
defaultCode
|
|
21462
21633
|
}, ref) => {
|
|
21463
|
-
const inputId =
|
|
21634
|
+
const inputId = React81.useId();
|
|
21464
21635
|
const effectiveCode = value?.code || defaultCode || "";
|
|
21465
|
-
const codeOptions =
|
|
21636
|
+
const codeOptions = React81.useMemo(
|
|
21466
21637
|
() => options.map((option) => ({
|
|
21467
21638
|
value: option.value,
|
|
21468
21639
|
label: formatPhoneCodeOptionLabel2(option),
|
|
@@ -21470,7 +21641,7 @@ var AirbnbPhoneField = React80.forwardRef(
|
|
|
21470
21641
|
})),
|
|
21471
21642
|
[options]
|
|
21472
21643
|
);
|
|
21473
|
-
const selectedCodeOption =
|
|
21644
|
+
const selectedCodeOption = React81.useMemo(
|
|
21474
21645
|
() => codeOptions.find((option) => option.value === effectiveCode) ?? null,
|
|
21475
21646
|
[codeOptions, effectiveCode]
|
|
21476
21647
|
);
|
|
@@ -21479,8 +21650,8 @@ var AirbnbPhoneField = React80.forwardRef(
|
|
|
21479
21650
|
const isBlocked = Boolean(disabled) || Boolean(loading);
|
|
21480
21651
|
const isCodeBlocked = isBlocked || Boolean(codeReadOnly);
|
|
21481
21652
|
return /* @__PURE__ */ jsxs123("div", { className: cn("w-full max-w-[var(--max-field-width)]", className), children: [
|
|
21482
|
-
name && /* @__PURE__ */
|
|
21483
|
-
codeName && /* @__PURE__ */
|
|
21653
|
+
name && /* @__PURE__ */ jsx192("input", { type: "hidden", name, value: combinedValue, disabled }),
|
|
21654
|
+
codeName && /* @__PURE__ */ jsx192(
|
|
21484
21655
|
"input",
|
|
21485
21656
|
{
|
|
21486
21657
|
type: "hidden",
|
|
@@ -21489,7 +21660,7 @@ var AirbnbPhoneField = React80.forwardRef(
|
|
|
21489
21660
|
disabled
|
|
21490
21661
|
}
|
|
21491
21662
|
),
|
|
21492
|
-
numberName && /* @__PURE__ */
|
|
21663
|
+
numberName && /* @__PURE__ */ jsx192(
|
|
21493
21664
|
"input",
|
|
21494
21665
|
{
|
|
21495
21666
|
type: "hidden",
|
|
@@ -21498,7 +21669,7 @@ var AirbnbPhoneField = React80.forwardRef(
|
|
|
21498
21669
|
disabled
|
|
21499
21670
|
}
|
|
21500
21671
|
),
|
|
21501
|
-
topLabel && /* @__PURE__ */
|
|
21672
|
+
topLabel && /* @__PURE__ */ jsx192(
|
|
21502
21673
|
"label",
|
|
21503
21674
|
{
|
|
21504
21675
|
htmlFor: inputId,
|
|
@@ -21507,7 +21678,7 @@ var AirbnbPhoneField = React80.forwardRef(
|
|
|
21507
21678
|
}
|
|
21508
21679
|
),
|
|
21509
21680
|
/* @__PURE__ */ jsxs123("div", { className: "flex items-stretch", children: [
|
|
21510
|
-
/* @__PURE__ */
|
|
21681
|
+
/* @__PURE__ */ jsx192(
|
|
21511
21682
|
AirbnbSelect,
|
|
21512
21683
|
{
|
|
21513
21684
|
ref,
|
|
@@ -21557,8 +21728,8 @@ var AirbnbPhoneField = React80.forwardRef(
|
|
|
21557
21728
|
triggerDisabled ? "cursor-not-allowed opacity-50" : triggerLoading ? "cursor-progress" : "cursor-pointer"
|
|
21558
21729
|
),
|
|
21559
21730
|
children: [
|
|
21560
|
-
/* @__PURE__ */
|
|
21561
|
-
/* @__PURE__ */
|
|
21731
|
+
/* @__PURE__ */ jsx192("span", { children: valueLabel ?? codePlaceholder }),
|
|
21732
|
+
/* @__PURE__ */ jsx192(
|
|
21562
21733
|
ChevronDown6,
|
|
21563
21734
|
{
|
|
21564
21735
|
className: cn("h-5 w-5 transition-transform", open ? "rotate-180" : ""),
|
|
@@ -21570,7 +21741,7 @@ var AirbnbPhoneField = React80.forwardRef(
|
|
|
21570
21741
|
)
|
|
21571
21742
|
}
|
|
21572
21743
|
),
|
|
21573
|
-
/* @__PURE__ */
|
|
21744
|
+
/* @__PURE__ */ jsx192(
|
|
21574
21745
|
AirbnbInput,
|
|
21575
21746
|
{
|
|
21576
21747
|
id: inputId,
|
|
@@ -21599,18 +21770,19 @@ var AirbnbPhoneField = React80.forwardRef(
|
|
|
21599
21770
|
}
|
|
21600
21771
|
)
|
|
21601
21772
|
] }),
|
|
21602
|
-
error && /* @__PURE__ */
|
|
21773
|
+
error && /* @__PURE__ */ jsx192(FieldErrorMessage, { message: error }),
|
|
21774
|
+
!error && /* @__PURE__ */ jsx192(AirbnbFieldHelperText, { helper, disabled })
|
|
21603
21775
|
] });
|
|
21604
21776
|
}
|
|
21605
21777
|
);
|
|
21606
21778
|
AirbnbPhoneField.displayName = "AirbnbPhoneField";
|
|
21607
21779
|
|
|
21608
21780
|
// src/airbnb-fields/searchable-select/SearchableSelect.tsx
|
|
21609
|
-
import * as
|
|
21781
|
+
import * as React82 from "react";
|
|
21610
21782
|
import { ChevronDown as ChevronDown7, Search as Search5 } from "lucide-react";
|
|
21611
21783
|
import { useVirtualizer as useVirtualizer3 } from "@tanstack/react-virtual";
|
|
21612
|
-
import { useCallback as
|
|
21613
|
-
import { jsx as
|
|
21784
|
+
import { useCallback as useCallback58 } from "react";
|
|
21785
|
+
import { jsx as jsx193, jsxs as jsxs124 } from "react/jsx-runtime";
|
|
21614
21786
|
var ROW_HEIGHT = 48;
|
|
21615
21787
|
var DESKTOP_LIST_HEIGHT = 280;
|
|
21616
21788
|
var MOBILE_LIST_HEIGHT = 420;
|
|
@@ -21641,6 +21813,7 @@ var AirbnbSearchableSelectInternal = ({
|
|
|
21641
21813
|
invalid,
|
|
21642
21814
|
optional,
|
|
21643
21815
|
tooltip,
|
|
21816
|
+
helper,
|
|
21644
21817
|
hideErrorMessage,
|
|
21645
21818
|
name,
|
|
21646
21819
|
className,
|
|
@@ -21650,13 +21823,13 @@ var AirbnbSearchableSelectInternal = ({
|
|
|
21650
21823
|
loadingMessage
|
|
21651
21824
|
}, ref) => {
|
|
21652
21825
|
const { isMatch: isMobile3 } = useScreenResize(DEVICE.mobileXL);
|
|
21653
|
-
const reactId =
|
|
21654
|
-
const [open, setOpen] =
|
|
21655
|
-
const [internalSearchValue, setInternalSearchValue] =
|
|
21656
|
-
const [highlightedIndex, setHighlightedIndex] =
|
|
21657
|
-
const containerRef =
|
|
21658
|
-
const triggerRef =
|
|
21659
|
-
const inputRef =
|
|
21826
|
+
const reactId = React82.useId();
|
|
21827
|
+
const [open, setOpen] = React82.useState(false);
|
|
21828
|
+
const [internalSearchValue, setInternalSearchValue] = React82.useState("");
|
|
21829
|
+
const [highlightedIndex, setHighlightedIndex] = React82.useState(-1);
|
|
21830
|
+
const containerRef = React82.useRef(null);
|
|
21831
|
+
const triggerRef = React82.useRef(null);
|
|
21832
|
+
const inputRef = React82.useRef(null);
|
|
21660
21833
|
const listboxId = `${reactId}-listbox`;
|
|
21661
21834
|
const labelId = `${reactId}-label`;
|
|
21662
21835
|
const valueId = `${reactId}-value`;
|
|
@@ -21665,13 +21838,13 @@ var AirbnbSearchableSelectInternal = ({
|
|
|
21665
21838
|
const searchInputId = `${reactId}-search`;
|
|
21666
21839
|
const effectiveSearchValue = searchValue ?? internalSearchValue;
|
|
21667
21840
|
const shouldFilterLocally = !onSearchChange && filterOption !== null;
|
|
21668
|
-
const visibleOptions =
|
|
21841
|
+
const visibleOptions = React82.useMemo(() => {
|
|
21669
21842
|
if (!shouldFilterLocally || !effectiveSearchValue) {
|
|
21670
21843
|
return options;
|
|
21671
21844
|
}
|
|
21672
21845
|
return options.filter((option) => filterOption(option, effectiveSearchValue));
|
|
21673
21846
|
}, [effectiveSearchValue, filterOption, options, shouldFilterLocally]);
|
|
21674
|
-
const selectedIndex =
|
|
21847
|
+
const selectedIndex = React82.useMemo(
|
|
21675
21848
|
() => visibleOptions.findIndex((option) => option.value === value?.value),
|
|
21676
21849
|
[value?.value, visibleOptions]
|
|
21677
21850
|
);
|
|
@@ -21687,7 +21860,7 @@ var AirbnbSearchableSelectInternal = ({
|
|
|
21687
21860
|
isDisabled: !open || isMobile3
|
|
21688
21861
|
});
|
|
21689
21862
|
const handleOnOpenChange = useEvent(onOpenChange);
|
|
21690
|
-
const setSelectOpen =
|
|
21863
|
+
const setSelectOpen = useCallback58(
|
|
21691
21864
|
(nextOpen, options2) => {
|
|
21692
21865
|
setOpen(nextOpen);
|
|
21693
21866
|
handleOnOpenChange?.(nextOpen);
|
|
@@ -21697,7 +21870,7 @@ var AirbnbSearchableSelectInternal = ({
|
|
|
21697
21870
|
},
|
|
21698
21871
|
[handleOnOpenChange]
|
|
21699
21872
|
);
|
|
21700
|
-
|
|
21873
|
+
React82.useEffect(() => {
|
|
21701
21874
|
if (isBlocked) {
|
|
21702
21875
|
setSelectOpen(false);
|
|
21703
21876
|
return;
|
|
@@ -21710,7 +21883,7 @@ var AirbnbSearchableSelectInternal = ({
|
|
|
21710
21883
|
window.cancelAnimationFrame(frameId);
|
|
21711
21884
|
};
|
|
21712
21885
|
}, [isBlocked, open, setSelectOpen]);
|
|
21713
|
-
|
|
21886
|
+
React82.useEffect(() => {
|
|
21714
21887
|
if (!open) {
|
|
21715
21888
|
setHighlightedIndex(-1);
|
|
21716
21889
|
return;
|
|
@@ -21778,7 +21951,7 @@ var AirbnbSearchableSelectInternal = ({
|
|
|
21778
21951
|
}
|
|
21779
21952
|
}
|
|
21780
21953
|
}
|
|
21781
|
-
const content = /* @__PURE__ */
|
|
21954
|
+
const content = /* @__PURE__ */ jsx193(
|
|
21782
21955
|
AirbnbSearchableSelectContent,
|
|
21783
21956
|
{
|
|
21784
21957
|
inputId: searchInputId,
|
|
@@ -21805,10 +21978,10 @@ var AirbnbSearchableSelectInternal = ({
|
|
|
21805
21978
|
onOptionHover: setHighlightedIndex
|
|
21806
21979
|
}
|
|
21807
21980
|
);
|
|
21808
|
-
|
|
21981
|
+
React82.useImperativeHandle(ref, () => triggerRef.current, []);
|
|
21809
21982
|
return /* @__PURE__ */ jsxs124("div", { ref: containerRef, className: cn("relative w-full max-w-[425px]", className), children: [
|
|
21810
|
-
name && /* @__PURE__ */
|
|
21811
|
-
/* @__PURE__ */
|
|
21983
|
+
name && /* @__PURE__ */ jsx193("input", { type: "hidden", name, value: value ? String(value.value) : "" }),
|
|
21984
|
+
/* @__PURE__ */ jsx193(
|
|
21812
21985
|
AirbnbFieldTrigger,
|
|
21813
21986
|
{
|
|
21814
21987
|
id: `${reactId}-trigger`,
|
|
@@ -21830,6 +22003,7 @@ var AirbnbSearchableSelectInternal = ({
|
|
|
21830
22003
|
loading,
|
|
21831
22004
|
optional,
|
|
21832
22005
|
tooltip,
|
|
22006
|
+
helper,
|
|
21833
22007
|
forceLabelText: Boolean(optional) || Boolean(tooltip),
|
|
21834
22008
|
hideErrorMessage,
|
|
21835
22009
|
disabled,
|
|
@@ -21842,7 +22016,7 @@ var AirbnbSearchableSelectInternal = ({
|
|
|
21842
22016
|
},
|
|
21843
22017
|
onKeyDown: handleTriggerKeyDown,
|
|
21844
22018
|
onBlur,
|
|
21845
|
-
trailingAdornment: /* @__PURE__ */
|
|
22019
|
+
trailingAdornment: /* @__PURE__ */ jsx193(
|
|
21846
22020
|
ChevronDown7,
|
|
21847
22021
|
{
|
|
21848
22022
|
className: cn(
|
|
@@ -21853,7 +22027,7 @@ var AirbnbSearchableSelectInternal = ({
|
|
|
21853
22027
|
)
|
|
21854
22028
|
}
|
|
21855
22029
|
),
|
|
21856
|
-
isMobile3 ? /* @__PURE__ */
|
|
22030
|
+
isMobile3 ? /* @__PURE__ */ jsx193(
|
|
21857
22031
|
Drawer,
|
|
21858
22032
|
{
|
|
21859
22033
|
open,
|
|
@@ -21866,12 +22040,12 @@ var AirbnbSearchableSelectInternal = ({
|
|
|
21866
22040
|
closeSelect();
|
|
21867
22041
|
},
|
|
21868
22042
|
children: /* @__PURE__ */ jsxs124(DrawerContent, { onClose: closeSelect, lockScroll: false, children: [
|
|
21869
|
-
/* @__PURE__ */
|
|
21870
|
-
/* @__PURE__ */
|
|
21871
|
-
/* @__PURE__ */
|
|
22043
|
+
/* @__PURE__ */ jsx193(DrawerTitle, { className: "sr-only", children: mobileTitle ?? label }),
|
|
22044
|
+
/* @__PURE__ */ jsx193(DrawerDescription, { className: "sr-only", children: label }),
|
|
22045
|
+
/* @__PURE__ */ jsx193("div", { className: "px-5 pb-5 pt-1", children: content })
|
|
21872
22046
|
] })
|
|
21873
22047
|
}
|
|
21874
|
-
) : open ? /* @__PURE__ */
|
|
22048
|
+
) : open ? /* @__PURE__ */ jsx193(
|
|
21875
22049
|
"div",
|
|
21876
22050
|
{
|
|
21877
22051
|
className: cn(
|
|
@@ -21883,7 +22057,7 @@ var AirbnbSearchableSelectInternal = ({
|
|
|
21883
22057
|
) : null
|
|
21884
22058
|
] });
|
|
21885
22059
|
};
|
|
21886
|
-
var AirbnbSearchableSelect =
|
|
22060
|
+
var AirbnbSearchableSelect = React82.forwardRef(
|
|
21887
22061
|
AirbnbSearchableSelectInternal
|
|
21888
22062
|
);
|
|
21889
22063
|
function AirbnbSearchableSelectContent({
|
|
@@ -21910,9 +22084,9 @@ function AirbnbSearchableSelectContent({
|
|
|
21910
22084
|
onOptionClick,
|
|
21911
22085
|
onOptionHover
|
|
21912
22086
|
}) {
|
|
21913
|
-
const listRef =
|
|
21914
|
-
const lastLoadMoreOptionsLengthRef =
|
|
21915
|
-
const previousHighlightedIndexRef =
|
|
22087
|
+
const listRef = React82.useRef(null);
|
|
22088
|
+
const lastLoadMoreOptionsLengthRef = React82.useRef(null);
|
|
22089
|
+
const previousHighlightedIndexRef = React82.useRef(highlightedIndex);
|
|
21916
22090
|
const rowCount = options.length + (loading && options.length > 0 ? 1 : 0);
|
|
21917
22091
|
const virtualizer = useVirtualizer3({
|
|
21918
22092
|
count: rowCount,
|
|
@@ -21923,7 +22097,7 @@ function AirbnbSearchableSelectContent({
|
|
|
21923
22097
|
const virtualItems = virtualizer.getVirtualItems();
|
|
21924
22098
|
const emptyMessage = noOptionsMessage?.() ?? "No matches found";
|
|
21925
22099
|
const loadingText = loadingMessage?.() ?? "Loading...";
|
|
21926
|
-
|
|
22100
|
+
React82.useEffect(() => {
|
|
21927
22101
|
const lastItem = virtualItems[virtualItems.length - 1];
|
|
21928
22102
|
const shouldLoadMore = !!lastItem && hasNextPage && !loading && lastItem.index >= options.length - LOAD_MORE_THRESHOLD;
|
|
21929
22103
|
if (shouldLoadMore && lastLoadMoreOptionsLengthRef.current !== options.length) {
|
|
@@ -21931,7 +22105,7 @@ function AirbnbSearchableSelectContent({
|
|
|
21931
22105
|
onLoadMore?.();
|
|
21932
22106
|
}
|
|
21933
22107
|
}, [hasNextPage, loading, onLoadMore, options.length, virtualItems]);
|
|
21934
|
-
|
|
22108
|
+
React82.useEffect(() => {
|
|
21935
22109
|
const hasHighlightedIndexChanged = previousHighlightedIndexRef.current !== highlightedIndex;
|
|
21936
22110
|
previousHighlightedIndexRef.current = highlightedIndex;
|
|
21937
22111
|
if (highlightedIndex >= 0 && hasHighlightedIndexChanged) {
|
|
@@ -21940,14 +22114,14 @@ function AirbnbSearchableSelectContent({
|
|
|
21940
22114
|
}, [highlightedIndex, virtualizer]);
|
|
21941
22115
|
return /* @__PURE__ */ jsxs124("div", { className: "p-2", children: [
|
|
21942
22116
|
/* @__PURE__ */ jsxs124("div", { className: "relative mb-2", children: [
|
|
21943
|
-
/* @__PURE__ */
|
|
22117
|
+
/* @__PURE__ */ jsx193(
|
|
21944
22118
|
Search5,
|
|
21945
22119
|
{
|
|
21946
22120
|
"aria-hidden": "true",
|
|
21947
22121
|
className: "absolute left-4 top-1/2 h-5 w-5 -translate-y-1/2 text-[var(--chekin-neutral-500)]"
|
|
21948
22122
|
}
|
|
21949
22123
|
),
|
|
21950
|
-
/* @__PURE__ */
|
|
22124
|
+
/* @__PURE__ */ jsx193(
|
|
21951
22125
|
"input",
|
|
21952
22126
|
{
|
|
21953
22127
|
id: inputId,
|
|
@@ -21966,7 +22140,7 @@ function AirbnbSearchableSelectContent({
|
|
|
21966
22140
|
}
|
|
21967
22141
|
)
|
|
21968
22142
|
] }),
|
|
21969
|
-
loading && options.length === 0 ? /* @__PURE__ */
|
|
22143
|
+
loading && options.length === 0 ? /* @__PURE__ */ jsx193("div", { className: "px-4 py-5 text-center text-base leading-6 text-[var(--chekin-airbnb-gray-text)]", children: loadingText }) : options.length === 0 ? /* @__PURE__ */ jsx193("div", { className: "px-4 py-5 text-center text-base leading-6 text-[var(--chekin-airbnb-gray-text)]", children: emptyMessage }) : /* @__PURE__ */ jsx193(
|
|
21970
22144
|
"div",
|
|
21971
22145
|
{
|
|
21972
22146
|
id: listboxId,
|
|
@@ -21975,7 +22149,7 @@ function AirbnbSearchableSelectContent({
|
|
|
21975
22149
|
"aria-labelledby": labelId,
|
|
21976
22150
|
className: cn("overflow-y-auto outline-none", menuClassName),
|
|
21977
22151
|
style: { height: Math.min(height, rowCount * ROW_HEIGHT) },
|
|
21978
|
-
children: /* @__PURE__ */
|
|
22152
|
+
children: /* @__PURE__ */ jsx193(
|
|
21979
22153
|
"div",
|
|
21980
22154
|
{
|
|
21981
22155
|
className: "relative w-full",
|
|
@@ -21983,7 +22157,7 @@ function AirbnbSearchableSelectContent({
|
|
|
21983
22157
|
children: virtualItems.map((virtualItem) => {
|
|
21984
22158
|
const option = options[virtualItem.index];
|
|
21985
22159
|
if (!option) {
|
|
21986
|
-
return /* @__PURE__ */
|
|
22160
|
+
return /* @__PURE__ */ jsx193(
|
|
21987
22161
|
"div",
|
|
21988
22162
|
{
|
|
21989
22163
|
className: "absolute left-0 top-0 flex w-full items-center px-4 text-base leading-6 text-[var(--chekin-airbnb-gray-text)]",
|
|
@@ -21998,7 +22172,7 @@ function AirbnbSearchableSelectContent({
|
|
|
21998
22172
|
}
|
|
21999
22173
|
const isSelected = value?.value === option.value;
|
|
22000
22174
|
const isHighlighted = virtualItem.index === highlightedIndex;
|
|
22001
|
-
return /* @__PURE__ */
|
|
22175
|
+
return /* @__PURE__ */ jsx193(
|
|
22002
22176
|
"button",
|
|
22003
22177
|
{
|
|
22004
22178
|
id: getOptionId(idPrefix, virtualItem.index),
|
|
@@ -22020,7 +22194,7 @@ function AirbnbSearchableSelectContent({
|
|
|
22020
22194
|
height: `${virtualItem.size}px`,
|
|
22021
22195
|
transform: `translateY(${virtualItem.start}px)`
|
|
22022
22196
|
},
|
|
22023
|
-
children: /* @__PURE__ */
|
|
22197
|
+
children: /* @__PURE__ */ jsx193("span", { className: "truncate text-center", children: String(option.label) })
|
|
22024
22198
|
},
|
|
22025
22199
|
`${String(option.value)}-${virtualItem.index}`
|
|
22026
22200
|
);
|
|
@@ -22049,16 +22223,18 @@ function getNextEnabledIndex(options, startIndex, step) {
|
|
|
22049
22223
|
}
|
|
22050
22224
|
|
|
22051
22225
|
// src/airbnb-fields/search-input/SearchInput.tsx
|
|
22052
|
-
import * as
|
|
22226
|
+
import * as React83 from "react";
|
|
22053
22227
|
import { useTranslation as useTranslation44 } from "react-i18next";
|
|
22054
22228
|
import { Search as Search6, X as X11 } from "lucide-react";
|
|
22055
|
-
import { jsx as
|
|
22056
|
-
var AirbnbSearchInput =
|
|
22229
|
+
import { jsx as jsx194, jsxs as jsxs125 } from "react/jsx-runtime";
|
|
22230
|
+
var AirbnbSearchInput = React83.forwardRef(({ onReset, placeholder, helper, wrapperClassName, ...props }, ref) => {
|
|
22057
22231
|
const { t } = useTranslation44();
|
|
22232
|
+
const generatedId = React83.useId();
|
|
22233
|
+
const helperId = helper ? `${props.id ?? generatedId}-helper` : void 0;
|
|
22058
22234
|
const placeholderText = placeholder || t("search_property") + "...";
|
|
22059
|
-
|
|
22060
|
-
/* @__PURE__ */
|
|
22061
|
-
/* @__PURE__ */
|
|
22235
|
+
const field = /* @__PURE__ */ jsxs125("div", { className: cn("input-wrapper relative", wrapperClassName), children: [
|
|
22236
|
+
/* @__PURE__ */ jsx194(Search6, { className: "absolute left-4 top-1/2 h-5 w-5 -translate-y-1/2 transform text-[var(--chekin-neutral-500)]" }),
|
|
22237
|
+
/* @__PURE__ */ jsx194(
|
|
22062
22238
|
"input",
|
|
22063
22239
|
{
|
|
22064
22240
|
...props,
|
|
@@ -22071,31 +22247,39 @@ var AirbnbSearchInput = React82.forwardRef(({ onReset, placeholder, wrapperClass
|
|
|
22071
22247
|
onFocus: props.onFocus,
|
|
22072
22248
|
onBlur: props.onBlur,
|
|
22073
22249
|
placeholder: placeholderText,
|
|
22250
|
+
"aria-describedby": helperId ?? props["aria-describedby"],
|
|
22074
22251
|
className: cn(
|
|
22075
22252
|
"placeholder-shown:bg-accent flex h-10 w-full rounded-md border border-input bg-background py-3 pl-12 pr-4 text-base text-[#2d3748] ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-base placeholder:font-medium placeholder:text-[var(--chekin-neutral-500)] focus:border-gray-300 focus:outline-none focus:ring-0 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
|
|
22076
22253
|
props.className
|
|
22077
22254
|
)
|
|
22078
22255
|
}
|
|
22079
22256
|
),
|
|
22080
|
-
onReset && /* @__PURE__ */
|
|
22257
|
+
onReset && /* @__PURE__ */ jsx194(
|
|
22081
22258
|
Button,
|
|
22082
22259
|
{
|
|
22083
22260
|
variant: "ghost",
|
|
22084
22261
|
onClick: onReset,
|
|
22085
22262
|
className: "absolute right-0 top-1/2 h-5 w-5 -translate-y-1/2 transform text-[var(--chekin-neutral-500)]",
|
|
22086
|
-
children: /* @__PURE__ */
|
|
22263
|
+
children: /* @__PURE__ */ jsx194(X11, { className: "h-5 w-5" })
|
|
22087
22264
|
}
|
|
22088
22265
|
)
|
|
22089
22266
|
] });
|
|
22267
|
+
if (!helper) {
|
|
22268
|
+
return field;
|
|
22269
|
+
}
|
|
22270
|
+
return /* @__PURE__ */ jsxs125("div", { className: "w-full", children: [
|
|
22271
|
+
field,
|
|
22272
|
+
/* @__PURE__ */ jsx194(AirbnbFieldHelperText, { id: helperId, helper, disabled: props.disabled })
|
|
22273
|
+
] });
|
|
22090
22274
|
});
|
|
22091
22275
|
AirbnbSearchInput.displayName = "AirbnbSearchInput";
|
|
22092
22276
|
|
|
22093
22277
|
// src/airbnb-fields/switch/Switch.tsx
|
|
22094
|
-
import * as
|
|
22278
|
+
import * as React84 from "react";
|
|
22095
22279
|
import * as SwitchPrimitives2 from "@radix-ui/react-switch";
|
|
22096
22280
|
import { Check as Check8 } from "lucide-react";
|
|
22097
|
-
import { Fragment as Fragment18, jsx as
|
|
22098
|
-
var AirbnbSwitch =
|
|
22281
|
+
import { Fragment as Fragment18, jsx as jsx195, jsxs as jsxs126 } from "react/jsx-runtime";
|
|
22282
|
+
var AirbnbSwitch = React84.forwardRef(
|
|
22099
22283
|
({
|
|
22100
22284
|
className,
|
|
22101
22285
|
value,
|
|
@@ -22106,15 +22290,18 @@ var AirbnbSwitch = React83.forwardRef(
|
|
|
22106
22290
|
id,
|
|
22107
22291
|
label,
|
|
22108
22292
|
error,
|
|
22293
|
+
helper,
|
|
22109
22294
|
wrapperClassName,
|
|
22110
22295
|
...props
|
|
22111
22296
|
}, ref) => {
|
|
22112
|
-
const generatedId =
|
|
22297
|
+
const generatedId = React84.useId();
|
|
22113
22298
|
const fieldId = id || generatedId;
|
|
22114
|
-
const
|
|
22299
|
+
const helperId = `${fieldId}-helper`;
|
|
22300
|
+
const switchElement = /* @__PURE__ */ jsx195(
|
|
22115
22301
|
SwitchPrimitives2.Root,
|
|
22116
22302
|
{
|
|
22117
22303
|
ref,
|
|
22304
|
+
"aria-describedby": helper ? helperId : void 0,
|
|
22118
22305
|
className: cn(
|
|
22119
22306
|
"group inline-flex h-[24px] w-[36px] shrink-0 cursor-pointer items-center rounded-full border border-solid border-transparent p-[2px] transition-colors duration-200",
|
|
22120
22307
|
"focus-visible:outline-none focus-visible:shadow-[var(--chekin-shadow-focus)]",
|
|
@@ -22131,14 +22318,14 @@ var AirbnbSwitch = React83.forwardRef(
|
|
|
22131
22318
|
"aria-busy": loading,
|
|
22132
22319
|
"aria-readonly": readOnly,
|
|
22133
22320
|
...props,
|
|
22134
|
-
children: /* @__PURE__ */
|
|
22321
|
+
children: /* @__PURE__ */ jsx195(
|
|
22135
22322
|
SwitchPrimitives2.Thumb,
|
|
22136
22323
|
{
|
|
22137
22324
|
className: cn(
|
|
22138
22325
|
"flex h-[20px] w-[20px] items-center justify-center rounded-full bg-white shadow-[0_1px_3px_rgba(0,0,0,0.22)] transition-transform duration-200",
|
|
22139
22326
|
"data-[state=checked]:translate-x-[12px] data-[state=unchecked]:translate-x-0"
|
|
22140
22327
|
),
|
|
22141
|
-
children: /* @__PURE__ */
|
|
22328
|
+
children: /* @__PURE__ */ jsx195(
|
|
22142
22329
|
Check8,
|
|
22143
22330
|
{
|
|
22144
22331
|
"aria-hidden": "true",
|
|
@@ -22150,13 +22337,13 @@ var AirbnbSwitch = React83.forwardRef(
|
|
|
22150
22337
|
)
|
|
22151
22338
|
}
|
|
22152
22339
|
);
|
|
22153
|
-
if (!label && !error) {
|
|
22340
|
+
if (!label && !error && !helper) {
|
|
22154
22341
|
return switchElement;
|
|
22155
22342
|
}
|
|
22156
22343
|
return /* @__PURE__ */ jsxs126(Fragment18, { children: [
|
|
22157
22344
|
/* @__PURE__ */ jsxs126("div", { className: cn("flex items-center gap-x-3 gap-y-1.5", wrapperClassName), children: [
|
|
22158
22345
|
switchElement,
|
|
22159
|
-
label && /* @__PURE__ */
|
|
22346
|
+
label && /* @__PURE__ */ jsx195(
|
|
22160
22347
|
Label,
|
|
22161
22348
|
{
|
|
22162
22349
|
htmlFor: fieldId,
|
|
@@ -22168,7 +22355,8 @@ var AirbnbSwitch = React83.forwardRef(
|
|
|
22168
22355
|
}
|
|
22169
22356
|
)
|
|
22170
22357
|
] }),
|
|
22171
|
-
error && /* @__PURE__ */
|
|
22358
|
+
error && /* @__PURE__ */ jsx195(ErrorMessage, { disabled, children: error }),
|
|
22359
|
+
!error && /* @__PURE__ */ jsx195(AirbnbFieldHelperText, { id: helperId, helper, disabled })
|
|
22172
22360
|
] });
|
|
22173
22361
|
}
|
|
22174
22362
|
);
|
|
@@ -22180,6 +22368,7 @@ export {
|
|
|
22180
22368
|
AccordionItem,
|
|
22181
22369
|
AccordionTrigger,
|
|
22182
22370
|
AirbnbDatePicker,
|
|
22371
|
+
AirbnbFieldHelperText,
|
|
22183
22372
|
AirbnbFieldTrigger,
|
|
22184
22373
|
AirbnbInput,
|
|
22185
22374
|
AirbnbPhoneField,
|