@awell-health/ui-library 0.1.49 → 0.1.51

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.css CHANGED
@@ -8212,30 +8212,400 @@ html {
8212
8212
  --awell-activity-padding: 0 var(--awell-spacing-4);
8213
8213
  }
8214
8214
 
8215
+ .awell__CloseButton_close_button {
8216
+ position: absolute;
8217
+ right: 1.5rem;
8218
+ top: 0.85rem;
8219
+ cursor: pointer;
8220
+ background: #fff;
8221
+ border-radius: var(--awell-border-radius-md);
8222
+ border: 1px solid var(--awell-neutralLight50);
8223
+ display: flex;
8224
+ padding: var(--awell-spacing-1\.5);
8225
+ }
8226
+ .awell__CloseButton_close_button:hover {
8227
+ border-color: var(--awell-accent-color);
8228
+ }
8229
+ .awell__CloseButton_close_button:hover .awell__CloseButton_close_button_svg {
8230
+ color: var(--awell-accent-color);
8231
+ }
8232
+ .awell__CloseButton_close_button:focus {
8233
+ color: var(--awell-accent-color);
8234
+ }
8235
+ .awell__CloseButton_close_button .awell__CloseButton_close_button_svg {
8236
+ width: 20px;
8237
+ height: 20px;
8238
+ color: var(--awell-neutralLight50);
8239
+ }
8240
+ @import 'https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap';
8215
8241
  :root {
8216
- --awell-scheduling-activity-footer-max-width: var(--awell-activity-max-width);
8217
- --awell-scheduling-activity-padding: var(--awell-activity-padding);
8242
+ --awell-accent100: #fdb833;
8243
+ --awell-accent40: #fee2ad;
8244
+ --awell-accent60: #fdd484;
8245
+ --awell-blue: #2E87FC;
8246
+ --awell-blue50: #DEEBFF;
8247
+ --awell-blue300: #0065FF;
8248
+ --awell-blue400: #0052CC;
8249
+ --awell-blue500: #0747A6;
8250
+ --awell-blueBorder: #126DEF;
8251
+ --awell-brand10: #e6edf9;
8252
+ --awell-brand40: #99b6e6;
8253
+ --awell-brand50: #739FE7;
8254
+ --awell-brand60: #4E7AC2;
8255
+ --awell-brand75: #B3D4FF;
8256
+ --awell-brand80: #3476E0;
8257
+ --awell-brand100: #004ac2;
8258
+ --awell-brand200: #2684FF;
8259
+ --awell-brand300: #0065FF;
8260
+ --awell-green: #67D172;
8261
+ --awell-green25: #EBFDF7;
8262
+ --awell-green50: #E3FCEF;
8263
+ --awell-green100: #27AB83;
8264
+ --awell-green500: #064;
8265
+ --awell-greenBorder: #5DB566;
8266
+ --awell-neutralDark500: #42526E;
8267
+ --awell-neutralDark600: #344563;
8268
+ --awell-neutralDark700: #253858;
8269
+ --awell-neutralDark800: #172B4D;
8270
+ --awell-neutralDark900: #091E42;
8271
+ --awell-neutralLight0: #fff;
8272
+ --awell-neutralLight10: #fafbfc;
8273
+ --awell-neutralLight100: #7A869A;
8274
+ --awell-neutralLight20: #f4f5f7;
8275
+ --awell-neutralLight30: #ebecf0;
8276
+ --awell-neutralLight40: #dfe1e6;
8277
+ --awell-neutralLight50: #c1c7d0;
8278
+ --awell-neutralMid100: #7a869a;
8279
+ --awell-neutralMid200: #6b778c;
8280
+ --awell-neutralMid300: #5e6c84;
8281
+ --awell-neutralMid400: #505F79;
8282
+ --awell-neutralMid60: #b3bac5;
8283
+ --awell-neutralMid70: #a5adba;
8284
+ --awell-neutralMid80: #97a0af;
8285
+ --awell-neutralMid90: #8993a4;
8286
+ --awell-orange: #FEC32D;
8287
+ --awell-orangeBorder: #CB9C22;
8288
+ --awell-purple: #6558BE;
8289
+ --awell-purpleBorder: #4F4498;
8290
+ --awell-red: #FF3A54;
8291
+ --awell-red100: #E12D39;
8292
+ --awell-red400: #DE350B;
8293
+ --awell-red50: #FFEBE6;
8294
+ --awell-red500: #BF2600;
8295
+ --awell-redBorder: #D12D43;
8296
+ --awell-secondaryAqua100: #01c5e3;
8297
+ --awell-secondaryBrown100: #df692f;
8298
+ --awell-secondaryLightblue100: #2590fb;
8299
+ --awell-secondaryLimegreen100: #86e34b;
8300
+ --awell-secondaryMagenta100: #e255ff;
8301
+ --awell-secondaryOrange100: #ff6000;
8302
+ --awell-secondaryPink100: #ff37be;
8303
+ --awell-secondaryPink40: #ffafe5;
8304
+ --awell-secondaryYellow100: #f7d32b;
8305
+ --awell-secondaryYellow20: #fdf6d5;
8306
+ --awell-secondaryYellow40: #f4edcb;
8307
+ --awell-signalError100: #e12d39;
8308
+ --awell-signalError60: #ed8188;
8309
+ --awell-signalError20: #F9D5D7;
8310
+ --awell-signalInformative100: #001d4d;
8311
+ --awell-signalInformative60: #667794;
8312
+ --awell-signalSuccess100: #27ab83;
8313
+ --awell-signalSuccess60: #7dccb4;
8314
+ --awell-signalWarning100: #fdd333;
8315
+ --awell-signalWarning60: #fde484;
8316
+ --awell-teal: #21C7E4;
8317
+ --awell-teal400: #00A3BF;
8318
+ --awell-teal50: #E6FCFF;
8319
+ --awell-tealBorder: #179BB2;
8320
+ --awell-yellow100: #FFE380;
8321
+ --awell-yellow75: #FFF0B3;
8322
+ --awell-primary-color: var(--awell-accent-color)
8323
+ /** Slate (grayscale color palette) **/
8324
+ --awell-slate50: #f8fafc;
8325
+ --awell-slate100: #f1f5f9;
8326
+ --awell-slate200:#e2e8f0;
8327
+ --awell-slate300:#cbd5e1;
8328
+ --awell-slate400:#94a3b8;
8329
+ --awell-slate500:#64748b;
8330
+ --awell-slate600:#475569;
8331
+ --awell-slate700:#334155;
8332
+ --awell-slate800:#1e293b;
8333
+ --awell-slate900:#0f172a;
8218
8334
  }
8219
8335
 
