npm - @nylas/web-elements - Versions diffs - 1.1.1 → 1.1.2 - Mend

@nylas/web-elements 1.1.1 → 1.1.2

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 (118) hide show

package/dist/cjs/nylas-web-elements.cjs.js CHANGED Viewed

@@ -50,7 +50,7 @@ const patchCloneNodeFix = (HTMLElementPrototype) => {
 patchBrowser().then(options => {
   appGlobals.globalScripts();
-  return index.bootstrapLazy(JSON.parse("[[\"nylas-availability-picker.cjs\",[[65,\"nylas-availability-picker\",{\"selectedConfiguration\":[16],\"openHours\":[16],\"name\":[1],\"defaultTimezone\":[1,\"default-timezone\"],\"hideHeader\":[4,\"hide-header\"],\"schedule\":[32],\"timezone\":[32],\"overlapDays\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"],[0,\"timeChange\",\"setTime\"],[0,\"formError\",\"setFormError\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"configChangedHandler\"],\"schedule\":[\"scheduleChanged\"]}]]],[\"nylas-scheduler-editor.cjs\",[[1,\"nylas-scheduler-editor\",{\"configurationId\":[1025,\"configuration-id\"],\"nylasApiRequest\":[1040],\"nylasSessionsConfig\":[16],\"defaultAuthArgs\":[16],\"eventOverrides\":[16],\"schedulerPreviewLink\":[1,\"scheduler-preview-link\"],\"defaultSchedulerConfigState\":[16],\"mode\":[1],\"additionalParticipants\":[16],\"hideEditorTabs\":[16],\"conferenceProviders\":[16],\"requiresSlug\":[4,\"requires-slug\"],\"automaticComponentRegistration\":[32],\"store\":[64],\"schedulerConnector\":[64]},[[0,\"registerComponent\",\"registerComponentHandler\"],[0,\"unregisterComponent\",\"unregisterComponentHandler\"]],{\"configurationId\":[\"configurationIdChanged\"]}]]],[\"nylas-scheduling.cjs\",[[1,\"nylas-scheduling\",{\"mode\":[1],\"defaultSchedulerState\":[16],\"sessionId\":[1,\"session-id\"],\"schedulerApiUrl\":[1,\"scheduler-api-url\"],\"bookingInfo\":[16],\"rescheduleBookingRef\":[1,\"reschedule-booking-ref\"],\"cancelBookingRef\":[1,\"cancel-booking-ref\"],\"organizerConfirmationBookingRef\":[1,\"organizer-confirmation-booking-ref\"],\"configurationId\":[1,\"configuration-id\"],\"slug\":[1],\"clientId\":[1,\"client-id\"],\"nylasBranding\":[4,\"nylas-branding\"],\"eventOverrides\":[16],\"isLoading\":[4,\"is-loading\"],\"themeConfig\":[16],\"localization\":[16],\"showNotification\":[4,\"show-notification\"],\"automaticComponentRegistration\":[32],\"selectedDateLabel\":[32],\"refConfigId\":[32],\"language\":[32],\"getNylasSchedulerStore\":[64],\"getNylasSchedulerConnector\":[64],\"getRef\":[64]},[[0,\"languageChanged\",\"languageChanged\"],[0,\"registerComponent\",\"registerComponentHandler\"],[0,\"unregisterComponent\",\"unregisterComponentHandler\"],[0,\"monthChanged\",\"monthChangedHandler\"],[0,\"detailsConfirmed\",\"bookButtonClickedHandler\"],[0,\"dateSelected\",\"dateSelectedHandler\"],[0,\"cancelBookedEventError\",\"cancelBookedEventErrorHandler\"],[0,\"cancelBookedEventValidationError\",\"cancelBookedEventValidationErrorHandler\"],[0,\"rescheduleBookedEventError\",\"rescheduleBookedEventErrorHandler\"],[0,\"confirmBookingError\",\"confirmBookingErrorHandler\"]],{\"bookingInfo\":[\"bookingInfoChanged\"],\"rescheduleBookingRef\":[\"rescheduleBookingRefChanged\"],\"cancelBookingRef\":[\"cancelBookingRefChanged\"],\"organizerConfirmationBookingRef\":[\"organizerConfirmationBookingRefChanged\"],\"localization\":[\"localizationChanged\"],\"themeConfig\":[\"themeConfigChanged\"]}]]],[\"nylas-reminder-emails.cjs\",[[65,\"nylas-reminder-emails\",{\"eventReminders\":[16],\"participants\":[16],\"name\":[1],\"reminders\":[32],\"reminderErrors\":[32],\"editingReminderIndex\":[32]},[[0,\"valueChanged\",\"handleValueChanged\"]],{\"name\":[\"elementNameChangedHandler\"]}]]],[\"nylas-view-thread.cjs\",[[1,\"nylas-view-thread\",{\"draft\":[16],\"thread\":[16],\"messages\":[16],\"attachments\":[16],\"state\":[32],\"internalMessages\":[32],\"showAllEmails\":[32],\"showComposer\":[32]},null,{\"thread\":[\"threadChanged\"],\"messages\":[\"updateInternalMessages\"]}]]],[\"nylas-list-folders.cjs\",[[1,\"nylas-list-folders\",{\"folders\":[16],\"selectedFolder\":[1,\"selected-folder\"],\"defaultFolders\":[32],\"otherFolders\":[32]},null,{\"folders\":[\"watchFolders\"]}]]],[\"nylas-mailbox-pagination.cjs\",[[1,\"nylas-mailbox-pagination\",{\"state\":[1],\"hasNextPage\":[4,\"has-next-page\"],\"hasPreviousPage\":[4,\"has-previous-page\"],\"scrollTarget\":[1,\"scroll-target\"],\"mobileOnlyInfiniteScroll\":[4,\"mobile-only-infinite-scroll\"],\"mobileViewPortWidth\":[2,\"mobile-view-port-width\"],\"nextPage\":[64],\"previousPage\":[64]},[[9,\"scroll\",\"handlePageScroll\"]]]]],[\"nylas-threads-refresh.cjs\",[[1,\"nylas-threads-refresh\",{\"start\":[32],\"state\":[32],\"pulling\":[32],\"updateState\":[64]}]]],[\"input-color-picker.cjs\",[[1,\"input-color-picker\",{\"name\":[1],\"defaultSelectedColor\":[1,\"default-selected-color\"],\"selectedColor\":[32],\"isOpen\":[32],\"ariaActivedescendant\":[32],\"errorMessage\":[32]},[[6,\"click\",\"handleOutsideClick\"]]]]],[\"document-refresh-icon.cjs\",[[2,\"document-refresh-icon\",{\"width\":[1],\"height\":[1]}]]],[\"nylas-if-state.cjs\",[[1,\"nylas-if-state\",{\"state\":[1],\"isStateSet\":[4,\"is-state-set\"],\"isBoolean\":[4,\"is-boolean\"],\"getStore\":[16],\"transition\":[1],\"show\":[32],\"classes\":[32]},null,{\"getStore\":[\"onGetStoreChange\"]}]]],[\"nylas-list-threads.cjs\",[[1,\"nylas-list-threads\",{\"threads\":[16],\"isAuthenticated\":[4,\"is-authenticated\"],\"tokenInfo\":[16],\"state\":[1],\"showCheckbox\":[4,\"show-checkbox\"]}]]],[\"nylas-login.cjs\",[[1,\"nylas-login\",{\"isAuthenticated\":[4,\"is-authenticated\"],\"nylasConnector\":[16],\"scopes\":[16],\"loginMethod\":[1,\"login-method\"],\"companyName\":[1,\"company-name\"],\"logoUrl\":[1,\"logo-url\"],\"logoWidth\":[1,\"logo-width\"],\"providers\":[1],\"buttonText\":[1,\"button-text\"],\"email\":[32]}]]],[\"nylas-mailbox.cjs\",[[1,\"nylas-mailbox\",{\"automaticComponentRegistration\":[4,\"automatic-component-registration\"],\"eventOverrides\":[16],\"authConfig\":[16],\"defaultAuthStoreState\":[16],\"defaultMailboxStoreState\":[16],\"getMailboxStore\":[64],\"getAuthStore\":[64],\"getNylasAuth\":[64],\"getNylasMailboxConnector\":[64]},[[0,\"registerComponent\",\"registerComponentHandler\"],[0,\"unregisterComponent\",\"unregisterComponentHandler\"]]]]],[\"nylas-mailbox-toolbar-button.cjs\",[[1,\"nylas-mailbox-toolbar-button\",{\"method\":[1],\"dataState\":[1,\"data-state\"],\"iconOnly\":[4,\"icon-only\"],\"mailboxConnector\":[16]}]]],[\"nylas-provider.cjs\",[[1,\"nylas-provider\",{\"authConfig\":[16],\"eventOverrides\":[16],\"automaticComponentRegistration\":[4,\"automatic-component-registration\"],\"getNylasAuth\":[64],\"getNylasConnector\":[64],\"getMailboxStore\":[64],\"getAuthStore\":[64],\"getNylasSchedulerStore\":[64],\"getNylasSchedulerConfigStore\":[64]},[[0,\"registerComponent\",\"registerComponentHandler\"],[0,\"unregisterComponent\",\"unregisterComponentHandler\"]]]]],[\"nylas-threads-search.cjs\",[[1,\"nylas-threads-search\",{\"query\":[1],\"internalQuery\":[32]},null,{\"query\":[\"onQueryChange\"]}]]],[\"nylas-editor-tabs.cjs\",[[6,\"nylas-editor-tabs\",{\"calendars\":[16],\"selectedConfiguration\":[16],\"currentUser\":[16],\"schedulerPreviewLink\":[1,\"scheduler-preview-link\"],\"mode\":[1],\"hideEditorTabs\":[16],\"action\":[32],\"activeTab\":[32],\"isLoading\":[32],\"hasUnsavedChanges\":[32],\"changesSaved\":[32],\"formState\":[32],\"error\":[32]},[[0,\"valueChanged\",\"handleValueChanged\"]],{\"selectedConfiguration\":[\"configChangedHandler\"],\"currentUser\":[\"userChangedHandler\"]}]]],[\"nylas-booking-form.cjs\",[[1,\"nylas-booking-form\",{\"isLoading\":[4,\"is-loading\"],\"bookingInfo\":[8,\"booking-info\"],\"eventInfo\":[16],\"configSettings\":[8,\"config-settings\"],\"name\":[32],\"email\":[32],\"guestEmails\":[32],\"guestEmailErrors\":[32],\"isNameValid\":[32],\"isEmailValid\":[32],\"additionalFields\":[32],\"validationError\":[32],\"backButtonLoading\":[32]},[[0,\"nylasFormInputChanged\",\"nylasFormInputChangedHandler\"],[0,\"nylasFormDropdownChanged\",\"selectOptionChangedHandler\"],[0,\"nylasFormSwitchToggled\",\"switchToggledHandler\"],[0,\"nylasFormCheckboxToggled\",\"checkboxToggledHandler\"],[0,\"nylasFormRadioChanged\",\"radioChangedHandler\"]],{\"bookingInfo\":[\"bookingInfoChangedHandler\"]}]]],[\"nylas-list-configurations.cjs\",[[1,\"nylas-list-configurations\",{\"configurations\":[16],\"schedulerPreviewLink\":[1,\"scheduler-preview-link\"],\"listConfigurationsNextCursor\":[1,\"list-configurations-next-cursor\"],\"state\":[32],\"error\":[32],\"currentCursor\":[32],\"previousCursors\":[32],\"disableNextPageButton\":[32],\"getState\":[64],\"setState\":[64],\"setError\":[64]},[[0,\"nylasFormDropdownChanged\",\"handleNylasFormDropdownChanged\"]],{\"listConfigurationsNextCursor\":[\"listConfigurationsNextCursorChangedHandler\"]}]]],[\"nylas-cancel-booking-form.cjs\",[[1,\"nylas-cancel-booking-form\",{\"cancelBookingId\":[1,\"cancel-booking-id\"],\"rejectBookingId\":[1,\"reject-booking-id\"],\"configSettings\":[16],\"eventInfo\":[16],\"selectedTimeslot\":[16],\"isLoading\":[4,\"is-loading\"],\"cancellationReason\":[32],\"cancellationError\":[32],\"cancellationPolicy\":[32]},[[0,\"nylasFormInputChanged\",\"handleNylasFormInputChanged\"]],{\"configSettings\":[\"configSettingsChangedHandler\"]}]]],[\"nylas-booked-event-card.cjs\",[[1,\"nylas-booked-event-card\",{\"eventInfo\":[16],\"rescheduleBookingId\":[1,\"reschedule-booking-id\"],\"bookingInfo\":[8,\"booking-info\"],\"selectedTimezone\":[1,\"selected-timezone\"],\"selectedTimeslot\":[16],\"configSettings\":[8,\"config-settings\"],\"isLoading\":[4,\"is-loading\"],\"selectedLanguage\":[1,\"selected-language\"]}]]],[\"nylas-locale-switch.cjs\",[[1,\"nylas-locale-switch\",{\"selectedTimezone\":[1025,\"selected-timezone\"],\"selectedLanguage\":[1025,\"selected-language\"]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"]]]]],[\"nylas-reminder-time.cjs\",[[65,\"nylas-reminder-time\",{\"selectedConfiguration\":[16],\"name\":[1],\"eventReminderTimeMinutes\":[2,\"event-reminder-time-minutes\"],\"reminderTime\":[32],\"reminderTimeMinutes\":[32],\"reminderTimeincrement\":[32],\"reminderTimeMinutesOptions\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"],[0,\"inputOptionChanged\",\"inputOptionChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"reminderTimeMinutes\":[\"reminderTimeMinutesChangedHandler\"]}]]],[\"nylas-cancelled-event-card.cjs\",[[1,\"nylas-cancelled-event-card\",{\"cancelledEventInfo\":[16],\"configSettings\":[16],\"isClosing\":[32]}]]],[\"nylas-composer.cjs\",[[1,\"nylas-composer\",{\"message\":[16],\"viewEmailElement\":[16]},null,{\"message\":[\"watchBody\"]}]]],[\"nylas-confirmed-event-card.cjs\",[[1,\"nylas-confirmed-event-card\",{\"confirmedEventInfo\":[16],\"configSettings\":[16],\"isClosing\":[32]}]]],[\"nylas-date-picker.cjs\",[[1,\"nylas-date-picker\",{\"selectableDates\":[16],\"selectedDate\":[16],\"configSettings\":[16],\"selectedLanguage\":[1,\"selected-language\"],\"isLoading\":[4,\"is-loading\"],\"eventDuration\":[2,\"event-duration\"],\"month\":[32],\"dates\":[32],\"disableNextMonthButton\":[32]},null,{\"configSettings\":[\"configSettingsChanged\"],\"selectedLanguage\":[\"selectedLanguageChanged\"]}]]],[\"nylas-organizer-confirmation-card.cjs\",[[1,\"nylas-organizer-confirmation-card\",{\"organizerConfirmationBookingId\":[1,\"organizer-confirmation-booking-id\"],\"configSettings\":[8,\"config-settings\"],\"isLoading\":[4,\"is-loading\"],\"selectedLanguage\":[1,\"selected-language\"],\"action\":[32],\"resetAction\":[64]}]]],[\"nylas-summarize-message-button.cjs\",[[1,\"nylas-summarize-message-button\",{\"message\":[16],\"state\":[32],\"updateState\":[64],\"playAudio\":[64]}]]],[\"nylas-notification.cjs\",[[1,\"nylas-notification\",{\"ttl\":[8],\"allowedCategories\":[16],\"notifications\":[32]},[[16,\"nylasSchedulerError\",\"onError\"],[16,\"nylasSchedulerWarning\",\"onWarning\"],[16,\"nylasSchedulerInfo\",\"onInfo\"],[16,\"nylasSchedulerSuccess\",\"onSuccess\"]]]]],[\"nylas-selected-event-card.cjs\",[[1,\"nylas-selected-event-card\",{\"selectedDate\":[16],\"selectedTimeslot\":[16],\"selectedTimezone\":[1,\"selected-timezone\"],\"selectedLanguage\":[1,\"selected-language\"],\"startTime\":[32],\"endTime\":[32]}]]],[\"nylas-timeslot-picker.cjs\",[[1,\"nylas-timeslot-picker\",{\"selectedDate\":[16],\"availability\":[16],\"selectedTimeslot\":[16],\"isLoading\":[4,\"loading-state\"],\"selectedTimezone\":[1,\"selected-timezone\"],\"selectedLanguage\":[1,\"selected-language\"],\"times\":[32],\"hoveredTimeslotIndex\":[32],\"selectedTimeslotIndex\":[32]},null,{\"selectedLanguage\":[\"selectedLanguageChanged\"],\"selectedDate\":[\"selectedDateChanged\"],\"availability\":[\"availabilityChanged\"]}]]],[\"archive-icon.cjs\",[[2,\"archive-icon\",{\"width\":[1],\"height\":[1]}]]],[\"arrow-icon.cjs\",[[2,\"arrow-icon\",{\"width\":[1],\"height\":[1]}]]],[\"folder-icon.cjs\",[[2,\"folder-icon\",{\"width\":[1],\"height\":[1]}]]],[\"forward-icon.cjs\",[[2,\"forward-icon\",{\"width\":[1],\"height\":[1]}]]],[\"google-logo-icon.cjs\",[[2,\"google-logo-icon\",{\"width\":[1],\"height\":[1]}]]],[\"inbox-icon.cjs\",[[2,\"inbox-icon\",{\"width\":[1],\"height\":[1]}]]],[\"microsoft-logo-icon.cjs\",[[2,\"microsoft-logo-icon\",{\"width\":[1],\"height\":[1]}]]],[\"nylas-logo.cjs\",[[2,\"nylas-logo\",{\"width\":[1],\"height\":[1]}]]],[\"nylas-view-email.cjs\",[[1,\"nylas-view-email\",{\"message\":[16],\"parent\":[16],\"attachments\":[16],\"detectDarkMode\":[4,\"detect-dark-mode\"],\"state\":[32],\"sanitizedBody\":[32],\"styles\":[32],\"viewEmailElement\":[32],\"hoistedFontURLs\":[32]},[[9,\"resize\",\"handleScroll\"]],{\"message\":[\"messageChanged\"],\"viewEmailElement\":[\"viewEmailElementChanged\"]}]]],[\"reply-all-icon.cjs\",[[2,\"reply-all-icon\",{\"width\":[1],\"height\":[1]}]]],[\"reply-icon.cjs\",[[2,\"reply-icon\",{\"width\":[1],\"height\":[1]}]]],[\"sent-icon.cjs\",[[2,\"sent-icon\",{\"width\":[1],\"height\":[1]}]]],[\"spam-icon.cjs\",[[2,\"spam-icon\",{\"width\":[1],\"height\":[1]}]]],[\"star-icon.cjs\",[[2,\"star-icon\",{\"width\":[1],\"height\":[1]}]]],[\"trash-fill-icon.cjs\",[[2,\"trash-fill-icon\",{\"width\":[1],\"height\":[1]}]]],[\"trash-icon.cjs\",[[2,\"trash-icon\",{\"width\":[1],\"height\":[1]}]]],[\"nylas-confirmation-email.cjs\",[[65,\"nylas-confirmation-email\",{\"selectedConfiguration\":[16],\"confirmationEmailTemplate\":[16],\"isOpen\":[4,\"is-open\"],\"participants\":[16],\"name\":[1],\"confirmationEmail\":[32],\"isConfirmationEmailOpen\":[32],\"participantsState\":[32]},[[0,\"nylasFormInputChanged\",\"nylasFormInputChangeHandler\"],[0,\"valueChanged\",\"valueChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-participants-custom-availability.cjs\",[[65,\"nylas-participants-custom-availability\",{\"selectedConfiguration\":[16],\"name\":[1],\"participants\":[16],\"selectedParticipants\":[32]},[[0,\"nylasFormSwitchToggled\",\"nylasFormSwitchToggledHandler\"],[0,\"valueChanged\",\"handleValueChanged\"]],{\"name\":[\"elementNameChangedHandler\"],\"participants\":[\"participantsChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-event-location.cjs\",[[65,\"nylas-event-location\",{\"name\":[1],\"currentUser\":[16],\"userProvider\":[1,\"user-provider\"],\"eventConferencing\":[16],\"conferenceProviders\":[16],\"selectedConfiguration\":[16],\"eventLocation\":[1,\"event-location\"],\"location\":[32],\"grantId\":[32],\"selectedLocationOption\":[32],\"userProviderState\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-booking-form-config.cjs\",[[65,\"nylas-booking-form-config\",{\"selectedConfiguration\":[16],\"name\":[1],\"additonalFields\":[16],\"formFields\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"],[0,\"nylasFormInputChanged\",\"nylasFormInputChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"formFields\":[\"watchHandler\"]}]]],[\"nylas-additional-participants.cjs\",[[65,\"nylas-additional-participants\",{\"selectedConfiguration\":[16],\"currentUser\":[16],\"name\":[1],\"eventParticipants\":[16],\"participantOptions\":[16],\"participants\":[32],\"participantErrors\":[32],\"includeOrganizerAsParticipant\":[32],\"isRoundRobinConfig\":[32],\"error\":[32]},[[0,\"inputOptionChanged\",\"onInputOptionChanged\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-limit-future-bookings.cjs\",[[65,\"nylas-limit-future-bookings\",{\"selectedConfiguration\":[16],\"availableDaysInFuture\":[2,\"available-days-in-future\"],\"name\":[1],\"selectedNumber\":[32],\"selectedPeriod\":[32]},[[0,\"timePeriodChanged\",\"timePeriodChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-min-booking-notice.cjs\",[[65,\"nylas-min-booking-notice\",{\"selectedConfiguration\":[16],\"minBookingNotice\":[2,\"min-booking-notice\"],\"name\":[1],\"selectedNumber\":[32],\"selectedPeriod\":[32]},[[0,\"timePeriodChanged\",\"timePeriodChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-min-cancellation-notice.cjs\",[[65,\"nylas-min-cancellation-notice\",{\"selectedConfiguration\":[16],\"minCancellationNotice\":[2,\"min-cancellation-notice\"],\"name\":[1],\"selectedNumber\":[32],\"selectedPeriod\":[32]},[[0,\"timePeriodChanged\",\"timePeriodChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-booking-confirmation-redirect.cjs\",[[65,\"nylas-booking-confirmation-redirect\",{\"selectedConfiguration\":[16],\"name\":[1],\"redirectUrl\":[1,\"redirect-url\"],\"redirectUrlErrorMessage\":[1,\"redirect-url-error-message\"],\"currentRedirectUrl\":[32],\"acceptUrl\":[32],\"componentLoaded\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"],[0,\"nylasFormInputBlurred\",\"nylasFormInputBlurHandler\"],[4,\"formSubmitted\",\"formSubmittedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-connected-calendars.cjs\",[[65,\"nylas-connected-calendars\",{\"name\":[1],\"selectedConfiguration\":[16],\"participants\":[16],\"calendars\":[16],\"participantOptions\":[16],\"selectedCalendars\":[32],\"participantCalendars\":[32],\"participantDefaultSelectedCalendars\":[32]},[[0,\"valueChanged\",\"handleValueChanged\"]],{\"name\":[\"elementNameChangedHandler\"],\"calendars\":[\"calendarsChangedHandler\"],\"participants\":[\"participantsChangedHandler\"],\"participantOptions\":[\"participantOptionsChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-custom-event-slug.cjs\",[[65,\"nylas-custom-event-slug\",{\"selectedConfiguration\":[16],\"defaultUrlSlug\":[1,\"default-url-slug\"],\"isOpen\":[4,\"is-open\"],\"slugErrorMessage\":[1,\"slug-error-message\"],\"name\":[1],\"requiresSlug\":[4,\"requires-slug\"],\"urlSlug\":[32],\"focus\":[32],\"copied\":[32]},[[0,\"nylasFormInputChanged\",\"nylasFormInputChangeHandler\"],[0,\"nylasFormInputFocused\",\"nylasFormInputFocusHandler\"],[0,\"nylasFormInputBlurred\",\"nylasFormInputBlurHandler\"],[8,\"formSubmitted\",\"formSubmittedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-participant-booking-calendars.cjs\",[[65,\"nylas-participant-booking-calendars\",{\"selectedConfiguration\":[16],\"name\":[1],\"participants\":[16],\"calendars\":[16],\"participantOptions\":[16],\"selectedCalendars\":[32],\"participantCalendars\":[32],\"participantDefaultSelectedCalendar\":[32]},[[0,\"valueChanged\",\"handleValueChanged\"]],{\"name\":[\"elementNameChangedHandler\"],\"calendars\":[\"calendarsChangedHandler\"],\"participants\":[\"participantsChangedHandler\"],\"participantOptions\":[\"participantOptionsChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-scheduling-method.cjs\",[[65,\"nylas-scheduling-method\",{\"name\":[1],\"selectedConfiguration\":[16],\"participantOptions\":[16],\"readOnly\":[4,\"read-only\"],\"selectedBookingType\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"]}]]],[\"nylas-timeslot-interval.cjs\",[[65,\"nylas-timeslot-interval\",{\"selectedConfiguration\":[16],\"name\":[1],\"eventDurationMinutes\":[2,\"event-duration-minutes\"],\"defaultIntervalMinutes\":[2,\"default-interval-minutes\"],\"defaultRoundTo\":[2,\"default-round-to\"],\"internalEventDurationMinutes\":[32],\"selectedInterval\":[32],\"selectedRoundTo\":[32],\"componentLoaded\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"],[0,\"nylasFormRadioChanged\",\"nylasFormRadioChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-booking-confirmation-type.cjs\",[[65,\"nylas-booking-confirmation-type\",{\"selectedConfiguration\":[16],\"name\":[1],\"bookingType\":[1,\"booking-type\"],\"showComponent\":[4,\"show-component\"],\"selectedBookingType\":[32],\"showDropdown\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-buffer-time.cjs\",[[65,\"nylas-buffer-time\",{\"selectedConfiguration\":[16],\"name\":[1],\"buffer\":[16],\"selectedBeforeBufferTime\":[32],\"selectedAfterBufferTime\":[32],\"componentLoaded\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-event-duration.cjs\",[[65,\"nylas-event-duration\",{\"selectedConfiguration\":[16],\"name\":[1],\"eventDurationMinutes\":[2,\"event-duration-minutes\"],\"duration\":[32],\"durationMinutes\":[32],\"durationIncrement\":[32],\"durationMinutesOptions\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"],[0,\"inputOptionChanged\",\"inputOptionChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"],\"durationMinutes\":[\"durationMinutesChangedHandler\"]}]]],[\"nylas-page-name.cjs\",[[65,\"nylas-page-name\",{\"selectedConfiguration\":[16],\"pageName\":[1,\"page-name\"],\"showToggle\":[4,\"show-toggle\"],\"isOpen\":[4,\"is-open\"],\"name\":[1],\"currentPageName\":[32]},[[0,\"nylasFormInputChanged\",\"nylasFormInputChangeHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-customize-booking-settings.cjs\",[[65,\"nylas-customize-booking-settings\",{\"selectedConfiguration\":[16],\"defaultHideAdditionalGuests\":[4,\"default-hide-additional-guests\"],\"defaultHideCancellationOptions\":[4,\"default-hide-cancellation-options\"],\"defaultHideReschedulingOptions\":[4,\"default-hide-rescheduling-options\"],\"name\":[1],\"allowGuestsToInvite\":[32],\"hideCancellationOptions\":[32],\"hideReschedulingOptions\":[32]},[[0,\"nylasFormCheckboxToggled\",\"checkboxToggledHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-cancellation-policy.cjs\",[[65,\"nylas-cancellation-policy\",{\"selectedConfiguration\":[16],\"cancellationPolicy\":[1,\"cancellation-policy\"],\"name\":[1],\"message\":[32]},null,{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-event-description.cjs\",[[65,\"nylas-event-description\",{\"selectedConfiguration\":[16],\"eventDescription\":[1,\"event-description\"],\"name\":[1],\"description\":[32]},null,{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-event-title.cjs\",[[65,\"nylas-event-title\",{\"selectedConfiguration\":[16],\"eventTitle\":[1,\"event-title\"],\"name\":[1],\"showTokens\":[32],\"availableTokens\":[32],\"filteredTokens\":[32],\"ariaActivedescendant\":[32],\"currentWord\":[32],\"validationError\":[32],\"configEventTitle\":[32]},[[8,\"formSubmitted\",\"formSubmittedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"ariaActivedescendant\":[\"ariaActivedescendantChangedHandler\"],\"selectedConfiguration\":[\"configChangedHandler\"]}]]],[\"nylas-custom-booking-flow.cjs\",[[65,\"nylas-custom-booking-flow\"]]],[\"nylas-event-info.cjs\",[[65,\"nylas-event-info\"]]],[\"nylas-event-limits.cjs\",[[65,\"nylas-event-limits\"]]],[\"nylas-page-styling.cjs\",[[65,\"nylas-page-styling\",{\"selectedConfiguration\":[16],\"appearance\":[16],\"isOpen\":[4,\"is-open\"],\"name\":[1],\"currentAppearance\":[32],\"customInputsSlot\":[32]},[[4,\"nylasFormInputChanged\",\"nylasFormInputChangeHandler\"],[4,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"],[4,\"valueChanged\",\"valueChangedHandler\"],[4,\"nylasFormCheckboxToggled\",\"checkboxToggledHandler\"],[4,\"nylasFormRadioChanged\",\"radioChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"]}]]],[\"bold-icon.cjs\",[[2,\"bold-icon\",{\"width\":[1],\"height\":[1]}]]],[\"calendar-agenda-fill-icon.cjs\",[[2,\"calendar-agenda-fill-icon\",{\"width\":[1],\"height\":[1]}]]],[\"calendar-agenda-icon.cjs\",[[2,\"calendar-agenda-icon\",{\"width\":[1],\"height\":[1]}]]],[\"calendar-info-icon.cjs\",[[2,\"calendar-info-icon\",{\"width\":[1],\"height\":[1]}]]],[\"calendar-patterns-icon.cjs\",[[2,\"calendar-patterns-icon\",{\"width\":[1],\"height\":[1]}]]],[\"checkmark-circle-icon.cjs\",[[2,\"checkmark-circle-icon\",{\"width\":[1],\"height\":[1]}]]],[\"delete-icon.cjs\",[[2,\"delete-icon\",{\"width\":[1],\"height\":[1]}]]],[\"envelope-fill-icon.cjs\",[[2,\"envelope-fill-icon\",{\"width\":[1],\"height\":[1]}]]],[\"envelope-icon.cjs\",[[2,\"envelope-icon\",{\"width\":[1],\"height\":[1]}]]],[\"eye-icon.cjs\",[[2,\"eye-icon\",{\"width\":[1],\"height\":[1]}]]],[\"flow-icon.cjs\",[[2,\"flow-icon\",{\"width\":[1],\"height\":[1]}]]],[\"italic-icon.cjs\",[[2,\"italic-icon\",{\"width\":[1],\"height\":[1]}]]],[\"paintbrush-fill-icon.cjs\",[[2,\"paintbrush-fill-icon\",{\"width\":[1],\"height\":[1]}]]],[\"paintbrush-icon.cjs\",[[2,\"paintbrush-icon\",{\"width\":[1],\"height\":[1]}]]],[\"people-icon.cjs\",[[2,\"people-icon\",{\"width\":[1],\"height\":[1]}]]],[\"person-icon.cjs\",[[2,\"person-icon\",{\"width\":[1],\"height\":[1]}]]],[\"play-icon.cjs\",[[2,\"play-icon\",{\"width\":[1],\"height\":[1]}]]],[\"refresh-icon.cjs\",[[2,\"refresh-icon\",{\"width\":[1],\"height\":[1]}]]],[\"stop-icon.cjs\",[[2,\"stop-icon\",{\"width\":[1],\"height\":[1]}]]],[\"translate-icon.cjs\",[[2,\"translate-icon\",{\"width\":[1],\"height\":[1]}]]],[\"underline-icon.cjs\",[[2,\"underline-icon\",{\"width\":[1],\"height\":[1]}]]],[\"warning-icon.cjs\",[[2,\"warning-icon\",{\"width\":[1],\"height\":[1]}]]],[\"nylas-booking-calendar-picker.cjs\",[[65,\"nylas-booking-calendar-picker\",{\"calendars\":[16],\"currentUser\":[16],\"currentUserCalendars\":[16],\"name\":[1],\"defaultBookingCalendar\":[1,\"default-booking-calendar\"],\"hideHeader\":[4,\"hide-header\"],\"selectedCalendar\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"currentUserCalendars\":[\"currentUserCalendarsChangedHandler\"]}]]],[\"nylas-calendar-picker.cjs\",[[65,\"nylas-calendar-picker\",{\"calendars\":[16],\"currentUser\":[16],\"name\":[1],\"defaultSelectedCalendars\":[16],\"selectedCalendars\":[32],\"error\":[32]},[[0,\"selectedOptionsChanged\",\"selectedOptionsChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"]}]]],[\"input-image-url.cjs\",[[65,\"input-image-url\",{\"imageUrl\":[1,\"image-url\"],\"errorMessage\":[1,\"error-message\"],\"name\":[1],\"currentImageUrl\":[32]},[[0,\"nylasFormInputChanged\",\"nylasFormInputChangedHandler\"],[0,\"nylasFormInputBlurred\",\"nylasFormInputBlurHandler\"]],{\"name\":[\"elementNameChangedHandler\"]}]]],[\"calendar-check-icon.cjs\",[[2,\"calendar-check-icon\",{\"width\":[1],\"height\":[1]}]]],[\"checkmark-icon.cjs\",[[2,\"checkmark-icon\",{\"width\":[1],\"height\":[1]}]]],[\"dragable-icon.cjs\",[[2,\"dragable-icon\",{\"width\":[1],\"height\":[1]}]]],[\"google-meet-icon.cjs\",[[2,\"google-meet-icon\",{\"width\":[1],\"height\":[1]}]]],[\"location-icon.cjs\",[[2,\"location-icon\",{\"width\":[1],\"height\":[1]}]]],[\"location-off-icon.cjs\",[[2,\"location-off-icon\",{\"width\":[1],\"height\":[1]}]]],[\"microsoft-teams-icon.cjs\",[[2,\"microsoft-teams-icon\",{\"width\":[1],\"height\":[1]}]]],[\"toggle-switch.cjs\",[[1,\"toggle-switch\",{\"name\":[1],\"checked\":[4],\"label\":[1],\"isChecked\":[32]}]]],[\"zoom-icon.cjs\",[[2,\"zoom-icon\",{\"width\":[1],\"height\":[1]}]]],[\"multi-select-dropdown.cjs\",[[1,\"multi-select-dropdown\",{\"name\":[1],\"label\":[1],\"options\":[16],\"error\":[1],\"availableOptions\":[32],\"isOpen\":[32],\"ariaActivedescendant\":[32],\"shouldFocusFirstOption\":[32]},[[6,\"click\",\"handleOutsideClick\"]]]]],[\"calendar-cancel-icon.cjs\",[[2,\"calendar-cancel-icon\",{\"width\":[1],\"height\":[1]}]]],[\"calendar-icon.cjs\",[[2,\"calendar-icon\",{\"width\":[1],\"height\":[1]}]]],[\"copy-icon.cjs\",[[2,\"copy-icon\",{\"width\":[1],\"height\":[1]}]]],[\"nylas-time-window-picker.cjs\",[[1,\"nylas-time-window-picker\",{\"time\":[1],\"minimumStartTime\":[1,\"minimum-start-time\"],\"placeholder\":[1],\"name\":[1],\"hasError\":[4,\"has-error\"],\"err\":[32],\"showTimes\":[32],\"ariaActivedescendant\":[32],\"times\":[32],\"shouldAutoScroll\":[32]},[[6,\"click\",\"handleOutsideClick\"]],{\"minimumStartTime\":[\"minimumStartTimeChangedHandler\"]}]]],[\"person-clipboard-icon.cjs\",[[2,\"person-clipboard-icon\",{\"width\":[1],\"height\":[1]}]]],[\"plus-icon.cjs\",[[2,\"plus-icon\",{\"width\":[1],\"height\":[1]}]]],[\"search-icon.cjs\",[[2,\"search-icon\",{\"width\":[1],\"height\":[1]}]]],[\"chevron-icon.cjs\",[[2,\"chevron-icon\",{\"width\":[1],\"height\":[1]}]]],[\"select-dropdown.cjs\",[[1,\"select-dropdown\",{\"name\":[1],\"options\":[16],\"defaultSelectedOption\":[16],\"withSearch\":[4,\"with-search\"],\"label\":[1],\"required\":[4],\"pluralizedLabel\":[1,\"pluralized-label\"],\"dropdownButtonText\":[1,\"dropdown-button-text\"],\"withChevron\":[4,\"with-chevron\"],\"selectedOption\":[32],\"isOpen\":[32],\"searchValue\":[32],\"filteredOptions\":[32],\"ariaActivedescendant\":[32],\"errorMessage\":[32]},[[4,\"bookingFormSubmitted\",\"handleBookingFormSubmitted\"],[6,\"click\",\"handleOutsideClick\"]],{\"options\":[\"optionsChangedHandler\"],\"defaultSelectedOption\":[\"defaultSelectedOptionChangedHandler\"]}]]],[\"time-period-selector.cjs\",[[2,\"time-period-selector\",{\"timePeriods\":[16],\"defaultSelectedPeriod\":[1,\"default-selected-period\"],\"defaultSelectedNumber\":[2,\"default-selected-number\"],\"selectedPeriod\":[32],\"selectedNumber\":[32],\"numberOptions\":[32],\"timePeriodOptions\":[32]},[[0,\"inputOptionChanged\",\"inputOptionChangedHandler\"],[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"]]]]],[\"checkbox-component.cjs\",[[1,\"checkbox-component\",{\"name\":[1],\"checked\":[4],\"label\":[1],\"required\":[4],\"isChecked\":[32],\"error\":[32]},[[4,\"bookingFormSubmitted\",\"handleBookingFormSubmitted\"]]]]],[\"edit-icon.cjs\",[[2,\"edit-icon\",{\"width\":[1],\"height\":[1]}]]],[\"radio-button-group.cjs\",[[1,\"radio-button-group\",{\"name\":[1],\"options\":[16],\"defaultSelectedValue\":[1,\"default-selected-value\"],\"label\":[1],\"required\":[4],\"selectedValue\":[32],\"error\":[32]},[[4,\"bookingFormSubmitted\",\"handleBookingFormSubmitted\"]],{\"defaultSelectedValue\":[\"handleDefaultSelectedValueChange\"]}]]],[\"textarea-component.cjs\",[[1,\"textarea-component\",{\"name\":[1],\"defaultValue\":[1,\"default-value\"],\"label\":[1],\"placeholder\":[1],\"required\":[4],\"readOnly\":[4,\"read-only\"],\"autoFocus\":[4,\"auto-focus\"],\"maxLength\":[2,\"max-length\"],\"type\":[1],\"tooltip\":[1],\"value\":[32],\"error\":[32]},[[4,\"bookingFormSubmitted\",\"handleBookingFormSubmitted\"],[4,\"triggerValidation\",\"handletriggerValidation\"]]]]],[\"clock-icon.cjs\",[[2,\"clock-icon\",{\"width\":[1],\"height\":[1]}]]],[\"nylas-form-card.cjs\",[[65,\"nylas-form-card\"]]],[\"add-circle-icon.cjs\",[[2,\"add-circle-icon\",{\"width\":[1],\"height\":[1]}]]],[\"globe-icon.cjs\",[[2,\"globe-icon\",{\"width\":[1],\"height\":[1]}]]],[\"input-dropdown.cjs\",[[1,\"input-dropdown\",{\"name\":[1],\"options\":[16],\"defaultInputOption\":[16],\"inputValue\":[1,\"input-value\"],\"pluralizedLabel\":[1,\"pluralized-label\"],\"filterable\":[4],\"selectedOption\":[32],\"isOpen\":[32],\"typedValue\":[32],\"filteredOptions\":[32],\"ariaActivedescendant\":[32],\"shouldAutoScroll\":[32]},[[6,\"click\",\"handleOutsideClick\"]],{\"options\":[\"optionsChangedHandler\"],\"defaultInputOption\":[\"defaultSelectedOptionChangedHandler\"],\"inputValue\":[\"inputValueChangedHandler\"]}]]],[\"close-icon.cjs\",[[2,\"close-icon\",{\"width\":[1],\"height\":[1]}]]],[\"input-component.cjs\",[[1,\"input-component\",{\"name\":[1],\"defaultValue\":[1,\"default-value\"],\"label\":[1],\"type\":[1],\"placeholder\":[1],\"required\":[4],\"readOnly\":[4,\"read-only\"],\"autoFocus\":[4,\"auto-focus\"],\"pattern\":[16],\"maxLength\":[2,\"max-length\"],\"patternError\":[1,\"pattern-error\"],\"requiredError\":[1,\"required-error\"],\"value\":[32],\"error\":[32]},[[4,\"bookingFormSubmitted\",\"handleBookingFormSubmitted\"],[4,\"formSubmitted\",\"handleFormSubmitted\"]],{\"defaultValue\":[\"handleDefaultValueChange\"]}]]],[\"loading-icon.cjs\",[[1,\"loading-icon\",{\"width\":[1],\"height\":[1]}]]],[\"button-component.cjs\",[[6,\"button-component\",{\"variant\":[1],\"disabled\":[4],\"type\":[1],\"isLoading\":[4,\"is-loading\"],\"clickHandler\":[16],\"mouseOverHandler\":[16],\"mouseOutHandler\":[16],\"focusHandler\":[16],\"blurHandler\":[16]}]]],[\"tooltip-component.cjs\",[[1,\"tooltip-component\",{\"position\":[1]}]]],[\"info-icon.cjs\",[[2,\"info-icon\",{\"width\":[1],\"height\":[1]}]]]]"), options);
+  return index.bootstrapLazy(JSON.parse("[[\"nylas-availability-picker.cjs\",[[65,\"nylas-availability-picker\",{\"selectedConfiguration\":[16],\"openHours\":[16],\"name\":[1],\"defaultTimezone\":[1,\"default-timezone\"],\"hideHeader\":[4,\"hide-header\"],\"schedule\":[32],\"timezone\":[32],\"overlapDays\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"],[0,\"timeChange\",\"setTime\"],[0,\"formError\",\"setFormError\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"configChangedHandler\"],\"schedule\":[\"scheduleChanged\"]}]]],[\"nylas-scheduler-editor.cjs\",[[1,\"nylas-scheduler-editor\",{\"configurationId\":[1025,\"configuration-id\"],\"nylasApiRequest\":[1040],\"nylasSessionsConfig\":[16],\"defaultAuthArgs\":[16],\"eventOverrides\":[16],\"schedulerPreviewLink\":[1,\"scheduler-preview-link\"],\"defaultSchedulerConfigState\":[16],\"mode\":[1],\"additionalParticipants\":[16],\"hideEditorTabs\":[16],\"conferenceProviders\":[16],\"requiresSlug\":[4,\"requires-slug\"],\"automaticComponentRegistration\":[32],\"store\":[64],\"schedulerConnector\":[64]},[[0,\"registerComponent\",\"registerComponentHandler\"],[0,\"unregisterComponent\",\"unregisterComponentHandler\"]],{\"configurationId\":[\"configurationIdChanged\"]}]]],[\"nylas-scheduling.cjs\",[[1,\"nylas-scheduling\",{\"mode\":[1],\"defaultSchedulerState\":[16],\"sessionId\":[1,\"session-id\"],\"schedulerApiUrl\":[1,\"scheduler-api-url\"],\"bookingInfo\":[16],\"rescheduleBookingRef\":[1,\"reschedule-booking-ref\"],\"cancelBookingRef\":[1,\"cancel-booking-ref\"],\"organizerConfirmationBookingRef\":[1,\"organizer-confirmation-booking-ref\"],\"configurationId\":[1,\"configuration-id\"],\"slug\":[1],\"clientId\":[1,\"client-id\"],\"nylasBranding\":[4,\"nylas-branding\"],\"eventOverrides\":[16],\"isLoading\":[4,\"is-loading\"],\"themeConfig\":[16],\"localization\":[16],\"showNotification\":[4,\"show-notification\"],\"automaticComponentRegistration\":[32],\"selectedDateLabel\":[32],\"refConfigId\":[32],\"language\":[32],\"getNylasSchedulerStore\":[64],\"getNylasSchedulerConnector\":[64],\"getRef\":[64]},[[0,\"languageChanged\",\"languageChanged\"],[0,\"registerComponent\",\"registerComponentHandler\"],[0,\"unregisterComponent\",\"unregisterComponentHandler\"],[0,\"monthChanged\",\"monthChangedHandler\"],[0,\"detailsConfirmed\",\"bookButtonClickedHandler\"],[0,\"dateSelected\",\"dateSelectedHandler\"],[0,\"cancelBookedEventError\",\"cancelBookedEventErrorHandler\"],[0,\"cancelBookedEventValidationError\",\"cancelBookedEventValidationErrorHandler\"],[0,\"rescheduleBookedEventError\",\"rescheduleBookedEventErrorHandler\"],[0,\"confirmBookingError\",\"confirmBookingErrorHandler\"]],{\"bookingInfo\":[\"bookingInfoChanged\"],\"rescheduleBookingRef\":[\"rescheduleBookingRefChanged\"],\"cancelBookingRef\":[\"cancelBookingRefChanged\"],\"organizerConfirmationBookingRef\":[\"organizerConfirmationBookingRefChanged\"],\"localization\":[\"localizationChanged\"],\"themeConfig\":[\"themeConfigChanged\"]}]]],[\"nylas-reminder-emails.cjs\",[[65,\"nylas-reminder-emails\",{\"eventReminders\":[16],\"participants\":[16],\"name\":[1],\"reminders\":[32],\"reminderErrors\":[32],\"editingReminderIndex\":[32]},[[0,\"valueChanged\",\"handleValueChanged\"]],{\"name\":[\"elementNameChangedHandler\"]}]]],[\"nylas-view-thread.cjs\",[[1,\"nylas-view-thread\",{\"draft\":[16],\"thread\":[16],\"messages\":[16],\"attachments\":[16],\"state\":[32],\"internalMessages\":[32],\"showAllEmails\":[32],\"showComposer\":[32]},null,{\"thread\":[\"threadChanged\"],\"messages\":[\"updateInternalMessages\"]}]]],[\"nylas-list-folders.cjs\",[[1,\"nylas-list-folders\",{\"folders\":[16],\"selectedFolder\":[1,\"selected-folder\"],\"defaultFolders\":[32],\"otherFolders\":[32]},null,{\"folders\":[\"watchFolders\"]}]]],[\"nylas-mailbox-pagination.cjs\",[[1,\"nylas-mailbox-pagination\",{\"state\":[1],\"hasNextPage\":[4,\"has-next-page\"],\"hasPreviousPage\":[4,\"has-previous-page\"],\"scrollTarget\":[1,\"scroll-target\"],\"mobileOnlyInfiniteScroll\":[4,\"mobile-only-infinite-scroll\"],\"mobileViewPortWidth\":[2,\"mobile-view-port-width\"],\"nextPage\":[64],\"previousPage\":[64]},[[9,\"scroll\",\"handlePageScroll\"]]]]],[\"nylas-threads-refresh.cjs\",[[1,\"nylas-threads-refresh\",{\"start\":[32],\"state\":[32],\"pulling\":[32],\"updateState\":[64]}]]],[\"input-color-picker.cjs\",[[1,\"input-color-picker\",{\"name\":[1],\"defaultSelectedColor\":[1,\"default-selected-color\"],\"selectedColor\":[32],\"isOpen\":[32],\"ariaActivedescendant\":[32],\"errorMessage\":[32]},[[6,\"click\",\"handleOutsideClick\"]]]]],[\"document-refresh-icon.cjs\",[[2,\"document-refresh-icon\",{\"width\":[1],\"height\":[1]}]]],[\"nylas-if-state.cjs\",[[1,\"nylas-if-state\",{\"state\":[1],\"isStateSet\":[4,\"is-state-set\"],\"isBoolean\":[4,\"is-boolean\"],\"getStore\":[16],\"transition\":[1],\"show\":[32],\"classes\":[32]},null,{\"getStore\":[\"onGetStoreChange\"]}]]],[\"nylas-list-threads.cjs\",[[1,\"nylas-list-threads\",{\"threads\":[16],\"isAuthenticated\":[4,\"is-authenticated\"],\"tokenInfo\":[16],\"state\":[1],\"showCheckbox\":[4,\"show-checkbox\"]}]]],[\"nylas-login.cjs\",[[1,\"nylas-login\",{\"isAuthenticated\":[4,\"is-authenticated\"],\"nylasConnector\":[16],\"scopes\":[16],\"loginMethod\":[1,\"login-method\"],\"companyName\":[1,\"company-name\"],\"logoUrl\":[1,\"logo-url\"],\"logoWidth\":[1,\"logo-width\"],\"providers\":[1],\"buttonText\":[1,\"button-text\"],\"email\":[32]}]]],[\"nylas-mailbox.cjs\",[[1,\"nylas-mailbox\",{\"automaticComponentRegistration\":[4,\"automatic-component-registration\"],\"eventOverrides\":[16],\"authConfig\":[16],\"defaultAuthStoreState\":[16],\"defaultMailboxStoreState\":[16],\"getMailboxStore\":[64],\"getAuthStore\":[64],\"getNylasAuth\":[64],\"getNylasMailboxConnector\":[64]},[[0,\"registerComponent\",\"registerComponentHandler\"],[0,\"unregisterComponent\",\"unregisterComponentHandler\"]]]]],[\"nylas-mailbox-toolbar-button.cjs\",[[1,\"nylas-mailbox-toolbar-button\",{\"method\":[1],\"dataState\":[1,\"data-state\"],\"iconOnly\":[4,\"icon-only\"],\"mailboxConnector\":[16]}]]],[\"nylas-provider.cjs\",[[1,\"nylas-provider\",{\"authConfig\":[16],\"eventOverrides\":[16],\"automaticComponentRegistration\":[4,\"automatic-component-registration\"],\"getNylasAuth\":[64],\"getNylasConnector\":[64],\"getMailboxStore\":[64],\"getAuthStore\":[64],\"getNylasSchedulerStore\":[64],\"getNylasSchedulerConfigStore\":[64]},[[0,\"registerComponent\",\"registerComponentHandler\"],[0,\"unregisterComponent\",\"unregisterComponentHandler\"]]]]],[\"nylas-threads-search.cjs\",[[1,\"nylas-threads-search\",{\"query\":[1],\"internalQuery\":[32]},null,{\"query\":[\"onQueryChange\"]}]]],[\"nylas-editor-tabs.cjs\",[[6,\"nylas-editor-tabs\",{\"calendars\":[16],\"selectedConfiguration\":[16],\"currentUser\":[16],\"schedulerPreviewLink\":[1,\"scheduler-preview-link\"],\"mode\":[1],\"hideEditorTabs\":[16],\"action\":[32],\"activeTab\":[32],\"isLoading\":[32],\"hasUnsavedChanges\":[32],\"changesSaved\":[32],\"formState\":[32],\"error\":[32]},[[0,\"valueChanged\",\"handleValueChanged\"]],{\"selectedConfiguration\":[\"configChangedHandler\"],\"currentUser\":[\"userChangedHandler\"]}]]],[\"nylas-booking-form.cjs\",[[1,\"nylas-booking-form\",{\"isLoading\":[4,\"is-loading\"],\"bookingInfo\":[8,\"booking-info\"],\"eventInfo\":[16],\"configSettings\":[8,\"config-settings\"],\"name\":[32],\"email\":[32],\"guestEmails\":[32],\"guestEmailErrors\":[32],\"isNameValid\":[32],\"isEmailValid\":[32],\"additionalFields\":[32],\"validationError\":[32],\"backButtonLoading\":[32]},[[0,\"nylasFormInputChanged\",\"nylasFormInputChangedHandler\"],[0,\"nylasFormDropdownChanged\",\"selectOptionChangedHandler\"],[0,\"nylasFormSwitchToggled\",\"switchToggledHandler\"],[0,\"nylasFormCheckboxToggled\",\"checkboxToggledHandler\"],[0,\"nylasFormRadioChanged\",\"radioChangedHandler\"],[0,\"nylasFormDropdownDefaultSelected\",\"dropdownDefaultSelectedHandler\"]],{\"bookingInfo\":[\"bookingInfoChangedHandler\"]}]]],[\"nylas-list-configurations.cjs\",[[1,\"nylas-list-configurations\",{\"configurations\":[16],\"schedulerPreviewLink\":[1,\"scheduler-preview-link\"],\"listConfigurationsNextCursor\":[1,\"list-configurations-next-cursor\"],\"state\":[32],\"error\":[32],\"currentCursor\":[32],\"previousCursors\":[32],\"disableNextPageButton\":[32],\"getState\":[64],\"setState\":[64],\"setError\":[64]},[[0,\"nylasFormDropdownChanged\",\"handleNylasFormDropdownChanged\"]],{\"listConfigurationsNextCursor\":[\"listConfigurationsNextCursorChangedHandler\"]}]]],[\"nylas-cancel-booking-form.cjs\",[[1,\"nylas-cancel-booking-form\",{\"cancelBookingId\":[1,\"cancel-booking-id\"],\"rejectBookingId\":[1,\"reject-booking-id\"],\"configSettings\":[16],\"eventInfo\":[16],\"selectedTimeslot\":[16],\"isLoading\":[4,\"is-loading\"],\"cancellationReason\":[32],\"cancellationError\":[32],\"cancellationPolicy\":[32]},[[0,\"nylasFormInputChanged\",\"handleNylasFormInputChanged\"]],{\"configSettings\":[\"configSettingsChangedHandler\"]}]]],[\"nylas-booked-event-card.cjs\",[[1,\"nylas-booked-event-card\",{\"eventInfo\":[16],\"rescheduleBookingId\":[1,\"reschedule-booking-id\"],\"bookingInfo\":[8,\"booking-info\"],\"selectedTimezone\":[1,\"selected-timezone\"],\"selectedTimeslot\":[16],\"configSettings\":[8,\"config-settings\"],\"isLoading\":[4,\"is-loading\"],\"selectedLanguage\":[1,\"selected-language\"]}]]],[\"nylas-locale-switch.cjs\",[[1,\"nylas-locale-switch\",{\"selectedTimezone\":[1025,\"selected-timezone\"],\"selectedLanguage\":[1025,\"selected-language\"]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"]]]]],[\"nylas-reminder-time.cjs\",[[65,\"nylas-reminder-time\",{\"selectedConfiguration\":[16],\"name\":[1],\"eventReminderTimeMinutes\":[2,\"event-reminder-time-minutes\"],\"reminderTime\":[32],\"reminderTimeMinutes\":[32],\"reminderTimeincrement\":[32],\"reminderTimeMinutesOptions\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"],[0,\"inputOptionChanged\",\"inputOptionChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"reminderTimeMinutes\":[\"reminderTimeMinutesChangedHandler\"]}]]],[\"nylas-cancelled-event-card.cjs\",[[1,\"nylas-cancelled-event-card\",{\"cancelledEventInfo\":[16],\"configSettings\":[16],\"isClosing\":[32]}]]],[\"nylas-composer.cjs\",[[1,\"nylas-composer\",{\"message\":[16],\"viewEmailElement\":[16]},null,{\"message\":[\"watchBody\"]}]]],[\"nylas-confirmed-event-card.cjs\",[[1,\"nylas-confirmed-event-card\",{\"confirmedEventInfo\":[16],\"configSettings\":[16],\"isClosing\":[32]}]]],[\"nylas-date-picker.cjs\",[[1,\"nylas-date-picker\",{\"selectableDates\":[16],\"selectedDate\":[16],\"configSettings\":[16],\"selectedLanguage\":[1,\"selected-language\"],\"isLoading\":[4,\"is-loading\"],\"eventDuration\":[2,\"event-duration\"],\"month\":[32],\"dates\":[32],\"disableNextMonthButton\":[32]},null,{\"configSettings\":[\"configSettingsChanged\"],\"selectedLanguage\":[\"selectedLanguageChanged\"]}]]],[\"nylas-organizer-confirmation-card.cjs\",[[1,\"nylas-organizer-confirmation-card\",{\"organizerConfirmationBookingId\":[1,\"organizer-confirmation-booking-id\"],\"configSettings\":[8,\"config-settings\"],\"isLoading\":[4,\"is-loading\"],\"selectedLanguage\":[1,\"selected-language\"],\"action\":[32],\"resetAction\":[64]}]]],[\"nylas-summarize-message-button.cjs\",[[1,\"nylas-summarize-message-button\",{\"message\":[16],\"state\":[32],\"updateState\":[64],\"playAudio\":[64]}]]],[\"nylas-notification.cjs\",[[1,\"nylas-notification\",{\"ttl\":[8],\"allowedCategories\":[16],\"notifications\":[32]},[[16,\"nylasSchedulerError\",\"onError\"],[16,\"nylasSchedulerWarning\",\"onWarning\"],[16,\"nylasSchedulerInfo\",\"onInfo\"],[16,\"nylasSchedulerSuccess\",\"onSuccess\"]]]]],[\"nylas-selected-event-card.cjs\",[[1,\"nylas-selected-event-card\",{\"selectedDate\":[16],\"selectedTimeslot\":[16],\"selectedTimezone\":[1,\"selected-timezone\"],\"selectedLanguage\":[1,\"selected-language\"],\"startTime\":[32],\"endTime\":[32]}]]],[\"nylas-timeslot-picker.cjs\",[[1,\"nylas-timeslot-picker\",{\"selectedDate\":[16],\"availability\":[16],\"selectedTimeslot\":[16],\"isLoading\":[4,\"loading-state\"],\"selectedTimezone\":[1,\"selected-timezone\"],\"selectedLanguage\":[1,\"selected-language\"],\"times\":[32],\"hoveredTimeslotIndex\":[32],\"selectedTimeslotIndex\":[32]},null,{\"selectedLanguage\":[\"selectedLanguageChanged\"],\"selectedDate\":[\"selectedDateChanged\"],\"availability\":[\"availabilityChanged\"]}]]],[\"archive-icon.cjs\",[[2,\"archive-icon\",{\"width\":[1],\"height\":[1]}]]],[\"arrow-icon.cjs\",[[2,\"arrow-icon\",{\"width\":[1],\"height\":[1]}]]],[\"folder-icon.cjs\",[[2,\"folder-icon\",{\"width\":[1],\"height\":[1]}]]],[\"forward-icon.cjs\",[[2,\"forward-icon\",{\"width\":[1],\"height\":[1]}]]],[\"google-logo-icon.cjs\",[[2,\"google-logo-icon\",{\"width\":[1],\"height\":[1]}]]],[\"inbox-icon.cjs\",[[2,\"inbox-icon\",{\"width\":[1],\"height\":[1]}]]],[\"microsoft-logo-icon.cjs\",[[2,\"microsoft-logo-icon\",{\"width\":[1],\"height\":[1]}]]],[\"nylas-logo.cjs\",[[2,\"nylas-logo\",{\"width\":[1],\"height\":[1]}]]],[\"nylas-view-email.cjs\",[[1,\"nylas-view-email\",{\"message\":[16],\"parent\":[16],\"attachments\":[16],\"detectDarkMode\":[4,\"detect-dark-mode\"],\"state\":[32],\"sanitizedBody\":[32],\"styles\":[32],\"viewEmailElement\":[32],\"hoistedFontURLs\":[32]},[[9,\"resize\",\"handleScroll\"]],{\"message\":[\"messageChanged\"],\"viewEmailElement\":[\"viewEmailElementChanged\"]}]]],[\"reply-all-icon.cjs\",[[2,\"reply-all-icon\",{\"width\":[1],\"height\":[1]}]]],[\"reply-icon.cjs\",[[2,\"reply-icon\",{\"width\":[1],\"height\":[1]}]]],[\"sent-icon.cjs\",[[2,\"sent-icon\",{\"width\":[1],\"height\":[1]}]]],[\"spam-icon.cjs\",[[2,\"spam-icon\",{\"width\":[1],\"height\":[1]}]]],[\"star-icon.cjs\",[[2,\"star-icon\",{\"width\":[1],\"height\":[1]}]]],[\"trash-fill-icon.cjs\",[[2,\"trash-fill-icon\",{\"width\":[1],\"height\":[1]}]]],[\"trash-icon.cjs\",[[2,\"trash-icon\",{\"width\":[1],\"height\":[1]}]]],[\"nylas-confirmation-email.cjs\",[[65,\"nylas-confirmation-email\",{\"selectedConfiguration\":[16],\"confirmationEmailTemplate\":[16],\"isOpen\":[4,\"is-open\"],\"participants\":[16],\"name\":[1],\"confirmationEmail\":[32],\"isConfirmationEmailOpen\":[32],\"participantsState\":[32]},[[0,\"nylasFormInputChanged\",\"nylasFormInputChangeHandler\"],[0,\"valueChanged\",\"valueChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-participants-custom-availability.cjs\",[[65,\"nylas-participants-custom-availability\",{\"selectedConfiguration\":[16],\"name\":[1],\"participants\":[16],\"selectedParticipants\":[32]},[[0,\"nylasFormSwitchToggled\",\"nylasFormSwitchToggledHandler\"],[0,\"valueChanged\",\"handleValueChanged\"]],{\"name\":[\"elementNameChangedHandler\"],\"participants\":[\"participantsChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-event-location.cjs\",[[65,\"nylas-event-location\",{\"name\":[1],\"currentUser\":[16],\"userProvider\":[1,\"user-provider\"],\"eventConferencing\":[16],\"conferenceProviders\":[16],\"selectedConfiguration\":[16],\"eventLocation\":[1,\"event-location\"],\"location\":[32],\"grantId\":[32],\"selectedLocationOption\":[32],\"userProviderState\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-booking-form-config.cjs\",[[65,\"nylas-booking-form-config\",{\"selectedConfiguration\":[16],\"name\":[1],\"additonalFields\":[16],\"formFields\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"],[0,\"nylasFormInputChanged\",\"nylasFormInputChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"formFields\":[\"watchHandler\"]}]]],[\"nylas-additional-participants.cjs\",[[65,\"nylas-additional-participants\",{\"selectedConfiguration\":[16],\"currentUser\":[16],\"name\":[1],\"eventParticipants\":[16],\"participantOptions\":[16],\"participants\":[32],\"participantErrors\":[32],\"includeOrganizerAsParticipant\":[32],\"isRoundRobinConfig\":[32],\"error\":[32]},[[0,\"inputOptionChanged\",\"onInputOptionChanged\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-limit-future-bookings.cjs\",[[65,\"nylas-limit-future-bookings\",{\"selectedConfiguration\":[16],\"availableDaysInFuture\":[2,\"available-days-in-future\"],\"name\":[1],\"selectedNumber\":[32],\"selectedPeriod\":[32]},[[0,\"timePeriodChanged\",\"timePeriodChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-min-booking-notice.cjs\",[[65,\"nylas-min-booking-notice\",{\"selectedConfiguration\":[16],\"minBookingNotice\":[2,\"min-booking-notice\"],\"name\":[1],\"selectedNumber\":[32],\"selectedPeriod\":[32]},[[0,\"timePeriodChanged\",\"timePeriodChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-min-cancellation-notice.cjs\",[[65,\"nylas-min-cancellation-notice\",{\"selectedConfiguration\":[16],\"minCancellationNotice\":[2,\"min-cancellation-notice\"],\"name\":[1],\"selectedNumber\":[32],\"selectedPeriod\":[32]},[[0,\"timePeriodChanged\",\"timePeriodChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-booking-confirmation-redirect.cjs\",[[65,\"nylas-booking-confirmation-redirect\",{\"selectedConfiguration\":[16],\"name\":[1],\"redirectUrl\":[1,\"redirect-url\"],\"redirectUrlErrorMessage\":[1,\"redirect-url-error-message\"],\"currentRedirectUrl\":[32],\"acceptUrl\":[32],\"componentLoaded\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"],[0,\"nylasFormInputBlurred\",\"nylasFormInputBlurHandler\"],[4,\"formSubmitted\",\"formSubmittedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-connected-calendars.cjs\",[[65,\"nylas-connected-calendars\",{\"name\":[1],\"selectedConfiguration\":[16],\"participants\":[16],\"calendars\":[16],\"participantOptions\":[16],\"selectedCalendars\":[32],\"participantCalendars\":[32],\"participantDefaultSelectedCalendars\":[32]},[[0,\"valueChanged\",\"handleValueChanged\"]],{\"name\":[\"elementNameChangedHandler\"],\"calendars\":[\"calendarsChangedHandler\"],\"participants\":[\"participantsChangedHandler\"],\"participantOptions\":[\"participantOptionsChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-custom-event-slug.cjs\",[[65,\"nylas-custom-event-slug\",{\"selectedConfiguration\":[16],\"defaultUrlSlug\":[1,\"default-url-slug\"],\"isOpen\":[4,\"is-open\"],\"slugErrorMessage\":[1,\"slug-error-message\"],\"name\":[1],\"requiresSlug\":[4,\"requires-slug\"],\"urlSlug\":[32],\"focus\":[32],\"copied\":[32]},[[0,\"nylasFormInputChanged\",\"nylasFormInputChangeHandler\"],[0,\"nylasFormInputFocused\",\"nylasFormInputFocusHandler\"],[0,\"nylasFormInputBlurred\",\"nylasFormInputBlurHandler\"],[8,\"formSubmitted\",\"formSubmittedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-participant-booking-calendars.cjs\",[[65,\"nylas-participant-booking-calendars\",{\"selectedConfiguration\":[16],\"name\":[1],\"participants\":[16],\"calendars\":[16],\"participantOptions\":[16],\"selectedCalendars\":[32],\"participantCalendars\":[32],\"participantDefaultSelectedCalendar\":[32]},[[0,\"valueChanged\",\"handleValueChanged\"]],{\"name\":[\"elementNameChangedHandler\"],\"calendars\":[\"calendarsChangedHandler\"],\"participants\":[\"participantsChangedHandler\"],\"participantOptions\":[\"participantOptionsChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-scheduling-method.cjs\",[[65,\"nylas-scheduling-method\",{\"name\":[1],\"selectedConfiguration\":[16],\"participantOptions\":[16],\"readOnly\":[4,\"read-only\"],\"selectedBookingType\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"]}]]],[\"nylas-timeslot-interval.cjs\",[[65,\"nylas-timeslot-interval\",{\"selectedConfiguration\":[16],\"name\":[1],\"eventDurationMinutes\":[2,\"event-duration-minutes\"],\"defaultIntervalMinutes\":[2,\"default-interval-minutes\"],\"defaultRoundTo\":[2,\"default-round-to\"],\"internalEventDurationMinutes\":[32],\"selectedInterval\":[32],\"selectedRoundTo\":[32],\"componentLoaded\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"],[0,\"nylasFormRadioChanged\",\"nylasFormRadioChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-booking-confirmation-type.cjs\",[[65,\"nylas-booking-confirmation-type\",{\"selectedConfiguration\":[16],\"name\":[1],\"bookingType\":[1,\"booking-type\"],\"showComponent\":[4,\"show-component\"],\"selectedBookingType\":[32],\"showDropdown\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-buffer-time.cjs\",[[65,\"nylas-buffer-time\",{\"selectedConfiguration\":[16],\"name\":[1],\"buffer\":[16],\"selectedBeforeBufferTime\":[32],\"selectedAfterBufferTime\":[32],\"componentLoaded\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-event-duration.cjs\",[[65,\"nylas-event-duration\",{\"selectedConfiguration\":[16],\"name\":[1],\"eventDurationMinutes\":[2,\"event-duration-minutes\"],\"duration\":[32],\"durationMinutes\":[32],\"durationIncrement\":[32],\"durationMinutesOptions\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"],[0,\"inputOptionChanged\",\"inputOptionChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"],\"durationMinutes\":[\"durationMinutesChangedHandler\"]}]]],[\"nylas-page-name.cjs\",[[65,\"nylas-page-name\",{\"selectedConfiguration\":[16],\"pageName\":[1,\"page-name\"],\"showToggle\":[4,\"show-toggle\"],\"isOpen\":[4,\"is-open\"],\"name\":[1],\"currentPageName\":[32]},[[0,\"nylasFormInputChanged\",\"nylasFormInputChangeHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-customize-booking-settings.cjs\",[[65,\"nylas-customize-booking-settings\",{\"selectedConfiguration\":[16],\"defaultHideAdditionalGuests\":[4,\"default-hide-additional-guests\"],\"defaultHideCancellationOptions\":[4,\"default-hide-cancellation-options\"],\"defaultHideReschedulingOptions\":[4,\"default-hide-rescheduling-options\"],\"name\":[1],\"allowGuestsToInvite\":[32],\"hideCancellationOptions\":[32],\"hideReschedulingOptions\":[32]},[[0,\"nylasFormCheckboxToggled\",\"checkboxToggledHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-cancellation-policy.cjs\",[[65,\"nylas-cancellation-policy\",{\"selectedConfiguration\":[16],\"cancellationPolicy\":[1,\"cancellation-policy\"],\"name\":[1],\"message\":[32]},null,{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-event-description.cjs\",[[65,\"nylas-event-description\",{\"selectedConfiguration\":[16],\"eventDescription\":[1,\"event-description\"],\"name\":[1],\"description\":[32]},null,{\"name\":[\"elementNameChangedHandler\"],\"selectedConfiguration\":[\"selectedConfigurationChangedHandler\"]}]]],[\"nylas-event-title.cjs\",[[65,\"nylas-event-title\",{\"selectedConfiguration\":[16],\"eventTitle\":[1,\"event-title\"],\"name\":[1],\"showTokens\":[32],\"availableTokens\":[32],\"filteredTokens\":[32],\"ariaActivedescendant\":[32],\"currentWord\":[32],\"validationError\":[32],\"configEventTitle\":[32]},[[8,\"formSubmitted\",\"formSubmittedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"ariaActivedescendant\":[\"ariaActivedescendantChangedHandler\"],\"selectedConfiguration\":[\"configChangedHandler\"]}]]],[\"nylas-custom-booking-flow.cjs\",[[65,\"nylas-custom-booking-flow\"]]],[\"nylas-event-info.cjs\",[[65,\"nylas-event-info\"]]],[\"nylas-event-limits.cjs\",[[65,\"nylas-event-limits\"]]],[\"nylas-page-styling.cjs\",[[65,\"nylas-page-styling\",{\"selectedConfiguration\":[16],\"appearance\":[16],\"isOpen\":[4,\"is-open\"],\"name\":[1],\"currentAppearance\":[32],\"customInputsSlot\":[32]},[[4,\"nylasFormInputChanged\",\"nylasFormInputChangeHandler\"],[4,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"],[4,\"valueChanged\",\"valueChangedHandler\"],[4,\"nylasFormCheckboxToggled\",\"checkboxToggledHandler\"],[4,\"nylasFormRadioChanged\",\"radioChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"]}]]],[\"bold-icon.cjs\",[[2,\"bold-icon\",{\"width\":[1],\"height\":[1]}]]],[\"calendar-agenda-fill-icon.cjs\",[[2,\"calendar-agenda-fill-icon\",{\"width\":[1],\"height\":[1]}]]],[\"calendar-agenda-icon.cjs\",[[2,\"calendar-agenda-icon\",{\"width\":[1],\"height\":[1]}]]],[\"calendar-info-icon.cjs\",[[2,\"calendar-info-icon\",{\"width\":[1],\"height\":[1]}]]],[\"calendar-patterns-icon.cjs\",[[2,\"calendar-patterns-icon\",{\"width\":[1],\"height\":[1]}]]],[\"checkmark-circle-icon.cjs\",[[2,\"checkmark-circle-icon\",{\"width\":[1],\"height\":[1]}]]],[\"delete-icon.cjs\",[[2,\"delete-icon\",{\"width\":[1],\"height\":[1]}]]],[\"envelope-fill-icon.cjs\",[[2,\"envelope-fill-icon\",{\"width\":[1],\"height\":[1]}]]],[\"envelope-icon.cjs\",[[2,\"envelope-icon\",{\"width\":[1],\"height\":[1]}]]],[\"eye-icon.cjs\",[[2,\"eye-icon\",{\"width\":[1],\"height\":[1]}]]],[\"flow-icon.cjs\",[[2,\"flow-icon\",{\"width\":[1],\"height\":[1]}]]],[\"italic-icon.cjs\",[[2,\"italic-icon\",{\"width\":[1],\"height\":[1]}]]],[\"paintbrush-fill-icon.cjs\",[[2,\"paintbrush-fill-icon\",{\"width\":[1],\"height\":[1]}]]],[\"paintbrush-icon.cjs\",[[2,\"paintbrush-icon\",{\"width\":[1],\"height\":[1]}]]],[\"people-icon.cjs\",[[2,\"people-icon\",{\"width\":[1],\"height\":[1]}]]],[\"person-icon.cjs\",[[2,\"person-icon\",{\"width\":[1],\"height\":[1]}]]],[\"play-icon.cjs\",[[2,\"play-icon\",{\"width\":[1],\"height\":[1]}]]],[\"refresh-icon.cjs\",[[2,\"refresh-icon\",{\"width\":[1],\"height\":[1]}]]],[\"stop-icon.cjs\",[[2,\"stop-icon\",{\"width\":[1],\"height\":[1]}]]],[\"translate-icon.cjs\",[[2,\"translate-icon\",{\"width\":[1],\"height\":[1]}]]],[\"underline-icon.cjs\",[[2,\"underline-icon\",{\"width\":[1],\"height\":[1]}]]],[\"warning-icon.cjs\",[[2,\"warning-icon\",{\"width\":[1],\"height\":[1]}]]],[\"nylas-booking-calendar-picker.cjs\",[[65,\"nylas-booking-calendar-picker\",{\"calendars\":[16],\"currentUser\":[16],\"currentUserCalendars\":[16],\"name\":[1],\"defaultBookingCalendar\":[1,\"default-booking-calendar\"],\"hideHeader\":[4,\"hide-header\"],\"selectedCalendar\":[32]},[[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"],\"currentUserCalendars\":[\"currentUserCalendarsChangedHandler\"]}]]],[\"nylas-calendar-picker.cjs\",[[65,\"nylas-calendar-picker\",{\"calendars\":[16],\"currentUser\":[16],\"name\":[1],\"defaultSelectedCalendars\":[16],\"selectedCalendars\":[32],\"error\":[32]},[[0,\"selectedOptionsChanged\",\"selectedOptionsChangedHandler\"]],{\"name\":[\"elementNameChangedHandler\"]}]]],[\"input-image-url.cjs\",[[65,\"input-image-url\",{\"imageUrl\":[1,\"image-url\"],\"errorMessage\":[1,\"error-message\"],\"name\":[1],\"currentImageUrl\":[32]},[[0,\"nylasFormInputChanged\",\"nylasFormInputChangedHandler\"],[0,\"nylasFormInputBlurred\",\"nylasFormInputBlurHandler\"]],{\"name\":[\"elementNameChangedHandler\"]}]]],[\"calendar-check-icon.cjs\",[[2,\"calendar-check-icon\",{\"width\":[1],\"height\":[1]}]]],[\"checkmark-icon.cjs\",[[2,\"checkmark-icon\",{\"width\":[1],\"height\":[1]}]]],[\"dragable-icon.cjs\",[[2,\"dragable-icon\",{\"width\":[1],\"height\":[1]}]]],[\"google-meet-icon.cjs\",[[2,\"google-meet-icon\",{\"width\":[1],\"height\":[1]}]]],[\"location-icon.cjs\",[[2,\"location-icon\",{\"width\":[1],\"height\":[1]}]]],[\"location-off-icon.cjs\",[[2,\"location-off-icon\",{\"width\":[1],\"height\":[1]}]]],[\"microsoft-teams-icon.cjs\",[[2,\"microsoft-teams-icon\",{\"width\":[1],\"height\":[1]}]]],[\"toggle-switch.cjs\",[[1,\"toggle-switch\",{\"name\":[1],\"checked\":[4],\"label\":[1],\"isChecked\":[32]}]]],[\"zoom-icon.cjs\",[[2,\"zoom-icon\",{\"width\":[1],\"height\":[1]}]]],[\"multi-select-dropdown.cjs\",[[1,\"multi-select-dropdown\",{\"name\":[1],\"label\":[1],\"options\":[16],\"error\":[1],\"availableOptions\":[32],\"isOpen\":[32],\"ariaActivedescendant\":[32],\"shouldFocusFirstOption\":[32]},[[6,\"click\",\"handleOutsideClick\"]]]]],[\"calendar-cancel-icon.cjs\",[[2,\"calendar-cancel-icon\",{\"width\":[1],\"height\":[1]}]]],[\"calendar-icon.cjs\",[[2,\"calendar-icon\",{\"width\":[1],\"height\":[1]}]]],[\"copy-icon.cjs\",[[2,\"copy-icon\",{\"width\":[1],\"height\":[1]}]]],[\"nylas-time-window-picker.cjs\",[[1,\"nylas-time-window-picker\",{\"time\":[1],\"minimumStartTime\":[1,\"minimum-start-time\"],\"placeholder\":[1],\"name\":[1],\"hasError\":[4,\"has-error\"],\"err\":[32],\"showTimes\":[32],\"ariaActivedescendant\":[32],\"times\":[32],\"shouldAutoScroll\":[32]},[[6,\"click\",\"handleOutsideClick\"]],{\"minimumStartTime\":[\"minimumStartTimeChangedHandler\"]}]]],[\"person-clipboard-icon.cjs\",[[2,\"person-clipboard-icon\",{\"width\":[1],\"height\":[1]}]]],[\"plus-icon.cjs\",[[2,\"plus-icon\",{\"width\":[1],\"height\":[1]}]]],[\"search-icon.cjs\",[[2,\"search-icon\",{\"width\":[1],\"height\":[1]}]]],[\"chevron-icon.cjs\",[[2,\"chevron-icon\",{\"width\":[1],\"height\":[1]}]]],[\"select-dropdown.cjs\",[[1,\"select-dropdown\",{\"name\":[1],\"options\":[16],\"defaultSelectedOption\":[16],\"withSearch\":[4,\"with-search\"],\"label\":[1],\"required\":[4],\"pluralizedLabel\":[1,\"pluralized-label\"],\"dropdownButtonText\":[1,\"dropdown-button-text\"],\"withChevron\":[4,\"with-chevron\"],\"selectedOption\":[32],\"isOpen\":[32],\"searchValue\":[32],\"filteredOptions\":[32],\"ariaActivedescendant\":[32],\"errorMessage\":[32]},[[4,\"bookingFormSubmitted\",\"handleBookingFormSubmitted\"],[6,\"click\",\"handleOutsideClick\"]],{\"options\":[\"optionsChangedHandler\"],\"defaultSelectedOption\":[\"defaultSelectedOptionChangedHandler\"]}]]],[\"time-period-selector.cjs\",[[2,\"time-period-selector\",{\"timePeriods\":[16],\"defaultSelectedPeriod\":[1,\"default-selected-period\"],\"defaultSelectedNumber\":[2,\"default-selected-number\"],\"selectedPeriod\":[32],\"selectedNumber\":[32],\"numberOptions\":[32],\"timePeriodOptions\":[32]},[[0,\"inputOptionChanged\",\"inputOptionChangedHandler\"],[0,\"nylasFormDropdownChanged\",\"nylasFormDropdownChangedHandler\"]]]]],[\"checkbox-component.cjs\",[[1,\"checkbox-component\",{\"name\":[1],\"checked\":[4],\"label\":[1],\"required\":[4],\"isChecked\":[32],\"error\":[32]},[[4,\"bookingFormSubmitted\",\"handleBookingFormSubmitted\"]]]]],[\"edit-icon.cjs\",[[2,\"edit-icon\",{\"width\":[1],\"height\":[1]}]]],[\"radio-button-group.cjs\",[[1,\"radio-button-group\",{\"name\":[1],\"options\":[16],\"defaultSelectedValue\":[1,\"default-selected-value\"],\"label\":[1],\"required\":[4],\"selectedValue\":[32],\"error\":[32]},[[4,\"bookingFormSubmitted\",\"handleBookingFormSubmitted\"]],{\"defaultSelectedValue\":[\"handleDefaultSelectedValueChange\"]}]]],[\"textarea-component.cjs\",[[1,\"textarea-component\",{\"name\":[1],\"defaultValue\":[1,\"default-value\"],\"label\":[1],\"placeholder\":[1],\"required\":[4],\"readOnly\":[4,\"read-only\"],\"autoFocus\":[4,\"auto-focus\"],\"maxLength\":[2,\"max-length\"],\"type\":[1],\"tooltip\":[1],\"value\":[32],\"error\":[32]},[[4,\"bookingFormSubmitted\",\"handleBookingFormSubmitted\"],[4,\"triggerValidation\",\"handletriggerValidation\"]]]]],[\"clock-icon.cjs\",[[2,\"clock-icon\",{\"width\":[1],\"height\":[1]}]]],[\"nylas-form-card.cjs\",[[65,\"nylas-form-card\"]]],[\"add-circle-icon.cjs\",[[2,\"add-circle-icon\",{\"width\":[1],\"height\":[1]}]]],[\"globe-icon.cjs\",[[2,\"globe-icon\",{\"width\":[1],\"height\":[1]}]]],[\"input-dropdown.cjs\",[[1,\"input-dropdown\",{\"name\":[1],\"options\":[16],\"defaultInputOption\":[16],\"inputValue\":[1,\"input-value\"],\"pluralizedLabel\":[1,\"pluralized-label\"],\"filterable\":[4],\"selectedOption\":[32],\"isOpen\":[32],\"typedValue\":[32],\"filteredOptions\":[32],\"ariaActivedescendant\":[32],\"shouldAutoScroll\":[32]},[[6,\"click\",\"handleOutsideClick\"]],{\"options\":[\"optionsChangedHandler\"],\"defaultInputOption\":[\"defaultSelectedOptionChangedHandler\"],\"inputValue\":[\"inputValueChangedHandler\"]}]]],[\"close-icon.cjs\",[[2,\"close-icon\",{\"width\":[1],\"height\":[1]}]]],[\"input-component.cjs\",[[1,\"input-component\",{\"name\":[1],\"defaultValue\":[1,\"default-value\"],\"label\":[1],\"type\":[1],\"placeholder\":[1],\"required\":[4],\"readOnly\":[4,\"read-only\"],\"autoFocus\":[4,\"auto-focus\"],\"pattern\":[16],\"maxLength\":[2,\"max-length\"],\"patternError\":[1,\"pattern-error\"],\"requiredError\":[1,\"required-error\"],\"value\":[32],\"error\":[32]},[[4,\"bookingFormSubmitted\",\"handleBookingFormSubmitted\"],[4,\"formSubmitted\",\"handleFormSubmitted\"]],{\"defaultValue\":[\"handleDefaultValueChange\"]}]]],[\"loading-icon.cjs\",[[1,\"loading-icon\",{\"width\":[1],\"height\":[1]}]]],[\"button-component.cjs\",[[6,\"button-component\",{\"variant\":[1],\"disabled\":[4],\"type\":[1],\"isLoading\":[4,\"is-loading\"],\"clickHandler\":[16],\"mouseOverHandler\":[16],\"mouseOutHandler\":[16],\"focusHandler\":[16],\"blurHandler\":[16]}]]],[\"tooltip-component.cjs\",[[1,\"tooltip-component\",{\"position\":[1]}]]],[\"info-icon.cjs\",[[2,\"info-icon\",{\"width\":[1],\"height\":[1]}]]]]"), options);
 });
 exports.setNonce = index.setNonce;

