@nylas/web-elements 0.0.0-canary-20241008193213 → 0.0.0-canary-20241017103834

package/dist/components/nylas-participants-custom-availability2.js.map

@@ -1 +1 @@
-{"file":"nylas-participants-custom-availability2.js","mappings":"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","names":[],"sources":["src/components/scheduler-editor/nylas-participants-custom-availability/nylas-participants-custom-availability.scss?tag=nylas-participants-custom-availability&encapsulation=shadow","src/components/scheduler-editor/nylas-participants-custom-availability/nylas-participants-custom-availability.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n  display: block;\n  @include default-css-variables;\n  width: inherit;\n}\n\n.nylas-participants-custom-availability {\n  width: inherit;\n  display: flex;\n  flex-direction: column;\n  margin: 1rem;\n  border-radius: var(--nylas-border-radius-2x);\n  border: 1px solid var(--nylas-base-200);\n  .header {\n    padding: 1rem;\n    h3 {\n      margin: 0;\n      font-size: 16px;\n      font-weight: 600;\n      line-height: 20px;\n      color: var(--nylas-base-900);\n      text-align: left;\n    }\n    p {\n      margin: 0.25rem 0 0 0;\n      font-size: 0.875rem;\n      font-weight: 400;\n      line-height: 20px;\n      color: var(--nylas-base-600);\n      text-align: left;\n    }\n  }\n  .content {\n    .participant-container {\n      padding-top: 8px;\n      border-top: 1px solid var(--nylas-base-200);\n      .participant-title {\n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n        padding: 4px 16px 12px;\n        p {\n          margin: 0;\n        }\n        .participant-toggle {\n          display: flex;\n          gap: 24px;\n          align-items: center;\n          .chevron {\n            display: flex;\n            align-self: center;\n            cursor: pointer;\n\n            &:hover,\n            &:active {\n              color: var(--nylas-primary);\n            }\n\n            &.open {\n              transform: rotate(90deg);\n            }\n\n            &.closed {\n              transform: rotate(270deg);\n            }\n\n            &.disabled {\n              cursor: not-allowed;\n              color: var(--nylas-base-300);\n              &:hover {\n                color: var(--nylas-base-300);\n              }\n            }\n          }\n        }\n      }\n      nylas-availability-picker::part(nap) {\n        margin: 0;\n        border: none;\n      }\n    }\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Availability, Configuration, OpenHours, Participant } from '@nylas/core';\nimport { DEFAULT_OPEN_HOURS } from '@/common/constants';\n\n/**\n * The `nylas-participants-custom-availability` component is a form input for setting custom availability for participants.\n *\n * @part npca - The participants custom availability container\n * @part npca__header - The header of the participants custom availability\n * @part npca__content - The content of the participants custom availability\n * @part npca__participant-container - The participant container\n * @part npca__participant-title - The title of the participant\n * @part npca__participant-toggle--container - The toggle container for the participant\n * @part npca__toggle-label - The label of the toggle\n * @part npca_toggle-input - The input of the toggle\n * @part npca_toggle-slider - The slider of the toggle\n */\n@Component({\n  tag: 'nylas-participants-custom-availability',\n  styleUrl: 'nylas-participants-custom-availability.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasParticipantsCustomAvailability {\n  @Element() host!: HTMLNylasParticipantsCustomAvailabilityElement;\n  private participantFormRef!: HTMLFormElement;\n  /**\n   * The selected config\n   */\n  @Prop() selectedConfiguration?: Configuration;\n\n  /**\n   * The name of the participants custom availability.\n   */\n  @Prop() name: string = 'participant-custom-availability';\n\n  /**\n   * The participants selected in the add participants section.\n   */\n  @Prop() participants: Participant[] = this.selectedConfiguration?.participants || [];\n\n  /**\n   * This event is fired when the participants custom availability changes.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n\n  /**\n   * The state to store the custom availability setting for participants.\n   */\n  @State() selectedParticipants: {\n    [key: string]: {\n      setCustom: boolean;\n      isOpen: boolean;\n      openHours: OpenHours[];\n      name: string;\n      availability?: Availability;\n    };\n  } = this.setParticipants(this.participants);\n\n  // Watchers\n  @Watch('name')\n  elementNameChangedHandler(newValue: string) {\n    debug('nylas-participants-custom-availability', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('participants')\n  participantsChangedHandler(newValue: Participant[], oldValue: Participant[]) {\n    debug('nylas-participants-custom-availability', 'participantsChangedHandler', newValue, oldValue);\n    this.selectedParticipants = this.setParticipants(newValue);\n  }\n\n  @Watch('selectedConfiguration')\n  selectedConfigurationChangedHandler(newValue: Configuration, oldValue: Configuration) {\n    debug('nylas-participants-custom-availability', 'selectedConfigurationChangedHandler', newValue, oldValue);\n    if (newValue?.participants) {\n      this.selectedParticipants = this.setParticipants(newValue?.participants);\n    }\n  }\n\n  // Lifecycle Methods\n  connectedCallback() {\n    debug('nylas-participants-custom-availability', 'connectedCallback');\n  }\n\n  disconnectedCallback() {\n    debug('nylas-participants-custom-availability', 'disconnectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-participants-custom-availability', 'componentWillLoad');\n  }\n\n  componentDidLoad() {\n    debug('nylas-participants-custom-availability', 'componentDidLoad');\n    if (this.selectedConfiguration) {\n      this.selectedParticipants = this.setParticipants(this.selectedConfiguration?.participants);\n    } else {\n      this.selectedParticipants = this.setParticipants(this.participants);\n    }\n  }\n\n  // Event Handlers\n  @Listen('nylasFormSwitchToggled')\n  nylasFormSwitchToggledHandler(event: CustomEvent<{ checked: boolean; name: string; label: boolean }>) {\n    debug('nylas-participants-custom-availability', 'nylasFormSwitchToggledHandler', event.detail);\n    const openHours = this.selectedConfiguration?.participants.find(participant => participant.email === event.detail.name)?.availability?.open_hours || [];\n    this.selectedParticipants[event.detail.name]['isOpen'] = event.detail.checked;\n    this.selectedParticipants[event.detail.name]['setCustom'] = event.detail.checked;\n    this.selectedParticipants[event.detail.name]['openHours'] = event.detail.checked ? (openHours?.length > 0 ? openHours : DEFAULT_OPEN_HOURS) : [];\n    this.selectedParticipants = { ...this.selectedParticipants };\n    this.updateFormValue();\n  }\n\n  @Listen('valueChanged')\n  handleValueChanged(event: CustomEvent) {\n    debug('[nylas-editor-tabs]', 'handleValueChanged', event);\n    const { name, value } = event.detail;\n    if (!name.startsWith('participant-')) {\n      return;\n    }\n    // Validate the form\n    if (!this.participantFormRef.checkValidity()) {\n      this.internals.setValidity({ customError: true }, 'Please fix the overlapping time ranges.');\n      return;\n    } else {\n      this.internals.setValidity({});\n    }\n\n    const jsonValue = JSON.parse(value);\n\n    const key = name.split('-')[2];\n    if (!this.selectedParticipants[key]) return;\n    this.selectedParticipants[key]['openHours'] = jsonValue.openHours;\n    this.selectedParticipants = { ...this.selectedParticipants };\n\n    this.updateFormValue();\n  }\n\n  updateFormValue() {\n    const participantOpenHours = {};\n    const participants = this.selectedConfiguration?.participants || this.participants;\n    participants.forEach(participant => {\n      participantOpenHours[participant.email] = this.selectedParticipants[participant.email].openHours;\n    });\n    this.internals.setFormValue(JSON.stringify(participantOpenHours), this.name);\n    this.valueChanged.emit({ value: JSON.stringify(participantOpenHours), name: this.name });\n  }\n\n  setParticipants(participants: Participant[]) {\n    const selectedParticipants = {};\n    participants?.forEach(participant => {\n      selectedParticipants[participant.email] = {\n        isOpen: false,\n        setCustom: !!participant.availability?.open_hours ? true : false,\n        openHours: participant.availability?.open_hours || [],\n        name: participant.name || participant.email,\n        availability: participant.availability,\n      };\n    });\n    return selectedParticipants;\n  }\n  @RegisterComponent<NylasParticipantsCustomAvailability, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-participants-custom-availability',\n    stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),\n    eventToProps: {},\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host>\n        <div class=\"nylas-participants-custom-availability\" part=\"npca\">\n          <div class=\"header\" part=\"npca__header\">\n            <h3>Participant open hours</h3>\n            <p>If not set, Nylas uses the default open hours for this participant.</p>\n          </div>\n          <div class=\"content\" part=\"npca__content\">\n            <form ref={el => (this.participantFormRef = el as HTMLFormElement)}>\n              {Object.keys(this.selectedParticipants).map((key, index) => {\n                const participant = this.selectedParticipants[key];\n                if (!participant || !participant.name || !participant.availability) return;\n                return (\n                  <div class=\"participant-container\" part=\"npca__participant-container\" key={`participant-conatiner-${index}`}>\n                    <div class=\"participant-title\" part=\"npca__participant-title\">\n                      <p>{participant.name}'s open hours</p>\n                      <div class=\"participant-toggle\" part=\"npca__participant-toggle--container\">\n                        <toggle-switch\n                          exportparts=\"ts_label: npca__toggle-label, ts_input: npca_toggle-input, ts_slider: npca_toggle-slider\"\n                          name={key}\n                          checked={!!participant?.openHours && participant?.openHours.length > 0}\n                        />\n                        <span\n                          class={`chevron ${participant.isOpen ? 'open' : 'closed'} ${participant.setCustom ? '' : 'disabled'}`}\n                          onClick={() => {\n                            if (!participant.setCustom) return;\n                            this.selectedParticipants[key].isOpen = !participant.isOpen;\n                            this.selectedParticipants = { ...this.selectedParticipants };\n                          }}\n                        >\n                          <chevron-icon width=\"24\" height=\"24\" />\n                        </span>\n                      </div>\n                    </div>\n                    {participant.isOpen && (\n                      <nylas-availability-picker\n                        key={index}\n                        name={`participant-${index}-${key}`}\n                        openHours={participant.openHours}\n                        defaultTimezone={participant.openHours?.[0]?.timezone}\n                        hideHeader={true}\n                      />\n                    )}\n                  </div>\n                );\n              })}\n            </form>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"nylas-participants-custom-availability2.js","mappings":"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","names":[],"sources":["src/components/scheduler-editor/nylas-participants-custom-availability/nylas-participants-custom-availability.scss?tag=nylas-participants-custom-availability&encapsulation=shadow","src/components/scheduler-editor/nylas-participants-custom-availability/nylas-participants-custom-availability.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n  display: block;\n  @include default-css-variables;\n  width: inherit;\n}\n\n.nylas-participants-custom-availability {\n  width: inherit;\n  display: flex;\n  flex-direction: column;\n  margin: 1rem;\n  border-radius: var(--nylas-border-radius-2x);\n  border: 1px solid var(--nylas-base-200);\n  .header {\n    padding: 1rem;\n    h3 {\n      margin: 0;\n      font-size: 16px;\n      font-weight: 600;\n      line-height: 20px;\n      color: var(--nylas-base-900);\n      text-align: left;\n    }\n    p {\n      margin: 0.25rem 0 0 0;\n      font-size: 0.875rem;\n      font-weight: 400;\n      line-height: 20px;\n      color: var(--nylas-base-600);\n      text-align: left;\n    }\n  }\n  .content {\n    .participant-container {\n      padding-top: 8px;\n      border-top: 1px solid var(--nylas-base-200);\n      .participant-title {\n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n        padding: 4px 16px 12px;\n        p {\n          margin: 0;\n        }\n        .participant-toggle {\n          display: flex;\n          gap: 24px;\n          align-items: center;\n          .chevron {\n            display: flex;\n            align-self: center;\n            cursor: pointer;\n\n            &:hover,\n            &:active {\n              color: var(--nylas-primary);\n            }\n\n            &.open {\n              transform: rotate(90deg);\n            }\n\n            &.closed {\n              transform: rotate(270deg);\n            }\n\n            &.disabled {\n              cursor: not-allowed;\n              color: var(--nylas-base-300);\n              &:hover {\n                color: var(--nylas-base-300);\n              }\n            }\n          }\n        }\n      }\n      nylas-availability-picker::part(nap) {\n        margin: 0;\n        border: none;\n      }\n    }\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Availability, Configuration, OpenHours, Participant } from '@nylas/core';\nimport { DEFAULT_OPEN_HOURS } from '@/common/constants';\n\n/**\n * The `nylas-participants-custom-availability` component is a form input for setting custom availability for participants.\n *\n * @part npca - The participants custom availability container\n * @part npca__header - The header of the participants custom availability\n * @part npca__content - The content of the participants custom availability\n * @part npca__participant-container - The participant container\n * @part npca__participant-title - The title of the participant\n * @part npca__participant-toggle--container - The toggle container for the participant\n * @part npca__toggle-label - The label of the toggle\n * @part npca_toggle-input - The input of the toggle\n * @part npca_toggle-slider - The slider of the toggle\n */\n@Component({\n  tag: 'nylas-participants-custom-availability',\n  styleUrl: 'nylas-participants-custom-availability.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasParticipantsCustomAvailability {\n  @Element() host!: HTMLNylasParticipantsCustomAvailabilityElement;\n  private participantFormRef!: HTMLFormElement;\n  /**\n   * @standalone\n   * The selected config\n   */\n  @Prop() selectedConfiguration?: Configuration;\n\n  /**\n   * @standalone\n   * The name of the participants custom availability.\n   */\n  @Prop() name: string = 'participant-custom-availability';\n\n  /**\n   * @standalone\n   * The participants selected in the add participants section.\n   */\n  @Prop() participants: Participant[] = this.selectedConfiguration?.participants || [];\n\n  /**\n   * This event is fired when the participants custom availability changes.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n\n  /**\n   * The state to store the custom availability setting for participants.\n   */\n  @State() selectedParticipants: {\n    [key: string]: {\n      setCustom: boolean;\n      isOpen: boolean;\n      openHours: OpenHours[];\n      name: string;\n      availability?: Availability;\n      timezone?: string;\n    };\n  } = this.setParticipants(this.participants);\n\n  // Watchers\n  @Watch('name')\n  elementNameChangedHandler(newValue: string) {\n    debug('nylas-participants-custom-availability', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('participants')\n  participantsChangedHandler(newValue: Participant[], oldValue: Participant[]) {\n    debug('nylas-participants-custom-availability', 'participantsChangedHandler', newValue, oldValue);\n    this.selectedParticipants = this.setParticipants(newValue);\n  }\n\n  @Watch('selectedConfiguration')\n  selectedConfigurationChangedHandler(newValue: Configuration, oldValue: Configuration) {\n    debug('nylas-participants-custom-availability', 'selectedConfigurationChangedHandler', newValue, oldValue);\n    if (newValue?.participants) {\n      this.selectedParticipants = this.setParticipants(newValue?.participants);\n    }\n  }\n\n  // Lifecycle Methods\n  connectedCallback() {\n    debug('nylas-participants-custom-availability', 'connectedCallback');\n  }\n\n  disconnectedCallback() {\n    debug('nylas-participants-custom-availability', 'disconnectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-participants-custom-availability', 'componentWillLoad');\n  }\n\n  componentDidLoad() {\n    debug('nylas-participants-custom-availability', 'componentDidLoad');\n    if (this.selectedConfiguration) {\n      this.selectedParticipants = this.setParticipants(this.selectedConfiguration?.participants);\n    } else {\n      this.selectedParticipants = this.setParticipants(this.participants);\n    }\n  }\n\n  // Event Handlers\n  @Listen('nylasFormSwitchToggled')\n  nylasFormSwitchToggledHandler(event: CustomEvent<{ checked: boolean; name: string; label: boolean }>) {\n    debug('nylas-participants-custom-availability', 'nylasFormSwitchToggledHandler', event.detail);\n    const openHours = this.selectedConfiguration?.participants.find(participant => participant.email === event.detail.name)?.availability?.open_hours || [];\n    this.selectedParticipants[event.detail.name]['isOpen'] = event.detail.checked;\n    this.selectedParticipants[event.detail.name]['setCustom'] = event.detail.checked;\n    this.selectedParticipants[event.detail.name]['openHours'] = event.detail.checked ? (openHours?.length > 0 ? openHours : DEFAULT_OPEN_HOURS) : [];\n    this.selectedParticipants = { ...this.selectedParticipants };\n    this.updateFormValue();\n  }\n\n  @Listen('valueChanged')\n  handleValueChanged(event: CustomEvent) {\n    debug('[nylas-editor-tabs]', 'handleValueChanged', event);\n    const { name, value } = event.detail;\n    if (!name.startsWith('participant-')) {\n      return;\n    }\n    // Validate the form\n    if (!this.participantFormRef.checkValidity()) {\n      this.internals.setValidity({ customError: true }, 'Please fix the overlapping time ranges.');\n      return;\n    } else {\n      this.internals.setValidity({});\n    }\n\n    const jsonValue = JSON.parse(value);\n\n    const key = name.split('-')[2];\n    if (!this.selectedParticipants[key]) return;\n    this.selectedParticipants[key]['openHours'] = jsonValue.openHours;\n    this.selectedParticipants = { ...this.selectedParticipants };\n\n    this.updateFormValue();\n  }\n\n  updateFormValue() {\n    const participantOpenHours = {};\n    const participants = this.selectedConfiguration?.participants || this.participants;\n    participants.forEach(participant => {\n      participantOpenHours[participant.email] = this.selectedParticipants[participant.email].openHours;\n    });\n    this.internals.setFormValue(JSON.stringify(participantOpenHours), this.name);\n    this.valueChanged.emit({ value: JSON.stringify(participantOpenHours), name: this.name });\n  }\n\n  setParticipants(participants: Participant[]) {\n    const selectedParticipants = {};\n    participants?.forEach(participant => {\n      selectedParticipants[participant.email] = {\n        isOpen: false,\n        setCustom: !!participant.availability?.open_hours ? true : false,\n        openHours: participant.availability?.open_hours || [],\n        name: participant.name || participant.email,\n        availability: participant.availability,\n        timezone: participant.timezone,\n      };\n    });\n    return selectedParticipants;\n  }\n  @RegisterComponent<NylasParticipantsCustomAvailability, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-participants-custom-availability',\n    stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),\n    eventToProps: {},\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host>\n        <div class=\"nylas-participants-custom-availability\" part=\"npca\">\n          <div class=\"header\" part=\"npca__header\">\n            <h3>Participant open hours</h3>\n            <p>If not set, Nylas uses the default open hours for this participant.</p>\n          </div>\n          <div class=\"content\" part=\"npca__content\">\n            <form ref={el => (this.participantFormRef = el as HTMLFormElement)}>\n              {Object.keys(this.selectedParticipants).map((key, index) => {\n                const participant = this.selectedParticipants[key];\n                if (!participant || !participant.name || !participant.availability) return;\n                return (\n                  <div class=\"participant-container\" part=\"npca__participant-container\" key={`participant-conatiner-${index}`}>\n                    <div class=\"participant-title\" part=\"npca__participant-title\">\n                      <p>{participant.name}'s open hours</p>\n                      <div class=\"participant-toggle\" part=\"npca__participant-toggle--container\">\n                        <toggle-switch\n                          exportparts=\"ts_label: npca__toggle-label, ts_input: npca_toggle-input, ts_slider: npca_toggle-slider\"\n                          name={key}\n                          checked={!!participant?.openHours && participant?.openHours.length > 0}\n                        />\n                        <span\n                          class={`chevron ${participant.isOpen ? 'open' : 'closed'} ${participant.setCustom ? '' : 'disabled'}`}\n                          onClick={() => {\n                            if (!participant.setCustom) return;\n                            this.selectedParticipants[key].isOpen = !participant.isOpen;\n                            this.selectedParticipants = { ...this.selectedParticipants };\n                          }}\n                        >\n                          <chevron-icon width=\"24\" height=\"24\" />\n                        </span>\n                      </div>\n                    </div>\n                    {participant.isOpen && (\n                      <nylas-availability-picker\n                        key={index}\n                        name={`participant-${index}-${key}`}\n                        openHours={participant.openHours}\n                        defaultTimezone={participant.timezone}\n                        hideHeader={true}\n                      />\n                    )}\n                  </div>\n                );\n              })}\n            </form>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/nylas-provider.js

@@ -333,7 +333,7 @@ const NylasProvider$1 = proxyCustomElement(class NylasProvider extends HTMLEleme
         return this.baseProvider?.getStore('schedulerConfig');
     }
     render() {
-        return (h(Host, { key: 'e4c9c9acb330cbbc466495c3153d54318b28d943' }, h("slot", { key: '7a5b931d0ca83c251074eba2aeb4f243f131ae05' })));
+        return (h(Host, { key: 'a07ace4fe61c7f7ee20b723d1858f7ebac56ff95' }, h("slot", { key: '7c10f2b5cf18450c28617b3f35215b720f1d8bd2' })));
     }
     get host() { return this; }
     static get style() { return NylasProviderStyle0; }

package/dist/components/nylas-reminder-emails.js

@@ -1,305 +1,4 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { R as RegisterComponent } from './register-component.js';
-import { a as debug } from './utils.js';
-import { d as defineCustomElement$f } from './button-component2.js';
-import { d as defineCustomElement$e } from './chevron.js';
-import { d as defineCustomElement$d } from './clock.js';
-import { d as defineCustomElement$c } from './edit.js';
-import { d as defineCustomElement$b } from './info.js';
-import { d as defineCustomElement$a } from './input-dropdown2.js';
-import { d as defineCustomElement$9 } from './loading.js';
-import { d as defineCustomElement$8 } from './nylas-reminder-time2.js';
-import { d as defineCustomElement$7 } from './person-clipboard.js';
-import { d as defineCustomElement$6 } from './plus.js';
-import { d as defineCustomElement$5 } from './search.js';
-import { d as defineCustomElement$4 } from './select-dropdown2.js';
-import { d as defineCustomElement$3 } from './toolitp-component.js';
-import { d as defineCustomElement$2 } from './trash.js';
-
-const nylasReminderEmailsCss = ":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:inherit}.cards-container{margin-bottom:4rem}.cards-container .nylas-reminder-email{width:inherit;display:flex;flex-direction:column;margin:1rem;border-radius:var(--nylas-border-radius-2x);border:1px solid var(--nylas-base-200);text-align:left}.cards-container .nylas-reminder-email .reminder-open-close-toggle{display:flex;gap:16px}.cards-container .nylas-reminder-email .reminder-open-close-toggle .chevron{display:flex;align-self:center;cursor:pointer}.cards-container .nylas-reminder-email .reminder-open-close-toggle .chevron:hover,.cards-container .nylas-reminder-email .reminder-open-close-toggle .chevron:active{color:var(--nylas-primary)}.cards-container .nylas-reminder-email .reminder-open-close-toggle .chevron.open{transform:rotate(90deg)}.cards-container .nylas-reminder-email .reminder-open-close-toggle .chevron.closed{transform:rotate(270deg)}.cards-container .nylas-reminder-email .reminder-open-close-toggle .chevron.disabled{cursor:not-allowed;color:var(--nylas-base-300)}.cards-container .nylas-reminder-email .reminder-open-close-toggle .chevron.disabled:hover{color:var(--nylas-base-300)}.cards-container .nylas-reminder-email .header{padding:1rem;display:grid;grid-template-columns:1fr auto;border-bottom:1px solid var(--nylas-base-200)}.cards-container .nylas-reminder-email .header h3{border-radius:var(--nylas-border-radius-2x);margin:0;font-size:1rem;font-weight:600;line-height:20px;color:var(--nylas-base-900);text-align:left}.cards-container .nylas-reminder-email .header p{margin:0.25rem 0 0 0;font-size:0.875rem;font-weight:400;line-height:20px;color:var(--nylas-base-600);text-align:left}.cards-container .nylas-reminder-email .header .confirmation-email-toggle{display:flex;gap:24px;align-items:center}.cards-container .nylas-reminder-email .header .confirmation-email-toggle .chevron{display:flex;align-self:center;cursor:pointer}.cards-container .nylas-reminder-email .header .confirmation-email-toggle .chevron:hover,.cards-container .nylas-reminder-email .header .confirmation-email-toggle .chevron:active{color:var(--nylas-primary)}.cards-container .nylas-reminder-email .header .confirmation-email-toggle .chevron.open{transform:rotate(90deg)}.cards-container .nylas-reminder-email .header .confirmation-email-toggle .chevron.closed{transform:rotate(270deg)}.cards-container .nylas-reminder-email .header .confirmation-email-toggle .chevron.disabled{cursor:not-allowed;color:var(--nylas-base-300)}.cards-container .nylas-reminder-email .header .confirmation-email-toggle .chevron.disabled:hover{color:var(--nylas-base-300)}.cards-container .nylas-reminder-email .nylas-reminder-email__body{display:grid;grid-template-columns:1fr auto;background-color:var(--nylas-base-25);border-radius:var(--nylas-border-radius-2x)}@media screen and (max-width: 768px){.cards-container .nylas-reminder-email .nylas-reminder-email__body{grid-template-columns:1fr}}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section{padding:1rem;display:flex;flex-direction:column;gap:1rem;color:var(--nylas-base-800)}@media screen and (max-width: 768px){.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section{border:none}}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section .nylas-reminder-email__row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:1rem}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section .nylas-reminder-email__row.full-width-col{grid-template-columns:1fr}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section .nylas-reminder-email__row label{display:flex;align-items:center}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section .nylas-reminder-email__row label span.required{color:var(--nylas-error, #cc4841)}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section .nylas-reminder-email__row label span.label-icon{margin-left:4px}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section .nylas-reminder-email__row label span.label-icon tooltip-component{display:flex}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section .nylas-reminder-email__row p{margin:0.25rem 0 0 0;font-size:1rem;font-weight:500;line-height:24px;color:var(--nylas-base-900)}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section .nylas-reminder-email__row .company-logo-container{display:flex;gap:32px;width:100%}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section .nylas-reminder-email__row .company-logo-container .input-container{display:flex;flex-direction:column;flex:1}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section .nylas-reminder-email__row .company-logo-container .company-logo{display:flex;justify-content:center;align-items:center;width:200px;height:100px;border:var(--nylas-base-200) solid 1px;border-radius:var(--nylas-border-radius-2x);overflow:hidden;padding:10px}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section .nylas-reminder-email__row .company-logo-container .company-logo img{max-height:100%;max-width:100%;object-fit:contain;object-position:center}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section .nylas-reminder-email__row span.selected-value{font-weight:500}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section .subsection{display:flex;flex-direction:column;gap:1rem}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section .subsection h3{margin:0;font-size:1rem;font-weight:600;line-height:20px;color:var(--nylas-base-900);text-align:left}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section .subsection .input-container{display:flex;flex-direction:column;gap:0.25rem}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__section .subsection .input-container textarea{padding:12px 16px;border-width:1;resize:vertical;border-radius:8px;font-family:var(--nylas-font-family);font-size:16px;line-height:24px;border:1px solid var(--nylas-base-200)}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__preview{width:208px;background:var(--nylas-base-25);border-bottom-right-radius:var(--nylas-border-radius-2x)}@media screen and (max-width: 768px){.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__preview{width:inherit;border-bottom-left-radius:var(--nylas-border-radius-2x)}}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__preview h4{font-size:14px;line-height:24px;color:var(--nylas-base-600);font-family:var(--nylas-font-family);font-weight:500;text-align:center;margin:0.75rem 0}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__preview .preview-container{padding:0 2rem 1rem}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__preview .preview-container .slot{background-color:transparent;border-top:1px solid var(--nylas-base-300)}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__preview .preview-container .slot.active{background-color:var(--nylas-base-100)}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__preview .preview-container .slot:last-of-type{border-bottom:1px solid var(--nylas-base-300)}.cards-container .nylas-reminder-email .nylas-reminder-email__body .nylas-reminder-email__preview .preview-container .event-slot{background-color:var(--nylas-base-600);border-top:1px solid var(--nylas-base-300)}.cards-container .nylas-reminder-email .nylas-reminder-email__body span.error-message{color:var(--nylas-error)}.cards-container .nylas-reminder-email .nylas-reminder-email__body span.help-text{margin:0.25rem 0 0 0;font-size:0.875rem;font-weight:400;line-height:20px;color:var(--nylas-base-600);text-align:left}.cards-container .nylas-reminder-email .nylas-reminder-email__summary{padding:0.75rem 1rem;display:grid;grid-template-columns:auto 1fr;column-gap:1rem}.cards-container .nylas-reminder-email .nylas-reminder-email__summary p{margin:0;display:flex;align-items:center;column-gap:4px;font-size:0.875rem;font-weight:400;line-height:21px;color:var(--nylas-base-600);text-align:left}.cards-container .nylas-reminder-email .nylas-reminder-email__summary p span.summary-icon{display:flex;justify-content:center;min-width:20px}sp-divider{background-color:var(--nylas-base-200);height:1px;margin:0.25rem 0}button-component.create-reminder button{margin:1rem;width:calc(100% - 2rem)}button-component.delete-btn button{color:var(--nylas-error) !important}";
-const NylasReminderEmailsStyle0 = nylasReminderEmailsCss;
-
-var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasReminderEmails$1 = proxyCustomElement(class NylasReminderEmails extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.valueChanged = createEvent(this, "valueChanged", 7);
-        this.internals = this.attachInternals();
-        this.selectedConfiguration = undefined;
-        this.name = 'reminder-overrides';
-        this.reminders = this.selectedConfiguration?.event_booking?.reminders ?? [];
-        this.reminderErrors = {};
-        this.participants = this.selectedConfiguration?.participants ?? [];
-    }
-    connectedCallback() {
-        debug('nylas-reminder-emails', 'connectedCallback');
-    }
-    disconnectedCallback() {
-        debug('nylas-reminder-emails', 'disconnectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-reminder-emails', 'componentWillLoad');
-        this.host.setAttribute('name', this.name);
-    }
-    componentDidLoad() {
-        debug('nylas-reminder-emails', 'componentDidLoad');
-        if (this.selectedConfiguration) {
-            this.selectedConfigurationChangedHandler(this.selectedConfiguration);
-        }
-        else {
-            this.updateRemindersFormValue();
-        }
-    }
-    componentWillUpdate() {
-        debug('nylas-reminder-emails', 'componentWillUpdate');
-    }
-    componentDidUpdate() {
-        debug('nylas-reminder-emails', 'componentDidUpdate');
-    }
-    componentWillRender() {
-        debug('nylas-reminder-emails', 'componentWillRender');
-    }
-    componentDidRender() {
-        debug('nylas-reminder-emails', 'componentDidRender');
-    }
-    elementNameChangedHandler(newValue) {
-        debug('nylas-reminder-emails', 'elementNameChangedHandler', newValue);
-        this.host.setAttribute('name', newValue);
-    }
-    selectedConfigurationChangedHandler(newVal) {
-        debug('nylas-reminder-emails', 'selectedConfigurationChangedHandler', newVal);
-        this.reminders = newVal?.event_booking?.reminders ?? [];
-        this.participants = newVal?.participants ?? [];
-        this.updateRemindersFormValue();
-    }
-    handleValueChanged(event) {
-        debug('nylas-reminder-emails', 'handleValueChanged', event);
-        const { name, value } = event.detail;
-        if (name.startsWith('reminder-time-')) {
-            const [_, reminderIndex] = name.split(/(\d+)/);
-            const updatedReminders = [...this.reminders];
-            updatedReminders[reminderIndex].minutes_before_event = parseInt(value);
-            this.reminders = [...updatedReminders];
-            this.updateRemindersFormValue();
-        }
-    }
-    handleNylasFormDropdownChanged(event) {
-        debug('nylas-reminder-emails', 'handleNylasFormDropdownChanged', event);
-        const { name, value } = event.detail;
-        if (!name.startsWith('recipient-')) {
-            return;
-        }
-        const [_, reminderIndex] = name.split(/(\d+)/);
-        const updatedReminders = [...this.reminders];
-        updatedReminders[reminderIndex].recipient = value;
-        this.reminders = [...updatedReminders];
-        this.updateRemindersFormValue();
-    }
-    addReminder() {
-        debug('nylas-reminder-emails', 'addReminder');
-        this.reminders = [
-            ...this.reminders,
-            {
-                type: 'email',
-                minutes_before_event: 30,
-                editing: true,
-                recipient: 'all',
-            },
-        ];
-        this.updateRemindersFormValue();
-    }
-    deleteReminder(index) {
-        this.reminders = this.reminders.filter((_, i) => i !== index).map(p => ({ ...p }));
-        this.updateRemindersFormValue();
-    }
-    updateRemindersFormValue() {
-        debug('nylas-reminder-emails', 'updateRemindersFormValue');
-        const eventReminders = this.reminders.map(reminder => {
-            const rem = { ...reminder };
-            delete rem.editing;
-            return rem;
-        });
-        this.internals.setFormValue(JSON.stringify(eventReminders), 'reminder-overrides');
-        this.valueChanged.emit({ value: JSON.stringify(eventReminders), name: 'reminder-overrides' });
-    }
-    formatReminderTime(reminderTime) {
-        switch (true) {
-            case reminderTime > 24 * 60:
-                return `${reminderTime / 60 / 24} days`;
-            case reminderTime === 24 * 60:
-                return '1 day';
-            case reminderTime > 90 || reminderTime === 60:
-                return `${reminderTime / 60} hours`;
-            default:
-                return `${reminderTime} minute${reminderTime > 1 ? 's' : ''} `;
-        }
-    }
-    render() {
-        const organizerName = this.participants.find(p => p.is_organizer)?.name;
-        const recipientOptions = [
-            {
-                label: 'All host & guests',
-                value: 'all',
-            },
-            {
-                label: 'All event guests',
-                value: 'guest',
-            },
-            {
-                label: 'Only event host',
-                value: 'host',
-            },
-        ];
-        return (h(Host, { key: 'f1982a2fe4c71ae1345b184767d015ba34336f1f' }, h("div", { key: '02f612577517fcc9ca50e5278c8e4cf2492aa29e', class: "cards-container" }, this.reminders.map((reminder, index) => {
-            return (h("div", { class: "nylas-reminder-email", part: "nre" }, h("div", { class: "header", part: "nre__header" }, h("div", null, h("h3", null, "Upcoming meeting", organizerName ? ` with ${organizerName} ` : ''), h("p", null, "Reminder before event")), !reminder.editing ? (h("button-component", { variant: 'basic', key: `edit-${index} `, clickHandler: event => {
-                    event.preventDefault();
-                    reminder.editing = true;
-                    this.reminders = [...this.reminders];
-                } }, h("edit-icon", { width: "16", height: "16" }), "Edit")) : (h("div", { class: "reminder-open-close-toggle" }, h("button-component", { variant: 'basic', class: "delete-btn", tooltip: "Delete reminder", key: `delete -${index} `, clickHandler: event => {
-                    event.preventDefault();
-                    this.deleteReminder(index);
-                } }, h("trash-icon", { width: "16", height: "16" })), h("span", { class: `chevron ${reminder.editing ? 'open' : 'closed'}`, onClick: () => {
-                    reminder.editing = !reminder.editing;
-                    this.reminders = [...this.reminders];
-                } }, h("chevron-icon", { width: "24", height: "24" }))))), reminder.editing ? (h("div", { class: "nylas-reminder-email__body", part: "nre__body" }, h("div", { class: "nylas-reminder-email__section" }, h("div", { class: "nylas-reminder-email__row" }, h("label", null, "Email recipients"), h("select-dropdown", { name: `recipient-${index}`, options: recipientOptions, defaultSelectedOption: recipientOptions.find(i => i.value === reminder.recipient) ?? recipientOptions[0], withSearch: false })), h("div", { class: "nylas-reminder-email__row" }, h("label", null, "Send confirmation email when", h("span", { class: "label-icon" }, h("tooltip-component", null, h("info-icon", { slot: "tooltip-icon" }), h("span", { slot: "tooltip-content" }, "The recipients will receive a reminder email at the specified time before the event.")))), h("nylas-reminder-time", { name: `reminder-time-${index}`, eventReminderTimeMinutes: reminder.minutes_before_event, exportparts: "nrt, nrt__input_dropdown: nre__reminder-input_dropdown,\n                          nrt__input_dropdown-input: nre__reminder-input_dropdown-input,\n                          nrt__input_dropdown-content: nre__reminder-input_dropdown-content,\n                          " }))))) : (h("div", { class: "nylas-reminder-email__summary", part: "nre__summary" }, h("p", null, h("span", { class: "summary-icon" }, h("person-clipboard-icon", null)), recipientOptions.find(i => i.value === reminder.recipient)?.label), h("p", null, h("span", { class: "summary-icon" }, h("clock-icon", null)), this.formatReminderTime(reminder.minutes_before_event), " before the event")))));
-        })), h("button-component", { key: '5f0c78b6e6caca06bb8b3c8346480f3cde3ee8f9', class: "create-reminder", variant: 'basic', clickHandler: event => {
-                event.preventDefault();
-                this.addReminder();
-            } }, h("plus-icon", { key: 'b72802d4c496bcdad8f26986b43a8d70828fae68', width: "16", height: "16" }), "New reminder")));
-    }
-    static get formAssociated() { return true; }
-    get host() { return this; }
-    static get watchers() { return {
-        "name": ["elementNameChangedHandler"],
-        "selectedConfiguration": ["selectedConfigurationChangedHandler"]
-    }; }
-    static get style() { return NylasReminderEmailsStyle0; }
-}, [65, "nylas-reminder-emails", {
-        "selectedConfiguration": [16],
-        "name": [1],
-        "reminders": [32],
-        "reminderErrors": [32],
-        "participants": [32]
-    }, [[0, "valueChanged", "handleValueChanged"], [0, "nylasFormDropdownChanged", "handleNylasFormDropdownChanged"]], {
-        "name": ["elementNameChangedHandler"],
-        "selectedConfiguration": ["selectedConfigurationChangedHandler"]
-    }]);
-__decorate([
-    RegisterComponent({
-        name: 'nylas-reminder-emails',
-        stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),
-        eventToProps: {
-            valueChanged: async (event, _nylasSchedulerConfigConnector) => {
-                const { valueChanged } = event.detail;
-                if (valueChanged) {
-                    valueChanged(event);
-                }
-            },
-        },
-        fireRegisterEvent: true,
-    }),
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", []),
-    __metadata("design:returntype", void 0)
-], NylasReminderEmails$1.prototype, "render", null);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["nylas-reminder-emails", "button-component", "chevron-icon", "clock-icon", "edit-icon", "info-icon", "input-dropdown", "loading-icon", "nylas-reminder-time", "person-clipboard-icon", "plus-icon", "search-icon", "select-dropdown", "tooltip-component", "trash-icon"];
-    components.forEach(tagName => { switch (tagName) {
-        case "nylas-reminder-emails":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, NylasReminderEmails$1);
-            }
-            break;
-        case "button-component":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$f();
-            }
-            break;
-        case "chevron-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$e();
-            }
-            break;
-        case "clock-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$d();
-            }
-            break;
-        case "edit-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$c();
-            }
-            break;
-        case "info-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$b();
-            }
-            break;
-        case "input-dropdown":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$a();
-            }
-            break;
-        case "loading-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$9();
-            }
-            break;
-        case "nylas-reminder-time":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$8();
-            }
-            break;
-        case "person-clipboard-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$7();
-            }
-            break;
-        case "plus-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "search-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "select-dropdown":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "tooltip-component":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "trash-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
+import { N as NylasReminderEmails$1, d as defineCustomElement$1 } from './nylas-reminder-emails2.js';
 
 const NylasReminderEmails = NylasReminderEmails$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/nylas-reminder-emails.js.map