8220
- .awell__calDotcomActivity_calDotComActivity {
8336
+ html {
8337
+ /*
8338
+ FONT
8339
+ */
8340
+ --awell-font: roboto;
8341
+ /*
8342
+ Misc
8343
+ */
8344
+ --awell-header-height: 94px;
8345
+ --awell-mobile-footer-height: 60px;
8346
+ --awell-footer-height: 80px;
8347
+ /*
8348
+ FONT SIZES
8349
+ Based on https://tailwindcss.com/docs/font-size
8350
+ */
8351
+ --font-size-xs: 0.75rem;
8352
+ /* 12px */
8353
+ --font-size-sm: 0.875rem;
8354
+ /* 14px */
8355
+ --font-size-base: 1rem;
8356
+ /* 16px */
8357
+ --font-size-lg: 1.125rem;
8358
+ /* 18px */
8359
+ --font-size-xl: 1.25rem;
8360
+ /* 20px */
8361
+ --font-size-2xl: 1.5rem;
8362
+ /* 24px */
8363
+ --font-size-3xl: 1.875rem;
8364
+ /* 30px */
8365
+ --font-size-4xl: 2.25rem;
8366
+ /* 36px */
8367
+ --font-size-5xl: 3rem;
8368
+ /* 48px */
8369
+ --font-size-6xl: 3.75em;
8370
+ /* 60px */
8371
+ --font-size-7xl: 4.5rem;
8372
+ /* 72px */
8373
+ --font-size-8xl: 6rem;
8374
+ /* 96px */
8375
+ --awell-font-size-xs: var(--font-size-xs);
8376
+ --awell-font-size-sm: var(--font-size-sm);
8377
+ --awell-font-size-base: var(--font-size-base);
8378
+ --awell-font-size-lg: var(--font-size-lg);
8379
+ --awell-font-size-xl: var(--font-size-xl);
8380
+ --awell-font-size-2xl: var(--font-size-2xl);
8381
+ --awell-font-size-3xl: var(--font-size-3xl);
8382
+ --awell-font-size-4xl: var(--font-size-4xl);
8383
+ --awell-font-size-5xl: var(--font-size-5xl);
8384
+ --awell-font-size-6xl: var(--font-size-6xl);
8385
+ --awell-font-size-7xl: var(--font-size-7xl);
8386
+ --awell-font-size-8xl: var(--font-size-8xl);
8387
+ /*
8388
+ SPACING
8389
+ Based on https://tailwindcss.com/docs/padding
8390
+ */
8391
+ --spacing-none: 0rem;
8392
+ --spacing-O\.5: 0.125rem;
8393
+ /* 2px */
8394
+ --spacing-1: 0.25rem;
8395
+ /* 4px */
8396
+ --spacing-1\.5: 0.375rem;
8397
+ /* 6px */
8398
+ --spacing-2: 0.5rem;
8399
+ /* 8px */
8400
+ --spacing-2\.5: 0.625rem;
8401
+ /* 10px */
8402
+ --spacing-3: 0.65rem;
8403
+ /* 12px */
8404
+ --spacing-3\.5: 0.875rem;
8405
+ /* 14px */
8406
+ --spacing-4: 1rem;
8407
+ /* 16px */
8408
+ --spacing-5: 1.25rem;
8409
+ /* 20px */
8410
+ --spacing-6: 1.5rem;
8411
+ /* 24px */
8412
+ --spacing-7: 1.75rem;
8413
+ /* 28px */
8414
+ --spacing-8: 2rem;
8415
+ /* 32px */
8416
+ --spacing-9: 2.25rem;
8417
+ /* 36px */
8418
+ --spacing-10: 2.5rem;
8419
+ /* 40px */
8420
+ --spacing-11: 2.75rem;
8421
+ /* 44px */
8422
+ --spacing-12: 3rem;
8423
+ /* 48px */
8424
+ --spacing-14: 3.5rem;
8425
+ /* 56px */
8426
+ --spacing-16: 4rem;
8427
+ /* 64px */
8428
+ --spacing-20: 5rem;
8429
+ /* 80px */
8430
+ --spacing-24: 6rem;
8431
+ /* 96px */
8432
+ --spacing-28: 7rem;
8433
+ /* 112px */
8434
+ --spacing-32: 8rem;
8435
+ /* 128px */
8436
+ --spacing-36: 9rem;
8437
+ /* 144px */
8438
+ --spacing-40: 10rem;
8439
+ /* 160px */
8440
+ --spacing-44: 11rem;
8441
+ /* 176px */
8442
+ --spacing-48: 12rem;
8443
+ /* 192px */
8444
+ --spacing-52: 13rem;
8445
+ /* 208px */
8446
+ --spacing-56: 14rem;
8447
+ /* 224px */
8448
+ --spacing-60: 15rem;
8449
+ /* 240px */
8450
+ --awell-spacing-none: var(--spacing-none);
8451
+ --awell-spacing-0\.5: var(--spacing-O\.5);
8452
+ --awell-spacing-1: var(--spacing-1);
8453
+ --awell-spacing-1\.5: var(--spacing-1\.5);
8454
+ --awell-spacing-2: var(--spacing-2);
8455
+ --awell-spacing-2\.5: var(--spacing-2\.5);
8456
+ --awell-spacing-3: var(--spacing-3);
8457
+ --awell-spacing-3\.5: var(--spacing-3\.5);
8458
+ --awell-spacing-4: var(--spacing-4);
8459
+ --awell-spacing-5: var(--spacing-5);
8460
+ --awell-spacing-6: var(--spacing-6);
8461
+ --awell-spacing-7: var(--spacing-7);
8462
+ --awell-spacing-8: var(--spacing-8);
8463
+ --awell-spacing-9: var(--spacing-9);
8464
+ --awell-spacing-10: var(--spacing-10);
8465
+ --awell-spacing-11: var(--spacing-11);
8466
+ --awell-spacing-12: var(--spacing-12);
8467
+ --awell-spacing-14: var(--spacing-14);
8468
+ --awell-spacing-16: var(--spacing-16);
8469
+ --awell-spacing-20: var(--spacing-20);
8470
+ --awell-spacing-24: var(--spacing-24);
8471
+ --awell-spacing-28: var(--spacing-28);
8472
+ --awell-spacing-32: var(--spacing-32);
8473
+ --awell-spacing-36: var(--spacing-36);
8474
+ --awell-spacing-40: var(--spacing-40);
8475
+ --awell-spacing-44: var(--spacing-44);
8476
+ --awell-spacing-48: var(--spacing-48);
8477
+ --awell-spacing-52: var(--spacing-52);
8478
+ --awell-spacing-56: var(--spacing-56);
8479
+ --awell-spacing-60: var(--spacing-60);
8480
+ /*
8481
+ BORDER RADIUS
8482
+ Based on https://tailwindcss.com/docs/border-radius#rounding-corners-separately
8483
+ */
8484
+ --awell-border-radius-none: 0px;
8485
+ --awell-border-radius-sm: 0.125rem;
8486
+ /* 4px */
8487
+ --awell-border-radius-rounded: 0.25rem;
8488
+ /* 6px */
8489
+ --awell-border-radius-md: 0.375rem;
8490
+ /* 8px */
8491
+ --awell-border-radius-lg: 0.5rem;
8492
+ /* 12px */
8493
+ --awell-border-radius-xl: 0.75rem;
8494
+ /* 16px */
8495
+ --awell-border-radius-2xl: 1rem;
8496
+ /* 18px */
8497
+ --awell-border-radius-3xl: 1.5rem;
8498
+ /* 24px */
8499
+ --awell-border-radius-full: 9999px;
8500
+ /* cirlce */
8501
+ /*
8502
+ SHADOW
8503
+ Based on https://tailwindcss.com/docs/box-shadow
8504
+ */
8505
+ --awell-shadow-none: 0 0 #0000;
8506
+ --awell-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
8507
+ --awell-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1),
8508
+ 0 2px 4px -2px rgb(0 0 0 / 0.1);
8509
+ --awell-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1),
8510
+ 0 4px 6px -4px rgb(0 0 0 / 0.1);
8511
+ --awell-shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1),
8512
+ 0 8px 10px -6px rgb(0 0 0 / 0.1);
8513
+ --awell-shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
8514
+ /*
8515
+ FONT WEIGHT
8516
+ Based on https://tailwindcss.com/docs/font-weight
8517
+ */
8518
+ --awell-font-thin: 100;
8519
+ --awell-font-extralight: 200;
8520
+ --awell-font-light: 300;
8521
+ --awell-font-normal: 400;
8522
+ --awell-font-medium: 500;
8523
+ --awell-font-semibold: 600;
8524
+ --awell-font-bold: 700;
8525
+ --awell-font-extrabold: 800;
8526
+ --awell-font-black: 900;
8527
+ /*
8528
+ LINE-HEIGHT
8529
+ Based on https://tailwindcss.com/docs/line-height#relative-line-heights
8530
+ */
8531
+ --awell-leading-3: 0.75rem;
8532
+ /* 12px */
8533
+ --awell-leading-4: 1rem;
8534
+ /* 16px */
8535
+ --awell-leading-5: 1.25rem;
8536
+ /* 20px */
8537
+ --awell-leading-6: 1.5rem;
8538
+ /* 24px */
8539
+ --awell-leading-7: 1.75rem;
8540
+ /* 28px */
8541
+ --awell-leading-8: 2rem;
8542
+ /* 32px */
8543
+ --awell-leading-9: 2.25rem;
8544
+ /* 36px */
8545
+ --awell-leading-10: 2.5rem;
8546
+ /* 40px */
8547
+ --awell-leading-none: 1;
8548
+ --awell-leading-tight: 1.25;
8549
+ --awell-leading-snug: 1.375;
8550
+ --awell-leading-normal: 1.5;
8551
+ --awell-leading-relaxed: 1.625;
8552
+ --awell-leading-loose: 2;
8553
+ /**
8554
+ RADIOS & CHECKBOXES
8555
+ **/
8556
+ --awell-radio-checkbox-height-mobile: 1.5rem;
8557
+ --awell-radio-checkbox-width-mobile: 1.5rem;
8558
+ --awell-radio-checkbox-height-above-mobile: 1.4rem;
8559
+ --awell-radio-checkbox-width-above-mobile: 1.4rem;
8560
+ --awell-radio-checkbox-border-color: var(--awell-slate400);
8561
+ --awell-radio-checkbox-label-color: var(--awell-slate700);
8562
+ --awell-checkbox-border-radius: var(--awell-border-radius-rounded);
8563
+ /**
8564
+ ACTIVITY CONTENT
8565
+ **/
8566
+ --awell-activity-max-width: 65ch;
8567
+ --awell-activity-padding: 0 var(--awell-spacing-4);
8568
+ }
8569
+
8570
+ .awell__loadActivityPlaceholder_loading_indicators {
8221
8571
  display: flex;
8222
8572
  flex-direction: column;
8223
8573
  align-items: center;
8224
- justify-content: center;
8225
- margin: 0 auto;
8226
- }
8227
-
8228
- .awell__calDotcomActivity_container {
8229
- padding: var(--awell-scheduling-activity-padding);
8574
+ width: 100%;
8230
8575
  }
