@nylas/web-elements 0.0.0-canary-20250120165013 → 0.0.0-canary-20250122221254

package/dist/nylas-web-elements/{p-dd830dcc.entry.js.map → p-f7bd80de.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["NylasSchedulerConnector","constructor","schedulerAPIURL","nylasSchedulerStore","sessionId","configId","slug","clientId","Error","url","URL","window","location","href","origin","this","init","debug","schedulerStore","scheduler","_schedulerAPIConnector","NylaSchedulerAPIConnector","resetStores","reset","SchedulerView","props","children","isLoading","showNotification","nylasBranding","h","Fragment","class","target","rel","MessageBanner","_props","nylasSchedulingCss","NylasSchedulingStyle0","genericError","title","i18next","t","type","NotificationType","category","ErrorCategory","Component","NylasScheduling","Date","toLocaleDateString","undefined","dateStyle","navigator","language","connectedCallback","componentWillLoad","enableUserFeedback","Sentry.isInitialized","Sentry.init","dsn","release","integrations","filter","_integration","Sentry.feedbackIntegration","colorScheme","autoInject","autoSessionTracking","beforeSend","schedulerWillLoadEvent","schedulerWillLoad","emit","host","eventOverrides","nylasSchedulerConnector","defaultPrevented","stores","CreateNylasSchedulerStore","bookingInfo","themeConfig","hour12","defaultSchedulerState","baseProvider","NylasBaseProvider","automaticComponentRegistration","refConfigId","configurationId","bookingRefExtractedEvent","rescheduleBookingRef","rescheduleConfigId","rescheduleBookingId","_","compactStringToUUIDs","set","bookingRefExtracted","bookingId","cancelBookingRef","cancelConfigId","cancelBookingId","organizerConfirmationBookingRef","organizerConfirmationConfigId","organizerConfirmationBookingId","salt","checkIfSessionIdOrConfigIdExists","getStore","schedulerApiUrl","initEvent","applyThemeConfig","componentDidLoad","schedulerDidLoadEvent","schedulerDidLoad","localizationChanged","localization","settingsResponse","getUISettings","nylasSchedulerError","notification","getErrorObject","error","data","appearance","console","info","configSettingsLoadedEvent","configSettingsLoaded","settings","availableDaysInFuture","get","available_days_in_future","selectedTimeslot","start_time","isTimeslotValid","selectedDate","availability","result","length","today","startTime","endTime","endTimeForAvailableDaysInFuture","validateAvailableDaysInFuture","getTime","getAvailability","_selectedDate","firstAvailableDate","find","timeslot","componentDisconnected","bookingInfoChanged","newVal","rescheduleBookingRefChanged","setConfigId","cancelBookingRefChanged","organizerConfirmationBookingRefChanged","Object","keys","forEach","lang","LANGUAGE_CODE","addResourceBundle","themeConfigChanged","languageChanged","event","newLanguage","detail","changeLanguage","registerComponentHandler","registerComponent","unregisterComponentHandler","unregisterComponent","monthChangedHandler","date","selectableDates","mapToBookingData","timezone","end_time","additional_guests","guests","guest","primaryParticipant","additional_fields","additionalFields","email_language","bookButtonClickedHandler","bookingData","mappedBookingData","bookingInfoConfirmed","storeRescheduleId","rescheduleBooking","resultData","bookedEventInfoEvent","bookedEventInfo","bookTimeslot","dateSelectedHandler","selectedDateLabel","cancelBookedEventErrorHandler","cancelBookedEventValidationErrorHandler","rescheduleBookedEventErrorHandler","confirmBookingErrorHandler","feedbackModalClosedHandler","showFeedbackModal","feedbackSubmittedHandler","eventId","Sentry.captureMessage","feedback","message","Sentry.captureFeedback","includeReplay","captureContext","tags","extra","getNylasSchedulerStore","getNylasSchedulerConnector","getRef","description","id","toString","ttl","startDate","getFullYear","getMonth","endTimeForCurrentMonth","Math","floor","addDaysToCurrentDate","min","startTimeWithOffset","key","value","entries","style","setProperty","onFeedbackClick","e","preventDefault","redirectToCustomUrl","assign","render","showDefaultScheduler","mode","eventInfo","showBookingForm","cancelledEventInfo","rejectBookingId","confirmedEventInfo","redirectUrl","confirmation_redirect_url","capitalizeFirstLetter","LANGUAGE_CODE_MAP","Host","part","exportparts","variant","onClick","recipient","booking_ref","bookingInfoAdditionalFields","selectedTimezone","selectedLanguage","configSettings","configuration_id","queryString","search","urlParams","URLSearchParams","booking_id","name","email","JSON","stringify","timeslotPickerCTALabel","querySelector","slot"],"sources":["src/connector/nylas-scheduler-connector/index.ts","src/components/scheduler/nylas-scheduling/scheduler-view.tsx","src/components/scheduler/nylas-scheduling/message-banner.tsx","src/components/scheduler/nylas-scheduling/nylas-scheduling.scss?tag=nylas-scheduling&encapsulation=shadow","src/components/scheduler/nylas-scheduling/nylas-scheduling.tsx"],"sourcesContent":["import { NylasSchedulerStoreType } from '@/stores/scheduler-store';\nimport { debug } from '@/utils/utils';\nimport { NylasSchedulerConnectorInterface } from '../connector-interface';\nimport { NylaSchedulerAPIConnector } from '../shared/api/scheduler';\n\ntype NylasSchedulerConnectorOptions = {\n  schedulerAPIURL: string;\n  nylasSchedulerStore: NylasSchedulerStoreType;\n  sessionId?: string;\n  configId?: string;\n  slug?: string;\n  clientId?: string;\n};\n/**\n * Base class for the Nylas connector.\n */\nexport class NylasSchedulerConnector implements NylasSchedulerConnectorInterface {\n  public schedulerAPIURL: string;\n  public nylasSchedulerStore: NylasSchedulerStoreType;\n  public sessionId: string | undefined;\n  public configId: string | undefined;\n  public slug: string | undefined;\n  public clientId: string | undefined;\n\n  private _schedulerAPIConnector: NylaSchedulerAPIConnector | undefined;\n\n  constructor({ schedulerAPIURL, nylasSchedulerStore, sessionId, configId, slug, clientId }: NylasSchedulerConnectorOptions) {\n    if (!schedulerAPIURL) {\n      throw new Error('schedulerAPIURL is required');\n    }\n\n    if (!nylasSchedulerStore) {\n      throw new Error('nylasSchedulerStore is required');\n    }\n\n    if (!sessionId && !configId && !(slug || clientId)) {\n      throw new Error('sessionId is required for private configs. If using public config either pass a configurationId or a combination of slug and clientId.');\n    }\n\n    // If the url is only /, then we need to add the base url.\n    // We assume that the base url is the same as the current url.\n    if (schedulerAPIURL === '/') {\n      const url = new URL(window.location.href);\n      schedulerAPIURL = url.origin;\n    }\n\n    this.configId = configId;\n    this.sessionId = sessionId;\n    this.schedulerAPIURL = schedulerAPIURL;\n    this.nylasSchedulerStore = nylasSchedulerStore;\n    this.slug = slug;\n    this.clientId = clientId;\n  }\n\n  public init() {\n    debug('NylasConnector init');\n  }\n\n  public get schedulerStore() {\n    return this.nylasSchedulerStore;\n  }\n\n  public get scheduler() {\n    if (this._schedulerAPIConnector) {\n      return this._schedulerAPIConnector;\n    }\n    this._schedulerAPIConnector = new NylaSchedulerAPIConnector({\n      schedulerAPIURL: this.schedulerAPIURL,\n      schedulerStore: this.schedulerStore,\n      sessionId: this.sessionId,\n      configId: this.configId,\n      slug: this.slug,\n      clientId: this.clientId,\n    });\n    return this._schedulerAPIConnector;\n  }\n\n  public resetStores() {\n    this.nylasSchedulerStore.reset();\n  }\n}\nexport type PublicMethods<T> = {\n  [K in keyof T]: T[K] extends Function ? (string extends K ? never : K) : never;\n}[keyof T];\n\nexport type NylasSchedulerConnectorPublicMethods = PublicMethods<NylasSchedulerConnector>;\n","import { Fragment, FunctionalComponent, h } from '@stencil/core';\n\nexport type SchedulerViewProps = {\n  isLoading?: boolean;\n  showNotification?: boolean;\n  nylasBranding?: boolean;\n};\n\n/**\n * The Scheduler view component.\n */\nexport const SchedulerView: FunctionalComponent<SchedulerViewProps> = (props: SchedulerViewProps, children) => {\n  const isLoading = props.isLoading;\n  const showNotification = props.showNotification;\n  const nylasBranding = props.nylasBranding;\n\n  return (\n    <Fragment>\n      {showNotification && <nylas-notification></nylas-notification>}\n\n      {isLoading && (\n        <div class={'loading'}>\n          <div class={'left'}>\n            <div class={'skeleton'} />\n          </div>\n          <div class={'right'}>\n            <div class={'skeleton'} />\n            <div class={'skeleton'} />\n            <div class={'skeleton'} />\n            <div class={'skeleton'} />\n            <div class={'skeleton'} />\n          </div>\n        </div>\n      )}\n      {!isLoading && children}\n      <div class={'footer'}>\n        {nylasBranding && (\n          <a\n            href=\"https://scheduler.nylas.com?utm_source=powered-by-nylas-logoutm_medium=link&utm_campaign=get-scheduler&utm_id=get-scheduler\"\n            class=\"powered-by-nylas\"\n            target=\"_blank\"\n            rel=\"noreferrer noopener\"\n          >\n            Powered by&nbsp;<span class=\"sr-only\">Nylas</span>\n            <nylas-logo aria-hidden={true} />\n          </a>\n        )}\n      </div>\n    </Fragment>\n  );\n};\n","import { FunctionalComponent, h } from '@stencil/core';\n\nexport type HeaderBannerProps = {};\n\nexport const MessageBanner: FunctionalComponent<HeaderBannerProps> = (_props: HeaderBannerProps, children) => <div class=\"message-banner\">{children}</div>;\n","@import '../../../common/styles/variables.scss';\n\n:host {\n  display: flex;\n  flex-direction: column;\n  overflow: visible;\n  border-radius: var(--nylas-border-radius-2x);\n  width: fit-content;\n\n  @media #{$mobile} {\n    width: auto;\n    min-width: 325px;\n  }\n\n  background: var(--nylas-base-0);\n  position: relative;\n  box-shadow: 0px 4px 8px 2px rgba(0, 0, 0, 0.05),\n  0px 8px 16px -2px rgba(0, 0, 0, 0.1);\n\n  @include default-css-variables;\n  font-family: var(--nylas-font-family);\n  font-optical-sizing: auto;\n  font-style: normal;\n  font-variation-settings: 'slnt' 0;\n}\n\n:root {\n  font-family: inherit;\n}\n\n.error {\n  padding: 8rem 12rem;\n  color: var(--nylas-base-0);\n  background-color: var(--nylas-error);\n  margin: 1.5rem;\n  border-radius: var(--nylas-border-radius-2x);\n}\n\n.message-banner {\n  text-align: right;\n  color: var(--nylas-base-800);\n  padding: 1rem;\n  border-bottom: 1px solid var(--nylas-color-primary-200);\n  margin: 0;\n}\n\n.loading {\n  margin: 1.5rem;\n  display: flex;\n  gap: 1rem;\n\n  .skeleton {\n    border-radius: var(--nylas-border-radius-2x);\n    animation: pulsate 1.5s infinite;\n\n    &:nth-child(2) {\n      animation-delay: -100ms;\n    }\n\n    &:nth-child(3) {\n      animation-delay: -200ms;\n    }\n\n    &:nth-child(4) {\n      animation-delay: -300ms;\n    }\n\n    &:nth-child(5) {\n      animation-delay: -400ms;\n    }\n  }\n\n  .left .skeleton {\n    height: 100%;\n    width: 400px;\n  }\n\n  .right .skeleton {\n    height: 5rem;\n    width: 300px;\n    margin-bottom: 1rem;\n\n    &:last-child {\n      margin-bottom: 0;\n    }\n  }\n}\n\n@keyframes pulsate {\n  0% {\n    background-color: var(--nylas-base-50);\n  }\n\n  50% {\n    background-color: var(--nylas-base-100);\n  }\n\n  100% {\n    background-color: var(--nylas-base-50);\n  }\n}\n\n.select-date-page,\n.additional-data-page,\n.booked-event-page,\n.manual-confirmation-page,\n.cancelled-event-page,\n.cancel-flow-page {\n  border-top-left-radius: var(--nylas-border-radius-2x);\n  border-top-right-radius: var(--nylas-border-radius-2x);\n}\n\n.select-date-page,\n.additional-data-page {\n  display: flex;\n\n  @media #{$mobile} {\n    flex-direction: column;\n  }\n}\n\n.booked-event-page,\n.manual-confirmation-page {\n  background-color: var(--nylas-base-50);\n}\n\n.cancelled-event-page,\n.manual-confirmation-page,\n.cancel-flow-page {\n  padding: 1rem;\n  height: 496px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.booked-event-page,\n.manual-confirmation-page,\n.cancelled-event-page,\n.cancel-flow-page {\n  min-width: 784px;\n\n  @media #{$mobile} {\n    min-width: 90%;\n  }\n\n  background: var(--nylas-base-50);\n}\n\n.left-panel {\n  display: flex;\n  flex-direction: column;\n  min-width: 424px;\n  border-top-left-radius: inherit;\n  background: var(--nylas-base-0);\n  position: relative;\n  padding: 1rem 0 0 0;\n  height: 624px;\n\n  @media #{$mobile} {\n    border-top-right-radius: inherit;\n    min-width: unset;\n    height: auto;\n  }\n}\n\n.select-date-page .left-panel {\n  @media #{$mobile} {\n    height: 624px;\n  }\n}\n\n.border {\n  margin-left: -20px; // Offset left padding\n  margin-right: -20px; // Offset right padding\n  border-top-width: 1px;\n  height: 0.5px;\n  background-color: var(--nylas-base-200);\n\n  @media #{$mobile} {\n    display: none;\n  }\n}\n\n.right-panel {\n  min-width: 360px;\n  width: 360px;\n  background-color: var(--nylas-base-50);\n  height: 624px;\n  padding-top: 16px;\n  border-left: 1px solid var(--nylas-base-200);\n  border-top-right-radius: inherit;\n\n  &.reschedule {\n    border-top-right-radius: 0px;\n  }\n\n  @media #{$mobile} {\n    border-top-right-radius: 0px;\n    width: inherit;\n    min-width: unset;\n    height: auto;\n    border-left: none;\n  }\n\n  h2 {\n    display: flex;\n    margin: 0;\n    height: 48px;\n    gap: 0.5rem;\n    justify-content: center;\n    align-items: center;\n    width: auto;\n    font-size: 1.125rem;\n    line-height: 1.5rem;\n    font-weight: 500;\n    text-align: center;\n    color: var(--nylas-base-800);\n  }\n}\n\n.additional-data-page {\n  .left-panel {\n    background-color: var(--nylas-base-50);\n  }\n\n  .right-panel {\n    background-color: var(--nylas-base-0);\n  }\n}\n\nnylas-selected-event-card {\n  height: calc(640px - 36px);\n  padding: 0 1rem;\n\n  @media #{$mobile} {\n    height: 250px;\n  }\n}\n\n.footer {\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  padding: 16px;\n  font-size: 14px;\n  font-weight: 300;\n  color: var(--nylas-base-500);\n  border-top: 1px solid var(--nylas-base-200);\n  min-height: 24px;\n\n  .powered-by-nylas {\n    display: flex;\n    align-items: center;\n    text-decoration: none;\n\n    color: var(--nylas-base-500);\n\n    &:hover {\n      color: var(--nylas-base-800);\n    }\n  }\n\n  svg {\n    fill: var(--nylas-base-500);\n  }\n}\n\n.sr-only {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border-width: 0;\n}\n\n.footer svg {\n  margin-top: 1px;\n}\n\nnylas-selected-event-card::part(nsec__timezone) {\n  position: absolute;\n  bottom: 0;\n}\n\nnylas-notification {\n  margin: 1.5rem;\n  width: -webkit-fill-available;\n  width: -moz-available;\n  position: absolute;\n}\n\nnylas-locale-switch {\n  position: absolute;\n  padding: 18px 20px;\n  bottom: 0;\n  width: -webkit-fill-available;\n  width: -moz-available;\n  border-top: 1px solid var(--nylas-base-200);\n\n  @media #{$mobile} {\n    height: auto;\n  }\n}\n\nnylas-date-picker {\n  padding: 0 20px;\n}\n\nbutton-component#report-issue {\n  width: auto;\n  position: absolute;\n  bottom: 4px;\n  left: 16px;\n}\n\nnylas-feedback-form {\n  position: absolute;\n  top: 0;\n  height: 100%;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  background: rgba(0, 0, 0, 0.6);\n  z-index: 2;\n  border-radius: inherit;\n}","import { NylasBaseProvider } from '@/common/abstract-provider';\nimport { RegisteredComponent } from '@/common/register-component';\nimport type { SchedulerEventOverride } from '@/common/component-types';\nimport { NylasSchedulerConnector } from '@/connector/nylas-scheduler-connector';\nimport { CreateNylasSchedulerStore, NylasSchedulerStoreState, NylasSchedulerStoreType } from '@/stores/scheduler-store';\nimport {\n  NylasSchedulerBookingData,\n  ThemeConfig,\n  Notification,\n  NotificationType,\n  NylasSchedulerErrorResponse,\n  Timeslot,\n  NylasSchedulerResponse,\n  NylasSuccessResponse,\n} from '@nylas/core';\nimport { Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, State, Watch, h } from '@stencil/core';\nimport { addDaysToCurrentDate, capitalizeFirstLetter, compactStringToUUIDs, debug } from '@/utils/utils';\nimport { SchedulerView } from './scheduler-view';\nimport { ErrorCategory } from '@/connector/nylas-scheduler-connector/errors';\nimport { MessageBanner } from './message-banner';\nimport i18next from '@/utils/i18n';\nimport { NylasSchedulerBookingDataWithFlatFields, NylasEvent, UISettingsResponse } from '@/common/types';\nimport { LANGUAGE_CODE, LANGUAGE_CODE_MAP, Locale } from '@/common/constants';\nimport * as Sentry from '@sentry/browser';\n\nconst genericError = { title: i18next.t('genericErrorTitle'), type: NotificationType.Error, category: ErrorCategory.Component };\n\n/**\n * The `nylas-scheduling` component is used to display the Nylas Scheduling UI.\n *\n * @part ndp - [nylas-date-picker] The date picker host.\n * @part ndp__title - [nylas-date-picker] The title.\n * @part ndp__month-header - [nylas-date-picker] The month header.\n * @part ndp__month-button - [nylas-date-picker] The month button.\n * @part ndp__day - [nylas-date-picker] The day.\n * @part ndp__date - [nylas-date-picker] The date.\n * @part ndp__date--selected - [nylas-date-picker] The selected date.\n * @part ndp__date--current-day - [nylas-date-picker] The current day.\n * @part ndp__date--current-month - [nylas-date-picker] The dates in the current month.\n * @part ndp__date--disabled - [nylas-date-picker] The disabled dates.\n * @part ntp - [nylas-timeslot-picker] The timeslot picker component.\n * @part ntp__timeslot - [nylas-timeslot-picker] The timeslot button.\n * @part ntp__timeslot--selected - [nylas-timeslot-picker] The selected timeslot button.\n * @part ntp__button-primary - [nylas-timeslot-picker] The timeslot picker CTA.\n * @part nsec - [nylas-selected-event-card] The selected event card component.\n * @part nsec__card - [nylas-selected-event-card] The card component.\n * @part nsec__icon - [nylas-selected-event-card] The calendar icon.\n * @part nsec__date - [nylas-selected-event-card] The date selected.\n * @part nsec__time - [nylas-selected-event-card] The timeslot selected.\n * @part nbf - [nylas-booking-form] The booking form host.\n * @part nbf__input-textfield - [nylas-booking-form] The input textfield.\n * @part nbf__button-ghost - [nylas-booking-form] The ghost button.\n * @part nbf__button-outline - [nylas-booking-form] The outline button.\n * @part nbf__button-primary - [nylas-booking-form] The primary button.\n * @part nbf__input-wrapper - [nylas-booking-form] The input wrapper.\n * @part nbf__checkbox-component - [nylas-booking-form] The checkbox component.\n * @part nbf__radio-button-group - [nylas-booking-form] The radio button group.\n * @part nbf__textarea-component - [nylas-booking-form] The textarea component.\n * @part nbf__dropdown - [nylas-booking-form] The dropdown component.\n * @part nbf__dropdown-button - [nylas-booking-form] The dropdown button.\n * @part nbf__dropdown-content - [nylas-booking-form] The dropdown content.\n * @part ncec - [nylas-cancelled-event-card] The cancelled event card host.\n * @part ncec__icon - [nylas-cancelled-event-card] The calendar icon.\n * @part ncec__title - [nylas-cancelled-event-card] The title of the cancelled event card.\n * @part ncec__description - [nylas-cancelled-event-card] The description of the cancelled event card.\n * @part ncec__button-outline - [nylas-cancelled-event-card] The close button CTA.\n * @part ncec__card - [nylas-cancelled-event-card] The cancelled event card.\n * @part nbec - [nylas-booked-event-card] The booked event card host.\n * @part nbec__card - [nylas-booked-event-card] The booked event card.\n * @part nbec__title - [nylas-booked-event-card] The title of the booked event card.\n * @part nbec__description - [nylas-booked-event-card] The description of the booked event card.\n * @part nbec__button-outline - [nylas-booked-event-card] The cancel & reschedule button CTA.\n * @part nbec__cancel-cta - [nylas-booked-event-card] The cancel button CTA.\n * @part nbec__reschedule-cta - [nylas-booked-event-card] The reschedule button CTA.\n * @part nls - [nylas-locale-switch] The locale switch container.\n * @part nls__timezone - [nylas-locale-switch] The timezone select container\n * @part nls__timezone-dropdown - [nylas-locale-switch] The timezone dropdown\n * @part nls__timezone-drop-button - [nylas-locale-switch] The timezone dropdown button\n * @part nls__timezone-drop-button-selected-label - [nylas-locale-switch] The timezone dropdown button selected label\n * @part nls__timezone-drop-content - [nylas-locale-switch] The timezone dropdown content\n * @part nls__timezone-drop-label - [nylas-locale-switch] The timezone dropdown label\n * @part nls__language - [nylas-locale-switch] The language select container\n * @part nls__language-dropdown - [nylas-locale-switch] The language dropdown\n * @part nls__language-drop-button - [nylas-locale-switch] The language dropdown button\n * @part nls__language-drop-content - [nylas-locale-switch] The language dropdown content\n * @part nls__language-drop-label - [nylas-locale-switch] The language dropdown label\n * @part ncbf - [nylas-cancel-booking-form] The cancel booking form container.\n * @part ncbf__icon - [nylas-cancel-booking-form] The calendar icon.\n * @part ncbf__title - [nylas-cancel-booking-form] The title of the cancel booking form.\n * @part ncbf__description - [nylas-cancel-booking-form] The description of the cancel booking form.\n * @part ncbf__reason-textarea - [nylas-cancel-booking-form] The reason textarea.\n * @part ncbf__button-cta - [nylas-cancel-booking-form] The cancel booking form CTA button.\n * @part ncbf__button-outline - [nylas-cancel-booking-form] The cancel booking form outline button.\n * @part ncbf__card - [nylas-cancel-booking-form] The cancel booking form card.\n */\n@Component({\n  tag: 'nylas-scheduling',\n  styleUrl: 'nylas-scheduling.scss',\n  shadow: true,\n})\nexport class NylasScheduling {\n  /**\n   * Stores to be used by the provider.\n   */\n  private stores?: { scheduler: NylasSchedulerStoreType };\n\n  /**\n   * This is a base provide that defines the common methods and properties\n   * that all providers should have.\n   *\n   * Because stencil does not support abstract classes, we have to use a\n   * property to store the base provider instance.\n   */\n  private baseProvider?: NylasBaseProvider<Exclude<typeof this.stores, undefined>>;\n\n  /**\n   * The Nylas Scheduler Connector instance.\n   * The branins of the provider. It manages data fetching and state synchronization.\n   */\n  private nylasSchedulerConnector?: NylasSchedulerConnector;\n\n  /**\n   * The host element.\n   * Used to manage the host element of the provider.\n   */\n  @Element() private host!: HTMLNylasSchedulingElement;\n\n  /**\n   * This is used to set the mode for the Nylas Scheduler.\n   * The mode can be either `app` or `composable`. The default mode is `app`.\n   * - `app`: This mode is used to show the default Nylas Scheduler UI.\n   * - `composable`: This mode is used to show the composable Nylas Scheduler UI\n   *    by passing the individual scheduler components as children.\n   */\n  @Prop() readonly mode: 'app' | 'composable' = 'app';\n\n  /**\n   * The default scheduler store state.\n   * Used to set the initial state of the scheduler store.\n   */\n  @Prop({ attribute: 'default-scheduler-store-state' }) readonly defaultSchedulerState?: Partial<NylasSchedulerStoreState>;\n\n  /**\n   * The session ID for the Nylas Scheduler.\n   * This is used to authenticate the user.\n   */\n  @Prop() readonly sessionId?: string;\n\n  /**\n   * The URL for the Nylas Scheduler API. (staging or production URL)\n   */\n  @Prop() readonly schedulerApiUrl: string = 'https://api.us.nylas.com';\n\n  /**\n   * This enables passing the bookingInfo object to the Scheduler UI for direct booking event creation.\n   * When used with timeslotConfirmedHandler, it bypasses the additional data page and immediately\n   * invokes the handler after booking.\n   */\n  @Prop() readonly bookingInfo?: NylasSchedulerBookingData;\n\n  /**\n   * Booking Ref required for rescheduling flow.\n   */\n  @Prop() readonly rescheduleBookingRef?: string;\n\n  /**\n   * Booking Ref required for cancelling flow.\n   */\n  @Prop() readonly cancelBookingRef?: string;\n\n  /**\n   * Booking Ref required for the manual confirmation flow.\n   */\n  @Prop() readonly organizerConfirmationBookingRef?: string;\n\n  /**\n   * The config ID for the Nylas Scheduler. This should be passed in when using a public config,\n   * in which case the sessionId is not required.\n   */\n  @Prop() readonly configurationId?: string;\n\n  /**\n   * The slug of the configuration (public config) to be used for the Nylas Scheduler. This is used in conjunction with the clientId.\n   * When the configurationId is not provided, the slug and clientId are used to make requests to the Scheduler API endpoints.\n   * If the configurationId is provided, this prop will be ignored.\n   */\n  @Prop() readonly slug?: string;\n\n  /**\n   * The app ID of the configuration (public config) to be used for the Nylas Scheduler. This is used in conjunction with the slug.\n   * When the configurationId is not provided, the slug and clientId are used to make requests to the Scheduler API endpoints.\n   * If the configurationId is provided, this prop will be ignored.\n   */\n  @Prop() readonly clientId?: string;\n\n  /**\n   * This prop lets you hide the Nylas branding.\n   * Default is true.\n   */\n  @Prop() readonly nylasBranding?: boolean = true;\n\n  /**\n   * This provides an easy way to override the default function of the event emitter.\n   * An example of this is the `timeslotConfirmed` event. By default, this event will set the scheduler store state for `showBookingForm` to `true` which will\n   * show the booking form. However, if you want to override this behavior, you can pass in the prop `eventOverride` like:\n   * ```html\n   * <nylas-scheduling eventOverride={{\"timeslotConfirmed\": (event, nylasConnector) => { console.log(\"Timeslot confirmed event fired!\"); } }} />\n   * ```\n   */\n  @Prop({ attribute: 'event-overrides' }) readonly eventOverrides: SchedulerEventOverride = {};\n\n  /**\n   * The loading state. This is used to set the loading state for the Nylas Scheduler when fetching data.\n   */\n  @Prop() readonly isLoading?: boolean;\n\n  /**\n   * Theme config, used to automatically generate a theme with color palette and\n   * CSS variables to customize the look and feel of the Nylas Scheduler.\n   */\n  @Prop() readonly themeConfig?: ThemeConfig;\n\n  /**\n   * This prop will allow to override the default localization strings for each language.\n   * Nylas scheduling page currently support the following language codes: en, es, fr, de, sv, zh, ja, nl.\n   */\n  @Prop() readonly localization?: Partial<Record<LANGUAGE_CODE, Locale>>;\n\n  /*\n   * Displays notifications for errors by default. When enabled (`true`), errors\n   * automatically appear as notifications. Disabling this feature (`false`) allows\n   * the parent application to capture and manage errors by listening to the\n   * `nylasSchedulerError` event, providing flexibility in error handling.\n   */\n  @Prop() readonly showNotification?: boolean = true;\n\n  @Prop() readonly enableUserFeedback?: boolean = true;\n\n  @Prop() readonly hour12?: boolean | undefined;\n\n  /**\n   * Automatically register components that have the `@RegisterComponent` decorator.\n   * If this is set to false, you will need to manually register components using the\n   * `registerComponent` method.\n   * @default true\n   */\n  @State() automaticComponentRegistration: boolean = true;\n\n  /**\n   * The selected date label for the Nylas Scheduler.\n   * This is used to set the initial date label for the Nylas Scheduler.\n   */\n  @State() selectedDateLabel: string = new Date().toLocaleDateString(undefined, { dateStyle: 'full' }) || `${i18next.t('noDateSelected')}`;\n\n  /**\n   * The config id extracted from the rescheduleBookingRef or cancelBookingRef or organizerConfirmationBookingRef.\n   */\n  @State() refConfigId?: string;\n\n  /**\n   * The selected language for the Nylas Scheduler.\n   */\n  @State() language: string = navigator.language;\n\n  /**\n   * The state for showing the feedback modal.\n   */\n  @State() showFeedbackModal: boolean = false;\n\n  /**\n   * The state of bookingInfo after the user has confirmed the booking.\n   */\n  @State() bookingInfoConfirmed: NylasSchedulerBookingDataWithFlatFields | null = null;\n\n  /**\n   * This event is fired when the provider is initialized.\n   * It can be used to set the initial state of the provider,\n   * or to prevent the provider from firing some default behavior.\n   */\n  @Event({ cancelable: true }) init!: EventEmitter<HTMLNylasSchedulingElement>;\n\n  /**\n   * This event is fired when the scheduler component enters componentWillLoad lifecycle.\n   */\n  @Event() schedulerWillLoad!: EventEmitter<HTMLNylasSchedulingElement>;\n\n  /**\n   * This event is fired when the scheduler component enters componentDidLoad lifecycle.\n   */\n  @Event() schedulerDidLoad!: EventEmitter<HTMLNylasSchedulingElement>;\n\n  @Event({\n    eventName: 'nylasSchedulerError',\n  })\n  nylasSchedulerError!: EventEmitter<{ notification: Notification; host: HTMLElement }>;\n\n  @Event({\n    eventName: 'configSettingsLoaded',\n  })\n  configSettingsLoaded!: EventEmitter<{ settings: NylasSchedulerResponse<UISettingsResponse> }>;\n\n  /**\n   * This event is triggered if either the rescheduleBookingRef or cancelBookingRef or organizerConfirmationBookingRef prop\n   * is supplied and the component has been attached to the DOM. It emits the configurationId\n   * and bookingId derived from the rescheduleBookingRef or cancelBookingRef or organizerConfirmationBookingRef. Subscribe to this\n   * event to obtain the extracted configurationId, which is necessary to generate the sessionID\n   * for configurations that are not public.\n   */\n  @Event() bookingRefExtracted!: EventEmitter<{ configurationId: string; bookingId: string; salt?: string }>;\n\n  /**\n   * This event is triggered on successful booking request. It emits the event data.\n   */\n  @Event() bookedEventInfo!: EventEmitter<NylasSchedulerResponse<NylasEvent>>;\n\n  /**\n   * This function is called when the component is connected to the DOM.\n   * At this point in the component lifecycle, the base provider has not yet\n   * been initialized. So avoid using the base provider in this method or stores\n   * in this method.\n   */\n  connectedCallback() {\n    debug(`[nylas-scheduler] connectedCallback`);\n  }\n\n  async componentWillLoad() {\n    debug(`[nylas-scheduler] Component will load`);\n\n    if (this.enableUserFeedback && !Sentry.isInitialized()) {\n      Sentry.init({\n        dsn: 'https://9d5731f1c77ca84c9ed3fb9b3ccf7ee1@o74852.ingest.us.sentry.io/4507889638178816',\n        release: process.env.PACKAGE_VERSION,\n        integrations: integrations => [\n          ...integrations.filter(_integration => false), // Removes default integrations (including Breadcrumbs)\n          Sentry.feedbackIntegration({\n            colorScheme: 'system',\n            autoInject: false,\n          }),\n        ],\n        // Disable all other event capture\n        autoSessionTracking: false, // Disable session tracking\n        beforeSend: () => null, // Prevents error events from being sent\n      });\n    }\n\n    // Emit the schedulerWillLoad event to allow the parent application to set the initial\n    // state of the provider or to prevent the provider from firing some default behavior.\n    const schedulerWillLoadEvent = this.schedulerWillLoad.emit(this.host);\n    if ('schedulerWillLoad' in this.eventOverrides) {\n      await this.eventOverrides.schedulerWillLoad(schedulerWillLoadEvent, this.nylasSchedulerConnector);\n      if (schedulerWillLoadEvent.defaultPrevented) {\n        return;\n      }\n    }\n\n    this.stores = {\n      scheduler: CreateNylasSchedulerStore({\n        bookingInfo: this.bookingInfo,\n        nylasBranding: this.nylasBranding,\n        themeConfig: this.themeConfig,\n        hour12: this.hour12,\n        ...this.defaultSchedulerState,\n      }),\n    };\n\n    this.baseProvider = new NylasBaseProvider(this.host, this.stores, this.automaticComponentRegistration, this.eventOverrides);\n\n    // Set the configId to the reschedule configId if rescheduleBookingRef is provided or\n    // Set the configId to the cancel configId if cancelBookingRef is provided\n    this.refConfigId = this.configurationId;\n    let bookingRefExtractedEvent;\n    if (this.rescheduleBookingRef) {\n      const [rescheduleConfigId, rescheduleBookingId, _] = compactStringToUUIDs(this.rescheduleBookingRef);\n      this.refConfigId = rescheduleConfigId;\n      this.stores.scheduler.set('rescheduleBookingId', rescheduleBookingId);\n      bookingRefExtractedEvent = this.bookingRefExtracted.emit({ configurationId: rescheduleConfigId, bookingId: rescheduleBookingId });\n    } else if (this.cancelBookingRef) {\n      const [cancelConfigId, cancelBookingId, _] = compactStringToUUIDs(this.cancelBookingRef);\n      this.refConfigId = cancelConfigId;\n      this.stores.scheduler.set('cancelBookingId', cancelBookingId);\n      bookingRefExtractedEvent = this.bookingRefExtracted.emit({ configurationId: cancelConfigId, bookingId: cancelBookingId });\n    } else if (this.organizerConfirmationBookingRef) {\n      const [organizerConfirmationConfigId, organizerConfirmationBookingId, salt] = compactStringToUUIDs(this.organizerConfirmationBookingRef);\n      this.refConfigId = organizerConfirmationConfigId;\n      this.stores.scheduler.set('organizerConfirmationBookingId', organizerConfirmationBookingId);\n      this.stores.scheduler.set('organizerConfirmationSalt', salt);\n      bookingRefExtractedEvent = this.bookingRefExtracted.emit({ configurationId: organizerConfirmationConfigId, bookingId: organizerConfirmationBookingId, salt: salt });\n    }\n\n    if ('bookingRefExtracted' in this.eventOverrides) {\n      await this.eventOverrides.bookingRefExtracted(bookingRefExtractedEvent, this.nylasSchedulerConnector);\n      if (bookingRefExtractedEvent.defaultPrevented) {\n        return;\n      }\n    }\n\n    if (!this.checkIfSessionIdOrConfigIdExists()) {\n      return;\n    }\n\n    const nylasSchedulerStore = this.baseProvider?.getStore('scheduler');\n    this.nylasSchedulerConnector = new NylasSchedulerConnector({\n      schedulerAPIURL: this.schedulerApiUrl,\n      sessionId: this.sessionId,\n      configId: this.refConfigId,\n      slug: this.slug,\n      clientId: this.clientId,\n      nylasSchedulerStore,\n    });\n\n    const initEvent = this.init.emit(this.host);\n    if ('init' in this.eventOverrides) {\n      await this.eventOverrides.init(initEvent, this.nylasSchedulerConnector);\n      if (initEvent.defaultPrevented) {\n        return;\n      }\n    }\n\n    this.baseProvider?.componentWillLoad(this.nylasSchedulerConnector);\n    // Override theme\n    this.applyThemeConfig(this.themeConfig);\n  }\n\n  async componentDidLoad() {\n    this.baseProvider?.componentDidLoad();\n\n    const schedulerDidLoadEvent = this.schedulerDidLoad.emit(this.host);\n    if ('schedulerDidLoad' in this.eventOverrides) {\n      await this.eventOverrides.schedulerDidLoad(schedulerDidLoadEvent, this.nylasSchedulerConnector);\n      if (schedulerDidLoadEvent.defaultPrevented) {\n        return;\n      }\n    }\n\n    // If sessionId is not provided, do not fetch availability\n    if (!this.checkIfSessionIdOrConfigIdExists()) {\n      return;\n    }\n    this.localizationChanged(this.localization);\n    const settingsResponse = await this.nylasSchedulerConnector?.scheduler.getUISettings();\n    if (!settingsResponse || 'error' in settingsResponse) {\n      this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(settingsResponse?.error) }, host: this.host });\n      return;\n    } else {\n      if ('data' in settingsResponse && settingsResponse.data?.appearance) {\n        console.info(\n          'Appearance settings have been returned from the configuration used byt his scheduling page; please remember to grab them from the configSettingsLoaded event and apply them as desired.',\n        );\n      }\n      const configSettingsLoadedEvent = this.configSettingsLoaded.emit({ settings: settingsResponse });\n      if ('configSettingsLoaded' in this.eventOverrides) {\n        await this.eventOverrides.configSettingsLoaded(configSettingsLoadedEvent, this.nylasSchedulerConnector);\n        if (configSettingsLoadedEvent.defaultPrevented) {\n          return;\n        }\n      }\n    }\n\n    const nylasSchedulerStore = this.baseProvider?.getStore('scheduler');\n    const availableDaysInFuture = nylasSchedulerStore?.get('configSettings')?.scheduler?.available_days_in_future;\n    const selectedTimeslot = nylasSchedulerStore?.get('selectedTimeslot');\n\n    if (selectedTimeslot && selectedTimeslot?.start_time) {\n      if (!this.isTimeslotValid(selectedTimeslot)) {\n        return;\n      }\n\n      // If the selected timeslot is already set, do not fetch availability\n      if (nylasSchedulerStore?.get('showBookingForm')) {\n        nylasSchedulerStore?.set('selectedDate', selectedTimeslot.start_time);\n        return;\n      }\n    }\n\n    const selectedDate = nylasSchedulerStore?.get('selectedDate');\n    const availability = nylasSchedulerStore?.get('availability');\n    let result;\n\n    if (availability && availability.length > 0) {\n      return;\n    }\n\n    if (!selectedDate) {\n      const today = new Date();\n      const { startTime, endTime, endTimeForAvailableDaysInFuture } = this.validateAvailableDaysInFuture(today, availableDaysInFuture || 30);\n      if (today.getTime() < endTimeForAvailableDaysInFuture * 1000) {\n        result = await this.nylasSchedulerConnector?.scheduler.getAvailability(startTime, endTime);\n      }\n    } else {\n      const { startTime, endTime, endTimeForAvailableDaysInFuture } = this.validateAvailableDaysInFuture(selectedDate, availableDaysInFuture || 30);\n      if (selectedDate.getTime() < endTimeForAvailableDaysInFuture * 1000) {\n        result = await this.nylasSchedulerConnector?.scheduler.getAvailability(startTime, endTime);\n      }\n    }\n\n    if (!result || 'error' in result) {\n      this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(result?.error) }, host: this.host });\n    }\n\n    if (!selectedDate) {\n      let _selectedDate = new Date();\n      const firstAvailableDate = nylasSchedulerStore?.get('availability').find((timeslot: any) => new Date(timeslot.start_time) > new Date());\n      if (firstAvailableDate) {\n        _selectedDate = firstAvailableDate.start_time;\n      }\n      nylasSchedulerStore?.set('selectedDate', _selectedDate);\n    }\n  }\n\n  componentDisconnected() {\n    this.baseProvider?.componentDisconnected();\n  }\n\n  @Watch('bookingInfo')\n  bookingInfoChanged(newVal?: NylasSchedulerBookingData) {\n    this.stores?.scheduler.set('bookingInfo', newVal);\n  }\n\n  @Watch('rescheduleBookingRef')\n  rescheduleBookingRefChanged(newVal?: string) {\n    if (newVal) {\n      const [configId, bookingId] = compactStringToUUIDs(newVal);\n      this.stores?.scheduler.set('rescheduleBookingId', bookingId);\n      this.refConfigId = configId;\n      this.nylasSchedulerConnector?.scheduler.setConfigId(configId);\n    }\n  }\n\n  @Watch('cancelBookingRef')\n  cancelBookingRefChanged(newVal?: string) {\n    if (newVal) {\n      const [configId, bookingId] = compactStringToUUIDs(newVal);\n      this.stores?.scheduler.set('cancelBookingId', bookingId);\n      this.refConfigId = configId;\n      this.nylasSchedulerConnector?.scheduler.setConfigId(configId);\n    }\n  }\n\n  @Watch('organizerConfirmationBookingRef')\n  organizerConfirmationBookingRefChanged(newVal?: string) {\n    if (newVal) {\n      const [configId, bookingId] = compactStringToUUIDs(newVal);\n      this.stores?.scheduler.set('organizerConfirmationBookingId', bookingId);\n      this.refConfigId = configId;\n      this.nylasSchedulerConnector?.scheduler.setConfigId(configId);\n    }\n  }\n\n  @Watch('localization')\n  localizationChanged(newVal?: Partial<Record<LANGUAGE_CODE, Locale>>) {\n    if (!newVal) {\n      return;\n    }\n\n    Object.keys(newVal).forEach(lang => {\n      if (!(lang in LANGUAGE_CODE)) {\n        return;\n      }\n      i18next.addResourceBundle(\n        lang,\n        'translation',\n        newVal[lang],\n        false, // Merge with existing translations\n        true, // Replace the existing translations with the same key\n      );\n    });\n  }\n\n  @Watch('themeConfig')\n  themeConfigChanged(newVal?: ThemeConfig) {\n    // Set the theme config in the store, hosted page will use this to apply/re-apply the theme\n    this.baseProvider?.getStore('scheduler')?.set('themeConfig', newVal);\n    this.applyThemeConfig(newVal);\n  }\n\n  @Listen('languageChanged')\n  languageChanged(event: CustomEvent<string>) {\n    const newLanguage = event.detail;\n    this.language = newLanguage;\n    i18next.changeLanguage(newLanguage);\n  }\n\n  /**\n   * This is a custom event handler that is used to register a component with the provider.\n   * It is used by components that have the `@RegisterComponent` decorator.\n   * @param event A custom event that contains the component to register\n   * @returns Promise<void>\n   */\n  @Listen('registerComponent')\n  async registerComponentHandler(event: CustomEvent<RegisteredComponent<any, any>>): Promise<void> {\n    this.baseProvider?.registerComponent(event.detail);\n  }\n\n  /**\n   * This is a custom event handler that is used to unregister a component with the provider.\n   * It is used by components that have the `@RegisterComponent` decorator.\n   * @param event A custom event that contains the component to unregister\n   * @returns Promise<void>\n   */\n  @Listen('unregisterComponent')\n  async unregisterComponentHandler(event: CustomEvent<RegisteredComponent<any, any>>): Promise<void> {\n    this.baseProvider?.unregisterComponent(event.detail);\n  }\n\n  /**\n   * This is a custom event handler that is used to refetch the availability when the month is changed.\n   */\n  @Listen('monthChanged')\n  async monthChangedHandler(event: CustomEvent<Date>) {\n    const date = event.detail;\n    const availableDaysInFuture = this.nylasSchedulerConnector?.schedulerStore?.get('configSettings')?.scheduler?.available_days_in_future;\n    const { startTime, endTime, endTimeForAvailableDaysInFuture } = this.validateAvailableDaysInFuture(date, availableDaysInFuture || 30);\n\n    if (event.defaultPrevented) {\n      return;\n    }\n\n    if (startTime < endTimeForAvailableDaysInFuture && date.getTime() < endTimeForAvailableDaysInFuture * 1000) {\n      const result = await this.nylasSchedulerConnector?.scheduler.getAvailability(startTime, endTime);\n\n      if (!result || 'error' in result) {\n        this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(result?.error) }, host: this.host });\n      }\n      const selectableDates = this.stores?.scheduler.get('selectableDates');\n      if (selectableDates && selectableDates.length > 0) {\n        this.stores?.scheduler.set('selectedDate', selectableDates[0]);\n      }\n    }\n  }\n\n  mapToBookingData(bookingInfo: NylasSchedulerBookingDataWithFlatFields): any {\n    const timeslot = this.stores?.scheduler.get('selectedTimeslot');\n    const language = this.stores?.scheduler.get('selectedLanguage');\n    const timezone = this.stores?.scheduler.get('selectedTimezone');\n    const startTime = timeslot?.start_time ? new Date(timeslot?.start_time).getTime() / 1000 : '';\n    const endTime = timeslot?.end_time ? new Date(timeslot?.end_time).getTime() / 1000 : '';\n    return {\n      additional_guests: bookingInfo.guests,\n      guest: { ...bookingInfo.primaryParticipant },\n      additional_fields: { ...bookingInfo.additionalFields },\n      start_time: startTime,\n      end_time: endTime,\n      email_language: language,\n      timezone: timezone,\n    };\n  }\n\n  /**\n   * This is a custom event handler to book an event.\n   */\n  @Listen('detailsConfirmed')\n  async bookButtonClickedHandler(event: CustomEvent<NylasSchedulerBookingDataWithFlatFields>) {\n    if (event.defaultPrevented) {\n      return;\n    }\n    const bookingData = event.detail;\n    const mappedBookingData = this.mapToBookingData(bookingData);\n    this.bookingInfoConfirmed = bookingData;\n\n    const storeRescheduleId = this.nylasSchedulerConnector?.schedulerStore?.get('rescheduleBookingId');\n    const rescheduleBookingId = storeRescheduleId;\n    if (rescheduleBookingId) {\n      const result = await this.nylasSchedulerConnector?.scheduler.rescheduleBooking(rescheduleBookingId, bookingData);\n      if (!result || 'error' in result) {\n        this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(result?.error) }, host: this.host });\n      }\n      const resultData = (result as NylasSuccessResponse<NylasEvent>)?.data;\n      const bookedEventInfoEvent = this.bookedEventInfo.emit({ ...result, data: { ...resultData, ...mappedBookingData } });\n      this.bookingInfoConfirmed = { ...this.bookingInfoConfirmed, ...resultData };\n      if ('bookedEventInfo' in this.eventOverrides) {\n        await this.eventOverrides.bookedEventInfo(bookedEventInfoEvent, this.nylasSchedulerConnector);\n      }\n      return;\n    }\n    const result = await this.nylasSchedulerConnector?.scheduler.bookTimeslot(bookingData);\n    if (!result || 'error' in result) {\n      this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(result?.error) }, host: this.host });\n    }\n    const resultData = (result as NylasSuccessResponse<NylasEvent>)?.data;\n    const bookedEventInfoEvent = this.bookedEventInfo.emit({ ...result, data: { ...resultData, ...mappedBookingData } });\n    this.bookingInfoConfirmed = { ...this.bookingInfoConfirmed, ...resultData };\n    if ('bookedEventInfo' in this.eventOverrides) {\n      await this.eventOverrides.bookedEventInfo(bookedEventInfoEvent, this.nylasSchedulerConnector);\n    }\n  }\n\n  /**\n   * This is a custom event handler to update the selected date label.\n   */\n  @Listen('dateSelected')\n  dateSelectedHandler(event: CustomEvent<Date>) {\n    const date = event.detail;\n    this.selectedDateLabel = date ? date.toLocaleDateString(undefined, { dateStyle: 'full' }) : `${i18next.t('noDateSelected')}`;\n  }\n\n  /**\n   * This is an event handler to handle the error (if any) when the\n   * cancel booking button is clicked on the cancel booking form.\n   */\n  @Listen('cancelBookedEventError')\n  cancelBookedEventErrorHandler(event: CustomEvent<NylasSchedulerErrorResponse>) {\n    this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(event.detail.error) }, host: this.host });\n  }\n\n  @Listen('cancelBookedEventValidationError')\n  cancelBookedEventValidationErrorHandler(event: CustomEvent<NylasSchedulerErrorResponse>) {\n    this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(event.detail.error) }, host: this.host });\n  }\n\n  /**\n   * This is an event handler to handle the error (if any) when the\n   * reschedule button is clicked on the booked event card.\n   */\n  @Listen('rescheduleBookedEventError')\n  rescheduleBookedEventErrorHandler(event: CustomEvent<NylasSchedulerErrorResponse>) {\n    this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(event.detail.error) }, host: this.host });\n  }\n\n  /**\n   * This is an event handler to handle the error (if any) when the\n   * manual confirmation button is clicked on the manual confirmation card.\n   */\n  @Listen('confirmBookingError')\n  confirmBookingErrorHandler(event: CustomEvent<NylasSchedulerErrorResponse>) {\n    this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(event.detail.error) }, host: this.host });\n  }\n\n  @Listen('feedbackModalClosed')\n  feedbackModalClosedHandler() {\n    this.showFeedbackModal = false;\n  }\n\n  @Listen('feedbackSubmitted')\n  feedbackSubmittedHandler(event: CustomEvent<{ feedback: string }>) {\n    const eventId = Sentry.captureMessage('Scheduling Page User Feedback');\n    const feedback = {\n      eventId: eventId,\n      message: event.detail.feedback,\n    };\n    Sentry.captureFeedback(feedback, {\n      includeReplay: true,\n      captureContext: {\n        tags: {\n          'nylas-web-element': 'nylas-schduling',\n          'nylas-web-element-version': process.env.PACKAGE_VERSION,\n        },\n        extra: {\n          configId: this.configurationId,\n          slug: this.slug,\n        },\n      },\n    });\n    this.showFeedbackModal = false;\n  }\n\n  /**\n   * This method is used to retrieve the NylasScheduler instance\n   * @returns The NylasScheduler instance\n   */\n  @Method()\n  async getNylasSchedulerStore(): Promise<NylasSchedulerStoreType | undefined> {\n    return this.baseProvider?.getStore('scheduler');\n  }\n\n  /**\n   * This method is used to retrieve the NylasConnector instance\n   * @returns The NylasConnector instance\n   */\n  @Method()\n  async getNylasSchedulerConnector() {\n    return this.nylasSchedulerConnector;\n  }\n\n  @Method()\n  async getRef() {\n    return this.host;\n  }\n\n  private getErrorObject(error: NylasSchedulerErrorResponse['error']): Notification {\n    return {\n      title: error?.title || genericError.title,\n      category: error?.category || genericError.category,\n      type: NotificationType.Error,\n      description: error?.message || '',\n      id: new Date().getTime().toString(),\n      ttl: 'none',\n    };\n  }\n  private checkIfSessionIdOrConfigIdExists(): boolean {\n    if (!this.sessionId && !this.refConfigId && !(this.slug && this.clientId)) {\n      let description = '';\n\n      if (!this.sessionId) {\n        description += i18next.t('sessionIdRequiredErrorMessage');\n      }\n\n      if (!this.sessionId && !this.refConfigId && !(this.slug && this.clientId)) {\n        description = i18next.t('sessionIdRequiredErrorMessage') + ' ' + i18next.t('publicConfigErrorMessage');\n      }\n\n      this.nylasSchedulerError.emit({\n        notification: {\n          title: i18next.t('schedulingComponentErrorTitle'),\n          category: ErrorCategory.Component,\n          type: NotificationType.Error,\n          description: description,\n          id: new Date().getTime().toString(),\n          ttl: 'none',\n        },\n        host: this.host,\n      });\n      return false;\n    }\n    return true;\n  }\n\n  private isTimeslotValid(timeslot: Timeslot): boolean {\n    const selectedDate = new Date(timeslot.start_time);\n    if (selectedDate < new Date()) {\n      this.nylasSchedulerError.emit({\n        notification: {\n          title: i18next.t('invalidTimeslotErrorTitle'),\n          category: ErrorCategory.Component,\n          type: NotificationType.Error,\n          description: i18next.t('invalidTimeslotErrorMessage'),\n          id: new Date().getTime().toString(),\n          ttl: 'none',\n        },\n        host: this.host,\n      });\n      return false;\n    }\n    return true;\n  }\n\n  private validateAvailableDaysInFuture(\n    startDate: Date,\n    availableDaysInFuture: number,\n  ): {\n    startTime: number;\n    endTime: number;\n    endTimeForAvailableDaysInFuture: number;\n  } {\n    const today = new Date();\n    const startTime = new Date(startDate.getFullYear(), startDate.getMonth(), 1).getTime() / 1000;\n    const endTimeForCurrentMonth = new Date(startDate.getFullYear(), startDate.getMonth() + 1, 1).getTime() / 1000;\n    const endTimeForAvailableDaysInFuture = Math.floor(addDaysToCurrentDate(today, availableDaysInFuture).getTime() / 1000);\n    const endTime = Math.min(endTimeForAvailableDaysInFuture, endTimeForCurrentMonth);\n    const startTimeWithOffset = startTime < today.getTime() / 1000 ? Math.floor(today.getTime() / 1000) : startTime;\n    return { startTime: startTimeWithOffset, endTime, endTimeForAvailableDaysInFuture };\n  }\n\n  private applyThemeConfig(themeConfig?: ThemeConfig) {\n    if (themeConfig) {\n      for (const [key, value] of Object.entries(themeConfig)) {\n        this.host.style.setProperty(`${key}`, value);\n      }\n    }\n  }\n\n  onFeedbackClick(e: Event) {\n    e.preventDefault();\n    this.showFeedbackModal = true;\n  }\n\n  redirectToCustomUrl(url: string) {\n    window.location.assign(url);\n  }\n\n  /**\n   * @slot timeslot-picker-cta-label - This slot is used to pass a custom label to the timeslot picker CTA. The default label is \"Next\".\n   * @slot custom-booking-form - This slot is used to pass a custom booking form to the Nylas Scheduling component.\n   * @deprecated  Deprecated in favor of using the additional fields defined in the config settings.\n   */\n  render() {\n    const showDefaultScheduler = this.mode === 'app';\n    const nylasSchedulerStore = this.baseProvider?.getStore('scheduler');\n    const eventInfo = nylasSchedulerStore?.get('eventInfo');\n    const showBookingForm = nylasSchedulerStore?.get('showBookingForm');\n    const cancelledEventInfo = nylasSchedulerStore?.get('cancelledEventInfo');\n    const cancelBookingId = nylasSchedulerStore?.get('cancelBookingId');\n    const selectedTimeslot = nylasSchedulerStore?.get('selectedTimeslot') as Timeslot;\n    const rescheduleBookingId = nylasSchedulerStore?.get('rescheduleBookingId');\n    const organizerConfirmationBookingId = nylasSchedulerStore?.get('organizerConfirmationBookingId');\n    const rejectBookingId = nylasSchedulerStore?.get('rejectBookingId');\n    const confirmedEventInfo = nylasSchedulerStore?.get('confirmedEventInfo');\n    const nylasBranding = nylasSchedulerStore?.get('nylasBranding') || this.nylasBranding;\n    const selectedDate = nylasSchedulerStore?.get('selectedDate');\n    const redirectUrl = nylasSchedulerStore?.get('configSettings')?.scheduler?.confirmation_redirect_url;\n    this.selectedDateLabel =\n      selectedDate && this.language\n        ? capitalizeFirstLetter(selectedDate.toLocaleDateString(LANGUAGE_CODE_MAP[this.language], { dateStyle: 'full' }))\n        : `${i18next.t('noDateSelected')}`;\n\n    if (showDefaultScheduler && (cancelBookingId || rejectBookingId) && !cancelledEventInfo) {\n      return (\n        <Host>\n          <SchedulerView nylasBranding={nylasBranding} isLoading={this.isLoading} showNotification={this.showNotification}>\n            <div class=\"cancel-flow-page\" part=\"cancel-flow-page\">\n              <nylas-cancel-booking-form\n                selectedTimeslot={selectedTimeslot}\n                cancelBookingId={cancelBookingId}\n                rejectBookingId={rejectBookingId}\n                exportparts=\"ncbf, ncbf__icon, ncbf__title, ncbf__description, ncbf__reason-textarea, ncbf__button-cta, ncbf__button-outline, ncbf__card\"\n              />\n            </div>\n          </SchedulerView>\n          {this.enableUserFeedback && (\n            <button-component id=\"report-issue\" variant={'basic'} onClick={e => this.onFeedbackClick(e)}>\n              <feedback-icon />\n            </button-component>\n          )}\n          {this.showFeedbackModal && <nylas-feedback-form></nylas-feedback-form>}\n        </Host>\n      );\n    }\n\n    // Manual confirmation page is shown when the event is manually confirmed\n    if (showDefaultScheduler && organizerConfirmationBookingId) {\n      return (\n        <Host>\n          <SchedulerView>\n            <div class=\"manual-confirmation-page\" part=\"manual-confirmation-page\">\n              <nylas-organizer-confirmation-card\n                organizerConfirmationBookingId={organizerConfirmationBookingId}\n                exportparts=\"nmcc, nmcc__title, nmcc__description, nmcc__button-cta, nmcc__button-outline\"\n              />\n            </div>\n          </SchedulerView>\n          {this.enableUserFeedback && (\n            <button-component id=\"report-issue\" variant={'basic'} onClick={e => this.onFeedbackClick(e)}>\n              <feedback-icon />\n            </button-component>\n          )}\n          {this.showFeedbackModal && <nylas-feedback-form></nylas-feedback-form>}\n        </Host>\n      );\n    }\n\n    // Cancelled event card is shown when the event is cancelled\n    if (showDefaultScheduler && cancelledEventInfo) {\n      return (\n        <Host>\n          <SchedulerView nylasBranding={nylasBranding} isLoading={this.isLoading} showNotification={this.showNotification}>\n            <div class=\"cancelled-event-page\" part=\"cancelled-event-page\">\n              <nylas-cancelled-event-card\n                cancelledEventInfo={cancelledEventInfo}\n                exportparts=\"ncec, ncec__icon, ncec__title, ncec__description, ncec__button-outline, ncec__card\"\n              />\n            </div>\n          </SchedulerView>\n          {this.enableUserFeedback && (\n            <button-component id=\"report-issue\" variant={'basic'} onClick={e => this.onFeedbackClick(e)}>\n              <feedback-icon />\n            </button-component>\n          )}\n          {this.showFeedbackModal && <nylas-feedback-form></nylas-feedback-form>}\n        </Host>\n      );\n    }\n\n    // Confirmed event card is shown when the event is confirmed\n    if (showDefaultScheduler && confirmedEventInfo) {\n      return (\n        <Host>\n          <SchedulerView nylasBranding={nylasBranding} isLoading={this.isLoading} showNotification={this.showNotification}>\n            <div class=\"cancelled-event-page\" part=\"confirmed-event-page\">\n              <nylas-confirmed-event-card\n                confirmedEventInfo={confirmedEventInfo}\n                exportparts=\"ncec, ncec__icon, ncec__title, ncec__description, ncec__button-outline, ncec__card\"\n              />\n            </div>\n          </SchedulerView>\n          {this.enableUserFeedback && (\n            <button-component id=\"report-issue\" variant={'basic'} onClick={e => this.onFeedbackClick(e)}>\n              <feedback-icon />\n            </button-component>\n          )}\n          {this.showFeedbackModal && <nylas-feedback-form></nylas-feedback-form>}\n        </Host>\n      );\n    }\n\n    // Redirected to custom URL when the event is booked and redirect URL is provided\n    if (showDefaultScheduler && eventInfo && redirectUrl) {\n      const recipient = this.bookingInfoConfirmed?.primaryParticipant;\n      const location = this.bookingInfoConfirmed?.location;\n      const booking_ref = this.bookingInfoConfirmed?.booking_ref;\n      const additionalFields = this.bookingInfoConfirmed?.additionalFields || {};\n      if (this.bookingInfo && typeof this.bookingInfo?.additionalFields !== 'undefined') {\n        const bookingInfoAdditionalFields = this.bookingInfo.additionalFields;\n        // Merge additional fields from the bookingInfo with the additional fields from the booking form\n        Object.keys(bookingInfoAdditionalFields).forEach(key => {\n          if (!additionalFields[key] && bookingInfoAdditionalFields?.[key]) {\n            additionalFields[key] = bookingInfoAdditionalFields[key].value;\n          }\n        });\n      }\n      const selectedTimeslot = this.stores?.scheduler.get('selectedTimeslot');\n      const selectedTimezone = this.stores?.scheduler.get('selectedTimezone');\n      const selectedLanguage = this.stores?.scheduler.get('selectedLanguage');\n      const configSettings = this.stores?.scheduler.get('configSettings');\n\n      const configurationId = this.configurationId ? this.configurationId : configSettings?.configuration_id;\n      const queryString = window.location.search;\n\n      const urlParams = new URLSearchParams(queryString);\n      urlParams.set('booking_id', eventInfo.booking_id);\n      recipient?.name && urlParams.set('name', recipient.name);\n      recipient?.email && urlParams.set('email', recipient.email);\n      selectedTimeslot?.start_time && urlParams.set('start_time', (new Date(selectedTimeslot.start_time).getTime() / 1000).toString());\n      selectedTimeslot?.end_time && urlParams.set('end_time', (new Date(selectedTimeslot.end_time).getTime() / 1000).toString());\n      selectedTimezone && urlParams.set('tz', selectedTimezone);\n      selectedLanguage && urlParams.set('language', selectedLanguage);\n      additionalFields && urlParams.set('additional_values', JSON.stringify(additionalFields));\n      this.slug && urlParams.set('page_slug', this.slug);\n      configurationId && urlParams.set('config_id', configurationId);\n      location && urlParams.set('location', location);\n      booking_ref && urlParams.set('booking_ref', booking_ref);\n      this.redirectToCustomUrl(`${redirectUrl}?${urlParams.toString()}`);\n      return;\n    }\n\n    // Booked event card is shown when the event is booked or booking is sent\n    if (showDefaultScheduler && eventInfo) {\n      return (\n        <Host>\n          <SchedulerView nylasBranding={nylasBranding} isLoading={this.isLoading} showNotification={this.showNotification}>\n            <div class=\"booked-event-page\" part=\"booked-event-page\">\n              <nylas-booked-event-card\n                selectedTimeslot={selectedTimeslot}\n                eventInfo={eventInfo}\n                exportparts=\"nbec, nbec__title, nbec__card, nbec__description, nbec__button-outline, nbec__cancel-cta, nbec__reschedule-cta\"\n              />\n            </div>\n          </SchedulerView>\n          {this.enableUserFeedback && (\n            <button-component id=\"report-issue\" variant={'basic'} onClick={e => this.onFeedbackClick(e)}>\n              <feedback-icon />\n            </button-component>\n          )}\n          {this.showFeedbackModal && <nylas-feedback-form></nylas-feedback-form>}\n        </Host>\n      );\n    }\n    // Date and time picker is shown when the event is not booked and no additional data is shown\n    if (showDefaultScheduler && (!eventInfo || !!rescheduleBookingId) && !showBookingForm) {\n      const timeslotPickerCTALabel = this.host.querySelector('[slot=\"timeslot-picker-cta-label\"]');\n      return (\n        <Host>\n          <SchedulerView nylasBranding={nylasBranding} isLoading={this.isLoading} showNotification={this.showNotification}>\n            {rescheduleBookingId && <MessageBanner>{`${i18next.t('rescheduleTitle')}`}</MessageBanner>}\n            <div class=\"select-date-page\" part=\"select-date-page\">\n              <div class=\"left-panel\">\n                <nylas-date-picker exportparts=\"ndp, ndp__title, ndp__month-header, ndp__month-button, ndp__day, ndp__date, ndp__date--disabled, ndp__date--selected, ndp__date--current-day, ndp__date--current-month\"></nylas-date-picker>\n                <nylas-locale-switch exportparts=\"nls, nls__timezone, nls__timezone-dropdown, nls__timezone-drop-button, nls__timezone-drop-button-selected-label, nls__timezone-drop-content, nls__timezone-drop-label, nls__language, nls__language-dropdown, nls__language-drop-button, nls__language-drop-content, nls__language-drop-label\"></nylas-locale-switch>\n              </div>\n              <div class={`right-panel ${rescheduleBookingId ? 'reschedule' : ''}`}>\n                <h2>\n                  <calendar-icon></calendar-icon>\n                  <span id=\"selectedDate\">{this.selectedDateLabel}</span>\n                </h2>\n                <nylas-timeslot-picker exportparts=\"ntp, ntp__time-picker-wrapper, ntp__timeslots, ntp__timeslot, ntp__timeslot--selected, ntp__button-primary\">\n                  {timeslotPickerCTALabel && (\n                    <span slot=\"timeslot-picker-cta-label\">\n                      <slot name=\"timeslot-picker-cta-label\"></slot>\n                    </span>\n                  )}\n                </nylas-timeslot-picker>\n              </div>\n            </div>\n          </SchedulerView>\n          {this.enableUserFeedback && (\n            <button-component id=\"report-issue\" variant={'basic'} onClick={e => this.onFeedbackClick(e)}>\n              <feedback-icon />\n            </button-component>\n          )}\n          {this.showFeedbackModal && <nylas-feedback-form></nylas-feedback-form>}\n        </Host>\n      );\n    }\n    // Additional data is shown when the time is selected, event is not booked and additional data is shown\n    if (showDefaultScheduler && !eventInfo && showBookingForm) {\n      return (\n        <Host>\n          <SchedulerView nylasBranding={nylasBranding} isLoading={this.isLoading} showNotification={this.showNotification}>\n            {rescheduleBookingId && <MessageBanner>{`${i18next.t('rescheduleTitle')}`}</MessageBanner>}\n            <div class=\"additional-data-page\" part=\"additional-data-page\">\n              <div class=\"left-panel\">\n                <div class=\"wrapper\">\n                  <nylas-selected-event-card exportparts=\"nsec, nsec__card, nsec__icon, nsec__date, nsec__time, nsec__timezone\"></nylas-selected-event-card>\n                </div>\n              </div>\n              <div class={`right-panel ${rescheduleBookingId ? 'reschedule' : ''}`}>\n                <nylas-booking-form exportparts=\"nbf, nbf__input-textfield, nbf__button-ghost, nbf__button-outline, nbf__button-primary, nbf__input-wrapper, nbf__checkbox-component, nbf__radio-button-group, nbf__textarea-component, nbf__dropdown, nbf__dropdown-button, nbf__dropdown-content\"></nylas-booking-form>\n              </div>\n            </div>\n          </SchedulerView>\n          {this.enableUserFeedback && (\n            <button-component id=\"report-issue\" variant={'basic'} onClick={e => this.onFeedbackClick(e)}>\n              <feedback-icon />\n            </button-component>\n          )}\n          {this.showFeedbackModal && <nylas-feedback-form></nylas-feedback-form>}\n        </Host>\n      );\n    }\n\n    return (\n      <Host>\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["NylasSchedulerConnector","constructor","schedulerAPIURL","nylasSchedulerStore","sessionId","configId","slug","clientId","Error","url","URL","window","location","href","origin","this","init","debug","schedulerStore","scheduler","_schedulerAPIConnector","NylaSchedulerAPIConnector","resetStores","reset","SchedulerView","props","children","isLoading","showNotification","nylasBranding","h","Fragment","class","target","rel","MessageBanner","_props","nylasSchedulingCss","NylasSchedulingStyle0","genericError","title","i18next","t","type","NotificationType","category","ErrorCategory","Component","NylasScheduling","Date","toLocaleDateString","undefined","dateStyle","navigator","language","connectedCallback","componentWillLoad","enableUserFeedback","Sentry.isInitialized","Sentry.init","dsn","release","integrations","filter","_integration","Sentry.feedbackIntegration","colorScheme","autoInject","autoSessionTracking","beforeSend","schedulerWillLoadEvent","schedulerWillLoad","emit","host","eventOverrides","nylasSchedulerConnector","defaultPrevented","stores","CreateNylasSchedulerStore","bookingInfo","themeConfig","hour12","defaultSchedulerState","baseProvider","NylasBaseProvider","automaticComponentRegistration","refConfigId","configurationId","bookingRefExtractedEvent","rescheduleBookingRef","rescheduleConfigId","rescheduleBookingId","_","compactStringToUUIDs","set","bookingRefExtracted","bookingId","cancelBookingRef","cancelConfigId","cancelBookingId","organizerConfirmationBookingRef","organizerConfirmationConfigId","organizerConfirmationBookingId","salt","checkIfSessionIdOrConfigIdExists","getStore","schedulerApiUrl","initEvent","applyThemeConfig","componentDidLoad","schedulerDidLoadEvent","schedulerDidLoad","localizationChanged","localization","settingsResponse","getUISettings","nylasSchedulerError","notification","getErrorObject","error","data","appearance","console","info","configSettingsLoadedEvent","configSettingsLoaded","settings","availableDaysInFuture","get","available_days_in_future","selectedTimeslot","start_time","isTimeslotValid","selectedDate","availability","result","length","today","startTime","endTime","endTimeForAvailableDaysInFuture","validateAvailableDaysInFuture","getTime","getAvailability","_selectedDate","firstAvailableDate","find","timeslot","componentDisconnected","bookingInfoChanged","newVal","rescheduleBookingRefChanged","setConfigId","cancelBookingRefChanged","organizerConfirmationBookingRefChanged","Object","keys","forEach","lang","LANGUAGE_CODE","addResourceBundle","themeConfigChanged","languageChanged","event","newLanguage","detail","changeLanguage","registerComponentHandler","registerComponent","unregisterComponentHandler","unregisterComponent","monthChangedHandler","date","selectableDates","mapToBookingData","timezone","end_time","additional_guests","guests","guest","primaryParticipant","additional_fields","additionalFields","email_language","bookButtonClickedHandler","bookingData","mappedBookingData","bookingInfoConfirmed","storeRescheduleId","rescheduleBooking","resultData","bookedEventInfoEvent","bookedEventInfo","bookTimeslot","dateSelectedHandler","selectedDateLabel","cancelBookedEventErrorHandler","cancelBookedEventValidationErrorHandler","rescheduleBookedEventErrorHandler","confirmBookingErrorHandler","feedbackModalClosedHandler","showFeedbackModal","feedbackSubmittedHandler","eventId","Sentry.captureMessage","extra","feedback","message","Sentry.captureFeedback","includeReplay","captureContext","tags","getNylasSchedulerStore","getNylasSchedulerConnector","getRef","description","id","toString","ttl","startDate","getFullYear","getMonth","endTimeForCurrentMonth","Math","floor","addDaysToCurrentDate","min","startTimeWithOffset","key","value","entries","style","setProperty","onFeedbackClick","e","preventDefault","redirectToCustomUrl","assign","render","showDefaultScheduler","mode","eventInfo","showBookingForm","cancelledEventInfo","rejectBookingId","confirmedEventInfo","redirectUrl","confirmation_redirect_url","capitalizeFirstLetter","LANGUAGE_CODE_MAP","Host","part","exportparts","variant","onClick","recipient","booking_ref","bookingInfoAdditionalFields","selectedTimezone","selectedLanguage","configSettings","configuration_id","queryString","search","urlParams","URLSearchParams","booking_id","name","email","JSON","stringify","timeslotPickerCTALabel","querySelector","slot"],"sources":["src/connector/nylas-scheduler-connector/index.ts","src/components/scheduler/nylas-scheduling/scheduler-view.tsx","src/components/scheduler/nylas-scheduling/message-banner.tsx","src/components/scheduler/nylas-scheduling/nylas-scheduling.scss?tag=nylas-scheduling&encapsulation=shadow","src/components/scheduler/nylas-scheduling/nylas-scheduling.tsx"],"sourcesContent":["import { NylasSchedulerStoreType } from '@/stores/scheduler-store';\nimport { debug } from '@/utils/utils';\nimport { NylasSchedulerConnectorInterface } from '../connector-interface';\nimport { NylaSchedulerAPIConnector } from '../shared/api/scheduler';\n\ntype NylasSchedulerConnectorOptions = {\n  schedulerAPIURL: string;\n  nylasSchedulerStore: NylasSchedulerStoreType;\n  sessionId?: string;\n  configId?: string;\n  slug?: string;\n  clientId?: string;\n};\n/**\n * Base class for the Nylas connector.\n */\nexport class NylasSchedulerConnector implements NylasSchedulerConnectorInterface {\n  public schedulerAPIURL: string;\n  public nylasSchedulerStore: NylasSchedulerStoreType;\n  public sessionId: string | undefined;\n  public configId: string | undefined;\n  public slug: string | undefined;\n  public clientId: string | undefined;\n\n  private _schedulerAPIConnector: NylaSchedulerAPIConnector | undefined;\n\n  constructor({ schedulerAPIURL, nylasSchedulerStore, sessionId, configId, slug, clientId }: NylasSchedulerConnectorOptions) {\n    if (!schedulerAPIURL) {\n      throw new Error('schedulerAPIURL is required');\n    }\n\n    if (!nylasSchedulerStore) {\n      throw new Error('nylasSchedulerStore is required');\n    }\n\n    if (!sessionId && !configId && !(slug || clientId)) {\n      throw new Error('sessionId is required for private configs. If using public config either pass a configurationId or a combination of slug and clientId.');\n    }\n\n    // If the url is only /, then we need to add the base url.\n    // We assume that the base url is the same as the current url.\n    if (schedulerAPIURL === '/') {\n      const url = new URL(window.location.href);\n      schedulerAPIURL = url.origin;\n    }\n\n    this.configId = configId;\n    this.sessionId = sessionId;\n    this.schedulerAPIURL = schedulerAPIURL;\n    this.nylasSchedulerStore = nylasSchedulerStore;\n    this.slug = slug;\n    this.clientId = clientId;\n  }\n\n  public init() {\n    debug('NylasConnector init');\n  }\n\n  public get schedulerStore() {\n    return this.nylasSchedulerStore;\n  }\n\n  public get scheduler() {\n    if (this._schedulerAPIConnector) {\n      return this._schedulerAPIConnector;\n    }\n    this._schedulerAPIConnector = new NylaSchedulerAPIConnector({\n      schedulerAPIURL: this.schedulerAPIURL,\n      schedulerStore: this.schedulerStore,\n      sessionId: this.sessionId,\n      configId: this.configId,\n      slug: this.slug,\n      clientId: this.clientId,\n    });\n    return this._schedulerAPIConnector;\n  }\n\n  public resetStores() {\n    this.nylasSchedulerStore.reset();\n  }\n}\nexport type PublicMethods<T> = {\n  [K in keyof T]: T[K] extends Function ? (string extends K ? never : K) : never;\n}[keyof T];\n\nexport type NylasSchedulerConnectorPublicMethods = PublicMethods<NylasSchedulerConnector>;\n","import { Fragment, FunctionalComponent, h } from '@stencil/core';\n\nexport type SchedulerViewProps = {\n  isLoading?: boolean;\n  showNotification?: boolean;\n  nylasBranding?: boolean;\n};\n\n/**\n * The Scheduler view component.\n */\nexport const SchedulerView: FunctionalComponent<SchedulerViewProps> = (props: SchedulerViewProps, children) => {\n  const isLoading = props.isLoading;\n  const showNotification = props.showNotification;\n  const nylasBranding = props.nylasBranding;\n\n  return (\n    <Fragment>\n      {showNotification && <nylas-notification></nylas-notification>}\n\n      {isLoading && (\n        <div class={'loading'}>\n          <div class={'left'}>\n            <div class={'skeleton'} />\n          </div>\n          <div class={'right'}>\n            <div class={'skeleton'} />\n            <div class={'skeleton'} />\n            <div class={'skeleton'} />\n            <div class={'skeleton'} />\n            <div class={'skeleton'} />\n          </div>\n        </div>\n      )}\n      {!isLoading && children}\n      <div class={'footer'}>\n        {nylasBranding && (\n          <a\n            href=\"https://scheduler.nylas.com?utm_source=powered-by-nylas-logoutm_medium=link&utm_campaign=get-scheduler&utm_id=get-scheduler\"\n            class=\"powered-by-nylas\"\n            target=\"_blank\"\n            rel=\"noreferrer noopener\"\n          >\n            Powered by&nbsp;<span class=\"sr-only\">Nylas</span>\n            <nylas-logo aria-hidden={true} />\n          </a>\n        )}\n      </div>\n    </Fragment>\n  );\n};\n","import { FunctionalComponent, h } from '@stencil/core';\n\nexport type HeaderBannerProps = {};\n\nexport const MessageBanner: FunctionalComponent<HeaderBannerProps> = (_props: HeaderBannerProps, children) => <div class=\"message-banner\">{children}</div>;\n","@import '../../../common/styles/variables.scss';\n\n:host {\n  display: flex;\n  flex-direction: column;\n  overflow: visible;\n  border-radius: var(--nylas-border-radius-2x);\n  width: fit-content;\n\n  @media #{$mobile} {\n    width: auto;\n    min-width: 325px;\n  }\n\n  background: var(--nylas-base-0);\n  position: relative;\n  box-shadow: 0px 4px 8px 2px rgba(0, 0, 0, 0.05),\n  0px 8px 16px -2px rgba(0, 0, 0, 0.1);\n\n  @include default-css-variables;\n  font-family: var(--nylas-font-family);\n  font-optical-sizing: auto;\n  font-style: normal;\n  font-variation-settings: 'slnt' 0;\n}\n\n:root {\n  font-family: inherit;\n}\n\n.error {\n  padding: 8rem 12rem;\n  color: var(--nylas-base-0);\n  background-color: var(--nylas-error);\n  margin: 1.5rem;\n  border-radius: var(--nylas-border-radius-2x);\n}\n\n.message-banner {\n  text-align: right;\n  color: var(--nylas-base-800);\n  padding: 1rem;\n  border-bottom: 1px solid var(--nylas-color-primary-200);\n  margin: 0;\n}\n\n.loading {\n  margin: 1.5rem;\n  display: flex;\n  gap: 1rem;\n\n  .skeleton {\n    border-radius: var(--nylas-border-radius-2x);\n    animation: pulsate 1.5s infinite;\n\n    &:nth-child(2) {\n      animation-delay: -100ms;\n    }\n\n    &:nth-child(3) {\n      animation-delay: -200ms;\n    }\n\n    &:nth-child(4) {\n      animation-delay: -300ms;\n    }\n\n    &:nth-child(5) {\n      animation-delay: -400ms;\n    }\n  }\n\n  .left .skeleton {\n    height: 100%;\n    width: 400px;\n  }\n\n  .right .skeleton {\n    height: 5rem;\n    width: 300px;\n    margin-bottom: 1rem;\n\n    &:last-child {\n      margin-bottom: 0;\n    }\n  }\n}\n\n@keyframes pulsate {\n  0% {\n    background-color: var(--nylas-base-50);\n  }\n\n  50% {\n    background-color: var(--nylas-base-100);\n  }\n\n  100% {\n    background-color: var(--nylas-base-50);\n  }\n}\n\n.select-date-page,\n.additional-data-page,\n.booked-event-page,\n.manual-confirmation-page,\n.cancelled-event-page,\n.cancel-flow-page {\n  border-top-left-radius: var(--nylas-border-radius-2x);\n  border-top-right-radius: var(--nylas-border-radius-2x);\n}\n\n.select-date-page,\n.additional-data-page {\n  display: flex;\n\n  @media #{$mobile} {\n    flex-direction: column;\n  }\n}\n\n.booked-event-page,\n.manual-confirmation-page {\n  background-color: var(--nylas-base-50);\n}\n\n.cancelled-event-page,\n.manual-confirmation-page,\n.cancel-flow-page {\n  padding: 1rem;\n  height: 496px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.booked-event-page,\n.manual-confirmation-page,\n.cancelled-event-page,\n.cancel-flow-page {\n  min-width: 784px;\n\n  @media #{$mobile} {\n    min-width: 90%;\n  }\n\n  background: var(--nylas-base-50);\n}\n\n.left-panel {\n  display: flex;\n  flex-direction: column;\n  min-width: 424px;\n  border-top-left-radius: inherit;\n  background: var(--nylas-base-0);\n  position: relative;\n  padding: 1rem 0 0 0;\n  height: 624px;\n\n  @media #{$mobile} {\n    border-top-right-radius: inherit;\n    min-width: unset;\n    height: auto;\n  }\n}\n\n.select-date-page .left-panel {\n  @media #{$mobile} {\n    height: 624px;\n  }\n}\n\n.border {\n  margin-left: -20px; // Offset left padding\n  margin-right: -20px; // Offset right padding\n  border-top-width: 1px;\n  height: 0.5px;\n  background-color: var(--nylas-base-200);\n\n  @media #{$mobile} {\n    display: none;\n  }\n}\n\n.right-panel {\n  min-width: 360px;\n  width: 360px;\n  background-color: var(--nylas-base-50);\n  height: 624px;\n  padding-top: 16px;\n  border-left: 1px solid var(--nylas-base-200);\n  border-top-right-radius: inherit;\n\n  &.reschedule {\n    border-top-right-radius: 0px;\n  }\n\n  @media #{$mobile} {\n    border-top-right-radius: 0px;\n    width: inherit;\n    min-width: unset;\n    height: auto;\n    border-left: none;\n  }\n\n  h2 {\n    display: flex;\n    margin: 0;\n    height: 48px;\n    gap: 0.5rem;\n    justify-content: center;\n    align-items: center;\n    width: auto;\n    font-size: 1.125rem;\n    line-height: 1.5rem;\n    font-weight: 500;\n    text-align: center;\n    color: var(--nylas-base-800);\n  }\n}\n\n.additional-data-page {\n  .left-panel {\n    background-color: var(--nylas-base-50);\n  }\n\n  .right-panel {\n    background-color: var(--nylas-base-0);\n  }\n}\n\nnylas-selected-event-card {\n  height: calc(640px - 36px);\n  padding: 0 1rem;\n\n  @media #{$mobile} {\n    height: 250px;\n  }\n}\n\n.footer {\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  padding: 16px;\n  font-size: 14px;\n  font-weight: 300;\n  color: var(--nylas-base-500);\n  border-top: 1px solid var(--nylas-base-200);\n  min-height: 24px;\n\n  .powered-by-nylas {\n    display: flex;\n    align-items: center;\n    text-decoration: none;\n\n    color: var(--nylas-base-500);\n\n    &:hover {\n      color: var(--nylas-base-800);\n    }\n  }\n\n  svg {\n    fill: var(--nylas-base-500);\n  }\n}\n\n.sr-only {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border-width: 0;\n}\n\n.footer svg {\n  margin-top: 1px;\n}\n\nnylas-selected-event-card::part(nsec__timezone) {\n  position: absolute;\n  bottom: 0;\n}\n\nnylas-notification {\n  margin: 1.5rem;\n  width: -webkit-fill-available;\n  width: -moz-available;\n  position: absolute;\n}\n\nnylas-locale-switch {\n  position: absolute;\n  padding: 18px 20px;\n  bottom: 0;\n  width: -webkit-fill-available;\n  width: -moz-available;\n  border-top: 1px solid var(--nylas-base-200);\n\n  @media #{$mobile} {\n    height: auto;\n  }\n}\n\nnylas-date-picker {\n  padding: 0 20px;\n}\n\nbutton-component#report-issue {\n  width: auto;\n  position: absolute;\n  bottom: 4px;\n  left: 16px;\n}\n\nnylas-feedback-form {\n  position: absolute;\n  top: 0;\n  height: 100%;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  background: rgba(0, 0, 0, 0.6);\n  z-index: 2;\n  border-radius: inherit;\n}","import { NylasBaseProvider } from '@/common/abstract-provider';\nimport { RegisteredComponent } from '@/common/register-component';\nimport type { SchedulerEventOverride } from '@/common/component-types';\nimport { NylasSchedulerConnector } from '@/connector/nylas-scheduler-connector';\nimport { CreateNylasSchedulerStore, NylasSchedulerStoreState, NylasSchedulerStoreType } from '@/stores/scheduler-store';\nimport {\n  NylasSchedulerBookingData,\n  ThemeConfig,\n  Notification,\n  NotificationType,\n  NylasSchedulerErrorResponse,\n  Timeslot,\n  NylasSchedulerResponse,\n  NylasSuccessResponse,\n} from '@nylas/core';\nimport { Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, State, Watch, h } from '@stencil/core';\nimport { addDaysToCurrentDate, capitalizeFirstLetter, compactStringToUUIDs, debug } from '@/utils/utils';\nimport { SchedulerView } from './scheduler-view';\nimport { ErrorCategory } from '@/connector/nylas-scheduler-connector/errors';\nimport { MessageBanner } from './message-banner';\nimport i18next from '@/utils/i18n';\nimport { NylasSchedulerBookingDataWithFlatFields, NylasEvent, UISettingsResponse } from '@/common/types';\nimport { LANGUAGE_CODE, LANGUAGE_CODE_MAP, Locale } from '@/common/constants';\nimport * as Sentry from '@sentry/browser';\n\nconst genericError = { title: i18next.t('genericErrorTitle'), type: NotificationType.Error, category: ErrorCategory.Component };\n\n/**\n * The `nylas-scheduling` component is used to display the Nylas Scheduling UI.\n *\n * @part ndp - [nylas-date-picker] The date picker host.\n * @part ndp__title - [nylas-date-picker] The title.\n * @part ndp__month-header - [nylas-date-picker] The month header.\n * @part ndp__month-button - [nylas-date-picker] The month button.\n * @part ndp__day - [nylas-date-picker] The day.\n * @part ndp__date - [nylas-date-picker] The date.\n * @part ndp__date--selected - [nylas-date-picker] The selected date.\n * @part ndp__date--current-day - [nylas-date-picker] The current day.\n * @part ndp__date--current-month - [nylas-date-picker] The dates in the current month.\n * @part ndp__date--disabled - [nylas-date-picker] The disabled dates.\n * @part ntp - [nylas-timeslot-picker] The timeslot picker component.\n * @part ntp__timeslot - [nylas-timeslot-picker] The timeslot button.\n * @part ntp__timeslot--selected - [nylas-timeslot-picker] The selected timeslot button.\n * @part ntp__button-primary - [nylas-timeslot-picker] The timeslot picker CTA.\n * @part nsec - [nylas-selected-event-card] The selected event card component.\n * @part nsec__card - [nylas-selected-event-card] The card component.\n * @part nsec__icon - [nylas-selected-event-card] The calendar icon.\n * @part nsec__date - [nylas-selected-event-card] The date selected.\n * @part nsec__time - [nylas-selected-event-card] The timeslot selected.\n * @part nbf - [nylas-booking-form] The booking form host.\n * @part nbf__input-textfield - [nylas-booking-form] The input textfield.\n * @part nbf__button-ghost - [nylas-booking-form] The ghost button.\n * @part nbf__button-outline - [nylas-booking-form] The outline button.\n * @part nbf__button-primary - [nylas-booking-form] The primary button.\n * @part nbf__input-wrapper - [nylas-booking-form] The input wrapper.\n * @part nbf__checkbox-component - [nylas-booking-form] The checkbox component.\n * @part nbf__radio-button-group - [nylas-booking-form] The radio button group.\n * @part nbf__textarea-component - [nylas-booking-form] The textarea component.\n * @part nbf__dropdown - [nylas-booking-form] The dropdown component.\n * @part nbf__dropdown-button - [nylas-booking-form] The dropdown button.\n * @part nbf__dropdown-content - [nylas-booking-form] The dropdown content.\n * @part ncec - [nylas-cancelled-event-card] The cancelled event card host.\n * @part ncec__icon - [nylas-cancelled-event-card] The calendar icon.\n * @part ncec__title - [nylas-cancelled-event-card] The title of the cancelled event card.\n * @part ncec__description - [nylas-cancelled-event-card] The description of the cancelled event card.\n * @part ncec__button-outline - [nylas-cancelled-event-card] The close button CTA.\n * @part ncec__card - [nylas-cancelled-event-card] The cancelled event card.\n * @part nbec - [nylas-booked-event-card] The booked event card host.\n * @part nbec__card - [nylas-booked-event-card] The booked event card.\n * @part nbec__title - [nylas-booked-event-card] The title of the booked event card.\n * @part nbec__description - [nylas-booked-event-card] The description of the booked event card.\n * @part nbec__button-outline - [nylas-booked-event-card] The cancel & reschedule button CTA.\n * @part nbec__cancel-cta - [nylas-booked-event-card] The cancel button CTA.\n * @part nbec__reschedule-cta - [nylas-booked-event-card] The reschedule button CTA.\n * @part nls - [nylas-locale-switch] The locale switch container.\n * @part nls__timezone - [nylas-locale-switch] The timezone select container\n * @part nls__timezone-dropdown - [nylas-locale-switch] The timezone dropdown\n * @part nls__timezone-drop-button - [nylas-locale-switch] The timezone dropdown button\n * @part nls__timezone-drop-button-selected-label - [nylas-locale-switch] The timezone dropdown button selected label\n * @part nls__timezone-drop-content - [nylas-locale-switch] The timezone dropdown content\n * @part nls__timezone-drop-label - [nylas-locale-switch] The timezone dropdown label\n * @part nls__language - [nylas-locale-switch] The language select container\n * @part nls__language-dropdown - [nylas-locale-switch] The language dropdown\n * @part nls__language-drop-button - [nylas-locale-switch] The language dropdown button\n * @part nls__language-drop-content - [nylas-locale-switch] The language dropdown content\n * @part nls__language-drop-label - [nylas-locale-switch] The language dropdown label\n * @part ncbf - [nylas-cancel-booking-form] The cancel booking form container.\n * @part ncbf__icon - [nylas-cancel-booking-form] The calendar icon.\n * @part ncbf__title - [nylas-cancel-booking-form] The title of the cancel booking form.\n * @part ncbf__description - [nylas-cancel-booking-form] The description of the cancel booking form.\n * @part ncbf__reason-textarea - [nylas-cancel-booking-form] The reason textarea.\n * @part ncbf__button-cta - [nylas-cancel-booking-form] The cancel booking form CTA button.\n * @part ncbf__button-outline - [nylas-cancel-booking-form] The cancel booking form outline button.\n * @part ncbf__card - [nylas-cancel-booking-form] The cancel booking form card.\n */\n@Component({\n  tag: 'nylas-scheduling',\n  styleUrl: 'nylas-scheduling.scss',\n  shadow: true,\n})\nexport class NylasScheduling {\n  /**\n   * Stores to be used by the provider.\n   */\n  private stores?: { scheduler: NylasSchedulerStoreType };\n\n  /**\n   * This is a base provide that defines the common methods and properties\n   * that all providers should have.\n   *\n   * Because stencil does not support abstract classes, we have to use a\n   * property to store the base provider instance.\n   */\n  private baseProvider?: NylasBaseProvider<Exclude<typeof this.stores, undefined>>;\n\n  /**\n   * The Nylas Scheduler Connector instance.\n   * The branins of the provider. It manages data fetching and state synchronization.\n   */\n  private nylasSchedulerConnector?: NylasSchedulerConnector;\n\n  /**\n   * The host element.\n   * Used to manage the host element of the provider.\n   */\n  @Element() private host!: HTMLNylasSchedulingElement;\n\n  /**\n   * This is used to set the mode for the Nylas Scheduler.\n   * The mode can be either `app` or `composable`. The default mode is `app`.\n   * - `app`: This mode is used to show the default Nylas Scheduler UI.\n   * - `composable`: This mode is used to show the composable Nylas Scheduler UI\n   *    by passing the individual scheduler components as children.\n   */\n  @Prop() readonly mode: 'app' | 'composable' = 'app';\n\n  /**\n   * The default scheduler store state.\n   * Used to set the initial state of the scheduler store.\n   */\n  @Prop({ attribute: 'default-scheduler-store-state' }) readonly defaultSchedulerState?: Partial<NylasSchedulerStoreState>;\n\n  /**\n   * The session ID for the Nylas Scheduler.\n   * This is used to authenticate the user.\n   */\n  @Prop() readonly sessionId?: string;\n\n  /**\n   * The URL for the Nylas Scheduler API. (staging or production URL)\n   */\n  @Prop() readonly schedulerApiUrl: string = 'https://api.us.nylas.com';\n\n  /**\n   * This enables passing the bookingInfo object to the Scheduler UI for direct booking event creation.\n   * When used with timeslotConfirmedHandler, it bypasses the additional data page and immediately\n   * invokes the handler after booking.\n   */\n  @Prop() readonly bookingInfo?: NylasSchedulerBookingData;\n\n  /**\n   * Booking Ref required for rescheduling flow.\n   */\n  @Prop() readonly rescheduleBookingRef?: string;\n\n  /**\n   * Booking Ref required for cancelling flow.\n   */\n  @Prop() readonly cancelBookingRef?: string;\n\n  /**\n   * Booking Ref required for the manual confirmation flow.\n   */\n  @Prop() readonly organizerConfirmationBookingRef?: string;\n\n  /**\n   * The config ID for the Nylas Scheduler. This should be passed in when using a public config,\n   * in which case the sessionId is not required.\n   */\n  @Prop() readonly configurationId?: string;\n\n  /**\n   * The slug of the configuration (public config) to be used for the Nylas Scheduler. This is used in conjunction with the clientId.\n   * When the configurationId is not provided, the slug and clientId are used to make requests to the Scheduler API endpoints.\n   * If the configurationId is provided, this prop will be ignored.\n   */\n  @Prop() readonly slug?: string;\n\n  /**\n   * The app ID of the configuration (public config) to be used for the Nylas Scheduler. This is used in conjunction with the slug.\n   * When the configurationId is not provided, the slug and clientId are used to make requests to the Scheduler API endpoints.\n   * If the configurationId is provided, this prop will be ignored.\n   */\n  @Prop() readonly clientId?: string;\n\n  /**\n   * This prop lets you hide the Nylas branding.\n   * Default is true.\n   */\n  @Prop() readonly nylasBranding?: boolean = true;\n\n  /**\n   * This provides an easy way to override the default function of the event emitter.\n   * An example of this is the `timeslotConfirmed` event. By default, this event will set the scheduler store state for `showBookingForm` to `true` which will\n   * show the booking form. However, if you want to override this behavior, you can pass in the prop `eventOverride` like:\n   * ```html\n   * <nylas-scheduling eventOverride={{\"timeslotConfirmed\": (event, nylasConnector) => { console.log(\"Timeslot confirmed event fired!\"); } }} />\n   * ```\n   */\n  @Prop({ attribute: 'event-overrides' }) readonly eventOverrides: SchedulerEventOverride = {};\n\n  /**\n   * The loading state. This is used to set the loading state for the Nylas Scheduler when fetching data.\n   */\n  @Prop() readonly isLoading?: boolean;\n\n  /**\n   * Theme config, used to automatically generate a theme with color palette and\n   * CSS variables to customize the look and feel of the Nylas Scheduler.\n   */\n  @Prop() readonly themeConfig?: ThemeConfig;\n\n  /**\n   * This prop will allow to override the default localization strings for each language.\n   * Nylas scheduling page currently support the following language codes: en, es, fr, de, sv, zh, ja, nl.\n   */\n  @Prop() readonly localization?: Partial<Record<LANGUAGE_CODE, Locale>>;\n\n  /*\n   * Displays notifications for errors by default. When enabled (`true`), errors\n   * automatically appear as notifications. Disabling this feature (`false`) allows\n   * the parent application to capture and manage errors by listening to the\n   * `nylasSchedulerError` event, providing flexibility in error handling.\n   */\n  @Prop() readonly showNotification?: boolean = true;\n\n  @Prop() readonly enableUserFeedback?: boolean = true;\n\n  @Prop() readonly hour12?: boolean | undefined;\n\n  /**\n   * Automatically register components that have the `@RegisterComponent` decorator.\n   * If this is set to false, you will need to manually register components using the\n   * `registerComponent` method.\n   * @default true\n   */\n  @State() automaticComponentRegistration: boolean = true;\n\n  /**\n   * The selected date label for the Nylas Scheduler.\n   * This is used to set the initial date label for the Nylas Scheduler.\n   */\n  @State() selectedDateLabel: string = new Date().toLocaleDateString(undefined, { dateStyle: 'full' }) || `${i18next.t('noDateSelected')}`;\n\n  /**\n   * The config id extracted from the rescheduleBookingRef or cancelBookingRef or organizerConfirmationBookingRef.\n   */\n  @State() refConfigId?: string;\n\n  /**\n   * The selected language for the Nylas Scheduler.\n   */\n  @State() language: string = navigator.language;\n\n  /**\n   * The state for showing the feedback modal.\n   */\n  @State() showFeedbackModal: boolean = false;\n\n  /**\n   * The state of bookingInfo after the user has confirmed the booking.\n   */\n  @State() bookingInfoConfirmed: NylasSchedulerBookingDataWithFlatFields | null = null;\n\n  /**\n   * This event is fired when the provider is initialized.\n   * It can be used to set the initial state of the provider,\n   * or to prevent the provider from firing some default behavior.\n   */\n  @Event({ cancelable: true }) init!: EventEmitter<HTMLNylasSchedulingElement>;\n\n  /**\n   * This event is fired when the scheduler component enters componentWillLoad lifecycle.\n   */\n  @Event() schedulerWillLoad!: EventEmitter<HTMLNylasSchedulingElement>;\n\n  /**\n   * This event is fired when the scheduler component enters componentDidLoad lifecycle.\n   */\n  @Event() schedulerDidLoad!: EventEmitter<HTMLNylasSchedulingElement>;\n\n  @Event({\n    eventName: 'nylasSchedulerError',\n  })\n  nylasSchedulerError!: EventEmitter<{ notification: Notification; host: HTMLElement }>;\n\n  @Event({\n    eventName: 'configSettingsLoaded',\n  })\n  configSettingsLoaded!: EventEmitter<{ settings: NylasSchedulerResponse<UISettingsResponse> }>;\n\n  /**\n   * This event is triggered if either the rescheduleBookingRef or cancelBookingRef or organizerConfirmationBookingRef prop\n   * is supplied and the component has been attached to the DOM. It emits the configurationId\n   * and bookingId derived from the rescheduleBookingRef or cancelBookingRef or organizerConfirmationBookingRef. Subscribe to this\n   * event to obtain the extracted configurationId, which is necessary to generate the sessionID\n   * for configurations that are not public.\n   */\n  @Event() bookingRefExtracted!: EventEmitter<{ configurationId: string; bookingId: string; salt?: string }>;\n\n  /**\n   * This event is triggered on successful booking request. It emits the event data.\n   */\n  @Event() bookedEventInfo!: EventEmitter<NylasSchedulerResponse<NylasEvent>>;\n\n  /**\n   * This function is called when the component is connected to the DOM.\n   * At this point in the component lifecycle, the base provider has not yet\n   * been initialized. So avoid using the base provider in this method or stores\n   * in this method.\n   */\n  connectedCallback() {\n    debug(`[nylas-scheduler] connectedCallback`);\n  }\n\n  async componentWillLoad() {\n    debug(`[nylas-scheduler] Component will load`);\n\n    if (this.enableUserFeedback && !Sentry.isInitialized()) {\n      Sentry.init({\n        dsn: 'https://9d5731f1c77ca84c9ed3fb9b3ccf7ee1@o74852.ingest.us.sentry.io/4507889638178816',\n        release: process.env.PACKAGE_VERSION,\n        integrations: integrations => [\n          ...integrations.filter(_integration => false), // Removes default integrations (including Breadcrumbs)\n          Sentry.feedbackIntegration({\n            colorScheme: 'system',\n            autoInject: false,\n          }),\n        ],\n        // Disable all other event capture\n        autoSessionTracking: false, // Disable session tracking\n        beforeSend: () => null, // Prevents error events from being sent\n      });\n    }\n\n    // Emit the schedulerWillLoad event to allow the parent application to set the initial\n    // state of the provider or to prevent the provider from firing some default behavior.\n    const schedulerWillLoadEvent = this.schedulerWillLoad.emit(this.host);\n    if ('schedulerWillLoad' in this.eventOverrides) {\n      await this.eventOverrides.schedulerWillLoad(schedulerWillLoadEvent, this.nylasSchedulerConnector);\n      if (schedulerWillLoadEvent.defaultPrevented) {\n        return;\n      }\n    }\n\n    this.stores = {\n      scheduler: CreateNylasSchedulerStore({\n        bookingInfo: this.bookingInfo,\n        nylasBranding: this.nylasBranding,\n        themeConfig: this.themeConfig,\n        hour12: this.hour12,\n        ...this.defaultSchedulerState,\n      }),\n    };\n\n    this.baseProvider = new NylasBaseProvider(this.host, this.stores, this.automaticComponentRegistration, this.eventOverrides);\n\n    // Set the configId to the reschedule configId if rescheduleBookingRef is provided or\n    // Set the configId to the cancel configId if cancelBookingRef is provided\n    this.refConfigId = this.configurationId;\n    let bookingRefExtractedEvent;\n    if (this.rescheduleBookingRef) {\n      const [rescheduleConfigId, rescheduleBookingId, _] = compactStringToUUIDs(this.rescheduleBookingRef);\n      this.refConfigId = rescheduleConfigId;\n      this.stores.scheduler.set('rescheduleBookingId', rescheduleBookingId);\n      bookingRefExtractedEvent = this.bookingRefExtracted.emit({ configurationId: rescheduleConfigId, bookingId: rescheduleBookingId });\n    } else if (this.cancelBookingRef) {\n      const [cancelConfigId, cancelBookingId, _] = compactStringToUUIDs(this.cancelBookingRef);\n      this.refConfigId = cancelConfigId;\n      this.stores.scheduler.set('cancelBookingId', cancelBookingId);\n      bookingRefExtractedEvent = this.bookingRefExtracted.emit({ configurationId: cancelConfigId, bookingId: cancelBookingId });\n    } else if (this.organizerConfirmationBookingRef) {\n      const [organizerConfirmationConfigId, organizerConfirmationBookingId, salt] = compactStringToUUIDs(this.organizerConfirmationBookingRef);\n      this.refConfigId = organizerConfirmationConfigId;\n      this.stores.scheduler.set('organizerConfirmationBookingId', organizerConfirmationBookingId);\n      this.stores.scheduler.set('organizerConfirmationSalt', salt);\n      bookingRefExtractedEvent = this.bookingRefExtracted.emit({ configurationId: organizerConfirmationConfigId, bookingId: organizerConfirmationBookingId, salt: salt });\n    }\n\n    if ('bookingRefExtracted' in this.eventOverrides) {\n      await this.eventOverrides.bookingRefExtracted(bookingRefExtractedEvent, this.nylasSchedulerConnector);\n      if (bookingRefExtractedEvent.defaultPrevented) {\n        return;\n      }\n    }\n\n    if (!this.checkIfSessionIdOrConfigIdExists()) {\n      return;\n    }\n\n    const nylasSchedulerStore = this.baseProvider?.getStore('scheduler');\n    this.nylasSchedulerConnector = new NylasSchedulerConnector({\n      schedulerAPIURL: this.schedulerApiUrl,\n      sessionId: this.sessionId,\n      configId: this.refConfigId,\n      slug: this.slug,\n      clientId: this.clientId,\n      nylasSchedulerStore,\n    });\n\n    const initEvent = this.init.emit(this.host);\n    if ('init' in this.eventOverrides) {\n      await this.eventOverrides.init(initEvent, this.nylasSchedulerConnector);\n      if (initEvent.defaultPrevented) {\n        return;\n      }\n    }\n\n    this.baseProvider?.componentWillLoad(this.nylasSchedulerConnector);\n    // Override theme\n    this.applyThemeConfig(this.themeConfig);\n  }\n\n  async componentDidLoad() {\n    this.baseProvider?.componentDidLoad();\n\n    const schedulerDidLoadEvent = this.schedulerDidLoad.emit(this.host);\n    if ('schedulerDidLoad' in this.eventOverrides) {\n      await this.eventOverrides.schedulerDidLoad(schedulerDidLoadEvent, this.nylasSchedulerConnector);\n      if (schedulerDidLoadEvent.defaultPrevented) {\n        return;\n      }\n    }\n\n    // If sessionId is not provided, do not fetch availability\n    if (!this.checkIfSessionIdOrConfigIdExists()) {\n      return;\n    }\n    this.localizationChanged(this.localization);\n    const settingsResponse = await this.nylasSchedulerConnector?.scheduler.getUISettings();\n    if (!settingsResponse || 'error' in settingsResponse) {\n      this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(settingsResponse?.error) }, host: this.host });\n      return;\n    } else {\n      if ('data' in settingsResponse && settingsResponse.data?.appearance) {\n        console.info(\n          'Appearance settings have been returned from the configuration used byt his scheduling page; please remember to grab them from the configSettingsLoaded event and apply them as desired.',\n        );\n      }\n      const configSettingsLoadedEvent = this.configSettingsLoaded.emit({ settings: settingsResponse });\n      if ('configSettingsLoaded' in this.eventOverrides) {\n        await this.eventOverrides.configSettingsLoaded(configSettingsLoadedEvent, this.nylasSchedulerConnector);\n        if (configSettingsLoadedEvent.defaultPrevented) {\n          return;\n        }\n      }\n    }\n\n    const nylasSchedulerStore = this.baseProvider?.getStore('scheduler');\n    const availableDaysInFuture = nylasSchedulerStore?.get('configSettings')?.scheduler?.available_days_in_future;\n    const selectedTimeslot = nylasSchedulerStore?.get('selectedTimeslot');\n\n    if (selectedTimeslot && selectedTimeslot?.start_time) {\n      if (!this.isTimeslotValid(selectedTimeslot)) {\n        return;\n      }\n\n      // If the selected timeslot is already set, do not fetch availability\n      if (nylasSchedulerStore?.get('showBookingForm')) {\n        nylasSchedulerStore?.set('selectedDate', selectedTimeslot.start_time);\n        return;\n      }\n    }\n\n    const selectedDate = nylasSchedulerStore?.get('selectedDate');\n    const availability = nylasSchedulerStore?.get('availability');\n    let result;\n\n    if (availability && availability.length > 0) {\n      return;\n    }\n\n    if (!selectedDate) {\n      const today = new Date();\n      const { startTime, endTime, endTimeForAvailableDaysInFuture } = this.validateAvailableDaysInFuture(today, availableDaysInFuture || 30);\n      if (today.getTime() < endTimeForAvailableDaysInFuture * 1000) {\n        result = await this.nylasSchedulerConnector?.scheduler.getAvailability(startTime, endTime);\n      }\n    } else {\n      const { startTime, endTime, endTimeForAvailableDaysInFuture } = this.validateAvailableDaysInFuture(selectedDate, availableDaysInFuture || 30);\n      if (selectedDate.getTime() < endTimeForAvailableDaysInFuture * 1000) {\n        result = await this.nylasSchedulerConnector?.scheduler.getAvailability(startTime, endTime);\n      }\n    }\n\n    if (!result || 'error' in result) {\n      this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(result?.error) }, host: this.host });\n    }\n\n    if (!selectedDate) {\n      let _selectedDate = new Date();\n      const firstAvailableDate = nylasSchedulerStore?.get('availability').find((timeslot: any) => new Date(timeslot.start_time) > new Date());\n      if (firstAvailableDate) {\n        _selectedDate = firstAvailableDate.start_time;\n      }\n      nylasSchedulerStore?.set('selectedDate', _selectedDate);\n    }\n  }\n\n  componentDisconnected() {\n    this.baseProvider?.componentDisconnected();\n  }\n\n  @Watch('bookingInfo')\n  bookingInfoChanged(newVal?: NylasSchedulerBookingData) {\n    this.stores?.scheduler.set('bookingInfo', newVal);\n  }\n\n  @Watch('rescheduleBookingRef')\n  rescheduleBookingRefChanged(newVal?: string) {\n    if (newVal) {\n      const [configId, bookingId] = compactStringToUUIDs(newVal);\n      this.stores?.scheduler.set('rescheduleBookingId', bookingId);\n      this.refConfigId = configId;\n      this.nylasSchedulerConnector?.scheduler.setConfigId(configId);\n    }\n  }\n\n  @Watch('cancelBookingRef')\n  cancelBookingRefChanged(newVal?: string) {\n    if (newVal) {\n      const [configId, bookingId] = compactStringToUUIDs(newVal);\n      this.stores?.scheduler.set('cancelBookingId', bookingId);\n      this.refConfigId = configId;\n      this.nylasSchedulerConnector?.scheduler.setConfigId(configId);\n    }\n  }\n\n  @Watch('organizerConfirmationBookingRef')\n  organizerConfirmationBookingRefChanged(newVal?: string) {\n    if (newVal) {\n      const [configId, bookingId] = compactStringToUUIDs(newVal);\n      this.stores?.scheduler.set('organizerConfirmationBookingId', bookingId);\n      this.refConfigId = configId;\n      this.nylasSchedulerConnector?.scheduler.setConfigId(configId);\n    }\n  }\n\n  @Watch('localization')\n  localizationChanged(newVal?: Partial<Record<LANGUAGE_CODE, Locale>>) {\n    if (!newVal) {\n      return;\n    }\n\n    Object.keys(newVal).forEach(lang => {\n      if (!(lang in LANGUAGE_CODE)) {\n        return;\n      }\n      i18next.addResourceBundle(\n        lang,\n        'translation',\n        newVal[lang],\n        false, // Merge with existing translations\n        true, // Replace the existing translations with the same key\n      );\n    });\n  }\n\n  @Watch('themeConfig')\n  themeConfigChanged(newVal?: ThemeConfig) {\n    // Set the theme config in the store, hosted page will use this to apply/re-apply the theme\n    this.baseProvider?.getStore('scheduler')?.set('themeConfig', newVal);\n    this.applyThemeConfig(newVal);\n  }\n\n  @Listen('languageChanged')\n  languageChanged(event: CustomEvent<string>) {\n    const newLanguage = event.detail;\n    this.language = newLanguage;\n    i18next.changeLanguage(newLanguage);\n  }\n\n  /**\n   * This is a custom event handler that is used to register a component with the provider.\n   * It is used by components that have the `@RegisterComponent` decorator.\n   * @param event A custom event that contains the component to register\n   * @returns Promise<void>\n   */\n  @Listen('registerComponent')\n  async registerComponentHandler(event: CustomEvent<RegisteredComponent<any, any>>): Promise<void> {\n    this.baseProvider?.registerComponent(event.detail);\n  }\n\n  /**\n   * This is a custom event handler that is used to unregister a component with the provider.\n   * It is used by components that have the `@RegisterComponent` decorator.\n   * @param event A custom event that contains the component to unregister\n   * @returns Promise<void>\n   */\n  @Listen('unregisterComponent')\n  async unregisterComponentHandler(event: CustomEvent<RegisteredComponent<any, any>>): Promise<void> {\n    this.baseProvider?.unregisterComponent(event.detail);\n  }\n\n  /**\n   * This is a custom event handler that is used to refetch the availability when the month is changed.\n   */\n  @Listen('monthChanged')\n  async monthChangedHandler(event: CustomEvent<Date>) {\n    const date = event.detail;\n    const availableDaysInFuture = this.nylasSchedulerConnector?.schedulerStore?.get('configSettings')?.scheduler?.available_days_in_future;\n    const { startTime, endTime, endTimeForAvailableDaysInFuture } = this.validateAvailableDaysInFuture(date, availableDaysInFuture || 30);\n\n    if (event.defaultPrevented) {\n      return;\n    }\n\n    if (startTime < endTimeForAvailableDaysInFuture && date.getTime() < endTimeForAvailableDaysInFuture * 1000) {\n      const result = await this.nylasSchedulerConnector?.scheduler.getAvailability(startTime, endTime);\n\n      if (!result || 'error' in result) {\n        this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(result?.error) }, host: this.host });\n      }\n      const selectableDates = this.stores?.scheduler.get('selectableDates');\n      if (selectableDates && selectableDates.length > 0) {\n        this.stores?.scheduler.set('selectedDate', selectableDates[0]);\n      }\n    }\n  }\n\n  mapToBookingData(bookingInfo: NylasSchedulerBookingDataWithFlatFields): any {\n    const timeslot = this.stores?.scheduler.get('selectedTimeslot');\n    const language = this.stores?.scheduler.get('selectedLanguage');\n    const timezone = this.stores?.scheduler.get('selectedTimezone');\n    const startTime = timeslot?.start_time ? new Date(timeslot?.start_time).getTime() / 1000 : '';\n    const endTime = timeslot?.end_time ? new Date(timeslot?.end_time).getTime() / 1000 : '';\n    return {\n      additional_guests: bookingInfo.guests,\n      guest: { ...bookingInfo.primaryParticipant },\n      additional_fields: { ...bookingInfo.additionalFields },\n      start_time: startTime,\n      end_time: endTime,\n      email_language: language,\n      timezone: timezone,\n    };\n  }\n\n  /**\n   * This is a custom event handler to book an event.\n   */\n  @Listen('detailsConfirmed')\n  async bookButtonClickedHandler(event: CustomEvent<NylasSchedulerBookingDataWithFlatFields>) {\n    if (event.defaultPrevented) {\n      return;\n    }\n    const bookingData = event.detail;\n    const mappedBookingData = this.mapToBookingData(bookingData);\n    this.bookingInfoConfirmed = bookingData;\n\n    const storeRescheduleId = this.nylasSchedulerConnector?.schedulerStore?.get('rescheduleBookingId');\n    const rescheduleBookingId = storeRescheduleId;\n    if (rescheduleBookingId) {\n      const result = await this.nylasSchedulerConnector?.scheduler.rescheduleBooking(rescheduleBookingId, bookingData);\n      if (!result || 'error' in result) {\n        this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(result?.error) }, host: this.host });\n      }\n      const resultData = (result as NylasSuccessResponse<NylasEvent>)?.data;\n      const bookedEventInfoEvent = this.bookedEventInfo.emit({ ...result, data: { ...resultData, ...mappedBookingData } });\n      this.bookingInfoConfirmed = { ...this.bookingInfoConfirmed, ...resultData };\n      if ('bookedEventInfo' in this.eventOverrides) {\n        await this.eventOverrides.bookedEventInfo(bookedEventInfoEvent, this.nylasSchedulerConnector);\n      }\n      return;\n    }\n    const result = await this.nylasSchedulerConnector?.scheduler.bookTimeslot(bookingData);\n    if (!result || 'error' in result) {\n      this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(result?.error) }, host: this.host });\n    }\n    const resultData = (result as NylasSuccessResponse<NylasEvent>)?.data;\n    const bookedEventInfoEvent = this.bookedEventInfo.emit({ ...result, data: { ...resultData, ...mappedBookingData } });\n    this.bookingInfoConfirmed = { ...this.bookingInfoConfirmed, ...resultData };\n    if ('bookedEventInfo' in this.eventOverrides) {\n      await this.eventOverrides.bookedEventInfo(bookedEventInfoEvent, this.nylasSchedulerConnector);\n    }\n  }\n\n  /**\n   * This is a custom event handler to update the selected date label.\n   */\n  @Listen('dateSelected')\n  dateSelectedHandler(event: CustomEvent<Date>) {\n    const date = event.detail;\n    this.selectedDateLabel = date ? date.toLocaleDateString(undefined, { dateStyle: 'full' }) : `${i18next.t('noDateSelected')}`;\n  }\n\n  /**\n   * This is an event handler to handle the error (if any) when the\n   * cancel booking button is clicked on the cancel booking form.\n   */\n  @Listen('cancelBookedEventError')\n  cancelBookedEventErrorHandler(event: CustomEvent<NylasSchedulerErrorResponse>) {\n    this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(event.detail.error) }, host: this.host });\n  }\n\n  @Listen('cancelBookedEventValidationError')\n  cancelBookedEventValidationErrorHandler(event: CustomEvent<NylasSchedulerErrorResponse>) {\n    this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(event.detail.error) }, host: this.host });\n  }\n\n  /**\n   * This is an event handler to handle the error (if any) when the\n   * reschedule button is clicked on the booked event card.\n   */\n  @Listen('rescheduleBookedEventError')\n  rescheduleBookedEventErrorHandler(event: CustomEvent<NylasSchedulerErrorResponse>) {\n    this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(event.detail.error) }, host: this.host });\n  }\n\n  /**\n   * This is an event handler to handle the error (if any) when the\n   * manual confirmation button is clicked on the manual confirmation card.\n   */\n  @Listen('confirmBookingError')\n  confirmBookingErrorHandler(event: CustomEvent<NylasSchedulerErrorResponse>) {\n    this.nylasSchedulerError.emit({ notification: { ...this.getErrorObject(event.detail.error) }, host: this.host });\n  }\n\n  @Listen('feedbackModalClosed')\n  feedbackModalClosedHandler() {\n    this.showFeedbackModal = false;\n  }\n\n  @Listen('feedbackSubmitted')\n  feedbackSubmittedHandler(event: CustomEvent<{ feedback: string }>) {\n    const eventId = Sentry.captureMessage('Scheduling Page User Feedback', {\n      extra: {\n        configId: this.configurationId,\n        slug: this.slug,\n      },\n    });\n    const feedback = {\n      eventId: eventId,\n      message: event.detail.feedback,\n    };\n    Sentry.captureFeedback(feedback, {\n      includeReplay: true,\n      captureContext: {\n        tags: {\n          'nylas-web-element': 'nylas-scheduling',\n          'nylas-web-element-version': process.env.PACKAGE_VERSION,\n          'nylas-config-id': this.configurationId,\n          'nylas-slug': this.slug,\n          'host-url': window.location.href,\n        },\n        extra: {\n          configId: this.configurationId,\n          slug: this.slug,\n        },\n      },\n    });\n    this.showFeedbackModal = false;\n  }\n\n  /**\n   * This method is used to retrieve the NylasScheduler instance\n   * @returns The NylasScheduler instance\n   */\n  @Method()\n  async getNylasSchedulerStore(): Promise<NylasSchedulerStoreType | undefined> {\n    return this.baseProvider?.getStore('scheduler');\n  }\n\n  /**\n   * This method is used to retrieve the NylasConnector instance\n   * @returns The NylasConnector instance\n   */\n  @Method()\n  async getNylasSchedulerConnector() {\n    return this.nylasSchedulerConnector;\n  }\n\n  @Method()\n  async getRef() {\n    return this.host;\n  }\n\n  private getErrorObject(error: NylasSchedulerErrorResponse['error']): Notification {\n    return {\n      title: error?.title || genericError.title,\n      category: error?.category || genericError.category,\n      type: NotificationType.Error,\n      description: error?.message || '',\n      id: new Date().getTime().toString(),\n      ttl: 'none',\n    };\n  }\n  private checkIfSessionIdOrConfigIdExists(): boolean {\n    if (!this.sessionId && !this.refConfigId && !(this.slug && this.clientId)) {\n      let description = '';\n\n      if (!this.sessionId) {\n        description += i18next.t('sessionIdRequiredErrorMessage');\n      }\n\n      if (!this.sessionId && !this.refConfigId && !(this.slug && this.clientId)) {\n        description = i18next.t('sessionIdRequiredErrorMessage') + ' ' + i18next.t('publicConfigErrorMessage');\n      }\n\n      this.nylasSchedulerError.emit({\n        notification: {\n          title: i18next.t('schedulingComponentErrorTitle'),\n          category: ErrorCategory.Component,\n          type: NotificationType.Error,\n          description: description,\n          id: new Date().getTime().toString(),\n          ttl: 'none',\n        },\n        host: this.host,\n      });\n      return false;\n    }\n    return true;\n  }\n\n  private isTimeslotValid(timeslot: Timeslot): boolean {\n    const selectedDate = new Date(timeslot.start_time);\n    if (selectedDate < new Date()) {\n      this.nylasSchedulerError.emit({\n        notification: {\n          title: i18next.t('invalidTimeslotErrorTitle'),\n          category: ErrorCategory.Component,\n          type: NotificationType.Error,\n          description: i18next.t('invalidTimeslotErrorMessage'),\n          id: new Date().getTime().toString(),\n          ttl: 'none',\n        },\n        host: this.host,\n      });\n      return false;\n    }\n    return true;\n  }\n\n  private validateAvailableDaysInFuture(\n    startDate: Date,\n    availableDaysInFuture: number,\n  ): {\n    startTime: number;\n    endTime: number;\n    endTimeForAvailableDaysInFuture: number;\n  } {\n    const today = new Date();\n    const startTime = new Date(startDate.getFullYear(), startDate.getMonth(), 1).getTime() / 1000;\n    const endTimeForCurrentMonth = new Date(startDate.getFullYear(), startDate.getMonth() + 1, 1).getTime() / 1000;\n    const endTimeForAvailableDaysInFuture = Math.floor(addDaysToCurrentDate(today, availableDaysInFuture).getTime() / 1000);\n    const endTime = Math.min(endTimeForAvailableDaysInFuture, endTimeForCurrentMonth);\n    const startTimeWithOffset = startTime < today.getTime() / 1000 ? Math.floor(today.getTime() / 1000) : startTime;\n    return { startTime: startTimeWithOffset, endTime, endTimeForAvailableDaysInFuture };\n  }\n\n  private applyThemeConfig(themeConfig?: ThemeConfig) {\n    if (themeConfig) {\n      for (const [key, value] of Object.entries(themeConfig)) {\n        this.host.style.setProperty(`${key}`, value);\n      }\n    }\n  }\n\n  onFeedbackClick(e: Event) {\n    e.preventDefault();\n    this.showFeedbackModal = true;\n  }\n\n  redirectToCustomUrl(url: string) {\n    window.location.assign(url);\n  }\n\n  /**\n   * @slot timeslot-picker-cta-label - This slot is used to pass a custom label to the timeslot picker CTA. The default label is \"Next\".\n   * @slot custom-booking-form - This slot is used to pass a custom booking form to the Nylas Scheduling component.\n   * @deprecated  Deprecated in favor of using the additional fields defined in the config settings.\n   */\n  render() {\n    const showDefaultScheduler = this.mode === 'app';\n    const nylasSchedulerStore = this.baseProvider?.getStore('scheduler');\n    const eventInfo = nylasSchedulerStore?.get('eventInfo');\n    const showBookingForm = nylasSchedulerStore?.get('showBookingForm');\n    const cancelledEventInfo = nylasSchedulerStore?.get('cancelledEventInfo');\n    const cancelBookingId = nylasSchedulerStore?.get('cancelBookingId');\n    const selectedTimeslot = nylasSchedulerStore?.get('selectedTimeslot') as Timeslot;\n    const rescheduleBookingId = nylasSchedulerStore?.get('rescheduleBookingId');\n    const organizerConfirmationBookingId = nylasSchedulerStore?.get('organizerConfirmationBookingId');\n    const rejectBookingId = nylasSchedulerStore?.get('rejectBookingId');\n    const confirmedEventInfo = nylasSchedulerStore?.get('confirmedEventInfo');\n    const nylasBranding = nylasSchedulerStore?.get('nylasBranding') || this.nylasBranding;\n    const selectedDate = nylasSchedulerStore?.get('selectedDate');\n    const redirectUrl = nylasSchedulerStore?.get('configSettings')?.scheduler?.confirmation_redirect_url;\n    this.selectedDateLabel =\n      selectedDate && this.language\n        ? capitalizeFirstLetter(selectedDate.toLocaleDateString(LANGUAGE_CODE_MAP[this.language], { dateStyle: 'full' }))\n        : `${i18next.t('noDateSelected')}`;\n\n    if (showDefaultScheduler && (cancelBookingId || rejectBookingId) && !cancelledEventInfo) {\n      return (\n        <Host>\n          <SchedulerView nylasBranding={nylasBranding} isLoading={this.isLoading} showNotification={this.showNotification}>\n            <div class=\"cancel-flow-page\" part=\"cancel-flow-page\">\n              <nylas-cancel-booking-form\n                selectedTimeslot={selectedTimeslot}\n                cancelBookingId={cancelBookingId}\n                rejectBookingId={rejectBookingId}\n                exportparts=\"ncbf, ncbf__icon, ncbf__title, ncbf__description, ncbf__reason-textarea, ncbf__button-cta, ncbf__button-outline, ncbf__card\"\n              />\n            </div>\n          </SchedulerView>\n          {this.enableUserFeedback && (\n            <button-component id=\"report-issue\" variant={'basic'} onClick={e => this.onFeedbackClick(e)}>\n              <feedback-icon />\n            </button-component>\n          )}\n          {this.showFeedbackModal && <nylas-feedback-form></nylas-feedback-form>}\n        </Host>\n      );\n    }\n\n    // Manual confirmation page is shown when the event is manually confirmed\n    if (showDefaultScheduler && organizerConfirmationBookingId) {\n      return (\n        <Host>\n          <SchedulerView>\n            <div class=\"manual-confirmation-page\" part=\"manual-confirmation-page\">\n              <nylas-organizer-confirmation-card\n                organizerConfirmationBookingId={organizerConfirmationBookingId}\n                exportparts=\"nmcc, nmcc__title, nmcc__description, nmcc__button-cta, nmcc__button-outline\"\n              />\n            </div>\n          </SchedulerView>\n          {this.enableUserFeedback && (\n            <button-component id=\"report-issue\" variant={'basic'} onClick={e => this.onFeedbackClick(e)}>\n              <feedback-icon />\n            </button-component>\n          )}\n          {this.showFeedbackModal && <nylas-feedback-form></nylas-feedback-form>}\n        </Host>\n      );\n    }\n\n    // Cancelled event card is shown when the event is cancelled\n    if (showDefaultScheduler && cancelledEventInfo) {\n      return (\n        <Host>\n          <SchedulerView nylasBranding={nylasBranding} isLoading={this.isLoading} showNotification={this.showNotification}>\n            <div class=\"cancelled-event-page\" part=\"cancelled-event-page\">\n              <nylas-cancelled-event-card\n                cancelledEventInfo={cancelledEventInfo}\n                exportparts=\"ncec, ncec__icon, ncec__title, ncec__description, ncec__button-outline, ncec__card\"\n              />\n            </div>\n          </SchedulerView>\n          {this.enableUserFeedback && (\n            <button-component id=\"report-issue\" variant={'basic'} onClick={e => this.onFeedbackClick(e)}>\n              <feedback-icon />\n            </button-component>\n          )}\n          {this.showFeedbackModal && <nylas-feedback-form></nylas-feedback-form>}\n        </Host>\n      );\n    }\n\n    // Confirmed event card is shown when the event is confirmed\n    if (showDefaultScheduler && confirmedEventInfo) {\n      return (\n        <Host>\n          <SchedulerView nylasBranding={nylasBranding} isLoading={this.isLoading} showNotification={this.showNotification}>\n            <div class=\"cancelled-event-page\" part=\"confirmed-event-page\">\n              <nylas-confirmed-event-card\n                confirmedEventInfo={confirmedEventInfo}\n                exportparts=\"ncec, ncec__icon, ncec__title, ncec__description, ncec__button-outline, ncec__card\"\n              />\n            </div>\n          </SchedulerView>\n          {this.enableUserFeedback && (\n            <button-component id=\"report-issue\" variant={'basic'} onClick={e => this.onFeedbackClick(e)}>\n              <feedback-icon />\n            </button-component>\n          )}\n          {this.showFeedbackModal && <nylas-feedback-form></nylas-feedback-form>}\n        </Host>\n      );\n    }\n\n    // Redirected to custom URL when the event is booked and redirect URL is provided\n    if (showDefaultScheduler && eventInfo && redirectUrl) {\n      const recipient = this.bookingInfoConfirmed?.primaryParticipant;\n      const location = this.bookingInfoConfirmed?.location;\n      const booking_ref = this.bookingInfoConfirmed?.booking_ref;\n      const additionalFields = this.bookingInfoConfirmed?.additionalFields || {};\n      if (this.bookingInfo && typeof this.bookingInfo?.additionalFields !== 'undefined') {\n        const bookingInfoAdditionalFields = this.bookingInfo.additionalFields;\n        // Merge additional fields from the bookingInfo with the additional fields from the booking form\n        Object.keys(bookingInfoAdditionalFields).forEach(key => {\n          if (!additionalFields[key] && bookingInfoAdditionalFields?.[key]) {\n            additionalFields[key] = bookingInfoAdditionalFields[key].value;\n          }\n        });\n      }\n      const selectedTimeslot = this.stores?.scheduler.get('selectedTimeslot');\n      const selectedTimezone = this.stores?.scheduler.get('selectedTimezone');\n      const selectedLanguage = this.stores?.scheduler.get('selectedLanguage');\n      const configSettings = this.stores?.scheduler.get('configSettings');\n\n      const configurationId = this.configurationId ? this.configurationId : configSettings?.configuration_id;\n      const queryString = window.location.search;\n\n      const urlParams = new URLSearchParams(queryString);\n      urlParams.set('booking_id', eventInfo.booking_id);\n      recipient?.name && urlParams.set('name', recipient.name);\n      recipient?.email && urlParams.set('email', recipient.email);\n      selectedTimeslot?.start_time && urlParams.set('start_time', (new Date(selectedTimeslot.start_time).getTime() / 1000).toString());\n      selectedTimeslot?.end_time && urlParams.set('end_time', (new Date(selectedTimeslot.end_time).getTime() / 1000).toString());\n      selectedTimezone && urlParams.set('tz', selectedTimezone);\n      selectedLanguage && urlParams.set('language', selectedLanguage);\n      additionalFields && urlParams.set('additional_values', JSON.stringify(additionalFields));\n      this.slug && urlParams.set('page_slug', this.slug);\n      configurationId && urlParams.set('config_id', configurationId);\n      location && urlParams.set('location', location);\n      booking_ref && urlParams.set('booking_ref', booking_ref);\n      this.redirectToCustomUrl(`${redirectUrl}?${urlParams.toString()}`);\n      return;\n    }\n\n    // Booked event card is shown when the event is booked or booking is sent\n    if (showDefaultScheduler && eventInfo) {\n      return (\n        <Host>\n          <SchedulerView nylasBranding={nylasBranding} isLoading={this.isLoading} showNotification={this.showNotification}>\n            <div class=\"booked-event-page\" part=\"booked-event-page\">\n              <nylas-booked-event-card\n                selectedTimeslot={selectedTimeslot}\n                eventInfo={eventInfo}\n                exportparts=\"nbec, nbec__title, nbec__card, nbec__description, nbec__button-outline, nbec__cancel-cta, nbec__reschedule-cta\"\n              />\n            </div>\n          </SchedulerView>\n          {this.enableUserFeedback && (\n            <button-component id=\"report-issue\" variant={'basic'} onClick={e => this.onFeedbackClick(e)}>\n              <feedback-icon />\n            </button-component>\n          )}\n          {this.showFeedbackModal && <nylas-feedback-form></nylas-feedback-form>}\n        </Host>\n      );\n    }\n    // Date and time picker is shown when the event is not booked and no additional data is shown\n    if (showDefaultScheduler && (!eventInfo || !!rescheduleBookingId) && !showBookingForm) {\n      const timeslotPickerCTALabel = this.host.querySelector('[slot=\"timeslot-picker-cta-label\"]');\n      return (\n        <Host>\n          <SchedulerView nylasBranding={nylasBranding} isLoading={this.isLoading} showNotification={this.showNotification}>\n            {rescheduleBookingId && <MessageBanner>{`${i18next.t('rescheduleTitle')}`}</MessageBanner>}\n            <div class=\"select-date-page\" part=\"select-date-page\">\n              <div class=\"left-panel\">\n                <nylas-date-picker exportparts=\"ndp, ndp__title, ndp__month-header, ndp__month-button, ndp__day, ndp__date, ndp__date--disabled, ndp__date--selected, ndp__date--current-day, ndp__date--current-month\"></nylas-date-picker>\n                <nylas-locale-switch exportparts=\"nls, nls__timezone, nls__timezone-dropdown, nls__timezone-drop-button, nls__timezone-drop-button-selected-label, nls__timezone-drop-content, nls__timezone-drop-label, nls__language, nls__language-dropdown, nls__language-drop-button, nls__language-drop-content, nls__language-drop-label\"></nylas-locale-switch>\n              </div>\n              <div class={`right-panel ${rescheduleBookingId ? 'reschedule' : ''}`}>\n                <h2>\n                  <calendar-icon></calendar-icon>\n                  <span id=\"selectedDate\">{this.selectedDateLabel}</span>\n                </h2>\n                <nylas-timeslot-picker exportparts=\"ntp, ntp__time-picker-wrapper, ntp__timeslots, ntp__timeslot, ntp__timeslot--selected, ntp__button-primary\">\n                  {timeslotPickerCTALabel && (\n                    <span slot=\"timeslot-picker-cta-label\">\n                      <slot name=\"timeslot-picker-cta-label\"></slot>\n                    </span>\n                  )}\n                </nylas-timeslot-picker>\n              </div>\n            </div>\n          </SchedulerView>\n          {this.enableUserFeedback && (\n            <button-component id=\"report-issue\" variant={'basic'} onClick={e => this.onFeedbackClick(e)}>\n              <feedback-icon />\n            </button-component>\n          )}\n          {this.showFeedbackModal && <nylas-feedback-form></nylas-feedback-form>}\n        </Host>\n      );\n    }\n    // Additional data is shown when the time is selected, event is not booked and additional data is shown\n    if (showDefaultScheduler && !eventInfo && showBookingForm) {\n      return (\n        <Host>\n          <SchedulerView nylasBranding={nylasBranding} isLoading={this.isLoading} showNotification={this.showNotification}>\n            {rescheduleBookingId && <MessageBanner>{`${i18next.t('rescheduleTitle')}`}</MessageBanner>}\n            <div class=\"additional-data-page\" part=\"additional-data-page\">\n              <div class=\"left-panel\">\n                <div class=\"wrapper\">\n                  <nylas-selected-event-card exportparts=\"nsec, nsec__card, nsec__icon, nsec__date, nsec__time, nsec__timezone\"></nylas-selected-event-card>\n                </div>\n              </div>\n              <div class={`right-panel ${rescheduleBookingId ? 'reschedule' : ''}`}>\n                <nylas-booking-form exportparts=\"nbf, nbf__input-textfield, nbf__button-ghost, nbf__button-outline, nbf__button-primary, nbf__input-wrapper, nbf__checkbox-component, nbf__radio-button-group, nbf__textarea-component, nbf__dropdown, nbf__dropdown-button, nbf__dropdown-content\"></nylas-booking-form>\n              </div>\n            </div>\n          </SchedulerView>\n          {this.enableUserFeedback && (\n            <button-component id=\"report-issue\" variant={'basic'} onClick={e => this.onFeedbackClick(e)}>\n              <feedback-icon />\n            </button-component>\n          )}\n          {this.showFeedbackModal && <nylas-feedback-form></nylas-feedback-form>}\n        </Host>\n      );\n    }\n\n    return (\n      <Host>\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nylas/web-elements",
-  "version": "0.0.0-canary-20250120165013",
+  "version": "0.0.0-canary-20250122221254",
   "description": "Nylas Web Elements",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -36,8 +36,8 @@
     "rrule": "2.7.2",
     "sanitize-html": "^2.13.0",
     "sortablejs": "^1.15.2",
-    "@nylas/identity": "^3.0.0",
-    "@nylas/core": "^0.0.0-canary-20250120165013"
+    "@nylas/core": "^0.0.0-canary-20250122221254",
+    "@nylas/identity": "^3.0.0"
   },
   "devDependencies": {
     "@stencil-community/eslint-plugin": "^0.7.1",

package/dist/nylas-web-elements/p-02488442.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as a,h as s,a as i}from"./p-68c2fadf.js";import{n as r}from"./p-42b5c528.js";const t=':host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:"Inter", sans-serif;width:100%}.checkbox-container{display:flex;flex-direction:column;gap:0.5rem}.checkbox-container p.error{color:var(--nylas-error);font-size:14px;font-weight:400;line-height:20px;font-family:var(--nylas-font-family);margin:0}label{display:flex;align-items:center;font-family:var(--nylas-font-family);cursor:pointer;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}label.readonly{cursor:not-allowed}label input[type=checkbox]{position:absolute;opacity:0;cursor:pointer;border:1px solid var(--nylas-base-300)}label input[type=checkbox]:focus~.checkmark,label input[type=checkbox]:hover~.checkmark{border-color:var(--nylas-primary)}label input[type=checkbox]:checked~.checkmark{color:var(--nylas-base-0);background:var(--nylas-primary) url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+DQo8c3ZnIHdpZHRoPSIxMiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgMTIgOSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCiAgPHBhdGggZD0iTTQuNTc1IDguOTc3cy0uNDA0LS4wMDctLjUzNi0uMTY1TC4wNTcgNS42NGwuODI5LTEuMjI3TDQuNDcgNy4yNjggMTAuOTIxLjA4NmwuOTIzIDEuMTAzLTYuODYzIDcuNjRjLS4xMzQtLjAwMy0uNDA2LjE0OC0uNDA2LjE0OHoiIGZpbGw9IiNGRkYiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPg0KPC9zdmc+) 50% 40% no-repeat;border:2px solid var(--nylas-primary)}label input[type=checkbox]:disabled{cursor:not-allowed;background:var(--nylas-base-100);border:1px solid var(--nylas-base-300)}label .checkmark{border-radius:var(--nylas-border-radius);border:2px solid var(--nylas-base-800);position:absolute;left:0;top:2px;width:18px;height:18px;cursor:pointer;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}label .label{margin-left:32px;font-size:16px;font-weight:400;color:var(--nylas-base-800);line-height:24px}';const l=t;const n=class{constructor(s){e(this,s);this.nylasFormCheckboxToggled=a(this,"nylasFormCheckboxToggled",7);this.componentType="checkbox";this.name="checkbox";this.checked=undefined;this.label="";this.readOnly=false;this.required=false;this.isChecked=undefined;this.error=""}checkedPropChangedHandler(e){if(typeof e==="boolean"){this.isChecked=e}}componentWillLoad(){this.el.setAttribute("component-type",this.componentType)}componentDidLoad(){this.isChecked=this.checked||false}handleBookingFormSubmitted(e){if(this.required&&!this.isChecked){this.error=`${this.label} is required.`;return}if(this.error){e.preventDefault()}}toggleCheck(){this.error="";this.isChecked=!this.isChecked;this.nylasFormCheckboxToggled.emit({checked:this.isChecked,name:this.name,label:this.label})}render(){return s("div",{key:"436d313659a2d88e1373028efa14ec4422fdeb53",class:"checkbox-container"},s("label",{key:"9cf84f5a1fa7a35257681afc1bd2a215ebe36aad",title:this.readOnly?"read-only field":undefined,class:{readonly:this.readOnly}},s("input",{key:"600422d052cd28de6f053fac93c9a753f32637c1",type:"checkbox",disabled:this.readOnly,readOnly:this.readOnly,name:this.name,title:this.readOnly?"read-only field":undefined,checked:this.isChecked,onChange:()=>this.toggleCheck()}),s("span",{key:"a3130e18c64555c54cd73695d2392148ef8c49f6",class:"checkmark"}),s("slot",{key:"808de6e68a5c5887ba0ca3b5a997aae2aed035a2",name:"label"},s("span",{key:"4cb5b6c8d3548976ba9e1e5a5269aad3773e642f",class:"label"},this.label))),this.error&&s("p",{class:"error"},this.error))}get el(){return i(this)}static get watchers(){return{checked:["checkedPropChangedHandler"]}}};n.style=l;const o=':host{display:block;height:auto;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:"Inter", sans-serif;width:100%}label{display:flex;color:var(--nylas-base-800, #293056);font-size:14px;font-style:normal;font-weight:400;line-height:150%;flex-direction:column;gap:4px;font-family:var(--nylas-font-family);font-size:16px;color:var(--nylas-base-800)}label.error{color:var(--nylas-error)}label span.required{color:var(--nylas-error);padding:0 0.25rem}label p{margin:0}label .error{color:var(--nylas-error)}.input_wrapper{display:flex;align-items:center;gap:1rem}input[type=date]{display:flex;height:48px;padding-left:16px;align-items:center;gap:8px;align-self:stretch;border-radius:var(--nylas-border-radius-2x);border:1px solid var(--nylas-base-300);background:var(--nylas-base-0);width:-webkit-fill-available;color:var(--nylas-base-900);font-size:16px;font-style:normal;font-weight:400;line-height:150%;width:100%;width:-moz-available;width:-webkit-fill-available}input[type=date]:focus{outline-color:var(--nylas-primary)}input[type=date].error{border-radius:var(--nylas-border-radius-2x);font-weight:600;border-color:var(--nylas-error);border-width:2px}input[type=date].error::placeholder{font-weight:400}input[type=date]::placeholder{color:var(--nylas-base-300)}input:read-only{background-color:var(--nylas-base-100);cursor:not-allowed}';const d=o;const h={date:"YYYY-MM-DD"};const c=class{constructor(s){e(this,s);this.nylasFormInputChanged=a(this,"nylasFormInputChanged",7);this.nylasFormInputFocused=a(this,"nylasFormInputFocused",7);this.nylasFormInputBlurred=a(this,"nylasFormInputBlurred",7);this.name="input";this.defaultValue=undefined;this.label="";this.placeholder=h["date"];this.required=false;this.readOnly=false;this.autoFocus=false;this.pattern=undefined;this.maxLength=255;this.patternError="";this.requiredError="";this.value=undefined;this.error="";this.isDateValid=true}handleDefaultValueChange(e){this.value=r(e);if(this.value){this.validatePattern(this.value)}}componentDidLoad(){this.value=r(this.defaultValue||"");if(this.value){this.validatePattern(this.value)}}handleBookingFormSubmitted(e){this.validatePattern(this.value);if(this.error){e.preventDefault()}}async handleFormSubmitted(e){this.validatePattern(this.value);if(this.error){e.preventDefault()}}handleInput(e){this.error="";const a=e.target;this.value=r(a.value);this.isDateValid=a.validity.valid;this.nylasFormInputChanged.emit({value:this.value,name:this.name,label:this.label,error:this.error,type:"date"})}handleBlur(){this.nylasFormInputBlurred.emit({value:this.value,name:this.name})}handleFocus(){this.nylasFormInputFocused.emit({value:this.value,name:this.name})}validatePattern(e){this.error="";if(this.required&&!this.isDateValid){this.error="Please enter a valid date";return}if(this.required&&!e){this.error=this.requiredError||"This field is required.";return}if(!this.pattern||!e&&!this.required)return;if(this.pattern.test(e)){this.error=""}else{this.error=this.patternError||"Invalid format."}}render(){return s("label",{key:"cb168f9d7591a41ee4c32f712529714134c8b0d9",part:"ic__label",class:{error:!!this.error}},this.label&&s("p",null,s("span",{class:"label"},this.label),this.required&&s("span",{class:"required"},"*")),s("div",{key:"2bcef7ba3f5fe53e5dfab5705092a8dfab37d755",part:"ic__input_wrapper",class:"input_wrapper"},s("input",{key:"1da260c499b51ac83d715b7fd673befa2e1fd39c",type:"date",name:this.name,part:"ic__date",title:this.readOnly?"read-only field":undefined,readOnly:this.readOnly,autoFocus:this.autoFocus,value:this.value,maxLength:this.maxLength,placeholder:this.placeholder,class:{error:!!this.error},onInput:e=>this.handleInput(e),onFocus:()=>this.handleFocus(),onBlur:()=>this.handleBlur()}),s("slot",{key:"b757b5c543e8741c1c39c1b257fdbd253d94eb7a",name:"additional-input"})),this.error&&s("span",{class:"error help-text"},this.error))}get el(){return i(this)}static get watchers(){return{defaultValue:["handleDefaultValueChange"]}}};c.style=d;const b=':host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:"Inter", sans-serif;width:100%}.radio-group{display:flex;flex-direction:column;gap:0.5rem}.radio-group slot[name=label]{display:flex;color:var(--nylas-base-800, #293056);font-size:14px;font-style:normal;font-weight:400;line-height:150%;font-size:16px}.radio-group slot[name=label].error{color:var(--nylas-error)}.radio-group slot[name=label] span.required{color:var(--nylas-error);padding:0 0.25rem}.radio-group slot[name=label] p{margin:0}.radio-group slot[name=label] p.error{color:var(--nylas-error)}.radio-group slot[name=label] .error{color:var(--nylas-error)}.radio-group span.error{color:var(--nylas-error);font-size:14px;font-weight:400;line-height:20px;font-family:var(--nylas-font-family)}.radio-group label{display:flex;font-family:var(--nylas-font-family);cursor:pointer}.radio-group label .radio-option{display:flex;align-items:flex-start;gap:0.5rem}.radio-group label .radio-option input[type=radio]{cursor:pointer}.radio-group label .radio-option input[type=radio i]{width:20px;height:20px;color:var(--nylas-primary)}.radio-group label .radio-option p{display:flex;flex-direction:column;gap:0.5rem;margin:0}.radio-group label .radio-option p .title{font-size:16px;font-weight:500;line-height:20px;color:var(--nylas-base-800)}.radio-group label .radio-option p .description{font-size:14px;font-weight:400;line-height:20px;color:var(--nylas-base-600)}';const p=b;const f=class{constructor(s){e(this,s);this.nylasFormRadioChanged=a(this,"nylasFormRadioChanged",7);this.componentType="radio-group";this.name="radio-group";this.options=[];this.defaultSelectedValue="";this.label=undefined;this.required=false;this.readOnly=false;this.selectedValue=undefined;this.error=""}handleDefaultSelectedValueChange(e){this.selectedValue=e}componentDidLoad(){this.selectedValue=this.defaultSelectedValue}handleBookingFormSubmitted(e){if(this.required&&!this.selectedValue){this.error=`${this.label} is required.`;return}if(this.error){e.preventDefault()}}componentWillLoad(){this.el.setAttribute("component-type",this.componentType)}handleChange(e){this.error="";this.selectedValue=e;this.nylasFormRadioChanged.emit({value:e,name:this.name,label:this.label})}render(){return s("div",{key:"f219a6624a8adc34fbb8f8baf5e27ca800fc4c52",class:"radio-group"},s("slot",{key:"781664f38d7b6203592d0299cd8ebca5fe9c5fbc",name:"label"},this.label&&s("p",{class:{error:!!this.error}},s("span",{class:"label"},this.label),this.required&&s("span",{class:"required"},"*"))),this.options.map((e=>s("label",null,s("div",{class:"radio-option"},s("input",{type:"radio",disabled:this.readOnly,readOnly:this.readOnly,title:this.readOnly?"read-only field":undefined,name:this.name,value:e.value,checked:this.selectedValue===e.value,onChange:()=>this.handleChange(e.value)}),s("p",null,s("span",{class:"title"},e.label),s("span",{class:"description"},e.description)))))),this.error&&s("span",{class:"error help-text"},this.error))}get el(){return i(this)}static get watchers(){return{defaultSelectedValue:["handleDefaultSelectedValueChange"]}}};f.style=p;export{n as checkbox_component,c as nylas_date_component,f as radio_button_group};
-//# sourceMappingURL=p-02488442.entry.js.map

package/dist/nylas-web-elements/p-02488442.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["checkboxComponentCss","CheckboxComponentStyle0","CheckboxComponent","this","componentType","checkedPropChangedHandler","newValue","isChecked","componentWillLoad","el","setAttribute","componentDidLoad","checked","handleBookingFormSubmitted","event","required","error","label","preventDefault","toggleCheck","nylasFormCheckboxToggled","emit","name","render","h","key","class","title","readOnly","undefined","readonly","type","disabled","onChange","nylasDateComponentCss","NylasDateComponentStyle0","DefaultPlaceholder","date","NylasDateComponent","handleDefaultValueChange","value","sanitize","validatePattern","defaultValue","handleFormSubmitted","handleInput","e","target","isDateValid","validity","valid","nylasFormInputChanged","handleBlur","nylasFormInputBlurred","handleFocus","nylasFormInputFocused","requiredError","pattern","test","patternError","part","autoFocus","maxLength","placeholder","onInput","onFocus","onBlur","radioButtonGroupCss","RadioButtonGroupStyle0","RadioButtonGroup","handleDefaultSelectedValueChange","selectedValue","defaultSelectedValue","handleChange","nylasFormRadioChanged","options","map","option","description"],"sources":["src/components/design-system/checkbox-component/checkbox-component.scss?tag=checkbox-component&encapsulation=shadow","src/components/design-system/checkbox-component/checkbox-component.tsx","src/components/design-system/nylas-date-component/nylas-date-component.scss?tag=nylas-date-component&encapsulation=shadow","src/components/design-system/nylas-date-component/nylas-date-component.tsx","src/components/design-system/radio-button-group/radio-button-group.scss?tag=radio-button-group&encapsulation=shadow","src/components/design-system/radio-button-group/radio-button-group.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n  display: block;\n  @include default-css-variables;\n  width: 100%;\n}\n\n.checkbox-container {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n\n  p.error {\n    color: var(--nylas-error);\n    font-size: 14px;\n    font-weight: 400;\n    line-height: 20px;\n    font-family: var(--nylas-font-family);\n    margin: 0;\n  }\n}\n\nlabel {\n  display: flex;\n  align-items: center;\n  font-family: var(--nylas-font-family);\n  cursor: pointer;\n  position: relative;\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n  user-select: none;\n\n  &.readonly {\n    cursor: not-allowed;\n  }\n\n  input[type='checkbox'] {\n    position: absolute;\n    opacity: 0;\n    cursor: pointer;\n    border: 1px solid var(--nylas-base-300);\n\n    &:focus ~ .checkmark,\n    &:hover ~ .checkmark {\n      border-color: var(--nylas-primary);\n    }\n\n    &:checked ~ .checkmark {\n      color: var(--nylas-base-0);\n      background: var(--nylas-primary)\n        url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+DQo8c3ZnIHdpZHRoPSIxMiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgMTIgOSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCiAgPHBhdGggZD0iTTQuNTc1IDguOTc3cy0uNDA0LS4wMDctLjUzNi0uMTY1TC4wNTcgNS42NGwuODI5LTEuMjI3TDQuNDcgNy4yNjggMTAuOTIxLjA4NmwuOTIzIDEuMTAzLTYuODYzIDcuNjRjLS4xMzQtLjAwMy0uNDA2LjE0OC0uNDA2LjE0OHoiIGZpbGw9IiNGRkYiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPg0KPC9zdmc+)\n        50% 40% no-repeat;\n      border: 2px solid var(--nylas-primary);\n    }\n\n    &:disabled {\n      cursor: not-allowed;\n      background: var(--nylas-base-100);\n      border: 1px solid var(--nylas-base-300);\n    }\n  }\n\n  .checkmark {\n    border-radius: var(--nylas-border-radius);\n    border: 2px solid var(--nylas-base-800);\n    position: absolute;\n    left: 0;\n    top: 2px;\n    width: 18px;\n    height: 18px;\n    cursor: pointer;\n    pointer-events: none;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    -ms-user-select: none;\n    user-select: none;\n  }\n\n  .label {\n    margin-left: 32px;\n    font-size: 16px;\n    font-weight: 400;\n    color: var(--nylas-base-800);\n    line-height: 24px;\n  }\n}\n","import { Component, h, Prop, State, Event, EventEmitter, Listen, Element, Watch } from '@stencil/core';\n\n/**\n * The `checkbox-component` component is a UI component that allows users to select a checkbox.\n * This component is used in the scheduling form to input checkbox type inputs.\n */\n@Component({\n  tag: 'checkbox-component',\n  styleUrl: 'checkbox-component.scss',\n  shadow: true,\n})\nexport class CheckboxComponent {\n  @Element() el!: HTMLElement;\n  private readonly componentType: string = 'checkbox';\n\n  /**\n   * The name of the checkbox. This is used to identify the checkbox when submitting a form.\n   */\n  @Prop() name: string = 'checkbox';\n  /**\n   * The default value of the checkbox. This is the value that is displayed when the checkbox is rendered.\n   */\n  @Prop() checked?: boolean;\n  /**\n   * The label of the checkbox. This is displayed next to the checkbox.\n   */\n  @Prop() label: string = '';\n  /**\n   * The property to make the checkbox read-only. If true, the checkbox cannot be edited.\n   */\n  @Prop() readOnly: boolean = false;\n  /**\n   * Whether the checkbox is required. If true, the checkbox must be checked when submitting a form.\n   * Default is false. If the checkbox is required and not checked, an error message is displayed.\n   */\n  @Prop() required: boolean = false;\n  /**\n   * The checked state of the checkbox.\n   */\n  @State() isChecked!: boolean;\n  /**\n   * The error message state.\n   */\n  @State() error: string = '';\n\n  /**\n   * This event is fired when the checkbox is toggled.\n   */\n  @Event() nylasFormCheckboxToggled!: EventEmitter<{\n    checked: boolean;\n    name: string;\n    label: string;\n  }>;\n\n  @Watch('checked')\n  checkedPropChangedHandler(newValue: boolean) {\n    if (typeof newValue === 'boolean') {\n      this.isChecked = newValue;\n    }\n  }\n\n  // Lifecycle events\n  componentWillLoad() {\n    this.el.setAttribute('component-type', this.componentType);\n  }\n\n  componentDidLoad() {\n    this.isChecked = this.checked || false;\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    if (this.required && !this.isChecked) {\n      this.error = `${this.label} is required.`;\n      return;\n    }\n    if (this.error) {\n      event.preventDefault();\n    }\n  }\n\n  // Methods\n  toggleCheck() {\n    this.error = '';\n    this.isChecked = !this.isChecked;\n    this.nylasFormCheckboxToggled.emit({\n      checked: this.isChecked,\n      name: this.name,\n      label: this.label,\n    });\n  }\n\n  render() {\n    return (\n      <div class=\"checkbox-container\">\n        <label title={this.readOnly ? 'read-only field' : undefined} class={{ readonly: this.readOnly }}>\n          <input\n            type=\"checkbox\"\n            disabled={this.readOnly}\n            readOnly={this.readOnly}\n            name={this.name}\n            title={this.readOnly ? 'read-only field' : undefined}\n            checked={this.isChecked}\n            onChange={() => this.toggleCheck()}\n          />\n          <span class=\"checkmark\"></span>\n          <slot name=\"label\">\n            <span class=\"label\">{this.label}</span>\n          </slot>\n        </label>\n        {this.error && <p class=\"error\">{this.error}</p>}\n      </div>\n    );\n  }\n}\n","@import '../../../common/styles/variables.scss';\n@import '../../../common/mixins/inputs.scss';\n\n:host {\n  display: block;\n  height: auto;\n  @include default-css-variables;\n  width: 100%;\n}\n\nlabel {\n  @include input-label;\n  flex-direction: column;\n  gap: 4px;\n  font-family: var(--nylas-font-family);\n  font-size: 16px;\n  color: var(--nylas-base-800);\n\n  p {\n    margin: 0;\n  }\n\n  .error {\n    color: var(--nylas-error);\n  }\n}\n\n.input_wrapper {\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n}\n\ninput[type='date'] {\n  @include textfield;\n  width: 100%;\n  width: -moz-available;\n  width: -webkit-fill-available;\n}\n\ninput:read-only {\n  background-color: var(--nylas-base-100);\n  cursor: not-allowed;\n}\n","import { Component, h, Prop, State, Event, EventEmitter, Listen, Watch, Element } from '@stencil/core';\nimport { sanitize } from '@/utils/utils';\n\nconst DefaultPlaceholder = {\n  date: 'YYYY-MM-DD',\n};\n\n/**\n * The `nylas-date-component` component is a UI component that allows users to input text, email, or phone number values.\n * This component is used in the scheduling form to input text, email and phone number type inputs.\n */\n\n@Component({\n  tag: 'nylas-date-component',\n  styleUrl: 'nylas-date-component.scss',\n  shadow: true,\n})\nexport class NylasDateComponent {\n  /**\n   * The host element\n   */\n  @Element() el!: HTMLElement;\n  /**\n   * The name of the input. This is used to identify the input when submitting a form.\n   */\n  @Prop() name: string = 'input';\n  /**\n   * The default value of the input. This is the value that is displayed when the input is rendered.\n   */\n  @Prop() defaultValue?: string;\n  /**\n   * The label of the input. This is displayed above the input.\n   */\n  @Prop() label: string = '';\n\n  /**\n   * The placeholder of the input. This is displayed when the input is empty.\n   */\n  @Prop() placeholder: string = DefaultPlaceholder['date'];\n  /**\n   * Whether the input is required. If true, the input must have a value when submitting a form.\n   * Default is false. If the input is required and the value is empty, an error message is displayed.\n   */\n  @Prop() required: boolean = false;\n  /**\n   * Whether the input is read-only. If true, the input cannot be edited.\n   * Default is false.\n   */\n  @Prop() readOnly: boolean = false;\n  /**\n   * Whether the input should be focused when rendered.\n   * Default is false. If true, the input is focused when rendered.\n   * Use this to set the focus on the first input in a form.\n   */\n  @Prop() autoFocus: boolean = false;\n  /**\n   * The pattern to validate the input value. If the value does not match the pattern, an error message is displayed.\n   * Default is null. If the pattern is not set, the pattern is determined by the input type for 'email' and 'phone_number'.\n   */\n  @Prop() pattern?: RegExp;\n  /**\n   * The maximum length of the input value. If the value is longer than the maximum length, an error message is displayed.\n   * Default is 255.\n   */\n  @Prop() maxLength: number = 255;\n  /**\n   * The error message to display when the value does not match the pattern.\n   * Default is 'Invalid <field> format.' where <field> is the input label.\n   */\n  @Prop() patternError: string = '';\n\n  /**\n   * This error message is displayed when the input value is empty and the input is required.\n   */\n  @Prop() requiredError: string = '';\n\n  /**\n   * The input value state.\n   */\n  @State() value!: string;\n  /**\n   * The error message state.\n   */\n  @State() error: string = '';\n\n  /**\n   * State to track the validity of the date input.\n   */\n  @State() isDateValid: boolean = true;\n\n  /**\n   * This event is fired when the input value is changed.\n   * The scheduling form listens for this event to validate the input value and submit the form.\n   * If using outside of the scheduling form, listen for this event to validate the input value\n   * and handle the input value change.\n   */\n  @Event() nylasFormInputChanged!: EventEmitter<{\n    value: string;\n    name: string;\n    label: string;\n    type: string;\n    error: string;\n  }>;\n\n  @Event() nylasFormInputFocused!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  @Event() nylasFormInputBlurred!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  // Lifecycle methods\n  @Watch('defaultValue')\n  handleDefaultValueChange(newValue: string) {\n    this.value = sanitize(newValue);\n    if (this.value) {\n      this.validatePattern(this.value);\n    }\n  }\n\n  componentDidLoad() {\n    this.value = sanitize(this.defaultValue || '');\n    if (this.value) {\n      this.validatePattern(this.value);\n    }\n  }\n\n  // Event listeners\n  /**\n   * Listen for the bookingFormSubmitted event to validate the input value when the form is submitted.\n   */\n  @Listen('bookingFormSubmitted', { target: 'document' })\n  handleBookingFormSubmitted(event: CustomEvent) {\n    this.validatePattern(this.value);\n    if (this.error) {\n      event.preventDefault();\n    }\n  }\n\n  @Listen('formSubmitted', { target: 'document' })\n  async handleFormSubmitted(event: CustomEvent) {\n    this.validatePattern(this.value);\n    if (this.error) {\n      event.preventDefault();\n    }\n  }\n\n  // Methods\n  handleInput(e: Event) {\n    this.error = '';\n    const target = e.target as HTMLInputElement;\n    this.value = sanitize(target.value);\n    this.isDateValid = target.validity.valid;\n    this.nylasFormInputChanged.emit({\n      value: this.value,\n      name: this.name,\n      label: this.label,\n      error: this.error,\n      type: 'date',\n    });\n  }\n\n  handleBlur() {\n    this.nylasFormInputBlurred.emit({\n      value: this.value,\n      name: this.name,\n    });\n  }\n\n  handleFocus() {\n    this.nylasFormInputFocused.emit({\n      value: this.value,\n      name: this.name,\n    });\n  }\n\n  validatePattern(value: string) {\n    // Reset error\n    this.error = '';\n    if (this.required && !this.isDateValid) {\n      this.error = 'Please enter a valid date';\n      return;\n    }\n    // Check if the field is required and value is empty\n    if (this.required && !value) {\n      this.error = this.requiredError || 'This field is required.';\n      return;\n    }\n    // Check if value matches pattern\n    if (!this.pattern || (!value && !this.required)) return;\n\n    if (this.pattern.test(value)) {\n      this.error = '';\n    } else {\n      this.error = this.patternError || 'Invalid format.';\n    }\n  }\n\n  render() {\n    return (\n      <label part=\"ic__label\" class={{ error: !!this.error }}>\n        {this.label && (\n          <p>\n            <span class=\"label\">{this.label}</span>\n            {this.required && <span class=\"required\">*</span>}\n          </p>\n        )}\n        <div part=\"ic__input_wrapper\" class=\"input_wrapper\">\n          <input\n            type=\"date\"\n            name={this.name}\n            part=\"ic__date\"\n            title={this.readOnly ? 'read-only field' : undefined}\n            readOnly={this.readOnly}\n            autoFocus={this.autoFocus}\n            value={this.value}\n            maxLength={this.maxLength}\n            placeholder={this.placeholder}\n            class={{ error: !!this.error }}\n            onInput={e => this.handleInput(e)}\n            onFocus={() => this.handleFocus()}\n            onBlur={() => this.handleBlur()}\n          />\n          <slot name=\"additional-input\"></slot>\n        </div>\n        {this.error && <span class=\"error help-text\">{this.error}</span>}\n      </label>\n    );\n  }\n}\n","@import '../../../common/styles/variables.scss';\n@import '../../../common/mixins/inputs.scss';\n\n:host {\n  display: block;\n  @include default-css-variables;\n  width: 100%;\n}\n\n.radio-group {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n\n  slot[name='label'] {\n    @include input-label;\n    font-size: 16px;\n\n    p {\n      margin: 0;\n\n      &.error {\n        color: var(--nylas-error);\n      }\n    }\n\n    .error {\n      color: var(--nylas-error);\n    }\n  }\n\n  span.error {\n    color: var(--nylas-error);\n    font-size: 14px;\n    font-weight: 400;\n    line-height: 20px;\n    font-family: var(--nylas-font-family);\n  }\n\n  label {\n    display: flex;\n\n    font-family: var(--nylas-font-family);\n    cursor: pointer;\n\n    .radio-option {\n      display: flex;\n      align-items: flex-start;\n      gap: 0.5rem;\n\n      input[type='radio'] {\n        cursor: pointer;\n      }\n\n      input[type='radio' i] {\n        width: 20px;\n        height: 20px;\n        color: var(--nylas-primary);\n      }\n\n      p {\n        display: flex;\n        flex-direction: column;\n        gap: 0.5rem;\n        margin: 0;\n\n        .title {\n          font-size: 16px;\n          font-weight: 500;\n          line-height: 20px;\n          color: var(--nylas-base-800);\n        }\n\n        .description {\n          font-size: 14px;\n          font-weight: 400;\n          line-height: 20px;\n          color: var(--nylas-base-600);\n        }\n      }\n    }\n  }\n}\n","// src/components/radio-group/radio-group.tsx\nimport { Component, h, Prop, State, Event, EventEmitter, Listen, Element, Watch } from '@stencil/core';\n\n/**\n * The `radio-button-group` component is a UI component that allows users to select a single option from a list of options.\n * This component is used in the scheduling form to input radio button type inputs.\n */\n@Component({\n  tag: 'radio-button-group',\n  styleUrl: 'radio-button-group.scss',\n  shadow: true,\n})\nexport class RadioButtonGroup {\n  @Element() el!: HTMLElement;\n  private readonly componentType: string = 'radio-group';\n\n  /**\n   * The name of the radio group. This is used to identify the radio group when submitting a form.\n   */\n  @Prop() name: string = 'radio-group';\n  /**\n   * The list of options in the radio group.\n   * Each option has a label and a value and an optional description.\n   */\n  @Prop() options: { label: string; value: string; description?: string }[] = [];\n  /**\n   * The default selected value of the radio group.\n   */\n  @Prop({ attribute: 'default-selected-value' }) defaultSelectedValue: string = '';\n  /**\n   * The label of the radio group. This is displayed above the radio group.\n   * Label is optional. You can also use the slot 'label' to add a label.\n   */\n  @Prop() label?: string;\n  /**\n   * Whether the radio group is required. If true, the radio group must have a value when submitting a form.\n   * Default is false. If the radio group is required and the value is empty, an error message is displayed.\n   */\n  @Prop() required: boolean = false;\n  /**\n   * The property to make the radio group read-only. If true, the radio group cannot be edited.\n   */\n  @Prop() readOnly: boolean = false;\n  /**\n   * The selected value of the radio group.\n   */\n  @State() selectedValue!: string;\n  /**\n   * The error message state.\n   */\n  @State() error: string = '';\n  /**\n   * This event is fired when the selected value changes.\n   */\n  @Event() nylasFormRadioChanged!: EventEmitter<{\n    value: string;\n    name: string;\n    label?: string;\n  }>;\n\n  @Watch('defaultSelectedValue')\n  handleDefaultSelectedValueChange(newValue: string) {\n    this.selectedValue = newValue;\n  }\n\n  // Lifecycle methods\n  componentDidLoad() {\n    this.selectedValue = this.defaultSelectedValue;\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    if (this.required && !this.selectedValue) {\n      this.error = `${this.label} is required.`;\n      return;\n    }\n    if (this.error) {\n      event.preventDefault();\n    }\n  }\n\n  componentWillLoad() {\n    this.el.setAttribute('component-type', this.componentType);\n  }\n\n  handleChange(value: string) {\n    this.error = '';\n    this.selectedValue = value;\n    this.nylasFormRadioChanged.emit({\n      value,\n      name: this.name,\n      label: this.label,\n    });\n  }\n\n  render() {\n    return (\n      <div class=\"radio-group\">\n        <slot name=\"label\">\n          {this.label && (\n            <p class={{ error: !!this.error }}>\n              <span class=\"label\">{this.label}</span>\n              {this.required && <span class=\"required\">*</span>}\n            </p>\n          )}\n        </slot>\n        {this.options.map(option => (\n          <label>\n            <div class=\"radio-option\">\n              <input\n                type=\"radio\"\n                disabled={this.readOnly}\n                readOnly={this.readOnly}\n                title={this.readOnly ? 'read-only field' : undefined}\n                name={this.name}\n                value={option.value}\n                checked={this.selectedValue === option.value}\n                onChange={() => this.handleChange(option.value)}\n              />\n              <p>\n                <span class=\"title\">{option.label}</span>\n                <span class=\"description\">{option.description}</span>\n              </p>\n            </div>\n          </label>\n        ))}\n        {this.error && <span class=\"error help-text\">{this.error}</span>}\n      </div>\n    );\n  }\n}\n"],"mappings":"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"}