npm - @nylas/web-elements - Versions diffs - 0.0.0-canary-20241008193213 → 0.0.0-canary-20241017103834 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (825) hide show

package/dist/components/nylas-connected-calendars2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nylas-connected-calendars2.js","mappings":"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","names":[],"sources":["src/components/scheduler-editor/nylas-connected-calendars/nylas-connected-calendars.scss?tag=nylas-connected-calendars&encapsulation=shadow","src/components/scheduler-editor/nylas-connected-calendars/nylas-connected-calendars.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-connected-calendars {\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\n .header {\n padding: 1rem;\n\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\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 display: flex;\n align-items: center;\n gap: 4px;\n }\n }\n\n .content {\n .participant-container {\n padding-top: 12px;\n border-top: 1px solid var(--nylas-base-200);\n\n .participant-title {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 4px 16px 16px;\n\n p {\n margin: 0;\n }\n\n .participant-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 }\n}\n\nnylas-calendar-picker::part(ncp) {\n margin: 0;\n border: none;\n border-top: 1px solid var(--nylas-base-200);\n border-top-right-radius: 0;\n border-top-left-radius: 0;\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 { AdditionalParticipant, Calendar, Configuration, Participant } from '@nylas/core';\n\n/*\n The `nylas-connected-calendars` component is a form input for selecting calendars to check availability for participants.\n /\n@Component({\n tag: 'nylas-connected-calendars',\n styleUrl: 'nylas-connected-calendars.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class NylasConnectedCalendars {\n @Element() host!: HTMLNylasConnectedCalendarsElement;\n private connectedCalendarsFormRef!: HTMLFormElement;\n\n /\n The name of the participants custom availability.\n /\n @Prop() name: string = 'connected-calendars';\n\n /\n The selected config\n /\n @Prop() selectedConfiguration?: Configuration;\n\n /\n The participants selected in the add participants section.\n /\n @Prop() participants: Participant[] = this.selectedConfiguration?.participants \|\| [];\n\n /\n The calendars to choose from for the organizer / logged in user.\n /\n @Prop() calendars?: Calendar[];\n\n /\n The participant options passed in the additionalParticipants prop\n * from the nylas-scheduler-editor component.\n /\n @Prop() participantOptions?: AdditionalParticipant[];\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() selectedCalendars: {\n [key: string]: {\n isOpen: boolean;\n name: string;\n calendars?: Calendar[];\n };\n } = this.setParticipants(this.participants);\n\n /\n Participants calendar options.\n /\n @State() participantCalendars: {\n [key: string]: Calendar[];\n } = {};\n\n /\n The state to store the default selected calendars for each participant\n */\n @State() participantDefaultSelectedCalendars: {\n [key: string]: string[];\n } = {};\n\n // Watchers\n @Watch('name')\n elementNameChangedHandler(newValue: string) {\n debug('nylas-connected-calendars', 'elementNameChangedHandler', newValue);\n this.host.setAttribute('name', newValue);\n }\n\n @Watch('calendars')\n calendarsChangedHandler(newValue: Calendar[]) {\n debug('nylas-connected-calendars', 'calendarsChangedHandler', newValue);\n this.selectedCalendars = this.setParticipants(this.participants);\n this.participantCalendars = this.getParticipantCalendarOptions(this.participants, this.participantOptions);\n }\n\n @Watch('participants')\n participantsChangedHandler(newValue: Participant[]) {\n debug('nylas-connected-calendars', 'participantsChangedHandler', newValue);\n this.selectedCalendars = this.setParticipants(newValue);\n this.participantCalendars = this.getParticipantCalendarOptions(newValue, this.participantOptions);\n }\n\n @Watch('participantOptions')\n participantOptionsChangedHandler(newValue: AdditionalParticipant[]) {\n debug('nylas-calendar-picker', 'participantOptionsChangedHandler', newValue);\n this.selectedCalendars = this.setParticipants(this.participants);\n this.participantCalendars = this.getParticipantCalendarOptions(this.participants, newValue);\n }\n\n @Watch('selectedConfiguration')\n selectedConfigurationChangedHandler(newValue: Configuration) {\n debug('nylas-calendar-picker', 'selectedConfigurationChangedHandler', newValue);\n const participants = newValue?.participants \|\| this.participants;\n if (participants && participants.length > 0) {\n this.selectedCalendars = this.setParticipants(participants);\n this.participantCalendars = this.getParticipantCalendarOptions(participants, this.participantOptions);\n }\n }\n\n getParticipantCalendarOptions(addedParticipants: Participant[], availableParticipantOptions: AdditionalParticipant[] \| undefined) {\n // Get the participants from the availableParticipantOptions prop that are in the addedParticipants prop\n const organizer = addedParticipants?.find(participant => participant.is_organizer);\n const isRoundRobinConfig = this.selectedConfiguration?.availability?.availability_rules?.availability_method !== 'collective';\n const participantCalendars = {};\n if (availableParticipantOptions) {\n const participants = addedParticipants?.filter(participant => availableParticipantOptions.some(availableParticipant => availableParticipant.email === participant.email));\n const remainingParticipants = addedParticipants?.filter(\n participant => !availableParticipantOptions.some(availableParticipant => availableParticipant.email === participant.email),\n );\n\n // Get the calendar options for each participant with email as the key\n participants?.forEach(participant => {\n const participantOption = availableParticipantOptions?.find(participantOption => participantOption.email === participant.email);\n if (!participantOption) return;\n this.participantDefaultSelectedCalendars[participant.email] = participant.availability?.calendar_ids \|\| [];\n const calendars = participantOption.calendars ?? [];\n participant.availability?.calendar_ids?.forEach(calendarId => {\n if (!calendars?.some(calendar => calendar.id === calendarId) && calendarId !== 'primary') {\n calendars.push({ id: calendarId, name: calendarId });\n }\n });\n participantCalendars[participant.email] = calendars;\n });\n if (isRoundRobinConfig) {\n // If it is round robin config, add the remaining participant calendars to the participantCalendars\n // (Round-robin does not have an organizer, and we filtered out the participants not passed in the participantOptions prop,\n // so we need to add the remaining participants calendars to the participantCalendars)\n remainingParticipants?.forEach(participant => {\n if (participant?.availability?.calendar_ids && participant?.availability?.calendar_ids?.length > 0 && !participant.is_organizer) {\n participantCalendars[participant.email] = this.calendars ?? [{ id: 'primary', name: participant.email }];\n this.participantDefaultSelectedCalendars[participant.email] = participant.availability?.calendar_ids \|\| [];\n }\n });\n }\n }\n\n // Add the organizer's calendars to the participantCalendars\n if (organizer) {\n participantCalendars[organizer.email] = this.calendars ?? [{ id: 'primary', name: organizer.email }];\n this.participantDefaultSelectedCalendars[organizer.email] = organizer.availability?.calendar_ids \|\| [];\n }\n return participantCalendars;\n }\n\n // Lifecycle Methods\n connectedCallback() {\n debug('nylas-connected-calendars', 'connectedCallback');\n }\n\n disconnectedCallback() {\n debug('nylas-connected-calendars', 'disconnectedCallback');\n }\n\n componentWillLoad() {\n debug('nylas-connected-calendars', 'componentWillLoad');\n }\n\n componentDidLoad() {\n debug('nylas-connected-calendars', 'componentDidLoad');\n if (this.selectedConfiguration) {\n this.selectedCalendars = this.setParticipants(this.selectedConfiguration?.participants);\n this.participantCalendars = this.getParticipantCalendarOptions(this.selectedConfiguration?.participants, this.participantOptions);\n }\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.connectedCalendarsFormRef.checkValidity()) {\n this.internals.setValidity({ customError: true }, 'Please select at least one calendar for each participant.');\n return;\n } else {\n this.internals.setValidity({});\n }\n\n const key = name.split('participant-')[1];\n if (!this.selectedCalendars[key]) return;\n this.selectedCalendars[key]['calendars'] = value;\n this.selectedCalendars = { ...this.selectedCalendars };\n\n const participantsCalendars = {};\n Object.keys(this.selectedCalendars).forEach(key => {\n participantsCalendars[key] = this.selectedCalendars[key].calendars;\n });\n this.internals.setFormValue(JSON.stringify(participantsCalendars), this.name);\n this.valueChanged.emit({ value: JSON.stringify(participantsCalendars), name: this.name });\n }\n\n setParticipants(participants: Participant[]) {\n const selectedParticipants = {};\n participants?.forEach(participant => {\n if (participant?.availability?.calendar_ids && participant?.availability?.calendar_ids?.length > 0) {\n const isOpen = participant.is_organizer ? true : false;\n selectedParticipants[participant.email] = {\n isOpen: isOpen,\n name: participant.name \|\| participant.email,\n availability: participant.availability,\n };\n }\n });\n return selectedParticipants;\n }\n @RegisterComponent<NylasConnectedCalendars, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n name: 'nylas-connected-calendars',\n stateToProps: new Map([\n ['schedulerConfig.additionalParticipants', 'participantOptions'],\n ['schedulerConfig.calendars', 'calendars'],\n ['schedulerConfig.selectedConfiguration', 'selectedConfiguration'],\n ]),\n eventToProps: {},\n fireRegisterEvent: true,\n })\n render() {\n return (\n <Host>\n <div class=\"nylas-connected-calendars\" part=\"npca\">\n <div class=\"header\" part=\"npca__header\">\n <h3>Connected Calendars</h3>\n <p>\n Select the calendars to use for checking your availability.\n <tooltip-component>\n <info-icon slot=\"tooltip-icon\" />\n <span slot=\"tooltip-content\">\n Check availability across one or more calendars. If you select multiple calendars for a participant, the participant must be available across all of their\n calendars to be considered available.\n </span>\n </tooltip-component>\n </p>\n </div>\n <div class=\"content\" part=\"npca__content\">\n <form ref={el => (this.connectedCalendarsFormRef = el as HTMLFormElement)}>\n {Object.keys(this.participantCalendars).map((key, index) => {\n const participant = this.selectedCalendars[key];\n const participantCalendars = this.participantCalendars[key];\n if (!participant \|\| !participant.name) 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 connected calendars</p>\n <div class=\"participant-toggle\" part=\"npca__participant-toggle--container\">\n <span\n class={`chevron ${participant.isOpen ? 'open' : 'closed'}`}\n onClick={() => {\n this.selectedCalendars[key].isOpen = !participant.isOpen;\n this.selectedCalendars = { ...this.selectedCalendars };\n }}\n >\n <chevron-icon width=\"24\" height=\"24\" />\n </span>\n </div>\n </div>\n {participant.isOpen && (\n <nylas-calendar-picker\n key={key}\n name={`participant-${key}`}\n calendars={participantCalendars}\n defaultSelectedCalendars={this.participantDefaultSelectedCalendars[key]}\n />\n )}\n </div>\n );\n })}\n </form>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"nylas-connected-calendars2.js","mappings":"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","names":[],"sources":["src/components/scheduler-editor/nylas-connected-calendars/nylas-connected-calendars.scss?tag=nylas-connected-calendars&encapsulation=shadow","src/components/scheduler-editor/nylas-connected-calendars/nylas-connected-calendars.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-connected-calendars {\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\n .header {\n padding: 1rem;\n\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\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 display: flex;\n align-items: center;\n gap: 4px;\n }\n }\n\n .content {\n .participant-container {\n padding-top: 12px;\n border-top: 1px solid var(--nylas-base-200);\n\n .participant-title {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 4px 16px 16px;\n\n p {\n margin: 0;\n }\n\n .participant-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 }\n}\n\nnylas-calendar-picker::part(ncp) {\n margin: 0;\n border: none;\n border-top: 1px solid var(--nylas-base-200);\n border-top-right-radius: 0;\n border-top-left-radius: 0;\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 { AdditionalParticipant, Calendar, Configuration, Participant } from '@nylas/core';\n\n/*\n The `nylas-connected-calendars` component is a form input for selecting calendars to check availability for participants.\n * @part nccals - The connected calendars host.\n * @part nccals__header - The header.\n * @part nccals__content - The content.\n * @part nccals__container - The container.\n * @part nccals__title - The title.\n * @part nccals__toggle-container - The toggle container.\n /\n@Component({\n tag: 'nylas-connected-calendars',\n styleUrl: 'nylas-connected-calendars.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class NylasConnectedCalendars {\n @Element() host!: HTMLNylasConnectedCalendarsElement;\n private connectedCalendarsFormRef!: HTMLFormElement;\n\n /\n The name of the participants custom availability.\n /\n @Prop() name: string = 'connected-calendars';\n\n /\n @standalone\n * The selected config\n /\n @Prop() selectedConfiguration?: Configuration;\n\n /\n @standalone\n * The participants selected in the add participants section.\n /\n @Prop() participants: Participant[] = this.selectedConfiguration?.participants \|\| [];\n\n /\n @standalone\n * The calendars to choose from for the organizer / logged in user.\n /\n @Prop() calendars?: Calendar[];\n\n /\n @standalone\n * The participant options passed in the additionalParticipants prop\n * from the nylas-scheduler-editor component.\n /\n @Prop() participantOptions?: AdditionalParticipant[];\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() selectedCalendars: {\n [key: string]: {\n isOpen: boolean;\n name: string;\n calendars?: Calendar[];\n };\n } = this.setParticipants(this.participants);\n\n /\n Participants calendar options.\n /\n @State() participantCalendars: {\n [key: string]: Calendar[];\n } = {};\n\n /\n The state to store the default selected calendars for each participant\n */\n @State() participantDefaultSelectedCalendars: {\n [key: string]: string[];\n } = {};\n\n // Watchers\n @Watch('name')\n elementNameChangedHandler(newValue: string) {\n debug('nylas-connected-calendars', 'elementNameChangedHandler', newValue);\n this.host.setAttribute('name', newValue);\n }\n\n @Watch('calendars')\n calendarsChangedHandler(newValue: Calendar[]) {\n debug('nylas-connected-calendars', 'calendarsChangedHandler', newValue);\n this.selectedCalendars = this.setParticipants(this.participants);\n this.participantCalendars = this.getParticipantCalendarOptions(this.participants, this.participantOptions);\n }\n\n @Watch('participants')\n participantsChangedHandler(newValue: Participant[]) {\n debug('nylas-connected-calendars', 'participantsChangedHandler', newValue);\n this.selectedCalendars = this.setParticipants(newValue);\n this.participantCalendars = this.getParticipantCalendarOptions(newValue, this.participantOptions);\n }\n\n @Watch('participantOptions')\n participantOptionsChangedHandler(newValue: AdditionalParticipant[]) {\n debug('nylas-calendar-picker', 'participantOptionsChangedHandler', newValue);\n this.selectedCalendars = this.setParticipants(this.participants);\n this.participantCalendars = this.getParticipantCalendarOptions(this.participants, newValue);\n }\n\n @Watch('selectedConfiguration')\n selectedConfigurationChangedHandler(newValue: Configuration) {\n debug('nylas-calendar-picker', 'selectedConfigurationChangedHandler', newValue);\n const participants = newValue?.participants \|\| this.participants;\n if (participants && participants.length > 0) {\n this.selectedCalendars = this.setParticipants(participants);\n this.participantCalendars = this.getParticipantCalendarOptions(participants, this.participantOptions);\n }\n }\n\n getParticipantCalendarOptions(addedParticipants: Participant[], availableParticipantOptions: AdditionalParticipant[] \| undefined) {\n // Get the participants from the availableParticipantOptions prop that are in the addedParticipants prop\n const organizer = addedParticipants?.find(participant => participant.is_organizer);\n const isRoundRobinConfig = this.selectedConfiguration?.availability?.availability_rules?.availability_method !== 'collective';\n const participantCalendars = {};\n if (availableParticipantOptions) {\n const participants = addedParticipants?.filter(participant => availableParticipantOptions.some(availableParticipant => availableParticipant.email === participant.email));\n const remainingParticipants = addedParticipants?.filter(\n participant => !availableParticipantOptions.some(availableParticipant => availableParticipant.email === participant.email),\n );\n\n // Get the calendar options for each participant with email as the key\n participants?.forEach(participant => {\n const participantOption = availableParticipantOptions?.find(participantOption => participantOption.email === participant.email);\n if (!participantOption) return;\n this.participantDefaultSelectedCalendars[participant.email] = participant.availability?.calendar_ids \|\| [];\n const calendars = participantOption.calendars ?? [];\n participant.availability?.calendar_ids?.forEach(calendarId => {\n if (!calendars?.some(calendar => calendar.id === calendarId) && calendarId !== 'primary') {\n calendars.push({ id: calendarId, name: calendarId });\n }\n });\n participantCalendars[participant.email] = calendars;\n });\n if (isRoundRobinConfig) {\n // If it is round robin config, add the remaining participant calendars to the participantCalendars\n // (Round-robin does not have an organizer, and we filtered out the participants not passed in the participantOptions prop,\n // so we need to add the remaining participants calendars to the participantCalendars)\n remainingParticipants?.forEach(participant => {\n if (participant?.availability?.calendar_ids && participant?.availability?.calendar_ids?.length > 0 && !participant.is_organizer) {\n participantCalendars[participant.email] = this.calendars ?? [{ id: 'primary', name: participant.email }];\n this.participantDefaultSelectedCalendars[participant.email] = participant.availability?.calendar_ids \|\| [];\n }\n });\n }\n }\n\n // Add the organizer's calendars to the participantCalendars\n if (organizer) {\n participantCalendars[organizer.email] = this.calendars ?? [{ id: 'primary', name: organizer.email }];\n this.participantDefaultSelectedCalendars[organizer.email] = organizer.availability?.calendar_ids \|\| [];\n }\n return participantCalendars;\n }\n\n // Lifecycle Methods\n connectedCallback() {\n debug('nylas-connected-calendars', 'connectedCallback');\n }\n\n disconnectedCallback() {\n debug('nylas-connected-calendars', 'disconnectedCallback');\n }\n\n componentWillLoad() {\n debug('nylas-connected-calendars', 'componentWillLoad');\n }\n\n componentDidLoad() {\n debug('nylas-connected-calendars', 'componentDidLoad');\n if (this.selectedConfiguration) {\n this.selectedCalendars = this.setParticipants(this.selectedConfiguration?.participants);\n this.participantCalendars = this.getParticipantCalendarOptions(this.selectedConfiguration?.participants, this.participantOptions);\n } else {\n this.selectedCalendars = this.setParticipants(this.participants);\n this.participantCalendars = this.getParticipantCalendarOptions(this.participants, this.participantOptions);\n }\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.connectedCalendarsFormRef.checkValidity()) {\n this.internals.setValidity({ customError: true }, 'Please select at least one calendar for each participant.');\n return;\n } else {\n this.internals.setValidity({});\n }\n\n const key = name.split('participant-')[1];\n if (!this.selectedCalendars[key]) return;\n this.selectedCalendars[key]['calendars'] = value;\n this.selectedCalendars = { ...this.selectedCalendars };\n\n const participantsCalendars = {};\n Object.keys(this.selectedCalendars).forEach(key => {\n participantsCalendars[key] = this.selectedCalendars[key].calendars;\n });\n this.internals.setFormValue(JSON.stringify(participantsCalendars), this.name);\n this.valueChanged.emit({ value: JSON.stringify(participantsCalendars), name: this.name });\n }\n\n setParticipants(participants: Participant[]) {\n const selectedParticipants = {};\n participants?.forEach(participant => {\n if (participant?.availability?.calendar_ids && participant?.availability?.calendar_ids?.length > 0) {\n const isOpen = participant.is_organizer ? true : false;\n selectedParticipants[participant.email] = {\n isOpen: isOpen,\n name: participant.name \|\| participant.email,\n availability: participant.availability,\n };\n }\n });\n return selectedParticipants;\n }\n @RegisterComponent<NylasConnectedCalendars, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n name: 'nylas-connected-calendars',\n stateToProps: new Map([\n ['schedulerConfig.additionalParticipants', 'participantOptions'],\n ['schedulerConfig.calendars', 'calendars'],\n ['schedulerConfig.selectedConfiguration', 'selectedConfiguration'],\n ]),\n eventToProps: {},\n fireRegisterEvent: true,\n })\n render() {\n return (\n <Host>\n <div class=\"nylas-connected-calendars\" part=\"nccals\">\n <div class=\"header\" part=\"nccals__header\">\n <h3>Connected Calendars</h3>\n <p>\n Select the calendars to use for checking your availability.\n <tooltip-component>\n <info-icon slot=\"tooltip-icon\" />\n <span slot=\"tooltip-content\">\n Check availability across one or more calendars. If you select multiple calendars for a participant, the participant must be available across all of their\n calendars to be considered available.\n </span>\n </tooltip-component>\n </p>\n </div>\n <div class=\"content\" part=\"nccals__content\">\n <form ref={el => (this.connectedCalendarsFormRef = el as HTMLFormElement)}>\n {Object.keys(this.participantCalendars).map((key, index) => {\n const participant = this.selectedCalendars[key];\n const participantCalendars = this.participantCalendars[key];\n if (!participant \|\| !participant.name) return;\n return (\n <div class=\"participant-container\" part=\"nccals__container\" key={`participant-conatiner-${index}`}>\n <div class=\"participant-title\" part=\"nccals__title\">\n <p>{participant.name}'s connected calendars</p>\n <div class=\"participant-toggle\" part=\"nccals__toggle-container\">\n <span\n class={`chevron ${participant.isOpen ? 'open' : 'closed'}`}\n onClick={() => {\n this.selectedCalendars[key].isOpen = !participant.isOpen;\n this.selectedCalendars = { ...this.selectedCalendars };\n }}\n >\n <chevron-icon width=\"24\" height=\"24\" />\n </span>\n </div>\n </div>\n {participant.isOpen && (\n <nylas-calendar-picker\n key={key}\n name={`participant-${key}`}\n calendars={participantCalendars}\n defaultSelectedCalendars={this.participantDefaultSelectedCalendars[key]}\n />\n )}\n </div>\n );\n })}\n </form>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/nylas-custom-booking-flow2.js CHANGED Viewed

@@ -41,7 +41,7 @@ const NylasCustomBookingFlow = proxyCustomElement(class NylasCustomBookingFlow e
         checkForMissingSlots(['inputs'], this.el);
     }
     render() {
-        return (h(Host, { key: '9ac3169c2eff9023ac8b8059f14ae309af22d45a' }, h("nylas-form-card", { key: '02be9921b35d02afb300b272a2508871928514e3', exportparts: "nfc__header: ncbf__header" }, h("h1", { key: '0a7e4a9cc508c666cd0b5b3199b5e8fdbdcb9964', slot: "header-title", class: "nylas-custom-booking-flow__title", part: "ncbf__title" }, "Custom booking flow"), h("div", { key: '0416972885e9a3581b64677e297eb8cd10226bc8', slot: "content", class: "nylas-custom-booking-flow__content" }, h("slot", { key: '779f10585d3011df40021104b2ff8d9334544441', name: "inputs" })))));
+        return (h(Host, { key: 'd9e4b13338b50f21575a7c7f0fba18a5b2828fe8', part: "ncbflow" }, h("nylas-form-card", { key: '1f53c24698354fbf45ecd67ac24f690e36133cca', exportparts: "nfc__header: ncbflow__header" }, h("h1", { key: '680813d1aaf33014732e8cf3038a27f4ab4bd607', slot: "header-title", class: "nylas-custom-booking-flow__title", part: "ncbflow__title" }, "Custom booking flow"), h("div", { key: '2da6f6587e05e65cd1e2b35718168f665c3348c1', slot: "content", class: "nylas-custom-booking-flow__content", part: "ncbflow__content" }, h("slot", { key: '73937227f3a398779b0d1c97e525ca0bec593d85', name: "inputs" })))));
     }
     static get formAssociated() { return true; }
     get el() { return this; }

package/dist/components/nylas-custom-booking-flow2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nylas-custom-booking-flow2.js","mappings":";;;;;AAAA,MAAM,yBAAyB,GAAG,qnCAAqnC,CAAC;AACxpC,qCAAe,yBAAyB;;;;;;;;;;;;;;;;MC0B3B,sBAAsB;;;;;;;IASjC,iBAAiB;QACf,KAAK,CAAC,2BAA2B,EAAE,mBAAmB,CAAC,CAAC;KACzD;IACD,oBAAoB;QAClB,KAAK,CAAC,2BAA2B,EAAE,sBAAsB,CAAC,CAAC;KAC5D;IAED,iBAAiB;QACf,KAAK,CAAC,2BAA2B,EAAE,mBAAmB,CAAC,CAAC;KACzD;IAED,gBAAgB;QACd,KAAK,CAAC,2BAA2B,EAAE,kBAAkB,CAAC,CAAC;QACvD,oBAAoB,CAAC,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;KAC3C;IAOD,MAAM;QACJ,QACE,EAAC,IAAI,~~uDACH~~,wEAAiB,WAAW,EAAC,~~2BAA2B~~,~~IACtD~~,2DAAI,IAAI,EAAC,cAAc,EAAC,KAAK,EAAC,kCAAkC,EAAC,IAAI,EAAC,~~aAAa~~,~~0BAE9E~~,EACL,4DAAK,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,oCAAoC,~~IAC5D~~,6DAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACU,CACb,EACP;KACH;;;;;AAbD;IALC,iBAAiB,CAA4G;QAC5H,IAAI,EAAE,2BAA2B;QACjC,YAAY,EAAE,EAAE;QAChB,iBAAiB,EAAE,IAAI;KACxB,CAAC;;;;oDAcD;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/scheduler-editor/nylas-custom-booking-flow/nylas-custom-booking-flow.scss?tag=nylas-custom-booking-flow&encapsulation=shadow","src/components/scheduler-editor/nylas-custom-booking-flow/nylas-custom-booking-flow.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n display: block;\n margin: 1rem;\n @include default-css-variables;\n}\n\n.nylas-custom-booking-flow__title {\n color: var(--nylas-base-900);\n font-size: 16px;\n font-style: normal;\n font-weight: 600;\n line-height: 20px;\n /* 125% /\n margin: 0;\n text-align: left;\n}\n\n.nylas-custom-booking-flow__subtitle {\n color: var(--nylas-base-600);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\n / 142.857% /\n margin: 0.25rem 0px 0px;\n text-align: left;\n}\n\n.nylas-custom-booking-flow__content {\n padding: 1rem;\n display: flex;\n flex-direction: column;\n gap: 1rem;\n}\n\n.nylas-custom-booking-flow__block {\n display: flex;\n justify-content: space-between;\n gap: 0.5rem;\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { checkForMissingSlots, debug } from '@/utils/utils';\nimport { AttachInternals, Component, Element, Host, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\n\n/\n The `nylas-custom-booking-flow` component is an input form for booking type (automatically or manually accept bookings) and confirmation redirect URL (default or custom).\n * This component is a container for the `nylas-booking-confirmation-type`, `nylas-booking-confirmation-redirect` components.\n \n ```html\n * <nylas-custom-booking-flow>\n * <div slot=\"inputs\">\n * <nylas-booking-confirmation-type></nylas-booking-confirmation-type>\n * <nylas-booking-confirmation-redirect></nylas-booking-confirmation-redirect>\n * </div>\n * </nylas-custom-booking-flow>\n * ```\n \n @slot inputs - The custom booking flow inputs. This includes the booking type, confirmation redirect type, and custom redirect URL components.\n /\n@Component({\n tag: 'nylas-custom-booking-flow',\n styleUrl: 'nylas-custom-booking-flow.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class NylasCustomBookingFlow {\n @Element() el!: HTMLElement;\n\n /\n The element internals.\n */\n @AttachInternals() internals!: ElementInternals;\n\n // Lifecycle methods\n connectedCallback() {\n debug('nylas-custom-booking-flow', 'connectedCallback');\n }\n disconnectedCallback() {\n debug('nylas-custom-booking-flow', 'disconnectedCallback');\n }\n\n componentWillLoad() {\n debug('nylas-custom-booking-flow', 'componentWillLoad');\n }\n\n componentDidLoad() {\n debug('nylas-custom-booking-flow', 'componentDidLoad');\n checkForMissingSlots(['inputs'], this.el);\n }\n\n @RegisterComponent<NylasCustomBookingFlow, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n name: 'nylas-custom-booking-flow',\n eventToProps: {},\n fireRegisterEvent: true,\n })\n render() {\n return (\n <Host>\n <nylas-form-card exportparts=\"nfc__header: ~~ncbf__header~~\">\n <h1 slot=\"header-title\" class=\"nylas-custom-booking-flow__title\" part=\"~~ncbf__title~~\">\n Custom booking flow\n </h1>\n <div slot=\"content\" class=\"nylas-custom-booking-flow__content\">\n <slot name=\"inputs\"></slot>\n </div>\n </nylas-form-card>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"nylas-custom-booking-flow2.js","mappings":";;;;;AAAA,MAAM,yBAAyB,GAAG,qnCAAqnC,CAAC;AACxpC,qCAAe,yBAAyB;;;;;;;;;;;;;;;;MC0B3B,sBAAsB;;;;;;;IASjC,iBAAiB;QACf,KAAK,CAAC,2BAA2B,EAAE,mBAAmB,CAAC,CAAC;KACzD;IACD,oBAAoB;QAClB,KAAK,CAAC,2BAA2B,EAAE,sBAAsB,CAAC,CAAC;KAC5D;IAED,iBAAiB;QACf,KAAK,CAAC,2BAA2B,EAAE,mBAAmB,CAAC,CAAC;KACzD;IAED,gBAAgB;QACd,KAAK,CAAC,2BAA2B,EAAE,kBAAkB,CAAC,CAAC;QACvD,oBAAoB,CAAC,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;KAC3C;IAOD,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,IAAI,EAAC,SAAS,IAClB,wEAAiB,WAAW,EAAC,8BAA8B,IACzD,2DAAI,IAAI,EAAC,cAAc,EAAC,KAAK,EAAC,kCAAkC,EAAC,IAAI,EAAC,gBAAgB,0BAEjF,EACL,4DAAK,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,oCAAoC,EAAC,IAAI,EAAC,kBAAkB,IACpF,6DAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACU,CACb,EACP;KACH;;;;;AAbD;IALC,iBAAiB,CAA4G;QAC5H,IAAI,EAAE,2BAA2B;QACjC,YAAY,EAAE,EAAE;QAChB,iBAAiB,EAAE,IAAI;KACxB,CAAC;;;;oDAcD;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/scheduler-editor/nylas-custom-booking-flow/nylas-custom-booking-flow.scss?tag=nylas-custom-booking-flow&encapsulation=shadow","src/components/scheduler-editor/nylas-custom-booking-flow/nylas-custom-booking-flow.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n display: block;\n margin: 1rem;\n @include default-css-variables;\n}\n\n.nylas-custom-booking-flow__title {\n color: var(--nylas-base-900);\n font-size: 16px;\n font-style: normal;\n font-weight: 600;\n line-height: 20px;\n /* 125% /\n margin: 0;\n text-align: left;\n}\n\n.nylas-custom-booking-flow__subtitle {\n color: var(--nylas-base-600);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\n / 142.857% /\n margin: 0.25rem 0px 0px;\n text-align: left;\n}\n\n.nylas-custom-booking-flow__content {\n padding: 1rem;\n display: flex;\n flex-direction: column;\n gap: 1rem;\n}\n\n.nylas-custom-booking-flow__block {\n display: flex;\n justify-content: space-between;\n gap: 0.5rem;\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { checkForMissingSlots, debug } from '@/utils/utils';\nimport { AttachInternals, Component, Element, Host, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\n\n/\n The `nylas-custom-booking-flow` component is an input form for booking type (automatically or manually accept bookings) and confirmation redirect URL (default or custom).\n * This component is a container for the `nylas-booking-confirmation-type`, `nylas-booking-confirmation-redirect` components.\n \n ```html\n * <nylas-custom-booking-flow>\n * <div slot=\"inputs\">\n * <nylas-booking-confirmation-type></nylas-booking-confirmation-type>\n * <nylas-booking-confirmation-redirect></nylas-booking-confirmation-redirect>\n * </div>\n * </nylas-custom-booking-flow>\n * ```\n \n @slot inputs - The custom booking flow inputs. This includes the booking type, confirmation redirect type, and custom redirect URL components.\n /\n@Component({\n tag: 'nylas-custom-booking-flow',\n styleUrl: 'nylas-custom-booking-flow.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class NylasCustomBookingFlow {\n @Element() el!: HTMLElement;\n\n /\n The element internals.\n */\n @AttachInternals() internals!: ElementInternals;\n\n // Lifecycle methods\n connectedCallback() {\n debug('nylas-custom-booking-flow', 'connectedCallback');\n }\n disconnectedCallback() {\n debug('nylas-custom-booking-flow', 'disconnectedCallback');\n }\n\n componentWillLoad() {\n debug('nylas-custom-booking-flow', 'componentWillLoad');\n }\n\n componentDidLoad() {\n debug('nylas-custom-booking-flow', 'componentDidLoad');\n checkForMissingSlots(['inputs'], this.el);\n }\n\n @RegisterComponent<NylasCustomBookingFlow, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n name: 'nylas-custom-booking-flow',\n eventToProps: {},\n fireRegisterEvent: true,\n })\n render() {\n return (\n <Host part=\"ncbflow\">\n <nylas-form-card exportparts=\"nfc__header: ncbflow__header\">\n <h1 slot=\"header-title\" class=\"nylas-custom-booking-flow__title\" part=\"ncbflow__title\">\n Custom booking flow\n </h1>\n <div slot=\"content\" class=\"nylas-custom-booking-flow__content\" part=\"ncbflow__content\">\n <slot name=\"inputs\"></slot>\n </div>\n </nylas-form-card>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/nylas-custom-event-slug2.js CHANGED Viewed

@@ -58,6 +58,7 @@ const NylasCustomEventSlug = proxyCustomElement(class NylasCustomEventSlug exten
             this.selectedConfigurationChangedHandler(this.selectedConfiguration);
         }
         else {
+            console.log('No selected configuration found');
             this.urlSlug = this.defaultUrlSlug || '';
         }
     }

package/dist/components/nylas-custom-event-slug2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nylas-custom-event-slug2.js","mappings":"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","names":[],"sources":["src/components/scheduler-editor/nylas-custom-event-slug/nylas-custom-event-slug.scss?tag=nylas-custom-event-slug&encapsulation=shadow","src/components/scheduler-editor/nylas-custom-event-slug/nylas-custom-event-slug.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n@import '../../../common/mixins/inputs.scss';\n\n:host {\n display: block;\n @include default-css-variables;\n width: inherit;\n}\n\n.nylas-custom-event-slug {\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 .header {\n padding: 1rem;\n display: grid;\n grid-template-columns: 1fr auto;\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 .drawer-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-custom-event-slug__body {\n display: grid;\n grid-template-columns: 1fr;\n background-color: var(--nylas-base-25);\n border-radius: 0 0 var(--nylas-border-radius-2x) var(--nylas-border-radius-2x);\n border-top: 1px solid var(--nylas-base-200);\n\n @media #{$mobile} {\n grid-template-columns: 1fr;\n }\n\n .nylas-custom-event-slug__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-custom-event-slug__row {\n display: flex;\n align-items: center;\n gap: 1rem;\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 .input-container {\n width: 100%;\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-custom-event-slug__input-wrapper {\n @include textfield;\n width: -moz-available;\n width: -webkit-fill-available;\n display: flex;\n flex-direction: row;\n gap: 0.125rem;\n border-radius: var(--nylas-border-radius-2x);\n z-index: 1;\n\n &.focus {\n outline: 2px solid var(--nylas-primary);\n }\n\n &.error {\n border-color: var(--nylas-error);\n outline: none;\n }\n\n input-component::part(ic__input) {\n outline: none;\n border: none;\n width: 100%;\n font-size: 1rem;\n height: auto;\n padding-left: 0px;\n }\n\n .prefix {\n z-index: 1;\n margin-top: 1px;\n color: var(--nylas-base-400);\n font-weight: 500;\n font-size: 24px;\n }\n\n .icon {\n margin-right: 0.25rem;\n padding: 0 0.75rem;\n height: 100%;\n display: flex;\n align-items: center;\n right: 0;\n cursor: pointer;\n user-select: none;\n\n &.disabled {\n cursor: not-allowed;\n }\n\n &:hover {\n svg path {\n fill: var(--nylas-primary);\n }\n }\n\n &:active {\n svg path {\n fill: var(--nylas-base-500);\n }\n }\n\n .copied {\n display: flex;\n align-items: center;\n font-size: 0.875rem;\n gap: 0.125rem;\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 { Configuration } from '@nylas/core';\n\n/*\n The `nylas-custom-event-slug` component is a UI component that allows users to add a custom URL slug for their event link.\n \n @part nces - The nylas-custom-event-slug container\n * @part nces__body - The body of the event communication section\n * @part nces__header - The header of the event communication section\n * @part nces__drawer-toggle--container - The card's drawer toggle container\n * @part nces__input-textfield - The custom slug input textfield\n /\n@Component({\n tag: 'nylas-custom-event-slug',\n styleUrl: 'nylas-custom-event-slug.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class NylasCustomEventSlug {\n @Element() host!: HTMLNylasCustomEventSlugElement;\n /\n The selected config\n /\n @Prop() selectedConfiguration?: Configuration;\n /\n The default custom event slug\n /\n @Prop() defaultUrlSlug?: string;\n /\n Is the custom event slug card expanded\n /\n @Prop() isOpen: boolean = true;\n /\n Slug error message\n /\n @Prop() slugErrorMessage: string = '';\n /\n The name of the component\n /\n @Prop() name: string = 'custom-event-slug';\n /\n Indicates if a slug is required for the configuration.\n * When set to true, the user must enter a slug when creating or editing a configuration.\n * The slug is used for hosted pages that are public.\n /\n @Prop() requiresSlug: boolean = false;\n /\n The element internals.\n /\n @AttachInternals() internals!: ElementInternals;\n\n /\n The URL slug state\n /\n @State() urlSlug!: string;\n\n /\n The focus state of the input container.\n /\n @State() focus = false;\n\n /\n The copied state for the copy to clipboard button\n /\n @State() copied = false;\n\n /\n This event is fired when the slug value changes\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-custom-event-slug', 'connectedCallback');\n }\n\n disconnectedCallback() {\n debug('nylas-custom-event-slug', 'disconnectedCallback');\n }\n\n componentWillLoad() {\n debug('nylas-custom-event-slug', '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-custom-event-slug', 'componentDidLoad');\n if (this.selectedConfiguration) {\n this.selectedConfigurationChangedHandler(this.selectedConfiguration);\n } else {\n this.urlSlug = this.defaultUrlSlug \|\| '';\n }\n }\n\n componentWillUpdate() {\n debug('nylas-custom-event-slug', 'componentWillUpdate');\n }\n\n componentDidUpdate() {\n debug('nylas-custom-event-slug', 'componentDidUpdate');\n }\n\n componentWillRender() {\n debug('nylas-custom-event-slug', 'componentWillRender');\n }\n\n componentDidRender() {\n debug('nylas-custom-event-slug', '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-custom-event-slug', 'elementNameChangedHandler', newValue);\n this.host.setAttribute('name', newValue);\n }\n\n @Watch('selectedConfiguration')\n selectedConfigurationChangedHandler(newValue: Configuration) {\n debug('nylas-custom-booking-flow', 'selectedConfigurationChangedHandler', newValue);\n this.urlSlug = newValue?.slug \|\| this.defaultUrlSlug \|\| '';\n }\n\n @Listen('nylasFormInputChanged')\n async nylasFormInputChangeHandler(event: CustomEvent<{ value: string; name: string }>) {\n const { name, value } = event.detail;\n this.internals.setValidity({});\n\n if (name === 'event-slug') {\n this.urlSlug = value;\n this.internals.setFormValue(JSON.stringify(value), this.name);\n this.valueChanged.emit({ value: JSON.stringify(value), name: this.name });\n }\n }\n\n @Listen('nylasFormInputFocused')\n async nylasFormInputFocusHandler() {\n this.focus = true;\n }\n\n @Listen('nylasFormInputBlurred')\n async nylasFormInputBlurHandler() {\n this.slugErrorMessage = '';\n this.internals.setValidity({});\n this.focus = false;\n if (this.requiresSlug && this.urlSlug === '') {\n this.internals.setValidity({ customError: true }, 'Slug is required');\n this.slugErrorMessage = 'Slug cannot be blank';\n return;\n }\n if (!/^[A-Za-z0-9-]$/.test(this.urlSlug)) {\n this.internals.setValidity({ customError: true }, 'Invalid slug: Only letters, numbers, and hyphens are allowed.');\n this.slugErrorMessage = 'Invalid slug: Only letters, numbers, and hyphens are allowed.';\n }\n }\n\n @Listen('formSubmitted', { target: 'window' })\n formSubmittedHandler(event: CustomEvent) {\n debug('nylas-event-title', 'formSubmittedHandler', event);\n this.nylasFormInputBlurHandler();\n }\n\n toggleDrawer() {\n this.isOpen = !this.isOpen;\n }\n\n async copyToClipboard() {\n try {\n await navigator.clipboard.writeText(`${this.urlSlug}`);\n\n this.copied = true;\n setTimeout(() => {\n this.copied = false;\n }, 1000);\n } catch (err) {\n console.error('Failed to copy: ', err);\n }\n }\n\n @RegisterComponent<NylasCustomEventSlug, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n name: 'nylas-custom-event-slug',\n stateToProps: new Map([\n ['schedulerConfig.requiresSlug', 'requiresSlug'],\n ['schedulerConfig.selectedConfiguration', 'selectedConfiguration'],\n ]),\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 if (!this.requiresSlug) return null;\n const isComponentReady = typeof this.urlSlug !== 'undefined';\n return (\n <Host>\n <div class=\"nylas-custom-event-slug\" part=\"nces\">\n <div class=\"header\" part=\"nces__header\">\n <div>\n <h3>Custom event slug</h3>\n <p>Create a custom URL slug for this event</p>\n </div>\n <div class=\"drawer-toggle\" part=\"nces__drawer-toggle--container\">\n <span class={`chevron ${this.isOpen ? 'open' : 'closed'} `} onClick={() => this.toggleDrawer()}>\n <chevron-icon width=\"24\" height=\"24\" />\n </span>\n </div>\n </div>\n\n {this.isOpen && (\n <div class=\"nylas-custom-event-slug__body\" part=\"nces__body\">\n <div class=\"nylas-custom-event-slug__section\">\n <div class=\"nylas-custom-event-slug__row\">\n <div class=\"input-container\">\n <label>\n Event URL slug\n <span class=\"label-icon\">\n <tooltip-component>\n <info-icon slot=\"tooltip-icon\" />\n <span slot=\"tooltip-content\">Provide a custom slug for your URL to help uniquely identify your event (letters, numbers, and hyphens only)</span>\n </tooltip-component>\n </span>\n </label>\n\n <div class={{ 'nylas-custom-event-slug__input-wrapper': true, 'focus': this.focus, 'error': !!this.slugErrorMessage }}>\n <div slot=\"prefix\" class=\"prefix\">\n /\n </div>\n {isComponentReady && (\n <input-component\n name=\"event-slug\"\n id=\"event-slug\"\n type=\"text\"\n required={false}\n placeholder=\"my-link-name\"\n exportparts=\"ic_input: nces__input-textfield\"\n defaultValue={this.urlSlug}\n />\n )}\n <div slot=\"icon\" class={{ icon: true, disabled: !this.urlSlug }} onClick={() => !this.copied && !!this.urlSlug && this.copyToClipboard()}>\n {this.copied ? (\n <div class=\"copied\">\n <checkmark-icon width=\"12\" height=\"18\" /> Copied!\n </div>\n ) : (\n <copy-icon width=\"12\" height=\"18\" />\n )}\n </div>\n </div>\n {this.slugErrorMessage && <span class=\"error-message\">{this.slugErrorMessage}</span>}\n </div>\n </div>\n </div>\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"nylas-custom-event-slug2.js","mappings":"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","names":[],"sources":["src/components/scheduler-editor/nylas-custom-event-slug/nylas-custom-event-slug.scss?tag=nylas-custom-event-slug&encapsulation=shadow","src/components/scheduler-editor/nylas-custom-event-slug/nylas-custom-event-slug.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n@import '../../../common/mixins/inputs.scss';\n\n:host {\n display: block;\n @include default-css-variables;\n width: inherit;\n}\n\n.nylas-custom-event-slug {\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 .header {\n padding: 1rem;\n display: grid;\n grid-template-columns: 1fr auto;\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 .drawer-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-custom-event-slug__body {\n display: grid;\n grid-template-columns: 1fr;\n background-color: var(--nylas-base-25);\n border-radius: 0 0 var(--nylas-border-radius-2x) var(--nylas-border-radius-2x);\n border-top: 1px solid var(--nylas-base-200);\n\n @media #{$mobile} {\n grid-template-columns: 1fr;\n }\n\n .nylas-custom-event-slug__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-custom-event-slug__row {\n display: flex;\n align-items: center;\n gap: 1rem;\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 .input-container {\n width: 100%;\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-custom-event-slug__input-wrapper {\n @include textfield;\n width: -moz-available;\n width: -webkit-fill-available;\n display: flex;\n flex-direction: row;\n gap: 0.125rem;\n border-radius: var(--nylas-border-radius-2x);\n z-index: 1;\n\n &.focus {\n outline: 2px solid var(--nylas-primary);\n }\n\n &.error {\n border-color: var(--nylas-error);\n outline: none;\n }\n\n input-component::part(ic__input) {\n outline: none;\n border: none;\n width: 100%;\n font-size: 1rem;\n height: auto;\n padding-left: 0px;\n }\n\n .prefix {\n z-index: 1;\n margin-top: 1px;\n color: var(--nylas-base-400);\n font-weight: 500;\n font-size: 24px;\n }\n\n .icon {\n margin-right: 0.25rem;\n padding: 0 0.75rem;\n height: 100%;\n display: flex;\n align-items: center;\n right: 0;\n cursor: pointer;\n user-select: none;\n\n &.disabled {\n cursor: not-allowed;\n }\n\n &:hover {\n svg path {\n fill: var(--nylas-primary);\n }\n }\n\n &:active {\n svg path {\n fill: var(--nylas-base-500);\n }\n }\n\n .copied {\n display: flex;\n align-items: center;\n font-size: 0.875rem;\n gap: 0.125rem;\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 { Configuration } from '@nylas/core';\n\n/*\n The `nylas-custom-event-slug` component is a UI component that allows users to add a custom URL slug for their event link.\n \n @part nces - The nylas-custom-event-slug container\n * @part nces__body - The body of the event communication section\n * @part nces__header - The header of the event communication section\n * @part nces__drawer-toggle--container - The card's drawer toggle container\n * @part nces__input-textfield - The custom slug input textfield\n /\n@Component({\n tag: 'nylas-custom-event-slug',\n styleUrl: 'nylas-custom-event-slug.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class NylasCustomEventSlug {\n @Element() host!: HTMLNylasCustomEventSlugElement;\n /\n The selected config\n /\n @Prop() selectedConfiguration?: Configuration;\n /\n The default custom event slug\n /\n @Prop() defaultUrlSlug?: string;\n /\n Is the custom event slug card expanded\n /\n @Prop() isOpen: boolean = true;\n /\n Slug error message\n /\n @Prop() slugErrorMessage: string = '';\n /\n The name of the component\n /\n @Prop() name: string = 'custom-event-slug';\n /\n Indicates if a slug is required for the configuration.\n * When set to true, the user must enter a slug when creating or editing a configuration.\n * The slug is used for hosted pages that are public.\n /\n @Prop() requiresSlug: boolean = false;\n /\n The element internals.\n /\n @AttachInternals() internals!: ElementInternals;\n\n /\n The URL slug state\n /\n @State() urlSlug!: string;\n\n /\n The focus state of the input container.\n /\n @State() focus = false;\n\n /\n The copied state for the copy to clipboard button\n /\n @State() copied = false;\n\n /\n This event is fired when the slug value changes\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-custom-event-slug', 'connectedCallback');\n }\n\n disconnectedCallback() {\n debug('nylas-custom-event-slug', 'disconnectedCallback');\n }\n\n componentWillLoad() {\n debug('nylas-custom-event-slug', '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-custom-event-slug', 'componentDidLoad');\n if (this.selectedConfiguration) {\n this.selectedConfigurationChangedHandler(this.selectedConfiguration);\n } else {\n console.log('No selected configuration found');\n this.urlSlug = this.defaultUrlSlug \|\| '';\n }\n }\n\n componentWillUpdate() {\n debug('nylas-custom-event-slug', 'componentWillUpdate');\n }\n\n componentDidUpdate() {\n debug('nylas-custom-event-slug', 'componentDidUpdate');\n }\n\n componentWillRender() {\n debug('nylas-custom-event-slug', 'componentWillRender');\n }\n\n componentDidRender() {\n debug('nylas-custom-event-slug', '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-custom-event-slug', 'elementNameChangedHandler', newValue);\n this.host.setAttribute('name', newValue);\n }\n\n @Watch('selectedConfiguration')\n selectedConfigurationChangedHandler(newValue: Configuration) {\n debug('nylas-custom-booking-flow', 'selectedConfigurationChangedHandler', newValue);\n this.urlSlug = newValue?.slug \|\| this.defaultUrlSlug \|\| '';\n }\n\n @Listen('nylasFormInputChanged')\n async nylasFormInputChangeHandler(event: CustomEvent<{ value: string; name: string }>) {\n const { name, value } = event.detail;\n this.internals.setValidity({});\n\n if (name === 'event-slug') {\n this.urlSlug = value;\n this.internals.setFormValue(JSON.stringify(value), this.name);\n this.valueChanged.emit({ value: JSON.stringify(value), name: this.name });\n }\n }\n\n @Listen('nylasFormInputFocused')\n async nylasFormInputFocusHandler() {\n this.focus = true;\n }\n\n @Listen('nylasFormInputBlurred')\n async nylasFormInputBlurHandler() {\n this.slugErrorMessage = '';\n this.internals.setValidity({});\n this.focus = false;\n if (this.requiresSlug && this.urlSlug === '') {\n this.internals.setValidity({ customError: true }, 'Slug is required');\n this.slugErrorMessage = 'Slug cannot be blank';\n return;\n }\n if (!/^[A-Za-z0-9-]$/.test(this.urlSlug)) {\n this.internals.setValidity({ customError: true }, 'Invalid slug: Only letters, numbers, and hyphens are allowed.');\n this.slugErrorMessage = 'Invalid slug: Only letters, numbers, and hyphens are allowed.';\n }\n }\n\n @Listen('formSubmitted', { target: 'window' })\n formSubmittedHandler(event: CustomEvent) {\n debug('nylas-event-title', 'formSubmittedHandler', event);\n this.nylasFormInputBlurHandler();\n }\n\n toggleDrawer() {\n this.isOpen = !this.isOpen;\n }\n\n async copyToClipboard() {\n try {\n await navigator.clipboard.writeText(`${this.urlSlug}`);\n\n this.copied = true;\n setTimeout(() => {\n this.copied = false;\n }, 1000);\n } catch (err) {\n console.error('Failed to copy: ', err);\n }\n }\n\n @RegisterComponent<NylasCustomEventSlug, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n name: 'nylas-custom-event-slug',\n stateToProps: new Map([\n ['schedulerConfig.requiresSlug', 'requiresSlug'],\n ['schedulerConfig.selectedConfiguration', 'selectedConfiguration'],\n ]),\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 if (!this.requiresSlug) return null;\n const isComponentReady = typeof this.urlSlug !== 'undefined';\n return (\n <Host>\n <div class=\"nylas-custom-event-slug\" part=\"nces\">\n <div class=\"header\" part=\"nces__header\">\n <div>\n <h3>Custom event slug</h3>\n <p>Create a custom URL slug for this event</p>\n </div>\n <div class=\"drawer-toggle\" part=\"nces__drawer-toggle--container\">\n <span class={`chevron ${this.isOpen ? 'open' : 'closed'} `} onClick={() => this.toggleDrawer()}>\n <chevron-icon width=\"24\" height=\"24\" />\n </span>\n </div>\n </div>\n\n {this.isOpen && (\n <div class=\"nylas-custom-event-slug__body\" part=\"nces__body\">\n <div class=\"nylas-custom-event-slug__section\">\n <div class=\"nylas-custom-event-slug__row\">\n <div class=\"input-container\">\n <label>\n Event URL slug\n <span class=\"label-icon\">\n <tooltip-component>\n <info-icon slot=\"tooltip-icon\" />\n <span slot=\"tooltip-content\">Provide a custom slug for your URL to help uniquely identify your event (letters, numbers, and hyphens only)</span>\n </tooltip-component>\n </span>\n </label>\n\n <div class={{ 'nylas-custom-event-slug__input-wrapper': true, 'focus': this.focus, 'error': !!this.slugErrorMessage }}>\n <div slot=\"prefix\" class=\"prefix\">\n /\n </div>\n {isComponentReady && (\n <input-component\n name=\"event-slug\"\n id=\"event-slug\"\n type=\"text\"\n required={false}\n placeholder=\"my-link-name\"\n exportparts=\"ic_input: nces__input-textfield\"\n defaultValue={this.urlSlug}\n />\n )}\n <div slot=\"icon\" class={{ icon: true, disabled: !this.urlSlug }} onClick={() => !this.copied && !!this.urlSlug && this.copyToClipboard()}>\n {this.copied ? (\n <div class=\"copied\">\n <checkmark-icon width=\"12\" height=\"18\" /> Copied!\n </div>\n ) : (\n <copy-icon width=\"12\" height=\"18\" />\n )}\n </div>\n </div>\n {this.slugErrorMessage && <span class=\"error-message\">{this.slugErrorMessage}</span>}\n </div>\n </div>\n </div>\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/nylas-customize-booking-settings2.js CHANGED Viewed

@@ -64,9 +64,9 @@ const NylasCustomizeBookingSettings = proxyCustomElement(class NylasCustomizeBoo
             this.selectedConfigurationChangedHandler(this.selectedConfiguration);
         }
         else {
-            this.allowGuestsToInvite = true;
-            this.hideCancellationOptions = false;
-            this.hideReschedulingOptions = false;
+            this.allowGuestsToInvite = !this.defaultHideAdditionalGuests;
+            this.hideCancellationOptions = this.defaultHideCancellationOptions;
+            this.hideReschedulingOptions = this.defaultHideReschedulingOptions;
         }
     }
     componentWillUpdate() {
@@ -110,7 +110,7 @@ const NylasCustomizeBookingSettings = proxyCustomElement(class NylasCustomizeBoo
     }
     render() {
         const showComponent = typeof this.hideCancellationOptions === 'boolean' && typeof this.hideReschedulingOptions === 'boolean' && typeof this.allowGuestsToInvite === 'boolean';
-        return (h(Host, { key: 'b030237db476f7a4b981d2af5d49f0315ffaa2c0' }, showComponent && (h("div", { class: "nylas-customize-booking-settings", part: "ncbs" }, h("div", { class: "header", part: "ncbs__header" }, h("h3", null, "Additional settings"), h("p", null, "Booking settings for the event.")), h("div", { class: "nylas-customize-booking-settings__settings", part: "ncbs__settings" }, h("div", { class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__additional_guests" }, h("checkbox-component", { name: "hide_additional_guests", label: "Allow guests to invite additional guests.", checked: this.allowGuestsToInvite }, h("span", { slot: "label", class: "label" }, h("p", { class: "label-contents" }, "Allow guests to invite additional guests.")))), h("div", { class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__rescheduling_options" }, h("checkbox-component", { name: "hide_rescheduling_options", label: "Hide 'Reschedule' option on booking page and emails.", checked: this.hideReschedulingOptions }, h("span", { slot: "label", class: "label" }, h("p", { class: "label-contents" }, "Hide rescheduling option."), h("tooltip-component", { id: "reschedule" }, h("info-icon", { slot: "tooltip-icon" }), h("span", { slot: "tooltip-content" }, "Hide the\u00A0", h("strong", null, "Reschedule"), "\u00A0button in the booking confirmation and email notifications."))))), h("div", { class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__cancellation_options" }, h("checkbox-component", { name: "hide_cancellation_options", label: "Hide 'Cancel' option on booking page and emails.", checked: this.hideCancellationOptions }, h("span", { slot: "label", class: "label" }, h("p", { class: "label-contents" }, "Hide cancellation option."), h("tooltip-component", { id: "cancel" }, h("info-icon", { slot: "tooltip-icon" }), h("span", { slot: "tooltip-content" }, "Hide the\u00A0", h("strong", null, "Cancel"), "\u00A0button in the booking confirmation and email notifications."))))))))));
+        return (h(Host, { key: '472a3a5b7b439666b54a4b6f22b702a923063c83' }, showComponent && (h("div", { class: "nylas-customize-booking-settings", part: "ncbs" }, h("div", { class: "header", part: "ncbs__header" }, h("h3", null, "Additional settings"), h("p", null, "Booking settings for the event.")), h("div", { class: "nylas-customize-booking-settings__settings", part: "ncbs__settings" }, h("div", { class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__additional_guests" }, h("checkbox-component", { name: "hide_additional_guests", label: "Allow guests to invite additional guests.", checked: this.allowGuestsToInvite }, h("span", { slot: "label", class: "label" }, h("p", { class: "label-contents" }, "Allow guests to invite additional guests.")))), h("div", { class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__rescheduling_options" }, h("checkbox-component", { name: "hide_rescheduling_options", label: "Hide 'Reschedule' option on booking page and emails.", checked: this.hideReschedulingOptions }, h("span", { slot: "label", class: "label" }, h("p", { class: "label-contents" }, "Hide rescheduling option."), h("tooltip-component", { id: "reschedule" }, h("info-icon", { slot: "tooltip-icon" }), h("span", { slot: "tooltip-content" }, "Hide the\u00A0", h("strong", null, "Reschedule"), "\u00A0button in the booking confirmation and email notifications."))))), h("div", { class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__cancellation_options" }, h("checkbox-component", { name: "hide_cancellation_options", label: "Hide 'Cancel' option on booking page and emails.", checked: this.hideCancellationOptions }, h("span", { slot: "label", class: "label" }, h("p", { class: "label-contents" }, "Hide cancellation option."), h("tooltip-component", { id: "cancel" }, h("info-icon", { slot: "tooltip-icon" }), h("span", { slot: "tooltip-content" }, "Hide the\u00A0", h("strong", null, "Cancel"), "\u00A0button in the booking confirmation and email notifications."))))))))));
     }
     static get formAssociated() { return true; }
     get host() { return this; }

package/dist/components/nylas-customize-booking-settings2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nylas-customize-booking-settings2.js","mappings":"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","names":[],"sources":["src/components/scheduler-editor/nylas-customize-booking-settings/nylas-customize-booking-settings.scss?tag=nylas-customize-booking-settings&encapsulation=shadow","src/components/scheduler-editor/nylas-customize-booking-settings/nylas-customize-booking-settings.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-customize-booking-settings {\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 border-bottom: 1px solid var(--nylas-base-200);\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 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 .nylas-customize-booking-settings__settings {\n display: flex;\n flex-direction: column;\n gap: 1.5rem;\n padding: 1rem;\n margin: 1rem 0;\n .nylas-customize-booking-settings__settings-div {\n display: flex;\n align-items: center;\n gap: 4px;\n }\n }\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 .label-contents {\n margin: 0;\n display: inline-block;\n @media #{$mobile} {\n display: block;\n }\n }\n tooltip-component {\n display: inline-block;\n }\n}\n\ntooltip-component#guests::part(tc__content) {\n @media #{$mobile} {\n left: 58px;\n }\n}\n\ntooltip-component#reschedule::part(tc__content) {\n left: 58px;\n @media #{$mobile} {\n left: 58px;\n }\n}\n\ntooltip-component#cancel::part(tc__content) {\n left: -58px;\n @media #{$mobile} {\n left: 58px;\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 { Configuration } from '@nylas/core';\n\n/*\n The `nylas-customize-booking-settings` component is a UI component that displays the booking calendar picker.\n * @part ncbs - The booking calendar picker container\n * @part ncbs__header - The header of the booking calendar picker\n * @part ncbs__settings - The settings container\n * @part ncbs__settings-div - The div inside the settings container that contains the checkbox and tooltip for each setting\n * @part ncbs__additional_guests - The additional guests setting\n * @part ncbs__cancellation_options - The cancellation options setting\n * @part ncbs__rescheduling_options - The rescheduling options setting\n /\n@Component({\n tag: 'nylas-customize-booking-settings',\n styleUrl: 'nylas-customize-booking-settings.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class NylasCustomizeBookingSettings {\n @Element() host!: HTMLNylasCustomizeBookingSettingsElement;\n /\n The selected config\n /\n @Prop() selectedConfiguration?: Configuration;\n\n /\n @deprecated The default additional guests hidden setting as set in the configuration.\n /\n @Prop() defaultHideAdditionalGuests: boolean = this.selectedConfiguration?.scheduler?.hide_additional_guests ?? false;\n\n /\n @deprecated The default hide cancellation options setting as set in the configuration.\n /\n @Prop() defaultHideCancellationOptions: boolean = this.selectedConfiguration?.scheduler?.hide_cancellation_options ?? false;\n\n /\n @deprecated The default hide rescheduling options setting as set in the configuration.\n /\n @Prop() defaultHideReschedulingOptions: boolean = this.selectedConfiguration?.scheduler?.hide_rescheduling_options ?? false;\n\n /\n The name of the calendar picker.\n /\n @Prop() name: string = 'customize-booking-settings';\n\n /\n State to store the allowed additional guests setting.\n /\n @State() allowGuestsToInvite!: boolean;\n\n /\n State to store the hide cancel booking setting.\n /\n @State() hideCancellationOptions!: boolean;\n\n /\n State to store the hide reschedule booking setting.\n /\n @State() hideReschedulingOptions!: boolean;\n\n /\n The element internals.\n /\n @AttachInternals() internals!: ElementInternals;\n\n /\n This event is fired when the selected booking calendar changes.\n /\n @Event() valueChanged!: EventEmitter<{\n value: string;\n name: string;\n valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void;\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-customize-booking-settings', 'elementNameChangedHandler', newValue);\n this.host.setAttribute('name', newValue);\n }\n\n @Watch('selectedConfiguration')\n selectedConfigurationChangedHandler(newValue: Configuration) {\n debug('nylas-customize-booking-settings', 'selectedConfigurationChangedHandler', newValue);\n this.allowGuestsToInvite = !newValue?.scheduler?.hide_additional_guests;\n this.hideCancellationOptions = newValue?.scheduler?.hide_cancellation_options ?? false;\n this.hideReschedulingOptions = newValue?.scheduler?.hide_rescheduling_options ?? false;\n }\n\n // Lifecycle methods\n connectedCallback() {\n debug('nylas-customize-booking-settings', 'connectedCallback');\n }\n\n disconnectedCallback() {\n debug('nylas-customize-booking-settings', 'disconnectedCallback');\n }\n\n componentWillLoad() {\n debug('nylas-customize-booking-settings', '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-customize-booking-settings', 'componentDidLoad');\n if (this.selectedConfiguration) {\n this.selectedConfigurationChangedHandler(this.selectedConfiguration);\n } else {\n // Set the default values if the selected configuration is not available\n this.allowGuestsToInvite = true;\n this.hideCancellationOptions = false;\n this.hideReschedulingOptions = false;\n }\n }\n\n componentWillUpdate() {\n debug('nylas-customize-booking-settings', 'componentWillUpdate');\n }\n\n componentDidUpdate() {\n debug('nylas-customize-booking-settings', 'componentDidUpdate');\n }\n\n componentWillRender() {\n debug('nylas-customize-booking-settings', 'componentWillRender');\n }\n\n componentDidRender() {\n debug('nylas-customize-booking-settings', 'componentDidRender');\n }\n\n @Listen('nylasFormCheckboxToggled')\n checkboxToggledHandler(event: CustomEvent<{ name: string; checked: boolean }>) {\n const { name, checked } = event.detail;\n switch (name) {\n case 'hide_additional_guests':\n this.allowGuestsToInvite = checked;\n break;\n case 'hide_cancellation_options':\n this.hideCancellationOptions = checked;\n break;\n case 'hide_rescheduling_options':\n this.hideReschedulingOptions = checked;\n break;\n }\n this.valueChanged.emit({\n value: JSON.stringify({\n additionalGuestsHidden: !this.allowGuestsToInvite,\n hideCancellationOptions: this.hideCancellationOptions,\n hideReschedulingOptions: this.hideReschedulingOptions,\n }),\n name: this.name,\n });\n this.internals.setFormValue(\n JSON.stringify({\n additionalGuestsHidden: !this.allowGuestsToInvite,\n hideCancellationOptions: this.hideCancellationOptions,\n hideReschedulingOptions: this.hideReschedulingOptions,\n }),\n this.name,\n );\n }\n\n @RegisterComponent<NylasCustomizeBookingSettings, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n name: 'nylas-customize-booking-settings',\n stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),\n fireRegisterEvent: true,\n })\n render() {\n const showComponent = typeof this.hideCancellationOptions === 'boolean' && typeof this.hideReschedulingOptions === 'boolean' && typeof this.allowGuestsToInvite === 'boolean';\n\n return (\n <Host>\n {showComponent && (\n <div class=\"nylas-customize-booking-settings\" part=\"ncbs\">\n <div class=\"header\" part=\"ncbs__header\">\n <h3>Additional settings</h3>\n <p>Booking settings for the event.</p>\n </div>\n\n <div class=\"nylas-customize-booking-settings__settings\" part=\"ncbs__settings\">\n <div class=\"nylas-customize-booking-settings__settings-div\" part=\"ncbs__settings-div , ncbs__additional_guests\">\n <checkbox-component name=\"hide_additional_guests\" label=\"Allow guests to invite additional guests.\" checked={this.allowGuestsToInvite}>\n <span slot=\"label\" class=\"label\">\n <p class=\"label-contents\">Allow guests to invite additional guests.</p>\n </span>\n </checkbox-component>\n </div>\n <div class=\"nylas-customize-booking-settings__settings-div\" part=\"ncbs__settings-div , ncbs__rescheduling_options\">\n <checkbox-component name=\"hide_rescheduling_options\" label=\"Hide 'Reschedule' option on booking page and emails.\" checked={this.hideReschedulingOptions}>\n <span slot=\"label\" class=\"label\">\n <p class=\"label-contents\">Hide rescheduling option.</p>\n <tooltip-component id=\"reschedule\">\n <info-icon slot=\"tooltip-icon\" />\n <span slot=\"tooltip-content\">\n Hide the <strong>Reschedule</strong> button in the booking confirmation and email notifications.\n </span>\n </tooltip-component>\n </span>\n </checkbox-component>\n </div>\n <div class=\"nylas-customize-booking-settings__settings-div\" part=\"ncbs__settings-div , ncbs__cancellation_options\">\n <checkbox-component name=\"hide_cancellation_options\" label=\"Hide 'Cancel' option on booking page and emails.\" checked={this.hideCancellationOptions}>\n <span slot=\"label\" class=\"label\">\n <p class=\"label-contents\">Hide cancellation option.</p>\n <tooltip-component id=\"cancel\">\n <info-icon slot=\"tooltip-icon\" />\n <span slot=\"tooltip-content\">\n Hide the <strong>Cancel</strong> button in the booking confirmation and email notifications.\n </span>\n </tooltip-component>\n </span>\n </checkbox-component>\n </div>\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"nylas-customize-booking-settings2.js","mappings":";;;;;;;AAAA,MAAM,gCAAgC,GAAG,iqEAAiqE,CAAC;AAC3sE,4CAAe,gCAAgC;;;;;;;;;;;;;;;;MCsBlC,6BAA6B;;;;;;;;2CAWO,IAAI,CAAC,qBAAqB,EAAE,SAAS,EAAE,sBAAsB,IAAI,KAAK;8CAMnE,IAAI,CAAC,qBAAqB,EAAE,SAAS,EAAE,yBAAyB,IAAI,KAAK;8CAMzE,IAAI,CAAC,qBAAqB,EAAE,SAAS,EAAE,yBAAyB,IAAI,KAAK;oBAMpG,4BAA4B;;;;;IAqCnD,yBAAyB,CAAC,QAAgB;QACxC,KAAK,CAAC,kCAAkC,EAAE,2BAA2B,EAAE,QAAQ,CAAC,CAAC;QACjF,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;KAC1C;IAGD,mCAAmC,CAAC,QAAuB;QACzD,KAAK,CAAC,kCAAkC,EAAE,qCAAqC,EAAE,QAAQ,CAAC,CAAC;QAC3F,IAAI,CAAC,mBAAmB,GAAG,CAAC,QAAQ,EAAE,SAAS,EAAE,sBAAsB,CAAC;QACxE,IAAI,CAAC,uBAAuB,GAAG,QAAQ,EAAE,SAAS,EAAE,yBAAyB,IAAI,KAAK,CAAC;QACvF,IAAI,CAAC,uBAAuB,GAAG,QAAQ,EAAE,SAAS,EAAE,yBAAyB,IAAI,KAAK,CAAC;KACxF;IAGD,iBAAiB;QACf,KAAK,CAAC,kCAAkC,EAAE,mBAAmB,CAAC,CAAC;KAChE;IAED,oBAAoB;QAClB,KAAK,CAAC,kCAAkC,EAAE,sBAAsB,CAAC,CAAC;KACnE;IAED,iBAAiB;QACf,KAAK,CAAC,kCAAkC,EAAE,mBAAmB,CAAC,CAAC;QAE/D,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;KAC3C;IAED,gBAAgB;QACd,KAAK,CAAC,kCAAkC,EAAE,kBAAkB,CAAC,CAAC;QAC9D,IAAI,IAAI,CAAC,qBAAqB,EAAE;YAC9B,IAAI,CAAC,mCAAmC,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;SACtE;aAAM;YAEL,IAAI,CAAC,mBAAmB,GAAG,CAAC,IAAI,CAAC,2BAA2B,CAAC;YAC7D,IAAI,CAAC,uBAAuB,GAAG,IAAI,CAAC,8BAA8B,CAAC;YACnE,IAAI,CAAC,uBAAuB,GAAG,IAAI,CAAC,8BAA8B,CAAC;SACpE;KACF;IAED,mBAAmB;QACjB,KAAK,CAAC,kCAAkC,EAAE,qBAAqB,CAAC,CAAC;KAClE;IAED,kBAAkB;QAChB,KAAK,CAAC,kCAAkC,EAAE,oBAAoB,CAAC,CAAC;KACjE;IAED,mBAAmB;QACjB,KAAK,CAAC,kCAAkC,EAAE,qBAAqB,CAAC,CAAC;KAClE;IAED,kBAAkB;QAChB,KAAK,CAAC,kCAAkC,EAAE,oBAAoB,CAAC,CAAC;KACjE;IAGD,sBAAsB,CAAC,KAAsD;QAC3E,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;QACvC,QAAQ,IAAI;YACV,KAAK,wBAAwB;gBAC3B,IAAI,CAAC,mBAAmB,GAAG,OAAO,CAAC;gBACnC,MAAM;YACR,KAAK,2BAA2B;gBAC9B,IAAI,CAAC,uBAAuB,GAAG,OAAO,CAAC;gBACvC,MAAM;YACR,KAAK,2BAA2B;gBAC9B,IAAI,CAAC,uBAAuB,GAAG,OAAO,CAAC;gBACvC,MAAM;SACT;QACD,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;YACrB,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC;gBACpB,sBAAsB,EAAE,CAAC,IAAI,CAAC,mBAAmB;gBACjD,uBAAuB,EAAE,IAAI,CAAC,uBAAuB;gBACrD,uBAAuB,EAAE,IAAI,CAAC,uBAAuB;aACtD,CAAC;YACF,IAAI,EAAE,IAAI,CAAC,IAAI;SAChB,CAAC,CAAC;QACH,IAAI,CAAC,SAAS,CAAC,YAAY,CACzB,IAAI,CAAC,SAAS,CAAC;YACb,sBAAsB,EAAE,CAAC,IAAI,CAAC,mBAAmB;YACjD,uBAAuB,EAAE,IAAI,CAAC,uBAAuB;YACrD,uBAAuB,EAAE,IAAI,CAAC,uBAAuB;SACtD,CAAC,EACF,IAAI,CAAC,IAAI,CACV,CAAC;KACH;IAOD,MAAM;QACJ,MAAM,aAAa,GAAG,OAAO,IAAI,CAAC,uBAAuB,KAAK,SAAS,IAAI,OAAO,IAAI,CAAC,uBAAuB,KAAK,SAAS,IAAI,OAAO,IAAI,CAAC,mBAAmB,KAAK,SAAS,CAAC;QAE9K,QACE,EAAC,IAAI,uDACF,aAAa,KACZ,WAAK,KAAK,EAAC,kCAAkC,EAAC,IAAI,EAAC,MAAM,IACvD,WAAK,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAC,cAAc,IACrC,oCAA4B,EAC5B,+CAAsC,CAClC,EAEN,WAAK,KAAK,EAAC,4CAA4C,EAAC,IAAI,EAAC,gBAAgB,IAC3E,WAAK,KAAK,EAAC,gDAAgD,EAAC,IAAI,EAAC,8CAA8C,IAC7G,0BAAoB,IAAI,EAAC,wBAAwB,EAAC,KAAK,EAAC,2CAA2C,EAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,IACnI,YAAM,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,IAC9B,SAAG,KAAK,EAAC,gBAAgB,gDAA8C,CAClE,CACY,CACjB,EACN,WAAK,KAAK,EAAC,gDAAgD,EAAC,IAAI,EAAC,iDAAiD,IAChH,0BAAoB,IAAI,EAAC,2BAA2B,EAAC,KAAK,EAAC,sDAAsD,EAAC,OAAO,EAAE,IAAI,CAAC,uBAAuB,IACrJ,YAAM,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,IAC9B,SAAG,KAAK,EAAC,gBAAgB,gCAA8B,EACvD,yBAAmB,EAAE,EAAC,YAAY,IAChC,iBAAW,IAAI,EAAC,cAAc,GAAG,EACjC,YAAM,IAAI,EAAC,iBAAiB,sBACZ,+BAA2B,sEACpC,CACW,CACf,CACY,CACjB,EACN,WAAK,KAAK,EAAC,gDAAgD,EAAC,IAAI,EAAC,iDAAiD,IAChH,0BAAoB,IAAI,EAAC,2BAA2B,EAAC,KAAK,EAAC,kDAAkD,EAAC,OAAO,EAAE,IAAI,CAAC,uBAAuB,IACjJ,YAAM,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,IAC9B,SAAG,KAAK,EAAC,gBAAgB,gCAA8B,EACvD,yBAAmB,EAAE,EAAC,QAAQ,IAC5B,iBAAW,IAAI,EAAC,cAAc,GAAG,EACjC,YAAM,IAAI,EAAC,iBAAiB,sBACZ,2BAAuB,sEAChC,CACW,CACf,CACY,CACjB,CACF,CACF,CACP,CACI,EACP;KACH;;;;;;;;;;;;;;;;;;;;;AAnDD;IALC,iBAAiB,CAAmH;QACnI,IAAI,EAAE,kCAAkC;QACxC,YAAY,EAAE,IAAI,GAAG,CAAC,CAAC,CAAC,uCAAuC,EAAE,uBAAuB,CAAC,CAAC,CAAC;QAC3F,iBAAiB,EAAE,IAAI;KACxB,CAAC;;;;2DAoDD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/scheduler-editor/nylas-customize-booking-settings/nylas-customize-booking-settings.scss?tag=nylas-customize-booking-settings&encapsulation=shadow","src/components/scheduler-editor/nylas-customize-booking-settings/nylas-customize-booking-settings.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-customize-booking-settings {\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 border-bottom: 1px solid var(--nylas-base-200);\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 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 .nylas-customize-booking-settings__settings {\n display: flex;\n flex-direction: column;\n gap: 1.5rem;\n padding: 1rem;\n margin: 1rem 0;\n .nylas-customize-booking-settings__settings-div {\n display: flex;\n align-items: center;\n gap: 4px;\n }\n }\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 .label-contents {\n margin: 0;\n display: inline-block;\n @media #{$mobile} {\n display: block;\n }\n }\n tooltip-component {\n display: inline-block;\n }\n}\n\ntooltip-component#guests::part(tc__content) {\n @media #{$mobile} {\n left: 58px;\n }\n}\n\ntooltip-component#reschedule::part(tc__content) {\n left: 58px;\n @media #{$mobile} {\n left: 58px;\n }\n}\n\ntooltip-component#cancel::part(tc__content) {\n left: -58px;\n @media #{$mobile} {\n left: 58px;\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 { Configuration } from '@nylas/core';\n\n/*\n The `nylas-customize-booking-settings` component is a UI component that displays the booking calendar picker.\n * @part ncbs - The booking calendar picker container\n * @part ncbs__header - The header of the booking calendar picker\n * @part ncbs__settings - The settings container\n * @part ncbs__settings-div - The div inside the settings container that contains the checkbox and tooltip for each setting\n * @part ncbs__additional_guests - The additional guests setting\n * @part ncbs__cancellation_options - The cancellation options setting\n * @part ncbs__rescheduling_options - The rescheduling options setting\n /\n@Component({\n tag: 'nylas-customize-booking-settings',\n styleUrl: 'nylas-customize-booking-settings.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class NylasCustomizeBookingSettings {\n @Element() host!: HTMLNylasCustomizeBookingSettingsElement;\n /\n @standalone\n * The selected config\n /\n @Prop() selectedConfiguration?: Configuration;\n /\n @standalone\n * The default additional guests hidden setting as set in the configuration.\n /\n @Prop() defaultHideAdditionalGuests: boolean = this.selectedConfiguration?.scheduler?.hide_additional_guests ?? false;\n\n /\n @standalone\n * The default hide cancellation options setting as set in the configuration.\n /\n @Prop() defaultHideCancellationOptions: boolean = this.selectedConfiguration?.scheduler?.hide_cancellation_options ?? false;\n\n /\n @standalone\n * The default hide rescheduling options setting as set in the configuration.\n /\n @Prop() defaultHideReschedulingOptions: boolean = this.selectedConfiguration?.scheduler?.hide_rescheduling_options ?? false;\n\n /\n @standalone\n * The name of the calendar picker.\n /\n @Prop() name: string = 'customize-booking-settings';\n\n /\n State to store the allowed additional guests setting.\n /\n @State() allowGuestsToInvite!: boolean;\n\n /\n State to store the hide cancel booking setting.\n /\n @State() hideCancellationOptions!: boolean;\n\n /\n State to store the hide reschedule booking setting.\n /\n @State() hideReschedulingOptions!: boolean;\n\n /\n The element internals.\n /\n @AttachInternals() internals!: ElementInternals;\n\n /\n This event is fired when the selected booking calendar changes.\n /\n @Event() valueChanged!: EventEmitter<{\n value: string;\n name: string;\n valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void;\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-customize-booking-settings', 'elementNameChangedHandler', newValue);\n this.host.setAttribute('name', newValue);\n }\n\n @Watch('selectedConfiguration')\n selectedConfigurationChangedHandler(newValue: Configuration) {\n debug('nylas-customize-booking-settings', 'selectedConfigurationChangedHandler', newValue);\n this.allowGuestsToInvite = !newValue?.scheduler?.hide_additional_guests;\n this.hideCancellationOptions = newValue?.scheduler?.hide_cancellation_options ?? false;\n this.hideReschedulingOptions = newValue?.scheduler?.hide_rescheduling_options ?? false;\n }\n\n // Lifecycle methods\n connectedCallback() {\n debug('nylas-customize-booking-settings', 'connectedCallback');\n }\n\n disconnectedCallback() {\n debug('nylas-customize-booking-settings', 'disconnectedCallback');\n }\n\n componentWillLoad() {\n debug('nylas-customize-booking-settings', '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-customize-booking-settings', 'componentDidLoad');\n if (this.selectedConfiguration) {\n this.selectedConfigurationChangedHandler(this.selectedConfiguration);\n } else {\n // Set the default values if the selected configuration is not available\n this.allowGuestsToInvite = !this.defaultHideAdditionalGuests;\n this.hideCancellationOptions = this.defaultHideCancellationOptions;\n this.hideReschedulingOptions = this.defaultHideReschedulingOptions;\n }\n }\n\n componentWillUpdate() {\n debug('nylas-customize-booking-settings', 'componentWillUpdate');\n }\n\n componentDidUpdate() {\n debug('nylas-customize-booking-settings', 'componentDidUpdate');\n }\n\n componentWillRender() {\n debug('nylas-customize-booking-settings', 'componentWillRender');\n }\n\n componentDidRender() {\n debug('nylas-customize-booking-settings', 'componentDidRender');\n }\n\n @Listen('nylasFormCheckboxToggled')\n checkboxToggledHandler(event: CustomEvent<{ name: string; checked: boolean }>) {\n const { name, checked } = event.detail;\n switch (name) {\n case 'hide_additional_guests':\n this.allowGuestsToInvite = checked;\n break;\n case 'hide_cancellation_options':\n this.hideCancellationOptions = checked;\n break;\n case 'hide_rescheduling_options':\n this.hideReschedulingOptions = checked;\n break;\n }\n this.valueChanged.emit({\n value: JSON.stringify({\n additionalGuestsHidden: !this.allowGuestsToInvite,\n hideCancellationOptions: this.hideCancellationOptions,\n hideReschedulingOptions: this.hideReschedulingOptions,\n }),\n name: this.name,\n });\n this.internals.setFormValue(\n JSON.stringify({\n additionalGuestsHidden: !this.allowGuestsToInvite,\n hideCancellationOptions: this.hideCancellationOptions,\n hideReschedulingOptions: this.hideReschedulingOptions,\n }),\n this.name,\n );\n }\n\n @RegisterComponent<NylasCustomizeBookingSettings, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n name: 'nylas-customize-booking-settings',\n stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),\n fireRegisterEvent: true,\n })\n render() {\n const showComponent = typeof this.hideCancellationOptions === 'boolean' && typeof this.hideReschedulingOptions === 'boolean' && typeof this.allowGuestsToInvite === 'boolean';\n\n return (\n <Host>\n {showComponent && (\n <div class=\"nylas-customize-booking-settings\" part=\"ncbs\">\n <div class=\"header\" part=\"ncbs__header\">\n <h3>Additional settings</h3>\n <p>Booking settings for the event.</p>\n </div>\n\n <div class=\"nylas-customize-booking-settings__settings\" part=\"ncbs__settings\">\n <div class=\"nylas-customize-booking-settings__settings-div\" part=\"ncbs__settings-div , ncbs__additional_guests\">\n <checkbox-component name=\"hide_additional_guests\" label=\"Allow guests to invite additional guests.\" checked={this.allowGuestsToInvite}>\n <span slot=\"label\" class=\"label\">\n <p class=\"label-contents\">Allow guests to invite additional guests.</p>\n </span>\n </checkbox-component>\n </div>\n <div class=\"nylas-customize-booking-settings__settings-div\" part=\"ncbs__settings-div , ncbs__rescheduling_options\">\n <checkbox-component name=\"hide_rescheduling_options\" label=\"Hide 'Reschedule' option on booking page and emails.\" checked={this.hideReschedulingOptions}>\n <span slot=\"label\" class=\"label\">\n <p class=\"label-contents\">Hide rescheduling option.</p>\n <tooltip-component id=\"reschedule\">\n <info-icon slot=\"tooltip-icon\" />\n <span slot=\"tooltip-content\">\n Hide the <strong>Reschedule</strong> button in the booking confirmation and email notifications.\n </span>\n </tooltip-component>\n </span>\n </checkbox-component>\n </div>\n <div class=\"nylas-customize-booking-settings__settings-div\" part=\"ncbs__settings-div , ncbs__cancellation_options\">\n <checkbox-component name=\"hide_cancellation_options\" label=\"Hide 'Cancel' option on booking page and emails.\" checked={this.hideCancellationOptions}>\n <span slot=\"label\" class=\"label\">\n <p class=\"label-contents\">Hide cancellation option.</p>\n <tooltip-component id=\"cancel\">\n <info-icon slot=\"tooltip-icon\" />\n <span slot=\"tooltip-content\">\n Hide the <strong>Cancel</strong> button in the booking confirmation and email notifications.\n </span>\n </tooltip-component>\n </span>\n </checkbox-component>\n </div>\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/nylas-date-picker2.js CHANGED Viewed

@@ -107,7 +107,7 @@ timeInterval((date) => {
   return Math.floor(date / durationDay);
 });
-const nylasDatePickerCss = ":host{display:block;min-height:444px}@media screen and (max-width: 768px){:host{min-height:auto}}.nylas-date-picker{display:flex;gap:1rem;flex-direction:column}.header{margin:0 0.5rem;height:48px}.header h2{font-size:1.3125rem;font-weight:400;line-height:1rem;color:var(--nylas-base-800)}.header h2 strong{font-weight:600}.title{margin:0 -1.25rem;display:flex;flex-direction:column;padding:0 1.5rem;gap:0.5rem;border-bottom:1px solid var(--nylas-base-200);font-family:var(--nylas-font-family)}.title h1{margin-bottom:0;font-size:18px;line-height:20px;font-weight:600;display:flex;gap:0.5rem;align-items:center}.title p{margin-top:0;font-size:16px;display:flex;gap:0.5rem;align-items:center}@keyframes pulsate{0%{background-color:var(--nylas-base-50)}50%{background-color:var(--nylas-base-100)}100%{background-color:var(--nylas-base-50)}}.dates{display:grid;justify-items:center;grid-template-columns:repeat(7, 1fr);gap:0.5rem;margin-bottom:24px}.dates .date{position:relative;display:flex;flex-direction:row;justify-content:center;align-items:center;height:48px;width:48px;min-width:2rem;min-height:2rem;cursor:pointer;border-radius:var(--nylas-border-radius-2x);font-size:16px;font-weight:600;font-family:inherit;color:var(--nylas-base-text);background-color:var(--nylas-base-100);cursor:pointer;border:none}@media screen and (max-width: 412px){.dates .date{width:38px;height:38px;min-width:none}}.dates .date:hover:not(:disabled){box-shadow:0 0 0 2px var(--nylas-base-500) inset}.dates .date.date.current-month{color:var(--nylas-base-800)}.dates .date.date.selected{background-color:var(--nylas-primary);color:var(--nylas-base-0);font-weight:700}.dates .date.date.day-skeleton{color:var(--nylas-base-300)}.dates .date:disabled{color:var(--nylas-base-300);background-color:transparent;font-weight:400;cursor:not-allowed}.dates .day{font-size:12px;color:var(--nylas-base-800);font-weight:600;letter-spacing:0.5px;height:32px;display:flex;align-items:center}@media screen and (max-width: 768px){.dates .day{font-size:14px}}.dates .date.day-skeleton{height:48px;width:48px;border-radius:var(--nylas-border-radius-2x);animation:pulsate 1.5s infinite ease-in-out;background-color:var(--nylas-base-50)}@media screen and (max-width: 412px){.dates .date.day-skeleton{width:38px;height:38px;min-width:none}}.dates .date.current-day::after{content:\"\";position:absolute;bottom:6px;left:50%;transform:translateX(-50%);width:6px;height:6px;border-radius:50%;background-color:var(--nylas-base-500)}.dates .date.current-day.selected::after{background-color:var(--nylas-base-100)}.pagination{display:flex;flex-direction:row;justify-content:space-between;align-items:center;min-width:92px}.pagination .chevron-right{transform:rotate(180deg)}.pagination .button{display:flex;flex-direction:row;justify-content:center;align-items:center;height:3vh;width:3vh;min-width:3em;min-height:3em;cursor:pointer;border-radius:var(--nylas-border-radius-2x);background-color:transparent;color:var(--nylas-base-800);cursor:pointer;border:none}.pagination .button:hover{background-color:var(--nylas-base-50)}.pagination .button:active{background-color:var(--nylas-base-100)}.pagination .button:disabled{background-color:transparent;color:var(--nylas-base-300);cursor:not-allowed}.flex-row{display:flex;flex-direction:row;justify-content:space-between;align-items:center;color:var(--nylas-base-500)}";
+const nylasDatePickerCss = ":host{display:block;min-height:444px;--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}@media screen and (max-width: 768px){:host{min-height:auto}}.nylas-date-picker{display:flex;gap:1rem;flex-direction:column}.header{margin:0 0.5rem;height:48px}.header h2{font-size:1.3125rem;font-weight:400;line-height:1rem;color:var(--nylas-base-800)}.header h2 strong{font-weight:600}.title{margin:0 -1.25rem;display:flex;flex-direction:column;padding:0 1.5rem;gap:0.5rem;border-bottom:1px solid var(--nylas-base-200);font-family:var(--nylas-font-family)}.title h1{margin-bottom:0;font-size:18px;line-height:20px;font-weight:600;display:flex;gap:0.5rem;align-items:center}.title p{margin-top:0;font-size:16px;display:flex;gap:0.5rem;align-items:center}@keyframes pulsate{0%{background-color:var(--nylas-base-50)}50%{background-color:var(--nylas-base-100)}100%{background-color:var(--nylas-base-50)}}.dates{display:grid;justify-items:center;grid-template-columns:repeat(7, 1fr);gap:0.5rem;margin-bottom:24px}.dates .date{position:relative;display:flex;flex-direction:row;justify-content:center;align-items:center;height:48px;width:48px;min-width:2rem;min-height:2rem;cursor:pointer;border-radius:var(--nylas-border-radius-2x);font-size:16px;font-weight:600;font-family:inherit;color:var(--nylas-base-text);background-color:var(--nylas-base-100);cursor:pointer;border:none}@media screen and (max-width: 412px){.dates .date{width:38px;height:38px;min-width:none}}.dates .date:hover:not(:disabled){box-shadow:0 0 0 2px var(--nylas-base-500) inset}.dates .date.date.current-month{color:var(--nylas-base-800)}.dates .date.date.selected{background-color:var(--nylas-primary);color:var(--nylas-base-0);font-weight:700}.dates .date.date.day-skeleton{color:var(--nylas-base-300)}.dates .date:disabled{color:var(--nylas-base-300);background-color:transparent;font-weight:400;cursor:not-allowed}.dates .day{font-size:12px;color:var(--nylas-base-800);font-weight:600;letter-spacing:0.5px;height:32px;display:flex;align-items:center}@media screen and (max-width: 768px){.dates .day{font-size:14px}}.dates .date.day-skeleton{height:48px;width:48px;border-radius:var(--nylas-border-radius-2x);animation:pulsate 1.5s infinite ease-in-out;background-color:var(--nylas-base-50)}@media screen and (max-width: 412px){.dates .date.day-skeleton{width:38px;height:38px;min-width:none}}.dates .date.current-day::after{content:\"\";position:absolute;bottom:6px;left:50%;transform:translateX(-50%);width:6px;height:6px;border-radius:50%;background-color:var(--nylas-base-500)}.dates .date.current-day.selected::after{background-color:var(--nylas-base-100)}.pagination{display:flex;flex-direction:row;justify-content:space-between;align-items:center;min-width:92px}.pagination .chevron-right{transform:rotate(180deg)}.pagination .button{display:flex;flex-direction:row;justify-content:center;align-items:center;height:3vh;width:3vh;min-width:3em;min-height:3em;cursor:pointer;border-radius:var(--nylas-border-radius-2x);background-color:transparent;color:var(--nylas-base-800);cursor:pointer;border:none}.pagination .button:hover{background-color:var(--nylas-base-50)}.pagination .button:active{background-color:var(--nylas-base-100)}.pagination .button:disabled{background-color:transparent;color:var(--nylas-base-300);cursor:not-allowed}.flex-row{display:flex;flex-direction:row;justify-content:space-between;align-items:center;color:var(--nylas-base-500)}";
 const NylasDatePickerStyle0 = nylasDatePickerCss;
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -132,8 +132,8 @@ const NylasDatePicker = proxyCustomElement(class NylasDatePicker extends HTMLEle
         this.dateSelected = createEvent(this, "dateSelected", 7);
         this.monthChanged = createEvent(this, "monthChanged", 7);
         this.selectableDates = undefined;
-        this.selectedDate = undefined;
         this.configSettings = undefined;
+        this.selectedDate = undefined;
         this.selectedLanguage = undefined;
         this.isLoading = undefined;
         this.eventDuration = undefined;
@@ -190,7 +190,7 @@ const NylasDatePicker = proxyCustomElement(class NylasDatePicker extends HTMLEle
         return date && selectableDates?.find(d => isSameDay(d, date)) === undefined;
     }
     render() {
-        return (h(Host, { key: '3e6dd28572687991de4841d639c5bdbd5d2d6e0b', part: "ndp" }, h("div", { key: 'b8a31231d9e04035c468f9c025bbd3adb4f0dbb2', class: "nylas-date-picker" }, h("div", { key: 'c25024241ce71fb94bcc485cc32614c820a69fee', class: "title", part: "ndp__title" }, this.configSettings?.name ? (h("h1", null, this.configSettings?.name)) : (this.configSettings?.organizer?.name && (h("h1", null, h("person-icon", null), this.configSettings?.organizer?.name || 'Organizer'))), h("p", { key: 'f51da2bb7f8b5d6b84ea5a9ea66aef03b9e10e12' }, h("clock-icon", { key: '42a947b00a14afe7c57c716e37ef4d418e55e337' }), this.eventDuration ? convertMinutesToHoursAndMinutes(this.eventDuration) : `- ${instance.t('time.minutes')}`)), h("div", { key: 'bb264f745cbe51ece10238e3a2f3fae55d2f1bdb', class: 'header flex-row' }, h("h2", { key: '16ecbac96e4ede32b8b524a645f96e30d16e2814', part: 'ndp__month-header' }, h("strong", { key: 'aaf8064ac4ebd41680fb4c147b5a23fc7e5554f2' }, translateMonth(this.month.toLocaleDateString(undefined, { month: 'long' }).toLocaleLowerCase())), "\u00A0", this.month.toLocaleDateString(undefined, { year: 'numeric' })), h("div", { key: '8d5fdca1f4de5d8b75c89ebf6bc6d964b39b8351', class: 'pagination' }, h("button", { key: 'f70a9c3d9a8bbcf75ce3f702f82d161a59e7c7c8', title: "Previous month", onClick: () => this.changeMonth(-1), class: { 'chevron-left': true, 'button': true }, disabled: !this.selectableDates?.length || this.month <= new Date(), part: "ndp__month-button" }, h("chevron-icon", { key: '8069fa1e5bfc7ef18f2f67f2ddb2fcfcb026ced3' })), h("button", { key: '6fde72c0e1bc2554ef284517637f35de19fcdd38', title: "Next month", onClick: () => this.changeMonth(1), class: { 'chevron-right': true, 'button': true }, disabled: this.disableNextMonthButton, part: "ndp__month-button" }, h("chevron-icon", { key: '79ec52b0c06fa56a763a9cb604ab54c746c63468' })))), h("div", { key: 'f099f477ac31c9e686f24b721d3032455653cdea', class: 'dates' }, [
+        return (h(Host, { key: '06638094c3e21b094641e5adbf08762b346fc10e', part: "ndp" }, h("div", { key: '370143e471513ab59c49dc369208365e5dcd1865', class: "nylas-date-picker" }, h("div", { key: '9b84a00eada140f2f142dec17a8418854160be87', class: "title", part: "ndp__title" }, this.configSettings?.name ? (h("h1", null, this.configSettings?.name)) : (this.configSettings?.organizer?.name && (h("h1", null, h("person-icon", null), this.configSettings?.organizer?.name || 'Organizer'))), h("p", { key: 'a64fee4f4c6886b31620cdc62de0769e3908b634' }, h("clock-icon", { key: 'e6c4d1cf6fd0b45e9824f26cb4f1a9fd828347d3' }), this.eventDuration ? convertMinutesToHoursAndMinutes(this.eventDuration) : `- ${instance.t('time.minutes')}`)), h("div", { key: '7568638d6af0fa03f84cf4b32b418c6b4f4df0de', class: 'header flex-row' }, h("h2", { key: '7b656957b240be95038151d5ca2089967b3704cd', part: 'ndp__month-header' }, h("strong", { key: 'cea1b1a9fc986885cb1425075364bb6b97b0d0e2' }, translateMonth(this.month.toLocaleDateString(undefined, { month: 'long' }).toLocaleLowerCase())), "\u00A0", this.month.toLocaleDateString(undefined, { year: 'numeric' })), h("div", { key: 'daf2f52ae4ca9e381fefadf53b9bf9f7a2c47987', class: 'pagination' }, h("button", { key: 'e182f6af777a122aaaa323fbada73258fd8bcf90', title: "Previous month", onClick: () => this.changeMonth(-1), class: { 'chevron-left': true, 'button': true }, disabled: !this.selectableDates?.length || this.month <= new Date(), part: "ndp__month-button" }, h("chevron-icon", { key: 'a9703cc9a0cbfc72e800f72a56233467bff2e5f9' })), h("button", { key: 'bcafc749f794352746d64974e8e564a5db1125a4', title: "Next month", onClick: () => this.changeMonth(1), class: { 'chevron-right': true, 'button': true }, disabled: this.disableNextMonthButton, part: "ndp__month-button" }, h("chevron-icon", { key: '5fc036471ed8f1caabe79e8489321070d9b6eae3' })))), h("div", { key: '701d99cc45475a8b9217893bfa56c0fa80f61520', class: 'dates' }, [
             instance.t('days.sunday'),
             instance.t('days.monday'),
             instance.t('days.tuesday'),
@@ -223,8 +223,8 @@ const NylasDatePicker = proxyCustomElement(class NylasDatePicker extends HTMLEle
     static get style() { return NylasDatePickerStyle0; }
 }, [1, "nylas-date-picker", {
         "selectableDates": [16],
-        "selectedDate": [16],
         "configSettings": [16],
+        "selectedDate": [16],
         "selectedLanguage": [1, "selected-language"],
         "isLoading": [4, "is-loading"],
         "eventDuration": [2, "event-duration"],

package/dist/components/nylas-date-picker2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nylas-date-picker2.js","mappings":"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","names":["i18next"],"sources":["../../node_modules/.pnpm/d3-time@3.1.0/node_modules/d3-time/src/interval.js","../../node_modules/.pnpm/d3-time@3.1.0/node_modules/d3-time/src/duration.js","../../node_modules/.pnpm/d3-time@3.1.0/node_modules/d3-time/src/day.js","src/components/scheduler/nylas-date-picker/nylas-date-picker.scss?tag=nylas-date-picker&encapsulation=shadow","src/components/scheduler/nylas-date-picker/nylas-date-picker.tsx"],"sourcesContent":["const t0 = new Date, t1 = new Date;\n\nexport function timeInterval(floori, offseti, count, field) {\n\n function interval(date) {\n return floori(date = arguments.length === 0 ? new Date : new Date(+date)), date;\n }\n\n interval.floor = (date) => {\n return floori(date = new Date(+date)), date;\n };\n\n interval.ceil = (date) => {\n return floori(date = new Date(date - 1)), offseti(date, 1), floori(date), date;\n };\n\n interval.round = (date) => {\n const d0 = interval(date), d1 = interval.ceil(date);\n return date - d0 < d1 - date ? d0 : d1;\n };\n\n interval.offset = (date, step) => {\n return offseti(date = new Date(+date), step == null ? 1 : Math.floor(step)), date;\n };\n\n interval.range = (start, stop, step) => {\n const range = [];\n start = interval.ceil(start);\n step = step == null ? 1 : Math.floor(step);\n if (!(start < stop) \|\| !(step > 0)) return range; // also handles Invalid Date\n let previous;\n do range.push(previous = new Date(+start)), offseti(start, step), floori(start);\n while (previous < start && start < stop);\n return range;\n };\n\n interval.filter = (test) => {\n return timeInterval((date) => {\n if (date >= date) while (floori(date), !test(date)) date.setTime(date - 1);\n }, (date, step) => {\n if (date >= date) {\n if (step < 0) while (++step <= 0) {\n while (offseti(date, -1), !test(date)) {} // eslint-disable-line no-empty\n } else while (--step >= 0) {\n while (offseti(date, +1), !test(date)) {} // eslint-disable-line no-empty\n }\n }\n });\n };\n\n if (count) {\n interval.count = (start, end) => {\n t0.setTime(+start), t1.setTime(+end);\n floori(t0), floori(t1);\n return Math.floor(count(t0, t1));\n };\n\n interval.every = (step) => {\n step = Math.floor(step);\n return !isFinite(step) \|\| !(step > 0) ? null\n : !(step > 1) ? interval\n : interval.filter(field\n ? (d) => field(d) % step === 0\n : (d) => interval.count(0, d) % step === 0);\n };\n }\n\n return interval;\n}\n","export const durationSecond = 1000;\nexport const durationMinute = durationSecond * 60;\nexport const durationHour = durationMinute * 60;\nexport const durationDay = durationHour * 24;\nexport const durationWeek = durationDay * 7;\nexport const durationMonth = durationDay * 30;\nexport const durationYear = durationDay * 365;\n","import {timeInterval} from \"./interval.js\";\nimport {durationDay, durationMinute} from \"./duration.js\";\n\nexport const timeDay = timeInterval(\n date => date.setHours(0, 0, 0, 0),\n (date, step) => date.setDate(date.getDate() + step),\n (start, end) => (end - start - (end.getTimezoneOffset() - start.getTimezoneOffset()) * durationMinute) / durationDay,\n date => date.getDate() - 1\n);\n\nexport const timeDays = timeDay.range;\n\nexport const utcDay = timeInterval((date) => {\n date.setUTCHours(0, 0, 0, 0);\n}, (date, step) => {\n date.setUTCDate(date.getUTCDate() + step);\n}, (start, end) => {\n return (end - start) / durationDay;\n}, (date) => {\n return date.getUTCDate() - 1;\n});\n\nexport const utcDays = utcDay.range;\n\nexport const unixDay = timeInterval((date) => {\n date.setUTCHours(0, 0, 0, 0);\n}, (date, step) => {\n date.setUTCDate(date.getUTCDate() + step);\n}, (start, end) => {\n return (end - start) / durationDay;\n}, (date) => {\n return Math.floor(date / durationDay);\n});\n\nexport const unixDays = unixDay.range;\n","@import '../../../common/styles/variables.scss';\n\n:host {\n display: block;\n min-height: 444px;\n\n @media #{$mobile} {\n min-height: auto;\n }\n}\n\n.nylas-date-picker {\n display: flex;\n gap: 1rem;\n flex-direction: column;\n}\n\n.header {\n margin: 0 0.5rem;\n height: 48px;\n\n h2 {\n font-size: 1.3125rem;\n font-weight: 400;\n line-height: 1rem;\n color: var(--nylas-base-800);\n\n strong {\n font-weight: 600;\n }\n }\n}\n\n.title {\n margin: 0 -1.25rem;\n display: flex;\n flex-direction: column;\n padding: 0 1.5rem;\n gap: 0.5rem;\n border-bottom: 1px solid var(--nylas-base-200);\n font-family: var(--nylas-font-family);\n\n h1 {\n margin-bottom: 0;\n font-size: 18px;\n line-height: 20px;\n font-weight: 600;\n display: flex;\n gap: 0.5rem;\n align-items: center;\n }\n\n p {\n margin-top: 0;\n font-size: 16px;\n display: flex;\n gap: 0.5rem;\n align-items: center;\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.dates {\n display: grid;\n justify-items: center;\n grid-template-columns: repeat(7, 1fr);\n gap: 0.5rem;\n margin-bottom: 24px;\n\n .date {\n position: relative;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n height: 48px;\n width: 48px;\n min-width: 2rem;\n min-height: 2rem;\n cursor: pointer;\n border-radius: var(--nylas-border-radius-2x);\n font-size: 16px;\n font-weight: 600;\n font-family: inherit;\n\n @media #{$x-small-mobile} {\n width: 38px;\n height: 38px;\n min-width: none;\n }\n\n color: var(--nylas-base-text);\n background-color: var(--nylas-base-100);\n cursor: pointer;\n\n &:hover:not(:disabled) {\n box-shadow: 0 0 0 2px var(--nylas-base-500) inset;\n }\n\n border: none;\n\n &.date.current-month {\n color: var(--nylas-base-800);\n }\n\n &.date.selected {\n background-color: var(--nylas-primary);\n color: var(--nylas-base-0);\n font-weight: 700;\n }\n\n &.date.day-skeleton {\n color: var(--nylas-base-300);\n }\n\n &:disabled {\n color: var(--nylas-base-300);\n background-color: transparent;\n font-weight: 400;\n cursor: not-allowed;\n }\n }\n\n .day {\n font-size: 12px;\n color: var(--nylas-base-800);\n font-weight: 600;\n letter-spacing: 0.5px;\n height: 32px;\n display: flex;\n align-items: center;\n\n @media #{$mobile} {\n font-size: 14px;\n }\n }\n\n .date.day-skeleton {\n height: 48px;\n width: 48px;\n\n @media #{$x-small-mobile} {\n width: 38px;\n height: 38px;\n min-width: none;\n }\n\n border-radius: var(--nylas-border-radius-2x);\n animation: pulsate 1.5s infinite ease-in-out;\n background-color: var(--nylas-base-50);\n }\n\n .date.current-day::after {\n content: '';\n position: absolute;\n bottom: 6px;\n left: 50%;\n transform: translateX(-50%);\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background-color: var(--nylas-base-500);\n }\n\n .date.current-day.selected::after {\n background-color: var(--nylas-base-100);\n }\n}\n\n.pagination {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n min-width: 92px;\n\n .chevron-right {\n transform: rotate(180deg);\n }\n\n .button {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n height: 3vh;\n width: 3vh;\n min-width: 3em;\n min-height: 3em;\n cursor: pointer;\n border-radius: var(--nylas-border-radius-2x);\n\n background-color: transparent;\n color: var(--nylas-base-800);\n cursor: pointer;\n\n &:hover {\n background-color: var(--nylas-base-50);\n }\n\n border: none;\n\n &:active {\n background-color: var(--nylas-base-100);\n }\n\n &:disabled {\n background-color: transparent;\n color: var(--nylas-base-300);\n cursor: not-allowed;\n }\n }\n}\n\n.flex-row {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n color: var(--nylas-base-500);\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { addDaysToCurrentDate, convertMinutesToHoursAndMinutes, getFirstDayOfMonth, getLastDayOfMonth, isSameDay, isSameMonth, translateMonth } from '@/utils/utils';\nimport { Component, Event, EventEmitter, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { timeDay } from 'd3-time';\nimport { NylasSchedulerConnector } from '../../..';\nimport { NylasScheduling } from '../nylas-scheduling/nylas-scheduling';\nimport { ConfigSettings } from '@/stores/scheduler-store';\nimport i18next from '@/utils/i18n';\nimport { debug } from '@/utils/utils';\n\n/*\n The `nylas-date-picker` component is a UI component that allows users to select a date.\n \n @part ndp - The date picker host.\n * @part ndp__title - The title.\n * @part ndp__month-header - The month header.\n * @part ndp__month-button - The month button.\n * @part ndp__day - The day.\n * @part ndp__date - The date.\n * @part ndp__date--selected - The selected date.\n * @part ndp__date--current-day - The current day.\n * @part ndp__date--current-month - The dates in the current month.\n * @part ndp__date--disabled - The disabled dates.\n /\n@Component({\n tag: 'nylas-date-picker',\n styleUrl: 'nylas-date-picker.scss',\n shadow: true,\n})\nexport class NylasDatePicker {\n /\n The dates that are selectable.\n /\n @Prop() selectableDates?: Date[];\n\n /\n The selected date.\n /\n @Prop() selectedDate?: Date;\n\n /\n The config settings.\n /\n @Prop() configSettings?: ConfigSettings;\n\n /\n The selected language.\n /\n @Prop() selectedLanguage?: string;\n\n /\n The loading state.\n /\n @Prop() readonly isLoading?: boolean;\n\n /\n The event duration.\n /\n @Prop() readonly eventDuration?: number;\n\n /\n The month to display.\n /\n @State() month: Date = this.selectedDate \|\| new Date();\n\n /\n The dates to render.\n /\n @State() dates: Date[] = this.getDates();\n\n /\n The state to disable the next month button.\n /\n @State() disableNextMonthButton: boolean = false;\n\n /\n This event is fired when a date is selected.\n /\n @Event() dateSelected!: EventEmitter<Date>;\n\n /\n This event is fired when the month is changed.\n /\n @Event() monthChanged!: EventEmitter<Date>;\n\n @Watch('configSettings')\n configSettingsChanged(newConfigSettings: ConfigSettings) {\n const nextMonth = new Date(this.month.getFullYear(), this.month.getMonth() + 1, 1);\n const availableDaysInFuture = newConfigSettings?.scheduler?.available_days_in_future;\n if (availableDaysInFuture === undefined) {\n return;\n }\n const endDate = addDaysToCurrentDate(new Date(), availableDaysInFuture);\n if (endDate.getTime() < nextMonth.getTime()) {\n this.disableNextMonthButton = true;\n } else {\n this.disableNextMonthButton = false;\n }\n }\n\n @Watch('selectedLanguage')\n selectedLanguageChanged(newLanguage: string) {\n i18next.changeLanguage(newLanguage);\n }\n\n connectedCallback() {}\n\n disconnectedCallback() {}\n\n componentWillLoad() {}\n\n /\n Get the dates to render, including the days from the previous and next months.\n * @returns The dates to render.\n /\n private getDates() {\n const lastDayOfMonth = getLastDayOfMonth(this.month);\n const firstDayOfMonth = getFirstDayOfMonth(this.month);\n\n return timeDay.range(timeDay.offset(firstDayOfMonth, -firstDayOfMonth.getDay()), timeDay.offset(lastDayOfMonth, 7 - lastDayOfMonth.getDay()));\n }\n\n /\n Select a date.\n * @param date The date to select.\n /\n private selectDate(date?: Date) {\n this.dateSelected.emit(date);\n }\n\n /\n Change the month.\n * @param change The change in months.\n /\n private changeMonth(change: number) {\n this.month = new Date(this.month.getFullYear(), this.month.getMonth() + change, 1);\n const nextMonth = new Date(this.month.getFullYear(), this.month.getMonth() + 1, 1);\n const availableDaysInFuture = this.configSettings?.scheduler?.available_days_in_future;\n const endDate = addDaysToCurrentDate(new Date(), availableDaysInFuture);\n if (endDate.getTime() < nextMonth.getTime()) {\n this.disableNextMonthButton = true;\n } else {\n this.disableNextMonthButton = false;\n }\n this.dates = this.getDates();\n this.monthChanged.emit(this.month);\n }\n\n private isSelected(date: Date \| undefined, selectedDate: Date \| undefined, selectableDates: Date[] \| undefined) {\n return date && selectedDate && isSameDay(date, selectedDate) && selectableDates && selectableDates?.length > 0;\n }\n\n private isDisabled(date: Date \| undefined, selectableDates: Date[] \| undefined) {\n return date && selectableDates?.find(d => isSameDay(d, date)) === undefined;\n }\n\n @RegisterComponent<NylasDatePicker, NylasSchedulerConnector, Exclude<NylasScheduling['stores'], undefined>>({\n name: 'nylas-date-picker',\n stateToProps: new Map([\n ['scheduler.selectableDates', 'selectableDates'],\n ['scheduler.selectedDate', 'selectedDate'],\n ['scheduler.isLoading', 'isLoading'],\n ['scheduler.configSettings', 'configSettings'],\n ['scheduler.eventDuration', 'eventDuration'],\n ['scheduler.selectedLanguage', 'selectedLanguage'],\n ]),\n eventToProps: {\n dateSelected: async (event: CustomEvent<Date>, nylasSchedulerConnector: NylasSchedulerConnector) => {\n debug('nylas-date-picker', 'dateSelected', event.detail);\n nylasSchedulerConnector.scheduler.selectDate(event.detail);\n },\n monthChanged: async (event: CustomEvent<Date>, _nylasSchedulerConnector: NylasSchedulerConnector) => {\n debug('nylas-date-picker', 'monthChanged', event.detail);\n },\n },\n fireRegisterEvent: true,\n })\n render() {\n return (\n <Host part=\"ndp\">\n <div class=\"nylas-date-picker\">\n <div class=\"title\" part=\"ndp__title\">\n {this.configSettings?.name ? (\n <h1>{this.configSettings?.name}</h1>\n ) : (\n this.configSettings?.organizer?.name && (\n <h1>\n <person-icon />\n {this.configSettings?.organizer?.name \|\| 'Organizer'}\n </h1>\n )\n )}\n <p>\n <clock-icon />\n {this.eventDuration ? convertMinutesToHoursAndMinutes(this.eventDuration) : `- ${i18next.t('time.minutes')}`}\n </p>\n </div>\n <div class={'header flex-row'}>\n <h2 part={'ndp__month-header'}>\n <strong>{translateMonth(this.month.toLocaleDateString(undefined, { month: 'long' }).toLocaleLowerCase())}</strong>\n  \n {this.month.toLocaleDateString(undefined, { year: 'numeric' })}\n </h2>\n <div class={'pagination'}>\n <button\n title=\"Previous month\"\n onClick={() => this.changeMonth(-1)}\n class={{ 'chevron-left': true, 'button': true }}\n disabled={!this.selectableDates?.length \|\| this.month <= new Date()}\n part=\"ndp__month-button\"\n >\n <chevron-icon />\n </button>\n <button\n title=\"Next month\"\n onClick={() => this.changeMonth(1)}\n class={{ 'chevron-right': true, 'button': true }}\n disabled={this.disableNextMonthButton}\n part=\"ndp__month-button\"\n >\n <chevron-icon />\n </button>\n </div>\n </div>\n\n <div class={'dates'}>\n {[\n i18next.t('days.sunday'),\n i18next.t('days.monday'),\n i18next.t('days.tuesday'),\n i18next.t('days.wednesday'),\n i18next.t('days.thursday'),\n i18next.t('days.friday'),\n i18next.t('days.saturday'),\n ].map(day => {\n return (\n <div class={'day'} part=\"ndp__day\">\n {day}\n </div>\n );\n })}\n {this.dates.map((date, i) => {\n const isDisabled = this.isDisabled(date, this.selectableDates);\n\n if (this.isLoading) {\n return (\n <button\n disabled\n class={{\n 'date day-skeleton': true,\n 'current-month': isSameMonth(date, this.month),\n }}\n style={{ animationDelay: `${i 20}ms` }}\n part={`ndp__date ndp__date--disabled`}\n >\n {date.getDate()}\n </button>\n );\n }\n return (\n <button\n class={{\n 'date': true,\n 'selected': !!(this.selectedDate && isSameDay(date, this.selectedDate) && this.selectableDates && this.selectableDates?.length > 0),\n 'current-day': isSameDay(date, new Date()),\n 'current-month': isSameMonth(date, this.month),\n }}\n aria-lang={date.toLocaleDateString(undefined, { dateStyle: 'full' })}\n disabled={isDisabled}\n onClick={() => this.selectDate(date)}\n part={`ndp__date ${this.isSelected(date, this.selectedDate, this.selectableDates) ? 'ndp__date--selected' : ''} ${isSameDay(date, new Date()) ? 'ndp__date--current-day' : ''} ${isSameMonth(date, this.month) ? 'ndp__date--current-month' : ''}`}\n >\n {date.getDate()}\n </button>\n );\n })}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"nylas-date-picker2.js","mappings":"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","names":["i18next"],"sources":["../../node_modules/.pnpm/d3-time@3.1.0/node_modules/d3-time/src/interval.js","../../node_modules/.pnpm/d3-time@3.1.0/node_modules/d3-time/src/duration.js","../../node_modules/.pnpm/d3-time@3.1.0/node_modules/d3-time/src/day.js","src/components/scheduler/nylas-date-picker/nylas-date-picker.scss?tag=nylas-date-picker&encapsulation=shadow","src/components/scheduler/nylas-date-picker/nylas-date-picker.tsx"],"sourcesContent":["const t0 = new Date, t1 = new Date;\n\nexport function timeInterval(floori, offseti, count, field) {\n\n function interval(date) {\n return floori(date = arguments.length === 0 ? new Date : new Date(+date)), date;\n }\n\n interval.floor = (date) => {\n return floori(date = new Date(+date)), date;\n };\n\n interval.ceil = (date) => {\n return floori(date = new Date(date - 1)), offseti(date, 1), floori(date), date;\n };\n\n interval.round = (date) => {\n const d0 = interval(date), d1 = interval.ceil(date);\n return date - d0 < d1 - date ? d0 : d1;\n };\n\n interval.offset = (date, step) => {\n return offseti(date = new Date(+date), step == null ? 1 : Math.floor(step)), date;\n };\n\n interval.range = (start, stop, step) => {\n const range = [];\n start = interval.ceil(start);\n step = step == null ? 1 : Math.floor(step);\n if (!(start < stop) \|\| !(step > 0)) return range; // also handles Invalid Date\n let previous;\n do range.push(previous = new Date(+start)), offseti(start, step), floori(start);\n while (previous < start && start < stop);\n return range;\n };\n\n interval.filter = (test) => {\n return timeInterval((date) => {\n if (date >= date) while (floori(date), !test(date)) date.setTime(date - 1);\n }, (date, step) => {\n if (date >= date) {\n if (step < 0) while (++step <= 0) {\n while (offseti(date, -1), !test(date)) {} // eslint-disable-line no-empty\n } else while (--step >= 0) {\n while (offseti(date, +1), !test(date)) {} // eslint-disable-line no-empty\n }\n }\n });\n };\n\n if (count) {\n interval.count = (start, end) => {\n t0.setTime(+start), t1.setTime(+end);\n floori(t0), floori(t1);\n return Math.floor(count(t0, t1));\n };\n\n interval.every = (step) => {\n step = Math.floor(step);\n return !isFinite(step) \|\| !(step > 0) ? null\n : !(step > 1) ? interval\n : interval.filter(field\n ? (d) => field(d) % step === 0\n : (d) => interval.count(0, d) % step === 0);\n };\n }\n\n return interval;\n}\n","export const durationSecond = 1000;\nexport const durationMinute = durationSecond * 60;\nexport const durationHour = durationMinute * 60;\nexport const durationDay = durationHour * 24;\nexport const durationWeek = durationDay * 7;\nexport const durationMonth = durationDay * 30;\nexport const durationYear = durationDay * 365;\n","import {timeInterval} from \"./interval.js\";\nimport {durationDay, durationMinute} from \"./duration.js\";\n\nexport const timeDay = timeInterval(\n date => date.setHours(0, 0, 0, 0),\n (date, step) => date.setDate(date.getDate() + step),\n (start, end) => (end - start - (end.getTimezoneOffset() - start.getTimezoneOffset()) * durationMinute) / durationDay,\n date => date.getDate() - 1\n);\n\nexport const timeDays = timeDay.range;\n\nexport const utcDay = timeInterval((date) => {\n date.setUTCHours(0, 0, 0, 0);\n}, (date, step) => {\n date.setUTCDate(date.getUTCDate() + step);\n}, (start, end) => {\n return (end - start) / durationDay;\n}, (date) => {\n return date.getUTCDate() - 1;\n});\n\nexport const utcDays = utcDay.range;\n\nexport const unixDay = timeInterval((date) => {\n date.setUTCHours(0, 0, 0, 0);\n}, (date, step) => {\n date.setUTCDate(date.getUTCDate() + step);\n}, (start, end) => {\n return (end - start) / durationDay;\n}, (date) => {\n return Math.floor(date / durationDay);\n});\n\nexport const unixDays = unixDay.range;\n","@import '../../../common/styles/variables.scss';\n\n:host {\n display: block;\n min-height: 444px;\n @include default-css-variables;\n\n @media #{$mobile} {\n min-height: auto;\n }\n}\n\n.nylas-date-picker {\n display: flex;\n gap: 1rem;\n flex-direction: column;\n}\n\n.header {\n margin: 0 0.5rem;\n height: 48px;\n\n h2 {\n font-size: 1.3125rem;\n font-weight: 400;\n line-height: 1rem;\n color: var(--nylas-base-800);\n\n strong {\n font-weight: 600;\n }\n }\n}\n\n.title {\n margin: 0 -1.25rem;\n display: flex;\n flex-direction: column;\n padding: 0 1.5rem;\n gap: 0.5rem;\n border-bottom: 1px solid var(--nylas-base-200);\n font-family: var(--nylas-font-family);\n\n h1 {\n margin-bottom: 0;\n font-size: 18px;\n line-height: 20px;\n font-weight: 600;\n display: flex;\n gap: 0.5rem;\n align-items: center;\n }\n\n p {\n margin-top: 0;\n font-size: 16px;\n display: flex;\n gap: 0.5rem;\n align-items: center;\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.dates {\n display: grid;\n justify-items: center;\n grid-template-columns: repeat(7, 1fr);\n gap: 0.5rem;\n margin-bottom: 24px;\n\n .date {\n position: relative;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n height: 48px;\n width: 48px;\n min-width: 2rem;\n min-height: 2rem;\n cursor: pointer;\n border-radius: var(--nylas-border-radius-2x);\n font-size: 16px;\n font-weight: 600;\n font-family: inherit;\n\n @media #{$x-small-mobile} {\n width: 38px;\n height: 38px;\n min-width: none;\n }\n\n color: var(--nylas-base-text);\n background-color: var(--nylas-base-100);\n cursor: pointer;\n\n &:hover:not(:disabled) {\n box-shadow: 0 0 0 2px var(--nylas-base-500) inset;\n }\n\n border: none;\n\n &.date.current-month {\n color: var(--nylas-base-800);\n }\n\n &.date.selected {\n background-color: var(--nylas-primary);\n color: var(--nylas-base-0);\n font-weight: 700;\n }\n\n &.date.day-skeleton {\n color: var(--nylas-base-300);\n }\n\n &:disabled {\n color: var(--nylas-base-300);\n background-color: transparent;\n font-weight: 400;\n cursor: not-allowed;\n }\n }\n\n .day {\n font-size: 12px;\n color: var(--nylas-base-800);\n font-weight: 600;\n letter-spacing: 0.5px;\n height: 32px;\n display: flex;\n align-items: center;\n\n @media #{$mobile} {\n font-size: 14px;\n }\n }\n\n .date.day-skeleton {\n height: 48px;\n width: 48px;\n\n @media #{$x-small-mobile} {\n width: 38px;\n height: 38px;\n min-width: none;\n }\n\n border-radius: var(--nylas-border-radius-2x);\n animation: pulsate 1.5s infinite ease-in-out;\n background-color: var(--nylas-base-50);\n }\n\n .date.current-day::after {\n content: '';\n position: absolute;\n bottom: 6px;\n left: 50%;\n transform: translateX(-50%);\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background-color: var(--nylas-base-500);\n }\n\n .date.current-day.selected::after {\n background-color: var(--nylas-base-100);\n }\n}\n\n.pagination {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n min-width: 92px;\n\n .chevron-right {\n transform: rotate(180deg);\n }\n\n .button {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n height: 3vh;\n width: 3vh;\n min-width: 3em;\n min-height: 3em;\n cursor: pointer;\n border-radius: var(--nylas-border-radius-2x);\n\n background-color: transparent;\n color: var(--nylas-base-800);\n cursor: pointer;\n\n &:hover {\n background-color: var(--nylas-base-50);\n }\n\n border: none;\n\n &:active {\n background-color: var(--nylas-base-100);\n }\n\n &:disabled {\n background-color: transparent;\n color: var(--nylas-base-300);\n cursor: not-allowed;\n }\n }\n}\n\n.flex-row {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n color: var(--nylas-base-500);\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { addDaysToCurrentDate, convertMinutesToHoursAndMinutes, getFirstDayOfMonth, getLastDayOfMonth, isSameDay, isSameMonth, translateMonth } from '@/utils/utils';\nimport { Component, Event, EventEmitter, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { timeDay } from 'd3-time';\nimport { NylasSchedulerConnector } from '../../..';\nimport { NylasScheduling } from '../nylas-scheduling/nylas-scheduling';\nimport { ConfigSettings } from '@/stores/scheduler-store';\nimport i18next from '@/utils/i18n';\nimport { debug } from '@/utils/utils';\n\n/*\n The `nylas-date-picker` component is a UI component that allows users to select a date.\n \n @part ndp - The date picker host.\n * @part ndp__title - The title.\n * @part ndp__month-header - The month header.\n * @part ndp__month-button - The month button.\n * @part ndp__day - The day.\n * @part ndp__date - The date.\n * @part ndp__date--selected - The selected date.\n * @part ndp__date--current-day - The current day.\n * @part ndp__date--current-month - The dates in the current month.\n * @part ndp__date--disabled - The disabled dates.\n /\n@Component({\n tag: 'nylas-date-picker',\n styleUrl: 'nylas-date-picker.scss',\n shadow: true,\n})\nexport class NylasDatePicker {\n /\n @standalone\n * The dates that are selectable.\n /\n @Prop() selectableDates?: Date[];\n\n /\n @standalone\n * The config settings.\n /\n @Prop() configSettings?: ConfigSettings;\n\n /\n The selected date.\n /\n @Prop() selectedDate?: Date;\n\n /\n The selected language.\n /\n @Prop() selectedLanguage?: string;\n\n /\n The loading state.\n /\n @Prop() readonly isLoading?: boolean;\n\n /\n The event duration.\n /\n @Prop() readonly eventDuration?: number;\n\n /\n The month to display.\n /\n @State() month: Date = this.selectedDate \|\| new Date();\n\n /\n The dates to render.\n /\n @State() dates: Date[] = this.getDates();\n\n /\n The state to disable the next month button.\n /\n @State() disableNextMonthButton: boolean = false;\n\n /\n This event is fired when a date is selected.\n /\n @Event() dateSelected!: EventEmitter<Date>;\n\n /\n This event is fired when the month is changed.\n /\n @Event() monthChanged!: EventEmitter<Date>;\n\n @Watch('configSettings')\n configSettingsChanged(newConfigSettings: ConfigSettings) {\n const nextMonth = new Date(this.month.getFullYear(), this.month.getMonth() + 1, 1);\n const availableDaysInFuture = newConfigSettings?.scheduler?.available_days_in_future;\n if (availableDaysInFuture === undefined) {\n return;\n }\n const endDate = addDaysToCurrentDate(new Date(), availableDaysInFuture);\n if (endDate.getTime() < nextMonth.getTime()) {\n this.disableNextMonthButton = true;\n } else {\n this.disableNextMonthButton = false;\n }\n }\n\n @Watch('selectedLanguage')\n selectedLanguageChanged(newLanguage: string) {\n i18next.changeLanguage(newLanguage);\n }\n\n connectedCallback() {}\n\n disconnectedCallback() {}\n\n componentWillLoad() {}\n\n /\n Get the dates to render, including the days from the previous and next months.\n * @returns The dates to render.\n /\n private getDates() {\n const lastDayOfMonth = getLastDayOfMonth(this.month);\n const firstDayOfMonth = getFirstDayOfMonth(this.month);\n\n return timeDay.range(timeDay.offset(firstDayOfMonth, -firstDayOfMonth.getDay()), timeDay.offset(lastDayOfMonth, 7 - lastDayOfMonth.getDay()));\n }\n\n /\n Select a date.\n * @param date The date to select.\n /\n private selectDate(date?: Date) {\n this.dateSelected.emit(date);\n }\n\n /\n Change the month.\n * @param change The change in months.\n /\n private changeMonth(change: number) {\n this.month = new Date(this.month.getFullYear(), this.month.getMonth() + change, 1);\n const nextMonth = new Date(this.month.getFullYear(), this.month.getMonth() + 1, 1);\n const availableDaysInFuture = this.configSettings?.scheduler?.available_days_in_future;\n const endDate = addDaysToCurrentDate(new Date(), availableDaysInFuture);\n if (endDate.getTime() < nextMonth.getTime()) {\n this.disableNextMonthButton = true;\n } else {\n this.disableNextMonthButton = false;\n }\n this.dates = this.getDates();\n this.monthChanged.emit(this.month);\n }\n\n private isSelected(date: Date \| undefined, selectedDate: Date \| undefined, selectableDates: Date[] \| undefined) {\n return date && selectedDate && isSameDay(date, selectedDate) && selectableDates && selectableDates?.length > 0;\n }\n\n private isDisabled(date: Date \| undefined, selectableDates: Date[] \| undefined) {\n return date && selectableDates?.find(d => isSameDay(d, date)) === undefined;\n }\n\n @RegisterComponent<NylasDatePicker, NylasSchedulerConnector, Exclude<NylasScheduling['stores'], undefined>>({\n name: 'nylas-date-picker',\n stateToProps: new Map([\n ['scheduler.selectableDates', 'selectableDates'],\n ['scheduler.selectedDate', 'selectedDate'],\n ['scheduler.isLoading', 'isLoading'],\n ['scheduler.configSettings', 'configSettings'],\n ['scheduler.eventDuration', 'eventDuration'],\n ['scheduler.selectedLanguage', 'selectedLanguage'],\n ]),\n eventToProps: {\n dateSelected: async (event: CustomEvent<Date>, nylasSchedulerConnector: NylasSchedulerConnector) => {\n debug('nylas-date-picker', 'dateSelected', event.detail);\n nylasSchedulerConnector.scheduler.selectDate(event.detail);\n },\n monthChanged: async (event: CustomEvent<Date>, _nylasSchedulerConnector: NylasSchedulerConnector) => {\n debug('nylas-date-picker', 'monthChanged', event.detail);\n },\n },\n fireRegisterEvent: true,\n })\n render() {\n return (\n <Host part=\"ndp\">\n <div class=\"nylas-date-picker\">\n <div class=\"title\" part=\"ndp__title\">\n {this.configSettings?.name ? (\n <h1>{this.configSettings?.name}</h1>\n ) : (\n this.configSettings?.organizer?.name && (\n <h1>\n <person-icon />\n {this.configSettings?.organizer?.name \|\| 'Organizer'}\n </h1>\n )\n )}\n <p>\n <clock-icon />\n {this.eventDuration ? convertMinutesToHoursAndMinutes(this.eventDuration) : `- ${i18next.t('time.minutes')}`}\n </p>\n </div>\n <div class={'header flex-row'}>\n <h2 part={'ndp__month-header'}>\n <strong>{translateMonth(this.month.toLocaleDateString(undefined, { month: 'long' }).toLocaleLowerCase())}</strong>\n  \n {this.month.toLocaleDateString(undefined, { year: 'numeric' })}\n </h2>\n <div class={'pagination'}>\n <button\n title=\"Previous month\"\n onClick={() => this.changeMonth(-1)}\n class={{ 'chevron-left': true, 'button': true }}\n disabled={!this.selectableDates?.length \|\| this.month <= new Date()}\n part=\"ndp__month-button\"\n >\n <chevron-icon />\n </button>\n <button\n title=\"Next month\"\n onClick={() => this.changeMonth(1)}\n class={{ 'chevron-right': true, 'button': true }}\n disabled={this.disableNextMonthButton}\n part=\"ndp__month-button\"\n >\n <chevron-icon />\n </button>\n </div>\n </div>\n\n <div class={'dates'}>\n {[\n i18next.t('days.sunday'),\n i18next.t('days.monday'),\n i18next.t('days.tuesday'),\n i18next.t('days.wednesday'),\n i18next.t('days.thursday'),\n i18next.t('days.friday'),\n i18next.t('days.saturday'),\n ].map(day => {\n return (\n <div class={'day'} part=\"ndp__day\">\n {day}\n </div>\n );\n })}\n {this.dates.map((date, i) => {\n const isDisabled = this.isDisabled(date, this.selectableDates);\n\n if (this.isLoading) {\n return (\n <button\n disabled\n class={{\n 'date day-skeleton': true,\n 'current-month': isSameMonth(date, this.month),\n }}\n style={{ animationDelay: `${i 20}ms` }}\n part={`ndp__date ndp__date--disabled`}\n >\n {date.getDate()}\n </button>\n );\n }\n return (\n <button\n class={{\n 'date': true,\n 'selected': !!(this.selectedDate && isSameDay(date, this.selectedDate) && this.selectableDates && this.selectableDates?.length > 0),\n 'current-day': isSameDay(date, new Date()),\n 'current-month': isSameMonth(date, this.month),\n }}\n aria-lang={date.toLocaleDateString(undefined, { dateStyle: 'full' })}\n disabled={isDisabled}\n onClick={() => this.selectDate(date)}\n part={`ndp__date ${this.isSelected(date, this.selectedDate, this.selectableDates) ? 'ndp__date--selected' : ''} ${isSameDay(date, new Date()) ? 'ndp__date--current-day' : ''} ${isSameMonth(date, this.month) ? 'ndp__date--current-month' : ''}`}\n >\n {date.getDate()}\n </button>\n );\n })}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}