8231
8576
 
8232
- .awell__calDotcomActivity_button_wrapper {
8233
- max-width: var(--awell-scheduling-activity-footer-max-width);
8234
- display: flex;
8235
- justify-content: flex-end;
8236
- height: 100%;
8237
- align-items: center;
8577
+ .awell__loadActivityPlaceholder_loading_indicator {
8238
8578
  width: 100%;
8579
+ height: 3.125rem;
8580
+ border-radius: var(--awell-border-radius-xl);
8581
+ margin: var(--awell-spacing-2) 0;
8582
+ background: linear-gradient(90deg, transparent, #EEEEEE, transparent);
8583
+ background-size: 200% 100%;
8584
+ background-position: -100% 0;
8585
+ animation: awell__loadActivityPlaceholder_wave 1.2s infinite;
8586
+ }
8587
+
8588
+ /* Styles for larger screens */
8589
+ @media (min-width: 768px) {
8590
+ .awell__loadActivityPlaceholder_loading_indicators {
8591
+ max-width: 570px;
8592
+ padding: var(--awell-spacing-8) 0;
8593
+ }
8594
+ }
8595
+ /* Styles for smaller screens (mobile) */
8596
+ @media (max-width: 767px) {
8597
+ .awell__loadActivityPlaceholder_loading_indicators {
8598
+ min-width: 336px;
8599
+ padding: var(--awell-spacing-8) var(--awell-spacing-4);
8600
+ }
8601
+ }
8602
+ @keyframes awell__loadActivityPlaceholder_wave {
8603
+ 0% {
8604
+ background-position: -100% 0;
8605
+ }
8606
+ 100% {
8607
+ background-position: 100% 0;
8608
+ }
8239
8609
  }
8240
8610
  @import 'https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap';
8241
8611
  :root {
@@ -8568,66 +8938,24 @@ html {
8568
8938
  }
8569
8939
 
8570
8940
  :root {
8571
- --awell-activity-cloudinary-max-width: var(--awell-activity-max-width);
8572
- --awell-activity-cloudinary-padding: var(--awell-activity-padding);
8573
- }
8574
-
8575
- .awell__cloudinary_container {
8576
- max-width: var(--awell-activity-cloudinary-max-width);
8577
- padding: var(--awell-activity-cloudinary-padding);
8941
+ --awell-scheduling-activity-footer-max-width: var(--awell-activity-max-width);
8942
+ --awell-scheduling-activity-padding: var(--awell-activity-padding);
8578
8943
  }
8579
8944
 
8580
- .awell__cloudinary_awell_cloudinary,
8581
- .awell__cloudinary_content {
8945
+ .awell__calDotcomActivity_calDotComActivity {
8582
8946
  display: flex;
8583
8947
  flex-direction: column;
8584
8948
  align-items: center;
8585
8949
  justify-content: center;
8586
8950
  margin: 0 auto;
8587
- gap: 16px;
8588
- }
8589
-
8590
- .awell__cloudinary_content {
8591
- width: 100%;
8592
- }
8593
-
8594
- .awell__cloudinary_message_title {
8595
- color: rgb(17, 24, 39);
8596
- text-align: center;
8597
- line-height: var(--awell-leading-8);
8598
- font-size: var(--awell-font-size-4xl);
8599
- letter-spacing: -0.025em;
8600
- font-weight: var(--awell-font-extrabold);
8601
- margin-bottom: var(--awell-spacing-8);
8602
- }
8603
- @media (min-width: 640px) {
8604
- .awell__cloudinary_message_title {
8605
- margin-bottom: var(--awell-spacing-6);
8606
- font-size: var(--awell-font-size-3xl);
8607
- }
8608
- }
8609
- .awell__cloudinary_message_title:after {
8610
- content: "";
8611
- margin: 0 auto;
8612
- display: block;
8613
- width: 10rem;
8614
- margin-top: var(--awell-spacing-4);
8615
- background-color: var(--awell-accent-color);
8616
- height: 3px;
8617
- border-radius: var(--awell-border-radius-lg);
8618
- }
8619
- @media (min-width: 640px) {
8620
- .awell__cloudinary_message_title:after {
8621
- margin-top: var(--awell-spacing-3);
8622
- }
8623
8951
  }
8624
8952
 
8625
- .awell__cloudinary_attachmentList {
8626
- margin-top: var(--awell-spacing-4);
8627
- width: 100%;
8953
+ .awell__calDotcomActivity_container {
8954
+ padding: var(--awell-scheduling-activity-padding);
8628
8955
  }
8629
8956
 
8630
- .awell__cloudinary_button_wrapper {
8957
+ .awell__calDotcomActivity_button_wrapper {
8958
+ max-width: var(--awell-scheduling-activity-footer-max-width);
8631
8959
  display: flex;
8632
8960
  justify-content: flex-end;
8633
8961
  height: 100%;
@@ -8964,28 +9292,70 @@ html {
8964
9292
  --awell-activity-padding: 0 var(--awell-spacing-4);
8965
9293
  }
8966
9294
 
8967
- .awell__CloseButton_close_button {
8968
- position: absolute;
8969
- right: 1.5rem;
8970
- top: 0.85rem;
8971
- cursor: pointer;
8972
- background: #fff;
8973
- border-radius: var(--awell-border-radius-md);
8974
- border: 1px solid var(--awell-neutralLight50);
9295
+ :root {
9296
+ --awell-activity-cloudinary-max-width: var(--awell-activity-max-width);
9297
+ --awell-activity-cloudinary-padding: var(--awell-activity-padding);
9298
+ }
9299
+
9300
+ .awell__cloudinary_container {
9301
+ max-width: var(--awell-activity-cloudinary-max-width);
9302
+ padding: var(--awell-activity-cloudinary-padding);
9303
+ }
9304
+
9305
+ .awell__cloudinary_awell_cloudinary,
9306
+ .awell__cloudinary_content {
8975
9307
  display: flex;
8976
- padding: var(--awell-spacing-1\.5);
9308
+ flex-direction: column;
9309
+ align-items: center;
9310
+ justify-content: center;
9311
+ margin: 0 auto;
9312
+ gap: 16px;
8977
9313
  }
8978
- .awell__CloseButton_close_button:hover {
8979
- border-color: var(--awell-accent-color);
9314
+
9315
+ .awell__cloudinary_content {
9316
+ width: 100%;
8980
9317
  }
8981
- .awell__CloseButton_close_button:hover .awell__CloseButton_close_button_svg {
8982
- color: var(--awell-accent-color);
9318
+
9319
+ .awell__cloudinary_message_title {
9320
+ color: rgb(17, 24, 39);
9321
+ text-align: center;
9322
+ line-height: var(--awell-leading-8);
9323
+ font-size: var(--awell-font-size-4xl);
9324
+ letter-spacing: -0.025em;
9325
+ font-weight: var(--awell-font-extrabold);
9326
+ margin-bottom: var(--awell-spacing-8);
8983
9327
  }
8984
- .awell__CloseButton_close_button:focus {
8985
- color: var(--awell-accent-color);
9328
+ @media (min-width: 640px) {
9329
+ .awell__cloudinary_message_title {
9330
+ margin-bottom: var(--awell-spacing-6);
9331
+ font-size: var(--awell-font-size-3xl);
9332
+ }
8986
9333
  }
8987
- .awell__CloseButton_close_button .awell__CloseButton_close_button_svg {
8988
- width: 20px;
8989
- height: 20px;
8990
- color: var(--awell-neutralLight50);
9334
+ .awell__cloudinary_message_title:after {
9335
+ content: "";
9336
+ margin: 0 auto;
9337
+ display: block;
9338
+ width: 10rem;
9339
+ margin-top: var(--awell-spacing-4);
9340
+ background-color: var(--awell-accent-color);
9341
+ height: 3px;
9342
+ border-radius: var(--awell-border-radius-lg);
9343
+ }
9344
+ @media (min-width: 640px) {
9345
+ .awell__cloudinary_message_title:after {
9346
+ margin-top: var(--awell-spacing-3);
9347
+ }
9348
+ }
9349
+
9350
+ .awell__cloudinary_attachmentList {
9351
+ margin-top: var(--awell-spacing-4);
9352
+ width: 100%;
9353
+ }
9354
+
9355
+ .awell__cloudinary_button_wrapper {
9356
+ display: flex;
9357
+ justify-content: flex-end;
9358
+ height: 100%;
9359
+ align-items: center;
9360
+ width: 100%;
8991
9361
  }
package/dist/index.js CHANGED
@@ -16209,7 +16209,14 @@ Check the top-level render call using <` + t + ">.");
16209
16209
  });
16210
16210
  var purifiedMessage = purify.exports.sanitize(isSlate ? serializeHtml(content) : content, {
16211
16211
  ADD_TAGS: ['iframe'],
16212
- ADD_ATTR: ['target', 'allow', 'allowfullscreen', 'frameborder', 'scrolling'] });
16212
+ ADD_ATTR: [
16213
+ 'target',
16214
+ 'allow',
16215
+ 'allowfullscreen',
16216
+ 'frameborder',
16217
+ 'scrolling'],
16218
+
16219
+ ALLOW_UNKNOWN_PROTOCOLS: true });
16213
16220
 
16214
16221
  return purifiedMessage;
16215
16222
  };
@@ -37115,7 +37122,7 @@ Check the top-level render call using <` + t + ">.");
37115
37122
 
37116
37123
  var classes$5 = {"container":"awell__checklist_container","awell_checklist":"awell__checklist_awell_checklist","title":"awell__checklist_title","checklist":"awell__checklist_checklist","checkboxListFormControl":"awell__checklist_checkboxListFormControl","button_wrapper":"awell__checklist_button_wrapper"};
37117
37124
 
37118
- var classes$4 = {"layout_container":"awell__hostedPageLayout_layout_container","withoutLogo":"awell__hostedPageLayout_withoutLogo","fullViewportHeight":"awell__hostedPageLayout_fullViewportHeight","flexible":"awell__hostedPageLayout_flexible","main_content":"awell__hostedPageLayout_main_content"};
37125
+ var layoutClasses = {"layout_container":"awell__hostedPageLayout_layout_container","withoutLogo":"awell__hostedPageLayout_withoutLogo","fullViewportHeight":"awell__hostedPageLayout_fullViewportHeight","flexible":"awell__hostedPageLayout_flexible","main_content":"awell__hostedPageLayout_main_content"};
37119
37126
 
37120
37127
  var Checklist = function (_a) {
37121
37128
  var title = _a.title,items = _a.items,onSubmit = _a.onSubmit,_b = _a.readOnly,readOnly = _b === void 0 ? false : _b,_c = _a.disabled,disabled = _c === void 0 ? false : _c,submitLabel = _a.submitLabel;
@@ -37129,19 +37136,19 @@ Check the top-level render call using <` + t + ">.");
37129
37136
  setCheckedItems(checkedItems.filter(function (checkedItem) {return checkedItem !== item;}));
37130
37137
  }
37131
37138
  };};
37132
- return jsxRuntime.exports.jsxs(jsxRuntime.exports.Fragment, { children: [jsxRuntime.exports.jsx("main", __assign({ id: "ahp_main_content_with_scroll_hint", className: classes$4.main_content }, { children: jsxRuntime.exports.jsxs("div", __assign({ className: "".concat(classes$5.awell_checklist, " ").concat(classes$5.container) }, { children: [jsxRuntime.exports.jsx("div", __assign({ className: classes$5.title }, { children: jsxRuntime.exports.jsx(QuestionLabel, { label: title }) })), jsxRuntime.exports.jsx("div", __assign({ className: classes$5.checklist }, { children: items.map(function (item) {return jsxRuntime.exports.jsx(CheckboxButton, { onChange: function (event) {return handleChange(item)(event.target.checked);}, label: item.label, id: item.id, disabled: readOnly, name: "checklist-".concat(title) }, item.id);}) }))] })) })), jsxRuntime.exports.jsx(HostedPageFooter, __assign({ showScrollHint: showScrollHint }, { children: jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes$5.button_wrapper, " ").concat(classes$5.container) }, { children: jsxRuntime.exports.jsx(Button, __assign({ onClick: onSubmit, disabled: checkedItems.length !== items.length || readOnly || disabled, "data-cy": "submitChecklistButton" }, { children: submitLabel })) })) }))] });
37139
+ return jsxRuntime.exports.jsxs(jsxRuntime.exports.Fragment, { children: [jsxRuntime.exports.jsx("main", __assign({ id: "ahp_main_content_with_scroll_hint", className: layoutClasses.main_content }, { children: jsxRuntime.exports.jsxs("div", __assign({ className: "".concat(classes$5.awell_checklist, " ").concat(classes$5.container) }, { children: [jsxRuntime.exports.jsx("div", __assign({ className: classes$5.title }, { children: jsxRuntime.exports.jsx(QuestionLabel, { label: title }) })), jsxRuntime.exports.jsx("div", __assign({ className: classes$5.checklist }, { children: items.map(function (item) {return jsxRuntime.exports.jsx(CheckboxButton, { onChange: function (event) {return handleChange(item)(event.target.checked);}, label: item.label, id: item.id, disabled: readOnly, name: "checklist-".concat(title) }, item.id);}) }))] })) })), jsxRuntime.exports.jsx(HostedPageFooter, __assign({ showScrollHint: showScrollHint }, { children: jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes$5.button_wrapper, " ").concat(classes$5.container) }, { children: jsxRuntime.exports.jsx(Button, __assign({ onClick: onSubmit, disabled: checkedItems.length !== items.length || readOnly || disabled, "data-cy": "submitChecklistButton" }, { children: submitLabel })) })) }))] });
37133
37140
  };
37134
37141
 
37135
- var classes$3 = {"container":"awell__message_container","awell_message":"awell__message_awell_message","slate-MediaEmbedElement-input":"awell__message_slate-MediaEmbedElement-input","slate-MediaEmbedElement-iframe":"awell__message_slate-MediaEmbedElement-iframe","content":"awell__message_content","message_title":"awell__message_message_title","attachmentList":"awell__message_attachmentList","button_wrapper":"awell__message_button_wrapper"};
37142
+ var classes$4 = {"container":"awell__message_container","awell_message":"awell__message_awell_message","slate-MediaEmbedElement-input":"awell__message_slate-MediaEmbedElement-input","slate-MediaEmbedElement-iframe":"awell__message_slate-MediaEmbedElement-iframe","content":"awell__message_content","message_title":"awell__message_message_title","attachmentList":"awell__message_attachmentList","button_wrapper":"awell__message_button_wrapper"};
37136
37143
 
37137
37144
  var Message = function (_a) {
37138
37145
  var onMessageRead = _a.onMessageRead,content = _a.content,subject = _a.subject,children = _a.children,attachmentIcon = _a.attachmentIcon,attachmentLabels = _a.attachmentLabels,attachments = _a.attachments,buttonLabels = _a.buttonLabels;
37139
37146
  var showScrollHint = useScrollHint().showScrollHint;
37140
37147
  var cleanContent = generatePureHtml(content);
37141
- return jsxRuntime.exports.jsxs(jsxRuntime.exports.Fragment, { children: [jsxRuntime.exports.jsx("main", __assign({ id: "ahp_main_content_with_scroll_hint", className: classes$4.main_content }, { children: jsxRuntime.exports.jsxs("article", __assign({ className: "".concat(classes$3.awell_message, " ").concat(classes$3.container) }, { children: [jsxRuntime.exports.jsx("div", __assign({ className: classes$3.message_title }, { children: subject })), jsxRuntime.exports.jsx("div", __assign({ className: classes$3.content }, { children: jsxRuntime.exports.jsx(RichTextViewer, { content: cleanContent }) })), jsxRuntime.exports.jsxs("div", __assign({ className: classes$3.attachmentList }, { children: [jsxRuntime.exports.jsx(AttachmentList, { attachments: attachments, icon: attachmentIcon, labels: attachmentLabels }), children] }))] })) })), jsxRuntime.exports.jsx(HostedPageFooter, __assign({ showScrollHint: showScrollHint }, { children: jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes$3.button_wrapper, " ").concat(classes$3.container) }, { children: jsxRuntime.exports.jsx(Button, __assign({ "data-cy": "markMessageAsReadButton", variant: "secondary", onClick: onMessageRead }, { children: buttonLabels.readMessage })) })) }))] });
37148
+ return jsxRuntime.exports.jsxs(jsxRuntime.exports.Fragment, { children: [jsxRuntime.exports.jsx("main", __assign({ id: "ahp_main_content_with_scroll_hint", className: layoutClasses.main_content }, { children: jsxRuntime.exports.jsxs("article", __assign({ className: "".concat(classes$4.awell_message, " ").concat(classes$4.container) }, { children: [jsxRuntime.exports.jsx("div", __assign({ className: classes$4.message_title }, { children: subject })), jsxRuntime.exports.jsx("div", __assign({ className: classes$4.content }, { children: jsxRuntime.exports.jsx(RichTextViewer, { content: cleanContent }) })), jsxRuntime.exports.jsxs("div", __assign({ className: classes$4.attachmentList }, { children: [jsxRuntime.exports.jsx(AttachmentList, { attachments: attachments, icon: attachmentIcon, labels: attachmentLabels }), children] }))] })) })), jsxRuntime.exports.jsx(HostedPageFooter, __assign({ showScrollHint: showScrollHint }, { children: jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes$4.button_wrapper, " ").concat(classes$4.container) }, { children: jsxRuntime.exports.jsx(Button, __assign({ "data-cy": "markMessageAsReadButton", variant: "secondary", onClick: onMessageRead }, { children: buttonLabels.readMessage })) })) }))] });
37142
37149
  };
37143
37150
 
37144
- var classes$2 = {"container":"awell__form_container","traditional_container":"awell__form_traditional_container","awell_wizard_form":"awell__form_awell_wizard_form","form_progress":"awell__form_form_progress","loadingContainer":"awell__form_loadingContainer","title":"awell__form_title","wizard_form":"awell__form_wizard_form","conversational_button_wrapper":"awell__form_conversational_button_wrapper","traditional_button_wrapper":"awell__form_traditional_button_wrapper","traditional_form":"awell__form_traditional_form","traditional_form_question":"awell__form_traditional_form_question","traditional_form_question_slider":"awell__form_traditional_form_question_slider","trademark":"awell__form_trademark","traditional":"awell__form_traditional","conversational":"awell__form_conversational"};
37151
+ var classes$3 = {"container":"awell__form_container","traditional_container":"awell__form_traditional_container","awell_wizard_form":"awell__form_awell_wizard_form","form_progress":"awell__form_form_progress","loadingContainer":"awell__form_loadingContainer","title":"awell__form_title","wizard_form":"awell__form_wizard_form","conversational_button_wrapper":"awell__form_conversational_button_wrapper","traditional_button_wrapper":"awell__form_traditional_button_wrapper","traditional_form":"awell__form_traditional_form","traditional_form_question":"awell__form_traditional_form_question","traditional_form_question_slider":"awell__form_traditional_form_question_slider","trademark":"awell__form_trademark","traditional":"awell__form_traditional","conversational":"awell__form_conversational"};
37145
37152
 
37146
37153
  var useClickOutsideNotifier = function (_a) {
37147
37154
  var ref = _a.ref,clickOutsideHandler = _a.clickOutsideHandler;
@@ -37615,6 +37622,25 @@ Check the top-level render call using <` + t + ">.");
37615
37622
  return { isLoaded: isLoaded };
37616
37623
  };
37617
37624
 
37625
+ var classes$2 = {"close_button":"awell__CloseButton_close_button","close_button_svg":"awell__CloseButton_close_button_svg"};
37626
+
37627
+ var CloseButton = function (_a) {
37628
+ var onClose = _a.onClose;
37629
+ return jsxRuntime.exports.jsx("button", __assign({ type: "button", onClick: onClose, className: classes$2.close_button, id: "awell_close_button" }, { children: jsxRuntime.exports.jsx("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: "currentColor", className: classes$2.close_button_svg }, { children: jsxRuntime.exports.jsx("path", { d: "M6.28 5.22a.75.75 0 00-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 101.06 1.06L10 11.06l3.72 3.72a.75.75 0 101.06-1.06L11.06 10l3.72-3.72a.75.75 0 00-1.06-1.06L10 8.94 6.28 5.22z" }) })) }));
37630
+ };
37631
+
37632
+ var HostedPageLayout = function (_a) {
37633
+ var children = _a.children,onCloseHostedPage = _a.onCloseHostedPage,logo = _a.logo,_b = _a.hideCloseButton,hideCloseButton = _b === void 0 ? false : _b;
37634
+ var layoutMode = useTheme().layoutMode;
37635
+ return jsxRuntime.exports.jsxs("div", __assign({ className: "".concat(layoutClasses.layout_container, " ").concat(layoutClasses[layoutMode], " ").concat(logo ? '' : layoutClasses.withoutLogo) }, { children: [!hideCloseButton && jsxRuntime.exports.jsx(CloseButton, { onClose: onCloseHostedPage }), logo && jsxRuntime.exports.jsx("header", { children: jsxRuntime.exports.jsx(Navbar, { logo: logo }) }), children] }));
37636
+ };
37637
+
37638
+ var classes$1 = {"loading_indicators":"awell__loadActivityPlaceholder_loading_indicators","loading_indicator":"awell__loadActivityPlaceholder_loading_indicator","wave":"awell__loadActivityPlaceholder_wave"};
37639
+
37640
+ var LoadActivityPlaceholder = function () {
37641
+ return jsxRuntime.exports.jsxs("div", __assign({ className: classes$1.loading_indicators }, { children: [jsxRuntime.exports.jsx("div", { className: classes$1.loading_indicator }), jsxRuntime.exports.jsx("div", { className: classes$1.loading_indicator }), jsxRuntime.exports.jsx("div", { className: classes$1.loading_indicator })] }));
37642
+ };
37643
+
37618
37644
  var ConversationalForm = function (_a) {
37619
37645
  var form = _a.form,onSubmit = _a.onSubmit,buttonLabels = _a.buttonLabels,evaluateDisplayConditions = _a.evaluateDisplayConditions,errorLabels = _a.errorLabels,questionLabels = _a.questionLabels,storedAnswers = _a.storedAnswers,onAnswersChange = _a.onAnswersChange,_b = _a.autoProgress,autoProgress = _b === void 0 ? false : _b,_c = _a.autosaveAnswers,autosaveAnswers = _c === void 0 ? true : _c;
37620
37646
  var _d = useConversationalForm({
@@ -37646,8 +37672,8 @@ Check the top-level render call using <` + t + ">.");
37646
37672
  };
37647
37673
  var hideProgressIndicator = isEvaluatingQuestionVisibility && percentageCompleted === 100 ||
37648
37674
  form.questions.length === 1;
37649
- return jsxRuntime.exports.jsxs(jsxRuntime.exports.Fragment, { children: [jsxRuntime.exports.jsx("main", __assign({ id: "ahp_main_content_with_scroll_hint", className: classes$4.main_content }, { children: jsxRuntime.exports.jsxs("div", __assign({ className: "".concat(classes$2.awell_wizard_form, " ").concat(classes$2.container) }, { children: [!hideProgressIndicator && jsxRuntime.exports.jsx("div", __assign({ className: classes$2.form_progress }, { children: jsxRuntime.exports.jsx(ProgressIndicator, { percentageCompleted: percentageCompleted }) })), isEvaluatingQuestionVisibility ||
37650
- (currentQuestion === null || currentQuestion === void 0 ? void 0 : currentQuestion.id) === undefined ? jsxRuntime.exports.jsx("div", __assign({ className: classes$2.loadingContainer }, { children: jsxRuntime.exports.jsx(HorizontalSpinner, {}) })) : jsxRuntime.exports.jsx(jsxRuntime.exports.Fragment, { children: jsxRuntime.exports.jsxs("div", __assign({ className: classes$2.wizard_form }, { children: [jsxRuntime.exports.jsx(Question, { question: currentQuestion, control: control, getValues: getValues, errors: errors, labels: questionLabels, submitAndMoveToNextQuestion: submitAndMoveToNextQuestion, inputAutoFocus: true, shouldAutoProgress: shouldAutoProgress }, currentQuestion.id), (form === null || form === void 0 ? void 0 : form.trademark) && jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes$2.trademark, " ").concat(classes$2.conversational) }, { children: form.trademark }))] })) })] })) })), jsxRuntime.exports.jsx(HostedPageFooter, __assign({ showScrollHint: showScrollHint }, { children: !isEvaluatingQuestionVisibility && jsxRuntime.exports.jsxs("div", __assign({ className: "".concat(classes$2.conversational_button_wrapper, " ").concat(classes$2.container) }, { children: [jsxRuntime.exports.jsx("div", { children: !isFirstQuestion && jsxRuntime.exports.jsx(Button, __assign({ variant: "tertiary", onClick: handleGoToPrevQuestion, "data-cy": "navigateToPrevQuestionButton" }, { children: buttonLabels.prev })) }), isLastQuestion ? jsxRuntime.exports.jsx(Button, __assign({ onClick: submitForm, type: "submit", "data-cy": "submitFormButton", disabled: isSubmittingForm }, { children: buttonLabels.submit })) : jsxRuntime.exports.jsx(Button, __assign({ variant: "secondary", onClick: handleGoToNextQuestion, "data-cy": "navigateToNextQuestionButton" }, { children: buttonLabels.next }))] })) }))] });
37675
+ return jsxRuntime.exports.jsxs(jsxRuntime.exports.Fragment, { children: [jsxRuntime.exports.jsx("main", __assign({ id: "ahp_main_content_with_scroll_hint", className: layoutClasses.main_content }, { children: jsxRuntime.exports.jsxs("div", __assign({ className: "".concat(classes$3.awell_wizard_form, " ").concat(classes$3.container) }, { children: [!hideProgressIndicator && jsxRuntime.exports.jsx("div", __assign({ className: classes$3.form_progress }, { children: jsxRuntime.exports.jsx(ProgressIndicator, { percentageCompleted: percentageCompleted }) })), isEvaluatingQuestionVisibility ||
37676
+ (currentQuestion === null || currentQuestion === void 0 ? void 0 : currentQuestion.id) === undefined ? jsxRuntime.exports.jsx("div", __assign({ className: classes$3.loadingContainer }, { children: jsxRuntime.exports.jsx(LoadActivityPlaceholder, {}) })) : jsxRuntime.exports.jsx(jsxRuntime.exports.Fragment, { children: jsxRuntime.exports.jsxs("div", __assign({ className: classes$3.wizard_form }, { children: [jsxRuntime.exports.jsx(Question, { question: currentQuestion, control: control, getValues: getValues, errors: errors, labels: questionLabels, submitAndMoveToNextQuestion: submitAndMoveToNextQuestion, inputAutoFocus: true, shouldAutoProgress: shouldAutoProgress }, currentQuestion.id), (form === null || form === void 0 ? void 0 : form.trademark) && jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes$3.trademark, " ").concat(classes$3.conversational) }, { children: form.trademark }))] })) })] })) })), jsxRuntime.exports.jsx(HostedPageFooter, __assign({ showScrollHint: showScrollHint }, { children: !isEvaluatingQuestionVisibility && jsxRuntime.exports.jsxs("div", __assign({ className: "".concat(classes$3.conversational_button_wrapper, " ").concat(classes$3.container) }, { children: [jsxRuntime.exports.jsx("div", { children: !isFirstQuestion && jsxRuntime.exports.jsx(Button, __assign({ variant: "tertiary", onClick: handleGoToPrevQuestion, "data-cy": "navigateToPrevQuestionButton" }, { children: buttonLabels.prev })) }), isLastQuestion ? jsxRuntime.exports.jsx(Button, __assign({ onClick: submitForm, type: "submit", "data-cy": "submitFormButton", disabled: isSubmittingForm }, { children: buttonLabels.submit })) : jsxRuntime.exports.jsx(Button, __assign({ variant: "secondary", onClick: handleGoToNextQuestion, "data-cy": "navigateToNextQuestionButton" }, { children: buttonLabels.next }))] })) }))] });
37651
37677
  };
37652
37678
 
37653
37679
  var TraditionalForm = function (_a) {
@@ -37668,12 +37694,12 @@ Check the top-level render call using <` + t + ">.");
37668
37694
  resetLayoutMode();
37669
37695
  };
37670
37696
  }, []);
37671
- return jsxRuntime.exports.jsxs(jsxRuntime.exports.Fragment, { children: [jsxRuntime.exports.jsx("main", __assign({ id: "ahp_main_content_with_scroll_hint", className: "".concat(classes$4.main_content, " ").concat(classes$2.traditional_form) }, { children: jsxRuntime.exports.jsxs("div", __assign({ className: "".concat(classes$2.container, " ").concat(classes$2.traditional_container) }, { children: [!questionWithVisiblity ? jsxRuntime.exports.jsx("div", __assign({ className: classes$2.loadingContainer }, { children: jsxRuntime.exports.jsx(HorizontalSpinner, {}) })) : jsxRuntime.exports.jsx("div", { children: jsxRuntime.exports.jsx("div", { children: questionWithVisiblity.
37697
+ return jsxRuntime.exports.jsxs(jsxRuntime.exports.Fragment, { children: [jsxRuntime.exports.jsx("main", __assign({ id: "ahp_main_content_with_scroll_hint", className: "".concat(layoutClasses.main_content, " ").concat(classes$3.traditional_form) }, { children: jsxRuntime.exports.jsxs("div", __assign({ className: "".concat(classes$3.container, " ").concat(classes$3.traditional_container) }, { children: [!questionWithVisiblity ? jsxRuntime.exports.jsx("div", __assign({ className: classes$3.loadingContainer }, { children: jsxRuntime.exports.jsx(LoadActivityPlaceholder, {}) })) : jsxRuntime.exports.jsx("div", { children: jsxRuntime.exports.jsx("div", { children: questionWithVisiblity.
37672
37698
  filter(function (vb) {return vb.visible;}).
37673
- map(function (visibleQuestion) {return jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes$2.traditional_form_question, " ").concat(visibleQuestion.userQuestionType ===
37699
+ map(function (visibleQuestion) {return jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes$3.traditional_form_question, " ").concat(visibleQuestion.userQuestionType ===
37674
37700
  exports.UserQuestionType.Slider ?
37675
- classes$2.traditional_form_question_slider :
37676
- '') }, { children: jsxRuntime.exports.jsx(Question, { question: visibleQuestion, control: control, getValues: getValues, errors: errors, inputAutoFocus: false, onAnswerChange: updateQuestionVisibility }, visibleQuestion.id) }), visibleQuestion.id);}) }) }), (form === null || form === void 0 ? void 0 : form.trademark) && jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes$2.trademark, " ").concat(classes$2.conversational) }, { children: form.trademark }))] })) })), jsxRuntime.exports.jsx(HostedPageFooter, __assign({ showScrollHint: false }, { children: jsxRuntime.exports.jsxs("div", __assign({ className: "".concat(classes$2.traditional_button_wrapper) }, { children: [formHasErrors && jsxRuntime.exports.jsx("div", { children: jsxRuntime.exports.jsx(Text, __assign({ variant: "textSmall", color: "var(--awell-signalError100)" }, { children: errorLabels.formHasErrors })) }), jsxRuntime.exports.jsx("div", {}), jsxRuntime.exports.jsx(Button, __assign({ onClick: submitForm, type: "submit", "data-cy": "submitFormButton", disabled: isSubmittingForm }, { children: buttonLabels.submit }))] })) }))] });
37701
+ classes$3.traditional_form_question_slider :
37702
+ '') }, { children: jsxRuntime.exports.jsx(Question, { question: visibleQuestion, control: control, getValues: getValues, errors: errors, inputAutoFocus: false, onAnswerChange: updateQuestionVisibility }, visibleQuestion.id) }), visibleQuestion.id);}) }) }), (form === null || form === void 0 ? void 0 : form.trademark) && jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes$3.trademark, " ").concat(classes$3.conversational) }, { children: form.trademark }))] })) })), jsxRuntime.exports.jsx(HostedPageFooter, __assign({ showScrollHint: false }, { children: jsxRuntime.exports.jsxs("div", __assign({ className: "".concat(classes$3.traditional_button_wrapper) }, { children: [formHasErrors && jsxRuntime.exports.jsx("div", { children: jsxRuntime.exports.jsx(Text, __assign({ variant: "textSmall", color: "var(--awell-signalError100)" }, { children: errorLabels.formHasErrors })) }), jsxRuntime.exports.jsx("div", {}), jsxRuntime.exports.jsx(Button, __assign({ onClick: submitForm, type: "submit", "data-cy": "submitFormButton", disabled: isSubmittingForm }, { children: buttonLabels.submit }))] })) }))] });
37677
37703
  };
