@nylas/web-elements 0.0.0-test-20250319204140 → 0.0.0-test-20250320184617
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 +26 -26
- package/dist/cdn/nylas-scheduling/nylas-scheduling.es.js +4813 -4805
- package/dist/cjs/button-component_2.cjs.entry.js +1 -1
- package/dist/cjs/button-component_2.cjs.entry.js.map +1 -1
- package/dist/cjs/calendar-agenda-fill-icon_36.cjs.entry.js +17 -18
- package/dist/cjs/calendar-agenda-fill-icon_36.cjs.entry.js.map +1 -1
- package/dist/cjs/chevron-icon_3.cjs.entry.js +1 -1
- package/dist/cjs/chevron-icon_3.cjs.entry.js.map +1 -1
- package/dist/cjs/google-logo-icon_6.cjs.entry.js +5 -5
- package/dist/cjs/google-logo-icon_6.cjs.entry.js.map +1 -1
- package/dist/cjs/input-dropdown_2.cjs.entry.js +2 -2
- package/dist/cjs/input-dropdown_2.cjs.entry.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/multi-select-dropdown_2.cjs.entry.js +2 -2
- package/dist/cjs/multi-select-dropdown_2.cjs.entry.js.map +1 -1
- package/dist/cjs/nylas-booked-event-card_12.cjs.entry.js +14 -10
- package/dist/cjs/nylas-booked-event-card_12.cjs.entry.js.map +1 -1
- package/dist/cjs/nylas-key-points.cjs.entry.js +1 -1
- package/dist/cjs/nylas-key-points.cjs.entry.js.map +1 -1
- package/dist/cjs/nylas-provider.cjs.entry.js +1 -1
- package/dist/cjs/nylas-provider.cjs.entry.js.map +1 -1
- package/dist/cjs/nylas-scheduling.cjs.entry.js +1 -1
- package/dist/cjs/nylas-scheduling.cjs.entry.js.map +1 -1
- package/dist/cjs/nylas-web-elements.cjs.js +1 -1
- package/dist/cjs/{scheduler-store-c1fc5cf3.js → scheduler-store-df3a9a3a.js} +9 -1
- package/dist/cjs/scheduler-store-df3a9a3a.js.map +1 -0
- package/dist/collection/components/design-system/button-component/button-component.js +4 -3
- package/dist/collection/components/design-system/button-component/button-component.js.map +1 -1
- package/dist/collection/components/design-system/input-dropdown/input-dropdown.js +10 -7
- package/dist/collection/components/design-system/input-dropdown/input-dropdown.js.map +1 -1
- package/dist/collection/components/design-system/multi-select-dropdown/multi-select-dropdown.js +5 -4
- package/dist/collection/components/design-system/multi-select-dropdown/multi-select-dropdown.js.map +1 -1
- package/dist/collection/components/design-system/select-dropdown/select-dropdown.js +13 -9
- package/dist/collection/components/design-system/select-dropdown/select-dropdown.js.map +1 -1
- package/dist/collection/components/design-system/time-period-selector/time-period-selector.js +3 -3
- package/dist/collection/components/design-system/time-period-selector/time-period-selector.js.map +1 -1
- package/dist/collection/components/nylas-notebook/nylas-key-points/nylas-key-points.js +4 -3
- package/dist/collection/components/nylas-notebook/nylas-key-points/nylas-key-points.js.map +1 -1
- package/dist/collection/components/nylas-provider/nylas-provider.js +1 -1
- package/dist/collection/components/scheduler/nylas-booked-event-card/nylas-booked-event-card.js +13 -11
- package/dist/collection/components/scheduler/nylas-booked-event-card/nylas-booked-event-card.js.map +1 -1
- package/dist/collection/components/scheduler/nylas-booking-form/nylas-booking-form.js +3 -3
- package/dist/collection/components/scheduler/nylas-booking-form/nylas-booking-form.js.map +1 -1
- package/dist/collection/components/scheduler/nylas-booking-form/test/nylas-booking-form.spec.js +8 -6
- package/dist/collection/components/scheduler/nylas-booking-form/test/nylas-booking-form.spec.js.map +1 -1
- package/dist/collection/components/scheduler/nylas-organizer-confirmation-card/nylas-organizer-confirmation-card.js +8 -10
- package/dist/collection/components/scheduler/nylas-organizer-confirmation-card/nylas-organizer-confirmation-card.js.map +1 -1
- package/dist/collection/components/scheduler/nylas-scheduling/nylas-scheduling.js +2 -2
- package/dist/collection/components/scheduler/nylas-scheduling/nylas-scheduling.js.map +1 -1
- package/dist/collection/components/scheduler-editor/nylas-buffer-time/nylas-buffer-time.js +2 -2
- package/dist/collection/components/scheduler-editor/nylas-buffer-time/nylas-buffer-time.js.map +1 -1
- package/dist/collection/components/scheduler-editor/nylas-editor-tabs-group/nylas-editor-tabs-group.js +36 -21
- package/dist/collection/components/scheduler-editor/nylas-editor-tabs-group/nylas-editor-tabs-group.js.map +1 -1
- package/dist/collection/components/scheduler-editor/nylas-event-duration/nylas-event-duration.js +15 -16
- package/dist/collection/components/scheduler-editor/nylas-event-duration/nylas-event-duration.js.map +1 -1
- package/dist/collection/connector/nylas-scheduler-connector/errors/index.js +1 -29
- package/dist/collection/connector/nylas-scheduler-connector/errors/index.js.map +1 -1
- package/dist/collection/connector/shared/api/auth.js.map +1 -1
- package/dist/collection/connector/shared/api/scheduler.js.map +1 -1
- package/dist/collection/types/index.js +29 -0
- package/dist/collection/types/index.js.map +1 -1
- package/dist/components/button-component2.js +1 -1
- package/dist/components/button-component2.js.map +1 -1
- package/dist/components/input-dropdown2.js +1 -1
- package/dist/components/input-dropdown2.js.map +1 -1
- package/dist/components/multi-select-dropdown2.js +2 -2
- package/dist/components/multi-select-dropdown2.js.map +1 -1
- package/dist/components/nylas-booked-event-card2.js +9 -5
- package/dist/components/nylas-booked-event-card2.js.map +1 -1
- package/dist/components/nylas-booking-form2.js +3 -3
- package/dist/components/nylas-booking-form2.js.map +1 -1
- package/dist/components/nylas-buffer-time2.js +2 -2
- package/dist/components/nylas-buffer-time2.js.map +1 -1
- package/dist/components/nylas-editor-tabs-group2.js +5 -5
- package/dist/components/nylas-editor-tabs-group2.js.map +1 -1
- package/dist/components/nylas-event-duration2.js +15 -16
- package/dist/components/nylas-event-duration2.js.map +1 -1
- package/dist/components/nylas-key-points.js +1 -1
- package/dist/components/nylas-key-points.js.map +1 -1
- package/dist/components/nylas-organizer-confirmation-card2.js +4 -4
- package/dist/components/nylas-organizer-confirmation-card2.js.map +1 -1
- package/dist/components/nylas-provider.js.map +1 -1
- package/dist/components/nylas-scheduling.js.map +1 -1
- package/dist/components/scheduler-store.js +8 -0
- package/dist/components/scheduler-store.js.map +1 -1
- package/dist/components/select-dropdown2.js +1 -1
- package/dist/components/select-dropdown2.js.map +1 -1
- package/dist/components/time-period-selector2.js +1 -1
- package/dist/components/time-period-selector2.js.map +1 -1
- package/dist/esm/button-component_2.entry.js +1 -1
- package/dist/esm/button-component_2.entry.js.map +1 -1
- package/dist/esm/calendar-agenda-fill-icon_36.entry.js +17 -18
- package/dist/esm/calendar-agenda-fill-icon_36.entry.js.map +1 -1
- package/dist/esm/chevron-icon_3.entry.js +1 -1
- package/dist/esm/chevron-icon_3.entry.js.map +1 -1
- package/dist/esm/google-logo-icon_6.entry.js +5 -5
- package/dist/esm/google-logo-icon_6.entry.js.map +1 -1
- package/dist/esm/input-dropdown_2.entry.js +2 -2
- package/dist/esm/input-dropdown_2.entry.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/multi-select-dropdown_2.entry.js +2 -2
- package/dist/esm/multi-select-dropdown_2.entry.js.map +1 -1
- package/dist/esm/nylas-booked-event-card_12.entry.js +14 -10
- package/dist/esm/nylas-booked-event-card_12.entry.js.map +1 -1
- package/dist/esm/nylas-key-points.entry.js +1 -1
- package/dist/esm/nylas-key-points.entry.js.map +1 -1
- package/dist/esm/nylas-provider.entry.js +1 -1
- package/dist/esm/nylas-provider.entry.js.map +1 -1
- package/dist/esm/nylas-scheduling.entry.js +1 -1
- package/dist/esm/nylas-scheduling.entry.js.map +1 -1
- package/dist/esm/nylas-web-elements.js +1 -1
- package/dist/esm/{scheduler-store-bbb4cf8d.js → scheduler-store-ef022be9.js} +9 -1
- package/dist/esm/scheduler-store-ef022be9.js.map +1 -0
- package/dist/nylas-web-elements/nylas-web-elements.esm.js +1 -1
- package/dist/nylas-web-elements/nylas-web-elements.esm.js.map +1 -1
- package/dist/nylas-web-elements/{p-c3cfe486.entry.js → p-09bbd467.entry.js} +2 -2
- package/dist/nylas-web-elements/p-09bbd467.entry.js.map +1 -0
- package/dist/nylas-web-elements/{p-6371e0a3.entry.js → p-0d80f50b.entry.js} +2 -2
- package/dist/nylas-web-elements/p-0d80f50b.entry.js.map +1 -0
- package/dist/nylas-web-elements/p-13a6c977.entry.js +2 -0
- package/dist/nylas-web-elements/p-13a6c977.entry.js.map +1 -0
- package/dist/nylas-web-elements/{p-14569ed8.entry.js → p-1fb32e0e.entry.js} +2 -2
- package/dist/nylas-web-elements/p-1fb32e0e.entry.js.map +1 -0
- package/dist/nylas-web-elements/{p-19f6fcf8.entry.js → p-3ca36162.entry.js} +2 -2
- package/dist/nylas-web-elements/p-3ca36162.entry.js.map +1 -0
- package/dist/nylas-web-elements/{p-78bd1f85.entry.js → p-51434e4a.entry.js} +2 -2
- package/dist/nylas-web-elements/p-51434e4a.entry.js.map +1 -0
- package/dist/nylas-web-elements/p-731a856b.js +2 -0
- package/dist/nylas-web-elements/p-731a856b.js.map +1 -0
- package/dist/nylas-web-elements/p-7b787c73.entry.js +8 -0
- package/dist/nylas-web-elements/p-7b787c73.entry.js.map +1 -0
- package/dist/nylas-web-elements/{p-f7ea608d.entry.js → p-a906d005.entry.js} +2 -2
- package/dist/nylas-web-elements/p-a906d005.entry.js.map +1 -0
- package/dist/nylas-web-elements/p-ab3ba8dc.entry.js +2 -0
- package/dist/nylas-web-elements/p-ab3ba8dc.entry.js.map +1 -0
- package/dist/nylas-web-elements/{p-91bc630c.entry.js → p-b1c57792.entry.js} +2 -2
- package/dist/nylas-web-elements/p-b1c57792.entry.js.map +1 -0
- package/dist/types/components/design-system/button-component/button-component.d.ts +1 -2
- package/dist/types/components/design-system/input-dropdown/input-dropdown.d.ts +1 -6
- package/dist/types/components/design-system/multi-select-dropdown/multi-select-dropdown.d.ts +1 -7
- package/dist/types/components/design-system/select-dropdown/select-dropdown.d.ts +1 -6
- package/dist/types/components/design-system/time-period-selector/time-period-selector.d.ts +1 -1
- package/dist/types/components/nylas-notebook/nylas-key-points/nylas-key-points.d.ts +1 -6
- package/dist/types/components/scheduler/nylas-booked-event-card/nylas-booked-event-card.d.ts +2 -1
- package/dist/types/components/scheduler/nylas-booking-form/nylas-booking-form.d.ts +1 -1
- package/dist/types/components/scheduler/nylas-organizer-confirmation-card/nylas-organizer-confirmation-card.d.ts +1 -1
- package/dist/types/components/scheduler-editor/nylas-editor-tabs-group/nylas-editor-tabs-group.d.ts +17 -16
- package/dist/types/components/scheduler-editor/nylas-event-duration/nylas-event-duration.d.ts +2 -2
- package/dist/types/components.d.ts +17 -17
- package/dist/types/connector/nylas-connector/index.d.ts +1 -1
- package/dist/types/connector/nylas-scheduler-connector/errors/index.d.ts +1 -31
- package/dist/types/connector/shared/api/auth.d.ts +1 -1
- package/dist/types/connector/shared/api/scheduler.d.ts +1 -1
- package/dist/types/types/index.d.ts +36 -0
- package/package.json +2 -2
- package/dist/cjs/scheduler-store-c1fc5cf3.js.map +0 -1
- package/dist/esm/scheduler-store-bbb4cf8d.js.map +0 -1
- package/dist/nylas-web-elements/p-14569ed8.entry.js.map +0 -1
- package/dist/nylas-web-elements/p-19f6fcf8.entry.js.map +0 -1
- package/dist/nylas-web-elements/p-463d9c42.entry.js +0 -8
- package/dist/nylas-web-elements/p-463d9c42.entry.js.map +0 -1
- package/dist/nylas-web-elements/p-6371e0a3.entry.js.map +0 -1
- package/dist/nylas-web-elements/p-78bd1f85.entry.js.map +0 -1
- package/dist/nylas-web-elements/p-91bc630c.entry.js.map +0 -1
- package/dist/nylas-web-elements/p-ac757a7b.entry.js +0 -2
- package/dist/nylas-web-elements/p-ac757a7b.entry.js.map +0 -1
- package/dist/nylas-web-elements/p-b0f18064.entry.js +0 -2
- package/dist/nylas-web-elements/p-b0f18064.entry.js.map +0 -1
- package/dist/nylas-web-elements/p-c3cfe486.entry.js.map +0 -1
- package/dist/nylas-web-elements/p-f0c25e38.js +0 -2
- package/dist/nylas-web-elements/p-f0c25e38.js.map +0 -1
- package/dist/nylas-web-elements/p-f7ea608d.entry.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"multi-select-dropdown.nylas-date-component.entry.cjs.js","mappings":"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","names":["debug","h","Host","sanitize"],"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","src/components/design-system/nylas-date-component/nylas-date-component.scss?tag=nylas-date-component&encapsulation=shadow","src/components/design-system/nylas-date-component/nylas-date-component.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\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: transparent;\n border: 1px solid var(--nylas-base-200);\n border-radius: var(--nylas-border-radius-2x);\n\n &.focus {\n background: transparent;\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 background: var(--nylas-base-0);\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, Prop, State, Watch, h } from '@stencil/core';\n\ninterface DropdownOption {\n label: string;\n value: string;\n selected?: boolean; // Add a selected flag to each option\n disabled?: boolean; // Add a disabled flag to each option\n}\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 // 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 // Lifecycle methods\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 = 'Please select at least one option';\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 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.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","@import '../../../common/styles/variables.scss';\n@import '../../../common/mixins/inputs.scss';\n\n:host {\n display: block;\n height: auto;\n @include default-css-variables;\n width: 100%;\n}\n\nlabel {\n @include input-label;\n flex-direction: column;\n gap: 4px;\n font-family: var(--nylas-font-family);\n font-size: 16px;\n color: var(--nylas-base-800);\n\n p {\n margin: 0;\n }\n\n .error {\n color: var(--nylas-error);\n }\n}\n\n.input_wrapper {\n display: flex;\n align-items: center;\n gap: 1rem;\n}\n\ninput[type='date'] {\n @include textfield;\n width: 100%;\n width: -moz-available;\n width: -webkit-fill-available;\n font-family: var(--nylas-font-family);\n cursor: pointer;\n}\n\ninput:read-only {\n background-color: var(--nylas-base-100);\n cursor: not-allowed;\n}\n","import { Component, h, Prop, State, Event, EventEmitter, Listen, Watch, Element } from '@stencil/core';\nimport { sanitize } from '@/utils/utils';\n\nconst DefaultPlaceholder = {\n date: 'YYYY-MM-DD',\n};\n\n/**\n * The `nylas-date-component` component is a UI component that allows users to input text, email, or phone number values.\n * This component is used in the scheduling form to input text, email and phone number type inputs.\n */\n\n@Component({\n tag: 'nylas-date-component',\n styleUrl: 'nylas-date-component.scss',\n shadow: true,\n})\nexport class NylasDateComponent {\n /**\n * The host element\n */\n @Element() el!: HTMLElement;\n /**\n * The name of the input. This is used to identify the input when submitting a form.\n */\n @Prop() name: string = 'input';\n /**\n * The default value of the input. This is the value that is displayed when the input is rendered.\n */\n @Prop() defaultValue?: string;\n /**\n * The label of the input. This is displayed above the input.\n */\n @Prop() label: string = '';\n\n /**\n * The placeholder of the input. This is displayed when the input is empty.\n */\n @Prop() placeholder: string = DefaultPlaceholder['date'];\n /**\n * Whether the input is required. If true, the input must have a value when submitting a form.\n * Default is false. If the input is required and the value is empty, an error message is displayed.\n */\n @Prop() required: boolean = false;\n /**\n * Whether the input is read-only. If true, the input cannot be edited.\n * Default is false.\n */\n @Prop() readOnly: boolean = false;\n /**\n * Whether the input should be focused when rendered.\n * Default is false. If true, the input is focused when rendered.\n * Use this to set the focus on the first input in a form.\n */\n @Prop() autoFocus: boolean = false;\n /**\n * The pattern to validate the input value. If the value does not match the pattern, an error message is displayed.\n * Default is null. If the pattern is not set, the pattern is determined by the input type for 'email' and 'phone_number'.\n */\n @Prop() pattern?: RegExp;\n /**\n * The maximum length of the input value. If the value is longer than the maximum length, an error message is displayed.\n * Default is 255.\n */\n @Prop() maxLength: number = 255;\n /**\n * The error message to display when the value does not match the pattern.\n * Default is 'Invalid <field> format.' where <field> is the input label.\n */\n @Prop() patternError: string = '';\n\n /**\n * This error message is displayed when the input value is empty and the input is required.\n */\n @Prop() requiredError: string = '';\n\n /**\n * The input value state.\n */\n @State() value!: string;\n /**\n * The error message state.\n */\n @State() error: string = '';\n\n /**\n * State to track the validity of the date input.\n */\n @State() isDateValid: boolean = true;\n\n /**\n * This event is fired when the input value is changed.\n * The scheduling form listens for this event to validate the input value and submit the form.\n * If using outside of the scheduling form, listen for this event to validate the input value\n * and handle the input value change.\n */\n @Event() nylasFormInputChanged!: EventEmitter<{\n value: string;\n name: string;\n label: string;\n type: string;\n error: string;\n }>;\n\n @Event() nylasFormInputFocused!: EventEmitter<{\n value: string;\n name: string;\n }>;\n\n @Event() nylasFormInputBlurred!: EventEmitter<{\n value: string;\n name: string;\n }>;\n\n // Lifecycle methods\n @Watch('defaultValue')\n handleDefaultValueChange(newValue: string) {\n this.value = sanitize(newValue);\n if (this.value) {\n this.validatePattern(this.value);\n }\n }\n\n componentDidLoad() {\n this.value = sanitize(this.defaultValue || '');\n if (this.value) {\n this.validatePattern(this.value);\n }\n }\n\n // Event listeners\n /**\n * Listen for the bookingFormSubmitted event to validate the input value when the form is submitted.\n */\n @Listen('bookingFormSubmitted', { target: 'document' })\n handleBookingFormSubmitted(event: CustomEvent) {\n this.validatePattern(this.value);\n if (this.error) {\n event.preventDefault();\n }\n }\n\n @Listen('formSubmitted', { target: 'document' })\n async handleFormSubmitted(event: CustomEvent) {\n this.validatePattern(this.value);\n if (this.error) {\n event.preventDefault();\n }\n }\n\n // Methods\n handleInput(e: Event) {\n this.error = '';\n const target = e.target as HTMLInputElement;\n this.value = sanitize(target.value);\n this.isDateValid = target.validity.valid;\n this.nylasFormInputChanged.emit({\n value: this.value,\n name: this.name,\n label: this.label,\n error: this.error,\n type: 'date',\n });\n }\n\n handleBlur() {\n this.nylasFormInputBlurred.emit({\n value: this.value,\n name: this.name,\n });\n }\n\n handleFocus() {\n this.nylasFormInputFocused.emit({\n value: this.value,\n name: this.name,\n });\n }\n\n validatePattern(value: string) {\n // Reset error\n this.error = '';\n if (this.required && !this.isDateValid) {\n this.error = 'Please enter a valid date';\n return;\n }\n // Check if the field is required and value is empty\n if (this.required && !value) {\n this.error = this.requiredError || 'This field is required.';\n return;\n }\n // Check if value matches pattern\n if (!this.pattern || (!value && !this.required)) return;\n\n if (this.pattern.test(value)) {\n this.error = '';\n } else {\n this.error = this.patternError || 'Invalid format.';\n }\n }\n\n render() {\n return (\n <label part=\"ic__label\" class={{ error: !!this.error }}>\n {this.label && (\n <p>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\">*</span>}\n </p>\n )}\n <div part=\"ic__input_wrapper\" class=\"input_wrapper\">\n <input\n type=\"date\"\n name={this.name}\n part=\"ic__date\"\n title={this.readOnly ? 'read-only field' : undefined}\n readOnly={this.readOnly}\n autoFocus={this.autoFocus}\n value={this.value}\n maxLength={this.maxLength}\n placeholder={this.placeholder}\n class={{ error: !!this.error }}\n onInput={e => this.handleInput(e)}\n onFocus={() => this.handleFocus()}\n onBlur={() => this.handleBlur()}\n />\n <slot name=\"additional-input\"></slot>\n </div>\n {this.error && <span class=\"error help-text\">{this.error}</span>}\n </label>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"multi-select-dropdown.nylas-date-component.entry.cjs.js","mappings":"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","names":["debug","h","Host","sanitize"],"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","src/components/design-system/nylas-date-component/nylas-date-component.scss?tag=nylas-date-component&encapsulation=shadow","src/components/design-system/nylas-date-component/nylas-date-component.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\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: transparent;\n border: 1px solid var(--nylas-base-200);\n border-radius: var(--nylas-border-radius-2x);\n\n &.focus {\n background: transparent;\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 background: var(--nylas-base-0);\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, Prop, State, Watch, h } from '@stencil/core';\nimport { DropdownOption } 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 // 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 // Lifecycle methods\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 = 'Please select at least one option';\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 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.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","@import '../../../common/styles/variables.scss';\n@import '../../../common/mixins/inputs.scss';\n\n:host {\n display: block;\n height: auto;\n @include default-css-variables;\n width: 100%;\n}\n\nlabel {\n @include input-label;\n flex-direction: column;\n gap: 4px;\n font-family: var(--nylas-font-family);\n font-size: 16px;\n color: var(--nylas-base-800);\n\n p {\n margin: 0;\n }\n\n .error {\n color: var(--nylas-error);\n }\n}\n\n.input_wrapper {\n display: flex;\n align-items: center;\n gap: 1rem;\n}\n\ninput[type='date'] {\n @include textfield;\n width: 100%;\n width: -moz-available;\n width: -webkit-fill-available;\n font-family: var(--nylas-font-family);\n cursor: pointer;\n}\n\ninput:read-only {\n background-color: var(--nylas-base-100);\n cursor: not-allowed;\n}\n","import { Component, h, Prop, State, Event, EventEmitter, Listen, Watch, Element } from '@stencil/core';\nimport { sanitize } from '@/utils/utils';\n\nconst DefaultPlaceholder = {\n date: 'YYYY-MM-DD',\n};\n\n/**\n * The `nylas-date-component` component is a UI component that allows users to input text, email, or phone number values.\n * This component is used in the scheduling form to input text, email and phone number type inputs.\n */\n\n@Component({\n tag: 'nylas-date-component',\n styleUrl: 'nylas-date-component.scss',\n shadow: true,\n})\nexport class NylasDateComponent {\n /**\n * The host element\n */\n @Element() el!: HTMLElement;\n /**\n * The name of the input. This is used to identify the input when submitting a form.\n */\n @Prop() name: string = 'input';\n /**\n * The default value of the input. This is the value that is displayed when the input is rendered.\n */\n @Prop() defaultValue?: string;\n /**\n * The label of the input. This is displayed above the input.\n */\n @Prop() label: string = '';\n\n /**\n * The placeholder of the input. This is displayed when the input is empty.\n */\n @Prop() placeholder: string = DefaultPlaceholder['date'];\n /**\n * Whether the input is required. If true, the input must have a value when submitting a form.\n * Default is false. If the input is required and the value is empty, an error message is displayed.\n */\n @Prop() required: boolean = false;\n /**\n * Whether the input is read-only. If true, the input cannot be edited.\n * Default is false.\n */\n @Prop() readOnly: boolean = false;\n /**\n * Whether the input should be focused when rendered.\n * Default is false. If true, the input is focused when rendered.\n * Use this to set the focus on the first input in a form.\n */\n @Prop() autoFocus: boolean = false;\n /**\n * The pattern to validate the input value. If the value does not match the pattern, an error message is displayed.\n * Default is null. If the pattern is not set, the pattern is determined by the input type for 'email' and 'phone_number'.\n */\n @Prop() pattern?: RegExp;\n /**\n * The maximum length of the input value. If the value is longer than the maximum length, an error message is displayed.\n * Default is 255.\n */\n @Prop() maxLength: number = 255;\n /**\n * The error message to display when the value does not match the pattern.\n * Default is 'Invalid <field> format.' where <field> is the input label.\n */\n @Prop() patternError: string = '';\n\n /**\n * This error message is displayed when the input value is empty and the input is required.\n */\n @Prop() requiredError: string = '';\n\n /**\n * The input value state.\n */\n @State() value!: string;\n /**\n * The error message state.\n */\n @State() error: string = '';\n\n /**\n * State to track the validity of the date input.\n */\n @State() isDateValid: boolean = true;\n\n /**\n * This event is fired when the input value is changed.\n * The scheduling form listens for this event to validate the input value and submit the form.\n * If using outside of the scheduling form, listen for this event to validate the input value\n * and handle the input value change.\n */\n @Event() nylasFormInputChanged!: EventEmitter<{\n value: string;\n name: string;\n label: string;\n type: string;\n error: string;\n }>;\n\n @Event() nylasFormInputFocused!: EventEmitter<{\n value: string;\n name: string;\n }>;\n\n @Event() nylasFormInputBlurred!: EventEmitter<{\n value: string;\n name: string;\n }>;\n\n // Lifecycle methods\n @Watch('defaultValue')\n handleDefaultValueChange(newValue: string) {\n this.value = sanitize(newValue);\n if (this.value) {\n this.validatePattern(this.value);\n }\n }\n\n componentDidLoad() {\n this.value = sanitize(this.defaultValue || '');\n if (this.value) {\n this.validatePattern(this.value);\n }\n }\n\n // Event listeners\n /**\n * Listen for the bookingFormSubmitted event to validate the input value when the form is submitted.\n */\n @Listen('bookingFormSubmitted', { target: 'document' })\n handleBookingFormSubmitted(event: CustomEvent) {\n this.validatePattern(this.value);\n if (this.error) {\n event.preventDefault();\n }\n }\n\n @Listen('formSubmitted', { target: 'document' })\n async handleFormSubmitted(event: CustomEvent) {\n this.validatePattern(this.value);\n if (this.error) {\n event.preventDefault();\n }\n }\n\n // Methods\n handleInput(e: Event) {\n this.error = '';\n const target = e.target as HTMLInputElement;\n this.value = sanitize(target.value);\n this.isDateValid = target.validity.valid;\n this.nylasFormInputChanged.emit({\n value: this.value,\n name: this.name,\n label: this.label,\n error: this.error,\n type: 'date',\n });\n }\n\n handleBlur() {\n this.nylasFormInputBlurred.emit({\n value: this.value,\n name: this.name,\n });\n }\n\n handleFocus() {\n this.nylasFormInputFocused.emit({\n value: this.value,\n name: this.name,\n });\n }\n\n validatePattern(value: string) {\n // Reset error\n this.error = '';\n if (this.required && !this.isDateValid) {\n this.error = 'Please enter a valid date';\n return;\n }\n // Check if the field is required and value is empty\n if (this.required && !value) {\n this.error = this.requiredError || 'This field is required.';\n return;\n }\n // Check if value matches pattern\n if (!this.pattern || (!value && !this.required)) return;\n\n if (this.pattern.test(value)) {\n this.error = '';\n } else {\n this.error = this.patternError || 'Invalid format.';\n }\n }\n\n render() {\n return (\n <label part=\"ic__label\" class={{ error: !!this.error }}>\n {this.label && (\n <p>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\">*</span>}\n </p>\n )}\n <div part=\"ic__input_wrapper\" class=\"input_wrapper\">\n <input\n type=\"date\"\n name={this.name}\n part=\"ic__date\"\n title={this.readOnly ? 'read-only field' : undefined}\n readOnly={this.readOnly}\n autoFocus={this.autoFocus}\n value={this.value}\n maxLength={this.maxLength}\n placeholder={this.placeholder}\n class={{ error: !!this.error }}\n onInput={e => this.handleInput(e)}\n onFocus={() => this.handleFocus()}\n onBlur={() => this.handleBlur()}\n />\n <slot name=\"additional-input\"></slot>\n </div>\n {this.error && <span class=\"error help-text\">{this.error}</span>}\n </label>\n );\n }\n}\n"],"version":3}
|
|
@@ -35,6 +35,10 @@ const NylasBookedEventCard = class {
|
|
|
35
35
|
this.handleCancelBookingButtonClicked = () => {
|
|
36
36
|
const startTime = new Date(this.selectedTimeslot.start_time);
|
|
37
37
|
const minCancellationNotice = this.configSettings?.scheduler?.min_cancellation_notice;
|
|
38
|
+
if (!minCancellationNotice) {
|
|
39
|
+
this.cancelBookingButtonClicked.emit({ bookingId: this.eventInfo.booking_id });
|
|
40
|
+
return;
|
|
41
|
+
}
|
|
38
42
|
const dateTillCancellation = startTime.getTime() - minCancellationNotice * 60 * 1000;
|
|
39
43
|
if (dateTillCancellation < new Date().getTime()) {
|
|
40
44
|
this.cancelBookedEventValidationError.emit({
|
|
@@ -114,17 +118,17 @@ const NylasBookedEventCard = class {
|
|
|
114
118
|
render() {
|
|
115
119
|
const bookingType = this.configSettings?.booking_type;
|
|
116
120
|
const isManualConfirmation = bookingType && bookingType !== 'booking';
|
|
117
|
-
return (index.h(index.Host, { key: '
|
|
121
|
+
return (index.h(index.Host, { key: 'dbe7087b88cf1eff27686e9a7ef321729bea3c8b', part: "nbec" }, index.h("div", { key: 'a219990cac8a7f0e7935f03cf1c57ea137564958', class: "nylas-booked-event-card" }, index.h("div", { key: 'e19d395321ec182846f9fa119c69c7f41ee5f6b2', class: "booked-event-timezone" }, index.h("globe-icon", { key: 'dd47b506f0528f16875476dc53b27e64f2913fb5' }), constants.TIMEZONE_MAP[this.selectedTimezone]), index.h("div", { key: '464f20ff077e64638a03afde99478f7d83409408', class: "event-card-wrapper", part: "nbec__card" }, index.h("div", { key: '5a92d2da8c1b3df9b2d05f6c269478868dff32df', class: "calendar-icon" }, index.h("calendar-check-icon", { key: 'f8611aa6b551338b403f93d2f2395cd9128c9a09' })), index.h("div", { key: 'f8988cf31256a020ab3e9a98be8577bcd3bc8490', class: "booked-event-header" }, index.h("h2", { key: 'a2396483be6d7db392504c6c5f20f335ae14bf74', slot: "card-title", part: "nbec__title" }, !!this.rescheduleBookingId && !this.isLoading
|
|
118
122
|
? `${utils.instance.t('bookingRescheduled')}`
|
|
119
123
|
: isManualConfirmation && !this.isLoading
|
|
120
124
|
? `${utils.instance.t('bookingSent')}`
|
|
121
|
-
: `${utils.instance.t('bookingConfirmed')}`, "!"), index.h("div", { key: '
|
|
125
|
+
: `${utils.instance.t('bookingConfirmed')}`, "!"), index.h("div", { key: 'b614249b561dc5d050dae4603f651e29cbd1303f', class: "card-description", part: "nbec__description" }, isManualConfirmation ? utils.instance.t('bookingSentDescription') : index.h("span", null, utils.instance.t('bookingConfirmedDescription')))), index.h("div", { key: '9098b88ef02d44f0de7a77138a7daf554e516909', class: "booking-date-time" }, index.h("checkmark-circle-icon", { key: '6192670a3b53c9444db27aa1737813851934a213' }), index.h("h3", { key: '8e145c48421d913a68bc17e9eafd29121e8e069e' }, utils.instance.t('bookingDateAndTimeHeader')), index.h("p", { key: '1cf28fc04ff15a87b00a33ea44a5e650a18a231c' }, this.selectedTimeslot?.start_time
|
|
122
126
|
? utils.capitalizeFirstLetter(utils.formatBookedEventDate(this.selectedTimeslot?.start_time, this.selectedTimezone, constants.LANGUAGE_CODE_TO_LOCALE_MAP[this.selectedLanguage]))
|
|
123
|
-
: '-', ' ', index.h("br", { key: '
|
|
127
|
+
: '-', ' ', index.h("br", { key: '0034a1c225c5e48784bad88c97957a896652b0f8' }), this.startTime, " - ", this.endTime)), index.h("div", { key: 'bc919a4c276cb2eb95c05f0409454b9c9dd75fcc', class: "booking-participants" }), !isManualConfirmation && (index.h("div", { class: "button-container" }, index.h("div", { class: {
|
|
124
128
|
'footer': true,
|
|
125
129
|
'no-footer': (this.configSettings?.scheduler?.hide_cancellation_options && this.configSettings?.scheduler?.hide_rescheduling_options) ||
|
|
126
130
|
this.configSettings?.booking_type === 'organizer-confirmation',
|
|
127
|
-
'no-template-cols': this.configSettings?.scheduler?.hide_cancellation_options || this.configSettings?.scheduler?.hide_rescheduling_options,
|
|
131
|
+
'no-template-cols': !!this.configSettings?.scheduler?.hide_cancellation_options || !!this.configSettings?.scheduler?.hide_rescheduling_options,
|
|
128
132
|
} }, !this.configSettings?.scheduler?.hide_cancellation_options && (index.h("button-component", { variant: 'destructive', onClick: this.handleCancelBookingButtonClicked, part: "nbec__button-outline nbec__cancel-cta" }, `${utils.instance.t('cancelBookingButton')}`)), !this.configSettings?.scheduler?.hide_rescheduling_options && (index.h("button-component", { variant: 'basic', onClick: this.handleRescheduleButtonClicked, disabled: this.isLoading, part: "nbec__button-outline nbec__reschedule-cta" }, `${utils.instance.t('rescheduleBookingButton')}`)))))))));
|
|
129
133
|
}
|
|
130
134
|
get host() { return index.getElement(this); }
|
|
@@ -490,7 +494,7 @@ const NylasBookingForm = class {
|
|
|
490
494
|
this.updateAdditionalFields(event.detail.name, event.detail.value);
|
|
491
495
|
}
|
|
492
496
|
render() {
|
|
493
|
-
return (index.h(index.Host, { key: '
|
|
497
|
+
return (index.h(index.Host, { key: '7cc64499522157e62c5703990effe640e032794f' }, index.h("form", { key: '14b8c18e942c2b30027dd4ab7e9f50be749b6d8a', onSubmit: e => this.bookButtonClickedHandler(e), ref: el => (this.formRef = el), noValidate: true }, index.h("div", { key: 'df00121eb4e6491ce7a758690c0bb2fdb3afd2c0', class: "nylas-booking-form", part: "nbf" }, index.h("div", { key: 'f54bdfab54066557fa20defcc90bba5b33211616', class: "input-wrapper", part: "nbf__input-wrapper" }, index.h("input-component", { key: 'b4fb9a672fb708ebc47084c9978fc6c526dda804', label: utils.instance.t('name'), name: "name", id: "name", defaultValue: this.bookingInfo?.primaryParticipant?.name || this.configSettings?.booking?.guest?.name || this.name, placeholder: utils.instance.t('namePlaceholder'), type: "text", readOnly: this.bookingInfo?.primaryParticipant?.nameReadOnly || false, required: true, requiredError: utils.instance.t('fieldRequired', { field: utils.instance.t('name') }), patternError: utils.instance.t('invalidInputFormat', { field: utils.instance.t('name') }), part: "nbf__input-textfield" })), index.h("div", { key: '44f5979a3aacfaedf6baa124ddf3cae468f71e19', class: "input-wrapper", part: "nbf__input-wrapper" }, index.h("input-component", { key: '5e72e7aa54a18a6a3b441a6d3d03c8b08246bc07', label: utils.instance.t('email'), name: "email", id: "email", pattern: emailRegex, defaultValue: this.bookingInfo?.primaryParticipant?.email || this.configSettings?.booking?.guest?.email || this.email, placeholder: utils.instance.t('emailPlaceholder'), type: "email", readOnly: this.bookingInfo?.primaryParticipant?.emailReadOnly || false, required: true, requiredError: utils.instance.t('fieldRequired', { field: utils.instance.t('email') }), patternError: utils.instance.t('invalidInputFormat', { field: utils.instance.t('email') }), part: "nbf__input-textfield" })), this.configSettings?.scheduler?.hide_additional_guests !== true && (index.h("div", { class: "input-wrapper", part: "nbf__input-wrapper" }, this.guestEmails.map((email, index$1) => (index.h("div", { class: "input-wrapper button-wrapper" }, index.h("label", { class: {
|
|
494
498
|
error: !!this.guestEmailErrors[index$1],
|
|
495
499
|
} }, utils.instance.t('guestEmail')), index.h("div", { class: "guest-email-input" }, index.h("input", { type: "email", id: `guest-email-${index$1}`, maxLength: 100, class: {
|
|
496
500
|
'guest-email': true,
|
|
@@ -522,14 +526,14 @@ const NylasBookingForm = class {
|
|
|
522
526
|
return (index.h("div", { class: "input-wrapper", part: "nbf__input-wrapper" }, index.h("nylas-date-component", { readOnly: fieldReadOnly, label: label, defaultValue: defaultValue, name: key, id: key, required: field.required, part: "nbf__date-component" })));
|
|
523
527
|
case 'multi_select': {
|
|
524
528
|
const defaultValues = defaultValue?.split(',').map(item => item.trim()) || [];
|
|
525
|
-
return (index.h("div", null, index.h("multi-select-dropdown", { label: label, name: key, id: key, readOnly: fieldReadOnly, options: field.options?.map(option => ({ value: option, label: option, selected: defaultValues.includes(option) })), required: field.required, exportparts: "msd_dropdown: nbf__ms_dropdown, msd_dropdown-label: nbf__ms_dropdown-label, msd_dropdown-button: nbf__ms_dropdown-button, msd_dropdown-content: nbf__ms_dropdown-content, msd_dropdown_error: nbf__ms_dropdown_error, msd_dropdown-button--error: nbf__ms_dropdown-button--error" })));
|
|
529
|
+
return (index.h("div", null, index.h("multi-select-dropdown", { label: label, name: key, id: key, readOnly: fieldReadOnly, multipleOptionsSelectedLabel: utils.instance.t('multipleOptionsSelected'), options: field.options?.map(option => ({ value: option, label: option, selected: defaultValues.includes(option) })), required: field.required, exportparts: "msd_dropdown: nbf__ms_dropdown, msd_dropdown-label: nbf__ms_dropdown-label, msd_dropdown-button: nbf__ms_dropdown-button, msd_dropdown-content: nbf__ms_dropdown-content, msd_dropdown_error: nbf__ms_dropdown_error, msd_dropdown-button--error: nbf__ms_dropdown-button--error" })));
|
|
526
530
|
}
|
|
527
531
|
case 'metadata':
|
|
528
532
|
return null;
|
|
529
533
|
default:
|
|
530
534
|
return (index.h("div", { class: "input-wrapper", part: "nbf__input-wrapper" }, index.h("input-component", { label: label, name: key, id: key, type: field.type, readOnly: fieldReadOnly, defaultValue: defaultValue || '', requiredError: utils.instance.t('fieldRequired', { field: label }), required: field.required, part: "nbf__input-textfield" })));
|
|
531
535
|
}
|
|
532
|
-
})), index.h("div", { key: '
|
|
536
|
+
})), index.h("div", { key: 'ceca163a222c8be615a63d36f15e1dcdad40c08c', class: "cta" }, index.h("button-component", { key: '300ecbc4bffd1abe7d89684000ea958457392650', variant: 'basic', class: "back", part: "nbf__button-outline", isLoading: this.backButtonLoading && this.isLoading, onClick: this.handleBackButtonClicked }, index.h("slot", { key: '3f3ab4bd1654a53941685961252c57138dbd9cc5', name: "booking-form-back-label" }, `${utils.instance.t('backButton')}`)), index.h("button-component", { key: 'f1e3ecf792c87519589b83678d607bf12756f209', variant: 'primary', isLoading: !this.backButtonLoading && this.isLoading, disabled: this.isLoading, part: "nbf__button-primary", type: "submit" }, index.h("slot", { key: '75e9978b761610c37daf981520dc6e372e02fb38', name: "booking-form-book-label" }, `${utils.instance.t('bookNowButton')}`))))));
|
|
533
537
|
}
|
|
534
538
|
get host() { return index.getElement(this); }
|
|
535
539
|
static get watchers() { return {
|
|
@@ -1505,10 +1509,10 @@ const NylasOrganizerConfirmationCard = class {
|
|
|
1505
1509
|
this.action = null;
|
|
1506
1510
|
}
|
|
1507
1511
|
render() {
|
|
1508
|
-
return (index.h(index.Host, { key: '
|
|
1512
|
+
return (index.h(index.Host, { key: '222871895768a9e8125bf2c7332200e65872b475', part: "nmcc" }, index.h("div", { key: '4838e6be84dab176c13230870f3d0094f1054da9', class: "event-card-wrapper", part: "nmccc__card" }, index.h("div", { key: '004ce2abb9cc4654dd4278e6c7002b34b7346968', class: "calendar-icon" }, index.h("calendar-check-icon", { key: '6202df706f78fcd592738a33b1e052e94f88d6ff' })), index.h("div", { key: '5a1f583617511c35a29fa65f026820996941b707', class: "booked-event-header" }, index.h("h2", { key: '62b88591f4432538d3c57fa6af4142f0cd2c997f', slot: "card-title", part: "nmcc__title" }, !!this.organizerConfirmationBookingId && `${utils.instance.t('bookingPendingTitle')}!`)), index.h("div", { key: '838b6df023be444c1b1ce1dfc7df21cab18756e1', class: "manage-booking-description" }, index.h("p", { key: 'dc119292e92c4565fb84939284fb57f1fb2ec1f6' }, utils.instance.t('bookingPendingnDescription'))), index.h("div", { key: '31cadc6bfc0ae9f0adf93d159cff2261631e2281', class: {
|
|
1509
1513
|
'footer': true,
|
|
1510
|
-
'no-footer': this.configSettings?.scheduler?.hide_cancellation_options && this.configSettings?.scheduler?.hide_rescheduling_options,
|
|
1511
|
-
'no-template-cols': this.configSettings?.scheduler?.hide_cancellation_options || this.configSettings?.scheduler?.hide_rescheduling_options,
|
|
1514
|
+
'no-footer': !!this.configSettings?.scheduler?.hide_cancellation_options && !!this.configSettings?.scheduler?.hide_rescheduling_options,
|
|
1515
|
+
'no-template-cols': !!this.configSettings?.scheduler?.hide_cancellation_options || !!this.configSettings?.scheduler?.hide_rescheduling_options,
|
|
1512
1516
|
} }, !this.configSettings?.scheduler?.hide_cancellation_options && (index.h("button-component", { variant: 'destructive', onClick: this.handleRejectBookingButtonClicked, isLoading: this.isLoading && this.action === 'reject', part: "nmcc__button-outline nmcc__cancel-cta" }, `${utils.instance.t('rejectBookingButton')}`)), !this.configSettings?.scheduler?.hide_rescheduling_options && (index.h("button-component", { variant: 'basic', onClick: this.handleConfirmBookingButtonClicked, isLoading: this.isLoading && this.action === 'confirm', part: "nmcc__button-outline nmcc__reschedule-cta" }, `${utils.instance.t('confirmBookingButton')}`))))));
|
|
1513
1517
|
}
|
|
1514
1518
|
get host() { return index.getElement(this); }
|