@nylas/web-elements 2.4.1 → 2.5.0-canary-20260306042320

package/dist/components/{p-DPClTQN0.js → p-BRjK4HIS.js}

@@ -1,12 +1,12 @@
 import { p as proxyCustomElement, H, e as createEvent, h, i as Host } from './p-Bht9ktsW.js';
 import { R as RegisterComponent } from './p-CwtW7XIp.js';
 import { a as debug, b as instance } from './p-B5ZLsN-l.js';
-import { d as defineCustomElement$6 } from './p-Dvm3cFRX.js';
-import { d as defineCustomElement$5 } from './p-DHEweiQ6.js';
-import { d as defineCustomElement$4 } from './p-DAvS1ihh.js';
-import { d as defineCustomElement$3 } from './p-hYRQCAHR.js';
-import { d as defineCustomElement$2 } from './p-MHQuGZu-.js';
-import { d as defineCustomElement$1 } from './p-Hj9jbKPX.js';
+import { d as defineCustomElement$6 } from './p-BVH0Klhu.js';
+import { d as defineCustomElement$5 } from './p-CzVZs3uZ.js';
+import { d as defineCustomElement$4 } from './p-d3kelm3z.js';
+import { d as defineCustomElement$3 } from './p-C7ZpwRD0.js';
+import { d as defineCustomElement$2 } from './p-DoJYki91.js';
+import { d as defineCustomElement$1 } from './p-DxDoo-4C.js';
 
 const nylasFeedbackFormCss = ":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}.card-wrapper{background:var(--nylas-base-0);display:flex;flex-direction:column;font-family:var(--nylas-font-family);background-color:var(--nylas-base-0);color:var(--nylas-base-900);border-radius:var(--nylas-border-radius-3x);position:relative;padding:32px;width:562px;box-shadow:0px 1px 4px rgba(0, 0, 0, 0.1), 0px 3px 6px rgba(0, 0, 0, 0.06)}@media screen and (max-width: 768px){.card-wrapper{width:100%;border-radius:0px}}.header{overflow-wrap:anywhere;display:flex;flex-direction:column;font-size:16px;font-weight:400}.header h2{color:var(--nylas-base-900);font-size:24px;font-weight:600;text-align:left;margin:0}.description.title-desc{margin-bottom:2rem}.description.footer-desc{margin-top:2rem}.description.footer-desc a{color:var(--nylas-primary);text-decoration:none}.description p{margin:0;font-size:18px;color:var(--nylas-base-600)}.footer{margin-top:1rem;padding-top:1rem;display:flex;justify-content:flex-end;gap:0.5rem;box-sizing:border-box;background-color:var(--nylas-base-25);width:100%;border-radius:0 0 var(--nylas-border-radius-2x) var(--nylas-border-radius-2x)}.close-button{width:100%;display:flex;justify-content:flex-end}.close-button button-component button{padding:0;height:auto}.close-button button-component button:hover{background-color:transparent !important}button-component{--dot-color:var(--nylas-base-700)}";
 