37678
37704
 
37679
37705
  var WizardForm = ConversationalForm;
@@ -51328,7 +51354,7 @@ Check the top-level render call using <` + t + ">.");
51328
51354
  return jsxRuntime.exports.jsx(Button, __assign({ onClick: uploadFileWidget, disabled: !isLoaded }, { children: text.uploadButton }));
51329
51355
  };
51330
51356
 
51331
- var classes$1 = {"container":"awell__cloudinary_container","awell_cloudinary":"awell__cloudinary_awell_cloudinary","content":"awell__cloudinary_content","message_title":"awell__cloudinary_message_title","attachmentList":"awell__cloudinary_attachmentList","button_wrapper":"awell__cloudinary_button_wrapper"};
51357
+ var classes = {"container":"awell__cloudinary_container","awell_cloudinary":"awell__cloudinary_awell_cloudinary","content":"awell__cloudinary_content","message_title":"awell__cloudinary_message_title","attachmentList":"awell__cloudinary_attachmentList","button_wrapper":"awell__cloudinary_button_wrapper"};
51332
51358
 
51333
51359
  var ActionKey;
51334
51360
  (function (ActionKey) {
@@ -51356,7 +51382,7 @@ Check the top-level render call using <` + t + ">.");
51356
51382
  var handleOnDone = React.useCallback(function () {
51357
51383
  onFinish(uploadedFilesList);
51358
51384
  }, [onFinish, uploadedFilesList]);