@@ -1 +1 @@
-{"file":"nylas-reminder-emails.js","mappings":"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","names":["NylasReminderEmails"],"sources":["src/components/scheduler-editor/nylas-reminder-emails/nylas-reminder-emails.scss?tag=nylas-reminder-emails&encapsulation=shadow","src/components/scheduler-editor/nylas-reminder-emails/nylas-reminder-emails.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n  display: block;\n  @include default-css-variables;\n  width: inherit;\n}\n\n.cards-container {\n  margin-bottom: 4rem;\n\n  .nylas-reminder-email {\n    width: inherit;\n    display: flex;\n    flex-direction: column;\n    margin: 1rem;\n    border-radius: var(--nylas-border-radius-2x);\n    border: 1px solid var(--nylas-base-200);\n    text-align: left;\n\n    .reminder-open-close-toggle {\n      display: flex;\n      gap: 16px;\n\n      .chevron {\n        display: flex;\n        align-self: center;\n        cursor: pointer;\n\n        &:hover,\n        &:active {\n          color: var(--nylas-primary);\n        }\n\n        &.open {\n          transform: rotate(90deg);\n        }\n\n        &.closed {\n          transform: rotate(270deg);\n        }\n\n        &.disabled {\n          cursor: not-allowed;\n          color: var(--nylas-base-300);\n\n          &:hover {\n            color: var(--nylas-base-300);\n          }\n        }\n      }\n    }\n\n    .header {\n      padding: 1rem;\n      display: grid;\n      grid-template-columns: 1fr auto;\n      border-bottom: 1px solid var(--nylas-base-200);\n\n      h3 {\n        border-radius: var(--nylas-border-radius-2x);\n        margin: 0;\n        font-size: 1rem;\n        font-weight: 600;\n        line-height: 20px;\n        color: var(--nylas-base-900);\n        text-align: left;\n      }\n\n      p {\n        margin: 0.25rem 0 0 0;\n        font-size: 0.875rem;\n        font-weight: 400;\n        line-height: 20px;\n        color: var(--nylas-base-600);\n        text-align: left;\n      }\n\n      .confirmation-email-toggle {\n        display: flex;\n        gap: 24px;\n        align-items: center;\n\n        .chevron {\n          display: flex;\n          align-self: center;\n          cursor: pointer;\n\n          &:hover,\n          &:active {\n            color: var(--nylas-primary);\n          }\n\n          &.open {\n            transform: rotate(90deg);\n          }\n\n          &.closed {\n            transform: rotate(270deg);\n          }\n\n          &.disabled {\n            cursor: not-allowed;\n            color: var(--nylas-base-300);\n\n            &:hover {\n              color: var(--nylas-base-300);\n            }\n          }\n        }\n      }\n    }\n\n    .nylas-reminder-email__body {\n      display: grid;\n      grid-template-columns: 1fr auto;\n      background-color: var(--nylas-base-25);\n      border-radius: var(--nylas-border-radius-2x);\n\n      @media #{$mobile} {\n        grid-template-columns: 1fr;\n      }\n\n      .nylas-reminder-email__section {\n        padding: 1rem;\n        display: flex;\n        flex-direction: column;\n        gap: 1rem;\n        color: var(--nylas-base-800);\n\n        @media #{$mobile} {\n          border: none;\n        }\n\n        .nylas-reminder-email__row {\n          display: grid;\n          grid-template-columns: 1fr auto;\n          align-items: center;\n          gap: 1rem;\n\n          &.full-width-col {\n            grid-template-columns: 1fr;\n          }\n\n          label {\n            display: flex;\n            align-items: center;\n\n            span.required {\n              color: var(--nylas-error, #cc4841);\n            }\n\n            span.label-icon {\n              margin-left: 4px;\n\n              tooltip-component {\n                display: flex;\n              }\n            }\n          }\n\n          p {\n            margin: 0.25rem 0 0 0;\n            font-size: 1rem;\n            font-weight: 500;\n            line-height: 24px;\n            color: var(--nylas-base-900);\n          }\n\n          .company-logo-container {\n            display: flex;\n            gap: 32px;\n            width: 100%;\n\n            .input-container {\n              display: flex;\n              flex-direction: column;\n              flex: 1;\n            }\n\n            .company-logo {\n              display: flex;\n              justify-content: center;\n              align-items: center;\n              width: 200px;\n              height: 100px;\n              border: var(--nylas-base-200) solid 1px;\n              border-radius: var(--nylas-border-radius-2x);\n              overflow: hidden;\n              padding: 10px;\n            }\n\n            .company-logo img {\n              max-height: 100%;\n              max-width: 100%;\n              object-fit: contain;\n              object-position: center;\n            }\n          }\n\n          span.selected-value {\n            font-weight: 500;\n          }\n        }\n\n        .subsection {\n          display: flex;\n          flex-direction: column;\n          gap: 1rem;\n\n          h3 {\n            margin: 0;\n            font-size: 1rem;\n            font-weight: 600;\n            line-height: 20px;\n            color: var(--nylas-base-900);\n            text-align: left;\n          }\n\n          .input-container {\n            display: flex;\n            flex-direction: column;\n            gap: 0.25rem;\n\n            textarea {\n              padding: 12px 16px;\n              border-width: 1;\n              resize: vertical;\n              border-radius: 8px;\n              font-family: var(--nylas-font-family);\n              font-size: 16px;\n              line-height: 24px;\n              border: 1px solid var(--nylas-base-200);\n            }\n          }\n        }\n      }\n\n      .nylas-reminder-email__preview {\n        width: 208px;\n        background: var(--nylas-base-25);\n        border-bottom-right-radius: var(--nylas-border-radius-2x);\n\n        @media #{$mobile} {\n          width: inherit;\n          border-bottom-left-radius: var(--nylas-border-radius-2x);\n        }\n\n        h4 {\n          font-size: 14px;\n          line-height: 24px;\n          color: var(--nylas-base-600);\n          font-family: var(--nylas-font-family);\n          font-weight: 500;\n          text-align: center;\n          margin: 0.75rem 0;\n        }\n\n        .preview-container {\n          padding: 0 2rem 1rem;\n\n          .slot {\n            background-color: transparent;\n            border-top: 1px solid var(--nylas-base-300);\n\n            &.active {\n              background-color: var(--nylas-base-100);\n            }\n\n            &:last-of-type {\n              border-bottom: 1px solid var(--nylas-base-300);\n            }\n          }\n\n          .event-slot {\n            background-color: var(--nylas-base-600);\n            border-top: 1px solid var(--nylas-base-300);\n          }\n        }\n      }\n\n      span.error-message {\n        color: var(--nylas-error);\n      }\n\n      span.help-text {\n        margin: 0.25rem 0 0 0;\n        font-size: 0.875rem;\n        font-weight: 400;\n        line-height: 20px;\n        color: var(--nylas-base-600);\n        text-align: left;\n      }\n    }\n\n    .nylas-reminder-email__summary {\n      padding: 0.75rem 1rem;\n      display: grid;\n      grid-template-columns: auto 1fr;\n      column-gap: 1rem;\n\n      p {\n        margin: 0;\n        display: flex;\n        align-items: center;\n        column-gap: 4px;\n        font-size: 0.875rem;\n        font-weight: 400;\n        line-height: 21px;\n        color: var(--nylas-base-600);\n        text-align: left;\n\n        span.summary-icon {\n          display: flex;\n          justify-content: center;\n          min-width: 20px;\n        }\n      }\n    }\n  }\n}\n\nsp-divider {\n  background-color: var(--nylas-base-200);\n  height: 1px;\n  margin: 0.25rem 0;\n}\n\nbutton-component.create-reminder button {\n  margin: 1rem;\n  width: calc(100% - 2rem);\n}\n\nbutton-component.delete-btn button {\n  color: var(--nylas-error) !important;\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Configuration, EventReminder, Participant } from '@nylas/core';\n/**\n * The `nylas-reminder-emails` component is a UI component that allows users to set buffer time before and after an event.\n *\n * @part nre__tab-heading - The nylas-reminder-emails main tab heading\n * @part nre - The nylas-reminder-emails container\n * @part nre__header - The header of the event communication section\n * @part nre__body - The body of the event communication section\n * @part nre__summary - The reminder card summary container\n * @part nre__reminder-input_dropdown - The dropdown container for selecting reminder time\n * @part nre__reminder-input_dropdown-input - The dropdown for selecting reminder time value\n * @part nre__reminder-input_dropdown-content - The dropdown for selecting reminder time unit (e.g. min, hrs, days)\n */\n@Component({\n  tag: 'nylas-reminder-emails',\n  styleUrl: 'nylas-reminder-emails.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasReminderEmails {\n  @Element() host!: HTMLNylasReminderEmailsElement;\n\n  /**\n   * The selected configuration.\n   */\n  @Prop() selectedConfiguration?: Configuration;\n  /**\n   * The name of the component\n   */\n  @Prop() name: string = 'reminder-overrides';\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n\n  /**\n   * The event reminders state. Defaults to an empty array if no event reminders are present.\n   */\n  @State() reminders: (EventReminder & { editing?: boolean })[] = this.selectedConfiguration?.event_booking?.reminders ?? [];\n  @State() reminderErrors: { [key: string]: string } = {};\n  @State() participants: Participant[] = this.selectedConfiguration?.participants ?? [];\n\n  /**\n   * This event is fired when the email reminders change.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n    valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void;\n  }>;\n\n  // Lifecycle methods\n  connectedCallback() {\n    debug('nylas-reminder-emails', 'connectedCallback');\n  }\n\n  disconnectedCallback() {\n    debug('nylas-reminder-emails', 'disconnectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-reminder-emails', 'componentWillLoad');\n    // See comment in the @Watch('name') decorator for more information.\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-reminder-emails', 'componentDidLoad');\n    if (this.selectedConfiguration) {\n      this.selectedConfigurationChangedHandler(this.selectedConfiguration);\n    } else {\n      this.updateRemindersFormValue();\n    }\n  }\n\n  componentWillUpdate() {\n    debug('nylas-reminder-emails', 'componentWillUpdate');\n  }\n\n  componentDidUpdate() {\n    debug('nylas-reminder-emails', 'componentDidUpdate');\n  }\n\n  componentWillRender() {\n    debug('nylas-reminder-emails', 'componentWillRender');\n  }\n\n  componentDidRender() {\n    debug('nylas-reminder-emails', 'componentDidRender');\n  }\n\n  /**\n   * When a name prop is passed, stencil does not automatically set the name attribute on the host element.\n   * Since this component is form-associated, the name attribute is required for form submission.\n   * This is a workaround to ensure that the name attribute is set on the host element.\n   */\n  @Watch('name')\n  elementNameChangedHandler(newValue: string) {\n    debug('nylas-reminder-emails', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('selectedConfiguration')\n  selectedConfigurationChangedHandler(newVal: Configuration) {\n    debug('nylas-reminder-emails', 'selectedConfigurationChangedHandler', newVal);\n    this.reminders = newVal?.event_booking?.reminders ?? [];\n    this.participants = newVal?.participants ?? [];\n    this.updateRemindersFormValue();\n  }\n\n  @Listen('valueChanged')\n  handleValueChanged(event: CustomEvent) {\n    debug('nylas-reminder-emails', 'handleValueChanged', event);\n    const { name, value } = event.detail;\n\n    if (name.startsWith('reminder-time-')) {\n      // Extract the reminder index from the name attribute (e.g. reminder-time-0)\n      const [_, reminderIndex] = name.split(/(\\d+)/);\n      const updatedReminders = [...this.reminders];\n      updatedReminders[reminderIndex].minutes_before_event = parseInt(value);\n      this.reminders = [...updatedReminders];\n      this.updateRemindersFormValue();\n    }\n  }\n\n  @Listen('nylasFormDropdownChanged')\n  handleNylasFormDropdownChanged(event: CustomEvent) {\n    debug('nylas-reminder-emails', 'handleNylasFormDropdownChanged', event);\n    const { name, value } = event.detail;\n    if (!name.startsWith('recipient-')) {\n      return;\n    }\n    // Extract the reminder index from the name attribute (e.g. recipient-0)\n    const [_, reminderIndex] = name.split(/(\\d+)/);\n    const updatedReminders = [...this.reminders];\n    updatedReminders[reminderIndex].recipient = value;\n    this.reminders = [...updatedReminders];\n    this.updateRemindersFormValue();\n  }\n\n  addReminder() {\n    debug('nylas-reminder-emails', 'addReminder');\n    this.reminders = [\n      ...this.reminders,\n      {\n        type: 'email',\n        minutes_before_event: 30,\n        editing: true,\n        recipient: 'all',\n      },\n    ];\n    this.updateRemindersFormValue();\n  }\n\n  deleteReminder(index: number) {\n    this.reminders = this.reminders.filter((_, i) => i !== index).map(p => ({ ...p }));\n    this.updateRemindersFormValue();\n  }\n\n  updateRemindersFormValue() {\n    debug('nylas-reminder-emails', 'updateRemindersFormValue');\n    const eventReminders = this.reminders.map(reminder => {\n      const rem = { ...reminder };\n      delete rem.editing;\n      return rem;\n    });\n    this.internals.setFormValue(JSON.stringify(eventReminders), 'reminder-overrides');\n    this.valueChanged.emit({ value: JSON.stringify(eventReminders), name: 'reminder-overrides' });\n  }\n\n  formatReminderTime(reminderTime: number) {\n    switch (true) {\n      case reminderTime > 24 * 60:\n        return `${reminderTime / 60 / 24} days`;\n      case reminderTime === 24 * 60:\n        return '1 day';\n      case reminderTime > 90 || reminderTime === 60:\n        return `${reminderTime / 60} hours`;\n      default:\n        return `${reminderTime} minute${reminderTime > 1 ? 's' : ''} `;\n    }\n  }\n\n  @RegisterComponent<NylasReminderEmails, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-reminder-emails',\n    stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),\n    eventToProps: {\n      valueChanged: async (\n        event: CustomEvent<{ value: string; name: string; valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void }>,\n        _nylasSchedulerConfigConnector: NylasSchedulerConfigConnector,\n      ) => {\n        const { valueChanged } = event.detail;\n        // If a handler is passed, call it.\n        if (valueChanged) {\n          valueChanged(event);\n        }\n      },\n    },\n    fireRegisterEvent: true,\n  })\n  render() {\n    const organizerName = this.participants.find(p => p.is_organizer)?.name;\n    const recipientOptions = [\n      {\n        label: 'All host & guests',\n        value: 'all',\n      },\n      {\n        label: 'All event guests',\n        value: 'guest',\n      },\n      {\n        label: 'Only event host',\n        value: 'host',\n      },\n    ];\n\n    return (\n      <Host>\n        <div class=\"cards-container\">\n          {this.reminders.map((reminder, index) => {\n            return (\n              <div class=\"nylas-reminder-email\" part=\"nre\">\n                <div class=\"header\" part=\"nre__header\">\n                  <div>\n                    <h3>Upcoming meeting{organizerName ? ` with ${organizerName} ` : ''}</h3>\n                    <p>Reminder before event</p>\n                  </div>\n                  {!reminder.editing ? (\n                    <button-component\n                      variant={'basic'}\n                      key={`edit-${index} `}\n                      clickHandler={event => {\n                        event.preventDefault();\n                        reminder.editing = true;\n                        this.reminders = [...this.reminders];\n                      }}\n                    >\n                      <edit-icon width=\"16\" height=\"16\"></edit-icon>\n                      Edit\n                    </button-component>\n                  ) : (\n                    <div class=\"reminder-open-close-toggle\">\n                      <button-component\n                        variant={'basic'}\n                        class=\"delete-btn\"\n                        tooltip=\"Delete reminder\"\n                        key={`delete -${index} `}\n                        clickHandler={event => {\n                          event.preventDefault();\n                          this.deleteReminder(index);\n                        }}\n                      >\n                        <trash-icon width=\"16\" height=\"16\"></trash-icon>\n                      </button-component>\n                      <span\n                        class={`chevron ${reminder.editing ? 'open' : 'closed'}`}\n                        onClick={() => {\n                          reminder.editing = !reminder.editing;\n                          this.reminders = [...this.reminders];\n                        }}\n                      >\n                        <chevron-icon width=\"24\" height=\"24\" />\n                      </span>\n                    </div>\n                  )}\n                </div>\n\n                {reminder.editing ? (\n                  <div class=\"nylas-reminder-email__body\" part=\"nre__body\">\n                    <div class=\"nylas-reminder-email__section\">\n                      <div class=\"nylas-reminder-email__row\">\n                        <label>Email recipients</label>\n                        <select-dropdown\n                          name={`recipient-${index}`}\n                          options={recipientOptions}\n                          defaultSelectedOption={recipientOptions.find(i => i.value === reminder.recipient) ?? recipientOptions[0]}\n                          withSearch={false}\n                        />\n                      </div>\n                      <div class=\"nylas-reminder-email__row\">\n                        <label>\n                          Send confirmation email when\n                          <span class=\"label-icon\">\n                            <tooltip-component>\n                              <info-icon slot=\"tooltip-icon\" />\n                              <span slot=\"tooltip-content\">The recipients will receive a reminder email at the specified time before the event.</span>\n                            </tooltip-component>\n                          </span>\n                        </label>\n                        <nylas-reminder-time\n                          name={`reminder-time-${index}`}\n                          eventReminderTimeMinutes={reminder.minutes_before_event}\n                          exportparts=\"nrt, nrt__input_dropdown: nre__reminder-input_dropdown,\n                          nrt__input_dropdown-input: nre__reminder-input_dropdown-input,\n                          nrt__input_dropdown-content: nre__reminder-input_dropdown-content,\n                          \"\n                        />\n                      </div>\n                    </div>\n                  </div>\n                ) : (\n                  <div class=\"nylas-reminder-email__summary\" part=\"nre__summary\">\n                    <p>\n                      <span class=\"summary-icon\">\n                        <person-clipboard-icon></person-clipboard-icon>\n                      </span>\n                      {recipientOptions.find(i => i.value === reminder.recipient)?.label}\n                    </p>\n                    <p>\n                      <span class=\"summary-icon\">\n                        <clock-icon></clock-icon>\n                      </span>\n                      {this.formatReminderTime(reminder.minutes_before_event)} before the event\n                    </p>\n                  </div>\n                )}\n              </div>\n            );\n          })}\n        </div>\n\n        <button-component\n          class=\"create-reminder\"\n          variant={'basic'}\n          clickHandler={event => {\n            event.preventDefault();\n            this.addReminder();\n          }}\n        >\n          <plus-icon width=\"16\" height=\"16\"></plus-icon>\n          New reminder\n        </button-component>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"nylas-reminder-emails.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}