@@ -79,9 +79,9 @@ const NylasFeedbackForm = proxyCustomElement(class NylasFeedbackForm extends H {
         this.feedbackModalClosed.emit();
     }
     render() {
-        return (h(Host, { key: '52a1dc4a541ff7ea02420e16343c8f2a85c16091', part: "nfbf" }, h("div", { key: '1c967a172263e1325a6ef42453c5cc404fe904a1', class: "card-wrapper", part: "nfbfc__card" }, h("div", { key: '713cb4b1d26adee24b8ce50326003c0c4495dba2', class: "close-button" }, h("button-component", { key: '658239c2e0ad2142a8af5deb8a6bf389e18c8aa1', tooltip: "Close", id: "close", variant: 'invisible', onClick: e => this.closeModal(e), part: "nfbf__close-button" }, h("close-icon", { key: '2e1f9d13c9b0407c43630309a56130ba7623e1e7' }))), h("div", { key: 'd27eb423845ada65612d5668e73b694142e9d3f8', class: "header" }, h("h2", { key: '3349f51aaa776ce68d072d0517ab3689d9c50d12', slot: "card-title", part: "nfbf__title" }, instance.t('feedbackFormTitle'))), h("div", { key: '57e0dd0752e1f92b8179e84d441c724ceb8f39af', class: "description title-desc" }, h("p", { key: 'cf7e227f99f83ba9921db6354cdb3b837c933a3f' }, instance.t('feedbackFormDescription'))), h("textarea-component", { key: '7f29b841cf6a36c1336c35a4d7ab91dd88bf8d0a', label: instance.t('feedbackMessageLabel'), required: true, maxLength: 500, part: "nfbf__description", name: "feedback", placeholder: instance.t('feedbackMessagePlaceholder') }), h("div", { key: '4db6e0def2da7da8283e4c290fbb87c79103d54f', class: 'description footer-desc' }, h("p", { key: '1c30fa85b3cb6b1689b663148d4a4f7a099ba3ca' }, "By sending this report, you agree to Nylas\u2019 access to the data necessary to respond to this issue, subject to Nylas\u2019", ' ', h("a", { key: '342a115c725419ddc971be46fbbc9a3c4dbb147a', href: "https://www.nylas.com/privacy-policy/", target: "_blank", rel: "nofollow noreferrer noopener" }, "Privacy Policy"), ".")), h("div", { key: 'e62b4a2d4fa196e64f9b14fef1579629bdf8879a', class: {
+        return (h(Host, { key: 'dd8583c0ff54efe7e2a560ae93d499d4bf6f2ff1', part: "nfbf" }, h("div", { key: '90fea0a4b8670345075efb3c20f08497c7d58b10', class: "card-wrapper", part: "nfbfc__card" }, h("div", { key: '4229209b5c3f703d9bd54760df7a0cb3c61115a5', class: "close-button" }, h("button-component", { key: '0c18bfb08ae7655d29ada898e70a9f0074029924', tooltip: "Close", id: "close", variant: 'invisible', onClick: e => this.closeModal(e), part: "nfbf__close-button" }, h("close-icon", { key: '2b7f378449fd6d021b1f553b90c67b56a16849c5' }))), h("div", { key: 'fbbad7a34a8d5c8aa7968686c99a8903c962d749', class: "header" }, h("h2", { key: '1f5ea51f53a0d552a52132e8b7d50c31bf05abc9', slot: "card-title", part: "nfbf__title" }, instance.t('feedbackFormTitle'))), h("div", { key: '4b181480d2f5d956dafc4a98d6b6160d8c5f8b14', class: "description title-desc" }, h("p", { key: 'daca2ee189bab0951136385375ac8238c3889803' }, instance.t('feedbackFormDescription'))), h("textarea-component", { key: '69e5628b84312e4845f400878fcc4e35f436115e', label: instance.t('feedbackMessageLabel'), required: true, maxLength: 500, part: "nfbf__description", name: "feedback", placeholder: instance.t('feedbackMessagePlaceholder') }), h("div", { key: 'ae58150777756daaf26d08c6a21febea777ca07a', class: 'description footer-desc' }, h("p", { key: 'a490962defbd31973e69eb791160e9064f6c8326' }, "By sending this report, you agree to Nylas\u2019 access to the data necessary to respond to this issue, subject to Nylas\u2019", ' ', h("a", { key: 'c7235f21e6301f5489d362aa50bef6d46bf8c256', href: "https://www.nylas.com/privacy-policy/", target: "_blank", rel: "nofollow noreferrer noopener" }, "Privacy Policy"), ".")), h("div", { key: '11557b6f4a548c2afaedc501772a2edf6e08f4c5', class: {
                 footer: true,
-            } }, h("button-component", { key: 'cf907af50d0065b20437b6f19d58043d377a2fc1', variant: 'invisible', onClick: e => this.closeModal(e), part: "nfbf__button-outline nfbf__cancel-cta" }, `${instance.t('feedbackModalCloseButton')}`), h("button-component", { key: 'cc43a06033361a839f58f29d73b25834a3c4eed7', variant: 'primary', onClick: this.handleConfirmBookingButtonClicked, part: "nfbf__button-outline nfbf__reschedule-cta" }, `${instance.t('feedbackModalSubmitButton')}`)))));
+            } }, h("button-component", { key: '11779b6aa43a5430e9a55c3cc48e5cfc8a026ccf', variant: 'invisible', onClick: e => this.closeModal(e), part: "nfbf__button-outline nfbf__cancel-cta" }, `${instance.t('feedbackModalCloseButton')}`), h("button-component", { key: 'd1a8f14239b7d72e6b25c80cdb055af953fd8b9a', variant: 'primary', onClick: this.handleConfirmBookingButtonClicked, part: "nfbf__button-outline nfbf__reschedule-cta" }, `${instance.t('feedbackModalSubmitButton')}`)))));
     }
     get host() { return this; }
     static get style() { return nylasFeedbackFormCss; }
@@ -149,6 +149,6 @@ function defineCustomElement() {
 }
 
 export { NylasFeedbackForm as N, defineCustomElement as d };
-//# sourceMappingURL=p-DPClTQN0.js.map
+//# sourceMappingURL=p-BRjK4HIS.js.map
 
-//# sourceMappingURL=p-DPClTQN0.js.map
+//# sourceMappingURL=p-BRjK4HIS.js.map

package/dist/components/{p-DPClTQN0.js.map → p-BRjK4HIS.js.map}

@@ -1 +1 @@
-{"file":"p-DPClTQN0.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","i18next"],"sources":["src/components/scheduler/nylas-feedback-form/nylas-feedback-form.scss?tag=nylas-feedback-form&encapsulation=shadow","src/components/scheduler/nylas-feedback-form/nylas-feedback-form.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n  display: block;\n  @include default-css-variables;\n}\n\n.card-wrapper {\n  background: var(--nylas-base-0);\n  display: flex;\n  flex-direction: column;\n  font-family: var(--nylas-font-family);\n  background-color: var(--nylas-base-0);\n  color: var(--nylas-base-900);\n  border-radius: var(--nylas-border-radius-3x);\n  position: relative;\n  padding: 32px;\n  width: 562px;\n  box-shadow:\n    0px 1px 4px rgba(0, 0, 0, 0.1),\n    0px 3px 6px rgba(0, 0, 0, 0.06);\n\n  @media #{$mobile} {\n    width: 100%;\n    border-radius: 0px;\n  }\n}\n\n.header {\n  overflow-wrap: anywhere;\n  display: flex;\n  flex-direction: column;\n  font-size: 16px;\n  font-weight: 400;\n\n  h2 {\n    color: var(--nylas-base-900);\n    font-size: 24px;\n    font-weight: 600;\n    text-align: left;\n    margin: 0;\n  }\n}\n\n.description {\n  &.title-desc {\n    margin-bottom: 2rem;\n  }\n\n  &.footer-desc {\n    margin-top: 2rem;\n\n    a {\n      color: var(--nylas-primary);\n      text-decoration: none;\n    }\n  }\n\n  p {\n    margin: 0;\n    font-size: 18px;\n    color: var(--nylas-base-600);\n  }\n}\n\n.footer {\n  margin-top: 1rem;\n  padding-top: 1rem;\n  display: flex;\n  justify-content: flex-end;\n  gap: 0.5rem;\n  box-sizing: border-box;\n  background-color: var(--nylas-base-25);\n  width: 100%;\n  border-radius: 0 0 var(--nylas-border-radius-2x) var(--nylas-border-radius-2x);\n}\n\n.close-button {\n  width: 100%;\n  display: flex;\n  justify-content: flex-end;\n\n  button-component {\n    button {\n      padding: 0;\n      height: auto;\n\n      &:hover {\n        background-color: transparent !important;\n      }\n    }\n  }\n}\n\nbutton-component {\n  --dot-color: var(--nylas-base-700);\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { Component, Element, EventEmitter, h, Host, Listen, Prop, State } from '@stencil/core';\nimport { NylasSchedulerConnector } from '../../..';\nimport { NylasScheduling } from '../nylas-scheduling/nylas-scheduling';\nimport { debug } from '@/utils/utils';\nimport { Event } from '@stencil/core';\nimport i18next from '@/utils/i18n';\nimport { ThemeConfig } from '@nylas/core';\n\n/**\n * The `nylas-feedback-form` component is a UI component that displays the booked event card.\n *\n * @part nfbf - The booked event card host.\n * @part nfbf__card - The booked event card.\n * @part nfbf__title - The title of the booked event card.\n * @part nfbf__description - The description of the booked event card.\n * @part nfbf__button-outline - The cancel & reschedule button CTA.\n * @part nfbf__cancel-cta - The cancel button CTA.\n * @part nfbf__reschedule-cta - The reschedule button CTA.\n */\n@Component({\n  tag: 'nylas-feedback-form',\n  styleUrl: 'nylas-feedback-form.scss',\n  shadow: true,\n})\nexport class NylasFeedbackForm {\n  /**\n   * The host element.\n   */\n  @Element() host!: HTMLNylasFeedbackFormElement;\n  /**\n   * @standalone\n   * The theme configuration.\n   */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: any;\n\n  /**\n   * Feedback modal close event.\n   */\n  @Event() readonly feedbackModalClosed!: EventEmitter<void>;\n\n  /**\n   * Feedback submitted event.\n   */\n  @Event() readonly feedbackSubmitted!: EventEmitter<{ feedback: string }>;\n\n  /**\n   * This is an internal event that is used to trigger validation on the form.\n   */\n  @Event() readonly triggerValidation!: EventEmitter<void>;\n\n  /**\n   * The state to hold the feedback message.\n   */\n  @State() feedbackMessage: 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.host.setAttribute('data-themed', '');\n      }\n    });\n  }\n\n  disconnectedCallback() {}\n\n  async componentWillLoad() {\n    debug(`[nylas-feedback-form] Component will load`);\n  }\n\n  async componentDidLoad() {\n    debug(`[nylas-feedback-form] Component did load`);\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', { target: 'document' })\n  handleFormInputChanged(event: CustomEvent<{ name: string; value: string }>) {\n    debug(`[nylas-feedback-form] Form input changed`);\n    if (!event.detail.value) {\n      return;\n    }\n    this.triggerValidation.emit();\n    if (event.detail.name === 'feedback') {\n      this.feedbackMessage = event.detail.value;\n    }\n  }\n\n  private handleConfirmBookingButtonClicked = () => {\n    // TODO: Implement feedback submission\n    const validationEvent = this.triggerValidation.emit();\n    if (validationEvent.defaultPrevented) {\n      return;\n    }\n    this.feedbackSubmitted.emit({ feedback: this.feedbackMessage });\n  };\n\n  private closeModal(e: Event) {\n    e.preventDefault();\n    e.stopImmediatePropagation();\n    this.feedbackModalClosed.emit();\n  }\n\n  @RegisterComponent<NylasFeedbackForm, NylasSchedulerConnector, Exclude<NylasScheduling['stores'], undefined>>({\n    name: 'nylas-feedback-form',\n    stateToProps: new Map([]),\n    eventToProps: {\n      feedbackSubmitted: async (_event: CustomEvent<{ feedback: string }>, _nylasSchedulerConnector: NylasSchedulerConnector) => {\n        // TODO: Implement feedback submission\n      },\n    },\n    localPropsToProp: new Map([['themeConfig', 'themeConfig']]),\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host part=\"nfbf\">\n        <div class=\"card-wrapper\" part=\"nfbfc__card\">\n          <div class=\"close-button\">\n            <button-component tooltip=\"Close\" id=\"close\" variant={'invisible'} onClick={e => this.closeModal(e)} part=\"nfbf__close-button\">\n              <close-icon />\n            </button-component>\n          </div>\n          <div class=\"header\">\n            <h2 slot=\"card-title\" part=\"nfbf__title\">\n              {i18next.t('feedbackFormTitle')}\n            </h2>\n          </div>\n          <div class=\"description title-desc\">\n            <p>{i18next.t('feedbackFormDescription')}</p>\n          </div>\n          <textarea-component\n            label={i18next.t('feedbackMessageLabel')}\n            required={true}\n            maxLength={500}\n            part=\"nfbf__description\"\n            name=\"feedback\"\n            placeholder={i18next.t('feedbackMessagePlaceholder')}\n          />\n          <div class={'description footer-desc'}>\n            <p>\n              By sending this report, you agree to Nylas’ access to the data necessary to respond to this issue, subject to Nylas’{' '}\n              <a href=\"https://www.nylas.com/privacy-policy/\" target=\"_blank\" rel=\"nofollow noreferrer noopener\">\n                Privacy Policy\n              </a>\n              .\n            </p>\n          </div>\n          <div\n            class={{\n              footer: true,\n            }}\n          >\n            <button-component variant={'invisible'} onClick={e => this.closeModal(e)} part=\"nfbf__button-outline nfbf__cancel-cta\">\n              {`${i18next.t('feedbackModalCloseButton')}`}\n            </button-component>\n            <button-component variant={'primary'} onClick={this.handleConfirmBookingButtonClicked} part=\"nfbf__button-outline nfbf__reschedule-cta\">\n              {`${i18next.t('feedbackModalSubmitButton')}`}\n            </button-component>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-BRjK4HIS.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","i18next"],"sources":["src/components/scheduler/nylas-feedback-form/nylas-feedback-form.scss?tag=nylas-feedback-form&encapsulation=shadow","src/components/scheduler/nylas-feedback-form/nylas-feedback-form.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n  display: block;\n  @include default-css-variables;\n}\n\n.card-wrapper {\n  background: var(--nylas-base-0);\n  display: flex;\n  flex-direction: column;\n  font-family: var(--nylas-font-family);\n  background-color: var(--nylas-base-0);\n  color: var(--nylas-base-900);\n  border-radius: var(--nylas-border-radius-3x);\n  position: relative;\n  padding: 32px;\n  width: 562px;\n  box-shadow:\n    0px 1px 4px rgba(0, 0, 0, 0.1),\n    0px 3px 6px rgba(0, 0, 0, 0.06);\n\n  @media #{$mobile} {\n    width: 100%;\n    border-radius: 0px;\n  }\n}\n\n.header {\n  overflow-wrap: anywhere;\n  display: flex;\n  flex-direction: column;\n  font-size: 16px;\n  font-weight: 400;\n\n  h2 {\n    color: var(--nylas-base-900);\n    font-size: 24px;\n    font-weight: 600;\n    text-align: left;\n    margin: 0;\n  }\n}\n\n.description {\n  &.title-desc {\n    margin-bottom: 2rem;\n  }\n\n  &.footer-desc {\n    margin-top: 2rem;\n\n    a {\n      color: var(--nylas-primary);\n      text-decoration: none;\n    }\n  }\n\n  p {\n    margin: 0;\n    font-size: 18px;\n    color: var(--nylas-base-600);\n  }\n}\n\n.footer {\n  margin-top: 1rem;\n  padding-top: 1rem;\n  display: flex;\n  justify-content: flex-end;\n  gap: 0.5rem;\n  box-sizing: border-box;\n  background-color: var(--nylas-base-25);\n  width: 100%;\n  border-radius: 0 0 var(--nylas-border-radius-2x) var(--nylas-border-radius-2x);\n}\n\n.close-button {\n  width: 100%;\n  display: flex;\n  justify-content: flex-end;\n\n  button-component {\n    button {\n      padding: 0;\n      height: auto;\n\n      &:hover {\n        background-color: transparent !important;\n      }\n    }\n  }\n}\n\nbutton-component {\n  --dot-color: var(--nylas-base-700);\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { Component, Element, EventEmitter, h, Host, Listen, Prop, State } from '@stencil/core';\nimport { NylasSchedulerConnector } from '../../..';\nimport { NylasScheduling } from '../nylas-scheduling/nylas-scheduling';\nimport { debug } from '@/utils/utils';\nimport { Event } from '@stencil/core';\nimport i18next from '@/utils/i18n';\nimport { ThemeConfig } from '@nylas/core';\n\n/**\n * The `nylas-feedback-form` component is a UI component that displays the booked event card.\n *\n * @part nfbf - The booked event card host.\n * @part nfbf__card - The booked event card.\n * @part nfbf__title - The title of the booked event card.\n * @part nfbf__description - The description of the booked event card.\n * @part nfbf__button-outline - The cancel & reschedule button CTA.\n * @part nfbf__cancel-cta - The cancel button CTA.\n * @part nfbf__reschedule-cta - The reschedule button CTA.\n */\n@Component({\n  tag: 'nylas-feedback-form',\n  styleUrl: 'nylas-feedback-form.scss',\n  shadow: true,\n})\nexport class NylasFeedbackForm {\n  /**\n   * The host element.\n   */\n  @Element() host!: HTMLNylasFeedbackFormElement;\n  /**\n   * @standalone\n   * The theme configuration.\n   */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: any;\n\n  /**\n   * Feedback modal close event.\n   */\n  @Event() readonly feedbackModalClosed!: EventEmitter<void>;\n\n  /**\n   * Feedback submitted event.\n   */\n  @Event() readonly feedbackSubmitted!: EventEmitter<{ feedback: string }>;\n\n  /**\n   * This is an internal event that is used to trigger validation on the form.\n   */\n  @Event() readonly triggerValidation!: EventEmitter<void>;\n\n  /**\n   * The state to hold the feedback message.\n   */\n  @State() feedbackMessage: 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.host.setAttribute('data-themed', '');\n      }\n    });\n  }\n\n  disconnectedCallback() {}\n\n  async componentWillLoad() {\n    debug(`[nylas-feedback-form] Component will load`);\n  }\n\n  async componentDidLoad() {\n    debug(`[nylas-feedback-form] Component did load`);\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', { target: 'document' })\n  handleFormInputChanged(event: CustomEvent<{ name: string; value: string }>) {\n    debug(`[nylas-feedback-form] Form input changed`);\n    if (!event.detail.value) {\n      return;\n    }\n    this.triggerValidation.emit();\n    if (event.detail.name === 'feedback') {\n      this.feedbackMessage = event.detail.value;\n    }\n  }\n\n  private handleConfirmBookingButtonClicked = () => {\n    // TODO: Implement feedback submission\n    const validationEvent = this.triggerValidation.emit();\n    if (validationEvent.defaultPrevented) {\n      return;\n    }\n    this.feedbackSubmitted.emit({ feedback: this.feedbackMessage });\n  };\n\n  private closeModal(e: Event) {\n    e.preventDefault();\n    e.stopImmediatePropagation();\n    this.feedbackModalClosed.emit();\n  }\n\n  @RegisterComponent<NylasFeedbackForm, NylasSchedulerConnector, Exclude<NylasScheduling['stores'], undefined>>({\n    name: 'nylas-feedback-form',\n    stateToProps: new Map([]),\n    eventToProps: {\n      feedbackSubmitted: async (_event: CustomEvent<{ feedback: string }>, _nylasSchedulerConnector: NylasSchedulerConnector) => {\n        // TODO: Implement feedback submission\n      },\n    },\n    localPropsToProp: new Map([['themeConfig', 'themeConfig']]),\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host part=\"nfbf\">\n        <div class=\"card-wrapper\" part=\"nfbfc__card\">\n          <div class=\"close-button\">\n            <button-component tooltip=\"Close\" id=\"close\" variant={'invisible'} onClick={e => this.closeModal(e)} part=\"nfbf__close-button\">\n              <close-icon />\n            </button-component>\n          </div>\n          <div class=\"header\">\n            <h2 slot=\"card-title\" part=\"nfbf__title\">\n              {i18next.t('feedbackFormTitle')}\n            </h2>\n          </div>\n          <div class=\"description title-desc\">\n            <p>{i18next.t('feedbackFormDescription')}</p>\n          </div>\n          <textarea-component\n            label={i18next.t('feedbackMessageLabel')}\n            required={true}\n            maxLength={500}\n            part=\"nfbf__description\"\n            name=\"feedback\"\n            placeholder={i18next.t('feedbackMessagePlaceholder')}\n          />\n          <div class={'description footer-desc'}>\n            <p>\n              By sending this report, you agree to Nylas’ access to the data necessary to respond to this issue, subject to Nylas’{' '}\n              <a href=\"https://www.nylas.com/privacy-policy/\" target=\"_blank\" rel=\"nofollow noreferrer noopener\">\n                Privacy Policy\n              </a>\n              .\n            </p>\n          </div>\n          <div\n            class={{\n              footer: true,\n            }}\n          >\n            <button-component variant={'invisible'} onClick={e => this.closeModal(e)} part=\"nfbf__button-outline nfbf__cancel-cta\">\n              {`${i18next.t('feedbackModalCloseButton')}`}\n            </button-component>\n            <button-component variant={'primary'} onClick={this.handleConfirmBookingButtonClicked} part=\"nfbf__button-outline nfbf__reschedule-cta\">\n              {`${i18next.t('feedbackModalSubmitButton')}`}\n            </button-component>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-S5MMQ3kK.js → p-BSfQxQEN.js}

@@ -10,7 +10,7 @@ const PaintbrushIcon = proxyCustomElement(class PaintbrushIcon extends H {
         this.height = '13';
     }
     render() {
-        return (h("svg", { key: 'aadc869fbe30822d15c0cdbcd39156dfce0d9b2f', width: "16", height: "16", viewBox: "-3 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '7bcf3ef6beb38e78b60e3cf78e7c8bc321294e3b', d: "M0.5 -0.000976562C0.223858 -0.000976562 0 0.222881 0 0.499023L1.90735e-05 9.00337C1.90735e-05 10.1079 0.89545 11.0034 2.00002 11.0034H3.00411V14.0007C3.00411 15.1053 3.89954 16.0007 5.00411 16.0007C6.10868 16.0007 7.00411 15.1053 7.00411 14.0007V11.0034H8.00002C9.10459 11.0034 10 10.1079 10 9.00337V7.50339L10 7.49897V0.499023C10 0.222881 9.77614 -0.000976562 9.5 -0.000976562H0.5ZM1.00002 8.00342H9.00002V9.00337C9.00002 9.55566 8.5523 10.0034 8.00002 10.0034H6.50411C6.22797 10.0034 6.00411 10.2272 6.00411 10.5034V14.0007C6.00411 14.553 5.5564 15.0007 5.00411 15.0007C4.45183 15.0007 4.00411 14.553 4.00411 14.0007V10.5034C4.00411 10.2272 3.78026 10.0034 3.50411 10.0034H2.00002C1.44773 10.0034 1.00002 9.55566 1.00002 9.00337V8.00342ZM9 7.00339H1V0.999023H5V2.49902C5 2.77517 5.22386 2.99902 5.5 2.99902C5.77614 2.99902 6 2.77517 6 2.49902V0.999023H7V3.50122C7 3.77736 7.22386 4.00122 7.5 4.00122C7.77614 4.00122 8 3.77736 8 3.50122V0.999023H9V7.00339Z", fill: "currentColor" })));
+        return (h("svg", { key: '72e8db1652f69eed76fc2ef7ada77408d29a202b', width: "16", height: "16", viewBox: "-3 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'c6e394343bc2de0f1cfd4f81bd7419d9cee96c84', d: "M0.5 -0.000976562C0.223858 -0.000976562 0 0.222881 0 0.499023L1.90735e-05 9.00337C1.90735e-05 10.1079 0.89545 11.0034 2.00002 11.0034H3.00411V14.0007C3.00411 15.1053 3.89954 16.0007 5.00411 16.0007C6.10868 16.0007 7.00411 15.1053 7.00411 14.0007V11.0034H8.00002C9.10459 11.0034 10 10.1079 10 9.00337V7.50339L10 7.49897V0.499023C10 0.222881 9.77614 -0.000976562 9.5 -0.000976562H0.5ZM1.00002 8.00342H9.00002V9.00337C9.00002 9.55566 8.5523 10.0034 8.00002 10.0034H6.50411C6.22797 10.0034 6.00411 10.2272 6.00411 10.5034V14.0007C6.00411 14.553 5.5564 15.0007 5.00411 15.0007C4.45183 15.0007 4.00411 14.553 4.00411 14.0007V10.5034C4.00411 10.2272 3.78026 10.0034 3.50411 10.0034H2.00002C1.44773 10.0034 1.00002 9.55566 1.00002 9.00337V8.00342ZM9 7.00339H1V0.999023H5V2.49902C5 2.77517 5.22386 2.99902 5.5 2.99902C5.77614 2.99902 6 2.77517 6 2.49902V0.999023H7V3.50122C7 3.77736 7.22386 4.00122 7.5 4.00122C7.77614 4.00122 8 3.77736 8 3.50122V0.999023H9V7.00339Z", fill: "currentColor" })));
     }
     static get style() { return iconCss; }
 }, [258, "paintbrush-icon", {
@@ -32,6 +32,6 @@ function defineCustomElement() {
 }
 
 export { PaintbrushIcon as P, defineCustomElement as d };
-//# sourceMappingURL=p-S5MMQ3kK.js.map
+//# sourceMappingURL=p-BSfQxQEN.js.map
 
-//# sourceMappingURL=p-S5MMQ3kK.js.map
+//# sourceMappingURL=p-BSfQxQEN.js.map

package/dist/components/{p-S5MMQ3kK.js.map → p-BSfQxQEN.js.map}

@@ -1 +1 @@
-{"file":"p-S5MMQ3kK.js","mappings":";;AAAA,MAAM,OAAO,GAAG,qCAAqC;;MCOxC,cAAc,GAAAA,kBAAA,CAAA,MAAA,cAAA,SAAAC,CAAA,CAAA;AAL3B,IAAA,WAAA,GAAA;;;AAMU,QAAA,IAAK,CAAA,KAAA,GAAW,IAAI;AACpB,QAAA,IAAM,CAAA,MAAA,GAAW,IAAI;AAY9B;IAVC,MAAM,GAAA;QACJ,QACE,4DAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,YAAY,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,EAAA,EAC7F,CACE,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAC,EAAC,+7BAA+7B,EACj8B,IAAI,EAAC,cAAc,EAAA,CACnB,CACE;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/common/icons/icon.css?tag=paintbrush-icon&encapsulation=scoped","src/common/icons/paintbrush.tsx"],"sourcesContent":[":host {\n  display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'paintbrush-icon',\n  styleUrl: 'icon.css',\n  scoped: true,\n})\nexport class PaintbrushIcon {\n  @Prop() width: string = '16';\n  @Prop() height: string = '13';\n\n  render() {\n    return (\n      <svg width=\"16\" height=\"16\" viewBox=\"-3 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M0.5 -0.000976562C0.223858 -0.000976562 0 0.222881 0 0.499023L1.90735e-05 9.00337C1.90735e-05 10.1079 0.89545 11.0034 2.00002 11.0034H3.00411V14.0007C3.00411 15.1053 3.89954 16.0007 5.00411 16.0007C6.10868 16.0007 7.00411 15.1053 7.00411 14.0007V11.0034H8.00002C9.10459 11.0034 10 10.1079 10 9.00337V7.50339L10 7.49897V0.499023C10 0.222881 9.77614 -0.000976562 9.5 -0.000976562H0.5ZM1.00002 8.00342H9.00002V9.00337C9.00002 9.55566 8.5523 10.0034 8.00002 10.0034H6.50411C6.22797 10.0034 6.00411 10.2272 6.00411 10.5034V14.0007C6.00411 14.553 5.5564 15.0007 5.00411 15.0007C4.45183 15.0007 4.00411 14.553 4.00411 14.0007V10.5034C4.00411 10.2272 3.78026 10.0034 3.50411 10.0034H2.00002C1.44773 10.0034 1.00002 9.55566 1.00002 9.00337V8.00342ZM9 7.00339H1V0.999023H5V2.49902C5 2.77517 5.22386 2.99902 5.5 2.99902C5.77614 2.99902 6 2.77517 6 2.49902V0.999023H7V3.50122C7 3.77736 7.22386 4.00122 7.5 4.00122C7.77614 4.00122 8 3.77736 8 3.50122V0.999023H9V7.00339Z\"\n          fill=\"currentColor\"\n        />\n      </svg>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-BSfQxQEN.js","mappings":";;AAAA,MAAM,OAAO,GAAG,qCAAqC;;MCOxC,cAAc,GAAAA,kBAAA,CAAA,MAAA,cAAA,SAAAC,CAAA,CAAA;AAL3B,IAAA,WAAA,GAAA;;;AAMU,QAAA,IAAK,CAAA,KAAA,GAAW,IAAI;AACpB,QAAA,IAAM,CAAA,MAAA,GAAW,IAAI;AAY9B;IAVC,MAAM,GAAA;QACJ,QACE,4DAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,YAAY,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,EAAA,EAC7F,CACE,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAC,EAAC,+7BAA+7B,EACj8B,IAAI,EAAC,cAAc,EAAA,CACnB,CACE;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/common/icons/icon.css?tag=paintbrush-icon&encapsulation=scoped","src/common/icons/paintbrush.tsx"],"sourcesContent":[":host {\n  display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'paintbrush-icon',\n  styleUrl: 'icon.css',\n  scoped: true,\n})\nexport class PaintbrushIcon {\n  @Prop() width: string = '16';\n  @Prop() height: string = '13';\n\n  render() {\n    return (\n      <svg width=\"16\" height=\"16\" viewBox=\"-3 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M0.5 -0.000976562C0.223858 -0.000976562 0 0.222881 0 0.499023L1.90735e-05 9.00337C1.90735e-05 10.1079 0.89545 11.0034 2.00002 11.0034H3.00411V14.0007C3.00411 15.1053 3.89954 16.0007 5.00411 16.0007C6.10868 16.0007 7.00411 15.1053 7.00411 14.0007V11.0034H8.00002C9.10459 11.0034 10 10.1079 10 9.00337V7.50339L10 7.49897V0.499023C10 0.222881 9.77614 -0.000976562 9.5 -0.000976562H0.5ZM1.00002 8.00342H9.00002V9.00337C9.00002 9.55566 8.5523 10.0034 8.00002 10.0034H6.50411C6.22797 10.0034 6.00411 10.2272 6.00411 10.5034V14.0007C6.00411 14.553 5.5564 15.0007 5.00411 15.0007C4.45183 15.0007 4.00411 14.553 4.00411 14.0007V10.5034C4.00411 10.2272 3.78026 10.0034 3.50411 10.0034H2.00002C1.44773 10.0034 1.00002 9.55566 1.00002 9.00337V8.00342ZM9 7.00339H1V0.999023H5V2.49902C5 2.77517 5.22386 2.99902 5.5 2.99902C5.77614 2.99902 6 2.77517 6 2.49902V0.999023H7V3.50122C7 3.77736 7.22386 4.00122 7.5 4.00122C7.77614 4.00122 8 3.77736 8 3.50122V0.999023H9V7.00339Z\"\n          fill=\"currentColor\"\n        />\n      </svg>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-WCXOX3Ou.js → p-BT5kT23k.js}

@@ -10,7 +10,7 @@ const MicrosoftLogoIcon = proxyCustomElement(class MicrosoftLogoIcon extends H {
         this.height = '22';
     }
     render() {
-        return (h("svg", { key: 'b4194177cd085931dc3be3b3cd66e19f2587b128', width: this.width, height: this.height, viewBox: "0 0 22 22", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'fa3e196bca9c1913133bf93e401cc3d3414efa49', d: "M0.043457 0.043457H10.4782V10.4782H0.043457V0.043457Z", fill: "#F35325" }), h("path", { key: 'a2c7303fdbc61a7a3612a19b9c57dcfb25f7d6a8', d: "M11.5217 0.043457H21.9565V10.4782H11.5217V0.043457Z", fill: "#81BC06" }), h("path", { key: 'd8c463d7c7d73e8e3ff3a6e16228ef14bf53c02e', d: "M0.043457 11.5217H10.4782V21.9565H0.043457V11.5217Z", fill: "#05A6F0" }), h("path", { key: '1218434597852bbe589d4fdb97d935463ef454ba', d: "M11.5217 11.5217H21.9565V21.9565H11.5217V11.5217Z", fill: "#FFBA08" })));
+        return (h("svg", { key: '0452012e39d88b7e92b3607ea38d303844addb7b', width: this.width, height: this.height, viewBox: "0 0 22 22", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '2de410b921afe31ade8481f5b9c0379b3d7192e2', d: "M0.043457 0.043457H10.4782V10.4782H0.043457V0.043457Z", fill: "#F35325" }), h("path", { key: '9075a7a167fc9ab45e8430ccf7abcc90ea4f5130', d: "M11.5217 0.043457H21.9565V10.4782H11.5217V0.043457Z", fill: "#81BC06" }), h("path", { key: '20a99dda14586e9dccf6992c67ed5f6dd467099b', d: "M0.043457 11.5217H10.4782V21.9565H0.043457V11.5217Z", fill: "#05A6F0" }), h("path", { key: '0a9b9823f799591953e2cd972341b6bfe0a88eea', d: "M11.5217 11.5217H21.9565V21.9565H11.5217V11.5217Z", fill: "#FFBA08" })));
     }
     static get style() { return iconCss; }
 }, [258, "microsoft-logo-icon", {
@@ -32,6 +32,6 @@ function defineCustomElement() {
 }
 
 export { MicrosoftLogoIcon as M, defineCustomElement as d };
-//# sourceMappingURL=p-WCXOX3Ou.js.map
+//# sourceMappingURL=p-BT5kT23k.js.map
 
-//# sourceMappingURL=p-WCXOX3Ou.js.map
+//# sourceMappingURL=p-BT5kT23k.js.map

package/dist/components/{p-WCXOX3Ou.js.map → p-BT5kT23k.js.map}

@@ -1 +1 @@
-{"file":"p-WCXOX3Ou.js","mappings":";;AAAA,MAAM,OAAO,GAAG,yCAAyC;;MCO5C,iBAAiB,GAAAA,kBAAA,CAAA,MAAA,iBAAA,SAAAC,CAAA,CAAA;AAL9B,IAAA,WAAA,GAAA;;;AAMU,QAAA,IAAK,CAAA,KAAA,GAAW,IAAI;AACpB,QAAA,IAAM,CAAA,MAAA,GAAW,IAAI;AAa9B;IAXC,MAAM,GAAA;QAEJ,QACE,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,EAAA,EAC7G,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,CAAC,EAAC,uDAAuD,EAAC,IAAI,EAAC,SAAS,EAAG,CAAA,EACjF,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,CAAC,EAAC,qDAAqD,EAAC,IAAI,EAAC,SAAS,EAAG,CAAA,EAC/E,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,CAAC,EAAC,qDAAqD,EAAC,IAAI,EAAC,SAAS,EAAG,CAAA,EAC/E,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAC,EAAC,mDAAmD,EAAC,IAAI,EAAC,SAAS,EAAA,CAAG,CACzE;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/common/icons/icon.css?tag=microsoft-logo-icon&encapsulation=scoped","src/common/icons/microsoft-logo.tsx"],"sourcesContent":[":host {\n  display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'microsoft-logo-icon',\n  styleUrl: 'icon.css',\n  scoped: true,\n})\nexport class MicrosoftLogoIcon {\n  @Prop() width: string = '22';\n  @Prop() height: string = '22';\n\n  render() {\n    // Spam icon svg\n    return (\n      <svg width={this.width} height={this.height} viewBox=\"0 0 22 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M0.043457 0.043457H10.4782V10.4782H0.043457V0.043457Z\" fill=\"#F35325\" />\n        <path d=\"M11.5217 0.043457H21.9565V10.4782H11.5217V0.043457Z\" fill=\"#81BC06\" />\n        <path d=\"M0.043457 11.5217H10.4782V21.9565H0.043457V11.5217Z\" fill=\"#05A6F0\" />\n        <path d=\"M11.5217 11.5217H21.9565V21.9565H11.5217V11.5217Z\" fill=\"#FFBA08\" />\n      </svg>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-BT5kT23k.js","mappings":";;AAAA,MAAM,OAAO,GAAG,yCAAyC;;MCO5C,iBAAiB,GAAAA,kBAAA,CAAA,MAAA,iBAAA,SAAAC,CAAA,CAAA;AAL9B,IAAA,WAAA,GAAA;;;AAMU,QAAA,IAAK,CAAA,KAAA,GAAW,IAAI;AACpB,QAAA,IAAM,CAAA,MAAA,GAAW,IAAI;AAa9B;IAXC,MAAM,GAAA;QAEJ,QACE,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,EAAA,EAC7G,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,CAAC,EAAC,uDAAuD,EAAC,IAAI,EAAC,SAAS,EAAG,CAAA,EACjF,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,CAAC,EAAC,qDAAqD,EAAC,IAAI,EAAC,SAAS,EAAG,CAAA,EAC/E,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,CAAC,EAAC,qDAAqD,EAAC,IAAI,EAAC,SAAS,EAAG,CAAA,EAC/E,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAC,EAAC,mDAAmD,EAAC,IAAI,EAAC,SAAS,EAAA,CAAG,CACzE;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/common/icons/icon.css?tag=microsoft-logo-icon&encapsulation=scoped","src/common/icons/microsoft-logo.tsx"],"sourcesContent":[":host {\n  display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'microsoft-logo-icon',\n  styleUrl: 'icon.css',\n  scoped: true,\n})\nexport class MicrosoftLogoIcon {\n  @Prop() width: string = '22';\n  @Prop() height: string = '22';\n\n  render() {\n    // Spam icon svg\n    return (\n      <svg width={this.width} height={this.height} viewBox=\"0 0 22 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M0.043457 0.043457H10.4782V10.4782H0.043457V0.043457Z\" fill=\"#F35325\" />\n        <path d=\"M11.5217 0.043457H21.9565V10.4782H11.5217V0.043457Z\" fill=\"#81BC06\" />\n        <path d=\"M0.043457 11.5217H10.4782V21.9565H0.043457V11.5217Z\" fill=\"#05A6F0\" />\n        <path d=\"M11.5217 11.5217H21.9565V21.9565H11.5217V11.5217Z\" fill=\"#FFBA08\" />\n      </svg>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-DU3FxQJW.js → p-BTWclWyF.js}

@@ -1,8 +1,8 @@
 import { p as proxyCustomElement, H, e as createEvent, h, i as Host } from './p-Bht9ktsW.js';
 import { R as RegisterComponent } from './p-CwtW7XIp.js';
 import { a as debug, b as instance, s as sanitize } from './p-B5ZLsN-l.js';
-import { d as defineCustomElement$2 } from './p-DAvS1ihh.js';
-import { d as defineCustomElement$1 } from './p-Hj9jbKPX.js';
+import { d as defineCustomElement$2 } from './p-d3kelm3z.js';
+import { d as defineCustomElement$1 } from './p-DxDoo-4C.js';
 
 const nylasCancellationPolicyCss = ":host{--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}.nylas-cancellation-policy{display:flex;flex-direction:column;gap:4px}.nylas-cancellation-policy label{display:flex;align-items:center;color:var(--nylas-base-800);font-size:16px;font-style:normal;font-weight:400;line-height:150%;}.nylas-cancellation-policy label span.label-icon{margin-left:4px}.nylas-cancellation-policy label span.label-icon tooltip-component{display:flex}.nylas-cancellation-policy textarea{padding:12px 16px;border-width:1;resize:vertical;border-radius:8px;font-family:var(--nylas-font-family);font-size:16px;line-height:24px;border:1px solid var(--nylas-base-200);background-color:var(--nylas-base-0);color:var(--nylas-base-900)}.nylas-cancellation-policy textarea::-webkit-resizer{display:none}";
 
@@ -86,7 +86,7 @@ const NylasCancellationPolicy = proxyCustomElement(class NylasCancellationPolicy
         }
     }
     render() {
-        return (h(Host, { key: 'ac4e267e315d9161f21bd6029869a222cdaca6c2' }, h("div", { key: '2b14b56b0730889e8a000f2d31423610a363baf6', class: "nylas-cancellation-policy", part: "ncpolicy" }, h("label", { key: 'fe61dcb5dbc50057e0d5b8eae023c303d45c6d3b', htmlFor: this.name }, instance.t('nylasCancellationPolicy.cancellationPolicyLabel'), h("span", { key: 'af2ceecb1d4f4f036c2ef10eb440f3c47c1edcbf', class: "label-icon" }, h("tooltip-component", { key: '9b26d383a34a6c2c8caae73a04947ea2f308dfd4' }, h("info-icon", { key: '5fac7ae76899281af6a441fa147fab3e8d6df679', slot: "tooltip-icon" }), h("span", { key: '02e9162fdd2daa763b9b01819cd3c8df6c33ec7d', slot: "tooltip-content" }, instance.t('nylasCancellationPolicy.tooltip.desc'))))), h("textarea", { key: '3a31745a9cd4d8dc0a66b3553005501d7e20ff59', id: this.name, part: "ncpolicy__textarea", name: this.name, value: this.message, maxlength: "250", onInput: e => this.handleChange(e) }))));
+        return (h(Host, { key: '8b4ce297e4deea0c63d2d66e91f45460d6f985e6' }, h("div", { key: '090eafe569cb6003cf2ed69f9f983fcf743a883a', class: "nylas-cancellation-policy", part: "ncpolicy" }, h("label", { key: 'ec1804093702f95c36c470da682fc07a5433b030', htmlFor: this.name }, instance.t('nylasCancellationPolicy.cancellationPolicyLabel'), h("span", { key: 'd9ba9603a4817cf4c5027e4beccb8ef053fc8d6c', class: "label-icon" }, h("tooltip-component", { key: '01015c2c85784b1455b3614d914efe838d20d41e' }, h("info-icon", { key: 'b77b2f2eb4b91d10f84aadd8bd34743b765a54b2', slot: "tooltip-icon" }), h("span", { key: 'c69191dc6b154784bfd44ae55c9fe26d20924ec2', slot: "tooltip-content" }, instance.t('nylasCancellationPolicy.tooltip.desc'))))), h("textarea", { key: '15c3fb350bd1599a65fdb3c0922c00926e941ba1', id: this.name, part: "ncpolicy__textarea", name: this.name, value: this.message, maxlength: "250", onInput: e => this.handleChange(e) }))));
     }
     static get formAssociated() { return true; }
     get host() { return this; }
@@ -150,6 +150,6 @@ function defineCustomElement() {
 }
 
 export { NylasCancellationPolicy as N, defineCustomElement as d };
-//# sourceMappingURL=p-DU3FxQJW.js.map
+//# sourceMappingURL=p-BTWclWyF.js.map
 
-//# sourceMappingURL=p-DU3FxQJW.js.map
+//# sourceMappingURL=p-BTWclWyF.js.map

package/dist/components/{p-DU3FxQJW.js.map → p-BTWclWyF.js.map}

@@ -1 +1 @@
-{"file":"p-DU3FxQJW.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","i18next"],"sources":["src/components/scheduler-editor/nylas-cancellation-policy/nylas-cancellation-policy.scss?tag=nylas-cancellation-policy&encapsulation=shadow","src/components/scheduler-editor/nylas-cancellation-policy/nylas-cancellation-policy.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n  @include default-css-variables;\n}\n\n.nylas-cancellation-policy {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n\n  label {\n    display: flex;\n    align-items: center;\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.label-icon {\n      margin-left: 4px;\n\n      tooltip-component {\n        display: flex;\n      }\n    }\n  }\n\n  textarea {\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    border: 1px solid var(--nylas-base-200);\n    background-color: var(--nylas-base-0);\n    color: var(--nylas-base-900);\n\n    &::-webkit-resizer {\n      display: none;\n    }\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug, sanitize } from '@/utils/utils';\nimport { AttachInternals, Component, Host, State, h, Element, Prop, Watch, Event, EventEmitter } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Configuration, ThemeConfig } from '@nylas/core';\nimport i18next from '@/utils/i18n';\nimport { LANGUAGE_CODE } from '@/common/constants';\n\n/**\n * The `nylas-cancellation-policy` component is a form input for the cancellation policy message of an event.\n * @part ncpolicy - The cancellation policy container\n * @part ncpolicy__textarea - The cancellation policy textarea\n */\n@Component({\n  tag: 'nylas-cancellation-policy',\n  styleUrl: 'nylas-cancellation-policy.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasCancellationPolicy {\n  /**\n   * The host element <nylas-cancellation-policy>\n   */\n  @Element() host!: HTMLElement;\n  /**\n   * @standalone\n   * The selected config\n   */\n  @Prop() selectedConfiguration?: Configuration;\n\n  /**\n   * @standalone\n   * The cancellation policy stored in the configuration\n   */\n  @Prop() cancellationPolicy?: string;\n\n  /**\n   * @standalone\n   * The name of the cancellation policy input.\n   */\n  @Prop() name: string = 'cancellation-policy';\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 selected cancellation policy state. This defaults to the cancellation policy from the configuration or an empty string.\n   */\n  @State() message!: string;\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\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-cancellation-policy', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('selectedConfiguration')\n  selectedConfigurationChangedHandler(newValue: Configuration) {\n    debug('nylas-custom-booking-flow', 'selectedConfigurationChangedHandler', newValue);\n    this.message = newValue?.scheduler?.cancellation_policy || this.cancellationPolicy || '';\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  /**\n   * Event emitted when the cancellation policy message changes.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  connectedCallback() {\n    debug('nylas-cancellation-policy', '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  componentWillLoad() {\n    debug('nylas-cancellation-policy', 'componentWillLoad');\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-cancellation-policy', 'componentDidLoad');\n    if (this.selectedConfiguration) {\n      this.selectedConfigurationChangedHandler(this.selectedConfiguration);\n    } else {\n      this.message = this.cancellationPolicy || '';\n    }\n  }\n\n  disconnectedCallback() {\n    debug('nylas-cancellation-policy', 'disconnectedCallback');\n  }\n\n  handleChange(event) {\n    const value = sanitize(event.target.value);\n    this.message = value;\n    this.internals.setFormValue(value, this.name);\n    this.valueChanged.emit({ value: value, name: this.name });\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<NylasCancellationPolicy, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-cancellation-policy',\n    stateToProps: new Map([\n      ['schedulerConfig.selectedConfiguration', 'selectedConfiguration'],\n      ['schedulerConfig.selectedLanguage', 'selectedLanguage'],\n      ['schedulerConfig.themeConfig', 'themeConfig'],\n    ]),\n    eventToProps: {},\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host>\n        <div class=\"nylas-cancellation-policy\" part=\"ncpolicy\">\n          <label htmlFor={this.name}>\n            {i18next.t('nylasCancellationPolicy.cancellationPolicyLabel')}\n            <span class=\"label-icon\">\n              <tooltip-component>\n                <info-icon slot=\"tooltip-icon\" />\n                <span slot=\"tooltip-content\">{i18next.t('nylasCancellationPolicy.tooltip.desc')}</span>\n              </tooltip-component>\n            </span>\n          </label>\n          <textarea id={this.name} part=\"ncpolicy__textarea\" name={this.name} value={this.message} maxlength=\"250\" onInput={e => this.handleChange(e)}></textarea>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-BTWclWyF.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","i18next"],"sources":["src/components/scheduler-editor/nylas-cancellation-policy/nylas-cancellation-policy.scss?tag=nylas-cancellation-policy&encapsulation=shadow","src/components/scheduler-editor/nylas-cancellation-policy/nylas-cancellation-policy.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n  @include default-css-variables;\n}\n\n.nylas-cancellation-policy {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n\n  label {\n    display: flex;\n    align-items: center;\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.label-icon {\n      margin-left: 4px;\n\n      tooltip-component {\n        display: flex;\n      }\n    }\n  }\n\n  textarea {\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    border: 1px solid var(--nylas-base-200);\n    background-color: var(--nylas-base-0);\n    color: var(--nylas-base-900);\n\n    &::-webkit-resizer {\n      display: none;\n    }\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug, sanitize } from '@/utils/utils';\nimport { AttachInternals, Component, Host, State, h, Element, Prop, Watch, Event, EventEmitter } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Configuration, ThemeConfig } from '@nylas/core';\nimport i18next from '@/utils/i18n';\nimport { LANGUAGE_CODE } from '@/common/constants';\n\n/**\n * The `nylas-cancellation-policy` component is a form input for the cancellation policy message of an event.\n * @part ncpolicy - The cancellation policy container\n * @part ncpolicy__textarea - The cancellation policy textarea\n */\n@Component({\n  tag: 'nylas-cancellation-policy',\n  styleUrl: 'nylas-cancellation-policy.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasCancellationPolicy {\n  /**\n   * The host element <nylas-cancellation-policy>\n   */\n  @Element() host!: HTMLElement;\n  /**\n   * @standalone\n   * The selected config\n   */\n  @Prop() selectedConfiguration?: Configuration;\n\n  /**\n   * @standalone\n   * The cancellation policy stored in the configuration\n   */\n  @Prop() cancellationPolicy?: string;\n\n  /**\n   * @standalone\n   * The name of the cancellation policy input.\n   */\n  @Prop() name: string = 'cancellation-policy';\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 selected cancellation policy state. This defaults to the cancellation policy from the configuration or an empty string.\n   */\n  @State() message!: string;\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\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-cancellation-policy', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('selectedConfiguration')\n  selectedConfigurationChangedHandler(newValue: Configuration) {\n    debug('nylas-custom-booking-flow', 'selectedConfigurationChangedHandler', newValue);\n    this.message = newValue?.scheduler?.cancellation_policy || this.cancellationPolicy || '';\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  /**\n   * Event emitted when the cancellation policy message changes.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  connectedCallback() {\n    debug('nylas-cancellation-policy', '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  componentWillLoad() {\n    debug('nylas-cancellation-policy', 'componentWillLoad');\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-cancellation-policy', 'componentDidLoad');\n    if (this.selectedConfiguration) {\n      this.selectedConfigurationChangedHandler(this.selectedConfiguration);\n    } else {\n      this.message = this.cancellationPolicy || '';\n    }\n  }\n\n  disconnectedCallback() {\n    debug('nylas-cancellation-policy', 'disconnectedCallback');\n  }\n\n  handleChange(event) {\n    const value = sanitize(event.target.value);\n    this.message = value;\n    this.internals.setFormValue(value, this.name);\n    this.valueChanged.emit({ value: value, name: this.name });\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<NylasCancellationPolicy, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-cancellation-policy',\n    stateToProps: new Map([\n      ['schedulerConfig.selectedConfiguration', 'selectedConfiguration'],\n      ['schedulerConfig.selectedLanguage', 'selectedLanguage'],\n      ['schedulerConfig.themeConfig', 'themeConfig'],\n    ]),\n    eventToProps: {},\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host>\n        <div class=\"nylas-cancellation-policy\" part=\"ncpolicy\">\n          <label htmlFor={this.name}>\n            {i18next.t('nylasCancellationPolicy.cancellationPolicyLabel')}\n            <span class=\"label-icon\">\n              <tooltip-component>\n                <info-icon slot=\"tooltip-icon\" />\n                <span slot=\"tooltip-content\">{i18next.t('nylasCancellationPolicy.tooltip.desc')}</span>\n              </tooltip-component>\n            </span>\n          </label>\n          <textarea id={this.name} part=\"ncpolicy__textarea\" name={this.name} value={this.message} maxlength=\"250\" onInput={e => this.handleChange(e)}></textarea>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-Dvm3cFRX.js → p-BVH0Klhu.js}

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, h } from './p-Bht9ktsW.js';
-import { d as defineCustomElement$1 } from './p-hYRQCAHR.js';
+import { d as defineCustomElement$1 } from './p-C7ZpwRD0.js';
 
 const buttonComponentCss = "button.sc-button-component{display:flex;align-items:center;justify-content:center;gap:0.75rem;height:48px;border:none;border-radius:var(--nylas-border-radius-2x);font-size:16px;line-height:24px;padding:0 1rem;cursor:pointer;font-family:var(--nylas-font-family);font-weight:600;width:100%}@media screen and (max-width: 768px){button.sc-button-component{width:100%}}button.button-primary.sc-button-component{background:var(--nylas-primary);color:var(--nylas-base-0);height:48px;border:none;border-radius:var(--nylas-border-radius-2x);font-size:16px;line-height:24px;padding:0 1rem;cursor:pointer}button.button-primary.sc-button-component:hover{background:var(--nylas-base-600)}button.button-primary.sc-button-component:active{background:var(--nylas-base-800)}button.button-primary.sc-button-component:disabled{background:var(--nylas-base-300);cursor:not-allowed}button.button-basic.sc-button-component{border:1px solid var(--nylas-base-300);color:var(--nylas-base-700);background:transparent}button.button-basic.sc-button-component:hover{background:transparent;border-color:var(--nylas-primary)}button.button-basic.sc-button-component:active{background:transparent;border-color:var(--nylas-base-600);border-width:2px}button.button-basic.sc-button-component:disabled{background:transparent;border-color:var(--nylas-base-300);color:var(--nylas-base-300);cursor:not-allowed}button.button-destructive.sc-button-component{border:1px solid var(--nylas-base-300);color:var(--nylas-error);background:transparent}button.button-destructive.sc-button-component:hover{background:transparent;border-color:var(--nylas-error)}button.button-destructive.sc-button-component:active{background:transparent;border-color:var(--nylas-error-pressed);border-width:2px;color:var(--nylas-error-pressed)}button.button-destructive.sc-button-component:disabled{background:transparent;border-color:var(--nylas-base-300);color:var(--nylas-base-300);cursor:not-allowed}button.button-invisible.sc-button-component{background:transparent;color:var(--nylas-base-800);border:none}button.button-invisible.sc-button-component:hover{background:var(--nylas-base-50);color:var(--nylas-primary)}button.button-invisible.sc-button-component:active{background:var(--nylas-base-50);color:var(--nylas-base-850)}button.button-invisible.sc-button-component:disabled{background:transparent;color:var(--nylas-base-300);cursor:not-allowed}";
 
@@ -15,7 +15,7 @@ const ButtonComponent = proxyCustomElement(class ButtonComponent extends H {
     }
     render() {
         const className = `button-${this.variant}` + (this.disabled ? ' disabled' : '');
-        return (h("button", { key: 'dcd04568e46b12005aff27b711f14fc564b03245', class: className, disabled: this.disabled, type: this.type, title: this.tooltip, onClick: this.clickHandler, onMouseOver: this.mouseOverHandler, onMouseOut: this.mouseOutHandler, onFocus: this.focusHandler, onBlur: this.blurHandler }, !!this.isLoading && h("loading-icon", { key: 'c7588a63f9863a1ffc1189515d123bbb5f22c510', slot: "icon" }), h("slot", { key: 'ff4f6b2a7a6232e11d9c7753d9ca24e3127790a8' })));
+        return (h("button", { key: '96ccf32b8d9df2950f00992ffaf98428ffaf7149', class: className, disabled: this.disabled, type: this.type, title: this.tooltip, onClick: this.clickHandler, onMouseOver: this.mouseOverHandler, onMouseOut: this.mouseOutHandler, onFocus: this.focusHandler, onBlur: this.blurHandler }, !!this.isLoading && h("loading-icon", { key: '899efdeeb0a2a0431a0cea6c4d1fe0f49ff4d6b4', slot: "icon" }), h("slot", { key: 'f8cb2e32f1692819d38c3f8144d1ba55ad7270b4' })));
     }
     static get style() { return buttonComponentCss; }
 }, [262, "button-component", {
@@ -50,6 +50,6 @@ function defineCustomElement() {
 }
 
 export { ButtonComponent as B, defineCustomElement as d };
-//# sourceMappingURL=p-Dvm3cFRX.js.map
+//# sourceMappingURL=p-BVH0Klhu.js.map
 
-//# sourceMappingURL=p-Dvm3cFRX.js.map
+//# sourceMappingURL=p-BVH0Klhu.js.map

package/dist/components/{p-Dvm3cFRX.js.map → p-BVH0Klhu.js.map}

@@ -1 +1 @@
-{"file":"p-Dvm3cFRX.js","mappings":";;;AAAA,MAAM,kBAAkB,GAAG,m1EAAm1E;;MCOj2E,eAAe,GAAAA,kBAAA,CAAA,MAAA,eAAA,SAAAC,CAAA,CAAA;AAL5B,IAAA,WAAA,GAAA;;;AAOU,QAAA,IAAO,CAAA,OAAA,GAAe,SAAS;AAG/B,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAEzB,QAAA,IAAI,CAAA,IAAA,GAAW,QAAQ;AACvB,QAAA,IAAO,CAAA,OAAA,GAAW,EAAE;AACpB,QAAA,IAAS,CAAA,SAAA,GAAY,KAAK;AA2BnC;IApBC,MAAM,GAAA;QACJ,MAAM,SAAS,GAAG,CAAU,OAAA,EAAA,IAAI,CAAC,OAAO,CAAA,CAAE,IAAI,IAAI,CAAC,QAAQ,GAAG,WAAW,GAAG,EAAE,CAAC;QAE/E,QACE,CACE,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,OAAO,EACnB,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAClC,UAAU,EAAE,IAAI,CAAC,eAAe,EAChC,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,MAAM,EAAE,IAAI,CAAC,WAAW,EAAA,EAEvB,CAAC,CAAC,IAAI,CAAC,SAAS,IAAI,CAAc,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,MAAM,EAAgB,CAAA,EAC9D,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACN;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/design-system/button-component/button-component.scss?tag=button-component&encapsulation=scoped","src/components/design-system/button-component/button-component.tsx"],"sourcesContent":["@use '../../../common/mixins/buttons' as *;\n@use '../../../common/styles/variables' as *;\n\nbutton {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 0.75rem;\n  height: 48px;\n  border: none;\n  border-radius: var(--nylas-border-radius-2x);\n  font-size: 16px;\n  line-height: 24px;\n  padding: 0 1rem;\n  cursor: pointer;\n  font-family: var(--nylas-font-family);\n  font-weight: 600;\n  width: 100%;\n\n  @media #{$mobile} {\n    width: 100%;\n  }\n\n  &.button-primary {\n    @include primary-button;\n  }\n\n  &.button-basic {\n    border: 1px solid var(--nylas-base-300);\n    color: var(--nylas-base-700);\n    background: transparent;\n\n    &:hover {\n      background: transparent;\n      border-color: var(--nylas-primary);\n    }\n\n    &:active {\n      background: transparent;\n      border-color: var(--nylas-base-600);\n      border-width: 2px;\n    }\n\n    &:disabled {\n      background: transparent;\n      border-color: var(--nylas-base-300);\n      color: var(--nylas-base-300);\n      cursor: not-allowed;\n    }\n  }\n\n  &.button-destructive {\n    border: 1px solid var(--nylas-base-300);\n    color: var(--nylas-error);\n    background: transparent;\n\n    &:hover {\n      background: transparent;\n      border-color: var(--nylas-error);\n    }\n\n    &:active {\n      background: transparent;\n      border-color: var(--nylas-error-pressed);\n      border-width: 2px;\n      color: var(--nylas-error-pressed);\n    }\n\n    &:disabled {\n      background: transparent;\n      border-color: var(--nylas-base-300);\n      color: var(--nylas-base-300);\n      cursor: not-allowed;\n    }\n  }\n\n  &.button-invisible {\n    background: transparent;\n    color: var(--nylas-base-800);\n    border: none;\n\n    &:hover {\n      background: var(--nylas-base-50);\n      color: var(--nylas-primary);\n    }\n\n    &:active {\n      background: var(--nylas-base-50);\n      color: var(--nylas-base-850);\n    }\n\n    &:disabled {\n      background: transparent;\n      color: var(--nylas-base-300);\n      cursor: not-allowed;\n    }\n  }\n}\n","import { Component, Prop, h } from '@stencil/core';\nimport { ButtonType } from '@nylas/core';\n@Component({\n  tag: 'button-component',\n  styleUrl: 'button-component.scss',\n  scoped: true,\n})\nexport class ButtonComponent {\n  // Define a prop to accept the button type\n  @Prop() variant: ButtonType = 'primary';\n\n  // Define a prop for disabled state\n  @Prop() disabled: boolean = false;\n\n  @Prop() type: string = 'button';\n  @Prop() tooltip: string = '';\n  @Prop() isLoading: boolean = false;\n  @Prop() clickHandler?: (event: MouseEvent) => void;\n  @Prop() mouseOverHandler?: (event: MouseEvent) => void;\n  @Prop() mouseOutHandler?: (event: MouseEvent) => void;\n  @Prop() focusHandler?: (event: FocusEvent) => void;\n  @Prop() blurHandler?: (event: FocusEvent) => void;\n\n  render() {\n    const className = `button-${this.variant}` + (this.disabled ? ' disabled' : '');\n\n    return (\n      <button\n        class={className}\n        disabled={this.disabled}\n        type={this.type}\n        title={this.tooltip}\n        onClick={this.clickHandler}\n        onMouseOver={this.mouseOverHandler}\n        onMouseOut={this.mouseOutHandler}\n        onFocus={this.focusHandler}\n        onBlur={this.blurHandler}\n      >\n        {!!this.isLoading && <loading-icon slot=\"icon\"></loading-icon>}\n        <slot></slot>\n      </button>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-BVH0Klhu.js","mappings":";;;AAAA,MAAM,kBAAkB,GAAG,m1EAAm1E;;MCOj2E,eAAe,GAAAA,kBAAA,CAAA,MAAA,eAAA,SAAAC,CAAA,CAAA;AAL5B,IAAA,WAAA,GAAA;;;AAOU,QAAA,IAAO,CAAA,OAAA,GAAe,SAAS;AAG/B,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAEzB,QAAA,IAAI,CAAA,IAAA,GAAW,QAAQ;AACvB,QAAA,IAAO,CAAA,OAAA,GAAW,EAAE;AACpB,QAAA,IAAS,CAAA,SAAA,GAAY,KAAK;AA2BnC;IApBC,MAAM,GAAA;QACJ,MAAM,SAAS,GAAG,CAAU,OAAA,EAAA,IAAI,CAAC,OAAO,CAAA,CAAE,IAAI,IAAI,CAAC,QAAQ,GAAG,WAAW,GAAG,EAAE,CAAC;QAE/E,QACE,CACE,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,OAAO,EACnB,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAClC,UAAU,EAAE,IAAI,CAAC,eAAe,EAChC,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,MAAM,EAAE,IAAI,CAAC,WAAW,EAAA,EAEvB,CAAC,CAAC,IAAI,CAAC,SAAS,IAAI,CAAc,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,MAAM,EAAgB,CAAA,EAC9D,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACN;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/design-system/button-component/button-component.scss?tag=button-component&encapsulation=scoped","src/components/design-system/button-component/button-component.tsx"],"sourcesContent":["@use '../../../common/mixins/buttons' as *;\n@use '../../../common/styles/variables' as *;\n\nbutton {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 0.75rem;\n  height: 48px;\n  border: none;\n  border-radius: var(--nylas-border-radius-2x);\n  font-size: 16px;\n  line-height: 24px;\n  padding: 0 1rem;\n  cursor: pointer;\n  font-family: var(--nylas-font-family);\n  font-weight: 600;\n  width: 100%;\n\n  @media #{$mobile} {\n    width: 100%;\n  }\n\n  &.button-primary {\n    @include primary-button;\n  }\n\n  &.button-basic {\n    border: 1px solid var(--nylas-base-300);\n    color: var(--nylas-base-700);\n    background: transparent;\n\n    &:hover {\n      background: transparent;\n      border-color: var(--nylas-primary);\n    }\n\n    &:active {\n      background: transparent;\n      border-color: var(--nylas-base-600);\n      border-width: 2px;\n    }\n\n    &:disabled {\n      background: transparent;\n      border-color: var(--nylas-base-300);\n      color: var(--nylas-base-300);\n      cursor: not-allowed;\n    }\n  }\n\n  &.button-destructive {\n    border: 1px solid var(--nylas-base-300);\n    color: var(--nylas-error);\n    background: transparent;\n\n    &:hover {\n      background: transparent;\n      border-color: var(--nylas-error);\n    }\n\n    &:active {\n      background: transparent;\n      border-color: var(--nylas-error-pressed);\n      border-width: 2px;\n      color: var(--nylas-error-pressed);\n    }\n\n    &:disabled {\n      background: transparent;\n      border-color: var(--nylas-base-300);\n      color: var(--nylas-base-300);\n      cursor: not-allowed;\n    }\n  }\n\n  &.button-invisible {\n    background: transparent;\n    color: var(--nylas-base-800);\n    border: none;\n\n    &:hover {\n      background: var(--nylas-base-50);\n      color: var(--nylas-primary);\n    }\n\n    &:active {\n      background: var(--nylas-base-50);\n      color: var(--nylas-base-850);\n    }\n\n    &:disabled {\n      background: transparent;\n      color: var(--nylas-base-300);\n      cursor: not-allowed;\n    }\n  }\n}\n","import { Component, Prop, h } from '@stencil/core';\nimport { ButtonType } from '@nylas/core';\n@Component({\n  tag: 'button-component',\n  styleUrl: 'button-component.scss',\n  scoped: true,\n})\nexport class ButtonComponent {\n  // Define a prop to accept the button type\n  @Prop() variant: ButtonType = 'primary';\n\n  // Define a prop for disabled state\n  @Prop() disabled: boolean = false;\n\n  @Prop() type: string = 'button';\n  @Prop() tooltip: string = '';\n  @Prop() isLoading: boolean = false;\n  @Prop() clickHandler?: (event: MouseEvent) => void;\n  @Prop() mouseOverHandler?: (event: MouseEvent) => void;\n  @Prop() mouseOutHandler?: (event: MouseEvent) => void;\n  @Prop() focusHandler?: (event: FocusEvent) => void;\n  @Prop() blurHandler?: (event: FocusEvent) => void;\n\n  render() {\n    const className = `button-${this.variant}` + (this.disabled ? ' disabled' : '');\n\n    return (\n      <button\n        class={className}\n        disabled={this.disabled}\n        type={this.type}\n        title={this.tooltip}\n        onClick={this.clickHandler}\n        onMouseOver={this.mouseOverHandler}\n        onMouseOut={this.mouseOutHandler}\n        onFocus={this.focusHandler}\n        onBlur={this.blurHandler}\n      >\n        {!!this.isLoading && <loading-icon slot=\"icon\"></loading-icon>}\n        <slot></slot>\n      </button>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-DTF0fIhr.js → p-B_Qi3sM4.js}

@@ -65,7 +65,7 @@ const RadioButtonGroup = proxyCustomElement(class RadioButtonGroup extends H {
         });
     }
     render() {
-        return (h("div", { key: '7fa6a5c04d62ceb1ea1412aac41be984895401db', class: "radio-group" }, h("slot", { key: '665dd9f000f90ad4cbed77ee54d7e273abf9ae1a', name: "label" }, this.label && (h("p", { key: '2c1c8b51e8dcc76b740c6de1976403e072af421a', class: { error: !!this.error } }, h("span", { key: '8d718ac0d06dc745d859e0c97ecdca1e7c510b31', class: "label" }, this.label), this.required && h("span", { key: 'bead8788e072a0e2016eb45d3526b119b5f0d677', class: "required" }, "*")))), this.options.map(option => (h("label", null, h("div", { class: "radio-option" }, h("input", { type: "radio", disabled: this.readOnly, readOnly: this.readOnly, title: this.readOnly ? 'read-only field' : undefined, name: this.name, value: option.value, checked: this.selectedValue === option.value, onChange: () => this.handleChange(option.value) }), h("p", null, h("span", { class: "title" }, option.label), h("span", { class: "description" }, option.description)))))), this.error && h("span", { key: '353cf7e4a3bee5425cc1a7fdbfe204df59bc5163', class: "error help-text" }, this.error)));
+        return (h("div", { key: '9a171da3f6a18e69d743e068cfb3a958b4534ec2', class: "radio-group" }, h("slot", { key: '6ce2e5f4e51b3907a6cb5d952423bc720a16bd75', name: "label" }, this.label && (h("p", { key: '6cefd7a9568652f81b5dd2a61157e9253e6ad5e5', class: { error: !!this.error } }, h("span", { key: 'ac078a4f3eba135f85acf1a9417682545221cd39', class: "label" }, this.label), this.required && h("span", { key: '531c0bef412eac313ca0e91d74e5a5ae0f277fa3', class: "required" }, "*")))), this.options.map(option => (h("label", null, h("div", { class: "radio-option" }, h("input", { type: "radio", disabled: this.readOnly, readOnly: this.readOnly, title: this.readOnly ? 'read-only field' : undefined, name: this.name, value: option.value, checked: this.selectedValue === option.value, onChange: () => this.handleChange(option.value) }), h("p", null, h("span", { class: "title" }, option.label), h("span", { class: "description" }, option.description)))))), this.error && h("span", { key: 'e5b907eea1916a3c3e84c49763f20b5008a29e05', class: "error help-text" }, this.error)));
     }
     get el() { return this; }
     static get watchers() { return {
@@ -103,6 +103,6 @@ function defineCustomElement() {
 }
 
 export { RadioButtonGroup as R, defineCustomElement as d };
-//# sourceMappingURL=p-DTF0fIhr.js.map
+//# sourceMappingURL=p-B_Qi3sM4.js.map
 
-//# sourceMappingURL=p-DTF0fIhr.js.map
+//# sourceMappingURL=p-B_Qi3sM4.js.map

package/dist/components/{p-DTF0fIhr.js.map → p-B_Qi3sM4.js.map}

@@ -1 +1 @@
-{"file":"p-DTF0fIhr.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/design-system/radio-button-group/radio-button-group.scss?tag=radio-button-group&encapsulation=shadow","src/components/design-system/radio-button-group/radio-button-group.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n@use '../../../common/mixins/inputs' as *;\n\n:host {\n  display: block;\n  @include default-css-variables;\n  width: 100%;\n}\n\n.radio-group {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n\n  slot[name='label'] {\n    @include input-label;\n    font-size: 16px;\n\n    p {\n      margin: 0;\n\n      &.error {\n        color: var(--nylas-error);\n      }\n    }\n\n    .error {\n      color: var(--nylas-error);\n    }\n  }\n\n  span.error {\n    color: var(--nylas-error);\n    font-size: 14px;\n    font-weight: 400;\n    line-height: 20px;\n    font-family: var(--nylas-font-family);\n  }\n\n  label {\n    display: flex;\n\n    font-family: var(--nylas-font-family);\n    cursor: pointer;\n\n    .radio-option {\n      display: flex;\n      align-items: flex-start;\n      gap: 0.5rem;\n\n      input[type='radio'] {\n        cursor: pointer;\n      }\n\n      input[type='radio' i] {\n        width: 20px;\n        height: 20px;\n        color: var(--nylas-primary);\n      }\n\n      p {\n        display: flex;\n        flex-direction: column;\n        gap: 0.5rem;\n        margin: 0;\n\n        .title {\n          font-size: 16px;\n          font-weight: 500;\n          line-height: 20px;\n          color: var(--nylas-base-800);\n          word-break: break-word;\n          overflow-wrap: break-word;\n        }\n\n        .description {\n          font-size: 14px;\n          font-weight: 400;\n          line-height: 20px;\n          color: var(--nylas-base-600);\n        }\n      }\n    }\n  }\n}\n","// src/components/radio-group/radio-group.tsx\nimport { ThemeConfig } from '@nylas/core';\nimport { Component, h, Prop, State, Event, EventEmitter, Listen, Element, Watch } from '@stencil/core';\n\n/**\n * The `radio-button-group` component is a UI component that allows users to select a single option from a list of options.\n * This component is used in the scheduling form to input radio button type inputs.\n */\n@Component({\n  tag: 'radio-button-group',\n  styleUrl: 'radio-button-group.scss',\n  shadow: true,\n})\nexport class RadioButtonGroup {\n  @Element() el!: HTMLElement;\n  private readonly componentType: string = 'radio-group';\n\n  /**\n   * The name of the radio group. This is used to identify the radio group when submitting a form.\n   */\n  @Prop() name: string = 'radio-group';\n  /**\n   * The list of options in the radio group.\n   * Each option has a label and a value and an optional description.\n   */\n  @Prop() options: { label: string; value: string; description?: string }[] = [];\n  /**\n   * The default selected value of the radio group.\n   */\n  @Prop({ attribute: 'default-selected-value' }) defaultSelectedValue: string = '';\n  /**\n   * The label of the radio group. This is displayed above the radio group.\n   * Label is optional. You can also use the slot 'label' to add a label.\n   */\n  @Prop() label?: string;\n  /**\n   * Whether the radio group is required. If true, the radio group must have a value when submitting a form.\n   * Default is false. If the radio group is required and the value is empty, an error message is displayed.\n   */\n  @Prop() required: boolean = false;\n  /**\n   * The property to make the radio group read-only. If true, the radio group cannot be edited.\n   */\n  @Prop() readOnly: boolean = false;\n  /**\n   * The theme configuration.\n   */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n  /**\n   * Error message to display when the radio group is required and no value is selected.\n   */\n  @Prop() errorMessage: string = '';\n  /**\n   * The selected value of the radio group.\n   */\n  @State() selectedValue!: string;\n  /**\n   * The error message state.\n   */\n  @State() error: string = '';\n  /**\n   * This event is fired when the selected value changes.\n   */\n  @Event() nylasFormRadioChanged!: EventEmitter<{\n    value: string;\n    name: string;\n    label?: string;\n  }>;\n\n  @Watch('defaultSelectedValue')\n  handleDefaultSelectedValueChange(newValue: string) {\n    this.selectedValue = newValue;\n  }\n\n  @Watch('themeConfig')\n  themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n    if (newVal === oldVal) return;\n    this.applyThemeConfig(newVal);\n  }\n\n  applyThemeConfig(themeConfig?: ThemeConfig) {\n    if (themeConfig) {\n      for (const [key, value] of Object.entries(themeConfig)) {\n        this.el.style.setProperty(`${key}`, value);\n      }\n    }\n  }\n\n  // Lifecycle methods\n  connectedCallback() {\n    // Use queueMicrotask to defer theme application until after React has set props.\n    // This fixes the timing issue where connectedCallback fires before React sets themeConfig.\n    queueMicrotask(() => {\n      if (this.themeConfig) {\n        this.applyThemeConfig(this.themeConfig);\n        this.el.setAttribute('data-themed', '');\n      }\n    });\n  }\n\n  componentDidLoad() {\n    this.selectedValue = this.defaultSelectedValue;\n  }\n\n  // Event listeners\n  /**\n   * Listen for the bookingFormSubmitted event to validate the input value when the form is submitted.\n   */\n  @Listen('bookingFormSubmitted', { target: 'document' })\n  handleBookingFormSubmitted(event: CustomEvent) {\n    if (this.required && !this.selectedValue) {\n      this.error = this.errorMessage || `${this.label} is required.`;\n      return;\n    }\n    if (this.error) {\n      event.preventDefault();\n    }\n  }\n\n  componentWillLoad() {\n    this.el.setAttribute('component-type', this.componentType);\n  }\n\n  handleChange(value: string) {\n    this.error = '';\n    this.selectedValue = value;\n    this.nylasFormRadioChanged.emit({\n      value,\n      name: this.name,\n      label: this.label,\n    });\n  }\n\n  render() {\n    return (\n      <div class=\"radio-group\">\n        <slot name=\"label\">\n          {this.label && (\n            <p class={{ error: !!this.error }}>\n              <span class=\"label\">{this.label}</span>\n              {this.required && <span class=\"required\">*</span>}\n            </p>\n          )}\n        </slot>\n        {this.options.map(option => (\n          <label>\n            <div class=\"radio-option\">\n              <input\n                type=\"radio\"\n                disabled={this.readOnly}\n                readOnly={this.readOnly}\n                title={this.readOnly ? 'read-only field' : undefined}\n                name={this.name}\n                value={option.value}\n                checked={this.selectedValue === option.value}\n                onChange={() => this.handleChange(option.value)}\n              />\n              <p>\n                <span class=\"title\">{option.label}</span>\n                <span class=\"description\">{option.description}</span>\n              </p>\n            </div>\n          </label>\n        ))}\n        {this.error && <span class=\"error help-text\">{this.error}</span>}\n      </div>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-B_Qi3sM4.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/design-system/radio-button-group/radio-button-group.scss?tag=radio-button-group&encapsulation=shadow","src/components/design-system/radio-button-group/radio-button-group.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n@use '../../../common/mixins/inputs' as *;\n\n:host {\n  display: block;\n  @include default-css-variables;\n  width: 100%;\n}\n\n.radio-group {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n\n  slot[name='label'] {\n    @include input-label;\n    font-size: 16px;\n\n    p {\n      margin: 0;\n\n      &.error {\n        color: var(--nylas-error);\n      }\n    }\n\n    .error {\n      color: var(--nylas-error);\n    }\n  }\n\n  span.error {\n    color: var(--nylas-error);\n    font-size: 14px;\n    font-weight: 400;\n    line-height: 20px;\n    font-family: var(--nylas-font-family);\n  }\n\n  label {\n    display: flex;\n\n    font-family: var(--nylas-font-family);\n    cursor: pointer;\n\n    .radio-option {\n      display: flex;\n      align-items: flex-start;\n      gap: 0.5rem;\n\n      input[type='radio'] {\n        cursor: pointer;\n      }\n\n      input[type='radio' i] {\n        width: 20px;\n        height: 20px;\n        color: var(--nylas-primary);\n      }\n\n      p {\n        display: flex;\n        flex-direction: column;\n        gap: 0.5rem;\n        margin: 0;\n\n        .title {\n          font-size: 16px;\n          font-weight: 500;\n          line-height: 20px;\n          color: var(--nylas-base-800);\n          word-break: break-word;\n          overflow-wrap: break-word;\n        }\n\n        .description {\n          font-size: 14px;\n          font-weight: 400;\n          line-height: 20px;\n          color: var(--nylas-base-600);\n        }\n      }\n    }\n  }\n}\n","// src/components/radio-group/radio-group.tsx\nimport { ThemeConfig } from '@nylas/core';\nimport { Component, h, Prop, State, Event, EventEmitter, Listen, Element, Watch } from '@stencil/core';\n\n/**\n * The `radio-button-group` component is a UI component that allows users to select a single option from a list of options.\n * This component is used in the scheduling form to input radio button type inputs.\n */\n@Component({\n  tag: 'radio-button-group',\n  styleUrl: 'radio-button-group.scss',\n  shadow: true,\n})\nexport class RadioButtonGroup {\n  @Element() el!: HTMLElement;\n  private readonly componentType: string = 'radio-group';\n\n  /**\n   * The name of the radio group. This is used to identify the radio group when submitting a form.\n   */\n  @Prop() name: string = 'radio-group';\n  /**\n   * The list of options in the radio group.\n   * Each option has a label and a value and an optional description.\n   */\n  @Prop() options: { label: string; value: string; description?: string }[] = [];\n  /**\n   * The default selected value of the radio group.\n   */\n  @Prop({ attribute: 'default-selected-value' }) defaultSelectedValue: string = '';\n  /**\n   * The label of the radio group. This is displayed above the radio group.\n   * Label is optional. You can also use the slot 'label' to add a label.\n   */\n  @Prop() label?: string;\n  /**\n   * Whether the radio group is required. If true, the radio group must have a value when submitting a form.\n   * Default is false. If the radio group is required and the value is empty, an error message is displayed.\n   */\n  @Prop() required: boolean = false;\n  /**\n   * The property to make the radio group read-only. If true, the radio group cannot be edited.\n   */\n  @Prop() readOnly: boolean = false;\n  /**\n   * The theme configuration.\n   */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n  /**\n   * Error message to display when the radio group is required and no value is selected.\n   */\n  @Prop() errorMessage: string = '';\n  /**\n   * The selected value of the radio group.\n   */\n  @State() selectedValue!: string;\n  /**\n   * The error message state.\n   */\n  @State() error: string = '';\n  /**\n   * This event is fired when the selected value changes.\n   */\n  @Event() nylasFormRadioChanged!: EventEmitter<{\n    value: string;\n    name: string;\n    label?: string;\n  }>;\n\n  @Watch('defaultSelectedValue')\n  handleDefaultSelectedValueChange(newValue: string) {\n    this.selectedValue = newValue;\n  }\n\n  @Watch('themeConfig')\n  themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n    if (newVal === oldVal) return;\n    this.applyThemeConfig(newVal);\n  }\n\n  applyThemeConfig(themeConfig?: ThemeConfig) {\n    if (themeConfig) {\n      for (const [key, value] of Object.entries(themeConfig)) {\n        this.el.style.setProperty(`${key}`, value);\n      }\n    }\n  }\n\n  // Lifecycle methods\n  connectedCallback() {\n    // Use queueMicrotask to defer theme application until after React has set props.\n    // This fixes the timing issue where connectedCallback fires before React sets themeConfig.\n    queueMicrotask(() => {\n      if (this.themeConfig) {\n        this.applyThemeConfig(this.themeConfig);\n        this.el.setAttribute('data-themed', '');\n      }\n    });\n  }\n\n  componentDidLoad() {\n    this.selectedValue = this.defaultSelectedValue;\n  }\n\n  // Event listeners\n  /**\n   * Listen for the bookingFormSubmitted event to validate the input value when the form is submitted.\n   */\n  @Listen('bookingFormSubmitted', { target: 'document' })\n  handleBookingFormSubmitted(event: CustomEvent) {\n    if (this.required && !this.selectedValue) {\n      this.error = this.errorMessage || `${this.label} is required.`;\n      return;\n    }\n    if (this.error) {\n      event.preventDefault();\n    }\n  }\n\n  componentWillLoad() {\n    this.el.setAttribute('component-type', this.componentType);\n  }\n\n  handleChange(value: string) {\n    this.error = '';\n    this.selectedValue = value;\n    this.nylasFormRadioChanged.emit({\n      value,\n      name: this.name,\n      label: this.label,\n    });\n  }\n\n  render() {\n    return (\n      <div class=\"radio-group\">\n        <slot name=\"label\">\n          {this.label && (\n            <p class={{ error: !!this.error }}>\n              <span class=\"label\">{this.label}</span>\n              {this.required && <span class=\"required\">*</span>}\n            </p>\n          )}\n        </slot>\n        {this.options.map(option => (\n          <label>\n            <div class=\"radio-option\">\n              <input\n                type=\"radio\"\n                disabled={this.readOnly}\n                readOnly={this.readOnly}\n                title={this.readOnly ? 'read-only field' : undefined}\n                name={this.name}\n                value={option.value}\n                checked={this.selectedValue === option.value}\n                onChange={() => this.handleChange(option.value)}\n              />\n              <p>\n                <span class=\"title\">{option.label}</span>\n                <span class=\"description\">{option.description}</span>\n              </p>\n            </div>\n          </label>\n        ))}\n        {this.error && <span class=\"error help-text\">{this.error}</span>}\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-1lKplrc1.js → p-BbQVpnV2.js}

@@ -1,8 +1,8 @@
 import { p as proxyCustomElement, H, e as createEvent, h, i as Host } from './p-Bht9ktsW.js';
 import { R as RegisterComponent } from './p-CwtW7XIp.js';
 import { a as debug, b as instance, e as error, s as sanitize } from './p-B5ZLsN-l.js';
-import { d as defineCustomElement$2 } from './p-BaI67hQ_.js';
-import { d as defineCustomElement$1 } from './p-Dary9zXr.js';
+import { d as defineCustomElement$2 } from './p-ao6VxuAL.js';
+import { d as defineCustomElement$1 } from './p-D3_U2Yis.js';
 
 const nylasPageStylingCss = ":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-page-styling{width:inherit;display:flex;flex-direction:column;margin:1rem;border-radius:var(--nylas-border-radius-2x);border:1px solid var(--nylas-base-200);text-align:left}.nylas-page-styling .hidden{display:none}.nylas-page-styling.no-border{border:none}.nylas-page-styling .header{padding:1rem;display:grid;grid-template-columns:1fr auto;border-bottom:1px solid var(--nylas-base-200)}.nylas-page-styling .header h3{border-radius:var(--nylas-border-radius-2x);margin:0;font-size:16px;font-weight:600;line-height:20px;color:var(--nylas-base-900);text-align:left}.nylas-page-styling .header p{margin:0.25rem 0 0 0;font-size:0.875rem;font-weight:400;line-height:20px;color:var(--nylas-base-600);text-align:left}.nylas-page-styling .header .drawer-toggle{display:flex;gap:24px;align-items:center}.nylas-page-styling .header .drawer-toggle .chevron{display:flex;align-self:center;cursor:pointer}.nylas-page-styling .header .drawer-toggle .chevron:hover,.nylas-page-styling .header .drawer-toggle .chevron:active{color:var(--nylas-primary)}.nylas-page-styling .header .drawer-toggle .chevron.open{transform:rotate(90deg)}.nylas-page-styling .header .drawer-toggle .chevron.closed{transform:rotate(270deg)}.nylas-page-styling .header .drawer-toggle .chevron.disabled{cursor:not-allowed;color:var(--nylas-base-300)}.nylas-page-styling .header .drawer-toggle .chevron.disabled:hover{color:var(--nylas-base-300)}.nylas-page-styling .nylas-page-styling__body{display:grid;grid-template-columns:1fr auto;background-color:var(--nylas-base-25);border-radius:0 0 var(--nylas-border-radius-2x)}@media screen and (max-width: 768px){.nylas-page-styling .nylas-page-styling__body{grid-template-columns:1fr}}.nylas-page-styling .nylas-page-styling__body .nylas-page-styling__section{padding:1rem;display:flex;flex-direction:column;gap:1rem;color:var(--nylas-base-800)}.nylas-page-styling .nylas-page-styling__body .nylas-page-styling__section.no-padding{padding:0}@media screen and (max-width: 768px){.nylas-page-styling .nylas-page-styling__body .nylas-page-styling__section{border:none}}.nylas-page-styling .nylas-page-styling__body .nylas-page-styling__section .nylas-page-styling__row{display:grid;grid-template-columns:1fr;align-items:center}.nylas-page-styling .nylas-page-styling__body .nylas-page-styling__section .nylas-page-styling__row label{display:flex;align-items:center}.nylas-page-styling .nylas-page-styling__body .nylas-page-styling__section .nylas-page-styling__row label span.required{color:var(--nylas-error, #cc4841)}.nylas-page-styling .nylas-page-styling__body .nylas-page-styling__section .nylas-page-styling__row label span.label-icon{margin-left:4px}.nylas-page-styling .nylas-page-styling__body .nylas-page-styling__section .nylas-page-styling__row label span.label-icon tooltip-component{display:flex}.nylas-page-styling .nylas-page-styling__body .nylas-page-styling__section .nylas-page-styling__row p{margin:0.25rem 0 0 0;font-size:16px;font-weight:500;line-height:24px;color:var(--nylas-base-900)}.nylas-page-styling .nylas-page-styling__body .nylas-page-styling__section .nylas-page-styling__row .subsection{display:flex;flex-direction:column;gap:1rem}.nylas-page-styling .nylas-page-styling__body .nylas-page-styling__section .nylas-page-styling__row .subsection.hide{display:none}.nylas-page-styling .nylas-page-styling__body .nylas-page-styling__section .nylas-page-styling__row .subsection h3{margin:0;font-size:16px;font-weight:600;line-height:20px;color:var(--nylas-base-900);text-align:left}.nylas-page-styling .nylas-page-styling__body .nylas-page-styling__section .nylas-page-styling__row .subsection .input-container,.nylas-page-styling .nylas-page-styling__body .nylas-page-styling__section .nylas-page-styling__row .subsection>*{display:flex;flex-direction:column;column-gap:2rem;row-gap:0.25rem;width:100%;flex:1}.nylas-page-styling .nylas-page-styling__body .nylas-page-styling__section .nylas-page-styling__row .subsection .input-container textarea,.nylas-page-styling .nylas-page-styling__body .nylas-page-styling__section .nylas-page-styling__row .subsection>* textarea{padding:12px 16px;border-width:1;resize:vertical;border-radius:8px;font-family:var(--nylas-font-family);font-size:16px;line-height:24px;border:1px solid var(--nylas-base-200)}.nylas-page-styling .nylas-page-styling__body span.error-message{color:var(--nylas-error)}.nylas-page-styling .nylas-page-styling__body span.help-text{margin:0.25rem 0 0 0;font-size:0.875rem;font-weight:400;line-height:20px;color:var(--nylas-base-600);text-align:left}";
 
@@ -267,7 +267,7 @@ const NylasPageStyling = proxyCustomElement(class NylasPageStyling extends H {
         this.isOpen = !this.isOpen;
     }
     render() {
-        return (h(Host, { key: '5fe58b0d5af82d13e3d3cfb5c94be800f0107e04' }, h("div", { key: '2570374b689f3af5b9349398b8273fc746d56181', part: "nps", class: { 'nylas-page-styling': true, 'no-border': !this.customInputsSlot } }, this.customInputsSlot ? (h("div", { class: "header", part: "nps__header" }, h("div", null, h("h3", null, instance.t('nylasPageStyling.headerTitle'))), h("div", { class: "drawer-toggle", part: "nps__drawer-toggle--container" }, h("span", { class: `chevron ${this.isOpen ? 'open' : 'closed'} `, onClick: () => this.toggleConfirmationEmail() }, h("chevron-icon", { width: "24", height: "24" }))))) : null, h("div", { key: '86028eab5f475c84e4cb1a3d9e55b89919e82d71', class: "hidden" }, h("input-color-picker", { key: '7b44573975cd8a4c3dca8cb986018182e9feaa67', name: "color-picker" })), h("div", { key: 'db609e38c9ba6c9d875b0e4b307929bb47aa5764', id: "nylas-page-styling__body", class: "nylas-page-styling__body", part: "nps__body" }, h("div", { key: '2626d205ffbd3bbd102ddaf89bcc3c7e63fbbd48', class: { 'nylas-page-styling__section': true, 'no-padding': !this.customInputsSlot } }, h("div", { key: 'b1af403da3757280140feb06f75019aec9baf813', class: "nylas-page-styling__row" }, h("div", { key: 'd869a3dca1263b8958a42d6309eadc591cf3f932', class: { subsection: true, hide: !this.isOpen } })))))));
+        return (h(Host, { key: '74e8fa3d5ee64ed7031df67c4b84a0ed0676a911' }, h("div", { key: '137d429a8c4269035f6dcdf7ce578e47b2df24c7', part: "nps", class: { 'nylas-page-styling': true, 'no-border': !this.customInputsSlot } }, this.customInputsSlot ? (h("div", { class: "header", part: "nps__header" }, h("div", null, h("h3", null, instance.t('nylasPageStyling.headerTitle'))), h("div", { class: "drawer-toggle", part: "nps__drawer-toggle--container" }, h("span", { class: `chevron ${this.isOpen ? 'open' : 'closed'} `, onClick: () => this.toggleConfirmationEmail() }, h("chevron-icon", { width: "24", height: "24" }))))) : null, h("div", { key: 'b361edd1ae385818a1142d2a57a8c8c2a61c6180', class: "hidden" }, h("input-color-picker", { key: '3ef9744400f62d7f2e073f25b8b0311d3173a080', name: "color-picker" })), h("div", { key: '22bfb6686af60b5ea4eb73f564c38a4d7715a3ba', id: "nylas-page-styling__body", class: "nylas-page-styling__body", part: "nps__body" }, h("div", { key: '8ef8aef50e03294aa4ec60b611065275f6a80d6c', class: { 'nylas-page-styling__section': true, 'no-padding': !this.customInputsSlot } }, h("div", { key: '223950aaf492c1b902419fecebe8edf492cf40ea', class: "nylas-page-styling__row" }, h("div", { key: '73bfb9af0ba2e5fa8eb20de81f6536f71b7c1d25', class: { subsection: true, hide: !this.isOpen } })))))));
     }
     static get formAssociated() { return true; }
     get host() { return this; }
@@ -340,6 +340,6 @@ function defineCustomElement() {
 }
 
 export { NylasPageStyling as N, defineCustomElement as d };
-//# sourceMappingURL=p-1lKplrc1.js.map
+//# sourceMappingURL=p-BbQVpnV2.js.map
 
-//# sourceMappingURL=p-1lKplrc1.js.map
+//# sourceMappingURL=p-BbQVpnV2.js.map