@nylas/web-elements 2.3.3-canary-20260206145315 → 2.3.5
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.
- package/dist/cdn/nylas-scheduler-editor/nylas-scheduler-editor.es.js +233 -233
- package/dist/cdn/nylas-scheduling/nylas-scheduling.es.js +4 -4
- package/dist/cjs/google-logo-icon_6.cjs.entry.js +1 -1
- package/dist/cjs/multi-select-dropdown.cjs.entry.js +1 -1
- package/dist/cjs/multi-select-dropdown.cjs.entry.js.map +1 -1
- package/dist/cjs/multi-select-dropdown.entry.cjs.js.map +1 -1
- package/dist/cjs/nylas-scheduler-editor.cjs.entry.js +5 -4
- package/dist/cjs/nylas-scheduler-editor.cjs.entry.js.map +1 -1
- package/dist/cjs/nylas-scheduler-editor.entry.cjs.js.map +1 -1
- package/dist/cjs/nylas-scheduling.cjs.entry.js +3 -2
- package/dist/cjs/nylas-scheduling.cjs.entry.js.map +1 -1
- package/dist/cjs/nylas-scheduling.entry.cjs.js.map +1 -1
- package/dist/cjs/{version-CwWnMgnL.js → version-CygoqPGe.js} +3 -3
- package/dist/{esm/version-DM0y_1NQ.js.map → cjs/version-CygoqPGe.js.map} +1 -1
- package/dist/collection/components/design-system/multi-select-dropdown/multi-select-dropdown.css +8 -0
- package/dist/collection/components/scheduler/nylas-scheduling/nylas-scheduling.js +1 -0
- package/dist/collection/components/scheduler/nylas-scheduling/nylas-scheduling.js.map +1 -1
- package/dist/collection/components/scheduler-editor/nylas-scheduler-editor/nylas-scheduler-editor.js +4 -3
- package/dist/collection/components/scheduler-editor/nylas-scheduler-editor/nylas-scheduler-editor.js.map +1 -1
- package/dist/collection/connector/nylas-scheduler-connector/index.js +1 -1
- package/dist/collection/connector/nylas-scheduler-connector/index.js.map +1 -1
- package/dist/collection/version.js +1 -1
- package/dist/collection/version.js.map +1 -1
- package/dist/components/multi-select-dropdown.js +1 -1
- package/dist/components/nylas-booking-form-config.js +1 -1
- package/dist/components/nylas-booking-form.js +1 -1
- package/dist/components/nylas-calendar-picker.js +1 -1
- package/dist/components/nylas-connected-calendars.js +1 -1
- package/dist/components/nylas-editor-tabs-group.js +1 -1
- package/dist/components/nylas-editor-tabs.js +1 -1
- package/dist/components/nylas-event-calendar.js +1 -1
- package/dist/components/nylas-scheduler-editor.js +12 -11
- package/dist/components/nylas-scheduler-editor.js.map +1 -1
- package/dist/components/nylas-scheduling.js +5 -4
- package/dist/components/nylas-scheduling.js.map +1 -1
- package/dist/components/{p-DICXD6Cy.js → p-4s7IwH6o.js} +3 -3
- package/dist/components/{p-DICXD6Cy.js.map → p-4s7IwH6o.js.map} +1 -1
- package/dist/components/{p-1FY06fQD.js → p-7cRDKNfB.js} +6 -6
- package/dist/components/{p-1FY06fQD.js.map → p-7cRDKNfB.js.map} +1 -1
- package/dist/components/{p-CPFYp0Ii.js → p-B8s2nTj6.js} +3 -3
- package/dist/components/{p-CPFYp0Ii.js.map → p-B8s2nTj6.js.map} +1 -1
- package/dist/components/{p-BdQ9iWW4.js → p-BlNM5g0H.js} +3 -3
- package/dist/components/{p-BdQ9iWW4.js.map → p-BlNM5g0H.js.map} +1 -1
- package/dist/components/{p-whoa2mmo.js → p-C0AdDaS0.js} +3 -3
- package/dist/components/{p-whoa2mmo.js.map → p-C0AdDaS0.js.map} +1 -1
- package/dist/components/{p-D5z467yH.js → p-CD30fMSf.js} +3 -3
- package/dist/components/p-CD30fMSf.js.map +1 -0
- package/dist/components/{p-Gyins0o7.js → p-CZNV2mTJ.js} +3 -3
- package/dist/components/{p-Gyins0o7.js.map → p-CZNV2mTJ.js.map} +1 -1
- package/dist/components/{p-cylqcpvp.js → p-i4lYB1aA.js} +7 -7
- package/dist/components/{p-cylqcpvp.js.map → p-i4lYB1aA.js.map} +1 -1
- package/dist/components/{p-C2CgHoR-.js → p-sSr1v1AD.js} +4 -4
- package/dist/components/{p-C2CgHoR-.js.map → p-sSr1v1AD.js.map} +1 -1
- package/dist/esm/google-logo-icon_6.entry.js +1 -1
- package/dist/esm/multi-select-dropdown.entry.js +1 -1
- package/dist/esm/multi-select-dropdown.entry.js.map +1 -1
- package/dist/esm/nylas-scheduler-editor.entry.js +5 -4
- package/dist/esm/nylas-scheduler-editor.entry.js.map +1 -1
- package/dist/esm/nylas-scheduling.entry.js +3 -2
- package/dist/esm/nylas-scheduling.entry.js.map +1 -1
- package/dist/esm/{version-DM0y_1NQ.js → version-BA6Pqhlq.js} +3 -3
- package/dist/{cjs/version-CwWnMgnL.js.map → esm/version-BA6Pqhlq.js.map} +1 -1
- package/dist/nylas-web-elements/multi-select-dropdown.entry.esm.js.map +1 -1
- package/dist/nylas-web-elements/nylas-scheduler-editor.entry.esm.js.map +1 -1
- package/dist/nylas-web-elements/nylas-scheduling.entry.esm.js.map +1 -1
- package/dist/nylas-web-elements/nylas-web-elements.esm.js +1 -1
- package/dist/nylas-web-elements/{p-dbad0a98.entry.js → p-1472f78e.entry.js} +2 -2
- package/dist/nylas-web-elements/p-1472f78e.entry.js.map +1 -0
- package/dist/nylas-web-elements/p-3c16ee6c.entry.js +2 -0
- package/dist/nylas-web-elements/p-3c16ee6c.entry.js.map +1 -0
- package/dist/nylas-web-elements/{p-daf5083c.entry.js → p-3cb4cb10.entry.js} +2 -2
- package/dist/nylas-web-elements/{p-b90acc64.entry.js → p-5f0cac0e.entry.js} +3 -3
- package/dist/nylas-web-elements/{p-b90acc64.entry.js.map → p-5f0cac0e.entry.js.map} +1 -1
- package/dist/nylas-web-elements/p-BA6Pqhlq.js +2 -0
- package/dist/nylas-web-elements/{p-DM0y_1NQ.js.map → p-BA6Pqhlq.js.map} +1 -1
- package/dist/types/version.d.ts +1 -1
- package/package.json +1 -1
- package/dist/components/p-D5z467yH.js.map +0 -1
- package/dist/nylas-web-elements/p-6cb8772c.entry.js +0 -2
- package/dist/nylas-web-elements/p-6cb8772c.entry.js.map +0 -1
- package/dist/nylas-web-elements/p-DM0y_1NQ.js +0 -2
- package/dist/nylas-web-elements/p-dbad0a98.entry.js.map +0 -1
- /package/dist/nylas-web-elements/{p-daf5083c.entry.js.map → p-3cb4cb10.entry.js.map} +0 -0
|
@@ -4,8 +4,8 @@ import { a as debug, b as instance } from './p-dEI4mtiM.js';
|
|
|
4
4
|
import { d as defineCustomElement$6 } from './p-BaI67hQ_.js';
|
|
5
5
|
import { d as defineCustomElement$5 } from './p-DHEweiQ6.js';
|
|
6
6
|
import { d as defineCustomElement$4 } from './p-DAvS1ihh.js';
|
|
7
|
-
import { d as defineCustomElement$3 } from './p-
|
|
8
|
-
import { d as defineCustomElement$2 } from './p-
|
|
7
|
+
import { d as defineCustomElement$3 } from './p-CD30fMSf.js';
|
|
8
|
+
import { d as defineCustomElement$2 } from './p-B8s2nTj6.js';
|
|
9
9
|
import { d as defineCustomElement$1 } from './p-Hj9jbKPX.js';
|
|
10
10
|
|
|
11
11
|
const nylasConnectedCalendarsCss = ":host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-50:#ffeae8;--nylas-error-100:#ffc5bf;--nylas-error-200:#fecaca;--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-color-blue-100:#e0e6f9;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;--nylas-color-black:#000000;--nylas-color-grey-900:#2c2c2c;--nylas-color-grey-800:#4b4b4b;--nylas-color-grey-700:#6e6e6e;--nylas-color-grey-600:#8e8e8e;--nylas-color-grey-500:#b3b3b3;--nylas-color-grey-400:#cacaca;--nylas-color-grey-300:#e1e1e1;--nylas-color-grey-200:#eaeaea;--nylas-color-grey-100:#f5f5f5;--nylas-color-grey-50:#fbfcfe;--nylas-color-white:#ffffff;--nylas-color-red-900:#992222;--nylas-color-red-700:#cc4841;--nylas-color-red-500:#ff786a;--nylas-color-red-300:#ffa79e;--nylas-color-red-100:#ffc5bf;--nylas-color-red-50:#ffeae8;--nylas-color-blue-900:#213571;--nylas-color-blue-700:#314fa9;--nylas-color-blue-500:#4169e1;--nylas-color-blue-300:#bdccf9;--nylas-color-blue-100:#e0e6f9;--nylas-color-blue-50:#f6f8fd;--nylas-color-yellow-900:#7c6506;--nylas-color-yellow-700:#c29f09;--nylas-color-yellow-500:#f7c90b;--nylas-color-yellow-300:#f9de70;--nylas-color-yellow-100:#fceba9;--nylas-color-yellow-50:#fdf4ce;--nylas-color-green-900:#0e6b60;--nylas-color-green-700:#16a392;--nylas-color-green-500:#17c3b2;--nylas-color-green-300:#74dbd1;--nylas-color-green-100:#a2e7e0;--nylas-color-green-50:#d1f3f0;--nylas-color-purple-900:#643554;--nylas-color-purple-700:#954f7d;--nylas-color-purple-500:#c769a7;--nylas-color-purple-300:#dda5ca;--nylas-color-purple-100:#e0bdd6;--nylas-color-purple-50:#e9dde5;--nylas-color-sky-900:#20698f;--nylas-color-sky-700:#2b8fc2;--nylas-color-sky-500:#6dceff;--nylas-color-sky-300:#8fdaff;--nylas-color-sky-100:#b8e7ff;--nylas-color-sky-50:#d9f2ff;width:inherit}.nylas-connected-calendars{width:inherit;display:flex;flex-direction:column;margin:1rem;border-radius:var(--nylas-border-radius-2x);border:1px solid var(--nylas-base-200)}.nylas-connected-calendars .header{padding:1rem}.nylas-connected-calendars .header h3{margin:0;font-size:16px;font-weight:600;line-height:20px;color:var(--nylas-base-900);text-align:left}.nylas-connected-calendars .header p{margin:0.25rem 0 0 0;font-size:0.875rem;font-weight:400;line-height:20px;color:var(--nylas-base-600);text-align:left;display:flex;align-items:center;gap:4px}.nylas-connected-calendars .content .participant-container{padding-top:12px;border-top:1px solid var(--nylas-base-200);color:var(--nylas-base-900);background-color:var(--nylas-base-25)}.nylas-connected-calendars .content .participant-container .participant-title{display:flex;justify-content:space-between;align-items:center;padding:4px 16px 16px}.nylas-connected-calendars .content .participant-container .participant-title p{margin:0}.nylas-connected-calendars .content .participant-container .participant-title .participant-toggle{display:flex;gap:24px;align-items:center}.nylas-connected-calendars .content .participant-container .participant-title .participant-toggle .chevron{display:flex;align-self:center;cursor:pointer}.nylas-connected-calendars .content .participant-container .participant-title .participant-toggle .chevron:hover,.nylas-connected-calendars .content .participant-container .participant-title .participant-toggle .chevron:active{color:var(--nylas-primary)}.nylas-connected-calendars .content .participant-container .participant-title .participant-toggle .chevron.open{transform:rotate(90deg)}.nylas-connected-calendars .content .participant-container .participant-title .participant-toggle .chevron.closed{transform:rotate(270deg)}.nylas-connected-calendars .content .participant-container .participant-title .participant-toggle .chevron.disabled{cursor:not-allowed;color:var(--nylas-base-300)}.nylas-connected-calendars .content .participant-container .participant-title .participant-toggle .chevron.disabled:hover{color:var(--nylas-base-300)}nylas-calendar-picker::part(ncp){margin:0;border:none;border-top:1px solid var(--nylas-base-200);border-top-right-radius:0;border-top-left-radius:0}";
|
|
@@ -287,6 +287,6 @@ function defineCustomElement() {
|
|
|
287
287
|
}
|
|
288
288
|
|
|
289
289
|
export { NylasConnectedCalendars as N, defineCustomElement as d };
|
|
290
|
-
//# sourceMappingURL=p-
|
|
290
|
+
//# sourceMappingURL=p-sSr1v1AD.js.map
|
|
291
291
|
|
|
292
|
-
//# sourceMappingURL=p-
|
|
292
|
+
//# sourceMappingURL=p-sSr1v1AD.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-C2CgHoR-.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","i18next"],"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":["@use '../../../common/styles/variables' as *;\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 color: var(--nylas-base-900);\n background-color: var(--nylas-base-25);\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, ThemeConfig } from '@nylas/core';\nimport i18next from '@/utils/i18n';\nimport { LANGUAGE_CODE } from '@/common/constants';\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 * The selected language.\n */\n @Prop() selectedLanguage?: LANGUAGE_CODE;\n\n /**\n * @standalone\n * The theme configuration.\n */\n @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\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 @Watch('selectedLanguage')\n selectedLanguageChangedHandler(newVal: LANGUAGE_CODE, oldVal: LANGUAGE_CODE) {\n if (newVal === oldVal) return;\n i18next.changeLanguage(newVal);\n }\n\n @Watch('themeConfig')\n themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n if (newVal === oldVal) return;\n this.applyThemeConfig(newVal);\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 // Use queueMicrotask to defer theme application until after React has set props.\n // This fixes the timing issue where connectedCallback fires before React sets themeConfig.\n queueMicrotask(() => {\n if (this.themeConfig) {\n this.applyThemeConfig(this.themeConfig);\n this.host.setAttribute('data-themed', '');\n }\n });\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 }, i18next.t('nylasConnectedCalendars.selectAtLeastOneCalendar'));\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 calendars: participant.availability?.calendar_ids,\n };\n }\n });\n return selectedParticipants;\n }\n\n applyThemeConfig(themeConfig?: ThemeConfig) {\n if (themeConfig) {\n for (const [key, value] of Object.entries(themeConfig)) {\n this.host.style.setProperty(`${key}`, value);\n }\n }\n }\n\n @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 ['schedulerConfig.selectedLanguage', 'selectedLanguage'],\n ['schedulerConfig.themeConfig', 'themeConfig'],\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>{i18next.t('nylasConnectedCalendars.headerTitle')}</h3>\n <p>\n {i18next.t('nylasConnectedCalendars.headerSubTitle')}\n <tooltip-component>\n <info-icon slot=\"tooltip-icon\" />\n <span slot=\"tooltip-content\">{i18next.t('nylasConnectedCalendars.tooltip.desc')}</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>{i18next.t('nylasConnectedCalendars.participantCalendarTitle', { participantName: participant.name })}</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}
|
|
1
|
+
{"file":"p-sSr1v1AD.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","i18next"],"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":["@use '../../../common/styles/variables' as *;\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 color: var(--nylas-base-900);\n background-color: var(--nylas-base-25);\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, ThemeConfig } from '@nylas/core';\nimport i18next from '@/utils/i18n';\nimport { LANGUAGE_CODE } from '@/common/constants';\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 * The selected language.\n */\n @Prop() selectedLanguage?: LANGUAGE_CODE;\n\n /**\n * @standalone\n * The theme configuration.\n */\n @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\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 @Watch('selectedLanguage')\n selectedLanguageChangedHandler(newVal: LANGUAGE_CODE, oldVal: LANGUAGE_CODE) {\n if (newVal === oldVal) return;\n i18next.changeLanguage(newVal);\n }\n\n @Watch('themeConfig')\n themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n if (newVal === oldVal) return;\n this.applyThemeConfig(newVal);\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 // Use queueMicrotask to defer theme application until after React has set props.\n // This fixes the timing issue where connectedCallback fires before React sets themeConfig.\n queueMicrotask(() => {\n if (this.themeConfig) {\n this.applyThemeConfig(this.themeConfig);\n this.host.setAttribute('data-themed', '');\n }\n });\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 }, i18next.t('nylasConnectedCalendars.selectAtLeastOneCalendar'));\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 calendars: participant.availability?.calendar_ids,\n };\n }\n });\n return selectedParticipants;\n }\n\n applyThemeConfig(themeConfig?: ThemeConfig) {\n if (themeConfig) {\n for (const [key, value] of Object.entries(themeConfig)) {\n this.host.style.setProperty(`${key}`, value);\n }\n }\n }\n\n @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 ['schedulerConfig.selectedLanguage', 'selectedLanguage'],\n ['schedulerConfig.themeConfig', 'themeConfig'],\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>{i18next.t('nylasConnectedCalendars.headerTitle')}</h3>\n <p>\n {i18next.t('nylasConnectedCalendars.headerSubTitle')}\n <tooltip-component>\n <info-icon slot=\"tooltip-icon\" />\n <span slot=\"tooltip-content\">{i18next.t('nylasConnectedCalendars.tooltip.desc')}</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>{i18next.t('nylasConnectedCalendars.participantCalendarTitle', { participantName: participant.name })}</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}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { r as registerInstance, h, F as Fragment, c as createEvent, H as Host, a as getElement } from './index-0EQQA0nE.js';
|
|
2
2
|
import { R as RegisterComponent } from './register-component-D4DulFJU.js';
|
|
3
3
|
import { a as debug, i as instance, m as mergeDeep, p as parsePreviewLink, g as getCalendarRange } from './utils-D7AODx4L.js';
|
|
4
|
-
import { u, v as version } from './version-
|
|
4
|
+
import { u, v as version } from './version-BA6Pqhlq.js';
|
|
5
5
|
import { D as DEFAULT_OPEN_HOURS, e as editorTabComponentNames, C as CONFIGURATION_EVENT_TYPE, b as editorGroupTabComponentNames } from './constants-COJy29df.js';
|
|
6
6
|
import { E as ErrorCategory, i as isInitialized, a as init, c as captureMessage, b as captureFeedback, f as feedbackSyncIntegration } from './feedbackSync-CquJ7U5v.js';
|
|
7
7
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-0EQQA0nE.js';
|
|
2
2
|
import { a as debug } from './utils-D7AODx4L.js';
|
|
3
3
|
|
|
4
|
-
const multiSelectDropdownCss = ":host{display:block;width:inherit;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-50:#ffeae8;--nylas-error-100:#ffc5bf;--nylas-error-200:#fecaca;--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-color-blue-100:#e0e6f9;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;--nylas-color-black:#000000;--nylas-color-grey-900:#2c2c2c;--nylas-color-grey-800:#4b4b4b;--nylas-color-grey-700:#6e6e6e;--nylas-color-grey-600:#8e8e8e;--nylas-color-grey-500:#b3b3b3;--nylas-color-grey-400:#cacaca;--nylas-color-grey-300:#e1e1e1;--nylas-color-grey-200:#eaeaea;--nylas-color-grey-100:#f5f5f5;--nylas-color-grey-50:#fbfcfe;--nylas-color-white:#ffffff;--nylas-color-red-900:#992222;--nylas-color-red-700:#cc4841;--nylas-color-red-500:#ff786a;--nylas-color-red-300:#ffa79e;--nylas-color-red-100:#ffc5bf;--nylas-color-red-50:#ffeae8;--nylas-color-blue-900:#213571;--nylas-color-blue-700:#314fa9;--nylas-color-blue-500:#4169e1;--nylas-color-blue-300:#bdccf9;--nylas-color-blue-100:#e0e6f9;--nylas-color-blue-50:#f6f8fd;--nylas-color-yellow-900:#7c6506;--nylas-color-yellow-700:#c29f09;--nylas-color-yellow-500:#f7c90b;--nylas-color-yellow-300:#f9de70;--nylas-color-yellow-100:#fceba9;--nylas-color-yellow-50:#fdf4ce;--nylas-color-green-900:#0e6b60;--nylas-color-green-700:#16a392;--nylas-color-green-500:#17c3b2;--nylas-color-green-300:#74dbd1;--nylas-color-green-100:#a2e7e0;--nylas-color-green-50:#d1f3f0;--nylas-color-purple-900:#643554;--nylas-color-purple-700:#954f7d;--nylas-color-purple-500:#c769a7;--nylas-color-purple-300:#dda5ca;--nylas-color-purple-100:#e0bdd6;--nylas-color-purple-50:#e9dde5;--nylas-color-sky-900:#20698f;--nylas-color-sky-700:#2b8fc2;--nylas-color-sky-500:#6dceff;--nylas-color-sky-300:#8fdaff;--nylas-color-sky-100:#b8e7ff;--nylas-color-sky-50:#d9f2ff}.dropdown{display:inline-block;width:100%;position:relative}.dropdown .dropdown-label{display:flex;align-items:center;gap:0.25rem;color:var(--nylas-base-800)}.dropdown .dropdown-label p{margin:0}.dropdown .dropdown-label span.required{color:var(--nylas-error);padding:0 0.25rem}.dropdown span.error{color:var(--nylas-error);font-size:14px}.dropbtn{width:inherit;height:48px;color:var(--nylas-base-900);padding:0.5rem;font-size:16px;cursor:pointer;display:flex;gap:0.5rem;justify-content:space-between;align-items:center;background:var(--nylas-base-0);border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x)}.dropbtn.focus{background:var(--nylas-base-0)}.dropbtn.error{border:1px solid var(--nylas-error)}.dropbtn:hover,.dropbtn:active{border:1px solid var(--nylas-primary)}.dropbtn:active{outline:2px solid var(--nylas-primary)}.dropbtn:disabled{cursor:not-allowed;background:var(--nylas-base-100)}.dropbtn span.open{transform:rotate(90deg)}.dropbtn span.closed{transform:rotate(270deg)}.dropdown-content{display:block;margin-top:0.5rem;background-color:var(--nylas-base-0);width:100%;max-height:336px;overflow:auto;z-index:1;border-radius:4px;position:absolute;top:72px;box-shadow:0px 4px 6px -2px rgba(0, 0, 0, 0.0509803922);box-shadow:0px 10px 15px -3px rgba(0, 0, 0, 0.1019607843)}.dropdown-content ul{padding:0;list-style-type:none;color:var(--nylas-base-900);max-height:336px}.dropdown-content ul li{padding:16px, 12px, 16px, 12px;color:var(--nylas-base-900);padding:12px 16px;text-decoration:none;display:block;font-family:inherit;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0px;text-align:left;cursor:pointer}.dropdown-content ul li:hover,.dropdown-content ul li:focus{background-color:var(--nylas-base-100)}.dropdown-content ul li label{display:flex;align-items:center;gap:0.5rem}.dropdown-content ul li label input{margin:0}.dropdown-content ul li.disabled{cursor:not-allowed;opacity:0.5}.dropdown-content ul li.disabled label{cursor:not-allowed}.dropdown-content ul li.disabled label input{cursor:not-allowed}.selected-options{display:flex;flex-wrap:wrap;gap:0.5rem;padding:0.5rem 0;margin-top:0.25rem}.selected-options .selected-option{display:flex;align-items:center;gap:0.5rem;padding:4px 8px;border-radius:var(--nylas-border-radius-2x);background:var(--nylas-base-100);color:var(--nylas-base-800);font-size:16px;font-weight:500;line-height:1.5rem;letter-spacing:0.5px}.selected-options .selected-option button{background:transparent;border:none;cursor:pointer;padding:0}.selected-options .selected-option button:hover{color:var(--nylas-primary)}.selected-options .selected-option button:disabled{cursor:not-allowed;background:var(--nylas-base-100)}";
|
|
4
|
+
const multiSelectDropdownCss = ":host{display:block;width:inherit;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-50:#ffeae8;--nylas-error-100:#ffc5bf;--nylas-error-200:#fecaca;--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-color-blue-100:#e0e6f9;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;--nylas-color-black:#000000;--nylas-color-grey-900:#2c2c2c;--nylas-color-grey-800:#4b4b4b;--nylas-color-grey-700:#6e6e6e;--nylas-color-grey-600:#8e8e8e;--nylas-color-grey-500:#b3b3b3;--nylas-color-grey-400:#cacaca;--nylas-color-grey-300:#e1e1e1;--nylas-color-grey-200:#eaeaea;--nylas-color-grey-100:#f5f5f5;--nylas-color-grey-50:#fbfcfe;--nylas-color-white:#ffffff;--nylas-color-red-900:#992222;--nylas-color-red-700:#cc4841;--nylas-color-red-500:#ff786a;--nylas-color-red-300:#ffa79e;--nylas-color-red-100:#ffc5bf;--nylas-color-red-50:#ffeae8;--nylas-color-blue-900:#213571;--nylas-color-blue-700:#314fa9;--nylas-color-blue-500:#4169e1;--nylas-color-blue-300:#bdccf9;--nylas-color-blue-100:#e0e6f9;--nylas-color-blue-50:#f6f8fd;--nylas-color-yellow-900:#7c6506;--nylas-color-yellow-700:#c29f09;--nylas-color-yellow-500:#f7c90b;--nylas-color-yellow-300:#f9de70;--nylas-color-yellow-100:#fceba9;--nylas-color-yellow-50:#fdf4ce;--nylas-color-green-900:#0e6b60;--nylas-color-green-700:#16a392;--nylas-color-green-500:#17c3b2;--nylas-color-green-300:#74dbd1;--nylas-color-green-100:#a2e7e0;--nylas-color-green-50:#d1f3f0;--nylas-color-purple-900:#643554;--nylas-color-purple-700:#954f7d;--nylas-color-purple-500:#c769a7;--nylas-color-purple-300:#dda5ca;--nylas-color-purple-100:#e0bdd6;--nylas-color-purple-50:#e9dde5;--nylas-color-sky-900:#20698f;--nylas-color-sky-700:#2b8fc2;--nylas-color-sky-500:#6dceff;--nylas-color-sky-300:#8fdaff;--nylas-color-sky-100:#b8e7ff;--nylas-color-sky-50:#d9f2ff}.dropdown{display:inline-block;width:100%;position:relative}.dropdown .dropdown-label{display:flex;align-items:center;gap:0.25rem;color:var(--nylas-base-800)}.dropdown .dropdown-label p{margin:0}.dropdown .dropdown-label span.required{color:var(--nylas-error);padding:0 0.25rem}.dropdown span.error{color:var(--nylas-error);font-size:14px}.dropbtn{width:inherit;height:48px;color:var(--nylas-base-900);padding:0.5rem;font-size:16px;cursor:pointer;display:flex;gap:0.5rem;justify-content:space-between;align-items:center;background:var(--nylas-base-0);border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x)}.dropbtn.focus{background:var(--nylas-base-0)}.dropbtn.error{border:1px solid var(--nylas-error)}.dropbtn:hover,.dropbtn:active{border:1px solid var(--nylas-primary)}.dropbtn:active{outline:2px solid var(--nylas-primary)}.dropbtn:disabled{cursor:not-allowed;background:var(--nylas-base-100)}.dropbtn span.open{transform:rotate(90deg)}.dropbtn span.closed{transform:rotate(270deg)}.dropdown-content{display:block;margin-top:0.5rem;background-color:var(--nylas-base-0);width:100%;max-height:336px;overflow:auto;z-index:1;border-radius:4px;position:absolute;top:72px;box-shadow:0px 4px 6px -2px rgba(0, 0, 0, 0.0509803922);box-shadow:0px 10px 15px -3px rgba(0, 0, 0, 0.1019607843)}.dropdown-content ul{padding:0;list-style-type:none;color:var(--nylas-base-900);max-height:336px}.dropdown-content ul li{padding:16px, 12px, 16px, 12px;color:var(--nylas-base-900);padding:12px 16px;text-decoration:none;display:block;font-family:inherit;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0px;text-align:left;cursor:pointer}.dropdown-content ul li:hover,.dropdown-content ul li:focus{background-color:var(--nylas-base-100)}.dropdown-content ul li label{display:flex;align-items:center;gap:0.5rem;cursor:pointer}.dropdown-content ul li label span{word-break:break-word;overflow-wrap:break-word}.dropdown-content ul li label input{margin:0;flex-shrink:0}.dropdown-content ul li.disabled{cursor:not-allowed;opacity:0.5}.dropdown-content ul li.disabled label{cursor:not-allowed}.dropdown-content ul li.disabled label input{cursor:not-allowed}.selected-options{display:flex;flex-wrap:wrap;gap:0.5rem;padding:0.5rem 0;margin-top:0.25rem}.selected-options .selected-option{display:flex;align-items:center;gap:0.5rem;padding:4px 8px;border-radius:var(--nylas-border-radius-2x);background:var(--nylas-base-100);color:var(--nylas-base-800);font-size:16px;font-weight:500;line-height:1.5rem;letter-spacing:0.5px;word-break:break-word;overflow-wrap:break-word}.selected-options .selected-option button{background:transparent;border:none;cursor:pointer;padding:0}.selected-options .selected-option button:hover{color:var(--nylas-primary)}.selected-options .selected-option button:disabled{cursor:not-allowed;background:var(--nylas-base-100)}";
|
|
5
5
|
|
|
6
6
|
const MultiSelectDropdown = class {
|
|
7
7
|
constructor(hostRef) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"multi-select-dropdown.entry.js","sources":["src/components/design-system/multi-select-dropdown/multi-select-dropdown.scss?tag=multi-select-dropdown&encapsulation=shadow","src/components/design-system/multi-select-dropdown/multi-select-dropdown.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n display: block;\n width: inherit;\n @include default-css-variables;\n}\n\n.dropdown {\n display: inline-block;\n width: 100%;\n position: relative;\n\n .dropdown-label {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n color: var(--nylas-base-800);\n\n p {\n margin: 0;\n }\n\n span.required {\n color: var(--nylas-error);\n padding: 0 0.25rem;\n }\n }\n\n span.error {\n color: var(--nylas-error);\n font-size: 14px;\n }\n}\n\n.dropbtn {\n width: inherit;\n height: 48px;\n color: var(--nylas-base-900);\n padding: 0.5rem;\n font-size: 16px;\n cursor: pointer;\n display: flex;\n gap: 0.5rem;\n justify-content: space-between;\n align-items: center;\n background: var(--nylas-base-0);\n border: 1px solid var(--nylas-base-200);\n border-radius: var(--nylas-border-radius-2x);\n\n &.focus {\n background: var(--nylas-base-0);\n }\n\n &.error {\n border: 1px solid var(--nylas-error);\n }\n\n &:hover,\n &:active {\n border: 1px solid var(--nylas-primary);\n }\n\n &:active {\n outline: 2px solid var(--nylas-primary);\n }\n\n &:disabled {\n cursor: not-allowed;\n background: var(--nylas-base-100);\n }\n\n span {\n &.open {\n transform: rotate(90deg);\n }\n\n &.closed {\n transform: rotate(270deg);\n }\n }\n}\n\n.dropdown-content {\n display: block;\n margin-top: 0.5rem;\n background-color: var(--nylas-base-0);\n width: 100%;\n max-height: 336px;\n overflow: auto;\n z-index: 1;\n border-radius: 4px;\n position: absolute;\n top: calc(48px + 24px);\n box-shadow: 0px 4px 6px -2px #0000000d;\n box-shadow: 0px 10px 15px -3px #0000001a;\n}\n\n.dropdown-content ul {\n padding: 0;\n list-style-type: none;\n color: var(--nylas-base-900);\n max-height: 336px;\n\n li {\n padding: 16px, 12px, 16px, 12px;\n color: var(--nylas-base-900);\n padding: 12px 16px;\n text-decoration: none;\n display: block;\n font-family: inherit;\n font-size: 14px;\n font-weight: 400;\n line-height: 20px;\n letter-spacing: 0px;\n text-align: left;\n cursor: pointer;\n\n &:hover,\n &:focus {\n background-color: var(--nylas-base-100);\n }\n\n label {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n\n input {\n margin: 0;\n }\n }\n\n &.disabled {\n cursor: not-allowed;\n opacity: 0.5;\n\n label {\n cursor: not-allowed;\n\n input {\n cursor: not-allowed;\n }\n }\n }\n }\n}\n\n.selected-options {\n display: flex;\n flex-wrap: wrap;\n gap: 0.5rem;\n padding: 0.5rem 0;\n margin-top: 0.25rem;\n\n .selected-option {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n padding: 4px 8px;\n border-radius: var(--nylas-border-radius-2x);\n background: var(--nylas-base-100);\n color: var(--nylas-base-800);\n font-size: 16px;\n font-weight: 500;\n line-height: 1.5rem;\n letter-spacing: 0.5px;\n\n button {\n background: transparent;\n border: none;\n cursor: pointer;\n padding: 0;\n\n &:hover {\n color: var(--nylas-primary);\n }\n\n &:disabled {\n cursor: not-allowed;\n background: var(--nylas-base-100);\n }\n }\n }\n}\n","import { debug } from '@/utils/utils';\nimport { Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, State, Watch, h } from '@stencil/core';\nimport { DropdownOption, ThemeConfig } from '@nylas/core';\n\n@Component({\n tag: 'multi-select-dropdown',\n styleUrl: 'multi-select-dropdown.scss',\n shadow: true,\n})\nexport class MultiSelectDropdown {\n @Element() el!: HTMLElement;\n\n // Props\n /**\n * The name of the dropdown\n */\n @Prop() name!: string;\n\n /**\n * The label of the dropdown\n */\n @Prop() label?: string;\n\n /**\n * The options to display in the dropdown\n */\n @Prop() options: DropdownOption[] = [];\n\n /**\n * Error message to display\n */\n @Prop({ mutable: true }) error?: string = '';\n\n /**\n * The option to require selection of at leat one option.\n */\n @Prop() required?: boolean = false;\n\n /**\n * The property to make the multi-select dropdown read-only. If true, the dropdown cannot be edited.\n */\n @Prop() readOnly?: boolean = false;\n\n /**\n * Multiple options selected label\n */\n @Prop() multipleOptionsSelectedLabel?: string = 'Multiple options selected';\n\n /**\n * Select at least one option label\n */\n @Prop() selectAtLeastOneOptionLabel?: string = 'Please select at least one option';\n\n /**\n * The theme configuration.\n */\n @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n\n /**\n * The error message to display\n */\n @Prop() errorMessage?: string = 'Please select at least one option.';\n\n // States\n /**\n * The copy of the options to display in the dropdown\n */\n @State() availableOptions: DropdownOption[] = this.options;\n /**\n * The open state of the dropdown\n */\n @State() isOpen: boolean = false;\n /**\n * The aria-activedescendant attribute for the listbox element to indicate the currently active\n */\n @State() ariaActivedescendant: string = '';\n\n /**\n * This flag is used to focus the first option when the dropdown is opened\n * and reset after the first option is focused\n */\n @State() shouldFocusFirstOption: boolean = false;\n\n // Events\n /**\n * This event is fired when the selected options are changed\n */\n @Event({ bubbles: true, composed: true }) selectedOptionsChanged!: EventEmitter<{\n value: string[];\n name: string;\n }>;\n\n areOptionsEqual(arr1: DropdownOption[], arr2: DropdownOption[]): boolean {\n if (arr1.length !== arr2.length) return false;\n\n // Sort both arrays by a consistent key (e.g., label and value)\n const sorted1 = [...arr1].sort((a, b) => a.label.localeCompare(b.label) || a.value.localeCompare(b.value));\n const sorted2 = [...arr2].sort((a, b) => a.label.localeCompare(b.label) || a.value.localeCompare(b.value));\n\n // Compare each object in the sorted arrays\n return sorted1.every((opt1, index) => {\n const opt2 = sorted2[index];\n return opt1.label === opt2.label && opt1.value === opt2.value;\n });\n }\n\n @Watch('options')\n optionsChangedHandler(newValue: DropdownOption[]) {\n if (!this.areOptionsEqual(newValue, this.availableOptions)) {\n this.availableOptions = newValue;\n }\n }\n\n @Watch('themeConfig')\n themeConfigChangedHandler(newVal: ThemeConfig, _oldVal: ThemeConfig) {\n this.applyThemeConfig(newVal);\n }\n\n applyThemeConfig(themeConfig?: ThemeConfig) {\n if (themeConfig) {\n for (const [key, value] of Object.entries(themeConfig)) {\n this.el.style.setProperty(`${key}`, value);\n }\n }\n }\n\n // Lifecycle methods\n connectedCallback() {\n // Use queueMicrotask to defer theme application until after React has set props.\n // This fixes the timing issue where connectedCallback fires before React sets themeConfig.\n queueMicrotask(() => {\n if (this.themeConfig) {\n this.applyThemeConfig(this.themeConfig);\n this.el.setAttribute('data-themed', '');\n }\n });\n }\n\n componentWillLoad() {\n debug('multi-select-dropdown', 'componentWillLoad');\n }\n\n componentDidLoad() {\n debug('multi-select-dropdown', 'componentDidLoad');\n if (this.options) {\n this.availableOptions = this.options;\n }\n }\n\n componentDidRender() {\n debug('multi-select-dropdown', 'componentDidRender');\n if (this.isOpen && this.shouldFocusFirstOption) {\n // The dropdown is open and we should focus the first option\n this.ariaActivedescendant = this.availableOptions[0]?.value;\n this.focusOption(0);\n // Reset the flag\n this.shouldFocusFirstOption = false;\n }\n }\n\n // Event listeners\n @Listen('click', { target: 'document', capture: true })\n handleOutsideClick(event: MouseEvent) {\n // Get the path of the event\n const path = event.composedPath();\n\n // Check if the path includes the host element\n const isClickInside = path.includes(this.el);\n\n if (!isClickInside && this.isOpen) {\n this.isOpen = false;\n }\n }\n\n @Listen('bookingFormSubmitted', { target: 'document' })\n handleBookingFormSubmitted(event: CustomEvent) {\n const selectedOptions = this.availableOptions.filter(o => o.selected).map(o => o.value);\n if (this.required && (!selectedOptions || selectedOptions.length <= 0)) {\n this.error = this.errorMessage || this.selectAtLeastOneOptionLabel;\n }\n if (this.error) {\n event.preventDefault();\n }\n }\n\n // Methods\n\n selectOption(option: DropdownOption): void {\n this.availableOptions = this.availableOptions.map(o => {\n if (o.value === option.value) {\n o.selected = option.selected ? false : true;\n if (o.selected) {\n this.error = '';\n }\n }\n return o;\n });\n const selectedOptions = this.availableOptions.filter(o => o.selected).map(o => o.value);\n this.selectedOptionsChanged.emit({\n value: selectedOptions,\n name: this.name,\n });\n }\n\n toggleDropdown(): void {\n this.isOpen = !this.isOpen;\n if (this.isOpen) {\n this.shouldFocusFirstOption = true;\n } else {\n this.ariaActivedescendant = '';\n }\n }\n\n @Method()\n async openDropdown(): Promise<void> {\n this.isOpen = true;\n this.shouldFocusFirstOption = true;\n }\n\n @Method()\n async closeDropdown(): Promise<void> {\n this.isOpen = false;\n this.ariaActivedescendant = '';\n }\n\n handleSelectButtonKeyDown(event: KeyboardEvent): void {\n switch (event.key) {\n case 'ArrowDown':\n case 'Enter':\n event.preventDefault();\n if (!this.isOpen) {\n this.toggleDropdown();\n }\n break;\n case 'Escape':\n this.isOpen = false;\n break;\n }\n }\n\n handleListboxKeydown(e: KeyboardEvent) {\n const items = this.availableOptions;\n const currentIndex = items.findIndex(item => item.value === this.ariaActivedescendant);\n\n switch (e.key) {\n case 'ArrowDown':\n case 'Tab': {\n if (!e.shiftKey) {\n e.preventDefault();\n const nextIndex = currentIndex + 1 < items.length ? currentIndex + 1 : 0;\n this.ariaActivedescendant = items[nextIndex].value;\n this.focusOption(nextIndex);\n } else {\n e.preventDefault();\n const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;\n this.ariaActivedescendant = items[prevIndex].value;\n this.focusOption(prevIndex);\n }\n break;\n }\n case 'ArrowUp': {\n e.preventDefault();\n const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;\n this.ariaActivedescendant = items[prevIndex].value;\n this.focusOption(prevIndex);\n break;\n }\n case 'Enter': {\n e.preventDefault();\n if (this.ariaActivedescendant) {\n this.selectOption(items[currentIndex]);\n }\n break;\n }\n case 'Escape': {\n this.isOpen = false;\n break;\n }\n }\n }\n\n focusOption(index: number) {\n const option = this.availableOptions[index];\n if (!option) return; // Guard clause in case index is out of bounds\n\n const elementId = option.value;\n const element = this.el.shadowRoot?.getElementById(elementId) as HTMLLIElement;\n\n if (element) {\n element.focus(); // Set focus on the element\n element.scrollIntoView({ behavior: 'smooth', block: 'nearest' });\n }\n }\n\n getSelectedOptions() {\n return this.availableOptions.filter(option => option.selected);\n }\n\n renderOption(option: DropdownOption) {\n return (\n <li\n key={option.value}\n id={option.value}\n role=\"option\"\n tabindex=\"0\"\n aria-selected={option.selected ? 'true' : 'false'}\n onClick={e => {\n e.stopImmediatePropagation();\n if (!option?.disabled) {\n this.selectOption(option);\n }\n }}\n class={{ selected: !!option.selected, disabled: !!option.disabled }}\n >\n <label htmlFor={option.value}>\n <input aria-hidden=\"true\" id={option.value} type=\"checkbox\" checked={option.selected} disabled={!!option?.disabled} />\n <span>{option.label}</span>\n </label>\n </li>\n );\n }\n\n render() {\n return (\n <Host>\n <div class=\"dropdown\" part=\"msd_dropdown\">\n <label class=\"dropdown-label\" part=\"msd_dropdown-label\">\n <p>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\">*</span>}\n </p>\n <slot name=\"label-icon\" aria-hidden=\"true\"></slot>\n </label>\n <button\n name={this.name}\n part={`msd_dropdown-button ${this.error ? 'msd_dropdown-button--error' : ''}`}\n class={{ dropbtn: true, open: this.isOpen, error: !!this.error }}\n onClick={() => this.toggleDropdown()}\n disabled={this.readOnly}\n title={this.readOnly ? 'read-only field' : undefined}\n aria-haspopup=\"listbox\"\n aria-expanded={this.isOpen ? 'true' : 'false'}\n aria-label={this.name}\n onKeyDown={e => this.handleSelectButtonKeyDown(e)}\n >\n <slot name=\"select-icon\" aria-hidden=\"true\"></slot>\n <span class=\"selected-option\" part=\"msd_dropdown-button-selected-label\">\n {this.getSelectedOptions().length > 1\n ? this.multipleOptionsSelectedLabel\n : this.availableOptions.filter(o => o.selected)[0]?.label ?? this.selectAtLeastOneOptionLabel ?? this.availableOptions[0]?.label}\n </span>\n <span class={this.isOpen ? 'open' : 'closed'} aria-hidden=\"true\">\n <chevron-icon width=\"16\" height=\"16\" />\n </span>\n </button>\n {this.error ? (\n <span class=\"error\" part=\"msd_dropdown_error\">\n {this.error}\n </span>\n ) : null}\n <div class={'selected-options'}>\n {this.getSelectedOptions().map(option => (\n <span class=\"selected-option\">\n {option.label}\n <button disabled={this.readOnly || !!option?.disabled} key={option.label} onClick={() => this.selectOption(option)}>\n <close-icon />\n </button>\n </span>\n ))}\n </div>\n {this.isOpen ? (\n <div class=\"dropdown-content\" part=\"msd_dropdown-content\">\n <ul\n tabindex=\"-1\"\n role=\"listbox\"\n aria-label={this.name}\n aria-multiselectable={true}\n aria-activedescendant={this.ariaActivedescendant}\n onKeyDown={e => this.handleListboxKeydown(e)}\n >\n {this.availableOptions.map(option => this.renderOption(option))}\n </ul>\n </div>\n ) : null}\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"multi-select-dropdown.entry.js","sources":["src/components/design-system/multi-select-dropdown/multi-select-dropdown.scss?tag=multi-select-dropdown&encapsulation=shadow","src/components/design-system/multi-select-dropdown/multi-select-dropdown.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n display: block;\n width: inherit;\n @include default-css-variables;\n}\n\n.dropdown {\n display: inline-block;\n width: 100%;\n position: relative;\n\n .dropdown-label {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n color: var(--nylas-base-800);\n\n p {\n margin: 0;\n }\n\n span.required {\n color: var(--nylas-error);\n padding: 0 0.25rem;\n }\n }\n\n span.error {\n color: var(--nylas-error);\n font-size: 14px;\n }\n}\n\n.dropbtn {\n width: inherit;\n height: 48px;\n color: var(--nylas-base-900);\n padding: 0.5rem;\n font-size: 16px;\n cursor: pointer;\n display: flex;\n gap: 0.5rem;\n justify-content: space-between;\n align-items: center;\n background: var(--nylas-base-0);\n border: 1px solid var(--nylas-base-200);\n border-radius: var(--nylas-border-radius-2x);\n\n &.focus {\n background: var(--nylas-base-0);\n }\n\n &.error {\n border: 1px solid var(--nylas-error);\n }\n\n &:hover,\n &:active {\n border: 1px solid var(--nylas-primary);\n }\n\n &:active {\n outline: 2px solid var(--nylas-primary);\n }\n\n &:disabled {\n cursor: not-allowed;\n background: var(--nylas-base-100);\n }\n\n span {\n &.open {\n transform: rotate(90deg);\n }\n\n &.closed {\n transform: rotate(270deg);\n }\n }\n}\n\n.dropdown-content {\n display: block;\n margin-top: 0.5rem;\n background-color: var(--nylas-base-0);\n width: 100%;\n max-height: 336px;\n overflow: auto;\n z-index: 1;\n border-radius: 4px;\n position: absolute;\n top: calc(48px + 24px);\n box-shadow: 0px 4px 6px -2px #0000000d;\n box-shadow: 0px 10px 15px -3px #0000001a;\n}\n\n.dropdown-content ul {\n padding: 0;\n list-style-type: none;\n color: var(--nylas-base-900);\n max-height: 336px;\n\n li {\n padding: 16px, 12px, 16px, 12px;\n color: var(--nylas-base-900);\n padding: 12px 16px;\n text-decoration: none;\n display: block;\n font-family: inherit;\n font-size: 14px;\n font-weight: 400;\n line-height: 20px;\n letter-spacing: 0px;\n text-align: left;\n cursor: pointer;\n\n &:hover,\n &:focus {\n background-color: var(--nylas-base-100);\n }\n\n label {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n cursor: pointer;\n\n span {\n word-break: break-word;\n overflow-wrap: break-word;\n }\n\n input {\n margin: 0;\n flex-shrink: 0;\n }\n }\n\n &.disabled {\n cursor: not-allowed;\n opacity: 0.5;\n\n label {\n cursor: not-allowed;\n\n input {\n cursor: not-allowed;\n }\n }\n }\n }\n}\n\n.selected-options {\n display: flex;\n flex-wrap: wrap;\n gap: 0.5rem;\n padding: 0.5rem 0;\n margin-top: 0.25rem;\n\n .selected-option {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n padding: 4px 8px;\n border-radius: var(--nylas-border-radius-2x);\n background: var(--nylas-base-100);\n color: var(--nylas-base-800);\n font-size: 16px;\n font-weight: 500;\n line-height: 1.5rem;\n letter-spacing: 0.5px;\n word-break: break-word;\n overflow-wrap: break-word;\n\n button {\n background: transparent;\n border: none;\n cursor: pointer;\n padding: 0;\n\n &:hover {\n color: var(--nylas-primary);\n }\n\n &:disabled {\n cursor: not-allowed;\n background: var(--nylas-base-100);\n }\n }\n }\n}\n","import { debug } from '@/utils/utils';\nimport { Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, State, Watch, h } from '@stencil/core';\nimport { DropdownOption, ThemeConfig } from '@nylas/core';\n\n@Component({\n tag: 'multi-select-dropdown',\n styleUrl: 'multi-select-dropdown.scss',\n shadow: true,\n})\nexport class MultiSelectDropdown {\n @Element() el!: HTMLElement;\n\n // Props\n /**\n * The name of the dropdown\n */\n @Prop() name!: string;\n\n /**\n * The label of the dropdown\n */\n @Prop() label?: string;\n\n /**\n * The options to display in the dropdown\n */\n @Prop() options: DropdownOption[] = [];\n\n /**\n * Error message to display\n */\n @Prop({ mutable: true }) error?: string = '';\n\n /**\n * The option to require selection of at leat one option.\n */\n @Prop() required?: boolean = false;\n\n /**\n * The property to make the multi-select dropdown read-only. If true, the dropdown cannot be edited.\n */\n @Prop() readOnly?: boolean = false;\n\n /**\n * Multiple options selected label\n */\n @Prop() multipleOptionsSelectedLabel?: string = 'Multiple options selected';\n\n /**\n * Select at least one option label\n */\n @Prop() selectAtLeastOneOptionLabel?: string = 'Please select at least one option';\n\n /**\n * The theme configuration.\n */\n @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n\n /**\n * The error message to display\n */\n @Prop() errorMessage?: string = 'Please select at least one option.';\n\n // States\n /**\n * The copy of the options to display in the dropdown\n */\n @State() availableOptions: DropdownOption[] = this.options;\n /**\n * The open state of the dropdown\n */\n @State() isOpen: boolean = false;\n /**\n * The aria-activedescendant attribute for the listbox element to indicate the currently active\n */\n @State() ariaActivedescendant: string = '';\n\n /**\n * This flag is used to focus the first option when the dropdown is opened\n * and reset after the first option is focused\n */\n @State() shouldFocusFirstOption: boolean = false;\n\n // Events\n /**\n * This event is fired when the selected options are changed\n */\n @Event({ bubbles: true, composed: true }) selectedOptionsChanged!: EventEmitter<{\n value: string[];\n name: string;\n }>;\n\n areOptionsEqual(arr1: DropdownOption[], arr2: DropdownOption[]): boolean {\n if (arr1.length !== arr2.length) return false;\n\n // Sort both arrays by a consistent key (e.g., label and value)\n const sorted1 = [...arr1].sort((a, b) => a.label.localeCompare(b.label) || a.value.localeCompare(b.value));\n const sorted2 = [...arr2].sort((a, b) => a.label.localeCompare(b.label) || a.value.localeCompare(b.value));\n\n // Compare each object in the sorted arrays\n return sorted1.every((opt1, index) => {\n const opt2 = sorted2[index];\n return opt1.label === opt2.label && opt1.value === opt2.value;\n });\n }\n\n @Watch('options')\n optionsChangedHandler(newValue: DropdownOption[]) {\n if (!this.areOptionsEqual(newValue, this.availableOptions)) {\n this.availableOptions = newValue;\n }\n }\n\n @Watch('themeConfig')\n themeConfigChangedHandler(newVal: ThemeConfig, _oldVal: ThemeConfig) {\n this.applyThemeConfig(newVal);\n }\n\n applyThemeConfig(themeConfig?: ThemeConfig) {\n if (themeConfig) {\n for (const [key, value] of Object.entries(themeConfig)) {\n this.el.style.setProperty(`${key}`, value);\n }\n }\n }\n\n // Lifecycle methods\n connectedCallback() {\n // Use queueMicrotask to defer theme application until after React has set props.\n // This fixes the timing issue where connectedCallback fires before React sets themeConfig.\n queueMicrotask(() => {\n if (this.themeConfig) {\n this.applyThemeConfig(this.themeConfig);\n this.el.setAttribute('data-themed', '');\n }\n });\n }\n\n componentWillLoad() {\n debug('multi-select-dropdown', 'componentWillLoad');\n }\n\n componentDidLoad() {\n debug('multi-select-dropdown', 'componentDidLoad');\n if (this.options) {\n this.availableOptions = this.options;\n }\n }\n\n componentDidRender() {\n debug('multi-select-dropdown', 'componentDidRender');\n if (this.isOpen && this.shouldFocusFirstOption) {\n // The dropdown is open and we should focus the first option\n this.ariaActivedescendant = this.availableOptions[0]?.value;\n this.focusOption(0);\n // Reset the flag\n this.shouldFocusFirstOption = false;\n }\n }\n\n // Event listeners\n @Listen('click', { target: 'document', capture: true })\n handleOutsideClick(event: MouseEvent) {\n // Get the path of the event\n const path = event.composedPath();\n\n // Check if the path includes the host element\n const isClickInside = path.includes(this.el);\n\n if (!isClickInside && this.isOpen) {\n this.isOpen = false;\n }\n }\n\n @Listen('bookingFormSubmitted', { target: 'document' })\n handleBookingFormSubmitted(event: CustomEvent) {\n const selectedOptions = this.availableOptions.filter(o => o.selected).map(o => o.value);\n if (this.required && (!selectedOptions || selectedOptions.length <= 0)) {\n this.error = this.errorMessage || this.selectAtLeastOneOptionLabel;\n }\n if (this.error) {\n event.preventDefault();\n }\n }\n\n // Methods\n\n selectOption(option: DropdownOption): void {\n this.availableOptions = this.availableOptions.map(o => {\n if (o.value === option.value) {\n o.selected = option.selected ? false : true;\n if (o.selected) {\n this.error = '';\n }\n }\n return o;\n });\n const selectedOptions = this.availableOptions.filter(o => o.selected).map(o => o.value);\n this.selectedOptionsChanged.emit({\n value: selectedOptions,\n name: this.name,\n });\n }\n\n toggleDropdown(): void {\n this.isOpen = !this.isOpen;\n if (this.isOpen) {\n this.shouldFocusFirstOption = true;\n } else {\n this.ariaActivedescendant = '';\n }\n }\n\n @Method()\n async openDropdown(): Promise<void> {\n this.isOpen = true;\n this.shouldFocusFirstOption = true;\n }\n\n @Method()\n async closeDropdown(): Promise<void> {\n this.isOpen = false;\n this.ariaActivedescendant = '';\n }\n\n handleSelectButtonKeyDown(event: KeyboardEvent): void {\n switch (event.key) {\n case 'ArrowDown':\n case 'Enter':\n event.preventDefault();\n if (!this.isOpen) {\n this.toggleDropdown();\n }\n break;\n case 'Escape':\n this.isOpen = false;\n break;\n }\n }\n\n handleListboxKeydown(e: KeyboardEvent) {\n const items = this.availableOptions;\n const currentIndex = items.findIndex(item => item.value === this.ariaActivedescendant);\n\n switch (e.key) {\n case 'ArrowDown':\n case 'Tab': {\n if (!e.shiftKey) {\n e.preventDefault();\n const nextIndex = currentIndex + 1 < items.length ? currentIndex + 1 : 0;\n this.ariaActivedescendant = items[nextIndex].value;\n this.focusOption(nextIndex);\n } else {\n e.preventDefault();\n const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;\n this.ariaActivedescendant = items[prevIndex].value;\n this.focusOption(prevIndex);\n }\n break;\n }\n case 'ArrowUp': {\n e.preventDefault();\n const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;\n this.ariaActivedescendant = items[prevIndex].value;\n this.focusOption(prevIndex);\n break;\n }\n case 'Enter': {\n e.preventDefault();\n if (this.ariaActivedescendant) {\n this.selectOption(items[currentIndex]);\n }\n break;\n }\n case 'Escape': {\n this.isOpen = false;\n break;\n }\n }\n }\n\n focusOption(index: number) {\n const option = this.availableOptions[index];\n if (!option) return; // Guard clause in case index is out of bounds\n\n const elementId = option.value;\n const element = this.el.shadowRoot?.getElementById(elementId) as HTMLLIElement;\n\n if (element) {\n element.focus(); // Set focus on the element\n element.scrollIntoView({ behavior: 'smooth', block: 'nearest' });\n }\n }\n\n getSelectedOptions() {\n return this.availableOptions.filter(option => option.selected);\n }\n\n renderOption(option: DropdownOption) {\n return (\n <li\n key={option.value}\n id={option.value}\n role=\"option\"\n tabindex=\"0\"\n aria-selected={option.selected ? 'true' : 'false'}\n onClick={e => {\n e.stopImmediatePropagation();\n if (!option?.disabled) {\n this.selectOption(option);\n }\n }}\n class={{ selected: !!option.selected, disabled: !!option.disabled }}\n >\n <label htmlFor={option.value}>\n <input aria-hidden=\"true\" id={option.value} type=\"checkbox\" checked={option.selected} disabled={!!option?.disabled} />\n <span>{option.label}</span>\n </label>\n </li>\n );\n }\n\n render() {\n return (\n <Host>\n <div class=\"dropdown\" part=\"msd_dropdown\">\n <label class=\"dropdown-label\" part=\"msd_dropdown-label\">\n <p>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\">*</span>}\n </p>\n <slot name=\"label-icon\" aria-hidden=\"true\"></slot>\n </label>\n <button\n name={this.name}\n part={`msd_dropdown-button ${this.error ? 'msd_dropdown-button--error' : ''}`}\n class={{ dropbtn: true, open: this.isOpen, error: !!this.error }}\n onClick={() => this.toggleDropdown()}\n disabled={this.readOnly}\n title={this.readOnly ? 'read-only field' : undefined}\n aria-haspopup=\"listbox\"\n aria-expanded={this.isOpen ? 'true' : 'false'}\n aria-label={this.name}\n onKeyDown={e => this.handleSelectButtonKeyDown(e)}\n >\n <slot name=\"select-icon\" aria-hidden=\"true\"></slot>\n <span class=\"selected-option\" part=\"msd_dropdown-button-selected-label\">\n {this.getSelectedOptions().length > 1\n ? this.multipleOptionsSelectedLabel\n : this.availableOptions.filter(o => o.selected)[0]?.label ?? this.selectAtLeastOneOptionLabel ?? this.availableOptions[0]?.label}\n </span>\n <span class={this.isOpen ? 'open' : 'closed'} aria-hidden=\"true\">\n <chevron-icon width=\"16\" height=\"16\" />\n </span>\n </button>\n {this.error ? (\n <span class=\"error\" part=\"msd_dropdown_error\">\n {this.error}\n </span>\n ) : null}\n <div class={'selected-options'}>\n {this.getSelectedOptions().map(option => (\n <span class=\"selected-option\">\n {option.label}\n <button disabled={this.readOnly || !!option?.disabled} key={option.label} onClick={() => this.selectOption(option)}>\n <close-icon />\n </button>\n </span>\n ))}\n </div>\n {this.isOpen ? (\n <div class=\"dropdown-content\" part=\"msd_dropdown-content\">\n <ul\n tabindex=\"-1\"\n role=\"listbox\"\n aria-label={this.name}\n aria-multiselectable={true}\n aria-activedescendant={this.ariaActivedescendant}\n onKeyDown={e => this.handleListboxKeydown(e)}\n >\n {this.availableOptions.map(option => this.renderOption(option))}\n </ul>\n </div>\n ) : null}\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -2,7 +2,7 @@ import { h, F as Fragment, r as registerInstance, c as createEvent, H as Host, a
|
|
|
2
2
|
import { N as NylasBaseProvider } from './abstract-provider-DjoT3l3_.js';
|
|
3
3
|
import { N as NylasIdentityRequestWrapper } from './nylas-api-request-DlF4cUoT.js';
|
|
4
4
|
import { d as dayjs, u as utc, t as timezone, a as debug, b as dataResponse, g as getCalendarRange, e as error, i as instance } from './utils-D7AODx4L.js';
|
|
5
|
-
import { o as o$1, v as version } from './version-
|
|
5
|
+
import { o as o$1, v as version } from './version-BA6Pqhlq.js';
|
|
6
6
|
import { c as createStore } from './index-DVBNi-yR.js';
|
|
7
7
|
import { C as CONFIGURATION_EVENT_TYPE, L as LANGUAGE_CODE, a as LANGUAGE_MAP } from './constants-COJy29df.js';
|
|
8
8
|
|
|
@@ -2126,6 +2126,7 @@ const NylasSchedulerEditor = class {
|
|
|
2126
2126
|
}
|
|
2127
2127
|
async componentWillLoad() {
|
|
2128
2128
|
debug(`[nylas-scheduler-editor] componentWillLoad`);
|
|
2129
|
+
await Promise.resolve();
|
|
2129
2130
|
const filteredAdditionalParticipants = this.additionalParticipants?.filter(participant => {
|
|
2130
2131
|
const filteredCalendars = participant.calendars?.length > 0 ? participant.calendars.filter(calendar => calendar.id && calendar.name) : [];
|
|
2131
2132
|
if (participant.name && participant.email && filteredCalendars.length > 0) {
|
|
@@ -2313,12 +2314,12 @@ const NylasSchedulerEditor = class {
|
|
|
2313
2314
|
const isGroupType = this.stores?.schedulerConfig?.state.selectedEventType === CONFIGURATION_EVENT_TYPE.group ||
|
|
2314
2315
|
this.stores?.schedulerConfig?.state.selectedConfiguration?.type === CONFIGURATION_EVENT_TYPE.group;
|
|
2315
2316
|
debug(`[nylas-scheduler-editor] render mode: ${this.mode}`);
|
|
2316
|
-
return (h(Host, { key: '
|
|
2317
|
+
return (h(Host, { key: '39f91102925ee23f408040f1a223d63c84032d11' }, h("div", { key: 'cc147c1ef34bd2cf5463afd13b93dd85a146276c', class: "scheduler-editor-header", part: "nse__header" }, h("h1", { key: '85ce90cef58486bf7460cb6923215d02c7118842', class: "scheduler-editor-title", part: "nse__title" }, h("calendar-icon", { key: '05cc7a90a218429c17ecdb43e7c2d3fc65bad869', width: "18", height: "18" }), instance.t('schedulerEditorTitle'), h("tooltip-component", { key: '941defe65536ce694d47b68298904e3ee448fb5e' }, h("info-icon", { key: '3860588fb8fb8fc7419df429766257b135043627', slot: "tooltip-icon" }), h("span", { key: 'c3fe9ff5a23aecdef9ecc45974a846e88fead7be', slot: "tooltip-content" }, this.version))), h("div", { key: '5fb895b77c77bdf513f775967f669e607f6a419e', class: {
|
|
2317
2318
|
language: true,
|
|
2318
|
-
}, part: "nse__language" }, h("select-dropdown", { key: '
|
|
2319
|
+
}, part: "nse__language" }, h("select-dropdown", { key: '972e005c4becf8494048cc952eff074633bd8429', name: "language", searchPlaceholder: instance.t('search'), options: languageOptions, withChevron: false, themeConfig: this.themeConfig, defaultSelectedOption: languageOptions.find(lang => lang.value == this.selectedLanguage), exportparts: "sd_dropdown: nse__language-dropdown, sd_dropdown-button: nse__language-drop-button, sd_dropdown-content: nse__language-drop-content, sd_dropdown_label: nse__language-drop-label" }, h("span", { key: 'cceaa3dac394d5dc2e9cb8c867076cefb851b15c', slot: "select-icon" }, h("translate-icon", { key: '16745ecd705c55c71fb5faada738550cbe08a2a0', width: "20", height: "20" })))), h("button", { key: '09a7792870c66c5c8f4942295cf1d1f9338567db', class: "scheduler-editor-close", title: "logout", onClick: e => this.handleSchedulerConfigCloseClicked(e), part: "nse__close-button" }, h("close-icon", { key: 'f81b55af3c5ddc672b29ceade637fdf323f02b34', width: "18", height: "18" }))), h("div", { key: '7041febbcadd6f4ea62ff078fe324a15d5582e2a', class: {
|
|
2319
2320
|
'scheduler-editor-content': true,
|
|
2320
2321
|
'scheduler-editor-content--group': isGroupType,
|
|
2321
|
-
}, part: "nse__content" }, this.stores?.schedulerConfig?.state.currentUser && this.stores.schedulerConfig.state.action === null && (h("div", { key: '
|
|
2322
|
+
}, part: "nse__content" }, this.stores?.schedulerConfig?.state.currentUser && this.stores.schedulerConfig.state.action === null && (h("div", { key: 'a8379dfe87556939519caf93658b26991dd566bd', class: "list-configurations", part: "nse__list-configurations" }, h("nylas-list-configurations", { key: '2e45e016e43a1bb7ecdc296f86e10d3ce2d50f2f', themeConfig: this.themeConfig, exportparts: "nlc__create-new-cta, actions__dropdown, actions__dropdown-button, actions__dropdown-content, actions-Copy, actions-Preview, actions-Delete" }))), this.stores?.schedulerConfig?.state.currentUser && this.stores.schedulerConfig.state.action === 'create-select' && (h("nylas-select-event-type", { key: '9af93063ec39c9d22bfd86d05b47f5f04e869ab5', themeConfig: this.themeConfig })), this.stores?.schedulerConfig?.state.currentUser && this.stores.schedulerConfig.state.action === 'create' && isGroupType && (h("nylas-editor-tabs-group", { key: 'fd1afe59f4408c4ae9088f2abfff3660903378eb', mode: "composable", themeConfig: this.themeConfig }, h(ExpressFlow, { key: 'f43c6aded82f92537a94df3412bff83de5195fff', selectedEventType: this.stores?.schedulerConfig?.state?.selectedEventType || CONFIGURATION_EVENT_TYPE.one_on_one, currentUser: this.stores?.schedulerConfig?.state.currentUser, calendars: this.stores?.schedulerConfig?.state?.calendars, selectedConfiguration: this.stores?.schedulerConfig?.state?.selectedConfiguration }))), this.stores?.schedulerConfig?.state.currentUser && this.stores.schedulerConfig.state.action === 'create' && !isGroupType && (h("nylas-editor-tabs", { key: 'aec5db0eb2cde75312e2e1b22f0b2fca70aeff17', mode: "composable", enableNotetaker: this.enableNotetaker, themeConfig: this.themeConfig }, h(ExpressFlow, { key: 'c84c162c47edea12f2f49fe4997556455d429a64', selectedEventType: this.stores?.schedulerConfig?.state?.selectedEventType || CONFIGURATION_EVENT_TYPE.one_on_one, currentUser: this.stores?.schedulerConfig?.state.currentUser, calendars: this.stores?.schedulerConfig?.state?.calendars, selectedConfiguration: this.stores?.schedulerConfig?.state?.selectedConfiguration }))), this.stores?.schedulerConfig?.state.currentUser && this.stores.schedulerConfig.state.action === 'edit' && isGroupType && (h("nylas-editor-tabs-group", { key: selectedConfigId, mode: this.mode, themeConfig: this.themeConfig }, this.mode === 'composable' && h("slot", { key: '926d10d3b44add318479a10045a325c66f9b31ee' }), this.mode === 'app' && hasSlot && (h("div", { style: { display: 'none' }, slot: "custom-page-style-inputs", key: selectedConfigId }, h("slot", { key: '3113ec5f098da197e675ce766f8a31d198b4ecd5', name: "custom-page-style-inputs" }))))), this.stores?.schedulerConfig?.state.currentUser && this.stores.schedulerConfig.state.action === 'edit' && !isGroupType && (h("nylas-editor-tabs", { key: selectedConfigId, mode: this.mode, enableNotetaker: this.enableNotetaker, themeConfig: this.themeConfig }, this.mode === 'composable' && h("slot", { key: '3608dbcd3c37b7dae13cd57d06c4a9e6e0079935' }), this.mode === 'app' && hasSlot && (h("div", { style: { display: 'none' }, slot: "custom-page-style-inputs", key: selectedConfigId }, h("slot", { key: '941ed1bcdd350e930b60d37bcf1596e5ef9d42be', name: "custom-page-style-inputs" }))))), !this.stores?.schedulerConfig?.state.currentUser && (h("slot", { key: 'a8787f5d831d66d4b49b7937926c6893dea942c5', name: "login-required" }, h(LoginRequired, { key: 'ef5e6850a63ea8ddbceb82f9bfa21f58cbb22a9a', authenticationUrl: this.authenticationUrl }))))));
|
|
2322
2323
|
}
|
|
2323
2324
|
get host() { return getElement(this); }
|
|
2324
2325
|
static get watchers() { return {
|