package/dist/cjs/select-dropdown.cjs.entry.js CHANGED Viewed

@@ -10,6 +10,7 @@ const SelectDropdown = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.nylasFormDropdownChanged = index.createEvent(this, "nylasFormDropdownChanged", 7);
+        this.nylasFormDropdownDefaultSelected = index.createEvent(this, "nylasFormDropdownDefaultSelected", 7);
         this.componentType = 'select-dropdown';
         this.name = undefined;
         this.options = [];
@@ -38,6 +39,12 @@ const SelectDropdown = class {
             return;
         }
         this.selectedOption = newValue;
+        this.nylasFormDropdownDefaultSelected.emit({
+            value: newValue?.value || '',
+            name: this.name,
+            error: this.errorMessage,
+            label: this.label,
+        });
     }
     componentWillLoad() {
         this.el.setAttribute('component-type', this.componentType);
@@ -48,6 +55,12 @@ const SelectDropdown = class {
         if (!this.selectedOption && this.options.length > 0) {
             this.selectedOption = this.options[0];
         }
+        this.nylasFormDropdownDefaultSelected.emit({
+            value: this.selectedOption?.value || '',
+            name: this.name,
+            error: this.errorMessage,
+            label: this.label,
+        });
     }
     handleBookingFormSubmitted(event) {
         this.validate(this.selectedOption?.value || '');
@@ -173,7 +186,7 @@ const SelectDropdown = class {
     }
     render() {
         const buttonText = this.generateButtonText(this.selectedOption, this.dropdownButtonText);
-        return (index.h("div", { key: '45abbbfaacb891e1d331e42f822a5a2b4e12289c', class: "dropdown", part: "sd_dropdown" }, index.h("label", { key: 'aad1cd53c176003fe04ae372aebc4743cb4830a0', part: "sd_dropdown_label", class: { error: !!this.errorMessage } }, this.label && (index.h("p", null, index.h("span", { class: "label" }, this.label), this.required && index.h("span", { class: "required" }, "*"))), index.h("button", { key: '5feca05e8b0ef951b8043a4bfeaa25f0de6d4789', part: "sd_dropdown-button", class: { dropbtn: true, open: this.isOpen, error: !!this.errorMessage }, onClick: () => this.toggleDropdown(), "aria-haspopup": "listbox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.name, onKeyDown: e => this.handleSelectButtonKeyDown(e) }, index.h("slot", { key: '410360c7661bfde11430153da1ff97b011c46626', name: "select-icon", "aria-hidden": "true" }), index.h("span", { key: 'c87c03c32ef91c57ed054a35931c49df7c796e49', class: "selected-option", part: "sd_dropdown-button-selected-label" }, buttonText), this.withChevron && (index.h("span", { class: {
+        return (index.h("div", { key: '4b724d892194708b2dcd0ed74c8e23486ba2b4f7', class: "dropdown", part: "sd_dropdown" }, index.h("label", { key: '06d33f4f5daa7c09eed054505989210e35c2beb5', part: "sd_dropdown_label", class: { error: !!this.errorMessage } }, this.label && (index.h("p", null, index.h("span", { class: "label" }, this.label), this.required && index.h("span", { class: "required" }, "*"))), index.h("button", { key: '8e5952f7e2a1279670304e82f329da3e8e60522a', part: "sd_dropdown-button", class: { dropbtn: true, open: this.isOpen, error: !!this.errorMessage }, onClick: () => this.toggleDropdown(), "aria-haspopup": "listbox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.name, onKeyDown: e => this.handleSelectButtonKeyDown(e) }, index.h("slot", { key: 'aece407da3b35858b9ec1248d09447706b3120cc', name: "select-icon", "aria-hidden": "true" }), index.h("span", { key: '55aae4a92f862c81533635999fb60693705cb12b', class: "selected-option", part: "sd_dropdown-button-selected-label" }, buttonText), this.withChevron && (index.h("span", { class: {
                 open: this.isOpen,
                 closed: !this.isOpen,
                 chevron: true,

package/dist/cjs/select-dropdown.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"select-dropdown.entry.cjs.js","mappings":"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","names":["h"],"sources":["src/components/design-system/select-dropdown/select-dropdown.scss?tag=select-dropdown&encapsulation=shadow","src/components/design-system/select-dropdown/select-dropdown.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n@import '../../../common/mixins/inputs.scss';\n\n:host {\n display: block;\n position: relative;\n @media #{$mobile} {\n position: unset;\n }\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 p {\n margin: 0;\n }\n .error {\n color: var(--nylas-error);\n }\n}\n\n.dropdown {\n display: inline-block;\n width: inherit;\n}\n\n.dropbtn {\n color: var(--nylas-base-800);\n padding: 14px;\n font-size: 1rem;\n font-family: var(--nylas-font-family);\n cursor: pointer;\n display: flex;\n justify-content: space-between;\n gap: 0.5rem;\n background: transparent;\n border: 1px solid var(--nylas-base-300);\n border-radius: var(--nylas-border-radius-2x);\n &.error {\n border: 1px solid var(--nylas-error);\n }\n &.focus {\n background: transparent;\n }\n &:hover,\n &:active {\n outline: 1px solid var(--nylas-primary);\n }\n &:active {\n outline: 2px solid var(--nylas-primary);\n }\n span {\n &.chevron {\n display: flex;\n align-self: center;\n }\n &.open {\n transform: rotate(90deg);\n }\n &.closed {\n transform: rotate(270deg);\n }\n &.selected-option {\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n max-width: 144px;\n font-size: 14px;\n line-height: 20px;\n @media #{$mobile} {\n max-width: 124px;\n font-size: 16px;\n }\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 @media #{$mobile} {\n right: 0;\n width: 325px;\n max-width: unset;\n }\n box-shadow: 0px 4px 6px -2px rgba(0, 0, 0, 0.05);\n box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);\n}\n\n.search-box {\n border-bottom: 1px solid var(--nylas-base-200);\n padding: 10px;\n position: sticky;\n top: 0;\n background: var(--nylas-base-0);\n .icon {\n position: absolute;\n top: 1.25rem;\n left: 1.25rem;\n color: var(--nylas-base-300);\n }\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 li {\n padding: 16px, 12px, 16px, 12px;\n color: black;\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 &:hover,\n &:focus {\n background-color: var(--nylas-base-100);\n }\n }\n}\n\n.dropdown-content .selected {\n background-color: #e7e7e7;\n}\n\ninput[type='text'] {\n width: -webkit-fill-available;\n padding: inherit;\n border: 1px solid #ccc;\n border-radius: 4px;\n position: sticky;\n background: no-repeat scroll 7px 7px;\n padding-left: 30px;\n background-size: 16px 16px;\n}\n","import { Component, Element, Event, EventEmitter, h, Listen, Prop, State, Watch } from '@stencil/core';\n\ninterface DropdownOption {\n labelHTML?: HTMLElement;\n label: string;\n value: string;\n}\n\n/*\n The `select-dropdown` component is a dropdown that allows users to select an option from a list of options.\n * This component is used in the scheduling form to input dropdown type inputs.\n * @part sd_dropdown - The dropdown container\n * @part sd_dropdown-button - The dropdown button\n * @part sd_dropdown-button-selected-label - The selected option label\n * @part sd_dropdown-content - The dropdown content\n * @part sd_dropdown_label - The dropdown label\n /\n@Component({\n tag: 'select-dropdown',\n styleUrl: 'select-dropdown.scss',\n shadow: true,\n})\nexport class SelectDropdown {\n @Element() el!: HTMLElement;\n private readonly componentType: string = 'select-dropdown';\n\n private inputRef?: HTMLInputElement;\n\n // Props\n /\n The name of the dropdown\n /\n @Prop() name!: string;\n /\n The options to display in the dropdown\n /\n @Prop() options: DropdownOption[] = [];\n /\n The default selected option\n /\n @Prop({ attribute: 'default-selected-option' }) defaultSelectedOption: DropdownOption \| null = null;\n /\n Should show search input\n /\n @Prop() withSearch: boolean = true;\n\n /\n The label for the dropdown, skipped if no label is provided\n /\n @Prop() label?: string;\n\n /\n If true, the dropdown is required for form submission\n /\n @Prop() required: boolean = false;\n\n /\n Show pluralized label for the selected option. This is s tring that is appended to the selected option label as a suffix.\n /\n @Prop() pluralizedLabel: string = '';\n /\n Overrides the select dropdown to be used as a button with dropdownButtonText representing actions & dropdownText name on the dropdown intead of selected value\n /\n @Prop() dropdownButtonText?: string;\n /\n Should show chevron on button\n /\n @Prop() withChevron: boolean = true;\n // States\n /\n The selected option\n /\n @State() selectedOption!: DropdownOption \| null;\n /\n The open state of the dropdown\n /\n @State() isOpen: boolean = false;\n /\n The search value for the dropdown\n /\n @State() searchValue: string = '';\n /\n The filtered options based on the search value\n /\n @State() filteredOptions: DropdownOption[] = [...this.options];\n /\n The aria-activedescendant attribute for the listbox element to indicate the currently active\n * option in the list box to screen readers. The value of aria-activedescendant is the ID of\n * the active option.\n /\n @State() ariaActivedescendant: string = '';\n\n /\n The error message to display when the value is empty or null and the dropdown is required\n /\n @State() errorMessage: string = '';\n\n // Events\n /\n This event is fired when the selected option is changed\n /\n @Event({ bubbles: true, composed: true }) nylasFormDropdownChanged!: EventEmitter<{\n value: DropdownOption['value'];\n name: string;\n error?: string;\n label?: string;\n }>;\n\n @Watch('options')\n optionsChangedHandler(newValue: DropdownOption[], oldValue: DropdownOption[]) {\n if (newValue === oldValue) {\n return;\n }\n this.filteredOptions = newValue;\n }\n\n @Watch('defaultSelectedOption')\n defaultSelectedOptionChangedHandler(newValue: DropdownOption, oldValue: DropdownOption) {\n if (typeof newValue === 'undefined' \|\| newValue?.label === oldValue?.label) {\n return;\n }\n this.selectedOption = newValue;\n }\n\n // Lifecycle methods\n componentWillLoad() {\n this.el.setAttribute('component-type', this.componentType);\n }\n\n componentDidLoad() {\n this.filteredOptions = this.options;\n // Set the selected option to the first option if no option is selected\n this.selectedOption = this.defaultSelectedOption;\n\n if (!this.selectedOption && this.options.length > 0) {\n this.selectedOption = this.options[0];\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.validate(this.selectedOption?.value \|\| '');\n if (this.errorMessage) {\n event.preventDefault();\n }\n }\n\n // Methods\n validate(value: string) {\n if (this.required && !value) {\n this.errorMessage = `${this.label} is required.`;\n } else {\n this.errorMessage = '';\n }\n }\n toggleDropdown(): void {\n this.isOpen = !this.isOpen;\n }\n\n filterOptions(event: Event): void {\n const value = (event.target as HTMLInputElement).value;\n this.searchValue = value;\n this.filteredOptions = this.options.filter(option => option.label.toLowerCase().includes(value.toLowerCase()));\n }\n\n selectOption(option: DropdownOption): void {\n this.errorMessage = '';\n this.selectedOption = option;\n this.toggleDropdown();\n this.nylasFormDropdownChanged.emit({\n value: option.value,\n name: this.name,\n error: this.errorMessage,\n label: this.label,\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 this.inputRef?.focus();\n break;\n case 'Escape':\n this.isOpen = false;\n break;\n }\n }\n\n handleListboxKeydown(e) {\n const items = this.filteredOptions; // Assuming this is the array of your current filtered options\n const currentIndex = items.findIndex(item => item.value === this.ariaActivedescendant);\n if (e.key === 'ArrowDown' \|\| (e.key === 'Tab' && !e.shiftKey)) {\n e.preventDefault();\n if (currentIndex === items.length - 1) {\n this.ariaActivedescendant = '';\n this.inputRef?.focus();\n return;\n }\n const nextIndex = currentIndex + 1 < items.length ? currentIndex + 1 : 0;\n this.ariaActivedescendant = items[nextIndex].value;\n this.focusOption(nextIndex);\n } else if (e.key === 'ArrowUp' \|\| (e.key === 'Tab' && e.shiftKey)) {\n e.preventDefault();\n if (currentIndex === 0) {\n this.ariaActivedescendant = '';\n this.inputRef?.focus();\n return;\n }\n const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;\n this.ariaActivedescendant = items[prevIndex].value;\n this.focusOption(prevIndex);\n } else if (e.key === 'Enter') {\n e.preventDefault();\n if (this.ariaActivedescendant) {\n this.selectOption(items[currentIndex]);\n }\n } else if (e.key === 'Escape') {\n this.isOpen = false;\n }\n }\n\n focusOption(index) {\n const option = this.filteredOptions[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 handleComboboxKeyDown(event: KeyboardEvent): void {\n if (event.key === 'ArrowDown' \|\| (event.key == 'Tab' && !event.shiftKey)) {\n event.preventDefault();\n this.ariaActivedescendant = this.filteredOptions[0].value;\n this.focusOption(0);\n } else if (event.key === 'ArrowUp' \|\| (event.key === 'Tab' && event.shiftKey)) {\n event.preventDefault();\n this.ariaActivedescendant = this.filteredOptions[this.filteredOptions.length - 1].value;\n this.focusOption(this.filteredOptions.length - 1);\n } else if (event.key === 'Escape') {\n this.isOpen = false;\n }\n }\n\n generateButtonText(option: DropdownOption \| null, dropButtonText?: string): string {\n if (dropButtonText) {\n return dropButtonText;\n }\n return option?.label ? `${option?.label + this.pluralizedLabel}` : '';\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 render() {\n const buttonText = this.generateButtonText(this.selectedOption, this.dropdownButtonText);\n\n return (\n <div class=\"dropdown\" part=\"sd_dropdown\">\n <label part=\"sd_dropdown_label\" class={{ error: !!this.errorMessage }}>\n {this.label && (\n <p>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\"></span>}\n </p>\n )}\n <button\n part=\"sd_dropdown-button\"\n class={{ dropbtn: true, open: this.isOpen, error: !!this.errorMessage }}\n onClick={() => this.toggleDropdown()}\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=\"sd_dropdown-button-selected-label\">\n {buttonText}\n </span>\n {this.withChevron && (\n <span\n class={{\n open: this.isOpen,\n closed: !this.isOpen,\n chevron: true,\n }}\n aria-hidden=\"true\"\n >\n <chevron-icon width=\"16\" height=\"16\" />\n </span>\n )}\n </button>\n {this.errorMessage && <span class=\"error help-text\">{this.errorMessage}</span>}\n </label>\n\n {this.isOpen ? (\n <div class=\"dropdown-content\" part=\"sd_dropdown-content\">\n {this.withSearch && (\n <div class={{ 'search-box': true, 'open': this.isOpen }}>\n <search-icon width=\"15\" height=\"15\" class={'icon'} />\n <input\n type=\"text\"\n role=\"combobox\"\n placeholder=\"Search\"\n value={this.searchValue}\n ref={el => (this.inputRef = el)}\n onInput={event => this.filterOptions(event)}\n onKeyDown={e => this.handleComboboxKeyDown(e)}\n />\n </div>\n )}\n <ul tabindex=\"-1\" role=\"listbox\" aria-label={this.name} aria-activedescendant={this.ariaActivedescendant} onKeyDown={e => this.handleListboxKeydown(e)}>\n {this.filteredOptions.map(option =>\n option.value.toString() ? (\n <li tabindex=\"0\" key={option.value} id={option.value} onClick={() => this.selectOption(option)} role=\"option\">\n {option.labelHTML ? <div part=\"sd_dropdown-labelhtml\">{option.labelHTML}</div> : option.label}\n </li>\n ) : null,\n )}\n </ul>\n </div>\n ) : null}\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"select-dropdown.entry.cjs.js","mappings":"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","names":["h"],"sources":["src/components/design-system/select-dropdown/select-dropdown.scss?tag=select-dropdown&encapsulation=shadow","src/components/design-system/select-dropdown/select-dropdown.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n@import '../../../common/mixins/inputs.scss';\n\n:host {\n display: block;\n position: relative;\n @media #{$mobile} {\n position: unset;\n }\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 p {\n margin: 0;\n }\n .error {\n color: var(--nylas-error);\n }\n}\n\n.dropdown {\n display: inline-block;\n width: inherit;\n}\n\n.dropbtn {\n color: var(--nylas-base-800);\n padding: 14px;\n font-size: 1rem;\n font-family: var(--nylas-font-family);\n cursor: pointer;\n display: flex;\n justify-content: space-between;\n gap: 0.5rem;\n background: transparent;\n border: 1px solid var(--nylas-base-300);\n border-radius: var(--nylas-border-radius-2x);\n &.error {\n border: 1px solid var(--nylas-error);\n }\n &.focus {\n background: transparent;\n }\n &:hover,\n &:active {\n outline: 1px solid var(--nylas-primary);\n }\n &:active {\n outline: 2px solid var(--nylas-primary);\n }\n span {\n &.chevron {\n display: flex;\n align-self: center;\n }\n &.open {\n transform: rotate(90deg);\n }\n &.closed {\n transform: rotate(270deg);\n }\n &.selected-option {\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n max-width: 144px;\n font-size: 14px;\n line-height: 20px;\n @media #{$mobile} {\n max-width: 124px;\n font-size: 16px;\n }\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 @media #{$mobile} {\n right: 0;\n width: 325px;\n max-width: unset;\n }\n box-shadow: 0px 4px 6px -2px rgba(0, 0, 0, 0.05);\n box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);\n}\n\n.search-box {\n border-bottom: 1px solid var(--nylas-base-200);\n padding: 10px;\n position: sticky;\n top: 0;\n background: var(--nylas-base-0);\n .icon {\n position: absolute;\n top: 1.25rem;\n left: 1.25rem;\n color: var(--nylas-base-300);\n }\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 li {\n padding: 16px, 12px, 16px, 12px;\n color: black;\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 &:hover,\n &:focus {\n background-color: var(--nylas-base-100);\n }\n }\n}\n\n.dropdown-content .selected {\n background-color: #e7e7e7;\n}\n\ninput[type='text'] {\n width: -webkit-fill-available;\n padding: inherit;\n border: 1px solid #ccc;\n border-radius: 4px;\n position: sticky;\n background: no-repeat scroll 7px 7px;\n padding-left: 30px;\n background-size: 16px 16px;\n}\n","import { Component, Element, Event, EventEmitter, h, Listen, Prop, State, Watch } from '@stencil/core';\n\ninterface DropdownOption {\n labelHTML?: HTMLElement;\n label: string;\n value: string;\n}\n\n/*\n The `select-dropdown` component is a dropdown that allows users to select an option from a list of options.\n * This component is used in the scheduling form to input dropdown type inputs.\n * @part sd_dropdown - The dropdown container\n * @part sd_dropdown-button - The dropdown button\n * @part sd_dropdown-button-selected-label - The selected option label\n * @part sd_dropdown-content - The dropdown content\n * @part sd_dropdown_label - The dropdown label\n /\n@Component({\n tag: 'select-dropdown',\n styleUrl: 'select-dropdown.scss',\n shadow: true,\n})\nexport class SelectDropdown {\n @Element() el!: HTMLElement;\n private readonly componentType: string = 'select-dropdown';\n\n private inputRef?: HTMLInputElement;\n\n // Props\n /\n The name of the dropdown\n /\n @Prop() name!: string;\n /\n The options to display in the dropdown\n /\n @Prop() options: DropdownOption[] = [];\n /\n The default selected option\n /\n @Prop({ attribute: 'default-selected-option' }) defaultSelectedOption: DropdownOption \| null = null;\n /\n Should show search input\n /\n @Prop() withSearch: boolean = true;\n\n /\n The label for the dropdown, skipped if no label is provided\n /\n @Prop() label?: string;\n\n /\n If true, the dropdown is required for form submission\n /\n @Prop() required: boolean = false;\n\n /\n Show pluralized label for the selected option. This is s tring that is appended to the selected option label as a suffix.\n /\n @Prop() pluralizedLabel: string = '';\n /\n Overrides the select dropdown to be used as a button with dropdownButtonText representing actions & dropdownText name on the dropdown intead of selected value\n /\n @Prop() dropdownButtonText?: string;\n /\n Should show chevron on button\n /\n @Prop() withChevron: boolean = true;\n // States\n /\n The selected option\n /\n @State() selectedOption!: DropdownOption \| null;\n /\n The open state of the dropdown\n /\n @State() isOpen: boolean = false;\n /\n The search value for the dropdown\n /\n @State() searchValue: string = '';\n /\n The filtered options based on the search value\n /\n @State() filteredOptions: DropdownOption[] = [...this.options];\n /\n The aria-activedescendant attribute for the listbox element to indicate the currently active\n * option in the list box to screen readers. The value of aria-activedescendant is the ID of\n * the active option.\n /\n @State() ariaActivedescendant: string = '';\n\n /\n The error message to display when the value is empty or null and the dropdown is required\n /\n @State() errorMessage: string = '';\n\n // Events\n /\n This event is fired when the selected option is changed\n /\n @Event({ bubbles: true, composed: true }) nylasFormDropdownChanged!: EventEmitter<{\n value: DropdownOption['value'];\n name: string;\n error?: string;\n label?: string;\n }>;\n\n /\n This event is fired when the default selected option is set, on component load\n /\n @Event({ bubbles: true, composed: true }) nylasFormDropdownDefaultSelected!: EventEmitter<{\n value: DropdownOption['value'];\n name: string;\n error?: string;\n label?: string;\n }>;\n\n @Watch('options')\n optionsChangedHandler(newValue: DropdownOption[], oldValue: DropdownOption[]) {\n if (newValue === oldValue) {\n return;\n }\n this.filteredOptions = newValue;\n }\n\n @Watch('defaultSelectedOption')\n defaultSelectedOptionChangedHandler(newValue: DropdownOption, oldValue: DropdownOption) {\n if (typeof newValue === 'undefined' \|\| newValue?.label === oldValue?.label) {\n return;\n }\n this.selectedOption = newValue;\n this.nylasFormDropdownDefaultSelected.emit({\n value: newValue?.value \|\| '',\n name: this.name,\n error: this.errorMessage,\n label: this.label,\n });\n }\n\n // Lifecycle methods\n componentWillLoad() {\n this.el.setAttribute('component-type', this.componentType);\n }\n\n componentDidLoad() {\n this.filteredOptions = this.options;\n // Set the selected option to the first option if no option is selected\n this.selectedOption = this.defaultSelectedOption;\n\n if (!this.selectedOption && this.options.length > 0) {\n this.selectedOption = this.options[0];\n }\n this.nylasFormDropdownDefaultSelected.emit({\n value: this.selectedOption?.value \|\| '',\n name: this.name,\n error: this.errorMessage,\n label: this.label,\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.validate(this.selectedOption?.value \|\| '');\n if (this.errorMessage) {\n event.preventDefault();\n }\n }\n\n // Methods\n validate(value: string) {\n if (this.required && !value) {\n this.errorMessage = `${this.label} is required.`;\n } else {\n this.errorMessage = '';\n }\n }\n toggleDropdown(): void {\n this.isOpen = !this.isOpen;\n }\n\n filterOptions(event: Event): void {\n const value = (event.target as HTMLInputElement).value;\n this.searchValue = value;\n this.filteredOptions = this.options.filter(option => option.label.toLowerCase().includes(value.toLowerCase()));\n }\n\n selectOption(option: DropdownOption): void {\n this.errorMessage = '';\n this.selectedOption = option;\n this.toggleDropdown();\n this.nylasFormDropdownChanged.emit({\n value: option.value,\n name: this.name,\n error: this.errorMessage,\n label: this.label,\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 this.inputRef?.focus();\n break;\n case 'Escape':\n this.isOpen = false;\n break;\n }\n }\n\n handleListboxKeydown(e) {\n const items = this.filteredOptions; // Assuming this is the array of your current filtered options\n const currentIndex = items.findIndex(item => item.value === this.ariaActivedescendant);\n if (e.key === 'ArrowDown' \|\| (e.key === 'Tab' && !e.shiftKey)) {\n e.preventDefault();\n if (currentIndex === items.length - 1) {\n this.ariaActivedescendant = '';\n this.inputRef?.focus();\n return;\n }\n const nextIndex = currentIndex + 1 < items.length ? currentIndex + 1 : 0;\n this.ariaActivedescendant = items[nextIndex].value;\n this.focusOption(nextIndex);\n } else if (e.key === 'ArrowUp' \|\| (e.key === 'Tab' && e.shiftKey)) {\n e.preventDefault();\n if (currentIndex === 0) {\n this.ariaActivedescendant = '';\n this.inputRef?.focus();\n return;\n }\n const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;\n this.ariaActivedescendant = items[prevIndex].value;\n this.focusOption(prevIndex);\n } else if (e.key === 'Enter') {\n e.preventDefault();\n if (this.ariaActivedescendant) {\n this.selectOption(items[currentIndex]);\n }\n } else if (e.key === 'Escape') {\n this.isOpen = false;\n }\n }\n\n focusOption(index) {\n const option = this.filteredOptions[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 handleComboboxKeyDown(event: KeyboardEvent): void {\n if (event.key === 'ArrowDown' \|\| (event.key == 'Tab' && !event.shiftKey)) {\n event.preventDefault();\n this.ariaActivedescendant = this.filteredOptions[0].value;\n this.focusOption(0);\n } else if (event.key === 'ArrowUp' \|\| (event.key === 'Tab' && event.shiftKey)) {\n event.preventDefault();\n this.ariaActivedescendant = this.filteredOptions[this.filteredOptions.length - 1].value;\n this.focusOption(this.filteredOptions.length - 1);\n } else if (event.key === 'Escape') {\n this.isOpen = false;\n }\n }\n\n generateButtonText(option: DropdownOption \| null, dropButtonText?: string): string {\n if (dropButtonText) {\n return dropButtonText;\n }\n return option?.label ? `${option?.label + this.pluralizedLabel}` : '';\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 render() {\n const buttonText = this.generateButtonText(this.selectedOption, this.dropdownButtonText);\n\n return (\n <div class=\"dropdown\" part=\"sd_dropdown\">\n <label part=\"sd_dropdown_label\" class={{ error: !!this.errorMessage }}>\n {this.label && (\n <p>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\"></span>}\n </p>\n )}\n <button\n part=\"sd_dropdown-button\"\n class={{ dropbtn: true, open: this.isOpen, error: !!this.errorMessage }}\n onClick={() => this.toggleDropdown()}\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=\"sd_dropdown-button-selected-label\">\n {buttonText}\n </span>\n {this.withChevron && (\n <span\n class={{\n open: this.isOpen,\n closed: !this.isOpen,\n chevron: true,\n }}\n aria-hidden=\"true\"\n >\n <chevron-icon width=\"16\" height=\"16\" />\n </span>\n )}\n </button>\n {this.errorMessage && <span class=\"error help-text\">{this.errorMessage}</span>}\n </label>\n\n {this.isOpen ? (\n <div class=\"dropdown-content\" part=\"sd_dropdown-content\">\n {this.withSearch && (\n <div class={{ 'search-box': true, 'open': this.isOpen }}>\n <search-icon width=\"15\" height=\"15\" class={'icon'} />\n <input\n type=\"text\"\n role=\"combobox\"\n placeholder=\"Search\"\n value={this.searchValue}\n ref={el => (this.inputRef = el)}\n onInput={event => this.filterOptions(event)}\n onKeyDown={e => this.handleComboboxKeyDown(e)}\n />\n </div>\n )}\n <ul tabindex=\"-1\" role=\"listbox\" aria-label={this.name} aria-activedescendant={this.ariaActivedescendant} onKeyDown={e => this.handleListboxKeydown(e)}>\n {this.filteredOptions.map(option =>\n option.value.toString() ? (\n <li tabindex=\"0\" key={option.value} id={option.value} onClick={() => this.selectOption(option)} role=\"option\">\n {option.labelHTML ? <div part=\"sd_dropdown-labelhtml\">{option.labelHTML}</div> : option.label}\n </li>\n ) : null,\n )}\n </ul>\n </div>\n ) : null}\n </div>\n );\n }\n}\n"],"version":3}

package/dist/collection/components/design-system/select-dropdown/select-dropdown.js CHANGED Viewed

@@ -29,6 +29,12 @@ export class SelectDropdown {
             return;
         }
         this.selectedOption = newValue;
+        this.nylasFormDropdownDefaultSelected.emit({
+            value: newValue?.value || '',
+            name: this.name,
+            error: this.errorMessage,
+            label: this.label,
+        });
     }
     componentWillLoad() {
         this.el.setAttribute('component-type', this.componentType);
@@ -39,6 +45,12 @@ export class SelectDropdown {
         if (!this.selectedOption && this.options.length > 0) {
             this.selectedOption = this.options[0];
         }
+        this.nylasFormDropdownDefaultSelected.emit({
+            value: this.selectedOption?.value || '',
+            name: this.name,
+            error: this.errorMessage,
+            label: this.label,
+        });
     }
     handleBookingFormSubmitted(event) {
         this.validate(this.selectedOption?.value || '');
@@ -164,7 +176,7 @@ export class SelectDropdown {
     }
     render() {
         const buttonText = this.generateButtonText(this.selectedOption, this.dropdownButtonText);
-        return (h("div", { key: '45abbbfaacb891e1d331e42f822a5a2b4e12289c', class: "dropdown", part: "sd_dropdown" }, h("label", { key: 'aad1cd53c176003fe04ae372aebc4743cb4830a0', part: "sd_dropdown_label", class: { error: !!this.errorMessage } }, this.label && (h("p", null, h("span", { class: "label" }, this.label), this.required && h("span", { class: "required" }, "*"))), h("button", { key: '5feca05e8b0ef951b8043a4bfeaa25f0de6d4789', part: "sd_dropdown-button", class: { dropbtn: true, open: this.isOpen, error: !!this.errorMessage }, onClick: () => this.toggleDropdown(), "aria-haspopup": "listbox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.name, onKeyDown: e => this.handleSelectButtonKeyDown(e) }, h("slot", { key: '410360c7661bfde11430153da1ff97b011c46626', name: "select-icon", "aria-hidden": "true" }), h("span", { key: 'c87c03c32ef91c57ed054a35931c49df7c796e49', class: "selected-option", part: "sd_dropdown-button-selected-label" }, buttonText), this.withChevron && (h("span", { class: {
+        return (h("div", { key: '4b724d892194708b2dcd0ed74c8e23486ba2b4f7', class: "dropdown", part: "sd_dropdown" }, h("label", { key: '06d33f4f5daa7c09eed054505989210e35c2beb5', part: "sd_dropdown_label", class: { error: !!this.errorMessage } }, this.label && (h("p", null, h("span", { class: "label" }, this.label), this.required && h("span", { class: "required" }, "*"))), h("button", { key: '8e5952f7e2a1279670304e82f329da3e8e60522a', part: "sd_dropdown-button", class: { dropbtn: true, open: this.isOpen, error: !!this.errorMessage }, onClick: () => this.toggleDropdown(), "aria-haspopup": "listbox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.name, onKeyDown: e => this.handleSelectButtonKeyDown(e) }, h("slot", { key: 'aece407da3b35858b9ec1248d09447706b3120cc', name: "select-icon", "aria-hidden": "true" }), h("span", { key: '55aae4a92f862c81533635999fb60693705cb12b', class: "selected-option", part: "sd_dropdown-button-selected-label" }, buttonText), this.withChevron && (h("span", { class: {
                 open: this.isOpen,
                 closed: !this.isOpen,
                 chevron: true,
@@ -382,6 +394,26 @@ export class SelectDropdown {
                         }
                     }
                 }
+            }, {
+                "method": "nylasFormDropdownDefaultSelected",
+                "name": "nylasFormDropdownDefaultSelected",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "This event is fired when the default selected option is set, on component load"
+                },
+                "complexType": {
+                    "original": "{\n    value: DropdownOption['value'];\n    name: string;\n    error?: string;\n    label?: string;\n  }",
+                    "resolved": "{ value: string; name: string; error?: string | undefined; label?: string | undefined; }",
+                    "references": {
+                        "DropdownOption": {
+                            "location": "global",
+                            "id": "global::DropdownOption"
+                        }
+                    }
+                }
             }];
     }
     static get elementRef() { return "el"; }

package/dist/collection/components/design-system/select-dropdown/select-dropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select-dropdown.js","sourceRoot":"","sources":["../../../../src/components/design-system/select-dropdown/select-dropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Listen, Prop, State, Watch } from '@stencil/core';\n\ninterface DropdownOption {\n labelHTML?: HTMLElement;\n label: string;\n value: string;\n}\n\n/*\n The `select-dropdown` component is a dropdown that allows users to select an option from a list of options.\n * This component is used in the scheduling form to input dropdown type inputs.\n * @part sd_dropdown - The dropdown container\n * @part sd_dropdown-button - The dropdown button\n * @part sd_dropdown-button-selected-label - The selected option label\n * @part sd_dropdown-content - The dropdown content\n * @part sd_dropdown_label - The dropdown label\n /\n@Component({\n tag: 'select-dropdown',\n styleUrl: 'select-dropdown.scss',\n shadow: true,\n})\nexport class SelectDropdown {\n @Element() el!: HTMLElement;\n private readonly componentType: string = 'select-dropdown';\n\n private inputRef?: HTMLInputElement;\n\n // Props\n /\n The name of the dropdown\n /\n @Prop() name!: string;\n /\n The options to display in the dropdown\n /\n @Prop() options: DropdownOption[] = [];\n /\n The default selected option\n /\n @Prop({ attribute: 'default-selected-option' }) defaultSelectedOption: DropdownOption \| null = null;\n /\n Should show search input\n /\n @Prop() withSearch: boolean = true;\n\n /\n The label for the dropdown, skipped if no label is provided\n /\n @Prop() label?: string;\n\n /\n If true, the dropdown is required for form submission\n /\n @Prop() required: boolean = false;\n\n /\n Show pluralized label for the selected option. This is s tring that is appended to the selected option label as a suffix.\n /\n @Prop() pluralizedLabel: string = '';\n /\n Overrides the select dropdown to be used as a button with dropdownButtonText representing actions & dropdownText name on the dropdown intead of selected value\n /\n @Prop() dropdownButtonText?: string;\n /\n Should show chevron on button\n /\n @Prop() withChevron: boolean = true;\n // States\n /\n The selected option\n /\n @State() selectedOption!: DropdownOption \| null;\n /\n The open state of the dropdown\n /\n @State() isOpen: boolean = false;\n /\n The search value for the dropdown\n /\n @State() searchValue: string = '';\n /\n The filtered options based on the search value\n /\n @State() filteredOptions: DropdownOption[] = [...this.options];\n /\n The aria-activedescendant attribute for the listbox element to indicate the currently active\n * option in the list box to screen readers. The value of aria-activedescendant is the ID of\n * the active option.\n /\n @State() ariaActivedescendant: string = '';\n\n /\n The error message to display when the value is empty or null and the dropdown is required\n /\n @State() errorMessage: string = '';\n\n // Events\n /\n This event is fired when the selected option is changed\n /\n @Event({ bubbles: true, composed: true }) nylasFormDropdownChanged!: EventEmitter<{\n value: DropdownOption['value'];\n name: string;\n error?: string;\n label?: string;\n }>;\n\n @Watch('options')\n optionsChangedHandler(newValue: DropdownOption[], oldValue: DropdownOption[]) {\n if (newValue === oldValue) {\n return;\n }\n this.filteredOptions = newValue;\n }\n\n @Watch('defaultSelectedOption')\n defaultSelectedOptionChangedHandler(newValue: DropdownOption, oldValue: DropdownOption) {\n if (typeof newValue === 'undefined' \|\| newValue?.label === oldValue?.label) {\n return;\n }\n this.selectedOption = newValue;\n }\n\n // Lifecycle methods\n componentWillLoad() {\n this.el.setAttribute('component-type', this.componentType);\n }\n\n componentDidLoad() {\n this.filteredOptions = this.options;\n // Set the selected option to the first option if no option is selected\n this.selectedOption = this.defaultSelectedOption;\n\n if (!this.selectedOption && this.options.length > 0) {\n this.selectedOption = this.options[0];\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.validate(this.selectedOption?.value \|\| '');\n if (this.errorMessage) {\n event.preventDefault();\n }\n }\n\n // Methods\n validate(value: string) {\n if (this.required && !value) {\n this.errorMessage = `${this.label} is required.`;\n } else {\n this.errorMessage = '';\n }\n }\n toggleDropdown(): void {\n this.isOpen = !this.isOpen;\n }\n\n filterOptions(event: Event): void {\n const value = (event.target as HTMLInputElement).value;\n this.searchValue = value;\n this.filteredOptions = this.options.filter(option => option.label.toLowerCase().includes(value.toLowerCase()));\n }\n\n selectOption(option: DropdownOption): void {\n this.errorMessage = '';\n this.selectedOption = option;\n this.toggleDropdown();\n this.nylasFormDropdownChanged.emit({\n value: option.value,\n name: this.name,\n error: this.errorMessage,\n label: this.label,\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 this.inputRef?.focus();\n break;\n case 'Escape':\n this.isOpen = false;\n break;\n }\n }\n\n handleListboxKeydown(e) {\n const items = this.filteredOptions; // Assuming this is the array of your current filtered options\n const currentIndex = items.findIndex(item => item.value === this.ariaActivedescendant);\n if (e.key === 'ArrowDown' \|\| (e.key === 'Tab' && !e.shiftKey)) {\n e.preventDefault();\n if (currentIndex === items.length - 1) {\n this.ariaActivedescendant = '';\n this.inputRef?.focus();\n return;\n }\n const nextIndex = currentIndex + 1 < items.length ? currentIndex + 1 : 0;\n this.ariaActivedescendant = items[nextIndex].value;\n this.focusOption(nextIndex);\n } else if (e.key === 'ArrowUp' \|\| (e.key === 'Tab' && e.shiftKey)) {\n e.preventDefault();\n if (currentIndex === 0) {\n this.ariaActivedescendant = '';\n this.inputRef?.focus();\n return;\n }\n const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;\n this.ariaActivedescendant = items[prevIndex].value;\n this.focusOption(prevIndex);\n } else if (e.key === 'Enter') {\n e.preventDefault();\n if (this.ariaActivedescendant) {\n this.selectOption(items[currentIndex]);\n }\n } else if (e.key === 'Escape') {\n this.isOpen = false;\n }\n }\n\n focusOption(index) {\n const option = this.filteredOptions[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 handleComboboxKeyDown(event: KeyboardEvent): void {\n if (event.key === 'ArrowDown' \|\| (event.key == 'Tab' && !event.shiftKey)) {\n event.preventDefault();\n this.ariaActivedescendant = this.filteredOptions[0].value;\n this.focusOption(0);\n } else if (event.key === 'ArrowUp' \|\| (event.key === 'Tab' && event.shiftKey)) {\n event.preventDefault();\n this.ariaActivedescendant = this.filteredOptions[this.filteredOptions.length - 1].value;\n this.focusOption(this.filteredOptions.length - 1);\n } else if (event.key === 'Escape') {\n this.isOpen = false;\n }\n }\n\n generateButtonText(option: DropdownOption \| null, dropButtonText?: string): string {\n if (dropButtonText) {\n return dropButtonText;\n }\n return option?.label ? `${option?.label + this.pluralizedLabel}` : '';\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 render() {\n const buttonText = this.generateButtonText(this.selectedOption, this.dropdownButtonText);\n\n return (\n <div class=\"dropdown\" part=\"sd_dropdown\">\n <label part=\"sd_dropdown_label\" class={{ error: !!this.errorMessage }}>\n {this.label && (\n <p>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\"></span>}\n </p>\n )}\n <button\n part=\"sd_dropdown-button\"\n class={{ dropbtn: true, open: this.isOpen, error: !!this.errorMessage }}\n onClick={() => this.toggleDropdown()}\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=\"sd_dropdown-button-selected-label\">\n {buttonText}\n </span>\n {this.withChevron && (\n <span\n class={{\n open: this.isOpen,\n closed: !this.isOpen,\n chevron: true,\n }}\n aria-hidden=\"true\"\n >\n <chevron-icon width=\"16\" height=\"16\" />\n </span>\n )}\n </button>\n {this.errorMessage && <span class=\"error help-text\">{this.errorMessage}</span>}\n </label>\n\n {this.isOpen ? (\n <div class=\"dropdown-content\" part=\"sd_dropdown-content\">\n {this.withSearch && (\n <div class={{ 'search-box': true, 'open': this.isOpen }}>\n <search-icon width=\"15\" height=\"15\" class={'icon'} />\n <input\n type=\"text\"\n role=\"combobox\"\n placeholder=\"Search\"\n value={this.searchValue}\n ref={el => (this.inputRef = el)}\n onInput={event => this.filterOptions(event)}\n onKeyDown={e => this.handleComboboxKeyDown(e)}\n />\n </div>\n )}\n <ul tabindex=\"-1\" role=\"listbox\" aria-label={this.name} aria-activedescendant={this.ariaActivedescendant} onKeyDown={e => this.handleListboxKeydown(e)}>\n {this.filteredOptions.map(option =>\n option.value.toString() ? (\n <li tabindex=\"0\" key={option.value} id={option.value} onClick={() => this.selectOption(option)} role=\"option\">\n {option.labelHTML ? <div part=\"sd_dropdown-labelhtml\">{option.labelHTML}</div> : option.label}\n </li>\n ) : null,\n )}\n </ul>\n </div>\n ) : null}\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"select-dropdown.js","sourceRoot":"","sources":["../../../../src/components/design-system/select-dropdown/select-dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAsBvG,MAAM,OAAO,cAAc;;QAER,kBAAa,GAAW,iBAAiB,CAAC;;uBAYvB,EAAE;qCAIyD,IAAI;0BAIrE,IAAI;;wBAUN,KAAK;+BAKC,EAAE;;2BAQL,IAAI;;sBASR,KAAK;2BAID,EAAE;+BAIY,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC;oCAMtB,EAAE;4BAKV,EAAE;;IAwBlC,qBAAqB,CAAC,QAA0B,EAAE,QAA0B;QAC1E,IAAI,QAAQ,KAAK,QAAQ,EAAE,CAAC;YAC1B,OAAO;QACT,CAAC;QACD,IAAI,CAAC,eAAe,GAAG,QAAQ,CAAC;IAClC,CAAC;IAGD,mCAAmC,CAAC,QAAwB,EAAE,QAAwB;QACpF,IAAI,OAAO,QAAQ,KAAK,WAAW,IAAI,QAAQ,EAAE,KAAK,KAAK,QAAQ,EAAE,KAAK,EAAE,CAAC;YAC3E,OAAO;QACT,CAAC;QACD,IAAI,CAAC,cAAc,GAAG,QAAQ,CAAC;QAC/B,IAAI,CAAC,gCAAgC,CAAC,IAAI,CAAC;YACzC,KAAK,EAAE,QAAQ,EAAE,KAAK,IAAI,EAAE;YAC5B,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,KAAK,EAAE,IAAI,CAAC,YAAY;YACxB,KAAK,EAAE,IAAI,CAAC,KAAK;SAClB,CAAC,CAAC;IACL,CAAC;IAGD,iBAAiB;QACf,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,gBAAgB,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IAC7D,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,OAAO,CAAC;QAEpC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,qBAAqB,CAAC;QAEjD,IAAI,CAAC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACpD,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QACxC,CAAC;QACD,IAAI,CAAC,gCAAgC,CAAC,IAAI,CAAC;YACzC,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE,KAAK,IAAI,EAAE;YACvC,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,KAAK,EAAE,IAAI,CAAC,YAAY;YACxB,KAAK,EAAE,IAAI,CAAC,KAAK;SAClB,CAAC,CAAC;IACL,CAAC;IAOD,0BAA0B,CAAC,KAAkB;QAC3C,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,cAAc,EAAE,KAAK,IAAI,EAAE,CAAC,CAAC;QAChD,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;YACtB,KAAK,CAAC,cAAc,EAAE,CAAC;QACzB,CAAC;IACH,CAAC;IAGD,QAAQ,CAAC,KAAa;QACpB,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,KAAK,EAAE,CAAC;YAC5B,IAAI,CAAC,YAAY,GAAG,GAAG,IAAI,CAAC,KAAK,eAAe,CAAC;QACnD,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;QACzB,CAAC;IACH,CAAC;IACD,cAAc;QACZ,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;IAC7B,CAAC;IAED,aAAa,CAAC,KAAY;QACxB,MAAM,KAAK,GAAI,KAAK,CAAC,MAA2B,CAAC,KAAK,CAAC;QACvD,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;QACzB,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC;IACjH,CAAC;IAED,YAAY,CAAC,MAAsB;QACjC,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;QACvB,IAAI,CAAC,cAAc,GAAG,MAAM,CAAC;QAC7B,IAAI,CAAC,cAAc,EAAE,CAAC;QACtB,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC;YACjC,KAAK,EAAE,MAAM,CAAC,KAAK;YACnB,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,KAAK,EAAE,IAAI,CAAC,YAAY;YACxB,KAAK,EAAE,IAAI,CAAC,KAAK;SAClB,CAAC,CAAC;IACL,CAAC;IAED,yBAAyB,CAAC,KAAoB;QAC5C,QAAQ,KAAK,CAAC,GAAG,EAAE,CAAC;YAClB,KAAK,WAAW,CAAC;YACjB,KAAK,OAAO;gBACV,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;oBACjB,IAAI,CAAC,cAAc,EAAE,CAAC;gBACxB,CAAC;gBACD,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,CAAC;gBACvB,MAAM;YACR,KAAK,QAAQ;gBACX,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;gBACpB,MAAM;QACV,CAAC;IACH,CAAC;IAED,oBAAoB,CAAC,CAAC;QACpB,MAAM,KAAK,GAAG,IAAI,CAAC,eAAe,CAAC;QACnC,MAAM,YAAY,GAAG,KAAK,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,KAAK,IAAI,CAAC,oBAAoB,CAAC,CAAC;QACvF,IAAI,CAAC,CAAC,GAAG,KAAK,WAAW,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,KAAK,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC;YAC9D,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,IAAI,YAAY,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;gBACtC,IAAI,CAAC,oBAAoB,GAAG,EAAE,CAAC;gBAC/B,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,CAAC;gBACvB,OAAO;YACT,CAAC;YACD,MAAM,SAAS,GAAG,YAAY,GAAG,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YACzE,IAAI,CAAC,oBAAoB,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,KAAK,CAAC;YACnD,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC;QAC9B,CAAC;aAAM,IAAI,CAAC,CAAC,GAAG,KAAK,SAAS,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,KAAK,IAAI,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC;YAClE,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,IAAI,YAAY,KAAK,CAAC,EAAE,CAAC;gBACvB,IAAI,CAAC,oBAAoB,GAAG,EAAE,CAAC;gBAC/B,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,CAAC;gBACvB,OAAO;YACT,CAAC;YACD,MAAM,SAAS,GAAG,YAAY,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;YAC9E,IAAI,CAAC,oBAAoB,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,KAAK,CAAC;YACnD,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC;QAC9B,CAAC;aAAM,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE,CAAC;YAC7B,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,IAAI,IAAI,CAAC,oBAAoB,EAAE,CAAC;gBAC9B,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC;YACzC,CAAC;QACH,CAAC;aAAM,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;YAC9B,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACtB,CAAC;IACH,CAAC;IAED,WAAW,CAAC,KAAK;QACf,MAAM,MAAM,GAAG,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;QAC3C,IAAI,CAAC,MAAM;YAAE,OAAO;QAEpB,MAAM,SAAS,GAAG,MAAM,CAAC,KAAK,CAAC;QAC/B,MAAM,OAAO,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,EAAE,cAAc,CAAC,SAAS,CAAkB,CAAC;QAE/E,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,CAAC,KAAK,EAAE,CAAC;YAChB,OAAO,CAAC,cAAc,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC;QACnE,CAAC;IACH,CAAC;IAED,qBAAqB,CAAC,KAAoB;QACxC,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,IAAI,CAAC,KAAK,CAAC,GAAG,IAAI,KAAK,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC;YACzE,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,IAAI,CAAC,oBAAoB,GAAG,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;YAC1D,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;QACtB,CAAC;aAAM,IAAI,KAAK,CAAC,GAAG,KAAK,SAAS,IAAI,CAAC,KAAK,CAAC,GAAG,KAAK,KAAK,IAAI,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC;YAC9E,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,IAAI,CAAC,oBAAoB,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,eAAe,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC;YACxF,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,eAAe,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QACpD,CAAC;aAAM,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;YAClC,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACtB,CAAC;IACH,CAAC;IAED,kBAAkB,CAAC,MAA6B,EAAE,cAAuB;QACvE,IAAI,cAAc,EAAE,CAAC;YACnB,OAAO,cAAc,CAAC;QACxB,CAAC;QACD,OAAO,MAAM,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,MAAM,EAAE,KAAK,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;IACxE,CAAC;IAID,kBAAkB,CAAC,KAAiB;QAElC,MAAM,IAAI,GAAG,KAAK,CAAC,YAAY,EAAE,CAAC;QAGlC,MAAM,aAAa,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QAE7C,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAClC,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACtB,CAAC;IACH,CAAC;IAED,MAAM;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,cAAc,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;QAEzF,OAAO,CACL,4DAAK,KAAK,EAAC,UAAU,EAAC,IAAI,EAAC,aAAa;YACtC,8DAAO,IAAI,EAAC,mBAAmB,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,YAAY,EAAE;gBAClE,IAAI,CAAC,KAAK,IAAI,CACb;oBACE,YAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ;oBACtC,IAAI,CAAC,QAAQ,IAAI,YAAM,KAAK,EAAC,UAAU,QAAS,CAC/C,CACL;gBACD,+DACE,IAAI,EAAC,oBAAoB,EACzB,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,YAAY,EAAE,EACvE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,cAAc,EAAE,mBACtB,SAAS,mBACR,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,gBACjC,IAAI,CAAC,IAAI,EACrB,SAAS,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC,CAAC;oBAEjD,6DAAM,IAAI,EAAC,aAAa,iBAAa,MAAM,GAAQ;oBACnD,6DAAM,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,mCAAmC,IACnE,UAAU,CACN;oBACN,IAAI,CAAC,WAAW,IAAI,CACnB,YACE,KAAK,EAAE;4BACL,IAAI,EAAE,IAAI,CAAC,MAAM;4BACjB,MAAM,EAAE,CAAC,IAAI,CAAC,MAAM;4BACpB,OAAO,EAAE,IAAI;yBACd,iBACW,MAAM;wBAElB,oBAAc,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG,CAClC,CACR,CACM;gBACR,IAAI,CAAC,YAAY,IAAI,YAAM,KAAK,EAAC,iBAAiB,IAAE,IAAI,CAAC,YAAY,CAAQ,CACxE;YAEP,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CACb,WAAK,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,qBAAqB;gBACrD,IAAI,CAAC,UAAU,IAAI,CAClB,WAAK,KAAK,EAAE,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE;oBACrD,mBAAa,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,KAAK,EAAE,MAAM,GAAI;oBACrD,aACE,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,UAAU,EACf,WAAW,EAAC,QAAQ,EACpB,KAAK,EAAE,IAAI,CAAC,WAAW,EACvB,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC,EAC/B,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,EAC3C,SAAS,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,GAC7C,CACE,CACP;gBACD,UAAI,QAAQ,EAAC,IAAI,EAAC,IAAI,EAAC,SAAS,gBAAa,IAAI,CAAC,IAAI,2BAAyB,IAAI,CAAC,oBAAoB,EAAE,SAAS,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC,CAAC,IACnJ,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CACjC,MAAM,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,CACxB,UAAI,QAAQ,EAAC,GAAG,EAAC,GAAG,EAAE,MAAM,CAAC,KAAK,EAAE,EAAE,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE,IAAI,EAAC,QAAQ,IAC1G,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,WAAK,IAAI,EAAC,uBAAuB,IAAE,MAAM,CAAC,SAAS,CAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAC1F,CACN,CAAC,CAAC,CAAC,IAAI,CACT,CACE,CACD,CACP,CAAC,CAAC,CAAC,IAAI,CACJ,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Listen, Prop, State, Watch } from '@stencil/core';\n\ninterface DropdownOption {\n labelHTML?: HTMLElement;\n label: string;\n value: string;\n}\n\n/*\n The `select-dropdown` component is a dropdown that allows users to select an option from a list of options.\n * This component is used in the scheduling form to input dropdown type inputs.\n * @part sd_dropdown - The dropdown container\n * @part sd_dropdown-button - The dropdown button\n * @part sd_dropdown-button-selected-label - The selected option label\n * @part sd_dropdown-content - The dropdown content\n * @part sd_dropdown_label - The dropdown label\n /\n@Component({\n tag: 'select-dropdown',\n styleUrl: 'select-dropdown.scss',\n shadow: true,\n})\nexport class SelectDropdown {\n @Element() el!: HTMLElement;\n private readonly componentType: string = 'select-dropdown';\n\n private inputRef?: HTMLInputElement;\n\n // Props\n /\n The name of the dropdown\n /\n @Prop() name!: string;\n /\n The options to display in the dropdown\n /\n @Prop() options: DropdownOption[] = [];\n /\n The default selected option\n /\n @Prop({ attribute: 'default-selected-option' }) defaultSelectedOption: DropdownOption \| null = null;\n /\n Should show search input\n /\n @Prop() withSearch: boolean = true;\n\n /\n The label for the dropdown, skipped if no label is provided\n /\n @Prop() label?: string;\n\n /\n If true, the dropdown is required for form submission\n /\n @Prop() required: boolean = false;\n\n /\n Show pluralized label for the selected option. This is s tring that is appended to the selected option label as a suffix.\n /\n @Prop() pluralizedLabel: string = '';\n /\n Overrides the select dropdown to be used as a button with dropdownButtonText representing actions & dropdownText name on the dropdown intead of selected value\n /\n @Prop() dropdownButtonText?: string;\n /\n Should show chevron on button\n /\n @Prop() withChevron: boolean = true;\n // States\n /\n The selected option\n /\n @State() selectedOption!: DropdownOption \| null;\n /\n The open state of the dropdown\n /\n @State() isOpen: boolean = false;\n /\n The search value for the dropdown\n /\n @State() searchValue: string = '';\n /\n The filtered options based on the search value\n /\n @State() filteredOptions: DropdownOption[] = [...this.options];\n /\n The aria-activedescendant attribute for the listbox element to indicate the currently active\n * option in the list box to screen readers. The value of aria-activedescendant is the ID of\n * the active option.\n /\n @State() ariaActivedescendant: string = '';\n\n /\n The error message to display when the value is empty or null and the dropdown is required\n /\n @State() errorMessage: string = '';\n\n // Events\n /\n This event is fired when the selected option is changed\n /\n @Event({ bubbles: true, composed: true }) nylasFormDropdownChanged!: EventEmitter<{\n value: DropdownOption['value'];\n name: string;\n error?: string;\n label?: string;\n }>;\n\n /\n This event is fired when the default selected option is set, on component load\n /\n @Event({ bubbles: true, composed: true }) nylasFormDropdownDefaultSelected!: EventEmitter<{\n value: DropdownOption['value'];\n name: string;\n error?: string;\n label?: string;\n }>;\n\n @Watch('options')\n optionsChangedHandler(newValue: DropdownOption[], oldValue: DropdownOption[]) {\n if (newValue === oldValue) {\n return;\n }\n this.filteredOptions = newValue;\n }\n\n @Watch('defaultSelectedOption')\n defaultSelectedOptionChangedHandler(newValue: DropdownOption, oldValue: DropdownOption) {\n if (typeof newValue === 'undefined' \|\| newValue?.label === oldValue?.label) {\n return;\n }\n this.selectedOption = newValue;\n this.nylasFormDropdownDefaultSelected.emit({\n value: newValue?.value \|\| '',\n name: this.name,\n error: this.errorMessage,\n label: this.label,\n });\n }\n\n // Lifecycle methods\n componentWillLoad() {\n this.el.setAttribute('component-type', this.componentType);\n }\n\n componentDidLoad() {\n this.filteredOptions = this.options;\n // Set the selected option to the first option if no option is selected\n this.selectedOption = this.defaultSelectedOption;\n\n if (!this.selectedOption && this.options.length > 0) {\n this.selectedOption = this.options[0];\n }\n this.nylasFormDropdownDefaultSelected.emit({\n value: this.selectedOption?.value \|\| '',\n name: this.name,\n error: this.errorMessage,\n label: this.label,\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.validate(this.selectedOption?.value \|\| '');\n if (this.errorMessage) {\n event.preventDefault();\n }\n }\n\n // Methods\n validate(value: string) {\n if (this.required && !value) {\n this.errorMessage = `${this.label} is required.`;\n } else {\n this.errorMessage = '';\n }\n }\n toggleDropdown(): void {\n this.isOpen = !this.isOpen;\n }\n\n filterOptions(event: Event): void {\n const value = (event.target as HTMLInputElement).value;\n this.searchValue = value;\n this.filteredOptions = this.options.filter(option => option.label.toLowerCase().includes(value.toLowerCase()));\n }\n\n selectOption(option: DropdownOption): void {\n this.errorMessage = '';\n this.selectedOption = option;\n this.toggleDropdown();\n this.nylasFormDropdownChanged.emit({\n value: option.value,\n name: this.name,\n error: this.errorMessage,\n label: this.label,\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 this.inputRef?.focus();\n break;\n case 'Escape':\n this.isOpen = false;\n break;\n }\n }\n\n handleListboxKeydown(e) {\n const items = this.filteredOptions; // Assuming this is the array of your current filtered options\n const currentIndex = items.findIndex(item => item.value === this.ariaActivedescendant);\n if (e.key === 'ArrowDown' \|\| (e.key === 'Tab' && !e.shiftKey)) {\n e.preventDefault();\n if (currentIndex === items.length - 1) {\n this.ariaActivedescendant = '';\n this.inputRef?.focus();\n return;\n }\n const nextIndex = currentIndex + 1 < items.length ? currentIndex + 1 : 0;\n this.ariaActivedescendant = items[nextIndex].value;\n this.focusOption(nextIndex);\n } else if (e.key === 'ArrowUp' \|\| (e.key === 'Tab' && e.shiftKey)) {\n e.preventDefault();\n if (currentIndex === 0) {\n this.ariaActivedescendant = '';\n this.inputRef?.focus();\n return;\n }\n const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;\n this.ariaActivedescendant = items[prevIndex].value;\n this.focusOption(prevIndex);\n } else if (e.key === 'Enter') {\n e.preventDefault();\n if (this.ariaActivedescendant) {\n this.selectOption(items[currentIndex]);\n }\n } else if (e.key === 'Escape') {\n this.isOpen = false;\n }\n }\n\n focusOption(index) {\n const option = this.filteredOptions[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 handleComboboxKeyDown(event: KeyboardEvent): void {\n if (event.key === 'ArrowDown' \|\| (event.key == 'Tab' && !event.shiftKey)) {\n event.preventDefault();\n this.ariaActivedescendant = this.filteredOptions[0].value;\n this.focusOption(0);\n } else if (event.key === 'ArrowUp' \|\| (event.key === 'Tab' && event.shiftKey)) {\n event.preventDefault();\n this.ariaActivedescendant = this.filteredOptions[this.filteredOptions.length - 1].value;\n this.focusOption(this.filteredOptions.length - 1);\n } else if (event.key === 'Escape') {\n this.isOpen = false;\n }\n }\n\n generateButtonText(option: DropdownOption \| null, dropButtonText?: string): string {\n if (dropButtonText) {\n return dropButtonText;\n }\n return option?.label ? `${option?.label + this.pluralizedLabel}` : '';\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 render() {\n const buttonText = this.generateButtonText(this.selectedOption, this.dropdownButtonText);\n\n return (\n <div class=\"dropdown\" part=\"sd_dropdown\">\n <label part=\"sd_dropdown_label\" class={{ error: !!this.errorMessage }}>\n {this.label && (\n <p>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\"></span>}\n </p>\n )}\n <button\n part=\"sd_dropdown-button\"\n class={{ dropbtn: true, open: this.isOpen, error: !!this.errorMessage }}\n onClick={() => this.toggleDropdown()}\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=\"sd_dropdown-button-selected-label\">\n {buttonText}\n </span>\n {this.withChevron && (\n <span\n class={{\n open: this.isOpen,\n closed: !this.isOpen,\n chevron: true,\n }}\n aria-hidden=\"true\"\n >\n <chevron-icon width=\"16\" height=\"16\" />\n </span>\n )}\n </button>\n {this.errorMessage && <span class=\"error help-text\">{this.errorMessage}</span>}\n </label>\n\n {this.isOpen ? (\n <div class=\"dropdown-content\" part=\"sd_dropdown-content\">\n {this.withSearch && (\n <div class={{ 'search-box': true, 'open': this.isOpen }}>\n <search-icon width=\"15\" height=\"15\" class={'icon'} />\n <input\n type=\"text\"\n role=\"combobox\"\n placeholder=\"Search\"\n value={this.searchValue}\n ref={el => (this.inputRef = el)}\n onInput={event => this.filterOptions(event)}\n onKeyDown={e => this.handleComboboxKeyDown(e)}\n />\n </div>\n )}\n <ul tabindex=\"-1\" role=\"listbox\" aria-label={this.name} aria-activedescendant={this.ariaActivedescendant} onKeyDown={e => this.handleListboxKeydown(e)}>\n {this.filteredOptions.map(option =>\n option.value.toString() ? (\n <li tabindex=\"0\" key={option.value} id={option.value} onClick={() => this.selectOption(option)} role=\"option\">\n {option.labelHTML ? <div part=\"sd_dropdown-labelhtml\">{option.labelHTML}</div> : option.label}\n </li>\n ) : null,\n )}\n </ul>\n </div>\n ) : null}\n </div>\n );\n }\n}\n"]}