npm - @nylas/web-elements - Versions diffs - 2.3.2 → 2.3.3 - Mend

@nylas/web-elements 2.3.2 → 2.3.3

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

Files changed (265) hide show

package/dist/esm/nylas-scheduler-editor.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { h, F as Fragment, r as registerInstance, c as createEvent, H as Host, a
 import { N as NylasBaseProvider } from './abstract-provider-DjoT3l3_.js';
 import { N as NylasIdentityRequestWrapper } from './nylas-api-request-DlF4cUoT.js';
 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';
-import { o as o$1, v as version } from './version-BxqBxG4o.js';
+import { o as o$1, v as version } from './version-BI4Pj5VG.js';
 import { c as createStore } from './index-DVBNi-yR.js';
 import { C as CONFIGURATION_EVENT_TYPE, L as LANGUAGE_CODE, a as LANGUAGE_MAP } from './constants-COJy29df.js';

package/dist/esm/nylas-scheduling.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { h, F as Fragment, r as registerInstance, c as createEvent, H as Host, a
 import { N as NylasBaseProvider } from './abstract-provider-DjoT3l3_.js';
 import { i as instance, c as addDaysToCurrentDate, a as debug, f as compactStringToUUIDs, h as capitalizeFirstLetter } from './utils-D7AODx4L.js';
 import { E as ErrorCategory, i as isInitialized, a as init, f as feedbackSyncIntegration, c as captureMessage, b as captureFeedback } from './feedbackSync-CquJ7U5v.js';
-import { v as version, u } from './version-BxqBxG4o.js';
+import { v as version, u } from './version-BI4Pj5VG.js';
 import { c as createStore } from './index-DVBNi-yR.js';
 import { L as LANGUAGE_CODE, a as LANGUAGE_MAP } from './constants-COJy29df.js';

package/dist/esm/radio-button-group.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, a as getElement } from './index-0EQQA0nE.js';
-const radioButtonGroupCss = ":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:100%}.radio-group{display:flex;flex-direction:column;gap:0.5rem}.radio-group slot[name=label]{display:flex;color:var(--nylas-base-800, #293056);font-size:14px;font-style:normal;font-weight:400;line-height:150%;font-size:16px}.radio-group slot[name=label].error{color:var(--nylas-error)}.radio-group slot[name=label] span.required{color:var(--nylas-error);padding:0 0.25rem}.radio-group slot[name=label] p{margin:0}.radio-group slot[name=label] p.error{color:var(--nylas-error)}.radio-group slot[name=label] .error{color:var(--nylas-error)}.radio-group span.error{color:var(--nylas-error);font-size:14px;font-weight:400;line-height:20px;font-family:var(--nylas-font-family)}.radio-group label{display:flex;font-family:var(--nylas-font-family);cursor:pointer}.radio-group label .radio-option{display:flex;align-items:flex-start;gap:0.5rem}.radio-group label .radio-option input[type=radio]{cursor:pointer}.radio-group label .radio-option input[type=radio i]{width:20px;height:20px;color:var(--nylas-primary)}.radio-group label .radio-option p{display:flex;flex-direction:column;gap:0.5rem;margin:0}.radio-group label .radio-option p .title{font-size:16px;font-weight:500;line-height:20px;color:var(--nylas-base-800)}.radio-group label .radio-option p .description{font-size:14px;font-weight:400;line-height:20px;color:var(--nylas-base-600)}";
+const radioButtonGroupCss = ":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:100%}.radio-group{display:flex;flex-direction:column;gap:0.5rem}.radio-group slot[name=label]{display:flex;color:var(--nylas-base-800, #293056);font-size:14px;font-style:normal;font-weight:400;line-height:150%;word-break:break-word;overflow-wrap:break-word;font-size:16px}.radio-group slot[name=label].error{color:var(--nylas-error)}.radio-group slot[name=label] span.required{color:var(--nylas-error);padding:0 0.25rem}.radio-group slot[name=label] p{margin:0}.radio-group slot[name=label] p.error{color:var(--nylas-error)}.radio-group slot[name=label] .error{color:var(--nylas-error)}.radio-group span.error{color:var(--nylas-error);font-size:14px;font-weight:400;line-height:20px;font-family:var(--nylas-font-family)}.radio-group label{display:flex;font-family:var(--nylas-font-family);cursor:pointer}.radio-group label .radio-option{display:flex;align-items:flex-start;gap:0.5rem}.radio-group label .radio-option input[type=radio]{cursor:pointer}.radio-group label .radio-option input[type=radio i]{width:20px;height:20px;color:var(--nylas-primary)}.radio-group label .radio-option p{display:flex;flex-direction:column;gap:0.5rem;margin:0}.radio-group label .radio-option p .title{font-size:16px;font-weight:500;line-height:20px;color:var(--nylas-base-800);word-break:break-word;overflow-wrap:break-word}.radio-group label .radio-option p .description{font-size:14px;font-weight:400;line-height:20px;color:var(--nylas-base-600)}";
 const RadioButtonGroup = class {
     constructor(hostRef) {

package/dist/esm/radio-button-group.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"radio-button-group.entry.js","sources":["src/components/design-system/radio-button-group/radio-button-group.scss?tag=radio-button-group&encapsulation=shadow","src/components/design-system/radio-button-group/radio-button-group.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as ;\n@use '../../../common/mixins/inputs' as ;\n\n:host {\n display: block;\n @include default-css-variables;\n width: 100%;\n}\n\n.radio-group {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n\n slot[name='label'] {\n @include input-label;\n font-size: 16px;\n\n p {\n margin: 0;\n\n &.error {\n color: var(--nylas-error);\n }\n }\n\n .error {\n color: var(--nylas-error);\n }\n }\n\n span.error {\n color: var(--nylas-error);\n font-size: 14px;\n font-weight: 400;\n line-height: 20px;\n font-family: var(--nylas-font-family);\n }\n\n label {\n display: flex;\n\n font-family: var(--nylas-font-family);\n cursor: pointer;\n\n .radio-option {\n display: flex;\n align-items: flex-start;\n gap: 0.5rem;\n\n input[type='radio'] {\n cursor: pointer;\n }\n\n input[type='radio' i] {\n width: 20px;\n height: 20px;\n color: var(--nylas-primary);\n }\n\n p {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n margin: 0;\n\n .title {\n font-size: 16px;\n font-weight: 500;\n line-height: 20px;\n color: var(--nylas-base-800);\n }\n\n .description {\n font-size: 14px;\n font-weight: 400;\n line-height: 20px;\n color: var(--nylas-base-600);\n }\n }\n }\n }\n}\n","// src/components/radio-group/radio-group.tsx\nimport { ThemeConfig } from '@nylas/core';\nimport { Component, h, Prop, State, Event, EventEmitter, Listen, Element, Watch } from '@stencil/core';\n\n/*\n The `radio-button-group` component is a UI component that allows users to select a single option from a list of options.\n * This component is used in the scheduling form to input radio button type inputs.\n /\n@Component({\n tag: 'radio-button-group',\n styleUrl: 'radio-button-group.scss',\n shadow: true,\n})\nexport class RadioButtonGroup {\n @Element() el!: HTMLElement;\n private readonly componentType: string = 'radio-group';\n\n /\n The name of the radio group. This is used to identify the radio group when submitting a form.\n /\n @Prop() name: string = 'radio-group';\n /\n The list of options in the radio group.\n * Each option has a label and a value and an optional description.\n /\n @Prop() options: { label: string; value: string; description?: string }[] = [];\n /\n The default selected value of the radio group.\n /\n @Prop({ attribute: 'default-selected-value' }) defaultSelectedValue: string = '';\n /\n The label of the radio group. This is displayed above the radio group.\n * Label is optional. You can also use the slot 'label' to add a label.\n /\n @Prop() label?: string;\n /\n Whether the radio group is required. If true, the radio group must have a value when submitting a form.\n * Default is false. If the radio group is required and the value is empty, an error message is displayed.\n /\n @Prop() required: boolean = false;\n /\n The property to make the radio group read-only. If true, the radio group cannot be edited.\n /\n @Prop() readOnly: boolean = false;\n /\n The theme configuration.\n /\n @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n /\n Error message to display when the radio group is required and no value is selected.\n /\n @Prop() errorMessage: string = '';\n /\n The selected value of the radio group.\n /\n @State() selectedValue!: string;\n /\n The error message state.\n /\n @State() error: string = '';\n /\n This event is fired when the selected value changes.\n /\n @Event() nylasFormRadioChanged!: EventEmitter<{\n value: string;\n name: string;\n label?: string;\n }>;\n\n @Watch('defaultSelectedValue')\n handleDefaultSelectedValueChange(newValue: string) {\n this.selectedValue = newValue;\n }\n\n @Watch('themeConfig')\n themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n if (newVal === oldVal) return;\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 componentDidLoad() {\n this.selectedValue = this.defaultSelectedValue;\n }\n\n // Event listeners\n /\n Listen for the bookingFormSubmitted event to validate the input value when the form is submitted.\n /\n @Listen('bookingFormSubmitted', { target: 'document' })\n handleBookingFormSubmitted(event: CustomEvent) {\n if (this.required && !this.selectedValue) {\n this.error = this.errorMessage \|\| `${this.label} is required.`;\n return;\n }\n if (this.error) {\n event.preventDefault();\n }\n }\n\n componentWillLoad() {\n this.el.setAttribute('component-type', this.componentType);\n }\n\n handleChange(value: string) {\n this.error = '';\n this.selectedValue = value;\n this.nylasFormRadioChanged.emit({\n value,\n name: this.name,\n label: this.label,\n });\n }\n\n render() {\n return (\n <div class=\"radio-group\">\n <slot name=\"label\">\n {this.label && (\n <p class={{ error: !!this.error }}>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\"></span>}\n </p>\n )}\n </slot>\n {this.options.map(option => (\n <label>\n <div class=\"radio-option\">\n <input\n type=\"radio\"\n disabled={this.readOnly}\n readOnly={this.readOnly}\n title={this.readOnly ? 'read-only field' : undefined}\n name={this.name}\n value={option.value}\n checked={this.selectedValue === option.value}\n onChange={() => this.handleChange(option.value)}\n />\n <p>\n <span class=\"title\">{option.label}</span>\n <span class=\"description\">{option.description}</span>\n </p>\n </div>\n </label>\n ))}\n {this.error && <span class=\"error help-text\">{this.error}</span>}\n </div>\n );\n }\n}\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"radio-button-group.entry.js","sources":["src/components/design-system/radio-button-group/radio-button-group.scss?tag=radio-button-group&encapsulation=shadow","src/components/design-system/radio-button-group/radio-button-group.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as ;\n@use '../../../common/mixins/inputs' as ;\n\n:host {\n display: block;\n @include default-css-variables;\n width: 100%;\n}\n\n.radio-group {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n\n slot[name='label'] {\n @include input-label;\n font-size: 16px;\n\n p {\n margin: 0;\n\n &.error {\n color: var(--nylas-error);\n }\n }\n\n .error {\n color: var(--nylas-error);\n }\n }\n\n span.error {\n color: var(--nylas-error);\n font-size: 14px;\n font-weight: 400;\n line-height: 20px;\n font-family: var(--nylas-font-family);\n }\n\n label {\n display: flex;\n\n font-family: var(--nylas-font-family);\n cursor: pointer;\n\n .radio-option {\n display: flex;\n align-items: flex-start;\n gap: 0.5rem;\n\n input[type='radio'] {\n cursor: pointer;\n }\n\n input[type='radio' i] {\n width: 20px;\n height: 20px;\n color: var(--nylas-primary);\n }\n\n p {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n margin: 0;\n\n .title {\n font-size: 16px;\n font-weight: 500;\n line-height: 20px;\n color: var(--nylas-base-800);\n word-break: break-word;\n overflow-wrap: break-word;\n }\n\n .description {\n font-size: 14px;\n font-weight: 400;\n line-height: 20px;\n color: var(--nylas-base-600);\n }\n }\n }\n }\n}\n","// src/components/radio-group/radio-group.tsx\nimport { ThemeConfig } from '@nylas/core';\nimport { Component, h, Prop, State, Event, EventEmitter, Listen, Element, Watch } from '@stencil/core';\n\n/*\n The `radio-button-group` component is a UI component that allows users to select a single option from a list of options.\n * This component is used in the scheduling form to input radio button type inputs.\n /\n@Component({\n tag: 'radio-button-group',\n styleUrl: 'radio-button-group.scss',\n shadow: true,\n})\nexport class RadioButtonGroup {\n @Element() el!: HTMLElement;\n private readonly componentType: string = 'radio-group';\n\n /\n The name of the radio group. This is used to identify the radio group when submitting a form.\n /\n @Prop() name: string = 'radio-group';\n /\n The list of options in the radio group.\n * Each option has a label and a value and an optional description.\n /\n @Prop() options: { label: string; value: string; description?: string }[] = [];\n /\n The default selected value of the radio group.\n /\n @Prop({ attribute: 'default-selected-value' }) defaultSelectedValue: string = '';\n /\n The label of the radio group. This is displayed above the radio group.\n * Label is optional. You can also use the slot 'label' to add a label.\n /\n @Prop() label?: string;\n /\n Whether the radio group is required. If true, the radio group must have a value when submitting a form.\n * Default is false. If the radio group is required and the value is empty, an error message is displayed.\n /\n @Prop() required: boolean = false;\n /\n The property to make the radio group read-only. If true, the radio group cannot be edited.\n /\n @Prop() readOnly: boolean = false;\n /\n The theme configuration.\n /\n @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n /\n Error message to display when the radio group is required and no value is selected.\n /\n @Prop() errorMessage: string = '';\n /\n The selected value of the radio group.\n /\n @State() selectedValue!: string;\n /\n The error message state.\n /\n @State() error: string = '';\n /\n This event is fired when the selected value changes.\n /\n @Event() nylasFormRadioChanged!: EventEmitter<{\n value: string;\n name: string;\n label?: string;\n }>;\n\n @Watch('defaultSelectedValue')\n handleDefaultSelectedValueChange(newValue: string) {\n this.selectedValue = newValue;\n }\n\n @Watch('themeConfig')\n themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n if (newVal === oldVal) return;\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 componentDidLoad() {\n this.selectedValue = this.defaultSelectedValue;\n }\n\n // Event listeners\n /\n Listen for the bookingFormSubmitted event to validate the input value when the form is submitted.\n /\n @Listen('bookingFormSubmitted', { target: 'document' })\n handleBookingFormSubmitted(event: CustomEvent) {\n if (this.required && !this.selectedValue) {\n this.error = this.errorMessage \|\| `${this.label} is required.`;\n return;\n }\n if (this.error) {\n event.preventDefault();\n }\n }\n\n componentWillLoad() {\n this.el.setAttribute('component-type', this.componentType);\n }\n\n handleChange(value: string) {\n this.error = '';\n this.selectedValue = value;\n this.nylasFormRadioChanged.emit({\n value,\n name: this.name,\n label: this.label,\n });\n }\n\n render() {\n return (\n <div class=\"radio-group\">\n <slot name=\"label\">\n {this.label && (\n <p class={{ error: !!this.error }}>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\"></span>}\n </p>\n )}\n </slot>\n {this.options.map(option => (\n <label>\n <div class=\"radio-option\">\n <input\n type=\"radio\"\n disabled={this.readOnly}\n readOnly={this.readOnly}\n title={this.readOnly ? 'read-only field' : undefined}\n name={this.name}\n value={option.value}\n checked={this.selectedValue === option.value}\n onChange={() => this.handleChange(option.value)}\n />\n <p>\n <span class=\"title\">{option.label}</span>\n <span class=\"description\">{option.description}</span>\n </p>\n </div>\n </label>\n ))}\n {this.error && <span class=\"error help-text\">{this.error}</span>}\n </div>\n );\n }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,mBAAmB,GAAG,glHAAglH;;MCa/lH,gBAAgB,GAAA,MAAA;AAL7B,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAOmB,QAAA,IAAa,CAAA,aAAA,GAAW,aAAa;AAK9C,QAAA,IAAI,CAAA,IAAA,GAAW,aAAa;AAK5B,QAAA,IAAO,CAAA,OAAA,GAA6D,EAAE;AAI/B,QAAA,IAAoB,CAAA,oBAAA,GAAW,EAAE;AAUxE,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAIzB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAQzB,QAAA,IAAY,CAAA,YAAA,GAAW,EAAE;AAQxB,QAAA,IAAK,CAAA,KAAA,GAAW,EAAE;AA6G5B;AAlGC,IAAA,gCAAgC,CAAC,QAAgB,EAAA;AAC/C,QAAA,IAAI,CAAC,aAAa,GAAG,QAAQ;;IAI/B,yBAAyB,CAAC,MAAmB,EAAE,MAAmB,EAAA;QAChE,IAAI,MAAM,KAAK,MAAM;YAAE;AACvB,QAAA,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC;;AAG/B,IAAA,gBAAgB,CAAC,WAAyB,EAAA;QACxC,IAAI,WAAW,EAAE;AACf,YAAA,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,WAAW,CAAC,EAAE;AACtD,gBAAA,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,CAAA,EAAG,GAAG,CAAA,CAAE,EAAE,KAAK,CAAC;;;;IAMhD,iBAAiB,GAAA;QAGf,cAAc,CAAC,MAAK;AAClB,YAAA,IAAI,IAAI,CAAC,WAAW,EAAE;AACpB,gBAAA,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,WAAW,CAAC;gBACvC,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,aAAa,EAAE,EAAE,CAAC;;AAE3C,SAAC,CAAC;;IAGJ,gBAAgB,GAAA;AACd,QAAA,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,oBAAoB;;AAQhD,IAAA,0BAA0B,CAAC,KAAkB,EAAA;QAC3C,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;AACxC,YAAA,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,YAAY,IAAI,CAAA,EAAG,IAAI,CAAC,KAAK,CAAA,aAAA,CAAe;YAC9D;;AAEF,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,KAAK,CAAC,cAAc,EAAE;;;IAI1B,iBAAiB,GAAA;QACf,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,gBAAgB,EAAE,IAAI,CAAC,aAAa,CAAC;;AAG5D,IAAA,YAAY,CAAC,KAAa,EAAA;AACxB,QAAA,IAAI,CAAC,KAAK,GAAG,EAAE;AACf,QAAA,IAAI,CAAC,aAAa,GAAG,KAAK;AAC1B,QAAA,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC;YAC9B,KAAK;YACL,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,KAAK,EAAE,IAAI,CAAC,KAAK;AAClB,SAAA,CAAC;;IAGJ,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,aAAa,EAAA,EACtB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,OAAO,EAAA,EACf,IAAI,CAAC,KAAK,KACT,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,KAAK,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,EAAA,EAC/B,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,EACtC,IAAI,CAAC,QAAQ,IAAI,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,UAAU,EAAA,EAAA,GAAA,CAAS,CAC/C,CACL,CACI,EACN,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,KACtB,CAAA,CAAA,OAAA,EAAA,IAAA,EACE,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,cAAc,EAAA,EACvB,CAAA,CAAA,OAAA,EAAA,EACE,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,QAAQ,GAAG,iBAAiB,GAAG,SAAS,EACpD,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,OAAO,EAAE,IAAI,CAAC,aAAa,KAAK,MAAM,CAAC,KAAK,EAC5C,QAAQ,EAAE,MAAM,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,CAAC,EAC/C,CAAA,EACF,CAAA,CAAA,GAAA,EAAA,IAAA,EACE,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,OAAO,IAAE,MAAM,CAAC,KAAK,CAAQ,EACzC,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,aAAa,EAAA,EAAE,MAAM,CAAC,WAAW,CAAQ,CACnD,CACA,CACA,CACT,CAAC,EACD,IAAI,CAAC,KAAK,IAAI,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,iBAAiB,EAAE,EAAA,IAAI,CAAC,KAAK,CAAQ,CAC5D;;;;;;;;;;;;"}

package/dist/esm/textarea-component.entry.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, a as getElement } from './index-0EQQA0nE.js';
 import { o as sanitize } from './utils-D7AODx4L.js';
-const textareaComponentCss = ":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:100%}label{display:flex;color:var(--nylas-base-800, #293056);font-size:14px;font-style:normal;font-weight:400;line-height:150%;flex-direction:column;gap:4px;font-family:var(--nylas-font-family);font-size:16px;color:var(--nylas-base-800)}label.error{color:var(--nylas-error)}label span.required{color:var(--nylas-error);padding:0 0.25rem}label p{margin:0;display:flex;gap:4px;align-items:center}label .error{color:var(--nylas-error)}textarea{display:flex;height:48px;padding-left:16px;align-items:center;gap:8px;align-self:stretch;border-radius:var(--nylas-border-radius-2x);border:1px solid var(--nylas-base-300);background:var(--nylas-base-0);width:-webkit-fill-available;color:var(--nylas-base-900);font-size:16px;font-style:normal;font-weight:400;line-height:150%;padding:12px 16px;border-width:1;resize:vertical;border-radius:8px;font-family:var(--nylas-font-family);font-size:16px;line-height:24px}textarea:focus{outline-color:var(--nylas-primary)}textarea.error{border-radius:var(--nylas-border-radius-2x);font-weight:600;border-color:var(--nylas-error);border-width:2px}textarea.error::placeholder{font-weight:400}textarea::placeholder{color:var(--nylas-base-300)}textarea::-webkit-resizer{display:none}textarea:read-only{background-color:var(--nylas-base-100);cursor:not-allowed}";
+const textareaComponentCss = ":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:100%}label{display:flex;color:var(--nylas-base-800, #293056);font-size:14px;font-style:normal;font-weight:400;line-height:150%;word-break:break-word;overflow-wrap:break-word;flex-direction:column;gap:4px;font-family:var(--nylas-font-family);font-size:16px;color:var(--nylas-base-800)}label.error{color:var(--nylas-error)}label span.required{color:var(--nylas-error);padding:0 0.25rem}label p{margin:0;display:flex;gap:4px;align-items:center}label .error{color:var(--nylas-error)}textarea{display:flex;height:48px;padding-left:16px;align-items:center;gap:8px;align-self:stretch;border-radius:var(--nylas-border-radius-2x);border:1px solid var(--nylas-base-300);background:var(--nylas-base-0);width:-webkit-fill-available;color:var(--nylas-base-900);font-size:16px;font-style:normal;font-weight:400;line-height:150%;padding:12px 16px;border-width:1;resize:vertical;border-radius:8px;font-family:var(--nylas-font-family);font-size:16px;line-height:24px}textarea:focus{outline-color:var(--nylas-primary)}textarea.error{border-radius:var(--nylas-border-radius-2x);font-weight:600;border-color:var(--nylas-error);border-width:2px}textarea.error::placeholder{font-weight:400}textarea::placeholder{color:var(--nylas-base-300)}textarea::-webkit-resizer{display:none}textarea:read-only{background-color:var(--nylas-base-100);cursor:not-allowed}";
 const TextareaComponent = class {
     constructor(hostRef) {

package/dist/esm/textarea-component.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"textarea-component.entry.js","sources":["src/components/design-system/textarea-component/textarea-component.scss?tag=textarea-component&encapsulation=shadow","src/components/design-system/textarea-component/textarea-component.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as ;\n@use '../../../common/mixins/inputs' as ;\n\n:host {\n display: block;\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 display: flex;\n gap: 4px;\n align-items: center;\n }\n\n .error {\n color: var(--nylas-error);\n }\n}\n\ntextarea {\n @include textfield;\n padding: 12px 16px;\n border-width: 1;\n resize: vertical;\n border-radius: 8px;\n font-family: var(--nylas-font-family);\n font-size: 16px;\n line-height: 24px;\n\n &::-webkit-resizer {\n display: none;\n }\n}\n\ntextarea:read-only {\n background-color: var(--nylas-base-100);\n cursor: not-allowed;\n}\n","import { sanitize } from '@/utils/utils';\nimport { ThemeConfig } from '@nylas/core';\nimport { Component, h, Prop, State, Event, EventEmitter, Listen, Watch, Element } from '@stencil/core';\n\n/*\n `textarea-component` allows users to enter multiline text.\n * It is ideal for larger inputs like comments or messages in a form.\n * This component is used in the scheduling form to input multiline text.\n \n @part tc__label - The label for the textarea.\n * @part tc__textarea - The textarea element.\n /\n@Component({\n tag: 'textarea-component',\n styleUrl: 'textarea-component.scss',\n shadow: true,\n})\nexport class TextareaComponent {\n @Element() el!: HTMLElement;\n\n /\n The name of the textarea, important for form submissions.\n /\n @Prop() name: string = 'textarea';\n\n /\n The default value of the textarea, appearing when the component first renders.\n /\n @Prop() defaultValue?: string;\n\n /\n The label for the textarea, displayed above it.\n /\n @Prop() label: string = '';\n\n /\n Placeholder text shown in the textarea when it is empty.\n /\n @Prop() placeholder: string = '';\n\n /\n Specifies if the textarea is required for form submission.\n * If true, an error message shows if left empty.\n /\n @Prop() required: boolean = false;\n\n /\n If true, the textarea cannot be edited by the user.\n /\n @Prop() readOnly: boolean = false;\n\n /\n Automatically focus the textarea when the component loads.\n /\n @Prop() autoFocus: boolean = false;\n\n /\n The maximum number of characters allowed in the textarea.\n /\n @Prop() maxLength: number = 255;\n\n /\n The type\n /\n @Prop() type: string = 'multi_line_text';\n\n /\n The content of the label's tooltip\n /\n @Prop() tooltip: string = '';\n\n /\n Error message to display when the textarea is required and empty.\n /\n @Prop() errorMessage: string = '';\n\n /\n The theme configuration.\n /\n @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n\n /\n State for the current value of the textarea.\n /\n @State() value: string = '';\n\n /\n State for managing the display of any error messages.\n /\n @State() error: string = '';\n\n /\n Event emitted when the value of the textarea changes.\n * Useful for parent components to capture user input.\n /\n @Event() nylasFormInputChanged!: EventEmitter<{ value: string; name: string; error: string; label: string; type: string }>;\n\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 /\n Lifecycle method that runs before the component loads.\n * It sets the initial value and cleans it using sanitize-html.\n /\n componentDidLoad() {\n this.value = sanitize(this.defaultValue \|\| '');\n }\n\n @Watch('themeConfig')\n themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n if (newVal === oldVal) return;\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 // 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.validate(this.value);\n if (this.error) {\n event.preventDefault();\n }\n }\n\n @Listen('triggerValidation', { target: 'document' })\n handletriggerValidation(event: CustomEvent) {\n this.validate(this.value);\n if (this.error) {\n event.preventDefault();\n }\n }\n\n /\n Handles user input in the textarea, updating the value and emitting an event.\n /\n handleInput(e: Event) {\n this.error = '';\n const inputElement = e.target as HTMLTextAreaElement;\n this.value = sanitize(inputElement.value);\n this.nylasFormInputChanged.emit({\n value: this.value,\n name: this.name,\n error: this.error,\n label: this.label,\n type: this.type,\n });\n }\n\n /\n Validates the textarea value based on the required prop and maxLength.\n * If the value is invalid, an error message is displayed.\n /\n validate(value: string) {\n if (this.required && !value) {\n this.error = this.errorMessage \|\| `${this.label} is required.`;\n } else if (value.length > this.maxLength) {\n this.error = `${this.label} cannot exceed ${this.maxLength} characters.`;\n } else {\n this.error = '';\n }\n }\n\n /\n Renders the component UI including the label, textarea, and any error messages.\n /\n render() {\n return (\n <label part=\"tc__label\" class={{ error: !!this.error }}>\n <p>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\"></span>}\n {this.tooltip && (\n <tooltip-component>\n <info-icon slot=\"tooltip-icon\" />\n <span slot=\"tooltip-content\">{this.tooltip}</span>\n </tooltip-component>\n )}\n </p>\n <textarea\n name={this.name}\n title={this.readOnly ? 'read-only field' : undefined}\n placeholder={this.placeholder}\n readOnly={this.readOnly}\n autoFocus={this.autoFocus}\n value={this.value}\n maxLength={this.maxLength}\n onInput={e => this.handleInput(e)}\n class={{ error: !!this.error }}\n part=\"tc__textarea\"\n />\n {this.error && <span class=\"error help-text\">{this.error}</span>}\n </label>\n );\n }\n}\n"],"names":[],"mappings":";;;AAAA,MAAM,oBAAoB,GAAG,+7GAA+7G;;MCiB/8G,iBAAiB,GAAA,MAAA;AAL9B,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAWU,QAAA,IAAI,CAAA,IAAA,GAAW,UAAU;AAUzB,QAAA,IAAK,CAAA,KAAA,GAAW,EAAE;AAKlB,QAAA,IAAW,CAAA,WAAA,GAAW,EAAE;AAMxB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAKzB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAKzB,QAAA,IAAS,CAAA,SAAA,GAAY,KAAK;AAK1B,QAAA,IAAS,CAAA,SAAA,GAAW,GAAG;AAKvB,QAAA,IAAI,CAAA,IAAA,GAAW,iBAAiB;AAKhC,QAAA,IAAO,CAAA,OAAA,GAAW,EAAE;AAKpB,QAAA,IAAY,CAAA,YAAA,GAAW,EAAE;AAUxB,QAAA,IAAK,CAAA,KAAA,GAAW,EAAE;AAKlB,QAAA,IAAK,CAAA,KAAA,GAAW,EAAE;AA2H5B;IAnHC,iBAAiB,GAAA;QAGf,cAAc,CAAC,MAAK;AAClB,YAAA,IAAI,IAAI,CAAC,WAAW,EAAE;AACpB,gBAAA,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,WAAW,CAAC;gBACvC,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,aAAa,EAAE,EAAE,CAAC;;AAE3C,SAAC,CAAC;;IAOJ,gBAAgB,GAAA;QACd,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,YAAY,IAAI,EAAE,CAAC;;IAIhD,yBAAyB,CAAC,MAAmB,EAAE,MAAmB,EAAA;QAChE,IAAI,MAAM,KAAK,MAAM;YAAE;AACvB,QAAA,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC;;AAG/B,IAAA,gBAAgB,CAAC,WAAyB,EAAA;QACxC,IAAI,WAAW,EAAE;AACf,YAAA,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,WAAW,CAAC,EAAE;AACtD,gBAAA,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,CAAA,EAAG,GAAG,CAAA,CAAE,EAAE,KAAK,CAAC;;;;AAUhD,IAAA,0BAA0B,CAAC,KAAkB,EAAA;AAC3C,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;AACzB,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,KAAK,CAAC,cAAc,EAAE;;;AAK1B,IAAA,uBAAuB,CAAC,KAAkB,EAAA;AACxC,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;AACzB,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,KAAK,CAAC,cAAc,EAAE;;;AAO1B,IAAA,WAAW,CAAC,CAAQ,EAAA;AAClB,QAAA,IAAI,CAAC,KAAK,GAAG,EAAE;AACf,QAAA,MAAM,YAAY,GAAG,CAAC,CAAC,MAA6B;QACpD,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC,YAAY,CAAC,KAAK,CAAC;AACzC,QAAA,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC;YAC9B,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,IAAI,EAAE,IAAI,CAAC,IAAI;AAChB,SAAA,CAAC;;AAOJ,IAAA,QAAQ,CAAC,KAAa,EAAA;AACpB,QAAA,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,KAAK,EAAE;AAC3B,YAAA,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,YAAY,IAAI,CAAA,EAAG,IAAI,CAAC,KAAK,CAAA,aAAA,CAAe;;aACzD,IAAI,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,SAAS,EAAE;AACxC,YAAA,IAAI,CAAC,KAAK,GAAG,CAAA,EAAG,IAAI,CAAC,KAAK,CAAA,eAAA,EAAkB,IAAI,CAAC,SAAS,CAAA,YAAA,CAAc;;aACnE;AACL,YAAA,IAAI,CAAC,KAAK,GAAG,EAAE;;;IAOnB,MAAM,GAAA;QACJ,QACE,CAAO,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,WAAW,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,EAAA,EACpD,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACE,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,EACtC,IAAI,CAAC,QAAQ,IAAI,6DAAM,KAAK,EAAC,UAAU,EAAS,EAAA,GAAA,CAAA,EAChD,IAAI,CAAC,OAAO,KACX,CAAA,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACE,CAAW,CAAA,WAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,cAAc,EAAG,CAAA,EACjC,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,iBAAiB,EAAE,EAAA,IAAI,CAAC,OAAO,CAAQ,CAChC,CACrB,CACC,EACJ,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,QAAQ,GAAG,iBAAiB,GAAG,SAAS,EACpD,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EACjC,KAAK,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,EAC9B,IAAI,EAAC,cAAc,EACnB,CAAA,EACD,IAAI,CAAC,KAAK,IAAI,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,iBAAiB,EAAE,EAAA,IAAI,CAAC,KAAK,CAAQ,CAC1D;;;;;;;;;;;"}
1	+ {"version":3,"file":"textarea-component.entry.js","sources":["src/components/design-system/textarea-component/textarea-component.scss?tag=textarea-component&encapsulation=shadow","src/components/design-system/textarea-component/textarea-component.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as ;\n@use '../../../common/mixins/inputs' as ;\n\n:host {\n display: block;\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 display: flex;\n gap: 4px;\n align-items: center;\n }\n\n .error {\n color: var(--nylas-error);\n }\n}\n\ntextarea {\n @include textfield;\n padding: 12px 16px;\n border-width: 1;\n resize: vertical;\n border-radius: 8px;\n font-family: var(--nylas-font-family);\n font-size: 16px;\n line-height: 24px;\n\n &::-webkit-resizer {\n display: none;\n }\n}\n\ntextarea:read-only {\n background-color: var(--nylas-base-100);\n cursor: not-allowed;\n}\n","import { sanitize } from '@/utils/utils';\nimport { ThemeConfig } from '@nylas/core';\nimport { Component, h, Prop, State, Event, EventEmitter, Listen, Watch, Element } from '@stencil/core';\n\n/*\n `textarea-component` allows users to enter multiline text.\n * It is ideal for larger inputs like comments or messages in a form.\n * This component is used in the scheduling form to input multiline text.\n \n @part tc__label - The label for the textarea.\n * @part tc__textarea - The textarea element.\n /\n@Component({\n tag: 'textarea-component',\n styleUrl: 'textarea-component.scss',\n shadow: true,\n})\nexport class TextareaComponent {\n @Element() el!: HTMLElement;\n\n /\n The name of the textarea, important for form submissions.\n /\n @Prop() name: string = 'textarea';\n\n /\n The default value of the textarea, appearing when the component first renders.\n /\n @Prop() defaultValue?: string;\n\n /\n The label for the textarea, displayed above it.\n /\n @Prop() label: string = '';\n\n /\n Placeholder text shown in the textarea when it is empty.\n /\n @Prop() placeholder: string = '';\n\n /\n Specifies if the textarea is required for form submission.\n * If true, an error message shows if left empty.\n /\n @Prop() required: boolean = false;\n\n /\n If true, the textarea cannot be edited by the user.\n /\n @Prop() readOnly: boolean = false;\n\n /\n Automatically focus the textarea when the component loads.\n /\n @Prop() autoFocus: boolean = false;\n\n /\n The maximum number of characters allowed in the textarea.\n /\n @Prop() maxLength: number = 255;\n\n /\n The type\n /\n @Prop() type: string = 'multi_line_text';\n\n /\n The content of the label's tooltip\n /\n @Prop() tooltip: string = '';\n\n /\n Error message to display when the textarea is required and empty.\n /\n @Prop() errorMessage: string = '';\n\n /\n The theme configuration.\n /\n @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n\n /\n State for the current value of the textarea.\n /\n @State() value: string = '';\n\n /\n State for managing the display of any error messages.\n /\n @State() error: string = '';\n\n /\n Event emitted when the value of the textarea changes.\n * Useful for parent components to capture user input.\n /\n @Event() nylasFormInputChanged!: EventEmitter<{ value: string; name: string; error: string; label: string; type: string }>;\n\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 /\n Lifecycle method that runs before the component loads.\n * It sets the initial value and cleans it using sanitize-html.\n /\n componentDidLoad() {\n this.value = sanitize(this.defaultValue \|\| '');\n }\n\n @Watch('themeConfig')\n themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n if (newVal === oldVal) return;\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 // 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.validate(this.value);\n if (this.error) {\n event.preventDefault();\n }\n }\n\n @Listen('triggerValidation', { target: 'document' })\n handletriggerValidation(event: CustomEvent) {\n this.validate(this.value);\n if (this.error) {\n event.preventDefault();\n }\n }\n\n /\n Handles user input in the textarea, updating the value and emitting an event.\n /\n handleInput(e: Event) {\n this.error = '';\n const inputElement = e.target as HTMLTextAreaElement;\n this.value = sanitize(inputElement.value);\n this.nylasFormInputChanged.emit({\n value: this.value,\n name: this.name,\n error: this.error,\n label: this.label,\n type: this.type,\n });\n }\n\n /\n Validates the textarea value based on the required prop and maxLength.\n * If the value is invalid, an error message is displayed.\n /\n validate(value: string) {\n if (this.required && !value) {\n this.error = this.errorMessage \|\| `${this.label} is required.`;\n } else if (value.length > this.maxLength) {\n this.error = `${this.label} cannot exceed ${this.maxLength} characters.`;\n } else {\n this.error = '';\n }\n }\n\n /\n Renders the component UI including the label, textarea, and any error messages.\n /\n render() {\n return (\n <label part=\"tc__label\" class={{ error: !!this.error }}>\n <p>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\"></span>}\n {this.tooltip && (\n <tooltip-component>\n <info-icon slot=\"tooltip-icon\" />\n <span slot=\"tooltip-content\">{this.tooltip}</span>\n </tooltip-component>\n )}\n </p>\n <textarea\n name={this.name}\n title={this.readOnly ? 'read-only field' : undefined}\n placeholder={this.placeholder}\n readOnly={this.readOnly}\n autoFocus={this.autoFocus}\n value={this.value}\n maxLength={this.maxLength}\n onInput={e => this.handleInput(e)}\n class={{ error: !!this.error }}\n part=\"tc__textarea\"\n />\n {this.error && <span class=\"error help-text\">{this.error}</span>}\n </label>\n );\n }\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/{version-BxqBxG4o.js → version-BI4Pj5VG.js} RENAMED Viewed

@@ -1,9 +1,9 @@
 var u = /* @__PURE__ */ ((r) => (r.Error = "error", r.Warning = "warning", r.Info = "info", r.Success = "success", r))(u || {});
 const o = (r) => r !== null && typeof r == "object" && "error" in r;
-const version = '2.3.2';
+const version = '2.3.3';
 export { o, u, version as v };
-//# sourceMappingURL=version-BxqBxG4o.js.map
+//# sourceMappingURL=version-BI4Pj5VG.js.map
-//# sourceMappingURL=version-BxqBxG4o.js.map
+//# sourceMappingURL=version-BI4Pj5VG.js.map

package/dist/esm/{version-BxqBxG4o.js.map → version-BI4Pj5VG.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"version-~~BxqBxG4o~~.js","sources":["../nylas-js-core/dist/index.es.js","src/version.ts"],"sourcesContent":["var t = Object.defineProperty;\nvar c = (r, n, s) => n in r ? t(r, n, { enumerable: !0, configurable: !0, writable: !0, value: s }) : r[n] = s;\nvar a = (r, n, s) => (c(r, typeof n != \"symbol\" ? n + \"\" : n, s), s);\nvar u = /* @__PURE__ */ ((r) => (r.Error = \"error\", r.Warning = \"warning\", r.Info = \"info\", r.Success = \"success\", r))(u \|\| {});\nconst e = (r) => r !== null && typeof r == \"object\" && \"data\" in r, o = (r) => r !== null && typeof r == \"object\" && \"error\" in r;\nclass E extends Error {\n constructor(s) {\n super(s == null ? void 0 : s.message);\n a(this, \"apiError\");\n this.name = \"NylasAPIError\", this.stack = new Error().stack, this.apiError = s;\n }\n}\nexport {\n u as NotificationType,\n E as NylasAPIError,\n o as isNylasErrorResponse,\n e as isNylasSuccessResponse\n};\n","export const version = '2.3.2';\n"],"names":[],"mappings":"AAGG,IAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,KAAK,GAAG,OAAO,EAAE,CAAC,CAAC,OAAO,GAAG,SAAS,EAAE,CAAC,CAAC,IAAI,GAAG,MAAM,EAAE,CAAC,CAAC,OAAO,GAAG,SAAS,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,EAAE;AACzH,MAA+D,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,KAAK,IAAI,IAAI,OAAO,CAAC,IAAI,QAAQ,IAAI,OAAO,IAAI;;ACJzH,MAAM,OAAO,GAAG;;;;"}
1	+ {"version":3,"file":"version-BI4Pj5VG.js","sources":["../nylas-js-core/dist/index.es.js","src/version.ts"],"sourcesContent":["var t = Object.defineProperty;\nvar c = (r, n, s) => n in r ? t(r, n, { enumerable: !0, configurable: !0, writable: !0, value: s }) : r[n] = s;\nvar a = (r, n, s) => (c(r, typeof n != \"symbol\" ? n + \"\" : n, s), s);\nvar u = /* @__PURE__ */ ((r) => (r.Error = \"error\", r.Warning = \"warning\", r.Info = \"info\", r.Success = \"success\", r))(u \|\| {});\nconst e = (r) => r !== null && typeof r == \"object\" && \"data\" in r, o = (r) => r !== null && typeof r == \"object\" && \"error\" in r;\nclass E extends Error {\n constructor(s) {\n super(s == null ? void 0 : s.message);\n a(this, \"apiError\");\n this.name = \"NylasAPIError\", this.stack = new Error().stack, this.apiError = s;\n }\n}\nexport {\n u as NotificationType,\n E as NylasAPIError,\n o as isNylasErrorResponse,\n e as isNylasSuccessResponse\n};\n","export const version = '2.3.3';\n"],"names":[],"mappings":"AAGG,IAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,KAAK,GAAG,OAAO,EAAE,CAAC,CAAC,OAAO,GAAG,SAAS,EAAE,CAAC,CAAC,IAAI,GAAG,MAAM,EAAE,CAAC,CAAC,OAAO,GAAG,SAAS,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,EAAE;AACzH,MAA+D,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,KAAK,IAAI,IAAI,OAAO,CAAC,IAAI,QAAQ,IAAI,OAAO,IAAI;;ACJzH,MAAM,OAAO,GAAG;;;;"}

package/dist/nylas-web-elements/checkbox-component.entry.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"checkbox-component.entry.esm.js","sources":["src/components/design-system/checkbox-component/checkbox-component.scss?tag=checkbox-component&encapsulation=shadow","src/components/design-system/checkbox-component/checkbox-component.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as ;\n\n:host {\n display: block;\n @include default-css-variables;\n width: 100%;\n}\n\n.checkbox-container {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n\n p.error {\n color: var(--nylas-error);\n font-size: 16px;\n font-weight: 400;\n line-height: 20px;\n font-family: var(--nylas-font-family);\n margin: 0;\n }\n}\n\nlabel {\n display: flex;\n align-items: center;\n font-family: var(--nylas-font-family);\n cursor: pointer;\n position: relative;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n color: var(--nylas-base-800);\n\n &.readonly {\n cursor: not-allowed;\n }\n\n span.required {\n color: var(--nylas-error);\n padding: 0 0.25rem;\n }\n\n input[type='checkbox'] {\n position: absolute;\n opacity: 0;\n cursor: pointer;\n border: 1px solid var(--nylas-base-300);\n\n &:focus ~ .checkmark,\n &:hover ~ .checkmark {\n border-color: var(--nylas-primary);\n }\n\n &:checked ~ .checkmark {\n color: var(--nylas-base-0);\n background: var(--nylas-primary)\n url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+DQo8c3ZnIHdpZHRoPSIxMiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgMTIgOSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCiAgPHBhdGggZD0iTTQuNTc1IDguOTc3cy0uNDA0LS4wMDctLjUzNi0uMTY1TC4wNTcgNS42NGwuODI5LTEuMjI3TDQuNDcgNy4yNjggMTAuOTIxLjA4NmwuOTIzIDEuMTAzLTYuODYzIDcuNjRjLS4xMzQtLjAwMy0uNDA2LjE0OC0uNDA2LjE0OHoiIGZpbGw9IiNGRkYiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPg0KPC9zdmc+)\n 50% 40% no-repeat;\n border: 1px solid var(--nylas-primary);\n }\n\n &:disabled {\n cursor: not-allowed;\n background: var(--nylas-base-100);\n border: 1px solid var(--nylas-base-300);\n }\n }\n\n .checkmark {\n border-radius: var(--nylas-border-radius);\n border: 1px solid var(--nylas-base-300);\n position: absolute;\n left: 0;\n top: 2px;\n width: 18px;\n height: 18px;\n cursor: pointer;\n pointer-events: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n }\n\n .label {\n margin-left: 32px;\n font-size: 16px;\n font-weight: 400;\n color: var(--nylas-base-800);\n line-height: 24px;\n }\n}\n","import { ThemeConfig } from '@nylas/core';\nimport { Component, h, Prop, State, Event, EventEmitter, Listen, Element, Watch } from '@stencil/core';\n\n/\n The `checkbox-component` component is a UI component that allows users to select a checkbox.\n * This component is used in the scheduling form to input checkbox type inputs.\n /\n@Component({\n tag: 'checkbox-component',\n styleUrl: 'checkbox-component.scss',\n shadow: true,\n})\nexport class CheckboxComponent {\n @Element() el!: HTMLElement;\n private readonly componentType: string = 'checkbox';\n\n /\n The name of the checkbox. This is used to identify the checkbox when submitting a form.\n /\n @Prop() name: string = 'checkbox';\n /\n The default value of the checkbox. This is the value that is displayed when the checkbox is rendered.\n /\n @Prop() checked?: boolean;\n /\n The label of the checkbox. This is displayed next to the checkbox.\n /\n @Prop() label: string = '';\n /\n The property to make the checkbox read-only. If true, the checkbox cannot be edited.\n /\n @Prop() readOnly: boolean = false;\n /\n Whether the checkbox is required. If true, the checkbox must be checked when submitting a form.\n * Default is false. If the checkbox is required and not checked, an error message is displayed.\n /\n @Prop() required: boolean = false;\n /\n The theme configuration.\n /\n @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n /\n Error message to display when the checkbox is required and not checked.\n /\n @Prop() errorMessage: string = '';\n /\n The checked state of the checkbox.\n /\n @State() isChecked!: boolean;\n /\n The error message state.\n /\n @State() error: string = '';\n\n /\n This event is fired when the checkbox is toggled.\n /\n @Event() nylasFormCheckboxToggled!: EventEmitter<{\n checked: boolean;\n name: string;\n label: string;\n }>;\n\n @Watch('checked')\n checkedPropChangedHandler(newValue: boolean) {\n if (typeof newValue === 'boolean') {\n this.isChecked = newValue;\n }\n }\n\n @Watch('themeConfig')\n themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n if (newVal === oldVal) return;\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 events\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 this.el.setAttribute('component-type', this.componentType);\n }\n\n componentDidLoad() {\n this.isChecked = this.checked \|\| false;\n }\n\n // Event listeners\n /\n Listen for the bookingFormSubmitted event to validate the input value when the form is submitted.\n /\n @Listen('bookingFormSubmitted', { target: 'document' })\n handleBookingFormSubmitted(event: CustomEvent) {\n if (this.required && !this.isChecked) {\n this.error = this.errorMessage \|\| `${this.label} is required.`;\n }\n if (this.error) {\n event.preventDefault();\n }\n }\n\n // Methods\n toggleCheck() {\n this.error = '';\n this.isChecked = !this.isChecked;\n this.nylasFormCheckboxToggled.emit({\n checked: this.isChecked,\n name: this.name,\n label: this.label,\n });\n }\n\n render() {\n return (\n <div class=\"checkbox-container\">\n <label title={this.readOnly ? 'read-only field' : undefined} class={{ readonly: this.readOnly }}>\n <input\n type=\"checkbox\"\n disabled={this.readOnly}\n readOnly={this.readOnly}\n name={this.name}\n title={this.readOnly ? 'read-only field' : undefined}\n checked={this.isChecked}\n onChange={() => this.toggleCheck()}\n />\n <span class=\"checkmark\"></span>\n <slot name=\"label\">\n <span class=\"label\" part=\"checkbox-label-span\">\n {this.label}\n {this.required && <span class=\"required\"></span>}\n </span>\n </slot>\n </label>\n {this.error && <p class=\"error\">{this.error}</p>}\n </div>\n );\n }\n}\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"checkbox-component.entry.esm.js","sources":["src/components/design-system/checkbox-component/checkbox-component.scss?tag=checkbox-component&encapsulation=shadow","src/components/design-system/checkbox-component/checkbox-component.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as ;\n\n:host {\n display: block;\n @include default-css-variables;\n width: 100%;\n}\n\n.checkbox-container {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n\n p.error {\n color: var(--nylas-error);\n font-size: 16px;\n font-weight: 400;\n line-height: 20px;\n font-family: var(--nylas-font-family);\n margin: 0;\n }\n}\n\nlabel {\n display: flex;\n align-items: center;\n font-family: var(--nylas-font-family);\n cursor: pointer;\n position: relative;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n color: var(--nylas-base-800);\n\n &.readonly {\n cursor: not-allowed;\n }\n\n span.required {\n color: var(--nylas-error);\n padding: 0 0.25rem;\n }\n\n input[type='checkbox'] {\n position: absolute;\n opacity: 0;\n cursor: pointer;\n border: 1px solid var(--nylas-base-300);\n\n &:focus ~ .checkmark,\n &:hover ~ .checkmark {\n border-color: var(--nylas-primary);\n }\n\n &:checked ~ .checkmark {\n color: var(--nylas-base-0);\n background: var(--nylas-primary)\n url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+DQo8c3ZnIHdpZHRoPSIxMiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgMTIgOSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCiAgPHBhdGggZD0iTTQuNTc1IDguOTc3cy0uNDA0LS4wMDctLjUzNi0uMTY1TC4wNTcgNS42NGwuODI5LTEuMjI3TDQuNDcgNy4yNjggMTAuOTIxLjA4NmwuOTIzIDEuMTAzLTYuODYzIDcuNjRjLS4xMzQtLjAwMy0uNDA2LjE0OC0uNDA2LjE0OHoiIGZpbGw9IiNGRkYiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPg0KPC9zdmc+)\n 50% 40% no-repeat;\n border: 1px solid var(--nylas-primary);\n }\n\n &:disabled {\n cursor: not-allowed;\n background: var(--nylas-base-100);\n border: 1px solid var(--nylas-base-300);\n }\n }\n\n .checkmark {\n border-radius: var(--nylas-border-radius);\n border: 1px solid var(--nylas-base-300);\n position: absolute;\n left: 0;\n top: 2px;\n width: 18px;\n height: 18px;\n cursor: pointer;\n pointer-events: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n }\n\n .label {\n margin-left: 32px;\n font-size: 16px;\n font-weight: 400;\n color: var(--nylas-base-800);\n line-height: 24px;\n word-break: break-word;\n overflow-wrap: break-word;\n }\n}\n","import { ThemeConfig } from '@nylas/core';\nimport { Component, h, Prop, State, Event, EventEmitter, Listen, Element, Watch } from '@stencil/core';\n\n/\n The `checkbox-component` component is a UI component that allows users to select a checkbox.\n * This component is used in the scheduling form to input checkbox type inputs.\n /\n@Component({\n tag: 'checkbox-component',\n styleUrl: 'checkbox-component.scss',\n shadow: true,\n})\nexport class CheckboxComponent {\n @Element() el!: HTMLElement;\n private readonly componentType: string = 'checkbox';\n\n /\n The name of the checkbox. This is used to identify the checkbox when submitting a form.\n /\n @Prop() name: string = 'checkbox';\n /\n The default value of the checkbox. This is the value that is displayed when the checkbox is rendered.\n /\n @Prop() checked?: boolean;\n /\n The label of the checkbox. This is displayed next to the checkbox.\n /\n @Prop() label: string = '';\n /\n The property to make the checkbox read-only. If true, the checkbox cannot be edited.\n /\n @Prop() readOnly: boolean = false;\n /\n Whether the checkbox is required. If true, the checkbox must be checked when submitting a form.\n * Default is false. If the checkbox is required and not checked, an error message is displayed.\n /\n @Prop() required: boolean = false;\n /\n The theme configuration.\n /\n @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n /\n Error message to display when the checkbox is required and not checked.\n /\n @Prop() errorMessage: string = '';\n /\n The checked state of the checkbox.\n /\n @State() isChecked!: boolean;\n /\n The error message state.\n /\n @State() error: string = '';\n\n /\n This event is fired when the checkbox is toggled.\n /\n @Event() nylasFormCheckboxToggled!: EventEmitter<{\n checked: boolean;\n name: string;\n label: string;\n }>;\n\n @Watch('checked')\n checkedPropChangedHandler(newValue: boolean) {\n if (typeof newValue === 'boolean') {\n this.isChecked = newValue;\n }\n }\n\n @Watch('themeConfig')\n themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n if (newVal === oldVal) return;\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 events\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 this.el.setAttribute('component-type', this.componentType);\n }\n\n componentDidLoad() {\n this.isChecked = this.checked \|\| false;\n }\n\n // Event listeners\n /\n Listen for the bookingFormSubmitted event to validate the input value when the form is submitted.\n /\n @Listen('bookingFormSubmitted', { target: 'document' })\n handleBookingFormSubmitted(event: CustomEvent) {\n if (this.required && !this.isChecked) {\n this.error = this.errorMessage \|\| `${this.label} is required.`;\n }\n if (this.error) {\n event.preventDefault();\n }\n }\n\n // Methods\n toggleCheck() {\n this.error = '';\n this.isChecked = !this.isChecked;\n this.nylasFormCheckboxToggled.emit({\n checked: this.isChecked,\n name: this.name,\n label: this.label,\n });\n }\n\n render() {\n return (\n <div class=\"checkbox-container\">\n <label title={this.readOnly ? 'read-only field' : undefined} class={{ readonly: this.readOnly }}>\n <input\n type=\"checkbox\"\n disabled={this.readOnly}\n readOnly={this.readOnly}\n name={this.name}\n title={this.readOnly ? 'read-only field' : undefined}\n checked={this.isChecked}\n onChange={() => this.toggleCheck()}\n />\n <span class=\"checkmark\"></span>\n <slot name=\"label\">\n <span class=\"label\" part=\"checkbox-label-span\">\n {this.label}\n {this.required && <span class=\"required\"></span>}\n </span>\n </slot>\n </label>\n {this.error && <p class=\"error\">{this.error}</p>}\n </div>\n );\n }\n}\n"],"names":[],"mappings":"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"}

package/dist/nylas-web-elements/chevron-icon.search-icon.select-dropdown.entry.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"chevron-icon.search-icon.select-dropdown.entry.esm.js","sources":["src/common/icons/icon.css?tag=chevron-icon&encapsulation=scoped","src/common/icons/chevron.tsx","src/common/icons/icon.css?tag=search-icon&encapsulation=scoped","src/common/icons/search.tsx","src/components/design-system/select-dropdown/select-dropdown.scss?tag=select-dropdown&encapsulation=shadow","src/components/design-system/select-dropdown/select-dropdown.tsx"],"sourcesContent":[":host {\n display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'chevron-icon',\n styleUrl: 'icon.css',\n scoped: true,\n})\nexport class ChevronIcon {\n @Prop() width: string = '24';\n @Prop() height: string = '24';\n\n render() {\n return (\n <svg xmlns=\"http://www.w3.org/2000/svg\" width={this.width} height={this.height} viewBox=\"0 0 24 24\" fill=\"none\">\n <path fill=\"currentColor\" d=\"M15.53 4.22a.75.75 0 0 1 0 1.06L8.81 12l6.72 6.72a.75.75 0 1 1-1.06 1.06l-7.25-7.25a.75.75 0 0 1 0-1.06l7.25-7.25a.75.75 0 0 1 1.06 0Z\" />\n </svg>\n );\n }\n}\n",":host {\n display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'search-icon',\n styleUrl: 'icon.css',\n scoped: true,\n})\nexport class SearchIcon {\n @Prop() width: string = '15';\n @Prop() height: string = '15';\n\n render() {\n return (\n <svg width={this.width} height={this.height} fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill=\"currentColor\"\n d=\"M5.5 0C8.53757 0 11 2.46243 11 5.5C11 6.83879 10.5217 8.06586 9.72656 9.01962L13.8536 13.1464C14.0488 13.3417 14.0488 13.6583 13.8536 13.8536C13.68 14.0271 13.4106 14.0464 13.2157 13.9114L13.1464 13.8536L9.01962 9.72656C8.06586 10.5217 6.83879 11 5.5 11C2.46243 11 0 8.53757 0 5.5C0 2.46243 2.46243 0 5.5 0ZM5.5 1C3.01472 1 1 3.01472 1 5.5C1 7.98528 3.01472 10 5.5 10C7.98528 10 10 7.98528 10 5.5C10 3.01472 7.98528 1 5.5 1Z\"\n />\n </svg>\n );\n }\n}\n","@use '../../../common/styles/variables' as ;\n@use '../../../common/mixins/inputs' as ;\n\n:host {\n display: block;\n position: relative;\n @include default-css-variables;\n width: 100%;\n\n @media #{$mobile} {\n position: unset;\n }\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.dropdown {\n display: inline-block;\n width: inherit;\n}\n\n.dropbtn {\n color: var(--nylas-base-800);\n padding: 14px;\n font-size: 16px;\n font-family: var(--nylas-font-family);\n cursor: pointer;\n display: flex;\n justify-content: space-between;\n gap: 0.5rem;\n background: var(--nylas-base-0);\n border: 1px solid var(--nylas-base-300);\n border-radius: var(--nylas-border-radius-2x);\n\n &.error {\n border: 1px solid var(--nylas-error);\n }\n\n &:hover,\n &:active {\n outline: 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 &.chevron {\n display: flex;\n align-self: center;\n }\n\n &.open {\n transform: rotate(90deg);\n }\n\n &.closed {\n transform: rotate(270deg);\n }\n\n &.selected-option {\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n max-width: 144px;\n font-size: 14px;\n line-height: 20px;\n color: inherit;\n\n @media #{$mobile} {\n max-width: 124px;\n font-size: 16px;\n }\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 box-shadow: 0px 4px 6px -2px rgba(0, 0, 0, 0.05);\n box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);\n\n // Firefox scrollbar styling\n scrollbar-width: thin;\n scrollbar-color: var(--nylas-base-300) var(--nylas-base-50);\n\n // Custom scrollbar styling\n &::-webkit-scrollbar {\n width: 8px;\n }\n\n &::-webkit-scrollbar-track {\n background: var(--nylas-base-50);\n border-radius: 4px;\n }\n\n &::-webkit-scrollbar-thumb {\n background: var(--nylas-base-300);\n border-radius: 4px;\n transition: background-color 0.2s ease;\n\n &:hover {\n background: var(--nylas-base-400);\n }\n }\n\n &::-webkit-scrollbar-thumb:active {\n background: var(--nylas-base-500);\n }\n\n @media #{$mobile} {\n right: 0;\n width: 325px;\n max-width: unset;\n }\n}\n\n.search-box {\n border-bottom: 1px solid var(--nylas-base-200);\n padding: 10px;\n position: sticky;\n top: 0;\n background: var(--nylas-base-0);\n\n .icon {\n position: absolute;\n top: 1.25rem;\n left: 1.25rem;\n color: var(--nylas-base-300);\n }\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}\n\n.dropdown-content .selected {\n background-color: #e7e7e7;\n}\n\ninput[type='text'] {\n width: -webkit-fill-available;\n padding: inherit;\n border: 1px solid var(--nylas-base-200);\n border-radius: 4px;\n position: sticky;\n background: no-repeat scroll 7px 7px;\n padding-left: 30px;\n background-size: 16px 16px;\n color: var(--nylas-base-800);\n}\n","import { Component, Element, Event, EventEmitter, h, Listen, Prop, State, Watch } from '@stencil/core';\nimport { DropdownOption, ThemeConfig } from '@nylas/core';\n\n/*\n The `select-dropdown` component is a dropdown that allows users to select an option from a list of options.\n * This component is used in the scheduling form to input dropdown type inputs.\n * @part sd_dropdown - The dropdown container\n * @part sd_dropdown-button - The dropdown button\n * @part sd_dropdown-button-selected-label - The selected option label\n * @part sd_dropdown-content - The dropdown content\n * @part sd_dropdown_label - The dropdown label\n /\n@Component({\n tag: 'select-dropdown',\n styleUrl: 'select-dropdown.scss',\n shadow: true,\n})\nexport class SelectDropdown {\n @Element() el!: HTMLElement;\n private readonly componentType: string = 'select-dropdown';\n\n private inputRef?: HTMLInputElement;\n\n // Props\n /\n The name of the dropdown\n /\n @Prop({ reflect: true }) name!: string;\n /\n The options to display in the dropdown\n /\n @Prop() options: DropdownOption[] = [];\n /\n The default selected option\n /\n @Prop({ attribute: 'default-selected-option' }) defaultSelectedOption: DropdownOption \| null = null;\n /\n Should show search input\n /\n @Prop() withSearch: boolean = true;\n\n /\n The placeholder for the search input\n /\n @Prop() searchPlaceholder: string = 'Search';\n\n /\n The label for the dropdown, skipped if no label is provided\n /\n @Prop() label?: string;\n\n /\n If true, the dropdown is required for form submission\n /\n @Prop() required: boolean = false;\n\n /\n The property to make the dropdown read-only. If true, the dropdown cannot be edited.\n /\n @Prop() readOnly: boolean = false;\n\n /\n Show pluralized label for the selected option. This is s tring that is appended to the selected option label as a suffix.\n /\n @Prop() pluralizedLabel: string = '';\n /\n Overrides the select dropdown to be used as a button with dropdownButtonText representing actions & dropdownText name on the dropdown intead of selected value\n /\n @Prop() dropdownButtonText?: string;\n /\n Should show chevron on button\n /\n @Prop() withChevron: boolean = true;\n /\n Allows to set the empty value of the dropdown\n /\n @Prop() emptyValue: string = 'Select an option'; // Default empty value\n /\n The custom error message to display when the value is empty or null and the dropdown is required\n /\n @Prop() errorMessage: string = '';\n /\n The theme configuration.\n /\n @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n\n // States\n /\n The selected option\n /\n @State() selectedOption!: DropdownOption \| null;\n /\n The open state of the dropdown\n /\n @State() isOpen: boolean = false;\n /\n The search value for the dropdown\n /\n @State() searchValue: string = '';\n /\n The filtered options based on the search value\n /\n @State() filteredOptions: DropdownOption[] = [...this.options];\n /\n The aria-activedescendant attribute for the listbox element to indicate the currently active\n * option in the list box to screen readers. The value of aria-activedescendant is the ID of\n * the active option.\n /\n @State() ariaActivedescendant: string = '';\n\n /\n The error message to display when the value is empty or null and the dropdown is required\n /\n @State() error: string = '';\n\n // Events\n /\n This event is fired when the selected option is changed\n /\n @Event({ bubbles: true, composed: true }) nylasFormDropdownChanged!: EventEmitter<{\n value: DropdownOption['value'];\n name: string;\n error?: string;\n label?: string;\n }>;\n\n /\n This event is fired when the default selected option is set, on component load\n /\n @Event({ bubbles: true, composed: true }) nylasFormDropdownDefaultSelected!: EventEmitter<{\n value: DropdownOption['value'];\n name: string;\n error?: string;\n label?: string;\n }>;\n\n @Watch('options')\n optionsChangedHandler(newValue: DropdownOption[], oldValue: DropdownOption[]) {\n if (newValue === oldValue) {\n return;\n }\n this.filteredOptions = newValue;\n }\n\n @Watch('defaultSelectedOption')\n defaultSelectedOptionChangedHandler(newValue: DropdownOption, oldValue: DropdownOption) {\n if (typeof newValue === 'undefined' \|\| newValue?.label === oldValue?.label) {\n return;\n }\n this.selectedOption = newValue;\n this.nylasFormDropdownDefaultSelected.emit({\n value: newValue?.value \|\| '',\n name: this.name,\n error: this.error,\n label: this.label,\n });\n }\n\n @Watch('themeConfig')\n themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n if (newVal === oldVal) return;\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 this.el.setAttribute('component-type', this.componentType);\n this.filteredOptions = this.options;\n // Set the selected option to the first option if no option is selected\n this.selectedOption = this.defaultSelectedOption;\n\n if (!this.selectedOption && this.options.length > 0) {\n this.selectedOption = this.options[0];\n }\n }\n\n componentDidLoad() {\n this.nylasFormDropdownDefaultSelected.emit({\n value: this.selectedOption?.value \|\| '',\n name: this.name,\n error: this.error,\n label: this.label,\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.validate(this.selectedOption?.value \|\| '');\n if (this.error) {\n event.preventDefault();\n }\n }\n\n /\n Listen for the formSubmitted event to validate the input value when the form is submitted.\n * @param event\n /\n @Listen('formSubmitted', { target: 'document' })\n handleFormSubmitted(event: CustomEvent) {\n this.validate(this.selectedOption?.value \|\| '');\n if (this.error) {\n event.preventDefault();\n }\n }\n\n // Methods\n validate(value: string) {\n if (this.required && !value) {\n this.error = this.errorMessage \|\| `${this.label} is required.`;\n } else {\n this.error = '';\n }\n }\n toggleDropdown(): void {\n this.isOpen = !this.isOpen;\n }\n\n filterOptions(event: Event): void {\n const value = (event.target as HTMLInputElement).value;\n this.searchValue = value;\n this.filteredOptions = this.options.filter(option => option.label.toLowerCase().includes(value.toLowerCase()));\n }\n\n selectOption(option: DropdownOption): void {\n this.error = '';\n this.selectedOption = option;\n this.toggleDropdown();\n if (option.value !== this.emptyValue) {\n this.nylasFormDropdownChanged.emit({\n value: option.value,\n name: this.name,\n error: this.error,\n label: this.label,\n });\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 this.inputRef?.focus();\n break;\n case 'Escape':\n this.isOpen = false;\n break;\n }\n }\n\n handleListboxKeydown(e) {\n const items = this.filteredOptions; // Assuming this is the array of your current filtered options\n const currentIndex = items.findIndex(item => item.value === this.ariaActivedescendant);\n if (e.key === 'ArrowDown' \|\| (e.key === 'Tab' && !e.shiftKey)) {\n e.preventDefault();\n if (currentIndex === items.length - 1) {\n this.ariaActivedescendant = '';\n this.inputRef?.focus();\n return;\n }\n const nextIndex = currentIndex + 1 < items.length ? currentIndex + 1 : 0;\n this.ariaActivedescendant = items[nextIndex].value;\n this.focusOption(nextIndex);\n } else if (e.key === 'ArrowUp' \|\| (e.key === 'Tab' && e.shiftKey)) {\n e.preventDefault();\n if (currentIndex === 0) {\n this.ariaActivedescendant = '';\n this.inputRef?.focus();\n return;\n }\n const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;\n this.ariaActivedescendant = items[prevIndex].value;\n this.focusOption(prevIndex);\n } else if (e.key === 'Enter') {\n e.preventDefault();\n if (this.ariaActivedescendant) {\n this.selectOption(items[currentIndex]);\n }\n } else if (e.key === 'Escape') {\n this.isOpen = false;\n }\n }\n\n focusOption(index) {\n const option = this.filteredOptions[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 handleComboboxKeyDown(event: KeyboardEvent): void {\n if (event.key === 'ArrowDown' \|\| (event.key == 'Tab' && !event.shiftKey)) {\n event.preventDefault();\n this.ariaActivedescendant = this.filteredOptions[0].value;\n this.focusOption(0);\n } else if (event.key === 'ArrowUp' \|\| (event.key === 'Tab' && event.shiftKey)) {\n event.preventDefault();\n this.ariaActivedescendant = this.filteredOptions[this.filteredOptions.length - 1].value;\n this.focusOption(this.filteredOptions.length - 1);\n } else if (event.key === 'Escape') {\n this.isOpen = false;\n }\n }\n\n generateButtonText(option: DropdownOption \| null, dropButtonText?: string): string {\n if (dropButtonText) {\n return dropButtonText;\n }\n return option?.label ? `${this.pluralizedLabel ? this.pluralizedLabel : option?.label}` : this.emptyValue;\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 render() {\n const buttonText = this.generateButtonText(this.selectedOption, this.dropdownButtonText);\n return (\n <div class=\"dropdown\" part=\"sd_dropdown\">\n <label part=\"sd_dropdown_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 <button\n part=\"sd_dropdown-button\"\n class={{ dropbtn: true, open: this.isOpen, error: !!this.error }}\n onClick={() => this.toggleDropdown()}\n disabled={this.readOnly}\n aria-haspopup=\"listbox\"\n title={this.readOnly ? 'read-only field' : buttonText}\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=\"sd_dropdown-button-selected-label\">\n {buttonText}\n </span>\n {this.withChevron && (\n <span\n class={{\n open: this.isOpen,\n closed: !this.isOpen,\n chevron: true,\n }}\n aria-hidden=\"true\"\n >\n <chevron-icon width=\"16\" height=\"16\" />\n </span>\n )}\n </button>\n {this.error && <span class=\"error help-text\">{this.error}</span>}\n </label>\n\n {this.isOpen ? (\n <div class=\"dropdown-content\" part=\"sd_dropdown-content\">\n {this.withSearch && (\n <div class={{ 'search-box': true, 'open': this.isOpen }}>\n <search-icon width=\"15\" height=\"15\" class={'icon'} />\n <input\n type=\"text\"\n role=\"combobox\"\n placeholder={this.searchPlaceholder}\n value={this.searchValue}\n ref={el => (this.inputRef = el)}\n onInput={event => this.filterOptions(event)}\n onKeyDown={e => this.handleComboboxKeyDown(e)}\n />\n </div>\n )}\n <ul tabindex=\"-1\" role=\"listbox\" aria-label={this.name} aria-activedescendant={this.ariaActivedescendant} onKeyDown={e => this.handleListboxKeydown(e)}>\n {this.filteredOptions.map(option =>\n option.value.toString() ? (\n <li tabindex=\"0\" key={option.value} id={option.value} part={`${this.name}-${option.label}`} onClick={() => this.selectOption(option)} role=\"option\">\n {option.labelHTML ? <div part=\"sd_dropdown-labelhtml\">{option.labelHTML}</div> : option.label}\n </li>\n ) : null,\n )}\n </ul>\n </div>\n ) : null}\n </div>\n );\n }\n}\n"],"names":["iconCss"],"mappings":"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"}
1	+ {"version":3,"file":"chevron-icon.search-icon.select-dropdown.entry.esm.js","sources":["src/common/icons/icon.css?tag=chevron-icon&encapsulation=scoped","src/common/icons/chevron.tsx","src/common/icons/icon.css?tag=search-icon&encapsulation=scoped","src/common/icons/search.tsx","src/components/design-system/select-dropdown/select-dropdown.scss?tag=select-dropdown&encapsulation=shadow","src/components/design-system/select-dropdown/select-dropdown.tsx"],"sourcesContent":[":host {\n display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'chevron-icon',\n styleUrl: 'icon.css',\n scoped: true,\n})\nexport class ChevronIcon {\n @Prop() width: string = '24';\n @Prop() height: string = '24';\n\n render() {\n return (\n <svg xmlns=\"http://www.w3.org/2000/svg\" width={this.width} height={this.height} viewBox=\"0 0 24 24\" fill=\"none\">\n <path fill=\"currentColor\" d=\"M15.53 4.22a.75.75 0 0 1 0 1.06L8.81 12l6.72 6.72a.75.75 0 1 1-1.06 1.06l-7.25-7.25a.75.75 0 0 1 0-1.06l7.25-7.25a.75.75 0 0 1 1.06 0Z\" />\n </svg>\n );\n }\n}\n",":host {\n display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'search-icon',\n styleUrl: 'icon.css',\n scoped: true,\n})\nexport class SearchIcon {\n @Prop() width: string = '15';\n @Prop() height: string = '15';\n\n render() {\n return (\n <svg width={this.width} height={this.height} fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill=\"currentColor\"\n d=\"M5.5 0C8.53757 0 11 2.46243 11 5.5C11 6.83879 10.5217 8.06586 9.72656 9.01962L13.8536 13.1464C14.0488 13.3417 14.0488 13.6583 13.8536 13.8536C13.68 14.0271 13.4106 14.0464 13.2157 13.9114L13.1464 13.8536L9.01962 9.72656C8.06586 10.5217 6.83879 11 5.5 11C2.46243 11 0 8.53757 0 5.5C0 2.46243 2.46243 0 5.5 0ZM5.5 1C3.01472 1 1 3.01472 1 5.5C1 7.98528 3.01472 10 5.5 10C7.98528 10 10 7.98528 10 5.5C10 3.01472 7.98528 1 5.5 1Z\"\n />\n </svg>\n );\n }\n}\n","@use '../../../common/styles/variables' as ;\n@use '../../../common/mixins/inputs' as ;\n\n:host {\n display: block;\n position: relative;\n @include default-css-variables;\n width: 100%;\n\n @media #{$mobile} {\n position: unset;\n }\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.dropdown {\n display: inline-block;\n width: inherit;\n}\n\n.dropbtn {\n color: var(--nylas-base-800);\n padding: 14px;\n font-size: 16px;\n font-family: var(--nylas-font-family);\n cursor: pointer;\n display: flex;\n justify-content: space-between;\n gap: 0.5rem;\n background: var(--nylas-base-0);\n border: 1px solid var(--nylas-base-300);\n border-radius: var(--nylas-border-radius-2x);\n\n &.error {\n border: 1px solid var(--nylas-error);\n }\n\n &:hover,\n &:active {\n outline: 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 &.chevron {\n display: flex;\n align-self: center;\n }\n\n &.open {\n transform: rotate(90deg);\n }\n\n &.closed {\n transform: rotate(270deg);\n }\n\n &.selected-option {\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n max-width: 144px;\n font-size: 14px;\n line-height: 20px;\n color: inherit;\n\n @media #{$mobile} {\n max-width: 124px;\n font-size: 16px;\n }\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 box-shadow: 0px 4px 6px -2px rgba(0, 0, 0, 0.05);\n box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);\n\n // Firefox scrollbar styling\n scrollbar-width: thin;\n scrollbar-color: var(--nylas-base-300) var(--nylas-base-50);\n\n // Custom scrollbar styling\n &::-webkit-scrollbar {\n width: 8px;\n }\n\n &::-webkit-scrollbar-track {\n background: var(--nylas-base-50);\n border-radius: 4px;\n }\n\n &::-webkit-scrollbar-thumb {\n background: var(--nylas-base-300);\n border-radius: 4px;\n transition: background-color 0.2s ease;\n\n &:hover {\n background: var(--nylas-base-400);\n }\n }\n\n &::-webkit-scrollbar-thumb:active {\n background: var(--nylas-base-500);\n }\n\n @media #{$mobile} {\n right: 0;\n width: 325px;\n max-width: unset;\n }\n}\n\n.search-box {\n border-bottom: 1px solid var(--nylas-base-200);\n padding: 10px;\n position: sticky;\n top: 0;\n background: var(--nylas-base-0);\n\n .icon {\n position: absolute;\n top: 1.25rem;\n left: 1.25rem;\n color: var(--nylas-base-300);\n }\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}\n\n.dropdown-content .selected {\n background-color: #e7e7e7;\n}\n\ninput[type='text'] {\n width: -webkit-fill-available;\n padding: inherit;\n border: 1px solid var(--nylas-base-200);\n border-radius: 4px;\n position: sticky;\n background: no-repeat scroll 7px 7px;\n padding-left: 30px;\n background-size: 16px 16px;\n color: var(--nylas-base-800);\n}\n","import { Component, Element, Event, EventEmitter, h, Listen, Prop, State, Watch } from '@stencil/core';\nimport { DropdownOption, ThemeConfig } from '@nylas/core';\n\n/*\n The `select-dropdown` component is a dropdown that allows users to select an option from a list of options.\n * This component is used in the scheduling form to input dropdown type inputs.\n * @part sd_dropdown - The dropdown container\n * @part sd_dropdown-button - The dropdown button\n * @part sd_dropdown-button-selected-label - The selected option label\n * @part sd_dropdown-content - The dropdown content\n * @part sd_dropdown_label - The dropdown label\n /\n@Component({\n tag: 'select-dropdown',\n styleUrl: 'select-dropdown.scss',\n shadow: true,\n})\nexport class SelectDropdown {\n @Element() el!: HTMLElement;\n private readonly componentType: string = 'select-dropdown';\n\n private inputRef?: HTMLInputElement;\n\n // Props\n /\n The name of the dropdown\n /\n @Prop({ reflect: true }) name!: string;\n /\n The options to display in the dropdown\n /\n @Prop() options: DropdownOption[] = [];\n /\n The default selected option\n /\n @Prop({ attribute: 'default-selected-option' }) defaultSelectedOption: DropdownOption \| null = null;\n /\n Should show search input\n /\n @Prop() withSearch: boolean = true;\n\n /\n The placeholder for the search input\n /\n @Prop() searchPlaceholder: string = 'Search';\n\n /\n The label for the dropdown, skipped if no label is provided\n /\n @Prop() label?: string;\n\n /\n If true, the dropdown is required for form submission\n /\n @Prop() required: boolean = false;\n\n /\n The property to make the dropdown read-only. If true, the dropdown cannot be edited.\n /\n @Prop() readOnly: boolean = false;\n\n /\n Show pluralized label for the selected option. This is s tring that is appended to the selected option label as a suffix.\n /\n @Prop() pluralizedLabel: string = '';\n /\n Overrides the select dropdown to be used as a button with dropdownButtonText representing actions & dropdownText name on the dropdown intead of selected value\n /\n @Prop() dropdownButtonText?: string;\n /\n Should show chevron on button\n /\n @Prop() withChevron: boolean = true;\n /\n Allows to set the empty value of the dropdown\n /\n @Prop() emptyValue: string = 'Select an option'; // Default empty value\n /\n The custom error message to display when the value is empty or null and the dropdown is required\n /\n @Prop() errorMessage: string = '';\n /\n The theme configuration.\n /\n @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n\n // States\n /\n The selected option\n /\n @State() selectedOption!: DropdownOption \| null;\n /\n The open state of the dropdown\n /\n @State() isOpen: boolean = false;\n /\n The search value for the dropdown\n /\n @State() searchValue: string = '';\n /\n The filtered options based on the search value\n /\n @State() filteredOptions: DropdownOption[] = [...this.options];\n /\n The aria-activedescendant attribute for the listbox element to indicate the currently active\n * option in the list box to screen readers. The value of aria-activedescendant is the ID of\n * the active option.\n /\n @State() ariaActivedescendant: string = '';\n\n /\n The error message to display when the value is empty or null and the dropdown is required\n /\n @State() error: string = '';\n\n // Events\n /\n This event is fired when the selected option is changed\n /\n @Event({ bubbles: true, composed: true }) nylasFormDropdownChanged!: EventEmitter<{\n value: DropdownOption['value'];\n name: string;\n error?: string;\n label?: string;\n }>;\n\n /\n This event is fired when the default selected option is set, on component load\n /\n @Event({ bubbles: true, composed: true }) nylasFormDropdownDefaultSelected!: EventEmitter<{\n value: DropdownOption['value'];\n name: string;\n error?: string;\n label?: string;\n }>;\n\n @Watch('options')\n optionsChangedHandler(newValue: DropdownOption[], oldValue: DropdownOption[]) {\n if (newValue === oldValue) {\n return;\n }\n this.filteredOptions = newValue;\n }\n\n @Watch('defaultSelectedOption')\n defaultSelectedOptionChangedHandler(newValue: DropdownOption, oldValue: DropdownOption) {\n if (typeof newValue === 'undefined' \|\| newValue?.label === oldValue?.label) {\n return;\n }\n this.selectedOption = newValue;\n this.nylasFormDropdownDefaultSelected.emit({\n value: newValue?.value \|\| '',\n name: this.name,\n error: this.error,\n label: this.label,\n });\n }\n\n @Watch('themeConfig')\n themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n if (newVal === oldVal) return;\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 this.el.setAttribute('component-type', this.componentType);\n this.filteredOptions = this.options;\n // Set the selected option to the first option if no option is selected\n this.selectedOption = this.defaultSelectedOption;\n\n if (!this.selectedOption && this.options.length > 0) {\n this.selectedOption = this.options[0];\n }\n }\n\n componentDidLoad() {\n this.nylasFormDropdownDefaultSelected.emit({\n value: this.selectedOption?.value \|\| '',\n name: this.name,\n error: this.error,\n label: this.label,\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.validate(this.selectedOption?.value \|\| '');\n if (this.error) {\n event.preventDefault();\n }\n }\n\n /\n Listen for the formSubmitted event to validate the input value when the form is submitted.\n * @param event\n /\n @Listen('formSubmitted', { target: 'document' })\n handleFormSubmitted(event: CustomEvent) {\n this.validate(this.selectedOption?.value \|\| '');\n if (this.error) {\n event.preventDefault();\n }\n }\n\n // Methods\n validate(value: string) {\n if (this.required && !value) {\n this.error = this.errorMessage \|\| `${this.label} is required.`;\n } else {\n this.error = '';\n }\n }\n toggleDropdown(): void {\n this.isOpen = !this.isOpen;\n }\n\n filterOptions(event: Event): void {\n const value = (event.target as HTMLInputElement).value;\n this.searchValue = value;\n this.filteredOptions = this.options.filter(option => option.label.toLowerCase().includes(value.toLowerCase()));\n }\n\n selectOption(option: DropdownOption): void {\n this.error = '';\n this.selectedOption = option;\n this.toggleDropdown();\n if (option.value !== this.emptyValue) {\n this.nylasFormDropdownChanged.emit({\n value: option.value,\n name: this.name,\n error: this.error,\n label: this.label,\n });\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 this.inputRef?.focus();\n break;\n case 'Escape':\n this.isOpen = false;\n break;\n }\n }\n\n handleListboxKeydown(e) {\n const items = this.filteredOptions; // Assuming this is the array of your current filtered options\n const currentIndex = items.findIndex(item => item.value === this.ariaActivedescendant);\n if (e.key === 'ArrowDown' \|\| (e.key === 'Tab' && !e.shiftKey)) {\n e.preventDefault();\n if (currentIndex === items.length - 1) {\n this.ariaActivedescendant = '';\n this.inputRef?.focus();\n return;\n }\n const nextIndex = currentIndex + 1 < items.length ? currentIndex + 1 : 0;\n this.ariaActivedescendant = items[nextIndex].value;\n this.focusOption(nextIndex);\n } else if (e.key === 'ArrowUp' \|\| (e.key === 'Tab' && e.shiftKey)) {\n e.preventDefault();\n if (currentIndex === 0) {\n this.ariaActivedescendant = '';\n this.inputRef?.focus();\n return;\n }\n const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;\n this.ariaActivedescendant = items[prevIndex].value;\n this.focusOption(prevIndex);\n } else if (e.key === 'Enter') {\n e.preventDefault();\n if (this.ariaActivedescendant) {\n this.selectOption(items[currentIndex]);\n }\n } else if (e.key === 'Escape') {\n this.isOpen = false;\n }\n }\n\n focusOption(index) {\n const option = this.filteredOptions[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 handleComboboxKeyDown(event: KeyboardEvent): void {\n if (event.key === 'ArrowDown' \|\| (event.key == 'Tab' && !event.shiftKey)) {\n event.preventDefault();\n this.ariaActivedescendant = this.filteredOptions[0].value;\n this.focusOption(0);\n } else if (event.key === 'ArrowUp' \|\| (event.key === 'Tab' && event.shiftKey)) {\n event.preventDefault();\n this.ariaActivedescendant = this.filteredOptions[this.filteredOptions.length - 1].value;\n this.focusOption(this.filteredOptions.length - 1);\n } else if (event.key === 'Escape') {\n this.isOpen = false;\n }\n }\n\n generateButtonText(option: DropdownOption \| null, dropButtonText?: string): string {\n if (dropButtonText) {\n return dropButtonText;\n }\n return option?.label ? `${this.pluralizedLabel ? this.pluralizedLabel : option?.label}` : this.emptyValue;\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 render() {\n const buttonText = this.generateButtonText(this.selectedOption, this.dropdownButtonText);\n return (\n <div class=\"dropdown\" part=\"sd_dropdown\">\n <label part=\"sd_dropdown_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 <button\n part=\"sd_dropdown-button\"\n class={{ dropbtn: true, open: this.isOpen, error: !!this.error }}\n onClick={() => this.toggleDropdown()}\n disabled={this.readOnly}\n aria-haspopup=\"listbox\"\n title={this.readOnly ? 'read-only field' : buttonText}\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=\"sd_dropdown-button-selected-label\">\n {buttonText}\n </span>\n {this.withChevron && (\n <span\n class={{\n open: this.isOpen,\n closed: !this.isOpen,\n chevron: true,\n }}\n aria-hidden=\"true\"\n >\n <chevron-icon width=\"16\" height=\"16\" />\n </span>\n )}\n </button>\n {this.error && <span class=\"error help-text\">{this.error}</span>}\n </label>\n\n {this.isOpen ? (\n <div class=\"dropdown-content\" part=\"sd_dropdown-content\">\n {this.withSearch && (\n <div class={{ 'search-box': true, 'open': this.isOpen }}>\n <search-icon width=\"15\" height=\"15\" class={'icon'} />\n <input\n type=\"text\"\n role=\"combobox\"\n placeholder={this.searchPlaceholder}\n value={this.searchValue}\n ref={el => (this.inputRef = el)}\n onInput={event => this.filterOptions(event)}\n onKeyDown={e => this.handleComboboxKeyDown(e)}\n />\n </div>\n )}\n <ul tabindex=\"-1\" role=\"listbox\" aria-label={this.name} aria-activedescendant={this.ariaActivedescendant} onKeyDown={e => this.handleListboxKeydown(e)}>\n {this.filteredOptions.map(option =>\n option.value.toString() ? (\n <li tabindex=\"0\" key={option.value} id={option.value} part={`${this.name}-${option.label}`} onClick={() => this.selectOption(option)} role=\"option\">\n {option.labelHTML ? <div part=\"sd_dropdown-labelhtml\">{option.labelHTML}</div> : option.label}\n </li>\n ) : null,\n )}\n </ul>\n </div>\n ) : null}\n </div>\n );\n }\n}\n"],"names":["iconCss"],"mappings":"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"}