@nylas/web-elements 0.0.0-test-20250319204140 → 0.0.0-test-20250320184617

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.
Files changed (172) hide show
  1. package/dist/cdn/nylas-scheduler-editor/nylas-scheduler-editor.es.js +26 -26
  2. package/dist/cdn/nylas-scheduling/nylas-scheduling.es.js +4813 -4805
  3. package/dist/cjs/button-component_2.cjs.entry.js +1 -1
  4. package/dist/cjs/button-component_2.cjs.entry.js.map +1 -1
  5. package/dist/cjs/calendar-agenda-fill-icon_36.cjs.entry.js +17 -18
  6. package/dist/cjs/calendar-agenda-fill-icon_36.cjs.entry.js.map +1 -1
  7. package/dist/cjs/chevron-icon_3.cjs.entry.js +1 -1
  8. package/dist/cjs/chevron-icon_3.cjs.entry.js.map +1 -1
  9. package/dist/cjs/google-logo-icon_6.cjs.entry.js +5 -5
  10. package/dist/cjs/google-logo-icon_6.cjs.entry.js.map +1 -1
  11. package/dist/cjs/input-dropdown_2.cjs.entry.js +2 -2
  12. package/dist/cjs/input-dropdown_2.cjs.entry.js.map +1 -1
  13. package/dist/cjs/loader.cjs.js +1 -1
  14. package/dist/cjs/multi-select-dropdown_2.cjs.entry.js +2 -2
  15. package/dist/cjs/multi-select-dropdown_2.cjs.entry.js.map +1 -1
  16. package/dist/cjs/nylas-booked-event-card_12.cjs.entry.js +14 -10
  17. package/dist/cjs/nylas-booked-event-card_12.cjs.entry.js.map +1 -1
  18. package/dist/cjs/nylas-key-points.cjs.entry.js +1 -1
  19. package/dist/cjs/nylas-key-points.cjs.entry.js.map +1 -1
  20. package/dist/cjs/nylas-provider.cjs.entry.js +1 -1
  21. package/dist/cjs/nylas-provider.cjs.entry.js.map +1 -1
  22. package/dist/cjs/nylas-scheduling.cjs.entry.js +1 -1
  23. package/dist/cjs/nylas-scheduling.cjs.entry.js.map +1 -1
  24. package/dist/cjs/nylas-web-elements.cjs.js +1 -1
  25. package/dist/cjs/{scheduler-store-c1fc5cf3.js → scheduler-store-df3a9a3a.js} +9 -1
  26. package/dist/cjs/scheduler-store-df3a9a3a.js.map +1 -0
  27. package/dist/collection/components/design-system/button-component/button-component.js +4 -3
  28. package/dist/collection/components/design-system/button-component/button-component.js.map +1 -1
  29. package/dist/collection/components/design-system/input-dropdown/input-dropdown.js +10 -7
  30. package/dist/collection/components/design-system/input-dropdown/input-dropdown.js.map +1 -1
  31. package/dist/collection/components/design-system/multi-select-dropdown/multi-select-dropdown.js +5 -4
  32. package/dist/collection/components/design-system/multi-select-dropdown/multi-select-dropdown.js.map +1 -1
  33. package/dist/collection/components/design-system/select-dropdown/select-dropdown.js +13 -9
  34. package/dist/collection/components/design-system/select-dropdown/select-dropdown.js.map +1 -1
  35. package/dist/collection/components/design-system/time-period-selector/time-period-selector.js +3 -3
  36. package/dist/collection/components/design-system/time-period-selector/time-period-selector.js.map +1 -1
  37. package/dist/collection/components/nylas-notebook/nylas-key-points/nylas-key-points.js +4 -3
  38. package/dist/collection/components/nylas-notebook/nylas-key-points/nylas-key-points.js.map +1 -1
  39. package/dist/collection/components/nylas-provider/nylas-provider.js +1 -1
  40. package/dist/collection/components/scheduler/nylas-booked-event-card/nylas-booked-event-card.js +13 -11
  41. package/dist/collection/components/scheduler/nylas-booked-event-card/nylas-booked-event-card.js.map +1 -1
  42. package/dist/collection/components/scheduler/nylas-booking-form/nylas-booking-form.js +3 -3
  43. package/dist/collection/components/scheduler/nylas-booking-form/nylas-booking-form.js.map +1 -1
  44. package/dist/collection/components/scheduler/nylas-booking-form/test/nylas-booking-form.spec.js +8 -6
  45. package/dist/collection/components/scheduler/nylas-booking-form/test/nylas-booking-form.spec.js.map +1 -1
  46. package/dist/collection/components/scheduler/nylas-organizer-confirmation-card/nylas-organizer-confirmation-card.js +8 -10
  47. package/dist/collection/components/scheduler/nylas-organizer-confirmation-card/nylas-organizer-confirmation-card.js.map +1 -1
  48. package/dist/collection/components/scheduler/nylas-scheduling/nylas-scheduling.js +2 -2
  49. package/dist/collection/components/scheduler/nylas-scheduling/nylas-scheduling.js.map +1 -1
  50. package/dist/collection/components/scheduler-editor/nylas-buffer-time/nylas-buffer-time.js +2 -2
  51. package/dist/collection/components/scheduler-editor/nylas-buffer-time/nylas-buffer-time.js.map +1 -1
  52. package/dist/collection/components/scheduler-editor/nylas-editor-tabs-group/nylas-editor-tabs-group.js +36 -21
  53. package/dist/collection/components/scheduler-editor/nylas-editor-tabs-group/nylas-editor-tabs-group.js.map +1 -1
  54. package/dist/collection/components/scheduler-editor/nylas-event-duration/nylas-event-duration.js +15 -16
  55. package/dist/collection/components/scheduler-editor/nylas-event-duration/nylas-event-duration.js.map +1 -1
  56. package/dist/collection/connector/nylas-scheduler-connector/errors/index.js +1 -29
  57. package/dist/collection/connector/nylas-scheduler-connector/errors/index.js.map +1 -1
  58. package/dist/collection/connector/shared/api/auth.js.map +1 -1
  59. package/dist/collection/connector/shared/api/scheduler.js.map +1 -1
  60. package/dist/collection/types/index.js +29 -0
  61. package/dist/collection/types/index.js.map +1 -1
  62. package/dist/components/button-component2.js +1 -1
  63. package/dist/components/button-component2.js.map +1 -1
  64. package/dist/components/input-dropdown2.js +1 -1
  65. package/dist/components/input-dropdown2.js.map +1 -1
  66. package/dist/components/multi-select-dropdown2.js +2 -2
  67. package/dist/components/multi-select-dropdown2.js.map +1 -1
  68. package/dist/components/nylas-booked-event-card2.js +9 -5
  69. package/dist/components/nylas-booked-event-card2.js.map +1 -1
  70. package/dist/components/nylas-booking-form2.js +3 -3
  71. package/dist/components/nylas-booking-form2.js.map +1 -1
  72. package/dist/components/nylas-buffer-time2.js +2 -2
  73. package/dist/components/nylas-buffer-time2.js.map +1 -1
  74. package/dist/components/nylas-editor-tabs-group2.js +5 -5
  75. package/dist/components/nylas-editor-tabs-group2.js.map +1 -1
  76. package/dist/components/nylas-event-duration2.js +15 -16
  77. package/dist/components/nylas-event-duration2.js.map +1 -1
  78. package/dist/components/nylas-key-points.js +1 -1
  79. package/dist/components/nylas-key-points.js.map +1 -1
  80. package/dist/components/nylas-organizer-confirmation-card2.js +4 -4
  81. package/dist/components/nylas-organizer-confirmation-card2.js.map +1 -1
  82. package/dist/components/nylas-provider.js.map +1 -1
  83. package/dist/components/nylas-scheduling.js.map +1 -1
  84. package/dist/components/scheduler-store.js +8 -0
  85. package/dist/components/scheduler-store.js.map +1 -1
  86. package/dist/components/select-dropdown2.js +1 -1
  87. package/dist/components/select-dropdown2.js.map +1 -1
  88. package/dist/components/time-period-selector2.js +1 -1
  89. package/dist/components/time-period-selector2.js.map +1 -1
  90. package/dist/esm/button-component_2.entry.js +1 -1
  91. package/dist/esm/button-component_2.entry.js.map +1 -1
  92. package/dist/esm/calendar-agenda-fill-icon_36.entry.js +17 -18
  93. package/dist/esm/calendar-agenda-fill-icon_36.entry.js.map +1 -1
  94. package/dist/esm/chevron-icon_3.entry.js +1 -1
  95. package/dist/esm/chevron-icon_3.entry.js.map +1 -1
  96. package/dist/esm/google-logo-icon_6.entry.js +5 -5
  97. package/dist/esm/google-logo-icon_6.entry.js.map +1 -1
  98. package/dist/esm/input-dropdown_2.entry.js +2 -2
  99. package/dist/esm/input-dropdown_2.entry.js.map +1 -1
  100. package/dist/esm/loader.js +1 -1
  101. package/dist/esm/multi-select-dropdown_2.entry.js +2 -2
  102. package/dist/esm/multi-select-dropdown_2.entry.js.map +1 -1
  103. package/dist/esm/nylas-booked-event-card_12.entry.js +14 -10
  104. package/dist/esm/nylas-booked-event-card_12.entry.js.map +1 -1
  105. package/dist/esm/nylas-key-points.entry.js +1 -1
  106. package/dist/esm/nylas-key-points.entry.js.map +1 -1
  107. package/dist/esm/nylas-provider.entry.js +1 -1
  108. package/dist/esm/nylas-provider.entry.js.map +1 -1
  109. package/dist/esm/nylas-scheduling.entry.js +1 -1
  110. package/dist/esm/nylas-scheduling.entry.js.map +1 -1
  111. package/dist/esm/nylas-web-elements.js +1 -1
  112. package/dist/esm/{scheduler-store-bbb4cf8d.js → scheduler-store-ef022be9.js} +9 -1
  113. package/dist/esm/scheduler-store-ef022be9.js.map +1 -0
  114. package/dist/nylas-web-elements/nylas-web-elements.esm.js +1 -1
  115. package/dist/nylas-web-elements/nylas-web-elements.esm.js.map +1 -1
  116. package/dist/nylas-web-elements/{p-c3cfe486.entry.js → p-09bbd467.entry.js} +2 -2
  117. package/dist/nylas-web-elements/p-09bbd467.entry.js.map +1 -0
  118. package/dist/nylas-web-elements/{p-6371e0a3.entry.js → p-0d80f50b.entry.js} +2 -2
  119. package/dist/nylas-web-elements/p-0d80f50b.entry.js.map +1 -0
  120. package/dist/nylas-web-elements/p-13a6c977.entry.js +2 -0
  121. package/dist/nylas-web-elements/p-13a6c977.entry.js.map +1 -0
  122. package/dist/nylas-web-elements/{p-14569ed8.entry.js → p-1fb32e0e.entry.js} +2 -2
  123. package/dist/nylas-web-elements/p-1fb32e0e.entry.js.map +1 -0
  124. package/dist/nylas-web-elements/{p-19f6fcf8.entry.js → p-3ca36162.entry.js} +2 -2
  125. package/dist/nylas-web-elements/p-3ca36162.entry.js.map +1 -0
  126. package/dist/nylas-web-elements/{p-78bd1f85.entry.js → p-51434e4a.entry.js} +2 -2
  127. package/dist/nylas-web-elements/p-51434e4a.entry.js.map +1 -0
  128. package/dist/nylas-web-elements/p-731a856b.js +2 -0
  129. package/dist/nylas-web-elements/p-731a856b.js.map +1 -0
  130. package/dist/nylas-web-elements/p-7b787c73.entry.js +8 -0
  131. package/dist/nylas-web-elements/p-7b787c73.entry.js.map +1 -0
  132. package/dist/nylas-web-elements/{p-f7ea608d.entry.js → p-a906d005.entry.js} +2 -2
  133. package/dist/nylas-web-elements/p-a906d005.entry.js.map +1 -0
  134. package/dist/nylas-web-elements/p-ab3ba8dc.entry.js +2 -0
  135. package/dist/nylas-web-elements/p-ab3ba8dc.entry.js.map +1 -0
  136. package/dist/nylas-web-elements/{p-91bc630c.entry.js → p-b1c57792.entry.js} +2 -2
  137. package/dist/nylas-web-elements/p-b1c57792.entry.js.map +1 -0
  138. package/dist/types/components/design-system/button-component/button-component.d.ts +1 -2
  139. package/dist/types/components/design-system/input-dropdown/input-dropdown.d.ts +1 -6
  140. package/dist/types/components/design-system/multi-select-dropdown/multi-select-dropdown.d.ts +1 -7
  141. package/dist/types/components/design-system/select-dropdown/select-dropdown.d.ts +1 -6
  142. package/dist/types/components/design-system/time-period-selector/time-period-selector.d.ts +1 -1
  143. package/dist/types/components/nylas-notebook/nylas-key-points/nylas-key-points.d.ts +1 -6
  144. package/dist/types/components/scheduler/nylas-booked-event-card/nylas-booked-event-card.d.ts +2 -1
  145. package/dist/types/components/scheduler/nylas-booking-form/nylas-booking-form.d.ts +1 -1
  146. package/dist/types/components/scheduler/nylas-organizer-confirmation-card/nylas-organizer-confirmation-card.d.ts +1 -1
  147. package/dist/types/components/scheduler-editor/nylas-editor-tabs-group/nylas-editor-tabs-group.d.ts +17 -16
  148. package/dist/types/components/scheduler-editor/nylas-event-duration/nylas-event-duration.d.ts +2 -2
  149. package/dist/types/components.d.ts +17 -17
  150. package/dist/types/connector/nylas-connector/index.d.ts +1 -1
  151. package/dist/types/connector/nylas-scheduler-connector/errors/index.d.ts +1 -31
  152. package/dist/types/connector/shared/api/auth.d.ts +1 -1
  153. package/dist/types/connector/shared/api/scheduler.d.ts +1 -1
  154. package/dist/types/types/index.d.ts +36 -0
  155. package/package.json +2 -2
  156. package/dist/cjs/scheduler-store-c1fc5cf3.js.map +0 -1
  157. package/dist/esm/scheduler-store-bbb4cf8d.js.map +0 -1
  158. package/dist/nylas-web-elements/p-14569ed8.entry.js.map +0 -1
  159. package/dist/nylas-web-elements/p-19f6fcf8.entry.js.map +0 -1
  160. package/dist/nylas-web-elements/p-463d9c42.entry.js +0 -8
  161. package/dist/nylas-web-elements/p-463d9c42.entry.js.map +0 -1
  162. package/dist/nylas-web-elements/p-6371e0a3.entry.js.map +0 -1
  163. package/dist/nylas-web-elements/p-78bd1f85.entry.js.map +0 -1
  164. package/dist/nylas-web-elements/p-91bc630c.entry.js.map +0 -1
  165. package/dist/nylas-web-elements/p-ac757a7b.entry.js +0 -2
  166. package/dist/nylas-web-elements/p-ac757a7b.entry.js.map +0 -1
  167. package/dist/nylas-web-elements/p-b0f18064.entry.js +0 -2
  168. package/dist/nylas-web-elements/p-b0f18064.entry.js.map +0 -1
  169. package/dist/nylas-web-elements/p-c3cfe486.entry.js.map +0 -1
  170. package/dist/nylas-web-elements/p-f0c25e38.js +0 -2
  171. package/dist/nylas-web-elements/p-f0c25e38.js.map +0 -1
  172. package/dist/nylas-web-elements/p-f7ea608d.entry.js.map +0 -1