51359
- return jsxRuntime.exports.jsxs(jsxRuntime.exports.Fragment, { children: [jsxRuntime.exports.jsx("main", __assign({ id: "ahp_main_content_with_scroll_hint", className: classes$4.main_content }, { children: jsxRuntime.exports.jsxs("section", __assign({ className: "".concat(classes$1.awell_cloudinary, " ").concat(classes$1.container) }, { children: [jsxRuntime.exports.jsx("div", __assign({ className: classes$1.message_title }, { children: text.subject })), jsxRuntime.exports.jsxs("div", __assign({ className: classes$1.content }, { children: [jsxRuntime.exports.jsx("div", __assign({ className: "files" }, { children: jsxRuntime.exports.jsx("p", { children: text.fileCountHeader(uploadedFilesList === null || uploadedFilesList === void 0 ? void 0 : uploadedFilesList.length) }) })), !!attachments.length && jsxRuntime.exports.jsx("div", __assign({ className: classes$1.attachmentList }, { children: jsxRuntime.exports.jsx(AttachmentList, { attachments: attachments, icon: text.attachmentIcon, labels: text.attachmentLabels }) })), jsxRuntime.exports.jsx(CloudinaryUploadWidget, { cloudName: cloudName, uploadPreset: uploadPreset, folder: folder, tags: tags, context: context, onFileUpload: onImageUploadHandler, text: { uploadButton: text.buttonLabels.upload } })] }))] })) })), jsxRuntime.exports.jsx(HostedPageFooter, __assign({ showScrollHint: showScrollHint }, { children: jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes$1.button_wrapper, " ").concat(classes$1.container) }, { children: jsxRuntime.exports.jsx(Button, __assign({ "data-cy": "finishUpload", variant: "secondary", onClick: handleOnDone }, { children: text.buttonLabels.done })) })) }))] });
51385
+ return jsxRuntime.exports.jsxs(jsxRuntime.exports.Fragment, { children: [jsxRuntime.exports.jsx("main", __assign({ id: "ahp_main_content_with_scroll_hint", className: layoutClasses.main_content }, { children: jsxRuntime.exports.jsxs("section", __assign({ className: "".concat(classes.awell_cloudinary, " ").concat(classes.container) }, { children: [jsxRuntime.exports.jsx("div", __assign({ className: classes.message_title }, { children: text.subject })), jsxRuntime.exports.jsxs("div", __assign({ className: classes.content }, { children: [jsxRuntime.exports.jsx("div", __assign({ className: "files" }, { children: jsxRuntime.exports.jsx("p", { children: text.fileCountHeader(uploadedFilesList === null || uploadedFilesList === void 0 ? void 0 : uploadedFilesList.length) }) })), !!attachments.length && jsxRuntime.exports.jsx("div", __assign({ className: classes.attachmentList }, { children: jsxRuntime.exports.jsx(AttachmentList, { attachments: attachments, icon: text.attachmentIcon, labels: text.attachmentLabels }) })), jsxRuntime.exports.jsx(CloudinaryUploadWidget, { cloudName: cloudName, uploadPreset: uploadPreset, folder: folder, tags: tags, context: context, onFileUpload: onImageUploadHandler, text: { uploadButton: text.buttonLabels.upload } })] }))] })) })), jsxRuntime.exports.jsx(HostedPageFooter, __assign({ showScrollHint: showScrollHint }, { children: jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes.button_wrapper, " ").concat(classes.container) }, { children: jsxRuntime.exports.jsx(Button, __assign({ "data-cy": "finishUpload", variant: "secondary", onClick: handleOnDone }, { children: text.buttonLabels.done })) })) }))] });
51360
51386
  };
