@nylas/web-elements 2.5.4 → 2.5.6

package/dist/components/{p-DfJPUV12.js → p-BpDfyvY4.js}

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, e as createEvent, h } from './p-Bht9ktsW.js';
-import { s as sanitize } from './p-DBE6FcDx.js';
+import { s as sanitize } from './p-xxFdByBn.js';
 import { d as defineCustomElement$2 } from './p-d3kelm3z.js';
 import { d as defineCustomElement$1 } from './p-DxDoo-4C.js';
 
@@ -133,6 +133,6 @@ function defineCustomElement() {
 }
 
 export { TextareaComponent as T, defineCustomElement as d };
-//# sourceMappingURL=p-DfJPUV12.js.map
+//# sourceMappingURL=p-BpDfyvY4.js.map
 
-//# sourceMappingURL=p-DfJPUV12.js.map
+//# sourceMappingURL=p-BpDfyvY4.js.map

package/dist/components/{p-DfJPUV12.js.map → p-BpDfyvY4.js.map}

@@ -1 +1 @@
-{"file":"p-DfJPUV12.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"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"],"version":3}
+{"file":"p-BpDfyvY4.js","mappings":";;;;;AAAA,MAAM,oBAAoB,GAAG,8+GAA8+G;;MCiB9/G,iBAAiB,GAAAA,kBAAA,CAAA,MAAA,iBAAA,SAAAC,CAAA,CAAA;AAL9B,IAAA,WAAA,GAAA;;;;;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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"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"],"version":3}

package/dist/components/{p-B2qD9GvB.js → p-BqcSDTPa.js}

@@ -1,11 +1,11 @@
 import { p as proxyCustomElement, H, e as createEvent, h, i as Host } from './p-Bht9ktsW.js';
-import { R as RegisterComponent } from './p-CdMky78w.js';
-import { a as debug } from './p-DBE6FcDx.js';
-import { i as instance } from './p-CFk78OEk.js';
+import { R as RegisterComponent } from './p-jHq8WTky.js';
+import { a as debug } from './p-xxFdByBn.js';
+import { i as instance } from './p-BjxQTsOy.js';
 import { d as defineCustomElement$4 } from './p-ao6VxuAL.js';
 import { d as defineCustomElement$3 } from './p-CzVZs3uZ.js';
 import { d as defineCustomElement$2 } from './p-d3kelm3z.js';
-import { d as defineCustomElement$1 } from './p-CoLVT2ul.js';
+import { d as defineCustomElement$1 } from './p-Dxtgg1gN.js';
 
 const nylasCalendarPickerCss = ":host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-50:#ffeae8;--nylas-error-100:#ffc5bf;--nylas-error-200:#fecaca;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-color-blue-100:#e0e6f9;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;--nylas-color-black:#000000;--nylas-color-grey-900:#2c2c2c;--nylas-color-grey-800:#4b4b4b;--nylas-color-grey-700:#6e6e6e;--nylas-color-grey-600:#8e8e8e;--nylas-color-grey-500:#b3b3b3;--nylas-color-grey-400:#cacaca;--nylas-color-grey-300:#e1e1e1;--nylas-color-grey-200:#eaeaea;--nylas-color-grey-100:#f5f5f5;--nylas-color-grey-50:#fbfcfe;--nylas-color-white:#ffffff;--nylas-color-red-900:#992222;--nylas-color-red-700:#cc4841;--nylas-color-red-500:#ff786a;--nylas-color-red-300:#ffa79e;--nylas-color-red-100:#ffc5bf;--nylas-color-red-50:#ffeae8;--nylas-color-blue-900:#213571;--nylas-color-blue-700:#314fa9;--nylas-color-blue-500:#4169e1;--nylas-color-blue-300:#bdccf9;--nylas-color-blue-100:#e0e6f9;--nylas-color-blue-50:#f6f8fd;--nylas-color-yellow-900:#7c6506;--nylas-color-yellow-700:#c29f09;--nylas-color-yellow-500:#f7c90b;--nylas-color-yellow-300:#f9de70;--nylas-color-yellow-100:#fceba9;--nylas-color-yellow-50:#fdf4ce;--nylas-color-green-900:#0e6b60;--nylas-color-green-700:#16a392;--nylas-color-green-500:#17c3b2;--nylas-color-green-300:#74dbd1;--nylas-color-green-100:#a2e7e0;--nylas-color-green-50:#d1f3f0;--nylas-color-purple-900:#643554;--nylas-color-purple-700:#954f7d;--nylas-color-purple-500:#c769a7;--nylas-color-purple-300:#dda5ca;--nylas-color-purple-100:#e0bdd6;--nylas-color-purple-50:#e9dde5;--nylas-color-sky-900:#20698f;--nylas-color-sky-700:#2b8fc2;--nylas-color-sky-500:#6dceff;--nylas-color-sky-300:#8fdaff;--nylas-color-sky-100:#b8e7ff;--nylas-color-sky-50:#d9f2ff;width:inherit}.nylas-calendar-picker{width:inherit;display:flex;flex-direction:column;margin:1rem;border-radius:var(--nylas-border-radius-2x);border:1px solid var(--nylas-base-200)}.nylas-calendar-picker .nylas-calendar-picker__loading{padding-bottom:1rem;display:flex;flex-direction:column;gap:4px}.nylas-calendar-picker .nylas-calendar-picker__loading .label{display:flex;align-items:center;gap:0.5rem;margin:1rem 1rem 0;color:var(--nylas-base-800)}.nylas-calendar-picker .nylas-calendar-picker__loading .label tooltip-component{display:flex}.nylas-calendar-picker .nylas-calendar-picker__loading .loading-button{margin:0 1rem;padding:0;width:inherit;height:48px;color:var(--nylas-base-900);font-size:16px;cursor:not-allowed;display:flex;gap:0.5rem;justify-content:space-between;align-items:center;background:transparent;border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x)}.nylas-calendar-picker .nylas-calendar-picker__loading .loading-button span{padding:0 1rem}.nylas-calendar-picker .nylas-calendar-picker__dropdown{padding:1rem}.nylas-calendar-picker .nylas-calendar-picker__dropdown multi-select-dropdown::part(msd_dropdown){width:100%;display:flex;flex-direction:column;gap:4px}.nylas-calendar-picker .nylas-calendar-picker__dropdown multi-select-dropdown::part(msd_dropdown-button){width:100%;display:flex;justify-content:space-between;align-items:center;border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x);padding:1rem}.nylas-calendar-picker .nylas-calendar-picker__dropdown multi-select-dropdown::part(msd_dropdown-button--error){border:1px solid var(--nylas-error)}.nylas-calendar-picker .nylas-calendar-picker__dropdown multi-select-dropdown::part(msd_dropdown-content){width:100%;max-width:unset;margin-top:-0.5rem}.nylas-calendar-picker .nylas-calendar-picker__dropdown multi-select-dropdown::part(msd_dropdown-button-selected-label){max-width:calc(100% - 2rem);font-family:var(--nylas-font-family);font-size:16px;line-height:24px}";
 
@@ -202,6 +202,6 @@ function defineCustomElement() {
 }
 
 export { NylasCalendarPicker as N, defineCustomElement as d };
-//# sourceMappingURL=p-B2qD9GvB.js.map
+//# sourceMappingURL=p-BqcSDTPa.js.map
 
-//# sourceMappingURL=p-B2qD9GvB.js.map
+//# sourceMappingURL=p-BqcSDTPa.js.map

package/dist/components/{p-B2qD9GvB.js.map → p-BqcSDTPa.js.map}

@@ -1 +1 @@
-{"file":"p-B2qD9GvB.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","i18next"],"sources":["src/components/scheduler-editor/nylas-calendar-picker/nylas-calendar-picker.scss?tag=nylas-calendar-picker&encapsulation=shadow","src/components/scheduler-editor/nylas-calendar-picker/nylas-calendar-picker.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n  display: block;\n  @include default-css-variables;\n  width: inherit;\n}\n\n.nylas-calendar-picker {\n  width: inherit;\n  display: flex;\n  flex-direction: column;\n  margin: 1rem;\n  border-radius: var(--nylas-border-radius-2x);\n  border: 1px solid var(--nylas-base-200);\n\n  .nylas-calendar-picker__loading {\n    padding-bottom: 1rem;\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n\n    .label {\n      display: flex;\n      align-items: center;\n      gap: 0.5rem;\n      margin: 1rem 1rem 0;\n      color: var(--nylas-base-800);\n\n      tooltip-component {\n        display: flex;\n      }\n    }\n\n    .loading-button {\n      margin: 0 1rem;\n      padding: 0;\n      width: inherit;\n      height: 48px;\n      color: var(--nylas-base-900);\n      font-size: 16px;\n      cursor: not-allowed;\n      display: flex;\n      gap: 0.5rem;\n      justify-content: space-between;\n      align-items: center;\n      background: transparent;\n      border: 1px solid var(--nylas-base-200);\n      border-radius: var(--nylas-border-radius-2x);\n\n      span {\n        padding: 0 1rem;\n      }\n    }\n  }\n\n  .nylas-calendar-picker__dropdown {\n    padding: 1rem;\n\n    multi-select-dropdown::part(msd_dropdown) {\n      width: 100%;\n      display: flex;\n      flex-direction: column;\n      gap: 4px;\n    }\n\n    multi-select-dropdown::part(msd_dropdown-button) {\n      width: 100%;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      border: 1px solid var(--nylas-base-200);\n      border-radius: var(--nylas-border-radius-2x);\n      padding: 1rem;\n    }\n\n    multi-select-dropdown::part(msd_dropdown-button--error) {\n      border: 1px solid var(--nylas-error);\n    }\n\n    multi-select-dropdown::part(msd_dropdown-content) {\n      width: 100%;\n      max-width: unset;\n      margin-top: -0.5rem;\n    }\n\n    multi-select-dropdown::part(msd_dropdown-button-selected-label) {\n      max-width: calc(100% - 2rem);\n      font-family: var(--nylas-font-family);\n      font-size: 16px;\n      line-height: 24px;\n    }\n  }\n}","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { Calendar } from '@nylas/core';\nimport { AttachInternals, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { User } from '@/common/nylas-api-request';\nimport i18next from '@/utils/i18n';\nimport { LANGUAGE_CODE } from '@/common/constants';\nimport { ThemeConfig } from '@nylas/core';\n/**\n * The `nylas-calendar-picker` component is a form input for selecting calendars to check availability.\n *\n * @part ncp - The calendar picker container\n * @part ncp__dropdown - The dropdown container\n * @part ncp__dropdown-button - The dropdown button\n * @part ncp__dropdown-content - The dropdown content\n */\n@Component({\n  tag: 'nylas-calendar-picker',\n  styleUrl: 'nylas-calendar-picker.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasCalendarPicker {\n  @Element() host!: HTMLNylasCalendarPickerElement;\n  /**\n   * @standalone\n   * The name of the calendar picker.\n   */\n  @Prop() name: string = 'calendar';\n  /**\n   * @standalone\n   * The logged in user.\n   */\n  @Prop() currentUser?: User;\n  /**\n   * @standalone\n   * The calendars to choose from.\n   */\n  @Prop() calendars?: Calendar[];\n  /**\n   * @standalone\n   * The default selected calendars.\n   */\n  @Prop() defaultSelectedCalendars: string[] = [];\n  /**\n   * The selected language.\n   */\n  @Prop() selectedLanguage?: LANGUAGE_CODE;\n  /**\n   * @standalone\n   * The theme configuration.\n   */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n\n  /**\n   * The selected calendars.\n   */\n  @State() selectedCalendars: string[] = [];\n\n  /**\n   * The error message to display.\n   */\n  @State() error: string = '';\n\n  /**\n   * This event is fired when the selected calendars change.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string[];\n    name: string;\n    valueChangedHandler?: (event: CustomEvent<{ value: string[]; name: string }>) => void;\n  }>;\n\n  /**\n   * When a name prop is passed, stencil does not automatically set the name attribute on the host element.\n   * Since this component is form-associated, the name attribute is required for form submission.\n   * This is a workaround to ensure that the name attribute is set on the host element.\n   */\n  @Watch('name')\n  elementNameChangedHandler(newValue: string) {\n    debug('nylas-calendar-picker', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('selectedLanguage')\n  selectedLanguageChangedHandler(newVal: LANGUAGE_CODE, oldVal: LANGUAGE_CODE) {\n    if (newVal === oldVal) return;\n    i18next.changeLanguage(newVal);\n    if (this.error) {\n      this.error = i18next.t('nylasCalendarPicker.selectAtLeastOneCalendar');\n    }\n  }\n\n  @Watch('themeConfig')\n  themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n    if (newVal === oldVal) return;\n    this.applyThemeConfig(newVal);\n  }\n\n  // Lifecycle methods\n  connectedCallback() {\n    debug('nylas-calendar-picker', 'connectedCallback');\n    // Use queueMicrotask to defer theme application until after React has set props.\n    // This fixes the timing issue where connectedCallback fires before React sets themeConfig.\n    queueMicrotask(() => {\n      if (this.themeConfig) {\n        this.applyThemeConfig(this.themeConfig);\n        this.host.setAttribute('data-themed', '');\n      }\n    });\n  }\n\n  disconnectedCallback() {\n    debug('nylas-calendar-picker', 'disconnectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-calendar-picker', 'componentWillLoad');\n    // See comment in the @Watch('name') decorator for more information.\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-calendar-picker', 'componentDidLoad');\n    // TODO: Remove this when the internals in tests are fixed.\n    if (typeof this.internals.setFormValue === 'function') {\n      this.internals.setFormValue(this.defaultSelectedCalendars.toString(), this.name);\n    }\n  }\n\n  componentWillUpdate() {\n    debug('nylas-calendar-picker', 'componentWillUpdate');\n  }\n\n  componentDidUpdate() {\n    debug('nylas-calendar-picker', 'componentDidUpdate');\n  }\n\n  componentWillRender() {\n    debug('nylas-calendar-picker', 'componentWillRender');\n  }\n\n  componentDidRender() {\n    debug('nylas-calendar-picker', 'componentDidRender');\n  }\n\n  @Listen('selectedOptionsChanged')\n  selectedOptionsChangedHandler(event: CustomEvent<{ value: string[]; name: string }>) {\n    debug('nylas-calendar-picker', 'nylasFormDropdownChangedHandler', event.detail);\n    // Pass as handler so that if event.defaultPrevented by parent app, this will be skipped.\n    const valueChangedHandler = (event: CustomEvent<{ value: string[]; name: string }>) => {\n      const { value } = event.detail;\n      this.selectedCalendars = [...value];\n      if (this.selectedCalendars.length === 0) {\n        this.error = i18next.t('nylasCalendarPicker.selectAtLeastOneCalendar');\n        this.internals.setValidity({ customError: true }, this.error);\n      } else {\n        this.error = '';\n        this.internals.setValidity({});\n      }\n      this.internals.setFormValue(value.toString(), this.name);\n    };\n    this.valueChanged.emit({ ...event.detail, name: this.name, valueChangedHandler });\n  }\n\n  applyThemeConfig(themeConfig?: ThemeConfig) {\n    if (themeConfig) {\n      for (const [key, value] of Object.entries(themeConfig)) {\n        this.host.style.setProperty(`${key}`, value);\n      }\n    }\n  }\n\n  @RegisterComponent<NylasCalendarPicker, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-calendar-picker',\n    stateToProps: new Map([\n      ['schedulerConfig.currentUser', 'currentUser'],\n      ['schedulerConfig.selectedLanguage', 'selectedLanguage'],\n      ['schedulerConfig.themeConfig', 'themeConfig'],\n    ]),\n    eventToProps: {\n      valueChanged: async (\n        event: CustomEvent<{ value: string[]; name: string; valueChangedHandler?: (event: CustomEvent<{ value: string[]; name: string }>) => void }>,\n        _nylasSchedulerConfigConnector: NylasSchedulerConfigConnector,\n      ) => {\n        const { valueChangedHandler } = event.detail;\n        // If a handler is passed, call it.\n        if (valueChangedHandler) {\n          valueChangedHandler(event);\n        }\n      },\n    },\n    fireRegisterEvent: true,\n  })\n  render() {\n    const calendarOptions =\n      this.calendars?.map(calendar => {\n        return {\n          value: calendar.id,\n          label: calendar.name,\n          selected:\n            this.defaultSelectedCalendars?.includes(calendar.id) ||\n            (this.defaultSelectedCalendars?.includes('primary') || this.defaultSelectedCalendars?.length === 0\n              ? calendar.id === this.currentUser?.email || calendar.id === this.name.split('participant-')[1]\n              : false),\n        };\n      }) ?? [];\n\n    return (\n      <Host>\n        <div class=\"nylas-calendar-picker\" part=\"ncp\">\n          {calendarOptions.length > 0 ? (\n            <div class=\"nylas-calendar-picker__dropdown\">\n              <multi-select-dropdown\n                name={this.name}\n                options={calendarOptions}\n                selectAtLeastOneOptionLabel={i18next.t('selectOneOrMoreOptions')}\n                multipleOptionsSelectedLabel={i18next.t('multipleOptionsSelected')}\n                error={this.error}\n                exportparts=\"msd_dropdown: ncp__dropdown, msd_dropdown-button: ncp__dropdown-button, msd_dropdown-content: ncp__dropdown-content\"\n                themeConfig={this.themeConfig}\n              ></multi-select-dropdown>\n            </div>\n          ) : (\n            <div class=\"nylas-calendar-picker__loading\">\n              <span class=\"label\">\n                {i18next.t('nylasCalendarPicker.calendarPickerLabel')} <info-icon />\n              </span>\n              <div class=\"loading-button\">\n                <span>{i18next.t('loading')}...</span>\n              </div>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-BqcSDTPa.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","i18next"],"sources":["src/components/scheduler-editor/nylas-calendar-picker/nylas-calendar-picker.scss?tag=nylas-calendar-picker&encapsulation=shadow","src/components/scheduler-editor/nylas-calendar-picker/nylas-calendar-picker.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n  display: block;\n  @include default-css-variables;\n  width: inherit;\n}\n\n.nylas-calendar-picker {\n  width: inherit;\n  display: flex;\n  flex-direction: column;\n  margin: 1rem;\n  border-radius: var(--nylas-border-radius-2x);\n  border: 1px solid var(--nylas-base-200);\n\n  .nylas-calendar-picker__loading {\n    padding-bottom: 1rem;\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n\n    .label {\n      display: flex;\n      align-items: center;\n      gap: 0.5rem;\n      margin: 1rem 1rem 0;\n      color: var(--nylas-base-800);\n\n      tooltip-component {\n        display: flex;\n      }\n    }\n\n    .loading-button {\n      margin: 0 1rem;\n      padding: 0;\n      width: inherit;\n      height: 48px;\n      color: var(--nylas-base-900);\n      font-size: 16px;\n      cursor: not-allowed;\n      display: flex;\n      gap: 0.5rem;\n      justify-content: space-between;\n      align-items: center;\n      background: transparent;\n      border: 1px solid var(--nylas-base-200);\n      border-radius: var(--nylas-border-radius-2x);\n\n      span {\n        padding: 0 1rem;\n      }\n    }\n  }\n\n  .nylas-calendar-picker__dropdown {\n    padding: 1rem;\n\n    multi-select-dropdown::part(msd_dropdown) {\n      width: 100%;\n      display: flex;\n      flex-direction: column;\n      gap: 4px;\n    }\n\n    multi-select-dropdown::part(msd_dropdown-button) {\n      width: 100%;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      border: 1px solid var(--nylas-base-200);\n      border-radius: var(--nylas-border-radius-2x);\n      padding: 1rem;\n    }\n\n    multi-select-dropdown::part(msd_dropdown-button--error) {\n      border: 1px solid var(--nylas-error);\n    }\n\n    multi-select-dropdown::part(msd_dropdown-content) {\n      width: 100%;\n      max-width: unset;\n      margin-top: -0.5rem;\n    }\n\n    multi-select-dropdown::part(msd_dropdown-button-selected-label) {\n      max-width: calc(100% - 2rem);\n      font-family: var(--nylas-font-family);\n      font-size: 16px;\n      line-height: 24px;\n    }\n  }\n}","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { Calendar } from '@nylas/core';\nimport { AttachInternals, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { User } from '@/common/nylas-api-request';\nimport i18next from '@/utils/i18n';\nimport { LANGUAGE_CODE } from '@/common/constants';\nimport { ThemeConfig } from '@nylas/core';\n/**\n * The `nylas-calendar-picker` component is a form input for selecting calendars to check availability.\n *\n * @part ncp - The calendar picker container\n * @part ncp__dropdown - The dropdown container\n * @part ncp__dropdown-button - The dropdown button\n * @part ncp__dropdown-content - The dropdown content\n */\n@Component({\n  tag: 'nylas-calendar-picker',\n  styleUrl: 'nylas-calendar-picker.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasCalendarPicker {\n  @Element() host!: HTMLNylasCalendarPickerElement;\n  /**\n   * @standalone\n   * The name of the calendar picker.\n   */\n  @Prop() name: string = 'calendar';\n  /**\n   * @standalone\n   * The logged in user.\n   */\n  @Prop() currentUser?: User;\n  /**\n   * @standalone\n   * The calendars to choose from.\n   */\n  @Prop() calendars?: Calendar[];\n  /**\n   * @standalone\n   * The default selected calendars.\n   */\n  @Prop() defaultSelectedCalendars: string[] = [];\n  /**\n   * The selected language.\n   */\n  @Prop() selectedLanguage?: LANGUAGE_CODE;\n  /**\n   * @standalone\n   * The theme configuration.\n   */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n\n  /**\n   * The selected calendars.\n   */\n  @State() selectedCalendars: string[] = [];\n\n  /**\n   * The error message to display.\n   */\n  @State() error: string = '';\n\n  /**\n   * This event is fired when the selected calendars change.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string[];\n    name: string;\n    valueChangedHandler?: (event: CustomEvent<{ value: string[]; name: string }>) => void;\n  }>;\n\n  /**\n   * When a name prop is passed, stencil does not automatically set the name attribute on the host element.\n   * Since this component is form-associated, the name attribute is required for form submission.\n   * This is a workaround to ensure that the name attribute is set on the host element.\n   */\n  @Watch('name')\n  elementNameChangedHandler(newValue: string) {\n    debug('nylas-calendar-picker', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('selectedLanguage')\n  selectedLanguageChangedHandler(newVal: LANGUAGE_CODE, oldVal: LANGUAGE_CODE) {\n    if (newVal === oldVal) return;\n    i18next.changeLanguage(newVal);\n    if (this.error) {\n      this.error = i18next.t('nylasCalendarPicker.selectAtLeastOneCalendar');\n    }\n  }\n\n  @Watch('themeConfig')\n  themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n    if (newVal === oldVal) return;\n    this.applyThemeConfig(newVal);\n  }\n\n  // Lifecycle methods\n  connectedCallback() {\n    debug('nylas-calendar-picker', 'connectedCallback');\n    // Use queueMicrotask to defer theme application until after React has set props.\n    // This fixes the timing issue where connectedCallback fires before React sets themeConfig.\n    queueMicrotask(() => {\n      if (this.themeConfig) {\n        this.applyThemeConfig(this.themeConfig);\n        this.host.setAttribute('data-themed', '');\n      }\n    });\n  }\n\n  disconnectedCallback() {\n    debug('nylas-calendar-picker', 'disconnectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-calendar-picker', 'componentWillLoad');\n    // See comment in the @Watch('name') decorator for more information.\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-calendar-picker', 'componentDidLoad');\n    // TODO: Remove this when the internals in tests are fixed.\n    if (typeof this.internals.setFormValue === 'function') {\n      this.internals.setFormValue(this.defaultSelectedCalendars.toString(), this.name);\n    }\n  }\n\n  componentWillUpdate() {\n    debug('nylas-calendar-picker', 'componentWillUpdate');\n  }\n\n  componentDidUpdate() {\n    debug('nylas-calendar-picker', 'componentDidUpdate');\n  }\n\n  componentWillRender() {\n    debug('nylas-calendar-picker', 'componentWillRender');\n  }\n\n  componentDidRender() {\n    debug('nylas-calendar-picker', 'componentDidRender');\n  }\n\n  @Listen('selectedOptionsChanged')\n  selectedOptionsChangedHandler(event: CustomEvent<{ value: string[]; name: string }>) {\n    debug('nylas-calendar-picker', 'nylasFormDropdownChangedHandler', event.detail);\n    // Pass as handler so that if event.defaultPrevented by parent app, this will be skipped.\n    const valueChangedHandler = (event: CustomEvent<{ value: string[]; name: string }>) => {\n      const { value } = event.detail;\n      this.selectedCalendars = [...value];\n      if (this.selectedCalendars.length === 0) {\n        this.error = i18next.t('nylasCalendarPicker.selectAtLeastOneCalendar');\n        this.internals.setValidity({ customError: true }, this.error);\n      } else {\n        this.error = '';\n        this.internals.setValidity({});\n      }\n      this.internals.setFormValue(value.toString(), this.name);\n    };\n    this.valueChanged.emit({ ...event.detail, name: this.name, valueChangedHandler });\n  }\n\n  applyThemeConfig(themeConfig?: ThemeConfig) {\n    if (themeConfig) {\n      for (const [key, value] of Object.entries(themeConfig)) {\n        this.host.style.setProperty(`${key}`, value);\n      }\n    }\n  }\n\n  @RegisterComponent<NylasCalendarPicker, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-calendar-picker',\n    stateToProps: new Map([\n      ['schedulerConfig.currentUser', 'currentUser'],\n      ['schedulerConfig.selectedLanguage', 'selectedLanguage'],\n      ['schedulerConfig.themeConfig', 'themeConfig'],\n    ]),\n    eventToProps: {\n      valueChanged: async (\n        event: CustomEvent<{ value: string[]; name: string; valueChangedHandler?: (event: CustomEvent<{ value: string[]; name: string }>) => void }>,\n        _nylasSchedulerConfigConnector: NylasSchedulerConfigConnector,\n      ) => {\n        const { valueChangedHandler } = event.detail;\n        // If a handler is passed, call it.\n        if (valueChangedHandler) {\n          valueChangedHandler(event);\n        }\n      },\n    },\n    fireRegisterEvent: true,\n  })\n  render() {\n    const calendarOptions =\n      this.calendars?.map(calendar => {\n        return {\n          value: calendar.id,\n          label: calendar.name,\n          selected:\n            this.defaultSelectedCalendars?.includes(calendar.id) ||\n            (this.defaultSelectedCalendars?.includes('primary') || this.defaultSelectedCalendars?.length === 0\n              ? calendar.id === this.currentUser?.email || calendar.id === this.name.split('participant-')[1]\n              : false),\n        };\n      }) ?? [];\n\n    return (\n      <Host>\n        <div class=\"nylas-calendar-picker\" part=\"ncp\">\n          {calendarOptions.length > 0 ? (\n            <div class=\"nylas-calendar-picker__dropdown\">\n              <multi-select-dropdown\n                name={this.name}\n                options={calendarOptions}\n                selectAtLeastOneOptionLabel={i18next.t('selectOneOrMoreOptions')}\n                multipleOptionsSelectedLabel={i18next.t('multipleOptionsSelected')}\n                error={this.error}\n                exportparts=\"msd_dropdown: ncp__dropdown, msd_dropdown-button: ncp__dropdown-button, msd_dropdown-content: ncp__dropdown-content\"\n                themeConfig={this.themeConfig}\n              ></multi-select-dropdown>\n            </div>\n          ) : (\n            <div class=\"nylas-calendar-picker__loading\">\n              <span class=\"label\">\n                {i18next.t('nylasCalendarPicker.calendarPickerLabel')} <info-icon />\n              </span>\n              <div class=\"loading-button\">\n                <span>{i18next.t('loading')}...</span>\n              </div>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-DWH9lxNw.js → p-ByIpuB6X.js}

@@ -1,9 +1,9 @@
 import { p as proxyCustomElement, H, e as createEvent, h, i as Host } from './p-Bht9ktsW.js';
-import { R as RegisterComponent } from './p-CdMky78w.js';
-import { a as debug } from './p-DBE6FcDx.js';
-import { i as instance } from './p-CFk78OEk.js';
+import { R as RegisterComponent } from './p-jHq8WTky.js';
+import { a as debug } from './p-xxFdByBn.js';
+import { i as instance } from './p-BjxQTsOy.js';
 import { d as defineCustomElement$3 } from './p-d3kelm3z.js';
-import { d as defineCustomElement$2 } from './p-elpxqGIV.js';
+import { d as defineCustomElement$2 } from './p-cIIaCJPC.js';
 import { d as defineCustomElement$1 } from './p-DxDoo-4C.js';
 
 const nylasEventCapacityCss = ":host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-50:#ffeae8;--nylas-error-100:#ffc5bf;--nylas-error-200:#fecaca;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-color-blue-100:#e0e6f9;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;--nylas-color-black:#000000;--nylas-color-grey-900:#2c2c2c;--nylas-color-grey-800:#4b4b4b;--nylas-color-grey-700:#6e6e6e;--nylas-color-grey-600:#8e8e8e;--nylas-color-grey-500:#b3b3b3;--nylas-color-grey-400:#cacaca;--nylas-color-grey-300:#e1e1e1;--nylas-color-grey-200:#eaeaea;--nylas-color-grey-100:#f5f5f5;--nylas-color-grey-50:#fbfcfe;--nylas-color-white:#ffffff;--nylas-color-red-900:#992222;--nylas-color-red-700:#cc4841;--nylas-color-red-500:#ff786a;--nylas-color-red-300:#ffa79e;--nylas-color-red-100:#ffc5bf;--nylas-color-red-50:#ffeae8;--nylas-color-blue-900:#213571;--nylas-color-blue-700:#314fa9;--nylas-color-blue-500:#4169e1;--nylas-color-blue-300:#bdccf9;--nylas-color-blue-100:#e0e6f9;--nylas-color-blue-50:#f6f8fd;--nylas-color-yellow-900:#7c6506;--nylas-color-yellow-700:#c29f09;--nylas-color-yellow-500:#f7c90b;--nylas-color-yellow-300:#f9de70;--nylas-color-yellow-100:#fceba9;--nylas-color-yellow-50:#fdf4ce;--nylas-color-green-900:#0e6b60;--nylas-color-green-700:#16a392;--nylas-color-green-500:#17c3b2;--nylas-color-green-300:#74dbd1;--nylas-color-green-100:#a2e7e0;--nylas-color-green-50:#d1f3f0;--nylas-color-purple-900:#643554;--nylas-color-purple-700:#954f7d;--nylas-color-purple-500:#c769a7;--nylas-color-purple-300:#dda5ca;--nylas-color-purple-100:#e0bdd6;--nylas-color-purple-50:#e9dde5;--nylas-color-sky-900:#20698f;--nylas-color-sky-700:#2b8fc2;--nylas-color-sky-500:#6dceff;--nylas-color-sky-300:#8fdaff;--nylas-color-sky-100:#b8e7ff;--nylas-color-sky-50:#d9f2ff;width:inherit}.nylas-event-capacity{display:flex;flex-direction:column;gap:4px}.nylas-event-capacity label{display:flex;align-items:center;gap:4px;color:var(--nylas-base-800);font-size:16px;font-style:normal;font-weight:400;line-height:150%;}.nylas-event-capacity label span.required{color:var(--nylas-error, #cc4841)}.nylas-event-capacity label span.label-icon{margin-left:4px}.nylas-event-capacity label span.label-icon tooltip-component{display:flex}.nylas-event-capacity label tooltip-component::part(tc__content){left:50px}.nylas-event-capacity__wrapper{display:flex;align-items:center;gap:0.5rem}.nylas-event-capacity__wrapper input-component{width:auto}.nylas-event-capacity__wrapper input-component::part(ic__input){border-width:1;border-radius:8px;border:1px solid var(--nylas-base-200);font-family:var(--nylas-font-family);font-size:16px;line-height:24px;width:80px}.nylas-event-capacity__wrapper input-component::part(ic__input--error){border:1px solid var(--nylas-error)}.nylas-event-capacity__wrapper input-component::part(ic__label--error){position:relative;margin-bottom:24px}.nylas-event-capacity__wrapper input-component::part(ic__error_message){position:absolute;top:54px;width:max-content}.nylas-event-capacity__wrapper span.attendees.error{margin-top:-24px}";
@@ -179,6 +179,6 @@ function defineCustomElement() {
 }
 
 export { NylasEventCapacity as N, defineCustomElement as d };
-//# sourceMappingURL=p-DWH9lxNw.js.map
+//# sourceMappingURL=p-ByIpuB6X.js.map
 
-//# sourceMappingURL=p-DWH9lxNw.js.map
+//# sourceMappingURL=p-ByIpuB6X.js.map

package/dist/components/{p-DWH9lxNw.js.map → p-ByIpuB6X.js.map}

@@ -1 +1 @@
-{"file":"p-DWH9lxNw.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","i18next"],"sources":["src/components/scheduler-editor/nylas-event-capacity/nylas-event-capacity.scss?tag=nylas-event-capacity&encapsulation=shadow","src/components/scheduler-editor/nylas-event-capacity/nylas-event-capacity.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: inherit;\n}\n\n.nylas-event-capacity {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n\n  label {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n    color: var(--nylas-base-800);\n    font-size: 16px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 150%;\n\n    /* 21px */\n    span.required {\n      color: var(--nylas-error, #cc4841);\n    }\n\n    span.label-icon {\n      margin-left: 4px;\n\n      tooltip-component {\n        display: flex;\n      }\n    }\n\n    tooltip-component {\n      &::part(tc__content) {\n        left: 50px;\n      }\n    }\n  }\n}\n\n.nylas-event-capacity__wrapper {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n\n  input-component {\n    width: auto;\n  }\n\n  input-component::part(ic__input) {\n    border-width: 1;\n    border-radius: 8px;\n    border: 1px solid var(--nylas-base-200);\n    font-family: var(--nylas-font-family);\n    font-size: 16px;\n    line-height: 24px;\n    width: 80px;\n  }\n\n  input-component::part(ic__input--error) {\n    border: 1px solid var(--nylas-error);\n  }\n\n  input-component::part(ic__label--error) {\n    position: relative;\n    margin-bottom: 24px;\n  }\n\n  input-component::part(ic__error_message) {\n    position: absolute;\n    top: 54px;\n    width: max-content;\n  }\n\n  span.attendees {\n    &.error {\n      margin-top: -24px;\n    }\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport i18next from '@/utils/i18n';\nimport { LANGUAGE_CODE } from '@/common/constants';\nimport { ThemeConfig } from '@nylas/core';\n/**\n * The `nylas-event-capacity` component is a UI component that allows users to set the event capacity for the scheduler configuration.\n *\n * @part necapacity - The nylas-event-capacity container\n * @part necapacity__body - The body of the event capacity section\n * @part necapacity__header - The header of the event capacity section\n * @part necapacity__drawer-toggle--container - The card's drawer toggle container\n * @part necapacity__input-numberfield - The event capacity input numberfield\n */\n@Component({\n  tag: 'nylas-event-capacity',\n  styleUrl: 'nylas-event-capacity.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasEventCapacity {\n  @Element() host!: HTMLNylasEventCapacityElement;\n\n  /**\n   * @standalone\n   * The name of the component\n   */\n  @Prop() name: string = 'event-capacity';\n  /**\n   * @standalone\n   * The default event capacity\n   */\n  @Prop() capacity?: number;\n\n  /**\n   * The selected language.\n   */\n  @Prop() selectedLanguage?: LANGUAGE_CODE;\n\n  /**\n   * @standalone\n   * The theme configuration.\n   */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n\n  /**\n   * The current event capacity state\n   */\n  @State() selectedEventCapacity!: number;\n\n  @State() error: string = '';\n\n  /**\n   * This event is fired when the event capacity value changes\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n    valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void;\n  }>;\n\n  // Lifecycle methods\n  connectedCallback() {\n    debug('nylas-event-capacity', 'connectedCallback');\n    // Use queueMicrotask to defer theme application until after React has set props.\n    // This fixes the timing issue where connectedCallback fires before React sets themeConfig.\n    queueMicrotask(() => {\n      if (this.themeConfig) {\n        this.applyThemeConfig(this.themeConfig);\n        this.host.setAttribute('data-themed', '');\n      }\n    });\n  }\n\n  disconnectedCallback() {\n    debug('nylas-event-capacity', 'disconnectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-event-capacity', 'componentWillLoad');\n    // See comment in the @Watch('name') decorator for more information.\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-event-capacity', 'componentDidLoad');\n    this.selectedEventCapacity = this.capacity || 10;\n    debug('selectedEventCapacity', this.selectedEventCapacity);\n    this.internals.setFormValue(this.selectedEventCapacity.toString(), this.name);\n  }\n\n  componentWillUpdate() {\n    debug('nylas-event-capacity', 'componentWillUpdate');\n  }\n\n  componentDidUpdate() {\n    debug('nylas-event-capacity', 'componentDidUpdate');\n  }\n\n  componentWillRender() {\n    debug('nylas-event-capacity', 'componentWillRender');\n  }\n\n  componentDidRender() {\n    debug('nylas-event-capacity', 'componentDidRender');\n  }\n\n  /**\n   * When a name prop is passed, stencil does not automatically set the name attribute on the host element.\n   * Since this component is form-associated, the name attribute is required for form submission.\n   * This is a workaround to ensure that the name attribute is set on the host element.\n   */\n  @Watch('name')\n  elementNameChangedHandler(newValue: string) {\n    debug('nylas-event-capacity', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('selectedLanguage')\n  selectedLanguageChangedHandler(newVal: LANGUAGE_CODE, oldVal: LANGUAGE_CODE) {\n    if (newVal === oldVal) return;\n    i18next.changeLanguage(newVal);\n  }\n\n  @Watch('themeConfig')\n  themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n    if (newVal === oldVal) return;\n    this.applyThemeConfig(newVal);\n  }\n\n  applyThemeConfig(themeConfig?: ThemeConfig) {\n    if (themeConfig) {\n      for (const [key, value] of Object.entries(themeConfig)) {\n        this.host.style.setProperty(`${key}`, value);\n      }\n    }\n  }\n\n  @Listen('nylasFormInputChanged')\n  async nylasFormInputChangeHandler(event: CustomEvent<{ value: string; name: string }>) {\n    const { name, value } = event.detail;\n\n    if (name === 'event-capacity') {\n      const parsedValue = parseInt(value);\n      if (parsedValue < 1 || parsedValue > 500 || isNaN(parsedValue)) {\n        this.error = i18next.t('fixFormErrors');\n        this.internals.setValidity({ customError: true }, this.error);\n        this.valueChanged.emit({ value: value.toString(), name: this.name });\n        return;\n      }\n      this.error = '';\n      this.internals.setValidity({ customError: false }, '');\n      this.selectedEventCapacity = parseInt(value);\n      this.internals.setFormValue(value.toString(), this.name);\n      this.valueChanged.emit({ value: value.toString(), name: this.name });\n    }\n  }\n\n  @RegisterComponent<NylasEventCapacity, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-event-capacity',\n    stateToProps: new Map([\n      ['schedulerConfig.selectedLanguage', 'selectedLanguage'],\n      ['schedulerConfig.themeConfig', 'themeConfig'],\n    ]),\n    eventToProps: {\n      valueChanged: async (\n        event: CustomEvent<{ value: string; name: string; valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void }>,\n        _nylasSchedulerConfigConnector: NylasSchedulerConfigConnector,\n      ) => {\n        const { valueChanged } = event.detail;\n        // If a handler is passed, call it.\n        if (valueChanged) {\n          valueChanged(event);\n        }\n      },\n    },\n    fireRegisterEvent: true,\n  })\n  render() {\n    const isComponentReady = typeof this.selectedEventCapacity !== 'undefined';\n    return (\n      <Host>\n        <div class=\"nylas-event-capacity\" part=\"necapacity\">\n          <label htmlFor=\"event-capacity\">\n            <span>\n              {i18next.t('nylasEventCapacity.headerTitle')}\n              <span class=\"required\">*</span>\n            </span>\n            <tooltip-component>\n              <info-icon slot=\"tooltip-icon\" />\n              <span slot=\"tooltip-content\">{i18next.t('nylasEventCapacity.tooltip.desc')}</span>\n            </tooltip-component>\n          </label>\n          {isComponentReady && (\n            <div class=\"nylas-event-capacity__wrapper\">\n              <input-component\n                name=\"event-capacity\"\n                id=\"event-capacity\"\n                type=\"number\"\n                pattern={/^[0-9]*$/}\n                patternError={i18next.t('invalidInputFormat', { field: 'Event capacity' })}\n                minValue={1}\n                maxValue={500}\n                required={false}\n                exportparts=\"ic_input: necapacity__input-textfield\"\n                defaultValue={typeof this.selectedEventCapacity === 'number' ? this.selectedEventCapacity.toString() : '10'}\n                themeConfig={this.themeConfig}\n              />\n              <span class={this.error ? 'attendees error' : 'attendees'}>{i18next.t('nylasEventCapacity.attendees')}</span>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-ByIpuB6X.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","i18next"],"sources":["src/components/scheduler-editor/nylas-event-capacity/nylas-event-capacity.scss?tag=nylas-event-capacity&encapsulation=shadow","src/components/scheduler-editor/nylas-event-capacity/nylas-event-capacity.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: inherit;\n}\n\n.nylas-event-capacity {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n\n  label {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n    color: var(--nylas-base-800);\n    font-size: 16px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 150%;\n\n    /* 21px */\n    span.required {\n      color: var(--nylas-error, #cc4841);\n    }\n\n    span.label-icon {\n      margin-left: 4px;\n\n      tooltip-component {\n        display: flex;\n      }\n    }\n\n    tooltip-component {\n      &::part(tc__content) {\n        left: 50px;\n      }\n    }\n  }\n}\n\n.nylas-event-capacity__wrapper {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n\n  input-component {\n    width: auto;\n  }\n\n  input-component::part(ic__input) {\n    border-width: 1;\n    border-radius: 8px;\n    border: 1px solid var(--nylas-base-200);\n    font-family: var(--nylas-font-family);\n    font-size: 16px;\n    line-height: 24px;\n    width: 80px;\n  }\n\n  input-component::part(ic__input--error) {\n    border: 1px solid var(--nylas-error);\n  }\n\n  input-component::part(ic__label--error) {\n    position: relative;\n    margin-bottom: 24px;\n  }\n\n  input-component::part(ic__error_message) {\n    position: absolute;\n    top: 54px;\n    width: max-content;\n  }\n\n  span.attendees {\n    &.error {\n      margin-top: -24px;\n    }\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport i18next from '@/utils/i18n';\nimport { LANGUAGE_CODE } from '@/common/constants';\nimport { ThemeConfig } from '@nylas/core';\n/**\n * The `nylas-event-capacity` component is a UI component that allows users to set the event capacity for the scheduler configuration.\n *\n * @part necapacity - The nylas-event-capacity container\n * @part necapacity__body - The body of the event capacity section\n * @part necapacity__header - The header of the event capacity section\n * @part necapacity__drawer-toggle--container - The card's drawer toggle container\n * @part necapacity__input-numberfield - The event capacity input numberfield\n */\n@Component({\n  tag: 'nylas-event-capacity',\n  styleUrl: 'nylas-event-capacity.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasEventCapacity {\n  @Element() host!: HTMLNylasEventCapacityElement;\n\n  /**\n   * @standalone\n   * The name of the component\n   */\n  @Prop() name: string = 'event-capacity';\n  /**\n   * @standalone\n   * The default event capacity\n   */\n  @Prop() capacity?: number;\n\n  /**\n   * The selected language.\n   */\n  @Prop() selectedLanguage?: LANGUAGE_CODE;\n\n  /**\n   * @standalone\n   * The theme configuration.\n   */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n\n  /**\n   * The current event capacity state\n   */\n  @State() selectedEventCapacity!: number;\n\n  @State() error: string = '';\n\n  /**\n   * This event is fired when the event capacity value changes\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n    valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void;\n  }>;\n\n  // Lifecycle methods\n  connectedCallback() {\n    debug('nylas-event-capacity', 'connectedCallback');\n    // Use queueMicrotask to defer theme application until after React has set props.\n    // This fixes the timing issue where connectedCallback fires before React sets themeConfig.\n    queueMicrotask(() => {\n      if (this.themeConfig) {\n        this.applyThemeConfig(this.themeConfig);\n        this.host.setAttribute('data-themed', '');\n      }\n    });\n  }\n\n  disconnectedCallback() {\n    debug('nylas-event-capacity', 'disconnectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-event-capacity', 'componentWillLoad');\n    // See comment in the @Watch('name') decorator for more information.\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-event-capacity', 'componentDidLoad');\n    this.selectedEventCapacity = this.capacity || 10;\n    debug('selectedEventCapacity', this.selectedEventCapacity);\n    this.internals.setFormValue(this.selectedEventCapacity.toString(), this.name);\n  }\n\n  componentWillUpdate() {\n    debug('nylas-event-capacity', 'componentWillUpdate');\n  }\n\n  componentDidUpdate() {\n    debug('nylas-event-capacity', 'componentDidUpdate');\n  }\n\n  componentWillRender() {\n    debug('nylas-event-capacity', 'componentWillRender');\n  }\n\n  componentDidRender() {\n    debug('nylas-event-capacity', 'componentDidRender');\n  }\n\n  /**\n   * When a name prop is passed, stencil does not automatically set the name attribute on the host element.\n   * Since this component is form-associated, the name attribute is required for form submission.\n   * This is a workaround to ensure that the name attribute is set on the host element.\n   */\n  @Watch('name')\n  elementNameChangedHandler(newValue: string) {\n    debug('nylas-event-capacity', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('selectedLanguage')\n  selectedLanguageChangedHandler(newVal: LANGUAGE_CODE, oldVal: LANGUAGE_CODE) {\n    if (newVal === oldVal) return;\n    i18next.changeLanguage(newVal);\n  }\n\n  @Watch('themeConfig')\n  themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n    if (newVal === oldVal) return;\n    this.applyThemeConfig(newVal);\n  }\n\n  applyThemeConfig(themeConfig?: ThemeConfig) {\n    if (themeConfig) {\n      for (const [key, value] of Object.entries(themeConfig)) {\n        this.host.style.setProperty(`${key}`, value);\n      }\n    }\n  }\n\n  @Listen('nylasFormInputChanged')\n  async nylasFormInputChangeHandler(event: CustomEvent<{ value: string; name: string }>) {\n    const { name, value } = event.detail;\n\n    if (name === 'event-capacity') {\n      const parsedValue = parseInt(value);\n      if (parsedValue < 1 || parsedValue > 500 || isNaN(parsedValue)) {\n        this.error = i18next.t('fixFormErrors');\n        this.internals.setValidity({ customError: true }, this.error);\n        this.valueChanged.emit({ value: value.toString(), name: this.name });\n        return;\n      }\n      this.error = '';\n      this.internals.setValidity({ customError: false }, '');\n      this.selectedEventCapacity = parseInt(value);\n      this.internals.setFormValue(value.toString(), this.name);\n      this.valueChanged.emit({ value: value.toString(), name: this.name });\n    }\n  }\n\n  @RegisterComponent<NylasEventCapacity, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-event-capacity',\n    stateToProps: new Map([\n      ['schedulerConfig.selectedLanguage', 'selectedLanguage'],\n      ['schedulerConfig.themeConfig', 'themeConfig'],\n    ]),\n    eventToProps: {\n      valueChanged: async (\n        event: CustomEvent<{ value: string; name: string; valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void }>,\n        _nylasSchedulerConfigConnector: NylasSchedulerConfigConnector,\n      ) => {\n        const { valueChanged } = event.detail;\n        // If a handler is passed, call it.\n        if (valueChanged) {\n          valueChanged(event);\n        }\n      },\n    },\n    fireRegisterEvent: true,\n  })\n  render() {\n    const isComponentReady = typeof this.selectedEventCapacity !== 'undefined';\n    return (\n      <Host>\n        <div class=\"nylas-event-capacity\" part=\"necapacity\">\n          <label htmlFor=\"event-capacity\">\n            <span>\n              {i18next.t('nylasEventCapacity.headerTitle')}\n              <span class=\"required\">*</span>\n            </span>\n            <tooltip-component>\n              <info-icon slot=\"tooltip-icon\" />\n              <span slot=\"tooltip-content\">{i18next.t('nylasEventCapacity.tooltip.desc')}</span>\n            </tooltip-component>\n          </label>\n          {isComponentReady && (\n            <div class=\"nylas-event-capacity__wrapper\">\n              <input-component\n                name=\"event-capacity\"\n                id=\"event-capacity\"\n                type=\"number\"\n                pattern={/^[0-9]*$/}\n                patternError={i18next.t('invalidInputFormat', { field: 'Event capacity' })}\n                minValue={1}\n                maxValue={500}\n                required={false}\n                exportparts=\"ic_input: necapacity__input-textfield\"\n                defaultValue={typeof this.selectedEventCapacity === 'number' ? this.selectedEventCapacity.toString() : '10'}\n                themeConfig={this.themeConfig}\n              />\n              <span class={this.error ? 'attendees error' : 'attendees'}>{i18next.t('nylasEventCapacity.attendees')}</span>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-DDnT7nCe.js → p-Bye3Di82.js}

@@ -1,4 +1,4 @@
-import { d as dataResponse } from './p-DBE6FcDx.js';
+import { d as dataResponse } from './p-xxFdByBn.js';
 
 class NylasIdentityRequestWrapper {
     constructor(session) {
@@ -74,6 +74,6 @@ class NylasIdentityRequestWrapper {
 }
 
 export { NylasIdentityRequestWrapper as N };
-//# sourceMappingURL=p-DDnT7nCe.js.map
+//# sourceMappingURL=p-Bye3Di82.js.map
 
-//# sourceMappingURL=p-DDnT7nCe.js.map
+//# sourceMappingURL=p-Bye3Di82.js.map

package/dist/components/{p-DDnT7nCe.js.map → p-Bye3Di82.js.map}

@@ -1 +1 @@
-{"file":"p-DDnT7nCe.js","mappings":"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","names":[],"sources":["src/common/nylas-api-request.ts"],"sourcesContent":["import { dataResponse } from '@/utils/utils';\nimport type { NylasSessions } from '@nylas/identity';\nimport { DataResponseReturnType } from './types';\n\n/**\n * Arguments for making a request to the Nylas API.\n */\nexport type NylasRequestArgs = {\n  method: 'GET' | 'POST' | 'PUT' | 'DELETE' | 'PATCH';\n  path: string;\n  body?: any;\n  headers?: Record<string, string>;\n};\n\n/**\n * A model representing a user in the Nylas Identity system.\n */\nexport type User = {\n  id: string;\n  email: string;\n  name?: string;\n  provider?: string;\n};\n\n/**\n * Arguments for authenticating a user with the Nylas Identity system.\n */\nexport type AuthArgs = {\n  /**\n   * The provider of the user's email address.\n   */\n  provider?: string;\n  /**\n   * A list of permission scopes for the provider.\n   */\n  scope?: Array<string>;\n  /**\n   * The login hint associated with the user.\n   */\n  loginHint?: string;\n  /**\n   * Whether to include grant scopes in the auth exchange.\n   */\n  includeGrantScopes?: boolean;\n  prompt?: string;\n  metadata?: string;\n  state?: string;\n};\n\n/**\n * Interface for making requests to the Nylas API.\n *\n * This is an abstract class that is meant to be implemented by customers to provide their own\n * implementation of making requests to the Nylas API. This allows customers to use their own\n * authentication mechanism, or to use a different HTTP client library.\n */\nexport abstract class NylasApiRequest {\n  /**\n   * This method should make an authenticated request to the Nylas API.\n   * Note: It should not throw an error if the request fails, but should return an object with the error\n   * information as part of the tuple returned.\n   * @param args NylasRequestArgs\n   */\n  abstract request<T = any>(args: NylasRequestArgs): Promise<DataResponseReturnType<T>>;\n\n  /**\n   * This method should return the current user's information.\n   */\n\n  abstract currentUser(): Promise<User | null>;\n\n  /**\n   * This method should set the default authentication arguments to use when authenticating the user.\n   */\n  abstract setDefaultAuthArgs(authArgs: AuthArgs[]): void;\n\n  /**\n   * This method should return the URL to redirect the user to for authentication.\n   */\n  abstract authenticationUrl(authArgs?: AuthArgs): Promise<string | undefined>;\n}\n\n/**\n * A wrapper around the Nylas Identity session that implements the NylasApiRequest interface.\n * This class is used by the Nylas Web Elements to make requests to the Nylas API if no custom\n * implementation of NylasApiRequest is provided.\n */\nexport class NylasIdentityRequestWrapper implements NylasApiRequest {\n  /**\n   * The Nylas Identity session instance.\n   */\n  private session: NylasSessions;\n\n  /**\n   * The grant_id to use for requests, if there is multi-account support\n   * enabled in the Nylas Identity settings.\n   */\n  private activeGrantId?: string;\n\n  /**\n   * The default authentication arguments to use when authenticating the user.\n   */\n  private defaultAuthArgs: AuthArgs[] = [];\n\n  /**\n   * Constructor for the NylasIdentityRequestWrapper class.\n   * @param session The Nylas Identity session instance.\n   */\n  constructor(session: NylasSessions) {\n    this.session = session;\n  }\n\n  /**\n   * This method sets the grant_id to use for requests.\n   * This is used when there is multi-account support enabled in the Nylas Identity settings.\n   *\n   * @param grantId\n   */\n  setActiveGrantId(grantId: string) {\n    this.activeGrantId = grantId;\n  }\n\n  /**\n   * This method makes a request to the Nylas API, using the Nylas Identity's fetch method.\n   *\n   * The `grants/me/` prefix is added because all requests made from the browser to the Nylas API\n   * must be made on behalf of the currently logged in user with a valid access token.\n   *\n   * @param NylasRequestArgs\n   * @returns Promise<[T | null, NylasErrorResponse['error'] | null]>\n   */\n  async request<T>({ method, path, body, headers }: NylasRequestArgs): Promise<DataResponseReturnType<T>> {\n    try {\n      const response = await this.session.fetch(`grants/me/${path}`, {\n        method,\n        headers: headers ? new Headers(headers) : undefined,\n        body,\n        ...(this.session.isMultiAccount() && this.activeGrantId ? { grant_id: this.activeGrantId } : {}),\n      });\n\n      // Sometimes the Nylas identity session fetch method returns undefined.\n      // Possibly due to CORS issues. In this case, we throw an error.\n      if (typeof response === 'undefined') {\n        throw new Error('Response is undefined');\n      }\n\n      return dataResponse(response as T);\n    } catch (error: any) {\n      const errorStr = String(error);\n      let errorMessage = errorStr;\n      if (errorStr.includes('Access token not found') || errorStr.includes('invalid_grant') || errorStr.includes('token expired') || errorStr.includes('unauthorized')) {\n        errorMessage = 'Your session has expired. Please log in again to continue.';\n        setTimeout(() => {\n          localStorage.removeItem('grant');\n          localStorage.removeItem('user');\n          window.location.reload();\n        }, 3000);\n      }\n      return dataResponse(null as T, {\n        message: errorMessage,\n      });\n    }\n  }\n\n  /**\n   * This method returns the current (logged in) user's information.\n   * If the user is not logged in, it returns null.\n   * @returns Promise<User | null>\n   */\n  async currentUser(): Promise<User | null> {\n    const grantId = this.session.isMultiAccount() ? this.activeGrantId : undefined;\n    const idToken = await this.session.getProfile(grantId);\n    // If the user is not logged in, we can't get the grant (no access token)\n    if (await this.session.isLoggedIn()) {\n      const grantResponse = await this.session.fetch(`grants/me`, {\n        method: 'GET',\n        ...(this.session.isMultiAccount() && this.activeGrantId ? { grant_id: this.activeGrantId } : {}),\n      });\n      const grant = grantResponse.data;\n\n      if (!idToken || !grant) {\n        return null;\n      }\n\n      const grantEmail = grant.email;\n      return {\n        id: idToken.sub,\n        email: grantEmail,\n        name: idToken.name,\n        provider: idToken.provider,\n      };\n    }\n\n    return null;\n  }\n\n  /**\n   * This method returns the URL to redirect the user to for authentication.\n   * @param authConfig authArgs\n   * @returns Promise<string | undefined>\n   */\n  async authenticationUrl(authArgs?: AuthArgs): Promise<string | undefined> {\n    const provider = authArgs?.provider || 'google';\n    const defaultArgs = this.defaultAuthArgs.find(args => args.provider === provider);\n    let args = defaultArgs || {};\n\n    if (authArgs) {\n      args = { ...args, ...authArgs };\n    }\n    return this.session.auth(args);\n  }\n\n  /**\n   * This method sets the default authentication arguments to use when authenticating the user.\n   * @param authArgs authArgs\n   */\n  setDefaultAuthArgs(authArgs: AuthArgs[]) {\n    this.defaultAuthArgs = authArgs;\n  }\n}\n"],"version":3}
+{"file":"p-Bye3Di82.js","mappings":"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","names":[],"sources":["src/common/nylas-api-request.ts"],"sourcesContent":["import { dataResponse } from '@/utils/utils';\nimport type { NylasSessions } from '@nylas/identity';\nimport { DataResponseReturnType } from './types';\n\n/**\n * Arguments for making a request to the Nylas API.\n */\nexport type NylasRequestArgs = {\n  method: 'GET' | 'POST' | 'PUT' | 'DELETE' | 'PATCH';\n  path: string;\n  body?: any;\n  headers?: Record<string, string>;\n};\n\n/**\n * A model representing a user in the Nylas Identity system.\n */\nexport type User = {\n  id: string;\n  email: string;\n  name?: string;\n  provider?: string;\n};\n\n/**\n * Arguments for authenticating a user with the Nylas Identity system.\n */\nexport type AuthArgs = {\n  /**\n   * The provider of the user's email address.\n   */\n  provider?: string;\n  /**\n   * A list of permission scopes for the provider.\n   */\n  scope?: Array<string>;\n  /**\n   * The login hint associated with the user.\n   */\n  loginHint?: string;\n  /**\n   * Whether to include grant scopes in the auth exchange.\n   */\n  includeGrantScopes?: boolean;\n  prompt?: string;\n  metadata?: string;\n  state?: string;\n};\n\n/**\n * Interface for making requests to the Nylas API.\n *\n * This is an abstract class that is meant to be implemented by customers to provide their own\n * implementation of making requests to the Nylas API. This allows customers to use their own\n * authentication mechanism, or to use a different HTTP client library.\n */\nexport abstract class NylasApiRequest {\n  /**\n   * This method should make an authenticated request to the Nylas API.\n   * Note: It should not throw an error if the request fails, but should return an object with the error\n   * information as part of the tuple returned.\n   * @param args NylasRequestArgs\n   */\n  abstract request<T = any>(args: NylasRequestArgs): Promise<DataResponseReturnType<T>>;\n\n  /**\n   * This method should return the current user's information.\n   */\n\n  abstract currentUser(): Promise<User | null>;\n\n  /**\n   * This method should set the default authentication arguments to use when authenticating the user.\n   */\n  abstract setDefaultAuthArgs(authArgs: AuthArgs[]): void;\n\n  /**\n   * This method should return the URL to redirect the user to for authentication.\n   */\n  abstract authenticationUrl(authArgs?: AuthArgs): Promise<string | undefined>;\n}\n\n/**\n * A wrapper around the Nylas Identity session that implements the NylasApiRequest interface.\n * This class is used by the Nylas Web Elements to make requests to the Nylas API if no custom\n * implementation of NylasApiRequest is provided.\n */\nexport class NylasIdentityRequestWrapper implements NylasApiRequest {\n  /**\n   * The Nylas Identity session instance.\n   */\n  private session: NylasSessions;\n\n  /**\n   * The grant_id to use for requests, if there is multi-account support\n   * enabled in the Nylas Identity settings.\n   */\n  private activeGrantId?: string;\n\n  /**\n   * The default authentication arguments to use when authenticating the user.\n   */\n  private defaultAuthArgs: AuthArgs[] = [];\n\n  /**\n   * Constructor for the NylasIdentityRequestWrapper class.\n   * @param session The Nylas Identity session instance.\n   */\n  constructor(session: NylasSessions) {\n    this.session = session;\n  }\n\n  /**\n   * This method sets the grant_id to use for requests.\n   * This is used when there is multi-account support enabled in the Nylas Identity settings.\n   *\n   * @param grantId\n   */\n  setActiveGrantId(grantId: string) {\n    this.activeGrantId = grantId;\n  }\n\n  /**\n   * This method makes a request to the Nylas API, using the Nylas Identity's fetch method.\n   *\n   * The `grants/me/` prefix is added because all requests made from the browser to the Nylas API\n   * must be made on behalf of the currently logged in user with a valid access token.\n   *\n   * @param NylasRequestArgs\n   * @returns Promise<[T | null, NylasErrorResponse['error'] | null]>\n   */\n  async request<T>({ method, path, body, headers }: NylasRequestArgs): Promise<DataResponseReturnType<T>> {\n    try {\n      const response = await this.session.fetch(`grants/me/${path}`, {\n        method,\n        headers: headers ? new Headers(headers) : undefined,\n        body,\n        ...(this.session.isMultiAccount() && this.activeGrantId ? { grant_id: this.activeGrantId } : {}),\n      });\n\n      // Sometimes the Nylas identity session fetch method returns undefined.\n      // Possibly due to CORS issues. In this case, we throw an error.\n      if (typeof response === 'undefined') {\n        throw new Error('Response is undefined');\n      }\n\n      return dataResponse(response as T);\n    } catch (error: any) {\n      const errorStr = String(error);\n      let errorMessage = errorStr;\n      if (errorStr.includes('Access token not found') || errorStr.includes('invalid_grant') || errorStr.includes('token expired') || errorStr.includes('unauthorized')) {\n        errorMessage = 'Your session has expired. Please log in again to continue.';\n        setTimeout(() => {\n          localStorage.removeItem('grant');\n          localStorage.removeItem('user');\n          window.location.reload();\n        }, 3000);\n      }\n      return dataResponse(null as T, {\n        message: errorMessage,\n      });\n    }\n  }\n\n  /**\n   * This method returns the current (logged in) user's information.\n   * If the user is not logged in, it returns null.\n   * @returns Promise<User | null>\n   */\n  async currentUser(): Promise<User | null> {\n    const grantId = this.session.isMultiAccount() ? this.activeGrantId : undefined;\n    const idToken = await this.session.getProfile(grantId);\n    // If the user is not logged in, we can't get the grant (no access token)\n    if (await this.session.isLoggedIn()) {\n      const grantResponse = await this.session.fetch(`grants/me`, {\n        method: 'GET',\n        ...(this.session.isMultiAccount() && this.activeGrantId ? { grant_id: this.activeGrantId } : {}),\n      });\n      const grant = grantResponse.data;\n\n      if (!idToken || !grant) {\n        return null;\n      }\n\n      const grantEmail = grant.email;\n      return {\n        id: idToken.sub,\n        email: grantEmail,\n        name: idToken.name,\n        provider: idToken.provider,\n      };\n    }\n\n    return null;\n  }\n\n  /**\n   * This method returns the URL to redirect the user to for authentication.\n   * @param authConfig authArgs\n   * @returns Promise<string | undefined>\n   */\n  async authenticationUrl(authArgs?: AuthArgs): Promise<string | undefined> {\n    const provider = authArgs?.provider || 'google';\n    const defaultArgs = this.defaultAuthArgs.find(args => args.provider === provider);\n    let args = defaultArgs || {};\n\n    if (authArgs) {\n      args = { ...args, ...authArgs };\n    }\n    return this.session.auth(args);\n  }\n\n  /**\n   * This method sets the default authentication arguments to use when authenticating the user.\n   * @param authArgs authArgs\n   */\n  setDefaultAuthArgs(authArgs: AuthArgs[]) {\n    this.defaultAuthArgs = authArgs;\n  }\n}\n"],"version":3}

package/dist/components/{p-CugpjY9p.js → p-Bzhy3cc5.js}

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, h, F as Fragment, i as Host } from './p-Bht9ktsW.js';
-import { a as debug } from './p-DBE6FcDx.js';
+import { a as debug } from './p-xxFdByBn.js';
 import { d as defineCustomElement$2 } from './p-CzVZs3uZ.js';
 import { d as defineCustomElement$1 } from './p-OhUC7F_g.js';
 
@@ -121,6 +121,6 @@ function defineCustomElement() {
 }
 
 export { NylasNotification as N, defineCustomElement as d };
-//# sourceMappingURL=p-CugpjY9p.js.map
+//# sourceMappingURL=p-Bzhy3cc5.js.map
 
-//# sourceMappingURL=p-CugpjY9p.js.map
+//# sourceMappingURL=p-Bzhy3cc5.js.map

package/dist/components/{p-CugpjY9p.js.map → p-Bzhy3cc5.js.map}

@@ -1 +1 @@
-{"file":"p-CugpjY9p.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/scheduler/nylas-notification/nylas-notification.scss?tag=nylas-notification&encapsulation=shadow","src/components/scheduler/nylas-notification/nylas-notification.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n  display: block;\n  margin-bottom: -12px; // offset for the rounded border\n  width: 100%;\n  z-index: 1;\n  @include default-css-variables;\n}\n.notif {\n  display: flex;\n  padding: 17px;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: 16px;\n  border-radius: var(--nylas-border-radius-2x);\n  border: 1.5px solid var(--nylas-error);\n  background: var(--nylas-base-0);\n\n  @media #{$mobile} {\n    width: auto;\n  }\n  .content {\n    display: flex;\n    flex-direction: row;\n    gap: 8px;\n    .message {\n      font-size: 14px;\n      font-weight: 400;\n      color: var(--nylas-base-800);\n      .title {\n        font-size: 16px;\n        font-weight: 600;\n        color: var(--nylas-base-950);\n        display: block;\n      }\n      .description {\n        font-size: 14px;\n        font-weight: 400;\n        color: var(--nylas-base-800);\n        display: block;\n        word-break: break-word;\n      }\n    }\n    .icon {\n      &.error {\n        color: var(--nylas-error);\n      }\n    }\n  }\n\n  &.error {\n    border-color: var(--nylas-error);\n    background: rgba(255, 248, 248, 1);\n  }\n  &.warning {\n    border-color: var(--nylas-warning);\n  }\n  &.info {\n    border-color: var(--nylas-info);\n  }\n  &.success {\n    border-color: var(--nylas-success);\n  }\n\n  .dismiss-btn {\n    background: none;\n    border: none;\n    color: var(--nylas-base-950);\n    cursor: pointer;\n  }\n}\n","import { Notification } from '@nylas/core';\nimport { Component, Fragment, Host, Listen, Prop, State, h } from '@stencil/core';\nimport { debug } from '@/utils/utils';\nimport { Element } from '@stencil/core';\n\n/**\n * The `nylas-notification` component is a UI component that displays notifications.\n */\n@Component({\n  tag: 'nylas-notification',\n  styleUrl: 'nylas-notification.scss',\n  shadow: true,\n})\nexport class NylasNotification {\n  @Element() host!: HTMLElement;\n\n  /**\n   * The time-to-live for notifications in milliseconds. Set to 'none' to disable auto-dismissal.\n   */\n  @Prop() ttl: number | 'none' = 5000;\n  @Prop() allowedCategories: string[] = ['component', 'api', 'validation', 'invalid_session', 'auth'];\n  @State() notifications: Notification[] = [];\n\n  @Listen('nylasSchedulerError', { target: 'body' })\n  onError(event: CustomEvent<{ notification: Notification; host: HTMLElement }>) {\n    debug(`[nylas-notification] Error: ${event.detail.notification.title}`);\n    this.handleNotification(event);\n  }\n\n  @Listen('nylasSchedulerWarning', { target: 'body' })\n  onWarning(event: CustomEvent<{ notification: Notification; host: HTMLElement }>) {\n    debug(`[nylas-notification] Warning: ${event.detail.notification.title}`);\n    this.handleNotification(event);\n  }\n\n  @Listen('nylasSchedulerInfo', { target: 'body' })\n  onInfo(event: CustomEvent<{ notification: Notification; host: HTMLElement }>) {\n    debug(`[nylas-notification] Info: ${event.detail.notification.title}`);\n    this.handleNotification(event);\n  }\n\n  @Listen('nylasSchedulerSuccess', { target: 'body' })\n  onSuccess(event: CustomEvent<{ notification: Notification; host: HTMLElement }>) {\n    debug(`[nylas-notification] Success: ${event.detail.notification.title}`);\n    this.handleNotification(event);\n  }\n\n  @Listen('dismissNotification', { target: 'body' })\n  onDismissNotification(event: CustomEvent<{ id: string }>) {\n    this.dismissNotification(event.detail.id);\n  }\n\n  @Listen('nylasSchedulerClearNotifications', { target: 'body' })\n  onClearNotifications(event: CustomEvent<{ host: HTMLElement }>) {\n    if (event.detail.host && this.isChildOf(event.detail.host)) {\n      this.notifications = [];\n    }\n  }\n\n  isChildOf(parentHost: HTMLElement): boolean {\n    let parent = this.host.parentNode;\n\n    while (parent) {\n      if (parent === parentHost) {\n        return true;\n      }\n      if (parent instanceof ShadowRoot) {\n        parent = parent.host;\n      } else {\n        parent = parent.parentNode;\n      }\n    }\n\n    return false;\n  }\n\n  private handleNotification(event: CustomEvent<{ notification: Notification; host: HTMLElement }>) {\n    const parentHost = event.detail.host;\n    if (event.defaultPrevented) {\n      debug(`[nylas-notification] Event default prevented`);\n      return;\n    }\n    if (parentHost && !this.isChildOf(parentHost)) {\n      debug(`[nylas-notification] Host not a parent`);\n      return;\n    }\n    if (this.ttl === 0) {\n      debug(`[nylas-notification] TTL is 0`);\n      return;\n    }\n    if (this.allowedCategories.length > 0 && !this.allowedCategories.includes(event.detail.notification.category)) {\n      debug(`[nylas-notification] Category not allowed`);\n      return;\n    }\n    if (this.notifications.find(notif => notif.id === event.detail.notification.id)) {\n      debug(`[nylas-notification] Notification already exists`);\n      return;\n    }\n\n    this.notifications = [...this.notifications, { ...event.detail.notification }];\n    if (event.detail.notification.ttl !== 'none') {\n      const ttl = event.detail.notification.ttl ? event.detail.notification.ttl : (this.ttl as number);\n      window.setTimeout(() => {\n        this.notifications = this.notifications.filter(notif => notif.id !== event.detail.notification.id);\n      }, ttl);\n    }\n  }\n\n  private dismissNotification(id: string) {\n    this.notifications = this.notifications.filter(notif => notif.id !== id);\n  }\n\n  render() {\n    return (\n      <Host>\n        <Fragment>\n          {this.notifications.map(notif => (\n            <div class={`notif ${notif.type}`} key={notif.id}>\n              <div class=\"content\">\n                <span class={`icon ${notif.type}`}>{(notif.type === 'error' || notif.type === 'warning') && <warning-icon />}</span>\n                <span class=\"message\">\n                  <span class=\"title\">{notif.title}</span>\n                  {notif.description && <span class=\"description\">{notif.description}</span>}\n                </span>\n              </div>\n              <button class=\"dismiss-btn\" onClick={() => this.dismissNotification(notif.id)}>\n                <close-icon />\n              </button>\n            </div>\n          ))}\n          <slot />\n        </Fragment>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-Bzhy3cc5.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/scheduler/nylas-notification/nylas-notification.scss?tag=nylas-notification&encapsulation=shadow","src/components/scheduler/nylas-notification/nylas-notification.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n  display: block;\n  margin-bottom: -12px; // offset for the rounded border\n  width: 100%;\n  z-index: 1;\n  @include default-css-variables;\n}\n.notif {\n  display: flex;\n  padding: 17px;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: 16px;\n  border-radius: var(--nylas-border-radius-2x);\n  border: 1.5px solid var(--nylas-error);\n  background: var(--nylas-base-0);\n\n  @media #{$mobile} {\n    width: auto;\n  }\n  .content {\n    display: flex;\n    flex-direction: row;\n    gap: 8px;\n    .message {\n      font-size: 14px;\n      font-weight: 400;\n      color: var(--nylas-base-800);\n      .title {\n        font-size: 16px;\n        font-weight: 600;\n        color: var(--nylas-base-950);\n        display: block;\n      }\n      .description {\n        font-size: 14px;\n        font-weight: 400;\n        color: var(--nylas-base-800);\n        display: block;\n        word-break: break-word;\n      }\n    }\n    .icon {\n      &.error {\n        color: var(--nylas-error);\n      }\n    }\n  }\n\n  &.error {\n    border-color: var(--nylas-error);\n    background: rgba(255, 248, 248, 1);\n  }\n  &.warning {\n    border-color: var(--nylas-warning);\n  }\n  &.info {\n    border-color: var(--nylas-info);\n  }\n  &.success {\n    border-color: var(--nylas-success);\n  }\n\n  .dismiss-btn {\n    background: none;\n    border: none;\n    color: var(--nylas-base-950);\n    cursor: pointer;\n  }\n}\n","import { Notification } from '@nylas/core';\nimport { Component, Fragment, Host, Listen, Prop, State, h } from '@stencil/core';\nimport { debug } from '@/utils/utils';\nimport { Element } from '@stencil/core';\n\n/**\n * The `nylas-notification` component is a UI component that displays notifications.\n */\n@Component({\n  tag: 'nylas-notification',\n  styleUrl: 'nylas-notification.scss',\n  shadow: true,\n})\nexport class NylasNotification {\n  @Element() host!: HTMLElement;\n\n  /**\n   * The time-to-live for notifications in milliseconds. Set to 'none' to disable auto-dismissal.\n   */\n  @Prop() ttl: number | 'none' = 5000;\n  @Prop() allowedCategories: string[] = ['component', 'api', 'validation', 'invalid_session', 'auth'];\n  @State() notifications: Notification[] = [];\n\n  @Listen('nylasSchedulerError', { target: 'body' })\n  onError(event: CustomEvent<{ notification: Notification; host: HTMLElement }>) {\n    debug(`[nylas-notification] Error: ${event.detail.notification.title}`);\n    this.handleNotification(event);\n  }\n\n  @Listen('nylasSchedulerWarning', { target: 'body' })\n  onWarning(event: CustomEvent<{ notification: Notification; host: HTMLElement }>) {\n    debug(`[nylas-notification] Warning: ${event.detail.notification.title}`);\n    this.handleNotification(event);\n  }\n\n  @Listen('nylasSchedulerInfo', { target: 'body' })\n  onInfo(event: CustomEvent<{ notification: Notification; host: HTMLElement }>) {\n    debug(`[nylas-notification] Info: ${event.detail.notification.title}`);\n    this.handleNotification(event);\n  }\n\n  @Listen('nylasSchedulerSuccess', { target: 'body' })\n  onSuccess(event: CustomEvent<{ notification: Notification; host: HTMLElement }>) {\n    debug(`[nylas-notification] Success: ${event.detail.notification.title}`);\n    this.handleNotification(event);\n  }\n\n  @Listen('dismissNotification', { target: 'body' })\n  onDismissNotification(event: CustomEvent<{ id: string }>) {\n    this.dismissNotification(event.detail.id);\n  }\n\n  @Listen('nylasSchedulerClearNotifications', { target: 'body' })\n  onClearNotifications(event: CustomEvent<{ host: HTMLElement }>) {\n    if (event.detail.host && this.isChildOf(event.detail.host)) {\n      this.notifications = [];\n    }\n  }\n\n  isChildOf(parentHost: HTMLElement): boolean {\n    let parent = this.host.parentNode;\n\n    while (parent) {\n      if (parent === parentHost) {\n        return true;\n      }\n      if (parent instanceof ShadowRoot) {\n        parent = parent.host;\n      } else {\n        parent = parent.parentNode;\n      }\n    }\n\n    return false;\n  }\n\n  private handleNotification(event: CustomEvent<{ notification: Notification; host: HTMLElement }>) {\n    const parentHost = event.detail.host;\n    if (event.defaultPrevented) {\n      debug(`[nylas-notification] Event default prevented`);\n      return;\n    }\n    if (parentHost && !this.isChildOf(parentHost)) {\n      debug(`[nylas-notification] Host not a parent`);\n      return;\n    }\n    if (this.ttl === 0) {\n      debug(`[nylas-notification] TTL is 0`);\n      return;\n    }\n    if (this.allowedCategories.length > 0 && !this.allowedCategories.includes(event.detail.notification.category)) {\n      debug(`[nylas-notification] Category not allowed`);\n      return;\n    }\n    if (this.notifications.find(notif => notif.id === event.detail.notification.id)) {\n      debug(`[nylas-notification] Notification already exists`);\n      return;\n    }\n\n    this.notifications = [...this.notifications, { ...event.detail.notification }];\n    if (event.detail.notification.ttl !== 'none') {\n      const ttl = event.detail.notification.ttl ? event.detail.notification.ttl : (this.ttl as number);\n      window.setTimeout(() => {\n        this.notifications = this.notifications.filter(notif => notif.id !== event.detail.notification.id);\n      }, ttl);\n    }\n  }\n\n  private dismissNotification(id: string) {\n    this.notifications = this.notifications.filter(notif => notif.id !== id);\n  }\n\n  render() {\n    return (\n      <Host>\n        <Fragment>\n          {this.notifications.map(notif => (\n            <div class={`notif ${notif.type}`} key={notif.id}>\n              <div class=\"content\">\n                <span class={`icon ${notif.type}`}>{(notif.type === 'error' || notif.type === 'warning') && <warning-icon />}</span>\n                <span class=\"message\">\n                  <span class=\"title\">{notif.title}</span>\n                  {notif.description && <span class=\"description\">{notif.description}</span>}\n                </span>\n              </div>\n              <button class=\"dismiss-btn\" onClick={() => this.dismissNotification(notif.id)}>\n                <close-icon />\n              </button>\n            </div>\n          ))}\n          <slot />\n        </Fragment>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-S6AbMZpH.js → p-C1IR0LII.js}

@@ -1,21 +1,21 @@
 import { p as proxyCustomElement, H, e as createEvent, h, i as Host } from './p-Bht9ktsW.js';
-import { R as RegisterComponent } from './p-CdMky78w.js';
-import { a as debug } from './p-DBE6FcDx.js';
-import { i as instance } from './p-CFk78OEk.js';
+import { R as RegisterComponent } from './p-jHq8WTky.js';
+import { a as debug } from './p-xxFdByBn.js';
+import { i as instance } from './p-BjxQTsOy.js';
 import { d as defineCustomElement$g } from './p-BVH0Klhu.js';
 import { d as defineCustomElement$f } from './p-ao6VxuAL.js';
 import { d as defineCustomElement$e } from './p-BoUo2hc7.js';
 import { d as defineCustomElement$d } from './p-CvLWbTI_.js';
 import { d as defineCustomElement$c } from './p-d3kelm3z.js';
-import { d as defineCustomElement$b } from './p-elpxqGIV.js';
+import { d as defineCustomElement$b } from './p-cIIaCJPC.js';
 import { d as defineCustomElement$a } from './p-BF0muZ9G.js';
 import { d as defineCustomElement$9 } from './p-C7ZpwRD0.js';
-import { d as defineCustomElement$8 } from './p-D8Qul6Vu.js';
+import { d as defineCustomElement$8 } from './p-DBEvFYf0.js';
 import { d as defineCustomElement$7 } from './p-DPwhlVlN.js';
 import { d as defineCustomElement$6 } from './p-jBYg7WMS.js';
 import { d as defineCustomElement$5 } from './p-DBHtQK2b.js';
 import { d as defineCustomElement$4 } from './p-wphqTozF.js';
-import { d as defineCustomElement$3 } from './p-B-fT9puv.js';
+import { d as defineCustomElement$3 } from './p-CKPYi9FX.js';
 import { d as defineCustomElement$2 } from './p-DxDoo-4C.js';
 import { d as defineCustomElement$1 } from './p-BrOgWk7y.js';
 
@@ -401,6 +401,6 @@ function defineCustomElement() {
 }
 
 export { NylasReminderEmails as N, defineCustomElement as d };
-//# sourceMappingURL=p-S6AbMZpH.js.map
+//# sourceMappingURL=p-C1IR0LII.js.map
 
-//# sourceMappingURL=p-S6AbMZpH.js.map
+//# sourceMappingURL=p-C1IR0LII.js.map