@@ -1 +1 @@
1
- {"file":"multi-select-dropdown.nylas-date-component.entry.js","mappings":"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","names":[],"sources":["src/components/design-system/multi-select-dropdown/multi-select-dropdown.scss?tag=multi-select-dropdown&encapsulation=shadow","src/components/design-system/multi-select-dropdown/multi-select-dropdown.tsx","src/components/design-system/nylas-date-component/nylas-date-component.scss?tag=nylas-date-component&encapsulation=shadow","src/components/design-system/nylas-date-component/nylas-date-component.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n display: block;\n width: inherit;\n @include default-css-variables;\n}\n\n.dropdown {\n display: inline-block;\n width: 100%;\n position: relative;\n\n .dropdown-label {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n color: var(--nylas-base-800);\n\n p {\n margin: 0;\n }\n\n span.required {\n color: var(--nylas-error);\n padding: 0 0.25rem;\n }\n }\n\n span.error {\n color: var(--nylas-error);\n font-size: 14px;\n }\n}\n\n.dropbtn {\n width: inherit;\n height: 48px;\n color: var(--nylas-base-900);\n padding: 0.5rem;\n font-size: 16px;\n cursor: pointer;\n display: flex;\n gap: 0.5rem;\n justify-content: space-between;\n align-items: center;\n background: transparent;\n border: 1px solid var(--nylas-base-200);\n border-radius: var(--nylas-border-radius-2x);\n\n &.focus {\n background: transparent;\n }\n\n &.error {\n border: 1px solid var(--nylas-error);\n }\n\n &:hover,\n &:active {\n border: 1px solid var(--nylas-primary);\n }\n\n &:active {\n outline: 2px solid var(--nylas-primary);\n }\n\n &:disabled {\n cursor: not-allowed;\n background: var(--nylas-base-100);\n }\n\n span {\n &.open {\n transform: rotate(90deg);\n }\n\n &.closed {\n transform: rotate(270deg);\n }\n }\n}\n\n.dropdown-content {\n display: block;\n margin-top: 0.5rem;\n background-color: var(--nylas-base-0);\n width: 100%;\n max-height: 336px;\n overflow: auto;\n z-index: 1;\n border-radius: 4px;\n position: absolute;\n top: calc(48px + 24px);\n box-shadow: 0px 4px 6px -2px #0000000d;\n box-shadow: 0px 10px 15px -3px #0000001a;\n}\n\n.dropdown-content ul {\n padding: 0;\n list-style-type: none;\n color: var(--nylas-base-900);\n max-height: 336px;\n\n li {\n padding: 16px, 12px, 16px, 12px;\n color: var(--nylas-base-900);\n padding: 12px 16px;\n text-decoration: none;\n display: block;\n font-family: inherit;\n font-size: 14px;\n font-weight: 400;\n line-height: 20px;\n letter-spacing: 0px;\n text-align: left;\n cursor: pointer;\n\n &:hover,\n &:focus {\n background-color: var(--nylas-base-100);\n }\n\n label {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n\n input {\n margin: 0;\n }\n }\n\n &.disabled {\n cursor: not-allowed;\n opacity: 0.5;\n\n label {\n cursor: not-allowed;\n\n input {\n cursor: not-allowed;\n }\n }\n }\n }\n}\n\n.selected-options {\n display: flex;\n flex-wrap: wrap;\n gap: 0.5rem;\n padding: 0.5rem 0;\n margin-top: 0.25rem;\n background: var(--nylas-base-0);\n\n .selected-option {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n padding: 4px 8px;\n border-radius: var(--nylas-border-radius-2x);\n background: var(--nylas-base-100);\n color: var(--nylas-base-800);\n font-size: 16px;\n font-weight: 500;\n line-height: 1.5rem;\n letter-spacing: 0.5px;\n\n button {\n background: transparent;\n border: none;\n cursor: pointer;\n padding: 0;\n\n &:hover {\n color: var(--nylas-primary);\n }\n\n &:disabled {\n cursor: not-allowed;\n background: var(--nylas-base-100);\n }\n }\n }\n}\n","import { debug } from '@/utils/utils';\nimport { Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h } from '@stencil/core';\n\ninterface DropdownOption {\n label: string;\n value: string;\n selected?: boolean; // Add a selected flag to each option\n disabled?: boolean; // Add a disabled flag to each option\n}\n\n@Component({\n tag: 'multi-select-dropdown',\n styleUrl: 'multi-select-dropdown.scss',\n shadow: true,\n})\nexport class MultiSelectDropdown {\n @Element() el!: HTMLElement;\n\n // Props\n /**\n * The name of the dropdown\n */\n @Prop() name!: string;\n\n /**\n * The label of the dropdown\n */\n @Prop() label?: string;\n\n /**\n * The options to display in the dropdown\n */\n @Prop() options: DropdownOption[] = [];\n\n /**\n * Error message to display\n */\n @Prop({ mutable: true }) error?: string = '';\n\n /**\n * The option to require selection of at leat one option.\n */\n @Prop() required?: boolean = false;\n\n /**\n * The property to make the multi-select dropdown read-only. If true, the dropdown cannot be edited.\n */\n @Prop() readOnly?: boolean = false;\n\n /**\n * Multiple options selected label\n */\n @Prop() multipleOptionsSelectedLabel?: string = 'Multiple options selected';\n\n /**\n * Select at least one option label\n */\n @Prop() selectAtLeastOneOptionLabel?: string = 'Please select at least one option';\n\n // States\n /**\n * The copy of the options to display in the dropdown\n */\n @State() availableOptions: DropdownOption[] = this.options;\n /**\n * The open state of the dropdown\n */\n @State() isOpen: boolean = false;\n /**\n * The aria-activedescendant attribute for the listbox element to indicate the currently active\n */\n @State() ariaActivedescendant: string = '';\n\n /**\n * This flag is used to focus the first option when the dropdown is opened\n * and reset after the first option is focused\n */\n @State() shouldFocusFirstOption: boolean = false;\n\n // Events\n /**\n * This event is fired when the selected options are changed\n */\n @Event({ bubbles: true, composed: true }) selectedOptionsChanged!: EventEmitter<{\n value: string[];\n name: string;\n }>;\n\n areOptionsEqual(arr1: DropdownOption[], arr2: DropdownOption[]): boolean {\n if (arr1.length !== arr2.length) return false;\n\n // Sort both arrays by a consistent key (e.g., label and value)\n const sorted1 = [...arr1].sort((a, b) => a.label.localeCompare(b.label) || a.value.localeCompare(b.value));\n const sorted2 = [...arr2].sort((a, b) => a.label.localeCompare(b.label) || a.value.localeCompare(b.value));\n\n // Compare each object in the sorted arrays\n return sorted1.every((opt1, index) => {\n const opt2 = sorted2[index];\n return opt1.label === opt2.label && opt1.value === opt2.value;\n });\n }\n\n @Watch('options')\n optionsChangedHandler(newValue: DropdownOption[]) {\n if (!this.areOptionsEqual(newValue, this.availableOptions)) {\n this.availableOptions = newValue;\n }\n }\n\n // Lifecycle methods\n componentDidLoad() {\n debug('multi-select-dropdown', 'componentDidLoad');\n if (this.options) {\n this.availableOptions = this.options;\n }\n }\n\n componentDidRender() {\n debug('multi-select-dropdown', 'componentDidRender');\n if (this.isOpen && this.shouldFocusFirstOption) {\n // The dropdown is open and we should focus the first option\n this.ariaActivedescendant = this.availableOptions[0]?.value;\n this.focusOption(0);\n // Reset the flag\n this.shouldFocusFirstOption = false;\n }\n }\n\n // Event listeners\n @Listen('click', { target: 'document', capture: true })\n handleOutsideClick(event: MouseEvent) {\n // Get the path of the event\n const path = event.composedPath();\n\n // Check if the path includes the host element\n const isClickInside = path.includes(this.el);\n\n if (!isClickInside && this.isOpen) {\n this.isOpen = false;\n }\n }\n\n @Listen('bookingFormSubmitted', { target: 'document' })\n handleBookingFormSubmitted(event: CustomEvent) {\n const selectedOptions = this.availableOptions.filter(o => o.selected).map(o => o.value);\n if (this.required && (!selectedOptions || selectedOptions.length <= 0)) {\n this.error = 'Please select at least one option';\n }\n if (this.error) {\n event.preventDefault();\n }\n }\n\n // Methods\n\n selectOption(option: DropdownOption): void {\n this.availableOptions = this.availableOptions.map(o => {\n if (o.value === option.value) {\n o.selected = option.selected ? false : true;\n if (o.selected) {\n this.error = '';\n }\n }\n return o;\n });\n const selectedOptions = this.availableOptions.filter(o => o.selected).map(o => o.value);\n this.selectedOptionsChanged.emit({\n value: selectedOptions,\n name: this.name,\n });\n }\n\n toggleDropdown(): void {\n this.isOpen = !this.isOpen;\n if (this.isOpen) {\n this.shouldFocusFirstOption = true;\n } else {\n this.ariaActivedescendant = '';\n }\n }\n\n handleSelectButtonKeyDown(event: KeyboardEvent): void {\n switch (event.key) {\n case 'ArrowDown':\n case 'Enter':\n event.preventDefault();\n if (!this.isOpen) {\n this.toggleDropdown();\n }\n break;\n case 'Escape':\n this.isOpen = false;\n break;\n }\n }\n\n handleListboxKeydown(e: KeyboardEvent) {\n const items = this.availableOptions;\n const currentIndex = items.findIndex(item => item.value === this.ariaActivedescendant);\n\n switch (e.key) {\n case 'ArrowDown':\n case 'Tab': {\n if (!e.shiftKey) {\n e.preventDefault();\n const nextIndex = currentIndex + 1 < items.length ? currentIndex + 1 : 0;\n this.ariaActivedescendant = items[nextIndex].value;\n this.focusOption(nextIndex);\n } else {\n e.preventDefault();\n const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;\n this.ariaActivedescendant = items[prevIndex].value;\n this.focusOption(prevIndex);\n }\n break;\n }\n case 'ArrowUp': {\n e.preventDefault();\n const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;\n this.ariaActivedescendant = items[prevIndex].value;\n this.focusOption(prevIndex);\n break;\n }\n case 'Enter': {\n e.preventDefault();\n if (this.ariaActivedescendant) {\n this.selectOption(items[currentIndex]);\n }\n break;\n }\n case 'Escape': {\n this.isOpen = false;\n break;\n }\n }\n }\n\n focusOption(index: number) {\n const option = this.availableOptions[index];\n if (!option) return; // Guard clause in case index is out of bounds\n\n const elementId = option.value;\n const element = this.el.shadowRoot?.getElementById(elementId) as HTMLLIElement;\n\n if (element) {\n element.focus(); // Set focus on the element\n element.scrollIntoView({ behavior: 'smooth', block: 'nearest' });\n }\n }\n\n getSelectedOptions() {\n return this.availableOptions.filter(option => option.selected);\n }\n\n renderOption(option: DropdownOption) {\n return (\n <li\n key={option.value}\n id={option.value}\n role=\"option\"\n tabindex=\"0\"\n aria-selected={option.selected ? 'true' : 'false'}\n onClick={e => {\n e.stopImmediatePropagation();\n if (!option?.disabled) {\n this.selectOption(option);\n }\n }}\n class={{ selected: !!option.selected, disabled: !!option.disabled }}\n >\n <label htmlFor={option.value}>\n <input aria-hidden=\"true\" id={option.value} type=\"checkbox\" checked={option.selected} disabled={!!option?.disabled} />\n <span>{option.label}</span>\n </label>\n </li>\n );\n }\n\n render() {\n return (\n <Host>\n <div class=\"dropdown\" part=\"msd_dropdown\">\n <label class=\"dropdown-label\" part=\"msd_dropdown-label\">\n <p>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\">*</span>}\n </p>\n <slot name=\"label-icon\" aria-hidden=\"true\"></slot>\n </label>\n <button\n name={this.name}\n part={`msd_dropdown-button ${this.error ? 'msd_dropdown-button--error' : ''}`}\n class={{ dropbtn: true, open: this.isOpen, error: !!this.error }}\n onClick={() => this.toggleDropdown()}\n disabled={this.readOnly}\n title={this.readOnly ? 'read-only field' : undefined}\n aria-haspopup=\"listbox\"\n aria-expanded={this.isOpen ? 'true' : 'false'}\n aria-label={this.name}\n onKeyDown={e => this.handleSelectButtonKeyDown(e)}\n >\n <slot name=\"select-icon\" aria-hidden=\"true\"></slot>\n <span class=\"selected-option\" part=\"msd_dropdown-button-selected-label\">\n {this.getSelectedOptions().length > 1\n ? this.multipleOptionsSelectedLabel\n : this.availableOptions.filter(o => o.selected)[0]?.label ?? this.availableOptions[0]?.label}\n </span>\n <span class={this.isOpen ? 'open' : 'closed'} aria-hidden=\"true\">\n <chevron-icon width=\"16\" height=\"16\" />\n </span>\n </button>\n {this.error ? (\n <span class=\"error\" part=\"msd_dropdown_error\">\n {this.error}\n </span>\n ) : null}\n <div class={'selected-options'}>\n {this.getSelectedOptions().map(option => (\n <span class=\"selected-option\">\n {option.label}\n <button disabled={this.readOnly || !!option?.disabled} key={option.label} onClick={() => this.selectOption(option)}>\n <close-icon />\n </button>\n </span>\n ))}\n </div>\n {this.isOpen ? (\n <div class=\"dropdown-content\" part=\"msd_dropdown-content\">\n <ul\n tabindex=\"-1\"\n role=\"listbox\"\n aria-label={this.name}\n aria-multiselectable={true}\n aria-activedescendant={this.ariaActivedescendant}\n onKeyDown={e => this.handleListboxKeydown(e)}\n >\n {this.availableOptions.map(option => this.renderOption(option))}\n </ul>\n </div>\n ) : null}\n </div>\n </Host>\n );\n }\n}\n","@import '../../../common/styles/variables.scss';\n@import '../../../common/mixins/inputs.scss';\n\n:host {\n display: block;\n height: auto;\n @include default-css-variables;\n width: 100%;\n}\n\nlabel {\n @include input-label;\n flex-direction: column;\n gap: 4px;\n font-family: var(--nylas-font-family);\n font-size: 16px;\n color: var(--nylas-base-800);\n\n p {\n margin: 0;\n }\n\n .error {\n color: var(--nylas-error);\n }\n}\n\n.input_wrapper {\n display: flex;\n align-items: center;\n gap: 1rem;\n}\n\ninput[type='date'] {\n @include textfield;\n width: 100%;\n width: -moz-available;\n width: -webkit-fill-available;\n font-family: var(--nylas-font-family);\n cursor: pointer;\n}\n\ninput:read-only {\n background-color: var(--nylas-base-100);\n cursor: not-allowed;\n}\n","import { Component, h, Prop, State, Event, EventEmitter, Listen, Watch, Element } from '@stencil/core';\nimport { sanitize } from '@/utils/utils';\n\nconst DefaultPlaceholder = {\n date: 'YYYY-MM-DD',\n};\n\n/**\n * The `nylas-date-component` component is a UI component that allows users to input text, email, or phone number values.\n * This component is used in the scheduling form to input text, email and phone number type inputs.\n */\n\n@Component({\n tag: 'nylas-date-component',\n styleUrl: 'nylas-date-component.scss',\n shadow: true,\n})\nexport class NylasDateComponent {\n /**\n * The host element\n */\n @Element() el!: HTMLElement;\n /**\n * The name of the input. This is used to identify the input when submitting a form.\n */\n @Prop() name: string = 'input';\n /**\n * The default value of the input. This is the value that is displayed when the input is rendered.\n */\n @Prop() defaultValue?: string;\n /**\n * The label of the input. This is displayed above the input.\n */\n @Prop() label: string = '';\n\n /**\n * The placeholder of the input. This is displayed when the input is empty.\n */\n @Prop() placeholder: string = DefaultPlaceholder['date'];\n /**\n * Whether the input is required. If true, the input must have a value when submitting a form.\n * Default is false. If the input is required and the value is empty, an error message is displayed.\n */\n @Prop() required: boolean = false;\n /**\n * Whether the input is read-only. If true, the input cannot be edited.\n * Default is false.\n */\n @Prop() readOnly: boolean = false;\n /**\n * Whether the input should be focused when rendered.\n * Default is false. If true, the input is focused when rendered.\n * Use this to set the focus on the first input in a form.\n */\n @Prop() autoFocus: boolean = false;\n /**\n * The pattern to validate the input value. If the value does not match the pattern, an error message is displayed.\n * Default is null. If the pattern is not set, the pattern is determined by the input type for 'email' and 'phone_number'.\n */\n @Prop() pattern?: RegExp;\n /**\n * The maximum length of the input value. If the value is longer than the maximum length, an error message is displayed.\n * Default is 255.\n */\n @Prop() maxLength: number = 255;\n /**\n * The error message to display when the value does not match the pattern.\n * Default is 'Invalid <field> format.' where <field> is the input label.\n */\n @Prop() patternError: string = '';\n\n /**\n * This error message is displayed when the input value is empty and the input is required.\n */\n @Prop() requiredError: string = '';\n\n /**\n * The input value state.\n */\n @State() value!: string;\n /**\n * The error message state.\n */\n @State() error: string = '';\n\n /**\n * State to track the validity of the date input.\n */\n @State() isDateValid: boolean = true;\n\n /**\n * This event is fired when the input value is changed.\n * The scheduling form listens for this event to validate the input value and submit the form.\n * If using outside of the scheduling form, listen for this event to validate the input value\n * and handle the input value change.\n */\n @Event() nylasFormInputChanged!: EventEmitter<{\n value: string;\n name: string;\n label: string;\n type: string;\n error: string;\n }>;\n\n @Event() nylasFormInputFocused!: EventEmitter<{\n value: string;\n name: string;\n }>;\n\n @Event() nylasFormInputBlurred!: EventEmitter<{\n value: string;\n name: string;\n }>;\n\n // Lifecycle methods\n @Watch('defaultValue')\n handleDefaultValueChange(newValue: string) {\n this.value = sanitize(newValue);\n if (this.value) {\n this.validatePattern(this.value);\n }\n }\n\n componentDidLoad() {\n this.value = sanitize(this.defaultValue || '');\n if (this.value) {\n this.validatePattern(this.value);\n }\n }\n\n // Event listeners\n /**\n * Listen for the bookingFormSubmitted event to validate the input value when the form is submitted.\n */\n @Listen('bookingFormSubmitted', { target: 'document' })\n handleBookingFormSubmitted(event: CustomEvent) {\n this.validatePattern(this.value);\n if (this.error) {\n event.preventDefault();\n }\n }\n\n @Listen('formSubmitted', { target: 'document' })\n async handleFormSubmitted(event: CustomEvent) {\n this.validatePattern(this.value);\n if (this.error) {\n event.preventDefault();\n }\n }\n\n // Methods\n handleInput(e: Event) {\n this.error = '';\n const target = e.target as HTMLInputElement;\n this.value = sanitize(target.value);\n this.isDateValid = target.validity.valid;\n this.nylasFormInputChanged.emit({\n value: this.value,\n name: this.name,\n label: this.label,\n error: this.error,\n type: 'date',\n });\n }\n\n handleBlur() {\n this.nylasFormInputBlurred.emit({\n value: this.value,\n name: this.name,\n });\n }\n\n handleFocus() {\n this.nylasFormInputFocused.emit({\n value: this.value,\n name: this.name,\n });\n }\n\n validatePattern(value: string) {\n // Reset error\n this.error = '';\n if (this.required && !this.isDateValid) {\n this.error = 'Please enter a valid date';\n return;\n }\n // Check if the field is required and value is empty\n if (this.required && !value) {\n this.error = this.requiredError || 'This field is required.';\n return;\n }\n // Check if value matches pattern\n if (!this.pattern || (!value && !this.required)) return;\n\n if (this.pattern.test(value)) {\n this.error = '';\n } else {\n this.error = this.patternError || 'Invalid format.';\n }\n }\n\n render() {\n return (\n <label part=\"ic__label\" class={{ error: !!this.error }}>\n {this.label && (\n <p>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\">*</span>}\n </p>\n )}\n <div part=\"ic__input_wrapper\" class=\"input_wrapper\">\n <input\n type=\"date\"\n name={this.name}\n part=\"ic__date\"\n title={this.readOnly ? 'read-only field' : undefined}\n readOnly={this.readOnly}\n autoFocus={this.autoFocus}\n value={this.value}\n maxLength={this.maxLength}\n placeholder={this.placeholder}\n class={{ error: !!this.error }}\n onInput={e => this.handleInput(e)}\n onFocus={() => this.handleFocus()}\n onBlur={() => this.handleBlur()}\n />\n <slot name=\"additional-input\"></slot>\n </div>\n {this.error && <span class=\"error help-text\">{this.error}</span>}\n </label>\n );\n }\n}\n"],"version":3}
1
+ {"file":"multi-select-dropdown.nylas-date-component.entry.js","mappings":"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","names":[],"sources":["src/components/design-system/multi-select-dropdown/multi-select-dropdown.scss?tag=multi-select-dropdown&encapsulation=shadow","src/components/design-system/multi-select-dropdown/multi-select-dropdown.tsx","src/components/design-system/nylas-date-component/nylas-date-component.scss?tag=nylas-date-component&encapsulation=shadow","src/components/design-system/nylas-date-component/nylas-date-component.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n display: block;\n width: inherit;\n @include default-css-variables;\n}\n\n.dropdown {\n display: inline-block;\n width: 100%;\n position: relative;\n\n .dropdown-label {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n color: var(--nylas-base-800);\n\n p {\n margin: 0;\n }\n\n span.required {\n color: var(--nylas-error);\n padding: 0 0.25rem;\n }\n }\n\n span.error {\n color: var(--nylas-error);\n font-size: 14px;\n }\n}\n\n.dropbtn {\n width: inherit;\n height: 48px;\n color: var(--nylas-base-900);\n padding: 0.5rem;\n font-size: 16px;\n cursor: pointer;\n display: flex;\n gap: 0.5rem;\n justify-content: space-between;\n align-items: center;\n background: transparent;\n border: 1px solid var(--nylas-base-200);\n border-radius: var(--nylas-border-radius-2x);\n\n &.focus {\n background: transparent;\n }\n\n &.error {\n border: 1px solid var(--nylas-error);\n }\n\n &:hover,\n &:active {\n border: 1px solid var(--nylas-primary);\n }\n\n &:active {\n outline: 2px solid var(--nylas-primary);\n }\n\n &:disabled {\n cursor: not-allowed;\n background: var(--nylas-base-100);\n }\n\n span {\n &.open {\n transform: rotate(90deg);\n }\n\n &.closed {\n transform: rotate(270deg);\n }\n }\n}\n\n.dropdown-content {\n display: block;\n margin-top: 0.5rem;\n background-color: var(--nylas-base-0);\n width: 100%;\n max-height: 336px;\n overflow: auto;\n z-index: 1;\n border-radius: 4px;\n position: absolute;\n top: calc(48px + 24px);\n box-shadow: 0px 4px 6px -2px #0000000d;\n box-shadow: 0px 10px 15px -3px #0000001a;\n}\n\n.dropdown-content ul {\n padding: 0;\n list-style-type: none;\n color: var(--nylas-base-900);\n max-height: 336px;\n\n li {\n padding: 16px, 12px, 16px, 12px;\n color: var(--nylas-base-900);\n padding: 12px 16px;\n text-decoration: none;\n display: block;\n font-family: inherit;\n font-size: 14px;\n font-weight: 400;\n line-height: 20px;\n letter-spacing: 0px;\n text-align: left;\n cursor: pointer;\n\n &:hover,\n &:focus {\n background-color: var(--nylas-base-100);\n }\n\n label {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n\n input {\n margin: 0;\n }\n }\n\n &.disabled {\n cursor: not-allowed;\n opacity: 0.5;\n\n label {\n cursor: not-allowed;\n\n input {\n cursor: not-allowed;\n }\n }\n }\n }\n}\n\n.selected-options {\n display: flex;\n flex-wrap: wrap;\n gap: 0.5rem;\n padding: 0.5rem 0;\n margin-top: 0.25rem;\n background: var(--nylas-base-0);\n\n .selected-option {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n padding: 4px 8px;\n border-radius: var(--nylas-border-radius-2x);\n background: var(--nylas-base-100);\n color: var(--nylas-base-800);\n font-size: 16px;\n font-weight: 500;\n line-height: 1.5rem;\n letter-spacing: 0.5px;\n\n button {\n background: transparent;\n border: none;\n cursor: pointer;\n padding: 0;\n\n &:hover {\n color: var(--nylas-primary);\n }\n\n &:disabled {\n cursor: not-allowed;\n background: var(--nylas-base-100);\n }\n }\n }\n}\n","import { debug } from '@/utils/utils';\nimport { Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { DropdownOption } from '@nylas/core';\n\n@Component({\n tag: 'multi-select-dropdown',\n styleUrl: 'multi-select-dropdown.scss',\n shadow: true,\n})\nexport class MultiSelectDropdown {\n @Element() el!: HTMLElement;\n\n // Props\n /**\n * The name of the dropdown\n */\n @Prop() name!: string;\n\n /**\n * The label of the dropdown\n */\n @Prop() label?: string;\n\n /**\n * The options to display in the dropdown\n */\n @Prop() options: DropdownOption[] = [];\n\n /**\n * Error message to display\n */\n @Prop({ mutable: true }) error?: string = '';\n\n /**\n * The option to require selection of at leat one option.\n */\n @Prop() required?: boolean = false;\n\n /**\n * The property to make the multi-select dropdown read-only. If true, the dropdown cannot be edited.\n */\n @Prop() readOnly?: boolean = false;\n\n /**\n * Multiple options selected label\n */\n @Prop() multipleOptionsSelectedLabel?: string = 'Multiple options selected';\n\n /**\n * Select at least one option label\n */\n @Prop() selectAtLeastOneOptionLabel?: string = 'Please select at least one option';\n\n // States\n /**\n * The copy of the options to display in the dropdown\n */\n @State() availableOptions: DropdownOption[] = this.options;\n /**\n * The open state of the dropdown\n */\n @State() isOpen: boolean = false;\n /**\n * The aria-activedescendant attribute for the listbox element to indicate the currently active\n */\n @State() ariaActivedescendant: string = '';\n\n /**\n * This flag is used to focus the first option when the dropdown is opened\n * and reset after the first option is focused\n */\n @State() shouldFocusFirstOption: boolean = false;\n\n // Events\n /**\n * This event is fired when the selected options are changed\n */\n @Event({ bubbles: true, composed: true }) selectedOptionsChanged!: EventEmitter<{\n value: string[];\n name: string;\n }>;\n\n areOptionsEqual(arr1: DropdownOption[], arr2: DropdownOption[]): boolean {\n if (arr1.length !== arr2.length) return false;\n\n // Sort both arrays by a consistent key (e.g., label and value)\n const sorted1 = [...arr1].sort((a, b) => a.label.localeCompare(b.label) || a.value.localeCompare(b.value));\n const sorted2 = [...arr2].sort((a, b) => a.label.localeCompare(b.label) || a.value.localeCompare(b.value));\n\n // Compare each object in the sorted arrays\n return sorted1.every((opt1, index) => {\n const opt2 = sorted2[index];\n return opt1.label === opt2.label && opt1.value === opt2.value;\n });\n }\n\n @Watch('options')\n optionsChangedHandler(newValue: DropdownOption[]) {\n if (!this.areOptionsEqual(newValue, this.availableOptions)) {\n this.availableOptions = newValue;\n }\n }\n\n // Lifecycle methods\n componentDidLoad() {\n debug('multi-select-dropdown', 'componentDidLoad');\n if (this.options) {\n this.availableOptions = this.options;\n }\n }\n\n componentDidRender() {\n debug('multi-select-dropdown', 'componentDidRender');\n if (this.isOpen && this.shouldFocusFirstOption) {\n // The dropdown is open and we should focus the first option\n this.ariaActivedescendant = this.availableOptions[0]?.value;\n this.focusOption(0);\n // Reset the flag\n this.shouldFocusFirstOption = false;\n }\n }\n\n // Event listeners\n @Listen('click', { target: 'document', capture: true })\n handleOutsideClick(event: MouseEvent) {\n // Get the path of the event\n const path = event.composedPath();\n\n // Check if the path includes the host element\n const isClickInside = path.includes(this.el);\n\n if (!isClickInside && this.isOpen) {\n this.isOpen = false;\n }\n }\n\n @Listen('bookingFormSubmitted', { target: 'document' })\n handleBookingFormSubmitted(event: CustomEvent) {\n const selectedOptions = this.availableOptions.filter(o => o.selected).map(o => o.value);\n if (this.required && (!selectedOptions || selectedOptions.length <= 0)) {\n this.error = 'Please select at least one option';\n }\n if (this.error) {\n event.preventDefault();\n }\n }\n\n // Methods\n\n selectOption(option: DropdownOption): void {\n this.availableOptions = this.availableOptions.map(o => {\n if (o.value === option.value) {\n o.selected = option.selected ? false : true;\n if (o.selected) {\n this.error = '';\n }\n }\n return o;\n });\n const selectedOptions = this.availableOptions.filter(o => o.selected).map(o => o.value);\n this.selectedOptionsChanged.emit({\n value: selectedOptions,\n name: this.name,\n });\n }\n\n toggleDropdown(): void {\n this.isOpen = !this.isOpen;\n if (this.isOpen) {\n this.shouldFocusFirstOption = true;\n } else {\n this.ariaActivedescendant = '';\n }\n }\n\n handleSelectButtonKeyDown(event: KeyboardEvent): void {\n switch (event.key) {\n case 'ArrowDown':\n case 'Enter':\n event.preventDefault();\n if (!this.isOpen) {\n this.toggleDropdown();\n }\n break;\n case 'Escape':\n this.isOpen = false;\n break;\n }\n }\n\n handleListboxKeydown(e: KeyboardEvent) {\n const items = this.availableOptions;\n const currentIndex = items.findIndex(item => item.value === this.ariaActivedescendant);\n\n switch (e.key) {\n case 'ArrowDown':\n case 'Tab': {\n if (!e.shiftKey) {\n e.preventDefault();\n const nextIndex = currentIndex + 1 < items.length ? currentIndex + 1 : 0;\n this.ariaActivedescendant = items[nextIndex].value;\n this.focusOption(nextIndex);\n } else {\n e.preventDefault();\n const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;\n this.ariaActivedescendant = items[prevIndex].value;\n this.focusOption(prevIndex);\n }\n break;\n }\n case 'ArrowUp': {\n e.preventDefault();\n const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;\n this.ariaActivedescendant = items[prevIndex].value;\n this.focusOption(prevIndex);\n break;\n }\n case 'Enter': {\n e.preventDefault();\n if (this.ariaActivedescendant) {\n this.selectOption(items[currentIndex]);\n }\n break;\n }\n case 'Escape': {\n this.isOpen = false;\n break;\n }\n }\n }\n\n focusOption(index: number) {\n const option = this.availableOptions[index];\n if (!option) return; // Guard clause in case index is out of bounds\n\n const elementId = option.value;\n const element = this.el.shadowRoot?.getElementById(elementId) as HTMLLIElement;\n\n if (element) {\n element.focus(); // Set focus on the element\n element.scrollIntoView({ behavior: 'smooth', block: 'nearest' });\n }\n }\n\n getSelectedOptions() {\n return this.availableOptions.filter(option => option.selected);\n }\n\n renderOption(option: DropdownOption) {\n return (\n <li\n key={option.value}\n id={option.value}\n role=\"option\"\n tabindex=\"0\"\n aria-selected={option.selected ? 'true' : 'false'}\n onClick={e => {\n e.stopImmediatePropagation();\n if (!option?.disabled) {\n this.selectOption(option);\n }\n }}\n class={{ selected: !!option.selected, disabled: !!option.disabled }}\n >\n <label htmlFor={option.value}>\n <input aria-hidden=\"true\" id={option.value} type=\"checkbox\" checked={option.selected} disabled={!!option?.disabled} />\n <span>{option.label}</span>\n </label>\n </li>\n );\n }\n\n render() {\n return (\n <Host>\n <div class=\"dropdown\" part=\"msd_dropdown\">\n <label class=\"dropdown-label\" part=\"msd_dropdown-label\">\n <p>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\">*</span>}\n </p>\n <slot name=\"label-icon\" aria-hidden=\"true\"></slot>\n </label>\n <button\n name={this.name}\n part={`msd_dropdown-button ${this.error ? 'msd_dropdown-button--error' : ''}`}\n class={{ dropbtn: true, open: this.isOpen, error: !!this.error }}\n onClick={() => this.toggleDropdown()}\n disabled={this.readOnly}\n title={this.readOnly ? 'read-only field' : undefined}\n aria-haspopup=\"listbox\"\n aria-expanded={this.isOpen ? 'true' : 'false'}\n aria-label={this.name}\n onKeyDown={e => this.handleSelectButtonKeyDown(e)}\n >\n <slot name=\"select-icon\" aria-hidden=\"true\"></slot>\n <span class=\"selected-option\" part=\"msd_dropdown-button-selected-label\">\n {this.getSelectedOptions().length > 1\n ? this.multipleOptionsSelectedLabel\n : this.availableOptions.filter(o => o.selected)[0]?.label ?? this.availableOptions[0]?.label}\n </span>\n <span class={this.isOpen ? 'open' : 'closed'} aria-hidden=\"true\">\n <chevron-icon width=\"16\" height=\"16\" />\n </span>\n </button>\n {this.error ? (\n <span class=\"error\" part=\"msd_dropdown_error\">\n {this.error}\n </span>\n ) : null}\n <div class={'selected-options'}>\n {this.getSelectedOptions().map(option => (\n <span class=\"selected-option\">\n {option.label}\n <button disabled={this.readOnly || !!option?.disabled} key={option.label} onClick={() => this.selectOption(option)}>\n <close-icon />\n </button>\n </span>\n ))}\n </div>\n {this.isOpen ? (\n <div class=\"dropdown-content\" part=\"msd_dropdown-content\">\n <ul\n tabindex=\"-1\"\n role=\"listbox\"\n aria-label={this.name}\n aria-multiselectable={true}\n aria-activedescendant={this.ariaActivedescendant}\n onKeyDown={e => this.handleListboxKeydown(e)}\n >\n {this.availableOptions.map(option => this.renderOption(option))}\n </ul>\n </div>\n ) : null}\n </div>\n </Host>\n );\n }\n}\n","@import '../../../common/styles/variables.scss';\n@import '../../../common/mixins/inputs.scss';\n\n:host {\n display: block;\n height: auto;\n @include default-css-variables;\n width: 100%;\n}\n\nlabel {\n @include input-label;\n flex-direction: column;\n gap: 4px;\n font-family: var(--nylas-font-family);\n font-size: 16px;\n color: var(--nylas-base-800);\n\n p {\n margin: 0;\n }\n\n .error {\n color: var(--nylas-error);\n }\n}\n\n.input_wrapper {\n display: flex;\n align-items: center;\n gap: 1rem;\n}\n\ninput[type='date'] {\n @include textfield;\n width: 100%;\n width: -moz-available;\n width: -webkit-fill-available;\n font-family: var(--nylas-font-family);\n cursor: pointer;\n}\n\ninput:read-only {\n background-color: var(--nylas-base-100);\n cursor: not-allowed;\n}\n","import { Component, h, Prop, State, Event, EventEmitter, Listen, Watch, Element } from '@stencil/core';\nimport { sanitize } from '@/utils/utils';\n\nconst DefaultPlaceholder = {\n date: 'YYYY-MM-DD',\n};\n\n/**\n * The `nylas-date-component` component is a UI component that allows users to input text, email, or phone number values.\n * This component is used in the scheduling form to input text, email and phone number type inputs.\n */\n\n@Component({\n tag: 'nylas-date-component',\n styleUrl: 'nylas-date-component.scss',\n shadow: true,\n})\nexport class NylasDateComponent {\n /**\n * The host element\n */\n @Element() el!: HTMLElement;\n /**\n * The name of the input. This is used to identify the input when submitting a form.\n */\n @Prop() name: string = 'input';\n /**\n * The default value of the input. This is the value that is displayed when the input is rendered.\n */\n @Prop() defaultValue?: string;\n /**\n * The label of the input. This is displayed above the input.\n */\n @Prop() label: string = '';\n\n /**\n * The placeholder of the input. This is displayed when the input is empty.\n */\n @Prop() placeholder: string = DefaultPlaceholder['date'];\n /**\n * Whether the input is required. If true, the input must have a value when submitting a form.\n * Default is false. If the input is required and the value is empty, an error message is displayed.\n */\n @Prop() required: boolean = false;\n /**\n * Whether the input is read-only. If true, the input cannot be edited.\n * Default is false.\n */\n @Prop() readOnly: boolean = false;\n /**\n * Whether the input should be focused when rendered.\n * Default is false. If true, the input is focused when rendered.\n * Use this to set the focus on the first input in a form.\n */\n @Prop() autoFocus: boolean = false;\n /**\n * The pattern to validate the input value. If the value does not match the pattern, an error message is displayed.\n * Default is null. If the pattern is not set, the pattern is determined by the input type for 'email' and 'phone_number'.\n */\n @Prop() pattern?: RegExp;\n /**\n * The maximum length of the input value. If the value is longer than the maximum length, an error message is displayed.\n * Default is 255.\n */\n @Prop() maxLength: number = 255;\n /**\n * The error message to display when the value does not match the pattern.\n * Default is 'Invalid <field> format.' where <field> is the input label.\n */\n @Prop() patternError: string = '';\n\n /**\n * This error message is displayed when the input value is empty and the input is required.\n */\n @Prop() requiredError: string = '';\n\n /**\n * The input value state.\n */\n @State() value!: string;\n /**\n * The error message state.\n */\n @State() error: string = '';\n\n /**\n * State to track the validity of the date input.\n */\n @State() isDateValid: boolean = true;\n\n /**\n * This event is fired when the input value is changed.\n * The scheduling form listens for this event to validate the input value and submit the form.\n * If using outside of the scheduling form, listen for this event to validate the input value\n * and handle the input value change.\n */\n @Event() nylasFormInputChanged!: EventEmitter<{\n value: string;\n name: string;\n label: string;\n type: string;\n error: string;\n }>;\n\n @Event() nylasFormInputFocused!: EventEmitter<{\n value: string;\n name: string;\n }>;\n\n @Event() nylasFormInputBlurred!: EventEmitter<{\n value: string;\n name: string;\n }>;\n\n // Lifecycle methods\n @Watch('defaultValue')\n handleDefaultValueChange(newValue: string) {\n this.value = sanitize(newValue);\n if (this.value) {\n this.validatePattern(this.value);\n }\n }\n\n componentDidLoad() {\n this.value = sanitize(this.defaultValue || '');\n if (this.value) {\n this.validatePattern(this.value);\n }\n }\n\n // Event listeners\n /**\n * Listen for the bookingFormSubmitted event to validate the input value when the form is submitted.\n */\n @Listen('bookingFormSubmitted', { target: 'document' })\n handleBookingFormSubmitted(event: CustomEvent) {\n this.validatePattern(this.value);\n if (this.error) {\n event.preventDefault();\n }\n }\n\n @Listen('formSubmitted', { target: 'document' })\n async handleFormSubmitted(event: CustomEvent) {\n this.validatePattern(this.value);\n if (this.error) {\n event.preventDefault();\n }\n }\n\n // Methods\n handleInput(e: Event) {\n this.error = '';\n const target = e.target as HTMLInputElement;\n this.value = sanitize(target.value);\n this.isDateValid = target.validity.valid;\n this.nylasFormInputChanged.emit({\n value: this.value,\n name: this.name,\n label: this.label,\n error: this.error,\n type: 'date',\n });\n }\n\n handleBlur() {\n this.nylasFormInputBlurred.emit({\n value: this.value,\n name: this.name,\n });\n }\n\n handleFocus() {\n this.nylasFormInputFocused.emit({\n value: this.value,\n name: this.name,\n });\n }\n\n validatePattern(value: string) {\n // Reset error\n this.error = '';\n if (this.required && !this.isDateValid) {\n this.error = 'Please enter a valid date';\n return;\n }\n // Check if the field is required and value is empty\n if (this.required && !value) {\n this.error = this.requiredError || 'This field is required.';\n return;\n }\n // Check if value matches pattern\n if (!this.pattern || (!value && !this.required)) return;\n\n if (this.pattern.test(value)) {\n this.error = '';\n } else {\n this.error = this.patternError || 'Invalid format.';\n }\n }\n\n render() {\n return (\n <label part=\"ic__label\" class={{ error: !!this.error }}>\n {this.label && (\n <p>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\">*</span>}\n </p>\n )}\n <div part=\"ic__input_wrapper\" class=\"input_wrapper\">\n <input\n type=\"date\"\n name={this.name}\n part=\"ic__date\"\n title={this.readOnly ? 'read-only field' : undefined}\n readOnly={this.readOnly}\n autoFocus={this.autoFocus}\n value={this.value}\n maxLength={this.maxLength}\n placeholder={this.placeholder}\n class={{ error: !!this.error }}\n onInput={e => this.handleInput(e)}\n onFocus={() => this.handleFocus()}\n onBlur={() => this.handleBlur()}\n />\n <slot name=\"additional-input\"></slot>\n </div>\n {this.error && <span class=\"error help-text\">{this.error}</span>}\n </label>\n );\n }\n}\n"],"version":3}
@@ -31,6 +31,10 @@ const NylasBookedEventCard = class {
31
31
  this.handleCancelBookingButtonClicked = () => {
32
32
  const startTime = new Date(this.selectedTimeslot.start_time);
33
33
  const minCancellationNotice = this.configSettings?.scheduler?.min_cancellation_notice;
34
+ if (!minCancellationNotice) {
35
+ this.cancelBookingButtonClicked.emit({ bookingId: this.eventInfo.booking_id });
36
+ return;
37
+ }
34
38
  const dateTillCancellation = startTime.getTime() - minCancellationNotice * 60 * 1000;
35
39
  if (dateTillCancellation < new Date().getTime()) {
36
40
  this.cancelBookedEventValidationError.emit({
@@ -110,17 +114,17 @@ const NylasBookedEventCard = class {
110
114
  render() {
111
115
  const bookingType = this.configSettings?.booking_type;
112
116
  const isManualConfirmation = bookingType && bookingType !== 'booking';
113
- return (h(Host, { key: '7db019b852ab70270adb7dc9e958e6e7381a26b3', part: "nbec" }, h("div", { key: 'f309b22194e70799fd0333c899e3ef6dc2cadda2', class: "nylas-booked-event-card" }, h("div", { key: 'fda9f6f52eb02449553e3a77f02a9bd9ccc1ffb1', class: "booked-event-timezone" }, h("globe-icon", { key: '86e8540c01d68d6b661f1146bbe24849023ce1bd' }), TIMEZONE_MAP[this.selectedTimezone]), h("div", { key: '1038dc03151ab6a2b961d5f4ded96ba7445d1a54', class: "event-card-wrapper", part: "nbec__card" }, h("div", { key: '62143a2984318fb91ac9e8211901dddc99481ca2', class: "calendar-icon" }, h("calendar-check-icon", { key: '8c2b99dcc14a65e556648d11fd36fbabda5c6e60' })), h("div", { key: 'ceea5100d690b09d4819486a305d639f483522f6', class: "booked-event-header" }, h("h2", { key: 'af360b0c2fd115edd22e6fd4977819c77c83aa64', slot: "card-title", part: "nbec__title" }, !!this.rescheduleBookingId && !this.isLoading
117
+ return (h(Host, { key: 'dbe7087b88cf1eff27686e9a7ef321729bea3c8b', part: "nbec" }, h("div", { key: 'a219990cac8a7f0e7935f03cf1c57ea137564958', class: "nylas-booked-event-card" }, h("div", { key: 'e19d395321ec182846f9fa119c69c7f41ee5f6b2', class: "booked-event-timezone" }, h("globe-icon", { key: 'dd47b506f0528f16875476dc53b27e64f2913fb5' }), TIMEZONE_MAP[this.selectedTimezone]), h("div", { key: '464f20ff077e64638a03afde99478f7d83409408', class: "event-card-wrapper", part: "nbec__card" }, h("div", { key: '5a92d2da8c1b3df9b2d05f6c269478868dff32df', class: "calendar-icon" }, h("calendar-check-icon", { key: 'f8611aa6b551338b403f93d2f2395cd9128c9a09' })), h("div", { key: 'f8988cf31256a020ab3e9a98be8577bcd3bc8490', class: "booked-event-header" }, h("h2", { key: 'a2396483be6d7db392504c6c5f20f335ae14bf74', slot: "card-title", part: "nbec__title" }, !!this.rescheduleBookingId && !this.isLoading
114
118
  ? `${instance.t('bookingRescheduled')}`
115
119
  : isManualConfirmation && !this.isLoading
116
120
  ? `${instance.t('bookingSent')}`
117
- : `${instance.t('bookingConfirmed')}`, "!"), h("div", { key: 'afad927b2a1e56191d73705c93c6b285305810f8', class: "card-description", part: "nbec__description" }, isManualConfirmation ? instance.t('bookingSentDescription') : h("span", null, instance.t('bookingConfirmedDescription')))), h("div", { key: '3a2fcc44ec16291970f5a043fea3c4e0e76cd961', class: "booking-date-time" }, h("checkmark-circle-icon", { key: '9e09cc4a564378d2a57eb26a20d051ff5783959f' }), h("h3", { key: '43751ff57685368a9ff566e042c8ac874a2b972d' }, instance.t('bookingDateAndTimeHeader')), h("p", { key: 'aa873b56137af390655ff8c2eed3baaab44b287a' }, this.selectedTimeslot?.start_time
121
+ : `${instance.t('bookingConfirmed')}`, "!"), h("div", { key: 'b614249b561dc5d050dae4603f651e29cbd1303f', class: "card-description", part: "nbec__description" }, isManualConfirmation ? instance.t('bookingSentDescription') : h("span", null, instance.t('bookingConfirmedDescription')))), h("div", { key: '9098b88ef02d44f0de7a77138a7daf554e516909', class: "booking-date-time" }, h("checkmark-circle-icon", { key: '6192670a3b53c9444db27aa1737813851934a213' }), h("h3", { key: '8e145c48421d913a68bc17e9eafd29121e8e069e' }, instance.t('bookingDateAndTimeHeader')), h("p", { key: '1cf28fc04ff15a87b00a33ea44a5e650a18a231c' }, this.selectedTimeslot?.start_time
118
122
  ? capitalizeFirstLetter(formatBookedEventDate(this.selectedTimeslot?.start_time, this.selectedTimezone, LANGUAGE_CODE_TO_LOCALE_MAP[this.selectedLanguage]))
119
- : '-', ' ', h("br", { key: 'b11b0651c07fa3a160511489e623054a0fc6b95a' }), this.startTime, " - ", this.endTime)), h("div", { key: 'b1945df2b3816cf9e012903910f913fab002f911', class: "booking-participants" }), !isManualConfirmation && (h("div", { class: "button-container" }, h("div", { class: {
123
+ : '-', ' ', h("br", { key: '0034a1c225c5e48784bad88c97957a896652b0f8' }), this.startTime, " - ", this.endTime)), h("div", { key: 'bc919a4c276cb2eb95c05f0409454b9c9dd75fcc', class: "booking-participants" }), !isManualConfirmation && (h("div", { class: "button-container" }, h("div", { class: {
120
124
  'footer': true,
121
125
  'no-footer': (this.configSettings?.scheduler?.hide_cancellation_options && this.configSettings?.scheduler?.hide_rescheduling_options) ||
122
126
  this.configSettings?.booking_type === 'organizer-confirmation',
123
- 'no-template-cols': this.configSettings?.scheduler?.hide_cancellation_options || this.configSettings?.scheduler?.hide_rescheduling_options,
127
+ 'no-template-cols': !!this.configSettings?.scheduler?.hide_cancellation_options || !!this.configSettings?.scheduler?.hide_rescheduling_options,
124
128
  } }, !this.configSettings?.scheduler?.hide_cancellation_options && (h("button-component", { variant: 'destructive', onClick: this.handleCancelBookingButtonClicked, part: "nbec__button-outline nbec__cancel-cta" }, `${instance.t('cancelBookingButton')}`)), !this.configSettings?.scheduler?.hide_rescheduling_options && (h("button-component", { variant: 'basic', onClick: this.handleRescheduleButtonClicked, disabled: this.isLoading, part: "nbec__button-outline nbec__reschedule-cta" }, `${instance.t('rescheduleBookingButton')}`)))))))));
125
129
  }
126
130
  get host() { return getElement(this); }
@@ -486,7 +490,7 @@ const NylasBookingForm = class {
486
490
  this.updateAdditionalFields(event.detail.name, event.detail.value);
487
491
  }
488
492
  render() {
489
- return (h(Host, { key: 'd1a22c96134f6b621cd51de89a334cbfd333e60d' }, h("form", { key: 'd69adbd943fc3b7a5c7f0cf53dbb9217f7334c32', onSubmit: e => this.bookButtonClickedHandler(e), ref: el => (this.formRef = el), noValidate: true }, h("div", { key: '21afe8342d7d3656a425d57b0b63ddc336961ab2', class: "nylas-booking-form", part: "nbf" }, h("div", { key: 'c8fb40d0bdfe56db0e88bba9e50ccf1b94ab446a', class: "input-wrapper", part: "nbf__input-wrapper" }, h("input-component", { key: '0d3560610674cff9b3aa8c6bd91ed2ebcaf6036e', label: instance.t('name'), name: "name", id: "name", defaultValue: this.bookingInfo?.primaryParticipant?.name || this.configSettings?.booking?.guest?.name || this.name, placeholder: instance.t('namePlaceholder'), type: "text", readOnly: this.bookingInfo?.primaryParticipant?.nameReadOnly || false, required: true, requiredError: instance.t('fieldRequired', { field: instance.t('name') }), patternError: instance.t('invalidInputFormat', { field: instance.t('name') }), part: "nbf__input-textfield" })), h("div", { key: '2abb2740328b4b999ba4d2b1e7345c592d50d27e', class: "input-wrapper", part: "nbf__input-wrapper" }, h("input-component", { key: 'cb5ab32f071f33f7374f9d4488fd4663963040bb', label: instance.t('email'), name: "email", id: "email", pattern: emailRegex, defaultValue: this.bookingInfo?.primaryParticipant?.email || this.configSettings?.booking?.guest?.email || this.email, placeholder: instance.t('emailPlaceholder'), type: "email", readOnly: this.bookingInfo?.primaryParticipant?.emailReadOnly || false, required: true, requiredError: instance.t('fieldRequired', { field: instance.t('email') }), patternError: instance.t('invalidInputFormat', { field: instance.t('email') }), part: "nbf__input-textfield" })), this.configSettings?.scheduler?.hide_additional_guests !== true && (h("div", { class: "input-wrapper", part: "nbf__input-wrapper" }, this.guestEmails.map((email, index) => (h("div", { class: "input-wrapper button-wrapper" }, h("label", { class: {
493
+ return (h(Host, { key: '7cc64499522157e62c5703990effe640e032794f' }, h("form", { key: '14b8c18e942c2b30027dd4ab7e9f50be749b6d8a', onSubmit: e => this.bookButtonClickedHandler(e), ref: el => (this.formRef = el), noValidate: true }, h("div", { key: 'df00121eb4e6491ce7a758690c0bb2fdb3afd2c0', class: "nylas-booking-form", part: "nbf" }, h("div", { key: 'f54bdfab54066557fa20defcc90bba5b33211616', class: "input-wrapper", part: "nbf__input-wrapper" }, h("input-component", { key: 'b4fb9a672fb708ebc47084c9978fc6c526dda804', label: instance.t('name'), name: "name", id: "name", defaultValue: this.bookingInfo?.primaryParticipant?.name || this.configSettings?.booking?.guest?.name || this.name, placeholder: instance.t('namePlaceholder'), type: "text", readOnly: this.bookingInfo?.primaryParticipant?.nameReadOnly || false, required: true, requiredError: instance.t('fieldRequired', { field: instance.t('name') }), patternError: instance.t('invalidInputFormat', { field: instance.t('name') }), part: "nbf__input-textfield" })), h("div", { key: '44f5979a3aacfaedf6baa124ddf3cae468f71e19', class: "input-wrapper", part: "nbf__input-wrapper" }, h("input-component", { key: '5e72e7aa54a18a6a3b441a6d3d03c8b08246bc07', label: instance.t('email'), name: "email", id: "email", pattern: emailRegex, defaultValue: this.bookingInfo?.primaryParticipant?.email || this.configSettings?.booking?.guest?.email || this.email, placeholder: instance.t('emailPlaceholder'), type: "email", readOnly: this.bookingInfo?.primaryParticipant?.emailReadOnly || false, required: true, requiredError: instance.t('fieldRequired', { field: instance.t('email') }), patternError: instance.t('invalidInputFormat', { field: instance.t('email') }), part: "nbf__input-textfield" })), this.configSettings?.scheduler?.hide_additional_guests !== true && (h("div", { class: "input-wrapper", part: "nbf__input-wrapper" }, this.guestEmails.map((email, index) => (h("div", { class: "input-wrapper button-wrapper" }, h("label", { class: {
490
494
  error: !!this.guestEmailErrors[index],
491
495
  } }, instance.t('guestEmail')), h("div", { class: "guest-email-input" }, h("input", { type: "email", id: `guest-email-${index}`, maxLength: 100, class: {
492
496
  'guest-email': true,
@@ -518,14 +522,14 @@ const NylasBookingForm = class {
518
522
  return (h("div", { class: "input-wrapper", part: "nbf__input-wrapper" }, h("nylas-date-component", { readOnly: fieldReadOnly, label: label, defaultValue: defaultValue, name: key, id: key, required: field.required, part: "nbf__date-component" })));
519
523
  case 'multi_select': {
520
524
  const defaultValues = defaultValue?.split(',').map(item => item.trim()) || [];
521
- return (h("div", null, h("multi-select-dropdown", { label: label, name: key, id: key, readOnly: fieldReadOnly, options: field.options?.map(option => ({ value: option, label: option, selected: defaultValues.includes(option) })), required: field.required, exportparts: "msd_dropdown: nbf__ms_dropdown, msd_dropdown-label: nbf__ms_dropdown-label, msd_dropdown-button: nbf__ms_dropdown-button, msd_dropdown-content: nbf__ms_dropdown-content, msd_dropdown_error: nbf__ms_dropdown_error, msd_dropdown-button--error: nbf__ms_dropdown-button--error" })));
525
+ return (h("div", null, h("multi-select-dropdown", { label: label, name: key, id: key, readOnly: fieldReadOnly, multipleOptionsSelectedLabel: instance.t('multipleOptionsSelected'), options: field.options?.map(option => ({ value: option, label: option, selected: defaultValues.includes(option) })), required: field.required, exportparts: "msd_dropdown: nbf__ms_dropdown, msd_dropdown-label: nbf__ms_dropdown-label, msd_dropdown-button: nbf__ms_dropdown-button, msd_dropdown-content: nbf__ms_dropdown-content, msd_dropdown_error: nbf__ms_dropdown_error, msd_dropdown-button--error: nbf__ms_dropdown-button--error" })));
522
526
  }
523
527
  case 'metadata':
524
528
  return null;
525
529
  default:
526
530
  return (h("div", { class: "input-wrapper", part: "nbf__input-wrapper" }, h("input-component", { label: label, name: key, id: key, type: field.type, readOnly: fieldReadOnly, defaultValue: defaultValue || '', requiredError: instance.t('fieldRequired', { field: label }), required: field.required, part: "nbf__input-textfield" })));
527
531
  }
528
- })), h("div", { key: '1bc3a6c8cf879b03e39e58e9db2371d675a4e27a', class: "cta" }, h("button-component", { key: '5b38a653d10dc75faea9eaa2384985acd50f420a', variant: 'basic', class: "back", part: "nbf__button-outline", isLoading: this.backButtonLoading && this.isLoading, onClick: this.handleBackButtonClicked }, h("slot", { key: 'b69945ab562eca8770f3bbc39558a1b9bffdd168', name: "booking-form-back-label" }, `${instance.t('backButton')}`)), h("button-component", { key: '97761d73e97c6d39fe7671f649c7f114c912efd3', variant: 'primary', isLoading: !this.backButtonLoading && this.isLoading, disabled: this.isLoading, part: "nbf__button-primary", type: "submit" }, h("slot", { key: '5c0f6a7eb055463f288d8644073a00ddfbbbbc26', name: "booking-form-book-label" }, `${instance.t('bookNowButton')}`))))));
532
+ })), h("div", { key: 'ceca163a222c8be615a63d36f15e1dcdad40c08c', class: "cta" }, h("button-component", { key: '300ecbc4bffd1abe7d89684000ea958457392650', variant: 'basic', class: "back", part: "nbf__button-outline", isLoading: this.backButtonLoading && this.isLoading, onClick: this.handleBackButtonClicked }, h("slot", { key: '3f3ab4bd1654a53941685961252c57138dbd9cc5', name: "booking-form-back-label" }, `${instance.t('backButton')}`)), h("button-component", { key: 'f1e3ecf792c87519589b83678d607bf12756f209', variant: 'primary', isLoading: !this.backButtonLoading && this.isLoading, disabled: this.isLoading, part: "nbf__button-primary", type: "submit" }, h("slot", { key: '75e9978b761610c37daf981520dc6e372e02fb38', name: "booking-form-book-label" }, `${instance.t('bookNowButton')}`))))));
529
533
  }
530
534
  get host() { return getElement(this); }
531
535
  static get watchers() { return {
@@ -1501,10 +1505,10 @@ const NylasOrganizerConfirmationCard = class {
1501
1505
  this.action = null;
1502
1506
  }
1503
1507
  render() {
1504
- return (h(Host, { key: 'b72cdf56a652927b8bdc97bd1aca688190fae0c8', part: "nmcc" }, h("div", { key: 'af1403167427309c434934b2fd62d01121575fc3', class: "event-card-wrapper", part: "nmccc__card" }, h("div", { key: '421f5f62e390dd3631ee053ff55fbd9c45b3ca94', class: "calendar-icon" }, h("calendar-check-icon", { key: 'b1494af046b7c5e06f050ba267ff54ee21e70e5d' })), h("div", { key: 'd6ae4056fe5e195c9ac81107afbfcaeaeca32e18', class: "booked-event-header" }, h("h2", { key: 'f4d2b1c4b6c0304c7e25bd850d1c437bca9f4fd3', slot: "card-title", part: "nmcc__title" }, !!this.organizerConfirmationBookingId && `${instance.t('bookingPendingTitle')}!`)), h("div", { key: 'e5ce4a9667fb170d72332481f623e2283b71d5d9', class: "manage-booking-description" }, h("p", { key: '86a9992bd9e3c652736b8b89d5535db140ee1910' }, instance.t('bookingPendingnDescription'))), h("div", { key: '736f19da65dd1e8e782b6b12f534eaaf85d0acbb', class: {
1508
+ return (h(Host, { key: '222871895768a9e8125bf2c7332200e65872b475', part: "nmcc" }, h("div", { key: '4838e6be84dab176c13230870f3d0094f1054da9', class: "event-card-wrapper", part: "nmccc__card" }, h("div", { key: '004ce2abb9cc4654dd4278e6c7002b34b7346968', class: "calendar-icon" }, h("calendar-check-icon", { key: '6202df706f78fcd592738a33b1e052e94f88d6ff' })), h("div", { key: '5a1f583617511c35a29fa65f026820996941b707', class: "booked-event-header" }, h("h2", { key: '62b88591f4432538d3c57fa6af4142f0cd2c997f', slot: "card-title", part: "nmcc__title" }, !!this.organizerConfirmationBookingId && `${instance.t('bookingPendingTitle')}!`)), h("div", { key: '838b6df023be444c1b1ce1dfc7df21cab18756e1', class: "manage-booking-description" }, h("p", { key: 'dc119292e92c4565fb84939284fb57f1fb2ec1f6' }, instance.t('bookingPendingnDescription'))), h("div", { key: '31cadc6bfc0ae9f0adf93d159cff2261631e2281', class: {
1505
1509
  'footer': true,
1506
- 'no-footer': this.configSettings?.scheduler?.hide_cancellation_options && this.configSettings?.scheduler?.hide_rescheduling_options,
1507
- 'no-template-cols': this.configSettings?.scheduler?.hide_cancellation_options || this.configSettings?.scheduler?.hide_rescheduling_options,
1510
+ 'no-footer': !!this.configSettings?.scheduler?.hide_cancellation_options && !!this.configSettings?.scheduler?.hide_rescheduling_options,
1511
+ 'no-template-cols': !!this.configSettings?.scheduler?.hide_cancellation_options || !!this.configSettings?.scheduler?.hide_rescheduling_options,
1508
1512
  } }, !this.configSettings?.scheduler?.hide_cancellation_options && (h("button-component", { variant: 'destructive', onClick: this.handleRejectBookingButtonClicked, isLoading: this.isLoading && this.action === 'reject', part: "nmcc__button-outline nmcc__cancel-cta" }, `${instance.t('rejectBookingButton')}`)), !this.configSettings?.scheduler?.hide_rescheduling_options && (h("button-component", { variant: 'basic', onClick: this.handleConfirmBookingButtonClicked, isLoading: this.isLoading && this.action === 'confirm', part: "nmcc__button-outline nmcc__reschedule-cta" }, `${instance.t('confirmBookingButton')}`))))));
1509
1513
  }
1510
1514
  get host() { return getElement(this); }