51361
51387
  CloudinaryUpload.displayName = 'Cloudinary';
51362
51388
 
@@ -51378,23 +51404,10 @@ Check the top-level render call using <` + t + ">.");
51378
51404
  var handleOnDone = React.useCallback(function () {
51379
51405
  onFinish(uploadedFile);
51380
51406
  }, [onFinish, uploadedFile]);
51381
- return jsxRuntime.exports.jsxs(jsxRuntime.exports.Fragment, { children: [jsxRuntime.exports.jsx("main", __assign({ id: "ahp_main_content_with_scroll_hint", className: classes$4.main_content }, { children: jsxRuntime.exports.jsxs("section", __assign({ className: "".concat(classes$1.awell_cloudinary, " ").concat(classes$1.container) }, { children: [jsxRuntime.exports.jsx("div", __assign({ className: classes$1.message_title }, { children: text.subject })), jsxRuntime.exports.jsxs("div", __assign({ className: classes$1.content }, { children: [jsxRuntime.exports.jsx("div", __assign({ className: "files" }, { children: jsxRuntime.exports.jsx("p", { children: text.fileCountHeader(uploadedFile !== undefined) }) })), uploadedFile && jsxRuntime.exports.jsx("div", __assign({ className: classes$1.attachmentList }, { children: jsxRuntime.exports.jsx(AttachmentList, { attachments: attachments, icon: text.attachmentIcon, labels: text.attachmentLabels }) })), !uploadedFile && jsxRuntime.exports.jsx(CloudinaryUploadWidget, { cloudName: cloudName, uploadPreset: uploadPreset, multiple: false, folder: folder, tags: tags, context: context, onFileUpload: onImageUploadHandler, text: { uploadButton: text.buttonLabels.upload } })] }))] })) })), jsxRuntime.exports.jsx(HostedPageFooter, __assign({ showScrollHint: showScrollHint }, { children: jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes$1.button_wrapper, " ").concat(classes$1.container) }, { children: jsxRuntime.exports.jsx(Button, __assign({ "data-cy": "finishUpload", variant: "secondary", onClick: handleOnDone }, { children: text.buttonLabels.done })) })) }))] });
51407
+ return jsxRuntime.exports.jsxs(jsxRuntime.exports.Fragment, { children: [jsxRuntime.exports.jsx("main", __assign({ id: "ahp_main_content_with_scroll_hint", className: layoutClasses.main_content }, { children: jsxRuntime.exports.jsxs("section", __assign({ className: "".concat(classes.awell_cloudinary, " ").concat(classes.container) }, { children: [jsxRuntime.exports.jsx("div", __assign({ className: classes.message_title }, { children: text.subject })), jsxRuntime.exports.jsxs("div", __assign({ className: classes.content }, { children: [jsxRuntime.exports.jsx("div", __assign({ className: "files" }, { children: jsxRuntime.exports.jsx("p", { children: text.fileCountHeader(uploadedFile !== undefined) }) })), uploadedFile && jsxRuntime.exports.jsx("div", __assign({ className: classes.attachmentList }, { children: jsxRuntime.exports.jsx(AttachmentList, { attachments: attachments, icon: text.attachmentIcon, labels: text.attachmentLabels }) })), !uploadedFile && jsxRuntime.exports.jsx(CloudinaryUploadWidget, { cloudName: cloudName, uploadPreset: uploadPreset, multiple: false, folder: folder, tags: tags, context: context, onFileUpload: onImageUploadHandler, text: { uploadButton: text.buttonLabels.upload } })] }))] })) })), jsxRuntime.exports.jsx(HostedPageFooter, __assign({ showScrollHint: showScrollHint }, { children: jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes.button_wrapper, " ").concat(classes.container) }, { children: jsxRuntime.exports.jsx(Button, __assign({ "data-cy": "finishUpload", variant: "secondary", onClick: handleOnDone }, { children: text.buttonLabels.done })) })) }))] });
51382
51408
  };
51383
51409
  CloudinarySingleFileUpload.displayName = 'CloudinarySingleFileUpload';
51384
51410
 
51385
- var classes = {"close_button":"awell__CloseButton_close_button","close_button_svg":"awell__CloseButton_close_button_svg"};
51386
-
51387
- var CloseButton = function (_a) {
51388
- var onClose = _a.onClose;
51389
- return jsxRuntime.exports.jsx("button", __assign({ type: "button", onClick: onClose, className: classes.close_button, id: "awell_close_button" }, { children: jsxRuntime.exports.jsx("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: "currentColor", className: classes.close_button_svg }, { children: jsxRuntime.exports.jsx("path", { d: "M6.28 5.22a.75.75 0 00-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 101.06 1.06L10 11.06l3.72 3.72a.75.75 0 101.06-1.06L11.06 10l3.72-3.72a.75.75 0 00-1.06-1.06L10 8.94 6.28 5.22z" }) })) }));
51390
- };
51391
-
51392
- var HostedPageLayout = function (_a) {
51393
- var children = _a.children,onCloseHostedPage = _a.onCloseHostedPage,logo = _a.logo,_b = _a.hideCloseButton,hideCloseButton = _b === void 0 ? false : _b;
51394
- var layoutMode = useTheme().layoutMode;
51395
- return jsxRuntime.exports.jsxs("div", __assign({ className: "".concat(classes$4.layout_container, " ").concat(classes$4[layoutMode], " ").concat(logo ? '' : classes$4.withoutLogo) }, { children: [!hideCloseButton && jsxRuntime.exports.jsx(CloseButton, { onClose: onCloseHostedPage }), logo && jsxRuntime.exports.jsx("header", { children: jsxRuntime.exports.jsx(Navbar, { logo: logo }) }), children] }));
51396
- };
51397
-
51398
51411
  exports.AttachmentList = AttachmentList;
51399
51412
  exports.Button = Button;
51400
51413
  exports.CalDotComScheduling = CalDotComScheduling;
@@ -7,3 +7,4 @@ export { CloudinaryUpload } from './activities/cloudinary';
7
7
  export { CloudinarySingleFileUpload } from './activities/cloudinary';
8
8
  export { HostedPageLayout } from './layouts/HostedPageLayout';
9
9
  export { CloseButton } from './layouts/HostedPageLayout';
10
+ export { LoadActivityPlaceholder } from './layouts/HostedPageLayout/LoadActivityPlaceholder';
@@ -0,0 +1,2 @@
1
+ import { FC } from 'react';
2
+ export declare const LoadActivityPlaceholder: FC;
@@ -0,0 +1 @@
1
+ export { LoadActivityPlaceholder } from './LoadActivityPlaceholder';
@@ -1,2 +1,4 @@
1
1
  export { HostedPageLayout } from './HostedPageLayout';
2
2
  export { CloseButton } from './CloseButton';
3
+ export { LoadActivityPlaceholder } from './LoadActivityPlaceholder';
4
+ export { HostedPageFooter } from './HostedPageFooter';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@awell-health/ui-library",
3
- "version": "0.1.49",
3
+ "version": "0.1.51",
4
4
  "private": false,
5
5
  "description": "UI components to integrate with Awell Health",
6
6
  "repository": {